/* PB Mentorias — estilo único do site. Coluna única pensada para celular. */
:root{
  --bg:#F8F3EA;
  --surface:#FFFFFF;
  --ink:#2A241E;
  --muted:#625245;
  --accent:#9A483F;
  --sand:#D9C7A4;
  --line:#E3D6BF;
  --deep:#33251E;
  --deep-ink:#F6EEDF;
  --deep-muted:#D3C5AE;
  --wa:#1B7F45;
  --serif:'Cormorant Garamond', Georgia, 'Times New Roman', serif;
  --sans:'Jost', system-ui, -apple-system, 'Segoe UI', sans-serif;
  color-scheme:light;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{margin:0; background:var(--bg); color:var(--ink); font-family:var(--sans); font-size:16px; line-height:1.6; padding-bottom:88px}
img{display:block; max-width:100%; height:auto}
a{color:inherit}
h1,h2,h3{font-family:var(--serif); font-weight:600; margin:0; line-height:1.1; text-wrap:balance; letter-spacing:.005em}
p{margin:0}
:focus-visible{outline:3px solid var(--accent); outline-offset:3px; border-radius:6px}
.wrap{max-width:560px; margin-inline:auto; padding-inline:20px}

/* marcador de informação que falta */
.tbd{background:#F3E4B5; color:#4A3A12; padding:1px 7px; border-radius:6px; border:1px dashed #A98B3E; font-size:.92em}

/* topo */
.top{position:sticky; top:0; z-index:20; background:var(--bg); border-bottom:1px solid var(--line)}
.top .wrap{display:flex; align-items:center; justify-content:space-between; min-height:64px}
.brand{font-family:var(--serif); font-size:25px; font-weight:600; text-decoration:none; line-height:1}
.brand small{display:block; font-family:var(--sans); font-size:10.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); font-weight:400; margin-top:4px}
.menu summary{list-style:none; cursor:pointer; padding:10px 16px; border:1.5px solid var(--ink); border-radius:10px; font-weight:500; font-size:13px; letter-spacing:.08em; text-transform:uppercase}
.menu summary::-webkit-details-marker{display:none}
.menu nav{position:absolute; left:0; right:0; top:100%; background:var(--bg); border-bottom:1px solid var(--line); padding:6px max(20px, calc(50% - 260px)) 18px; display:grid; box-shadow:0 18px 24px -18px rgba(51,37,30,.35)}
.menu nav a{padding:14px 0; border-bottom:1px solid var(--line); text-decoration:none; font-size:18px}
.menu nav a:last-child{border-bottom:0}

/* botões */
.btn{display:flex; align-items:center; justify-content:center; gap:8px; min-height:52px; padding:12px 22px; border-radius:12px; background:var(--deep); color:var(--deep-ink); font-weight:600; font-size:14px; letter-spacing:.06em; text-transform:uppercase; text-decoration:none; text-align:center; line-height:1.25; border:0}
.btn.wa{background:var(--wa); color:#fff}
.btn.ghost{background:transparent; color:var(--ink); border:1.5px solid var(--ink)}
.btn.sand{background:var(--sand); color:var(--deep)}
.actions{display:grid; gap:10px}

/* hero */
.hero{padding-block:26px 8px; display:grid; gap:18px}
.eyebrow{font-size:12px; letter-spacing:.14em; text-transform:uppercase; font-weight:500; color:var(--accent)}
.hero h1{font-size:clamp(35px, 10.5vw, 46px)}
.lead{font-size:17px; color:var(--muted)}
.hero img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:20px}

/* seções */
.sec{padding-top:44px}
.sec-head{display:grid; gap:6px; margin-bottom:18px}
.sec-head h2{font-size:31px}
.sec-head p{color:var(--muted); font-size:15.5px}

/* cards premium */
.premium{display:grid; gap:14px}
.pcard{display:block; text-decoration:none; border-radius:20px; overflow:hidden}
.pcard.deep{background:var(--deep); color:var(--deep-ink)}
.pcard.line{background:var(--surface); border:1.5px solid var(--line)}
.pcard img{width:100%; aspect-ratio:16/10; object-fit:cover}
.pcard .body{padding:20px; display:grid; gap:10px}
.pcard h3{font-size:34px}
.pcard .sub{font-size:12px; letter-spacing:.12em; text-transform:uppercase; opacity:.8}
.pcard p{font-size:15.5px; opacity:.92}
.more{font-weight:600; font-size:13.5px; letter-spacing:.07em; text-transform:uppercase}
.more::after{content:" →"}
.tag{display:inline-block; font-size:11px; letter-spacing:.1em; text-transform:uppercase; padding:3px 10px; border-radius:99px; border:1px solid currentColor; font-weight:500; color:var(--accent); justify-self:start}
.pcard.deep .tag{color:var(--sand)}

/* lista de mentorias */
.list{border-top:1px solid var(--line)}
.row{display:grid; grid-template-columns:minmax(0,1fr) auto; gap:2px 14px; align-items:center; padding:18px 0; border-bottom:1px solid var(--line); text-decoration:none}
.row h3{font-size:27px}
.row p{grid-column:1; font-size:15px; color:var(--muted)}
.row .go{grid-row:1 / span 2; grid-column:2; width:44px; height:44px; border-radius:50%; background:var(--deep); color:var(--deep-ink); display:grid; place-items:center; font-size:18px}

/* depoimentos */
.quotes{display:grid; gap:14px}
.quote{margin:0; background:var(--surface); border:1px solid var(--line); border-radius:18px; padding:22px 20px; display:grid; gap:14px}
.quote blockquote{margin:0; font-family:var(--serif); font-style:italic; font-weight:500; font-size:20px; line-height:1.38}
.quote figcaption{font-size:13.5px; color:var(--muted); letter-spacing:.04em}

/* dúvidas */
details.faq{border-bottom:1px solid var(--line)}
.faqs{border-top:1px solid var(--line)}
details.faq summary{list-style:none; cursor:pointer; padding:18px 0; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px; align-items:center; font-weight:500; font-size:17px; line-height:1.35}
details.faq summary::-webkit-details-marker{display:none}
details.faq summary::after{content:"+"; font-size:26px; line-height:1; color:var(--accent); font-weight:400}
details.faq[open] summary::after{content:"–"}
details.faq p{padding:0 0 18px; color:var(--muted); font-size:16px}

/* sobre (teaser) */
.about{display:grid; gap:16px}
.about img{width:100%; aspect-ratio:4/5; object-fit:cover; border-radius:20px}
.about p{color:var(--muted)}
.about h2{font-size:34px}

/* artigos */
.articles{display:grid; gap:12px}
.acard{display:grid; gap:8px; padding:20px; background:var(--surface); border:1px solid var(--line); border-radius:18px; text-decoration:none}
.acard h3{font-size:25px; line-height:1.15}
.acard p{color:var(--muted); font-size:15px}

/* chamada final */
.final{margin-top:44px; padding:26px 20px; background:var(--sand); border-radius:20px; display:grid; gap:14px}
.final h2{font-size:30px}
.final p{color:var(--deep)}

/* páginas internas */
.crumb{padding-block:18px 4px; font-size:14px}
.crumb a{text-decoration:none; color:var(--muted); letter-spacing:.04em}
.page-head{display:grid; gap:14px; padding-block:12px 4px}
.page-head h1{font-size:clamp(38px, 11vw, 50px)}
.page-head .full{font-family:var(--serif); font-size:22px; color:var(--muted); font-style:italic; margin-top:-6px}
.page-img{width:100%; border-radius:20px; margin-top:20px}
.page-img.wide{aspect-ratio:16/10; object-fit:cover}
.page-img.tall{aspect-ratio:4/5; object-fit:cover}
.block{padding-top:34px; display:grid; gap:10px}
.block h2{font-size:29px}
.block p, .block li{color:var(--muted)}
.block ul{margin:0; padding-left:20px; display:grid; gap:6px}
.info{background:var(--surface); border:1px solid var(--line); border-radius:16px; padding:16px 18px; display:grid; gap:4px}
.info b{font-weight:600; color:var(--ink)}
.article-body{display:grid; gap:14px; padding-top:26px}
.article-body p{color:var(--muted); font-size:17px}
.byline{font-size:14px; color:var(--muted); letter-spacing:.04em}

/* rodapé */
footer{margin-top:44px; background:var(--deep); color:var(--deep-ink); padding-block:30px 36px}
footer .wrap{display:grid; gap:16px}
footer h2{font-size:30px}
footer .small{font-size:14.5px; color:var(--deep-muted)}
footer .contact{display:grid; gap:2px; font-size:16px}
footer .contact span{font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--deep-muted)}
footer a{text-decoration-thickness:1px; text-underline-offset:3px}

/* botão flutuante de WhatsApp */
.wa-float{position:fixed; right:16px; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); z-index:30; display:flex; align-items:center; gap:9px; min-height:54px; padding:0 20px 0 16px; border-radius:99px; background:var(--wa); color:#fff; text-decoration:none; font-weight:600; font-size:15px; box-shadow:0 10px 24px -8px rgba(0,0,0,.45)}
.wa-float svg{width:25px; height:25px; flex-shrink:0}

@media (prefers-reduced-motion: no-preference){
  .btn, .row .go, .wa-float{transition:transform .15s ease}
  .btn:active, .wa-float:active{transform:scale(.97)}
}

/* ===== novos blocos (celular primeiro) ===== */
.nav-desktop{display:none}
.hero-text{display:contents}
.hero img{order:3}
.hero .actions{order:4}
.about-text{display:grid; gap:16px}
.social{display:grid; gap:10px}
.foot{display:grid; gap:24px}
.foot h3{font-size:26px}
.foot ul{list-style:none; margin:0; padding:0; display:grid; gap:8px}
.foot .col{display:grid; gap:8px; align-content:start}

/* ===== computador ===== */
@media (min-width:900px){
  body{padding-bottom:0}
  .wrap{max-width:1120px; padding-inline:40px}
  .top .wrap{min-height:78px}
  .menu{display:none}
  .nav-desktop{display:flex; align-items:center; gap:30px}
  .nav-desktop a{text-decoration:none; font-size:15px; letter-spacing:.04em}
  .nav-desktop a:not(.btn):hover{color:var(--accent)}
  .nav-desktop .btn{min-height:44px; padding:8px 20px; font-size:13px; color:#fff}
  .btn{padding-inline:28px}
  .actions{display:flex; flex-wrap:wrap; gap:12px}
  .actions .btn{width:auto}

  .hero{grid-template-columns:1.05fr .95fr; gap:64px; align-items:center; padding-block:64px 24px}
  .hero-text{display:grid; gap:20px; align-content:center}
  .hero img{order:0; aspect-ratio:4/5; max-height:620px; width:100%}
  .hero .actions{order:0}
  .hero h1{font-size:64px}
  .lead{font-size:19px; max-width:520px}

  .sec{padding-top:88px}
  .sec-head{margin-bottom:30px; max-width:640px}
  .sec-head h2{font-size:46px}
  .sec-head p{font-size:17px}

  .premium{grid-template-columns:1.15fr .85fr; gap:24px}
  .pcard{display:grid; grid-template-rows:auto 1fr}
  .pcard img{aspect-ratio:16/9}
  .pcard .body{padding:28px}
  .pcard h3{font-size:42px}

  .list{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; border-top:0}
  .row{grid-template-columns:minmax(0,1fr) auto; padding:26px; background:var(--surface); border:1px solid var(--line); border-radius:18px; align-content:start}
  .row:hover{border-color:var(--accent)}

  .quotes{grid-template-columns:1fr 1fr; gap:22px}
  .quote{padding:32px 30px}
  .quote blockquote{font-size:24px}

  .faqs{max-width:820px}

  .about{grid-template-columns:.8fr 1.2fr; gap:64px; align-items:center}
  .about img{max-height:560px}
  .about h2{font-size:46px}
  .about p{font-size:18px}

  .articles{grid-template-columns:repeat(3,1fr); gap:20px}
  .acard{padding:26px; align-content:start}
  .acard:hover{border-color:var(--accent)}

  .final{margin-top:88px; padding:56px; grid-template-columns:1fr auto; align-items:center; gap:30px}
  .final h2{font-size:42px}
  .final .actions{justify-content:flex-end}

  .social{grid-template-columns:repeat(3,1fr); gap:16px}

  .foot{grid-template-columns:1.2fr 1fr 1fr; gap:48px}
  footer{margin-top:88px; padding-block:56px}

  .inner > *{max-width:760px; margin-inline:auto}
  .page-head h1{font-size:60px}
  .block h2{font-size:34px}
  .article-body p{font-size:18px}
  .wa-float{right:28px; bottom:28px}
}