@layer tokens, reset, base, layout, components, effects, utilities;

@font-face{font-family:"Bodoni Moda";src:url("../fonts/bodoni-moda-latin-wght-normal.woff2") format("woff2");font-weight:400 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bodoni Moda";src:url("../fonts/bodoni-moda-latin-wght-italic.woff2") format("woff2");font-weight:400 900;font-style:italic;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Hanken Grotesk";src:url("../fonts/hanken-grotesk-latin-wght-normal.woff2") format("woff2");font-weight:100 900;font-style:normal;font-display:swap;unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/* #08 mínimo: inerte até existirem outras páginas do site */
@view-transition{navigation:auto}

@layer tokens{
  /* ===== Claro (padrão): neutros, sem azul-acinzentado ===== */
  :root{
    --ink:#0f1115;
    --bg-page:#faf9f7;
    --bg-surface:#fff;
    --bg-elevated:#fff;
    --bg-hover:#eeece7;
    --bg-tint:#f6f4f0;
    --bg-mist:#eeece7;
    --line-subtle:rgb(15 17 21 / .10);
    --line-strong:rgb(15 17 21 / .22);
    --link:var(--itl-navy-700);
    --link-hover:var(--itl-navy-900);
    --focus-ring-color:var(--itl-navy-900);
    --action-secondary-bg-hover:rgb(15 17 21 / .06);
    --shadow-color-soft:rgb(15 17 21 / .07);
    --shadow-color:rgb(15 17 21 / .16);
    --card-bg:#fff;
    --card-bd:rgb(15 17 21 / .09);
    --leak-w:color-mix(in oklab,var(--itl-ouro-200) 58%,transparent);
    --leak-c:color-mix(in oklab,var(--itl-navy-200) 52%,transparent);
    --chip-bg:rgb(15 17 21 / .035);
    --grid-line:#e8e5df;
    --fab-bg:var(--ink);
    --fab-fg:var(--itl-ouro-200);
  }
  [data-surface="apoio"],.surface-apoio{
    --bg-page:#f3f1ed;
    --bg-hover:#eae7e1;
    --bg-tint:#faf9f7;
    --line-subtle:rgb(15 17 21 / .12);
    --line-strong:rgb(15 17 21 / .26);
    --card-bd:rgb(15 17 21 / .10);
    --action-secondary-bg-hover:rgb(15 17 21 / .06);
  }
  /* Faixas escuras: o design system já define o fundo; aqui só neutralizo linhas, cartões e foco */
  [data-surface="deep"],.surface-deep{
    --bg-surface:var(--itl-navy-950);--bg-elevated:var(--itl-navy-950);--bg-hover:var(--itl-navy-950);--bg-tint:var(--itl-navy-950);--bg-mist:var(--itl-navy-950);
    --line-subtle:rgb(255 255 255 / .10);
    --line-strong:rgb(255 255 255 / .22);
    --text-muted:#b7bfcb;
    --action-secondary-border:rgb(255 255 255 / .42);
    --action-secondary-text:#f2f4f7;
    --action-secondary-bg-hover:rgb(255 255 255 / .08);
    --focus-ring-color:#fff;
    --card-bg:#0f1115;
    --card-bd:rgb(255 255 255 / .08);
    --leak-w:color-mix(in oklab,var(--itl-navy-600) 38%,transparent);
    --leak-c:color-mix(in oklab,var(--itl-navy-700) 85%,transparent);
    --chip-bg:rgb(255 255 255 / .05);
    --grid-line:#262b33;
    --shadow-color-soft:rgb(0 0 0 / .35);
    --shadow-color:rgb(0 0 0 / .55);
  }
  /* ===== Escuro (botão do cabeçalho) ===== */
  html[data-theme="dark"]{
    --bg-page:#0b0d10;
    --bg-surface:#0f1115;
    --bg-elevated:#14171c;
    --bg-hover:#171b21;
    --bg-tint:#12151a;
    --bg-mist:#171b21;
    --text-strong:#f2f4f7;
    --text-body:#d8dde4;
    --text-muted:#9ba4b1;
    --line-subtle:rgb(255 255 255 / .09);
    --line-strong:rgb(255 255 255 / .22);
    --accent:var(--itl-ouro-300);
    --accent-strong:var(--itl-ouro-300);
    --action-primary-bg:var(--itl-ouro-300);
    --action-primary-bg-hover:var(--itl-ouro-200);
    --action-primary-bg-active:var(--itl-ouro-400);
    --action-primary-text:var(--itl-navy-900);
    --action-secondary-border:rgb(255 255 255 / .42);
    --action-secondary-text:#f2f4f7;
    --action-secondary-bg-hover:rgb(255 255 255 / .08);
    --link:var(--itl-ouro-300);
    --link-hover:var(--itl-ouro-200);
    --focus-ring-color:#fff;
    --selection-bg:var(--itl-ouro-300);
    --state-success-fg:var(--itl-success-300);
    --state-success-bg:var(--itl-success-900);
    --state-success-border:var(--itl-success-700);
    --shadow-color-soft:rgb(0 0 0 / .35);
    --shadow-color:rgb(0 0 0 / .55);
    --card-bg:#0f1115;
    --card-bd:rgb(255 255 255 / .08);
    --leak-w:color-mix(in oklab,var(--itl-navy-600) 38%,transparent);
    --leak-c:color-mix(in oklab,var(--itl-navy-700) 85%,transparent);
    --chip-bg:rgb(255 255 255 / .05);
    --grid-line:#242931;
    --fab-bg:var(--itl-ouro-300);
    --fab-fg:var(--ink);
  }
  html[data-theme="dark"] [data-surface="apoio"]{
    --bg-page:#101318;
    --bg-hover:#181c23;
    --bg-tint:#0d0f13;
    --line-subtle:rgb(255 255 255 / .10);
    --line-strong:rgb(255 255 255 / .24);
    --card-bg:#151920;
    --card-bd:rgb(255 255 255 / .09);
    --action-secondary-bg-hover:rgb(255 255 255 / .08);
  }
  :root{
    --itl-navy-950:#050d1a;
    --gradient-deep:linear-gradient(160deg,var(--itl-navy-950),var(--itl-navy-900));
    --font-display:"Bodoni Moda","Didot","Bodoni 72",Georgia,serif;
    --font-body:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
    --fs-scale:1;
    --h-k:1.25; /* H1, H2 e H3: +25% sobre a escala anterior */
    --step--1:clamp(.84rem,.81rem + .14vw,.92rem);
    --step-0:clamp(1rem,.97rem + .16vw,1.09rem);
    --step-1:clamp(1rem,.96rem + .2vw,1.12rem);
    --step-2:clamp(1rem,.96rem + .25vw,1.15rem);
    --step-3:clamp(1.1rem,1.04rem + .4vw,1.35rem);
    --step-4:clamp(1.35rem,1.15rem + .9vw,1.8rem);
    --step-5:clamp(1.7rem,1.4rem + 1.6vw,2.55rem);
    --label:clamp(.72rem,.7rem + .1vw,.78rem);
    --space-2xs:clamp(.5rem,.46rem + .2vw,.62rem);
    --space-xs:clamp(.75rem,.69rem + .3vw,.94rem);
    --space-sm:clamp(1rem,.91rem + .45vw,1.25rem);
    --space-md:clamp(1.4rem,1.22rem + .9vw,1.9rem);
    --space-lg:clamp(2rem,1.64rem + 1.8vw,3rem);
    --space-xl:clamp(3rem,2.3rem + 3.5vw,5rem);
    --space-2xl:clamp(4rem,2.9rem + 5.5vw,6.5rem);
    --wrap:77.5rem;
    --gutter:clamp(1rem,.6rem + 2vw,2.5rem);
    --measure:65ch;
    --r-sm:6px;
    --r-md:12px;
    --r-lg:20px;
    --r-xl:28px;
    --r-pill:100px;
    --ring:1px;
    --ring-k:100%;
    --r-slab:clamp(1.25rem,3vw,2.5rem);
    --petal-r:clamp(4.5rem,12vw,10.5rem);
    --petal:.375rem var(--petal-r) .375rem var(--petal-r);
    --ease-premium:cubic-bezier(0.16, 1, 0.3, 1);
    --ease-medium:cubic-bezier(.4,0,.2,1);
    --ease-long:cubic-bezier(.22,1,.36,1);
    --d-instant:80ms;
    --d-micro:150ms;
    --d-short:250ms;
    --d-medium:350ms;
    --d-long:600ms;
    --hdr-h:4.75rem;
    --bnav-h:4.25rem;
    --z-float:40;
    --z-dock:45;
    --z-hdr:50;
    --pat-hex:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='60' height='52'%3E%3Cpolygon points='30,2 58,17 58,35 30,50 2,35 2,17' fill='none' stroke='%23B48C5C' stroke-width='0.6' stroke-opacity='0.16'/%3E%3C/svg%3E");
    --pat-diamond:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80'%3E%3Cpath d='M0 40 L40 0 L80 40 L40 80 Z' fill='none' stroke='%23B48C5C' stroke-width='0.5' stroke-opacity='0.14'/%3E%3C/svg%3E");
  }
}

@layer reset{
  *,*::before,*::after{box-sizing:border-box}
  *{margin:0}
  html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
  body{min-height:100dvh}
  img,svg,picture{display:block;max-width:100%}
  input,button,textarea,select{font:inherit;color:inherit}
  button{background:none;border:0;cursor:pointer;padding:0}
  ul[class],ol[class]{list-style:none;padding:0}
  a{color:inherit}
  [hidden]{display:none!important}
}

@layer base{
  html{color-scheme:only light;font-size:calc(100% * var(--fs-scale));scroll-padding-top:calc(var(--hdr-h) + 1rem);font-optical-sizing:auto;background:var(--bg-page)}
  html[data-theme="dark"]{color-scheme:dark}
  @media (max-resolution:1.99dppx){:root{--ring:2px;--ring-k:74%}}
  @media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}
  body{background:var(--bg-page);color:var(--text-body);font-family:var(--font-body);font-size:var(--step-0);font-weight:380;line-height:1.7;font-feature-settings:"liga" 1,"kern" 1;-webkit-font-smoothing:antialiased;overflow-x:clip;padding-bottom:calc(var(--bnav-h) + env(safe-area-inset-bottom))}
  h1,h2,h3{font-family:var(--font-display);color:var(--text-strong);font-weight:400;line-height:1.1;letter-spacing:-.012em;text-wrap:balance}
  p,li,dd{text-wrap:pretty}
  a{color:var(--link);text-underline-offset:.2em;text-decoration-thickness:1px;transition:color var(--d-micro) ease}
  a:hover{color:var(--link-hover)}
  strong{font-weight:600;color:var(--text-strong)}
  :focus-visible{outline:2px solid var(--focus-ring-color);outline-offset:3px;border-radius:4px}
  .tnum{font-variant-numeric:tabular-nums lining-nums}
  .nw{white-space:nowrap}
}

@layer layout{
  /* Contêiner de layout: os pontos de quebra em em acompanham o A−/A+ (#39) */
  .page{container:pg/inline-size;font-size:1rem}
  .wrap{width:min(100% - 2 * var(--gutter),var(--wrap));margin-inline:auto}
  .sec{position:relative;isolation:isolate;overflow:clip;padding-block:var(--space-2xl);background:var(--bg-page);color:var(--text-body);font-size:var(--step-0)}
  .sec__head{display:grid;gap:var(--space-xs);margin-bottom:var(--space-lg);max-width:46rem}
  .sec__t{font-size:calc(var(--step-4) * var(--h-k))}
  .sec__em{font-style:italic;font-weight:500;color:var(--accent-strong)}
  .sec p{max-width:var(--measure)}
}

@layer components{
  .skip{position:absolute;left:var(--gutter);top:-100px;z-index:200;background:var(--itl-navy-900);color:var(--itl-fundo);padding:.75rem 1rem;border-radius:var(--r-sm);text-decoration:none}
  .skip:focus{top:.75rem;color:var(--itl-fundo)}
  /* Cartão "Light bleed" (glow-effects #2): duas luzes opostas, uma quente (embaixo à esquerda) e uma fria (no alto à direita) */
  .pillar__main,.pillar__side,.tile,.comp,.cel--nota,.hero__card,.fab__menu,.grade,.slab,.qa-a{--bleed:radial-gradient(ellipse 80% 60% at 0% 100%,var(--leak-w),transparent 55%),radial-gradient(ellipse 70% 50% at 100% 0%,var(--leak-c),transparent 60%)}
  .pillar__main,.pillar__side,.tile,.comp,.cel--nota,.hero__card,.fab__menu,.grade{background:var(--bleed),var(--card-bg)}

  .sec-label,.eyebrow{display:flex;align-items:center;gap:1rem;font-size:var(--label);font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--accent-strong)}
  .sec-label::before,.eyebrow::before{content:"";flex:none;width:2rem;height:1px;background:linear-gradient(90deg,var(--line-strong),transparent)}
  .sec-label::after{content:"";flex:1;min-width:2rem;max-width:14rem;height:1px;background:linear-gradient(90deg,var(--line-strong),transparent)}
  .sec-label--short::after,.sec-label--center::after{display:none}
  .sec-label--center{justify-content:center}

  /* botões (#42: o magnetismo só atua em [data-magnetic]) */
  .btn-p{--mx:0px;--my:0px;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:3rem;padding:0 1.5rem;border-radius:var(--r-pill);border:var(--ring) solid transparent;font-size:.9rem;font-weight:600;text-decoration:none;text-align:center;line-height:1.25;transform:translate(var(--mx),var(--my));transition:background-color var(--d-short) var(--ease-premium),color var(--d-short) var(--ease-premium),border-color var(--d-short) var(--ease-premium),box-shadow var(--d-short) var(--ease-premium),transform var(--d-short) var(--ease-premium)}
  .btn-p svg{width:1rem;height:1rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--d-short) var(--ease-premium)}
  .btn-p:hover svg{transform:translateX(3px)}
  .btn-p:active{transform:translate(var(--mx),calc(var(--my) + 1px));transition-duration:var(--d-instant)}
  .btn-p--sm{min-height:2.75rem;padding:0 1.15rem;font-size:.82rem;white-space:nowrap}
  .btn-p--primary{background:var(--action-primary-bg);color:var(--action-primary-text);box-shadow:0 12px 28px -14px color-mix(in oklab,var(--action-primary-bg) 75%,transparent)}
  .btn-p--primary:hover{background:var(--action-primary-bg-hover);color:var(--action-primary-text)}
  .btn-p--primary:active{background:var(--action-primary-bg-active)}
  .btn-p--line{border-color:color-mix(in oklab,var(--action-secondary-border) var(--ring-k),transparent);color:var(--action-secondary-text)}
  .btn-p--line:hover{background:var(--action-secondary-bg-hover);color:var(--action-secondary-text)}
  .btn-row{display:flex;flex-wrap:wrap;align-items:center;gap:.75rem}

  .link-arrow{display:inline-flex;align-items:center;gap:.5rem;min-height:2.75rem;font-weight:600;line-height:1.3;color:var(--link);text-decoration:none;transition:color var(--d-micro) ease}
  .link-arrow>span{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.22em;text-decoration-color:var(--line-strong);transition:text-decoration-color var(--d-micro) ease}
  .link-arrow .icon{width:1rem;height:1rem;flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--d-short) var(--ease-premium)}
  @media (hover:hover) and (pointer:fine){
    .link-arrow:hover{color:var(--link-hover)}
    .link-arrow:hover>span{text-decoration-color:currentColor}
    .link-arrow:hover .icon{transform:translateX(.25rem)}
  }

  /* ---------- Cabeçalho (claro, opaco) ---------- */
  .hdr{position:sticky;top:0;z-index:var(--z-hdr);background:var(--bg-page);border-bottom:1px solid var(--line-subtle);transition:transform var(--d-medium) var(--ease-medium),box-shadow var(--d-medium) var(--ease-medium)}
  .hdr.is-scrolled{box-shadow:var(--shadow-sm)}
  .hdr.is-hidden{transform:translateY(-100%)}
  .hdr:focus-within{transform:none}
  .hdr__in{display:flex;align-items:center;gap:var(--space-sm);height:var(--hdr-h)}
  .hdr__brand{flex:0 1 auto;min-width:0;display:flex;align-items:center;min-height:2.75rem}
  .hdr__brand img{width:auto;min-width:0;max-width:100%;height:3.25rem;object-fit:contain;object-position:left center}
  .logo--dark{display:none}
  html[data-theme="dark"] .logo--light{display:none}
  html[data-theme="dark"] .logo--dark{display:block}
  .hdr__tools{margin-left:auto;display:flex;align-items:center;gap:.6rem}
  .hdr__menu{display:inline-flex;align-items:center;gap:.6em;min-height:2.75rem;padding:0 1.1em;border-radius:var(--r-pill);border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);font-size:var(--label);font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--text-strong)}
  .hdr__menu:hover{border-color:color-mix(in oklab,var(--text-strong) 50%,transparent)}
  .hdr__menu-t{display:inline}
  .hdr__menu-i{position:relative;width:1rem;height:10px;border-block:1.5px solid currentColor}
  .hdr__menu-i::after{content:"";position:absolute;left:0;right:0;top:50%;height:1.5px;background:currentColor;transform:translateY(-50%)}
  .nav{display:none}
  .nav__list{display:flex;align-items:center;gap:0;list-style:none;padding:0}
  .nav__link{position:relative;display:inline-flex;align-items:center;min-height:2.75rem;padding:0 .5rem;font-size:.8125rem;font-weight:500;letter-spacing:.01em;color:var(--text-muted);text-decoration:none;white-space:nowrap;transition:color var(--d-micro) ease}
  .nav__link::after{content:"";position:absolute;left:.5rem;right:.5rem;bottom:.55rem;height:1px;background:var(--text-strong);transform:scaleX(0);transform-origin:left;transition:transform var(--d-short) var(--ease-premium)}
  .nav__link:hover{color:var(--text-strong)}
  .nav__link:hover::after{transform:scaleX(1)}
  .hdr__cta{display:none}
  .hdr__cta-l{display:none}

  /* ---------- H01 Hero (2 colunas · fundo da referência) ---------- */
  .hero{position:relative;isolation:isolate;overflow:clip;padding-block:clamp(3.5rem,2rem + 6vw,6.5rem) clamp(5.5rem,4rem + 5vw,7.5rem);background:linear-gradient(160deg,var(--itl-navy-950) 0%,var(--itl-navy-900) 60%,var(--itl-navy-950) 100%);color:var(--text-body);font-size:var(--step-0)}
  .hero__orb{position:absolute;z-index:-1;border-radius:50%;pointer-events:none}
  .hero__orb--a{top:-7.5rem;right:-4rem;width:29rem;height:29rem;background:radial-gradient(circle,color-mix(in oklab,var(--itl-ouro-300) 17%,transparent) 0%,transparent 65%)}
  .hero__orb--b{bottom:-5rem;left:14%;width:19rem;height:19rem;background:radial-gradient(circle,color-mix(in oklab,var(--itl-navy-950) 85%,transparent) 0%,transparent 65%)}
  .hero__orbital{position:absolute;z-index:-1;inset:0;display:grid;place-items:center;pointer-events:none;opacity:.22}
  .hero__orbital svg{width:min(150vw,68rem);height:auto}
  .hero__orbital g,.hero__orbital circle,.hero__orbital line{stroke:color-mix(in oklab,var(--itl-fundo) 70%,transparent)}
  .neural-pulse{fill:color-mix(in oklab,var(--itl-fundo) 70%,transparent);stroke:none}
  .neural-accent{fill:var(--itl-ouro-300)}
  .hero__mark{position:absolute;left:-.04em;bottom:-.2em;z-index:-1;pointer-events:none;user-select:none;font-family:var(--font-display);font-style:italic;font-size:clamp(9rem,6rem + 22vw,26rem);line-height:1;letter-spacing:-.04em;color:color-mix(in oklab,var(--accent) 5%,transparent)}
  .hero__grid{display:grid;gap:var(--space-lg);align-items:center}
  .hero__copy{display:grid;gap:1.3rem;max-width:42rem}
  .hero__eyebrow{display:inline-flex;justify-self:start;max-width:100%;align-items:center;gap:.65rem;padding:.5rem 1rem .5rem .85rem;border-radius:1.4rem;background:color-mix(in oklab,var(--itl-navy-950) 70%,transparent);border:var(--ring) solid rgb(255 255 255 / .12);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);font-size:.68rem;font-weight:700;letter-spacing:.07em;line-height:1.4;text-transform:uppercase;color:rgb(255 255 255 / .74)}
  .hero__dot{flex:none;width:6px;height:6px;border-radius:50%;background:var(--itl-ouro-300)}
  .hero__h1{font-size:calc(var(--step-5) * var(--h-k));line-height:1.08;letter-spacing:-.02em;text-wrap:wrap}
  .split{display:inline}
  .split__w{display:inline-block}
  .gradtext{font-style:italic;padding-right:.06em;background:linear-gradient(100deg,var(--itl-navy-300),var(--itl-ouro-300),var(--itl-logo-light),var(--itl-navy-300));background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:var(--accent-strong)}
  .hero__lead{font-size:var(--step-1);font-weight:350;line-height:1.55;color:var(--text-body);max-width:40ch}
  .hero__cta{display:grid;gap:.8rem;margin-top:.3rem}
  .hero__cta .btn-p--primary{width:100%}
  .hero__cta .btn-p--line{justify-self:start}
  .hero__card{--card-bg:rgb(12 14 18 / .8);position:relative;isolation:isolate;overflow:clip;display:grid;gap:1rem;width:100%;max-width:27rem;padding:clamp(1.25rem,1rem + 1.2vw,1.9rem);border-radius:var(--r-lg);border:1px solid var(--card-bd);box-shadow:0 22px 60px -30px rgb(0 0 0 / .8)}
  .hero__tag{justify-self:start;padding:.34rem .8rem;border-radius:var(--r-pill);background:rgb(255 255 255 / .08);color:var(--accent-strong);font-size:.66rem;font-weight:700;letter-spacing:.14em;text-transform:uppercase}
  .hero__name{font-family:var(--font-display);font-size:var(--step-3);line-height:1.15;color:var(--text-strong)}
  .hero__pills{display:grid;gap:.5rem;padding:0;list-style:none}
  .hero__pills li{display:flex;align-items:flex-start;gap:.55rem;padding:.55rem 1rem;border-radius:1.2rem;border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);font-size:.8rem;line-height:1.4;color:var(--text-body)}
  .hero__pi{flex:none;margin-top:.12em;font-size:.62rem;color:var(--accent-strong)}
  .hero__scroll{position:absolute;left:50%;bottom:.75rem;translate:-50% 0;display:grid;justify-items:center;width:2.75rem;height:3.5rem;text-decoration:none}
  .hero__scroll i{display:block;width:var(--ring);height:100%;background:linear-gradient(180deg,transparent,var(--text-strong));transform-origin:top}
  @container pg (min-width:48em){
    .hero__grid{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:var(--space-xl)}
    .hero__cta{display:flex;flex-wrap:wrap}
    .hero__cta .btn-p--primary{width:auto}
    .hero__card{justify-self:end}
    .hero__orbital{place-items:center end;padding-right:2rem}
  }

  /* ---------- Barra de autoridade (técnica 2) ---------- */
  .authbar{position:relative;z-index:1;overflow:clip;padding-block:1rem;background:var(--bg-page);border-block:1px solid var(--line-subtle)}
  .marquee{display:flex;width:max-content}
  .marquee__t{display:flex;align-items:center;gap:2rem;padding:0 2rem 0 0;margin:0;list-style:none;white-space:nowrap}
  .marquee__t li{display:inline-flex;align-items:center;gap:.7rem;font-size:.875rem;color:var(--text-body)}
  .marquee__t li::before{content:"";flex:none;width:5px;height:5px;border-radius:50%;background:var(--accent)}

  /* ---------- H03 A clínica + galeria (versão mobile aprovada) ---------- */
  .clinic__grid{display:grid;gap:var(--space-lg);align-items:center}
  .clinic__copy{display:grid;gap:var(--space-xs);align-content:start;max-width:36rem}
  .clinic__copy .sec__head{margin-bottom:0}
  .clinic__where{color:var(--text-muted)}
  .clinic__copy .btn-row{margin-top:var(--space-2xs)}
  .gal{min-width:0}
  .gal__mosaic{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr));aspect-ratio:4/3;gap:.32rem;padding:0;list-style:none;overflow:hidden;border-radius:var(--r-md);border:1px solid var(--line-subtle);box-shadow:var(--shadow-md)}
  .gal__mosaic li{min-width:0;min-height:0}
  .gal__ph{position:relative;display:block;width:100%;height:100%;overflow:hidden;background:var(--bg-tint);transition:opacity var(--d-short) var(--ease-premium)}
  .gal__ph img{width:100%;height:100%;object-fit:cover;transition:transform var(--d-long) var(--ease-premium)}
  .gal__ph:focus-visible{outline:3px solid #fff;outline-offset:-4px;box-shadow:inset 0 0 0 5px rgb(15 17 21 / .55);z-index:1;border-radius:0}
  .gal__more{position:absolute;right:.5rem;bottom:.5rem;display:flex;align-items:center;gap:.35rem;padding:.5rem .65rem;border-radius:7px;background:rgb(15 17 21 / .88);color:#f2f4f7;font-size:.75rem;font-weight:500;line-height:1.25}
  .gal__more svg{width:1rem;height:1rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
  @container pg (min-width:48em){.clinic__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:var(--space-xl)}}

  /* ---------- H04 Áreas (Especialidade) ---------- */
  .areas{background:var(--bg-page)}
  .areas__bg{position:absolute;inset:0;z-index:-1;pointer-events:none;background:var(--pat-hex),radial-gradient(ellipse 60% 55% at 100% 0%,color-mix(in oklab,var(--accent) 16%,transparent),transparent 70%);-webkit-mask:linear-gradient(180deg,#000 0%,#000 55%,transparent 100%);mask:linear-gradient(180deg,#000 0%,#000 55%,transparent 100%)}
  .pillar{display:grid;border-radius:18px;overflow:hidden;border:1px solid var(--card-bd);box-shadow:var(--shadow-lg);background:var(--card-bg);transition:translate var(--d-medium) var(--ease-premium)}
  .pillar+.pillar{margin-top:1.6rem}
  .pillar__main{display:grid;align-content:start;gap:1.1rem;padding:clamp(1.6rem,1rem + 2.6vw,2.75rem);color:var(--text-body)}
  .pillar__tag{justify-self:start;padding:.45rem 1rem;border-radius:var(--r-pill);border:var(--ring) solid var(--line-strong);font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}
  .pillar__h{font-size:calc(var(--step-3) * var(--h-k));max-width:18ch}
  .pillar__p{color:var(--text-muted)}
  .chips{display:flex;flex-wrap:wrap;gap:.5rem;padding:0;list-style:none}
  .chips li{display:inline-flex;align-items:center;gap:.5rem;padding:.4rem .95rem;border-radius:var(--r-pill);border:var(--ring) solid var(--line-subtle);background:var(--chip-bg);font-size:.8rem;color:var(--text-muted)}
  .chips li::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--accent)}
  .pillar__main .btn-p{justify-self:start;margin-top:.3rem}
  .pillar__side{position:relative;display:flex;flex-direction:column;gap:1.1rem;padding:clamp(1.6rem,1rem + 2.6vw,2.75rem);color:var(--text-body)}
  .pillar__num{position:absolute;top:.6rem;right:1.3rem;font-family:var(--font-display);font-style:italic;font-size:clamp(2.25rem,1.9rem + 1.4vw,3.25rem);line-height:1;color:color-mix(in oklab,var(--accent) 32%,transparent)}
  .pillar__k{font-size:.72rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--accent-strong);padding-right:4rem}
  .pillar__list{display:grid;gap:.1rem 1.75rem;padding:0;list-style:none}
  .pillar__list a{display:flex;align-items:center;gap:.8rem;min-height:2.75rem;font-size:.9rem;color:var(--text-body);text-decoration:none;transition:color var(--d-micro) ease}
  .pillar__list a::before{content:"";flex:none;width:6px;height:6px;border-radius:50%;background:var(--accent)}
  .pillar__list a:hover{color:var(--link);text-decoration:underline}
  .pillar__note{margin-top:auto;padding-top:1rem;border-top:1px solid var(--line-subtle);font-size:.84rem;font-style:italic;color:var(--text-muted)}
  .pillar__side,.pillar__main{container-type:inline-size}
  @container (max-width:24rem){.pillar__main .btn-p{padding:0 1.1rem;font-size:.88rem}}
  @container (min-width:26rem){.pillar__list{grid-template-columns:repeat(2,minmax(0,1fr))}}
  @container pg (min-width:48em){
    .pillar{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
    .pillar--rev .pillar__main{order:2}
  }

  /* ---------- H05 Médico responsável (painel da v3.0) ---------- */
  .sec--slab{padding-block:0}
  .slab{--bleed:radial-gradient(ellipse 42% 40% at 0% 100%,var(--leak-w),transparent 60%),radial-gradient(ellipse 38% 36% at 100% 0%,var(--leak-c),transparent 62%);position:relative;isolation:isolate;overflow:clip;background-image:var(--bleed),var(--gradient-deep);padding:clamp(3.75rem,2.3rem + 7vw,8.5rem) max(var(--gutter),1.5rem);color:var(--text-body)}
  /* Fundo da seção do médico: anéis concêntricos finos (repeating-radial-gradient), cor de token navy, quase imperceptíveis.
     Bordas dos anéis suavizadas (sem serrilhado) e máscara que dissolve o padrão para os cantos. */
  .slab::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:repeating-radial-gradient(circle at 50% 50%,transparent 0 7.5px,color-mix(in oklab,var(--itl-navy-300) 9%,transparent) 8.25px,transparent 9px);-webkit-mask:radial-gradient(ellipse 85% 80% at 50% 45%,#000 15%,transparent 90%);mask:radial-gradient(ellipse 85% 80% at 50% 45%,#000 15%,transparent 90%)}
  @container pg (min-width:48em){
    .sec--slab{padding-block:var(--space-lg)}
    .slab{width:min(100% - 2 * clamp(1rem,2.5vw,2.5rem),86rem);margin-inline:auto;padding-inline:clamp(3rem,6.5vw,6.5rem);border:1px solid var(--line-subtle);border-radius:var(--r-slab)}
  }
  .doctor__head{max-width:46rem;margin-bottom:clamp(2.5rem,5.5vw,5rem)}
  .doctor__title{margin-top:.875rem;font-size:calc(var(--step-4) * var(--h-k))}
  .doctor__grid{display:grid;gap:clamp(2.5rem,6vw,6rem);align-items:start}
  .doctor__figure{position:relative;isolation:isolate;container-type:inline-size;width:100%;max-width:31.25rem}
  .doctor__frame{position:relative;aspect-ratio:500/468;overflow:clip;border:1px solid var(--line-subtle);border-radius:var(--petal);background:#fff}
  .doctor__img{position:absolute;left:0;bottom:0;width:100%;height:auto}
  .doctor__body{min-width:0}
  .doctor__name{font-size:calc(var(--step-3) * var(--h-k));line-height:1.15;color:var(--text-strong)}
  .doctor__cred{font-size:var(--step--1);font-weight:600;letter-spacing:.03em;line-height:1.5;color:var(--accent);font-variant-numeric:tabular-nums lining-nums}
  .doctor__lede{margin-top:clamp(1.5rem,3vw,2.5rem);font-family:var(--font-display);font-size:var(--step-1);line-height:1.28;letter-spacing:-.008em;color:var(--text-strong)}
  .doctor__bio{margin-top:1.6rem;max-width:var(--measure)}
  .doctor__links{margin-top:1.5rem;display:flex;flex-wrap:wrap;gap:.35rem 2rem}
  @container pg (min-width:48em){
    .doctor__grid{grid-template-columns:minmax(0,2fr) minmax(0,3fr)}
    .doctor__figure{position:sticky;top:calc(var(--hdr-h) + 1.5rem)}
  }
  @container pg (min-width:64em){.doctor__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr)}}

  /* acordeões (médico e rodapé) */
  .acc-group{margin-top:clamp(2.5rem,5vw,4rem);border-bottom:1px solid var(--line-subtle)}
  .acc{border-top:1px solid var(--line-subtle)}
  .acc__summary{display:flex;align-items:center;gap:.8rem;min-height:3.25rem;padding-block:.75rem;cursor:pointer;list-style:none}
  .acc__summary::-webkit-details-marker{display:none}
  .acc__title{font-family:var(--font-body);font-size:calc(.9375rem * var(--h-k));font-weight:600;line-height:1.3;letter-spacing:0;color:var(--text-strong)}
  .acc__icon{flex:none;display:grid;place-items:center;width:1.5rem;height:1.5rem;color:var(--text-muted);transition:transform var(--d-medium) var(--ease-premium),color var(--d-micro) ease}
  .acc__icon svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
  .acc[open]>.acc__summary .acc__icon{transform:rotate(180deg);color:var(--text-strong)}
  .acc__body{max-width:var(--measure);padding:0 0 1.5rem 2.3rem}
  .acc__body>*+*{margin-top:.75rem}
  .acc__list{display:grid;gap:.5rem;padding-left:1.1rem;list-style:disc}
  .acc__list li::marker{color:var(--accent)}
  @media (hover:hover) and (pointer:fine){.acc__summary:hover .acc__icon{color:var(--text-strong)}}
  @supports (interpolate-size:allow-keywords){
    :root{interpolate-size:allow-keywords}
    .acc::details-content{block-size:0;overflow:clip;transition:block-size var(--d-medium) var(--ease-premium),content-visibility var(--d-medium) allow-discrete}
    .acc[open]::details-content{block-size:auto}
  }

  /* ---------- H06 Índice clínico ---------- */
  .grade{display:grid;grid-template-columns:1fr;gap:0;padding:0;list-style:none;border:1px solid var(--card-bd);border-radius:var(--r-md);overflow:hidden;box-shadow:var(--shadow-sm)}
  .cel{position:relative;display:flex;flex-direction:column;gap:.45rem;margin:-1px 0 0 -1px;padding:1.1rem 1.2rem;border-top:1px solid var(--grid-line);border-left:1px solid var(--grid-line);transition:background-color var(--d-short) var(--ease-premium)}
  .cel:not(.cel--nota):hover,.cel:not(.cel--nota):has(a:focus-visible){background:color-mix(in oklab,var(--accent) 9%,transparent)}
  .cel__g{font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent-strong)}
  .cel__n{font-size:calc(var(--step-2) * var(--h-k));line-height:1.15}
  .cel__n a{color:var(--text-strong);text-decoration:none}
  .cel__n a::after{content:"";position:absolute;inset:0}
  .cel__n a:focus-visible{outline:none}
  .cel:has(a:focus-visible){outline:2px solid var(--focus-ring-color);outline-offset:-3px}
  .cel__seta{display:none;margin-top:auto;padding-top:.8rem;color:var(--accent-strong);transition:transform var(--d-short) var(--ease-premium)}
  .cel__seta svg{width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
  .cel:hover .cel__seta{transform:translateX(5px)}
  .cel--nota{justify-content:center;color:var(--text-body)}
  .cel--nota p{font-family:var(--font-display);font-style:italic;font-size:var(--step-1);line-height:1.35;color:var(--text-strong);max-width:32ch}
  @container pg (min-width:48em){
    .grade{grid-template-columns:repeat(2,minmax(0,1fr))}
    .cel{min-height:10.5rem;padding:1.35rem 1.4rem}
    .cel__seta{display:block}
    .cel--nota{grid-column:span 2}
  }
  /* com os títulos 25% maiores: 2 colunas até 64 em, 3 até 80 em, 4 acima disso (a nota sempre completa a última linha) */
  @container pg (min-width:64em){.grade{grid-template-columns:repeat(3,minmax(0,1fr))}}
  @container pg (min-width:80em){.grade{grid-template-columns:repeat(4,minmax(0,1fr))}}
  .cel__n{overflow-wrap:break-word;hyphens:auto}
  .hosp__grid{display:grid;gap:var(--space-lg);align-items:center}
  .hosp__body{display:grid;gap:var(--space-xs);align-content:center}
  .hosp__p{max-width:var(--measure);color:var(--text-body)}
  .hosp__fig{position:relative;margin:0;container-type:inline-size}
  .hosp__ph{position:relative;overflow:hidden;aspect-ratio:3/2;border-radius:var(--r-lg);border:1px solid var(--card-bd);box-shadow:var(--shadow-md);background:var(--bg-tint)}
  .hosp__ph img{width:100%;height:100%;object-fit:cover}
  @container pg (min-width:48em){.hosp__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-xl)}}

  /* ---------- H07 Como funciona o atendimento (Porcelana) ---------- */
  .how__grid{display:grid;gap:var(--space-lg)}
  .how__head{display:grid;gap:var(--space-xs);align-content:start}
  .how__tiles{display:grid;gap:.9rem}
  .tile{position:relative;display:grid;gap:.8rem;align-content:start;padding:clamp(1.4rem,1.1rem + 1.6vw,2.5rem);border:1px solid var(--card-bd);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
  .tile__t{font-size:calc(var(--step-3) * var(--h-k))}
  .tile .btn-row{margin-top:var(--space-2xs)}
  .how__link{justify-self:start}
  @container pg (min-width:48em){
    .how__grid{grid-template-columns:minmax(0,5fr) minmax(0,7fr);align-items:start;gap:var(--space-xl)}
    .how__head{position:sticky;top:calc(var(--hdr-h) + 1.5rem)}
  }

  /* ---------- H08 Assessoria ---------- */
  .aid__grid{display:grid;gap:var(--space-lg);align-items:center}
  .aid__fig{position:relative;margin:0;container-type:inline-size}
  .aid__ph{position:relative;overflow:hidden;aspect-ratio:3/2;border-radius:var(--r-lg);border:1px solid var(--card-bd);box-shadow:var(--shadow-md);background:var(--bg-tint)}
  .aid__ph img{width:100%;height:100%;object-fit:cover}
  .aid__body{display:grid;gap:var(--space-xs);align-content:center}
  .aid__body .sec__head{margin-bottom:var(--space-2xs)}
  .aid__body .btn-row{margin-top:var(--space-2xs)}
  @container pg (min-width:48em){.aid__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:var(--space-xl)}}

  /* ---------- H09 Cirurgia e plano de saúde ---------- */
  .plan__grid{display:grid;gap:var(--space-md)}
  .plan__a{margin-bottom:0}
  .plan__a p{color:var(--text-body)}
  .plan__c{display:grid;gap:var(--space-xs);align-content:start}
  .plan__c .btn-row{margin-top:var(--space-2xs)}
  .vid{position:relative;container-type:inline-size;justify-self:center;width:min(100%,19rem);aspect-ratio:9/16;overflow:hidden;border-radius:var(--r-xl);border:1px solid var(--card-bd);background:var(--ink);box-shadow:var(--shadow-lg)}
  .vid video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;background:#000}
  .vid__play{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:1rem;padding:1.5rem;color:#f2f4f7;text-align:center;background:linear-gradient(180deg,rgb(8 10 13 / .1) 30%,rgb(8 10 13 / .78))}
  .vid__btn{display:grid;place-items:center;width:4.5rem;height:4.5rem;border-radius:50%;background:#fff;color:var(--ink);box-shadow:0 0 0 .5rem rgb(255 255 255 / .22);transition:transform var(--d-medium) var(--ease-long)}
  .vid__btn svg{width:1.6rem;height:1.6rem;fill:currentColor;margin-left:.15rem}
  .vid__play:hover .vid__btn{transform:scale(1.06)}
  .vid__l{font-size:.9rem;font-weight:600;line-height:1.35;max-width:18ch}
  .vid.is-playing .vid__play,.vid.is-playing .nota{display:none}

  /* Nota sobre a foto (padrão "cards sobre imagem", foto-molduras-showcase §13 · 02 nota): vidro escuro de token navy, texto claro.
     Escala pela largura da própria foto (cqi) com piso/teto em rem; não captura o ponteiro, então o hover da foto continua. */
  .nota{position:absolute;z-index:3;display:flex;align-items:center;gap:clamp(.5rem,2.6cqi,.8rem);max-width:min(78cqi,20rem);padding:clamp(.55rem,3cqi,.9rem) clamp(.8rem,4cqi,1.2rem);border:var(--ring) solid color-mix(in oklab,var(--itl-white) 22%,transparent);border-radius:clamp(.75rem,4cqi,1.1rem);background:color-mix(in oklab,var(--itl-navy-900) 84%,transparent);-webkit-backdrop-filter:blur(12px) saturate(1.2);backdrop-filter:blur(12px) saturate(1.2);box-shadow:0 .75rem 1.75rem -.75rem color-mix(in oklab,var(--itl-navy-900) 75%,transparent);color:var(--itl-fundo);pointer-events:none}
  .nota--bl{left:clamp(.75rem,5cqi,1.5rem);bottom:clamp(.75rem,5cqi,1.5rem)}
  .nota--br{right:clamp(.75rem,5cqi,1.5rem);bottom:clamp(.75rem,5cqi,1.5rem)}
  .nota--tl{left:clamp(.75rem,5cqi,1.5rem);top:clamp(.75rem,5cqi,1.5rem)}
  .nota__col{display:grid;gap:.2rem;min-width:0}
  .nota__t{font-size:clamp(.8rem,3.4cqi,.98rem);font-weight:650;line-height:1.15;color:var(--itl-white)}
  .nota__k{font-size:clamp(.64rem,2.5cqi,.72rem);font-weight:600;letter-spacing:.1em;line-height:1.3;text-wrap:balance;text-transform:uppercase;color:var(--itl-ouro-200)}
  .nota__ico{flex:none;display:grid;place-items:center;width:clamp(1.5rem,7cqi,2rem);aspect-ratio:1;border-radius:50%;background:color-mix(in oklab,var(--itl-white) 12%,transparent)}
  .nota__ico svg{width:62%;height:62%;fill:none;stroke:var(--itl-white);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
  @container pg (min-width:48em){
    .plan__grid{grid-template-columns:minmax(0,1.3fr) minmax(0,.7fr);grid-template-areas:"a b" "c b";column-gap:var(--space-xl);row-gap:var(--space-md);align-items:start}
    .plan__a{grid-area:a}
    .vid{grid-area:b}
    .plan__c{grid-area:c}
  }
  .plan__grid:has(.vid[hidden]){grid-template-columns:minmax(0,1fr);grid-template-areas:"a" "c"}
  .plan__grid:has(.vid[hidden])>*{max-width:48rem}

  /* ---------- H10 Localização e contato ---------- */
  .loc{background:var(--bg-page);padding-block:clamp(4.5rem,3.2rem + 6.5vw,9rem)}
  .loc .wrap{width:min(100% - 2 * max(var(--gutter),1.5rem),var(--wrap))}
  .loc .sec__head{margin-bottom:var(--space-xl)}
  .loc__grid{display:grid;gap:clamp(1.25rem,2.4vw,2rem)}
  .comp{display:grid;align-content:start;gap:var(--space-sm);padding:clamp(1.75rem,1.2rem + 2.6vw,3.25rem);border:1px solid var(--card-bd);border-radius:var(--r-lg);box-shadow:var(--shadow-md)}
  .comp--glass{container-type:inline-size}
  .comp__label{font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted)}
  .loc__addr{font-style:normal;font-size:.9375rem;line-height:1.75;color:var(--text-body)}
  .loc__addr strong{font-family:var(--font-display);font-weight:500;font-size:1.05rem;line-height:1.2}
  .loc__hours{margin-top:var(--space-xs)}
  .comp .btn-row{margin-top:var(--space-sm)}
  .loc__rev{margin-top:-.25rem}
  .ch{display:grid;padding:0;list-style:none}
  .ch__i{display:grid;gap:.1rem;padding:1.05rem 0;border-bottom:1px solid var(--line-subtle)}
  .ch__i:first-child{padding-top:0}
  .ch__i:last-child{border-bottom:0}
  .ch__k{font-size:.7rem;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-strong)}
  .ch__row{display:flex;flex-wrap:wrap;align-items:center;gap:.1rem .9rem}
  .ch__v{display:inline-flex;align-items:center;min-height:2.75rem;font-family:var(--font-display);font-size:clamp(.95rem,.5rem + 3cqi,1.2rem);color:var(--text-strong);text-decoration:none;font-variant-numeric:lining-nums tabular-nums;overflow-wrap:anywhere}
  .ch__v:hover{color:var(--link);text-decoration:underline}
  /* botão sutil "copiar número", ao lado do número (canais e rodapé); área de toque de 44 px por pseudo-elemento */
  .copy{position:relative;display:inline-flex;align-items:center;justify-content:center;min-width:6.2rem;min-height:1.6rem;padding:0 .75rem;border-radius:var(--r-pill);border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);font-size:.72rem;font-weight:500;letter-spacing:.015em;line-height:1;white-space:nowrap;color:var(--text-muted);transition:border-color var(--d-micro) ease,color var(--d-micro) ease,background-color var(--d-micro) ease}
  .copy::after{content:"";position:absolute;inset:-.6rem -.3rem}
  .copy:hover{color:var(--text-strong);border-color:color-mix(in oklab,var(--text-muted) 70%,transparent)}
  .copy.is-done{border-color:var(--state-success-border);background:var(--state-success-bg);color:var(--state-success-fg)}
  @container pg (min-width:48em){.loc__grid{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr)}}

  /* ---------- H11 Agende sua consulta ---------- */
  .final{text-align:center;background:radial-gradient(ellipse 45% 70% at 50% 110%,color-mix(in oklab,var(--accent) 12%,transparent),transparent 70%),var(--bg-page)}
  .final__in{display:grid;justify-items:center;gap:var(--space-sm)}
  .final__t{font-size:calc(var(--step-4) * var(--h-k))}
  .final__p{font-size:var(--step-1);color:var(--text-body);max-width:40ch}
  .final__cta{display:grid;width:100%;gap:.8rem;margin-top:var(--space-2xs)}
  .final__cta .btn-p--primary{width:100%}
  .final__micro{font-size:.74rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}
  @container pg (min-width:48em){
    .final__cta{display:flex;flex-wrap:wrap;justify-content:center;width:auto}
    .final__cta .btn-p--primary{width:auto}
  }

  /* ---------- Informações relacionadas ---------- */
  .closing{padding-block:var(--space-xl) var(--space-lg)}
  .notice__t{font-family:var(--font-body);font-size:calc(.72rem * var(--h-k));font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--text-strong)}
  .related{display:grid;gap:.9rem}
  .related ul{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:.6rem}
  .tag-link{display:inline-flex;align-items:center;min-height:2.75rem;padding:0 1.1rem;border-radius:var(--r-pill);border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);font-size:.74rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--text-body);text-decoration:none;transition:border-color var(--d-short) var(--ease-premium),color var(--d-short) var(--ease-premium)}
  .tag-link:hover{border-color:color-mix(in oklab,var(--text-strong) 55%,transparent);color:var(--text-strong)}

  /* ---------- Rodapé (padrão INCB: 3 colunas · linhas recolhíveis · régua · bloco legal · barra final) ---------- */
  .ftr{position:relative;isolation:isolate;margin-top:-1px;padding-block:var(--space-xl) var(--space-md);background:var(--bg-page);color:var(--text-body);font-size:var(--step-0)}
  .ftr__top{display:grid;gap:var(--space-lg);padding-bottom:var(--space-lg)}
  .ftr__id{display:grid;gap:1rem;align-content:start;font-size:var(--step--1)}
  .ftr__logo{width:min(100%,14.5rem);height:auto}
  .ftr__addr{font-style:normal;line-height:1.65;color:var(--text-body)}
  .ftr__tels{display:grid;padding:0;list-style:none}
  .ftr__tel{display:flex;flex-wrap:wrap;align-items:center;gap:.1rem .65rem;min-height:2.75rem}
  .ftr__tel-k{color:var(--text-muted)}
  .ftr__tel a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--text-strong);font-weight:500;text-decoration:none;font-variant-numeric:lining-nums tabular-nums}
  .ftr__tel a:hover{color:var(--link);text-decoration:underline}
  .ftr__social{display:grid;gap:.1rem}
  .ftr__lbl{color:var(--text-muted)}
  .ftr__links{display:flex;flex-wrap:wrap;gap:0 1.1rem}
  .ftr__nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-md)}
  .ftr__col{display:grid;gap:var(--space-md);align-content:start}
  .ftr__h{font-size:.7rem;font-weight:600;letter-spacing:.22em;text-transform:uppercase;line-height:1.4;color:var(--accent-strong);margin-bottom:.35rem}
  .ftr__grp ul,.ftr__links{list-style:none;padding:0}
  .ftr a:where(.ftr__grp a,.ftr__links a){display:inline-flex;align-items:center;min-height:2.75rem;min-width:2.75rem;font-size:var(--step--1);color:var(--text-body);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em;text-decoration-color:var(--line-strong);overflow-wrap:anywhere;transition:color var(--d-micro) ease,text-decoration-color var(--d-micro) ease}
  .ftr a:where(.ftr__grp a,.ftr__links a):hover{color:var(--link);text-decoration-color:currentColor}
  .ftr__acc{display:grid;gap:.75rem;margin-top:0;border-bottom:0}
  .ftr__acc .acc{border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);border-radius:var(--r-md);padding-inline:clamp(.9rem,.6rem + 1vw,1.4rem)}
  .ftr__acc .acc__body{padding-bottom:1.25rem}
  .refs{display:grid;grid-template-columns:minmax(0,1fr);gap:.9rem;padding-left:1.4rem;font-size:.88rem;line-height:1.6;color:var(--text-muted);max-width:80ch}
  .refs li::marker{color:var(--accent-strong);font-weight:600}
  .refs li{overflow-wrap:anywhere}
  .refs a{color:var(--link)}
  .refs cite{font-style:italic;color:var(--text-body)}
  .ftr__legal{display:grid;gap:.6rem;margin-top:var(--space-lg);padding-block:var(--space-md);border-top:1px solid var(--line-subtle);font-size:.8rem;line-height:1.65;color:var(--text-muted)}
  .ftr__legal p{max-width:90ch}
  .ftr__bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.5rem 1.5rem;padding-top:var(--space-sm);border-top:1px solid var(--line-subtle);font-size:.8rem;color:var(--text-muted)}
  .ftr__copy{margin:0}
  @container pg (min-width:48em){
    .ftr__top{grid-template-columns:minmax(0,1.3fr) minmax(0,2fr);gap:var(--space-xl)}
    .ftr__nav{gap:var(--space-lg)}
  }

  /* ---------- H12 FAQ · técnica 7 (mestre-detalhe) ---------- */
  .qa{display:grid;border-bottom:1px solid var(--line-subtle)}
  .qa-item{display:grid}
  .qa-q{width:100%;display:grid;grid-template-columns:auto auto minmax(0,1fr);gap:.8rem;align-items:center;min-height:3.5rem;padding:.75rem .25rem .75rem 0;border-top:1px solid var(--line-subtle);text-align:left;font-size:.9375rem;font-weight:500;line-height:1.4;color:var(--text-body);cursor:pointer;transition:color var(--d-micro) ease}
  .qa-q:hover{color:var(--text-strong)}
  .qa-q[aria-expanded="true"]{color:var(--text-strong);font-weight:600}
  .qa-q:focus-visible{outline:2px solid var(--focus-ring-color);outline-offset:-2px}
  .qa-n{font-family:var(--font-display);font-style:italic;font-size:.9rem;color:var(--accent-strong);font-variant-numeric:lining-nums}
  .qa-chev{display:grid;place-items:center;width:1.5rem;height:1.5rem;color:var(--text-muted);transition:transform var(--d-medium) var(--ease-premium),color var(--d-micro) ease}
  .qa-chev svg{width:1.15rem;height:1.15rem;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
  .qa-q:hover .qa-chev{color:var(--text-strong)}
  .qa-q[aria-expanded="true"] .qa-chev{transform:rotate(180deg);color:var(--text-strong)}
  .qa-a{max-width:var(--measure);padding:0 0 1.5rem 2.3rem}
  /* nasce fechado pelo próprio CSS (não depende do JS): só abre quem tem aria-expanded=true; sem JS (sem .js) todas as respostas ficam visíveis */
  .js .qa-a{display:none}
  .js .qa-q[aria-expanded="true"]+.qa-a{display:block}
  .qa-a>*+*{margin-top:.75rem}
  .qa-a p{font-size:.9375rem}
  .qa-cat{font-size:.68rem!important;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--accent-strong)}
  .qa-sub{font-weight:600;color:var(--text-strong)}
  .qa-a .qa-rev{margin-top:1.1rem;padding-top:.9rem;border-top:1px solid var(--line-subtle);font-size:.8125rem;line-height:1.55;color:var(--text-muted)}
  .qa-list{display:grid;gap:.4rem;padding-left:1.1rem;list-style:disc;font-size:.9375rem}
  .qa-list li::marker{color:var(--accent-strong)}
  .link-arrow--inline{display:inline;min-height:0}
  @container pg (min-width:56em){
    .js .qa{grid-template-columns:minmax(0,.95fr) minmax(0,1fr);grid-template-rows:repeat(var(--n),auto) 1fr;column-gap:var(--space-xl);align-items:start;border-bottom:0}
    .js .qa-item{display:contents}
    .js .qa:not([data-ready]) .qa-item:first-child .qa-a{display:block}
    .js .qa-q{grid-column:1}
    .js .qa-a{grid-column:2;grid-row:1/-1;position:sticky;top:calc(var(--hdr-h) + 1.5rem);align-self:start;max-width:none;padding:1.5rem 1.75rem;background:var(--bleed),var(--card-bg);border:1px solid var(--card-bd);border-radius:var(--r-lg);box-shadow:var(--shadow-sm)}
  }

  /* ---------- A−/A+ (#39) e botão de tema ---------- */
  .tx-pill{display:inline-flex;align-items:stretch;height:2.75rem;border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);border-radius:var(--r-pill);background:var(--bg-elevated);overflow:hidden}
  .tx-pill__b{display:grid;place-items:center;min-width:2.65rem;color:var(--text-strong);font-family:var(--font-body);font-weight:700;line-height:1;transition:background-color var(--d-micro) ease}
  .tx-pill__b+.tx-pill__b{border-left:1px solid var(--line-strong)}
  .tx-pill__b--menos{font-size:.8125rem}
  .tx-pill__b--mais{font-size:.9375rem}
  .tx-pill__b:hover{background:var(--bg-hover)}
  .tx-pill__b:focus-visible{outline:2px solid var(--focus-ring-color);outline-offset:-4px}
  .tx-pill__b[disabled]{opacity:.5;cursor:default}
  .tx-pill__b[disabled]:hover{background:none}
  .tx-theme{position:relative;display:grid;place-items:center;flex:none;width:2.75rem;height:2.75rem;border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);border-radius:var(--r-pill);color:var(--text-strong);background:var(--bg-elevated);transition:background-color var(--d-micro) ease,border-color var(--d-micro) ease}
  .tx-theme:hover{background:var(--bg-hover)}
  .tx-theme svg{grid-area:1/1;width:1.25rem;height:1.25rem;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform var(--d-medium) var(--ease-premium),opacity var(--d-short) ease}
  .tx-theme__sun{opacity:0;transform:rotate(-70deg) scale(.5)}
  html[data-theme="dark"] .tx-theme__sun{opacity:1;transform:none}
  html[data-theme="dark"] .tx-theme__moon{opacity:0;transform:rotate(70deg) scale(.5)}
  /* Cabeçalho em telas estreitas (em = tamanho do texto atual: os passos acompanham o A−/A+). Declarado depois das regras-base da pílula e do tema, senão elas vencem pela ordem. Os controles mantêm 2,75rem (44px) de altura; o logotipo cede primeiro e o botão de tema só sai do cabeçalho no limite (continua no menu). */
  @container pg (max-width:28em){
    .hdr__in{gap:.5rem}
    .hdr__tools{gap:.4rem}
    .hdr__menu{padding:0;width:2.75rem;justify-content:center;gap:0}
    .hdr__menu-t{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
    .tx-pill__b{min-width:2.2rem}
  }
  @container pg (max-width:22.5em){
    .hdr__brand img{height:2.75rem}
  }
  @container pg (max-width:21.5em){
    .hdr__tools{gap:.35rem}
    .tx-pill__b{min-width:2rem}
  }
  @container pg (max-width:20.5em){
    .hdr__brand img{height:2.4rem}
  }
  @container pg (max-width:19.75em){
    .hdr__brand img{height:2.25rem}
  }
  @container pg (max-width:19.1em){
    .tx-theme{display:none}
    .tx-pill__b{min-width:1.85rem}
  }
  .tx-dock{display:none}
  .tx-btn{display:grid;place-items:center;width:2.75rem;height:2.75rem;color:#f2f4f7;font-family:var(--font-body);font-weight:700;line-height:1;transition:background-color var(--d-micro) ease}
  .tx-btn--mais{font-size:1rem}
  .tx-btn--menos{font-size:.85rem}
  .tx-btn:hover{background:var(--itl-navy-950)}
  .tx-btn:focus-visible{outline:2px solid #fff;outline-offset:-4px}
  .tx-btn[disabled]{opacity:.4;cursor:default}
  .tx-btn[disabled]:hover{background:none}
  .tx-sep{width:1.5rem;height:1px;background:rgb(255 255 255 / .3)}

  /* ---------- Button Nav (#43) ---------- */
  .bnav{position:fixed;inset:auto 0 0;z-index:var(--z-float);display:grid;grid-template-columns:repeat(5,1fr);align-items:end;height:calc(var(--bnav-h) + env(safe-area-inset-bottom));padding:0 .25rem env(safe-area-inset-bottom);background:var(--bg-page);border-top:1px solid var(--line-subtle);box-shadow:0 -10px 30px -18px var(--shadow-color)}
  .bnav__i{display:grid;justify-items:center;align-content:center;gap:.2rem;height:var(--bnav-h);min-width:2.75rem;font-size:.68rem;font-weight:600;letter-spacing:.01em;color:var(--text-muted);text-decoration:none}
  .bnav__i svg{width:1.35rem;height:1.35rem;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round;stroke-linecap:round}
  .bnav__i:hover{color:var(--text-strong)}
  .bnav__i:active{transform:scale(.94)}
  .fab{position:relative;display:grid;justify-items:center;height:var(--bnav-h)}
  .fab__b{display:grid;justify-items:center;gap:.2rem;translate:0 -1.1rem;font-size:.68rem;font-weight:600;letter-spacing:.01em;color:var(--text-strong);text-decoration:none}
  html:not(.js) [data-fab-b]{display:none}
  html:not(.js) .hdr__menu,html:not(.js) .copy{display:none}
  .fab__plus{position:relative;display:block;width:3.5rem;height:3.5rem;border-radius:50%;background:var(--fab-bg);box-shadow:0 12px 24px -10px var(--shadow-color),0 0 0 4px var(--bg-page);transition:transform var(--d-medium) var(--ease-long)}
  .fab__plus::before,.fab__plus::after{content:"";position:absolute;left:50%;top:50%;width:1.2rem;height:2px;background:var(--fab-fg);translate:-50% -50%;border-radius:2px}
  .fab__plus::after{rotate:90deg}
  .fab__b[aria-expanded="true"] .fab__plus{transform:rotate(45deg)}
  .fab__menu{position:absolute;bottom:calc(100% + .5rem);left:50%;translate:-50% 0;display:grid;gap:.5rem;width:max-content;min-width:11rem;padding:.5rem;border:1px solid var(--card-bd);border-radius:var(--r-lg);box-shadow:var(--shadow-lg)}
  .fab__menu:not([hidden]){animation:menu-in var(--d-medium) var(--ease-long)}
  @keyframes menu-in{from{opacity:0;transform:translateY(6px)}}
  .fab__a{display:flex;align-items:center;justify-content:center;min-height:3rem;padding:0 1.25rem;border-radius:var(--r-pill);border:var(--ring) solid color-mix(in oklab,var(--line-strong) var(--ring-k),transparent);font-size:.74rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--text-strong);text-decoration:none}
  .fab__a--wa{background:var(--action-primary-bg);border-color:transparent;color:var(--action-primary-text)}

  /* ---------- Menu (dialog) ---------- */
  .drawer{position:fixed;inset:0 0 0 auto;margin:0;width:min(100%,26rem);max-width:none;height:100dvh;max-height:none;padding:0;border:0;background:var(--gradient-deep);color:var(--text-body);box-shadow:var(--shadow-lg);overflow:hidden}
  .drawer::backdrop{background:rgb(8 20 37 / .6)}
  .drawer[open]{animation:drawer-in var(--d-medium) var(--ease-long)}
  @keyframes drawer-in{from{transform:translateX(100%)}}
  .drawer__in{position:relative;isolation:isolate;display:flex;flex-direction:column;gap:var(--space-sm);height:100%;padding:var(--space-sm) var(--gutter) calc(var(--space-md) + env(safe-area-inset-bottom));overflow-y:auto;overscroll-behavior:contain;background-image:var(--pat-diamond)}
  .drawer__top{display:flex;align-items:center;justify-content:space-between;gap:1rem}
  .drawer__hi{font-family:var(--font-display);font-style:italic;font-size:var(--step-2);color:var(--text-strong)}
  .drawer__x{display:grid;place-items:center;width:2.75rem;height:2.75rem;border-radius:50%;border:var(--ring) solid var(--line-strong);color:var(--text-strong)}
  .drawer__x svg{width:1.2rem;height:1.2rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}
  .drawer__nav{list-style:none;padding:0;display:grid}
  .drawer__nav a{display:flex;align-items:center;min-height:3.25rem;border-bottom:1px solid var(--line-subtle);font-family:var(--font-display);font-size:var(--step-2);color:var(--text-strong);text-decoration:none}
  .drawer__nav a:hover{color:var(--link)}
  .drawer__theme{display:flex;align-items:center;justify-content:space-between;gap:1rem;width:100%;min-height:3.25rem;padding:0 .1rem;border-bottom:1px solid var(--line-subtle);font-size:var(--step-0);color:var(--text-body);text-align:left}
  .sw{position:relative;flex:none;width:2.75rem;height:1.5rem;border-radius:var(--r-pill);background:rgb(255 255 255 / .18);transition:background-color var(--d-short) ease}
  .sw::after{content:"";position:absolute;left:.2rem;top:.2rem;width:1.1rem;height:1.1rem;border-radius:50%;background:#fff;transition:transform var(--d-short) var(--ease-premium),background-color var(--d-short) ease}
  html[data-theme="dark"] .sw{background:var(--itl-ouro-300)}
  html[data-theme="dark"] .sw::after{transform:translateX(1.25rem);background:var(--ink)}
  .drawer__cta{display:grid;gap:var(--space-2xs);margin-top:auto}
  .drawer__addr{font-size:var(--step--1);color:var(--text-muted)}

  /* ---------- Visualizador de fotos (dialog) ---------- */
  .viewer{position:fixed;inset:0;margin:0;width:100%;max-width:none;height:100%;max-height:none;padding:0;border:0;background:#0b0d10;color:#f2f4f7}
  .viewer::backdrop{background:#0b0d10}
  .viewer__in{display:flex;flex-direction:column;height:100%;padding:max(.75rem,env(safe-area-inset-top)) max(.75rem,env(safe-area-inset-right)) max(.75rem,env(safe-area-inset-bottom)) max(.75rem,env(safe-area-inset-left))}
  .viewer__head{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-bottom:.5rem;font-size:.85rem}
  .viewer__stage{flex:1;min-height:0;display:grid;place-items:center;touch-action:pan-y}
  .viewer__img{max-width:min(100%,36rem);max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:var(--r-sm)}
  .viewer__foot{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding-top:.5rem}
  .viewer__btn{display:grid;place-items:center;flex:none;width:2.75rem;height:2.75rem;border:1px solid rgb(255 255 255 / .24);border-radius:8px;color:#f2f4f7;background:#0b0d10}
  .viewer__btn:hover{border-color:rgb(255 255 255 / .6)}
  .viewer__btn:focus-visible{outline:2px solid #f5f7fa;outline-offset:2px}
  .viewer__btn svg{width:1.3rem;height:1.3rem;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
  .viewer__status{display:grid;gap:.15rem;text-align:center;font-size:.85rem;line-height:1.4;max-width:none}
  .viewer__status span:last-child{font-size:.75rem;font-variant-numeric:tabular-nums;color:#aab2bf}

  /* ---------- Fotos: movimento ao passar o mouse (só ponteiro fino e com movimento permitido; sem inclinação 3D) ---------- */
  [data-ph]{--ph-x:0;--ph-y:0;--ph-mx:50%;--ph-my:50%}
  [data-ph]::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;background:radial-gradient(circle 15rem at var(--ph-mx) var(--ph-my),color-mix(in oklab,var(--itl-white) 20%,transparent),transparent 68%);transition:opacity var(--d-medium) var(--ease-premium)}
  .doctor__img{transform-origin:50% 100%}
  .gal__ph:focus-visible img{transform:scale(1.04)}
  @media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
    [data-ph] img{transition:transform 900ms var(--ease-premium)}
    [data-ph]:hover::after{opacity:1}
    .gal__ph:hover img,.aid__ph:hover img,.hosp__ph:hover img{transform:translate3d(calc(var(--ph-x) * -10px),calc(var(--ph-y) * -10px),0) scale(1.075)}
    .doctor__frame:hover .doctor__img{transform:translate3d(calc(var(--ph-x) * -8px),0,0) scale(1.04)}
    .gal__mosaic:has(.gal__ph:hover) .gal__ph:not(:hover){opacity:.6}
  }

  /* Cartões — um único gesto de hover para todos (pilares, tiles de atendimento, canais/endereço, cartão do médico, nota do índice):
     sobem 4 px e a luz do "bleed" se intensifica. Sobe por `translate` (propriedade própria, não disputa com o `transform` do reveal);
     a luz é um pseudo-elemento animado só em opacity, abaixo do conteúdo. */
  :is(.pillar__main,.pillar__side,.tile,.comp,.hero__card,.cel--nota){position:relative;isolation:isolate}
  :is(.pillar__main,.pillar__side,.tile,.comp,.hero__card,.cel--nota)::after{content:"";position:absolute;inset:0;z-index:-1;border-radius:inherit;pointer-events:none;background:var(--bleed);opacity:0;transition:opacity var(--d-medium) var(--ease-premium)}
  :is(.tile,.comp,.hero__card){transition:translate var(--d-medium) var(--ease-premium)}
  .io :is(.pillar,.tile,.comp,.hero__card).reveal{transition:opacity var(--d-long) var(--ease-long),transform var(--d-long) var(--ease-long),translate var(--d-medium) var(--ease-premium)}
  @media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){
    :is(.pillar,.tile,.comp,.hero__card):hover{translate:0 -4px}
    .nota{transition:translate var(--d-medium) var(--ease-premium)}
    :is(.doctor__figure,.aid__fig,.hosp__fig,.vid):hover .nota{translate:0 -4px}
    :is(.tile,.comp,.hero__card,.cel--nota):hover::after,.pillar:hover :is(.pillar__main,.pillar__side)::after{opacity:1}
  }
}

/* Quebra do menu: a barra horizontal entra a 1024 px com texto 100 %, e mais tarde nos passos 112,5 % e 125 % */
@layer components{
  @media (min-width:64em){
    html:not([data-fs="1"]):not([data-fs="2"]) .hdr__menu{display:none}
    html:not([data-fs="1"]):not([data-fs="2"]) .nav{display:block;margin-left:auto}
    html:not([data-fs="1"]):not([data-fs="2"]) .hdr__cta{display:inline-flex}
    html:not([data-fs="1"]):not([data-fs="2"]) .hdr__tools{margin-left:.5rem}
    html:not([data-fs="1"]):not([data-fs="2"]) .hdr__brand img{height:3.5rem}
    html:not([data-fs="1"]):not([data-fs="2"]) {--hdr-h:5.25rem}
    html:not([data-fs="1"]):not([data-fs="2"]) .bnav{display:none}
    html:not([data-fs="1"]):not([data-fs="2"]) body{padding-bottom:0}
    html:not([data-fs="1"]):not([data-fs="2"]) .tx-pill{display:none}
    html:not([data-fs="1"]):not([data-fs="2"]) .tx-dock:not([hidden]){position:fixed;display:flex;flex-direction:column;align-items:center;right:.75rem;left:auto;top:0;bottom:0;margin-block:auto;height:fit-content;z-index:var(--z-dock);background:var(--itl-navy-900);border:var(--ring) solid color-mix(in oklab,#fff 26%,transparent);border-radius:var(--r-pill);overflow:hidden;box-shadow:var(--shadow-md)}
  }
  @media (min-width:72em){
    html[data-fs="1"] .hdr__menu{display:none}
    html[data-fs="1"] .nav{display:block;margin-left:auto}
    html[data-fs="1"] .hdr__cta{display:inline-flex}
    html[data-fs="1"] .hdr__tools{margin-left:.5rem}
    html[data-fs="1"] .hdr__brand img{height:3.5rem}
    html[data-fs="1"] {--hdr-h:5.25rem}
    html[data-fs="1"] .bnav{display:none}
    html[data-fs="1"] body{padding-bottom:0}
    html[data-fs="1"] .tx-pill{display:none}
    html[data-fs="1"] .tx-dock:not([hidden]){position:fixed;display:flex;flex-direction:column;align-items:center;right:.75rem;left:auto;top:0;bottom:0;margin-block:auto;height:fit-content;z-index:var(--z-dock);background:var(--itl-navy-900);border:var(--ring) solid color-mix(in oklab,#fff 26%,transparent);border-radius:var(--r-pill);overflow:hidden;box-shadow:var(--shadow-md)}
  }
  @media (min-width:80em){
    html[data-fs="2"] .hdr__menu{display:none}
    html[data-fs="2"] .nav{display:block;margin-left:auto}
    html[data-fs="2"] .hdr__cta{display:inline-flex}
    html[data-fs="2"] .hdr__tools{margin-left:.5rem}
    html[data-fs="2"] .hdr__brand img{height:3.5rem}
    html[data-fs="2"] {--hdr-h:5.25rem}
    html[data-fs="2"] .bnav{display:none}
    html[data-fs="2"] body{padding-bottom:0}
    html[data-fs="2"] .tx-pill{display:none}
    html[data-fs="2"] .tx-dock:not([hidden]){position:fixed;display:flex;flex-direction:column;align-items:center;right:.75rem;left:auto;top:0;bottom:0;margin-block:auto;height:fit-content;z-index:var(--z-dock);background:var(--itl-navy-900);border:var(--ring) solid color-mix(in oklab,#fff 26%,transparent);border-radius:var(--r-pill);overflow:hidden;box-shadow:var(--shadow-md)}
  }
  @media (min-width:80em){
    html:not([data-fs="1"]):not([data-fs="2"]) .hdr__cta-l{display:inline}
    html:not([data-fs="1"]):not([data-fs="2"]) .nav__link{padding:0 .75rem}
    html:not([data-fs="1"]):not([data-fs="2"]) .nav__link::after{left:.75rem;right:.75rem}
  }
  @media (min-width:90em){
    html[data-fs="1"] .hdr__cta-l{display:inline}
    html[data-fs="1"] .nav__link{padding:0 .75rem}
    html[data-fs="1"] .nav__link::after{left:.75rem;right:.75rem}
  }
  @media (min-width:100em){
    html[data-fs="2"] .hdr__cta-l{display:inline}
    html[data-fs="2"] .nav__link{padding:0 .75rem}
    html[data-fs="2"] .nav__link::after{left:.75rem;right:.75rem}
  }
}

@layer effects{
  /* tema: revelação circular a partir do botão (View Transitions). Sem suporte ou com reduced-motion, a troca é instantânea */
  html.vt-theme::view-transition-old(root),html.vt-theme::view-transition-new(root){animation:none;mix-blend-mode:normal}
  html.vt-theme::view-transition-old(root){z-index:1}
  html.vt-theme::view-transition-new(root){z-index:2}
  /* #41 split-text: só nasce escondido com JS (html.split-wait); sem JS ou sem fonte, o H1 aparece */
  .split-wait .split__w{opacity:0}
  .split-go .split__w{animation:word-in var(--d-long) var(--ease-long) both;animation-delay:calc(var(--w) * 80ms)}
  @keyframes word-in{from{opacity:0;transform:translateY(.45em);filter:blur(4px)}to{opacity:1;transform:none;filter:none}}
  .gradtext{animation:gradPan 6s linear infinite}
  .split-go .gradtext{animation:word-in var(--d-long) var(--ease-long) both,gradPan 6s linear infinite;animation-delay:calc(var(--w) * 80ms),0s}
  @keyframes gradPan{to{background-position:250% 0}}
  .orbit-rot{transform-box:fill-box;transform-origin:center;animation:spin 90s linear infinite}
  .orbit-rot--rev{animation-duration:140s;animation-direction:reverse}
  @keyframes spin{to{transform:rotate(360deg)}}
  .neural-pulse{animation:orbit-pulse 6s var(--ease-long) infinite}
  @keyframes orbit-pulse{0%,100%{opacity:.25}50%{opacity:.8}}
  .marquee{animation:marquee 60s linear infinite}
  .authbar:hover .marquee,.authbar:focus-within .marquee{animation-play-state:paused}
  @keyframes marquee{to{transform:translateX(-50%)}}
  .hero__scroll i{animation:scroll-line 2.4s var(--ease-long) infinite}
  @keyframes scroll-line{0%{transform:scaleY(0);opacity:1}60%{transform:scaleY(1);opacity:1}100%{transform:scaleY(1);opacity:0}}
  .hero.is-off :is(.orbit-rot,.neural-pulse,.hero__scroll i,.gradtext){animation-play-state:paused}

  /* #40 scroll-driven nativo (+ #02) com fallback por IntersectionObserver só quando não há suporte */
  @supports (animation-timeline:view()){
    .reveal{animation:reveal-in linear both;animation-timeline:view();animation-range:entry 0% entry 55%}
    @keyframes reveal-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}
    @media (min-width:769px){
      .hero__orbital,.hero__orb{animation:drift linear both;animation-timeline:scroll(root);animation-range:0 100vh}
      @keyframes drift{to{transform:translateY(-40px)}}
      /* #10 mínimo: marca-d'água "ITL" com uma camada de paralaxe */
      .hero__mark{animation:mark-drift linear both;animation-timeline:scroll(root);animation-range:0 100vh}
      @keyframes mark-drift{to{transform:translateY(-6vh)}}
    }
  }
  @supports not (animation-timeline:view()){
    .io .reveal{opacity:0;transform:translateY(22px);transition:opacity var(--d-long) var(--ease-long),transform var(--d-long) var(--ease-long)}
    .io .reveal.is-in{opacity:1;transform:none}
  }
}

@layer utilities{
  .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}
  @media (prefers-reduced-motion:reduce){
    *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important}
    .reveal,.orbit-rot,.neural-pulse,.hero__scroll i,.gradtext,.split__w,.hero__mark,.marquee{animation:none!important;opacity:1!important;transform:none!important}
    .hero__orbital,.hero__orb{animation:none!important;transform:none!important}
    .marquee{width:auto;flex-wrap:wrap;justify-content:center}
    .marquee__t{flex-wrap:wrap;justify-content:center;white-space:normal;padding:0 1rem}
    .marquee__t[aria-hidden="true"]{display:none}
    .btn-p{--mx:0px!important;--my:0px!important}
  }
  @media print{.hdr,.bnav,.drawer,.viewer,.tx-dock{display:none!important}body{padding-bottom:0}}
}