/* ===========================================================
   PiHunter — Cyber-security redesign
   Design system: dark, precise, "hunter" green signal accent
   RTL · Lahzeh (fa, Vazirmatn fallback) + JetBrains Mono (technical labels)
   =========================================================== */

@import url("assets/fonts.css?v=4");

:root{
  /* surfaces — cool near-black */
  --bg:       oklch(0.165 0.014 248);
  --bg-1:     oklch(0.195 0.016 248);
  --bg-2:     oklch(0.225 0.017 248);
  --bg-3:     oklch(0.265 0.018 248);
  --card:     oklch(0.205 0.016 248);

  /* ink */
  --ink:      oklch(0.975 0.004 248);
  --muted:    oklch(0.745 0.012 248);
  --faint:    oklch(0.665 0.012 248);

  /* lines */
  --line:     oklch(1 0 0 / 0.085);
  --line-2:   oklch(1 0 0 / 0.14);

  /* accent — signal green (tweakable) */
  --accent:       oklch(0.84 0.175 152);
  --accent-soft:  oklch(0.84 0.175 152 / 0.14);
  --accent-line:  oklch(0.84 0.175 152 / 0.4);
  --accent-ink:   oklch(0.22 0.03 152);  /* text on accent */

  /* danger / signal for "vuln found" flavor */
  --warn: oklch(0.82 0.15 75);
  --crit: oklch(0.7 0.2 25);

  --font-fa: "Lahzeh", "Vazirmatn", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "Lahzeh", "Vazirmatn", ui-monospace, monospace;

  --radius: 16px;
  --radius-sm: 10px;
  --maxw: 1240px;
  --gutter: clamp(20px, 5vw, 64px); /* @kind spacing */

  /* themeable surfaces — overridden in light mode */
  --ph-a: oklch(0.24 0.016 248);
  --ph-b: oklch(0.21 0.016 248);
  --strip-a: oklch(0.225 0.016 248);
  --strip-b: oklch(0.205 0.016 248);
  --nav-bg: oklch(0.15 0.012 248 / 0.86);
  --nav-bg-2: oklch(0.155 0.013 248 / 0.9);
  --nav-menu-bg: oklch(0.132 0.014 248);
  --shadow-sm: 0 24px 60px -52px #000;
  --shadow-md: 0 26px 56px -34px #000;
}

/* ===================== LIGHT THEME ===================== */
:root[data-theme="light"]{
  color-scheme:light;
  /* light = primary theme. White canvas, cool-grey alternate surfaces, navy ink,
     brand green darkened to pass WCAG AA (5.6:1 on white). */
  --bg:       #ffffff;
  --bg-1:     #f6f8fb;
  --bg-2:     #eef2f6;
  --bg-3:     #e3e8ef;
  --card:     #ffffff;

  --ink:      oklch(0.25 0.035 258);
  --muted:    oklch(0.44 0.025 258);
  --faint:    oklch(0.53 0.02 258);

  --line:     oklch(0.25 0.035 258 / 0.1);
  --line-2:   oklch(0.25 0.035 258 / 0.17);

  --accent:       oklch(0.5 0.12 158);
  --accent-soft:  oklch(0.5 0.12 158 / 0.08);
  --accent-line:  oklch(0.5 0.12 158 / 0.3);
  --accent-ink:   #ffffff;

  --warn: oklch(0.5 0.12 60);
  --crit: oklch(0.5 0.2 25);

  --ph-a: #eef2f6;
  --ph-b: #f6f8fb;
  --strip-a: #eef2f6;
  --strip-b: #f6f8fb;
  --nav-bg: rgb(255 255 255 / 0.86);
  --nav-bg-2: rgb(255 255 255 / 0.94);
  --nav-menu-bg: #ffffff;

  --shadow-sm: 0 1px 2px rgb(15 23 42 / .04), 0 4px 22px -6px rgb(15 23 42 / .07);
  --shadow-md: 0 2px 4px rgb(15 23 42 / .04), 0 18px 40px -14px rgb(15 23 42 / .16);
  /* terminal stays a dark surface in light mode */
  --term-ink: oklch(0.96 0.005 230);
  --term-faint: oklch(0.7 0.012 230);
  --term-accent: oklch(0.84 0.175 152);
  --term-warn: oklch(0.82 0.15 75);
  --term-crit: oklch(0.7 0.2 25);
  --term-bg-2: oklch(0.32 0.02 250);
  --term-line: oklch(1 0 0 / 0.09);
  --term-line-2: oklch(1 0 0 / 0.16);
}
/* terminal tokens — follow the theme by default */
:root{
  --term-ink: var(--ink);
  --term-faint: var(--faint);
  --term-accent: var(--accent);
  --term-warn: var(--warn);
  --term-crit: var(--crit);
  --term-bg-2: var(--bg-2);
  --term-line: var(--line);
  --term-line-2: var(--line-2);
}
/* light-only elevation + integrated dark terminal */
:root[data-theme="light"] .card{ box-shadow:0 1px 2px oklch(0.3 0.03 258 / .04), 0 16px 32px -26px oklch(0.3 0.03 258 / .35); }
:root[data-theme="light"] .terminal{ background:oklch(0.22 0.025 255); border-color:oklch(0.32 0.03 255); box-shadow:0 30px 60px -30px oklch(0.25 0.05 255 / .55); }
:root[data-theme="light"] .term-bar{ background:oklch(0.26 0.025 255); border-color:oklch(1 0 0 / .08); }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:clip; color-scheme:dark; }
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-fa);
  font-size:17px;
  line-height:1.75;
  direction:rtl;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
  max-width:100%;
}
body::before{
  /* faint technical grid */
  content:"";
  position:fixed; inset:0; z-index:0; pointer-events:none;
  background-image:
    linear-gradient(var(--line) 1px, transparent 1px),
    linear-gradient(90deg, var(--line) 1px, transparent 1px);
  background-size: 64px 64px, 64px 64px;
  -webkit-mask-image: radial-gradient(120% 80% at 50% 0%, #000 0%, transparent 70%);
          mask-image: radial-gradient(120% 80% at 50% 0%, #000 0%, transparent 70%);
  opacity:.5;
}
body.no-grid::before{ display:none; }

a{ color:inherit; text-decoration:none; }
img{ max-width:100%; display:block; }
h1,h2,h3,h4{ margin:0; line-height:1.25; font-weight:700; letter-spacing:-0.01em; }
p{ margin:0; }

.wrap{ max-width:var(--maxw); margin-inline:auto; padding-inline:var(--gutter); position:relative; z-index:1; }
.section{ padding-block: clamp(26px, 3.5vw, 44px); position:relative; z-index:1; }
.section--roomy{ padding-block: clamp(40px, 5vw, 56px); }

/* ---------- shared atoms ---------- */
.eyebrow{
  font-family:var(--font-mono);
  font-size:.72rem;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--accent);
  display:inline-flex; align-items:center; gap:.6em;
  direction:ltr;
}
.eyebrow::before{
  content:""; width:26px; height:1px; background:var(--accent-line);
}
.section-head{ max-width:720px; margin-bottom: clamp(28px, 4vw, 40px); }
.section-head h2{
  font-size: clamp(1.9rem, 4vw, 3rem);
  margin-top:.5rem;
  text-wrap:balance;
}
.section-head p{ color:var(--muted); margin-top:1rem; font-size:1.05rem; text-wrap:pretty; }

.btn{
  display:inline-flex; align-items:center; gap:.6em;
  font-family:var(--font-fa); font-weight:600; font-size:1rem;
  padding:.85em 1.5em; border-radius:var(--radius-sm);
  border:1px solid transparent; cursor:pointer; white-space:nowrap;
  transition:.22s ease;
}
.btn .ar{ font-family:var(--font-mono); transition:transform .22s ease; }
.btn-primary{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.btn-primary:hover{ box-shadow:0 0 0 4px var(--accent-soft); transform:translateY(-1px); }
.btn-primary:hover .ar{ transform:translateX(-4px); }
.btn-ghost{ background:transparent; color:var(--ink); border-color:var(--line-2); }
.btn-ghost:hover{ border-color:var(--accent-line); color:var(--accent); }
.btn-lg{ padding:1.05em 1.9em; font-size:1.05rem; }

.tag{
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.08em;
  color:var(--accent); background:var(--accent-soft);
  border:1px solid var(--accent-line); border-radius:999px;
  padding:.35em .85em; direction:ltr; display:inline-block;
}
/* Persian-text pill: real Persian font, RTL, roomier */
.tag.fa{ font-family:var(--font-fa); direction:rtl; letter-spacing:0; font-size:.82rem; font-weight:500; padding:.45em 1em; }

/* ---------- NAV ---------- */
.nav{
  position:sticky; top:0; z-index:50;
  background: var(--nav-bg);
  backdrop-filter: blur(16px) saturate(1.3);
  border-bottom:1px solid var(--line);
  transition:.3s ease;
}
.nav.scrolled{
  background: var(--nav-bg-2);
  backdrop-filter: blur(16px) saturate(1.4);
  border-bottom:1px solid var(--line-2);
}
.nav{ --navh:74px; }
.nav-inner{ display:flex; align-items:center; gap:24px; height:var(--navh); }
.brand{ display:flex; align-items:center; gap:.6em; }
.brand .emblem{
  display:block; height:38px; width:auto; flex:none;
  filter:drop-shadow(0 0 14px var(--accent-soft)); transition:.22s ease;
}
.brand .wordmark{ display:block; height:27px; width:auto; }
.brand:hover .emblem{ filter:drop-shadow(0 0 24px var(--accent-line)); transform:translateY(-1px); }
.nav-links{ display:flex; gap:4px; margin-inline:auto; list-style:none; padding:0; margin-block:0; }
.nav-links a{
  color:var(--muted); font-size:.95rem; padding:.5em .9em; border-radius:8px;
  transition:.18s; font-weight:500;
}
.nav-links a:hover{ color:var(--ink); background:var(--bg-1); }
.nav-cta{ display:flex; align-items:center; gap:10px; }
.nav-cta .btn-primary{ padding:.62em 1.25em; }
.theme-toggle{ width:42px; height:42px; flex:none; display:grid; place-items:center; background:transparent; border:1px solid var(--line-2); border-radius:9px; color:var(--muted); cursor:pointer; transition:.18s ease; }
.theme-toggle:hover{ color:var(--accent); border-color:var(--accent-line); background:var(--bg-1); }
.theme-toggle svg{ display:block; }
.theme-toggle .ic-moon{ display:none; }
:root[data-theme="light"] .theme-toggle .ic-sun{ display:none; }
:root[data-theme="light"] .theme-toggle .ic-moon{ display:block; }
:root[data-theme="light"] body::before{ opacity:.32; }
.mobile-cta-li{ display:none; }
.nav-burger{ display:none; background:none; border:1px solid var(--line-2); border-radius:9px; width:42px; height:42px; cursor:pointer; color:var(--ink); }
.nav-burger span, .nav-burger span::before, .nav-burger span::after{
  content:""; display:block; width:18px; height:2px; background:currentColor; margin:0 auto; position:relative; transition:.2s;
}
.nav-burger span::before{ position:absolute; top:-6px; } .nav-burger span::after{ position:absolute; top:6px; }
.nav.open .nav-burger{ border-color:var(--accent-line); color:var(--accent); }
.nav.open .nav-burger span{ background:transparent; }
.nav.open .nav-burger span::before{ top:0; transform:rotate(45deg); }
.nav.open .nav-burger span::after{ top:0; transform:rotate(-45deg); }
body.menu-open{ overflow:hidden; }

/* ---------- HERO ---------- */
.hero{ position:relative; padding-top: clamp(48px, 7vw, 90px); padding-bottom: clamp(56px, 8vw, 110px); overflow:hidden; }
.hero-radar{
  position:absolute; z-index:0; top:14%; left:50%; transform:translate(-50%,-50%);
  width:min(760px, 90vw); aspect-ratio:1; pointer-events:none;
}
.radar-rings{
  position:absolute; inset:0; border-radius:50%;
  background:
    radial-gradient(circle at center, var(--accent) 0 2.5px, transparent 3px),
    radial-gradient(circle at center, color-mix(in oklab, var(--accent) 9%, transparent) 0%, transparent 72%),
    repeating-radial-gradient(circle at center, transparent 0 calc(25% - 1px), color-mix(in oklab, var(--accent) 26%, transparent) calc(25% - 1px) 25%),
    linear-gradient(color-mix(in oklab, var(--accent) 14%, transparent), color-mix(in oklab, var(--accent) 14%, transparent)) center/1px 100% no-repeat,
    linear-gradient(color-mix(in oklab, var(--accent) 14%, transparent), color-mix(in oklab, var(--accent) 14%, transparent)) center/100% 1px no-repeat;
  opacity:.42;
}
/* crisp outer rim */
.radar-rings::before{
  content:""; position:absolute; inset:0; border-radius:50%;
  border:1.5px solid color-mix(in oklab, var(--accent) 40%, transparent);
}
/* brand emblem at the scope center — radar guards the mark */
.radar-core{
  position:absolute; top:50%; left:50%; z-index:0;
  width:11%; height:auto; transform:translate(-50%,-50%);
  filter:drop-shadow(0 0 12px var(--accent-soft));
  opacity:.42; animation:coreBreathe 4.6s ease-in-out infinite;
}
@keyframes coreBreathe{
  0%,100%{ opacity:.36; }
  50%{ opacity:.5; }
}
body.no-grid .radar-core{ animation:none; opacity:.5; }
/* perimeter tick ring + outer edge glow */
.radar-rings::after{
  content:""; position:absolute; inset:0; border-radius:50%;
  background:repeating-conic-gradient(from 0deg,
    color-mix(in oklab, var(--accent) 55%, transparent) 0deg 0.5deg,
    transparent 0.5deg 15deg);
  -webkit-mask:radial-gradient(circle at center, transparent 0 calc(50% - 9px), #000 calc(50% - 9px) 50%, transparent 50%);
          mask:radial-gradient(circle at center, transparent 0 calc(50% - 9px), #000 calc(50% - 9px) 50%, transparent 50%);
  opacity:.7;
}
.radar-sweep{ position:absolute; inset:0; border-radius:50%; overflow:hidden; opacity:.28; will-change:transform; }
.radar-sweep::before{
  content:""; position:absolute; inset:-30%;
  background:conic-gradient(from 0deg,
    transparent 0deg 300deg,
    color-mix(in oklab, var(--accent) 20%, transparent) 342deg,
    color-mix(in oklab, var(--accent) 60%, transparent) 358deg,
    color-mix(in oklab, var(--accent) 92%, transparent) 360deg);
}
.radar-blip{
  position:absolute; z-index:1; transform:translate(-50%,-50%);
  font-family:var(--font-mono); font-size:.74rem; letter-spacing:.04em; direction:ltr;
  white-space:nowrap; color:color-mix(in oklab, var(--accent) 62%, var(--faint));
  opacity:calc(.13 + .87 * var(--lit, 0));
  text-shadow:0 0 calc(20px * var(--lit, 0)) var(--accent);
  transition:opacity .14s linear, text-shadow .14s linear;
}
.radar-blip::before{
  content:""; display:inline-block; width:6px; height:6px; border-radius:50%;
  background:currentColor; margin-inline-end:7px; vertical-align:middle;
}
body.no-grid .radar-blip{ opacity:.4; text-shadow:none; }
/* detection ping — expanding ring spawned as the beam hits a blip */
.radar-ping{
  position:absolute; width:13px; height:13px; margin:-6.5px 0 0 -6.5px; border-radius:50%;
  border:1.5px solid var(--accent); pointer-events:none; z-index:1;
  animation:radarPing 1s cubic-bezier(.2,.6,.3,1) forwards;
}
@keyframes radarPing{ from{ transform:scale(.35); opacity:.9; } to{ transform:scale(3.4); opacity:0; } }
body.no-grid .radar-ping{ display:none; }
.hero-radar::after{
  content:""; position:absolute; inset:-1px; border-radius:50%;
  background:radial-gradient(circle at center, transparent 58%, var(--bg) 82%);
}
@media (prefers-reduced-motion: reduce){ .radar-sweep::before{ animation:none; } }
body.no-grid .radar-sweep{ display:none; }
body.no-grid .radar-rings::after{ opacity:.4; }
.hero-glow{
  position:absolute; z-index:0; inset:auto; top:-180px; left:50%; transform:translateX(-50%);
  width:900px; height:560px; pointer-events:none;
  background: radial-gradient(50% 50% at 50% 50%, var(--accent-soft) 0%, transparent 70%);
  filter:blur(20px);
}
.hero-grid{ display:grid; grid-template-columns: minmax(0,1.05fr) minmax(0,.95fr); gap: clamp(32px,5vw,72px); align-items:start; }
.hero-copy h1{ font-weight:800; font-size: clamp(2.3rem, 5.2vw, 4rem); line-height:1.13; letter-spacing:-0.03em; text-wrap:balance; }
.hero-copy .hero-logo{ margin:0; line-height:0; }
.hero-copy .hero-logo img{
  height:clamp(64px, 8.5vw, 116px); width:auto; display:inline-block;
  filter:drop-shadow(0 6px 30px color-mix(in oklab, var(--accent) 22%, transparent));
}
.hero-copy .hero-tagline .h1-sub{ display:block; margin-top:.85rem; font-family:var(--font-mono); font-size:clamp(.72rem,1.05vw,.86rem); font-weight:500; letter-spacing:.02em; line-height:1.9; color:var(--muted); }
.hero-copy .hero-tagline{
  font-weight:700; font-size:clamp(1.5rem, 3vw, 2.3rem); line-height:1.2;
  letter-spacing:-0.02em; margin-top:1.1rem; text-wrap:balance;
}
.hero-copy .hero-tagline .hl{ color:var(--accent); position:relative; white-space:nowrap; }
.hero-copy h1 .hl{ color:var(--accent); position:relative; white-space:nowrap; }
.hero-copy h1 .hl::after{
  content:""; position:absolute; left:0; right:0; bottom:-.06em; height:4px; border-radius:2px;
  background:linear-gradient(90deg, var(--accent), transparent); opacity:.7;
}
.hero-cmd{
  display:inline-flex; align-items:center; gap:.55em; margin-top:1.3rem;
  font-family:var(--font-mono); font-size:.82rem; direction:ltr; color:var(--muted);
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:9px; padding:.55em .9em;
}
.hero-cmd .p{ color:var(--accent); } .hero-cmd .g{ color:var(--ink); }
.hero-cmd .cur{ width:7px; height:1em; background:var(--accent); display:inline-block; vertical-align:-2px; animation:blink 1.1s steps(1) infinite; }
body.no-grid .hero-cmd .cur{ animation:none; }
.hero-copy .lede{ color:var(--muted); font-size:1.15rem; margin-top:1.4rem; max-width:46ch; text-wrap:pretty; }
.hero-actions{ display:flex; gap:14px; margin-top:2.2rem; flex-wrap:wrap; }
.hero-trust{ display:flex; gap:28px; margin-top:2.6rem; flex-wrap:wrap; }
.hero-trust .ti{ display:flex; flex-direction:column; }
.hero-trust .ti b{ font-family:var(--font-mono); font-size:1.5rem; color:var(--ink); direction:ltr; }
.hero-trust .ti span{ color:var(--faint); font-size:.85rem; }

/* terminal */
.terminal{
  background: oklch(0.145 0.013 248);
  border:1px solid var(--term-line-2);
  border-radius:var(--radius);
  box-shadow: 0 30px 80px -40px #000, 0 0 0 1px var(--line);
  overflow:hidden; direction:ltr;
  position:relative;
}
.terminal::after{
  /* scanline sweep */
  content:""; position:absolute; left:0; right:0; top:0; height:120px;
  background:linear-gradient(180deg, var(--accent-soft), transparent);
  opacity:.0; animation: scan 5.5s linear infinite;
  pointer-events:none;
}
@keyframes scan{ 0%{ transform:translateY(-120px); opacity:.0;} 8%{opacity:.7;} 50%{opacity:.5;} 92%{opacity:.0;} 100%{ transform:translateY(520px); opacity:0;} }
body.no-grid .terminal::after{ animation:none; display:none; }
.term-bar{ display:flex; align-items:center; gap:8px; padding:13px 16px; border-bottom:1px solid var(--term-line); background:oklch(0.18 0.014 248); }
.term-bar i{ width:11px; height:11px; border-radius:50%; background:var(--bg-3); display:block; }
.term-bar i:nth-child(1){ background:oklch(0.7 0.18 25);} .term-bar i:nth-child(2){ background:oklch(0.82 0.14 80);} .term-bar i:nth-child(3){ background:var(--term-accent);}
.term-bar span{ margin-inline-start:auto; font-family:var(--font-mono); font-size:.72rem; color:var(--term-faint); }
.term-body{ padding:20px 20px 24px; font-family:var(--font-mono); font-size:.82rem; line-height:1.95; min-height:330px; }
.term-body .ln{ opacity:0; transform:translateY(4px); }
.term-body .ln.show{ opacity:1; transform:none; transition:.3s ease; }
.tc-dim{ color:var(--term-faint); } .tc-grn{ color:var(--term-accent); } .tc-wrn{ color:var(--term-warn); } .tc-crt{ color:var(--term-crit); } .tc-ink{ color:var(--term-ink); }
.term-prompt::before{ content:"pihunter@scan:~$ "; color:var(--term-accent); }
.term-cursor{ display:inline-block; width:8px; height:1.05em; background:var(--term-accent); vertical-align:-2px; animation:blink 1.1s steps(1) infinite; }
@keyframes blink{ 50%{ opacity:0; } }
.term-bargraph{ height:6px; border-radius:3px; background:var(--term-bg-2); overflow:hidden; margin:6px 0; }
.term-bargraph > i{ display:block; height:100%; width:0; background:var(--term-accent); border-radius:3px; }

/* ---------- generic card grids ---------- */
.grid{ display:grid; gap:20px; }
.card{
  background:var(--card); border:1px solid var(--line); border-radius:var(--radius);
  padding:30px; transition:.25s ease; position:relative; overflow:hidden;
}
.card:hover{ border-color:var(--line-2); }
/* lift only where the card is clickable */
.svc:hover, .article:hover{ transform:translateY(-3px); }

/* services */
.services-grid{ grid-template-columns: repeat(3, 1fr); }
.svc{ display:flex; flex-direction:column; gap:14px; padding:30px; }
.svc .ico{
  width:52px; height:52px; border-radius:12px; display:grid; place-items:center;
  background:var(--accent-soft); border:1px solid var(--accent-line); color:var(--accent);
  font-family:var(--font-mono); font-size:1.05rem; font-weight:600; letter-spacing:.02em;
}
.svc h3{ font-size:1.22rem; }
.svc p{ color:var(--muted); }
.svc .more{ margin-top:auto; color:var(--accent); font-weight:600; font-size:.95rem; display:inline-flex; gap:.5em; align-items:center; direction:rtl;}
.svc .more .ar{ font-family:var(--font-mono); transition:.2s; }
.svc:hover .more .ar{ transform:translateX(-4px); }
.svc::before{ content:""; position:absolute; inset:0 auto 0 0; width:3px; background:var(--accent); transform:scaleY(0); transform-origin:top; transition:.25s; }
.svc:hover::before{ transform:scaleY(1); }

/* ---------- order (ثبت سفارش — woocommerce-ready) ---------- */
.order-grid{ display:grid; grid-template-columns: minmax(0,.9fr) minmax(0,1.1fr); gap:48px; align-items:start; }
.order-grid > *{ min-width:0; }
.order-pitch h2{ font-size:clamp(1.9rem,4vw,3rem); text-wrap:balance; }
.order-pitch > p{ color:var(--muted); margin-top:1rem; font-size:1.05rem; text-wrap:pretty; }
.order-assure{ list-style:none; margin:30px 0 0; padding:0; display:flex; flex-direction:column; gap:16px; }
.order-assure li{ display:flex; gap:14px; align-items:flex-start; color:var(--ink); font-size:1rem; }
.order-assure li b{ display:block; }
.order-assure li span{ color:var(--faint); font-size:.9rem; }
.order-assure .ck{ flex:none; width:34px; height:34px; border-radius:9px; display:grid; place-items:center; background:var(--accent-soft); border:1px solid var(--accent-line); color:var(--accent); font-family:var(--font-mono); font-weight:700; }

.order-card{ background:var(--card); border:1px solid var(--line); border-radius:20px; padding:clamp(26px,3vw,38px); }
.order-card .step-tag{ font-family:var(--font-mono); font-size:.72rem; letter-spacing:.14em; color:var(--accent); direction:ltr; }
.order-card h3{ font-size:1.5rem; margin:8px 0 26px; }
.field{ margin-bottom:22px; }
.field > label{ display:block; font-size:.92rem; font-weight:600; color:var(--ink); margin-bottom:10px; }
.field .hint{ color:var(--faint); font-weight:400; font-size:.82rem; }
.seg{ display:flex; flex-wrap:wrap; gap:10px; }
.seg button{
  font-family:var(--font-fa); font-size:.92rem; color:var(--muted); cursor:pointer;
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:10px; padding:.7em 1.1em;
  display:inline-flex; align-items:center; gap:.5em; transition:.18s ease;
}
.seg button .en{ font-family:var(--font-mono); font-size:.68rem; color:var(--faint); direction:ltr; }
.seg button:hover{ border-color:var(--accent-line); color:var(--ink); }
.seg button.active{ background:var(--accent-soft); border-color:var(--accent); color:var(--accent); }
.seg button.active .en{ color:var(--accent); }
.field input, .field textarea{
  width:100%; box-sizing:border-box; font-family:var(--font-fa); font-size:1rem; color:var(--ink);
  background:var(--bg-1); border:1px solid var(--line-2); border-radius:10px; padding:.85em 1em; transition:.18s;
}
.field input::placeholder, .field textarea::placeholder{ color:var(--faint); }
.field input:focus, .field textarea:focus{ outline:none; border-color:var(--accent); box-shadow:0 0 0 3px var(--accent-soft); }
.field textarea{ resize:vertical; min-height:96px; line-height:1.7; }
.order-card .btn{ width:100%; justify-content:center; }
.order-note{ margin-top:14px; text-align:center; color:var(--faint); font-size:.84rem; }
.order-ok{ display:none; margin-top:16px; padding:14px 16px; border-radius:11px; background:var(--accent-soft); border:1px solid var(--accent-line); color:var(--accent); font-size:.92rem; text-align:center; }
.order-ok.show{ display:block; }

/* ---------- achievements / awards ---------- */
/* proof wall — awards + metrics live on one surface */
.proof-wall{ border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--card); }
.awards{ display:grid; grid-template-columns:repeat(4,1fr); }
.award{ display:flex; flex-direction:column; gap:14px; padding:28px 26px; align-items:flex-start; border-inline-start:1px solid var(--line); }
.award:first-child{ border-inline-start:0; }
.proof-wall .stats{ border:0; border-top:1px solid var(--line); border-radius:0; background:none; }
.award .medal{ font-family:var(--font-mono); font-size:.7rem; letter-spacing:.1em; color:var(--accent); border:1px solid var(--accent-line); border-radius:8px; padding:.3em .6em; direction:ltr; }
.award h4{ font-size:1.05rem; line-height:1.4; }
.award p{ color:var(--faint); font-size:.85rem; }

/* ---------- stats ---------- */
.stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:0; border:1px solid var(--line); border-radius:var(--radius); overflow:hidden; background:var(--card); }
.stat{ padding:28px 20px; border-inline-start:1px solid var(--line); text-align:center; }
.stat:first-child{ border-inline-start:none; }
.stat b{ font-family:var(--font-mono); font-size:clamp(2rem,3.4vw,2.8rem); color:var(--accent); display:block; direction:ltr; }
.stat span{ color:var(--muted); font-size:.92rem; }

/* ---------- team ---------- */
.team-grid{ grid-template-columns:repeat(4,1fr); gap:28px 20px; }
/* photo-led profiles — no card chrome */
.member{ padding:6px 4px 0; text-align:center; overflow:visible; background:none; border:0; }
.member .photo{ width:116px; height:116px; border-radius:50%; object-fit:cover; margin:0 auto 16px; border:1px solid var(--line-2); box-shadow:0 0 0 5px var(--accent-soft); }
.member .meta{ padding:0; }
.member h4{ font-size:1.1rem; }
.member .role{ color:var(--accent); font-family:var(--font-fa); font-size:.82rem; font-weight:600; margin-top:3px; direction:rtl; }
.member p{ color:var(--muted); font-size:.84rem; margin-top:10px; text-wrap:pretty; }
.member .socials{ display:flex; gap:8px; margin-top:14px; justify-content:center; }
.member .socials a{ font-family:var(--font-mono); font-size:.68rem; color:var(--faint); border:1px solid var(--line); border-radius:8px; padding:.3em .6em; direction:ltr; transition:.18s; }
.member .socials a:hover{ color:var(--accent); border-color:var(--accent-line); }

/* ---------- process / timeline ---------- */
.proc-std{ display:flex; flex-wrap:wrap; gap:10px; justify-content:center; margin-top:22px; }
.proc-std span{
  font-family:var(--font-mono); font-size:.72rem; letter-spacing:.05em; color:var(--muted);
  border:1px solid var(--line-2); border-radius:999px; padding:.42em .9em; direction:ltr;
}
.timeline{ list-style:none; margin:44px auto 0; padding:0; max-width:920px; position:relative; }
.timeline::before{
  content:""; position:absolute; top:10px; bottom:10px; inset-inline-start:23px; width:2px;
  background:linear-gradient(var(--accent-line), var(--line) 70%);
}
.timeline::after{
  content:""; position:absolute; inset-inline-start:21px; top:6px; width:6px; height:46px; border-radius:6px;
  background:linear-gradient(var(--accent), transparent); filter:blur(1px); opacity:.85;
  animation:tlPulse 4.6s cubic-bezier(.55,0,.45,1) infinite;
}
@keyframes tlPulse{ 0%{ top:6px; opacity:0; } 12%{ opacity:.9; } 85%{ opacity:.9; } 100%{ top:calc(100% - 52px); opacity:0; } }
body.no-grid .timeline::after{ display:none; }

.tl-item{ position:relative; display:grid; grid-template-columns:48px 1fr; gap:22px; padding-bottom:34px; }
.tl-item:last-child{ padding-bottom:0; }
.tl-node{
  width:48px; height:48px; border-radius:50%; display:grid; place-items:center; z-index:1;
  background:var(--bg-1); border:1px solid var(--line-2); transition:border-color .35s ease, box-shadow .35s ease, background .35s ease;
}
.tl-num{ font-family:var(--font-mono); font-weight:600; font-size:.95rem; color:var(--muted); transition:color .35s ease; }
.tl-item.in .tl-node{ border-color:var(--accent); background:var(--accent-soft); box-shadow:0 0 0 4px var(--accent-soft), 0 0 24px -3px var(--accent); }
.tl-item.in .tl-num{ color:var(--accent); }
.tl-body{ padding-top:5px; }
.tl-head{ display:flex; align-items:center; gap:12px; flex-wrap:wrap; }
.tl-head h4{ font-size:1.22rem; }
.tl-tag{
  font-family:var(--font-mono); font-size:.68rem; letter-spacing:.05em; color:var(--accent);
  background:var(--accent-soft); border:1px solid var(--accent-line); padding:.3em .6em; border-radius:8px; direction:ltr;
}
.tl-body p{ color:var(--muted); margin-top:10px; text-wrap:pretty; }
.tl-chips{ display:flex; flex-wrap:wrap; gap:8px; margin-top:15px; }
.tl-chips span{
  font-size:.84rem; color:var(--ink); background:var(--bg-2);
  border:1px solid var(--line); border-radius:999px; padding:.38em .9em;
}
.tl-item.reveal{ transition-delay:.04s; }
.tl-item:nth-child(2).reveal{ transition-delay:.1s; }
.tl-item:nth-child(3).reveal{ transition-delay:.16s; }
.tl-item:nth-child(4).reveal{ transition-delay:.22s; }
.tl-item:nth-child(5).reveal{ transition-delay:.28s; }

/* ---------- testimonials ---------- */
/* testimonials — editorial quotes, no card box */
.quotes{ display:grid; grid-template-columns:repeat(2,1fr); gap:8px 64px; }
.quote{ padding:28px 2px 12px; display:flex; flex-direction:column; gap:16px; border-top:1px solid var(--line-2); }
.quote .mark{ font-family:var(--font-mono); color:var(--accent); font-size:2.1rem; line-height:.6; }
.quote p{ font-size:1.13rem; line-height:2; color:var(--ink); }
.quote .by{ display:flex; align-items:center; gap:14px; margin-top:auto; }
.quote .by .av{ width:48px; height:48px; border-radius:50%; flex:none; }
.quote .by b{ font-size:1rem; } .quote .by span{ color:var(--faint); font-size:.85rem; }

/* ---------- clients ---------- */
.clients{ border-block:1px solid var(--line); padding-block:46px; }
.clients .row{ display:flex; flex-wrap:wrap; gap:18px 26px; align-items:center; justify-content:center; }
.client-chip{
  height:54px; min-width:150px; padding:0 26px; border:1px solid var(--line); border-radius:12px;
  display:grid; place-items:center; color:var(--faint); font-weight:700; font-size:1.05rem;
  background:var(--card); transition:.2s; letter-spacing:-.01em;
}
.client-chip:hover{ color:var(--ink); border-color:var(--line-2); }

/* ---------- FAQ ---------- */
.faq-wrap{ display:grid; grid-template-columns: .85fr 1.15fr; gap:48px; align-items:start; }
.faq-list{ display:flex; flex-direction:column; }
.faq-item{ border-top:1px solid var(--line); }
.faq-item:last-child{ border-bottom:1px solid var(--line); }
.faq-q{ width:100%; background:none; border:0; color:var(--ink); font-family:var(--font-fa); font-size:1.1rem; font-weight:600; text-align:right; padding:22px 0; cursor:pointer; display:flex; align-items:center; gap:16px; }
.faq-q .pm{ flex:none; width:26px; height:26px; border:1px solid var(--line-2); border-radius:8px; display:grid; place-items:center; color:var(--accent); font-family:var(--font-mono); transition:.2s; margin-inline-start:auto; }
.faq-item.open .faq-q .pm{ background:var(--accent); color:var(--accent-ink); border-color:var(--accent); }
.faq-a{ max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-a > div{ padding:0 0 22px; color:var(--muted); line-height:1.85; }

/* ---------- articles ---------- */
.articles{ grid-template-columns:repeat(3,1fr); }
.article{ padding:0; overflow:hidden; display:flex; flex-direction:column; }
.article .ph{ aspect-ratio:16/9; }
/* branded article cover — replaces dev COVER placeholders */
.acover{ aspect-ratio:16/9; position:relative; overflow:hidden; display:grid; place-items:center; background:var(--bg-1); background-image:radial-gradient(120% 150% at 50% -30%, var(--accent-soft), transparent 62%); border-bottom:1px solid var(--line); }
.acover::before{ content:""; position:absolute; inset:-45% -25%; background:repeating-radial-gradient(circle at 50% 135%, transparent 0 30px, var(--line) 30px 31px); }
.acover b{ position:relative; font-family:var(--font-mono); font-weight:600; font-size:1.3rem; letter-spacing:.1em; color:var(--accent); direction:ltr; }
.acover span{ position:absolute; bottom:10px; inset-inline-start:14px; font-family:var(--font-mono); font-size:.6rem; letter-spacing:.16em; color:var(--faint); direction:ltr; }
.article .meta{ padding:24px; display:flex; flex-direction:column; gap:12px; flex:1; }
.article .meta .tag{ align-self:flex-start; }
.article h4{ font-size:1.18rem; line-height:1.45; }
.article .more{ margin-top:auto; color:var(--accent); font-size:.9rem; font-weight:600; }

/* ---------- CTA ---------- */
.cta{ position:relative; }
.cta-card{
  border:1px solid var(--accent-line); border-radius:20px; padding:clamp(40px,6vw,72px);
  background:linear-gradient(135deg, var(--accent-soft), transparent 55%), var(--card);
  text-align:center; position:relative; overflow:hidden;
}
.cta-card h2{ font-size:clamp(1.9rem,4vw,3rem); text-wrap:balance; }
.cta-card p{ color:var(--muted); margin-top:1rem; font-size:1.1rem; max-width:54ch; margin-inline:auto; }
.cta-card .hero-actions{ justify-content:center; }

/* ---------- footer ---------- */
.footer{
  position:relative; overflow:hidden;
  border-top:1px solid var(--line); padding-block:54px 28px; margin-top:32px;
  background:linear-gradient(180deg, color-mix(in oklab, var(--accent) 5%, transparent), transparent 46%);
}
.footer::before{
  content:""; position:absolute; top:-1px; inset-inline:0; height:1px; z-index:2;
  background:linear-gradient(90deg, transparent, var(--accent-line) 28%, var(--accent) 50%, var(--accent-line) 72%, transparent);
}
.footer::after{
  content:""; position:absolute; inset-inline-start:-70px; bottom:-110px; width:380px; height:380px; z-index:0;
  background:url(assets/logo-mark2.svg) center/contain no-repeat; opacity:.05; pointer-events:none;
}
.footer .wrap{ position:relative; z-index:1; }
.footer-grid{ display:grid; grid-template-columns: 1.9fr 1fr 1fr 1.1fr; gap:40px; }
.footer .brand{ display:flex; align-items:center; gap:.65em; margin-bottom:18px; }
.footer .brand .emblem{ height:64px; filter:drop-shadow(0 0 22px var(--accent-soft)); transition:.22s ease; }
.footer .brand:hover .emblem{ filter:drop-shadow(0 0 30px var(--accent-line)); transform:translateY(-2px); }
.footer .brand .wordmark{ height:38px; }
.footer p{ color:var(--muted); font-size:.95rem; max-width:40ch; line-height:1.95; }
.footer-status{
  display:inline-block; margin-top:20px; white-space:nowrap;
  font-family:var(--font-fa); font-size:.82rem; letter-spacing:0; color:var(--muted); direction:rtl;
  border:1px solid var(--line-2); border-radius:999px; padding:.45em 1em; background:var(--bg-1);
}
.footer-status .dot{ display:inline-block; vertical-align:middle; margin-inline-start:.6em; margin-top:-2px; width:8px; height:8px; border-radius:50%; background:var(--accent); animation:statusPulse 2.4s ease-out infinite; }
@keyframes statusPulse{ 0%{ box-shadow:0 0 0 0 var(--accent-line); } 70%{ box-shadow:0 0 0 7px transparent; } 100%{ box-shadow:0 0 0 0 transparent; } }
body.no-grid .footer-status .dot{ animation:none; }
.footer h5{ font-family:var(--font-fa); font-size:.95rem; font-weight:700; letter-spacing:0; color:var(--ink); margin:0 0 18px; display:flex; align-items:center; gap:.55em; }
.footer h5::before{ content:""; width:14px; height:2px; background:var(--accent); border-radius:2px; flex:none; }
.footer ul{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:12px; }
.footer ul a{ color:var(--muted); font-size:.95rem; display:inline-flex; align-items:center; gap:.5em; transition:.18s; width:fit-content; }
.footer ul a::before{ content:"›"; color:var(--accent); opacity:0; margin-inline-end:-.5em; transition:.18s; font-family:var(--font-mono); }
.footer ul a:hover{ color:var(--accent); }
.footer ul a:hover::before{ opacity:1; margin-inline-end:0; }
.footer-bottom{ display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:36px; padding-top:22px; border-top:1px solid var(--line); color:var(--faint); font-size:.85rem; flex-wrap:wrap; }
.footer-bottom .socials{ display:flex; gap:10px; }
.footer-bottom .socials a{ font-family:var(--font-mono); font-size:.72rem; border:1px solid var(--line-2); border-radius:9px; padding:.55em 1em; direction:ltr; transition:.18s; }
.footer-bottom .socials a:hover{ color:var(--accent); border-color:var(--accent-line); background:var(--accent-soft); }

/* ---------- image placeholder ---------- */
.ph{
  background:
    repeating-linear-gradient(135deg, var(--ph-a) 0 12px, var(--ph-b) 12px 24px);
  position:relative; display:grid; place-items:center;
}
.ph::after{
  content: attr(data-label);
  font-family:var(--font-mono); font-size:.7rem; letter-spacing:.05em; color:var(--faint);
  border:1px dashed var(--line-2); border-radius:7px; padding:.5em .8em; direction:ltr;
  background:oklch(0.18 0.014 248 / .6);
}

/* ---------- reveal on scroll ---------- */
.reveal{ opacity:0; transform:translateY(22px); transition: opacity .6s ease, transform .6s ease; }
.reveal.in{ opacity:1; transform:none; }
@media (prefers-reduced-motion: reduce){ .reveal{ opacity:1; transform:none; } }

/* ---------- responsive ---------- */
@media (max-width: 920px){
  .order-grid{ grid-template-columns:minmax(0,1fr); gap:36px; }
}
@media (max-width: 1080px){
  .hero-grid{ grid-template-columns:1fr; }
  .pkg-grid{ grid-template-columns:repeat(2,1fr); }
  .awards, .articles{ grid-template-columns:repeat(2,1fr); }
  .award:nth-child(odd){ border-inline-start:0; }
  .award:nth-child(n+3){ border-top:1px solid var(--line); }
  .services-grid{ grid-template-columns:repeat(2,1fr); }
  .stats{ grid-template-columns:repeat(3,1fr); }
  .stat:nth-child(4){ border-inline-start:none; }
  .faq-wrap{ grid-template-columns:1fr; gap:24px; }
}
@media (max-width: 720px){
  body{ font-size:16px; }
  .nav{ --navh:66px; }
  .nav-inner{ gap:12px; }
  .brand .emblem{ height:40px; }
  .brand .wordmark{ height:26px; }
  .hero-actions{ flex-direction:column; align-items:stretch; }
  .hero-actions .btn{ width:100%; justify-content:center; }
  .services-grid, .pkg-grid, .awards, .articles, .quotes{ grid-template-columns:1fr; }
  .award{ border-inline-start:0; }
  .award:nth-child(n+2){ border-top:1px solid var(--line); }
  .stats{ grid-template-columns:repeat(2,1fr); }
  .stat{ border-inline-start:none; border-top:1px solid var(--line); }
  .stat:nth-child(-n+2){ border-top:none; }
  .timeline{ max-width:none; }
  .tl-item{ grid-template-columns:42px 1fr; gap:16px; }
  .tl-node{ width:42px; height:42px; }
  .timeline::before{ inset-inline-start:20px; }
  .timeline::after{ inset-inline-start:18px; }
  .footer-grid{ grid-template-columns:1fr 1fr; }
  .hero-trust{ gap:20px; }
}

/* team: 4 → 2 → 1 columns */
@media (max-width: 720px){ .team-grid{ grid-template-columns:repeat(2,1fr); } .member .photo{ width:96px; height:96px; } }
@media (max-width: 480px){ .team-grid{ grid-template-columns:1fr; } }

/* ---------- MOBILE MENU — terminal takeover (nav collapses at 940px) ---------- */
.nav-term, .nav-term-foot{ display:none; }
@media (max-width: 940px){
  .nav-cta{ margin-inline-start:auto; }
  .nav-cta > .btn-primary{ display:none; }   /* inline CTA moves into the menu */
  .nav-burger{ display:block; }
  .nav.open .nav-burger{ box-shadow:0 0 18px var(--accent-line); }
  /* backdrop-filter makes .nav the containing block for fixed children — drop it while the menu is open so the overlay can cover the viewport */
  .nav.open{ backdrop-filter:none; -webkit-backdrop-filter:none; background:var(--nav-menu-bg); border-bottom-color:var(--accent-line); }

  .nav-links{
    display:flex; flex-direction:column; justify-content:flex-start;
    position:fixed; inset:var(--navh) 0 0; margin:0; gap:0;
    padding:18px var(--gutter) calc(18px + env(safe-area-inset-bottom));
    background:
      radial-gradient(120% 90% at 85% -10%, var(--accent-soft), transparent 55%),
      linear-gradient(var(--nav-menu-bg), var(--nav-menu-bg));
    backdrop-filter: blur(22px) saturate(1.5);
    -webkit-backdrop-filter: blur(22px) saturate(1.5);
    border-top:1px solid var(--accent-line);
    overflow:auto; overscroll-behavior:contain;
    opacity:0; visibility:hidden; pointer-events:none;
    clip-path: inset(0 0 100% 0);
    transition: clip-path .5s cubic-bezier(.83,0,.17,1), opacity .25s ease, visibility 0s .5s;
  }
  .nav.open .nav-links{
    opacity:1; visibility:visible; pointer-events:auto;
    clip-path: inset(0 0 0 0);
    transition: clip-path .55s cubic-bezier(.22,1,.36,1), opacity .15s ease;
  }
  /* scanlines + faint grid */
  .nav-links::before{
    content:""; position:absolute; inset:0; pointer-events:none;
    background:
      repeating-linear-gradient(0deg, oklch(1 0 0 / 0.02) 0 1px, transparent 1px 4px),
      linear-gradient(var(--line) 1px, transparent 1px) 0 0/100% 72px,
      linear-gradient(90deg, var(--line) 1px, transparent 1px) 0 0/72px 100%;
    opacity:.45; mask-image:linear-gradient(180deg, transparent, #000 25%);
    -webkit-mask-image:linear-gradient(180deg, transparent, #000 25%);
  }
  /* one-shot scan sweep on open */
  .nav-links::after{
    content:""; position:absolute; left:0; right:0; top:0; height:2px; pointer-events:none; opacity:0;
    background:linear-gradient(90deg, transparent, var(--accent), transparent);
    box-shadow:0 0 26px 4px var(--accent-line);
  }
  .nav.open .nav-links::after{ animation:menuScan .95s cubic-bezier(.22,1,.36,1) .12s; }

  /* terminal prompt (typed on open) */
  .nav-term{ display:block; margin-top:auto; font-family:var(--font-mono); font-size:.82rem; direction:ltr; text-align:left; color:var(--muted); padding:2px 4px 16px; letter-spacing:.02em; }
  .nav-term .tp{ color:var(--accent); }
  .nav-term .tc{ display:inline-block; overflow:hidden; white-space:nowrap; vertical-align:bottom; width:0; color:var(--ink); }
  .nav.open .nav-term .tc{ animation:navType .65s steps(9) .4s both; }
  .nav-term .cur{ display:inline-block; width:.58em; height:1.05em; margin-left:3px; background:var(--accent); vertical-align:text-bottom; animation:curBlink 1s steps(2) infinite; }

  .nav-links li{
    opacity:0; transform:translateY(16px); filter:blur(5px);
    transition: opacity .3s ease, transform .42s cubic-bezier(.22,1,.36,1), filter .35s ease;
  }
  .nav.open .nav-links li{ opacity:1; transform:none; filter:none; }
  .nav.open .nav-links li:nth-child(1){ transition-delay:.06s }
  .nav.open .nav-links li:nth-child(2){ transition-delay:.11s }
  .nav.open .nav-links li:nth-child(3){ transition-delay:.15s }
  .nav.open .nav-links li:nth-child(4){ transition-delay:.19s }
  .nav.open .nav-links li:nth-child(5){ transition-delay:.23s }
  .nav.open .nav-links li:nth-child(6){ transition-delay:.27s }
  .nav.open .nav-links li:nth-child(7){ transition-delay:.31s }
  .nav.open .nav-links li:nth-child(8){ transition-delay:.35s }
  .nav.open .nav-links li:nth-child(9){ transition-delay:.39s }
  .nav.open .nav-links li:nth-child(10){ transition-delay:.45s }
  .nav.open .nav-links li:nth-child(11){ transition-delay:.52s }

  .nav-links li.mi{ counter-increment:navi; border-bottom:1px dashed var(--line-2); }
  .nav-links li.mi a{
    display:flex; align-items:baseline; gap:14px;
    font-size:clamp(1.28rem, 5.4vh, 1.6rem); font-weight:700; line-height:1.3;
    color:var(--ink); padding:.5em 6px; border-radius:0; transition:.2s;
  }
  .nav-links li.mi a::before{
    content:"0" counter(navi);
    font-family:var(--font-mono); font-weight:500; font-size:.55em;
    color:var(--accent); opacity:.85; min-width:2ch; direction:ltr;
  }
  /* mono file-path tag from data-cmd */
  .nav-links li.mi a::after{
    content:attr(data-cmd); margin-inline-start:auto;
    font-family:var(--font-mono); font-weight:400; font-size:.48em;
    color:var(--muted); opacity:.55; direction:ltr; letter-spacing:.04em; transition:.2s;
  }
  .nav-links li.mi a:hover, .nav-links li.mi a:active{
    background:linear-gradient(to left, var(--accent-soft), transparent 70%);
    color:var(--accent); padding-inline-start:16px;
  }
  .nav-links li.mi a:active{ text-shadow:1.5px 0 oklch(0.7 0.2 25 / .55), -1.5px 0 var(--accent-line); }
  .nav-links li.mi a:hover::after, .nav-links li.mi a:active::after{ color:var(--accent); opacity:.9; }
  .nav-links li.mi a.current{ color:var(--accent); }

  .mobile-cta-li{ display:block; margin-top:26px; }
  .mobile-cta-li .btn{ width:100%; justify-content:center; padding:1em; font-size:1.05rem; }
  .mobile-cta-li .btn-primary{ color:var(--accent-ink); box-shadow:0 0 34px var(--accent-line); }

  /* status bar */
  .nav-term-foot{
    display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:18px; margin-bottom:auto;
    font-family:var(--font-mono); font-size:.66rem; letter-spacing:.14em;
    color:var(--muted); direction:ltr; border-top:1px solid var(--line); padding-top:12px;
  }
  .nav-term-foot .tf{ display:flex; align-items:center; gap:8px; }
  .nav-term-foot .dot{ width:7px; height:7px; border-radius:50%; background:var(--accent); box-shadow:0 0 10px var(--accent); animation:curBlink 1.6s ease infinite; }
}
@keyframes menuScan{ 0%{opacity:1; transform:translateY(0)} 100%{opacity:0; transform:translateY(80vh)} }
@keyframes navType{ from{width:0} to{width:9ch} }
@keyframes curBlink{ 50%{opacity:0} }
@media (prefers-reduced-motion: reduce){
  .nav-links, .nav-links li, .nav-term .tc{ transition-duration:.01s !important; animation-duration:.01s !important; }
}


/* ==========================================================================
   Accessibility, forms and touch-target pass
   ========================================================================== */
:where(a,button,input,select,textarea,summary,[tabindex]):focus-visible{ outline:2px solid var(--accent); outline-offset:2px; border-radius:6px; }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; border:0; }
.skip-link{ position:fixed; inset-block-start:-100px; inset-inline-start:16px; z-index:9999; background:var(--accent); color:#08120c; font-weight:700; padding:.7em 1.2em; border-radius:0 0 10px 10px; transition:inset-block-start .18s; }
.skip-link:focus{ inset-block-start:0; }
.req{ color:var(--accent); margin-inline-start:.15em; }
.field-err{ margin-top:7px; font-size:.82rem; line-height:1.7; color:oklch(0.72 0.17 25); }
.field-err:empty{ display:none; }
.field.has-err input,.field.has-err textarea,.field.has-err select{ border-color:oklch(0.68 0.19 25); box-shadow:0 0 0 3px oklch(0.68 0.19 25 / .16); }
.ok-ref{ font-family:var(--font-mono); letter-spacing:.04em; }
.ok-ref-lbl{ opacity:.8; }
.contact-ok.show,.order-ok.show{ line-height:2; }
@media (pointer:coarse){
  a,button,.btn,[role=button],[role=radio],[role=switch]{ min-height:44px; }
  .socials a,.share-row a,.nav-links a,.footer ul a{ display:inline-flex; align-items:center; min-height:44px; }
}

/* global reduced-motion pass — every non-essential animation off */
@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{ animation-duration:.01ms !important; animation-iteration-count:1 !important; transition-duration:.01ms !important; }
  html{ scroll-behavior:auto; }
}
