@font-face {
  font-family: "Noto Sans JP Local";
  src: local("Noto Sans JP"), url("../fonts/noto-sans-jp-variable.ttf") format("truetype");
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
}

:root {
  --accent-color: #00baf7;
  --accent-blue: #0878ff;
  --accent-deep: #0758b8;
  --accent-warm: #ff8a2b;
  --background-color: #07090c;
  --surface-color: #0d1117;
  --surface-raised: #121821;
  --text-color: #f5f7fa;
  --secondary-color: #909baa;
  --line-color: rgba(104, 195, 235, 0.16);
  --line-strong: rgba(145, 218, 245, 0.3);
  --content-width: 1240px;
  --font-latin-heading: "Franklin Gothic Medium", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;
  --font-japanese: "Noto Sans JP Local", "Noto Sans JP", "Yu Gothic UI", sans-serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  position: relative;
  isolation: isolate;
  margin: 0;
  color: var(--text-color);
  background: var(--background-color);
  font-family: var(--font-japanese);
  font-size: 16px;
  line-height: 1.7;
  -webkit-font-smoothing: antialiased;
}

.theme-signal-trace {
  background:
    radial-gradient(circle at 88% 16%, rgba(0,186,247,.22), transparent 31%),
    radial-gradient(circle at 8% 74%, rgba(8,120,255,.13), transparent 30%),
    linear-gradient(155deg, #060b10, #05080c 56%, #07131c);
  background-attachment: fixed;
}

.theme-signal-trace::before,
.theme-signal-trace::after {
  position: fixed;
  z-index: -1;
  inset: 0;
  pointer-events: none;
  content: "";
}

.theme-signal-trace::before {
  background-image: url("../images/background/signal-trace.svg");
  background-position: center;
  background-size: cover;
  opacity: .92;
}

.theme-signal-trace::after {
  background-image:
    radial-gradient(circle at 78% 25%, rgba(5,8,12,.96) 0 2px, rgba(0,186,247,.9) 2px 3px, rgba(0,186,247,.24) 4px, transparent 11px),
    radial-gradient(circle at 66% 49%, rgba(5,8,12,.96) 0 2px, rgba(8,120,255,.78) 2px 3px, rgba(8,120,255,.2) 4px, transparent 11px),
    radial-gradient(circle at 86% 72%, rgba(5,8,12,.96) 0 2px, rgba(0,186,247,.84) 2px 3px, rgba(0,186,247,.21) 4px, transparent 11px),
    radial-gradient(circle at 22% 34%, rgba(5,8,12,.96) 0 2px, rgba(8,120,255,.68) 2px 3px, rgba(8,120,255,.16) 4px, transparent 10px);
  opacity: 1;
}
img { display: block; max-width: 100%; height: auto; }
a { color: inherit; }
button { font: inherit; }
::selection { color: #fff; background: var(--accent-deep); }

.skip-link {
  position: fixed;
  z-index: 100;
  top: 8px;
  left: 8px;
  padding: 10px 16px;
  color: #fff;
  background: var(--accent-color);
  transform: translateY(-150%);
}
.skip-link:focus { transform: translateY(0); }

.site-header {
  position: absolute;
  z-index: 20;
  inset: 0 0 auto;
  border-bottom: 1px solid var(--line-color);
  background: linear-gradient(90deg, rgba(5,8,12,.88), rgba(5,13,20,.58), rgba(5,8,12,.78));
  backdrop-filter: blur(8px);
}
.header-inner,
.review-header {
  width: min(calc(100% - 48px), var(--content-width));
  height: 84px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.brand {
  display: inline-flex;
  align-items: center;
  gap: 13px;
  color: #fff;
  text-decoration: none;
}
.brand-logo { width: 216px; height: auto; flex: 0 0 auto; filter: drop-shadow(0 0 12px rgba(0,186,247,.14)); }
.brand-symbol { width: 38px; height: 38px; flex: 0 0 auto; }
.brand-name { font-size: 14px; font-weight: 800; letter-spacing: 0.2em; }
.brand-name,
.global-nav,
.menu-label,
.eyebrow,
.hero h1,
.hero-product figcaption,
.hero-index,
.section-number,
.product-meta,
.product-card h3,
.details-label,
.technical-placeholder,
.status-line,
.about-lead,
.focus-list,
.footer-brand,
.copyright,
.option-id,
.review-intro h1,
.logo-option h2,
.tagline-review h2 { font-family: var(--font-latin-heading); }
.global-nav { display: flex; align-items: center; gap: 42px; }
.global-nav a {
  position: relative;
  color: #cbd2da;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.14em;
  text-decoration: none;
}
.global-nav a::after {
  position: absolute;
  right: 0;
  bottom: -10px;
  left: 0;
  height: 1px;
  background: var(--accent-color);
  content: "";
  transform: scaleX(0);
  transform-origin: right;
  transition: transform 180ms ease;
}
.global-nav a:hover::after,
.global-nav a:focus-visible::after,
.global-nav a[aria-current="page"]::after { transform: scaleX(1); transform-origin: left; }
.menu-button { display: none; }

.hero {
  position: relative;
  min-height: 760px;
  overflow: hidden;
  border-bottom: 1px solid var(--line-color);
  background:
    radial-gradient(circle at 82% 28%, rgba(0, 186, 247, 0.16), transparent 30%),
    linear-gradient(135deg, #080b10 0%, #07090c 58%, #0b1017 100%);
}
.hero::after {
  position: absolute;
  inset: 0;
  pointer-events: none;
  background-image: linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
  background-size: 64px 64px;
  content: "";
  mask-image: linear-gradient(to bottom, transparent 5%, #000 46%, transparent 92%);
}
.signal-field { position: absolute; z-index: 1; top: 36%; right: -8%; width: 62%; height: 230px; opacity: .55; transform: perspective(500px) rotateY(-8deg); }
.signal-field span { position: absolute; right: 0; left: 0; height: 1px; background: linear-gradient(90deg, transparent, var(--accent-color) 28%, rgba(8,120,255,.18) 72%, transparent); box-shadow: 0 0 16px rgba(0,186,247,.48); }
.signal-field span:nth-child(1) { top: 20%; transform: translateX(14%); }
.signal-field span:nth-child(2) { top: 50%; }
.signal-field span:nth-child(3) { top: 80%; transform: translateX(8%); }
.hero-inner {
  position: relative;
  z-index: 2;
  width: min(calc(100% - 48px), var(--content-width));
  min-height: 760px;
  margin: 0 auto;
  padding: 150px 0 92px;
  display: grid;
  grid-template-columns: minmax(0, .94fr) minmax(420px, 1.06fr);
  align-items: center;
  gap: clamp(48px, 7vw, 100px);
}
.eyebrow { display: flex; flex-wrap: wrap; gap: 8px 24px; margin: 0 0 26px; color: var(--secondary-color); font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; }
.eyebrow span:first-child { color: var(--accent-color); }
.hero h1 { margin: 0; font-size: clamp(2.8rem, calc(6vw - .5rem), 5.4rem); font-style: italic; font-weight: 750; letter-spacing: -.055em; line-height: .94; }
.hero h1 em { color: var(--accent-color); font-style: italic; font-weight: 350; text-shadow: 0 0 24px rgba(0,186,247,.13); }
.hero-summary { max-width: 430px; margin: 34px 0 28px; color: #bcc5cf; font-size: 17px; }
.text-link { display: inline-flex; align-items: center; gap: 12px; min-height: 44px; color: #fff; font-size: 14px; font-weight: 700; letter-spacing: .08em; text-underline-offset: 6px; }
.text-link span { color: var(--accent-color); font-size: 20px; }
.hero-product { position: relative; margin: 0; }
.image-frame { position: relative; overflow: hidden; background: #141922; border: 1px solid var(--line-strong); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 34px), calc(100% - 34px) 100%, 0 100%); }
.image-frame::after { position: absolute; inset: 0; background: linear-gradient(145deg, rgba(6,10,15,.04), rgba(6,10,15,.1) 50%, rgba(6,10,15,.68)); content: ""; }
.image-frame img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; filter: saturate(.72) contrast(1.08) brightness(.8); }
.scan-line { position: absolute; z-index: 2; top: 0; bottom: 0; left: 22%; width: 1px; background: var(--accent-color); box-shadow: 0 0 18px var(--accent-color); opacity: .65; }
.hero-product figcaption { position: absolute; z-index: 3; right: 28px; bottom: 24px; display: grid; text-align: right; }
.hero-product figcaption span { color: var(--accent-color); font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.hero-product figcaption strong { font-size: clamp(1.45rem, 2.3vw, 2.2rem); letter-spacing: -.03em; }
.hero-index { position: absolute; z-index: 3; right: max(24px, calc((100vw - var(--content-width)) / 2)); bottom: 26px; left: max(24px, calc((100vw - var(--content-width)) / 2)); display: flex; align-items: center; gap: 14px; color: #6d7784; font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.hero-index i { height: 1px; flex: 1; background: var(--line-color); }

.section { width: min(calc(100% - 48px), var(--content-width)); margin: 0 auto; padding: 128px 0; }
.section-heading { display: grid; grid-template-columns: 180px minmax(0, 1fr) minmax(280px, 380px); align-items: end; gap: 40px; margin-bottom: 64px; }
.section-number,
.option-id { margin: 0; color: var(--accent-color); font-size: 12px; font-weight: 800; letter-spacing: .16em; }
.section-heading h2 { margin: 0; font-size: clamp(1.25rem, 3.067vw, 3.067rem); font-style: italic; font-weight: 670; letter-spacing: -.04em; line-height: 1.04; }
.section-heading > p:last-child { margin: 0; color: var(--secondary-color); }

.product-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line-color); }
.product-card { position: relative; min-width: 0; border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); background: linear-gradient(145deg, rgba(255,255,255,.018), transparent 48%); transition: background 180ms ease, transform 180ms ease; }
.product-card:hover { background-color: rgba(0,186,247,.05); }
.product-media,
.technical-placeholder { position: relative; overflow: hidden; min-height: 310px; border-bottom: 1px solid var(--line-color); background: #0d1117; }
.product-media img { width: 100%; height: 100%; min-height: 310px; object-fit: cover; filter: saturate(.76) contrast(1.06) brightness(.82); transition: filter 240ms ease, transform 350ms ease; }
.product-card:hover .product-media img { filter: saturate(.9) contrast(1.07) brightness(.9); transform: scale(1.015); }
.product-media--crop img { object-position: 56% 50%; }
.product-media--obd-hub img { object-position: 50% 54%; }
.product-content { position: relative; padding: 30px 32px 34px; }
.product-content::before { position: absolute; top: -1px; left: 32px; width: 92px; height: 2px; background: linear-gradient(90deg, var(--accent-color), var(--accent-blue), transparent); content: ""; transform: skewX(-34deg); transform-origin: left; }
.product-meta { display: flex; justify-content: space-between; gap: 16px; margin: 0 0 18px; color: var(--accent-color); font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.product-meta span:last-child { color: #66717e; }
.product-card h3 { margin: 0 0 12px; font-size: clamp(1.7rem, 3vw, 2.8rem); font-style: italic; letter-spacing: -.035em; line-height: 1.05; }
.product-card .product-content > p:not(.product-meta) { min-height: 3.4em; margin: 0 0 26px; color: #aab4bf; }
.details-label { display: flex; align-items: center; justify-content: space-between; padding-top: 17px; border-top: 1px solid var(--line-color); color: #dfe5eb; font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.details-label { text-decoration: none; }
.details-label:hover,
.details-label:focus-visible { color: var(--accent-color); }
.details-label span { color: var(--accent-warm); font-size: 10px; }
.product-card--developing .details-label { color: var(--accent-warm); }
.technical-placeholder { display: grid; place-items: center; isolation: isolate; }
.technical-placeholder::before { position: absolute; inset: 28px; border: 1px solid rgba(0,186,247,.28); content: ""; clip-path: polygon(0 0, 28px 0, 28px 1px, 1px 1px, 1px 28px, 0 28px, 0 100%, 100% 100%, 100% 0); }
.technical-placeholder::after { position: absolute; width: 48%; height: 48%; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; }
.technical-placeholder span { position: absolute; top: 42px; left: 42px; color: #5f6a77; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.technical-placeholder strong { z-index: 1; color: #dfe5ea; font-size: clamp(3.4rem, 7vw, 6.5rem); letter-spacing: -.08em; }
.technical-placeholder i { position: absolute; z-index: 0; width: 86%; height: 1px; background: linear-gradient(90deg, transparent, var(--accent-color), transparent); box-shadow: 0 0 16px rgba(0,186,247,.44); transform: rotate(-9deg); }
.status-line { position: absolute; z-index: 4; top: 18px; right: 18px; display: flex; align-items: center; gap: 8px; padding: 6px 9px; color: #fff; background: rgba(7,9,12,.82); border: 1px solid rgba(255,138,43,.58); font-size: 10px; font-weight: 800; letter-spacing: .12em; backdrop-filter: blur(6px); }
.status-line i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-warm); box-shadow: 0 0 9px rgba(255,138,43,.82); }
.about { border-top: 1px solid var(--line-strong); }
.about-grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(60px, 10vw, 150px); }
.about .section-heading { display: block; margin: 0; }
.about .section-heading h2 { margin-top: 28px; }
.about-copy { padding-top: 42px; }
.about-copy > p { color: var(--secondary-color); }
.about-lead { color: #eef2f6 !important; font-size: clamp(1.25rem, 2vw, 1.65rem); line-height: 1.55; }
.focus-list { margin: 52px 0 0; border-top: 1px solid var(--line-color); }
.focus-list div { display: grid; grid-template-columns: 56px 1fr; padding: 17px 0; border-bottom: 1px solid var(--line-color); }
.focus-list dt { color: var(--accent-color); font-size: 12px; font-weight: 800; }
.focus-list dd { margin: 0; font-weight: 650; letter-spacing: .04em; }

.site-footer { width: min(calc(100% - 48px), var(--content-width)); margin: 0 auto; padding: 56px 0 36px; display: grid; grid-template-columns: 1fr auto; gap: 6px 40px; border-top: 1px solid var(--line-strong); color: #687380; font-size: 12px; letter-spacing: .08em; }
.footer-brand { grid-row: 1 / 3; align-self: center; color: #fff; font-size: clamp(1.7rem, 4vw, 3.6rem); font-weight: 800; letter-spacing: -.05em; }
.footer-logo { width: min(310px, 100%); height: auto; filter: drop-shadow(0 0 14px rgba(0,186,247,.12)); }
.site-footer p { margin: 0; text-align: right; }

.reveal-ready .reveal { opacity: 0; transform: translateY(20px); transition: opacity 520ms ease, transform 520ms ease; }
.reveal-ready .reveal.is-visible { opacity: 1; transform: translateY(0); }

/* Phase 2: shared inner pages */
.page-shell { width: min(calc(100% - 48px), var(--content-width)); margin: 0 auto; }
.page-hero { position: relative; overflow: hidden; padding: 132px 0 86px; border-bottom: 1px solid var(--line-strong); background: linear-gradient(132deg, rgba(5,8,12,.97), rgba(7,17,27,.88)); }
.page-hero::before { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(circle at 82% 32%, rgba(0,186,247,.18), transparent 34%), linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: auto, 64px 64px, 64px 64px; content: ""; }
.page-hero .page-shell { position: relative; z-index: 1; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 64px; color: #6f7b88; font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .12em; }
.breadcrumb a { color: #a6b0bb; text-decoration: none; }
.breadcrumb a:hover,
.breadcrumb a:focus-visible { color: var(--accent-color); }
.page-kicker { margin: 0 0 20px; color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 12px; font-weight: 800; letter-spacing: .16em; text-transform: uppercase; }
.page-hero h1 { max-width: 980px; margin: 0; font-family: var(--font-latin-heading); font-size: clamp(3.8rem, 8vw, 8.6rem); font-style: italic; font-weight: 720; letter-spacing: -.06em; line-height: .92; }
.listing-hero h1,
.about-page-hero h1 { font-family: var(--font-latin-heading); font-size: clamp(2.8rem, calc(6vw - .5rem), 5.4rem); font-weight: 750; letter-spacing: -.055em; line-height: .94; }
.product-title-row h1 { font-size: clamp(2.533rem, 5.333vw, 5.733rem); }
.page-hero h1 em { color: var(--accent-color); font-style: italic; font-weight: 350; }
.page-summary { max-width: 700px; margin: 34px 0 0; color: #aeb8c3; font-size: clamp(1.05rem, 1.7vw, 1.3rem); }
.product-title-row { display: flex; align-items: flex-start; justify-content: space-between; gap: 32px; }
.product-tagline { max-width: none; margin: 34px 0 54px; color: #eef2f6; font-size: clamp(1.35rem, 2.4vw, 2.2rem); font-weight: 650; line-height: 1.5; white-space: nowrap; }
.development-badge,
.mini-status { color: #fff; border: 1px solid rgba(255,138,43,.76); background: rgba(7,9,12,.82); font-family: var(--font-latin-heading); font-size: 10px; font-style: normal; font-weight: 800; letter-spacing: .13em; }
.development-badge { display: flex; align-items: center; gap: 9px; margin-top: 26px; padding: 8px 11px; white-space: nowrap; }
.development-badge i { width: 6px; height: 6px; border-radius: 50%; background: var(--accent-warm); box-shadow: 0 0 10px var(--accent-warm); }
.detail-gallery { border: 1px solid var(--line-strong); }
.detail-gallery--multiple { display: grid; grid-template-columns: 2fr 1fr; }
.detail-gallery figure { position: relative; min-width: 0; margin: 0; overflow: hidden; background: #0d1117; }
.detail-gallery--multiple figure + figure { border-left: 1px solid var(--line-strong); }
.detail-gallery img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; filter: saturate(.8) contrast(1.05) brightness(.86); }
.detail-gallery--multiple .detail-gallery-main img { aspect-ratio: 16 / 8; }
.detail-gallery--multiple figure:not(.detail-gallery-main) img { height: 100%; aspect-ratio: auto; object-fit: cover; }
.detail-gallery figcaption { position: absolute; right: 18px; bottom: 14px; padding: 5px 8px; color: #dbe2e9; background: rgba(4,7,10,.76); font-size: 10px; letter-spacing: .08em; }
.detail-placeholder { position: relative; min-height: 460px; display: grid; place-items: center; overflow: hidden; border: 1px solid var(--line-strong); background: rgba(13,17,23,.84); font-family: var(--font-latin-heading); }
.detail-placeholder::before { position: absolute; inset: 34px; border: 1px solid rgba(0,186,247,.3); content: ""; }
.detail-placeholder::after { position: absolute; width: 34%; aspect-ratio: 2 / 1; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; }
.detail-placeholder span { position: absolute; top: 52px; left: 52px; color: #687686; font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.detail-placeholder strong { z-index: 1; font-size: clamp(5rem, 11vw, 10rem); letter-spacing: -.08em; }
.detail-placeholder i { position: absolute; width: 88%; height: 1px; background: linear-gradient(90deg, transparent, var(--accent-color), transparent); box-shadow: 0 0 18px rgba(0,186,247,.48); transform: rotate(-7deg); }
.detail-body { padding: 0 0 100px; }
.content-section { padding: 100px 0; border-bottom: 1px solid var(--line-strong); }
.content-heading { display: grid; grid-template-columns: 170px minmax(0, 1fr) minmax(260px, 380px); align-items: end; gap: 34px; margin-bottom: 48px; }
.content-heading > p:first-child,
.catalog-intro > p:first-child { margin: 0; color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 11px; font-weight: 800; letter-spacing: .15em; }
.content-heading h2,
.catalog-intro h2 { margin: 0; font-family: var(--font-latin-heading); font-size: clamp(2.25rem, 4.5vw, 4.5rem); font-style: italic; letter-spacing: -.045em; line-height: 1; }
.content-heading h2:is(#overview-title, #features-title, #application-title, #installation-title, #specifications-title) { font-size: clamp(1.55rem, 3vw, 2.7rem); }
.content-heading > p:last-child { margin: 0; color: var(--secondary-color); }
.prose-large { max-width: 890px; margin-left: auto; }
.prose-large p { margin: 0 0 1.25em; color: #c1cad3; font-size: clamp(1rem, 1.5vw, 1.2rem); line-height: 1.9; }
.explainer-figure { margin: 72px 0 0; border: 1px solid var(--line-strong); background: rgba(7,9,12,.9); }
.selling-block { position: relative; margin-top: 64px; padding: clamp(28px, 5vw, 54px); overflow: hidden; border: 1px solid rgba(0,186,247,.35); background: linear-gradient(135deg, rgba(0,186,247,.11), rgba(7,9,12,.96) 58%); }
.selling-block::after { position: absolute; right: -90px; top: -110px; width: 300px; height: 300px; border: 1px solid rgba(0,186,247,.18); border-radius: 50%; box-shadow: 0 0 80px rgba(0,186,247,.08); content: ""; }
.selling-label { position: relative; z-index: 1; margin: 0 0 14px; color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.selling-block h3 { position: relative; z-index: 1; max-width: 900px; margin: 0; font-size: clamp(1.75rem, 4.3vw, 3.65rem); line-height: 1.18; }
.selling-lead { position: relative; z-index: 1; max-width: 930px; margin: 26px 0 0; color: #b9c4cf; font-size: clamp(1rem, 1.7vw, 1.2rem); line-height: 2; }
.selling-points { position: relative; z-index: 1; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; margin-top: 38px; background: var(--line-color); border: 1px solid var(--line-color); }
.selling-points article { min-height: 155px; padding: 24px; background: rgba(5,8,12,.94); }
.selling-points article:last-child:nth-child(odd) { grid-column: 1 / -1; }
.selling-points span { color: var(--status-color); font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.selling-points h4 { margin: 10px 0 8px; font-size: 1.15rem; }
.selling-points p { margin: 0; color: #9eabb7; font-size: 14px; line-height: 1.8; }
.explainer-steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin: 0; padding: 0; background: var(--line-color); border-bottom: 1px solid var(--line-color); list-style: none; }
.explainer-steps li { position: relative; min-height: 142px; padding: 22px; background: linear-gradient(145deg, rgba(0,186,247,.09), rgba(7,9,12,.97) 65%); }
.explainer-steps li:not(:last-child)::after { position: absolute; right: -8px; top: 50%; z-index: 2; width: 15px; height: 15px; border-top: 2px solid var(--accent-color); border-right: 2px solid var(--accent-color); background: #081018; content: ""; transform: translateY(-50%) rotate(45deg); }
.explainer-steps span { color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 9px; font-weight: 800; letter-spacing: .13em; }
.explainer-steps strong { display: block; margin-top: 10px; font-size: 1rem; }
.explainer-steps p { margin: 7px 0 0; color: #93a0ad; font-size: 13px; }
.explainer-image { position: relative; overflow: hidden; background: #080c11; }
.explainer-image::after { position: absolute; inset: 0; pointer-events: none; border: 1px solid rgba(255,255,255,.03); box-shadow: inset 0 0 70px rgba(0,0,0,.2); content: ""; }
.explainer-image img { width: 100%; aspect-ratio: 3 / 2; object-fit: cover; filter: saturate(.9) contrast(1.03) brightness(.9); }
.explainer-image--contain { padding: clamp(18px, 4vw, 44px); background: #080b10; }
.explainer-image--contain img { aspect-ratio: auto; max-height: 620px; object-fit: contain; filter: none; }
.explainer-figure figcaption { display: grid; grid-template-columns: 180px 1fr; gap: 28px; padding: 20px 24px; border-top: 1px solid var(--line-color); }
.explainer-figure figcaption span { color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.explainer-figure figcaption p { margin: 0; color: #a7b2bd; font-size: 14px; }
.feature-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line-color); border-left: 1px solid var(--line-color); }
.feature-grid article { min-height: 230px; padding: 30px; border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); background: linear-gradient(145deg, rgba(0,186,247,.035), transparent 55%); }
.feature-grid span { color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.feature-grid h3,
.application-list h3 { margin: 28px 0 12px; font-size: clamp(1.25rem, 2.2vw, 1.8rem); line-height: 1.35; }
.feature-grid p,
.application-list p { margin: 0; color: #9ea9b5; }
.application-list { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--line-color); border: 1px solid var(--line-color); }
.application-list--single { grid-template-columns: 1fr; }
.application-list article { min-height: 180px; padding: 32px; background: rgba(7,9,12,.93); }
.application-list h3 { margin-top: 0; }
.system-flow,
.process-grid { margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; }
.system-flow li { position: relative; min-height: 150px; padding: 24px; border: 1px solid var(--line-color); background: rgba(13,17,23,.88); }
.system-flow li:not(:last-child)::after { position: absolute; z-index: 2; top: 50%; right: -11px; width: 21px; height: 1px; background: var(--accent-color); content: ""; }
.system-flow span,
.process-grid li > span { display: block; margin-bottom: 24px; color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .14em; }
.system-flow strong { font-size: 1.05rem; }
.table-scroll { overflow-x: auto; }
.spec-table { width: 100%; border-collapse: collapse; background: rgba(7,9,12,.78); }
.spec-table th,
.spec-table td { padding: 20px 22px; border-top: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); text-align: left; vertical-align: top; }
.spec-table th { width: 30%; color: #81909f; font-size: 13px; font-weight: 600; }
.spec-table td { color: #e2e8ee; }
.product-notice { display: flex; gap: 20px; margin: 28px 0 0; padding: 18px 20px; color: #b9c2ca; border-left: 2px solid var(--accent-warm); background: rgba(255,138,43,.055); }
.product-notice strong { flex: 0 0 auto; color: var(--accent-warm); font-family: var(--font-latin-heading); font-size: 11px; letter-spacing: .12em; }
.auto-log { margin-top: 26px; }
.section-lead { max-width: 820px; margin: -12px 0 46px auto; color: #bac4ce; font-size: 1.15rem; }
.process-grid { gap: 20px; }
.process-grid li { min-height: 210px; padding: 26px; border-top: 1px solid var(--accent-color); background: linear-gradient(145deg, rgba(0,186,247,.08), rgba(13,17,23,.8)); }
.process-grid strong { font-family: var(--font-latin-heading); font-size: 1.25rem; letter-spacing: .04em; }
.process-grid p { margin: 16px 0 0; color: #95a2af; }
.back-nav { padding-top: 46px; }
.back-nav a { color: #dce3ea; font-family: var(--font-latin-heading); font-size: 12px; font-weight: 800; letter-spacing: .12em; text-decoration-color: var(--accent-color); text-underline-offset: 6px; }
.phase2-overview-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr); align-items: start; gap: clamp(36px, 7vw, 96px); }
.phase2-overview-grid .prose-large { margin: 0; }
.phase2-key-message { padding: clamp(26px, 4vw, 42px); border-top: 2px solid var(--accent-color); background: linear-gradient(145deg, rgba(0,186,247,.1), rgba(7,9,12,.82) 66%); }
.phase2-key-message > span,
.phase2-feature-copy > span,
.phase2-step-copy > span { color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 10px; font-weight: 800; letter-spacing: .15em; }
.phase2-key-message h3 { margin: 18px 0; font-size: clamp(1.65rem, 3vw, 2.7rem); line-height: 1.3; }
.phase2-key-message p { margin: 0; color: #9eabb7; line-height: 1.9; }
.phase2-feature-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); border-top: 1px solid var(--line-strong); }
.phase2-feature { display: grid; grid-column: 1 / -1; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr); min-height: 390px; border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); border-left: 1px solid var(--line-color); background: rgba(7,9,12,.75); }
.phase2-feature:nth-child(even) .phase2-feature-media { order: -1; border-right: 1px solid var(--line-color); border-left: 0; }
.phase2-feature:nth-child(3) { grid-template-columns: minmax(0, .7fr) minmax(0, 1.3fr); }
.phase2-feature:nth-child(5) .phase2-feature-media img { width: 66.667%; height: auto; min-height: 0; margin: auto; object-fit: contain; }
.phase2-feature.phase2-feature--text-only { grid-template-columns: 1fr; min-height: 0; }
.phase2-feature--compact { grid-column: span 1; }
.phase2-feature--compact .phase2-feature-copy { min-height: 300px; }
.phase2-feature-copy { display: flex; flex-direction: column; justify-content: center; padding: clamp(30px, 5vw, 62px); }
.phase2-feature-copy h3 { max-width: 660px; margin: 22px 0 18px; font-size: clamp(1.55rem, 3vw, 2.7rem); line-height: 1.3; }
.phase2-feature-copy p { max-width: 700px; margin: 0; color: #a7b2bd; font-size: 1.02rem; line-height: 1.9; }
.phase2-feature-media { position: relative; display: flex; flex-direction: column; min-width: 0; margin: 0; border-left: 1px solid var(--line-color); background: #080c11; }
.phase2-feature-media img { flex: 1; width: 100%; min-height: 320px; object-fit: cover; filter: saturate(.9) contrast(1.03); }
.phase2-feature-media--contain { padding: clamp(20px, 3vw, 38px) clamp(20px, 3vw, 42px) 0; background: #eef1f4; }
.phase2-feature-media--contain img { min-height: 260px; object-fit: contain; filter: none; }
.phase2-feature-media--enlarge { padding: 10px 12px 0; }
.phase2-feature-media--enlarge img { min-height: 360px; }
.phase2-feature:nth-child(5) .phase2-feature-media--full-size img { width: 100%; min-height: 320px; }
.phase2-feature-media--wide { padding: clamp(8px, 1.25vw, 16px) clamp(8px, 1.25vw, 16px) 0; }
.phase2-feature-media--wide img { min-height: 300px; }
.phase2-feature-media--compact-image img { flex: 0 1 260px; width: 72%; min-height: 0; max-height: 280px; margin: auto; }
.phase2-feature-media--dark { background: #07101a; }
.phase2-feature-media figcaption,
.phase2-installation-steps figcaption { padding: 14px 18px; color: #8d9aa6; border-top: 1px solid var(--line-color); background: #080b10; font-size: 12px; line-height: 1.6; }
.phase2-application-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; border: 1px solid var(--line-color); background: var(--line-color); }
.phase2-application-grid article { min-height: 230px; padding: clamp(28px, 4vw, 46px); background: rgba(7,9,12,.95); }
.phase2-application-grid h3 { margin: 0 0 18px; font-size: clamp(1.35rem, 2.5vw, 2rem); }
.phase2-application-grid p,
.phase2-application-grid li { color: #a5b0bb; line-height: 1.85; }
.phase2-application-grid ul { margin: 0; padding-left: 1.25em; }
.phase2-installation-lead { max-width: 900px; margin: 0 0 48px auto; color: #bdc6cf; font-size: clamp(1.08rem, 1.8vw, 1.3rem); line-height: 1.9; }
.phase2-installation-steps { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--line-color); }
.phase2-installation-steps > li { display: grid; grid-template-columns: minmax(280px, .78fr) minmax(0, 1.22fr); border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); border-left: 1px solid var(--line-color); background: rgba(7,9,12,.84); }
.phase2-installation-steps > li:has(figure):nth-child(odd) figure { order: -1; border-right: 1px solid var(--line-color); border-left: 0; }
.phase2-step-copy { display: flex; flex-direction: column; justify-content: center; min-height: 240px; padding: clamp(28px, 5vw, 54px); }
.phase2-step-copy h3 { margin: 18px 0 12px; font-size: clamp(1.45rem, 2.7vw, 2.25rem); }
.phase2-step-copy p { margin: 0; color: #a3afba; line-height: 1.85; }
.phase2-installation-steps figure { min-width: 0; margin: 0; border-left: 1px solid var(--line-color); background: #0b1016; }
.phase2-installation-steps img { width: 100%; height: 430px; object-fit: cover; }
.phase2-step-gallery { display: flex; flex-direction: column; min-width: 0; margin: 0; padding: 24px; border-left: 1px solid var(--line-color); background: #0b1016; }
.phase2-step-gallery h4 { margin: 0 0 20px; color: #eef5fb; font-size: 1rem; text-align: center; letter-spacing: .08em; }
.phase2-step-gallery > div { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; flex: 1; }
.phase2-step-gallery span { display: flex; flex-direction: column; min-width: 0; border: 1px solid var(--line-color); background: #eef1f4; }
.phase2-step-gallery img { flex: 1; width: 100%; height: 300px; object-fit: contain; }
.phase2-step-gallery small { padding: 10px 12px; color: #aeb8c2; background: #080b10; text-align: center; }
.phase2-installation-note { display: flex; gap: 22px; margin: 28px 0 0; padding: 20px 22px; color: #b8c2cc; border-left: 2px solid var(--accent-color); background: rgba(0,186,247,.055); }
.phase2-installation-note strong { flex: 0 0 auto; color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 11px; letter-spacing: .12em; }
.product-contacts { display: flex; align-items: center; gap: 14px; margin-top: 28px; padding: 22px; border: 1px solid var(--line-color); background: rgba(7,9,12,.78); }
.product-contacts h3 { margin: 0 auto 0 0; font-size: 1rem; }
.product-contacts a { display: inline-flex; align-items: center; gap: 18px; padding: 12px 16px; color: #eef5fb; border: 1px solid var(--line-strong); text-decoration: none; transition: border-color .2s ease, color .2s ease; }
.product-contacts a:hover,
.product-contacts a:focus-visible { color: var(--accent-color); border-color: var(--accent-color); }
.product-media-link { display: block; color: inherit; text-decoration: none; }
.product-media-link:focus-visible { outline: 2px solid var(--accent-color); outline-offset: -2px; }
.catalog-section,
.series-content { padding: 100px 0 128px; }
.catalog-intro { display: grid; grid-template-columns: 170px minmax(0, 1fr) minmax(280px, 380px); align-items: end; gap: 34px; margin-bottom: 52px; }
.catalog-intro > p:last-child { margin: 0; color: var(--secondary-color); }
.catalog-grid { display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line-color); border-left: 1px solid var(--line-color); }
.catalog-card { min-width: 0; border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); background: rgba(7,9,12,.74); }
.catalog-card > a { height: 100%; display: flex; flex-direction: column; text-decoration: none; }
.catalog-media { position: relative; overflow: hidden; min-height: 300px; background: #0d1117; }
.catalog-media img { width: 100%; height: 300px; object-fit: cover; filter: saturate(.78) contrast(1.05) brightness(.82); transition: transform 300ms ease, filter 200ms ease; }
.catalog-card:hover .catalog-media img { transform: scale(1.018); filter: saturate(.92) contrast(1.05) brightness(.9); }
.mini-status { position: absolute; top: 18px; right: 18px; padding: 6px 9px; }
.card-placeholder { height: 300px; display: grid; place-items: center; background: linear-gradient(160deg, #111821, #090d13); }
.card-placeholder span { color: #dfe5ea; font-family: var(--font-latin-heading); font-size: clamp(3.7rem, 8vw, 7rem); font-weight: 750; letter-spacing: -.07em; }
.catalog-content { flex: 1; padding: 28px 30px 32px; }
.catalog-content h2 { margin: 0 0 14px; font-family: var(--font-latin-heading); font-size: clamp(1.8rem, 3.5vw, 3.2rem); font-style: italic; letter-spacing: -.04em; line-height: 1; }
.catalog-content > p:not(.product-meta) { min-height: 3.4em; margin: 0 0 28px; color: #a5b0bb; }
.card-link { display: flex; justify-content: space-between; padding-top: 16px; border-top: 1px solid var(--line-color); color: #e5ebf1; font-family: var(--font-latin-heading); font-size: 11px; font-weight: 800; letter-spacing: .13em; }
.card-link b { color: var(--accent-color); font-size: 18px; }
.series-hero .page-summary { max-width: 760px; }
.series-content > .content-heading { grid-template-columns: 170px 1fr; }
.series-grid { margin-top: 72px; }
.about-page-content { padding: 110px 0 130px; }
.about-statement { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(50px, 9vw, 130px); padding-bottom: 92px; }
.about-statement p { margin: 0; color: #aeb9c4; font-size: clamp(1.08rem, 1.8vw, 1.35rem); line-height: 1.9; }
.about-statement .about-en { color: #eef2f6; font-family: var(--font-latin-heading); font-size: clamp(1.45rem, 2.7vw, 2.5rem); font-weight: 650; line-height: 1.45; }
.about-pillars { margin: 0; border-top: 1px solid var(--line-strong); }
.about-pillars > div { display: grid; grid-template-columns: 120px 1fr; padding: 34px 0; border-bottom: 1px solid var(--line-color); }
.about-pillars dt { color: var(--accent-color); font-family: var(--font-latin-heading); font-size: 12px; font-weight: 800; }
.about-pillars dd { margin: 0; display: grid; grid-template-columns: minmax(230px, .55fr) 1fr; gap: 44px; }
.about-pillars strong { font-family: var(--font-latin-heading); font-size: 1.35rem; }
.about-pillars span { color: #9ca8b4; }

/* Phase 1 design review */
.review-page { background: #090c11; }
.review-header { border-bottom: 1px solid var(--line-color); }
.review-main { width: min(calc(100% - 48px), var(--content-width)); margin: 0 auto; padding: 88px 0 120px; }
.review-intro { max-width: 760px; margin-bottom: 64px; }
.review-intro h1 { margin: 18px 0; font-size: clamp(3.3rem, 8vw, 7.5rem); letter-spacing: -.065em; line-height: .95; }
.review-intro > p:last-child { max-width: 620px; color: var(--secondary-color); }
.logo-options { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line-color); }
.logo-option { padding: 26px; border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); }
.logo-option--current { background: rgba(0,186,247,.055); }
.option-id { display: flex; justify-content: space-between; gap: 12px; }
.option-id span { color: #fff; font-size: 9px; }
.logo-stage { min-height: 240px; margin: 25px 0; display: grid; place-items: center; background: #f4f6f8; color: #05070a; }
.logo-stage--wordmark { justify-items: start; padding: 34px; }
.logo-stage--wordmark strong { font-size: clamp(2.6rem, 5vw, 4.8rem); line-height: .72; letter-spacing: -.09em; }
.concept-logo { width: min(78%, 250px); }
.concept-logo--ts path { fill: #05070a; }
.concept-logo--scope { fill: none; stroke: #05070a; stroke-width: 6; }
.concept-logo--scope path:first-of-type { stroke: var(--accent-color); stroke-width: 5; }
.logo-option h2 { margin: 0 0 10px; font-size: 1.35rem; }
.logo-option > p:last-child { margin: 0; color: var(--secondary-color); font-size: 14px; }
.tagline-review { margin-top: 72px; display: grid; grid-template-columns: repeat(2, 1fr); border-top: 1px solid var(--line-strong); border-left: 1px solid var(--line-color); }
.tagline-review > div { padding: clamp(28px, 5vw, 58px); border-right: 1px solid var(--line-color); border-bottom: 1px solid var(--line-color); }
.tagline-review h2 { margin: 22px 0; font-size: clamp(2.4rem, 5vw, 5rem); letter-spacing: -.06em; line-height: .93; }
.tagline-review > div:first-child h2 { color: var(--accent-color); }
.tagline-review > div > p:last-child { color: var(--secondary-color); }

@media (max-width: 900px) {
  .hero-inner { grid-template-columns: 1fr; padding-top: 132px; }
  .hero-copy { max-width: 680px; }
  .hero-product { width: min(100%, 680px); margin-left: auto; }
  .section-heading { grid-template-columns: 1fr; gap: 20px; }
  .section-heading > p:last-child { max-width: 560px; }
  .logo-options { grid-template-columns: 1fr; }
  .content-heading,
  .catalog-intro { grid-template-columns: 1fr; gap: 18px; }
  .content-heading > p:last-child { max-width: 620px; }
  .process-grid { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width: 680px) {
  .header-inner,
  .review-header,
  .hero-inner,
  .section,
  .site-footer,
  .review-main { width: min(calc(100% - 32px), var(--content-width)); }
  .header-inner { height: 72px; }
  .brand-logo { width: 176px; }
  .menu-button { display: inline-flex; align-items: center; gap: 10px; padding: 10px 0 10px 12px; color: #fff; background: transparent; border: 0; cursor: pointer; }
  .menu-label { font-size: 11px; font-weight: 800; letter-spacing: .14em; }
  .menu-lines { display: grid; gap: 5px; width: 22px; }
  .menu-lines i { display: block; height: 1px; background: #fff; transition: transform 180ms ease; }
  .menu-button[aria-expanded="true"] .menu-lines i:first-child { transform: translateY(3px) rotate(45deg); }
  .menu-button[aria-expanded="true"] .menu-lines i:last-child { transform: translateY(-3px) rotate(-45deg); }
  .global-nav { position: absolute; top: 72px; right: 0; left: 0; padding: 20px 16px 28px; display: none; flex-direction: column; align-items: stretch; gap: 0; background: rgba(7,9,12,.98); border-bottom: 1px solid var(--line-strong); }
  .global-nav[data-open] { display: flex; }
  .global-nav a { padding: 15px 8px; border-bottom: 1px solid var(--line-color); }
  .global-nav a::after { display: none; }
  .hero, .hero-inner { min-height: auto; }
  .hero-inner { padding: 124px 0 86px; gap: 52px; }
  .hero h1 { font-size: clamp(2.5rem, calc(13vw - .5rem), 4.2rem); }
  .eyebrow { margin-bottom: 20px; display: grid; gap: 3px; }
  .hero-summary { margin-top: 26px; }
  .hero-product figcaption { right: 18px; bottom: 16px; }
  .hero-index { right: 16px; bottom: 16px; left: 16px; }
  .section { padding: 88px 0; }
  .section-heading { margin-bottom: 42px; }
  .product-grid { grid-template-columns: 1fr; }
  .product-media, .technical-placeholder { min-height: 250px; }
  .product-media img { min-height: 250px; }
  .product-content { padding: 24px 22px 28px; }
  .about-grid { grid-template-columns: 1fr; gap: 28px; }
  .about-copy { padding-top: 0; }
  .site-footer { grid-template-columns: 1fr; }
  .footer-brand { grid-row: auto; margin-bottom: 20px; }
  .site-footer p { text-align: left; }
  .review-main { padding-top: 64px; }
  .tagline-review { grid-template-columns: 1fr; }
  .page-shell { width: min(calc(100% - 32px), var(--content-width)); }
  .page-hero { padding: 112px 0 62px; }
  .breadcrumb { margin-bottom: 42px; }
  .page-hero h1 { font-size: clamp(3.25rem, 16vw, 5.5rem); }
  .listing-hero h1,
  .about-page-hero h1 { font-size: clamp(2.5rem, calc(13vw - .5rem), 4.2rem); }
  .product-title-row { display: block; }
  .product-title-row h1 { font-size: clamp(1.733rem, 7.333vw, 2.667rem); overflow-wrap: anywhere; }
  .development-badge { width: fit-content; margin-top: 22px; }
  .product-tagline { margin: 28px 0 38px; }
  .detail-gallery--multiple { grid-template-columns: 1fr; }
  .detail-gallery--multiple figure + figure { border-top: 1px solid var(--line-strong); border-left: 0; }
  .detail-gallery img,
  .detail-gallery--multiple .detail-gallery-main img,
  .detail-gallery--multiple figure:not(.detail-gallery-main) img { height: auto; aspect-ratio: 4 / 3; }
  .detail-placeholder { min-height: 300px; }
  .detail-placeholder span { top: 30px; left: 30px; }
  .content-section { padding: 72px 0; }
  .feature-grid,
  .selling-points,
  .explainer-steps,
  .application-list,
  .catalog-grid,
  .process-grid { grid-template-columns: 1fr; }
  .feature-grid article { min-height: auto; }
  .system-flow { grid-template-columns: 1fr; }
  .system-flow li { min-height: 110px; }
  .system-flow li:not(:last-child)::after { top: auto; right: auto; bottom: -11px; left: 32px; width: 1px; height: 21px; }
  .spec-table th { width: 38%; }
  .product-notice { display: block; }
  .product-notice strong { display: block; margin-bottom: 6px; }
  .phase2-overview-grid,
  .phase2-application-grid,
  .phase2-feature,
  .phase2-installation-steps > li { grid-template-columns: 1fr; }
  .phase2-feature { min-height: 0; }
  .phase2-feature:nth-child(3) { grid-template-columns: 1fr; }
  .phase2-feature:nth-child(5) .phase2-feature-media img { width: 66.667%; }
  .phase2-feature--compact { grid-column: 1 / -1; }
  .phase2-feature-media,
  .phase2-feature:nth-child(even) .phase2-feature-media,
  .phase2-installation-steps figure,
  .phase2-installation-steps > li:has(figure):nth-child(odd) figure { order: 0; border-top: 1px solid var(--line-color); border-right: 0; border-left: 0; }
  .phase2-feature-media img { min-height: 230px; }
  .phase2-feature-media--contain img { min-height: 220px; max-height: 360px; }
  .phase2-application-grid article { min-height: 0; }
  .phase2-installation-lead { margin-bottom: 34px; }
  .phase2-installation-steps img { height: auto; max-height: 560px; object-fit: cover; }
  .phase2-step-gallery { border-top: 1px solid var(--line-color); border-left: 0; }
  .product-contacts { align-items: stretch; flex-direction: column; }
  .product-contacts h3 { margin: 0 0 4px; }
  .phase2-installation-note { display: block; }
  .phase2-installation-note strong { display: block; margin-bottom: 7px; }
  .explainer-figure { margin-top: 48px; }
  .selling-block { margin-top: 44px; padding: 26px 20px; }
  .selling-points { grid-template-columns: 1fr; }
  .selling-points article { min-height: auto; }
  .selling-points article:last-child:nth-child(odd) { grid-column: auto; }
  .explainer-steps { grid-template-columns: 1fr; }
  .explainer-steps li { min-height: auto; padding: 18px; }
  .explainer-steps li:not(:last-child)::after { right: auto; top: auto; bottom: -7px; left: 50%; transform: translateX(-50%) rotate(135deg); }
  .explainer-figure figcaption { grid-template-columns: 1fr; gap: 8px; padding: 16px 18px; }
  .catalog-section,
  .series-content { padding: 76px 0 92px; }
  .catalog-media,
  .catalog-media img,
  .card-placeholder { min-height: 230px; height: 230px; }
  .series-content > .content-heading { grid-template-columns: 1fr; }
  .about-statement { grid-template-columns: 1fr; gap: 42px; padding-bottom: 68px; }
  .about-pillars > div { grid-template-columns: 54px 1fr; }
  .about-pillars dd { grid-template-columns: 1fr; gap: 12px; }
}

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