/* ===== v3: hero goes orange, like the CTA and footer panel ===== */
.hero .h-xl{color:#2b1608}
.hero .tag,.hero .lab,.hero .price,.hero .corner,.hero .corner em{color:#2b1608}
.hero .lab i{background:#fff}
.hero .lab em{color:rgba(43,22,8,.7)}
.hero .btn-line{background:#343434;border-color:#343434;color:#fff}
.hero .btn-line:hover{background:#fff;border-color:#fff;color:#343434}
.hero .details{color:#2b1608}
.hero .details b{background:#343434;color:#fff}
.wordmark span{color:#fff}

/* ===== why: caption, clearer layout ===== */
.seq{right:-2vw;top:55%;width:min(76vw,1360px)}
.seq-cap{position:absolute;right:var(--pad);top:calc(var(--pad) * 4.4);z-index:2;display:flex;align-items:center}
.seq-cap span{font-weight:500}
.reasons li{opacity:.4}
.reasons li.on{opacity:1}

/* ===== carousel: product view presets, bigger info card ===== */
.views{display:flex;gap:6px;flex-wrap:wrap}
.views button{height:30px;padding:0 14px;border-radius:99px;border:1px solid rgba(52,52,52,.35);font-size:11.5px;font-weight:500;transition:background .3s var(--ease),color .3s,border-color .3s}
.views button:hover{border-color:var(--orange);color:var(--orange)}
.views button.on{background:var(--orange);border-color:var(--orange);color:#fff}
.car-info{width:min(360px,40vw)}

/* ===== bundle CTA (orange) ===== */
.bundle{position:relative;padding:clamp(80px,10vw,150px) var(--pad);color:#fff}
.bun-head{display:flex;flex-direction:column;gap:12px;margin-bottom:clamp(28px,4vw,60px)}
.h-sub.inv em{color:rgba(255,255,255,.62)}
.h-sub.inv{color:#fff}
.bun-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}
.btile{position:relative;background:#fff;color:var(--charcoal);display:flex;flex-direction:column;overflow:hidden;transition:transform .7s var(--ease)}
.btile:hover{transform:translateY(-8px)}
.btile.hot{outline:3px solid #343434;outline-offset:-3px}
.tag-hot{position:absolute;left:14px;top:14px;z-index:2;font-style:normal;font-size:10px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;background:#343434;color:#fff;padding:5px 10px;border-radius:99px}
.bimg{position:relative;aspect-ratio:1/.78;background:#ececec;display:grid;place-items:center;overflow:hidden}
.bimg img{position:absolute;width:74%;left:13%;top:12%;filter:drop-shadow(0 18px 22px rgba(0,0,0,.18));transition:transform .9s var(--ease)}
.bimg img.s{width:46%;left:auto;right:6%;top:auto;bottom:6%}
.bimg img.s2{width:40%;left:5%;top:auto;bottom:4%}
.btile:hover .bimg img{transform:translateY(-6px) scale(1.03)}
.bmeta{padding:20px 22px 22px;display:flex;flex-direction:column;gap:8px}
.bmeta b{font-size:22px;font-weight:700;letter-spacing:-.04em}
.bmeta p{font-size:12.5px;line-height:1.5;color:#666}
.brow{display:flex;justify-content:space-between;align-items:center;margin-top:8px;font-size:18px;font-weight:700;letter-spacing:-.03em}
.brow s{font-size:12px;font-weight:400;color:var(--mid);margin-right:6px}
.bun-note{margin-top:20px;font-size:11px;color:rgba(255,255,255,.85)}

/* ===== touch: pinned macro panels ===== */
.touch{display:block;background:#1d1d1d;grid-template-columns:none}
.tp{position:absolute;inset:0;overflow:hidden;clip-path:inset(0 0 0 0)}
.tp img{position:absolute;inset:-6% 0;width:100%;height:112%;object-fit:cover}
.tp2,.tp3{clip-path:inset(100% 0 0 0)}
.touch-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.28),transparent 30%,rgba(0,0,0,.5));pointer-events:none}
.touch-h{bottom:calc(var(--pad) * 3.6)}
.touch-caps{position:absolute;left:var(--pad);bottom:var(--pad);display:flex;gap:clamp(20px,3vw,48px);list-style:none;color:#fff;z-index:2}
.touch-caps li{opacity:.6;max-width:24ch;transition:opacity .5s var(--ease);border-top:1px solid rgba(255,255,255,.4);padding-top:10px}
.touch-caps li.on{opacity:1;border-color:var(--orange)}
.touch-caps b{display:block;font-size:14px;margin-bottom:4px}
.touch-caps p{font-size:11.5px;line-height:1.45;color:#e8e8e8}
.touch-prog{position:absolute;right:var(--pad);bottom:var(--pad);width:120px;height:2px;background:rgba(255,255,255,.3)}
.touch-prog i{display:block;height:100%;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left}

/* ===== voices: featured quote + product selector ===== */
.voices-head .lab{color:#fff}
.v-grid{display:grid;grid-template-columns:1.25fr .85fr;gap:clamp(24px,4vw,64px);padding:0 var(--pad);align-items:start}
.v-feat{display:flex;flex-direction:column;gap:clamp(20px,2.4vw,34px);min-height:clamp(300px,34vw,460px)}
.v-feat .q{font-size:clamp(90px,10vw,150px);line-height:.5;color:var(--orange);font-weight:700;height:.45em}
.v-feat blockquote{font-size:clamp(24px,3.1vw,48px);font-weight:700;letter-spacing:-.05em;line-height:1.08;max-width:22ch;min-height:6.6em}
.v-who{display:flex;align-items:center;gap:14px}
.v-who i{display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--orange);font-style:normal;font-size:13px;font-weight:700}
.v-who b{display:block;font-size:15px}
.v-who small{color:#aaa;font-size:12px}
.stars{margin-left:auto;color:var(--orange);letter-spacing:.12em;font-size:15px}
.v-ctl{display:flex;align-items:center;gap:16px;margin-top:auto}
.circ-btn.on-dark{border-color:#fff;color:#fff}
.v-bar{flex:1;height:2px;background:rgba(255,255,255,.22);max-width:260px}
.v-bar i{display:block;height:100%;width:100%;background:var(--orange);transform:scaleX(0);transform-origin:left}
.v-list{display:flex;flex-direction:column;gap:8px}
.v-item{display:grid;grid-template-columns:76px 1fr;gap:16px;align-items:center;text-align:left;padding:10px 16px 10px 10px;background:#3d3d3d;border-left:3px solid transparent;transition:background .4s var(--ease),border-color .3s,transform .6s var(--ease)}
.v-item:hover{background:#464646;transform:translateX(6px)}
.v-item.on{background:#4a4a4a;border-color:var(--orange)}
.v-item .vi{aspect-ratio:1;background:#e6e6e6;display:grid;place-items:center;overflow:hidden}
.v-item .vi img{width:90%;height:90%;object-fit:contain}
.v-item b{display:block;font-size:14px;margin-bottom:3px}
.v-item small{display:block;color:#bbb;font-size:11.5px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.sample-note{margin-top:30px}

/* ===== faq: pills ===== */
.faq-top{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;margin-bottom:clamp(14px,2vw,26px)}
.faq-top .faq-h{margin-bottom:0}
.faq-count{padding-bottom:1.2vw}
.faq-count b{font-weight:700}
.pills{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.pills button{height:34px;padding:0 18px;border-radius:99px;background:#e2e2e2;color:#555;font-size:12.5px;font-weight:500;transition:background .3s var(--ease),color .3s,transform .5s var(--ease)}
.pills button:hover{transform:translateY(-2px);background:#d6d6d6}
.pills button.on{background:var(--orange);color:#fff}
.acc-i.hide{display:none}

@media (max-width:900px){
  .bun-grid{grid-template-columns:1fr}
  .v-grid{grid-template-columns:1fr}
  .touch-caps{flex-direction:column;gap:10px;bottom:calc(var(--pad) * 1.4)}
  .touch-h{bottom:calc(var(--pad) * 7)}
  .seq-cap{display:none}
}

/* why: the Cycles frames fill the whole screen; a soft scrim keeps the copy readable */
.seq{position:absolute;inset:0;right:auto;top:0;width:100%;height:100%;aspect-ratio:auto;transform:none;overflow:hidden}
.seq canvas{width:100%;height:100%;object-fit:cover}
.why::before{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(90deg,rgba(203,203,203,.8) 0%,rgba(203,203,203,.6) 20%,rgba(203,203,203,.28) 38%,rgba(203,203,203,0) 58%)}
.why-head,.reasons,.seq-cap,.why-prog{z-index:2}