/* =========================================================
   ALLIANCE DEVELOPERS — single-page system
   Type: classic Helvetica throughout (Arete-faithful).
   Canvas: slate-blue gradient · terracotta accents & MENU.
   Custom "Enter" cursor · slide-up project panels ·
   hairline-ruled, CV/folder layout. All copy is original.
   ========================================================= */

/* ---------- Reset ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 6rem; }
img, svg { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
ul { list-style: none; }

/* ---------- Tokens ---------- */
:root {
  --ink:        #1a1c1e;
  --blue:       #45586b;   /* base canvas */
  --blue-deep:  #2c3a47;   /* footer / panels */
  --terra:      #9e4d35;   /* MENU overlay surface */
  --accent:     #c2704a;   /* terracotta accent on blue (numerals, lines, hovers) */
  --bone:       #ece8df;

  --rule:       rgba(10,16,22,.30);    /* hairline on blue */
  --rule-soft:  rgba(10,16,22,.16);
  --rule-terra: rgba(22,12,6,.30);     /* hairline on terracotta */
  --rule-bone:  rgba(236,232,223,.22);  /* hairline on deep-blue panels */
  --ink-60:     rgba(26,28,30,.62);
  --ink-45:     rgba(26,28,30,.45);

  --ff: "Helvetica Neue", Helvetica, Arial, "Liberation Sans", sans-serif;
  --ff-serif: Georgia, "Times New Roman", Times, serif;   /* serif accent — numerals only (Tres Mares style) */

  --maxw: 1480px;
  --gutter: clamp(1.15rem, 4.5vw, 4rem);
  --section-y: clamp(3.5rem, 8vw, 8rem);
  --head-h: clamp(4rem, 7vw, 5.5rem);
  --ease: cubic-bezier(.16,.84,.44,1);
}

/* ---------- Base ---------- */
html { background: var(--blue); }
body {
  font-family: var(--ff);
  color: var(--ink);
  font-size: clamp(1rem, .5vw + .92rem, 1.1rem);
  line-height: 1.6;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  overflow-x: hidden;
  min-height: 100vh;
  background: linear-gradient(158deg, #4d6178 0%, #44576a 50%, #374959 100%);
  background-attachment: fixed;
}
::selection { background: var(--ink); color: var(--bone); }

/* ---------- Type ---------- */
h1,h2,h3,h4 { font-family: var(--ff); font-weight: 700; line-height: .98; letter-spacing: -.02em; }
.label { font-size: .7rem; font-weight: 600; letter-spacing: .24em; text-transform: uppercase; color: var(--ink-60); }
.lead { font-size: clamp(1.25rem, 1.4vw + .75rem, 2rem); line-height: 1.28; font-weight: 500; letter-spacing: -.012em; }
.num { font-weight: 400; font-variant-numeric: lining-nums; }
.accent { color: var(--accent); }
.uc { text-transform: uppercase; }

/* ---------- Layout ---------- */
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.rule { height: 1px; background: var(--rule); width: 100%; }
.section { padding-block: var(--section-y); }
.block__grid { display: grid; grid-template-columns: minmax(0,3fr) minmax(0,9fr); gap: clamp(1.5rem,4vw,5rem); align-items: start; }
.block__grid .label { padding-top: .35em; }
@media (max-width: 800px){ .block__grid { grid-template-columns: 1fr; gap: 1.4rem; } }
.maxw-prose { max-width: 60ch; }
.text-balance { text-wrap: balance; }
.mt-m { margin-top: clamp(1.4rem,3vw,2.4rem); }
.mt-l { margin-top: clamp(2.4rem,5vw,4rem); }

/* ---------- Header ---------- */
.site-header {
  position: fixed; top: 0; left: 0; right: 0; z-index: 100;
  height: var(--head-h);
  display: flex; align-items: center; justify-content: space-between;
  padding-inline: var(--gutter);
  color: var(--ink);
  transition: background .4s var(--ease), backdrop-filter .4s var(--ease), color .4s var(--ease);
}
/* No persistent divider line. Once scrolled, the header frosts so content
   passes cleanly underneath instead of a hairline cutting across it. */
body.scrolled .site-header { background: rgba(69,88,107,.80); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); }
body.menu-open .site-header, body.panel-open .site-header { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.brand { font-weight: 700; letter-spacing: .02em; font-size: clamp(1.05rem,1.6vw,1.3rem); display:flex; align-items:baseline; gap:.5rem; transition: opacity .45s var(--ease); }
.brand small { font-weight: 500; letter-spacing: .2em; font-size: .55rem; text-transform: uppercase; color: var(--ink-60); }
body:not(.scrolled):not(.menu-open) .brand { opacity: 0; pointer-events: none; }
.menu-trigger { font-weight: 600; font-size: .8rem; letter-spacing: .22em; text-transform: uppercase; display:flex; align-items:center; gap:.6rem; z-index: 102; }
.menu-trigger .dot { width:7px; height:7px; border-radius:50%; background: var(--accent); display:inline-block; }

/* ---------- MENU overlay (terracotta) ---------- */
.menu {
  position: fixed; inset: 0; z-index: 95;
  background: var(--terra); color: var(--ink);
  padding-top: var(--head-h);
  display: flex; flex-direction: column;
  transform: translateY(-101%);
  transition: transform .62s var(--ease);
  overflow-y: auto;
}
body.menu-open .menu { transform: translateY(0); }
body.menu-open { overflow: hidden; }
.menu::before { content:""; position:absolute; top:var(--head-h); left:0; right:0; height:1px; background: var(--rule-terra); }
.menu__nav { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.menu__link {
  display: flex; align-items: center; justify-content: space-between; gap: 2rem;
  padding: clamp(.5rem,2.2vh,1.4rem) var(--gutter);
  border-bottom: 1px solid var(--rule-terra);
  font-weight: 700; text-transform: uppercase;
  font-size: clamp(2.1rem, 8.5vw, 6.5rem); line-height: 1; letter-spacing: -.025em;
  transition: padding-left .45s var(--ease);
}
.menu__nav .menu__link:first-child { border-top: 1px solid var(--rule-terra); }
.menu__link .idx { font-weight: 400; font-size: clamp(.85rem,1.3vw,1.1rem); letter-spacing: .05em; color: rgba(26,12,6,.55); }
.menu__link:hover { padding-left: calc(var(--gutter) + 1.2rem); }
.menu__foot { display:flex; flex-wrap:wrap; gap: .8rem 2rem; justify-content: space-between; align-items:center; padding: clamp(1.2rem,3vw,2rem) var(--gutter); border-top: 1px solid var(--rule-terra); }
.menu__foot a, .menu__foot span { font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; font-weight: 500; }
.menu__foot a { border-bottom: 1px solid transparent; transition: border-color .3s var(--ease); }
.menu__foot a:hover { border-color: currentColor; }

/* ---------- Hero (intro top · ALLIANCE bottom) ---------- */
.hero { position: relative; min-height: 100svh; display: flex; flex-direction: column; justify-content: space-between; padding-top: calc(var(--head-h) + clamp(1.2rem,4vw,2.8rem)); padding-bottom: clamp(1.4rem,4vh,3.2rem); }
.hero__intro { max-width: 44ch; margin-left: auto; }
.hero__intro .label { display:block; margin-bottom: .9rem; }
.hero__intro p { font-size: clamp(1.05rem,1.4vw,1.4rem); font-weight: 500; line-height: 1.32; letter-spacing: -.01em; }
.hero__title { display:block; font-weight: 700; text-transform: uppercase; font-size: clamp(3.4rem, 17vw, 17rem); line-height: .8; letter-spacing: -.04em; white-space: nowrap; animation: heroRise 1.15s var(--ease) .2s both; }
a.hero__title { transition: opacity .3s var(--ease); }
@keyframes heroRise { from { clip-path: inset(100% 0 0 0); transform: translateY(.12em); } to { clip-path: inset(0 0 0 0); transform: none; } }
.hero__rise { animation: heroFade .9s var(--ease) var(--d,0s) both; }
@keyframes heroFade { from { opacity:0; transform: translateY(16px); } to { opacity:1; transform: none; } }
.hero__scroll { position:absolute; left:50%; bottom: clamp(.7rem,2vh,1.4rem); transform: translateX(-50%); z-index:5; animation: heroFade .9s var(--ease) 1.1s both; }
.hero__scroll .label { color: var(--ink-60); }
@media (prefers-reduced-motion: reduce){ .hero__title{ animation:none; clip-path:none; transform:none; } .hero__rise, .hero__scroll{ animation:none; opacity:1; } }

/* ---------- Block heading ---------- */
.block__head { font-size: clamp(1.9rem, 4.2vw, 3.6rem); font-weight: 700; letter-spacing: -.025em; }
.block p { color: var(--ink); }
.block p.muted { color: var(--ink-60); }

/* ---------- Arrow list rows ---------- */
.rows { margin-top: clamp(1.8rem,4vw,3rem); border-top: 1px solid var(--rule); }
.row-item { border-bottom: 1px solid var(--rule); }
.row-item a { display: flex; align-items: center; gap: clamp(1rem,3vw,2.5rem); padding: clamp(1.3rem,3vw,2.4rem) 0; transition: padding-left .45s var(--ease); }
.row-item a:hover { padding-left: clamp(.6rem,1.5vw,1.2rem); }
.row-item__no { font-weight: 400; font-size: clamp(1rem,1.4vw,1.3rem); color: var(--accent); flex: 0 0 auto; width: 2.6em; }
.row-item__title { font-weight: 700; text-transform: uppercase; font-size: clamp(1.7rem, 4.6vw, 3.4rem); letter-spacing: -.025em; line-height: 1; flex: 1 1 auto; }
.row-item__meta { font-size: .9rem; color: var(--ink-60); max-width: 30ch; text-align: right; flex: 0 1 auto; }
.row-item__arrow { flex: 0 0 auto; width: clamp(2rem,4vw,3.2rem); color: var(--accent); transition: transform .45s var(--ease); }
.row-item a:hover .row-item__arrow { transform: translate(.3rem,.3rem); }
@media (max-width: 720px){
  .row-item a { flex-wrap: wrap; gap: .5rem 1rem; }
  .row-item__no { width: auto; }
  .row-item__title { flex: 1 1 100%; order: 2; }
  .row-item__meta { order: 3; text-align: left; flex: 1 1 auto; }
  .row-item__arrow { order: 3; margin-left: auto; }
}

/* ---------- Stats ---------- */
.stats { display: grid; grid-template-columns: repeat(4,1fr); border-top: 1px solid var(--rule); }
.stat { padding: clamp(1.5rem,3vw,2.6rem) clamp(1rem,2vw,1.8rem) clamp(1.5rem,3vw,2.6rem) 0; border-right: 1px solid var(--rule); display:flex; flex-direction: column; gap:.5rem; }
.stat:last-child { border-right: 0; }
.stat__num { font-family: var(--ff-serif); font-weight: 400; color: var(--accent); font-size: clamp(3rem,6.4vw,6rem); line-height: 1; letter-spacing: -.01em; font-variant-numeric: lining-nums; }
.stat__label { font-size: .82rem; color: var(--ink-60); line-height: 1.35; }
@media (max-width: 760px){ .stats { grid-template-columns: repeat(2,1fr); }
  .stat { border-bottom: 1px solid var(--rule); padding-inline: 0 1rem; }
  .stat:nth-child(2n){ border-right: 0; }
}

/* ---------- Work: featured (current) ---------- */
.feat { display: grid; grid-template-columns: minmax(0,7fr) minmax(0,5fr); gap: clamp(1.5rem,4vw,4rem); align-items: center; padding-block: clamp(2rem,4vw,3.5rem); border-bottom: 1px solid var(--rule); cursor: pointer; }
.feat:nth-child(even) .feat__media { order: 2; }
@media (max-width: 820px){ .feat { grid-template-columns: 1fr; } .feat:nth-child(even) .feat__media { order: 0; } }
.feat__meta { display:flex; flex-wrap:wrap; gap:.5rem .8rem; margin-bottom: 1rem; }
.feat h3 { font-size: clamp(1.7rem,3.4vw,2.8rem); text-transform: uppercase; margin-bottom: .9rem; }
.feat p { color: var(--ink); max-width: 46ch; }
.feat__where { margin-top: 1.1rem; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color: var(--ink-45); }

.tag { font-size:.62rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; padding:.4rem .7rem; border:1px solid var(--rule); }
.tag--live { border-color: var(--accent); color: var(--accent); }

/* ---------- Work: delivered grid (CV/folder feel) ---------- */
.proj-grid { display:grid; grid-template-columns: repeat(3,1fr); gap: clamp(1.2rem,2.5vw,2rem); margin-top: clamp(1.5rem,3vw,2.4rem); }
@media (max-width: 880px){ .proj-grid { grid-template-columns: repeat(2,1fr);} }
@media (max-width: 540px){ .proj-grid { grid-template-columns: 1fr;} }
.card { display:flex; flex-direction:column; gap:.9rem; cursor:pointer; border-top:1px solid var(--rule); padding-top: 1rem; }
.card__top { display:flex; justify-content:space-between; align-items:baseline; }
.card__no { font-size:.8rem; color: var(--accent); }
.card__body { display:flex; flex-direction:column; gap:.4rem; }
.card h3 { font-size: clamp(1.15rem,1.8vw,1.45rem); text-transform: uppercase; }
.card p { font-size:.9rem; color: var(--ink-60); }
.card__where { font-size:.72rem; letter-spacing:.06em; text-transform:uppercase; color: var(--ink-45); }

.cat-head { display:flex; align-items:baseline; gap:1rem; margin: clamp(2.2rem,4.5vw,3.5rem) 0 0; padding-top: clamp(1.6rem,3vw,2.2rem); border-top: 1px solid var(--rule); }
.cat-head .ix { color: var(--accent); font-size:1rem; font-weight:400; }
.cat-head h3 { font-size: clamp(1.3rem,2.4vw,2rem); text-transform: uppercase; }

/* ---------- Photo slot ---------- */
.shot { position: relative; aspect-ratio: 4/3; overflow: hidden; background: var(--blue-deep); border: 1px solid var(--rule); }
.shot--wide { aspect-ratio: 16/10; }
.shot img { position:absolute; inset:0; width:100%; height:100%; object-fit: cover; z-index:2; transition: transform .9s var(--ease), opacity .5s var(--ease); }
.feat:hover .shot img, .card:hover .shot img { transform: scale(1.04); }
.shot img.missing { opacity: 0; }
.shot__ph { position:absolute; inset:0; z-index:1; display:flex; flex-direction:column; justify-content:space-between; padding:1rem 1.1rem; color: rgba(236,232,223,.78); pointer-events:none; }
.shot__ph .label { color: rgba(236,232,223,.55); font-size:.6rem; }
.shot__ph .pname { font-size:1rem; line-height:1.15; max-width:16ch; font-weight:600; }

/* ---------- Slide-up project panel ---------- */
.panel { position: fixed; inset: 0; z-index: 120; background: var(--blue-deep); color: var(--bone); transform: translateY(100%); transition: transform .6s var(--ease); overflow-y: auto; padding-top: var(--head-h); }
body.panel-open .panel { transform: translateY(0); }
body.panel-open { overflow: hidden; }
.panel__bar { position: sticky; top: 0; display:flex; justify-content:space-between; align-items:center; height: var(--head-h); margin-top: calc(-1 * var(--head-h)); padding-inline: var(--gutter); background: var(--blue-deep); border-bottom: 1px solid var(--rule-soft); z-index:2; }
.panel__bar .label { color: rgba(236,232,223,.6); }
.panel__close { font-weight:600; font-size:.8rem; letter-spacing:.22em; text-transform:uppercase; display:flex; align-items:center; gap:.6rem; }
.panel__close .x { width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block; }
.panel__inner { display:grid; grid-template-columns: minmax(0,6fr) minmax(0,6fr); gap: clamp(1.5rem,4vw,4rem); align-items:start; padding: clamp(2rem,5vw,4.5rem) var(--gutter) clamp(3rem,7vw,6rem); max-width: var(--maxw); margin-inline:auto; }
@media (max-width: 820px){ .panel__inner { grid-template-columns: 1fr; } }
.panel__title { font-size: clamp(2.2rem,6vw,5rem); text-transform: uppercase; font-weight:700; letter-spacing:-.03em; line-height:.95; }
.panel__meta { display:flex; flex-wrap:wrap; gap:.5rem .8rem; margin-bottom: 1.4rem; }
.panel .tag { border-color: var(--rule-soft); color: var(--bone); }
.panel .tag--live { border-color: var(--accent); color: var(--accent); }
.panel__desc { margin-top: 1.4rem; color: rgba(236,232,223,.82); max-width: 52ch; }
.panel__where { margin-top: 1.4rem; font-size:.8rem; letter-spacing:.08em; text-transform:uppercase; color: rgba(236,232,223,.55); }
.panel .shot { border-color: var(--rule-soft); }

/* ---------- Contact ---------- */
.contact-grid { display:grid; grid-template-columns: repeat(2,1fr); gap: clamp(1.5rem,3.5vw,3rem) clamp(2rem,5vw,5rem); }
@media (max-width: 640px){ .contact-grid { grid-template-columns: 1fr; } }
.contact-item .label { display:block; margin-bottom:.6rem; }
.contact-item a, .contact-item p { font-weight: 700; font-size: clamp(1.15rem,1.9vw,1.7rem); letter-spacing:-.02em; line-height:1.2; }
.contact-item a { border-bottom:1px solid transparent; transition: border-color .3s var(--ease); }
.contact-item a:hover { border-color: currentColor; }
.is-ph { color: var(--accent) !important; }
.note { font-size:.74rem; color: var(--ink-45); margin-top:.35rem; letter-spacing:.02em; }

/* ---------- Leadership / partners ---------- */
.team { display:grid; grid-template-columns: repeat(2,1fr); gap: clamp(1.8rem,4vw,4rem); margin-top: clamp(1.8rem,4vw,3rem); border-top:1px solid var(--rule); padding-top: clamp(1.8rem,4vw,3rem); }
@media (max-width:760px){ .team { grid-template-columns:1fr; gap:2.6rem; } }
.shot--portrait { aspect-ratio: 4/5; }
.shot--portrait img { object-position: center; filter: grayscale(1) contrast(1.03); }
.partner__name { font-size: clamp(1.4rem,2.6vw,2.1rem); text-transform:uppercase; font-weight:700; letter-spacing:-.02em; margin-top:1.1rem; }
.partner__role { color: var(--accent); font-size:.74rem; font-weight:600; letter-spacing:.18em; text-transform:uppercase; margin-top:.5rem; }
.partner__bio { color: var(--ink-60); margin-top:1rem; max-width:46ch; font-size:.96rem; line-height:1.62; }
.partner__bio a { color: var(--ink); border-bottom:1px solid var(--accent); white-space:nowrap; transition: color .3s var(--ease); }
.partner__bio a:hover { color: var(--accent); }
.partner { cursor: pointer; }
.partner:hover .shot img { transform: scale(1.03); }
.panel__link { display:inline-block; margin-top:1.6rem; font-weight:600; font-size:.8rem; letter-spacing:.14em; text-transform:uppercase; color:var(--bone); border-bottom:1px solid var(--accent); padding-bottom:.35rem; transition: color .3s var(--ease); }
.panel__link:hover { color: var(--accent); }

/* ---------- Presence — grid-numbers (text left · vertical serif figures right) ---------- */
.presence { position: relative; background: var(--blue-deep); color: var(--bone); padding-block: clamp(4rem,9vw,9rem); }
.presence .label { color: rgba(236,232,223,.6); }
.gridnums { display: grid; grid-template-columns: 1.02fr .98fr; gap: clamp(2rem,6vw,6rem); align-items: start; margin-top: clamp(1.8rem,3.5vw,3rem); }
.gridnums__intro { position: sticky; top: clamp(5.5rem,14vh,9.5rem); }   /* pins while the figures scroll past — the parallax */
.presence__statement { font-size: clamp(1.7rem,3.2vw,2.9rem); font-weight:700; letter-spacing:-.025em; line-height:1.12; max-width:17ch; }
.ghost-link { display:inline-flex; align-items:center; gap:.6rem; margin-top: clamp(1.6rem,3vw,2.4rem); font-size:.72rem; font-weight:600; letter-spacing:.2em; text-transform:uppercase; color: var(--bone); border-bottom:1px solid var(--rule-bone); padding-bottom:.55rem; transition: color .3s var(--ease), border-color .3s var(--ease); }
.ghost-link span { transition: transform .35s var(--ease); }
.ghost-link:hover { color: var(--accent); border-color: var(--accent); }
.ghost-link:hover span { transform: translateX(.45rem); }
.gridnums__figures { border:1px solid var(--rule-bone); border-bottom:0; }
.numcell { display:flex; flex-direction:column; justify-content:space-between; gap: clamp(1.2rem,2.6vw,2.4rem); min-height: clamp(148px,16vw,206px); padding: clamp(1.3rem,2.2vw,1.9rem) clamp(1.2rem,2vw,1.8rem); border-bottom:1px solid var(--rule-bone); }
.numcell__n { font-family: var(--ff-serif); font-size: clamp(2.8rem,5vw,4.6rem); line-height:1; color: var(--accent); font-variant-numeric: lining-nums; letter-spacing:-.01em; }
.numcell__l { font-size: clamp(.85rem,.9vw,1rem); font-weight:700; color: rgba(236,232,223,.84); line-height:1.32; }
@media (max-width: 860px){
  .gridnums { grid-template-columns: 1fr; gap: clamp(1.8rem,5vw,2.6rem); }
  .gridnums__intro { position: static; }
  .presence__statement { max-width: 22ch; }
}
/* scroll-lock: the section pins and the figures run through (desktop, JS-gated) */
.lock-on .presence[data-lock] { height: 188vh; padding-block: 0; }
.lock-on .presence__stage { position: sticky; top: 0; height: 100vh; display: flex; align-items: center; }
.lock-on .presence .gridnums { align-items: center; margin-top: 0; }
.lock-on .gridnums__intro { position: static; }
.lock-on .gridnums__viewport { position: relative; height: 66vh; overflow: hidden;
   -webkit-mask: linear-gradient(180deg, transparent 0, #000 17%, #000 83%, transparent 100%);
           mask: linear-gradient(180deg, transparent 0, #000 17%, #000 83%, transparent 100%); }
.lock-on .numstack { position: absolute; left: 0; right: 0; top: 0; border: 0; will-change: transform; }
.lock-on .numstack .numcell { height: 33vh; min-height: 0; border: 0; border-top: 1px solid var(--rule-bone); transition: opacity .35s var(--ease); }
.lock-on .numstack .numcell:first-child { border-top: 0; }
.lock-on .numstack .numcell__n { transition: transform .4s var(--ease); transform-origin: left center; }
.lock-on .numstack .numcell.is-active .numcell__n { transform: scale(1.07); }

/* ---------- Locations: clean flywheel arc, then India reveal ---------- */
.fly-track { position: relative; height: 320vh; display: none; }
.fly-on .fly-track { display: block; }
.fly-stage { position: sticky; top: 0; height: 100vh; overflow: hidden; }
/* soft light behind the arc for a touch of air */
.fly-stage::before { content:""; position:absolute; left:50%; top:36%; width:130vh; height:130vh; transform:translate(-50%,-50%); background: radial-gradient(circle, rgba(236,232,223,.12) 0%, rgba(236,232,223,0) 62%); pointer-events:none; }
.fly-card { position: absolute; width: clamp(112px,11vw,164px); aspect-ratio: 1/1; will-change: transform, opacity; z-index:8; }
.fly-card .shot { width:100%; height:100%; background: var(--blue-deep); box-shadow: 0 18px 38px rgba(10,16,24,.34); }
.fly-card__name { position:absolute; inset:0; z-index:1; display:flex; align-items:center; justify-content:center; text-align:center; padding:.6rem; font-size:.6rem; font-weight:700; letter-spacing:.12em; text-transform:uppercase; color:var(--ink); background:var(--bone); }
.fly-card__name::after { content:""; position:absolute; inset:7px; border:1px dashed rgba(26,28,30,.35); }
/* per-card name, fades in only when the card reaches the active (top) spot */
.fly-card__cap { position:absolute; left:50%; top:calc(100% + .8rem); transform:translateX(-50%); white-space:nowrap; font-weight:700; text-transform:uppercase; font-size:clamp(1.3rem,2.8vw,2.3rem); letter-spacing:-.025em; color:var(--bone); opacity:0; pointer-events:none; }
/* active location name only (text, no card zoom) */
.fly-center { position:absolute; left:50%; top:62%; transform:translate(-50%,-50%); width:min(72vw,580px); text-align:center; z-index:10; pointer-events:none; }
.fly-center .idx { display:block; font-size:.74rem; color:var(--accent); letter-spacing:.24em; margin-bottom:.55rem; }
.fly-center .name { font-size:clamp(2rem,5vw,4rem); font-weight:700; text-transform:uppercase; letter-spacing:-.03em; line-height:1; }
.fly-center .name.go { animation: flyEmerge .55s var(--ease); }
@keyframes flyEmerge { from { opacity:0; transform:translateY(16px); } to { opacity:1; transform:none; } }
.fly-hint { position:absolute; left:50%; bottom:6%; transform:translateX(-50%); z-index:10; color:var(--ink-60); }

/* fallback grid (mobile / reduced-motion / no-JS) */
.loc-grid { display:grid; grid-template-columns: repeat(4,1fr); gap:1px; background:var(--rule); border:1px solid var(--rule); margin-top:clamp(1.8rem,4vw,3rem); }
.fly-on .loc-grid { display:none; }
.loc-grid li { background:var(--blue); padding:clamp(1.1rem,2.6vw,1.8rem); min-height:7.5rem; display:flex; flex-direction:column; justify-content:space-between; gap:1rem; }
.loc-grid .n { font-size:.78rem; color:var(--accent); }
.loc-grid .city { font-size:clamp(1.05rem,1.9vw,1.4rem); font-weight:700; text-transform:uppercase; letter-spacing:-.02em; line-height:1.05; }
@media(max-width:760px){ .loc-grid{ grid-template-columns:repeat(2,1fr); } }

/* map */
.locmap { position: relative; width: fit-content; max-width: 100%; margin: clamp(2.5rem,6vw,5rem) auto 0; transition: opacity 1.1s var(--ease), transform 1.1s var(--ease); }
.js .locmap { opacity:0; transform: scale(.985); }
.js .locmap.in { opacity:1; transform:none; }
.locmap svg { width:100%; height:auto; display:block; }
.locmap .india { fill: rgba(236,232,223,.05); stroke: rgba(236,232,223,.28); stroke-width:1.3; }
.locmap .pin { fill: var(--accent); }
.locmap .pin-ring { fill:none; stroke:var(--accent); stroke-width:1.4; opacity:.5; }
.locmap .lead { stroke: rgba(236,232,223,.35); stroke-width:1; stroke-dasharray:3 4; }
.locmap .inset-bg { fill: rgba(20,28,36,.45); stroke: rgba(236,232,223,.22); stroke-width:1.3; }
.locmap .lbl { fill: rgba(236,232,223,.9); font-size:13px; font-weight:600; }
.locmap .lbl-sm { fill: rgba(236,232,223,.82); font-size:11px; }
.locmap .cap { fill: rgba(236,232,223,.5); font-size:10px; letter-spacing:.2em; }
/* pulsating location dots */
.locmap .ping { fill:none; stroke:var(--accent); stroke-width:1.4; transform-box: fill-box; transform-origin: center; animation: locPulse 2.4s ease-out infinite; }
.locmap .ping.d1 { animation-delay:.5s; } .locmap .ping.d2 { animation-delay:1s; } .locmap .ping.d3 { animation-delay:1.5s; }
@keyframes locPulse { 0%{ transform:scale(.5); opacity:.8; } 70%{ opacity:0; } 100%{ transform:scale(2.8); opacity:0; } }
@media (prefers-reduced-motion: reduce){ .locmap .ping{ animation:none; opacity:.45; } }
@media (prefers-reduced-motion: reduce){ .js .locmap{opacity:1!important;transform:none!important;} }
/* relief map image + pulsating location dots */
.locmap__img { display:block; max-width:100%; max-height:78vh; width:auto; height:auto; border-radius:2px; }
.geo { position:absolute; z-index:3; }
.geo-dot, .geo-ping { position:absolute; left:0; top:0; width:12px; height:12px; margin:-6px 0 0 -6px; border-radius:50%; }
.geo-dot { background:var(--accent); box-shadow:0 0 0 2px rgba(255,255,255,.85), 0 1px 5px rgba(0,0,0,.5); }
.geo-ping { border:2px solid var(--accent); transform-origin:center; animation: geoPulse 2.4s ease-out infinite; }
.geo--left .geo-ping { animation-delay:1.2s; }
@keyframes geoPulse { 0%{ transform:scale(.5); opacity:.85; } 70%{ opacity:0; } 100%{ transform:scale(3.4); opacity:0; } }
.geo::after { content:""; position:absolute; left:-22px; top:-22px; width:44px; height:44px; border-radius:50%; }  /* enlarged hover target */
.geo-tip { position:absolute; left:18px; top:50%; transform:translateY(-50%) translateX(-6px); width:max-content; max-width:230px; padding:.7rem .9rem; border-radius:9px; background:rgba(10,15,22,.72); border:1px solid rgba(236,232,223,.14); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); opacity:0; pointer-events:none; transition:opacity .35s var(--ease), transform .35s var(--ease); z-index:6; }
.geo:hover .geo-tip { opacity:1; transform:translateY(-50%) translateX(0); }
.geo-tip__title { display:block; font-weight:700; font-size:.92rem; letter-spacing:-.01em; color:var(--bone); }
.geo-tip__txt { display:block; margin-top:.4rem; font-size:.7rem; line-height:1.55; color:rgba(236,232,223,.78); white-space:normal; }
.geo--left .geo-tip { left:auto; right:18px; text-align:right; transform:translateY(-50%) translateX(6px); }
.geo--left:hover .geo-tip { transform:translateY(-50%) translateX(0); }
@media (hover: none){ .geo-tip{ opacity:1; max-width:none; padding:.4em .7em; } .geo-tip__txt{ display:none; } }
@media (prefers-reduced-motion: reduce){ .geo-ping{ animation:none; opacity:.5; } }

/* ---------- Buttons ---------- */
.btn { display:inline-flex; align-items:center; gap:.7rem; font-weight:600; font-size:.78rem; letter-spacing:.16em; text-transform:uppercase; padding:1.05rem 1.7rem; border:1px solid var(--ink); border-radius:999px; transition: background .4s var(--ease), color .4s var(--ease); }
.btn:hover { background: var(--ink); color: var(--bone); }
.btn .arrow { transition: transform .4s var(--ease); }
.btn:hover .arrow { transform: translate(.25rem,.25rem); }

/* ---------- Footer ---------- */
.site-footer { background: var(--blue-deep); color: var(--bone); padding-top: clamp(3rem,6vw,5rem); overflow: hidden; }
.site-footer .label { color: rgba(236,232,223,.6); }
.footer-top { display:grid; grid-template-columns: minmax(0,1fr) auto; gap:2rem; align-items:start; padding-bottom: clamp(2.5rem,5vw,4rem); border-bottom: 1px solid var(--rule-soft); }
.footer-top .lead { color: var(--bone); }
.footer-links { display:flex; gap: clamp(1.4rem,3vw,2.6rem); flex-wrap:wrap; }
.footer-links a { font-size:.8rem; letter-spacing:.04em; opacity:.82; transition: opacity .3s var(--ease); }
.footer-links a:hover { opacity:1; }
.footer-wordmark { font-weight:700; text-transform:uppercase; font-size: clamp(3.6rem,20vw,20rem); line-height:.78; letter-spacing:-.04em; color: var(--bone); white-space:nowrap; padding-top: clamp(1.5rem,3vw,2.5rem); }
.footer-bottom { display:flex; flex-wrap:wrap; gap:.5rem 2rem; justify-content:space-between; align-items:center; padding-block: clamp(1.2rem,2.5vw,2rem); border-top:1px solid var(--rule-soft); font-size:.72rem; letter-spacing:.04em; color: rgba(236,232,223,.7); }

/* ---------- Custom cursor ---------- */
.cursor { position: fixed; left: 0; top: 0; width: 12px; height: 12px; margin: -6px 0 0 -6px; border-radius: 50%; background: var(--accent); pointer-events: none; z-index: 200; display:flex; align-items:center; justify-content:center; transition: width .3s var(--ease), height .3s var(--ease), margin .3s var(--ease), background .3s var(--ease), opacity .3s var(--ease); opacity: 0; }
.cursor__label { font-size:.66rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; color: var(--bone); opacity:0; transition: opacity .25s var(--ease); }
html.has-cursor, html.has-cursor * { cursor: none !important; }
html.has-cursor .cursor { opacity: 1; }
body.cursor-lg .cursor { width: 92px; height: 92px; margin: -46px 0 0 -46px; }
body.cursor-lg .cursor__label { opacity: 1; }
body.menu-open .cursor { background: var(--ink); }
body.menu-open .cursor__label { color: var(--bone); }

/* ---------- Reveal (fail-safe: gated on .js) ---------- */
.reveal { transition: opacity 1s var(--ease), transform 1s var(--ease); }
.js .reveal { opacity: 0; transform: translateY(24px); }
.js .reveal.in { opacity: 1; transform: none; }
.reveal[data-delay="1"]{ transition-delay:.08s; }
.reveal[data-delay="2"]{ transition-delay:.16s; }
.reveal[data-delay="3"]{ transition-delay:.24s; }
@media (prefers-reduced-motion: reduce){ .reveal{opacity:1!important;transform:none!important;} html{scroll-behavior:auto;} }

/* ---------- Char-fill-on-scroll headings (Tres Mares style) ---------- */
.fx-w { display:inline-block; }
.fx-ch { opacity:.18; transition: opacity .12s linear; }
@media (prefers-reduced-motion: reduce){ .fx-ch{ opacity:1; } }

/* ---------- Word-by-word body reveal (Tres Mares style) ---------- */
.fx-split .fx-rw { display:inline-block; opacity:0; transform: translateY(.5em); transition: opacity .55s var(--ease), transform .65s var(--ease); will-change: opacity, transform; }
.fx-split.in .fx-rw { opacity:1; transform:none; transition-delay: calc(var(--i,0) * .024s); }
@media (prefers-reduced-motion: reduce){ .fx-split .fx-rw{ opacity:1; transform:none; transition:none; } }