:root{

--preto:#000;
--principal:#ff3d00;
--principal-hover:#e53900;
--texto:#222;
--texto2:#666;
--fundo:#f5f5f5;
--branco:#fff;
--borda:#e5e5e5;

}

*{

margin:0;
padding:0;
box-sizing:border-box;

}

html{

scroll-behavior:smooth;
overflow-x:hidden;

}

body{

font-family:Arial,sans-serif;
background:var(--fundo);
color:var(--texto);
overflow-x:hidden;

}

img{

max-width:100%;
display:block;

}

a{

text-decoration:none;

}

/* ==========================
TOPO
========================== */

.topo{

background:#000;
padding:15px 25px;

display:grid;
grid-template-columns:auto 1fr 320px;

align-items:center;

gap:20px;

position:sticky;
top:0;
z-index:999;

box-shadow:0 2px 10px rgba(0,0,0,.2);

}

.logo img{

height:46px;

}

/* MENU */

.menu{

display:flex;

justify-content:center;
align-items:center;

gap:28px;

flex-wrap:wrap;

}

.menu a{

color:#fff;

font-size:18px;
font-weight:bold;

transition:.25s;

}

.menu a:hover{

color:var(--principal);

}

.menu .ativo{

color:var(--principal);

}

/* BUSCA */

.busca{

display:flex;

background:#fff;

border-radius:8px;

overflow:hidden;

}

.busca input{

width:100%;

padding:11px;

border:none;

outline:none;

font-size:15px;

}

.busca button{

border:none;

background:#222;

color:#fff;

padding:0 18px;

cursor:pointer;

transition:.2s;

}

.busca button:hover{

background:var(--principal);

}

/* ==========================
CONTAINER
========================== */

.container{

max-width:1100px;

margin:40px auto;

padding:0 20px;

}

.titulo{

text-align:center;

margin-bottom:35px;

}

.titulo h1{

font-size:38px;

margin-bottom:10px;

}

.titulo p{

max-width:700px;

margin:auto;

line-height:1.7;

color:var(--texto2);

font-size:17px;

}

.card{

background:#fff;

border-radius:16px;

padding:35px;

box-shadow:0 8px 25px rgba(0,0,0,.08);

border:1px solid var(--borda);

}
/* ==========================
SEÇÕES
========================== */

.secao{

margin-top:35px;

}

.secao:first-child{

margin-top:0;

}

.secao h2{

font-size:28px;

color:var(--principal);

margin-bottom:15px;

}

.secao p{

line-height:1.8;

font-size:17px;

color:var(--texto2);

margin-bottom:15px;

}

/* DESTAQUES */

.destaques{

display:grid;

grid-template-columns:repeat(3,1fr);

gap:20px;

margin-top:35px;

}

.item{

background:#fafafa;

border:1px solid var(--borda);

padding:22px;

border-radius:12px;

text-align:center;

}

.item strong{

display:block;

font-size:18px;

margin-bottom:8px;

}

.item span{

color:var(--texto2);

line-height:1.6;

}

/* AVISO */

.aviso{

margin-top:35px;

padding:18px;

border-left:5px solid var(--principal);

background:#fff4ef;

border-radius:8px;

line-height:1.8;

color:#555;

}

/* RODAPÉ */

footer{

margin-top:50px;

background:#000;

color:#fff;

text-align:center;

padding:25px;

font-size:14px;

}

/* RESPONSIVO */

@media(max-width:1000px){

.topo{

grid-template-columns:auto 1fr;

}

.busca{

grid-column:1/3;

}

}

@media(max-width:768px){

.topo{

display:flex;

flex-direction:column;

}

.menu{

justify-content:center;

gap:18px;

}

.menu a{

font-size:16px;

}

.busca{

width:100%;

}

.titulo h1{

font-size:30px;

}

.card{

padding:25px;

}

.destaques{

grid-template-columns:1fr;

}

}