/* =====================================================================
   微链道爱 DaoAI · Official Site
   Design system distilled from the Series C deck:
   warm dark ⇄ cream alternation · antique gold + terracotta accents
   serif CJK display headlines · golden-ratio spiral motif
   ===================================================================== */

:root {
  /* surfaces */
  --dark:        #1a1613;
  --dark-2:      #221d18;
  --dark-card:   #262019;
  --dark-line:   #3a3127;
  --cream:       #f4f0e7;
  --cream-2:     #efe9dc;
  --white:       #ffffff;

  /* ink */
  --ink:         #221c16;   /* on cream */
  --ink-soft:    #6f655a;
  --paper:       #efe9dd;   /* on dark */
  --paper-soft:  #b8ad9d;   /* brightened for WCAG AA body contrast on dark cards */

  /* accents */
  --gold:        #c2a14f;
  --gold-soft:   #d8bd78;
  --red:         #bc4135;   /* terracotta, slightly desaturated for editorial restraint */
  --red-soft:    #ca6050;
  --violet:      #8b6ea8;

  --maxw: 1180px;
  --radius: 16px;
  --radius-lg: 22px;
  --ease: cubic-bezier(.22,.61,.36,1);

  /* golden / Fibonacci spacing scale — each step ≈ ×φ (1.618). math = rhythm. */
  --sp-xs: 8px; --sp-sm: 13px; --sp-md: 21px; --sp-lg: 34px;
  --sp-xl: 55px; --sp-2xl: 89px; --sp-3xl: 144px;
  --phi: 1.618;            /* golden ratio */
  --measure: 729px;        /* container × 0.618 — golden reading width */

  --serif: "Songti SC", "STSongti-SC-Regular", "Source Han Serif SC",
           "Noto Serif SC", "SimSun", "Times New Roman", Georgia, serif;
  --sans:  -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC",
           "Microsoft YaHei", "Hiragino Sans GB", "Noto Sans SC", Roboto, Arial, sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; scroll-padding-top: 96px; }

body {
  margin: 0;
  font-family: var(--sans);
  background: var(--cream);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  line-height: 1.6;
  overflow-x: hidden;
}

/* fine film grain — physical, editorial texture (carries the whole page, restrained) */
body::after {
  content: ""; position: fixed; inset: 0; z-index: 70; pointer-events: none;
  opacity: .045; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

img, svg { display: block; }
a { color: inherit; text-decoration: none; }

/* keyboard focus ring — zero-specificity (:where) so component :hover styles still win */
:where(a, button, summary, input, select, textarea, [tabindex]):focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
  border-radius: 4px;
}

.wrap { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 28px; }

/* no-JS / crawler fallback navigation (rendered only when scripts are disabled) */
.static-nav { max-width: var(--maxw); margin: 0 auto; padding: 16px 28px; display: flex; flex-wrap: wrap; gap: 8px 18px; font-size: 13px; border-bottom: 1px solid rgba(0,0,0,.1); }
.static-nav a { color: var(--gold); text-decoration: underline; }

.ic { width: 22px; height: 22px; flex: none; }
.ic--red { color: var(--red); }
.ic--gold { color: var(--gold); }
.ic--violet { color: var(--violet); }

/* ---------- reveal animation ---------- */
[data-reveal] {
  opacity: 0;
  transform: translateY(26px);
  transition: opacity .7s var(--ease), transform .7s var(--ease);
}
[data-reveal].in { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
  [data-reveal] { opacity: 1; transform: none; transition: none; }
  html { scroll-behavior: auto; }
}

/* =====================================================================
   BRAND LOCKUP
   ===================================================================== */
.brand { display: inline-flex; align-items: center; gap: 11px; }
.brand__box {
  font-size: 13px; font-weight: 700; letter-spacing: .18em;
  border: 1.5px solid currentColor; padding: 4px 8px 3px; line-height: 1;
  border-radius: 3px;
}
.brand__logo { height: 60px; width: auto; }
.brand__logo--lg { height: 80px; }
.brand__div { width: 1px; height: 20px; background: currentColor; opacity: .35; }
.brand__daoai { font-size: 19px; font-weight: 600; letter-spacing: .14em; }
.brand__phi { color: var(--gold); }

/* =====================================================================
   NAV
   ===================================================================== */
.nav {
  position: fixed; inset: 0 0 auto 0; z-index: 60;
  height: 96px; display: flex; align-items: center;
  color: var(--paper);
  transition: background .4s var(--ease), height .4s var(--ease), box-shadow .4s var(--ease), color .4s var(--ease);
}
.nav.scrolled {
  height: 84px;
  background: rgba(20,16,13,.86);
  backdrop-filter: blur(14px) saturate(140%);
  box-shadow: 0 1px 0 rgba(194,161,79,.16);
}
.nav__inner { display: flex; align-items: center; justify-content: space-between; }
.nav__links { display: flex; align-items: center; gap: 30px; }
.nav__links a { font-size: 14.5px; letter-spacing: .02em; opacity: .82; transition: opacity .2s, color .2s; }
.nav__links a:hover { opacity: 1; color: var(--gold-soft); }
.nav__cta {
  border: 1.4px solid rgba(216,189,120,.55); border-radius: 30px;
  padding: 8px 18px; opacity: 1 !important; color: var(--gold-soft);
}
.nav__cta:hover { background: var(--gold); color: #1c160c !important; border-color: var(--gold); }

.nav__burger { display: none; background: none; border: 0; cursor: pointer; padding: 8px; }
.nav__burger span { display: block; width: 24px; height: 2px; background: currentColor; margin: 5px 0; transition: .3s var(--ease); }
.nav__burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav__burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.nav__burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* =====================================================================
   KICKERS + SECTION HEADS
   ===================================================================== */
.kicker {
  font-size: 12px; font-weight: 600; letter-spacing: .22em; text-transform: uppercase;
  display: inline-flex; align-items: center; gap: 10px; color: var(--ink-soft); margin: 0 0 18px;
}
.kicker::before { content: ""; width: 26px; height: 1.5px; background: currentColor; opacity: .6; }
.kicker--gold { color: var(--gold); }
.kicker--red  { color: var(--red); }
.kicker--violet { color: var(--violet); }

/* consistent tight tracking on serif headings ≥ ~20px (premium display polish, site-wide) */
.curve h3, .bigcard__head h3, .wcard h3, .arch__base h3, .moat__why h3, .console__model h4, .lucard h4, .team__foot, .pullquote { letter-spacing: -.005em; }

.shead { max-width: var(--measure); margin: 0 0 var(--sp-xl); }
.shead--mini { margin-top: 70px; margin-bottom: 30px; }
.shead__title {
  font-family: var(--serif); font-weight: 700;
  font-size: clamp(28px, 4vw, 46px); line-height: 1.12; letter-spacing: -.005em;
  margin: 0 0 16px;
}
.shead__sub { font-size: clamp(15px, 1.4vw, 17px); color: var(--ink-soft); margin: 0; max-width: 640px; }
.shead__sub b { color: var(--ink); font-weight: 600; }

/* =====================================================================
   BANDS / SECTIONS
   ===================================================================== */
.band { position: relative; }
.band--dark  { background: radial-gradient(125% 120% at 50% 36%, #1f1914 0%, #1a1613 46%, #131017 100%); color: var(--paper); }
.band--dark .shead__title { color: var(--paper); }
.band--dark .shead__sub { color: var(--paper-soft); }
.band--dark .shead__sub b { color: var(--paper); }
.band--cream { background: radial-gradient(125% 122% at 50% 28%, #f7f3ea 0%, #f4f0e7 55%, #ece5d7 100%); color: var(--ink); }
.band--cream + .band--cream { border-top: 1px solid rgba(0,0,0,.05); }

.section { padding: 104px 0 112px; }   /* breathing room, optical bottom bias */
.section--tight { padding-bottom: 70px; }

/* =====================================================================
   HERO
   ===================================================================== */
.hero {
  position: relative; display: flex; align-items: center;
  background:
    radial-gradient(120% 80% at 78% 18%, rgba(194,161,79,.10), transparent 55%),
    linear-gradient(160deg, #14100c 0%, #1a1613 55%, #221c14 100%);
  color: var(--paper); padding: 60px 0 78px;
}
/* golden-section hero composition (no decorative spiral; layout IS the ratio) */
.hero__inner { position: relative; display: flex; align-items: center; min-height: 460px; }
.hero__copy { width: 61.8%; }                 /* 1 : 0.618 golden section */
.hero__inner::after {                          /* the golden-section line */
  content: ""; position: absolute; left: 61.8%; top: 6%; bottom: 6%; width: 1px;
  background: linear-gradient(180deg, transparent, rgba(194,161,79,.42) 28%, rgba(194,161,79,.42) 72%, transparent);
}
.hero__title { font-family: var(--serif); font-weight: 800; margin: 20px 0 24px; }
/* two-tier headline: big hook + smaller qualifier = built-in hierarchy + controlled wrap */
.hero__title-xl { display: block; font-size: clamp(50px, 7vw, 94px); line-height: 1.0; letter-spacing: -.005em; color: #fbf8f1; }
.hero__title-sm {
  display: block; margin-top: 14px; font-size: clamp(22px, 2.9vw, 38px);
  line-height: 1.18; font-weight: 600; letter-spacing: .015em; color: var(--paper);
}
.hero__title-sm::before { content: ""; display: inline-block; width: 30px; height: 2px; background: var(--gold); vertical-align: middle; margin: 0 14px 6px 0; opacity: .85; }
.hero__rule { display: block; width: 76px; height: 3px; background: var(--gold); margin: 26px 0 22px; border-radius: 2px; }
.hero__en {
  font-family: Georgia, "Times New Roman", var(--serif); font-style: italic; font-weight: 600;
  font-size: clamp(16px, 1.8vw, 22px); color: var(--gold-soft); margin: 0 0 26px; letter-spacing: .01em;
}
.hero__sub { font-size: clamp(14.5px, 1.4vw, 17px); color: var(--paper-soft); margin: 0 0 26px; max-width: 540px; line-height: 1.78; }
.hero__actions { display: flex; flex-wrap: wrap; gap: 14px; margin-bottom: 46px; }

.hero__stats { display: flex; gap: 42px; flex-wrap: wrap; }
.hero__stats b {
  font-family: var(--serif); font-weight: 700; font-size: 34px; color: #fbf8f1;
  display: block; line-height: 1;
}
.hero__stats small { font-size: 16px; color: var(--gold-soft); margin-left: 2px; }
.hero__stats span { font-size: 13px; color: var(--paper-soft); letter-spacing: .04em; }

.hero__art { position: relative; display: flex; align-items: center; justify-content: center; }
.spiral { width: 100%; max-width: 440px; color: var(--gold); }
.spiral__grid { opacity: .45; }
.spiral__path { opacity: .92; filter: drop-shadow(0 0 12px rgba(194,161,79,.35)); }
.hero__phi {
  position: absolute; left: 61.8%; top: 50%; transform: translate(14px, -50%);
  writing-mode: vertical-rl; font-family: Georgia, serif; font-style: italic;
  font-size: 13px; letter-spacing: 2px; color: var(--gold); opacity: .65;
}

.hero__scroll {
  display: none;  /* hero no longer the full-screen opener (manifesto leads) */
  position: absolute; left: 50%; bottom: 26px; transform: translateX(-50%);
  width: 34px; height: 34px; color: var(--gold-soft); opacity: .7;
  animation: bob 2.4s var(--ease) infinite;
}
.hero__scroll svg { width: 100%; height: 100%; }
@keyframes bob { 0%,100%{ transform: translateX(-50%) translateY(0); } 50%{ transform: translateX(-50%) translateY(8px); } }

/* =====================================================================
   VISION / MANIFESTO
   ===================================================================== */
.vision { padding: 132px 0 84px; }
/* manifesto leads the page — warm gold glow ties it to the hero below */
.band--dark.vision { background: radial-gradient(120% 78% at 80% 14%, rgba(194,161,79,.07), transparent 58%), var(--dark); }
.vision__statement {
  font-family: var(--serif); font-weight: 700;
  font-size: clamp(28px, 4.6vw, 56px); line-height: 1.16; letter-spacing: -.01em;
  margin: 8px 0 30px; color: #fbf8f1; max-width: 14ch; max-width: 980px;
}
.vision__statement em { font-style: normal; color: var(--red-soft); }
.vision__body { font-size: clamp(15px, 1.5vw, 18px); color: var(--paper-soft); max-width: 760px; margin: 0; }
.vision__body b { color: var(--paper); font-weight: 600; }

/* =====================================================================
   GRIDS
   ===================================================================== */
.grid { display: grid; gap: var(--sp-md); }
.grid-2 { grid-template-columns: repeat(2, 1fr); }
.grid-3 { grid-template-columns: repeat(3, 1fr); }
.grid-4 { grid-template-columns: repeat(4, 1fr); }

/* ---------- problem cards (on cream) ---------- */
.pcard {
  background: var(--white); border-radius: var(--radius); padding: 30px 26px 28px;
  box-shadow: 0 1px 2px rgba(40,30,20,.04), 0 18px 40px -28px rgba(40,30,20,.30);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.pcard:hover { transform: translateY(-6px); box-shadow: 0 24px 50px -26px rgba(40,30,20,.40); }
.pcard__top { display: flex; align-items: center; justify-content: space-between; margin-bottom: 18px; }
.pcard__no { font-family: var(--serif); font-weight: 700; font-size: 30px; color: var(--red); }
.pcard__top .ic { width: 26px; height: 26px; }
.pcard h3 { font-size: 18px; margin: 0 0 10px; font-weight: 700; }
.pcard p { font-size: 14px; color: var(--ink-soft); margin: 0; }

/* ---------- foundation cards (on dark) ---------- */
.fcard {
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.01));
  border: 1px solid var(--dark-line); border-radius: var(--radius); padding: 30px 26px;
  transition: transform .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease);
}
.fcard:hover { transform: translateY(-6px); border-color: rgba(194,161,79,.5); }
.fcard__head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.fcard__head .ic { width: 30px; height: 30px; }
/* fcards that use a bare <svg class="ic"> (e.g. wemio) — match the headed-card icon size */
.fcard > .ic { width: 30px; height: 30px; margin-bottom: 16px; }
.fcard__no { font-family: var(--serif); font-weight: 700; font-size: 30px; color: var(--gold); }
.fcard h3 { font-size: 19px; margin: 0 0 10px; color: #fbf8f1; }
.fcard h3 em { display: block; font-style: normal; font-size: 11px; letter-spacing: .22em; color: var(--red-soft); margin-top: 5px; font-weight: 600; }
.fcard p { font-size: 14px; color: var(--paper-soft); margin: 0; }

/* =====================================================================
   ARCHITECTURE: three curves over base
   ===================================================================== */
.arch__curves { display: grid; grid-template-columns: repeat(4, 1fr); gap: 18px; }
.curve {
  position: relative; border-radius: var(--radius); padding: 30px 26px 28px;
  background: var(--white); border: 1px solid rgba(0,0,0,.05);
  box-shadow: 0 18px 40px -30px rgba(40,30,20,.35);
  transition: transform .35s var(--ease), box-shadow .35s var(--ease);
}
.curve:hover { transform: translateY(-7px); box-shadow: 0 26px 54px -28px rgba(40,30,20,.45); }
.curve::before { content: ""; position: absolute; inset: 0 0 auto 0; height: 4px; border-radius: var(--radius) var(--radius) 0 0; }
.curve--red::before { background: var(--red); }
.curve--gold::before { background: var(--gold); }
.curve--violet::before { background: var(--violet); }
.curve__tag { font-size: 12px; font-weight: 700; letter-spacing: .1em; margin-bottom: 16px; }
.curve--red .curve__tag { color: var(--red); }
.curve--gold .curve__tag { color: #a9852b; }
.curve--violet .curve__tag { color: var(--violet); }
.curve__icon { width: 46px; height: 46px; border-radius: 12px; display: grid; place-items: center; margin-bottom: 16px; }
.curve__icon .ic { width: 24px; height: 24px; }
.curve--red .curve__icon { background: rgba(192,57,43,.10); color: var(--red); }
.curve--gold .curve__icon { background: rgba(194,161,79,.16); color: #a9852b; }
.curve--violet .curve__icon { background: rgba(139,110,168,.14); color: var(--violet); }
.curve h3 { font-family: var(--serif); font-size: 24px; margin: 0 0 6px; font-weight: 700; }
.curve__lead { font-size: 13px; font-weight: 600; color: var(--ink); margin: 0 0 12px; }
.curve--red .curve__lead { color: var(--red); }
.curve--gold .curve__lead { color: #a9852b; }
.curve--violet .curve__lead { color: var(--violet); }
.curve p { font-size: 14px; color: var(--ink-soft); margin: 0; }
.curve b { color: var(--ink); font-weight: 600; }

.arch__arrows { display: grid; grid-template-columns: repeat(4, 1fr); text-align: center; color: var(--red); font-size: 22px; margin: 14px 0; opacity: .6; }
.arch__base {
  display: flex; gap: 22px; align-items: center;
  background: var(--dark); color: var(--paper); border-radius: var(--radius);
  padding: 26px 30px; border: 1px solid var(--dark-line);
}
.arch__base-icon { width: 54px; height: 54px; flex: none; border-radius: 14px; background: rgba(192,57,43,.14); display: grid; place-items: center; }
.arch__base-icon .ic { width: 28px; height: 28px; }
.arch__base h3 { font-family: var(--serif); font-size: 22px; margin: 0 0 6px; color: #fbf8f1; }
.arch__base h3 em { font-style: normal; font-size: 11px; letter-spacing: .2em; color: var(--gold); margin-left: 10px; }
.arch__base p { font-size: 14px; color: var(--paper-soft); margin: 0; }

/* =====================================================================
   BIG CARDS (industrial), tick lists
   ===================================================================== */
.bigcard {
  background: var(--white); color: var(--ink); border-radius: var(--radius-lg); padding: 34px 32px;
  box-shadow: 0 18px 44px -30px rgba(40,30,20,.34); border: 1px solid rgba(0,0,0,.04);
}
.bigcard__head { display: flex; align-items: center; gap: 16px; margin-bottom: 22px; }
.bigcard__head .ic { width: 34px; height: 34px; padding: 9px; box-sizing: content-box; border: 1.5px solid currentColor; border-radius: 50%; }
.bigcard__head h3 { font-family: var(--serif); font-size: 23px; margin: 0; }
.bigcard__head span { font-size: 13px; color: var(--red); font-weight: 600; }

.ticks { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.ticks li { display: flex; gap: 13px; align-items: flex-start; }
.ticks .ic { width: 20px; height: 20px; margin-top: 3px; }
.ticks b { font-size: 15px; display: block; }
.ticks p { font-size: 13.5px; color: var(--ink-soft); margin: 3px 0 0; }
.ticks--light b { color: #fbf8f1; }
.ticks--light p { color: var(--paper-soft); }

.pullquote {
  font-family: var(--serif); font-style: italic; text-align: center;
  font-size: clamp(17px, 2.1vw, 24px); color: var(--red); margin: 44px auto 0; max-width: 900px; line-height: 1.5;
}

/* =====================================================================
   SKYVISION small cards (on dark)
   ===================================================================== */
.scard {
  background: linear-gradient(180deg, rgba(255,255,255,.035), rgba(255,255,255,.012));
  border: 1px solid var(--dark-line); border-radius: var(--radius); padding: 26px 24px;
  transition: transform .35s var(--ease), border-color .35s var(--ease);
}
.scard:hover { transform: translateY(-5px); border-color: rgba(216,189,120,.45); }
.scard--ink { background: var(--white); border-color: rgba(0,0,0,.05); box-shadow: 0 18px 40px -32px rgba(40,30,20,.26); }
.scard--ink h3 { color: var(--ink); }
.scard--ink p { color: var(--ink-soft); }
.scard--ink:hover { border-color: rgba(192,57,43,.4); }
.scard--ink h3 { color: var(--ink); }
.scard--ink p { color: var(--ink-soft); }
.scard .ic { width: 28px; height: 28px; margin-bottom: 16px; }
.scard h3 { font-size: 17px; margin: 0 0 8px; color: #fbf8f1; }
.scard p { font-size: 13.5px; color: var(--paper-soft); margin: 0; }

/* =====================================================================
   WEMIO
   ===================================================================== */
.wcard { border-radius: var(--radius-lg); padding: 34px 32px; }
.wcard__label { font-size: 12px; font-weight: 700; letter-spacing: .08em; display: block; margin-bottom: 14px; }
.wcard h3 { font-family: var(--serif); font-size: clamp(22px, 2.6vw, 30px); margin: 0 0 14px; }
.wcard p { font-size: 14.5px; margin: 0; line-height: 1.65; }
.wcard--muted { background: var(--cream-2); border: 1px solid rgba(0,0,0,.06); }
.wcard--muted .wcard__label { color: var(--ink-soft); }
.wcard--muted h3 { color: var(--ink); }
.wcard--muted p { color: var(--ink-soft); }
.wcard--hero {
  background: linear-gradient(150deg, #2a2030, #221b27);
  color: var(--paper); border: 1px solid rgba(139,110,168,.4);
  box-shadow: 0 24px 60px -34px rgba(80,50,110,.6);
}
.wcard--hero .wcard__label { color: #c4a9dd; }
.wcard--hero h3 { color: #fbf8f1; }
.wcard--hero p { color: #d8cfe0; }

.wemio__goal {
  display: flex; align-items: center; gap: 22px; margin-top: 24px;
  background: var(--white); border: 1px solid rgba(139,110,168,.25); border-radius: var(--radius-lg);
  padding: 26px 30px; box-shadow: 0 18px 44px -32px rgba(40,30,20,.3);
}
.wemio__goal-icon { width: 54px; height: 54px; flex: none; border-radius: 14px; background: rgba(139,110,168,.12); display: grid; place-items: center; }
.wemio__goal-icon .ic { width: 28px; height: 28px; }
.wemio__goal-text { flex: 1; }
.wemio__goal-text b { font-size: 18px; display: block; }
.wemio__goal-text span { font-size: 13.5px; color: var(--ink-soft); }
.wemio__goal-badge {
  font-family: var(--serif); font-weight: 700; font-size: 24px; color: var(--violet);
  white-space: nowrap; padding-left: 22px; border-left: 1px solid rgba(0,0,0,.1);
}

/* =====================================================================
   PLATFORM CONSOLE + HARDWARE
   ===================================================================== */
.platform { display: grid; grid-template-columns: 1fr 1.618fr; gap: var(--sp-xl); align-items: center; }
.console {
  background: linear-gradient(155deg, #211b14, #2a2118);
  border: 1px solid var(--dark-line); border-radius: var(--radius-lg); padding: 30px 32px;
  box-shadow: 0 30px 70px -40px rgba(0,0,0,.7);
}
.console__eyebrow { font-size: 11px; font-weight: 700; letter-spacing: .2em; color: var(--gold); margin: 0 0 18px; }
.console__model { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; }
.console__model h4 { font-family: var(--serif); font-size: 22px; margin: 0 0 4px; color: #fbf8f1; }
.console__model span { font-size: 12.5px; color: var(--paper-soft); }
.console__big { font-family: var(--serif); font-weight: 800; font-size: 44px; line-height: 1; color: var(--red-soft); }
.console__big i { font-style: normal; font-size: 20px; }
.console__src { font-size: 12px; color: var(--paper-soft); display: block; margin: 6px 0 24px; text-align: right; }
.console__stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.console__stats > div { background: rgba(255,255,255,.04); border: 1px solid var(--dark-line); border-radius: 12px; padding: 16px 14px; }
.console__stats b { font-family: var(--serif); font-weight: 700; font-size: 26px; color: #fbf8f1; display: block; line-height: 1; }
.console__stats i { font-style: normal; font-size: 14px; color: var(--gold-soft); }
.console__stats span { font-size: 12px; color: var(--paper-soft); margin-top: 6px; display: block; }

.hwrow .grid-4 { margin-top: 8px; }
.hwcard {
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  border: 1px solid var(--dark-line); border-radius: var(--radius); padding: 26px 22px;
  transition: transform .35s var(--ease), border-color .35s var(--ease);
}
.hwcard:hover { transform: translateY(-5px); border-color: rgba(192,57,43,.45); }
.hwcard .ic { width: 26px; height: 26px; padding: 9px; box-sizing: content-box; border: 1.4px solid currentColor; border-radius: 50%; margin-bottom: 16px; }
.hwcard h4 { font-family: var(--serif); font-size: 18px; margin: 0 0 4px; color: #fbf8f1; }
.hwcard span { font-size: 12px; color: var(--red-soft); font-weight: 600; display: block; margin-bottom: 8px; }
.hwcard p { font-size: 13px; color: var(--paper-soft); margin: 0; }

.specbar {
  display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 22px;
  background: linear-gradient(155deg, #1f1912, #271f16); border: 1px solid var(--dark-line);
  border-radius: var(--radius); padding: 26px 24px;
}
.specbar > div { text-align: left; }
.specbar b { font-family: var(--serif); font-weight: 700; font-size: 30px; color: #fbf8f1; display: block; line-height: 1; }
.specbar i { font-style: normal; font-size: 14px; color: var(--gold-soft); }
.specbar span { font-size: 12px; color: var(--paper-soft); margin-top: 6px; display: block; }

/* =====================================================================
   PROOF / CUSTOMERS
   ===================================================================== */
.ccard {
  background: var(--white); border-radius: var(--radius); padding: 28px 24px;
  box-shadow: 0 18px 40px -30px rgba(40,30,20,.3); border: 1px solid rgba(0,0,0,.04);
  transition: transform .35s var(--ease);
}
.ccard:hover { transform: translateY(-6px); }
.ccard__head { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.ccard__head .ic { width: 22px; height: 22px; padding: 7px; box-sizing: content-box; border: 1.4px solid currentColor; border-radius: 50%; }
.ccard__head b { font-size: 14.5px; }
.ccard__stat { font-family: var(--serif); font-weight: 800; font-size: 42px; line-height: 1; }
.ccard__stat i { font-style: normal; font-size: 18px; }
.ccard__stat--red { color: var(--red); }
.ccard__stat--gold { color: #a9852b; }
.ccard__cap { font-size: 13px; color: var(--ink); font-weight: 600; display: block; margin: 8px 0 10px; }
.ccard p { font-size: 13px; color: var(--ink-soft); margin: 0; }

.logos { margin-top: 56px; }
.logos__title { text-align: center; font-size: 13px; letter-spacing: .14em; color: var(--ink-soft); text-transform: uppercase; margin: 0 0 26px; }
.logos__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; max-width: 1000px; margin: 0 auto; }
.logos__grid span {
  background: var(--white); border: 1px solid rgba(0,0,0,.06); border-radius: 30px;
  padding: 9px 18px; font-size: 14px; color: #4a423a; box-shadow: 0 6px 16px -12px rgba(40,30,20,.4);
}
.logos__grid .is-hot { border-color: rgba(194,161,79,.6); color: #a9852b; font-weight: 600; }
.logos__stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; max-width: 820px; margin: 44px auto 0; }
.logos__stats { text-align: center; }
.logos__stats b { font-family: var(--serif); font-weight: 800; font-size: 38px; color: var(--ink); display: block; line-height: 1; }
.logos__stats i { font-style: normal; font-size: 18px; color: var(--gold); }
.logos__stats span { font-size: 13px; color: var(--ink-soft); margin-top: 6px; display: block; }

/* =====================================================================
   MOAT
   ===================================================================== */
.moat { display: grid; grid-template-columns: 1.618fr 1fr; gap: var(--sp-xl); align-items: center; position: relative; }
/* golden-section divider at 61.8% — same motif as the hero */
.moat::after { content: ""; position: absolute; left: 61.8%; top: 6%; bottom: 6%; width: 1px; transform: translateX(-27px); pointer-events: none;
  background: linear-gradient(180deg, transparent, rgba(194,161,79,.30) 26%, rgba(194,161,79,.30) 74%, transparent); }
.moat__flow { display: grid; gap: 0; }
.flowstep {
  display: flex; align-items: center; gap: 16px;
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  border: 1px solid var(--dark-line); border-radius: var(--radius); padding: 20px 22px;
}
.flowstep--hot { border-color: rgba(192,57,43,.5); background: rgba(192,57,43,.08); }
.flowstep__icon { width: 46px; height: 46px; flex: none; border-radius: 12px; background: rgba(192,57,43,.12); display: grid; place-items: center; }
.flowstep b { color: #fbf8f1; font-size: 15.5px; display: block; }
.flowstep span { font-size: 13px; color: var(--paper-soft); }
.flowstep__arrow { text-align: center; color: var(--red); font-size: 20px; margin: 8px 0; }
.moat__why h3 { font-family: var(--serif); font-size: 24px; margin: 0 0 20px; color: #fbf8f1; }

/* =====================================================================
   ABOUT: academic arc + global
   ===================================================================== */
.arc { display: grid; grid-template-columns: 1fr auto 1fr auto 1fr; gap: 18px; align-items: stretch; }
.arc__stage {
  background: var(--white); border-radius: var(--radius); padding: 28px 26px;
  border: 1px solid rgba(0,0,0,.05); box-shadow: 0 18px 40px -30px rgba(40,30,20,.28);
}
.arc__stage--now { background: var(--dark); border-color: var(--dark-line); }
.arc__years { font-size: 12px; font-weight: 700; letter-spacing: .12em; color: var(--ink-soft); }
.arc__stage--now .arc__years { color: var(--gold); }
.arc__big { font-family: var(--serif); font-weight: 800; font-size: 64px; line-height: 1; margin: 6px 0 14px; }
.arc__big--mute { color: #b8ab99; }
.arc__big--red { color: var(--red); }
.arc__big--gold { color: var(--gold); }
.arc__stage b { font-family: var(--serif); font-size: 19px; display: block; margin-bottom: 8px; }
.arc__stage--now b { color: #fbf8f1; }
.arc__stage p { font-size: 13.5px; color: var(--ink-soft); margin: 0; }
.arc__stage--now p { color: var(--paper-soft); }
.arc__sep { display: grid; place-items: center; color: var(--red); font-size: 22px; }
.arc__credits {
  text-align: center; font-size: 13.5px; color: var(--ink-soft); margin: 30px auto 0; max-width: 920px;
  padding: 18px 24px; background: var(--cream-2); border-radius: 40px; border: 1px solid rgba(0,0,0,.05);
}

.global { display: grid; grid-template-columns: repeat(3, 1fr); gap: 22px; margin-top: 56px; }
.gcard { background: var(--white); border-radius: var(--radius); padding: 28px 26px; border: 1px solid rgba(0,0,0,.05); box-shadow: 0 18px 40px -30px rgba(40,30,20,.26); }
.gcard .ic { width: 26px; height: 26px; padding: 10px; box-sizing: content-box; border: 1.4px solid currentColor; border-radius: 50%; margin-bottom: 16px; }
.gcard h4 { font-family: var(--serif); font-size: 20px; margin: 0 0 4px; }
.gcard span { font-size: 12.5px; color: var(--red); font-weight: 600; display: block; margin-bottom: 10px; }
.gcard p { font-size: 13.5px; color: var(--ink-soft); margin: 0; }

/* =====================================================================
   TEAM
   ===================================================================== */
.tcard {
  background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012));
  border: 1px solid var(--dark-line); border-radius: var(--radius); padding: 28px 24px;
  transition: transform .35s var(--ease), border-color .35s var(--ease);
}
.tcard:hover { transform: translateY(-6px); border-color: rgba(216,189,120,.4); }
.tcard .ic { width: 26px; height: 26px; padding: 11px; box-sizing: content-box; border: 1.4px solid currentColor; border-radius: 50%; margin-bottom: 18px; }
.tcard__div { font-size: 11px; font-weight: 700; letter-spacing: .14em; color: var(--gold); text-transform: uppercase; display: block; margin-bottom: 10px; }
.tcard h4 { font-family: var(--serif); font-size: 20px; margin: 0 0 10px; color: #fbf8f1; }
.tcard p { font-size: 13px; color: var(--paper-soft); margin: 0 0 14px; }
.tcard__sub { font-size: 12px; color: var(--gold-soft); padding-top: 12px; border-top: 1px solid var(--dark-line); display: block; }
.team__foot { text-align: center; font-family: var(--serif); font-style: italic; font-size: clamp(15px, 1.8vw, 20px); color: var(--gold-soft); margin: 48px auto 0; max-width: 880px; }

/* =====================================================================
   CONTACT
   ===================================================================== */
.contact { padding: 110px 0; overflow: hidden; }
.contact__inner { position: relative; text-align: center; }
.contact__art { position: absolute; right: -40px; top: -60px; width: 300px; color: var(--gold); opacity: .25; pointer-events: none; }
.contact__art .spiral { max-width: 300px; }
.contact .kicker { justify-content: center; }
.contact__title { font-family: var(--serif); font-weight: 700; font-size: clamp(28px, 4.4vw, 52px); line-height: 1.16; letter-spacing: -.005em; color: #fbf8f1; margin: 0 auto 22px; max-width: 16ch; }
.contact__sub { font-size: clamp(15px, 1.5vw, 17px); color: var(--paper-soft); max-width: 680px; margin: 0 auto 38px; }
.contact__actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px; }

/* =====================================================================
   BUTTONS
   ===================================================================== */
.btn {
  display: inline-flex; align-items: center; gap: 9px; font-size: 15px; font-weight: 600;
  padding: 13px 24px; border-radius: 32px; cursor: pointer; transition: .25s var(--ease); border: 1.5px solid transparent;
}
.btn .ic { width: 18px; height: 18px; }
.btn--gold { background: var(--gold); color: #1c160c; box-shadow: 0 14px 30px -14px rgba(194,161,79,.7); }
.btn--gold:hover { background: var(--gold-soft); transform: translateY(-2px); }
.btn--ghost { border-color: rgba(216,189,120,.5); color: var(--gold-soft); }
.btn--ghost:hover { border-color: var(--gold); background: rgba(194,161,79,.12); color: #fbf8f1; }

/* =====================================================================
   FOOTER
   ===================================================================== */
.footer { background: #110d0a; color: var(--paper-soft); padding: 48px 0; }
.footer__inner { display: grid; gap: 22px; justify-items: center; text-align: center; }
.footer__brand { color: var(--paper); display: inline-flex; align-items: center; gap: 11px; }
.footer__nav { display: flex; flex-wrap: wrap; justify-content: center; gap: 22px; }
.footer__nav a { font-size: 14px; opacity: .8; transition: .2s; }
.footer__nav a:hover { opacity: 1; color: var(--gold-soft); }
.footer__meta { font-size: 12.5px; letter-spacing: .04em; line-height: 1.9; margin: 0; }
.footer__meta span { opacity: .6; }

/* =====================================================================
   RESPONSIVE
   ===================================================================== */
@media (max-width: 980px) {
  .grid-4 { grid-template-columns: repeat(2, 1fr); }
  .grid-3 { grid-template-columns: repeat(2, 1fr); }
  .hero__copy { width: 100%; }
  .hero__inner::after, .hero__phi { display: none; }
  .platform, .moat { grid-template-columns: 1fr; gap: 28px; }
  .moat::after { display: none; }
  .arch__base { flex-direction: column; text-align: center; align-items: center; }
  .arc { grid-template-columns: 1fr; }
  .arc__sep { transform: rotate(90deg); }
  .global { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .nav__links {
    position: fixed; inset: 0 0 auto 0; top: 84px; flex-direction: column; gap: 0;
    background: rgba(18,14,11,.97); backdrop-filter: blur(14px);
    padding: 14px 28px 26px; transform: translateY(-130%); transition: transform .4s var(--ease);
    box-shadow: 0 24px 50px -20px rgba(0,0,0,.6); align-items: stretch;
  }
  .nav__links.open { transform: translateY(0); }
  .nav__links a { padding: 14px 0; border-bottom: 1px solid rgba(255,255,255,.07); opacity: .92; }
  .nav__cta { text-align: center; margin-top: 14px; border-radius: 30px; }
  .nav__burger { display: block; }
  .section { padding: 70px 0; }
  .grid-4, .grid-3, .grid-2 { grid-template-columns: 1fr; }
  .arch__curves { grid-template-columns: 1fr; }
  .arch__arrows { display: none; }
  .wemio__goal { flex-direction: column; text-align: center; }
  .wemio__goal-badge { padding-left: 0; border-left: 0; padding-top: 16px; border-top: 1px solid rgba(0,0,0,.1); }
  .console__stats, .specbar { grid-template-columns: 1fr 1fr; }
  .logos__stats { grid-template-columns: 1fr 1fr; }
  .hero__stats { gap: 28px; }
  .wrap { padding: 0 20px; }
}

/* =====================================================================
   v2 — daoai.com structure: product detail, lineup, table, timeline,
   partners, insights, contact form, multi-column footer
   ===================================================================== */

/* curve cards now link to product sections */
.curve { display: block; }
.curve__more { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 600; margin-top: 16px; }
.curve__more .ic { width: 16px; height: 16px; transition: transform .25s var(--ease); }
.curve--red .curve__more { color: var(--red); }
.curve--gold .curve__more { color: #a9852b; }
.curve--violet .curve__more { color: var(--violet); }
.curve:hover .curve__more .ic { transform: translateX(4px); }

/* stat strip */
.statstrip {
  display: grid; grid-template-columns: repeat(6, 1fr); gap: 12px; margin-bottom: 40px;
  background: var(--white); border: 1px solid rgba(0,0,0,.05); border-radius: var(--radius);
  padding: 26px 22px; box-shadow: 0 18px 44px -32px rgba(40,30,20,.3);
}
.statstrip > div { border-left: 2px solid rgba(192,57,43,.25); padding-left: 14px; }
.statstrip b { font-family: var(--serif); font-weight: 800; font-size: 30px; color: var(--ink); display: block; line-height: 1; }
.statstrip i { font-style: normal; font-size: 14px; color: var(--red); }
.statstrip span { font-size: 12px; color: var(--ink-soft); margin-top: 7px; display: block; }
.statstrip--dark { background: linear-gradient(155deg,#1f1912,#271f16); border-color: var(--dark-line); box-shadow: none; }
.statstrip--dark b { color: #fbf8f1; }
.statstrip--dark i { color: var(--gold-soft); }
.statstrip--dark span { color: var(--paper-soft); }
.statstrip--dark > div { border-left-color: rgba(216,189,120,.3); }

/* how-it-works steps */
.steps { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; margin-bottom: 22px; }
.step { background: var(--white); border: 1px solid rgba(0,0,0,.05); border-radius: var(--radius); padding: 28px 26px; box-shadow: 0 18px 40px -32px rgba(40,30,20,.26); }
.step__no { font-family: var(--serif); font-weight: 800; font-size: 30px; color: var(--red); opacity: .85; }
.step h4 { font-size: 18px; margin: 10px 0 8px; color: var(--ink); }
.step p { font-size: 13.5px; color: var(--ink-soft); margin: 0; }

/* panel (chips / scenarios container) */
.panel { margin-top: 24px; background: var(--white); border: 1px solid rgba(0,0,0,.05); border-radius: var(--radius); padding: 26px 28px; box-shadow: 0 18px 40px -34px rgba(40,30,20,.26); }
.panel--dark { background: linear-gradient(155deg,#211b14,#2a2118); border-color: var(--dark-line); box-shadow: none; }
.panel__label { font-size: 11px; font-weight: 700; letter-spacing: .2em; color: var(--red); margin: 0 0 18px; text-transform: uppercase; }
.panel--dark .panel__label { color: var(--gold); }
.chips { display: flex; flex-wrap: wrap; gap: 10px; }
.chips span { background: var(--cream-2); border: 1px solid rgba(0,0,0,.06); border-radius: 30px; padding: 8px 16px; font-size: 13.5px; color: #4a423a; }

/* scenarios */
.scn { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.scn__note { font-size: 12.5px; color: var(--paper-soft); margin: 18px 0 0; line-height: 1.75; }
@media (max-width: 760px) { .scn { grid-template-columns: 1fr 1fr; } }
@media (max-width: 480px) { .scn { grid-template-columns: 1fr; } }
.scn article { background: rgba(255,255,255,.04); border: 1px solid var(--dark-line); border-radius: 12px; padding: 20px 18px; }
.scn .ic { width: 24px; height: 24px; margin-bottom: 12px; }
.scn b { color: #fbf8f1; font-size: 15px; display: block; margin-bottom: 6px; }
.scn p { font-size: 13px; color: var(--paper-soft); margin: 0; }

/* product lineup */
.lineup { display: grid; grid-template-columns: repeat(3,1fr); gap: 22px; margin-top: 24px; }
.lucard { background: var(--white); border: 1px solid rgba(0,0,0,.06); border-radius: var(--radius); padding: 26px 24px; box-shadow: 0 18px 40px -32px rgba(40,30,20,.26); }
.lucard__tag { display: inline-block; font-size: 12px; font-weight: 700; color: var(--red); background: rgba(192,57,43,.08); border-radius: 20px; padding: 5px 12px; margin-bottom: 14px; }
.lucard__tag--soon { color: #a9852b; background: rgba(194,161,79,.16); }
.lucard h4 { font-family: var(--serif); font-size: 24px; margin: 0 0 14px; }
.lucard ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.lucard li { font-size: 13.5px; color: var(--ink-soft); padding-left: 16px; position: relative; }
.lucard li::before { content: ""; position: absolute; left: 0; top: 8px; width: 6px; height: 6px; border-radius: 50%; background: var(--red); opacity: .6; }
.lucard--soon { border-color: rgba(194,161,79,.4); background: linear-gradient(180deg,#fffdf8,#fbf6ea); }
.lucard--soon li::before { background: var(--gold); }

/* comparison table */
.ctable-wrap { margin-top: 24px; overflow-x: auto; border-radius: var(--radius); border: 1px solid rgba(0,0,0,.06); }
.ctable { width: 100%; border-collapse: collapse; background: var(--white); min-width: 640px; }
.ctable th, .ctable td { text-align: left; padding: 15px 18px; font-size: 14px; border-bottom: 1px solid rgba(0,0,0,.06); }
.ctable thead th { font-weight: 700; color: var(--ink); background: var(--cream-2); }
.ctable td:first-child, .ctable th:first-child { color: var(--ink-soft); font-weight: 600; }
.ctable .is-hot { color: var(--red); font-weight: 600; background: rgba(192,57,43,.05); }
.ctable thead .is-hot { color: #fff; background: var(--red); }
.ctable tbody tr:last-child td { border-bottom: 0; }

/* product cta row */
.prod__cta { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 30px; }

/* extra buttons */
.btn--red { background: var(--red); color: #fff; box-shadow: 0 14px 30px -16px rgba(192,57,43,.7); }
.btn--red:hover { background: var(--red-soft); transform: translateY(-2px); }
.btn--ghostdark { border-color: rgba(0,0,0,.18); color: var(--ink); }
.btn--ghostdark:hover { border-color: var(--red); color: var(--red); background: rgba(192,57,43,.06); }

/* 3D AOI coming-soon band */
.coming { padding: 64px 0; background: linear-gradient(120deg,#191410,#241a12 70%,#2a1d12); }
.coming__inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.coming__text h2 { font-family: var(--serif); font-size: clamp(26px,3.4vw,40px); line-height: 1.12; letter-spacing: -.005em; color: #fbf8f1; margin: 8px 0 10px; }
.coming__text p { color: var(--paper-soft); margin: 0; max-width: 620px; font-size: 15px; }

/* milestones timeline */
.timeline { display: grid; grid-template-columns: repeat(6,1fr); }
.tli { position: relative; padding: 30px 16px 0; }
.tli::before { content: ""; position: absolute; top: 8px; left: 0; right: 0; height: 2px; background: rgba(0,0,0,.1); }
.tli::after { content: ""; position: absolute; top: 3px; left: 16px; width: 12px; height: 12px; border-radius: 50%; background: var(--cream); border: 2px solid var(--red); }
.tli--now::after { background: var(--gold); border-color: var(--gold); box-shadow: 0 0 0 4px rgba(194,161,79,.2); }
.tli__yr { font-family: var(--serif); font-weight: 800; font-size: 26px; color: var(--red); display: block; }
.tli--now .tli__yr { color: #a9852b; }
.tli b { font-size: 15px; display: block; margin: 8px 0 6px; }
.tli p { font-size: 12.5px; color: var(--ink-soft); margin: 0; }

/* partners */
.partners { margin-top: 48px; text-align: center; }
.partners__label { font-size: 12px; letter-spacing: .16em; color: var(--ink-soft); text-transform: uppercase; margin: 0 0 18px; }
.partners__row { display: flex; flex-wrap: wrap; justify-content: center; gap: 14px 34px; }
.partners__row span { font-family: var(--serif); font-weight: 700; font-size: 19px; color: #6a6052; }

/* insights / blog */
.icard { display: flex; flex-direction: column; background: linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.012)); border: 1px solid var(--dark-line); border-radius: var(--radius); padding: 28px 26px; transition: transform .35s var(--ease), border-color .35s var(--ease); }
.icard:hover { transform: translateY(-6px); border-color: rgba(216,189,120,.45); }
.icard__tag { font-size: 11px; font-weight: 700; letter-spacing: .14em; color: var(--gold); text-transform: uppercase; margin-bottom: 14px; }
.icard h3 { font-family: var(--serif); font-size: 21px; color: #fbf8f1; margin: 0 0 10px; }
.icard p { font-size: 13.5px; color: var(--paper-soft); margin: 0 0 18px; flex: 1; }
.icard__more { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; font-weight: 600; color: var(--gold-soft); }
.icard__more .ic { width: 15px; height: 15px; }
.insights__more { text-align: center; margin-top: 36px; }

/* contact grid + form */
.contact__grid { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: start; position: relative; }
.contact__info .kicker { justify-content: flex-start; }
.contact__info .contact__title { font-family: var(--serif); font-weight: 700; font-size: clamp(26px,3.2vw,40px); color: #fbf8f1; margin: 0 0 16px; max-width: none; text-align: left; }
.contact__info .contact__sub { color: var(--paper-soft); margin: 0 0 26px; font-size: 15px; max-width: none; text-align: left; }
.contact__info .contact__sub b { color: var(--gold-soft); }
.contact__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.contact__list li { display: flex; align-items: center; gap: 12px; font-size: 14.5px; color: var(--paper); }
.contact__list a { color: var(--paper); border-bottom: 1px solid transparent; }
.contact__list a:hover { color: var(--gold-soft); border-color: var(--gold-soft); }

.cform { background: linear-gradient(155deg,#211b14,#2a2118); border: 1px solid var(--dark-line); border-radius: var(--radius-lg); padding: 30px; box-shadow: 0 30px 70px -42px rgba(0,0,0,.7); }
.cform__row { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.cform label { display: block; font-size: 12.5px; color: var(--paper-soft); margin-bottom: 14px; }
.cform input, .cform select, .cform textarea { width: 100%; margin-top: 7px; background: rgba(255,255,255,.05); border: 1px solid var(--dark-line); border-radius: 10px; padding: 11px 13px; color: var(--paper); font-family: inherit; font-size: 14.5px; outline: none; transition: border-color .2s; }
.cform input::placeholder, .cform textarea::placeholder { color: #7d7263; }
.cform input:focus, .cform select:focus, .cform textarea:focus { border-color: var(--gold); }
.cform select { cursor: pointer; }
.cform select option { color: #1c160c; }
.cform textarea { resize: vertical; }
.cform__submit { width: 100%; justify-content: center; margin-top: 4px; }
.cform__note { font-size: 13px; color: var(--gold-soft); margin: 14px 0 0; text-align: center; }

/* footer restructured */
.footer__top { display: grid; grid-template-columns: 1.6fr 1fr 1fr 1fr; gap: 30px; padding-bottom: 36px; border-bottom: 1px solid rgba(255,255,255,.08); }
.footer__brand { display: inline-flex; align-items: center; gap: 11px; color: var(--paper); }
.footer__tag { font-size: 13px; color: var(--paper-soft); line-height: 1.7; margin: 18px 0; }
.footer__social { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; color: var(--gold-soft); }
.footer__social .ic { width: 15px; height: 15px; }
.fcol h5 { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: var(--paper); margin: 0 0 16px; }
.fcol a { display: block; font-size: 14px; color: var(--paper-soft); margin-bottom: 11px; transition: color .2s; }
.fcol a:hover { color: var(--gold-soft); }
.footer__bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; padding-top: 24px; }
.footer__bottom p { font-size: 12.5px; color: var(--paper-soft); margin: 0; }
.footer__bottom span { opacity: .6; }
.footer__beian { font-size: 12px; }
.footer__beian a { color: var(--paper-soft); opacity: .75; transition: opacity .2s, color .2s; }
.footer__beian a:hover { opacity: 1; color: var(--gold-soft); }

/* v2 responsive */
@media (max-width: 980px) {
  .statstrip { grid-template-columns: repeat(3,1fr); }
  .steps, .lineup, .scn { grid-template-columns: repeat(2,1fr); }
  .timeline { grid-template-columns: repeat(3,1fr); }
  .contact__grid { grid-template-columns: 1fr; gap: 32px; }
  .footer__top { grid-template-columns: 1fr 1fr; }
  .coming__inner { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 760px) {
  .statstrip { grid-template-columns: 1fr 1fr; }
  .steps, .lineup, .scn { grid-template-columns: 1fr; }
  .timeline { grid-template-columns: 1fr 1fr; }
  .cform__row { grid-template-columns: 1fr; }
  .footer__top { grid-template-columns: 1fr; }
  .partners__row { gap: 12px 22px; }
}

/* =====================================================================
   v3 — full site structure: language switcher, blog filter,
   resources center, partner band
   ===================================================================== */

/* language switcher */
.nav__lang { display: inline-flex; align-items: center; gap: 2px; border: 1px solid rgba(216,189,120,.3); border-radius: 24px; padding: 3px; }
.nav__lang button { background: none; border: 0; cursor: pointer; color: inherit; opacity: .7; font: inherit; font-size: 13px; padding: 4px 11px; border-radius: 20px; transition: .2s var(--ease); line-height: 1; }
.nav__lang button:hover { opacity: 1; }
.nav__lang button.is-active { background: var(--gold); color: #1c160c; opacity: 1; font-weight: 600; }

/* language toast */
.lang-toast {
  position: fixed; left: 50%; bottom: 32px; transform: translate(-50%, 20px);
  background: rgba(20,16,13,.94); color: var(--paper); border: 1px solid rgba(216,189,120,.4);
  padding: 12px 22px; border-radius: 30px; font-size: 14px; z-index: 200;
  opacity: 0; pointer-events: none; transition: opacity .3s var(--ease), transform .3s var(--ease);
  backdrop-filter: blur(8px);
}
.lang-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* blog filter */
.bfilter { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: 34px; }
.bchip { background: rgba(255,255,255,.04); border: 1px solid var(--dark-line); color: var(--paper-soft); cursor: pointer; font: inherit; font-size: 13.5px; padding: 8px 18px; border-radius: 24px; transition: .2s var(--ease); }
.bchip:hover { color: var(--paper); border-color: rgba(216,189,120,.4); }
.bchip.is-active { background: var(--gold); color: #1c160c; border-color: var(--gold); font-weight: 600; }
.icard.hide { display: none; }

/* blog card meta (category + date) */
.icard__meta { font-size: 12px; color: var(--paper-soft); letter-spacing: .03em; margin-bottom: 13px; display: block; }
.icard__cat { font-style: normal; color: var(--gold); font-weight: 600; }

/* resources */
.rescard { display: flex; flex-direction: column; background: var(--white); border: 1px solid rgba(0,0,0,.05); border-radius: var(--radius); padding: 28px 26px; box-shadow: 0 18px 40px -32px rgba(40,30,20,.26); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.rescard:hover { transform: translateY(-6px); box-shadow: 0 26px 54px -28px rgba(40,30,20,.4); }
.rescard__icon { width: 46px; height: 46px; border-radius: 12px; background: rgba(192,57,43,.09); display: grid; place-items: center; margin-bottom: 18px; }
.rescard__icon .ic { width: 24px; height: 24px; }
.rescard__kind { font-size: 11px; font-weight: 700; letter-spacing: .14em; color: var(--red); text-transform: uppercase; }
.rescard h3 { font-size: 18px; margin: 10px 0 8px; }
.rescard p { font-size: 13.5px; color: var(--ink-soft); margin: 0 0 18px; flex: 1; }
.rescard__dl { display: inline-flex; align-items: center; gap: 7px; font-size: 13.5px; font-weight: 600; color: var(--red); }
.rescard__dl .ic { width: 16px; height: 16px; }
.rescard--wide { grid-column: 1 / -1; flex-direction: row; align-items: center; gap: 24px; }
.rescard--wide .rescard__icon { margin-bottom: 0; flex: none; }
.rescard--wide .rescard__wbody { flex: 1; }
.rescard--wide .rescard__wbody p { margin-bottom: 0; }
.rescard--wide .rescard__dl { flex: none; white-space: nowrap; }

/* =====================================================================
   v4 — dropdown nav, industries, model matrix, pipeline
   ===================================================================== */

/* dropdown mega-menu */
.nav__item { position: relative; }
.nav__top { display: inline-flex; align-items: center; gap: 5px; }
.nav__caret { width: 13px; height: 13px; opacity: .65; transition: transform .25s var(--ease); }
.nav__menu {
  position: absolute; top: 100%; left: 50%; transform: translateX(-50%) translateY(10px);
  min-width: 210px; background: rgba(18,14,11,.97); backdrop-filter: blur(14px) saturate(140%);
  border: 1px solid rgba(216,189,120,.18); border-radius: 12px; padding: 8px;
  display: flex; flex-direction: column; gap: 2px;
  opacity: 0; visibility: hidden; transition: opacity .22s var(--ease), transform .22s var(--ease), visibility .22s;
  box-shadow: 0 26px 54px -22px rgba(0,0,0,.7); z-index: 70;
}
.nav__menu a { padding: 9px 14px; border-radius: 8px; font-size: 14px; opacity: .82; white-space: nowrap; }
.nav__menu a:hover { background: rgba(255,255,255,.06); opacity: 1; color: var(--gold-soft); }
.nav__menu--two { min-width: 380px; display: grid; grid-template-columns: 1fr 1fr; }
.nav__item--has:hover .nav__menu { opacity: 1; visibility: visible; transform: translateX(-50%) translateY(4px); }
.nav__item--has:hover .nav__caret { transform: rotate(180deg); }
.nav__top.is-current { color: var(--gold-soft); }
.nav__top.is-current::after { content: ""; display: block; position: absolute; left: 0; right: 18px; bottom: -6px; height: 2px; background: var(--gold); border-radius: 2px; }
.nav__item .nav__top.is-current { position: relative; }

/* industries grid */
.indgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 20px; }
.indcard { background: var(--white); border: 1px solid rgba(0,0,0,.05); border-radius: var(--radius); padding: 26px 22px; box-shadow: 0 18px 40px -32px rgba(40,30,20,.26); transition: transform .35s var(--ease), box-shadow .35s var(--ease); }
.indcard:hover { transform: translateY(-6px); box-shadow: 0 26px 54px -28px rgba(40,30,20,.4); }
.indcard__icon { width: 46px; height: 46px; border-radius: 12px; background: rgba(192,57,43,.09); display: grid; place-items: center; margin-bottom: 16px; }
.indcard__icon .ic { width: 24px; height: 24px; }
.indcard h3 { font-size: 17px; margin: 0 0 8px; }
.indcard p { font-size: 13px; color: var(--ink-soft); margin: 0; }

/* gold chips (model matrix) */
.chips--gold span { background: rgba(194,161,79,.10); border-color: rgba(216,189,120,.25); color: var(--gold-soft); }

/* 6-step pipeline */
.pipeline { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin-top: 22px; }
.pipe { background: linear-gradient(180deg, rgba(255,255,255,.05), rgba(255,255,255,.015)); border: 1px solid var(--dark-line); border-radius: 26px; padding: 11px 20px; font-size: 14px; color: #fbf8f1; }
.pipeline i { color: var(--gold); font-style: normal; font-size: 18px; opacity: .7; }

/* SDK / deployment row */
.sdkrow { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 22px; }
.sdkrow > div { background: rgba(255,255,255,.035); border: 1px solid var(--dark-line); border-radius: 12px; padding: 18px 18px; }
.sdkrow b { display: block; font-size: 12px; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); margin-bottom: 8px; }
.sdkrow span { font-size: 13.5px; color: var(--paper); }

@media (max-width: 980px) {
  .indgrid { grid-template-columns: repeat(2, 1fr); }
  .sdkrow { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 760px) {
  .indgrid { grid-template-columns: 1fr 1fr; }
  .sdkrow { grid-template-columns: 1fr 1fr; }
  /* mobile dropdowns become accordions */
  .nav__item { width: 100%; }
  .nav__top { justify-content: space-between; width: 100%; }
  .nav__menu {
    position: static; transform: none; opacity: 1; visibility: visible; display: none;
    min-width: 0; background: transparent; border: 0; box-shadow: none; padding: 2px 0 8px 14px;
  }
  .nav__menu--two { grid-template-columns: 1fr; }
  .nav__item.open .nav__menu { display: flex; }
  .nav__item.open .nav__caret { transform: rotate(180deg); }
}

/* FAQ accordion */
.faq { display: grid; gap: 12px; max-width: 880px; }
.faqitem { background: var(--white); border: 1px solid rgba(0,0,0,.06); border-radius: var(--radius); box-shadow: 0 14px 36px -32px rgba(40,30,20,.3); }
.faqitem summary { cursor: pointer; padding: 19px 24px; font-size: 15.5px; font-weight: 600; color: var(--ink); list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.faqitem summary::-webkit-details-marker { display: none; }
.faqitem summary::after { content: "+"; color: var(--red); font-size: 22px; font-weight: 400; line-height: 1; flex: none; transition: transform .2s var(--ease); }
.faqitem[open] summary::after { content: "−"; }
.faqitem p { margin: 0; padding: 0 24px 20px; font-size: 14px; color: var(--ink-soft); line-height: 1.75; }

/* regional sales contacts */
.salesgrid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.salescard { background: var(--cream-2); border: 1px solid rgba(0,0,0,.06); border-radius: 12px; padding: 18px; }
.salescard__region { font-size: 11px; font-weight: 700; letter-spacing: .1em; color: var(--red); text-transform: uppercase; display: block; margin-bottom: 8px; }
.salescard b { font-size: 15px; color: var(--ink); display: block; }
.salescard a { font-size: 15px; color: var(--red); font-weight: 600; display: inline-block; margin-top: 4px; }
.salescard a:hover { text-decoration: underline; }
@media (max-width: 760px) { .salesgrid { grid-template-columns: 1fr 1fr; } }

/* flagship product callout */
.flagship { display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
  margin-bottom: 26px; padding: 24px 30px; border-radius: var(--radius-lg);
  background: linear-gradient(120deg, #1f1912, #2a2118); border: 1px solid rgba(216,189,120,.35);
  box-shadow: 0 26px 60px -36px rgba(0,0,0,.6); transition: transform .35s var(--ease), border-color .35s var(--ease); }
.flagship:hover { transform: translateY(-4px); border-color: var(--gold); }
.flagship__tag { font-size: 11px; font-weight: 700; letter-spacing: .18em; color: var(--gold); text-transform: uppercase; }
.flagship__text b { display: block; font-family: var(--serif); font-size: clamp(20px, 2.4vw, 26px); color: #fbf8f1; margin: 8px 0 6px; }
.flagship__text p { font-size: 14px; color: var(--paper-soft); margin: 0; }
.flagship__cta { display: inline-flex; align-items: center; gap: 8px; font-size: 15px; font-weight: 600; color: #1c160c;
  background: var(--gold); padding: 12px 22px; border-radius: 30px; white-space: nowrap; }
.flagship__cta .ic { width: 18px; height: 18px; }

/* real product photo (portrait) with SVG fallback */
.prodphoto { max-width: 460px; margin: 0 auto 22px; }
.prodphoto--svg { max-width: 820px; }
.prodphoto img { width: 100%; display: block; border-radius: var(--radius); }
.prodphoto__cap { text-align: center; font-size: 12.5px; color: var(--ink-soft); margin-top: 12px; letter-spacing: .02em; }

/* product mockup figures */
.shot { margin: 0 auto 30px; border-radius: var(--radius); overflow: hidden; border: 1px solid rgba(0,0,0,.08); box-shadow: 0 30px 70px -42px rgba(40,30,20,.5); }
.shot img { width: 100%; display: block; }
.band--dark .shot { border-color: var(--dark-line); }
.shot__cap { font-size: 12px; color: var(--ink-soft); text-align: center; margin: 10px 0 0; }
.band--dark .shot__cap { color: var(--paper-soft); }

/* blog article */
.article { max-width: 760px; margin: 0 auto; }
.article__back { display: inline-flex; align-items: center; gap: 8px; color: var(--red); font-weight: 600; font-size: 14px; margin-bottom: 22px; }
.article__back .ic { width: 16px; height: 16px; transform: rotate(180deg); }
.article__lead { font-size: 19px; line-height: 1.7; color: var(--ink); margin: 0 0 22px; font-weight: 500; }
.article p { font-size: 16px; line-height: 1.85; color: var(--ink-soft); margin: 0 0 20px; }
.article h2 { font-family: var(--serif); font-size: 23px; margin: 36px 0 14px; color: var(--ink); }
.article h3 { font-size: 17px; margin: 26px 0 10px; color: var(--ink); font-weight: 700; }
.article ul { margin: 0 0 20px; padding-left: 0; list-style: none; display: grid; gap: 9px; }
.article ul li { position: relative; padding-left: 20px; font-size: 15px; color: var(--ink-soft); line-height: 1.7; }
.article ul li::before { content: ""; position: absolute; left: 2px; top: 10px; width: 6px; height: 6px; border-radius: 50%; background: var(--red); }
.article b, .article strong { color: var(--ink); font-weight: 600; }
.article__pull { font-family: var(--serif); font-style: italic; font-size: clamp(18px,2.2vw,22px); color: var(--red); line-height: 1.5; margin: 26px 0; padding-left: 20px; border-left: 3px solid var(--gold); }
.article__cta { margin-top: 40px; padding-top: 26px; border-top: 1px solid rgba(0,0,0,.08); display: flex; flex-wrap: wrap; gap: 14px; }

/* industry key-checks + recommended systems */
.ind-checks__label { font-size: 11px; font-weight: 700; letter-spacing: .2em; color: var(--red); text-transform: uppercase; margin: 28px 0 14px; }
.article__rec { font-size: 13.5px; color: var(--ink-soft); margin: 18px 0 0; }
.article__rec a { color: var(--red); font-weight: 600; border-bottom: 1px solid transparent; transition: border-color .2s; }
.article__rec a:hover { border-color: var(--red); }

/* sub-page hero header */
.phero { padding: 132px 0 54px; }
/* warm gold glow gives every sub-page hero the same premium depth as the homepage hero */
.band--dark.phero { background: radial-gradient(112% 82% at 84% 8%, rgba(194,161,79,.085), transparent 56%), var(--dark); }
.phero__title { font-family: var(--serif); font-weight: 800; font-size: clamp(32px, 5vw, 58px); color: #fbf8f1; margin: 16px 0 18px; line-height: 1.1; letter-spacing: -.01em; }
/* second tier: smaller line for long titles (gold-dash motif echoes the homepage hero) */
.phero__title-sub { display: block; margin-top: 11px; font-size: .6em; font-weight: 600; line-height: 1.16; letter-spacing: .005em; color: var(--paper); }
.phero__title-sub::before { content: ""; display: inline-block; width: 26px; height: 2px; background: var(--gold); vertical-align: middle; margin: 0 12px 6px 0; opacity: .85; }
.phero__sub { font-size: clamp(15px, 1.5vw, 18px); color: var(--paper-soft); max-width: 720px; margin: 0; line-height: 1.75; }
.phero__sub b { color: var(--paper); font-weight: 600; }
a.arch__base { text-decoration: none; transition: transform .35s var(--ease), border-color .35s var(--ease); }
a.arch__base:hover { transform: translateY(-4px); border-color: rgba(194,161,79,.5); }

/* AOI application industries grid */
.appgrid { display: grid; grid-template-columns: repeat(3,1fr); gap: 18px; }
.appgrid article { background: var(--cream-2); border: 1px solid rgba(0,0,0,.05); border-radius: 12px; padding: 20px 18px; }
.appgrid .ic { width: 24px; height: 24px; margin-bottom: 10px; }
.appgrid b { font-size: 15px; display: block; margin-bottom: 6px; }
.appgrid p { font-size: 13px; color: var(--ink-soft); margin: 0; }
@media (max-width: 760px) { .appgrid { grid-template-columns: 1fr 1fr; } }

/* P-series spec table note */
.specs2 { margin-top: 24px; }
.specs2 .panel__label { margin-bottom: 16px; }
.specs2__note { font-size: 12.5px; color: var(--ink-soft); margin: 14px 0 0; }

/* SkyVision live-alert demo strip */
.salert { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 6px; padding: 18px 22px; background: linear-gradient(155deg,#1f1912,#271f16); border: 1px solid var(--dark-line); border-radius: var(--radius); }
.salert__label { font-size: 11px; font-weight: 700; letter-spacing: .18em; color: var(--gold); text-transform: uppercase; margin-right: 4px; }
.salert__row { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; color: var(--paper); background: rgba(255,255,255,.04); border: 1px solid var(--dark-line); border-radius: 24px; padding: 7px 14px; }
.salert__row i { width: 8px; height: 8px; border-radius: 50%; flex: none; display: inline-block; }
.salert--warn i { background: var(--red-soft); box-shadow: 0 0 0 3px rgba(207,92,67,.18); }
.salert--ok i { background: #6cbf73; box-shadow: 0 0 0 3px rgba(108,191,115,.18); }

/* partner band */
.partner { padding: 70px 0; background: linear-gradient(120deg,#1a1510,#241b13 70%,#2b1e13); }
.partner__inner { display: flex; align-items: center; justify-content: space-between; gap: 30px; }
.partner__text h2 { font-family: var(--serif); font-size: clamp(24px,3vw,38px); color: #fbf8f1; margin: 8px 0 10px; }
.partner__text p { color: var(--paper-soft); margin: 0; max-width: 640px; font-size: 15px; }

@media (max-width: 760px) {
  .rescard--wide { flex-direction: column; align-items: flex-start; }
  .partner__inner { flex-direction: column; align-items: flex-start; }
  .nav__lang { margin: 6px 0; }
}

/* ===== real photography — self-hosted, free-license (Unsplash/Pexels, commercial-OK) =====
   All images live in fixed-aspect containers (object-fit: cover) so they can never
   overflow the layout; sized on the golden-section rhythm of the page. */
.icard { position: relative; overflow: hidden; }
.icard__cover { display: block; margin: -28px -26px 20px; aspect-ratio: 1.618 / 1; overflow: hidden; background: #15110d; }
.icard__cover img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s var(--ease); }
.icard:hover .icard__cover img { transform: scale(1.05); }

.pbanner { margin: 0 0 34px; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--dark-line);
  aspect-ratio: 2.6 / 1; box-shadow: 0 30px 70px -44px rgba(40,30,20,.5); background: #15110d; }
.pbanner img { width: 100%; height: 100%; object-fit: cover; display: block; }

.shot--photo { aspect-ratio: 2.2 / 1; max-width: 980px; }
.shot--photo img { height: 100%; object-fit: cover; }

@media (max-width: 680px) {
  .pbanner { aspect-ratio: 1.9 / 1; }
  .shot--photo { aspect-ratio: 1.9 / 1; }
}

/* ===== golden-section image composition (φ = 1.618) — images woven into the content =====
   The site's signature device (61.8 / 38.2 split + hairline gold divider) extended to
   imagery: split heroes and alternating feature rows, so photos read as composed, not pasted. */

/* nav: 3D AOI nested under 工业质检 */
.nav__menu .nav__sub { padding-left: 34px; font-size: 13px; opacity: .9; position: relative; }
.nav__menu .nav__sub::before { content: ""; position: absolute; left: 18px; top: 50%; width: 9px; height: 1px; background: var(--gold); opacity: .55; }

/* split hero — copy 61.8% | media 38.2%, divided at the golden line */
.phero--split { padding-bottom: 66px; }
.phero__split { position: relative; display: grid; grid-template-columns: 61.8fr 38.2fr; gap: 56px; align-items: center; }
.phero__split::after { content: ""; position: absolute; left: 61.8%; top: 8%; bottom: 8%; width: 1px; transform: translateX(-28px);
  background: linear-gradient(180deg, transparent, rgba(194,161,79,.55) 28%, rgba(194,161,79,.55) 72%, transparent); }
.phero__media { position: relative; aspect-ratio: 0.8; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--dark-line); box-shadow: 0 44px 100px -52px rgba(0,0,0,.78); background: #15110d; }
.phero__media img, .phero__media video { width: 100%; height: 100%; object-fit: cover; display: block; }
.phero__cap { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 34px 18px 13px;
  font-size: 11.5px; letter-spacing: .03em; color: #efe9dc; background: linear-gradient(transparent, rgba(13,10,8,.82)); }
.phero--split .phero__title { margin-top: 8px; }
.phero--split .hero__actions { margin-top: 26px; }

/* golden feature row — image + text in φ columns, alternating direction */
.gfeat { display: grid; grid-template-columns: 38.2fr 61.8fr; gap: 46px; align-items: center; margin: 0 0 8px; }
.gfeat--rev { grid-template-columns: 61.8fr 38.2fr; }
.gfeat--rev .gfeat__media { order: 2; }
.gfeat__media { aspect-ratio: 1 / 1.12; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--dark-line);
  box-shadow: 0 32px 74px -46px rgba(40,30,20,.5); background: #15110d; }
.gfeat__media img { width: 100%; height: 100%; object-fit: cover; display: block; }
.gfeat__body { min-width: 0; }
.gfeat--film { margin: 4px 0 46px; }
.gfeat--film .gfeat__body .shead__title { margin-top: 14px; }
.gfeat__hint { display: inline-flex; align-items: center; gap: 9px; margin: 24px 0 0;
  font-size: 13.5px; color: var(--ink-soft); }
.gfeat__hint .ic { width: 16px; height: 16px; flex: none; }

@media (max-width: 980px) and (min-width: 761px) {
  .arch__curves, .arch__arrows { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 860px) {
  .phero__split, .gfeat, .gfeat--rev { grid-template-columns: 1fr; gap: 26px; }
  .phero__split::after { display: none; }
  .phero__media { aspect-ratio: 16 / 10; }
  .gfeat--rev .gfeat__media { order: 0; }
  .gfeat__media { aspect-ratio: 16 / 10; }
}

/* ===== smart-factory showcase (home) — branded scene gallery ===== */
.showcase { display: grid; gap: 16px; margin-top: 4px; }
.showcase__hero { position: relative; aspect-ratio: 16 / 7; border-radius: var(--radius); overflow: hidden;
  border: 1px solid var(--dark-line); box-shadow: 0 40px 90px -50px rgba(0,0,0,.7); }
.showcase__hero img, .showcase__row img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s var(--ease); }
.showcase__hero:hover img, .showcase__row figure:hover img { transform: scale(1.04); }
.showcase__row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.showcase__row figure { position: relative; margin: 0; aspect-ratio: 16 / 10; border-radius: var(--radius);
  overflow: hidden; border: 1px solid var(--dark-line); }
.showcase__cap { position: absolute; left: 0; right: 0; bottom: 0; margin: 0; padding: 30px 16px 13px;
  font-size: 12px; letter-spacing: .02em; color: #efe9dc; background: linear-gradient(transparent, rgba(13,10,8,.85)); }
.showcase__cap b { color: var(--gold-soft); font-weight: 600; }
@media (max-width: 760px) {
  .showcase__row { grid-template-columns: 1fr; }
  .showcase__hero { aspect-ratio: 16 / 10; }
}

/* ===== hero: stated competitive edge + domains + looping promo video ===== */
.hero__sub b { color: var(--paper); font-weight: 600; }
.hero__edge { display: flex; flex-wrap: wrap; gap: 9px 10px; margin: 2px 0 15px; padding: 0; list-style: none; }
.hero__edge li { font-size: 12.5px; font-weight: 600; color: #efe9dc; padding: 5px 13px; white-space: nowrap;
  border: 1px solid rgba(194,161,79,.42); border-radius: 30px; background: rgba(194,161,79,.07); }
.hero__domains { font-size: 13.5px; color: var(--paper-soft); margin: 0 0 26px; letter-spacing: .01em; }
.hero__domains b { color: var(--gold); font-weight: 700; margin-right: 10px; }
/* hero film — edges feather into the background so video + text fuse seamlessly */
.hero__media { position: absolute; right: -2.5%; top: 50%; transform: translateY(-50%); width: 39%; aspect-ratio: 3 / 4;
  margin: 0; border: 0; background: transparent; overflow: visible; }
.hero__media video { width: 100%; height: 100%; object-fit: cover; display: block;
  -webkit-mask-image: radial-gradient(138% 132% at 93% 56%, #000 52%, rgba(0,0,0,0) 91%);
  mask-image: radial-gradient(138% 132% at 93% 56%, #000 52%, rgba(0,0,0,0) 91%);
  filter: drop-shadow(0 36px 72px rgba(0,0,0,.55)); }
.hero__media-cap { position: absolute; left: 9%; right: 6%; bottom: 7%; margin: 0; padding: 0; z-index: 1;
  font-size: 11.5px; letter-spacing: .03em; color: #efe9dc; text-shadow: 0 2px 16px rgba(0,0,0,.85); }
/* gold hairline accent on showcase frame */
.showcase__hero::after { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px; z-index: 2;
  background: linear-gradient(90deg, transparent, var(--gold) 30%, var(--gold-soft) 50%, var(--gold) 70%, transparent); }

/* ===== embedded video players (product / about pages) ===== */
/* ---- cinematic video player ---- */
.vfilm { position: relative; max-width: 1000px; margin: 16px auto 30px; aspect-ratio: 16 / 9;
  border-radius: var(--radius-lg); overflow: hidden; background: #0b0908;
  box-shadow: 0 44px 96px -52px rgba(24,16,8,.72), 0 0 0 1px rgba(0,0,0,.07); }
.band--dark .vfilm { box-shadow: 0 44px 96px -46px rgba(0,0,0,.82), 0 0 0 1px var(--dark-line); }
.vfilm--fill { max-width: none; margin: 0; }   /* fills a golden split column */
.vfilm__video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; display: block; background: #000; }
.vfilm__cover { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; padding: 0; cursor: pointer;
  display: block; text-align: left; color: #fff;
  background: linear-gradient(180deg, rgba(8,6,5,.12) 0%, rgba(8,6,5,0) 30%, rgba(8,6,5,.16) 60%, rgba(8,6,5,.66) 100%);
  transition: opacity .55s var(--ease), visibility .55s; }
.vfilm__cover::before { content: ""; position: absolute; top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, transparent, var(--gold) 30%, var(--gold-soft) 50%, var(--gold) 70%, transparent); }
.vfilm.is-playing .vfilm__cover { opacity: 0; visibility: hidden; pointer-events: none; }
.vfilm__eyebrow { position: absolute; top: 24px; left: 26px; display: inline-flex; align-items: center; gap: 9px;
  font-size: 11.5px; letter-spacing: .2em; text-transform: uppercase; font-weight: 600; color: #f3ece0;
  text-shadow: 0 1px 12px rgba(0,0,0,.5); }
.vfilm__eyebrow i { width: 7px; height: 7px; border-radius: 50%; background: var(--gold-soft); box-shadow: 0 0 0 4px rgba(216,189,120,.22); }
.vfilm__play { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);
  width: 86px; height: 86px; border-radius: 50%; display: flex; align-items: center; justify-content: center;
  background: rgba(20,15,10,.4); backdrop-filter: blur(7px); -webkit-backdrop-filter: blur(7px);
  box-shadow: 0 0 0 1px rgba(255,255,255,.3), inset 0 0 0 1px rgba(255,255,255,.1);
  transition: transform .38s var(--ease), background .38s var(--ease), box-shadow .38s var(--ease); }
.vfilm__play::after { content: ""; position: absolute; inset: -1px; border-radius: 50%;
  box-shadow: 0 0 0 0 rgba(216,189,120,.5); animation: vpulse 2.8s var(--ease) infinite; }
.vfilm__play svg { width: 30px; height: 30px; fill: #fff; margin-left: 5px; transition: fill .38s var(--ease); }
.vfilm__cover:hover .vfilm__play, .vfilm__cover:focus-visible .vfilm__play { transform: translate(-50%,-50%) scale(1.08);
  background: var(--gold); box-shadow: 0 20px 46px -16px rgba(194,161,79,.85); }
.vfilm__cover:hover .vfilm__play svg, .vfilm__cover:focus-visible .vfilm__play svg { fill: #1a1410; }
.vfilm__title { position: absolute; left: 26px; right: 26px; bottom: 24px; margin: 0; max-width: 76%;
  font-size: clamp(16px, 1.9vw, 21px); line-height: 1.35; font-weight: 600; color: #fff;
  text-shadow: 0 2px 18px rgba(0,0,0,.6); }
.vfilm__title b { color: var(--gold-soft); font-weight: 600; }
@keyframes vpulse { 0% { box-shadow: 0 0 0 0 rgba(216,189,120,.5); } 70% { box-shadow: 0 0 0 20px rgba(216,189,120,0); } 100% { box-shadow: 0 0 0 0 rgba(216,189,120,0); } }
@media (max-width: 600px) {
  .vfilm__play { width: 64px; height: 64px; } .vfilm__play svg { width: 23px; height: 23px; }
  .vfilm__eyebrow { top: 16px; left: 16px; } .vfilm__title { left: 16px; right: 16px; bottom: 16px; max-width: none; }
}

@media (max-width: 980px) {
  .hero__media { display: none; }
}