@import url("./fonts.css");

/* ============================================================
   Bárbara Martini — sistema base
   Terracota dominante, verde-oliva da tapeçaria como contraponto
   ============================================================ */

:root{
  --creme:      #F7F1E6;
  --creme-2:    #EFE4D2;
  --creme-3:    #E5D5BE;

  --accent:      #9C4630;   /* campo principal — creme 5.6:1 */
  --accent-deep: #7E341F;   /* banda escura — creme 7.8:1 */
  --accent-ink:  #5F2613;   /* texto/rodapé — creme 10.5:1 */
  --accent-soft: #B06A4B;

  --oliva:      #55603A;   /* creme 6.0:1 */
  --oliva-ink:  #2C3527;   /* creme 11.3:1 */

  --ink:        #241D18;
  --muted:      #615549;   /* creme 6.3:1 */

  --rgb-accent:     156,70,48;
  --rgb-accent-ink: 95,38,19;
  --rgb-shadow:    36,15,8;

  --line:       rgba(36,29,24,.19);
  --line-soft:  rgba(36,29,24,.09);
  --line-cream: rgba(247,241,230,.26);

  --serif: 'Cormorant Garamond', 'Newsreader', 'Iowan Old Style', Georgia, serif;
  --sans:  'Acumin Variable Concept', 'Acumin Pro', 'Instrument Sans', system-ui, -apple-system, sans-serif;
  --serif-italic: 'Newsreader', 'Iowan Old Style', Georgia, serif;

  --maxw: 1240px;
  --gutter: clamp(20px, 4.6vw, 60px);
  --ease: cubic-bezier(.22,.61,.36,1);
}

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

html{
  -webkit-text-size-adjust:100%;
  scroll-behavior:smooth;
}
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior:auto; } }

body{
  margin:0;
  background:var(--creme);
  color:var(--ink);
  font-family:var(--sans);
  font-size:16.5px;
  line-height:1.58;
  font-feature-settings:"kern" 1,"liga" 1;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
  overflow-x:hidden;
}

img{ display:block; max-width:100%; height:auto; }
a{ color:inherit; text-decoration:none; }
button{ font:inherit; color:inherit; }

::selection{ background:var(--accent); color:var(--creme); }
:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:3px;
  border-radius:1px;
}
.on-dark :focus-visible{ outline-color:var(--creme); }

.skip{
  position:absolute; left:-9999px; top:0;
  background:var(--creme); color:var(--accent-ink);
  padding:12px 18px; z-index:200; font-size:13px;
}
.skip:focus{ left:12px; top:12px; }

/* ---------- tipografia ---------- */

h1,h2,h3,h4{ margin:0; font-family:var(--serif); font-weight:300; }
p{ margin:0; }

.eyebrow{
  font-family:var(--sans);
  font-size:12px;
  font-weight:600;
  letter-spacing:.15em;
  text-transform:uppercase;
  line-height:1.4;
  color:var(--accent-deep);
}
.on-dark .eyebrow{ color:var(--creme); opacity:.92; }
.hero .eyebrow{ color:rgba(247,241,230,.98); opacity:1; }

.display{
  font-size:clamp(43px, 5.05vw, 74px);
  line-height:1.08;
  letter-spacing:-.026em;
  font-weight:300;
  text-wrap:balance;
}
.display em{ font-family:var(--serif-italic); font-style:italic; font-weight:300; }
@media (min-width: 1081px){
  .hero .display > span{ white-space:nowrap; }
}

.h2{
  font-size:clamp(34px, 4.0vw, 56px);
  line-height:1.07;
  letter-spacing:-.018em;
  font-weight:300;
  text-wrap:balance;
}
.h3{
  font-size:clamp(25px, 1.85vw, 31px);
  line-height:1.18;
  letter-spacing:-.008em;
  font-weight:400;
}
.lede{
  font-size:clamp(16px, 1.28vw, 18.5px);
  line-height:1.62;
  max-width:46ch;
  color:rgba(247,241,230,.96);
}
.lede--ink{ color:var(--muted); }
.small{ font-size:13.5px; line-height:1.5; }

/* ---------- estrutura ---------- */

.wrap{
  width:100%;
  max-width:var(--maxw);
  margin-inline:auto;
  padding-inline:var(--gutter);
  min-width:0;
}
.section{ padding-block:clamp(52px, 6.2vw, 94px); position:relative; }
.section--tight{ padding-block:clamp(52px, 6vw, 88px); }
.band-creme{ background:var(--creme); }
.band-creme2{ background:var(--creme-2); }
.band-terra{ background:var(--accent); color:var(--creme); }
.band-terra-deep{ background:var(--accent-deep); color:var(--creme); }
.band-oliva{ background:var(--oliva-ink); color:var(--creme); }

.section-head{ display:grid; gap:18px; max-width:58ch; }
.section-head .h2{ max-width:22ch; }
.rule{ height:1px; background:var(--line); border:0; margin:0; }
.on-dark .rule{ background:var(--line-cream); }

/* ---------- botões ---------- */

.btn{
  --bg:var(--creme);
  --fg:var(--accent-ink);
  --bd:var(--creme);
  display:inline-flex;
  align-items:center;
  gap:11px;
  padding:15px 24px 16px;
  background:var(--bg);
  color:var(--fg);
  border:1px solid var(--bd);
  border-radius:2px;
  font-family:var(--sans);
  font-size:13.5px;
  font-weight:500;
  letter-spacing:.055em;
  text-transform:uppercase;
  line-height:1;
  cursor:pointer;
  transition:background .28s var(--ease), color .28s var(--ease),
             border-color .28s var(--ease), transform .28s var(--ease);
  white-space:nowrap;
}
.btn svg{ width:15px; height:15px; flex:none; transition:transform .3s var(--ease); }
.btn:hover{ background:var(--creme-2); border-color:var(--creme-2); transform:translateY(-1px); }
.btn:hover svg{ transform:translateX(3px); }
.btn:active{ transform:translateY(0); }

.btn--ghost{
  --bg:transparent; --fg:var(--accent-ink); --bd:rgba(36,29,24,.35);
  color:var(--accent-ink); border-color:rgba(36,29,24,.32);
}
.btn--ghost:hover{ background:rgba(36,29,24,.05); border-color:rgba(36,29,24,.45); }
.on-dark .btn--ghost,
.btn--ghost-cream{
  background:transparent;
  color:var(--creme);
  border-color:rgba(247,241,230,.45);
}
.btn--ghost-cream:hover{ background:rgba(247,241,230,.10); border-color:rgba(247,241,230,.65); }

/* ---------- header ---------- */

.site-head{
  position:sticky;
  top:0;
  z-index:90;
  background:var(--accent);
  color:var(--creme);
  border-bottom:1px solid rgba(247,241,230,.22);
}
.head-in{
  display:flex;
  align-items:center;
  gap:clamp(14px,3vw,44px);
  min-height:74px;
  padding-block:12px;
}
.brand{ display:flex; align-items:center; gap:11px; flex:none; }
.brand-mark{ height:29px; width:auto; flex:none; }
.brand-txt{ display:flex; flex-direction:column; gap:3px; }
.brand-name{
  font-family:var(--serif);
  font-size:25.5px;
  font-weight:500;
  letter-spacing:.012em;
  line-height:1;
}
.brand-meta{
  font-size:11px;
  letter-spacing:.14em;
  text-transform:uppercase;
  line-height:1;
  color:rgba(247,241,230,.88);
}
.nav{
  display:flex;
  align-items:center;
  gap:clamp(16px,2.1vw,30px);
  margin-left:auto;
  font-size:13px;
  letter-spacing:.045em;
  text-transform:uppercase;
}
.nav a{
  position:relative;
  padding-block:4px;
  color:var(--creme);
  opacity:.92;
  transition:opacity .2s;
}
.nav a::after{
  content:"";
  position:absolute; left:0; bottom:0;
  width:100%; height:1px;
  background:var(--creme);
  transform:scaleX(0); transform-origin:left;
  transition:transform .32s var(--ease);
}
.nav a:hover{ opacity:1; }
.nav a:hover::after{ transform:scaleX(1); }
.head-cta{ margin-left:clamp(6px,1.4vw,18px); padding:12px 18px 13px; font-size:11.5px; }

.nav-toggle{
  display:none;
  margin-left:auto;
  width:44px; height:44px;
  align-items:center; justify-content:center;
  background:transparent;
  border:1px solid rgba(247,241,230,.4);
  border-radius:2px;
  cursor:pointer;
}
.nav-toggle span{ display:block; width:18px; height:1px; background:var(--creme); position:relative; }
.nav-toggle span::before,
.nav-toggle span::after{
  content:""; position:absolute; left:0; width:18px; height:1px; background:var(--creme);
  transition:transform .3s var(--ease), opacity .2s;
}
.nav-toggle span::before{ top:-5px; }
.nav-toggle span::after{ top:5px; }
body.nav-open .nav-toggle span{ background:transparent; }
body.nav-open .nav-toggle span::before{ transform:translateY(5px) rotate(45deg); }
body.nav-open .nav-toggle span::after{ transform:translateY(-5px) rotate(-45deg); }

/* ---------- hero ---------- */

.hero{
  position:relative;
  background:var(--accent);
  color:var(--creme);
  overflow:hidden;
  isolation:isolate;
}

/* marca d'água no hero */
.hero-mark{
  position:absolute; z-index:0; pointer-events:none;
  top:50%; left:-5%; transform:translateY(-50%);
  height:68%; opacity:.07;
  display:flex; align-items:center;
}
.hero-mark img{ height:100%; width:auto; display:block; }
@media (max-width: 900px){
  .hero-mark{ height:56%; left:-16%; right:auto; opacity:.06; }
}
.hero .motif{
  position:absolute;
  z-index:0;
  color:rgba(247,241,230,.19);
  pointer-events:none;
}
.hero-grid{
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);
  gap:clamp(28px,4vw,64px);
  align-items:end;
  padding-block:clamp(34px,4.3vw,62px) 0;
}
.hero-copy{ padding-bottom:clamp(38px,4.6vw,64px); min-width:0; }
.hero-copy .eyebrow{ margin-bottom:clamp(20px,2.4vw,32px); }
.hero-copy .display{ margin-bottom:clamp(20px,2.2vw,30px); }
.hero-copy .lede{ margin-bottom:clamp(26px,3vw,38px); }
.hero-actions{
  display:flex; flex-wrap:wrap; align-items:center;
  gap:14px 22px;
}
.hero-actions .link-arrow{
  display:inline-flex; align-items:center; min-height:44px;
  font-size:13px; letter-spacing:.05em; text-transform:uppercase; font-weight:500;
  border-bottom:1px solid rgba(247,241,230,.5);
  padding-bottom:3px;
  transition:border-color .25s;
}
.hero-actions .link-arrow:hover{ border-color:var(--creme); }
.hero-note{
  margin-top:clamp(26px,3vw,38px);
  padding-top:16px;
  border-top:1px solid rgba(247,241,230,.34);
  font-size:12.5px;
  letter-spacing:.005em;
  line-height:1.6;
  color:var(--creme);
  max-width:36ch;
  text-wrap:balance;
}

.hero-media{ margin:0; min-width:0; position:relative; }
.hero-media .arch{
  position:relative;
  overflow:hidden;
  border-radius:300px 300px 3px 3px;
  background:var(--accent-deep);
  aspect-ratio:44/50.4;
  box-shadow:0 40px 80px -50px rgba(var(--rgb-shadow),.85);
}
.hero-media img{
  position:absolute;
  inset:0;
  width:100%; height:100%;
  object-fit:cover;
  object-position:50% 28%;
  filter:saturate(.93) contrast(1.03) brightness(1.01);
}
.hero-media .arch::after{
  content:"";
  position:absolute; inset:0;
  background:linear-gradient(178deg, rgba(var(--rgb-accent),.16) 0%, rgba(var(--rgb-accent-ink),.05) 42%, rgba(var(--rgb-accent-ink),.36) 100%);
  mix-blend-mode:multiply;
  pointer-events:none;
}
.hero-media figcaption{
  display:flex; align-items:center; gap:10px;
  padding-top:11px;
  font-size:11px;
  letter-spacing:.15em;
  text-transform:uppercase;
  color:var(--creme);
}
.hero-media figcaption::before{
  content:""; width:26px; height:1px; background:rgba(247,241,230,.55); flex:none;
}

/* ---------- manifesto ---------- */

.manifesto{
  position:relative;
  overflow:hidden;
}
.manifesto .motif{
  position:absolute; inset:0;
  width:100%; height:100%;
  color:rgba(247,241,230,.16);
  pointer-events:none;
  z-index:0;
}
.manifesto .wrap{ position:relative; z-index:2; }
.manifesto-grid{
  display:grid;
  grid-template-columns:minmax(0,.42fr) minmax(0,1fr);
  gap:clamp(22px,4vw,60px);
  align-items:start;
}
.manifesto blockquote{
  margin:0;
  font-family:var(--serif);
  font-weight:300;
  font-size:clamp(25px,3vw,40px);
  line-height:1.22;
  letter-spacing:-.012em;
  max-width:31ch;
  text-wrap:pretty;
}
.manifesto blockquote em{ font-style:italic; }
.manifesto-side{
  display:flex;
  flex-direction:column;
  gap:24px;
  min-height:100%;
  padding-top:6px;
}
.manifesto-side .vrule{
  display:block;
  width:1px;
  flex:1;
  min-height:72px;
  background:rgba(247,241,230,.34);
}
.manifesto .attrib{
  font-size:11px;
  letter-spacing:.16em;
  text-transform:uppercase;
  line-height:1.9;
  color:rgba(247,241,230,.94);
}

/* ---------- tratamentos (ledger) ---------- */

.ledger-layout{
  display:grid;
  grid-template-columns:minmax(0,.62fr) minmax(0,1fr);
  gap:clamp(26px,4.4vw,72px);
  align-items:start;
}
.ledger-aside{ position:sticky; top:104px; display:grid; gap:20px; }
.ledger-aside .h2{ max-width:14ch; }
.ledger-aside p{ color:var(--muted); max-width:34ch; font-size:15.5px; }

.aside-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  justify-self:start;
  margin-top:6px;
  padding-bottom:4px;
  border-bottom:1px solid var(--accent);
  font-size:11.5px;
  font-weight:500;
  letter-spacing:.09em;
  text-transform:uppercase;
  color:var(--accent-deep);
  transition:gap .25s var(--ease), border-color .25s;
}
.aside-link svg{ width:14px; height:14px; }
.aside-link:hover{ gap:14px; border-color:var(--accent-deep); }

.ledger{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line); }
.ledger li{ border-bottom:1px solid var(--line); }
.ledger li a,
.ledger .row{
  display:grid;
  grid-template-columns:46px minmax(0,1fr);
  gap:clamp(10px,1.6vw,22px);
  padding:clamp(20px,2.2vw,28px) 0;
  align-items:start;
  transition:transform .35s var(--ease), background .35s var(--ease);
}
.ledger .num{
  font-family:var(--serif);
  font-style:italic;
  font-variant-numeric:tabular-nums;
  font-size:15px;
  line-height:1.9;
  color:var(--accent-deep);
  letter-spacing:.02em;
}
.ledger .t{
  font-family:var(--serif);
  font-size:clamp(22px,1.78vw,28px);
  line-height:1.2;
  letter-spacing:-.008em;
  margin-bottom:7px;
  transition:color .25s;
}
.ledger .d{
  font-size:14.5px;
  line-height:1.58;
  color:var(--muted);
  max-width:56ch;
  text-wrap:pretty;
}
.ledger li:hover .t{ color:var(--accent-deep); }
.ledger li:hover .row{ background:rgba(var(--rgb-accent),.05); transform:translateX(10px); }

/* ---------- processo ---------- */

.steps--3{ grid-template-columns:repeat(3,minmax(0,1fr)); }
.steps{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:clamp(18px,2.4vw,34px);
  margin-top:clamp(34px,4vw,54px);
  border-top:1px solid var(--line);
  padding-top:0;
}
.step{ position:relative; padding-top:24px; min-width:0; }
.step::before{
  content:"";
  position:absolute; top:-4px; left:0;
  width:7px; height:7px; border-radius:50%;
  background:var(--accent);
}
.step .n{
  display:block;
  font-family:var(--serif);
  font-size:13px;
  font-style:italic;
  letter-spacing:.06em;
  color:var(--accent-deep);
  margin-bottom:14px;
}
.step .h3{ font-size:clamp(18px,1.32vw,21px); margin-bottom:9px; max-width:17ch; }
.step p{ font-size:14px; line-height:1.55; color:var(--muted); text-wrap:pretty; }

/* ---------- diferenciais (matriz) ---------- */

.matrix{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:clamp(30px,5vw,84px);
  row-gap:0;
  margin-top:clamp(30px,3.6vw,50px);
  padding-bottom:52px;
}
.matrix .cell{
  min-width:0;
  padding:22px 0 32px;
  border-top:1px solid var(--line);
}
.matrix .cell:nth-child(2n){ margin-top:52px; }
.matrix h3{
  font-family:var(--serif);
  font-size:clamp(21px,1.7vw,25px);
  line-height:1.2;
  margin-bottom:10px;
  letter-spacing:-.01em;
  max-width:26ch;
}
.matrix p{ font-size:14.5px; line-height:1.6; color:var(--muted); max-width:44ch; text-wrap:pretty; }

/* ---------- sobre ---------- */

.sobre-grid{
  display:grid;
  grid-template-columns:minmax(0,.66fr) minmax(0,1fr);
  gap:clamp(28px,4.6vw,72px);
  align-items:start;
}
.sobre-media{
  margin:0;
  position:sticky;
  top:100px;
}
.sobre-media img{
  width:100%;
  aspect-ratio:2/3;
  object-fit:cover;
  object-position:50% 50%;
  background:var(--creme-3);
}
.sobre-media figcaption{
  display:flex; align-items:center; gap:10px;
  padding-top:12px;
  font-size:10.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--muted);
}
.sobre-media figcaption::before{
  content:""; width:22px; height:1px; background:var(--line); flex:none;
}
.sobre-copy{ display:grid; gap:18px; max-width:56ch; }
.sobre-copy p{ color:var(--muted); font-size:15.5px; line-height:1.66; text-wrap:pretty; max-width:64ch; }
.sobre-copy p strong{ color:var(--ink); font-weight:500; }
.pull{
  text-wrap:balance;
  margin-top:8px;
  padding-top:22px;
  border-top:1px solid var(--line);
  font-family:var(--serif);
  font-style:italic;
  font-size:clamp(19px,1.5vw,23px);
  line-height:1.42;
  color:var(--accent-deep);
  max-width:46ch;
  text-wrap:pretty;
}
.formacao{ display:grid; gap:0; border-top:1px solid var(--line); }
.formacao .label{
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--accent-deep);
  padding:18px 0 14px;
}
.formacao ul{ list-style:none; margin:0; padding:0; }
.formacao li{
  display:grid;
  grid-template-columns:18px minmax(0,1fr);
  gap:12px;
  padding:13px 0;
  border-top:1px solid var(--line-soft);
  font-size:14px;
  line-height:1.5;
  color:var(--ink);
}
.formacao li::before{
  content:"";
  width:7px; height:7px;
  margin-top:8px;
  border:1px solid var(--accent);
  transform:rotate(45deg);
}
.crp-card{
  margin-top:26px;
  padding:20px 22px;
  background:var(--creme);
  border:1px solid var(--line);
  display:grid;
  gap:4px;
}
.crp-card .k{ font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:var(--muted); }
.crp-card .v{ font-family:var(--serif); font-size:20px; letter-spacing:.01em; }

/* ---------- consultório ---------- */

.consultorio{ position:relative; overflow:hidden; }
.consultorio .motif{
  position:absolute; right:-10%; top:-20%;
  width:70%; height:140%;
  color:rgba(247,241,230,.15);
  pointer-events:none;
}
.consultorio .wrap{ position:relative; z-index:2; }
.cons-grid{
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(0,1fr);
  gap:clamp(28px,4.6vw,72px);
  align-items:start;
}
.cons-copy{ display:grid; gap:18px; }
.cons-copy p{ color:rgba(247,241,230,.92); font-size:15.5px; line-height:1.66; max-width:44ch; }
.cons-list{ list-style:none; margin:0; padding:0; border-top:1px solid var(--line-cream); }
.cons-list li{
  display:flex; align-items:baseline; gap:14px;
  padding:15px 0;
  border-bottom:1px solid var(--line-cream);
  font-size:14.5px;
  color:var(--creme);
}
.cons-list li .i{
  font-family:var(--serif); font-style:italic; font-size:12px;
  color:rgba(247,241,230,.8); flex:none; width:16px;
}
.cons-address{
  font-style:normal;
  display:grid;
  gap:6px;
  margin-top:4px;
  padding-top:16px;
  border-top:1px solid var(--line-cream);
  font-size:15px;
  line-height:1.62;
  color:var(--creme);
  max-width:34ch;
}
.cons-address .k{
  font-size:11px; letter-spacing:.16em; text-transform:uppercase;
  color:rgba(247,241,230,.82);
}
.cons-note{
  margin-top:18px;
  font-size:12.5px;
  line-height:1.6;
  color:rgba(247,241,230,.88);
  max-width:36ch;
}
.cons-actions{ display:flex; flex-wrap:wrap; gap:14px; align-items:center; margin-top:24px; }

.cons-gallery{
  display:grid;
  grid-template-columns:1.55fr .8fr .8fr;
  gap:12px;
  margin-top:clamp(30px,4vw,52px);
}
.cons-gallery figure{ margin:0; overflow:hidden; background:rgba(247,241,230,.06); }
.cons-gallery img{
  width:100%;
  height:clamp(210px,24vw,320px);
  object-fit:cover;
  filter:saturate(.9) contrast(1.03) sepia(.07) brightness(1.01);
  transition:transform .8s var(--ease);
}
.cons-gallery figure:hover img{ transform:scale(1.03); }
.cons-gallery .g-wide img{ object-position:50% 55%; }
.cons-gallery figure:nth-child(2) img{ object-position:50% 50%; }
.cons-gallery figure:nth-child(3) img{ object-position:62% 44%; }

/* ---------- faq ---------- */

.faq-grid{
  display:grid;
  grid-template-columns:minmax(0,.56fr) minmax(0,1fr);
  gap:clamp(24px,4.4vw,70px);
  align-items:start;
}
.faq-aside{ position:sticky; top:104px; display:grid; gap:18px; }
.faq-aside p{ color:var(--muted); font-size:15px; max-width:30ch; }
.faq{ border-top:1px solid var(--line); }
.faq details{ border-bottom:1px solid var(--line); }
.faq summary{
  display:flex; align-items:baseline; gap:18px;
  padding:21px 0;
  cursor:pointer;
  list-style:none;
  font-family:var(--serif);
  font-size:clamp(17px,1.4vw,20px);
  line-height:1.3;
  letter-spacing:-.004em;
  transition:color .25s;
}
.faq summary::-webkit-details-marker{ display:none; }
.faq summary:hover{ color:var(--accent-deep); }
.faq summary .plus{
  margin-left:auto; flex:none;
  position:relative; width:14px; height:14px;
  top:2px;
}
.faq summary .plus::before,
.faq summary .plus::after{
  content:""; position:absolute; background:var(--accent); transition:transform .3s var(--ease), opacity .3s;
}
.faq summary .plus::before{ left:0; top:6.5px; width:14px; height:1px; }
.faq summary .plus::after{ left:6.5px; top:0; width:1px; height:14px; }
.faq details[open] summary .plus::after{ transform:rotate(90deg); opacity:0; }
.faq details[open] summary{ color:var(--accent-deep); }
.faq .answer{
  padding:0 44px 24px 0;
  font-size:14.8px;
  line-height:1.66;
  color:var(--muted);
  max-width:62ch;
  text-wrap:pretty;
}

/* ---------- CTA final ---------- */

.cta{ position:relative; overflow:hidden; }
.cta .motif{
  position:absolute; left:-8%; bottom:-40%;
  width:60%; color:rgba(247,241,230,.20);
  pointer-events:none;
}
.cta .wrap{ position:relative; z-index:2; }
.cta-grid{
  display:grid;
  grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);
  gap:clamp(26px,4vw,64px);
  align-items:end;
}
.cta-copy{ display:grid; gap:20px; }
.cta-copy .h2{ max-width:20ch; }
.cta-copy p{ color:rgba(247,241,230,.94); max-width:42ch; font-size:15.5px; }
.cta-actions{ display:grid; gap:18px; justify-items:start; }
.cta-actions .alt{
  display:inline-flex; align-items:center; min-height:44px;
  font-size:12px; letter-spacing:.05em; text-transform:uppercase;
  color:var(--creme); border-bottom:1px solid rgba(247,241,230,.45);
  padding-bottom:3px;
}

/* ---------- footer ---------- */

.footer{ background:var(--accent-ink); color:var(--creme); padding-block:clamp(40px,5vw,64px) 30px; }
.foot-grid{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(0,.7fr) minmax(0,.7fr);
  gap:clamp(26px,4vw,56px);
  padding-bottom:36px;
}
.foot-brand .brand-name{ font-size:24px; }
.foot-brand p{
  margin-top:12px; font-size:13px; line-height:1.6;
  color:rgba(247,241,230,.82); max-width:34ch;
}
.foot-col .k{
  font-size:11px; letter-spacing:.15em; text-transform:uppercase;
  color:rgba(247,241,230,.8); margin-bottom:14px;
}
.foot-col a, .foot-col span{
  display:block; font-size:14px; line-height:1.9;
  color:var(--creme);
}
.foot-col a:hover{ text-decoration:underline; text-underline-offset:4px; }
.foot-base{
  display:flex; flex-wrap:wrap; gap:12px 26px; align-items:center;
  padding-top:22px;
  border-top:1px solid rgba(247,241,230,.2);
  font-size:11px; letter-spacing:.05em;
  color:rgba(247,241,230,.78);
}
.foot-base .sp{ margin-left:auto; }

/* ---------- movimento ---------- */

.reveal{ opacity:1; }
html.js .reveal{ opacity:0; transform:translateY(16px); }
html.js .reveal.seen{
  opacity:1; transform:none;
  transition:opacity .8s var(--ease), transform .8s var(--ease);
}
html.js .hero .display > span{
  display:block;
  transform:translateY(24px);
  opacity:0;
}
html.js .hero.seen .display > span{
  transform:none; opacity:1;
  transition:transform .95s var(--ease), opacity .95s var(--ease);
}
html.js .hero.seen .display > span:nth-child(2){ transition-delay:.1s; }
html.js .hero.seen .display > span:nth-child(3){ transition-delay:.18s; }

.motif path{
  stroke-dasharray:2600;
  stroke-dashoffset:2600;
  animation:draw 3.2s var(--ease) forwards;
}
@keyframes draw{ to{ stroke-dashoffset:0; } }

@media (prefers-reduced-motion: reduce){
  html.js .reveal{ opacity:1; transform:none; }
  html.js .hero .display > span{ opacity:1; transform:none; }
  .motif path{ animation:none; stroke-dashoffset:0; }
  *{ transition-duration:.01ms !important; animation-duration:.01ms !important; }
}

/* ---------- responsivo ---------- */

@media (max-width: 1080px){
  .ledger-layout,
  .sobre-grid,
  .cons-grid,
  .faq-grid,
  .manifesto-grid{ grid-template-columns:1fr; }
  .ledger-aside, .faq-aside{ position:static; }
  .sobre-media{ position:static; max-width:420px; }
  .cons-gallery{ grid-template-columns:1fr 1fr; }
  .cons-gallery .g-wide{ grid-column:1/-1; }
  .ledger-aside .h2, .faq-aside .h2{ max-width:26ch; }
  .steps, .steps--3{ grid-template-columns:repeat(2,minmax(0,1fr)); row-gap:34px; }
  .matrix{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .hero-grid{ grid-template-columns:1fr; align-items:start; }
  .hero-media{ max-width:520px; }
  .hero-copy{ padding-bottom:0; }
  .hero-grid{ padding-bottom:clamp(40px,6vw,64px); }
  .foot-grid{ grid-template-columns:1fr 1fr; }
}

@media (max-width: 860px){
  .nav{ display:none; }
  .head-cta{ display:none; }
  .nav-toggle{ display:flex; }
  .head-in{ min-height:66px; }

  body.nav-open .nav{
    display:flex;
    position:fixed;
    inset:66px 0 auto 0;
    flex-direction:column;
    align-items:flex-start;
    gap:0;
    padding:12px var(--gutter) 26px;
    background:var(--accent);
    border-bottom:1px solid rgba(247,241,230,.25);
    z-index:89;
    max-height:calc(100dvh - 66px);
    overflow:auto;
  }
  body.nav-open .nav a{
    width:100%;
    padding:15px 0;
    border-bottom:1px solid rgba(247,241,230,.18);
    font-size:14px;
  }
  body.nav-open .nav a::after{ display:none; }
  .cta-grid{ grid-template-columns:1fr; align-items:start; }
  .foot-grid{ grid-template-columns:1fr; gap:30px; }
  .foot-base .sp{ margin-left:0; width:100%; }
}

@media (max-width: 640px){
  body{ font-size:16px; }
  .steps, .steps--3{ grid-template-columns:1fr; row-gap:26px; border-top:0; padding-top:0; }
  .step{ padding-top:20px; border-top:1px solid var(--line); }
  .step::before{ top:-4px; }
  .matrix{ grid-template-columns:1fr; }
  .hero-media .arch{ border-radius:190px 190px 3px 3px; aspect-ratio:4/4.7; }
  .hero-note{ max-width:none; }
  .btn{ width:100%; justify-content:center; padding:16px 20px 17px; }
  .hero-actions{ display:grid; gap:14px; }
  .hero-actions .link-arrow{ justify-self:start; }
  .cons-actions .btn{ width:auto; }
  .cons-gallery{ grid-template-columns:1fr; }
  .cons-gallery img{ height:230px; }
  .cons-gallery figure:nth-child(3) img{ object-position:50% 30%; }
  .foot-base{ font-size:10.5px; }
}


/* ============================================================
   Tema azul — mesma composição, campo principal #006F9A
   Ativa com <html data-theme="azul"> (ou ?tema=azul)
   ============================================================ */
html[data-theme="azul"]{
  --accent:      #006F9A;   /* creme 5.0:1 */
  --accent-deep: #00516F;   /* creme 7.8:1 */
  --accent-ink:  #00384D;   /* creme 11.2:1 */
  --accent-soft: #4E9CBD;

  --oliva:      #2A5A6B;   /* seção escura vira petróleo */
  --oliva-ink:  #0E3446;   /* creme 11.7:1 */

  --ink:        #14232B;
  --muted:      #4C5A62;

  --rgb-accent:     0,111,154;
  --rgb-accent-ink: 0,56,77;
  --rgb-shadow:    6,32,44;

  --line:       rgba(20,35,43,.20);
  --line-soft:  rgba(20,35,43,.09);
}
html[data-theme="azul"] ::selection{ background:var(--accent); color:#fff; }
html[data-theme="azul"] .cons-gallery img{
  filter:saturate(.92) contrast(1.03) brightness(1.02);
}
html[data-theme="azul"] .hero-media .arch{
  box-shadow:0 40px 80px -50px rgba(var(--rgb-shadow),.75);
}

/* ============================================================
   Tema marinho — campo principal #2F3B5D
   ============================================================ */
html[data-theme="marinho"]{
  --accent:      #2F3B5D;   /* creme 9.8:1 */
  --accent-deep: #232C47;   /* creme 12.3:1 */
  --accent-ink:  #141A2B;   /* creme 15.4:1 */
  --accent-soft: #5A6890;   /* creme 4.9:1 */

  --oliva:      #1B2238;
  --oliva-ink:  #101524;

  --ink:        #151A26;
  --muted:      #565D6E;

  --rgb-accent:     47,59,93;
  --rgb-accent-ink: 20,26,43;
  --rgb-shadow:    8,12,24;

  --line:       rgba(21,26,38,.20);
  --line-soft:  rgba(21,26,38,.09);
}
html[data-theme="marinho"] ::selection{ background:var(--accent); color:#fff; }
html[data-theme="marinho"] .cons-gallery img{
  filter:saturate(.9) contrast(1.04) brightness(1.03);
}
