/* Friends on Bikes — webapp-customer shared stylesheet
   Track A "Cream & Ink" (design-system.md v4.0, DEV-4).
   Consolidates the shared rules formerly inlined per page (§7 contract).
   Supersedes the retired forest-token styles.css (deleted per DEV-4).
   Load order: this file FIRST, then each page's inline <style> block
   (page-specific rules and overrides win via source order/specificity).

   Dark-surface alpha conventions (§1.2) — carried as literals, not tokens:
   - nav scrolled/interior bg: rgba(20,19,17,.82) + blur(12px)
   - cream-alpha text ladder on dark: .9/.82/.7/.6/.55/.5 (>= .7 for body text)
   - cream-alpha hairlines on dark: .14/.1/.08
   - ink-alpha borders on light: .16 (inputs), .07–.10 (cards/panels/tiles) */

:root{
  --cream:#f6f4ee; --cream-hi:#faf8f2; --cream-lo:#efece3; --card:#faf8f2;
  --ink:#14130f; --ink-2:#1a1916; --body:#4a483f;
  /* NEW (DEV-4 defect fix): AA-safe replacements for shipped #8a8778/#a8a495 */
  --muted:#6a675a; --faint:#716e60;
  --hairline:#dcd7c9;
  --green:#3f6b3f;
  /* NEW (DEV-4): semantic states */
  --error:#a03325; --success:#3f6b3f;
  --serif:'Newsreader',Georgia,serif; --sans:'Instrument Sans','Helvetica Neue',Arial,sans-serif;
}

/* Reset + base */
*{box-sizing:border-box;margin:0;padding:0}
body{background:var(--cream);color:var(--ink-2);font-family:var(--sans);-webkit-font-smoothing:antialiased;overflow-x:hidden}
a{color:inherit;text-decoration:none}

/* Launch countdown takeover (CR-003, redesigned against sponsor mock
   "Launch Countdown Banner.dc.html") — a full-screen overlay, not a
   content-pushing bar, so it needs no nav/body offset mechanism. Scoped
   font stack (Cormorant Garamond / Jost) and dark palette are deliberately
   independent of the site's Cream & Ink tokens — a one-time cinematic
   moment, not a persistent UI surface. */
.launch{position:fixed;inset:0;z-index:9999;display:grid;place-items:stretch;padding:2.2vmin;box-sizing:border-box;background:rgba(9,10,9,.74);backdrop-filter:blur(6px);animation:fob_backdrop .5s ease both;font-family:'Jost',system-ui,sans-serif}
.launch .shell{position:relative;overflow:hidden;border-radius:4px;background:#0d0e0d;box-shadow:0 40px 120px rgba(0,0,0,.6);animation:fob_shell .7s cubic-bezier(.2,.7,.2,1) both}
.launch .slide{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;will-change:transform,opacity}
.launch .hero-final{position:absolute;inset:0;opacity:0;animation:fob_final 1.1s ease 8.9s both}
.launch .hero-final img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:fob_kb 20s ease-out 8.9s both}
.launch .scrim{position:absolute;inset:0;background:linear-gradient(180deg,rgba(8,9,8,.62) 0%,rgba(8,9,8,.22) 34%,rgba(8,9,8,.55) 72%,rgba(8,9,8,.86) 100%)}
.launch .rings{position:absolute;inset:0;display:grid;place-items:center;pointer-events:none}
.launch .rings .ring-wrap{position:relative;display:grid;place-items:center;width:44vmin;height:44vmin}
.launch .ring{position:absolute;width:100%;height:100%;border:1px solid rgba(232,220,198,.5);border-radius:50%;opacity:0;animation:fob_ring 2s cubic-bezier(.33,0,.25,1) both}
.launch .num{position:absolute;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-size:26vmin;line-height:1;color:#f4ede0;text-shadow:0 6px 40px rgba(0,0,0,.45);opacity:0;animation:fob_num 2s cubic-bezier(.33,0,.25,1) both}
.launch .taglines{position:absolute;left:0;right:0;top:calc(50% + 22vmin);display:grid;place-items:start center;padding:0 8vmin;box-sizing:border-box;pointer-events:none}
.launch .taglines .inner{position:relative;display:grid;place-items:center;width:100%;max-width:900px}
.launch .taglines p{position:absolute;margin:0;text-align:center;font-family:'Cormorant Garamond',Georgia,serif;font-style:italic;font-weight:300;font-size:clamp(20px,3.4vmin,44px);line-height:1.2;color:#f6f1e6;text-wrap:balance;text-shadow:0 4px 30px rgba(0,0,0,.55);opacity:0;animation:fob_num 2s cubic-bezier(.33,0,.25,1) both}
.launch .content{position:absolute;inset:0;display:grid;place-items:center;padding:0 8vmin;box-sizing:border-box;text-align:center}
.launch .content .inner{position:relative;width:100%;max-width:1040px;display:grid;place-items:center}
.launch .waiting{position:absolute;opacity:0;animation:fob_line_in 1.3s cubic-bezier(.2,.7,.2,1) 9.25s both,fob_line_out 1s ease 12.65s forwards}
.launch .waiting p{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;font-style:italic;font-size:clamp(30px,6.2vmin,86px);line-height:1.12;color:#f6f1e6;letter-spacing:.01em;text-wrap:pretty;text-shadow:0 4px 34px rgba(0,0,0,.5)}
.launch .reveal{position:absolute;display:grid;justify-items:center;gap:3.2vmin;opacity:0;animation:fob_line_in 1.4s cubic-bezier(.2,.7,.2,1) 13.65s both}
.launch .reveal img{width:min(300px,38vmin);height:auto;opacity:.96;filter:drop-shadow(0 4px 26px rgba(0,0,0,.55))}
.launch .reveal-text{display:grid;justify-items:center;gap:1.6vmin}
.launch .reveal-text h2{margin:0;font-family:'Cormorant Garamond',Georgia,serif;font-weight:400;font-size:clamp(26px,5vmin,68px);line-height:1.14;color:#fff;text-wrap:balance;text-shadow:0 4px 34px rgba(0,0,0,.55)}
.launch .rule{width:120px;height:1px;background:rgba(232,220,198,.75);transform-origin:center;animation:fob_rule 1.1s cubic-bezier(.2,.7,.2,1) 14.75s both}
.launch .eyebrow-launch{margin:0;font-size:clamp(12px,1.5vmin,16px);letter-spacing:.34em;text-transform:uppercase;color:rgba(240,233,220,.78);font-weight:300;opacity:0;animation:fob_up 1s ease 15.05s both}
.launch .launch-cta{display:inline-flex;align-items:center;gap:14px;min-height:48px;padding:0 30px;border:1px solid rgba(246,241,230,.55);border-radius:2px;color:#f6f1e6;font-size:13px;letter-spacing:.26em;text-transform:uppercase;background:rgba(12,13,12,.28);backdrop-filter:blur(2px);opacity:0;animation:fob_up 1s ease 15.45s both;transition:background .35s ease,border-color .35s ease,color .35s ease}
.launch .launch-cta:hover{background:rgba(246,241,230,.94);border-color:#f6f1e6;color:#101110}
.launch .launch-cta span{font-family:'Cormorant Garamond',Georgia,serif;font-size:18px;letter-spacing:0}
.launch .progress-track{position:absolute;top:0;left:0;right:0;height:2px;background:rgba(246,241,230,.14)}
.launch .progress-bar{height:100%;background:rgba(246,241,230,.7);transform-origin:left center;animation:fob_bar 8.5s linear .4s both}
.launch .brand-label{position:absolute;top:3.2vmin;left:3.6vmin;display:flex;align-items:center;gap:12px;font-size:clamp(10px,1.3vmin,13px);letter-spacing:.32em;text-transform:uppercase;color:rgba(246,241,230,.8)}
.launch .brand-label .rule-mini{display:block;width:26px;height:1px;background:rgba(246,241,230,.6)}
.launch .close{position:absolute;top:2.6vmin;right:2.6vmin;width:48px;height:48px;display:grid;place-items:center;border:1px solid rgba(246,241,230,.4);border-radius:50%;background:rgba(12,13,12,.36);backdrop-filter:blur(3px);color:#f6f1e6;font-family:'Jost',sans-serif;font-size:20px;line-height:1;cursor:pointer;transition:background .3s ease,color .3s ease,border-color .3s ease,transform .3s ease}
.launch .close:hover,.launch .close:focus-visible{background:rgba(246,241,230,.95);color:#101110;border-color:#f6f1e6;transform:rotate(90deg)}

@keyframes fob_backdrop{from{opacity:0}to{opacity:1}}
@keyframes fob_shell{from{opacity:0;transform:scale(1.02)}to{opacity:1;transform:scale(1)}}
@keyframes fob_zoom{0%{opacity:0;transform:scale(1.26)}18%{opacity:1;transform:scale(1.19)}62%{opacity:1;transform:scale(1.1)}100%{opacity:0;transform:scale(1.04)}}
@keyframes fob_wipe{0%{opacity:1;clip-path:inset(0 100% 0 0);transform:scale(1.2) translateX(1.4%)}34%{clip-path:inset(0 0 0 0)}62%{opacity:1;transform:scale(1.12) translateX(.4%)}100%{opacity:0;transform:scale(1.06) translateX(0)}}
@keyframes fob_rise{0%{opacity:1;clip-path:inset(100% 0 0 0);transform:scale(1.2) translateY(2.4%)}34%{clip-path:inset(0 0 0 0)}62%{opacity:1;transform:scale(1.12) translateY(.8%)}100%{opacity:0;transform:scale(1.06) translateY(0)}}
@keyframes fob_focus{0%{opacity:0;filter:blur(22px) saturate(.5);transform:scale(1.24)}30%{opacity:1;filter:blur(0) saturate(1);transform:scale(1.17)}62%{opacity:1;transform:scale(1.12)}100%{opacity:0;filter:blur(3px);transform:scale(1.06)}}
@keyframes fob_split{0%{opacity:1;clip-path:inset(50% 0 50% 0);transform:scale(1.22)}36%{clip-path:inset(0 0 0 0)}62%{opacity:1;transform:scale(1.13)}100%{opacity:0;transform:scale(1.06)}}
@keyframes fob_final{from{opacity:0}to{opacity:1}}
@keyframes fob_kb{from{transform:scale(1.16) translate3d(1.2%,1%,0)}to{transform:scale(1.02) translate3d(0,0,0)}}
@keyframes fob_num{0%{opacity:0;transform:scale(1.22)}22%{opacity:1;transform:scale(1.05)}62%{opacity:.96;transform:scale(1)}100%{opacity:0;transform:scale(.94)}}
@keyframes fob_ring{0%{opacity:0;transform:scale(.82)}24%{opacity:.4}100%{opacity:0;transform:scale(1.34)}}
@keyframes fob_line_in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
@keyframes fob_line_out{from{opacity:1;transform:translateY(0);filter:blur(0)}to{opacity:0;transform:translateY(-16px);filter:blur(6px)}}
@keyframes fob_rule{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes fob_up{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes fob_bar{from{transform:scaleX(0)}to{transform:scaleX(1)}}

/* Reduced motion (NEW — not present in the source mock): collapse straight
   to the final "opening for tours" panel with no slideshow/countdown, per
   this site's UXC-MOT-2 convention (no motion-preference exceptions). */
@media(prefers-reduced-motion:reduce){
  .launch,.launch *{animation:none!important;transition:none!important}
  .launch .shell{opacity:1;transform:none}
  .launch .slide,.launch .rings,.launch .taglines,.launch .waiting,.launch .progress-bar,.launch .skip{display:none!important}
  .launch .hero-final{opacity:1}
  .launch .hero-final img{transform:none}
  .launch .reveal{opacity:1;position:relative}
  .launch .eyebrow-launch,.launch .launch-cta{opacity:1}
}

/* Skip-to-end (NEW): shows on every visit, not just first — a prominent
   skip button lets repeat visitors jump straight past the countdown
   instead of re-watching the full sequence on every page navigation.
   Reuses the reduced-motion "jump to final state" treatment above,
   triggered by a class instead of a media feature. */
.launch .skip{position:absolute;right:3.6vmin;bottom:3.6vmin;z-index:2;display:grid;place-items:center;width:76px;height:76px;border:none;border-radius:50%;background:linear-gradient(145deg,#ff8a3d 0%,#f0651c 45%,#b8380c 100%);color:#fff;font-family:'Jost',system-ui,sans-serif;font-size:12px;font-weight:500;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;box-shadow:0 12px 28px rgba(184,56,12,.5),0 4px 12px rgba(0,0,0,.35);transition:transform .25s cubic-bezier(.2,.7,.2,1),box-shadow .25s ease,filter .25s ease}
.launch .skip:hover,.launch .skip:focus-visible{transform:scale(1.08);box-shadow:0 16px 36px rgba(184,56,12,.6),0 6px 16px rgba(0,0,0,.4);filter:brightness(1.08)}
.launch .skip:active{transform:scale(.97)}
.launch.launch--skip .slide,.launch.launch--skip .rings,.launch.launch--skip .taglines,.launch.launch--skip .waiting,.launch.launch--skip .progress-bar,.launch.launch--skip .skip{display:none!important}
.launch.launch--skip,.launch.launch--skip *{animation:none!important;transition:none!important}
.launch.launch--skip .shell{opacity:1;transform:none}
.launch.launch--skip .hero-final{opacity:1}
.launch.launch--skip .hero-final img{transform:none}
.launch.launch--skip .reveal{opacity:1;position:relative}
.launch.launch--skip .eyebrow-launch,.launch.launch--skip .launch-cta{opacity:1}

/* Focus (NEW, §5.2) — green ring on light, cream ring on dark surfaces */
:focus-visible{outline:2px solid var(--green);outline-offset:2px}
nav.top :focus-visible,.stats :focus-visible,.reviews :focus-visible,
footer :focus-visible,.hero :focus-visible{outline-color:var(--cream)}
.cta :focus-visible{outline-color:#fff}

/* Skip link (NEW, §5.3) */
.skip-link{position:fixed;top:-100px;left:0;z-index:100;background:var(--ink-2);color:var(--cream);font-size:14px;font-weight:600;padding:12px 20px}
.skip-link:focus{top:0}

/* Eyebrow */
.eyebrow{text-transform:uppercase;letter-spacing:.22em;font-size:13px;color:var(--green)}

/* Fixed nav — transparent base + dark .on state (interior pages carry a static
   "on" class; the home page toggles it at scrollY > 60) */
nav.top{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;align-items:center;justify-content:space-between;padding:18px 48px;background:transparent;transition:background .4s ease,box-shadow .4s ease,padding .4s ease}
nav.top.on{background:rgba(20,19,17,.82);backdrop-filter:blur(12px);box-shadow:0 1px 0 rgba(246,244,238,.08)}
nav.top img{height:150px;width:auto;display:block}
.nlinks{display:flex;align-items:center;gap:40px}
.nlinks a{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:rgba(246,244,238,.9)}
.nlinks a:hover{color:#fff}
.lang{font-size:12px;letter-spacing:.12em;color:rgba(246,244,238,.5)}
.lang a{color:rgba(246,244,238,.5)} .lang a.on{color:#f6f4ee}
.booknow{padding:13px 26px;background:var(--green);color:#fff;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}

/* Buttons — solid (green fill) and ghost (cream outline, dark/hero surfaces) */
.solid{padding:16px 32px;background:var(--green);color:#fff;font-weight:600;font-size:15px;letter-spacing:.04em}
.ghost{padding:16px 32px;border:1px solid rgba(246,244,238,.5);color:var(--cream);font-weight:500;font-size:15px;letter-spacing:.04em}
.ghost:hover{background:rgba(246,244,238,.12)}

/* Section head pattern */
.sec{padding:110px 40px;max-width:1200px;margin:0 auto}
.sec.center{text-align:center}
.sec h2{font-family:var(--serif);font-weight:500;font-size:clamp(32px,4.5vw,52px);letter-spacing:-.02em;line-height:1.08;margin:16px auto 0;max-width:760px}
.sec .sub{font-size:18px;color:#5a584f;max-width:660px;margin:20px auto 0;line-height:1.5}

/* Tour card */
.tcard{display:flex;flex-direction:column;background:var(--card);border:1px solid rgba(26,25,22,.09);border-radius:4px;overflow:hidden;box-shadow:0 1px 2px rgba(26,25,22,.04);transition:transform .45s ease,box-shadow .45s ease}
.tcard:hover{transform:translateY(-8px);box-shadow:0 22px 50px rgba(26,25,22,.14)}
.tcard-img{position:relative;aspect-ratio:4/5;background:#e6e2d8;overflow:hidden}
.tcard-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.tcard-badge{position:absolute;top:18px;left:18px;padding:8px 15px;background:rgba(20,20,17,.4);backdrop-filter:blur(6px);color:#fff;font-size:11px;font-weight:600;letter-spacing:.16em;text-transform:uppercase}
.tcard-badge.pop{background:var(--green)}
.tcard-body{padding:28px 28px 30px;display:flex;flex-direction:column;flex:1;text-align:left}
.tcard-meta{display:flex;gap:13px;font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:var(--muted);margin-bottom:16px}
.tcard-meta .s{opacity:.35}
.tcard-name{font-family:var(--serif);font-weight:500;font-size:31px;letter-spacing:-.015em;line-height:1.04;margin-bottom:14px}
.tcard-desc{font-size:15px;line-height:1.6;color:#5a584f;margin-bottom:24px}
.tcard-hll{font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--faint);margin-bottom:9px}
.tcard-hl{font-size:14.5px;line-height:1.75;color:var(--body);margin-bottom:28px}
.tcard-foot{margin-top:auto;display:flex;align-items:baseline;justify-content:space-between;padding-top:20px;border-top:1px solid var(--hairline)}
.tcard-price{font-family:var(--serif);font-size:33px;letter-spacing:-.01em}
.tcard-price-old{font-family:var(--serif);font-size:19px;letter-spacing:-.01em;color:var(--muted);text-decoration:line-through;text-decoration-color:var(--error);margin-right:2px}
.tcard-pp{font-size:13px;letter-spacing:.04em;color:var(--muted)}
.tcard-book{font-weight:600;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--green)}

/* Textured tile (grain motif) */
.tile{text-align:left;background-color:#f4f1e8;background-image:repeating-linear-gradient(45deg,rgba(26,25,22,.022) 0,rgba(26,25,22,.022) 1px,transparent 1px,transparent 9px),radial-gradient(120% 90% at 20% 0%,rgba(255,255,255,.55) 0%,rgba(255,255,255,0) 55%);border:1px solid rgba(26,25,22,.07);border-radius:4px;padding:46px 40px;box-shadow:0 1px 2px rgba(26,25,22,.03);transition:transform .4s ease,box-shadow .4s ease}
.tile:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(26,25,22,.09)}
.tile .badge{width:46px;height:46px;border-radius:3px;background:var(--green);display:flex;align-items:center;justify-content:center;color:#fff;font-family:var(--serif);font-size:22px;margin-bottom:24px}
.tile h3{font-family:var(--serif);font-weight:500;font-size:23px;margin-bottom:13px;letter-spacing:-.01em}
.tile p{font-size:15px;line-height:1.62;color:#5a584f}

/* Stats band */
.stats{background:var(--ink-2);color:var(--cream);padding:56px 40px}
.stats .row{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.stats .stat{text-align:center}
.stats .n{font-family:var(--serif);font-size:clamp(38px,5vw,60px);line-height:1;color:var(--green)}
.stats .l{margin-top:12px;font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:rgba(246,244,238,.7)}
.stats .badges{max-width:1100px;margin:40px auto 0;padding-top:28px;border-top:1px solid rgba(246,244,238,.14);display:flex;flex-wrap:wrap;justify-content:center;gap:40px;font-size:14px;color:rgba(246,244,238,.7)}

/* Footer — full (4-col) + compact (.frow) variants */
footer{background:var(--ink);color:rgba(246,244,238,.6);padding:60px 40px 36px}
footer .cols{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:40px}
footer .brand{font-family:var(--serif);font-size:22px;color:#f6f4ee}
footer h4{color:#f6f4ee;font-size:14px;font-weight:600;margin-bottom:16px}
footer .fcol{display:flex;flex-direction:column;gap:10px;font-size:14px}
footer .fcol a:hover{color:#f6f4ee}
footer .bar{max-width:1200px;margin:48px auto 0;padding-top:24px;border-top:1px solid rgba(246,244,238,.1);font-size:13px;display:flex;flex-wrap:wrap;gap:16px;justify-content:space-between}
footer .frow{max-width:1200px;margin:0 auto;display:flex;justify-content:space-between;flex-wrap:wrap;gap:20px;font-size:14px}
/* CHG-029 (site half) — quiet build marker, populated by version.js. Never
   the loudest thing in the footer; exists so a stale cache/deploy is
   verifiable at a glance instead of silently served. */
.site-version{font-family:ui-monospace,monospace;font-size:11px;opacity:.45;margin-left:10px}
.f-footer .site-version{margin-left:6px}

/* Form primitives */
label{font-size:12px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-bottom:8px;display:block}
input,textarea,select{font-family:inherit;font-size:15px;color:var(--ink-2);background:#fff;border:1px solid rgba(26,25,22,.16);border-radius:3px;padding:13px 15px;width:100%;transition:border-color .2s ease,box-shadow .2s ease}
input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px color-mix(in srgb,var(--green) 16%,transparent)}
textarea{resize:vertical}
button.send,button.go{padding:16px 36px;background:var(--green);color:#fff;border:none;font-family:inherit;font-size:14px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;transition:transform .25s ease,filter .25s ease}
button.send:hover,button.go:hover{transform:translateY(-2px);filter:brightness(1.08)}
.note{margin-top:18px;font-size:14px;line-height:1.5;opacity:0;transition:opacity .4s ease}
.note.show{opacity:1}
.note.ok{color:var(--success)} .note.err{color:var(--error)}

/* Disabled states (NEW, §5.4 — replaces shipped opacity:.6) */
button.send[disabled],button.go[disabled],button[disabled],
.solid[aria-disabled="true"],.booknow[aria-disabled="true"]{background:var(--cream-lo);color:var(--muted);cursor:not-allowed;transform:none;box-shadow:none;filter:none}
input[disabled],select[disabled],textarea[disabled]{background:var(--cream-lo);color:var(--muted);border-color:rgba(26,25,22,.09)}

/* Error / validation states (NEW, §5.4) — never colour-only: pair with a
   visible message + aria-invalid="true"/aria-describedby */
input[aria-invalid="true"],select[aria-invalid="true"],textarea[aria-invalid="true"],
input.invalid,select.invalid,textarea.invalid{border:1.5px solid var(--error)}
input[aria-invalid="true"]:focus,select[aria-invalid="true"]:focus,textarea[aria-invalid="true"]:focus,
input.invalid:focus,select.invalid:focus,textarea.invalid:focus{border-color:var(--error);box-shadow:0 0 0 3px color-mix(in srgb,var(--error) 14%,transparent)}
.field-error{margin-top:8px;font-size:13px;color:var(--error)}

/* Reveal-on-scroll (shared pattern; page scripts add .in) */
[data-reveal]{opacity:0;transform:translateY(22px);transition:opacity .7s ease,transform .7s cubic-bezier(.16,1,.3,1);transition-delay:var(--rd,0ms)}
[data-reveal].in{opacity:1;transform:none}

/* Per-component reveal transforms (source mock: London Bike Tours.dc.html) —
   the tour cards and review cards use a heavier drop+scale entrance than the
   generic translateY reveal; matched here rather than flattened to one rule. */
.tcard[data-reveal]{transform:translateY(52px) scale(.96);transition:opacity .95s cubic-bezier(.16,1,.3,1),transform .95s cubic-bezier(.16,1,.3,1),box-shadow .45s ease;transition-delay:var(--rd,0ms)}
.rcard[data-reveal]{transform:translateY(28px) scale(.97);transition:opacity .7s ease,transform .7s ease;transition-delay:var(--rd,0ms)}
.tcard[data-reveal].in,.rcard[data-reveal].in{transform:none}

/* Card-image reveal: blur-to-sharp clip wipe, then a slow idle drift (Ken Burns) */
[data-cascade]{opacity:0}
[data-cascade].in{opacity:1}
[data-reveal-clip]{clip-path:inset(0 0 100% 0);filter:blur(14px);transition:opacity 1s ease,clip-path 1.3s cubic-bezier(.16,1,.3,1),filter 1.1s ease}
[data-reveal-clip].in{clip-path:inset(0 0 0% 0);filter:blur(0)}
[data-kenburns]{animation:fobKenburns 22s ease-in-out infinite alternate;animation-play-state:paused}
[data-kenburns].in{animation-play-state:running}
@keyframes fobKenburns{
  0%{transform:scale(1.04) translate(0,0)}
  100%{transform:scale(1.13) translate(-1.5%,-1%)}
}

/* Reduced motion (NEW = complete coverage, §5.5) */
@media (prefers-reduced-motion:reduce){
  [data-reveal],[data-cascade]{opacity:1!important;transform:none!important}
  [data-reveal-clip]{clip-path:none!important;filter:none!important}
  [data-kenburns]{animation:none!important}
  .hero .bg{transform:none!important;animation:none!important}
  .island-skeleton .bar{animation:none}
  .tcard,.tile,.tier,button,a{transition:none}
  .tcard:hover,.tile:hover,.tier:hover,button:hover{transform:none}
  nav.top{transition:none}
  .process .line{transition:none}
}

/* Shared responsive collapse */
@media(max-width:900px){
  .nlinks{display:none}
  .stats .row,footer .cols{grid-template-columns:1fr}
}