:root { --navy:#071821; --navy-2:#0d2933; --cream:#f3efe5; --paper:#fbfaf5; --teal:#42aeba; --teal-dark:#147987; --orange:#ef7d43; --ink:#12242b; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; }
a { color:inherit; }
.section-shell { width:min(1140px,calc(100% - 40px)); margin:0 auto; }
.topbar { height:74px; padding:0 max(20px,calc((100% - 1140px)/2)); display:flex; align-items:center; justify-content:space-between; background:var(--navy); color:white; border-bottom:1px solid #ffffff18; }
.brand { display:flex; align-items:center; gap:10px; text-decoration:none; font-size:14px; letter-spacing:.08em; }
.brand strong { color:var(--teal); }
.brand-mark { width:38px; height:38px; border:1px solid var(--teal); display:grid; place-items:center; font-weight:900; color:var(--teal); }
.top-link { font-size:14px; font-weight:700; color:var(--cream); text-underline-offset:5px; }
.hero { min-height:680px; display:grid; grid-template-columns:1.18fr .82fr; gap:80px; align-items:center; padding-top:72px; padding-bottom:80px; }
.eyebrow { margin:0 0 18px; color:var(--teal-dark); font-size:13px; font-weight:900; letter-spacing:.16em; }
.orange { color:var(--orange); }
h1 { margin:0; max-width:760px; font-size:clamp(42px,5.5vw,74px); line-height:.98; letter-spacing:-.055em; color:var(--navy); }
h1 em { color:var(--teal-dark); font-style:normal; }
.hero-text { max-width:650px; margin:28px 0 30px; font-size:20px; line-height:1.55; color:#3e5158; }
.buy-button { width:fit-content; min-height:58px; display:flex; align-items:center; justify-content:center; gap:20px; padding:0 26px; background:var(--orange); color:white; text-decoration:none; font-size:14px; font-weight:900; letter-spacing:.04em; box-shadow:7px 7px 0 var(--navy); transition:transform .2s,box-shadow .2s; }
.buy-button:hover { transform:translate(3px,3px); box-shadow:4px 4px 0 var(--navy); }
.buy-button span { font-size:22px; }
.microcopy { margin:18px 0 0; font-size:13px; color:#64747a; }
.product-stage { position:relative; min-height:500px; display:grid; place-items:center; background:var(--navy); overflow:hidden; }
.product-stage img { position:relative; z-index:2; width:68%; max-width:300px; box-shadow:0 30px 60px #0008; border:1px solid #ffffff20; }
.orbit { position:absolute; border:1px solid #45c9d366; border-radius:50%; }
.orbit-one { width:420px; height:420px; }
.orbit-two { width:300px; height:300px; border-color:#ef7d4366; }
.price-card { position:absolute; z-index:3; right:18px; bottom:18px; width:178px; padding:16px; background:var(--cream); color:var(--navy); display:grid; gap:4px; }
.price-card span,.offer-price span { font-size:10px; font-weight:900; letter-spacing:.13em; }
.price-card strong { font-size:28px; }
.price-card small,.offer-price small { color:#536168; }
.cycle-band { background:var(--navy); color:white; padding:100px 0; }
.cycle-grid { display:grid; grid-template-columns:1fr 1fr; gap:100px; align-items:start; }
h2 { margin:0; font-size:clamp(34px,4vw,56px); line-height:1.04; letter-spacing:-.045em; color:var(--navy); }
.cycle-band h2,.light h2 { color:white; }
.cycle-list { margin:0; padding:0; list-style:none; border-top:1px solid #ffffff24; }
.cycle-list li { display:flex; gap:22px; align-items:center; min-height:62px; border-bottom:1px solid #ffffff24; }
.cycle-list span { color:var(--orange); font-size:12px; font-weight:900; }
.cycle-list strong { font-size:18px; }
.content-section,.faq-section { padding:110px 0; }
.section-heading { max-width:800px; margin-bottom:50px; }
.benefit-grid { display:grid; grid-template-columns:repeat(5,1fr); border-top:1px solid #c9d1cf; border-left:1px solid #c9d1cf; }
.benefit { min-height:210px; padding:24px; border-right:1px solid #c9d1cf; border-bottom:1px solid #c9d1cf; display:flex; flex-direction:column; justify-content:space-between; }
.benefit span { color:var(--orange); font-size:12px; font-weight:900; }
.benefit p { margin:0; font-weight:800; font-size:17px; line-height:1.4; }
.roadmap { padding:110px 0; background:var(--navy-2); }
.step-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.step { min-height:280px; padding:28px; background:#123844; border-top:3px solid var(--teal); color:white; }
.step span { font-size:12px; font-weight:900; color:var(--orange); }
.step h3 { margin:80px 0 12px; font-size:23px; }
.step p { margin:0; color:#c5d6da; line-height:1.55; }
.audience { padding:110px 0; display:grid; grid-template-columns:1fr 1fr; gap:90px; align-items:center; }
.audience ul { margin:0; padding:0; list-style:none; }
.audience li { padding:18px 0 18px 34px; border-bottom:1px solid #ccd4d1; position:relative; font-size:18px; line-height:1.45; }
.audience li::before { content:"×"; position:absolute; left:0; color:var(--orange); font-weight:900; font-size:22px; }
.offer-section { padding:100px 20px; background:var(--cream); }
.offer-card { width:min(820px,100%); margin:auto; padding:60px; background:white; border:1px solid #cfd6d2; box-shadow:12px 12px 0 var(--navy); text-align:center; }
.offer-card h2 { margin-bottom:14px; }
.offer-card > div:first-child > p:last-child { color:#536168; font-size:18px; }
.offer-price { margin:36px 0 28px; display:grid; gap:4px; }
.offer-price strong { font-size:52px; color:var(--navy); }
.offer-card .buy-button { margin:auto; }
.guarantee { display:grid; gap:5px; margin-top:30px; font-size:14px; }
.guarantee strong { color:var(--teal-dark); }
.faq-list { border-top:1px solid #c9d1cf; }
details { border-bottom:1px solid #c9d1cf; padding:22px 0; }
summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:19px; font-weight:800; }
summary::-webkit-details-marker { display:none; }
summary span { color:var(--orange); font-size:26px; }
details p { max-width:800px; margin:16px 0 0; color:#526369; font-size:16px; line-height:1.6; }
footer { padding:64px 0; background:var(--navy); color:#c3d0d3; }
.footer-inner { display:grid; gap:22px; }
.footer-inner>p { max-width:760px; margin:0; line-height:1.55; }
.disclaimer { padding-top:22px; border-top:1px solid #ffffff1c; font-size:14px; }
footer small { color:#799097; }
@media (max-width:900px) {
  .hero { grid-template-columns:1fr; gap:44px; padding-top:54px; }
  .product-stage { min-height:450px; }
  .cycle-grid,.audience { grid-template-columns:1fr; gap:50px; }
  .benefit-grid { grid-template-columns:repeat(2,1fr); }
  .step-grid { grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px) {
  .section-shell { width:min(100% - 28px,1140px); }
  .topbar { height:66px; padding:0 14px; }
  .top-link { font-size:13px; }
  .hero { min-height:0; padding-top:44px; padding-bottom:60px; }
  h1 { font-size:43px; }
  .hero-text { font-size:17px; margin:22px 0 26px; }
  .buy-button { width:100%; padding:0 18px; font-size:12px; }
  .microcopy { line-height:1.5; }
  .product-stage { min-height:390px; }
  .product-stage img { width:62%; }
  .price-card { width:160px; }
  .cycle-band,.content-section,.roadmap,.audience,.faq-section { padding:76px 0; }
  .benefit-grid,.step-grid { grid-template-columns:1fr; }
  .benefit { min-height:145px; }
  .step { min-height:230px; }
  .step h3 { margin-top:55px; }
  .offer-section { padding:70px 14px; }
  .offer-card { padding:38px 20px; box-shadow:7px 7px 0 var(--navy); }
  .offer-price strong { font-size:45px; }
}