/* ============================================
   E-BOOK INTERATIVO · GI TAVARES
   Assessoria Humanizada — versão web (vídeos inline)
   ============================================ */
:root{
  --teal-900:#06525F; --teal-700:#0A6B7A; --teal-500:#2F8A95;
  --teal-100:#DCE9EB; --teal-50:#EEF5F6;
  --bg:#FAF7F2; --bg-alt:#F2EDE5; --paper:#FFFFFF;
  --ink:#1A2B2D; --ink-soft:#4A5B5D; --ink-mute:#8A9799;
  --rule:#E2DCD2; --accent:#B89A6E;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font-family:'Inter',system-ui,sans-serif; line-height:1.7;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}

/* ===== container de leitura ===== */
.wrap{max-width:760px; margin:0 auto; padding:0 26px;}
.chapter{padding:64px 0 30px; border-bottom:1px solid var(--rule);}
.chapter:last-of-type{border-bottom:none;}
.chapter-head{margin-bottom:8px;}
.chapter-num{font-size:12px; letter-spacing:.3em; text-transform:uppercase; color:#fff; background:var(--teal-900); display:inline-block; padding:7px 16px; border-radius:50px; margin-bottom:20px;}

/* ===== tipografia ===== */
h1,h2,h3{font-family:'Cormorant Garamond',Georgia,serif; color:var(--teal-900); font-weight:500; margin:0; letter-spacing:-.01em;}
.eyebrow{font-size:12px; letter-spacing:.32em; text-transform:uppercase; color:var(--paper); background:var(--teal-900); display:inline-block; padding:7px 16px; border-radius:50px; margin-bottom:20px;}
.chapter-title{font-size:clamp(34px,6vw,54px); line-height:1.05; margin-bottom:26px;}
.chapter-title em{font-style:italic; color:var(--teal-700);}
.body{font-size:18px; line-height:1.78; color:var(--ink); margin:0 0 16px; text-align:left;}
.body.lead{font-size:21px; line-height:1.62; color:var(--ink-soft); font-family:'Cormorant Garamond',serif; font-style:italic;}
.body.lead.dropcap::first-letter{font-family:'Cormorant Garamond',serif; font-size:78px; line-height:.7; float:left; padding:10px 14px 0 0; color:var(--teal-700); font-weight:600; font-style:normal;}
strong{color:var(--teal-900); font-weight:600;}

.section-title{font-size:27px; color:var(--teal-900); margin:34px 0 14px; padding-left:18px; position:relative; font-family:'Cormorant Garamond',serif;}
.section-title::before{content:""; position:absolute; left:0; top:6px; bottom:6px; width:4px; border-radius:2px; background:linear-gradient(180deg,var(--teal-700),var(--teal-500));}

/* listas */
.bullet-list{list-style:none; padding:0; margin:18px 0 22px;}
.bullet-list li{padding:13px 0 13px 26px; border-bottom:1px solid var(--rule); position:relative; font-size:17px; line-height:1.55;}
.bullet-list li::before{content:""; position:absolute; left:0; top:20px; width:9px; height:9px; border:1.5px solid var(--teal-500); background:var(--teal-50); transform:rotate(45deg);}
.bullet-list.num{counter-reset:bl;}
.bullet-list.num li{counter-increment:bl; padding-left:46px;}
.bullet-list.num li::before{content:counter(bl,decimal-leading-zero); border:none; background:none; font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--teal-500); font-size:22px; top:11px; width:auto; height:auto; transform:none;}

/* blocos de destaque */
.gi-says{margin:30px 0; padding:30px 34px; background:linear-gradient(180deg,var(--paper),var(--teal-50)); border:1px solid var(--teal-100); border-left:5px solid var(--teal-700); border-radius:4px; box-shadow:0 8px 28px rgba(6,82,95,.08);}
.gi-says-label{font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--teal-700); font-weight:600; margin-bottom:12px;}
.gi-says-text{font-family:'Cormorant Garamond',serif; font-size:27px; font-style:italic; line-height:1.4; color:var(--teal-900);}
.callout-quote{margin:30px 0; padding:30px 36px; background:var(--teal-50); border-left:5px solid var(--teal-900); border-radius:4px; font-family:'Cormorant Garamond',serif; font-size:27px; font-style:italic; line-height:1.45; color:var(--teal-900);}
.callout-quote::before{content:"\201C"; font-size:58px; line-height:0; vertical-align:-18px; margin-right:6px; color:var(--teal-500);}
.pullquote-soft{margin:40px 0; padding:30px 10px; border-top:2px solid var(--teal-100); border-bottom:2px solid var(--teal-100); font-family:'Cormorant Garamond',serif; font-size:31px; font-style:italic; line-height:1.3; color:var(--teal-900); text-align:center;}
.pullquote-soft::before{content:""; display:block; width:44px; height:2px; background:var(--teal-500); margin:0 auto 20px;}

/* ===== HERO / CAPA ===== */
.hero{min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; padding:48px 24px;
  background:radial-gradient(ellipse 80% 50% at 50% 0%,rgba(6,82,95,.10),transparent 60%),
             radial-gradient(ellipse 70% 50% at 50% 100%,rgba(184,154,110,.10),transparent 55%),
             linear-gradient(170deg,#FBF9F4,#F1EBE1);
  position:relative;}
.hero-frame{position:absolute; inset:18px; border:1px solid var(--teal-500); opacity:.35; pointer-events:none;}
.hero-frame.in{inset:23px; border:3px solid var(--teal-900); opacity:.10;}
.hero-inner{position:relative; z-index:2; max-width:620px; display:flex; flex-direction:column; align-items:center; gap:26px;}
.hero-logo img{height:90px; margin:0 auto 8px;}
.hero-logo .bn{font-family:'Cormorant Garamond',serif; font-size:30px; color:var(--teal-900); letter-spacing:.04em;}
.hero .he{font-size:12px; letter-spacing:.42em; text-transform:uppercase; color:var(--teal-700); margin-bottom:6px;}
.hero h1{font-size:clamp(56px,13vw,104px); line-height:.98; color:var(--teal-900);}
.hero h1 em{font-style:italic; color:var(--teal-700); font-weight:400;}
.hero-orn{display:flex; align-items:center; justify-content:center; gap:12px;}
.hero-orn span{width:60px; height:1px; background:var(--teal-500); opacity:.7;}
.hero-orn i{width:10px; height:10px; border:1.5px solid var(--accent); transform:rotate(45deg);}
.hero-sub{font-family:'Cormorant Garamond',serif; font-size:21px; font-style:italic; color:var(--ink-soft); line-height:1.5; max-width:480px;}
.hero-quote{font-family:'Cormorant Garamond',serif; font-size:23px; font-style:italic; color:var(--teal-900); border-top:1px solid var(--teal-100); border-bottom:1px solid var(--teal-100); padding:16px 0; max-width:520px;}
.hero-scroll{font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--ink-mute);}
.hero-meta{font-size:11px; letter-spacing:.3em; text-transform:uppercase; color:var(--ink-mute);}
.hero-meta b{color:var(--teal-900);}

/* ===== APRESENTAÇÃO (com foto) ===== */
.intro{background:linear-gradient(180deg,var(--bg) 0%,var(--bg-alt) 100%); padding:70px 0;}
.intro-grid{display:grid; grid-template-columns:300px 1fr; gap:40px; align-items:start; max-width:840px; margin:0 auto; padding:0 26px;}
.intro-photo{position:relative;}
.intro-photo img{width:100%; aspect-ratio:3/4; object-fit:cover; object-position:center 12%; border-radius:6px; box-shadow:0 20px 50px rgba(6,82,95,.22);}
.intro-photo .badge{position:absolute; left:50%; bottom:-18px; transform:translateX(-50%); background:var(--teal-900); color:var(--paper); font-size:10px; letter-spacing:.28em; text-transform:uppercase; padding:9px 18px; border-radius:50px; white-space:nowrap;}
.intro-photo figcaption{margin-top:30px; text-align:center; font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--teal-700); font-size:17px;}

/* ===== VÍDEO EM DESTAQUE (página inteira, player dominante) ===== */
.video-feature{min-height:100vh; display:flex; align-items:center; justify-content:center; padding:40px 24px;
  background:radial-gradient(ellipse at top,rgba(47,138,149,.20),transparent 60%),linear-gradient(160deg,#0A3942 0%,#06343C 100%);
  color:#EAF3F4;}
.vf-inner{display:flex; flex-direction:column; align-items:center; text-align:center; gap:22px; width:100%; max-width:900px;}
.vf-text{max-width:720px;}
.vf-text .vf-eyebrow{font-size:11px; letter-spacing:.34em; text-transform:uppercase; color:#8FCAD2; margin-bottom:12px; display:flex; align-items:center; justify-content:center; gap:8px;}
.vf-text .vf-eyebrow svg{width:15px; height:15px; fill:#8FCAD2;}
.vf-title{font-family:'Cormorant Garamond',serif; font-size:clamp(28px,4.5vw,42px); line-height:1.1; color:#FFFFFF; margin:0 0 10px;}
.vf-desc{font-size:16px; line-height:1.6; color:#C7DDE0; margin:0 auto; max-width:600px;}
.vf-hint{font-size:12px; letter-spacing:.18em; text-transform:uppercase; color:#8FCAD2; display:flex; align-items:center; justify-content:center; gap:8px;}
.vf-hint svg{width:14px; height:14px; fill:#8FCAD2;}
.vf-player{position:relative; height:min(70vh,660px); aspect-ratio:9/16; width:auto; max-width:94vw; border-radius:16px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.5); background:#000; border:1px solid rgba(255,255,255,.14);}
.vf-player video{width:100%; height:100%; display:block; object-fit:cover; background:#000;}

/* ===== CTA FINAL ===== */
.cta-final{background:linear-gradient(180deg,var(--bg) 0%,var(--teal-50) 100%); padding:80px 0;}
.cta-box{background:var(--teal-900); color:var(--paper); border-radius:8px; padding:46px 40px; text-align:center; max-width:560px; margin:30px auto 0;}
.cta-box .k{font-size:11px; letter-spacing:.32em; text-transform:uppercase; color:var(--teal-100); margin-bottom:14px;}
.cta-box .big{font-family:'Cormorant Garamond',serif; font-size:27px; font-style:italic; line-height:1.4;}
.cta-box .big b{font-style:normal; font-weight:600; letter-spacing:.16em; font-family:'Inter',sans-serif; font-size:19px; color:#fff;}
.wa-btn{display:inline-flex; align-items:center; gap:10px; background:#fff; color:var(--teal-900); padding:16px 30px; border-radius:50px; font-weight:600; font-size:14px; text-decoration:none; margin-top:22px; box-shadow:0 6px 20px rgba(0,0,0,.22);}
.wa-btn svg{width:19px; height:19px; fill:currentColor;}
.sig{text-align:center; margin-top:40px; font-family:'Cormorant Garamond',serif; font-style:italic; color:var(--teal-900);}
.sig .a{font-size:26px;}

/* rodapé */
.foot{background:var(--bg-alt); text-align:center; padding:40px 20px; font-size:11px; letter-spacing:.28em; text-transform:uppercase; color:var(--ink-mute);}
.foot img{height:50px; margin:0 auto 14px; opacity:.9;}

/* ===== RESPONSIVO ===== */
@media(max-width:820px){
  .intro-grid{grid-template-columns:1fr; gap:24px; max-width:420px;}
  .intro-photo{max-width:300px; margin:0 auto;}
  .vf-inner{grid-template-columns:1fr; gap:28px; max-width:440px;}
  .vf-player{max-width:330px; margin:0 auto; width:100%;}
  .vf-text{text-align:center;}
  .vf-text .vf-eyebrow,.vf-hint{justify-content:center;}
  .body{font-size:17px;}
  .chapter{padding:50px 0 24px;}
}