:root{
  --void:#060607;
  --panel:#0e0f11;
  --panel-2:#141517;
  --chrome-hi:#f6f7f8;
  --chrome-mid:#9aa0a6;
  --chrome-lo:#33363b;
  --ink:#eceded;
  --ink-dim:#84878c;
  --ink-dimmer:#54565a;
  --line: rgba(255,255,255,.09);
  --ease-luxe: cubic-bezier(.16,1,.3,1);
  --ease-soft: cubic-bezier(.22,1,.36,1);
}
*{margin:0;padding:0;box-sizing:border-box;}
html{background:var(--void);}
body{
  background:var(--void);
  color:var(--ink);
  font-family:'Inter',sans-serif;
  overflow-x:hidden;
  cursor:none;
  -webkit-font-smoothing:antialiased;
}
@media (max-width: 860px){
  body{cursor:auto;}
}
h1,h2,h3,.display{
  font-family:'Sora',sans-serif;
  letter-spacing:-0.02em;
  font-weight:700;
  line-height:1.02;
}
.mono{
  font-family:'JetBrains Mono',monospace;
  letter-spacing:.14em;
  text-transform:uppercase;
  font-weight:500;
  font-size:11px;
}
a{color:inherit;text-decoration:none;}
img{display:block;max-width:100%;}
::selection{background:var(--chrome-mid);color:#0a0a0a;}
.reveal{opacity:1;transform:none;filter:none;}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
  .cursor,.cursor-dot,#hero-canvas{display:none!important;}
  .hero-scroll,.hero-eyebrow,.hero-tagline{opacity:1!important;}
  .reveal{opacity:1!important;transform:none!important;filter:none!important;}
  .vision-reveal,
  .vision-line,
  .vision-thought.is-first,
  .vision-future-title span,
  .future-logo,
  .mission-node{opacity:1!important;transform:none!important;filter:none!important;}
  .mission-line{stroke-dashoffset:0!important;}
}

/* ---------- custom cursor ---------- */
.cursor{
  position:fixed;top:0;left:0;
  width:22px;height:22px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.55);
  pointer-events:none;
  z-index:9999;
  mix-blend-mode:difference;
  transform:translate(-50%,-50%);
  transition:width .45s var(--ease-luxe), height .45s var(--ease-luxe), border-color .3s;
  will-change:transform;
}
.cursor-dot{
  position:fixed;top:0;left:0;
  width:4px;height:4px;border-radius:50%;
  background:#fff;pointer-events:none;z-index:9999;
  transform:translate(-50%,-50%);
  will-change:transform;
}
.cursor.is-hover{ width:64px; height:64px; border-color:rgba(255,255,255,.9); background:rgba(255,255,255,.04); backdrop-filter: blur(2px);}
.cursor.is-text{ width:8px; height:8px; background:rgba(255,255,255,.5); }
@media (max-width: 860px){ .cursor, .cursor-dot{ display:none; } }

/* ---------- noise overlay ---------- */
.noise{
  position:fixed;inset:0;pointer-events:none;z-index:60;
  opacity:.035;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ---------- vignette / ambient glow ---------- */
.ambient{
  position:fixed;inset:0;z-index:1;pointer-events:none;
  background:
    radial-gradient(ellipse 60% 45% at 50% 0%, rgba(140,150,160,.10), transparent 60%),
    radial-gradient(ellipse 80% 60% at 50% 100%, rgba(60,65,72,.16), transparent 65%);
}

/* ---------- preloader ---------- */
#preloader{
  position:fixed;inset:0;background:var(--void);
  z-index:10000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:22px;
  transition:opacity 1.1s var(--ease-luxe), visibility 1.1s;
}
#preloader.done{opacity:0;visibility:hidden;}
.pre-ring{
  width:46px;height:46px;border-radius:50%;
  border:1.4px solid rgba(255,255,255,.14);
  border-top-color:rgba(240,242,244,.9);
  animation:spin 1.1s linear infinite;
}
@keyframes spin{to{transform:rotate(360deg);}}
.pre-label{ color:var(--ink-dimmer); }

/* ---------- layout shell ---------- */
main{position:relative;z-index:2;}
section{position:relative;}
.wrap{
  max-width:1400px;margin:0 auto;padding:0 48px;
}
@media (max-width:860px){ .wrap{padding:0 22px;} }

/* ---------- nav ---------- */
header.nav{
  position:fixed;top:0;left:0;right:0;z-index:500;
  padding:22px 0;
}
.nav-inner{
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 22px;
  border-radius:999px;
  background:rgba(15,16,18,.42);
  border:1px solid rgba(255,255,255,.08);
  backdrop-filter: blur(18px) saturate(140%);
  -webkit-backdrop-filter: blur(18px) saturate(140%);
  box-shadow:
    0 1px 0 rgba(255,255,255,.06) inset,
    0 18px 40px -20px rgba(0,0,0,.6);
  transition: background .4s var(--ease-soft), border-color .4s;
}
.brand{
  display:flex;align-items:center;gap:10px;
  font-family:'Sora',sans-serif;font-weight:700;font-size:16px;letter-spacing:.01em;
}
.brand svg{ width:22px; height:22px; }
.nav-toggle{
  display:none;
  width:42px;
  height:42px;
  padding:0;
  border:1px solid rgba(255,255,255,.14);
  border-radius:50%;
  background:rgba(255,255,255,.045);
  color:var(--ink);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  gap:4px;
  cursor:pointer;
  -webkit-tap-highlight-color:transparent;
}
.nav-toggle span{
  display:block;
  width:17px;
  height:1.5px;
  border-radius:2px;
  background:currentColor;
  transform-origin:center;
  transition:transform .3s var(--ease-luxe), opacity .2s ease;
}
.nav-toggle:focus-visible{
  outline:2px solid rgba(255,255,255,.8);
  outline-offset:3px;
}
.nav-links{
  display:flex;gap:34px;align-items:center;
}
.nav-links a{
  font-size:13px;color:var(--ink-dim);
  position:relative;transition:color .3s;
}
.nav-links a::after{
  content:'';position:absolute;left:0;bottom:-6px;width:0;height:1px;background:var(--chrome-hi);
  transition:width .4s var(--ease-luxe);
}
.nav-links a:hover{color:var(--ink);}
.nav-links a:hover::after{width:100%;}
.nav-cta{
  font-size:12.5px;padding:9px 18px;border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.04);
  transition:all .4s var(--ease-luxe);
}
.nav-cta:hover{ background:rgba(255,255,255,.12); border-color:rgba(255,255,255,.4); }
@media (max-width:860px){
  .nav-inner.has-mobile-menu{
    display:grid;
    grid-template-columns:minmax(0,1fr) auto;
    align-items:center;
    border-radius:24px;
  }
  .nav-toggle{
    display:inline-flex;
    grid-column:2;
  }
  .has-mobile-menu .nav-links{
    grid-column:1 / -1;
    display:flex;
    flex-direction:column;
    align-items:stretch;
    width:100%;
    max-height:0;
    gap:0;
    padding:0 4px;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:max-height .4s var(--ease-luxe), opacity .25s ease, padding .4s var(--ease-luxe), visibility 0s linear .4s;
  }
  .has-mobile-menu .nav-links a{
    padding:11px 2px;
    font-size:13px;
    border-bottom:1px solid rgba(255,255,255,.07);
  }
  .has-mobile-menu .nav-links a::after{ display:none; }
  .nav-inner.has-mobile-menu > .nav-cta{
    display:flex;
    align-items:center;
    justify-content:center;
    grid-column:1 / -1;
    width:100%;
    max-height:0;
    min-height:0;
    padding-top:0;
    padding-bottom:0;
    overflow:hidden;
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    border-color:transparent;
    transition:max-height .35s var(--ease-luxe), min-height .35s var(--ease-luxe), opacity .25s ease, margin .35s var(--ease-luxe), visibility 0s linear .35s;
  }
  .nav-inner.has-mobile-menu.is-menu-open .nav-links{
    max-height:390px;
    padding-top:12px;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    transition:max-height .4s var(--ease-luxe), opacity .25s ease, padding .4s var(--ease-luxe), visibility 0s;
  }
  .nav-inner.has-mobile-menu.is-menu-open > .nav-cta{
    max-height:44px;
    min-height:42px;
    margin-top:12px;
    padding:0 18px;
    opacity:1;
    visibility:visible;
    pointer-events:auto;
    border-color:rgba(255,255,255,.18);
    transition:max-height .35s var(--ease-luxe), min-height .35s var(--ease-luxe), opacity .25s ease .08s, margin .35s var(--ease-luxe), visibility 0s;
  }
  .nav-inner.has-mobile-menu.is-menu-open .nav-toggle span:nth-child(1){ transform:translateY(5.5px) rotate(45deg); }
  .nav-inner.has-mobile-menu.is-menu-open .nav-toggle span:nth-child(2){ opacity:0; }
  .nav-inner.has-mobile-menu.is-menu-open .nav-toggle span:nth-child(3){ transform:translateY(-5.5px) rotate(-45deg); }
}

/* ---------- hero ---------- */
.hero{
  height:100vh; min-height:680px;
  display:flex; align-items:center; justify-content:center;
  position:relative; overflow:hidden;
}
#hero-canvas{
  position:absolute; inset:0; z-index:1;
  display:block;
  width:100%;
  height:100%;
}
.hero-glow{
  position:absolute; inset:0; z-index:2; pointer-events:none;
  background: radial-gradient(circle at 50% 52%, rgba(180,186,192,.10), transparent 42%);
}
.hero-content{
  position:relative; z-index:3; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:26px;
  padding-top:40px;
}
.hero-eyebrow{ color:var(--ink-dimmer); opacity:0; }
.hero-mark{
  font-size:clamp(64px, 13vw, 168px);
  color:var(--ink);
  display:flex; align-items:baseline; gap:2px;
  filter:drop-shadow(0 0 60px rgba(160,170,180,.12));
}
.hero-mark .dot{ color:var(--chrome-mid); }
.hero-tagline{
  max-width:560px; font-size:clamp(16px,2vw,20px);
  color:var(--ink-dim); font-weight:400; line-height:1.5;
  opacity:0;
}
.hero-scroll{
  position:absolute; bottom:38px; left:50%; transform:translateX(-50%);
  z-index:3; display:flex; flex-direction:column; align-items:center; gap:10px;
  color:var(--ink-dimmer); opacity:0;
}
.scroll-line{ width:1px; height:34px; background:linear-gradient(to bottom, rgba(255,255,255,.5), transparent); overflow:hidden; position:relative;}
.scroll-line span{ position:absolute; top:-100%; left:0; width:100%; height:100%; background:#fff; animation:scrolldrop 2.2s ease-in-out infinite; }
@keyframes scrolldrop{ 0%{top:-100%;} 60%{top:100%;} 100%{top:100%;} }

/* ---------- statement ---------- */
.statement{
  padding: 220px 0 200px;
}
.statement-text{
  font-size:clamp(30px, 5.6vw, 74px);
  max-width:1180px; margin:0 auto;
  color:var(--ink-dim);
  text-align:left;
  line-height:1.18;
}
.statement-text .hl{ color:var(--ink); }

/* ---------- glass panel base ---------- */
.glass{
  position:relative;
  background: linear-gradient(155deg, rgba(255,255,255,.07), rgba(255,255,255,.015) 40%, rgba(255,255,255,.03));
  border:1px solid rgba(255,255,255,.09);
  border-radius:22px;
  backdrop-filter: blur(22px) saturate(150%);
  -webkit-backdrop-filter: blur(22px) saturate(150%);
  overflow:hidden;
  isolation:isolate;
}
.glass::before{
  content:'';
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(320px 320px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.14), transparent 60%);
  opacity:0; transition:opacity .5s var(--ease-soft);
}
.glass:hover::before{ opacity:1; }
.glass::after{
  content:'';
  position:absolute; inset:0; z-index:1; pointer-events:none;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 12px rgba(0,0,0,.35);
  border-radius:inherit;
}

/* ---------- about ---------- */
.about{ padding:40px 0 200px; }
.about-grid{
  display:grid; grid-template-columns:1.3fr 1fr; gap:70px;
  align-items:start;
}
.about-text{
  font-size:clamp(20px,2.6vw,28px);
  color:var(--ink-dim); line-height:1.5; max-width:620px;
}
.about-text .hl{ color:var(--ink); }
.about-facts{
  display:grid; grid-template-columns:1fr 1fr; gap:1px;
  border:1px solid rgba(255,255,255,.09); border-radius:20px; overflow:hidden;
  background:rgba(255,255,255,.06);
}
.fact{
  background:linear-gradient(160deg, rgba(20,21,23,.9), rgba(10,11,12,.94));
  padding:28px 24px;
}
.fact .mono{ color:var(--ink-dimmer); display:block; margin-bottom:10px; }
.fact strong{ font-family:'Sora',sans-serif; font-size:20px; color:var(--ink); font-weight:600; }
@media (max-width:900px){ .about-grid{ grid-template-columns:1fr; gap:40px; } }

/* ---------- services ---------- */
.services{ padding:80px 0 200px; }
.section-head{
  display:flex; justify-content:space-between; align-items:flex-end; gap:30px;
  margin-bottom:64px; flex-wrap:wrap;
}
.section-head h2{ font-size:clamp(34px,5vw,58px); }
.section-eyebrow{ color:var(--ink-dimmer); margin-bottom:16px; display:block; }
.section-desc{ max-width:360px; color:var(--ink-dim); font-size:15px; line-height:1.6; }

.services-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  border:1px solid rgba(255,255,255,.09); border-radius:24px; overflow:hidden;
  background: rgba(255,255,255,.06);
}
.service-card{
  background: linear-gradient(160deg, rgba(20,21,23,.9), rgba(10,11,12,.94));
  padding:44px 36px; min-height:280px;
  display:flex; flex-direction:column; justify-content:space-between;
  position:relative; overflow:hidden;
  transition: background .5s var(--ease-soft);
}
.service-card::before{
  content:'';position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(260px 260px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.10), transparent 65%);
  opacity:0; transition:opacity .5s var(--ease-soft);
}
.service-card:hover::before{ opacity:1; }
.service-card:hover{ background: linear-gradient(160deg, rgba(26,27,29,.95), rgba(12,13,14,.96)); }
.service-card-contact{ cursor:pointer; }
.service-card-contact:focus-visible{
  outline:2px solid rgba(255,255,255,.8);
  outline-offset:-5px;
}
.service-num{ color:var(--ink-dimmer); font-size:12px; }
.service-icon{ width:38px; height:38px; margin-bottom:auto; opacity:.85; transition:transform .6s var(--ease-luxe); }
.service-card:hover .service-icon{ transform:translateY(-4px) rotate(6deg); }
.service-card h3{ font-size:24px; margin-top:22px; margin-bottom:10px; color:var(--ink); }
.service-list{ color:var(--ink-dimmer); font-size:12.5px; line-height:1.7; }
@media (max-width:900px){ .services-grid{ grid-template-columns:1fr; } }

/* ---------- work ---------- */
.work{ padding:60px 0 200px; }
.project{
  position:relative; height:78vh; min-height:460px;
  border-radius:26px; overflow:hidden; margin-bottom:26px;
  border:1px solid rgba(255,255,255,.08);
  cursor:pointer;
}
.project-media{
  position:absolute; inset:0;
  transition: transform 1.1s var(--ease-luxe), filter 1.1s var(--ease-luxe);
  filter:saturate(.9) brightness(.85);
}
.project:hover .project-media{ transform:scale(1.045); filter:saturate(1.05) brightness(1); }
.project-overlay{
  position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(6,6,7,0) 40%, rgba(6,6,7,.86) 100%);
}
.project-info{
  position:absolute; left:0; right:0; bottom:0; padding:44px;
  display:flex; justify-content:space-between; align-items:flex-end; gap:20px;
  transform:translateY(6px); opacity:.92;
  transition: transform .6s var(--ease-luxe);
}
.project:hover .project-info{ transform:translateY(-4px); }
.project-title{ font-size:clamp(24px,3.6vw,40px); }
.project-tags{ display:flex; gap:8px; flex-wrap:wrap; justify-content:flex-end; max-width:340px; }
.tag{
  font-size:10.5px; padding:6px 12px; border-radius:999px;
  border:1px solid rgba(255,255,255,.22); color:var(--ink-dim);
  background:rgba(255,255,255,.04);
}
.project-glow{
  position:absolute; inset:0; z-index:0; pointer-events:none;
  background: radial-gradient(500px 500px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.10), transparent 60%);
  opacity:0; transition:opacity .6s;
}
.project:hover .project-glow{ opacity:1; }

/* generated chrome-esque textures for project placeholders */
.tex-a{ background:
  radial-gradient(circle at 30% 30%, #babfc4, transparent 45%),
  radial-gradient(circle at 75% 70%, #2c2f33, transparent 55%),
  linear-gradient(135deg, #1a1b1d, #3a3d42 40%, #0c0d0e 80%); }
.tex-b{ background:
  radial-gradient(circle at 70% 25%, #d8dadd, transparent 40%),
  radial-gradient(circle at 20% 80%, #23262a, transparent 55%),
  linear-gradient(120deg, #101113, #45484d 50%, #0a0a0b 100%); }
.tex-c{ background:
  radial-gradient(circle at 50% 15%, #c7cbcf, transparent 42%),
  radial-gradient(circle at 20% 60%, #34373b, transparent 60%),
  linear-gradient(160deg, #0d0e0f, #4a4d52 45%, #111214 100%); }
.tex-d{ background:
  radial-gradient(circle at 80% 80%, #e2e4e6, transparent 38%),
  radial-gradient(circle at 25% 30%, #26292d, transparent 55%),
  linear-gradient(145deg, #0b0c0d, #55585d 55%, #0f1011 100%); }

/* ---------- approach / marquee ---------- */
.marquee-wrap{
  padding:60px 0 180px; overflow:hidden; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
}
.marquee{
  display:flex; gap:60px; white-space:nowrap; width:max-content;
  animation: marquee 34s linear infinite;
}
.marquee span{
  font-family:'Sora',sans-serif; font-weight:600; font-size:clamp(28px,4vw,46px);
  color:var(--ink-dimmer); display:flex; align-items:center; gap:60px;
}
.marquee span b{ color:var(--ink); font-weight:600; }
.marquee .dotsep{ width:9px;height:9px;border-radius:50%;background:var(--chrome-mid); display:inline-block; }
@keyframes marquee{ from{ transform:translateX(0);} to{ transform:translateX(-50%);} }

/* ---------- CTA / footer ---------- */
.cta{ padding:60px 0 140px; }
.cta-panel{
  padding:clamp(50px,8vw,110px) clamp(30px,6vw,90px);
  border-radius:32px; text-align:center;
  display:flex; flex-direction:column; align-items:center; gap:34px;
}
.cta-panel h2{ font-size:clamp(36px,6vw,84px); max-width:900px; }
.cta-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:12px;
  min-width:170px; min-height:60px;
  padding:18px 34px; border-radius:999px;
  border:0;
  background:var(--ink); color:#0a0a0a;
  font-size:14px; font-weight:600; font-family:'Sora',sans-serif;
  line-height:1;
  cursor:none;
  transition: transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe);
  box-shadow:0 20px 50px -20px rgba(255,255,255,.25);
}
.cta-btn i{
  width:24px; height:24px;
  display:inline-flex; align-items:center; justify-content:center;
  flex:0 0 24px;
  font-size:24px;
  line-height:1;
}
.cta-btn .btn-text{ line-height:1; }
.cta-btn:hover{ transform:translateY(-3px) scale(1.03); box-shadow:0 28px 60px -18px rgba(255,255,255,.4); }

.contact-modal{
  position:fixed;
  inset:0;
  z-index:9000;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:100dvh;
  padding:clamp(14px, 3vh, 24px);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .42s var(--ease-soft), visibility .42s;
}
.contact-modal.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.contact-modal__backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,5,6,.76);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
.contact-modal__panel{
  position:relative;
  width:min(540px, 100%);
  max-height:calc(100dvh - clamp(28px, 6vh, 48px));
  padding:clamp(24px, 3.4vw, 38px);
  border-radius:24px;
  overflow:hidden;
  box-shadow:0 44px 120px -50px rgba(0,0,0,.92);
  transform:translateY(18px) scale(.985);
  transition:transform .5s var(--ease-luxe);
}
.contact-modal.is-open .contact-modal__panel{
  transform:translateY(clamp(22px, 5vh, 58px)) scale(1);
}
.contact-modal__close{
  position:absolute;
  top:14px;
  left:auto;
  right:14px;
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:none;
  z-index:3;
  transition:background .3s var(--ease-soft), border-color .3s var(--ease-soft), transform .3s var(--ease-soft);
}
.contact-modal__close:hover{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.28);
  transform:scale(1.04);
}
.contact-modal__close i{
  font-size:22px;
}
.contact-modal__eyebrow{
  display:block;
  color:var(--ink-dimmer);
  margin-bottom:10px;
  padding-right:46px;
}
.contact-modal h2{
  max-width:430px;
  padding-right:46px;
  font-size:clamp(27px, 4.4vw, 42px);
  line-height:.98;
  margin-bottom:18px;
}
.contact-form{
  display:grid;
  gap:11px;
  position:relative;
  z-index:2;
}
.contact-form label{
  display:grid;
  gap:6px;
}
.contact-form label span{
  color:var(--ink-dim);
  font-size:12px;
  font-weight:600;
  letter-spacing:.02em;
}
.contact-form input,
.contact-form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  font:500 14px/1.35 'Inter',sans-serif;
  padding:12px 14px;
  outline:none;
  transition:border-color .25s var(--ease-soft), background .25s var(--ease-soft), box-shadow .25s var(--ease-soft);
}
.contact-form textarea{
  resize:none;
  height:82px;
  min-height:82px;
}
.contact-form input:focus,
.contact-form textarea:focus{
  border-color:rgba(255,255,255,.46);
  background:rgba(255,255,255,.08);
  box-shadow:0 0 0 4px rgba(255,255,255,.055);
}
.contact-form input::placeholder,
.contact-form textarea::placeholder{
  color:rgba(236,237,237,.34);
}
.contact-form__trap{
  display:none;
}
.contact-form__submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:50px;
  margin-top:4px;
  border:0;
  border-radius:999px;
  background:var(--ink);
  color:#0a0a0a;
  font:700 14px/1 'Sora',sans-serif;
  cursor:none;
  box-shadow:0 22px 54px -22px rgba(255,255,255,.35);
  transition:transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe);
}
.contact-form__submit:hover{
  transform:translateY(-2px) scale(1.015);
  box-shadow:0 30px 64px -24px rgba(255,255,255,.46);
}
body.modal-open{
  overflow:hidden;
}

/* ---------- public chat widget ---------- */
.site-chat{
  position:fixed;
  right:28px;
  bottom:28px;
  z-index:7200;
  pointer-events:none;
}
.site-chat__launcher{
  min-width:118px;
  min-height:56px;
  padding:0 20px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:999px;
  background:rgba(15,16,18,.64);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  font:700 13px/1 'Sora',sans-serif;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.12),
    0 24px 70px -28px rgba(0,0,0,.95);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  cursor:none;
  pointer-events:auto;
  transition:transform .35s var(--ease-luxe), background .35s var(--ease-soft), border-color .35s var(--ease-soft);
}
.site-chat__launcher:hover{
  transform:translateY(-3px);
  background:rgba(255,255,255,.10);
  border-color:rgba(255,255,255,.34);
}
.site-chat__launcher i{
  font-size:22px;
}
.site-chat__panel{
  position:absolute;
  right:0;
  bottom:72px;
  width:min(410px, calc(100vw - 36px));
  max-height:min(720px, calc(100vh - 128px));
  display:grid;
  grid-template-rows:auto minmax(120px, 1fr) auto;
  gap:16px;
  padding:22px;
  border-radius:26px;
  box-shadow:0 34px 100px -44px rgba(0,0,0,.98);
  opacity:0;
  visibility:hidden;
  transform:translateY(18px) scale(.98);
  pointer-events:none;
  transition:opacity .35s var(--ease-soft), visibility .35s, transform .45s var(--ease-luxe);
}
.site-chat.is-open .site-chat__panel{
  opacity:1;
  visibility:visible;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.site-chat__head{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:16px;
  position:relative;
  z-index:2;
}
.site-chat__head .mono{
  color:var(--ink-dimmer);
  display:block;
  margin-bottom:8px;
}
.site-chat__head h2{
  font-size:28px;
}
.site-chat__close{
  width:40px;
  height:40px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:none;
}
.site-chat__close i{
  font-size:21px;
}
.site-chat__messages{
  min-height:120px;
  max-height:260px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:10px;
  position:relative;
  z-index:2;
  padding-right:4px;
}
.site-chat__message{
  width:fit-content;
  max-width:88%;
  padding:12px 14px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:16px;
  background:rgba(255,255,255,.055);
}
.site-chat__message p{
  font-size:13.5px;
  line-height:1.5;
}
.site-chat__message--visitor{
  align-self:flex-end;
  background:rgba(236,237,237,.92);
  color:#0a0a0a;
}
.site-chat__message--agent{
  align-self:flex-start;
}
.site-chat__form{
  display:grid;
  gap:12px;
  position:relative;
  z-index:2;
}
.site-chat__identity{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
}
.site-chat__identity label:nth-child(3){
  grid-column:1 / -1;
}
.site-chat__form label{
  display:grid;
  gap:7px;
}
.site-chat__form label span{
  color:var(--ink-dim);
  font-size:11.5px;
  font-weight:700;
}
.site-chat__form input,
.site-chat__form textarea{
  width:100%;
  border:1px solid rgba(255,255,255,.12);
  border-radius:16px;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  font:500 13.5px/1.45 'Inter',sans-serif;
  outline:none;
  transition:border-color .25s var(--ease-soft), background .25s var(--ease-soft), box-shadow .25s var(--ease-soft);
}
.site-chat__form input{
  min-height:46px;
  padding:0 14px;
}
.site-chat__form textarea{
  min-height:84px;
  resize:vertical;
  padding:13px 14px;
}
.site-chat__form input:focus,
.site-chat__form textarea:focus{
  border-color:rgba(255,255,255,.40);
  background:rgba(255,255,255,.08);
  box-shadow:0 0 0 4px rgba(255,255,255,.045);
}
.site-chat__send{
  min-height:50px;
  border:0;
  border-radius:999px;
  background:var(--ink);
  color:#0a0a0a;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font:700 13px/1 'Sora',sans-serif;
  cursor:none;
  box-shadow:0 22px 54px -22px rgba(255,255,255,.35);
}
.site-chat__send:disabled{
  opacity:.6;
  pointer-events:none;
}
.site-chat__status{
  min-height:18px;
  color:var(--ink-dim);
  text-align:center;
  font-size:12px;
  line-height:1.45;
}
.site-chat__status[data-tone="error"]{
  color:#ffb8b8;
}
.site-chat__status[data-tone="success"]{
  color:#c9f7d4;
}

@media (max-width:860px){
  .cta-btn,
  .contact-modal__close,
  .contact-form__submit,
  .site-chat__launcher,
  .site-chat__close,
  .site-chat__send{
    cursor:auto;
  }
  .contact-modal{
    align-items:flex-start;
    overflow-y:auto;
    padding:100px 16px 16px;
  }
  .contact-modal__panel{
    max-height:calc(100dvh - 116px);
    padding:24px;
    border-radius:22px;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .contact-modal.is-open .contact-modal__panel{
    transform:translateY(0) scale(1);
  }
  .site-chat{
    right:18px;
    bottom:18px;
  }
  .site-chat__panel{
    bottom:68px;
  }
}

@media (max-width:720px){
  .contact-modal{
    padding:84px 12px 12px;
  }
  .contact-modal__panel{
    max-height:calc(100dvh - 96px);
  }
}

@media (max-height:680px){
  .contact-modal__panel{
    width:min(500px, 100%);
    padding:20px 24px;
  }
  .contact-modal__eyebrow{
    margin-bottom:7px;
  }
  .contact-modal h2{
    font-size:clamp(25px, 5vh, 34px);
    margin-bottom:12px;
  }
  .contact-form{
    gap:8px;
  }
  .contact-form label{
    gap:4px;
  }
  .contact-form input,
  .contact-form textarea{
    padding:10px 12px;
  }
  .contact-form textarea{
    height:66px;
    min-height:66px;
  }
  .contact-form__submit{
    min-height:46px;
  }
}

@media (max-width:460px){
  .contact-modal{
    padding:84px 12px 12px;
  }
  .contact-modal__panel{
    max-height:calc(100dvh - 96px);
    padding:22px 18px;
    border-radius:20px;
  }
  .contact-modal h2{
    font-size:clamp(25px, 9vw, 34px);
  }
  .chat-confirm{
    padding:14px;
  }
  .chat-confirm__panel{
    padding:28px 20px 20px;
    border-radius:20px;
  }
  .chat-confirm__actions{
    grid-template-columns:1fr;
  }
  .site-chat{
    left:14px;
    right:14px;
  }
  .site-chat__launcher{
    margin-left:auto;
  }
  .site-chat__panel{
    width:100%;
  }
  .site-chat__identity{
    grid-template-columns:1fr;
  }
  .site-chat__identity label:nth-child(3){
    grid-column:auto;
  }
}

footer{ padding:0 0 50px; }
.footer-inner{
  display:flex; justify-content:space-between; align-items:flex-end; gap:24px;
  padding-top:40px; border-top:1px solid var(--line); flex-wrap:wrap;
}
.footer-links{ display:flex; gap:26px; flex-wrap:wrap; }
.footer-links a{ color:var(--ink-dim); font-size:13px; transition:color .3s; }
.footer-links a:hover{ color:var(--ink); }
.footer-meta{ color:var(--ink-dimmer); font-size:12px; text-align:right; }

/* ---------- support login ---------- */
.support-login-page{
  min-height:100vh;
  cursor:auto;
}
.support-dashboard-page,
.support-inbox-page,
.support-login-page main,
.support-dashboard-page main,
.support-inbox-page main{
  min-height:100vh;
  cursor:auto;
}
.support-main,
.support-dashboard-main{
  background:
    radial-gradient(ellipse 54% 42% at 52% 12%, rgba(180,186,192,.10), transparent 64%),
    radial-gradient(ellipse 70% 58% at 50% 102%, rgba(78,82,88,.14), transparent 68%);
}
.support-login{
  min-height:100vh;
  padding-top:150px;
  padding-bottom:70px;
  display:grid;
  grid-template-columns:minmax(0, 1fr) minmax(360px, 480px);
  gap:clamp(34px, 7vw, 94px);
  align-items:center;
}
.support-login__intro h1{
  max-width:640px;
  font-size:clamp(46px, 8vw, 96px);
  margin-bottom:26px;
}
.support-login__intro p{
  max-width:540px;
  color:var(--ink-dim);
  font-size:clamp(16px, 2vw, 20px);
  line-height:1.7;
}
.support-status-grid{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 180px));
  gap:14px;
  margin-top:42px;
}
.support-status{
  padding:22px;
  border-radius:20px;
}
.support-status span{
  display:block;
  color:var(--ink-dimmer);
  margin-bottom:12px;
}
.support-status strong{
  display:block;
  font-family:'Sora',sans-serif;
  font-size:22px;
}
.support-login__panel{
  padding:clamp(30px, 4.5vw, 46px);
  border-radius:28px;
  box-shadow:0 34px 96px -54px rgba(0,0,0,.98);
}
.support-login__eyebrow{
  display:block;
  color:var(--ink-dimmer);
  margin-bottom:18px;
}
.support-login__panel h2{
  font-size:clamp(30px, 4vw, 42px);
  margin-bottom:28px;
}
.support-form{
  display:grid;
  gap:17px;
  position:relative;
  z-index:2;
}
.support-form label{
  display:grid;
  gap:9px;
}
.support-form label span,
.support-form__row a{
  color:var(--ink-dim);
  font-size:12px;
  font-weight:600;
}
.support-form input[type="email"],
.support-password input{
  width:100%;
  min-height:56px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  font:500 15px/1.4 'Inter',sans-serif;
  padding:0 18px;
  outline:none;
  transition:border-color .25s var(--ease-soft), background .25s var(--ease-soft), box-shadow .25s var(--ease-soft);
}
.support-form input[type="email"]:focus,
.support-password input:focus{
  border-color:rgba(255,255,255,.46);
  background:rgba(255,255,255,.08);
  box-shadow:0 0 0 4px rgba(255,255,255,.055);
}
.support-form input[type="email"]::placeholder,
.support-password input::placeholder{
  color:rgba(236,237,237,.34);
}
.support-password{
  position:relative;
}
.support-password input{
  padding-right:58px;
}
.support-password__toggle{
  position:absolute;
  top:50%;
  right:9px;
  transform:translateY(-50%);
  width:40px;
  height:40px;
  border:0;
  border-radius:50%;
  background:rgba(255,255,255,.06);
  color:var(--ink-dim);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .25s var(--ease-soft), color .25s var(--ease-soft);
}
.support-password__toggle:hover{
  background:rgba(255,255,255,.12);
  color:var(--ink);
}
.support-password__toggle i{
  font-size:21px;
}
.support-form__row{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  flex-wrap:wrap;
  margin-top:2px;
}
.support-check{
  display:flex!important;
  grid-template-columns:none!important;
  align-items:center;
  gap:9px!important;
}
.support-check input{
  width:16px;
  height:16px;
  accent-color:var(--ink);
}
.support-form__row a{
  transition:color .25s var(--ease-soft);
}
.support-form__row a:hover{
  color:var(--ink);
}
.support-submit{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:100%;
  min-height:58px;
  margin-top:8px;
  border:0;
  border-radius:999px;
  background:var(--ink);
  color:#0a0a0a;
  font:700 14px/1 'Sora',sans-serif;
  cursor:pointer;
  box-shadow:0 22px 54px -22px rgba(255,255,255,.35);
  transition:transform .5s var(--ease-luxe), box-shadow .5s var(--ease-luxe);
}
.support-submit:hover{
  transform:translateY(-2px) scale(1.015);
  box-shadow:0 30px 64px -24px rgba(255,255,255,.46);
}
.support-form__message{
  min-height:20px;
  color:var(--ink-dim);
  font-size:12.5px;
  line-height:1.5;
  text-align:center;
}
.support-form__message[data-tone="error"]{
  color:#ffb8b8;
}
.support-form__message[data-tone="success"]{
  color:#c9f7d4;
}
.support-submit:disabled,
.support-signout:disabled{
  opacity:.62;
  pointer-events:none;
}
.support-dashboard{
  min-height:100vh;
  padding-top:150px;
  padding-bottom:70px;
}
.support-dashboard__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:30px;
  margin-bottom:46px;
  flex-wrap:wrap;
}
.support-dashboard__head h1{
  font-size:clamp(46px, 8vw, 88px);
}
.support-dashboard__head p{
  color:var(--ink-dim);
  font-size:14px;
}
.support-dashboard__grid{
  display:grid;
  grid-template-columns:minmax(280px, 390px) minmax(0, 1fr);
  gap:18px;
}
.support-inbox,
.support-thread{
  border-radius:28px;
  padding:clamp(26px, 4vw, 38px);
}
.support-inbox{
  min-height:520px;
}
.support-inbox__top{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  margin-bottom:34px;
}
.support-inbox__top span{
  color:var(--ink-dimmer);
}
.support-inbox__top strong{
  font-family:'Sora',sans-serif;
  font-size:20px;
}
.support-empty-list{
  min-height:360px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:14px;
  color:var(--ink-dim);
  text-align:center;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:rgba(255,255,255,.035);
}
.support-empty-list i{
  color:var(--ink-dimmer);
  font-size:30px;
}
.support-thread{
  min-height:520px;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
.support-thread .mono{
  color:var(--ink-dimmer);
  margin-bottom:18px;
}
.support-thread h2{
  max-width:620px;
  font-size:clamp(32px, 5vw, 64px);
  margin-bottom:22px;
}
.support-thread p{
  max-width:600px;
  color:var(--ink-dim);
  font-size:16px;
  line-height:1.7;
}
.support-thread__actions{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  margin-top:34px;
}
.support-primary-action,
.support-secondary-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 20px;
  border-radius:999px;
  font-family:'Sora',sans-serif;
  font-size:13px;
  font-weight:700;
}
.support-primary-action{
  background:var(--ink);
  color:#0a0a0a;
}
.support-secondary-action{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.055);
  color:var(--ink);
}
.chat-inbox{
  min-height:100vh;
  padding-top:150px;
  padding-bottom:70px;
}
.chat-inbox__grid{
  display:grid;
  grid-template-columns:minmax(300px, 410px) minmax(0, 1fr);
  gap:18px;
  align-items:stretch;
}
.chat-list,
.chat-thread{
  border-radius:28px;
  padding:clamp(22px, 3.5vw, 34px);
}
.chat-list{
  min-height:680px;
}
.chat-list__top{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:18px;
  margin-bottom:18px;
}
.chat-list__top span{
  display:block;
  color:var(--ink-dimmer);
  margin-bottom:8px;
}
.chat-list__top strong{
  font-family:'Sora',sans-serif;
  font-size:22px;
}
.chat-list__sync{
  display:block;
  margin-top:7px;
  color:var(--ink-dimmer);
  font-size:11.5px;
}
.chat-icon-btn{
  width:42px;
  height:42px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .25s var(--ease-soft), transform .25s var(--ease-soft);
}
.chat-icon-btn:hover{
  background:rgba(255,255,255,.12);
  transform:scale(1.04);
}
.chat-search{
  position:relative;
  margin-bottom:18px;
}
.chat-search i{
  position:absolute;
  left:16px;
  top:50%;
  transform:translateY(-50%);
  color:var(--ink-dimmer);
  font-size:20px;
  pointer-events:none;
}
.chat-search input{
  width:100%;
  min-height:50px;
  border:1px solid rgba(255,255,255,.10);
  border-radius:999px;
  background:rgba(255,255,255,.045);
  color:var(--ink);
  font:500 14px/1.4 'Inter',sans-serif;
  padding:0 18px 0 48px;
  outline:none;
}
.chat-search input:focus{
  border-color:rgba(255,255,255,.36);
  box-shadow:0 0 0 4px rgba(255,255,255,.045);
}
.chat-conversation-list{
  display:grid;
  gap:10px;
  max-height:520px;
  overflow:auto;
  padding-right:4px;
}
.chat-conversation{
  width:100%;
  display:grid;
  gap:9px;
  padding:16px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:20px;
  background:rgba(255,255,255,.035);
  color:var(--ink);
  text-align:left;
  cursor:pointer;
  transition:background .25s var(--ease-soft), border-color .25s var(--ease-soft), transform .25s var(--ease-soft);
}
.chat-conversation:hover,
.chat-conversation.is-active{
  background:rgba(255,255,255,.085);
  border-color:rgba(255,255,255,.18);
}
.chat-conversation.is-unread{
  background:linear-gradient(155deg, rgba(236,237,237,.13), rgba(255,255,255,.055));
  border-color:rgba(236,237,237,.34);
  box-shadow:
    inset 3px 0 0 rgba(236,237,237,.86),
    0 22px 54px -34px rgba(236,237,237,.34);
}
.chat-conversation.is-read{
  opacity:.72;
}
.chat-conversation.is-read:hover,
.chat-conversation.is-read.is-active{
  opacity:1;
}
.chat-conversation.is-active{
  transform:translateX(3px);
}
.chat-conversation__meta,
.chat-conversation__footer{
  display:flex;
  justify-content:space-between;
  gap:14px;
}
.chat-conversation__meta strong{
  font-family:'Sora',sans-serif;
  font-size:15px;
}
.chat-conversation__meta small,
.chat-conversation__footer,
.chat-conversation__preview{
  color:var(--ink-dim);
  font-size:12px;
  line-height:1.45;
}
.chat-conversation__preview{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.chat-conversation__footer em{
  color:var(--ink);
  font-style:normal;
}
.chat-conversation.is-unread .chat-conversation__meta strong,
.chat-conversation.is-unread .chat-conversation__preview{
  color:var(--ink);
}
.chat-conversation.is-unread .chat-conversation__footer em{
  min-height:22px;
  padding:4px 8px;
  border-radius:999px;
  background:var(--ink);
  color:#0a0a0a;
  font-size:10.5px;
  font-weight:800;
}
.chat-conversation.is-read .chat-conversation__meta strong,
.chat-conversation.is-read .chat-conversation__preview{
  color:var(--ink-dim);
}
.chat-thread{
  min-height:680px;
  display:grid;
  grid-template-rows:auto minmax(320px, 1fr) auto;
  gap:18px;
}
.chat-thread__head{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  padding-bottom:18px;
  border-bottom:1px solid rgba(255,255,255,.08);
}
.chat-thread__head .mono{
  color:var(--ink-dimmer);
  display:block;
  margin-bottom:10px;
}
.chat-thread__head h2{
  font-size:clamp(28px, 4vw, 46px);
}
.chat-thread__actions{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  flex-wrap:wrap;
}
.chat-email-link{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:38px;
  padding:0 15px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.055);
  color:var(--ink);
  font:700 12px/1 'Sora',sans-serif;
}
.chat-delete-btn{
  min-height:38px;
  padding:0 14px;
  border-radius:999px;
  border:1px solid rgba(255,130,130,.22);
  background:rgba(255,90,90,.08);
  color:#ffb8b8;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  font:700 12px/1 'Sora',sans-serif;
  cursor:pointer;
  transition:background .25s var(--ease-soft), border-color .25s var(--ease-soft), color .25s var(--ease-soft), opacity .25s var(--ease-soft);
}
.chat-delete-btn:hover{
  background:rgba(255,90,90,.14);
  border-color:rgba(255,130,130,.38);
  color:#ffd3d3;
}
.chat-delete-btn:disabled{
  opacity:.38;
  pointer-events:none;
}
.chat-delete-btn i{
  font-size:17px;
}
.chat-confirm{
  position:fixed;
  inset:0;
  z-index:9600;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:24px;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .3s var(--ease-soft), visibility .3s;
}
.chat-confirm.is-open{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}
.chat-confirm__backdrop{
  position:absolute;
  inset:0;
  background:rgba(4,5,6,.72);
  backdrop-filter:blur(18px) saturate(130%);
  -webkit-backdrop-filter:blur(18px) saturate(130%);
}
.chat-confirm__panel{
  position:relative;
  width:min(460px, 100%);
  padding:34px;
  border-radius:24px;
  box-shadow:0 44px 120px -50px rgba(0,0,0,.92);
  transform:translateY(18px) scale(.98);
  transition:transform .38s var(--ease-luxe);
}
.chat-confirm.is-open .chat-confirm__panel{
  transform:translateY(0) scale(1);
}
.chat-confirm__close{
  position:absolute;
  top:14px;
  right:14px;
  width:38px;
  height:38px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:50%;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .25s var(--ease-soft), border-color .25s var(--ease-soft), transform .25s var(--ease-soft);
}
.chat-confirm__close:hover{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.28);
  transform:scale(1.04);
}
.chat-confirm__close i{
  font-size:20px;
}
.chat-confirm__eyebrow{
  display:block;
  color:var(--ink-dimmer);
  margin-bottom:12px;
  padding-right:44px;
}
.chat-confirm h2{
  max-width:360px;
  padding-right:44px;
  font-size:clamp(28px, 4vw, 42px);
  line-height:1;
  margin-bottom:14px;
}
.chat-confirm p{
  color:var(--ink-dim);
  font-size:14px;
  line-height:1.55;
}
.chat-confirm p strong{
  color:var(--ink);
  font-weight:700;
}
.chat-confirm__status{
  min-height:20px;
  margin-top:12px;
  color:#ffb8b8;
}
.chat-confirm__actions{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:10px;
  margin-top:22px;
}
.chat-confirm__secondary,
.chat-confirm__danger{
  min-height:48px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  font:800 12px/1 'Sora',sans-serif;
  cursor:pointer;
  transition:background .25s var(--ease-soft), border-color .25s var(--ease-soft), color .25s var(--ease-soft), opacity .25s var(--ease-soft), transform .25s var(--ease-soft);
}
.chat-confirm__secondary{
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.055);
  color:var(--ink);
}
.chat-confirm__danger{
  border:1px solid rgba(255,130,130,.28);
  background:rgba(255,90,90,.12);
  color:#ffb8b8;
}
.chat-confirm__secondary:hover,
.chat-confirm__danger:hover{
  transform:translateY(-1px);
}
.chat-confirm__secondary:hover{
  background:rgba(255,255,255,.11);
}
.chat-confirm__danger:hover{
  background:rgba(255,90,90,.18);
  border-color:rgba(255,130,130,.42);
  color:#ffd3d3;
}
.chat-confirm__danger:disabled{
  opacity:.55;
  pointer-events:none;
}
.chat-confirm__danger i{
  font-size:17px;
}
body.support-dialog-open{
  overflow:hidden;
}
.chat-messages{
  min-height:320px;
  max-height:520px;
  overflow:auto;
  display:flex;
  flex-direction:column;
  gap:12px;
  padding-right:6px;
}
.chat-message{
  width:min(78%, 620px);
  padding:15px 17px;
  border:1px solid rgba(255,255,255,.08);
  border-radius:18px;
  background:rgba(255,255,255,.05);
}
.chat-message--agent{
  align-self:flex-end;
  background:rgba(236,237,237,.92);
  color:#0a0a0a;
}
.chat-message--customer{
  align-self:flex-start;
}
.chat-message p{
  font-size:14.5px;
  line-height:1.55;
}
.chat-message time{
  display:block;
  margin-top:8px;
  color:var(--ink-dimmer);
  font-size:11px;
}
.chat-message--agent time{
  color:rgba(10,10,10,.55);
}
.chat-composer{
  display:grid;
  grid-template-columns:minmax(0, 1fr) 150px;
  gap:12px;
  padding-top:18px;
  border-top:1px solid rgba(255,255,255,.08);
}
.chat-composer textarea{
  width:100%;
  min-height:58px;
  max-height:150px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:18px;
  background:rgba(255,255,255,.055);
  color:var(--ink);
  font:500 14px/1.5 'Inter',sans-serif;
  padding:15px 17px;
  resize:vertical;
  outline:none;
}
.chat-composer textarea:focus{
  border-color:rgba(255,255,255,.42);
  box-shadow:0 0 0 4px rgba(255,255,255,.045);
}
.chat-composer textarea:disabled,
.chat-composer button:disabled{
  opacity:.55;
  cursor:not-allowed;
}
.chat-loading,
.chat-empty-list,
.chat-empty-state{
  min-height:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  color:var(--ink-dim);
  text-align:center;
  border:1px solid rgba(255,255,255,.08);
  border-radius:22px;
  background:rgba(255,255,255,.035);
  padding:24px;
}
.chat-empty-list small{
  color:var(--ink-dimmer);
  font-size:12px;
  line-height:1.5;
}
.chat-empty-state i,
.chat-empty-list i{
  color:var(--ink-dimmer);
  font-size:30px;
}
.chat-error{
  min-height:auto;
  color:#ffb8b8;
}
@media (max-width:960px){
  .support-login{
    grid-template-columns:1fr;
    padding-top:132px;
  }
  .support-login__intro h1,
  .support-login__intro p{
    max-width:760px;
  }
  .support-login__panel{
    max-width:560px;
    width:100%;
  }
  .support-dashboard__grid{
    grid-template-columns:1fr;
  }
  .support-inbox,
  .support-thread{
    min-height:auto;
  }
  .chat-inbox__grid{
    grid-template-columns:1fr;
  }
  .chat-list,
  .chat-thread{
    min-height:auto;
  }
}
@media (max-width:560px){
  .support-login{
    padding-top:116px;
  }
  .support-dashboard{
    padding-top:116px;
  }
  .chat-inbox{
    padding-top:116px;
  }
  .support-status-grid{
    grid-template-columns:1fr;
  }
  .support-form__row{
    align-items:flex-start;
    flex-direction:column;
  }
  .chat-thread__head,
  .chat-composer{
    grid-template-columns:1fr;
  }
  .chat-thread__head{
    flex-direction:column;
  }
  .chat-thread__actions{
    justify-content:flex-start;
  }
  .chat-message{
    width:100%;
  }
}

/* ---------- reveal utility ---------- */
.reveal{ opacity:0; transform:translateY(36px); filter:blur(6px); }

/* ---------- magnetic ---------- */
.magnetic{ display:inline-flex; will-change:transform; }

@media (prefers-reduced-motion: reduce){
  *{ animation-duration:.001ms !important; transition-duration:.001ms !important; }
}

/* ---------- FAQ exhibition ---------- */
.faq-page{
  position:relative;
  overflow:clip;
  isolation:isolate;
  min-height:100vh;
  background:
    radial-gradient(circle at 16% 18%, rgba(151,27,41,.115), transparent 32%),
    radial-gradient(circle at 86% 64%, rgba(0,66,37,.14), transparent 38%),
    linear-gradient(180deg, #050506 0%, #080809 46%, #050506 100%);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  scroll-margin-top:96px;
}
#faq-ribbon-canvas{
  position:sticky;
  top:0;
  display:block;
  width:100%;
  height:100vh;
  margin-bottom:-100vh;
  z-index:0;
  pointer-events:none;
  opacity:.62;
  filter:blur(.18px) saturate(.96);
}
.faq-atmosphere{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.28;
  background:
    linear-gradient(90deg, rgba(255,255,255,.022) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:128px 128px, 128px 128px;
  mask-image:radial-gradient(circle at 50% 44%, #000, transparent 74%);
}
.faq-page::before,
.faq-page::after{
  content:'';
  position:absolute;
  width:38vw;
  height:38vw;
  border-radius:50%;
  pointer-events:none;
  filter:blur(94px);
  opacity:.15;
  z-index:0;
}
.faq-page::before{ top:8%; left:-20%; background:#971B29; }
.faq-page::after{ bottom:8%; right:-18%; background:#004225; }
.faq-wrap{
  position:relative;
  z-index:2;
  width:min(1400px, 100%);
  margin:0 auto;
  padding:0 48px;
}
.faq-hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  z-index:2;
}
.faq-kicker{ color:var(--ink-dimmer); }
.faq-hero-title{
  margin-top:18px;
  font-size:clamp(66px, 12vw, 168px);
  max-width:980px;
  text-shadow:0 0 58px rgba(255,255,255,.08);
  filter:none !important;
}
.faq-hero-copy{
  margin-top:28px;
  color:var(--ink-dim);
  font-size:clamp(17px,2.1vw,24px);
  line-height:1.55;
  max-width:680px;
}
.faq-controls-shell{
  position:sticky;
  top:104px;
  z-index:20;
  margin-top:-96px;
  margin-bottom:72px;
  pointer-events:none;
}
.faq-controls{
  display:grid;
  grid-template-columns:minmax(250px, 330px) minmax(0, 1fr);
  gap:14px;
  align-items:center;
  padding:14px;
  border-radius:28px;
  pointer-events:auto;
}
.faq-search{
  position:relative;
  z-index:2;
  display:flex;
  align-items:center;
  gap:14px;
  min-height:48px;
  padding:0 18px;
  border-radius:999px;
  background:rgba(255,255,255,.045);
  border:1px solid rgba(255,255,255,.1);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.12);
}
.faq-search span{ color:var(--ink-dimmer); flex:0 0 auto; }
.faq-search input{
  width:100%;
  min-width:0;
  border:0;
  outline:0;
  color:var(--ink);
  background:transparent;
  font:500 13px/1.2 'Inter',sans-serif;
  caret-color:var(--chrome-hi);
}
.faq-search input::placeholder{ color:rgba(132,135,140,.72); }
.faq-filters{
  position:relative;
  z-index:2;
  display:flex;
  gap:8px;
  justify-content:flex-end;
  overflow-x:auto;
  scrollbar-width:none;
  min-width:0;
}
.faq-filters::-webkit-scrollbar{ display:none; }
.faq-filter{
  flex:0 0 auto;
  border:1px solid rgba(255,255,255,.1);
  border-radius:999px;
  background:rgba(255,255,255,.035);
  color:var(--ink-dim);
  font:600 12px/1 'Inter',sans-serif;
  min-height:38px;
  padding:0 15px;
  cursor:none;
  transition:color .35s var(--ease-soft), background .35s var(--ease-soft), border-color .35s var(--ease-soft), box-shadow .35s var(--ease-soft), transform .35s var(--ease-soft);
}
.faq-filter:focus{ outline:none; }
.faq-filter:focus-visible{
  border-color:rgba(255,255,255,.34);
  box-shadow:0 0 0 1px rgba(255,255,255,.12), 0 0 34px rgba(255,255,255,.08);
}
.faq-filter:hover,
.faq-filter.is-active{
  color:var(--ink);
  background:rgba(255,255,255,.11);
  border-color:rgba(255,255,255,.24);
  box-shadow:0 0 34px rgba(255,255,255,.06), inset 0 1px 0 rgba(255,255,255,.18);
}
.faq-filter.is-active[data-filter="ai"],
.faq-filter.is-active[data-filter="support"]{ box-shadow:0 0 34px rgba(0,66,37,.16), inset 0 1px 0 rgba(255,255,255,.18); }
.faq-filter.is-active[data-filter="branding"],
.faq-filter.is-active[data-filter="marketing"]{ box-shadow:0 0 34px rgba(151,27,41,.16), inset 0 1px 0 rgba(255,255,255,.18); }
.faq-list{
  position:relative;
  z-index:2;
  display:grid;
  gap:24px;
  padding-bottom:110px;
}
.faq-item{
  min-height:clamp(520px, 82vh, 780px);
  padding:clamp(30px,5vw,78px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:28px;
  border-radius:28px;
  transition:transform .75s var(--ease-luxe), border-color .45s var(--ease-soft), box-shadow .55s var(--ease-soft), opacity .45s var(--ease-soft), filter .45s var(--ease-soft);
}
.faq-item::before{
  background:
    radial-gradient(460px 320px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.13), transparent 64%),
    radial-gradient(420px 280px at 12% 18%, rgba(151,27,41,.08), transparent 70%),
    radial-gradient(460px 300px at 86% 72%, rgba(0,66,37,.08), transparent 72%);
}
.faq-item.is-open{
  border-color:rgba(255,255,255,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    0 42px 120px -80px rgba(255,255,255,.22);
}
.faq-item.is-hidden{
  display:none;
}
.faq-item:hover{
  transform:translateY(-6px);
  border-color:rgba(255,255,255,.18);
}
.faq-index{
  position:relative;
  z-index:2;
  color:var(--ink-dimmer);
}
.faq-question{
  position:relative;
  z-index:2;
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:30px;
  width:100%;
  border:0;
  background:transparent;
  color:var(--ink);
  text-align:left;
  cursor:none;
  font-family:'Sora',sans-serif;
  font-size:clamp(38px, 7vw, 96px);
  font-weight:800;
  line-height:1;
  letter-spacing:-.02em;
}
.faq-question:focus{ outline:none; }
.faq-question:focus-visible{
  outline:none;
}
.faq-question > span:first-child{
  display:inline-block;
  max-width:980px;
  transition:transform .65s var(--ease-luxe), color .45s var(--ease-soft), text-shadow .45s var(--ease-soft);
}
.faq-item:hover .faq-question > span:first-child,
.faq-item.is-open .faq-question > span:first-child{
  transform:scale(1.018);
  text-shadow:0 0 42px rgba(255,255,255,.08), 0 0 48px rgba(151,27,41,.07);
}
.faq-toggle{
  flex:0 0 auto;
  color:var(--ink-dimmer);
  padding-bottom:12px;
  transition:color .35s var(--ease-soft);
}
.faq-item.is-open .faq-toggle{ color:var(--ink); }
.faq-answer{
  position:relative;
  z-index:2;
  max-width:760px;
  max-height:0;
  overflow:hidden;
  opacity:0;
  transform:translateY(26px);
  filter:blur(10px);
  transition:max-height .85s var(--ease-luxe), opacity .55s var(--ease-soft), transform .65s var(--ease-luxe), filter .65s var(--ease-soft);
}
.faq-answer p{
  color:rgba(236,237,237,.72);
  font-size:clamp(17px,2vw,23px);
  line-height:1.65;
}
.faq-item.is-open .faq-answer{
  max-height:280px;
  opacity:1;
  transform:translateY(0);
  filter:blur(0);
}
.faq-closing{
  position:relative;
  z-index:2;
  padding:60px 48px 190px;
}
.faq-cta-panel{
  min-height:70vh;
  padding:clamp(34px,6vw,82px);
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:flex-start;
}
.faq-cta-panel h2{
  font-size:clamp(50px, 9vw, 126px);
  max-width:920px;
}
.faq-cta-panel p{
  color:var(--ink-dim);
  margin:22px 0 34px;
  font-size:clamp(18px,2vw,24px);
}
.faq-cta-btn{
  min-height:48px;
  padding:0 22px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.2);
  background:rgba(255,255,255,.075);
  color:var(--ink);
  font-family:'Sora',sans-serif;
  font-size:13px;
  font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 22px 70px -42px rgba(255,255,255,.6);
  transition:transform .45s var(--ease-luxe), background .35s var(--ease-soft), border-color .35s var(--ease-soft);
}
.faq-cta-btn:hover{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.34);
}
.faq-empty{
  position:relative;
  z-index:2;
  min-height:45vh;
  display:none;
  place-items:center;
  color:var(--ink-dim);
  font-size:clamp(18px,2vw,24px);
  text-align:center;
}
.faq-empty.is-visible{ display:grid; }
@media (max-width:1050px){
  .faq-controls{ grid-template-columns:1fr; }
  .faq-filters{ justify-content:flex-start; flex-wrap:wrap; overflow-x:visible; }
  .faq-question{ align-items:flex-start; flex-direction:column; }
  .faq-toggle{ padding-bottom:0; }
}
@media (max-width:720px){
  .faq-wrap{ padding:0 22px; }
  .faq-hero-title{ font-size:clamp(52px,17vw,84px); }
  .faq-controls-shell{ top:118px; margin-top:-58px; margin-bottom:42px; padding:0 16px; }
  .faq-controls{ padding:10px; border-radius:22px; }
  .faq-search{ min-height:44px; }
  .faq-filter{ cursor:auto; }
  .faq-list{ gap:16px; padding-bottom:70px; }
  .faq-item{ min-height:auto; padding:26px 20px; gap:18px; justify-content:flex-start; border-radius:22px; }
  .faq-question{ align-items:center; font-size:clamp(24px,8vw,38px); gap:16px; line-height:1.08; }
  .faq-toggle{ padding-bottom:0; }
  .faq-answer p{ font-size:16px; }
  .faq-closing{ padding:40px 22px 140px; }
  .faq-cta-panel{ min-height:auto; padding:34px 22px; }
}



.catalogue{
  min-height:760vh;
  padding:0;
  overflow:clip;
  contain:layout paint;
}
.catalogue-stage{
  position:sticky;
  top:0;
  height:100vh;
  min-height:680px;
  overflow:hidden;
  display:grid;
  place-items:center;
  background:
    radial-gradient(ellipse 54% 42% at 50% 42%, rgba(180,186,192,.095), transparent 62%),
    radial-gradient(ellipse 84% 70% at 50% 112%, rgba(78,82,88,.16), transparent 66%);
}
#catalogue-canvas{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  z-index:1;
}
.catalogue-vignette{
  position:absolute;
  inset:0;
  z-index:2;
  pointer-events:none;
  background:
    linear-gradient(180deg, rgba(6,6,7,.78), rgba(6,6,7,0) 18%, rgba(6,6,7,0) 78%, rgba(6,6,7,.86)),
    radial-gradient(circle at 50% 46%, transparent 28%, rgba(6,6,7,.36) 82%);
}
.catalogue-head{
  display:none;
}
.catalogue-head h2{
  font-size:clamp(34px,5vw,64px);
  max-width:520px;
}
.catalogue-head .section-desc{ max-width:390px; }
.catalogue-progress{
  position:absolute;
  left:50%;
  bottom:42px;
  transform:translateX(-50%);
  z-index:5;
  width:min(420px, calc(100% - 56px));
  height:1px;
  background:rgba(255,255,255,.12);
  overflow:hidden;
}
.catalogue-progress span{
  display:block;
  width:100%;
  height:100%;
  transform:scaleX(0);
  transform-origin:left center;
  background:linear-gradient(90deg, rgba(255,255,255,.1), rgba(255,255,255,.9), rgba(255,255,255,.18));
  will-change:transform;
}
.catalogue-skip{
  position:fixed;
  right:28px;
  bottom:98px;
  left:auto;
  z-index:7210;
  width:max-content;
  max-width:calc(100vw - 56px);
  min-height:46px;
  padding:0 16px 0 20px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(15,16,18,.48);
  color:var(--ink);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:9px;
  font:700 12.5px/1 'Sora',sans-serif;
  text-decoration:none;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.16),
    0 22px 62px -34px rgba(0,0,0,.95);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transform:translateY(10px);
  transition:background .3s var(--ease-soft), border-color .3s var(--ease-soft), transform .3s var(--ease-soft), box-shadow .3s var(--ease-soft);
   
  position: fixed !important;
    bottom: 98px !important;
    right: 35px !important;
    left: unset !important;

    transform: translateY(10px);
    z-index: 99999;
}
.catalogue-skip.is-visible{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
  transform:translateY(0);
}
.catalogue-skip:hover{
  background:rgba(255,255,255,.105);
  border-color:rgba(255,255,255,.28);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    0 26px 70px -34px rgba(255,255,255,.18);
}
.catalogue-skip i{
  width:20px;
  height:20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:20px;
  line-height:1;
}
.catalogue-projects{
  position:absolute;
  inset:0;
  z-index:3;
  pointer-events:none;
}
.catalogue-project{
  position:absolute;
  left:50%;
  top:54%;
  width:min(980px, calc(100% - 130px));
  min-height:425px;
  transform:translate(-50%, -50%);
  display:grid;
  grid-template-columns:minmax(0,1.32fr) minmax(300px,1fr);
  gap:22px;
  opacity:0;
  filter:blur(5px);
  will-change:transform, opacity, filter;
  pointer-events:auto;
  transform-style:preserve-3d;
}
.catalogue-visual,
.catalogue-copy{
  border-radius:22px;
  border:1px solid rgba(255,255,255,.09);
  background:
    radial-gradient(420px 260px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.12), transparent 64%),
    linear-gradient(155deg, rgba(255,255,255,.075), rgba(255,255,255,.016) 42%, rgba(255,255,255,.034));
  backdrop-filter:blur(22px) saturate(150%);
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.18),
    inset 0 -1px 18px rgba(0,0,0,.35),
    0 34px 96px -54px rgba(0,0,0,.98);
  overflow:hidden;
  isolation:isolate;
}
.catalogue-visual{
  position:relative;
  min-height:425px;
  transform:translateZ(0);
}
.catalogue-visual::before{
  content:'';
  position:absolute;
  inset:-20%;
  background:var(--project-texture);
  filter:saturate(.92) brightness(.9) blur(var(--media-blur, 0px));
  transform:scale(var(--media-scale, 1.04));
  transition:filter .8s var(--ease-soft), transform .8s var(--ease-luxe);
}
.catalogue-visual::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    radial-gradient(480px 320px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.16), transparent 62%),
    linear-gradient(180deg, rgba(6,6,7,0), rgba(6,6,7,.64));
}
.catalogue-copy{
  padding:36px 34px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  min-height:425px;
  background:
    radial-gradient(520px 320px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.11), transparent 64%),
    linear-gradient(155deg, rgba(14,15,17,.74), rgba(11,12,14,.48) 46%, rgba(255,255,255,.055));
}
.catalogue-kicker{ color:var(--ink-dimmer); }
.catalogue-title{
  font-size:clamp(42px,4.55vw,60px);
  margin:22px 0 18px;
  will-change:transform, opacity;
}
.catalogue-summary{
  color:rgba(236,237,237,.74);
  font-size:15.5px;
  line-height:1.65;
  max-width:360px;
  will-change:transform, opacity;
}
.catalogue-meta{
  display:flex;
  justify-content:space-between;
  align-items:flex-end;
  gap:18px;
  margin-top:38px;
}
.catalogue-index{ color:var(--ink-dimmer); }
.catalogue-action{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:42px;
  padding:0 18px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.055);
  font-family:'Sora',sans-serif;
  font-size:12.5px;
  font-weight:600;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
}
.catalogue-project.is-active .catalogue-visual{ --media-blur:0px; --media-scale:1; }
.catalogue-project:not(.is-active) .catalogue-visual{ --media-blur:7px; --media-scale:1.045; }
.catalogue-project[data-project="nordfjord"]{ --project-texture: radial-gradient(circle at 28% 22%, #d5d8db, transparent 35%), radial-gradient(circle at 74% 72%, #363a3f, transparent 50%), linear-gradient(135deg, #17181a, #4a4e54 42%, #08090a 82%); }
.catalogue-project[data-project="halo"]{ --project-texture: radial-gradient(circle at 72% 20%, #eef0f1, transparent 34%), radial-gradient(circle at 18% 78%, #2c3035, transparent 52%), linear-gradient(120deg, #0e0f11, #565a60 52%, #080809); }
.catalogue-project[data-project="vantage"]{ --project-texture: radial-gradient(circle at 48% 14%, #cdd1d5, transparent 38%), radial-gradient(circle at 24% 64%, #33373d, transparent 60%), linear-gradient(160deg, #090a0b, #4e5359 46%, #111214); }
.catalogue-project[data-project="ember"]{ --project-texture: radial-gradient(circle at 78% 78%, #f2f3f4, transparent 34%), radial-gradient(circle at 20% 28%, #262a2f, transparent 54%), linear-gradient(145deg, #090a0b, #60646a 56%, #101113); }
.catalogue-filter{
  position:absolute;
  right:58px;
  bottom:64px;
  z-index:5;
  display:flex;
  gap:8px;
  padding:8px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.08);
  background:rgba(15,16,18,.32);
  backdrop-filter:blur(18px) saturate(150%);
  -webkit-backdrop-filter:blur(18px) saturate(150%);
}
.catalogue-filter span{
  color:var(--ink-dimmer);
  font-size:10.5px;
  padding:7px 11px;
  border-radius:999px;
}
.catalogue-filter span:first-child{
  color:var(--ink);
  background:rgba(255,255,255,.08);
}
@media (max-width:900px){
  .catalogue{ min-height:640vh; }
  .catalogue-stage{ min-height:720px; }
  .catalogue-head{
    display:none;
  }
  .catalogue-head .section-desc{ margin-top:18px; }
  .catalogue-project{
    top:58%;
    width:calc(100% - 32px);
    min-height:auto;
    grid-template-columns:1fr;
    gap:14px;
  }
  .catalogue-visual{ min-height:260px; border-radius:22px; }
  .catalogue-copy{ min-height:280px; padding:26px; border-radius:22px; }
  .catalogue-meta{ align-items:flex-start; flex-direction:column; }
  .catalogue-filter{ display:none; }
  .catalogue-skip{
    right:18px;
    bottom:88px;
  }
}
.catalogue.catalogue--static{
  min-height:auto;
  padding:160px 0 120px;
}
.catalogue.catalogue--static .catalogue-stage{
  position:relative;
  height:auto;
  min-height:0;
  overflow:visible;
}
.catalogue.catalogue--static #catalogue-canvas,
.catalogue.catalogue--static .catalogue-vignette,
.catalogue.catalogue--static .catalogue-progress,
.catalogue.catalogue--static + .catalogue-skip{
  display:none;
}
.catalogue.catalogue--static .catalogue-projects{
  position:relative;
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:22px;
  width:min(1180px, calc(100% - 96px));
  margin:0 auto;
}
.catalogue.catalogue--static .catalogue-project{
  position:relative;
  left:auto;
  top:auto;
  width:100%;
  min-height:0;
  grid-template-columns:1fr;
  transform:none!important;
  opacity:1!important;
  filter:none!important;
}
.catalogue.catalogue--static .catalogue-visual{
  min-height:300px;
}
.catalogue.catalogue--static .catalogue-copy{
  min-height:auto;
}
/* ---------- service packages ---------- */
.packages{
  padding:230px 0 220px;
  scroll-margin-top:220px;
}
.packages-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.package-card{
  min-height:430px;
  padding:34px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  transition:transform .7s var(--ease-luxe), border-color .45s var(--ease-soft);
}
.package-card:hover{ border-color:rgba(255,255,255,.18); }
.package-top{ display:flex; justify-content:space-between; align-items:flex-start; gap:20px; }
.package-mark{
  width:44px; height:44px; border-radius:50%;
  border:1px solid rgba(255,255,255,.14);
  background:
    radial-gradient(circle at 34% 24%, rgba(255,255,255,.28), transparent 34%),
    rgba(255,255,255,.035);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.16), 0 18px 40px -28px rgba(255,255,255,.35);
}
.package-card h3{
  font-size:clamp(26px,3vw,38px);
  margin:42px 0 18px;
  max-width:300px;
}
.package-copy{
  color:var(--ink-dim);
  font-size:14px;
  line-height:1.65;
  max-width:330px;
}
.package-list{
  display:grid;
  gap:12px;
  margin:34px 0 38px;
}
.package-list span{
  color:rgba(236,237,237,.72);
  font-size:13px;
  padding-top:12px;
  border-top:1px solid rgba(255,255,255,.075);
}
.package-action{
  appearance:none;
  -webkit-appearance:none;
  position:relative;
  width:max-content;
  min-height:44px;
  padding:0 20px;
  border-radius:999px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.055);
  color:var(--ink);
  font-family:'Sora',sans-serif;
  font-size:12.5px;
  font-weight:600;
  text-decoration:none;
  line-height:1;
  cursor:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.14);
  overflow:hidden;
  isolation:isolate;
  transform:translateZ(0);
  transition:background .4s var(--ease-soft), border-color .4s var(--ease-soft), box-shadow .45s var(--ease-soft);
}
.package-action::before,
.package-action::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
}
.package-action::before{
  background:
    radial-gradient(circle at var(--tap-x,50%) var(--tap-y,50%), rgba(255,255,255,.78), rgba(255,255,255,.28) 20%, transparent 56%);
  opacity:0;
  transform:scale(.36);
  filter:blur(2px);
  mix-blend-mode:screen;
}
.package-action::after{
  width:52%;
  left:-58%;
  right:auto;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.34), rgba(255,255,255,.08), transparent);
  transform:skewX(-18deg);
  opacity:0;
}
.package-action:hover{
  background:rgba(255,255,255,.12);
  border-color:rgba(255,255,255,.34);
}
.package-action.is-clicking{
  background:rgba(255,255,255,.16);
  border-color:rgba(255,255,255,.46);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    0 0 34px rgba(255,255,255,.12);
}
.package-action.is-clicking::before{ animation:button-ripple .68s var(--ease-luxe) forwards; }
.package-action.is-clicking::after{ animation:button-sweep .72s var(--ease-luxe) forwards; }
.liquid-click-target{
  position:relative;
  isolation:isolate;
  transform:translateZ(0);
}
.liquid-click-target.liquid-clip{
  overflow:hidden;
}
.liquid-click-target.is-clicking:not(.package-action){
  filter:brightness(1.14);
}
.liquid-button-sheen{
  position:absolute;
  inset:-10px;
  border-radius:inherit;
  pointer-events:none;
  overflow:hidden;
  z-index:2;
  mix-blend-mode:screen;
}
.liquid-button-sheen::before,
.liquid-button-sheen::after{
  content:'';
  position:absolute;
  inset:0;
  pointer-events:none;
  border-radius:inherit;
}
.liquid-button-sheen::before{
  background:
    radial-gradient(circle at var(--tap-x,50%) var(--tap-y,50%), rgba(255,255,255,.78), rgba(255,255,255,.28) 20%, transparent 56%);
  opacity:0;
  transform:scale(.36);
  filter:blur(2px);
}
.liquid-button-sheen::after{
  width:52%;
  left:-58%;
  right:auto;
  background:linear-gradient(100deg, transparent, rgba(255,255,255,.34), rgba(255,255,255,.08), transparent);
  transform:skewX(-18deg);
  opacity:0;
}
.liquid-click-target.is-clicking .liquid-button-sheen::before{ animation:button-ripple .68s var(--ease-luxe) forwards; }
.liquid-click-target.is-clicking .liquid-button-sheen::after{ animation:button-sweep .72s var(--ease-luxe) forwards; }
.package-card.is-booking{
  border-color:rgba(255,255,255,.24);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.22),
    inset 0 -1px 18px rgba(255,255,255,.035),
    0 24px 90px rgba(255,255,255,.06);
}
.package-card.is-booking .package-mark{ animation:package-orb-pulse .82s var(--ease-luxe) both; }
.liquid-click-bloom{
  position:fixed;
  left:var(--tap-screen-x);
  top:var(--tap-screen-y);
  width:18px;
  height:18px;
  border-radius:50%;
  pointer-events:none;
  z-index:90;
  transform:translate(-50%,-50%);
  border:1px solid rgba(255,255,255,.42);
  background:
    radial-gradient(circle at 34% 28%, rgba(255,255,255,.72), rgba(255,255,255,.22) 34%, transparent 68%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.48),
    0 0 42px rgba(255,255,255,.16);
  mix-blend-mode:screen;
  animation:liquid-click-bloom .78s var(--ease-luxe) forwards;
}
@keyframes button-ripple{
  0%{ opacity:.92; transform:scale(.26); filter:blur(1px); }
  58%{ opacity:.32; transform:scale(2.9); filter:blur(8px); }
  100%{ opacity:0; transform:scale(4.2); filter:blur(12px); }
}
@keyframes button-sweep{
  0%{ opacity:0; transform:translateX(0) skewX(-18deg); }
  18%{ opacity:1; }
  100%{ opacity:0; transform:translateX(330%) skewX(-18deg); }
}
@keyframes package-orb-pulse{
  0%{ transform:scale(1); filter:brightness(1); }
  42%{ transform:scale(1.16); filter:brightness(1.45); }
  100%{ transform:scale(1); filter:brightness(1); }
}
@keyframes liquid-click-bloom{
  0%{ opacity:.72; transform:translate(-50%,-50%) scale(.42); filter:blur(.5px); }
  62%{ opacity:.24; transform:translate(-50%,-50%) scale(9.4); filter:blur(8px); }
  100%{ opacity:0; transform:translate(-50%,-50%) scale(14); filter:blur(14px); }
}
@media (max-width:1050px){ .packages-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width:720px){
  .packages{ padding:110px 0 170px; }
  .packages-grid{ grid-template-columns:1fr; gap:14px; }
  .package-card{ min-height:360px; padding:28px; }
}
/* ---------- vision / mission ---------- */
.vision-page{
  position:relative;
  overflow:clip;
  background:
    radial-gradient(circle at 12% 12%, rgba(151,27,41,.11), transparent 30%),
    radial-gradient(circle at 88% 52%, rgba(0,66,37,.13), transparent 36%),
    linear-gradient(180deg, #060607 0%, #08090a 42%, #050506 100%);
  border-top:1px solid rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.06);
  isolation:isolate;
  scroll-margin-top:100px;
}
#vision-ribbon-canvas{
  position:sticky;
  top:0;
  display:block;
  width:100%;
  height:100vh;
  margin-bottom:-100vh;
  z-index:0;
  pointer-events:none;
  opacity:.6;
  mix-blend-mode:normal;
  filter:blur(.2px) saturate(.96);
}
.vision-atmosphere{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.026) 1px, transparent 1px),
    linear-gradient(180deg, rgba(255,255,255,.018) 1px, transparent 1px);
  background-size:120px 120px, 120px 120px;
  mask-image:radial-gradient(circle at 50% 50%, #000, transparent 72%);
  opacity:.28;
}
.vision-page::before,
.vision-page::after{
  content:'';
  position:absolute;
  width:34vw;
  height:34vw;
  border-radius:50%;
  pointer-events:none;
  filter:blur(86px);
  opacity:.18;
  z-index:0;
}
.vision-page::before{ top:8%; left:-18%; background:#971B29; }
.vision-page::after{ top:42%; right:-16%; background:#004225; }
.vision-wrap{
  width:min(1400px, calc(100% - 96px));
  margin:0 auto;
}
.vision-panel{
  position:relative;
  z-index:3;
  min-height:100vh;
  display:flex;
  align-items:center;
  overflow:hidden;
}
.vision-kicker{
  display:block;
  color:var(--ink-dimmer);
  letter-spacing:.22em;
  text-transform:uppercase;
  margin-bottom:22px;
}
.vision-hero-title,
.vision-section-title,
.vision-future-title{
  font-size:clamp(58px, 10.4vw, 154px);
  line-height:.9;
  letter-spacing:-.045em;
  max-width:1080px;
  text-shadow:0 18px 54px rgba(0,0,0,.72), 0 0 2px rgba(0,0,0,.84);
}
.vision-hero-copy{
  color:rgba(236,237,237,.68);
  font-size:clamp(17px, 2vw, 24px);
  line-height:1.55;
  max-width:650px;
  margin-top:34px;
}
.vision-hero-panel .vision-wrap{
  padding-top:52px;
}
.vision-purpose-panel{
  justify-content:center;
  text-align:center;
}
.vision-purpose{
  width:min(1180px, calc(100% - 44px));
  margin:0 auto;
  position:relative;
}
.vision-purpose h2{
  font-size:clamp(38px, 6.8vw, 104px);
  line-height:1.02;
  letter-spacing:-.045em;
}
.vision-line{
  display:block;
  opacity:.18;
  transform:translateY(42px);
  filter:blur(10px);
}
.vision-split{
  display:grid;
  grid-template-columns:.82fr 1.18fr;
  gap:80px;
  align-items:center;
}
.vision-section-title{
  font-size:clamp(54px, 8vw, 118px);
}
.vision-thoughts{
  position:relative;
  min-height:360px;
}
.vision-thought{
  position:absolute;
  inset:0;
  display:flex;
  align-items:center;
  color:rgba(236,237,237,.78);
  font-family:'Sora',sans-serif;
  font-size:clamp(28px, 4.5vw, 72px);
  font-weight:650;
  line-height:1.02;
  letter-spacing:-.04em;
  opacity:0;
  transform:translate3d(0,44px,0);
  filter:blur(10px);
}
.vision-thought.is-first{ opacity:1; transform:none; filter:none; }
.vision-particles{
  position:absolute;
  inset:0;
  z-index:1;
  pointer-events:none;
}
.vision-particles span{
  position:absolute;
  width:3px;
  height:3px;
  border-radius:50%;
  background:rgba(255,255,255,.5);
  box-shadow:0 0 18px rgba(255,255,255,.32);
  animation:vision-particle-drift 12s ease-in-out infinite alternate;
}
.vision-particles span:nth-child(1){ left:12%; top:24%; animation-delay:-1s; }
.vision-particles span:nth-child(2){ left:32%; top:68%; animation-delay:-5s; }
.vision-particles span:nth-child(3){ left:52%; top:18%; animation-delay:-3s; }
.vision-particles span:nth-child(4){ left:70%; top:58%; animation-delay:-7s; }
.vision-particles span:nth-child(5){ left:84%; top:30%; animation-delay:-2s; }
.vision-particles span:nth-child(6){ left:42%; top:46%; animation-delay:-9s; }
@keyframes vision-particle-drift{
  from{ transform:translate3d(-10px, 12px, 0); opacity:.16; }
  to{ transform:translate3d(18px, -18px, 0); opacity:.72; }
}
.vision-mission-head{
  display:grid;
  grid-template-columns:.86fr 1fr;
  gap:72px;
  align-items:end;
  margin-bottom:72px;
}
.vision-mission-copy{
  color:rgba(236,237,237,.68);
  font-size:clamp(18px,2.4vw,30px);
  line-height:1.45;
  max-width:650px;
}
.mission-network{
  position:relative;
  min-height:430px;
  isolation:isolate;
}
.mission-network-lines,
.mission-ribbon-art{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.mission-network-lines{
  filter:drop-shadow(0 0 18px rgba(255,255,255,.08));
  z-index:2;
}
.mission-ribbon-art{
  z-index:1;
  opacity:.62;
  filter:drop-shadow(0 26px 64px rgba(0,0,0,.48));
  transform:translateX(4%);
}
.mission-ribbon-shadow,
.mission-ribbon-body,
.mission-ribbon-core,
.mission-ribbon-highlight{
  fill:none;
  stroke-linecap:round;
  stroke-linejoin:round;
}
.mission-ribbon-shadow{
  stroke:rgba(255,255,255,.04);
  stroke-width:78;
}
.mission-ribbon-body{
  stroke:rgba(224,229,226,.12);
  stroke-width:42;
}
.mission-ribbon-core{
  stroke:rgba(232,236,233,.16);
  stroke-width:24;
}
.mission-ribbon-highlight{
  stroke:rgba(255,255,255,.13);
  stroke-width:2.8;
  stroke-dasharray:52 26;
}
.mission-ribbon-highlight.short{
  stroke-width:2.4;
  opacity:.72;
}
.mission-line{
  fill:none;
  stroke:rgba(255,255,255,.23);
  stroke-width:1;
  stroke-dasharray:900;
  stroke-dashoffset:900;
}
.mission-line-b,
.mission-line-e{ stroke:rgba(0,82,46,.5); }
.mission-line-c{ stroke:rgba(151,27,41,.52); }
.mission-line-d{ stroke:rgba(255,255,255,.28); }
.mission-node{
  position:absolute;
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:164px;
  min-height:64px;
  padding:16px 28px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.16);
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,.22), transparent 34%),
    linear-gradient(145deg, rgba(255,255,255,.105), rgba(255,255,255,.018) 58%, rgba(255,255,255,.055));
  backdrop-filter:blur(20px) saturate(130%);
  -webkit-backdrop-filter:blur(20px) saturate(130%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.2),
    inset 0 -18px 34px rgba(0,0,0,.18),
    0 24px 80px rgba(0,0,0,.3);
  color:var(--ink);
  font-family:'Sora',sans-serif;
  font-size:15px;
  font-weight:750;
  letter-spacing:-.03em;
  opacity:0;
  transform:translateY(24px) scale(.94);
  z-index:3;
}
.mission-node::after{
  content:'';
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:
    linear-gradient(180deg, rgba(255,255,255,.22), transparent 34%),
    radial-gradient(circle at 50% 58%, rgba(255,255,255,.11), transparent 42%);
  pointer-events:none;
}
.node-a{ left:2.5%; top:11%; min-width:182px; }
.node-b{ left:44%; top:15%; min-width:182px; }
.node-c{ right:2.5%; top:12%; min-width:188px; }
.node-d{ left:16%; bottom:7%; min-width:182px; }
.node-e{ left:47%; bottom:25%; min-width:260px; }
.node-f{ right:3.5%; bottom:20%; min-width:138px; }
.vision-principles{
  position:relative;
  z-index:2;
  padding:18vh 0 10vh;
}
.principles-head{
  margin-bottom:90px;
}
.principle-card{
  width:min(1160px, calc(100% - 96px));
  min-height:76vh;
  margin:0 auto 12vh;
  padding:clamp(34px, 6vw, 86px);
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  border-radius:32px;
  overflow:visible;
  transform-style:preserve-3d;
}
.principle-card::before{
  content:'';
  position:absolute;
  inset:8% -6%;
  border-radius:50%;
  border:42px solid rgba(255,255,255,.78);
  filter:blur(.2px) drop-shadow(0 24px 60px rgba(255,255,255,.08));
  opacity:0;
  transform:rotate(-8deg) scale(.88);
  transition:opacity .7s var(--ease-luxe), transform .9s var(--ease-luxe);
  pointer-events:none;
  z-index:-1;
  mask-image:linear-gradient(90deg, transparent 4%, #000 18%, #000 82%, transparent 96%);
}
.principle-card:hover::before{
  opacity:.28;
  transform:rotate(7deg) scale(1);
}
.principle-card span{
  color:var(--ink-dimmer);
  letter-spacing:.22em;
}
.principle-card h3{
  font-size:clamp(48px, 9vw, 136px);
  line-height:.88;
  letter-spacing:-.06em;
  max-width:980px;
}
.principle-card p{
  max-width:540px;
  color:rgba(236,237,237,.62);
  font-size:clamp(16px,2vw,24px);
  line-height:1.5;
}
.principle-card:nth-of-type(2n)::after{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 12px rgba(0,0,0,.35), 0 0 70px rgba(151,27,41,.08);
}
.principle-card:nth-of-type(2n+1)::after{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18), inset 0 -1px 12px rgba(0,0,0,.35), 0 0 70px rgba(0,66,37,.08);
}
.vision-future-panel{
  min-height:112vh;
  justify-content:center;
  text-align:center;
}
.vision-future{
  width:min(1180px, calc(100% - 44px));
  margin:0 auto;
  display:flex;
  flex-direction:column;
  align-items:center;
}
.vision-future-title{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
  font-size:clamp(42px, 8vw, 128px);
}
.vision-future-title span{
  display:block;
  opacity:.18;
  transform:translateY(38px);
  filter:blur(9px);
}
.future-logo{
  margin:54px auto 28px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:14px;
  opacity:0;
  filter:blur(12px);
  transform:translateY(18px) scale(.92);
}
.future-logo svg{ width:48px; height:48px; }
.future-logo span{
  font-family:'Sora',sans-serif;
  font-size:clamp(34px,4vw,58px);
  font-weight:800;
}
.vision-final-copy{
  color:rgba(236,237,237,.62);
  font-size:clamp(17px,2vw,24px);
  margin-bottom:24px;
}
.vision-cta-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:54px;
  padding:0 30px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.2);
  background:linear-gradient(140deg, rgba(255,255,255,.16), rgba(255,255,255,.055));
  color:var(--ink);
  font-family:'Sora',sans-serif;
  font-size:13.5px;
  font-weight:700;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.22), 0 22px 60px rgba(0,0,0,.22);
}
.vision-reveal{
  opacity:0;
  transform:translateY(28px);
  filter:blur(8px);
}
@media (max-width:1050px){
  .nav-links{ gap:22px; }
  .vision-split,
  .vision-mission-head{ grid-template-columns:1fr; gap:34px; }
  .vision-thoughts{ min-height:420px; }
}
@media (max-width:720px){
  .vision-wrap{ width:calc(100% - 44px); }
  .vision-panel{ min-height:92vh; }
  .vision-hero-title,
  .vision-section-title,
  .vision-future-title{ letter-spacing:-.055em; }
  .mission-network{ min-height:620px; }
  .mission-network svg{ display:none; }
  .mission-node{ left:50% !important; right:auto !important; min-width:min(280px, 78vw); transform:translate(-50%, 24px) scale(.94); }
  .node-a{ top:0; }
  .node-b{ top:17%; }
  .node-c{ top:34%; }
  .node-d{ top:51%; bottom:auto; }
  .node-e{ top:68%; bottom:auto; }
  .node-f{ top:85%; bottom:auto; }
  .principle-card{ width:calc(100% - 44px); min-height:68vh; margin-bottom:8vh; border-radius:26px; }
  .principle-card::before{ border-width:24px; inset:18% -28%; }
}
@media (max-width:720px){
  .vision-thoughts{
    display:grid;
    gap:16px;
    min-height:auto;
  }
  .vision-thought{
    position:relative;
    inset:auto;
    min-height:auto;
    padding:18px 0;
  }
  .mission-network{
    display:grid;
    gap:14px;
    min-height:auto;
  }
  .mission-network svg,
  .mission-ribbon-art{
    display:none!important;
  }
  .mission-node{
    position:relative!important;
    left:auto!important;
    right:auto!important;
    top:auto!important;
    bottom:auto!important;
    width:100%;
    min-width:0;
  }
}
@media (max-width:720px){
  html{
    scroll-padding-top:118px;
  }
  body{
    cursor:auto;
  }
  .wrap{
    padding:0 18px;
  }
  header.nav{
    padding:12px 0;
  }
  header.nav .wrap{
    padding:0 12px;
  }
  .nav-inner{
    min-height:58px;
    padding:9px 12px;
    gap:12px;
    flex-wrap:wrap;
    border-radius:22px;
  }
  .brand{
    gap:8px;
    font-size:14px;
    min-width:0;
  }
  .brand svg{
    width:20px;
    height:20px;
    flex:0 0 20px;
  }
  .nav-links{
    padding-right:4px;
    padding-left:4px;
  }
  .nav-links a{
    font-size:12px;
  }
  .hero{
    height:100svh;
    min-height:560px;
    padding:122px 18px 56px;
  }
  .hero-content{
    gap:18px;
    padding-top:0;
  }
  .hero-mark{
    font-size:clamp(58px, 23vw, 104px);
  }
  .hero-tagline{
    max-width:310px;
    font-size:15.5px;
  }
  .hero-scroll{
    bottom:24px;
  }
  .statement{
    padding:110px 0 96px;
  }
  .statement-text{
    font-size:clamp(28px, 9vw, 44px);
    line-height:1.2;
  }
  .about{
    padding:10px 0 110px;
  }
  .about-facts{
    grid-template-columns:1fr;
  }
  .section-head{
    margin-bottom:34px;
    gap:18px;
  }
  .section-head h2{
    font-size:clamp(32px, 10vw, 46px);
  }
  .service-card{
    min-height:230px;
    padding:30px 24px;
  }
  .work{
    padding:28px 0 110px;
  }
  .project{
    height:auto;
    min-height:420px;
    border-radius:22px;
    margin-bottom:18px;
  }
  .project-info{
    padding:28px 22px;
    align-items:flex-start;
    flex-direction:column;
  }
  .project-tags{
    justify-content:flex-start;
  }
  .cta{
    padding:36px 0 96px;
  }
  .cta-panel{
    border-radius:24px;
    padding:46px 22px;
    gap:22px;
  }
  .cta-panel h2{
    font-size:clamp(34px, 11vw, 52px);
  }
  .cta-btn{
    width:100%;
    max-width:280px;
    min-height:54px;
    cursor:auto;
  }
  .catalogue,
  .catalogue.catalogue--static{
    min-height:auto;
    padding:96px 0 84px;
  }
  .catalogue-stage,
  .catalogue.catalogue--static .catalogue-stage{
    position:relative;
    height:auto;
    min-height:0;
    overflow:visible;
  }
  .catalogue-head,
  .catalogue.catalogue--static .catalogue-head{
    position:relative;
    z-index:3;
    display:grid;
    gap:18px;
    padding:0 18px 28px;
  }
  .catalogue-head h2{
    font-size:clamp(32px, 10vw, 46px);
  }
  .catalogue-head .section-desc{
    max-width:320px;
  }
  #catalogue-canvas,
  .catalogue-vignette,
  .catalogue-progress,
  .catalogue-skip{
    display:none!important;
  }
  .catalogue-projects,
  .catalogue.catalogue--static .catalogue-projects{
    position:relative;
    display:grid;
    grid-template-columns:1fr;
    gap:18px;
    width:auto;
    margin:0;
    padding:0 18px;
  }
  .catalogue-project,
  .catalogue.catalogue--static .catalogue-project{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    min-height:0;
    display:grid;
    grid-template-columns:1fr;
    gap:12px;
    transform:none!important;
    opacity:1!important;
    filter:none!important;
  }
  .catalogue-visual,
  .catalogue.catalogue--static .catalogue-visual{
    min-height:220px;
    border-radius:20px;
  }
  .catalogue-copy,
  .catalogue.catalogue--static .catalogue-copy{
    min-height:auto;
    padding:24px;
    border-radius:20px;
  }
  .catalogue-title{
    font-size:clamp(30px, 10vw, 42px);
  }
  .packages{
    padding:88px 0 112px;
    scroll-margin-top:96px;
  }
  .package-card{
    min-height:auto;
    padding:26px;
    border-radius:22px;
  }
  .package-card h3{
    margin:30px 0 14px;
  }
  .package-action{
    width:100%;
    min-height:48px;
    cursor:auto;
  }
  footer{
    padding:0 0 34px;
  }
  .footer-inner{
    align-items:flex-start;
    flex-direction:column;
  }
  .footer-meta{
    text-align:left;
  }
  .contact-modal__panel{
    width:100%;
  }
  .site-chat{
    left:12px;
    right:12px;
    bottom:12px;
  }
  .site-chat__launcher{
    min-width:104px;
    min-height:50px;
    margin-left:auto;
  }
  .site-chat__panel{
    width:100%;
    max-height:calc(100svh - 86px);
    overflow:auto;
  }
}
html{
    scroll-behavior: smooth;
}

/* ---------- flagship mobile composition ---------- */
@media (max-width:768px){
  :root{
    --mobile-gutter:clamp(16px, 5vw, 28px);
    --mobile-section:clamp(88px, 24vw, 132px);
  }
  html,
  body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }
  @supports (overflow:clip){
    html,
    body,
    main{ overflow-x:clip; }
  }
  body.nav-menu-open{
    overflow:hidden;
    touch-action:none;
  }
  main,
  section,
  .wrap,
  .nav-inner,
  .services-grid,
  .packages-grid,
  .catalogue-projects{
    min-width:0;
  }
  .wrap,
  .faq-wrap{
    width:100%;
    padding-right:var(--mobile-gutter);
    padding-left:var(--mobile-gutter);
  }
  .noise{ opacity:.026; }
  .ambient{
    background:
      radial-gradient(ellipse 92% 38% at 50% 0%, rgba(140,150,160,.09), transparent 66%),
      radial-gradient(ellipse 120% 48% at 50% 100%, rgba(60,65,72,.13), transparent 72%);
  }
  .reveal{
    transform:translate3d(0, 24px, 0);
    filter:none;
    will-change:transform, opacity;
  }

  header.nav{
    padding:calc(10px + env(safe-area-inset-top)) 0 0;
  }
  header.nav .wrap{ padding:0 10px; }
  .nav-inner.has-mobile-menu{
    min-height:60px;
    padding:9px 10px 9px 14px;
    gap:0;
    border-radius:22px;
    background:rgba(12,13,15,.78);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.08), 0 20px 48px -26px rgba(0,0,0,.9);
  }
  .brand{
    min-height:44px;
    font-size:14px;
  }
  .nav-toggle{
    width:44px;
    height:44px;
    flex:0 0 44px;
  }
  .has-mobile-menu .nav-links{
    padding-right:4px;
    padding-left:4px;
  }
  .nav-inner.has-mobile-menu.is-menu-open .nav-links{
    max-height:min(58vh, 430px);
    padding-top:10px;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .has-mobile-menu .nav-links a{
    display:flex;
    align-items:center;
    min-height:46px;
    padding:0 4px;
    font-size:13px;
  }
  .nav-inner.has-mobile-menu.is-menu-open > .nav-cta{
    min-height:48px;
    max-height:48px;
    margin-top:10px;
  }

  .hero{
    height:100svh;
    min-height:600px;
    max-height:920px;
    padding:112px var(--mobile-gutter) 76px;
    isolation:isolate;
  }
  #hero-canvas{
    opacity:.92;
    transform:translate3d(0, 0, 0);
  }
  .hero-glow{
    background:
      radial-gradient(circle at 50% 50%, rgba(180,186,192,.1), transparent 43%),
      linear-gradient(180deg, rgba(6,6,7,.08), transparent 22%, transparent 75%, rgba(6,6,7,.34));
  }
  .hero-content{
    width:100%;
    max-width:560px;
    gap:18px;
    padding-top:0;
    transform:translateZ(0);
  }
  .hero-eyebrow{
    max-width:270px;
    font-size:10px;
    line-height:1.5;
  }
  .hero-mark{
    max-width:100%;
    font-size:clamp(64px, 23vw, 108px);
    line-height:.9;
    white-space:nowrap;
  }
  .hero-tagline{
    max-width:320px;
    font-size:clamp(15px, 4.3vw, 18px);
    line-height:1.55;
  }
  .hero-scroll{
    bottom:calc(22px + env(safe-area-inset-bottom));
    gap:8px;
  }
  .scroll-line{ height:28px; }

  .statement{
    padding-top:var(--mobile-section);
    padding-bottom:var(--mobile-section);
  }
  .statement-text{
    max-width:620px;
    font-size:clamp(28px, 8.7vw, 48px);
    line-height:1.18;
    letter-spacing:-.035em;
  }
  .about{
    padding-top:10px;
    padding-bottom:var(--mobile-section);
  }
  .section-head{
    align-items:flex-start;
    margin-bottom:38px;
  }
  .section-head h2{
    font-size:clamp(38px, 11vw, 58px);
    line-height:.96;
  }
  .section-eyebrow{ margin-bottom:13px; }
  .about-grid{ gap:38px; }
  .about-text{
    max-width:650px;
    font-size:clamp(18px, 5vw, 23px);
    line-height:1.55;
  }
  .about-facts{
    grid-template-columns:repeat(2, minmax(0,1fr));
    border-radius:20px;
  }
  .fact{
    min-height:126px;
    padding:22px 18px;
  }
  .fact strong{
    display:block;
    font-size:16px;
    line-height:1.28;
  }

  .services{
    padding-top:16px;
    padding-bottom:var(--mobile-section);
  }
  .services-grid{
    grid-template-columns:repeat(2, minmax(0,1fr));
    gap:1px;
    border-radius:22px;
  }
  .service-card{
    min-height:258px;
    padding:26px 22px;
    transform:translateZ(0);
  }
  .service-icon{
    width:34px;
    height:34px;
  }
  .service-card h3{
    font-size:clamp(20px, 5.8vw, 27px);
    overflow-wrap:anywhere;
  }
  .service-list{
    font-size:12px;
    line-height:1.55;
  }

  .catalogue,
  .catalogue.catalogue--static{
    min-height:auto;
    padding:var(--mobile-section) 0;
    contain:layout paint;
  }
  .catalogue-stage,
  .catalogue.catalogue--static .catalogue-stage{
    position:relative;
    height:auto;
    min-height:0;
    overflow:visible;
    display:block;
  }
  .catalogue-head,
  .catalogue.catalogue--static .catalogue-head{
    position:relative;
    z-index:3;
    display:grid;
    gap:18px;
    padding:0 var(--mobile-gutter) 34px;
  }
  .catalogue-head h2{ font-size:clamp(38px, 11vw, 58px); }
  .catalogue-head .section-desc{
    max-width:520px;
    font-size:14px;
  }
  #catalogue-canvas,
  .catalogue-vignette,
  .catalogue-progress,
  .catalogue-skip{
    display:none!important;
  }
  .catalogue-projects,
  .catalogue.catalogue--static .catalogue-projects{
    position:relative;
    width:auto;
    display:grid;
    grid-template-columns:1fr;
    gap:22px;
    margin:0;
    padding:0 var(--mobile-gutter);
  }
  .catalogue-project,
  .catalogue.catalogue--static .catalogue-project{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    min-height:0;
    grid-template-columns:1fr;
    gap:0;
    opacity:1!important;
    filter:none!important;
    transform:none!important;
  }
  .catalogue-visual,
  .catalogue.catalogue--static .catalogue-visual{
    min-height:0;
    aspect-ratio:4 / 3;
    border-radius:22px 22px 0 0;
  }
  .catalogue-copy,
  .catalogue.catalogue--static .catalogue-copy{
    min-height:auto;
    padding:24px;
    border-radius:0 0 22px 22px;
    border-top:0;
  }
  .catalogue-title{
    margin:18px 0 12px;
    font-size:clamp(32px, 9.5vw, 48px);
  }
  .catalogue-summary{
    font-size:14px;
    line-height:1.6;
  }
  .catalogue-meta{
    align-items:center;
    flex-direction:row;
    margin-top:26px;
  }
  .catalogue-action{
    min-height:44px;
    padding:0 16px;
  }

  .packages{
    padding-top:var(--mobile-section);
    padding-bottom:var(--mobile-section);
    scroll-margin-top:90px;
  }
  .packages-grid{
    grid-template-columns:1fr;
    gap:16px;
  }
  .package-card{
    min-height:auto;
    padding:28px 24px 24px;
    border-radius:24px;
  }
  .package-card h3{
    margin:30px 0 14px;
    font-size:clamp(28px, 8vw, 40px);
  }
  .package-copy{
    font-size:14px;
    line-height:1.6;
  }
  .package-list{
    gap:10px;
    margin:28px 0 30px;
  }
  .package-action{
    width:100%;
    min-height:50px;
    cursor:auto;
  }
  .package-mark{
    width:42px;
    height:42px;
  }

  .marquee-wrap{
    padding:52px 0;
    contain:paint;
  }
  .marquee{
    gap:36px;
    animation-duration:28s;
  }
  .marquee span{
    gap:36px;
    font-size:clamp(25px, 8vw, 38px);
  }
  .marquee .dotsep{
    width:7px;
    height:7px;
  }

  .cta{
    padding-top:var(--mobile-section);
    padding-bottom:96px;
  }
  .cta-panel{
    min-height:520px;
    padding:52px 24px;
    gap:24px;
    border-radius:26px;
  }
  .cta-panel h2{
    font-size:clamp(38px, 11vw, 58px);
    line-height:.98;
  }
  .cta-btn{
    width:100%;
    max-width:310px;
    min-height:56px;
    padding:14px 24px;
    cursor:auto;
  }

  footer{ padding:0 var(--mobile-gutter) calc(28px + env(safe-area-inset-bottom)); }
  .footer-inner{
    align-items:flex-start;
    flex-direction:column;
    gap:28px;
  }
  .footer-links{
    gap:16px 24px;
  }
  .footer-links a{
    display:inline-flex;
    align-items:center;
    min-height:44px;
  }
  .footer-meta{
    text-align:left;
    line-height:1.65;
  }

  .site-chat{
    left:12px;
    right:12px;
    bottom:calc(12px + env(safe-area-inset-bottom));
  }
  .site-chat__launcher{
    min-width:108px;
    min-height:52px;
    margin-left:auto;
  }
  .site-chat__panel{
    right:0;
    bottom:64px;
    width:100%;
    max-height:calc(100svh - 96px - env(safe-area-inset-bottom));
    padding:20px;
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .site-chat__form input,
  .site-chat__form textarea,
  .contact-form input,
  .contact-form textarea{
    font-size:16px;
  }

  .faq-hero{
    min-height:88svh;
    padding-top:96px;
  }
  .faq-hero-title{
    font-size:clamp(52px, 17vw, 100px);
    line-height:.9;
  }
  .faq-hero-copy{
    margin-top:22px;
    font-size:16px;
  }
  .faq-controls-shell{
    position:relative;
    top:auto;
    margin:-42px 0 38px;
    padding:0 var(--mobile-gutter);
  }
  .faq-controls{
    grid-template-columns:1fr;
    padding:10px;
    border-radius:22px;
  }
  .faq-search{ min-height:48px; }
  .faq-filters{
    justify-content:flex-start;
    flex-wrap:wrap;
    overflow:visible;
  }
  .faq-filter{
    min-height:44px;
    cursor:auto;
  }
  .faq-list{
    gap:16px;
    padding-bottom:72px;
  }
  .faq-item{
    min-height:auto;
    padding:26px 20px;
    gap:18px;
    border-radius:22px;
  }
  .faq-question{
    align-items:center;
    flex-direction:row;
    gap:16px;
    min-height:44px;
    font-size:clamp(24px, 7.8vw, 38px);
    line-height:1.08;
    cursor:auto;
  }
  .faq-answer{ filter:none; }
  .faq-answer p{
    font-size:16px;
    line-height:1.65;
  }
  .faq-closing{ padding:40px var(--mobile-gutter) 120px; }
  .faq-cta-panel{
    min-height:520px;
    padding:34px 22px;
  }
  .faq-cta-panel h2{ font-size:clamp(42px, 13vw, 68px); }
  .faq-cta-btn{ min-height:50px; }

  #vision-ribbon-canvas{
    height:100svh;
    margin-bottom:-100svh;
    opacity:.48;
  }
  .vision-wrap{ width:calc(100% - (var(--mobile-gutter) * 2)); }
  .vision-panel{
    min-height:92svh;
    padding:84px 0 56px;
    overflow:visible;
  }
  .vision-hero-panel .vision-wrap{ padding-top:28px; }
  .vision-kicker{ margin-bottom:18px; }
  .vision-hero-title,
  .vision-section-title,
  .vision-future-title{
    font-size:clamp(48px, 15vw, 82px);
    line-height:.92;
    letter-spacing:-.055em;
  }
  .vision-hero-copy{
    margin-top:26px;
    font-size:16px;
  }
  .vision-purpose{ width:calc(100% - (var(--mobile-gutter) * 2)); }
  .vision-purpose h2{
    font-size:clamp(34px, 10.5vw, 56px);
    line-height:1.06;
  }
  .vision-split,
  .vision-mission-head{
    grid-template-columns:1fr;
    gap:32px;
  }
  .vision-thoughts{
    display:grid;
    gap:8px;
    min-height:auto;
  }
  .vision-thought{
    position:relative;
    inset:auto;
    min-height:120px;
    font-size:clamp(28px, 8.4vw, 44px);
  }
  .vision-mission-head{ margin-bottom:46px; }
  .vision-mission-copy{
    font-size:18px;
    line-height:1.55;
  }
  .mission-network{
    display:grid;
    gap:12px;
    min-height:auto;
  }
  .mission-network svg,
  .mission-ribbon-art{ display:none!important; }
  .mission-node{
    position:relative!important;
    inset:auto!important;
    width:100%;
    min-width:0;
    min-height:62px;
  }
  .vision-principles{ padding:90px 0 56px; }
  .principles-head{ margin-bottom:46px; }
  .principle-card{
    width:calc(100% - (var(--mobile-gutter) * 2));
    min-height:62svh;
    margin-bottom:34px;
    padding:34px 24px;
    border-radius:26px;
  }
  .principle-card::before{ display:none; }
  .principle-card h3{
    font-size:clamp(48px, 15vw, 78px);
    line-height:.9;
  }
  .principle-card p{
    font-size:16px;
    line-height:1.55;
  }
  .vision-future-panel{
    min-height:100svh;
    padding-bottom:100px;
  }
  .future-logo{
    margin:38px auto 22px;
  }
  .future-logo svg{
    width:38px;
    height:38px;
  }
  .vision-cta-btn{ min-height:52px; }
}

@media (max-width:520px){
  .services-grid{ grid-template-columns:1fr; gap:1px; }
  .service-card{ min-height:224px; }
  .about-facts{ grid-template-columns:1fr; }
  .fact{ min-height:108px; }
  .catalogue-meta{
    align-items:flex-start;
    flex-direction:column;
  }
  .catalogue-action{ width:100%; }
  .site-chat__identity{ grid-template-columns:1fr; }
  .site-chat__identity label:nth-child(3){ grid-column:auto; }
}

@media (max-width:360px){
  :root{ --mobile-gutter:14px; }
  .hero{ padding-right:14px; padding-left:14px; }
  .hero-mark{ font-size:clamp(58px, 22vw, 78px); }
  .nav-inner.has-mobile-menu{ padding-left:12px; }
  .cta-panel,
  .package-card,
  .catalogue-copy{ padding-right:20px; padding-left:20px; }
  .faq-item{ padding-right:18px; padding-left:18px; }
}

@media (hover:none), (pointer:coarse){
  a,
  button{ -webkit-tap-highlight-color:transparent; }
  .service-card:active,
  .package-card:active,
  .catalogue-project:active{
    transform:scale(.985);
  }
  .nav-toggle:active,
  .nav-cta:active,
  .cta-btn:active,
  .package-action:active,
  .faq-filter:active,
  .faq-cta-btn:active,
  .vision-cta-btn:active,
  .site-chat__launcher:active,
  .site-chat__send:active{
    transform:scale(.96);
  }
  .service-card:hover::before,
  .glass:hover::before{ opacity:0; }
}