/* =====================================================
   QUAD BIKING DUBAI — pillar v6 (premium polish)
   ===================================================== */

:root {
  --q-ink:#0E0C0A; --q-ink-soft:#44413c;
  --q-paper:#FBF7F0; --q-cream:#F7F3EC;
  --q-orange:#E8652B; --q-orange-deep:#C2410C; --q-orange-soft:#FFE6D5;
  --q-teal:#0D4F5C; --q-teal-deep:#072F38; --q-night:#0a1418;
  --q-gold:#D4A843;
  --q-line:rgba(14,12,10,.09); --q-line-strong:rgba(14,12,10,.16);
  --q-mono:'JetBrains Mono', ui-monospace, monospace;
  --q-display:'Fraunces', serif;
  --q-body:'Inter Tight', sans-serif;
}

html, body[data-page="quad-pillar"] { overflow-x:hidden; max-width:100%; }
body[data-page="quad-pillar"] { background:var(--q-paper); color:var(--q-ink); font-family:var(--q-body); }
body[data-page="quad-pillar"] *, body[data-page="quad-pillar"] *::before, body[data-page="quad-pillar"] *::after { box-sizing:border-box; }
body[data-page="quad-pillar"] img, body[data-page="quad-pillar"] svg { max-width:100%; height:auto; }
body[data-page="quad-pillar"] .wrap { max-width:1240px; margin:0 auto; padding:0 22px; width:100%; }
@media (max-width:640px) { body[data-page="quad-pillar"] .wrap { padding:0 18px; } }

.qmono-eyebrow { display:inline-block; font-family:var(--q-mono); font-size:11px; letter-spacing:.22em; text-transform:uppercase; color:var(--q-orange); font-weight:600; margin-bottom:10px; }
.qmono-on-dark { color:var(--q-gold); }
.qaccent { color:var(--q-orange); font-style:italic; font-weight:600; }

/* buttons */
.qbtn { display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:12px 20px; font-family:var(--q-mono); font-size:12px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; text-decoration:none; border-radius:4px; cursor:pointer; transition:transform .15s, background .15s, color .15s, border-color .15s; white-space:nowrap; border:1.5px solid transparent; }
.qbtn-hot { background:var(--q-orange); color:#fff; box-shadow:0 6px 20px -8px rgba(232,101,43,.55); }
.qbtn-hot:hover { background:var(--q-orange-deep); transform:translateY(-1px); }
.qbtn-line { background:transparent; color:var(--q-ink); border-color:var(--q-ink); }
.qbtn-line:hover { background:var(--q-ink); color:var(--q-paper); }
.qbtn-line-light { color:#FFF1E8; border-color:rgba(247,243,236,.55); background:rgba(247,243,236,.04); }
.qbtn-line-light:hover { background:rgba(247,243,236,.14); border-color:#FFF1E8; color:#FFF1E8; }

/* ============== HERO ============== */
.qhero { position:relative; background:linear-gradient(180deg, #060d12 0%, #0a1418 50%, #0c1a22 100%); color:#FFF1E8; padding:clamp(48px,7vw,96px) 0 clamp(40px,5vw,72px); overflow:hidden; border-bottom:1px solid rgba(247,243,236,.08); }
.qhero-bg { position:absolute; inset:0; pointer-events:none; }
.qhero-grid-lines { position:absolute; inset:0; background-image:linear-gradient(rgba(247,243,236,.04) 1px, transparent 1px), linear-gradient(90deg, rgba(247,243,236,.04) 1px, transparent 1px); background-size:60px 60px; mask-image:radial-gradient(ellipse 80% 60% at 50% 30%, #000 0%, transparent 80%); -webkit-mask-image:radial-gradient(ellipse 80% 60% at 50% 30%, #000 0%, transparent 80%); }
.qhero-glow { position:absolute; border-radius:50%; filter:blur(60px); opacity:.55; }
.qhero-glow-1 { width:480px; height:480px; top:-140px; right:-100px; background:radial-gradient(circle, rgba(232,101,43,.7), transparent 70%); }
.qhero-glow-2 { width:340px; height:340px; bottom:-80px; left:-60px; background:radial-gradient(circle, rgba(212,168,67,.45), transparent 70%); }
.qhero-inner { position:relative; z-index:2; }

.qhero-bc { font-family:var(--q-mono); font-size:11px; letter-spacing:.15em; text-transform:uppercase; color:rgba(247,243,236,.55); margin-bottom:18px; }
.qhero-bc a { color:var(--q-gold); text-decoration:none; }
.qhero-bc span { color:rgba(247,243,236,.3); margin:0 8px; }
.qhero-bc span[aria-current] { color:rgba(247,243,236,.85); margin-left:0; }

.qhero-meta { display:flex; flex-wrap:wrap; gap:6px; font-family:var(--q-mono); font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:rgba(247,243,236,.7); margin-bottom:18px; }
.qhero-tag { display:inline-flex; align-items:center; gap:4px; }
.qhero-dot { color:rgba(247,243,236,.3); margin:0 4px; }

.qhero-grid { display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,1fr); gap:clamp(20px,4vw,56px); align-items:center; }
@media (max-width:880px) { .qhero-grid { grid-template-columns:1fr; gap:32px; } }

.qhero-text { min-width:0; }
.qhero-h1 { font-family:var(--q-display); font-weight:400; font-size:clamp(40px,7vw,108px); line-height:.98; letter-spacing:-.04em; margin:0 0 18px; color:#FFF1E8; word-break:break-word; }
.qhero-line1 { display:block; }
.qhero-line2 { display:block; font-style:italic; font-weight:500; color:var(--q-gold); }
.qhero-period { color:var(--q-orange); font-style:normal; }

.qhero-sub { font-size:clamp(14px,1.4vw,17px); line-height:1.55; color:rgba(247,243,236,.82); max-width:560px; margin:0 0 26px; overflow-wrap:break-word; }

.qhero-stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(120px, 1fr)); gap:1px; background:rgba(247,243,236,.1); margin-bottom:24px; border-radius:6px; overflow:hidden; max-width:540px; }
.qhs { background:rgba(10,20,24,.7); padding:14px 16px; display:flex; flex-direction:column; gap:2px; min-width:0; }
.qhs-n { font-family:var(--q-display); font-weight:500; font-size:30px; letter-spacing:-.02em; color:var(--q-orange); line-height:1; }
.qhs-l { font-family:var(--q-mono); font-size:9.5px; letter-spacing:.13em; text-transform:uppercase; color:rgba(247,243,236,.6); white-space:normal; overflow-wrap:break-word; }
@media (max-width:540px) { .qhero-stats { grid-template-columns:1fr 1fr; } }

.qhero-ctas { display:flex; flex-wrap:wrap; gap:10px; }
.qhero-ctas-center { justify-content:center; }
.qhero-ctas .qbtn { flex:0 1 auto; min-width:160px; }
@media (max-width:540px) { .qhero-ctas { flex-direction:column; align-items:stretch; } .qhero-ctas .qbtn { width:100%; min-width:0; } }

.qhero-track { width:100%; height:24px; margin-top:36px; opacity:.5; }

/* Hero cinematic photo frame */
.qhero-visual { min-width:0; position:relative; }
.qhv-frame { position:relative; aspect-ratio:4/3; width:100%; max-width:560px; margin:0 0 0 auto; background:#0a1418; border:1px solid rgba(247,243,236,.18); border-radius:14px; overflow:hidden; box-shadow:0 30px 60px -30px rgba(0,0,0,.65), 0 0 0 1px rgba(232,101,43,.12); }
@media (max-width:880px) { .qhv-frame { max-width:520px; aspect-ratio:4/3; margin:0 auto; } }
.qhv-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; display:block; }
.qhv-corner { position:absolute; width:24px; height:24px; border:2px solid var(--q-orange); z-index:3; pointer-events:none; }
.qhv-corner-tl { top:12px; left:12px; border-right:none; border-bottom:none; }
.qhv-corner-tr { top:12px; right:12px; border-left:none; border-bottom:none; }
.qhv-corner-bl { bottom:12px; left:12px; border-right:none; border-top:none; }
.qhv-corner-br { bottom:12px; right:12px; border-left:none; border-top:none; }
.qhv-overlay { position:absolute; top:18px; right:18px; display:flex; gap:6px; flex-wrap:wrap; z-index:2; }
.qhv-tag { font-family:var(--q-mono); font-size:10px; letter-spacing:.15em; text-transform:uppercase; font-weight:700; padding:5px 9px; border-radius:3px; background:rgba(10,20,24,.75); color:var(--q-gold); border:1px solid rgba(212,168,67,.4); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.qhv-tag-alt { color:var(--q-orange); border-color:rgba(232,101,43,.4); }
.qhv-meta-bar { position:absolute; left:18px; right:18px; bottom:18px; display:flex; gap:6px; flex-wrap:wrap; z-index:2; }
.qhvm-cell { display:inline-flex; align-items:center; gap:5px; font-family:var(--q-mono); font-size:10px; letter-spacing:.1em; padding:6px 10px; border-radius:3px; background:rgba(10,20,24,.75); color:#FFF1E8; border:1px solid rgba(247,243,236,.18); backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.qhvm-cell b { color:var(--q-gold); font-weight:700; font-size:9.5px; letter-spacing:.18em; }
.qhvm-pulse { width:6px; height:6px; border-radius:50%; background:#E8652B; box-shadow:0 0 0 0 rgba(232,101,43,.6); animation:qpulse 1.6s ease-out infinite; }
@keyframes qpulse { 0%{box-shadow:0 0 0 0 rgba(232,101,43,.6);} 80%{box-shadow:0 0 0 9px rgba(232,101,43,0);} 100%{box-shadow:0 0 0 0 rgba(232,101,43,0);} }

/* ============== INTRO with feature tiles ============== */
.qintro { background:var(--q-paper); padding:clamp(44px,6vw,84px) 0; border-bottom:1px solid var(--q-line); }
.qintro-head { text-align:center; max-width:760px; margin:0 auto 36px; }
.qintro-h2 { font-family:var(--q-display); font-weight:400; font-size:clamp(28px,4vw,48px); letter-spacing:-.025em; line-height:1.1; margin:0 0 14px; color:var(--q-ink); overflow-wrap:break-word; }
.qintro-lede { font-size:clamp(15px,1.4vw,17px); line-height:1.55; color:var(--q-ink-soft); margin:0; max-width:620px; margin:0 auto; overflow-wrap:break-word; }

.qintro-tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(240px,100%),1fr)); gap:16px; max-width:1100px; margin:0 auto; }
.qtile { background:#FFF; border:1px solid var(--q-line); border-radius:10px; padding:22px 22px 20px; display:flex; flex-direction:column; gap:8px; transition:border-color .18s, transform .18s, box-shadow .18s; }
.qtile:hover { transform:translateY(-3px); border-color:rgba(232,101,43,.4); box-shadow:0 18px 40px -22px rgba(20,18,16,.22); }
.qtile-icon { width:42px; height:42px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:var(--q-orange-soft); color:var(--q-orange); margin-bottom:4px; }
.qtile h3 { margin:0; font-family:var(--q-display); font-weight:500; font-size:20px; letter-spacing:-.015em; color:var(--q-ink); }
.qtile p { margin:0; font-size:13.5px; line-height:1.55; color:var(--q-ink-soft); overflow-wrap:break-word; }
.qintro-foot { text-align:center; margin:28px auto 0; font-size:13.5px; color:var(--q-ink-soft); max-width:680px; }
.qintro-foot a { color:var(--q-orange); text-decoration:none; border-bottom:1px dashed rgba(232,101,43,.4); font-weight:500; }
.qintro-foot a:hover { color:var(--q-orange-deep); }

/* ============== SECTION SHELL ============== */
.qsec { padding:clamp(48px,7vw,96px) 0; border-bottom:1px solid var(--q-line); }
.qsec-fleet { background:var(--q-paper); }
.qsec-riders { background:var(--q-cream); }
.qsec-terrain { background:var(--q-paper); }
.qsec-vs { background:var(--q-cream); }
.qsec-safety { background:var(--q-paper); }
.qsec-age { background:var(--q-cream); }
.qsec-pickup { background:var(--q-paper); }
.qsec-cancel { background:var(--q-cream); }
.qsec-faq { background:var(--q-paper); }

.qsec-head { text-align:center; margin-bottom:36px; max-width:720px; margin-left:auto; margin-right:auto; }
.qsec-h2 { font-family:var(--q-display); font-weight:400; font-size:clamp(28px,4.2vw,48px); letter-spacing:-.025em; line-height:1.1; margin:0 0 12px; color:var(--q-ink); overflow-wrap:break-word; }
.qsec-lead { font-size:14.5px; line-height:1.55; color:var(--q-ink-soft); margin:0; overflow-wrap:break-word; }

/* ============== RIDER TYPE PICKER (premium) ============== */
.qrt-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(260px,100%),1fr)); gap:14px; max-width:1180px; margin:0 auto; }
.qrtype { background:#FFF; border:1px solid var(--q-line); border-left:4px solid var(--q-orange); border-radius:6px; padding:18px 18px 16px; display:flex; flex-direction:column; gap:10px; transition:border-color .18s, transform .18s, box-shadow .18s; min-width:0; }
.qrtype:hover { transform:translateY(-2px); border-left-color:var(--q-orange-deep); box-shadow:0 14px 32px -22px rgba(20,18,16,.25); }
.qrtype-head { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.qrtype-icon { font-size:24px; line-height:1; flex:0 0 auto; }
.qrtype-tag { display:inline-block; font-family:var(--q-display); font-weight:500; font-size:20px; letter-spacing:-.015em; color:var(--q-ink); line-height:1.1; flex:1 1 auto; min-width:0; }
.qrtype-chip { font-family:var(--q-mono); font-size:9.5px; font-weight:600; letter-spacing:.12em; text-transform:uppercase; padding:3px 8px; border-radius:3px; background:var(--q-orange-soft); color:var(--q-orange-deep); flex:0 0 auto; }
.qrtype-blurb { font-size:13px; line-height:1.55; color:var(--q-ink-soft); margin:0; overflow-wrap:break-word; }
.qrtype-picks { display:flex; flex-direction:column; gap:5px; margin-top:auto; }
.qrt-pick { display:flex; align-items:center; gap:8px; padding:9px 12px; background:var(--q-cream); border:1px solid transparent; border-radius:5px; text-decoration:none; font-size:12.5px; transition:background .15s, transform .15s, border-color .15s; min-width:0; flex-wrap:wrap; }
.qrt-pick:hover { background:var(--q-orange-soft); transform:translateX(2px); }
.qrt-pick.is-rec { background:linear-gradient(90deg, rgba(232,101,43,.1), var(--q-cream)); border-color:rgba(232,101,43,.35); }
.qrt-name { font-weight:500; color:var(--q-ink); flex:1 1 auto; min-width:0; overflow-wrap:anywhere; }
.qrt-cc { font-family:var(--q-mono); font-size:10.5px; color:var(--q-ink-soft); letter-spacing:.05em; flex:0 0 auto; }
.qrt-rec-pill { font-family:var(--q-mono); font-size:9px; font-weight:700; letter-spacing:.15em; padding:2px 6px; border-radius:3px; background:var(--q-orange); color:#FFF; flex:0 0 auto; }

/* ============== FLEET — premium product cards ============== */
.qride-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(300px,100%),1fr)); gap:22px; max-width:1240px; margin:0 auto; }
.qride-anchor { scroll-margin-top:100px; min-width:0; }
.qcard { position:relative; background:#FFF; border:1px solid var(--q-line); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; transition:transform .22s ease, border-color .22s ease, box-shadow .22s ease; min-width:0; }
.qcard:hover { transform:translateY(-4px); border-color:rgba(232,101,43,.4); box-shadow:0 30px 56px -32px rgba(20,18,16,.28); }
.qcard[data-tier="entry"] { --qc-accent:#4FB3CC; }
.qcard[data-tier="beginner"] { --qc-accent:#5FA85B; }
.qcard[data-tier="standard"] { --qc-accent:#C8941F; }
.qcard[data-tier="tandem"] { --qc-accent:#E8853B; }
.qcard[data-tier="turbo"] { --qc-accent:#E8652B; }
.qcard[data-tier="big-bore"] { --qc-accent:#C2410C; }
.qcard[data-tier="sport"] { --qc-accent:#B91C1C; }
.qcard[data-tier="flagship"] { --qc-accent:#6E1010; }
.qcard-img { position:relative; aspect-ratio:16/10; background:#2a1208; overflow:hidden; }
.qcard-img img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.qcard:hover .qcard-img img { transform:scale(1.04); }
.qcard-img::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,20,24,.45) 0%, rgba(10,20,24,0) 35%, rgba(10,20,24,0) 100%); pointer-events:none; }
.qcard-badge { position:absolute; top:14px; left:14px; z-index:2; background:var(--qc-accent, var(--q-orange)); color:#FFF; font-family:var(--q-mono); font-size:10.5px; font-weight:700; letter-spacing:.14em; padding:6px 11px; border-radius:4px; text-transform:uppercase; box-shadow:0 6px 16px -8px rgba(0,0,0,.5); white-space:nowrap; max-width:calc(100% - 28px); overflow:hidden; text-overflow:ellipsis; }
.qcard-body { padding:18px 20px 20px; display:flex; flex-direction:column; gap:12px; flex:1; min-width:0; }
.qcard-spec { font-family:var(--q-mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-ink-soft); font-weight:600; overflow-wrap:anywhere; }
.qcard-title { margin:0; font-family:var(--q-display); font-weight:500; font-size:clamp(20px,1.7vw,24px); letter-spacing:-.02em; line-height:1.15; color:var(--q-ink); }
.qcard-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--q-line); border-radius:6px; overflow:hidden; border:1px solid var(--q-line); }
.qcs-cell { background:var(--q-cream); padding:10px 10px; display:flex; flex-direction:column; gap:2px; min-width:0; }
.qcs-l { font-family:var(--q-mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--q-ink-soft); font-weight:600; }
.qcs-v { font-family:var(--q-display); font-weight:500; font-size:16px; letter-spacing:-.01em; color:var(--q-ink); line-height:1.1; overflow-wrap:anywhere; }
.qcard-best { font-size:12.5px; color:var(--q-ink-soft); line-height:1.5; overflow-wrap:break-word; }
.qcard-best b { font-family:var(--q-mono); font-size:10px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-orange); font-weight:600; margin-right:6px; }
.qcard-from { display:flex; align-items:baseline; gap:6px; flex-wrap:wrap; padding-top:10px; border-top:1px dashed var(--q-line); }
.qcf-label { font-family:var(--q-mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-ink-soft); font-weight:600; flex:0 0 auto; }
.qcf-amt { font-family:var(--q-display); font-weight:500; font-size:28px; letter-spacing:-.02em; color:var(--q-ink); line-height:1; flex:0 0 auto; }
.qcf-cur { font-size:13px; font-family:var(--q-mono); color:var(--q-orange); margin-right:3px; letter-spacing:.05em; font-weight:600; }
.qcf-dur { font-size:11.5px; color:var(--q-ink-soft); flex:1 1 auto; }
.qcard-ctas { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:auto; }
.qcard-ctas .qbtn { width:100%; padding:11px 14px; font-size:11.5px; }
@media (max-width:380px) { .qcard-ctas { grid-template-columns:1fr; } }

/* ============== TERRAIN — premium photo cards ============== */
.qter-grid { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(280px,100%),1fr)); gap:18px; max-width:1180px; margin:0 auto; }
.qter { background:#FFF; border:1px solid var(--q-line); border-radius:10px; overflow:hidden; display:flex; flex-direction:column; min-width:0; transition:transform .22s, border-color .22s, box-shadow .22s; }
.qter:hover { transform:translateY(-3px); border-color:rgba(232,101,43,.35); box-shadow:0 22px 44px -28px rgba(20,18,16,.25); }
.qter-img { position:relative; aspect-ratio:16/10; background:#2a1208; overflow:hidden; }
.qter-img img { width:100%; height:100%; object-fit:cover; display:block; }
.qter-img::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,20,24,.4) 0%, rgba(10,20,24,0) 35%, rgba(10,20,24,.5) 100%); pointer-events:none; }
.qter-pin { position:absolute; top:12px; left:12px; z-index:2; font-family:var(--q-mono); font-size:10.5px; letter-spacing:.1em; font-weight:600; padding:5px 10px; border-radius:3px; background:rgba(10,20,24,.78); color:#FFF1E8; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); }
.qter-body { padding:18px 20px 18px; display:flex; flex-direction:column; gap:10px; flex:1; min-width:0; }
.qter-name { margin:0; font-family:var(--q-display); font-weight:500; font-size:22px; letter-spacing:-.015em; color:var(--q-ink); }
.qter-blurb { margin:0; font-size:13.5px; line-height:1.55; color:var(--q-ink-soft); overflow-wrap:break-word; }
.qter-stats { list-style:none; padding:0; margin:8px 0; display:flex; flex-direction:column; gap:6px; }
.qter-stats li { display:flex; gap:10px; font-size:12.5px; padding:6px 10px; background:var(--q-cream); border-radius:5px; flex-wrap:wrap; }
.qts-l { font-family:var(--q-mono); font-size:9.5px; letter-spacing:.15em; text-transform:uppercase; color:var(--q-ink-soft); font-weight:600; flex:0 0 84px; align-self:center; }
.qts-v { color:var(--q-ink); flex:1 1 auto; min-width:0; overflow-wrap:anywhere; align-self:center; }
.qts-skill { display:inline-flex; gap:3px; margin-right:6px; }
.qts-d { display:inline-block; width:7px; height:7px; border-radius:50%; background:rgba(20,18,16,.18); }
.qts-d.on { background:var(--q-orange); }
.qter-link { margin-top:auto; font-family:var(--q-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-orange); font-weight:600; text-decoration:none; padding-top:8px; border-top:1px dashed var(--q-line); }
.qter-link:hover { color:var(--q-orange-deep); }

/* ============== VS panel — strong with icons ============== */
.qvs-pair { display:grid; grid-template-columns:1fr 60px 1fr; gap:0; max-width:1100px; margin:0 auto; align-items:stretch; }
@media (max-width:720px) { .qvs-pair { grid-template-columns:1fr; } .qvs-divider { display:none; } }
.qvs-card { padding:28px 26px; background:#FFF; border:1px solid var(--q-line); display:flex; flex-direction:column; gap:14px; position:relative; min-width:0; }
.qvs-quad { border-radius:8px 0 0 8px; border-right:none; background:linear-gradient(180deg, #FFF, #FFF8F0); }
.qvs-buggy { border-radius:0 8px 8px 0; border-left:none; }
@media (max-width:720px) { .qvs-quad { border-radius:8px 8px 0 0; border-right:1px solid var(--q-line); border-bottom:none; } .qvs-buggy { border-radius:0 0 8px 8px; border-left:1px solid var(--q-line); } }
.qvs-icon { display:flex; align-items:center; justify-content:center; width:74px; height:54px; background:var(--q-cream); border-radius:6px; }
.qvs-icon-buggy { background:rgba(13,79,92,.08); }
.qvs-mark { position:absolute; top:18px; right:18px; font-family:var(--q-mono); font-weight:700; font-size:11px; letter-spacing:.18em; color:var(--q-orange); background:var(--q-orange-soft); padding:4px 9px; border-radius:3px; }
.qvs-mark-alt { color:var(--q-teal); background:rgba(13,79,92,.1); }
.qvs-h { font-family:var(--q-display); font-weight:500; font-size:22px; letter-spacing:-.015em; margin:0; color:var(--q-ink); padding-right:80px; overflow-wrap:break-word; }
.qvs-list { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px; }
.qvs-list li { font-size:13.5px; line-height:1.5; color:var(--q-ink-soft); padding-left:14px; position:relative; overflow-wrap:break-word; }
.qvs-list li::before { content:"›"; position:absolute; left:0; color:var(--q-orange); font-weight:700; font-size:16px; line-height:1; top:1px; }
.qvs-list b { display:inline-block; font-family:var(--q-mono); font-size:9.5px; letter-spacing:.16em; text-transform:uppercase; color:var(--q-ink); font-weight:700; min-width:64px; margin-right:6px; }
.qvs-btn { margin-top:auto; }
.qvs-btn-teal { background:var(--q-teal); color:#FFF; border:1.5px solid var(--q-teal); }
.qvs-btn-teal:hover { background:var(--q-teal-deep); border-color:var(--q-teal-deep); transform:translateY(-1px); }
.qvs-divider { display:flex; align-items:center; justify-content:center; background:var(--q-night); }
.qvs-or { font-family:var(--q-mono); font-weight:700; font-size:13px; letter-spacing:.2em; color:var(--q-orange); writing-mode:vertical-lr; transform:rotate(180deg); }
.qvs-note { text-align:center; margin-top:22px; font-size:13.5px; color:var(--q-ink-soft); overflow-wrap:break-word; }
.qvs-note a { color:var(--q-orange); font-weight:500; text-decoration:none; border-bottom:1px dashed rgba(232,101,43,.4); }

/* ============== SAFETY ============== */
.qsafe { display:grid; grid-template-columns:1fr 1fr; gap:0; max-width:1000px; margin:0 auto; border:1px solid var(--q-line); border-radius:10px; overflow:hidden; background:#FFF; }
@media (max-width:720px) { .qsafe { grid-template-columns:1fr; } }
.qsafe-side { padding:26px 28px; min-width:0; }
.qsafe-side:first-child { border-right:1px solid var(--q-line); background:linear-gradient(180deg, #FFF, #F8FAF8); }
@media (max-width:720px) { .qsafe-side:first-child { border-right:none; border-bottom:1px solid var(--q-line); } }
.qsafe-h { margin:0 0 14px; font-family:var(--q-mono); font-size:11px; letter-spacing:.2em; text-transform:uppercase; color:var(--q-teal); font-weight:700; }
.qsafe-h-alt { color:var(--q-orange-deep); }
.qsafe-ul { list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:10px; }
.qsafe-ul li { font-size:13.5px; line-height:1.55; color:var(--q-ink); padding-left:24px; position:relative; overflow-wrap:break-word; }
.qsafe-ul-on li::before { content:"✓"; position:absolute; left:0; top:1px; width:18px; height:18px; background:var(--q-teal); color:#FFF; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:10px; font-weight:700; }
.qsafe-ul-off li::before { content:"!"; position:absolute; left:0; top:1px; width:18px; height:18px; background:var(--q-orange-soft); color:var(--q-orange-deep); border-radius:3px; display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; }
.qsafe-link { display:inline-block; margin-top:14px; font-family:var(--q-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-orange); text-decoration:none; font-weight:600; }

/* ============== AGE STRIP ============== */
.qage-strip { display:grid; grid-template-columns:repeat(auto-fit, minmax(min(220px,100%),1fr)); gap:1px; max-width:1100px; margin:0 auto; background:var(--q-line-strong); border-radius:10px; overflow:hidden; border:1px solid var(--q-line-strong); }
.qage-cell { background:#FFF; padding:24px 22px; display:flex; flex-direction:column; gap:8px; min-width:0; }
.qage-cell-hot { background:linear-gradient(180deg, #FFF, #FFF1E8); }
.qage-pill { display:inline-block; width:fit-content; background:var(--q-ink); color:#FFF1E8; font-family:var(--q-mono); font-size:13px; font-weight:700; letter-spacing:.08em; padding:5px 12px; border-radius:4px; }
.qage-pill-hot { background:var(--q-orange); }
.qage-cell h3 { margin:4px 0 0; font-family:var(--q-display); font-weight:500; font-size:18px; color:var(--q-ink); }
.qage-cell p { margin:0; font-size:13px; line-height:1.55; color:var(--q-ink-soft); overflow-wrap:break-word; }

/* ============== PICKUP ============== */
.qpkup { display:flex; flex-direction:column; gap:14px; max-width:880px; margin:0 auto; }
.qpkup-row { display:grid; grid-template-columns:96px minmax(0,1fr); gap:0; background:#FFF; border:1px solid var(--q-line); border-radius:10px; overflow:hidden; }
@media (max-width:540px) { .qpkup-row { grid-template-columns:1fr; } }
.qpkup-tag { background:var(--q-orange); color:#FFF; font-family:var(--q-mono); font-weight:700; font-size:12px; letter-spacing:.1em; display:flex; align-items:center; justify-content:center; padding:18px 8px; text-align:center; }
.qpkup-tag-alt { background:var(--q-teal); }
.qpkup-body { padding:20px 24px; min-width:0; }
.qpkup-body h3 { margin:0 0 6px; font-family:var(--q-display); font-weight:500; font-size:18px; color:var(--q-ink); }
.qpkup-body p { margin:0; font-size:13.5px; line-height:1.55; color:var(--q-ink-soft); overflow-wrap:break-word; }
.qpkup-link { display:inline-block; margin-top:10px; font-family:var(--q-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-orange); text-decoration:none; font-weight:600; }

/* ============== CANCELLATION ============== */
.qcncl { max-width:760px; margin:0 auto; border:1px solid var(--q-line); border-radius:10px; overflow:hidden; background:#FFF; }
.qcncl-row { display:grid; grid-template-columns:220px minmax(0,1fr); gap:12px; padding:14px 20px; border-bottom:1px solid var(--q-line); }
.qcncl-row:last-child { border-bottom:none; }
@media (max-width:540px) { .qcncl-row { grid-template-columns:1fr; gap:4px; } }
.qcncl-when { font-family:var(--q-mono); font-size:11.5px; letter-spacing:.12em; text-transform:uppercase; font-weight:700; color:var(--q-ink); }
.qcncl-fee { font-size:14px; color:var(--q-ink-soft); overflow-wrap:break-word; }
.qcncl-ok .qcncl-when { color:#2A6E3A; }
.qcncl-mid .qcncl-when { color:#C2410C; }
.qcncl-bad .qcncl-when { color:#B91C1C; }
.qcncl-link { display:block; text-align:center; margin-top:18px; font-family:var(--q-mono); font-size:11px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-orange); text-decoration:none; font-weight:600; }

/* ============== FAQ — help-center style ============== */
.qfaq-shell { display:grid; grid-template-columns:280px minmax(0,1fr); gap:24px; max-width:1100px; margin:0 auto; align-items:start; }
@media (max-width:880px) { .qfaq-shell { grid-template-columns:1fr; } }
.qfaq-side { position:sticky; top:100px; }
@media (max-width:880px) { .qfaq-side { position:static; } }
.qfaq-support { background:#FFF; border:1px solid var(--q-line); border-radius:10px; padding:22px 22px 24px; display:flex; flex-direction:column; gap:8px; }
.qfs-eyebrow { font-family:var(--q-mono); font-size:10.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-orange); font-weight:600; }
.qfs-h { margin:0; font-family:var(--q-display); font-weight:500; font-size:20px; letter-spacing:-.015em; color:var(--q-ink); }
.qfs-p { margin:0 0 6px; font-size:13px; line-height:1.55; color:var(--q-ink-soft); }
.qfs-topics { margin-top:14px; padding-top:14px; border-top:1px dashed var(--q-line); display:flex; flex-wrap:wrap; gap:6px; }
.qfs-topic-l { display:block; width:100%; font-family:var(--q-mono); font-size:9.5px; letter-spacing:.18em; text-transform:uppercase; color:var(--q-ink-soft); font-weight:600; margin-bottom:4px; }
.qfs-chip { display:inline-block; font-family:var(--q-mono); font-size:10px; letter-spacing:.06em; padding:5px 9px; border-radius:3px; background:var(--q-cream); color:var(--q-ink); border:1px solid var(--q-line); white-space:nowrap; }
.qfaq-list { display:flex; flex-direction:column; gap:6px; min-width:0; }
.qfaq-list details { background:#FFF; border:1px solid var(--q-line); border-left:3px solid var(--q-orange); border-radius:6px; min-width:0; transition:border-color .18s, box-shadow .18s; }
.qfaq-list details:hover { border-color:rgba(232,101,43,.4); }
.qfaq-list details[open] { box-shadow:0 12px 24px -16px rgba(20,18,16,.18); }
.qfaq-list summary { list-style:none; cursor:pointer; padding:14px 18px; display:flex; align-items:center; justify-content:space-between; gap:12px; }
.qfaq-list summary::-webkit-details-marker { display:none; }
.qfaq-q { font-family:var(--q-display); font-weight:500; font-size:15.5px; color:var(--q-ink); letter-spacing:-.005em; flex:1 1 auto; min-width:0; overflow-wrap:break-word; }
.qfaq-toggle { font-family:var(--q-mono); font-weight:700; font-size:18px; color:var(--q-orange); flex-shrink:0; transition:transform .2s; }
.qfaq-list details[open] .qfaq-toggle { transform:rotate(45deg); }
.qfaq-list .qfaq-a { padding:0 18px 16px; font-size:14px; line-height:1.6; color:var(--q-ink-soft); overflow-wrap:break-word; }

/* ============== FINAL CTA — photo backdrop ============== */
.qfinal { position:relative; background:var(--q-night); color:#FFF1E8; padding:clamp(64px,8vw,120px) 0; text-align:center; overflow:hidden; }
.qfinal-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.42; pointer-events:none; }
.qfinal-veil { position:absolute; inset:0; background:linear-gradient(180deg, rgba(10,20,24,.65) 0%, rgba(10,20,24,.85) 50%, rgba(10,20,24,.95) 100%), radial-gradient(ellipse 60% 60% at 50% 100%, rgba(232,101,43,.28), transparent 70%); pointer-events:none; }
.qfinal-inner { position:relative; z-index:1; }
.qfinal-h { font-family:var(--q-display); font-weight:400; font-size:clamp(34px,5.5vw,72px); letter-spacing:-.025em; line-height:1.05; margin:8px 0 14px; color:#FFF1E8; overflow-wrap:break-word; }
.qfinal-p { color:rgba(247,243,236,.82); max-width:600px; margin:0 auto 24px; font-size:15px; line-height:1.55; overflow-wrap:break-word; }
.qfinal-stats { display:grid; grid-template-columns:repeat(auto-fit, minmax(120px,1fr)); gap:1px; max-width:600px; margin:0 auto 28px; background:rgba(247,243,236,.12); border-radius:6px; overflow:hidden; }
.qfs-cell { background:rgba(10,20,24,.6); padding:14px 14px; display:flex; flex-direction:column; gap:2px; }
.qfsc-n { font-family:var(--q-display); font-weight:500; font-size:24px; letter-spacing:-.02em; color:var(--q-orange); line-height:1; }
.qfsc-l { font-family:var(--q-mono); font-size:9.5px; letter-spacing:.13em; text-transform:uppercase; color:rgba(247,243,236,.65); }
@media (max-width:540px) { .qfinal-stats { grid-template-columns:1fr 1fr; } }

/* ============== v7 — final mobile + visual fixes ============== */

/* hard overflow guard — extra safety */
body[data-page="quad-pillar"] .qsec, body[data-page="quad-pillar"] .qhero, body[data-page="quad-pillar"] .qintro, body[data-page="quad-pillar"] .qfinal { overflow-x: clip; }

/* hero photo frame — reduce empty space, taller content overlay */
.qhv-frame { aspect-ratio: 4/3; }
@media (max-width: 880px) { .qhv-frame { aspect-ratio: 4/3; max-width: 100%; } }
@media (max-width: 540px) { .qhv-frame { aspect-ratio: 4/3; } }
.qhv-photo { object-position: center center; }

/* intro h2 mobile fit */
.qintro-h2 { font-size: clamp(24px, 5.6vw, 48px) !important; word-break: normal; hyphens: auto; }
@media (max-width: 540px) {
  .qintro-h2 { font-size: clamp(22px, 6.5vw, 30px) !important; line-height: 1.15; }
  .qintro-h2 .qaccent { display: inline; }
}

/* sec-h2 mobile fit (other sections) */
@media (max-width: 540px) {
  .qsec-h2 { font-size: clamp(22px, 7vw, 32px) !important; line-height: 1.12; }
  .qfinal-h { font-size: clamp(28px, 8vw, 44px) !important; }
  .qhero-h1 { font-size: clamp(40px, 12vw, 64px) !important; }
}

/* rider picker — clean SVG icons */
.qrtype-icon { display: inline-flex; align-items: center; justify-content: center; width: 36px; height: 36px; border-radius: 8px; background: var(--q-orange-soft); color: var(--q-orange); flex: 0 0 auto; font-size: 0; }
.qrtype-icon svg { display: block; }
.qrtype[data-key="kids"]     .qrtype-icon { background: rgba(75,179,204,.14); color: #2A8FA8; }
.qrtype[data-key="beginner"] .qrtype-icon { background: rgba(95,168,91,.14); color: #4F8E4F; }
.qrtype[data-key="standard"] .qrtype-icon { background: rgba(212,168,67,.16); color: #B08826; }
.qrtype[data-key="sport"]    .qrtype-icon { background: rgba(232,101,43,.16); color: var(--q-orange); }
.qrtype[data-key="bigred"]   .qrtype-icon { background: rgba(194,65,12,.16); color: var(--q-orange-deep); }
.qrtype[data-key="advanced"] .qrtype-icon { background: rgba(110,16,16,.14); color: #6E1010; }

/* rider picker mobile chip alignment + REC pill clip fix */
@media (max-width: 540px) {
  .qrtype-head { gap: 6px; }
  .qrtype-tag { font-size: 17px; }
  .qrtype-chip { font-size: 9px; padding: 3px 6px; letter-spacing: .1em; }
  .qrt-pick { padding: 8px 10px; gap: 6px 8px; font-size: 12px; }
  .qrt-cc { font-size: 9.5px; }
  .qrt-rec-pill { font-size: 8.5px; padding: 2px 5px; letter-spacing: .12em; }
}

/* hero meta-bar mobile — tighter wrap */
@media (max-width: 540px) {
  .qhv-meta-bar { gap: 4px; left: 12px; right: 12px; bottom: 12px; }
  .qhvm-cell { font-size: 9px; padding: 4px 7px; gap: 4px; }
  .qhvm-cell b { font-size: 8.5px; }
  .qhv-overlay { top: 12px; right: 12px; gap: 4px; }
  .qhv-tag { font-size: 9px; padding: 4px 7px; letter-spacing: .12em; }
  .qhv-corner { width: 18px; height: 18px; }
  .qhv-corner-tl, .qhv-corner-tr { top: 8px; }
  .qhv-corner-bl, .qhv-corner-br { bottom: 8px; }
  .qhv-corner-tl, .qhv-corner-bl { left: 8px; }
  .qhv-corner-tr, .qhv-corner-br { right: 8px; }
}

/* terrain stats list mobile fit */
@media (max-width: 540px) {
  .qter-stats li { padding: 6px 8px; gap: 8px; font-size: 11.5px; }
  .qts-l { flex: 0 0 70px; font-size: 8.5px; }
}

/* cancellation row mobile fit */
@media (max-width: 540px) {
  .qcncl-row { padding: 12px 14px; }
  .qcncl-when { font-size: 10.5px; letter-spacing: .1em; }
  .qcncl-fee { font-size: 13px; }
}

/* faq side support — mobile collapse cleanly */
@media (max-width: 880px) {
  .qfaq-support { padding: 18px; }
  .qfs-h { font-size: 18px; }
}

/* fleet badge mobile shorter */
@media (max-width: 540px) {
  .qcard-badge { font-size: 9.5px; padding: 5px 9px; letter-spacing: .12em; max-width: calc(100% - 24px); }
  .qcard-spec { font-size: 9.5px; letter-spacing: .14em; }
  .qcard-title { font-size: 18px; }
  .qcs-l { font-size: 8.5px; }
  .qcs-v { font-size: 14px; }
  .qcf-amt { font-size: 24px; }
}

/* age + pickup mobile h3 fit */
@media (max-width: 540px) {
  .qage-cell h3 { font-size: 16px; }
  .qpkup-body h3 { font-size: 16px; }
}

/* VS panel mobile h fit */
@media (max-width: 540px) {
  .qvs-card { padding: 22px 18px; }
  .qvs-h { font-size: 18px; padding-right: 70px; }
  .qvs-list li { font-size: 12.5px; }
  .qvs-list b { min-width: 56px; font-size: 9px; }
  .qvs-mark { font-size: 10px; padding: 3px 7px; }
}

/* qsec-head mobile padding tighten */
@media (max-width: 540px) {
  .qsec-head { margin-bottom: 28px; }
  .qsec-lead { font-size: 13.5px; }
  .qsec { padding: clamp(40px, 9vw, 72px) 0; }
}

/* qsec-head emphasis line wrap on mobile */
.qsec-h2, .qintro-h2, .qfinal-h { hyphens: auto; }

/* extra break safety on long words */
.qsec-h2, .qintro-h2, .qfinal-h, .qhero-h1, .qcard-title, .qter-name, .qrtype-tag, .qfs-h { overflow-wrap: break-word; word-break: normal; }