/* =========================================================
   PREPARATÓRIO PARA ENTREVISTAS EM INGLÊS · Thais Lapolla
   Estilo compartilhado (home + lições) · navy + gold
   ========================================================= */
@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,600;1,9..144,400&family=Inter+Tight:wght@400;500;600;700&display=swap');

:root{
  --navy:#1D3A5F; --navy-hero:#2A4A6A;
  --gold:#C6A03E; --gold-text:#9A7A24; --gold-soft:#FBF7EE; --gold-border:#E8D8A0;
  --text:#2C2C2A; --muted:#6B6B6B;
  --card-bg:#F7F7F5; --section-bg:#EFEFED; --header-bg:#F5F4F2; --border:#E0DED8;
  --red-bg:#FDF0F0; --red-accent:#A32D2D;
  --green-bg:#F0FAF6; --green-accent:#0C6E56;
  --hero-text:#D8E8F0; --hero-muted:#AABBCC;
  --font-display:'Fraunces',Georgia,serif;
  --font-body:'Inter Tight',system-ui,sans-serif;
  --max-width:1080px;
}
*{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{background:var(--header-bg);color:var(--text);font-family:var(--font-body);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;}

/* ===== HERO ===== */
header.hero{
  background:
    radial-gradient(820px 420px at 88% -12%, rgba(198,160,62,0.18), transparent 60%),
    radial-gradient(600px 500px at -5% 110%, rgba(198,160,62,0.07), transparent 60%),
    var(--navy);
  color:#fff;padding:34px 0;position:relative;overflow:hidden;
}
.porthole{position:absolute;border-radius:50%;pointer-events:none;}
.porthole.p1{width:320px;height:320px;top:-130px;right:-100px;border:1px solid rgba(198,160,62,0.22);animation:floatY 9s ease-in-out infinite;}
.porthole.p2{width:170px;height:170px;bottom:-80px;left:-55px;border:1px solid rgba(255,255,255,0.07);animation:floatY 11s ease-in-out infinite reverse;}
.hero-inner{max-width:var(--max-width);margin:0 auto;position:relative;display:grid;grid-template-columns:1fr auto;align-items:center;gap:34px;padding:0 44px;}
.brand{display:flex;align-items:center;gap:11px;margin-bottom:12px;}
.brand-mark{width:34px;height:34px;border:1.5px solid var(--gold);border-radius:9px;display:flex;align-items:center;justify-content:center;color:var(--gold);font-family:var(--font-display);font-style:italic;font-weight:600;font-size:17px;flex:0 0 auto;}
.brand-name{font-size:13px;letter-spacing:0.14em;text-transform:uppercase;color:var(--hero-muted);font-weight:600;}
.brand-name b{color:#fff;font-weight:600;}
.hero-pill{display:inline-block;background:var(--navy-hero);color:var(--gold);font-size:12px;letter-spacing:0.15em;text-transform:uppercase;font-weight:600;padding:6px 15px;border-radius:100px;margin-bottom:11px;}
h1.lesson-title{font-family:var(--font-display);font-weight:400;font-size:clamp(25px,4.2vw,38px);line-height:1.08;letter-spacing:-0.02em;margin-bottom:9px;}
h1.lesson-title em{font-style:italic;color:var(--gold);}
.lesson-desc{color:var(--hero-text);font-size:15px;line-height:1.5;max-width:540px;margin-bottom:12px;}
.lesson-meta{color:var(--hero-muted);font-size:12.5px;letter-spacing:0.02em;display:flex;gap:22px;flex-wrap:wrap;}
.lesson-meta span::before{content:"•";margin-right:22px;color:var(--gold);}
.lesson-meta span:first-child::before{display:none;}

/* photo frame */
.hero-photo{position:relative;display:flex;align-items:center;justify-content:center;}
.photo-ring{position:relative;width:164px;height:164px;display:flex;align-items:center;justify-content:center;}
.photo-ring::before{content:"";position:absolute;inset:-14px;border-radius:50%;border:2px dashed rgba(198,160,62,0.55);animation:spin 28s linear infinite;}
.photo-circle{position:relative;width:144px;height:144px;border-radius:50%;background:linear-gradient(160deg,var(--navy-hero),#16314f);border:3px solid var(--gold);box-shadow:0 18px 44px rgba(0,0,0,0.38);overflow:hidden;display:flex;align-items:center;justify-content:center;}
.photo-circle img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.photo-fallback{font-family:var(--font-display);font-size:60px;font-weight:500;color:var(--gold);letter-spacing:0.02em;}
.photo-glyph{font-size:74px;line-height:1;}

@keyframes spin{to{transform:rotate(360deg);}}
@keyframes floatY{0%,100%{transform:translateY(0);}50%{transform:translateY(14px);}}
@keyframes riseIn{from{opacity:0;transform:translateY(18px);}to{opacity:1;transform:none;}}
@keyframes popIn{from{opacity:0;transform:scale(0.9);}to{opacity:1;transform:none;}}
.hero-text>*{opacity:0;animation:riseIn 0.7s ease forwards;}
.hero-text .brand{animation-delay:0.05s;}
.hero-text .hero-pill{animation-delay:0.16s;}
.hero-text .lesson-title{animation-delay:0.28s;}
.hero-text .lesson-desc{animation-delay:0.40s;}
.hero-text .lesson-meta{animation-delay:0.52s;}
.hero-photo{opacity:0;animation:popIn 0.85s 0.32s ease forwards;}
@media (max-width:680px){
  .hero-inner{grid-template-columns:1fr;gap:26px;padding:0 20px;}
  .hero-photo{order:-1;justify-content:flex-start;}
  .photo-ring{width:136px;height:136px;}
  .photo-circle{width:120px;height:120px;}
  .photo-fallback{font-size:42px;}.photo-glyph{font-size:48px;}
}
@media (prefers-reduced-motion:reduce){
  .hero-text>*,.hero-photo{animation:none;opacity:1;}
  .photo-ring::before,.porthole{animation:none;}
}

/* ===== SECTIONS / SCREENS ===== */
.screen-inner{max-width:var(--max-width);margin:0 auto;padding:52px 44px 40px;width:100%;}
.section-label{font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold-text);font-weight:600;margin-bottom:7px;display:flex;align-items:center;gap:12px;}
.section-label::before{content:"";width:26px;height:2px;background:var(--gold);}
h2.section-title{font-family:var(--font-display);font-weight:400;font-size:clamp(21px,3.4vw,27px);line-height:1.14;letter-spacing:-0.01em;color:var(--navy);margin-bottom:10px;}
h2.section-title em{font-style:italic;color:var(--gold-text);}
.lead{font-size:15px;line-height:1.5;margin-bottom:9px;color:var(--text);}
.lead em{font-family:var(--font-display);font-style:italic;color:var(--navy);}
.lead.lead-sm{font-size:14.5px;line-height:1.5;}

/* ===== VIDEO ===== */
.video-stage{position:relative;width:100%;border-radius:10px;overflow:hidden;box-shadow:0 14px 40px rgba(29,58,95,0.18);background:var(--navy);}
.video-stage video{display:block;width:100%;height:auto;background:#000;}
.video-stage.yt{padding-top:56.25%;max-width:min(100%,86vh);margin-inline:auto;}
.video-stage.yt iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.video-caption{margin-top:14px;font-size:15px;color:var(--muted);}
/* shorts verticais (9:16) */
.video-stage.vshort{max-width:315px;margin:0 auto;aspect-ratio:9/16;padding-top:0;}
.video-stage.vshort iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
/* recurso "em breve" */
.res-soon{background:var(--gold-soft);border:1.5px dashed var(--gold-border);border-radius:12px;padding:38px 20px;text-align:center;color:var(--muted);font-size:15px;}
.res-soon .rs-ic{font-size:34px;display:block;margin-bottom:8px;}

/* ===== modelos de e-mail (follow-up) ===== */
.eph{color:var(--gold-text);font-weight:700;} /* [informação] para o candidato substituir */
.emailbox{background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px 22px;color:var(--text);font-size:14.5px;line-height:1.65;}
.emailbox .esubj{display:block;font-weight:700;color:var(--navy);margin-bottom:10px;padding-bottom:8px;border-bottom:1px solid var(--border);}
.emailbox p{margin:0 0 9px;}
.emailbox p:last-child{margin-bottom:0;}
.copy-btn{margin-top:12px;border:none;border-radius:100px;padding:10px 22px;background:var(--navy);color:#fff;font-family:var(--font-body);font-weight:700;font-size:14px;cursor:pointer;transition:all .15s ease;}
.copy-btn:hover{background:var(--gold);color:var(--navy);}
.video-caption b{color:var(--navy);}
.video-note{margin-top:16px;background:var(--gold-soft);border:1px dashed var(--gold-border);border-radius:8px;padding:12px 16px;font-size:14.5px;color:var(--text);}
.video-note b{color:var(--navy);}

/* ===== DO / DON'T CARDS ===== */
.tip{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px 20px;margin-bottom:14px;}
.tip .icon{flex:0 0 auto;width:38px;height:38px;border-radius:10px;display:flex;align-items:center;justify-content:center;font-size:19px;font-weight:700;}
.tip.do .icon{background:var(--green-bg);color:var(--green-accent);}
.tip.dont .icon{background:var(--red-bg);color:var(--red-accent);}
.tip h3{font-family:var(--font-display);font-weight:600;font-size:18.5px;color:var(--navy);margin-bottom:4px;letter-spacing:-0.01em;}
.tip p{font-size:15.5px;line-height:1.55;color:var(--text);}
.tip .ex{display:block;margin-top:7px;font-size:14px;color:var(--muted);font-style:italic;}
.tip .ex b{color:var(--green-accent);font-style:normal;}
.tip .ex.bad b{color:var(--red-accent);}

/* ===== chips / phrase lists ===== */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin:6px 0 4px;}
.chip{background:#fff;border:1px solid var(--gold-border);border-radius:100px;padding:8px 16px;font-size:15px;color:var(--navy);font-weight:600;}
.phrase-group{background:#fff;border:1px solid var(--border);border-radius:12px;padding:12px 16px;margin-bottom:9px;}
.phrase-group h3{font-family:var(--font-display);font-weight:600;font-size:15.5px;color:var(--navy);margin-bottom:6px;}
.phrase-group ul{list-style:none;display:grid;gap:5px;}
.phrase-group li{position:relative;padding-left:18px;font-size:14px;line-height:1.45;}
.phrase-group li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--gold);}
.phrase-group li b{font-weight:400;color:inherit;} /* frases das boxes NÃO em negrito, só o título (h3) */
.phrase-group.vocab li b{font-weight:700;color:var(--navy);} /* caixas de vocabulário: termo em destaque p/ não se misturar */
.phrase-group.vocab li .eq{color:var(--muted);}

/* pares "reformular": versão rude -> versão educada */
.rephrase-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 18px;margin-bottom:11px;}
.rephrase-card .rp-bad{display:block;color:var(--red-accent);font-size:14.5px;margin-bottom:5px;}
.rephrase-card .rp-good{display:block;color:var(--green-accent);font-size:15.5px;font-weight:600;}
/* frase direta -> duas versões profissionais (formal / menos formal) */
.tone-card{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 18px;margin-bottom:12px;}
.tone-card .tc-direct{display:block;color:var(--red-accent);font-size:14.5px;margin-bottom:8px;}
.tone-card .tc-opt{display:block;font-size:15px;line-height:1.45;margin-bottom:5px;color:var(--text);}
.tc-lab{color:var(--gold-text);font-weight:700;margin-right:5px;} /* rótulo/subtítulo sempre em negrito; só a explicação fica sem negrito */
.phrase-group .pt{color:var(--muted);font-style:italic;}

/* ===== esqueleto de CV com prompts (frases para completar) ===== */
.cv-block{background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 18px;margin-bottom:12px;}
.cv-block h3{font-family:var(--font-display);font-weight:600;font-size:15.5px;color:var(--navy);margin-bottom:8px;letter-spacing:.01em;}
.cv-block .cv-line{display:block;font-size:14.5px;line-height:1.55;color:var(--text);margin-bottom:6px;}
.cv-block .cv-line:last-child{margin-bottom:0;}
.cv-block .ph{color:var(--gold-text);font-style:italic;} /* lacuna [para completar] */
.cv-note{font-size:13.5px;color:var(--muted);font-style:italic;margin-top:4px;}

/* ===== robozinho montador de CV ===== */
.cvbot .bot-head{font-size:13px;color:var(--gold-text);font-weight:700;letter-spacing:.04em;text-transform:uppercase;margin-bottom:8px;}
.cvbot .type-grid,.cvbot .lang-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:6px;}
.cvbot .pick{background:#fff;border:1.5px solid var(--gold-border);border-radius:12px;padding:15px 16px;cursor:pointer;text-align:left;transition:all .15s ease;font-family:var(--font-body);}
.cvbot .pick:hover{border-color:var(--gold);transform:translateY(-2px);box-shadow:0 10px 22px -12px rgba(0,0,0,.35);}
.cvbot .pick h4{font-family:var(--font-display);font-weight:600;font-size:16px;color:var(--navy);margin-bottom:4px;}
.cvbot .pick p{font-size:13px;color:var(--muted);line-height:1.4;}
.cvbot .field{margin-bottom:9px;}
.cvbot .field label{margin-bottom:3px;}
.cvbot .field input,.cvbot .field textarea{padding:8px 11px;}
.cvbot .bot-head{margin-bottom:6px;}
.cvbot .field label{display:block;font-size:14px;font-weight:700;color:var(--navy);margin-bottom:5px;}
.cvbot .field input,.cvbot .field textarea{width:100%;box-sizing:border-box;font-family:var(--font-body);font-size:15px;padding:10px 12px;border:1.5px solid var(--border);border-radius:9px;background:#fff;color:var(--text);}
.cvbot .field textarea{min-height:52px;resize:vertical;}
.cvbot .field input:focus,.cvbot .field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(198,160,62,.15);}
.cvbot .field .hint{font-size:12.5px;color:var(--muted);margin-top:4px;font-style:italic;}
.cvbot .exp-block{border:1px solid var(--border);border-radius:12px;padding:14px 16px;margin-bottom:12px;background:var(--gold-soft);}
.cvbot .exp-block .exp-title{display:flex;justify-content:space-between;align-items:center;font-size:13px;font-weight:700;color:var(--navy);margin-bottom:10px;}
.cvbot .exp-block .rm{background:none;border:none;color:var(--red-accent);cursor:pointer;font-size:13px;font-weight:600;}
.cvbot .grid2{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.cvbot .add-exp{background:transparent;border:1.5px dashed var(--gold-border);color:var(--navy);border-radius:9px;padding:9px 14px;font-weight:600;cursor:pointer;font-size:13.5px;margin-bottom:6px;}
.cvbot .bot-nav{display:flex;justify-content:space-between;gap:10px;margin-top:18px;}
.cvbot .bot-btn{border:none;border-radius:100px;padding:11px 24px;font-family:var(--font-body);font-weight:700;font-size:14px;cursor:pointer;transition:all .15s ease;}
.cvbot .bot-btn.primary{background:var(--navy);color:#fff;}
.cvbot .bot-btn.primary:hover{background:var(--gold);color:var(--navy);}
.cvbot .bot-btn.ghost{background:transparent;border:1.5px solid var(--gold-border);color:var(--navy);}
.cvbot .bot-btn:disabled{opacity:.35;cursor:default;}
/* CV renderizado */
.cv-output{background:#fff;border:1px solid var(--border);border-radius:12px;padding:26px 30px;color:#1a1a1a;font-family:Arial,Helvetica,sans-serif;}
.cv-output .cv-name{font-size:22px;font-weight:700;color:#1F3A5F;text-align:center;}
.cv-output .cv-sub{text-align:center;color:#555;margin:2px 0;font-size:15px;}
.cv-output .cv-contact{text-align:center;color:#555;font-size:13px;margin-bottom:14px;}
.cv-output h4{font-size:13.5px;color:#1F3A5F;border-bottom:1.5px solid #1F3A5F;margin:15px 0 7px;padding-bottom:3px;text-transform:uppercase;letter-spacing:.04em;}
.cv-output p{font-size:13.5px;line-height:1.5;margin:4px 0;}
.cv-output ul{margin:4px 0 4px 18px;padding:0;}
.cv-output li{font-size:13.5px;line-height:1.5;margin-bottom:3px;}
.cv-output .miss{color:#bbb;}
.cv-output mark.tr{background:#FFF3C4;color:#8a6d00;padding:0 3px;border-radius:3px;}
.cv-legend{font-size:13px;color:var(--muted);margin:12px 0;background:#FFF9E8;border:1px solid #F0E2B0;border-radius:9px;padding:10px 14px;}
.cv-legend mark{background:#FFF3C4;color:#8a6d00;padding:0 3px;border-radius:3px;}
.cv-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px;}
.cv-copybox{width:100%;box-sizing:border-box;margin-top:10px;min-height:120px;font-family:monospace;font-size:12.5px;padding:10px;border:1.5px solid var(--border);border-radius:9px;display:none;}
@media print{
  body *{visibility:hidden!important;}
  #cvPrintArea,#cvPrintArea *{visibility:visible!important;}
  #cvPrintArea{position:absolute;left:0;top:0;width:100%;border:none;}
  #cvPrintArea mark.tr{background:transparent;color:#1a1a1a;}
  .topbar,.deck-nav,.deck-btn,.deck-counter,.deck-progress-top{display:none!important;}
}

/* ===== verb/grammar box ===== */
.gbox{background:#fff;border:1px solid var(--border);border-radius:12px;padding:13px 16px;margin-bottom:10px;}
.gbox h3{font-family:var(--font-display);font-weight:600;font-size:15.5px;color:var(--navy);margin-bottom:6px;}
.gbox .form{display:inline-block;background:var(--section-bg);border-radius:6px;padding:6px 12px;font-weight:600;color:var(--navy);margin:4px 0 10px;font-size:15px;}
.gbox .ex{font-size:14px;line-height:1.5;}
.gbox .ex b{color:var(--green-accent);}

/* ===== recap checklist ===== */
.check{list-style:none;display:grid;gap:8px;}
.check li{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:10px;padding:10px 15px;}
.check li .n{flex:0 0 auto;font-family:var(--font-display);font-weight:600;font-size:18px;color:var(--gold);width:26px;text-align:center;}
.check li b{color:var(--navy);}
.check li span{font-size:14px;line-height:1.45;}

/* ===== callout ===== */
.callout{background:var(--gold-soft);border-left:3px solid var(--gold);border-radius:0 8px 8px 0;padding:11px 16px;margin-top:12px;font-size:14px;color:var(--text);}
.callout strong{color:var(--navy);}

/* ===== EXERCISES (para as páginas de prática) ===== */
.ex-instr{color:var(--muted);font-size:14.5px;line-height:1.5;margin-bottom:11px;}
.q{background:#fff;border:1px solid var(--border);border-radius:12px;padding:18px 20px;margin-bottom:14px;}
.q-text{font-size:17px;margin-bottom:14px;line-height:1.5;}
.q-text .src{display:block;color:var(--muted);font-size:14px;font-style:italic;margin-bottom:8px;}
.opts{display:flex;flex-wrap:wrap;gap:10px;}
.opt{font-family:var(--font-body);font-size:16px;font-weight:500;color:var(--navy);background:var(--card-bg);border:1.5px solid var(--border);border-radius:8px;padding:10px 18px;cursor:pointer;transition:all .15s ease;}
.opt:hover:not(.locked){border-color:var(--gold);background:var(--gold-soft);}
.opt.correct{background:var(--green-bg);border-color:var(--green-accent);color:var(--green-accent);cursor:default;}
.opt.correct::after{content:"  ✓";font-weight:700;}
.opt.wrong{background:var(--red-bg);border-color:var(--red-accent);color:var(--red-accent);animation:shake .35s;}
.opt.locked{opacity:.5;cursor:default;}
@keyframes shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-5px)}75%{transform:translateX(5px)}}
.fb{margin-top:12px;font-size:14.5px;line-height:1.5;display:none;border-radius:8px;padding:11px 14px;}
.fb.show{display:block;}
.fb.ok{background:var(--green-bg);color:var(--green-accent);}
.fb.no{background:var(--red-bg);color:var(--red-accent);}
.fb b{font-weight:700;}

/* ===== MODELOS (respostas exemplo) ===== */
.model{background:#fff;border:1px solid var(--border);border-radius:12px;margin-bottom:12px;overflow:hidden;}
.model summary{cursor:pointer;list-style:none;padding:15px 18px;font-weight:600;color:var(--navy);display:flex;align-items:center;gap:10px;font-size:15.5px;}
.model summary::-webkit-details-marker{display:none;}
.model summary::before{content:"▸";color:var(--gold-text);font-size:13px;transition:transform .15s ease;}
.model[open] summary::before{transform:rotate(90deg);}
.model summary .area{font-family:var(--font-display);}
.model summary .tag-en{margin-left:auto;font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--gold-text);background:var(--gold-soft);border:1px solid var(--gold-border);border-radius:100px;padding:2px 9px;}
.model .model-body{padding:0 18px 16px;font-size:15px;line-height:1.6;color:var(--text);}
.model .model-body b{color:var(--green-accent);}

/* ===== PROGRESS BAR ===== */
.deck-progress-top{position:fixed;top:0;left:0;right:0;height:4px;background:var(--border);z-index:60;}
#progFill{height:100%;width:0;background:var(--gold);transition:width .35s ease;}

/* ===== SCREENS ===== */
.screen{display:none;}
.screen.active{display:flex;flex-direction:column;justify-content:center;min-height:100vh;animation:screenIn .42s ease;}
.screen.cover.active{padding:0;}
.cover .hero{width:100%;min-height:100vh;display:flex;flex-direction:column;justify-content:center;}
@keyframes screenIn{from{opacity:0;transform:translateY(10px);}to{opacity:1;transform:none;}}
@media (prefers-reduced-motion:reduce){.screen.active{animation:none;}}

/* ===== FINAL (Teoria concluída) ===== */
.cta{text-align:center;}
.cta .badge{width:60px;height:60px;border-radius:50%;background:var(--gold-soft);border:2px solid var(--gold);display:flex;align-items:center;justify-content:center;margin:0 auto 14px;font-size:28px;}
.cta h2{font-family:var(--font-display);font-weight:400;font-size:clamp(23px,3.6vw,28px);color:var(--navy);margin-bottom:10px;}
.cta p{color:var(--muted);font-size:15px;line-height:1.5;max-width:520px;margin:0 auto 16px;}
.cta-btns{display:flex;gap:14px;justify-content:center;flex-wrap:wrap;}
.btn-primary,.btn-ghost{font-family:var(--font-body);font-weight:600;font-size:16px;border-radius:100px;padding:14px 28px;cursor:pointer;transition:all .15s ease;display:inline-flex;align-items:center;gap:9px;text-decoration:none;border:none;}
.btn-primary{background:var(--navy);color:#fff;}
.btn-primary:hover{background:var(--navy-hero);transform:translateY(-1px);}
.btn-ghost{background:transparent;color:var(--navy);border:1.5px solid var(--border);}
.btn-ghost:hover{border-color:var(--gold);}

/* ===== NAV BAR ===== */
/* setas de navegação nas laterais (economiza espaço vertical) */
.deck-nav,.deck-nav-inner{display:contents;}
.deck-btn{position:fixed;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;padding:0;display:flex;align-items:center;justify-content:center;font-size:21px;font-weight:700;line-height:1;border:1.5px solid var(--gold-border);background:#fff;color:var(--navy);cursor:pointer;z-index:62;box-shadow:0 6px 18px -8px rgba(0,0,0,.45);transition:all .15s ease;}
.deck-btn:hover{background:var(--gold);border-color:var(--gold);color:var(--navy);}
.deck-btn.prev{left:10px;}
.deck-btn.next{right:10px;}
.deck-btn:disabled{opacity:.28;cursor:default;}
.deck-counter{position:fixed;bottom:9px;left:50%;transform:translateX(-50%);font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums;letter-spacing:.04em;z-index:62;background:rgba(245,244,242,.85);padding:2px 11px;border-radius:100px;}
.deck-home{font-size:13px;color:var(--muted);text-decoration:none;display:inline-flex;align-items:center;gap:6px;}
.deck-home:hover{color:var(--navy);}

/* botão Home fixo, presente em toda a aula */
/* topo: casinha + selo da aula juntos no canto superior direito */
.topbar{position:fixed;top:14px;right:14px;z-index:61;display:flex;align-items:center;gap:8px;}
.home-chip{display:inline-flex;align-items:center;justify-content:center;width:34px;height:34px;
  font-family:var(--font-body);font-weight:700;font-size:16px;line-height:1;color:var(--navy);
  background:#fff;border:1.5px solid var(--gold-border);border-radius:50%;text-decoration:none;
  box-shadow:0 6px 18px -8px rgba(0,0,0,.45);transition:all .18s ease;}
.home-chip:hover{background:var(--gold);border-color:var(--gold);color:var(--navy);
  transform:translateY(-1px);box-shadow:0 10px 24px -9px rgba(198,160,62,.6);}
/* indicador "onde estou": aula + teoria/prática */
.deck-here{display:inline-flex;align-items:center;gap:7px;
  font-family:var(--font-body);font-weight:700;font-size:13px;letter-spacing:.02em;color:var(--gold);
  background:var(--navy);border:1.5px solid var(--navy);border-radius:100px;
  padding:8px 16px;box-shadow:0 6px 18px -8px rgba(0,0,0,.45);}
@media (max-width:520px){.deck-here{font-size:11.5px;padding:7px 12px;}
  .home-chip{width:30px;height:30px;font-size:14px;} .topbar{top:10px;right:10px;gap:6px;}}

/* linha do autor no hero (home) */
.hero-author{font-family:var(--font-display);font-style:italic;font-weight:400;font-size:clamp(20px,3vw,26px);color:var(--gold);margin:-6px 0 22px;}
.home-title{font-size:clamp(28px,4.4vw,44px);line-height:1.08;margin-bottom:8px;}
.hero-btns{margin-top:26px;display:flex;gap:14px;flex-wrap:wrap;}
.btn-hero{display:inline-flex;align-items:center;gap:9px;font-family:var(--font-body);font-weight:600;font-size:16px;
  background:var(--gold);color:var(--navy);border:none;border-radius:100px;padding:13px 26px;text-decoration:none;transition:all .15s ease;}
.btn-hero:hover{background:#d8b455;transform:translateY(-1px);}

/* =========================================================
   HOME PAGE
   ========================================================= */
.home-main{max-width:var(--max-width);margin:0 auto;padding:64px 44px 100px;}
.home-intro-label{font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold-text);font-weight:600;margin-bottom:12px;display:flex;align-items:center;gap:12px;}
.home-intro-label::before{content:"";width:26px;height:2px;background:var(--gold);}
.home-intro h2{font-family:var(--font-display);font-weight:400;font-size:30px;color:var(--navy);margin-bottom:10px;letter-spacing:-0.01em;}
.home-intro p{color:var(--muted);font-size:17px;max-width:640px;margin-bottom:40px;}
.lesson-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;}
@media (max-width:640px){.lesson-grid{grid-template-columns:1fr;}}
.lcard{display:flex;gap:16px;align-items:flex-start;background:#fff;border:1px solid var(--border);border-radius:14px;padding:20px 22px;text-decoration:none;color:inherit;transition:all .18s ease;position:relative;overflow:hidden;}
.lcard.available:hover{border-color:var(--gold);box-shadow:0 14px 34px -18px rgba(29,58,95,.5);transform:translateY(-2px);}
.lcard.soon{opacity:.62;cursor:default;}
.lcard .lnum{flex:0 0 auto;width:46px;height:46px;border-radius:12px;background:var(--navy);color:#fff;font-family:var(--font-display);font-weight:600;font-size:20px;display:flex;align-items:center;justify-content:center;}
.lcard.intro .lnum{background:var(--gold);color:var(--navy);}
.lcard.soon .lnum{background:var(--section-bg);color:var(--muted);}
.lcard .lbody{flex:1 1 auto;min-width:0;}
.lcard .lkicker{font-size:11px;letter-spacing:.12em;text-transform:uppercase;font-weight:700;color:var(--gold-text);margin-bottom:3px;}
.lcard .ltitle{font-family:var(--font-display);font-weight:600;font-size:18.5px;color:var(--navy);line-height:1.25;letter-spacing:-0.01em;margin-bottom:5px;}
.lcard .ldesc{font-size:14px;color:var(--muted);line-height:1.45;}
.lcard .lmeta{margin-top:9px;font-size:12px;color:var(--muted);display:flex;gap:14px;flex-wrap:wrap;}
.lcard .lmeta b{color:var(--navy);}
.lcard .tag-soon{position:absolute;top:14px;right:16px;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--gold-text);background:var(--gold-soft);border:1px solid var(--gold-border);border-radius:100px;padding:3px 10px;}
.lcard .arrow{align-self:center;color:var(--gold-text);font-size:20px;flex:0 0 auto;}
.home-foot{text-align:center;color:var(--muted);font-size:13.5px;margin-top:52px;}

/* =========================================================
   TEMA PRÁTICA (teal/petróleo) — diferencia teoria x prática
   ========================================================= */
body.theme-pratica{
  --navy:#3A4A5E;        /* azul acinzentado (slate) no lugar do navy */
  --navy-hero:#4B5D71;
  --hero-text:#DCE3EB;
  --hero-muted:#A7B4C2;
}

/* =========================================================
   HOME: ações por aula (Teoria / Prática)
   ========================================================= */
.lcard-actions{display:flex;gap:8px;margin-top:12px;flex-wrap:wrap;}
.lcard-actions a{font-size:13px;font-weight:600;text-decoration:none;border-radius:100px;
  padding:7px 15px;display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--border);
  color:var(--navy);background:#fff;transition:all .15s ease;}
.lcard-actions a.act-teoria:hover{border-color:var(--navy);background:var(--navy);color:#fff;}
.lcard-actions a.act-pratica{border-color:#AEB9C6;color:#3A4A5E;}
.lcard-actions a.act-pratica:hover{background:#3A4A5E;border-color:#3A4A5E;color:#fff;}
.lcard-actions span.act-soon{font-size:12px;color:var(--muted);align-self:center;font-style:italic;}
.lcard.has-actions{cursor:default;}
.lcard.has-actions:hover{transform:none;box-shadow:none;border-color:var(--border);}

/* =========================================================
   PLAYER DE ÁUDIO (shadowing com linha do tempo)
   ========================================================= */
.audio-player{margin:6px 0 2px;}
.audio-player audio{width:100%;height:42px;}
.audio-hint{font-size:13px;color:var(--muted);margin-top:4px;}

/* =========================================================
   DESTAQUES DE GRAMÁTICA / EXEMPLOS / ÁUDIO (Aula 2)
   ========================================================= */
/* destaques coloridos: verbo, time expression, connector */
/* PADRÃO DE CORES: verbo = navy · time marker = verde · connector = vermelho */
.hl-v{color:var(--navy)!important;font-weight:700;}
.hl-t{color:var(--green-accent)!important;font-weight:700;}
.hl-c{color:var(--red-accent)!important;font-weight:700;border-bottom:2px dotted var(--red-accent);}
.legend{display:flex;flex-wrap:wrap;gap:16px;margin-bottom:18px;font-size:13px;color:var(--muted);background:var(--section-bg);border-radius:10px;padding:11px 14px;}
.legend span{display:inline-flex;align-items:center;gap:7px;}
.legend i{width:12px;height:12px;border-radius:3px;display:inline-block;}
.legend .l-v{background:var(--navy);}
.legend .l-t{background:var(--green-accent);}
.legend .l-c{background:var(--red-accent);}

/* ===== TIMELINE (slide 3 da teoria) ===== */
.timeline{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;position:relative;margin-bottom:8px;}
.timeline::before{content:"";position:absolute;top:30px;left:6%;right:6%;height:2px;background:linear-gradient(90deg,var(--gold-border),var(--gold),var(--gold-border));z-index:0;}
.tl-card{position:relative;z-index:1;background:#fff;border:1px solid var(--border);border-radius:12px;padding:16px 16px 18px;display:flex;flex-direction:column;}
.tl-dot{width:34px;height:34px;border-radius:50%;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:17px;margin:0 auto 12px;border:3px solid var(--paper,#fff);box-shadow:0 0 0 2px var(--gold-border);}
.tl-card .tc-tag{font-size:11.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;color:var(--gold-text);text-align:center;margin-bottom:10px;}
.tl-card .tc-ex{font-size:13.5px;line-height:1.5;color:var(--text);font-style:italic;}
.tl-card .tc-ex b{font-style:normal;}
@media(max-width:620px){.timeline{grid-template-columns:1fr;}.timeline::before{display:none;}.tl-dot{margin:0 0 10px;}.tl-card .tc-tag{text-align:left;}}

/* ===== CONJUGAÇÃO (slide 5 da teoria) ===== */
.conj{display:grid;gap:12px;margin:6px 0 4px;}
.conj-row{display:flex;align-items:center;gap:14px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px;}
.conj-row.s{border-color:var(--gold-border);background:var(--gold-soft);}
.conj-subj{display:flex;flex-wrap:wrap;gap:6px;flex:0 0 auto;}
.conj-subj .sp{background:var(--section-bg);border-radius:8px;padding:4px 10px;font-size:13.5px;font-weight:600;color:var(--navy);}
.conj-row.s .conj-subj .sp{background:#fff;}
.conj-arrow{color:var(--gold-text);font-weight:700;flex:0 0 auto;}
.conj-form{font-size:16px;color:var(--navy);font-weight:600;}
.conj-form .plus{background:var(--gold);color:var(--navy);border-radius:6px;padding:1px 8px;margin-left:4px;font-weight:800;}

/* ===== VERB ROWS + LISTEN (slide 11 da teoria) ===== */
.verb-row{display:flex;align-items:center;gap:14px;margin:9px 0;}
.verb-tag{flex:0 0 auto;min-width:128px;text-align:center;background:transparent;border:1.5px solid var(--gold-border);border-radius:100px;padding:8px 16px;font-weight:700;color:var(--navy);}
.verb-ex{font-size:15px;color:var(--text);line-height:1.4;}
.phrase-group h3 .listen-btn{margin-left:10px;}
.listen-btn{width:32px;height:32px;border-radius:50%;border:none;background:var(--navy);color:#fff;font-size:12px;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;vertical-align:middle;transition:background .15s ease,transform .15s ease;padding-left:2px;}
.listen-btn:hover{background:var(--gold);color:var(--navy);transform:scale(1.08);}

/* ===== DRAG & DROP (sorter de time markers) ===== */
.sorter-pool{display:flex;flex-wrap:wrap;gap:10px;background:var(--section-bg);border-radius:10px;padding:14px;margin-bottom:16px;min-height:54px;}
.sorter-pool:empty::after{content:"Tudo classificado! ✓";color:var(--green-accent);font-size:14px;font-weight:600;}
.sorter-chip{background:#fff;border:1.5px solid var(--gold-border);border-radius:100px;padding:8px 16px;font-size:15px;color:var(--navy);font-weight:600;cursor:grab;user-select:none;transition:transform .12s,background .12s,border-color .12s;}
.sorter-chip:active{cursor:grabbing;}
.sorter-chip.sel{border-color:var(--navy);box-shadow:0 0 0 3px var(--gold-soft);}
.sorter-chip.done{cursor:default;background:var(--green-bg);border-color:var(--green-accent);color:var(--green-accent);}
.sorter-chip.done::after{content:" ✓";font-weight:700;}
.sorter-chip.wrong{animation:shake .35s;border-color:var(--red-accent);color:var(--red-accent);background:var(--red-bg);}
.sorter-hint{font-size:13px;color:var(--muted);margin-bottom:14px;}
.sorter-cats{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;}
@media(max-width:560px){.sorter-cats{grid-template-columns:1fr;}}
.sorter-box{background:#fff;border:2px dashed var(--border);border-radius:12px;padding:12px;min-height:120px;transition:border-color .15s,background .15s;}
.sorter-box.over{border-color:var(--gold);background:var(--gold-soft);}
.sorter-box h4{font-size:12.5px;text-transform:uppercase;letter-spacing:.06em;color:var(--gold-text);font-weight:700;margin-bottom:10px;text-align:center;}
.sorter-box .drop-list{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}

/* ===== REVEAL (uma resposta por frase) ===== */
.pt-hint{color:var(--muted);font-style:italic;font-size:14px;}
.reveal-btn{margin-top:4px;}
.reveal-ans{margin-top:12px;background:var(--green-bg);color:var(--green-accent);border-radius:8px;padding:10px 14px;font-size:16px;}
.reveal-ans b{font-weight:700;}

/* cartões de exemplo por tempo verbal */
.tense-card{background:#fff;border:1px solid var(--border);border-left:4px solid var(--gold);border-radius:12px;padding:16px 18px;margin-bottom:14px;}
.tense-card .tc-tag{font-size:12px;letter-spacing:.1em;text-transform:uppercase;font-weight:700;color:var(--gold-text);margin-bottom:8px;display:flex;align-items:center;gap:8px;}
.tense-card .tc-ex{font-size:16px;line-height:1.55;color:var(--text);font-style:italic;}
.tense-card .tc-ex b{font-style:normal;}

/* time markers */
.tm-box{background:var(--gold-soft);border:1px solid var(--gold-border);border-radius:10px;padding:14px 16px;margin-top:16px;}
.tm-box h4{font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--gold-text);font-weight:700;margin-bottom:10px;}
.tm-box .chips .chip{border-color:var(--gold-border);}

/* slot de áudio (a Thais grava depois) */
.audio-slot{display:flex;align-items:center;gap:12px;background:var(--section-bg);border:1px dashed var(--border);border-radius:10px;padding:11px 15px;margin-top:12px;font-size:13.5px;color:var(--muted);}
.audio-slot .mic{width:34px;height:34px;border-radius:50%;background:var(--gold);color:var(--navy);display:flex;align-items:center;justify-content:center;font-size:16px;flex:0 0 auto;}
.audio-slot audio{height:34px;max-width:260px;}

.gold-h{color:var(--gold-text);}

@media (max-width:640px){
  .screen-inner{padding:40px 20px 32px;}
  .home-main{padding:48px 20px 72px;}
  .hero-inner{padding:0 20px;}
}