@font-face{font-family:'Inter';font-style:normal;font-weight:400 900;font-display:swap;src:url('/review/assets/fonts/inter-latin.woff2') format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;}
@font-face{font-family:'Inter';font-style:normal;font-weight:400 900;font-display:swap;src:url('/review/assets/fonts/inter-latin-ext.woff2') format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;}

/*== design-system.css ==*/
:root {
--font-display: "Neue Haas Grotesk Display Pro", "Helvetica Neue",
"Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--font-body: "Inter", system-ui, -apple-system, "Segoe UI", Roboto,
"Helvetica Neue", Arial, sans-serif;
--font-mono: "IBM Plex Mono", "SF Mono", "JetBrains Mono", ui-monospace,
"Cascadia Code", Menlo, monospace;
}
:root {
--c-ink-900: #0B1420;
--c-ink-800: #0F2A47;
--c-ink-700: #1A2430;
--c-ink-600: #2A3948;
--c-slate-500: #4A5766;
--c-slate-400: #7A8794;
--c-slate-300: #9FB2C4;
--c-slate-200: #E2E8EE;
--c-slate-100: #EEF2F6;
--c-slate-50: #F7F9FB;
--c-white: #FFFFFF;
--c-accent: #C55A11;
--c-accent-hover: #A8480C;
--c-accent-weak: #FBEDE2;
--c-verified: #2E7D5B;
--c-warning: #B4791A;
--c-danger: #B23B3B;
--bg-base: var(--c-white);
--bg-elevated: var(--c-slate-50);
--bg-sunken: var(--c-slate-100);
--bg-inverse: var(--c-ink-900);
--text-primary: var(--c-ink-700);
--text-secondary: var(--c-slate-500);
--text-muted: var(--c-slate-400);
--text-on-dark: #EAF1F8;
--text-on-accent: var(--c-white);
--border-hairline: var(--c-slate-200);
--border-strong: var(--c-slate-300);
--accent: var(--c-accent);
--accent-hover: var(--c-accent-hover);
--accent-weak: var(--c-accent-weak);
--signal-verified: var(--c-verified);
--signal-warning: var(--c-warning);
--signal-danger: var(--c-danger);
--hero-grad: radial-gradient(120% 120% at 70% 20%, #163A5E 0%, #0F2A47 42%, #0B1420 100%);
--glass-fill: rgba(255, 255, 255, 0.10);
--glass-border: rgba(255, 255, 255, 0.20);
--glass-blur: 18px;
--shadow-sm: 0 1px 2px rgba(10, 20, 32, 0.06);
--shadow-md: 0 4px 16px rgba(10, 20, 32, 0.08);
--shadow-lg: 0 12px 32px rgba(10, 20, 32, 0.12);
--shadow-panel: 0 24px 64px rgba(6, 12, 20, 0.28);
}
@media (prefers-color-scheme: dark) {
:root:not([data-theme="light"]) {
--bg-base: #0B1420;
--bg-elevated: #111E2E;
--bg-sunken: #0A1019;
--bg-inverse: #EAF1F8;
--text-primary: #EAF1F8;
--text-secondary: #9FB2C4;
--text-muted: #6E8093;
--text-on-dark: #EAF1F8;
--border-hairline: #1E2E40;
--border-strong: #2A3E56;
--accent: #E9721C;
--accent-hover: #F5852E;
--accent-weak: #2A1B10;
--signal-verified: #4FB488;
--signal-warning: #E0A63A;
--signal-danger: #E06A6A;
--glass-fill: rgba(18, 30, 46, 0.55);
--glass-border: rgba(255, 255, 255, 0.10);
--shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.4);
--shadow-md: 0 4px 16px rgba(0, 0, 0, 0.45);
--shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
--shadow-panel: 0 24px 64px rgba(0, 0, 0, 0.6);
}
}
:root[data-theme="dark"] {
--bg-base: #0B1420; --bg-elevated: #111E2E; --bg-sunken: #0A1019;
--bg-inverse: #EAF1F8;
--text-primary: #EAF1F8; --text-secondary: #9FB2C4; --text-muted: #6E8093;
--border-hairline: #1E2E40; --border-strong: #2A3E56;
--accent: #E9721C; --accent-hover: #F5852E; --accent-weak: #2A1B10;
--signal-verified: #4FB488; --signal-warning: #E0A63A; --signal-danger: #E06A6A;
--glass-fill: rgba(18,30,46,0.55); --glass-border: rgba(255,255,255,0.10);
--shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
--shadow-md: 0 4px 16px rgba(0,0,0,0.45);
--shadow-lg: 0 12px 32px rgba(0,0,0,0.5);
--shadow-panel: 0 24px 64px rgba(0,0,0,0.6);
}
:root {
--type-display-xl: clamp(2.5rem, 1.6rem + 3.8vw, 4.5rem);
--type-display-l: clamp(2rem, 1.4rem + 2.6vw, 3rem);
--type-h2: 1.75rem;
--type-h3: 1.3125rem;
--type-body-l: 1.125rem;
--type-body: 1rem;
--type-small: 0.875rem;
--type-overline: 0.75rem;
--lh-tight: 1.06;
--lh-snug: 1.18;
--lh-normal: 1.6;
--fw-regular: 400;
--fw-medium: 500;
--fw-semibold: 600;
--fw-display: 650;
--tracking-tight: -0.02em;
--tracking-normal: 0;
--tracking-overline: 0.12em;
}
:root {
--space-1: 0.25rem; --space-2: 0.5rem; --space-3: 0.75rem;
--space-4: 1rem; --space-5: 1.5rem; --space-6: 2rem;
--space-7: 3rem; --space-8: 4rem; --space-9: 6rem;
--space-10: 8rem;
--radius-sm: 8px; --radius-md: 12px; --radius-lg: 20px; --radius-pill: 999px;
--content-max: 1440px;
--bleed-max: 1920px;
--gutter: 24px;
--z-base: 1; --z-nav: 100; --z-panel: 200; --z-modal: 300; --z-toast: 400;
}
@media (max-width: 900px) { :root { --gutter: 20px; } }
@media (max-width: 560px) { :root { --gutter: 16px; } }
:root {
--ease-standard: cubic-bezier(0.2, 0, 0, 1);
--ease-emphasis: cubic-bezier(0.2, 0, 0, 1.08);
--ease-exit: cubic-bezier(0.4, 0, 1, 1);
--dur-instant: 120ms;
--dur-fast: 250ms;
--dur-base: 400ms;
--dur-slow: 700ms;
--dur-ambient: 20000ms;
--stagger: 120ms;
}
*, *::before, *::after { box-sizing: border-box; }
* { margin: 0; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
font-family: var(--font-body);
font-size: var(--type-body);
line-height: var(--lh-normal);
color: var(--text-primary);
background: var(--bg-base);
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
text-rendering: optimizeLegibility;
}
img, picture, svg, video, canvas { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; color: inherit; }
a { color: inherit; text-decoration: none; }
h1, h2, h3, h4 {
font-family: var(--font-display);
font-weight: var(--fw-display);
line-height: var(--lh-snug);
letter-spacing: var(--tracking-tight);
color: var(--text-primary);
}
.t-display-xl { font-family: var(--font-display); font-weight: var(--fw-display);
font-size: var(--type-display-xl); line-height: var(--lh-tight);
letter-spacing: var(--tracking-tight); }
.t-display-l { font-family: var(--font-display); font-weight: var(--fw-display);
font-size: var(--type-display-l); line-height: var(--lh-snug);
letter-spacing: var(--tracking-tight); }
.t-h2 { font-size: var(--type-h2); font-weight: var(--fw-semibold); line-height: var(--lh-snug); }
.t-h3 { font-size: var(--type-h3); font-weight: var(--fw-semibold); line-height: var(--lh-snug); }
.t-body-l { font-size: var(--type-body-l); line-height: var(--lh-normal); }
.t-body { font-size: var(--type-body); line-height: var(--lh-normal); }
.t-small { font-size: var(--type-small); line-height: 1.5; }
.t-mono { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-weight: var(--fw-medium); }
.t-overline {
font-size: var(--type-overline); font-weight: var(--fw-semibold);
letter-spacing: var(--tracking-overline); text-transform: uppercase;
color: var(--accent);
}
.t-secondary { color: var(--text-secondary); }
.t-muted { color: var(--text-muted); }
.container {
width: 100%; max-width: var(--content-max);
margin-inline: auto; padding-inline: var(--gutter);
}
.container--bleed { max-width: var(--bleed-max); }
.section { padding-block: var(--space-9); }
@media (max-width: 700px) { .section { padding-block: var(--space-8); } }
.grid { display: grid; gap: var(--gutter); }
.grid-12 { grid-template-columns: repeat(12, 1fr); }
@media (max-width: 900px) { .grid-12 { grid-template-columns: repeat(8, 1fr); } }
@media (max-width: 560px) { .grid-12 { grid-template-columns: repeat(4, 1fr); } }
.stack > * + * { margin-top: var(--space-4); }
.cluster { display: flex; flex-wrap: wrap; gap: var(--space-3); align-items: center; }
.btn {
--_h: 48px;
display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
min-height: var(--_h); padding-inline: var(--space-5);
font-family: var(--font-body); font-size: var(--type-body); font-weight: var(--fw-semibold);
border: 1px solid transparent; border-radius: var(--radius-md);
cursor: pointer; white-space: nowrap;
transition: background var(--dur-instant) var(--ease-standard),
border-color var(--dur-instant) var(--ease-standard),
transform var(--dur-instant) var(--ease-standard),
color var(--dur-instant) var(--ease-standard);
}
.btn:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.btn[disabled] { opacity: 0.4; pointer-events: none; }
.btn--primary { background: var(--accent); color: var(--text-on-accent); }
.btn--primary:hover { background: var(--accent-hover); transform: translateY(-1px); }
.btn--secondary { background: transparent; border-color: var(--border-strong); color: var(--text-primary); }
.btn--secondary:hover { background: var(--bg-elevated); border-color: var(--text-primary); }
.on-dark .btn--secondary { border-color: rgba(255,255,255,0.35); color: var(--text-on-dark); }
.on-dark .btn--secondary:hover { background: rgba(255,255,255,0.08); border-color: rgba(255,255,255,0.6); }
.btn--tertiary { background: transparent; padding-inline: var(--space-2); color: inherit; }
.btn--tertiary .btn__arrow { transition: transform var(--dur-fast) var(--ease-standard); }
.btn--tertiary:hover .btn__arrow { transform: translateX(4px); }
.card {
background: var(--bg-elevated); border: 1px solid var(--border-hairline);
border-radius: var(--radius-md); padding: var(--space-5); box-shadow: var(--shadow-sm);
transition: box-shadow var(--dur-fast) var(--ease-standard),
border-color var(--dur-fast) var(--ease-standard),
transform var(--dur-fast) var(--ease-standard);
}
.card--interactive { cursor: pointer; }
.card--interactive:hover { box-shadow: var(--shadow-md); border-color: var(--border-strong); transform: translateY(-2px); }
.card--interactive:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.badge {
display: inline-flex; align-items: center; gap: var(--space-1);
padding: 2px var(--space-3); font-size: var(--type-small); font-weight: var(--fw-semibold);
border-radius: var(--radius-pill); background: var(--bg-sunken); color: var(--text-secondary);
}
.badge--verified { background: color-mix(in srgb, var(--signal-verified) 14%, transparent); color: var(--signal-verified); }
.badge--accent { background: var(--accent-weak); color: var(--accent); }
.alert {
display: flex; gap: var(--space-3); padding: var(--space-4);
border-radius: var(--radius-md); background: var(--bg-elevated);
border-left: 3px solid var(--accent);
}
.alert--verified { border-left-color: var(--signal-verified); }
.alert--warning { border-left-color: var(--signal-warning); }
.alert--danger { border-left-color: var(--signal-danger); }
.glass {
background: var(--glass-fill);
-webkit-backdrop-filter: blur(var(--glass-blur));
backdrop-filter: blur(var(--glass-blur));
border: 1px solid var(--glass-border);
}
.visually-hidden {
position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link {
position: absolute; left: var(--space-4); top: -100px; z-index: var(--z-toast);
background: var(--accent); color: var(--text-on-accent);
padding: var(--space-3) var(--space-4); border-radius: var(--radius-sm);
transition: top var(--dur-fast) var(--ease-standard);
}
.skip-link:focus { top: var(--space-4); }
:where(a, button, [tabindex]):focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after {
animation-duration: 0.001ms !important;
animation-iteration-count: 1 !important;
transition-duration: 0.001ms !important;
scroll-behavior: auto !important;
}
}
[data-reveal] { opacity: 1; }
.js [data-reveal] {
opacity: 0; transform: translateY(8px);
transition: opacity var(--dur-base) var(--ease-standard),
transform var(--dur-base) var(--ease-standard);
}
.js [data-reveal].is-revealed { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
.js [data-reveal] { opacity: 1 !important; transform: none !important; }
}

/*== site-chrome.css ==*/
.util {
background: var(--c-ink-900, #0A1622); color: var(--c-slate-300, #C3CEDA);
font-size: var(--type-small);
border-bottom: 1px solid rgba(255,255,255,0.05);
}
.util__inner {
display: flex; align-items: center; justify-content: space-between;
min-height: 40px; gap: var(--space-4); flex-wrap: wrap;
}
.util__identity { display: flex; align-items: center; gap: var(--space-3); flex-wrap: wrap; }
.util__dot { opacity: .4; }
.util__contact { display: flex; align-items: center; gap: var(--space-4); }
.util__contact a { color: inherit; }
.util__contact a.is-accent { color: var(--accent); font-weight: 600; }
@media (max-width: 720px) {
.util__identity .util__dot, .util__identity span:nth-child(n+3) { display: none; }
.util__contact a:not(.is-accent):not([href^="tel"]) { display: none; }
}
.site-header {
background: var(--c-ink-800, #0F2233); color: var(--text-on-dark, #F4F7FA);
border-bottom: 1px solid rgba(255,255,255,0.06);
position: relative; z-index: 40;
}
.site-header__inner {
display: flex; align-items: center; justify-content: space-between;
min-height: 64px; gap: var(--space-5);
}
.brand { display: flex; align-items: center; gap: var(--space-2); }
.brand img { display: block; height: 40px; width: auto; aspect-ratio: 1451 / 915; }
.brand strong { font-family: var(--font-display); font-size: 1.5rem; letter-spacing: -0.02em; color: var(--text-on-dark); }
.brand span { font-size: var(--type-small); color: var(--c-slate-400); }
.site-nav { display: flex; align-items: center; gap: var(--space-5); }
.site-nav > .btn { display: none; }
.site-nav a { color: var(--text-on-dark); position: relative; }
.site-nav a::after {
content: ""; position: absolute; left: 0; right: 100%; bottom: -6px; height: 2px;
background: var(--accent); transition: right var(--dur-fast, .15s) var(--ease-standard, ease);
}
.site-nav a:hover::after, .site-nav a:focus-visible::after { right: 0; }
.site-header__cta { flex: none; }
.nav-toggle {
display: none; width: 44px; height: 44px; border: 0; background: transparent;
cursor: pointer; color: var(--text-on-dark); border-radius: var(--radius-sm);
}
.nav-toggle span, .nav-toggle span::before, .nav-toggle span::after {
content: ""; display: block; width: 22px; height: 2px; background: currentColor;
border-radius: 2px; transition: transform .25s var(--ease-standard, ease), opacity .2s ease;
margin-inline: auto;
}
.nav-toggle span { position: relative; }
.nav-toggle span::before { position: absolute; top: -7px; }
.nav-toggle span::after { position: absolute; top: 7px; }
.nav-toggle[aria-expanded="true"] span { background: transparent; }
.nav-toggle[aria-expanded="true"] span::before { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] span::after { transform: translateY(-7px) rotate(-45deg); }
.nav-toggle:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
@media (max-width: 900px) {
.nav-toggle { display: block; }
.site-header__cta { display: none; }
.site-nav {
position: absolute; top: 100%; left: 0; right: 0;
flex-direction: column; align-items: stretch; gap: 0;
background: var(--c-ink-800, #0F2233);
border-bottom: 1px solid rgba(255,255,255,0.08);
padding: var(--space-2) var(--gutter) var(--space-4);
transform: translateY(-8px); opacity: 0; visibility: hidden; pointer-events: none;
transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
box-shadow: var(--shadow-lg, 0 20px 40px rgba(0,0,0,.4));
}
.site-nav.is-open {
transform: none; opacity: 1; visibility: visible; pointer-events: auto;
transition-delay: 0s;
}
.site-nav a { padding: var(--space-3) 0; border-bottom: 1px solid rgba(255,255,255,0.06); }
.site-nav a::after { display: none; }
.site-nav > .btn { display: flex; margin-top: var(--space-3); width: 100%; }
}

/*== hero.css ==*/
.hero {
position: relative;
color: var(--text-on-dark);
background: var(--hero-grad);
overflow: hidden;
isolation: isolate;
}
.hero.on-dark { }
.hero__inner {
position: relative;
display: grid;
grid-template-columns: minmax(0, 42%) minmax(0, 58%);
align-items: center;
gap: var(--space-7);
min-height: min(88vh, 900px);
padding-block: var(--space-8);
}
@media (max-width: 1000px) {
.hero__inner { grid-template-columns: 1fr; min-height: auto; gap: var(--space-6); }
}
.hero__content { position: relative; z-index: 2; max-width: 34rem; }
.hero__eyebrow { color: var(--accent); margin-bottom: var(--space-4); }
.hero__headline { color: var(--text-on-dark); margin-bottom: var(--space-4); }
.hero__headline .acc { color: var(--accent); }
.hero__sub {
color: var(--c-slate-300);
font-size: var(--type-body-l);
margin-bottom: var(--space-6);
max-width: 32rem;
}
.hero__ctas { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-bottom: var(--space-7); }
.hero__trust {
display: flex; flex-wrap: wrap; gap: var(--space-5);
padding-top: var(--space-5);
border-top: 1px solid rgba(255, 255, 255, 0.12);
}
.hero__trust-item { display: flex; align-items: center; gap: var(--space-2); max-width: 15rem; }
.hero__trust-item svg { flex: none; width: 26px; height: 26px; color: var(--accent); }
.hero__trust-item b { display: block; font-size: var(--type-small); color: var(--text-on-dark); font-weight: var(--fw-semibold); }
.hero__trust-item span { font-size: var(--type-small); color: var(--c-slate-400); }
.hero__stage {
position: relative;
z-index: 1;
aspect-ratio: 4 / 3;
border-radius: var(--radius-lg);
overflow: hidden;
}
@media (max-width: 1000px) {
.hero__stage { aspect-ratio: 16 / 11; margin-top: var(--space-4); }
}
.hero__planes { position: absolute; inset: 0; }
.hero__plane {
position: absolute; inset: -4%;
width: 108%; height: 108%;
will-change: transform;
transform: translate3d(var(--px, 0), var(--py, 0), 0);
transition: transform 600ms var(--ease-standard);
}
.hero__plane svg, .hero__plane img { width: 100%; height: 100%; object-fit: cover; }
.hero__light {
position: absolute; inset: 0; pointer-events: none; mix-blend-mode: screen;
background: radial-gradient(60% 50% at 72% 22%, rgba(233,114,28,0.28), transparent 70%);
animation: heroBreath var(--dur-ambient) ease-in-out infinite;
}
@keyframes heroBreath {
0%, 100% { opacity: 0.5; }
50% { opacity: 0.95; }
}
.hero__stage::after {
content: ""; position: absolute; inset: 0; pointer-events: none;
background: radial-gradient(120% 100% at 50% 40%, transparent 55%, rgba(6,12,20,0.45) 100%);
}
.hero__hotspots { position: absolute; inset: 0; z-index: 3; }
.hotspot {
position: absolute;
left: var(--x); top: var(--y);
transform: translate(-50%, -50%);
width: 34px; height: 34px;
display: grid; place-items: center;
border-radius: var(--radius-pill);
background: transparent; border: 0; cursor: pointer;
color: var(--text-on-dark);
}
.hotspot__dot {
position: relative; width: 14px; height: 14px; border-radius: var(--radius-pill);
background: var(--accent); box-shadow: 0 0 0 4px rgba(233,114,28,0.25);
}
.hotspot__dot::before {
content: ""; position: absolute; inset: -6px; border-radius: inherit;
border: 2px solid var(--accent);
animation: hotspotPulse 2500ms var(--ease-standard) infinite;
}
@keyframes hotspotPulse {
0% { transform: scale(0.7); opacity: 0.9; }
70% { transform: scale(1.5); opacity: 0; }
100% { transform: scale(1.5); opacity: 0; }
}
.hotspot:hover .hotspot__dot,
.hotspot:focus-visible .hotspot__dot { box-shadow: 0 0 0 6px rgba(233,114,28,0.35); }
.hotspot:focus-visible { outline: 2px solid var(--accent); outline-offset: 4px; border-radius: var(--radius-pill); }
.hotspot__card {
position: absolute; left: 50%; bottom: calc(100% + 12px);
transform: translateX(-50%) translateY(6px);
width: max-content; max-width: 260px;
text-align: left;
padding: var(--space-3) var(--space-4);
border-radius: var(--radius-md);
background: var(--glass-fill);
-webkit-backdrop-filter: blur(var(--glass-blur));
backdrop-filter: blur(var(--glass-blur));
border: 1px solid var(--glass-border);
box-shadow: var(--shadow-panel);
opacity: 0; pointer-events: none;
transition: opacity var(--dur-fast) var(--ease-standard),
transform var(--dur-fast) var(--ease-standard);
}
.hotspot:hover .hotspot__card,
.hotspot:focus-visible .hotspot__card {
opacity: 1; transform: translateX(-50%) translateY(0);
}
.hotspot__card b { display: block; font-size: var(--type-small); color: var(--text-on-dark); }
.hotspot__card span { display: block; font-size: var(--type-small); color: var(--c-slate-300); margin-top: 2px; }
.hotspot__card em {
display: inline-block; margin-top: var(--space-2); font-style: normal;
font-size: var(--type-small); font-weight: var(--fw-semibold); color: var(--accent);
}
.hotspot__card::after {
content: ""; position: absolute; left: 50%; top: 100%;
transform: translateX(-50%);
border: 6px solid transparent; border-top-color: var(--glass-border);
}
@media (prefers-reduced-motion: reduce) {
.hotspot__dot::before { animation: none; }
.hero__light { animation: none; opacity: 0.7; }
.hero__plane { transition: none; }
}
.hero__hotspot-list { display: none; }
@media (max-width: 720px) {
.hero__hotspots { display: none; }
.hero__hotspot-list {
display: block; margin-top: var(--space-5);
border-top: 1px solid rgba(255,255,255,0.12); padding-top: var(--space-4);
}
.hero__hotspot-list h2 { font-size: var(--type-small); color: var(--c-slate-400);
text-transform: uppercase; letter-spacing: var(--tracking-overline); margin-bottom: var(--space-3); }
.hero__hotspot-list ul { list-style: none; display: grid; gap: var(--space-2); }
.hero__hotspot-list a {
display: flex; align-items: center; justify-content: space-between; gap: var(--space-3);
padding: var(--space-3) var(--space-4);
background: rgba(255,255,255,0.05); border: 1px solid rgba(255,255,255,0.10);
border-radius: var(--radius-md); color: var(--text-on-dark); font-weight: var(--fw-medium);
}
.hero__hotspot-list a:hover, .hero__hotspot-list a:focus-visible { background: rgba(255,255,255,0.09); }
.hero__hotspot-list a span { color: var(--accent); }
}
.hero-stats {
position: relative; z-index: 2;
border-top: 1px solid rgba(255,255,255,0.10);
background: rgba(6,12,20,0.4);
}
.hero-stats__grid {
display: grid; grid-template-columns: repeat(6, 1fr);
gap: var(--space-4); padding-block: var(--space-5);
}
@media (max-width: 900px) { .hero-stats__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 480px) { .hero-stats__grid { grid-template-columns: repeat(2, 1fr); } }
.hero-stat { text-align: left; }
.hero-stat b {
font-family: var(--font-display); font-weight: var(--fw-display);
font-size: 1.75rem; color: var(--text-on-dark); font-variant-numeric: tabular-nums;
display: block; line-height: 1.1;
}
.hero-stat span { font-size: var(--type-small); color: var(--c-slate-400); }

/*== homepage.css ==*/
.sec-head { max-width: 60ch; margin-bottom: var(--space-7); }
.sec-head--center { margin-inline: auto; text-align: center; }
.sec-head .t-overline { color: var(--accent); }
.sec-head h2 { margin-top: var(--space-3); }
.sec-head p { margin-top: var(--space-3); color: var(--text-secondary); }
.section--tint { background: var(--bg-elevated); }
.section--ink { background: var(--c-ink-900, #0A1622); color: var(--text-on-dark); }
.section--ink .t-overline { color: var(--accent); }
.section--ink h2, .section--ink h3 { color: var(--text-on-dark); }
.section--ink p { color: var(--c-slate-300, #C3CEDA); }
.link-more { display: inline-flex; align-items: center; gap: 6px; color: var(--accent); font-weight: var(--fw-semibold); }
.link-more::after { content: "\2192"; transition: transform var(--dur-fast,.15s) ease; }
.link-more:hover::after { transform: translateX(4px); }
.v11-asset { position: relative; background: linear-gradient(135deg, var(--bg-sunken,#0A1019), var(--bg-elevated,#111E2E)); overflow: hidden; }
.v11-asset::after {
content: "Version 1.1 Asset"; position: absolute; right: 8px; bottom: 8px;
font-size: 10px; letter-spacing: .04em; text-transform: uppercase;
color: var(--text-muted,#6E8093); background: rgba(0,0,0,.35);
padding: 2px 8px; border-radius: var(--radius-pill); border: 1px solid rgba(255,255,255,.12);
}
.v11-asset svg { position: absolute; inset: 0; width: 100%; height: 100%; opacity: .5; }
.solution-card { display: flex; flex-direction: column; min-height: 190px; }
.solution-card .sol-icon { width: 40px; height: 40px; margin-bottom: var(--space-3); color: var(--accent); }
.solution-card .sol-explore { margin-top: auto; padding-top: var(--space-3); color: var(--accent); font-weight: var(--fw-semibold); font-size: var(--type-small); opacity: 0; transform: translateY(4px); transition: all var(--dur-fast,.15s) ease; }
.solution-card:hover .sol-explore, .solution-card:focus-visible .sol-explore { opacity: 1; transform: none; }
.product-scroll { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(240px, 1fr); gap: var(--space-4); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: var(--space-3); scrollbar-width: thin; }
@media (min-width: 1000px) { .product-scroll { grid-template-columns: repeat(4, 1fr); grid-auto-flow: row; overflow: visible; } }
.product-card { scroll-snap-align: start; display: flex; flex-direction: column; background: var(--bg-elevated); border: 1px solid var(--border-hairline); border-radius: var(--radius-md); overflow: hidden; transition: transform var(--dur-base,.25s) var(--ease-standard,ease), box-shadow var(--dur-base,.25s) ease; }
.product-card:hover { transform: translateY(-4px); box-shadow: var(--shadow-lg, 0 20px 40px rgba(0,0,0,.18)); }
.product-card__img { aspect-ratio: 4/3; }
.product-card__body { padding: var(--space-4); display: flex; flex-direction: column; gap: 6px; flex: 1; }
.product-card__brand { font-size: var(--type-overline); text-transform: uppercase; letter-spacing: var(--tracking-overline); color: var(--accent); }
.product-card__name { font-weight: var(--fw-semibold); color: var(--text-primary); }
.product-card__cat { font-size: var(--type-small); color: var(--text-muted); margin-top: auto; }
.split { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); align-items: center; }
@media (max-width: 860px) { .split { grid-template-columns: 1fr; gap: var(--space-5); } }
.split__media { aspect-ratio: 4/3; border-radius: var(--radius-lg); border: 1px solid var(--border-hairline); }
.split--rev .split__media { order: 2; }
@media (max-width: 860px) { .split--rev .split__media { order: 0; } }
.split ul { margin-top: var(--space-4); display: grid; gap: var(--space-2); }
.split li { display: flex; gap: var(--space-2); align-items: flex-start; color: var(--text-secondary); }
.split li::before { content: "\2713"; color: var(--accent); font-weight: 700; flex: none; }
.feature-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
@media (max-width: 860px) { .feature-grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px) { .feature-grid { grid-template-columns: 1fr; } }
.feature { padding: var(--space-5); border: 1px solid var(--border-hairline); border-radius: var(--radius-md); background: var(--bg-base); }
.feature__icon { width: 44px; height: 44px; border-radius: var(--radius-md); display: grid; place-items: center; background: var(--accent-weak, #2A1B10); color: var(--accent); margin-bottom: var(--space-3); }
.feature h3 { font-size: var(--type-h3); }
.feature p { margin-top: var(--space-2); color: var(--text-secondary); font-size: var(--type-small); }
.industry-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-4); }
@media (max-width: 900px) { .industry-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 480px) { .industry-grid { grid-template-columns: 1fr; } }
.industry { position: relative; aspect-ratio: 3/2; border-radius: var(--radius-md); overflow: hidden; display: flex; align-items: flex-end; padding: var(--space-4); color: #fff; border: 1px solid var(--border-hairline); }
.industry::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(6,12,20,.85), rgba(6,12,20,.15)); z-index: 1; }
.industry span { position: relative; z-index: 2; font-weight: var(--fw-semibold); }
.support { display: grid; grid-template-columns: 1.2fr 1fr; gap: var(--space-6); align-items: center; }
@media (max-width: 860px) { .support { grid-template-columns: 1fr; } }
.support__actions { display: flex; gap: var(--space-3); flex-wrap: wrap; margin-top: var(--space-4); }
.knowledge-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-5); }
@media (max-width: 860px) { .knowledge-grid { grid-template-columns: 1fr; } }
.article { display: flex; flex-direction: column; border: 1px solid var(--border-hairline); border-radius: var(--radius-md); overflow: hidden; background: var(--bg-base); transition: transform var(--dur-base,.25s) ease; }
.article:hover { transform: translateY(-4px); }
.article__img { aspect-ratio: 16/9; }
.article__body { padding: var(--space-4); }
.article__tag { font-size: var(--type-overline); text-transform: uppercase; letter-spacing: var(--tracking-overline); color: var(--accent); }
.article h3 { font-size: var(--type-h4, 1.1rem); margin-top: var(--space-2); }
.project-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; grid-template-rows: 1fr 1fr; gap: var(--space-4); }
.project { position: relative; border-radius: var(--radius-md); overflow: hidden; min-height: 180px; display: flex; align-items: flex-end; padding: var(--space-4); color: #fff; border: 1px solid var(--border-hairline); }
.project::before { content: ""; position: absolute; inset: 0; background: linear-gradient(to top, rgba(6,12,20,.9), rgba(6,12,20,.1)); z-index: 1; }
.project > * { position: relative; z-index: 2; }
.project--hero { grid-row: span 2; }
.project__meta b { display: block; font-size: var(--type-h4,1.1rem); }
.project__meta span { font-size: var(--type-small); opacity: .85; }
@media (max-width: 860px) { .project-grid { grid-template-columns: 1fr 1fr; } .project--hero { grid-column: span 2; grid-row: auto; } }
@media (max-width: 520px) { .project-grid { grid-template-columns: 1fr; } .project--hero { grid-column: auto; } }
.cert-row { display: flex; flex-wrap: wrap; gap: var(--space-4); align-items: center; justify-content: center; }
.cert { width: 130px; height: 72px; border-radius: var(--radius-md); display: grid; place-items: center; text-align: center; font-size: var(--type-small); color: var(--text-muted); border: 1px solid var(--border-hairline); background: var(--bg-base); padding: var(--space-2); }
.stats-band { display: grid; grid-template-columns: repeat(4, 1fr); gap: var(--space-5); }
@media (max-width: 720px) { .stats-band { grid-template-columns: 1fr 1fr; gap: var(--space-6) var(--space-4); } }
.stat-b { text-align: center; }
.stat-b b { display: block; font-family: var(--font-display); font-size: clamp(2rem, 4vw, 3rem); line-height: 1; color: var(--accent); }
.stat-b span { display: block; margin-top: var(--space-2); font-size: var(--type-small); color: var(--text-secondary); }
.download-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: var(--space-4); }
@media (max-width: 860px) { .download-grid { grid-template-columns: 1fr; } }
.download { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4); border: 1px solid var(--border-hairline); border-radius: var(--radius-md); background: var(--bg-base); transition: border-color var(--dur-fast,.15s) ease, transform var(--dur-fast,.15s) ease; }
.download:hover { border-color: var(--accent); transform: translateY(-2px); }
.download__icon { width: 40px; height: 40px; flex: none; border-radius: var(--radius-sm); display: grid; place-items: center; background: var(--accent-weak,#2A1B10); color: var(--accent); }
.download b { display: block; font-size: var(--type-small); color: var(--text-primary); }
.download span { font-size: 12px; color: var(--text-muted); }
.cta-band { position: relative; border-radius: var(--radius-lg); overflow: hidden; padding: var(--space-9) var(--space-6); text-align: center; background: linear-gradient(135deg, var(--c-ink-800,#0F2A47), var(--c-ink-900,#0A1622)); border: 1px solid var(--border-strong,#2A3E56); }
.cta-band h2 { color: var(--text-on-dark); max-width: 24ch; margin-inline: auto; }
.cta-band p { color: var(--c-slate-300,#C3CEDA); max-width: 50ch; margin: var(--space-3) auto 0; }
.cta-band .cluster { justify-content: center; margin-top: var(--space-5); gap: var(--space-3); }
.cta-band__glow { position: absolute; width: 480px; height: 480px; border-radius: 50%; background: radial-gradient(circle, rgba(233,114,28,.25), transparent 60%); top: -160px; right: -120px; pointer-events: none; }
.contact { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-6); }
@media (max-width: 860px) { .contact { grid-template-columns: 1fr; } }
.contact__methods { display: grid; gap: var(--space-3); }
.contact__method { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-3) 0; border-bottom: 1px solid var(--border-hairline); }
.contact__method b { display: block; color: var(--text-primary); }
.contact__method span { color: var(--text-secondary); font-size: var(--type-small); }
.contact__form { display: grid; gap: var(--space-3); }
.field { display: grid; gap: 6px; }
.field label { font-size: var(--type-small); color: var(--text-secondary); }
.field input, .field textarea { padding: var(--space-3); border-radius: var(--radius-sm); border: 1px solid var(--border-hairline); background: var(--bg-base); color: var(--text-primary); font: inherit; }
.field input:focus, .field textarea:focus { outline: 2px solid var(--accent); outline-offset: 1px; border-color: var(--accent); }
.site-footer { background: var(--c-ink-900, #0A1622); color: var(--c-slate-300,#C3CEDA); padding-block: var(--space-8) var(--space-5); border-top: 1px solid rgba(255,255,255,.06); }
.footer-grid { display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: var(--space-6); }
@media (max-width: 860px) { .footer-grid { grid-template-columns: 1fr 1fr; gap: var(--space-5); } }
@media (max-width: 480px) { .footer-grid { grid-template-columns: 1fr; } }
.footer-brand img { display: block; height: 44px; width: auto; aspect-ratio: 1451 / 915; }
.footer-brand strong { font-family: var(--font-display); font-size: 1.5rem; color: var(--text-on-dark); }
.footer-col h4 { color: var(--text-on-dark); font-size: var(--type-small); text-transform: uppercase; letter-spacing: var(--tracking-overline); margin-bottom: var(--space-3); }
.footer-col a { display: block; padding: 5px 0; color: var(--c-slate-300,#C3CEDA); font-size: var(--type-small); }
.footer-col a:hover { color: var(--accent); }
.footer-bottom { display: flex; justify-content: space-between; gap: var(--space-4); flex-wrap: wrap; margin-top: var(--space-7); padding-top: var(--space-4); border-top: 1px solid rgba(255,255,255,.06); font-size: var(--type-small); color: var(--text-muted,#6E8093); }
[data-reveal] { opacity: 0; transform: translateY(16px); transition: opacity .6s var(--ease-standard,ease), transform .6s var(--ease-standard,ease); }
[data-reveal].is-visible { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) { [data-reveal] { opacity: 1; transform: none; transition: none; } }
.t-h1 { font-family: var(--font-display); font-weight: var(--fw-display, 800);
font-size: var(--type-h1, clamp(1.9rem, 3.4vw, 2.9rem)); line-height: var(--lh-tight, 1.1); letter-spacing: -0.02em; }
.t-h4 { font-size: var(--type-h4, 1.15rem); font-weight: var(--fw-semibold, 600); line-height: var(--lh-snug, 1.25); }
.btn--lg { padding: var(--space-3) var(--space-5); font-size: var(--type-body-l, 1.05rem); }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.industry .v11-asset, .project .v11-asset { background: linear-gradient(135deg, #13273A, #0C1A28); }
.industry .v11-asset::after, .project .v11-asset::after { color: rgba(255,255,255,.35); background: rgba(0,0,0,.3); }
.asset-img { width: 100%; height: 100%; object-fit: cover; display: block; }
.product-card__img { overflow: hidden; }
.product-card__img .asset-img { transition: transform var(--dur-base,.25s) var(--ease-standard,ease); }
.product-card:hover .product-card__img .asset-img { transform: scale(1.05); }
.article__img { overflow: hidden; }
.split-img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: inherit; }
.tile-img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; }
.industry > .pic, .project > .pic { position: absolute; inset: 0; z-index: 0; }
.industry > .pic .tile-img, .project > .pic .tile-img { position: absolute; inset: 0; }
.industry span, .project__meta { position: relative; z-index: 2; }
.industry::before, .project::before { z-index: 1; }
.industry .tile-img, .project .tile-img { transition: transform 3s var(--ease-standard,ease); }
.industry:hover .tile-img, .project:hover .tile-img { transform: scale(1.06); }
.contact__illus { border-radius: var(--radius-lg); overflow: hidden; border: 1px solid var(--border-hairline); aspect-ratio: 4/3; }
.contact__illus img { width: 100%; height: 100%; object-fit: cover; display: block; }
@media (max-width: 860px) { .contact__illus { display: none; } }
.proj-detail__top { display:grid; grid-template-columns: 1.15fr 1fr; gap: var(--space-7); align-items:start; }
.proj-detail__main { border-radius: var(--radius-lg); overflow:hidden; border:1px solid var(--border-hairline); aspect-ratio:16/9; position:relative; }
.proj-detail__loc { color: var(--accent); font-weight:600; }
.proj-scope { list-style:none; padding:0; margin:var(--space-5) 0 0; display:grid; gap:var(--space-3); }
.proj-scope li { display:flex; gap:var(--space-3); align-items:flex-start; }
.proj-scope li::before { content:""; flex:0 0 auto; width:8px; height:8px; margin-top:.5em; border-radius:2px; background:var(--accent); }
.proj-scope b { color:var(--text-strong,inherit); }
.proj-scope .brand-sika { color: var(--accent); font-weight:600; }
.proj-apps { display:grid; grid-template-columns: repeat(4,1fr); gap:var(--space-4); margin-top:var(--space-7); }
.proj-app { border-radius: var(--radius-md); overflow:hidden; border:1px solid var(--border-hairline); background:var(--bg-sunken,#0A1019); }
.proj-app .pic { aspect-ratio:4/3; }
.proj-app__cap { padding: var(--space-3) var(--space-4); }
.proj-app__cap b { display:block; font-size:.95rem; }
.proj-app__cap span { display:block; color:var(--text-muted,#8FA6B8); font-size:.8rem; margin-top:2px; }
.proj-gallery { display:grid; grid-template-columns: repeat(3,1fr); gap:var(--space-4); margin-top:var(--space-6); }
.proj-gallery .pic { aspect-ratio:4/3; border-radius: var(--radius-md); overflow:hidden; border:1px solid var(--border-hairline); }
.pic[data-demo] { background:
repeating-linear-gradient(45deg, rgba(197,90,17,.06) 0 12px, transparent 12px 24px),
var(--bg-elevated,#111E2E); display:flex; align-items:center; justify-content:center; }
.pic[data-demo]::after { content:"DEMO — REPLACE WITH REAL PHOTO"; content: attr(data-demo);
position:absolute; inset:auto; max-width:80%; text-align:center;
font-size:10px; letter-spacing:.05em; text-transform:uppercase; line-height:1.4;
color:rgba(255,255,255,.7); background:rgba(0,0,0,.45); padding:6px 10px; border-radius:8px;
border:1px solid rgba(197,90,17,.4); }
.pic[data-demo] .demo-icon { width:34px; height:34px; opacity:.5; position:absolute; top:14px; left:50%; transform:translateX(-50%); }
@media (max-width: 900px){
.proj-detail__top { grid-template-columns:1fr; gap:var(--space-6); }
.proj-apps { grid-template-columns:repeat(2,1fr); }
.proj-gallery { grid-template-columns:repeat(3,1fr); }
}
@media (max-width: 520px){
.proj-apps { grid-template-columns:1fr; }
.proj-gallery { grid-template-columns:1fr; }
}
.split__media[data-sika-range] { background: #FEB003; }
.split__media[data-sika-range] .split-img { object-fit: contain; }

/*== image-slots.css ==*/
.pic { display: block; position: relative; width: 100%; height: 100%; }
.pic > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.product-card__img { aspect-ratio: 4 / 3; }
.article__img { aspect-ratio: 16 / 9; }
.split__media { aspect-ratio: 4 / 3; }
.industry { aspect-ratio: 3 / 2; }
.pic::before {
content: ""; position: absolute; inset: 0; z-index: 0;
background: linear-gradient(100deg, var(--bg-sunken,#0A1019) 30%, var(--bg-elevated,#111E2E) 50%, var(--bg-sunken,#0A1019) 70%);
background-size: 200% 100%;
animation: pic-shimmer 1.4s linear infinite;
opacity: 0; transition: opacity .3s ease;
}
.pic:has(img:not([data-loaded]))::before { opacity: .6; }
.pic > img { position: relative; z-index: 1; }
@keyframes pic-shimmer { from { background-position: 200% 0; } to { background-position: -200% 0; } }
@media (prefers-reduced-motion: reduce) { .pic::before { animation: none; } }
.pic[data-ph="svg"]::after {
content: "photo pending"; position: absolute; right: 6px; bottom: 6px; z-index: 2;
font-size: 9px; letter-spacing: .04em; text-transform: uppercase;
color: rgba(255,255,255,.55); background: rgba(0,0,0,.35);
padding: 2px 7px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12);
pointer-events: none;
}
body.hide-slot-tags .pic[data-ph="svg"]::after { display: none; }
.hero-photo {
position: absolute; inset: 0; z-index: 0; display: block; overflow: hidden;
}
.hero-photo img { width: 100%; height: 100%; object-fit: cover; display: block; }
.hq-wrap > .hq { position: relative; z-index: 1; }
[data-hero][data-has-photo] .hq { opacity: 0; transition: opacity .5s ease; pointer-events: none; }
[data-hero][data-has-photo] .hero-lighting { display: none; }
.industry, .project, .product-card, .article, .split__media { contain: layout paint; }

/*== premium.v2.css ==*/
:root{
--font-display: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--font-body: "Inter", "Inter Fallback", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
--type-display-xl: clamp(2.4rem, 1.6rem + 2.8vw, 4rem);
--type-display-l: clamp(2rem, 1.5rem + 2vw, 3rem);
--fw-display: 800;
--tracking-tight: -0.022em;
--tracking-overline: 0.16em;
}
.t-display-xl, .t-display-l, .t-h1{
font-family: var(--font-display);
font-weight: 800;
letter-spacing: var(--tracking-tight);
line-height: 1.04;
}
.t-h2{ font-weight: 700; letter-spacing: -0.018em; line-height: 1.12; }
.t-h3{ font-weight: 700; letter-spacing: -0.01em; }
h1,h2,h3,h4{ font-family: var(--font-display); text-wrap: balance; }
body{ font-family: var(--font-body); -webkit-font-smoothing: antialiased; }
.t-overline{
font-size: 0.72rem;
font-weight: 700;
letter-spacing: var(--tracking-overline);
text-transform: uppercase;
color: var(--accent);
}
.section--tint .t-overline, .hero .t-overline{ color: #F0873A; }
.t-body-l{ font-size: clamp(1.02rem,0.97rem+0.2vw,1.15rem); line-height: 1.6; }
p{ text-wrap: pretty; }
:root{
--accent: #E9721C;
--accent-hover: #F5852E;
--hairline: rgba(255,255,255,0.09);
--hairline-strong: rgba(255,255,255,0.16);
}
.border-hairline, .split__media, .industry, .product-card, .article, .proj-app, .cert{
border-color: var(--hairline) !important;
}
.section{ padding-block: clamp(4.5rem, 3rem + 6vw, 8.5rem); }
.sec-head{ margin-bottom: clamp(2.5rem, 1.5rem + 3vw, 4rem); }
.sec-head .t-overline{ margin-bottom: 0.9rem; display:block; }
.container{ max-width: 1240px; }
.btn{
font-family: var(--font-body);
font-weight: 600;
letter-spacing: 0.01em;
border-radius: 10px;
padding: 0.9rem 1.5rem;
transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.btn--primary{ background: var(--accent); color:#fff; border:1px solid var(--accent); }
.btn--primary:hover{ background: var(--accent-hover); border-color: var(--accent-hover); transform: translateY(-1px); }
.btn--ghost, .btn--secondary{
background: transparent; color: inherit;
border:1px solid var(--hairline-strong);
}
.btn--ghost:hover, .btn--secondary:hover{ border-color: var(--accent); color: var(--accent); transform: translateY(-1px); }
.sec-head .t-h1, .sec-head .t-h2{ max-width: 20ch; }
.sec-head--center .t-h2{ max-width: 24ch; margin-inline:auto; }
.sec-head--center .t-overline{ position:relative; }
.industry, .product-card, .article{
border-radius: 14px;
box-shadow: none;
transition: transform .2s ease, border-color .2s ease;
}
.industry:hover, .product-card:hover, .article:hover{
transform: translateY(-3px);
border-color: var(--hairline-strong) !important;
}
.why-card, .feature-card, .value-card{
background: transparent !important;
border:1px solid var(--hairline) !important;
border-radius: 12px;
}
.stat-b b, .hero-stat b, .stat-num{
font-family: var(--font-display);
font-weight: 800;
font-variant-numeric: tabular-nums;
letter-spacing: -0.02em;
color: var(--text-primary) !important;
}
.stat-b, .hero-stat{ position:relative; padding-top: 1.1rem; }
.stat-b::before, .hero-stat::before{
content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
width:26px; height:2px; background:var(--accent); border-radius:2px;
}
.stat-b span, .hero-stat span{
letter-spacing: 0.02em; text-transform: none;
color: var(--text-secondary);
}
.pic, .tile-img, .split-img{ }
.industry::after{
content:""; position:absolute; inset:auto 0 0 0; height:55%;
background:linear-gradient(to top, rgba(6,12,20,.78), rgba(6,12,20,0));
pointer-events:none; z-index:0;
}
.industry > *{ position:relative; z-index:1; }
.industry span{ font-weight:700; letter-spacing:-0.01em; }
.site-footer, footer{ padding-block: clamp(3.5rem,2rem+4vw,5.5rem) 2rem; }
.site-footer h4, footer h4{
font-size:.72rem; letter-spacing:.14em; text-transform:uppercase;
color: var(--text-muted); font-weight:700; margin-bottom:1rem;
}
.site-nav a, nav a{ letter-spacing:.005em; }
.site-nav a:hover, nav a:hover{ color: var(--accent); }
@media (max-width: 768px){
.section{ padding-block: clamp(3.25rem, 2rem + 5vw, 4.5rem); }
.sec-head .t-h1, .sec-head .t-h2{ max-width: none; }
}
.hero__hotspots, .hotspot{ display:none !important; }
.hero__headline .acc{ color: var(--accent); font-weight:800; }
.hero__headline{ letter-spacing:-0.02em; font-size:clamp(1.9rem,1.35rem+2.1vw,3.9rem); line-height:1.08; overflow-wrap:break-word; }
@media (min-width:769px){ .hero__headline{ font-size:56px; line-height:60px; min-height:240px; } }
.hero__eyebrow{ margin-bottom:1.1rem; }
.hero__sub{ max-width:44ch; color:var(--text-secondary); font-size:clamp(1.02rem,0.97rem+0.2vw,1.16rem); line-height:1.62; margin-top:1.3rem; }
.hero__ctas{ margin-top:2.2rem; gap:0.9rem; }
.hero__media, .hero__photo{ border-radius:16px; overflow:hidden; }
.util-bar, .topbar{ font-size:0.8rem; letter-spacing:0.01em; }
.hero__content{ contain: layout; }
.hero__headline{ min-height: 4.35em; }
@media (min-width:769px){ .hero__content{ min-height: 430px; } }
@media (max-width:768px){ .hero__headline{ min-height: 4.4em; } }
.util__inner{ min-height: 44px; height: 44px; }
@media (min-width: 601px){
.util__inner{ flex-wrap: nowrap !important; white-space: nowrap; overflow: hidden; }
.util__identity{ flex-wrap: nowrap; white-space: nowrap; min-width: 0; overflow:hidden; }
.util__contact{ flex-wrap: nowrap; white-space: nowrap; }
}
.project::before{
background: linear-gradient(to top, rgba(6,12,20,.94) 0%, rgba(6,12,20,.55) 38%, rgba(6,12,20,.05) 70%) !important;
}
.project__meta b{ font-weight:700; letter-spacing:-0.01em; }
.project__meta{ text-shadow: 0 1px 12px rgba(0,0,0,.45); }
.project .pic[data-ph="demo"] .v11-asset::after,
.project .v11-asset::after{ align-self:flex-start; margin-top:10px; }
.project .v11-asset{ align-items:flex-start !important; justify-content:flex-start !important; padding-top:8px; }
.pic[data-ph="svg"]::after,
.pic[data-ph="ph"]::after{ content:"" !important; display:none !important; }
.pic[data-ph="svg"], .pic[data-ph="ph"]{
background:
radial-gradient(120% 100% at 50% 0%, rgba(233,114,28,0.05), transparent 60%),
linear-gradient(160deg, #12203033 0%, #0C18248f 55%, #0A131E 100%);
border-radius: inherit;
}
.pic[data-ph="svg"] > img, .pic[data-ph="ph"] > img{ opacity:0.10 !important; filter:grayscale(1); }
.pic[data-ph="svg"]::before, .pic[data-ph="ph"]::before{
content:""; position:absolute; inset:10px; z-index:1;
border:1px solid rgba(255,255,255,0.07); border-radius:8px;
background:
linear-gradient(var(--accent),var(--accent)) left 0 top 0/16px 2px no-repeat,
linear-gradient(var(--accent),var(--accent)) left 0 top 0/2px 16px no-repeat;
opacity:1; animation:none;
}
.pic[data-caption]{ }
.pic[data-caption]::after{
content: attr(data-caption) !important; display:block !important;
position:absolute; left:0; right:0; bottom:0; z-index:2;
padding:14px 16px; text-align:center;
font-family:var(--font-display); font-weight:600; font-size:0.82rem;
letter-spacing:0.01em; color:rgba(255,255,255,0.78);
background:linear-gradient(to top, rgba(6,12,20,0.55), transparent);
text-transform:none;
}
.industry .pic[data-caption]::after{ content:"" !important; display:none !important; }
.project .pic[data-caption]::after{ content:"" !important; display:none !important; }
.qual-grid{
display:grid; grid-template-columns:repeat(3,1fr);
gap:1px; background:var(--hairline);
border:1px solid var(--hairline); border-radius:14px; overflow:hidden;
}
.qual-item{
background:var(--bg-base,#0B1420); padding:2rem 1.75rem;
display:flex; flex-direction:column; gap:0.5rem; position:relative;
}
.qual-item::before{ content:""; position:absolute; top:1.75rem; left:1.75rem; width:20px; height:2px; background:var(--accent); border-radius:2px; }
.qual-item__t{ font-family:var(--font-display); font-weight:700; font-size:1.02rem; letter-spacing:-0.01em; margin-top:1.4rem; color:var(--text-primary); }
.qual-item__d{ font-size:0.9rem; line-height:1.55; color:var(--text-secondary); margin:0; }
@media (max-width:860px){ .qual-grid{ grid-template-columns:repeat(2,1fr); } }
@media (max-width:520px){ .qual-grid{ grid-template-columns:1fr; } }
.proj-detail__main--photo{ aspect-ratio: 4 / 5 !important; }
@media (max-width:900px){ .proj-detail__main--photo{ aspect-ratio: 4 / 3 !important; } }
.proj-detail__main--photo .pic > img{ object-fit:cover; object-position:center 32%; }
.proj-detail__main--photo .pic[data-ph]::before,
.proj-detail__main--photo .pic[data-caption]::after{ content:"" !important; display:none !important; }
.proj-detail__main--photo .pic{ background:#0A131E; }
.proj-detail__main--photo .pic > img{ opacity:1 !important; filter:none !important; }
.proj-detail__main--photo{ position:relative; }
.proj-watermark{
position:absolute; right:16px; bottom:14px; z-index:3;
width:92px; height:26px; pointer-events:none;
background:url("../assets/brand/mct-logo-white.png") right bottom / contain no-repeat;
opacity:0.11;
}
@media (max-width:600px){ .proj-watermark{ width:74px; height:21px; right:12px; bottom:11px; } }
.proj-app--photo{ position:relative; }
.proj-app--photo .pic[data-ph]::before,
.proj-app--photo .pic[data-caption]::after{ content:"" !important; display:none !important; }
.proj-app--photo .pic{ background:#0A131E; }
.proj-app--photo .pic > img{ opacity:1 !important; filter:none !important; object-fit:cover; }
.proj-watermark--sm{
position:absolute; right:12px; top:10px; z-index:3;
width:70px; height:20px; pointer-events:none;
background:url("../assets/brand/mct-logo-white.png") right top / contain no-repeat;
opacity:0.10;
}
@media (max-width:600px){ .proj-watermark--sm{ width:58px; height:17px; right:10px; top:8px; } }
.cta-band--photo{
background: #0A1420 !important;
border-color: rgba(255,255,255,0.10) !important;
padding-block: clamp(3rem, 2rem + 3vw, 4.5rem) !important;
aspect-ratio: 16 / 9;
min-height: 380px;
display: flex; flex-direction: column; align-items: center; justify-content: center;
isolation: isolate;
}
.cta-band__bg{
position:absolute; inset:0; z-index:0; display:block; pointer-events:none;
}
.cta-band__bg img{
width:100%; height:100%; object-fit:cover;
object-position: center center;
}
.cta-band__overlay{
position:absolute; inset:0; z-index:1; pointer-events:none;
background:
radial-gradient(115% 80% at 50% 62%, rgba(9,17,28,0.82) 0%, rgba(9,17,28,0.55) 40%, rgba(9,17,28,0.20) 74%, rgba(9,17,28,0.08) 100%),
linear-gradient(180deg, rgba(9,17,28,0.42) 0%, rgba(9,17,28,0.22) 38%, rgba(9,17,28,0.40) 100%);
}
.cta-band--photo > :not(.cta-band__bg):not(.cta-band__overlay){ position:relative; z-index:2; }
.cta-band--photo .cta-band__glow{ opacity:0.7; }
.cta-band--photo h2{ text-shadow: 0 2px 24px rgba(0,0,0,0.45); }
.cta-band--photo > p{ text-shadow: 0 1px 14px rgba(0,0,0,0.4); }
@media (max-width: 900px){
.cta-band--photo{ aspect-ratio: 16 / 10; min-height: 420px; }
.cta-band__bg img{ object-position: 60% center; }
.cta-band__overlay{
background:
radial-gradient(140% 90% at 50% 55%, rgba(9,17,28,0.80) 0%, rgba(9,17,28,0.58) 46%, rgba(9,17,28,0.34) 100%),
linear-gradient(180deg, rgba(9,17,28,0.42), rgba(9,17,28,0.46));
}
}
@media (max-width: 560px){
.cta-band--photo{ aspect-ratio: auto; min-height: 0; padding-block: clamp(3.25rem, 2rem + 6vw, 4.5rem) !important; }
.cta-band__bg img{ object-position: 66% center; }
.cta-band__overlay{
background: linear-gradient(180deg, rgba(9,17,28,0.66) 0%, rgba(9,17,28,0.80) 100%);
}
}
html{ scroll-behavior: smooth; }
:target, [id]{ scroll-margin-top: 84px; }
@media (prefers-reduced-motion: reduce){ html{ scroll-behavior: auto; } }
.sika-dist{ padding:0 !important; }
.sika-dist__inner{
position:relative; overflow:hidden;
min-height:clamp(460px, 46vw, 620px);
display:flex; align-items:center;
background:#0A1420;
border-block:1px solid rgba(255,255,255,0.06);
isolation:isolate;
}
.sika-dist__bg{ position:absolute; inset:0; z-index:0; }
.sika-dist__bg img{
width:100%; height:100%; object-fit:cover;
object-position:right center;
}
.sika-dist__scrim{
position:absolute; inset:0; z-index:1; pointer-events:none;
background:
linear-gradient(90deg, #0A1420 0%, #0A1420 34%, rgba(10,20,32,0.86) 48%, rgba(10,20,32,0.35) 72%, rgba(10,20,32,0.15) 100%),
linear-gradient(0deg, rgba(10,20,32,0.35), rgba(10,20,32,0.10));
}
.sika-dist__content{
position:relative; z-index:2;
width:min(100%, var(--container, 1200px));
margin-inline:auto; padding-inline:clamp(1.5rem, 4vw, 4rem);
max-width:none;
}
.sika-dist__content > *{ max-width:34rem; }
.sika-dist__eyebrow{
font-size:0.72rem; font-weight:700; letter-spacing:0.18em; text-transform:uppercase;
color:var(--accent); margin:0 0 1rem;
display:inline-flex; align-items:center; gap:0.6rem;
}
.sika-dist__eyebrow::before{ content:""; width:26px; height:2px; background:var(--accent); border-radius:2px; }
.sika-dist__title{
font-family:var(--font-display); font-weight:800; letter-spacing:-0.02em;
font-size:clamp(1.9rem, 1.2rem + 2.4vw, 3.1rem); line-height:1.06;
color:#fff; margin:0; text-shadow:0 2px 24px rgba(0,0,0,0.5);
}
.sika-dist__lede{
color:rgba(226,234,242,0.86); font-size:clamp(1rem,0.95rem+0.3vw,1.15rem);
line-height:1.6; margin:1.25rem 0 0; text-shadow:0 1px 12px rgba(0,0,0,0.4);
}
.sika-dist__cats{
list-style:none; margin:1.75rem 0 0; padding:0;
display:flex; flex-wrap:wrap; gap:0.5rem 0;
max-width:34rem;
}
.sika-dist__cats li{
font-size:0.82rem; font-weight:600; letter-spacing:0.01em; color:rgba(226,234,242,0.92);
padding:0.35rem 0.9rem; position:relative;
}
.sika-dist__cats li:not(:last-child)::after{
content:""; position:absolute; right:0; top:50%; transform:translateY(-50%);
width:1px; height:14px; background:rgba(255,255,255,0.16);
}
.sika-dist__cats li:first-child{ padding-left:0; }
.sika-dist__actions{ display:flex; flex-wrap:wrap; gap:0.75rem; margin-top:2rem; }
.btn--ghost{
background:transparent; color:#fff; border:1px solid rgba(255,255,255,0.28);
padding:0.8rem 1.4rem; border-radius:10px; font-weight:600;
transition:border-color .2s, background .2s;
}
.btn--ghost:hover{ border-color:rgba(255,255,255,0.55); background:rgba(255,255,255,0.06); }
@media (max-width:900px){
.sika-dist__inner{ min-height:520px; }
.sika-dist__bg img{ object-position:72% center; }
.sika-dist__scrim{
background:
linear-gradient(90deg, #0A1420 0%, rgba(10,20,32,0.92) 40%, rgba(10,20,32,0.55) 78%, rgba(10,20,32,0.35) 100%),
linear-gradient(0deg, rgba(10,20,32,0.45), rgba(10,20,32,0.12));
}
}
@media (max-width:600px){
.sika-dist__inner{ min-height:0; flex-direction:column; align-items:stretch; }
.sika-dist__bg{ position:relative; height:230px; }
.sika-dist__bg img{ object-position:center center; }
.sika-dist__scrim{
background:linear-gradient(180deg, rgba(10,20,32,0.20) 0%, rgba(10,20,32,0.55) 70%, #0A1420 100%);
}
.sika-dist__content{ padding-block:2.25rem 2.75rem; }
.sika-dist__content > *{ max-width:none; }
.sika-dist__cats{ max-width:none; }
}
.section--tint{ background:linear-gradient(180deg,#0C1826,#0A1420) !important; }
.section{ position:relative; }
.section[aria-labelledby]::before{
content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
width:min(100% - 3rem, var(--container,1200px)); height:1px;
background:linear-gradient(90deg, transparent, rgba(255,255,255,0.09) 20%, rgba(255,255,255,0.09) 80%, transparent);
opacity:0.7;
}
.sika-dist::before, .cta-band--photo::before{ display:none !important; }
.sec-head .t-overline, .t-overline{
font-weight:700; letter-spacing:0.16em; font-size:0.72rem;
}
.why-card, .ind-card, .kn-card, .dl-item, .cert, .qual-item, .sup-card,
.product-card, .project{
border-radius:10px;
}
.why-card, .sup-card{
background:linear-gradient(180deg, rgba(255,255,255,0.02), rgba(255,255,255,0.005)) !important;
border:1px solid rgba(255,255,255,0.07) !important;
}
.btn{ border-radius:10px; font-weight:600; letter-spacing:0.005em; }
.btn--primary{ box-shadow:0 1px 0 rgba(255,255,255,0.12) inset, 0 8px 22px rgba(233,114,28,0.18); }
.btn__arrow{ margin-left:0.5rem; transition:transform .2s; display:inline-block; }
.btn:hover .btn__arrow{ transform:translateX(3px); }
.link-more{
font-weight:600; font-size:0.9rem; color:var(--accent);
display:inline-flex; align-items:center; gap:0.5rem; position:relative;
}
.link-more::after{ content:"→"; transition:transform .2s; }
.link-more:hover::after{ transform:translateX(3px); }
.proj-head{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end; margin-bottom:2.5rem; }
.proj-head__note{ color:var(--text-secondary); font-size:0.98rem; line-height:1.6; max-width:40ch; justify-self:end; }
@media (max-width:760px){ .proj-head{ grid-template-columns:1fr; gap:1rem; } .proj-head__note{ justify-self:start; } }
.proj-lead{
display:block; position:relative; border-radius:14px; overflow:hidden;
aspect-ratio:2.4/1; min-height:340px; border:1px solid rgba(255,255,255,0.08);
text-decoration:none;
}
.proj-lead__img{ position:absolute; inset:0; }
.proj-lead__img img{ width:100%; height:100%; object-fit:cover; object-position:center 30%; opacity:1 !important; }
.proj-lead::after{
content:""; position:absolute; inset:0;
background:linear-gradient(90deg, rgba(8,14,22,0.95) 0%, rgba(8,14,22,0.82) 30%, rgba(8,14,22,0.30) 60%, transparent 100%);
}
.proj-lead__panel{ position:absolute; left:0; bottom:0; z-index:2; padding:clamp(1.5rem,3vw,2.75rem); display:flex; flex-direction:column; gap:0.5rem; max-width:34rem; }
.proj-lead__tag{ font-size:0.7rem; font-weight:700; letter-spacing:0.16em; text-transform:uppercase; color:var(--accent); }
.proj-lead__name{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.6rem,1.1rem+1.6vw,2.4rem); color:#fff; letter-spacing:-0.02em; line-height:1.05; }
.proj-lead__loc{ color:rgba(226,234,242,0.85); font-size:0.95rem; }
.proj-lead__scope{ color:rgba(226,234,242,0.72); font-size:0.9rem; line-height:1.5; margin-top:0.25rem; }
.proj-lead__cta{ color:var(--accent); font-weight:600; font-size:0.92rem; margin-top:0.6rem; }
.proj-lead:hover .proj-lead__cta span{ display:inline-block; transform:translateX(3px); transition:transform .2s; }
.proj-row{ display:grid; grid-template-columns:1fr 1fr 0.85fr; gap:1.25rem; margin-top:1.25rem; }
@media (max-width:900px){ .proj-row{ grid-template-columns:1fr 1fr; } .proj-refs{ grid-column:1/-1; } }
@media (max-width:560px){ .proj-row{ grid-template-columns:1fr; } }
.proj-item{ position:relative; display:block; border-radius:12px; overflow:hidden; aspect-ratio:3/2; border:1px solid rgba(255,255,255,0.08); text-decoration:none; }
.proj-item__img{ position:absolute; inset:0; }
.proj-item__img img{ width:100%; height:100%; object-fit:cover; opacity:1 !important; }
.proj-item::after{ content:""; position:absolute; inset:0; background:linear-gradient(to top, rgba(8,14,22,0.90), rgba(8,14,22,0.10) 55%, transparent); }
.proj-item__meta{ position:absolute; left:0; bottom:0; z-index:2; padding:1.1rem 1.25rem; display:flex; flex-direction:column; gap:0.15rem; }
.proj-item__meta b{ color:#fff; font-weight:700; font-size:1.05rem; }
.proj-item__meta span{ color:rgba(226,234,242,0.78); font-size:0.82rem; }
.proj-refs{ border:1px solid rgba(255,255,255,0.08); border-radius:12px; padding:1.5rem; display:flex; flex-direction:column; gap:0.75rem; background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent); }
.proj-refs__label{ font-size:0.7rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-secondary); margin:0 0 0.25rem; }
.proj-ref{ display:flex; justify-content:space-between; align-items:baseline; padding:0.6rem 0; border-top:1px solid rgba(255,255,255,0.06); text-decoration:none; }
.proj-ref__name{ color:#fff; font-weight:600; font-size:0.98rem; }
.proj-ref__loc{ color:var(--text-secondary); font-size:0.8rem; }
.proj-ref--cta{ color:var(--accent); font-weight:600; font-size:0.9rem; border-top:1px solid rgba(255,255,255,0.06); padding-top:0.9rem; margin-top:0.25rem; }
.proj-ref--cta span{ transition:transform .2s; display:inline-block; }
.proj-ref--cta:hover span{ transform:translateX(3px); }
@media (max-width:900px){ .proj-lead{ aspect-ratio:16/9; } }
@media (max-width:560px){ .proj-lead{ aspect-ratio:4/5; } .proj-lead::after{ background:linear-gradient(0deg, rgba(8,14,22,0.94) 0%, rgba(8,14,22,0.55) 45%, rgba(8,14,22,0.15) 100%); } }
.kn-head{ display:flex; justify-content:space-between; align-items:flex-end; gap:1.5rem; margin-bottom:2rem; flex-wrap:wrap; }
.kn-list{ border-top:1px solid rgba(255,255,255,0.10); }
.kn-entry{
display:grid; grid-template-columns:auto 9rem 1fr auto; align-items:center; gap:1.5rem;
padding:1.5rem 0.5rem; border-bottom:1px solid rgba(255,255,255,0.08);
text-decoration:none; transition:background .2s, padding-left .2s;
}
.kn-entry:hover{ background:linear-gradient(90deg, rgba(233,114,28,0.06), transparent); padding-left:1rem; }
.kn-entry__no{ font-family:var(--font-display); font-size:0.9rem; color:var(--accent); font-weight:700; letter-spacing:0.05em; }
.kn-entry__cat{ font-size:0.72rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--text-secondary); }
.kn-entry__title{ font-family:var(--font-display); font-weight:600; font-size:clamp(1.05rem,0.95rem+0.5vw,1.3rem); color:#fff; letter-spacing:-0.01em; line-height:1.25; }
.kn-entry__meta{ font-size:0.82rem; color:var(--text-secondary); display:inline-flex; align-items:center; gap:0.8rem; white-space:nowrap; }
.kn-entry__meta span{ color:var(--accent); font-weight:700; transition:transform .2s; }
.kn-entry:hover .kn-entry__meta span{ transform:translateX(3px); }
@media (max-width:760px){
.kn-entry{ grid-template-columns:auto 1fr; gap:0.4rem 1rem; padding:1.25rem 0.25rem; }
.kn-entry__no{ grid-row:1/3; align-self:start; }
.kn-entry__cat{ grid-column:2; }
.kn-entry__title{ grid-column:2; }
.kn-entry__meta{ grid-column:2; margin-top:0.25rem; }
}
.dl-layout{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(2rem,5vw,4.5rem); align-items:center; }
@media (max-width:860px){ .dl-layout{ grid-template-columns:1fr; gap:2rem; } }
.dl-intro__note{ color:var(--text-secondary); font-size:1rem; line-height:1.6; max-width:38ch; margin:1.25rem 0 1.75rem; }
.dl-table{ border-top:1px solid rgba(255,255,255,0.12); }
.dl-row{
display:grid; grid-template-columns:3.5rem 1fr auto 2rem; align-items:center; gap:1.25rem;
padding:1.25rem 0.5rem; border-bottom:1px solid rgba(255,255,255,0.08);
text-decoration:none; transition:background .2s, padding-left .2s;
}
.dl-row:hover{ background:linear-gradient(90deg, rgba(233,114,28,0.06), transparent); padding-left:1rem; }
.dl-row__type{ font-size:0.68rem; font-weight:700; letter-spacing:0.08em; color:var(--accent); border:1px solid rgba(233,114,28,0.35); border-radius:5px; padding:0.25rem 0; text-align:center; }
.dl-row__name{ color:#fff; font-weight:600; font-size:1rem; }
.dl-row__size{ color:var(--text-secondary); font-size:0.82rem; font-variant-numeric:tabular-nums; }
.dl-row__act{ color:var(--accent); font-weight:700; text-align:center; transition:transform .2s; }
.dl-row:hover .dl-row__act{ transform:translateY(2px); }
.sup-grid{ display:grid; grid-template-columns:0.95fr 1.05fr; gap:clamp(2rem,5vw,4.5rem); align-items:start; }
@media (max-width:860px){ .sup-grid{ grid-template-columns:1fr; gap:2.5rem; } }
.sup-lead__body{ color:var(--text-secondary); font-size:1.05rem; line-height:1.65; margin:1.25rem 0 1.75rem; max-width:44ch; }
.sup-lead__actions{ display:flex; flex-wrap:wrap; gap:0.75rem; }
.sup-caps{ list-style:none; margin:0; padding:0; border-top:1px solid rgba(255,255,255,0.12); }
.sup-cap{ display:grid; grid-template-columns:auto 1fr; gap:1.25rem; padding:1.4rem 0; border-bottom:1px solid rgba(255,255,255,0.09); align-items:baseline; }
.sup-cap__no{ font-family:var(--font-display); font-weight:700; font-size:0.9rem; color:var(--accent); letter-spacing:0.05em; }
.sup-cap__body{ display:flex; flex-direction:column; gap:0.3rem; }
.sup-cap__body b{ color:#fff; font-weight:700; font-size:1.08rem; }
.sup-cap__body span{ color:var(--text-secondary); font-size:0.92rem; line-height:1.55; }
@media (min-width:901px){
.industry-grid{ grid-template-columns:repeat(12,1fr) !important; grid-auto-rows:210px; gap:1rem !important; grid-auto-flow:row dense; }
.industry:nth-child(1){ grid-column:span 6; grid-row:span 2; }
.industry:nth-child(2){ grid-column:span 6; }
.industry:nth-child(3){ grid-column:span 6; }
.industry:nth-child(4){ grid-column:span 6; }
.industry:nth-child(5){ grid-column:span 6; }
.industry:nth-child(8){ grid-column:span 6; }
.industry:nth-child(6){ grid-column:span 3; }
.industry:nth-child(7){ grid-column:span 3; }
.industry{ aspect-ratio:auto !important; height:100%; }
}
.industry span{ font-size:1.02rem; letter-spacing:-0.01em; text-shadow:0 1px 10px rgba(0,0,0,0.5); }
.industry::before{ background:linear-gradient(to top, rgba(6,12,20,0.90), rgba(6,12,20,0.10) 60%, transparent) !important; }
.industry > .pic .tile-img{ transition:transform .5s ease; }
.industry:hover > .pic .tile-img{ transform:scale(1.04); }
.prod-head{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; align-items:end; margin-bottom:2rem; }
.prod-head__note{ color:var(--text-secondary); font-size:0.98rem; line-height:1.6; max-width:44ch; justify-self:end; }
@media (max-width:760px){ .prod-head{ grid-template-columns:1fr; } .prod-head__note{ justify-self:start; } }
.prod-brands{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; margin-bottom:2.5rem; }
@media (max-width:640px){ .prod-brands{ grid-template-columns:1fr; } }
.prod-brand{ padding:1.4rem 1.5rem; border-radius:12px; border:1px solid rgba(255,255,255,0.08); background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent); position:relative; }
.prod-brand__tag{ display:inline-block; font-size:0.72rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; padding:0.35rem 0.7rem; border-radius:6px; margin-bottom:0.75rem; }
.prod-brand__tag--mct{ color:#fff; background:var(--accent); }
.prod-brand__tag--sika{ color:var(--accent); background:transparent; border:1px solid rgba(233,114,28,0.4); }
.prod-brand__desc{ color:var(--text-secondary); font-size:0.92rem; line-height:1.55; margin:0; }
.prod-rail-label{ font-size:0.72rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--text-secondary); margin:0 0 1rem; }
.prod-cta-row{ margin-top:1.75rem; }
.product-card{ border:1px solid rgba(255,255,255,0.08) !important; background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent) !important; }
.product-card__brand{ color:var(--accent); font-size:0.7rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; }
.proj-apps--two{ display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; }
@media (max-width:640px){ .proj-apps--two{ grid-template-columns:1fr; } }
.proj-apps--two .proj-app{ aspect-ratio:auto; }
.proj-apps--two .proj-app--photo .pic{ aspect-ratio:3/2; display:block; position:relative; border-radius:12px; overflow:hidden; }
.proj-apps--two .proj-app__cap{ padding-top:0.9rem; }
.proj-apps--two .proj-app__cap b{ color:#fff; font-weight:700; display:block; }
.proj-apps--two .proj-app__cap span{ color:var(--text-secondary); font-size:0.88rem; }
.proj-scope-list{ list-style:none; margin:1rem 0 0; padding:0; display:grid; grid-template-columns:1fr 1fr; gap:0; border-top:1px solid rgba(255,255,255,0.10); }
@media (max-width:640px){ .proj-scope-list{ grid-template-columns:1fr; } }
.proj-scope-list li{ padding:1.1rem 1.25rem 1.1rem 0; border-bottom:1px solid rgba(255,255,255,0.07); }
.proj-scope-list li:nth-child(odd){ border-right:1px solid rgba(255,255,255,0.07); padding-right:2rem; }
@media (max-width:640px){ .proj-scope-list li:nth-child(odd){ border-right:none; padding-right:0; } }
.proj-scope-list b{ color:#fff; font-weight:700; font-size:1rem; display:block; margin-bottom:0.2rem; }
.proj-scope-list span{ color:var(--text-secondary); font-size:0.9rem; line-height:1.5; }
.cert-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:clamp(2rem,5vw,4.5rem); align-items:start; }
@media (max-width:860px){ .cert-grid{ grid-template-columns:1fr; gap:2rem; } }
.cert-lead__body{ color:var(--text-secondary); font-size:1.05rem; line-height:1.65; margin-top:1.25rem; max-width:42ch; }
.cert-list{ list-style:none; margin:0; padding:0; border-top:1px solid rgba(255,255,255,0.12); }
.cert-list li{ display:grid; grid-template-columns:1fr; gap:0.25rem; padding:1.25rem 0 1.25rem 2.25rem; border-bottom:1px solid rgba(255,255,255,0.08); position:relative; }
.cert-list li::before{ content:""; position:absolute; left:0; top:1.55rem; width:12px; height:2px; background:var(--accent); }
.cert-list__t{ color:#fff; font-weight:700; font-size:1.05rem; }
.cert-list__d{ color:var(--text-secondary); font-size:0.92rem; line-height:1.5; }
.stats-band--ruled{
display:grid; grid-template-columns:repeat(4,1fr);
border:1px solid rgba(255,255,255,0.12); border-radius:14px; overflow:hidden;
background:linear-gradient(180deg, rgba(255,255,255,0.02), transparent);
}
@media (max-width:640px){ .stats-band--ruled{ grid-template-columns:1fr 1fr; } }
.stats-band--ruled .stat-b{
padding:clamp(1.75rem,3vw,2.75rem) 1.5rem; text-align:left;
border-right:1px solid rgba(255,255,255,0.08); border-bottom:1px solid rgba(255,255,255,0.08);
display:flex; flex-direction:column; gap:0.4rem; margin:0;
}
.stats-band--ruled .stat-b:last-child{ border-right:none; }
@media (min-width:641px){ .stats-band--ruled .stat-b{ border-bottom:none; } .stats-band--ruled .stat-b:nth-child(4){ border-right:none; } }
@media (max-width:640px){ .stats-band--ruled .stat-b:nth-child(2n){ border-right:none; } .stats-band--ruled .stat-b:nth-child(-n+2){ border-bottom:1px solid rgba(255,255,255,0.08); } }
.stats-band--ruled .stat-b b{ font-family:var(--font-display); font-weight:800; font-size:clamp(1.8rem,1.3rem+1.6vw,2.7rem); color:#fff; letter-spacing:-0.02em; line-height:1; }
.stats-band--ruled .stat-b span{ color:var(--text-secondary); font-size:0.82rem; letter-spacing:0.02em; }
.stats-band--ruled .stat-b::before{ content:""; width:22px; height:2px; background:var(--accent); border-radius:2px; margin-bottom:0.25rem; }
.contact__form button[type="submit"], .contact__form .btn--primary{
justify-self:start; align-self:start; width:auto; height:auto; padding:0.95rem 2.2rem; margin-top:0.5rem;
}
.contact__form .field input,
.contact__form .field textarea{
background:rgba(255,255,255,0.02); border:1px solid rgba(255,255,255,0.12); border-radius:10px;
transition:border-color .2s;
}
.contact__form .field input:focus,
.contact__form .field textarea:focus{ border-color:rgba(233,114,28,0.55); outline:none; }
.contact__form .field label{ color:var(--text-secondary); font-size:0.85rem; letter-spacing:0.01em; }
.contact__illus{ max-width:none !important; }
.contact__illus .pic{ border-radius:12px; overflow:hidden; aspect-ratio:4/3; border:1px solid rgba(255,255,255,0.08); position:relative; display:block; }
.contact__illus .pic img{ width:100%; height:100%; object-fit:cover; }
.hero__stage{
border-radius:4px !important;
border:1px solid rgba(255,255,255,0.06);
}
.hero__stage::after{
content:""; position:absolute; inset:0; z-index:3; pointer-events:none;
box-shadow:inset 0 0 60px rgba(8,14,22,0.35);
border-radius:inherit;
}
.industry:nth-child(4) .tile-img{ object-position:center 62%; }
@media (max-width:1320px){
.util__identity > span:nth-child(4),
.util__identity > span:nth-child(5){ display:none; }
}
@media (max-width:1080px){
.util__contact a[href^="mailto"]{ display:none; }
}
@media (max-width:900px){
.util__identity > span:nth-child(2),
.util__identity > span:nth-child(3){ display:none; }
}
.contact__form-status{
margin-top:0.9rem;
font-size:0.92rem;
line-height:1.55;
padding:0.7rem 0.9rem;
border-radius:8px;
border:1px solid rgba(255,255,255,0.10);
background:rgba(255,255,255,0.03);
color:var(--text-secondary);
}
.contact__form-status[data-state="ok"]{
border-color:rgba(197,90,17,0.45);
color:var(--text-primary);
}
.contact__form-status[data-state="error"]{
border-color:rgba(255,255,255,0.22);
color:var(--text-primary);
}
@media (max-width:640px){
.stats-band--ruled{ grid-template-columns:repeat(2,minmax(0,1fr)); }
}
.sys-grid{
display:grid;
grid-template-columns:repeat(4,minmax(0,1fr));
gap:var(--space-4);
counter-reset:sys;
}
@media (max-width:1024px){ .sys-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:560px){ .sys-grid{ grid-template-columns:1fr; } }
.sys-grid .sys-card{ counter-increment:sys; display:flex; flex-direction:column; justify-content:flex-start; overflow:hidden; }
.sys-card .sys-card__img{
display:block; position:relative;
aspect-ratio:3/2;
width:calc(100% + 3.4rem); max-width:none; height:auto; flex:none;
margin:-1.9rem -1.7rem var(--space-4);
border-radius:3px 3px 0 0;
overflow:hidden;
background:var(--bg-sunken,#0A1019);
}
.sys-card .sys-card__img .tile-img{
width:100%; height:100%; object-fit:cover;
transition:transform .5s var(--ease-standard,ease);
}
.sys-card:hover .sys-card__img .tile-img{ transform:scale(1.04); }
@media (prefers-reduced-motion:reduce){
.sys-card__img .tile-img{ transition:none; }
.sys-card:hover .sys-card__img .tile-img{ transform:none; }
}
.sys-card__eyebrow{ display:flex; align-items:baseline; gap:0.6rem; }
.sys-card__no::before{
content:counter(sys,decimal-leading-zero);
font-family:var(--font-display); font-weight:700; font-size:0.9rem;
color:var(--accent); letter-spacing:0.05em;
}
.sys-card__no::after{
content:""; display:inline-block; width:14px; height:1px;
background:var(--border-strong); margin-left:0.6rem; vertical-align:middle;
}
.sys-card__name{ margin-top:var(--space-2); }
.sys-card__desc{ margin-top:var(--space-2); }
.industry-grid .industry::before{ background:none !important; }
.industry-grid .industry::after{
content:""; position:absolute; inset:0; height:auto; width:auto;
z-index:1; pointer-events:none;
background:linear-gradient(to top,
rgba(6,12,20,0.90) 0%,
rgba(6,12,20,0.72) 10%,
rgba(6,12,20,0.57) 20%,
rgba(6,12,20,0.43) 30%,
rgba(6,12,20,0.31) 40%,
rgba(6,12,20,0.21) 50%,
rgba(6,12,20,0.13) 60%,
rgba(6,12,20,0.07) 70%,
rgba(6,12,20,0.04) 80%,
rgba(6,12,20,0.01) 90%,
rgba(6,12,20,0.00) 100%) !important;
}
.industry-grid .industry > span{ position:relative; z-index:2; }
.industry-grid .industry > .pic{ z-index:0; }
.sys-grid .sys-card__fam{
margin-top:auto;
padding-top:0.75rem;
border-top:1px solid var(--border-hairline);
font-size:0.76rem;
line-height:1.5;
letter-spacing:0.01em;
color:var(--text-secondary);
opacity:0.92;
}
.sys-grid .sys-card__desc{ margin-bottom:0.9rem; }
.cta-band--photo{ max-width: 100%; }
.cta-band--photo > .cta-band__bg{ position:absolute; inset:0; z-index:0; }
.cta-band--photo > .cta-band__overlay{ position:absolute; inset:0; z-index:1; }

/*== scaling-fix.css ==*/
:root{ --content-max: 1600px; }
.container{
max-width: clamp(1240px, 92vw, 1600px);
}
.container--bleed{ max-width: min(1920px, 96vw); }
@media (min-width:769px){
.hero__headline{
font-size: clamp(56px, 2.4rem + 1.35vw, 72px);
line-height: 1.07;
min-height: 0;
}
.hero__content{
max-width: clamp(34rem, 30rem + 6vw, 42rem);
min-height: clamp(430px, 400px + 3vw, 500px);
}
.hero__sub{ max-width: 46ch; }
}
@media (min-width:1001px){
.hero__inner{ min-height: min(88vh, 1040px); }
}
.t-h2{ font-size: clamp(1.75rem, 1.4rem + 0.9vw, 2.125rem); }
.t-h3{ font-size: clamp(1.3125rem, 1.15rem + 0.45vw, 1.5rem); }
@media (min-width:1400px){
.t-body-l{ font-size: 1.1875rem; }
}
@media (min-width:1440px){
html{ font-size: clamp(16px, 12.5px + 0.22vw, 17px); }
}
@media (min-width:769px){
.hero__headline{ font-size: clamp(56px, 2.1rem + 1.7vw, 72px); line-height:1.06; }
.hero__content{ max-width: clamp(36rem, 30rem + 7vw, 48rem); }
}
@media (min-width:1001px){
.hero__inner{
grid-template-columns: minmax(0,42%) minmax(0,58%);
gap: clamp(2rem, 1.2rem + 2vw, 3.5rem);
min-height: min(86vh, 940px);
}
}
@media (min-width:1200px){
.site-nav a, nav a{ font-size: 1.0625rem; }
}
@media (min-width:1200px){
.util{ font-size: 14px; }
.util__inner{ height: 46px; min-height: 46px; }
}

/*== art-direction.css ==*/
:root{
--ad-ink-950: #070E17;
--ad-navy: var(--c-ink-800, #0F2A47);
--ad-panel: #0E1E30;
--ad-panel-2: #10233A;
--ad-hair: rgba(159,178,196,0.12);
--ad-hair-2: rgba(159,178,196,0.20);
--ad-accent: var(--accent, #E9721C);
--ad-accent-line: rgba(233,114,28,0.9);
--ad-shadow: 0 24px 60px -24px rgba(0,0,0,0.65);
--ad-shadow-sm: 0 12px 30px -18px rgba(0,0,0,0.6);
}
.section{ position: relative; }
.section--tint{
background: linear-gradient(180deg, var(--ad-panel) 0%, var(--c-ink-900,#0B1420) 100%) !important;
}
.section--ink{
background: var(--ad-ink-950) !important;
}
@media (min-width:1001px){
.section + .section::before{
content:""; position:absolute; top:0; left:50%; transform:translateX(-50%);
width:min(1600px,92vw); height:1px;
background: linear-gradient(90deg, transparent, var(--ad-hair-2) 18%, var(--ad-hair-2) 82%, transparent);
}
}
.t-overline{
position: relative; letter-spacing: 0.16em; font-weight: 700;
color: var(--ad-accent); padding-left: 30px;
}
.t-overline::before{
content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
width:20px; height:2px; background: var(--ad-accent-line);
}
.sec-head{ max-width: 62ch; }
.sec-head > p:last-child{ color: var(--c-slate-300); margin-top: 0.9rem; }
.card--interactive{
position: relative;
background: linear-gradient(160deg, var(--ad-panel-2) 0%, var(--c-ink-900) 108%) !important;
border: 1px solid var(--ad-hair) !important;
border-radius: 4px !important;
padding: 1.9rem 1.7rem 1.9rem !important;
overflow: hidden;
transition: transform .35s var(--ease-standard, cubic-bezier(.2,0,0,1)),
border-color .35s, background .35s;
min-height: 280px;
display: flex; flex-direction: column; justify-content: flex-end;
}
.card--interactive::after{
counter-increment: sol;
content: "0" counter(sol);
position: absolute; top: 1.35rem; right: 1.5rem;
font-family: var(--font-display, inherit);
font-size: 2.4rem; font-weight: 700; line-height: 1;
color: var(--c-slate-500); opacity: .32; letter-spacing: -0.02em;
transition: color .35s, opacity .35s;
}
.grid-12:has(.card--interactive){ counter-reset: sol; }
.card--interactive::before{
content:""; position:absolute; top:0; left:0; height:3px; width:38px;
background: var(--ad-accent); transition: width .35s var(--ease-standard,cubic-bezier(.2,0,0,1));
}
.card--interactive:hover{
transform: translateY(-4px);
border-color: var(--ad-hair-2) !important;
background: linear-gradient(160deg, #13293f 0%, var(--c-ink-900) 108%) !important;
}
.card--interactive:hover::before{ width: 68px; }
.card--interactive:hover::after{ color: var(--ad-accent); opacity: .55; }
.card--interactive .t-overline{
font-size: 0.66rem; padding-left: 0; color: var(--c-slate-400);
letter-spacing: 0.16em; margin-bottom: 0.15rem;
}
.card--interactive .t-overline::before{ display:none; }
.card--interactive h3{
letter-spacing:-0.01em; font-size: 1.45rem; margin-top: 0.35rem !important;
}
.card--interactive .t-small{
color: var(--c-slate-300) !important; margin-top: 0.55rem !important;
max-width: 26ch;
}
@media (min-width:1001px){
.grid-12:has(.card--interactive){ position: relative; }
}
[class*="split"] .t-overline,
.pos-panel .t-overline{ margin-bottom: .6rem; }
.prod-rail-label{
color: var(--c-slate-400) !important; letter-spacing:0.16em; text-transform:uppercase;
font-size:0.7rem; font-weight:700; margin-bottom:1.4rem !important;
padding-left:16px; position:relative;
}
.prod-rail-label::before{
content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
width:9px; height:2px; background:var(--ad-accent);
}
.product-card{
background: transparent !important;
border: none !important;
border-radius: 0 !important;
overflow: visible;
display: flex; flex-direction: column;
}
.product-card__img{
position: relative; border-radius: 3px; overflow: hidden;
aspect-ratio: 3 / 2;
box-shadow: var(--ad-shadow-sm);
border: 1px solid var(--ad-hair);
}
.product-card__img::after{
content:""; position:absolute; inset:0;
background: linear-gradient(to top, rgba(7,14,23,.42) 0%, transparent 40%);
pointer-events:none;
}
.product-card__img .pic,
.product-card__img img{ width:100%; height:100%; object-fit:cover; display:block;
transition: transform .55s var(--ease-standard,cubic-bezier(.2,0,0,1)); }
.product-card:hover .product-card__img img{ transform: scale(1.04); }
.product-card__body{
padding: 0.95rem 0 0 !important;
border-top: 2px solid var(--ad-hair);
margin-top: 0.95rem;
position: relative;
}
.product-card__body::before{
content:""; position:absolute; top:-2px; left:0; width:32px; height:2px;
background: var(--ad-accent);
transition: width .35s var(--ease-standard,cubic-bezier(.2,0,0,1));
}
.product-card:hover .product-card__body::before{ width: 56px; }
.product-card__brand{
color: var(--ad-accent) !important; letter-spacing:0.14em; font-weight:700;
font-size:0.64rem !important; display:block;
}
.product-card__name{
letter-spacing:-0.01em; font-weight:600; display:block;
margin-top:.3rem !important; font-size:1.02rem;
}
.product-card__cat{ color: var(--c-slate-400) !important; display:block; margin-top:.15rem; }
.feature-grid{ gap: 0 !important; }
.feature{
position: relative;
border: none !important;
background: transparent !important;
padding: 1.9rem 1.7rem 1.9rem 0 !important;
border-top: 1px solid var(--ad-hair) !important;
margin-right: 1.7rem;
}
.feature__icon{
color: var(--ad-accent) !important;
width: 34px !important; height: 34px !important; margin-bottom: 1rem;
background: none !important; border: none !important;
}
.feature__icon svg{ width:30px; height:30px; }
.feature h3{ letter-spacing:-0.01em; margin-bottom:.5rem; }
.feature p{ color: var(--c-slate-300) !important; }
.feature:hover{ }
.industry{
border-radius: 3px !important; overflow: hidden; position: relative;
border: 1px solid var(--ad-hair) !important;
}
.industry::after{
content:""; position:absolute; inset:0; pointer-events:none;
background: linear-gradient(to top, rgba(7,14,23,.86) 0%, rgba(7,14,23,.15) 46%, transparent 72%);
}
.industry > span{
position:absolute; left:1rem; bottom:.95rem; z-index:2;
font-weight:600; letter-spacing:0.01em; padding-left: 16px;
}
.industry > span::before{
content:""; position:absolute; left:0; top:50%; transform:translateY(-50%);
width:9px; height:2px; background:var(--ad-accent);
}
.industry .tile-img{ transition: transform .6s var(--ease-standard,cubic-bezier(.2,0,0,1)); }
.industry:hover .tile-img{ transform: scale(1.05); }
.industry .pic[data-ph="svg"]{
background:
linear-gradient(180deg, var(--ad-panel-2), var(--c-ink-900)),
repeating-linear-gradient(0deg, transparent 0 22px, var(--ad-hair) 22px 23px),
repeating-linear-gradient(90deg, transparent 0 22px, var(--ad-hair) 22px 23px);
background-blend-mode: normal;
}
.kn-entry{
border-top: 1px solid var(--ad-hair) !important;
padding: 1.35rem 0.25rem !important;
transition: background .3s, padding-left .3s;
}
.kn-entry:hover{ background: rgba(255,255,255,0.015); padding-left: 0.75rem !important; }
.kn-entry__no{ color: var(--ad-accent) !important; font-weight:700; opacity:.9; }
.kn-entry__cat{
color: var(--c-slate-300) !important; letter-spacing:0.12em;
border:1px solid var(--ad-hair-2); border-radius:2px; padding:2px 8px;
font-size:0.66rem; text-transform:uppercase;
}
.kn-entry__title{ letter-spacing:-0.01em; }
.kn-entry__meta{ color: var(--c-slate-400) !important; }
[class*="support"] li, .num-list li, .support-list__item{ border-color: var(--ad-hair) !important; }
.stat-b b, .stat-num{ letter-spacing:-0.02em; }
.stat-b::before{ background: var(--ad-accent) !important; height:2px !important; width:26px !important; }
.stat-b span{ color: var(--c-slate-400) !important; letter-spacing:0.04em; }
.proj-item__img, .project{ border-radius: 3px !important; overflow: hidden; }
.proj-item, .project{ border:1px solid var(--ad-hair); }
.proj-item__meta b, .project__meta b{ letter-spacing:-0.01em; }
.proj-detail__main--photo picture,
.proj-app--photo picture{ border-radius:3px; overflow:hidden; box-shadow: var(--ad-shadow); }
.dl-row{ border-top:1px solid var(--ad-hair) !important; transition: padding-left .3s, background .3s; }
.dl-row:hover{ background: rgba(255,255,255,0.015); padding-left:.6rem !important; }
.dl-row__type{ color: var(--ad-accent) !important; }
[class*="cta"]{ position: relative; }
[class*="cta"]::after{
content:""; position:absolute; inset:0; pointer-events:none;
background: radial-gradient(120% 120% at 50% 30%, rgba(11,20,32,.35), rgba(7,14,23,.82));
}
[class*="cta"] > *{ position:relative; z-index:2; }
.card{ border-radius: 4px !important; border-color: var(--ad-hair) !important; }
.cert, .split__media, .article, .proj-app{ border-radius: 3px !important; }
@media (max-width: 860px){
.feature{ margin-right:0; padding-right:0 !important; }
.product-card__img{ aspect-ratio: 3 / 2; }
.section + .section::before{ display:none; }
}
@media (min-width:1001px){
.grid-12:has(.card--interactive){
grid-template-columns: repeat(4, 1fr) !important;
gap: 1.5rem !important;
align-items: stretch;
}
.grid-12 > .card--interactive{ grid-column: auto !important; }
}
@media (min-width:641px) and (max-width:1000px){
.grid-12:has(.card--interactive){
display:grid !important; grid-template-columns: repeat(2,1fr) !important; gap:1.25rem !important;
}
.grid-12 > .card--interactive{ grid-column: auto !important; }
}
@media (min-width:1001px){
.product-scroll{
display:grid !important;
grid-template-columns: repeat(4, 1fr) !important;
gap: 2rem !important;
align-items: stretch;
}
.product-card__name{ font-size: 1.05rem; }
}
@media (min-width:521px) and (max-width:1000px){
.product-scroll{ display:grid !important; grid-template-columns: repeat(2,1fr) !important; gap:1.75rem !important; }
}

/*== portfolio-v2.css ==*/
.proj-lead::after,
.proj-item::after { z-index: 1; }
.proj-lead,
.proj-item { border-radius: 14px; }
@media (min-width: 700px) {
.proj-lead {
display: grid;
grid-template-columns: minmax(0, 1fr) minmax(0, 27%);
align-items: stretch;
aspect-ratio: auto;
min-height: 0;
overflow: hidden;
background: linear-gradient(120deg,
var(--bg-elevated, #111E2E) 0%,
var(--bg-sunken, #0A1019) 62%);
}
.proj-lead__img {
position: relative;
inset: auto;
grid-column: 2;
grid-row: 1;
min-width: 0;
aspect-ratio: 4 / 5;
border-left: 1px solid rgba(255, 255, 255, 0.08);
}
.proj-lead__img img { object-position: 50% 50%; }
.proj-lead::after { display: none; }
.proj-lead__panel {
position: relative;
inset: auto;
grid-column: 1;
grid-row: 1;
align-self: center;
min-width: 0;
max-width: 42rem;
padding: clamp(1.75rem, 2.6vw, 2.75rem);
gap: 0.5rem;
}
.proj-lead__loc { margin-top: 0.1rem; }
.proj-lead__scope { margin-top: 0.55rem; max-width: 34rem; }
.proj-lead__cta { margin-top: 1.1rem; }
.proj-lead .proj-watermark { display: none; }
}
@media (min-width: 700px) and (max-width: 1180px) {
.proj-lead { grid-template-columns: minmax(0, 1fr) minmax(0, 34%); }
.proj-lead__panel { padding: 1.5rem; max-width: none; }
.proj-lead__scope { max-width: none; }
}
@media (max-width: 699px) {
.proj-lead { aspect-ratio: 4 / 5; min-height: 0; }
.proj-lead__img img { object-position: 50% 50%; }
.proj-lead::after {
background: linear-gradient(0deg,
rgba(8, 14, 22, 0.94) 0%,
rgba(8, 14, 22, 0.55) 42%,
rgba(8, 14, 22, 0.12) 100%);
}
.proj-lead__panel { padding: 1.25rem 1.25rem 1.4rem; }
}

/* PERF: off-screen sections skip rendering until scrolled near. */
main > section:not(.hero){content-visibility:auto;contain-intrinsic-size:auto 1200px;}
@media print{main > section:not(.hero){content-visibility:visible;}}