@font-face {
 font-family: "Inter";
 font-style: normal;
 font-weight: 400 600;
 font-display: swap;
 src: url("/assets/fonts/inter-cyrillic-ext.woff2") format("woff2");
 unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
@font-face {
 font-family: "Inter";
 font-style: normal;
 font-weight: 400 600;
 font-display: swap;
 src: url("/assets/fonts/inter-cyrillic.woff2") format("woff2");
 unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
@font-face {
 font-family: "Inter";
 font-style: normal;
 font-weight: 400 600;
 font-display: swap;
 src: url("/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;
}
@font-face {
 font-family: "Inter";
 font-style: normal;
 font-weight: 400 600;
 font-display: swap;
 src: url("/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;
}
:root {
 --color-void: #000000;
 --color-bone-white: #ffffff;
 --color-ash-gray: #9a9a9a;
 --color-silver-mist: #bdbdbd;
 --color-electric-iris: #00d4c8;
 --color-saffron-spark: #ffc14a;
 --color-deep-verdant: #0a3d3a;
 --color-pool-deep: #062a28;
 --color-signal-aqua: #00e8d4;
 --font: "Inter", ui-sans-serif, system-ui, -apple-system, sans-serif;
 --text-caption: 12px;
 --text-nav: 14px;
 --text-body: 18px;
 --text-heading-2xs: 24px;
 --text-heading-xs: 27px;
 --text-subheading: 36px;
 --text-heading-sm: clamp(1.75rem, 3vw, 2.625rem);
 --text-heading: clamp(2rem, 4vw, 3rem);
 --text-heading-lg: clamp(2.75rem, 7vw, 4.875rem);
 --text-display: clamp(3.25rem, 10vw, 7rem);
 --page-max: 1280px;
 --content: min(1200px, calc(100% - 2.5rem));
 --radius: 24px;
 --radius-pill: 9999px;
 --header-h: 72px;
 --ticker-h: 36px;
 --ease: cubic-bezier(0.22, 1, 0.36, 1);
}
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
.visually-hidden {
 position: absolute !important;
 width: 1px !important;
 height: 1px !important;
 padding: 0 !important;
 margin: -1px !important;
 overflow: hidden !important;
 clip: rect(0, 0, 0, 0) !important;
 white-space: nowrap !important;
 border: 0 !important;
}
html {
 scroll-behavior: smooth;
 scroll-padding-top: calc(var(--ticker-h) + var(--header-h) + 12px);
}
body {
 font-family: var(--font);
 font-weight: 400;
 font-size: var(--text-body);
 line-height: 1.55;
 color: #d6d6d6;
 background: var(--color-void);
 overflow-x: hidden;
 -webkit-font-smoothing: antialiased;
}
body.chaos-locked {
 overflow: hidden;
}
body.chaos-locked .promo-ticker,
body.chaos-locked .site-header,
body.chaos-locked .scroll-top,
body.chaos-locked .sound-toggle,
body.chaos-locked .sound-dock,
body.chaos-locked .cookie-banner,
body.chaos-locked main,
body.chaos-locked .site-footer {
 pointer-events: none;
}
.chaos-intro {
 position: fixed;
 inset: 0;
 z-index: 5000;
 display: grid;
 place-items: center;
 background: #000;
 color: #fff;
}
.chaos-intro.is-done {
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 transition: opacity 0.9s var(--ease), visibility 0.9s;
}
.chaos-intro-title {
 position: absolute;
 top: 36%;
 left: 50%;
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 0.08em;
 margin: 0;
 padding: 0;
 font-size: clamp(2.1rem, 7.2vw, 4.4rem);
 font-weight: 300;
 letter-spacing: 0.1em;
 line-height: 1.05;
 text-align: center;
 text-transform: uppercase;
 color: rgba(232, 232, 232, 0.26);
 max-width: 92vw;
 white-space: nowrap;
 opacity: 0;
 transform: translate(-50%, -50%) translateY(14px);
 animation: chaos-title-in 1.3s var(--ease) 0.2s forwards;
}
.chaos-intro-title span {
 display: block;
}
.chaos-intro-bang {
 position: absolute;
 top: 62%;
 left: 50%;
 width: 84px;
 height: 84px;
 margin: 0;
 padding: 0;
 display: grid;
 place-items: center;
 border: 1px solid rgba(255, 255, 255, 0.28);
 border-radius: 50%;
 background: rgba(0, 0, 0, 0.35);
 cursor: pointer;
 opacity: 0;
 transform: translate(-50%, -50%) scale(0.85);
 animation: chaos-btn-in 0.75s var(--ease) 1.2s forwards;
 transition: border-color 0.2s, box-shadow 0.25s, transform 0.25s, background 0.2s;
}
.chaos-intro-bang img {
 width: 40px;
 height: 40px;
 object-fit: contain;
 display: block;
 opacity: 0.85;
 pointer-events: none;
}
.chaos-intro-bang:hover,
.chaos-intro-bang:focus-visible {
 border-color: rgba(0, 232, 212, 0.55);
 background: rgba(0, 0, 0, 0.5);
 box-shadow: 0 0 0 10px rgba(0, 232, 212, 0.06), 0 0 40px rgba(0, 212, 200, 0.18);
 outline: none;
}
.chaos-intro-bang:hover img,
.chaos-intro-bang:focus-visible img { opacity: 1; }
.chaos-intro.is-banging .chaos-intro-title {
 opacity: 0;
 transition: opacity 0.3s ease;
 animation: none;
}
.chaos-intro.is-banging .chaos-intro-bang {
 animation: chaos-bang-pulse 0.55s var(--ease) forwards;
 border-color: rgba(255, 255, 255, 0.5);
}
.chaos-intro-flash {
 position: absolute;
 inset: 0;
 background: radial-gradient(circle at center, rgba(255,255,255,0.55) 0%, rgba(0,232,212,0.18) 28%, transparent 62%);
 opacity: 0;
 pointer-events: none;
}
.chaos-intro.is-banging .chaos-intro-flash {
 animation: chaos-flash 0.7s var(--ease) forwards;
}
@keyframes chaos-title-in {
 from { opacity: 0; transform: translate(-50%, -50%) translateY(18px); }
 to { opacity: 1; transform: translate(-50%, -50%) translateY(0); }
}
@keyframes chaos-btn-in {
 from { opacity: 0; transform: translate(-50%, -50%) scale(0.85); }
 to { opacity: 1; transform: translate(-50%, -50%) scale(1); }
}
@keyframes chaos-bang-pulse {
 0% { transform: translate(-50%, -50%) scale(1); opacity: 1; }
 45% { transform: translate(-50%, -50%) scale(1.8); opacity: 0.85; }
 100% { transform: translate(-50%, -50%) scale(3.2); opacity: 0; }
}
@keyframes chaos-flash {
 0% { opacity: 0; }
 25% { opacity: 0.85; }
 100% { opacity: 0; }
}
@media (prefers-reduced-motion: reduce) {
 .chaos-intro-title {
 animation: none;
 opacity: 1;
 transform: translate(-50%, -50%);
 }
 .chaos-intro-bang {
 animation: none;
 opacity: 1;
 transform: translate(-50%, -50%);
 }
}
body.is-content #brain-canvas,
body.is-content .site-veil { display: none !important; }
body.is-content {
 color: #e8e8e8;
}
img, svg, canvas { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul { list-style: none; }
button { font: inherit; border: 0; background: none; cursor: pointer; color: inherit; }
.container { width: var(--content); max-width: var(--page-max); margin-inline: auto; }
.skip-link {
 position: absolute;
 left: -999px;
 top: 0;
 background: var(--color-electric-iris);
 color: var(--color-bone-white);
 padding: 12px 16px;
 z-index: 1000;
 border-radius: var(--radius);
}
.skip-link:focus { left: 12px; top: 12px; }
.site-bg {
 position: fixed;
 inset: 0;
 z-index: -3;
 background: #000000;
}
#particle-field { display: none; }
#brain-canvas {
 position: fixed;
 inset: 0;
 z-index: 0;
 width: 100%;
 height: 100%;
 pointer-events: none;
 opacity: 0.88;
 transition: opacity 0.2s linear;
}
.site-veil {
 position: fixed;
 inset: 0;
 z-index: 0;
 pointer-events: none;
 background:
 radial-gradient(ellipse 65% 50% at 72% 38%, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0.22) 72%),
 linear-gradient(180deg, rgba(0, 0, 0, 0.18) 0%, rgba(0, 0, 0, 0.14) 45%, rgba(0, 0, 0, 0.26) 100%);
 transition: background 0.15s linear;
}
.site-header,
main,
.site-footer {
 position: relative;
 z-index: 1;
}
.journey {
 position: relative;
 z-index: 1;
}
.journey-step {
 position: relative;
 min-height: 100vh;
 min-height: 100svh;
 display: grid;
 align-items: center;
 padding: 12vh 0;
 overflow: hidden;
}
.journey-bg-letters {
 position: absolute;
 inset: 0;
 display: flex;
 flex-wrap: wrap;
 align-content: center;
 justify-content: center;
 gap: 0.02em 0.06em;
 padding: 8vh 4vw;
 pointer-events: none;
 user-select: none;
 z-index: 0;
 --gather: 0;
 font-size: clamp(1.6rem, 5.5vw, 4.8rem);
 font-weight: 400;
 letter-spacing: -0.04em;
 line-height: 1.15;
 color: rgba(255, 255, 255, 0.07);
 max-width: 100%;
}
.journey-step.is-active .journey-bg-letters {
 color: rgba(0, 212, 200, 0.14);
}
.journey-ch {
 display: inline-block;
 will-change: transform, opacity;
 transform:
 translate3d(
 calc(var(--dx) * (1 - var(--gather))),
 calc(var(--dy) * (1 - var(--gather))),
 0
 )
 rotate(calc(var(--rot) * (1 - var(--gather))));
 opacity: calc(0.15 + var(--gather) * 0.85);
}
.journey-ch.is-space {
 width: 0.35em;
}
.journey-fore {
 position: relative;
 z-index: 2;
 max-width: 720px;
}
.journey-fore .eyebrow {
 color: var(--color-saffron-spark);
}
.journey-fore h2 {
 font-size: clamp(2rem, 5vw, 3.6rem);
 line-height: 1.1;
 letter-spacing: -0.04em;
 font-weight: 400;
 color: var(--color-bone-white);
 max-width: 16ch;
 margin-bottom: 14px;
 text-shadow: 0 0 40px rgba(0, 0, 0, 0.65);
}
.journey-fore p {
 max-width: 40ch;
 color: var(--color-silver-mist);
 font-weight: 400;
 text-shadow: 0 0 24px rgba(0, 0, 0, 0.5);
}
.journey-nav {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
 margin-top: 28px;
}
.journey-nav a {
 font-size: 12px;
 font-weight: 600;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: var(--color-ash-gray);
 padding: 8px 12px;
 border-radius: 9999px;
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.journey-nav a:hover {
 color: var(--color-bone-white);
 box-shadow: inset 0 0 0 1px rgba(0, 212, 200, 0.55);
}
@media (max-width: 820px) {
 .journey-bg-letters {
 font-size: clamp(1.2rem, 7vw, 2.2rem);
 opacity: 0.9;
 }
 .journey-step { min-height: 88vh; padding: 10vh 0; }
}
.path-dna {
 position: relative;
 z-index: 1;
 padding: clamp(40px, 6vw, 80px) 0;
}
.path-dna-step {
 padding: clamp(36px, 6vw, 72px) 0;
}
.path-dna-step--alt {
 background: linear-gradient(180deg, transparent, rgba(0, 40, 48, 0.35), transparent);
}
.path-dna-row {
 display: grid;
 grid-template-columns: 1.15fr 0.85fr;
 gap: clamp(28px, 5vw, 64px);
 align-items: center;
}
.path-dna-row--reverse {
 direction: rtl;
}
.path-dna-row--reverse > * {
 direction: ltr;
}
.path-dna-num {
 margin: 0 0 10px;
 font-size: 12px;
 font-weight: 700;
 letter-spacing: 0.16em;
 text-transform: uppercase;
 color: var(--color-signal-aqua, #00e8d4);
}
.path-dna-copy h2 {
 margin: 0 0 14px;
 font-size: clamp(2.2rem, 5vw, 3.6rem);
 font-weight: 400;
 letter-spacing: -0.03em;
 line-height: 1.05;
 color: #fff;
}
.path-dna-copy p {
 margin: 0;
 max-width: 38ch;
 color: var(--color-silver-mist);
 font-size: clamp(1.05rem, 1.6vw, 1.2rem);
 line-height: 1.55;
}
.path-dna-visual {
 display: grid;
 place-items: center;
 min-height: 280px;
 filter: drop-shadow(0 0 28px rgba(0, 232, 212, 0.22));
}
.dna-helix {
 width: min(220px, 48vw);
 height: auto;
 max-height: 360px;
 overflow: visible;
}
.dna-helix--tilt {
 transform: rotate(-12deg);
}
.dna-strand {
 stroke-linecap: round;
 stroke-dasharray: 8 5;
 animation: dna-flow 7s linear infinite;
 filter: drop-shadow(0 0 6px rgba(0, 232, 212, 0.45));
}
.dna-strand-b {
 animation-duration: 8.5s;
 animation-direction: reverse;
 opacity: 0.85;
}
.dna-rungs line {
 stroke-linecap: round;
 animation: dna-pulse 3.2s ease-in-out infinite;
}
.dna-rungs line:nth-child(odd) { animation-delay: 0.4s; }
.dna-dots circle {
 animation: dna-twinkle 2.8s ease-in-out infinite;
}
.dna-dots circle:nth-child(2n) { animation-delay: 0.6s; }
.dna-dots circle:nth-child(3n) { animation-delay: 1.1s; }
@keyframes dna-flow {
 to { stroke-dashoffset: -120; }
}
@keyframes dna-pulse {
 0%, 100% { opacity: 0.35; }
 50% { opacity: 0.85; }
}
@keyframes dna-twinkle {
 0%, 100% { opacity: 0.35; }
 50% { opacity: 1; }
}
@media (max-width: 820px) {
 .path-dna-row,
 .path-dna-row--reverse {
 grid-template-columns: 1fr;
 direction: ltr;
 gap: 20px;
 }
 .path-dna-visual {
 order: -1;
 min-height: 200px;
 }
 .dna-helix {
 max-height: 220px;
 width: min(180px, 56vw);
 }
}
@media (prefers-reduced-motion: reduce) {
 .dna-strand,
 .dna-rungs line,
 .dna-dots circle { animation: none; }
}
.site-top {
 position: sticky;
 top: 0;
 z-index: 300;
 pointer-events: auto;
 isolation: isolate;
}
.promo-ticker {
 height: var(--ticker-h);
 background: linear-gradient(90deg, #062a28 0%, #0a3d3a 40%, #1a3a20 70%, #062a28 100%);
 border-bottom: 1px solid rgba(0, 212, 200, 0.28);
 overflow: hidden;
 position: relative;
 z-index: 2;
}
.promo-ticker-btn {
 display: block;
 width: 100%;
 height: 100%;
 border: 0;
 background: transparent;
 cursor: pointer;
 position: relative;
 z-index: 2;
 padding: 0;
 color: #fff;
 -webkit-tap-highlight-color: rgba(255, 193, 74, 0.25);
}
.promo-ticker-track {
 display: flex;
 width: max-content;
 animation: ticker-scroll 28s linear infinite;
 white-space: nowrap;
 pointer-events: none;
}
.promo-ticker-seq {
 padding: 0 2rem;
 font-size: 12px;
 font-weight: 600;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 line-height: var(--ticker-h);
 color: #e8fff9;
 pointer-events: none;
}
.promo-ticker-label {
 
 position: absolute;
 width: 1px;
 height: 1px;
 padding: 0;
 margin: -1px;
 overflow: hidden;
 clip: rect(0, 0, 0, 0);
 white-space: nowrap;
 border: 0;
}
.promo-ticker-btn:hover .promo-ticker-seq,
.promo-ticker-btn:focus-visible .promo-ticker-seq {
 color: #ffc14a;
}
@keyframes ticker-scroll {
 from { transform: translateX(0); }
 to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
 .promo-ticker-track { animation: none; justify-content: center; width: 100%; }
 .promo-ticker-seq:last-child { display: none; }
}
.site-header {
 height: var(--header-h);
 background: rgba(0, 0, 0, 0.72);
 backdrop-filter: blur(12px);
}
.header-inner {
 height: var(--header-h);
 display: flex;
 align-items: center;
 justify-content: space-between;
 gap: 12px;
}
.logo-link {
 display: flex;
 align-items: center;
 gap: 10px;
 min-width: 0;
 flex: 0 1 auto;
}
.logo-link img {
 width: 36px;
 height: 36px;
 object-fit: cover;
 border-radius: 10px;
 flex: 0 0 auto;
}
.logo-word {
 font-weight: 500;
 font-size: 14px;
 letter-spacing: -0.02em;
 color: var(--color-bone-white);
 line-height: 1.1;
 white-space: nowrap;
}
.logo-word span {
 display: block;
 font-size: 10px;
 font-weight: 600;
 letter-spacing: 0.05em;
 text-transform: uppercase;
 color: var(--color-ash-gray);
 margin-top: 2px;
}
@media (max-width: 1280px) {
 .logo-word span { display: none; }
}
.burger {
 display: none;
 width: 44px;
 height: 44px;
 place-items: center;
 flex-direction: column;
 gap: 5px;
}
.burger span {
 display: block;
 width: 18px;
 height: 1.5px;
 background: var(--color-bone-white);
 transition: transform 0.25s var(--ease), opacity 0.2s;
}
.burger[aria-expanded="true"] span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); }
.burger[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
.burger[aria-expanded="true"] span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); }
.nav {
 display: flex;
 align-items: center;
 justify-content: flex-end;
 flex-wrap: nowrap;
 gap: 4px 12px;
 min-width: 0;
}
.nav a {
 font-size: 12px;
 font-weight: 600;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: var(--color-ash-gray);
 transition: color 0.2s;
 white-space: nowrap;
 padding: 6px 0;
}
.nav a:hover,
.nav a[aria-current="page"] { color: var(--color-bone-white); }
.nav a[href*="app.swimheadcoach.com"] {
 color: var(--color-signal-aqua, #00e8d4);
 letter-spacing: 0.02em;
}
.nav a[href*="app.swimheadcoach.com"]:hover {
 color: var(--color-saffron-spark);
}
.sound-dock {
 position: fixed;
 right: 20px;
 bottom: 20px;
 z-index: 250;
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 10px;
}
.scroll-top,
.sound-toggle {
 position: relative;
 display: grid;
 place-items: center;
 width: 52px;
 height: 52px;
 padding: 0;
 border: 0;
 border-radius: 50%;
 background: rgba(0, 0, 0, 0.72);
 backdrop-filter: blur(10px);
 box-shadow: inset 0 0 0 1px rgba(0, 212, 200, 0.45), 0 10px 28px rgba(0, 0, 0, 0.45);
 cursor: pointer;
 transition: opacity 0.25s var(--ease), transform 0.25s var(--ease), visibility 0.25s, background 0.2s;
}
.scroll-top {
 opacity: 0;
 visibility: hidden;
 pointer-events: none;
 transform: translateY(8px);
}
.scroll-top.is-visible {
 opacity: 1;
 visibility: visible;
 pointer-events: auto;
 transform: translateY(0);
}
.scroll-top img {
 width: 28px;
 height: 28px;
 transform: rotate(-90deg);
 display: block;
}
.sound-toggle .sound-icon {
 width: 26px;
 height: 26px;
 display: block;
 color: var(--color-signal-aqua, #00e8d4);
 transition: opacity 0.2s var(--ease), color 0.2s var(--ease);
}
.sound-toggle .sound-icon--off {
 display: none;
 color: var(--color-saffron-spark, #ffc14a);
}
.sound-toggle.is-muted .sound-icon--on {
 display: none;
}
.sound-toggle.is-muted .sound-icon--off {
 display: block;
}
.scroll-top:hover,
.sound-toggle:hover {
 background: rgba(0, 212, 200, 0.22);
}
.sound-toggle:not(.is-muted) {
 box-shadow:
 inset 0 0 0 1px rgba(0, 232, 212, 0.55),
 0 0 18px rgba(0, 232, 212, 0.18),
 0 10px 28px rgba(0, 0, 0, 0.45);
}
.nav-cta,
.btn-primary {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 background: var(--color-electric-iris) !important;
 color: var(--color-bone-white) !important;
 font-size: 14px !important;
 font-weight: 600 !important;
 letter-spacing: 0.025em !important;
 text-transform: uppercase;
 padding: 14px 16px !important;
 border-radius: 22.5px !important;
 box-shadow: none !important;
 border: 0;
 cursor: pointer;
 font-family: inherit;
 text-decoration: none;
}
.nav .nav-cta {
 font-size: 11px !important;
 letter-spacing: 0.04em !important;
 padding: 9px 12px !important;
 border-radius: 999px !important;
 flex: 0 0 auto;
 white-space: nowrap;
}
.btn {
 display: inline-flex;
 align-items: center;
 justify-content: center;
 gap: 8px;
 font-size: 14px;
 font-weight: 600;
 line-height: 1.2;
 text-transform: uppercase;
 letter-spacing: 0.025em;
 padding: 14px 18px;
 border-radius: 22.5px;
 transition: opacity 0.2s, transform 0.2s var(--ease);
}
.btn:hover { transform: translateY(-1px); opacity: 0.92; }
.btn-kelp {
 background: transparent;
 color: var(--color-bone-white);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.18);
}
.btn-ghost {
 background: transparent;
 color: var(--color-bone-white);
 text-decoration: underline;
 text-underline-offset: 4px;
 text-transform: none;
 font-weight: 400;
 letter-spacing: 0;
 padding-left: 0;
 padding-right: 0;
 border-radius: 0;
}
.btn-ghost:hover { color: var(--color-saffron-spark); }
.eyebrow,
.section-label {
 font-size: 14px;
 font-weight: 600;
 letter-spacing: 0.35px;
 text-transform: uppercase;
 color: var(--color-saffron-spark);
 margin-bottom: 18px;
}
.section-title,
h1, h2, h3 {
 font-weight: 500;
 color: var(--color-bone-white);
 letter-spacing: -0.04em;
}
.section-title {
 font-size: var(--text-heading-lg);
 line-height: 1.1;
 max-width: 14ch;
 margin-bottom: 18px;
}
.section-lead {
 max-width: 42ch;
 font-weight: 400;
 color: var(--color-silver-mist);
 margin-bottom: 36px;
}
.section { padding: clamp(60px, 10vw, 120px) 0; }
.section-deep,
.section-kelp-band { background: transparent; }
.hero {
 position: relative;
 min-height: min(100svh, 900px);
 display: grid;
 align-items: center;
 padding: calc(var(--header-h) + 24px) 0 72px;
 overflow: hidden;
}
.hero-grid {
 display: grid;
 grid-template-columns: 1.05fr 0.95fr;
 gap: 36px;
 align-items: center;
}
.hero-stage {
 position: relative;
 min-height: min(70vh, 620px);
 width: 100%;
 
 pointer-events: none;
}
.hero-stage #hero-constellation {
 display: none;
}
.hero-silhouette,
.hero-wave,
.hero-orb { display: none !important; }
.hero-copy {
 position: relative;
 z-index: 2;
 max-width: 640px;
 padding: 28px 32px 28px 0;
 background: linear-gradient(90deg, rgba(0,0,0,0.78) 0%, rgba(0,0,0,0.4) 60%, transparent 100%);
}
.hero-brand {
 font-size: var(--text-display);
 font-weight: 500;
 line-height: 1.05;
 letter-spacing: -0.04em;
 color: var(--color-bone-white);
 margin-bottom: 18px;
}
.hero-brand em {
 font-style: normal;
 color: var(--color-electric-iris);
}
.hero h1 {
 font-size: clamp(1.5rem, 3vw, 2.1rem);
 line-height: 1.2;
 letter-spacing: -0.03em;
 font-weight: 400;
 max-width: 28ch;
 margin-bottom: 14px;
 color: var(--color-bone-white);
}
.hero-lead {
 font-size: 18px;
 font-weight: 400;
 max-width: 40ch;
 margin-bottom: 28px;
 color: var(--color-silver-mist);
}
.hero-cred {
 color: var(--color-saffron-spark);
 font-weight: 600;
 letter-spacing: 0.01em;
}
.hero-actions { display: flex; flex-wrap: wrap; gap: 18px; align-items: center; }
.stats {
 display: grid;
 grid-template-columns: repeat(4, 1fr);
 gap: 30px;
}
.stats--facts {
 grid-template-columns: repeat(3, 1fr);
}
.stat strong {
 display: block;
 font-size: clamp(2.5rem, 5vw, 3.75rem);
 line-height: 1;
 letter-spacing: -0.04em;
 color: var(--color-bone-white);
 font-weight: 400;
 margin-bottom: 10px;
}
.stat span {
 font-size: 12px;
 letter-spacing: 0.06em;
 text-transform: uppercase;
 color: var(--color-ash-gray);
 font-weight: 600;
}
.card,
.project-panel article,
.landings-grid a,
.blog-item,
.faq details,
.related-list a {
 background: transparent;
 border-radius: var(--radius);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.cta-panel {
 background: transparent;
 border: 0;
 box-shadow: none;
 border-radius: 0;
}
.price-main,
.price-side {
 border-radius: var(--radius);
}
.card { padding: 36px; }
.card h3 {
 font-size: var(--text-heading-sm);
 line-height: 1.15;
 margin-bottom: 14px;
}
.card p { color: var(--color-silver-mist); font-weight: 400; }
.card-link {
 display: flex;
 align-items: flex-start;
 justify-content: space-between;
 gap: 16px;
 padding: 30px 0;
 border-bottom: 1px solid rgba(255, 255, 255, 0.08);
}
.card-link h3 { font-size: 24px; letter-spacing: -0.02em; margin-bottom: 10px; }
.arrow-btn {
 flex: 0 0 auto;
 width: 36px;
 height: 36px;
 border-radius: var(--radius-pill);
 display: grid;
 place-items: center;
 background: var(--color-electric-iris);
 color: var(--color-bone-white);
 font-size: 14px;
}
.grid-2 {
 display: grid;
 grid-template-columns: 1.1fr 0.9fr;
 gap: 36px;
 align-items: start;
}
.grid-3 {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 24px;
}
.price-amount,
.prose .price-amount,
.prose p.price-amount {
 margin: 0 0 8px;
 font-size: clamp(4.5rem, 8vw, 7rem) !important;
 line-height: 0.9 !important;
 letter-spacing: -0.055em;
 color: var(--color-bone-white) !important;
 font-weight: 400;
}
.price-amount span,
.prose .price-amount span {
 display: inline-block;
 margin-left: 0.12em;
 font-size: 0.28em !important;
 letter-spacing: 0.1em;
 color: var(--color-saffron-spark) !important;
 font-weight: 700;
 vertical-align: 0.85em;
 line-height: 1;
}
.price-kicker,
.prose .price-kicker,
.prose p.price-kicker {
 margin: 0 0 10px !important;
 font-size: 12px !important;
 line-height: 1.3 !important;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 font-weight: 700;
 color: var(--color-signal-aqua, #00e8d4) !important;
}
.price-desc,
.prose .price-desc,
.prose p.price-desc {
 margin: 0 !important;
 font-size: 15px !important;
 line-height: 1.45 !important;
 color: var(--color-silver-mist) !important;
 font-weight: 400;
}
.price-row {
 display: grid;
 grid-template-columns: 1.1fr 0.9fr;
 gap: 18px;
 max-width: none;
 width: 100%;
}
.price-grid {
 display: grid;
 grid-template-columns: repeat(2, minmax(0, 1fr));
 gap: 18px;
 max-width: none;
 width: 100%;
}
.price-main, .price-side {
 padding: clamp(28px, 3.5vw, 44px) clamp(24px, 3vw, 36px);
 min-height: 220px;
 display: flex;
 flex-direction: column;
 justify-content: flex-start;
 background:
 linear-gradient(165deg, rgba(0, 232, 212, 0.08), transparent 42%),
 rgba(255, 255, 255, 0.03);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.12);
}
.price-main h3, .price-side h3,
.prose .price-main h3 {
 font-size: clamp(1.35rem, 2.2vw, 1.75rem) !important;
 line-height: 1.2;
 margin: 10px 0 12px !important;
 color: #fff !important;
}
.price-main > p:last-of-type {
 color: var(--color-silver-mist);
 font-weight: 400;
}
.price-side .line {
 display: flex;
 justify-content: space-between;
 gap: 16px;
 padding: 16px 0;
 border-bottom: 1px solid rgba(255, 255, 255, 0.08);
 color: var(--color-ash-gray);
 font-weight: 400;
}
.price-side .line strong { color: var(--color-bone-white); font-weight: 400; }
.photo-frame {
 border-radius: var(--radius);
 overflow: hidden;
}
.photo-frame img {
 width: 100%;
 height: auto;
 aspect-ratio: 4/5;
 object-fit: cover;
}
.section-about-bg {
 position: relative;
 overflow: hidden;
 isolation: isolate;
}
.about-bg {
 position: absolute;
 inset: 0;
 background-size: cover;
 background-position: center;
 opacity: 0.28;
 z-index: 0;
 filter: saturate(0.85) contrast(1.05);
}
.about-bg::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(90deg, rgba(0,0,0,0.88) 0%, rgba(0,0,0,0.72) 48%, rgba(0,0,0,0.55) 100%);
}
.about-inner {
 position: relative;
 z-index: 1;
}
.about-highlights {
 margin: 0 0 22px;
 padding: 0;
 list-style: none;
 display: grid;
 gap: 10px;
}
.about-highlights li {
 color: var(--color-silver-mist);
 font-size: 15px;
 line-height: 1.45;
 padding-left: 18px;
 position: relative;
}
.about-highlights li::before {
 content: "";
 position: absolute;
 left: 0;
 top: 0.55em;
 width: 7px;
 height: 7px;
 border-radius: 50%;
 background: var(--color-electric-iris);
}
.page-hero--photo {
 position: relative;
 overflow: hidden;
 isolation: isolate;
 min-height: 42vh;
 display: flex;
 align-items: flex-end;
 padding-bottom: 48px;
}
.page-hero-bg {
 position: absolute;
 inset: 0;
 background-size: cover;
 background-position: center;
 z-index: 0;
 opacity: 0.4;
}
.page-hero-bg::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(180deg, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0.82) 70%, #000 100%);
}
.page-hero--photo > .container {
 position: relative;
 z-index: 1;
}
.about-hero-photo {
 margin: 0 0 28px;
 max-width: 320px;
 border-radius: var(--radius);
 overflow: hidden;
 box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}
.about-hero-photo img {
 display: block;
 width: 100%;
 height: auto;
 aspect-ratio: 1;
 object-fit: cover;
}
.prose-figure {
 margin: 18px 0 28px;
}
.prose-figure img {
 display: block;
 width: 100%;
 height: auto;
 border-radius: var(--radius);
 box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}
.prose-figure figcaption {
 margin-top: 10px;
 color: var(--color-ash-gray);
 font-size: 13px;
}
.portfolio-grid {
 display: grid;
 grid-template-columns: repeat(3, 1fr);
 gap: 14px;
 margin: 24px 0 40px;
}
.portfolio-grid figure {
 margin: 0;
}
.portfolio-grid img {
 display: block;
 width: 100%;
 height: auto;
 aspect-ratio: 4 / 5;
 object-fit: cover;
 border-radius: var(--radius);
 box-shadow: inset 0 0 0 1px rgba(255,255,255,0.08);
}
.portfolio-grid figcaption {
 margin-top: 8px;
 color: var(--color-ash-gray);
 font-size: 12px;
 letter-spacing: 0.02em;
}
.section-deep.section-photo-bg {
 position: relative;
 isolation: isolate;
 overflow: hidden;
}
.section-photo-bg > .photo-bg {
 position: absolute;
 inset: 0;
 background-size: cover;
 background-position: center;
 opacity: 0.18;
 z-index: 0;
}
.section-photo-bg > .container {
 position: relative;
 z-index: 1;
}
.section-photo-bg--solid {
 background: #070a0e;
 min-height: 0;
 padding-top: clamp(36px, 5vw, 64px);
 padding-bottom: clamp(48px, 8vw, 96px);
}
.section-photo-bg--solid > .photo-bg {
 opacity: 1;
 filter: none;
 background-color: #070a0e;
 background-position: center top;
 background-repeat: no-repeat;
 background-size: 100% auto; 
 inset: 0;
 z-index: 0;
}
.section-photo-bg--solid > .photo-bg::after {
 content: "";
 position: absolute;
 inset: 0;
 background: linear-gradient(
 180deg,
 rgba(0, 0, 0, 0.4) 0%,
 rgba(0, 0, 0, 0.5) 45%,
 rgba(0, 0, 0, 0.68) 100%
 );
 pointer-events: none;
}
.section-photo-bg--solid > .container {
 position: relative;
 z-index: 1;
 text-shadow: 0 1px 18px rgba(0, 0, 0, 0.85);
}
.section-photo-bg--solid .project-panel article {
 background: rgba(0, 0, 0, 0.62);
 border: 1px solid rgba(255, 193, 74, 0.22);
 border-radius: var(--radius);
 padding: clamp(20px, 3vw, 28px);
 backdrop-filter: blur(8px);
}
.awards-grid {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 28px 22px;
 margin: 28px 0 40px;
}
.award-card {
 margin: 0;
}
.award-card a {
 display: block;
 overflow: hidden;
 border-radius: var(--radius);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
 background: rgba(255, 255, 255, 0.02);
}
.award-card img {
 display: block;
 width: 100%;
 height: auto;
 aspect-ratio: 4 / 5;
 object-fit: cover;
 transition: transform 0.35s ease;
}
.award-card a:hover img {
 transform: scale(1.02);
}
.award-card figcaption {
 margin-top: 14px;
}
.award-card figcaption strong {
 display: block;
 color: var(--color-bone-white);
 font-weight: 500;
 font-size: 18px;
 letter-spacing: -0.02em;
 margin-bottom: 8px;
}
.award-card figcaption span {
 display: block;
 color: var(--color-ash-gray);
 font-size: 14px;
 line-height: 1.55;
 font-weight: 400;
}
.awards-moments {
 display: grid;
 grid-template-columns: 1fr 1.15fr;
 gap: 18px;
 margin: 8px 0 44px;
}
.awards-moments figure {
 margin: 0;
}
.awards-moments img {
 display: block;
 width: 100%;
 height: auto;
 aspect-ratio: 4 / 5;
 object-fit: cover;
 border-radius: var(--radius);
 box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
}
.awards-moments figure:last-child img {
 aspect-ratio: 3 / 2;
}
.awards-moments figcaption {
 margin-top: 10px;
 color: var(--color-ash-gray);
 font-size: 13px;
 letter-spacing: 0.02em;
}
.landings-grid {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 12px;
}
.landings-grid a {
 display: block;
 padding: 28px 30px;
 transition: box-shadow 0.2s, background 0.2s;
}
.landings-grid a:hover {
 background: rgba(0, 212, 200, 0.08);
 box-shadow: inset 0 0 0 1px rgba(0, 212, 200, 0.45);
}
.landings-grid a strong {
 display: block;
 color: var(--color-bone-white);
 font-weight: 400;
 font-size: 22px;
 letter-spacing: -0.03em;
 margin-bottom: 8px;
}
.landings-grid a span {
 display: block;
 color: var(--color-ash-gray);
 font-size: 15px;
 font-weight: 400;
}
.project-panel {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 18px;
}
.project-panel article {
 padding: 38px 30px;
 min-height: 280px;
 display: flex;
 flex-direction: column;
}
.project-panel .eyebrow { color: var(--color-saffron-spark); }
.project-panel h3 {
 font-size: clamp(1.75rem, 3vw, 2.25rem);
 line-height: 1.1;
 margin-bottom: 14px;
}
.project-panel p { flex: 1; margin-bottom: 24px; font-weight: 400; }
.cta-panel {
 padding: clamp(48px, 8vw, 96px) clamp(28px, 5vw, 64px);
 text-align: center;
}
.cta-panel h2 {
 font-size: var(--text-heading-lg);
 line-height: 1.1;
 max-width: 14ch;
 margin: 0 auto 16px;
}
.cta-panel > p {
 max-width: 46ch;
 margin: 0 auto 28px;
 font-weight: 400;
}
.cta-actions {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 12px;
}
.cta-hint {
 margin-top: 20px;
 font-size: 12px;
 letter-spacing: 0.08em;
 text-transform: uppercase;
 color: var(--color-ash-gray);
 font-weight: 600;
}
.page-hero { padding: 48px 0 24px; }
.breadcrumb {
 display: flex;
 flex-wrap: wrap;
 gap: 8px;
 align-items: center;
 font-size: 12px;
 letter-spacing: 0.06em;
 text-transform: uppercase;
 color: var(--color-ash-gray);
 margin-bottom: 20px;
 font-weight: 600;
}
.breadcrumb a { color: var(--color-ash-gray); }
.breadcrumb a:hover { color: var(--color-saffron-spark); }
.page-hero h1 {
 font-size: clamp(1.85rem, 4vw, 2.75rem);
 line-height: 1.15;
 letter-spacing: -0.03em;
 max-width: 22ch;
 margin-bottom: 14px;
}
.page-hero > .container > p {
 max-width: 48ch;
 font-weight: 400;
}
.prose { padding: 8px 0 96px; }
.prose .content {
 max-width: 720px;
 background: rgba(255, 255, 255, 0.035);
 border: 1px solid rgba(255, 255, 255, 0.08);
 border-radius: 28px;
 padding: clamp(28px, 4vw, 48px);
 box-shadow: 0 24px 80px rgba(0, 0, 0, 0.35);
}
.prose .content:has(.price-grid),
.prose .content:has(.price-row) {
 max-width: none;
 width: 100%;
 background: transparent;
 border: 0;
 box-shadow: none;
 border-radius: 0;
 padding-left: 0;
 padding-right: 0;
}
.prose .lead {
 font-size: clamp(1.2rem, 2.2vw, 1.4rem);
 line-height: 1.55;
 font-weight: 450;
 color: #ffffff;
 margin-bottom: 28px;
}
.prose h2 {
 font-size: clamp(1.55rem, 2.8vw, 2rem);
 line-height: 1.2;
 margin: 40px 0 14px;
 color: #ffffff;
 letter-spacing: -0.02em;
}
.prose h3 {
 font-size: 1.25rem;
 margin: 28px 0 10px;
 color: #ffffff;
}
.prose p {
 margin-bottom: 18px;
 font-weight: 400;
 font-size: 1.0625rem;
 line-height: 1.7;
 color: #e6e6e6;
}
.prose ul, .prose ol {
 list-style: disc;
 padding-left: 1.25rem;
 margin: 0 0 22px;
}
.prose ol { list-style: decimal; }
.prose li {
 margin-bottom: 10px;
 font-weight: 400;
 font-size: 1.0625rem;
 line-height: 1.65;
 color: #e6e6e6;
}
.prose a {
 color: var(--color-signal-aqua, #00e8d4);
 text-decoration: underline;
 text-underline-offset: 3px;
}
.prose a:hover { color: var(--color-saffron-spark); }
.prose strong { color: #ffffff; font-weight: 600; }
.prose blockquote {
 margin: 28px 0;
 padding: 20px 22px;
 border-left: 3px solid var(--color-electric-iris);
 background: rgba(0, 212, 200, 0.07);
 border-radius: 0 16px 16px 0;
 color: #ffffff;
 font-size: 1.125rem;
 font-weight: 400;
 line-height: 1.55;
}
.prose .btn { text-decoration: none; margin-right: 8px; margin-top: 8px; display: inline-flex; }
.article-retain {
 margin: 36px 0;
 padding: 28px 26px;
 border-radius: 22px;
 background: linear-gradient(135deg, rgba(0, 212, 200, 0.14), rgba(255, 193, 74, 0.08));
 border: 1px solid rgba(0, 212, 200, 0.28);
}
.article-retain h3 {
 margin: 0 0 10px;
 font-size: 1.35rem;
 color: #fff;
}
.article-retain p {
 margin-bottom: 18px;
 color: #ececec;
}
.article-retain .cta-row {
 display: flex;
 flex-wrap: wrap;
 gap: 10px;
}
.faq details {
 padding: 18px 22px;
 margin-bottom: 10px;
 background: rgba(255,255,255,0.03);
 border: 1px solid rgba(255,255,255,0.08);
 border-radius: 16px;
}
.faq summary {
 cursor: pointer;
 color: #ffffff;
 font-weight: 500;
 list-style: none;
 font-size: 1.05rem;
}
.faq summary::-webkit-details-marker { display: none; }
.faq details p {
 margin-top: 12px;
 font-weight: 400;
 color: #dcdcdc;
 line-height: 1.6;
}
.faq details a,
.faq-link {
 color: var(--color-saffron-spark, #ffc14a);
 text-decoration: underline;
 text-underline-offset: 3px;
 font-weight: 600;
}
.faq details a:hover,
.faq-link:hover {
 color: #ffe08a;
}
.related { margin-top: 48px; }
.related h2 { font-size: 1.35rem; margin-bottom: 16px; color: #fff; }
.related-list { display: flex; flex-wrap: wrap; gap: 10px; }
.related-list a {
 padding: 12px 16px;
 color: #ffffff;
 text-decoration: none;
 font-size: 13px;
 font-weight: 600;
 text-transform: uppercase;
 letter-spacing: 0.025em;
 background: rgba(255,255,255,0.04);
 border: 1px solid rgba(255,255,255,0.1);
 border-radius: 999px;
}
.related-list a:hover {
 border-color: rgba(0, 212, 200, 0.5);
 color: var(--color-signal-aqua, #00e8d4);
}
.blog-intro {
 max-width: 46rem;
 margin-bottom: 28px;
 color: #d8d8d8;
 font-size: 1.1rem;
 line-height: 1.6;
}
.blog-grid {
 display: grid;
 grid-template-columns: repeat(2, 1fr);
 gap: 18px;
 padding-bottom: 96px;
}
.blog-item {
 display: flex;
 flex-direction: column;
 padding: 28px 26px 24px;
 transition: transform 0.2s var(--ease), border-color 0.2s, background 0.2s;
 background: rgba(255, 255, 255, 0.035);
 border: 1px solid rgba(255, 255, 255, 0.08);
 border-radius: 22px;
 min-height: 100%;
}
.blog-item:hover {
 background: rgba(0, 212, 200, 0.07);
 border-color: rgba(0, 212, 200, 0.35);
 transform: translateY(-2px);
}
.blog-item .tag {
 font-size: 11px;
 letter-spacing: 0.1em;
 text-transform: uppercase;
 color: var(--color-electric-iris);
 margin-bottom: 14px;
 font-weight: 600;
}
.blog-item h2 {
 font-size: clamp(1.2rem, 2vw, 1.45rem);
 line-height: 1.25;
 margin-bottom: 12px;
 color: #ffffff;
 letter-spacing: -0.02em;
}
.blog-item > p {
 color: #cfcfcf;
 font-size: 0.98rem;
 line-height: 1.55;
 flex: 1;
}
.blog-item .more {
 display: inline-flex;
 align-items: center;
 margin-top: 20px;
 font-size: 13px;
 letter-spacing: 0.06em;
 text-transform: uppercase;
 font-weight: 600;
 color: var(--color-saffron-spark);
}
.article-meta {
 display: flex;
 flex-wrap: wrap;
 gap: 10px 16px;
 margin-bottom: 16px;
 font-size: 13px;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: #b0b0b0;
 font-weight: 500;
}
.article-meta span {
 position: relative;
}
.article-meta span:not(:last-child)::after {
 content: "·";
 margin-left: 16px;
 color: rgba(255,255,255,0.25);
}
.local-card {
 margin: 28px 0;
 padding: 26px 24px;
 border-radius: 22px;
 border: 1px solid rgba(0, 212, 200, 0.28);
 background: rgba(0, 212, 200, 0.06);
}
.local-card h2 { margin-top: 0; }
.local-card p { margin-bottom: 8px; }
.advantage-grid {
 display: grid;
 grid-template-columns: 1fr 1fr;
 gap: 12px;
 margin: 20px 0 28px;
}
.advantage-grid article {
 padding: 20px 18px;
 border-radius: 18px;
 background: rgba(255,255,255,0.04);
 border: 1px solid rgba(255,255,255,0.08);
}
.advantage-grid h3 {
 margin: 0 0 8px;
 font-size: 1.05rem;
 color: #fff;
}
.advantage-grid p {
 margin: 0;
 font-size: 0.95rem;
 color: #d0d0d0;
}
.site-footer {
 background: rgba(0, 0, 0, 0.22);
 backdrop-filter: blur(8px);
 -webkit-backdrop-filter: blur(8px);
 padding: 48px 0 0;
 border-top: 1px solid rgba(255, 255, 255, 0.06);
 text-align: center;
}
.footer-main {
 max-width: 760px;
 margin: 0 auto;
}
.footer-eyebrow {
 font-size: 10px;
 letter-spacing: 0.14em;
 text-transform: uppercase;
 color: var(--color-electric-iris, #00d4c8);
 font-weight: 600;
 margin-bottom: 6px;
}
.footer-brand {
 font-size: clamp(1.05rem, 2vw, 1.25rem);
 font-weight: 500;
 color: var(--color-bone-white, #fff);
 letter-spacing: -0.02em;
 margin-bottom: 6px;
}
.footer-tag {
 color: var(--color-ash-gray, #9a9a9a);
 margin: 0 auto 18px;
 max-width: 32rem;
 font-size: 12px;
 font-weight: 400;
 line-height: 1.45;
}
.footer-nav,
.footer-seo,
.footer-contacts {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 6px 14px;
 margin-bottom: 12px;
}
.footer-nav a {
 font-size: 11px;
 letter-spacing: 0.06em;
 text-transform: uppercase;
 color: var(--color-ash-gray, #9a9a9a);
 font-weight: 600;
}
.footer-seo a {
 font-size: 10px;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: rgba(232, 232, 232, 0.42);
 font-weight: 500;
}
.footer-nav a:hover,
.footer-seo a:hover,
.footer-contacts a:hover {
 color: var(--color-bone-white, #fff);
}
.footer-contacts {
 margin-top: 6px;
 align-items: center;
}
.footer-contacts a {
 font-size: 12px;
 color: var(--color-ash-gray, #9a9a9a);
 font-weight: 500;
 letter-spacing: 0.01em;
 text-transform: none;
}
.footer-dot {
 color: rgba(232, 232, 232, 0.28);
 font-size: 12px;
}
.footer-legal {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 gap: 8px 16px;
 margin-top: 14px;
}
.footer-legal a {
 font-size: 11px;
 letter-spacing: 0.03em;
 color: rgba(232, 232, 232, 0.55);
 text-decoration: underline;
 text-underline-offset: 3px;
}
.footer-legal a:hover { color: var(--color-bone-white); }
.footer-geo {
 margin-top: 4px;
 color: rgba(232, 232, 232, 0.4);
 font-size: 11px;
 line-height: 1.4;
}
.cookie-banner {
 position: fixed;
 left: 0;
 right: 0;
 bottom: 0;
 z-index: 400;
 padding: 12px 16px calc(12px + env(safe-area-inset-bottom, 0px));
 background: rgba(8, 10, 12, 0.94);
 backdrop-filter: blur(12px);
 border-top: 1px solid rgba(255, 255, 255, 0.1);
 box-shadow: 0 -12px 40px rgba(0, 0, 0, 0.35);
}
.cookie-banner[hidden] { display: none !important; }
.cookie-banner-inner {
 max-width: 1080px;
 margin: 0 auto;
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: 12px 18px;
}
.cookie-banner p {
 flex: 1 1 280px;
 margin: 0;
 font-size: 13px;
 line-height: 1.45;
 color: rgba(232, 232, 232, 0.82);
}
.cookie-banner a {
 color: var(--color-signal-aqua, #00e8d4);
 text-decoration: underline;
 text-underline-offset: 2px;
}
.cookie-accept {
 flex: 0 0 auto;
 padding: 12px 18px !important;
 font-size: 12px !important;
}
.quiz-consent {
 display: flex;
 align-items: flex-start;
 gap: 10px;
 margin-top: 14px;
 font-size: 12px;
 line-height: 1.4;
 color: rgba(232, 232, 232, 0.72);
 cursor: pointer;
}
.quiz-consent input {
 margin-top: 2px;
 flex: 0 0 auto;
 width: 16px;
 height: 16px;
 accent-color: var(--color-signal-aqua, #00e8d4);
}
.quiz-consent a {
 color: var(--color-signal-aqua, #00e8d4);
 text-decoration: underline;
 text-underline-offset: 2px;
}
.oferta-actions {
 display: flex;
 justify-content: center;
 margin: 8px 0 0 !important;
}
.prose .content:has(.oferta-actions) {
 max-width: 640px;
 margin-left: auto;
 margin-right: auto;
 text-align: center;
 background: transparent;
 border: 0;
 box-shadow: none;
 padding-top: 8px;
 padding-bottom: 48px;
}
body:has(.oferta-actions) .page-hero .breadcrumb { display: none; }
body:has(.oferta-actions) .page-hero > .container {
 text-align: center;
}
body:has(.oferta-actions) .page-hero > .container > p {
 margin-left: auto;
 margin-right: auto;
}
.footer-bar {
 margin-top: 28px;
 border-top: 1px solid rgba(255, 255, 255, 0.05);
 padding: 14px 0 18px;
 background: transparent;
}
.footer-bar-inner {
 display: flex;
 flex-direction: column;
 align-items: center;
 gap: 6px;
 text-align: center;
}
.footer-copy {
 font-size: 10px;
 letter-spacing: 0.04em;
 text-transform: uppercase;
 color: rgba(232, 232, 232, 0.45);
 margin: 0;
}
.footer-credit {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 justify-content: center;
 gap: 6px;
 margin: 0;
 font-size: 10px;
 letter-spacing: 0.05em;
 text-transform: uppercase;
 color: rgba(232, 232, 232, 0.4);
}
.footer-nexus {
 display: inline-flex;
 align-items: center;
 gap: 6px;
 color: var(--color-ash-gray, #9a9a9a);
 opacity: 0.75;
 transition: opacity 0.2s ease, color 0.2s ease;
}
.footer-nexus:hover {
 opacity: 1;
 color: var(--color-bone-white, #fff);
}
.footer-nexus img {
 width: 12px;
 height: 12px;
 border-radius: 2px;
 object-fit: contain;
}
html.js .reveal {
 opacity: 0;
 transform: translate3d(0, 24px, 0);
 transition: opacity 0.7s var(--ease), transform 0.7s var(--ease);
}
html.js .reveal.is-visible {
 opacity: 1;
 transform: translate3d(0, 0, 0);
}
.price-note {
 margin-top: 22px;
 color: var(--color-silver-mist);
 font-size: 0.98rem;
 max-width: 52ch;
}
body.nav-open { overflow: hidden; }
@media (max-width: 960px) {
 .stats { grid-template-columns: repeat(2, 1fr); }
 .stats--facts { grid-template-columns: 1fr; }
 .grid-2, .price-row, .project-panel, .hero-grid, .awards-grid, .awards-moments { grid-template-columns: 1fr; }
 .price-grid { grid-template-columns: repeat(2, 1fr); }
 .portfolio-grid { grid-template-columns: repeat(2, 1fr); }
 .advantage-grid { grid-template-columns: 1fr; }
 .blog-grid { grid-template-columns: 1fr; }
 .grid-3 { grid-template-columns: 1fr; }
 .landings-grid, .blog-grid { grid-template-columns: 1fr; }
 .section-title, .page-hero h1 { max-width: none; }
 .hero-stage { min-height: 42vh; }
 
}
@media (max-width: 560px) {
 .price-grid { grid-template-columns: 1fr; }
}
@media (max-width: 820px) {
 .burger { display: grid; }
 .logo-word span { display: none; }
 .nav {
 position: fixed;
 inset: calc(var(--ticker-h) + var(--header-h)) 0 auto 0;
 display: none;
 flex-direction: column;
 align-items: stretch;
 gap: 0;
 padding: 8px 20px 28px;
 background: rgba(0, 0, 0, 0.96);
 border-bottom: 1px solid rgba(255,255,255,0.08);
 max-height: calc(100vh - var(--ticker-h) - var(--header-h));
 overflow: auto;
 }
 .nav.is-open { display: flex; }
 .nav a {
 padding: 14px 0;
 font-size: 14px;
 border-bottom: 1px solid rgba(255,255,255,0.06);
 }
 .nav .nav-cta {
 margin-top: 16px;
 justify-content: center;
 font-size: 13px !important;
 padding: 14px 16px !important;
 }
 .sound-dock { right: 14px; bottom: 14px; gap: 8px; }
 .scroll-top,
 .sound-toggle { width: 48px; height: 48px; }
}
@media (prefers-reduced-motion: reduce) {
 html { scroll-behavior: auto; }
 html.js .reveal { opacity: 1; transform: none; transition: none; }
}
.quiz-modal {
 position: fixed;
 inset: 0;
 z-index: 400;
 display: none;
 place-items: center;
 padding: 20px;
 pointer-events: none;
}
.quiz-modal.is-open {
 display: grid;
 pointer-events: auto;
}
.quiz-backdrop {
 position: absolute;
 inset: 0;
 background: rgba(0, 0, 0, 0.72);
 backdrop-filter: blur(8px);
}
.quiz-panel {
 position: relative;
 width: min(520px, 100%);
 max-height: min(88vh, 720px);
 overflow: auto;
 padding: 28px 24px 22px;
 border-radius: 28px;
 background: linear-gradient(165deg, #0b1212 0%, #000 55%, #061616 100%);
 border: 1px solid rgba(0, 212, 200, 0.28);
 box-shadow: 0 30px 100px rgba(0, 0, 0, 0.55);
}
.quiz-close {
 position: absolute;
 top: 12px;
 right: 14px;
 width: 36px;
 height: 36px;
 border: 0;
 border-radius: 50%;
 background: rgba(255,255,255,0.06);
 color: #fff;
 font-size: 22px;
 line-height: 1;
 cursor: pointer;
}
.quiz-progress {
 height: 3px;
 background: rgba(255,255,255,0.08);
 border-radius: 99px;
 overflow: hidden;
 margin-bottom: 18px;
}
.quiz-progress-bar {
 height: 100%;
 width: 0%;
 background: linear-gradient(90deg, #00d4c8, #ffc14a);
 transition: width 0.35s var(--ease);
}
.quiz-eyebrow {
 font-size: 11px;
 letter-spacing: 0.12em;
 text-transform: uppercase;
 color: var(--color-saffron-spark);
 font-weight: 700;
 margin-bottom: 8px;
}
.quiz-title {
 font-size: clamp(1.4rem, 3vw, 1.75rem);
 color: #fff;
 font-weight: 500;
 letter-spacing: -0.03em;
 margin-bottom: 8px;
}
.quiz-note {
 font-size: 13px;
 color: #a8a8a8;
 line-height: 1.45;
 margin-bottom: 22px;
}
.quiz-step { display: none; }
.quiz-step.is-active { display: block; }
.quiz-q {
 display: block;
 font-size: 1.15rem;
 color: #fff;
 font-weight: 500;
 margin-bottom: 8px;
 line-height: 1.35;
}
.quiz-hint {
 font-size: 13px;
 color: #8f8f8f;
 margin-bottom: 16px;
}
.quiz-input {
 width: 100%;
 padding: 16px 18px;
 border-radius: 16px;
 border: 1px solid rgba(255,255,255,0.12);
 background: rgba(255,255,255,0.04);
 color: #fff;
 font-size: 1.125rem;
 font-family: inherit;
 outline: none;
}
.quiz-input:focus {
 border-color: rgba(0, 212, 200, 0.55);
 box-shadow: 0 0 0 3px rgba(0, 212, 200, 0.15);
}
.quiz-phone-row {
 display: flex;
 align-items: stretch;
 gap: 0;
 border-radius: 16px;
 border: 1px solid rgba(255,255,255,0.12);
 background: rgba(255,255,255,0.04);
 overflow: hidden;
}
.quiz-phone-row:focus-within {
 border-color: rgba(0, 212, 200, 0.55);
 box-shadow: 0 0 0 3px rgba(0, 212, 200, 0.15);
}
.quiz-phone-code {
 display: grid;
 place-items: center;
 padding: 0 14px;
 font-size: 1.125rem;
 font-weight: 600;
 color: #ffc14a;
 background: rgba(0, 212, 200, 0.08);
 border-right: 1px solid rgba(255,255,255,0.1);
 white-space: nowrap;
 user-select: none;
}
.quiz-phone-input {
 border: 0 !important;
 border-radius: 0 !important;
 box-shadow: none !important;
 background: transparent !important;
}
.quiz-options {
 display: grid;
 gap: 10px;
}
.quiz-opt {
 text-align: left;
 padding: 14px 16px;
 border-radius: 16px;
 border: 1px solid rgba(255,255,255,0.1);
 background: rgba(255,255,255,0.03);
 color: #e8e8e8;
 font-size: 0.98rem;
 font-family: inherit;
 cursor: pointer;
 transition: border-color 0.2s, background 0.2s, transform 0.2s;
}
.quiz-opt:hover {
 border-color: rgba(0, 212, 200, 0.4);
 background: rgba(0, 212, 200, 0.07);
}
.quiz-opt.is-selected {
 border-color: rgba(255, 193, 74, 0.65);
 background: rgba(255, 193, 74, 0.1);
 color: #fff;
 box-shadow: inset 0 0 0 1px rgba(255, 193, 74, 0.25);
}
.quiz-nav {
 display: flex;
 justify-content: space-between;
 gap: 10px;
 margin-top: 22px;
}
.quiz-nav .btn { min-width: 120px; }
.quiz-error {
 margin-top: 14px;
 color: #ff8f8f;
 font-size: 14px;
}
.quiz-success {
 text-align: center;
 padding: 20px 8px 8px;
}
.quiz-success-title {
 font-size: 1.4rem;
 color: #fff;
 margin-bottom: 10px;
}
body.quiz-open { overflow: hidden; }