/* Y2IT Premium — additive, independent of the original application. */
:root{--premium-blue:#75baff;--premium-silver:#e5edf7;--muted:#bdcadb;--line:rgba(181,204,232,.2);color-scheme:dark}
body{background:#091321;color:#e5edf7;font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
.navbar{background:rgba(9,19,33,.94);border-bottom:1px solid #b5cce82b;box-shadow:0 8px 32px #0002}
.navbar .nav-menu a{color:#d5e0ef}.navbar .nav-menu a:hover{color:#8ac6ff}
.hero{background:radial-gradient(ellipse at 80% 18%,#16487c66,transparent 55%),#091321;isolation:isolate}
.hero::before{opacity:.38;background-image:linear-gradient(90deg,#091321ed,#09132188),url('/assets/hero-desktop-B4GbXd5i.avif')}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:linear-gradient(110deg,transparent 58%,#a2cfff0b 58.1%,transparent 58.3%),radial-gradient(ellipse at 18% 32%,#378fff16,transparent 48%)}
.hero-inner{max-width:1400px;gap:40px;padding-top:142px;padding-bottom:64px}
.hero-copy{padding-top:24px}.hero h1{font-size:clamp(2.65rem,4.8vw,4.7rem);line-height:1.08;letter-spacing:-.055em;font-weight:750;color:#edf4ff;text-shadow:none;animation:premium-type-in .85s ease-out both}
.hero h1 span{color:#91c7ff}.hero p{color:#c6d3e4;text-shadow:none}
.hero-focus,.hardware-wide{background:linear-gradient(145deg,#172b42e8,#0c1b2ee8);border:1px solid #a4c7ec38;box-shadow:0 24px 70px #0003,inset 0 1px #ffffff0c;border-radius:22px}
.hero-focus{padding:20px}.focus-featured .focus-link{background:linear-gradient(125deg,#20538b,#122b49);border-color:#8dc8ff70}.focus-link{border-radius:12px}.focus-link:hover{background:#76baff12}
.search-input-wrap{background:#e9f0f8;border:1px solid #c6dbf1;box-shadow:0 8px 32px #0002;border-radius:13px}.search-input-wrap input{color:#10243b}
.cta,.btn,.navbar .nav-contact{background:linear-gradient(120deg,#2467bc,#17529c);border:1px solid #97c8ff55;border-radius:10px;box-shadow:inset 0 1px #ffffff20,0 6px 20px #0002;transition:transform .2s,box-shadow .2s,background .2s}
.cta-secondary{background:#17263a;border-color:#9fb7d366;color:#e5edf7}
.section-title h2,.detail-intro h1,.legal-page-container h1{letter-spacing:-.04em;color:#edf4ff}.section-title p{max-width:720px;margin-inline:auto}
section:not(.hero){border-top-color:#abc7e51c}.card,.benefit,.point-item,.timeline-item,.form,.detail-steps li{background:linear-gradient(145deg,#18293e,#101f32);border:1px solid #a4c7ec29;border-radius:18px;box-shadow:inset 0 1px #ffffff06;transition:transform .22s,border-color .22s,box-shadow .22s}
.card h3,.benefit h3{color:#e6effb}.card p,.benefit p,.point-item p,.legal-page-container p{color:#bdcadb}
.hardware-category{background:#102238;border-color:#adc9e62b;border-radius:14px}.hardware-category svg{color:#a8d6ff}.hardware-deal-link{background:#1b416b;border-color:#729fce66}
.detail-needs,.detail-example,.detail-close{background:linear-gradient(120deg,#18324f,#102238);border-color:#8ab6e14d}.detail-number{color:#9fceff}
.form input:not([type=checkbox]),.form textarea,.form select{background:#0c192b;color:#edf4ff;border:1px solid #9bb8d64d;border-radius:10px}.form input::placeholder,.form textarea::placeholder{color:#9eafc3}
footer{border-top:1px solid #abc7e526;background:#080f1b}
.premium-sound{position:relative;display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;padding:22px 20px;background:#080f1b;border-top:1px solid #abc7e526;color:#adc1d9;font-size:.8rem}
.premium-sound button{font:inherit;color:#dcecff;border:1px solid #8eb7e24d;background:#14263b;border-radius:999px;min-height:44px;padding:10px 16px;cursor:pointer}.premium-sound button:hover{background:#204365}.premium-sound button:disabled{opacity:.55;cursor:default}.premium-sound-status{min-width:120px}
:focus-visible{outline:3px solid #a6d5ff;outline-offset:4px}
@keyframes premium-type-in{from{opacity:.3;transform:translateY(12px);filter:blur(3px)}to{opacity:1;transform:none;filter:blur(0)}}
@media(hover:hover){.card:hover,.benefit:hover{transform:translateY(-4px);border-color:#94c5f66e;box-shadow:0 16px 38px #0003}.cta:hover,.btn:hover{transform:translateY(-2px);box-shadow:0 8px 28px #398bed30}.focus-link:hover .focus-arrow{color:white}}
@media(max-width:800px){.hero-inner{padding-top:116px;gap:28px;grid-template-columns:minmax(0,1fr)}.hero-copy{padding-top:0}.hero h1{font-size:clamp(2.5rem,8vw,3.8rem)}.hero-focus{padding:16px}.hero::before{background-image:linear-gradient(#091321c9,#091321ed),url('/assets/hero-mobile-C_uoXL3j.avif')}.detail-intro h1{overflow-wrap:anywhere}}
@media(max-width:440px){.hero-inner{padding-top:110px}.hero h1{font-size:2.55rem}.hardware-wide{padding:18px}.premium-sound{gap:8px}.premium-sound-status{width:100%;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.card:hover,.benefit:hover,.cta:hover,.btn:hover{transform:none}}

/* Y2IT 2026-10-22: static depth below the hero, without media or animation. */
#main-content > section{
  --section-base:#0b1728;
  --light-x:8%;
  --light-y:10%;
  background-color:var(--section-base);
  background-image:
    radial-gradient(ellipse 760px 540px at var(--light-x) var(--light-y),rgba(51,133,225,.19),transparent 75%),
    radial-gradient(ellipse 600px 440px at 95% 85%,rgba(135,174,215,.07),transparent 72%),
    linear-gradient(rgba(137,179,222,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(137,179,222,.035) 1px,transparent 1px);
  background-size:auto,auto,64px 64px,64px 64px;
  background-repeat:no-repeat,no-repeat,repeat,repeat;
  border-top:1px solid rgba(142,187,231,.14);
}
#main-content > #benefits{--section-base:#102137;--light-x:95%;--light-y:18%}
#main-content > #experience{--section-base:#0a1728;--light-x:15%;--light-y:50%}
#main-content > #about{--section-base:#102036;--light-x:90%;--light-y:30%}
#main-content > #contact{--section-base:#0c1c31;--light-x:40%;--light-y:12%}
#main-content > #faq{--section-base:#0a1626;--light-x:95%;--light-y:70%}
#main-content > section .section-title h2{text-shadow:0 2px 24px rgba(99,166,235,.12)}
@media(max-width:640px){
  #main-content > section{
    background-image:
      radial-gradient(ellipse 440px 600px at var(--light-x) var(--light-y),rgba(51,133,225,.16),transparent 75%),
      linear-gradient(rgba(137,179,222,.025) 1px,transparent 1px),
      linear-gradient(90deg,rgba(137,179,222,.025) 1px,transparent 1px);
    background-size:auto,48px 48px,48px 48px;
    background-repeat:no-repeat,repeat,repeat;
  }
}
@media(forced-colors:active){#main-content > section{background-image:none}}