/* ============================================================
   ANDRADE JOIAS — Landing Page (Editorial · Luxo Claro)
   Identidade: Brandbook Andrade — Azul Marinho + Dourado
   Paleta:  Sabedoria #242582 · Inteligência #111224 · Neutro #f4f4f4
   ============================================================ */

:root{
  /* ---- brand navy ---- */
  --navy:       #242582;   /* Sabedoria — azul marinho da marca */
  --navy-2:     #1c1c5e;
  --navy-deep:  #111224;   /* Inteligência — navy profundo (faixas/rodapé) */
  --navy-ink:   #0c0c14;
  --ink:        #14152a;   /* texto principal (navy quase preto) */

  /* ---- light surfaces ---- */
  --paper:      #ffffff;
  --cream:      #f7f6f1;   /* off-white quente — fundo padrão */
  --cream-2:    #efece3;
  --line:       rgba(20,21,42,.12);   /* hairline sobre claro */
  --line-strong:rgba(20,21,42,.2);
  --line-navy:  rgba(255,255,255,.14); /* hairline sobre navy */

  /* ---- gold ---- */
  --gold:       #c9a24a;   /* dourado metálico (lê bem no claro) */
  --gold-bright:#e8cd86;   /* dourado claro (sobre navy) */
  --gold-deep:  #a9842f;
  --gold-grad:  linear-gradient(100deg,#e3c071 0%,#c9a24a 52%,#a9842f 100%);
  --gold-soft:  linear-gradient(100deg,#caa24c,#a9842f);
  --gold-shine: linear-gradient(100deg,#a9842f 0%,#c9a24a 28%,#f3e1b4 50%,#c9a24a 72%,#a9842f 100%);

  /* ---- text roles ---- */
  --text:          #14152a;   /* sobre claro */
  --muted:         #585a72;
  --text-on-navy:  #f3f2ec;
  --muted-on-navy: #aab;

  --whats: #25d366;
  --maxw: 1240px;
  --ease: cubic-bezier(.22,.61,.36,1);
  --ease-out: cubic-bezier(.16,1,.3,1);
  --spring: cubic-bezier(.34,1.56,.64,1);
  --spring-soft: cubic-bezier(.22,1,.36,1);
  --fx-ease: cubic-bezier(.76,0,.24,1);

  --font-display: "Bebas Neue", Impact, sans-serif;
  --font-body:    "DM Sans", system-ui, -apple-system, sans-serif;
  --font-serif:   "Cormorant Garamond", Georgia, serif;
}

*,*::before,*::after{ box-sizing:border-box; margin:0; padding:0; }
html{ scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
@media (prefers-reduced-motion:reduce){
  html{ scroll-behavior:auto; }
  *,*::before,*::after{ animation-duration:.01ms!important; transition-duration:.01ms!important; }
}
body{
  font-family:var(--font-body);
  background:var(--cream); color:var(--text);
  line-height:1.62; overflow-x:hidden;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}
img{ max-width:100%; display:block; }
a{ color:inherit; text-decoration:none; }
ul{ list-style:none; }
button{ font-family:inherit; cursor:pointer; border:none; background:none; }
::selection{ background:var(--navy); color:#fff; }

:focus-visible{ outline:2px solid var(--gold); outline-offset:3px; border-radius:6px; }
.btn:focus-visible{ outline-offset:4px; }
a,button,summary,[tabindex]{ -webkit-tap-highlight-color:transparent; }

section[id]{ scroll-margin-top:96px; }

.container{ width:100%; max-width:var(--maxw); margin-inline:auto; padding-inline:clamp(20px,5vw,46px); }
.text-gold{ background:var(--gold-soft); -webkit-background-clip:text; background-clip:text;
  -webkit-text-fill-color:transparent; color:transparent; }

/* ---------- typography helpers ---------- */
.kicker{
  display:inline-block; font-family:var(--font-body); font-weight:600;
  font-size:.74rem; letter-spacing:.32em; text-transform:uppercase; color:var(--gold-deep);
  margin-bottom:18px;
}
.kicker--dark{ color:var(--gold-deep); }
.kicker--center{ display:block; text-align:center; }
.section__title{
  font-family:var(--font-display); font-weight:400; line-height:.96;
  font-size:clamp(2.6rem,6vw,5rem); letter-spacing:.01em; color:var(--ink);
}
.section__lead{ font-size:clamp(1rem,1.4vw,1.15rem); color:var(--muted); max-width:540px; }

/* ============================================================ PROGRESS */
.scroll-progress{ position:fixed; top:0; left:0; height:3px; width:0%; background:var(--gold-grad); z-index:1000;
  box-shadow:0 0 12px rgba(201,162,74,.5); transition:width .1s linear; }

/* ============================================================ PAGE/SECTION TRANSITION */
.pagefx{ position:fixed; inset:0; z-index:1200; pointer-events:none; display:grid; grid-template-columns:repeat(5,1fr); }
.pagefx span{ display:block; background:var(--navy); transform:scaleY(0); transform-origin:bottom; will-change:transform; }
.pagefx.is-cover span{ transform:scaleY(1); transition:transform .42s var(--fx-ease); }
.pagefx.is-reveal span{ transform:scaleY(0); transform-origin:top; transition:transform .42s var(--fx-ease); }
.pagefx.is-cover span:nth-child(1){ transition-delay:0s }
.pagefx.is-cover span:nth-child(2){ transition-delay:.05s }
.pagefx.is-cover span:nth-child(3){ transition-delay:.1s }
.pagefx.is-cover span:nth-child(4){ transition-delay:.15s }
.pagefx.is-cover span:nth-child(5){ transition-delay:.2s }
.pagefx.is-reveal span:nth-child(1){ transition-delay:.2s }
.pagefx.is-reveal span:nth-child(2){ transition-delay:.15s }
.pagefx.is-reveal span:nth-child(3){ transition-delay:.1s }
.pagefx.is-reveal span:nth-child(4){ transition-delay:.05s }
.pagefx.is-reveal span:nth-child(5){ transition-delay:0s }

/* ============================================================ HEADER */
.header{ position:fixed; top:0; left:0; right:0; z-index:900; padding:18px 0;
  transition:padding .4s var(--ease), background .4s var(--ease), box-shadow .4s, border-color .4s; border-bottom:1px solid transparent; }
.header.is-scrolled{ padding:10px 0; background:rgba(247,246,241,.9); backdrop-filter:blur(14px);
  border-bottom-color:var(--line); box-shadow:0 10px 30px rgba(20,21,42,.07); }
.header__inner{ display:flex; align-items:center; justify-content:space-between; gap:24px; }

.brand{ display:flex; align-items:center; gap:12px; }
.brand__logo{ height:38px; width:auto; display:block; transition:height .4s var(--ease); }
.header.is-scrolled .brand__logo{ height:32px; }

.nav{ display:flex; gap:4px; margin-left:auto; margin-right:8px; }
.nav__link{ position:relative; padding:9px 14px; font-size:.88rem; font-weight:500; color:var(--muted); border-radius:10px; transition:color .3s; }
.nav__link::after{ content:""; position:absolute; left:14px; right:14px; bottom:5px; height:1.5px; background:var(--gold-grad);
  transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.nav__link:hover,.nav__link.is-active{ color:var(--ink); }
.nav__link:hover::after,.nav__link.is-active::after{ transform:scaleX(1); }
.header__cta{ margin-left:2px; }

.nav-toggle{ display:none; flex-direction:column; gap:5px; width:44px; height:44px; align-items:center; justify-content:center; border-radius:10px; margin-left:auto; }
.nav-toggle span{ width:22px; height:2px; background:var(--ink); border-radius:2px; transition:transform .35s var(--ease), opacity .25s; }
.nav-toggle.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
.nav-toggle.is-open span:nth-child(2){ opacity:0; }
.nav-toggle.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* ============================================================ BUTTONS */
.btn{ position:relative; display:inline-flex; align-items:center; justify-content:center; gap:10px; overflow:hidden;
  font-family:var(--font-body); font-weight:600; font-size:.95rem; padding:15px 28px; border-radius:999px; white-space:nowrap;
  transition:transform .42s var(--spring), box-shadow .3s var(--ease), background .3s, color .3s, border-color .3s; }
.btn:active{ transform:scale(.95); transition-duration:.12s; }
.work:active{ transform:scale(.99); transition:transform .12s var(--ease); }
.acc__q:active{ opacity:.85; }
.btn--sm{ padding:11px 20px; font-size:.84rem; }
.btn--lg{ padding:17px 34px; font-size:1rem; }
.btn--xl{ padding:20px 44px; font-size:1.08rem; }
.btn--gold{ background:var(--gold-grad); color:#1c1505; box-shadow:0 14px 38px rgba(169,132,47,.3); }
.btn--gold:hover{ transform:translateY(-3px); box-shadow:0 20px 52px rgba(169,132,47,.42); }
.btn--ghost{ background:transparent; color:var(--navy); border:1.5px solid rgba(36,37,130,.32); }
.btn--ghost:hover{ border-color:var(--navy); background:rgba(36,37,130,.06); transform:translateY(-3px); }
.btn--dark{ background:var(--navy); color:#fff; box-shadow:0 14px 34px rgba(36,37,130,.26); }
.btn--dark:hover{ background:var(--navy-deep); transform:translateY(-3px); box-shadow:0 20px 46px rgba(17,18,36,.34); }
.btn--whats{ background:var(--gold-grad); color:#1c1505; box-shadow:0 18px 50px rgba(169,132,47,.4); }
.btn--whats:hover{ transform:translateY(-3px) scale(1.01); box-shadow:0 24px 64px rgba(169,132,47,.5); }
/* ghost button placed on navy bands */
.on-navy .btn--ghost,.btn--ghost.btn--on-navy{ color:#fff; border-color:rgba(255,255,255,.4); }
.on-navy .btn--ghost:hover,.btn--ghost.btn--on-navy:hover{ border-color:#fff; background:rgba(255,255,255,.1); }
[data-shine]::before{ content:""; position:absolute; top:0; left:-120%; width:60%; height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.55),transparent); transform:skewX(-20deg); }
[data-shine]:hover::before{ animation:shine 1s var(--ease); }
@keyframes shine{ to{ left:130%; } }

/* ============================================================ CAROUSEL (crossfade) */
.fc{ position:absolute; inset:0; z-index:0; }
.fc__slide{ position:absolute; inset:0; opacity:0; transition:opacity .7s var(--ease); }
.fc__slide.is-active{ opacity:1; }
.fc__slide img{ width:100%; height:100%; object-fit:cover; }
.fc__dots{ position:absolute; left:0; right:0; bottom:16px; z-index:5; display:flex; gap:7px; justify-content:center; }
.fc__dot{ width:7px; height:7px; border-radius:999px; background:rgba(255,255,255,.5);
  transition:width .4s var(--ease), background .4s; cursor:pointer; }
.fc__dot.is-active{ width:22px; background:var(--gold-bright); }

/* ============================================================ HERO (claro) */
.hero{ position:relative; min-height:100svh; display:flex; align-items:center; padding:128px 0 64px; overflow:hidden;
  background:
    radial-gradient(120% 80% at 88% 2%, rgba(201,162,74,.14), transparent 52%),
    radial-gradient(80% 70% at 0% 100%, rgba(36,37,130,.07), transparent 60%),
    var(--cream); }
.hero::before{ content:""; position:absolute; inset:0; z-index:0; pointer-events:none;
  background:radial-gradient(60% 50% at 78% 42%, rgba(201,162,74,.12), transparent 60%); }
.hero__inner{ position:relative; z-index:2; min-width:0; display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr); gap:48px; align-items:center; }
.hero__inner > *{ min-width:0; }

.eyebrow{ display:block; font-size:.72rem; font-weight:600; letter-spacing:.13em;
  text-transform:uppercase; color:var(--gold-deep); line-height:1.5; }
.eyebrow__line{ display:inline-block; width:28px; height:1px; background:var(--gold-deep); vertical-align:middle; margin-right:8px; }
.eyebrow--center{ text-align:center; }

.hero__title{ font-family:var(--font-display); font-weight:400; line-height:.94; letter-spacing:.01em;
  font-size:clamp(2.1rem,4.2vw,4rem); margin:16px 0 20px; color:var(--ink); }
.hero__title .reveal-line{ display:block; opacity:0; transform:translateY(40px); transition:opacity .8s var(--ease-out), transform .8s var(--ease-out); }
.hero__title .reveal-line.is-visible{ opacity:1; transform:none; }
.hero__subtitle{ font-size:clamp(1.02rem,1.5vw,1.18rem); color:var(--muted); max-width:500px; }
.hero__subtitle strong{ color:var(--ink); font-weight:600; }
.hero__actions{ display:flex; flex-wrap:wrap; gap:14px; margin:24px 0 26px; }
.hero__badges{ display:flex; flex-wrap:wrap; gap:20px 30px; }
.hero__badges li{ display:flex; flex-direction:column; }
.hero__badges b{ font-family:var(--font-display); font-size:1.9rem; font-weight:400; color:var(--navy); line-height:1; }
.hero__badges span{ font-size:.8rem; color:var(--muted); margin-top:4px; }

.hero__visual{ position:relative; max-width:444px; margin-left:auto; width:100%; }
/* halo dourado suave atrás do arco */
.hero__visual::before{ content:""; position:absolute; inset:-14% -10% -8% -10%; z-index:0; pointer-events:none;
  background:radial-gradient(60% 60% at 50% 42%, rgba(201,162,74,.3), rgba(201,162,74,.08) 46%, transparent 70%);
  filter:blur(8px); }
.hero__frame{ position:relative; z-index:1; border-radius:200px 200px 22px 22px; overflow:hidden; aspect-ratio:4/5;
  border:1px solid rgba(36,37,130,.16);
  box-shadow:
    0 50px 90px rgba(20,21,42,.22),
    0 0 0 1px rgba(255,255,255,.6),
    0 0 0 7px rgba(255,255,255,.55),
    0 0 60px 6px rgba(201,162,74,.16); }
.hero__frame::after{ content:""; position:absolute; inset:0; z-index:2; pointer-events:none;
  background:linear-gradient(180deg,transparent 56%,rgba(17,18,36,.5)); }
.hero__frame-tag{ position:absolute; left:0; right:0; bottom:36px; z-index:4; text-align:center; color:#f4ecd6;
  font-size:.78rem; font-weight:600; letter-spacing:.22em; text-transform:uppercase; pointer-events:none;
  text-shadow:0 2px 12px rgba(0,0,0,.5); }

/* ============================================================ BRANDS MARQUEE (faixa navy) */
.brands{ background:var(--navy-deep); border-top:1px solid var(--line-navy); border-bottom:1px solid var(--line-navy);
  overflow:hidden; padding:24px 0; }
.brands__track{ display:flex; align-items:center; gap:40px; width:max-content; white-space:nowrap; animation:marquee 40s linear infinite; }
.brands__track span{ font-family:var(--font-display); font-size:1.6rem; letter-spacing:.06em; color:var(--muted-on-navy);
  transition:color .3s; }
.brands__track:hover span{ color:#fff; }
.brands__track i{ color:var(--gold); font-size:.7rem; font-style:normal; }
@keyframes marquee{ from{ transform:translateX(0) } to{ transform:translateX(-50%) } }

/* ============================================================ SECTIONS */
.section{ position:relative; padding:clamp(74px,10vw,128px) 0; overflow:hidden; }
.section--light{ background:var(--paper); }
.section--cream{ background:var(--cream); }
.section--ink,.section--dark{ background:var(--cream); } /* aliases legados → claro */
.section__head{ max-width:760px; margin-bottom:clamp(44px,6vw,70px); }
.section__head--split{ max-width:none; display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:end; }
@media (max-width:780px){ .section__head--split{ grid-template-columns:1fr; gap:16px; } }

/* ============================================================ O QUE COMPRAMOS — work grid */
.grid-work{ display:grid; grid-template-columns:repeat(4,1fr); grid-auto-rows:230px; gap:18px; }
.work{ position:relative; grid-column:span 1; grid-row:span 1; border-radius:18px; overflow:hidden;
  border:1px solid var(--line); background:var(--navy-deep); box-shadow:0 18px 40px rgba(20,21,42,.1); }
.work--tall{ grid-column:span 2; grid-row:span 2; }
.work--w2{ grid-column:span 2; }
.work--full{ grid-column:span 4; }
.work img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1.1s var(--ease), filter .5s;
  filter:brightness(.82) saturate(1.04); }
.work::after{ content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(12,12,20,.94) 4%,rgba(12,12,20,.3) 50%,transparent 78%); }
.work:hover img{ transform:scale(1.07); filter:brightness(.9) saturate(1.1); }
.work__body{ position:absolute; inset:auto 0 0 0; z-index:2; padding:24px 24px 22px; }
.work__body h3{ font-family:var(--font-display); font-weight:400; font-size:1.7rem; letter-spacing:.01em; color:#fff; line-height:1; }
.work--tall .work__body h3,.work--full .work__body h3{ font-size:2.2rem; }
.work__body p{ font-size:.92rem; color:#dcdae8; margin-top:8px; max-width:52ch;
  opacity:0; max-height:0; overflow:hidden; transform:translateY(8px);
  transition:opacity .45s var(--ease), max-height .45s var(--ease), transform .45s var(--ease), margin-top .45s; }
.work:hover .work__body p, .work--tall .work__body p, .work--full .work__body p{ opacity:1; max-height:140px; transform:none; }
.work__tag{ display:inline-block; font-size:.66rem; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:#1c1505;
  background:var(--gold-grad); padding:5px 11px; border-radius:999px; margin-bottom:12px; }
.work__tag--alt{ background:transparent; color:var(--gold-bright); border:1px solid rgba(232,205,134,.5); }
.work__pills{ display:flex; flex-wrap:wrap; gap:7px; margin-top:14px; }
.work__pills span{ font-size:.74rem; font-weight:600; color:var(--gold-bright); padding:4px 11px; border-radius:999px;
  border:1px solid rgba(232,205,134,.34); background:rgba(232,205,134,.08); }

/* ============================================================ STATEMENT BAND (navy) */
.statement{ position:relative; min-height:62vh; display:flex; align-items:center; overflow:hidden; background:var(--navy-deep); }
.statement__media{ position:absolute; inset:0; z-index:0; }
.statement__media img{ width:100%; height:120%; object-fit:cover; filter:brightness(.32) saturate(1.05); will-change:transform; }
.statement::after{ content:""; position:absolute; inset:0; z-index:1;
  background:radial-gradient(120% 90% at 50% 50%,rgba(17,18,36,.55),rgba(12,12,20,.86)),linear-gradient(180deg,rgba(36,37,130,.25),transparent 60%); }
.statement__inner{ position:relative; z-index:2; text-align:center; padding:80px 0; }
.statement .kicker{ color:var(--gold-bright); }
.statement__title{ font-family:var(--font-display); font-weight:400; font-size:clamp(2.4rem,6vw,4.8rem);
  line-height:.98; letter-spacing:.01em; color:#fdfbf4; max-width:15ch; margin:16px auto 32px; }
.statement__title em{ font-style:normal; background:linear-gradient(100deg,#f3e1b4,#e8cd86 50%,#c9a24a);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }

/* ============================================================ STEPS */
.steps{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; border-top:1px solid var(--line); }
.step{ padding:40px 30px 38px; border-right:1px solid var(--line); position:relative; transition:background .4s; }
.step:last-child{ border-right:none; }
.step:hover{ background:rgba(36,37,130,.04); }
.step__num{ font-family:var(--font-display); font-size:3.4rem; line-height:1; color:transparent;
  -webkit-text-stroke:1.4px var(--gold); display:block; margin-bottom:18px; transition:color .4s, -webkit-text-stroke-color .4s; }
.step:hover .step__num{ color:var(--gold-deep); }
.step h3{ font-family:var(--font-display); font-weight:400; font-size:1.7rem; color:var(--ink); margin-bottom:10px; }
.step p{ font-size:.96rem; color:var(--muted); }
.step p strong{ color:var(--ink); }
.step__link{ display:inline-flex; align-items:center; gap:7px; margin-top:20px; font-weight:600; font-size:.9rem; color:var(--gold-deep); }
.step__link span{ transition:transform .3s var(--ease); }
.step__link:hover span{ transform:translateX(5px); }

/* ============================================================ DIFERENCIAIS (claro) */
.why{ display:grid; grid-template-columns:.92fr 1.08fr; gap:64px; align-items:center; }
.why__media{ position:relative; }
.why__photo{ position:relative; border-radius:22px; overflow:hidden; aspect-ratio:4/5; border:1px solid rgba(36,37,130,.16);
  box-shadow:0 40px 80px rgba(20,21,42,.18); }
.why__photo .fc__slide img{ width:100%; height:100%; object-fit:cover; }
.why__badge{ position:absolute; right:-18px; bottom:34px; padding:18px 22px; border-radius:16px; background:var(--gold-grad);
  color:#1c1505; box-shadow:0 22px 50px rgba(169,132,47,.32); max-width:220px; z-index:4; }
.why__badge strong{ display:block; font-family:var(--font-display); font-size:1.5rem; letter-spacing:.02em; }
.why__badge span{ font-size:.82rem; }
.why__list{ margin-top:34px; }
.why__item{ display:flex; gap:20px; padding:22px 0; border-top:1px solid var(--line); }
.why__item:last-child{ border-bottom:1px solid var(--line); }
.why__n{ font-family:var(--font-display); font-size:1.4rem; color:var(--gold-deep); flex:none; padding-top:2px; }
.why__item strong{ display:block; font-size:1.12rem; color:var(--ink); font-weight:600; }
.why__item p{ font-size:.94rem; color:var(--muted); margin-top:3px; }

/* ============================================================ FAQ */
.faq{ display:grid; grid-template-columns:.82fr 1.18fr; gap:56px; align-items:start; }
.faq > header{ position:sticky; top:110px; }
.faq__cta{ margin-top:24px; }
.accordion{ display:grid; gap:0; border-top:1px solid var(--line); }
.acc{ border-bottom:1px solid var(--line); }
.acc__q{ display:flex; align-items:center; justify-content:space-between; gap:18px; cursor:pointer; list-style:none;
  padding:26px 6px; font-family:var(--font-display); font-size:1.5rem; font-weight:400; letter-spacing:.01em;
  color:var(--ink); transition:color .3s, padding-left .3s; }
.acc__q::-webkit-details-marker{ display:none; }
.acc__q:hover{ color:var(--gold-deep); padding-left:14px; }
.acc__icon{ position:relative; flex:none; width:24px; height:24px; }
.acc__icon::before,.acc__icon::after{ content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  background:var(--gold-deep); border-radius:2px; transition:transform .35s var(--ease), opacity .3s; }
.acc__icon::before{ width:15px; height:2px; }
.acc__icon::after{ width:2px; height:15px; }
.acc[open] .acc__icon::after{ transform:translate(-50%,-50%) rotate(90deg); opacity:0; }
.acc__a{ display:grid; grid-template-rows:0fr; transition:grid-template-rows .42s var(--ease); }
.acc[open] .acc__a{ grid-template-rows:1fr; }
.acc__a > p{ overflow:hidden; padding:0 6px; color:var(--muted); font-size:1rem; max-width:64ch; }
.acc[open] .acc__a > p{ padding-bottom:26px; }

/* ============================================================ LOCALIZAÇÃO (claro) */
.loc{ display:grid; grid-template-columns:1fr 1.18fr; gap:52px; align-items:center; }
.loc__row{ display:flex; gap:18px; margin-top:28px; }
.loc__ic{ flex:none; width:46px; height:46px; display:grid; place-items:center; border-radius:12px;
  background:rgba(36,37,130,.07); border:1px solid rgba(36,37,130,.16); color:var(--navy); }
.loc__ic svg{ width:24px; height:24px; }
.loc__row strong{ display:block; font-family:var(--font-display); font-size:1.3rem; color:var(--ink); margin-bottom:4px; }
.loc__row p{ color:var(--muted); }
.loc__actions{ display:flex; flex-wrap:wrap; gap:14px; margin-top:36px; }
.loc__map{ position:relative; border-radius:24px; overflow:hidden; height:460px; isolation:isolate;
  border:1px solid rgba(36,37,130,.16); background:#e9e7df; transform-style:preserve-3d;
  box-shadow:0 50px 100px rgba(20,21,42,.18);
  transform:perspective(1600px) rotateX(3deg) rotateY(-5deg);
  transition:transform .7s var(--ease), box-shadow .7s var(--ease); }
.loc__map:hover{ transform:perspective(1600px) rotateX(0deg) rotateY(0deg);
  box-shadow:0 40px 90px rgba(20,21,42,.22); }
.loc__map::after{ content:""; position:absolute; inset:0; border-radius:inherit; z-index:2; pointer-events:none;
  box-shadow:inset 0 0 0 1px rgba(36,37,130,.08); }
.loc__iframe{ width:100%; height:100%; border:0; display:block;
  filter:grayscale(.18) contrast(1.04) saturate(.92);
  transition:filter .6s var(--ease); }
.loc__map:hover .loc__iframe{ filter:grayscale(0) contrast(1.02) saturate(1); }
.loc__chip{ position:absolute; top:18px; left:18px; z-index:4; display:inline-flex; align-items:center; gap:7px;
  padding:7px 13px 7px 10px; border-radius:999px; pointer-events:none;
  background:rgba(255,255,255,.92); border:1px solid rgba(36,37,130,.14); color:var(--navy);
  font-size:.75rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase;
  box-shadow:0 8px 22px rgba(20,21,42,.12); }
.loc__chip svg{ width:16px; height:16px; }

/* ============================================================ CTA FINAL (navy) */
.cta-final{ position:relative; overflow:hidden; padding:clamp(90px,12vw,150px) 0; text-align:center; background:var(--navy-deep); }
.cta-final__media{ position:absolute; inset:0; z-index:0; }
.cta-final__media img{ width:100%; height:100%; object-fit:cover; filter:brightness(.3) saturate(1.05); }
.cta-final::after{ content:""; position:absolute; inset:0; z-index:1;
  background:radial-gradient(110% 90% at 50% 26%,rgba(201,162,74,.2),transparent 52%),linear-gradient(180deg,rgba(17,18,36,.82),rgba(12,12,20,.92)); }
.cta-final__inner{ position:relative; z-index:2; max-width:780px; margin-inline:auto; }
.cta-final .eyebrow,.cta-final .eyebrow__line{ color:var(--gold-bright); background-color:var(--gold-bright); }
.cta-final .eyebrow{ background:none; }
.cta-final__title{ font-family:var(--font-display); font-weight:400; line-height:.96; font-size:clamp(2.8rem,7vw,5.4rem);
  margin:20px 0 18px; color:#fdfbf4; }
.cta-final__title .text-gold{ background:linear-gradient(100deg,#f3e1b4,#e8cd86 50%,#c9a24a);
  -webkit-background-clip:text; background-clip:text; -webkit-text-fill-color:transparent; }
.cta-final__text{ font-size:clamp(1.02rem,1.5vw,1.18rem); color:#c9cae0; max-width:560px; margin:0 auto 38px; }
.cta-final__note{ margin-top:22px; font-size:.85rem; color:#9a9cb8; letter-spacing:.04em; }

/* ============================================================ FOOTER (navy) */
.footer{ background:var(--navy-ink); border-top:1px solid var(--line-navy); padding-top:66px; color:var(--text-on-navy); }
.footer__inner{ display:grid; grid-template-columns:1.6fr 1fr 1.2fr; gap:42px; padding-bottom:50px; }
.footer__logo{ height:46px; width:auto; }
.footer__brand p{ margin-top:20px; color:var(--muted-on-navy); font-size:.94rem; max-width:340px; }
.footer__col h4{ font-family:var(--font-display); font-size:1.2rem; letter-spacing:.05em; color:var(--gold-bright); margin-bottom:18px; font-weight:400; }
.footer__col a,.footer__muted{ display:block; color:var(--muted-on-navy); font-size:.92rem; margin-bottom:11px; transition:color .3s; }
.footer__col a:hover{ color:var(--gold-bright); }
.footer__bottom{ border-top:1px solid rgba(255,255,255,.08); padding:22px 0; }
.footer__bottom-inner{ display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap; font-size:.83rem; color:var(--muted-on-navy); }
.footer__credit{ color:var(--gold); }

/* ============================================================ FLOATING WHATS */
.whats-float{ position:fixed; right:24px; bottom:24px; z-index:800; width:62px; height:62px; display:grid; place-items:center;
  border-radius:50%; background:var(--whats); color:#fff; box-shadow:0 14px 36px rgba(37,211,102,.5);
  transition:transform .35s var(--ease), box-shadow .35s; opacity:0; transform:translateY(20px) scale(.8); }
.whats-float.is-visible{ opacity:1; transform:none; }
.whats-float:hover{ transform:translateY(-4px) scale(1.06); }
.whats-float__pulse{ position:absolute; inset:0; border-radius:50%; border:2px solid var(--whats); animation:wp 2.2s var(--ease) infinite; }
@keyframes wp{ 0%{ transform:scale(1); opacity:.7 } 100%{ transform:scale(1.7); opacity:0 } }

/* ============================================================ REVEAL */
.reveal{ opacity:0; transform:translateY(34px); transition:opacity .7s var(--ease-out), transform .7s var(--ease-out); }
.reveal.is-visible{ opacity:1; transform:none; }

/* ============================================================ RESPONSIVE */
@media (max-width:1040px){
  .hero__inner{ grid-template-columns:minmax(0,1fr); gap:44px; }
  .hero__visual{ max-width:400px; margin-inline:auto; width:100%; }
  .why{ grid-template-columns:1fr; gap:40px; }
  .why__media{ max-width:420px; margin-inline:auto; }
  .faq{ grid-template-columns:1fr; gap:28px; }
  .faq > header{ position:static; }
  .loc{ grid-template-columns:1fr; }
  .grid-work{ grid-template-columns:repeat(2,1fr); grid-auto-rows:200px; }
  .work--tall,.work--w2,.work--full{ grid-column:span 2; }
}
@media (max-width:860px){
  .nav,.header__cta{ display:none; }
  .nav-toggle{ display:flex; }
  .nav.is-open{ display:flex; flex-direction:column; gap:2px; position:absolute; top:100%; left:0; right:0; padding:16px 24px 24px;
    background:rgba(247,246,241,.98); backdrop-filter:blur(18px); border-bottom:1px solid var(--line); box-shadow:0 24px 50px rgba(20,21,42,.18); }
  .nav.is-open .nav__link{ padding:14px 8px; font-size:1.05rem; color:var(--ink); border-bottom:1px solid var(--line); }
  .nav.is-open .nav__link::after{ display:none; }
  .steps{ grid-template-columns:1fr; }
  .step{ border-right:none; border-bottom:1px solid var(--line); }
  .step:last-child{ border-bottom:none; }
  .brands__track{ animation-duration:70s; }
}
@media (max-width:560px){
  .brands__track{ animation-duration:88s; }
  .hero{ padding:132px 0 70px; }
  .hero__actions .btn{ width:100%; }
  .hero__badges{ gap:22px; }
  .grid-work{ grid-template-columns:1fr; grid-auto-rows:auto; }
  .work,.work--tall,.work--w2,.work--full{ grid-column:span 1; grid-row:span 1; min-height:230px; }
  .work__body{ position:relative; padding:20px 20px 22px; }
  .work__body p{ opacity:1; max-height:none; transform:none; }
  .footer__inner{ grid-template-columns:1fr; }
  .loc__map{ height:330px; }
  .btn--xl{ width:100%; }
  .loc__actions .btn{ flex:1; }
}

/* ============================================================ POLISH & MOTION
   ui-ux-pro-max + framer-motion princípios → vanilla.
   Só transform/opacity (GPU). prefers-reduced-motion desliga tudo (regra global).
   ============================================================ */

/* brilho dourado suave varrendo as palavras de destaque */
@keyframes goldSweep{ to{ background-position:-200% 50%; } }
.text-gold,
.statement__title em,
.cta-final__title .text-gold{ background-size:200% auto; animation:goldSweep 6.5s linear infinite; }

/* hero: halo dourado "respirando" + entrada do arco em escala */
@keyframes haloBreath{ 0%,100%{ opacity:.8; transform:scale(1); } 50%{ opacity:1; transform:scale(1.05); } }
.hero__visual::before{ animation:haloBreath 6s var(--ease) infinite; }

/* variações de reveal por direção (JS só adiciona .is-visible) */
.reveal[data-reveal="scale"]{ transform:translateY(22px) scale(.965); }
.reveal[data-reveal="left"]{ transform:translateX(-46px); }
.reveal[data-reveal="right"]{ transform:translateX(46px); }

/* números do hero com figuras tabulares (sem "tremer" ao contar) */
.hero__badges b{ font-variant-numeric:tabular-nums; }

/* cards "O que compramos" — elevam no hover (desktop) */
.work{ transition:transform .5s var(--spring-soft), box-shadow .5s var(--ease); }
.work:hover{ transform:translateY(-6px); box-shadow:0 30px 64px rgba(20,21,42,.22); }

/* lista de diferenciais — leve realce no hover */
.why__item{ border-radius:12px; transition:background .4s var(--ease), padding-left .4s var(--ease); }
.why__item:hover{ background:rgba(36,37,130,.04); padding-left:12px; }
.why__item:hover .why__n{ color:var(--gold); }

/* passos — número sobe um toque no hover */
.step__num{ transition:color .4s, -webkit-text-stroke-color .4s, transform .45s var(--spring-soft); }
.step:hover .step__num{ transform:translateY(-4px); }

/* localização — ícone "ganha vida" no hover da linha */
.loc__ic{ transition:background .35s, color .35s, transform .5s var(--spring); }
.loc__row:hover .loc__ic{ background:var(--navy); color:#fff; transform:rotate(-6deg) scale(1.07); }

/* rodapé — sublinhado dourado animado nos links */
.footer__col a{ position:relative; width:fit-content; }
.footer__col a::after{ content:""; position:absolute; left:0; bottom:-2px; height:1px; width:100%;
  background:var(--gold); transform:scaleX(0); transform-origin:left; transition:transform .35s var(--ease); }
.footer__col a:hover::after{ transform:scaleX(1); }

/* botões magnéticos seguem o cursor (desktop, controlado por JS) */
.btn[data-magnetic]{ transition:transform .35s var(--ease-out), box-shadow .3s var(--ease), background .3s, color .3s; }

/* logo do header com leve resposta ao hover */
.brand__logo{ transition:transform .4s var(--spring-soft), filter .4s; }
.brand:hover .brand__logo{ transform:scale(1.04); }

/* dots do carrossel com área de toque confortável (>=44px) */
.fc__dot{ position:relative; }
.fc__dot::before{ content:""; position:absolute; inset:-16px; }

/* mantém is-visible com prioridade sobre as variações direcionais */
.reveal.is-visible{ transform:none; }