/* CrystalPro Project Shield — fluid layouts and touch-friendly controls */
:root{--page-gutter:clamp(16px,3.5vw,48px)}
html{scroll-padding-top:24px;-webkit-text-size-adjust:100%}
body{min-width:280px;overflow-x:clip}
.wrap{width:100%;max-width:1280px;padding-inline:var(--page-gutter)}
.site-header{width:100%;max-width:1500px;padding-inline:var(--page-gutter)}
img,svg{max-width:100%}img{height:auto}
h1,h2,h3,p,small,strong{overflow-wrap:break-word}
.hero,.kernel-grid,.metric-grid,.feature-grid{min-width:0}
.hero-copy,.hero-art,.kernel-copy,.kernel-graphic,.demo-copy{min-width:0}
.button{min-height:44px;text-align:center}
.language-wrap{min-height:44px}
.language-wrap select{min-height:28px}
a:focus-visible,button:focus-visible,select:focus-visible{outline:3px solid #70e8ff;outline-offset:4px}
.dialog{max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain}
.dialog-box{max-width:100%}
/* Intermediate laptop and tablet layout: keep navigation usable and uncluttered. */
@media(max-width:1100px){
 .desktop-nav{display:none}
 .mobile-toggle{display:inline-flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border:1px solid var(--stroke);border-radius:11px}
 .mobile-nav:not([hidden]){display:flex;flex-wrap:wrap;gap:4px;align-items:center;padding:12px var(--page-gutter);border-bottom:1px solid var(--stroke);position:relative;z-index:8;background:#07172c}
 .mobile-nav a{min-height:44px;display:inline-flex;align-items:center;padding:10px 16px;border-radius:9px}
 .mobile-nav a:hover{background:rgba(49,157,255,.12)}
 .hero{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}
 .hero h1{font-size:clamp(40px,5vw,68px);letter-spacing:-2.5px}
 .hero-art{min-height:400px}
 .kernel-grid{gap:clamp(22px,4vw,70px)}
}
@media(min-width:701px) and (max-width:900px){
 .hero{min-height:0;padding-block:75px;gap:18px}
 .hero-art{min-height:330px}
 .hero-micro{gap:10px}
 .section{padding-block:85px}
 .metric-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 .kernel-grid{grid-template-columns:1fr}
 .kernel-graphic{min-height:350px;order:2}
 .kernel-copy{order:1}
 .demo-panel{padding:48px 40px}
 .demo-logo{width:390px;right:-175px}
}
@media(max-width:700px){
 .wrap,.site-header{padding-inline:var(--page-gutter)}
 .site-header{gap:10px;flex-wrap:nowrap}
 .header-actions{margin-left:auto;gap:6px}
 .mobile-nav:not([hidden]){padding-inline:var(--page-gutter);flex-direction:column;align-items:stretch}
 .mobile-nav a{width:100%}
 .hero{padding-top:clamp(34px,7vw,62px);padding-bottom:48px;gap:0}
 .hero h1{font-size:clamp(38px,9vw,58px);line-height:1.12;letter-spacing:-2px;margin:22px 0 18px}
 .hero-desc{line-height:1.72}
 .hero-actions{gap:10px;margin-top:24px}
 .hero-art{min-height:0;aspect-ratio:1 / .85;margin-top:18px}
 .hero-logo{width:min(90%,360px)}
 .ticker-inner{overflow-x:auto;scrollbar-width:none;justify-content:flex-start}
 .ticker-inner::-webkit-scrollbar{display:none}
 .metric-grid,.feature-grid{grid-template-columns:1fr}
 .section{padding-block:clamp(54px,9vw,76px)}
 .section-heading{margin-bottom:28px}
 .section-heading h2,.kernel-copy h2{font-size:clamp(30px,8vw,44px);letter-spacing:-1.4px}
 .kernel-graphic{min-height:280px}
 .demo-panel{padding:36px 23px;min-height:365px}
 .demo-copy h2{font-size:clamp(32px,8vw,48px)}
 .demo-logo{width:300px;right:-140px}
 .footer{align-items:flex-start;gap:18px}
 .footer-links{flex-wrap:wrap}
 .dialog{width:min(470px,calc(100vw - 24px));max-width:calc(100vw - 24px)}
 .dialog-box{padding:28px 20px}
}
@media(max-width:390px){
 .brand{gap:5px}
 .brand img{width:32px;height:32px}
 .brand strong{font-size:14px;letter-spacing:-.5px}
 .brand small{font-size:7px;letter-spacing:1.4px}
 .language-wrap{padding:5px;gap:3px}
 .language-wrap svg{display:none}
 .sign-in{font-size:12px;padding-inline:8px}
 .mobile-toggle{min-width:40px;min-height:44px}
 .hero-actions .button{width:100%}
 .hero h1{font-size:clamp(33px,10.5vw,42px)}
 .eyebrow{letter-spacing:1.2px;font-size:9px}
 .hero-micro{font-size:10px}
 .metric,.feature-card{padding:23px}
 .kernel-graphic{min-height:245px}
 .core-ring{width:205px;height:205px}.ring-two{width:245px;height:245px}
 .core-box{width:120px;height:120px}
 .footer-bottom{gap:8px}
}
@media(hover:none) and (pointer:coarse){.mobile-nav a,.footer-links a{min-height:44px}.feature-card:hover,.button:hover:not(:disabled){transform:none}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}}

/* CrystalPro OS platform showcase — additive responsive enhancements */
.os-section{padding-top:90px}.os-showcase{border:1px solid #267fc3;border-radius:23px;padding:22px;background:radial-gradient(circle at 80% 0%,rgba(48,162,248,.2),transparent 50%),#071529;box-shadow:0 25px 100px rgba(0,0,0,.25);overflow:hidden}.desktop-preview{background:#061123;border:1px solid #194d81;border-radius:14px;overflow:hidden}.preview-top{min-height:46px;display:flex;align-items:center;gap:7px;padding:0 17px;background:#10294a;border-bottom:1px solid #24517a}.preview-dot{width:8px;height:8px;border-radius:50%;background:#368dc6}.preview-dot:first-child{background:#6be2ff}.preview-title{color:#d2eaff;font:700 10px 'Space Grotesk',sans-serif;letter-spacing:1.3px;margin-left:15px}.preview-status{margin-left:auto;color:#7de5ff;font-size:10px;letter-spacing:1px}.preview-body{display:flex;min-height:370px}.preview-sidebar{width:66px;flex-shrink:0;display:flex;align-items:center;flex-direction:column;gap:25px;padding:15px 0;background:#0b1b35;border-right:1px solid #1a4672;color:#8bd6fe;font-size:22px}.preview-sidebar img{width:35px;height:35px;object-fit:contain}.preview-content{padding:35px;flex:1;background:radial-gradient(ellipse at 85% 25%,#143a62 0%,#07152a 60%)}.preview-eyebrow{font-size:10px;letter-spacing:2px;color:#66c9f6}.preview-welcome{font:700 clamp(22px,3vw,39px)/1.2 'Space Grotesk',sans-serif;margin:13px 0 30px}.preview-tiles{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.preview-tiles>div{border:1px solid #2a5986;background:linear-gradient(155deg,#183d64,#0a203d);border-radius:11px;min-height:110px;padding:17px;display:flex;flex-direction:column}.preview-tiles span{font-size:24px;color:#68deff}.preview-tiles strong{font-size:13px;margin-top:7px}.preview-tiles small{font-size:8px;letter-spacing:1px;color:#80b4db;margin-top:4px}.preview-terminal{display:flex;flex-direction:column;gap:9px;margin-top:18px;background:#030b17;border:1px solid #224268;border-radius:9px;padding:16px;color:#9cb9d5;font:12px/1.5 ui-monospace,monospace;overflow:auto}.terminal-header{color:#63caee;font-size:10px;letter-spacing:1px;margin-bottom:4px}.terminal-header em{color:#7e95ae}.terminal-green{color:#7de9cd}.cursor{color:#62dafa}.preview-footnote{color:#9ab7cf;font-size:11px;margin:12px 3px 0}.os-highlights{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:25px}.os-highlights>div{border-left:2px solid #298dde;padding:10px 22px}.os-highlights span{display:block;color:#63d2fb;font:10px 'Space Grotesk';letter-spacing:2px;margin-bottom:10px}.os-highlights strong{font:700 19px 'Space Grotesk'}.os-highlights p{font-size:13px;line-height:1.8;color:var(--muted)}.capability-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px}.cap-card{border:1px solid var(--stroke);background:linear-gradient(140deg,#10294a,#07182d);border-radius:15px;padding:22px;min-width:0;transition:transform .2s,border-color .2s}.cap-card:hover{border-color:#45bded;transform:translateY(-3px)}.cap-header{display:flex;align-items:start;justify-content:space-between;gap:8px}.cap-icon{font-size:28px;color:#6cdcff}.cap-code{font:9px 'Space Grotesk';letter-spacing:1px;text-align:right;color:#69b9e8;overflow-wrap:anywhere}.cap-card h3{font:700 17px/1.3 'Space Grotesk';margin:22px 0 10px}.cap-card p{font:13px/1.75 inherit;color:var(--muted);line-height:1.75;margin:0}.roadmap-note{display:flex;gap:13px;align-items:start;border:1px solid #245b83;background:#10253b;border-radius:12px;padding:15px 20px;margin-top:25px}.roadmap-note p{margin:0;font-size:12px;color:#b0cde4;line-height:1.7}.roadmap-note .pulse{flex-shrink:0;margin-top:7px}.sign-in{max-width:235px;line-height:1.2;white-space:normal;text-align:center}#loginForm button{opacity:1;cursor:pointer}#loginForm button:hover{filter:brightness(1.07)}
@media(max-width:1100px){.capability-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.desktop-nav{gap:12px}.desktop-nav a{font-size:12px}.sign-in{max-width:195px;font-size:11px}}
@media(max-width:900px){.capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.desktop-nav{display:none}.mobile-toggle{display:block;color:#d1efff;background:none;border:0;font-size:24px}.mobile-nav:not([hidden]){display:flex;flex-direction:column;padding:12px var(--page-gutter,24px);background:#07172c}.mobile-nav a{padding:10px}}
@media(max-width:700px){.os-section{padding-top:60px}.os-showcase{padding:9px;border-radius:14px}.preview-top{padding:0 10px}.preview-title{font-size:8px;letter-spacing:.4px;margin-left:4px}.preview-status{font-size:8px}.preview-sidebar{width:40px;gap:17px;font-size:18px}.preview-sidebar img{width:27px;height:27px}.preview-content{padding:20px 13px}.preview-body{min-height:320px}.preview-tiles{grid-template-columns:1fr;gap:7px}.preview-tiles>div{min-height:0;padding:9px 12px;flex-direction:row;align-items:center;gap:9px;flex-wrap:wrap}.preview-tiles span{font-size:17px}.preview-tiles strong{margin:0;font-size:12px}.preview-tiles small{width:100%;margin:0 0 0 26px}.preview-welcome{margin:12px 0 18px}.preview-terminal{padding:10px;font-size:10px}.os-highlights{grid-template-columns:1fr}.capability-grid{grid-template-columns:1fr}.cap-card{padding:22px}.sign-in{max-width:145px;font-size:10px;padding:8px}.header-actions{gap:6px}}
@media(max-width:380px){.preview-status{display:none}.preview-title{font-size:7px}.sign-in{max-width:118px;font-size:9px;padding:6px}}