/* ==========================================================================
   Favela+ · Proposta para Gestão Pública · v1.2
   Deck contínuo — cenário fixo + seções em scroll snap
   Paleta amostrada da logomarca oficial (SVG/horizontal.svg)
   ========================================================================== */

:root{
  /* marca */
  --blue:#104798;          /* azul institucional da logo   */
  --blue-mid:#2F69B1;      /* azul médio (casinha azul)    */
  --orange:#F3911F;        /* laranja (cruz + casinha)     */
  --green:#84B829;         /* verde (casinha)              */

  /* derivados */
  --night:#06214C;
  --deep:#0A3272;
  --sky:#7FA8DA;
  --paper:#F1F6FC;
  --tint:#E4EEF9;

  /* texto */
  --ink:#0A2C63;
  --body:#233247;
  --muted:#6C7E96;
  --line:#D6E2F0;

  --bar:44px;
  --r:22px;

  --fh:"Montserrat","Poppins",Arial,sans-serif;
  --fb:"Inter",Arial,sans-serif;

  /* tokens de tom — sobrescritos por .sec--dark */
  --fg:var(--ink);
  --fg-2:var(--body);
  --fg-3:var(--muted);
  --card:#fff;
  --card-line:var(--line);
  --card-shadow:0 14px 34px rgba(10,44,99,.10);
}

*,*::before,*::after{box-sizing:border-box}

html{
  scroll-snap-type:y mandatory;
  scroll-behavior:smooth;
  -webkit-text-size-adjust:100%;
  overflow-x:clip;
}
body{
  margin:0;background:var(--night);color:var(--body);
  font-family:var(--fb);font-size:clamp(15px,1.02vw,17.5px);line-height:1.35;
  overflow-x:clip;
}
img{max-width:100%;display:block}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
h1,h2,h3{font-family:var(--fh);margin:0;line-height:1.1;color:var(--fg)}
p,ul,ol{margin:0;padding:0}
li{list-style:none}
b,strong{font-weight:700}

.ic{width:1em;height:1em;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:0 0 auto}

/* ══════════════════════ CENÁRIO CONTÍNUO ══════════════════════ */
.canvas{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}

/* céu superior (cor sólida) */
.canvas__wash{position:absolute;inset:0;background:#04142F}

/* brilho do horizonte — do azul da noite ao laranja do pôr do sol ao claro do dia */
.canvas__sky{
  position:absolute;inset:0;background:#0A2A55;
  -webkit-mask-image:linear-gradient(to bottom,transparent 18%,rgba(0,0,0,.55) 62%,#000 100%);
          mask-image:linear-gradient(to bottom,transparent 18%,rgba(0,0,0,.55) 62%,#000 100%);
}

/* o sol nasce ao longo da rolagem */
.canvas__sun{
  position:absolute;left:64%;top:118%;
  width:min(52vw,700px);aspect-ratio:1;
  background:#F3911F;opacity:0;
  -webkit-mask-image:radial-gradient(circle,#000 0%,rgba(0,0,0,.62) 26%,transparent 64%);
          mask-image:radial-gradient(circle,#000 0%,rgba(0,0,0,.62) 26%,transparent 64%);
}

.canvas__blob{
  position:absolute;width:62vw;height:62vw;border-radius:50%;filter:blur(90px);opacity:.4;
  mix-blend-mode:screen;
}
.canvas__blob--a{background:radial-gradient(circle,rgba(47,105,177,.7),transparent 68%);left:-16vw;top:-20vw}
.canvas__blob--b{background:radial-gradient(circle,rgba(243,145,31,.4),transparent 66%);right:-20vw;bottom:-14vw}
.canvas__dots{
  position:absolute;inset:-10%;
  background-image:radial-gradient(currentColor 1px,transparent 1.2px);
  background-size:30px 30px;color:#fff;opacity:.05;
}

/* silhueta do Rio — atravessa o deck inteiro deslizando na horizontal */
.canvas__city{
  position:absolute;left:0;bottom:0;
  width:max(172vw,1000px);aspect-ratio:7004.5/2020;
}
.canvas__city svg{width:100%;height:100%;display:block}
.rj-a{fill:#0E3163}
.rj-b{fill:#0B2850}
.rj-c{fill:#081E3E}
.rj-d{fill:#05142B}

.canvas__veil{
  position:absolute;left:0;right:0;bottom:0;height:min(46vh,420px);
  background:#04173A;opacity:.55;
  -webkit-mask-image:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,.32) 48%,transparent 88%);
          mask-image:linear-gradient(to top,rgba(0,0,0,.85),rgba(0,0,0,.32) 48%,transparent 88%);
}

/* clima claro: o cromo fixo se adapta ao capítulo */
:root.tone-light{
  --rail-bg:rgba(10,44,99,.16);
  --rail-dot:rgba(10,44,99,.3);
  --hud:#0A2C63;
  --stamp:rgba(10,44,99,.62);
}
:root.tone-light .hud__count b{color:#C0700D}
.rail__line,.rdot::before,.hud,.stamp{transition:background-color .55s ease,color .55s ease}
:root.tone-light .brand{box-shadow:0 8px 22px rgba(10,44,99,.14)}

/* ══════════════════════ CROMO FIXO ══════════════════════ */
.brand{
  position:fixed;z-index:70;top:clamp(16px,2.4vh,28px);left:clamp(58px,5.4vw,96px);
  background:#fff;padding:.5em .85em;border-radius:14px;
  box-shadow:0 8px 24px rgba(6,33,76,.22);
  transition:transform .4s cubic-bezier(.2,.8,.2,1);
}
.brand:hover{transform:translateY(-2px)}
.brand img{height:clamp(20px,2.5vh,28px);width:auto}
/* na abertura a marca já ocupa a tela: o selo fixo entra depois */
.brand{transition:transform .4s cubic-bezier(.2,.8,.2,1),opacity .5s ease}
:root.at-open .brand{opacity:0;pointer-events:none;transform:translateY(-6px)}

.rail{position:fixed;z-index:70;left:clamp(16px,2vw,34px);top:50%;transform:translateY(-50%);width:14px}
.rail__line{
  position:absolute;left:6px;top:-4px;bottom:-4px;width:2px;border-radius:2px;
  background:var(--rail-bg,rgba(255,255,255,.22));overflow:hidden;
}
.rail__line i{display:block;width:100%;height:100%;background:var(--orange);transform:scaleY(0);transform-origin:50% 0}
.rail__list{display:flex;flex-direction:column;gap:clamp(9px,1.6vh,17px);position:relative}
.rdot{position:relative;width:14px;height:14px;display:grid;place-items:center;padding:0}
.rdot::before{
  content:"";width:7px;height:7px;border-radius:50%;
  background:var(--rail-dot,rgba(255,255,255,.4));transition:.32s cubic-bezier(.2,.8,.2,1);
}
.rdot::after{
  content:attr(data-label);position:absolute;left:22px;top:50%;transform:translate(-6px,-50%);
  background:var(--blue);color:#fff;font-size:11.5px;font-weight:600;white-space:nowrap;
  padding:5px 10px;border-radius:9px;opacity:0;pointer-events:none;transition:.28s;
}
.rdot:hover::after{opacity:1;transform:translate(0,-50%)}
.rdot:hover::before{background:var(--orange);transform:scale(1.3)}
.rdot.is-on::before{background:var(--orange);width:11px;height:11px;box-shadow:0 0 0 4px rgba(243,145,31,.22)}

.hud{
  position:fixed;z-index:70;right:clamp(18px,2.4vw,40px);top:clamp(18px,2.6vh,30px);
  display:flex;align-items:center;gap:.9em;color:var(--hud,#fff);
}
.hud__chapter{
  font-family:var(--fh);font-weight:700;font-size:clamp(11px,.78vw,13.5px);
  letter-spacing:.14em;text-transform:uppercase;opacity:.72;
}
.hud__count{font-family:var(--fh);font-weight:800;font-size:clamp(12px,.9vw,15px);font-variant-numeric:tabular-nums}
.hud__count b{color:var(--orange)}
.hud__count i{opacity:.4;font-style:normal;margin:0 .25em}

.nudge{
  position:fixed;z-index:70;right:clamp(18px,2.4vw,40px);bottom:calc(var(--bar) + 16px);
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  background:var(--orange);color:#fff;box-shadow:0 10px 26px rgba(243,145,31,.38);
  transition:transform .32s cubic-bezier(.2,.8,.2,1),opacity .3s;
}
.nudge svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round}
.nudge:hover{transform:translateY(4px)}
.nudge.is-off{opacity:0;pointer-events:none;transform:scale(.6)}

.stamp{
  position:fixed;z-index:69;left:0;right:0;bottom:0;height:var(--bar);
  display:flex;align-items:center;justify-content:center;
  font-size:clamp(10.5px,.72vw,13px);letter-spacing:.06em;
  color:var(--stamp,rgba(255,255,255,.6));
  transition:color .5s;
  pointer-events:none;
}

/* a marca oficial nunca é recolorida: sobre fundo escuro, área clara */
.plate{
  display:inline-block;background:#fff;border-radius:26px;
  padding:clamp(18px,2.4vw,38px) clamp(22px,3vw,48px);
  box-shadow:0 26px 60px rgba(2,14,38,.4);
  transition:background .6s,box-shadow .6s,padding .6s;
}
/* de dia a marca já contrasta com o céu claro: dispensa a área clara */
.sec:not(.sec--dark) .plate{background:none;box-shadow:none;padding:0}
.plate--end{border-radius:30px;padding:clamp(20px,3vh,44px) clamp(26px,4vw,60px)}

/* ══════════════════════ SEÇÃO BASE ══════════════════════ */
.sec{
  position:relative;z-index:1;
  min-height:100svh;scroll-snap-align:start;scroll-snap-stop:always;
  display:grid;align-items:center;
  padding:clamp(74px,10vh,110px) clamp(58px,7vw,140px) calc(var(--bar) + clamp(16px,3vh,40px));
}
.sec__inner{width:100%;max-width:1320px;margin:0 auto;min-width:0}

.sec--dark{
  --fg:#fff;--fg-2:rgba(255,255,255,.87);--fg-3:rgba(255,255,255,.64);
  --card:rgba(9,20,44,.42);
  --card-line:rgba(255,255,255,.18);
  --card-shadow:0 18px 44px rgba(3,12,32,.4);
}
.sec--dark .panel,
.sec--dark .kpi,
.sec--dark .stepcard{backdrop-filter:blur(18px) saturate(1.15);-webkit-backdrop-filter:blur(18px) saturate(1.15)}

/* véu de leitura: ancora no lado do texto para o título não competir com o pôr do sol */
.sec--dark::before{
  content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(101deg,rgba(4,14,36,.66) 0%,rgba(4,14,36,.5) 32%,rgba(4,14,36,.14) 62%,transparent 80%),
    linear-gradient(to top,rgba(4,14,36,.3),transparent 46%);
}

/* ══════════════════════ TIPOGRAFIA ══════════════════════ */
.eyebrow{
  font-family:var(--fh);font-weight:700;font-size:clamp(10.5px,.74vw,13px);
  letter-spacing:.2em;text-transform:uppercase;color:var(--fg-3);margin-bottom:.9em;
}
.eyebrow--orange{color:var(--orange)}
.sec:not(.sec--dark) .eyebrow--orange{color:#C0700D}

.h-sec{
  font-size:clamp(30px,3.6vw,60px);font-weight:800;letter-spacing:-.022em;line-height:1.03;
  color:var(--fg);
}
.h-sec em{font-style:normal;color:var(--orange)}
.sec--dark .h-sec em{color:#FFA53A}
.h-sec--xl{font-size:clamp(30px,3.9vw,64px)}

.lede{font-size:clamp(14px,1.05vw,19px);line-height:1.5;color:var(--fg-2);max-width:46ch;margin-top:.9em}
.lede--xl{font-size:clamp(18px,1.65vw,30px);line-height:1.34;max-width:20ch;color:var(--fg)}
.lede b{color:var(--fg);font-weight:700}
.micro{font-size:clamp(10.5px,.72vw,12.5px);color:var(--fg-3);margin-top:1em}

.word{display:inline-block;overflow:hidden;vertical-align:bottom;padding-bottom:.1em;margin-bottom:-.1em}
.word>span,.word>em,.word>b{display:inline-block}

/* ══════════════════════ PAINEL (card) ══════════════════════ */
.panel{
  position:relative;background:var(--card);border:1px solid var(--card-line);
  border-radius:var(--r);padding:clamp(17px,1.5vw,30px);
  box-shadow:var(--card-shadow);
  display:flex;flex-direction:column;gap:clamp(8px,.9vh,15px);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  overflow:hidden;min-width:0;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s,border-color .45s;
}
.panel::after{
  content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--accent,var(--blue-mid));
}
.panel--orange{--accent:var(--orange)}
.panel--green{--accent:var(--green)}
.panel--blue{--accent:var(--blue-mid)}
.panel--deep{--accent:var(--blue)}
.panel--glass{--accent:var(--orange)}
.panel:hover{transform:translateY(-5px);box-shadow:0 24px 48px rgba(10,44,99,.16)}
.sec--dark .panel:hover{box-shadow:0 26px 54px rgba(3,17,44,.5);border-color:rgba(255,255,255,.3)}

.panel__title{
  display:flex;align-items:center;gap:.55em;
  font-size:clamp(15px,1.15vw,23px);font-weight:700;color:var(--fg);letter-spacing:-.01em;line-height:1.18;
}
.panel__title .ic{width:1.15em;height:1.15em;color:var(--accent,var(--blue-mid))}
.panel__title small{font-weight:500;color:var(--fg-3);font-family:var(--fb);font-size:.72em}
.panel__text{font-size:clamp(13px,.86vw,16.5px);line-height:1.45;color:var(--fg-2)}

.glyph{
  width:clamp(38px,3vw,56px);height:clamp(38px,3vw,56px);border-radius:16px;
  display:grid;place-items:center;background:var(--gb,rgba(47,105,177,.12));color:var(--gc,var(--blue-mid));
}
.glyph .ic{width:52%;height:52%}
.glyph--orange{--gb:rgba(243,145,31,.14);--gc:var(--orange)}
.glyph--green{--gb:rgba(132,184,41,.15);--gc:var(--green)}
.glyph--blue{--gb:rgba(47,105,177,.14);--gc:var(--blue-mid)}
.glyph--deep{--gb:rgba(16,71,152,.13);--gc:var(--blue)}
.sec--dark .glyph{background:rgba(255,255,255,.12)}
.sec--dark .glyph--blue,.sec--dark .glyph--deep{--gc:var(--sky)}
.sec--dark .glyph--green{--gc:#A6D94A}

.ticks li,.dots-list li{
  position:relative;padding-left:1.5em;font-size:clamp(12.5px,.85vw,16px);line-height:1.42;
  margin-bottom:.4em;color:var(--fg-2);
}
.ticks li::before{
  content:"";position:absolute;left:0;top:.3em;width:1em;height:1em;border-radius:50%;
  background:var(--accent,var(--blue-mid));
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.6 10 17.4 19.2 7.4' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/76% no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.6 10 17.4 19.2 7.4' fill='none' stroke='%23000' stroke-width='3.4' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/76% no-repeat;
}
.dots-list li::before{content:"";position:absolute;left:.3em;top:.62em;width:6px;height:6px;border-radius:50%;background:var(--orange)}
.ticks--inline{columns:2;column-gap:1.4em}
.ticks--grid{display:grid;grid-template-columns:1fr 1fr;column-gap:1.8em}

.quote{
  font-style:italic;color:var(--fg-2);font-size:clamp(14px,1.18vw,22px);line-height:1.4;
  border-left:3px solid var(--orange);padding-left:1em;
}
.quote--wide{max-width:none}
.quote--big{font-size:clamp(17px,1.85vw,34px);font-family:var(--fh);font-style:normal;font-weight:700;color:var(--fg)}

.callout{
  background:rgba(243,145,31,.14);border:1px solid rgba(243,145,31,.4);border-radius:14px;
  padding:.7em .95em;font-size:clamp(12px,.82vw,15px);font-weight:600;color:var(--fg);
}

.chip{
  display:inline-flex;align-items:center;gap:.55em;background:rgba(255,255,255,.1);
  border:1px solid rgba(255,255,255,.2);border-radius:100px;padding:.6em 1.05em;
  font-size:clamp(12px,.82vw,15px);font-weight:600;color:#fff;
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  transition:transform .38s cubic-bezier(.2,.8,.2,1),background .38s;
}
.chip .ic{width:1.25em;height:1.25em}
.chip--orange .ic{color:var(--orange)}
.chip--green .ic{color:var(--green)}
.chip--blue .ic{color:var(--sky)}
.chip--deep .ic{color:#fff}
.chip:hover{transform:translateY(-4px);background:rgba(255,255,255,.18)}

/* ══════════════════════ 01 · CAPA ══════════════════════ */
.cover{display:flex;flex-direction:column;align-items:flex-start;gap:clamp(22px,4.4vh,56px)}
.cover .lede--xl{font-size:clamp(24px,3vw,54px);max-width:16ch;line-height:1.08;letter-spacing:-.02em}
/* ══════════════════════ 00 · ABERTURA ══════════════════════ */
.sec--open{place-items:center;text-align:center}
.opening{display:flex;flex-direction:column;align-items:center;gap:clamp(14px,2.4vh,30px)}

/* Área clara exigida pela identidade — aqui ela é o assunto da tela, não um remendo */
.markplate{
  background:#fff;border-radius:clamp(22px,2.4vw,34px);
  padding:clamp(30px,5vh,64px) clamp(40px,6vw,96px);
  box-shadow:0 3.2rem 6rem rgba(2,12,34,.5),0 0 0 1px rgba(255,255,255,.5) inset;
}
.fm{display:block;width:min(56vw,300px);height:auto;overflow:visible}
.fm-navy{fill:#104798}
.fm-blue{fill:#2F69B1}
.fm-green{fill:#84B829}
.fm-orange{fill:#F3911F}
.fm-white{fill:#fff}

.opening__tag{
  display:flex;flex-wrap:wrap;justify-content:center;gap:.42em;
  font-family:var(--fh);font-weight:700;color:#fff;
  font-size:clamp(16px,1.9vw,34px);letter-spacing:-.01em;
}
.opening__tag span:nth-child(2){color:var(--orange)}
.opening__tag span:nth-child(4){color:var(--green)}
.opening__rule{width:clamp(48px,5vw,84px);height:3px;border-radius:2px;background:var(--orange)}
.opening__meta{
  font-family:var(--fh);font-weight:700;font-size:clamp(10.5px,.74vw,13px);
  letter-spacing:.22em;text-transform:uppercase;color:var(--fg-3);
}
.cover__body{width:100%}
.cover__list{margin-top:clamp(18px,3vh,38px);display:flex;flex-direction:column;gap:.55em}
.cover__list li{display:flex;align-items:baseline;gap:.85em;font-size:clamp(14px,1vw,19px);color:rgba(255,255,255,.9)}
.cover__list i{
  font-style:normal;font-family:var(--fh);font-weight:800;color:var(--orange);
  font-size:.82em;letter-spacing:.06em;min-width:2.2em;
}
.cover__chips{display:flex;flex-wrap:wrap;gap:clamp(8px,.8vw,14px);margin-top:clamp(4px,1.4vh,18px)}

/* ══════════════════════ 02 · DESAFIO ══════════════════════ */
.split{display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.28fr);gap:clamp(24px,4vw,80px);align-items:center}
.split__body{display:flex;flex-direction:column;gap:clamp(14px,2.2vh,30px);min-width:0}

.ledger{display:flex;flex-direction:column}
.ledger__row{
  display:grid;grid-template-columns:auto auto 1fr;align-items:baseline;
  gap:.5em clamp(10px,1vw,20px);
  padding:clamp(10px,1.5vh,20px) 0;border-top:1px solid var(--card-line);
}
.ledger__row:last-child{border-bottom:1px solid var(--card-line)}
.ledger__num{
  font-family:var(--fh);font-weight:900;letter-spacing:-.03em;
  font-size:clamp(30px,3.6vw,62px);color:var(--blue);font-variant-numeric:tabular-nums;line-height:.9;
}
.sec--dark .ledger__num{color:#93C2F2}
.ledger__num--orange,.sec--dark .ledger__num--orange{color:var(--orange)}
.ledger__num--green{color:var(--green)}
.sec--dark .ledger__num--green{color:#A6D94A}
.ledger__unit{font-family:var(--fh);font-weight:700;font-size:clamp(12px,.92vw,17px);color:var(--fg-3)}
.ledger__txt{font-size:clamp(12.5px,.85vw,16px);line-height:1.45;color:var(--fg-2);grid-column:3;max-width:44ch}
.ledger__txt b{color:var(--fg)}
.ledger__txt i{font-style:normal;color:var(--fg-3)}

.duo{display:grid;grid-template-columns:1fr 1fr;gap:clamp(12px,1.2vw,22px)}
.duo--tight{gap:clamp(10px,1vw,18px)}

/* ══════════════════════ 03 · SOLUÇÃO ══════════════════════ */
.solve{display:flex;flex-direction:column;gap:clamp(16px,2.6vh,34px)}
.solve__head{max-width:60ch}
.solve__stage{position:relative}
.solve__pin{
  position:absolute;left:50%;top:50%;width:clamp(70px,7vw,120px);
  transform:translate(-50%,-50%);opacity:0;z-index:2;pointer-events:none;
  filter:drop-shadow(0 14px 30px rgba(10,44,99,.3));
}
.fan{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.3vw,24px);align-items:stretch}
.fan__card{padding-top:clamp(20px,1.9vw,34px)}
.fan__card .panel__title{min-height:2.4em;align-items:flex-start}

/* ══════════════════════ 04 · COMO FUNCIONA ══════════════════════ */
.flowsec{display:flex;flex-direction:column;gap:clamp(16px,2.6vh,36px)}
.flowsec__head{max-width:58ch}
.chain{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,4vw,80px)}
/* SVG é elemento substituído: sem width explícito ele usa a largura intrínseca do viewBox */
.chain__wire{position:absolute;left:0;top:0;width:100%;height:clamp(48px,4.2vw,74px);color:var(--blue-mid);opacity:.5}
.sec--dark .chain__wire{color:var(--sky);opacity:.65}
.sec--dark .node__dot{background:rgba(255,255,255,.1);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.sec--dark .node--deep{--nc:var(--sky)}
.node{
  position:relative;z-index:1;text-align:center;display:flex;flex-direction:column;align-items:center;
  gap:.55em;
}
.node__dot{
  width:clamp(48px,4.2vw,74px);height:clamp(48px,4.2vw,74px);border-radius:50%;
  display:grid;place-items:center;background:#fff;border:2px solid var(--nc,var(--blue-mid));color:var(--nc,var(--blue-mid));
  box-shadow:0 12px 28px rgba(10,44,99,.13);
}
.node__dot .ic{width:46%;height:46%}
.node--orange{--nc:var(--orange)}
.node--green{--nc:var(--green)}
.node--deep{--nc:var(--blue)}
.node h3{font-size:clamp(15px,1.25vw,25px);color:var(--fg)}
.node p{font-size:clamp(12px,.82vw,15.5px);color:var(--fg-3);line-height:1.45}

/* ══════════════════════ 05 · MORADOR ══════════════════════ */
.journey{display:flex;flex-direction:column;gap:clamp(14px,2.4vh,32px)}
.trail{
  position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));
  gap:clamp(12px,1.4vw,26px);padding-top:clamp(72px,11vh,132px);align-items:start;
}
.trail__path{
  position:absolute;left:0;top:0;width:100%;height:clamp(72px,11vh,132px);
  color:rgba(255,255,255,.45);z-index:0;overflow:visible;
}
#trailDot{filter:drop-shadow(0 0 10px rgba(243,145,31,.9))}
.stepcard{
  position:relative;z-index:1;background:var(--card);border:1px solid var(--card-line);
  border-radius:var(--r);padding:clamp(15px,1.4vw,28px);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  display:flex;flex-direction:column;gap:.55em;
  transition:transform .45s cubic-bezier(.2,.8,.2,1),background .45s;
}
.stepcard--up{margin-top:clamp(-60px,-7vh,-24px)}
.stepcard:hover{transform:translateY(-5px);background:rgba(255,255,255,.12)}
.stepcard__n{
  width:clamp(32px,2.5vw,46px);height:clamp(32px,2.5vw,46px);border-radius:50%;
  display:grid;place-items:center;font-family:var(--fh);font-weight:800;
  border:2px solid var(--sky);color:var(--sky);font-size:clamp(13px,1vw,19px);
}
.stepcard__n--orange{border-color:var(--orange);color:var(--orange)}
.stepcard__n--green{border-color:var(--green);color:var(--green)}
.stepcard h3{font-size:clamp(15px,1.2vw,24px)}
.stepcard p{font-size:clamp(12.5px,.85vw,16px);color:var(--fg-2);line-height:1.45}

/* ══════════════════════ 06 · BENTO ══════════════════════ */
.bentosec{display:flex;flex-direction:column;gap:clamp(16px,2.6vh,34px)}
.bentosec__head{max-width:56ch}
.bento{
  display:grid;gap:clamp(11px,1.1vw,20px);
  grid-template-columns:repeat(3,minmax(0,1fr));
  grid-template-areas:"a b c" "d d d";
}
.bento__d{flex-direction:row;align-items:center;gap:clamp(14px,1.6vw,30px)}
.bento__d .panel__title{flex:0 0 auto;max-width:15ch}
.bento__d .panel__text{flex:1 1 auto}
.bento__a{grid-area:a}
.bento__b{grid-area:b}
.bento__c{grid-area:c}
.bento__d{grid-area:d}
.bento__a .panel__title{font-size:clamp(17px,1.5vw,30px)}

/* ══════════════════════ 07 · MODELO FINANCEIRO ══════════════════════ */
.money{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:clamp(22px,3.6vw,72px);align-items:center}
.price{display:flex;align-items:baseline;gap:.4em;margin-top:clamp(14px,2.4vh,32px);color:#fff}
.price__cur{font-family:var(--fh);font-weight:700;font-size:clamp(20px,2vw,36px);color:var(--fg-3)}
.price__val{
  font-family:var(--fh);font-weight:900;letter-spacing:-.04em;line-height:.86;
  font-size:clamp(58px,8vw,140px);font-variant-numeric:tabular-nums;
  background:linear-gradient(100deg,#fff 12%,var(--orange) 88%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.price__cap{color:var(--fg-3);font-size:clamp(12px,.85vw,16px);margin-top:.3em;letter-spacing:.04em}

.stack{display:flex;width:100%;height:clamp(46px,4.6vh,66px);border-radius:16px;overflow:hidden;margin-top:clamp(16px,2.6vh,34px);gap:3px}
.stack__seg{
  width:var(--w);display:flex;flex-direction:column;justify-content:center;
  padding:0 clamp(8px,.9vw,18px);color:#fff;transform-origin:0 50%;
  border-radius:6px;overflow:hidden;
}
.stack__seg b{font-size:clamp(10.5px,.72vw,13px);font-weight:600;opacity:.9;white-space:nowrap}
.stack__seg i{font-style:normal;font-family:var(--fh);font-weight:800;font-size:clamp(12px,.95vw,18px);white-space:nowrap}
.stack__seg--blue{background:var(--blue-mid)}
.stack__seg--orange{background:var(--orange)}
.stack__seg--green{background:var(--green)}

.money__right{gap:clamp(10px,1.4vh,20px)}
.scen{display:flex;flex-direction:column;gap:clamp(9px,1.2vh,16px)}
.scen__tabs{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.stab{
  border:1.5px solid var(--card-line);border-radius:13px;padding:.62em .5em;text-align:center;
  font-size:clamp(11.5px,.76vw,14px);font-weight:600;color:var(--fg);line-height:1.25;transition:.28s;
}
.stab small{display:block;font-weight:500;color:var(--fg-3);font-size:.85em}
.stab:hover{border-color:var(--orange)}
.stab.is-active{background:var(--orange);border-color:var(--orange);color:#fff}
.stab.is-active small{color:rgba(255,255,255,.85)}

.slider{display:flex;flex-direction:column;gap:.34em}
.slider__cap{font-size:clamp(10px,.7vw,12.5px);font-weight:700;color:var(--fg-3);text-transform:uppercase;letter-spacing:.14em}
.slider output{font-family:var(--fh);font-weight:800;color:var(--fg);font-size:clamp(13px,.9vw,17px);font-variant-numeric:tabular-nums}
input[type=range]{
  -webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:4px;cursor:pointer;
  background:linear-gradient(90deg,var(--orange) var(--p,15%),rgba(255,255,255,.22) var(--p,15%));
}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--orange);box-shadow:0 3px 10px rgba(0,0,0,.3)}
input[type=range]::-moz-range-thumb{width:20px;height:20px;border-radius:50%;background:#fff;border:3px solid var(--orange);box-shadow:0 3px 10px rgba(0,0,0,.3)}

.scen__out{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.scen__out div{background:rgba(255,255,255,.08);border-radius:13px;padding:.65em .85em}
.scen__out span{display:block;font-size:clamp(9.5px,.68vw,12px);color:var(--fg-3);font-weight:700;text-transform:uppercase;letter-spacing:.1em}
.scen__out b{font-family:var(--fh);font-weight:800;color:#fff;font-size:clamp(14px,1.1vw,22px);font-variant-numeric:tabular-nums}

/* ══════════════════════ 08 · INDICADORES ══════════════════════ */
.kpis{display:flex;flex-direction:column;gap:clamp(16px,2.8vh,38px)}
.kpis__head{max-width:56ch}
.kpis__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(10px,1.1vw,20px)}
.kpi{
  display:flex;flex-direction:column;gap:.5em;padding:clamp(14px,1.3vw,26px);
  border-radius:18px;background:var(--card);border:1px solid var(--card-line);
  box-shadow:var(--card-shadow);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  transition:transform .45s cubic-bezier(.2,.8,.2,1),box-shadow .45s;
}
.kpi:hover{transform:translateY(-5px);box-shadow:0 22px 44px rgba(10,44,99,.16)}
.kpi h3{font-size:clamp(14px,1.02vw,20px)}
.kpi p{font-size:clamp(12px,.8vw,15px);color:var(--fg-3);line-height:1.42}

/* ══════════════════════ 09 · PILOTO 90 DIAS ══════════════════════ */
.plan{display:flex;flex-direction:column;gap:clamp(18px,3vh,42px)}
.plan__head{max-width:52ch}
.rails{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:clamp(8px,.9vw,18px);padding-top:26px}
.rails__track{position:absolute;left:10%;right:10%;top:8px;height:3px;border-radius:2px;background:var(--line);overflow:hidden}
.rails__track i{display:block;height:100%;background:linear-gradient(90deg,var(--orange),var(--green));transform:scaleX(0);transform-origin:0 50%}
.station{
  position:relative;text-align:center;padding:clamp(20px,1.6vw,30px) .7em clamp(12px,1.1vw,20px);
  background:var(--card);border:1px solid var(--card-line);border-radius:18px;
  box-shadow:var(--card-shadow);transition:.4s cubic-bezier(.2,.8,.2,1);
  display:flex;flex-direction:column;gap:.2em;
}
.station__dot{position:absolute;top:-11px;left:50%;transform:translateX(-50%);width:18px;height:18px;border-radius:50%;background:var(--blue-mid);border:4px solid var(--paper);transition:.4s}
.station:nth-child(2) .station__dot,.station:last-child .station__dot{background:var(--orange)}
.station b{font-family:var(--fh);font-weight:700;color:var(--fg);font-size:clamp(12.5px,.88vw,17px)}
.station small{font-size:clamp(11px,.76vw,14px);color:var(--fg-3);line-height:1.3}
.station:hover{transform:translateY(-5px)}
.station.is-active{border-color:var(--orange);box-shadow:0 16px 34px rgba(243,145,31,.2)}
.station.is-active .station__dot{transform:translateX(-50%) scale(1.35);background:var(--orange)}
.plan__deliver{width:100%}

/* ══════════════════════ 10 · PROPOSTA ══════════════════════ */
.deal{display:flex;flex-direction:column;gap:clamp(16px,2.8vh,38px)}
.deal__head{max-width:54ch}
.deal__cols{display:grid;grid-template-columns:1fr auto 1fr;gap:clamp(12px,1.6vw,30px);align-items:stretch}
.deal__vs{align-self:center}
.deal__vs{
  width:clamp(42px,3.4vw,62px);height:clamp(42px,3.4vw,62px);border-radius:50%;display:grid;place-items:center;
  background:var(--blue);color:#fff;box-shadow:0 14px 30px rgba(16,71,152,.32);
}
.deal__vs .ic{width:52%;height:52%}
.steps3{display:grid;grid-template-columns:auto 1fr auto 1fr auto 1fr;align-items:center;gap:clamp(8px,1vw,18px)}
.steps3__cap{grid-column:1/-1;font-family:var(--fh);font-weight:700;color:var(--fg);font-size:clamp(13px,.95vw,18px)}
.pill{
  background:var(--card);border:1.5px solid var(--card-line);border-radius:15px;
  padding:clamp(11px,1vw,19px) clamp(11px,1vw,19px);text-align:center;
  font-size:clamp(11px,.76vw,14.5px);font-weight:700;color:var(--fg);
  text-transform:uppercase;letter-spacing:.03em;line-height:1.3;
  box-shadow:var(--card-shadow);transition:.4s cubic-bezier(.2,.8,.2,1);
}
.pill:hover{transform:translateY(-4px);border-color:var(--orange)}
.steps3__arrow{color:var(--orange);display:grid;place-items:center}
.steps3__arrow .ic{width:clamp(24px,2.2vw,38px);height:clamp(24px,2.2vw,38px)}

/* ══════════════════════ 11 · INTERFACE ══════════════════════ */
.ui{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(20px,3vw,60px);align-items:center}
.ui__tabs{display:flex;flex-direction:column;gap:8px;margin-top:clamp(16px,2.6vh,32px);max-width:22em}
.utab{
  text-align:left;border:1.5px solid var(--card-line);border-radius:13px;padding:.66em .95em;
  color:var(--fg-2);font-weight:600;font-size:clamp(12px,.82vw,15.5px);background:var(--card);transition:.3s;
}
.utab:hover{border-color:var(--orange);color:var(--fg)}
.utab.is-active{background:var(--orange);border-color:var(--orange);color:#fff}
.ui__hint{
  display:flex;align-items:center;gap:.5em;margin-top:1.2em;
  font-size:clamp(11px,.74vw,13.5px);color:var(--fg-3);
}
.ui__hint .ic{width:1.15em;height:1.15em;color:var(--orange)}

/* ── aparelho flat ── */
.stagephone{display:grid;place-items:center;position:relative}
.stagephone::before{
  content:"";position:absolute;width:78%;aspect-ratio:1;border-radius:50%;
  background:radial-gradient(circle,rgba(47,105,177,.28),transparent 66%);filter:blur(30px);
}
.phone{
  --ph:min(64vh,620px);
  position:relative;height:var(--ph);width:calc(var(--ph) * .4621);
  font-size:calc(var(--ph) * .4621 / 22);
  background:#0B1E3F;border-radius:3.1em;padding:.34em;
  box-shadow:0 2.2em 4em rgba(6,28,66,.34),0 0 0 .09em rgba(255,255,255,.14) inset;
}
.phone__key{position:absolute;background:#0B1E3F;border-radius:.3em}
.phone__key--vol-up{left:-.22em;top:9em;width:.24em;height:2.2em}
.phone__key--vol-down{left:-.22em;top:11.9em;width:.24em;height:2.2em}
.phone__key--power{right:-.22em;top:10.6em;width:.24em;height:3.6em}
.phone__screen{
  position:relative;width:100%;height:100%;border-radius:2.85em;overflow:hidden;
  background:linear-gradient(180deg,#FFFFFF,#EAF2FB);color:var(--ink);
  display:flex;flex-direction:column;
}
.phome{
  position:absolute;left:50%;bottom:.55em;transform:translateX(-50%);
  width:32%;height:.28em;border-radius:.2em;background:rgba(10,44,99,.28);
}

/* barra de status */
.pbar{
  position:relative;flex:0 0 auto;height:2.6em;display:flex;align-items:center;
  justify-content:space-between;padding:0 1.5em;font-size:.78em;font-weight:700;color:var(--ink);
}
.pbar__island{
  position:absolute;left:50%;top:.5em;transform:translateX(-50%);
  width:7.2em;height:1.9em;border-radius:1em;background:#0B1E3F;
}
.pbar__ic{display:flex;align-items:center;gap:.36em}
.pbar__sig,.pbar__wifi,.pbar__bat{display:block;background:var(--ink);border-radius:.12em}
.pbar__sig{width:1.1em;height:.72em;clip-path:polygon(0 60%,22% 60%,22% 100%,0 100%,0 60%,33% 35%,55% 35%,55% 100%,33% 100%,33% 35%,66% 12%,88% 12%,88% 100%,66% 100%)}
.pbar__wifi{width:.9em;height:.72em;clip-path:polygon(50% 100%,0 34%,14% 22%,50% 62%,86% 22%,100% 34%)}
.pbar__bat{width:1.5em;height:.72em;border-radius:.22em}

/* pilha de telas */
.pscreens{position:relative;flex:1 1 auto;min-height:0}
.pscr{
  position:absolute;inset:0;overflow:hidden;opacity:0;pointer-events:none;
  display:flex;flex-direction:column;
}
.pscr.is-on{opacity:1;pointer-events:auto}
.pscr__body{
  flex:1 1 auto;min-height:0;overflow:hidden;
  padding:1.1em 1.5em 1.8em;display:flex;flex-direction:column;gap:.42em;
}
.pscr__body--center{justify-content:center;gap:.5em}

/* marca dentro da tela */
.plogo{display:flex;flex-direction:column;align-items:center;gap:.35em;margin-bottom:1.1em}
.plogo img{height:5.4em;width:auto}
.plogo__tag{font-family:var(--fh);font-weight:700;font-size:.72em;color:var(--muted);letter-spacing:.04em}

.ptop{display:flex;align-items:center;justify-content:space-between;margin-bottom:.7em}
.ptop__mark{height:1.9em;width:auto}
.ptop__out{
  width:2.1em;height:2.1em;border-radius:.7em;display:grid;place-items:center;
  background:#EDF3FB;color:var(--blue);
}
.ptop__out .ic{width:1.1em;height:1.1em}

.ptitle{font-size:1.45em;font-weight:800;color:var(--ink);letter-spacing:-.02em}
.psub{font-size:.8em;color:var(--muted);margin-bottom:.5em;line-height:1.35}

/* campos */
.pfield__label{font-size:.72em;font-weight:700;color:var(--ink);margin-top:.3em}
.pfield{
  display:flex;align-items:center;gap:.55em;height:2.65em;padding:0 .8em;
  border:1px solid #D5E2F1;border-radius:.7em;background:#fff;
  font-size:.82em;color:var(--muted);
  transition:border-color .25s,box-shadow .25s;
}
.pfield .ic{width:1.15em;height:1.15em;color:#9CB3CE;flex:0 0 auto}
.pfield__ph{flex:1 1 auto;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.pfield__dots{flex:1 1 auto;letter-spacing:.14em;color:var(--ink)}
.pfield__eye{margin-left:auto}
.pfield.is-focus{border-color:var(--orange);box-shadow:0 0 0 .2em rgba(243,145,31,.18)}
.phelp{font-size:.66em;color:var(--muted)}
.prow{display:grid;grid-template-columns:1fr 1fr;gap:.55em}
.prow>div{display:flex;flex-direction:column;gap:.15em;min-width:0}

/* botões */
.pbtn{
  height:2.9em;border-radius:.75em;font-family:var(--fh);font-weight:800;
  font-size:.86em;letter-spacing:.04em;text-transform:uppercase;color:#fff;margin-top:.55em;
  transition:transform .2s,filter .2s;
}
.pbtn:active{transform:scale(.97)}
.pbtn--navy{background:var(--blue)}
.pbtn--orange{background:var(--orange)}
.pbtn:hover{filter:brightness(1.06)}

.plink{font-size:.72em;font-weight:700;color:var(--orange);text-decoration:underline;text-underline-offset:.18em}
.plink--right{align-self:flex-end;margin-top:.15em}

.pdiv{display:flex;align-items:center;gap:.7em;margin:.9em 0 .55em;color:var(--muted);font-size:.68em}
.pdiv::before,.pdiv::after{content:"";flex:1 1 auto;height:1px;background:#DCE7F3}

.psocial{display:grid;grid-template-columns:repeat(3,1fr);gap:.45em}
.psocial__b{
  height:2.3em;border:1px solid #D5E2F1;border-radius:.6em;background:#fff;
  font-size:.72em;font-weight:700;color:var(--ink);transition:.25s;
}
.psocial__b:hover{border-color:var(--blue-mid);color:var(--blue)}
.pfoot{margin-top:auto;padding-top:.9em;text-align:center;font-size:.74em;color:var(--muted)}
.pscr__body--center .pfoot{margin-top:1.1em}

.pcheck{display:flex;align-items:flex-start;gap:.55em;text-align:left;margin-top:.5em}
.pcheck__box{
  flex:0 0 auto;width:1.15em;height:1.15em;border-radius:.28em;border:1.5px solid #C3D4E8;
  display:grid;place-items:center;background:#fff;transition:.22s;margin-top:.08em;
}
.pcheck__box .ic{width:.8em;height:.8em;color:#fff;stroke-width:3.4;opacity:0;transition:.22s}
.pcheck[aria-pressed="true"] .pcheck__box{background:var(--green);border-color:var(--green)}
.pcheck[aria-pressed="true"] .pcheck__box .ic{opacity:1}
.pcheck__tx{font-size:.7em;line-height:1.35;color:var(--muted)}
.pcheck__tx b{color:var(--blue);font-weight:700}

/* tela inicial */
.psection{
  font-family:var(--fh);font-weight:800;font-size:.92em;color:var(--ink);
  border-left:.24em solid var(--orange);padding-left:.5em;margin-bottom:.6em;
}
.phero{
  background:linear-gradient(160deg,#FFFFFF,#F0F6FD);border:1px solid #DCE8F5;
  border-radius:1em;padding:.9em 1em;box-shadow:0 .5em 1.2em rgba(10,44,99,.07);
}
.phero h3{font-size:1.05em;font-weight:800;color:var(--ink);line-height:1.2}
.phero h3 em{font-style:normal;color:var(--orange)}
.phero p{font-size:.72em;color:var(--body);margin:.4em 0 .5em;line-height:1.4}
.phero p b{color:var(--ink)}
.phero ul{display:flex;flex-direction:column;gap:.3em}
.phero li{display:flex;align-items:center;gap:.45em;font-size:.72em;color:var(--body)}
.phero li .ic{width:.95em;height:.95em;color:var(--green);stroke-width:3.2}

.pitem{
  display:flex;align-items:center;gap:.65em;text-align:left;margin-top:.55em;
  background:#fff;border:1px solid #E1EBF6;border-left:.28em solid var(--pc,var(--blue-mid));
  border-radius:.8em;padding:.65em .7em;box-shadow:0 .35em 1em rgba(10,44,99,.06);
  transition:transform .25s cubic-bezier(.2,.8,.2,1),box-shadow .25s;
}
.pitem:hover{transform:translateX(.2em);box-shadow:0 .6em 1.4em rgba(10,44,99,.13)}
.pitem:active{transform:scale(.985)}
.pitem--blue{--pc:var(--blue-mid)}
.pitem--orange{--pc:var(--orange)}
.pitem--green{--pc:var(--green)}
.pitem__ic{
  flex:0 0 auto;width:2.1em;height:2.1em;border-radius:.6em;display:grid;place-items:center;
  background:color-mix(in srgb,var(--pc) 14%,#fff);color:var(--pc);
}
.pitem__ic .ic{width:1.1em;height:1.1em}
.pitem__tx{display:flex;flex-direction:column;min-width:0;flex:1 1 auto}
.pitem__tx b{font-family:var(--fh);font-weight:700;font-size:.8em;color:var(--ink);text-transform:uppercase;letter-spacing:.02em}
.pitem__tx i{font-style:normal;font-size:.66em;color:var(--muted);line-height:1.3}
.pitem__go{width:.95em;height:.95em;color:#A9BFD8;flex:0 0 auto}

/* barra de abas ancorada no rodapé do aparelho, como num app real */
.ptabbar{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  display:grid;grid-template-columns:repeat(3,1fr);
  padding:.7em 1.5em 1.6em;border-top:1px solid #E1EBF6;
  background:rgba(255,255,255,.94);
  backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
}
.pscr[data-screen="inicial"] .pscr__body{padding-bottom:5.6em}
.ptabbar span{
  display:flex;flex-direction:column;align-items:center;gap:.2em;
  font-size:.62em;font-weight:600;color:#A9BFD8;
}
.ptabbar span .ic{width:1.4em;height:1.4em}
.ptabbar .is-on{color:var(--blue)}

/* ══════════════════════ 12 · PRÓXIMOS PASSOS ══════════════════════ */
.asks{display:flex;flex-direction:column;gap:clamp(20px,3.4vh,50px)}
.asks__head .h-sec{max-width:17ch}
.asks__head .lede{max-width:60ch}
.asks__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,1.6vw,30px)}
.ask{
  position:relative;padding-top:clamp(14px,2vh,26px);border-top:2px solid var(--card-line);
  display:flex;flex-direction:column;gap:.5em;transition:border-color .4s;
}
.ask:hover{border-color:var(--orange)}
.ask i{font-style:normal;font-family:var(--fh);font-weight:900;color:var(--orange);font-size:clamp(13px,1vw,19px);letter-spacing:.08em}
.ask h3{font-size:clamp(20px,2.2vw,42px);letter-spacing:-.02em}
.ask p{font-size:clamp(13px,.9vw,17px);color:var(--fg-2);line-height:1.45}
.ask__cta{display:inline-flex;align-items:center;gap:.5em;margin-top:.4em;font-weight:700;color:var(--fg);font-size:clamp(12px,.82vw,15px)}
.ask__cta .ic{width:1.25em;height:1.25em;color:var(--orange)}

/* ══════════════════════ 13 · ENCERRAMENTO ══════════════════════ */
.sec--end{place-items:center}
.endsec{display:flex;flex-direction:column;align-items:center;gap:clamp(12px,2vh,26px);text-align:center}
.endsec__logo{width:min(60vw,280px)}
.endsec__tag{font-family:var(--fh);font-weight:700;color:var(--fg-2);font-size:clamp(13px,1.2vw,23px)}
.endsec__rule{width:clamp(60px,7vw,120px);height:3px;border-radius:2px;background:var(--orange);margin:clamp(6px,1.4vh,18px) 0}
.endsec__medya{width:clamp(160px,17vw,300px);background:#fff;border-radius:14px;padding:.85em 1.2em}

/* ══════════════════════ RESPONSIVO ══════════════════════ */
@media (max-width:1180px){
  .bento{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:"a a" "b c" "d d"}
  .kpis__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .ticks--inline{columns:1}
}
@media (max-width:980px){
  html{scroll-snap-type:y proximity}
  .sec{min-height:auto;padding:clamp(84px,12vh,120px) 6vw calc(var(--bar) + 34px);display:block}
  .rail,.nudge{display:none}
  .brand{left:6vw}
  .hud{right:6vw}
  .sec--open{display:grid;place-items:center;min-height:100svh}
  .markplate{padding:clamp(24px,4vh,44px) clamp(28px,7vw,56px)}
  .fm{width:min(58vw,240px)}
  .opening__tag{font-size:clamp(17px,5.2vw,26px)}
  .split,.money,.ui{grid-template-columns:1fr}
  .duo,.deal__cols,.fan,.chain,.trail,.kpis__grid,.asks__grid,.bento{grid-template-columns:1fr;grid-template-areas:none}
  .chain__wire,.trail__path,.rails__track{display:none}
  .trail{padding-top:0}
  .stepcard--up{margin-top:0}
  .deal__vs{justify-self:center;transform:rotate(90deg)}
  .steps3{grid-template-columns:1fr}
  .steps3__arrow{transform:rotate(90deg);justify-self:center}
  .rails{grid-template-columns:1fr;gap:22px;padding-top:0}
  .station{text-align:left}
  .station__dot{position:static;transform:none;margin-bottom:.5em;border-width:0}
  .ticks--grid{grid-template-columns:1fr}
  .phone{--ph:min(74vh,560px)}
  .stagephone{margin-top:26px}
  .ui__tabs .utab{flex:1 1 auto;text-align:center}
  .ui__tabs{flex-direction:row;flex-wrap:wrap}
  .solve__pin{display:none}
  .ledger__row{grid-template-columns:auto auto;justify-content:start;gap:.3em .7em}
  .ledger__txt{grid-column:1/-1;max-width:none}
  .stamp{backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}
  .bento__d{flex-direction:column;align-items:flex-start}
  .bento__d .panel__title{max-width:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;scroll-snap-type:none}
  *,*::before,*::after{animation-duration:.001ms !important;transition-duration:.001ms !important}
}
@media print{
  .canvas,.rail,.nudge,.hud,.brand,.stamp{display:none}
  .sec{page-break-after:always;min-height:auto;background:#fff}
}
