body{
 margin:0;
 padding:0;
 background:#000;
 color:#fff;
 font-family:Arial,sans-serif;
 padding-top:55px;
}

/* ===== HEADER FIXO ===== */
.header{
 position:fixed;
 top:0;
 left:0;
 width:100%;
 height:auto;
 background:#000;
 border-bottom:1px solid #000;
 display:flex;
 align-items:center;
 justify-content:center;
 gap:18px;
 flex-wrap:wrap;
 padding:5px 0;
 z-index:999;
}
.header a{
 color:#fff;
 text-decoration:none;
 font-size:14px;
 padding:3px 6px;
 border:1px solid #333;
 border-radius:5px;
 background:#111;
 transition:.2s;
}
.header a:hover{
 background:#222;
 border-color:#555;
 color:orange;
}
.h-w{display:flex;align-items:center;gap:6px}

/* ===== TEXTOS ===== */
.section-title{
 margin:0;
 color:orange;
 font-size:160%;
 font-style:italic;
 text-align:center;
}
.section-sub{
 margin:4px 0 0;
 font-size:105%;
}
.section-text{
 margin:10px auto 20px;
 max-width:360px;
 font-size:108%;
 line-height:1.42;
 text-align:center;
}

.section-text span{
 display:inline-block;
 margin-top:10px;
 color:orange;
 font-style:italic;
}

/* ===== IMAGENS ===== */
img[alt="Logo"]{
 height:70px;
 width:auto;
 border-radius:50%;
 margin-bottom:10px;
}
img{
 border:2px solid #003500;
 box-shadow:0 2px 6px rgba(0,0,0,.25);
 border-radius:10px;
 transition:transform .25s ease, filter .25s ease, border-color .25s ease;
}
img:hover{
 transform:scale(1.03);
 filter:contrast(1.05);
 border-color:#009000;
}

/* ===== CARDS ===== */
.card{
 background:#003500;
 width:100%;
 max-width:350px;
 margin:18px auto;
 padding:12px;
 border-radius:10px;
 border:1px solid #222;
 display:block;
 text-decoration:none;
 color:#fff;
 font-family:Arial,sans-serif;
 text-align:center
}

.card-img{
 width:100%;
 height:auto;
 display:block;
 margin:0 auto 10px;
 border-radius:10px;
}

.card-title{
 color:orange;
 font-size:125%;
 text-align:center;
}

.card-desc{
 color:#ddd;
 font-size:88%;
 margin-top:4px;
 cursor:pointer;
 margin-left:10px;
 margin-right:10px;
 text-align:justify;
}

.card{display:block}
#box-categorias{width:100%}
.cats{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:6px;          /* menos espaço entre botões */
 padding:6px;      /* menos respiro no card */
 box-sizing:border-box
}

.cat-btn{
 display:flex;
 align-items:center;
 justify-content:center;
 height:38px;      /* botão mais baixo */
 padding:0 4px;    /* lateral bem enxuta */
 border:1px solid #ccc;
 border-radius:3px;
 text-decoration:none;
 font-size:13px;
 white-space:nowrap;
 overflow:hidden;
 text-overflow:ellipsis
}


/* HERO */
.hero{text-align:center;margin-top:20px;}

/* LINKS PADRÃO DOS CARDS */
a:link,
a:visited{color:#fff;text-decoration:none;}

.card a{color:#fff !important;text-decoration:none !important;}


/* PANORAMA (sem impacto no layout) */
.pano-box{
 width:100%;
 max-width:390px;
 aspect-ratio:1/1;
 overflow:hidden;
 position:relative;
 margin:auto;
 display:block;
}
.pano-img{
 position:absolute;
 top:0;
 left:0;
 height:100%;
}
