:root{
  --bg:#f4f7f8;
  --paper:#fbfcfd;
  --ink:#111820;
  --muted:#6c7883;
  --line:#d9e0e4;
  --blue:#1f4863;
  --blue2:#7f9fb3;
  --ice:#dce9ef;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);font-size:18px;line-height:1.65}
a{color:inherit}
.wrap{min-height:100vh;display:flex;flex-direction:column}
header{display:flex;justify-content:space-between;align-items:center;padding:28px 5vw;border-bottom:1px solid rgba(17,24,32,.08)}
.brand{font-size:1rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;text-decoration:none}
.meta{font-size:.84rem;color:var(--muted);letter-spacing:.08em}
main{flex:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(320px,.92fr);min-height:72vh}
.hero{padding:10vh 7vw 8vh 7vw;display:flex;flex-direction:column;justify-content:center}
.kicker{font-size:.84rem;letter-spacing:.18em;text-transform:uppercase;color:var(--blue);font-weight:700;margin-bottom:24px}
h1{font-size:clamp(4rem,10vw,9rem);line-height:.86;margin:0 0 34px;letter-spacing:-.055em;font-weight:680}
.lead{max-width:640px;font-size:clamp(1.25rem,2.4vw,2rem);line-height:1.38;margin:0 0 22px;font-weight:450}
.copy{max-width:640px;color:var(--muted);font-size:1rem;margin:0}
.contact{margin-top:36px;display:inline-flex;align-items:center;gap:12px;text-decoration:none;font-weight:650}
.contact:before{content:"";width:34px;height:1px;background:var(--ink)}
.visual{position:relative;overflow:hidden;min-height:560px;border-left:1px solid rgba(17,24,32,.08);background:linear-gradient(180deg,#eef4f6 0%,#e5edf1 50%,#f8fafb 100%)}
.orbit,.orbit:before,.orbit:after{position:absolute;border:1px solid rgba(31,72,99,.18);border-radius:50%}
.orbit{width:560px;height:560px;right:-150px;top:50%;transform:translateY(-50%)}
.orbit:before{content:"";inset:72px}
.orbit:after{content:"";inset:144px}
.core{position:absolute;width:170px;height:170px;border-radius:50%;right:70px;top:50%;transform:translateY(-50%);background:radial-gradient(circle at 35% 30%,#ffffff 0%,#dbe9ef 38%,#88a7b9 72%,#1f4863 100%);box-shadow:0 28px 60px rgba(31,72,99,.18)}
.mark{position:absolute;left:9%;bottom:9%;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:#61727d}
footer{display:flex;justify-content:space-between;gap:24px;align-items:center;padding:26px 5vw;border-top:1px solid rgba(17,24,32,.08);font-size:.82rem;color:var(--muted)}
footer nav{display:flex;gap:22px;flex-wrap:wrap}footer a{text-decoration:none}footer a:hover{text-decoration:underline}
.page{width:min(920px,90vw);margin:0 auto;padding:70px 0 90px}.page h1{font-size:clamp(2.8rem,7vw,5.6rem);margin-bottom:30px}.page h2{font-size:1.35rem;margin:34px 0 8px}.page p,.page li{color:#4e5b65}.page .back{display:inline-block;margin-top:36px;font-weight:650}
@media(max-width:900px){
  body{font-size:17px}
  header{padding:22px 6vw}
  main{grid-template-columns:1fr}
  .hero{padding:11vh 6vw 9vh}
  h1{font-size:clamp(4.2rem,20vw,7.4rem)}
  .visual{min-height:360px;border-left:0;border-top:1px solid rgba(17,24,32,.08)}
  .orbit{width:420px;height:420px;right:-110px}
  .core{width:132px;height:132px;right:58px}
  footer{align-items:flex-start;flex-direction:column;padding:24px 6vw}
}
