/* ==========================================================================
   COMPONENTES — Liga do Sofá / OXSIDE Design System
   Cópia fiel de components/{actions,typography,layout,surfaces,data,content,
   media,offer,chrome}.css + motion.css, na mesma ordem do styles.css do sistema.
   Não editar para resolver um caso da página: extensões vivem em page.css.
   ========================================================================== */

/* --------------------------------------------------------------------------
   ACTIONS — um único botão de CTA em todo o sistema. Ele é reconhecível por
   repetição, não por decoração: violeta sólido, label branco, sem ícone,
   sem gradiente, sem borda.
   -------------------------------------------------------------------------- */
.ds-btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--s-2);font-family:var(--font-body);font-weight:700;font-size:17px;letter-spacing:var(--track-button);line-height:1;text-align:center;text-decoration:none;padding:18px 40px;min-height:56px;border:0;border-radius:var(--r-full);background:var(--violet-500);color:#fff;box-shadow:var(--glow-cta);cursor:pointer;transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out),box-shadow var(--dur-fast) var(--ease-out)}
.ds-btn:hover{background:var(--violet-400);color:#fff;transform:translateY(var(--lift-button));box-shadow:var(--glow-cta-hover)}
.ds-btn:active{background:var(--violet-600);transform:translateY(0)}
.ds-btn--sm{padding:12px 22px;min-height:44px;font-size:14px}
.ds-btn--lg{padding:22px 56px;min-height:64px;font-size:18px}
.ds-btn--full{display:flex;width:100%}
/* O único brilho pulsante da página: o CTA da oferta. */
.ds-btn--breathing{animation:ds-breathe 8s var(--ease-out) infinite}
@keyframes ds-breathe{0%,100%{box-shadow:0 8px 32px rgba(148,75,250,.28)}50%{box-shadow:0 10px 44px rgba(148,75,250,.38)}}
/* CTA e microcopy andam sempre juntos. */
.ds-cta{display:flex;flex-direction:column;align-items:flex-start;gap:var(--s-3)}
.ds-cta--center{align-items:center;text-align:center}
.ds-cta--full{align-items:stretch}
.ds-cta__note{margin:0;font-size:var(--fs-label);line-height:var(--lh-label);color:var(--ink-400);font-variant-numeric:tabular-nums}
.ds-cta--full .ds-cta__note{text-align:center}
/* Ação secundária: texto + seta. Nunca um segundo botão preenchido. */
.ds-textlink{display:inline-flex;align-items:center;gap:var(--s-2);font-family:var(--font-body);font-weight:600;font-size:var(--fs-body);color:var(--violet-400);text-decoration:none;background:none;border:0;padding:12px 0;min-height:44px;cursor:pointer;transition:color var(--dur-fast) var(--ease-out),gap var(--dur-fast) var(--ease-out)}
.ds-textlink:hover{color:var(--cyan-400);gap:12px}
.ds-textlink__arrow{transition:transform var(--dur-fast) var(--ease-out)}
.ds-textlink:hover .ds-textlink__arrow{transform:translateX(2px)}
@media (max-width:768px){
  .ds-btn{width:100%;padding:18px 24px}
  .ds-cta{align-items:stretch}
  .ds-cta__note{text-align:center}
}

/* --------------------------------------------------------------------------
   TIPOGRAFIA — peças. O espaço acima de um título é ~2x o espaço abaixo:
   um título pertence ao bloco que vem depois dele.
   -------------------------------------------------------------------------- */
.ds-eyebrow{display:flex;align-items:center;gap:12px;margin:0 0 var(--s-4);font-family:var(--font-body);font-weight:600;font-size:var(--fs-label);line-height:var(--lh-label);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--violet-500)}
.ds-eyebrow::before{content:"";width:24px;height:1px;background:currentColor;flex:none}
.ds-eyebrow--cyan{color:var(--cyan-500)}
.ds-eyebrow--muted{color:var(--ink-400)}

.ds-section-header{max-width:var(--measure-header)}
.ds-section-header--center{margin-inline:auto;text-align:center}
.ds-section-header--center .ds-eyebrow{justify-content:center}
.ds-section-header__title{margin:0}
.ds-section-header__lede{margin:var(--s-4) 0 0;max-width:var(--measure-prose);font-size:var(--fs-body-lg);line-height:var(--lh-body-lg);color:var(--ink-200)}
.ds-section-header--center .ds-section-header__lede{margin-inline:auto}
.ds-section-header + *{margin-top:var(--s-12)}

/* O gradiente de assinatura em texto é permitido EXATAMENTE DUAS vezes por página. */
.ds-grad{background:var(--grad-signature);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}

/* Corpo de texto: alinhado à esquerda, 65ch, 24px entre parágrafos. Nunca justificado. */
.ds-prose{max-width:var(--measure-prose);font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink-200);text-align:left}
.ds-prose > p{margin:0 0 var(--s-6)}
.ds-prose > p:last-child{margin-bottom:0}
.ds-prose strong{color:var(--ink-000);font-weight:600}

/* Frase de fechamento: fios de cabelo acima e abaixo, não um card. */
.ds-pullquote{max-width:var(--measure-prose);margin:var(--s-12) 0 0;padding:var(--s-8) 0;border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);font-size:var(--fs-body-lg);line-height:var(--lh-body-lg);font-weight:600;color:var(--ink-000);text-wrap:pretty}
.ds-pullquote p{margin:0}

/* --------------------------------------------------------------------------
   LAYOUT — o mapa de ritmo vive aqui. O padding vertical é 3–6x o lateral;
   essa diferença é o ar editorial. Splits são 7/5 ou 5/7, nunca 6/6.
   -------------------------------------------------------------------------- */
.ds-section{position:relative;isolation:isolate;padding:var(--sec-y) var(--sec-x);background:var(--bg-000);overflow:clip}
.ds-section--alt{background:var(--bg-050)}
.ds-section--band{padding-top:var(--sec-y-band);padding-bottom:var(--sec-y-band)}
.ds-section--focal{padding-top:var(--sec-y-focal);padding-bottom:var(--sec-y-focal)}
.ds-section--flush{padding-left:0;padding-right:0}
@media (min-width:768px){.ds-section{padding-left:var(--sec-x-lg);padding-right:var(--sec-x-lg)}}

.ds-container{width:100%;max-width:var(--container);margin-inline:auto}
.ds-container--prose{max-width:var(--measure-prose)}

/* Atmosfera, não fundo. Radial, difusa, ~7%. Alternar o canto de seção em
   seção — o mesmo canto duas vezes seguidas lê como template. */
.ds-wash{position:absolute;inset:0;z-index:-1;pointer-events:none;filter:blur(var(--wash-blur))}
.ds-wash::before,.ds-wash::after{content:"";position:absolute;width:62%;aspect-ratio:1;border-radius:50%}
.ds-wash::before{background:radial-gradient(circle,rgba(148,75,250,.07) 0%,transparent 70%)}
.ds-wash::after{background:radial-gradient(circle,rgba(34,211,238,.05) 0%,transparent 70%)}
.ds-wash--tl::before{top:-18%;left:-14%}
.ds-wash--tl::after{bottom:-20%;right:-12%}
.ds-wash--tr::before{top:-18%;right:-14%}
.ds-wash--tr::after{bottom:-20%;left:-12%}
.ds-wash--bl::before{bottom:-18%;left:-14%}
.ds-wash--bl::after{top:-20%;right:-12%}
.ds-wash--center::before{top:50%;left:50%;width:78%;transform:translate(-50%,-50%);background:radial-gradient(circle,rgba(148,75,250,.12) 0%,transparent 68%)}
.ds-wash--center::after{top:50%;left:-20%;width:56%;transform:translateY(-50%);background:radial-gradient(circle,rgba(34,211,238,.06) 0%,transparent 70%)}
.ds-wash--none::before,.ds-wash--none::after{display:none}

.ds-split{display:grid;gap:var(--s-8)}
@media (min-width:1024px){
  .ds-split{gap:var(--gutter);align-items:center}
  .ds-split--75{grid-template-columns:7fr 5fr}
  .ds-split--57{grid-template-columns:5fr 7fr}
  .ds-split--top{align-items:start}
}
.ds-sticky{position:static}
@media (min-width:1024px){.ds-sticky{position:sticky;top:96px}}

/* --------------------------------------------------------------------------
   SUPERFÍCIES. Regra dura: um elemento carrega no máximo DOIS tratamentos
   (borda · raio · sombra · gradiente). Card com borda nunca também ganha sombra.
   -------------------------------------------------------------------------- */
.ds-card{position:relative;background:var(--surface-100);border:1px solid var(--line-soft);border-radius:var(--r-md);padding:var(--pad-card);overflow:hidden;transition:border-color var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}
@media (hover:hover) and (min-width:1024px){
  .ds-card--interactive:hover{border-color:var(--line);transform:translateY(var(--lift-card))}
}
/* Highlight = filete de assinatura de 2px na aresta de topo + fio de acento. Sem sombra. */
.ds-card--highlight{border-color:var(--line)}
.ds-card--highlight::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--grad-signature)}
.ds-card--focal{padding:var(--pad-card-focal);border-radius:var(--r-lg);border-color:rgba(148,75,250,.4)}
.ds-card__title{margin:0 0 var(--s-3)}
.ds-card__body{margin:0;color:var(--ink-200);font-size:var(--fs-body);line-height:var(--lh-body)}
/* Raio aninhado = raio externo − padding. Card de 16px com 28px de padding → mídia em r-sm. */
.ds-card__media{border-radius:var(--r-sm);overflow:hidden}

.ds-badge{display:inline-flex;align-items:center;gap:var(--s-2);padding:8px 14px;border-radius:var(--r-full);background:var(--violet-wash);border:1px solid var(--line);color:var(--violet-400);font-family:var(--font-body);font-weight:600;font-size:var(--fs-label);letter-spacing:var(--track-caps);text-transform:uppercase;line-height:1}
.ds-badge--cyan{background:var(--cyan-wash);border-color:rgba(34,211,238,.2);color:var(--cyan-400)}
.ds-badge--neutral{background:rgba(255,255,255,.04);border-color:var(--line-soft);color:var(--ink-400)}

.ds-hairline{height:1px;background:var(--line-soft);border:0;margin:var(--s-6) 0}
/* Substituto claramente marcado para material do cliente que ainda não existe. */
.ds-placeholder{display:flex;align-items:center;justify-content:center;text-align:center;gap:var(--s-2);padding:var(--s-6);background:repeating-linear-gradient(135deg,rgba(148,75,250,.06) 0 10px,transparent 10px 20px);border:1px dashed rgba(148,75,250,.45);border-radius:var(--r-md);color:var(--violet-400);font-family:var(--font-body);font-weight:600;font-size:var(--fs-label);letter-spacing:var(--track-caps);text-transform:uppercase}

/* --------------------------------------------------------------------------
   DADOS — números. Toda cifra e todo preço é tabular-nums, ou as colunas
   não alinham.
   -------------------------------------------------------------------------- */
.ds-statband{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-8) 0}
@media (min-width:768px){.ds-statband{grid-template-columns:repeat(4,1fr)}}
.ds-stat{display:flex;flex-direction:column;gap:var(--s-2);padding:0 var(--s-4);text-align:center;align-items:center}
@media (min-width:768px){
  .ds-stat{border-left:1px solid var(--line-soft)}
  .ds-stat:first-child{border-left:0}
}
.ds-stat__icon{color:var(--cyan-500);margin-bottom:var(--s-1)}
.ds-stat__value{font-family:var(--font-display);font-weight:700;font-size:clamp(30px,4vw,40px);line-height:1.1;letter-spacing:var(--track-display);color:var(--ink-000);font-variant-numeric:tabular-nums}
.ds-stat__label{font-size:var(--fs-label);line-height:var(--lh-label);color:var(--ink-400);font-weight:500}

.ds-chiprow{display:flex;flex-wrap:wrap;gap:var(--s-2)}
.ds-chip{display:inline-flex;align-items:baseline;gap:6px;padding:10px 14px;border-radius:var(--r-sm);background:var(--violet-wash);border:1px solid var(--line)}
.ds-chip__value{font-family:var(--font-display);font-weight:700;font-size:15px;color:var(--ink-000);font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.ds-chip__label{font-family:var(--font-body);font-weight:500;font-size:13px;color:var(--ink-400)}

.ds-price{display:flex;flex-direction:column;gap:var(--s-2);font-variant-numeric:tabular-nums}
.ds-price--center{align-items:center;text-align:center}
.ds-price__anchor{font-size:var(--fs-body);color:var(--strike);margin:0}
.ds-price__anchor s{text-decoration-thickness:1px;text-underline-offset:2px}
.ds-price__main{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;justify-content:inherit}
.ds-price__prefix{font-family:var(--font-body);font-weight:500;font-size:var(--fs-body-lg);color:var(--ink-200)}
.ds-price__value{font-family:var(--font-display);font-weight:800;font-size:var(--fs-price);line-height:1;letter-spacing:-.03em}
.ds-price__cash{margin:0;font-size:var(--fs-body);color:var(--ink-200)}
.ds-price__cash strong{color:var(--ink-000);font-weight:600}

/* --------------------------------------------------------------------------
   BLOCOS DE CONTEÚDO. Duas seções consecutivas não podem usar a mesma forma:
   atos editoriais · grade vertical · faixa horizontal · timeline · card único
   · grade de 2 colunas.
   -------------------------------------------------------------------------- */
.ds-checklist{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.ds-checklist__item{display:flex;align-items:flex-start;gap:12px;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink-200)}
/* Óptico, não matemático: um check de 18px ao lado de texto de 17px fica 1px abaixo. */
.ds-checklist__icon{margin-top:1px;color:var(--cyan-500)}
.ds-checklist__item strong{color:var(--ink-000);font-weight:600}

/* CARD DE MÓDULO — o numeral é o grafismo. Nenhum ícone aqui. */
.ds-module{position:relative;display:flex;flex-direction:column;height:100%}
.ds-module__num{position:absolute;top:14px;right:20px;font-family:var(--font-display);font-weight:800;font-size:var(--fs-module-numeral);line-height:1;color:rgba(148,75,250,.2);letter-spacing:-.04em;pointer-events:none;font-variant-numeric:tabular-nums}
.ds-module__kicker{margin:0 0 var(--s-2);font-family:var(--font-body);font-weight:600;font-size:var(--fs-label);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-400)}
.ds-module__title{margin:0 0 var(--s-6);padding-right:64px}

/* CARD DE MOTIVO — um ícone de linha violeta de 32px, título, duas linhas de texto. */
.ds-reason{display:flex;flex-direction:column;height:100%}
.ds-reason__icon{color:var(--violet-500);margin-bottom:var(--s-4)}
.ds-reason__title{margin:0 0 var(--s-2)}
.ds-reason__body{margin:0;color:var(--ink-200);font-size:var(--fs-body);line-height:var(--lh-body)}
.ds-grid-2{display:grid;gap:var(--s-6);grid-template-columns:1fr}
@media (min-width:1024px){.ds-grid-2{grid-template-columns:repeat(2,1fr)}}
.ds-grid-3{display:grid;gap:var(--s-6);grid-template-columns:1fr}
@media (min-width:768px){.ds-grid-3{grid-template-columns:repeat(2,1fr)}}
@media (min-width:1024px){.ds-grid-3{grid-template-columns:repeat(3,1fr)}}

/* ATO DA HISTÓRIA — um marcador de assinatura de 2px, sem card. */
.ds-act{position:relative;padding-left:var(--s-6);max-width:var(--measure-prose)}
.ds-act + .ds-act{margin-top:var(--s-12)}
.ds-act::before{content:"";position:absolute;left:0;top:6px;bottom:6px;width:2px;background:var(--grad-signature);border-radius:1px}
.ds-act__label{margin:0 0 var(--s-3);font-family:var(--font-body);font-weight:600;font-size:var(--fs-label);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-400)}
.ds-act__body{margin:0;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink-200)}
.ds-act__body p{margin:0 0 var(--s-6)}
.ds-act__body p:last-child{margin-bottom:0}

/* TIMELINE — horizontal no desktop, vertical no mobile. */
.ds-timeline{display:grid;gap:var(--s-8);grid-template-columns:1fr;counter-reset:step}
@media (min-width:1024px){.ds-timeline{grid-template-columns:repeat(3,1fr);gap:var(--gutter)}}
.ds-step{position:relative;display:flex;gap:var(--s-4);align-items:flex-start}
@media (min-width:1024px){
  .ds-step{flex-direction:column;gap:var(--s-6);padding-right:var(--s-8)}
  .ds-step:not(:last-child)::after{content:"";position:absolute;left:56px;top:21px;right:0;height:1px;background:linear-gradient(90deg,rgba(148,75,250,.4),rgba(34,211,238,.16))}
}
.ds-step__num{position:relative;z-index:1;flex:none;width:44px;height:44px;border-radius:var(--r-full);background:var(--bg-000);box-shadow:inset 0 0 0 1px var(--line),0 0 0 6px var(--bg-000);display:grid;place-items:center;font-family:var(--font-display);font-weight:700;font-size:18px;color:var(--violet-400);font-variant-numeric:tabular-nums;padding-bottom:2px}
.ds-section--alt .ds-step__num{background:var(--bg-050);box-shadow:inset 0 0 0 1px var(--line),0 0 0 6px var(--bg-050)}
.ds-step__body{margin:0;font-size:var(--fs-body);line-height:var(--lh-body);color:var(--ink-200);max-width:46ch}

/* --------------------------------------------------------------------------
   MÍDIA — toda imagem declara a própria proporção. Uma imagem nunca define
   a própria altura e nunca flutua dentro de uma caixa com margem em volta.
   -------------------------------------------------------------------------- */
.ds-frame{position:relative;overflow:hidden;border-radius:var(--r-lg);border:1px solid var(--line);background:var(--surface-100)}
.ds-frame > img,.ds-frame > iframe,.ds-frame > video{width:100%;height:100%;object-fit:cover;border:0}
.ds-frame--16x9{aspect-ratio:16/9}
.ds-frame--4x5{aspect-ratio:4/5}
.ds-frame--3x2{aspect-ratio:3/2}
.ds-frame--9x16{aspect-ratio:9/16;border-radius:var(--r-md)}
.ds-glow-behind{position:relative}
.ds-glow-behind::before{content:"";position:absolute;inset:8%;z-index:-1;border-radius:var(--r-lg);box-shadow:var(--glow-media)}

/* Fachada de vídeo: o iframe só é injetado no clique. */
.ds-facade{position:relative;display:block;width:100%;padding:0;border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;background:var(--surface-100);aspect-ratio:16/9;cursor:pointer}
.ds-facade__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ds-facade__scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.1),rgba(0,0,0,.45))}
.ds-facade__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:76px;height:76px;border-radius:var(--r-full);background:var(--violet-500);display:grid;place-items:center;box-shadow:var(--glow-cta);transition:background var(--dur-fast) var(--ease-out),transform var(--dur-fast) var(--ease-out)}
.ds-facade:hover .ds-facade__play{background:var(--violet-400);transform:translate(-50%,-50%) scale(1.06)}
.ds-facade__play svg{margin-left:3px}
.ds-facade__label{position:absolute;left:var(--s-4);bottom:var(--s-4);font-size:var(--fs-label);letter-spacing:var(--track-caps);text-transform:uppercase;color:var(--ink-200);font-weight:600}
.ds-facade iframe{position:absolute;inset:0;width:100%;height:100%}

/* Tile de galeria: a imagem É o conteúdo — recortada, nunca com padding. */
.ds-tile{position:relative;overflow:hidden;border-radius:var(--r-md);aspect-ratio:9/16;background:var(--surface-100);transition:transform var(--dur-fast) var(--ease-out)}
.ds-tile > img{width:100%;height:100%;object-fit:cover}
@media (hover:hover){.ds-tile:hover{transform:scale(1.02)}}
.ds-tile__scrim{position:absolute;inset:0;background:var(--scrim-media)}
.ds-tile__meta{position:absolute;left:14px;right:14px;bottom:14px;display:flex;align-items:center;gap:8px;color:#fff}
.ds-tile__views{font-family:var(--font-display);font-weight:700;font-size:17px;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.ds-tile__platform{color:var(--violet-500)}
.ds-tile__caption{position:absolute;left:14px;right:14px;bottom:44px;font-size:13px;line-height:1.35;color:rgba(255,255,255,.86);font-weight:500}
.ds-gallery{display:grid;grid-template-columns:repeat(2,1fr);gap:var(--s-4)}
@media (min-width:1024px){.ds-gallery{grid-template-columns:repeat(3,1fr)}}
.ds-platformrow{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-6);margin-top:var(--s-8);color:var(--ink-400);font-size:var(--fs-label);letter-spacing:var(--track-caps);text-transform:uppercase;font-weight:600}
.ds-platformrow > span{display:inline-flex;align-items:center;gap:8px}

/* Retrato com selo flutuante opcional. */
.ds-portrait{position:relative}
.ds-portrait__seal{position:absolute;left:-8px;bottom:24px;padding:10px 16px;border-radius:var(--r-full);background:var(--bar-bg);backdrop-filter:var(--bar-blur);-webkit-backdrop-filter:var(--bar-blur);border:1px solid var(--line);color:var(--ink-200);font-size:11px;font-weight:600;letter-spacing:var(--track-caps);text-transform:uppercase;white-space:nowrap}

/* --------------------------------------------------------------------------
   OFERTA — o bloco focal da página. O único card com borda colorida,
   o único com 40px de padding, o único com brilho externo.
   -------------------------------------------------------------------------- */
.ds-offer{width:100%;max-width:560px;margin-inline:auto;position:relative;background:var(--surface-100);border:1px solid rgba(148,75,250,.4);border-radius:var(--r-lg);padding:var(--pad-card-focal);box-shadow:var(--glow-focal);overflow:hidden;text-align:left}
.ds-offer::before{content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--grad-signature)}
.ds-offer__head{display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);margin-bottom:var(--s-6)}
.ds-offer__list{margin:0 0 var(--s-6)}
.ds-offer__price{margin:var(--s-6) 0 var(--s-8)}
.ds-offer__secure{display:flex;align-items:flex-start;gap:10px;margin:var(--s-4) 0 0;font-size:var(--fs-label);line-height:var(--lh-label);color:var(--ink-400)}
.ds-offer__secure svg{margin-top:1px;color:var(--cyan-500)}
.ds-offer__pay{display:flex;align-items:center;gap:14px;margin-top:var(--s-4);color:var(--ink-400);font-size:11px;font-weight:600;letter-spacing:var(--track-caps);text-transform:uppercase}
.ds-offer__pay span{padding:5px 9px;border:1px solid var(--line-soft);border-radius:6px}
@media (max-width:768px){.ds-offer{padding:var(--s-8) var(--s-6)}}

/* SUPORTE — faixa horizontal compacta, não uma seção de altura cheia. */
.ds-support{display:grid;gap:var(--s-8);align-items:center;grid-template-columns:1fr}
@media (min-width:1024px){.ds-support{grid-template-columns:7fr 5fr;gap:var(--s-16)}}
.ds-support__icon{color:var(--cyan-500);margin-bottom:var(--s-4)}
.ds-support__title{margin:0 0 var(--s-3);font-size:var(--fs-h3)}
.ds-support__body{margin:0;color:var(--ink-200);max-width:46ch}

/* --------------------------------------------------------------------------
   CHROME — barras fixas e rodapé.
   -------------------------------------------------------------------------- */
.ds-topbar{position:fixed;inset:0 0 auto;z-index:50;height:60px;display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);padding:0 var(--sec-x);background:var(--bar-bg);backdrop-filter:var(--bar-blur);-webkit-backdrop-filter:var(--bar-blur);border-bottom:1px solid var(--line-soft);opacity:0;transform:translateY(-100%);transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out);pointer-events:none}
.ds-topbar[data-visible="true"]{opacity:1;transform:none;pointer-events:auto}
@media (min-width:768px){.ds-topbar{padding:0 var(--sec-x-lg)}}
.ds-topbar__inner{width:100%;max-width:var(--container);margin-inline:auto;display:flex;align-items:center;justify-content:space-between;gap:var(--s-4)}
.ds-topbar .ds-btn{width:auto}

/* Barra de oferta mobile — aparece após 40% de rolagem, respeita o inset do indicador. */
.ds-mobilebar{position:fixed;inset:auto 0 0;z-index:50;display:flex;align-items:center;justify-content:space-between;gap:var(--s-4);min-height:68px;padding:12px var(--sec-x);padding-bottom:calc(12px + env(safe-area-inset-bottom));background:var(--bar-bg-strong);backdrop-filter:var(--bar-blur);-webkit-backdrop-filter:var(--bar-blur);border-top:1px solid var(--line);opacity:0;transform:translateY(100%);transition:opacity 240ms var(--ease-out),transform 240ms var(--ease-out);pointer-events:none}
.ds-mobilebar[data-visible="true"]{opacity:1;transform:none;pointer-events:auto}
@media (min-width:1024px){.ds-mobilebar{display:none}}
.ds-mobilebar__price{display:flex;flex-direction:column;gap:2px;font-variant-numeric:tabular-nums}
.ds-mobilebar__price b{font-family:var(--font-display);font-weight:700;font-size:17px;color:var(--ink-000);letter-spacing:-.01em}
.ds-mobilebar__price span{font-size:11px;color:var(--ink-400);letter-spacing:.04em;text-transform:uppercase}
.ds-mobilebar .ds-btn{width:auto;flex:none;padding:14px 24px;min-height:48px;font-size:15px}

/* Wordmark tipografado — o arquivo de logo real não foi fornecido (ver README). */
.ds-wordmark{display:inline-flex;flex-direction:column;gap:3px;font-family:var(--font-display);color:var(--ink-000);text-decoration:none;line-height:1}
.ds-wordmark__name{font-weight:700;font-size:16px;letter-spacing:.02em;text-transform:uppercase}
.ds-wordmark__sign{font-family:var(--font-body);font-weight:500;font-size:9px;letter-spacing:.24em;text-transform:uppercase;color:var(--ink-400)}
.ds-wordmark--lg .ds-wordmark__name{font-size:22px}
.ds-wordmark--lg .ds-wordmark__sign{font-size:10px}
a.ds-wordmark:hover{color:var(--ink-000)}

.ds-footer{background:var(--bg-050);border-top:1px solid var(--line-soft);padding:var(--s-16) var(--sec-x) var(--s-12)}
@media (min-width:768px){.ds-footer{padding-left:var(--sec-x-lg);padding-right:var(--sec-x-lg)}}
.ds-footer__top{display:grid;gap:var(--s-8);grid-template-columns:1fr}
@media (min-width:768px){.ds-footer__top{grid-template-columns:5fr 7fr;gap:var(--s-16);align-items:start}}
.ds-footer__social{display:flex;gap:var(--s-2);margin-top:var(--s-6)}
.ds-footer__social a{display:grid;place-items:center;width:44px;height:44px;border-radius:var(--r-sm);color:var(--ink-400);transition:color var(--dur-fast) var(--ease-out),background var(--dur-fast) var(--ease-out)}
.ds-footer__social a:hover{color:var(--violet-500);background:var(--violet-wash)}
.ds-footer__links{display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-6);margin:0 0 var(--s-6);padding:0;list-style:none}
.ds-footer__links a{color:var(--ink-200);font-size:var(--fs-label);letter-spacing:.02em}
.ds-footer__links a:hover{color:var(--violet-400)}
.ds-footer__fine{display:flex;flex-direction:column;gap:var(--s-3);margin:0;font-size:var(--fs-label);line-height:1.55;color:var(--ink-600)}
.ds-footer__bottom{display:flex;flex-wrap:wrap;justify-content:space-between;gap:var(--s-4);margin-top:var(--s-12);padding-top:var(--s-6);border-top:1px solid var(--line-soft);font-size:var(--fs-label);color:var(--ink-600)}

/* --------------------------------------------------------------------------
   MOVIMENTO — deliberadamente escasso. O fade-up roda UMA vez, e só no hero,
   na faixa de stats, nos cards de módulo e no card da oferta.
   Texto corrido nunca entra animado.
   -------------------------------------------------------------------------- */
.ds-reveal{opacity:0;transform:translateY(18px);transition:opacity var(--dur-enter) var(--ease-out),transform var(--dur-enter) var(--ease-out)}
.ds-reveal[data-shown="true"]{opacity:1;transform:none}
.ds-reveal--d1{transition-delay:60ms}
.ds-reveal--d2{transition-delay:120ms}
.ds-reveal--d3{transition-delay:180ms}
@media (prefers-reduced-motion:reduce){
  .ds-reveal{opacity:1;transform:none;transition:none}
  .ds-btn--breathing{animation:none}
}