*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#f5efe6;color:#4a1420;font-family:"Palatino Linotype",Palatino,"Book Antiqua","Iowan Old Style",Georgia,serif;overflow-x:hidden}
img{display:block;max-width:100%}
h1,h2,h3,p{margin:0}
a{color:inherit}

.topo{position:absolute;top:0;left:0;right:0;z-index:5;height:46px;display:flex;align-items:center;padding:0 60px;max-width:1536px;margin:0 auto;background:linear-gradient(90deg,#f5efe6 0,#f5efe6 772px,rgba(245,239,230,0) 773px)}
.topo .marca{font-size:26px;letter-spacing:2px;text-decoration:none;color:#3b0f18;padding-right:38px;border-right:1px solid #b9a58a;line-height:30px}
.menu{display:flex;gap:0;margin-left:16px}
.menu a{text-decoration:none;font-size:17px;color:#3b0f18;padding:10px 24px;line-height:22px}
.menu a.ativo{color:#7a1626;border-bottom:2px solid #7a1626}

.hero{position:relative;max-width:1536px;margin:0 auto;height:363px;overflow:hidden;background:linear-gradient(90deg,#f5efe6 0,#efe5d8 45%,#e9dccb 100%)}
.hero-foto{position:absolute;top:0;right:0;width:846px;height:363px;object-fit:cover}
.hero-texto{position:relative;z-index:2;padding:70px 0 0 62px;max-width:640px}
.sobre{font-size:15px;line-height:18px;letter-spacing:5px;color:#3b0f18;margin-left:3px}
.hero h1{font-size:56px;line-height:56px;font-weight:700;color:#3b0f18;margin-top:14px;letter-spacing:-1px;max-width:570px}
.sub{font-size:17px;line-height:23px;color:#3b2a28;margin-top:12px;max-width:400px}
.botao{display:inline-flex;align-items:center;gap:22px;margin-top:16px;background:linear-gradient(180deg,#8a1c2c,#5e0f1b);color:#fff;text-decoration:none;font-size:20px;line-height:26px;padding:10px 20px 10px 26px;border-radius:5px;box-shadow:0 3px 8px rgba(60,10,20,.25)}
.botao.claro{background:linear-gradient(180deg,#fbf6ec,#ece0cb);color:#3b0f18;font-weight:600}

.percurso{max-width:1536px;margin:0 auto;padding:24px 37px 22px 38px;background:#f6f0e7}
.percurso h2{display:flex;align-items:center;gap:26px;font-size:46px;line-height:52px;font-weight:700;color:#3b0f18;margin-left:23px;letter-spacing:-1px}
.percurso h2::after{content:"";flex:1;height:1px;background:#b89a62;margin-right:7px}
.cartoes{list-style:none;margin:58px 0 0;padding:0;display:grid;grid-template-columns:292fr 275fr 281fr 280fr 288fr;gap:10px;position:relative}
.cartoes::before{content:"";position:absolute;left:12%;right:10%;top:-21px;height:2px;background:#c3a46a}
.cartao{position:relative;background:#faf6ef;border:1px solid #e3d8c6;border-radius:6px;box-shadow:0 2px 6px rgba(60,30,20,.08)}
.cartao img{width:100%;height:247px;object-fit:cover;border-radius:6px 6px 0 0}
.num{position:absolute;top:-46px;left:50%;transform:translateX(-50%);z-index:2;width:50px;height:50px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 35% 30%,#e8cf91,#b8924c 70%);color:#3b0f18;font-size:22px;box-shadow:0 2px 4px rgba(60,30,10,.3)}
.cartao:nth-child(1) .num{left:48%}
.rotulo{padding:14px 10px 10px 30px;min-height:94px}
.rotulo h3{font-size:27px;line-height:30px;font-weight:700;color:#3b0f18;letter-spacing:-.6px}
.rotulo p{font-style:italic;font-size:20px;line-height:24px;color:#4b3a36;margin-top:6px;margin-left:3px}
.cartao:nth-child(3) .rotulo{padding-left:22px;padding-right:6px}
.cartao:nth-child(3) .rotulo h3{white-space:nowrap;font-size:26px;letter-spacing:-.8px}
.cartao:nth-child(5) .rotulo{padding-left:26px}

.comunidade{position:relative;max-width:1536px;margin:0 auto;height:101px;display:flex;align-items:center;padding:0 40px 0 382px;background:linear-gradient(90deg,#4e0f1a,#6a1424 50%,#5a1020);color:#fff}
.livros{position:absolute;left:0;top:1px;width:330px;height:98px;object-fit:cover;-webkit-mask-image:linear-gradient(90deg,#000 80%,transparent);mask-image:linear-gradient(90deg,#000 80%,transparent)}
.comunidade h2{font-size:46px;font-weight:400;white-space:nowrap;padding-right:38px;border-right:1px solid rgba(232,207,145,.7);line-height:40px}
.comunidade p{font-size:16px;line-height:21px;max-width:280px;margin-left:40px;color:#f2e6dc}
.comunidade .botao{margin:0 0 0 auto;font-size:21px;padding:10px 22px 10px 36px}

.rodape{max-width:1536px;margin:0 auto;height:61px;display:flex;align-items:center;gap:48px;padding:0 33px 0 50px;background:#4a0e18;color:#f3e9de;border-top:1px solid #8a5a4a}
.rodape .marca{font-size:23px;letter-spacing:3px;white-space:nowrap}
.rodape .linha{flex:1;height:1px;background:rgba(232,207,145,.55)}
.rodape .instituto{font-size:13px;letter-spacing:4.5px;white-space:nowrap}

@media (max-width:1180px){
  .hero-foto{width:62%}
  .hero h1{font-size:46px;line-height:48px;max-width:470px}
  .cartoes{grid-template-columns:repeat(3,1fr);row-gap:56px}
  .cartoes::before{display:none}
  .cartao:nth-child(3) .rotulo h3{white-space:normal}
  .comunidade{height:auto;flex-wrap:wrap;gap:16px;padding:24px 32px 24px 300px}
  .comunidade .botao{margin-left:0}
}
@media (max-width:900px){
  .comunidade>*{min-width:0;max-width:100%}
  .comunidade h2{white-space:normal}
  .comunidade p{margin-left:0}
  .rodape{height:auto;min-height:61px;gap:20px;padding:12px 24px}
  .rodape .marca{flex:none}
  .rodape .linha{min-width:24px}
  .rodape .instituto{min-width:0;font-size:12px;letter-spacing:2px;white-space:normal;text-align:right}
}
@media (max-width:760px){
  .topo{position:static;height:auto;flex-wrap:wrap;justify-content:center;padding:12px 16px 0;background:#f5efe6}
  .topo .marca{border:0;padding:0;font-size:22px}
  .menu{width:100%;justify-content:center;margin:6px 0 0}
  .menu a{padding:10px 12px;font-size:16px}
  .hero{height:auto;overflow:visible;background:#f5efe6;display:flex;flex-direction:column-reverse}
  .hero-foto{position:static;width:100%;height:auto;aspect-ratio:846/363}
  .hero-texto{padding:24px 20px 28px;max-width:none}
  .sobre{font-size:12px;letter-spacing:3px}
  .hero h1{font-size:36px;line-height:40px;max-width:none}
  .sub{font-size:16px}
  .botao{font-size:18px}
  .percurso{padding:28px 16px}
  .percurso h2{font-size:32px;line-height:38px;margin-left:0;gap:14px}
  .cartoes{grid-template-columns:1fr;row-gap:48px;margin-top:44px}
  .cartao img{height:auto;aspect-ratio:16/10}
  .rotulo{min-height:0;padding:14px 18px 18px!important}
  .rotulo h3,.cartao:nth-child(3) .rotulo h3{font-size:24px;white-space:normal}
  .rotulo p{font-size:18px}
  .comunidade{flex-direction:column;align-items:flex-start;padding:24px 20px 28px;gap:14px}
  .livros{position:static;width:100%;height:auto;aspect-ratio:330/98;-webkit-mask-image:none;mask-image:none;border-radius:4px}
  .comunidade h2{font-size:32px;white-space:normal;border:0;padding:0}
  .comunidade p{margin:0}
  .rodape{height:auto;flex-direction:column;gap:8px;padding:18px 16px;text-align:center}
  .rodape .linha{width:60%;flex:none}
  .rodape .instituto{font-size:11px;letter-spacing:2px;white-space:normal;text-align:center}
}