/* ============================================================
   AXOS — Home v2.1: refinamento de grid, ritmo, motion e conteúdo
   ============================================================ */

/* ---------- 01. GRID BASE ---------- */
:root{
  --container-max: 1280px;
  --container-pad: 48px;
  --grid-gap: 24px;
  --rhythm-chapter: 144px;
  --rhythm-section-pad: 96px;
  --rhythm-eyebrow-headline: 16px;
  --rhythm-headline-copy: 24px;
  --rhythm-head-content: 56px;
  --ease-ui: 300ms;
  --ease-scene: 750ms;
}
@media (max-width:1279px){
  :root{ --container-pad: 32px; --grid-gap: 20px; }
}
@media (max-width:767px){
  :root{
    --container-pad: 20px; --grid-gap: 16px;
    --rhythm-chapter: 88px; --rhythm-section-pad: 64px;
    --rhythm-eyebrow-headline: 12px; --rhythm-headline-copy: 20px; --rhythm-head-content: 36px;
  }
  /* refinamento mobile — escopado à home (body.home), não vaza pra ofertas/diagnóstico/etc */
  body.home{
    --container-pad: 24px;
    --rhythm-chapter: 80px; --rhythm-headline-copy: 18px; --rhythm-head-content: 32px;
    /* sistema mobile: família única de card + espaçamento */
    --m-gap-sm: 12px; --m-gap: 16px; --m-gap-lg: 24px;
    --m-card-radius: 22px;
    --m-card-bg: rgba(255,255,255,.55);
    --m-card-border: 1px solid rgba(59,67,70,.12);
    --m-card-shadow: 0 10px 30px -20px rgba(20,30,40,.30);
  }
}

.wrap{ max-width: var(--container-max); padding-left: var(--container-pad); padding-right: var(--container-pad); margin-left:auto; margin-right:auto; }
nav{ max-width: var(--container-max); padding-left: var(--container-pad); padding-right: var(--container-pad); }
.hero-text{ max-width: var(--container-max); padding-left: var(--container-pad); padding-right: var(--container-pad); }

.grid-12{ display:grid; grid-template-columns:repeat(12,1fr); gap:var(--grid-gap); }

/* ---------- 02. RITMO VERTICAL ---------- */
.section-head h2{ margin-top: var(--rhythm-eyebrow-headline) !important; }
.section-head p{ margin-top: var(--rhythm-headline-copy) !important; }

.pulse-explorer{ margin-top: var(--rhythm-head-content); }
.work-cards{ margin-top: var(--rhythm-head-content); }
.transform-grid{ margin-top: var(--rhythm-head-content); }
.case-grid{ margin-top: var(--rhythm-head-content); }

.patterns-section{ padding-top: var(--rhythm-section-pad); padding-bottom: var(--rhythm-section-pad); }
.pulse-section{ padding-top: var(--rhythm-section-pad); padding-bottom: var(--rhythm-section-pad); }
.transform-section{ padding-top: var(--rhythm-section-pad); padding-bottom: var(--rhythm-section-pad); }
.work-section{ padding-top: var(--rhythm-section-pad); padding-bottom: var(--rhythm-section-pad); }
.applied-section{ padding-top: var(--rhythm-section-pad); padding-bottom: var(--rhythm-section-pad); }
.final-v2{ padding-top: var(--rhythm-chapter); padding-bottom: var(--rhythm-chapter); }

/* ---------- 03. LINE BREAKS ---------- */
h1, h2, h3{ text-wrap: balance; }
p{ text-wrap: pretty; }
.hero-text h1{ max-width:900px; }
.section-head h2{ max-width:760px; }
.section-head p{ max-width:620px; }
main p{ max-width:60ch; }

/* ---------- utilitário: cartão escuro ---------- */
.dark-card{
  background:var(--ink); color:var(--paper); border-radius:20px; position:relative; overflow:hidden;
}
.dark-card::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.dark-card > *{position:relative; z-index:1;}

/* ============================================================
   HERO — direção visual nova (cinza tech, tipografia dominante)
   ============================================================ */
.hero{
  background:
    radial-gradient(ellipse 900px 600px at 82% 8%, rgba(255,255,255,.55), transparent 60%),
    linear-gradient(160deg, #E6E9E8 0%, #DBDFDE 32%, #CDD3D4 66%, #BFC6C8 100%);
}
.hero .grid-lines{
  opacity:1;
  background-image:repeating-linear-gradient(to right, transparent, transparent calc(100%/6 - 1px), rgba(17,17,17,.07) calc(100%/6 - 1px), rgba(17,17,17,.07) calc(100%/6));
}
.hero .blob-a{
  background:radial-gradient(circle at 35% 35%, #C6CDCE, #9AA6A8 55%, transparent 76%);
  opacity:.45;
}
.hero .blob-b{
  background:radial-gradient(circle at 40% 40%, #AEB9BB, #E3E7E6 60%, transparent 76%);
  opacity:.35;
}
.hero .grain-layer{ opacity:.2; }

/* hero: todo o conteúdo centralizado */
.hero-text{ text-align:center; display:flex; flex-direction:column; align-items:center; }

/* pill / label */
.hero-pill{
  display:inline-flex; align-items:center; gap:8px;
  padding:8px 16px 8px 12px; border-radius:20px;
  border:1px solid rgba(17,17,17,.14); background:rgba(255,255,255,.45);
  font-family:'Instrument Sans', sans-serif; font-size:10.5px; letter-spacing:.14em; text-transform:uppercase;
  color:#20272A; backdrop-filter:blur(6px);
}
.hero-pill .hp-dot{width:6px; height:6px; border-radius:50%; background:#5B7EE8; flex-shrink:0; animation:hs-blink 2.4s ease-in-out infinite;}
@keyframes hs-blink{0%,100%{opacity:1;} 50%{opacity:.3;}}

/* headline: caixa alta, peso regular, dominante */
.hero-text h1{
  text-transform:uppercase;
  font-weight:400;
  color:#14181A;
  max-width:1120px;
  line-height:1.08;
  letter-spacing:.008em;
  font-size:clamp(32px,5.6vw,76px);
}
.hero-text p.lede{
  font-family:'Instrument Sans', sans-serif;
  font-weight:400;
  color:#3B4346;
  font-size:17px;
  max-width:480px;
  text-align:center;
}
.hero-ctas{ display:flex; align-items:center; justify-content:center; gap:22px; flex-wrap:wrap; margin-bottom:8px; }
.hero-cta-btn{
  display:inline-flex; align-items:center; gap:10px;
  padding:13px 22px; border-radius:24px; border:1px solid rgba(17,17,17,.55);
  font-family:'Instrument Sans', sans-serif; font-size:12px; letter-spacing:.04em; color:#14181A;
  text-decoration:none; background:transparent; transition:background var(--ease-ui) ease, color var(--ease-ui) ease, border-color var(--ease-ui) ease;
}
.hero-cta-btn:hover{ background:#14181A; color:#F2F3F2; border-color:#14181A; }
.hero-cta-btn svg{ transition:transform var(--ease-ui) ease; }
.hero-cta-btn:hover svg{ transform:translateX(3px); }
.hero .scroll-cue{ color:#3B4346; }
.hero .scroll-cue:hover{ color:#14181A; }

.hero-status{
  position:absolute; right:var(--container-pad); bottom:28px; z-index:3; font-family:'Instrument Sans', sans-serif; font-size:10.5px;
  letter-spacing:.1em; text-transform:uppercase; color:#4A5457; display:flex; align-items:center; gap:8px;
}
.hero-status .dot{width:6px; height:6px; border-radius:50%; background:#5B7EE8; animation:hs-blink 2.4s ease-in-out infinite;}
@media (max-width:700px){ .hero-status{display:none;} }
@media (prefers-reduced-motion: reduce){ .hero-status .dot, .hero-pill .hp-dot{animation:none;} }

/* sistema visual: mais frio, mais fino, mais integrado */
.hero-svg-wrap{ transition:transform .2s ease-out; will-change:transform; }
.hero-svg-wrap svg{ filter:saturate(.42) brightness(1.04); }
@media (prefers-reduced-motion: reduce){ .hero-svg-wrap{transition:none !important; transform:none !important;} }

.hero-connections{opacity:.55;}
.hero-signal{opacity:.85;}
@media (prefers-reduced-motion: reduce){ .hero-signal{display:none;} }

.hero-node{ animation:hero-float 7.5s ease-in-out infinite; transform-box:fill-box; transform-origin:center; }
@keyframes hero-float{ 0%,100%{transform:translateY(0);} 50%{transform:translateY(-6px);} }
@media (prefers-reduced-motion: reduce){ .hero-node{animation:none;} }

@media (max-width:900px){
  .hero-text h1{ font-size:clamp(30px,7.4vw,46px); line-height:1.12; }
  .hero-pill{ font-size:9.5px; padding:7px 14px 7px 10px; letter-spacing:.1em; }
  .hero-ctas{ gap:16px; }
}

/* reveal elegante no load */
.hero-pill{ opacity:0; animation:hero-up .7s ease .05s forwards; }
.hero-text h1{ opacity:0; animation:hero-up .8s ease .16s forwards; }
.hero-text p.lede{ opacity:0; animation:hero-up .8s ease .3s forwards; }
.hero-ctas{ opacity:0; animation:hero-up .8s ease .42s forwards; }
@keyframes hero-up{ from{opacity:0; transform:translateY(14px);} to{opacity:1; transform:translateY(0);} }
@media (prefers-reduced-motion: reduce){
  .hero-pill, .hero-text h1, .hero-text p.lede, .hero-ctas{ animation:none; opacity:1; transform:none; }
}

/* ============================================================
   PROBLEMA — cena sticky de scroll, sistema visual único, 4 estados
   ============================================================ */
.problem-section{
  position:relative;
  padding-bottom:var(--rhythm-section-pad);
  background:linear-gradient(180deg, #EEF0EF 0%, #E9ECEB 48%, #F0F1F0 100%);
}
.problem-section .problem-grain{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.025;
  background-image:repeating-linear-gradient(to right, transparent, transparent 63px, rgba(20,20,20,1) 63px, rgba(20,20,20,1) 64px),
    repeating-linear-gradient(to bottom, transparent, transparent 63px, rgba(20,20,20,1) 63px, rgba(20,20,20,1) 64px);
}
.problem-head{position:relative; z-index:1; padding-top:var(--rhythm-chapter); margin-bottom:72px;}
.problem-head h2{
  font-size:clamp(48px,4.5vw,72px); line-height:.98; font-weight:400; letter-spacing:-0.04em;
  max-width:760px; margin-top:16px !important;
}
.problem-head p{
  font-size:18px; line-height:1.45; max-width:520px; margin-top:24px !important; color:var(--ink-soft);
}

.problem-scene{position:relative; z-index:1;}
.problem-grid{display:grid; grid-template-columns:5fr 7fr; gap:48px; align-items:stretch;}

.problem-col-text{ padding-bottom:12vh; }
.problem-step{ min-height:70vh; display:flex; flex-direction:column; justify-content:center; opacity:.3; transform:translateX(-8px); transition:opacity 300ms ease-out, transform 300ms ease-out; }
.problem-step.is-current{ opacity:1; transform:translateX(0); }
.problem-step-inner{ max-width:420px; }
.ps-n{ display:block; font-size:12px; text-transform:uppercase; letter-spacing:.08em; opacity:.55; }
.problem-step h3{
  font-size:30px; line-height:1.05; font-weight:400; letter-spacing:-0.025em; margin-top:16px; max-width:360px; text-transform:none;
}
.problem-step p{ font-size:15px; line-height:1.5; margin-top:18px; max-width:380px; color:var(--ink-soft); }
.problem-cost{ margin-top:28px; padding-top:14px; border-top:1px solid rgba(20,20,20,.16); max-width:380px; }
.pc-label{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.09em; opacity:.5; }
.pc-value{ display:block; font-size:17px; line-height:1.25; font-weight:500; margin-top:7px; color:var(--ink); }

.problem-col-visual{ position:relative; }
.problem-sticky{
  position:sticky; top:96px; height:calc(100vh - 192px); min-height:600px; max-height:760px;
}
.problem-panel{
  width:100%; height:100%; border-radius:24px; overflow:hidden; position:relative;
  border:1px solid rgba(20,20,20,.08);
  background:
    radial-gradient(circle at 65% 30%, rgba(190,205,212,.65) 0%, rgba(220,225,226,.25) 38%, rgba(231,234,234,0) 68%),
    #E7EAEA;
}
.problem-svg-wrap{
  position:absolute; left:50%; top:50%; width:74%; height:66%; transform:translate(-50%,-50%);
}
.problem-svg-wrap svg{ width:100%; height:100%; overflow:visible; }
.p-layer{ will-change:transform; }
.p-layer-fg .p-state{
  opacity:0; transform:scale(1.03) translateY(18px); filter:blur(6px);
  transition:opacity 550ms ease, transform 550ms ease, filter 550ms ease;
}
.p-layer-fg .p-state.leaving{ transform:scale(.97) translateY(-16px); filter:blur(6px); opacity:0; }
.p-layer-fg .p-state.active{ opacity:1; transform:scale(1) translateY(0); filter:blur(0); }
.p-node{ transition:transform 300ms ease; }
.p-state[data-state="1"].active .p-signal-1{ animation:p-signal-travel 2.6s ease-in-out infinite; }
@keyframes p-signal-travel{
  0%{ transform:translateX(0); opacity:1; }
  70%{ transform:translateX(30px); opacity:0; }
  100%{ transform:translateX(0); opacity:0; }
}
@media (prefers-reduced-motion: reduce){
  .p-state[data-state="1"].active .p-signal-1{ animation:none; }
  .p-layer{ transform:none !important; }
  .p-layer-fg .p-state{ transition:opacity 300ms ease; transform:none; filter:none; }
  .p-layer-fg .p-state.leaving{ transform:none; filter:none; }
}

/* módulo visual duplicado só em mobile/tablet (sem sticky) */
.problem-mob-viz{ display:none; }

@media (min-width:1024px){
  .problem-scene{ min-height:320vh; }
}

/* tablet 768–1023: linhas independentes, sem cena sticky */
@media (min-width:768px) and (max-width:1023px){
  .problem-scene{ min-height:0; }
  .problem-grid{ display:block; }
  .problem-col-text{ padding-bottom:0; }
  .problem-step{ min-height:0; opacity:1 !important; transform:none !important; display:grid; grid-template-columns:5fr 7fr; gap:48px; align-items:center; margin-bottom:72px; }
  .problem-step:last-child{ margin-bottom:0; }
  .problem-step-inner{ max-width:none; }
  .problem-col-visual{ display:none; }
  .problem-mob-viz{
    display:block; width:100%; aspect-ratio:4/3; border-radius:18px; overflow:hidden; order:2;
    border:1px solid rgba(20,20,20,.08);
    background:radial-gradient(circle at 65% 30%, rgba(190,205,212,.65) 0%, rgba(220,225,226,.25) 38%, rgba(231,234,234,0) 68%), #E7EAEA;
  }
  .problem-mob-viz svg{ width:100%; height:100%; }
  .problem-step-inner{ order:1; }
}

/* mobile <768: carrossel horizontal dos 4 sintomas */
@media (max-width:767px){
  .problem-head{ padding-top:var(--rhythm-chapter); }
  .problem-scene{ min-height:0; }
  .problem-grid{ display:block; }
  .problem-col-visual{ display:none; }
  .problem-step-inner{ max-width:none; }

  /* O problema — pilha vertical de 4 cards compactos (sem slider) */
  .problem-col-text{ padding-bottom:0; display:flex; flex-direction:column; gap:var(--m-gap); margin-top:var(--m-gap-lg); }
  .problem-col-text .problem-step{
    min-height:0; opacity:1 !important; transform:none !important; margin:0 !important;
    display:flex; flex-direction:column;
    background:var(--m-card-bg); border:var(--m-card-border); box-shadow:var(--m-card-shadow);
    border-radius:var(--m-card-radius); padding:18px;
  }
  .problem-mob-viz{
    display:block; width:100%; aspect-ratio:16/9; min-height:0; max-height:150px; border-radius:14px; overflow:hidden; margin-bottom:16px;
    border:1px solid rgba(20,20,20,.06);
    background:radial-gradient(circle at 65% 30%, rgba(190,205,212,.65) 0%, rgba(220,225,226,.25) 38%, rgba(231,234,234,0) 68%), #E7EAEA;
  }
  .problem-mob-viz svg{ width:100%; height:100%; }
  .problem-step .ps-n{ display:block; font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.5; margin-bottom:8px; }
  .problem-step h3{ font-size:22px; line-height:1.08; }
  .problem-step p{ font-size:15px; line-height:1.5; margin-top:10px; }
  .problem-cost{ margin-top:14px; padding-top:14px; }
  .pc-label{ display:block; font-size:10px; letter-spacing:.08em; text-transform:uppercase; opacity:.5; margin-bottom:3px; }
  .pc-value{ font-size:14px; }
  .problem-head h2{ font-size:clamp(28px,7.6vw,34px); line-height:1.08; }
}

/* ============================================================
   PADRÕES RECORRENTES — mosaico narrativo, 6 cards sempre visíveis
   ============================================================ */
.patterns-section{
  position:relative;
  background:linear-gradient(180deg, #ECEFEE 0%, #E4E8E7 50%, #ECEFEE 100%);
}
.patterns-section .patterns-grain{
  position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.02;
  background-image:repeating-linear-gradient(to right, transparent, transparent 71px, rgba(20,20,20,1) 71px, rgba(20,20,20,1) 72px),
    repeating-linear-gradient(to bottom, transparent, transparent 71px, rgba(20,20,20,1) 71px, rgba(20,20,20,1) 72px);
}
.patterns-section .patterns-halo{
  position:absolute; z-index:0; pointer-events:none; border-radius:50%; filter:blur(70px); opacity:.3;
}
.patterns-section .patterns-halo-a{ width:420px; height:420px; top:-80px; right:6%; background:radial-gradient(circle, #C7D2D4, transparent 72%); }
.patterns-section .patterns-halo-b{ width:340px; height:340px; bottom:-60px; left:4%; background:radial-gradient(circle, #BFC9CB, transparent 72%); }

.patterns-head{ position:relative; z-index:1; margin-bottom:64px; opacity:0; transform:translateY(24px); transition:opacity 600ms ease, transform 600ms ease; }
.patterns-head.in-view{ opacity:1; transform:translateY(0); }
.patterns-head .eyebrow{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.55; margin-bottom:16px; display:block; }
.patterns-head h2{ font-size:clamp(44px,4vw,64px); line-height:.98; font-weight:400; letter-spacing:-0.04em; max-width:780px; margin-top:0 !important; }
.patterns-head p{ font-size:18px; line-height:1.45; max-width:560px; margin-top:20px !important; color:var(--ink-soft); }

.patterns-mosaic{
  position:relative; z-index:1;
  display:grid; grid-template-columns:repeat(12,1fr); grid-template-rows:320px 320px; gap:20px;
}
.patterns-spine{ position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.3; }
.patterns-spine svg{ width:100%; height:100%; display:block; }

.pat-card{
  position:relative; z-index:1; box-sizing:border-box;
  display:flex; flex-direction:column; padding:24px; border-radius:24px;
  background:#F4F5F4; border:1px solid rgba(20,20,20,.08);
  transition:transform 280ms ease, border-color 280ms ease, box-shadow 280ms ease, opacity 280ms ease;
  opacity:0; transform:translateY(28px);
}
.pat-card.in-view{ opacity:1; transform:translateY(0); }
.pat-card:hover, .pat-card:focus-visible{
  transform:translateY(-6px); border-color:rgba(20,20,20,.22); box-shadow:0 24px 50px -30px rgba(20,24,26,.35); outline:none;
}
.patterns-mosaic.has-hover .pat-card:not(:hover):not(:focus-visible){ opacity:.72 !important; transform:translateY(0); }
.pat-card:hover.in-view{ transform:translateY(-6px); }

.pat-num{ font-size:12px; line-height:1; letter-spacing:.08em; text-transform:uppercase; opacity:.55; flex-shrink:0; }
.pat-card h3{
  font-size:28px; line-height:1.02; font-weight:400; letter-spacing:-0.03em; margin-top:14px;
  max-width:240px; text-transform:none; flex-shrink:0;
}
.pat-card p{ font-size:14px; line-height:1.4; margin-top:14px; max-width:240px; color:var(--ink-soft); flex-shrink:0; }
.pat-viz{ flex:1; min-height:42%; margin-top:14px; display:flex; align-items:center; justify-content:center; overflow:hidden; }
.pat-viz svg{ width:100%; height:100%; overflow:visible; }
.pat-viz .pv-node{ transition:transform 280ms ease; }
.pat-card:hover .pat-viz .pv-node, .pat-card:focus-visible .pat-viz .pv-node{ transform:translateY(-3px); }
.pat-viz .pv-line{ stroke-dasharray:260; stroke-dashoffset:0; transition:stroke-dashoffset 500ms ease; }
.pat-card:hover .pat-viz .pv-line, .pat-card:focus-visible .pat-viz .pv-line{ stroke-dashoffset:0; }

.pc-01{ grid-column: 1 / 5; }
.pc-02{ grid-column: 5 / 8; }
.pc-03{ grid-column: 8 / 13; }
.pc-04{ grid-column: 1 / 4; }
.pc-05{ grid-column: 4 / 9; }
.pc-06{ grid-column: 9 / 13; }

@media (prefers-reduced-motion: reduce){
  .patterns-head, .pat-card{ transition:opacity 200ms ease; transform:none !important; }
  .pat-viz .pv-node, .pat-viz .pv-line{ transition:none; }
}

/* tablet 768–1023: 2 colunas × 3 linhas, mesma lógica visual */
@media (min-width:768px) and (max-width:1023px){
  .patterns-mosaic{ grid-template-columns:1fr 1fr; grid-template-rows:repeat(3,280px); }
  .pc-01, .pc-02, .pc-03, .pc-04, .pc-05, .pc-06{ grid-column:auto; }
  .patterns-spine{ display:none; }
}

/* mobile <768: stack vertical, cards grandes */
@media (max-width:767px){
  .patterns-mosaic{ display:flex; flex-direction:column; gap:20px; }
  .pc-01, .pc-02, .pc-03, .pc-04, .pc-05, .pc-06{ grid-column:auto; }
  .patterns-spine{ display:none; }
  .pat-card{ min-height:280px; border-radius:20px; padding:20px; }
  .pat-card h3{ font-size:24px; line-height:1.03; max-width:none; }
  .pat-card p{ font-size:14px; line-height:1.4; max-width:none; }
  .pat-viz{ min-height:44%; }
}

/* ============================================================
   11. QUEBRA DE ASSUNTO — "A questão" (curta, não é hero)
   ============================================================ */
.ax-break{
  position:relative; overflow:hidden;
  background:
    radial-gradient(circle at 85% 40%, rgba(190,205,220,.25) 0%, rgba(235,238,237,0) 32%),
    #EAEEED;
  min-height:auto; padding-top:88px; padding-bottom:88px;
}
.ax-break-inner{ position:relative; z-index:1; max-width:1280px; }
.ax-break-eye{
  position:absolute; z-index:0; right:6%; top:50%; transform:translateY(-50%);
  width:130px; height:130px; border-radius:50%; filter:blur(28px); opacity:.62;
  background:radial-gradient(circle at 42% 38%, rgba(255,255,255,.95), rgba(197,207,209,.55) 44%, rgba(180,196,232,.3) 68%, transparent 80%);
}
.ax-break-eyebrow{ position:relative; z-index:1; font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.56; display:block; }
.ax-break-h{
  position:relative; z-index:1;
  font-size:clamp(30px,3.6vw,52px); line-height:.98; font-weight:400; letter-spacing:-0.035em;
  max-width:1120px; text-wrap:balance; margin-top:14px;
}
.ax-break-sup{ position:relative; z-index:1; font-size:16px; line-height:1.42; max-width:460px; margin-top:18px; color:var(--ink-soft); }

@media (max-width:767px){
  .ax-break{ padding-top:56px; padding-bottom:56px; }
  .ax-break-eye{ width:84px; height:84px; right:4%; top:20px; transform:none; filter:blur(22px); }
  .ax-break-h{ font-size:clamp(26px,7vw,34px); }
}

/* ============================================================
   12. #instrumento — base: gradientes, atmosfera, paginação, estados
   ============================================================ */
#instrumento, #instrumento *, #pulse-deep-dive, #pulse-deep-dive *{ font-style:normal !important; }

.instrument-section{ position:relative; }
.instrument-sticky{ position:relative; }
.instrument-panel{
  position:relative; width:100%; height:100%; overflow:hidden; color:var(--ink); background:#E7E9EC;
}
.instrument-panel::before, .instrument-panel::after{
  content:''; position:absolute; inset:-14%; z-index:0; pointer-events:none;
  background-repeat:no-repeat;
  will-change:opacity, transform;
}
.instrument-panel::before{
  opacity:var(--grad-a-o, 1);
  background-image:
    radial-gradient(circle at 18% 22%, #D9E3F5 0%, transparent 46%),
    radial-gradient(circle at 78% 14%, #A8BDE9 0%, transparent 42%),
    radial-gradient(circle at 85% 78%, #F1DFCF 0%, transparent 46%),
    radial-gradient(circle at 22% 82%, #E1D9EC 0%, transparent 44%),
    radial-gradient(circle at 50% 50%, #F3EFE9 0%, transparent 60%);
  animation:blobDriftA 18s ease-in-out infinite alternate;
}
.instrument-panel::after{
  opacity:var(--grad-b-o, 0);
  background-image:
    radial-gradient(circle at 20% 20%, #A9CBE0 0%, transparent 46%),
    radial-gradient(circle at 80% 18%, #E8CCD6 0%, transparent 42%),
    radial-gradient(circle at 82% 80%, #F0A998 0%, transparent 40%),
    radial-gradient(circle at 18% 78%, #DB647B 0%, transparent 32%),
    radial-gradient(circle at 50% 50%, #E9E3D9 0%, transparent 60%);
  animation:blobDriftB 21s ease-in-out infinite alternate;
}
@keyframes blobDriftA{
  0%{ transform:translate3d(-1.5%,-1%,0) scale(1.0) rotate(-1deg); }
  100%{ transform:translate3d(1.5%,1.5%,0) scale(1.08) rotate(1.5deg); }
}
@keyframes blobDriftB{
  0%{ transform:translate3d(1.5%,-1.5%,0) scale(1.02) rotate(1.5deg); }
  100%{ transform:translate3d(-1.5%,1.5%,0) scale(1.08) rotate(-1.5deg); }
}
.instrument-atmosphere{ position:absolute; inset:0; z-index:1; pointer-events:none; overflow:hidden; }
.instrument-atmosphere .ax-grain{
  position:absolute; inset:0; opacity:.05;
  background-image:repeating-linear-gradient(to right, transparent, transparent 71px, rgba(20,20,20,1) 71px, rgba(20,20,20,1) 72px),
    repeating-linear-gradient(to bottom, transparent, transparent 71px, rgba(20,20,20,1) 71px, rgba(20,20,20,1) 72px);
}
.instrument-atmosphere .ax-gridlines{
  position:absolute; inset:0; opacity:.25;
  background-image:linear-gradient(rgba(59,67,70,.05) 1px, transparent 1px), linear-gradient(90deg, rgba(59,67,70,.05) 1px, transparent 1px);
  background-size:64px 64px;
}

/* paginação — fixa no centro vertical do sticky viewport, sempre visível, formato "N / 05" */
.instrument-pagination{
  position:absolute; z-index:20; right:36px; top:50%; transform:translateY(-50%);
  display:flex; flex-direction:column; gap:14px;
}
@media (min-width:1600px){ .instrument-pagination{ right:48px; } }
.ip-dot{ position:relative; display:flex; align-items:center; gap:8px; font-size:11px; letter-spacing:.06em; opacity:.28; transition:opacity var(--ease-ui) ease; }
.ip-dot b{ display:block; width:0; height:1px; background:var(--ink); transition:width var(--ease-ui) ease; }
.ip-dot.active{ opacity:1; font-weight:500; }
.ip-dot.active b{ width:18px; }

/* estados — opacidade/transform/blur controlados continuamente via JS, sem reflow */
.instrument-states{ position:relative; width:100%; height:100%; z-index:2; }
.inst-state{
  position:absolute; inset:0; display:flex; align-items:center;
  opacity:0; pointer-events:none; will-change:opacity, transform, filter;
  transition:opacity 90ms linear, transform 90ms linear, filter 90ms linear;
}
.inst-state.is-active{ pointer-events:auto; }
.inst-container{
  width:100%; height:100%; display:flex; align-items:center;
  padding-top:92px; padding-bottom:72px; box-sizing:border-box;
}
.inst-eyebrow{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.58; display:block; margin-bottom:16px; }
.inst-h{
  font-size:clamp(34px,4.2vw,62px); line-height:.96; font-weight:400; letter-spacing:-0.04em;
  max-width:720px; text-wrap:balance;
}
.inst-sup{ font-size:16px; line-height:1.45; max-width:440px; margin-top:22px; color:var(--ink-soft); }
.inst-micro{ display:block; font-size:11px; text-transform:uppercase; letter-spacing:.08em; opacity:.58; margin-top:26px; }
.inst-scroll-hint{ display:block; font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; opacity:.45; margin-top:32px; }

.inst-grid12{ display:grid; grid-template-columns:repeat(12,1fr); gap:24px; align-items:center; width:100%; }
.inst-col-main{ grid-column:1 / 7; }
.inst-col-aux{ grid-column:7 / 13; display:flex; align-items:center; justify-content:center; }

@media (min-width:1024px) and (max-width:1280px){
  .inst-h{ font-size:clamp(32px,3.8vw,52px); max-width:640px; }
}

@media (prefers-reduced-motion: reduce){
  .inst-state{ transition:opacity 200ms ease; }
  .instrument-panel::before, .instrument-panel::after{ animation:none; }
}

/* ---- desktop: cena sticky única, 5 estados ---- */
.instrument-scene{ position:relative; }
@media (min-width:1024px){
  #instScene{ min-height:440vh; }
  .instrument-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; }
}

/* ---- tablet + mobile: painéis empilhados, sem sticky ---- */
@media (max-width:1023px){
  #instScene{ min-height:0; }
  .instrument-sticky{ height:auto; }
  .instrument-panel{ height:auto; overflow:visible; }
  .instrument-panel::before, .instrument-panel::after{ display:none; }
  .instrument-pagination{ display:none; }
  .instrument-atmosphere{ position:absolute; }
  .instrument-states{ height:auto; }
  .inst-state{
    position:relative; inset:auto; opacity:1 !important; pointer-events:auto; filter:none !important; transform:none !important; transition:none;
    min-height:0; max-height:none; display:flex; align-items:center; padding-block:0;
  }
  .inst-container{ height:auto; min-height:0; max-height:none; padding-top:48px; padding-bottom:48px; }
  .inst-grid12{ display:flex; flex-direction:column; gap:28px; }
  .inst-col-main, .inst-col-aux{ grid-column:auto; width:100%; flex-shrink:0; }
}

@media (max-width:767px){
  /* #instrumento — pilha vertical dos 5 capítulos (sem slider) */
  .instrument-states{
    display:flex; flex-direction:column; gap:44px;
    padding:44px 0;
  }
  .inst-state{ padding:0; }
  .inst-container{ padding:0 var(--container-pad) !important; }
  .inst-grid12{ gap:18px !important; align-items:stretch; }
  .inst-col-aux{ min-width:0; justify-content:center; }

  .inst-eyebrow{ font-size:12px; margin-bottom:12px; }
  .inst-h{ font-size:clamp(23px,6vw,28px) !important; line-height:1.08 !important; letter-spacing:-.02em; max-width:none; }
  .inst-sup{ font-size:16px; line-height:1.5; max-width:none; margin-top:14px; }
  .inst-micro, .inst-scroll-hint{ font-size:12px; margin-top:16px; }
}

/* ============================================================
   13. DIAGRAMA EXPLODIDO — estado 01/05 / O que é AXOS
   ============================================================ */
.exploded{ position:relative; width:100%; max-width:540px; height:580px; display:flex; flex-direction:column; align-items:center; justify-content:center; }
.exploded-label{ position:absolute; top:0; left:50%; transform:translateX(-50%); font-size:11px; letter-spacing:.1em; opacity:.5; }
.exploded-stack{ display:flex; flex-direction:column; align-items:center; gap:var(--explode-gap, 8px); width:100%; }
.exploded-plate{
  position:relative; width:88%; max-width:420px; height:84px; border-radius:16px;
  background:rgba(255,255,255,.32); backdrop-filter:blur(14px); -webkit-backdrop-filter:blur(14px);
  border:1px solid rgba(255,255,255,.4); box-shadow:0 18px 40px -22px rgba(20,30,40,.35);
  display:flex; align-items:center; gap:16px; padding:0 22px; overflow:hidden;
  opacity:var(--plate-op, .35); transform:rotate(var(--plate-rot, 0deg));
  transition:opacity 80ms linear, transform 80ms linear;
}
.exploded-plate .ep-name{ position:relative; z-index:1; font-size:13px; letter-spacing:.04em; text-transform:uppercase; color:var(--ink); margin-left:auto; }
.exploded-plate.ep-2 .ep-name{ color:var(--gold); }
.exploded-conn{ width:1px; height:var(--explode-gap, 8px); background:linear-gradient(180deg, rgba(59,67,70,.35), rgba(59,67,70,.08)); transition:height 80ms linear; }

.ep-orbital{ position:relative; width:44px; height:44px; flex-shrink:0; }
.ep-orbital i{ position:absolute; width:4px; height:4px; border-radius:50%; background:var(--ink); left:50%; top:50%; margin:-2px; opacity:.55; }
.ep-orbital i:nth-child(1){ transform:rotate(0deg) translate(20px); }
.ep-orbital i:nth-child(2){ transform:rotate(45deg) translate(20px); }
.ep-orbital i:nth-child(3){ transform:rotate(90deg) translate(20px); }
.ep-orbital i:nth-child(4){ transform:rotate(135deg) translate(20px); }
.ep-orbital i:nth-child(5){ transform:rotate(180deg) translate(20px); }
.ep-orbital i:nth-child(6){ transform:rotate(225deg) translate(20px); }
.ep-orbital i:nth-child(7){ transform:rotate(270deg) translate(20px); }
.ep-orbital i:nth-child(8){ transform:rotate(315deg) translate(20px); }

.ep-radial{ width:44px; height:44px; flex-shrink:0; border-radius:50%; background:radial-gradient(circle, transparent 34%, rgba(91,126,232,.4) 36%, rgba(91,126,232,.4) 40%, transparent 42%, transparent 58%, rgba(91,126,232,.25) 60%, rgba(91,126,232,.25) 64%, transparent 66%); }

.ep-modules{ position:relative; width:44px; height:44px; flex-shrink:0; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:4px; }
.ep-modules i{ background:rgba(59,67,70,.28); border-radius:3px; }

.ep-grid-mini{ position:relative; width:44px; height:44px; flex-shrink:0; display:grid; grid-template-columns:1fr 1fr; grid-template-rows:1fr 1fr; gap:3px; }
.ep-grid-mini i{ border:1px solid rgba(59,67,70,.35); border-radius:2px; }

@media (max-width:1023px){
  .exploded{ height:auto; max-width:420px; margin:0 auto; }
  .exploded-stack{ gap:24px !important; }
  .exploded-plate{ opacity:1 !important; transform:none !important; }
  .exploded-conn{ height:24px !important; }
}
@media (max-width:767px){
  /* VERSÃO 01 — pilha de 4 cards compactos e idênticos (8 Eixos / Pulse / Skills / Frameworks) */
  .exploded{ max-width:100%; height:auto; display:block; }
  .exploded-label{ display:none; }
  .exploded-stack{ gap:var(--m-gap-sm) !important; width:100%; }
  .exploded-conn{ display:none; }
  .exploded-plate{
    width:100%; max-width:none; height:96px; border-radius:var(--m-card-radius);
    padding:0 18px; gap:16px;
    background:var(--m-card-bg); border:var(--m-card-border);
    box-shadow:var(--m-card-shadow); backdrop-filter:none; -webkit-backdrop-filter:none;
    opacity:1 !important; transform:none !important;
  }
  .exploded-plate .ep-name{ font-size:12.5px; margin-left:auto; }
  .exploded-plate.ep-2 .ep-name{ color:var(--gold); }
  .ep-orbital, .ep-radial, .ep-modules, .ep-grid-mini{ width:38px; height:38px; }
  .ep-orbital{ transform:scale(.86); }
  .exploded-plate .ep-orbital i{ opacity:.7; }
  .exploded-plate .ep-modules i{ background:rgba(59,67,70,.4); }
  .exploded-plate .ep-grid-mini i{ border-color:rgba(59,67,70,.5); }
}

/* ============================================================
   14. INSTRUMENTO RADIAL — componente único (Pilar 01, Pulse preview, deep-dive, CTA)
   ============================================================ */
.pilar-radial-wrap{ position:relative; width:min(520px,42vw); aspect-ratio:1/1; margin:0 auto; padding:42px; box-sizing:border-box; overflow:visible; }
.pilar-radial-svg{ width:100%; height:100%; display:block; overflow:visible; }

.pulse-preview{ display:flex; flex-direction:column; align-items:center; gap:24px; width:100%; }
.pulse-preview-tag{
  display:flex; gap:8px; flex-wrap:wrap; justify-content:center;
  font-size:10.5px; letter-spacing:.06em; text-transform:uppercase; color:var(--ink-soft);
}
.pulse-preview-tag span{ border:1px solid rgba(59,67,70,.16); border-radius:14px; padding:6px 12px; background:rgba(255,255,255,.35); }
.pulse-preview-radial-wrap{ position:relative; width:min(420px,42vw); aspect-ratio:1/1; margin:0 auto; }
.pulse-preview-radial-svg{ width:100%; height:100%; display:block; }
@media (min-width:1024px){
  .pulse-preview-radial-wrap{ width:clamp(500px, 48vw, 600px); }
}

@media (max-width:1023px){
  .pilar-radial-wrap{ width:440px; max-width:90vw; padding:28px; }
  .pulse-preview-radial-wrap{ width:440px; max-width:90vw; }
}
@media (max-width:767px){
  /* PILAR 01 / 02 — radar próximo do texto, ~250px, sem espaço morto */
  .pilar-radial-wrap{ width:258px; max-width:76vw; padding:6px; margin-top:-6px; }
  .pulse-preview-radial-wrap{ width:250px; max-width:74vw; }

  /* pills do Pulse — pílulas limpas e consistentes com o sistema */
  .pulse-preview{ gap:18px; }
  .pulse-preview-tag{ gap:8px; font-size:11px; }
  .pulse-preview-tag span{
    display:inline-flex; align-items:center; min-height:36px;
    padding:0 15px; border-radius:999px; letter-spacing:.06em;
    border:1px solid rgba(59,67,70,.16); background:rgba(255,255,255,.5);
  }
}

@keyframes instrumentBreathe{
  0%, 100%{ opacity:1; }
  50%{ opacity:.92; }
}
.pri-breathing{ animation:instrumentBreathe 3200ms ease-in-out infinite; }

/* ============================================================
   15. SKILLS / FRAMEWORKS — grid exato 3×2
   ============================================================ */
.pilar-bento-grid{
  display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-template-rows:repeat(2,156px); gap:16px; width:100%;
}
.pilar-bento-item{
  position:relative; height:156px; padding:20px; border-radius:20px; overflow:hidden; box-sizing:border-box;
  background:rgba(255,255,255,.4); border:1px solid rgba(59,67,70,.1);
  transition:transform 280ms ease, border-color 280ms ease;
}
.pilar-bento-item:hover{ transform:translateY(-4px); border-color:rgba(59,67,70,.22); }
.pilar-bento-item .pbi-title{ display:block; font-size:16px; line-height:1.15; font-weight:500; max-width:72%; color:var(--ink); }
.pilar-bento-item .pbi-visual{ position:absolute; right:18px; bottom:16px; width:52px; height:52px; }

@media (max-width:1023px){
  .pilar-bento-grid{ grid-template-columns:repeat(2,1fr); grid-template-rows:repeat(3,148px); }
  .pilar-bento-item{ height:148px; }
}
@media (max-width:767px){
  .pilar-bento-grid{ grid-template-columns:1fr 1fr; grid-template-rows:none; grid-auto-rows:1fr; gap:var(--m-gap-sm); }
  .pilar-bento-item{
    height:auto; min-height:106px; padding:16px;
    border-radius:var(--m-card-radius); background:var(--m-card-bg); border:var(--m-card-border); box-shadow:var(--m-card-shadow);
    display:flex; flex-direction:column; justify-content:space-between; gap:10px;
  }
  .pilar-bento-item .pbi-title{ font-size:13.5px; line-height:1.2; max-width:none; }
  .pilar-bento-item .pbi-visual{ position:static; width:32px; height:32px; align-self:flex-start; }
}

/* ============================================================
   16. #pulse-deep-dive — intro, radar + slider de eixos, CTA
   ============================================================ */
#pulse-deep-dive{ position:relative; background:#EDEFEF; color:var(--ink); }
.pdd-intro{ position:relative; z-index:1; padding-top:96px; padding-bottom:56px; max-width:900px; padding-left:56px; padding-right:56px; margin-inline:auto; box-sizing:content-box; }
.pdd-eyebrow{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.56; display:block; }
.pdd-h{ font-size:clamp(34px,4vw,58px); line-height:.98; font-weight:400; letter-spacing:-0.03em; margin-top:16px; text-wrap:balance; }
.pdd-sup{ font-size:16px; line-height:1.5; max-width:560px; margin-top:18px; color:var(--ink-soft); }

.pdd-scene{ position:relative; }
.pdd-sticky{ position:relative; }
.pdd-panel{
  position:relative; width:100%; height:100%; overflow:hidden; color:var(--ink);
  background:
    radial-gradient(circle at 20% 25%, #D9E3F5 0%, transparent 48%),
    radial-gradient(circle at 82% 18%, #A8BDE9 0%, transparent 44%),
    radial-gradient(circle at 85% 82%, #E1D9EC 0%, transparent 46%),
    radial-gradient(circle at 15% 82%, #F1DFCF 0%, transparent 44%),
    #EDEFEF;
}
.pdd-grid{
  position:relative; z-index:1; height:100%; box-sizing:border-box;
  max-width:1280px; margin-inline:auto; padding-left:56px; padding-right:56px;
  display:grid; grid-template-columns:minmax(0,1.7fr) minmax(320px,0.85fr); gap:56px; align-items:center;
}
@media (max-width:1439px){ .pdd-grid, .pdd-intro{ padding-left:40px; padding-right:40px; } }
@media (max-width:1023px){ .pdd-grid, .pdd-intro{ padding-left:32px; padding-right:32px; } }
@media (max-width:767px){ .pdd-grid, .pdd-intro{ padding-left:var(--container-pad); padding-right:var(--container-pad); } }

.pdd-radar-col{ display:flex; align-items:center; justify-content:center; height:100%; padding:42px 54px; box-sizing:border-box; overflow:visible; }
.pdd-instrument-wrap{ position:relative; width:clamp(520px,44vw,560px); aspect-ratio:1/1; transition:opacity 260ms ease; overflow:visible; }
.pdd-instrument-svg{ width:100%; height:100%; display:block; overflow:visible; }
@media (min-width:1440px){
  .pdd-instrument-wrap{ width:min(640px,52vw); }
}

.pdd-content-col{ position:relative; height:100%; display:flex; flex-direction:column; justify-content:center; align-items:center; }
.axis-slider{ position:relative; width:100%; min-height:350px; }
.pdd-state{
  position:absolute; inset:0; height:fit-content; display:flex; flex-direction:column; justify-content:center;
  opacity:0; pointer-events:none; will-change:opacity, transform;
  transition:opacity 340ms ease, transform 340ms ease;
}
.pdd-state.is-active{ pointer-events:auto; }
.pdd-state-eyebrow{ font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.56; display:block; }
.pdd-state-h{ font-size:clamp(22px,2vw,28px); line-height:1.12; font-weight:400; letter-spacing:-0.02em; margin-top:12px; }
.pdd-state-sup{ font-size:14px; line-height:1.5; color:var(--ink-soft); margin-top:14px; }

/* card do eixo — objeto editorial compacto, tint da cor própria, centralizado ao lado do radar */
.pdd-eixo{
  width:100%; max-width:390px; max-height:390px; height:auto; min-height:0; box-sizing:border-box;
  border-radius:24px; padding:26px; margin:0 auto;
  background:var(--eixo-bg, rgba(255,255,255,.4)); border:1px solid var(--eixo-border, rgba(59,67,70,.12));
  box-shadow:0 18px 48px rgba(25,32,36,.06); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px);
  transition:opacity 340ms ease, transform 340ms ease, background 280ms ease, border-color 280ms ease;
}
.pdd-eixo-head{ display:flex; justify-content:space-between; align-items:flex-start; }
.pdd-eixo-eyebrow{ font-size:11px; font-weight:500; letter-spacing:.08em; opacity:.55; display:block; }
.pdd-eixo-symbol{
  width:56px; height:56px; border-radius:50%; display:flex; align-items:center; justify-content:center; flex-shrink:0;
  background:var(--eixo-symbol-bg, rgba(59,67,70,.12)); color:var(--eixo-c, var(--ink));
}
.pdd-eixo-symbol svg{ width:44px; height:44px; }
.pdd-eixo-title{
  font-size:24px; line-height:1; font-weight:500; letter-spacing:-.025em; text-transform:uppercase;
  margin-top:24px; max-width:300px; text-wrap:balance; color:var(--ink);
}
.pdd-eixo-title.is-long{ font-size:21px; }
.pdd-eixo-q{ font-size:17px; line-height:1.25; font-weight:450; margin-top:18px; max-width:310px; color:var(--ink); }
.pdd-eixo-desc{ font-size:13px; line-height:1.45; margin-top:10px; max-width:310px; opacity:.72; color:var(--ink); }
.pdd-eixo-frag{
  font-size:13px; line-height:1.4; font-weight:500; margin-top:20px; padding-top:14px; border-top:1px solid rgba(20,20,20,.11); color:var(--ink-soft);
}
.pdd-eixo-frag strong{ display:block; font-weight:600; text-transform:uppercase; font-size:10px; letter-spacing:.09em; margin-bottom:7px; opacity:.5; color:var(--ink); }

.axis-slider-indicator{ display:none; }

@media (prefers-reduced-motion: reduce){
  .pdd-state{ transition:opacity 200ms ease; }
}

@media (min-width:1024px){
  .pdd-scene{ min-height:720vh; position:relative; }
  .pdd-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; }
}

/* ---- tablet + mobile: radar completo + slider horizontal de eixos ---- */
@media (max-width:1023px){
  .pdd-intro{ padding-top:64px; padding-bottom:40px; }
  .pdd-scene{ min-height:0; }
  .pdd-sticky{ height:auto; }
  .pdd-panel{ height:auto; overflow:visible; }
  .pdd-grid{ display:flex; flex-direction:column; align-items:stretch; padding-top:0; padding-bottom:56px; gap:32px; max-width:none; }
  .pdd-radar-col{ order:1; width:100%; height:auto; padding:8px 0 0; }
  .pdd-instrument-wrap{ width:min(420px,78vw); max-width:none; margin:0 auto; }
  .pdd-content-col{ order:2; width:100%; height:auto; align-items:stretch; }

  .pdd-state.pdd-overview{ display:none; }

  .axis-slider{
    display:flex; overflow-x:auto; scroll-snap-type:x mandatory; gap:14px;
    scrollbar-width:none; min-height:0; height:auto;
    width:auto; margin-inline:calc(var(--container-pad) * -1); padding-inline:var(--container-pad);
    align-items:stretch;
  }
  .axis-slider::-webkit-scrollbar{ display:none; }
  .pdd-state.pdd-eixo{
    position:relative; inset:auto; opacity:1 !important; pointer-events:auto; transform:none !important; transition:none;
    flex:0 0 86%; max-width:360px; scroll-snap-align:center;
    min-height:0; max-height:none; margin:0;
  }
  .axis-slider-indicator{
    display:block; text-align:center; margin-top:18px; font-size:11px; letter-spacing:.08em; opacity:.55;
  }
}
@media (max-width:767px){
  .pdd-eixo{ min-height:0; max-height:none; padding:22px; border-radius:22px; }
  .pdd-eixo-symbol{ width:52px; height:52px; }
  .pdd-eixo-symbol svg{ width:40px; height:40px; }
  .pdd-eixo-title{ font-size:22px; }
  .pdd-eixo-title.is-long{ font-size:19px; }
  .pdd-eixo-q{ font-size:16px; }
}

/* ---- CTA final ---- */
.pdd-cta-section{ padding-top:64px; padding-bottom:96px; padding-left:56px; padding-right:56px; max-width:1280px; margin-inline:auto; box-sizing:border-box; }
@media (max-width:1439px){ .pdd-cta-section{ padding-left:40px; padding-right:40px; } }
@media (max-width:1023px){ .pdd-cta-section{ padding-left:32px; padding-right:32px; } }
@media (max-width:767px){ .pdd-cta-section{ padding-left:var(--container-pad); padding-right:var(--container-pad); } }

.pdd-cta-card{
  position:relative; overflow:hidden; min-height:420px; padding:64px; border-radius:28px; box-sizing:border-box;
  display:flex; flex-direction:column; justify-content:center;
  background:
    radial-gradient(circle at 20% 25%, #D9E3F5 0%, transparent 48%),
    radial-gradient(circle at 82% 18%, #A8BDE9 0%, transparent 44%),
    radial-gradient(circle at 85% 82%, #E1D9EC 0%, transparent 46%),
    radial-gradient(circle at 15% 82%, #F1DFCF 0%, transparent 44%),
    #EDEFEF;
}
.pdd-cta-radial-bg{ position:absolute; right:-8%; top:50%; transform:translateY(-50%); width:640px; max-width:70%; aspect-ratio:1/1; filter:blur(18px); opacity:.1; pointer-events:none; }
.pdd-cta-radial-bg svg{ width:100%; height:100%; }
.pdd-cta-eyebrow{ position:relative; z-index:1; font-size:11px; letter-spacing:.08em; text-transform:uppercase; opacity:.6; display:block; }
.pdd-cta-h{ position:relative; z-index:1; font-size:clamp(38px,4.4vw,64px); line-height:.96; font-weight:400; letter-spacing:-0.03em; max-width:820px; margin-top:16px; text-wrap:balance; }
.pdd-cta-sup{ position:relative; z-index:1; font-size:16px; line-height:1.5; max-width:560px; margin-top:18px; color:var(--ink-soft); }
.pdd-cta-btn{ position:relative; z-index:1; margin-top:32px; align-self:flex-start; }

@media (max-width:767px){
  .pdd-cta-card{ min-height:0; padding:36px 24px; }
  .pdd-cta-radial-bg{ width:400px; opacity:.08; }
}
/* ============================================================
   20. COMO EU TRABALHO — ponte para a página de ofertas, 2 cards iguais
   ============================================================ */
.work-section, .work-section *{ font-style:normal; }
.work-section{ padding-top:120px; }
@media (max-width:767px){
  .work-section{ padding-top:64px; }
}

.work-section .section-head h2{
  font-size:clamp(40px,4.5vw,68px); line-height:.96; font-weight:400; letter-spacing:-.04em;
  max-width:700px; text-wrap:balance; text-transform:none;
}
.work-section .section-head p{
  font-size:16px; line-height:1.45; max-width:520px; margin-top:20px !important; color:var(--ink-soft);
}

.work-cards{display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; align-items:stretch;}

.offer-card{
  position:relative; overflow:hidden; box-sizing:border-box; min-width:0;
  height:auto; min-height:500px; padding:32px; border-radius:24px;
  display:flex; flex-direction:column;
  background:var(--paper); border:1px solid var(--line);
  color:var(--ink); transition:transform 320ms ease, box-shadow 320ms ease, border-color 320ms ease;
}
.offer-card:hover{ transform:translateY(-4px); box-shadow:0 22px 44px -26px rgba(30,36,40,.32); border-color:var(--line-strong); }

.offer-card-1{
  background:var(--paper);
  background:
    radial-gradient(circle at 85% 15%, color-mix(in srgb, var(--gold) 26%, transparent), transparent 55%),
    var(--paper);
}
.offer-card-2{
  background:var(--paper);
  background:
    radial-gradient(circle at 85% 15%, color-mix(in srgb, var(--lavender) 26%, transparent), transparent 55%),
    var(--paper);
}

.offer-top{
  position:relative; z-index:1;
  display:grid; grid-template-columns:auto minmax(0,1fr); align-items:start; column-gap:24px;
}
.stage{ font-size:13px; line-height:1; font-weight:600; letter-spacing:.04em; color:var(--ink); text-align:left; white-space:nowrap; }
.offer-role{ font-size:10px; line-height:1.3; font-weight:600; letter-spacing:.07em; text-transform:uppercase; opacity:.5; color:var(--ink); text-align:right; justify-self:end; max-width:210px; min-height:2.6em; }

.offer-h{
  position:relative; z-index:1; color:var(--ink); text-transform:none;
  font-size:clamp(34px,3vw,46px); line-height:.96; font-weight:450; letter-spacing:-.035em;
  max-width:13ch; min-height:2.9em; text-wrap:balance; margin-top:44px;
}
.offer-sup{
  position:relative; z-index:1; color:var(--ink);
  font-size:15px; line-height:1.42; max-width:40ch; min-height:4.3em; opacity:.72; margin-top:20px;
}

.offer-focus{ position:relative; z-index:1; margin-top:44px; }
.offer-focus-label{ font-size:10px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; opacity:.45; margin-bottom:10px; display:block; color:var(--ink); }
.offer-focus-list{ list-style:none; }
.offer-focus-list li{
  min-height:36px; display:flex; align-items:center;
  font-size:14px; line-height:1.25; border-bottom:1px solid var(--line); color:var(--ink);
}

.offer-card__cta{ position:relative; z-index:5; margin-top:auto; align-self:flex-start; pointer-events:auto; }
.offer-btn{
  display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding-inline:24px; border-radius:999px;
  background:var(--ink); color:var(--paper); font-size:14px; font-weight:500;
  text-decoration:none; transition:transform 320ms ease, opacity 320ms ease;
}
.offer-btn:hover{ opacity:.88; transform:translateY(-1px); }
.offer-btn:active{ opacity:.78; transform:translateY(0); }
.offer-btn:focus-visible{ outline:2px solid currentColor; outline-offset:3px; }

@media (max-width:1023px){
  .offer-card{ min-height:460px; }
}
@media (max-width:767px){
  .work-cards{ grid-template-columns:1fr; gap:16px; }
  .offer-card{ min-height:0; padding:24px; }
  .offer-h{ font-size:34px; max-width:13ch; min-height:0; margin-top:32px; }
  .offer-sup{ min-height:0; }
  .offer-top{ grid-template-columns:1fr; row-gap:10px; }
  .offer-role{ justify-self:start; text-align:left; min-height:0; }
  .offer-focus{ margin-top:32px; }
  .offer-card__cta{ margin-top:32px; }
}

/* ============================================================
   21-22. TRANSFORMAÇÃO — galeria de posters editoriais, 3x2
   anatomia fixa: número → título → visual → explicação → impacto
   ============================================================ */
.transform-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:20px; }

.t-poster{
  position:relative; overflow:hidden; box-sizing:border-box;
  height:480px; padding:22px; border-radius:22px;
  display:flex; flex-direction:column;
  background:var(--paper); border:1px solid var(--line);
  transition:transform 320ms ease, box-shadow 320ms ease, border-color 320ms ease;
}
.t-poster:hover{ transform:translateY(-3px); box-shadow:0 22px 44px -26px rgba(30,36,40,.32); border-color:var(--line-strong); }

.t-idx{
  font-family:'Instrument Sans', sans-serif;
  font-size:11px; line-height:1; letter-spacing:.06em; font-weight:500; opacity:.45; color:var(--ink);
}
.t-h{
  font-style:normal; text-transform:none; color:var(--ink);
  font-size:clamp(28px,2.25vw,38px); line-height:.96; font-weight:450; letter-spacing:-.035em;
  text-wrap:balance; max-width:15ch; margin-top:18px;
}

.poster-visual{
  position:relative; height:190px; margin-top:22px; border-radius:16px; overflow:hidden;
  background:
    radial-gradient(130% 150% at var(--pv-x1,25% 20%), var(--pv-c1), transparent 60%),
    radial-gradient(130% 150% at var(--pv-x2,80% 80%), var(--pv-c2), transparent 62%),
    var(--paper);
  transition:transform 320ms ease;
}
.t-poster:hover .poster-visual{ transform:scale(1.02); }
.poster-visual svg{ position:absolute; inset:0; width:100%; height:100%; display:block; z-index:0; }
.poster-visual::after{
  content:''; position:absolute; inset:0; z-index:1; pointer-events:none; opacity:.28; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

.t-poster-6 .poster-visual{
  background:
    radial-gradient(120% 140% at 40% 45%, rgba(124,147,190,.24), transparent 58%),
    radial-gradient(120% 140% at 80% 65%, rgba(201,139,160,.24), transparent 60%),
    radial-gradient(120% 140% at 12% 85%, rgba(255,251,242,.8), transparent 55%),
    var(--paper);
}

.poster-description{
  font-style:normal; color:var(--ink);
  font-size:13px; line-height:1.42; opacity:.72; max-width:34ch; margin-top:18px;
}

.business-impact{ margin-top:auto; padding-top:14px; border-top:1px solid rgba(20,20,20,.12); }
.bi-label{
  display:block; font-size:9px; font-weight:600; letter-spacing:.09em; text-transform:uppercase; opacity:.48; color:var(--ink);
}
.bi-outcomes{
  display:block; font-size:10.5px; line-height:1.25; font-weight:600; letter-spacing:.025em; text-transform:uppercase; margin-top:7px; color:var(--ink-soft);
}

@media (max-width:1023px){
  .transform-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .t-poster{ height:440px; }
}
@media (max-width:767px){
  .transform-grid{ grid-template-columns:1fr; gap:16px; }
  .t-poster{ height:410px; padding:20px; }
  .t-h{ font-size:29px; line-height:.96; max-width:13ch; }
  .poster-visual{ height:150px; margin-top:18px; }
}

/* ============================================================
   23-25. EXPERIÊNCIA APLICADA — prova rápida, 4 grandes case posters 2x2
   ============================================================ */
.applied-section .section-head h2{
  font-size:clamp(40px,4.5vw,68px); line-height:.96; font-weight:400; letter-spacing:-.04em;
  max-width:780px; text-wrap:balance; text-transform:none;
}
.applied-section .section-head p{
  font-size:16px; line-height:1.45; max-width:520px; margin-top:20px !important; color:var(--ink-soft);
}
.applied-section{ padding-bottom:0; }

.case-grid{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; }

.case-card{
  position:relative; overflow:hidden; box-sizing:border-box;
  height:390px; padding:26px; border-radius:24px;
  display:flex; flex-direction:column;
  border:1px solid var(--line); color:var(--ink);
  background:var(--paper);
  background:
    radial-gradient(circle at 85% 12%, color-mix(in srgb, var(--applied-color, var(--gold)) 22%, transparent), transparent 50%),
    var(--paper);
  transition:transform 320ms ease, box-shadow 320ms ease, border-color 320ms ease;
}
.case-card:hover{ transform:translateY(-4px); box-shadow:0 22px 44px -26px rgba(30,36,40,.32); border-color:var(--line-strong); }
.case-card:hover .case-graphic{ opacity:1; transform:scale(1.02); }
.case-card::after{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.05; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}

.case-client{ position:relative; z-index:1; font-size:11px; font-weight:600; letter-spacing:.07em; text-transform:uppercase; line-height:1.2; color:var(--ink); }
.case-meta{ position:relative; z-index:1; font-size:10px; font-weight:500; letter-spacing:.06em; text-transform:uppercase; opacity:.5; line-height:1.2; margin-top:4px; color:var(--ink); }

.case-h{
  position:relative; z-index:1; color:var(--ink); text-transform:none; font-style:normal;
  font-size:clamp(29px,2.7vw,42px); line-height:.96; font-weight:450; letter-spacing:-.035em;
  max-width:24ch; text-wrap:balance; margin-top:16px;
}

.case-graphic{ position:relative; z-index:1; margin-top:auto; opacity:.72; transition:opacity 320ms ease, transform 320ms ease; }
.case-graphic svg{ width:100%; height:auto; display:block; }

.case-tags{
  position:relative; z-index:1; margin-top:16px;
  font-size:10px; font-weight:600; letter-spacing:.055em; text-transform:uppercase; opacity:.55; color:var(--ink);
}

@media (max-width:1023px){
  .case-card{ height:360px; }
}
@media (max-width:767px){
  .case-grid{ grid-template-columns:1fr; gap:14px; }
  .case-card{ height:330px; padding:22px; }
  .case-h{ font-size:30px; }
}

/* ============================================================
   CTA FINAL
   ============================================================ */
.final-v2{text-align:center; position:relative; overflow:hidden; background:var(--ink);}
.final-v2::before{
  content:''; position:absolute; inset:0; z-index:0; pointer-events:none; opacity:.5; mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.5'/%3E%3C/svg%3E");
}
.final-v2 .wrap{position:relative; z-index:2;}
.final-v2 h2{font-size:clamp(26px,4vw,42px); max-width:760px; margin-left:auto; margin-right:auto; color:var(--paper);}
.final-v2 .eyebrow{color:rgba(255,255,255,.5);}
.final-v2 .ctas{display:flex; gap:14px; justify-content:center; flex-wrap:wrap;}
.final-v2 .btn-ghost{border-color:rgba(255,255,255,.3); color:var(--paper);}
.final-v2 .btn-ghost:hover{border-color:var(--paper);}
.final-v2 .btn-primary{background:var(--paper); color:var(--ink); border-color:var(--paper);}

/* ============================================================
   27. MOTION — limites globais (Home)
   ============================================================ */
.reveal{ transform:translateY(20px); transition:opacity var(--ease-scene) ease, transform var(--ease-scene) ease; }
.reveal-stagger > *{ transform:translateY(20px); transition:opacity var(--ease-ui) ease, transform var(--ease-ui) ease; }
.pattern-card{ transition:border-color var(--ease-ui) ease, background var(--ease-ui) ease, opacity var(--ease-ui) ease, transform var(--ease-ui) ease; }
.pattern-card:hover{ transform:translateY(-4px); }
@media (prefers-reduced-motion: reduce){
  main *{ scroll-behavior:auto !important; }
}

/* ============================================================
   28. REFINAMENTO MOBILE (<=767px) — escala tipográfica e ritmo
   consistentes; nada aqui altera desktop.
   ============================================================ */
@media (max-width:767px){
  /* tudo escopado a body.home — só a landing (index.html), não vaza pra ofertas/diagnóstico/etc */

  /* headlines de seção: 30-34px, poucas linhas, sem inflar */
  body.home .patterns-head h2,
  body.home .work-section .section-head h2,
  body.home .applied-section .section-head h2,
  body.home .pdd-h{
    font-size:clamp(28px,7.6vw,34px) !important;
    line-height:1.05; letter-spacing:-.03em;
  }
  body.home .pdd-cta-h{ font-size:clamp(30px,8vw,36px) !important; line-height:1.03; }
  body.home .ax-break-h{ font-size:clamp(26px,7vw,32px) !important; }
  body.home .final-v2 h2{ font-size:clamp(26px,6.8vw,32px); }
  body.home .section-head h2{ font-size:clamp(26px,7vw,32px); }

  /* eyebrows / labels */
  body.home .eyebrow,
  body.home .patterns-head .eyebrow{ font-size:12px; letter-spacing:.12em; }

  /* corpo de texto: 16px, respiro confortável */
  body.home .section-head p,
  body.home .patterns-head p,
  body.home .pdd-sup, body.home .pdd-cta-sup,
  body.home .work-section .section-head p,
  body.home .applied-section .section-head p,
  body.home .ax-break-sup{ font-size:16px !important; line-height:1.5; }

  /* ritmo entre intro e conteúdo das seções em pilha */
  body.home .pdd-intro{ padding-top:48px; padding-bottom:28px; }
  body.home .pdd-grid{ gap:24px; padding-bottom:48px; }
  body.home .pdd-radar-col{ padding-top:4px; }
  body.home .pdd-cta-section{ padding-top:48px; padding-bottom:64px; }
}