:root { --orange:#ff9f1c; --orange-dark:#e98200; --ink:#211b13; --muted:#756858; --cream:#fff8ec; }
body { background:var(--cream); color:var(--ink); }
.content { min-width:0; }
.fix-box { background:rgba(255,255,255,.9); backdrop-filter:blur(14px); }
.header { width:min(1160px,calc(100% - 48px)); height:72px; }
.brand { display:inline-flex; align-items:center; gap:12px; color:var(--ink); font-size:21px; font-weight:750; }
.brand img { width:42px; height:42px; margin:0; object-fit:contain; }
.header-r { min-width:0; gap:8px; align-items:center; }
.header-r > a { width:auto; height:36px; line-height:36px; padding:0 14px; border-radius:20px; }
.header-r > a:first-child { margin-right:0; }
.header-r > a.active { background:var(--orange); }
.header-r > a:hover { color:var(--orange-dark); }
.main { padding-top:72px; overflow:visible; }
.hero { min-height:600px; width:min(1160px,calc(100% - 48px)); margin:0 auto; display:grid; grid-template-columns:.9fr 1.1fr; gap:40px; align-items:center; }
.hero-copy { padding:72px 0 84px; }
.eyebrow { color:var(--orange-dark); font-size:14px; font-weight:750; letter-spacing:.16em; text-transform:uppercase; margin-bottom:16px; }
h1 { font-size:clamp(46px,6vw,76px); line-height:1.13; letter-spacing:-.04em; margin-bottom:24px; }
h1 span { color:var(--orange-dark); }
.hero-desc { max-width:380px; color:var(--muted); font-size:18px; line-height:1.8; margin-bottom:30px; }
.btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; width:186px; height:54px; border-radius:28px; background:var(--orange); color:#fff; font-size:17px; font-weight:750; box-shadow:0 12px 24px rgba(255,159,28,.25); transition:transform .2s,box-shadow .2s; }
.btn:hover { color:#fff; transform:translateY(-2px); box-shadow:0 16px 30px rgba(255,159,28,.35); }
.btn-icon { font-size:22px; line-height:1; }
.hero-note { color:#a29482; font-size:13px; margin-top:14px; }
.hero-art { position:relative; padding:35px 0; }
.hero-art .glow { position:absolute; width:82%; aspect-ratio:1; right:4%; top:9%; border-radius:50%; background:#ffd68c; filter:blur(35px); opacity:.55; }
.hero-art img { position:relative; display:block; width:min(602px,100%); height:auto; margin:auto; border-radius:18px; box-shadow:0 26px 60px rgba(112,75,18,.2); }
.features,.showcase { width:min(1160px,calc(100% - 48px)); margin:0 auto; padding:88px 0; }
.section-heading { text-align:center; margin-bottom:38px; }
.section-heading h2 { font-size:clamp(30px,4vw,44px); letter-spacing:-.03em; margin-bottom:12px; }
.section-heading > p:last-child { color:var(--muted); font-size:16px; }
.feature-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.feature-card { padding:30px; min-height:190px; border:1px solid #f2dfc0; border-radius:18px; background:#fffdf9; }
.feature-number { color:var(--orange); font-size:13px; font-weight:800; letter-spacing:.08em; }
.feature-card h3 { font-size:23px; margin:26px 0 10px; }
.feature-card p { color:var(--muted); line-height:1.7; }
.showcase { max-width:1280px; }
.showcase .section-heading { margin-bottom:42px; }
.preview-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:24px; align-items:end; }
.preview-grid figure { margin:0; }
.preview-grid img { display:block; width:100%; height:auto; border-radius:14px; box-shadow:0 18px 40px rgba(112,75,18,.14); }
.preview-grid .preview-featured { transform:translateY(-18px); }
.preview-grid figcaption { text-align:center; color:var(--muted); font-size:14px; margin-top:15px; }
.download-banner { width:min(1160px,calc(100% - 48px)); margin:20px auto 92px; padding:28px 36px; display:flex; align-items:center; gap:20px; border-radius:20px; color:#fff; background:linear-gradient(105deg,#f28b0d,#ffb32c); box-shadow:0 20px 50px rgba(224,128,0,.2); }
.download-banner > img { width:58px; height:58px; object-fit:contain; flex:none; }
.download-banner h2 { font-size:24px; margin-bottom:5px; }
.download-banner p { opacity:.84; }
.download-banner .btn-small { margin-left:auto; width:138px; height:46px; background:#fff; color:var(--orange-dark); box-shadow:none; font-size:15px; }
.bottom { height:auto; min-height:72px; padding:25px 24px; line-height:1.8; background:#fff; color:#817568; border-top:1px solid #f2e8d8; }
.bottom a { color:#66594b; }
@media (max-width:760px) {
  .header { width:calc(100% - 28px); }
  .brand { font-size:17px; gap:8px; }
  .brand img { width:34px; height:34px; }
  .header-r > a { padding:0 7px; font-size:12px; }
  .hero { width:calc(100% - 32px); grid-template-columns:1fr; gap:0; min-height:auto; }
  .hero-copy { padding:62px 0 28px; text-align:center; }
  .hero-desc { margin-left:auto; margin-right:auto; font-size:16px; }
  .hero-art { padding:10px 0 54px; }
  .features,.showcase { width:calc(100% - 32px); padding:56px 0; }
  .feature-grid,.preview-grid { grid-template-columns:1fr; gap:16px; }
  .preview-grid .preview-featured { transform:none; }
  .download-banner { width:calc(100% - 32px); margin-bottom:56px; padding:24px; flex-wrap:wrap; }
  .download-banner .btn-small { margin-left:78px; }
}