:root {
  --paper: #f2f0ea;
  --ink: #111111;
  --muted: #66645f;
  --line: rgba(17, 17, 17, 0.18);
  --accent: #2f4bff;
  --accent-soft: #dfe4ff;
  --white: #ffffff;
  --max: 1480px;
  --gutter: clamp(18px, 3vw, 48px);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  --mono: 'SFMono-Regular', Consolas, 'Liberation Mono', monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--sans);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
::selection { background: var(--accent); color: #fff; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
img { max-width: 100%; display: block; }
button, input, textarea, select { font: inherit; }
button { cursor: pointer; }

.skip-link {
  position: fixed; left: 12px; top: 12px; z-index: 999;
  transform: translateY(-150%); background: var(--ink); color: #fff;
  padding: 10px 14px; border-radius: 2px;
}
.skip-link:focus { transform: translateY(0); }

.site-shell { width: min(100%, var(--max)); margin-inline: auto; padding-inline: var(--gutter); }

.site-header {
  position: sticky; top: 0; z-index: 40;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(14px);
  border-bottom: 1px solid var(--line);
}
.header-inner {
  min-height: 72px; display: grid; grid-template-columns: 1fr auto 1fr;
  align-items: center; gap: 24px;
}
.brand {
  font-size: 14px; letter-spacing: -0.02em; font-weight: 700; text-decoration: none;
  display: inline-flex; align-items: center; gap: 10px;
}
.brand-mark {
  width: 28px; height: 28px; display: grid; place-items: center;
  background: var(--ink); color: var(--paper); font-size: 11px; letter-spacing: .04em;
}
.primary-nav { display: flex; gap: 28px; justify-content: center; }
.primary-nav a, .header-cta {
  font-size: 13px; text-decoration: none; position: relative;
}
.primary-nav a::after {
  content: ''; position: absolute; left: 0; right: 100%; bottom: -6px;
  height: 1px; background: currentColor; transition: right .2s ease;
}
.primary-nav a:hover::after, .primary-nav a:focus-visible::after { right: 0; }
.header-actions { justify-self: end; display: flex; gap: 12px; align-items: center; }
.header-cta {
  border: 1px solid var(--ink); padding: 10px 14px; transition: .2s ease;
}
.header-cta:hover, .header-cta:focus-visible { background: var(--ink); color: var(--paper); }
.nav-toggle { display: none; border: 0; background: transparent; padding: 8px; }

.hero { padding: clamp(70px, 11vw, 165px) 0 70px; border-bottom: 1px solid var(--line); }
.kicker, .eyebrow {
  margin: 0 0 18px; font: 600 11px/1.4 var(--mono); letter-spacing: .12em; text-transform: uppercase;
}
.hero h1 {
  margin: 0; max-width: 1220px; font-size: clamp(58px, 10.8vw, 162px);
  line-height: .84; letter-spacing: -.075em; font-weight: 700;
}
.hero h1 .serif { font-family: var(--serif); font-weight: 400; font-style: italic; letter-spacing: -.06em; }
.hero-bottom {
  margin-top: clamp(46px, 7vw, 100px); display: grid; grid-template-columns: 1.3fr .7fr;
  gap: 60px; align-items: end;
}
.hero-copy { max-width: 760px; font-size: clamp(20px, 2.1vw, 32px); line-height: 1.16; letter-spacing: -.03em; margin: 0; }
.hero-meta { display: grid; grid-template-columns: repeat(2, 1fr); gap: 24px; }
.meta-block { border-top: 1px solid var(--ink); padding-top: 10px; }
.meta-block span { display: block; font: 600 10px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .1em; color: var(--muted); }
.meta-block strong { display: block; margin-top: 6px; font-size: 14px; font-weight: 500; }

.marquee { overflow: hidden; border-bottom: 1px solid var(--line); }
.marquee-track { display: flex; width: max-content; animation: marquee 28s linear infinite; }
.marquee-item { padding: 14px 24px; font: 600 11px/1 var(--mono); letter-spacing: .08em; text-transform: uppercase; border-right: 1px solid var(--line); }
@keyframes marquee { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .marquee-track { animation: none; } * { transition-duration: 0.01ms !important; animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; } }

.section { padding: clamp(72px, 9vw, 140px) 0; border-bottom: 1px solid var(--line); }
.section-head { display: grid; grid-template-columns: 220px 1fr; gap: 40px; margin-bottom: clamp(44px, 6vw, 84px); }
.section-head h2 {
  margin: 0; max-width: 920px; font-size: clamp(44px, 6vw, 94px); line-height: .94; letter-spacing: -.06em; font-weight: 600;
}
.section-head p { max-width: 720px; font-size: 18px; line-height: 1.5; color: var(--muted); margin: 22px 0 0; }

.project-list { border-top: 1px solid var(--ink); }
.project-row {
  display: grid; grid-template-columns: 90px minmax(0, 1fr) 1.4fr 130px;
  gap: 26px; align-items: start; padding: 28px 0; border-bottom: 1px solid var(--line);
  text-decoration: none; transition: background .2s ease, padding .2s ease;
}
.project-row:hover, .project-row:focus-visible { background: #e9e7e1; padding-inline: 14px; }
.project-no { font: 600 11px/1.4 var(--mono); color: var(--muted); }
.project-title { font-size: clamp(27px, 3.1vw, 48px); letter-spacing: -.04em; line-height: 1; }
.project-desc { color: var(--muted); font-size: 15px; line-height: 1.5; max-width: 620px; }
.project-tag { justify-self: end; font: 600 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }

.featured-case { display: grid; grid-template-columns: 1.1fr .9fr; gap: clamp(30px, 6vw, 90px); align-items: start; }
.case-frame {
  background: #101010; color: #fff; min-height: clamp(460px, 60vw, 760px); padding: clamp(24px, 4vw, 52px);
  display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; position: relative;
}
.case-frame::before {
  content: ''; position: absolute; width: 420px; height: 420px; border: 1px solid rgba(255,255,255,.2); border-radius: 50%; right: -160px; top: 70px;
}
.case-frame::after {
  content: ''; position: absolute; width: 170px; height: 170px; background: #fff; right: 12%; bottom: 18%; transform: rotate(11deg);
}
.case-topline { display: flex; justify-content: space-between; font: 600 10px/1 var(--mono); letter-spacing: .1em; text-transform: uppercase; position: relative; z-index: 2; }
.case-wordmark { font-size: clamp(82px, 12vw, 190px); line-height: .75; letter-spacing: -.09em; font-weight: 800; position: relative; z-index: 2; }
.case-wordmark small { display: block; font: 400 13px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; margin-top: 30px; }
.case-copy h3 { margin: 0 0 18px; font-size: clamp(38px, 4.6vw, 72px); line-height: .96; letter-spacing: -.05em; }
.case-copy p { color: var(--muted); font-size: 17px; line-height: 1.6; max-width: 620px; }
.case-stats { display: grid; grid-template-columns: repeat(2, 1fr); margin-top: 44px; border-top: 1px solid var(--ink); }
.case-stat { padding: 18px 0 28px; border-bottom: 1px solid var(--line); }
.case-stat:nth-child(odd) { padding-right: 24px; }
.case-stat:nth-child(even) { border-left: 1px solid var(--line); padding-left: 24px; }
.case-stat strong { display: block; font-size: 29px; letter-spacing: -.03em; }
.case-stat span { font: 500 10px/1.4 var(--mono); color: var(--muted); text-transform: uppercase; letter-spacing: .08em; }
.text-link { display: inline-flex; align-items: center; gap: 12px; margin-top: 30px; font-weight: 600; text-decoration: none; border-bottom: 1px solid var(--ink); padding-bottom: 4px; }
.text-link::after { content: '↗'; }

.services-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.service-card { min-height: 340px; padding: 24px 24px 30px 0; border-bottom: 1px solid var(--line); }
.service-card + .service-card { border-left: 1px solid var(--line); padding-left: 24px; }
.service-card .num { font: 600 11px/1 var(--mono); color: var(--muted); }
.service-card h3 { font-size: clamp(28px, 3vw, 45px); line-height: 1; letter-spacing: -.04em; margin: 70px 0 18px; }
.service-card p { color: var(--muted); line-height: 1.55; margin: 0; }
.service-card ul { list-style: none; padding: 0; margin: 28px 0 0; border-top: 1px solid var(--line); }
.service-card li { font: 500 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; padding: 10px 0; border-bottom: 1px solid var(--line); }

.process { counter-reset: step; border-top: 1px solid var(--ink); }
.process-step { display: grid; grid-template-columns: 90px 1fr 1fr; gap: 26px; padding: 28px 0 34px; border-bottom: 1px solid var(--line); }
.process-step::before { counter-increment: step; content: '0' counter(step); font: 600 11px/1.4 var(--mono); color: var(--muted); }
.process-step h3 { margin: 0; font-size: clamp(26px, 3vw, 46px); letter-spacing: -.04em; }
.process-step p { margin: 0; color: var(--muted); line-height: 1.6; max-width: 650px; }

.quote-band { background: var(--ink); color: var(--paper); padding: clamp(70px, 9vw, 130px) 0; }
.quote-band blockquote { margin: 0; max-width: 1260px; font: 400 clamp(38px, 6.5vw, 98px)/.98 var(--serif); letter-spacing: -.05em; }
.quote-band cite { display: block; margin-top: 30px; font: 600 11px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; color: #aaa; }

.insight-grid { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--ink); }
.insight { min-height: 230px; padding: 18px 20px 20px 0; border-bottom: 1px solid var(--line); }
.insight + .insight { border-left: 1px solid var(--line); padding-left: 20px; }
.insight strong { display: block; font-size: 54px; letter-spacing: -.06em; }
.insight span { display: block; max-width: 220px; margin-top: 40px; color: var(--muted); line-height: 1.4; font-size: 13px; }

.page-hero { padding: clamp(80px, 10vw, 150px) 0 70px; border-bottom: 1px solid var(--line); }
.page-hero .crumbs { font: 500 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-bottom: 56px; }
.page-hero h1 { margin: 0; max-width: 1200px; font-size: clamp(60px, 9vw, 140px); line-height: .86; letter-spacing: -.07em; }
.page-hero .lead { margin: 50px 0 0 auto; max-width: 760px; font-size: clamp(20px, 2.3vw, 34px); line-height: 1.18; letter-spacing: -.03em; }

.article-grid { display: grid; grid-template-columns: 280px minmax(0, 800px); gap: clamp(40px, 7vw, 120px); justify-content: center; }
.article-aside { position: sticky; top: 110px; align-self: start; }
.article-aside dt { font: 600 10px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin-top: 18px; }
.article-aside dd { margin: 5px 0 0; font-size: 14px; }
.article-body h2 { font-size: clamp(37px, 5vw, 72px); line-height: .95; letter-spacing: -.055em; margin: 0 0 24px; }
.article-body h3 { font-size: 28px; letter-spacing: -.03em; margin: 48px 0 14px; }
.article-body p { font-size: 18px; line-height: 1.65; color: #33322f; margin: 0 0 24px; }
.article-body ul { padding-left: 20px; color: #33322f; font-size: 17px; line-height: 1.7; }
.article-body .rule { border: 0; border-top: 1px solid var(--line); margin: 58px 0; }

.faq { border-top: 1px solid var(--ink); }
.faq details { border-bottom: 1px solid var(--line); }
.faq summary { list-style: none; display: grid; grid-template-columns: 1fr auto; gap: 24px; padding: 23px 0; font-size: 20px; cursor: pointer; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: '+'; font-family: var(--mono); }
.faq details[open] summary::after { content: '−'; }
.faq details p { max-width: 780px; color: var(--muted); line-height: 1.6; padding: 0 0 26px; margin: 0; }

.contact-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: clamp(50px, 8vw, 130px); }
.contact-intro h2 { margin: 0; font-size: clamp(50px, 6vw, 92px); line-height: .92; letter-spacing: -.06em; }
.contact-intro p { max-width: 520px; color: var(--muted); line-height: 1.6; font-size: 17px; }
.contact-form { display: grid; grid-template-columns: repeat(2, 1fr); gap: 20px; }
.field { display: grid; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label { font: 600 10px/1.4 var(--mono); letter-spacing: .08em; text-transform: uppercase; }
.field input, .field textarea, .field select {
  width: 100%; border: 0; border-bottom: 1px solid var(--ink); background: transparent; color: var(--ink);
  padding: 12px 0 13px; border-radius: 0; outline: none;
}
.field textarea { min-height: 140px; resize: vertical; }
.field input:focus, .field textarea:focus, .field select:focus { border-bottom-color: var(--accent); box-shadow: 0 1px 0 var(--accent); }
.field .hint { color: var(--muted); font-size: 12px; }
.honeypot { position: absolute !important; left: -9999px !important; width: 1px !important; height: 1px !important; overflow: hidden !important; }
.consent { grid-column: 1 / -1; display: flex; align-items: flex-start; gap: 10px; font-size: 13px; color: var(--muted); line-height: 1.5; }
.consent input { margin-top: 3px; }
.submit-row { grid-column: 1 / -1; display: flex; align-items: center; gap: 20px; margin-top: 10px; }
.submit-btn { border: 1px solid var(--ink); background: var(--ink); color: #fff; padding: 14px 20px; min-width: 180px; transition: .2s ease; }
.submit-btn:hover { background: var(--accent); border-color: var(--accent); }
.submit-btn:disabled { opacity: .55; cursor: wait; }
.form-status { font: 500 12px/1.5 var(--mono); }
.form-status[data-state='error'] { color: #a30000; }
.form-status[data-state='success'] { color: #145c24; }

.admin-wrap { min-height: 100vh; padding: 40px var(--gutter); background: #f3f3f0; }
.admin-top { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #222; padding-bottom: 16px; }
.admin-top h1 { margin: 0; font-size: 28px; letter-spacing: -.03em; }
.admin-login { max-width: 520px; margin: 90px auto; }
.admin-login input { width: 100%; padding: 14px; border: 1px solid #222; background: #fff; }
.admin-login button { width: 100%; padding: 14px; border: 0; background: #111; color: #fff; margin-top: 10px; }
.admin-toolbar { display: flex; gap: 10px; margin: 20px 0; }
.admin-toolbar button { border: 1px solid #222; background: #fff; padding: 9px 12px; }
.leads-table { width: 100%; border-collapse: collapse; background: #fff; font-size: 13px; }
.leads-table th, .leads-table td { text-align: left; vertical-align: top; padding: 11px; border-bottom: 1px solid #ddd; }
.leads-table th { font: 600 10px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .06em; background: #f7f7f5; }
.empty-state { padding: 40px; text-align: center; color: #666; border: 1px solid #ccc; background: #fff; }

.site-footer { padding: 48px 0 24px; }
.footer-top { display: grid; grid-template-columns: 1.3fr .7fr; gap: 40px; align-items: end; }
.footer-cta { font-size: clamp(46px, 8vw, 122px); line-height: .84; letter-spacing: -.07em; font-weight: 700; text-decoration: none; }
.footer-cta em { font-family: var(--serif); font-weight: 400; }
.footer-links { justify-self: end; display: grid; gap: 10px; font-size: 13px; }
.footer-bottom { margin-top: 70px; padding-top: 18px; border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 20px; color: var(--muted); font: 500 10px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; }

.reveal { opacity: 0; transform: translateY(16px); transition: opacity .55s ease, transform .55s ease; }
.reveal.is-visible { opacity: 1; transform: none; }

@media (max-width: 980px) {
  .header-inner { grid-template-columns: 1fr auto; }
  .primary-nav { display: none; }
  .nav-toggle { display: block; }
  .primary-nav.is-open { position: fixed; display: grid; gap: 0; top: 73px; left: 0; right: 0; background: var(--paper); border-bottom: 1px solid var(--ink); padding: 0 var(--gutter); }
  .primary-nav.is-open a { padding: 18px 0; border-bottom: 1px solid var(--line); font-size: 18px; }
  .header-actions .header-cta { display: none; }
  .hero-bottom, .featured-case, .contact-layout, .footer-top { grid-template-columns: 1fr; }
  .section-head { grid-template-columns: 1fr; gap: 16px; }
  .project-row { grid-template-columns: 58px 1fr 100px; }
  .project-desc { grid-column: 2 / -1; }
  .services-grid { grid-template-columns: 1fr; }
  .service-card + .service-card { border-left: 0; padding-left: 0; }
  .process-step { grid-template-columns: 58px 1fr; }
  .process-step p { grid-column: 2; }
  .insight-grid { grid-template-columns: repeat(2, 1fr); }
  .insight:nth-child(3) { border-left: 0; padding-left: 0; }
  .article-grid { grid-template-columns: 1fr; }
  .article-aside { position: static; display: none; }
  .footer-links { justify-self: start; }
}

@media (max-width: 640px) {
  .header-inner { min-height: 64px; }
  .hero { padding-top: 74px; }
  .hero h1 { font-size: clamp(54px, 18vw, 92px); }
  .hero-meta { grid-template-columns: 1fr; }
  .project-row { grid-template-columns: 44px 1fr; }
  .project-tag { grid-column: 2; justify-self: start; }
  .project-desc { grid-column: 2; }
  .case-frame { min-height: 520px; }
  .case-frame::after { width: 110px; height: 110px; }
  .case-stats { grid-template-columns: 1fr; }
  .case-stat:nth-child(even) { border-left: 0; padding-left: 0; }
  .insight-grid { grid-template-columns: 1fr; }
  .insight + .insight { border-left: 0; padding-left: 0; }
  .contact-form { grid-template-columns: 1fr; }
  .field.full, .consent, .submit-row { grid-column: 1; }
  .footer-bottom { flex-direction: column; }
  .page-hero h1 { font-size: clamp(56px, 17vw, 90px); }
  .admin-wrap { padding-inline: 12px; }
  .leads-table { display: block; overflow-x: auto; }
}

/* --- V2 / richer studio system --- */
.scroll-progress {
  position: fixed; inset: 0 auto auto 0; z-index: 1000; width: 100%; height: 3px;
  pointer-events: none; transform: scaleX(0); transform-origin: 0 50%; background: var(--accent);
}

body::before {
  content: ''; position: fixed; inset: 0; z-index: 999; pointer-events: none; opacity: .035;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.92' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.55'/%3E%3C/svg%3E");
  mix-blend-mode: multiply;
}

.hero {
  position: relative; overflow: hidden;
  background-image: linear-gradient(to right, rgba(17,17,17,.045) 1px, transparent 1px);
  background-size: min(8vw, 110px) 100%;
}
.hero::after {
  content: 'D/26'; position: absolute; right: var(--gutter); top: 105px; z-index: -1;
  font: 800 clamp(120px, 25vw, 390px)/.75 var(--sans); letter-spacing: -.1em;
  color: transparent; -webkit-text-stroke: 1px rgba(17,17,17,.07); user-select: none;
}
.hero-intro-line { display: flex; justify-content: space-between; align-items: center; gap: 24px; margin-bottom: 18px; }
.hero-intro-line .kicker { margin: 0; }
.hero-mini-cta {
  display: inline-flex; align-items: center; gap: 9px; text-decoration: none;
  font: 600 10px/1.2 var(--mono); letter-spacing: .08em; text-transform: uppercase;
  border-bottom: 1px solid var(--ink); padding-bottom: 5px;
}
.status-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--accent); box-shadow: 0 0 0 4px color-mix(in srgb, var(--accent) 12%, transparent); }

.lab-section { background: #101010; color: #f4f1e9; padding: clamp(78px, 10vw, 150px) 0; border-bottom: 1px solid #252525; }
.lab-heading { display: grid; grid-template-columns: 1.25fr .75fr; gap: clamp(35px, 8vw, 120px); align-items: end; margin-bottom: 56px; }
.lab-heading h2 { margin: 0; max-width: 940px; font-size: clamp(48px, 7vw, 106px); line-height: .9; letter-spacing: -.065em; font-weight: 600; }
.lab-heading > p { color: #aaa79f; font-size: 18px; line-height: 1.55; max-width: 560px; margin: 0 0 8px; }
.lab-heading .eyebrow { color: #a7a49d; }
.studio-lab { border: 1px solid #393939; background: #151515; box-shadow: 0 35px 90px rgba(0,0,0,.24); }
.lab-toolbar { min-height: 56px; padding: 0 18px; display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; border-bottom: 1px solid #333; }
.lab-window-dots { display: flex; gap: 6px; }
.lab-window-dots span { width: 7px; height: 7px; border: 1px solid #777; border-radius: 50%; }
.lab-window-dots span:first-child { background: var(--accent); border-color: var(--accent); }
.lab-tabs { display: flex; gap: 4px; padding: 4px; border: 1px solid #343434; }
.lab-tab { border: 0; color: #aaa; background: transparent; padding: 8px 14px; font: 600 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.lab-tab:hover { color: #fff; }
.lab-tab.is-active { background: #f0ede5; color: #111; }
.lab-file { justify-self: end; color: #777; font: 500 9px/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.lab-body { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); min-height: 650px; }
.lab-canvas {
  --px: 50%; --py: 50%; position: relative; display: grid; place-items: center; overflow: hidden; padding: clamp(24px, 5vw, 76px);
  background: radial-gradient(circle at var(--px) var(--py), rgba(47,75,255,.22), transparent 30%), #ddd9cf;
  color: #111; border-right: 1px solid #333;
}
.lab-grid { position: absolute; inset: 0; opacity: .18; background-image: linear-gradient(#111 1px, transparent 1px), linear-gradient(90deg, #111 1px, transparent 1px); background-size: 44px 44px; mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 88%, transparent); }
.mini-site { width: min(100%, 760px); aspect-ratio: 1.38; min-height: 390px; position: relative; z-index: 2; display: grid; grid-template-rows: auto 1fr auto; background: #f7f4ec; border: 1px solid #111; box-shadow: 18px 18px 0 rgba(17,17,17,.12); transform: translate(calc((var(--px) - 50%) * .018), calc((var(--py) - 50%) * .018)); transition: transform .12s linear; }
.mini-nav, .mini-foot { display: flex; justify-content: space-between; align-items: center; padding: 14px 17px; border-bottom: 1px solid #111; font: 600 9px/1 var(--mono); text-transform: uppercase; letter-spacing: .07em; }
.mini-nav b { width: 25px; height: 25px; display: grid; place-items: center; color: #fff; background: #111; }
.mini-content { padding: clamp(28px, 6vw, 72px); display: flex; flex-direction: column; justify-content: center; align-items: flex-start; }
.mini-content small { font: 600 9px/1.3 var(--mono); letter-spacing: .1em; text-transform: uppercase; color: #666; }
.mini-content strong { display: block; max-width: 610px; margin-top: 22px; font-size: clamp(38px, 5vw, 76px); line-height: .88; letter-spacing: -.06em; font-weight: 650; }
.mini-cta { margin-top: 34px; padding: 10px 13px; background: var(--accent); color: #fff; font: 600 9px/1 var(--mono); letter-spacing: .08em; }
.mini-foot { border-top: 1px solid #111; border-bottom: 0; color: #555; }
.lab-explain { padding: clamp(32px, 5vw, 68px); display: flex; flex-direction: column; justify-content: center; }
.lab-index { margin: 0 0 58px; color: #757575; font: 600 10px/1 var(--mono); letter-spacing: .1em; }
.lab-explain h3 { margin: 0; font-size: clamp(32px, 3.2vw, 54px); line-height: .98; letter-spacing: -.045em; }
.lab-explain > p:not(.lab-index) { color: #aaa79f; line-height: 1.6; margin: 24px 0 0; }
.lab-points { list-style: none; padding: 0; margin: 50px 0 0; border-top: 1px solid #373737; }
.lab-points li { position: relative; padding: 14px 0 14px 22px; border-bottom: 1px solid #2b2b2b; color: #d2cfc8; font: 500 11px/1.4 var(--mono); text-transform: uppercase; letter-spacing: .05em; }
.lab-points li::before { content: '↳'; position: absolute; left: 0; color: var(--accent); }
.stack-rail { display: flex; flex-wrap: wrap; margin-top: 18px; border-left: 1px solid #343434; border-top: 1px solid #343434; }
.stack-rail span { flex: 1 0 auto; text-align: center; padding: 13px 16px; border-right: 1px solid #343434; border-bottom: 1px solid #343434; color: #8e8b85; font: 500 9px/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; }

.system-section { padding: clamp(90px, 11vw, 170px) 0 clamp(120px, 14vw, 210px); background: #e9e6de; border-bottom: 1px solid var(--line); }
.system-head { display: grid; grid-template-columns: 210px 1fr 400px; gap: 40px; align-items: end; margin-bottom: 60px; }
.system-head h2 { margin: 0; font-size: clamp(50px, 7vw, 108px); line-height: .88; letter-spacing: -.065em; }
.system-head > p:last-child { margin: 0; color: var(--muted); line-height: 1.6; }
.layer-stack { position: relative; }
.layer-card {
  position: sticky; top: 92px; min-height: 220px; display: grid; grid-template-columns: 80px 1.1fr 1fr 120px; gap: 28px; align-items: center;
  margin-top: 18px; padding: clamp(28px, 4vw, 56px); border: 1px solid #111; box-shadow: 0 12px 0 rgba(17,17,17,.06);
}
.layer-number { align-self: start; font: 700 12px/1 var(--mono); }
.layer-kicker { margin: 0 0 12px; font: 700 10px/1 var(--mono); text-transform: uppercase; letter-spacing: .1em; opacity: .55; }
.layer-card h3 { margin: 0; max-width: 570px; font-size: clamp(34px, 4.2vw, 66px); line-height: .95; letter-spacing: -.05em; }
.layer-card > p { max-width: 580px; margin: 0; line-height: 1.55; opacity: .72; }
.layer-code { justify-self: end; align-self: start; padding: 8px 10px; border: 1px solid currentColor; font: 700 9px/1 var(--mono); letter-spacing: .08em; }
.layer-message { background: #f4f0e7; }
.layer-design { background: #dce2ff; }
.layer-codecard { background: #111; color: #f2f0ea; }
.layer-search { background: var(--accent); color: #fff; }

.service-card { position: relative; overflow: hidden; transition: background .25s ease, transform .25s ease; }
.service-card::after { content: '↗'; position: absolute; right: 24px; top: 24px; font: 600 16px/1 var(--mono); opacity: 0; transform: translate(-8px,8px); transition: .25s ease; }
.service-card:hover { background: #e9e6de; transform: translateY(-3px); }
.service-card:hover::after { opacity: 1; transform: none; }

.featured-case .case-frame { --rx: 0deg; --ry: 0deg; transform: perspective(1000px) rotateX(var(--rx)) rotateY(var(--ry)); transform-style: preserve-3d; transition: transform .18s ease-out; }
.featured-case .case-frame .case-wordmark, .featured-case .case-frame .case-topline { transform: translateZ(24px); }

.faq-section { background: #f7f4ec; }
.faq-wide { border-top-width: 2px; }
.faq-wide summary { padding: 28px 0; font-size: clamp(20px, 2.2vw, 34px); letter-spacing: -.025em; }
.faq-wide details p { padding-right: 80px; font-size: 16px; }
.faq-wide details[open] { background: rgba(47,75,255,.04); }
.faq-wide details[open] summary { color: var(--accent); }

.contact-intro { position: relative; }
.contact-intro::after { content: '↗'; display: block; margin-top: 45px; font-size: clamp(80px, 11vw, 160px); line-height: .7; color: var(--accent); }
.submit-btn { position: relative; overflow: hidden; }
.submit-btn::after { content: ''; position: absolute; inset: 0; transform: translateX(-105%); background: rgba(255,255,255,.15); transition: transform .35s ease; }
.submit-btn:hover::after { transform: translateX(105%); }

.back-top { position: fixed; right: 18px; bottom: 18px; z-index: 30; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid var(--ink); background: var(--paper); color: var(--ink); opacity: 0; transform: translateY(8px); pointer-events: none; transition: .2s ease; font: 700 14px/1 var(--mono); }
.back-top.is-visible { opacity: 1; transform: none; pointer-events: auto; }
.back-top:hover { background: var(--ink); color: var(--paper); }

@media (max-width: 1120px) {
  .lab-heading { grid-template-columns: 1fr; }
  .lab-heading > p { max-width: 720px; }
  .lab-body { grid-template-columns: 1fr; }
  .lab-canvas { min-height: 600px; border-right: 0; border-bottom: 1px solid #333; }
  .lab-explain { min-height: 430px; }
  .system-head { grid-template-columns: 1fr 1.5fr; }
  .system-head > p:last-child { grid-column: 2; }
  .layer-card { grid-template-columns: 60px 1fr 1fr; }
  .layer-code { grid-column: 2; justify-self: start; }
}

@media (max-width: 760px) {
  body::before { display: none; }
  .hero { background-size: 68px 100%; }
  .hero::after { top: 110px; right: -20px; }
  .hero-intro-line { align-items: flex-start; flex-direction: column; }
  .hero-mini-cta { order: -1; }
  .lab-section { padding-top: 72px; }
  .lab-toolbar { grid-template-columns: auto 1fr; gap: 14px; padding: 10px 12px; }
  .lab-window-dots { display: none; }
  .lab-tabs { justify-self: start; }
  .lab-tab { padding: 8px 10px; }
  .lab-file { font-size: 8px; }
  .lab-canvas { min-height: 430px; padding: 22px; }
  .mini-site { min-height: 320px; aspect-ratio: auto; }
  .mini-nav span { display: none; }
  .mini-content { padding: 28px; }
  .mini-content strong { font-size: clamp(36px, 12vw, 58px); }
  .mini-foot span:first-child { display: none; }
  .lab-index { margin-bottom: 36px; }
  .system-head { grid-template-columns: 1fr; }
  .system-head > p:last-child { grid-column: 1; max-width: 600px; }
  .layer-card { position: relative; top: auto; min-height: 0; grid-template-columns: 42px 1fr; gap: 20px; padding: 28px 22px; }
  .layer-card > p, .layer-code { grid-column: 2; }
  .layer-code { justify-self: start; }
  .faq-wide details p { padding-right: 0; }
  .back-top { width: 40px; height: 40px; right: 12px; bottom: 12px; }
}


/* =========================================================
   V3 / VISUAL SYSTEM
   ========================================================= */
body.menu-open { overflow: hidden; }
.site-header { z-index: 80; }
.header-inner { min-height: 76px; }
.brand span:last-child { letter-spacing: .02em; }
.primary-nav a { display:flex; align-items:baseline; gap:7px; font-weight:600; }
.primary-nav a small { font:500 8px/1 var(--mono); color:var(--muted); letter-spacing:.08em; }
.availability { display:inline-flex; align-items:center; gap:8px; font:600 9px/1 var(--mono); letter-spacing:.08em; text-transform:uppercase; white-space:nowrap; }
.availability i { width:7px; height:7px; border-radius:50%; background:#2fd36b; box-shadow:0 0 0 4px rgba(47,211,107,.12); animation:statusPulse 2.2s ease infinite; }
@keyframes statusPulse { 50% { box-shadow:0 0 0 8px rgba(47,211,107,0); } }
.nav-toggle { display:inline-flex; align-items:center; gap:10px; border:1px solid var(--line); padding:10px 12px; background:transparent; font-size:12px; }
.nav-toggle i { width:14px; height:10px; position:relative; display:block; border-top:1px solid currentColor; border-bottom:1px solid currentColor; }
.menu-overlay { position:fixed; inset:0; z-index:120; pointer-events:none; visibility:hidden; }
.menu-overlay.is-open { pointer-events:auto; visibility:visible; }
.menu-backdrop { position:absolute; inset:0; background:rgba(8,8,8,.54); backdrop-filter:blur(9px); opacity:0; transition:opacity .35s ease; }
.menu-overlay.is-open .menu-backdrop { opacity:1; }
.menu-panel { position:absolute; right:0; top:0; bottom:0; width:min(900px,92vw); background:#101010; color:#f4f1e9; padding:26px clamp(24px,4vw,58px); transform:translateX(102%); transition:transform .48s cubic-bezier(.77,0,.18,1); display:grid; grid-template-columns:minmax(0,1fr) 240px; grid-template-rows:auto 1fr auto; gap:28px 54px; overflow:auto; }
.menu-overlay.is-open .menu-panel { transform:translateX(0); }
.menu-panel-top { grid-column:1/-1; display:flex; justify-content:space-between; align-items:center; border-bottom:1px solid #333; padding-bottom:20px; font:600 10px/1 var(--mono); letter-spacing:.1em; }
.menu-panel-top button { border:0; background:none; color:inherit; font:inherit; padding:8px 0; }
.menu-main { display:flex; flex-direction:column; align-self:center; }
.menu-main a { color:inherit; text-decoration:none; border-bottom:1px solid #292929; padding:17px 0 20px; display:grid; grid-template-columns:42px 1fr; align-items:end; column-gap:10px; position:relative; overflow:hidden; }
.menu-main a::before { content:''; position:absolute; inset:0; background:#f4f1e9; transform:translateY(102%); transition:transform .28s ease; z-index:-1; }
.menu-main a:hover { color:#111; padding-left:12px; }
.menu-main a:hover::before { transform:translateY(0); }
.menu-main a span { font:500 9px/1 var(--mono); align-self:center; }
.menu-main a strong { font-size:clamp(38px,5.2vw,72px); line-height:.9; letter-spacing:-.055em; font-weight:650; }
.menu-main a em { grid-column:2; margin-top:9px; font:400 11px/1.4 var(--mono); opacity:.62; font-style:normal; }
.menu-side { border-left:1px solid #333; padding-left:28px; align-self:center; display:flex; flex-direction:column; gap:17px; }
.menu-side a { color:inherit; text-decoration:none; font-size:14px; }
.menu-side a:hover { opacity:.65; }
.menu-note { margin-top:25px; border-top:1px solid #333; padding-top:20px; display:grid; grid-template-columns:auto 1fr; gap:10px; font-size:12px; line-height:1.5; opacity:.75; }
.menu-note p { margin:0; }
.menu-panel-foot { grid-column:1/-1; border-top:1px solid #333; padding-top:18px; display:flex; justify-content:space-between; font:500 9px/1 var(--mono); letter-spacing:.08em; opacity:.6; }

.hero { position:relative; overflow:hidden; padding-bottom:90px; }
.hero h1 { max-width:1380px; font-size:clamp(58px,9.9vw,152px); }
.hero h1 .serif { color:var(--accent); }
.hero-copy { max-width:820px; }
.hero-stage { --stage-x:0px; --stage-y:0px; --stage-rx:0deg; --stage-ry:0deg; position:relative; margin-top:clamp(65px,8vw,125px); min-height:clamp(430px,58vw,760px); border-top:1px solid var(--line); padding-top:44px; perspective:1400px; }
.stage-glow { position:absolute; width:52%; aspect-ratio:1; border-radius:50%; left:27%; top:17%; background:radial-gradient(circle, rgba(47,75,255,.3), rgba(47,75,255,0) 67%); filter:blur(28px); pointer-events:none; }
.stage-browser { position:absolute; left:2%; top:9%; width:78%; height:78%; background:#0e0e0f; color:#f2f0ea; border:1px solid #2b2b2d; border-radius:14px; overflow:hidden; box-shadow:0 40px 100px rgba(0,0,0,.18); transform:translate3d(var(--stage-x),var(--stage-y),0) rotateX(var(--stage-rx)) rotateY(var(--stage-ry)); transition:transform .16s ease-out; }
.browser-bar { height:42px; border-bottom:1px solid #2c2c2e; display:grid; grid-template-columns:1fr 2fr 1fr; align-items:center; padding:0 16px; color:#999; font:500 9px/1 var(--mono); }
.browser-dots { display:flex; gap:6px; }.browser-dots i { width:7px;height:7px;border-radius:50%;background:#555; }.browser-url{text-align:center}.browser-bar>span:last-child{text-align:right}
.browser-page { height:calc(100% - 42px); padding:24px 28px; display:grid; grid-template-rows:auto 1fr auto; background:radial-gradient(circle at 72% 34%, rgba(47,75,255,.18), transparent 26%),#111; }
.browser-nav { display:flex; justify-content:space-between; align-items:center; font:600 9px/1 var(--mono); letter-spacing:.08em; }.browser-nav b{font-size:21px}.browser-nav small{border:1px solid #444;padding:8px 10px}
.browser-hero { align-self:center; max-width:82%; }.browser-hero>span{font:600 9px/1 var(--mono);letter-spacing:.12em;color:#858585}.browser-hero strong{display:block;font-size:clamp(35px,5.7vw,84px);line-height:.83;letter-spacing:-.065em;margin:16px 0 24px}.browser-hero em{font-family:var(--serif);font-weight:400;color:#7889ff}.browser-hero button{border:1px solid #f2f0ea;color:#f2f0ea;background:none;padding:11px 14px;font:600 9px/1 var(--mono)}
.browser-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #333}.browser-grid span{padding:14px 10px 0 0;font:500 8px/1 var(--mono);color:#777}
.stage-phone { position:absolute; right:3%; bottom:2%; width:min(28%,260px); aspect-ratio:.51; background:#0b0b0c; color:#f4f1e9; border:7px solid #161619; border-radius:34px; box-shadow:0 36px 80px rgba(0,0,0,.28); transform:translate3d(calc(var(--stage-x)*-.45),calc(var(--stage-y)*-.45),90px) rotate(-4deg); overflow:hidden; }
.phone-speaker{position:absolute;top:10px;left:50%;transform:translateX(-50%);width:32%;height:18px;background:#171719;border-radius:20px;z-index:2}.phone-ui{height:100%;padding:42px 18px 22px;display:flex;flex-direction:column;background:radial-gradient(circle at 75% 25%,rgba(47,75,255,.35),transparent 28%),#111}.phone-ui>span{font-size:20px;font-weight:800}.phone-ui small{margin-top:34px;font:600 7px/1 var(--mono);letter-spacing:.1em;color:#8d8d8d}.phone-ui strong{font-size:clamp(26px,3vw,45px);line-height:.86;letter-spacing:-.06em;margin-top:12px}.phone-ui em{font-family:var(--serif);font-weight:400;color:#7f90ff}.phone-pill{margin-top:auto;border-top:1px solid #414141;padding-top:14px;font:600 8px/1 var(--mono)}
.stage-chip{position:absolute;background:var(--paper);border:1px solid var(--ink);min-width:150px;padding:13px 15px;display:flex;justify-content:space-between;gap:18px;box-shadow:8px 8px 0 var(--accent-soft);font:600 9px/1 var(--mono);transform:translateZ(120px)}.stage-chip span{color:var(--muted)}.stage-chip strong{font-size:10px}.chip-one{left:7%;bottom:7%;transform:rotate(3deg)}.chip-two{right:20%;top:14%;transform:rotate(-3deg)}

.transform-section { padding:clamp(95px,11vw,160px) 0; background:#111; color:#eeeae1; overflow:hidden; }
.transform-head { display:grid; grid-template-columns:.45fr 1.1fr .7fr; gap:40px; align-items:end; margin-bottom:58px; }.transform-head h2{font-size:clamp(45px,6.5vw,92px);line-height:.9;letter-spacing:-.06em;margin:0}.transform-head>p:last-child{font-size:16px;line-height:1.6;color:#aaa;margin:0;max-width:500px}
.compare-board{border-top:1px solid #383838;padding-top:18px}.compare-labels{display:flex;justify-content:space-between;font:600 9px/1 var(--mono);letter-spacing:.12em;text-transform:uppercase;color:#888;margin-bottom:14px}.compare-window{height:clamp(430px,52vw,710px);position:relative;overflow:hidden;background:#ece9e1;color:#111;border-radius:2px}.compare-base{position:absolute;inset:0;padding:28px clamp(25px,4vw,60px)}.compare-after{background:radial-gradient(circle at 78% 22%,#d8deff 0,transparent 26%),#eeece6}.compare-before{background:#e6e2d9;clip-path:inset(0 52% 0 0);z-index:2}.compare-top{display:flex;justify-content:space-between;border-bottom:1px solid rgba(0,0,0,.2);padding-bottom:14px;font:600 9px/1 var(--mono);letter-spacing:.08em}.compare-after-body,.compare-before-body{height:calc(100% - 28px);display:flex;flex-direction:column;justify-content:center;align-items:flex-start;max-width:70%}.compare-after-body small,.compare-before-body small{font:600 9px/1 var(--mono);letter-spacing:.13em}.compare-after-body strong{font-size:clamp(56px,8vw,125px);line-height:.78;letter-spacing:-.075em;margin:18px 0 28px}.compare-after-body em{font-family:var(--serif);font-weight:400;color:var(--accent)}.compare-after-body p{max-width:520px;font-size:clamp(15px,1.5vw,22px);line-height:1.35;margin:0}.compare-cta{margin-top:30px;border:1px solid #111;padding:12px 16px;font:600 9px/1 var(--mono)}.compare-before-body strong{font-size:clamp(34px,5vw,70px);line-height:.96;letter-spacing:-.04em;margin:18px 0}.compare-before-body p{max-width:430px;color:#68655f}.fake-lines{margin-top:28px;width:76%;display:grid;gap:10px}.fake-lines i{height:8px;background:#bdb8ad}.fake-lines i:nth-child(2){width:90%}.fake-lines i:nth-child(3){width:72%}.fake-lines i:nth-child(4){width:44%}.compare-range{position:absolute;inset:0;width:100%;height:100%;opacity:0;z-index:5;cursor:ew-resize;margin:0}.compare-handle{position:absolute;top:0;bottom:0;left:48%;width:2px;background:#2f4bff;z-index:4;pointer-events:none}.compare-handle span{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:#2f4bff;color:#fff;display:grid;place-items:center;font-size:18px}.compare-note{margin:14px 0 0;color:#777;font:500 9px/1.5 var(--mono)}

.case-device-frame { min-height:640px; padding:22px; overflow:hidden; background:linear-gradient(145deg,#2f4bff,#172167 62%,#0f143e); }
.case-device-frame .case-topline { color:#e8eaff; border-color:rgba(255,255,255,.28); position:relative; z-index:3; }
.case-browser{position:absolute;left:7%;top:16%;width:78%;height:65%;background:#f0eee8;border-radius:10px;overflow:hidden;box-shadow:0 35px 70px rgba(0,0,0,.25);transform:rotate(-2.2deg)}.case-browser-bar{height:34px;background:#181818;color:#777;display:flex;align-items:center;gap:5px;padding:0 11px;font:500 8px/1 var(--mono)}.case-browser-bar i{width:6px;height:6px;border-radius:50%;background:#555}.case-browser-bar span{margin-left:auto;margin-right:auto}.q4-screen{height:calc(100% - 34px);background:#efece6;color:#171717;padding:18px;display:grid;grid-template-rows:auto 1fr auto}.q4-nav{display:flex;align-items:center;justify-content:space-between;font:600 8px/1 var(--mono);border-bottom:1px solid #bbb;padding-bottom:10px}.q4-nav b{font-size:16px}.q4-nav em{font-style:normal;background:#171717;color:#fff;padding:8px}.q4-hero{align-self:center}.q4-hero small{font:600 7px/1 var(--mono);letter-spacing:.1em}.q4-hero strong{font-size:clamp(40px,5vw,78px);line-height:.82;letter-spacing:-.065em;display:block;margin:12px 0}.q4-hero em{font-family:var(--serif);font-weight:400;color:#2f4bff}.q4-hero p{font-size:12px;max-width:380px;color:#666}.q4-strip{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid #bbb;padding-top:10px;font:600 7px/1 var(--mono)}.case-mobile{position:absolute;right:5%;bottom:5%;width:24%;aspect-ratio:.52;background:#101010;color:#fff;border:6px solid #171717;border-radius:28px;padding:34px 14px 17px;box-shadow:0 30px 55px rgba(0,0,0,.35);display:flex;flex-direction:column}.case-mobile-notch{position:absolute;top:8px;left:50%;transform:translateX(-50%);width:42%;height:15px;background:#1c1c1c;border-radius:20px}.case-mobile small{font:600 8px/1 var(--mono);letter-spacing:.1em;color:#999}.case-mobile strong{font-size:clamp(22px,3vw,42px);line-height:.9;letter-spacing:-.05em;margin-top:25px}.case-mobile span{margin-top:auto;border-top:1px solid #444;padding-top:12px;font:600 7px/1 var(--mono)}

.signal-section{padding:clamp(100px,12vw,180px) 0;background:#ddd9ff;overflow:hidden}.signal-title{display:grid;grid-template-columns:.4fr 1.1fr .65fr;gap:40px;align-items:end;margin-bottom:65px}.signal-title h2{font-size:clamp(70px,11vw,170px);line-height:.72;letter-spacing:-.08em;margin:0}.signal-title>p:last-child{font-size:16px;line-height:1.55;margin:0}.signal-grid{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid #111}.signal-card{padding:25px 28px 40px 0;border-right:1px solid rgba(17,17,17,.22);min-height:390px;display:flex;flex-direction:column}.signal-card+ .signal-card{padding-left:28px}.signal-card>span{font:600 9px/1 var(--mono)}.signal-card h3{font-size:clamp(28px,3vw,46px);line-height:.95;letter-spacing:-.045em;margin:auto 0 16px;max-width:340px}.signal-card p{font-size:14px;line-height:1.55;max-width:390px;margin:0}.signal-icon{width:110px;height:110px;margin:38px 0;position:relative}.icon-focus{border:1px solid #111;border-radius:50%;display:grid;place-items:center}.icon-focus i{position:absolute;border:1px solid #111;border-radius:50%}.icon-focus i:nth-child(1){width:74px;height:74px}.icon-focus i:nth-child(2){width:36px;height:36px;background:#2f4bff;border-color:#2f4bff}.icon-focus i:nth-child(3){width:8px;height:8px;background:#fff;border:0}.icon-speed{border:1px solid #111;border-radius:50%}.icon-speed::before,.icon-speed::after,.icon-speed i{content:'';position:absolute;height:1px;background:#111;left:13px;right:13px;top:50%;transform-origin:right}.icon-speed::before{transform:rotate(30deg)}.icon-speed::after{transform:rotate(-30deg)}.icon-speed i{transform:rotate(-75deg);height:2px;background:#2f4bff}.icon-system{display:grid;grid-template-columns:repeat(2,1fr);gap:7px}.icon-system i{border:1px solid #111}.icon-system i:nth-child(2),.icon-system i:nth-child(3){background:#2f4bff;border-color:#2f4bff}.proof-rail{margin-top:44px;border-top:1px solid #111;border-bottom:1px solid #111;display:grid;grid-template-columns:repeat(5,1fr)}.proof-rail span{padding:17px 12px;border-right:1px solid rgba(17,17,17,.2);font:600 9px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em}.proof-rail span:last-child{border:0}

.project-float{position:fixed;left:18px;bottom:18px;z-index:55;background:#111;color:#fff;text-decoration:none;padding:11px 14px;display:grid;gap:5px;transform:translateY(130%);opacity:0;transition:.28s ease;box-shadow:0 8px 30px rgba(0,0,0,.16)}.project-float.is-visible{transform:translateY(0);opacity:1}.project-float span{font:500 7px/1 var(--mono);letter-spacing:.12em;color:#888}.project-float strong{font-size:12px}

.site-footer-v3{padding:50px 0 20px;background:#0e0e0f;color:#f1eee7;border-top:0}.footer-kicker{display:flex;justify-content:space-between;border-bottom:1px solid #333;padding-bottom:18px;font:600 9px/1 var(--mono);letter-spacing:.1em;color:#858585}.footer-main{display:grid;grid-template-columns:1.4fr 1fr;gap:70px;padding:70px 0}.site-footer-v3 .footer-cta{font-size:clamp(46px,7vw,105px);line-height:.82;letter-spacing:-.065em;text-decoration:none}.site-footer-v3 .footer-cta em{font-family:var(--serif);font-weight:400;color:#7889ff}.footer-columns{display:grid;grid-template-columns:repeat(3,1fr);gap:35px;align-self:end}.footer-columns>div{display:flex;flex-direction:column;gap:11px}.footer-columns small{font:600 8px/1 var(--mono);letter-spacing:.1em;text-transform:uppercase;color:#666;margin-bottom:7px}.footer-columns a{font-size:12px;color:inherit;text-decoration:none}.footer-columns a:hover{color:#7889ff}.footer-signature{font-size:clamp(100px,22vw,340px);line-height:.68;letter-spacing:-.09em;font-weight:800;white-space:nowrap;overflow:hidden;padding:25px 0 48px;border-top:1px solid #333;color:#eae6de}.footer-signature span{font-family:var(--serif);font-style:italic;font-weight:400;color:#7889ff;font-size:.45em}.site-footer-v3 .footer-bottom{border-top:1px solid #333;color:#777}.compact-footer .footer-main{padding-bottom:50px}.compact-footer .footer-columns{grid-template-columns:repeat(2,1fr)}

/* Admin V3 */
.admin-body{background:#0e0e0f;color:#f1eee7;min-height:100vh}.admin-shell{width:min(1460px,100%);margin:auto;padding:0 var(--gutter) 60px}.admin-head{height:76px;border-bottom:1px solid #333;display:flex;align-items:center;justify-content:space-between;font-size:12px}.admin-head a{color:inherit;text-decoration:none}.admin-brand{font-weight:700;letter-spacing:.02em}.admin-brand span{display:inline-grid;place-items:center;width:26px;height:26px;background:#f1eee7;color:#111;margin-right:8px}.admin-auth{min-height:calc(100vh - 76px);display:grid;grid-template-columns:1.15fr .85fr;gap:70px;align-items:center;padding:70px 0}.admin-auth-visual h1{font-size:clamp(70px,9vw,145px);line-height:.77;letter-spacing:-.075em;margin:40px 0 26px}.admin-auth-visual h1 em{font-family:var(--serif);font-weight:400;color:#7889ff}.admin-auth-visual>p{color:#999;max-width:520px;font-size:17px;line-height:1.55}.admin-orbit{width:140px;height:140px;border:1px solid #444;border-radius:50%;position:relative;display:grid;place-items:center;margin-top:55px}.admin-orbit b{font-size:34px}.admin-orbit i{position:absolute;width:10px;height:10px;border-radius:50%;background:#7889ff;top:50%;left:50%;margin:-5px;animation:orbit 7s linear infinite;transform-origin:5px 5px}.admin-orbit i:nth-child(1){animation-name:orbit1}.admin-orbit i:nth-child(2){animation-name:orbit2;animation-duration:10s;background:#fff}.admin-orbit i:nth-child(3){animation-name:orbit3;animation-duration:13s;background:#555}@keyframes orbit1{to{transform:rotate(360deg) translateX(70px) rotate(-360deg)}}@keyframes orbit2{from{transform:rotate(120deg) translateX(52px)}to{transform:rotate(480deg) translateX(52px)}}@keyframes orbit3{from{transform:rotate(240deg) translateX(88px)}to{transform:rotate(600deg) translateX(88px)}}
.admin-login-card{background:#f0ede6;color:#111;padding:32px clamp(24px,4vw,48px);min-height:570px;display:flex;flex-direction:column;justify-content:center;box-shadow:18px 18px 0 #222}.admin-login-top{display:flex;justify-content:space-between;font:600 8px/1 var(--mono);letter-spacing:.1em;color:#777;border-bottom:1px solid #bbb;padding-bottom:15px;margin-bottom:auto}.admin-login-card h2{font-size:clamp(40px,4vw,64px);letter-spacing:-.055em;margin:35px 0 8px}.admin-login-card>p{color:#68655f;margin:0 0 30px}.admin-login-card label{display:grid;gap:8px;font:600 9px/1 var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-top:18px}.admin-login-card input{background:transparent;border:0;border-bottom:1px solid #777;padding:13px 0;font:500 16px/1.2 var(--sans);outline:none;border-radius:0}.admin-login-card input:focus{border-color:#2f4bff}.admin-login-card button{margin-top:30px;border:0;background:#111;color:#fff;padding:16px 18px;text-align:left;font-weight:700}.admin-message{min-height:20px;font-size:12px;color:#777;margin-top:16px!important}.admin-dashboard{padding:80px 0}.admin-dashboard-title{display:flex;justify-content:space-between;align-items:end;border-bottom:1px solid #333;padding-bottom:34px}.admin-dashboard-title h1{font-size:clamp(74px,10vw,150px);line-height:.75;letter-spacing:-.075em;margin:0}.admin-actions{display:flex;gap:8px;flex-wrap:wrap}.admin-actions button{border:1px solid #444;background:transparent;color:#eee;padding:10px 13px;font-size:11px}.admin-actions button:hover{background:#eee;color:#111}.admin-actions .admin-logout{border-color:#784646;color:#e8a5a5}.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);margin:30px 0 70px;border-top:1px solid #333;border-bottom:1px solid #333}.admin-stats article{padding:22px 18px 25px 0;border-right:1px solid #333}.admin-stats article+article{padding-left:22px}.admin-stats span{display:block;font:600 8px/1 var(--mono);letter-spacing:.1em;color:#666;text-transform:uppercase;margin-bottom:13px}.admin-stats strong{font-size:clamp(24px,3vw,46px);letter-spacing:-.04em}.admin-stats .status-dot{display:inline-block;margin-right:8px}.admin-feed{display:grid;gap:14px}.lead-card{background:#171719;border:1px solid #2c2c2f;padding:24px 26px;transition:.2s ease}.lead-card:hover{border-color:#53535a;transform:translateY(-2px)}.lead-card-head{display:flex;justify-content:space-between;gap:30px}.lead-card-head>div>span{font:500 8px/1 var(--mono);color:#696969;text-transform:uppercase}.lead-card h2{font-size:clamp(28px,3vw,48px);letter-spacing:-.04em;margin:9px 0 3px}.lead-card-head p{margin:0;color:#777;font-size:12px}.lead-budget{font:600 9px/1 var(--mono);border:1px solid #3b3b3d;padding:9px 11px;height:max-content;color:#aaa}.lead-message{font-size:15px;line-height:1.55;max-width:960px;margin:28px 0}.lead-meta{display:flex;gap:18px;flex-wrap:wrap;border-top:1px solid #2b2b2d;padding-top:16px}.lead-meta a{color:#9aa6ff;font-size:11px;text-decoration:none}.empty-state{padding:60px;border:1px dashed #444;text-align:center;color:#777}

@media (max-width:1050px){.availability{display:none}.transform-head,.signal-title{grid-template-columns:1fr 1.6fr}.transform-head>p:last-child,.signal-title>p:last-child{grid-column:2}.signal-grid{grid-template-columns:1fr}.signal-card,.signal-card+.signal-card{padding:30px 0;border-right:0;border-bottom:1px solid rgba(17,17,17,.22);min-height:310px}.proof-rail{grid-template-columns:repeat(2,1fr)}.proof-rail span{border-bottom:1px solid rgba(17,17,17,.2)}.admin-auth{grid-template-columns:1fr}.admin-auth-visual{padding-top:30px}.admin-login-card{min-height:0}.footer-main{grid-template-columns:1fr}.footer-columns{align-self:auto}}
@media (max-width:820px){.primary-nav{display:none}.header-cta{display:none}.nav-toggle{display:inline-flex}.menu-panel{width:100%;grid-template-columns:1fr;padding:20px}.menu-side{border-left:0;border-top:1px solid #333;padding:22px 0 0}.menu-main a strong{font-size:clamp(42px,13vw,70px)}.menu-panel-foot{margin-top:20px}.hero-stage{min-height:500px}.stage-browser{width:92%;height:70%;left:0}.stage-phone{width:31%;right:0}.stage-chip{display:none}.browser-grid span:nth-child(n+3){display:none}.browser-grid{grid-template-columns:repeat(2,1fr)}.transform-head,.signal-title{grid-template-columns:1fr}.transform-head>p:last-child,.signal-title>p:last-child{grid-column:auto}.compare-after-body,.compare-before-body{max-width:92%}.case-device-frame{min-height:520px}.case-browser{left:3%;width:86%;height:62%}.case-mobile{width:28%;right:2%}.footer-columns{grid-template-columns:repeat(2,1fr)}.footer-signature{font-size:30vw}.admin-dashboard-title{align-items:flex-start;flex-direction:column;gap:35px}.admin-stats{grid-template-columns:1fr}.admin-stats article,.admin-stats article+article{border-right:0;border-bottom:1px solid #333;padding:20px 0}.lead-card-head{flex-direction:column}.project-float{left:12px;bottom:12px}}
@media (max-width:560px){.brand span:last-child{font-size:11px}.hero h1{font-size:clamp(52px,16vw,86px)}.hero-bottom{grid-template-columns:1fr}.hero-stage{min-height:440px;margin-top:70px}.stage-browser{height:65%;top:13%;border-radius:8px}.browser-bar{height:32px;padding:0 9px}.browser-url{display:none}.browser-bar{grid-template-columns:1fr 1fr}.browser-page{padding:15px}.browser-nav span{display:none}.browser-hero{max-width:100%}.browser-hero strong{font-size:clamp(36px,11vw,58px)}.stage-phone{width:38%;bottom:1%;border-width:5px;border-radius:25px}.phone-ui{padding:36px 12px 16px}.transform-section{padding-top:85px}.compare-window{height:520px}.compare-top span{display:none}.compare-after-body strong{font-size:17vw}.compare-before-body strong{font-size:10vw}.compare-handle span{width:40px;height:40px}.case-device-frame{min-height:440px}.case-browser{top:18%;width:91%;height:58%;left:0}.q4-nav span{display:none}.case-mobile{width:34%;bottom:2%;right:1%}.signal-title h2{font-size:24vw}.proof-rail{grid-template-columns:1fr}.proof-rail span{border-right:0}.footer-main{padding:55px 0}.footer-columns{grid-template-columns:1fr 1fr}.footer-signature{font-size:34vw}.footer-bottom{gap:12px;flex-direction:column;align-items:flex-start}.admin-auth{padding-top:30px}.admin-auth-visual h1{font-size:18vw}.admin-orbit{width:100px;height:100px}.admin-orbit i:nth-child(1){animation-name:none}.admin-orbit i:nth-child(2){animation-name:none}.admin-orbit i:nth-child(3){animation-name:none}.admin-stats strong{font-size:34px}}
@media (prefers-reduced-motion:reduce){.availability i,.admin-orbit i{animation:none}.menu-panel,.menu-backdrop,.project-float{transition:none}}

/* =========================================================
   V3.1 / RESPONSIVE POLISH — mobile first repair pass
   ========================================================= */
html { overflow-x: clip; }
body { overflow-x: clip; }
.site-shell,
.header-inner,
.hero-bottom > *,
.section-head > *,
.featured-case > *,
.lab-heading > *,
.lab-body > *,
.system-head > *,
.transform-head > *,
.signal-title > *,
.footer-main > *,
.footer-columns > *,
.contact-layout > *,
.article-grid > *,
.project-row > * { min-width: 0; }

/* Avoid cramped desktop/tablet navigation before the old 980px breakpoint. */
@media (max-width: 1180px) {
  .header-inner { grid-template-columns: minmax(0, 1fr) auto; }
  .primary-nav { display: none; }
  .nav-toggle { display: inline-flex; min-height: 44px; align-items: center; }
  .header-actions { justify-self: end; }
}

@media (max-width: 900px) {
  .header-cta { display: none !important; }
}

/* Keep 10–11 inch tablets / small laptops visually closer to desktop. */
@media (min-width: 921px) and (max-width: 1120px) {
  .lab-body { grid-template-columns: minmax(0, 1.25fr) minmax(280px, .75fr); }
  .lab-canvas { min-height: 560px; border-right: 1px solid #333; border-bottom: 0; }
  .lab-explain { min-height: 560px; padding: 36px; }
}

@media (min-width: 901px) and (max-width: 1050px) {
  .signal-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .signal-card,
  .signal-card + .signal-card {
    min-height: 350px;
    padding: 25px 22px 36px 0;
    border-right: 1px solid rgba(17,17,17,.22);
    border-bottom: 0;
  }
  .signal-card + .signal-card { padding-left: 22px; }
  .proof-rail { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  .proof-rail span { border-bottom: 0; }
}

@media (max-width: 820px) {
  .menu-panel {
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto auto;
    align-content: start;
    gap: 18px;
    padding: max(18px, env(safe-area-inset-top)) max(18px, env(safe-area-inset-right)) max(20px, env(safe-area-inset-bottom)) max(18px, env(safe-area-inset-left));
    overscroll-behavior: contain;
  }
  .menu-main { align-self: start; width: 100%; }
  .menu-main a { padding: 14px 0 16px; grid-template-columns: 34px minmax(0, 1fr); }
  .menu-main a strong { font-size: clamp(36px, 11.8vw, 58px); line-height: .94; }
  .menu-main a em { margin-top: 6px; font-size: 10px; }
  .menu-side { gap: 14px; }
  .menu-panel-foot { gap: 10px 20px; flex-wrap: wrap; }

  .hero-stage { min-height: 480px; }
  .stage-browser { width: 94%; height: 68%; left: 0; }
  .stage-phone { width: 29%; right: 0; }

  .footer-kicker { gap: 12px; flex-wrap: wrap; }
  .footer-main { gap: 42px; }
}

@media (max-width: 640px) {
  :root { --gutter: clamp(16px, 5vw, 22px); }

  .site-header { backdrop-filter: blur(10px); }
  .header-inner { min-height: 64px; gap: 12px; }
  .brand { gap: 8px; }
  .brand-mark { width: 27px; height: 27px; }
  .nav-toggle { min-width: 76px; justify-content: center; padding: 10px 11px; }

  .hero { padding-top: 58px; padding-bottom: 64px; }
  .hero-intro-line { gap: 13px; margin-bottom: 24px; }
  .hero-mini-cta { font-size: 9px; line-height: 1.35; }
  .hero h1 {
    font-size: clamp(48px, 15vw, 76px);
    line-height: .89;
    letter-spacing: -.066em;
    max-width: 100%;
  }
  .hero-copy { font-size: 19px; line-height: 1.32; letter-spacing: -.025em; }
  .hero-bottom { margin-top: 36px; gap: 34px; }
  .hero-meta { gap: 0; }
  .meta-block { padding: 10px 0 14px; }
  .hero::after { top: 94px; right: -8px; font-size: clamp(105px, 34vw, 150px); opacity: .75; }

  .hero-stage {
    min-height: 420px;
    margin-top: 54px;
    padding-top: 26px;
  }
  .stage-browser {
    width: 95%;
    height: 62%;
    top: 9%;
    border-radius: 8px;
    box-shadow: 0 24px 55px rgba(0,0,0,.16);
  }
  .browser-bar { height: 30px; padding: 0 9px; }
  .browser-page { height: calc(100% - 30px); padding: 13px; }
  .browser-nav b { font-size: 18px; }
  .browser-nav small { padding: 6px 7px; }
  .browser-hero > span { font-size: 7px; }
  .browser-hero strong {
    font-size: clamp(28px, 9.4vw, 43px);
    line-height: .88;
    margin: 11px 0 15px;
  }
  .browser-hero button { padding: 8px 9px; font-size: 7px; }
  .browser-grid span { padding-top: 9px; font-size: 7px; }

  .stage-phone {
    width: min(36%, 124px);
    right: 0;
    bottom: 2%;
    border-width: 4px;
    border-radius: 23px;
    transform: rotate(-2.5deg);
  }
  .phone-speaker { top: 7px; height: 13px; }
  .phone-ui { padding: 29px 10px 13px; }
  .phone-ui > span { font-size: 16px; }
  .phone-ui small { margin-top: 20px; font-size: 6px; }
  .phone-ui strong { font-size: clamp(18px, 5.8vw, 24px); line-height: .92; margin-top: 9px; }
  .phone-pill { padding-top: 9px; font-size: 6px; }

  .section { padding: 72px 0; }
  .section-head { margin-bottom: 40px; gap: 10px; }
  .section-head h2 { font-size: clamp(39px, 12vw, 58px); line-height: .98; letter-spacing: -.052em; }
  .section-head p { font-size: 16px; line-height: 1.55; margin-top: 16px; }

  .lab-section { padding: 70px 0; }
  .lab-heading { margin-bottom: 36px; gap: 22px; }
  .lab-heading h2 { font-size: clamp(41px, 12.5vw, 62px); line-height: .96; }
  .lab-heading > p { font-size: 16px; line-height: 1.55; }
  .lab-toolbar { display: flex; align-items: center; gap: 8px; overflow-x: auto; padding: 9px 10px; scrollbar-width: none; }
  .lab-toolbar::-webkit-scrollbar { display: none; }
  .lab-tabs { flex: 0 0 auto; }
  .lab-tab { min-height: 38px; padding: 8px 9px; font-size: 9px; }
  .lab-file { flex: 0 0 auto; margin-left: auto; white-space: nowrap; font-size: 7px; }
  .lab-canvas { min-height: 360px; padding: 17px; }
  .mini-site { min-height: 286px; box-shadow: 9px 9px 0 rgba(17,17,17,.12); }
  .mini-nav, .mini-foot { padding: 10px 11px; font-size: 7px; }
  .mini-content { padding: 20px; }
  .mini-content small { font-size: 7px; }
  .mini-content strong { font-size: clamp(31px, 9.5vw, 45px); line-height: .94; margin-top: 14px; }
  .mini-cta { margin-top: 20px; padding: 8px 10px; font-size: 7px; }
  .lab-explain { min-height: 0; padding: 30px 20px 34px; }
  .lab-index { margin-bottom: 25px; }
  .lab-explain h3 { font-size: clamp(31px, 9vw, 44px); line-height: 1.02; }
  .lab-explain > p:not(.lab-index) { margin-top: 18px; }
  .lab-points { margin-top: 30px; }
  .stack-rail span { flex: 1 1 50%; padding: 11px 8px; font-size: 8px; }

  .transform-section { padding: 76px 0; }
  .transform-head { gap: 18px; margin-bottom: 38px; }
  .transform-head h2 { font-size: clamp(41px, 12vw, 58px); line-height: .96; }
  .transform-head > p:last-child { font-size: 15px; }
  .compare-board { padding-top: 12px; }
  .compare-labels { font-size: 8px; letter-spacing: .08em; gap: 12px; }
  .compare-window { height: clamp(430px, 128vw, 500px); }
  .compare-base { padding: 18px 16px; }
  .compare-top { padding-bottom: 10px; font-size: 7px; }
  .compare-after-body, .compare-before-body { max-width: 100%; height: calc(100% - 20px); }
  .compare-after-body small, .compare-before-body small { font-size: 7px; }
  .compare-after-body strong {
    font-size: clamp(44px, 15vw, 62px);
    line-height: .83;
    margin: 15px 0 18px;
  }
  .compare-after-body p { max-width: 84%; font-size: 14px; line-height: 1.42; }
  .compare-cta { margin-top: 19px; padding: 10px 12px; font-size: 7px; }
  .compare-before-body strong { font-size: clamp(29px, 9vw, 38px); margin: 14px 0; }
  .compare-before-body p { max-width: 85%; font-size: 13px; line-height: 1.42; }
  .fake-lines { margin-top: 18px; gap: 7px; }
  .fake-lines i { height: 6px; }
  .compare-range { touch-action: pan-y; }
  .compare-handle span { width: 42px; height: 42px; }
  .compare-note { font-size: 8px; line-height: 1.55; }

  .featured-case { gap: 34px; }
  .case-device-frame { min-height: 410px; padding: 14px; }
  .case-browser { left: 0; top: 15%; width: 92%; height: 58%; border-radius: 7px; }
  .case-browser-bar { height: 27px; padding: 0 8px; font-size: 6px; }
  .q4-screen { height: calc(100% - 27px); padding: 10px; }
  .q4-nav { font-size: 6px; padding-bottom: 7px; }
  .q4-nav b { font-size: 12px; }
  .q4-nav em { padding: 6px; }
  .q4-hero small { font-size: 6px; }
  .q4-hero strong { font-size: clamp(27px, 8.6vw, 38px); line-height: .88; margin: 8px 0; }
  .q4-hero p { font-size: 9px; line-height: 1.35; max-width: 70%; }
  .q4-strip { padding-top: 7px; font-size: 5.5px; }
  .case-mobile {
    width: min(32%, 108px);
    right: 0;
    bottom: 2%;
    border-width: 4px;
    border-radius: 21px;
    padding: 27px 9px 12px;
  }
  .case-mobile-notch { top: 6px; height: 11px; }
  .case-mobile small { font-size: 6px; }
  .case-mobile strong { font-size: clamp(17px, 5vw, 22px); line-height: .95; margin-top: 15px; }
  .case-mobile span { padding-top: 8px; font-size: 5.5px; }
  .case-copy h3 { font-size: clamp(34px, 10vw, 48px); line-height: 1; }
  .case-copy p { font-size: 16px; }
  .case-stats { gap: 0; }

  .project-list[style] { margin-top: 54px !important; }
  .project-row { gap: 12px 14px; padding: 22px 0; }
  .project-title { font-size: 26px; line-height: 1.04; }
  .project-desc { font-size: 14px; line-height: 1.52; }

  .services-grid { display: block; }
  .service-card,
  .service-card + .service-card { min-height: 0; padding: 23px 0 31px; border-left: 0; }
  .service-card h3 { margin: 36px 0 14px; font-size: 31px; }
  .service-card p { font-size: 15px; }
  .service-card ul { margin-top: 22px; }

  .system-section { padding: 74px 0 88px; }
  .system-head { gap: 16px; margin-bottom: 38px; }
  .system-head h2 { font-size: clamp(42px, 12.5vw, 60px); line-height: .95; }
  .layer-card { gap: 14px; padding: 23px 18px; grid-template-columns: 32px minmax(0,1fr); }
  .layer-card h3 { font-size: clamp(30px, 9vw, 42px); line-height: 1; }
  .layer-card > p { line-height: 1.5; }

  .signal-section { padding: 76px 0; }
  .signal-title { gap: 17px; margin-bottom: 38px; }
  .signal-title h2 { font-size: clamp(55px, 20vw, 82px); line-height: .82; letter-spacing: -.07em; }
  .signal-title > p:last-child { font-size: 15px; }
  .signal-card,
  .signal-card + .signal-card { min-height: 0; padding: 27px 0 32px; border-right: 0; }
  .signal-icon { width: 82px; height: 82px; margin: 24px 0 12px; }
  .signal-card h3 { margin: 26px 0 12px; font-size: 31px; }
  .signal-card p { font-size: 14px; }
  .proof-rail { margin-top: 32px; }
  .proof-rail span { padding: 14px 8px; font-size: 8px; line-height: 1.3; }

  .process-step { grid-template-columns: 36px minmax(0,1fr); gap: 14px; padding: 24px 0 28px; }
  .process-step h3 { font-size: 30px; line-height: 1; }
  .process-step p { grid-column: 2; font-size: 15px; line-height: 1.55; }

  .faq-wide summary { padding: 21px 0; font-size: 20px; line-height: 1.25; }
  .faq-wide details p { font-size: 15px; line-height: 1.55; padding-bottom: 22px; }

  .contact-layout { gap: 42px; }
  .contact-intro h2 { font-size: clamp(41px, 12vw, 58px); line-height: .98; }
  .contact-intro p { font-size: 16px; }
  .contact-intro::after { margin-top: 28px; font-size: 82px; }
  .contact-form { gap: 18px; }
  .field input, .field textarea, .field select { font-size: 16px; }
  .consent { align-items: flex-start; line-height: 1.45; }
  .submit-row { gap: 13px; align-items: flex-start; flex-direction: column; }
  .submit-btn { min-height: 48px; width: 100%; }

  .page-hero { padding: 62px 0 48px; }
  .page-hero h1 { font-size: clamp(44px, 14vw, 68px); line-height: .93; letter-spacing: -.058em; }
  .page-hero .lead { margin-top: 30px; font-size: 18px; line-height: 1.34; }
  .article-body h2 { font-size: clamp(34px, 10.5vw, 48px); line-height: 1; }

  .site-footer-v3 { padding-top: 38px; }
  .footer-kicker { flex-direction: column; align-items: flex-start; gap: 8px; line-height: 1.35; }
  .footer-main { padding: 48px 0 36px; gap: 38px; }
  .site-footer-v3 .footer-cta { font-size: clamp(34px, 11vw, 48px); line-height: .9; letter-spacing: -.055em; }
  .footer-columns { grid-template-columns: 1fr; gap: 28px; }
  .footer-columns > div { gap: 10px; }
  .footer-columns a { font-size: 13px; line-height: 1.35; }
  .footer-signature {
    font-size: min(22vw, 120px);
    line-height: .78;
    letter-spacing: -.075em;
    padding: 22px 0 31px;
    overflow: visible;
  }
  .site-footer-v3 .footer-bottom { margin-top: 0; padding-top: 16px; font-size: 9px; line-height: 1.5; }

  .project-float { left: max(10px, env(safe-area-inset-left)); bottom: max(10px, env(safe-area-inset-bottom)); padding: 10px 12px; }
  .back-top { right: max(10px, env(safe-area-inset-right)); bottom: max(10px, env(safe-area-inset-bottom)); }

  .admin-shell { padding-inline: max(16px, env(safe-area-inset-left)); }
  .admin-head { height: 64px; gap: 10px; font-size: 10px; }
  .admin-auth { min-height: 0; padding: 42px 0 56px; gap: 36px; }
  .admin-auth-visual { padding-top: 0; }
  .admin-auth-visual h1 { font-size: clamp(46px, 14vw, 62px); line-height: .86; margin: 26px 0 20px; }
  .admin-auth-visual > p { font-size: 15px; }
  .admin-orbit { margin-top: 34px; }
  .admin-login-card { padding: 24px 19px; box-shadow: 8px 8px 0 #222; }
  .admin-login-top { gap: 8px; flex-wrap: wrap; }
  .admin-login-card h2 { font-size: 38px; }
  .admin-dashboard { padding: 52px 0; }
  .admin-dashboard-title { gap: 24px; }
  .admin-dashboard-title h1 { font-size: clamp(52px, 16vw, 72px); line-height: .86; }
  .admin-stats { margin-bottom: 44px; }
  .lead-card { padding: 19px 17px; }
  .lead-card h2 { font-size: 30px; }
  .lead-message { margin: 22px 0; }
  .lead-meta a, .lead-meta span { overflow-wrap: anywhere; }
  .empty-state { padding: 38px 18px; }
}

@media (max-width: 380px) {
  :root { --gutter: 16px; }
  .brand span:last-child { font-size: 10px; }
  .nav-toggle { min-width: 70px; padding-inline: 9px; }
  .hero h1 { font-size: 47px; }
  .hero-copy { font-size: 18px; }
  .hero-stage { min-height: 395px; }
  .stage-phone { width: 34%; }
  .browser-hero strong { font-size: 28px; }
  .compare-window { height: 430px; }
  .compare-after-body strong { font-size: 44px; }
  .case-device-frame { min-height: 390px; }
  .footer-signature { font-size: 21vw; }
  .menu-main a strong { font-size: 36px; }
  .menu-panel-top { font-size: 9px; }
}

@media (hover: none), (pointer: coarse) {
  .service-card:hover { background: transparent; transform: none; }
  .service-card:hover::after { opacity: 0; }
  .lead-card:hover { transform: none; }
  .menu-main a:hover { color: inherit; padding-left: 0; }
  .menu-main a:hover::before { transform: translateY(102%); }
}

/* V3.2 / ADMIN FEEDBACK */
.admin-login-card button:disabled,
.admin-actions button:disabled { opacity: .52; cursor: wait; transform: none !important; }
.admin-message { min-height: 1.4em; }