
:root{
  --black:#050505;--black2:#0b0b0d;--panel:#101012;--panel2:#18181a;
  --gold:#d2a529;--gold2:#f2cc65;--white:#f5f2eb;--muted:#c8c3b7;
  --line:rgba(210,165,41,.42);--shadow:0 18px 50px rgba(0,0,0,.46)
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:radial-gradient(circle at 20% 0,#1b1407 0,#09090a 25%,#050505 72%);color:var(--white);font-family:Arial,Helvetica,sans-serif;line-height:1.55}
a{color:inherit}
.container{width:min(1320px,92%);margin:auto}
.topbar{position:sticky;top:0;z-index:50;background:rgba(3,3,3,.96);border-bottom:2px solid var(--gold);backdrop-filter:blur(10px)}
.nav{min-height:88px;display:flex;align-items:center;gap:28px}
.brand{display:flex;align-items:center;gap:14px;text-decoration:none;min-width:365px}
.brand img{width:50px;height:68px;object-fit:contain}
.brand strong{display:block;color:var(--gold2);font-family:Georgia,serif;font-size:1.35rem;letter-spacing:.04em}
.brand small{color:#fff}
.menu{display:flex;align-items:center;gap:24px;margin-left:auto;font-size:.85rem}
.menu a{text-decoration:none;text-transform:uppercase}
.menu a:hover,.menu a.active{color:var(--gold2)}
.flags{display:flex;gap:10px;margin-left:10px}
.flags a{text-decoration:none;font-size:1.25rem}
.hero-home{padding:84px 0 55px;text-align:center}
.hero-home img{width:min(235px,55vw);aspect-ratio:1;object-fit:contain;border-radius:50%;box-shadow:0 0 0 1px var(--line),0 30px 70px #000}
.kicker{color:var(--gold2);letter-spacing:.2em;text-transform:uppercase;font-size:.78rem;margin-top:26px}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif}
.hero-home h1,.book-copy h1{color:var(--gold2);font-size:clamp(2.3rem,5vw,4.6rem);line-height:1.03;margin:.25rem 0}
.subtitle{font-family:Georgia,serif;font-size:clamp(1.1rem,2vw,1.5rem)}
.intro{max-width:820px;margin:18px auto;color:var(--muted)}
.language-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;padding:20px 0 56px}
.language-card,.library-card{display:flex;align-items:center;justify-content:center;gap:14px;min-height:90px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(#18181a,#0a0a0b);text-decoration:none;box-shadow:var(--shadow);transition:.2s}
.language-card:hover,.library-card:hover,.btn:hover,.chapter-card:hover{transform:translateY(-3px);border-color:var(--gold2)}
.flag{font-size:2rem}
.section-title{text-align:center;color:var(--gold2);font-size:2rem;margin:0 0 24px}
.home-section{padding:40px 0}
.library-card{width:min(650px,100%);margin:auto;padding:22px}
.book-hero{display:grid;grid-template-columns:minmax(310px,420px) 1fr 300px;gap:34px;align-items:center;padding:45px 0 28px}
.cover-frame{height:530px;overflow:hidden;border-radius:18px;border:1px solid var(--line);box-shadow:var(--shadow);position:relative;background:#111}
.cover-frame img{width:100%;height:100%;object-fit:cover;object-position:center;transform:scale(1.05)}
.cover-frame:after{content:"PRÉVIA PARCIAL";position:absolute;bottom:16px;left:16px;background:rgba(0,0,0,.72);color:var(--gold2);padding:7px 10px;border:1px solid var(--line);font-size:.74rem;letter-spacing:.12em}
.book-copy .language-label{color:var(--gold2);text-transform:uppercase;font-weight:bold}
.book-copy p{color:#e7e2d9}
.action-panel{display:grid;gap:12px}
.btn{display:flex;align-items:center;gap:14px;padding:15px 18px;border:1px solid var(--gold);border-radius:12px;text-decoration:none;background:linear-gradient(#171719,#0b0b0c);transition:.2s}
.btn strong{color:var(--gold2);display:block}
.btn small{color:var(--muted);display:block}
.availability{padding:16px;border:1px solid var(--gold);border-radius:12px;background:#101011}
.availability h3{color:var(--gold2);margin:0 0 10px;font-size:1rem}
.availability div{margin:7px 0}
.chapters-section{padding:18px 0 58px}
.chapters-heading{color:var(--gold2);border-bottom:1px solid var(--gold);padding-bottom:8px}
.chapter-list{display:grid;gap:12px}
.chapter-card{display:grid;grid-template-columns:64px 1fr auto;gap:18px;align-items:center;padding:16px 18px;border:1px solid rgba(255,255,255,.13);border-left:3px solid var(--gold);background:linear-gradient(90deg,#161618,#0d0d0f);transition:.2s}
.chapter-number{font-family:Georgia,serif;font-size:1.2rem;color:var(--gold2);text-align:center}
.chapter-title{font-weight:bold;letter-spacing:.02em}
.chapter-desc{color:var(--muted);font-size:.92rem;margin-top:4px}
.chapter-actions{display:flex;gap:8px}
.mini-btn{padding:9px 11px;border:1px solid var(--line);border-radius:8px;text-decoration:none;white-space:nowrap}
.mini-btn:hover{border-color:var(--gold2);color:var(--gold2)}
.reader{padding:30px 0 55px}
.reader-toolbar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;align-items:center;margin-bottom:15px}
.pdf-frame{width:100%;height:calc(100vh - 190px);min-height:720px;border:1px solid var(--line);border-radius:12px;background:#222}
.site-footer{border-top:1px solid var(--gold);padding:36px 0 22px;background:#030303}
.footer-grid{display:grid;grid-template-columns:1.15fr 1fr 1fr 1fr;gap:30px}
.footer-title{color:var(--gold2);font-size:1.1rem;margin:0 0 13px;letter-spacing:.1em;text-transform:uppercase}
.footer-links{display:grid;gap:8px}
.footer-links a{text-decoration:none}
.footer-links a:hover{color:var(--gold2)}
.qr{width:118px;background:white;padding:6px;border-radius:8px}
.footer-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;margin-top:26px;padding-top:18px;border-top:1px solid rgba(255,255,255,.12);color:var(--muted);font-size:.88rem}
.counter strong{color:var(--gold2)}
.content-page{padding:55px 0}
.content-page h1{color:var(--gold2);font-size:clamp(2.2rem,5vw,4rem)}
.content-box{max-width:900px;background:#101012;border:1px solid var(--line);padding:28px;border-radius:16px}
.placeholder{padding:80px 0;text-align:center}
@media(max-width:1050px){
  .menu{display:none}.brand{min-width:0}.book-hero{grid-template-columns:320px 1fr}.action-panel{grid-column:1/-1;grid-template-columns:repeat(3,1fr)}
  .footer-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:760px){
  .nav{min-height:74px}.brand strong{font-size:1rem}.brand small{display:none}.brand img{height:54px;width:40px}.flags{margin-left:auto}
  .language-grid{grid-template-columns:1fr 1fr}.book-hero{grid-template-columns:1fr}.cover-frame{height:420px}.action-panel{grid-template-columns:1fr}
  .chapter-card{grid-template-columns:42px 1fr}.chapter-actions{grid-column:1/-1;padding-left:60px}
  .footer-grid{grid-template-columns:1fr;text-align:center}.qr{margin:auto}.footer-meta{justify-content:center;text-align:center}
}
@media(max-width:480px){.language-grid{grid-template-columns:1fr}.flags{display:none}.chapter-actions{padding-left:0;display:grid;grid-template-columns:1fr 1fr}}

/* Menu universal com ícones — atualização 2026-07-29 */
.menu .menu-icon,
.nav .menu-icon{
  font-size:1.18rem;
  line-height:1;
  min-width:30px;
  text-align:center;
  padding-left:8px;
  padding-right:8px;
}
.menu .purchase-link,
.nav .purchase-link{
  border:1px solid rgba(216,178,92,.72);
  border-radius:8px;
  box-shadow:0 0 0 rgba(216,178,92,0);
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease;
}
.menu .purchase-link:hover,
.menu .purchase-link:focus-visible,
.nav .purchase-link:hover,
.nav .purchase-link:focus-visible{
  background:rgba(216,178,92,.12);
  box-shadow:0 0 12px rgba(216,178,92,.28);
  transform:translateY(-1px);
}
@media (max-width:900px){
  .menu .menu-icon,.nav .menu-icon{font-size:1.1rem;min-width:28px}
}


/* Correção do menu responsivo para celulares — 2026-07-29 */
@media (max-width:1050px){
  .nav{
    min-height:auto;
    flex-wrap:wrap;
    gap:10px 12px;
    padding-top:10px;
    padding-bottom:12px;
  }
  .brand{
    min-width:0;
    flex:1 1 calc(100% - 50px);
  }
  .menu{
    display:flex;
    width:100%;
    order:3;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    gap:8px 10px;
    padding-top:8px;
    border-top:1px solid rgba(75,64,38,.65);
  }
  .menu > a{
    flex:0 0 auto;
  }
  .flags{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:7px;
    margin-left:0;
  }
}
@media (max-width:540px){
  .container{width:min(96%,1180px)}
  .nav{gap:8px}
  .menu{gap:7px 8px}
  .menu a{font-size:11px;letter-spacing:.6px}
  .menu .menu-icon{font-size:1.18rem;min-width:30px;padding:6px}
  .flags{display:flex;width:100%;order:4;margin-top:2px}
  .flags a{font-size:20px}
}
