:root { color-scheme: dark; --navy:#041523; --navy-2:#08263d; --navy-3:#0e3451; --paper:#f4f7f5; --paper-2:#e8efec; --text:#eef5f3; --muted:#95aabd; --ink:#071827; --green:#46e47b; --mint:#66dfbd; --cyan:#25cfe8; --amber:#ffb525; --line:rgba(157,200,222,.2); --serif:Georgia,"Times New Roman",serif; --sans:"Aptos","Segoe UI Variable","Segoe UI",Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; overflow-x:hidden; background:var(--navy); color:var(--text); font-family:var(--sans); font-size:16px; line-height:1.55; }
a { color:inherit; text-decoration:none; }
button { font:inherit; }
img { display:block; max-width:100%; }
.skip-link { position:fixed; z-index:100; left:1rem; top:-5rem; padding:.8rem 1rem; border-radius:.5rem; background:var(--paper); color:var(--ink); }
.skip-link:focus { top:1rem; }

.site-header { position:fixed; z-index:50; top:.85rem; left:50%; width:min(94vw,1240px); min-height:58px; padding:.5rem .65rem; display:flex; align-items:center; justify-content:space-between; gap:1.4rem; transform:translateX(-50%); border:1px solid rgba(255,255,255,.14); border-radius:1rem; background:rgba(4,21,35,.82); box-shadow:0 18px 60px rgba(0,0,0,.22); backdrop-filter:blur(18px) saturate(130%); }
.company-brand { display:inline-flex; align-items:center; gap:.68rem; color:var(--paper); }
.company-brand>span:last-child { display:flex; flex-direction:column; align-items:flex-start; gap:.02rem; line-height:1; }
.company-brand strong { font-size:1rem; letter-spacing:-.025em; }
.company-brand small { color:var(--mint); font-size:.5rem; font-weight:750; letter-spacing:.11em; }
.brand-icon { width:38px; height:38px; flex:none; border:1px solid rgba(102,223,189,.45); border-radius:.62rem; object-fit:cover; box-shadow:0 0 18px rgba(37,207,232,.12); }
.desktop-nav { display:flex; gap:clamp(1rem,2vw,2rem); color:#bac9d3; font-size:.84rem; }
.desktop-nav a,.header-contact { transition:color .2s ease,border-color .2s ease,background .2s ease; }
.desktop-nav a:hover,.desktop-nav a:focus-visible,.header-contact:hover,.header-contact:focus-visible { color:var(--mint); }
.header-actions { display:flex; align-items:center; gap:.55rem; }
.language-switch { display:flex; align-items:center; gap:.3rem; padding:.6rem; border:0; border-radius:.5rem; color:#72899b; background:none; cursor:pointer; }
.language-option.is-active { color:var(--paper); }
.header-contact { padding:.62rem .9rem; border:1px solid var(--line); border-radius:.62rem; font-size:.84rem; }
.language-switch:focus-visible,a:focus-visible { outline:2px solid var(--amber); outline-offset:3px; }

.company-hero { min-height:100svh; display:grid; grid-template-columns:minmax(380px,.82fr) minmax(500px,1.18fr); align-items:center; gap:clamp(2.5rem,5vw,6rem); padding:8.5rem max(3vw,1.2rem) 4.5rem; background:radial-gradient(circle at 18% 26%,rgba(37,207,232,.11),transparent 28%),linear-gradient(135deg,#041523,#071d31 68%,#041523); }
.company-copy { position:relative; z-index:2; max-width:680px; }
.eyebrow { display:flex; align-items:center; gap:.7rem; margin:0 0 1.7rem; color:#bdd0dc; font-size:.74rem; font-weight:750; letter-spacing:.13em; }
.pulse { width:.52rem; height:.52rem; flex:none; border-radius:50%; background:var(--green); box-shadow:0 0 0 .28rem rgba(70,228,123,.11); }
h1,h2 { margin:0; font-weight:430; line-height:.98; letter-spacing:-.055em; text-wrap:balance; }
h1 { font-size:clamp(3.35rem,6.1vw,6.5rem); }
h1 em,h2 em { color:var(--mint); font-family:var(--serif); font-weight:400; }
.hero-intro { max-width:590px; margin:1.9rem 0 0; color:#b1c4d1; font-size:clamp(1.05rem,1.35vw,1.25rem); }
.hero-actions { display:flex; flex-wrap:wrap; gap:.75rem; margin-top:2rem; }
.button { min-height:50px; padding:.82rem 1.1rem; display:inline-flex; align-items:center; justify-content:center; gap:1.5rem; border-radius:.68rem; font-weight:700; transition:transform .2s ease; }
.button:hover { transform:translateY(-2px); }
.button-primary { background:var(--green); color:#032014; }
.button-secondary { border:1px solid var(--line); color:#d2dee5; }
.company-statement { max-width:560px; margin:2.7rem 0 0; padding-top:1.4rem; border-top:1px solid var(--line); color:#8298a8; font-size:.88rem; }
.company-statement strong { color:var(--paper); }
.vision-figure { position:relative; margin:0; overflow:hidden; border:1px solid rgba(154,205,225,.2); border-radius:1.4rem; background:#061a2c; box-shadow:0 35px 90px rgba(0,0,0,.38); }
.vision-figure img { width:100%; min-height:560px; object-fit:cover; object-position:center; }
.vision-figure figcaption { position:absolute; left:1rem; right:auto; bottom:1rem; width:calc(50% - 1.5rem); display:grid; grid-template-columns:auto minmax(0,1fr); align-items:center; gap:.75rem; padding:.75rem .9rem; border:1px solid rgba(255,255,255,.16); border-radius:.7rem; background:rgba(3,16,27,.8); color:#b8cad5; font-size:.72rem; backdrop-filter:blur(12px); }
.vision-tag { flex:none; padding:.32rem .48rem; border:1px solid rgba(255,181,37,.52); border-radius:99px; color:var(--amber); font-size:.63rem; font-weight:750; letter-spacing:.09em; }
.vision-copy { line-height:1.45; }

.product-intro,.objective,.capabilities,.packages,.responsibility,.contact-section { padding:clamp(5rem,8vw,8rem) max(4vw,1.2rem); }
.product-intro { color:var(--ink); background:var(--paper); }
.section-index { margin:0; color:#60798b; font-size:.7rem; font-weight:760; letter-spacing:.14em; }
.section-heading { display:grid; grid-template-columns:.38fr 1.62fr; gap:2.5rem; }
.section-heading h2,.objective h2,.contact-section h2 { font-size:clamp(2.7rem,5.2vw,5.6rem); }
.product-intro h2 { max-width:1040px; }
.product-intro h2 em { color:#08799a; }
.byline { margin:0 0 1.2rem; color:#12836e; font-size:.72rem; font-weight:760; letter-spacing:.12em; }
.product-layout { margin-top:clamp(3.5rem,6vw,6rem); display:grid; grid-template-columns:.55fr 1.45fr; align-items:center; gap:clamp(2rem,5vw,6rem); }
.lead { margin:0; font-size:clamp(1.08rem,1.5vw,1.35rem); line-height:1.6; }
.product-copy .lead { color:#344b5b; }
.product-facts { margin-top:2rem; border-top:1px solid rgba(7,24,39,.16); }
.product-facts span { display:block; padding:.9rem 0; border-bottom:1px solid rgba(7,24,39,.16); color:#526978; font-size:.9rem; }
.product-facts span::before { content:"↳"; margin-right:.7rem; color:#0a8b74; }
.screen-stage { position:relative; min-height:650px; display:flex; align-items:flex-end; justify-content:center; }
.screen { position:absolute; bottom:0; width:min(31%,285px); margin:0; filter:drop-shadow(0 28px 30px rgba(4,21,35,.2)); }
.screen img { width:100%; }
.screen-main { z-index:3; width:min(35%,320px); left:50%; transform:translateX(-50%); }
.screen-map { z-index:1; left:9%; transform:translateY(5%) rotate(-4deg); opacity:.88; }
.screen-profile { z-index:2; right:9%; transform:translateY(5%) rotate(4deg); opacity:.88; }
.reality-note { margin:2.2rem 0 0 auto; max-width:820px; display:flex; gap:.6rem; color:#5e7483; font-size:.78rem; }
.reality-note>span:first-child { color:var(--amber); }

.objective { background:var(--navy); }
.objective-grid { margin-top:2.8rem; display:grid; grid-template-columns:1.05fr .95fr; gap:clamp(3rem,7vw,8rem); align-items:end; }
.objective-grid h2 { max-width:770px; }
.objective-grid .lead { color:#9fb3c1; }
.logic-flow { margin-top:2.4rem; display:grid; grid-template-columns:1fr auto 1fr auto 1fr auto 1fr; align-items:center; gap:.7rem; }
.logic-flow>span { color:#4f687a; }
.logic-flow div { min-height:86px; padding:.8rem; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--line); border-radius:.7rem; }
.logic-flow small { color:#688194; font-size:.6rem; letter-spacing:.1em; }
.logic-flow strong { font-size:.82rem; }
.logic-flow .logic-result { border-color:rgba(70,228,123,.5); background:rgba(70,228,123,.08); color:var(--green); }

.capabilities { color:var(--ink); background:var(--paper-2); }
.capabilities-heading h2 em { color:#08799a; }
.capability-grid { margin-top:clamp(3.5rem,6vw,6rem); display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.capability-card { min-height:620px; display:grid; grid-template-columns:1fr minmax(210px,.62fr); align-items:end; gap:1.2rem; overflow:hidden; border:1px solid rgba(7,24,39,.12); border-radius:1rem; background:#f8faf9; }
.card-copy { align-self:stretch; padding:2rem; display:flex; flex-direction:column; }
.card-number { color:#0a8b74; font-size:.7rem; font-weight:760; letter-spacing:.12em; }
.card-copy h3 { margin:auto 0 .8rem; font-size:clamp(1.9rem,3vw,3.4rem); font-weight:470; line-height:1; letter-spacing:-.045em; }
.card-copy p { margin:0; color:#536b7a; }
.card-meta { margin-top:1.5rem; color:#0a806c; font-size:.64rem; font-weight:700; letter-spacing:.1em; }
.capability-card>img { width:100%; max-height:560px; align-self:end; object-fit:contain; object-position:bottom; filter:drop-shadow(0 20px 22px rgba(4,21,35,.2)); }
.capability-map,.capability-settings { background:var(--navy-2); color:var(--paper); border-color:rgba(157,200,222,.16); }
.capability-map .card-copy p,.capability-settings .card-copy p { color:#9bb0bf; }
.capability-map .card-number,.capability-settings .card-number { color:var(--green); }
.capability-map .card-meta,.capability-settings .card-meta { color:var(--mint); }

.packages { background:#061a2b; }
.package-timeline { margin-top:clamp(3.5rem,6vw,6rem); display:grid; grid-template-columns:1fr 90px 1fr; gap:1rem; align-items:stretch; }
.package-card { min-height:420px; padding:2rem; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:1rem; background:linear-gradient(150deg,rgba(14,52,81,.75),rgba(4,21,35,.8)); }
.package-current { border-color:rgba(70,228,123,.38); }
.package-future { opacity:.78; }
.package-top { display:flex; align-items:center; justify-content:space-between; color:#698397; font-size:.68rem; }
.status-chip { padding:.4rem .58rem; border:1px solid var(--line); border-radius:99px; font-size:.6rem; letter-spacing:.08em; }
.status-active { color:var(--green); border-color:rgba(70,228,123,.38); }
.status-active i { display:inline-block; width:.38rem; height:.38rem; margin-right:.4rem; border-radius:50%; background:var(--green); }
.package-kicker { margin:auto 0 1rem; color:var(--mint); font-size:.68rem; font-weight:730; letter-spacing:.12em; }
.package-card h3 { margin:0 0 1rem; font-size:clamp(2.5rem,4vw,4.8rem); font-weight:460; line-height:1; letter-spacing:-.05em; }
.package-card>p:not(.package-kicker) { max-width:620px; margin:0; color:#9db1bf; }
.package-coordinate { margin-top:2.2rem; padding-top:1rem; border-top:1px solid var(--line); color:#668094; font-size:.68rem; letter-spacing:.12em; }
.timeline-arrow { display:flex; align-items:center; justify-content:center; gap:.4rem; color:var(--amber); }
.timeline-arrow span { width:42px; height:1px; background:#5c6770; }
.package-note { max-width:760px; margin:2rem 0 0 auto; color:#637d90; font-size:.78rem; }

.responsibility { color:var(--ink); background:var(--paper); }
.responsibility-list { margin-top:3rem; border-top:1px solid rgba(7,24,39,.16); }
.responsibility-list article { padding:1.5rem 0; display:grid; grid-template-columns:.22fr .72fr 1.06fr; gap:1.5rem; border-bottom:1px solid rgba(7,24,39,.16); }
.responsibility-list article>span { color:#0a8b74; font-size:.72rem; }
.responsibility-list h3 { margin:0; font-size:1.18rem; }
.responsibility-list p { max-width:620px; margin:0; color:#506776; }
.legal-note { max-width:760px; margin:1.7rem 0 0 auto; color:#748793; font-size:.78rem; }

.contact-section { display:grid; grid-template-columns:.38fr 1.62fr; color:var(--ink); background:var(--amber); }
.contact-section .section-index { color:rgba(7,24,39,.58); }
.contact-owner { margin:0 0 1rem; font-size:.72rem; font-weight:750; letter-spacing:.12em; }
.contact-section h2 em { color:#075d78; }
.contact-email { display:inline-flex; gap:2rem; margin-top:2.6rem; padding-bottom:.2rem; border-bottom:2px solid; font-size:clamp(1.1rem,2.2vw,2rem); font-weight:700; }
footer { min-height:110px; padding:1.8rem max(4vw,1.2rem); display:flex; align-items:center; justify-content:space-between; gap:2rem; color:#71899b; font-size:.74rem; }
.company-brand-footer { color:var(--paper); }

@media (max-width:1040px) {
  .desktop-nav { display:none; }
  .company-hero { grid-template-columns:1fr; padding-top:8rem; }
  .company-copy { max-width:820px; }
  .vision-figure img { min-height:500px; }
  .product-layout { grid-template-columns:1fr; }
  .product-copy { max-width:700px; }
  .screen-stage { min-height:620px; }
  .capability-card { grid-template-columns:1fr minmax(170px,.65fr); }
}

@media (max-width:760px) {
  .site-header { top:.5rem; width:calc(100vw - 1rem); }
  .header-contact { display:none; }
  .company-hero { padding:7.5rem 1rem 4rem; gap:2.5rem; }
  h1 { font-size:clamp(2.85rem,13vw,4.5rem); }
  .vision-figure img { min-height:410px; object-position:61% center; }
  .vision-figure figcaption { position:static; width:auto; grid-template-columns:1fr; align-items:start; border:0; border-radius:0; background:#061a2c; }
  .product-intro,.objective,.capabilities,.packages,.responsibility,.contact-section { padding:4.5rem 1rem; }
  .section-heading,.objective-grid,.contact-section { grid-template-columns:1fr; gap:1.5rem; }
  .section-heading h2,.objective h2,.contact-section h2 { font-size:clamp(2.45rem,11vw,3.7rem); }
  .screen-stage { min-height:480px; }
  .screen { width:37%; }
  .screen-main { width:43%; }
  .screen-map { left:1%; }
  .screen-profile { right:1%; }
  .logic-flow { grid-template-columns:1fr; }
  .logic-flow>span { justify-self:center; transform:rotate(90deg); }
  .logic-flow div { min-height:70px; }
  .capability-grid { grid-template-columns:1fr; }
  .capability-card { min-height:520px; grid-template-columns:1fr 42%; }
  .card-copy { padding:1.4rem; }
  .card-copy h3 { font-size:2.1rem; }
  .package-timeline { grid-template-columns:1fr; }
  .timeline-arrow { min-height:55px; transform:rotate(90deg); }
  .package-card { min-height:360px; }
  .responsibility-list article { grid-template-columns:2.2rem 1fr; }
  .responsibility-list p { grid-column:2; }
  footer { align-items:flex-start; flex-direction:column; gap:.65rem; }
  footer p { margin:0; }
}

@media (max-width:460px) {
  .company-brand strong { font-size:.88rem; }
  .brand-icon { width:34px; height:34px; }
  .company-hero { padding-top:7rem; }
  .hero-actions { flex-direction:column; }
  .button { width:100%; }
  .vision-figure img { min-height:350px; }
  .product-layout { margin-top:3rem; }
  .screen-stage { min-height:390px; }
  .screen-map,.screen-profile { opacity:.62; }
  .capability-card { min-height:500px; grid-template-columns:1fr 40%; }
  .card-copy p { font-size:.9rem; }
  .card-meta { font-size:.58rem; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { transition-duration:.01ms !important; } }