/* ===== Hero v2 (2026-10-22): full-bleed video header + services tab bar ===== */
:root{--b-ink:#382111;--b-or:#dc6637;--b-am:#f6a33a;--b-cream:#fbf3e6;--b-peach:#fde3cf;--b-night:#1c1009}

/* top bar floats over the hero, turns solid on scroll */
.topbar-v2{position:fixed;top:0;left:0;right:0;background:transparent;border-bottom:1px solid transparent;-webkit-backdrop-filter:none;backdrop-filter:none;transition:background .35s ease,border-color .35s ease,box-shadow .35s ease}
.topbar-v2 .topbar-in{height:72px}
.topbar-v2 .brand-logo{height:48px}
.topbar-v2 .logo-dark{display:none}
.topbar-v2 .lang a,.topbar-v2 .lang span[aria-current]{color:rgba(251,243,230,.78)}
.topbar-v2 .lang a:hover{color:#fff;background:rgba(251,243,230,.14)}
.topbar-v2 .lang span[aria-current="true"]{color:var(--b-ink);background:var(--b-cream);box-shadow:none}
.topbar-v2 .btn-ig{background:rgba(251,243,230,.10);border-color:rgba(251,243,230,.38);color:var(--b-cream)}
.topbar-v2 .top-actions>a.btn:last-child{background:linear-gradient(100deg,var(--b-or),#e8843a);border-color:transparent;color:#fff;box-shadow:0 8px 22px -10px rgba(220,102,55,.8)}
html.scrolled .topbar-v2{background:rgba(251,243,230,.94);-webkit-backdrop-filter:saturate(1.4) blur(10px);backdrop-filter:saturate(1.4) blur(10px);border-bottom-color:rgba(221,214,203,.8)}
html.scrolled .topbar-v2 .topbar-in{height:60px}
html.scrolled .topbar-v2 .brand-logo{height:44px}
html.scrolled .topbar-v2 .logo-dark{display:block}
html.scrolled .topbar-v2 .logo-light{display:none}
html.scrolled .topbar-v2 .lang a,html.scrolled .topbar-v2 .lang span[aria-current]{color:var(--muted)}
html.scrolled .topbar-v2 .lang a:hover{color:var(--ink);background:var(--stone)}
html.scrolled .topbar-v2 .lang span[aria-current="true"]{color:var(--ink);background:#fff;box-shadow:inset 0 0 0 1px var(--line)}
html.scrolled .topbar-v2 .btn-ig{background:#fff;border-color:var(--line);color:var(--ink)}
.topbar-v2 .topbar-in,.topbar-v2 .brand-logo{transition:height .3s ease}
section[id]{scroll-margin-top:64px}

/* hero */
.hero-v2{position:relative;isolation:isolate;min-height:100vh;min-height:100svh;padding:0;display:flex;align-items:flex-end;color:var(--b-cream);background:var(--b-night);overflow:hidden}
.hero-bg{position:absolute;inset:0;z-index:-2}
.hero-bg-vid{width:100%;height:100%;object-fit:cover;object-position:60% 50%;max-width:none}
.hero-shade{position:absolute;inset:0;z-index:-1;background:
  linear-gradient(to top,rgba(28,16,9,.95) 0%,rgba(28,16,9,.55) 34%,rgba(28,16,9,.18) 62%,rgba(28,16,9,.5) 100%),
  linear-gradient(to left,rgba(28,16,9,.84),rgba(28,16,9,.55) 38%,rgba(28,16,9,.12) 72%,rgba(28,16,9,0) 90%)}
[dir="ltr"] .hero-shade{background:
  linear-gradient(to top,rgba(28,16,9,.95) 0%,rgba(28,16,9,.55) 34%,rgba(28,16,9,.18) 62%,rgba(28,16,9,.5) 100%),
  linear-gradient(to right,rgba(28,16,9,.84),rgba(28,16,9,.55) 38%,rgba(28,16,9,.12) 72%,rgba(28,16,9,0) 90%)}
.hero-in{position:relative;padding-top:110px;padding-bottom:40px}
.hero-v2 .hero-title{font-weight:300;font-size:clamp(44px,12.4vw,118px);line-height:1;letter-spacing:-.01em;color:#fff;text-wrap:balance;max-width:14ch;text-shadow:0 2px 30px rgba(0,0,0,.35)}
.hero-v2 .hero-title span{display:block}
.hero-v2 .hero-title .ht-2{font-weight:500;background:linear-gradient(100deg,var(--b-or),var(--b-am));-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent;padding-bottom:.06em;text-shadow:none}
[lang="en"] .hero-v2 .hero-title,[lang="es"] .hero-v2 .hero-title{text-transform:uppercase;letter-spacing:.015em;font-size:clamp(34px,7.6vw,86px);line-height:1.04;max-width:17ch}
.hero-rule{display:block;width:72px;height:3px;border-radius:3px;margin:22px 0 18px;background:linear-gradient(90deg,var(--b-or),var(--b-am))}
[dir="rtl"] .hero-rule{background:linear-gradient(270deg,var(--b-or),var(--b-am))}
.hero-tag{font-size:14px;font-weight:500;letter-spacing:.08em;color:var(--b-peach)}
[lang="en"] .hero-tag,[lang="es"] .hero-tag{text-transform:uppercase;letter-spacing:.26em;font-size:12px}
.hero-lead{margin-top:14px;font-size:17px;line-height:1.55;font-weight:300;color:rgba(251,243,230,.92);max-width:40ch;text-wrap:pretty;text-shadow:0 1px 14px rgba(0,0,0,.45)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin-top:24px}
.btn-grad{background:linear-gradient(100deg,var(--b-or),#e8843a);color:#fff;border:0;box-shadow:0 14px 30px -14px rgba(220,102,55,.95)}
.btn-grad:hover{background:linear-gradient(100deg,#c95a2e,var(--b-or))}
.hero-v2 .btn-primary{width:100%;font-size:18px;min-height:56px}
.play{display:inline-flex;align-items:center;gap:14px;padding:0;border:0;background:none;color:var(--b-cream);font:inherit;font-size:15px;font-weight:500;letter-spacing:.02em;cursor:pointer}
.play-ring{position:relative;flex:none;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;border:1.5px solid rgba(251,243,230,.75);background:rgba(251,243,230,.08);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);transition:background .2s,transform .2s}
.play-ring::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px solid rgba(246,163,58,.55);animation:ringPulse 2.6s ease-out infinite}
.play-ring svg{width:22px;height:22px;margin-inline-start:3px}
[dir="rtl"] .play-ring svg{margin-inline-start:0;margin-inline-end:-3px}
.play:hover .play-ring{background:rgba(251,243,230,.2);transform:scale(1.05)}
.play-label{border-bottom:1px solid rgba(251,243,230,.35);padding-bottom:2px}
@keyframes ringPulse{0%{transform:scale(.9);opacity:.9}100%{transform:scale(1.25);opacity:0}}
.hero-micro{margin-top:20px;font-size:13.5px;line-height:1.55;color:rgba(251,243,230,.66);max-width:56ch}
.hero-link{color:var(--b-cream);font-weight:600;text-underline-offset:4px;text-decoration-color:rgba(246,163,58,.7);white-space:nowrap}

/* services tab bar */
.svc{background:var(--b-night);color:var(--b-cream);padding:8px 0 64px}
.svc-fit{font-size:14px;color:rgba(251,243,230,.7);margin-bottom:22px}
.svc-fit span{color:var(--b-am);margin-inline-end:6px}
.svc-bar{position:relative}
.svc-tabs{display:flex;gap:6px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;margin:0 -20px;padding:0 20px}
.svc-tabs::-webkit-scrollbar{display:none}
.svc-tab{flex:1 0 auto;scroll-snap-align:start;position:relative;display:flex;align-items:center;gap:10px;padding:14px 4px 22px;border:0;background:none;color:rgba(251,243,230,.55);font:inherit;font-size:15px;font-weight:500;white-space:nowrap;cursor:pointer;text-align:start;transition:color .2s}
.svc-tab:hover{color:var(--b-cream)}
.svc-tab[aria-selected="true"]{color:#fff}
.svc-num{font-size:12px;letter-spacing:.12em;color:var(--b-am);opacity:.8}
.svc-dot{position:absolute;bottom:-5px;inset-inline-start:4px;width:11px;height:11px;border-radius:50%;background:var(--b-night);border:2px solid rgba(251,243,230,.35);z-index:2;transition:border-color .25s,background .25s}
.svc-tab[aria-selected="true"] .svc-dot,.svc-tab.done .svc-dot{border-color:var(--b-am);background:var(--b-am)}
.svc-track{position:relative;height:1px;background:rgba(251,243,230,.2)}
.svc-fill{position:absolute;inset-block:0;inset-inline-start:0;width:0;height:2px;margin-top:-.5px;background:linear-gradient(90deg,var(--b-or),var(--b-am));transition:width .5s ease}
[dir="rtl"] .svc-fill{background:linear-gradient(270deg,var(--b-or),var(--b-am))}
.svc-panels{margin-top:30px}
.svc-panel{display:grid;gap:22px;animation:svcIn .5s ease}
.svc-panel[hidden]{display:none}
@keyframes svcIn{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.svc-img{border-radius:16px;overflow:hidden;aspect-ratio:4/3;background:#2a1a10;box-shadow:0 24px 50px -28px rgba(0,0,0,.8)}
.svc-img img{width:100%;height:100%;object-fit:cover}
.svc-big{display:block;font-size:13px;letter-spacing:.24em;color:var(--b-am);margin-bottom:10px}
.svc-h{font-size:clamp(26px,6.4vw,40px);font-weight:300;line-height:1.15;color:#fff;max-width:20ch;text-wrap:balance}
.svc-copy p{margin-top:12px;font-size:16.5px;font-weight:300;line-height:1.6;color:rgba(251,243,230,.82);max-width:46ch}
.svc-more{display:inline-flex;align-items:center;gap:6px;margin-top:18px;min-height:44px;color:var(--b-am);font-weight:600;text-decoration:none;border-bottom:1px solid rgba(246,163,58,.45)}
.svc-more:hover{color:var(--b-peach)}

@media (min-width:560px){.hero-v2 .btn-primary{width:auto}}
@media (min-width:900px){
  .topbar-v2 .topbar-in{height:84px}
  .topbar-v2 .brand-logo{height:54px}
  .hero-in{padding-top:150px;padding-bottom:72px}
  .hero-lead{font-size:19px}
  .hero-tag{font-size:14px}
  .svc{padding:18px 0 96px}
  .svc-tabs{margin:0;padding:0;overflow:visible}
  .svc-tab{flex:1 1 0;font-size:16.5px}
  .svc-panel{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:56px;align-items:center}
  .svc-img{aspect-ratio:16/11}
  .svc-copy p{font-size:18px}
}
@media (min-width:1200px){.hero-v2 .wrap,.svc .wrap{max-width:1240px}}
@media (max-width:899px){
  .hero-v2{align-items:flex-end}
}
@media (max-width:400px){
  .topbar-v2 .brand-logo{height:40px}
  .hero-v2 .hero-title{font-size:clamp(40px,12.6vw,56px)}
  [lang="en"] .hero-v2 .hero-title,[lang="es"] .hero-v2 .hero-title{font-size:clamp(30px,8.6vw,40px)}
  .hero-lead{font-size:16px}
  .play-ring{width:52px;height:52px}
  [lang="en"] .hero-tag,[lang="es"] .hero-tag{letter-spacing:.14em;font-size:11px}
}
@media (max-height:720px) and (min-width:900px){.hero-in{padding-top:120px;padding-bottom:44px}.hero-v2 .hero-title{font-size:clamp(44px,8vw,92px)}}
@media (prefers-reduced-motion:reduce){.play-ring::after{animation:none}.svc-panel{animation:none}.svc-fill{transition:none}}
