/* SYNKRO: centered cinematic opening, using the established brand tokens. */
body {-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
.navbar {background:var(--synkro-dark);border-bottom:0}
.nav-inner {display:grid;grid-template-columns:1fr auto 1fr;padding:22px 40px;gap:24px}
.nav-inner .wordmark {font-size:22px;justify-self:start}
.nav-inner nav {justify-self:center;gap:8px;margin:0}
.nav-inner nav a {position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;min-height:44px;padding:0 15px;border-radius:7px;border:1px solid rgb(217 219 212 / .35);background:linear-gradient(105deg,var(--synkro-dark),var(--synkro-oxford) 48%,rgb(167 170 163 / .23));font-size:13px;white-space:nowrap;transition:border-color .35s,box-shadow .35s}
.nav-inner nav a:before,.hero-copy .button:after {content:'';position:absolute;inset:0;background:linear-gradient(115deg,transparent 25%,rgb(255 255 255 / .18) 50%,transparent 75%);transform:translateX(-130%);transition:transform .65s;pointer-events:none}
.nav-inner nav a:hover:before,.hero-copy .button:hover:after {transform:translateX(130%)}
.nav-inner nav a:hover {border-color:var(--synkro-silver);box-shadow:0 0 18px rgb(199 244 3 / .07);color:var(--synkro-light)}
.nav-actions {justify-self:end;margin:0}.nav-actions .secondary {display:none}
.hero-cinematic {isolation:isolate;position:relative;max-width:none;min-height:calc(100svh - 88px);display:flex;flex-direction:column;align-items:center;justify-content:flex-end;gap:0;padding:300px 40px 30px;overflow:hidden;background:var(--synkro-dark)}
.hero-atmosphere {position:absolute;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 50% 24%,rgb(199 244 3 / .1),transparent 49%)}
.hero-cinematic:after {content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(180deg,transparent 25%,rgb(29 29 27 / .25) 40%,var(--synkro-dark) 66%)}
.hero-cinematic .hero-product-stage {position:absolute;top:0;left:0;right:0;height:48%;min-height:290px;padding:0;display:flex;justify-content:center;align-items:center;z-index:-2;overflow:visible}
.hero-cinematic .hero-product-photo {height:100%;width:auto;max-width:85%;object-fit:contain;filter:drop-shadow(0 20px 35px rgb(0 0 0 / .3));opacity:.9}
.hero-cinematic .hero-copy {position:relative;display:flex;align-items:center;flex-direction:column;text-align:center;width:100%;max-width:960px;margin-top:auto;z-index:1}
.hero-cinematic .hero-badge {display:inline-flex;margin-bottom:20px;border:1px solid rgb(217 219 212 / .13);border-radius:5px;padding:8px 14px;background:linear-gradient(100deg,rgb(167 170 163 / .3),var(--synkro-oxford) 52%,var(--synkro-dark));color:var(--synkro-silver);font-size:11px;letter-spacing:.08em}
.hero-cinematic h1 {font-size:clamp(2.2rem,3.75vw,3.7rem);line-height:1.22;letter-spacing:-.055em;margin:0;color:var(--synkro-light)}
.hero-cinematic h1 span {color:inherit}.hero-cinematic h1 em {font-style:normal;color:var(--synkro-green);font-weight:400}
.headline-line {display:block;overflow:hidden;padding:.02em .12em .12em}.headline-reveal {display:block}
.hero-cinematic .hero-description {font-size:16px;line-height:1.65;max-width:485px;margin:18px auto 0;color:var(--synkro-gray)}
.hero-cinematic .button-row {justify-content:center;gap:10px;margin-top:26px}
.hero-cinematic .button {position:relative;overflow:hidden;min-height:46px;padding:12px 22px;font-size:14px;border-radius:6px}
.hero-cinematic .button.secondary {background:linear-gradient(135deg,rgb(255 255 255 / .08),rgb(29 29 27 / .7) 50%,rgb(167 170 163 / .08));border-color:rgb(217 219 212 / .4);backdrop-filter:blur(16px)}
.hero-cinematic .hero-footer {display:flex;width:100%;max-width:1440px;justify-content:space-between;align-items:center;gap:24px;margin:65px 0 0;padding:0 30px;border:0;color:var(--synkro-silver);font-size:13px;letter-spacing:0}
.hero-stat {display:flex;align-items:center;gap:13px}.hero-stat strong {font-weight:500;color:var(--synkro-light)}.stat-symbol {color:var(--synkro-green);font-size:23px;line-height:1}
.nfc-demo-strip {max-width:1440px;margin:auto;padding:30px 64px;display:flex;align-items:center;justify-content:space-between;gap:30px;border-block:1px solid var(--line)}
.nfc-demo-strip .visual-topline {gap:22px;font-size:10px}.nfc-demo-strip .action-preview {margin:0;padding:0;border:0;background:none;gap:14px}.nfc-demo-strip .micro-label {font-size:10px}.nfc-demo-strip .button {font-size:13px;min-height:44px}
.hero-cinematic .entrance {animation:cinematic-soft 1.05s cubic-bezier(.16,1,.3,1) both}.hero-badge {animation-delay:.12s!important}.headline-reveal {animation:cinematic-title 1.05s cubic-bezier(.16,1,.3,1) both;animation-delay:.25s}.headline-line:nth-child(2) .headline-reveal {animation-delay:.4s}.hero-description.entrance {animation-delay:.55s}.button-row.entrance {animation-delay:.65s}.hero-stat:nth-child(1) {animation-delay:.8s}.hero-stat:nth-child(2) {animation-delay:.9s}.hero-stat:nth-child(3) {animation-delay:1s}
@keyframes cinematic-soft {from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
@keyframes cinematic-title {from{opacity:0;transform:translateY(50%)}to{opacity:1;transform:none}}
@media(min-width:1600px){.hero-cinematic{padding-top:360px;padding-bottom:44px}.hero-cinematic h1{font-size:4rem}.hero-cinematic .hero-description{font-size:18px;max-width:540px}.hero-cinematic .hero-footer{font-size:15px;margin-top:85px}}
@media(min-width:1920px){.hero-cinematic h1{font-size:4.75rem}.hero-cinematic .hero-copy{max-width:1200px}.hero-cinematic .hero-description{font-size:20px;max-width:600px}}
@media(min-width:951px) and (max-height:850px){.hero-cinematic{padding-top:210px;padding-bottom:24px}.hero-cinematic h1{font-size:2.5rem}.hero-cinematic .hero-badge{margin-bottom:12px}.hero-cinematic .hero-description{margin-top:10px;font-size:15px}.hero-cinematic .button-row{margin-top:18px}.hero-cinematic .hero-footer{margin-top:40px}.hero-cinematic .hero-product-stage{min-height:235px;height:43%}}
@media(max-width:1200px){.nav-inner{padding:18px 28px;gap:16px}.nav-inner nav a{padding:0 11px;font-size:12px}.nav-inner .wordmark{font-size:19px}.hero-cinematic .hero-footer{padding:0;font-size:12px;gap:20px}.nfc-demo-strip{padding:28px 40px}.nfc-demo-strip .visual-topline{display:none}}
@media(max-width:950px){.nav-inner{grid-template-columns:1fr auto auto;gap:12px;padding:18px 24px}.nav-inner nav{position:fixed;top:80px;left:0;right:0;padding:24px;background:rgb(29 29 27 / .97);backdrop-filter:blur(24px);display:none;max-height:calc(100dvh - 80px);overflow:auto;gap:12px}.nav-inner nav.open{display:flex}.nav-inner nav a{min-height:52px;font-size:17px}.hero-cinematic{min-height:calc(100svh - 80px);padding:290px 24px 30px}.hero-cinematic .hero-product-stage{height:310px;min-height:0}.hero-cinematic h1{font-size:clamp(1.8rem,4.6vw,2.8rem)}.hero-cinematic .hero-footer{margin-top:45px;gap:18px;flex-wrap:wrap;justify-content:center}.hero-stat{font-size:12px}.hero-cinematic:after{background:linear-gradient(180deg,transparent 15%,rgb(29 29 27 / .3) 32%,var(--synkro-dark) 52%)}}
@media(max-width:560px){.nav-inner{padding:16px;gap:8px}.nav-inner .wordmark{font-size:18px}.hero-cinematic{padding:255px 20px 28px;min-height:calc(100svh - 76px)}.hero-cinematic .hero-product-stage{height:265px;top:0}.hero-cinematic .hero-product-photo{max-width:94%;width:340px}.hero-cinematic .hero-badge{font-size:9px;padding:8px 10px;margin-bottom:16px;letter-spacing:.065em}.hero-cinematic h1{font-size:clamp(1.55rem,6.5vw,2.2rem);line-height:1.3}.hero-cinematic .hero-description{font-size:15px;max-width:360px;margin-top:14px}.hero-cinematic .button-row{width:100%;max-width:360px;flex-direction:column;margin-top:22px;gap:10px}.hero-cinematic .button{width:100%;min-height:48px}.hero-cinematic .hero-footer{flex-direction:column;gap:15px;margin-top:35px;align-items:center}.hero-stat{font-size:12px}.stat-symbol{font-size:19px}.hero-cinematic .hero-footer>div{display:flex}.nfc-demo-strip{padding:25px 22px;flex-direction:column;gap:20px}.nfc-demo-strip .action-preview strong{font-size:13px}.nfc-demo-strip .button{width:100%;max-width:360px}.hero-cinematic:after{background:linear-gradient(180deg,transparent 10%,rgb(29 29 27 / .3) 22%,var(--synkro-dark) 35%)}}
@media(prefers-reduced-motion:reduce){.hero-cinematic .entrance,.headline-reveal{animation:none!important;opacity:1;transform:none}.hero-copy .button:after,.nav-inner nav a:before{transition:none}}
@media(max-width:950px){body.menu-open{overflow:hidden}.nav-inner nav.open{bottom:0;height:calc(100dvh - 80px);justify-content:center;align-items:stretch}.menu-toggle{z-index:1}}

/* Typographic brand centerpiece. In-flow sizing keeps every viewport readable. */
.hero-cinematic{justify-content:center;padding:40px 40px 30px;gap:0}
.hero-cinematic:after{display:none}
.hero-atmosphere{background:radial-gradient(ellipse at 50% 28%,rgb(199 244 3 / .11),transparent 57%)}
.hero-identity{position:relative;width:100%;max-width:1160px;display:flex;flex-direction:column;align-items:center;text-align:center;flex-shrink:0;margin:8px 0 32px}
.hero-identity-label{font-family:var(--font-body);font-size:10px;letter-spacing:.28em;color:var(--synkro-gray);margin-bottom:24px}
.hero-brand{font-family:var(--font-display);font-size:clamp(70px,12.2vw,166px);font-weight:400;letter-spacing:-.065em;line-height:1.12;color:var(--synkro-light);background:linear-gradient(170deg,#fff 20%,#d9dbd4 45%,#8d9480 80%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;white-space:nowrap;padding:0 .09em .12em;filter:drop-shadow(0 12px 32px #0005)}
.brand-spark{color:var(--synkro-green);-webkit-text-fill-color:var(--synkro-green)}
.hero-signal{display:flex;align-items:center;justify-content:center;width:60%;gap:18px;margin:10px 0 0}
.hero-signal span{height:1px;flex:1;background:linear-gradient(90deg,transparent,#c7f40399)}
.hero-signal span:last-child{transform:rotate(180deg)}
.hero-signal i{width:7px;height:7px;border-radius:50%;background:var(--synkro-green);box-shadow:0 0 25px 6px #c7f40333}
.hero-cinematic .hero-copy{margin-top:0}
.hero-cinematic h1{font-size:clamp(1.8rem,3.2vw,3.25rem)}
.hero-cinematic .hero-footer{margin-top:44px}
@media(min-width:1600px){.hero-cinematic{padding:50px 50px 36px}.hero-identity{margin-bottom:44px}.hero-cinematic .hero-footer{margin-top:60px}}
@media(min-width:951px) and (max-height:850px){.hero-cinematic{padding-top:24px}.hero-identity{margin:0 0 22px}.hero-brand{font-size:clamp(70px,10vw,140px)}.hero-identity-label{margin-bottom:14px}.hero-cinematic h1{font-size:2.35rem}.hero-cinematic .hero-footer{margin-top:30px}}
@media(max-width:950px){.hero-cinematic{padding:42px 24px 30px}.hero-identity{margin:10px 0 32px}.hero-brand{font-size:12vw}.hero-identity-label{font-size:9px;letter-spacing:.2em}.hero-cinematic h1{font-size:clamp(1.8rem,4.6vw,2.8rem)}}
@media(max-width:560px){.hero-cinematic{padding:36px 20px 28px}.hero-identity{margin:8px 0 32px}.hero-brand{font-size:12.4vw}.hero-identity-label{font-size:7px;letter-spacing:.12em;margin-bottom:22px}.hero-signal{width:75%;margin-top:14px}.hero-cinematic h1{font-size:clamp(1.4rem,6.2vw,2.1rem)}.hero-cinematic .hero-footer{margin-top:30px}}

/* Keep supporting copy readable on compact screens. */
.hero-identity-label{font-size:12px;letter-spacing:.15em}
@media(max-width:560px){.hero-identity-label{max-width:280px;font-size:12px;letter-spacing:.08em;line-height:1.6}.hero-cinematic .hero-badge{font-size:11px;letter-spacing:.03em}.hero-cinematic .hero-description{font-size:16px}}