/* =================================================================
   PLUTOBEE | DESIGN SYSTEM
   Honeycomb identity · Black / Yellow / White · Cinematic
================================================================= */

/* ---------- Tokens ---------- */
:root{
  --bg:var(--surf-0);
  --bg-elev:var(--surf-1);
  --bg-elev-2:var(--surf-2);
  --ink:#ffffff;
  --ink-dim:rgba(255,255,255,0.65);
  --ink-mute:rgba(255,255,255,0.45);
  --rule:rgba(255,255,255,0.08);

  --honey:#FFC107;
  --honey-2:#FFD54A;
  --amber:#FF8A00;
  --honey-glow:rgba(255,193,7,0.18);

  --light-bg:#f5f5f7;
  --light-ink:var(--surf-0);
  --light-dim:#5a5a60;
  --light-rule:rgba(0,0,0,0.08);

  --radius-sm:10px;
  --radius:18px;
  --radius-lg:28px;

  --ease-out:cubic-bezier(0.16,1,0.3,1);
  --ease-in-out:cubic-bezier(0.65,0,0.35,1);

  --container:1320px;
  --nav-h:64px;
}

/* ---------- Reset ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
html,body{background:var(--bg);color:var(--ink);overflow-x:hidden}
body{
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:16px;line-height:1.55;
  font-feature-settings:"ss01","cv11";
}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit}
::selection{background:var(--honey);color:var(--bg)}

/* ---------- Typography ---------- */
.font-display{font-family:'Space Grotesk','Inter',sans-serif;letter-spacing:-0.03em}
.eyebrow{
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;font-weight:500;
  letter-spacing:0.28em;text-transform:uppercase;
  color:var(--honey);
  display:inline-flex;align-items:center;gap:12px;
  margin-bottom:24px;
}
.eyebrow::before{
  content:"";width:24px;height:1px;background:var(--honey);
}
.section-title{
  font-family:'Space Grotesk',sans-serif;
  font-weight:700;
  font-size:clamp(36px,5vw,76px);
  line-height:1.02;
  letter-spacing:-0.035em;
  background:linear-gradient(180deg,var(--ink) 0%,#b8b8b8 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  max-width:14ch;
}
.section-title.long{max-width:24ch}
.section-lede{
  font-size:clamp(17px,1.3vw,20px);
  color:var(--ink-dim);
  max-width:62ch;margin-top:24px;
}
.section-light .section-title{
  background:linear-gradient(180deg,var(--surf-0),var(--ink-444));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.section-light .section-lede{color:var(--light-dim)}
.section-light .eyebrow{color:var(--amber)}
.section-light .eyebrow::before{background:var(--amber)}

/* ---------- Layout ---------- */
.container{max-width:var(--container);margin:0 auto;padding:140px 32px}
.container.tight{padding:90px 32px}
.section-light{background:var(--light-bg);color:var(--light-ink)}
.section-dark{background:var(--bg);color:var(--ink)}
.section-darker{background:var(--bg);color:var(--ink)}
@media (max-width:720px){.container{padding:90px 20px}}

/* ---------- Nav (mega menu) ---------- */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:var(--nav-h);
  padding:0 28px;
  display:flex;align-items:center;justify-content:space-between;gap:24px;
  background:rgba(10,10,10,0.72);
  backdrop-filter:blur(24px) saturate(180%);
  -webkit-backdrop-filter:blur(24px) saturate(180%);
  border-bottom:1px solid var(--rule);
  transition:background .4s var(--ease-out),color .4s var(--ease-out),border-color .4s var(--ease-out);
}
.nav-mega{display:flex;align-items:center;gap:4px;height:100%;flex:1;justify-content:center}
.nav-mega-item{position:relative;height:100%;display:flex;align-items:center}
.nav-mega-btn{
  display:inline-flex;align-items:center;gap:8px;
  height:100%;padding:0 14px;
  font-size:14px;font-weight:500;letter-spacing:0.01em;
  color:rgba(255,255,255,0.85);background:transparent;border:none;cursor:pointer;
  font-family:inherit;transition:color .2s;
  position:relative;
}
.nav-mega-btn .chev{
  width:10px;height:10px;display:inline-block;
  border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg) translate(-2px,-2px);
  opacity:0.55;transition:transform .25s var(--ease-out),opacity .2s;
}
.nav-mega-btn:hover,.nav-mega-item.open .nav-mega-btn{color:var(--honey)}
.nav-mega-item.open .nav-mega-btn .chev{transform:rotate(225deg) translate(-2px,-2px);opacity:1}
.nav-mega-btn::after{
  content:"";position:absolute;left:14px;right:14px;bottom:14px;height:1.5px;
  background:var(--honey);transform:scaleX(0);transform-origin:left;
  transition:transform .3s var(--ease-out);
}
.nav-mega-btn:hover::after,.nav-mega-item.open .nav-mega-btn::after{transform:scaleX(1)}

/* The mega panel that drops down */
.nav-panel{
  position:fixed;left:0;right:0;top:var(--nav-h);
  background:rgba(10,10,10,0.92);
  backdrop-filter:blur(28px) saturate(180%);
  -webkit-backdrop-filter:blur(28px) saturate(180%);
  border-bottom:1px solid var(--rule);
  padding:36px 32px 40px;
  opacity:0;visibility:hidden;transform:translateY(-8px);
  transition:opacity .25s var(--ease-out),visibility .25s,transform .25s var(--ease-out);
  z-index:99;
  box-shadow:0 24px 60px -10px rgba(0,0,0,0.7);
}
.nav-mega-item.open .nav-panel{opacity:1;visibility:visible;transform:translateY(0)}
.nav-panel-grid{
  max-width:var(--container);margin:0 auto;
  display:grid;grid-template-columns:repeat(3,1fr) 1.3fr;gap:32px;
}
@media (max-width:1000px){.nav-panel-grid{grid-template-columns:1fr 1fr;gap:32px}}
.nav-col h4{
  font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;
  letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);
  margin-bottom:14px;display:flex;align-items:center;gap:8px;
}
.nav-col h4::before{content:"";width:18px;height:1px;background:var(--honey);opacity:0.4}
.nav-col a{
  display:flex;align-items:center;gap:12px;
  padding:8px 0;color:var(--ink);font-size:14px;font-weight:500;
  transition:color .15s,padding-left .25s var(--ease-out);
  position:relative;
}
.nav-col a:hover{color:var(--honey);padding-left:6px}
.nav-col a .desc{display:block;font-size:12px;color:var(--ink-mute);font-weight:400;margin-top:1px;letter-spacing:0}
.nav-col a .ico{
  width:22px;height:22px;flex-shrink:0;display:grid;place-items:center;
  background:rgba(255,193,7,0.08);border-radius:6px;color:var(--honey);
  border:1px solid rgba(255,193,7,0.18);
}
.nav-col a .ico svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}
.nav-col a .new{
  display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;
  background:var(--honey);color:var(--surf-0);font-size:12px;font-weight:700;letter-spacing:0.12em;
}

.nav-feature{
  padding:22px 22px 24px;
  background:linear-gradient(180deg,rgba(255,193,7,0.08),rgba(255,193,7,0.02));
  border:1px solid rgba(255,193,7,0.22);border-radius:18px;
  position:relative;overflow:hidden;
  display:flex;flex-direction:column;
}
.nav-feature::before{
  content:"";position:absolute;top:-40px;right:-40px;width:160px;height:160px;
  background:radial-gradient(circle,rgba(255,193,7,0.18),transparent 60%);
}
.nav-feature .lbl{
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;
  text-transform:uppercase;color:var(--honey);font-weight:600;margin-bottom:8px;position:relative;
}
.nav-feature h5{
  font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;
  letter-spacing:-0.01em;color:var(--ink);margin-bottom:6px;position:relative;
}
.nav-feature p{font-size:13px;color:var(--ink-dim);line-height:1.55;margin-bottom:14px;position:relative}
.nav-feature a.arr-link{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;color:var(--honey);
  margin-top:auto;position:relative;
}
.nav-feature a.arr-link:hover{padding-left:4px}

.nav-backdrop{
  position:fixed;inset:var(--nav-h) 0 0 0;
  background:rgba(0,0,0,0.35);backdrop-filter:blur(2px);
  z-index:98;opacity:0;visibility:hidden;transition:opacity .25s,visibility .25s;
  pointer-events:none;
}
.nav-backdrop.show{opacity:1;visibility:visible;pointer-events:auto}
.nav.light{
  background:rgba(245,245,247,0.78);
  color:var(--light-ink);
  border-bottom:1px solid var(--light-rule);
}
.nav-logo{
  display:flex;align-items:center;gap:12px;
  font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:18px;
  letter-spacing:-0.02em;
}
.nav-logo svg{width:28px;height:28px}
.nav-links{display:flex;gap:32px;font-size:14px;font-weight:500;opacity:0.88}
.nav-links a{position:relative;padding:6px 0;transition:opacity .2s}
.nav-links a:hover{opacity:0.55}
.nav-links a::after{
  content:"";position:absolute;left:0;right:0;bottom:-2px;height:1px;
  background:var(--honey);transform:scaleX(0);transform-origin:left;
  transition:transform .35s var(--ease-out);
}
.nav-links a:hover::after,.nav-links a.active::after{transform:scaleX(1)}
.nav-cta{
  font-size:13px;font-weight:600;
  padding:9px 18px;border-radius:999px;
  background:var(--honey);color:var(--surf-0);
  display:inline-flex;align-items:center;gap:8px;
  transition:transform .2s,box-shadow .3s;
  box-shadow:0 0 0 0 var(--honey-glow);
}
.nav-cta:hover{transform:scale(1.04);box-shadow:0 0 28px 0 var(--honey-glow)}
.nav.light .nav-cta{background:var(--surf-0);color:var(--ink)}
.nav.light .nav-mega-btn{color:rgba(10,10,10,0.78)}
.nav.light .nav-mega-btn:hover,.nav.light .nav-mega-item.open .nav-mega-btn{color:var(--amber)}
.nav.light .nav-panel{background:rgba(245,245,247,0.95);border-bottom:1px solid var(--light-rule)}
.nav.light .nav-panel a{color:var(--surf-0)}
.nav.light .nav-panel h4{color:var(--amber)}
.nav.light .nav-panel a:hover{color:var(--amber)}
.nav-mobile-btn{display:none;width:36px;height:36px;align-items:center;justify-content:center;border-radius:6px;background:rgba(255,255,255,0.06)}
.nav-mobile-btn span{display:block;width:18px;height:1.5px;background:currentColor;position:relative}
.nav-mobile-btn span::before,.nav-mobile-btn span::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor}
.nav-mobile-btn span::before{top:-6px}
.nav-mobile-btn span::after{top:6px}
@media (max-width:880px){
  .nav-links,.nav-mega{display:none}
  .nav-mobile-btn{display:flex}
}
@media (max-width:480px){
  .nav-cta span{display:none}
}

.nav-drawer{
  position:fixed;inset:var(--nav-h) 0 0 0;z-index:99;
  background:rgba(10,10,10,0.98);
  backdrop-filter:blur(30px);-webkit-backdrop-filter:blur(30px);
  padding:40px 32px;
  overflow-y:auto;
  opacity:0;visibility:hidden;pointer-events:none;
  transition:opacity .35s var(--ease-out),visibility .35s;
}
.nav-drawer.open{opacity:1;visibility:visible;pointer-events:auto}
.nav-drawer-section{margin-bottom:18px}
.nav-drawer-section h5{font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.nav-drawer-section h5::before{content:"";width:18px;height:1px;background:var(--honey);opacity:0.4}
.nav-drawer a{display:flex;justify-content:space-between;align-items:center;font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:500;padding:11px 0;border-bottom:1px solid var(--rule);color:var(--ink)}
.nav-drawer a:hover{color:var(--honey)}
.nav-drawer a.primary{color:var(--honey);font-weight:600}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex;align-items:center;gap:8px;
  padding:14px 26px;border-radius:999px;
  font-size:14px;font-weight:600;
  transition:transform .2s,background .3s,color .3s,box-shadow .3s;
}
.btn .arr{display:inline-block;transition:transform .3s var(--ease-out)}
.btn:hover .arr{transform:translateX(4px)}
.btn-primary{background:var(--honey);color:var(--surf-0)}
.btn-primary:hover{transform:scale(1.03);box-shadow:0 12px 40px -8px var(--honey-glow)}
.btn-dark{background:var(--surf-0);color:var(--ink)}
.btn-dark:hover{transform:scale(1.03)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid rgba(255,255,255,0.22)}
.btn-ghost:hover{background:rgba(255,255,255,0.06)}
.section-light .btn-ghost{color:var(--surf-0);border-color:rgba(0,0,0,0.15)}
.section-light .btn-ghost:hover{background:rgba(0,0,0,0.04)}

/* ---------- Reveal animation ---------- */
.reveal{opacity:0;transform:translateY(40px);transition:opacity .9s var(--ease-out),transform .9s var(--ease-out)}
.reveal.in{opacity:1;transform:none}
.reveal[data-delay="1"]{transition-delay:.08s}
.reveal[data-delay="2"]{transition-delay:.16s}
.reveal[data-delay="3"]{transition-delay:.24s}
.reveal[data-delay="4"]{transition-delay:.32s}
.reveal[data-delay="5"]{transition-delay:.4s}
.reveal[data-delay="6"]{transition-delay:.48s}

/* ---------- Hex pattern (proper tessellating honeycomb) ---------- */
.hex-bg{
  position:absolute;inset:0;pointer-events:none;
  background-image:
    radial-gradient(circle at 50% 50%,rgba(255,193,7,0.05) 0,transparent 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='78' viewBox='0 0 90 78'><g fill='none' stroke='%23ffffff' stroke-opacity='0.06' stroke-width='1'><polygon points='22.5,0 45,13 45,39 22.5,52 0,39 0,13'/><polygon points='67.5,0 90,13 90,39 67.5,52 45,39 45,13'/><polygon points='45,39 67.5,52 67.5,78 45,91 22.5,78 22.5,52'/><polygon points='0,39 22.5,52 22.5,78 0,91 -22.5,78 -22.5,52'/><polygon points='90,39 112.5,52 112.5,78 90,91 67.5,78 67.5,52'/></g></svg>");
  background-size:auto,90px 78px;
  background-position:center,0 0;
  background-repeat:no-repeat,repeat;
  mask-image:radial-gradient(circle at 50% 40%,var(--bg) 0,var(--bg) 50%,transparent 78%);
  -webkit-mask-image:radial-gradient(circle at 50% 40%,var(--bg) 0,var(--bg) 50%,transparent 78%);
}
.section-light .hex-bg{
  background-image:
    radial-gradient(circle at 50% 50%,rgba(255,138,0,0.04) 0,transparent 70%),
    url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='90' height='78' viewBox='0 0 90 78'><g fill='none' stroke='%23000' stroke-opacity='0.05' stroke-width='1'><polygon points='22.5,0 45,13 45,39 22.5,52 0,39 0,13'/><polygon points='67.5,0 90,13 90,39 67.5,52 45,39 45,13'/><polygon points='45,39 67.5,52 67.5,78 45,91 22.5,78 22.5,52'/><polygon points='0,39 22.5,52 22.5,78 0,91 -22.5,78 -22.5,52'/><polygon points='90,39 112.5,52 112.5,78 90,91 67.5,78 67.5,52'/></g></svg>");
}

/* ---------- HERO ---------- */
.hero{position:relative;height:100vh;min-height:640px;background:var(--bg);overflow:hidden}
.hero-sticky{position:absolute;inset:0;width:100%;height:100%;overflow:hidden}
#heroCanvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.hero-vignette{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at center,transparent 35%,rgba(0,0,0,0.6) 100%);
}
.hero-overlay{
  position:absolute;inset:0;
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  text-align:center;padding:0 24px;pointer-events:none;
}
.hero-actcounter{
  position:absolute;top:calc(var(--nav-h) + 28px);left:32px;
  font-family:'Space Grotesk',monospace;
  font-size:12px;letter-spacing:0.3em;text-transform:uppercase;
  color:var(--ink-mute);display:flex;gap:16px;align-items:center;
  z-index:5;
}
.hero-actcounter .dots{display:flex;gap:8px}
.hero-actcounter .dot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,0.15);transition:background .4s}
.hero-actcounter .dot.on{background:var(--honey);box-shadow:0 0 10px var(--honey)}

.hero-eyebrow{
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;font-weight:500;letter-spacing:0.32em;text-transform:uppercase;
  color:var(--honey);margin-bottom:24px;
  opacity:0;transform:translateY(20px);
}

/* Brand reveal: SVG bee mark + plutobee wordmark (with hex 'o') */
.hero-mark{
  width:clamp(96px,12vw,148px);
  margin:0 auto 14px;
  opacity:0;
  transform:scale(0.6);
  filter:drop-shadow(0 0 18px rgba(255,193,7,0.0));
  will-change:opacity,transform,filter;
}
.hero-mark-svg{width:100%;height:auto;display:block}
.hero-wordmark{
  display:inline-flex;align-items:center;justify-content:center;gap:4px;
  font-family:'Space Grotesk',sans-serif;
  font-weight:500;
  font-size:clamp(22px,2.6vw,34px);
  letter-spacing:-0.02em;
  color:var(--ink);
  margin:0 auto 28px;
  opacity:0;
  transform:translateY(8px);
}
.hero-wordmark span{display:inline-block;line-height:1}
.hero-wordmark-hex{
  width:0.85em;height:0.74em;
  display:inline-block;
  margin:0 1px;
  transform:translateY(-0.04em);
}
.hero-title{
  font-family:'Space Grotesk',sans-serif;font-weight:700;
  font-size:clamp(56px,11vw,168px);
  line-height:0.95;letter-spacing:-0.045em;
  background:linear-gradient(180deg,var(--ink) 0%,#a8a8a8 100%);
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  opacity:0;transform:translateY(40px);
}
.hero-title em{font-style:normal;background:linear-gradient(135deg,var(--honey),var(--amber));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.hero-subtitle{
  margin-top:28px;max-width:640px;
  font-size:clamp(16px,1.5vw,20px);color:rgba(255,255,255,0.7);
  opacity:0;transform:translateY(20px);
}
.hero-cta{
  margin-top:36px;opacity:0;transform:translateY(20px);
  pointer-events:auto;
}
.hero-scrollhint{
  position:absolute;bottom:28px;left:50%;transform:translateX(-50%);
  font-family:'Space Grotesk',sans-serif;
  font-size:12px;letter-spacing:0.35em;text-transform:uppercase;
  color:var(--ink-mute);animation:bob 2.4s ease-in-out infinite;
}
@keyframes bob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}
.hero-audio{
  position:absolute;top:calc(var(--nav-h) + 28px);right:32px;z-index:5;
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.25em;text-transform:uppercase;
  color:var(--ink-mute);padding:8px 14px;border-radius:999px;
  border:1px solid rgba(255,255,255,0.12);
  background:rgba(255,255,255,0.04);
  cursor:pointer;transition:color .3s,border-color .3s;
}
.hero-audio:hover{color:var(--honey);border-color:var(--honey)}
.hero-audio .bars{display:inline-flex;align-items:center;gap:4px;height:12px}
.hero-audio .bars i{display:block;width:2px;background:currentColor;height:4px;border-radius:6px}
.hero-audio.on .bars i{animation:vu 1s ease-in-out infinite}
.hero-audio.on .bars i:nth-child(2){animation-delay:.15s}
.hero-audio.on .bars i:nth-child(3){animation-delay:.3s}
.hero-audio.on .bars i:nth-child(4){animation-delay:.45s}
@keyframes vu{0%,100%{height:4px}50%{height:11px}}

.hero-replay{
  position:absolute;bottom:28px;right:32px;z-index:5;
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.25em;text-transform:uppercase;
  color:var(--ink-mute);padding:8px 14px;border-radius:999px;
  border:1px solid rgba(255,255,255,0.12);background:rgba(255,255,255,0.04);
  cursor:pointer;transition:color .3s,border-color .3s;
}
.hero-replay:hover{color:var(--honey);border-color:var(--honey)}
.hero-replay svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2}
@media (max-width:520px){
  .hero-audio,.hero-actcounter{display:none}
}

/* ---------- Service cards ---------- */
.services-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:80px}
@media (max-width:960px){.services-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.services-grid{grid-template-columns:1fr}}
.service-card{
  position:relative;
  padding:34px 30px;border-radius:24px;
  background:linear-gradient(180deg,var(--surf-2) 0%,var(--surf-1) 100%);
  border:1px solid rgba(255,255,255,0.06);
  overflow:hidden;
  transition:transform .4s var(--ease-out),border-color .4s;
  min-height:340px;
  display:flex;flex-direction:column;justify-content:space-between;
}
.service-card::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(600px circle at var(--mx,50%) var(--my,0%),rgba(255,193,7,0.13),transparent 40%);
  opacity:0;transition:opacity .4s;pointer-events:none;
}
.service-card:hover{transform:translateY(-4px);border-color:rgba(255,193,7,0.3)}
.service-card:hover::before{opacity:1}
.service-card .hex-icon{
  width:52px;height:52px;display:grid;place-items:center;margin-bottom:24px;
  background:rgba(255,193,7,0.1);
  clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);
  position:relative;
}
.service-card .hex-icon::after{
  content:"";position:absolute;inset:1px;
  background:var(--surf-1);
  clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);
}
.service-card .hex-icon svg{position:relative;width:24px;height:24px;stroke:var(--honey);fill:none;stroke-width:1.7;z-index:1}
.service-title{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;letter-spacing:-0.01em;margin-bottom:12px}
.service-desc{font-size:14px;line-height:1.55;color:rgba(255,255,255,0.62)}
.service-tag{margin-top:24px;font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:rgba(255,193,7,0.75)}

/* ---------- Product cards ---------- */
.products-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:80px}
@media (max-width:880px){.products-grid{grid-template-columns:1fr}}
.product-card{
  position:relative;padding:42px 36px;border-radius:24px;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid rgba(255,255,255,0.06);
  min-height:360px;
  display:flex;flex-direction:column;justify-content:space-between;
  overflow:hidden;transition:transform .4s var(--ease-out),border-color .4s;
}
.product-card:hover{transform:translateY(-4px);border-color:rgba(255,193,7,0.3)}
.product-card .glow{position:absolute;top:-100px;right:-100px;width:340px;height:340px;border-radius:50%;background:radial-gradient(circle,var(--honey-glow),transparent 60%);pointer-events:none}
.product-card .badge{display:inline-flex;align-items:center;gap:8px;padding:5px 11px;border-radius:999px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;letter-spacing:0.18em;text-transform:uppercase;background:rgba(255,193,7,0.1);color:var(--honey);border:1px solid rgba(255,193,7,0.25)}
.product-card .badge.beta{background:rgba(255,255,255,0.04);color:var(--ink-dim);border-color:var(--rule)}
.product-card h3{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;letter-spacing:-0.02em;margin:16px 0 10px}
.product-card .url{font-family:'Space Grotesk',monospace;font-size:13px;color:var(--honey);letter-spacing:0.03em;margin-bottom:18px}
.product-card .desc{font-size:14px;line-height:1.55;color:var(--ink-dim);max-width:48ch}
.product-card .open{margin-top:24px;display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:600;color:var(--ink)}
.product-card .open .arr{transition:transform .3s var(--ease-out)}
.product-card:hover .open .arr{transform:translateX(4px)}

/* ---------- Partners ---------- */
.partners-wrap{margin-top:60px}
.partners-row{
  display:grid;grid-template-columns:repeat(6,1fr);gap:16px;
  align-items:stretch;
}
@media (max-width:960px){.partners-row{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.partners-row{grid-template-columns:repeat(2,1fr)}}
.partner-tile{
  display:grid;place-items:center;
  height:96px;border-radius:12px;
  background:rgba(255,255,255,0.03);
  border:1px solid var(--rule);
  font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;
  color:rgba(255,255,255,0.7);letter-spacing:0.01em;
  transition:background .3s,color .3s,border-color .3s;
}
.partner-tile:hover{background:rgba(255,193,7,0.06);color:var(--ink);border-color:rgba(255,193,7,0.3)}
.section-light .partner-tile{background:var(--ink);border-color:var(--light-rule);color:var(--light-dim)}
.section-light .partner-tile:hover{color:var(--surf-0);border-color:rgba(255,138,0,0.4)}

.marquee{margin-top:30px;overflow:hidden;position:relative;mask-image:linear-gradient(90deg,transparent,var(--bg) 8%,var(--bg) 92%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,var(--bg) 8%,var(--bg) 92%,transparent)}
.marquee-track{display:flex;gap:64px;animation:marquee 30s linear infinite;width:max-content}
.marquee-track span{font-family:'Space Grotesk',sans-serif;font-size:18px;color:var(--ink-mute);letter-spacing:0.02em;display:inline-flex;align-items:center;gap:64px}
.marquee-track span::after{content:"❋";color:var(--honey);font-size:12px}
@keyframes marquee{0%{transform:translateX(0)}100%{transform:translateX(-50%)}}

/* ---------- Stats ---------- */
.stats-grid{margin-top:80px;display:grid;grid-template-columns:repeat(4,1fr);gap:32px}
@media (max-width:720px){.stats-grid{grid-template-columns:repeat(2,1fr)}}
.stat{padding:36px 24px 32px;border-top:1px solid var(--rule)}
.stat-num{
  font-family:'Space Grotesk',sans-serif;
  font-size:clamp(48px,6vw,92px);font-weight:700;letter-spacing:-0.045em;line-height:1;
  background:linear-gradient(180deg,var(--ink),var(--ink-888));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.stat-label{margin-top:12px;font-size:14px;color:var(--ink-mute);letter-spacing:0.02em}

/* ---------- Offices ---------- */
.offices-wrap{margin-top:80px;display:grid;grid-template-columns:1.6fr 1fr;gap:48px;align-items:center}
@media (max-width:960px){.offices-wrap{grid-template-columns:1fr;gap:32px}}
.map-frame{position:relative;width:100%;aspect-ratio:2/1;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,var(--light-bg) 0%,#f0f0f3 100%);border:1px solid var(--light-rule);box-shadow:0 24px 70px -10px rgba(0,0,0,0.1)}
#worldMap{width:100%;height:100%;display:block;cursor:default}
#worldMap .land{fill:#dcdce0;stroke:#cdcdd2;stroke-width:0.5;transition:fill .3s}
#worldMap .land.hl{fill:#c8c8cd}
#worldMap .graticule{fill:none;stroke:rgba(0,0,0,0.04);stroke-width:0.5;stroke-dasharray:2 3}
#worldMap .marker{cursor:pointer}
#worldMap .marker .ring{
  transform-origin:center;transform-box:fill-box;
  animation:mapPulse 2.4s ease-out infinite;
  fill:var(--honey);
}
#worldMap .marker.hq .ring{fill:var(--amber);animation-duration:2s}
#worldMap .marker .dot{fill:var(--honey);stroke:var(--surf-0);stroke-width:1.2;transition:r .25s ease,fill .25s ease}
#worldMap .marker.hq .dot{fill:var(--amber);stroke-width:1.5}
#worldMap .marker:hover .dot{r:9;fill:var(--honey)}
#worldMap .marker.active .dot{r:10}
#worldMap .marker .label{
  font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;
  letter-spacing:0.08em;text-transform:uppercase;fill:var(--surf-0);
  paint-order:stroke;stroke:var(--ink);stroke-width:3;
  pointer-events:none;
  opacity:0;transition:opacity .25s;
}
#worldMap .marker:hover .label,#worldMap .marker.active .label{opacity:1}
@keyframes mapPulse{
  0%{transform:scale(0.4);opacity:0.85}
  100%{transform:scale(4.5);opacity:0}
}

/* Tooltip card */
.map-tooltip{
  position:absolute;pointer-events:none;
  background:var(--surf-0);color:var(--ink);
  border-radius:12px;padding:18px 22px;
  min-width:240px;
  box-shadow:0 24px 60px -10px rgba(0,0,0,0.5),0 0 0 1px rgba(255,193,7,0.18);
  opacity:0;transform:translate(-50%,calc(-100% - 22px));
  transition:opacity .2s ease;
  z-index:5;
}
.map-tooltip.show{opacity:1}
.map-tooltip::after{
  content:"";position:absolute;left:50%;bottom:-7px;
  width:14px;height:14px;background:var(--surf-0);transform:translateX(-50%) rotate(45deg);
  border-bottom-right-radius:3px;
  box-shadow:1px 1px 0 0 rgba(255,193,7,0.18);
}
.mt-eyebrow{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--honey);margin-bottom:8px;display:flex;align-items:center;gap:8px}
.mt-hq{display:inline-block;padding:1px 7px;border-radius:999px;background:var(--honey);color:var(--surf-0);font-size:12px;font-weight:700;letter-spacing:0.15em}
.mt-city{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;letter-spacing:-0.01em;color:var(--ink);line-height:1.15}
.mt-country{font-size:12px;color:rgba(255,255,255,0.55);margin-top:2px}
.mt-grid{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.08);display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mt-grid .k{font-size:12px;letter-spacing:0.15em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-bottom:3px}
.mt-grid .v{font-family:'Space Grotesk',sans-serif;font-size:14px;color:var(--ink);font-weight:500}
.mt-time{font-family:'Space Grotesk',monospace;font-size:20px;font-weight:600;color:var(--honey);letter-spacing:-0.01em}
.mt-roles{margin-top:10px;font-size:12px;color:rgba(255,255,255,0.7);line-height:1.4}

.map-legend{position:absolute;left:18px;bottom:18px;display:flex;gap:12px;font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--light-dim);align-items:center;background:rgba(255,255,255,0.85);backdrop-filter:blur(8px);padding:7px 12px;border-radius:999px;border:1px solid rgba(0,0,0,0.05)}
.map-legend .sw{display:inline-flex;align-items:center;gap:4px}
.map-legend .sw i{display:inline-block;width:8px;height:8px;border-radius:50%}
.map-legend .sw.hq i{background:var(--amber)}
.map-legend .sw.of i{background:var(--honey)}
.map-coords{position:absolute;right:18px;bottom:18px;font-family:'JetBrains Mono','Space Grotesk',monospace;font-size:12px;color:var(--light-dim);background:rgba(255,255,255,0.85);backdrop-filter:blur(8px);padding:7px 10px;border-radius:6px;border:1px solid rgba(0,0,0,0.05)}
.office-list{display:grid;gap:16px}
.office-item{display:flex;align-items:center;gap:16px;padding:18px 20px;background:var(--ink);border-radius:12px;border:1px solid var(--light-rule);transition:transform .3s,box-shadow .3s}
.office-item:hover{transform:translateX(4px);box-shadow:0 8px 30px rgba(0,0,0,0.06)}
.office-item.hq{border-color:rgba(255,138,0,0.35);box-shadow:0 6px 24px rgba(255,138,0,0.08)}
.office-flag{width:38px;height:38px;display:grid;place-items:center;background:linear-gradient(135deg,var(--honey),var(--amber));color:var(--surf-0);font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:13px;flex-shrink:0;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%)}
.office-name{font-weight:600;font-size:16px}
.office-meta{font-size:13px;color:var(--light-dim);margin-top:2px}
.office-name .hq-pill{display:inline-block;margin-left:8px;padding:2px 8px;border-radius:999px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.15em;background:var(--honey);color:var(--surf-0)}

/* ---------- Final CTA ---------- */
.cta-card{
  margin-top:60px;padding:80px 60px;border-radius:24px;
  background:radial-gradient(circle at 20% 0%,rgba(255,193,7,0.25),transparent 50%),radial-gradient(circle at 80% 100%,rgba(255,138,0,0.18),transparent 50%),linear-gradient(135deg,var(--surf-2),var(--surf-1));
  color:var(--ink);text-align:center;position:relative;overflow:hidden;
  border:1px solid rgba(255,193,7,0.2);
}
.cta-card::before{
  content:"";position:absolute;inset:0;
  background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='60' height='52' viewBox='0 0 60 52'><polygon points='30,0 52.5,13 52.5,39 30,52 7.5,39 7.5,13' fill='none' stroke='%23ffc107' stroke-opacity='0.07' stroke-width='1'/></svg>");
  background-size:60px 52px;mask-image:radial-gradient(circle at 50% 50%,var(--bg) 0,var(--bg) 40%,transparent 70%);-webkit-mask-image:radial-gradient(circle at 50% 50%,var(--bg) 0,var(--bg) 40%,transparent 70%);
  pointer-events:none;
}
.cta-content{position:relative;z-index:1}
.cta-card h3{font-family:'Space Grotesk',sans-serif;font-size:clamp(36px,5vw,64px);font-weight:700;letter-spacing:-0.03em;line-height:1.05;background:linear-gradient(180deg,var(--ink),#c8c8c8);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.cta-card .cta-sub{margin-top:18px;font-size:18px;color:rgba(255,255,255,0.72)}
.cta-actions{margin-top:36px;display:flex;gap:16px;justify-content:center;flex-wrap:wrap}

/* ---------- Footer ---------- */
footer{background:var(--bg);color:var(--ink-dim);padding:80px 32px 40px;border-top:1px solid var(--rule);position:relative;overflow:hidden}
.footer-inner{max-width:var(--container);margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr 1fr 0.9fr 0.9fr;gap:32px;align-items:start}
@media (max-width:1100px){.footer-inner{grid-template-columns:1.6fr 1fr 1fr;gap:32px}.footer-col:nth-child(n+5){grid-column:span 1}}
@media (max-width:720px){.footer-inner{grid-template-columns:1fr 1fr;gap:32px}}
@media (max-width:460px){.footer-inner{grid-template-columns:1fr}}
.footer-brand{display:flex;align-items:center;gap:12px;font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:20px;color:var(--ink);letter-spacing:-0.02em}
.footer-brand svg{width:28px;height:28px}
.footer-tag{margin-top:14px;font-size:14px;max-width:320px;line-height:1.55}
/* footer-newsletter v1 removed — superseded by v2 block below */
.footer-col h4{font-size:12px;text-transform:uppercase;letter-spacing:0.22em;color:var(--ink);margin-bottom:18px;font-weight:600}
.footer-col a{display:block;margin-bottom:10px;font-size:14px;transition:color .2s}
.footer-col a:hover{color:var(--honey)}
.footer-bottom{max-width:var(--container);margin:60px auto 0;padding-top:24px;border-top:1px solid var(--rule);display:flex;justify-content:space-between;font-size:12px;flex-wrap:wrap;gap:12px;color:var(--ink-mute)}

/* ---------- Floating CTA (persistent conversion) ---------- */
.float-cta{
  position:fixed;bottom:24px;right:24px;z-index:90;
  display:inline-flex;align-items:center;gap:12px;
  padding:14px 22px;border-radius:999px;
  background:var(--honey);color:var(--surf-0);font-weight:600;font-size:14px;
  box-shadow:0 18px 50px -10px rgba(255,193,7,0.5);
  transition:transform .3s var(--ease-out),box-shadow .3s;
  opacity:0;transform:translateY(20px);pointer-events:none;
}
.float-cta.show{opacity:1;transform:translateY(0);pointer-events:auto}
.float-cta:hover{transform:translateY(-4px) scale(1.04)}
.float-cta .pulse-dot{position:relative;width:8px;height:8px;border-radius:50%;background:var(--surf-0)}
.float-cta .pulse-dot::after{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid var(--surf-0);animation:floatPulse 1.6s ease-out infinite}
@keyframes floatPulse{0%{transform:scale(0.5);opacity:1}100%{transform:scale(2);opacity:0}}
@media (max-width:480px){.float-cta span.label{display:none}}

/* ---------- Generic page header (for sub-pages) ---------- */
.page-header{position:relative;padding:calc(var(--nav-h) + 100px) 32px 80px;text-align:center;overflow:hidden;background:var(--bg)}
.page-header h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(48px,8vw,128px);letter-spacing:-0.04em;line-height:1;background:linear-gradient(180deg,var(--ink),var(--ink-888));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.page-header p{margin:28px auto 0;max-width:640px;color:var(--ink-dim);font-size:clamp(16px,1.4vw,20px)}
.page-header .eyebrow{justify-content:center}

/* ---------- Trust strip ---------- */
.trust-strip{padding:36px 32px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:#070707}
.trust-strip-inner{max-width:var(--container);margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:32px;flex-wrap:wrap}
.trust-strip-label{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.3em;text-transform:uppercase;color:var(--ink-mute)}
.trust-strip-logos{display:flex;gap:32px;align-items:center;flex-wrap:wrap;color:rgba(255,255,255,0.55);font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;letter-spacing:0.02em}

/* ---------- Form ---------- */
.intake{
  max-width:760px;margin:60px auto 0;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-1));
  border:1px solid var(--rule);border-radius:24px;
  padding:48px 44px;
}
@media (max-width:640px){.intake{padding:32px 22px}}
.intake-steps{display:flex;gap:8px;margin-bottom:28px}
.intake-steps .step{flex:1;height:4px;border-radius:6px;background:rgba(255,255,255,0.08)}
.intake-steps .step.on{background:var(--honey)}
.intake-step{display:none}
.intake-step.active{display:block;animation:fadeIn .4s var(--ease-out)}
@keyframes fadeIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.intake h3{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:600;letter-spacing:-0.02em;margin-bottom:8px}
.intake p.hint{color:var(--ink-mute);font-size:14px;margin-bottom:24px}
.option-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:26px}
@media (max-width:520px){.option-grid{grid-template-columns:1fr}}
.option{
  padding:18px 18px;border-radius:12px;
  background:rgba(255,255,255,0.03);border:1px solid var(--rule);
  display:flex;align-items:center;gap:12px;font-size:14px;font-weight:500;
  cursor:pointer;transition:border-color .25s,background .25s;
}
.option:hover{border-color:rgba(255,193,7,0.3)}
.option.selected{border-color:var(--honey);background:rgba(255,193,7,0.08)}
.option .dot{width:14px;height:14px;border-radius:50%;border:1.5px solid rgba(255,255,255,0.3);flex-shrink:0;display:grid;place-items:center}
.option.selected .dot{border-color:var(--honey)}
.option.selected .dot::after{content:"";width:7px;height:7px;border-radius:50%;background:var(--honey)}
.field{margin-bottom:18px}
.field label{display:block;font-size:13px;color:var(--ink-dim);margin-bottom:8px;font-family:'Space Grotesk',sans-serif;letter-spacing:0.02em}
.field input,.field textarea,.field select{
  width:100%;padding:14px 16px;border-radius:12px;
  background:rgba(255,255,255,0.04);border:1px solid var(--rule);
  color:var(--ink);font-family:inherit;font-size:14px;outline:none;
  transition:border-color .25s,background .25s;
}
.field textarea{min-height:130px;resize:vertical}
.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--honey);background:rgba(255,193,7,0.04)}
.intake-nav{display:flex;justify-content:space-between;margin-top:30px;gap:12px}
.intake-success{display:none;text-align:center;padding:30px 10px}
.intake-success.show{display:block;animation:fadeIn .5s var(--ease-out)}
.intake-success .check{width:72px;height:72px;border-radius:50%;background:rgba(255,193,7,0.12);border:1px solid var(--honey);display:grid;place-items:center;margin:0 auto 22px}
.intake-success .check svg{width:34px;height:34px;stroke:var(--honey);fill:none;stroke-width:2.2}

/* ---------- Legal / long-form doc ---------- */
.legal{padding:120px 32px 80px;background:var(--surf-0)}
.legal-doc{max-width:780px;margin:0 auto}
.legal-doc h2{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:600;margin:48px 0 16px;letter-spacing:-0.02em;color:var(--ink)}
.legal-doc h3{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:600;margin:28px 0 12px;color:var(--honey);letter-spacing:0.01em}
.legal-doc p,.legal-doc li{font-size:16px;line-height:1.7;color:var(--ink-dim);margin-bottom:12px}
.legal-doc ul,.legal-doc ol{padding-left:22px;margin:0 0 16px}
.legal-doc strong{color:var(--ink);font-weight:600}
.legal-doc a{color:var(--honey);text-decoration:underline;text-underline-offset:3px;text-decoration-color:rgba(255,193,7,0.3);transition:text-decoration-color .2s}
.legal-doc a:hover{text-decoration-color:var(--honey)}
.legal-meta{font-family:'Space Grotesk',sans-serif;font-size:12px;color:var(--ink-mute);letter-spacing:0.18em;text-transform:uppercase;margin-bottom:12px}
.legal-toc{background:rgba(255,255,255,0.03);border:1px solid var(--rule);border-radius:12px;padding:24px 28px;margin:36px 0}
.legal-toc h4{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.25em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:14px;font-weight:500}
.legal-toc ol{padding-left:18px;margin:0;color:var(--ink-dim);font-size:14px;line-height:2}
.legal-toc a{color:var(--ink-dim);text-decoration:none}
.legal-toc a:hover{color:var(--honey)}

/* ---------- Status dots ---------- */
.status-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--ok);box-shadow:0 0 12px var(--ok);margin-right:8px;vertical-align:middle}
.status-dot.warn{background:var(--warn);box-shadow:0 0 12px var(--warn)}
.status-dot.down{background:var(--err);box-shadow:0 0 12px var(--err)}
.status-row{display:flex;justify-content:space-between;align-items:center;padding:18px 22px;background:var(--surf-1);border:1px solid var(--rule);border-radius:12px;margin-bottom:10px}
.status-row .name{font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:14px;color:var(--ink)}
.status-row .meta{font-size:13px;color:var(--ink-mute)}
.status-uptime{font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--ok);font-weight:600}

/* ---------- Article / blog cards ---------- */
.article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:60px}
@media (max-width:960px){.article-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.article-grid{grid-template-columns:1fr}}
.article{display:flex;flex-direction:column;background:linear-gradient(180deg,var(--surf-2),var(--surf-1));border:1px solid var(--rule);border-radius:18px;overflow:hidden;transition:transform .4s var(--ease-out),border-color .4s}
.article:hover{transform:translateY(-4px);border-color:rgba(255,193,7,0.3)}
.article-cover{aspect-ratio:16/10;background:linear-gradient(135deg,#1d1d1f,var(--surf-0)) center/cover no-repeat;position:relative;overflow:hidden}
.article-cover.honey{background:linear-gradient(135deg,var(--honey),var(--amber))}
.article-cover.dark{background:linear-gradient(135deg,var(--surf-2),var(--bg))}
.article-cover.split{background:linear-gradient(135deg,var(--honey) 0%,var(--honey) 50%,var(--surf-0) 50%,var(--surf-0) 100%)}
.article-cover svg{position:absolute;inset:0;width:100%;height:100%;display:block}
.article-cover.gold{background:radial-gradient(circle at 30% 30%,var(--honey-2),var(--honey) 60%,var(--amber))}
.article-cover.ink{background:var(--surf-0)}
.article-cover.duo{background:linear-gradient(135deg,var(--surf-0) 0%,var(--surf-0) 60%,var(--honey) 100%)}
.article-cover.pad{background:linear-gradient(180deg,var(--surf-2),var(--surf-0))}
.article-body{padding:24px 22px 26px}
.article-meta{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);margin-bottom:10px}
.article-title{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;letter-spacing:-0.01em;line-height:1.3;margin-bottom:10px}
.article-excerpt{font-size:14px;line-height:1.55;color:var(--ink-dim)}

/* ---------- Case study tile ---------- */
.case-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:24px;margin-top:60px}
@media (max-width:760px){.case-grid{grid-template-columns:1fr}}
.case-tile{position:relative;overflow:hidden;border-radius:24px;border:1px solid var(--rule);background:linear-gradient(180deg,var(--surf-2),var(--surf-0));padding:36px;display:flex;flex-direction:column;justify-content:space-between;min-height:340px;transition:transform .4s var(--ease-out),border-color .4s}
.case-tile:hover{transform:translateY(-4px);border-color:rgba(255,193,7,0.3)}
.case-tag{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey)}
.case-title{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:600;letter-spacing:-0.02em;margin:14px 0 10px}
.case-result{display:flex;gap:24px;margin-top:24px}
.case-result div{flex:1}
.case-result .n{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;color:var(--ink)}
.case-result .l{font-size:12px;color:var(--ink-mute);margin-top:4px}

/* ---------- HiveHex (developer Easter egg game) ---------- */
.game-trigger{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'JetBrains Mono','Space Grotesk',monospace;
  font-size:12px;letter-spacing:0.05em;color:rgba(255,193,7,0.55);
  cursor:pointer;user-select:none;
  transition:color .25s,text-shadow .25s,transform .25s;
  white-space:nowrap;
  padding:6px 12px 6px 10px;border-radius:999px;
  border:1px solid rgba(255,193,7,0.18);
  background:rgba(255,193,7,0.03);
}
.game-trigger::before{
  content:"";width:9px;height:9px;display:inline-block;
  background:var(--honey);
  clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%);
  box-shadow:0 0 8px rgba(255,193,7,0.6);
  animation:triggerPulse 2.2s ease-in-out infinite;
}
@keyframes triggerPulse{0%,100%{opacity:0.7;transform:scale(1)}50%{opacity:1;transform:scale(1.15)}}
.game-trigger:hover{color:var(--honey);text-shadow:0 0 12px rgba(255,193,7,0.5);transform:translateY(-1px);border-color:rgba(255,193,7,0.45);background:rgba(255,193,7,0.08)}

.game-modal{
  position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,0.86);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px);
  padding:24px;animation:gmFadeIn .35s ease-out;
}
.game-modal.open{display:flex}
@keyframes gmFadeIn{from{opacity:0}to{opacity:1}}
.game-frame{
  width:min(620px,100%);max-height:96vh;overflow:auto;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid rgba(255,193,7,0.25);border-radius:24px;
  padding:28px 28px 24px;position:relative;
  box-shadow:0 40px 100px -20px rgba(0,0,0,0.8),0 0 0 1px rgba(255,193,7,0.04);
}
.game-head{display:flex;justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px}
.game-eyebrow{
  font-family:'JetBrains Mono','Space Grotesk',monospace;font-size:12px;
  letter-spacing:0.28em;text-transform:uppercase;color:var(--honey);margin-bottom:6px;
}
.game-title{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;letter-spacing:-0.01em;color:var(--ink)}
.game-sub{font-size:13px;color:var(--ink-mute);margin-top:4px;line-height:1.5}
.game-close{
  width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,0.06);
  border:1px solid rgba(255,255,255,0.08);color:var(--ink);font-size:20px;line-height:1;
  display:grid;place-items:center;cursor:pointer;transition:background .2s,transform .2s;flex-shrink:0;
}
.game-close:hover{background:rgba(255,193,7,0.15);transform:rotate(90deg)}
.game-status{
  display:flex;justify-content:space-between;align-items:center;
  padding:12px 16px;margin-bottom:14px;border-radius:12px;
  background:rgba(255,193,7,0.06);border:1px solid rgba(255,193,7,0.15);
  font-family:'Space Grotesk',sans-serif;font-size:14px;color:var(--ink);
  letter-spacing:0.01em;
}
.game-status .who{display:inline-flex;align-items:center;gap:8px;font-weight:600}
.game-status .who .dot{width:10px;height:10px;border-radius:50%;background:var(--honey);box-shadow:0 0 10px var(--honey)}
.game-status.wasp .who .dot{background:#777;box-shadow:0 0 10px var(--ink-444)}
.game-status.thinking{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.1)}
.game-status.win{background:rgba(74,222,128,0.08);border-color:rgba(74,222,128,0.3);color:var(--ok)}
.game-status.lose{background:rgba(248,113,113,0.08);border-color:rgba(248,113,113,0.25);color:var(--err)}
.game-status .moves{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-mute)}

.game-board{
  width:100%;display:block;border-radius:12px;
  background:radial-gradient(circle at 50% 50%,rgba(255,193,7,0.04),transparent 70%),var(--surf-0);
  border:1px solid rgba(255,255,255,0.06);
}
.hex-cell{
  fill:rgba(255,255,255,0.025);
  stroke:rgba(255,255,255,0.09);stroke-width:1.2;
  cursor:pointer;transition:fill .18s,stroke .18s;
}
.hex-cell:hover{fill:rgba(255,193,7,0.18);stroke:rgba(255,193,7,0.5)}
.hex-cell.bee{fill:var(--honey);stroke:#FFB300;filter:drop-shadow(0 0 6px rgba(255,193,7,0.5))}
.hex-cell.wasp{fill:var(--surf-1f);stroke:var(--ink-444)}
.hex-cell.win{stroke:var(--ok);stroke-width:2.2}
.hex-cell.last{stroke:var(--ink);stroke-width:2}
.hex-cell.locked{cursor:not-allowed}
.hex-cell.locked:hover{fill:rgba(255,255,255,0.025);stroke:rgba(255,255,255,0.09)}

.edge-label{font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;letter-spacing:0.2em;text-transform:uppercase;fill:var(--ink-mute)}
.edge-bar{stroke-width:3;fill:none;stroke-linecap:round}
.edge-bee{stroke:var(--honey);stroke-opacity:0.45}
.edge-wasp{stroke:#666;stroke-opacity:0.5}

.game-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-top:18px;flex-wrap:wrap}
.game-controls{display:flex;gap:8px}
.game-btn{
  font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;
  letter-spacing:0.04em;
  padding:8px 14px;border-radius:999px;cursor:pointer;
  background:rgba(255,255,255,0.05);border:1px solid rgba(255,255,255,0.1);color:var(--ink);
  transition:background .2s,transform .15s;
}
.game-btn:hover{background:rgba(255,193,7,0.12);border-color:rgba(255,193,7,0.4)}
.game-btn.primary{background:var(--honey);color:var(--surf-0);border-color:var(--honey)}
.game-btn.primary:hover{transform:scale(1.04)}
.game-difficulty{display:inline-flex;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);border-radius:999px;padding:2px}
.game-difficulty button{padding:6px 11px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:500;color:var(--ink-dim);background:transparent;border:none;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.game-difficulty button.on{background:var(--honey);color:var(--surf-0);font-weight:600}

.game-help{
  margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,0.06);
  font-family:'JetBrains Mono','Space Grotesk',monospace;font-size:12px;
  color:var(--ink-mute);line-height:1.65;
}
.game-help b{color:var(--honey);font-weight:600}

/* ---------- Hive NFT demo ---------- */
.hive-hero{padding:120px 32px 60px;background:radial-gradient(circle at 50% 0%,rgba(255,193,7,0.1),transparent 60%),var(--bg);text-align:center;position:relative;overflow:hidden}
.hive-hero h1{font-family:'Space Grotesk',sans-serif;font-weight:700;font-size:clamp(48px,8vw,128px);letter-spacing:-0.04em;line-height:1;background:linear-gradient(180deg,var(--honey),var(--amber));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;margin-top:12px}
.hive-hero p{max-width:640px;margin:24px auto 0;color:var(--ink-dim);font-size:clamp(16px,1.4vw,20px)}
.hive-stats{margin-top:50px;display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:920px;margin-left:auto;margin-right:auto}
@media (max-width:720px){.hive-stats{grid-template-columns:repeat(2,1fr)}}
.hive-stat{padding:24px 18px;background:linear-gradient(180deg,var(--surf-2),var(--surf-1));border:1px solid var(--rule);border-radius:18px}
.hive-stat .n{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;letter-spacing:-0.02em;color:var(--ink)}
.hive-stat .l{margin-top:4px;font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ink-mute)}

.hive-generator{
  max-width:880px;margin:60px auto 0;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid var(--rule);border-radius:24px;
  padding:36px;
  display:grid;grid-template-columns:280px 1fr;gap:32px;align-items:center;
}
@media (max-width:760px){.hive-generator{grid-template-columns:1fr;padding:24px}}
.hive-card{
  position:relative;aspect-ratio:1;
  background:radial-gradient(circle at 50% 40%,rgba(255,193,7,0.15),transparent 60%),var(--surf-0);
  border:1px solid rgba(255,193,7,0.3);
  border-radius:18px;
  display:grid;place-items:center;overflow:hidden;
  box-shadow:0 30px 80px -10px rgba(0,0,0,0.5),inset 0 0 0 1px rgba(255,193,7,0.05);
}
.hive-card svg{width:75%;height:75%;display:block}
.hive-card .badge-id{position:absolute;top:14px;left:14px;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.18em;color:var(--ink-mute);background:rgba(0,0,0,0.4);padding:4px 8px;border-radius:6px}
.hive-card .badge-tier{position:absolute;top:14px;right:14px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.18em;text-transform:uppercase;padding:4px 10px;border-radius:999px;background:var(--honey);color:var(--surf-0)}
.hive-card .badge-tier.legendary{background:linear-gradient(90deg,var(--honey),var(--amber));color:var(--surf-0)}
.hive-card .badge-tier.queen{background:var(--ink);color:var(--surf-0)}
.hive-card .badge-tier.worker{background:rgba(255,193,7,0.15);color:var(--honey);border:1px solid rgba(255,193,7,0.4)}
.hive-card .badge-tier.drone{background:rgba(255,255,255,0.06);color:var(--ink-dim);border:1px solid rgba(255,255,255,0.15)}
.hive-card .quote-overlay{position:absolute;bottom:12px;left:12px;right:12px;padding:10px 14px;background:rgba(0,0,0,0.7);backdrop-filter:blur(8px);border-radius:12px;font-size:12px;color:var(--ink);line-height:1.4;font-style:italic;border:1px solid rgba(255,255,255,0.08)}
.hive-card .quote-overlay .qa{display:block;margin-top:4px;color:var(--honey);font-style:normal;font-size:12px;letter-spacing:0.1em}

.hive-controls h3{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:600;letter-spacing:-0.01em;margin-bottom:14px}
.hive-controls .field{margin-bottom:14px}
.hive-controls .field label{display:block;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:6px;font-family:'Space Grotesk',sans-serif}
.hive-controls input,.hive-controls textarea{
  width:100%;padding:12px 14px;background:rgba(255,255,255,0.04);
  border:1px solid var(--rule);border-radius:12px;color:var(--ink);font-family:inherit;font-size:14px;
  outline:none;transition:border-color .2s,background .2s;
}
.hive-controls textarea{min-height:80px;resize:vertical;font-size:14px;line-height:1.5}
.hive-controls input:focus,.hive-controls textarea:focus{border-color:var(--honey);background:rgba(255,193,7,0.04)}
.hive-controls .row{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.hive-controls .meta{margin-top:14px;padding:12px 14px;background:rgba(255,193,7,0.04);border:1px solid rgba(255,193,7,0.15);border-radius:12px;font-size:13px;color:var(--ink-dim);line-height:1.5}
.hive-controls .meta b{color:var(--ink);font-weight:600}
.hive-controls .price-tag{display:inline-flex;align-items:baseline;gap:4px;margin-bottom:14px}
.hive-controls .price-tag .num{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;color:var(--honey);letter-spacing:-0.02em}
.hive-controls .price-tag .l{font-size:12px;color:var(--ink-mute);letter-spacing:0.12em;text-transform:uppercase}

.hive-tiers{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;max-width:880px;margin:50px auto 0}
@media (max-width:760px){.hive-tiers{grid-template-columns:repeat(2,1fr)}}
.tier-tile{padding:22px 18px;background:linear-gradient(180deg,var(--surf-2),var(--surf-1));border:1px solid var(--rule);border-radius:18px;text-align:center}
.tier-tile.queen{border-color:rgba(255,255,255,0.5);background:linear-gradient(180deg,rgba(255,255,255,0.05),var(--surf-1))}
.tier-tile.legendary{border-color:rgba(255,138,0,0.5);background:linear-gradient(180deg,rgba(255,138,0,0.08),var(--surf-1))}
.tier-tile.worker{border-color:rgba(255,193,7,0.35)}
.tier-tile .n{font-family:'Space Grotesk',sans-serif;font-size:14px;letter-spacing:0.2em;text-transform:uppercase;color:var(--honey);font-weight:600}
.tier-tile.queen .n{color:var(--ink)}
.tier-tile.legendary .n{color:var(--amber)}
.tier-tile .price{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;color:var(--ink);margin-top:10px;letter-spacing:-0.02em}
.tier-tile .supply{margin-top:6px;font-size:12px;color:var(--ink-mute)}
.tier-tile .perks{margin-top:14px;font-size:12px;color:var(--ink-dim);line-height:1.55;text-align:left}
.tier-tile .perks li{list-style:none;padding-left:14px;position:relative;margin-bottom:4px}
.tier-tile .perks li::before{content:"●";position:absolute;left:0;color:var(--honey);font-size:12px;top:5px}

.hive-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:16px;margin-top:40px}
.hive-thumb{aspect-ratio:1;border-radius:12px;background:linear-gradient(180deg,var(--surf-2),var(--surf-0));border:1px solid var(--rule);position:relative;overflow:hidden;cursor:pointer;transition:transform .3s,border-color .3s}
.hive-thumb:hover{transform:translateY(-3px);border-color:rgba(255,193,7,0.3)}
.hive-thumb svg{width:85%;height:85%;position:absolute;top:7%;left:7%}
.hive-thumb .hid{position:absolute;bottom:8px;left:8px;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-mute);letter-spacing:0.1em}
.hive-thumb .htier{position:absolute;top:8px;right:8px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.16em;text-transform:uppercase;padding:2px 7px;border-radius:999px}
.hive-thumb .htier.queen{background:var(--ink);color:var(--surf-0)}
.hive-thumb .htier.legendary{background:linear-gradient(90deg,var(--honey),var(--amber));color:var(--surf-0)}
.hive-thumb .htier.worker{background:rgba(255,193,7,0.15);color:var(--honey)}
.hive-thumb .htier.drone{background:rgba(255,255,255,0.06);color:var(--ink-dim)}

.lookup-bar{display:flex;gap:12px;max-width:600px;margin:0 auto;flex-wrap:wrap}
.lookup-bar input{flex:1;min-width:200px;padding:14px 18px;border-radius:999px;background:rgba(255,255,255,0.05);border:1px solid var(--rule);color:var(--ink);font-family:'JetBrains Mono',monospace;font-size:14px;outline:none}
.lookup-bar input:focus{border-color:var(--honey)}
.lookup-result{max-width:600px;margin:20px auto 0;padding:18px 22px;background:var(--surf-1);border:1px solid var(--rule);border-radius:12px;display:none}
.lookup-result.show{display:block}
.lookup-result.ok{border-color:rgba(74,222,128,0.3);background:rgba(74,222,128,0.05)}
.lookup-result.no{border-color:rgba(255,193,7,0.3);background:rgba(255,193,7,0.05)}
.lookup-result .k{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:4px}
.lookup-result .v{font-size:14px;color:var(--ink);margin-bottom:10px}

.hive-flash{position:fixed;top:24px;left:50%;transform:translateX(-50%) translateY(-100px);background:var(--surf-0);border:1px solid var(--honey);border-radius:12px;padding:16px 22px;color:var(--ink);z-index:300;transition:transform .35s cubic-bezier(0.16,1,0.3,1);box-shadow:0 24px 60px -10px rgba(255,193,7,0.4)}
.hive-flash.show{transform:translateX(-50%) translateY(0)}
.hive-flash .ttl{font-family:'Space Grotesk',sans-serif;font-weight:600;color:var(--honey)}
.hive-flash .msg{font-size:13px;color:var(--ink-dim);margin-top:2px}

.arch-diagram{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:48px}
@media (max-width:760px){.arch-diagram{grid-template-columns:1fr}}
.arch-phase{padding:24px 22px;background:var(--surf-1);border:1px solid var(--rule);border-radius:18px}
.arch-phase .ph{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);margin-bottom:10px}
.arch-phase h4{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;margin-bottom:8px;letter-spacing:-0.01em}
.arch-phase p{font-size:14px;color:var(--ink-dim);line-height:1.6;margin-bottom:10px}
.arch-phase .stack{margin-top:14px;display:flex;flex-wrap:wrap;gap:8px}
.arch-phase .stack span{font-family:'JetBrains Mono',monospace;font-size:12px;background:rgba(255,255,255,0.04);border:1px solid rgba(255,255,255,0.08);padding:3px 8px;border-radius:6px;color:var(--ink-dim)}

/* ---------- HiveWorld (the interactive NFT map) ---------- */
.hw-shell{
  display:grid;grid-template-columns:1fr 360px;gap:16px;
  max-width:1280px;margin:60px auto 0;
}
@media (max-width:1080px){.hw-shell{grid-template-columns:1fr}}
.hw-stage{
  position:relative;width:100%;aspect-ratio:2 / 1;min-height:360px;
  background:radial-gradient(circle at 50% 50%,var(--surf-0e) 0%,var(--surf-0) 100%);
  border:1px solid rgba(255,193,7,0.18);border-radius:24px;overflow:hidden;
  box-shadow:0 40px 100px -20px rgba(0,0,0,0.7),inset 0 0 0 1px rgba(255,255,255,0.02);
}
@media (max-width:1080px){.hw-stage{aspect-ratio:1.6 / 1;min-height:300px}}
.hw-canvas{position:absolute;inset:0;width:100%;height:100%;cursor:grab;display:block}
.hw-canvas.dragging{cursor:grabbing}
.hw-controls{position:absolute;top:14px;left:14px;display:flex;flex-direction:column;gap:8px;z-index:3}
.hw-ctrl-btn{
  width:38px;height:38px;border-radius:12px;
  background:rgba(0,0,0,0.55);backdrop-filter:blur(10px);
  border:1px solid rgba(255,255,255,0.1);color:var(--ink);
  display:grid;place-items:center;cursor:pointer;
  transition:background .2s,border-color .2s,transform .15s;
  font-family:'Space Grotesk',sans-serif;font-weight:600;font-size:16px;
}
.hw-ctrl-btn:hover{background:rgba(255,193,7,0.15);border-color:rgba(255,193,7,0.4);transform:scale(1.05)}
.hw-ctrl-btn svg{width:18px;height:18px;stroke:currentColor;fill:none;stroke-width:2}

.hw-zoom-readout{
  position:absolute;top:14px;right:14px;z-index:3;
  display:inline-flex;align-items:center;gap:8px;
  font-family:'JetBrains Mono','Space Grotesk',monospace;font-size:12px;
  color:var(--ink-mute);background:rgba(0,0,0,0.55);backdrop-filter:blur(10px);
  padding:8px 12px;border-radius:12px;border:1px solid rgba(255,255,255,0.1);
}
.hw-zoom-readout b{color:var(--honey);font-weight:600}
.hw-zoom-readout .pill{padding:2px 7px;border-radius:999px;background:rgba(255,193,7,0.15);color:var(--honey);font-size:12px;letter-spacing:0.08em;text-transform:uppercase;font-weight:700}

.hw-legend{
  position:absolute;bottom:14px;left:14px;z-index:3;
  display:flex;gap:12px;align-items:center;
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.04em;color:var(--ink-mute);
  background:rgba(0,0,0,0.55);backdrop-filter:blur(10px);
  padding:8px 14px;border-radius:999px;border:1px solid rgba(255,255,255,0.1);
}
.hw-legend .sw{display:inline-flex;align-items:center;gap:4px}
.hw-legend .sw i{display:inline-block;width:9px;height:9px;clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%)}
.hw-legend .sw.q i{background:var(--ink)}
.hw-legend .sw.l i{background:var(--amber)}
.hw-legend .sw.w i{background:var(--honey)}
.hw-legend .sw.c i{background:rgba(255,255,255,0.1);border:1px solid rgba(255,255,255,0.2);clip-path:polygon(50% 0,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%)}
.hw-legend .sw.o i{background:var(--ok)}

.hw-tooltip{
  position:absolute;pointer-events:none;z-index:5;
  background:rgba(10,10,10,0.95);backdrop-filter:blur(10px);
  border:1px solid rgba(255,193,7,0.3);border-radius:12px;
  padding:10px 14px;font-family:'Space Grotesk',sans-serif;
  opacity:0;transition:opacity .15s;
  white-space:nowrap;
  box-shadow:0 12px 30px rgba(0,0,0,0.5);
}
.hw-tooltip.show{opacity:1}
.hw-tooltip .id{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.12em;color:var(--ink-mute)}
.hw-tooltip .ti{font-size:14px;font-weight:600;color:var(--ink);margin-top:2px}
.hw-tooltip .pr{font-size:12px;color:var(--honey);margin-top:2px;font-weight:500}
.hw-tooltip .st{font-size:12px;letter-spacing:0.12em;text-transform:uppercase;color:var(--ok);margin-top:3px}

/* Selection / cart sidebar */
.hw-cart{
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid var(--rule);border-radius:24px;
  padding:24px;display:flex;flex-direction:column;gap:16px;
  position:sticky;top:90px;align-self:flex-start;max-height:calc(100vh - 110px);overflow:auto;
}
.hw-cart h3{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;letter-spacing:-0.01em;margin:0}
.hw-cart .cart-sub{font-size:12px;color:var(--ink-mute);margin-top:-8px}
.hw-cart .cart-summary{
  background:rgba(255,193,7,0.05);border:1px solid rgba(255,193,7,0.18);
  border-radius:12px;padding:14px 16px;
}
.hw-cart .cart-summary .row{display:flex;justify-content:space-between;align-items:baseline;font-size:13px;color:var(--ink-dim);margin-bottom:6px}
.hw-cart .cart-summary .row b{color:var(--ink);font-weight:600}
.hw-cart .cart-summary .row.total{margin-top:8px;padding-top:8px;border-top:1px solid rgba(255,193,7,0.18);font-size:14px}
.hw-cart .cart-summary .row.total .v{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;color:var(--honey);letter-spacing:-0.01em}
.hw-cart .cart-summary .row.savings{color:var(--ok);font-weight:600}
.hw-cart .field{display:flex;flex-direction:column;gap:8px}
.hw-cart .field label{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);font-family:'Space Grotesk',sans-serif}
.hw-cart .field input,.hw-cart .field textarea{
  padding:10px 12px;background:rgba(255,255,255,0.04);border:1px solid var(--rule);
  border-radius:12px;color:var(--ink);font-family:inherit;font-size:14px;outline:none;
}
.hw-cart .field input:focus,.hw-cart .field textarea:focus{border-color:var(--honey)}

.hw-pay{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.pay-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:10px 12px;border-radius:12px;cursor:pointer;
  background:rgba(255,255,255,0.04);border:1px solid var(--rule);color:var(--ink);
  font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;
  transition:background .2s,border-color .2s,transform .15s;
}
.pay-btn:hover{background:rgba(255,193,7,0.1);border-color:rgba(255,193,7,0.4);transform:translateY(-1px)}
.pay-btn.on{background:rgba(255,193,7,0.15);border-color:var(--honey)}
.pay-btn svg{width:14px;height:14px;fill:currentColor}
.pay-btn.apple{background:var(--ink);color:var(--surf-0)}
.pay-btn.apple:hover{background:#f0f0f0}
.pay-btn.crypto{background:linear-gradient(135deg,var(--solana-purple),var(--solana-green));color:var(--ink);border-color:transparent}
.pay-btn.crypto:hover{transform:translateY(-1px);filter:brightness(1.1)}

.cart-actions button{width:100%;justify-content:center}
.cart-empty{text-align:center;padding:30px 14px;color:var(--ink-mute);font-size:14px;line-height:1.5;border:1px dashed var(--rule);border-radius:12px}
.cart-list{display:flex;flex-wrap:wrap;gap:4px;max-height:120px;overflow:auto}
.cart-chip{display:inline-flex;align-items:center;gap:4px;padding:3px 8px;border-radius:999px;background:rgba(255,193,7,0.1);border:1px solid rgba(255,193,7,0.3);font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--honey);letter-spacing:0.05em}
.cart-chip button{background:none;border:none;color:var(--ink-mute);font-size:13px;line-height:1;cursor:pointer;padding:0}
.cart-chip button:hover{color:var(--ink)}

/* Bulk pricing table */
.bulk-tiers{display:grid;grid-template-columns:repeat(5,1fr);gap:16px;margin-top:40px}
@media (max-width:760px){.bulk-tiers{grid-template-columns:repeat(2,1fr)}}
.bulk-tile{padding:18px 14px;background:var(--surf-1);border:1px solid var(--rule);border-radius:12px;text-align:center}
.bulk-tile .qty{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.15em;color:var(--ink-mute);text-transform:uppercase}
.bulk-tile .off{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:700;color:var(--honey);margin-top:6px;letter-spacing:-0.01em}
.bulk-tile .desc{margin-top:4px;font-size:12px;color:var(--ink-dim);line-height:1.5}

/* Payment methods showcase */
.pay-showcase{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:40px}
@media (max-width:760px){.pay-showcase{grid-template-columns:repeat(2,1fr)}}
.pay-card{padding:24px 18px;background:linear-gradient(180deg,var(--surf-2),var(--surf-1));border:1px solid var(--rule);border-radius:18px;text-align:center;transition:border-color .3s,transform .3s}
.pay-card:hover{border-color:rgba(255,193,7,0.3);transform:translateY(-3px)}
.pay-card .lbl{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.2em;text-transform:uppercase;color:var(--honey);margin-bottom:8px}
.pay-card h4{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;color:var(--ink);margin-bottom:4px}
.pay-card .sub{font-size:13px;color:var(--ink-dim);line-height:1.5}

/* Marketplace mock */
.market-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;margin-top:40px}
.market-card{padding:16px;background:linear-gradient(180deg,var(--surf-2),var(--surf-1));border:1px solid var(--rule);border-radius:18px;display:flex;flex-direction:column;gap:8px;transition:border-color .3s,transform .3s}
.market-card:hover{border-color:rgba(255,193,7,0.3);transform:translateY(-2px)}
.market-card .preview{aspect-ratio:1.3;background:linear-gradient(135deg,var(--surf-2),var(--surf-0));border-radius:12px;display:grid;place-items:center;position:relative;overflow:hidden}
.market-card .preview svg{width:78%;height:78%}
.market-card .preview .htier{position:absolute;top:6px;right:6px;font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:700;letter-spacing:0.15em;text-transform:uppercase;padding:2px 6px;border-radius:999px}
.market-card .preview .htier.queen{background:var(--ink);color:var(--surf-0)}
.market-card .preview .htier.legendary{background:linear-gradient(90deg,var(--honey),var(--amber));color:var(--surf-0)}
.market-card .preview .htier.worker{background:rgba(255,193,7,0.15);color:var(--honey)}
.market-card .mid{font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-mute);letter-spacing:0.08em}
.market-card .mt{font-family:'Space Grotesk',sans-serif;font-size:14px;font-weight:600;color:var(--ink);line-height:1.3;min-height:36px}
.market-card .mrow{display:flex;justify-content:space-between;align-items:center;margin-top:auto}
.market-card .ask{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:700;color:var(--honey);letter-spacing:-0.01em}
.market-card .off{font-size:12px;color:var(--ok);font-weight:600}
.market-card .buy{font-family:'Space Grotesk',sans-serif;font-size:12px;font-weight:600;padding:5px 11px;border-radius:999px;background:var(--honey);color:var(--surf-0);border:none;cursor:pointer}
.market-card .buy:hover{transform:scale(1.04)}

/* ---------- Code Quiz ---------- */
.quiz-shell{
  max-width:720px;margin:50px auto 0;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid rgba(255,193,7,0.2);
  border-radius:24px;padding:36px;
  position:relative;overflow:hidden;
  box-shadow:0 30px 80px -20px rgba(0,0,0,0.6),inset 0 0 0 1px rgba(255,193,7,0.03);
}
.quiz-shell::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 0% 0%,rgba(255,193,7,0.08),transparent 50%);
  pointer-events:none;
}
.quiz-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:20px;position:relative;flex-wrap:wrap}
.quiz-progress{display:flex;gap:4px}
.quiz-progress .dot{width:14px;height:14px;border-radius:50%;background:rgba(255,255,255,0.08);transition:background .25s}
.quiz-progress .dot.done{background:var(--honey)}
.quiz-progress .dot.now{background:var(--ink)}
.quiz-progress .dot.miss{background:var(--err)}
.quiz-score{display:flex;align-items:center;gap:16px;font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--ink-dim)}
.quiz-score b{color:var(--ink);font-weight:600;font-size:18px;font-family:inherit}
.quiz-cat{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 12px;border-radius:999px;
  background:rgba(255,193,7,0.1);border:1px solid rgba(255,193,7,0.25);
  color:var(--honey);font-family:'JetBrains Mono','Space Grotesk',monospace;
  font-size:12px;letter-spacing:0.18em;text-transform:uppercase;font-weight:600;
}
.quiz-cat.hard{background:rgba(248,113,113,0.1);border-color:rgba(248,113,113,0.3);color:var(--err)}
.quiz-cat.med{background:rgba(255,193,7,0.1);border-color:rgba(255,193,7,0.3);color:var(--honey)}
.quiz-cat.easy{background:rgba(74,222,128,0.08);border-color:rgba(74,222,128,0.3);color:var(--ok)}
.quiz-question{
  position:relative;
  font-family:'Space Grotesk',sans-serif;font-weight:500;
  font-size:20px;line-height:1.35;color:var(--ink);letter-spacing:-0.01em;
  margin:8px 0 24px;
}
.quiz-question code{
  font-family:'JetBrains Mono',monospace;font-size:0.85em;
  background:rgba(255,193,7,0.08);color:var(--honey);
  padding:2px 7px;border-radius:6px;border:1px solid rgba(255,193,7,0.18);
}
.quiz-opts{display:grid;gap:12px;position:relative}
.quiz-opt{
  display:flex;align-items:center;gap:16px;width:100%;text-align:left;
  padding:14px 18px;background:rgba(255,255,255,0.04);
  border:1px solid var(--rule);border-radius:12px;color:var(--ink);
  font-family:'Inter',sans-serif;font-size:14px;cursor:pointer;
  transition:background .2s,border-color .2s,transform .15s;
}
.quiz-opt:hover{background:rgba(255,193,7,0.08);border-color:rgba(255,193,7,0.35);transform:translateX(3px)}
.quiz-opt .pre{
  width:26px;height:26px;border-radius:6px;background:rgba(0,0,0,0.35);
  display:grid;place-items:center;font-family:'JetBrains Mono',monospace;
  font-size:12px;font-weight:600;color:var(--honey);flex-shrink:0;
  border:1px solid rgba(255,193,7,0.2);
}
.quiz-opt.correct{background:rgba(74,222,128,0.12);border-color:rgba(74,222,128,0.55);color:var(--ink)}
.quiz-opt.correct .pre{background:var(--ok);color:var(--surf-0);border-color:var(--ok)}
.quiz-opt.wrong{background:rgba(248,113,113,0.1);border-color:rgba(248,113,113,0.5)}
.quiz-opt.wrong .pre{background:var(--err);color:var(--surf-0);border-color:var(--err)}
.quiz-opt.dim{opacity:0.55;cursor:default}
.quiz-opt.dim:hover{transform:none;background:rgba(255,255,255,0.04);border-color:var(--rule)}
.quiz-expl{
  margin-top:18px;padding:14px 18px;border-radius:12px;
  background:rgba(255,193,7,0.05);border:1px solid rgba(255,193,7,0.18);
  font-size:14px;color:var(--ink-dim);line-height:1.55;
}
.quiz-expl b{color:var(--ink);font-weight:600}
.quiz-expl code{font-family:'JetBrains Mono',monospace;font-size:0.9em;color:var(--honey)}
.quiz-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:22px;flex-wrap:wrap}
.quiz-streak{font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--ink-mute);display:inline-flex;align-items:center;gap:8px}
.quiz-streak b{color:var(--honey);font-weight:600}
.quiz-streak .fire{width:12px;height:12px;border-radius:50%;background:var(--honey);box-shadow:0 0 10px var(--honey);display:inline-block}

/* Code input (replaces multiple choice) */
.quiz-input-wrap{
  position:relative;display:flex;gap:12px;align-items:stretch;
  background:#06080c;border:1px solid var(--rule);border-radius:12px;
  padding:6px;transition:border-color .2s,box-shadow .2s;
}
.quiz-input-wrap:focus-within{border-color:var(--honey);box-shadow:0 0 0 4px rgba(255,193,7,0.1)}
.quiz-input-prompt{
  display:flex;align-items:center;padding:0 12px;
  font-family:'JetBrains Mono',monospace;font-size:14px;color:var(--honey);
  user-select:none;
}
.quiz-input{
  flex:1;background:transparent;border:none;outline:none;color:var(--ink);
  font-family:'JetBrains Mono',monospace;font-size:14px;
  padding:12px 0;letter-spacing:0.01em;
}
.quiz-input::placeholder{color:rgba(255,255,255,0.25)}
.quiz-input-submit{
  padding:0 16px;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;
  background:var(--honey);color:var(--surf-0);border:none;border-radius:12px;cursor:pointer;
  transition:transform .15s,box-shadow .2s;
}
.quiz-input-submit:hover{transform:scale(1.04);box-shadow:0 6px 18px -4px rgba(255,193,7,0.6)}
.quiz-input-submit:disabled{opacity:0.5;cursor:not-allowed}
.quiz-hint{margin-top:8px;font-size:13px;color:var(--ink-mute);font-family:'JetBrains Mono',monospace;letter-spacing:0.05em}
.quiz-hint b{color:var(--honey)}

.quiz-result-line{display:flex;gap:12px;align-items:center;margin-top:14px;font-family:'JetBrains Mono',monospace;font-size:13px}
.quiz-result-line .lbl{color:var(--ink-mute);min-width:90px}
.quiz-result-line .yours{color:var(--ink)}
.quiz-result-line .correct{color:var(--ok)}
.quiz-result-line.wrong .yours{color:var(--err);text-decoration:line-through;text-decoration-color:rgba(248,113,113,0.5)}

/* Bee swarm particle */
.bee-fly{
  position:absolute;width:38px;height:30px;pointer-events:none;z-index:50;
  will-change:transform,opacity;
}
.bee-fly svg{width:100%;height:100%;overflow:visible}
.bee-fly .wing{transform-origin:20px 14px;animation:beeWing 0.07s linear infinite alternate}
@keyframes beeWing{from{transform:scaleY(0.35)}to{transform:scaleY(1)}}
.bee-honey-drop{
  position:absolute;width:8px;height:14px;pointer-events:none;
  background:radial-gradient(circle at 50% 40%,var(--honey-2),var(--honey) 50%,var(--amber));
  border-radius:50% 50% 50% 50% / 70% 70% 30% 30%;
  z-index:48;will-change:transform,opacity;
  box-shadow:0 0 12px rgba(255,193,7,0.6);
}

/* Celebrate ring (pulses around correct answer) */
.quiz-pulse{
  position:absolute;inset:-2px;border-radius:12px;
  border:2px solid rgba(74,222,128,0.6);
  animation:pulseRing 0.7s ease-out forwards;
  pointer-events:none;
}
@keyframes pulseRing{
  0%{transform:scale(1);opacity:0.9}
  100%{transform:scale(1.07);opacity:0}
}
.quiz-shake{animation:shake 0.45s cubic-bezier(.36,.07,.19,.97) both}
@keyframes shake{
  10%,90%{transform:translateX(-2px)}
  20%,80%{transform:translateX(3px)}
  30%,50%,70%{transform:translateX(-6px)}
  40%,60%{transform:translateX(6px)}
}

/* Submit flash overlay (final celebration) */
.quiz-celebrate{
  position:absolute;inset:0;pointer-events:none;border-radius:24px;overflow:hidden;
}
.quiz-celebrate::before{
  content:"";position:absolute;inset:0;
  background:radial-gradient(circle at 50% 50%,rgba(255,193,7,0.25),transparent 60%);
  animation:celebrateFlash 1.6s ease-out;
}
@keyframes celebrateFlash{
  0%{opacity:0}
  20%{opacity:1}
  100%{opacity:0}
}

/* Quiz finish card */
.quiz-finish{display:none;text-align:center}
.quiz-finish.show{display:block;animation:fadeIn .4s var(--ease-out)}
.quiz-finish .score-big{font-family:'Space Grotesk',sans-serif;font-size:80px;font-weight:700;letter-spacing:-0.04em;line-height:1;background:linear-gradient(180deg,var(--honey),var(--amber));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.quiz-finish .score-sub{margin-top:8px;font-size:14px;color:var(--ink-mute);font-family:'Space Grotesk',sans-serif;letter-spacing:0.08em;text-transform:uppercase}
.quiz-finish .verdict{margin:22px 0 24px;font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:600;color:var(--ink);letter-spacing:-0.02em}
.quiz-cat-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin:20px 0}
.quiz-cat-tile{padding:14px 12px;background:rgba(255,255,255,0.03);border:1px solid var(--rule);border-radius:12px;text-align:left}
.quiz-cat-tile .cn{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.15em;text-transform:uppercase;color:var(--ink-mute)}
.quiz-cat-tile .cs{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;color:var(--ink);margin-top:3px}
.quiz-cat-tile .cs.full{color:var(--honey)}

/* ---------- Misc utilities ---------- */
.divider{border:0;border-top:1px solid var(--rule);margin:0}
.text-honey{color:var(--honey)}
.muted{color:var(--ink-mute)}
.center{text-align:center}
.split{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center;margin-top:80px}
@media (max-width:880px){.split{grid-template-columns:1fr;gap:32px}}

/* =========================================================
   CAREERS APPLY-GATE QUIZ (modal, animations, cooldown)
========================================================= */
.cq-modal{position:fixed;inset:0;z-index:300;display:none;align-items:center;justify-content:center;padding:24px}
.cq-modal.show{display:flex}
.cq-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.72);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.cq-shell{position:relative;width:min(560px,100%);max-height:90vh;overflow:auto;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid rgba(255,193,7,0.25);border-radius:24px;
  padding:32px 32px 28px;color:var(--ink);
  box-shadow:0 60px 140px -20px rgba(0,0,0,0.8),0 0 0 1px rgba(255,193,7,0.06) inset;
  animation:cqIn .35s cubic-bezier(0.16,1,0.3,1)}
@keyframes cqIn{from{transform:translateY(20px) scale(.96);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
.cq-close{position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;background:rgba(255,255,255,0.06);border:1px solid var(--rule);color:var(--ink);font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background .2s}
.cq-close:hover{background:rgba(255,193,7,0.15);color:var(--honey)}
.cq-head{margin-bottom:18px}
.cq-eyebrow{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.25em;text-transform:uppercase;color:var(--honey);font-weight:600;margin-bottom:8px;display:flex;align-items:center;gap:8px}
.cq-eyebrow::before{content:"";width:18px;height:1px;background:var(--honey);opacity:0.5}
.cq-shell h3{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:700;letter-spacing:-0.02em;color:var(--ink);margin:0 0 8px}
.cq-sub{font-size:14px;color:var(--ink-dim);line-height:1.6;margin:0}
.cq-sub b{color:var(--honey);font-weight:600}
.cq-progress{display:flex;align-items:center;gap:8px;margin:18px 0}
.cq-dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,0.1);transition:background .3s,transform .3s,box-shadow .3s}
.cq-dot.done{background:var(--ok);box-shadow:0 0 10px rgba(74,222,128,0.4)}
.cq-dot.cur{background:var(--honey);box-shadow:0 0 14px var(--honey-glow);transform:scale(1.25)}
.cq-counter{margin-left:auto;font-family:'JetBrains Mono',monospace;font-size:12px;color:var(--ink-mute);letter-spacing:0.12em}
.cq-card{position:relative;background:rgba(255,255,255,0.03);border:1px solid var(--rule);border-radius:18px;padding:22px 22px 18px;overflow:hidden}
.cq-q{font-family:'Space Grotesk',sans-serif;font-size:18px;font-weight:600;color:var(--ink);line-height:1.4;margin-bottom:6px}
.cq-hint{font-size:13px;color:var(--honey);opacity:0.85;margin-bottom:14px;font-style:italic}
.cq-input{
  width:100%;padding:13px 16px;background:var(--surf-1);border:1.5px solid var(--rule);
  border-radius:12px;color:var(--ink);font-family:'JetBrains Mono',monospace;font-size:14px;outline:none;
  transition:border-color .2s;
}
.cq-input:focus{border-color:var(--honey);box-shadow:0 0 0 3px rgba(255,193,7,0.15)}
.cq-feedback{margin-top:10px;font-size:13px;min-height:18px;font-family:'Space Grotesk',sans-serif;font-weight:500}
.cq-feedback.ok{color:var(--ok)}
.cq-feedback.bad{color:var(--err)}
.cq-feedback b{color:var(--honey);font-weight:700}
.cq-actions{display:flex;gap:12px;justify-content:flex-end;margin-top:18px}
.cq-actions .btn{padding:10px 18px;font-size:14px}
.cq-cooldown{text-align:center;padding:30px 12px 14px;background:rgba(255,193,7,0.04);border:1px solid rgba(255,193,7,0.18);border-radius:18px;margin-bottom:14px}
.cq-timer{font-family:'Space Grotesk',sans-serif;font-size:56px;font-weight:700;letter-spacing:-0.02em;color:var(--honey);line-height:1;text-shadow:0 0 30px var(--honey-glow)}
.cq-rolepill{display:inline-block;margin-top:12px;padding:5px 14px;border-radius:999px;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.1em;background:rgba(255,193,7,0.12);color:var(--honey);border:1px solid rgba(255,193,7,0.3)}
.cq-tip{margin-top:14px;font-size:13px;color:var(--ink-mute);line-height:1.55;max-width:420px;margin-left:auto;margin-right:auto}

/* Celebrate */
.cq-celebrate{position:relative;text-align:center;padding:34px 10px 26px;overflow:hidden;min-height:280px}
.cq-celebrate h3{margin:18px 0 8px}
.cq-celebrate p{color:var(--ink-dim);font-size:14px;margin:0}
.cq-flash{position:absolute;inset:-20px;background:radial-gradient(circle,rgba(255,193,7,0.35),transparent 65%);animation:cqFlash 1.4s ease-out forwards;pointer-events:none}
@keyframes cqFlash{from{opacity:0;transform:scale(.5)}40%{opacity:1}to{opacity:0;transform:scale(1.5)}}
.cq-check{width:90px;height:90px;margin:0 auto;position:relative;animation:cqCheckIn .6s cubic-bezier(0.16,1,0.3,1) forwards}
.cq-check svg{width:100%;height:100%}
.cq-check svg circle{stroke-dasharray:290;stroke-dashoffset:290;animation:cqStroke 0.8s ease-out forwards}
.cq-check svg path{stroke-dasharray:80;stroke-dashoffset:80;animation:cqStroke 0.5s ease-out 0.5s forwards}
@keyframes cqStroke{to{stroke-dashoffset:0}}
@keyframes cqCheckIn{from{transform:scale(.3);opacity:0}to{transform:scale(1);opacity:1}}

/* Bee */
.cq-bee{position:absolute;top:var(--ystart,40%);left:-60px;width:calc(36px * var(--scale,1));pointer-events:none;animation:cqBeeFly var(--dur,2.4s) ease-in-out forwards}
.cq-bee svg{width:100%;height:auto;display:block}
.cq-bee svg .wing{animation:cqWing 0.08s ease-in-out infinite alternate;transform-origin:22px 14px}
.cq-bee svg .wing2{transform-origin:42px 14px;animation-delay:.04s}
@keyframes cqWing{from{transform:scaleY(1)}to{transform:scaleY(0.3)}}
@keyframes cqBeeFly{
  0%{left:-60px;transform:translateY(0) rotate(-4deg)}
  50%{transform:translateY(var(--ypeak,-20px)) rotate(4deg)}
  100%{left:calc(100% + 60px);transform:translateY(0) rotate(-4deg)}
}

/* Honey drops */
.cq-drop{position:absolute;top:-12px;width:8px;height:12px;border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;background:linear-gradient(180deg,var(--honey),#d49a00);box-shadow:0 0 8px var(--honey-glow);pointer-events:none;animation:cqDrop var(--dur,1.4s) ease-in forwards}
@keyframes cqDrop{0%{top:-12px;opacity:0}10%{opacity:1}100%{top:120%;opacity:0.6}}

@media (max-width:600px){
  .cq-shell{padding:24px 20px 22px}
  .cq-shell h3{font-size:20px}
  .cq-timer{font-size:40px}
}

/* =========================================================
   APPLICATION PAGE (apply.html)
========================================================= */
.apply-shell{display:flex;flex-direction:column;gap:24px}
.apply-role-card{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:20px 22px;border-radius:18px;
  background:linear-gradient(180deg,rgba(255,193,7,0.08),rgba(255,193,7,0.02));
  border:1px solid rgba(255,193,7,0.25);
}
.apply-role-meta{display:flex;align-items:center;gap:16px}
.apply-role-meta .ico{width:42px;height:42px;display:grid;place-items:center;color:var(--honey);background:rgba(255,193,7,0.12);border-radius:12px;border:1px solid rgba(255,193,7,0.3)}
.apply-role-meta .ico svg{width:22px;height:22px}
.apply-role-meta .lbl{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);font-weight:600}
.apply-role-meta .role-title{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;color:var(--ink);letter-spacing:-0.01em;margin-top:2px}
.apply-role-meta .role-team{font-size:13px;color:var(--ink-dim);margin-top:2px}
.apply-role-card .change-link{font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--honey);font-weight:600}
.apply-role-card .change-link:hover{text-decoration:underline}

.apply-form{display:flex;flex-direction:column;gap:24px}
.ap-fs{
  border:1px solid var(--rule);border-radius:18px;padding:24px 24px 22px;
  background:var(--surf-1);
}
.ap-fs legend{
  padding:0 10px;font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;
  text-transform:uppercase;color:var(--honey);font-weight:600;
}
.ap-grid-2{display:grid;grid-template-columns:1fr 1fr;gap:16px}
@media (max-width:680px){.ap-grid-2{grid-template-columns:1fr}}
.ap-field{display:flex;flex-direction:column;gap:8px;margin-top:14px}
.ap-field:first-child{margin-top:0}
.ap-field label,.ap-label-block{
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.05em;
  font-weight:600;color:rgba(255,255,255,0.85);
}
.ap-field input[type="text"],
.ap-field input[type="email"],
.ap-field input[type="tel"],
.ap-field input[type="url"],
.ap-field input[type="date"],
.ap-field input[type="number"],
.ap-field select,
.ap-field textarea{
  width:100%;padding:12px 14px;background:var(--surf-0);
  border:1px solid var(--rule);border-radius:12px;color:var(--ink);
  font-family:inherit;font-size:14px;line-height:1.45;outline:none;
  transition:border-color .15s,box-shadow .15s;
}
.ap-field input:focus,.ap-field select:focus,.ap-field textarea:focus{
  border-color:var(--honey);box-shadow:0 0 0 3px rgba(255,193,7,0.15);
}
.ap-field textarea{resize:vertical;min-height:90px}
.ap-field select{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--honey) 50%),linear-gradient(135deg,var(--honey) 50%,transparent 50%);background-position:calc(100% - 18px) calc(50% - 2px),calc(100% - 13px) calc(50% - 2px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;padding-right:36px}

.ap-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.ap-chip{
  display:inline-flex;align-items:center;gap:8px;
  padding:8px 14px;border-radius:999px;cursor:pointer;
  background:var(--surf-0);border:1px solid var(--rule);
  font-size:13px;color:rgba(255,255,255,0.78);
  transition:background .15s,border-color .15s,color .15s,transform .15s;
}
.ap-chip:hover{border-color:rgba(255,193,7,0.4)}
.ap-chip input{margin:0;width:auto;accent-color:var(--honey)}
.ap-chip input:checked + span{color:var(--honey);font-weight:600}
.ap-chip:has(input:checked){background:rgba(255,193,7,0.1);border-color:var(--honey)}

.apply-actions{display:flex;gap:12px;flex-wrap:wrap;justify-content:flex-start;margin-top:8px}

.apply-success{text-align:center;padding:50px 24px 30px;background:linear-gradient(180deg,rgba(255,193,7,0.08),rgba(10,10,10,0.4));border:1px solid rgba(255,193,7,0.25);border-radius:24px;animation:cqIn .5s cubic-bezier(0.16,1,0.3,1)}
.apply-success .check-wrap{width:110px;height:110px;margin:0 auto 20px}
.apply-success .check-wrap svg{width:100%;height:100%}
.apply-success .check-wrap svg circle{stroke-dasharray:290;stroke-dashoffset:290;animation:cqStroke 0.8s ease-out forwards}
.apply-success .check-wrap svg path{stroke-dasharray:80;stroke-dashoffset:80;animation:cqStroke 0.5s ease-out 0.5s forwards}
.apply-success h2{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:700;letter-spacing:-0.02em;color:var(--ink);margin:0 0 14px}
.apply-success p{color:var(--ink-dim);font-size:14px;line-height:1.65;max-width:520px;margin:0 auto 26px}

@media (max-width:680px){
  .apply-role-card{flex-direction:column;align-items:flex-start;gap:12px}
  .apply-success h2{font-size:24px}
}

/* =========================================================
   COOKIE CONSENT (GDPR)
   Banner appears bottom-left on first visit until a choice is made.
   Modal opens from "Customize" button or footer "Cookie preferences" link.
========================================================= */
.cc-banner{
  position:fixed;left:24px;right:24px;bottom:24px;z-index:400;
  display:flex;justify-content:flex-start;pointer-events:none;
  opacity:0;transform:translateY(20px);transition:opacity .4s var(--ease-out),transform .4s var(--ease-out);
}
.cc-banner.show{opacity:1;transform:translateY(0)}
.cc-banner-card{
  pointer-events:auto;
  max-width:520px;width:100%;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid rgba(255,193,7,0.25);border-radius:18px;
  padding:24px 26px 22px;
  box-shadow:0 30px 80px -10px rgba(0,0,0,0.7),0 0 0 1px rgba(255,193,7,0.04) inset;
  color:var(--ink);
}
.cc-banner-eyebrow{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.24em;
  text-transform:uppercase;color:var(--honey);font-weight:600;margin-bottom:10px;
}
.cc-cookie{width:18px;height:18px;color:var(--honey);display:inline-flex}
.cc-cookie svg{width:100%;height:100%}
.cc-banner-card h3{
  font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;
  letter-spacing:-0.01em;color:var(--ink);margin:0 0 8px;
}
.cc-banner-card p{font-size:14px;color:var(--ink-dim);line-height:1.6;margin:0}
.cc-banner-card p a{color:var(--honey);text-decoration:underline;text-underline-offset:2px}
.cc-banner-card p a:hover{color:var(--honey-2)}
.cc-banner-actions{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
.cc-btn{
  flex:1;min-width:110px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:11px 16px;border-radius:999px;cursor:pointer;
  font-family:inherit;font-size:13px;font-weight:600;letter-spacing:0;
  border:1px solid var(--rule);background:transparent;color:var(--ink);
  transition:background .2s,border-color .2s,transform .15s;
}
.cc-btn:hover{background:rgba(255,255,255,0.05);border-color:rgba(255,255,255,0.2)}
.cc-btn.cc-btn-primary{background:var(--honey);color:var(--surf-0);border-color:var(--honey);box-shadow:0 0 0 0 var(--honey-glow)}
.cc-btn.cc-btn-primary:hover{background:var(--honey-2);transform:translateY(-1px);box-shadow:0 0 24px 0 var(--honey-glow)}
.cc-btn.cc-btn-ghost{background:transparent}

/* Modal */
.cc-modal{
  position:fixed;inset:0;z-index:500;display:none;align-items:center;justify-content:center;padding:24px;
  opacity:0;transition:opacity .25s;
}
.cc-modal.show{display:flex;opacity:1}
.cc-modal-backdrop{position:absolute;inset:0;background:rgba(0,0,0,0.7);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.cc-modal-shell{
  position:relative;width:min(600px,100%);max-height:90vh;overflow:auto;
  background:linear-gradient(180deg,var(--surf-2),var(--surf-0));
  border:1px solid rgba(255,193,7,0.25);border-radius:24px;
  padding:32px 30px 26px;color:var(--ink);
  box-shadow:0 60px 140px -20px rgba(0,0,0,0.8);
  animation:cqIn .35s cubic-bezier(0.16,1,0.3,1);
}
.cc-modal-close{
  position:absolute;top:14px;right:14px;width:34px;height:34px;border-radius:50%;
  background:rgba(255,255,255,0.06);border:1px solid var(--rule);color:var(--ink);
  font-size:20px;line-height:1;cursor:pointer;display:grid;place-items:center;
  transition:background .15s;
}
.cc-modal-close:hover{background:rgba(255,193,7,0.15);color:var(--honey)}
.cc-modal-head h2{font-family:'Space Grotesk',sans-serif;font-size:24px;font-weight:700;letter-spacing:-0.02em;color:var(--ink);margin:0 0 8px}
.cc-modal-head p{font-size:14px;color:var(--ink-dim);line-height:1.6;margin:0}
.cc-categories{margin-top:22px;display:flex;flex-direction:column;gap:12px}
.cc-cat{
  background:rgba(255,255,255,0.03);border:1px solid var(--rule);border-radius:12px;padding:16px 18px;
  transition:border-color .15s,background .15s;
}
.cc-cat:hover{border-color:rgba(255,193,7,0.25)}
.cc-cat-head{display:flex;align-items:flex-start;gap:16px;justify-content:space-between}
.cc-cat-head h4{font-family:'Space Grotesk',sans-serif;font-size:14px;font-weight:600;color:var(--ink);margin:0 0 4px}
.cc-cat-head p{font-size:13px;color:var(--ink-dim);line-height:1.55;margin:0;max-width:380px}

/* Toggle switch */
.cc-toggle{position:relative;display:inline-flex;align-items:center;flex-shrink:0;cursor:pointer;user-select:none}
.cc-toggle input{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.cc-toggle-track{
  position:relative;display:inline-block;width:44px;height:24px;
  background:rgba(255,255,255,0.1);border:1px solid var(--rule);border-radius:999px;
  transition:background .2s,border-color .2s;
}
.cc-toggle-track::before{
  content:"";position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;
  background:var(--ink);transition:transform .25s var(--ease-out);
  box-shadow:0 2px 6px rgba(0,0,0,0.4);
}
.cc-toggle input:checked + .cc-toggle-track{background:var(--honey);border-color:var(--honey)}
.cc-toggle input:checked + .cc-toggle-track::before{transform:translateX(20px);background:var(--surf-0)}
.cc-toggle input:focus + .cc-toggle-track{box-shadow:0 0 0 3px rgba(255,193,7,0.18)}
.cc-toggle-locked{
  display:inline-flex;align-items:center;gap:8px;
  padding:5px 12px;border-radius:999px;background:rgba(255,193,7,0.12);
  border:1px solid rgba(255,193,7,0.3);font-family:'Space Grotesk',sans-serif;
  font-size:12px;letter-spacing:0.16em;text-transform:uppercase;color:var(--honey);font-weight:600;
}
.cc-toggle-locked .cc-toggle-knob{width:8px;height:8px;border-radius:50%;background:var(--honey);box-shadow:0 0 8px var(--honey)}

.cc-modal-foot{
  margin-top:22px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;
  padding-top:18px;border-top:1px solid var(--rule);
}
.cc-modal-meta{font-size:12px;color:var(--ink-mute)}
.cc-modal-meta a{color:var(--honey);text-decoration:underline;text-underline-offset:2px}
.cc-modal-actions{display:flex;gap:8px;flex-wrap:wrap}
.cc-modal-actions .cc-btn{flex:0 0 auto;min-width:120px}

/* Mobile */
@media (max-width:640px){
  .cc-banner{left:16px;right:16px;bottom:16px}
  .cc-banner-actions{flex-direction:column}
  .cc-banner-actions .cc-btn{width:100%}
  .cc-modal-shell{padding:24px 22px 22px}
  .cc-modal-head h2{font-size:20px}
  .cc-modal-actions{width:100%}
  .cc-modal-actions .cc-btn{flex:1;min-width:0}
  .cc-cat-head{flex-direction:column;align-items:flex-start;gap:12px}
}

/* Footer cookie preferences link */
.cc-footer-link{
  background:none;border:none;color:inherit;font:inherit;cursor:pointer;padding:0;
  text-decoration:underline;text-underline-offset:2px;
}
.cc-footer-link:hover{color:var(--honey)}

/* =========================================================
   CAREERS-QUIZ : option cards for single / multi select
========================================================= */
.cq-input-wrap{margin-top:6px}
.cq-multi-hint{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);font-weight:600;margin-bottom:10px}
.cq-options{display:flex;flex-direction:column;gap:8px;margin-top:10px}
.cq-opt{
  position:relative;cursor:pointer;display:block;user-select:none;
  border-radius:12px;transition:transform .15s;
}
.cq-opt input{position:absolute;opacity:0;pointer-events:none;width:0;height:0}
.cq-opt-box{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;background:var(--surf-1);
  border:1.5px solid var(--rule);border-radius:12px;
  transition:border-color .15s,background .15s;
}
.cq-opt:hover .cq-opt-box{border-color:rgba(255,193,7,0.3);background:rgba(255,193,7,0.04)}
.cq-opt-dot{
  width:18px;height:18px;border-radius:50%;flex-shrink:0;
  border:1.5px solid var(--rule);position:relative;
  transition:border-color .15s,background .15s;
}
.cq-opt input[type=radio]:checked + .cq-opt-box .cq-opt-dot{
  border-color:var(--honey);background:var(--honey);
}
.cq-opt input[type=radio]:checked + .cq-opt-box{border-color:var(--honey);background:rgba(255,193,7,0.08)}
.cq-opt-check{
  width:18px;height:18px;border-radius:6px;flex-shrink:0;
  border:1.5px solid var(--rule);position:relative;
  transition:border-color .15s,background .15s;
}
.cq-opt-check::after{
  content:"";position:absolute;left:5px;top:1px;width:5px;height:10px;
  border:solid var(--surf-0);border-width:0 2px 2px 0;transform:rotate(45deg) scale(0);
  transition:transform .12s;
}
.cq-opt input[type=checkbox]:checked + .cq-opt-box .cq-opt-check{
  background:var(--honey);border-color:var(--honey);
}
.cq-opt input[type=checkbox]:checked + .cq-opt-box .cq-opt-check::after{transform:rotate(45deg) scale(1)}
.cq-opt input[type=checkbox]:checked + .cq-opt-box{border-color:var(--honey);background:rgba(255,193,7,0.08)}
.cq-opt-label{font-size:14px;color:var(--ink);line-height:1.4;flex:1}
.cq-opt.cq-locked{cursor:default;opacity:0.85}
.cq-opt.cq-locked:hover .cq-opt-box{border-color:var(--rule);background:var(--surf-1)}
.cq-opt.cq-correct .cq-opt-box{border-color:var(--ok) !important;background:rgba(74,222,128,0.1) !important}
.cq-opt.cq-correct .cq-opt-box::after{
  content:"✓";margin-left:auto;color:var(--ok);font-weight:700;font-size:18px;
}
@media (max-width:600px){
  .cq-opt-box{padding:11px 14px}
  .cq-opt-label{font-size:14px}
}

/* =========================================================
   SERVICE LANDING PAGES (12 deep-dive pages, theme-color driven)
========================================================= */
.svc-page{--accent:var(--honey); --accent-2:var(--amber); --accent-glow:rgba(255,193,7,0.3)}
.svc-page.tone-blue   {--accent:#3b82f6; --accent-2:#60a5fa; --accent-glow:rgba(59,130,246,0.35)}
.svc-page.tone-purple {--accent:#a855f7; --accent-2:#c084fc; --accent-glow:rgba(168,85,247,0.35)}
.svc-page.tone-sky    {--accent:#0ea5e9; --accent-2:#38bdf8; --accent-glow:rgba(14,165,233,0.35)}
.svc-page.tone-cyan   {--accent:#06b6d4; --accent-2:#22d3ee; --accent-glow:rgba(6,182,212,0.35)}
.svc-page.tone-red    {--accent:#dc2626; --accent-2:var(--err); --accent-glow:rgba(220,38,38,0.35)}
.svc-page.tone-magenta{--accent:var(--solana-purple); --accent-2:var(--solana-green); --accent-glow:rgba(153,69,255,0.35)}
.svc-page.tone-pink   {--accent:#ec4899; --accent-2:#f472b6; --accent-glow:rgba(236,72,153,0.35)}
.svc-page.tone-lime   {--accent:#84cc16; --accent-2:#a3e635; --accent-glow:rgba(132,204,22,0.35)}
.svc-page.tone-orange {--accent:#f97316; --accent-2:#fb923c; --accent-glow:rgba(249,115,22,0.35)}
.svc-page.tone-slate  {--accent:#94a3b8; --accent-2:#cbd5e1; --accent-glow:rgba(148,163,184,0.35)}
.svc-page.tone-emerald{--accent:#10b981; --accent-2:#34d399; --accent-glow:rgba(16,185,129,0.35)}

/* HERO ------------------------------------------------------ */
.svc-hero{
  position:relative;min-height:100vh;display:flex;align-items:center;
  padding:calc(var(--nav-h) + 60px) 32px 80px;overflow:hidden;
  background:radial-gradient(circle at 70% 30%,rgba(255,255,255,0.04),var(--surf-0) 60%);
}
.svc-hero::before{
  content:"";position:absolute;inset:-20%;
  background:radial-gradient(circle at 80% 20%,var(--accent-glow),transparent 50%);
  opacity:0.6;pointer-events:none;
}
.svc-hero-grid{
  position:relative;z-index:2;
  max-width:var(--container);margin:0 auto;width:100%;
  display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;
}
@media (max-width:960px){.svc-hero-grid{grid-template-columns:1fr;gap:40px}}
.svc-hero-eyebrow{
  display:inline-flex;align-items:center;gap:12px;padding:6px 14px;
  border-radius:999px;border:1px solid var(--accent);
  background:linear-gradient(135deg, rgba(255,255,255,0.02), transparent);
  color:var(--accent);font-family:'Space Grotesk',sans-serif;
  font-size:12px;font-weight:600;letter-spacing:0.22em;text-transform:uppercase;
  margin-bottom:24px;
}
.svc-hero-eyebrow::before{
  content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);
  box-shadow:0 0 10px var(--accent);animation:svcPulse 2s ease-in-out infinite;
}
@keyframes svcPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:0.6;transform:scale(1.3)}}
.svc-hero-title{
  font-family:'Space Grotesk',sans-serif;font-size:clamp(46px,6.5vw,84px);
  font-weight:700;letter-spacing:-0.035em;line-height:0.95;color:var(--ink);margin:0 0 26px;
}
.svc-hero-title em{
  font-style:normal;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  -webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
}
.svc-hero-lede{font-size:clamp(17px,1.4vw,21px);color:var(--ink-dim);line-height:1.55;margin:0 0 36px;max-width:560px}
.svc-hero-ctas{display:flex;gap:12px;flex-wrap:wrap}
.svc-hero-ctas .btn-primary{
  background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--surf-0);
  border-color:var(--accent);box-shadow:0 12px 40px -8px var(--accent-glow);
}
.svc-hero-ctas .btn-primary:hover{box-shadow:0 14px 50px -6px var(--accent-glow)}
.svc-hero-meta{margin-top:42px;display:flex;gap:32px;flex-wrap:wrap}
.svc-hero-meta .item{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--ink-mute);font-family:'Space Grotesk',sans-serif}
.svc-hero-meta .item b{display:block;color:var(--ink);font-size:24px;font-weight:700;letter-spacing:-0.02em;margin-top:6px;text-transform:none}
.svc-hero-viz{
  position:relative;aspect-ratio:1;width:100%;max-width:560px;justify-self:center;
}
.svc-hero-viz svg{width:100%;height:100%}
.svc-hero-scroll{
  position:absolute;bottom:32px;left:50%;transform:translateX(-50%);
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.3em;
  text-transform:uppercase;color:var(--ink-mute);
  display:flex;align-items:center;gap:8px;animation:svcBob 2.4s ease-in-out infinite;
}
@keyframes svcBob{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(6px)}}

/* WHAT WE SHIP ---------------------------------------------- */
.svc-deliv{padding:120px 32px}
.svc-deliv .container{max-width:var(--container);margin:0 auto}
.svc-deliv-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-top:60px}
.svc-deliv-card{
  position:relative;padding:30px 26px 26px;
  background:linear-gradient(180deg,var(--surf-0e),var(--surf-0));
  border:1px solid var(--rule);border-radius:18px;
  transition:transform .3s var(--ease-out),border-color .3s, box-shadow .3s;
  overflow:hidden;
}
.svc-deliv-card::before{
  content:"";position:absolute;top:-1px;left:-1px;right:-1px;height:2px;
  background:linear-gradient(90deg,transparent,var(--accent),transparent);
  opacity:0;transition:opacity .3s;
}
.svc-deliv-card:hover{transform:translateY(-4px);border-color:var(--accent);box-shadow:0 30px 80px -20px var(--accent-glow)}
.svc-deliv-card:hover::before{opacity:1}
.svc-deliv-card .num{
  font-family:'Space Grotesk',sans-serif;font-size:40px;font-weight:700;
  color:transparent;-webkit-text-stroke:1.5px var(--accent);
  letter-spacing:-0.04em;line-height:0.9;
}
.svc-deliv-card h3{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;color:var(--ink);margin:18px 0 10px;letter-spacing:-0.01em}
.svc-deliv-card p{font-size:14px;color:var(--ink-dim);line-height:1.6;margin:0}
.svc-deliv-card .tag{
  display:inline-block;margin-top:18px;font-size:12px;letter-spacing:0.18em;
  text-transform:uppercase;color:var(--accent);font-family:'Space Grotesk',sans-serif;font-weight:600;
}

/* INTERACTIVE DEMO ------------------------------------------ */
.svc-demo{padding:80px 32px;background:linear-gradient(180deg,var(--surf-0),var(--surf-0))}
.svc-demo .container{max-width:var(--container);margin:0 auto}
.svc-demo-card{
  margin-top:50px;
  padding:36px 36px 30px;border-radius:24px;
  background:linear-gradient(180deg,var(--surf-1),var(--surf-0));
  border:1px solid var(--rule);position:relative;overflow:hidden;
}
.svc-demo-card::before{
  content:"";position:absolute;inset:-1px;border-radius:24px;padding:1px;
  background:linear-gradient(135deg,var(--accent),transparent 50%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask-composite:exclude;
  pointer-events:none;
}

/* STACK CHIPS ----------------------------------------------- */
.svc-stack{padding:80px 32px;border-top:1px solid var(--rule)}
.svc-stack .container{max-width:var(--container);margin:0 auto}
.svc-stack-grid{display:flex;flex-wrap:wrap;gap:12px;margin-top:40px}
.svc-chip{
  padding:11px 18px;border-radius:999px;background:rgba(255,255,255,0.04);
  border:1px solid var(--rule);color:var(--ink);font-size:14px;font-weight:500;
  transition:border-color .2s,transform .2s,background .2s;cursor:default;
  font-family:'Space Grotesk',sans-serif;letter-spacing:0;
}
.svc-chip:hover{transform:translateY(-2px);border-color:var(--accent);background:rgba(255,255,255,0.07);color:var(--accent)}
.svc-chip.tier-2{background:transparent;border-style:dashed;color:var(--ink-dim)}

/* PROCESS TIMELINE ------------------------------------------ */
.svc-process{padding:100px 32px;background:linear-gradient(180deg,var(--surf-0),var(--surf-0))}
.svc-process .container{max-width:var(--container);margin:0 auto}
.svc-timeline{margin-top:60px;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;position:relative}
.svc-timeline-step{padding:26px;border-radius:18px;background:var(--surf-1);border:1px solid var(--rule);position:relative}
.svc-timeline-step .num{
  position:absolute;top:-18px;left:22px;
  width:36px;height:36px;border-radius:50%;
  background:linear-gradient(135deg,var(--accent),var(--accent-2));
  color:var(--surf-0);font-family:'Space Grotesk',sans-serif;font-size:14px;font-weight:700;
  display:grid;place-items:center;box-shadow:0 8px 20px -4px var(--accent-glow);
}
.svc-timeline-step h4{font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:600;color:var(--ink);margin:12px 0 8px;letter-spacing:-0.01em}
.svc-timeline-step p{font-size:14px;color:var(--ink-dim);line-height:1.55;margin:0}
.svc-timeline-step .meta{font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--accent);font-family:'Space Grotesk',sans-serif;font-weight:600;margin-top:14px}

/* CASE PROOF ------------------------------------------------ */
.svc-proof{padding:80px 32px;border-top:1px solid var(--rule)}
.svc-proof .container{max-width:1100px;margin:0 auto;text-align:center}
.svc-proof-quote{
  font-family:'Space Grotesk',sans-serif;font-size:clamp(22px,2.4vw,32px);
  font-weight:500;letter-spacing:-0.01em;line-height:1.4;color:var(--ink);
  max-width:850px;margin:0 auto 30px;
}
.svc-proof-quote::before{content:"\201C";color:var(--accent);font-size:56px;line-height:0;vertical-align:-12px;margin-right:6px}
.svc-proof-quote::after{content:"\201D";color:var(--accent);font-size:56px;line-height:0;vertical-align:-30px;margin-left:4px}
.svc-proof-meta{color:var(--ink-mute);font-size:13px;letter-spacing:0.18em;text-transform:uppercase;font-family:'Space Grotesk',sans-serif}

/* FAQ ------------------------------------------------------- */
.svc-faq{padding:100px 32px;background:linear-gradient(180deg,var(--surf-0),var(--surf-0))}
.svc-faq .container{max-width:880px;margin:0 auto}
.svc-faq-item{
  background:var(--surf-1);border:1px solid var(--rule);border-radius:12px;
  margin-bottom:10px;padding:0;
}
.svc-faq-item summary{
  list-style:none;padding:22px 26px;cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  font-family:'Space Grotesk',sans-serif;font-size:16px;font-weight:600;color:var(--ink);
}
.svc-faq-item summary::-webkit-details-marker{display:none}
.svc-faq-item summary::after{
  content:"";width:14px;height:14px;border-right:2px solid var(--accent);
  border-bottom:2px solid var(--accent);transform:rotate(45deg);transition:transform .25s;
  flex-shrink:0;
}
.svc-faq-item[open] summary::after{transform:rotate(-135deg)}
.svc-faq-item[open]{border-color:var(--accent)}
.svc-faq-item .ans{padding:0 26px 22px;color:var(--ink-dim);font-size:14px;line-height:1.65}

/* CTA CARD -------------------------------------------------- */
.svc-cta{padding:100px 32px}
.svc-cta .container{max-width:var(--container);margin:0 auto}
.svc-cta-card{
  padding:60px 60px 56px;border-radius:24px;
  background:radial-gradient(circle at 80% 30%,var(--accent-glow),transparent 50%),linear-gradient(180deg,var(--surf-1),var(--surf-0));
  border:1px solid var(--accent);position:relative;overflow:hidden;
  display:grid;grid-template-columns:1.4fr 1fr;gap:48px;align-items:center;
}
@media (max-width:880px){.svc-cta-card{grid-template-columns:1fr;padding:40px 32px}}
.svc-cta-card h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(32px,4vw,52px);font-weight:700;letter-spacing:-0.03em;color:var(--ink);line-height:1;margin:0 0 18px}
.svc-cta-card h2 em{font-style:normal;background:linear-gradient(135deg,var(--accent),var(--accent-2));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.svc-cta-card .lede{color:var(--ink-dim);font-size:16px;line-height:1.65;margin:0 0 26px}
.svc-cta-card .actions{display:flex;gap:12px;flex-wrap:wrap}
.svc-cta-card .actions .btn-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:var(--surf-0);border-color:var(--accent)}
.svc-cta-side{
  background:var(--surf-0);border:1px solid var(--rule);border-radius:18px;padding:24px;
  font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--ink-dim);line-height:1.65;
}
.svc-cta-side .row{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px solid rgba(255,255,255,0.05)}
.svc-cta-side .row:last-child{border-bottom:none}
.svc-cta-side .row b{color:var(--accent);font-weight:600}

/* Custom HERO ANIMATIONS - keyframes ------------------------ */
@keyframes svcOrbit{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
@keyframes svcFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}
@keyframes svcDashFlow{from{stroke-dashoffset:0}to{stroke-dashoffset:-100}}
@keyframes svcGlow{0%,100%{filter:drop-shadow(0 0 8px var(--accent-glow))}50%{filter:drop-shadow(0 0 24px var(--accent-glow))}}
@keyframes svcSweep{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
@keyframes svcType{from{width:0}to{width:100%}}
@keyframes svcPing{0%{transform:scale(1);opacity:1}80%{transform:scale(2.4);opacity:0}100%{transform:scale(2.4);opacity:0}}
@keyframes svcSlide{from{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}

/* Section titles use accent */
.svc-eyebrow{
  font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.25em;
  text-transform:uppercase;color:var(--accent);font-weight:600;
  display:flex;align-items:center;gap:12px;margin-bottom:14px;
}
.svc-eyebrow::before{content:"";width:24px;height:1px;background:var(--accent)}
.svc-title{font-family:'Space Grotesk',sans-serif;font-size:clamp(32px,4vw,52px);font-weight:700;letter-spacing:-0.03em;line-height:1;color:var(--ink);margin:0 0 18px}
.svc-lede{font-size:clamp(16px,1.3vw,19px);color:var(--ink-dim);line-height:1.6;max-width:680px;margin:0}

/* AI-SPECIFIC: neural network animation */
.svc-neural .node{fill:var(--accent);transform-origin:center;animation:svcNeuron 3s ease-in-out infinite}
.svc-neural .node:nth-child(2n){animation-delay:0.5s}
.svc-neural .node:nth-child(3n){animation-delay:1s}
.svc-neural .conn{stroke:var(--accent);stroke-width:1;opacity:0.3;stroke-dasharray:4 6;animation:svcDashFlow 6s linear infinite}
@keyframes svcNeuron{0%,100%{transform:scale(1);opacity:0.7}50%{transform:scale(1.6);opacity:1}}

/* SOFTWARE-SPECIFIC: terminal */
.svc-term{font-family:'JetBrains Mono',monospace;font-size:14px;line-height:1.8;color:var(--ink-dim)}
.svc-term .ln{display:block}
.svc-term .typed{display:inline-block;overflow:hidden;white-space:nowrap;animation:svcType 2s steps(40,end) 1 forwards}
.svc-term .cmd{color:var(--accent)}
.svc-term .ok{color:var(--ok)}
.svc-term .warn{color:var(--warn)}

/* MOBILE-SPECIFIC: phone */
.svc-phone{position:absolute;width:280px;height:560px;border-radius:24px;background:linear-gradient(180deg,var(--surf-2),var(--surf-0));border:2px solid var(--surf-1f);box-shadow:0 40px 80px -10px rgba(0,0,0,0.6);overflow:hidden}
.svc-phone::before{content:"";position:absolute;top:14px;left:50%;transform:translateX(-50%);width:80px;height:18px;background:var(--bg);border-radius:0 0 12px 12px}
.svc-phone .screen{position:absolute;inset:14px;border-radius:24px;overflow:hidden;background:linear-gradient(180deg,#0f0f0f,var(--surf-0))}

/* GROWTH-SPECIFIC: chart bars */
.svc-bar{transform-origin:bottom;animation:svcBarGrow 1.6s var(--ease-out) forwards}
@keyframes svcBarGrow{from{transform:scaleY(0)}to{transform:scaleY(1)}}

/* CLOUD-SPECIFIC: packets */
.svc-packet{animation:svcPacket 4s linear infinite}
@keyframes svcPacket{from{offset-distance:0%}to{offset-distance:100%}}

/* DATA-SPECIFIC: pipeline flow */
.svc-flow{stroke-dasharray:8 12;animation:svcDashFlow 3s linear infinite reverse}

/* SECURITY-SPECIFIC: shield scan */
.svc-scan{animation:svcScan 3s ease-in-out infinite}
@keyframes svcScan{0%{transform:translateY(-100%)}100%{transform:translateY(100%)}}

/* QA-SPECIFIC: check cascade */
.svc-check{animation:svcCheck 0.6s var(--ease-out) forwards;opacity:0;transform-origin:center}
@keyframes svcCheck{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}

/* BLOCKCHAIN-SPECIFIC: block chain */
.svc-block{animation:svcSlide 0.6s var(--ease-out) backwards}

/* DESIGN-SPECIFIC: color morph */
.svc-tile{transition:background .6s var(--ease-out)}

/* INTEGRATIONS-SPECIFIC: connection pulse */
.svc-pulse{stroke-dasharray:200;stroke-dashoffset:200;animation:svcPulseDraw 2s ease-in-out infinite}
@keyframes svcPulseDraw{0%{stroke-dashoffset:200}50%{stroke-dashoffset:0}100%{stroke-dashoffset:-200}}

/* DIGITALIZATION-SPECIFIC: paper flip */
.svc-paper{transform-style:preserve-3d;animation:svcFlip 4s ease-in-out infinite}
@keyframes svcFlip{0%,100%{transform:rotateY(0)}50%{transform:rotateY(180deg)}}

/* =========================================================
   HIVE NFT: gift cart + lifecycle section
========================================================= */
.hw-gift-toggle{margin-top:4px}
.hw-gift-switch{display:flex;align-items:center;gap:12px;cursor:pointer;user-select:none}
.hw-gift-switch input{position:absolute;opacity:0;width:0;height:0;pointer-events:none}
.hw-gift-track{position:relative;width:42px;height:24px;border-radius:999px;background:rgba(255,255,255,0.08);border:1px solid var(--rule);transition:background .2s,border-color .2s;flex-shrink:0}
.hw-gift-knob{position:absolute;top:2px;left:2px;width:18px;height:18px;border-radius:50%;background:var(--ink);box-shadow:0 2px 6px rgba(0,0,0,0.4);transition:transform .25s var(--ease-out)}
.hw-gift-switch input:checked + .hw-gift-track{background:var(--honey);border-color:var(--honey)}
.hw-gift-switch input:checked + .hw-gift-track .hw-gift-knob{transform:translateX(18px);background:var(--surf-0)}
.hw-gift-label{display:inline-flex;align-items:center;gap:8px;font-family:'Space Grotesk',sans-serif;font-size:13px;font-weight:600;color:var(--ink);letter-spacing:0}
.hw-gift-icon{width:18px;height:18px;color:var(--honey);display:inline-flex}
.hw-gift-icon svg{width:100%;height:100%}

.hw-stings{display:flex;flex-wrap:wrap;gap:8px;margin-top:8px}
.hw-sting{
  padding:6px 12px;border-radius:999px;background:rgba(255,255,255,0.04);
  border:1px solid var(--rule);color:var(--ink-dim);font-size:13px;font-weight:500;
  cursor:pointer;font-family:'Space Grotesk',sans-serif;letter-spacing:0;
  transition:background .15s,border-color .15s,color .15s,transform .15s;
}
.hw-sting:hover{border-color:var(--honey);color:var(--honey);transform:translateY(-1px)}
.hw-sting.on{background:rgba(255,193,7,0.15);border-color:var(--honey);color:var(--honey)}

.hw-deliv{display:flex;flex-direction:column;gap:8px}
.hw-deliv-opt{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--ink-dim);cursor:pointer}
.hw-deliv-opt input{accent-color:var(--honey)}

.hw-gift-preview{margin-top:6px;padding:16px;border-radius:12px;background:linear-gradient(135deg,rgba(255,193,7,0.12),rgba(255,138,0,0.05));border:1px solid rgba(255,193,7,0.3)}
.hw-gift-card{display:flex;flex-direction:column;gap:8px}
.hw-gift-tag{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);font-weight:600}
.hw-gift-from{font-size:13px;color:var(--ink-dim)}
.hw-gift-from b{color:var(--ink);font-weight:600}
.hw-gift-count{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;color:var(--ink);letter-spacing:-0.01em}
.hw-gift-quote{font-style:italic;color:var(--ink-dim);font-size:13px;padding:8px 10px;background:rgba(0,0,0,0.25);border-radius:6px;border-left:2px solid var(--honey)}
.hw-gift-claim{font-family:'Space Grotesk',sans-serif;font-size:12px;color:var(--honey);font-weight:600;letter-spacing:0.08em;margin-top:4px}

/* Lifecycle steps */
.hw-lifecycle{display:grid;grid-template-columns:1fr auto 1fr auto 1fr;gap:16px;align-items:stretch}
@media (max-width:1000px){.hw-lifecycle{grid-template-columns:1fr;gap:16px}.hw-life-arrow{display:none}}
.hw-life-step{
  position:relative;padding:28px 26px 24px;
  background:linear-gradient(180deg,var(--surf-1),var(--surf-0));
  border:1px solid var(--rule);border-radius:18px;
  display:flex;flex-direction:column;gap:12px;
  transition:transform .3s var(--ease-out),border-color .3s,box-shadow .3s;
}
.hw-life-step:hover{transform:translateY(-4px);border-color:var(--honey);box-shadow:0 30px 80px -20px var(--honey-glow)}
.hw-life-step.hw-life-highlight{
  background:linear-gradient(135deg,rgba(255,193,7,0.1),rgba(255,138,0,0.05));
  border-color:rgba(255,193,7,0.4);
}
.hw-life-num{font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.22em;color:var(--honey);font-weight:600}
.hw-life-icon{width:44px;height:44px;color:var(--honey);display:flex;align-items:center;justify-content:center;background:rgba(255,193,7,0.08);border-radius:12px;border:1px solid rgba(255,193,7,0.2)}
.hw-life-icon svg{width:24px;height:24px}
.hw-life-step h3{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:600;color:var(--ink);margin:6px 0 0;letter-spacing:-0.01em}
.hw-life-step p{font-size:14px;color:var(--ink-dim);line-height:1.6;margin:0}
.hw-life-meta{margin-top:auto;padding-top:12px;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.05em;color:var(--ink-mute);border-top:1px solid var(--rule)}
.hw-life-arrow{font-size:24px;color:var(--honey);display:grid;place-items:center;opacity:0.6}

.hw-life-props{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;
  padding:24px;border-radius:18px;background:var(--surf-1);border:1px solid var(--rule);
}
.hw-life-props > div{display:flex;flex-direction:column;gap:4px}
.hw-life-props .k{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);font-weight:600}
.hw-life-props .v{font-size:14px;color:var(--ink);line-height:1.4}

/* =========================================================
   ARTICLE READER MODAL
========================================================= */
.ar-modal{position:fixed;inset:0;z-index:9000;display:none;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto}
.ar-modal.show{display:flex}
.ar-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.78);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.ar-shell{
  position:relative;width:min(820px,100%);
  background:linear-gradient(180deg,var(--surf-0f),var(--surf-0));
  border:1px solid var(--rule);border-radius:24px;
  padding:48px 56px 40px;color:var(--ink);
  box-shadow:0 60px 140px -20px rgba(0,0,0,0.9);
  animation:arIn .4s cubic-bezier(0.16,1,0.3,1);
  margin:auto;
}
@keyframes arIn{from{transform:translateY(30px) scale(.97);opacity:0}to{transform:translateY(0) scale(1);opacity:1}}
.ar-close{position:absolute;top:18px;right:18px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,0.06);border:1px solid var(--rule);color:var(--ink);font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;transition:background .15s,color .15s;font-family:inherit}
.ar-close:hover{background:rgba(255,193,7,0.15);color:var(--honey)}
.ar-meta-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:18px}
.ar-kind{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.25em;text-transform:uppercase;color:var(--honey);font-weight:700;padding:5px 12px;border-radius:999px;background:rgba(255,193,7,0.1);border:1px solid rgba(255,193,7,0.3)}
.ar-cat{font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--ink-mute);letter-spacing:0.12em}
.ar-title{
  font-family:'Space Grotesk',sans-serif;font-size:clamp(28px,3.6vw,42px);font-weight:700;
  letter-spacing:-0.025em;line-height:1.15;color:var(--ink);margin:0 0 14px;
}
.ar-meta{font-family:'Space Grotesk',sans-serif;font-size:13px;color:var(--ink-mute);letter-spacing:0.05em;margin-bottom:28px;padding-bottom:24px;border-bottom:1px solid var(--rule)}
.ar-lede{
  font-family:'Space Grotesk',sans-serif;font-size:clamp(18px,1.8vw,22px);font-weight:500;
  line-height:1.5;color:var(--ink);margin:0 0 28px;letter-spacing:-0.01em;
}
.ar-text{font-size:16px;line-height:1.75;color:var(--ink-dim)}
.ar-text p{margin:0 0 20px}
.ar-text b{color:var(--ink);font-weight:600}
.ar-text a{color:var(--honey);text-decoration:underline;text-decoration-color:rgba(255,193,7,0.4);text-underline-offset:3px}
.ar-text a:hover{text-decoration-color:var(--honey)}
.ar-cta-row{display:flex;gap:12px;flex-wrap:wrap;margin-top:36px;padding-top:28px;border-top:1px solid var(--rule)}
@media (max-width:680px){
  .ar-modal{padding:24px 12px}
  .ar-shell{padding:36px 24px 28px}
  .ar-close{top:12px;right:12px}
}

/* =========================================================
   MEDIA KIT MODAL
========================================================= */
.mk-modal{position:fixed;inset:0;z-index:9100;display:none;align-items:flex-start;justify-content:center;padding:40px 20px;overflow-y:auto}
.mk-modal.show{display:flex}
.mk-backdrop{position:fixed;inset:0;background:rgba(0,0,0,0.82);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.mk-shell{
  position:relative;width:min(960px,100%);
  background:linear-gradient(180deg,var(--surf-0f),var(--surf-0));
  border:1px solid var(--rule);border-radius:24px;
  padding:42px 48px 36px;color:var(--ink);
  box-shadow:0 60px 140px -20px rgba(0,0,0,0.9);
  margin:auto;animation:arIn .4s cubic-bezier(0.16,1,0.3,1);
}
.mk-close{position:absolute;top:18px;right:18px;width:38px;height:38px;border-radius:50%;background:rgba(255,255,255,0.06);border:1px solid var(--rule);color:var(--ink);font-size:24px;line-height:1;cursor:pointer;display:grid;place-items:center;font-family:inherit}
.mk-close:hover{background:rgba(255,193,7,0.18);color:var(--honey)}
.mk-head{margin-bottom:32px;padding-bottom:24px;border-bottom:1px solid var(--rule)}
.mk-eyebrow{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.28em;text-transform:uppercase;color:var(--honey);font-weight:600;margin-bottom:12px}
.mk-head h2{font-family:'Space Grotesk',sans-serif;font-size:clamp(26px,3.2vw,36px);font-weight:700;letter-spacing:-0.02em;color:var(--ink);margin:0 0 12px;line-height:1.15}
.mk-sub{color:var(--ink-dim);font-size:14px;line-height:1.6;margin:0;max-width:680px}
.mk-foot{margin-top:32px;padding-top:24px;border-top:1px solid var(--rule);display:flex;gap:12px;flex-wrap:wrap}

/* Logo pack grid */
.mk-logo-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.mk-logo-card{border-radius:18px;overflow:hidden;border:1px solid var(--rule);transition:border-color .2s,transform .2s}
.mk-logo-card:hover{border-color:rgba(255,193,7,0.35);transform:translateY(-2px)}
.mk-logo-preview{aspect-ratio:16/10;display:grid;place-items:center;padding:18px}
.mk-logo-preview svg{max-width:60%;height:auto}
.mk-logo-meta{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 14px;background:rgba(0,0,0,0.4);border-top:1px solid var(--rule);flex-wrap:wrap}
.mk-logo-label{font-family:'Space Grotesk',sans-serif;font-size:12px;color:var(--ink);font-weight:600}
.mk-logo-actions{display:flex;gap:8px;flex-wrap:wrap}
.mk-mini-btn{
  padding:5px 11px;border-radius:999px;background:rgba(255,255,255,0.06);border:1px solid var(--rule);
  color:var(--ink);font-size:12px;letter-spacing:0.04em;font-family:'Space Grotesk',sans-serif;font-weight:600;
  cursor:pointer;transition:background .15s,border-color .15s,color .15s;
}
.mk-mini-btn:hover{background:rgba(255,193,7,0.15);border-color:var(--honey);color:var(--honey)}

/* Brand colors grid */
.mk-color-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:16px}
.mk-color-card{border-radius:18px;overflow:hidden;border:1px solid var(--rule);background:var(--surf-1);display:flex;flex-direction:column}
.mk-color-swatch{padding:24px 20px;display:flex;flex-direction:column;gap:4px}
.mk-color-name{font-family:'Space Grotesk',sans-serif;font-size:20px;font-weight:700;letter-spacing:-0.02em}
.mk-color-role{font-size:12px;opacity:0.8;letter-spacing:0.04em}
.mk-color-values{display:flex;flex-direction:column}
.mk-color-row{
  display:grid;grid-template-columns:60px 1fr auto;gap:12px;align-items:center;
  padding:10px 16px;border-top:1px solid rgba(255,255,255,0.04);cursor:pointer;
  transition:background .15s;
}
.mk-color-row:hover{background:rgba(255,193,7,0.06)}
.mk-color-row .k{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.18em;text-transform:uppercase;color:var(--honey);font-weight:600}
.mk-color-row .v{font-family:'JetBrains Mono',monospace;font-size:13px;color:var(--ink)}
.mk-color-row .c{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-mute);font-weight:600}
.mk-color-row:hover .c{color:var(--honey)}

/* Fact sheet */
.mk-facts{display:flex;flex-direction:column;gap:16px}
.mk-fact{display:grid;grid-template-columns:180px 1fr;gap:16px;align-items:start;padding:12px 16px;background:rgba(255,255,255,0.02);border:1px solid var(--rule);border-radius:12px}
@media (max-width:680px){.mk-fact{grid-template-columns:1fr;gap:8px}}
.mk-fact .k{font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--honey);font-weight:600;padding-top:2px}
.mk-fact .v{font-size:14px;color:var(--ink);line-height:1.55}
.mk-fact .v a{color:var(--honey);text-decoration:underline;text-underline-offset:3px}
.mk-fact-block ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:8px;color:var(--ink);font-size:14px;line-height:1.5}
.mk-fact-block ul li{padding-left:18px;position:relative}
.mk-fact-block ul li::before{content:"";position:absolute;left:0;top:9px;width:6px;height:6px;border-radius:50%;background:var(--honey)}

@media (max-width:680px){
  .mk-modal{padding:24px 12px}
  .mk-shell{padding:32px 22px 26px}
  .mk-head h2{font-size:24px}
}

/* =========================================================
   BEE SHELL - hidden terminal Easter egg
========================================================= */
.bee-shell{font-family:'JetBrains Mono','Fira Code','Monaco',monospace;color:var(--ink-soft)}
.bee-shell-frame{
  max-width:1080px;margin:0 auto;height:calc(100vh - 48px);
  background:linear-gradient(180deg,var(--surf-0),var(--bg));
  border:1px solid rgba(255,193,7,0.4);border-radius:12px;
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 30px 100px rgba(255,193,7,0.15),inset 0 0 60px rgba(255,193,7,0.04);
}
.bee-shell-top{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:10px 16px;background:linear-gradient(180deg,var(--surf-2),#111);
  border-bottom:1px solid rgba(255,255,255,0.1);
}
.bee-shell-dots{display:inline-flex;gap:8px}
.bee-shell-dots i{width:11px;height:11px;border-radius:50%;display:inline-block}
.bee-shell-dots i:nth-child(1){background:#ff5f56}
.bee-shell-dots i:nth-child(2){background:#ffbd2e}
.bee-shell-dots i:nth-child(3){background:#27c93f}
.bee-shell-title{font-size:12px;letter-spacing:0.04em;color:rgba(255,255,255,0.5)}
.bee-shell-close{
  background:rgba(255,255,255,0.06);border:1px solid rgba(255,255,255,0.1);color:var(--ink);
  width:26px;height:26px;border-radius:6px;cursor:pointer;font-size:16px;line-height:1;font-family:inherit;
}
.bee-shell-close:hover{background:rgba(255,193,7,0.18);color:var(--honey)}
.bee-shell-body{
  flex:1;overflow-y:auto;padding:16px 18px;font-size:14px;line-height:1.55;
  background:radial-gradient(circle at 50% 50%,rgba(255,193,7,0.025),transparent 70%);
}
.bee-shell-body::-webkit-scrollbar{width:8px}
.bee-shell-body::-webkit-scrollbar-thumb{background:rgba(255,193,7,0.25);border-radius:6px}
.bee-shell-input{display:flex;align-items:center;gap:12px;padding:10px 18px;border-top:1px solid rgba(255,255,255,0.08);background:rgba(0,0,0,0.6)}
.bee-shell-prompt{color:var(--honey);font-size:14px;flex-shrink:0;font-family:inherit}
.bee-shell-prompt b{color:var(--honey-2)}
.bee-shell-line{
  flex:1;background:transparent;border:none;color:var(--ink-soft);font-family:inherit;
  font-size:14px;outline:none;caret-color:var(--honey);
}
.bee-line{margin:0;white-space:pre-wrap;word-break:break-word}
.bee-line .hl{color:var(--honey)}
.bee-line .err{color:var(--err)}
.bee-line .dim{opacity:0.55}
.bee-line pre{margin:0;font-family:inherit;font-size:inherit;white-space:pre}
.bee-line b{color:var(--ink);font-weight:600}
.bee-line i{color:rgba(255,255,255,0.65);font-style:italic}
@media (max-width:680px){.bee-shell-body{font-size:13px}.bee-shell-prompt,.bee-shell-line{font-size:13px}}


/* =========================================================
   PRICING / TRUST / CASES / COMPARE / NEWSLETTER
========================================================= */
.price-band{font-family:'Space Grotesk',sans-serif;font-size:32px;font-weight:600;color:var(--honey);margin:18px 0 6px;letter-spacing:-0.01em}
.card-feature{border-color:rgba(255,193,7,0.55);background:linear-gradient(180deg,rgba(255,193,7,0.05),transparent 70%)}
.badge{display:inline-block;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--bg);background:var(--honey);padding:4px 10px;border-radius:999px;font-weight:700;margin-bottom:10px}
.price-table{border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:rgba(255,255,255,0.02)}
.price-row{display:grid;grid-template-columns:1.4fr 1fr 1.1fr 1.1fr;gap:16px;padding:14px 18px;border-bottom:1px solid var(--rule);align-items:center;font-size:14px}
.price-row:last-child{border-bottom:none}
.price-row.price-head{background:rgba(255,193,7,0.07);font-weight:600;color:var(--honey);text-transform:uppercase;letter-spacing:0.1em;font-size:12px}
.price-row b{color:var(--ink);font-weight:600}
@media (max-width:780px){.price-row{grid-template-columns:1fr;gap:4px}.price-row.price-head{display:none}}
.faq details{border:1px solid var(--rule);border-radius:12px;padding:14px 18px;margin-bottom:10px;background:rgba(255,255,255,0.02);cursor:pointer}
.faq summary{font-weight:600;color:var(--ink);list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";float:right;color:var(--honey);font-weight:300;font-size:20px;line-height:0.6}
.faq details[open] summary::after{content:"-"}
.faq details p{margin:12px 0 0;color:var(--ink-mute);font-size:14px;line-height:1.6}
.case-card{padding:32px;border:1px solid var(--rule);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,0.03),transparent 60%);position:relative}
.case-card-wide{grid-column:span 2}
@media (max-width:880px){.case-card-wide{grid-column:auto}}
.case-metric{position:absolute;top:24px;right:24px;text-align:right;font-family:'Space Grotesk',sans-serif}
.case-metric b{display:block;font-size:32px;font-weight:600;color:var(--honey);letter-spacing:-0.02em;line-height:1}
.case-metric span{display:block;font-size:12px;letter-spacing:0.14em;text-transform:uppercase;color:var(--ink-mute);margin-top:4px}
.case-card h3{margin-right:130px;margin-top:0}
.case-card ul.bullets{margin:14px 0 16px;padding-left:18px;color:var(--ink)}
.case-card ul.bullets li{margin-bottom:6px;font-size:14px}
.case-card code{background:rgba(255,255,255,0.06);padding:1px 6px;border-radius:6px;font-size:13px}
.newsletter-form{display:flex;gap:12px;flex-wrap:wrap;background:rgba(255,193,7,0.05);border:1px solid rgba(255,193,7,0.3);border-radius:12px;padding:22px}
.newsletter-form input{flex:1;min-width:240px;padding:14px 16px;background:rgba(0,0,0,0.4);border:1px solid var(--rule);color:var(--ink);border-radius:6px;font-size:14px;font-family:inherit}
.newsletter-form input:focus{outline:none;border-color:var(--honey)}
.newsletter-form .btn-primary{flex-shrink:0;padding:14px 28px}
.issue-list{display:flex;flex-direction:column;gap:8px}
.issue-link{display:flex;justify-content:space-between;align-items:center;padding:16px 18px;border:1px solid var(--rule);border-radius:12px;background:rgba(255,255,255,0.02);text-decoration:none;color:var(--ink);font-size:14px;gap:16px}
.issue-link:hover{border-color:var(--honey);background:rgba(255,193,7,0.04)}
.issue-link .muted{font-size:13px;flex-shrink:0}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.footer-newsletter{margin-top:14px}
.footer-newsletter form{display:flex;gap:8px;margin-top:8px}
.footer-newsletter input{flex:1;min-width:0;padding:9px 12px;background:rgba(255,255,255,0.04);border:1px solid var(--rule);color:var(--ink);border-radius:6px;font-size:13px;font-family:inherit}
.footer-newsletter input:focus{outline:none;border-color:var(--honey)}
.footer-newsletter button{padding:9px 14px;background:var(--honey);color:var(--bg);border:none;border-radius:6px;font-weight:600;font-size:13px;cursor:pointer;font-family:inherit}
.footer-newsletter button:hover{background:var(--honey-2)}
.footer-newsletter .small{font-size:12px;color:var(--ink-mute);margin-top:6px}


/* =========================================================
   CORE WEB VITALS HARDENING (CLS, LCP, INP)
========================================================= */
/* Fallback font with size-adjust matched to Inter; eliminates CLS during font swap */
@font-face{
  font-family:'Inter Fallback';
  src:local('Arial');
  size-adjust:107%;
  ascent-override:90%;
  descent-override:22%;
  line-gap-override:0%;
}
@font-face{
  font-family:'Grotesk Fallback';
  src:local('Arial');
  size-adjust:103%;
  ascent-override:95%;
  descent-override:25%;
  line-gap-override:0%;
}
body{font-family:'Inter','Inter Fallback',system-ui,-apple-system,sans-serif}
h1,h2,h3,h4,h5,h6{font-family:'Space Grotesk','Grotesk Fallback','Inter','Inter Fallback',sans-serif}

/* content-visibility for below-fold sections - browser skips render until scrolled in */
.cv-auto{content-visibility:auto;contain-intrinsic-size:auto 800px}

/* Skip link */
.skip-link{
  position:absolute;left:-9999px;top:0;z-index:9999;
  background:var(--honey);color:var(--bg);padding:14px 22px;
  font-weight:600;text-decoration:none;border-radius:0 0 8px 0;
}
.skip-link:focus{left:0;outline:3px solid var(--bg);outline-offset:2px}

/* Prevent layout shift from images without explicit dimensions */
img,svg{max-width:100%;height:auto}
img{aspect-ratio:attr(width) / attr(height)}

/* Hint touch targets to meet WCAG 2.5.5 (>=44px) on mobile */
@media (pointer:coarse){
  a,button{min-height:44px}
  .nav-mega-btn,.btn-primary,.arr-link{min-height:44px;display:inline-flex;align-items:center}
}


/* =========================================================
   RELATED SERVICES / INTERNAL LINKING
========================================================= */
.related-services{padding:60px 0 80px;border-top:1px solid var(--rule);margin-top:60px}
.related-title{font-size:32px;text-align:center;margin-bottom:40px;font-weight:600;letter-spacing:-0.02em}
.related-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-bottom:30px}
.related-card{display:flex;align-items:center;justify-content:space-between;padding:22px 24px;border:1px solid var(--rule);border-radius:12px;background:rgba(255,255,255,0.02);text-decoration:none;color:var(--ink);transition:all 0.2s ease;font-size:16px;font-weight:500}
.related-card:hover{border-color:var(--honey);background:rgba(255,193,7,0.05);transform:translateY(-2px)}
.related-arr{color:var(--honey);font-weight:300;font-size:20px}
.center{text-align:center}.mt-md{margin-top:18px}
@media (max-width:760px){.related-grid{grid-template-columns:1fr}}


/* =========================================================
   FORM ERROR + INLINE VALIDATION STATES
========================================================= */
.field-error{color:var(--err);font-size:13px;margin-top:6px;display:none}
input[aria-invalid="true"], textarea[aria-invalid="true"], select[aria-invalid="true"]{border-color:var(--err) !important; outline-color:var(--err)}
input[aria-invalid="true"] + .field-error, textarea[aria-invalid="true"] + .field-error{display:block}
.form-success{background:rgba(74,222,128,0.1);border:1px solid var(--ok);color:var(--ok);padding:14px 18px;border-radius:12px;margin-bottom:14px}
.form-error-summary{background:rgba(248,113,113,0.1);border:1px solid var(--err);color:var(--err);padding:14px 18px;border-radius:12px;margin-bottom:14px}
.empty-state{padding:80px 20px;text-align:center;color:var(--ink-mute)}
.empty-state-icon{font-size:56px;opacity:0.4;margin-bottom:14px}
.empty-state h3{font-size:18px;color:var(--ink);margin-bottom:8px}
.empty-state p{font-size:14px;max-width:380px;margin:0 auto}
.skeleton{background:linear-gradient(90deg,rgba(255,255,255,0.04) 0%,rgba(255,255,255,0.08) 50%,rgba(255,255,255,0.04) 100%);background-size:200% 100%;animation:skel 1.4s ease-in-out infinite;border-radius:6px}
@keyframes skel{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media (prefers-reduced-motion: reduce){.skeleton{animation:none}}


/* =========================================================
   PREFERS REDUCED MOTION - sitewide guard (WCAG 2.3.3)
========================================================= */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{
    animation-duration:0.001ms !important;
    animation-iteration-count:1 !important;
    transition-duration:0.001ms !important;
    scroll-behavior:auto !important;
  }
  .cinematic-intro,.hero-overlay,.hero-mark,.bee-shell,.nyanbee,.matrix-rain{animation:none !important;opacity:1 !important}
  .reveal-up,.reveal-fade,.reveal-scale{opacity:1 !important;transform:none !important}
}

/* =========================================================
   FOCUS-VISIBLE - keyboard outline that respects mouse users
========================================================= */
:focus-visible{outline:3px solid var(--honey);outline-offset:3px;border-radius:6px}
:focus:not(:focus-visible){outline:none}
button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible{outline:3px solid var(--honey);outline-offset:3px}


/* =========================================================
   AUTHOR / E-E-A-T BIOS
========================================================= */
.authors-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:32px}
.author-card{padding:26px;border:1px solid var(--rule);border-radius:12px;background:rgba(255,255,255,0.02)}
.author-init{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,var(--honey),var(--amber));color:var(--bg);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;margin-bottom:14px;font-family:'Space Grotesk',sans-serif;letter-spacing:0.03em}
.author-card h3{margin:0 0 4px;font-size:18px;font-weight:600}
.author-role{font-family:'Space Grotesk',sans-serif;font-size:13px;letter-spacing:0.08em;color:var(--honey);text-transform:uppercase;margin-bottom:10px}
@media (max-width:880px){.authors-grid{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.authors-grid{grid-template-columns:1fr}}


/* =========================================================
   STICKY BOTTOM CTA (mobile) + BOOKING CARD
========================================================= */
.sticky-cta{
  position:fixed;left:0;right:0;bottom:0;z-index:90;
  display:none;
  background:linear-gradient(180deg,rgba(0,0,0,0.5),rgba(0,0,0,0.96));
  border-top:1px solid rgba(255,193,7,0.3);
  padding:12px 16px env(safe-area-inset-bottom,12px) 16px;
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
}
.sticky-cta-row{display:flex;gap:12px;align-items:center;max-width:540px;margin:0 auto}
.sticky-cta-text{flex:1;min-width:0;font-size:13px;line-height:1.3;color:rgba(255,255,255,0.86)}
.sticky-cta-text b{color:var(--ink);display:block;font-size:14px;margin-bottom:1px}
.sticky-cta .btn{padding:11px 18px;font-size:13px;min-height:42px;white-space:nowrap;flex-shrink:0}
.sticky-cta-close{
  position:absolute;top:6px;right:8px;background:transparent;border:none;color:rgba(255,255,255,0.55);
  font-size:18px;cursor:pointer;padding:4px 8px;line-height:1;
}
.sticky-cta-close:hover{color:var(--ink)}
@media (max-width:760px){ .sticky-cta.show{display:block} body.has-sticky-cta{padding-bottom:78px} }

.booking-card{
  display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between;
  border:1px solid rgba(255,193,7,0.4);background:linear-gradient(135deg,rgba(255,193,7,0.06),transparent 70%);
  border-radius:18px;padding:24px 28px;margin:32px 0;
}
.booking-card-body{flex:1;min-width:240px}
.booking-card h3{margin:0 0 4px;font-size:18px}
.booking-card p{margin:0;color:var(--ink-mute);font-size:14px}
.booking-card .booking-actions{display:flex;gap:12px;flex-wrap:wrap}
.booking-card .btn{padding:12px 22px;font-size:14px}


/* =========================================================
   TRUST STRIP - anonymized buyer wall
========================================================= */
.trust-strip{padding:50px 0;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);background:rgba(255,255,255,0.015)}
.trust-strip-eyebrow{text-align:center;font-family:'Space Grotesk',sans-serif;font-size:12px;letter-spacing:0.22em;text-transform:uppercase;color:var(--ink-mute);margin-bottom:24px}
.trust-row{display:grid;grid-template-columns:repeat(6,1fr);gap:24px;align-items:center;max-width:1100px;margin:0 auto;padding:0 20px}
.trust-pill{display:flex;align-items:center;justify-content:center;gap:12px;padding:14px 12px;border:1px solid var(--rule);border-radius:12px;background:rgba(255,255,255,0.025);opacity:0.86;transition:opacity 0.2s ease}
.trust-pill:hover{opacity:1;border-color:rgba(255,193,7,0.4)}
.trust-pill svg{width:22px;height:22px;flex-shrink:0;opacity:0.85}
.trust-pill span{font-family:'Space Grotesk',sans-serif;font-size:13px;letter-spacing:0.06em;color:rgba(255,255,255,0.85);font-weight:500;white-space:nowrap}
@media (max-width:960px){.trust-row{grid-template-columns:repeat(3,1fr)}}
@media (max-width:520px){.trust-row{grid-template-columns:repeat(2,1fr);gap:16px}.trust-pill span{font-size:12px}}

/* =========================================================
   TESTIMONIALS
========================================================= */
.testimonials{padding:80px 0}
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:36px}
.testimonial{padding:30px 28px;border:1px solid var(--rule);border-radius:18px;background:linear-gradient(180deg,rgba(255,255,255,0.03),transparent 70%);position:relative}
.testimonial-quote-mark{color:var(--honey);font-family:'Space Grotesk',sans-serif;font-size:56px;line-height:0.5;height:24px;margin-bottom:8px;opacity:0.5;font-weight:700}
.testimonial blockquote{margin:0 0 22px;font-size:16px;line-height:1.55;color:var(--ink);font-weight:400}
.testimonial-attr{display:flex;align-items:center;gap:16px;padding-top:18px;border-top:1px solid var(--rule)}
.testimonial-avatar{width:44px;height:44px;border-radius:50%;background:linear-gradient(135deg,var(--honey),var(--amber));color:var(--bg);display:flex;align-items:center;justify-content:center;font-weight:700;font-size:14px;font-family:'Space Grotesk',sans-serif;flex-shrink:0}
.testimonial-meta b{display:block;font-size:14px;font-weight:600;color:var(--ink)}
.testimonial-meta span{display:block;font-size:12px;color:var(--ink-mute);font-family:'Space Grotesk',sans-serif}
@media (max-width:880px){.testimonial-grid{grid-template-columns:1fr}}


/* =========================================================
   MOBILE GRID SAFETY NET - guarantee no horizontal scroll
========================================================= */
@media (max-width:760px){
  .grid-3,.grid-2,.related-grid,.testimonial-grid,.authors-grid{grid-template-columns:1fr !important;gap:16px !important}
  .stats-grid,.hive-stats,.hive-tiers{grid-template-columns:repeat(2,1fr) !important;gap:16px !important}
  .bulk-tiers{grid-template-columns:repeat(2,1fr) !important;gap:12px !important}
  /* any wide table-like layout */
  .price-row{grid-template-columns:1fr !important}
  /* loosen padding on small screens */
  .container,.container.narrow{padding-left:20px !important;padding-right:20px !important}
}

/* =========================================================
   READABILITY FLOOR - bump smallest text on small screens
========================================================= */
@media (max-width:640px){
  .kicker,.eyebrow,.tag-pill,.muted.small,.footer-newsletter .small,
  .nav-col a .desc,.nav-feature p,.author-role,.case-metric span,
  .trust-strip-eyebrow,.testimonial-meta span,.price-row.price-head{font-size:13px !important}
  /* nav drawer text floor */
  .nav-drawer-section h5{font-size:13px !important}
  /* avoid sub-12 px body text */
  body{font-size:14px}
  p,li{font-size:14px;line-height:1.6}
}

/* =========================================================
   PREVENT HORIZONTAL OVERFLOW - global belt-and-braces
========================================================= */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,iframe{max-width:100%;height:auto}

/* =========================================================
   MOBILE NAVIGATION FALLBACK - if hamburger isn't already styled
========================================================= */
@media (max-width:880px){
  .nav-mega{display:none}
  .nav-toggle,.mobile-menu-btn{display:flex !important}
}

/* Tap-friendly link spacing in body text */
@media (pointer:coarse){
  main a:not(.btn):not(.btn-primary):not(.arr-link):not(.nav-link){
    padding:2px 0;display:inline-block;
  }
}

/* =================================================================
   PLUTOBEE DESIGN SYSTEM v2 (Day 1)
   Single source of truth. Existing pages migrate as we touch them.
================================================================= */
:root{
  /* Spacing — 4px base grid */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px;
  --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px;
  --s-9:96px; --s-10:128px;

  /* Type scale — 12 sizes max */
  --fs-12:12px; --fs-13:13px; --fs-14:14px; --fs-16:16px;
  --fs-18:18px; --fs-20:20px; --fs-24:24px; --fs-32:32px;
  --fs-40:40px; --fs-56:56px; --fs-80:80px;

  /* Line-heights */
  --lh-tight:1.1; --lh-snug:1.3; --lh-normal:1.5; --lh-relaxed:1.65;

  /* Radii — 5 values */
  --r-sm:6px; --r-md:12px; --r-lg:18px; --r-xl:24px; --r-pill:999px;

  /* Containers */
  --container-narrow:760px; --container:1100px; --container-wide:1280px;

  /* Section rhythm */
  --section-sm:64px; --section-md:96px; --section-lg:128px;

  /* Surfaces — collapsed from 7 to 3 */
  --surf-0:#0a0a0a; --surf-1:#121212; --surf-2:#1a1a1a;
  --rule-1:rgba(255,255,255,0.08); --rule-hover:rgba(255,193,7,0.4);

  /* Feedback */
  --ok:#4ade80; --warn:#fbbf24; --err:#f87171;

  /* Motion */
  --t-fast:140ms; --t-base:220ms; --t-slow:380ms;
  --e-out:cubic-bezier(0.16,1,0.3,1); --e-in-out:cubic-bezier(0.65,0,0.35,1);
}

/* ========== UNIFIED BUTTON SYSTEM ========== */
.btn{
  display:inline-flex; align-items:center; justify-content:center;
  gap:var(--s-2); padding:var(--s-3) var(--s-5);
  font:600 var(--fs-14)/1 'Inter','Inter Fallback',sans-serif; letter-spacing:0.005em;
  border-radius:var(--r-sm); border:1px solid transparent;
  cursor:pointer; text-decoration:none; white-space:nowrap;
  transition:transform var(--t-base) var(--e-out), background var(--t-fast) ease, border-color var(--t-fast) ease, color var(--t-fast) ease;
  min-height:44px;
}
.btn--primary, .btn.btn-primary, a.btn-primary:not(.btn){background:var(--honey); color:var(--bg); border-color:var(--honey)}
.btn--primary:hover, .btn.btn-primary:hover, a.btn-primary:not(.btn):hover{background:var(--honey-2); border-color:var(--honey-2); transform:translateY(-1px)}
.btn--secondary{background:transparent; color:var(--ink); border-color:var(--rule-1)}
.btn--secondary:hover{border-color:var(--honey); background:rgba(255,193,7,0.06)}
.btn--ghost, .btn.btn-ghost{background:transparent; color:var(--ink-dim); border-color:transparent}
.btn--ghost:hover, .btn.btn-ghost:hover{color:var(--ink); background:rgba(255,255,255,0.04)}
.btn--sm{padding:var(--s-2) var(--s-4); font-size:var(--fs-13); min-height:36px}
.btn--lg{padding:var(--s-4) var(--s-6); font-size:var(--fs-16); min-height:52px}
.btn[disabled]{opacity:0.5; cursor:not-allowed; transform:none}

/* ========== UNIFIED CARD SYSTEM ========== */
.card{
  padding:var(--s-6); border:1px solid var(--rule-1);
  border-radius:var(--r-lg); background:var(--surf-1);
  transition:border-color var(--t-base) var(--e-out), transform var(--t-base) var(--e-out);
}
.card:hover{border-color:var(--rule-hover); transform:translateY(-2px)}
.card--feature{background:linear-gradient(180deg,rgba(255,193,7,0.05),transparent 60%); border-color:rgba(255,193,7,0.3)}
.card--flush{padding:var(--s-4)}
.card--inline{display:flex; gap:var(--s-4); align-items:center}
.card--quiet:hover{transform:none; border-color:var(--rule-1)}

/* ========== UNIFIED SECTION RHYTHM ========== */
.section{padding-top:var(--section-md); padding-bottom:var(--section-md)}
.section--sm{padding-top:var(--section-sm); padding-bottom:var(--section-sm)}
.section--lg{padding-top:var(--section-lg); padding-bottom:var(--section-lg)}
.section--bordered{border-top:1px solid var(--rule-1)}
.section-head{max-width:680px; margin:0 auto var(--s-7); text-align:center}
.section-head h2{font-size:var(--fs-40); line-height:var(--lh-tight); margin:var(--s-2) 0 var(--s-3); letter-spacing:-0.02em}
.section-head .kicker{color:var(--honey); font:600 var(--fs-12)/1 'Space Grotesk','Grotesk Fallback'; letter-spacing:0.22em; text-transform:uppercase}
.section-head p{color:var(--ink-mute); font-size:var(--fs-16); line-height:var(--lh-relaxed); margin:var(--s-3) auto 0; max-width:560px}

/* ========== UNIFIED FORM ANATOMY ========== */
.field{display:flex; flex-direction:column; gap:var(--s-2); margin-bottom:var(--s-5)}
.field label, .field-label{font:500 var(--fs-13)/1.3 'Inter','Inter Fallback'; color:var(--ink); letter-spacing:0.01em}
.field label .req, .field-req{color:var(--honey); margin-left:2px; font-weight:600}
.field-control, .field input, .field textarea, .field select{
  padding:var(--s-3) var(--s-4); font:400 var(--fs-15)/1.4 'Inter','Inter Fallback';
  background:var(--surf-0); border:1px solid var(--rule-1); border-radius:var(--r-sm);
  color:var(--ink); transition:border-color var(--t-fast) ease, box-shadow var(--t-fast) ease;
  min-height:44px; box-sizing:border-box; width:100%;
}
.field-control:focus, .field input:focus, .field textarea:focus, .field select:focus{
  outline:none; border-color:var(--honey); box-shadow:0 0 0 3px rgba(255,193,7,0.18);
}
.field textarea{min-height:120px; resize:vertical; line-height:1.5}
.field-help{font:400 var(--fs-12)/1.4 'Inter','Inter Fallback'; color:var(--ink-mute); margin:0}
.field-error-msg{font:500 var(--fs-12)/1.4 'Inter','Inter Fallback'; color:var(--err); margin:0; display:none}
.field[data-state="error"] .field-error-msg, .field-control[aria-invalid="true"] + .field-error-msg{display:block}
.field[data-state="error"] .field-control, .field-control[aria-invalid="true"]{border-color:var(--err); box-shadow:0 0 0 3px rgba(248,113,113,0.16)}
.field[data-state="success"] .field-control{border-color:var(--ok)}
.field-checkbox{display:flex; gap:var(--s-3); align-items:flex-start; cursor:pointer}
.field-checkbox input[type="checkbox"]{width:18px; height:18px; min-height:18px; margin-top:2px; flex-shrink:0; accent-color:var(--honey)}
.field-checkbox span{font-size:var(--fs-14); color:var(--ink-dim); line-height:1.5}

/* ========== PAGE TOC (in-page jump nav) ========== */
.page-toc{
  position:sticky; top:88px;
  display:flex; flex-direction:column; gap:var(--s-2);
  padding:var(--s-4) var(--s-5);
  background:var(--surf-1); border:1px solid var(--rule-1); border-radius:var(--r-md);
  max-width:280px; align-self:flex-start;
  font-size:var(--fs-13);
}
.page-toc-label{font:600 var(--fs-12)/1 'Space Grotesk','Grotesk Fallback'; letter-spacing:0.18em; text-transform:uppercase; color:var(--honey); margin:0 0 var(--s-2)}
.page-toc ol{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:var(--s-1)}
.page-toc a{color:var(--ink-dim); text-decoration:none; display:block; padding:var(--s-2) 0; border-left:2px solid transparent; padding-left:var(--s-3); margin-left:-var(--s-3); transition:color var(--t-fast) ease, border-color var(--t-fast) ease}
.page-toc a:hover{color:var(--ink)}
.page-toc a[aria-current="true"], .page-toc a.active{color:var(--honey); border-left-color:var(--honey)}
.toc-layout{display:grid; grid-template-columns:240px 1fr; gap:var(--s-7); align-items:start; max-width:var(--container); margin:0 auto; padding:0 var(--s-5)}
@media (max-width:880px){
  .toc-layout{grid-template-columns:1fr}
  .page-toc{position:relative; top:0; max-width:none; margin-bottom:var(--s-5)}
  .page-toc ol{flex-direction:row; flex-wrap:wrap; gap:var(--s-2)}
  .page-toc a{padding:var(--s-2) var(--s-3); border:1px solid var(--rule-1); border-radius:var(--r-pill); border-left-width:1px; margin:0}
  .page-toc a[aria-current="true"]{border-color:var(--honey)}
}

/* ========== STAT ROW component ========== */
.stat-row{display:grid; grid-template-columns:repeat(4,1fr); gap:var(--s-5); margin-top:var(--s-7)}
.stat-row .stat{padding:var(--s-5); border:1px solid var(--rule-1); border-radius:var(--r-lg); background:var(--surf-1)}
.stat-big{font:600 var(--fs-56)/1 'Space Grotesk','Grotesk Fallback'; color:var(--honey); letter-spacing:-0.03em; margin:0 0 var(--s-2)}
.stat-label{font:500 var(--fs-13)/1.3 'Inter','Inter Fallback'; color:var(--ink-mute); text-transform:uppercase; letter-spacing:0.08em; margin:0}
@media (max-width:880px){.stat-row{grid-template-columns:1fr 1fr; gap:var(--s-3)}.stat-big{font-size:var(--fs-40)}}

/* ========== CALLOUT banner ========== */
.callout{
  display:flex; gap:var(--s-4); align-items:flex-start;
  padding:var(--s-5); border:1px solid var(--rule-1); border-radius:var(--r-md);
  background:var(--surf-1); margin:var(--s-5) 0;
}
.callout-icon{width:24px; height:24px; flex-shrink:0; color:var(--honey)}
.callout-body{flex:1}
.callout-body strong{display:block; color:var(--ink); margin-bottom:var(--s-1); font-weight:600}
.callout-body p{margin:0; color:var(--ink-dim); font-size:var(--fs-14); line-height:var(--lh-normal)}
.callout--warn{border-color:rgba(251,191,36,0.4); background:rgba(251,191,36,0.04)}
.callout--warn .callout-icon{color:var(--warn)}
.callout--err{border-color:rgba(248,113,113,0.4); background:rgba(248,113,113,0.04)}
.callout--err .callout-icon{color:var(--err)}
.callout--ok{border-color:rgba(74,222,128,0.4); background:rgba(74,222,128,0.04)}
.callout--ok .callout-icon{color:var(--ok)}

/* ========== TAG CHIP system ========== */
.chip{
  display:inline-flex; align-items:center; gap:var(--s-1);
  padding:var(--s-1) var(--s-3); border-radius:var(--r-pill);
  font:500 var(--fs-12)/1 'Inter','Inter Fallback'; letter-spacing:0.02em;
  background:rgba(255,255,255,0.05); border:1px solid var(--rule-1); color:var(--ink-dim);
}
.chip--honey{background:rgba(255,193,7,0.1); border-color:rgba(255,193,7,0.4); color:var(--honey)}
.chip--ok{background:rgba(74,222,128,0.1); border-color:rgba(74,222,128,0.4); color:var(--ok)}
.chip--warn{background:rgba(251,191,36,0.1); border-color:rgba(251,191,36,0.4); color:var(--warn)}

/* ========== PROGRESS indicator ========== */
.progress{display:flex; gap:var(--s-2); align-items:center; margin-bottom:var(--s-6)}
.progress-step{display:flex; align-items:center; gap:var(--s-2); flex:1}
.progress-dot{width:28px; height:28px; border-radius:50%; background:var(--surf-2); border:1px solid var(--rule-1); display:flex; align-items:center; justify-content:center; font:600 var(--fs-12)/1 'Inter'; color:var(--ink-mute); flex-shrink:0}
.progress-step--active .progress-dot{background:var(--honey); color:var(--bg); border-color:var(--honey)}
.progress-step--done .progress-dot{background:var(--surf-1); color:var(--honey); border-color:var(--honey)}
.progress-bar{flex:1; height:2px; background:var(--rule-1)}
.progress-step--done + .progress-bar, .progress-step--active ~ .progress-bar{background:var(--honey)}
.progress-label{font-size:var(--fs-12); color:var(--ink-mute); letter-spacing:0.02em}
.progress-step--active .progress-label, .progress-step--done .progress-label{color:var(--ink)}
@media (max-width:560px){.progress-label{display:none}}


/* =========================================================
   CARD SYSTEM v2 - composition shim
   Make existing card classes inherit the unified .card base
========================================================= */
.case-card, .testimonial, .author-card, .booking-card, .related-card,
.service-card, .product-card, .apply-role-card, .cta-card,
.svc-cta-card, .hive-card, .market-card, .pay-card{
  /* leave their custom layout intact; just inherit motion + token usage */
  transition: border-color var(--t-base) var(--e-out), transform var(--t-base) var(--e-out);
}
/* Hover affordance unified */
.case-card:hover, .testimonial:hover, .author-card:hover,
.related-card:hover, .service-card:hover, .product-card:hover{
  border-color: var(--rule-hover);
}


/* =========================================================
   Additional tokens — Solana brand colors + grayscale steps
========================================================= */
:root{
  --solana-purple:#9945FF; --solana-green:#14F195;
  --ink-soft:#e8e8e8; --ink-444:#444; --ink-888:#888;
  --surf-1f:#1f1f1f; --surf-0e:#0e0e0e; --surf-0f:#0f0f10;
}


/* =========================================================
   DESIGN RESTORATION
   Restore original fine-grained typography for specific UI
   surfaces that the scale collapse over-simplified.
========================================================= */
.kicker,.section-kicker,.eyebrow{font-size:11px !important;letter-spacing:0.22em !important;text-transform:uppercase}
.tag-pill,.brand-pill{font-size:10.5px !important;letter-spacing:0.16em !important}
.footer-tag{font-size:13.5px !important;line-height:1.55}
.footer-col h4{font-size:11px !important;letter-spacing:0.22em !important}
.footer-col a{font-size:13.5px !important}
.footer-bottom{font-size:11.5px !important}
.footer-newsletter h4{font-size:10.5px !important;letter-spacing:0.16em !important}
.footer-newsletter .small{font-size:11px !important}
.nav-col a .desc{font-size:11px !important;letter-spacing:0 !important}
.nav-feature .lbl{font-size:10px !important;letter-spacing:0.22em !important}
.nav-feature p{font-size:12.5px !important;line-height:1.55}
.nav-feature h5{font-size:15px !important}
.nav-drawer-section h5{font-size:10px !important;letter-spacing:0.22em !important}
.muted.small,.small{font-size:12.5px !important}
.hero-subtitle,.lead{font-size:17px !important;line-height:1.55}
.hero-title em{font-size:inherit !important;font-style:italic;font-weight:300}
.section-head p{font-size:15.5px !important}
.author-role{font-size:11.5px !important;letter-spacing:0.08em !important}
.testimonial-meta span{font-size:11.5px !important}
.case-metric b{font-size:36px !important;letter-spacing:-0.02em}
.case-metric span{font-size:10.5px !important;letter-spacing:0.14em !important}
.price-band{font-size:30px !important;letter-spacing:-0.01em}
.price-row.price-head{font-size:10.5px !important;letter-spacing:0.1em !important}
.testimonial-quote-mark{font-size:54px !important;line-height:0.5}
.stat-big{font-size:60px !important}
.related-title{font-size:30px !important}
.cinematic-restore .lead, .hero-lede{font-size:17px !important}
.cc-banner h4,.cc-modal-title{font-size:15px !important}
.cc-banner p{font-size:13px !important;line-height:1.55}
.cc-cat-name{font-size:13px !important}
.cc-cat-desc{font-size:12px !important;line-height:1.5}
.svc-hero-eyebrow{font-size:11px !important;letter-spacing:0.22em !important}
.svc-hero-meta{font-size:13px !important}


/* =========================================================
   Restore intentional spacing and radius
========================================================= */
.hero-cta{gap:18px !important}
.testimonial-grid{gap:22px !important}
.case-card{padding:32px !important;border-radius:18px !important}
.testimonial{padding:30px 28px !important;border-radius:18px !important}
.author-card{padding:26px !important;border-radius:14px !important}
.booking-card{padding:24px 28px !important;border-radius:16px !important;gap:18px !important}
.trust-pill{padding:14px 12px !important;gap:10px !important}
.field-control,.field input,.field textarea,.field select{padding:13px 14px !important;border-radius:10px !important}
.btn{padding:11px 22px !important;border-radius:8px !important;font-size:14px !important;min-height:44px !important}
.btn--lg{padding:14px 28px !important;font-size:15px !important;min-height:50px !important}
.btn--sm{padding:7px 14px !important;font-size:13px !important;min-height:36px !important}
.card{padding:28px !important;border-radius:14px !important}
.cc-banner-card{padding:22px 26px !important;border-radius:14px !important}
.cc-modal-shell{border-radius:18px !important}
.svc-card{border-radius:14px !important}
.market-card{border-radius:14px !important}
.product-card{border-radius:16px !important}
.related-card{padding:22px 24px !important;border-radius:14px !important}
.price-table{border-radius:14px !important}
.section-head{margin-bottom:42px !important}
.page-toc{border-radius:12px !important;padding:18px 20px !important}
.nav-drawer-section a{padding:12px 0 !important;font-size:17px !important}

/* =========================================================
   CINEMATIC HERO v2 — supporting layers
========================================================= */

/* Tighter, more atmospheric vignette with subtle pulse */
.hero-vignette{
  background:
    radial-gradient(ellipse at center 38%, transparent 28%, rgba(0,0,0,0.55) 78%, rgba(0,0,0,0.92) 100%),
    radial-gradient(ellipse at 50% 0%, rgba(255,193,7,0.04) 0%, transparent 60%);
  animation: hero-vignette-pulse 8s ease-in-out infinite;
}
@keyframes hero-vignette-pulse{
  0%,100%{opacity:1}
  50%{opacity:0.86}
}

/* Cinematic letterbox bars — slide in during act 0, slide out at logo lock */
.hero::before,
.hero::after{
  content:"";
  position:absolute; left:0; right:0;
  height:9vh; z-index:6;
  background:#050505;
  pointer-events:none;
  transform-origin:center;
  animation: hero-letterbox 4200ms cubic-bezier(0.22,1,0.36,1) forwards;
  will-change: transform;
}
.hero::before{ top:0; transform: translateY(-100%); }
.hero::after{  bottom:0; transform: translateY(100%); }
@keyframes hero-letterbox{
  0%   { transform: translateY(-100%); }
  18%  { transform: translateY(0); }
  62%  { transform: translateY(0); }
  100% { transform: translateY(-100%); }
}
.hero::after{
  animation-name: hero-letterbox-bottom;
}
@keyframes hero-letterbox-bottom{
  0%   { transform: translateY(100%); }
  18%  { transform: translateY(0); }
  62%  { transform: translateY(0); }
  100% { transform: translateY(100%); }
}

/* Character-split title baseline + premium gradient sweep on ignition */
.hero-title .ch{
  display:inline-block;
  will-change: transform, opacity;
  transform-origin: 50% 100%;
}
.hero-title em .ch{
  background:linear-gradient(135deg,var(--honey),var(--amber));
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
}

/* Mark glow ring — sits behind the SVG bee */
.hero-mark{
  position:relative;
}
.hero-mark::before{
  content:"";
  position:absolute; inset:-30%;
  border-radius:50%;
  background: radial-gradient(circle, rgba(255,193,7,0.22) 0%, rgba(255,193,7,0.08) 35%, transparent 70%);
  filter: blur(20px);
  opacity:0;
  transition: opacity 1.4s ease;
  pointer-events:none;
  z-index:-1;
}
.hero-mark[style*="opacity: 1"]::before,
.hero-mark[style*="opacity:1"]::before{ opacity:1; }

/* Canvas micro-shake helper (the JS sets transform on canvas directly) */
#heroCanvas{ transition: transform 60ms linear; }

/* Subtle CTA halo */
.hero-cta .btn-primary{
  position:relative;
  box-shadow: 0 8px 32px rgba(255,193,7,0.18), inset 0 1px 0 rgba(255,255,255,0.18);
  transition: box-shadow .35s ease, transform .35s ease;
}
.hero-cta .btn-primary:hover{
  box-shadow: 0 12px 40px rgba(255,193,7,0.32), inset 0 1px 0 rgba(255,255,255,0.24);
  transform: translateY(-1px);
}

/* Make sure the scroll hint pulses gently to draw the eye after settle */
.hero-scrollhint{
  animation: hero-scroll-pulse 2.6s ease-in-out infinite;
  animation-delay: 10s;
}
@keyframes hero-scroll-pulse{
  0%,100%{ opacity:0.55; transform: translateY(0) }
  50%   { opacity:1.00; transform: translateY(4px) }
}

/* Reduced motion: kill the letterbox animation, freeze vignette */
@media (prefers-reduced-motion: reduce){
  .hero::before, .hero::after{ display:none }
  .hero-vignette{ animation:none }
  .hero-scrollhint{ animation:none; opacity:0.7 }
}

/* Mobile: tighter letterbox so it doesn't eat content space, drop sparkle layer cost via JS */
@media (max-width:760px){
  .hero::before, .hero::after{ height: 6vh; }
}


/* =========================================================
   PWA install hint (after 30s on PWA-eligible browsers)
========================================================= */
.pwa-install-hint{
  position:fixed; bottom:24px; right:24px; z-index:80;
  display:flex; align-items:center; gap:12px;
  padding:14px 18px;
  background:linear-gradient(135deg,rgba(255,193,7,0.95),rgba(255,138,0,0.95));
  color:#000; border-radius:12px;
  box-shadow:0 20px 60px rgba(0,0,0,0.5);
  max-width:380px;
  font-family:'Inter','Inter Fallback',sans-serif;
  animation: pwa-install-in 0.4s cubic-bezier(0.16,1,0.3,1);
}
.pwa-install-body{display:flex; flex-direction:column; flex:1; min-width:0}
.pwa-install-body b{font-weight:600; font-size:14px; margin-bottom:2px}
.pwa-install-body span{font-size:12px; color:#1a1a1a; opacity:0.85}
.pwa-install-btn{background:#000; color:#fff; border:none; padding:10px 18px; border-radius:8px; font-weight:600; font-size:13px; cursor:pointer; flex-shrink:0}
.pwa-install-btn:hover{background:#1a1a1a}
.pwa-install-close{background:transparent; border:none; color:#000; font-size:18px; cursor:pointer; opacity:0.55; padding:2px 6px; line-height:1}
.pwa-install-close:hover{opacity:1}
@keyframes pwa-install-in{from{opacity:0; transform:translateY(20px)} to{opacity:1; transform:translateY(0)}}
@media (max-width:560px){.pwa-install-hint{left:16px; right:16px; bottom:16px; max-width:none}}

/* =========================================================
   ROI CALCULATOR (pricing page)
========================================================= */
.roi-calc{
  background:linear-gradient(180deg,rgba(255,193,7,0.04),transparent 70%);
  border:1px solid rgba(255,193,7,0.3);
  border-radius:18px;
  padding:40px;
  margin:32px 0;
}
.roi-calc h3{margin:0 0 8px; font-size:24px}
.roi-calc .roi-form{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px}
.roi-calc .field{margin-bottom:0}
.roi-calc input[type="range"]{width:100%; accent-color:var(--honey); margin-top:8px}
.roi-calc .roi-out{
  margin-top:32px; padding:24px; background:rgba(0,0,0,0.4); border-radius:12px;
  border:1px solid var(--rule);
}
.roi-calc .roi-big{font-family:'Space Grotesk',sans-serif; font-size:48px; font-weight:600; color:var(--honey); letter-spacing:-0.02em; line-height:1}
.roi-calc .roi-label{font-family:'Space Grotesk',sans-serif; font-size:11px; letter-spacing:0.18em; text-transform:uppercase; color:var(--ink-mute); margin-bottom:6px}
.roi-calc .roi-comp{display:grid; grid-template-columns:1fr 1fr; gap:24px; margin-top:24px}
@media (max-width:760px){.roi-calc .roi-form,.roi-calc .roi-comp{grid-template-columns:1fr}}

/* =========================================================
   CAL.COM EMBED scaffold (book a call inline)
========================================================= */
.cal-inline{
  margin:32px 0; padding:32px;
  background:rgba(255,255,255,0.02);
  border:1px solid var(--rule); border-radius:18px;
  text-align:center;
}
.cal-inline h3{font-size:22px; margin:0 0 8px}
.cal-inline p{color:var(--ink-mute); margin:0 0 18px}
.cal-inline .cal-iframe-wrap{
  width:100%; height:560px;
  background:rgba(0,0,0,0.3); border-radius:12px;
  overflow:hidden; position:relative;
}
.cal-inline iframe{width:100%; height:100%; border:none}
.cal-placeholder{
  position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center;
  gap:18px; color:var(--ink-mute);
  font-family:'Space Grotesk',sans-serif;
}
.cal-placeholder .pulse{
  width:48px; height:48px; border-radius:50%;
  background:var(--honey); opacity:0.3;
  animation: cal-pulse 1.6s ease-in-out infinite;
}
@keyframes cal-pulse{
  0%,100%{transform:scale(0.8); opacity:0.3}
  50%{transform:scale(1.1); opacity:0.7}
}
