/* Shared presentation layer. Connector diagrams and documentation keep their layouts. */
:root {
    --surface: #0c0e0f;
    --raised: #141819;
    --ink: #eff2f0;
    --muted: #adb7b4;
    --line: #2b3432;
    --mint: #a5dac8;
    --paper: #edf0ed;
    --ease: cubic-bezier(.22, 1, .36, 1);
}
html { scroll-padding-top: 96px; }
body.site-home, body.site-inner {
    background: var(--surface); color: var(--ink);
    font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
    -webkit-font-smoothing: antialiased;
}
:is(.site-home, .site-inner) :is(h1, h2, h3, .brand, .eyebrow, .pill, .product-label, .product-status) { letter-spacing: 0; }
:is(.site-home, .site-inner) :focus-visible { outline: 2px solid var(--mint); outline-offset: 5px; }
:is(.site-home, .site-inner) ::selection { color: #0c0e0f; background: var(--mint); }
:is(.site-home, .site-inner) > header { background: #0c0e0fe6; border-color: #29312e; transition: background .3s, box-shadow .3s; z-index: 50; }
:is(.site-home, .site-inner) > header.is-scrolled { background: #0c0e0ff5; box-shadow: 0 8px 32px #0002; }
:is(.site-home, .site-inner) .brand-logo { border-radius: 6px; }
:is(.site-home, .site-inner) .brand { font-size: 19px; }
:is(.site-home, .site-inner) :is(.brand-accent, .back-link, .text-link) { color: #67c1d5; }
.site-home .container { width: min(1240px, calc(100% - 96px)); }
.site-home header nav { gap: 28px; height: 80px; }
.site-home .nav-links { gap: 22px; font-size: 13px; align-items: center; }
.site-home .nav-links a { position: relative; padding: 12px 0; transition: color .2s; }
.site-home .nav-links a::after { content: ""; position: absolute; inset: auto 0 4px; height: 1px; background: var(--mint); transform: scaleX(0); transform-origin: left; transition: transform .35s var(--ease); }
.site-home .nav-links a:hover, .site-home .nav-links a[aria-current="location"] { color: var(--ink); }
.site-home .nav-links a:hover::after, .site-home .nav-links a[aria-current="location"]::after { transform: scaleX(1); }
.site-home .language-menu { height: 80px; }
.site-home .language-options { border-radius: 6px; border-color: var(--line); background: var(--raised); }
.site-home .mobile-menu { display: none; }
.scroll-progress { position: fixed; top: 0; left: 0; width: 100%; height: 2px; background: var(--mint); transform: scaleX(0); transform-origin: left; z-index: 100; pointer-events: none; }
.motion-control { position: fixed; right: 22px; bottom: 18px; z-index: 60; display: flex; align-items: center; gap: 9px; padding: 9px 12px; border: 1px solid #46514b; border-radius: 5px; color: #e8efea; background: #141a17f5; font-size: 12px; cursor: pointer; box-shadow: 0 4px 20px #0002; }
.motion-control input { appearance: none; width: 28px; height: 16px; margin: 0; border-radius: 12px; background: #545e59; cursor: pointer; position: relative; }
.motion-control input::before { content: ""; position: absolute; width: 10px; height: 10px; top: 3px; left: 3px; border-radius: 50%; background: #eef3f0; transition: transform .2s; }
.motion-control input:checked { background: #51846f; }
.motion-control input:checked::before { transform: translateX(12px); }
.motion-control input:disabled { opacity: .55; cursor: default; }
.site-home .hero { position: relative; isolation: isolate; overflow: hidden; display: flex; align-items: center; min-height: min(710px, calc(100svh - 158px)); padding: 58px 0 136px; background: #101514; border: 0; }
.site-home .hero::before { content: ""; position: absolute; top: 36px; bottom: 122px; left: calc(50% + 24px); border-left: 1px solid #a5dac817; z-index: -1; }
.hero-scene { position: absolute; inset: 0; z-index: -1; pointer-events: none; }
.hero-board { position: absolute; width: min(37%, 460px); height: auto; aspect-ratio: 1; object-fit: contain; right: max(5%, calc((100% - 1240px) / 2)); top: 64px; transform: translate(var(--board-x, 0px), var(--board-y, 0px)) rotate(-12deg); filter: drop-shadow(0 24px 24px #0006); }
.hero-caption { position: absolute; right: max(5%, calc((100% - 1240px) / 2)); bottom: 125px; color: #bac8bf; font: 12px/1.6 Consolas, monospace; }
.hero-caption span { display: block; color: var(--mint); margin-bottom: 4px; }
.site-home .hero-content { position: relative; max-width: 570px; }
.site-home .eyebrow { color: var(--mint); font-size: 12px; font-weight: 600; margin-bottom: 24px; }
.site-home .hero h1 { font-size: 80px; line-height: 1.04; font-weight: 550; }
.site-home .hero h1 span { display: block; color: var(--mint); }
.site-home .hero .hero-tagline { font-size: 22px; color: var(--ink); margin: 24px 0 12px; }
.site-home .hero .hero-description { max-width: 460px; margin: 0 0 28px; font-size: 16px; line-height: 1.8; color: #a9b6af; }
.site-home .buttons { gap: 12px; }
.site-home .button { font-size: 14px; font-weight: 600; min-height: 46px; border-radius: 3px; border: 1px solid #57695f; padding: 10px 22px; transition: background .2s, transform .3s var(--ease), border-color .2s; }
.site-home .button-primary { color: #10231b; background: var(--mint); border-color: var(--mint); }
.site-home .button:hover { transform: translateY(-2px); background: #20372d; }
.site-home .button-primary:hover { background: #c9f1e1; }
.hero-bottom { position: absolute; bottom: 0; left: 0; width: 100%; border-top: 1px solid #a5dac829; }
.hero-bottom .container { display: flex; min-height: 86px; align-items: center; justify-content: space-between; gap: 24px; }
.hero-release { display: flex; align-items: center; gap: 20px; font-size: 13px; }
.hero-release strong { font-size: 15px; font-weight: 600; }
.hero-release span { color: #b2c3b8; }
.hero-release em { width: 6px; height: 6px; border-radius: 50%; background: var(--mint); flex: none; }
.hero-release:hover strong { color: var(--mint); }
.hero-index { font: 12px/1.5 Consolas, monospace; color: #94a59a; }
.site-home main > section:not(.hero) { padding: 100px 0; border-color: var(--line); }
.site-home h2 { font-size: 40px; font-weight: 550; line-height: 1.3; margin: 0 0 24px; }
.site-home .section-intro { font-size: 17px; line-height: 1.9; color: var(--muted); max-width: 770px; }
.section-kicker { display: block; color: #88bca6; font: 12px/1.4 Consolas, monospace; margin-bottom: 16px; }
.site-home main > #about { background: var(--paper); color: #142019; padding-top: 64px; }
.site-home #about .container { display: grid; grid-template-columns: .8fr 1.2fr; gap: 24px 88px; align-items: start; }
.site-home #about h2 { grid-column: 1; grid-row: 1; max-width: 340px; }
.site-home #about .section-intro { grid-column: 2; margin: 0; color: #4e5c55; }
.site-home #about .section-intro:first-of-type { grid-row: 1; }
.site-home #about .team-motto { grid-column: 1; grid-row: 2 / span 2; color: #3c6954; font-size: 24px; line-height: 1.8; border: 0; padding: 24px 0 0; margin: 0; font-weight: 450; border-top: 1px solid #b8c5bb; max-width: 340px; }
.site-home #about .section-kicker { color: #537560; }
.site-home #technology { background: #131718; }
.site-home .cards { gap: 20px; }
.site-home .card { border-radius: 5px; border-color: #323d37; background: #161a1b; padding: 28px; position: relative; min-width: 0; transition: transform .45s var(--ease), border-color .3s, background .3s; }
.site-home .card::before { content: ""; position: absolute; inset: -1px 16px auto; height: 1px; background: var(--mint); transform: scaleX(0); transform-origin: left; transition: transform .5s var(--ease); }
.site-home .card h3 { font-size: 23px; line-height: 1.4; font-weight: 550; margin-bottom: 16px; overflow-wrap: anywhere; }
.site-home .card p, .site-home .product-features { font-size: 15px; line-height: 1.85; color: #abbab1; }
.site-home #technology .cards { gap: 0 64px; counter-reset: technology; }
.site-home #technology .card { counter-increment: technology; padding: 28px 0; border: 0; border-top: 1px solid #38473e; border-radius: 0; background: transparent; min-height: 0; }
.site-home #technology .card::before { display: none; }
.site-home #technology .card::after { content: "0" counter(technology); display: block; color: #6e8b7b; font: 12px Consolas, monospace; margin-top: 24px; }
.site-home .product-category { padding: 0; border: 0; }
.site-home .product-category + .product-category { padding-top: 48px; margin-top: 48px; border-top: 1px solid var(--line); }
.site-home .product-category-index { font-size: 18px; font-weight: 400; line-height: 36px; color: var(--mint); font-family: Consolas, monospace; }
.site-home .product-category-header { max-width: 870px; grid-template-columns: 42px minmax(0, 1fr); gap: 14px; }
.site-home .product-category-header h3 { font-size: 26px; font-weight: 500; }
.site-home .product-category-header p { color: #92a198; font-size: 14px; line-height: 1.8; }
.site-home .product-meta { gap: 6px; }
.site-home .product-label, .site-home .product-status { border-radius: 3px; min-height: 24px; font-size: 11px; padding: 3px 7px; }
.site-home .product-label { color: #bbdaca; background: #25372d; }
.site-home .product-status { border-color: #45564b; color: #b8c4bc; }
.site-home .product-link { font-size: 14px; color: var(--mint); text-underline-offset: 6px; }
.site-home .product-link:hover { text-decoration: underline; }
.site-home .product-image { margin: 0; border: 0; border-radius: 0; background: transparent; }
.site-home .product-image img { background: transparent; transition: transform .6s var(--ease); }
.site-home .product-image figcaption { font-size: 11px; font-weight: 400; color: #92a699; padding: 8px 0; }
.site-home .product-images-wide .product-image img { background: #fff; border-radius: 3px; }
.site-home .product-specs { border-top: 1px solid var(--line); padding-top: 14px; margin-top: 22px; }
.site-home .product-specs summary { color: var(--mint); cursor: pointer; font-size: 14px; min-height: 32px; }
.site-home #flight-cases { background: #171d20; }
.site-home .flight-case-media { border-radius: 4px; border-color: #4d6155; }
.site-home .flight-case-media video { object-fit: contain; background: #0c0e0f; }
.site-home .flight-case-copy h3 { font-size: 28px; font-weight: 500; line-height: 1.5; }
.site-home .flight-case-copy p { color: #aebdb2; font-size: 15px; line-height: 1.9; }
.site-home #roadmap .cards { gap: 0 48px; }
.site-home #roadmap .card { padding: 28px 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: transparent; }
.site-home #roadmap .card::before { display: none; }
.site-home #partners { background: var(--paper); color: #192820; }
.site-home #partners .section-intro { color: #526158; }
.site-home #partners .section-kicker { color: #537560; }
.site-home .partners-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; }
.site-home .partner-card { border: 0; border-radius: 0; background: #fff; min-height: 170px; padding: 28px; }
.site-home .partner-card-featured { background: transparent; border-top: 1px solid #b9c6bc; border-bottom: 1px solid #b9c6bc; padding: 40px 0; margin-bottom: 8px; }
.site-home .partner-card-featured .partner-logo { max-height: 130px; }
.site-home .partner-kicker { color: #427358; }
.site-home #contact h2 { font-size: 56px; }
.site-home #contact .container { display: grid; grid-template-columns: 1fr 1fr; gap: 48px; }
.site-home #contact .section-intro { margin: 0; font-size: 18px; }
.site-home #contact a { color: var(--mint); text-underline-offset: 5px; overflow-wrap: anywhere; }
.site-home #contact a:hover { text-decoration: underline; }
:is(.site-home, .site-inner) footer { border-color: var(--line); color: #8f9e93; font-size: 13px; padding-bottom: 80px; }
.site-inner h1 { font-size: 64px; line-height: 1.12; overflow-wrap: anywhere; }
.site-inner h2 { font-size: 32px; line-height: 1.4; }
.site-inner .eyebrow { font-size: 12px; color: var(--mint); }
.site-inner :is(.button-primary, .purchase-link) { background: var(--mint); color: #10231b; }
.site-inner :is(.button-primary, .purchase-link):hover { background: #c9f1e1; }
.site-inner :is(.hero-visual, .photo-grid figure, .dimension-figure) { border-radius: 4px; }
.site-inner .pill-primary { background: #21362b; color: var(--mint); }
.site-inner .hero { background: transparent; }
@media (min-width: 1024px) {
    :is(.site-home, .site-inner) .brand { font-size: 21px; }
    .site-home .nav-links { font-size: 16px; gap: 18px; }
    .site-home .hero .hero-description { font-size: 18px; }
    .site-home .section-intro { font-size: 18px; }
    .site-home .card p, .site-home .product-features, .site-home .flight-case-copy p { font-size: 17px; }
    .site-home .product-category-header p { font-size: 16px; }
    .site-home .button, .site-home .product-link, .site-home .product-specs summary { font-size: 16px; }
    .site-home .product-label, .site-home .product-status, .site-home .product-image figcaption { font-size: 13px; }
    .site-home .partner-copy p { font-size: 17px; }
    :is(.site-home, .site-inner) .eyebrow, .section-kicker, .hero-caption, .hero-index { font-size: 14px; }
    .hero-release { font-size: 16px; }
    .hero-release strong { font-size: 17px; }
    .site-inner .pill { font-size: 13px; }
    .site-inner .back-link, .site-inner .detail span, .site-inner .note, .site-inner .case-summary > p { font-size: 17px; }
    :is(.site-home, .site-inner) footer { font-size: 15px; }
    .motion-control { font-size: 14px; }
}
@media (hover: hover) and (pointer: fine) {
    body:not(.motion-disabled).site-home #products .card:hover { transform: translateY(-5px); border-color: #83b69c; background: #19221c; }
    .site-home #products .card:hover::before { transform: scaleX(1); }
    body:not(.motion-disabled).site-home #products .card:hover .product-image img { transform: scale(1.035); }
}
@media (min-width: 1600px) {
    .site-home .hero { min-height: min(770px, calc(100svh - 158px)); }
    .hero-board { width: 500px; top: 64px; }
}
@media (max-width: 1150px) {
    .site-home .container { width: calc(100% - 64px); }
    .site-home .nav-links { display: none; }
    .site-home .nav-actions { gap: 24px; }
    .site-home .mobile-menu { display: block; }
    .mobile-menu summary { cursor: pointer; display: flex; align-items: center; gap: 12px; min-height: 44px; font-size: 13px; list-style: none; }
    .mobile-menu summary::-webkit-details-marker { display: none; }
    .mobile-menu[open] .chevron { transform: rotate(225deg); }
    .mobile-menu .mobile-nav { position: absolute; top: 100%; left: 0; right: 0; padding: 12px 32px 24px; background: #141b17; border-bottom: 1px solid #45574b; max-height: calc(100dvh - 80px); overflow-y: auto; box-shadow: 0 18px 24px #0004; }
    .mobile-nav a { display: block; padding: 14px 0; border-bottom: 1px solid #334639; font-size: 17px; }
    .mobile-nav a:hover { color: var(--mint); }
    .site-home .hero h1 { font-size: 66px; }
    .site-home .hero-content { max-width: 48%; }
    .site-home .hero .hero-tagline { font-size: 20px; }
    .hero-board { width: 41%; top: 64px; right: 5%; }
    .site-home .hero { padding-top: 44px; padding-bottom: 132px; }
    .site-home #about .container { gap: 24px 40px; }
    .site-home .cards { gap: 14px; }
    .site-home .card { padding: 22px; }
}
@media (min-width: 1024px) and (max-height: 820px) {
    .site-home .hero { padding: 32px 0 112px; }
    .hero-board { width: min(34%, 370px); top: 44px; }
    .hero-caption { bottom: 96px; }
}
@media (max-width: 800px) {
    .site-home .container { width: calc(100% - 40px); }
    .site-home header nav, .site-home .language-menu { height: 68px; }
    .site-home header nav { gap: 12px; }
    .site-home .brand { font-size: 16px; gap: 8px; }
    .site-home .brand-logo { width: 32px; height: 32px; }
    .site-home .nav-actions { gap: 20px; }
    .mobile-menu .mobile-nav { padding: 12px 20px 24px; }
    .site-home .hero { min-height: 600px; padding: 40px 0 136px; }
    .site-home .hero h1 { font-size: 52px; }
    .site-home .hero-content { max-width: 52%; }
    .site-home .hero .hero-tagline { font-size: 18px; }
    .site-home .hero .hero-description { font-size: 15px; }
    .hero-board { width: 40%; top: 95px; right: 3%; }
    .hero-caption { right: 24px; bottom: 130px; }
    .site-home .cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .site-home #about .container { display: block; }
    .site-home #about h2, .site-home #about .team-motto { max-width: none; }
    .site-home #about .team-motto { margin: 28px 0; }
    .site-home #about .section-intro { margin-top: 24px; }
    .site-home main > section:not(.hero) { padding: 64px 0; }
    .site-home h2 { font-size: 32px; }
    .site-home .partner-card-featured { grid-template-columns: 1fr; gap: 28px; }
    .site-home .partners-grid { grid-template-columns: 1fr; }
    .site-home .partner-card { min-height: 140px; }
    .site-home .partner-card-featured .partner-logo { max-width: 420px; }
    .site-home .flight-case-preview { grid-template-columns: 1fr; gap: 24px; }
    .site-home #contact .container { display: block; }
    .site-home #contact h2 { font-size: 40px; }
    .site-inner h1 { font-size: 44px; }
    .site-inner h2 { font-size: 28px; }
    .site-inner .brand { font-size: 16px; }
    .motion-control { right: 14px; bottom: 12px; }
}
@media (max-width: 540px) {
    .site-home .brand { font-size: 15px; }
    .site-home .nav-actions { gap: 14px; }
    .site-home .language-icon { width: 20px; height: 20px; }
    .site-home .language-menu summary { gap: 6px; }
    .site-home .hero { min-height: 620px; display: block; padding: 32px 0 284px; }
    .site-home .hero-content { max-width: 100%; }
    .site-home .hero h1 { font-size: 48px; }
    .site-home .hero .eyebrow { margin-bottom: 18px; }
    .site-home .hero .hero-tagline { margin-top: 18px; margin-bottom: 8px; }
    .site-home .hero .hero-description { font-size: 14px; max-width: 340px; line-height: 1.8; margin-bottom: 20px; }
    .site-home .button { padding: 9px 16px; min-height: 44px; font-size: 13px; }
    .hero-board { width: 158px; top: auto; bottom: 92px; right: 32px; }
    .hero-caption { right: auto; left: 20px; bottom: 120px; font-size: 10px; max-width: 125px; }
    .hero-caption span { font-size: 11px; }
    .site-home .hero::before { top: auto; bottom: 112px; left: 20px; height: 52px; }
    .hero-bottom .container { min-height: 64px; }
    .hero-release { gap: 10px; font-size: 11px; }
    .hero-release strong { font-size: 13px; }
    .hero-index { display: none; }
    .site-home .cards { grid-template-columns: 1fr; }
    .site-home .section-intro { font-size: 16px; }
    .site-home .card { padding: 24px; }
    .site-home .product-category-header h3 { font-size: 23px; }
    .site-home .product-category-header { grid-template-columns: 30px minmax(0, 1fr); gap: 10px; }
    .site-home .product-category-index { font-size: 16px; line-height: 31px; }
    .site-home #contact .section-intro { font-size: 16px; }
}
@media (max-width: 370px) {
    .site-home .brand { font-size: 13px; gap: 6px; }
    .site-home .brand-logo { width: 28px; height: 28px; }
    .site-home .nav-actions { gap: 10px; }
    .site-home .hero h1 { font-size: 42px; }
    .site-home .hero { padding-bottom: 260px; }
    .hero-board { width: 138px; right: 22px; bottom: 90px; }
    .hero-caption { max-width: 112px; }
}
body.motion-disabled *, body.motion-disabled *::before, body.motion-disabled *::after { transition-duration: 0s !important; animation: none !important; }
body.motion-disabled .button:hover { transform: none; }
@media (max-height: 650px) and (min-width: 541px) {
    .site-home .hero { min-height: 0; padding: 24px 0 108px; }
    .site-home .hero h1 { font-size: 48px; }
    .site-home .hero .eyebrow { margin-bottom: 14px; }
    .site-home .hero .hero-tagline { font-size: 18px; margin: 14px 0 8px; }
    .site-home .hero .hero-description { font-size: 14px; line-height: 1.65; margin-bottom: 16px; }
    .hero-board { width: min(30%, 240px); top: 32px; }
    .hero-caption { bottom: 106px; font-size: 10px; }
    .site-home main > #about { padding-top: 32px; }
}
@media (max-height: 740px) and (max-width: 540px) {
    .site-home .hero { min-height: 0; padding: 22px 0 184px; }
    .site-home .hero h1 { font-size: 38px; }
    .site-home .hero .eyebrow { margin-bottom: 12px; }
    .site-home .hero .hero-tagline { font-size: 16px; margin: 12px 0 8px; }
    .site-home .hero .hero-description { font-size: 13px; line-height: 1.6; margin-bottom: 14px; }
    .hero-board { width: 96px; bottom: 78px; }
    .hero-caption { bottom: 94px; }
    .site-home main > #about { padding-top: 32px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto !important; }
    *, *::before, *::after { transition-duration: 0s !important; animation: none !important; }
}
@media (max-width: 370px) and (max-height: 650px) {
    .site-home header nav, .site-home .language-menu { height: 60px; }
    .site-home .hero { padding: 18px 0 180px; }
    .site-home .hero h1 { font-size: 34px; }
    .site-home .hero .eyebrow { margin-bottom: 8px; }
    .site-home .hero .hero-tagline { margin-top: 10px; }
    .site-home .hero .hero-description { margin-bottom: 12px; }
    .hero-board { width: 84px; bottom: 78px; }
    .site-home main > #about { padding-top: 24px; }
}
@media print {
    .scroll-progress, .motion-control, .mobile-menu { display: none !important; }
    .hero-board { transform: none; }
}
