*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
:root { --tr: background 0.35s ease, color 0.35s ease, border-color 0.35s ease, box-shadow 0.35s ease; }

/* ── SHARED DARK ── */
[data-theme="dark"] {
  --bg:#000; --bg2:#0A0A0A; --bg3:#111;
  --surface:#1C1C1E; --surface2:#2C2C2E; --surface3:#3A3A3C;
  --border:rgba(255,255,255,0.08); --border-h:rgba(255,255,255,0.14);
  --text:#F5F5F7; --text2:#A1A1A6; --text3:#6E6E73;
  --nav-bg:rgba(0,0,0,0.75); --card-shadow:0 2px 20px rgba(0,0,0,0.55);
}
[data-theme="light"] {
  --bg:#F5F5F7; --bg2:#fff; --bg3:#F0F0F2;
  --surface:#fff; --surface2:#F5F5F7; --surface3:#E8E8ED;
  --border:rgba(0,0,0,0.07); --border-h:rgba(0,0,0,0.13);
  --text:#1D1D1F; --text2:#6E6E73; --text3:#9E9EA3;
  --nav-bg:rgba(245,245,247,0.78); --card-shadow:0 2px 16px rgba(0,0,0,0.07);
}

/* TipTracker accent */
.page-tip [data-theme="dark"], [data-theme="dark"] .page-tip,
.page-tip { --accent:#FFD60A; --accent-soft:rgba(255,214,10,0.12); --accent-border:rgba(255,214,10,0.25); --cta:#0A84FF; }
[data-theme="light"] .page-tip, .page-tip[data-theme="light"] { --accent:#996B00; --accent-soft:rgba(153,107,0,0.07); --accent-border:rgba(153,107,0,0.2); --cta:#0071E3; }

/* ProLaunch accent */
.page-pro { --accent:#4A8FFF; --accent-soft:rgba(74,143,255,0.12); --accent-border:rgba(74,143,255,0.25); --cta:#4A8FFF; --pro-grad:linear-gradient(135deg,#4A8FFF,#7B5FFF); }
[data-theme="light"] .page-pro { --accent:#2060DD; --accent-soft:rgba(32,96,221,0.08); --accent-border:rgba(32,96,221,0.2); --cta:#2060DD; --pro-grad:linear-gradient(135deg,#2060DD,#6040CC); }

html { scroll-behavior: smooth; }
body { font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif; background:var(--bg); color:var(--text); overflow-x:hidden; transition:var(--tr); -webkit-font-smoothing:antialiased; }

/* ── PAGES ── */
.page { display:none; }
.page.active { display:block; }

/* ── NAV ── */
nav {
  position:fixed; top:0; left:0; right:0; z-index:300; height:52px;
  display:flex; align-items:center; justify-content:space-between; padding:0 28px;
  background:var(--nav-bg); backdrop-filter:saturate(180%) blur(24px);
  -webkit-backdrop-filter:saturate(180%) blur(24px);
  border-bottom:1px solid var(--border); transition:var(--tr);
}
.nav-logo { display:flex; align-items:center; gap:8px; font-size:1rem; font-weight:700; letter-spacing:-.02em; color:var(--text); cursor:pointer; text-decoration:none; }
.nav-logo-icon { width:26px; height:26px; border-radius:7px; display:flex; align-items:center; justify-content:center; font-size:.85rem; }
.icon-tip { background:#FFD60A; }
.icon-pro { background:linear-gradient(135deg,#4A8FFF,#7B5FFF); }
.icon-hub { display:flex; gap:3px; }
.icon-hub span { width:20px; height:20px; border-radius:6px; display:flex; align-items:center; justify-content:center; font-size:.7rem; }

nav ul { list-style:none; display:flex; position:absolute; left:50%; transform:translateX(-50%); }
nav ul a, nav ul button {
  display:block; padding:6px 14px; color:var(--text2); text-decoration:none;
  font-size:.8rem; font-weight:500; letter-spacing:-.01em;
  background:none; border:none; font-family:inherit; cursor:pointer;
  transition:color .2s;
}
nav ul a:hover, nav ul button:hover { color:var(--text); }
.nav-back { color:var(--cta, #0A84FF) !important; font-weight:600 !important; }

/* dropdown */
.nav-dd { position:relative; }
.nav-dd-btn { display:flex; align-items:center; gap:5px; padding:6px 14px; color:var(--text2); font-size:.8rem; font-weight:500; letter-spacing:-.01em; background:none; border:none; font-family:inherit; cursor:pointer; transition:color .2s; }
.nav-dd-btn:hover, .nav-dd-btn.open { color:var(--text); }
.chevron { font-size:.55rem; transition:transform .25s; display:inline-block; }
.nav-dd-btn.open .chevron { transform:rotate(180deg); }
.dd-menu { position:absolute; top:calc(100% + 8px); left:50%; transform:translateX(-50%) translateY(-6px); background:var(--surface); border:1px solid var(--border-h); border-radius:14px; padding:8px; min-width:190px; box-shadow:0 16px 48px rgba(0,0,40,.3); opacity:0; pointer-events:none; transition:opacity .2s,transform .2s; z-index:400; }
[data-theme="light"] .dd-menu { box-shadow:0 8px 32px rgba(60,80,180,.12); }
.dd-menu.open { opacity:1; pointer-events:auto; transform:translateX(-50%) translateY(0); }
.dd-item { display:block; width:100%; padding:9px 14px; font-size:.82rem; font-weight:500; color:var(--text2); background:none; border:none; font-family:inherit; cursor:pointer; text-align:left; border-radius:8px; text-decoration:none; transition:background .15s,color .15s; }
.dd-item:hover { background:var(--surface2); color:var(--text); }
.dd-div { height:1px; background:var(--border); margin:4px 0; }

.nav-right { display:flex; align-items:center; gap:10px; }
.theme-toggle { width:52px; height:28px; background:var(--surface2); border:1px solid var(--border-h); border-radius:999px; cursor:pointer; position:relative; display:flex; align-items:center; justify-content:space-between; padding:0 7px; transition:background .3s,border-color .3s; }
.toggle-icon { font-size:.6rem; pointer-events:none; z-index:1; }
.toggle-knob { position:absolute; top:3px; left:3px; width:20px; height:20px; background:var(--text); border-radius:50%; z-index:2; transition:transform .3s cubic-bezier(.4,0,.2,1),background .3s; }
[data-theme="light"] .toggle-knob { transform:translateX(24px); }
.nav-dl { background:var(--cta,#0A84FF); color:#fff; font-size:.78rem; font-weight:600; padding:7px 16px; border-radius:980px; text-decoration:none; letter-spacing:-.01em; transition:opacity .2s,transform .2s; white-space:nowrap; cursor:pointer; border:none; font-family:inherit; }
.nav-dl:hover { opacity:.85; transform:translateY(-1px); }

/* ── HUB ── */
.hub-hero { padding:140px 24px 64px; text-align:center; position:relative; }
.hub-hero::before { content:''; position:absolute; inset:0; background:radial-gradient(ellipse 70% 50% at 50% 0%,rgba(100,160,255,.06) 0%,transparent 100%); pointer-events:none; }
.hub-eyebrow { font-size:.7rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; color:var(--text3); display:block; margin-bottom:18px; animation:fadeUp .6s ease both; }
.hub-hero h1 { font-size:clamp(2.4rem,5.5vw,4.4rem); font-weight:800; letter-spacing:-.045em; line-height:1.06; margin-bottom:18px; max-width:640px; margin-left:auto; margin-right:auto; animation:fadeUp .6s .08s ease both; }
.hub-hero p { font-size:1.05rem; font-weight:300; color:var(--text2); max-width:400px; margin:0 auto; line-height:1.65; letter-spacing:-.01em; animation:fadeUp .6s .16s ease both; }

.apps-wrap { max-width:960px; margin:0 auto; padding:0 24px 100px; }
.apps-grid { display:grid; grid-template-columns:1fr 1fr; gap:20px; }

.app-card { background:var(--surface); border:1px solid var(--border); border-radius:28px; overflow:hidden; box-shadow:var(--card-shadow); display:flex; flex-direction:column; cursor:pointer; transition:transform .35s cubic-bezier(.2,0,0,1),box-shadow .35s,border-color .3s; text-decoration:none; color:inherit; }
.card-tip { border-top:3px solid #FFD60A; }
.card-tip:hover { transform:translateY(-8px) scale(1.01); box-shadow:0 24px 56px rgba(0,0,0,.35),0 0 0 1px rgba(255,214,10,.2); }
[data-theme="light"] .card-tip:hover { box-shadow:0 14px 40px rgba(0,0,0,.1),0 0 0 1px rgba(153,107,0,.15); }
.card-pro { border-top:3px solid #4A8FFF; }
.card-pro:hover { transform:translateY(-8px) scale(1.01); box-shadow:0 24px 56px rgba(0,0,0,.35),0 0 0 1px rgba(74,143,255,.2); }
[data-theme="light"] .card-pro:hover { box-shadow:0 14px 40px rgba(0,0,0,.1),0 0 0 1px rgba(32,96,221,.15); }

.card-head { padding:32px 32px 20px; display:flex; align-items:flex-start; gap:16px; }
.app-icon-lg { width:56px; height:56px; border-radius:14px; display:flex; align-items:center; justify-content:center; font-size:1.5rem; flex-shrink:0; }
.app-meta { flex:1; }
.app-name { font-size:1.2rem; font-weight:700; letter-spacing:-.03em; margin-bottom:5px; }
.app-tagline { font-size:.82rem; color:var(--text2); font-weight:300; line-height:1.4; }
.app-badge { display:inline-flex; align-items:center; font-size:.68rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; padding:4px 10px; border-radius:980px; margin-top:10px; }
.badge-tip { background:rgba(255,214,10,.12); color:#B07C00; border:1px solid rgba(255,214,10,.25); }
[data-theme="dark"] .badge-tip { color:#FFD60A; }
.badge-pro { background:rgba(74,143,255,.1); color:#2060DD; border:1px solid rgba(74,143,255,.22); }
[data-theme="dark"] .badge-pro { color:#4A8FFF; }

.card-shots { display:flex; gap:10px; padding:0 24px 22px; overflow:hidden; }
.card-shot { flex:1; border-radius:14px; overflow:hidden; border:1px solid var(--border); min-width:0; aspect-ratio:9/19.5; background:var(--surface2); }
.card-shot img { width:100%; height:100%; display:block; object-fit:cover; }

.card-pills { padding:0 32px 24px; display:flex; flex-wrap:wrap; gap:7px; }
.pill { font-size:.72rem; font-weight:500; background:var(--surface2); border:1px solid var(--border); border-radius:980px; padding:4px 12px; color:var(--text2); }

.card-foot { padding:18px 32px 26px; border-top:1px solid var(--border); display:flex; align-items:center; justify-content:space-between; gap:12px; }
.card-foot-label { font-size:.8rem; color:var(--text3); }
.view-btn { display:inline-flex; align-items:center; gap:6px; font-size:.82rem; font-weight:600; padding:9px 18px; border-radius:980px; border:none; cursor:pointer; font-family:inherit; transition:opacity .2s,transform .15s; white-space:nowrap; text-decoration:none; }
.view-btn:hover { opacity:.88; transform:translateY(-1px); }
.vbtn-tip { background:#FFD60A; color:#000; }
.vbtn-pro { background:linear-gradient(135deg,#4A8FFF,#7B5FFF); color:#fff; }

.hub-foot { border-top:1px solid var(--border); text-align:center; padding:18px 24px; }
.hub-foot p { font-size:.78rem; color:var(--text3); font-weight:300; }

/* ── SHARED SECTION STYLES ── */
.section { padding:96px 24px; }
.sec-header { text-align:center; margin-bottom:56px; }
.sec-tag { font-size:.72rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--accent,#0A84FF); display:block; margin-bottom:12px; }
.sec-h2 { font-size:clamp(1.8rem,3.5vw,2.8rem); font-weight:700; letter-spacing:-.03em; line-height:1.1; margin-bottom:14px; }
.sec-desc { font-size:1rem; color:var(--text2); max-width:440px; margin:0 auto; line-height:1.65; font-weight:300; letter-spacing:-.01em; }
.rule { height:1px; background:var(--border); transition:var(--tr); }
.alt-bg { background:var(--bg2); transition:var(--tr); }

/* hero shared */
.app-hero { min-height:100vh; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:130px 24px 100px; text-align:center; position:relative; }
.app-hero::before { content:''; position:absolute; inset:0; pointer-events:none; }
.tip-glow::before { background:radial-gradient(ellipse 60% 50% at 50% 0%,var(--accent-soft) 0%,transparent 100%); }
.pro-glow::before { background:radial-gradient(ellipse 60% 50% at 50% 0%,rgba(74,143,255,.1) 0%,transparent 100%); }

.hero-badge { display:inline-flex; align-items:center; gap:6px; font-size:.7rem; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--accent); background:var(--accent-soft); border:1px solid var(--accent-border); padding:5px 14px; border-radius:980px; margin-bottom:28px; animation:fadeUp .6s ease both; }
.app-hero h1 { font-size:clamp(2.8rem,6.5vw,5.2rem); font-weight:800; letter-spacing:-.045em; line-height:1.04; margin-bottom:20px; max-width:700px; animation:fadeUp .6s .08s ease both; }
.accent-txt { color:var(--accent); }
.pro-accent { background:linear-gradient(135deg,#4A8FFF,#7B5FFF); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.app-hero .sub { font-size:1.1rem; font-weight:300; color:var(--text2); max-width:460px; line-height:1.65; letter-spacing:-.01em; margin-bottom:44px; animation:fadeUp .6s .15s ease both; }
.hero-actions { display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:72px; animation:fadeUp .6s .22s ease both; }
.btn-primary { display:inline-flex; align-items:center; gap:8px; background:var(--cta,#0A84FF); color:#fff; font-size:.9rem; font-weight:600; letter-spacing:-.01em; padding:13px 26px; border-radius:980px; text-decoration:none; box-shadow:0 4px 20px rgba(10,132,255,.28); transition:opacity .2s,transform .2s; border:none; cursor:pointer; font-family:inherit; }
.btn-pro-primary { background:linear-gradient(135deg,#4A8FFF,#7B5FFF); box-shadow:0 4px 24px rgba(74,143,255,.32); }
.btn-primary:hover { opacity:.88; transform:translateY(-2px); }
.btn-outline { display:inline-flex; align-items:center; gap:8px; background:var(--surface); color:var(--text); font-size:.9rem; font-weight:500; letter-spacing:-.01em; padding:13px 24px; border-radius:980px; border:1px solid var(--border-h); cursor:pointer; font-family:inherit; transition:background .2s,transform .2s; }
.btn-outline:hover { background:var(--surface2); transform:translateY(-2px); }

.hero-stats { display:flex; gap:0; background:var(--surface); border:1px solid var(--border); border-radius:20px; overflow:hidden; box-shadow:var(--card-shadow); max-width:440px; width:100%; animation:fadeUp .6s .3s ease both; }
.h-stat { flex:1; padding:18px 0; text-align:center; position:relative; }
.h-stat:not(:last-child)::after { content:''; position:absolute; right:0; top:20%; bottom:20%; width:1px; background:var(--border); }
.h-stat-num { display:block; font-size:1.35rem; font-weight:700; letter-spacing:-.03em; color:var(--accent); }
.pro-stat-num { background:linear-gradient(135deg,#4A8FFF,#7B5FFF); -webkit-background-clip:text; -webkit-text-fill-color:transparent; background-clip:text; }
.h-stat-lbl { font-size:.68rem; color:var(--text3); font-weight:500; margin-top:2px; }

/* screenshots */
.ss-scroll { overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.ss-scroll::-webkit-scrollbar { display:none; }
.ss-track { display:flex; gap:18px; padding:10px 48px 32px; width:max-content; margin:0 auto; align-items:flex-end; }
.ss-card { width:190px; border-radius:34px; overflow:hidden; border:1px solid var(--border); background:var(--surface); box-shadow:var(--card-shadow); flex-shrink:0; transition:transform .4s cubic-bezier(.2,0,0,1),box-shadow .4s,border-color .35s; }
.ss-card:hover { transform:translateY(-10px) scale(1.025); box-shadow:0 24px 48px rgba(0,0,0,.3),0 0 0 1px var(--border-h); }
.ss-card.featured { transform:scale(1.04); border-color:var(--accent-border); }
.ss-card.featured:hover { transform:translateY(-10px) scale(1.065); }
.ss-card img { width:100%; display:block; }
.ss-lbl { padding:10px 0 12px; font-size:.7rem; font-weight:500; color:var(--text3); text-align:center; background:var(--surface); }

/* bento */
.bento { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:960px; margin:0 auto; }
.bento-card { background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:28px; box-shadow:var(--card-shadow); transition:border-color .25s,transform .25s; }
.bento-card:hover { border-color:var(--border-h); transform:translateY(-3px); }
.bento-wide { grid-column:span 2; }
.bento-icon { width:42px; height:42px; background:var(--accent-soft); border-radius:11px; border:1px solid var(--accent-border); display:flex; align-items:center; justify-content:center; font-size:1.15rem; margin-bottom:16px; }
.bento-card h3 { font-size:.95rem; font-weight:600; letter-spacing:-.02em; margin-bottom:7px; }
.bento-card p { font-size:.82rem; color:var(--text2); line-height:1.6; font-weight:300; }

/* calculator */
.calc-wrap { max-width:860px; margin:0 auto; display:grid; grid-template-columns:1fr 1fr; gap:64px; align-items:center; }
.calc-copy h2 { font-size:clamp(1.6rem,3vw,2.3rem); font-weight:700; letter-spacing:-.03em; line-height:1.12; margin-bottom:14px; }
.calc-copy p { color:var(--text2); line-height:1.65; font-weight:300; font-size:.92rem; margin-bottom:22px; }
.perk-list { list-style:none; display:flex; flex-direction:column; gap:9px; }
.perk-list li { display:flex; align-items:center; gap:9px; font-size:.83rem; color:var(--text2); }
.perk-dot { width:6px; height:6px; background:var(--cta,#0A84FF); border-radius:50%; flex-shrink:0; }
.calc-box { background:var(--surface); border:1px solid var(--border); border-radius:22px; padding:28px; box-shadow:var(--card-shadow); }
.calc-ttl { font-size:.95rem; font-weight:700; letter-spacing:-.02em; margin-bottom:20px; }
.field-lbl { font-size:.7rem; font-weight:600; letter-spacing:.04em; text-transform:uppercase; color:var(--text2); margin-bottom:8px; }
.bill-wrap { background:var(--surface2); border:1px solid var(--border); border-radius:12px; padding:14px 16px; margin-bottom:16px; transition:border-color .2s; }
.bill-wrap:focus-within { border-color:var(--cta,#0A84FF); }
.bill-wrap input { width:100%; border:none; outline:none; background:transparent; font-family:'Inter',sans-serif; font-size:1.45rem; font-weight:300; color:var(--text); letter-spacing:-.02em; }
.bill-wrap input::placeholder { color:var(--text3); }
.slider-row { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.pct-badge { background:var(--accent-soft); color:var(--accent); border:1px solid var(--accent-border); border-radius:8px; font-size:.8rem; font-weight:700; padding:4px 10px; min-width:50px; text-align:center; }
input[type="range"] { -webkit-appearance:none; flex:1; height:4px; background:var(--surface3); border-radius:99px; outline:none; cursor:pointer; }
input[type="range"]::-webkit-slider-thumb { -webkit-appearance:none; width:20px; height:20px; background:var(--cta,#0A84FF); border-radius:50%; box-shadow:0 2px 8px rgba(10,132,255,.35); cursor:grab; }
.sum-card { background:var(--surface2); border:1px solid var(--border); border-radius:13px; overflow:hidden; }
.sum-row { display:flex; justify-content:space-between; align-items:center; padding:11px 15px; font-size:.85rem; }
.sum-row:not(:last-child) { border-bottom:1px solid var(--border); }
.sum-row span:first-child { color:var(--text2); }
.sum-row span:last-child { font-weight:600; letter-spacing:-.01em; }
.sum-total span:last-child { color:var(--accent); font-size:.95rem; }

/* pricing */
.pricing-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; max-width:820px; margin:0 auto; }
.plan-card { background:var(--surface); border:1px solid var(--border); border-radius:22px; padding:30px 24px; position:relative; box-shadow:var(--card-shadow); transition:transform .25s,border-color .25s; }
.plan-card:hover { transform:translateY(-4px); }
.plan-card.hl { border-color:var(--cta,#0A84FF); background:linear-gradient(160deg,var(--accent-soft),var(--surface)); }
.plan-badge { position:absolute; top:-11px; left:50%; transform:translateX(-50%); color:#fff; font-size:.62rem; font-weight:700; letter-spacing:.07em; text-transform:uppercase; padding:3px 12px; border-radius:980px; white-space:nowrap; }
.badge-blue { background:var(--cta,#0A84FF); }
.badge-grad { background:linear-gradient(135deg,#4A8FFF,#7B5FFF); }
.plan-name { font-size:.7rem; font-weight:600; color:var(--text2); text-transform:uppercase; letter-spacing:.06em; margin-bottom:8px; }
.plan-price { font-size:2.3rem; font-weight:700; letter-spacing:-.04em; line-height:1; }
.plan-price sup { font-size:1rem; font-weight:500; vertical-align:top; margin-top:5px; }
.plan-per { font-size:.75rem; color:var(--text3); margin-top:3px; margin-bottom:4px; }
.plan-trial { font-size:.73rem; color:var(--accent); font-weight:500; margin-bottom:18px; min-height:18px; }
.plan-div { height:1px; background:var(--border); margin-bottom:16px; }
.plan-perks { list-style:none; display:flex; flex-direction:column; gap:9px; }
.plan-perks li { display:flex; gap:8px; align-items:flex-start; font-size:.8rem; color:var(--text2); line-height:1.4; }
.ck { color:var(--accent); flex-shrink:0; }

/* privacy */
.priv-box { max-width:680px; margin:0 auto; background:var(--surface); border:1px solid var(--border); border-radius:22px; padding:44px; box-shadow:var(--card-shadow); }
.priv-h { font-size:.78rem; font-weight:700; color:var(--accent); text-transform:uppercase; letter-spacing:.07em; margin:22px 0 8px; }
.priv-h:first-child { margin-top:0; }
.priv-box p { font-size:.86rem; color:var(--text2); line-height:1.78; font-weight:300; margin-bottom:4px; }
.priv-list { list-style:none; margin:6px 0 10px; }
.priv-list li { font-size:.86rem; color:var(--text2); line-height:1.65; font-weight:300; padding:3px 0 3px 18px; position:relative; }
.priv-list li::before { content:'•'; position:absolute; left:4px; color:var(--accent); }

/* disclaimer */
.disclaimer { background:var(--accent-soft); border-top:1px solid var(--accent-border); padding:18px 24px; text-align:center; }
.disclaimer p { font-size:.78rem; color:var(--text2); font-weight:300; line-height:1.6; max-width:700px; margin:0 auto; }
.disclaimer strong { color:var(--text); font-weight:600; }

/* steps */
.steps-wrap { max-width:880px; margin:0 auto; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; }
.step-card { background:var(--surface); border:1px solid var(--border); border-radius:20px; padding:32px 24px; text-align:center; box-shadow:var(--card-shadow); }
.step-num { width:40px; height:40px; margin:0 auto 16px; background:linear-gradient(135deg,#4A8FFF,#7B5FFF); border-radius:12px; display:flex; align-items:center; justify-content:center; font-size:.9rem; font-weight:800; color:#fff; }
.step-card h3 { font-size:.95rem; font-weight:600; letter-spacing:-.02em; margin-bottom:8px; }
.step-card p { font-size:.82rem; color:var(--text2); line-height:1.6; font-weight:300; }

/* download */
.dl-wrap { padding:120px 24px; text-align:center; }
.dl-card { max-width:600px; margin:0 auto; background:var(--surface); border:1px solid var(--border); border-radius:28px; padding:60px 48px; box-shadow:var(--card-shadow); }
.dl-card h2 { font-size:clamp(1.7rem,3vw,2.4rem); font-weight:700; letter-spacing:-.04em; margin-bottom:12px; }
.dl-card p { color:var(--text2); font-weight:300; margin-bottom:36px; font-size:.95rem; }
.as-btn { display:inline-flex; align-items:center; gap:12px; background:var(--text); color:var(--bg); padding:13px 24px; border-radius:15px; text-decoration:none; font-weight:600; transition:opacity .2s,transform .2s; }
.as-btn:hover { opacity:.88; transform:translateY(-2px); }
.as-btn svg { width:22px; height:22px; fill:currentColor; flex-shrink:0; }
.as-txt small { display:block; font-size:.6rem; font-weight:400; opacity:.6; }
.as-txt strong { font-size:1rem; letter-spacing:-.02em; }

/* footer */
footer { background:var(--bg); border-top:1px solid var(--border); padding:28px 32px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:14px; transition:var(--tr); }
.ft-brand { font-size:.82rem; font-weight:700; }
.ft-links { display:flex; gap:20px; }
.ft-links a,.ft-links button { font-size:.75rem; color:var(--text3); text-decoration:none; background:none; border:none; cursor:pointer; font-family:inherit; transition:color .2s; padding:0; }
.ft-links a:hover,.ft-links button:hover { color:var(--text); }
.ft-copy { font-size:.72rem; color:var(--text3); }

/* anim */
@keyframes fadeUp { from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)} }
.reveal { opacity:0; transform:translateY(26px); transition:opacity .65s ease,transform .65s ease; }
.reveal.visible { opacity:1; transform:translateY(0); }
.d1{transition-delay:.08s} .d2{transition-delay:.16s} .d3{transition-delay:.24s}

/* responsive */
@media(max-width:900px){
  nav ul{display:none}
  .apps-grid{grid-template-columns:1fr}
  .bento{grid-template-columns:1fr 1fr}
  .bento-wide{grid-column:span 2}
  .calc-wrap{grid-template-columns:1fr;gap:40px}
  .pricing-cards{grid-template-columns:1fr;max-width:360px}
  .steps-wrap{grid-template-columns:1fr;max-width:400px}
}
@media(max-width:600px){
  nav{padding:0 16px}
  .ss-track{padding:10px 16px 26px}
  .bento{grid-template-columns:1fr}
  .bento-wide{grid-column:span 1}
  .priv-box{padding:28px 20px}
  .dl-card{padding:40px 24px}
  footer{padding:22px 20px;flex-direction:column;align-items:flex-start}
  .card-head{padding:24px 24px 16px}
  .card-pills,.card-foot{padding-left:24px;padding-right:24px}
}