/* =========================================================
   DR. IGOR CARDILLO — Design System
   Ortopedia · Joelho · Medicina do Esporte
   ---------------------------------------------------------
   Direção: editorial escuro. Grão sutil, hairlines douradas,
   blocos grafite alternados com papel, emblema em marca d'água.
   ========================================================= */

/* ---------- 1. TOKENS ---------- */
:root{
  /* Azuis — derivados do logo #171D2D */
  --ink:          #10192B;
  --ink-900:      #16223A;
  --ink-800:      #1D2E4A;
  --ink-600:      #33506F;
  --ink-400:      #6E88A2;

  /* Grafite — casa com o fundo das fotos de estúdio */
  --carbon:       #2B313C;
  --carbon-2:     #363D4A;
  --carbon-line:  rgba(255,255,255,.10);

  --paper:        #FFFFFF;
  --mist:         #F5F7F9;
  --mist-2:       #EAEEF2;
  --line:         #E1E7EC;
  --line-strong:  #C7D2DC;
  --muted:        #566677;
  --green:        #2E6F5E;
  --gold:         #B08D57;
  --gold-lite:    #C9A97A;
  --gold-soft:    #F2EADD;
  --gold-deep:    #8A6B3A;   /* dourado legivel como texto sobre fundo claro */

  --serif: "Fraunces", "Iowan Old Style", Georgia, "Times New Roman", serif;
  --sans:  "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

  --fs-display: clamp(2.5rem, 1.3rem + 4.3vw, 5rem);
  --fs-h1:      clamp(2.1rem, 1.3rem + 3.1vw, 3.8rem);
  --fs-h2:      clamp(1.8rem, 1.2rem + 2.1vw, 2.85rem);
  --fs-h3:      clamp(1.2rem, 1.05rem + 0.7vw, 1.55rem);
  --fs-lead:    clamp(1.05rem, 0.98rem + 0.45vw, 1.28rem);
  --fs-body:    1.0625rem;
  --fs-small:   0.875rem;
  --fs-micro:   0.75rem;

  --section-y: clamp(5.5rem, 3.5rem + 7vw, 11rem);
  --gutter: clamp(1.9rem, 1.3rem + 1.9vw, 2.9rem);   /* respiro interno das caixas */
  --wrap: 1220px;
  --wrap-narrow: 760px;
  --radius: 2px;
  --radius-lg: 4px;

  --ease: cubic-bezier(.22,.61,.36,1);
  --shadow-1: 0 1px 2px rgba(16,25,43,.05), 0 10px 30px rgba(16,25,43,.07);
  --shadow-2: 0 2px 8px rgba(16,25,43,.07), 0 28px 68px rgba(16,25,43,.13);
  --shadow-photo: 0 30px 80px rgba(16,25,43,.28);
}

/* ---------- 2. RESET ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth; scroll-padding-top:96px}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--sans); font-size:var(--fs-body); line-height:1.7;
  font-feature-settings:"kern","liga";
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img,svg,video,iframe{max-width:100%; display:block}
img{height:auto}
a{color:inherit; text-decoration:none}
button{font:inherit; cursor:pointer}
ul,ol{margin:0; padding:0; list-style:none}
h1,h2,h3,h4,p,figure{margin:0}
hr{border:0; border-top:1px solid var(--line); margin:3rem 0}

/* ---------- 3. TEXTURA GLOBAL ---------- */
.grain{
  position:fixed; inset:0; z-index:9999; pointer-events:none;
  background-image:url("../img/grain.png"); background-size:220px 220px;
  opacity:.55; mix-blend-mode:multiply;
}
@media (prefers-reduced-motion:no-preference){ .grain{will-change:auto} }

/* ---------- 4. TIPOGRAFIA ---------- */
.display,h1,h2{font-family:var(--serif); font-weight:400; letter-spacing:-.021em; line-height:1.06}
.display{font-size:var(--fs-display)}
h1{font-size:var(--fs-h1)}
h2{font-size:var(--fs-h2); line-height:1.1}
h3{font-family:var(--sans); font-size:var(--fs-h3); font-weight:600; letter-spacing:-.012em; line-height:1.28}
.lead{font-size:var(--fs-lead); line-height:1.6; color:var(--muted); font-weight:350}
.prose p+p{margin-top:1.15em}
.prose p{color:var(--muted)}
.prose strong{color:var(--ink); font-weight:600}

.eyebrow{
  font-size:var(--fs-micro); font-weight:600; letter-spacing:.2em;
  text-transform:uppercase; color:var(--ink-400); display:flex;
  align-items:center; gap:.75rem;
}
.eyebrow::before{content:""; width:28px; height:1px; background:var(--gold); flex:none}
.eyebrow.center{justify-content:center}
.tm{font-size:.5em; vertical-align:super; letter-spacing:0; opacity:.6}

/* ---------- 5. LAYOUT ---------- */
.wrap{width:min(100% - 3rem, var(--wrap)); margin-inline:auto}
.narrow{width:min(100% - 3rem, var(--wrap-narrow)); margin-inline:auto}
section{position:relative}
.section{padding-block:var(--section-y)}
.section--tight{padding-block:clamp(3rem,2rem+4vw,5.5rem)}

.bg-mist{background:var(--mist)}
.bg-ink{background:var(--ink); color:#E4EBF2}
.bg-carbon{background:var(--carbon); color:#DDE3EA}
.bg-ink h1,.bg-ink h2,.bg-ink h3,.bg-carbon h1,.bg-carbon h2,.bg-carbon h3{color:#fff}
.bg-ink .lead,.bg-ink .prose p,.bg-carbon .lead,.bg-carbon .prose p{color:#A7B7C7}
.bg-ink .eyebrow,.bg-carbon .eyebrow{color:#8FA5B8}
.bg-ink .eyebrow::before,.bg-carbon .eyebrow::before{background:var(--gold-lite)}

/* faixa dourada de 1px que separa blocos escuros */
.bg-ink::before,.bg-carbon::before{
  content:""; position:absolute; inset:0 0 auto; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.5;
}

.grid{display:grid; gap:clamp(1.75rem,1.2rem+2.4vw,3.25rem)}
.g-2{grid-template-columns:repeat(2,1fr)}
.g-3{grid-template-columns:repeat(3,1fr)}
.g-4{grid-template-columns:repeat(4,1fr)}
.split{display:grid; grid-template-columns:1fr 1fr; gap:clamp(2rem,1rem+4vw,5.5rem); align-items:center}
.split--wide-left{grid-template-columns:1.15fr .85fr}
.stack-2>*+*{margin-top:1rem}
.stack-3>*+*{margin-top:1.5rem}
.center{text-align:center}
/* cabeçalho de seção com emblema em marca d'água */
.section-head{max-width:54ch; position:relative}
.section-head.center{margin-inline:auto; text-align:center}
.section-head>*+*{margin-top:1rem}
.section-head>*{position:relative; z-index:1}
.section-head::before{
  content:""; position:absolute; z-index:0; pointer-events:none;
  left:-7%; top:50%; transform:translateY(-50%);
  width:min(300px,40vw); aspect-ratio:1;
  background:url("../img/emblema.png") center/contain no-repeat;
  opacity:.055;
}
.section-head.center::before{left:50%; transform:translate(-50%,-50%)}
.bg-ink .section-head::before,.bg-carbon .section-head::before,
.cta-band .section-head::before{background-image:url("../img/emblema-branco.png"); opacity:.07}
@media (max-width:640px){ .section-head::before{width:200px; opacity:.04} }

/* seção com fotografia de fundo */
.section--photo{position:relative; isolation:isolate; overflow:hidden}
.sec-bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:-2; filter:grayscale(1) contrast(.92); pointer-events:none;
}
.section--photo::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.90) 0%,rgba(255,255,255,.74) 48%,rgba(255,255,255,.92) 100%);
}
.bg-mist.section--photo::after{
  background:linear-gradient(180deg,rgba(245,247,249,.92) 0%,rgba(245,247,249,.76) 48%,rgba(245,247,249,.94) 100%);
}
.bg-carbon.section--photo::after{
  background:linear-gradient(180deg,rgba(43,49,60,.93) 0%,rgba(43,49,60,.78) 48%,rgba(43,49,60,.95) 100%);
}
.bg-ink.section--photo::after,.cta-band.section--photo::after{
  background:linear-gradient(180deg,rgba(16,25,43,.93) 0%,rgba(16,25,43,.78) 48%,rgba(16,25,43,.95) 100%);
}
.bg-carbon.section--photo .sec-bg,.bg-ink.section--photo .sec-bg,
.cta-band.section--photo .sec-bg{filter:grayscale(1) contrast(1.08) brightness(.92)}
/* o véu antigo de .bg-mist não se aplica quando há fotografia */
.bg-mist.section--photo{isolation:isolate}
.bg-mist.section--photo>.sec-bg~*{position:relative}

/* proteção de leitura: caixa de texto ganha leve fundo sobre a foto */
.section--photo .section-head,.section--photo .prose{position:relative}

/* fotografia de fundo no hero da home */
.hero__bg{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  z-index:0; opacity:.30; filter:grayscale(1) contrast(1.1);
}
.hero::before{
  content:""; position:absolute; inset:0; z-index:1; pointer-events:none;
  background:linear-gradient(100deg,rgba(16,25,43,.94) 0%,rgba(16,25,43,.80) 45%,rgba(16,25,43,.55) 100%);
}
.hero .hero__grid,.hero .hero__mark{position:relative; z-index:2}

/* véu fotográfico atrás das seções claras */
.bg-mist{position:relative; isolation:isolate}
.bg-mist::after{
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:url("../img/veu.jpg") center/cover no-repeat;
  opacity:.30; filter:grayscale(1) contrast(.9);
  -webkit-mask-image:linear-gradient(180deg,#000,transparent 78%);
  mask-image:linear-gradient(180deg,#000,transparent 78%);
}

/* ---------- 6. BOTÕES ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:.6rem;
  padding:1rem 1.8rem; border:1px solid transparent; border-radius:var(--radius);
  font-size:.9375rem; font-weight:500; letter-spacing:.012em;
  transition:background .35s var(--ease), color .35s var(--ease), border-color .35s var(--ease), transform .35s var(--ease);
}
.btn:hover{transform:translateY(-1px)}
.btn--primary{background:var(--ink); color:#fff}
.btn--primary:hover{background:var(--ink-800)}
.btn--ghost{border-color:var(--line-strong); color:var(--ink); background:transparent}
.btn--ghost:hover{border-color:var(--ink); background:var(--ink); color:#fff}
.btn--light{background:#fff; color:var(--ink)}
.btn--light:hover{background:var(--mist-2)}
.btn--gold{background:var(--gold); color:#fff}
.btn--gold:hover{background:var(--gold-lite)}
.btn--outline-light{border-color:rgba(255,255,255,.34); color:#fff}
.btn--outline-light:hover{background:#fff; color:var(--ink); border-color:#fff}
.btn-row{display:flex; flex-wrap:wrap; gap:.75rem}
.btn-row.center{justify-content:center}

.link-arrow{
  display:inline-flex; align-items:center; gap:.5rem; font-size:.9375rem;
  font-weight:500; color:var(--ink); padding-bottom:3px;
  border-bottom:1px solid var(--gold); transition:gap .3s var(--ease), color .3s var(--ease);
}
.link-arrow:hover{gap:.9rem; color:var(--gold)}
.link-arrow::after{content:"\2192"; opacity:.65}
.bg-ink .link-arrow,.bg-carbon .link-arrow{color:#fff; border-color:var(--gold-lite)}
.bg-ink .link-arrow:hover,.bg-carbon .link-arrow:hover{color:var(--gold-lite)}

/* ---------- 7. HEADER ---------- */
.header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.88); backdrop-filter:saturate(180%) blur(16px);
  border-bottom:1px solid transparent; transition:border-color .4s var(--ease), box-shadow .4s var(--ease);
}
.header.is-scrolled{border-bottom-color:var(--line); box-shadow:0 1px 24px rgba(16,25,43,.05)}
.header__inner{display:flex; align-items:center; justify-content:space-between; gap:2rem; height:84px}
.brand{display:flex; align-items:center; gap:.8rem}
.brand__mark{width:44px; height:44px; object-fit:contain}
.brand__txt{display:flex; flex-direction:column; line-height:1.1}
.brand__name{font-family:var(--serif); font-size:1.08rem; letter-spacing:.02em; color:var(--ink)}
.brand__sub{font-size:.625rem; letter-spacing:.24em; text-transform:uppercase; color:var(--ink-400); margin-top:4px}
.nav{display:flex; align-items:center; gap:2rem}
.nav a{font-size:.875rem; color:var(--ink-600); transition:color .25s var(--ease)}
.nav a:hover,.nav a[aria-current="page"]{color:var(--ink)}
.nav-item{position:relative}
.nav-item>button{
  background:none; border:0; padding:0; font-size:.875rem; color:var(--ink-600);
  display:inline-flex; align-items:center; gap:.35rem; transition:color .25s var(--ease);
}
.nav-item>button::after{content:""; width:5px; height:5px; border-right:1px solid currentColor; border-bottom:1px solid currentColor; transform:rotate(45deg) translateY(-1px); transition:transform .3s var(--ease)}
.nav-item[data-open="true"]>button{color:var(--ink)}
.nav-item[data-open="true"]>button::after{transform:rotate(225deg) translateY(-1px)}
.dropdown{
  position:absolute; top:calc(100% + 22px); left:50%; transform:translate(-50%,-6px);
  min-width:320px; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg);
  box-shadow:var(--shadow-2); padding:.5rem; opacity:0; visibility:hidden;
  transition:opacity .28s var(--ease), transform .28s var(--ease), visibility .28s;
}
.dropdown::before{content:""; position:absolute; inset:0 0 auto; height:2px; background:var(--gold); opacity:.7}
.nav-item[data-open="true"] .dropdown{opacity:1; visibility:visible; transform:translate(-50%,0)}
.dropdown a{display:block; padding:.72rem .85rem; border-radius:var(--radius); transition:background .2s}
.dropdown a:hover{background:var(--mist)}
.dropdown strong{display:block; font-size:.875rem; font-weight:600; color:var(--ink)}
.dropdown span{display:block; font-size:.75rem; color:var(--ink-400); margin-top:2px; line-height:1.45}
.header .btn{padding:.72rem 1.3rem; font-size:.8125rem}
.burger{display:none; background:none; border:0; width:44px; height:44px; margin-right:-10px}
.burger span{display:block; width:22px; height:1px; background:var(--ink); margin:5px auto; transition:transform .3s var(--ease), opacity .3s}
body.menu-open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.menu-open .burger span:nth-child(2){opacity:0}
body.menu-open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

.mobile-nav{
  position:fixed; inset:84px 0 0; background:#fff; z-index:99; padding:2rem 1.25rem 4rem;
  overflow-y:auto; opacity:0; visibility:hidden; transform:translateY(-8px);
  transition:opacity .3s var(--ease), transform .3s var(--ease), visibility .3s;
}
body.menu-open .mobile-nav{opacity:1; visibility:visible; transform:translateY(0)}
.mobile-nav .grp{border-top:1px solid var(--line); padding:1.25rem 0}
.mobile-nav .grp:first-child{border-top:0}
.mobile-nav .grp>p{font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-bottom:.75rem}
.mobile-nav a{display:block; padding:.5rem 0; font-size:1.0625rem; color:var(--ink)}

/* ---------- 8. HERO ---------- */
.hero{position:relative; background:var(--ink); color:#fff; overflow:hidden}
.hero::after{
  content:""; position:absolute; inset:auto 0 0; height:1px;
  background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.55;
}
.hero__grid{
  position:relative; display:grid; grid-template-columns:1.05fr .95fr;
  gap:clamp(2rem,1rem+4vw,4.5rem); align-items:center;
  padding-block:clamp(3.5rem,2rem+6vw,6rem);
}
.hero__copy{max-width:56ch; padding-block:clamp(1rem,2vw,3rem)}
.hero .eyebrow{color:#9DB4C8}
.hero .display{color:#fff; margin-top:1.5rem}
.hero__lead{color:#B3C4D3; font-size:var(--fs-lead); margin-top:1.75rem; max-width:46ch; font-weight:350}
.hero__note{
  color:#8FA5B8; font-size:.9688rem; line-height:1.6; margin-top:1.5rem; max-width:46ch;
  padding-top:1.25rem; border-top:1px solid rgba(255,255,255,.14);
}
.hero .btn-row{margin-top:2.5rem}
/* emblema grande atrás do hero */
.hero__mark{
  position:absolute; left:-4%; top:50%; transform:translateY(-50%);
  width:min(760px,64vw); opacity:.07; pointer-events:none; z-index:0;
}
.hero__grid{z-index:1}
/* foto encostada na margem direita da grade; moldura desloca para baixo/esquerda */
.hero__photo{position:relative; padding:0 0 18px 18px}
.hero__photo::before{
  content:""; position:absolute; inset:18px 18px 0 0;
  border:1px solid rgba(176,141,87,.55); border-radius:var(--radius-lg); z-index:0;
}
.hero__photo img{
  position:relative; z-index:1;
  width:100%; border-radius:var(--radius-lg); box-shadow:var(--shadow-photo);
  filter:saturate(.94) contrast(1.03);
}
.hero__meta{
  display:flex; flex-wrap:wrap; gap:2.5rem; margin-top:3rem; padding-top:2rem;
  border-top:1px solid rgba(255,255,255,.14);
}
.hero__meta div span{display:block; font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:#8299AE}
.hero__meta div strong{display:block; font-family:var(--serif); font-size:1.3rem; font-weight:400; color:#fff; margin-top:.4rem}

/* faixa editorial de foto larga */
.band{position:relative; background:var(--carbon); overflow:hidden; min-height:clamp(360px,44vw,560px); display:grid; align-items:center}
.band__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:right center}
.band__veil{position:absolute; inset:0; background:linear-gradient(90deg,rgba(16,25,43,.94) 0%,rgba(16,25,43,.80) 38%,rgba(16,25,43,0) 72%)}
.band__inner{position:relative; padding-block:clamp(3rem,2rem+4vw,5rem); max-width:46ch; color:#fff}
.band__inner h2{color:#fff}
.band__inner p{color:#B3C4D3; margin-top:1.25rem}
/* variante com a foto à esquerda e o texto à direita */
.band--left .band__img{object-position:left center}
.band--left .band__veil{background:linear-gradient(270deg,rgba(16,25,43,.94) 0%,rgba(16,25,43,.80) 38%,rgba(16,25,43,0) 72%)}
.band--left .band__inner{margin-left:auto}
.band::after{content:""; position:absolute; inset:auto 0 0; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.5}

/* ---------- 9. PAGE HERO ---------- */
.pagehero{
  background:var(--mist); border-bottom:1px solid var(--line);
  overflow:hidden; isolation:isolate;
}
.pagehero::after{           /* imagem de fundo apagada */
  content:""; position:absolute; inset:0; z-index:-1; pointer-events:none;
  background:url("../img/veu.jpg") center/cover no-repeat;
  opacity:.42; filter:grayscale(1) contrast(.92);
  -webkit-mask-image:linear-gradient(100deg,transparent 8%,#000 55%);
  mask-image:linear-gradient(100deg,transparent 8%,#000 55%);
}
.pagehero__mark{
  position:absolute; right:-40px; top:50%; transform:translateY(-50%);
  width:min(420px,38vw); opacity:.07; pointer-events:none;
}
.pagehero__inner{position:relative; padding-block:clamp(3.5rem,2.5rem+5vw,7rem); max-width:58ch}
.pagehero h1{margin-top:1.25rem}
.pagehero .lead{margin-top:1.25rem}
.breadcrumb{display:flex; flex-wrap:wrap; gap:.5rem; font-size:var(--fs-small); color:var(--ink-400); margin-bottom:1.75rem}
.breadcrumb a:hover{color:var(--ink)}
.breadcrumb li{display:inline}
.breadcrumb li+li::before{content:"/"; margin-right:.5rem; opacity:.5}

/* ---------- 8b. MANIFESTO ---------- */
.manifesto{position:relative; background:var(--ink); color:#DCE5EE; overflow:hidden; isolation:isolate}
.manifesto__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; opacity:.22; filter:grayscale(1)}
.manifesto::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(180deg,rgba(16,25,43,.93) 0%,rgba(16,25,43,.86) 50%,rgba(16,25,43,.95) 100%);
}
.manifesto::before{content:""; position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.6}
.manifesto__inner{padding-block:clamp(5rem,3.5rem+7vw,10rem); max-width:74ch; margin-inline:auto}
.manifesto .eyebrow{color:#8FA5B8; justify-content:center}
.manifesto .eyebrow::before{background:var(--gold-lite)}
.manifesto__lead{
  font-family:var(--serif); font-weight:400; letter-spacing:-.018em; line-height:1.22;
  font-size:clamp(1.6rem,1.1rem + 1.9vw,2.5rem); color:#fff; text-align:center;
  margin-top:1.75rem;
}
.manifesto__body{margin-top:clamp(2.5rem,2rem+2vw,4rem)}
.manifesto__body p{
  font-size:clamp(1.05rem,1rem + .35vw,1.2rem); line-height:1.72; color:#B9C8D6;
}
.manifesto__body p+p{margin-top:1.5rem}
.manifesto__body strong{color:#fff; font-weight:500}
.manifesto__body em{
  display:block; font-family:var(--serif); font-style:normal; color:#fff;
  font-size:clamp(1.25rem,1rem + .9vw,1.6rem); line-height:1.35;
  padding-left:1.5rem; border-left:2px solid var(--gold); margin:2.5rem 0;
}
.manifesto__sign{
  margin-top:clamp(2.5rem,2rem+2vw,3.5rem); padding-top:2rem;
  border-top:1px solid rgba(255,255,255,.14); display:flex; align-items:center; gap:1.1rem;
}
.manifesto__sign img{width:52px; height:52px; object-fit:contain; opacity:.9; flex:none}
.manifesto__sign strong{display:block; font-family:var(--serif); font-weight:400; font-size:1.15rem; color:#fff}
.manifesto__sign span{display:block; font-size:.8125rem; letter-spacing:.06em; color:#8FA5B8; margin-top:.25rem}
@media (max-width:640px){ .manifesto__lead{text-align:left} .manifesto .eyebrow{justify-content:flex-start} }

/* ---------- 9b. PÁGINAS DE MÉTODO ---------- */
.mhero{position:relative; background:var(--ink); color:#fff; overflow:hidden; isolation:isolate}
.mhero__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; opacity:.55}
.mhero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg,rgba(16,25,43,.97) 0%,rgba(16,25,43,.88) 42%,rgba(16,25,43,.52) 100%);
}
.mhero::before{content:""; position:absolute; inset:auto 0 0; height:1px; z-index:1; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.6}
.mhero__inner{position:relative; padding-block:clamp(4.5rem,3rem+8vw,9rem)}
.mhero__grid{display:grid; grid-template-columns:1.08fr .92fr; gap:clamp(2rem,1rem+4vw,5.5rem); align-items:end}
.mhero__right{padding-bottom:.4rem}
.mhero .breadcrumb{color:#8FA5B8}
.mhero .breadcrumb a:hover{color:#fff}
.mhero h1{color:#fff; margin-top:1.25rem}
@media (max-width:920px){
  .mhero__grid{grid-template-columns:1fr; gap:2.25rem; align-items:start}
  .mhero__right{padding-bottom:0}
}
.mhero__tag{
  display:block; font-family:var(--sans); font-size:var(--fs-micro); font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--gold-lite); margin-top:1.1rem;
}
.mhero__lead{color:#B3C4D3; font-size:var(--fs-lead); margin-top:1.75rem; max-width:50ch; font-weight:350}
.mhero blockquote{
  margin:2.5rem 0 0; padding-left:1.5rem; border-left:2px solid var(--gold);
  font-family:var(--serif); font-size:1.25rem; line-height:1.45; color:#fff; max-width:44ch;
}

/* linha do tempo da jornada */
.jornada{display:grid; gap:1.5rem; margin-top:clamp(2.5rem,2rem+2vw,4rem)}
.fase{display:grid; grid-template-columns:66px 1fr; gap:clamp(1.25rem,1rem+1.2vw,2.25rem)}
.fase__marker{position:relative; display:flex; justify-content:center}
.fase__marker::before{content:""; position:absolute; top:52px; bottom:-1.5rem; width:1px; background:var(--line-strong)}
.fase:last-child .fase__marker::before{display:none}
.fase__dot{
  width:52px; height:52px; border-radius:50%; flex:none; z-index:1;
  background:var(--ink); color:#fff; border:1px solid var(--gold);
  display:grid; place-items:center; font-family:var(--serif); font-size:1.15rem;
}
.fase--start .fase__dot,.fase--end .fase__dot{background:var(--gold); border-color:var(--gold)}
.fase__body{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg,#FFFFFF 0%,#EDF2F8 55%,#E4EBF3 100%);
  border:1px solid #C4D2DF; border-radius:var(--radius-lg);
  box-shadow:0 1px 2px rgba(16,25,43,.05), 0 16px 36px rgba(16,25,43,.075);
  padding:var(--gutter);
}
.fase__body::before{content:""; position:absolute; inset:0 0 auto; height:3px; background:linear-gradient(90deg,var(--gold),rgba(176,141,87,.2))}
.fase__meta{font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:.7rem}
.fase__body h3{font-family:var(--serif); font-weight:400; font-size:1.45rem; letter-spacing:-.018em}
.fase__body h4{margin:.4rem 0 0; font-size:.9375rem; font-weight:600; color:var(--ink-600)}
.fase__body p{color:var(--muted); font-size:.9688rem; margin-top:1rem}
.chips{display:flex; flex-wrap:wrap; gap:.5rem; margin-top:1.4rem}
.chip{
  font-size:.8125rem; padding:.42rem .95rem; border-radius:100px;
  border:1px solid var(--line-strong); background:#fff; color:var(--muted);
}
.bg-carbon .fase__body,.bg-ink .fase__body{background:linear-gradient(160deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 100%); border-color:rgba(255,255,255,.18); box-shadow:none}
.bg-carbon .fase__body p,.bg-ink .fase__body p{color:#A7B7C7}
.bg-carbon .chip,.bg-ink .chip{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.2); color:#C6D3DF}
.bg-carbon .fase__marker::before,.bg-ink .fase__marker::before{background:rgba(255,255,255,.2)}

/* passaporte / critérios de liberação */
.passaporte{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--carbon-line); border:1px solid var(--carbon-line); border-radius:var(--radius-lg); overflow:hidden; margin-top:3rem}
.passaporte>div{background:rgba(255,255,255,.04); padding:var(--gutter)}
.passaporte h4{font-family:var(--serif); font-weight:400; font-size:1.2rem; color:#fff; margin-bottom:.6rem}
.passaporte p{font-size:.9375rem; color:#A7B7C7}
.passaporte__n{display:block; font-size:var(--fs-micro); letter-spacing:.18em; color:var(--gold-lite); margin-bottom:.8rem}
.desfechos{display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-top:2.5rem}
.desfecho{padding:1.4rem 1.6rem; border-radius:var(--radius-lg); border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.04)}
.desfecho strong{display:block; font-size:1rem; color:#fff; margin-bottom:.3rem}
.desfecho span{font-size:.875rem; color:#A7B7C7}
.desfecho--ok{border-left:3px solid var(--green)}
.desfecho--parcial{border-left:3px solid var(--gold)}
.desfecho--nao{border-left:3px solid var(--ink-400)}

@media (max-width:900px){
  .passaporte{grid-template-columns:1fr}
  .desfechos{grid-template-columns:1fr}
  .fase{grid-template-columns:46px 1fr; gap:1rem}
  .fase__dot{width:42px; height:42px; font-size:1rem}
  .fase__marker::before{top:42px}
}

/* ---------- 10. CARDS ---------- */
.card{
  position:relative; overflow:hidden;
  background:linear-gradient(160deg,#FFFFFF 0%,#EDF2F8 55%,#E4EBF3 100%);
  border:1px solid #C4D2DF; border-radius:var(--radius-lg);
  box-shadow:0 1px 2px rgba(16,25,43,.05), 0 18px 40px rgba(16,25,43,.09);
  padding:var(--gutter); display:flex; flex-direction:column;
  transition:border-color .4s var(--ease), box-shadow .4s var(--ease), transform .4s var(--ease);
}
/* barra dourada permanente no topo */
.card::before{
  content:""; position:absolute; inset:0 0 auto; height:3px;
  background:linear-gradient(90deg,var(--gold) 0%,var(--gold-lite) 45%,rgba(176,141,87,.2) 100%);
  transition:height .4s var(--ease);
}
/* textura diagonal visível o suficiente para dar matéria */
.card::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:repeating-linear-gradient(135deg,rgba(16,25,43,.038) 0 1px,transparent 1px 8px);
}
.card>*{position:relative; z-index:1}
.card:hover{border-color:var(--ink-600); box-shadow:var(--shadow-2); transform:translateY(-4px)}
.card:hover::before{height:5px}
.card h3{margin-top:.4rem}
.card p{color:var(--muted); font-size:.9375rem; margin-top:.75rem}
.card .link-arrow{margin-top:auto; padding-top:1.75rem; align-self:flex-start; border-bottom:0}
.card__tag{font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--gold)}
.bg-carbon .card,.bg-ink .card{background:linear-gradient(160deg,rgba(255,255,255,.085) 0%,rgba(255,255,255,.03) 100%); border-color:rgba(255,255,255,.18)}
.bg-carbon .card p,.bg-ink .card p{color:#A7B7C7}
.bg-carbon .card:hover,.bg-ink .card:hover{background:rgba(255,255,255,.06); border-color:rgba(255,255,255,.2)}

/* cartões de programa */
.program-card{
  position:relative; background:linear-gradient(160deg,#FFFFFF 0%,#EDF2F8 55%,#E4EBF3 100%);
  border:1px solid #C4D2DF;
  box-shadow:0 1px 2px rgba(16,25,43,.05), 0 18px 40px rgba(16,25,43,.09);
  border-radius:var(--radius-lg); overflow:hidden; display:flex; flex-direction:column;
  transition:box-shadow .45s var(--ease), transform .45s var(--ease), border-color .45s var(--ease);
}
.program-card::before{content:""; position:absolute; inset:0 0 auto; height:3px; z-index:2; background:linear-gradient(90deg,var(--gold) 0%,var(--gold-lite) 45%,rgba(176,141,87,.2) 100%)}
.program-card::after{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:0;
  background:repeating-linear-gradient(135deg,rgba(16,25,43,.038) 0 1px,transparent 1px 8px);
}
.program-card:hover{box-shadow:var(--shadow-2); transform:translateY(-4px); border-color:var(--ink-600)}
.program-card__body{position:relative; z-index:1; padding:var(--gutter); display:flex; flex-direction:column; flex:1}
.program-card__num{font-family:var(--serif); font-size:.8rem; letter-spacing:.2em; color:var(--gold); margin-bottom:1.1rem; text-transform:uppercase}
.program-card h3{font-family:var(--serif); font-weight:400; font-size:1.6rem; letter-spacing:-.018em}
.program-card__for{font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--green); margin-top:.8rem}
.program-card ul{margin-top:1.4rem; display:grid; gap:.6rem}
.program-card li{position:relative; padding-left:1.3rem; font-size:.9375rem; color:var(--muted)}
.program-card li::before{content:""; position:absolute; left:0; top:.66em; width:5px; height:5px; border-radius:50%; background:var(--green)}
.program-card .link-arrow{margin-top:auto; padding-top:1.9rem; align-self:flex-start; border-bottom:0}
.bg-carbon .program-card,.bg-ink .program-card{background:linear-gradient(160deg,rgba(255,255,255,.095) 0%,rgba(255,255,255,.035) 100%); border-color:rgba(255,255,255,.2)}
.bg-carbon .program-card li,.bg-ink .program-card li{color:#A7B7C7}
.bg-carbon .program-card li::before,.bg-ink .program-card li::before{background:var(--gold-lite)}
.bg-carbon .program-card__for,.bg-ink .program-card__for{color:var(--gold-lite)}

/* ---------- 11. STEPS / CRITÉRIOS ---------- */
.steps{counter-reset:s; display:grid; gap:.5rem}
.step{
  counter-increment:s; position:relative; display:grid; grid-template-columns:74px 1fr;
  gap:clamp(1rem,.5rem+2vw,2.5rem); align-items:start;
  padding:calc(var(--gutter) * .8) var(--gutter);
  background:linear-gradient(168deg,#FFFFFF 0%,#F4F7FA 100%);
  border:1px solid var(--line-strong); border-left:2px solid var(--gold);
  border-radius:0 var(--radius-lg) var(--radius-lg) 0;
  box-shadow:0 1px 2px rgba(16,25,43,.035), 0 10px 24px rgba(16,25,43,.045);
  transition:transform .35s var(--ease), box-shadow .35s var(--ease);
}
.step:hover{transform:translateX(3px); box-shadow:var(--shadow-1)}
.step::before{content:"0" counter(s); font-family:var(--serif); font-size:1.6rem; color:var(--gold); line-height:1}
.step h3{margin-bottom:.5rem}
.step p{color:var(--muted); font-size:.9375rem; max-width:64ch}
.bg-carbon .step,.bg-ink .step{
  background:linear-gradient(160deg,rgba(255,255,255,.09) 0%,rgba(255,255,255,.03) 100%); border-color:rgba(255,255,255,.18);
  border-left-color:var(--gold-lite); box-shadow:none;
}
.bg-carbon .step p,.bg-ink .step p{color:#A7B7C7}
.bg-carbon .step::before,.bg-ink .step::before{color:var(--gold-lite)}

.criteria{display:grid; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--radius-lg); overflow:hidden}
.criteria__row{background:linear-gradient(160deg,#FFFFFF 0%,#F1F5F9 100%); padding:calc(var(--gutter) * .8) var(--gutter); display:grid; grid-template-columns:auto 1fr; gap:1.25rem; align-items:start}
.criteria__dot{width:10px; height:10px; border-radius:50%; border:2px solid var(--gold); margin-top:.55rem; flex:none}
.criteria__row strong{display:block; font-size:.9375rem; font-weight:600}
.criteria__row span{display:block; font-size:.875rem; color:var(--muted); margin-top:.3rem}
.bg-mist .criteria__row{background:#fff}
.bg-carbon .criteria,.bg-ink .criteria{background:var(--carbon-line); border-color:var(--carbon-line)}
.bg-carbon .criteria__row,.bg-ink .criteria__row{background:linear-gradient(160deg,rgba(255,255,255,.085) 0%,rgba(255,255,255,.03) 100%)}
.bg-carbon .criteria__row strong,.bg-ink .criteria__row strong{color:#fff}
.bg-carbon .criteria__row span,.bg-ink .criteria__row span{color:#A7B7C7}

/* ---------- 12. FAQ ---------- */
.faq{border-top:1px solid var(--line)}
.faq__item{border-bottom:1px solid var(--line)}
.faq__q{
  width:100%; background:none; border:0; text-align:left; padding:1.45rem 3rem 1.45rem 0;
  font-size:1.0625rem; font-weight:500; color:var(--ink); position:relative; line-height:1.45;
}
.faq__q::after{
  content:""; position:absolute; right:.5rem; top:1.9rem; width:11px; height:11px;
  border-right:1px solid var(--gold); border-bottom:1px solid var(--gold);
  transform:rotate(45deg); transition:transform .35s var(--ease);
}
.faq__item[data-open="true"] .faq__q::after{transform:rotate(225deg)}
.faq__a{display:grid; grid-template-rows:0fr; transition:grid-template-rows .4s var(--ease)}
.faq__item[data-open="true"] .faq__a{grid-template-rows:1fr}
.faq__a>div{overflow:hidden}
.faq__a p{color:var(--muted); font-size:.9688rem; padding-bottom:1.6rem; max-width:72ch}
.faq-filter{display:flex; flex-wrap:wrap; gap:.5rem; margin-bottom:2.5rem}
.faq-filter button{
  padding:.55rem 1.15rem; border:1px solid var(--line-strong); background:transparent;
  border-radius:100px; font-size:.8125rem; color:var(--muted); transition:all .3s var(--ease);
}
.faq-filter button:hover{border-color:var(--ink); color:var(--ink)}
.faq-filter button[aria-pressed="true"]{background:var(--ink); border-color:var(--ink); color:#fff}

/* ---------- 13. CITAÇÕES ---------- */
.quote{
  position:relative; background:linear-gradient(160deg,#FFFFFF 0%,#EDF2F8 55%,#E4EBF3 100%);
  border:1px solid #C4D2DF; border-top:3px solid var(--gold);
  border-radius:var(--radius-lg);
  box-shadow:0 1px 2px rgba(16,25,43,.04), 0 14px 32px rgba(16,25,43,.055);
  padding:var(--gutter); display:flex; flex-direction:column;
}
.quote::before{
  content:"\201C"; position:absolute; top:.4rem; right:1.2rem; font-family:var(--serif);
  font-size:5rem; line-height:1; color:var(--gold); opacity:.16;
}
.quote blockquote{margin:0; font-family:var(--serif); font-size:1.12rem; line-height:1.55; color:var(--ink)}
.quote figcaption{margin-top:auto; padding-top:1.75rem; font-size:.8125rem; color:var(--ink-400)}
.quote figcaption strong{display:block; color:var(--ink); font-size:.9375rem; font-weight:600; margin-bottom:.15rem}

/* ---------- 14. FIGURAS ---------- */
.figure{position:relative; border-radius:var(--radius-lg); overflow:hidden; background:var(--carbon)}
.figure img{width:100%; height:100%; object-fit:cover}
.figure--portrait{aspect-ratio:4/5}
.figure--wide{aspect-ratio:16/10}
.figure--square{aspect-ratio:1/1}
.figure--tall{aspect-ratio:3/4}
.figure__caption{font-size:.8125rem; color:var(--ink-400); margin-top:.85rem}
/* moldura dourada deslocada — contida na própria caixa, sem invadir a coluna vizinha */
.framed{position:relative; padding:0 20px 20px 0}
.framed::before{
  content:""; position:absolute; inset:20px 0 0 20px;
  border:1px solid rgba(176,141,87,.5); border-radius:var(--radius-lg); z-index:0;
}
.framed>.figure,.framed>figure{position:relative; z-index:1; box-shadow:var(--shadow-photo)}
@media (max-width:920px){ .framed{padding:0 14px 14px 0} .framed::before{inset:14px 0 0 14px} }
.media-placeholder{
  display:grid; place-content:center; text-align:center; gap:.5rem; padding:2rem; height:100%;
  background:repeating-linear-gradient(135deg,var(--mist) 0 10px,var(--mist-2) 10px 20px);
  color:var(--ink-400); font-size:var(--fs-small);
}
.media-placeholder b{display:block; font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--gold)}

/* ---------- 15. STATS ---------- */
.stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:1px;
  background:var(--line-strong); border:1px solid var(--line-strong);
  border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:0 1px 2px rgba(16,25,43,.04), 0 12px 28px rgba(16,25,43,.05);
}
.stats>div{background:linear-gradient(160deg,#FFFFFF 0%,#EDF2F8 100%); padding:calc(var(--gutter) * .82) var(--gutter)}
.bg-mist .stats>div{background:linear-gradient(160deg,#FFFFFF 0%,#EDF2F8 100%)}
.stats dt{font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase; color:var(--gold)}
.stats dd{margin:.5rem 0 0; font-family:var(--serif); font-size:1.6rem; font-weight:400; letter-spacing:-.02em; line-height:1.2}
.bg-carbon .stats,.bg-ink .stats{background:var(--carbon-line)}
.bg-carbon .stats>div,.bg-ink .stats>div{background:transparent}
.bg-carbon .stats dd,.bg-ink .stats dd{color:#fff}

/* ---------- 15b. FAIXA DE LOGOS (hospitais) ---------- */
.logos{margin-top:3rem; border-top:1px solid var(--line); padding-top:1.75rem}
.logos__label{
  font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); margin-bottom:1.5rem;
}
.logos ul{display:flex; flex-wrap:wrap; align-items:center; gap:clamp(2rem,1rem+3vw,3.5rem)}
.logos img{
  height:46px; width:auto; opacity:.62; filter:grayscale(1);
  transition:opacity .4s var(--ease);
}
.logos img:hover{opacity:1}
.logos--inline{margin-top:2rem; padding-top:1.5rem}
.logos--inline img{height:38px}
.bg-carbon .logos,.bg-ink .logos{border-color:var(--carbon-line)}
.bg-carbon .logos img,.bg-ink .logos img{filter:grayscale(1) invert(1) brightness(1.6); opacity:.7}
@media (max-width:640px){ .logos ul{gap:2rem} .logos img{height:38px} }

/* ---------- 16. FOOTER ---------- */
.footer{position:relative; background:var(--ink); color:#A7B7C7; padding-block:clamp(3.5rem,2.5rem+4vw,6rem) 2.5rem}
.footer::before{content:""; position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.6}
.footer a{color:#A7B7C7; transition:color .25s}
.footer a:hover{color:#fff}
.footer__grid{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:clamp(2rem,1rem+3vw,4rem)}
.footer h4{font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--gold-lite); margin:0 0 1.25rem; font-weight:600}
.footer li+li{margin-top:.6rem}
.footer li{font-size:.9375rem}
.footer__brand img{width:220px; height:auto; opacity:.95}
.footer__brand p{font-size:.9375rem; margin-top:1.4rem; max-width:36ch}
.footer__reg{font-size:.8125rem !important; color:#7B8FA4; letter-spacing:.04em; margin-top:.9rem !important}
.footer__bottom{
  margin-top:clamp(2.5rem,2rem+2vw,4rem); padding-top:2rem; border-top:1px solid rgba(255,255,255,.12);
  display:flex; flex-wrap:wrap; gap:1rem 2rem; justify-content:space-between; font-size:.8125rem; color:#7B8FA4;
}
.footer__legal{max-width:82ch; font-size:.75rem; line-height:1.65; color:#68809A; margin-top:1.5rem}

/* ---------- 17. CTA ---------- */
.fab{
  position:fixed; right:clamp(1rem,3vw,2rem); bottom:clamp(1rem,3vw,2rem); z-index:90;
  display:inline-flex; align-items:center; gap:.6rem; padding:.9rem 1.4rem;
  background:var(--ink); color:#fff; border-radius:100px; box-shadow:var(--shadow-2);
  font-size:.875rem; font-weight:500; border:1px solid rgba(176,141,87,.4);
  transition:transform .35s var(--ease), background .35s var(--ease);
}
.fab:hover{transform:translateY(-2px); background:var(--ink-800)}
.fab svg{width:18px; height:18px; flex:none}

.cta-band{position:relative; background:var(--ink); color:#fff; text-align:center; overflow:hidden}
.cta-band::before{content:""; position:absolute; inset:0 0 auto; height:1px; background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.55}
.cta-band__mark{position:absolute; left:50%; top:50%; transform:translate(-50%,-50%); width:min(560px,70vw); opacity:.05; pointer-events:none}
.cta-band .wrap{position:relative}
.cta-band h2{color:#fff; max-width:22ch; margin-inline:auto}
.cta-band p{color:#A7B7C7; max-width:54ch; margin:1.25rem auto 0}
.cta-band .eyebrow{color:#8FA5B8}
.cta-band .eyebrow::before{background:var(--gold-lite)}

/* ---------- 18. ARTIGOS ---------- */
.article{display:grid; grid-template-columns:minmax(0,1fr) 264px; gap:clamp(2rem,1rem+4vw,5rem); align-items:start}
.toc{position:sticky; top:112px; border-left:1px solid var(--line); padding-left:1.5rem}
.toc p{font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase; color:var(--gold); margin-bottom:1rem}
.toc a{display:block; font-size:.875rem; color:var(--muted); padding:.35rem 0; transition:color .25s}
.toc a:hover,.toc a.is-active{color:var(--ink)}
.article__body h2{margin-top:3.5rem; scroll-margin-top:112px}
.article__body h2:first-child{margin-top:0}
.article__body h3{margin-top:2.25rem}
.article__body p{margin-top:1.1rem; color:var(--muted)}
.article__body ul{margin-top:1.1rem; display:grid; gap:.65rem}
.article__body ul li{position:relative; padding-left:1.4rem; color:var(--muted)}
.article__body ul li::before{content:""; position:absolute; left:0; top:.72em; width:7px; height:1px; background:var(--gold)}

.callout{
  border-left:3px solid var(--gold);
  background:linear-gradient(160deg,#F7FAFC 0%,#E9EFF6 100%);
  border:1px solid #CFDAE4; border-left:3px solid var(--gold);
  padding:calc(var(--gutter) * .8) var(--gutter);
  border-radius:0 var(--radius-lg) var(--radius-lg) 0; margin-top:2.25rem;
}
.callout strong{display:block; font-size:.8125rem; letter-spacing:.16em; text-transform:uppercase; color:var(--gold); margin-bottom:.6rem}
.callout p{margin-top:0; font-size:.9375rem}
.evidence{font-size:.8125rem; color:var(--ink-400); border-top:1px solid var(--line); padding-top:1rem; margin-top:2.5rem}

/* ---------- 19. BLOG ---------- */
.post-card{display:flex; flex-direction:column; border-top:1px solid var(--line); padding-top:1.5rem}
.post-card:hover h3{color:var(--gold)}
.post-card__meta{display:flex; gap:1rem; font-size:var(--fs-micro); letter-spacing:.14em; text-transform:uppercase; color:var(--gold)}
.post-card h3{margin-top:.9rem; transition:color .3s}
.post-card p{font-size:.9375rem; color:var(--muted); margin-top:.6rem}
.post-card .link-arrow{margin-top:1.5rem; align-self:flex-start; border-bottom:0}

/* ---------- 20. FORMULÁRIO ---------- */
.field{display:grid; gap:.5rem}
.field label{font-size:.8125rem; font-weight:500; letter-spacing:.02em}
.field input,.field select,.field textarea{
  width:100%; padding:.9rem 1rem; border:1px solid var(--line-strong); border-radius:var(--radius);
  background:#fff; font:inherit; font-size:.9375rem; color:var(--ink); transition:border-color .25s;
}
.field input:focus,.field select:focus,.field textarea:focus{outline:0; border-color:var(--gold)}
.field small{font-size:.75rem; color:var(--ink-400)}

/* ---------- 21. ANIMAÇÃO ---------- */
[data-reveal]{opacity:0; transform:translateY(20px); transition:opacity .9s var(--ease), transform .9s var(--ease)}
[data-reveal].is-in{opacity:1; transform:none}
[data-reveal-delay="1"]{transition-delay:.08s}
[data-reveal-delay="2"]{transition-delay:.16s}
[data-reveal-delay="3"]{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01ms !important; transition-duration:.01ms !important; scroll-behavior:auto !important}
  [data-reveal]{opacity:1; transform:none}
}

/* ---------- 22. ACESSIBILIDADE ---------- */
:focus-visible{outline:2px solid var(--gold); outline-offset:3px; border-radius:2px}
.skip{position:absolute; left:-9999px; top:0; background:var(--ink); color:#fff; padding:.75rem 1.25rem; z-index:200}
.skip:focus{left:1rem; top:1rem}
.sr-only{position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0}

/* ---------- 23. RESPONSIVO ---------- */
@media (max-width:1100px){
  .g-4{grid-template-columns:repeat(2,1fr)}
  .stats{grid-template-columns:repeat(2,1fr)}
  .footer__grid{grid-template-columns:1fr 1fr}
  .article{grid-template-columns:1fr}
  .toc{position:static; border-left:0; border-top:1px solid var(--line); padding:1.5rem 0 0; order:-1}
  .toc a{display:inline-block; margin-right:1.25rem}
}
@media (max-width:920px){
  .nav{display:none}
  .header .btn{display:none}
  .burger{display:block}
  .g-3{grid-template-columns:1fr}
  .split,.split--wide-left,.hero__grid{grid-template-columns:1fr}
  .hero__grid{padding-block:clamp(3rem,2rem+4vw,4rem)}
  .hero__photo{max-width:460px; margin-inline:auto; margin-top:2.5rem}
  .split .figure,.split .framed{order:-1}
  .band__veil,.band--left .band__veil{background:linear-gradient(180deg,rgba(16,25,43,.90) 0%,rgba(16,25,43,.85) 60%,rgba(16,25,43,.72) 100%)}
  .band__img{object-position:75% center}
  .band--left .band__img{object-position:25% center}
  .hero__mark{width:520px; opacity:.05}
}
@media (max-width:640px){
  .g-2,.g-4{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr}
  .footer__grid{grid-template-columns:1fr}
  .hero__meta{gap:1.5rem}
  .step{grid-template-columns:1fr}
  .step::before{font-size:1.15rem}
  .btn{width:100%}
  .btn-row{flex-direction:column}
  .fab span{display:none}
  .fab{padding:1rem}
  .pagehero__mark{display:none}
  .brand__sub{display:none}
}

/* ---------- 24. IMPRESSÃO ---------- */
@media print{
  .header,.footer,.fab,.mobile-nav,.cta-band,.grain{display:none}
  body{color:#000; font-size:11pt}
  .hero,.bg-ink,.bg-carbon{background:#fff !important; color:#000 !important}
}

/* ═══════════════════════════════════════════════════════════
   DIREÇÃO DE ARTE — HOME
   Composições editoriais. Cada dobra com identidade própria.
   ═══════════════════════════════════════════════════════════ */

/* ---------- HERO DE CAMPANHA ---------- */
.hero{min-height:min(92vh,900px); display:grid; align-items:center}
.hero__grid{
  grid-template-columns:1.02fr .98fr;
  gap:clamp(2rem,1rem+4vw,6rem);
  padding-block:clamp(5rem,3rem+8vw,9rem);
}
.hero .display{
  font-size:clamp(2.9rem,1.4rem + 5.6vw,6.4rem);
  line-height:.98; letter-spacing:-.035em; margin-top:2rem;
}
.hero__lead{
  font-size:clamp(1.1rem,1rem + .65vw,1.45rem); line-height:1.55;
  color:#C2D0DC; margin-top:2.25rem; max-width:38ch; font-weight:300;
}
.hero__note{
  font-size:.8125rem; letter-spacing:.03em; line-height:1.6; color:#7B93A9;
  margin-top:2.25rem; padding-top:1.5rem; max-width:42ch;
  border-top:1px solid rgba(255,255,255,.12);
}
.hero .btn-row{margin-top:3rem}
.hero__meta{gap:clamp(2rem,1rem+3vw,4rem); margin-top:4rem; padding-top:2.25rem}
.hero__meta div strong{font-size:1.15rem}
.hero__bg{opacity:.34}
.hero__photo::before{border-color:rgba(176,141,87,.42)}
.hero__photo img{box-shadow:0 40px 110px rgba(0,0,0,.42)}
@media (max-width:920px){ .hero{min-height:0} .hero .display{font-size:clamp(2.6rem,2rem+4vw,3.6rem)} }

/* ---------- PRINCÍPIOS: lista editorial, sem caixas ---------- */
.principios{display:grid; grid-template-columns:repeat(2,1fr); gap:0}
.principio{
  position:relative; padding:clamp(2.5rem,2rem+2vw,4rem) clamp(2rem,1.5rem+2vw,4rem)
           clamp(2.5rem,2rem+2vw,4rem) 0;
  border-top:1px solid var(--line);
}
.principio:nth-child(odd){padding-right:clamp(3rem,2rem+3vw,6rem)}
.principio:nth-child(even){padding-left:clamp(2rem,1.5rem+2vw,4rem); border-left:1px solid var(--line)}
.principio__n{
  font-family:var(--serif); font-size:clamp(3.5rem,2.5rem+3vw,5.5rem); line-height:.82;
  color:transparent; -webkit-text-stroke:1px var(--gold); display:block; margin-bottom:1.5rem;
  transition:color .6s var(--ease);
}
.principio:hover .principio__n{color:rgba(176,141,87,.10)}
.principio h3{font-family:var(--serif); font-weight:400; font-size:clamp(1.35rem,1.1rem+.8vw,1.85rem); letter-spacing:-.02em}
.principio p{margin-top:1rem; color:var(--muted); font-size:1rem; line-height:1.7; max-width:46ch}
@media (max-width:820px){
  .principios{grid-template-columns:1fr}
  .principio,.principio:nth-child(odd),.principio:nth-child(even){padding:2.5rem 0; border-left:0}
}

/* ---------- ÍNDICE TIPOGRÁFICO (condições) ---------- */
.indice{border-top:1px solid var(--line)}
.indice__item{
  display:grid; grid-template-columns:auto 1fr auto; align-items:baseline;
  gap:clamp(1.25rem,1rem+2vw,3rem); padding:clamp(1.6rem,1.2rem+1.2vw,2.4rem) 0;
  border-bottom:1px solid var(--line); transition:padding-left .5s var(--ease);
}
.indice__item:hover{padding-left:1.25rem}
.indice__tag{
  font-size:var(--fs-micro); letter-spacing:.18em; text-transform:uppercase;
  color:var(--gold); min-width:9.5rem;
}
.indice__nome{
  font-family:var(--serif); font-weight:400; letter-spacing:-.022em; line-height:1.1;
  font-size:clamp(1.6rem,1.1rem+1.9vw,2.9rem); color:var(--ink);
  transition:color .4s var(--ease);
}
.indice__item:hover .indice__nome{color:var(--gold)}
.indice__desc{display:block; font-family:var(--sans); font-size:.9375rem; color:var(--muted); margin-top:.6rem; max-width:52ch; line-height:1.6}
.indice__seta{font-size:1.35rem; color:var(--line-strong); transition:transform .45s var(--ease), color .45s var(--ease)}
.indice__item:hover .indice__seta{transform:translateX(8px); color:var(--gold)}
@media (max-width:760px){
  .indice__item{grid-template-columns:1fr; gap:.5rem}
  .indice__seta{display:none}
}

/* ---------- LINHA DO TEMPO DA JORNADA (Alteração 4) ---------- */
.timeline{position:relative; margin-top:clamp(3rem,2rem+3vw,5rem)}
.timeline::before{
  content:""; position:absolute; left:0; right:0; top:23px; height:1px;
  background:linear-gradient(90deg,rgba(176,141,87,0),var(--gold) 8%,var(--gold) 92%,rgba(176,141,87,0));
}
.timeline__track{display:grid; grid-template-columns:repeat(7,1fr); gap:clamp(.75rem,.5rem+1vw,1.75rem)}
.etapa{position:relative; padding-top:0}
.etapa__no{
  width:46px; height:46px; border-radius:50%; display:grid; place-items:center;
  background:var(--paper); border:1px solid var(--gold); color:var(--ink);
  font-family:var(--serif); font-size:1rem; position:relative; z-index:1;
  transition:background .45s var(--ease), color .45s var(--ease), transform .45s var(--ease);
}
.etapa:hover .etapa__no{background:var(--gold); color:#fff; transform:scale(1.08)}
.etapa--final .etapa__no{background:var(--ink); border-color:var(--ink); color:#fff}
.etapa h3{
  font-family:var(--serif); font-weight:400; font-size:clamp(1.05rem,.95rem+.4vw,1.35rem);
  letter-spacing:-.015em; margin-top:1.75rem; line-height:1.15;
}
.etapa p{font-size:.9063rem; line-height:1.62; color:var(--muted); margin-top:.85rem}
.etapa__marco{
  display:block; font-size:var(--fs-micro); letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold); margin-top:1.1rem;
}
.bg-carbon .etapa__no,.bg-ink .etapa__no{background:var(--ink); color:#fff; border-color:var(--gold-lite)}
.bg-carbon .etapa p,.bg-ink .etapa p{color:#A7B7C7}
@media (max-width:1100px){
  .timeline__track{grid-template-columns:repeat(4,1fr); gap:2.5rem 1.5rem}
  .timeline::before{display:none}
}
@media (max-width:700px){
  .timeline__track{grid-template-columns:1fr; gap:0}
  .etapa{display:grid; grid-template-columns:46px 1fr; gap:1.5rem; padding:1.75rem 0; border-top:1px solid var(--line)}
  .etapa h3{margin-top:0}
}

/* ---------- CITAÇÃO EDITORIAL DE ABERTURA ---------- */
.abertura{max-width:34ch}
.abertura__frase{
  font-family:var(--serif); font-weight:400; letter-spacing:-.028em; line-height:1.04;
  font-size:clamp(2.1rem,1.4rem+2.8vw,3.6rem); color:var(--ink);
}
.bg-carbon .abertura__frase,.bg-ink .abertura__frase{color:#fff}

/* ---------- BOTÕES PREMIUM ---------- */
.btn{padding:1.15rem 2.2rem; font-size:.9375rem; letter-spacing:.02em; position:relative; overflow:hidden}
.btn--gold,.btn--primary,.btn--light{box-shadow:0 2px 10px rgba(16,25,43,.14)}
.btn--gold:hover{box-shadow:0 8px 26px rgba(176,141,87,.34)}
.btn--primary:hover{box-shadow:0 8px 26px rgba(16,25,43,.26)}
.btn--outline-light{backdrop-filter:blur(6px); background:rgba(255,255,255,.04)}
.header .btn{padding:.8rem 1.5rem}

/* ---------- RESPIRO ---------- */
.section{padding-block:clamp(6rem,4rem+7.5vw,12rem)}

/* ═══════════════════════════════════════════════════════════
   HOME v2 — direção de arte segundo mockup de referência
   ═══════════════════════════════════════════════════════════ */

/* ---------- HERO: título com segunda linha em itálico dourado ---------- */
.hero .display em{
  font-style:italic; color:var(--gold-lite); display:block;
  font-weight:300; letter-spacing:-.03em;
}
.hero__lead{font-size:1.0625rem; color:#A9BAC8; max-width:30ch; font-weight:300; margin-top:2.5rem}
/* CTA em versalete com filete — substitui o botão sólido */
.cta-line{
  display:inline-flex; align-items:center; gap:1.1rem; margin-top:2.75rem;
  font-size:.8125rem; font-weight:500; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-lite); padding-bottom:.9rem; border-bottom:1px solid rgba(201,169,122,.42);
  transition:gap .45s var(--ease), border-color .45s var(--ease), color .45s var(--ease);
}
.cta-line::after{content:"\2192"; font-size:1.05rem; letter-spacing:0}
.cta-line:hover{gap:1.75rem; border-color:var(--gold-lite); color:#fff}
.hero__kicker{
  position:absolute; right:0; bottom:clamp(2rem,4vw,4rem); text-align:right;
  font-size:.6875rem; letter-spacing:.24em; text-transform:uppercase; color:#7B93A9; line-height:1.9;
}
@media (max-width:920px){ .hero__kicker{display:none} }

/* ---------- FAIXA DE CREDIBILIDADE ---------- */
.trustbar{background:var(--ink-900); border-top:1px solid rgba(255,255,255,.08)}
.trustbar__grid{display:grid; grid-template-columns:repeat(4,1fr); gap:0}
.trustbar__item{
  padding:clamp(1.75rem,1.2rem+1.5vw,2.5rem) clamp(1.25rem,1rem+1.5vw,2.5rem);
  border-left:1px solid rgba(255,255,255,.08); display:flex; gap:1rem; align-items:flex-start;
}
.trustbar__item:first-child{border-left:0; padding-left:0}
.trustbar__mark{width:22px; height:22px; flex:none; margin-top:2px; opacity:.75}
.trustbar__item strong{display:block; font-size:.9063rem; font-weight:500; color:#E4EBF2; line-height:1.45}
.trustbar__item span{display:block; font-size:.8125rem; color:#7E96AC; line-height:1.5; margin-top:.2rem}
@media (max-width:900px){
  .trustbar__grid{grid-template-columns:repeat(2,1fr)}
  .trustbar__item{border-top:1px solid rgba(255,255,255,.08)}
  .trustbar__item:nth-child(odd){border-left:0; padding-left:0}
}
@media (max-width:560px){ .trustbar__grid{grid-template-columns:1fr} .trustbar__item{border-left:0; padding-left:0} }

/* ---------- BLOCO DIVIDIDO COM FOTO SANGRANDO ---------- */
.duo{display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:clamp(440px,46vw,660px)}
.duo__img{position:relative; overflow:hidden}
.duo__img img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
.duo__txt{
  display:flex; flex-direction:column; justify-content:center;
  padding:clamp(3rem,2rem+5vw,7rem) clamp(2rem,1.5rem+4vw,6rem);
  background:var(--mist);
}
.duo--dark .duo__txt{background:var(--ink); color:#DCE5EE}
.duo--dark .duo__txt h2{color:#fff}
.duo--dark .duo__txt p{color:#A7B7C7}
.duo__txt h2{
  font-size:clamp(1.9rem,1.3rem+2.3vw,3.1rem); line-height:1.08; letter-spacing:-.028em; margin-top:1.5rem;
}
.duo__txt p{margin-top:1.5rem; color:var(--muted); font-size:1.0313rem; line-height:1.72; max-width:44ch}
.duo__txt .link-arrow{margin-top:2.25rem; align-self:flex-start}
@media (max-width:900px){ .duo{grid-template-columns:1fr} .duo__img{min-height:340px} }

/* ---------- NÚMEROS EDITORIAIS ---------- */
.numeros{display:grid; grid-template-columns:1fr auto; align-items:stretch; background:var(--mist-2)}
.numeros__grid{
  display:grid; grid-template-columns:repeat(4,1fr);
  padding:clamp(3rem,2rem+3vw,5rem) 0 clamp(3rem,2rem+3vw,5rem) 0;
}
.numeros__item{padding:0 clamp(1.25rem,1rem+2vw,3rem); border-left:1px solid var(--line-strong); text-align:center}
.numeros__item:first-child{border-left:0}
.numeros__n{
  font-family:var(--serif); font-weight:400; letter-spacing:-.03em; line-height:1;
  font-size:clamp(2.4rem,1.6rem+2.6vw,3.9rem); color:var(--ink); display:block;
}
.numeros__item span{display:block; font-size:.8438rem; color:var(--muted); line-height:1.5; margin-top:.9rem}
.numeros__foto{width:clamp(240px,26vw,420px); position:relative; overflow:hidden}
.numeros__foto img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover}
@media (max-width:1000px){ .numeros{grid-template-columns:1fr} .numeros__foto{height:260px; width:auto} }
@media (max-width:620px){
  .numeros__grid{grid-template-columns:repeat(2,1fr); gap:2.5rem 0}
  .numeros__item:nth-child(odd){border-left:0}
}

/* ---------- CARTÕES DE MÉTODO COM FOTOGRAFIA ---------- */
.metodos{display:grid; grid-template-columns:.92fr 2.08fr; gap:clamp(2rem,1.5rem+3vw,5rem); align-items:start}
.metodos__cards{display:grid; grid-template-columns:repeat(4,1fr); gap:clamp(.85rem,.5rem+1vw,1.5rem)}
.metodo{
  position:relative; display:block; overflow:hidden; border-radius:2px;
  background:var(--ink-900); border:1px solid rgba(255,255,255,.10);
  transition:border-color .5s var(--ease), transform .5s var(--ease);
}
.metodo:hover{border-color:rgba(201,169,122,.5); transform:translateY(-5px)}
.metodo__img{position:relative; aspect-ratio:4/5; overflow:hidden}
.metodo__img img{
  width:100%; height:100%; object-fit:cover;
  transition:transform 1.1s var(--ease); filter:saturate(.82) contrast(1.05);
}
.metodo:hover .metodo__img img{transform:scale(1.05)}
.metodo__img::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(180deg,rgba(16,25,43,.15) 0%,rgba(16,25,43,.55) 55%,rgba(16,25,43,.92) 100%);
}
.metodo__body{padding:1.4rem 1.4rem 1.6rem; position:relative}
.metodo__body h3{
  font-family:var(--serif); font-weight:400; font-size:1.1rem; letter-spacing:-.015em; color:#fff; line-height:1.25;
}
.metodo__sub{display:block; font-size:.6875rem; letter-spacing:.14em; text-transform:uppercase; color:var(--gold-lite); margin-top:.5rem}
.metodo__desc{font-size:.8125rem; color:#8FA5B8; line-height:1.55; margin-top:.85rem}
.metodo__seta{display:block; margin-top:1.25rem; color:var(--gold-lite); font-size:1.05rem; transition:transform .5s var(--ease)}
.metodo:hover .metodo__seta{transform:translateX(7px)}
@media (max-width:1100px){ .metodos{grid-template-columns:1fr} .metodos__cards{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){ .metodos__cards{grid-template-columns:1fr} .metodo__img{aspect-ratio:16/10} }

/* ---------- FECHO: citação + convite ---------- */
.fecho{display:grid; grid-template-columns:1.15fr .85fr; gap:clamp(1.5rem,1rem+2vw,3rem); align-items:stretch}
.fecho__quote{
  padding:clamp(2.25rem,1.5rem+2.5vw,3.5rem);
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.03);
  display:flex; flex-direction:column; justify-content:center;
}
.fecho__quote span{font-family:var(--serif); font-size:2.6rem; color:var(--gold); line-height:.6; display:block; margin-bottom:1rem}
.fecho__quote p{
  font-family:var(--serif); font-size:clamp(1.25rem,1rem+.9vw,1.7rem); line-height:1.35; color:#fff; letter-spacing:-.015em;
}
.fecho__quote em{font-style:italic; color:var(--gold-lite)}
.fecho__cta{
  padding:clamp(2.25rem,1.5rem+2.5vw,3.5rem); text-align:center;
  border:1px solid rgba(255,255,255,.12); background:rgba(255,255,255,.03);
  display:flex; flex-direction:column; justify-content:center; align-items:center;
}
.fecho__cta p{font-family:var(--serif); font-size:clamp(1.2rem,1rem+.7vw,1.5rem); line-height:1.35; color:#fff; max-width:20ch}
@media (max-width:820px){ .fecho{grid-template-columns:1fr} }

/* ═══════════════════════════════════════════════════════════
   CENAS — fotografia em tela cheia com tipografia sobreposta
   ═══════════════════════════════════════════════════════════ */
.cena{position:relative; isolation:isolate; overflow:hidden; display:grid; align-items:center;
      min-height:clamp(520px,66vh,780px)}
.cena__img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2}
.cena::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:linear-gradient(100deg,rgba(10,16,28,.93) 0%,rgba(10,16,28,.80) 38%,rgba(10,16,28,.32) 78%,rgba(10,16,28,.18) 100%);
}
.cena--direita::after{
  background:linear-gradient(260deg,rgba(10,16,28,.93) 0%,rgba(10,16,28,.80) 38%,rgba(10,16,28,.32) 78%,rgba(10,16,28,.18) 100%);
}
.cena--centro::after{
  background:linear-gradient(180deg,rgba(10,16,28,.72) 0%,rgba(10,16,28,.86) 55%,rgba(10,16,28,.94) 100%);
}
.cena::before{content:""; position:absolute; inset:auto 0 0; height:1px; z-index:1;
  background:linear-gradient(90deg,transparent,var(--gold),transparent); opacity:.5}
.cena__inner{position:relative; padding-block:clamp(4rem,3rem+5vw,7rem); max-width:52ch; color:#fff}
.cena--direita .cena__inner{margin-left:auto; text-align:right}
.cena--direita .cena__inner .eyebrow{justify-content:flex-end}
.cena--direita .cena__inner .eyebrow::before{order:2}
.cena--centro .cena__inner{margin-inline:auto; text-align:center; max-width:44ch}
.cena--centro .eyebrow{justify-content:center}
.cena h2{
  color:#fff; font-size:clamp(2.1rem,1.4rem+2.9vw,4rem); line-height:1.02;
  letter-spacing:-.03em; margin-top:1.75rem;
}
.cena h2 em{font-style:italic; color:var(--gold-lite); display:block; font-weight:300}
.cena p{color:#B3C4D3; font-size:1.0625rem; line-height:1.7; margin-top:1.75rem; max-width:46ch}
.cena--direita p{margin-left:auto}
.cena--centro p{margin-inline:auto}
.cena .cta-line{margin-top:2.5rem}
@media (max-width:900px){
  .cena{min-height:0}
  .cena::after,.cena--direita::after{background:linear-gradient(180deg,rgba(10,16,28,.80) 0%,rgba(10,16,28,.90) 60%,rgba(10,16,28,.95) 100%)}
  .cena--direita .cena__inner{text-align:left; margin-left:0}
  .cena--direita .cena__inner .eyebrow{justify-content:flex-start}
  .cena--direita p{margin-left:0}
}

/* hero em tela cheia com foto sangrando — versão cena */
.hero--cena .hero__grid{grid-template-columns:1fr; padding-block:clamp(6rem,4rem+9vw,11rem)}
.hero--cena .hero__copy{max-width:24ch}
.hero--cena .hero__bg{opacity:1; filter:none}
.hero--cena::before{
  background:linear-gradient(96deg,rgba(8,13,24,.94) 0%,rgba(8,13,24,.84) 30%,rgba(8,13,24,.42) 66%,rgba(8,13,24,.20) 100%);
}
.hero--cena .display{font-size:clamp(2.7rem,1.2rem + 5.4vw,6rem)}
.hero--cena .hero__lead{max-width:34ch; color:#B3C4D3}
@media (max-width:900px){
  .hero--cena .hero__copy{max-width:none}
  .hero--cena::before{background:linear-gradient(180deg,rgba(8,13,24,.86) 0%,rgba(8,13,24,.90) 55%,rgba(8,13,24,.95) 100%)}
}


/* ---------- ALTERAÇÃO FINAL: presença dos métodos ---------- */
.metodos{grid-template-columns:.82fr 2.18fr; gap:clamp(2.5rem,1.5rem+3.5vw,6rem)}
.metodos__cards{gap:clamp(1.1rem,.7rem+1.4vw,2.1rem)}
.metodo__img{aspect-ratio:3/4}
.metodo__img::after{
  background:linear-gradient(180deg,rgba(16,25,43,.10) 0%,rgba(16,25,43,.42) 48%,rgba(16,25,43,.94) 100%);
}
.metodo__body{padding:1.9rem 1.7rem 2.1rem}
.metodo__body h3{font-size:clamp(1.2rem,1rem + .55vw,1.5rem); line-height:1.18}
.metodo__sub{font-size:.6875rem; letter-spacing:.18em; margin-top:.7rem}
.metodo__desc{margin-top:1.1rem; line-height:1.6}
.metodo__seta{margin-top:1.6rem; font-size:1.15rem}
.metodo{border-color:rgba(255,255,255,.13)}
.metodo::before{
  content:""; position:absolute; inset:0 0 auto; height:2px; z-index:2;
  background:linear-gradient(90deg,var(--gold),rgba(176,141,87,0)); opacity:0;
  transition:opacity .5s var(--ease);
}
.metodo:hover::before{opacity:1}
@media (max-width:600px){ .metodo__img{aspect-ratio:4/5} }

/* ═══════════════════════════════════════════════════════════
   AJUSTES PONTUAIS — legibilidade, respiro e proporção
   ═══════════════════════════════════════════════════════════ */

/* corpo de texto maior em todo o site */
:root{ --fs-body: 1.125rem; --fs-lead: clamp(1.15rem, 1.05rem + .5vw, 1.4rem); }
.prose p{color:#3F4E5C; font-size:1.0938rem; line-height:1.78}
.lead{color:#4A5A69}
p{font-size:1.0625rem}

/* 1 — HERO: texto respira mais */
.hero--cena .hero__copy{max-width:34ch}
.hero--cena .display{font-size:clamp(2.8rem,1.3rem + 5.8vw,6.6rem); line-height:.96}
.hero--cena .hero__lead{max-width:42ch; font-size:1.1875rem; line-height:1.6; color:#C2D0DC}
.hero--cena .hero__grid{padding-block:clamp(6.5rem,4rem+10vw,12rem)}

/* 2 — FILOSOFIA: texto com mais presença */
.duo{min-height:clamp(520px,52vw,760px)}
.duo__txt{padding:clamp(3.5rem,2.5rem+5vw,8rem) clamp(2.5rem,2rem+4vw,7rem)}
.duo__txt h2{font-size:clamp(2.1rem,1.4rem+2.6vw,3.5rem); line-height:1.05}
.duo__txt p{font-size:1.15rem; line-height:1.72; color:#41505E; max-width:38ch; margin-top:1.75rem}
.duo__txt .eyebrow{color:var(--gold)}
.duo__img img{filter:saturate(.9) contrast(1.06)}

/* 3 — NÚMEROS: deixam de parecer quadrados soltos */
.numeros{background:var(--ink); color:#fff; border-top:1px solid rgba(255,255,255,.10)}
.numeros__grid{padding-block:clamp(3.5rem,2.5rem+3vw,5.5rem); align-items:start}
.numeros__item{border-left:1px solid rgba(255,255,255,.14); text-align:left; padding-inline:clamp(1.5rem,1rem+2vw,3.25rem)}
.numeros__item:first-child{border-left:0; padding-left:0}
.numeros__n{color:var(--gold-lite); font-size:clamp(2.6rem,1.8rem+2.6vw,4.2rem)}
.numeros__item span{color:#8FA5B8; font-size:.9375rem; margin-top:1.1rem; line-height:1.55}
.numeros__foto img{filter:grayscale(.35) contrast(1.05)}

/* 4 — MÉTODOS: legenda maior e melhor diagramada */
.metodo__body{padding:2rem 1.8rem 2.2rem}
.metodo__body h3{font-size:clamp(1.3rem,1.05rem + .7vw,1.65rem)}
.metodo__sub{font-size:.75rem; letter-spacing:.16em; margin-top:.8rem}
.metodo__desc{font-size:.9375rem; color:#A3B5C6; line-height:1.6; margin-top:1.2rem; min-height:3.1em}
.metodo__seta{margin-top:1.4rem}
.metodos{grid-template-columns:.78fr 2.22fr}
.metodos h2{font-size:clamp(1.9rem,1.3rem+2.1vw,2.9rem); line-height:1.1}

/* 6 — QUEM CONDUZ: sem foto de fundo, texto legível, cards regulares */
.section--nophoto::after{display:none}
.bg-mist.section--nophoto{background:var(--mist)}
.stats{align-items:stretch}
.stats>div{display:flex; flex-direction:column; justify-content:flex-start; min-height:7.5rem}
.stats dt{color:var(--gold); font-size:.7188rem}
.stats dd{font-size:1.35rem; line-height:1.25; margin-top:.65rem; color:var(--ink)}
.criteria__row strong{font-size:1rem}
.criteria__row span{font-size:.9375rem; color:#4A5A69; line-height:1.6}

/* 7 — FAQ: pergunta e resposta com contraste real */
.faq__q{font-size:1.125rem; color:var(--ink); font-weight:500}
.faq__a p{color:#3F4E5C; font-size:1.0625rem; line-height:1.75}
.faq-filter button{font-size:.875rem; color:#4A5A69}

/* legendas e microtexto */
.evidence{font-size:.875rem; color:#5D6E7C}
.card p,.program-card li{font-size:1rem; line-height:1.65}
.indice__desc{font-size:1rem}
.principio p{font-size:1.0625rem}
.fase__body p{font-size:1.0313rem}
.etapa p{font-size:.9688rem}
.quote blockquote{font-size:1.1875rem}
.quote figcaption strong{font-size:1rem}
.trustbar__item strong{font-size:.9688rem}
.trustbar__item span{font-size:.875rem}

/* ═══════════════════════════════════════════════════════════
   CORREÇÕES DE APERTO E CONTRASTE
   ═══════════════════════════════════════════════════════════ */

/* 1 — FILOSOFIA: texto afasta-se da borda da fotografia */
.duo__txt{
  padding-left:clamp(3rem,2rem+5vw,9rem);
  padding-right:clamp(3rem,2rem+5vw,9rem);
}
@media (max-width:900px){ .duo__txt{padding-inline:clamp(2rem,1.5rem+3vw,3rem)} }

/* 2 — ÍNDICE DE CONDIÇÕES: colunas deixam de colidir */
.indice{margin-top:clamp(3.5rem,2.5rem+3vw,5.5rem)}
.indice__item{
  grid-template-columns:13rem minmax(0,1fr) 2.5rem;
  gap:clamp(2rem,1.5rem+2.5vw,4rem);
  align-items:start;
  padding-block:clamp(2rem,1.5rem+1.4vw,2.9rem);
}
.indice__tag{min-width:0; padding-top:.7rem; line-height:1.5}
.indice__nome{display:block}
.indice__seta{justify-self:end; padding-top:.5rem}
@media (max-width:900px){
  .indice__item{grid-template-columns:1fr; gap:.75rem}
  .indice__tag{padding-top:0}
  .indice__seta{display:none}
}

/* 3 — TEXTO SOBRE FOTOGRAFIA DE FUNDO: contraste garantido */
.section--photo .lead,
.section--photo .prose p,
.section--photo .section-head p{color:#3B4A58}
.bg-carbon.section--photo .lead,.bg-ink.section--photo .lead,
.cta-band.section--photo p{color:#B9C8D6}
.section--photo .section-head::after{
  content:""; position:absolute; inset:-1.5rem -2rem; z-index:0; pointer-events:none;
  background:radial-gradient(ellipse at 30% 50%, rgba(255,255,255,.72) 0%, rgba(255,255,255,0) 72%);
}
.bg-carbon.section--photo .section-head::after,.bg-ink.section--photo .section-head::after{
  background:radial-gradient(ellipse at 30% 50%, rgba(16,25,43,.62) 0%, rgba(16,25,43,0) 72%);
}

/* ═══════════════════════════════════════════════════════════
   AJUSTES FINOS — enquadramento e legibilidade
   ═══════════════════════════════════════════════════════════ */

/* A — FILOSOFIA: mais respiro na coluna de texto */
.duo__txt{
  padding-left:clamp(3.5rem,2rem+7vw,12rem);
  padding-right:clamp(3rem,2rem+5vw,9rem);
}
@media (max-width:1100px){
  .duo__txt{padding-left:clamp(2.5rem,1.5rem+5vw,6rem); padding-right:clamp(2.5rem,1.5rem+4vw,5rem)}
}
@media (max-width:900px){ .duo__txt{padding-inline:clamp(2rem,1.5rem+3vw,3rem)} }

/* B — FOTO DOS NÚMEROS: recorte vertical dedicado, rosto inteiro */
.numeros__foto img{object-position:center 22%}
@media (max-width:1000px){ .numeros__foto img{object-position:center 26%} }

/* C — CENA "O princípio que rege tudo": topo ancorado, rosto preservado */
.cena__img[src$="exame-joelho-largo.jpg"]{object-position:32% top}
@media (max-width:900px){ .cena__img[src$="exame-joelho-largo.jpg"]{object-position:38% top} }

/* C2 — EXAME FÍSICO (foto real): ancora rosto + mãos no joelho */
.duo__img img[src$="exame-joelho.jpg"]{object-position:50% 46%}
@media (max-width:900px){ .duo__img img[src$="exame-joelho.jpg"]{object-position:52% 52%} }
.sec-bg[src$="exame-joelho-largo.jpg"]{object-position:50% 40%}

/* D — FAIXAS COM RETRATO: nunca cortar a cabeça */
.band__img{object-position:right 15%}
.band--left .band__img{object-position:left 12%}
@media (max-width:900px){
  .band__img{object-position:72% 12%}
  .band--left .band__img{object-position:28% 12%}
}

/* E — BLOCOS DE LEITURA LONGA SOBRE FOTOGRAFIA
   FAQ, acordeões e listas de perguntas precisam de contraste de texto,
   não de textura. A fotografia recua para plano de fundo real.        */
.section--photo:has(.faq) .sec-bg,
.section--photo:has(.faq-filter) .sec-bg{opacity:.30; filter:grayscale(1) contrast(.86)}
.section--photo:has(.faq)::after{
  background:linear-gradient(180deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.94) 50%,rgba(255,255,255,.98) 100%);
}
.bg-mist.section--photo:has(.faq)::after{
  background:linear-gradient(180deg,rgba(245,247,249,.97) 0%,rgba(245,247,249,.94) 50%,rgba(245,247,249,.98) 100%);
}
.section--photo .faq__q{color:var(--ink)}
.section--photo .faq__a p{color:#3A4956}
.section--photo .faq__item{border-bottom-color:rgba(16,25,43,.16)}
.section--photo .faq{border-top-color:rgba(16,25,43,.16)}

/* ── BLOCO DE MARCA NA FAIXA DE NÚMEROS ─────────────────────────
   Substitui a tira fotográfica: um selo tipográfico fecha a faixa
   sem espremer nenhuma imagem num formato que não a comporta.     */
.numeros__marca{
  width:clamp(230px,24vw,380px);
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:.9rem; padding:clamp(2.5rem,2rem+2vw,3.75rem) clamp(1.5rem,1rem+2vw,3rem);
  border-left:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(ellipse at 50% 40%, rgba(176,141,87,.10) 0%, rgba(176,141,87,0) 70%),
    rgba(255,255,255,.02);
  text-align:center;
}
.numeros__marca img{
  width:clamp(58px,5.5vw,84px); height:auto; opacity:.88;
  filter:drop-shadow(0 2px 14px rgba(0,0,0,.35));
}
.numeros__marca p{
  font-family:var(--serif); font-size:clamp(1.05rem,.9rem+.5vw,1.35rem);
  color:#fff; letter-spacing:.005em; margin:.35rem 0 0;
}
.numeros__marca span{
  font-size:.6875rem; letter-spacing:.22em; text-transform:uppercase;
  color:var(--gold-lite); opacity:.85;
}
@media (max-width:1000px){
  .numeros__marca{width:auto; border-left:0; border-top:1px solid rgba(255,255,255,.14);
                  padding-block:clamp(2.25rem,2rem+2vw,3rem)}
}

/* cena "acompanhamento por critérios": retrato à direita, texto no campo livre */
.cena__img[src$="dr-igor-criterios-largo.jpg"]{object-position:right center}
@media (max-width:900px){
  .cena__img[src$="dr-igor-criterios-largo.jpg"]{object-position:72% top}
}

/* ═══════════════════════════════════════════════════════════
   RODADA 3 — respiro na filosofia e disciplina de fotografia
   ═══════════════════════════════════════════════════════════ */

/* FILOSOFIA: o texto deixa de encostar na emenda com a fotografia.
   Recuo simétrico e medida de linha maior — o vazio à direita some
   porque a coluna de texto passa a ocupar o espaço que tinha.        */
.duo{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.duo__txt{
  padding-left:clamp(3rem,1rem+8vw,10.5rem) !important;
  padding-right:clamp(3rem,1rem+6vw,8rem) !important;
  justify-content:center;
}
.duo__txt h2{max-width:16ch}
.duo__txt p{max-width:46ch}
@media (max-width:1200px){
  .duo__txt{padding-left:clamp(2.5rem,1.5rem+5vw,6rem) !important;
            padding-right:clamp(2.5rem,1.5rem+4vw,5rem) !important}
}
@media (max-width:900px){
  .duo__txt{padding-inline:clamp(2rem,1.5rem+3vw,3rem) !important}
  .duo__txt h2,.duo__txt p{max-width:none}
}

/* FIGURA DE AVALIAÇÃO: captura de tela real, tratada como documento */
.medida{
  display:grid; grid-template-columns:minmax(0,320px) minmax(0,1fr);
  gap:clamp(2rem,1.5rem+3vw,4.5rem); align-items:center;
}
.medida__img{
  border:1px solid var(--line-strong); background:#0B1220;
  padding:.5rem; border-radius:2px; box-shadow:0 24px 60px -30px rgba(16,25,43,.45);
}
.medida__img img{display:block; width:100%; height:auto; border-radius:1px}
.medida figcaption{
  font-size:.8125rem; color:var(--muted); line-height:1.6; margin-top:1rem;
  padding-left:.9rem; border-left:2px solid var(--gold);
}
@media (max-width:820px){ .medida{grid-template-columns:1fr} }

/* Fundo com rosto: ancora pelo topo, nunca corta a cabeça */
.sec-bg--rosto{object-position:center top}

/* ═══════════════════════════════════════════════════════════
   LEGIBILIDADE SOBRE FOTOGRAFIA — passe definitivo
   O véu anterior deixava a foto visível mas o texto no limite.
   Aqui a hierarquia se inverte: primeiro o texto tem que ler,
   depois a fotografia entra como textura.
   ═══════════════════════════════════════════════════════════ */
.section--photo::after{
  background:linear-gradient(180deg,rgba(255,255,255,.95) 0%,rgba(255,255,255,.88) 48%,rgba(255,255,255,.96) 100%);
}
.bg-mist.section--photo::after{
  background:linear-gradient(180deg,rgba(245,247,249,.96) 0%,rgba(245,247,249,.90) 48%,rgba(245,247,249,.97) 100%);
}
.bg-carbon.section--photo::after{
  background:linear-gradient(180deg,rgba(43,49,60,.95) 0%,rgba(43,49,60,.87) 48%,rgba(43,49,60,.97) 100%);
}
.bg-ink.section--photo::after,.cta-band.section--photo::after{
  background:linear-gradient(180deg,rgba(16,25,43,.95) 0%,rgba(16,25,43,.87) 48%,rgba(16,25,43,.97) 100%);
}

/* texto corrido sobre foto: tom escuro, não "cinza de legenda" */
.section--photo:not(.bg-ink):not(.bg-carbon):not(.cta-band) .lead,
.section--photo:not(.bg-ink):not(.bg-carbon):not(.cta-band) .prose p,
.section--photo:not(.bg-ink):not(.bg-carbon):not(.cta-band) .prose li,
.section--photo:not(.bg-ink):not(.bg-carbon):not(.cta-band) .section-head p,
.section--photo:not(.bg-ink):not(.bg-carbon):not(.cta-band) p:not([class]){color:#2B3947}
.section--photo .prose strong{color:var(--ink)}
.bg-carbon.section--photo .lead,.bg-ink.section--photo .lead,
.bg-carbon.section--photo .prose p,.bg-ink.section--photo .prose p,
.bg-carbon.section--photo .section-head p,.bg-ink.section--photo .section-head p,
.cta-band.section--photo p{color:#C6D4E1}

/* ═══════════════════════════════════════════════════════════
   SEÇÕES ESCURAS COM FOTOGRAFIA — texto sempre claro
   O reforço de contraste anterior valia só para fundo claro.
   Aqui a mesma disciplina, na direção oposta.
   ═══════════════════════════════════════════════════════════ */
.bg-ink.section--photo .etapa p,
.bg-carbon.section--photo .etapa p,
.bg-ink.section--photo p:not([class]),
.bg-carbon.section--photo p:not([class]),
.cta-band.section--photo p:not([class]),
.bg-ink.section--photo .prose p,
.bg-carbon.section--photo .prose p,
.bg-ink.section--photo .prose li,
.bg-carbon.section--photo .prose li,
.bg-ink.section--photo li,
.bg-carbon.section--photo li{color:#BFD0DE}

.bg-ink.section--photo .etapa h3,
.bg-carbon.section--photo .etapa h3,
.bg-ink.section--photo h3,
.bg-carbon.section--photo h3{color:#fff}

.bg-ink.section--photo .prose strong,
.bg-carbon.section--photo .prose strong,
.bg-ink.section--photo strong,
.bg-carbon.section--photo strong{color:#fff}

.bg-ink.section--photo .etapa__marco,
.bg-carbon.section--photo .etapa__marco{color:var(--gold-lite)}

/* a linha dourada da timeline não pode sumir sobre a fotografia */
.bg-ink.section--photo .timeline::before,
.bg-carbon.section--photo .timeline::before{opacity:.95}

/* ═══════════════════════════════════════════════════════════
   RODADA 4 — narrativa centrada no paciente
   Hero com hierarquia em três tempos, composição editorial de
   etapas e blocos de fechamento em destaque.
   ═══════════════════════════════════════════════════════════ */

/* ---------- HERO: subheadline + destaque + nota ---------- */
.hero__lead{max-width:46ch; margin-top:2rem}

.hero__accent{
  font-family:var(--serif); font-weight:400; font-style:italic;
  font-size:clamp(1.15rem,1rem+.75vw,1.55rem); line-height:1.4;
  color:var(--gold-lite); max-width:34ch; margin-top:1.75rem;
  padding-left:1.15rem; border-left:1px solid rgba(201,169,122,.5);
}

.hero .display em{margin-top:.12em}

/* rótulos longos não podem estourar a coluna em telas estreitas */
.hero .btn-row .btn{white-space:normal; text-align:center; line-height:1.35}
@media (max-width:520px){
  .hero .btn-row{flex-direction:column; align-items:stretch}
  .hero .btn-row .btn{width:100%}
}

/* o bloco de texto do duo ganha um segundo tempo em itálico dourado */
.duo__txt h2 em{
  display:block; font-style:italic; font-weight:300;
  color:var(--gold-deep); margin-top:.25em; letter-spacing:-.022em;
}
.duo__txt h2{max-width:22ch}

/* ---------- COMPOSIÇÃO EDITORIAL DE ETAPAS ----------
   Numeração grande, filete superior e progressão horizontal.
   Não é um card: não tem caixa, sombra nem fundo.            */
.fluxo{
  list-style:none; margin:0; padding:0;
  display:grid; grid-template-columns:repeat(3,1fr);
  gap:clamp(2.5rem,1.5rem+4vw,5.5rem);
  counter-reset:none;
}
.fluxo__etapa{position:relative; padding-top:clamp(2rem,1.5rem+1.5vw,3rem)}
.fluxo__etapa::before{
  content:""; position:absolute; inset:0 0 auto; height:1px; background:var(--line-strong);
}
.fluxo__etapa::after{
  content:""; position:absolute; left:0; top:0; width:34px; height:2px; background:var(--gold);
}
.fluxo__n{
  display:block; font-family:var(--serif); font-weight:300;
  font-size:clamp(3rem,2rem+4vw,5rem); line-height:1;
  color:rgba(176,141,87,.28); letter-spacing:-.04em;
}
.fluxo__verbo{
  margin-top:1.25rem; font-size:.6875rem; letter-spacing:.24em;
  text-transform:uppercase; color:var(--gold-deep);
}
.fluxo__etapa h3{
  font-family:var(--serif); font-weight:400; letter-spacing:-.02em;
  font-size:clamp(1.25rem,1.05rem+.7vw,1.6rem); line-height:1.2; margin-top:.75rem;
}
.fluxo__txt{
  margin-top:1.1rem; color:var(--muted);
  font-size:.9688rem; line-height:1.72; max-width:38ch;
}
@media (max-width:900px){
  .fluxo{grid-template-columns:1fr; gap:0}
  .fluxo__etapa{padding-block:clamp(2rem,1.5rem+2vw,2.75rem)}
  .fluxo__txt{max-width:none}
}

/* ---------- FRASE DE FECHAMENTO EM DESTAQUE ---------- */
.destaque{
  font-family:var(--serif); font-weight:400;
  font-size:clamp(1.35rem,1.1rem+1.1vw,2.1rem); line-height:1.28;
  letter-spacing:-.022em; color:var(--ink);
  max-width:34ch; margin-top:clamp(3.5rem,2.5rem+3vw,5.5rem);
  padding-left:clamp(1.25rem,1rem+.75vw,2rem);
  border-left:1px solid var(--gold);
}
.destaque em{display:block; font-style:italic; font-weight:300; color:var(--gold-deep); margin-top:.3em}

.destaque--dark{
  color:#fff; border-left-color:var(--gold-lite);
  margin-inline:auto; max-width:32ch;
}
.destaque--dark em{color:var(--gold-lite)}
@media (max-width:700px){
  .destaque{max-width:none}
}

/* o manifesto perdeu a assinatura: o fechamento assume o papel de arremate */
.manifesto .destaque{margin-top:clamp(3rem,2.5rem+2vw,4.5rem)}

/* ---------- QUEBRA DE LINHA DOS TÍTULOS ----------
   Evita palavra isolada na última linha em telas estreitas.
   Degrada em silêncio nos navegadores que ainda não suportam.  */
.hero .display,.hero .display em,
.duo__txt h2,.destaque,.manifesto__lead,
.section-head h2,.cena h2,.fluxo__etapa h3,.abertura__frase{
  text-wrap:balance;
}
.hero__lead,.hero__accent,.hero__note,
.fluxo__txt,.lead,.prose p,.manifesto__body p{
  text-wrap:pretty;
}
/* palavras longas nunca estouram a coluna */
.hero .display,.duo__txt h2,.section-head h2,.cena h2,.destaque{
  overflow-wrap:break-word;
}

/* ---------- CORREÇÃO: bloco .duo empilha no mobile ----------
   A regra de grid da "Rodada 3" reimpôs 2 colunas depois do
   @media (max-width:900px) original, colapsando foto e texto em
   duas faixas de ~195px no celular. Restaura o empilhamento.   */
@media (max-width:900px){
  .duo{grid-template-columns:minmax(0,1fr)}
  .duo__img{min-height:clamp(280px,62vw,420px)}
}

/* ---------- LANDING PAGE (tráfego pago) ----------
   Header e rodapé propositalmente enxutos: cada link a mais
   numa página de anúncio é uma chance do clique pago sair sem
   converter. Sem menu, sem mega-dropdown, sem link farm no rodapé. */
.lp-header .nav,
.lp-header .burger{display:none}
.lp-header__phone{
  margin-left:auto; margin-right:1.5rem; font-weight:600; color:var(--ink);
  white-space:nowrap; font-size:.9375rem;
}
@media (max-width:700px){ .lp-header__phone{display:none} }
.lp-hero__alt{margin-top:1.75rem; font-size:.9375rem; color:var(--muted)}
.lp-hero__alt a{color:inherit; text-decoration:underline; text-underline-offset:3px}
.lp-footer .footer__grid{display:none}
.lp-footer__row{
  display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:1.5rem;
  padding-bottom:2rem; border-bottom:1px solid rgba(255,255,255,.12);
}
.lp-footer__contact{display:flex; flex-direction:column; gap:.4rem; font-size:.9375rem; color:#A7B7C7; text-align:right}
.lp-footer__contact a{color:inherit}
@media (max-width:700px){ .lp-footer__row{flex-direction:column; align-items:flex-start} .lp-footer__contact{text-align:left} }
.lp-hero .hero__copy{max-width:34ch}
@media (max-width:640px){ .lp-hero .hero__copy{max-width:none} }