/* project 2 */
#cs2{--mid:#17113F; --steel:#0D2433; --cyan:#62F4E8; --teal:#00A8BC; --laser:#D8493F; --gold:#FFC000; background:#070B18; color:#E6F4F6}
.c2-hero{background:linear-gradient(180deg,#17113F 0%,#1B1A5A 46%,#0E3A4C 58%,#050814 100%); padding:64px 0 0; text-align:center; overflow:hidden}
.c2l{color:#9FD9DE}
.c2-kick{font-family:"Orbitron", var(--display); letter-spacing:.3em; font-size:14px; color:var(--cyan); margin:36px 0 8px}
.c2-hero h1{font-family:"Orbitron", var(--display); font-size:clamp(42px,7vw,92px); color:var(--cyan); text-shadow:0 0 18px rgba(98,244,232,.7), 0 0 44px rgba(98,244,232,.35); letter-spacing:.02em; margin:0 0 18px; font-weight:800}
.c2-lead{max-width:54ch; margin:0 auto 56px; color:#BFD9DE; font-size:clamp(17px,1.8vw,21px)}
.c2-facts{background:#0B1226; border-top:1px solid #1D2A44; border-bottom:1px solid #1D2A44}
.c2-facts .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:28px; padding-top:40px; padding-bottom:40px; font-size:16px}
.c2-facts span{display:block; font-size:14px; color:#7FA7B0; margin-bottom:4px}
.c2-band{padding:104px 0}
.c2-band.deep{background:#070B18}
.c2-band.vault{background:radial-gradient(ellipse at 50% 40%, #12384A 0%, #0A1B27 55%, #060B12 100%)}
.c2-band.ink{background:#0B1226}
.c2-band.marble{background:linear-gradient(180deg,#0A1B27,#1B2F3A)}
#cs2 .narrow p{color:#BFD9DE}
.cap.c2 p{color:#A9C7CD}
.cap.c2 h2{color:#F2FBFC}
.laptop.big{max-width:1040px}
.c2-fb{max-width:1040px; margin:48px auto 0}
.browser.dark{background:#16222E}
.browser.dark i{background:#34485A; box-shadow:15px 0 0 #34485A, 30px 0 0 #34485A}
#cs2 .pair figcaption{color:#9FD9DE}
.dilemmas{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; max-width:1080px; margin:0 auto}
.dilemmas div{border:1px solid #1F3A4A; border-left:3px solid var(--laser); border-radius:10px; padding:18px 18px; background:#0B1624}
.dilemmas b{display:block; font-family:var(--display); font-size:19px; color:#F2FBFC; margin-bottom:4px}
.dilemmas span{font-size:15px; color:#A9C7CD; line-height:1.45}
.flow{list-style:none; margin:0 auto; padding:0; max-width:680px; counter-reset:f}
.flow > li{position:relative; border:1px solid #23405A; background:#0E1A2C; border-radius:12px; padding:16px 20px; margin-bottom:34px; text-align:center}
.flow > li::after{content:""; position:absolute; left:50%; bottom:-28px; width:2px; height:22px; background:#2B5A70; transform:translateX(-50%)}
.flow > li:last-child::after{display:none}
.flow b{display:block; font-family:var(--display); font-size:19px; color:#F2FBFC}
.flow span{font-size:15px; color:#A9C7CD}
.flow li.hot{border-color:var(--cyan); box-shadow:0 0 22px -6px rgba(98,244,232,.55)}
.flow li.split{display:grid; grid-template-columns:1fr 1fr; gap:14px; border:none; background:none; padding:0}
.flow .fail,.flow .win{border-radius:12px; padding:16px 18px}
.flow .fail{background:#2A1216; border:1px solid #7A2E2A}
.flow .win{background:#0F2A22; border:1px solid #2E7A5C}
.c2-sg{max-width:1040px; margin:0 auto; background:#0E1A2C; border:1px solid #1F3A4A; border-radius:20px; padding:clamp(22px,4vw,48px); display:grid; gap:44px}
.c2-sg h3{font-family:var(--body); font-size:15px; font-weight:600; color:#7FA7B0; letter-spacing:0; margin:0 0 18px; padding-bottom:10px; border-bottom:1px solid #1F3A4A}
.c2-sw{display:grid; grid-template-columns:repeat(6,1fr); gap:14px}
.c2-sw i{display:block; aspect-ratio:3/4; border-radius:12px; border:1px solid #2A4458; margin-bottom:12px}
.c2-sw b{display:block; font-size:15px; color:#F2FBFC}
.c2-sw code{display:block; font-family:var(--body); font-size:13px; color:#7FA7B0; margin:2px 0 4px}
.c2-sw span{font-size:13px; color:#A9C7CD; display:block; line-height:1.4}
.c2-split{display:grid; grid-template-columns:1.1fr 1fr; gap:44px}
.neon{font-family:"Orbitron", sans-serif; font-weight:800; font-size:clamp(26px,3vw,36px); color:var(--cyan); text-shadow:0 0 14px rgba(98,244,232,.6); margin:0}
.digi{font-family:"Share Tech Mono", monospace; font-size:22px; color:#F2FBFC; letter-spacing:.08em; margin:22px 0 0}
.mw{font-family:"Merriweather", Georgia, serif; font-size:17px; line-height:1.6; color:#E6F4F6; margin:22px 0 0}
.sgu{font-size:14px; color:#7FA7B0; margin:6px 0 0}
.c2-btns{display:flex; gap:10px; margin-bottom:16px}
.bt{font-family:"Share Tech Mono", monospace; font-size:18px; letter-spacing:.08em; color:#fff; background:var(--teal); border:2px solid #36E4F4; border-radius:8px; padding:6px 20px; box-shadow:0 0 14px -2px rgba(54,228,244,.6)}
.choice{display:flex; background:#fff; border-radius:4px; overflow:hidden; margin-bottom:16px}
.choice b{background:var(--teal); color:#fff; width:52px; display:flex; align-items:center; justify-content:center; font-family:"Merriweather", Georgia, serif; font-size:20px}
.choice span{color:#1B1B1D; font-family:"Merriweather", Georgia, serif; font-size:14px; padding:12px 14px}
.modals{display:flex; gap:12px}
.md{flex:1; background:#fff; border-radius:6px; padding:14px; display:flex; flex-direction:column; align-items:center; gap:8px}
.md b{font-family:"Merriweather", Georgia, serif; font-size:15px; color:#1B1B1D}
.md em{width:38px; height:38px; border-radius:50%; border:1.5px solid #9A9A9A; position:relative}
.md em.ok::after{content:""; position:absolute; left:12px; top:6px; width:10px; height:18px; border:solid #6E8B3D; border-width:0 4px 4px 0; transform:rotate(45deg)}
.md em.no::before,.md em.no::after{content:""; position:absolute; left:17px; top:7px; width:4px; height:22px; background:#8E3131; border-radius:2px; transform:rotate(45deg)}
.md em.no::after{transform:rotate(-45deg)}
.c2bna .bna-col{background:#0E1A2C; color:#E6F4F6; box-shadow:none; border:1px solid #1F3A4A}
.c2bna .bna-list{color:#A9C7CD}
.c2bna .bna-list li{border-top-color:#1F3A4A}
.c2bna .bna-col:last-child .bna-list li::before{background:var(--cyan)}
.c2bna .bna-list li::before{background:#4A5E70}
.c2bna .bna-tag.was{background:#26364A; color:#C3D2DD}
.c2t{background:var(--teal)!important; color:#fff!important}
.old{background:#fff; border-radius:10px; padding:14px 12px; aspect-ratio:16/10; display:flex; flex-direction:column; justify-content:space-between; color:#222}
.old-h{margin:0; text-align:center; font-weight:700; color:#2A2F8F; font-size:13px}
.old-icons{display:grid; grid-template-columns:repeat(5,1fr); gap:4px; text-align:center}
.old-icons span{font-size:10px; line-height:1.2; padding-top:26px; position:relative}
.old-icons span::before{content:""; position:absolute; top:0; left:50%; width:22px; height:22px; transform:translateX(-50%); background:#2A2A2A; border-radius:5px}
.old-mid{display:grid; grid-template-columns:1fr 1fr; gap:6px 18px; background:#F1F1F3; padding:10px 14px; border-radius:4px}
.old-mid i{display:block; height:6px; background:#E57373; border-radius:3px}
.newg{border-radius:10px; aspect-ratio:16/10; background:radial-gradient(circle at 50% 50%, #1D4E63, #0A1B27 70%); display:grid; grid-template-columns:1fr 1fr; gap:16px; padding:18px}
.ng-l{display:flex; flex-direction:column; gap:7px; justify-content:center}
.ng-h{margin:0 0 4px; font-family:"Merriweather", Georgia, serif; font-weight:700; font-size:clamp(15px,1.6vw,20px); color:#fff}
.ng-l i{display:block; height:5px; background:#9FC3CE; border-radius:3px; opacity:.7}
.ng-l i.s{width:60%}
.ng-q{margin:6px 0 0; font-size:12px; color:#fff; font-family:"Merriweather", Georgia, serif}
.ng-r{display:flex; flex-direction:column; gap:7px; justify-content:center}
.ng-r div{display:flex; height:30px; background:#fff; border-radius:3px; overflow:hidden}
.ng-r b{width:30px; background:var(--teal); color:#fff; font-size:12px; display:flex; align-items:center; justify-content:center}
.ng-r i{flex:1; margin:12px 10px; background:#C9D3D8; border-radius:3px}
.ng-r div.pick{box-shadow:0 0 0 2px var(--cyan)}
.ng-r span{align-self:flex-end; font-family:"Share Tech Mono", monospace; font-size:11px; color:#fff; background:var(--teal); padding:4px 10px; border-radius:4px; margin-top:4px}
.c2-build{display:grid; grid-template-columns:1fr 1fr; gap:18px; max-width:1000px; margin:0 auto}
.c2-build div{border-left:3px solid var(--cyan); padding:14px 0 14px 22px}
.c2-build b{display:block; font-family:var(--display); font-size:21px; color:#F2FBFC; margin-bottom:4px}
.c2-build span{color:#A9C7CD; font-size:16px}
.c2n{border-top:1px solid #1D2A44!important}
.c2n .back{color:#9FD9DE}
.feature.alt{margin-top:24px}
.soon.one{grid-template-columns:1fr}
@media (max-width:900px){
  .c2-facts .wrap{grid-template-columns:1fr 1fr}
  .dilemmas{grid-template-columns:1fr 1fr}
  .c2-sw{grid-template-columns:repeat(3,1fr)}
  .c2-split,.c2-build{grid-template-columns:1fr}
  .c2-band{padding:72px 0}
}
@media (max-width:560px){.dilemmas{grid-template-columns:1fr}.flow li.split{grid-template-columns:1fr}}