/*
 * Version 6.1 visual system.
 * This is a web approximation of white liquid glass, not an Apple platform API.
 * The content model and page sequence stay intact while presentation scale, material,
 * type hierarchy, and feedback states use cold-white glass with pale ice-blue decoration
 * and a separate steel-blue token for readable accent text.
 */

:root {
  --presentation-scale: 1.75;
  --paper: #f8fbff;
  --paper-strong: #fdfefe;
  --surface: rgb(255 255 255 / 0.72);
  --surface-strong: rgb(255 255 255 / 0.88);
  --surface-tint: rgb(235 246 255 / 0.72);
  --ink: #435f79;
  --muted: #546c83;
  --line: rgb(122 170 212 / 0.18);
  --accent: #8fbce5;
  --accent-text: #507392;
  --accent-deep: #507392;
  --accent-soft: #edf7ff;
  --red: var(--accent);
  --teal: var(--accent);
  --teal-deep: var(--accent-text);
  --shell: 1320px;
  --panel-radius: 26px;
  --media-radius: 20px;
  --control-radius: 999px;
  --glass-border: rgb(255 255 255 / 0.9);
  --glass-shadow: 0 28px 76px rgb(77 113 148 / 0.12), inset 0 1px 0 rgb(255 255 255 / 0.98), inset 0 -1px 0 rgb(132 180 222 / 0.07);
  --ease-premium: cubic-bezier(0.16, 1, 0.3, 1);
  --font-display: "Ma Shan Zheng", "STXingkai", "Xingkai SC", "KaiTi", "STKaiti", serif;
  --font-body: "Noto Serif SC", "Songti SC", "STSong", "SimSun", serif;
  --font-ui: -apple-system, BlinkMacSystemFont, "SF Pro Display", "PingFang SC", "Noto Sans SC", "Microsoft YaHei", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--paper); }
body {
  min-width: 320px;
  margin: 0;
  color: var(--ink);
  background:
    linear-gradient(126deg, var(--paper) 0%, var(--paper-strong) 42%, var(--accent-soft) 100%);
  font-family: var(--font-ui);
  font-size: calc(15px * var(--presentation-scale));
  font-variant-numeric: tabular-nums;
  line-height: 1.62;
  text-rendering: optimizeLegibility;
}
img { display: block; width: 100%; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }

/* Calligraphy is reserved for display moments; long-form copy uses a readable Chinese serif. */
main p, main li, .reference-title-block span, .factory-summary, .faq-answer p { font-family: var(--font-body); }
.hero-reference-copy p, .reference-title-block > p, .process-heading > p, .reference-closing p:first-child, .stats-grid p, .factory-strip-frame > div > p { font-family: var(--font-ui); }
.hero-reference-copy h1, .reference-title-block h2, .process-heading h2, .reference-closing h2, .intro-copy h2, .solution-copy-card h3, .choice-feature-grid article h3, .factory-strip-frame h2 {
  font-family: var(--font-display);
  font-weight: 400;
  letter-spacing: 0;
  text-shadow: 0 1px 0 rgb(255 255 255 / 0.96), 0 12px 28px rgb(80 115 146 / 0.18);
}
.reference-title-block h2 .latin-glyph { display: inline-block; margin-inline: 0.025em; font-family: Arial, "Helvetica Neue", sans-serif; font-size: 0.84em; font-style: normal; font-weight: 700; line-height: 1; vertical-align: 0.04em; }
.capability-grid h3, .reference-gallery h3, .reference-process-grid h3, .faq-item button { font-family: var(--font-body); }

/* A fixed pearlescent field gives blur material something to refract without decorative orbs. */
body::before {
  position: fixed;
  inset: 0;
  z-index: -1;
  background:
    linear-gradient(115deg, rgb(224 240 254 / 0.42), transparent 36%),
    linear-gradient(300deg, rgb(235 246 255 / 0.55), transparent 48%);
  content: "";
  pointer-events: none;
}

.page-shell { width: min(calc(100% - calc(48px * var(--presentation-scale))), var(--shell)); margin: 0 auto; }
.scroll-threshold { position: absolute; top: calc(400px * var(--presentation-scale)); width: 1px; height: 1px; pointer-events: none; }

/* Sticky compact navigation, with the highlighter edge and refraction expected from web glass. */
.reference-header {
  position: sticky;
  top: 0;
  z-index: 30;
  border-bottom: 1px solid var(--glass-border);
  background: rgb(255 255 255 / 0.78);
  box-shadow: 0 10px 32px rgb(102 143 181 / 0.09), inset 0 -1px 0 rgb(132 180 222 / 0.07);
  backdrop-filter: blur(28px) saturate(145%);
  -webkit-backdrop-filter: blur(28px) saturate(145%);
}
.reference-header-inner { display: flex; min-height: calc(44px * var(--presentation-scale)); align-items: center; justify-content: space-between; }
.reference-brand { display: inline-flex; align-items: center; gap: calc(5px * var(--presentation-scale)); font-size: calc(10px * var(--presentation-scale)); font-weight: 800; letter-spacing: 0; }
.reference-brand img { width: calc(15px * var(--presentation-scale)); height: calc(15px * var(--presentation-scale)); object-fit: contain; }
.reference-nav { display: flex; align-items: center; gap: calc(18px * var(--presentation-scale)); }
.reference-nav a { color: var(--muted); font-size: calc(9px * var(--presentation-scale)); font-weight: 700; transition: color 220ms ease; }
.reference-nav a:hover { color: var(--accent-text); }
.header-consult, .mini-consult, .copy-phone, .factory-strip-frame a {
  border: 1px solid rgb(143 188 229 / 0.34);
  border-radius: var(--control-radius);
  color: var(--accent-text);
  background: linear-gradient(135deg, var(--paper-strong), var(--accent-soft));
  box-shadow: 0 10px 24px rgb(108 151 190 / 0.14), inset 0 1px 0 rgb(255 255 255 / 0.98);
  font-weight: 800;
  transition: transform 220ms ease, box-shadow 220ms ease;
}
.header-consult { padding: calc(3px * var(--presentation-scale)) calc(8px * var(--presentation-scale)); font-size: calc(9px * var(--presentation-scale)); }

/* Runtime-owned classes keep media depth and consultation feedback reusable without altering markup. */
.hover-media { overflow: hidden; }
.hover-media img {
  transition: transform 900ms var(--ease-premium), filter 500ms ease;
}
.consult-control {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}
.consult-control::after {
  position: absolute;
  top: 0;
  bottom: 0;
  left: -42%;
  z-index: -1;
  width: 28%;
  background: linear-gradient(90deg, transparent, rgb(255 255 255 / 0.54), transparent);
  content: "";
  pointer-events: none;
  transform: skewX(-18deg);
  transition: left 620ms var(--ease-premium);
}

/* One full-bleed cool-gray villa scene replaces the split warm photo panel; its quiet left field owns the exact hero copy. */
.hero-reference {
  position: relative;
  min-height: clamp(660px, calc(100svh - 122px), 880px);
  overflow: hidden;
  background: #dfe8f0;
}
.hero-reference::after {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(90deg, rgb(248 251 255 / 0.78) 0%, rgb(248 251 255 / 0.62) 40%, rgb(248 251 255 / 0.12) 72%, transparent 100%), linear-gradient(180deg, rgb(248 251 255 / 0.12) 0%, transparent 62%, rgb(225 235 244 / 0.3) 100%);
  content: "";
  pointer-events: none;
}
.hero-reference > .page-shell {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  min-height: inherit;
  pointer-events: none;
}
.hero-reference-copy {
  position: relative;
  z-index: 2;
  width: min(760px, 58vw);
  max-width: none;
  margin: 0;
  color: var(--accent-text);
  text-align: left;
  text-shadow: 0 1px 18px rgb(248 251 255 / 0.76);
}
.hero-reference-copy p { margin: 0 0 calc(4px * var(--presentation-scale)); font-size: calc(15px * var(--presentation-scale)); font-weight: 800; }
.hero-reference-copy h1 { margin: 0; font-size: clamp(38px, 4.25vw, 51px); line-height: 1.22; font-weight: 850; text-wrap: balance; }
.hero-reference-copy h1 em, .reference-closing h2 em { font-style: normal; white-space: nowrap; }
.hero-reference-copy span { display: block; margin-top: calc(5px * var(--presentation-scale)); color: var(--muted); font-size: calc(10px * var(--presentation-scale)); font-weight: 600; }
.hero-reference-copy .hero-license { margin-bottom: calc(7px * var(--presentation-scale)); color: var(--accent-text); font-size: calc(12px * var(--presentation-scale)); font-weight: 800; }
.hero-reference-copy strong { display: block; margin-top: calc(8px * var(--presentation-scale)); color: var(--accent-text); font-size: calc(18px * var(--presentation-scale)); line-height: 1.3; }
.hero-reference-copy small { display: block; margin-top: calc(6px * var(--presentation-scale)); color: var(--muted); font-size: calc(9px * var(--presentation-scale)); font-weight: 700; }
.hero-reference-gallery { position: absolute; inset: 0; z-index: 0; height: 100%; overflow: hidden; border: 0; border-radius: 0; box-shadow: none; }
.hero-photo { min-width: 0; height: 100%; margin: 0; overflow: hidden; }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; }
.hero-photo-master img { object-position: center; }

/* The factual rail is one contained glass surface, not four separate cards. */
.reference-stats { padding: 0 0 calc(32px * var(--presentation-scale)); }
.stats-frame {
  padding: calc(17px * var(--presentation-scale)) calc(16px * var(--presentation-scale)) calc(14px * var(--presentation-scale));
  border: 1px solid var(--glass-border);
  border-radius: var(--panel-radius);
  background: var(--surface);
  box-shadow: var(--glass-shadow);
  backdrop-filter: blur(26px) saturate(145%);
  -webkit-backdrop-filter: blur(26px) saturate(145%);
}
.stats-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.stats-grid article { position: relative; padding: 0 calc(15px * var(--presentation-scale)); text-align: center; }
.stats-grid article + article::before { position: absolute; top: calc(6px * var(--presentation-scale)); bottom: calc(6px * var(--presentation-scale)); left: 0; width: 1px; background: var(--line); content: ""; }
.stats-grid strong { display: block; color: var(--accent-text); font-size: calc(27px * var(--presentation-scale)); line-height: 1; font-weight: 850; }
.stats-grid strong[data-roll-year] { display: flex; align-items: baseline; justify-content: center; }
.stats-grid strong > span:not(.year-roller) { font-size: 0.56em; }
.stats-grid p { margin: calc(7px * var(--presentation-scale)) 0 0; color: var(--muted); font-size: calc(10px * var(--presentation-scale)); font-weight: 700; line-height: 1.48; text-wrap: pretty; }
.year-roller { display: inline-flex; align-items: flex-end; font-size: 1em; font-variant-numeric: tabular-nums; }
.year-digit-window { display: inline-block; width: 0.61em; height: 1em; overflow: hidden; line-height: 1; }
.year-digit-track { display: flex; flex-direction: column; transform: translateY(0); transition: transform var(--year-duration) var(--ease-premium) var(--year-delay); }
.year-digit-track > span { display: block; width: 100%; height: 1em; flex: 0 0 1em; font-size: 1em; line-height: 1; }
.is-rolling .year-digit-track { transform: translateY(var(--year-distance)); }
.is-resetting .year-digit-track { transition: none; }
.mini-consult, .copy-phone { display: table; margin: calc(12px * var(--presentation-scale)) auto 0; padding: calc(5px * var(--presentation-scale)) calc(10px * var(--presentation-scale)); font-size: calc(10px * var(--presentation-scale)); }

/* Generated imagery gives quiet bands material depth without competing with real elevator photos. */
.reference-intro, #advantages, .choice-reference, .process-reference, .faq-reference, .reference-closing {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}
.reference-intro > .page-shell, #advantages > .page-shell, .choice-reference > .page-shell, .process-reference > .page-shell, .faq-reference > .page-shell, .reference-closing > .page-shell {
  position: relative;
  z-index: 1;
}
.reference-intro::before, .choice-reference::before, .reference-closing::before,
#advantages::before, .process-reference::before, .faq-reference::before {
  position: absolute;
  inset: -10px 0;
  z-index: 0;
  background-position: center;
  background-size: cover;
  content: "";
  opacity: 0.24;
  pointer-events: none;
  transform: translateY(0);
  transition: transform 820ms var(--ease-premium), opacity 720ms ease;
}
.reference-intro::before, .choice-reference::before, .reference-closing::before {
  background-image: linear-gradient(rgb(248 251 255 / 0.5), rgb(248 251 255 / 0.74)), url("../backgrounds/pearl-architectural-light.webp");
}
#advantages::before, .process-reference::before, .faq-reference::before {
  background-image: linear-gradient(rgb(248 251 255 / 0.48), rgb(248 251 255 / 0.7)), url("../backgrounds/elevator-blueprint-relief.webp");
}

/* Large bands stay open and light. Glass is reserved for components that need a surface. */
.reference-section, .reference-intro { padding: clamp(96px, 8vw, 122px) 0 clamp(112px, 9vw, 138px); }
.reference-soft { background: rgb(224 240 254 / 0.28); }
.reference-title-block { max-width: 1040px; margin: 0 auto calc(32px * var(--presentation-scale)); text-align: center; }
.reference-title-block p, .process-heading p, .reference-closing p { margin: 0 0 calc(6px * var(--presentation-scale)); color: var(--accent-text); font-size: calc(12px * var(--presentation-scale)); font-weight: 800; text-decoration: underline; text-decoration-color: rgb(143 188 229 / 0.52); text-decoration-thickness: 3px; text-underline-offset: calc(5px * var(--presentation-scale)); }
.reference-title-block h2, .process-heading h2, .reference-closing h2 { margin: 0; color: var(--ink); font-size: clamp(42px, 5.45vw, 66px); line-height: 1.16; font-weight: 900; text-wrap: balance; }
.reference-title-block span { display: block; max-width: 76ch; margin: calc(11px * var(--presentation-scale)) auto 0; color: var(--muted); font-size: calc(11px * var(--presentation-scale)); font-weight: 500; line-height: 1.72; text-wrap: pretty; }
.compact-title { margin-bottom: calc(28px * var(--presentation-scale)); }

/* The factory story becomes a full-image editorial lead followed by balanced long-form copy. */
.reference-intro { padding-top: calc(32px * var(--presentation-scale)); }
.intro-grid { display: grid; grid-template-columns: 1fr; gap: calc(28px * var(--presentation-scale)); align-items: start; }
.intro-copy {
  padding: calc(28px * var(--presentation-scale));
  border: 1px solid var(--glass-border);
  border-radius: var(--panel-radius);
  background: var(--surface);
  box-shadow: var(--glass-shadow);
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
}
.intro-label { margin: 0 0 calc(10px * var(--presentation-scale)); color: var(--accent-text); font-size: calc(11px * var(--presentation-scale)); font-weight: 800; }
.intro-copy h2 { margin: 0 0 calc(16px * var(--presentation-scale)); color: var(--ink); font-size: calc(26px * var(--presentation-scale)); line-height: 1.2; font-weight: 850; }
.intro-prose { column-count: 2; column-gap: calc(32px * var(--presentation-scale)); column-rule: 1px solid var(--line); }
.intro-prose > p { margin: 0 0 calc(14px * var(--presentation-scale)); break-inside: avoid; color: var(--muted); font-size: calc(11px * var(--presentation-scale)); line-height: 1.92; text-align: justify; text-wrap: pretty; }
.intro-prose > p:last-child { margin-bottom: 0; }
.copy-phone { margin: calc(17px * var(--presentation-scale)) 0 0; }
.intro-factory { position: relative; top: auto; order: -1; width: min(100%, 980px); height: auto; min-height: 0; margin: 0 auto; overflow: hidden; border: 1px solid var(--glass-border); border-radius: var(--panel-radius); background: rgb(255 255 255 / 0.5); box-shadow: var(--glass-shadow); }
.intro-factory img { height: auto; object-fit: contain; }
.intro-factory figcaption { position: absolute; right: calc(10px * var(--presentation-scale)); bottom: calc(10px * var(--presentation-scale)); padding: 0; border: 0; border-radius: 0; color: #fff; background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; font-size: calc(10px * var(--presentation-scale)); font-weight: 800; text-shadow: 0 2px 10px rgb(17 38 55 / 0.88), 0 1px 2px rgb(17 38 55 / 0.96); }
.intro-factory .copy-phone { padding: 0; border: 0; border-radius: 0; color: inherit; background: transparent; box-shadow: none; }
.intro-factory .copy-phone::after { display: none; }
.intro-factory .copy-phone:hover, .intro-factory .copy-phone:active { background: transparent; box-shadow: none; transform: none; }

/* Shared glass grids use a single outer surface and fine separators for information density. */
.capability-grid, .reference-process-grid {
  display: grid;
  overflow: hidden;
  border: 1px solid var(--glass-border);
  border-radius: var(--panel-radius);
  background: var(--surface);
  box-shadow: var(--glass-shadow);
  backdrop-filter: blur(22px) saturate(140%);
  -webkit-backdrop-filter: blur(22px) saturate(140%);
}
.capability-grid { grid-template-columns: repeat(4, 1fr); }
.capability-grid article { position: relative; min-height: calc(148px * var(--presentation-scale)); padding: calc(18px * var(--presentation-scale)) calc(13px * var(--presentation-scale)); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.capability-grid article:nth-child(4n) { border-right: 0; }
.capability-grid article:nth-last-child(-n + 4) { border-bottom: 0; }
.capability-icon { display: block; width: calc(28px * var(--presentation-scale)); height: calc(28px * var(--presentation-scale)); margin-bottom: calc(16px * var(--presentation-scale)); object-fit: contain; }
.capability-number { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
.capability-grid h3 { margin: 0 0 calc(5px * var(--presentation-scale)); font-size: calc(13px * var(--presentation-scale)); line-height: 1.3; }
.capability-grid p { margin: 0; color: var(--muted); font-size: calc(10px * var(--presentation-scale)); line-height: 1.62; }

/* Product cards use real imagery and a translucent caption surface below, never a fake UI overlay. */
.product-reference { padding-bottom: clamp(112px, 11vw, 144px); }
.reference-gallery { display: grid; gap: calc(9px * var(--presentation-scale)); }
.reference-gallery-eight, .reference-gallery-six { grid-template-columns: repeat(4, 1fr); }
.reference-gallery-six { margin-top: calc(25px * var(--presentation-scale)); }
.reference-gallery article { min-width: 0; overflow: hidden; border: 1px solid var(--glass-border); border-radius: var(--media-radius); background: var(--surface-strong); box-shadow: 0 18px 42px rgb(77 113 148 / 0.1), inset 0 1px 0 rgb(255 255 255 / 0.98); }
.reference-gallery img { aspect-ratio: 0.87; object-fit: cover; }
.reference-gallery h3 { margin: 0; padding: calc(9px * var(--presentation-scale)) calc(9px * var(--presentation-scale)) 0; color: var(--accent-text); font-size: calc(11px * var(--presentation-scale)); line-height: 1.36; font-weight: 850; text-wrap: balance; }
.reference-gallery p { margin: 0; padding: calc(3px * var(--presentation-scale)) calc(8px * var(--presentation-scale)) calc(9px * var(--presentation-scale)); color: var(--muted); font-size: calc(9px * var(--presentation-scale)); line-height: 1.48; }
.reference-gallery-six img { aspect-ratio: 0.99; }
.reference-gallery-six h3 { min-height: calc(31px * var(--presentation-scale)); padding: calc(7px * var(--presentation-scale)) calc(6px * var(--presentation-scale)); font-size: calc(10px * var(--presentation-scale)); }

/* Existing scenario sequence is retained, while the text panel becomes a readable glass control surface. */
.selection-reference { padding-top: clamp(112px, 11vw, 144px); }
.solution-lead-grid { display: grid; grid-template-columns: 0.95fr 2fr; gap: calc(7px * var(--presentation-scale)); }
.solution-lead-grid figure { position: relative; min-width: 0; margin: 0; overflow: hidden; border-radius: var(--media-radius); }
.solution-lead-grid figure img { height: calc(315px * var(--presentation-scale)); object-fit: cover; }
.solution-lead-grid figcaption, .choice-feature-grid figcaption { position: absolute; top: calc(10px * var(--presentation-scale)); left: calc(10px * var(--presentation-scale)); padding: calc(5px * var(--presentation-scale)) calc(8px * var(--presentation-scale)); border-radius: var(--control-radius); color: var(--ink); background: rgb(255 255 255 / 0.82); box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.95); font-size: calc(9px * var(--presentation-scale)); font-weight: 800; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); }
.solution-copy-card { display: flex; min-height: calc(315px * var(--presentation-scale)); flex-direction: column; align-items: flex-start; padding: calc(28px * var(--presentation-scale)) calc(24px * var(--presentation-scale)); border: 1px solid var(--glass-border); border-radius: var(--media-radius); color: var(--ink); background: var(--surface); box-shadow: var(--glass-shadow); backdrop-filter: blur(24px) saturate(145%); -webkit-backdrop-filter: blur(24px) saturate(145%); }
.solution-copy-card p, .solution-copy-card h3, .solution-copy-card span { margin: 0; }
.solution-copy-card p { color: var(--accent-text); font-size: calc(11px * var(--presentation-scale)); font-weight: 800; }
.solution-copy-card h3 { margin: calc(16px * var(--presentation-scale)) 0 calc(15px * var(--presentation-scale)); font-size: calc(29px * var(--presentation-scale)); line-height: 1.18; }
.solution-copy-card span { color: var(--muted); font-size: calc(11px * var(--presentation-scale)); line-height: 1.75; }
.solution-copy-card ul { display: grid; gap: calc(5px * var(--presentation-scale)); margin: calc(12px * var(--presentation-scale)) 0 0; padding-left: calc(17px * var(--presentation-scale)); color: var(--muted); font-size: calc(10px * var(--presentation-scale)); line-height: 1.55; }
.solution-copy-card a { margin-top: auto; padding: calc(7px * var(--presentation-scale)) calc(11px * var(--presentation-scale)); border: 1px solid rgb(143 188 229 / 0.36); border-radius: var(--control-radius); color: var(--accent-text); background: var(--accent-soft); font-size: calc(10px * var(--presentation-scale)); font-weight: 800; transition: background 220ms ease, transform 220ms ease; }

/* The selection panel is a paired photo plus one glass reading surface. */
.choice-feature-grid { display: grid; grid-template-columns: 1.13fr 0.87fr; gap: calc(7px * var(--presentation-scale)); }
.choice-feature-grid figure { position: relative; margin: 0; overflow: hidden; border-radius: var(--media-radius); }
.choice-feature-grid figure img { height: calc(338px * var(--presentation-scale)); object-fit: cover; }
.choice-feature-grid article { padding: calc(33px * var(--presentation-scale)) calc(31px * var(--presentation-scale)); border: 1px solid var(--glass-border); border-radius: var(--media-radius); background: var(--surface); box-shadow: var(--glass-shadow); backdrop-filter: blur(24px) saturate(145%); -webkit-backdrop-filter: blur(24px) saturate(145%); }
.choice-feature-grid article p { margin: 0 0 calc(13px * var(--presentation-scale)); color: var(--accent-text); font-size: calc(11px * var(--presentation-scale)); font-weight: 800; }
.choice-feature-grid article h3 { margin: 0 0 calc(18px * var(--presentation-scale)); color: var(--ink); font-size: calc(28px * var(--presentation-scale)); line-height: 1.2; }
.choice-feature-grid article .choice-summary { margin: 0 0 calc(13px * var(--presentation-scale)); color: var(--muted); font-size: calc(11px * var(--presentation-scale)); font-weight: 500; line-height: 1.7; }
.choice-feature-grid ul { display: grid; gap: calc(7px * var(--presentation-scale)); margin: 0; padding: 0; list-style: none; color: var(--muted); font-size: calc(11px * var(--presentation-scale)); }
.choice-feature-grid li { padding-bottom: calc(7px * var(--presentation-scale)); border-bottom: 1px solid var(--line); }
.choice-feature-grid article a { display: inline-block; margin-top: calc(14px * var(--presentation-scale)); color: var(--accent-text); font-size: calc(10px * var(--presentation-scale)); font-weight: 800; }

/* Delivery keeps a clear sequence, with feedback through the same scale and surface language. */
.process-reference { padding-bottom: 0; }
.process-heading { display: flex; align-items: end; justify-content: space-between; gap: calc(25px * var(--presentation-scale)); margin-bottom: calc(30px * var(--presentation-scale)); }
.process-heading .mini-consult { margin: 0; }
.process-contact { display: grid; max-width: calc(390px * var(--presentation-scale)); justify-items: start; gap: calc(10px * var(--presentation-scale)); }
.process-contact > span { color: var(--muted); font-size: calc(10px * var(--presentation-scale)); line-height: 1.7; }
.reference-process-grid { grid-template-columns: repeat(6, 1fr); margin: 0; padding: 0; list-style: none; }
.reference-process-grid li { min-height: calc(150px * var(--presentation-scale)); padding: calc(17px * var(--presentation-scale)) calc(13px * var(--presentation-scale)); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.reference-process-grid li:nth-child(6n) { border-right: 0; }
.reference-process-grid li:nth-last-child(-n + 6) { border-bottom: 0; }
.reference-process-grid span { display: grid; width: calc(25px * var(--presentation-scale)); height: calc(25px * var(--presentation-scale)); place-items: center; margin-bottom: calc(15px * var(--presentation-scale)); border: 1px solid var(--accent); border-radius: 8px; color: var(--accent-text); background: var(--accent-soft); font-size: calc(9px * var(--presentation-scale)); font-weight: 800; box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.98); }
.reference-process-grid h3 { margin: 0 0 calc(5px * var(--presentation-scale)); font-size: calc(13px * var(--presentation-scale)); }
.reference-process-grid p { margin: 0; color: var(--muted); font-size: calc(10px * var(--presentation-scale)); line-height: 1.6; }

/* Factory proof is printed directly over the photograph; only the phone remains a glass control. */
.reference-factory-strip { padding: clamp(88px, 8vw, 116px) 0 clamp(112px, 10vw, 138px); background: rgb(224 240 254 / 0.46); }
.factory-strip-frame { position: relative; min-height: calc(382px * var(--presentation-scale)); overflow: hidden; border: 1px solid var(--glass-border); border-radius: var(--panel-radius); box-shadow: var(--glass-shadow); }
.factory-strip-frame > img { position: relative; z-index: 0; height: calc(382px * var(--presentation-scale)); object-fit: cover; }
.factory-strip-frame::after { position: absolute; inset: 0; z-index: 1; background: linear-gradient(90deg, rgb(24 49 70 / 0.86) 0%, rgb(38 66 90 / 0.66) 38%, rgb(61 88 111 / 0.24) 62%, transparent 84%); content: ""; pointer-events: none; }
.factory-strip-frame > div { position: absolute; left: calc(20px * var(--presentation-scale)); right: auto; bottom: calc(20px * var(--presentation-scale)); z-index: 2; width: min(calc(440px * var(--presentation-scale)), 55%); padding: calc(18px * var(--presentation-scale)) calc(20px * var(--presentation-scale)); border: 0; border-radius: 0; color: var(--paper-strong); background: transparent; box-shadow: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
.factory-strip-frame p { margin: 0 0 calc(5px * var(--presentation-scale)); color: #dcefff; font-size: calc(11px * var(--presentation-scale)); font-weight: 800; text-shadow: 0 2px 14px rgb(17 35 52 / 0.62); }
.factory-strip-frame h2 { margin: 0 0 calc(15px * var(--presentation-scale)); color: #fff; font-size: calc(28px * var(--presentation-scale)); line-height: 1.18; text-shadow: 0 3px 18px rgb(17 35 52 / 0.72); }
.factory-summary { display: block; color: rgb(248 251 255 / 0.94); font-size: calc(10px * var(--presentation-scale)); line-height: 1.65; text-shadow: 0 2px 12px rgb(17 35 52 / 0.68); }
.factory-strip-frame ul { display: flex; flex-wrap: wrap; gap: calc(6px * var(--presentation-scale)) calc(12px * var(--presentation-scale)); margin: calc(12px * var(--presentation-scale)) 0; padding: 0; color: rgb(237 247 255 / 0.92); font-size: calc(9px * var(--presentation-scale)); list-style: none; text-shadow: 0 2px 10px rgb(17 35 52 / 0.66); }
.factory-strip-frame a { position: relative; z-index: 3; display: inline-flex; min-height: 44px; align-items: center; padding: calc(5px * var(--presentation-scale)) calc(9px * var(--presentation-scale)); font-size: calc(10px * var(--presentation-scale)); }

/* FAQ keeps its scanning speed inside one quiet glass sheet. */
.faq-reference { padding-top: clamp(112px, 11vw, 144px); }
.faq-list { width: min(100%, 1090px); margin: 0 auto; overflow: hidden; border: 1px solid var(--glass-border); border-radius: var(--panel-radius); background: var(--surface); box-shadow: var(--glass-shadow); backdrop-filter: blur(22px) saturate(140%); -webkit-backdrop-filter: blur(22px) saturate(140%); }
.faq-item { border-bottom: 1px solid var(--line); }
.faq-item:last-child { border-bottom: 0; }
.faq-item h3 { margin: 0; }
.faq-item button { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: calc(22px * var(--presentation-scale)); padding: calc(16px * var(--presentation-scale)) calc(22px * var(--presentation-scale)); border: 0; color: var(--ink); background: transparent; text-align: left; font-size: calc(13px * var(--presentation-scale)); font-weight: 850; letter-spacing: 0; cursor: pointer; transition: background 220ms ease, color 220ms ease, box-shadow 220ms ease; }
.faq-item button span { color: var(--accent-text); font-size: calc(20px * var(--presentation-scale)); line-height: 1; transition: transform 220ms ease; }
.faq-item.is-open button { color: var(--accent-text); background: rgb(224 240 254 / 0.45); box-shadow: inset 3px 0 0 rgb(143 188 229 / 0.56); }
.faq-item.is-open button span { transform: rotate(45deg); }
.faq-answer { display: grid; grid-template-rows: 0fr; transition: grid-template-rows 260ms ease, padding 260ms ease; }
.faq-answer p { min-height: 0; margin: 0; overflow: hidden; color: var(--muted); font-size: calc(11px * var(--presentation-scale)); line-height: 1.8; }
.faq-item.is-open .faq-answer { grid-template-rows: 1fr; padding: 0 calc(22px * var(--presentation-scale)) calc(18px * var(--presentation-scale)); }

/* The final conversion block stays light, readable, and visibly interactive. */
.reference-closing { padding: clamp(108px, 10vw, 138px) 0; }
.closing-reference-grid { display: grid; grid-template-columns: 1.1fr 0.9fr; align-items: end; gap: calc(55px * var(--presentation-scale)); }
.reference-closing h2 { margin-bottom: calc(12px * var(--presentation-scale)); font-size: clamp(44px, 5.9vw, 72px); }
.reference-closing > .page-shell > div > span { color: var(--muted); font-size: calc(12px * var(--presentation-scale)); }
.closing-actions { display: flex; flex-wrap: wrap; gap: calc(10px * var(--presentation-scale)); margin-top: calc(18px * var(--presentation-scale)); }
.closing-actions a { padding: calc(8px * var(--presentation-scale)) calc(13px * var(--presentation-scale)); border: 1px solid rgb(143 188 229 / 0.42); border-radius: var(--control-radius); color: var(--accent-text); background: var(--paper-strong); font-size: calc(10px * var(--presentation-scale)); font-weight: 800; }
.closing-actions a:first-child { color: var(--paper); background: var(--accent-text); }
.closing-reference-grid > a { display: grid; gap: calc(5px * var(--presentation-scale)); padding: calc(22px * var(--presentation-scale)) calc(24px * var(--presentation-scale)); border: 1px solid var(--glass-border); border-right: 5px solid var(--accent); border-radius: var(--panel-radius); color: var(--ink); background: var(--surface-strong); box-shadow: var(--glass-shadow); backdrop-filter: blur(24px) saturate(145%); -webkit-backdrop-filter: blur(24px) saturate(145%); transition: transform 220ms ease, box-shadow 220ms ease; }
.closing-reference-grid small { color: var(--muted); font-size: calc(11px * var(--presentation-scale)); }
.closing-reference-grid strong { color: var(--accent-text); font-size: calc(34px * var(--presentation-scale)); line-height: 1; }
.closing-reference-grid b { color: var(--accent-text); font-size: calc(11px * var(--presentation-scale)); }
.reference-footer { padding: calc(32px * var(--presentation-scale)) 0 calc(18px * var(--presentation-scale)); border-top: 1px solid var(--glass-border); color: var(--muted); background: rgb(224 240 254 / 0.55); font-size: calc(10px * var(--presentation-scale)); }
.reference-footer .footer-main { display: grid; grid-template-columns: 1.6fr 0.7fr 0.9fr; align-items: start; gap: calc(32px * var(--presentation-scale)); }
.reference-footer h2 { margin: 0 0 calc(9px * var(--presentation-scale)); color: var(--ink); font-size: calc(11px * var(--presentation-scale)); }
.reference-footer p { margin: 0; line-height: 1.75; }
.footer-about { display: grid; gap: calc(12px * var(--presentation-scale)); }
.footer-products, .footer-contact { display: grid; justify-items: start; gap: calc(6px * var(--presentation-scale)); }
.footer-contact > a:first-of-type { color: var(--ink); font-size: calc(17px * var(--presentation-scale)); }
.footer-consult { margin-top: calc(5px * var(--presentation-scale)); padding: calc(6px * var(--presentation-scale)) calc(11px * var(--presentation-scale)); border-radius: var(--control-radius); color: var(--paper) !important; background: var(--accent-text); }
.reference-footer .footer-bottom { display: flex; align-items: center; justify-content: space-between; gap: calc(18px * var(--presentation-scale)); margin-top: calc(24px * var(--presentation-scale)); padding-top: calc(14px * var(--presentation-scale)); border-top: 1px solid var(--line); }
.reference-footer a { color: var(--accent-text); font-weight: 800; }
.to-top { position: fixed; right: calc(20px * var(--presentation-scale)); bottom: calc(20px * var(--presentation-scale)); z-index: 25; display: grid; width: calc(38px * var(--presentation-scale)); height: calc(38px * var(--presentation-scale)); place-items: center; padding: 0; border: 1px solid rgb(143 188 229 / 0.34); border-radius: var(--control-radius); color: var(--accent-text); background: linear-gradient(135deg, var(--paper-strong), var(--accent-soft)); box-shadow: 0 16px 36px rgb(108 151 190 / 0.16), inset 0 1px 0 rgb(255 255 255 / 0.98); opacity: 0; pointer-events: none; cursor: pointer; transform: translateY(calc(8px * var(--presentation-scale))) scale(0.94); transition: opacity 220ms ease, transform 220ms ease, box-shadow 220ms ease; }
.to-top.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0) scale(1); }

/* Persistent contact stays subordinate to the sticky header and preserves the right reading edge. */
.floating-phone {
  --phone-rest-transform: translateY(-50%);
  --phone-hover-transform: translateY(calc(-50% - 2px));
  --phone-active-transform: translateY(-50%) scale(0.98);
  position: fixed;
  top: 50%;
  right: calc(16px * var(--presentation-scale));
  z-index: 28;
  display: grid;
  min-width: calc(104px * var(--presentation-scale));
  gap: calc(2px * var(--presentation-scale));
  padding: calc(9px * var(--presentation-scale)) calc(11px * var(--presentation-scale));
  border: 1px solid rgb(143 188 229 / 0.42);
  border-radius: var(--control-radius);
  color: var(--accent-text);
  background: rgb(248 251 255 / 0.88);
  box-shadow: 0 18px 46px rgb(77 113 148 / 0.16), inset 0 1px 0 rgb(255 255 255 / 0.98);
  backdrop-filter: blur(24px) saturate(145%);
  -webkit-backdrop-filter: blur(24px) saturate(145%);
  font-variant-numeric: tabular-nums;
  text-align: center;
  transform: var(--phone-rest-transform);
  transition: transform 220ms var(--ease-premium), box-shadow 220ms ease, border-color 220ms ease;
}
.floating-phone span { color: var(--muted); font-size: calc(8px * var(--presentation-scale)); font-weight: 700; line-height: 1.2; }
.floating-phone strong { font-size: calc(10px * var(--presentation-scale)); font-weight: 850; line-height: 1.2; }

a:focus-visible, button:focus-visible { outline: 3px solid rgb(143 188 229 / 0.58); outline-offset: 4px; }

.is-spotlight {
  --spotlight-x: 50%;
  --spotlight-y: 50%;
  position: relative;
  isolation: isolate;
}
.is-spotlight::before {
  position: absolute;
  inset: 0;
  z-index: 6;
  padding: 1px;
  border-radius: inherit;
  background: radial-gradient(170px circle at var(--spotlight-x) var(--spotlight-y), #fff 0%, #cce8ff 30%, rgb(143 188 229 / 0.72) 48%, transparent 72%);
  content: "";
  opacity: 0;
  pointer-events: none;
  transition: opacity 180ms ease;
  -webkit-mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  mask: linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
  mask-composite: exclude;
}
.is-spotlight.has-pointer::before { opacity: 1; }

@media (hover: none), (pointer: coarse) {
  .is-spotlight::before { display: none; }
}

@media (hover: hover) and (prefers-reduced-motion: no-preference) {
  .consult-control:hover { box-shadow: 0 14px 30px rgb(108 151 190 / 0.18), inset 0 1px 0 rgb(255 255 255 / 0.98); transform: translateY(-2px); }
  .consult-control:hover::after { left: 116%; }
  .floating-phone.consult-control:hover { border-color: rgb(143 188 229 / 0.68); box-shadow: 0 24px 56px rgb(77 113 148 / 0.2), inset 0 1px 0 rgb(255 255 255 / 0.98); transform: var(--phone-hover-transform); }
  .hover-media:hover img { filter: saturate(1.035) contrast(1.01); transform: scale(1.05); will-change: transform; }
  .solution-copy-card a:hover { background: var(--paper); transform: translateY(-2px); }
  .faq-item:not(.is-open) button:hover { color: var(--accent-text); background: rgb(224 240 254 / 0.28); }
  .closing-reference-grid > a:hover { box-shadow: 0 30px 72px rgb(77 113 148 / 0.16), inset 0 1px 0 rgb(255 255 255 / 0.98); transform: translateY(-2px); }
  .to-top:hover { box-shadow: 0 20px 42px rgb(108 151 190 / 0.22), inset 0 1px 0 rgb(255 255 255 / 0.98); transform: translateY(-2px) scale(1.04); }
}

.consult-control:active, .solution-copy-card a:active, .to-top:active { transform: scale(0.98); }
.floating-phone.consult-control:active { transform: var(--phone-active-transform); }

/* Reveal candidates remain visible unless JavaScript confirms motion and observer support. */
.motion-ready .reveal-item {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 720ms ease var(--reveal-delay,0ms), transform 820ms var(--ease-premium) var(--reveal-delay,0ms);
}

.motion-ready .reveal-item.is-revealed {
  opacity: 1;
  transform: translateY(0);
}

@media (max-width: 900px) {
  :root { --presentation-scale: 1.38; --shell: 1120px; --panel-radius: 22px; --media-radius: 17px; }
  .intro-prose { column-count: 1; column-gap: 0; column-rule: 0; }
  .intro-factory { position: relative; top: auto; width: min(100%, 820px); height: auto; min-height: 0; }
  .capability-grid { grid-template-columns: repeat(3, 1fr); }
  .capability-grid article:nth-child(4n) { border-right: 1px solid var(--line); }
  .capability-grid article:nth-last-child(-n + 4) { border-bottom: 1px solid var(--line); }
  .capability-grid article:nth-child(3n) { border-right: 0; }
  .capability-grid article:nth-last-child(-n + 3) { border-bottom: 0; }
  .reference-gallery-eight, .reference-gallery-six { grid-template-columns: repeat(3, 1fr); }
  .reference-process-grid { grid-template-columns: repeat(3, 1fr); }
  .reference-process-grid li:nth-child(6n) { border-right: 1px solid var(--line); }
  .reference-process-grid li:nth-last-child(-n + 6) { border-bottom: 1px solid var(--line); }
  .reference-process-grid li:nth-child(3n) { border-right: 0; }
  .reference-process-grid li:nth-last-child(-n + 3) { border-bottom: 0; }
  .choice-feature-grid, .closing-reference-grid { grid-template-columns: 1fr; }
  .closing-reference-grid { gap: calc(28px * var(--presentation-scale)); }
  .reference-footer .footer-main { grid-template-columns: 1.4fr 0.8fr 1fr; }
  .hero-reference-gallery { height: 100%; }
}

@media (max-width: 620px) {
  :root { --presentation-scale: 1.16; --shell: 100%; --panel-radius: 18px; --media-radius: 15px; }
  body { font-size: 17px; }
  .page-shell { width: min(calc(100% - 28px), var(--shell)); }
  .scroll-threshold { top: 580px; }
  .reference-header-inner { min-height: 52px; }
  .reference-brand { font-size: 12px; }
  .reference-brand img { width: 18px; height: 18px; }
  .reference-nav { display: none; }
  .header-consult { padding: 6px 9px; font-size: 10px; }
  .hero-reference { min-height: clamp(560px, calc(100svh - 208px), 720px); }
  .hero-reference::after { background: linear-gradient(180deg, rgb(248 251 255 / 0.88) 0%, rgb(248 251 255 / 0.74) 58%, rgb(225 235 244 / 0.28) 100%); }
  .hero-reference-copy { width: 100%; margin: 0; padding: 52px 0 112px; text-align: center; }
  .hero-reference-copy p { font-size: 15px; }
  .hero-reference-copy h1 { font-size: clamp(32px, 9.4vw, 38px); line-height: 1.18; }
  .hero-reference-copy span { margin-top: 8px; font-size: 12px; }
  .hero-reference-copy .hero-license { font-size: 13px; }
  .hero-reference-copy strong { font-size: 22px; }
  .hero-reference-copy small { font-size: 11px; }
  .hero-reference-gallery { height: 100%; border-radius: 0; }
  .hero-photo-master img { object-position: 67% center; }
  .reference-stats { padding-bottom: 38px; }
  .stats-frame { padding: 16px 8px; }
  .stats-grid article { padding: 0 4px; }
  .stats-grid strong { font-size: 25px; }
  .stats-grid p { font-size: 9px; line-height: 1.35; }
  .mini-consult, .copy-phone { padding: 7px 11px; font-size: 11px; }
  .reference-section, .reference-intro { padding: 70px 0; }
  .reference-title-block { margin-bottom: 32px; }
  .reference-title-block p, .process-heading p, .reference-closing p { font-size: 13px; }
  .reference-title-block h2, .process-heading h2, .reference-closing h2 { font-size: clamp(31px, 9vw, 38px); line-height: 1.16; }
  .reference-title-block span { margin-top: 10px; font-size: 13px; }
  .intro-grid { grid-template-columns: 1fr; gap: 20px; }
  .intro-copy { padding: 26px 22px; }
  .intro-copy h2 { font-size: 32px; }
  .intro-prose > p { margin-bottom: 18px; font-size: 13px; }
  .intro-factory { width: 100%; height: auto; min-height: 0; }
  .intro-factory figcaption { right: 8px; bottom: 8px; font-size: 10px; }
  .capability-grid { grid-template-columns: repeat(2, 1fr); }
  .capability-grid article { min-height: 168px; padding: 18px 14px; }
  .capability-grid article:nth-child(4n) { border-right: 1px solid var(--line); }
  .capability-grid article:nth-last-child(-n + 4) { border-bottom: 1px solid var(--line); }
  .capability-grid article:nth-child(3n) { border-right: 1px solid var(--line); }
  .capability-grid article:nth-last-child(-n + 3) { border-bottom: 1px solid var(--line); }
  .capability-grid article:nth-child(2n) { border-right: 0; }
  .capability-grid article:nth-last-child(-n + 2) { border-bottom: 0; }
  .capability-icon { width: 36px; height: 36px; margin-bottom: 18px; }
  .capability-grid h3 { font-size: 17px; }
  .capability-grid p { font-size: 12px; }
  .reference-gallery { gap: 8px; }
  .reference-gallery-eight, .reference-gallery-six { grid-template-columns: repeat(2, 1fr); }
  .reference-gallery-six { margin-top: 20px; }
  .reference-gallery h3 { padding: 10px 10px 0; font-size: 14px; }
  .reference-gallery p { padding: 4px 10px 11px; font-size: 11px; }
  .reference-gallery-six h3 { min-height: auto; padding: 10px; font-size: 13px; }
  .solution-lead-grid { grid-template-columns: 1fr; gap: 8px; }
  .solution-copy-card { grid-column: auto; min-height: 360px; padding: 28px 23px; }
  .solution-copy-card h3 { font-size: 36px; }
  .solution-copy-card span { font-size: 13px; }
  .solution-lead-grid figure img { height: 230px; }
  .choice-feature-grid figure img { height: 300px; }
  .choice-feature-grid article { padding: 28px 22px; }
  .choice-feature-grid article h3 { font-size: 34px; }
  .choice-feature-grid article .choice-summary { font-size: 13px; }
  .choice-feature-grid ul { font-size: 13px; }
  .process-heading { display: grid; align-items: start; gap: 16px; }
  .process-contact { max-width: none; }
  .process-contact > span { font-size: 12px; }
  .reference-process-grid { grid-template-columns: repeat(2, 1fr); }
  .reference-process-grid li { min-height: 178px; padding: 19px 15px; }
  .reference-process-grid li:nth-child(3n) { border-right: 1px solid var(--line); }
  .reference-process-grid li:nth-last-child(-n + 3) { border-bottom: 1px solid var(--line); }
  .reference-process-grid li:nth-child(2n) { border-right: 0; }
  .reference-process-grid li:nth-last-child(-n + 2) { border-bottom: 0; }
  .reference-process-grid span { width: 32px; height: 32px; margin-bottom: 16px; font-size: 11px; }
  .reference-process-grid h3 { font-size: 17px; }
  .reference-process-grid p { font-size: 12px; }
  .reference-factory-strip { padding: 74px 0 84px; }
  .factory-strip-frame, .factory-strip-frame > img { min-height: 600px; height: 600px; }
  .factory-strip-frame::after { background: linear-gradient(180deg, transparent 4%, rgb(24 49 70 / 0.22) 32%, rgb(24 49 70 / 0.9) 100%); }
  .factory-strip-frame > div { left: 18px; right: 18px; bottom: 22px; width: auto; padding: 20px 4px; }
  .factory-strip-frame h2 { font-size: 33px; }
  .factory-strip-frame p { font-size: 13px; }
  .faq-reference { padding-top: 78px; }
  .faq-list { border-radius: var(--media-radius); }
  .faq-item button { gap: 18px; padding: 18px 18px; font-size: 15px; }
  .faq-item button span { font-size: 24px; }
  .faq-answer p { font-size: 13px; }
  .faq-item.is-open .faq-answer { padding: 0 18px 20px; }
  .reference-closing { padding: 76px 0; }
  .reference-closing h2 { margin-bottom: 14px; font-size: clamp(34px, 9.6vw, 41px); }
  .reference-closing > .page-shell > div > span { font-size: 14px; }
  .closing-reference-grid > a { padding: 26px 22px; }
  .closing-reference-grid strong { font-size: 42px; }
  .closing-reference-grid small, .closing-reference-grid b { font-size: 13px; }
  .closing-actions { flex-direction: column; align-items: stretch; }
  .closing-actions a { text-align: center; }
  .reference-footer { padding: 30px 0 22px; font-size: 12px; }
  .reference-footer .footer-main { grid-template-columns: 1fr; gap: 28px; }
  .reference-footer .footer-bottom { align-items: flex-start; flex-direction: column; gap: 8px; }
  .reference-footer h2 { font-size: 15px; }
  .footer-contact > a:first-of-type { font-size: 24px; }
  .floating-phone {
    --phone-rest-transform: none;
    --phone-hover-transform: translateY(-2px);
    --phone-active-transform: scale(0.98);
    top: auto;
    left: 14px;
    right: 78px;
    bottom: max(16px, env(safe-area-inset-bottom));
    display: flex;
    min-width: 0;
    min-height: 48px;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 8px 14px;
    text-align: left;
  }
  .floating-phone span { font-size: 11px; }
  .floating-phone strong { font-size: 15px; }
  .intro-factory { height: auto; min-height: 0; }
  .to-top { right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); width: 50px; height: 50px; }
}

@media (prefers-reduced-transparency: reduce) {
  .reference-header, .stats-frame, .intro-copy, .capability-grid, .reference-gallery article, .reference-process-grid, .solution-copy-card, .choice-feature-grid article, .factory-strip-frame > div, .faq-list, .closing-reference-grid > a, .solution-lead-grid figcaption, .choice-feature-grid figcaption, .floating-phone, .reference-footer {
    background: var(--paper);
    backdrop-filter: none;
    -webkit-backdrop-filter: none;
  }
  .factory-strip-frame::after { display: none; }
  .factory-strip-frame > div { color: var(--ink); }
  .factory-strip-frame p { color: var(--accent-text); text-shadow: none; }
  .factory-strip-frame h2 { color: var(--ink); text-shadow: none; }
  .factory-summary, .factory-strip-frame ul { color: var(--muted); text-shadow: none; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: 0.01ms !important; animation-delay: 0s !important; transition-duration: 0.01ms !important; transition-delay: 0s !important; }
  .reveal-item, .reveal-item.is-revealed { opacity: 1 !important; transform: none !important; }
  .hover-media img, .consult-control::after { transition: none !important; transform: none !important; }
  .year-digit-track { transition: none !important; }
  .is-rolling .year-digit-track { transform: none !important; }
  .floating-phone, .floating-phone:active { transition: none !important; transform: var(--phone-rest-transform) !important; }
  .reference-intro::before, .choice-reference::before, .reference-closing::before, #advantages::before, .process-reference::before, .faq-reference::before { transition: none !important; transform: none !important; }
}
