/* Terços da Giu — landing page
   Fontes: Archivo (variável) e EB Garamond, ambas OFL, servidas localmente. */

@font-face{font-family:"Archivo";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/archivo-latin-wght-normal.woff2) format("woff2")}
@font-face{font-family:"Archivo";font-style:italic;font-weight:100 900;font-display:swap;src:url(fonts/archivo-latin-wght-italic.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:400;font-display:swap;src:url(fonts/eb-garamond-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"EB Garamond";font-style:normal;font-weight:500;font-display:swap;src:url(fonts/eb-garamond-latin-500-normal.woff2) format("woff2")}

:root{
  --uva:#570b4f;         /* roxo escuro: títulos, rodapé */
  --uva-oferta:#5c0b53;  /* fundo da oferta */
  --ameixa:#95298a;      /* roxo médio: itálicos do hero */
  --pink:#f549e2;        /* selo */
  --pink-btn:#cc17b6;    /* botões (texto branco, contraste 4.8:1) */
  --pad-y:96px;
  --orquidea:#aa2496;    /* faixa da promessa */
  --rosa-1:#fef5ff;      /* fundo do hero */
  --rosa-2:#f4ddee;      /* fundo caminho / garantia */
  --rosa-3:#ebc6eb;      /* fundo histórias */
  --creme:#f6eedd;
  --creme-card:#f4ecdd;
  --cafe:#34200f;
  --marrom:#6a4b38;
  --sans:"Archivo",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;
  --serif:"EB Garamond",Garamond,"Times New Roman",serif;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font-family:var(--sans);color:var(--uva);background:var(--rosa-1);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
h1,h2,h3,p,ol,ul,figure{margin:0;padding:0}
ol,ul{list-style:none}
img{display:block;max-width:100%;height:auto}
em{font-style:italic}
a{color:inherit}

/* ---------- peças comuns ---------- */
.eyebrow{font-family:var(--serif);font-weight:400;font-size:12px;line-height:1;letter-spacing:.28em;text-transform:uppercase}
.eyebrow--rose{color:#a85aa0}
.eyebrow--brown{color:#9a6a45}
.eyebrow--lg{font-size:15px;letter-spacing:.26em}
.eyebrow--md{font-size:13px;letter-spacing:.25em;padding-left:5px}

.btn{display:flex;align-items:center;justify-content:center;width:100%;max-width:400px;height:60px;padding:0 16px;border-radius:3px;background:var(--pink-btn);
  font-family:var(--sans);font-weight:600;font-size:18px;line-height:1.15;letter-spacing:0;text-transform:none;color:#fff;
  text-decoration:none;text-align:center;
  box-shadow:0 18px 30px -6px rgba(87,11,79,.34),0 4px 10px rgba(87,11,79,.12);
  transition:transform .15s ease,box-shadow .15s ease,filter .15s ease}
.btn:hover{transform:translateY(-2px);filter:brightness(1.08)}
.btn:focus-visible{outline:3px solid var(--uva);outline-offset:3px}

/* ---------- HERO ---------- */
.hero{background:var(--rosa-1);overflow:hidden}
.hero__stage{position:relative;width:1920px;height:735px;margin-left:calc(50% - 960px)}
.hero__text{position:absolute;left:300px;top:130px;z-index:2}
.hero__title{margin-top:8px;font-weight:500;font-size:58px;line-height:70px;letter-spacing:-.015em;color:var(--uva)}
.hero__title em{color:var(--ameixa)}
.hero__sub{margin-top:20px;font-size:25px;line-height:37px;color:var(--ameixa)}
.hero__sub strong{font-weight:700;color:var(--uva)}
.hero__btn{margin-top:32px}
.hero__note{margin-top:15.6px;font-family:var(--serif);font-size:14px;line-height:1.2;color:var(--ameixa)}
.hero__art{position:absolute;left:780px;top:0;width:920px;height:735px;max-width:none;z-index:1}

/* ---------- PROMESSA ---------- */
.promessa{position:relative;background:var(--orquidea);color:#fff;text-align:center;overflow:hidden;padding:var(--pad-y) 0}
.promessa__medalha{position:absolute;bottom:0;width:358px;max-width:none}
.promessa__medalha--esq{left:max(0px,calc(50% - 960px))}
.promessa__medalha--dir{right:max(0px,calc(50% - 960px))}
.promessa__inner{position:relative;width:800px;margin:0 auto;padding-top:0}
.promessa__lead{position:relative;left:21px;width:710px;margin:0 auto;font-size:21px;line-height:34px;letter-spacing:.008em}
.promessa__title{position:relative;left:21px;width:680px;margin:27px auto 0;font-weight:400;font-style:italic;font-size:45.9px;line-height:54px}
.promessa__valor{display:flex;align-items:center;justify-content:space-between;margin-top:29.4px;font-style:italic;font-size:23px;line-height:30px}
.promessa__valor span{position:relative;left:20px}
.promessa__valor::before,.promessa__valor::after{content:"";width:46px;height:1px;background:rgba(255,255,255,.55)}
.promessa__curso{position:relative;left:21px;width:620px;margin:38px auto 0;font-size:20px;line-height:31px}
.promessa__curso strong{font-weight:700}

/* ---------- CAMINHO ---------- */
.caminho{background:var(--rosa-2);padding-bottom:64px}
.caminho__inner{width:995px;margin:0 auto;padding-top:var(--pad-y)}
.caminho__top{display:flex;justify-content:space-between;align-items:flex-start}
.caminho .eyebrow{padding-top:4.8px}
.caminho__title{margin-top:18px;max-width:520px;font-weight:500;font-size:44px;line-height:50px;letter-spacing:-.015em}
.caminho__sub{margin-top:16px;max-width:480px;font-size:19px;line-height:28px;color:var(--marrom)}
.caminho__foto{width:396px;height:224px;border-radius:10px;object-fit:cover}
.passos{display:grid;grid-template-columns:1fr 1fr;gap:26px 48px;margin-top:39.8px}
.passo{display:flex;align-items:center;gap:14px;min-height:105.5px;padding:18px 22px;background:#fff;border-radius:10px}
.passo__n{flex:none;width:39.2px;font-weight:300;font-size:36px;line-height:1;letter-spacing:-.1em;color:var(--uva)}
.passo--wide{grid-column:1/-1}
.passo h3{font-weight:500;font-style:italic;font-size:21px;line-height:26px;color:var(--uva);margin-bottom:4px}
.passo p{font-size:16px;line-height:22px;color:var(--marrom)}
.caminho__fecho{margin-top:36px;text-align:center;font-size:17px;line-height:26px;color:var(--marrom)}
.caminho__btn{margin:28px auto 0}

/* ---------- QUEM ENSINA ---------- */
.ensina{background:var(--rosa-1);padding:64px 0 var(--pad-y)}
.ensina__inner{display:flex;align-items:center;gap:64px;width:995px;margin:0 auto}
.ensina__foto{flex:none;display:flex;align-items:center;justify-content:center;width:360px;aspect-ratio:3/4;border:2px dashed #c9a0c4;border-radius:10px;background:var(--rosa-2);color:#a85aa0;text-align:center;font-family:var(--serif);font-size:16px;line-height:1.4}
.ensina__texto p{font-size:18px;line-height:30px;color:var(--uva)}
.ensina__texto p+p{margin-top:14px}
.ensina__texto .eyebrow{margin-bottom:18px}
.ensina__texto .ensina__frase{font-weight:500;font-style:italic;font-size:30px;line-height:38px;color:var(--cafe)}
.ensina__texto .ensina__frase+p{margin-top:20px}

/* ---------- HISTÓRIAS ---------- */
.historias{background:var(--rosa-3);padding:var(--pad-y) 0;text-align:center}
.historias__head{display:flex;flex-direction:column;align-items:center;text-align:center}
.historias__title{margin-top:18px;font-weight:500;font-size:44px;line-height:49.4px;color:var(--cafe)}
.historias__title em{color:var(--uva)}
.historias__cards{display:flex;justify-content:center;gap:32px;width:1080px;margin:56px auto 0}
.polaroid{flex:1;padding:14px;background:var(--creme-card);border-radius:8px;box-shadow:0 16px 28px -8px rgba(87,11,79,.22),0 4px 10px rgba(87,11,79,.08)}
.polaroid img{width:100%;border-radius:7px}

/* ---------- OFERTA ---------- */
.oferta{position:relative;background:var(--uva-oferta);color:#fff;padding:var(--pad-y) 0;overflow:hidden}
.oferta__art{position:absolute;bottom:0;max-width:none}
.oferta__art--esq{left:max(0px,calc(50% - 960px));width:532px}
.oferta__inner{position:relative;width:458px;margin:0 auto;padding-top:0}
.oferta__lead{padding:0 6px;font-size:20.85px;line-height:33.3px}
.oferta__lead strong{font-weight:700;color:#f6c9e6}
.oferta__grupo{margin-top:36px;padding-left:10px;font-size:13px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:#f6c9e6}
.oferta__grupo--2{margin-top:30px}
.oferta__slot{margin:12px 0 0 10px;padding:9px 14px;border:1px dashed rgba(240,225,198,.45);border-radius:8px;font-size:15px;color:#c9b595}
.oferta__lista{margin-top:16px;padding-left:10px}
.oferta__lista li{position:relative;padding-left:43.8px;font-size:18.25px;line-height:26px;color:#f0e1c6}
.oferta__lista li+li{margin-top:22.8px}
.oferta__lista b{font-weight:500;color:#fff}
.oferta__lista li::before{content:"";position:absolute;left:0;top:.5px;width:25px;height:25px;border-radius:50%;
  background:var(--creme) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 26 26'%3E%3Cpath d='M7.5 13.4l3.7 3.7 7.4-7.6' fill='none' stroke='%235c0b53' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/25px no-repeat}
.preco{margin-top:40px;padding:34px 12px 32px;border:1px solid #6e4326;border-radius:8px;background:#230020;text-align:center}
.preco__de{font-size:18.4px;line-height:20px;color:#a98763}
.preco__de s{margin-right:8px}
.preco__valor{margin-top:6.6px;font-size:31px;line-height:62px;font-weight:300;color:#f2e4cc}
.preco__valor strong{margin-left:6px;font-size:55.5px;font-weight:700;letter-spacing:.01em}
.preco__pix{margin-top:6px;font-size:19.5px;line-height:22px;color:#e9d6b8}
.oferta__btn{margin:44px auto 0;box-shadow:0 18px 30px -6px rgba(0,0,0,.5),0 4px 10px rgba(0,0,0,.2)}
.oferta__note{margin-top:18.4px;font-size:11.5px;line-height:14px;text-align:center;color:#a98763}

/* ---------- GARANTIA + FAQ ---------- */
.garantia{background:var(--rosa-2);padding:var(--pad-y) 0}
.garantia__inner{width:860px;margin:0 auto}
.garantia__top{display:flex;align-items:flex-start;gap:38.4px;padding-bottom:58px;border-bottom:1.5px solid #e3c8d2}
.selo{flex:none;display:flex;flex-direction:column;align-items:center;justify-content:center;width:121px;height:121px;border:2px solid var(--pink);border-radius:50%;color:var(--pink);font-family:var(--serif)}
.selo__n{font-weight:400;font-size:49px;line-height:40px}
.selo__t{margin-top:7px;font-weight:500;font-size:10.5px;letter-spacing:.3em;text-transform:uppercase}
.garantia__title{margin-top:-4.8px;font-weight:500;font-size:38px;line-height:42px;color:var(--cafe)}
.garantia__text{max-width:640px;margin-top:3.6px;font-size:19px;line-height:31.8px;color:var(--uva)}
.faq{margin-top:68px;border-top:1.5px solid #e3c8d2}
.faq details{border-bottom:1.5px solid #e3c8d2}
.faq summary{position:relative;display:block;padding:18px 40px 18px 3.5px;font-size:23px;line-height:1.3;color:var(--uva);cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before,.faq summary::after{content:"";position:absolute;right:5.6px;top:50%;width:13.6px;height:1.5px;margin-top:2.6px;background:var(--uva);transition:transform .2s ease}
.faq summary::after{transform:rotate(90deg)}
.faq details[open] summary::after{transform:rotate(0)}
.faq summary:focus-visible{outline:2px solid var(--uva);outline-offset:2px}
.faq details p{padding:0 40px 24px 5px;font-size:17px;line-height:28px;color:var(--marrom)}
.garantia__btn{margin:60px auto 0}

/* ---------- RODAPÉ ---------- */
.rodape{background:var(--uva);height:192px;padding-top:60px;text-align:center;font-family:var(--serif)}
.rodape__cnpj{font-size:13px;line-height:18px;color:#c4a988}
.rodape__links{display:flex;justify-content:center;gap:10px;margin-top:11px;font-size:13px;line-height:16px;color:#e8d6bf}
.rodape__links a{text-decoration:none;border-bottom:1px solid rgba(232,214,191,.45)}
.rodape__links a:hover{border-bottom-color:#e8d6bf}
.rodape__links span{color:#8d5a6b}
.rodape__meta{margin-top:11px;font-size:13px;line-height:18px;color:#96705f}

/* =====================================================================
   RESPONSIVO
   O layout acima reproduz o Figma em 1920px. Abaixo, as adaptações.
   ===================================================================== */

/* notebooks: o hero deixa de ser um palco fixo de 1920px */
@media (max-width:1500px){
  .hero__stage{width:auto;margin-left:0}
  .hero__text{left:max(32px,calc(50% - 590px))}
  .hero__title{font-size:54px;line-height:65px}
  .hero__sub{font-size:23px;line-height:34px}
  .hero__art{left:auto;right:-2vw;top:auto;bottom:0;width:clamp(640px,60vw,920px);height:auto}
}

/* tablets e celulares */
@media (max-width:1140px){
  .hero br,.promessa br{display:none}
  :root{--pad-y:64px}
  .hero__stage{height:auto;display:flex;flex-direction:column;align-items:center;padding:56px 24px 0}
  .hero__text{position:static;width:100%;max-width:560px}
  .hero__title{font-size:clamp(34px,8.6vw,48px);line-height:1.2}
  .hero__sub{font-size:clamp(18px,4.6vw,21px);line-height:1.45}
  
  .hero__art{position:static;width:calc(100% + 48px);max-width:680px;margin:28px -24px 0}

  .promessa{padding:var(--pad-y) 24px 210px}
  .promessa__inner{width:auto;max-width:720px;padding-top:0}
  .promessa__lead,.promessa__title,.promessa__curso{left:0;width:auto}
  .promessa__lead{font-size:18px;line-height:30px}
  .promessa__title{font-size:clamp(28px,7.2vw,46px);line-height:1.17}
  .promessa__valor{font-size:clamp(17px,4.4vw,23px);gap:16px}
  .promessa__valor span{left:0}
  .promessa__valor::before,.promessa__valor::after{flex:none;width:28px}
  .promessa__curso{font-size:18px;line-height:29px}
  .promessa__medalha{width:190px}
  .promessa__medalha--esq{left:0}.promessa__medalha--dir{right:0}

  .caminho{padding:var(--pad-y) 24px 48px}
  .caminho__inner{width:auto;max-width:720px;padding-top:0}
  .caminho__top{flex-direction:column;gap:28px}
  .caminho__title{max-width:none;font-size:clamp(30px,7.6vw,44px);line-height:1.15}
  .caminho__foto{width:100%;height:auto;aspect-ratio:396/224}
  .passos{grid-template-columns:1fr;gap:16px;margin-top:28px}
  .passo{min-height:96px;padding:18px 20px}
  .passo h3{font-size:19px;line-height:24px}
  .caminho__sub{font-size:17px;line-height:26px}
  .ensina{padding:48px 24px var(--pad-y)}
  .ensina__inner{width:auto;max-width:720px;flex-direction:column;gap:28px}
  .ensina__foto{width:min(100%,320px)}
  .ensina__texto p{font-size:17px;line-height:28px}
  .ensina__texto .ensina__frase{font-size:clamp(22px,6vw,28px);line-height:1.3}
  .caminho__btn{margin-top:32px}

  .historias{padding:var(--pad-y) 0}
  .historias__head{padding:0 24px}
  .historias__title{margin-top:14px;font-size:clamp(28px,7.2vw,44px);line-height:1.15}
  .eyebrow--md{padding-left:0}
  .historias__cards{width:auto;justify-content:flex-start;gap:16px;margin-top:36px;padding:8px 24px 0;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch}
  .polaroid{flex:none;width:min(72vw,338px);scroll-snap-align:center}

  .oferta{padding:var(--pad-y) 24px}
  .oferta__inner{width:auto;max-width:458px;padding-top:0}
  .oferta__art{opacity:.3}
  .oferta__art--esq{left:-180px}
  .oferta__lead{padding:0;font-size:19px;line-height:31px}
  .oferta__lista{padding-left:0}
  .oferta__lista li{font-size:17px}
  .preco{padding:30px 12px 30px}
  .preco__valor{font-size:clamp(24px,6.4vw,31px)}
  .preco__valor strong{font-size:clamp(42px,12vw,55.5px)}
  .preco__pix{font-size:17px}

  .garantia{padding:var(--pad-y) 24px}
  .garantia__inner{width:auto;max-width:720px;padding-top:0}
  .garantia__top{gap:24px;padding-bottom:40px}
  .garantia__title{margin-top:0;font-size:clamp(26px,6.6vw,38px);line-height:1.15}
  .garantia__text{margin-top:10px;font-size:17px;line-height:28px}
  .faq{margin-top:40px}
  .faq summary{padding:18px 40px 18px 2px;font-size:clamp(18px,4.8vw,23px)}
  .garantia__btn{margin-top:40px}

  .rodape{height:auto;padding:44px 24px 48px}
}

@media (max-width:560px){
  .garantia__top{flex-direction:column}
  .selo{width:96px;height:96px}
  .selo__n{font-size:40px;line-height:34px}
  .promessa{padding-bottom:170px}
  .promessa__medalha{width:150px}
}

@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  .btn,.faq summary::before,.faq summary::after{transition:none}
}

/* Fotos reais (substituem os espaços reservados) */
.ensina__foto{border:0;background:none;padding:0;overflow:hidden;box-shadow:0 18px 36px -16px rgba(87,11,79,.35)}
.ensina__foto img{width:100%;height:100%;object-fit:cover;object-position:40% 30%;display:block}
.caminho__foto{object-position:50% 35%}

/* Elementos de fundo em traço fino (ChatGPT) */
.promessa__medalha{width:340px;bottom:-70px;opacity:.9}
.promessa__medalha--esq{left:max(-110px,calc(50% - 1070px))}
.promessa__medalha--dir{right:max(-110px,calc(50% - 1070px))}
.oferta__art{bottom:auto;top:50%;transform:translateY(-50%);opacity:.55}
.oferta__art--esq{left:max(20px,calc(50% - 900px));width:340px}
.oferta__art--dir{right:max(-40px,calc(50% - 960px));width:440px}
@media (max-width:1100px){.oferta__art{opacity:.25}.oferta__art--dir{right:-160px}.oferta__art--esq{left:-120px}}
@media (max-width:860px){.promessa__medalha{width:200px;bottom:-40px}.promessa__medalha--esq{left:-70px}.promessa__medalha--dir{right:-70px}}
@media (max-width:420px){.promessa__medalha{width:160px}}

/* ---------- Detalhes de acabamento (elementos do ChatGPT) ---------- */
.caminho,.ensina,.historias,.garantia{position:relative;overflow:hidden}
.caminho>*:not(.orn),.ensina>*:not(.orn),.historias>*:not(.orn),.garantia>*:not(.orn){position:relative;z-index:1}
.orn{position:absolute;pointer-events:none;user-select:none;z-index:0;height:auto}
.orn--caminho-canto{left:max(16px,calc(50% - 700px));bottom:40px;width:180px;opacity:.22;transform:scaleY(-1)}
.orn--ensina-lirios{right:max(10px,calc(50% - 680px));bottom:-10px;width:170px;opacity:.10}
.orn--hist-filigrana{right:max(10px,calc(50% - 690px));bottom:20px;width:150px;opacity:.12}
.orn--garantia-arco{right:max(10px,calc(50% - 640px));top:60px;width:110px;opacity:.20}
.orn-filete{position:static;display:block;width:120px;height:auto;margin:14px auto 0;opacity:.55;pointer-events:none}
.orn-filete--faq{width:110px;margin:8px auto 28px;opacity:.45}
.ensina__foto{position:relative;overflow:visible}
.ensina__foto::after{content:"";position:absolute;top:-16px;right:-16px;width:64px;height:56px;background:url(orn-canto-duplo.png) no-repeat top right/contain;opacity:.45;pointer-events:none}
@media (max-width:860px){.orn--caminho-canto,.orn--ensina-lirios,.orn--hist-filigrana,.orn--garantia-arco{width:100px;opacity:.08}.ensina__foto::after{top:-10px;right:-10px;width:44px;height:38px}}
.ensina__foto img{border-radius:10px}
.polaroid img{aspect-ratio:311/552;object-fit:cover;display:block}
