/*
  Hamzah Portfolio
  Original static build inspired by premium portfolio structure.
  No external CSS framework, no remote fonts, no copied assets.
*/
:root {
  color-scheme: dark;
  --bg: #08090d;
  --bg-2: #0d1017;
  --surface: rgba(255, 255, 255, 0.065);
  --surface-strong: rgba(255, 255, 255, 0.11);
  --line: rgba(255, 255, 255, 0.12);
  --line-strong: rgba(255, 255, 255, 0.2);
  --text: #f7f3e8;
  --muted: #a8afbd;
  --muted-2: #717889;
  --accent: #8dffcf;
  --accent-2: #f0d78a;
  --accent-3: #8eb7ff;
  --danger: #ff7373;
  --shadow: 0 24px 90px rgba(0, 0, 0, 0.45);
  --radius: 28px;
  --radius-lg: 42px;
  --max: 1180px;
  --ease: cubic-bezier(.2, .7, .1, 1);
}

[data-theme="light"] {
  color-scheme: light;
  --bg: #f8f5ea;
  --bg-2: #fffdf6;
  --surface: rgba(0, 0, 0, 0.055);
  --surface-strong: rgba(0, 0, 0, 0.1);
  --line: rgba(0, 0, 0, 0.12);
  --line-strong: rgba(0, 0, 0, 0.2);
  --text: #10131b;
  --muted: #4d5668;
  --muted-2: #727b8f;
  --accent: #007d5d;
  --accent-2: #926c00;
  --accent-3: #315fd6;
  --shadow: 0 24px 90px rgba(25, 21, 11, 0.16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  color: var(--text);
  background: var(--bg);
  line-height: 1.5;
  overflow-x: hidden;
  min-height: 100vh;
}
body.menu-open,
body.palette-open { overflow: hidden; }
body::selection { background: var(--accent); color: #07100e; }
a { color: inherit; text-decoration: none; }
button, input, textarea, select { font: inherit; }
button { color: inherit; }
img, svg { display: block; max-width: 100%; }

.skip-link {
  position: fixed;
  left: 16px;
  top: -60px;
  z-index: 2000;
  padding: 12px 16px;
  background: var(--accent);
  color: #06100d;
  border-radius: 999px;
  transition: top .2s ease;
}
.skip-link:focus { top: 16px; }

.page-loader {
  position: fixed;
  inset: 0;
  z-index: 3000;
  display: grid;
  place-items: center;
  gap: 18px;
  align-content: center;
  background: var(--bg);
  transition: opacity .55s ease, visibility .55s ease;
}
body.loaded .page-loader { opacity: 0; visibility: hidden; pointer-events: none; }
.loader-orb {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  border: 1px solid var(--line-strong);
  background: conic-gradient(from 180deg, transparent, var(--accent), var(--accent-2), transparent);
  animation: spin 1s linear infinite;
  position: relative;
}
.loader-orb::after {
  content: "";
  position: absolute;
  inset: 8px;
  border-radius: inherit;
  background: var(--bg);
}
.page-loader span { color: var(--muted); font-size: .9rem; letter-spacing: .08em; text-transform: uppercase; }

.ambient-bg { position: fixed; inset: 0; z-index: -2; overflow: hidden; pointer-events: none; }
.orb { position: absolute; filter: blur(70px); opacity: .38; border-radius: 999px; mix-blend-mode: screen; }
.orb-a { width: 440px; height: 440px; left: -160px; top: -140px; background: var(--accent); }
.orb-b { width: 500px; height: 500px; right: -150px; top: 18%; background: #654cff; }
.orb-c { width: 360px; height: 360px; left: 28%; bottom: -200px; background: var(--accent-2); }
.grid-layer {
  position: absolute;
  inset: 0;
  background-image:
    linear-gradient(to right, rgba(255,255,255,.055) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.04) 1px, transparent 1px);
  background-size: 82px 82px;
  mask-image: radial-gradient(circle at 50% 20%, black, transparent 75%);
}
[data-theme="light"] .orb { mix-blend-mode: multiply; opacity: .16; }

.site-header {
  position: sticky;
  top: 14px;
  z-index: 1000;
  width: min(calc(100% - 28px), 1260px);
  margin: 14px auto 0;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 20px;
  padding: 12px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg-2) 78%, transparent);
  backdrop-filter: blur(24px);
  border-radius: 999px;
  box-shadow: 0 18px 60px rgba(0,0,0,.18);
  transition: transform .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease);
}
.site-header.scrolled { border-color: var(--line-strong); background: color-mix(in srgb, var(--bg-2) 90%, transparent); }
.brand { display: inline-flex; align-items: center; gap: 10px; min-width: max-content; }
.brand-mark {
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  color: #07100d;
  font-weight: 900;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.45), 0 0 34px color-mix(in srgb, var(--accent) 42%, transparent);
}
.brand-text { font-weight: 800; letter-spacing: -.03em; line-height: .96; display: grid; }
.brand-text span { color: var(--muted); font-weight: 650; }
.nav { display: flex; justify-content: center; gap: 2px; }
.nav a {
  padding: 11px 14px;
  border-radius: 999px;
  color: var(--muted);
  font-size: .94rem;
  transition: color .2s ease, background .2s ease;
}
.nav a:hover,
.nav a:focus-visible { color: var(--text); background: var(--surface); outline: none; }
.header-actions { display: flex; align-items: center; gap: 8px; }
.icon-btn {
  width: 44px;
  height: 44px;
  border: 1px solid var(--line);
  border-radius: 999px;
  background: var(--surface);
  cursor: pointer;
  display: inline-grid;
  place-items: center;
  transition: transform .2s ease, border-color .2s ease, background .2s ease;
}
.icon-btn:hover { transform: translateY(-2px); border-color: var(--line-strong); background: var(--surface-strong); }
.icon-btn .sun { display: none; }
[data-theme="light"] .icon-btn .sun { display: inline; }
[data-theme="light"] .icon-btn .moon { display: none; }
.menu-btn { display: none; }
.menu-btn span { width: 17px; height: 2px; background: currentColor; display: block; border-radius: 10px; }
.menu-btn span + span { margin-top: -9px; transform: translateY(12px); }

.btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  min-height: 52px;
  padding: 0 20px;
  border-radius: 999px;
  border: 1px solid var(--line);
  font-weight: 800;
  letter-spacing: -.02em;
  transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease;
  cursor: pointer;
}
.btn:hover { transform: translateY(-3px); }
.btn-primary {
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  color: #07100d;
  border-color: transparent;
  box-shadow: 0 20px 55px color-mix(in srgb, var(--accent) 20%, transparent);
}
.btn-ghost { background: var(--surface); color: var(--text); }
.btn-ghost:hover { background: var(--surface-strong); border-color: var(--line-strong); }
.btn-small { min-height: 44px; padding-inline: 16px; font-size: .92rem; }

.mobile-panel {
  position: fixed;
  top: 86px;
  left: 14px;
  right: 14px;
  z-index: 999;
  display: none;
  padding: 16px;
  border-radius: 26px;
  border: 1px solid var(--line);
  background: color-mix(in srgb, var(--bg-2) 94%, transparent);
  backdrop-filter: blur(20px);
  box-shadow: var(--shadow);
}
.mobile-panel a { display: block; padding: 15px; color: var(--muted); border-radius: 16px; }
.mobile-panel a:hover { color: var(--text); background: var(--surface); }

.section-shell {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto;
  padding: 112px 0;
  position: relative;
}
.hero {
  min-height: calc(100vh - 80px);
  display: grid;
  grid-template-columns: minmax(0, 1.03fr) minmax(320px, .86fr);
  gap: 46px;
  align-items: center;
  padding-top: 82px;
}
.eyebrow,
.section-kicker {
  margin: 0 0 18px;
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .78rem;
  font-weight: 850;
}
.pulse-dot {
  display: inline-block;
  width: 9px;
  height: 9px;
  margin-right: 9px;
  border-radius: 999px;
  background: var(--accent);
  box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 50%, transparent);
  animation: pulse 1.7s infinite;
}
h1, h2, h3, p { margin-top: 0; }
h1 {
  max-width: 880px;
  margin-bottom: 24px;
  font-size: clamp(3.35rem, 9vw, 7.9rem);
  line-height: .84;
  letter-spacing: -.085em;
}
h2 {
  font-size: clamp(2.15rem, 5vw, 5.4rem);
  line-height: .9;
  letter-spacing: -.075em;
  margin-bottom: 18px;
}
h3 { letter-spacing: -.04em; }
.hero-lead,
.section-heading p,
.about-copy > p,
.process-intro > p,
.contact-copy > p {
  color: var(--muted);
  font-size: clamp(1rem, 1.6vw, 1.22rem);
  max-width: 680px;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 34px 0; }
.hero-proof {
  display: grid;
  grid-template-columns: repeat(4, minmax(120px, 1fr));
  gap: 12px;
}
.hero-proof div {
  padding: 17px;
  min-height: 106px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: linear-gradient(180deg, var(--surface), transparent);
}
.hero-proof strong { display: block; font-size: clamp(1.7rem, 3vw, 2.8rem); line-height: 1; letter-spacing: -.06em; }
.hero-proof span { display: block; margin-top: 10px; color: var(--muted); font-size: .88rem; }

.hero-visual { perspective: 1100px; }
.device-frame {
  position: relative;
  min-height: 620px;
  padding: 18px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-lg);
  background:
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.03)),
    radial-gradient(circle at 50% 0%, color-mix(in srgb, var(--accent) 24%, transparent), transparent 46%),
    var(--bg-2);
  box-shadow: var(--shadow);
  overflow: hidden;
  transform-style: preserve-3d;
}
.device-frame::before {
  content: "";
  position: absolute;
  inset: -2px;
  border-radius: inherit;
  background: linear-gradient(110deg, transparent, rgba(255,255,255,.22), transparent 60%);
  transform: translateX(-80%);
  animation: sheen 7s infinite;
  pointer-events: none;
}
.device-topbar {
  display: flex;
  align-items: center;
  gap: 8px;
  color: var(--muted-2);
  font-size: .84rem;
  padding-bottom: 18px;
}
.device-topbar span { width: 10px; height: 10px; border-radius: 50%; background: var(--line-strong); }
.device-topbar p { margin: 0 0 0 auto; }
.radar-card {
  position: relative;
  height: 304px;
  border: 1px solid var(--line);
  border-radius: 32px;
  overflow: hidden;
  background: radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 32%), rgba(0,0,0,.18);
}
.radar-grid {
  position: absolute;
  inset: 0;
  background:
    linear-gradient(to right, rgba(255,255,255,.06) 1px, transparent 1px),
    linear-gradient(to bottom, rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 30px 30px;
  mask-image: radial-gradient(circle, black, transparent 72%);
}
.radar-sweep {
  position: absolute;
  inset: 28px;
  border-radius: 50%;
  background: conic-gradient(from 0deg, color-mix(in srgb, var(--accent) 60%, transparent), transparent 34%);
  animation: spin 5s linear infinite;
  opacity: .8;
}
.radar-core {
  position: absolute;
  inset: 0;
  margin: auto;
  width: 106px;
  height: 106px;
  display: grid;
  place-items: center;
  border-radius: 32px;
  color: #07100d;
  font-weight: 950;
  font-size: 2rem;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  box-shadow: 0 0 60px color-mix(in srgb, var(--accent) 35%, transparent);
}
.metric-stack {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  margin: 14px 0;
}
.metric-pill {
  padding: 16px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: var(--surface);
}
.metric-pill span { display: block; color: var(--muted); font-size: .75rem; margin-bottom: 7px; }
.metric-pill b { font-size: 1.55rem; letter-spacing: -.05em; }
.code-card {
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background: rgba(0,0,0,.26);
  color: var(--accent);
  display: grid;
  gap: 8px;
  font-family: "SFMono-Regular", Consolas, "Liberation Mono", monospace;
  font-size: .92rem;
}
.marquee {
  position: absolute;
  bottom: 30px;
  left: 0;
  right: 0;
  overflow: hidden;
  border-block: 1px solid var(--line);
  mask-image: linear-gradient(90deg, transparent, black 12%, black 88%, transparent);
}
.marquee-track { display: flex; gap: 32px; width: max-content; padding: 20px 0; animation: marquee 24s linear infinite; }
.marquee span { color: var(--muted); text-transform: uppercase; letter-spacing: .16em; font-size: .78rem; font-weight: 850; }

.split-heading { display: grid; gap: 28px; }
.section-heading { display: grid; grid-template-columns: 1fr .72fr; gap: 34px; align-items: end; }
.section-heading p { margin-left: auto; }

.work-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}
.work-card {
  position: relative;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  padding: 14px;
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.025));
  overflow: hidden;
  min-height: 510px;
  display: flex;
  flex-direction: column;
  transition: transform .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease);
}
.work-card:hover { transform: translateY(-8px); border-color: var(--line-strong); background: var(--surface-strong); }
.work-card.featured { grid-column: span 2; }
.work-media {
  min-height: 300px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: var(--bg-2);
  overflow: hidden;
  position: relative;
}
.genshin-card { background: radial-gradient(circle at 30% 20%, #8eb7ff 0 8%, transparent 26%), radial-gradient(circle at 80% 10%, #f0d78a 0 6%, transparent 22%), linear-gradient(135deg, rgba(141,255,207,.22), rgba(101,76,255,.12)), #0d1017; }
.genshin-card::before,
.portfolio-card::before,
.admin-card::before,
.launch-card::before {
  content: "";
  position: absolute;
  inset: 22px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 20px;
  background-image: linear-gradient(to right, rgba(255,255,255,.07) 1px, transparent 1px), linear-gradient(to bottom, rgba(255,255,255,.05) 1px, transparent 1px);
  background-size: 28px 28px;
}
.planet { position: absolute; border-radius: 50%; background: linear-gradient(135deg, var(--accent), var(--accent-2)); box-shadow: 0 0 48px rgba(141,255,207,.3); }
.p1 { width: 82px; height: 82px; left: 14%; top: 20%; }
.p2 { width: 44px; height: 44px; right: 24%; top: 28%; background: linear-gradient(135deg, #8eb7ff, #ffffff); }
.p3 { width: 120px; height: 120px; right: 12%; bottom: -20px; background: linear-gradient(135deg, #654cff, var(--accent)); }
.portfolio-card { background: linear-gradient(135deg, rgba(141,255,207,.16), rgba(240,215,138,.12)), #0e121a; }
.portfolio-card::after { content: ""; position: absolute; left: 28px; right: 28px; bottom: 30px; height: 68px; border-radius: 18px; background: linear-gradient(90deg, var(--accent), var(--accent-2)); opacity: .75; }
.admin-card { background: linear-gradient(135deg, rgba(142,183,255,.15), rgba(255,255,255,.06)), #0e121a; }
.admin-card::after { content: ""; position: absolute; inset: 46px 38px auto; height: 150px; border-radius: 18px; background: repeating-linear-gradient(to bottom, rgba(255,255,255,.16) 0 10px, transparent 10px 28px); }
.launch-card { background: radial-gradient(circle at 50% 35%, rgba(141,255,207,.28), transparent 38%), #0e121a; }
.launch-card::after { content: ""; position: absolute; inset: auto 38px 42px; height: 6px; border-radius: 999px; background: linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3)); box-shadow: 0 0 40px rgba(141,255,207,.35); }
.work-content { padding: 22px 4px 4px; margin-top: auto; }
.card-index { color: var(--accent); font-size: .78rem; font-weight: 850; text-transform: uppercase; letter-spacing: .12em; }
.work-card h3 { font-size: clamp(1.35rem, 2.4vw, 2.4rem); margin-bottom: 12px; }
.work-card p:not(.card-index) { color: var(--muted); }
.tag-row { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.tag-row span {
  padding: 7px 10px;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  font-size: .78rem;
}

.about-grid { display: grid; grid-template-columns: .82fr 1.18fr; gap: 20px; align-items: stretch; }
.profile-card,
.about-copy,
.stage-card,
.contact-form,
.contact-copy {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.025));
  box-shadow: 0 18px 70px rgba(0,0,0,.12);
}
.profile-card { padding: 30px; display: flex; flex-direction: column; min-height: 620px; }
.avatar-orbit {
  position: relative;
  display: grid;
  place-items: center;
  flex: 1;
  min-height: 300px;
}
.avatar-orbit::before,
.avatar-orbit::after {
  content: "";
  position: absolute;
  width: 260px;
  height: 260px;
  border: 1px solid var(--line);
  border-radius: 50%;
}
.avatar-orbit::after { width: 190px; height: 190px; border-style: dashed; animation: spin 16s linear infinite; }
.avatar-core {
  width: 148px;
  height: 148px;
  display: grid;
  place-items: center;
  border-radius: 44px;
  font-size: 4rem;
  font-weight: 950;
  color: #06100d;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  box-shadow: 0 0 90px color-mix(in srgb, var(--accent) 22%, transparent);
  z-index: 1;
}
.avatar-orbit span { position: absolute; width: 12px; height: 12px; border-radius: 50%; background: var(--accent); }
.avatar-orbit span:nth-child(2) { transform: translate(130px, -70px); background: var(--accent-2); }
.avatar-orbit span:nth-child(3) { transform: translate(-90px, 105px); background: var(--accent-3); }
.avatar-orbit span:nth-child(4) { transform: translate(70px, 120px); }
.muted { color: var(--muted); }
.profile-card h2 { font-size: clamp(2rem, 4vw, 3.8rem); }
.profile-card p:not(.muted) { color: var(--muted); }
.profile-links { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.profile-links a {
  padding: 11px 13px;
  border-radius: 999px;
  background: var(--surface);
  border: 1px solid var(--line);
  color: var(--muted);
  transition: color .2s ease, border-color .2s ease, background .2s ease;
}
.profile-links a:hover { color: var(--text); background: var(--surface-strong); border-color: var(--line-strong); }
.about-copy { padding: 44px; }
.principles { display: grid; gap: 12px; margin-top: 34px; }
.principles div {
  padding: 22px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(255,255,255,.035);
}
.principles b { color: var(--accent); font-size: .86rem; }
.principles h3 { margin: 8px 0 8px; font-size: 1.35rem; }
.principles p { color: var(--muted); margin-bottom: 0; }

.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.service-card {
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  padding: 26px;
  min-height: 360px;
  display: flex;
  flex-direction: column;
  transition: transform .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease);
}
.service-card:hover { transform: translateY(-8px); border-color: var(--line-strong); background: var(--surface-strong); }
.service-no { color: var(--accent); font-weight: 900; letter-spacing: .14em; font-size: .82rem; }
.service-card h3 { margin: 26px 0 12px; font-size: 1.65rem; }
.service-card p,
.service-card li { color: var(--muted); }
.service-card ul { padding-left: 18px; margin: 6px 0 24px; }
.service-meta { margin-top: auto; padding-top: 20px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 12px; color: var(--muted); font-size: .86rem; }
.cta-card { background: radial-gradient(circle at top right, color-mix(in srgb, var(--accent) 22%, transparent), transparent 48%), var(--surface); }
.cta-card .btn { margin-top: auto; width: fit-content; }

.capabilities { padding-top: 80px; }
.filter-bar { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0 26px; }
.filter-bar button {
  border: 1px solid var(--line);
  color: var(--muted);
  background: var(--surface);
  border-radius: 999px;
  padding: 10px 14px;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, border-color .2s ease;
}
.filter-bar button:hover,
.filter-bar button.active { color: #07100d; background: var(--accent); border-color: transparent; }
.skill-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; }
.skill-card {
  padding: 22px;
  min-height: 230px;
  border-radius: 24px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  transition: transform .25s ease, opacity .25s ease, border-color .25s ease;
}
.skill-card.hide { transform: scale(.96); opacity: .14; pointer-events: none; }
.skill-card h3 { margin-bottom: 10px; font-size: 1.28rem; }
.skill-card p { color: var(--muted); min-height: 78px; }
.skill-card div { height: 8px; background: var(--surface); border-radius: 999px; overflow: hidden; border: 1px solid var(--line); }
.skill-card div span { display: block; width: 0; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), var(--accent-2)); transition: width 1s var(--ease); }
.skill-card.visible div span { width: var(--skill-level); }

.proof-section { padding-top: 72px; }
.proof-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.proof-card {
  min-height: 340px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: radial-gradient(circle at 25% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 40%), linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  display: flex;
  flex-direction: column;
}
.proof-card p { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .78rem; font-weight: 900; }
.proof-card h3 { margin-top: auto; font-size: clamp(1.4rem, 2vw, 2rem); line-height: 1.05; }
.proof-card span { color: var(--muted); border-top: 1px solid var(--line); padding-top: 18px; }

.process-section { display: grid; grid-template-columns: .82fr 1.18fr; gap: 20px; align-items: start; }
.process-intro { position: sticky; top: 120px; }
.process-layout { display: grid; grid-template-columns: 220px 1fr; gap: 16px; }
.process-list {
  display: grid;
  gap: 10px;
  align-content: start;
}
.process-list button {
  text-align: left;
  min-height: 76px;
  padding: 14px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--muted);
  cursor: pointer;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}
.process-list button span { display: block; color: var(--accent); font-weight: 900; font-size: .74rem; letter-spacing: .12em; }
.process-list button:hover,
.process-list button.active { color: var(--text); background: var(--surface-strong); border-color: var(--line-strong); transform: translateX(4px); }
.stage-card { padding: 34px; min-height: 520px; display: flex; flex-direction: column; justify-content: center; position: relative; overflow: hidden; }
.stage-card::before {
  content: "";
  position: absolute;
  inset: 24px;
  border-radius: 28px;
  border: 1px solid var(--line);
  background-image: radial-gradient(circle at 50% 50%, color-mix(in srgb, var(--accent) 22%, transparent), transparent 28%);
  opacity: .6;
}
.stage-card > * { position: relative; }
.stage-label { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .8rem; font-weight: 900; }
.stage-card h3 { margin: 28px 0 12px; font-size: clamp(2rem, 5vw, 4rem); }
.stage-card p { color: var(--muted); font-size: 1.08rem; max-width: 560px; }
.stage-card ul { display: flex; flex-wrap: wrap; gap: 10px; padding: 0; margin: 26px 0 0; list-style: none; }
.stage-card li { padding: 10px 13px; border-radius: 999px; border: 1px solid var(--line); background: var(--surface); color: var(--muted); }

.contact-section { display: grid; grid-template-columns: .88fr 1.12fr; gap: 20px; align-items: stretch; }
.contact-copy { padding: 38px; }
.contact-methods { display: grid; gap: 12px; margin-top: 34px; }
.contact-methods a {
  display: grid;
  gap: 4px;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--text);
  word-break: break-word;
  transition: border-color .2s ease, background .2s ease, transform .2s ease;
}
.contact-methods a:hover { transform: translateY(-3px); border-color: var(--line-strong); background: var(--surface-strong); }
.contact-methods span { color: var(--accent); text-transform: uppercase; letter-spacing: .12em; font-size: .72rem; font-weight: 900; }
.contact-form { padding: 26px; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.form-row { display: grid; gap: 8px; }
.form-row.full { grid-column: 1 / -1; }
label { color: var(--muted); font-size: .9rem; }
input, select, textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255,255,255,.045);
  color: var(--text);
  min-height: 56px;
  padding: 14px 16px;
  outline: none;
  transition: border-color .2s ease, background .2s ease, box-shadow .2s ease;
}
select option { color: #10131b; }
textarea { resize: vertical; min-height: 160px; }
input:focus, select:focus, textarea:focus { border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 16%, transparent); background: rgba(255,255,255,.065); }
input.invalid, select.invalid, textarea.invalid { border-color: var(--danger); }
.form-row small { color: var(--muted-2); justify-self: end; }
.form-status { min-height: 24px; margin: 0; grid-column: 1 / -1; color: var(--accent); }
.form-status.error { color: var(--danger); }
.contact-form .btn { grid-column: 1 / -1; justify-self: start; border: none; }

.site-footer {
  width: min(calc(100% - 32px), var(--max));
  margin: 0 auto 22px;
  padding: 40px;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  display: grid;
  grid-template-columns: 1.4fr .7fr .9fr;
  gap: 30px;
}
.site-footer p { color: var(--muted); max-width: 460px; }
.site-footer h3 { margin-bottom: 12px; }
.site-footer a:not(.brand) { display: block; color: var(--muted); padding: 4px 0; }
.site-footer a:not(.brand):hover { color: var(--text); }
.copyright { grid-column: 1 / -1; padding-top: 24px; margin: 0; border-top: 1px solid var(--line); max-width: none !important; }
.footer-brand { margin-bottom: 18px; }

.command-launcher {
  position: fixed;
  right: 22px;
  bottom: 22px;
  z-index: 900;
  width: 58px;
  height: 58px;
  border-radius: 999px;
  border: 1px solid var(--line-strong);
  background: color-mix(in srgb, var(--bg-2) 88%, transparent);
  backdrop-filter: blur(18px);
  color: var(--accent);
  box-shadow: var(--shadow);
  cursor: pointer;
  font-weight: 900;
}
.command-palette {
  position: fixed;
  inset: 0;
  z-index: 2000;
  display: none;
  place-items: start center;
  padding-top: 12vh;
  background: rgba(0,0,0,.52);
  backdrop-filter: blur(14px);
}
.command-palette.open { display: grid; }
.command-box {
  width: min(540px, calc(100% - 28px));
  padding: 14px;
  border-radius: 28px;
  border: 1px solid var(--line-strong);
  background: var(--bg-2);
  box-shadow: var(--shadow);
}
.command-head { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px 14px; color: var(--muted); }
.command-head button { border: 0; background: transparent; color: inherit; font-size: 1.5rem; cursor: pointer; }
.command-box a { display: block; padding: 15px; border-radius: 16px; color: var(--muted); }
.command-box a:hover,
.command-box a:focus-visible { color: var(--text); background: var(--surface); outline: none; }

.reveal { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .08s; }
.delay-2 { transition-delay: .16s; }
.delay-3 { transition-delay: .24s; }

@keyframes spin { to { transform: rotate(360deg); } }
@keyframes pulse { 0% { box-shadow: 0 0 0 0 color-mix(in srgb, var(--accent) 50%, transparent); } 70% { box-shadow: 0 0 0 12px transparent; } 100% { box-shadow: 0 0 0 0 transparent; } }
@keyframes sheen { 50%, 100% { transform: translateX(80%); } }
@keyframes marquee { to { transform: translateX(-50%); } }

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration: .001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: .001ms !important; }
}

@media (max-width: 1080px) {
  .nav { display: none; }
  .menu-btn { display: inline-grid; }
  .site-header { grid-template-columns: auto 1fr; }
  .header-actions { justify-self: end; }
  .header-actions .btn-small { display: none; }
  .mobile-panel.open { display: block; }
  .hero,
  .about-grid,
  .process-section,
  .contact-section { grid-template-columns: 1fr; }
  .process-intro { position: static; }
  .section-heading { grid-template-columns: 1fr; }
  .section-heading p { margin-left: 0; }
  .work-grid { grid-template-columns: repeat(2, 1fr); }
  .services-grid { grid-template-columns: repeat(2, 1fr); }
  .skill-grid { grid-template-columns: repeat(3, 1fr); }
  .proof-grid { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 760px) {
  .section-shell { padding: 78px 0; width: min(calc(100% - 24px), var(--max)); }
  .site-header { top: 8px; width: calc(100% - 18px); margin-top: 8px; border-radius: 24px; }
  .brand-text { font-size: .92rem; }
  .hero { padding-top: 58px; }
  h1 { font-size: clamp(3rem, 17vw, 5.2rem); }
  .hero-proof { grid-template-columns: repeat(2, 1fr); }
  .device-frame { min-height: 520px; border-radius: 32px; }
  .metric-stack { grid-template-columns: 1fr; }
  .work-grid,
  .services-grid,
  .skill-grid,
  .process-layout,
  .contact-form,
  .site-footer { grid-template-columns: 1fr; }
  .work-card.featured { grid-column: span 1; }
  .work-card { min-height: 460px; }
  .about-copy,
  .contact-copy,
  .profile-card,
  .stage-card,
  .contact-form,
  .site-footer { padding: 24px; border-radius: 30px; }
  .process-list { grid-template-columns: repeat(2, 1fr); }
  .process-list button { min-height: 68px; }
  .stage-card { min-height: 430px; }
  .copyright { grid-column: auto; }
}

@media (max-width: 460px) {
  .hero-actions { display: grid; }
  .btn { width: 100%; }
  .process-list { grid-template-columns: 1fr; }
  .brand-mark { width: 38px; height: 38px; }
  .icon-btn { width: 40px; height: 40px; }
  .hero-proof { grid-template-columns: 1fr; }
}

/* Upgrade pass: richer image-heavy business sections */
.work-media img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
  opacity: .92;
  transition: transform .7s var(--ease), opacity .35s ease;
}
.work-card:hover .work-media img { transform: scale(1.045); opacity: 1; }
.work-media::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  background: linear-gradient(180deg, transparent 30%, rgba(0,0,0,.12));
  pointer-events: none;
}
.genshin-card .planet { opacity: .32; }

.image-showcase,
.website-types,
.launch-standard { padding-top: 80px; }
.customer-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-top: 28px;
}
.customer-card {
  min-height: 540px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  transition: transform .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease);
}
.customer-card:hover { transform: translateY(-8px); border-color: var(--line-strong); background: var(--surface-strong); }
.customer-card img {
  width: 100%;
  aspect-ratio: 1.52 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  transition: transform .7s var(--ease);
}
.customer-card:hover img { transform: scale(1.035); }
.customer-card div { padding: 24px; display: flex; flex-direction: column; flex: 1; }
.customer-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .75rem;
  font-weight: 900;
}
.customer-card h3 { font-size: 1.55rem; margin: 18px 0 12px; }
.customer-card p { color: var(--muted); margin-bottom: 0; }

.type-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.type-card {
  border: 1px solid var(--line);
  border-radius: 24px;
  overflow: hidden;
  min-height: 390px;
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  transition: transform .35s var(--ease), border-color .35s var(--ease);
}
.type-card:hover { transform: translateY(-7px); border-color: var(--line-strong); }
.type-card img {
  width: 100%;
  aspect-ratio: 1.55 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
}
.type-card h3 { font-size: 1.25rem; margin: 18px 18px 8px; }
.type-card p { color: var(--muted); margin: 0 18px 22px; font-size: .95rem; }

.standard-panel {
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 72% 10%, color-mix(in srgb, var(--accent) 24%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  padding: clamp(26px, 5vw, 54px);
  box-shadow: var(--shadow);
}
.standard-panel p:not(.section-kicker) { color: var(--muted); max-width: 800px; font-size: 1.08rem; }
.standard-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
  margin-top: 32px;
}
.standard-grid div {
  min-height: 132px;
  padding: 20px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: rgba(255,255,255,.045);
}
.standard-grid b { display: block; color: var(--accent); margin-bottom: 14px; letter-spacing: .12em; }
.standard-grid span { color: var(--muted); }
.email-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.email-actions .btn { min-height: 48px; padding-inline: 16px; }
.email-actions button { border: 1px solid var(--line); }
.form-status a { color: var(--accent); text-decoration: underline; text-underline-offset: 3px; }

@media (max-width: 1080px) {
  .customer-grid { grid-template-columns: repeat(2, 1fr); }
  .type-grid { grid-template-columns: repeat(2, 1fr); }
  .standard-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 760px) {
  .customer-grid,
  .type-grid,
  .standard-grid { grid-template-columns: 1fr; }
  .customer-card { min-height: auto; }
  .type-card { min-height: auto; }
  .email-actions { display: grid; }
}

.scroll-progress {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 5000;
  width: 0%;
  height: 3px;
  background: linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3));
  box-shadow: 0 0 22px color-mix(in srgb, var(--accent) 45%, transparent);
  pointer-events: none;
}

/* 100 Website Showcase */
.demo-hub { padding-top: 90px; }
.demo-toolbar {
  display: grid;
  gap: 14px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  margin: 12px 0 18px;
}
.search-label {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .76rem;
  font-weight: 900;
}
.demo-toolbar input[type="search"] {
  width: 100%;
  min-height: 60px;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: rgba(255,255,255,.055);
  color: var(--text);
  padding: 14px 18px;
  outline: none;
}
.demo-toolbar input[type="search"]:focus { border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 14%, transparent); }
.demo-filters { display: flex; flex-wrap: wrap; gap: 8px; }
.demo-filters button {
  border: 1px solid var(--line);
  background: var(--surface);
  color: var(--muted);
  border-radius: 999px;
  padding: 10px 13px;
  cursor: pointer;
  transition: background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
}
.demo-filters button:hover,
.demo-filters button.active { background: var(--accent); color: #07100d; border-color: transparent; transform: translateY(-2px); }
.demo-count {
  color: var(--muted);
  margin: 12px 0 24px;
  padding: 14px 18px;
  border: 1px solid var(--line);
  border-radius: 999px;
  width: fit-content;
  background: var(--surface);
}
.demo-count strong { color: var(--accent); }
.demo-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px;
}
.demo-card {
  border: 1px solid var(--line);
  border-radius: 26px;
  overflow: hidden;
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  min-height: 418px;
  display: flex;
  flex-direction: column;
  transition: transform .35s var(--ease), border-color .35s var(--ease), opacity .25s ease;
}
.demo-card:hover { transform: translateY(-8px); border-color: var(--line-strong); }
.demo-card.hide { display: none; }
.demo-card img {
  width: 100%;
  aspect-ratio: 1.46 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
  transition: transform .7s var(--ease);
}
.demo-card:hover img { transform: scale(1.035); }
.demo-card-body { padding: 18px; display: flex; flex-direction: column; flex: 1; }
.demo-card-body span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .72rem;
  font-weight: 900;
}
.demo-card-body h3 { font-size: 1.25rem; margin: 12px 0 8px; }
.demo-card-body p { color: var(--muted); font-size: .92rem; margin-bottom: 18px; }
.demo-card-body .btn { margin-top: auto; min-height: 44px; padding-inline: 14px; width: fit-content; font-size: .88rem; }
@media (max-width: 1180px) { .demo-grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 860px) { .demo-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .demo-grid { grid-template-columns: 1fr; } .demo-count { width: 100%; border-radius: 22px; } }

.video-wall {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 10px;
  margin: 18px 0 26px;
}
.video-wall video {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: var(--bg-2);
  box-shadow: 0 18px 55px rgba(0,0,0,.18);
  transition: transform .35s var(--ease), border-color .35s var(--ease), filter .35s ease;
  filter: saturate(1.12) contrast(1.06);
}
.video-wall video:hover { transform: translateY(-6px) scale(1.015); border-color: var(--line-strong); }
@media (max-width: 1180px) { .video-wall { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 640px) { .video-wall { grid-template-columns: 1fr 1fr; } }


/* Premium batch upgrades */
.demo-card.premium-upgraded { border-color: rgba(255, 217, 138, .48); background: radial-gradient(circle at 70% 0, rgba(255, 217, 138, .18), transparent 42%), linear-gradient(180deg, var(--surface), rgba(255,255,255,.02)); box-shadow: 0 20px 70px rgba(255, 190, 94, .10); }
.demo-card.premium-upgraded img { filter: saturate(1.1) contrast(1.04); }
.premium-badge { width: fit-content; display: inline-flex; align-items: center; min-height: 28px; padding: 0 10px; border-radius: 999px; background: linear-gradient(135deg, #ffd98a, #b86d2f); color: #160b07; font-size: .72rem; letter-spacing: .1em; text-transform: uppercase; margin-top: 10px; }

/* Focused homepage capability library */
.premium-showcase {
  padding-top: 88px;
}
.premium-showcase-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
  margin-top: 28px;
}
.premium-showcase-card {
  min-height: 250px;
  padding: 26px;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background:
    radial-gradient(circle at 74% 8%, color-mix(in srgb, var(--accent) 20%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 22px 70px rgba(0,0,0,.18);
  transition: transform .35s var(--ease), border-color .35s var(--ease), background .35s var(--ease);
}
.premium-showcase-card:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  background: var(--surface-strong);
}
.premium-showcase-card span {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 16px;
  color: #06100d;
  background: linear-gradient(135deg, var(--accent), var(--accent-2));
  font-weight: 900;
  margin-bottom: 26px;
}
.premium-showcase-card h3 { font-size: 1.45rem; margin-bottom: 12px; }
.premium-showcase-card p { color: var(--muted); margin-bottom: 0; }
.website-library { padding-top: 92px; }
.capability-showcase-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 30px;
}
.capability-card {
  border: 1px solid var(--line);
  border-radius: 28px;
  overflow: hidden;
  background:
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  min-height: 520px;
  display: flex;
  flex-direction: column;
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.capability-card:hover {
  transform: translateY(-9px);
  border-color: var(--line-strong);
  box-shadow: 0 30px 95px rgba(0,0,0,.25);
}
.capability-card img {
  width: 100%;
  aspect-ratio: 1.48 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
  filter: saturate(1.1) contrast(1.04);
  transition: transform .75s var(--ease), filter .35s ease;
}
.capability-card:hover img {
  transform: scale(1.04);
  filter: saturate(1.2) contrast(1.08);
}
.capability-card-body {
  padding: 22px;
  display: flex;
  flex-direction: column;
  flex: 1;
}
.capability-card-body span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.capability-card-body h3 { font-size: 1.28rem; margin: 14px 0 10px; }
.capability-card-body p { color: var(--muted); font-size: .94rem; }
.capability-card-body ul {
  margin-top: auto;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.capability-card-body li {
  color: var(--text);
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 11px;
  background: rgba(255,255,255,.045);
  font-size: .86rem;
}
@media (max-width: 1180px) {
  .capability-showcase-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 900px) {
  .premium-showcase-grid { grid-template-columns: 1fr; }
}
@media (max-width: 640px) {
  .capability-showcase-grid { grid-template-columns: 1fr; }
  .capability-card { min-height: auto; }
}

/* Homepage premium polish pass */
.proof-system { padding-top: 92px; }
.proof-system-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 30px;
}
.proof-system-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.proof-system-card:hover {
  transform: translateY(-9px);
  border-color: var(--line-strong);
  box-shadow: 0 36px 110px rgba(0,0,0,.30);
}
.proof-system-card img {
  width: 100%;
  aspect-ratio: 1.75 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  filter: saturate(1.08) contrast(1.06);
  transition: transform .7s var(--ease), filter .35s ease;
}
.proof-system-card:hover img {
  transform: scale(1.035);
  filter: saturate(1.18) contrast(1.08);
}
.proof-system-card div { padding: 26px; }
.proof-system-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .74rem;
  font-weight: 900;
}
.proof-system-card h3 { font-size: 1.45rem; margin: 14px 0 12px; }
.proof-system-card p { color: var(--muted); margin-bottom: 0; }
.website-library-cta {
  margin-top: 18px;
  border: 1px solid var(--line-strong);
  border-radius: var(--radius-lg);
  padding: clamp(24px, 4vw, 42px);
  background:
    radial-gradient(circle at 72% 8%, color-mix(in srgb, var(--accent-2) 24%, transparent), transparent 45%),
    linear-gradient(135deg, rgba(255,255,255,.075), rgba(255,255,255,.024));
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 20px;
  align-items: center;
}
.website-library-cta h3 { font-size: clamp(1.45rem, 3vw, 2.35rem); margin-bottom: 8px; }
.website-library-cta p { color: var(--muted); margin-bottom: 0; max-width: 760px; }
@media (max-width: 900px) {
  .proof-system-grid { grid-template-columns: 1fr; }
  .website-library-cta { grid-template-columns: 1fr; }
  .website-library-cta .btn { width: fit-content; }
}

/* Premium services + contact conversion pass */
.services-premium .section-heading p { max-width: 860px; }
.premium-service-grid { align-items: stretch; }
.premium-service-card {
  overflow: hidden;
  padding: 0;
  min-height: 560px;
}
.premium-service-card > img {
  width: 100%;
  aspect-ratio: 1.58 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.premium-service-card:hover > img {
  transform: scale(1.035);
  filter: saturate(1.18) contrast(1.08);
}
.premium-service-card > span,
.premium-service-card > h3,
.premium-service-card > p,
.premium-service-card > ul,
.premium-service-card > .service-meta,
.premium-service-card > .btn {
  margin-left: 24px;
  margin-right: 24px;
}
.premium-service-card > .service-no { margin-top: 24px; display: block; }
.premium-service-card > h3 { margin-top: 18px; font-size: 1.48rem; }
.premium-service-card > ul {
  padding-left: 0;
  list-style: none;
  display: grid;
  gap: 8px;
}
.premium-service-card > ul li {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(255,255,255,.04);
}
.premium-service-card > .service-meta {
  margin-bottom: 24px;
}
.premium-service-card.cta-card > .btn {
  margin-bottom: 24px;
}
.contact-visual-card {
  margin-top: 26px;
  border: 1px solid var(--line);
  border-radius: 28px;
  overflow: hidden;
  background: linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
  box-shadow: 0 24px 80px rgba(0,0,0,.18);
}
.contact-visual-card img {
  width: 100%;
  aspect-ratio: 1.55 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
}
.contact-visual-card div { padding: 18px; }
.contact-visual-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .12em;
  font-size: .72rem;
  font-weight: 900;
}
.contact-visual-card p { color: var(--muted); margin: 8px 0 0; }
@media (max-width: 760px) {
  .premium-service-card > span,
  .premium-service-card > h3,
  .premium-service-card > p,
  .premium-service-card > ul,
  .premium-service-card > .service-meta,
  .premium-service-card > .btn { margin-left: 18px; margin-right: 18px; }
}

/* Premium selected work proof pass */
.work-premium .section-heading p { max-width: 860px; }
.premium-work-grid .work-card {
  border-color: color-mix(in srgb, var(--accent) 18%, var(--line));
}
.premium-work-card .work-content {
  position: relative;
}
.work-proof-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin: 18px 0 18px;
}
.work-proof-list span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 11px;
  color: var(--text);
  background: rgba(255,255,255,.045);
  font-size: .82rem;
  font-weight: 800;
}
.premium-work-card:hover .work-proof-list span {
  border-color: color-mix(in srgb, var(--accent) 35%, var(--line));
}

/* Premium about, process, and proof pass */
.about-premium .profile-card { overflow: hidden; padding: 0; }
.profile-visual {
  width: 100%;
  aspect-ratio: 1.42 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  display: block;
}
.about-premium .profile-card > p,
.about-premium .profile-card > h2,
.about-premium .profile-card > .profile-links {
  margin-left: 28px;
  margin-right: 28px;
}
.about-premium .profile-card > p.muted { margin-top: 26px; }
.about-premium .profile-links { margin-bottom: 28px; }
.premium-principles div {
  background:
    radial-gradient(circle at 72% 0, color-mix(in srgb, var(--accent) 16%, transparent), transparent 44%),
    rgba(255,255,255,.035);
}
.proof-premium .proof-card {
  overflow: hidden;
  padding-top: 0;
}
.proof-premium .proof-card img {
  width: calc(100% + 48px);
  margin: 0 -24px 24px;
  aspect-ratio: 1.55 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  filter: saturate(1.08) contrast(1.05);
}
.process-visual-grid {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: 18px;
  align-items: stretch;
  margin: 26px 0 20px;
}
.process-visual-grid > img {
  width: 100%;
  height: 100%;
  min-height: 420px;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  box-shadow: 0 26px 90px rgba(0,0,0,.22);
}
.process-highlights {
  display: grid;
  gap: 12px;
}
.process-highlights div {
  border: 1px solid var(--line);
  border-radius: 28px;
  padding: 22px;
  background:
    radial-gradient(circle at 86% 0, color-mix(in srgb, var(--accent-2) 18%, transparent), transparent 44%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
}
.process-highlights span {
  color: var(--accent);
  font-weight: 900;
  letter-spacing: .14em;
}
.process-highlights h3 { margin: 10px 0 8px; font-size: 1.32rem; }
.process-highlights p { margin: 0; color: var(--muted); }
@media (max-width: 980px) {
  .process-visual-grid { grid-template-columns: 1fr; }
  .process-visual-grid > img { min-height: auto; }
}
@media (max-width: 640px) {
  .about-premium .profile-card > p,
  .about-premium .profile-card > h2,
  .about-premium .profile-card > .profile-links { margin-left: 20px; margin-right: 20px; }
}

/* Premium launch CTA and footer pass */
.final-launch-panel {
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(320px, .75fr);
  gap: 24px;
  align-items: center;
}
.final-launch-copy p:not(.section-kicker) { max-width: 720px; }
.final-launch-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 22px;
}
.final-launch-panel > img {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 28px;
  box-shadow: 0 26px 88px rgba(0,0,0,.25);
}
.final-standard-grid {
  grid-column: 1 / -1;
}
.footer-visual img {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 24px;
  aspect-ratio: 1.55 / 1;
  object-fit: cover;
  filter: saturate(1.08) contrast(1.05);
}
.site-footer {
  grid-template-columns: 1.25fr .65fr .85fr .95fr;
}
.site-footer .footer-visual { align-self: stretch; }
@media (max-width: 980px) {
  .final-launch-panel { grid-template-columns: 1fr; }
  .site-footer { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 640px) {
  .final-launch-actions { display: grid; }
  .site-footer { grid-template-columns: 1fr; }
}

/* Premium navigation, mobile, and interaction polish pass */
.nav-command {
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
  background: color-mix(in srgb, var(--bg-2) 74%, transparent);
}
.nav-command:hover { transform: translateY(-2px); box-shadow: 0 14px 34px rgba(0,0,0,.22); }
.mobile-panel-cta {
  margin-top: 10px;
  border: 1px solid color-mix(in srgb, var(--accent) 45%, var(--line));
  border-radius: 18px;
  padding: 14px 18px !important;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 20%, transparent), color-mix(in srgb, var(--accent-2) 16%, transparent));
  color: var(--text) !important;
  font-weight: 850;
}
.experience-system {
  position: relative;
  overflow: hidden;
}
.experience-system::before {
  content: "";
  position: absolute;
  inset: 24px;
  border-radius: 36px;
  background:
    radial-gradient(circle at 10% 20%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 30%),
    radial-gradient(circle at 90% 10%, color-mix(in srgb, var(--accent-2) 18%, transparent), transparent 28%),
    linear-gradient(135deg, color-mix(in srgb, var(--bg-2) 82%, transparent), transparent);
  border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
  pointer-events: none;
}
.experience-system > * { position: relative; z-index: 1; }
.experience-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
}
.experience-card {
  border: 1px solid color-mix(in srgb, var(--line) 86%, transparent);
  background: color-mix(in srgb, var(--bg-2) 84%, transparent);
  border-radius: 32px;
  padding: 18px;
  box-shadow: var(--shadow-soft);
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.experience-card:hover {
  transform: translateY(-6px);
  border-color: color-mix(in srgb, var(--accent) 38%, var(--line));
  background: color-mix(in srgb, var(--bg-2) 92%, transparent);
}
.experience-card img {
  width: 100%;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line) 82%, transparent);
  background: #0c0f16;
  display: block;
}
.experience-card div { padding: 18px 4px 4px; }
.experience-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .74rem;
  font-weight: 900;
}
.experience-card h3 { margin: 10px 0 8px; font-size: clamp(1.25rem, 2.4vw, 2rem); letter-spacing: -.04em; }
.experience-card p { color: var(--muted); margin: 0; }
.experience-card ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 0;
  margin: 18px 0 0;
  list-style: none;
}
.experience-card li,
.experience-rail span {
  border: 1px solid color-mix(in srgb, var(--line) 80%, transparent);
  background: color-mix(in srgb, var(--bg) 55%, transparent);
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--muted);
  font-size: .82rem;
  font-weight: 750;
}
.experience-rail {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}
.experience-rail span {
  text-align: center;
  color: var(--text);
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent-2) 10%, transparent));
}
@media (max-width: 1100px) {
  .nav-command { display: none; }
}
@media (max-width: 860px) {
  .experience-grid { grid-template-columns: 1fr; }
  .experience-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
  .experience-system::before { inset: 8px; border-radius: 26px; }
  .experience-card { padding: 12px; border-radius: 24px; }
  .experience-card img { border-radius: 18px; }
  .experience-rail { grid-template-columns: 1fr; }
}

/* Premium project packages and scope clarity pass */
.project-packages {
  position: relative;
  overflow: hidden;
}
.project-packages::before {
  content: "";
  position: absolute;
  inset: 18px;
  border-radius: 38px;
  background:
    radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 30%),
    radial-gradient(circle at 82% 18%, color-mix(in srgb, var(--accent-2) 14%, transparent), transparent 32%),
    linear-gradient(135deg, color-mix(in srgb, var(--bg-2) 78%, transparent), transparent);
  border: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  pointer-events: none;
}
.project-packages > * { position: relative; z-index: 1; }
.package-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  align-items: stretch;
}
.package-card {
  border: 1px solid color-mix(in srgb, var(--line) 84%, transparent);
  background: color-mix(in srgb, var(--bg-2) 83%, transparent);
  border-radius: 32px;
  padding: 16px;
  box-shadow: var(--shadow-soft);
  display: flex;
  flex-direction: column;
  transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
.package-card:hover {
  transform: translateY(-7px);
  border-color: color-mix(in srgb, var(--accent) 42%, var(--line));
  background: color-mix(in srgb, var(--bg-2) 94%, transparent);
}
.package-featured {
  border-color: color-mix(in srgb, var(--accent) 48%, var(--line));
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--accent) 10%, transparent), transparent 46%),
    color-mix(in srgb, var(--bg-2) 88%, transparent);
}
.package-card img {
  width: 100%;
  display: block;
  border-radius: 24px;
  border: 1px solid color-mix(in srgb, var(--line) 78%, transparent);
  background: #0c0f16;
}
.package-card-body {
  padding: 18px 4px 4px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex: 1;
}
.package-card-body span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.package-card-body h3 { margin: 0; font-size: clamp(1.22rem, 2.1vw, 1.8rem); letter-spacing: -.04em; }
.package-card-body p { margin: 0; color: var(--muted); }
.package-card-body ul {
  display: grid;
  gap: 8px;
  padding: 0;
  margin: 4px 0 6px;
  list-style: none;
}
.package-card-body li {
  color: var(--muted);
  border: 1px solid color-mix(in srgb, var(--line) 76%, transparent);
  border-radius: 14px;
  padding: 9px 11px;
  background: color-mix(in srgb, var(--bg) 55%, transparent);
}
.package-card-body .btn { margin-top: auto; width: 100%; justify-content: center; }
.scope-note {
  margin-top: 18px;
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 12px;
  align-items: center;
  border: 1px solid color-mix(in srgb, var(--accent) 32%, var(--line));
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent-2) 8%, transparent));
  border-radius: 26px;
  padding: 18px;
}
.scope-note strong { color: var(--text); }
.scope-note span { color: var(--muted); }
@media (max-width: 980px) {
  .package-grid { grid-template-columns: 1fr; }
  .project-packages::before { inset: 8px; }
}
@media (max-width: 560px) {
  .scope-note { grid-template-columns: 1fr; }
  .package-card { border-radius: 24px; padding: 12px; }
  .package-card img { border-radius: 18px; }
}

/* Premium FAQ and client assurance pass */
.client-faq-section { position: relative; overflow: hidden; }
.client-faq-section::before { content: ""; position: absolute; inset: 18px; border-radius: 38px; background: radial-gradient(circle at 18% 14%, color-mix(in srgb, var(--accent) 13%, transparent), transparent 30%), radial-gradient(circle at 86% 20%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 32%); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); pointer-events: none; }
.client-faq-section > * { position: relative; z-index: 1; }
.faq-assurance-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 20px; align-items: start; }
.faq-visual-stack { display: grid; gap: 14px; }
.faq-visual-stack img { width: 100%; display: block; border-radius: 28px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: #0c0f16; box-shadow: var(--shadow-soft); }
.faq-list { display: grid; gap: 12px; }
.faq-list details { border: 1px solid color-mix(in srgb, var(--line) 80%, transparent); background: color-mix(in srgb, var(--bg-2) 86%, transparent); border-radius: 22px; padding: 16px 18px; box-shadow: 0 20px 52px rgba(0,0,0,.18); }
.faq-list details[open] { border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); }
.faq-list summary { cursor: pointer; color: var(--text); font-weight: 900; letter-spacing: -.02em; list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.faq-list summary::-webkit-details-marker { display: none; }
.faq-list summary::after { content: "+"; color: var(--accent); font-size: 1.4rem; line-height: 1; }
.faq-list details[open] summary::after { content: "–"; }
.faq-list p { margin: 12px 0 0; color: var(--muted); }
.faq-cta { margin-top: 18px; border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--line)); background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent-2) 9%, transparent)); border-radius: 28px; padding: clamp(20px, 3vw, 30px); display: grid; grid-template-columns: 1fr auto; gap: 14px; align-items: center; }
.faq-cta h3 { margin: 0; font-size: clamp(1.2rem, 2.2vw, 1.8rem); letter-spacing: -.04em; }
.faq-cta p { margin: 4px 0 0; color: var(--muted); }
@media (max-width: 900px) { .faq-assurance-grid { grid-template-columns: 1fr; } .faq-cta { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .client-faq-section::before { inset: 8px; border-radius: 26px; } .faq-list details { border-radius: 18px; padding: 14px; } .faq-visual-stack img { border-radius: 20px; } }

/* Premium transformation proof pass */
.transformation-proof { position: relative; overflow: hidden; }
.transformation-proof::before { content: ""; position: absolute; inset: 18px; border-radius: 38px; background: radial-gradient(circle at 14% 18%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 30%), radial-gradient(circle at 84% 14%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 32%); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); pointer-events: none; }
.transformation-proof > * { position: relative; z-index: 1; }
.transformation-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.transformation-card { border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); background: color-mix(in srgb, var(--bg-2) 84%, transparent); border-radius: 32px; padding: 16px; box-shadow: var(--shadow-soft); transition: transform .25s ease, border-color .25s ease; }
.transformation-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); }
.transformation-card.after { border-color: color-mix(in srgb, var(--accent) 42%, var(--line)); background: linear-gradient(180deg, color-mix(in srgb, var(--accent) 9%, transparent), transparent 50%), color-mix(in srgb, var(--bg-2) 88%, transparent); }
.transformation-card img, .upgrade-map img { width: 100%; display: block; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: #0c0f16; }
.transformation-card div { padding: 18px 4px 4px; }
.transformation-card span, .upgrade-map span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.transformation-card h3, .upgrade-map h3 { margin: 10px 0 8px; letter-spacing: -.04em; }
.transformation-card p { margin: 0; color: var(--muted); }
.upgrade-map { margin-top: 18px; display: grid; grid-template-columns: .95fr 1.05fr; gap: 18px; align-items: center; border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); border-radius: 32px; padding: 16px; background: color-mix(in srgb, var(--bg-2) 86%, transparent); box-shadow: var(--shadow-soft); }
.upgrade-map ul { display: grid; gap: 10px; padding: 0; margin: 16px 0 0; list-style: none; }
.upgrade-map li { border: 1px solid color-mix(in srgb, var(--line) 76%, transparent); border-radius: 14px; padding: 10px 12px; color: var(--muted); background: color-mix(in srgb, var(--bg) 55%, transparent); }
@media (max-width: 900px) { .transformation-grid, .upgrade-map { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .transformation-proof::before { inset: 8px; border-radius: 26px; } .transformation-card, .upgrade-map { border-radius: 24px; padding: 12px; } .transformation-card img, .upgrade-map img { border-radius: 18px; } }

/* Premium brief and handoff kit pass */
.brief-handoff-kit { position: relative; overflow: hidden; }
.brief-handoff-kit::before { content: ""; position: absolute; inset: 18px; border-radius: 38px; background: radial-gradient(circle at 16% 18%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 30%), radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 32%); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); pointer-events: none; }
.brief-handoff-kit > * { position: relative; z-index: 1; }
.brief-kit-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.brief-kit-card { border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); background: color-mix(in srgb, var(--bg-2) 86%, transparent); border-radius: 32px; padding: 16px; box-shadow: var(--shadow-soft); transition: transform .25s ease, border-color .25s ease; }
.brief-kit-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); }
.brief-kit-card img { width: 100%; display: block; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: #0c0f16; }
.brief-kit-card div { padding: 18px 4px 4px; }
.brief-kit-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.brief-kit-card h3 { margin: 10px 0; letter-spacing: -.04em; }
.brief-kit-card ul { display: grid; gap: 10px; padding: 0; margin: 14px 0 0; list-style: none; }
.brief-kit-card li { color: var(--muted); border: 1px solid color-mix(in srgb, var(--line) 76%, transparent); border-radius: 14px; padding: 10px 12px; background: color-mix(in srgb, var(--bg) 55%, transparent); }
.brief-kit-cta { margin-top: 18px; display: grid; grid-template-columns: 1fr auto; gap: 16px; align-items: center; border: 1px solid color-mix(in srgb, var(--accent) 34%, var(--line)); background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 12%, transparent), color-mix(in srgb, var(--accent-2) 9%, transparent)); border-radius: 28px; padding: clamp(18px, 3vw, 28px); }
.brief-kit-cta p { margin: 0; color: var(--muted); }
.brief-kit-cta strong { color: var(--text); }
@media (max-width: 900px) { .brief-kit-grid, .brief-kit-cta { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .brief-handoff-kit::before { inset: 8px; border-radius: 26px; } .brief-kit-card { border-radius: 24px; padding: 12px; } .brief-kit-card img { border-radius: 18px; } }

/* Premium quick action and contact conversion pass */
.contact-action-system { margin-top: 16px; border: 1px solid color-mix(in srgb, var(--line) 80%, transparent); border-radius: 24px; padding: 14px; background: color-mix(in srgb, var(--bg-2) 82%, transparent); display: grid; grid-template-columns: 170px 1fr; gap: 14px; align-items: center; }
.contact-action-system img { width: 100%; border-radius: 18px; border: 1px solid color-mix(in srgb, var(--line) 72%, transparent); background: #0c0f16; }
.contact-action-system span { color: var(--accent); text-transform: uppercase; letter-spacing: .12em; font-size: .72rem; font-weight: 900; }
.contact-action-system p { margin: 6px 0 0; color: var(--muted); }
.quick-action-bar { position: fixed; left: 50%; bottom: 18px; transform: translateX(-50%); z-index: 45; display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: color-mix(in srgb, var(--bg-2) 88%, transparent); -webkit-backdrop-filter: blur(18px); backdrop-filter: blur(18px); border-radius: 999px; box-shadow: 0 24px 70px rgba(0,0,0,.34); }
.quick-action-bar a, .quick-action-bar button { appearance: none; border: 0; color: var(--muted); background: transparent; text-decoration: none; border-radius: 999px; padding: 10px 13px; font: inherit; font-weight: 850; cursor: pointer; transition: color .2s ease, background .2s ease, transform .2s ease; }
.quick-action-bar a:hover, .quick-action-bar button:hover { color: var(--text); background: color-mix(in srgb, var(--accent) 12%, transparent); transform: translateY(-1px); }
.quick-action-bar .quick-primary { color: #07111A; background: linear-gradient(135deg, var(--accent), var(--accent-2)); }
.command-launcher { bottom: 86px; }
@media (max-width: 760px) { .quick-action-bar { width: calc(100% - 22px); justify-content: space-between; overflow-x: auto; border-radius: 24px; } .quick-action-bar a, .quick-action-bar button { white-space: nowrap; padding: 10px 12px; } .command-launcher { bottom: 96px; } .contact-action-system { grid-template-columns: 1fr; } }
@media (max-width: 460px) { .quick-action-bar a:nth-child(1), .quick-action-bar a:nth-child(2) { display: none; } .quick-action-bar { justify-content: center; } }

/* Premium UI kit and component system pass */
.ui-kit-system { position: relative; overflow: hidden; }
.ui-kit-system::before { content: ""; position: absolute; inset: 18px; border-radius: 38px; background: radial-gradient(circle at 18% 16%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 30%), radial-gradient(circle at 86% 20%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 32%); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); pointer-events: none; }
.ui-kit-system > * { position: relative; z-index: 1; }
.ui-kit-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.ui-kit-card { border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); background: color-mix(in srgb, var(--bg-2) 86%, transparent); border-radius: 32px; padding: 16px; box-shadow: var(--shadow-soft); transition: transform .25s ease, border-color .25s ease; }
.ui-kit-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); }
.ui-kit-card img { width: 100%; display: block; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: #0c0f16; }
.ui-kit-card div { padding: 18px 4px 4px; }
.ui-kit-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.ui-kit-card h3 { margin: 10px 0 8px; letter-spacing: -.04em; }
.ui-kit-card p { margin: 0; color: var(--muted); }
@media (max-width: 980px) { .ui-kit-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .ui-kit-system::before { inset: 8px; border-radius: 26px; } .ui-kit-card { border-radius: 24px; padding: 12px; } .ui-kit-card img { border-radius: 18px; } }

/* Premium accessibility and theme polish pass */
.accessibility-theme-system { position: relative; overflow: hidden; }
.accessibility-theme-system::before { content: ""; position: absolute; inset: 18px; border-radius: 38px; background: radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 30%), radial-gradient(circle at 84% 20%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 32%); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); pointer-events: none; }
.accessibility-theme-system > * { position: relative; z-index: 1; }
.accessibility-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.accessibility-card { border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); background: color-mix(in srgb, var(--bg-2) 86%, transparent); border-radius: 32px; padding: 16px; box-shadow: var(--shadow-soft); transition: transform .25s ease, border-color .25s ease; }
.accessibility-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); }
.accessibility-card img { width: 100%; display: block; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: #0c0f16; }
.accessibility-card div { padding: 18px 4px 4px; }
.accessibility-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.accessibility-card h3 { margin: 10px 0 8px; letter-spacing: -.04em; }
.accessibility-card p { margin: 0; color: var(--muted); }
@media (max-width: 900px) { .accessibility-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .accessibility-theme-system::before { inset: 8px; border-radius: 26px; } .accessibility-card { border-radius: 24px; padding: 12px; } .accessibility-card img { border-radius: 18px; } }

/* Premium SEO and social preview pass */
.seo-launch-system { position: relative; overflow: hidden; }
.seo-launch-system::before { content: ""; position: absolute; inset: 18px; border-radius: 38px; background: radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--accent) 12%, transparent), transparent 30%), radial-gradient(circle at 84% 20%, color-mix(in srgb, var(--accent-2) 12%, transparent), transparent 32%); border: 1px solid color-mix(in srgb, var(--line) 70%, transparent); pointer-events: none; }
.seo-launch-system > * { position: relative; z-index: 1; }
.seo-launch-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; }
.seo-launch-card { border: 1px solid color-mix(in srgb, var(--line) 82%, transparent); background: color-mix(in srgb, var(--bg-2) 86%, transparent); border-radius: 32px; padding: 16px; box-shadow: var(--shadow-soft); transition: transform .25s ease, border-color .25s ease; }
.seo-launch-card:hover { transform: translateY(-7px); border-color: color-mix(in srgb, var(--accent) 38%, var(--line)); }
.seo-launch-card img { width: 100%; display: block; border-radius: 24px; border: 1px solid color-mix(in srgb, var(--line) 78%, transparent); background: #0c0f16; }
.seo-launch-card div { padding: 18px 4px 4px; }
.seo-launch-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.seo-launch-card h3 { margin: 10px 0 8px; letter-spacing: -.04em; }
.seo-launch-card p { margin: 0; color: var(--muted); }
@media (max-width: 980px) { .seo-launch-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .seo-launch-system::before { inset: 8px; border-radius: 26px; } .seo-launch-card { border-radius: 24px; padding: 12px; } .seo-launch-card img { border-radius: 18px; } }


/* Premium capability stack visual pass */
.capability-stack-visuals {
  margin-top: 28px;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(300px, .85fr);
  gap: 16px;
  align-items: stretch;
}
.capability-stack-hero,
.capability-stack-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  background:
    radial-gradient(circle at 84% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  overflow: hidden;
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.capability-stack-hero:hover,
.capability-stack-card:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 34px 105px rgba(0,0,0,.30);
}
.capability-stack-hero img,
.capability-stack-card img {
  width: 100%;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.capability-stack-hero:hover img,
.capability-stack-card:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.capability-stack-hero img { aspect-ratio: 1.52 / 1; }
.capability-stack-card img { aspect-ratio: 1.72 / 1; }
.capability-stack-hero div,
.capability-stack-card div { padding: clamp(20px, 3vw, 30px); }
.capability-stack-hero span,
.capability-stack-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .74rem;
  font-weight: 900;
}
.capability-stack-hero h3,
.capability-stack-card h3 { margin: 12px 0 10px; }
.capability-stack-hero h3 { font-size: clamp(1.65rem, 3vw, 2.55rem); line-height: 1.02; }
.capability-stack-card h3 { font-size: 1.2rem; }
.capability-stack-hero p,
.capability-stack-card p { color: var(--muted); margin-bottom: 0; }
.capability-stack-side { display: grid; gap: 16px; }
@media (max-width: 980px) {
  .capability-stack-visuals { grid-template-columns: 1fr; }
  .capability-stack-side { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 680px) {
  .capability-stack-side { grid-template-columns: 1fr; }
  .capability-stack-hero, .capability-stack-card { border-radius: 24px; }
}


/* Premium hero proof honesty pass */
.hero-trust-ledger {
  display: grid;
  grid-template-columns: 132px 1fr;
  gap: 16px;
  align-items: center;
  margin: -10px 0 20px;
  padding: 14px;
  border: 1px solid var(--line);
  border-radius: 28px;
  background:
    radial-gradient(circle at 0% 0%, color-mix(in srgb, var(--accent) 18%, transparent), transparent 40%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 18px 60px rgba(0,0,0,.18);
}
.hero-trust-ledger img {
  width: 100%;
  border-radius: 20px;
  border: 1px solid var(--line);
  background: rgba(0,0,0,.18);
}
.hero-trust-ledger span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.hero-trust-ledger p { color: var(--muted); margin: 8px 0 0; font-size: .94rem; }
.hero-proof strong { font-size: clamp(1.08rem, 2vw, 1.55rem); letter-spacing: -.04em; }
.hero-proof div {
  background:
    linear-gradient(180deg, color-mix(in srgb, var(--surface) 92%, var(--accent) 8%), rgba(255,255,255,.018));
}
.hero-proof-console {
  width: 100%;
  display: block;
  border: 1px solid var(--line);
  border-radius: 32px;
  background: rgba(0,0,0,.18);
  aspect-ratio: 1.52 / 1;
  object-fit: cover;
  box-shadow: 0 24px 80px rgba(0,0,0,.24);
}
@media (max-width: 640px) {
  .hero-trust-ledger { grid-template-columns: 1fr; }
  .hero-trust-ledger img { max-height: 160px; object-fit: cover; }
}


/* Premium mobile hero conversion pass */
.hero-mobile-route {
  display: grid;
  grid-template-columns: 116px 1fr;
  gap: 14px;
  align-items: center;
  margin-top: 14px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 26px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--accent-2) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.018));
}
.hero-mobile-route img,
.hero-mobile-preview {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 20px;
  background: rgba(0,0,0,.18);
}
.hero-mobile-route span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .7rem;
  font-weight: 900;
}
.hero-mobile-route p { color: var(--muted); margin: 7px 0 0; font-size: .9rem; }
.hero-mobile-preview {
  margin-top: 14px;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  box-shadow: 0 18px 60px rgba(0,0,0,.18);
}
@media (max-width: 760px) {
  .hero { align-items: start; gap: 28px; }
  .hero-actions { margin: 28px 0 18px; }
  .hero-proof div { min-height: 92px; padding: 14px; }
  .hero-mobile-route { grid-template-columns: 96px 1fr; }
  .hero-proof-console { max-height: 340px; }
}
@media (max-width: 460px) {
  .hero-mobile-route { grid-template-columns: 1fr; }
  .hero-mobile-route img { max-height: 150px; object-fit: cover; }
}

/* Premium section finder command menu pass */
.command-palette { overflow-y: auto; padding: 8vh 0 40px; }
.command-box {
  width: min(760px, calc(100% - 28px));
  max-height: min(780px, 86vh);
  overflow: auto;
}
.command-search-panel {
  display: grid;
  gap: 12px;
  padding: 12px;
  border: 1px solid var(--line);
  border-radius: 24px;
  background:
    radial-gradient(circle at 100% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  margin-bottom: 12px;
}
.command-search-visuals {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 10px;
}
.command-search-visuals img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(0,0,0,.18);
}
.command-search-panel label {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.command-search-panel input {
  width: 100%;
  border: 1px solid var(--line-strong);
  border-radius: 18px;
  padding: 14px 16px;
  background: rgba(0,0,0,.22);
  color: var(--text);
  outline: none;
}
.command-search-panel input:focus { border-color: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 18%, transparent); }
.command-groups {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}
.command-group {
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 10px;
  background: rgba(255,255,255,.025);
}
.command-group p {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .7rem;
  font-weight: 900;
  margin: 4px 6px 8px;
}
.command-box a[hidden],
.command-group[hidden] { display: none; }
.command-box a[data-command-item] {
  border: 1px solid transparent;
  transition: color .2s ease, background .2s ease, border-color .2s ease, transform .2s ease;
}
.command-box a[data-command-item]:hover,
.command-box a[data-command-item]:focus-visible {
  transform: translateY(-2px);
  border-color: var(--line);
}
.command-empty {
  margin: 12px 0 0;
  padding: 14px;
  border-radius: 18px;
  color: var(--muted);
  background: rgba(255,255,255,.04);
}
@media (max-width: 680px) {
  .command-groups,
  .command-search-visuals { grid-template-columns: 1fr; }
  .command-search-visuals img:nth-child(2) { display: none; }
}


/* Premium services delivery matrix pass */
.service-delivery-system {
  margin-top: 24px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 16px;
  align-items: stretch;
}
.service-delivery-main,
.service-delivery-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.service-delivery-main:hover,
.service-delivery-side:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 34px 105px rgba(0,0,0,.30);
}
.service-delivery-main img,
.service-delivery-side img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.service-delivery-main:hover img,
.service-delivery-side:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.service-delivery-main div,
.service-delivery-side div { padding: clamp(22px, 3vw, 32px); }
.service-delivery-main span,
.service-delivery-side span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .74rem;
  font-weight: 900;
}
.service-delivery-main h3 { font-size: clamp(1.65rem, 3vw, 2.55rem); line-height: 1.02; margin: 12px 0; }
.service-delivery-side h3 { font-size: 1.32rem; margin: 12px 0; }
.service-delivery-main p,
.service-delivery-side li { color: var(--muted); }
.service-delivery-side ul { list-style: none; padding: 0; display: grid; gap: 8px; margin: 14px 0 22px; }
.service-delivery-side li {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 12px;
  background: rgba(255,255,255,.035);
}
@media (max-width: 980px) { .service-delivery-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .service-delivery-main, .service-delivery-side { border-radius: 24px; } }


/* Premium package decision matrix pass */
.package-decision-system {
  margin-top: 24px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 16px;
}
.package-decision-main,
.package-decision-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 80% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.package-decision-main:hover,
.package-decision-side:hover { transform: translateY(-8px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.30); }
.package-decision-main img,
.package-decision-side img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.package-decision-main:hover img,
.package-decision-side:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.package-decision-main div, .package-decision-side div { padding: clamp(22px, 3vw, 32px); }
.package-decision-main span, .package-decision-side span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .74rem; font-weight: 900; }
.package-decision-main h3 { font-size: clamp(1.65rem, 3vw, 2.55rem); line-height: 1.02; margin: 12px 0; }
.package-decision-side h3 { font-size: 1.32rem; margin: 12px 0; }
.package-decision-main p, .package-decision-side li { color: var(--muted); }
.package-decision-side ul { list-style: none; padding: 0; display: grid; gap: 8px; margin: 14px 0 22px; }
.package-decision-side li { border: 1px solid var(--line); border-radius: 999px; padding: 9px 12px; background: rgba(255,255,255,.035); }
@media (max-width: 980px) { .package-decision-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .package-decision-main, .package-decision-side { border-radius: 24px; } }


/* Premium process checkpoint pass */
.process-checkpoint-system {
  margin-top: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 16px;
  grid-column: 1 / -1;
}
.process-checkpoint-main,
.process-checkpoint-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.process-checkpoint-main:hover, .process-checkpoint-side:hover { transform: translateY(-8px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.30); }
.process-checkpoint-main img, .process-checkpoint-side img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.process-checkpoint-main:hover img, .process-checkpoint-side:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.process-checkpoint-main div, .process-checkpoint-side div { padding: clamp(22px, 3vw, 32px); }
.process-checkpoint-main span, .process-checkpoint-side span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .74rem; font-weight: 900; }
.process-checkpoint-main h3 { font-size: clamp(1.65rem, 3vw, 2.55rem); line-height: 1.02; margin: 12px 0; }
.process-checkpoint-side h3 { font-size: 1.32rem; margin: 12px 0; }
.process-checkpoint-main p, .process-checkpoint-side li { color: var(--muted); }
.process-checkpoint-side ul { list-style: none; padding: 0; display: grid; gap: 8px; margin: 14px 0 22px; }
.process-checkpoint-side li { border: 1px solid var(--line); border-radius: 999px; padding: 9px 12px; background: rgba(255,255,255,.035); }
@media (max-width: 980px) { .process-checkpoint-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .process-checkpoint-main, .process-checkpoint-side { border-radius: 24px; } }


/* Premium FAQ objection matrix pass */
.faq-objection-system {
  margin-top: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 16px;
}
.faq-objection-main,
.faq-objection-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.faq-objection-main:hover, .faq-objection-side:hover { transform: translateY(-8px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.30); }
.faq-objection-main img, .faq-objection-side img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.faq-objection-main:hover img, .faq-objection-side:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.faq-objection-main div, .faq-objection-side div { padding: clamp(22px, 3vw, 32px); }
.faq-objection-main span, .faq-objection-side span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .74rem; font-weight: 900; }
.faq-objection-main h3 { font-size: clamp(1.65rem, 3vw, 2.55rem); line-height: 1.02; margin: 12px 0; }
.faq-objection-side h3 { font-size: 1.32rem; margin: 12px 0; }
.faq-objection-main p, .faq-objection-side li { color: var(--muted); }
.faq-objection-side ul { list-style: none; padding: 0; display: grid; gap: 8px; margin: 14px 0 22px; }
.faq-objection-side li { border: 1px solid var(--line); border-radius: 999px; padding: 9px 12px; background: rgba(255,255,255,.035); }
@media (max-width: 980px) { .faq-objection-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .faq-objection-main, .faq-objection-side { border-radius: 24px; } }


/* Premium performance scoreboard pass */
.performance-scoreboard-system {
  margin-top: 18px;
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(320px, .92fr);
  gap: 16px;
}
.performance-scoreboard-main,
.performance-scoreboard-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.performance-scoreboard-main:hover, .performance-scoreboard-side:hover { transform: translateY(-8px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.30); }
.performance-scoreboard-main img, .performance-scoreboard-side img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.performance-scoreboard-main:hover img, .performance-scoreboard-side:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.performance-scoreboard-main div, .performance-scoreboard-side div { padding: clamp(22px, 3vw, 32px); }
.performance-scoreboard-main span, .performance-scoreboard-side span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .74rem; font-weight: 900; }
.performance-scoreboard-main h3 { font-size: clamp(1.65rem, 3vw, 2.55rem); line-height: 1.02; margin: 12px 0; }
.performance-scoreboard-side h3 { font-size: 1.32rem; margin: 12px 0; }
.performance-scoreboard-main p, .performance-scoreboard-side li { color: var(--muted); }
.performance-scoreboard-side ul { list-style: none; padding: 0; display: grid; gap: 8px; margin: 14px 0 22px; }
.performance-scoreboard-side li { border: 1px solid var(--line); border-radius: 999px; padding: 9px 12px; background: rgba(255,255,255,.035); }
@media (max-width: 980px) { .performance-scoreboard-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .performance-scoreboard-main, .performance-scoreboard-side { border-radius: 24px; } }


/* Premium launch handoff vault pass */
.launch-handoff-system {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
  margin-top: 18px;
}
.launch-handoff-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.launch-handoff-card:hover { transform: translateY(-8px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.30); }
.launch-handoff-card img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.launch-handoff-card:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.launch-handoff-card div { padding: clamp(22px, 3vw, 32px); }
.launch-handoff-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .74rem; font-weight: 900; }
.launch-handoff-card h3 { font-size: 1.32rem; margin: 12px 0; }
.launch-handoff-card p { color: var(--muted); margin-bottom: 0; }
@media (max-width: 900px) { .launch-handoff-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .launch-handoff-card { border-radius: 24px; } }


/* Premium brief clarity pass */
.brief-clarity-system {
  margin-top: 18px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 16px;
}
.brief-clarity-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.brief-clarity-card:hover { transform: translateY(-8px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.30); }
.brief-clarity-card img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.brief-clarity-card:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.brief-clarity-card div { padding: clamp(22px, 3vw, 32px); }
.brief-clarity-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .74rem; font-weight: 900; }
.brief-clarity-card h3 { font-size: 1.32rem; margin: 12px 0; }
.brief-clarity-card p { color: var(--muted); margin-bottom: 0; }
@media (max-width: 900px) { .brief-clarity-system { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .brief-clarity-card { border-radius: 24px; } }


/* Premium contact confidence pass */
.contact-confidence-system {
  display: grid;
  gap: 14px;
  margin: 18px 0;
}
.contact-confidence-card {
  border: 1px solid var(--line);
  border-radius: 28px;
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0%, color-mix(in srgb, var(--accent) 16%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 18px 60px rgba(0,0,0,.18);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.contact-confidence-card:hover { transform: translateY(-6px); border-color: var(--line-strong); box-shadow: 0 28px 85px rgba(0,0,0,.28); }
.contact-confidence-card img {
  width: 100%;
  aspect-ratio: 1.72 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: rgba(0,0,0,.18);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .7s var(--ease), filter .35s ease;
}
.contact-confidence-card:hover img { transform: scale(1.025); filter: saturate(1.18) contrast(1.08); }
.contact-confidence-card div { padding: 22px; }
.contact-confidence-card span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.contact-confidence-card h3 { font-size: 1.25rem; margin: 10px 0; }
.contact-confidence-card p { color: var(--muted); margin-bottom: 0; }
@media (max-width: 560px) { .contact-confidence-card { border-radius: 22px; } }


/* Premium website types decision pass */
.website-type-decision-system {
  margin-top: 28px;
  display: grid;
  grid-template-columns: minmax(0, 1.18fr) minmax(320px, .82fr);
  gap: 16px;
  align-items: stretch;
}
.website-type-decision-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 88% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  display: grid;
  grid-template-columns: minmax(0, .95fr) minmax(0, 1.05fr);
  min-height: 100%;
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.website-type-decision-card:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 34px 110px rgba(0,0,0,.30);
}
.website-type-decision-card img {
  width: 100%;
  height: 100%;
  min-height: 360px;
  object-fit: cover;
  border-right: 1px solid var(--line);
  background: var(--bg-2);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .75s var(--ease), filter .35s ease;
}
.website-type-decision-card:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.website-type-decision-card div { padding: clamp(22px, 3vw, 34px); }
.website-type-decision-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.website-type-decision-card h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  margin: 14px 0 12px;
}
.website-type-decision-card p { color: var(--muted); margin-bottom: 18px; }
.website-type-decision-card ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.website-type-decision-card li {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,.045);
  color: var(--muted);
  font-size: .92rem;
}
.website-type-decision-card li strong { color: var(--text); }
.decision-card-compact {
  grid-template-columns: 1fr;
}
.decision-card-compact img {
  min-height: 250px;
  height: auto;
  aspect-ratio: 1.7 / 1;
  border-right: 0;
  border-bottom: 1px solid var(--line);
}
.decision-card-compact .btn { width: fit-content; }
.website-type-chip-row {
  margin-top: 16px;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.website-type-chip-row span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 10px 14px;
  background: rgba(255,255,255,.045);
  color: var(--muted);
  font-size: .9rem;
  font-weight: 750;
}
@media (max-width: 1180px) {
  .website-type-decision-system { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .website-type-decision-card { grid-template-columns: 1fr; }
  .website-type-decision-card img {
    min-height: auto;
    aspect-ratio: 1.55 / 1;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
  .website-type-chip-row span { width: 100%; }
}


/* Premium selected work proof board pass */
.work-proof-board {
  margin-top: 28px;
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(320px, .9fr);
  gap: 16px;
  align-items: stretch;
}
.work-proof-board-main,
.work-proof-board-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 43%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 85px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.work-proof-board-main:hover,
.work-proof-board-side:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 36px 110px rgba(0,0,0,.30);
}
.work-proof-board-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .82fr);
}
.work-proof-board-main img,
.work-proof-board-side img {
  width: 100%;
  object-fit: cover;
  background: var(--bg-2);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .75s var(--ease), filter .35s ease;
}
.work-proof-board-main img {
  height: 100%;
  min-height: 380px;
  border-right: 1px solid var(--line);
}
.work-proof-board-side img {
  aspect-ratio: 1.62 / 1;
  border-bottom: 1px solid var(--line);
}
.work-proof-board-main:hover img,
.work-proof-board-side:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.work-proof-board-main div,
.work-proof-board-side div { padding: clamp(22px, 3vw, 34px); }
.work-proof-board span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.work-proof-board h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  margin: 14px 0 12px;
}
.work-proof-board p { color: var(--muted); margin-bottom: 0; }
.work-proof-board ul {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.work-proof-board li {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,.045);
  color: var(--muted);
  font-size: .92rem;
}
.work-proof-board-side .btn { width: fit-content; }
@media (max-width: 1080px) {
  .work-proof-board { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .work-proof-board-main { grid-template-columns: 1fr; }
  .work-proof-board-main img {
    min-height: auto;
    aspect-ratio: 1.58 / 1;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}


/* Premium about credibility pass */
.about-credibility-system {
  margin-top: 24px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}
.about-credibility-card {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 82% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 44%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 80px rgba(0,0,0,.20);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.about-credibility-card:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 34px 105px rgba(0,0,0,.30);
}
.about-credibility-card img {
  width: 100%;
  aspect-ratio: 1.6 / 1;
  object-fit: cover;
  border-bottom: 1px solid var(--line);
  background: var(--bg-2);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .75s var(--ease), filter .35s ease;
}
.about-credibility-card:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.about-credibility-card div { padding: 22px; }
.about-credibility-card span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.about-credibility-card h3 {
  font-size: 1.2rem;
  margin: 12px 0 10px;
}
.about-credibility-card p { color: var(--muted); margin-bottom: 0; font-size: .94rem; }
@media (max-width: 900px) {
  .about-credibility-system { grid-template-columns: 1fr; }
}


/* Premium business fit section pass */
.business-fit-system {
  margin-top: 28px;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: 16px;
  align-items: stretch;
}
.business-fit-main,
.business-fit-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 84% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 44%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 85px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.business-fit-main:hover,
.business-fit-side:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 36px 110px rgba(0,0,0,.30);
}
.business-fit-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .86fr);
}
.business-fit-main img,
.business-fit-side img {
  width: 100%;
  object-fit: cover;
  background: var(--bg-2);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .75s var(--ease), filter .35s ease;
}
.business-fit-main img {
  height: 100%;
  min-height: 380px;
  border-right: 1px solid var(--line);
}
.business-fit-side img {
  aspect-ratio: 1.62 / 1;
  border-bottom: 1px solid var(--line);
}
.business-fit-main:hover img,
.business-fit-side:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.business-fit-main div,
.business-fit-side div { padding: clamp(22px, 3vw, 34px); }
.business-fit-system span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.business-fit-system h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  margin: 14px 0 12px;
}
.business-fit-system p { color: var(--muted); margin-bottom: 0; }
.business-fit-system ul {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.business-fit-system li {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,.045);
  color: var(--muted);
  font-size: .92rem;
}
.business-fit-side .btn { width: fit-content; }
@media (max-width: 1080px) {
  .business-fit-system { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .business-fit-main { grid-template-columns: 1fr; }
  .business-fit-main img {
    min-height: auto;
    aspect-ratio: 1.58 / 1;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}


/* Premium commercial presentation pass */
.commercial-presentation-system {
  margin-top: 30px;
  display: grid;
  grid-template-columns: minmax(0, 1.16fr) minmax(320px, .84fr);
  gap: 16px;
  align-items: stretch;
}
.commercial-presentation-main,
.commercial-presentation-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 84% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 44%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 85px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.commercial-presentation-main:hover,
.commercial-presentation-side:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 36px 110px rgba(0,0,0,.30);
}
.commercial-presentation-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .84fr);
}
.commercial-presentation-main img,
.commercial-presentation-side img {
  width: 100%;
  object-fit: cover;
  background: var(--bg-2);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .75s var(--ease), filter .35s ease;
}
.commercial-presentation-main img {
  height: 100%;
  min-height: 390px;
  border-right: 1px solid var(--line);
}
.commercial-presentation-side img {
  aspect-ratio: 1.62 / 1;
  border-bottom: 1px solid var(--line);
}
.commercial-presentation-main:hover img,
.commercial-presentation-side:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.commercial-presentation-main div,
.commercial-presentation-side div { padding: clamp(22px, 3vw, 34px); }
.commercial-presentation-system span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.commercial-presentation-system h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  margin: 14px 0 12px;
}
.commercial-presentation-system p { color: var(--muted); margin-bottom: 0; }
.commercial-presentation-system ul {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.commercial-presentation-system li {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,.045);
  color: var(--muted);
  font-size: .92rem;
}
.commercial-presentation-side .btn { width: fit-content; }
.commercial-presentation-system + .premium-showcase-grid { margin-top: 18px; }
@media (max-width: 1080px) {
  .commercial-presentation-system { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .commercial-presentation-main { grid-template-columns: 1fr; }
  .commercial-presentation-main img {
    min-height: auto;
    aspect-ratio: 1.58 / 1;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}


/* Premium UI kit quality pass */
.component-quality-system {
  margin-top: 24px;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(320px, .88fr);
  gap: 16px;
  align-items: stretch;
}
.component-quality-main,
.component-quality-side {
  border: 1px solid var(--line);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background:
    radial-gradient(circle at 84% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 44%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 85px rgba(0,0,0,.22);
  transition: transform .35s var(--ease), border-color .35s var(--ease), box-shadow .35s var(--ease);
}
.component-quality-main:hover,
.component-quality-side:hover {
  transform: translateY(-8px);
  border-color: var(--line-strong);
  box-shadow: 0 36px 110px rgba(0,0,0,.30);
}
.component-quality-main {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, .86fr);
}
.component-quality-main img,
.component-quality-side img {
  width: 100%;
  object-fit: cover;
  background: var(--bg-2);
  filter: saturate(1.08) contrast(1.05);
  transition: transform .75s var(--ease), filter .35s ease;
}
.component-quality-main img {
  height: 100%;
  min-height: 380px;
  border-right: 1px solid var(--line);
}
.component-quality-side img {
  aspect-ratio: 1.62 / 1;
  border-bottom: 1px solid var(--line);
}
.component-quality-main:hover img,
.component-quality-side:hover img {
  transform: scale(1.025);
  filter: saturate(1.18) contrast(1.08);
}
.component-quality-main div,
.component-quality-side div { padding: clamp(22px, 3vw, 34px); }
.component-quality-system span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.component-quality-system h3 {
  font-size: clamp(1.35rem, 2.2vw, 2rem);
  margin: 14px 0 12px;
}
.component-quality-system p { color: var(--muted); margin-bottom: 0; }
.component-quality-system ul {
  margin: 0 0 20px;
  padding: 0;
  list-style: none;
  display: grid;
  gap: 10px;
}
.component-quality-system li {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,.045);
  color: var(--muted);
  font-size: .92rem;
}
.component-quality-side .btn { width: fit-content; }
@media (max-width: 1080px) {
  .component-quality-system { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .component-quality-main { grid-template-columns: 1fr; }
  .component-quality-main img {
    min-height: auto;
    aspect-ratio: 1.58 / 1;
    border-right: 0;
    border-bottom: 1px solid var(--line);
  }
}

/* Real plans, account, and compact homepage pass */
.compact-home #transformation,
.compact-home #case-study-system,
.compact-home #premium-showcase,
.compact-home #about,
.compact-home #ui-kit,
.compact-home #conversion-strategy,
.compact-home #trust-matrix,
.compact-home #audience-fit,
.compact-home #website-types,
.compact-home #project-fit,
.compact-home #seo-launch,
.compact-home #capabilities,
.compact-home #accessibility-theme { display: none; }
.live-plan-grid, .payment-flow-system, .account-order-system { display: grid; gap: 16px; margin-top: 26px; }
.live-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.payment-flow-system, .account-order-system { grid-template-columns: minmax(0, 1fr) minmax(320px, .9fr); }
.live-plan-card, .payment-flow-card, .account-panel, .order-panel {
  border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(22px, 3vw, 34px);
  background: radial-gradient(circle at 82% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 44%), linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 24px 85px rgba(0,0,0,.22); transition: transform .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease);
}
.live-plan-card:hover, .payment-flow-card:hover, .account-panel:hover, .order-panel:hover { transform: translateY(-6px); border-color: var(--line-strong); box-shadow: 0 34px 105px rgba(0,0,0,.28); }
.live-plan-card.selected { border-color: color-mix(in srgb, var(--accent) 60%, var(--line)); }
.live-plan-card span, .payment-flow-card span, .account-panel > span, .order-panel > span { color: var(--accent); text-transform: uppercase; letter-spacing: .13em; font-size: .72rem; font-weight: 900; }
.live-plan-card h3, .payment-flow-card h3, .account-panel h3, .order-panel h3 { font-size: clamp(1.35rem, 2.3vw, 2.1rem); margin: 14px 0 12px; }
.live-plan-card small { color: var(--muted); font-size: .92rem; }
.live-plan-card p, .payment-flow-card p, .live-status { color: var(--muted); }
.live-plan-card ul, .payment-flow-card ol, .order-panel ul { padding-left: 18px; color: var(--muted); display: grid; gap: 8px; }
.plan-delivery, .order-total { border: 1px solid var(--line); border-radius: 18px; padding: 14px; margin: 18px 0; background: rgba(255,255,255,.045); color: var(--text); }
.auth-form, .order-panel form, .account-settings { display: grid; gap: 12px; }
.auth-form label, .order-panel label, .account-settings label { display: grid; gap: 7px; color: var(--muted); font-weight: 750; }
.auth-form input, .order-panel input, .order-panel textarea, .account-settings input {
  width: 100%; border: 1px solid var(--line); border-radius: 16px; padding: 12px 14px; color: var(--text); background: rgba(255,255,255,.055);
}
.auth-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.live-status.error { color: #ffb5b5; }
.payment-status-strip { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 18px; }
.payment-status-strip span { border: 1px solid var(--line); border-radius: 999px; padding: 9px 12px; background: rgba(255,255,255,.045); color: var(--muted); font-size: .86rem; font-weight: 800; }
@media (max-width: 920px) { .live-plan-grid, .payment-flow-system, .account-order-system { grid-template-columns: 1fr; } }

/* Premium admin approval panel pass */
.admin-approval-panel {
  margin-top: 32px;
  border: 1px solid var(--line-strong);
  border-radius: 38px;
  padding: clamp(24px, 4vw, 44px);
  background:
    radial-gradient(circle at 12% 0, color-mix(in srgb, var(--accent) 20%, transparent), transparent 38%),
    radial-gradient(circle at 88% 8%, color-mix(in srgb, var(--accent-2) 20%, transparent), transparent 42%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.02));
  box-shadow: 0 32px 120px rgba(0,0,0,.28);
}
.admin-panel-head { max-width: 920px; margin-bottom: 24px; }
.admin-panel-head > span,
.admin-dashboard-card > span {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .14em;
  font-size: .72rem;
  font-weight: 900;
}
.admin-panel-head h2 { font-size: clamp(1.8rem, 4vw, 3.3rem); margin: 12px 0; }
.admin-panel-head p { color: var(--muted); }
.admin-dashboard-grid {
  display: grid;
  grid-template-columns: minmax(280px, .62fr) minmax(0, 1.38fr);
  gap: 16px;
}
.admin-dashboard-card {
  border: 1px solid var(--line);
  border-radius: 30px;
  padding: 22px;
  background: rgba(255,255,255,.045);
  min-width: 0;
}
.admin-dashboard-card h3 { font-size: clamp(2rem, 5vw, 4rem); margin: 8px 0 16px; }
.admin-list { display: grid; gap: 12px; max-height: 560px; overflow: auto; padding-right: 4px; }
.admin-row {
  border: 1px solid var(--line);
  border-radius: 20px;
  padding: 14px;
  background: rgba(0,0,0,.12);
  color: var(--muted);
}
.admin-row strong { display: block; color: var(--text); margin-bottom: 5px; }
.admin-order span, .admin-order small, .admin-order em, .admin-order a { display: block; margin: 6px 0; }
.admin-order a { color: var(--accent); font-weight: 800; }
.admin-order div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.admin-order button {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(255,255,255,.06);
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
}
.admin-order button:hover { border-color: var(--line-strong); background: rgba(255,255,255,.1); }
@media (max-width: 980px) { .admin-dashboard-grid { grid-template-columns: 1fr; } }

/* Short working website correction pass */
.compact-home #experience,
.compact-home #proof-system,
.compact-home #work,
.compact-home #transformation,
.compact-home #case-study-system,
.compact-home #customers,
.compact-home #premium-showcase,
.compact-home #ui-kit,
.compact-home #conversion-strategy,
.compact-home #services,
.compact-home #audience-fit,
.compact-home #website-types,
.compact-home #project-fit,
.compact-home #capabilities,
.compact-home .proof-section,
.compact-home #trust-matrix,
.compact-home #accessibility,
.compact-home #seo-launch,
.compact-home #performance,
.compact-home .launch-standard,
.compact-home #brief-kit { display: none !important; }
.compact-home .nav-command { display: none !important; }
.compact-home .section-shell { padding-top: clamp(64px, 8vw, 96px); padding-bottom: clamp(54px, 7vw, 86px); }
.compact-home .hero { min-height: auto; padding-top: clamp(96px, 12vw, 150px); }
.compact-home .hero-lead { max-width: 760px; }
.compact-home #about { display: grid !important; }
.compact-home #packages { display: block !important; }
.compact-home #faq { display: block !important; }
.compact-home #contact { display: grid !important; }
.local-fallback-note { border: 1px solid var(--line); border-radius: 16px; padding: 12px 14px; background: rgba(255,255,255,.045); color: var(--muted); font-size: .92rem; }
.admin-order img.payment-proof-preview { max-width: 100%; border-radius: 16px; border: 1px solid var(--line); margin-top: 8px; }

/* Chat unlock and completion workflow pass */
.customer-chat-panel {
  margin-top: 26px;
  border: 1px solid var(--line-strong);
  border-radius: 34px;
  padding: clamp(22px, 3.5vw, 38px);
  background:
    radial-gradient(circle at 16% 0, color-mix(in srgb, var(--accent) 18%, transparent), transparent 40%),
    linear-gradient(180deg, var(--surface), rgba(255,255,255,.025));
  box-shadow: 0 28px 100px rgba(0,0,0,.24);
  display: grid;
  gap: 18px;
}
.customer-chat-panel > div:first-child span,
.admin-chat-box > strong {
  color: var(--accent);
  text-transform: uppercase;
  letter-spacing: .13em;
  font-size: .72rem;
  font-weight: 900;
}
.customer-chat-panel h3 { font-size: clamp(1.35rem, 2.3vw, 2rem); margin: 10px 0; }
.chat-thread {
  border: 1px solid var(--line);
  border-radius: 24px;
  background: rgba(0,0,0,.14);
  padding: 14px;
  display: grid;
  gap: 10px;
  max-height: 360px;
  overflow: auto;
}
.chat-empty,
.chat-closed-note { color: var(--muted); margin: 0; }
.chat-message {
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  background: rgba(255,255,255,.045);
}
.chat-message.admin { border-color: color-mix(in srgb, var(--accent) 34%, var(--line)); background: color-mix(in srgb, var(--accent) 9%, transparent); }
.chat-message.customer { border-color: color-mix(in srgb, var(--accent-2) 28%, var(--line)); }
.chat-message strong { display: block; color: var(--text); margin-bottom: 5px; }
.chat-message p { margin: 0 0 6px; color: var(--muted); }
.chat-message small { color: var(--muted); opacity: .85; }
.chat-compose,
.admin-chat-box label { display: grid; gap: 10px; color: var(--muted); font-weight: 800; }
.chat-compose textarea,
.admin-chat-box textarea {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 18px;
  padding: 12px 14px;
  resize: vertical;
  color: var(--text);
  background: rgba(255,255,255,.055);
}
.admin-chat-box {
  margin-top: 14px;
  border: 1px solid var(--line);
  border-radius: 22px;
  padding: 14px;
  background: rgba(255,255,255,.035);
  display: grid;
  gap: 12px;
}
.admin-thread { max-height: 260px; }
.admin-order-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.admin-chat-box button {
  width: fit-content;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  background: rgba(255,255,255,.06);
  color: var(--text);
  font-weight: 800;
  cursor: pointer;
}
.admin-chat-box button:hover { border-color: var(--line-strong); background: rgba(255,255,255,.1); }

/* High-quality vector artwork replacement pass */
.hero-proof-console,
.hero-mobile-preview,
.hero-trust-ledger img,
.hero-mobile-route img,
.hq-card-art,
.hq-chat-art,
.hq-admin-art {
  image-rendering: auto;
  object-fit: cover;
  background: radial-gradient(circle at 20% 0, rgba(114,246,209,.16), transparent 42%), rgba(255,255,255,.035);
}
.hq-card-art {
  width: 100%;
  aspect-ratio: 1.66 / 1;
  border: 1px solid var(--line);
  border-radius: 24px;
  margin-bottom: 18px;
  box-shadow: 0 24px 70px rgba(0,0,0,.22);
}
.hq-chat-art,
.hq-admin-art {
  width: 100%;
  max-height: 360px;
  border: 1px solid var(--line);
  border-radius: 26px;
  box-shadow: 0 26px 80px rgba(0,0,0,.25);
}
.hq-admin-art { margin-bottom: 22px; }
.customer-chat-panel .hq-chat-art { display: block; }

/* Next-level premium UI polish pass */
.next-level-ui {
  --next-glow: 0 38px 120px rgba(12, 22, 38, .48);
  --next-line: color-mix(in srgb, var(--accent) 34%, var(--line));
}
.next-level-ui .ambient-bg::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  background:
    radial-gradient(circle at 50% 0%, rgba(114,246,209,.09), transparent 34%),
    linear-gradient(115deg, transparent 0 44%, rgba(255,255,255,.035) 45%, transparent 46% 100%);
  mix-blend-mode: screen;
}
.next-level-ui .site-header {
  top: 18px;
  width: min(1180px, calc(100% - 32px));
  left: 50%;
  transform: translateX(-50%);
  border: 1px solid color-mix(in srgb, var(--line) 72%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  backdrop-filter: blur(24px) saturate(1.4);
  box-shadow: 0 22px 80px rgba(0,0,0,.26);
}
.next-level-ui .brand-mark {
  box-shadow: 0 0 0 6px rgba(114,246,209,.08), 0 18px 50px rgba(114,246,209,.22);
}
.next-level-ui .hero {
  position: relative;
  overflow: hidden;
  border-bottom: 1px solid var(--line);
}
.next-level-ui .hero::before {
  content: '';
  position: absolute;
  inset: 72px max(20px, 4vw) 28px;
  border: 1px solid rgba(255,255,255,.08);
  border-radius: clamp(34px, 5vw, 64px);
  background:
    radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--accent) 15%, transparent), transparent 38%),
    radial-gradient(circle at 82% 16%, color-mix(in srgb, var(--accent-2) 14%, transparent), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.04), rgba(255,255,255,.015));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 50px 160px rgba(0,0,0,.22);
  pointer-events: none;
}
.next-level-ui .hero-copy,
.next-level-ui .hero-visual { position: relative; z-index: 1; }
.next-level-ui .eyebrow {
  width: fit-content;
  border: 1px solid var(--next-line);
  border-radius: 999px;
  padding: 9px 14px;
  background: rgba(255,255,255,.065);
  box-shadow: 0 20px 60px rgba(0,0,0,.18);
}
.next-level-ui h1 {
  letter-spacing: -.07em;
  text-shadow: 0 28px 90px rgba(0,0,0,.35);
}
.next-level-ui .hero-lead {
  font-size: clamp(1.04rem, 1.6vw, 1.26rem);
  line-height: 1.74;
}
.premium-badge-row {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 20px 0 22px;
}
.premium-badge-row span {
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 9px 12px;
  color: var(--text);
  background: rgba(255,255,255,.06);
  font-size: .86rem;
  font-weight: 850;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.next-level-ui .btn {
  transform: translateZ(0);
  box-shadow: 0 18px 50px rgba(0,0,0,.18);
}
.next-level-ui .btn-primary {
  background: linear-gradient(135deg, var(--accent), color-mix(in srgb, var(--accent-2) 70%, var(--accent)));
  color: #06101b;
  border: 0;
}
.next-level-ui .btn:hover,
.next-level-ui button:hover {
  transform: translateY(-3px);
}
.next-hero-proof div {
  position: relative;
  overflow: hidden;
  background: rgba(255,255,255,.065);
  border: 1px solid color-mix(in srgb, var(--accent) 26%, var(--line));
}
.next-hero-proof div::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(120deg, transparent, rgba(255,255,255,.16), transparent);
  transform: translateX(-120%);
  transition: transform .7s var(--ease);
}
.next-hero-proof div:hover::after { transform: translateX(120%); }
.next-level-ui .device-frame {
  border-radius: 42px;
  border: 1px solid color-mix(in srgb, var(--accent) 24%, var(--line));
  background:
    radial-gradient(circle at 30% 0, rgba(114,246,209,.18), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.12), rgba(255,255,255,.035));
  box-shadow: var(--next-glow), inset 0 1px 0 rgba(255,255,255,.18);
}
.next-level-ui .hero-proof-console {
  border-radius: 30px;
  box-shadow: 0 30px 95px rgba(0,0,0,.28);
}
.next-level-ui .hero-mobile-preview {
  border-radius: 24px;
  border: 1px solid var(--line);
}
.premium-flow-strip {
  position: relative;
  z-index: 1;
  width: min(1120px, calc(100% - 32px));
  margin: 32px auto 0;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 14px 18px;
  background: color-mix(in srgb, var(--surface) 80%, transparent);
  box-shadow: 0 28px 90px rgba(0,0,0,.22);
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px;
}
.premium-flow-strip span {
  color: var(--text);
  font-weight: 900;
  font-size: .88rem;
}
.premium-flow-strip i {
  width: 42px;
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--accent), var(--accent-2));
  opacity: .7;
}
.next-level-ui .section-shell {
  position: relative;
}
.next-level-ui #about,
.next-level-ui #packages,
.next-level-ui #faq,
.next-level-ui #contact {
  border-top: 1px solid rgba(255,255,255,.06);
}
.next-level-ui .section-heading h2 {
  letter-spacing: -.045em;
}
.next-plan-card {
  position: relative;
  overflow: hidden;
}
.next-plan-card::before {
  content: '';
  position: absolute;
  inset: -1px;
  border-radius: inherit;
  padding: 1px;
  background: linear-gradient(135deg, color-mix(in srgb, var(--accent) 55%, transparent), transparent 35%, color-mix(in srgb, var(--accent-2) 45%, transparent));
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
  pointer-events: none;
}
.plan-ribbon {
  position: absolute;
  top: 18px;
  right: 18px;
  z-index: 1;
  border: 1px solid var(--line);
  border-radius: 999px;
  padding: 8px 12px;
  color: var(--text);
  background: rgba(255,255,255,.08);
  font-size: .74rem;
  font-weight: 950;
  text-transform: uppercase;
  letter-spacing: .12em;
}
.plan-ribbon.premium {
  background: linear-gradient(135deg, rgba(255,231,163,.24), rgba(114,246,209,.16));
  border-color: color-mix(in srgb, var(--accent) 40%, var(--line));
}
.next-level-ui .live-plan-card,
.next-level-ui .payment-flow-card,
.next-level-ui .account-panel,
.next-level-ui .order-panel,
.next-level-ui .customer-chat-panel,
.next-level-ui .admin-approval-panel {
  backdrop-filter: blur(18px) saturate(1.25);
}
.next-level-ui .live-plan-card.selected {
  box-shadow: 0 36px 130px rgba(114,246,209,.18), 0 24px 90px rgba(0,0,0,.25);
}
.next-level-ui .payment-status-strip span {
  background: rgba(255,255,255,.07);
  border-color: color-mix(in srgb, var(--accent) 20%, var(--line));
}
.next-level-ui .admin-dashboard-card,
.next-level-ui .admin-row,
.next-level-ui .chat-thread,
.next-level-ui .chat-message {
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 16px 55px rgba(0,0,0,.16);
}
@media (max-width: 760px) {
  .next-level-ui .site-header {
    top: 10px;
    width: calc(100% - 18px);
    border-radius: 24px;
  }
  .premium-flow-strip { border-radius: 26px; justify-content: flex-start; }
  .premium-flow-strip i { width: 22px; }
  .plan-ribbon { position: static; width: fit-content; margin-bottom: 12px; }
}

/* Real app-style flow correction pass */
.landing-mode #process,
.landing-mode .account-order-system,
.landing-mode .customer-chat-panel,
.landing-mode .admin-approval-panel,
.landing-mode .payment-status-strip { display: none !important; }
.landing-mode .payment-flow-system { grid-template-columns: 1fr; }
.landing-mode .payment-flow-system .payment-flow-card:first-child { display: none; }
.landing-mode .live-plan-card .btn { width: fit-content; }

/* Screenshot-driven premium landing correction */
.landing-mode .quick-actions,
.landing-mode .marquee,
.landing-mode .hero-trust-ledger,
.landing-mode .hero-mobile-route,
.landing-mode #contact .contact-visual-card,
.landing-mode #contact .contact-action-system,
.landing-mode #contact .contact-intake-assist,
.landing-mode #contact .contact-template-visual,
.landing-mode #contact .contact-confidence-system,
.landing-mode #contact .contact-form,
.landing-mode #faq .faq-visual-stack,
.landing-mode #faq .faq-objection-system,
.landing-mode #faq .faq-cta { display: none !important; }
.landing-mode .site-header {
  max-width: 1120px;
  top: 18px;
  padding: 11px 14px 11px 22px;
}
.landing-mode .hero {
  min-height: 92vh;
  grid-template-columns: minmax(0, .9fr) minmax(420px, 1.1fr);
  align-items: center;
  gap: clamp(28px, 5vw, 70px);
  padding-top: clamp(118px, 14vw, 168px);
  padding-bottom: clamp(54px, 7vw, 90px);
}
.landing-mode .hero::before {
  inset: 92px max(20px, 5vw) 28px;
  background:
    radial-gradient(circle at 12% 8%, rgba(118,242,208,.18), transparent 34%),
    radial-gradient(circle at 88% 20%, rgba(155,140,255,.16), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.07), rgba(255,255,255,.018));
}
.landing-mode h1 {
  max-width: 820px;
  font-size: clamp(3.4rem, 7.8vw, 7.2rem);
  line-height: .88;
  letter-spacing: -.09em;
}
.landing-mode .hero-lead {
  max-width: 710px;
  font-size: clamp(1.08rem, 1.35vw, 1.24rem);
  color: color-mix(in srgb, var(--text) 76%, var(--muted));
}
.landing-mode .hero-actions { margin-top: 30px; }
.landing-mode .premium-badge-row { margin-top: 24px; }
.landing-mode .device-frame {
  transform: perspective(1000px) rotateY(-6deg) rotateX(2deg);
  transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}
.landing-mode .device-frame:hover { transform: perspective(1000px) rotateY(-2deg) rotateX(0deg) translateY(-8px); }
.landing-mode .code-card,
.landing-mode .metric-stack { display: none; }
.landing-mode .hero-proof-console {
  width: 100%;
  max-height: 520px;
  object-fit: cover;
  border-radius: 32px;
}
.landing-mode .hero-mobile-preview {
  position: absolute;
  right: -28px;
  bottom: -34px;
  width: 45%;
  max-height: 230px;
  object-fit: cover;
}
.landing-mode .premium-flow-strip {
  margin-top: -14px;
  margin-bottom: 0;
}
.landing-mode #about,
.landing-mode #packages,
.landing-mode #faq,
.landing-mode #contact {
  max-width: 1120px;
  margin: 0 auto;
  border-radius: 42px;
  border: 1px solid rgba(255,255,255,.08);
  background: linear-gradient(180deg, rgba(255,255,255,.045), rgba(255,255,255,.018));
  box-shadow: 0 24px 110px rgba(0,0,0,.18);
  padding-left: clamp(20px, 4vw, 54px);
  padding-right: clamp(20px, 4vw, 54px);
}
.landing-mode #about { grid-template-columns: .72fr 1.28fr; }
.landing-mode #about .about-credibility-system { display: none; }
.landing-mode #packages .payment-flow-system { margin-top: 18px; }
.landing-mode #packages .payment-flow-card { padding: 20px; }
.landing-mode .live-plan-grid { gap: 18px; }
.landing-mode #faq { display: block !important; }
.landing-mode #faq .faq-assurance-grid { display: block; }
.landing-mode #faq .faq-list { max-width: 880px; margin: 0 auto; }
.landing-mode #contact {
  display: block !important;
  text-align: center;
  padding-top: clamp(46px, 6vw, 72px);
  padding-bottom: clamp(46px, 6vw, 72px);
  margin-bottom: 48px;
}
.landing-mode #contact .contact-copy { max-width: 760px; margin: 0 auto; }
.landing-mode #contact .contact-methods,
.landing-mode #contact .email-actions { justify-content: center; }
@media (max-width: 980px) {
  .landing-mode .hero { grid-template-columns: 1fr; min-height: auto; }
  .landing-mode .hero-mobile-preview { position: static; width: 100%; max-height: 240px; margin-top: 14px; }
  .landing-mode #about { grid-template-columns: 1fr; }
}

/* Screenshot UI audit correction: compact premium client-facing landing */
.landing-mode .nav a[href="#admin"],
.landing-mode .mobile-panel a[href="#admin"],
.landing-mode .quick-actions,
.landing-mode .command-launcher,
.landing-mode .nav-command { display: none !important; }

.landing-mode .site-header {
  max-width: min(1080px, calc(100vw - 34px));
  min-height: 64px;
  border-radius: 999px;
  background: rgba(8, 11, 14, .72);
  border: 1px solid rgba(255,255,255,.1);
  box-shadow: 0 18px 60px rgba(0,0,0,.34);
  backdrop-filter: blur(24px) saturate(150%);
}

.landing-mode .nav { gap: 18px; }
.landing-mode .nav a { font-size: .86rem; letter-spacing: .01em; color: rgba(255,255,255,.72); }
.landing-mode .brand-mark { box-shadow: 0 0 0 1px rgba(170,255,207,.2), 0 12px 30px rgba(142,255,191,.18); }

.landing-mode .hero {
  max-width: 1180px;
  margin-inline: auto;
  min-height: 86vh;
  grid-template-columns: minmax(0, .92fr) minmax(380px, .88fr);
  padding-top: clamp(118px, 12vw, 148px);
  padding-bottom: clamp(48px, 7vw, 74px);
}

.landing-mode .hero::before {
  inset: 104px 0 24px;
  border-radius: 42px;
  background:
    linear-gradient(120deg, rgba(255,255,255,.07), rgba(255,255,255,.015)),
    radial-gradient(circle at 8% 14%, rgba(132,255,200,.22), transparent 30%),
    radial-gradient(circle at 90% 18%, rgba(142,128,255,.19), transparent 36%);
  border: 1px solid rgba(255,255,255,.08);
}

.landing-mode h1 {
  max-width: 780px;
  font-size: clamp(3rem, 6vw, 5.9rem);
  line-height: .92;
  letter-spacing: -.075em;
}

.landing-mode .hero-lead {
  max-width: 690px;
  font-size: clamp(1rem, 1.15vw, 1.16rem);
  line-height: 1.75;
}

.landing-mode .hero-actions .btn { min-height: 54px; }
.landing-mode .premium-badge-row { gap: 8px; max-width: 720px; }
.landing-mode .premium-badge-row span {
  background: rgba(255,255,255,.055);
  border-color: rgba(255,255,255,.09);
}

.landing-mode .hero-visual { align-self: center; }
.landing-mode .device-frame {
  padding: 14px;
  border-radius: 34px;
  background: linear-gradient(180deg, rgba(255,255,255,.09), rgba(255,255,255,.028));
  border: 1px solid rgba(255,255,255,.12);
  box-shadow: 0 36px 110px rgba(0,0,0,.46), inset 0 1px 0 rgba(255,255,255,.12);
}
.landing-mode .hero-proof-console {
  max-height: 440px;
  border-radius: 24px;
  object-fit: cover;
  object-position: center;
}
.landing-mode .hero-mobile-preview {
  right: -18px;
  bottom: -22px;
  width: 38%;
  max-height: 190px;
  border-radius: 22px;
  box-shadow: 0 22px 70px rgba(0,0,0,.36);
}

.landing-mode .premium-flow-strip {
  max-width: 980px;
  margin: 18px auto 0;
  padding: 12px 18px;
  border-radius: 999px;
  background: rgba(255,255,255,.06);
  border-color: rgba(255,255,255,.1);
  box-shadow: 0 16px 60px rgba(0,0,0,.28);
}
.landing-mode .premium-flow-strip span { font-size: .82rem; }

.landing-mode .section-shell { margin-top: 28px; }
.landing-mode #about,
.landing-mode #packages,
.landing-mode #faq,
.landing-mode #contact {
  max-width: 1080px;
  border-radius: 34px;
  padding: clamp(34px, 5vw, 58px);
}

.landing-mode #about {
  display: grid !important;
  grid-template-columns: .65fr 1fr;
  gap: 22px;
  align-items: stretch;
}
.landing-mode #about .profile-visual,
.landing-mode #about .about-credibility-system { display: none !important; }
.landing-mode #about .profile-card,
.landing-mode #about .about-copy {
  border-radius: 26px;
  background: rgba(255,255,255,.038);
  border: 1px solid rgba(255,255,255,.08);
  padding: clamp(22px, 3vw, 32px);
}
.landing-mode #about .principles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.landing-mode #about .principles div { padding: 18px; }

.landing-mode #packages .section-heading h2 { max-width: 760px; }
.landing-mode .live-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.landing-mode .live-plan-card {
  border-radius: 28px;
  padding: clamp(22px, 3vw, 32px);
  box-shadow: 0 18px 70px rgba(0,0,0,.24);
}
.landing-mode .live-plan-card ul {
  display: grid;
  gap: 8px;
  margin-block: 18px;
}
.landing-mode .payment-flow-system {
  display: grid;
  grid-template-columns: 1fr;
  max-width: 760px;
  margin-inline: auto;
}
.landing-mode .payment-flow-card:first-child { display: none !important; }
.landing-mode .email-card { text-align: center; }
.landing-mode .email-card .hq-card-art { max-height: 260px; object-fit: cover; border-radius: 22px; }

.landing-mode #faq .section-heading { text-align: center; margin-inline: auto; }
.landing-mode #faq .faq-list details {
  border-radius: 22px;
  background: rgba(255,255,255,.04);
  border: 1px solid rgba(255,255,255,.08);
}

.landing-mode #contact {
  display: block !important;
  min-height: auto;
  text-align: center;
  margin-bottom: 54px;
  background:
    radial-gradient(circle at 50% 0%, rgba(137,255,200,.12), transparent 42%),
    linear-gradient(180deg, rgba(255,255,255,.058), rgba(255,255,255,.022));
}
.landing-mode #contact .contact-copy { max-width: 780px; margin-inline: auto; }
.landing-mode #contact .contact-copy h2 { font-size: clamp(2.2rem, 4.6vw, 4.3rem); letter-spacing: -.055em; }
.landing-mode #contact .contact-copy p { max-width: 620px; margin-inline: auto; }
.landing-mode #contact .contact-methods,
.landing-mode #contact .email-actions,
.landing-mode #contact .contact-form { display: none !important; }
.landing-contact-cta {
  display: flex;
  justify-content: center;
  gap: 12px;
  flex-wrap: wrap;
  margin-top: 26px;
}
.landing-contact-cta .btn { min-height: 54px; }

@media (max-width: 1020px) {
  .landing-mode .hero { grid-template-columns: 1fr; min-height: auto; }
  .landing-mode .hero-visual { max-width: 720px; width: 100%; margin-inline: auto; }
  .landing-mode #about { grid-template-columns: 1fr; }
  .landing-mode .live-plan-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .landing-mode .site-header { top: 10px; border-radius: 24px; }
  .landing-mode .hero { padding-top: 108px; }
  .landing-mode h1 { font-size: clamp(2.45rem, 15vw, 4.2rem); }
  .landing-mode .premium-flow-strip { display: grid; grid-template-columns: 1fr; border-radius: 24px; text-align: center; }
  .landing-mode .premium-flow-strip i { display: none; }
  .landing-mode .hero-mobile-preview { position: static; width: 100%; max-height: 210px; margin-top: 12px; }
  .landing-mode #about .principles { grid-template-columns: 1fr; }
}

/* Browser screenshot correction pass: remove overlay and reduce oversized UI */
.landing-mode .quick-action-bar,
.landing-mode .quick-actions { display: none !important; }

.landing-mode .hero {
  min-height: auto !important;
  padding-top: 118px !important;
  padding-bottom: 44px !important;
  grid-template-columns: minmax(0, .95fr) minmax(360px, .9fr) !important;
  gap: clamp(24px, 4vw, 54px) !important;
}
.landing-mode .hero::before { inset: 96px 0 20px !important; }
.landing-mode h1 {
  max-width: 670px !important;
  font-size: clamp(2.8rem, 4.8vw, 4.45rem) !important;
  line-height: .95 !important;
  letter-spacing: -.065em !important;
}
.landing-mode .hero-lead {
  max-width: 620px !important;
  font-size: 1.03rem !important;
  line-height: 1.68 !important;
}
.landing-mode .hero-actions { margin-top: 22px !important; }
.landing-mode .premium-badge-row { margin-top: 18px !important; }
.landing-mode .hero-proof { margin-top: 18px !important; }
.landing-mode .hero-proof-console { max-height: 360px !important; }
.landing-mode .hero-mobile-preview { width: 34% !important; max-height: 150px !important; }
.landing-mode .premium-flow-strip { margin-top: 12px !important; }

.landing-mode #about,
.landing-mode #packages,
.landing-mode #faq,
.landing-mode #contact {
  padding-top: clamp(28px, 4vw, 46px) !important;
  padding-bottom: clamp(28px, 4vw, 46px) !important;
}
.landing-mode #about .profile-links,
.landing-mode #about .muted { display: none !important; }
.landing-mode #about .profile-card,
.landing-mode #about .about-copy { padding: 22px !important; }
.landing-mode #about .about-copy > p:not(.section-kicker) { margin-bottom: 16px !important; }
.landing-mode #about .principles div p { display: none !important; }
.landing-mode #about .principles div { padding: 14px !important; }

.landing-mode .live-plan-card ul li:nth-child(n+4) { display: none !important; }
.landing-mode .live-plan-card { padding: 24px !important; }
.landing-mode .live-plan-card h3 { font-size: clamp(1.9rem, 3vw, 2.6rem) !important; }
.landing-mode .plan-delivery { font-size: .92rem !important; padding: 12px !important; }
.landing-mode #packages .payment-flow-system { margin-top: 18px !important; }
.landing-mode .email-card .hq-card-art { max-height: 220px !important; }

.landing-mode #faq .faq-list details:nth-child(n+4) { display: none !important; }
.landing-mode #faq .faq-list { display: grid; gap: 10px; }
.landing-mode #contact .contact-copy h2 { font-size: clamp(2rem, 3.6vw, 3.4rem) !important; }

.portal-page .portal-welcome {
  min-height: auto;
  padding: clamp(36px, 5vw, 70px);
  grid-template-columns: minmax(0, .95fr) minmax(340px, .78fr);
  gap: clamp(24px, 4vw, 52px);
}
.portal-page .portal-welcome h1 {
  font-size: clamp(2.6rem, 5vw, 4.45rem);
  line-height: .96;
  letter-spacing: -.065em;
  max-width: 720px;
}
.portal-page .portal-welcome img { max-height: 300px; object-fit: cover; }
.portal-page .portal-shell { gap: 22px; }
.portal-page .portal-card { border-radius: 28px; }

.portal-auth-page .auth-hero {
  min-height: auto;
  padding: clamp(34px, 5vw, 70px);
}
.portal-auth-page .auth-copy h1 {
  font-size: clamp(2.7rem, 5vw, 4.6rem);
  line-height: .98;
}

@media (max-width: 980px) {
  .landing-mode .hero,
  .portal-page .portal-welcome { grid-template-columns: 1fr !important; }
  .landing-mode .hero-visual,
  .portal-page .portal-welcome img { max-width: 680px; margin-inline: auto; }
}

/* Final visual-debug screenshot corrections */
.landing-mode .site-header .brand {
  display: inline-flex !important;
  visibility: visible !important;
  opacity: 1 !important;
}
.landing-mode .site-header .brand-text {
  display: inline-block !important;
  color: var(--text) !important;
  font-size: .96rem;
}
.landing-mode .hero { padding-top: 104px !important; padding-bottom: 30px !important; }
.landing-mode .hero::before { inset: 82px 0 14px !important; }
.landing-mode h1 {
  max-width: 610px !important;
  font-size: clamp(2.45rem, 3.7vw, 3.85rem) !important;
  line-height: .98 !important;
}
.landing-mode .hero-lead { max-width: 580px !important; font-size: .98rem !important; line-height: 1.62 !important; }
.landing-mode .hero-proof-console { max-height: 315px !important; filter: brightness(1.18) saturate(1.16) contrast(1.05); }
.landing-mode .hero-mobile-preview { display: none !important; }
.landing-mode .premium-badge-row span:nth-child(n+4) { display: none !important; }
.landing-mode .premium-flow-strip { max-width: 820px !important; }
.landing-mode .premium-flow-strip span { font-size: .78rem !important; }
@media (min-width: 1021px) {
  .landing-mode .hero { align-items: center; }
}

/* Header centering fix from real browser screenshot */
.landing-mode .site-header {
  left: auto !important;
  transform: none !important;
  width: min(1080px, calc(100% - 34px)) !important;
  margin: 18px auto 0 !important;
}

/* Contrast correction from screenshot render */
.landing-mode h1 { color: #f4f7ef !important; opacity: 1 !important; }
.landing-mode .hero-lead { color: rgba(236,241,232,.78) !important; }
.landing-mode .eyebrow { color: #8effc6 !important; }
.landing-mode .device-frame { opacity: 1 !important; }
.landing-mode .hero-proof-console { opacity: 1 !important; }

/* Real Hamzah logo integration */
.brand-logo {
  width: 42px;
  height: 42px;
  border-radius: 14px;
  object-fit: cover;
  box-shadow: 0 0 0 1px rgba(255,255,255,.18), 0 14px 38px rgba(0,0,0,.3);
}
.brand-mark { display: none; }
.landing-mode .site-header .brand-logo { width: 42px; height: 42px; border-radius: 14px; }

/* === Premium short Hamzah homepage 2026 refresh === */
.premium-short-page {
  --short-bg: #050711;
  --short-panel: rgba(255,255,255,.075);
  --short-panel-strong: rgba(255,255,255,.12);
  --short-line: rgba(255,255,255,.14);
  --short-text: #f7fbff;
  --short-muted: #aebbd0;
  --short-accent: #76f2d0;
  --short-violet: #9b8cff;
  min-height: 100vh;
  background:
    radial-gradient(circle at 14% -8%, rgba(118,242,208,.20), transparent 34%),
    radial-gradient(circle at 84% 6%, rgba(155,140,255,.20), transparent 36%),
    linear-gradient(145deg, #050711 0%, #08111f 54%, #111e33 100%);
  color: var(--short-text);
  overflow-x: hidden;
}
.premium-short-page[data-theme="light"],
html[data-theme="light"] .premium-short-page {
  --short-bg: #f7fbff;
  --short-panel: rgba(255,255,255,.78);
  --short-panel-strong: rgba(255,255,255,.92);
  --short-line: rgba(10,22,38,.13);
  --short-text: #07111f;
  --short-muted: #536276;
  background:
    radial-gradient(circle at 14% -8%, rgba(118,242,208,.34), transparent 34%),
    radial-gradient(circle at 84% 6%, rgba(155,140,255,.28), transparent 36%),
    linear-gradient(145deg, #f7fbff 0%, #eef6ff 54%, #f7f1ff 100%);
}
.premium-short-page .page-loader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: grid;
  place-items: center;
  background: #050711;
  color: #f7fbff;
  transition: opacity .35s ease, visibility .35s ease;
}
body.loaded.premium-short-page .page-loader { opacity: 0; visibility: hidden; pointer-events: none; }
.premium-short-page .scroll-progress { position: fixed; inset: 0 auto auto 0; height: 3px; width: 0; z-index: 50; background: linear-gradient(90deg, var(--short-accent), var(--short-violet)); }
.short-header {
  position: sticky;
  top: 14px;
  z-index: 40;
  width: min(1180px, calc(100% - 24px));
  margin: 14px auto 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 12px 14px;
  border: 1px solid var(--short-line);
  border-radius: 999px;
  background: rgba(5,7,17,.72);
  backdrop-filter: blur(22px) saturate(1.35);
  box-shadow: 0 20px 70px rgba(0,0,0,.28);
}
html[data-theme="light"] .short-header { background: rgba(255,255,255,.76); box-shadow: 0 20px 70px rgba(42,64,96,.12); }
.short-brand { display: inline-flex; align-items: center; gap: 10px; color: var(--short-text); text-decoration: none; font-weight: 1000; letter-spacing: -.045em; }
.short-brand img { width: 44px; height: 44px; border-radius: 15px; object-fit: cover; box-shadow: 0 0 0 1px rgba(255,255,255,.18), 0 16px 38px rgba(0,0,0,.26); }
.short-nav, .short-actions, .hero-actions, .hero-assurance, .short-footer nav { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.short-nav a, .short-footer a { color: var(--short-muted); text-decoration: none; font-weight: 900; }
.short-nav a:hover, .short-footer a:hover { color: var(--short-text); }
.premium-short-page .btn, .premium-short-page .theme-toggle, .premium-short-page .menu-toggle {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  border: 1px solid var(--short-line);
  border-radius: 999px;
  padding: 11px 16px;
  background: rgba(255,255,255,.055);
  color: var(--short-text);
  text-decoration: none;
  font-weight: 950;
  cursor: pointer;
  transition: transform .22s ease, border-color .22s ease, background .22s ease, box-shadow .22s ease;
}
.premium-short-page .btn:hover, .premium-short-page .theme-toggle:hover, .premium-short-page .menu-toggle:hover { transform: translateY(-2px); border-color: rgba(118,242,208,.45); background: rgba(255,255,255,.10); }
.premium-short-page .btn-primary { border: 0; color: #06101b; background: linear-gradient(135deg, var(--short-accent), var(--short-violet)); box-shadow: 0 18px 55px rgba(118,242,208,.19); }
.premium-short-page .btn-ghost { background: rgba(255,255,255,.055); }
.premium-short-page .menu-toggle { display: none; width: 44px; padding: 0; flex-direction: column; gap: 5px; }
.premium-short-page .menu-toggle span { width: 18px; height: 2px; border-radius: 999px; background: currentColor; }
.premium-short-page .mobile-panel {
  position: fixed;
  top: 76px;
  left: 12px;
  right: 12px;
  z-index: 38;
  display: none;
  padding: 18px;
  border: 1px solid var(--short-line);
  border-radius: 26px;
  background: rgba(5,7,17,.92);
  backdrop-filter: blur(20px);
  box-shadow: 0 30px 90px rgba(0,0,0,.28);
}
html[data-theme="light"] .premium-short-page .mobile-panel { background: rgba(255,255,255,.93); }
.premium-short-page .mobile-panel a { display: block; padding: 12px; color: var(--short-text); text-decoration: none; border-radius: 16px; font-weight: 900; }
.premium-short-page .mobile-panel a:hover { background: rgba(255,255,255,.08); }
.premium-short-page .mobile-panel.open { display: block; }
.section-pad { width: min(1180px, calc(100% - 28px)); margin: 0 auto; padding: clamp(44px, 7vw, 92px) 0; }
.short-hero { min-height: calc(100vh - 84px); display: grid; grid-template-columns: 1fr .88fr; gap: clamp(22px, 4vw, 54px); align-items: center; }
.short-hero-copy h1, .short-section-head h2, .short-cta h2, .trust-card h2 {
  margin: 14px 0;
  max-width: 840px;
  font-size: clamp(2.55rem, 6.4vw, 6.45rem);
  line-height: .9;
  letter-spacing: -.085em;
  color: var(--short-text);
}
.short-section-head h2, .short-cta h2, .trust-card h2 { font-size: clamp(2.1rem, 4.4vw, 4.35rem); }
.premium-short-page .eyebrow { width: max-content; max-width: 100%; display: inline-flex; align-items: center; gap: 10px; margin: 0; border: 1px solid rgba(118,242,208,.26); border-radius: 999px; padding: 9px 13px; background: rgba(118,242,208,.08); color: var(--short-accent); text-transform: uppercase; letter-spacing: .15em; font-size: .74rem; font-weight: 1000; }
.premium-short-page .pulse-dot { width: 8px; height: 8px; border-radius: 999px; background: var(--short-accent); box-shadow: 0 0 0 7px rgba(118,242,208,.10); }
.premium-short-page .hero-lead, .short-section-head p, .short-cta p, .trust-card p { max-width: 760px; color: var(--short-muted); font-size: clamp(1rem, 1.45vw, 1.18rem); line-height: 1.75; }
.hero-actions { margin-top: 26px; }
.hero-assurance { margin-top: 24px; }
.hero-assurance span { border: 1px solid var(--short-line); border-radius: 999px; padding: 9px 12px; background: rgba(255,255,255,.055); color: var(--short-muted); font-weight: 850; font-size: .9rem; }
.short-hero-visual { position: relative; min-height: 560px; border: 1px solid var(--short-line); border-radius: 44px; padding: 18px; background: linear-gradient(180deg, var(--short-panel-strong), rgba(255,255,255,.035)); box-shadow: 0 45px 150px rgba(0,0,0,.32); overflow: hidden; }
.short-hero-visual::before { content: ""; position: absolute; inset: -25% auto auto -20%; width: 360px; height: 360px; border-radius: 50%; background: rgba(118,242,208,.18); filter: blur(20px); }
.short-hero-visual img { position: relative; width: 100%; height: 100%; min-height: 520px; object-fit: cover; border: 1px solid var(--short-line); border-radius: 32px; background: rgba(0,0,0,.18); }
.floating-card { position: absolute; max-width: 250px; display: grid; gap: 4px; border: 1px solid var(--short-line); border-radius: 22px; padding: 14px; background: rgba(5,7,17,.74); color: var(--short-text); box-shadow: 0 22px 70px rgba(0,0,0,.34); backdrop-filter: blur(18px); }
html[data-theme="light"] .floating-card { background: rgba(255,255,255,.86); box-shadow: 0 22px 70px rgba(42,64,96,.14); }
.floating-card strong { font-size: .95rem; } .floating-card span { color: var(--short-muted); font-size: .86rem; line-height: 1.45; }
.card-one { top: 36px; right: 34px; } .card-two { left: 34px; bottom: 34px; }
.short-section { border-top: 1px solid rgba(255,255,255,.07); }
.short-section-head { margin-bottom: 24px; }
.compact-card-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.premium-short-page .capability-card, .pricing-card, .flow-rail article, .trust-card, .short-cta {
  border: 1px solid var(--short-line);
  border-radius: 30px;
  background: linear-gradient(180deg, var(--short-panel-strong), rgba(255,255,255,.04));
  box-shadow: 0 28px 100px rgba(0,0,0,.20);
}
.premium-short-page .capability-card { padding: 18px; min-height: 100%; }
.premium-short-page .capability-card img { width: 100%; aspect-ratio: 1.18 / .78; object-fit: cover; border: 1px solid var(--short-line); border-radius: 22px; background: rgba(0,0,0,.14); }
.premium-short-page .capability-card h3, .flow-rail h3 { margin: 15px 0 8px; font-size: 1.18rem; letter-spacing: -.03em; color: var(--short-text); }
.premium-short-page .capability-card p, .pricing-card p, .pricing-card li, .flow-rail p { color: var(--short-muted); line-height: 1.65; }
.pricing-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.pricing-card { padding: clamp(22px, 3vw, 34px); position: relative; overflow: hidden; }
.pricing-card.featured { border-color: rgba(118,242,208,.38); box-shadow: 0 36px 120px rgba(118,242,208,.11); }
.plan-tag { display: inline-flex; width: max-content; border: 1px solid rgba(118,242,208,.25); border-radius: 999px; padding: 8px 11px; color: var(--short-accent); background: rgba(118,242,208,.08); font-weight: 1000; font-size: .8rem; }
.pricing-card h3 { margin: 16px 0 10px; font-size: clamp(2.1rem, 4vw, 3.3rem); letter-spacing: -.06em; color: var(--short-text); }
.pricing-card small { font-size: 1rem; color: var(--short-muted); letter-spacing: 0; }
.pricing-card ul { display: grid; gap: 8px; padding-left: 20px; margin: 18px 0; }
.pricing-card strong { display: block; margin: 16px 0 20px; color: var(--short-text); }
.flow-rail { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.flow-rail article { padding: 20px; }
.flow-rail span { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 15px; color: #06101b; background: linear-gradient(135deg, var(--short-accent), var(--short-violet)); font-weight: 1000; }
.trust-card { display: grid; grid-template-columns: .82fr 1fr; align-items: center; gap: 24px; padding: clamp(22px, 4vw, 44px); }
.trust-card img { width: 100%; border: 1px solid var(--short-line); border-radius: 26px; background: rgba(0,0,0,.16); }
.short-cta { text-align: center; padding: clamp(28px, 5vw, 56px); }
.short-cta .eyebrow, .short-cta p, .short-cta h2 { margin-left: auto; margin-right: auto; }
.short-cta .hero-actions { justify-content: center; }
.short-footer { width: min(1180px, calc(100% - 28px)); margin: 0 auto; padding: 28px 0 42px; border-top: 1px solid rgba(255,255,255,.10); display: flex; align-items: center; justify-content: space-between; gap: 16px; flex-wrap: wrap; color: var(--short-muted); }
.short-footer p { margin: 0; }
@media (max-width: 1080px) { .compact-card-grid, .flow-rail { grid-template-columns: repeat(2, minmax(0, 1fr)); } .short-hero { grid-template-columns: 1fr; } .short-hero-visual { min-height: 430px; } .short-hero-visual img { min-height: 390px; } }
@media (max-width: 820px) { .short-nav, .short-actions .btn, .short-actions .theme-toggle { display: none; } .premium-short-page .menu-toggle { display: inline-flex; } .short-header { border-radius: 24px; } .pricing-grid, .trust-card { grid-template-columns: 1fr; } .short-hero-copy h1 { font-size: clamp(2.55rem, 13vw, 4.7rem); } .floating-card { position: relative; inset: auto; margin-top: 12px; max-width: none; } .short-hero-visual { min-height: 0; } .short-hero-visual img { min-height: 0; aspect-ratio: 1 / .72; } }
@media (max-width: 580px) { .compact-card-grid, .flow-rail { grid-template-columns: 1fr; } .section-pad { width: min(100% - 22px, 1180px); padding: 38px 0; } .short-footer { align-items: flex-start; flex-direction: column; } }

/* Defensive hidden-state rule for short landing overlays */
[hidden]{display:none!important;}


/* === Serious premium pass: tighter hierarchy, calmer homepage, better mobile polish === */
.premium-short-page .short-hero{min-height:auto;gap:clamp(26px,4vw,58px);padding-top:clamp(82px,9vw,128px);padding-bottom:clamp(54px,7vw,92px)}
.premium-short-page .short-hero-copy{max-width:760px}
.premium-short-page .short-hero-copy h1{font-size:clamp(2.35rem,5.05vw,5.15rem);line-height:.96;letter-spacing:-.07em;max-width:760px}
.premium-short-page .hero-lead{font-size:clamp(1.02rem,1.35vw,1.22rem);line-height:1.72;max-width:690px;color:rgba(247,241,229,.76)}
.premium-short-page .short-section-head h2,.premium-short-page .short-cta h2,.premium-short-page .trust-card h2{font-size:clamp(1.85rem,3.2vw,3.25rem);line-height:1.03;letter-spacing:-.055em}
.premium-short-page .short-hero-visual{min-height:clamp(380px,42vw,500px);border-radius:32px;box-shadow:0 34px 90px rgba(0,0,0,.34),inset 0 1px 0 rgba(255,255,255,.14)}
.premium-short-page .short-hero-visual>img{min-height:clamp(340px,38vw,455px);object-fit:cover;border-radius:26px}
.premium-short-page .floating-card{backdrop-filter:blur(18px);border-color:rgba(255,255,255,.18);box-shadow:0 20px 52px rgba(0,0,0,.26)}
.premium-short-page .capability-card,.premium-short-page .pricing-card,.premium-short-page .trust-card,.premium-short-page .flow-rail article{box-shadow:0 24px 70px rgba(0,0,0,.23);border-color:rgba(255,255,255,.115)}
.premium-short-page .capability-card:hover,.premium-short-page .pricing-card:hover,.premium-short-page .flow-rail article:hover{transform:translateY(-5px);border-color:rgba(245,197,107,.34);box-shadow:0 28px 90px rgba(0,0,0,.32)}
.premium-short-page .pricing-card.featured{background:linear-gradient(145deg,rgba(245,197,107,.18),rgba(255,255,255,.07) 38%,rgba(12,14,22,.84));border-color:rgba(245,197,107,.42)}
.premium-short-page .btn{min-height:46px;border-radius:999px;box-shadow:0 16px 42px rgba(0,0,0,.18)}
.premium-short-page .short-header{border-color:rgba(255,255,255,.1);box-shadow:0 20px 60px rgba(0,0,0,.18)}
.premium-short-page .hero-assurance{gap:10px}
.premium-short-page .hero-assurance span{border-color:rgba(255,255,255,.13);background:rgba(255,255,255,.055);white-space:nowrap}
@media (max-width: 900px){
  .premium-short-page .short-hero{grid-template-columns:1fr;padding-top:88px;text-align:left}
  .premium-short-page .short-hero-copy h1{font-size:clamp(2.15rem,8.4vw,4.15rem);letter-spacing:-.06em}
  .premium-short-page .short-hero-visual{min-height:360px}
  .premium-short-page .short-hero-visual>img{min-height:330px}
  .premium-short-page .pricing-grid,.premium-short-page .compact-card-grid{grid-template-columns:1fr}
}
@media (max-width: 560px){
  .premium-short-page .short-header{top:10px;width:calc(100% - 20px);padding:9px 10px;border-radius:22px}
  .premium-short-page .short-brand img{width:36px;height:36px}
  .premium-short-page .short-brand span{font-size:1rem}
  .premium-short-page .short-actions .btn,.premium-short-page .theme-toggle{display:none}
  .premium-short-page .short-hero{padding-top:78px;padding-bottom:42px}
  .premium-short-page .short-hero-copy h1{font-size:clamp(2.05rem,12vw,3.35rem);line-height:1;letter-spacing:-.052em}
  .premium-short-page .hero-lead{font-size:1rem;line-height:1.64}
  .premium-short-page .hero-actions{display:grid;grid-template-columns:1fr;gap:10px}
  .premium-short-page .hero-assurance{align-items:stretch}
  .premium-short-page .hero-assurance span{text-align:center}
  .premium-short-page .short-hero-visual{min-height:300px;border-radius:24px}
  .premium-short-page .short-hero-visual>img{min-height:276px;border-radius:20px}
  .premium-short-page .floating-card{position:static;margin:10px 12px 0;max-width:none}
  .premium-short-page .short-section-head h2,.premium-short-page .short-cta h2,.premium-short-page .trust-card h2{font-size:clamp(1.75rem,9vw,2.45rem);line-height:1.06}
}

/* Serious premium pass: keep content visible in static/full-page captures and no-JS previews. */
.premium-short-page .reveal{opacity:1;transform:none}

/* Serious premium pass: replace low-contrast trust artwork with a clear handoff board. */
.quality-board{display:grid;gap:12px;border:1px solid var(--short-line);border-radius:26px;padding:18px;background:radial-gradient(circle at top left,rgba(118,242,208,.14),transparent 42%),rgba(255,255,255,.04);box-shadow:inset 0 1px 0 rgba(255,255,255,.09)}
.quality-board div{display:grid;grid-template-columns:auto 1fr;gap:2px 12px;align-items:center;border:1px solid rgba(255,255,255,.09);border-radius:18px;padding:13px;background:rgba(6,8,16,.38)}
.quality-board span{grid-row:1/3;display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,var(--short-accent),var(--short-violet));color:#06101b;font-weight:1000;font-size:.82rem}
.quality-board strong{color:var(--short-text);font-size:.98rem;letter-spacing:-.02em}
.quality-board small{color:var(--short-muted);line-height:1.45}
@media (max-width: 820px){.quality-board{order:2}}


/* Serious premium pass 2: richer service card visuals without adding homepage length. */
.premium-short-page .capability-card{position:relative;overflow:hidden}
.premium-short-page .capability-card::before{content:"";position:absolute;inset:auto -25% -35% auto;width:180px;height:180px;border-radius:999px;background:rgba(118,242,208,.09);filter:blur(4px);pointer-events:none}
.premium-short-page .capability-card img{filter:saturate(1.22) brightness(1.08) contrast(1.04);box-shadow:inset 0 1px 0 rgba(255,255,255,.08),0 14px 34px rgba(0,0,0,.22)}
.premium-short-page .capability-card h3,.premium-short-page .capability-card p{position:relative}
.premium-short-page .short-cta .btn{min-width:116px}
@media (max-width:560px){.premium-short-page .capability-card img{aspect-ratio:1.4/.78}.premium-short-page .short-cta .hero-actions{display:grid;grid-template-columns:1fr}.premium-short-page .short-cta .btn{width:100%}}


/* Serious premium pass 6: mobile landing tightening after screenshot review. */
@media (max-width:560px){
  .premium-short-page .eyebrow{font-size:.62rem;letter-spacing:.075em;line-height:1.28;white-space:normal;overflow-wrap:anywhere;padding:7px 9px}
  .premium-short-page .short-hero{padding-top:42px}
  .premium-short-page .hero-assurance{display:grid;grid-template-columns:1fr;gap:8px}
  .premium-short-page .capability-card{display:grid;grid-template-columns:94px 1fr;gap:12px;align-items:center;padding:12px;border-radius:22px}
  .premium-short-page .capability-card img{width:94px;height:78px;aspect-ratio:auto;object-fit:cover;border-radius:16px;margin:0}
  .premium-short-page .capability-card h3{margin:0 0 5px;font-size:1rem}
  .premium-short-page .capability-card p{margin:0;font-size:.88rem;line-height:1.48}
  .premium-short-page .short-section-head{margin-bottom:16px}
  .premium-short-page .short-section-head p{font-size:.95rem;line-height:1.58}
  .premium-short-page .flow-rail article{padding:16px;border-radius:22px}
  .premium-short-page .quality-board div{padding:11px;border-radius:15px}
}

/* Serious premium pass 7: corrected mobile service-card grid after screenshot inspection. */
@media (max-width:560px){
  .premium-short-page .capability-card{grid-template-columns:96px minmax(0,1fr);grid-auto-rows:auto;column-gap:13px;row-gap:3px}
  .premium-short-page .capability-card img{grid-column:1;grid-row:1 / span 2;width:96px;height:82px}
  .premium-short-page .capability-card h3,.premium-short-page .capability-card p{grid-column:2;min-width:0;overflow-wrap:normal;word-break:normal;hyphens:none}
  .premium-short-page .capability-card h3{align-self:end}
  .premium-short-page .capability-card p{align-self:start}
}


/* Serious premium pass 11: faster plan-to-portal path and compact mobile CTA actions. */
@media (max-width:560px){
  .premium-short-page .short-cta .hero-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .premium-short-page .short-cta .hero-actions .btn{width:100%;min-width:0;text-align:center;justify-content:center}
}

/* 2026 premium cinematic pass: scroll effects, background video, and stronger short-page impact. */
.short-header{
  position:sticky;top:12px;z-index:1000;width:min(calc(100% - 24px),1200px);margin:14px auto 0;
  display:grid;grid-template-columns:auto 1fr auto;gap:16px;align-items:center;padding:12px 14px;
  border:1px solid rgba(255,255,255,.1);border-radius:999px;background:color-mix(in srgb,var(--bg-2) 82%,transparent);backdrop-filter:blur(22px);box-shadow:0 20px 80px rgba(0,0,0,.32)
}
.short-header.scrolled{border-color:rgba(255,255,255,.18);background:color-mix(in srgb,var(--bg-2) 92%,transparent)}
.short-brand{display:inline-flex;align-items:center;gap:10px;font-weight:900;letter-spacing:-.04em}
.short-nav{display:flex;justify-content:center;gap:2px;flex-wrap:wrap}
.short-nav a,.theme-toggle{padding:11px 14px;border-radius:999px;color:var(--muted);font-size:.94rem;transition:color .2s ease,background .2s ease,border-color .2s ease;border:1px solid transparent;background:transparent}
.short-nav a:hover,.short-nav a:focus-visible,.theme-toggle:hover{color:var(--text);background:var(--surface);border-color:var(--line);outline:none}
.short-actions{display:flex;align-items:center;gap:8px}
.theme-toggle{cursor:pointer}
.menu-toggle{display:none;width:44px;height:44px;border-radius:999px;border:1px solid var(--line);background:var(--surface)}
.menu-toggle span{display:block;width:18px;height:2px;margin:5px auto;border-radius:999px;background:currentColor}
.section-pad{width:min(calc(100% - 32px),var(--max));margin:0 auto;padding:110px 0;position:relative}
.short-hero{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(320px,.92fr);gap:44px;align-items:center;min-height:calc(100vh - 92px);padding-top:96px;position:relative;isolation:isolate}
.hero-video-wrap{position:absolute;inset:0;border-radius:40px;overflow:hidden;z-index:-1;opacity:.9;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08),0 40px 120px rgba(0,0,0,.4)}
.hero-video{width:100%;height:100%;object-fit:cover;transform:scale(1.03);filter:saturate(1.05) contrast(1.02) brightness(.45)}
.hero-video-scrim{position:absolute;inset:0;background:radial-gradient(circle at 20% 24%,rgba(141,255,207,.18),transparent 26%),radial-gradient(circle at 84% 18%,rgba(142,183,255,.18),transparent 24%),linear-gradient(120deg,rgba(8,9,13,.1),rgba(8,9,13,.68) 45%,rgba(8,9,13,.82) 100%)}
.hero-noise{position:absolute;inset:0;background:repeating-linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,.025) 1px,transparent 1px,transparent 3px);mix-blend-mode:soft-light;opacity:.16}
.short-hero-copy,.short-hero-visual,.short-section-head,.trust-card,.flow-rail article,.capability-card,.pricing-card{position:relative;z-index:1}
.short-hero-copy h1{font-size:clamp(2.8rem,6vw,5rem);line-height:.95;letter-spacing:-.05em;margin:0 0 20px;max-width:11ch}
.hero-lead{max-width:62ch;font-size:1.05rem;color:var(--text);opacity:.9}
.hero-assurance{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}.hero-assurance span{padding:10px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.07);font-size:.86rem;color:var(--text)}
.short-hero-visual{padding:22px;border-radius:34px;border:1px solid rgba(255,255,255,.12);background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.05));backdrop-filter:blur(18px);box-shadow:0 35px 110px rgba(0,0,0,.32)}
.short-hero-visual img{border-radius:24px}
.floating-card{position:absolute;display:grid;gap:6px;min-width:170px;padding:14px 16px;border-radius:18px;border:1px solid rgba(255,255,255,.14);background:rgba(7,12,20,.8);backdrop-filter:blur(18px);box-shadow:0 18px 44px rgba(0,0,0,.28)}
.floating-card strong{font-size:.95rem}.floating-card span{font-size:.82rem;color:var(--muted)}
.card-one{left:-24px;bottom:30px}.card-two{right:-24px;top:32px}
.short-section-head{max-width:780px}.short-section-head h2{font-size:clamp(2rem,4vw,3.2rem);line-height:1.02;letter-spacing:-.04em;margin:0 0 14px}.short-section-head p{color:var(--muted);font-size:1rem}
.compact-card-grid,.pricing-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px}.compact-card-grid{margin-top:28px}
.capability-card,.pricing-card,.trust-card,.flow-rail article{border:1px solid rgba(255,255,255,.1);background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));backdrop-filter:blur(14px);box-shadow:0 24px 80px rgba(0,0,0,.24)}
.capability-card{padding:18px;border-radius:28px;overflow:hidden;transition:transform .35s var(--ease),border-color .35s var(--ease),box-shadow .35s var(--ease)}
.capability-card img{border-radius:18px;margin-bottom:16px}.capability-card:hover{transform:translateY(-8px);border-color:rgba(141,255,207,.2);box-shadow:0 34px 110px rgba(0,0,0,.28),0 0 0 1px rgba(141,255,207,.08)}
.spotlight-card::before{content:"";position:absolute;inset:-1px;border-radius:inherit;background:radial-gradient(280px circle at var(--spot-x,50%) var(--spot-y,50%),rgba(141,255,207,.15),transparent 45%);opacity:0;transition:opacity .25s ease;pointer-events:none}
.spotlight-card:hover::before{opacity:1}
.pricing-grid{margin-top:28px}.pricing-card{padding:28px;border-radius:32px;display:grid;gap:14px}.pricing-card.featured{transform:translateY(-8px);border-color:rgba(240,215,138,.3);box-shadow:0 30px 110px rgba(0,0,0,.34),0 0 0 1px rgba(240,215,138,.08)}
.plan-tag{display:inline-flex;width:max-content;padding:7px 12px;border-radius:999px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);font-size:.74rem;text-transform:uppercase;letter-spacing:.12em;font-weight:900;color:var(--accent)}
.pricing-card h3{font-size:2rem;line-height:1;letter-spacing:-.05em;margin:0}.pricing-card p,.pricing-card li,.trust-copy p,.flow-rail p{color:var(--muted)}
.pricing-card ul{margin:0;padding-left:18px;display:grid;gap:10px}
.flow-rail{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-top:26px}.flow-rail article{padding:24px;border-radius:26px;transition:transform .35s var(--ease)}.flow-rail article:hover{transform:translateY(-6px)}
.flow-rail span{display:grid;place-items:center;width:42px;height:42px;border-radius:16px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#07100d;font-weight:900;margin-bottom:16px}
.trust-card{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:28px;padding:28px;border-radius:34px;align-items:center}
.quality-board{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.quality-board div{border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.06);padding:16px;border-radius:20px}.quality-board span{display:grid;place-items:center;width:34px;height:34px;border-radius:12px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#07100d;font-weight:900;margin-bottom:10px}
.reveal{opacity:0;transform:translateY(26px);transition:opacity .7s var(--ease),transform .7s var(--ease)}.reveal.visible{opacity:1;transform:none}.delay-1{transition-delay:.08s}.delay-2{transition-delay:.16s}.delay-3{transition-delay:.24s}
.scroll-progress{position:fixed;top:0;left:0;height:3px;width:0;z-index:2001;background:linear-gradient(90deg,var(--accent),var(--accent-2),var(--accent-3));box-shadow:0 0 30px rgba(141,255,207,.35)}
[data-parallax]{will-change:transform}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}.reveal,[data-parallax],.capability-card,.pricing-card,.flow-rail article,.short-hero-visual{transition:none!important;transform:none!important}.hero-video{animation:none}}
@media (max-width: 980px){.short-header{grid-template-columns:auto auto;row-gap:10px}.short-nav{display:none}.menu-toggle{display:inline-block}.short-actions .btn{display:none}.mobile-panel.open{display:block}.short-hero,.trust-card,.pricing-grid,.compact-card-grid,.flow-rail{grid-template-columns:1fr}.short-hero{padding-top:88px}.hero-video-wrap{inset:0 0 auto 0;height:100%}.short-hero-copy h1{max-width:12ch}.card-one{left:14px;bottom:-12px}.card-two{right:14px;top:-12px}.quality-board{grid-template-columns:1fr 1fr}}
@media (max-width: 640px){.section-pad{width:min(calc(100% - 20px),var(--max));padding:88px 0}.short-header{width:calc(100% - 18px);padding:10px 12px}.short-brand img{width:40px;height:40px}.short-hero-copy h1{font-size:clamp(2.2rem,11vw,3.4rem)}.hero-lead{font-size:.98rem}.hero-assurance span{width:100%;justify-content:center;text-align:center}.quality-board{grid-template-columns:1fr}.floating-card{position:static;margin-top:12px}.short-hero-visual{padding:16px}.pricing-card{padding:22px}}

/* Final visual correction: keep scroll effects but prevent parallax from pushing content out of place. */
.cinematic-frame{transform:none!important;}
.cinematic-frame .floating-card{max-width:220px;}
.card-one{left:18px!important;bottom:18px!important;}
.card-two{right:18px!important;top:18px!important;}
.flow-rail{align-items:stretch;}
.cinematic-rail article{transform:none!important;}
.capability-card img{height:260px;object-fit:cover;background:linear-gradient(135deg,rgba(118,242,208,.12),rgba(155,140,255,.1));}
.capability-card:nth-child(3) img,.capability-card:nth-child(4) img{filter:saturate(1.25) brightness(1.18);}
@media (max-width:980px){.card-one,.card-two{position:static!important;}.capability-card img{height:auto;max-height:220px;object-fit:cover;}}

/* Premium two-site showcase cards added for clickable portfolio demos. */
.showcase-highlight-section{padding-top:92px}.portfolio-showcase-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;margin-top:28px}.portfolio-showcase-card{position:relative;overflow:hidden;display:grid;border:1px solid rgba(255,255,255,.11);border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:0 30px 100px rgba(0,0,0,.28);transition:transform .35s var(--ease),border-color .35s ease}.portfolio-showcase-card:hover{transform:translateY(-10px);border-color:rgba(141,255,207,.3)}.portfolio-showcase-card img{width:100%;height:330px;object-fit:cover;filter:saturate(1.08) contrast(1.03)}.portfolio-showcase-card span{width:max-content;margin:22px 22px 0;border:1px solid rgba(141,255,207,.22);border-radius:999px;padding:7px 11px;background:rgba(141,255,207,.08);color:var(--accent);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;font-weight:1000}.portfolio-showcase-card h3{margin:12px 22px 8px;font-size:clamp(1.8rem,3vw,2.6rem);font-family:Georgia,serif;letter-spacing:-.04em}.portfolio-showcase-card p{margin:0 22px 18px;color:var(--muted)}.portfolio-showcase-card strong{margin:0 22px 24px;color:var(--accent-2)}@media(max-width:850px){.portfolio-showcase-grid{grid-template-columns:1fr}.portfolio-showcase-card img{height:250px}}

/* Real showcase cards: brighten the preview crops so the homepage cards do not feel empty. */
.portfolio-showcase-card img{background:radial-gradient(circle at 72% 42%,rgba(141,255,207,.16),transparent 32%),linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.03));filter:brightness(1.18) saturate(1.12) contrast(1.08)}
.portfolio-showcase-card[data-showcase-card="lumora"] img{object-position:78% 48%}
.portfolio-showcase-card[data-showcase-card="ember"] img{object-position:76% 48%;filter:brightness(1.24) saturate(1.15) contrast(1.08)}
.portfolio-showcase-card::before{content:"";position:absolute;inset:0 0 auto 0;height:330px;z-index:1;background:linear-gradient(180deg,rgba(255,255,255,.08),transparent 38%,rgba(0,0,0,.18));pointer-events:none}.portfolio-showcase-card span,.portfolio-showcase-card h3,.portfolio-showcase-card p,.portfolio-showcase-card strong{position:relative;z-index:2}
@media(max-width:850px){.portfolio-showcase-card::before{height:250px}}

/* High-quality homepage showcase media: video preview with still-image fallback. */
.portfolio-showcase-card .showcase-card-video{width:100%;height:330px;object-fit:cover;display:block;filter:brightness(.76) saturate(1.16) contrast(1.06);background:rgba(255,255,255,.04)}
.portfolio-showcase-card .showcase-card-video + img{position:absolute;top:0;left:0;width:100%;height:330px;object-fit:cover;opacity:.58;mix-blend-mode:screen;pointer-events:none}
@media(max-width:850px){.portfolio-showcase-card .showcase-card-video,.portfolio-showcase-card .showcase-card-video + img{height:250px}}

/* Final all-site effects pass: pointer glow, ambient particles, shimmer, tilt, and scroll depth polish. */
.fx-ambient,.fx-cursor{pointer-events:none;position:fixed;inset:0;z-index:0}.fx-ambient{overflow:hidden;mix-blend-mode:screen;opacity:.58}.fx-particle{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,var(--accent),transparent 68%);filter:blur(.5px);opacity:.28;animation:fxFloat var(--d) ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.72s)}.fx-cursor{width:360px;height:360px;inset:auto;left:-180px;top:-180px;border-radius:50%;background:radial-gradient(circle,rgba(141,255,207,.16),rgba(142,183,255,.08) 38%,transparent 68%);filter:blur(16px);transform:translate3d(var(--pointer-x,50vw),var(--pointer-y,50vh),0);z-index:1}.short-header,.mobile-panel,main,footer{position:relative;z-index:2}.fx-card{position:relative;overflow:hidden;transform:var(--tilt,none);transition:transform .26s ease,border-color .26s ease,box-shadow .26s ease}.fx-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(260px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.13),transparent 48%);opacity:0;transition:opacity .25s ease}.fx-card:hover::after{opacity:1}.short-header::before,.portfolio-showcase-card::after,.pricing-card::before,.capability-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(110deg,transparent 0%,rgba(255,255,255,.10) 42%,transparent 58%);transform:translateX(calc(-120% + (var(--scroll-ratio,0) * 240%)));opacity:.22}.fx-nav-scrolled{box-shadow:0 26px 90px rgba(0,0,0,.38),0 0 0 1px rgba(141,255,207,.08)!important}.hero-video-wrap::after,.short-hero-visual::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(120deg,transparent,rgba(141,255,207,.09),transparent);animation:fxSweep 8s ease-in-out infinite}.short-hero-visual{overflow:hidden}.btn-primary,.portal-btn.primary{position:relative;overflow:hidden}.btn-primary::after,.portal-btn.primary::after{content:"";position:absolute;inset:-20% -80%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transform:translateX(-130%);animation:fxButtonSheen 6s ease-in-out infinite}@keyframes fxFloat{from{transform:translate3d(-10px,-12px,0) scale(.8)}to{transform:translate3d(18px,20px,0) scale(1.25)}}@keyframes fxSweep{0%,100%{transform:translateX(-120%);opacity:0}45%,55%{opacity:1}100%{transform:translateX(120%)}}@keyframes fxButtonSheen{0%,35%{transform:translateX(-130%)}55%,100%{transform:translateX(130%)}}@media(prefers-reduced-motion:reduce){.fx-particle,.hero-video-wrap::after,.short-hero-visual::after,.btn-primary::after,.portal-btn.primary::after{animation:none!important}.fx-cursor{display:none}.fx-card{transform:none!important}}

/* Serious homepage rebuild: full-bleed cinematic hero, no boxed low-end frame. */
.rebuild-hero{position:relative;isolation:isolate;min-height:100vh;width:100%;overflow:hidden;padding:clamp(110px,12vh,150px) 0 42px;background:#03070d;color:var(--text)}
.rebuild-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(3,7,13,.94) 0%,rgba(3,7,13,.74) 36%,rgba(3,7,13,.38) 68%,rgba(3,7,13,.72) 100%),radial-gradient(circle at 18% 26%,rgba(141,255,207,.16),transparent 34%),radial-gradient(circle at 84% 18%,rgba(142,183,255,.18),transparent 36%)}
.rebuild-hero-media{position:absolute;inset:0;z-index:-3;overflow:hidden}.rebuild-hero-media img,.rebuild-hero-media video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;filter:brightness(.56) saturate(1.08) contrast(1.06);transform:scale(1.035)}.rebuild-hero-media video{opacity:.36;mix-blend-mode:screen}.rebuild-hero-vignette{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.24),rgba(3,7,13,.88)),repeating-linear-gradient(90deg,rgba(255,255,255,.035) 0 1px,transparent 1px 96px);mask-image:linear-gradient(90deg,#000 0%,#000 78%,transparent 100%)}
.rebuild-hero-shell{width:min(calc(100% - 34px),1260px);margin:0 auto;display:grid;grid-template-columns:minmax(0,1.02fr) minmax(360px,.82fr);gap:clamp(24px,4vw,58px);align-items:center;position:relative;z-index:2}.rebuild-hero-copy h1{font-size:clamp(3.1rem,7.2vw,6.7rem);line-height:.88;letter-spacing:-.075em;margin:0 0 22px;max-width:10.8ch;text-wrap:balance;text-shadow:0 16px 55px rgba(0,0,0,.35)}.rebuild-hero-copy .hero-lead{max-width:66ch;color:rgba(247,243,232,.9);font-size:clamp(1rem,1.4vw,1.22rem);line-height:1.72}.rebuild-hero-badges{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.rebuild-hero-badges span{border:1px solid rgba(141,255,207,.2);border-radius:999px;padding:10px 14px;background:rgba(9,17,25,.48);box-shadow:inset 0 1px 0 rgba(255,255,255,.08);backdrop-filter:blur(12px);color:#dffdf4;font-size:.88rem;font-weight:850}
.rebuild-command-deck{position:relative;border:1px solid rgba(255,255,255,.16);border-radius:38px;background:linear-gradient(180deg,rgba(255,255,255,.14),rgba(255,255,255,.045));box-shadow:0 40px 140px rgba(0,0,0,.46),0 0 0 1px rgba(141,255,207,.06);padding:16px;overflow:hidden;backdrop-filter:blur(20px);transform-style:preserve-3d}.rebuild-command-deck::before{content:"";position:absolute;inset:-35%;background:conic-gradient(from 160deg,transparent,rgba(141,255,207,.18),transparent,rgba(240,215,138,.13),transparent);animation:deckAura 12s linear infinite;opacity:.72}.rebuild-command-deck>*{position:relative;z-index:1}.rebuild-command-deck img{width:100%;height:auto;border-radius:26px;box-shadow:0 30px 90px rgba(0,0,0,.36);filter:saturate(1.05) contrast(1.04)}.deck-topline{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:8px 8px 14px;color:rgba(247,243,232,.72);font-size:.8rem;text-transform:uppercase;letter-spacing:.12em;font-weight:900}.deck-topline b{color:var(--accent)}.deck-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:12px}.deck-metrics div{border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(0,0,0,.25);padding:12px;display:grid;gap:4px}.deck-metrics strong{color:var(--accent);font-size:.82rem}.deck-metrics span{color:rgba(247,243,232,.78);font-size:.84rem;font-weight:850}.rebuild-quality-strip{width:min(calc(100% - 34px),1260px);margin:34px auto 0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1px;border:1px solid rgba(255,255,255,.1);border-radius:24px;overflow:hidden;background:rgba(255,255,255,.045);backdrop-filter:blur(18px);position:relative;z-index:2}.rebuild-quality-strip span{padding:16px 18px;background:rgba(3,7,13,.52);color:rgba(247,243,232,.78);font-weight:850;text-align:center}.capability-card img{aspect-ratio:16/9;object-fit:cover;width:100%;height:auto;max-height:280px}.capability-card{box-shadow:0 30px 110px rgba(0,0,0,.26)}.pricing-card,.portfolio-showcase-card,.flow-rail article,.trust-card{box-shadow:0 34px 120px rgba(0,0,0,.3)}@keyframes deckAura{to{transform:rotate(360deg)}}@media(max-width:980px){.rebuild-hero-shell{grid-template-columns:1fr}.rebuild-hero-copy h1{max-width:12ch}.rebuild-command-deck{max-width:720px}.rebuild-quality-strip{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:620px){.rebuild-hero{padding-top:100px}.rebuild-hero-shell,.rebuild-quality-strip{width:calc(100% - 20px)}.rebuild-hero-copy h1{font-size:clamp(2.55rem,15vw,4.3rem)}.rebuild-command-deck{padding:10px;border-radius:26px}.rebuild-command-deck img{border-radius:18px}.deck-metrics{grid-template-columns:1fr}.rebuild-quality-strip{grid-template-columns:1fr}.rebuild-quality-strip span{text-align:left}.rebuild-hero-badges span{width:100%;text-align:center}}

/* Premium Appwrite-ready contact command section */
.contact-command-section{position:relative}.contact-command-section::before{content:"";position:absolute;inset:40px -10vw auto -10vw;height:520px;background:radial-gradient(circle at 25% 20%,rgba(141,255,207,.13),transparent 34%),radial-gradient(circle at 80% 15%,rgba(240,215,138,.12),transparent 34%);pointer-events:none;z-index:-1}.contact-command-head{max-width:780px;margin-bottom:28px}.contact-command-head h2{font-size:clamp(2.4rem,4.8vw,4.4rem);line-height:.96;letter-spacing:-.06em;margin:0 0 12px}.contact-command-head p{color:var(--muted);font-size:1.02rem;line-height:1.7}.contact-command-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(340px,.76fr);gap:24px;align-items:start}.contact-command-form,.contact-command-side{border:1px solid rgba(255,255,255,.12);border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.09),rgba(255,255,255,.035));box-shadow:0 34px 120px rgba(0,0,0,.3);backdrop-filter:blur(18px)}.contact-command-form{padding:26px;display:grid;gap:16px}.contact-form-topline{display:flex;justify-content:space-between;gap:14px;align-items:center;border-bottom:1px solid rgba(255,255,255,.08);padding-bottom:16px}.contact-form-topline span{color:var(--accent);font-size:.76rem;text-transform:uppercase;letter-spacing:.16em;font-weight:1000}.contact-form-topline strong{font-size:1.15rem}.plan-picker{border:0;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.plan-picker legend{grid-column:1/-1;color:rgba(247,243,232,.8);font-weight:900;margin-bottom:2px}.plan-pill{position:relative;display:flex;gap:12px;align-items:flex-start;border:1px solid rgba(255,255,255,.12);border-radius:22px;background:rgba(3,7,13,.38);padding:16px;cursor:pointer;transition:transform .22s ease,border-color .22s ease,background .22s ease}.plan-pill:hover,.plan-pill.selected{transform:translateY(-3px);border-color:rgba(141,255,207,.42);background:rgba(141,255,207,.08)}.plan-pill input{accent-color:#8dffcf;margin-top:4px}.plan-pill b{display:block;color:var(--text);margin-bottom:5px}.plan-pill small{color:var(--muted);line-height:1.45}.contact-two{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.contact-command-form label{display:grid;gap:8px;color:rgba(247,243,232,.88);font-weight:900}.contact-command-form input,.contact-command-form select,.contact-command-form textarea{width:100%;border:1px solid rgba(255,255,255,.12);border-radius:18px;background:rgba(0,0,0,.24);color:var(--text);padding:14px 16px;outline:none;transition:border-color .22s ease,background .22s ease,box-shadow .22s ease}.contact-command-form input:focus,.contact-command-form select:focus,.contact-command-form textarea:focus{border-color:rgba(141,255,207,.5);background:rgba(0,0,0,.34);box-shadow:0 0 0 4px rgba(141,255,207,.08)}.contact-submit{width:max-content}.contact-status{min-height:24px;color:#bfffea;font-weight:850}.contact-status.error{color:#ffc5d0}.contact-command-side{padding:18px;display:grid;gap:14px}.contact-side-card{position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.1);border-radius:26px;background:rgba(0,0,0,.22);padding:20px}.contact-side-card.primary{background:linear-gradient(135deg,rgba(141,255,207,.1),rgba(142,183,255,.06))}.contact-side-card.gold{background:linear-gradient(135deg,rgba(240,215,138,.14),rgba(255,255,255,.04));border-color:rgba(240,215,138,.22)}.contact-side-card span{display:grid;place-items:center;width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#06110d;font-weight:1000;margin-bottom:14px}.contact-side-card h3{margin:0 0 8px;font-size:1.2rem}.contact-side-card p{margin:0;color:var(--muted);line-height:1.6}.contact-mini-proof{border:1px dashed rgba(141,255,207,.25);border-radius:22px;padding:16px;display:grid;gap:6px;background:rgba(141,255,207,.06)}.contact-mini-proof b{color:var(--accent)}.contact-mini-proof span{color:rgba(247,243,232,.86)}@media(max-width:920px){.contact-command-grid,.plan-picker,.contact-two{grid-template-columns:1fr}.contact-submit{width:100%;justify-content:center}.contact-command-form{padding:20px}.contact-command-side{padding:14px}}

/* Final reliable effects layer: works on local files and hosted pages. */
.reveal{opacity:1;transform:none;filter:none}
html.effects-ready .reveal{opacity:0;transform:translate3d(0,34px,0) scale(.985);filter:blur(10px);transition:opacity .82s cubic-bezier(.2,.8,.2,1),transform .82s cubic-bezier(.2,.8,.2,1),filter .82s ease;transition-delay:calc(var(--reveal-index,0) * 44ms)}
html.effects-ready .reveal.visible,html.effects-ready .reveal.is-visible{opacity:1;transform:translate3d(0,0,0) scale(1);filter:blur(0)}
.fx-ambient{pointer-events:none;position:fixed;inset:0;z-index:0;overflow:hidden;mix-blend-mode:screen;opacity:.52}.fx-particle{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;background:radial-gradient(circle,rgba(141,255,207,.9),rgba(142,183,255,.35) 38%,transparent 72%);filter:blur(.6px);opacity:.26;animation:fxFloat var(--d) ease-in-out infinite alternate;animation-delay:calc(var(--i) * -.45s)}.fx-cursor{pointer-events:none;position:fixed;left:-180px;top:-180px;width:360px;height:360px;border-radius:50%;background:radial-gradient(circle,rgba(141,255,207,.18),rgba(142,183,255,.08) 42%,transparent 70%);filter:blur(18px);z-index:1}.short-header,.mobile-panel,main,footer{position:relative;z-index:2}.fx-card{position:relative;overflow:hidden;transform:var(--tilt,none);transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.fx-card::after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(320px circle at var(--mx,50%) var(--my,50%),rgba(255,255,255,.16),transparent 48%);opacity:0;transition:opacity .25s ease}.fx-card:hover::after{opacity:1}.fx-card:hover{border-color:rgba(141,255,207,.28)!important;box-shadow:0 34px 120px rgba(0,0,0,.34),0 0 0 1px rgba(141,255,207,.08)!important}.fx-image{transition:transform .7s cubic-bezier(.2,.8,.2,1),filter .7s ease;will-change:transform}.fx-card:hover .fx-image,.capability-card:hover img,.portfolio-showcase-card:hover img,.card:hover img{transform:scale(1.045);filter:saturate(1.14) contrast(1.06) brightness(1.04)}.fx-nav-scrolled{box-shadow:0 26px 90px rgba(0,0,0,.40),0 0 0 1px rgba(141,255,207,.10)!important}.btn-primary,.btn.primary,.contact-submit{position:relative;overflow:hidden}.btn-primary::after,.btn.primary::after,.contact-submit::after{content:"";position:absolute;inset:-30% -90%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.38),transparent);transform:translateX(-130%);animation:fxButtonSheen 5.8s ease-in-out infinite}.rebuild-hero::after,.hero::before{animation:fxHeroGlow 7s ease-in-out infinite alternate}.scroll-progress{position:fixed;left:0;top:0;height:3px;width:0;z-index:9999;background:linear-gradient(90deg,var(--accent,#8dffcf),var(--accent-2,#8eb7ff),var(--accent-3,#ffe7a3));box-shadow:0 0 28px rgba(141,255,207,.38)}@keyframes fxFloat{from{transform:translate3d(-10px,-14px,0) scale(.85)}to{transform:translate3d(20px,22px,0) scale(1.22)}}@keyframes fxButtonSheen{0%,38%{transform:translateX(-130%)}58%,100%{transform:translateX(130%)}}@keyframes fxHeroGlow{from{opacity:.55;filter:saturate(1)}to{opacity:.88;filter:saturate(1.18)}}@media(prefers-reduced-motion:reduce){html.effects-ready .reveal{opacity:1!important;transform:none!important;filter:none!important;transition:none!important}.fx-particle,.btn-primary::after,.btn.primary::after,.contact-submit::after{animation:none!important}.fx-cursor{display:none!important}.fx-card{transform:none!important}.fx-image{transition:none!important}}

/* Elite 2026 visual system pass: sharper command UI without breaking the simple contact flow. */
:root{--elite-cyan:#8dffcf;--elite-blue:#8eb7ff;--elite-gold:#ffe7a3;--elite-violet:#9b7bff;--elite-dark:#05070d}
body.premium-short-page{background:radial-gradient(circle at 15% -5%,rgba(141,255,207,.17),transparent 34%),radial-gradient(circle at 92% 6%,rgba(155,123,255,.18),transparent 36%),linear-gradient(180deg,#05070d 0%,#070b14 38%,#05070d 100%)}
body.premium-short-page::before{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:linear-gradient(rgba(141,255,207,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(142,183,255,.045) 1px,transparent 1px);background-size:88px 88px;mask-image:linear-gradient(180deg,rgba(0,0,0,.85),rgba(0,0,0,.18) 72%,transparent);opacity:.65}
body.premium-short-page::after{content:"";position:fixed;inset:0;z-index:0;pointer-events:none;background:repeating-linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.035) 1px,transparent 1px,transparent 5px);mix-blend-mode:soft-light;opacity:.12}.short-header{top:18px;border-color:rgba(141,255,207,.2)!important;background:linear-gradient(90deg,rgba(5,8,14,.82),rgba(8,12,23,.72))!important;box-shadow:0 18px 80px rgba(0,0,0,.42),0 0 0 1px rgba(142,183,255,.08),inset 0 1px 0 rgba(255,255,255,.08)!important}.short-brand span{letter-spacing:.12em;text-transform:uppercase;font-size:.9rem}.short-nav a{letter-spacing:.08em;text-transform:uppercase;font-weight:850;font-size:.78rem}.theme-toggle{display:none}.rebuild-hero{position:relative;min-height:100vh;overflow:hidden;border-bottom:1px solid rgba(141,255,207,.13);isolation:isolate}.rebuild-hero::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(circle at 15% 42%,rgba(141,255,207,.20),transparent 28%),radial-gradient(circle at 82% 32%,rgba(142,183,255,.20),transparent 34%),linear-gradient(90deg,rgba(5,7,13,.92),rgba(5,7,13,.68) 45%,rgba(5,7,13,.88));animation:elitePulse 8s ease-in-out infinite alternate}.rebuild-hero::after{content:"";position:absolute;inset:0;z-index:2;pointer-events:none;background:linear-gradient(120deg,transparent 0%,rgba(141,255,207,.12) 42%,transparent 54%);transform:translateX(-120%);animation:eliteSweep 8s ease-in-out infinite}.rebuild-hero-media img,.rebuild-hero-media video{filter:brightness(.45) saturate(1.16) contrast(1.08)!important;transform:scale(1.05)}.rebuild-hero-shell{position:relative;z-index:3;width:min(calc(100% - 32px),1280px);min-height:100vh;margin:0 auto;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(380px,.9fr);align-items:center;gap:48px;padding:120px 0 56px}.rebuild-hero-copy{max-width:790px}.rebuild-hero-copy .eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid rgba(141,255,207,.28);background:rgba(141,255,207,.075);border-radius:999px;padding:10px 14px;color:var(--elite-cyan);box-shadow:0 0 40px rgba(141,255,207,.08);letter-spacing:.16em}.rebuild-hero-copy h1{font-size:clamp(3.6rem,7.2vw,7.6rem)!important;line-height:.86!important;letter-spacing:-.075em!important;margin:22px 0!important;max-width:10.8ch;text-wrap:balance;text-shadow:0 2px 0 rgba(255,255,255,.08),0 24px 80px rgba(0,0,0,.45)}.hero-lead{max-width:760px!important;font-size:clamp(1.02rem,1.55vw,1.22rem)!important;line-height:1.75!important;color:rgba(236,248,255,.82)!important}.hero-actions{margin-top:30px}.btn,.btn-primary,.btn.primary{border:1px solid rgba(255,255,255,.14);min-height:54px;padding:0 22px}.btn-primary,.btn.primary{background:linear-gradient(135deg,var(--elite-cyan),var(--elite-blue))!important;color:#031014!important;box-shadow:0 16px 54px rgba(141,255,207,.22),inset 0 1px 0 rgba(255,255,255,.45)}.btn-ghost,.btn.ghost{background:rgba(255,255,255,.055)!important;backdrop-filter:blur(16px);color:#ecf8ff!important}.rebuild-hero-badges{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:26px;max-width:680px}.rebuild-hero-badges span{border:1px solid rgba(141,255,207,.16);background:linear-gradient(135deg,rgba(255,255,255,.08),rgba(255,255,255,.035));border-radius:18px;padding:13px 14px;color:rgba(236,248,255,.82);box-shadow:inset 0 1px 0 rgba(255,255,255,.08)}.rebuild-command-deck{position:relative;border:1px solid rgba(141,255,207,.22)!important;border-radius:38px!important;background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,.045))!important;box-shadow:0 40px 140px rgba(0,0,0,.5),0 0 0 1px rgba(142,183,255,.08),inset 0 1px 0 rgba(255,255,255,.12)!important;overflow:hidden;transform-style:preserve-3d}.rebuild-command-deck::before{content:"SYSTEM READY // PLAN-FIRST INQUIRY";position:absolute;top:18px;left:18px;right:18px;z-index:3;border:1px solid rgba(141,255,207,.18);border-radius:999px;padding:8px 12px;text-align:center;font-size:.68rem;letter-spacing:.18em;font-weight:1000;color:var(--elite-cyan);background:rgba(5,8,14,.68);backdrop-filter:blur(12px)}.rebuild-command-deck img{width:100%;height:auto;border-radius:28px;filter:brightness(.86) saturate(1.08) contrast(1.06);margin-top:46px}.deck-topline{display:none}.deck-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:14px}.deck-metrics div{border:1px solid rgba(141,255,207,.16);border-radius:18px;padding:14px;background:rgba(5,8,14,.55)}.deck-metrics strong{display:block;color:var(--elite-cyan);font-size:1.45rem}.deck-metrics span{color:rgba(236,248,255,.68);font-size:.82rem}.rebuild-quality-strip{position:relative;z-index:3;width:min(calc(100% - 32px),1280px);margin:-48px auto 64px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}.rebuild-quality-strip span{border:1px solid rgba(141,255,207,.13);background:rgba(5,8,14,.72);backdrop-filter:blur(18px);border-radius:18px;padding:15px;color:rgba(236,248,255,.72);font-size:.86rem}.short-section{position:relative}.short-section::before{content:"";position:absolute;left:50%;top:40px;width:min(920px,90vw);height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,rgba(141,255,207,.32),transparent)}.short-section-head h2{font-size:clamp(2.4rem,4.6vw,4.6rem)!important;letter-spacing:-.06em!important;text-wrap:balance}.capability-card,.pricing-card,.portfolio-showcase-card,.contact-command-form,.contact-command-side,.flow-rail article{border-color:rgba(141,255,207,.14)!important;background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,.035))!important;box-shadow:0 30px 110px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.08)!important}.capability-card img,.portfolio-showcase-card img{border-radius:24px;height:320px;object-fit:cover}.capability-card h3,.pricing-card h3,.portfolio-showcase-card h3,.contact-side-card h3{letter-spacing:-.035em}.portfolio-showcase-card{border-radius:38px!important}.portfolio-showcase-card strong{color:var(--elite-cyan)!important}.pricing-card.featured{box-shadow:0 36px 140px rgba(141,255,207,.12),0 30px 110px rgba(0,0,0,.36)!important;border-color:rgba(141,255,207,.28)!important}.plan-tag{color:var(--elite-cyan)!important;background:rgba(141,255,207,.08)!important;border-color:rgba(141,255,207,.22)!important}.flow-rail article span{background:linear-gradient(135deg,var(--elite-cyan),var(--elite-blue))!important;color:#031014!important}.contact-command-section{padding-bottom:120px}.contact-command-grid{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(320px,.88fr);gap:22px}.contact-command-form,.contact-command-side{border-radius:38px!important;padding:30px!important}.contact-command-form input,.contact-command-form select,.contact-command-form textarea{background:rgba(2,6,12,.56)!important;border:1px solid rgba(141,255,207,.14)!important;border-radius:18px!important;color:#ecf8ff!important}.plan-pill{border-color:rgba(141,255,207,.14)!important;background:rgba(255,255,255,.055)!important}.plan-pill.selected{border-color:rgba(141,255,207,.45)!important;background:linear-gradient(135deg,rgba(141,255,207,.14),rgba(142,183,255,.08))!important;box-shadow:0 0 0 1px rgba(141,255,207,.12),0 20px 70px rgba(141,255,207,.1)}@keyframes elitePulse{from{opacity:.72}to{opacity:.95}}@keyframes eliteSweep{0%,48%{transform:translateX(-120%);opacity:0}58%{opacity:.8}72%,100%{transform:translateX(120%);opacity:0}}@media(max-width:980px){.rebuild-hero-shell,.contact-command-grid{grid-template-columns:1fr}.rebuild-command-deck{max-width:720px}.rebuild-quality-strip{grid-template-columns:repeat(2,1fr)}}@media(max-width:620px){.rebuild-hero-shell{width:calc(100% - 20px);padding-top:104px}.rebuild-hero-copy h1{font-size:clamp(3rem,15vw,4.4rem)!important}.rebuild-hero-badges,.rebuild-quality-strip{grid-template-columns:1fr}.capability-card img,.portfolio-showcase-card img{height:240px}.contact-command-form,.contact-command-side{padding:20px!important}}

.contact-email-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px}.contact-email-actions[hidden]{display:none!important}.contact-email-fallback{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(141,255,207,.28);background:rgba(141,255,207,.08);color:var(--elite-cyan,#8dffcf);font-weight:900;text-decoration:none}.contact-email-fallback[hidden]{display:none!important}

/* Deep UI QA pass: fix contact layout validity, remove cramped left-only desktop form, and polish inquiry panel. */
.contact-command-section{position:relative;overflow:hidden;isolation:isolate;background:radial-gradient(circle at 12% 22%,rgba(141,255,207,.11),transparent 32%),radial-gradient(circle at 86% 28%,rgba(142,183,255,.09),transparent 34%),linear-gradient(180deg,rgba(5,8,14,.92),rgba(5,8,14,.98));border-top:1px solid rgba(141,255,207,.1);border-bottom:1px solid rgba(141,255,207,.08)}
.contact-command-section::after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(255,255,255,.028) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,.022) 1px,transparent 1px);background-size:72px 72px;mask-image:radial-gradient(circle at 50% 35%,black,transparent 72%);opacity:.55}
.contact-command-head{max-width:980px;margin-bottom:34px}.contact-command-head h2{max-width:900px}.contact-command-head p{max-width:760px;color:rgba(236,248,255,.72)}
.contact-command-grid{display:grid!important;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr)!important;gap:28px!important;align-items:stretch!important;width:100%!important}
.contact-command-form{display:grid!important;gap:18px!important;align-content:start!important;min-width:0!important;padding:34px!important;border-radius:36px!important;background:linear-gradient(180deg,rgba(255,255,255,.115),rgba(255,255,255,.044))!important;border:1px solid rgba(141,255,207,.20)!important;box-shadow:0 38px 130px rgba(0,0,0,.36),inset 0 1px 0 rgba(255,255,255,.1)!important}
.contact-command-side{display:grid!important;gap:16px!important;align-content:start!important;min-width:0!important;padding:22px!important;border-radius:36px!important;background:linear-gradient(180deg,rgba(255,255,255,.105),rgba(255,255,255,.038))!important;border:1px solid rgba(141,255,207,.17)!important;box-shadow:0 38px 130px rgba(0,0,0,.32),inset 0 1px 0 rgba(255,255,255,.08)!important}
.contact-side-visual{margin:0;border:1px solid rgba(141,255,207,.16);border-radius:26px;overflow:hidden;background:rgba(2,6,12,.48);box-shadow:0 24px 80px rgba(0,0,0,.28)}
.contact-side-visual img{display:block;width:100%;height:230px;object-fit:cover;filter:brightness(.92) saturate(1.08) contrast(1.06)}
.contact-form-topline{display:flex;align-items:center;justify-content:space-between;gap:16px;border-bottom:1px solid rgba(141,255,207,.12);padding-bottom:16px;margin-bottom:2px}.contact-form-topline span{color:var(--elite-cyan,#8dffcf);text-transform:uppercase;letter-spacing:.16em;font-size:.75rem;font-weight:1000}.contact-form-topline strong{font-size:1.08rem}
.plan-picker{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;border:0!important;padding:0!important;margin:0!important}.plan-picker legend{grid-column:1/-1;color:rgba(236,248,255,.86);font-weight:1000;margin-bottom:4px}.plan-pill{position:relative;min-height:132px;padding:24px 18px 18px!important;display:flex!important;align-items:end!important;gap:14px!important;overflow:hidden}.plan-pill input{position:absolute!important;inset:18px auto auto 18px!important;width:42px!important;height:42px!important;accent-color:var(--elite-cyan,#8dffcf)!important}.plan-pill b{display:block;font-size:.96rem;margin-bottom:6px}.plan-pill small{display:block;color:rgba(236,248,255,.68);line-height:1.45}
.contact-two{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:16px!important}.contact-command-form label{display:grid!important;gap:8px!important;color:rgba(236,248,255,.86);font-weight:900}.contact-command-form input,.contact-command-form select,.contact-command-form textarea{width:100%!important;min-height:54px!important;padding:14px 16px!important;font:inherit!important}.contact-command-form textarea{min-height:170px!important;resize:vertical}.contact-submit{justify-self:start!important;min-width:210px!important}.contact-status{min-height:24px;color:var(--elite-cyan,#8dffcf);font-weight:850}.contact-status.error{color:#ffc0c0}.contact-side-card,.contact-mini-proof{border:1px solid rgba(141,255,207,.13);border-radius:24px;background:rgba(2,6,12,.42);padding:20px}.contact-side-card span{display:grid;place-items:center;width:38px;height:38px;border-radius:14px;margin-bottom:14px;background:linear-gradient(135deg,var(--elite-cyan,#8dffcf),var(--elite-blue,#8eb7ff));color:#031014;font-weight:1000}.contact-side-card h3{margin:0 0 8px;font-size:1.2rem}.contact-side-card p{margin:0;color:rgba(236,248,255,.68);line-height:1.55}.contact-side-card.primary{background:linear-gradient(135deg,rgba(141,255,207,.12),rgba(142,183,255,.055))}.contact-side-card.gold{background:linear-gradient(135deg,rgba(255,231,163,.10),rgba(141,255,207,.05))}.contact-mini-proof b{display:block;color:var(--elite-cyan,#8dffcf);text-transform:uppercase;letter-spacing:.12em;font-size:.76rem;margin-bottom:8px}.contact-mini-proof span{color:rgba(236,248,255,.82);font-weight:900;word-break:break-word}
@media(max-width:980px){.contact-command-grid{grid-template-columns:1fr!important}.contact-command-side{grid-template-columns:1fr 1fr}.contact-side-visual,.contact-mini-proof{grid-column:1/-1}}
@media(max-width:640px){.contact-command-section{padding-inline:0!important}.contact-command-grid,.plan-picker,.contact-two,.contact-command-side{grid-template-columns:1fr!important}.contact-command-form,.contact-command-side{padding:20px!important;border-radius:28px!important}.plan-pill{min-height:112px}.contact-side-visual img{height:210px}.contact-submit{width:100%!important}.contact-form-topline{align-items:flex-start;flex-direction:column}}
.contact-side-visual{background-image:linear-gradient(180deg,rgba(2,6,12,.15),rgba(2,6,12,.35)),url('../img/generated/hamzah-plan-inquiry-system-final.png');background-size:cover;background-position:center;min-height:230px}.contact-side-visual img{min-height:230px}@media(max-width:640px){.contact-side-visual{min-height:210px}.contact-side-visual img{min-height:210px}}

/* Deep UI QA pass 2: no rotating command aura, no deck tilt, cleaner Gmail-first contact flow. */
.rebuild-command-deck,
.rebuild-command-deck.fx-card{transform:none!important;transition:border-color .25s ease,box-shadow .25s ease!important;will-change:auto!important}
.rebuild-command-deck::before{content:""!important;position:absolute!important;inset:0!important;background:radial-gradient(circle at 50% 0%,rgba(141,255,207,.12),transparent 38%),linear-gradient(135deg,rgba(141,255,207,.06),transparent 32%,rgba(142,183,255,.05))!important;animation:none!important;opacity:.9!important;transform:none!important}
.rebuild-command-deck::after{content:"";position:absolute;inset:16px;border-radius:28px;pointer-events:none;border:1px solid rgba(141,255,207,.08);background:linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(180deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:34px 34px;opacity:.35;z-index:0}.rebuild-command-deck>*{position:relative;z-index:1}.contact-mini-proof{display:none!important}.contact-email-fallback{background:linear-gradient(135deg,var(--elite-cyan,#8dffcf),var(--elite-blue,#8eb7ff))!important;color:#031014!important;border:0!important;box-shadow:0 18px 60px rgba(141,255,207,.2)}
/* Remove remaining command deck circle/aura completely; keep a clean premium static preview. */
.rebuild-command-deck::before,.rebuild-command-deck::after{display:none!important;content:none!important;background:none!important;animation:none!important}
.rebuild-command-deck img{filter:brightness(.92) saturate(1.07) contrast(1.05)!important;box-shadow:0 26px 80px rgba(0,0,0,.34)!important}

/* Deep UI QA pass 3: cleaner full-width top bar and no customer email field in contact form. */
.short-header{width:min(calc(100% - 28px),1260px)!important;max-width:1260px!important;margin-top:12px!important;grid-template-columns:auto minmax(0,1fr) auto!important}
.short-actions .theme-toggle{display:none!important}.short-nav{gap:10px!important}.short-nav a{padding-inline:12px!important}.short-actions{gap:10px!important}.short-brand{min-width:170px}.contact-command-form > label{max-width:none}.contact-two{display:none!important}
@media(max-width:980px){.short-brand{min-width:0}.short-header{width:calc(100% - 18px)!important}.short-nav{display:none!important}}

/* Final header refinement. */
.short-header{
  width:min(calc(100% - 28px),1240px)!important;
  max-width:1240px!important;
  margin:12px auto 0!important;
  padding:12px 14px!important;
  grid-template-columns:auto minmax(360px,1fr) auto!important;
  gap:18px!important;
  border-radius:28px!important;
  background:rgba(7,12,22,.86)!important;
  border-color:rgba(141,255,207,.18)!important;
  box-shadow:0 22px 80px rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.short-brand{min-width:170px!important}.short-nav{gap:8px!important;justify-content:center!important}.short-nav a{padding:10px 12px!important;white-space:nowrap!important}.short-actions{justify-content:flex-end!important}.short-actions .theme-toggle{display:none!important}.short-actions .btn-primary{min-width:88px!important;justify-content:center!important}
.pricing-card h3{font-size:clamp(2.4rem,4vw,3.4rem)!important;color:#f7fff8!important}.plan-picker small{color:rgba(247,251,255,.72)!important}
@media(max-width:980px){.short-header{grid-template-columns:auto auto!important;width:calc(100% - 18px)!important;border-radius:22px!important}.short-brand{min-width:0!important}.short-nav{display:none!important}.short-actions .btn-primary{display:inline-flex!important}.menu-toggle{display:inline-grid!important;place-items:center!important}}
@media(max-width:520px){.short-header{padding:10px 12px!important}.short-actions .btn-primary{padding:10px 14px!important}.short-brand span{font-size:.9rem!important}}

/* INR pricing final pass. */
.pricing-card h3{letter-spacing:-.06em!important}.plan-picker small{font-weight:850!important}


/* Final UI hotfixes: header fit + plan selection readability */
.short-header{
  width:min(calc(100% - 34px),1180px)!important;
  max-width:1180px!important;
  padding:12px 14px!important;
  gap:14px!important;
  grid-template-columns:auto minmax(0,1fr) auto!important;
}
.short-brand{min-width:140px!important;gap:10px!important}
.short-brand span{font-size:1rem!important;letter-spacing:.02em!important}
.short-nav{display:flex!important;justify-content:center!important;gap:2px!important;min-width:0!important;flex-wrap:nowrap!important;overflow:hidden!important}
.short-nav a{padding:10px 10px!important;font-size:.84rem!important;letter-spacing:.03em!important;white-space:nowrap!important;min-width:0!important}
.short-actions{gap:8px!important}
.short-actions .btn-primary{min-width:82px!important;padding:0 16px!important}
.menu-toggle{margin-left:0!important}

.contact-command-grid{grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr)!important;gap:24px!important}
.contact-command-form{padding:28px!important}
.plan-picker{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
.plan-pill{
  display:block!important;
  min-height:126px!important;
  padding:20px 16px 18px 88px!important;
  border-radius:24px!important;
}
.plan-pill input{
  position:absolute!important;
  top:20px!important;
  left:20px!important;
  width:46px!important;
  height:46px!important;
  margin:0!important;
}
.plan-pill span{display:block!important;min-width:0!important}
.plan-pill b{display:block!important;font-size:1.02rem!important;line-height:1.2!important;margin:8px 0 6px!important}
.plan-pill small{display:block!important;font-size:.9rem!important;line-height:1.35!important;white-space:normal!important}
.contact-command-form select{padding-right:46px!important;background-position:right 16px center!important}

@media (max-width:1120px){
  .short-header{width:calc(100% - 24px)!important;gap:10px!important}
  .short-nav a{padding:9px 8px!important;font-size:.8rem!important}
  .short-brand{min-width:124px!important}
}
@media (max-width:980px){
  .short-nav{display:none!important}
  .short-header{grid-template-columns:auto auto!important;width:calc(100% - 18px)!important}
  .short-actions .btn-primary{display:inline-flex!important}
}
@media (max-width:640px){
  .plan-picker{grid-template-columns:1fr!important}
  .plan-pill{min-height:110px!important;padding:18px 16px 16px 82px!important}
  .plan-pill input{top:18px!important;left:18px!important;width:42px!important;height:42px!important}
}

/* FINAL TOPBAR LOCK: one clean, non-clipping header system. */
.premium-short-page .short-header{
  position:sticky!important;
  top:12px!important;
  left:auto!important;
  right:auto!important;
  width:min(1060px,calc(100% - 32px))!important;
  max-width:1060px!important;
  min-height:58px!important;
  height:58px!important;
  margin:12px auto 0!important;
  padding:7px 10px!important;
  display:grid!important;
  grid-template-columns:minmax(160px,max-content) minmax(0,1fr) minmax(96px,max-content)!important;
  align-items:center!important;
  gap:12px!important;
  overflow:visible!important;
  border-radius:24px!important;
  background:rgba(6,11,20,.91)!important;
  border:1px solid rgba(141,255,207,.16)!important;
  box-shadow:0 18px 70px rgba(0,0,0,.42),inset 0 1px 0 rgba(255,255,255,.07)!important;
  backdrop-filter:blur(22px)!important;
}
.premium-short-page .short-header::before{display:none!important}
.premium-short-page .short-brand{
  min-width:0!important;
  width:max-content!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  overflow:visible!important;
}
.premium-short-page .short-brand img{width:38px!important;height:38px!important;flex:0 0 38px!important}
.premium-short-page .short-brand span{font-size:.98rem!important;line-height:1!important;letter-spacing:.08em!important;white-space:nowrap!important}
.premium-short-page .short-nav{
  justify-self:center!important;
  display:flex!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  min-width:0!important;
  overflow:visible!important;
}
.premium-short-page .short-nav a{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:36px!important;
  height:36px!important;
  padding:0 10px!important;
  border-radius:999px!important;
  line-height:1!important;
  font-size:.78rem!important;
  font-weight:950!important;
  letter-spacing:.105em!important;
  white-space:nowrap!important;
}
.premium-short-page .short-actions{
  justify-self:end!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  min-width:0!important;
  overflow:visible!important;
}
.premium-short-page .short-actions .btn,
.premium-short-page .short-actions .btn-primary{
  height:40px!important;
  min-height:40px!important;
  max-height:40px!important;
  padding:0 22px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:999px!important;
  line-height:1!important;
  font-size:.92rem!important;
  font-weight:950!important;
  transform:none!important;
  white-space:nowrap!important;
}
.premium-short-page .short-actions .btn:hover{transform:none!important}
.premium-short-page .menu-toggle{width:40px!important;height:40px!important;min-height:40px!important;max-height:40px!important;padding:0!important;align-items:center!important;justify-content:center!important}

/* FINAL PLAN CARD LOCK: radio cannot overlap title/price. */
.premium-short-page .plan-picker{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important;overflow:visible!important}
.premium-short-page .plan-pill{
  position:relative!important;
  display:grid!important;
  grid-template-columns:54px minmax(0,1fr)!important;
  align-items:center!important;
  gap:14px!important;
  min-height:118px!important;
  padding:18px!important;
  overflow:visible!important;
}
.premium-short-page .plan-pill input{
  position:static!important;
  width:44px!important;
  height:44px!important;
  margin:0!important;
  grid-column:1!important;
  grid-row:1!important;
}
.premium-short-page .plan-pill > span{grid-column:2!important;display:block!important;min-width:0!important;overflow:visible!important}
.premium-short-page .plan-pill b{display:block!important;margin:0 0 7px!important;font-size:1.02rem!important;line-height:1.18!important;white-space:normal!important;overflow:visible!important}
.premium-short-page .plan-pill small{display:block!important;font-size:.88rem!important;line-height:1.38!important;white-space:normal!important;overflow:visible!important;text-overflow:clip!important}

@media (max-width:1120px){
  .premium-short-page .short-header{width:calc(100% - 24px)!important;grid-template-columns:minmax(136px,max-content) minmax(0,1fr) max-content!important;gap:8px!important}
  .premium-short-page .short-nav a{padding:0 7px!important;font-size:.72rem!important;letter-spacing:.08em!important}
  .premium-short-page .short-actions .btn-primary{padding:0 18px!important}
}
@media (max-width:900px){
  .premium-short-page .short-header{height:56px!important;min-height:56px!important;grid-template-columns:1fr auto!important;width:calc(100% - 18px)!important;border-radius:22px!important}
  .premium-short-page .short-nav{display:none!important}
  .premium-short-page .short-actions .btn-primary{display:inline-flex!important;height:38px!important;min-height:38px!important;max-height:38px!important;padding:0 16px!important}
  .premium-short-page .menu-toggle{display:inline-flex!important;height:38px!important;min-height:38px!important;max-height:38px!important}
}
@media (max-width:640px){
  .premium-short-page .plan-picker{grid-template-columns:1fr!important}
  .premium-short-page .plan-pill{grid-template-columns:48px minmax(0,1fr)!important;min-height:104px!important;padding:16px!important}
  .premium-short-page .plan-pill input{width:40px!important;height:40px!important}
}

/* FINAL MOBILE STACKING FIX: header must always paint above hero/main layers. */
.premium-short-page .short-header,
.short-header[data-header]{
  z-index:1200!important;
  isolation:isolate!important;
  overflow:visible!important;
}
.premium-short-page .short-header *{position:relative;z-index:2!important}
.premium-short-page main{position:relative!important;z-index:1!important}
.premium-short-page .rebuild-hero{position:relative!important;z-index:1!important;margin-top:-70px!important;padding-top:164px!important}
@media(max-width:900px){
  .premium-short-page .rebuild-hero{margin-top:-68px!important;padding-top:148px!important}
  .premium-short-page .short-header{z-index:1200!important;box-shadow:0 18px 70px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.08)!important}
}

/* Phone-safe text and card overflow lock. */
.premium-short-page h1,.premium-short-page h2,.premium-short-page h3,.premium-short-page p,.premium-short-page a,.premium-short-page span,.premium-short-page b,.premium-short-page small{overflow-wrap:anywhere}
.premium-short-page .plan-pill b,.premium-short-page .plan-pill small,.premium-short-page .short-brand span{overflow-wrap:normal!important}
.premium-short-page .contact-command-form,.premium-short-page .contact-command-side,.premium-short-page .pricing-card,.premium-short-page .portfolio-showcase-card,.premium-short-page .capability-card{overflow:visible!important}

/* FINAL HORIZONTAL OVERFLOW LOCK: hero media cannot exceed viewport. */
.premium-short-page{overflow-x:hidden!important}
.premium-short-page .rebuild-hero-media{left:0!important;right:0!important;width:100%!important;max-width:100vw!important;overflow:hidden!important}
.premium-short-page .rebuild-hero-media > img,
.premium-short-page .rebuild-hero-media > video{left:0!important;right:0!important;width:100%!important;max-width:100%!important;min-width:0!important;transform:none!important;object-fit:cover!important}

/* FINAL PAGE WIDTH LOCK: remove pseudo-element horizontal scroll sources. */
html,.premium-short-page{width:100%!important;max-width:100%!important;overflow-x:hidden!important}
.premium-short-page .contact-command-section::before{left:0!important;right:0!important;width:100%!important;inset:40px 0 auto 0!important}
.premium-short-page .contact-command-section::after{left:0!important;right:0!important;width:100%!important}
.premium-short-page .rebuild-hero::before,.premium-short-page .rebuild-hero::after{left:0!important;right:0!important;width:100%!important;max-width:100%!important}

/* FINAL PHONE HEADER FLEX FIX: keep Start and menu on one row. */
.premium-short-page .short-actions{flex-wrap:nowrap!important;width:max-content!important;max-width:max-content!important;align-self:center!important}
.premium-short-page .short-brand{align-self:center!important}.premium-short-page .short-nav{align-self:center!important}
.premium-short-page .menu-toggle{flex:0 0 40px!important}
@media(max-width:900px){
  .premium-short-page .short-actions .btn-primary{width:auto!important;min-width:76px!important;max-width:76px!important;padding:0 14px!important;flex:0 0 76px!important}
  .premium-short-page .short-actions{gap:6px!important}
}


/* ULTRA FINAL A-Z RESPONSIVE UI LOCK
   Purpose: remove header clipping, action wrapping, horizontal overflow, and unstable reveal states on all devices. */
html,
body,
.premium-short-page{
  width:100%!important;
  max-width:100%!important;
  overflow-x:hidden!important;
}
.premium-short-page *{
  min-width:0;
}
.premium-short-page .page-loader{display:none!important;pointer-events:none!important;opacity:0!important;visibility:hidden!important}
.premium-short-page .short-header[data-header],
.premium-short-page .short-header{
  position:sticky!important;
  top:12px!important;
  z-index:5000!important;
  isolation:isolate!important;
  width:min(calc(100% - 24px),1160px)!important;
  max-width:1160px!important;
  min-height:58px!important;
  margin:12px auto 0!important;
  padding:8px 10px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  overflow:visible!important;
  border-radius:999px!important;
  border:1px solid rgba(141,255,207,.18)!important;
  background:rgba(5,8,14,.86)!important;
  backdrop-filter:blur(22px)!important;
  box-shadow:0 20px 78px rgba(0,0,0,.48),inset 0 1px 0 rgba(255,255,255,.08)!important;
}
.premium-short-page .short-header::before{display:none!important;content:none!important}
.premium-short-page .short-header > *{position:relative!important;z-index:2!important}
.premium-short-page .short-brand{
  flex:0 0 auto!important;
  min-width:132px!important;
  max-width:168px!important;
  height:42px!important;
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
  overflow:visible!important;
}
.premium-short-page .short-brand img{
  flex:0 0 38px!important;
  width:38px!important;
  height:38px!important;
  object-fit:contain!important;
}
.premium-short-page .short-brand span{
  display:block!important;
  font-size:.98rem!important;
  line-height:1!important;
  letter-spacing:.04em!important;
  white-space:nowrap!important;
  overflow:visible!important;
}
.premium-short-page .short-nav{
  flex:1 1 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:2px!important;
  min-width:0!important;
  max-width:100%!important;
  overflow:hidden!important;
  flex-wrap:nowrap!important;
}
.premium-short-page .short-nav a{
  flex:0 1 auto!important;
  padding:9px 9px!important;
  font-size:.78rem!important;
  line-height:1!important;
  letter-spacing:.08em!important;
  white-space:nowrap!important;
  border-radius:999px!important;
}
.premium-short-page .short-actions{
  flex:0 0 auto!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:6px!important;
  width:auto!important;
  max-width:none!important;
  flex-wrap:nowrap!important;
  overflow:visible!important;
}
.premium-short-page .short-actions .btn-primary{
  flex:0 0 auto!important;
  width:auto!important;
  min-width:76px!important;
  max-width:90px!important;
  min-height:42px!important;
  height:42px!important;
  padding:0 17px!important;
  line-height:1!important;
  white-space:nowrap!important;
  border-radius:999px!important;
}
.premium-short-page .menu-toggle{
  flex:0 0 42px!important;
  width:42px!important;
  height:42px!important;
  min-width:42px!important;
  min-height:42px!important;
  display:none!important;
  place-items:center!important;
  padding:0!important;
  margin:0!important;
  overflow:hidden!important;
}
.premium-short-page .menu-toggle span{
  display:block!important;
  width:18px!important;
  height:2px!important;
  margin:3px auto!important;
}
.premium-short-page main{position:relative!important;z-index:1!important;overflow:hidden!important}
.premium-short-page .rebuild-hero{
  position:relative!important;
  z-index:1!important;
  margin-top:-74px!important;
  padding-top:160px!important;
  min-height:min(900px,100svh)!important;
  overflow:hidden!important;
}
.premium-short-page .rebuild-hero-media,
.premium-short-page .rebuild-hero::before,
.premium-short-page .rebuild-hero::after,
.premium-short-page .contact-command-section::before,
.premium-short-page .contact-command-section::after{
  left:0!important;
  right:0!important;
  width:100%!important;
  max-width:100%!important;
  overflow:hidden!important;
}
.premium-short-page video{display:none!important;visibility:hidden!important;pointer-events:none!important}
.premium-short-page .reveal,
.premium-short-page .reveal.visible,
html.effects-ready .premium-short-page .reveal,
html.effects-ready .premium-short-page .reveal.visible,
html.effects-ready .premium-short-page .reveal.is-visible{
  opacity:1!important;
  transform:none!important;
  filter:none!important;
  transition:none!important;
}
.premium-short-page h1,
.premium-short-page h2,
.premium-short-page h3,
.premium-short-page p,
.premium-short-page a,
.premium-short-page span,
.premium-short-page b,
.premium-short-page small,
.premium-short-page label,
.premium-short-page textarea,
.premium-short-page input,
.premium-short-page select{
  overflow-wrap:anywhere;
}
.premium-short-page .short-brand span,
.premium-short-page .plan-pill b,
.premium-short-page .plan-pill small{overflow-wrap:normal!important}
.premium-short-page .plan-picker{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:14px!important;
}
.premium-short-page .plan-pill{
  display:grid!important;
  grid-template-columns:52px minmax(0,1fr)!important;
  align-items:center!important;
  gap:14px!important;
  min-height:118px!important;
  padding:18px!important;
  overflow:hidden!important;
}
.premium-short-page .plan-pill input{
  position:static!important;
  width:46px!important;
  height:46px!important;
  margin:0!important;
  grid-column:1!important;
  align-self:center!important;
  justify-self:center!important;
}
.premium-short-page .plan-pill span{grid-column:2!important;display:block!important;min-width:0!important}
.premium-short-page .plan-pill b{display:block!important;line-height:1.18!important;margin:0 0 6px!important;font-size:1rem!important}
.premium-short-page .plan-pill small{display:block!important;line-height:1.35!important;font-size:.88rem!important;white-space:normal!important}
.premium-short-page .contact-command-form input,
.premium-short-page .contact-command-form select,
.premium-short-page .contact-command-form textarea{max-width:100%!important}

@media(max-width:1180px){
  .premium-short-page .short-nav{display:none!important}
  .premium-short-page .short-header{width:calc(100% - 20px)!important;max-width:820px!important;min-height:58px!important;border-radius:24px!important}
  .premium-short-page .menu-toggle{display:inline-grid!important}
  .premium-short-page .short-actions .btn-primary{display:inline-flex!important}
}
@media(max-width:700px){
  .premium-short-page .short-header{top:8px!important;width:calc(100% - 14px)!important;margin-top:8px!important;padding:7px 8px!important;gap:8px!important;min-height:56px!important;border-radius:20px!important}
  .premium-short-page .short-brand{min-width:0!important;max-width:150px!important;height:40px!important;gap:8px!important}
  .premium-short-page .short-brand img{width:36px!important;height:36px!important;flex-basis:36px!important}
  .premium-short-page .short-brand span{font-size:.9rem!important;letter-spacing:.04em!important}
  .premium-short-page .short-actions{gap:6px!important}
  .premium-short-page .short-actions .btn-primary{min-width:68px!important;max-width:72px!important;height:40px!important;min-height:40px!important;padding:0 12px!important;font-size:.86rem!important}
  .premium-short-page .menu-toggle{flex-basis:40px!important;width:40px!important;height:40px!important;min-width:40px!important;min-height:40px!important}
  .premium-short-page .rebuild-hero{margin-top:-64px!important;padding-top:134px!important;min-height:auto!important;padding-bottom:58px!important}
  .premium-short-page .rebuild-hero-copy h1{font-size:clamp(2.85rem,14vw,4.2rem)!important;line-height:.9!important;letter-spacing:-.075em!important}
  .premium-short-page .rebuild-hero-copy .eyebrow{font-size:.68rem!important;letter-spacing:.12em!important}
  .premium-short-page .plan-picker{grid-template-columns:1fr!important}
  .premium-short-page .plan-pill{grid-template-columns:48px minmax(0,1fr)!important;min-height:104px!important;padding:16px!important}
  .premium-short-page .plan-pill input{width:42px!important;height:42px!important}
}

/* ULTRA FINAL HERO COMPACTNESS TUNE: keeps header safe while removing excess top empty space. */
.premium-short-page .rebuild-hero{padding-top:132px!important}
@media(max-width:700px){.premium-short-page .rebuild-hero{padding-top:108px!important}}

/* ULTRA FINAL PHONE HERO TUNE: remove wasted mobile top empty space without touching header safety. */
@media(max-width:700px){.premium-short-page .rebuild-hero{padding-top:56px!important}}

/* ULTRA FINAL CONTACT RESPONSIVE FIX: contact form and side cards must stack, never overlap, on tablet/phone. */
@media(max-width:980px){
  .premium-short-page .contact-command-grid{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:18px!important;
    align-items:start!important;
  }
  .premium-short-page .contact-command-form,
  .premium-short-page .contact-command-side{
    width:100%!important;
    max-width:100%!important;
    grid-column:1 / -1!important;
    position:relative!important;
    inset:auto!important;
  }
  .premium-short-page .contact-command-side{
    display:grid!important;
    grid-template-columns:1fr!important;
  }
}
@media(max-width:700px){
  .premium-short-page .contact-command-section{overflow:hidden!important}
  .premium-short-page .contact-command-grid{gap:16px!important}
  .premium-short-page .contact-command-form,
  .premium-short-page .contact-command-side{padding:18px!important;border-radius:26px!important}
}

/* ULTRA FINAL SCROLL FIX: lock horizontal overflow only, never vertical page flow. */
.premium-short-page main{overflow-x:hidden!important;overflow-y:visible!important}
.premium-short-page .contact-command-section{overflow-x:hidden!important;overflow-y:visible!important}