/* Tour On 2 Wheelers — light "travel booking" theme. Loaded last on every page so it wins over older page styles. */
:root{--ink:#241B21;--navy:#241B21;--accent:#6E2A5E;--accent-d:#521F46;--sky:#6E2A5E;--hl:#6E2A5E;--ice:#EBDAE6;--muted:#5B6474;--line:#E7E2D9;--soft:#F7F4EE;--sand:#F7F4EE;--tint:#F6EDF3;--ok:#0E7A55}
body{background:#fff;color:var(--ink);font-family:Inter,system-ui,sans-serif}
h1,h2,h3,h4{font-family:Poppins,Inter,sans-serif;letter-spacing:-.3px}
a{color:var(--accent)}
.eyebrow{color:var(--accent);letter-spacing:1.4px;font-size:13px}
.h2{font-weight:700}
.lead{color:var(--muted)}

/* buttons */
.btn{font-family:Inter,sans-serif;border-radius:14px}
.btn.blue,body .btn:not(.white):not(.dark):not(.ghost):not(.line){background:var(--accent);color:#fff}
.btn.blue:hover{background:var(--accent-d);color:#fff}
.btn.white{background:#fff;color:var(--ink);border:1px solid var(--line)}
.btn.dark{background:var(--ink);color:#fff}
.btn.line{border:1.5px solid #D9D2C8;color:var(--ink);background:#fff}.btn.line:hover{color:var(--ink);border-color:var(--ink)}
.btn.ghost{border:1.5px solid #D9D2C8;color:var(--ink);background:#fff}
.btn:disabled{background:#CDB3C4 !important}
.lift:hover{box-shadow:0 22px 44px -26px rgba(36,27,33,.35)}

/* header / menu */
.t2w-nav{padding:14px 0}
.t2w-nav .bar{background:#fff;border:1px solid var(--line);border-radius:18px;padding:8px 8px 8px 16px;box-shadow:0 10px 30px -22px rgba(36,27,33,.35);backdrop-filter:none;-webkit-backdrop-filter:none}
.t2w-brand,.t2w-brand:hover{color:var(--ink);font-family:Poppins,sans-serif;font-weight:700}
.t2w-brand .logo{border-radius:12px;background:var(--accent);color:#fff;font-family:Poppins,sans-serif}
.t2w-links a{color:var(--ink);font-weight:600}
.t2w-links a:hover,.t2w-links a[aria-current="page"]{color:var(--accent)}
.t2w-nav .tel{color:var(--ink);font-weight:700;text-decoration:none;font-size:15px;padding:0 10px;white-space:nowrap}
.t2w-nav .call{min-height:44px;border-radius:12px}
.t2w-menu{background:var(--soft);color:var(--ink);border-radius:12px}
.t2w-drop{border:1px solid var(--line);box-shadow:0 30px 60px -24px rgba(36,27,33,.35);top:76px}

/* page heroes (inner pages) */
.t2w-hero,.hero{background:linear-gradient(180deg,#F7F4EE 0%,#FBFAF7 100%);color:var(--ink);padding-bottom:110px}
.t2w-hero .glow,.hero .glow,.stars{display:none !important}
.t2w-hero .ridges,.hero .ridges{animation:none;width:100%;height:170px;opacity:1}
.t2w-hero .ridges path:nth-child(1),.hero .ridges path:nth-child(1){fill:#E9E4DA}
.t2w-hero .ridges path:nth-child(2),.hero .ridges path:nth-child(2){fill:#EBDAE6}
.t2w-hero .ridges path:nth-child(3),.hero .ridges path:nth-child(3){fill:#fff}
.t2w-hero h1,.hero h1{color:var(--ink);font-weight:700;letter-spacing:-1px}
.t2w-hero h1 span,.hero h1 span{color:var(--accent)}
.t2w-hero p.intro,.hero p.intro,.hero p{color:var(--muted)}
.t2w-crumbs,.crumbs{color:var(--muted)}.t2w-crumbs a,.crumbs a{color:var(--muted)}
.chips span,.pickups span.p,.badge{background:#fff;border:1px solid var(--line);color:var(--ink)}
.pickups .lab{color:var(--muted)}
.stats div{background:#fff;border:1px solid var(--line);box-shadow:0 10px 30px -24px rgba(36,27,33,.4)}
.stats b{color:var(--ink);font-family:Poppins,sans-serif}
.stats small{color:var(--muted)}
.dot{background:var(--ok)}
/* admin hero photo shows as a picture on the right */
.t2w-hero .bgimg{display:none}
.t2w-hero .bgimg.has{display:block;left:auto;right:max(24px,calc((100vw - 1240px)/2 + 24px));top:110px;bottom:70px;width:min(40vw,480px);border-radius:24px;opacity:1;box-shadow:0 30px 60px -30px rgba(36,27,33,.45);z-index:1}
.t2w-hero .bgimg.has::after{display:none}
@media (min-width:1000px){.t2w-hero:has(.bgimg.has) .in>*:not(.t2w-nav){max-width:calc(100% - min(40vw,480px) - 40px)}}
@media (max-width:999px){.t2w-hero .bgimg.has{display:none}}

/* content sections */
.dark{background:var(--sand);color:var(--ink)}
.dark .lead,.dark p{color:var(--muted)}
.dark .eyebrow{color:var(--accent)}
.dark .tile{background:#fff;border-color:var(--line)}
.dark .tile p{color:var(--muted)}
.dark .tile .ic,.tile .ic{background:var(--tint);color:var(--accent)}
.dark h2,.dark h3{color:var(--ink)}
.enq form{border:1px solid var(--line)}
.callband{border-radius:24px}
.includes div,.dest span{background:var(--sand)}
.soft{background:var(--sand)}
.tile,.opt,.post,.cc,.cform,.place,.bike,details.acc{border-color:var(--line)}
.opt,.bike,.post{border-radius:22px}
.opt .pic .tag,.bike .yr{background:#fff;color:var(--ink);box-shadow:0 4px 14px -6px rgba(0,0,0,.3)}
.opt .pr,.bike .pr,.big{font-family:Poppins,sans-serif}

/* booking forms */
.card{border-color:var(--line) !important;border-radius:20px}
.step{color:var(--accent)}
.choice[aria-pressed="true"],.bike[aria-pressed="true"]{border-color:var(--accent);background:var(--tint)}
.fld input,.fld textarea,.fld select,.field input,.field textarea{border-color:#D6CFC5;border-radius:12px}

/* footer */
.t2w-footer{background:var(--ink);color:#B9C2D3;padding-bottom:100px}
.t2w-footer .big{display:none}
.t2w-footer .bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:20px;margin-top:40px}
.t2w-footer .t2w-brand,.t2w-footer .t2w-brand:hover{color:#fff}

/* sticky bar on phones */
.t2w-sticky{background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -16px rgba(36,27,33,.45);border-radius:18px;backdrop-filter:none;-webkit-backdrop-filter:none}
.t2w-sticky a{color:var(--ink);border-radius:13px}
.t2w-sticky a.b{background:var(--accent);color:#fff}
@media (min-width:1000px){.t2w-sticky{display:none}}
@media (max-width:760px){.t2w-nav .tel{display:none}}
.layout,#done{position:relative;z-index:6}

body .hero2 h1 em,body .t2w-hero h1 span,body .hero h1 span{color:var(--hl)}

/* ---- smooth, iPhone-like feel ---- */
:root{--ios:cubic-bezier(.32,.72,0,1)}
@view-transition{navigation:auto}
::view-transition-old(root),::view-transition-new(root){animation-duration:.35s;animation-timing-function:var(--ios)}
html{-webkit-tap-highlight-color:transparent;-webkit-text-size-adjust:100%}
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility;animation:pageIn .5s var(--ios) both}
@keyframes pageIn{from{opacity:0}to{opacity:1}}
.btn,.t2w-sticky a,.stabs button,.choice,.bike,.ac,.t2w-menu{transition:transform .35s var(--ios),background-color .25s,box-shadow .35s var(--ios),border-color .25s,color .25s}
.btn:active,.t2w-sticky a:active,.choice:active,.bike:active,.t2w-menu:active,.stabs button:active{transform:scale(.96)}
.ac:active{transform:scale(.98)}
.reveal{transform:translateY(18px);transition:opacity .8s var(--ios),transform .8s var(--ios)}
img.fade{opacity:0;transition:opacity .6s var(--ios)}
img.fade.ok{opacity:1}
.skel{background:linear-gradient(90deg,#F3EEEA 25%,#FAF7F5 50%,#F3EEEA 75%);background-size:200% 100%;animation:shimmer 1.3s linear infinite;border-radius:16px}
@keyframes shimmer{to{background-position:-200% 0}}
@keyframes cardIn{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
.opt,.bike,.post{animation:cardIn .6s var(--ios) both}
.opt:nth-child(2),.bike:nth-child(2),.post:nth-child(2){animation-delay:.06s}
.opt:nth-child(3),.bike:nth-child(3),.post:nth-child(3){animation-delay:.12s}
.opt:nth-child(n+4),.bike:nth-child(n+4),.post:nth-child(n+4){animation-delay:.18s}
/* roomier price + button on all cards */
.bike .ft,.opt .ft{flex-direction:column;align-items:stretch;gap:14px}
.bike .ft .btn,.opt .ft .btn{width:100%;min-height:50px}
/* frosted header that follows you when scrolling */
.t2w-nav.stuck .bar{position:fixed;top:10px;left:50%;transform:translateX(-50%);width:min(1192px,calc(100% - 32px));z-index:50;background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);animation:navIn .45s var(--ios)}
@keyframes navIn{from{transform:translate(-50%,-120%)}to{transform:translate(-50%,0)}}
.t2w-nav.stuck .t2w-drop{position:fixed;top:78px;z-index:49}
.t2w-sticky{background:rgba(255,255,255,.86);-webkit-backdrop-filter:saturate(180%) blur(18px);backdrop-filter:saturate(180%) blur(18px);animation:barIn .6s .3s var(--ios) both}
@keyframes barIn{from{transform:translate(-50%,140%)}to{transform:translate(-50%,0)}}
@media (prefers-reduced-motion:reduce){body,.bc,.opt,.bike,.post,.t2w-sticky,.t2w-nav.stuck .bar{animation:none !important}}
html{scroll-padding-top:90px}
/* logo */
.t2w-logo{display:block;height:52px;width:auto}
.t2w-nav .bar{padding-top:6px;padding-bottom:6px}
.t2w-footer .t2w-brand{display:inline-block;background:#fff;border-radius:16px;padding:8px 14px}.t2w-footer .t2w-logo{height:50px}
@media (max-width:520px){.t2w-logo{height:38px}}
/* banner photo on the Bike Rental page */
.hero .bgimg{display:none;position:absolute}
.hero .bgimg.has{display:block;left:auto;right:max(24px,calc((100vw - 1240px)/2 + 24px));top:110px;bottom:70px;width:min(36vw,440px);border-radius:24px;box-shadow:0 30px 60px -30px rgba(36,27,33,.45);z-index:1}
@media (min-width:1000px){.hero:has(.bgimg.has) .wrap>*:not(.t2w-nav){max-width:calc(100% - min(36vw,440px) - 40px)}}
@media (max-width:999px){.hero .bgimg.has{display:none}}
/* banner photos: keep a natural photo shape instead of stretching to the full header height */
.t2w-hero .bgimg.has,.hero .bgimg.has{bottom:auto;top:112px;width:min(34vw,420px);height:auto;aspect-ratio:4/5;max-height:calc(100% - 160px)}
/* bike short description shown as a Note */
.bnote{margin:8px 0 10px;padding:9px 12px;background:var(--tint);border-radius:12px;font-size:13.5px;line-height:1.45;color:var(--ink)}
.bnote b{color:var(--accent)}
span.k.bnote{display:block;margin:6px 0 0}
/* ---- headings on phones (Android & iPhone, incl. larger system text) ---- */
h1,h2,h3,h4,.h2{text-wrap:balance;overflow-wrap:break-word;-webkit-hyphens:manual;hyphens:manual}
p,li{text-wrap:pretty}
@media (max-width:640px){
  body h1{font-size:clamp(28px,8.8vw,36px) !important;line-height:1.12 !important;letter-spacing:-.6px !important}
  body h2.h2,body .h2{font-size:clamp(24px,7.4vw,30px) !important;line-height:1.16 !important;letter-spacing:-.4px}
  body h2:not(.h2){font-size:clamp(21px,6.4vw,26px) !important;line-height:1.2 !important}
  body h3{line-height:1.25}
  body .bike h3,body .bc h3,body .opt h3{font-size:clamp(19px,5.8vw,22px) !important}
  body .card h3,body .in h3{font-size:clamp(20px,6.2vw,24px) !important}
  body .tile h3,body .place h3{font-size:clamp(17px,5vw,19px) !important}
  .eyebrow{font-size:12px !important;letter-spacing:1.1px !important;line-height:1.5}
  /* hero number tiles (2017 · 50+ · Unlimited · 4.9★) */
  .stats b{font-size:clamp(16px,5vw,26px) !important;letter-spacing:-.5px;line-height:1.15}
  .stats div{min-width:0;padding:12px !important}
  /* homepage trust tiles: icon above text so words don't get squeezed */
  .strip div{flex-direction:column;align-items:flex-start !important;gap:8px !important;padding:12px 14px !important;min-width:0}
  .strip b{font-size:14.5px !important;line-height:1.25}
  .strip small{font-size:12.5px;line-height:1.3}
  .strip .ic{width:34px !important;height:34px !important}
}