/* =========================================================
   TravelQ — design system v2
   ========================================================= */
:root{
  --navy:#0b1f33; --navy-2:#13304d; --navy-3:#1d4466;
  --teal:#0f8c9a; --teal-d:#0b7380; --brand:#42cad7; --teal-50:#ecf8f9; --teal-100:#d3eff2;
  --ink:#0b1f33; --text:#334155; --muted:#64748b; --subtle:#94a3b8;
  --line:#e5eaf0; --line-2:#d7dee7; --bg:#ffffff; --alt:#f6f8fb;
  --ok:#047857; --ok-bg:#ecfdf5; --warn:#9a3412; --warn-bg:#fff7ed; --bad:#b91c1c; --bad-bg:#fef2f2;
  --amber:#b7791f; --amber-bg:#fdf6e7;
  --r-sm:8px; --r:12px; --r-lg:16px; --r-xl:20px;
  --sh-1:0 1px 2px rgba(11,31,51,.06);
  --sh-2:0 1px 2px rgba(11,31,51,.04),0 8px 24px rgba(11,31,51,.06);
  --sh-3:0 2px 6px rgba(11,31,51,.05),0 24px 48px rgba(11,31,51,.10);
  --ease:cubic-bezier(.2,.8,.2,1);
  --nav-h:68px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 8px);-webkit-text-size-adjust:100%}
body{margin:0;font-family:"Be Vietnam Pro",system-ui,-apple-system,"Segoe UI",Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);line-height:1.65;font-size:16px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit;text-decoration:none}
img{max-width:100%}
h1,h2,h3{color:var(--ink);margin:0 0 .5em;font-weight:700}
h1{font-size:clamp(2.1rem,4.4vw,3.5rem);line-height:1.12;letter-spacing:-.03em;font-weight:800}
h2{font-size:clamp(1.65rem,3vw,2.4rem);line-height:1.2;letter-spacing:-.025em;font-weight:800}
h3{font-size:1.08rem;line-height:1.35;letter-spacing:-.01em}
p{margin:0 0 1em}
b,strong{font-weight:700;color:inherit}
.container{width:100%;max-width:1200px;margin:0 auto;padding:0 24px}
.narrow{max-width:840px}
.small{font-size:.875rem;color:var(--muted)}
.note{font-size:.84rem;color:var(--muted);font-style:italic;margin:0}
.center{text-align:center;margin-top:16px}
.i{width:1.15em;height:1.15em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;vertical-align:-.2em}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--navy);color:#fff;padding:8px 16px;border-radius:var(--r-sm)}
.skip:focus{left:16px}
:focus-visible{outline:2px solid var(--teal);outline-offset:2px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--teal);color:#fff;border:1px solid transparent;border-radius:10px;padding:12px 20px;font-weight:600;font-size:.97rem;line-height:1.2;cursor:pointer;font-family:inherit;transition:background .2s,border-color .2s,color .2s,box-shadow .2s,transform .2s;box-shadow:0 1px 2px rgba(11,31,51,.12),inset 0 1px 0 rgba(255,255,255,.12);text-align:center}
.btn:hover{background:var(--teal-d);transform:translateY(-1px)}
.btn:active{transform:none}
.btn:disabled{opacity:.55;cursor:not-allowed;transform:none}
.btn-lg{padding:15px 24px;font-size:1rem;border-radius:12px}
.btn-sm{padding:9px 14px;font-size:.88rem;border-radius:9px}
.btn-ghost{background:#fff;color:var(--ink);border-color:var(--line-2);box-shadow:var(--sh-1)}
.btn-ghost:hover{background:#fff;border-color:var(--teal);color:var(--teal-d)}
.btn-light{background:#fff;color:var(--ink);box-shadow:none}
.btn-light:hover{background:var(--teal-50);color:var(--teal-d)}
.btn .i{width:1.1em;height:1.1em}

/* ---------- nav ---------- */
.nav{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid rgba(11,31,51,.07)}
.nav-inner{display:flex;align-items:center;gap:12px;height:var(--nav-h)}
.logo{display:flex;align-items:center;margin-right:auto}
.logo img{display:block;height:40px;width:auto}
.nav-links{display:flex;align-items:center;gap:4px;font-weight:500;font-size:.9rem;color:var(--text)}
.nav-links a{white-space:nowrap}
.nav-links a:not(.btn){padding:8px 11px;border-radius:8px;transition:color .2s,background .2s}
.nav-links a:not(.btn):hover{color:var(--ink);background:var(--alt)}
.nav-links .btn{margin-left:8px}
.btn-present{background:var(--navy);gap:7px}
.btn-present:hover{background:var(--navy-2)}
.btn-present .i{width:.85em;height:.85em}
.menu-btn{display:none;width:42px;height:42px;border-radius:10px;border:1px solid var(--line-2);background:#fff;color:var(--ink);cursor:pointer;place-items:center;padding:0}
.menu-btn .i{width:22px;height:22px}

/* ---------- hero ---------- */
.hero{position:relative;overflow:hidden;padding:88px 0 56px;background:
  radial-gradient(900px 520px at 88% -8%,rgba(66,202,215,.16),transparent 62%),
  radial-gradient(700px 420px at -6% 4%,rgba(15,140,154,.06),transparent 60%),
  linear-gradient(180deg,#f7fbfc 0%,#fff 72%)}
.hero::before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(11,31,51,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(11,31,51,.035) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse 70% 60% at 70% 20%,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 70% 60% at 70% 20%,#000 20%,transparent 75%);pointer-events:none}
.hero .container{position:relative}
.hero-grid{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.8fr);gap:64px;align-items:center}
.pill{display:inline-flex;align-items:center;gap:8px;background:#fff;border:1px solid var(--line-2);color:var(--navy-3);font-weight:600;font-size:.82rem;padding:6px 14px 6px 10px;border-radius:999px;margin-bottom:24px;box-shadow:var(--sh-1)}
.pill-dot{width:8px;height:8px;border-radius:50%;background:var(--brand);box-shadow:0 0 0 4px rgba(66,202,215,.2)}
.hero h1{max-width:13.5em;margin-bottom:20px}
.hl{color:var(--teal);background:none}
.lead{font-size:1.1rem;line-height:1.7;color:#475569;max-width:36em;margin-bottom:32px}
.hero-cta{display:flex;flex-wrap:wrap;gap:12px}
.hero-card{background:#fff;border-radius:var(--r-xl);box-shadow:var(--sh-3);padding:28px;border:1px solid var(--line)}
.hc-head{display:flex;justify-content:space-between;align-items:center;font-weight:700;color:var(--ink);margin-bottom:20px;font-size:.98rem}
.tag{display:inline-block;background:var(--amber-bg);color:var(--amber);border:1px solid #f3e1b8;font-size:.7rem;font-weight:700;padding:3px 9px;border-radius:6px;text-transform:uppercase;letter-spacing:.06em}
.hc-bar{display:flex;height:44px;border-radius:10px;overflow:hidden;font-size:.78rem;font-weight:600;color:#fff;background:var(--alt);gap:3px}
.seg{display:flex;align-items:center;justify-content:center;white-space:nowrap;overflow:hidden;padding:0 8px}
.seg-be{background:linear-gradient(135deg,var(--teal),var(--brand));border-radius:10px 0 0 10px}
.seg-rest{background:#e9eef4;color:var(--navy-3);border-radius:0 10px 10px 0}
.hc-scale{position:relative;display:flex;justify-content:space-between;font-size:.72rem;color:var(--subtle);font-weight:600;margin:6px 0 14px;font-variant-numeric:tabular-nums}
.hc-scale span:nth-child(2){position:absolute;left:30%;transform:translateX(-50%)}
.hc-row{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-top:1px solid var(--line);font-size:.93rem}
.hc-row span{color:var(--muted)} .hc-row b{color:var(--ink);text-align:right;font-weight:600}
.hc-foot{display:flex;align-items:center;gap:10px;margin-top:14px;background:var(--teal-50);color:var(--teal-d);font-weight:600;border-radius:10px;padding:12px 14px;font-size:.9rem}
.trust{list-style:none;padding:0;margin:64px 0 0;display:grid;grid-template-columns:repeat(4,1fr);background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-2)}
.trust li{display:flex;gap:14px;align-items:flex-start;padding:20px 22px}
.trust li+li{border-left:1px solid var(--line)}
.trust .i{width:40px;height:40px;padding:9px;border-radius:10px;background:var(--teal-50);color:var(--teal);stroke-width:1.7}
.trust b{display:block;color:var(--ink);font-size:.93rem;line-height:1.35}
.trust span{display:block;color:var(--muted);font-size:.82rem;margin-top:2px}

/* ---------- sections ---------- */
.section{padding:104px 0}
.alt{background:var(--alt);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.section-head{text-align:center;max-width:740px;margin:0 auto 56px}
.section-head p{color:var(--muted);font-size:1.06rem;margin:12px 0 0}
.eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--teal);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:.74rem;margin-bottom:14px}
.eyebrow::before{content:"";width:18px;height:2px;border-radius:2px;background:currentColor}
.section-head .eyebrow::after{content:"";width:18px;height:2px;border-radius:2px;background:currentColor}
.eyebrow-light{color:var(--brand)}

.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.card{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;box-shadow:var(--sh-1);transition:box-shadow .3s var(--ease),transform .3s var(--ease),border-color .3s}
.card:hover{box-shadow:var(--sh-2);border-color:var(--line-2);transform:translateY(-2px)}
.card h3{margin-bottom:8px}
.card p{color:var(--muted);margin:0;font-size:.95rem}
.ic{width:44px;height:44px;border-radius:11px;background:var(--teal-50);color:var(--teal);display:grid;place-items:center;margin-bottom:18px;border:1px solid var(--teal-100)}
.ic .i{width:22px;height:22px}
.card.pain .ic{background:#f4f6f9;color:var(--navy-3);border-color:var(--line)}
.big-quote{text-align:center;font-size:clamp(1.1rem,2vw,1.35rem);line-height:1.55;max-width:760px;margin:48px auto 0;color:var(--navy-3);font-weight:500;letter-spacing:-.01em}
.big-quote b{color:var(--teal)}

/* steps */
.steps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:20px;position:relative}
.steps li{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px 24px;position:relative;box-shadow:var(--sh-1)}
.steps p{color:var(--muted);margin:0;font-size:.94rem}
.num{display:inline-block;font-weight:800;font-size:.82rem;letter-spacing:.06em;color:var(--teal);background:var(--teal-50);border:1px solid var(--teal-100);border-radius:8px;padding:4px 9px;margin-bottom:18px;font-variant-numeric:tabular-nums}
.callout{display:flex;gap:24px;align-items:center;margin-top:24px;background:#fff;border:1px solid var(--line);border-left:4px solid var(--teal);border-radius:var(--r-lg);padding:24px 28px;box-shadow:var(--sh-1)}
.callout h3{margin-bottom:6px}
.callout p{margin:0;color:var(--muted)}
.callout-icon{flex:none;width:64px;height:64px;border-radius:14px;background:var(--navy);color:#fff;font-weight:800;font-size:1.15rem;letter-spacing:.04em;display:grid;place-items:center}

/* combo OTA + TA */
.combo{display:grid;grid-template-columns:1fr auto 1fr;gap:20px;align-items:stretch}
.combo-col{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:30px;box-shadow:var(--sh-1)}
.combo-col h3{font-size:1.25rem;margin:4px 0 14px}
.combo-col ul{list-style:none;padding:0;margin:0}
.combo-col li{padding:9px 0 9px 32px;position:relative;color:var(--text);border-top:1px solid var(--line);font-size:.96rem}
.combo-col li:first-child{border-top:0}
.combo-col li::before{content:"";position:absolute;left:0;top:12px;width:20px;height:20px;border-radius:50%;background:var(--teal-50) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230f8c9a' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5'/%3E%3C/svg%3E") center/12px no-repeat}
.combo-tag{display:inline-block;font-size:.7rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;padding:5px 10px;border-radius:6px;background:var(--teal-50);color:var(--teal-d)}
.combo-tag.ta{background:#eef2f7;color:var(--navy-3)}
.combo-plus{display:grid;place-items:center;width:48px;height:48px;border-radius:50%;background:#fff;border:1px solid var(--line-2);align-self:center;color:var(--ink);box-shadow:var(--sh-1)}
.combo-plus .i{width:22px;height:22px}
.combo-result{display:flex;gap:24px;align-items:flex-start;margin-top:20px;background:linear-gradient(135deg,var(--navy) 0%,var(--navy-2) 100%);color:#cbd5e1;border-radius:var(--r-lg);padding:32px;box-shadow:var(--sh-3);position:relative;overflow:hidden}
.combo-result::after{content:"";position:absolute;right:-120px;top:-120px;width:320px;height:320px;border-radius:50%;background:radial-gradient(circle,rgba(66,202,215,.22),transparent 70%);pointer-events:none}
.combo-result h3{color:#fff;font-size:1.3rem;margin-bottom:14px}
.combo-eq{flex:none;display:grid;place-items:center;width:52px;height:52px;border-radius:12px;background:var(--teal);color:#fff;font-size:1.7rem;font-weight:700}
.combo-goals{display:flex;flex-wrap:wrap;gap:10px}
.combo-goals span{display:inline-flex;align-items:center;gap:10px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);border-radius:10px;padding:9px 14px;font-weight:600;font-size:.92rem;color:#fff}
.combo-goals em{font-style:normal;display:grid;place-items:center;width:22px;height:22px;border-radius:6px;background:var(--brand);color:var(--navy);font-size:.78rem;font-weight:800}
.combo-note{margin:18px 0 0;color:#aab8c8;font-size:.95rem;max-width:62em}

/* calc base */
.calc-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:stretch}
.calc{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:28px;box-shadow:var(--sh-1)}
.calc h3{display:flex;align-items:center;gap:10px}
.stepno{display:inline-grid;place-items:center;width:26px;height:26px;border-radius:8px;background:var(--navy);color:#fff;font-size:.8rem;font-weight:700;flex:none}
.calc label{display:block;font-weight:600;font-size:.86rem;color:var(--navy-3);margin-bottom:14px}
.calc input,.form input{width:100%;margin-top:6px;padding:12px 14px;border:1px solid var(--line-2);border-radius:10px;font:inherit;font-size:1rem;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s;-webkit-appearance:none;appearance:none}
.calc input:hover,.form input:hover{border-color:#c3ccd8}
.calc input:focus,.form input:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(15,140,154,.12)}
.hint{font-size:.84rem;color:var(--muted);margin:14px 0 0;line-height:1.55}
.example{background:#fff;border:1px dashed #e3cf9f;border-radius:var(--r-lg);padding:24px 28px}
.example .tag{margin-bottom:12px}
.example p{margin:0 0 8px;color:var(--text)}

/* dashboard mock */
.dash{max-width:920px;margin:0 auto;background:#fff;border-radius:var(--r-lg);box-shadow:var(--sh-3);overflow:hidden;border:1px solid var(--line)}
.dash-top{display:flex;align-items:center;gap:7px;background:var(--navy);padding:13px 18px}
.dot{width:10px;height:10px;border-radius:50%;background:rgba(255,255,255,.22)}
.dash-title{color:#cbd5e1;font-size:.85rem;margin-left:10px;font-weight:500}
.dash-title em{color:var(--brand);font-style:normal}
.dash-body{padding:24px}
.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r)}
.dash table{width:100%;border-collapse:collapse;min-width:520px}
.dash th{text-align:left;background:var(--alt);color:var(--navy-3);font-size:.78rem;text-transform:uppercase;letter-spacing:.05em;font-weight:700;padding:12px 16px;border-bottom:1px solid var(--line)}
.dash td{padding:14px 16px;border-bottom:1px solid var(--line);font-size:.94rem;color:var(--ink)}
.dash tbody tr:last-child td{border-bottom:0}
.dash tbody tr:hover td{background:#fafcfd}
.dash td small{color:var(--muted);margin-left:8px;font-size:.82rem}
.qty{display:inline-grid;place-items:center;min-width:36px;height:30px;border-radius:8px;background:var(--teal-50);color:var(--teal-d);font-weight:700;font-variant-numeric:tabular-nums;border:1px solid var(--teal-100)}
.qty.muted{background:#f4f6f9;color:var(--subtle);border-color:var(--line)}
.qty.zero{background:var(--bad-bg);color:var(--bad);border-color:#fbd5d5}
.lock{color:var(--bad)!important;font-weight:600;display:inline-flex;align-items:center;gap:4px}
.lock .i{width:14px;height:14px}
.dash-actions{display:flex;flex-wrap:wrap;gap:14px;align-items:center;margin-top:18px}

/* FAQ */
.faq-list{background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--sh-1);overflow:hidden}
details{border-top:1px solid var(--line);padding:0 28px}
details:first-child{border-top:0}
summary{cursor:pointer;font-weight:600;color:var(--ink);padding:22px 40px 22px 0;list-style:none;position:relative;font-size:1.02rem;line-height:1.45}
summary::-webkit-details-marker{display:none}
summary::after{content:"";position:absolute;right:0;top:50%;width:26px;height:26px;margin-top:-13px;border-radius:50%;border:1px solid var(--line-2);background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230b1f33' stroke-width='2.2' stroke-linecap='round'%3E%3Cpath d='M12 6v12M6 12h12'/%3E%3C/svg%3E") center/12px no-repeat;transition:transform .25s var(--ease),background-color .2s}
details[open] summary::after{transform:rotate(45deg);background-color:var(--teal-50);border-color:var(--teal-100)}
summary:hover{color:var(--teal-d)}
details p{color:var(--muted);margin:-6px 0 22px;max-width:62em}

/* contact */
.cta{background:radial-gradient(800px 480px at 100% 0%,rgba(66,202,215,.16),transparent 60%),linear-gradient(160deg,var(--navy) 0%,#0e2740 100%);color:#c3cfdc;border:0}
.cta h2{color:#fff}
.cta-lead{font-size:1.06rem;color:#aab8c8;max-width:34em}
.cta-inner{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:64px;align-items:start}
.commit{margin-top:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.1);border-radius:var(--r);padding:18px 20px}
.commit b{color:#fff;display:flex;align-items:center;gap:10px;margin-bottom:6px}
.commit b .i{color:var(--brand)}
.commit p{margin:0;font-size:.94rem}
.company{display:flex;gap:14px;align-items:flex-start;margin-top:24px;padding-bottom:20px;border-bottom:1px solid rgba(255,255,255,.1)}
.company-ic{flex:none;width:44px;height:44px;border-radius:11px;background:rgba(66,202,215,.14);color:var(--brand);display:grid;place-items:center}
.company-ic .i{width:22px;height:22px}
.company b{display:block;color:#fff;font-size:1.05rem;line-height:1.4}
.company small{display:block;font-size:.76rem;color:#8ea1b6;letter-spacing:.02em;margin-top:3px}
.contact-list{list-style:none;padding:0;margin:8px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:0 24px}
.contact-list li{display:flex;gap:12px;align-items:flex-start;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.07);font-size:.92rem;line-height:1.5}
.contact-list li.wide{grid-column:1/-1}
.contact-list .i{color:var(--brand);margin-top:2px;width:18px;height:18px}
.contact-list b{color:#fff;font-weight:600}
.contact-list a{color:#fff;text-decoration:underline;text-decoration-color:rgba(66,202,215,.55);text-underline-offset:3px}
.contact-list a b{color:#fff}
.contact-list a:hover{text-decoration-color:var(--brand)}
.contact-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:28px}
.form{background:#fff;border-radius:var(--r-xl);padding:32px;display:grid;gap:12px;box-shadow:0 30px 60px rgba(0,0,0,.28);color:var(--text)}
.form h3{margin:0 0 6px;font-size:1.25rem}
.form input{margin:0}
.form .btn{width:100%}
.form .btn-send{margin-top:4px}
.form-msg{margin:6px 0 0;padding:12px 14px;border-radius:10px;line-height:1.5}
.form-msg.ok{border:1px solid #a7e3c4}.form-msg.err{border:1px solid #f5c2c2}
.form-msg.ok{background:var(--ok-bg);color:#065f46}
.form-msg.err{background:var(--bad-bg);color:#991b1b}
.form-msg a{text-decoration:underline}

/* footer */
.footer{background:#071626;color:#8193a7;padding:40px 0;font-size:.9rem;border-top:1px solid rgba(255,255,255,.06)}
.footer-inner{display:flex;flex-wrap:wrap;gap:12px 32px;align-items:center}
.footer-inner .logo{margin-right:0}
.footer-inner .logo img{height:50px}
.footer p{margin:0}
.footer .small{color:#6b7f95;flex-basis:100%;padding-top:16px;border-top:1px solid rgba(255,255,255,.06)}

/* reveal */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease)}
.reveal.in{opacity:1;transform:none}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* =========================================================
   Ladder
   ========================================================= */
.ladder-sec{background:#fff}
.ladder-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:72px;align-items:center}
.ladder-story h2{margin-bottom:24px}
.hooks{display:grid;gap:12px}
.hook{display:flex;gap:16px;align-items:center;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:16px 18px;box-shadow:var(--sh-1)}
.hook p{margin:0;font-weight:600;color:var(--ink);font-size:1.02rem;line-height:1.45}
.hook-ic{flex:none;width:44px;height:44px;border-radius:11px;display:grid;place-items:center;background:var(--teal-50);color:var(--teal);border:1px solid var(--teal-100)}
.hook-ic .i{width:22px;height:22px}
.answer{margin-top:20px;border-left:3px solid var(--teal);padding:4px 0 4px 20px}
.answer p{margin:0;color:var(--text);font-size:1.02rem}
.answer b{color:var(--ink)}
.ladder-visual{background:var(--alt);border:1px solid var(--line);border-radius:var(--r-xl);padding:28px 28px 22px}
.ladder{position:relative;display:grid;grid-template-columns:repeat(4,1fr);gap:10px;align-items:end;height:300px;padding-top:44px;border-bottom:2px solid var(--ink);background-image:linear-gradient(to top,rgba(11,31,51,.06) 1px,transparent 1px);background-size:100% 25%}
.lstep{position:relative;height:100%;display:flex;flex-direction:column;justify-content:flex-end}
.lbar{height:0;border-radius:10px 10px 0 0;padding:14px 12px;display:flex;flex-direction:column;gap:3px;color:#fff;overflow:hidden;transition:height 1s var(--ease)}
.ladder.in .lbar{height:var(--h)}
.lstep.s2 .lbar{transition-delay:.12s}.lstep.s3 .lbar{transition-delay:.24s}.lstep.s4 .lbar{transition-delay:.36s}
.lbar b{font-size:1rem;white-space:nowrap;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.lbar span{font-size:.8rem;font-weight:500;line-height:1.3;opacity:.85}
.s1 .lbar{background:linear-gradient(180deg,var(--brand),var(--teal));box-shadow:0 12px 28px rgba(15,140,154,.28)}
.s2 .lbar{background:#3a5a7c}
.s3 .lbar{background:#24456a}
.s4 .lbar{background:var(--navy)}
.lbadge{position:absolute;left:0;right:0;bottom:calc(var(--h) + 10px);background:var(--ink);color:#fff;font-weight:600;font-size:.72rem;padding:6px 8px;border-radius:8px;text-align:center;line-height:1.25;opacity:0;transition:opacity .4s .9s;box-shadow:var(--sh-2)}
.lbadge::after{content:"";position:absolute;left:50%;transform:translateX(-50%);top:100%;border:5px solid transparent;border-top-color:var(--ink)}
.ladder.in .lbadge{opacity:1}
.ladder-axis{display:flex;justify-content:space-between;font-size:.76rem;color:var(--muted);font-weight:600;margin-top:8px;text-transform:uppercase;letter-spacing:.06em}
.ladder-cap{display:grid;gap:10px;margin:20px 0 12px}
.lc{display:flex;gap:12px;align-items:flex-start;background:#fff;border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.lc i{flex:none;width:12px;height:12px;border-radius:3px;margin-top:6px;background:linear-gradient(90deg,#3a5a7c,var(--navy))}
.lc-tq{border-color:var(--teal-100);background:var(--teal-50)}
.lc-tq i{background:var(--teal)}
.lc b{color:var(--ink);font-size:.93rem}
.lc p{margin:2px 0 0;font-size:.86rem;color:var(--muted)}

/* =========================================================
   Break-even calculator
   ========================================================= */
.be-app{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:20px;align-items:start}
.be-left,.be-out{display:grid;gap:20px}
.be-app .calc{padding:24px}
.be-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:16px;flex-wrap:wrap}
.be-head h3{margin:0}
.be-target input{font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:-.01em}
.tag-demo{background:var(--amber-bg);color:var(--amber);border:1px solid #f3e1b8;font-size:.68rem;font-weight:700;padding:3px 9px;border-radius:6px;text-transform:uppercase;letter-spacing:.06em}
.rt-cols,.rt{grid-template-columns:minmax(0,1fr) 100px 100px minmax(0,1.15fr) 28px}
.rt-cols{display:grid;gap:8px;font-size:.68rem;font-weight:700;color:var(--muted);text-transform:uppercase;letter-spacing:.05em;padding:0 12px 8px}
.rt-list{display:grid;gap:8px}
.rt{display:grid;gap:8px;align-items:center;border:1px solid var(--line);border-radius:var(--r);padding:8px 10px 8px 12px;background:#fff;position:relative;box-shadow:inset 3px 0 0 var(--c)}
.rt:hover{border-color:var(--line-2)}
.rt-f>span{display:none}
.rt-name{display:flex;align-items:center;gap:8px}
.dot-c{display:inline-block;width:10px;height:10px;border-radius:3px;background:var(--c);flex:none}
.be-app .rt input{margin:0;padding:9px 10px;font-size:.94rem}
.rt-name input{font-weight:600;color:var(--ink)}
.stp{display:flex;align-items:stretch;border:1px solid var(--line-2);border-radius:10px;overflow:hidden;background:#fff}
.stp-b{width:28px;border:0;background:var(--alt);color:var(--ink);font-size:1.05rem;font-weight:600;cursor:pointer;font-family:inherit;flex:none;transition:background .15s,color .15s}
.stp-b:hover{background:var(--teal-50);color:var(--teal-d)}
.be-app .stp input{border:0;border-radius:0;text-align:center;padding:9px 2px;min-width:0;font-weight:700;font-variant-numeric:tabular-nums}
.be-app .stp input:focus{box-shadow:inset 0 0 0 2px rgba(15,140,154,.3)}
.money{position:relative}
.be-app .money input{padding-right:28px;text-align:right;font-weight:600;font-variant-numeric:tabular-nums}
.money b{position:absolute;right:11px;top:50%;transform:translateY(-50%);color:var(--subtle);font-weight:600}
.rt-del{width:28px;height:28px;border-radius:8px;border:1px solid transparent;background:transparent;color:var(--subtle);font-size:1.2rem;cursor:pointer;line-height:1;transition:.15s}
.rt-del:hover{background:var(--bad-bg);color:var(--bad);border-color:#fbd5d5}
.rt-del:disabled{opacity:.3;cursor:not-allowed;background:none}
.rt-add{margin-top:12px}
/* progress */
.be-pct{font-size:1.75rem;color:var(--warn);font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.be-pct.ok{color:var(--ok)}
.pbar{position:relative;height:16px;background:#edf1f6;border-radius:999px;margin:34px 0 12px}
.pbar-seg{display:flex;height:100%;border-radius:999px;overflow:hidden}
.pbar-seg i{display:block;height:100%;transition:width .35s ease;border-right:2px solid #fff}
.pbar-mark{position:absolute;top:-8px;bottom:-8px;width:2px;background:var(--ink);border-radius:2px;transform:translateX(-50%);transition:left .35s}
.pbar-mark span{position:absolute;bottom:100%;left:50%;transform:translateX(-50%);font-size:.68rem;font-weight:700;color:#fff;background:var(--ink);white-space:nowrap;margin-bottom:4px;padding:2px 7px;border-radius:5px;text-transform:uppercase;letter-spacing:.04em}
.pbar-legend{display:flex;justify-content:space-between;flex-wrap:wrap;gap:4px 12px;font-size:.84rem;color:var(--muted)}
.pbar-legend b{color:var(--ink);font-variant-numeric:tabular-nums}
.be-status{margin-top:14px;display:grid;gap:8px}
.st{padding:11px 14px;border-radius:10px;font-size:.9rem;line-height:1.5}
.st.ok{background:var(--ok-bg);color:#065f46;border:1px solid #c6f0dc}
.st.short{background:var(--warn-bg);color:var(--warn);border:1px solid #fbdcbc}
.st.bad{background:var(--bad-bg);color:#991b1b;border:1px solid #fbd5d5;font-weight:600}
.st.warn{background:var(--alt);color:var(--muted);border:1px solid var(--line)}
/* cap */
.cap-badge{font-size:.74rem;font-weight:700;padding:4px 10px;border-radius:6px}
.cap-badge.ok{background:var(--ok-bg);color:var(--ok)}
.cap-badge.bad{background:#fee2e2;color:var(--bad)}
.be-cap.over{border-color:#f5b5b5;box-shadow:0 0 0 4px rgba(239,68,68,.08)}
.cap-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-bottom:16px}
.cap-stats div{background:var(--alt);border:1px solid var(--line);border-radius:10px;padding:10px 12px;display:flex;flex-direction:column}
.cap-stats span{font-size:.72rem;color:var(--muted);font-weight:500}
.cap-stats b{font-size:1.02rem;color:var(--ink);font-variant-numeric:tabular-nums}
.cap-stats b.bad{color:var(--bad)}
.room-grid{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.sq{display:inline-block;width:16px;height:16px;border-radius:4px}
.sq-self{background:#fff;border:1.5px solid var(--c,#cbd5e1);opacity:.45}
.grid-legend .sq-self{--c:#94a3b8}
.sq-over{outline:2px solid var(--bad);outline-offset:1px}
.sq-tq{background:var(--teal)}
.cap-line{display:inline-block;width:2px;height:22px;background:var(--bad);border-radius:2px;margin:0 3px}
.sq-line{display:inline-block;width:2px;height:13px;background:var(--bad);border-radius:2px;vertical-align:middle;margin-right:6px}
.grid-legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:.76rem;color:var(--muted);margin-top:12px}
.grid-legend .sq{width:12px;height:12px;vertical-align:middle;margin-right:6px}
.grid-legend .sq-self{opacity:1}
.be-cap .hint{margin-top:10px}
/* breakdown */
.be-break h3{margin-bottom:16px}
.brk{display:grid;gap:14px}
.brk-top,.brk-sub,.brk-total{display:flex;justify-content:space-between;gap:10px}
.brk-top span{display:flex;align-items:center;gap:8px;font-weight:600;color:var(--ink)}
.brk-top b{color:var(--ink);font-variant-numeric:tabular-nums}
.brk-sub{font-size:.8rem;color:var(--muted);font-variant-numeric:tabular-nums}
.brk-bar{height:6px;background:#edf1f6;border-radius:99px;margin-top:6px;overflow:hidden}
.brk-bar i{display:block;height:100%;background:var(--c);transition:width .35s}
.brk-total{border-top:1px solid var(--line);padding-top:12px;font-weight:700;color:var(--ink);font-variant-numeric:tabular-nums}
.be-tip{margin-top:16px;background:var(--navy);color:#cbd5e1;border-radius:var(--r);padding:16px 18px;font-size:.9rem}
.be-tip:empty{display:none}
.be-tip b{color:#fff}
.be-tip ul{list-style:none;margin:8px 0;padding:0;display:grid;gap:6px}
.be-tip li{display:block;padding-left:18px;position:relative}
.be-tip li .dot-c{position:absolute;left:0;top:.45em}
.be-tip p{margin:6px 0 0}
.be-after{margin-top:20px}
.be-after .example{margin:0}
.calc.ta-card h3{margin-bottom:4px}
.ta-flow{list-style:none;padding:0;margin:18px 0 0;display:grid;gap:10px}
.ta-flow li{display:flex;gap:14px;align-items:flex-start;background:var(--alt);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px}
.ta-flow li>span{flex:none;width:28px;height:28px;border-radius:8px;background:var(--navy);color:#fff;font-weight:700;font-size:.85rem;display:grid;place-items:center}
.ta-flow b{color:var(--ink);display:block;margin-bottom:2px;font-size:.95rem}
.ta-flow p{margin:0;color:var(--muted);font-size:.9rem}
@media (min-width:1001px){ .be-out{position:sticky;top:calc(var(--nav-h) + 16px)} }

/* PDF export card */
.be-export{margin-top:20px;border-top:3px solid var(--teal)}
.be-export .ex-lead{margin:0 0 18px}
.tag-pdf{display:inline-flex;align-items:center;gap:6px;font-size:.72rem;font-weight:700;background:var(--teal-50);color:var(--teal-d);padding:4px 10px;border-radius:6px;border:1px solid var(--teal-100);text-transform:uppercase;letter-spacing:.05em}
.tag-pdf .i{width:14px;height:14px}
.ex-grid{display:grid;grid-template-columns:1fr 1fr;gap:0 16px}
.ex-grid label{margin-bottom:14px;font-size:.84rem}
.ex-grid input{padding:11px 13px;font-size:.96rem}
.req{color:var(--bad);font-style:normal}
.ex-grid input.err{border-color:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.1)}
.btn-pdf{width:100%;margin-top:6px;background:var(--navy);font-size:1rem;padding:15px 22px;border-radius:12px;box-shadow:0 8px 20px rgba(11,31,51,.18)}
.btn-pdf:hover{background:var(--navy-2)}
.btn-pdf[disabled]{opacity:.7;cursor:wait}
.spin{width:16px;height:16px;border-radius:50%;border:2px solid rgba(255,255,255,.35);border-top-color:#fff;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.ex-msg{font-size:.88rem;margin-top:12px;line-height:1.55}
.ex-msg:empty{display:none}
.ex-msg.bad{color:#991b1b;background:var(--bad-bg);border:1px solid #fbd5d5;padding:11px 14px;border-radius:10px}
.ex-msg.ok{color:#065f46;background:var(--ok-bg);border:1px solid #c6f0dc;padding:11px 14px;border-radius:10px}
.ex-msg.info{color:var(--navy-3)}
@media (min-width:1001px){.ex-grid{grid-template-columns:repeat(3,1fr)}.btn-pdf{width:auto;min-width:380px}}

/* =========================================================
   Presentation mode
   ========================================================= */
.pres-bar,.pres-progress{display:none}
body.presenting{overflow:hidden;background:#fff}
body.presenting .nav,body.presenting .footer{display:none}
body.presenting .slide{display:none}
body.presenting .slide.active{display:flex;position:fixed;inset:0;z-index:60;overflow-y:auto;align-items:stretch;flex-direction:column;justify-content:flex-start;padding:48px 0 92px;animation:slideIn .45s var(--ease)}
body.presenting .slide.active > .container{margin:auto}
body.presenting .reveal{opacity:1;transform:none}
body.presenting .section-head{margin-bottom:36px}
body.presenting #calc.slide.active > .container,body.presenting #contact.slide.active > .container{margin-top:0}
body.presenting #calc .section-head{margin-bottom:24px}
body.presenting #solution .section-head{margin-bottom:28px}
@media (min-width:1100px){ body.presenting{font-size:17px} }
@keyframes slideIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}
body.presenting .pres-bar{display:flex;position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:80;align-items:center;gap:6px;background:rgba(11,31,51,.94);color:#fff;padding:6px;border-radius:14px;box-shadow:0 12px 32px rgba(11,31,51,.3);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.08)}
.pres-bar button{background:transparent;border:0;color:#fff;width:40px;height:40px;border-radius:10px;font-size:1.25rem;cursor:pointer;font-family:inherit;transition:background .15s}
.pres-bar button:hover{background:rgba(255,255,255,.1)}
#presCounter{font-weight:700;min-width:58px;text-align:center;font-variant-numeric:tabular-nums;font-size:.92rem}
.pres-title{font-size:.84rem;color:#9fb0c3;padding-right:8px;max-width:200px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
body.presenting .pres-progress{display:block;position:fixed;top:0;left:0;right:0;height:3px;background:rgba(11,31,51,.06);z-index:80}
.pres-progress div{height:100%;width:0;background:linear-gradient(90deg,var(--teal),var(--brand));transition:width .4s}

/* =========================================================
   Responsive
   ========================================================= */
@media (max-width:1180px){
  .menu-btn{display:grid}
  .nav-links{display:none;position:absolute;top:var(--nav-h);left:0;right:0;background:#fff;flex-direction:column;align-items:stretch;padding:12px 16px 20px;gap:2px;border-bottom:1px solid var(--line);box-shadow:0 18px 30px rgba(11,31,51,.08);font-size:1rem}
  .nav-links.open{display:flex}
  .nav-links a:not(.btn){padding:12px 12px}
  .nav-links .btn{margin:10px 0 0;padding:13px 16px;font-size:1rem}
}
@media (max-width:1000px){
  .be-app{display:flex;flex-direction:column;gap:16px}
  .be-left,.be-out{display:contents}
  .be-in{order:1}.be-progress{order:2}.be-cap{order:3}.be-break{order:4}
}
@media (max-width:980px){
  .hero-grid,.cta-inner,.calc-grid{grid-template-columns:1fr}
  .hero-grid{gap:40px}
  .cta-inner{gap:40px}
  .steps{grid-template-columns:1fr 1fr}
  .cards{grid-template-columns:1fr 1fr}
  .trust{grid-template-columns:1fr 1fr}
  .trust li:nth-child(3){border-left:0}
  .trust li:nth-child(n+3){border-top:1px solid var(--line)}
  .hero{padding:64px 0 48px}
  .ladder-grid{grid-template-columns:1fr;gap:40px}
  .section{padding:88px 0}
}
@media (max-width:860px){
  .combo{grid-template-columns:1fr}
  .combo-plus{justify-self:center;margin:-6px 0}
  .combo-result{flex-direction:column}
}
@media (max-width:640px){
  :root{--nav-h:62px}
  body{font-size:15.5px}
  .container{padding:0 20px}
  .section{padding:72px 0}
  .section-head{margin-bottom:36px;text-align:left}
  .section-head .eyebrow::after{display:none}
  .hero{padding:40px 0 40px}
  .hero h1{font-size:2.05rem;line-height:1.15}
  .lead{font-size:1rem;margin-bottom:24px}
  .pill{font-size:.76rem;margin-bottom:18px}
  .hero-cta .btn{flex:1 1 100%}
  .hero-card{padding:22px}
  .trust{grid-template-columns:1fr;margin-top:32px}
  .trust li{padding:16px 18px}
  .trust li+li{border-left:0;border-top:1px solid var(--line)}
  .cards,.cards.three,.steps{grid-template-columns:1fr}
  .card{padding:22px}
  .callout{flex-direction:column;align-items:flex-start;padding:22px}
  .combo-col,.calc,.form{padding:22px}
  .combo-result{padding:24px}
  .big-quote{text-align:left;margin-top:32px}
  .logo img{height:34px}
  .btn-present{padding:9px 11px}
  .btn-present span{display:none}
  .pres-title{display:none}
  details{padding:0 18px}
  summary{font-size:.98rem;padding:18px 36px 18px 0}
  .dash table{min-width:0}
  .dash th,.dash td{padding:10px 10px;font-size:.82rem}
  .dash th{font-size:.68rem}
  .dash td small{display:flex;margin:4px 0 0}
  .dash-body{padding:14px}
  .contact-list{grid-template-columns:1fr}
  .contact-actions .btn{flex:1 1 0}
  .ladder-visual{padding:20px 16px 16px}
  .ladder{height:260px;gap:6px;padding-top:52px}
  .lbar{padding:10px 7px;border-radius:8px 8px 0 0}
  .lbar b{font-size:.78rem}
  .lbar span{font-size:.7rem}
  .lbadge{font-size:.66rem;padding:5px 4px}
  .hook p{font-size:.96rem}
  .hook{padding:14px}
  /* calculator rows */
  .rt-cols{display:none}
  .rt{grid-template-columns:1fr 1fr;padding:14px;gap:12px}
  .rt-name{grid-column:1/-1;padding-right:34px}
  .rt-f>span{display:block;font-size:.72rem;font-weight:600;color:var(--muted);margin-bottom:6px}
  .rt-f em{font-style:normal;font-weight:400}
  .rt-price{grid-column:1/-1}
  .rt-del{position:absolute;top:12px;right:10px}
  .stp-b{width:44px;font-size:1.25rem}
  .be-app .stp input,.be-app .rt input{padding:11px 4px;font-size:1rem}
  .be-app .money input{padding:11px 30px 11px 12px}
  .be-app .calc{padding:18px}
  .cap-stats b{font-size:.95rem}
  .sq{width:14px;height:14px}
  .ex-grid{grid-template-columns:1fr}
  .btn-pdf{font-size:.95rem;padding:15px 16px}
}

/* Print fallback (PDF), unchanged */
#printDoc{display:none}
@media print{
  @page{size:A4;margin:14mm}
  body.print-doc > *:not(#printDoc){display:none!important}
  body.print-doc #printDoc{display:block;font-family:'Be Vietnam Pro',sans-serif;color:#111;font-size:10.5pt}
  #printDoc h1{font-size:15pt;text-align:center;margin:10px 0 2px}
  #printDoc .sub{text-align:center;font-style:italic;margin:0 0 12px}
  #printDoc table{width:100%;border-collapse:collapse;margin:6px 0 10px}
  #printDoc th,#printDoc td{border:1px solid #999;padding:4px 6px;vertical-align:top}
  #printDoc th{background:#0f2547;color:#fff;-webkit-print-color-adjust:exact;print-color-adjust:exact}
  #printDoc .r{text-align:right}#printDoc .c{text-align:center}
  #printDoc .sig td{border:0;text-align:center;height:110px}
  #printDoc h3{font-size:11pt;margin:12px 0 4px}
}

/* ===== Registration form extras, province selects, privacy note ===== */
.form select,.form textarea,.ex-grid select{width:100%;margin:0;padding:12px 14px;border:1px solid var(--line-2);border-radius:10px;font:inherit;font-size:1rem;color:var(--ink);background:#fff;transition:border-color .15s,box-shadow .15s}
.form select,.ex-grid select{-webkit-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%234a5b70' stroke-width='1.6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;padding-right:38px}
.ex-grid select{margin-top:6px;padding:11px 38px 11px 13px;font-size:.96rem}
.form select:invalid,.ex-grid select:invalid{color:#7a8797}
.form select:focus,.form textarea:focus,.ex-grid select:focus{outline:none;border-color:var(--teal);box-shadow:0 0 0 4px rgba(15,140,154,.12)}
.form textarea{resize:vertical;min-height:72px}
.form .err,.ex-grid select.err{border-color:#ef4444;box-shadow:0 0 0 4px rgba(239,68,68,.1)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
@media (max-width:520px){.form-row{grid-template-columns:1fr}}
.hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.send-note{margin:0;color:var(--muted,#5b6b7f);font-size:.84rem}
.privacy-note{opacity:.75;font-size:.78rem;margin-top:4px}

/* ===== v7 mobile polish (≤760px / in-app browsers). Desktop unchanged. ===== */
.m-cta{display:none}
.pdf-fb{margin-top:12px;display:flex;flex-direction:column;gap:6px;align-items:stretch;text-align:center}
.pdf-fb .small{color:var(--muted);margin:0}
@media (max-width:1180px){
  .menu-btn{width:44px;height:44px;touch-action:manipulation}
  .nav-links{max-height:calc(100dvh - var(--nav-h));overflow-y:auto;overscroll-behavior:contain;box-shadow:0 18px 30px rgba(11,31,51,.12)}
  .nav-links a:not(.btn){min-height:44px;display:flex;align-items:center}
}
@media (max-width:760px){
  html,body{overflow-x:hidden}
  body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
  a,button,input,select,textarea,label{touch-action:manipulation}
  input,select,textarea,.ex-grid input,.be-app .stp input,.be-app .rt input{font-size:16px!important}
  .btn{min-height:46px}
  .stp-b{min-height:44px}
  .rt-del{width:44px;height:44px;top:4px!important;right:4px!important}
  .rt-name{padding-right:52px!important}
  img{max-width:100%;height:auto}
  .hero-cta .btn{justify-content:center}
  .m-cta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;gap:8px;padding:10px calc(12px + env(safe-area-inset-right)) calc(10px + env(safe-area-inset-bottom)) calc(12px + env(safe-area-inset-left));background:rgba(255,255,255,.97);border-top:1px solid var(--line);box-shadow:0 -8px 24px rgba(11,31,51,.08);transform:translateY(110%);transition:transform .22s ease;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
  .m-cta.show{transform:none}
  .m-cta .btn{flex:1;justify-content:center;padding:11px 10px;font-size:.95rem;white-space:nowrap;gap:6px}
  .m-cta .btn:first-child{flex:1.4}
  body.m-cta-on .footer{padding-bottom:calc(80px + env(safe-area-inset-bottom))}
  body.presenting .m-cta{display:none}
  /* promo: bigger close targets; popup becomes a bottom sheet that never covers the whole page */
  .tqp-x{width:44px;height:44px;top:4px;right:4px;font-size:22px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
  .tqp-banner{padding-right:52px}
  .tqp-pop{align-items:flex-end;padding:0}
  .tqp-pop-box{max-width:none;border-radius:20px 20px 0 0;max-height:85vh;padding-bottom:env(safe-area-inset-bottom);animation:tqpUp .25s cubic-bezier(.2,.8,.2,1)}
  @supports (height:1dvh){.tqp-pop-box{max-height:85dvh}}
  .tqp-pop .tqp-media img{max-height:46vh;object-fit:cover}
  .tqp-pop .tqp-cta{display:flex;justify-content:center;min-height:46px}
}
@keyframes tqpUp{from{transform:translateY(100%)}to{transform:none}}
@media (max-width:380px){
  .container{padding:0 16px}
  .hero h1{font-size:1.8rem}
  .m-cta .btn{font-size:.88rem;padding:10px 8px}
}
@media (hover:none){.nav-links a:not(.btn):hover{background:none}}
@media print{.m-cta,.pdf-fb{display:none!important}}
