/* ============================================================
   ARENAL CREATIVE BROKERS — Stylesheet
   Editorial · Refined · Kinetic
   ============================================================ */

:root{
  --ink:#0A0908;
  --ash:#14110F;
  --char:#1F1B17;
  --bone:#F5EFE6;
  --paper:#ECE3D0;
  --cream:#FAF5EB;
  --copper:#B87333;
  --copper-deep:#8E5728;
  --olive:#5C5746;
  --muted:#8C857A;
  --rule:rgba(10,9,8,.14);
  --rule-soft:rgba(10,9,8,.07);
  --rule-light:rgba(245,239,230,.16);
  --rule-light-soft:rgba(245,239,230,.07);

  --display:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --sans:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;

  --pad:clamp(20px,4vw,48px);
  --container:1340px;
  --radius:22px;
  --radius-lg:34px;

  --ease:cubic-bezier(.2,.8,.2,1);
  --ease-out:cubic-bezier(.16,1,.3,1);
}

*{box-sizing:border-box;margin:0;padding:0}
*::selection{background:var(--ink);color:var(--cream)}
html{scroll-behavior:smooth;background:var(--bone);-webkit-font-smoothing:antialiased}
body{
  font-family:var(--sans);
  background:var(--bone);
  color:var(--ink);
  line-height:1.55;
  font-size:16px;
  font-weight:400;
  overflow-x:hidden;
  cursor:none;
}
@media (hover:none){body{cursor:auto}}
img{display:block;max-width:100%;height:auto}
a{text-decoration:none;color:inherit}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:none;border:0;background:transparent}

/* ---------- LAYOUT ---------- */
.container{width:min(100%,var(--container));margin-inline:auto;padding-inline:var(--pad)}
.section{position:relative;padding-block:clamp(80px,10vw,160px)}
.narrow{max-width:920px;margin-inline:auto}

/* ---------- TYPOGRAPHY ---------- */
h1,h2,h3,h4{font-family:var(--display);font-weight:400;line-height:.92;letter-spacing:-.025em;font-variation-settings:"opsz" 144,"SOFT" 30}
h1{font-size:clamp(58px,9vw,148px);letter-spacing:-.04em}
h2{font-size:clamp(40px,6vw,92px);letter-spacing:-.035em}
h3{font-size:clamp(26px,3vw,42px);letter-spacing:-.02em}
.italic{font-style:italic;font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1}

.eyebrow{
  font-family:var(--mono);
  font-size:11px;
  letter-spacing:.22em;
  text-transform:uppercase;
  color:var(--copper);
  font-weight:500;
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.eyebrow::before{
  content:"";
  width:24px;height:1px;background:currentColor;
}
.eyebrow.no-rule::before{display:none}
.label{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);font-weight:500}
.lead{font-size:clamp(18px,1.7vw,22px);line-height:1.5;color:var(--olive);font-weight:400}
.dark-section .lead{color:rgba(245,239,230,.72)}
.dark-section .label{color:rgba(245,239,230,.55)}

/* ---------- CURSOR ---------- */
.cursor{
  position:fixed;left:0;top:0;width:14px;height:14px;border-radius:50%;
  background:var(--ink);pointer-events:none;z-index:200;
  mix-blend-mode:difference;
  transition:width .35s var(--ease),height .35s var(--ease),background .25s,opacity .25s;
  translate:-50% -50%;
}
.cursor.is-link{width:64px;height:64px;background:var(--copper);mix-blend-mode:normal;opacity:.9}
.cursor.is-text{width:3px;height:28px;border-radius:2px}
.cursor-trail{
  position:fixed;left:0;top:0;width:42px;height:42px;border-radius:50%;
  border:1px solid rgba(10,9,8,.4);pointer-events:none;z-index:199;
  translate:-50% -50%;transition:transform .25s var(--ease);
  mix-blend-mode:difference;
}
@media (hover:none){.cursor,.cursor-trail{display:none}}

/* ---------- LOADER ---------- */
.loader{
  position:fixed;inset:0;background:var(--ink);z-index:1000;
  display:grid;place-items:center;
  animation:loaderOut 1.2s var(--ease-out) 1.4s forwards;
}
.loader svg{width:120px;height:120px;fill:none;stroke:var(--copper);stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.loader svg path{stroke-dasharray:300;stroke-dashoffset:300;animation:drawLogo 1.3s var(--ease-out) forwards}
.loader svg path:nth-child(2){animation-delay:.25s}
.loader svg path:nth-child(3){animation-delay:.5s}
.loader-line{
  position:absolute;bottom:0;left:0;height:2px;background:var(--copper);width:0;
  animation:loaderBar 1.3s var(--ease-out) forwards;
}
@keyframes drawLogo{to{stroke-dashoffset:0}}
@keyframes loaderBar{to{width:100%}}
@keyframes loaderOut{to{opacity:0;visibility:hidden}}

/* ---------- HEADER ---------- */
.site-header{
  position:fixed;top:0;left:0;right:0;z-index:60;
  display:flex;align-items:center;gap:24px;
  padding:18px var(--pad);
  background:rgba(245,239,230,.72);
  border-bottom:1px solid var(--rule-soft);
  backdrop-filter:saturate(140%) blur(18px);
  -webkit-backdrop-filter:saturate(140%) blur(18px);
  transition:background .3s var(--ease),padding .3s var(--ease);
}
.site-header.scrolled{padding-block:12px;background:rgba(245,239,230,.92)}
.site-header.dark{background:rgba(20,17,15,.7);color:var(--cream);border-color:var(--rule-light-soft)}
.site-header.dark.scrolled{background:rgba(20,17,15,.94)}
.brand{display:flex;align-items:center;gap:14px;margin-right:auto}
.brand .glyph{width:38px;height:38px;fill:none;stroke:currentColor;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;color:var(--copper)}
.brand-text{display:flex;flex-direction:column;line-height:1}
.brand-text strong{font-family:var(--sans);font-weight:800;font-size:13px;letter-spacing:.18em;text-transform:uppercase}
.brand-text small{font-family:var(--mono);font-size:9px;letter-spacing:.28em;text-transform:uppercase;color:var(--muted);margin-top:4px}

.nav{display:flex;align-items:center;gap:6px}
.nav a{
  position:relative;
  font-size:13px;font-weight:600;letter-spacing:.02em;
  padding:10px 14px;border-radius:99px;
  transition:color .3s,background .3s;
}
.nav a:hover,.nav a.active{background:rgba(10,9,8,.06)}
.dark .nav a:hover,.dark .nav a.active{background:rgba(245,239,230,.1)}
.nav a.active::before{
  content:"";position:absolute;left:14px;bottom:6px;width:6px;height:6px;border-radius:50%;
  background:var(--copper);
}
.nav a.active{padding-left:26px}

.header-cta{
  display:inline-flex;align-items:center;gap:10px;
  padding:11px 18px;border-radius:99px;
  border:1px solid var(--ink);
  font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  transition:background .3s,color .3s;
  position:relative;overflow:hidden;
}
.header-cta::after{
  content:"";position:absolute;inset:0;background:var(--ink);
  transform:translateY(101%);transition:transform .4s var(--ease-out);z-index:-1;
}
.header-cta:hover{color:var(--cream)}
.header-cta:hover::after{transform:translateY(0)}
.dark .header-cta{border-color:var(--cream)}
.dark .header-cta::after{background:var(--cream)}
.dark .header-cta:hover{color:var(--ink)}
.cta-dot{width:6px;height:6px;border-radius:50%;background:var(--copper);box-shadow:0 0 0 0 var(--copper);animation:pulse 2.4s infinite}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(184,115,51,.6)}
  70%{box-shadow:0 0 0 9px rgba(184,115,51,0)}
  100%{box-shadow:0 0 0 0 rgba(184,115,51,0)}
}

.menu-btn{display:none;width:44px;height:44px;border:1px solid var(--rule);border-radius:50%;background:transparent}
.menu-btn span{display:block;width:18px;height:2px;background:currentColor;margin:4px auto;transition:.3s}
.site-header.open .menu-btn span:nth-child(1){transform:translateY(6px) rotate(45deg)}
.site-header.open .menu-btn span:nth-child(2){opacity:0}
.site-header.open .menu-btn span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* ---------- TICKER ---------- */
.ticker{
  position:relative;
  background:var(--ink);color:var(--cream);
  border-block:1px solid var(--rule-light-soft);
  overflow:hidden;
  padding-block:18px;
  font-family:var(--mono);
  font-size:13px;letter-spacing:.12em;text-transform:uppercase;
}
.ticker-track{display:flex;gap:48px;width:max-content;animation:ticker 38s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-track span{display:inline-flex;align-items:center;gap:48px;white-space:nowrap}
.ticker-track .dot{width:6px;height:6px;border-radius:50%;background:var(--copper);display:inline-block}
.ticker-track em{font-style:normal;color:var(--copper)}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* ---------- HERO ---------- */
.hero{
  position:relative;min-height:100svh;
  background:var(--bone);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding-top:160px;padding-bottom:60px;
  overflow:hidden;
  isolation:isolate;
}
.hero-bg{position:absolute;inset:0;z-index:-1}
.hero-grid-bg{
  position:absolute;inset:0;
  background-image:
    linear-gradient(var(--rule-soft) 1px,transparent 1px),
    linear-gradient(90deg,var(--rule-soft) 1px,transparent 1px);
  background-size:80px 80px;
  mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 100%);
  -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 40%,#000 30%,transparent 100%);
}
.hero-watermark{
  position:absolute;
  right:-4vw;top:14vh;
  width:min(58vw,820px);
  fill:none;stroke:var(--rule);stroke-width:1.4;
  stroke-linecap:round;stroke-linejoin:round;
  z-index:-1;
}
.hero-watermark.copper{stroke:rgba(184,115,51,.18)}
.hero-meta{
  display:flex;justify-content:space-between;align-items:flex-end;
  margin-bottom:clamp(40px,7vw,90px);gap:30px;flex-wrap:wrap;
}
.hero-meta-block{display:flex;flex-direction:column;gap:6px}
.hero-meta-block strong{font-family:var(--mono);font-size:13px;font-weight:500}
.hero-meta-block small{font-family:var(--mono);font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}

.hero h1{max-width:1200px;font-variation-settings:"opsz" 144,"SOFT" 30,"WONK" 0}
.hero h1 .line{display:block;overflow:hidden}
.hero h1 .line span{display:inline-block;transform:translateY(110%);animation:rise 1.1s var(--ease-out) forwards}
.hero h1 .line:nth-child(1) span{animation-delay:1.5s}
.hero h1 .line:nth-child(2) span{animation-delay:1.62s}
.hero h1 .line:nth-child(3) span{animation-delay:1.74s}
@keyframes rise{to{transform:translateY(0)}}

.hero-sub{
  margin-top:clamp(36px,4vw,56px);
  display:grid;
  grid-template-columns:1fr auto;
  gap:clamp(30px,4vw,80px);
  align-items:end;
}
.hero-sub-text{max-width:560px;font-size:clamp(16px,1.4vw,19px);line-height:1.6;color:var(--olive)}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap}

.btn{
  position:relative;
  display:inline-flex;align-items:center;gap:14px;
  padding:18px 28px;border-radius:99px;
  font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  border:1px solid var(--ink);
  overflow:hidden;
  transition:color .35s var(--ease);
  z-index:1;
}
.btn .arrow{display:inline-flex;width:14px;height:14px;transition:transform .4s var(--ease)}
.btn:hover .arrow{transform:translateX(4px) rotate(-45deg)}
.btn.primary{background:var(--ink);color:var(--cream)}
.btn.primary::before{
  content:"";position:absolute;inset:0;background:var(--copper);
  transform:translateY(101%);transition:transform .45s var(--ease-out);z-index:-1;
}
.btn.primary:hover::before{transform:translateY(0)}
.btn.ghost{background:transparent;color:var(--ink)}
.btn.ghost::before{
  content:"";position:absolute;inset:0;background:var(--ink);
  transform:translateY(101%);transition:transform .45s var(--ease-out);z-index:-1;
}
.btn.ghost:hover{color:var(--cream)}
.btn.ghost:hover::before{transform:translateY(0)}
.dark-section .btn.ghost{border-color:var(--cream);color:var(--cream)}
.dark-section .btn.ghost::before{background:var(--cream)}
.dark-section .btn.ghost:hover{color:var(--ink)}

/* ---------- SECTION HEADS ---------- */
.head-row{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(40px,8vw,120px);
  align-items:end;margin-bottom:clamp(40px,5vw,80px);
}
.head-row .index{
  font-family:var(--mono);font-size:12px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--copper);white-space:nowrap;padding-bottom:18px;border-bottom:1px solid var(--copper);
}
.head-row h2{max-width:1100px}

/* ---------- INTRO BLOCK (philosophy quote) ---------- */
.intro-quote{
  font-family:var(--display);font-size:clamp(28px,3.5vw,52px);line-height:1.15;
  font-variation-settings:"opsz" 144,"SOFT" 60;
  letter-spacing:-.02em;
  max-width:1100px;
  font-weight:300;
}
.intro-quote em{font-style:italic;color:var(--copper);font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1}

/* ---------- SERVICES PILLARS ---------- */
.pillars{display:grid;grid-template-columns:repeat(2,1fr);gap:1px;background:var(--rule);border:1px solid var(--rule);border-radius:var(--radius-lg);overflow:hidden}
.pillar{
  position:relative;
  padding:clamp(28px,3.5vw,52px);
  background:var(--cream);
  display:flex;flex-direction:column;gap:18px;
  min-height:340px;
  transition:background .4s var(--ease);
  overflow:hidden;
}
.pillar:hover{background:var(--paper)}
.pillar .num{font-family:var(--mono);font-size:13px;color:var(--copper);letter-spacing:.16em}
.pillar h3{margin-block:6px 8px}
.pillar p{font-size:15.5px;color:var(--olive);line-height:1.55;max-width:46ch}
.pillar .more{
  margin-top:auto;display:inline-flex;align-items:center;gap:10px;
  font-family:var(--mono);font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--ink);font-weight:500;
}
.pillar .more svg{width:18px;height:18px;transition:transform .4s var(--ease)}
.pillar:hover .more svg{transform:translateX(4px)}
.pillar .ornament{
  position:absolute;right:-30px;bottom:-30px;width:160px;height:160px;
  border:1px solid var(--copper);border-radius:50%;
  opacity:.18;transition:transform .8s var(--ease-out),opacity .4s;
}
.pillar:hover .ornament{transform:scale(1.15) rotate(20deg);opacity:.34}
.pillar .ornament-inner{position:absolute;inset:18px;border:1px solid var(--copper);border-radius:50%}

/* ---------- COUNTER STRIP ---------- */
.counter-strip{
  display:grid;grid-template-columns:repeat(4,1fr);gap:1px;
  background:var(--rule-light-soft);
  border-block:1px solid var(--rule-light-soft);
}
.counter{padding:clamp(36px,4vw,60px) clamp(20px,2.4vw,32px);background:var(--ink);display:flex;flex-direction:column;gap:10px}
.counter .label{color:rgba(245,239,230,.5)}
.counter strong{
  font-family:var(--display);font-size:clamp(54px,7vw,108px);line-height:.92;
  letter-spacing:-.03em;color:var(--cream);
  font-variation-settings:"opsz" 144,"SOFT" 30;
  display:flex;align-items:flex-start;gap:6px;
}
.counter strong sup{font-size:.4em;color:var(--copper);font-family:var(--mono);letter-spacing:0;margin-top:.4em;font-weight:500}
.counter span.kicker{color:rgba(245,239,230,.6);font-size:14px;line-height:1.4;max-width:30ch}

/* ---------- STICKY WORKFLOW ---------- */
.workflow-sticky{position:relative}
.workflow-sticky .container{display:grid;grid-template-columns:1fr 1.2fr;gap:clamp(40px,6vw,100px);align-items:flex-start}
.workflow-left{position:sticky;top:120px;align-self:flex-start}
.workflow-left h2{margin-block:18px}
.workflow-counter{
  display:inline-flex;align-items:baseline;gap:8px;
  font-family:var(--mono);font-size:14px;color:var(--muted);
  margin-top:24px;
}
.workflow-counter strong{color:var(--copper);font-size:46px;font-family:var(--display);font-weight:400}
.workflow-counter span.divider{color:var(--rule)}
.workflow-right{display:flex;flex-direction:column;gap:0}
.wf-step{
  padding-block:clamp(60px,7vw,100px);
  border-bottom:1px solid var(--rule);
  display:grid;grid-template-columns:auto 1fr;gap:clamp(20px,3vw,40px);
  transition:opacity .5s,filter .5s;
}
.wf-step:first-child{padding-top:0}
.wf-step .step-num{font-family:var(--mono);font-size:13px;color:var(--copper);letter-spacing:.16em;padding-top:6px}
.wf-step h3{font-size:clamp(28px,3.4vw,46px);margin-bottom:14px}
.wf-step p{font-size:16px;color:var(--olive);max-width:50ch;line-height:1.6}
.wf-step ul{list-style:none;margin-top:18px;display:flex;flex-direction:column;gap:8px}
.wf-step ul li{
  font-family:var(--mono);font-size:12px;letter-spacing:.06em;color:var(--ink);
  padding-left:18px;position:relative;
}
.wf-step ul li::before{
  content:"";position:absolute;left:0;top:8px;width:8px;height:1px;background:var(--copper);
}

/* ---------- DARK SECTIONS ---------- */
.dark-section{background:var(--ink);color:var(--cream)}
.dark-section .head-row .index{color:var(--copper);border-color:var(--copper)}
.dark-section h2,.dark-section h3{color:var(--cream)}
.dark-section .lead,.dark-section p:not(.eyebrow):not(.label){color:rgba(245,239,230,.74)}

/* ---------- SECTOR GRID ---------- */
.sectors-grid{
  display:grid;grid-template-columns:repeat(12,1fr);
  gap:14px;
}
.sector-card{
  position:relative;overflow:hidden;border-radius:var(--radius);
  min-height:280px;background:var(--char);
  border:1px solid var(--rule-light-soft);
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:24px;color:var(--cream);
  transform-style:preserve-3d;
  transition:transform .25s var(--ease);
}
.sector-card img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;
  opacity:.45;transition:opacity .6s var(--ease),transform .8s var(--ease);
}
.sector-card:hover img{opacity:.7;transform:scale(1.05)}
.sector-card::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,transparent 30%,rgba(10,9,8,.85));
}
.sector-card>*{position:relative;z-index:1}
.sector-card .num{font-family:var(--mono);font-size:11px;letter-spacing:.18em;color:var(--copper)}
.sector-card h3{margin-top:6px;font-size:clamp(22px,2.4vw,30px)}
.sector-card p{font-size:13.5px;color:rgba(245,239,230,.7);margin-top:10px;line-height:1.5}
.sector-card.span-6{grid-column:span 6}
.sector-card.span-4{grid-column:span 4}
.sector-card.span-8{grid-column:span 8}
.sector-card.span-12{grid-column:span 12;min-height:380px}
.sector-card.tall{min-height:420px}

/* ---------- SPLIT FEATURES ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center}
.split.reverse>div:first-child{order:2}

.feature-visual{
  position:relative;aspect-ratio:1/1;border-radius:var(--radius-lg);
  background:linear-gradient(135deg,#1A1714,#2A241D);
  overflow:hidden;display:grid;place-items:center;
  border:1px solid var(--rule-light-soft);
}
.feature-visual svg{width:78%;fill:none;stroke:var(--copper);stroke-width:1.5;animation:slowSpin 32s linear infinite}
.feature-visual::after{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 30% 30%,rgba(184,115,51,.18),transparent 50%);
  pointer-events:none;
}
@keyframes slowSpin{to{transform:rotate(360deg)}}

/* ---------- FEATURE LIST ---------- */
.feature-list{display:flex;flex-direction:column;border-top:1px solid var(--rule)}
.feature-list .item{
  display:grid;grid-template-columns:auto 1fr auto;
  gap:24px;align-items:center;
  padding-block:clamp(22px,2.4vw,32px);
  border-bottom:1px solid var(--rule);
  transition:padding .35s var(--ease);
  position:relative;cursor:none;
}
.feature-list .item:hover{padding-inline:clamp(8px,1.4vw,18px)}
.feature-list .item::before{
  content:"";position:absolute;inset:0;background:var(--copper);transform:scaleX(0);transform-origin:left;
  transition:transform .5s var(--ease-out);z-index:-1;border-radius:6px;opacity:.06;
}
.feature-list .item:hover::before{transform:scaleX(1)}
.feature-list .num{font-family:var(--mono);font-size:13px;color:var(--copper)}
.feature-list .item h3{font-size:clamp(22px,2.4vw,32px);font-family:var(--display);font-weight:400;line-height:1.05}
.feature-list .item p{font-size:14px;color:var(--olive);margin-top:6px;max-width:56ch}
.feature-list .arrow{
  width:42px;height:42px;border:1px solid var(--ink);border-radius:50%;
  display:grid;place-items:center;transition:background .3s,color .3s;
}
.feature-list .item:hover .arrow{background:var(--ink);color:var(--cream)}
.dark-section .feature-list,.dark-section .feature-list .item{border-color:var(--rule-light-soft)}
.dark-section .feature-list .arrow{border-color:var(--cream)}
.dark-section .feature-list .item:hover .arrow{background:var(--cream);color:var(--ink)}
.dark-section .feature-list .item p{color:rgba(245,239,230,.65)}

/* ---------- SERVICE BLOCK (services page) ---------- */
.service-block{
  display:grid;grid-template-columns:auto 1fr;gap:clamp(40px,6vw,100px);
  padding-block:clamp(60px,8vw,120px);
  border-top:1px solid var(--rule);
}
.service-block:last-child{border-bottom:1px solid var(--rule)}
.service-block .num{
  font-family:var(--display);font-size:clamp(64px,8vw,128px);line-height:.9;
  color:var(--copper);font-weight:300;font-variation-settings:"opsz" 144,"SOFT" 30;
}
.service-block .num small{font-family:var(--mono);font-size:14px;color:var(--muted);display:block;letter-spacing:.16em;margin-top:14px}
.service-block .body h2{font-size:clamp(34px,4.4vw,68px);margin-bottom:20px}
.service-block .body p{font-size:17px;color:var(--olive);max-width:62ch;line-height:1.6;margin-bottom:18px}
.service-block .body ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:34px;padding-top:34px;border-top:1px solid var(--rule)}
.service-block .body ul li{
  display:flex;gap:14px;align-items:flex-start;
  font-size:14.5px;line-height:1.5;color:var(--ink);
}
.service-block .body ul li svg{flex:0 0 18px;margin-top:4px;color:var(--copper)}

/* ---------- ABOUT VALUES ---------- */
.values-row{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--rule-light-soft);border:1px solid var(--rule-light-soft);border-radius:var(--radius)}
.value{padding:clamp(28px,3.4vw,44px);background:var(--ink);min-height:280px;display:flex;flex-direction:column;justify-content:space-between}
.value .num{font-family:var(--mono);font-size:13px;color:var(--copper);letter-spacing:.16em}
.value h3{font-size:clamp(22px,2.4vw,30px);margin-block:14px 12px;color:var(--cream)}
.value p{font-size:14.5px;color:rgba(245,239,230,.65);line-height:1.55}

/* ---------- LOCATION / JURISDICTION ---------- */
.jurisdiction{
  position:relative;padding-block:clamp(80px,10vw,160px);
  background:linear-gradient(180deg,var(--ink),var(--ash));
  color:var(--cream);overflow:hidden;
}
.jurisdiction::before{
  content:"";position:absolute;inset:0;
  background-image:radial-gradient(circle at 80% 20%,rgba(184,115,51,.16),transparent 38%),radial-gradient(circle at 12% 80%,rgba(184,115,51,.08),transparent 30%);
  pointer-events:none;
}
.juris-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,100px);align-items:center;position:relative}
.juris-stat{padding:30px 0;border-top:1px solid var(--rule-light-soft)}
.juris-stat strong{font-family:var(--display);font-size:clamp(46px,5vw,80px);line-height:1;color:var(--copper);font-weight:300;font-variation-settings:"opsz" 144,"SOFT" 30}
.juris-stat span{display:block;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:rgba(245,239,230,.6);margin-top:10px}

.compass{
  position:relative;aspect-ratio:1/1;
  display:grid;place-items:center;
}
.compass svg{width:100%;fill:none;stroke:var(--copper);stroke-width:1;animation:slowSpin 60s linear infinite}
.compass-label{
  position:absolute;font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--cream);
}
.compass-label.n{top:-6px;left:50%;transform:translateX(-50%)}
.compass-label.e{right:-6px;top:50%;transform:translateY(-50%)}
.compass-label.s{bottom:-6px;left:50%;transform:translateX(-50%)}
.compass-label.w{left:-6px;top:50%;transform:translateY(-50%)}
.compass-center{
  position:absolute;text-align:center;color:var(--cream);
}
.compass-center strong{font-family:var(--display);font-size:38px;display:block;color:var(--cream);font-weight:300}
.compass-center small{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper)}

/* ---------- FAQ ---------- */
.faq{display:flex;flex-direction:column}
.faq details{
  padding:clamp(24px,3vw,38px) 0;border-bottom:1px solid var(--rule-light-soft);
  cursor:none;
}
.faq summary{
  display:flex;justify-content:space-between;align-items:center;gap:24px;
  font-family:var(--display);font-size:clamp(20px,2.2vw,28px);font-weight:400;
  list-style:none;cursor:none;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"+";font-family:var(--mono);font-size:24px;color:var(--copper);
  transition:transform .35s var(--ease);
}
.faq details[open] summary::after{transform:rotate(45deg)}
.faq p{
  margin-top:16px;font-size:15.5px;color:rgba(245,239,230,.7);line-height:1.65;max-width:80ch;
}

/* ---------- CONTACT ---------- */
.contact-page{background:var(--bone);color:var(--ink)}
.contact-grid{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(40px,6vw,100px);align-items:flex-start}
.contact-left h1{font-size:clamp(46px,7vw,108px)}
.contact-left p.lead{margin-block:24px 36px;color:var(--olive)}
.contact-meta{display:grid;gap:1px;background:var(--rule);border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);margin-top:34px}
.contact-meta>div{padding:18px 0;background:var(--bone);display:grid;grid-template-columns:1fr 2fr;gap:18px;align-items:center}
.contact-meta .label{padding-block:0}
.contact-meta strong{font-family:var(--mono);font-size:13px;font-weight:500;letter-spacing:.04em}

.contact-form{
  display:grid;gap:18px;padding:clamp(28px,3.4vw,46px);
  background:var(--cream);border:1px solid var(--rule);
  border-radius:var(--radius-lg);box-shadow:0 30px 80px rgba(10,9,8,.06);
}
.field{display:flex;flex-direction:column;gap:8px}
.field input,.field select,.field textarea{
  background:transparent;border:0;border-bottom:1px solid var(--rule);
  padding:14px 4px 12px;font-size:15.5px;outline:none;
  transition:border-color .3s;
  font-family:var(--sans);
}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--copper)}
.field textarea{resize:vertical;min-height:120px}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.contact-form button{
  margin-top:14px;width:100%;justify-content:center;
}

/* ---------- FOOTER ---------- */
.footer{
  background:var(--ink);color:var(--cream);
  padding-top:clamp(80px,10vw,140px);padding-bottom:30px;
  position:relative;overflow:hidden;
}
.footer-mark{
  font-family:var(--display);
  font-size:clamp(44px,6.4vw,92px);line-height:.95;
  color:var(--cream);
  font-variation-settings:"opsz" 144,"SOFT" 30,"WONK" 1;
  letter-spacing:-.055em;font-weight:300;
  white-space:normal;overflow:visible;word-break:normal;overflow-wrap:normal;
  border-bottom:1px solid var(--rule-light-soft);
  padding-bottom:clamp(34px,5vw,68px);margin-bottom:50px;
}
.footer-mark em{font-style:italic;color:var(--copper);font-variation-settings:"opsz" 144,"SOFT" 100,"WONK" 1}
.footer-grid{
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:48px;
  align-items:flex-start;margin-bottom:60px;
}
.footer-grid h4{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--copper);font-weight:500;margin-bottom:18px}
.footer-grid ul{list-style:none;display:flex;flex-direction:column;gap:10px}
.footer-grid a{font-size:14.5px;color:rgba(245,239,230,.78);transition:color .25s}
.footer-grid a:hover{color:var(--copper)}
.footer-grid p{font-size:14.5px;color:rgba(245,239,230,.65);max-width:38ch;line-height:1.55}
.footer-bottom{
  display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;
  padding-top:24px;border-top:1px solid var(--rule-light-soft);
  font-family:var(--mono);font-size:11px;letter-spacing:.12em;text-transform:uppercase;
  color:rgba(245,239,230,.5);
}
.footer-bottom .live-dot{width:6px;height:6px;background:var(--copper);border-radius:50%;display:inline-block;margin-right:8px;animation:pulse 2.4s infinite}

/* ---------- REVEAL ANIMATIONS ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity 1s var(--ease-out),transform 1s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.reveal.delay-1{transition-delay:.1s}
.reveal.delay-2{transition-delay:.2s}
.reveal.delay-3{transition-delay:.3s}

/* ---------- SCROLL PROGRESS ---------- */
.progress-bar{
  position:fixed;left:0;top:0;height:2px;background:var(--copper);
  width:0;z-index:80;transition:width .15s linear;
}

/* ---------- SIDE INDEX ---------- */
.side-index{
  position:fixed;left:24px;top:50%;transform:translateY(-50%);z-index:50;
  display:flex;flex-direction:column;gap:18px;
}
.side-index a{
  font-family:var(--mono);font-size:10px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);display:flex;align-items:center;gap:12px;
  transition:color .3s,transform .4s var(--ease);
  white-space:nowrap;
}
.side-index a::before{
  content:"";width:14px;height:1px;background:currentColor;transition:width .4s var(--ease);
}
.side-index a:hover,.side-index a.active{color:var(--copper);transform:translateX(4px)}
.side-index a.active::before{width:30px}
.dark-mode-active .side-index a{color:rgba(245,239,230,.4)}
@media (max-width:1100px){.side-index{display:none}}

/* ---------- PAGE TRANSITION ---------- */
.page-overlay{
  position:fixed;inset:0;background:var(--ink);z-index:300;
  transform:translateY(100%);pointer-events:none;
}
.page-overlay.active{
  animation:overlayIn .55s var(--ease-out) forwards;
}
@keyframes overlayIn{
  0%{transform:translateY(100%)}
  100%{transform:translateY(0)}
}

/* ---------- RESPONSIVE ---------- */
@media (max-width:1100px){
  .pillars,.values-row{grid-template-columns:1fr 1fr}
  .counter-strip{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
  .workflow-sticky .container{grid-template-columns:1fr}
  .workflow-left{position:relative;top:0}
  .sectors-grid .sector-card.span-6,.sectors-grid .sector-card.span-4,.sectors-grid .sector-card.span-8{grid-column:span 12}
}
@media (max-width:820px){
  body{cursor:auto}
  .cursor,.cursor-trail{display:none}
  .nav,.header-cta{display:none}
  .menu-btn{display:block}
  .site-header.open .nav{
    display:flex;flex-direction:column;align-items:stretch;gap:6px;
    position:absolute;left:16px;right:16px;top:80px;
    padding:18px;background:var(--bone);
    border:1px solid var(--rule);border-radius:var(--radius);
    box-shadow:0 30px 80px rgba(10,9,8,.16);
  }
  .site-header.dark.open .nav{background:var(--ash);border-color:var(--rule-light-soft)}
  .site-header.open .nav a{padding:14px 16px;border-radius:14px}
  .hero-meta{flex-direction:column;align-items:flex-start;gap:18px}
  .hero-sub{grid-template-columns:1fr}
  .pillars,.values-row{grid-template-columns:1fr}
  .counter-strip{grid-template-columns:1fr}
  .split,.split.reverse>div:first-child,.juris-grid,.contact-grid{grid-template-columns:1fr}
  .split.reverse>div:first-child{order:initial}
  .service-block{grid-template-columns:1fr;gap:24px}
  .service-block .body ul{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr;gap:36px}
  .field-row{grid-template-columns:1fr}
  .head-row{grid-template-columns:1fr;gap:14px}
  .head-row .index{padding-bottom:0;border:0}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.01s!important;transition-duration:.01s!important}
  .ticker-track{animation:none}
}

/* ============================================================
   V2 VISUAL REFRESH — Montserrat · Responsive · Slides
   Added for the improved version
   ============================================================ */
:root{
  --ink:#090B0F;
  --ash:#111827;
  --char:#18202C;
  --bone:#F6F1E8;
  --paper:#EFE6D6;
  --cream:#FFF8EC;
  --copper:#C57A35;
  --copper-deep:#8F5527;
  --olive:#63604F;
  --muted:#8E887B;
  --rule:rgba(9,11,15,.14);
  --rule-soft:rgba(9,11,15,.075);
  --rule-light:rgba(255,248,236,.18);
  --rule-light-soft:rgba(255,248,236,.08);
  --display:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --sans:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --mono:'Montserrat',system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  --shadow-sm:0 14px 36px rgba(9,11,15,.08);
  --shadow-md:0 28px 84px rgba(9,11,15,.13);
  --shadow-lg:0 42px 120px rgba(9,11,15,.18);
}

html{background:var(--bone);text-rendering:optimizeLegibility}
body{
  font-family:var(--sans);
  letter-spacing:-.01em;
  background:
    radial-gradient(circle at 8% 10%, rgba(197,122,53,.14), transparent 28rem),
    radial-gradient(circle at 92% 5%, rgba(9,11,15,.08), transparent 30rem),
    linear-gradient(180deg, var(--bone) 0%, #F9F3E8 42%, var(--paper) 100%);
}

h1,h2,h3,h4,.footer-mark{
  font-family:var(--display);
  font-weight:800;
  letter-spacing:-.065em;
  font-variation-settings:normal;
}
h1{font-size:clamp(50px,8.6vw,138px);line-height:.88}
h2{font-size:clamp(36px,5.5vw,82px);line-height:.9}
h3{font-size:clamp(25px,2.6vw,38px);line-height:1}
.italic{
  font-family:var(--display);
  font-style:italic;
  font-weight:650;
  font-variation-settings:normal;
}
.eyebrow,.label,.hero-meta-block small,.hero-meta-block strong,.ticker,.side-index a,.footer-bottom,.brand-text small,.footer-grid h4{
  font-family:var(--mono);
  font-weight:700;
  letter-spacing:.16em;
}
.lead,.hero-sub-text,.intro-quote,.service-block .body p,.wf-step p,.pillar p,.value p,.contact-left p.lead{
  letter-spacing:-.018em;
}

.site-header{
  top:14px;left:var(--pad);right:var(--pad);
  border:1px solid rgba(255,255,255,.34);
  border-bottom-color:rgba(9,11,15,.08);
  border-radius:999px;
  padding:12px 14px 12px 18px;
  background:rgba(255,248,236,.72);
  box-shadow:0 16px 50px rgba(9,11,15,.08);
}
.site-header.scrolled{padding-block:10px;background:rgba(255,248,236,.9)}
.site-header.dark{background:rgba(9,11,15,.62);border-color:rgba(255,248,236,.12);box-shadow:0 18px 58px rgba(0,0,0,.2)}
.site-header.dark.scrolled{background:rgba(9,11,15,.86)}
.brand .glyph{width:34px;height:34px;filter:drop-shadow(0 8px 18px rgba(197,122,53,.25))}
.brand-text strong{font-size:12px;letter-spacing:.2em;font-weight:900}
.nav a{font-weight:750;font-size:12px;padding:9px 13px}
.nav a:hover,.nav a.active{background:rgba(197,122,53,.12);color:var(--ink)}
.dark .nav a:hover,.dark .nav a.active{background:rgba(255,248,236,.12);color:var(--cream)}
.header-cta,.btn{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 12px 30px rgba(9,11,15,.08);
}
.header-cta{border-color:rgba(9,11,15,.22);background:rgba(255,255,255,.28)}

.hero{
  min-height:100svh;
  padding-top:170px;
  background:
    radial-gradient(circle at 72% 26%, rgba(197,122,53,.18), transparent 28rem),
    radial-gradient(circle at 30% 5%, rgba(255,255,255,.85), transparent 28rem),
    linear-gradient(145deg, #fbf5ea 0%, var(--bone) 54%, #e7dac5 100%);
}
.hero-grid-bg{background-size:64px 64px;opacity:.76}
.hero-watermark{stroke:rgba(197,122,53,.26);filter:drop-shadow(0 22px 55px rgba(197,122,53,.18))}
.hero-meta{
  padding:18px;
  border:1px solid rgba(9,11,15,.09);
  border-radius:var(--radius-lg);
  background:rgba(255,248,236,.5);
  backdrop-filter:blur(16px);
  box-shadow:var(--shadow-sm);
}
.hero-meta-block strong{font-size:12px;letter-spacing:.09em}
.hero-sub-text{font-size:clamp(16px,1.32vw,19px);color:rgba(9,11,15,.68)}
.btn{border-color:rgba(9,11,15,.24);font-weight:850}
.btn.primary{background:linear-gradient(135deg,var(--ink),#17202B)}
.btn.primary::before,.header-cta::after{background:linear-gradient(135deg,var(--copper),#E3A15C)}
.btn.ghost{background:rgba(255,248,236,.52);backdrop-filter:blur(14px)}

.ticker{padding-block:14px;background:linear-gradient(90deg,var(--ink),#151B24 50%,var(--ink));border:0;box-shadow:0 22px 70px rgba(9,11,15,.18)}
.section{padding-block:clamp(76px,9vw,140px)}
.head-row,.split,.contact-grid,.juris-grid,.workflow-sticky .container{
  gap:clamp(34px,5.8vw,92px);
}
.pillar,.value,.wf-step,.contact-form,.juris-card,.feature-list .item,.sector-card,.service-block{
  box-shadow:var(--shadow-sm);
}
.pillar,.value,.contact-form,.juris-card,.feature-list .item,.wf-step{
  border-color:rgba(9,11,15,.09);
  background:rgba(255,248,236,.68);
  backdrop-filter:blur(18px);
}
.pillar:hover,.sector-card:hover,.value:hover,.feature-list .item:hover{
  box-shadow:var(--shadow-md);
}
.sector-card{border-radius:30px;overflow:hidden;background:#111827}
.sector-card::after{background:linear-gradient(180deg,rgba(9,11,15,.02),rgba(9,11,15,.84))}
.service-block{border-radius:32px;padding:clamp(26px,4vw,54px);background:rgba(255,248,236,.54);border:1px solid rgba(9,11,15,.08);backdrop-filter:blur(16px)}
.service-block + .service-block{margin-top:34px}

/* ----- Homepage mandate slider: cinematic route UI ----- */
.slider-section.routes-showcase{
  --mx:50%;
  --my:50%;
  position:relative;
  padding-top:clamp(88px,10vw,150px);
  padding-bottom:clamp(92px,10vw,160px);
  color:var(--cream);
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(197,122,53,.20), transparent 26rem),
    radial-gradient(circle at 18% 12%, rgba(255,248,236,.08), transparent 26rem),
    linear-gradient(135deg, #08090c 0%, #13100d 46%, #24180f 100%);
  overflow:hidden;
  isolation:isolate;
}
.slider-section.routes-showcase::before{
  content:"";
  position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,248,236,.055) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,248,236,.045) 1px, transparent 1px);
  background-size:70px 70px;
  mask-image:linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  -webkit-mask-image:linear-gradient(180deg, transparent 0%, #000 14%, #000 86%, transparent 100%);
  pointer-events:none;
  z-index:-3;
}
.slider-section.routes-showcase::after{
  content:"";
  position:absolute;inset:0;
  background:linear-gradient(120deg, rgba(255,255,255,.04), transparent 36%, rgba(197,122,53,.08) 68%, transparent);
  mix-blend-mode:screen;
  pointer-events:none;
  z-index:-2;
}
.routes-ambient{
  position:absolute;
  border-radius:999px;
  filter:blur(18px);
  opacity:.55;
  pointer-events:none;
  z-index:-1;
  animation:ambientFloat 12s var(--ease-in-out, ease-in-out) infinite alternate;
}
.routes-ambient-one{
  width:360px;height:360px;right:-110px;top:16%;
  background:radial-gradient(circle, rgba(197,122,53,.32), transparent 65%);
}
.routes-ambient-two{
  width:280px;height:280px;left:-90px;bottom:12%;
  background:radial-gradient(circle, rgba(255,248,236,.15), transparent 68%);
  animation-delay:-4s;
}
@keyframes ambientFloat{
  from{transform:translate3d(-12px,18px,0) scale(.95)}
  to{transform:translate3d(18px,-16px,0) scale(1.08)}
}
.routes-header{
  display:grid;
  grid-template-columns:minmax(280px,.9fr) minmax(280px,.82fr);
  gap:clamp(28px,6vw,92px);
  align-items:end;
  margin-bottom:clamp(30px,4vw,58px);
}
.routes-header .eyebrow{color:#F2B572}
.routes-header h2{
  max-width:10.2ch;
  color:var(--cream);
  text-wrap:balance;
}
.routes-header .lead{
  color:rgba(255,248,236,.70);
  max-width:62ch;
}
.slider-shell.route-lab{
  position:relative;
  display:grid;
  grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr);
  gap:clamp(18px,3vw,34px);
  align-items:stretch;
  padding:clamp(14px,1.7vw,22px);
  border:1px solid rgba(255,248,236,.14);
  border-radius:clamp(30px,4vw,54px);
  background:
    linear-gradient(135deg, rgba(255,248,236,.11), rgba(255,248,236,.045)),
    rgba(255,248,236,.035);
  box-shadow:0 40px 120px rgba(0,0,0,.38);
  backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
  overflow:hidden;
}
.slider-shell.route-lab::before{
  content:"";
  position:absolute;inset:1px;
  border-radius:inherit;
  background:linear-gradient(145deg, rgba(255,255,255,.08), transparent 36%, rgba(197,122,53,.10));
  pointer-events:none;
}
.route-copy{
  position:relative;
  z-index:2;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:clamp(20px,3vw,34px);
  min-height:clamp(540px,58vw,720px);
  padding:clamp(24px,3vw,46px);
  border-radius:clamp(24px,3vw,40px);
  background:
    radial-gradient(circle at 20% 18%, rgba(197,122,53,.22), transparent 18rem),
    linear-gradient(180deg, rgba(255,248,236,.12), rgba(255,248,236,.055));
  border:1px solid rgba(255,248,236,.12);
  color:var(--cream);
}
.route-label{
  width:max-content;
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  border-radius:999px;
  background:rgba(242,181,114,.12);
  color:#F2B572;
  border:1px solid rgba(242,181,114,.28);
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
  font-weight:800;
}
.route-copy h3{
  max-width:10.8ch;
  color:var(--cream);
  font-family:var(--display);
  font-size:clamp(36px,4vw,66px);
  line-height:.92;
  letter-spacing:-.055em;
}
.route-copy p{
  max-width:45ch;
  color:rgba(255,248,236,.68);
  font-size:16px;
  line-height:1.7;
}
.route-chips{
  display:flex;
  flex-wrap:wrap;
  gap:9px;
}
.route-chips span{
  display:inline-flex;
  align-items:center;
  padding:9px 12px;
  border-radius:999px;
  color:rgba(255,248,236,.78);
  border:1px solid rgba(255,248,236,.16);
  background:rgba(255,248,236,.06);
  font-size:12px;
  font-weight:700;
}
.route-stats{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:10px;
}
.route-stats div{
  min-width:0;
  padding:15px 14px;
  border-radius:20px;
  background:rgba(5,7,10,.24);
  border:1px solid rgba(255,248,236,.12);
}
.route-stats strong{
  display:block;
  color:#F2B572;
  font-family:var(--display);
  font-size:clamp(30px,3vw,42px);
  line-height:1;
  letter-spacing:-.04em;
}
.route-stats small{
  display:block;
  margin-top:7px;
  color:rgba(255,248,236,.56);
  font-family:var(--mono);
  font-size:9px;
  letter-spacing:.12em;
  text-transform:uppercase;
  line-height:1.35;
}
.slider-controls{display:flex;gap:12px;align-items:center;margin-top:auto}
.slider-btn{
  display:grid;place-items:center;
  width:54px;height:54px;
  border-radius:50%;
  border:1px solid rgba(255,248,236,.18);
  color:var(--cream);
  background:rgba(255,248,236,.08);
  box-shadow:0 18px 40px rgba(0,0,0,.18);
  transition:transform .3s var(--ease),background .3s var(--ease),color .3s var(--ease),border-color .3s var(--ease);
}
.slider-btn:hover{transform:translateY(-3px);background:var(--cream);color:var(--ink);border-color:var(--cream)}
.slider-btn svg{width:20px;height:20px}
.mandate-slider{
  position:relative;
  min-height:clamp(540px,58vw,720px);
  border-radius:clamp(24px,3vw,42px);
  overflow:hidden;
  isolation:isolate;
  background:#07090d;
  box-shadow:inset 0 0 0 1px rgba(255,248,236,.12), 0 30px 90px rgba(0,0,0,.32);
  outline:none;
  transform-style:preserve-3d;
}
.mandate-slider:focus-visible{box-shadow:inset 0 0 0 2px rgba(242,181,114,.75),0 30px 90px rgba(0,0,0,.32)}
.mandate-slide{
  position:absolute;
  inset:0;
  opacity:0;
  pointer-events:none;
  transform:translate3d(0,18px,0) scale(1.025);
  transition:opacity .85s var(--ease-out), transform 1.1s var(--ease-out);
  overflow:hidden;
}
.mandate-slide.is-active{opacity:1;pointer-events:auto;transform:translate3d(0,0,0) scale(1)}
.mandate-slide img{
  width:100%;height:100%;object-fit:cover;
  filter:saturate(1.04) contrast(1.08) brightness(.86);
  transform:scale(1.10) translate3d(0,0,0);
  transform-origin:50% 50%;
}
.mandate-slide.is-active img{animation:routeImageDrift 8.2s linear forwards}
@keyframes routeImageDrift{
  0%{transform:scale(1.13) translate3d(-1.4%, 1.2%, 0)}
  50%{transform:scale(1.08) translate3d(1.2%, -.8%, 0)}
  100%{transform:scale(1.11) translate3d(-.4%, -.6%, 0)}
}
.mandate-slide::before{
  content:"";
  position:absolute;inset:-20%;
  z-index:1;
  background:
    radial-gradient(circle at var(--mx) var(--my), rgba(242,181,114,.18), transparent 16rem),
    linear-gradient(115deg, rgba(7,9,13,.92) 0%, rgba(7,9,13,.58) 42%, rgba(7,9,13,.18) 100%),
    linear-gradient(180deg, rgba(7,9,13,.02), rgba(7,9,13,.70));
  pointer-events:none;
}
.mandate-slide::after{
  content:"";
  position:absolute;inset:0;
  z-index:2;
  background:
    repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 12px),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,.28) 100%);
  mix-blend-mode:soft-light;
  opacity:.55;
  pointer-events:none;
}
.route-line{
  position:absolute;
  z-index:3;
  left:clamp(24px,5vw,78px);
  right:clamp(24px,5vw,78px);
  top:clamp(24px,4vw,58px);
  height:1px;
  background:linear-gradient(90deg, transparent, rgba(242,181,114,.72), transparent);
  opacity:.82;
  transform-origin:left center;
}
.route-line span{
  position:absolute;top:50%;
  width:9px;height:9px;border-radius:50%;
  background:#F2B572;
  box-shadow:0 0 0 8px rgba(242,181,114,.12), 0 0 22px rgba(242,181,114,.65);
  transform:translate(-50%,-50%);
}
.route-line span:nth-child(1){left:10%}
.route-line span:nth-child(2){left:52%}
.route-line span:nth-child(3){left:88%}
.mandate-slide.is-active .route-line{animation:routeLineIn 1.2s var(--ease-out) both .18s}
.mandate-slide.is-active .route-line span{animation:routeNodePulse 2.2s ease-in-out infinite}
.mandate-slide.is-active .route-line span:nth-child(2){animation-delay:.22s}
.mandate-slide.is-active .route-line span:nth-child(3){animation-delay:.44s}
@keyframes routeLineIn{from{transform:scaleX(.18);opacity:0}to{transform:scaleX(1);opacity:.82}}
@keyframes routeNodePulse{0%,100%{transform:translate(-50%,-50%) scale(.9)}50%{transform:translate(-50%,-50%) scale(1.18)}}
.slide-panel{
  position:absolute;
  left:clamp(24px,5vw,74px);
  right:clamp(24px,5vw,74px);
  bottom:clamp(72px,7vw,104px);
  z-index:4;
  max-width:680px;
  color:var(--cream);
}
.slide-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:20px;
  font-family:var(--mono);
  font-size:11px;
  line-height:1;
  font-weight:800;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:#F2B572;
}
.slide-kicker::before{content:"";width:30px;height:1px;background:currentColor}
.slide-panel h3{
  max-width:13.5ch;
  color:var(--cream);
  font-size:clamp(38px,4.7vw,76px);
  line-height:.88;
  letter-spacing:-.064em;
  text-wrap:balance;
}
.slide-panel p{max-width:56ch;margin-top:20px;color:rgba(255,248,236,.76);font-size:clamp(15px,1.25vw,18px);line-height:1.66}
.slide-panel .more{
  display:inline-flex;
  margin-top:28px;
  padding:13px 18px;
  border-radius:999px;
  border:1px solid rgba(255,248,236,.24);
  color:var(--cream);
  background:rgba(255,248,236,.10);
  backdrop-filter:blur(10px);
  transition:background .3s var(--ease),color .3s var(--ease),transform .3s var(--ease);
}
.slide-panel .more:hover{background:var(--cream);color:var(--ink);transform:translateY(-2px)}
.slide-data-card{
  position:absolute;
  top:clamp(58px,7vw,110px);
  right:clamp(20px,3vw,42px);
  z-index:4;
  width:min(230px,28vw);
  padding:18px;
  border-radius:24px;
  color:var(--cream);
  border:1px solid rgba(255,248,236,.18);
  background:rgba(5,7,10,.36);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
  box-shadow:0 24px 60px rgba(0,0,0,.24);
  transform:translateY(14px);
  opacity:0;
}
.mandate-slide.is-active .slide-data-card{animation:routeCardIn .8s var(--ease-out) both .45s}
@keyframes routeCardIn{to{opacity:1;transform:translateY(0)}}
.slide-data-card small{
  display:block;
  color:#F2B572;
  font-family:var(--mono);
  font-size:10px;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.slide-data-card strong{
  display:block;
  margin-top:10px;
  font-size:20px;
  line-height:1.1;
}
.slide-data-card span{
  display:block;
  margin-top:8px;
  color:rgba(255,248,236,.58);
  font-size:13px;
}
.slider-dots{
  position:absolute;
  left:clamp(24px,5vw,74px);
  bottom:28px;
  z-index:5;
  display:flex;
  gap:10px;
}
.slider-dots button{
  width:34px;height:7px;
  border-radius:999px;
  background:rgba(255,248,236,.28);
  transition:width .35s var(--ease),background .35s var(--ease),transform .35s var(--ease);
}
.slider-dots button:hover{transform:translateY(-1px);background:rgba(255,248,236,.55)}
.slider-dots button.is-active{width:64px;background:#F2B572}
.slider-progress{
  position:absolute;
  left:0;right:0;bottom:0;
  height:3px;
  background:rgba(255,248,236,.14);
  z-index:6;
}
.slider-progress span{
  display:block;height:100%;width:0%;
  background:linear-gradient(90deg,var(--copper),#F2B572,#fff1c8);
}
.mandate-slider.is-running .slider-progress span{animation:slideProgress 6.5s linear forwards}
@keyframes slideProgress{from{width:0%}to{width:100%}}

/* ----- Better form and mobile interactions ----- */
.field input,.field select,.field textarea{
  background:rgba(255,255,255,.28);
  border:1px solid rgba(9,11,15,.12);
  border-radius:16px;
  padding:15px 16px;
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:rgba(197,122,53,.75);
  box-shadow:0 0 0 4px rgba(197,122,53,.12);
}
.contact-meta{border-radius:24px;overflow:hidden;border:1px solid rgba(9,11,15,.08)}
.contact-meta>div{padding:18px;background:rgba(255,248,236,.62)}

@media (max-width:1180px){
  .slider-shell{grid-template-columns:1fr}
  .slider-copy{display:grid;grid-template-columns:1fr auto;align-items:end}
  .slider-copy h2{max-width:12ch}
  .slider-copy .lead{max-width:60ch}
  .slider-controls{align-self:end}
}
@media (max-width:900px){
  .site-header{top:10px;left:12px;right:12px;border-radius:24px;padding:12px 14px}
  .site-header.open{border-radius:26px 26px 0 0}
  .site-header.open .nav{top:68px;left:0;right:0;border-radius:0 0 26px 26px;margin-inline:0;background:rgba(255,248,236,.96);backdrop-filter:blur(18px)}
  .hero{padding-top:135px;min-height:auto;padding-bottom:54px}
  .hero h1{font-size:clamp(48px,13vw,86px)}
  .hero-meta{padding:16px;border-radius:24px}
  .slider-copy{display:flex;align-items:flex-start}
  .slider-copy h2{max-width:10ch}
  .mandate-slider{min-height:520px}
  .mandate-slide::after{background:linear-gradient(180deg, rgba(9,11,15,.12), rgba(9,11,15,.86))}
  .slide-panel{bottom:62px}
  .slide-panel h3{max-width:11ch;font-size:clamp(32px,10vw,54px)}
  .footer-mark{white-space:normal}
}
@media (max-width:620px){
  :root{--pad:18px}
  h1{font-size:clamp(43px,14vw,68px)}
  h2{font-size:clamp(32px,10vw,52px)}
  .brand-text small{display:none}
  .brand-text strong{font-size:11px}
  .brand .glyph{width:30px;height:30px}
  .menu-btn{width:40px;height:40px}
  .hero-actions,.slider-controls{width:100%}
  .btn{width:100%;justify-content:center;padding:16px 20px}
  .slider-shell{padding:14px;border-radius:28px}
  .slider-copy{padding:8px 6px 0}
  .slider-copy .lead{font-size:15.5px}
  .slider-controls{justify-content:flex-start}
  .mandate-slider{min-height:560px;border-radius:24px}
  .slide-panel{left:20px;right:20px;bottom:66px}
  .slide-panel p{font-size:15px}
  .slider-dots{left:20px;bottom:24px}
  .slider-dots button{width:26px}
  .slider-dots button.is-active{width:44px}
  .contact-meta>div{grid-template-columns:1fr;gap:7px}
  .footer-bottom{font-size:10px}
}
@media (prefers-reduced-motion:reduce){
  .mandate-slide,.mandate-slide img{transition:none!important;animation:none!important}
  .mandate-slider.is-running .slider-progress span{animation:none!important;width:100%}
}




/* ----- Routes UI responsive refinement ----- */
@media (max-width:1180px){
  .routes-header{grid-template-columns:1fr;gap:24px}
  .routes-header h2{max-width:12ch}
  .slider-shell.route-lab{grid-template-columns:1fr}
  .route-copy{min-height:auto}
  .route-copy h3{max-width:15ch}
  .mandate-slider{min-height:620px}
}
@media (max-width:900px){
  .slider-section.routes-showcase{padding-top:78px;padding-bottom:92px}
  .route-stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .mandate-slider{min-height:610px}
  .mandate-slide::before{
    background:
      radial-gradient(circle at var(--mx) var(--my), rgba(242,181,114,.14), transparent 15rem),
      linear-gradient(180deg, rgba(7,9,13,.20) 0%, rgba(7,9,13,.88) 76%);
  }
  .slide-panel{bottom:78px}
  .slide-panel h3{max-width:12ch;font-size:clamp(36px,10.5vw,62px)}
  .slide-data-card{top:72px;left:22px;right:auto;width:min(260px,calc(100% - 44px));padding:14px;border-radius:20px}
}
@media (max-width:620px){
  .routes-header .lead{font-size:15.5px}
  .slider-shell.route-lab{padding:12px;border-radius:28px}
  .route-copy{padding:22px;border-radius:22px;gap:20px}
  .route-copy h3{font-size:clamp(32px,10vw,50px);max-width:13ch}
  .route-copy p{font-size:15px}
  .route-chips span{font-size:11px;padding:8px 10px}
  .route-stats{grid-template-columns:1fr;gap:8px}
  .route-stats div{padding:13px 14px}
  .route-stats strong{font-size:32px}
  .slider-controls{width:100%}
  .slider-btn{width:50px;height:50px}
  .mandate-slider{min-height:650px;border-radius:24px}
  .route-line{top:34px;left:22px;right:22px}
  .slide-panel{left:20px;right:20px;bottom:72px}
  .slide-panel p{font-size:15px}
  .slide-panel .more{width:100%;justify-content:center;text-align:center}
  .slide-data-card{display:none}
  .slider-dots{left:20px;bottom:28px}
  .slider-dots button{width:24px}
  .slider-dots button.is-active{width:48px}
}
@media (prefers-reduced-motion:reduce){
  .routes-ambient,.mandate-slide.is-active img,.mandate-slide.is-active .route-line,.mandate-slide.is-active .route-line span,.mandate-slide.is-active .slide-data-card{animation:none!important}
}

/* ---------- LANGUAGE SWITCH + FOOTER FIXES ---------- */
.lang-switch{
  display:inline-flex;align-items:center;gap:4px;
  padding:4px;border:1px solid rgba(10,9,8,.14);border-radius:999px;
  background:rgba(255,248,236,.52);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
}
.lang-switch a{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:34px;height:30px;padding-inline:10px;border-radius:999px;
  font-family:var(--mono);font-size:11px;font-weight:700;letter-spacing:.12em;
  color:currentColor;opacity:.72;transition:opacity .25s,background .25s,color .25s;
}
.lang-switch a:hover{opacity:1;background:rgba(10,9,8,.07)}
.lang-switch a.active{opacity:1;background:var(--ink);color:var(--cream)}
.site-header.dark .lang-switch{border-color:rgba(245,239,230,.18);background:rgba(245,239,230,.08)}
.site-header.dark .lang-switch a:hover{background:rgba(245,239,230,.12)}
.site-header.dark .lang-switch a.active{background:var(--cream);color:var(--ink)}
.footer-mark{max-width:100%;text-wrap:balance;}
.footer-grid li{color:rgba(245,239,230,.72);font-size:14.5px;line-height:1.55}
@media (min-width:901px){
  .site-header{grid-template-columns:auto 1fr auto auto auto;}
  .footer-mark{font-size:min(6.4vw,92px)}
}
@media (max-width:900px){
  .lang-switch{margin-left:auto}
  .site-header .header-cta{display:none}
  .site-header.open .nav{padding-bottom:18px}
  .site-header.dark.open .nav{background:rgba(20,17,15,.96)}
  .footer-mark{font-size:clamp(42px,13vw,76px);line-height:1.02;letter-spacing:-.05em;}
}
@media (max-width:620px){
  .lang-switch a{min-width:30px;height:28px;padding-inline:8px;font-size:10px}
  .footer-mark{font-size:clamp(38px,14vw,62px)}
}
