* { box-sizing: border-box; }
:root { --blue:#1ba4df; --deep:#0b8dcc; --lime:#d4ff2f; --ink:#101519; --paper:#f6f7f3; --muted:#637078; --mono:"SFMono-Regular",Consolas,monospace; --sans:"Helvetica Neue",Arial,"PingFang SC",sans-serif; }
body { margin:0; color:var(--ink); background:var(--paper); font-family:var(--sans); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
.page { width:min(calc(100% - 32px),1440px); margin:16px auto; }
.top { display:flex; justify-content:space-between; align-items:center; min-height:58px; padding:0 20px; border:1px solid rgba(16,21,25,.08); border-radius:18px; background:rgba(255,255,255,.78); font:800 9px/1 var(--mono); letter-spacing:.1em; }
.hero { display:grid; grid-template-columns:1.08fr .92fr; gap:70px; align-items:end; min-height:570px; margin-top:12px; padding:clamp(56px,7vw,100px); overflow:hidden; border-radius:34px; color:white; background:radial-gradient(ellipse at 90% 100%,rgba(255,255,255,.72),transparent 36%),linear-gradient(145deg,var(--deep),#2ab2e6 60%,#78d0ed); }
.hero small,.eyebrow { font:800 9px/1 var(--mono); letter-spacing:.14em; }
.hero h1 { max-width:720px; margin:22px 0 0; font-size:clamp(54px,7vw,102px); line-height:.94; letter-spacing:-.08em; }
.hero p { margin:0; padding:28px; border:1px solid rgba(255,255,255,.6); border-radius:25px; background:rgba(255,255,255,.74); color:#314047; line-height:1.85; backdrop-filter:blur(18px); }
.case { margin-top:48px; padding:clamp(52px,7vw,92px); border-radius:34px; background:white; }
.case-head { display:grid; grid-template-columns:1fr .8fr; gap:80px; align-items:end; }
.case h2 { margin:14px 0 0; font-size:clamp(38px,5vw,72px); line-height:1; letter-spacing:-.07em; }
.case-head p { color:var(--muted); line-height:1.85; }
.case-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:12px; margin-top:64px; }
.case-grid article { min-height:250px; padding:22px; border-radius:22px; background:#f0f1ed; }
.case-grid article:nth-child(2),.case-grid article:nth-child(5){background:var(--lime)}
.case-grid article:nth-child(4){color:white;background:var(--ink)}
.case-grid span { font:800 8px/1 var(--mono); letter-spacing:.1em; }
.case-grid h3 { margin:70px 0 12px; font-size:20px; }
.case-grid p { color:var(--muted); font-size:12px; line-height:1.7; }
.case-grid article:nth-child(4) p{color:rgba(255,255,255,.65)}
footer { display:flex; justify-content:space-between; margin-top:12px; padding:20px 22px; border-radius:18px; background:white; color:var(--muted); font:800 8px/1 var(--mono); letter-spacing:.08em; }
@media(max-width:760px){.page{width:100%;margin:0}.top{position:sticky;top:0;z-index:5;border-radius:0}.hero{grid-template-columns:1fr;gap:34px;min-height:auto;margin:12px;padding:68px 22px 38px;border-radius:26px}.hero h1{font-size:52px}.hero p{padding:22px}.case{margin:12px;padding:44px 20px;border-radius:26px}.case-head{grid-template-columns:1fr;gap:20px}.case h2{font-size:42px}.case-grid{grid-template-columns:1fr;margin-top:34px}.case-grid article{min-height:210px}footer{margin:12px;flex-direction:column;gap:10px}}