/* ============================================================
   AUTONOMA — Cinematic Stone design system
   Skin approved by Alex (style-lab Opção 2). Substance from autonoma-next.
   light = stone/ink · dark = deep ink · brass accent ≤5% · one giant serif
   Fonts self-hosted (/assets/fonts/fonts.css): Gambetta · General Sans · IBM Plex Mono
   ============================================================ */

/* ---------- tokens ---------- */
:root{
  --stone:#EFEBE4; --stone-2:#E6E1D8; --card:#F5F2EC;
  --ink:#171A1E; --ink-soft:#54575B; --ink-faint:#8F8B82;
  --brass:#A88544; --brass-on-dark:#C6A45E; --moss:#3E4A3D;
  --rule:#DAD4C8;
  /* semantic (flip per theme) */
  --page:#EFEBE4; --page-2:#E6E1D8; --surface:#F5F2EC;
  --tx:#171A1E; --tx-soft:#54575B; --tx-faint:#8F8B82;
  --line:#DAD4C8; --accent:#A88544;
  /* dark scene constants (always dark, both themes) */
  --scene-bg:#0e1013; --on-scene:#F7F4EE; --on-scene-soft:rgba(245,242,236,.82);
  /* legacy aliases (autonoma-next markup safety) */
  --navy:#171A1E; --navy-deep:#0e1013; --gold:#A88544; --gold-light:#C6A45E;
  --page-warm:#E6E1D8; --ink-mid:#54575B; --accent-ink:#A88544; --shadow:rgba(23,26,30,.08);
  --serif:'Gambetta',Georgia,serif;
  --sans:'General Sans',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,monospace;
}
:root[data-theme="dark"]{
  --page:#101317; --page-2:#0B0D11; --surface:#171B21;
  --tx:#ECE7DE; --tx-soft:#AEAAA1; --tx-faint:#6E6C64;
  --line:#262A31; --accent:#C6A45E;
  --navy:#ECE7DE; --navy-deep:#0B0D11; --gold:#C6A45E; --gold-light:#D6B978;
  --page-warm:#0B0D11; --ink-mid:#AEAAA1; --accent-ink:#C6A45E; --shadow:rgba(0,0,0,.4);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--page);color:var(--tx);line-height:1.62;overflow-x:hidden;overflow-x:clip;-webkit-font-smoothing:antialiased;transition:background .5s,color .5s}
img,svg,video{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
.wrap{max-width:1240px;margin:0 auto;padding:0 40px;position:relative;z-index:2}

/* label voices */
.eyebrow,.cap{font-family:var(--sans);font-weight:500;font-size:.68rem;letter-spacing:.3em;text-transform:uppercase;color:var(--tx-soft);display:inline-block}
.eyebrow{color:var(--accent)}
.coord{font-family:var(--mono);font-size:.64rem;letter-spacing:.08em;color:var(--tx-faint)}

/* ---------- BUTTONS ---------- */
.btn{display:inline-flex;align-items:center;gap:9px;font-family:var(--sans);font-weight:600;font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;padding:15px 28px;border-radius:2px;transition:transform .3s,background .3s,color .3s,border-color .3s;cursor:pointer;border:none}
.btn-gold,.btn-ink{background:var(--ink);color:var(--stone)}
.btn-gold:hover,.btn-ink:hover{transform:translateY(-2px);background:var(--brass);color:#fff}
:root[data-theme="dark"] .btn-gold,:root[data-theme="dark"] .btn-ink{background:var(--brass);color:var(--ink)}
:root[data-theme="dark"] .btn-gold:hover{background:var(--stone);color:var(--ink)}
.btn-stone{background:var(--stone);color:var(--ink)}.btn-stone:hover{background:var(--brass);color:#fff;transform:translateY(-2px)}
.btn-line,.btn-glass{background:rgba(255,255,255,.06);color:#F5F2EC;border:1px solid rgba(245,242,236,.45);backdrop-filter:blur(8px)}
.btn-line:hover,.btn-glass:hover{border-color:var(--brass-on-dark);color:var(--brass-on-dark)}
.btn-out{background:transparent;color:var(--tx);border:1px solid var(--tx)}
.btn-out:hover{background:var(--tx);color:var(--page)}

/* ---------- NAV ---------- */
.nav{position:fixed;top:0;left:0;right:0;z-index:100;transition:background .5s,box-shadow .5s,padding .5s;padding:24px 0}
.nav.scrolled{background:color-mix(in srgb,var(--page) 90%,transparent);backdrop-filter:blur(16px) saturate(140%);box-shadow:0 1px 0 var(--line);padding:12px 0}
.nav-in{max-width:1240px;margin:0 auto;padding:0 40px;display:flex;align-items:center;justify-content:space-between;gap:18px}
.nav-logo{display:flex;align-items:center;gap:12px}
.nav-logo .mark{width:34px;height:34px;flex:0 0 auto}
.nav-logo .wm{font-family:var(--sans);font-weight:600;font-size:.96rem;letter-spacing:.32em;text-transform:uppercase;line-height:1;color:#F5F2EC;text-shadow:0 1px 10px rgba(0,0,0,.4);transition:color .4s}
.nav.scrolled .nav-logo .wm{color:var(--tx);text-shadow:none}
.mark .cr{stroke:#F5F2EC;transition:stroke .3s}
.nav.scrolled .mark .cr{stroke:var(--tx)}
.nav-links{display:flex;align-items:center;gap:30px}
.nav-links a{font-family:var(--sans);font-weight:500;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,242,236,.82);transition:color .2s;text-shadow:0 1px 6px rgba(0,0,0,.4);position:relative}
.nav.scrolled .nav-links a{color:var(--tx-soft);text-shadow:none}
.nav-links a:hover,.nav-links a.active{color:var(--brass-on-dark)}
.nav.scrolled .nav-links a:hover,.nav.scrolled .nav-links a.active{color:var(--brass)}
/* dropdown */
.nav-drop{position:relative}
.nav-menu{position:absolute;top:calc(100% + 14px);left:-16px;min-width:220px;background:var(--surface);border:1px solid var(--line);border-radius:3px;box-shadow:0 20px 50px var(--shadow);padding:10px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;z-index:120}
.nav-drop:hover .nav-menu{opacity:1;visibility:visible;transform:none}
.nav-menu a{display:flex;align-items:center;gap:12px;padding:11px 14px;color:var(--tx-soft)!important;text-shadow:none!important;border-radius:2px;letter-spacing:.06em}
.nav-menu a:hover{background:var(--page-2);color:var(--tx)!important}
.nav-menu .ic{color:var(--brass);font-size:.6rem}
.nav-right{display:flex;align-items:center;gap:12px}
/* lang */
.lang{position:relative}
.lang-btn{display:flex;align-items:center;gap:7px;border:1px solid rgba(245,242,236,.36);border-radius:2px;padding:8px 12px;background:rgba(255,255,255,.06);color:rgba(245,242,236,.9);font-family:var(--mono);font-size:.64rem;cursor:pointer;transition:.3s}
.nav.scrolled .lang-btn{border-color:var(--line);background:var(--surface);color:var(--tx-soft)}
.lang-btn .flag{font-size:.9rem}
.lang-menu{position:absolute;top:calc(100% + 10px);right:0;min-width:210px;background:var(--surface);border:1px solid var(--line);border-radius:3px;box-shadow:0 20px 50px var(--shadow);padding:8px;opacity:0;visibility:hidden;transform:translateY(8px);transition:.25s;z-index:130}
.lang.open .lang-menu{opacity:1;visibility:visible;transform:none}
.lang-menu button{display:flex;width:100%;align-items:center;gap:9px;padding:9px 12px;background:none;border:none;color:var(--tx-soft);font-family:var(--sans);font-size:.85rem;cursor:pointer;border-radius:2px;text-align:left}
.lang-menu button:hover,.lang-menu button.active{background:var(--page-2);color:var(--tx)}
.lang-menu .grp{font-family:var(--sans);font-weight:500;font-size:.58rem;letter-spacing:.18em;text-transform:uppercase;color:var(--tx-faint);padding:10px 12px 4px}
/* theme */
.theme-btn{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(245,242,236,.36);background:rgba(255,255,255,.06);border-radius:2px;color:rgba(245,242,236,.9);cursor:pointer;transition:.3s}
.nav.scrolled .theme-btn{border-color:var(--line);background:var(--surface);color:var(--tx-soft)}
.theme-btn svg{width:17px;height:17px}
.theme-btn .i-sun{display:none}.theme-btn .i-moon{display:block}
:root[data-theme="dark"] .theme-btn .i-sun{display:block}
:root[data-theme="dark"] .theme-btn .i-moon{display:none}
.nav-cta{padding:11px 20px}
.hamb{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px}
.hamb span{width:22px;height:2px;background:#F5F2EC;border-radius:2px;transition:.3s}
.nav.scrolled .hamb span{background:var(--tx)}
/* páginas interiores (hero claro): nav começa com texto escuro — nunca invisível */
.nav.nav-lite:not(.scrolled) .nav-logo .wm{color:var(--tx);text-shadow:none}
.nav.nav-lite:not(.scrolled) .mark .cr{stroke:var(--tx)}
.nav.nav-lite:not(.scrolled) .nav-links a,.nav.nav-lite:not(.scrolled) .nav-links .drop-lbl{color:var(--tx-soft);text-shadow:none}
.nav.nav-lite:not(.scrolled) .nav-links a:hover,.nav.nav-lite:not(.scrolled) .nav-links a.active{color:var(--brass)}
.nav.nav-lite:not(.scrolled) .lang-btn{border-color:var(--line);background:var(--surface);color:var(--tx-soft)}
.nav.nav-lite:not(.scrolled) .theme-btn{border-color:var(--line);background:var(--surface);color:var(--tx-soft)}
.nav.nav-lite:not(.scrolled) .hamb span{background:var(--tx)}

/* ---------- HERO (home) ---------- */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;overflow:hidden;background:var(--scene-bg)}
.hero-mesh{position:absolute;inset:0;z-index:0;background:radial-gradient(120% 90% at 20% 20%,#1b2027,#0e1013 70%)}
.hero video,.hero-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-still{background:var(--scene-bg) center/cover no-repeat}
.hero-overlay,.hero-vig{position:absolute;inset:0;z-index:1;background:linear-gradient(100deg,rgba(10,11,13,.82) 0%,rgba(10,11,13,.42) 46%,rgba(10,11,13,.12) 72%,rgba(10,11,13,.42) 100%)}
.hero-content,.hero-inner{position:relative;z-index:2;width:100%}
.hero-badge{font-family:var(--sans);font-weight:500;font-size:.62rem;letter-spacing:.28em;text-transform:uppercase;color:rgba(245,242,236,.86);margin-bottom:22px;display:inline-flex;align-items:center;gap:8px}
.hero-badge .flags{font-size:1rem;letter-spacing:0}
.hero h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,5.2vw,4.6rem);line-height:1.06;letter-spacing:-.01em;color:#F7F4EE;max-width:17ch;text-shadow:0 2px 40px rgba(0,0,0,.4)}
.hero h1 em{font-style:italic;color:var(--brass-on-dark)}
.hero-sub{font-size:clamp(.98rem,1.25vw,1.1rem);font-weight:400;color:rgba(245,242,236,.9);margin:24px 0 30px;max-width:52ch}
.hero-ctas{display:flex;gap:14px;flex-wrap:wrap}
.h-anim{opacity:0;filter:blur(11px);transform:translateY(14px)}

/* enhanced scroll cue (#2 — more prominent than next's) */
.scrollcue{position:absolute;left:50%;transform:translateX(-50%);bottom:30px;z-index:3;display:flex;flex-direction:column;align-items:center;gap:12px;color:rgba(245,242,236,.75)}
.scrollcue span:first-child{font-family:var(--sans);font-weight:500;font-size:.6rem;letter-spacing:.34em;text-transform:uppercase}
.scrollcue .mouse{width:24px;height:38px;border:1.5px solid rgba(245,242,236,.6);border-radius:14px;position:relative}
.scrollcue .mouse::before{content:"";position:absolute;left:50%;top:7px;width:3px;height:7px;margin-left:-1.5px;border-radius:2px;background:var(--brass-on-dark);animation:wheel 1.8s ease-in-out infinite}
@keyframes wheel{0%{opacity:0;transform:translateY(-4px)}30%{opacity:1}60%{opacity:1;transform:translateY(8px)}100%{opacity:0;transform:translateY(12px)}}
.scrollcue .line{display:none}

/* ---------- interior page hero ---------- */
.hero-page{padding:150px 0 70px;background:var(--page-2);border-bottom:1px solid var(--line);position:relative;overflow:hidden}
.hero-page .back{font-family:var(--sans);font-weight:500;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--tx-soft)}
.hero-page .back:hover{color:var(--accent)}
.hero-page h1{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,5vw,4.2rem);line-height:1.02;letter-spacing:-.01em;margin:14px 0 18px;max-width:20ch}
.hero-page h1 em{font-style:italic;color:var(--accent)}
.hero-page p{font-size:1.1rem;color:var(--tx-soft);max-width:56ch}
/* interior hero with full-bleed video (niche pages) */
.hero-page.hero-media{background:var(--scene-bg);border:none;padding:0;min-height:88vh;display:flex;align-items:flex-end}
.hero-page.hero-media video,.hero-page.hero-media .hero-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.hero-page.hero-media .hero-vig{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,11,13,.35) 0%,rgba(10,11,13,.05) 42%,rgba(10,11,13,.78) 100%)}
.hero-page.hero-media .wrap{position:relative;z-index:2;padding-bottom:64px}
.hero-page.hero-media .back{color:rgba(245,242,236,.8)}
.hero-page.hero-media h1{color:#F7F4EE;text-shadow:0 2px 30px rgba(0,0,0,.4)}
.hero-page.hero-media h1 em{color:var(--brass-on-dark)}
.hero-page.hero-media p{color:rgba(245,242,236,.9)}

/* ---------- keyword strip / marquee ---------- */
.strip,.marquee{background:var(--page);border-top:1px solid var(--line);border-bottom:1px solid var(--line);overflow:hidden;padding:16px 0;white-space:nowrap}
.stripe-track,.marquee-track{display:inline-flex;animation:marq 48s linear infinite;will-change:transform}
.stripe-track span,.marquee-track span{font-family:var(--sans);font-weight:500;font-size:.7rem;letter-spacing:.28em;text-transform:uppercase;color:var(--tx-soft);padding:0 28px;position:relative}
.stripe-track span::after,.marquee-track span::after{content:"◇";position:absolute;right:-4px;top:1px;color:var(--brass);font-size:.5rem;letter-spacing:0}
@keyframes marq{to{transform:translateX(-50%)}}

/* ---------- sections ---------- */
section{position:relative}
.sec{padding:132px 0}
.sec-warm,.sec-alt{background:var(--page-2)}
.sec-head{max-width:820px;margin-bottom:64px}
.sec-head.center{margin-left:auto;margin-right:auto;text-align:center}
.sec-head .eyebrow{margin-bottom:20px}
.sec-head h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4.6vw,3.6rem);line-height:1.04;letter-spacing:-.01em}
.sec-head h2 em{font-style:italic;color:var(--accent)}
.sec-head p{margin-top:20px;font-size:1.08rem;font-weight:400;color:var(--tx-soft);max-width:56ch}
.sec-head.center p{margin-left:auto;margin-right:auto}
.reveal{opacity:0;transform:translateY(28px);transition:opacity 1.1s ease,transform 1.1s ease,filter 1.1s ease;filter:blur(6px)}
.reveal.in{opacity:1;transform:none;filter:none}
@media(prefers-reduced-motion:reduce){.reveal,.h-anim{opacity:1!important;transform:none!important;filter:none!important}}

/* watermark texture bg for a section (Alex 2026-07-08: visíveis, não fantasma — Codex sitev2 artwork, cream + gold line-art) */
.wm-tex::before{content:"";position:absolute;inset:0;background:var(--wm-img,url('/ops/approval-gallery/assets/aut-sitev2-watermark-01.jpg')) center/cover no-repeat;opacity:.55;z-index:0;pointer-events:none}
:root[data-theme="dark"] .wm-tex::before{opacity:.1;mix-blend-mode:screen}

/* ---------- ROUTER DOORS ---------- */
.doors{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.door{position:relative;overflow:hidden;padding:40px 32px 34px;background:var(--surface);border:1px solid var(--line);border-radius:3px;transition:transform .4s,border-color .4s,box-shadow .4s;min-height:280px;display:flex;flex-direction:column}
.door::before{content:"";position:absolute;inset:0;background:var(--door-tex) center/cover no-repeat;opacity:.16;z-index:0}
:root[data-theme="dark"] .door::before{opacity:.15;mix-blend-mode:screen}
.door:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 44px var(--shadow)}
.door>*{position:relative;z-index:1}
.dnum{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--accent);margin-bottom:20px}
.door h3{font-family:var(--serif);font-weight:400;font-size:1.55rem;line-height:1.12;margin-bottom:12px}
.door p{font-size:.96rem;color:var(--tx-soft);flex:1}
.dcta{margin-top:20px;font-family:var(--sans);font-weight:600;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);display:inline-flex;gap:8px;align-items:center}
.door:hover .arw{transform:translateX(5px)}.arw{transition:transform .3s}

/* ---------- WHAT WE DO cards ---------- */
.wcards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.wcard{position:relative;overflow:hidden;padding:38px 30px;background:var(--surface);border:1px solid var(--line);border-radius:3px;transition:transform .4s,border-color .4s,box-shadow .4s}
.wcard:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 44px var(--shadow)}
.wcard.spot::before{content:"";position:absolute;inset:0;background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--brass) 16%,transparent),transparent 60%);opacity:0;transition:opacity .4s;z-index:0}
.wcard.spot:hover::before{opacity:1}
.wcard>*{position:relative;z-index:1}
.wn{font-family:var(--mono);font-size:.8rem;letter-spacing:.1em;color:var(--accent);margin-bottom:16px}
.wcard h3{font-family:var(--serif);font-weight:400;font-size:1.4rem;line-height:1.12;margin-bottom:10px}
.wcard p{font-size:.95rem;color:var(--tx-soft);margin-bottom:16px}
.more{font-family:var(--sans);font-weight:600;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:2px;transition:gap .3s}
.more:hover{opacity:.75}

/* quiet ledger grid (opção-2 alt for what-we-do) */
.grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--line)}
.cell{padding:42px 32px 42px 0;border-bottom:1px solid var(--line);border-right:1px solid var(--line);transition:background .35s}
.cell:nth-child(3n){border-right:none}
.cell:not(:nth-child(3n+1)){padding-left:32px}
.cell:hover{background:var(--surface)}
.cell .n{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--accent)}
.cell h3{font-family:var(--serif);font-weight:400;font-size:1.55rem;line-height:1.08;margin:16px 0 8px}
.cell .meta{font-family:var(--sans);font-weight:500;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-faint);margin-bottom:12px}
.cell p{font-size:.95rem;color:var(--tx-soft)}

/* ---------- MOTION SHOWCASE ---------- */
.showcase{display:grid;grid-template-columns:1fr 1.2fr;background:var(--scene-bg);color:var(--on-scene);overflow:hidden}
.showcase-grid{display:contents}
.showcase-copy{padding:100px 60px;display:flex;flex-direction:column;justify-content:center}
.showcase-copy .eyebrow{color:var(--brass-on-dark);margin-bottom:18px}
.showcase-copy h2{font-family:var(--serif);font-weight:400;font-size:clamp(1.9rem,3.4vw,2.8rem);line-height:1.06;margin-bottom:16px;color:#F7F4EE}
.showcase-copy p{color:rgba(245,242,236,.82);max-width:44ch}
.showcase-video{position:relative;min-height:440px;background:#000}
.showcase-video video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.showcase-video::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--scene-bg) 0%,transparent 22%)}

/* ---------- full-bleed SCENE band ---------- */
.scene{position:relative;height:78vh;min-height:520px;overflow:hidden;background:var(--scene-bg);display:flex;align-items:flex-end}
.scene video,.scene-still{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:0}
.scene-vig{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,11,13,.3) 0%,rgba(10,11,13,.05) 40%,rgba(10,11,13,.7) 100%)}
.scene-in{position:relative;z-index:2;width:100%;padding-bottom:60px}
.scene .cap,.scene .eyebrow{color:rgba(245,242,236,.8);margin-bottom:18px}
.scene h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4.6vw,3.9rem);line-height:1.02;color:#F7F4EE;max-width:20ch;text-shadow:0 2px 30px rgba(0,0,0,.4)}
.scene h2 em{font-style:italic;color:var(--brass-on-dark)}
.scene .coord{color:rgba(245,242,236,.6);margin-top:22px}

/* ---------- SCROLL-CINEMATIC (home — typographic scenes, no clips) ---------- */
.cine{position:relative}
.cine-pin{position:sticky;top:0;height:100vh;overflow:hidden;background:var(--scene-bg)}
.cine-scene{position:absolute;inset:0;opacity:0;pointer-events:none}
.cine-scene.on{opacity:1;pointer-events:auto}
/* imagem-câmara: full-bleed, travela por scroll (scale+translate via JS) */
.cine-scene .cine-art{position:absolute;inset:0;width:100%;height:100%;z-index:0;background-size:cover;background-position:center;will-change:transform;transform:scale(1.35)}
.cine-scene .cine-vig{position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(10,11,13,.35) 0%,rgba(10,11,13,.12) 30%,rgba(10,11,13,.55) 72%,rgba(10,11,13,.92) 100%)}
.cine-cap{position:absolute;z-index:2;inset:0;display:flex;align-items:center;text-align:center;will-change:transform,opacity}
.cine-cap .wrap{width:100%}
.cine-cap .eyebrow{color:var(--brass-on-dark);margin-bottom:20px;text-shadow:0 2px 14px rgba(0,0,0,.7)}
.cine-cap h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.6rem,7vw,6rem);line-height:1;color:#F7F4EE;max-width:15ch;margin:0 auto;text-shadow:0 3px 34px rgba(0,0,0,.6)}
.cine-cap h2 em{font-style:italic;color:var(--brass-on-dark)}
.cine-cap p{color:rgba(245,242,236,.92);max-width:50ch;margin:22px auto 0;font-size:1.12rem;text-shadow:0 2px 18px rgba(0,0,0,.7)}
.cine-cap .cine-cta{margin-top:32px}
/* contador de cena (01 / 03) */
.cine-count{position:absolute;z-index:3;right:34px;top:calc(50% - 66px);transform:translateY(-100%);font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;color:rgba(245,242,236,.8);text-align:center;text-shadow:0 2px 8px rgba(0,0,0,.6)}
.cine-count b{color:var(--brass-on-dark);font-weight:400}
.cine-prog{position:absolute;z-index:3;right:40px;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:12px}
.cine-dot{width:9px;height:9px;border-radius:50%;border:1px solid rgba(245,242,236,.5);transition:.3s}
.cine-dot.on{background:var(--brass-on-dark);border-color:var(--brass-on-dark);transform:scale(1.25)}
.cine-track{height:360vh}

/* ---------- PROBLEM lines ---------- */
.pline{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:26px 0;border-bottom:1px solid var(--line);transition:padding-left .3s,border-color .3s}
.pline:first-of-type{border-top:1px solid var(--line)}
.pline:hover{padding-left:12px;border-color:var(--accent)}
.pline .q{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.2rem,2vw,1.55rem);line-height:1.3;color:var(--tx)}
.pline .q b{display:block;font-family:var(--sans);font-style:normal;font-weight:600;font-size:.66rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-top:10px}
.pline .go{font-size:1.6rem;color:var(--accent);transition:transform .3s}
.pline:hover .go{transform:translateX(6px)}

/* ---------- SERENITY / brand-art quote band (banner yt escuro, presença leve) ---------- */
.serenity{position:relative;padding:150px 0;overflow:hidden;background:var(--scene-bg);text-align:center;color:var(--on-scene)}
.serenity img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.6;z-index:0}
.serenity::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(circle at 50% 46%,rgba(10,11,13,.32),rgba(10,11,13,.72))}
.serenity .wrap{z-index:2}
.serenity blockquote{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,5vw,3.6rem);line-height:1.14;color:#F7F4EE}
.serenity blockquote em{font-style:italic;color:var(--brass-on-dark)}
.serenity .attr{font-family:var(--sans);font-weight:500;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,242,236,.7);margin-top:26px}

/* ---------- STEPS (how we work) ---------- */
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:26px}
.step{padding-top:24px;border-top:1px solid var(--tx);transition:border-color .3s}
.step:hover{border-color:var(--accent)}
.sn,.step .n{font-family:var(--mono);font-size:.72rem;letter-spacing:.1em;color:var(--accent)}
.step h4{font-family:var(--serif);font-weight:400;font-size:1.35rem;margin:14px 0 8px}
.step p{font-size:.92rem;color:var(--tx-soft)}

/* ---------- PROMISE (dark) — opção-2 skin: stamp art bottom-left ---------- */
.promise{background:var(--ink);color:var(--stone);position:relative;overflow:hidden}
:root[data-theme="dark"] .promise{background:#0B0D11}
.promise::before{content:"";position:absolute;inset:0;background:url('/ops/approval-gallery/assets/aut-util-dark-new-01.png') center/cover no-repeat;opacity:.2;mix-blend-mode:screen;pointer-events:none;z-index:0}
/* variante: textura kintsugi bem leve (Sobre) — texto por cima sempre legível */
.promise.p-kintsugi::before{inset:0;left:0;bottom:0;width:auto;height:auto;background:url('/ops/approval-gallery/assets/autonoma-banner-dark-yt-05.png') center/cover no-repeat;opacity:.14}
.promise.p-kintsugi::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(23,26,30,.55),rgba(23,26,30,.8))}
.promise .wrap{position:relative;z-index:2}
.promise .sec-head h2,.promise h2{color:#F7F4EE}.promise .sec-head h2 em{color:var(--brass-on-dark)}
.promise .eyebrow{color:var(--brass-on-dark)}
/* pull-quote discreto acima dos 5 princípios (migrado da secção serenity) */
.promise-quote{position:relative;z-index:2;font-family:var(--serif);font-weight:400;font-size:clamp(1.35rem,2.6vw,2rem);line-height:1.22;color:#F7F4EE;max-width:24ch;margin:-28px 0 56px;padding-left:22px;border-left:2px solid var(--brass-on-dark)}
.promise-quote em{font-style:italic;color:var(--brass-on-dark)}
.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:44px 40px;position:relative;z-index:2}
.pcell{border-top:1px solid rgba(245,242,236,.2);padding-top:22px;transition:border-color .3s}
.pcell:hover{border-color:var(--brass-on-dark)}
.pcell .n{font-family:var(--mono);font-size:.7rem;letter-spacing:.1em;color:var(--brass-on-dark)}
.pcell h4{font-family:var(--serif);font-style:italic;font-weight:400;font-size:1.45rem;color:#F7F4EE;margin:12px 0}
.pcell p{font-size:.94rem;color:rgba(245,242,236,.78)}
/* 7th principle — full-width signature closing band (below the 3x2 grid) */
/* #07 — no box: the band flows straight out of the promise scene. A large gilded
   globe emerges from the SAME navy, text breathes on the clean left; the gold
   hairline above is the only separator. */
.pfinal{position:relative;z-index:2;margin-top:54px;padding:clamp(64px,8vw,104px) clamp(24px,5vw,64px);text-align:left;overflow:hidden;border-top:1px solid color-mix(in srgb,var(--brass-on-dark) 55%,transparent)}
/* the artwork — anchored right, dissolving into the scene navy on every edge via a
   radial mask (no rectangle, no seam → reads as part of the section, not a pasted block) */
.pfinal::before{content:"";position:absolute;inset:0;background:url('/ops/approval-gallery/assets/aut-util-dark-new-04.png') right center/cover no-repeat;opacity:.72;z-index:0;pointer-events:none;-webkit-mask-image:radial-gradient(125% 155% at 90% 50%,#000 0%,#000 40%,transparent 74%);mask-image:radial-gradient(125% 155% at 90% 50%,#000 0%,#000 40%,transparent 74%)}
/* the compass stamp stays — a faint watermark grounding the text side, never a 2nd focal point */
.pfinal::after{content:"";position:absolute;left:clamp(-44px,-2.4vw,-22px);bottom:-40px;width:clamp(150px,18vw,230px);aspect-ratio:1;background:url('/ops/approval-gallery/assets/aut-util-stamp-02.png') center/contain no-repeat;opacity:.05;z-index:0;pointer-events:none}
.pfinal-in{position:relative;z-index:1;max-width:34ch;margin:0}
.pfinal-n{display:inline-block;font-family:var(--mono);font-size:.7rem;letter-spacing:.34em;color:var(--brass-on-dark);opacity:.85;margin-bottom:20px}
.pfinal-t{font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(2.1rem,4.6vw,3.3rem);line-height:1.08;color:var(--brass-on-dark);margin:0 0 18px}
.pfinal-p{font-family:var(--serif);font-weight:400;font-size:clamp(1.1rem,1.7vw,1.4rem);line-height:1.62;color:rgba(245,242,236,.9)}
.pfinal.reveal{transition-duration:1.7s;transition-delay:.2s}
/* stronger initial blur/offset scoped to the pre-reveal state ONLY — without :not(.in)
   this rule (equal specificity, later in source than .reveal.in) kept overriding
   filter/transform, so the band stayed blurred after revealing. */
.pfinal.reveal:not(.in){filter:blur(10px);transform:translateY(20px)}
@media(max-width:720px){.pfinal{text-align:center;padding:clamp(52px,9vw,76px) 22px;margin-top:40px}.pfinal-in{max-width:100%;margin:0 auto}.pfinal::before{background-position:center center;opacity:.5;-webkit-mask-image:radial-gradient(112% 128% at 50% 50%,#000 0%,#000 42%,transparent 80%);mask-image:radial-gradient(112% 128% at 50% 50%,#000 0%,#000 42%,transparent 80%)}.pfinal::after{display:none}}

/* banner geo contido perto da entrada — banner INTEIRO visível, nunca cortado */
.geo-card{padding:26px 0 0;background:var(--page)}
.geo-card img{width:100%;height:auto;display:block;border-radius:6px;border:1px solid var(--line);box-shadow:0 18px 44px var(--shadow)}

/* ---------- REGION (painel único full-bleed; a imagem troca por locale) ---------- */
.regions{position:relative}
.rp-panel{position:relative;min-height:92vh;overflow:hidden;background:#e9e3d8;display:flex;align-items:center}
/* duas camadas sobrepostas para o cross-fade suave ao trocar de língua */
.rp-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:72% center;opacity:0;transition:opacity .6s ease;will-change:opacity;animation:rpKen 26s ease-in-out infinite alternate}
.rp-img.on{opacity:1}
@keyframes rpKen{from{transform:scale(1.02)}to{transform:scale(1.12)}}
/* scrim suave só do lado esquerdo, onde vive o texto */
.rp-scrim{position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(244,240,232,.92) 0%,rgba(244,240,232,.55) 34%,rgba(244,240,232,0) 62%)}
.rp-cap{position:relative;z-index:2;width:100%}
.rp-cap .wrap{width:100%}
.rp-eyebrow{font-family:var(--sans);font-weight:500;font-size:.7rem;letter-spacing:.32em;text-transform:uppercase;color:var(--brass);margin-bottom:22px;display:inline-flex;align-items:center;gap:12px}
.rp-eyebrow .rp-flag{font-size:1.15rem;letter-spacing:0}
.rp-cap h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.2rem,5.4vw,4.6rem);line-height:1.04;color:var(--ink);max-width:15ch;text-shadow:0 1px 22px rgba(244,240,232,.7)}
.rp-cap h2 em{font-style:italic;color:var(--brass)}
@media(prefers-reduced-motion:reduce){.rp-img{animation:none}}
@media(max-width:900px){
  .rp-panel{min-height:80vh}
  .rp-img{object-position:68% center}
  /* scrim um pouco mais forte no telemóvel para o texto respirar sobre o mapa */
  .rp-scrim{background:linear-gradient(90deg,rgba(244,240,232,.95) 0%,rgba(244,240,232,.7) 42%,rgba(244,240,232,.1) 78%)}
}

/* ---------- textura clara atrás dos heróis interiores (abertura de página) ---------- */
/* B) fundo (compasso/logo) mais visível; texto acima dele sem colidir */
.hero-page.hero-tex::before{content:"";position:absolute;inset:0;background:var(--hero-tex-img,url('/ops/approval-gallery/assets/aut-util-existing-light-01.png')) center/cover no-repeat;opacity:.66;z-index:0;pointer-events:none}
:root[data-theme="dark"] .hero-page.hero-tex::before{opacity:.12}
.hero-page.hero-tex .wrap{position:relative;z-index:1}
/* mobile: âncora o motivo (compasso) no canto inferior-direito, contido, com folga
   por baixo do texto — o texto "sobe" e deixa de assentar sobre o logo */
@media(max-width:768px){
  .hero-page.hero-tex{padding-bottom:118px}
  .hero-page.hero-tex::before{background-position:right bottom;background-size:auto 38%;opacity:.62}
  :root[data-theme="dark"] .hero-page.hero-tex::before{opacity:.16}
}

/* ---------- UNHURRY teaser (próximo projeto — misterioso, nada clicável) ---------- */
.unhurry-teaser{cursor:default}
.uh-soon{display:inline-flex;align-items:center;gap:11px;font-family:var(--sans);font-weight:600;font-size:.66rem;letter-spacing:.24em;text-transform:uppercase;color:var(--accent);align-self:flex-start}
.uh-soon .uh-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);animation:soonPulse 2.2s ease-out infinite}
@keyframes soonPulse{0%{box-shadow:0 0 0 0 rgba(168,133,68,.45)}70%{box-shadow:0 0 0 12px rgba(168,133,68,0)}100%{box-shadow:0 0 0 0 rgba(168,133,68,0)}}
@media(prefers-reduced-motion:reduce){.uh-soon .uh-dot{animation:none}}

/* ---------- HP-STRIP / GEO / STAMP ---------- */
.hp-strip{position:relative;padding:110px 0;overflow:hidden;background:var(--scene-bg);color:var(--on-scene)}
.hp-strip .bgtex{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.28;z-index:0}
.hp-strip::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,11,13,.85),rgba(10,11,13,.55))}
.hp-strip .wrap{z-index:2}
.hp-strip .eyebrow{color:var(--brass-on-dark);margin-bottom:14px}
.hp-strip h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3.4vw,2.7rem);line-height:1.1;color:#F7F4EE;max-width:20ch}
.hp-strip h3 em{font-style:italic;color:var(--brass-on-dark)}
.hp-strip p{color:rgba(245,242,236,.82);max-width:60ch;margin:18px 0 22px}
.hplink{font-family:var(--sans);font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--brass-on-dark);border-bottom:1px solid var(--brass-on-dark);padding-bottom:3px}
.geo{position:relative;min-height:420px;display:flex;align-items:center;overflow:hidden;background:var(--scene-bg);color:var(--on-scene)}
.geo img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;opacity:.5;z-index:0}
.geo::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,rgba(10,11,13,.82),rgba(10,11,13,.4))}
.geo .geo-in{position:relative;z-index:2;width:100%}
.geo-copy{padding:60px 0}
.geo h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3.4vw,2.6rem);line-height:1.1;color:#F7F4EE;max-width:18ch}
.geo p{color:rgba(245,242,236,.82);max-width:48ch;margin-top:16px}
.stamp-divider{padding:70px 0;background:var(--scene-bg);text-align:center;overflow:hidden}
.stamp-divider img{max-width:420px;width:70%;margin:0 auto;opacity:.9;object-fit:contain}

/* ---------- UNHURRY door ---------- */
.unhurry{position:relative;display:grid;grid-template-columns:1.05fr .95fr;gap:0;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--surface);min-height:420px}
.unhurry-copy{padding:64px 54px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:2}
.unhurry-copy .eyebrow{color:var(--accent);margin-bottom:14px}
.unhurry-copy h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.7rem,3vw,2.5rem);line-height:1.1;margin-bottom:14px}
.unhurry-copy p{color:var(--tx-soft);max-width:42ch;margin-bottom:22px}
.uhlink{font-family:var(--sans);font-weight:600;font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:3px;align-self:flex-start}
.unhurry-media{position:relative;overflow:hidden;background:var(--scene-bg)}
.unhurry-media video,.unhurry-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.unhurry-media::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--surface) 0%,transparent 30%)}

/* ---------- START (opção-2 dark contact — "Começar um projeto") ---------- */
.start{background:var(--ink);color:var(--stone);position:relative;overflow:hidden}
:root[data-theme="dark"] .start{background:#0B0D11}
.start::before{content:"";position:absolute;inset:0;background:url('/ops/approval-gallery/assets/aut-util-dark-new-02.png') center/cover no-repeat;opacity:.46;mix-blend-mode:screen;filter:contrast(1.14) brightness(1.06);pointer-events:none}
.start .wrap{position:relative;z-index:2}
.start .eyebrow{color:var(--brass-on-dark)}
.start h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.1rem,4vw,3.2rem);line-height:1.04;color:#F7F4EE;margin:16px 0 20px}
.start h2 em{font-style:italic;color:var(--brass-on-dark)}
.start .leadp{font-size:1.06rem;color:rgba(245,242,236,.85);max-width:44ch;margin-bottom:28px}
.start .trust span{color:rgba(245,242,236,.78)}
.start-note{font-family:var(--mono);font-size:.66rem;letter-spacing:.04em;color:rgba(245,242,236,.62);line-height:2;border-top:1px solid rgba(245,242,236,.2);padding-top:20px;margin-top:26px}
.start-note a{color:rgba(245,242,236,.62)}.start-note a:hover{color:var(--brass-on-dark)}
.start .socials a{border-color:rgba(245,242,236,.28);color:rgba(245,242,236,.75)}
.start .socials a:hover{border-color:var(--brass-on-dark);color:var(--brass-on-dark)}
.start .au-form{background:transparent;border:none;padding:0}
.start .fld label{color:var(--brass-on-dark)}
.start .fld input,.start .fld textarea{background:rgba(245,242,236,.05);border:none;border-bottom:1px solid rgba(245,242,236,.28);border-radius:0;padding:11px 2px;color:#F7F4EE}
.start .fld input:focus,.start .fld textarea:focus{border-color:var(--brass-on-dark)}
.start .btn-gold{background:var(--stone);color:var(--ink)}
.start .btn-gold:hover{background:var(--brass-on-dark);color:var(--ink)}
.start .form-note{color:rgba(245,242,236,.55)}
.start .form-ok{background:rgba(245,242,236,.05);border-color:var(--brass-on-dark);color:#F7F4EE}
.start .form-ok p{color:rgba(245,242,236,.82)}

/* ---------- CONTACT ---------- */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:start}
.contact-lead .eyebrow{color:var(--accent)}
.contact-lead h2{font-family:var(--serif);font-weight:400;font-size:clamp(2rem,4vw,3rem);line-height:1.04;margin-bottom:16px}
.contact-lead h2 em{font-style:italic;color:var(--accent)}
.contact-lead p{color:var(--tx-soft);max-width:44ch}
.trust{display:flex;flex-wrap:wrap;gap:16px;margin-top:22px}
.trust span{font-family:var(--sans);font-weight:500;font-size:.8rem;color:var(--tx-soft)}
.socials{display:flex;gap:12px}
.socials a{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:2px;color:var(--tx-soft);transition:.3s}
.socials a:hover{border-color:var(--accent);color:var(--accent)}
.socials a svg{width:18px;height:18px}
.au-form,form.au-form{display:flex;flex-direction:column;gap:18px;background:var(--surface);border:1px solid var(--line);padding:34px;border-radius:4px}
.fld label,.field label{font-family:var(--sans);font-weight:500;font-size:.6rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:8px}
.fld input,.fld textarea,.field input,.field textarea{width:100%;background:var(--page);border:1px solid var(--line);border-radius:2px;padding:12px 14px;font-family:var(--sans);font-size:.98rem;color:var(--tx);transition:border-color .25s}
.fld input:focus,.fld textarea:focus,.field input:focus,.field textarea:focus{outline:none;border-color:var(--accent)}
.fld textarea,.field textarea{resize:vertical;min-height:110px}
.form-note{font-family:var(--mono);font-size:.66rem;letter-spacing:.02em;color:var(--tx-faint);text-align:center}
.form-ok{display:none;padding:36px;text-align:center;border:1px solid var(--accent);border-radius:4px;background:var(--surface)}
.form-ok.show{display:block}
.form-ok h4{font-family:var(--serif);font-style:italic;font-size:1.5rem;margin-bottom:8px}
.form-ok p{color:var(--tx-soft)}
/* honest-submit error — injected via JS only when BOTH endpoints fail */
.form-err{display:none;padding:12px 14px;border:1px solid #B4552D;border-radius:4px;background:rgba(180,85,45,.08);color:var(--tx);font-size:.88rem;line-height:1.5}
.form-err.show{display:block}
.start .form-err{color:#F7F4EE;border-color:#C97B54;background:rgba(201,123,84,.14)}

/* ---------- SERVICE showcase (services.html redesign #9) ---------- */
.svc-showcase{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.svc-tile{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--surface);display:flex;flex-direction:column;min-height:340px;transition:transform .4s,box-shadow .4s,border-color .4s}
.svc-tile:hover{transform:translateY(-5px);box-shadow:0 22px 50px var(--shadow);border-color:var(--accent)}
.svc-tile .svc-media{position:relative;height:170px;overflow:hidden;background:var(--scene-bg)}
.svc-tile .svc-media video,.svc-tile .svc-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.svc-tile .svc-body{padding:26px 26px 28px;display:flex;flex-direction:column;flex:1}
.svc-tile .wn{margin-bottom:10px}
.svc-tile h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;line-height:1.1;margin-bottom:8px}
.svc-tile p{font-size:.92rem;color:var(--tx-soft);flex:1;margin-bottom:16px}
/* service detail block */
.svc-block{padding:100px 0;border-top:1px solid var(--line)}
.svc-detail{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.svc-detail.rev .svc-detail-media{order:-1}
.svc-detail-copy .wn{margin-bottom:14px}
.svc-detail-copy h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,3vw,2.3rem);line-height:1.08;margin-bottom:14px}
.svc-detail-copy p{color:var(--tx-soft);margin-bottom:14px}
.svc-detail-media{position:relative;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--scene-bg);min-height:360px}
.svc-detail-media video,.svc-detail-media img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.svc-niche-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:6px}
.svc-niche-tags a,.svc-niche-tags span{font-family:var(--sans);font-weight:500;font-size:.72rem;letter-spacing:.04em;color:var(--tx-soft);border:1px solid var(--line);padding:6px 13px;border-radius:40px;transition:.3s}
.svc-niche-tags a:hover{border-color:var(--accent);color:var(--accent)}

/* ---------- DEMOS (services practical) ---------- */
.demo{display:grid;grid-template-columns:1fr 1fr;gap:52px;align-items:center}
.demo-copy .eyebrow{color:var(--accent)}
.demo-copy h3{font-family:var(--serif);font-weight:400;font-size:clamp(1.5rem,2.6vw,2rem);line-height:1.1;margin:8px 0 12px}
.demo-copy p{color:var(--tx-soft)}
.wa-phone{max-width:340px;margin:0 auto;background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:16px;box-shadow:0 20px 50px var(--shadow)}
.wa-top{display:flex;align-items:center;gap:10px;padding-bottom:12px;border-bottom:1px solid var(--line);margin-bottom:12px}
.wa-av,.cb-av{width:34px;height:34px;border-radius:50%;background:var(--brass);color:#fff;display:grid;place-items:center;font-weight:600;font-family:var(--serif)}
.wa-name{font-weight:600;font-size:.9rem}.wa-st{font-size:.72rem;color:var(--tx-soft)}
.wa-body{display:flex;flex-direction:column;gap:8px}
.wa-msg,.cb-msg{padding:9px 13px;border-radius:14px;font-size:.86rem;max-width:82%;line-height:1.4}
.wa-in,.cb-bot{background:var(--page-2);color:var(--tx);align-self:flex-start;border-bottom-left-radius:4px}
.wa-out,.cb-user{background:var(--brass);color:#fff;align-self:flex-end;border-bottom-right-radius:4px}
.wa-badge{font-size:.68rem;color:var(--tx-faint);text-align:center;margin-top:6px;font-family:var(--mono)}
.ba{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.ba-card{padding:24px;border-radius:4px;border:1px solid var(--line);background:var(--surface)}
.ba-card.before{opacity:.72}.ba-card.after{border-color:var(--accent)}
.ba-lbl{font-family:var(--sans);font-weight:600;font-size:.62rem;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);margin-bottom:10px}
.ba .stars{color:var(--brass);letter-spacing:2px;margin-bottom:8px}
.ba-card p{font-size:.9rem;color:var(--tx-soft)}

/* ---------- svc-mock — cada card de serviço mostra o próprio serviço ---------- */
.svc-mock{position:absolute;inset:0;display:grid;place-items:center;padding:16px;background:linear-gradient(135deg,var(--page-2),var(--surface))}
:root[data-theme="dark"] .svc-mock{background:linear-gradient(135deg,#12161B,#171B21)}
.mini-browser{width:88%;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--scene-bg);box-shadow:0 14px 30px var(--shadow)}
.mini-browser .mb-bar{display:flex;gap:5px;padding:7px 10px;background:var(--surface);border-bottom:1px solid var(--line)}
.mini-browser .mb-bar i{width:7px;height:7px;border-radius:50%;background:var(--tx-faint);opacity:.55}
.mini-browser .mb-bar i:first-child{background:var(--brass);opacity:1}
.mini-browser img{width:100%;height:108px;object-fit:cover;display:block}
.mini-chat{width:82%;max-width:250px;display:flex;flex-direction:column;gap:8px}
.mini-chat .cb-msg{font-size:.8rem;box-shadow:0 6px 16px var(--shadow)}
.mini-wa{width:82%;max-width:250px;display:flex;flex-direction:column;gap:8px}
.mini-wa .wa-msg{font-size:.8rem;box-shadow:0 6px 16px var(--shadow)}
.svc-mock .rev-card{box-shadow:0 10px 26px var(--shadow)}
/* logo Autonoma no header do assistente */
.aw-logo{width:30px;height:30px;border-radius:50%;border:1px solid var(--brass);background:var(--page-2);display:grid;place-items:center;flex:0 0 auto}
/* moldura WhatsApp real */
.wa-frame{width:88%;max-width:270px;border-radius:12px;overflow:hidden;border:1px solid var(--line);box-shadow:0 12px 30px var(--shadow);background:#ECE5DD}
.wa-head{display:flex;align-items:center;gap:9px;padding:9px 13px;background:#075E54;color:#fff}
.wa-title{font-weight:600;font-size:.82rem;line-height:1.15}
.wa-sub{font-size:.64rem;opacity:.75}
.wa-chat{padding:12px 12px 10px;display:flex;flex-direction:column;gap:7px}
.wam{max-width:86%;padding:7px 11px;border-radius:9px;font-size:.8rem;line-height:1.4;color:#1B1B1B;box-shadow:0 1px 1px rgba(0,0,0,.12)}
.wam.in{background:#fff;align-self:flex-start;border-top-left-radius:2px}
.wam.out{background:#DCF8C6;align-self:flex-end;border-top-right-radius:2px}
.wam .ticks{font-style:normal;font-size:.66rem;color:#4FC3F7;margin-left:6px}
.wa-chat .wa-badge{color:#5b6b62}
.wa-av-green{width:34px;height:34px;border-radius:50%;background:#25D366;display:grid;place-items:center;flex:0 0 auto}
/* convite pós-serviço */
.invite-card{width:88%;max-width:262px;background:var(--surface);border:1px solid var(--line);border-radius:12px;padding:16px 18px;box-shadow:0 12px 30px var(--shadow)}
.inv-tag{font-family:var(--sans);font-weight:600;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);margin-bottom:8px}
.inv-msg{font-size:.84rem;color:var(--tx-soft);line-height:1.5;margin-bottom:10px}
.mnt-mock{width:82%;max-width:240px;background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px;box-shadow:0 10px 26px var(--shadow)}
.mnt-mock .row{display:flex;align-items:center;gap:9px;font-size:.8rem;color:var(--tx-soft);padding:4px 0}
.mnt-mock .row b{color:#4CAF7D;font-weight:700}
.mnt-mock .up{display:flex;align-items:center;gap:8px;margin-top:8px;padding-top:9px;border-top:1px solid var(--line);font-family:var(--mono);font-size:.66rem;color:var(--tx-faint)}
.mnt-mock .up i{width:8px;height:8px;border-radius:50%;background:#4CAF7D;box-shadow:0 0 7px #4CAF7D;animation:pulse-dot 2s infinite}
@keyframes pulse-dot{0%,100%{opacity:1}50%{opacity:.4}}

/* ---------- phone-frame reel (IG card — 9:16 inside a device) ---------- */
.phone-reel{position:absolute;inset:0;display:grid;place-items:center;background:var(--scene-bg)}
.phone-reel::before{content:"";position:absolute;inset:0;background:url('/assets/images/site-exclusive/reel-greenpark-9x16-still.jpg') center/cover no-repeat;filter:blur(22px) brightness(.5);transform:scale(1.15)}
.phone-reel .phone{position:relative;height:86%;aspect-ratio:9/17.5;border-radius:22px;border:3px solid #2a2e34;background:#000;overflow:hidden;box-shadow:0 18px 44px rgba(0,0,0,.5)}
.phone-reel .phone::before{content:"";position:absolute;top:7px;left:50%;transform:translateX(-50%);width:34%;height:9px;border-radius:6px;background:#2a2e34;z-index:2}
.phone-reel video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.phone-reel .ig-tag{position:absolute;bottom:10px;left:50%;transform:translateX(-50%);z-index:2;font-family:var(--sans);font-weight:600;font-size:.56rem;letter-spacing:.12em;text-transform:uppercase;color:rgba(245,242,236,.9);background:rgba(10,11,13,.55);backdrop-filter:blur(6px);padding:4px 10px;border-radius:20px;white-space:nowrap}

/* ---------- assistant window (work card 02) ---------- */
.asst-win{width:100%;max-width:300px;background:var(--surface);border:1px solid var(--line);border-radius:14px;overflow:hidden;box-shadow:0 18px 44px var(--shadow)}
.asst-win .aw-head{display:flex;align-items:center;gap:9px;padding:11px 14px;background:var(--page-2);border-bottom:1px solid var(--line)}
.asst-win .aw-name{font-weight:600;font-size:.84rem}
.asst-win .aw-st{font-size:.68rem;color:var(--tx-soft)}
.asst-win .aw-dot{margin-left:auto;width:8px;height:8px;border-radius:50%;background:#4CAF7D;box-shadow:0 0 6px #4CAF7D}
.asst-win .cb-msgs{padding:14px}

/* ---------- review mock (work card 05) ---------- */
.rev-mock{width:100%;max-width:330px;display:flex;flex-direction:column;gap:10px}
.rev-card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:14px 16px;box-shadow:0 10px 26px var(--shadow)}
.rev-top{display:flex;align-items:center;gap:10px;margin-bottom:6px}
.rev-avatar{width:30px;height:30px;border-radius:50%;background:var(--brass);color:#fff;display:grid;place-items:center;font-family:var(--serif);font-size:.9rem}
.rev-name{font-weight:600;font-size:.84rem}
.rev-when{font-size:.68rem;color:var(--tx-faint)}
.rev-stars{color:var(--brass);letter-spacing:3px;font-size:.95rem}
.rev-stars .st{opacity:0;display:inline-block;transform:scale(.4)}
.rev-card.lit .st,.rev-stars.lit .st{animation:starpop .5s ease forwards}
.rev-card.lit .st:nth-child(2),.rev-stars.lit .st:nth-child(2){animation-delay:.15s}.rev-card.lit .st:nth-child(3),.rev-stars.lit .st:nth-child(3){animation-delay:.3s}.rev-card.lit .st:nth-child(4),.rev-stars.lit .st:nth-child(4){animation-delay:.45s}.rev-card.lit .st:nth-child(5),.rev-stars.lit .st:nth-child(5){animation-delay:.6s}
@keyframes starpop{to{opacity:1;transform:scale(1)}}
.rev-txt{font-size:.84rem;color:var(--tx-soft);margin-top:6px;line-height:1.5}
.rev-badge{align-self:center;font-family:var(--mono);font-size:.64rem;color:var(--tx-faint)}

/* ---------- WhatsApp live-run (messages appear in sequence) ---------- */
.wa-run .wa-msg{opacity:0;transform:translateY(8px)}
.wa-run .wa-msg.go{animation:waIn .45s ease forwards}
.wa-run .wa-badge{opacity:0;transition:opacity .5s}
.wa-run .wa-badge.go{opacity:1}
@keyframes waIn{to{opacity:1;transform:none}}
.wa-typing{display:inline-flex;gap:4px;padding:10px 13px;border-radius:14px;background:var(--page-2);align-self:flex-start;opacity:0}
.wa-typing.go{opacity:1}
.wa-typing i{width:6px;height:6px;border-radius:50%;background:var(--tx-faint);animation:tydot 1s infinite}
.wa-typing i:nth-child(2){animation-delay:.18s}.wa-typing i:nth-child(3){animation-delay:.36s}
@keyframes tydot{0%,60%,100%{transform:translateY(0);opacity:.5}30%{transform:translateY(-4px);opacity:1}}

/* ---------- WORK cards (#10) ---------- */
.work-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:26px}
.work-card{position:relative;overflow:hidden;border:1px solid var(--line);border-radius:4px;background:var(--surface);transition:transform .4s,box-shadow .4s,border-color .4s}
.work-card:hover{transform:translateY(-5px);box-shadow:0 22px 54px var(--shadow);border-color:var(--accent)}
.work-media{position:relative;height:280px;overflow:hidden;background:var(--scene-bg)}
.work-media video,.work-media img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .6s}
.work-card:hover .work-media img,.work-card:hover .work-media video{transform:scale(1.05)}
.work-body{padding:26px 28px 30px}
.work-body .eyebrow{color:var(--accent);font-size:.62rem;margin-bottom:8px}
.work-body h3{font-family:var(--serif);font-weight:400;font-size:1.4rem;line-height:1.1;margin-bottom:8px}
.work-body p{font-size:.94rem;color:var(--tx-soft)}
/* before/after slider card */
.ba-slider{position:absolute;inset:0}
.ba-slider .after-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-slider .before-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;clip-path:inset(0 50% 0 0)}
.ba-slider .handle{position:absolute;top:0;bottom:0;left:50%;width:2px;background:var(--brass-on-dark);z-index:3}
.ba-slider .handle::after{content:"⟷";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:34px;height:34px;background:var(--brass);color:#fff;border-radius:50%;display:grid;place-items:center;font-size:.9rem}

/* ---------- LABS (#12 preserve + interactive) ---------- */
.lab-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.lab{border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--surface)}
.lab-stage{position:relative;height:200px;overflow:hidden;background:var(--scene-bg);display:grid;place-items:center}
.lab-cursor{cursor:crosshair}
.lab-cursor .glow{position:absolute;width:200px;height:200px;border-radius:50%;background:radial-gradient(circle,var(--brass-on-dark),transparent 60%);left:var(--lx,50%);top:var(--ly,50%);transform:translate(-50%,-50%);opacity:.6;pointer-events:none;filter:blur(6px)}
.lab-cursor .hint{position:relative;z-index:2;font-family:var(--sans);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,242,236,.7)}
.lab-blur .word{font-family:var(--serif);font-size:2.4rem;color:#F7F4EE;filter:blur(9px);animation:labblur 3.4s ease-in-out infinite alternate}
@keyframes labblur{to{filter:blur(0)}}
.lab-grad .field{position:absolute;inset:0;background:linear-gradient(120deg,#1b2027,var(--moss),var(--brass));background-size:220% 220%;animation:labgrad 8s ease infinite;opacity:.7}
@keyframes labgrad{0%{background-position:0 0}50%{background-position:100% 100%}100%{background-position:0 0}}
.lab-grad .lbl{position:relative;z-index:2;font-family:var(--sans);font-weight:500;font-size:.7rem;letter-spacing:.2em;text-transform:uppercase;color:#F7F4EE}
.lab-count{font-family:var(--serif);font-size:2.4rem;color:#F7F4EE}
.lab-count .num{color:var(--brass-on-dark)}
.lab-meta{padding:20px 22px 24px}
.lab-meta h3{font-family:var(--serif);font-weight:400;font-size:1.25rem;margin-bottom:6px}
.lab-meta p{font-size:.9rem;color:var(--tx-soft)}
.concept-note{display:flex;align-items:center;gap:14px;padding:22px 26px;border:1px solid var(--line);border-radius:4px;background:var(--surface);color:var(--tx-soft);font-size:.95rem}
.concept-note .ic{color:var(--accent);font-size:1.1rem}
/* labs module catalog — every card carries a LIVE mini-demo */
.lab-modules{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.lab-mod{border:1px solid var(--line);border-radius:4px;background:var(--surface);transition:.3s;overflow:hidden}
.lab-mod:hover{border-color:var(--accent);transform:translateY(-3px)}
.lab-mod .lm-body{padding:18px 22px 22px}
.lab-mod h4{font-family:var(--serif);font-weight:400;font-size:1.15rem;margin-bottom:6px}
.lab-mod p{font-size:.88rem;color:var(--tx-soft)}
.lab-mod .tag{font-family:var(--mono);font-size:.62rem;letter-spacing:.06em;color:var(--accent);text-transform:uppercase}
.lm-stage{position:relative;height:150px;background:var(--scene-bg);overflow:hidden;display:grid;place-items:center;border-bottom:1px solid var(--line)}
/* 1 cinematic scroll — auto crossfade scenes */
.lm-cine img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;animation:lmcine 7s infinite}
.lm-cine img:nth-child(2){animation-delay:3.5s}
@keyframes lmcine{0%,45%{opacity:1}55%,95%{opacity:0}100%{opacity:1}}
/* 2 text mask — image through giant letters */
.lm-mask span{font-family:var(--serif);font-weight:700;font-size:3.2rem;letter-spacing:.02em;background:url('/assets/images/site-exclusive/still-hotel-window.jpg') center/cover;-webkit-background-clip:text;background-clip:text;color:transparent;animation:lmmaskpan 9s ease-in-out infinite alternate}
@keyframes lmmaskpan{to{background-position:70% 60%}}
/* 3 sticky stack — cards stack in loop */
.lm-stack{perspective:600px}
.lm-stack i{position:absolute;left:50%;top:50%;width:110px;height:70px;margin:-35px 0 0 -55px;border-radius:6px;background:var(--card);border:1px solid var(--brass);opacity:0;animation:lmstack 4.6s infinite}
.lm-stack i:nth-child(2){animation-delay:1.5s;background:#DED8CC}
.lm-stack i:nth-child(3){animation-delay:3s;background:#CFC8BA}
@keyframes lmstack{0%{opacity:0;transform:translateY(70px) scale(.9)}18%,60%{opacity:1;transform:translateY(0) scale(1)}80%,100%{opacity:0;transform:translateY(-16px) scale(.96)}}
/* 4 zoom parallax — layers follow pointer */
.lm-parallax{cursor:crosshair}
.lm-parallax .ly{position:absolute;inset:-8%;background:center/cover no-repeat;transition:transform .25s ease-out;will-change:transform}
.lm-parallax .ly.b{filter:brightness(.55)}
.lm-parallax .ly.f{display:grid;place-items:center;background:none}
.lm-parallax .ly.f span{font-family:var(--serif);font-size:1.5rem;color:#F7F4EE;text-shadow:0 2px 18px rgba(0,0,0,.7)}
/* 5 image trail */
.lm-trail{cursor:crosshair}
.lm-trail .tr{position:absolute;width:44px;height:30px;border-radius:3px;background:center/cover;pointer-events:none;animation:lmtrail .9s ease forwards}
@keyframes lmtrail{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(.6) translateY(8px)}}
.lm-trail .hint,.lm-parallax .hint{position:relative;z-index:2;font-family:var(--sans);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:rgba(245,242,236,.75);pointer-events:none}
/* 6 flip card */
.lm-flip{perspective:700px;cursor:pointer}
.lm-flip .fl{position:relative;width:130px;height:86px;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.4,.1,.2,1)}
.lm-flip:hover .fl{transform:rotateY(180deg)}
.lm-flip .f1,.lm-flip .f2{position:absolute;inset:0;border-radius:6px;backface-visibility:hidden;display:grid;place-items:center;font-family:var(--serif);font-size:.9rem}
.lm-flip .f1{background:var(--card);color:var(--ink);border:1px solid var(--rule)}
.lm-flip .f2{background:var(--brass);color:#fff;transform:rotateY(180deg)}
/* 7 spotlight border */
.lm-spot{cursor:crosshair}
.lm-spot .sp{position:relative;width:150px;height:90px;border-radius:8px;background:#171B21;display:grid;place-items:center;color:rgba(245,242,236,.8);font-family:var(--sans);font-size:.62rem;letter-spacing:.14em;text-transform:uppercase}
.lm-spot .sp::before{content:"";position:absolute;inset:-1.5px;border-radius:9px;padding:1.5px;background:radial-gradient(90px circle at var(--sx,50%) var(--sy,50%),var(--brass-on-dark),transparent 70%);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude}
/* 8 kinetic marquee */
.lm-marq{white-space:nowrap}
.lm-marq .mq{display:inline-flex;animation:marq 14s linear infinite}
.lm-marq span{font-family:var(--serif);font-style:italic;font-size:1.6rem;color:#F7F4EE;padding:0 22px}
.lm-marq span::after{content:"◇";color:var(--brass-on-dark);font-size:.7rem;margin-left:22px;font-style:normal}
/* 9 odometer */
.lm-count{font-family:var(--serif);font-size:2.2rem;color:#F7F4EE}
.lm-count b{color:var(--brass-on-dark);font-weight:400}
/* 10 liquid glass video */
.lm-glass video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
/* 11 mesh gradient */
.lm-mesh .field{position:absolute;inset:0;background:linear-gradient(120deg,#1b2027,var(--moss),var(--brass));background-size:220% 220%;animation:labgrad 8s ease infinite;opacity:.75}
/* 12 curtain reveal — hover wipe */
.lm-curtain{cursor:pointer}
.lm-curtain img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.lm-curtain .top{clip-path:inset(0 0 0 0);transition:clip-path .8s cubic-bezier(.6,.05,.2,1)}
.lm-curtain:hover .top{clip-path:inset(0 0 0 100%)}

/* ---------- ABOUT ---------- */
.about-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:64px;align-items:center}
.about-lead{font-family:var(--serif);font-weight:400;font-size:clamp(1.6rem,3vw,2.4rem);line-height:1.22}
.about-lead em{font-style:italic;color:var(--accent)}
.about-photo{position:relative;border:1px solid var(--line);border-radius:4px;overflow:hidden;background:var(--page-2);aspect-ratio:4/5}
.about-photo img{width:100%;height:100%;object-fit:cover}
.about-photo .ph-note{position:absolute;bottom:0;left:0;right:0;padding:12px 16px;background:linear-gradient(0deg,rgba(10,11,13,.7),transparent);font-family:var(--mono);font-size:.62rem;letter-spacing:.04em;color:rgba(245,242,236,.85)}
.about-stats{display:flex;flex-direction:column}
.astat{display:flex;justify-content:space-between;align-items:baseline;gap:16px;padding:20px 0;border-bottom:1px solid var(--line)}
.astat:first-child{border-top:1px solid var(--line)}
.astat .k{font-family:var(--sans);font-weight:500;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-faint)}
.astat .v{font-family:var(--serif);font-size:1.3rem}
.astat .v.mono{font-family:var(--mono);font-size:.9rem;letter-spacing:.04em}
.about-quote{position:relative;font-family:var(--serif);font-style:italic;font-weight:400;font-size:clamp(1.3rem,2vw,1.5rem);line-height:1.4;color:var(--tx);margin:0;padding:26px 0 22px 30px;border-top:1px solid var(--line)}
.about-quote::before{content:"\201C";position:absolute;left:-4px;top:20px;font-family:var(--serif);font-size:2.6rem;line-height:1;color:var(--accent);opacity:.6}
.about-meta{margin:0;padding-left:30px;color:var(--tx-faint)}
.letter{max-width:720px;margin:0 auto}
.letter p{font-size:1.12rem;line-height:1.7;color:var(--tx-soft);margin-bottom:20px}
.letter .greet{font-family:var(--serif);font-style:italic;font-size:1.7rem;color:var(--accent);line-height:1.2}
.letter .sign{font-family:var(--serif);font-style:italic;font-size:1.3rem;color:var(--tx)}
/* SERVIR — dark full-bleed band (About, between the two photos) */
.servir{position:relative;padding:130px 0;background:var(--scene-bg);color:var(--on-scene);overflow:hidden}
.servir::before{content:"";position:absolute;inset:0;background:url('/assets/images/site-exclusive/bg-watermark-navy-constellation.jpg') center/cover no-repeat;opacity:.70;filter:contrast(1.12) brightness(1.12);z-index:0}
/* localized scrim: darker pool behind the left-aligned text block, fading light on the
   right so the constellation/texture imposes clearly while the copy stays comfortable. */
.servir::after{content:"";position:absolute;inset:0;z-index:1;background:radial-gradient(125% 95% at 24% 46%,rgba(10,11,13,.60),rgba(10,11,13,.30) 60%,rgba(10,11,13,.18) 100%)}
.servir .wrap{z-index:2}
.servir-grid{display:grid;grid-template-columns:1fr .82fr;gap:60px;align-items:center}
.servir-copy{text-align:left}
.servir .eyebrow{color:var(--brass-on-dark)}
.servir h2{font-family:var(--serif);font-weight:400;font-size:clamp(2.4rem,5.2vw,4rem);line-height:1.04;color:#F7F4EE;margin:16px 0 24px}
.servir p{font-size:1.06rem;line-height:1.72;color:rgba(245,242,236,.86);max-width:58ch;margin:0}
.servir .coord{font-family:var(--mono);font-size:.62rem;letter-spacing:.14em;color:rgba(245,242,236,.5);margin:28px 0 0}
.servir-still{position:relative;border:1px solid rgba(245,242,236,.14);border-radius:6px;overflow:hidden;box-shadow:0 34px 80px -34px rgba(0,0,0,.75);aspect-ratio:4/3}
.servir-still img{width:100%;height:100%;object-fit:cover;display:block}
.servir-still::after{content:"";position:absolute;inset:0;background:linear-gradient(155deg,transparent 52%,rgba(10,11,13,.4));pointer-events:none}

/* ---------- niche feature grid ---------- */
.feat-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:22px}
.feat-grid.cols3{grid-template-columns:repeat(3,1fr)}
.feat{padding:32px 30px;border:1px solid var(--line);border-radius:4px;background:var(--surface);transition:.3s}
.feat:hover{border-color:var(--accent);transform:translateY(-3px)}
.feat h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;margin-bottom:10px}
.feat p{font-size:.94rem;color:var(--tx-soft)}
.feat .fn{font-family:var(--mono);font-size:.72rem;color:var(--accent);margin-bottom:12px}

/* ---------- FOOTER ---------- */
.site-foot{background:var(--page-2);border-top:1px solid var(--line);padding:74px 0 40px}
.foot-grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.1fr;gap:40px;margin-bottom:46px}
.foot-brand svg{max-width:200px;height:auto;margin-bottom:16px}
:root[data-theme="light"] .foot-brand svg text[fill="#FAF8F4"],:root[data-theme="light"] .foot-brand .wm-navy{fill:var(--ink)!important}
.foot-brand p{font-size:.92rem;color:var(--tx-soft);max-width:34ch;margin-bottom:16px}
.foot-col h5{font-family:var(--sans);font-weight:500;font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--tx-faint);margin-bottom:16px}
.foot-col a{display:block;font-size:.92rem;color:var(--tx-soft);margin-bottom:10px}
.foot-col a:hover{color:var(--accent)}
.foot-bot{display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:24px;font-family:var(--mono);font-size:.64rem;letter-spacing:.03em;color:var(--tx-faint)}
.foot-bot a{color:inherit}.foot-bot a:hover{color:var(--accent)}

/* ---------- EXIT-INTENT ---------- */
.fbk-overlay{position:fixed;inset:0;z-index:1000;background:rgba(10,11,13,.6);backdrop-filter:blur(6px);display:none;align-items:center;justify-content:center;padding:20px;opacity:0;transition:opacity .3s}
.fbk-overlay.open{display:flex;opacity:1}
.fbk-card{position:relative;max-width:520px;width:100%;background:var(--surface);border:1px solid var(--line);border-radius:6px;padding:44px 40px}
.fbk-close{position:absolute;top:16px;right:18px;background:none;border:none;font-size:1.6rem;color:var(--tx-faint);cursor:pointer;line-height:1}
.fbk-eyebrow{font-family:var(--sans);font-weight:500;font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:var(--accent)}
.fbk-card h3{font-family:var(--serif);font-weight:400;font-size:1.7rem;line-height:1.1;margin:12px 0}
.fbk-card p{color:var(--tx-soft);margin-bottom:18px}
.fbk-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px}
.fbk-chip{font-family:var(--sans);font-weight:500;font-size:.82rem;padding:8px 16px;border:1px solid var(--line);border-radius:40px;background:var(--page);color:var(--tx-soft);cursor:pointer;transition:.25s}
.fbk-chip:hover{border-color:var(--accent)}
.fbk-chip.sel{background:var(--brass);color:#fff;border-color:var(--brass)}
.fbk-card textarea{width:100%;background:var(--page);border:1px solid var(--line);border-radius:3px;padding:12px;font-family:var(--sans);font-size:.92rem;color:var(--tx);min-height:70px;resize:vertical;margin-bottom:16px}
.fbk-actions{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.fbk-skip{background:none;border:none;color:var(--tx-faint);font-size:.86rem;cursor:pointer;text-decoration:underline}
.fbk-thanks{display:none;text-align:center}
.fbk-thanks.show{display:block}
.fbk-thanks h3{margin-top:0}

/* ---------- hint pill ---------- */
.hint-pill{position:fixed;left:16px;bottom:16px;z-index:900;background:var(--surface);border:1px solid var(--line);border-radius:40px;padding:11px 18px;display:flex;align-items:center;gap:14px;box-shadow:0 12px 30px var(--shadow);opacity:0;visibility:hidden;transform:translateY(10px);transition:.4s;max-width:calc(100vw - 32px)}
.hint-pill.show{opacity:1;visibility:visible;transform:none}
.hint-pill span{font-size:.82rem;color:var(--tx-soft)}
.hint-pill button{background:var(--brass);color:#fff;border:none;border-radius:40px;padding:6px 14px;font-size:.76rem;font-weight:600;cursor:pointer;white-space:nowrap}
.hint-pill .hint-close{background:transparent;color:var(--tx-soft);font-weight:500;padding:6px 8px}

/* ---------- chatbot mascot — Alex chibi de corpo inteiro (vivo, interativo) — RESTAURADO do 13fbba7 (aprovado) ---------- */
#chatbot-bubble{position:fixed;right:16px;bottom:0;z-index:920;width:50px;background:none;border:none;cursor:pointer;padding:0;transform:translateX(150px);transition:transform .3s}
#chatbot-bubble.arrived{transform:none;animation:mascot-walkin 1.1s cubic-bezier(.25,.8,.35,1)}
#chatbot-bubble.away{transform:translateX(150px)}
#chatbot-bubble img{width:50px;height:auto;display:block;filter:drop-shadow(0 12px 14px rgba(23,26,30,.3));transform-origin:50% 96%;animation:mascot-idle 3.8s ease-in-out infinite}
#chatbot-bubble.wave img{animation:mascot-wave .8s ease-in-out 3}
#chatbot-bubble:hover img{animation:mascot-hello .7s ease-in-out infinite}
#chatbot-bubble.hop img{animation:mascot-hop .45s ease-out 1}
@keyframes mascot-walkin{0%{transform:translateX(150px)}30%{transform:translateX(96px) translateY(-7px)}55%{transform:translateX(52px) translateY(0)}78%{transform:translateX(18px) translateY(-7px)}100%{transform:translateX(0) translateY(0)}}
@keyframes mascot-idle{0%,100%{transform:scale(1) rotate(0)}50%{transform:scale(1.015,.985) rotate(-1deg)}}
@keyframes mascot-wave{0%,100%{transform:rotate(0)}30%{transform:rotate(-8deg) translateY(-4px)}65%{transform:rotate(6deg)}}
@keyframes mascot-hello{0%,100%{transform:rotate(-5deg) translateY(-3px) scale(1.05)}50%{transform:rotate(4deg) translateY(-5px) scale(1.05)}}
@keyframes mascot-hop{0%{transform:translateY(0)}40%{transform:translateY(-16px)}70%{transform:translateY(0)}85%{transform:translateY(-5px)}100%{transform:translateY(0)}}
@media(prefers-reduced-motion:reduce){#chatbot-bubble img,#chatbot-bubble.arrived,#chatbot-bubble:hover img{animation:none!important}}
/* balão de fala do mascote — acima da cabeça */
.cb-greet{position:fixed;right:58px;bottom:64px;z-index:921;background:var(--surface);border:1px solid var(--brass);border-radius:14px 14px 3px 14px;padding:10px 15px;font-size:.86rem;color:var(--tx);box-shadow:0 12px 30px var(--shadow);opacity:0;visibility:hidden;transform:translateY(8px);transition:.4s;max-width:220px;cursor:pointer}
.cb-greet::after{content:"";position:absolute;right:-7px;bottom:10px;width:12px;height:12px;background:var(--surface);border-right:1px solid var(--brass);border-bottom:1px solid var(--brass);transform:rotate(-45deg)}
.cb-greet.show{opacity:1;visibility:visible;transform:none}
.cb-av-img{position:relative;width:34px;height:34px;border-radius:50%;background:var(--page-2);border:1px solid var(--brass);overflow:hidden;display:grid;place-items:center;flex:0 0 auto}
/* blindado contra regras genéricas de mídia (.work-media img etc.) — fix 603b8e8 mantido */
.cb-av-img img{position:static!important;inset:auto!important;width:82%!important;height:auto!important;object-fit:contain!important;margin:20% 0 0!important;transform:none!important}
/* mobile ≤768px — mascote mais pequeno (cobria títulos/conteúdo em 390×844,
   auditoria 2026-07-09) + recolhe durante o scroll (classe .scroll-hide via JS) */
@media(max-width:768px){
  #chatbot-bubble{width:46px;transition:transform .3s,opacity .3s}
  #chatbot-bubble img{width:46px}
  .cb-greet{right:54px;bottom:58px;max-width:190px}
  #chatbot-bubble.scroll-hide{transform:translateY(110px);opacity:0;pointer-events:none}
}
#chatbot-panel{position:fixed;right:22px;bottom:88px;z-index:920;width:340px;max-width:calc(100vw - 32px);background:var(--surface);border:1px solid var(--line);border-radius:10px;box-shadow:0 24px 60px var(--shadow);overflow:hidden;display:none;flex-direction:column}
#chatbot-panel.open{display:flex}
.cb-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--line)}
.cb-title{font-weight:600;font-size:.92rem}.cb-st{font-size:.72rem;color:var(--tx-soft)}
.cb-close{margin-left:auto;background:none;border:none;font-size:1.3rem;color:var(--tx-faint);cursor:pointer}
.cb-note{padding:12px 16px;font-size:.78rem;color:var(--tx-soft);background:var(--page-2);border-bottom:1px solid var(--line)}
.cb-msgs{max-height:300px;overflow-y:auto;padding:14px 16px;display:flex;flex-direction:column;gap:8px}
.cb-in{display:flex;gap:8px;padding:12px 14px;border-top:1px solid var(--line)}
.cb-in textarea{flex:1;resize:none;border:1px solid var(--line);border-radius:20px;padding:9px 14px;font-family:var(--sans);font-size:.88rem;color:var(--tx);background:var(--page);max-height:80px}
.cb-send{width:38px;height:38px;border-radius:50%;background:var(--brass);border:none;cursor:pointer;display:grid;place-items:center}
.cb-send svg{width:16px;height:16px;fill:#fff}

/* dropdown parent that is a label, not a link */
.nav-links .drop-lbl{font-family:var(--sans);font-weight:500;font-size:.66rem;letter-spacing:.2em;text-transform:uppercase;color:rgba(245,242,236,.82);text-shadow:0 1px 6px rgba(0,0,0,.4);cursor:default;transition:color .2s;display:inline-flex;align-items:center;gap:6px}
.nav-links .drop-lbl::after{content:"▾";font-size:.7em;color:var(--brass-on-dark)}
.nav.scrolled .nav-links .drop-lbl{color:var(--tx-soft);text-shadow:none}
.nav-drop:hover .drop-lbl{color:var(--brass-on-dark)}
.nav.scrolled .nav-drop:hover .drop-lbl{color:var(--brass)}

/* closing CTA with brand banner background (work page) */
/* the scene (lamp · compass · olive branch · AUTONOMA wordmark) is beautiful — let it
   breathe: brighter image, much lighter overlay, and a localized scrim only behind the
   text. Text block lifts up so the wordmark at the base stays whole and visible below. */
.cta-banner{min-height:660px;display:flex;align-items:flex-end;padding:0}
.cta-banner .bg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center top;opacity:.72;filter:brightness(1.38) contrast(1.02);z-index:0}
.cta-banner::after{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(180deg,rgba(23,26,30,.06) 0%,rgba(23,26,30,.12) 34%,rgba(23,26,30,.52) 66%,rgba(23,26,30,.46) 84%,rgba(23,26,30,.26) 100%)}
.cta-banner .wrap{z-index:2;padding-top:150px;padding-bottom:172px}
.cta-banner h2{text-shadow:0 2px 20px rgba(11,13,17,.9),0 1px 3px rgba(11,13,17,.75)}
.cta-banner.promise::before{display:none}
@media(max-width:560px){.cta-banner{min-height:600px}.cta-banner .wrap{padding-top:110px;padding-bottom:150px}}

/* floating "compare styles" back link (preview only) */
.lab-back{position:fixed;left:16px;top:50%;z-index:80;background:var(--ink);color:var(--stone);font-family:var(--sans);font-weight:500;font-size:.6rem;letter-spacing:.12em;padding:9px 13px;border-radius:2px;text-transform:uppercase;opacity:.85;transition:.2s}
.lab-back:hover{opacity:1}

/* ---------- nav mobile ---------- */
@media(max-width:960px){
  .nav-links{position:fixed;inset:64px 0 auto 0;flex-direction:column;align-items:flex-start;gap:0;background:var(--page);padding:16px 40px 26px;border-bottom:1px solid var(--line);box-shadow:0 20px 40px var(--shadow);display:none}
  .nav.open .nav-links{display:flex}
  .nav-links a{color:var(--tx-soft);text-shadow:none;padding:12px 0;width:100%;border-bottom:1px solid var(--line)}
  .nav-drop{width:100%}.nav-menu{position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;border:none;background:transparent;padding:0 0 0 14px}
  .hamb{display:flex}
}
@media(max-width:900px){
  .doors,.wcards,.svc-showcase,.grid,.lab-modules{grid-template-columns:1fr 1fr}
  .about-grid,.contact-grid,.showcase,.unhurry,.demo,.svc-detail,.work-grid,.lab-grid,.feat-grid,.feat-grid.cols3,.servir-grid{grid-template-columns:1fr}
  .servir{padding:96px 0}.servir-grid{gap:38px}.servir-copy{text-align:center}.servir p{margin:0 auto}.servir-still{order:2;max-width:520px;margin:0 auto;width:100%}
  .svc-detail.rev .svc-detail-media{order:0}
  .showcase-copy{padding:64px 40px}.showcase-video{min-height:300px}
  .unhurry-media{min-height:280px}.unhurry-media::after{background:linear-gradient(0deg,var(--surface) 0%,transparent 40%)}
  .steps,.pgrid{grid-template-columns:1fr 1fr;gap:30px}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:560px){
  .wrap,.nav-in{padding:0 22px}
  .sec{padding:84px 0}.scene{height:68vh}.serenity{padding:100px 0}
  .doors,.wcards,.svc-showcase,.grid,.steps,.pgrid,.lab-modules,.lab-grid,.foot-grid{grid-template-columns:1fr}
  .cell{padding:28px 0!important;border-right:none}
  .cine-cap{padding-bottom:50px}.cine-prog{right:20px}
  .nav-links{padding:16px 22px 26px}
}

/* ---------- family band (About) ---------- */
.family-band{position:relative;width:100%;max-width:960px;margin:0 auto 46px;border-radius:6px;overflow:hidden;aspect-ratio:16/9;background:var(--scene-bg)}
.family-band img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.02)}
.family-band::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(23,26,30,.35) 100%);pointer-events:none}
@media(max-width:640px){.family-band{margin-bottom:32px;border-radius:4px}}

/* ---------- scroll cue do hero — mesma cápsula GRANDE a piscar ---------- */
.scrollcue{flex-direction:row;gap:9px;padding:8px 15px;border:1.5px solid var(--brass-on-dark);border-radius:60px;background:rgba(14,16,19,.55);backdrop-filter:blur(10px);animation:cueblink 1.6s ease-in-out infinite;box-shadow:0 0 0 1px rgba(198,164,94,.25),0 14px 40px rgba(0,0,0,.5)}
.scrollcue span:first-child{font-weight:700;font-size:.6rem;letter-spacing:.26em;color:#F7F4EE;text-shadow:0 2px 14px rgba(0,0,0,.55)}
.scrollcue .mouse{width:16px;height:26px;border:1.5px solid var(--brass-on-dark);border-radius:9px}
.scrollcue .mouse::before{width:3px;height:6px;margin-left:-1.5px;background:var(--brass-on-dark);box-shadow:0 0 10px var(--brass-on-dark)}
.scrollcue::after{content:"⌄";font-size:.9rem;line-height:.5;color:var(--brass-on-dark);animation:cuedown 1.6s ease-in-out infinite}
@media(max-width:560px){.scrollcue{padding:7px 12px;gap:8px}.scrollcue span:first-child{font-size:.55rem;letter-spacing:.2em}.scrollcue .mouse{width:14px;height:22px}}

/* ============ SCROLL CUE do Labs live — linha vertical dourada + SCROLL (exato) ============ */
.cine-cue{position:absolute;left:50%;bottom:36px;transform:translateX(-50%);z-index:6;display:flex;flex-direction:column;align-items:center;gap:12px;pointer-events:none;transition:opacity .5s}
.cine-cue .cue-line{width:3px;height:64px;border-radius:2px;background:linear-gradient(to bottom,#D4B87A,#C4A265 45%,rgba(196,162,101,.15));box-shadow:0 0 14px rgba(196,162,101,.55);animation:scrollPulse 2s ease-in-out infinite}
.cine-cue .cue-row{display:flex;align-items:baseline;gap:14px;animation:scrollTextPulse 2s ease-in-out infinite}
.cine-cue .cue-word{font-family:var(--serif);font-size:.9rem;font-weight:700;letter-spacing:.32em;text-transform:uppercase;background:linear-gradient(135deg,#C4A265 0%,#E8D5A3 45%,#C4A265 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text}
.cine-cue .cue-side{font-family:var(--sans);font-weight:500;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:rgba(245,242,236,.72);text-shadow:0 2px 10px rgba(0,0,0,.6)}
@keyframes scrollPulse{0%,100%{opacity:.55;transform:scaleY(.92)}50%{opacity:1;transform:scaleY(1)}}
@keyframes scrollTextPulse{0%,100%{opacity:.75}50%{opacity:1}}
.cine-cue.done{opacity:0}

/* defensivo: títulos gigantes nunca estouram viewports estreitos/font-scaling */
h1,h2,.hero h1,.cine-cap h2{overflow-wrap:break-word}
@media(max-width:360px){
  .hero h1{font-size:clamp(1.9rem,11vw,2.6rem)}
  .wrap{padding-left:18px;padding-right:18px}
}

/* nav compacta em ecrãs estreitos */
@media(max-width:480px){
  .nav-in{padding:0 14px;gap:8px}
  .brand .wm{letter-spacing:.18em;font-size:.82rem}
  .brand .mark{width:30px;height:30px}
  .nav-right{gap:7px}
  .lang button, .lang .lang-btn{padding:4px 6px;font-size:.6rem}
  .theme-btn{width:30px;height:30px}
  .nav-cta{padding:9px 12px;font-size:.58rem;letter-spacing:.12em}
}
/* Mobile nav: on phones the top-bar START competes with the hamburger and
   pushes it off-screen (≤ ~520px, all phones incl. Pro Max 430). So ≤560px we
   hide the top-bar START and instead show a START cloned into the drawer by
   app.js. The drawer-start is hidden by default because on desktop .nav-links
   is the inline horizontal menu (visible) — it must only appear in the mobile
   drawer, exactly where the top-bar START is hidden. */
.drawer-start{display:none}
@media(max-width:560px){
  .nav-right .nav-cta{display:none}
  .nav-links .drawer-start{display:block;margin-top:14px;background:var(--brass);color:#fff;border:none;border-radius:40px;padding:13px 18px;text-align:center;font-family:var(--sans);font-weight:600;font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;transition:background .2s}
  .nav-links .drawer-start:hover{background:var(--brass-on-dark);color:#fff}
  :root[data-theme="dark"] .nav-links .drawer-start{color:var(--ink)}
}

/* ---------- SERVICE DETAIL PAGES (plans · included · faq) ---------- */
.inc-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:14px 34px;list-style:none;padding:0;margin:0}
.inc-grid li{position:relative;padding-left:26px;color:var(--tx-soft);line-height:1.55;font-size:.98rem}
.inc-grid li::before{content:"✓";position:absolute;left:0;top:0;color:var(--accent);font-weight:600}

.plan-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.plan-grid.cols2{grid-template-columns:repeat(2,1fr)}
.plan-card{position:relative;display:flex;flex-direction:column;padding:36px 32px;background:var(--surface);border:1px solid var(--line);border-radius:4px;transition:transform .3s,border-color .3s,box-shadow .3s}
.plan-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 44px var(--shadow)}
.plan-card.featured{border-color:var(--accent)}
.plan-tag{font-family:var(--mono);font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;color:var(--accent);margin-bottom:14px}
.plan-name{font-family:var(--serif);font-weight:400;font-size:1.7rem;line-height:1.04;margin-bottom:6px}
.plan-cadence{font-size:.9rem;color:var(--tx-soft);margin-bottom:18px}
.plan-price{font-family:var(--serif);font-weight:400;font-size:1.45rem;color:var(--tx);line-height:1.1}
.plan-from{font-family:var(--sans);font-weight:500;font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--tx-faint);display:block;margin-bottom:20px}
/* C5) pt-BR: sem preços — esconde valor e rótulo "A partir de"; CTA passa a "Fale conosco para valores" */
html[lang="pt-BR"] .plan-price,html[lang="pt-BR"] .plan-from{display:none}
html[lang="pt-BR"] .plan-name{margin-bottom:20px}
.plan-feats{list-style:none;margin:0 0 24px;padding:0;display:flex;flex-direction:column;gap:11px}
.plan-feats li{position:relative;padding-left:22px;font-size:.92rem;color:var(--tx-soft);line-height:1.5}
.plan-feats li::before{content:"→";position:absolute;left:0;color:var(--accent)}
.plan-feats li strong{color:var(--tx);font-weight:600}
.plan-feats li.dim{opacity:.48}
.plan-feats li.dim::before{content:"–";color:var(--tx-faint)}
.plan-card .btn{margin-top:auto;align-self:flex-start}

/* C6) discreet in-frame video controls (play/pause + sound) — house style, corner of frame */
.vidctl{position:absolute;right:10px;bottom:10px;z-index:5;display:flex;gap:6px}
.vidctl-b{width:32px;height:32px;border-radius:50%;border:1px solid rgba(245,242,236,.30);background:rgba(20,18,15,.44);backdrop-filter:blur(8px) saturate(150%);-webkit-backdrop-filter:blur(8px) saturate(150%);color:#F5F2EC;display:grid;place-items:center;cursor:pointer;padding:0;transition:background .25s,border-color .25s,color .25s,transform .2s}
.vidctl-b:hover{background:rgba(20,18,15,.66);border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}
.vidctl-b:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.vidctl-b svg{display:block;width:15px;height:15px}
.plan-note{margin-top:28px;font-size:.86rem;color:var(--tx-faint);line-height:1.6;max-width:74ch}

.faq-list{max-width:840px}
.faq-item{border-top:1px solid var(--line)}
.faq-item:last-child{border-bottom:1px solid var(--line)}
.faq-q{font-family:var(--serif);font-weight:400;font-size:1.2rem;color:var(--tx);cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:24px 0}
.faq-q::-webkit-details-marker{display:none}
.faq-q::after{content:"+";font-family:var(--sans);font-size:1.5rem;line-height:1;color:var(--accent);transition:transform .3s;flex-shrink:0}
.faq-item[open] .faq-q::after{transform:rotate(45deg)}
.faq-a{padding:0 0 24px;color:var(--tx-soft);line-height:1.7;max-width:74ch}

/* before/after showcase (work page) */
.ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.ba-card{background:var(--surface);border:1px solid var(--line);border-radius:4px;overflow:hidden;transition:transform .3s,border-color .3s,box-shadow .3s}
.ba-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 18px 44px var(--shadow)}
.ba-media{position:relative;aspect-ratio:4/3;overflow:hidden;background:var(--scene-bg)}
.ba-pane{position:absolute;inset:0}
.ba-pane img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.ba-pane.after{clip-path:inset(0 0 0 100%);animation:baSweep 7s ease-in-out infinite}
@keyframes baSweep{0%,10%{clip-path:inset(0 0 0 100%)}45%,55%{clip-path:inset(0 0 0 0)}90%,100%{clip-path:inset(0 0 0 100%)}}
.ba-lbl2{position:absolute;top:12px;left:12px;z-index:2;font-family:var(--sans);font-weight:500;font-size:.58rem;letter-spacing:.16em;text-transform:uppercase;color:#F7F4EE;background:rgba(14,16,19,.7);padding:5px 11px;border-radius:40px;backdrop-filter:blur(4px)}
.ba-pane.after .ba-lbl2{left:auto;right:12px;background:rgba(168,133,68,.88)}
.ba-info{padding:22px 24px 26px}
.ba-tag{font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);display:block;margin-bottom:10px}
.ba-info h3{font-family:var(--serif);font-weight:400;font-size:1.3rem;margin-bottom:8px}
.ba-info p{font-size:.92rem;color:var(--tx-soft);line-height:1.5}
@media (prefers-reduced-motion:reduce){.ba-pane.after{clip-path:inset(0 0 0 50%);animation:none}}
@media (max-width:900px){.plan-grid,.plan-grid.cols2,.inc-grid,.ba-grid{grid-template-columns:1fr}}