:root{
  /* ============ CHERRY CABS — RED / GREEN / WHITE ============ */
  --red:#E63946;
  --red-bright:#FF4D4D;
  --red-deep:#C1121F;
  --red-dark:#3E0910;
  --red-tint:#FFF3F3;

  --g-dark:#0A5C33;
  --g-mid:#1FA85C;
  --g-bright:#2FBF5E;
  --grass:#7DC242;
  --g-tint:#F1FAF4;

  --grad-warm:linear-gradient(135deg,#C1121F 0%,#E63946 48%,#FF5A5A 100%);
  --grad-cool:linear-gradient(135deg,#0A5C33 0%,#1FA85C 52%,#7DC242 100%);
  --grad-blue:linear-gradient(135deg,#0A5C33 0%,#1FA85C 100%);
  --grad-sun:linear-gradient(135deg,#C1121F 0%,#E63946 100%);

  /* ---- role aliases used across the stylesheet ---- */
  --navy:#2A1D1F;        /* dark text colour */
  --navy-2:#0A5C33;
  --navy-3:#E63946;
  --cherry:#E63946; --cherry-deep:#C1121F; --cherry-dark:#3E0910;
  --orange:#E63946; --orange-deep:#C1121F;
  --amber:#1FA85C; --yellow-bright:#2FBF5E;
  --green-dark:#0A5C33; --green-mid:#1FA85C; --green-bright:#2FBF5E;
  --teal:#1FA85C; --teal-deep:#0A5C33;
  --navy-deep:#3E0910; --navy-mid:#C1121F; --blue:#E63946; --blue-light:#FF4D4D;
  --yellow:#2FBF5E;
  --yellow-2:#0A5C33;
  --green:#25D366;       /* WhatsApp brand green */

  --ink:#241B1D;
  --muted:#6E6366;
  --line:#EFE4E4;
  --bg:#FFF8F8;
  --white:#fff;
  --radius:14px;
  --shadow:0 10px 30px rgba(62,9,16,.10);
  --shadow-lg:0 24px 60px rgba(62,9,16,.20);
}

*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Poppins',system-ui,-apple-system,sans-serif;
  font-weight:400;color:var(--ink);background:var(--white);
  line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;
}
/* Display headings use Baloo 2 — the rounded, friendly counterpart to
   the logo's hand-drawn lettering. Body copy stays Poppins for clarity. */
/* Display headings use Pacifico — the closest free match to the brush
   script in the Cherry Cabs logo. Card titles stay Poppins for clarity. */
h1,h2{font-family:'Pacifico','Baloo 2',cursive;font-weight:400;line-height:1.28;letter-spacing:.005em}
h3,h4{font-family:'Poppins',sans-serif;font-weight:700;line-height:1.2;letter-spacing:-.02em}
.script{font-family:'Sacramento',cursive;font-weight:400;letter-spacing:0}
a{text-decoration:none;color:inherit}
img,svg{max-width:100%;display:block}
ul{list-style:none}
.wrap{width:min(1240px,92%);margin-inline:auto}

/* ================= TOP BAR ================= */
.topbar{background:var(--navy);color:#F7DED6;font-size:13.5px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.08)}
.topbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:14px}
.tb-left{display:flex;align-items:center;gap:8px;font-weight:500}
.tb-badge{background:var(--yellow);color:var(--navy);font-weight:700;font-size:11.5px;padding:2px 9px;border-radius:20px}
.tb-right{display:flex;align-items:center;gap:22px}
.tb-right a{display:flex;align-items:center;gap:7px;transition:color .2s}
.tb-right a:hover{color:var(--yellow)}
.tb-right svg{width:14px;height:14px;flex:none;stroke:var(--yellow)}
.tb-sep{width:1px;height:14px;background:rgba(255,255,255,.2)}

/* ================= HEADER ================= */
.site-header{
  position:sticky;top:0;z-index:900;background:rgba(255,255,255,.97);
  backdrop-filter:saturate(180%) blur(12px);border-bottom:1px solid var(--line);transition:box-shadow .28s;
}
.site-header.scrolled{box-shadow:0 6px 26px rgba(20,32,80,.12)}
.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:13px 0;transition:padding .28s}
.site-header.scrolled .nav{padding:8px 0}

.logo-image {
  width: 220px;
  height: auto;
  display: block;
}
.logo{display:flex;align-items:center;gap:11px;flex:none}
.logo-mark{
  width:46px;height:46px;border-radius:13px;flex:none;
  background:linear-gradient(140deg,var(--yellow),var(--yellow-2));
  display:grid;place-items:center;box-shadow:0 6px 16px rgba(244,87,31,.38);
}
.logo-text b{display:block;font-size:21px;font-weight:800;color:var(--navy);letter-spacing:-.03em;line-height:1.05}
.logo-text b i{font-style:normal;color:var(--yellow-2)}
.logo-text span{display:block;font-size:9.5px;font-weight:500;color:var(--muted);letter-spacing:.2em;text-transform:uppercase;margin-top:1px}


.menu{display:flex;align-items:center;gap:1px}
.menu > li{position:relative}
.menu > li > a{
  display:flex;align-items:center;gap:5px;font-size:14.5px;font-weight:500;color:var(--navy);
  padding:10px 12px;border-radius:9px;position:relative;transition:color .2s,background .2s;white-space:nowrap;
}
.menu > li > a .chev{width:11px;height:11px;stroke:currentColor;stroke-width:3;fill:none;transition:transform .25s;opacity:.65}
.menu > li > a::after{
  content:"";position:absolute;left:12px;right:12px;bottom:5px;height:2.5px;
  background:var(--yellow-2);border-radius:3px;transform:scaleX(0);transform-origin:left;transition:transform .25s;
}
.menu > li > a:hover{background:#FDF1EE}
.menu > li > a:hover::after,.menu > li > a.active::after{transform:scaleX(1)}
.menu > li > a.active{color:var(--navy-3);font-weight:600}

.dropdown{
  position:absolute;top:calc(100% + 10px);left:50%;transform:translateX(-50%) translateY(10px);
  background:var(--white);border:1px solid var(--line);border-radius:16px;
  box-shadow:0 24px 60px rgba(20,32,80,.20);padding:10px;min-width:280px;
  opacity:0;visibility:hidden;transition:opacity .25s,transform .25s,visibility .25s;
}
.dropdown::before{
  content:"";position:absolute;top:-6px;left:50%;transform:translateX(-50%) rotate(45deg);
  width:12px;height:12px;background:var(--white);border-left:1px solid var(--line);border-top:1px solid var(--line);border-radius:2px;
}
.dropdown::after{content:"";position:absolute;top:-12px;left:0;right:0;height:12px}
.menu > li:hover > .dropdown,.menu > li:focus-within > .dropdown{opacity:1;visibility:visible;transform:translateX(-50%) translateY(0)}
.menu > li:hover > a .chev{transform:rotate(180deg)}
.dropdown.two-col{min-width:530px;display:grid;grid-template-columns:1fr 1fr;gap:2px}
.dropdown a{display:flex;align-items:center;gap:9px;font-size:14px;color:var(--ink);padding:9px 12px;border-radius:10px;transition:background .18s,color .18s,padding-left .18s}
.dropdown a .dot{width:6px;height:6px;border-radius:50%;background:var(--yellow-2);flex:none;transition:transform .18s}
.dropdown a:hover{background:#FDF1EE;color:var(--navy-3);font-weight:500;padding-left:16px}
.dropdown a:hover .dot{transform:scale(1.5)}

.call-btn{
  display:flex;align-items:center;gap:10px;flex:none;margin-left:6px;
  background:linear-gradient(135deg,var(--yellow),var(--yellow-2));color:var(--navy);
  padding:8px 17px 8px 8px;border-radius:40px;box-shadow:0 8px 20px rgba(244,87,31,.42);transition:transform .2s,box-shadow .2s;
}
.call-btn:hover{transform:translateY(-2px);box-shadow:0 12px 26px rgba(244,87,31,.55)}
.call-ring{width:34px;height:34px;border-radius:50%;background:var(--navy);display:grid;place-items:center;flex:none}
.call-ring svg{width:16px;height:16px;stroke:var(--yellow);animation:shake 2.4s infinite}
@keyframes shake{0%,88%,100%{transform:rotate(0)}91%{transform:rotate(-14deg)}94%{transform:rotate(14deg)}97%{transform:rotate(-8deg)}}
.call-txt{line-height:1.15}
.call-txt small{display:block;font-size:9.5px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;opacity:.7}
.call-txt b{display:block;font-size:15px;font-weight:700;letter-spacing:-.01em}

.burger{display:none;width:44px;height:44px;border:1.5px solid var(--line);background:var(--white);border-radius:11px;cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.burger span{width:20px;height:2.2px;background:var(--navy);border-radius:2px;transition:.28s}
.burger.open span:nth-child(1){transform:translateY(7.2px) rotate(45deg)}
.burger.open span:nth-child(2){opacity:0}
.burger.open span:nth-child(3){transform:translateY(-7.2px) rotate(-45deg)}

/* ================= PAGE HEADER (inner pages) ================= */
.page-header{
  background:linear-gradient(120deg,var(--navy) 0%,var(--navy-2) 60%,var(--navy-3) 100%);
  padding:52px 0 40px;position:relative;overflow:hidden;
}
.page-header::before{
  content:"";position:absolute;top:-120px;right:-80px;width:340px;height:340px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,138,61,.18),transparent 68%);
}
.page-header h1{position:relative;color:#fff;font-size:clamp(1.7rem,3.4vw,2.4rem)}
.breadcrumb{position:relative;display:flex;align-items:center;gap:8px;margin-top:12px;font-size:13.5px;color:#EBC9C2}
.breadcrumb a{color:#F7DED6;transition:color .2s}
.breadcrumb a:hover{color:var(--yellow)}
.breadcrumb span{color:var(--yellow)}

/* ================= HERO (home page) ================= */
.hero{
  position:relative;min-height:min(86vh,730px);
  display:flex;align-items:center;overflow:hidden;padding:78px 0 90px;isolation:isolate;
}
.hero-slider{position:absolute;inset:0;z-index:-3;background:var(--navy)}
.slide{
  position:absolute;inset:0;background-size:cover;background-position:center;
  opacity:0;transform:scale(1);transition:opacity 1.1s ease;
}
.slide.active{opacity:1;animation:kenburns 4.6s ease-out forwards}
@keyframes kenburns{from{transform:scale(1)}to{transform:scale(1.1)}}

.hero-brush{position:absolute;inset:0;z-index:-2;pointer-events:none}
.hero-brush svg{width:100%;height:100%}
.hero-scrim{
  position:absolute;inset:0;z-index:-1;pointer-events:none;
  background:
    linear-gradient(96deg,rgba(12,20,52,.55) 0%,rgba(12,20,52,.30) 30%,rgba(12,20,52,0) 55%),
    linear-gradient(180deg,rgba(12,20,52,.42) 0%,rgba(12,20,52,0) 30%,rgba(12,20,52,.50) 100%);
}

.hero-content{max-width:620px;animation:rise .9s cubic-bezier(.2,.7,.3,1) both}
@keyframes rise{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:none}}

.hero-eyebrow{
  display:inline-flex;align-items:center;gap:7px;background:rgba(255,138,61,.95);color:var(--navy);
  padding:5px 14px;border-radius:40px;font-size:11.5px;font-weight:600;letter-spacing:.05em;
  text-transform:uppercase;margin-bottom:16px;box-shadow:0 6px 18px rgba(0,0,0,.3);
}
.hero h1{
  font-size:clamp(1.6rem,3.5vw,2.85rem);font-weight:800;color:#fff;white-space:nowrap;
  text-shadow:0 4px 26px rgba(10,17,45,.65);
}
.hero h1 span{color:var(--yellow)}
.hero h2{
  font-size:clamp(1rem,1.6vw,1.3rem);font-weight:600;color:#FFD9B8;margin-top:10px;
  letter-spacing:-.01em;text-shadow:0 2px 16px rgba(10,17,45,.6);
}
.hero p.lede{
  font-size:15px;font-weight:300;color:#F8E6DF;margin-top:12px;max-width:46ch;line-height:1.8;
  text-shadow:0 2px 14px rgba(10,17,45,.55);
}

.hero-btns{display:flex;flex-wrap:wrap;gap:11px;margin-top:24px}
.btn{display:inline-flex;align-items:center;gap:9px;padding:11px 22px;border-radius:44px;font-size:14px;font-weight:600;letter-spacing:-.01em;transition:transform .2s,box-shadow .2s}
.btn svg{width:17px;height:17px;flex:none}
.btn:hover{transform:translateY(-2px)}
.btn-call{background:var(--white);color:var(--navy);box-shadow:0 10px 26px rgba(0,0,0,.3)}
.btn-call:hover{box-shadow:0 15px 34px rgba(0,0,0,.4)}
.btn-call svg{stroke:var(--navy);fill:none;stroke-width:2.2;animation:shake 2.4s infinite}
.btn-wa{background:var(--green);color:#04371A;box-shadow:0 10px 26px rgba(37,211,102,.4)}
.btn-wa:hover{box-shadow:0 15px 34px rgba(37,211,102,.55)}
.btn-wa svg{fill:#04371A}

.hero-stats{display:flex;flex-wrap:wrap;gap:14px 34px;margin-top:30px;padding-top:22px;border-top:1px solid rgba(255,255,255,.2)}
.hero-stats li{line-height:1.1}
.hero-stats b{
  display:block;font-size:clamp(28px,3.2vw,40px);font-weight:800;color:var(--yellow);
  font-variant-numeric:tabular-nums;letter-spacing:-.03em;text-shadow:0 3px 18px rgba(10,17,45,.5);
}
.hero-stats small{display:block;font-size:11.5px;font-weight:300;color:#F2D8D0;letter-spacing:.01em;margin-top:4px}

.slider-dots{position:absolute;left:0;right:0;bottom:26px;z-index:3;display:flex;justify-content:center;gap:9px}
.slider-dots button{width:26px;height:4px;border:none;border-radius:4px;cursor:pointer;padding:0;background:rgba(255,255,255,.35);transition:background .3s,width .3s}
.slider-dots button.on{background:var(--yellow);width:44px}

/* ================= ABOUT SECTION ================= */
.about{position:relative;padding:88px 0 96px;overflow:hidden;background:#fff}

/* background decoration icons */
.about-deco{position:absolute;pointer-events:none;opacity:.07;z-index:0}
.about-deco-1{width:340px;height:340px;top:-40px;right:-60px;animation:aboutSpin 46s linear infinite}
.about-deco-2{width:220px;height:220px;bottom:-30px;left:-40px;animation:aboutSpin 60s linear infinite reverse}
@keyframes aboutSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

.about-grid{position:relative;z-index:1;display:grid;grid-template-columns:.92fr 1fr;gap:64px;align-items:center}

/* ---- media column ---- */
.about-media{position:relative;min-height:460px}
.about-img-main{
  position:relative;width:86%;aspect-ratio:9/10;border-radius:26px;overflow:hidden;
  box-shadow:0 30px 60px rgba(20,32,80,.22);transition:transform .5s cubic-bezier(.2,.8,.3,1);
}
.about-img-main img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.about-img-main:hover img{transform:scale(1.06)}
.about-img-tint{
  position:absolute;inset:0;
  background:linear-gradient(200deg,rgba(20,32,80,.06) 0%,rgba(20,32,80,.32) 100%);
  mix-blend-mode:multiply;pointer-events:none;
}

.about-badge{
  position:absolute;top:9%;left:-4%;z-index:3;
  display:flex;align-items:center;gap:12px;
  background:#fff;border-radius:16px;padding:14px 20px 14px 14px;
  box-shadow:0 20px 42px rgba(20,32,80,.20);
  animation:badgeFloat 4.5s ease-in-out infinite;
}
@keyframes badgeFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-9px)}}
.badge-ic{
  width:42px;height:42px;flex:none;border-radius:12px;
  background:linear-gradient(140deg,var(--navy-3),var(--navy));
  display:grid;place-items:center;position:relative;
}
.badge-ic svg{width:20px;height:20px}
.badge-ic::after{
  content:"";position:absolute;inset:0;border-radius:12px;border:2px solid var(--navy-3);
  animation:pulse 2.4s infinite;
}
.badge-txt{line-height:1.3}
.badge-txt > span{font-size:15px;font-weight:700;color:var(--navy);white-space:nowrap}
.badge-txt > span small{font-size:12.5px;font-weight:500;color:var(--muted);margin-left:2px}
.badge-txt .badge-sub{display:block;font-size:11.5px;font-weight:400;color:var(--muted)}

.about-img-sub{
  position:absolute;right:-2%;bottom:-7%;z-index:2;
  width:44%;aspect-ratio:1;border-radius:20px;overflow:hidden;
  border:6px solid #fff;box-shadow:0 24px 48px rgba(20,32,80,.24);
  transition:transform .5s cubic-bezier(.2,.8,.3,1);
}
.about-img-sub img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}
.about-img-sub:hover{transform:translateY(-6px)}
.about-img-sub:hover img{transform:scale(1.08)}

/* ---- copy column ---- */
.eyebrow-line{
  display:inline-flex;align-items:center;gap:10px;
  font-size:12.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--navy-3);
  margin-bottom:14px;
}
.eyebrow-line::before{content:"";width:26px;height:2.5px;border-radius:3px;background:var(--yellow-2)}

.about-copy h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.about-copy h2 span{color:var(--yellow-2)}
.about-copy p{font-size:15px;font-weight:300;color:var(--muted);margin-top:16px;max-width:56ch}

.about-stats{display:flex;flex-wrap:wrap;gap:14px 34px;margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}
.about-stats li{line-height:1.15}
.about-stats b{display:block;font-size:28px;font-weight:800;color:var(--navy-3);font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.about-stats small{display:block;font-size:12px;font-weight:400;color:var(--muted);margin-top:3px}

/* ---- scroll reveal (generic) ---- */
[data-reveal]{opacity:0;transform:translateY(34px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.3,1)}
[data-reveal].in-view{opacity:1;transform:none}
[data-reveal][data-delay="1"]{transition-delay:.1s}
[data-reveal][data-delay="2"]{transition-delay:.35s}
[data-reveal][data-delay="3"]{transition-delay:.55s}

@media (max-width:980px){
  .about-grid{grid-template-columns:1fr;gap:70px}
  .about-media{min-height:400px;max-width:420px;margin-inline:auto}
}
@media (max-width:620px){
  .about{padding:60px 0 68px}
  .about-media{min-height:320px}
  .about-badge{padding:11px 16px 11px 11px;gap:9px;left:0}
  .badge-ic{width:36px;height:36px}
  .badge-txt > span{font-size:13.5px}
  .about-stats{gap:14px 24px}
  .about-stats b{font-size:23px}
  .about-deco-1{width:220px;height:220px}
  .about-deco-2{width:150px;height:150px}
}
@media (prefers-reduced-motion:reduce){
  [data-reveal]{opacity:1;transform:none}
}

/* ================= TRUST BAR ================= */
.trustbar{
  position:relative;overflow:hidden;padding:74px 0 78px;
  background:linear-gradient(118deg,#2A0710 0%,var(--navy) 32%,var(--navy-2) 68%,var(--navy-3) 100%);
}

/* slow-drifting yellow glow */
.tb-glow{
  position:absolute;top:-180px;left:8%;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,138,61,.20) 0%,rgba(255,138,61,0) 68%);
  animation:tbDrift 16s ease-in-out infinite alternate;pointer-events:none;
}
@keyframes tbDrift{from{transform:translate(0,0)}to{transform:translate(180px,90px)}}

/* dashed road lines running across the band */
.tb-stripes{
  position:absolute;left:0;right:0;bottom:0;height:100%;pointer-events:none;opacity:.16;
  background-image:repeating-linear-gradient(90deg,#FF8A3D 0 42px,transparent 42px 96px);
  background-size:96px 3px;background-repeat:repeat-x;background-position:0 92%;
  animation:tbRoad 2.6s linear infinite;
}
@keyframes tbRoad{from{background-position-x:0}to{background-position-x:-96px}}

.tb-head{position:relative;text-align:center;margin-bottom:44px}
.tb-eyebrow{
  display:inline-block;background:rgba(255,138,61,.14);border:1px solid rgba(255,138,61,.35);
  color:var(--yellow);font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  padding:5px 15px;border-radius:30px;margin-bottom:14px;
}
.tb-head h2{font-size:clamp(1.5rem,2.7vw,2.15rem);color:#fff}

.tb-grid{
  position:relative;display:grid;grid-template-columns:repeat(6,1fr);gap:18px;
}

.tb-item{
  position:relative;text-align:center;padding:26px 16px 24px;border-radius:18px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.10);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:transform .35s cubic-bezier(.2,.8,.3,1),background .35s,border-color .35s,box-shadow .35s;
}
.tb-item::before{
  content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,138,61,.16),transparent 58%);
  opacity:0;transition:opacity .35s;
}
.tb-item:hover{
  transform:translateY(-8px);
  background:rgba(255,255,255,.10);
  border-color:rgba(255,138,61,.45);
  box-shadow:0 22px 44px rgba(10,17,45,.45);
}
.tb-item:hover::before{opacity:1}

/* icon with rotating dashed ring + tick badge */
.tb-ic{
  position:relative;width:62px;height:62px;margin:0 auto 16px;
  display:grid;place-items:center;border-radius:50%;
  background:linear-gradient(140deg,rgba(255,138,61,.22),rgba(200,35,44,.28));
  border:1px solid rgba(255,255,255,.16);
}
.tb-ic > svg{width:27px;height:27px;stroke:var(--yellow);stroke-width:1.8;transition:transform .4s cubic-bezier(.2,.8,.3,1)}
.tb-item:hover .tb-ic > svg{transform:scale(1.14)}
.tb-ic::after{
  content:"";position:absolute;inset:-6px;border-radius:50%;
  border:1.5px dashed rgba(255,138,61,.42);
  animation:tbSpin 14s linear infinite;
}
.tb-item:hover .tb-ic::after{animation-duration:4s;border-color:rgba(255,138,61,.8)}
@keyframes tbSpin{from{transform:rotate(0)}to{transform:rotate(360deg)}}

.tb-tick{
  position:absolute;right:-3px;bottom:-1px;width:23px;height:23px;border-radius:50%;
  background:#6FBF44;display:grid;place-items:center;
  border:2.5px solid #3B0A12;
  transform:scale(0);animation:tbPop .45s cubic-bezier(.3,1.5,.5,1) forwards;
}
.tb-item.in-view .tb-tick{animation-delay:.45s}
@keyframes tbPop{to{transform:scale(1)}}
.tb-tick svg{width:11px;height:11px;stroke:#fff;stroke-width:3.6}

.tb-item h3{font-size:15px;font-weight:700;color:#fff;margin-bottom:7px;letter-spacing:-.01em}
.tb-item p{font-size:12.5px;font-weight:300;color:#E7C3BA;line-height:1.65}

/* extra stagger delays for the 6 items */
[data-reveal][data-delay="4"]{transition-delay:.7s}
[data-reveal][data-delay="5"]{transition-delay:.85s}
[data-reveal][data-delay="6"]{transition-delay:1s}

@media (max-width:1080px){
  .tb-grid{grid-template-columns:repeat(3,1fr);gap:16px}
}
@media (max-width:700px){
  .trustbar{padding:54px 0 58px}
  .tb-head{margin-bottom:32px}
  .tb-grid{grid-template-columns:repeat(2,1fr);gap:12px}
  .tb-item{padding:20px 12px 18px;border-radius:15px}
  .tb-ic{width:52px;height:52px;margin-bottom:12px}
  .tb-ic > svg{width:23px;height:23px}
  .tb-item h3{font-size:13.5px}
  .tb-item p{font-size:11.5px}
  .tb-glow{width:340px;height:340px}
}
@media (prefers-reduced-motion:reduce){
  .tb-tick{transform:scale(1);animation:none}
}

/* ================= MAIN SERVICES ================= */
.services{position:relative;padding:88px 0 92px;background:#fff;overflow:hidden}
.svc-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(760px 420px at 92% -6%,rgba(255,138,61,.14),transparent 62%),
    radial-gradient(680px 420px at -6% 104%,rgba(200,35,44,.10),transparent 60%);
}
.svc-head{position:relative;max-width:640px;margin-bottom:44px}
.svc-head h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.svc-head h2 span{color:var(--yellow-2)}
.svc-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:12px}

.svc-grid{
  position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:28px;
}

.svc-card{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;
  box-shadow:0 8px 26px rgba(20,32,80,.06);
  transition:transform .38s cubic-bezier(.2,.8,.3,1),box-shadow .38s,border-color .38s;
}
.svc-card:hover{transform:translateY(-9px);box-shadow:0 28px 56px rgba(20,32,80,.16);border-color:rgba(255,138,61,.6)}

/* invisible link covering the whole card */
.svc-stretch{position:absolute;inset:0;z-index:1}

/* ---- image ---- */
.svc-media{position:relative;aspect-ratio:16/11;overflow:hidden;background:#FAEEEB}
.svc-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.8,.3,1)}
.svc-card:hover .svc-media img{transform:scale(1.08)}
.svc-media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(20,32,80,0) 42%,rgba(20,32,80,.42) 100%);
}
.svc-emoji{
  position:absolute;left:20px;bottom:-24px;z-index:2;
  width:54px;height:54px;border-radius:16px;display:grid;place-items:center;
  font-size:25px;line-height:1;
  background:linear-gradient(140deg,var(--yellow),var(--yellow-2));
  box-shadow:0 10px 24px rgba(244,87,31,.42);
  transition:transform .38s cubic-bezier(.3,1.4,.5,1);
}
.svc-card:hover .svc-emoji{transform:translateY(-5px) rotate(-7deg)}

/* ---- body ---- */
.svc-body{padding:40px 24px 24px;display:flex;flex-direction:column;flex:1}
.svc-body h3{font-size:19px;color:var(--navy);letter-spacing:-.02em;transition:color .25s}
.svc-card:hover .svc-body h3{color:var(--navy-3)}
.svc-body p{font-size:13.8px;font-weight:300;color:var(--muted);margin-top:9px;line-height:1.72}

.svc-points{margin-top:16px;display:grid;gap:7px}
.svc-points li{display:flex;align-items:center;gap:8px;font-size:12.8px;font-weight:400;color:var(--ink)}
.svc-points svg{width:15px;height:15px;flex:none;stroke:#6FBF44;stroke-width:3;
  background:#EDF7E2;border-radius:50%;padding:2.5px;box-sizing:content-box;padding:3px}

.svc-more{
  display:inline-flex;align-items:center;gap:7px;margin-top:16px;
  font-size:12.5px;font-weight:600;color:var(--navy-3);letter-spacing:.01em;
}
.svc-more svg{width:14px;height:14px;stroke:currentColor;stroke-width:2.4;transition:transform .28s}
.svc-card:hover .svc-more svg{transform:translateX(5px)}

/* ---- action buttons (above the stretched link) ---- */
.svc-actions{
  position:relative;z-index:2;display:flex;gap:9px;align-items:stretch;
  margin-top:auto;padding-top:18px;
}
.svc-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  font-family:inherit;font-size:13.5px;font-weight:600;letter-spacing:-.01em;
  border:none;border-radius:10px;cursor:pointer;padding:12px 16px;
  transition:transform .2s,box-shadow .2s,filter .2s;
}
.svc-btn:hover{transform:translateY(-2px)}
.svc-btn svg{width:16px;height:16px;flex:none}

.svc-btn-enq{
  flex:1;background:linear-gradient(135deg,#FF7A45 0%,#F1592A 100%);color:#fff;
  box-shadow:0 8px 20px rgba(241,89,42,.34);
}
.svc-btn-enq:hover{box-shadow:0 14px 28px rgba(241,89,42,.46)}
.svc-btn-enq svg{stroke:#fff;stroke-width:2.2;fill:none}

.svc-btn-wa{
  flex:none;width:48px;padding:12px;background:var(--green);
  box-shadow:0 8px 20px rgba(37,211,102,.36);
}
.svc-btn-wa:hover{box-shadow:0 14px 28px rgba(37,211,102,.5)}
.svc-btn-wa svg{width:20px;height:20px;fill:#fff}

@media (max-width:1080px){
  .svc-grid{grid-template-columns:repeat(2,1fr);gap:24px}
}
@media (max-width:700px){
  .services{padding:58px 0 62px}
  .svc-head{margin-bottom:30px}
  .svc-grid{grid-template-columns:1fr;gap:20px}
  .svc-card{border-radius:18px}
  .svc-body{padding:38px 20px 20px}
  .svc-body h3{font-size:17.5px}
  .svc-emoji{width:48px;height:48px;font-size:22px;left:16px;bottom:-22px}
}

/* ================= WHY CHOOSE US ================= */
.why{position:relative;padding:86px 0 90px;background:#FDF7F5;overflow:hidden}

/* large faint background icons */
.why-deco{position:absolute;pointer-events:none;opacity:.055;z-index:0}
.why-deco-1{width:300px;height:300px;top:34px;left:-70px;animation:whyFloat 13s ease-in-out infinite}
.why-deco-2{width:380px;height:380px;bottom:-90px;right:-90px;animation:aboutSpin 70s linear infinite}
.why-deco-3{width:200px;height:200px;top:44%;right:16%;animation:whyFloat 17s ease-in-out infinite reverse}
@keyframes whyFloat{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-26px) rotate(8deg)}}

.why-head{position:relative;z-index:1;max-width:660px;margin-bottom:42px}
.why-head h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.why-head h2 span{color:var(--yellow-2)}
.why-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:12px}

.why-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}

.why-card{
  position:relative;overflow:hidden;
  background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:26px 22px 24px;
  box-shadow:0 6px 20px rgba(20,32,80,.05);
  transition:transform .36s cubic-bezier(.2,.8,.3,1),box-shadow .36s,border-color .36s;
}
/* yellow sweep that grows from the bottom on hover */
.why-card::before{
  content:"";position:absolute;left:0;right:0;bottom:0;height:3px;
  background:linear-gradient(90deg,var(--yellow),var(--yellow-2));
  transform:scaleX(0);transform-origin:left;transition:transform .4s cubic-bezier(.2,.8,.3,1);
}
.why-card:hover{
  transform:translateY(-8px);
  box-shadow:0 26px 50px rgba(20,32,80,.14);
  border-color:rgba(255,138,61,.55);
}
.why-card:hover::before{transform:scaleX(1)}

.why-num{
  position:absolute;top:16px;right:18px;
  font-size:34px;font-weight:800;line-height:1;letter-spacing:-.04em;
  color:var(--navy);opacity:.07;transition:opacity .36s,color .36s;
}
.why-card:hover .why-num{opacity:.16;color:var(--yellow-2)}

.why-ic{
  position:relative;display:grid;place-items:center;
  width:52px;height:52px;border-radius:15px;margin-bottom:16px;
  background:linear-gradient(140deg,#FFEDE0,#FFD2A8);
  transition:background .36s,transform .36s cubic-bezier(.3,1.4,.5,1);
}
.why-ic svg{width:24px;height:24px;stroke:var(--navy);stroke-width:1.9;transition:stroke .36s}
.why-card:hover .why-ic{
  background:linear-gradient(140deg,var(--navy-3),var(--navy));
  transform:translateY(-3px) rotate(-6deg);
}
.why-card:hover .why-ic svg{stroke:var(--yellow)}

.why-card h3{font-size:15.5px;color:var(--navy);letter-spacing:-.01em;line-height:1.35}
.why-card p{font-size:13px;font-weight:300;color:var(--muted);margin-top:9px;line-height:1.72}

/* bottom CTA strip */
.why-cta{
  position:relative;z-index:1;margin-top:38px;
  display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:18px;
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 26px;
  box-shadow:0 8px 24px rgba(20,32,80,.06);
}
.why-cta > p{font-size:15px;font-weight:500;color:var(--navy);max-width:44ch}
.why-cta-btns{display:flex;flex-wrap:wrap;gap:11px}

@media (max-width:1080px){
  .why-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:700px){
  .why{padding:56px 0 60px}
  .why-head{margin-bottom:28px}
  .why-grid{grid-template-columns:1fr;gap:14px}
  .why-card{padding:22px 18px 20px;border-radius:15px}
  .why-num{font-size:28px;top:14px;right:15px}
  .why-ic{width:46px;height:46px;margin-bottom:13px}
  .why-ic svg{width:21px;height:21px}
  .why-cta{padding:20px;text-align:center;justify-content:center}
  .why-cta > p{font-size:14px}
  .why-cta-btns{width:100%}
  .why-cta-btns .btn{flex:1 1 auto;justify-content:center}
  .why-deco-1{width:200px;height:200px}
  .why-deco-2{width:250px;height:250px}
  .why-deco-3{display:none}
}

/* ================= FLEET / CARS ================= */
.fleet-sec{position:relative;padding:86px 0 90px;background:#fff;overflow:hidden}
.fleet-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(720px 400px at 6% 0%,rgba(255,138,61,.13),transparent 60%),
    radial-gradient(700px 420px at 96% 100%,rgba(200,35,44,.09),transparent 62%);
}
.fleet-head{position:relative;z-index:1;max-width:660px;margin-bottom:42px}
.fleet-head h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.fleet-head h2 span{color:var(--yellow-2)}
.fleet-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:12px}

.fleet-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:22px}

.fleet-card{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--line);border-radius:20px;overflow:hidden;
  box-shadow:0 6px 22px rgba(20,32,80,.06);
  transition:transform .36s cubic-bezier(.2,.8,.3,1),box-shadow .36s,border-color .36s;
}
.fleet-card:hover{transform:translateY(-8px);box-shadow:0 26px 52px rgba(20,32,80,.15);border-color:rgba(255,138,61,.6)}

.fleet-tag{
  position:absolute;top:14px;left:14px;z-index:2;
  background:linear-gradient(135deg,var(--yellow),var(--yellow-2));color:var(--navy);
  font-size:10.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;
  padding:4px 11px;border-radius:20px;box-shadow:0 6px 14px rgba(244,87,31,.36);
}

/* ---- car image / illustration ---- */
.fleet-media{
  position:relative;padding:26px 18px 14px;
  background:linear-gradient(170deg,#FFFCFB 0%,#FBEFEA 100%);
  display:grid;place-items:center;min-height:300px;
}
.fleet-media img,.fleet-illus{
  width:100%;height:auto;max-height:300px;object-fit:contain;
  transition:transform .5s cubic-bezier(.2,.8,.3,1);
}
.fleet-card:hover .fleet-media img,
.fleet-card:hover .fleet-illus{transform:translateX(7px) scale(1.05)}

/* ---- body ---- */
.fleet-body{padding:18px 20px 20px;display:flex;flex-direction:column;flex:1}
.fleet-body h3{font-size:19px;color:var(--navy);letter-spacing:-.025em;transition:color .25s}
.fleet-card:hover .fleet-body h3{color:var(--navy-3)}

.fleet-specs{
  display:flex;align-items:center;justify-content:space-between;gap:6px;
  margin-top:12px;padding-bottom:13px;border-bottom:1px solid var(--line);
}
.fleet-specs li{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:400;color:var(--muted)}
.fleet-specs svg{width:15px;height:15px;flex:none;stroke:var(--navy-3);stroke-width:1.9}

.fleet-price{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-top:14px}
.fp-amount{font-size:14px;font-weight:700;color:var(--navy);letter-spacing:-.02em}
.fp-amount b{font-size:26px;font-weight:800;letter-spacing:-.04em}
.fp-amount small{font-size:13px;font-weight:400;color:var(--muted);margin-left:2px}
.fp-note{font-size:11px;font-weight:400;color:var(--muted);white-space:nowrap}

/* ---- buttons ---- */
.fleet-actions{display:flex;gap:7px;align-items:stretch;margin-top:auto;padding-top:16px}
.fleet-btn{
  display:inline-flex;align-items:center;justify-content:center;
  font-family:inherit;font-size:12.5px;font-weight:600;letter-spacing:-.01em;
  border:none;border-radius:9px;cursor:pointer;padding:11px 8px;
  transition:transform .2s,box-shadow .2s,filter .2s;white-space:nowrap;
}
.fleet-btn:hover{transform:translateY(-2px)}
.fb-call{flex:1;background:var(--navy);color:#fff;box-shadow:0 6px 16px rgba(20,32,80,.28)}
.fb-call:hover{box-shadow:0 12px 24px rgba(20,32,80,.38)}
.fb-enq{flex:1;background:linear-gradient(135deg,#FF7A45,#F1592A);color:#fff;box-shadow:0 6px 16px rgba(241,89,42,.32)}
.fb-enq:hover{box-shadow:0 12px 24px rgba(241,89,42,.45)}
.fb-wa{flex:none;width:42px;padding:11px;background:var(--green);box-shadow:0 6px 16px rgba(37,211,102,.34)}
.fb-wa:hover{box-shadow:0 12px 24px rgba(37,211,102,.48)}
.fb-wa svg{width:18px;height:18px;fill:#fff}

.fleet-foot{
  position:relative;z-index:1;text-align:center;margin-top:32px;
  font-size:13.5px;font-weight:300;color:var(--muted);
}
.fleet-foot a{color:var(--navy-3);font-weight:500;border-bottom:1.5px solid rgba(200,35,44,.3);transition:color .18s,border-color .18s}
.fleet-foot a:hover{color:var(--yellow-2);border-color:var(--yellow-2)}

@media (max-width:1180px){
  .fleet-grid{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:900px){
  .fleet-grid{grid-template-columns:repeat(2,1fr);gap:18px}
}
@media (max-width:560px){
  .fleet-sec{padding:56px 0 60px}
  .fleet-head{margin-bottom:28px}
  .fleet-grid{grid-template-columns:1fr;gap:16px}
  .fleet-card{border-radius:16px}
  .fleet-media{min-height:130px;padding:22px 16px 10px}
  .fleet-body{padding:16px 17px 18px}
  .fleet-body h3{font-size:18px}
  .fleet-specs li{font-size:11.5px}
  .fp-amount b{font-size:24px}
}

/* ================= UDAIPUR SIGHTSEEING ================= */
.sight{position:relative;padding:86px 0 0;background:#fff;overflow:hidden}
.sight-head{max-width:700px;margin-bottom:38px}
.sight-head h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.sight-head h2 span{color:var(--yellow-2)}
.sight-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:12px}

/* ---- marquee rows ---- */
.ss-marquee{
  position:relative;overflow:hidden;margin-bottom:18px;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);
}
.ss-track{display:flex;width:max-content;will-change:transform}
/* margin-right (not gap) keeps the 50% loop point exact = seamless */
.ss-track > .ss-card{margin-right:18px}

.ss-track-rtl{animation:ssScroll 68s linear infinite reverse}  /* left → right */
.ss-track-ltr{animation:ssScroll 68s linear infinite}          /* right → left */
@keyframes ssScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}

/* pause while reading */
.ss-marquee:hover .ss-track{animation-play-state:paused}

/* ---- portrait place card ---- */
.ss-card{
  position:relative;flex:none;width:230px;aspect-ratio:3/4;
  border-radius:18px;overflow:hidden;background:#FAEEEB;
  box-shadow:0 8px 24px rgba(20,32,80,.10);
  transition:transform .38s cubic-bezier(.2,.8,.3,1),box-shadow .38s;
}
.ss-card img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease,filter .38s}
.ss-card::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(180deg,rgba(20,32,80,0) 48%,rgba(12,20,52,.86) 100%);
  transition:opacity .35s;
}
.ss-name{
  position:absolute;left:0;right:0;bottom:0;z-index:2;
  padding:16px 15px;color:#fff;font-size:15px;font-weight:600;letter-spacing:-.01em;
  text-shadow:0 2px 10px rgba(10,17,45,.6);transition:opacity .3s,transform .35s;
}
.ss-name::before{
  content:"";display:block;width:22px;height:2.5px;border-radius:3px;
  background:var(--yellow);margin-bottom:8px;
}

/* hover detail panel */
.ss-hover{
  position:absolute;inset:0;z-index:3;
  display:flex;flex-direction:column;justify-content:flex-end;
  padding:20px 18px;
  background:linear-gradient(180deg,rgba(20,32,80,.55) 0%,rgba(12,20,52,.94) 62%);
  opacity:0;transform:translateY(14px);
  transition:opacity .35s ease,transform .4s cubic-bezier(.2,.8,.3,1);
}
.ss-hover h4{font-size:16px;color:#fff;letter-spacing:-.01em;margin-bottom:8px}
.ss-hover h4::after{
  content:"";display:block;width:26px;height:2.5px;border-radius:3px;
  background:var(--yellow);margin-top:8px;
}
.ss-hover p{font-size:12.3px;font-weight:300;color:#F2D8D0;line-height:1.65}

.ss-card:hover{transform:translateY(-7px);box-shadow:0 26px 48px rgba(20,32,80,.24)}
.ss-card:hover img{transform:scale(1.09)}
.ss-card:hover .ss-hover{opacity:1;transform:none}
.ss-card:hover .ss-name{opacity:0;transform:translateY(10px)}
.ss-card:hover::after{opacity:0}

/* ---- slim packages band ---- */
.ss-band{
  position:relative;overflow:hidden;margin-top:36px;padding:52px 0 56px;
  background:linear-gradient(115deg,#2A0710 0%,var(--navy) 34%,var(--navy-2) 70%,var(--navy-3) 100%);
}
.ss-band-glow{
  position:absolute;top:-160px;right:6%;width:460px;height:460px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,138,61,.20),transparent 68%);
  animation:tbDrift 18s ease-in-out infinite alternate;pointer-events:none;
}
.ss-band-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}

.ssp-card{
  position:relative;display:flex;flex-direction:column;overflow:hidden;
  padding:26px 22px 22px;border-radius:18px;
  background:rgba(255,255,255,.065);
  border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:transform .36s cubic-bezier(.2,.8,.3,1),background .36s,border-color .36s,box-shadow .36s;
}
.ssp-card::before{
  content:"";position:absolute;inset:0;border-radius:18px;pointer-events:none;
  background:linear-gradient(160deg,rgba(255,138,61,.15),transparent 60%);
  opacity:0;transition:opacity .36s;
}
.ssp-card:hover{
  transform:translateY(-8px);background:rgba(255,255,255,.11);
  border-color:rgba(255,138,61,.5);box-shadow:0 24px 46px rgba(10,17,45,.45);
}
.ssp-card:hover::before{opacity:1}

.ssp-stretch{position:absolute;inset:0;z-index:1}

.ssp-num{
  position:absolute;top:16px;right:18px;font-size:32px;font-weight:800;line-height:1;
  color:#fff;opacity:.10;letter-spacing:-.04em;transition:opacity .36s,color .36s;
}
.ssp-card:hover .ssp-num{opacity:.3;color:var(--yellow)}

.ssp-meta{
  display:inline-block;font-size:11px;font-weight:600;letter-spacing:.07em;text-transform:uppercase;
  color:var(--yellow);background:rgba(255,138,61,.14);border:1px solid rgba(255,138,61,.3);
  padding:4px 11px;border-radius:20px;margin-bottom:12px;align-self:flex-start;
}
.ssp-card h3{font-size:17px;color:#fff;letter-spacing:-.02em;line-height:1.3}
.ssp-card p{font-size:12.8px;font-weight:300;color:#E7C3BA;margin-top:9px;line-height:1.7}

.ssp-actions{position:relative;z-index:2;display:flex;gap:8px;margin-top:auto;padding-top:18px}
.ssp-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  font-family:inherit;font-size:12.5px;font-weight:600;letter-spacing:-.01em;
  border-radius:9px;padding:10px 12px;flex:1;white-space:nowrap;
  transition:transform .2s,box-shadow .2s,background .2s,color .2s;
}
.ssp-btn:hover{transform:translateY(-2px)}
.ssp-btn svg{width:15px;height:15px;flex:none}
.ssp-wa{background:var(--green);color:#04371A;box-shadow:0 6px 16px rgba(37,211,102,.34)}
.ssp-wa:hover{box-shadow:0 12px 24px rgba(37,211,102,.48)}
.ssp-wa svg{fill:#04371A}
.ssp-view{background:rgba(255,255,255,.10);color:#fff;border:1px solid rgba(255,255,255,.22)}
.ssp-view:hover{background:var(--yellow);color:var(--navy);border-color:var(--yellow)}
.ssp-view svg{stroke:currentColor;stroke-width:2.4;transition:transform .25s}
.ssp-view:hover svg{transform:translateX(4px)}

/* ---- bottom CTA ---- */
.ss-cta{position:relative;z-index:1;text-align:center;margin-top:34px}
.ss-cta-link{
  display:inline-flex;align-items:center;gap:10px;
  background:linear-gradient(135deg,var(--yellow),var(--yellow-2));color:var(--navy);
  font-size:15px;font-weight:700;letter-spacing:-.01em;
  padding:14px 30px;border-radius:44px;
  box-shadow:0 12px 30px rgba(244,87,31,.42);
  transition:transform .2s,box-shadow .2s;
}
.ss-cta-link:hover{transform:translateY(-3px);box-shadow:0 18px 40px rgba(244,87,31,.58)}
.ss-cta-link svg{width:17px;height:17px;stroke:var(--navy);stroke-width:2.4;transition:transform .25s}
.ss-cta-link:hover svg{transform:translateX(5px)}

@media (max-width:1080px){
  .ss-band-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:620px){
  .sight{padding:56px 0 0}
  .sight-head{margin-bottom:26px}
  .ss-card{width:168px;border-radius:15px}
  .ss-track > .ss-card{margin-right:13px}
  .ss-name{font-size:13.5px;padding:13px 12px}
  .ss-hover{padding:15px 13px}
  .ss-hover h4{font-size:14px}
  .ss-hover p{font-size:11.3px;line-height:1.55}
  .ss-band{padding:42px 0 46px;margin-top:26px}
  .ss-band-grid{grid-template-columns:1fr;gap:14px}
  .ssp-card{padding:22px 18px 18px;border-radius:15px}
  .ss-cta-link{font-size:14px;padding:13px 24px}
}
@media (prefers-reduced-motion:reduce){
  .ss-track{animation:none!important}
}


/* ================= POPULAR OUTSTATION ROUTES ================= */
.routes{position:relative;padding:86px 0 90px;background:#FDF7F5;overflow:hidden}
.routes-bg{
  position:absolute;inset:0;pointer-events:none;
  background:
    radial-gradient(700px 400px at 4% 0%,rgba(255,138,61,.14),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(200,35,44,.10),transparent 62%);
}
.routes-head{position:relative;z-index:1;max-width:670px;margin-bottom:40px}
.routes-head h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.routes-head h2 span{color:var(--yellow-2)}
.routes-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:12px}

.routes-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(5,1fr);gap:18px}

.route-card{
  position:relative;display:flex;flex-direction:column;
  background:#fff;border:1px solid var(--line);border-radius:17px;
  padding:20px 18px 16px;
  box-shadow:0 6px 20px rgba(20,32,80,.05);
  transition:transform .34s cubic-bezier(.2,.8,.3,1),box-shadow .34s,border-color .34s;
}
.route-card:hover{transform:translateY(-7px);box-shadow:0 24px 46px rgba(20,32,80,.14);border-color:rgba(255,138,61,.6)}
.route-stretch{position:absolute;inset:0;z-index:1}

/* small origin → destination path graphic */
.route-path{display:flex;align-items:center;gap:6px;margin-bottom:14px}
.rp-dot{flex:none;display:grid;place-items:center}
.rp-from{width:9px;height:9px;border-radius:50%;background:var(--navy-3);box-shadow:0 0 0 3.5px rgba(200,35,44,.16)}
.rp-line{
  flex:1;height:2px;border-radius:2px;
  background:repeating-linear-gradient(90deg,var(--line) 0 5px,transparent 5px 10px);
  position:relative;overflow:hidden;
}
.rp-line::after{
  content:"";position:absolute;top:0;left:-40%;width:40%;height:100%;
  background:linear-gradient(90deg,transparent,var(--yellow),transparent);
  transition:left .55s ease;
}
.route-card:hover .rp-line::after{left:110%}
.rp-to svg{width:19px;height:19px;stroke:var(--yellow-2);stroke-width:2;transition:transform .34s}
.route-card:hover .rp-to svg{transform:translateY(-3px)}

.route-card h3{font-size:17px;color:var(--navy);letter-spacing:-.025em;line-height:1.2;transition:color .25s}
.route-from{display:block;font-size:11px;font-weight:500;color:var(--muted);letter-spacing:.04em;text-transform:uppercase;margin-bottom:3px}
.route-card:hover h3{color:var(--navy-3)}

.route-meta{display:flex;gap:14px;margin-top:11px;padding-bottom:13px;border-bottom:1px solid var(--line)}
.route-meta li{display:flex;align-items:center;gap:5px;font-size:11.8px;font-weight:400;color:var(--muted)}
.route-meta svg{width:14px;height:14px;flex:none;stroke:var(--navy-3);stroke-width:1.9}

.route-foot{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-top:auto;padding-top:13px}
.route-price{font-size:11.5px;font-weight:400;color:var(--muted);letter-spacing:-.01em}
.route-price b{font-size:19px;font-weight:800;color:var(--navy);letter-spacing:-.03em}
.route-price small{font-size:11.5px;color:var(--muted)}
.route-wa{
  position:relative;z-index:2;flex:none;width:34px;height:34px;border-radius:9px;
  background:var(--green);display:grid;place-items:center;
  box-shadow:0 5px 13px rgba(37,211,102,.32);transition:transform .2s,box-shadow .2s;
}
.route-wa:hover{transform:translateY(-2px);box-shadow:0 10px 20px rgba(37,211,102,.46)}
.route-wa svg{width:17px;height:17px;fill:#fff}

.routes-foot{position:relative;z-index:1;text-align:center;margin-top:30px;font-size:13.5px;font-weight:300;color:var(--muted)}
.routes-foot a{color:var(--navy-3);font-weight:500;border-bottom:1.5px solid rgba(200,35,44,.3);transition:color .18s,border-color .18s}
.routes-foot a:hover{color:var(--yellow-2);border-color:var(--yellow-2)}

@media (max-width:1180px){.routes-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:820px){.routes-grid{grid-template-columns:repeat(2,1fr);gap:14px}}
@media (max-width:520px){
  .routes{padding:56px 0 60px}
  .routes-grid{grid-template-columns:1fr}
  .route-card{padding:18px 16px 14px}
}

/* ================= HOW IT WORKS ================= */
.how{
  position:relative;overflow:hidden;padding:82px 0 88px;
  background:linear-gradient(122deg,#2A0710 0%,var(--navy) 36%,var(--navy-2) 72%,var(--navy-3) 100%);
}
.how-deco{position:absolute;pointer-events:none;opacity:.07;z-index:0}
.how-deco-1{width:300px;height:300px;top:-50px;left:-60px;animation:whyFloat 15s ease-in-out infinite}
.how-deco-2{width:360px;height:360px;bottom:-90px;right:-70px;animation:aboutSpin 65s linear infinite}
.how-glow{
  position:absolute;top:10%;left:42%;width:520px;height:520px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,138,61,.16),transparent 68%);
  animation:tbDrift 17s ease-in-out infinite alternate;pointer-events:none;
}
.how-head{position:relative;z-index:1;text-align:center;max-width:640px;margin:0 auto 46px}
.how-head h2{font-size:clamp(1.6rem,2.9vw,2.35rem);color:#fff}
.how-head p{font-size:14.5px;font-weight:300;color:#E7C3BA;margin-top:12px}

.how-grid{position:relative;z-index:1;display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
/* dashed connector running behind the four steps */
.how-line{
  position:absolute;top:52px;left:12%;right:12%;height:2px;z-index:-1;
  background:repeating-linear-gradient(90deg,rgba(255,138,61,.5) 0 8px,transparent 8px 16px);
}

.how-card{
  position:relative;text-align:center;padding:30px 20px 26px;border-radius:20px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  transition:transform .36s cubic-bezier(.2,.8,.3,1),background .36s,border-color .36s,box-shadow .36s;
}
.how-card:hover{
  transform:translateY(-9px);background:rgba(255,255,255,.11);
  border-color:rgba(255,138,61,.5);box-shadow:0 26px 50px rgba(10,17,45,.45);
}

.how-badge{
  position:absolute;top:-16px;left:50%;transform:translateX(-50%);
  width:34px;height:34px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--yellow),var(--yellow-2));color:var(--navy);
  font-size:15px;font-weight:800;box-shadow:0 8px 18px rgba(244,87,31,.45);
  transition:transform .36s cubic-bezier(.3,1.5,.5,1);
}
.how-card:hover .how-badge{transform:translateX(-50%) scale(1.12)}

.how-ic{
  position:relative;display:grid;place-items:center;
  width:64px;height:64px;margin:16px auto 18px;border-radius:50%;
  background:linear-gradient(140deg,rgba(255,138,61,.20),rgba(200,35,44,.30));
  border:1px solid rgba(255,255,255,.16);
}
.how-ic::after{
  content:"";position:absolute;inset:-7px;border-radius:50%;
  border:1.5px dashed rgba(255,138,61,.4);animation:tbSpin 16s linear infinite;
}
.how-card:hover .how-ic::after{animation-duration:4.5s;border-color:rgba(255,138,61,.8)}
.how-ic svg{width:28px;height:28px;stroke:var(--yellow);stroke-width:1.8;transition:transform .4s cubic-bezier(.2,.8,.3,1)}
.how-card:hover .how-ic svg{transform:scale(1.14)}

.how-card h3{font-size:16.5px;color:#fff;letter-spacing:-.02em}
.how-card p{font-size:12.8px;font-weight:300;color:#E7C3BA;margin-top:9px;line-height:1.7}

@media (max-width:900px){
  .how-grid{grid-template-columns:repeat(2,1fr);gap:26px 18px}
  .how-line{display:none}
}
@media (max-width:520px){
  .how{padding:56px 0 60px}
  .how-head{margin-bottom:36px}
  .how-grid{grid-template-columns:1fr;gap:28px}
  .how-card{padding:26px 18px 22px}
}

/* ================= GOOGLE REVIEWS ================= */
.reviews{position:relative;padding:86px 0 90px;background:#fff;overflow:hidden}
.reviews-bg{
  position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(760px 440px at 100% 0%,rgba(255,138,61,.13),transparent 62%);
}
.reviews-grid{position:relative;z-index:1;display:grid;grid-template-columns:.85fr 1.15fr;gap:48px;align-items:center}

.rv-side h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.rv-side h2 span{color:var(--yellow-2)}

.rv-score{display:flex;align-items:center;gap:18px;margin-top:22px}
.rv-score-num{
  font-size:52px;font-weight:800;line-height:1;letter-spacing:-.05em;color:var(--navy);
  font-variant-numeric:tabular-nums;
}
.rv-stars{display:flex;gap:2px}
.rv-stars svg{width:19px;height:19px;fill:#EDD9D5}
.rv-stars svg.on{fill:#FBBC05}
.rv-count{font-size:13px;font-weight:300;color:var(--muted);margin-top:5px}
.rv-count b{font-weight:600;color:var(--navy)}

.rv-blurb{font-size:14.5px;font-weight:300;color:var(--muted);margin-top:20px;line-height:1.8;max-width:44ch}

.rv-actions{display:flex;flex-wrap:wrap;gap:11px;margin-top:24px}
.rv-write{
  display:inline-flex;align-items:center;gap:9px;
  background:linear-gradient(135deg,var(--yellow),var(--yellow-2));color:var(--navy);
  font-size:14.5px;font-weight:700;padding:13px 26px;border-radius:44px;
  box-shadow:0 12px 28px rgba(244,87,31,.42);transition:transform .2s,box-shadow .2s;
}
.rv-write:hover{transform:translateY(-3px);box-shadow:0 18px 38px rgba(244,87,31,.56)}
.rv-write svg{width:17px;height:17px;stroke:var(--navy);stroke-width:2.2;fill:none}
.rv-all{
  display:inline-flex;align-items:center;gap:8px;
  font-size:14px;font-weight:600;color:var(--navy-3);padding:13px 20px;border-radius:44px;
  border:1.5px solid var(--line);transition:border-color .2s,background .2s}
.rv-all:hover{border-color:var(--navy-3);background:#FDF1EE}
.rv-all svg{width:15px;height:15px;stroke:currentColor;stroke-width:2.4;transition:transform .25s}
.rv-all:hover svg{transform:translateX(4px)}

/* scrolling review stream */
.rv-stream{
  position:relative;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
          mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);
}
.rv-track{display:flex;width:max-content;animation:ssScroll 58s linear infinite}
.rv-track > .rv-card{margin-right:18px}
.rv-stream:hover .rv-track{animation-play-state:paused}

.rv-card{
  flex:none;width:300px;background:#fff;border:1px solid var(--line);border-radius:18px;
  padding:22px 20px;box-shadow:0 8px 24px rgba(20,32,80,.07);
  transition:transform .3s,box-shadow .3s,border-color .3s;
}
.rv-card:hover{transform:translateY(-5px);box-shadow:0 22px 42px rgba(20,32,80,.14);border-color:rgba(255,138,61,.5)}

.rv-top{display:flex;align-items:center;gap:11px}
.rv-avatar{
  width:40px;height:40px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(140deg,var(--navy-3),var(--navy));color:#fff;
  font-size:16px;font-weight:700;
}
.rv-top b{display:block;font-size:14px;font-weight:600;color:var(--navy);line-height:1.25}
.rv-top small{display:block;font-size:11.5px;font-weight:300;color:var(--muted)}
.rv-g{width:19px;height:19px;flex:none;margin-left:auto}

.rv-rating{display:flex;gap:2px;margin-top:13px}
.rv-rating svg{width:15px;height:15px;fill:#EDD9D5}
.rv-rating svg.on{fill:#FBBC05}

.rv-card p{font-size:13px;font-weight:300;color:var(--muted);margin-top:11px;line-height:1.72}

@media (max-width:980px){
  .reviews-grid{grid-template-columns:1fr;gap:36px}
}
@media (max-width:520px){
  .reviews{padding:56px 0 60px}
  .rv-score-num{font-size:42px}
  .rv-card{width:250px;padding:18px 16px}
  .rv-actions .rv-write,.rv-actions .rv-all{flex:1 1 auto;justify-content:center}
}

/* ================= LOCAL COVERAGE ================= */
.coverage{padding:82px 0 86px;background:#FDF7F5}
.cov-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:48px;align-items:start}
.cov-copy h2{font-size:clamp(1.7rem,3vw,2.4rem);color:var(--ink)}
.cov-copy h2 span{color:var(--yellow-2)}
.cov-copy p{font-size:14.8px;font-weight:300;color:var(--muted);margin-top:16px;line-height:1.85;max-width:58ch}
.cov-copy a{color:var(--navy-3);font-weight:500;border-bottom:1.5px solid rgba(200,35,44,.28);transition:color .18s,border-color .18s}
.cov-copy a:hover{color:var(--yellow-2);border-color:var(--yellow-2)}

.cov-areas{
  background:#fff;border:1px solid var(--line);border-radius:20px;padding:28px 26px;
  box-shadow:0 10px 30px rgba(20,32,80,.07);
}
.cov-areas h3{font-size:15px;color:var(--navy);margin-bottom:16px;letter-spacing:-.01em}
.cov-chips{display:flex;flex-wrap:wrap;gap:8px}
.cov-chips li{
  display:inline-flex;align-items:center;gap:6px;
  background:#FBF2EF;border:1px solid var(--line);border-radius:30px;
  padding:7px 14px;font-size:12.8px;font-weight:400;color:var(--navy);
  transition:background .2s,border-color .2s,transform .2s,color .2s;
}
.cov-chips li:hover{background:var(--navy);border-color:var(--navy);color:#fff;transform:translateY(-2px)}
.cov-chips svg{width:13px;height:13px;flex:none;stroke:var(--yellow-2);stroke-width:2}
.cov-chips li:hover svg{stroke:var(--yellow)}
.cov-note{font-size:12.5px;font-weight:300;color:var(--muted);margin-top:16px;padding-top:14px;border-top:1px solid var(--line)}

@media (max-width:900px){.cov-grid{grid-template-columns:1fr;gap:32px}}
@media (max-width:520px){
  .coverage{padding:56px 0 60px}
  .cov-areas{padding:22px 20px;border-radius:16px}
}

/* ================= FAQ ================= */
.faq{padding:86px 0 90px;background:#fff}
.faq-head{max-width:640px;margin-bottom:36px}
.faq-head h2{font-size:clamp(1.7rem,3vw,2.5rem);color:var(--ink)}
.faq-head h2 span{color:var(--yellow-2)}
.faq-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:12px}

.faq-list{display:grid;gap:12px;max-width:900px}
.faq-item{
  background:#fff;border:1px solid var(--line);border-radius:15px;overflow:hidden;
  transition:border-color .28s,box-shadow .28s,background .28s;
}
.faq-item[open]{border-color:rgba(255,138,61,.65);box-shadow:0 14px 34px rgba(20,32,80,.09)}
.faq-item summary{
  display:flex;align-items:center;justify-content:space-between;gap:16px;
  padding:18px 22px;cursor:pointer;list-style:none;
  font-size:15px;font-weight:600;color:var(--navy);letter-spacing:-.01em;
  transition:background .22s,color .22s;
}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary:hover{background:#FDF8F6;color:var(--navy-3)}

.faq-plus{position:relative;width:22px;height:22px;flex:none;border-radius:50%;background:#FFEDE0;transition:background .28s,transform .32s}
.faq-plus::before,.faq-plus::after{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  background:var(--yellow-2);border-radius:2px;transition:transform .32s,background .28s;
}
.faq-plus::before{width:10px;height:2.2px}
.faq-plus::after{width:2.2px;height:10px}
.faq-item[open] .faq-plus{background:var(--navy);transform:rotate(180deg)}
.faq-item[open] .faq-plus::before,.faq-item[open] .faq-plus::after{background:var(--yellow)}
.faq-item[open] .faq-plus::after{transform:translate(-50%,-50%) scaleY(0)}

.faq-answer{padding:0 22px 20px;animation:faqOpen .38s cubic-bezier(.2,.8,.3,1) both}
@keyframes faqOpen{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
.faq-answer p{font-size:14px;font-weight:300;color:var(--muted);line-height:1.85;max-width:72ch}

@media (max-width:520px){
  .faq{padding:56px 0 60px}
  .faq-item summary{padding:16px 17px;font-size:14px}
  .faq-answer{padding:0 17px 18px}
  .faq-answer p{font-size:13.3px}
}

/* ================= FINAL CTA ================= */
.finalcta{
  position:relative;overflow:hidden;padding:80px 0 86px;
  background:linear-gradient(125deg,#2A0710 0%,var(--navy) 34%,var(--navy-2) 68%,var(--navy-3) 100%);
}
.fc-glow{
  position:absolute;top:-180px;left:50%;transform:translateX(-50%);
  width:640px;height:640px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,138,61,.22),transparent 66%);
  animation:tbDrift 15s ease-in-out infinite alternate;pointer-events:none;
}
.fc-deco{
  position:absolute;width:400px;height:400px;right:-90px;bottom:-110px;
  opacity:.07;animation:aboutSpin 60s linear infinite;pointer-events:none;
}
.fc-inner{position:relative;z-index:1;text-align:center}
.fc-eyebrow{
  display:inline-block;background:rgba(255,138,61,.14);border:1px solid rgba(255,138,61,.35);
  color:var(--yellow);font-size:12px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;
  padding:5px 16px;border-radius:30px;margin-bottom:16px;
}
.finalcta h2{font-size:clamp(1.85rem,3.6vw,3rem);color:#fff}
.finalcta h2 span{color:var(--yellow)}
.finalcta > .wrap > p{
  font-size:15.5px;font-weight:300;color:#F5DCD4;margin-top:14px;
  max-width:60ch;margin-inline:auto;line-height:1.8;
}
.fc-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:13px;margin-top:32px}
.fc-btn{
  display:inline-flex;align-items:center;gap:10px;
  font-family:inherit;font-size:15px;font-weight:600;letter-spacing:-.01em;
  border:none;border-radius:46px;cursor:pointer;padding:14px 28px;
  transition:transform .2s,box-shadow .2s;
}
.fc-btn:hover{transform:translateY(-3px)}
.fc-btn svg{width:19px;height:19px;flex:none}
.fc-book{background:linear-gradient(135deg,var(--yellow),var(--yellow-2));color:var(--navy);box-shadow:0 12px 30px rgba(244,87,31,.45)}
.fc-book:hover{box-shadow:0 18px 40px rgba(244,87,31,.6)}
.fc-book svg{stroke:var(--navy);stroke-width:2.1}
.fc-call{background:#fff;color:var(--navy);box-shadow:0 12px 30px rgba(0,0,0,.28)}
.fc-call:hover{box-shadow:0 18px 40px rgba(0,0,0,.4)}
.fc-call svg{stroke:var(--navy);stroke-width:2.2;animation:shake 2.4s infinite}
.fc-wa{background:var(--green);color:#04371A;box-shadow:0 12px 30px rgba(37,211,102,.42)}
.fc-wa:hover{box-shadow:0 18px 40px rgba(37,211,102,.58)}
.fc-wa svg{fill:#04371A}
.fc-note{font-size:12.5px;font-weight:300;color:#D6ADA4;margin-top:20px}

@media (max-width:520px){
  .finalcta{padding:56px 0 62px}
  .fc-btns{gap:10px}
  .fc-btn{padding:13px 22px;font-size:14px;flex:1 1 auto;justify-content:center}
  .fc-deco{width:260px;height:260px}
}

/* ================= POPULAR LINKS STRIP ================= */
.linkstrip{background:#FDF7F5;border-top:1px solid var(--line);padding:38px 0}
.linkstrip h3{font-size:17px;color:var(--navy);margin-bottom:10px}
.linkstrip p{font-size:14.5px;font-weight:300;color:var(--muted);max-width:none}
.linkstrip p + p{margin-top:10px}
.linkstrip a{
  color:var(--navy-3);font-weight:500;border-bottom:1.5px solid rgba(200,35,44,.28);
  transition:color .18s,border-color .18s,background .18s;padding:1px 2px;border-radius:3px;
}
.linkstrip a:hover{color:var(--yellow-2);border-color:var(--yellow-2);background:rgba(255,138,61,.12)}

/* ================= GENERIC PAGE SECTION ================= */
.section{padding:64px 0}
.section-head{max-width:680px;margin-bottom:34px}
.eyebrow-sm{
  display:inline-block;background:#FFEDE0;color:var(--yellow-2);font-size:12px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;padding:5px 13px;border-radius:20px;margin-bottom:12px;
}
.section-head h2{font-size:clamp(1.5rem,2.6vw,2.1rem);color:var(--navy)}
.section-head p{font-size:15px;font-weight:300;color:var(--muted);margin-top:10px}

.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}
.card{
  background:#fff;border:1px solid var(--line);border-radius:18px;padding:26px;
  box-shadow:0 6px 20px rgba(20,32,80,.05);transition:transform .2s,box-shadow .2s;
}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(20,32,80,.12)}
.card .ic{width:46px;height:46px;border-radius:13px;background:linear-gradient(140deg,var(--yellow),var(--yellow-2));display:grid;place-items:center;margin-bottom:14px}
.card .ic svg{width:22px;height:22px;stroke:var(--navy);fill:none;stroke-width:2}
.card h3{font-size:16.5px;color:var(--navy);margin-bottom:8px}
.card p{font-size:13.5px;font-weight:300;color:var(--muted)}

/* ================= FOOTER ================= */
.footer{background:var(--navy);color:#EBC9C2;padding:56px 0 0;position:relative;overflow:hidden}
.footer::before{
  content:"";position:absolute;top:-140px;left:-100px;width:400px;height:400px;border-radius:50%;
  background:radial-gradient(circle,rgba(255,138,61,.12),transparent 68%);
}
.f-grid{position:relative;display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:40px}

.f-brand .logo-text b{color:#fff}
.f-brand .logo-text span{color:#C99C94}
.f-brand p{font-size:13.5px;font-weight:300;color:#DDB4AC;margin-top:16px;line-height:1.85;max-width:34ch}
.f-contact{margin-top:18px;display:grid;gap:9px}
.f-contact a{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;color:#F5DCD4;transition:color .2s}
.f-contact a:hover{color:var(--yellow)}
.f-contact svg{width:15px;height:15px;flex:none;stroke:var(--yellow);margin-top:4px}
.f-social{display:flex;gap:9px;margin-top:18px}
.f-social a{
  width:36px;height:36px;border-radius:10px;display:grid;place-items:center;
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);transition:background .2s,transform .2s;
}
.f-social a:hover{background:var(--yellow);transform:translateY(-3px)}
.f-social a:hover svg{fill:var(--navy)}
.f-social svg{width:16px;height:16px;fill:#F5DCD4;transition:fill .2s}

.f-col h4{font-size:14px;font-weight:700;color:#fff;margin-bottom:16px;position:relative;padding-bottom:10px;letter-spacing:-.01em}
.f-col h4::after{content:"";position:absolute;left:0;bottom:0;width:28px;height:2.5px;background:var(--yellow);border-radius:3px}
.f-col li + li{margin-top:8px}
.f-col a{font-size:13.5px;font-weight:300;color:#DDB4AC;transition:color .18s,padding-left .18s;display:inline-block}
.f-col a:hover{color:var(--yellow);padding-left:5px}

.f-bottom{
  position:relative;margin-top:46px;border-top:1px solid rgba(255,255,255,.1);
  padding:20px 0;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;
}
.f-bottom p{font-size:13px;font-weight:300;color:#C99C94}
.f-credit{font-size:13px;font-weight:400;color:#EBC9C2;display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.f-credit a{
  font-weight:600;background:linear-gradient(90deg,var(--yellow) 0%,#FF8A3D 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
  border-bottom:1.5px solid rgba(255,138,61,.4);transition:border-color .2s;
}
.f-credit a:hover{border-color:var(--yellow)}
.f-credit .heart{color:#FF6B6B;animation:beat 1.6s infinite}
@keyframes beat{0%,100%{transform:scale(1)}18%{transform:scale(1.28)}36%{transform:scale(1)}54%{transform:scale(1.2)}}

/* ================= FLOATING BUTTONS ================= */
.wa-float{
  position:fixed;right:18px;bottom:86px;z-index:800;width:54px;height:54px;border-radius:50%;
  background:var(--green);display:grid;place-items:center;box-shadow:0 12px 28px rgba(37,211,102,.45);transition:transform .2s;
}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:28px;height:28px;fill:#fff}

.chat-launch{
  position:fixed;right:18px;bottom:18px;z-index:800;width:56px;height:56px;border:none;cursor:pointer;
  border-radius:50%;background:linear-gradient(140deg,var(--navy-3),var(--navy));
  display:grid;place-items:center;box-shadow:0 12px 30px rgba(20,32,80,.5);transition:transform .2s;
}
.chat-launch:hover{transform:scale(1.08)}
.chat-launch svg{width:26px;height:26px;stroke:var(--yellow);fill:none;stroke-width:2}
.chat-launch .pulse{position:absolute;inset:0;border-radius:50%;border:2px solid var(--yellow);animation:pulse 2.4s infinite;pointer-events:none}
@keyframes pulse{0%{transform:scale(1);opacity:.7}100%{transform:scale(1.55);opacity:0}}
.chat-launch.hide{display:none}

.chatbox{
  position:fixed;right:18px;bottom:18px;z-index:850;
  width:min(360px,calc(100vw - 36px));height:min(540px,calc(100vh - 110px));
  background:#fff;border-radius:20px;overflow:hidden;display:none;flex-direction:column;
  box-shadow:0 30px 70px rgba(12,20,52,.42);border:1px solid var(--line);
}
.chatbox.open{display:flex;animation:pop .28s cubic-bezier(.2,.8,.3,1) both}
@keyframes pop{from{opacity:0;transform:translateY(20px) scale(.97)}to{opacity:1;transform:none}}

.chat-head{background:linear-gradient(135deg,var(--navy) 0%,var(--navy-3) 100%);padding:14px 16px;display:flex;align-items:center;gap:11px;color:#fff;flex:none}
.chat-avatar{width:38px;height:38px;border-radius:12px;background:linear-gradient(140deg,var(--yellow),var(--yellow-2));display:grid;place-items:center;flex:none}
.chat-avatar svg{width:21px;height:21px;stroke:var(--navy);fill:none;stroke-width:2}
.chat-head b{display:block;font-size:14.5px;font-weight:600;line-height:1.2}
.chat-head small{display:flex;align-items:center;gap:5px;font-size:11.5px;font-weight:300;color:#EFCCC4}
.chat-head small::before{content:"";width:7px;height:7px;border-radius:50%;background:#7FD44F}
.chat-close{margin-left:auto;background:rgba(255,255,255,.12);border:none;color:#fff;width:30px;height:30px;border-radius:9px;cursor:pointer;font-size:16px;line-height:1;transition:background .2s}
.chat-close:hover{background:rgba(255,255,255,.25)}

.chat-body{flex:1;overflow-y:auto;padding:16px;background:#FDF8F6;display:flex;flex-direction:column;gap:9px}
.chat-body::-webkit-scrollbar{width:5px}
.chat-body::-webkit-scrollbar-thumb{background:#E9CFC8;border-radius:5px}
.bubble{max-width:80%;padding:10px 14px;font-size:13.5px;line-height:1.6;border-radius:14px;animation:fade .3s both}
@keyframes fade{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.bubble.bot{background:#fff;color:var(--ink);border:1px solid var(--line);border-bottom-left-radius:4px;align-self:flex-start}
.bubble.me{background:linear-gradient(135deg,var(--navy-3),var(--navy));color:#fff;border-bottom-right-radius:4px;align-self:flex-end}
.bubble.summary{background:#FFF3EC;border:1px solid #FFD2A8;color:var(--navy);max-width:92%;font-size:13px}
.bubble.summary b{color:var(--navy);font-weight:600}
.typing{display:flex;gap:4px;padding:13px 15px;background:#fff;border:1px solid var(--line);border-radius:14px;border-bottom-left-radius:4px;align-self:flex-start;width:fit-content}
.typing i{width:6px;height:6px;border-radius:50%;background:#C9A49C;animation:blink 1.3s infinite}
.typing i:nth-child(2){animation-delay:.18s}.typing i:nth-child(3){animation-delay:.36s}
@keyframes blink{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}

.chips{display:flex;flex-wrap:wrap;gap:7px;align-self:flex-start;max-width:92%}
.chips button{background:#fff;border:1.5px solid var(--navy-3);color:var(--navy-3);font-family:inherit;font-size:12.5px;font-weight:500;padding:7px 13px;border-radius:20px;cursor:pointer;transition:background .18s,color .18s}
.chips button:hover{background:var(--navy-3);color:#fff}

.chat-foot{flex:none;padding:11px 12px;background:#fff;border-top:1px solid var(--line);display:flex;gap:8px;align-items:center}
.chat-foot input{flex:1;font-family:inherit;font-size:13.5px;color:var(--ink);border:1.5px solid var(--line);border-radius:22px;padding:10px 15px;outline:none;transition:border-color .2s,box-shadow .2s;min-width:0}
.chat-foot input:focus{border-color:var(--yellow-2);box-shadow:0 0 0 3px rgba(255,138,61,.22)}
.chat-send{width:40px;height:40px;flex:none;border:none;border-radius:50%;background:linear-gradient(135deg,var(--yellow),var(--yellow-2));display:grid;place-items:center;cursor:pointer;transition:transform .2s}
.chat-send:hover{transform:scale(1.08)}
.chat-send svg{width:17px;height:17px;stroke:var(--navy);fill:none;stroke-width:2.4}
.chat-wa-btn{
  display:flex;align-items:center;justify-content:center;gap:8px;background:var(--green);color:#04371A;
  font-size:13.5px;font-weight:600;padding:11px;border-radius:12px;margin-top:4px;align-self:stretch;
  box-shadow:0 8px 20px rgba(37,211,102,.35);transition:transform .2s;
}
.chat-wa-btn:hover{transform:translateY(-2px)}
.chat-wa-btn svg{width:17px;height:17px;fill:#04371A;flex:none}

/* ================= RESPONSIVE ================= */
@media (max-width:1120px){
  .menu > li > a{font-size:13.5px;padding:9px 9px}
  .call-txt b{font-size:14px}
}
@media (max-width:980px){
  .burger{display:flex}
  .menu{
    position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;
    background:var(--white);border-top:1px solid var(--line);box-shadow:0 18px 34px rgba(20,32,80,.14);
    padding:0 5%;max-height:0;overflow-y:auto;transition:max-height .38s ease,padding .38s ease;
  }
  .menu.open{max-height:calc(100vh - 130px);padding:10px 5% 22px}
  .menu > li{border-bottom:1px solid var(--line)}
  .menu > li:last-child{border-bottom:none}
  .menu > li > a{font-size:15.5px;font-weight:500;padding:14px 4px;border-radius:0;justify-content:space-between}
  .menu > li > a::after{display:none}
  .menu > li > a .chev{width:15px;height:15px;opacity:1}
  .dropdown{
    position:static;transform:none;opacity:1;visibility:visible;box-shadow:none;border:none;padding:0;min-width:0;
    max-height:0;overflow:hidden;transition:max-height .35s ease;background:#FDF8F6;border-radius:12px;
  }
  .dropdown::before,.dropdown::after{display:none}
  .dropdown.two-col{grid-template-columns:1fr;min-width:0}
  .menu > li.open > .dropdown{max-height:620px;padding:8px}
  .menu > li.open > a .chev{transform:rotate(180deg)}
  .menu > li:hover > .dropdown{max-height:0}
  .menu > li.open:hover > .dropdown{max-height:620px}
  .dropdown a{font-size:14px;padding:10px}
  .tb-right .tb-mail{display:none}
  .f-grid{grid-template-columns:1fr 1fr;gap:34px}
  .f-brand{grid-column:1/-1}
}
@media (max-width:620px){
  .topbar{padding:7px 0;font-size:11.5px}
  .topbar .wrap{justify-content:center;text-align:center}
  .tb-right{display:none}
  .call-btn{padding:7px 13px 7px 7px;gap:8px}
  .call-ring{width:30px;height:30px}
  .call-txt small{display:none}
  .call-txt b{font-size:13.5px}
  .logo-mark{width:40px;height:40px;border-radius:11px}
  .logo-text b{font-size:18px}
  .logo-text span{font-size:8.5px;letter-spacing:.14em}
  .hero{min-height:auto;padding:52px 0 76px}
  .hero-scrim{background:linear-gradient(180deg,rgba(12,20,52,.72) 0%,rgba(12,20,52,.55) 45%,rgba(12,20,52,.80) 100%)}
  .hero h1{white-space:normal;font-size:1.7rem}
  .hero p.lede{font-size:13.5px;max-width:none}
  .btn{padding:11px 18px;font-size:13.5px;flex:1 1 auto;justify-content:center}
  .hero-stats{gap:16px 22px;margin-top:24px;padding-top:18px}
  .hero-stats li{flex:1 1 40%}
  .hero-stats b{font-size:26px}
  .slider-dots{bottom:16px}
  .page-header{padding:38px 0 30px}
  .section{padding:44px 0}
  .f-grid{grid-template-columns:1fr;gap:30px}
  .f-bottom{justify-content:center;text-align:center;flex-direction:column;gap:6px}
  .wa-float{width:48px;height:48px;right:14px;bottom:78px}
  .wa-float svg{width:25px;height:25px}
  .chat-launch{width:52px;height:52px;right:14px;bottom:14px}
  .chatbox{right:10px;left:10px;bottom:10px;width:auto;height:min(560px,calc(100vh - 90px))}
}
@media (prefers-reduced-motion:reduce){
  *{animation:none!important;transition:none!important}
  html{scroll-behavior:auto}
}

/* =====================================================================
   CHERRY CABS — BRAND ACCENTS
   Brings the logo's second gradient (turquoise → green → grass) back
   into the page so the site isn't red top to bottom, and adds the
   floating cherry decorations.
   ===================================================================== */

/* ---- cool gradient touches ---- */
.tb-ic{background:linear-gradient(140deg,rgba(18,168,168,.22),rgba(125,194,66,.26))}
.tb-ic > svg{stroke:#8FE0A0}
.tb-ic::after{border-color:rgba(125,194,66,.45)}
.tb-item:hover .tb-ic::after{border-color:rgba(125,194,66,.85)}
.tb-tick{background:var(--grass);border-color:var(--cherry-dark)}

.why-ic{background:linear-gradient(140deg,#E6F6EC,#D5EFC4)}
.why-card:hover .why-ic{background:var(--grad-cool)}
.why-card:hover .why-ic svg{stroke:#fff}

.how-ic{background:linear-gradient(140deg,rgba(18,168,168,.24),rgba(125,194,66,.28))}
.how-ic svg{stroke:#9FE7B2}
.how-ic::after{border-color:rgba(125,194,66,.45)}
.how-card:hover .how-ic::after{border-color:rgba(125,194,66,.85)}

.rv-avatar{background:var(--grad-cool)}
.badge-ic{background:var(--grad-cool)}
.badge-ic::after{border-color:var(--teal)}

.fleet-specs svg,.route-meta svg{stroke:var(--teal)}
.cov-chips li:hover{background:var(--grad-cool);border-color:transparent}
.cov-chips svg{stroke:var(--teal)}
.svc-points svg{stroke:var(--green-dark);background:#EDF7E2}

.eyebrow-line::before{background:var(--grad-cool)}
.hero h1 mark::after,.ss-name::before,.ss-hover h4::after{background:var(--grad-warm)}

/* logo mark keeps the warm gradient */
.logo-mark{background:var(--grad-warm);box-shadow:0 6px 16px rgba(200,35,44,.35)}

/* ---- header logo image ---- */
.logo-image{height:46px;width:auto;display:block;transition:height .28s ease}
.site-header.scrolled .logo-image{height:38px}
.f-logo-image{height:56px;width:auto;display:block;margin-bottom:4px}
@media (max-width:620px){
  .logo-image{height:36px}
  .site-header.scrolled .logo-image{height:32px}
  .f-logo-image{height:46px}
}

/* ---- floating cherry decorations ---- */
.cherries{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0}
.cherry-drop{
  position:absolute;width:44px;height:44px;opacity:.16;
  animation:cherryFloat 14s ease-in-out infinite;
}
.cherry-drop:nth-child(1){top:12%;left:6%;animation-delay:0s}
.cherry-drop:nth-child(2){top:64%;left:14%;width:32px;animation-delay:2.4s}
.cherry-drop:nth-child(3){top:22%;right:9%;width:52px;animation-delay:1.2s}
.cherry-drop:nth-child(4){bottom:14%;right:18%;width:36px;animation-delay:3.6s}
.cherry-drop:nth-child(5){top:46%;left:46%;width:28px;animation-delay:4.8s}
@keyframes cherryFloat{
  0%,100%{transform:translateY(0) rotate(-6deg)}
  50%{transform:translateY(-30px) rotate(8deg)}
}
.hero .cherries{z-index:1;opacity:.5}
.finalcta .cherries .cherry-drop{opacity:.2}

/* soft moving gradient wash for dark bands */
.brand-wash{
  position:absolute;inset:0;pointer-events:none;opacity:.5;
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(18,168,168,.30),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(255,138,61,.28),transparent 64%);
  animation:washDrift 20s ease-in-out infinite alternate;
}
@keyframes washDrift{from{transform:translate(0,0) scale(1)}to{transform:translate(-40px,30px) scale(1.08)}}

@media (prefers-reduced-motion:reduce){
  .cherry-drop,.brand-wash{animation:none}
}

/* footer logo sits on a white chip so the dark logo text stays legible */
.f-logo{
  display:inline-block;background:#fff;border-radius:14px;padding:12px 16px;
  box-shadow:0 10px 26px rgba(0,0,0,.25);
}
.f-logo img{height:58px;width:auto;display:block}
@media (max-width:620px){.f-logo img{height:46px}}

/* =====================================================================
   CHERRY CABS — SECTION POLISH
   Red and green now alternate as co-primary colours, and the flat
   white sections get soft tints, dot texture and corner colour so the
   page has rhythm instead of one long white run.
   ===================================================================== */

/* ---------- DARK BANDS: alternate green / red down the page ---------- */

/* 3rd section — Trust Bar → deep green */
.trustbar{background:linear-gradient(118deg,#062A1C 0%,#0B4A2C 34%,#0B6B37 68%,#12A8A8 100%)}
.tb-glow{background:radial-gradient(circle,rgba(125,194,66,.24) 0%,rgba(125,194,66,0) 68%)}
.tb-stripes{background-image:repeating-linear-gradient(90deg,#7DC242 0 42px,transparent 42px 96px)}
.tb-eyebrow{background:rgba(255,138,61,.16);border-color:rgba(255,138,61,.4);color:#FFC08A}
.tb-item:hover{border-color:rgba(125,194,66,.55)}
.tb-item::before{background:linear-gradient(160deg,rgba(125,194,66,.18),transparent 58%)}
.trustbar .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(18,168,168,.30),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(125,194,66,.26),transparent 64%);
}

/* 7th section — Sightseeing band → cherry red */
.ss-band{background:linear-gradient(115deg,#2A0710 0%,#7A121C 36%,#C8232C 72%,#FF4438 100%)}
.ss-band-glow{background:radial-gradient(circle,rgba(255,138,61,.26),transparent 68%)}

/* 9th section — How It Works → deep green */
.how{background:linear-gradient(122deg,#052518 0%,#0B4A2C 36%,#0B6B37 70%,#12A8A8 100%)}
.how-glow{background:radial-gradient(circle,rgba(125,194,66,.20),transparent 68%)}
.how-deco-1{stroke:#7DC242}
.how-line{background:repeating-linear-gradient(90deg,rgba(255,138,61,.55) 0 8px,transparent 8px 16px)}
.how-card:hover{border-color:rgba(125,194,66,.55)}
.how .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(18,168,168,.32),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(125,194,66,.26),transparent 64%);
}

/* Final CTA stays warm — it's the moment we ask for the booking */
.finalcta{background:linear-gradient(125deg,#2A0710 0%,#7A121C 34%,#C8232C 70%,#FF4438 100%)}

/* Footer → deepest green so the page closes on the cool half */
.footer{background:linear-gradient(160deg,#062A1C 0%,#08361F 55%,#0B4A2C 100%)}
.footer::before{background:radial-gradient(circle,rgba(125,194,66,.14),transparent 68%)}

/* Top bar picks up the cherry red */
.topbar{background:linear-gradient(90deg,#3B0A12 0%,#7A121C 60%,#C8232C 100%)}


/* ---------- LIGHT SECTIONS: tint, texture and corner colour ---------- */

/* shared faint dot texture, tuned per section below */
.about,.services,.why,.fleet-sec,.sight,.routes,.reviews,.coverage,.faq{
  position:relative;
}

/* 2 — About: warm cream, green top-left, red bottom-right */
.about{
  background:
    radial-gradient(rgba(200,35,44,.055) 1px,transparent 1px) 0 0/28px 28px,
    radial-gradient(680px 440px at 2% 4%,rgba(125,194,66,.16),transparent 62%),
    radial-gradient(640px 420px at 98% 96%,rgba(255,138,61,.16),transparent 62%),
    linear-gradient(180deg,#fff 0%,#FFF9F6 100%);
}
.about-deco-1{stroke:#0B6B37}
.about-deco-2{stroke:#C8232C}

/* 4 — Services: white with cool top / warm bottom wash */
.services{
  background:
    radial-gradient(rgba(11,107,55,.05) 1px,transparent 1px) 0 0/30px 30px,
    #fff;
}
.svc-bg{
  background:
    radial-gradient(760px 420px at 94% -6%,rgba(125,194,66,.18),transparent 62%),
    radial-gradient(700px 440px at -6% 104%,rgba(200,35,44,.12),transparent 60%);
}
.services .section-head h2 span{color:var(--green-dark)}

/* 5 — Why Choose Us: mint green tint */
.why{
  background:
    radial-gradient(rgba(11,107,55,.06) 1px,transparent 1px) 0 0/26px 26px,
    radial-gradient(720px 460px at 100% 0%,rgba(18,168,168,.14),transparent 62%),
    linear-gradient(180deg,#F3FAF4 0%,#ECF7EE 100%);
}
.why-deco-1{stroke:#0B6B37}
.why-deco-2{stroke:#C8232C}
.why-deco-3{stroke:#12A8A8}
.why-head h2 span{color:var(--green-dark)}
.why-card::before{background:var(--grad-cool)}

/* 6 — Fleet: warm cream */
.fleet-sec{
  background:
    radial-gradient(rgba(200,35,44,.05) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(180deg,#FFF9F5 0%,#fff 100%);
}
.fleet-bg{
  background:
    radial-gradient(720px 400px at 4% 0%,rgba(255,138,61,.18),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(125,194,66,.16),transparent 62%);
}
.fleet-media{background:linear-gradient(170deg,#FFFDFC 0%,#F6FAF3 100%)}

/* 7 — Sightseeing: clean white so the photos carry it */
.sight{
  background:
    radial-gradient(rgba(11,107,55,.045) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#fff 0%,#FFFBF9 100%);
}

/* 8 — Routes: mint into cream */
.routes{
  background:
    radial-gradient(rgba(200,35,44,.05) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(180deg,#F3FAF4 0%,#FFF9F6 100%);
}
.routes-bg{
  background:
    radial-gradient(700px 400px at 4% 0%,rgba(18,168,168,.16),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(255,138,61,.16),transparent 62%);
}
.routes-head h2 span{color:var(--green-dark)}

/* 10 — Reviews: white with warm corner */
.reviews{
  background:
    radial-gradient(rgba(200,35,44,.05) 1px,transparent 1px) 0 0/30px 30px,
    #fff;
}
.reviews-bg{
  background:
    radial-gradient(760px 440px at 100% 0%,rgba(255,138,61,.16),transparent 62%),
    radial-gradient(620px 400px at 0% 100%,rgba(125,194,66,.14),transparent 60%);
}

/* 11 — Coverage: cream into mint */
.coverage{
  background:
    radial-gradient(rgba(11,107,55,.05) 1px,transparent 1px) 0 0/26px 26px,
    linear-gradient(180deg,#FFF9F6 0%,#F3FAF4 100%);
}
.cov-copy h2 span{color:var(--green-dark)}

/* 12 — FAQ: white, green accent on open items */
.faq{
  background:
    radial-gradient(rgba(200,35,44,.045) 1px,transparent 1px) 0 0/30px 30px,
    #fff;
}
.faq-item[open]{border-color:rgba(125,194,66,.7)}
.faq-plus{background:#E9F6E4}
.faq-plus::before,.faq-plus::after{background:var(--green-dark)}
.faq-item[open] .faq-plus{background:var(--green-dark)}
.faq-item[open] .faq-plus::before,.faq-item[open] .faq-plus::after{background:#fff}

/* keep section content above the texture */
.about > .wrap,.services > .wrap,.why > .wrap,.fleet-sec > .wrap,
.sight > .wrap,.routes > .wrap,.reviews > .wrap,.coverage > .wrap,
.faq > .wrap{position:relative;z-index:1}


/* ---------- brand rule between light sections ---------- */
.services::before,.why::before,.fleet-sec::before,.routes::before,
.reviews::before,.coverage::before,.faq::before{
  content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);
  width:min(1240px,92%);height:3px;border-radius:3px;z-index:2;
  background:linear-gradient(90deg,
    rgba(200,35,44,0) 0%,
    #C8232C 18%,
    #FF8A3D 40%,
    #7DC242 66%,
    #12A8A8 84%,
    rgba(18,168,168,0) 100%);
  opacity:.55;
}

/* ---------- link strip closes on the cool half ---------- */
.linkstrip{
  background:linear-gradient(180deg,#F3FAF4 0%,#EAF5EC 100%);
  border-top:1px solid rgba(11,107,55,.12);
}
.linkstrip a{color:var(--green-dark);border-bottom-color:rgba(11,107,55,.3)}
.linkstrip a:hover{color:var(--cherry);border-color:var(--cherry);background:rgba(200,35,44,.08)}

/* ---------- hero: warm brush, cool counter-glow ---------- */
.hero-scrim{
  background:
    linear-gradient(96deg,rgba(12,20,52,.58) 0%,rgba(12,20,52,.32) 30%,rgba(12,20,52,0) 55%),
    linear-gradient(180deg,rgba(12,20,52,.42) 0%,rgba(12,20,52,0) 30%,rgba(11,74,44,.55) 100%);
}
.hero-eyebrow{background:var(--grad-cool);color:#fff;box-shadow:0 6px 18px rgba(11,107,55,.4)}
.hero-stats b{color:#FFB27A}
.slider-dots button.on{background:var(--grass)}

/* ---------- buttons: keep warm CTA, cool secondary ---------- */
.btn-call{background:#fff;color:var(--cherry-dark)}
.svc-btn-enq,.fb-enq{background:linear-gradient(135deg,#FF6B45,#E0400F)}
.route-card:hover{border-color:rgba(125,194,66,.7)}
.rp-from{background:var(--green-dark);box-shadow:0 0 0 3.5px rgba(11,107,55,.16)}
.rp-to svg{stroke:var(--cherry)}
.rp-line::after{background:linear-gradient(90deg,transparent,var(--grass),transparent)}

/* ---------- cards: green hover edge on the cool sections ---------- */
.svc-card:hover,.fleet-card:hover{border-color:rgba(125,194,66,.65)}
.why-card:hover{border-color:rgba(18,168,168,.55)}
.rv-card:hover{border-color:rgba(125,194,66,.6)}
.ss-card:hover{box-shadow:0 26px 48px rgba(11,74,44,.26)}

/* ---------- section eyebrows alternate ---------- */
.eyebrow-sm{background:#E9F6E4;color:var(--green-dark)}
.ssp-meta{background:rgba(255,138,61,.16);border-color:rgba(255,138,61,.36);color:#FFC08A}
.fleet-tag{background:var(--grad-cool);color:#fff;box-shadow:0 6px 14px rgba(11,107,55,.36)}

/* ---------- chatbot in brand colours ---------- */
.chat-launch{background:var(--grad-cool);box-shadow:0 12px 30px rgba(11,107,55,.45)}
.chat-launch svg{stroke:#fff}
.chat-launch .pulse{border-color:var(--grass)}
.chat-head{background:linear-gradient(135deg,#3B0A12 0%,#C8232C 100%)}
.bubble.me{background:var(--grad-warm)}
.chips button{border-color:var(--green-dark);color:var(--green-dark)}
.chips button:hover{background:var(--green-dark);color:#fff}
.chat-send{background:var(--grad-warm)}
.chat-send svg{stroke:#fff}
.bubble.summary{background:#FFF3EC;border-color:#FFCFAE;color:var(--cherry-dark)}

/* =====================================================================
   VIVID SECTION SYSTEM
   Every section gets its own accent colour, tinted background and
   coloured shadow, so the page reads as bright and varied rather than
   one long wash. Order down the page:
   red → navy → green → red → teal → navy → red → yellow → blue →
   green → teal → red → red(CTA) → navy(footer)
   ===================================================================== */

/* ---------- TOP BAR & HEADER ---------- */
.topbar{background:linear-gradient(90deg,#0D1A45 0%,#1E3A8A 48%,#2563EB 100%)}
.tb-badge{background:var(--grad-sun);color:#3A2A00}
.tb-right svg{stroke:var(--yellow-bright)}
.tb-right a:hover{color:var(--yellow-bright)}
.site-header{border-bottom:3px solid transparent;
  border-image:linear-gradient(90deg,#E63946,#FF7A2F 28%,#FFC93C 50%,#7DC242 74%,#0FA3A3) 1}
.menu > li > a::after{background:var(--grad-warm)}
.call-btn{background:var(--grad-sun);color:#3A2A00;box-shadow:0 8px 20px rgba(245,158,11,.45)}
.call-ring{background:var(--red)}
.call-ring svg{stroke:#fff}

/* ---------- HERO (red + yellow) ---------- */
.hero-scrim{
  background:
    linear-gradient(96deg,rgba(10,17,45,.62) 0%,rgba(10,17,45,.34) 30%,rgba(10,17,45,0) 55%),
    linear-gradient(180deg,rgba(10,17,45,.42) 0%,rgba(10,17,45,0) 30%,rgba(74,10,16,.60) 100%);
}
.hero-eyebrow{background:var(--grad-sun);color:#3A2A00;box-shadow:0 6px 18px rgba(245,158,11,.5)}
.hero h1 span{color:var(--yellow-bright)}
.hero h2{color:#FFD98A}
.hero-stats b{color:var(--yellow-bright)}
.slider-dots button.on{background:var(--yellow-bright)}

/* ---------- 2. ABOUT — navy accent ---------- */
.about{
  background:
    radial-gradient(rgba(37,99,235,.06) 1px,transparent 1px) 0 0/28px 28px,
    radial-gradient(680px 440px at 2% 4%,rgba(37,99,235,.16),transparent 62%),
    radial-gradient(640px 420px at 98% 96%,rgba(230,57,70,.14),transparent 62%),
    linear-gradient(180deg,#fff 0%,#F4F8FF 100%);
}
.about-deco-1{stroke:#2563EB}
.about-deco-2{stroke:#E63946}
.about-copy h2 span{color:var(--blue)}
.badge-ic{background:var(--grad-blue)}
.badge-ic::after{border-color:var(--blue)}
.about-stats b{color:var(--blue)}
.eyebrow-line{color:var(--blue)}
.eyebrow-line::before{background:var(--grad-warm)}

/* ---------- 3. TRUST BAR — bright green ---------- */
.trustbar{background:linear-gradient(118deg,#053D22 0%,#0A5C33 32%,#22A055 66%,#2FBF5E 100%)}
.tb-glow{background:radial-gradient(circle,rgba(255,201,60,.28) 0%,transparent 68%)}
.tb-stripes{background-image:repeating-linear-gradient(90deg,#FFC93C 0 42px,transparent 42px 96px)}
.tb-eyebrow{background:rgba(255,201,60,.20);border-color:rgba(255,201,60,.5);color:#FFE08A}
.tb-ic{background:linear-gradient(140deg,rgba(255,201,60,.26),rgba(255,122,47,.24))}
.tb-ic > svg{stroke:#FFD86B}
.tb-ic::after{border-color:rgba(255,201,60,.5)}
.tb-item:hover .tb-ic::after{border-color:#FFC93C}
.tb-item:hover{border-color:rgba(255,201,60,.6)}
.tb-item::before{background:linear-gradient(160deg,rgba(255,201,60,.20),transparent 58%)}
.tb-tick{background:#FFC93C;border-color:#053D22}
.tb-tick svg{stroke:#053D22}
.trustbar .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(15,163,163,.34),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(255,201,60,.26),transparent 64%);
}

/* ---------- 4. SERVICES — red accent ---------- */
.services{
  background:
    radial-gradient(rgba(230,57,70,.055) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#FFF8F8 0%,#fff 100%);
}
.svc-bg{
  background:
    radial-gradient(760px 420px at 94% -6%,rgba(230,57,70,.16),transparent 62%),
    radial-gradient(700px 440px at -6% 104%,rgba(255,201,60,.18),transparent 60%);
}
.services .section-head h2 span{color:var(--red)}
.svc-emoji{background:var(--grad-warm);box-shadow:0 10px 24px rgba(230,57,70,.45)}
.svc-card:hover{border-color:rgba(230,57,70,.6);box-shadow:0 28px 56px rgba(230,57,70,.20)}
.svc-points svg{stroke:var(--green-mid);background:#E6F7EC}
.svc-more{color:var(--red)}
.svc-btn-enq{background:var(--grad-warm);box-shadow:0 8px 20px rgba(230,57,70,.38)}

/* ---------- 5. WHY CHOOSE US — teal / green ---------- */
.why{
  background:
    radial-gradient(rgba(15,163,163,.07) 1px,transparent 1px) 0 0/26px 26px,
    radial-gradient(720px 460px at 100% 0%,rgba(15,163,163,.16),transparent 62%),
    radial-gradient(620px 420px at 0% 100%,rgba(125,194,66,.16),transparent 60%),
    linear-gradient(180deg,#EEFBF6 0%,#E7F7F2 100%);
}
.why-deco-1{stroke:#0FA3A3}
.why-deco-2{stroke:#E63946}
.why-deco-3{stroke:#7DC242}
.why-head h2 span{color:var(--teal-deep)}
.why-ic{background:linear-gradient(140deg,#DFF6EF,#CFEFDD)}
.why-ic svg{stroke:var(--teal-deep)}
.why-card:hover .why-ic{background:var(--grad-cool)}
.why-card:hover .why-ic svg{stroke:#fff}
.why-card::before{background:var(--grad-cool)}
.why-card:hover{border-color:rgba(15,163,163,.6);box-shadow:0 26px 50px rgba(15,163,163,.20)}
.why-card:hover .why-num{color:var(--teal)}

/* ---------- 6. FLEET — navy accent ---------- */
.fleet-sec{
  background:
    radial-gradient(rgba(37,99,235,.055) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(180deg,#F4F8FF 0%,#fff 100%);
}
.fleet-bg{
  background:
    radial-gradient(720px 400px at 4% 0%,rgba(37,99,235,.16),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(255,122,47,.16),transparent 62%);
}
.fleet-head h2 span{color:var(--blue)}
.fleet-media{background:linear-gradient(170deg,#FBFDFF 0%,#EDF3FF 100%)}
.fleet-tag{background:var(--grad-blue);color:#fff;box-shadow:0 6px 14px rgba(30,58,138,.4)}
.fleet-specs svg{stroke:var(--blue)}
.fleet-card:hover{border-color:rgba(37,99,235,.55);box-shadow:0 26px 52px rgba(37,99,235,.20)}
.fb-call{background:var(--grad-blue);box-shadow:0 6px 16px rgba(30,58,138,.36)}
.fb-enq{background:var(--grad-warm);box-shadow:0 6px 16px rgba(230,57,70,.36)}
.fp-amount b{color:var(--red)}

/* ---------- 7. SIGHTSEEING — red band ---------- */
.sight{
  background:
    radial-gradient(rgba(230,57,70,.05) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#fff 0%,#FFF8F5 100%);
}
.sight-head h2 span{color:var(--red)}
.ss-name::before,.ss-hover h4::after{background:var(--grad-sun)}
.ss-band{background:linear-gradient(115deg,#4A0A10 0%,#C1121F 34%,#E63946 70%,#FF7A2F 100%)}
.ss-band-glow{background:radial-gradient(circle,rgba(255,201,60,.30),transparent 68%)}
.ssp-meta{background:rgba(255,201,60,.20);border-color:rgba(255,201,60,.45);color:#FFE08A}
.ssp-card:hover{border-color:rgba(255,201,60,.6)}
.ssp-card::before{background:linear-gradient(160deg,rgba(255,201,60,.18),transparent 60%)}
.ssp-card:hover .ssp-num{color:var(--yellow-bright)}
.ssp-view:hover{background:var(--yellow-bright);color:#3A2A00;border-color:var(--yellow-bright)}
.ss-cta-link{background:var(--grad-sun);color:#3A2A00;box-shadow:0 12px 30px rgba(245,158,11,.5)}
.ss-cta-link svg{stroke:#3A2A00}

/* ---------- 8. ROUTES — yellow / amber accent ---------- */
.routes{
  background:
    radial-gradient(rgba(245,158,11,.07) 1px,transparent 1px) 0 0/28px 28px,
    radial-gradient(700px 400px at 4% 0%,rgba(255,201,60,.22),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(125,194,66,.16),transparent 62%),
    linear-gradient(180deg,#FFFBEF 0%,#FFF7E4 100%);
}
.routes-bg{background:none}
.routes-head h2 span{color:var(--amber)}
.rp-from{background:var(--green-mid);box-shadow:0 0 0 3.5px rgba(34,160,85,.20)}
.rp-to svg{stroke:var(--red)}
.rp-line::after{background:linear-gradient(90deg,transparent,var(--amber),transparent)}
.route-card:hover{border-color:rgba(245,158,11,.65);box-shadow:0 24px 46px rgba(245,158,11,.22)}
.route-meta svg{stroke:var(--amber)}
.route-price b{color:var(--navy)}

/* ---------- 9. HOW IT WORKS — navy blue band ---------- */
.how{background:linear-gradient(122deg,#08123A 0%,#16255C 34%,#1E3A8A 68%,#2563EB 100%)}
.how-glow{background:radial-gradient(circle,rgba(255,201,60,.20),transparent 68%)}
.how-deco-1{stroke:#FFC93C}
.how-deco-2{stroke:#7DC242}
.how-line{background:repeating-linear-gradient(90deg,rgba(255,201,60,.6) 0 8px,transparent 8px 16px)}
.how-badge{background:var(--grad-sun);color:#3A2A00;box-shadow:0 8px 18px rgba(245,158,11,.55)}
.how-ic{background:linear-gradient(140deg,rgba(255,201,60,.24),rgba(47,191,94,.26))}
.how-ic svg{stroke:#FFD86B}
.how-ic::after{border-color:rgba(255,201,60,.5)}
.how-card:hover .how-ic::after{border-color:#FFC93C}
.how-card:hover{border-color:rgba(255,201,60,.55)}
.how .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(47,191,94,.28),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(255,201,60,.26),transparent 64%);
}

/* ---------- 10. REVIEWS — green accent ---------- */
.reviews{
  background:
    radial-gradient(rgba(34,160,85,.055) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#F3FCF6 0%,#fff 100%);
}
.reviews-bg{
  background:
    radial-gradient(760px 440px at 100% 0%,rgba(47,191,94,.16),transparent 62%),
    radial-gradient(620px 400px at 0% 100%,rgba(255,201,60,.16),transparent 60%);
}
.rv-side h2 span{color:var(--green-mid)}
.rv-score-num{color:var(--green-dark)}
.rv-avatar{background:var(--grad-cool)}
.rv-write{background:var(--grad-sun);color:#3A2A00;box-shadow:0 12px 28px rgba(245,158,11,.5)}
.rv-write svg{stroke:#3A2A00}
.rv-all{color:var(--green-dark)}
.rv-all:hover{border-color:var(--green-mid);background:#EBF9F0}
.rv-card:hover{border-color:rgba(47,191,94,.6);box-shadow:0 22px 42px rgba(34,160,85,.18)}

/* ---------- 11. COVERAGE — teal accent ---------- */
.coverage{
  background:
    radial-gradient(rgba(15,163,163,.06) 1px,transparent 1px) 0 0/26px 26px,
    radial-gradient(680px 420px at 100% 100%,rgba(37,99,235,.12),transparent 60%),
    linear-gradient(180deg,#fff 0%,#EEFBF9 100%);
}
.cov-copy h2 span{color:var(--teal-deep)}
.cov-copy a{color:var(--teal-deep);border-bottom-color:rgba(15,163,163,.35)}
.cov-copy a:hover{color:var(--red);border-color:var(--red)}
.cov-chips li{background:#F1FAF9;border-color:#D8EFEC}
.cov-chips li:hover{background:var(--grad-cool);border-color:transparent;color:#fff}
.cov-chips svg{stroke:var(--teal)}
.cov-areas{border-color:#DDEFEE;box-shadow:0 10px 30px rgba(15,163,163,.12)}

/* ---------- 12. FAQ — red accent ---------- */
.faq{
  background:
    radial-gradient(rgba(230,57,70,.05) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#fff 0%,#FFF8F8 100%);
}
.faq-head h2 span{color:var(--red)}
.faq-item[open]{border-color:rgba(230,57,70,.55);box-shadow:0 14px 34px rgba(230,57,70,.14)}
.faq-plus{background:#FFE9EA}
.faq-plus::before,.faq-plus::after{background:var(--red)}
.faq-item[open] .faq-plus{background:var(--red)}
.faq-item[open] .faq-plus::before,.faq-item[open] .faq-plus::after{background:#fff}
.faq-item summary:hover{background:#FFF6F6;color:var(--red)}

/* ---------- 13. FINAL CTA — full brand gradient ---------- */
.finalcta{background:linear-gradient(125deg,#4A0A10 0%,#C1121F 30%,#E63946 62%,#FF7A2F 100%)}
.fc-glow{background:radial-gradient(circle,rgba(255,201,60,.28),transparent 66%)}
.fc-eyebrow{background:rgba(255,201,60,.20);border-color:rgba(255,201,60,.5);color:#FFE08A}
.finalcta h2 span{color:var(--yellow-bright)}
.fc-book{background:var(--grad-sun);color:#3A2A00;box-shadow:0 12px 30px rgba(245,158,11,.55)}
.fc-book svg{stroke:#3A2A00}
.fc-call{color:var(--red-deep)}
.fc-call svg{stroke:var(--red-deep)}
.fc-deco{stroke:#FFC93C}

/* ---------- LINK STRIP + FOOTER — navy close ---------- */
.linkstrip{background:linear-gradient(180deg,#F4F8FF 0%,#EAF1FF 100%);border-top:1px solid rgba(37,99,235,.14)}
.linkstrip h3{color:var(--navy)}
.linkstrip a{color:var(--blue);border-bottom-color:rgba(37,99,235,.32)}
.linkstrip a:hover{color:var(--red);border-color:var(--red);background:rgba(230,57,70,.08)}

.footer{background:linear-gradient(160deg,#08123A 0%,#0D1A45 55%,#16255C 100%)}
.footer::before{background:radial-gradient(circle,rgba(255,201,60,.14),transparent 68%)}
.f-col h4::after{background:var(--grad-sun)}
.f-col a:hover{color:var(--yellow-bright)}
.f-contact a:hover{color:var(--yellow-bright)}
.f-contact svg{stroke:var(--yellow-bright)}
.f-social a:hover{background:var(--grad-sun)}
.f-social a:hover svg{fill:#3A2A00}
.f-credit a{background:linear-gradient(90deg,#FFC93C 0%,#FF7A2F 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- section top rule: full brand spectrum ---------- */
.services::before,.why::before,.fleet-sec::before,.routes::before,
.reviews::before,.coverage::before,.faq::before{
  background:linear-gradient(90deg,
    rgba(230,57,70,0) 0%, #E63946 14%, #FF7A2F 32%,
    #FFC93C 50%, #7DC242 68%, #0FA3A3 84%, rgba(37,99,235,0) 100%);
  opacity:.8;height:4px;
}

/* ---------- chatbot ---------- */
.chat-launch{background:var(--grad-warm);box-shadow:0 12px 30px rgba(230,57,70,.5)}
.chat-launch svg{stroke:#fff}
.chat-launch .pulse{border-color:var(--yellow-bright)}
.chat-head{background:var(--grad-blue)}
.chat-avatar{background:var(--grad-sun)}
.chat-avatar svg{stroke:#3A2A00}
.bubble.me{background:var(--grad-warm)}
.chips button{border-color:var(--blue);color:var(--blue)}
.chips button:hover{background:var(--blue);color:#fff}
.chat-send{background:var(--grad-sun)}
.chat-send svg{stroke:#3A2A00}
.bubble.summary{background:#FFFAEC;border-color:#FFE3A3;color:var(--navy)}

/* ---------- inner page headers ---------- */
.page-header{background:linear-gradient(120deg,#0D1A45 0%,#16255C 55%,#2563EB 100%)}
.page-header::before{background:radial-gradient(circle,rgba(255,201,60,.20),transparent 68%)}
.breadcrumb span{color:var(--yellow-bright)}
.breadcrumb a:hover{color:var(--yellow-bright)}
.eyebrow-sm{background:#FFF3D6;color:#8A5B00}
.card .ic{background:var(--grad-warm)}
.card .ic svg{stroke:#fff}
.card:hover{border-color:rgba(230,57,70,.45);box-shadow:0 18px 40px rgba(230,57,70,.16)}

/* =====================================================================
   FINAL BALANCE — CHERRY-LED
   Red leads the page, green partners it section by section.
   Navy and yellow appear only in small doses (a badge, a number,
   one button) so the cherry identity stays dominant.
   ===================================================================== */

/* ---------- TOP BAR + HEADER: cherry ---------- */
.topbar{background:linear-gradient(90deg,#4A0A10 0%,#A80F1B 52%,#E63946 100%)}
.tb-badge{background:var(--grad-sun);color:#3A2A00}          /* small yellow */
.tb-right svg{stroke:#FFC93C}
.tb-right a:hover{color:#FFC93C}
.site-header{border-image:linear-gradient(90deg,#C1121F,#E63946 26%,#FFC93C 50%,#2FBF5E 74%,#0A5C33) 1}
.call-btn{background:var(--grad-warm);color:#fff;box-shadow:0 8px 20px rgba(230,57,70,.45)}
.call-ring{background:#fff}
.call-ring svg{stroke:var(--red)}
.call-txt small{opacity:.85}

/* ---------- HERO: cherry headline, green pill ---------- */
.hero h1 span{color:#FF7A85;text-shadow:0 4px 26px rgba(74,10,16,.7)}
.hero h2{color:#FFD1CE}
.hero-eyebrow{background:var(--grad-cool);color:#fff;box-shadow:0 6px 18px rgba(10,92,51,.5)}
.hero-stats b{color:#FFC93C}                                  /* small yellow */
.slider-dots button.on{background:#FF4D4D}
.hero-scrim{
  background:
    linear-gradient(96deg,rgba(38,6,10,.64) 0%,rgba(38,6,10,.34) 30%,rgba(38,6,10,0) 55%),
    linear-gradient(180deg,rgba(38,6,10,.42) 0%,rgba(38,6,10,0) 30%,rgba(74,10,16,.66) 100%);
}

/* ---------- 2. ABOUT: cherry ---------- */
.about{
  background:
    radial-gradient(rgba(230,57,70,.06) 1px,transparent 1px) 0 0/28px 28px,
    radial-gradient(680px 440px at 2% 4%,rgba(230,57,70,.16),transparent 62%),
    radial-gradient(640px 420px at 98% 96%,rgba(47,191,94,.14),transparent 62%),
    linear-gradient(180deg,#fff 0%,#FFF6F6 100%);
}
.about-deco-1{stroke:#E63946}
.about-deco-2{stroke:#2FBF5E}
.about-copy h2 span{color:var(--red)}
.badge-ic{background:var(--grad-warm)}
.badge-ic::after{border-color:var(--red)}
.about-stats b{color:var(--red)}
.eyebrow-line{color:var(--red)}
.eyebrow-line::before{background:var(--grad-cool)}

/* ---------- 3. TRUST BAR: green ---------- */
.trustbar{background:linear-gradient(118deg,#053D22 0%,#0A5C33 32%,#22A055 68%,#2FBF5E 100%)}
.tb-ic{background:linear-gradient(140deg,rgba(255,255,255,.20),rgba(255,201,60,.22))}
.tb-ic > svg{stroke:#FFE08A}
.tb-tick{background:#FFC93C;border-color:#053D22}
.tb-tick svg{stroke:#053D22}

/* ---------- 4. SERVICES: cherry ---------- */
.services{
  background:
    radial-gradient(rgba(230,57,70,.06) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#FFF5F5 0%,#fff 100%);
}
.svc-bg{
  background:
    radial-gradient(760px 420px at 94% -6%,rgba(230,57,70,.18),transparent 62%),
    radial-gradient(700px 440px at -6% 104%,rgba(47,191,94,.14),transparent 60%);
}
.services .section-head h2 span{color:var(--red)}
.svc-emoji{background:var(--grad-warm);box-shadow:0 10px 24px rgba(230,57,70,.45)}
.svc-points svg{stroke:var(--green-mid);background:#E6F7EC}

/* ---------- 5. WHY CHOOSE US: green ---------- */
.why{
  background:
    radial-gradient(rgba(34,160,85,.07) 1px,transparent 1px) 0 0/26px 26px,
    radial-gradient(720px 460px at 100% 0%,rgba(47,191,94,.18),transparent 62%),
    radial-gradient(620px 420px at 0% 100%,rgba(230,57,70,.10),transparent 60%),
    linear-gradient(180deg,#EFFAF2 0%,#E8F6EC 100%);
}
.why-deco-1{stroke:#2FBF5E}
.why-deco-2{stroke:#E63946}
.why-deco-3{stroke:#7DC242}
.why-head h2 span{color:var(--green-dark)}
.why-ic{background:linear-gradient(140deg,#E1F6E7,#CFEFD8)}
.why-ic svg{stroke:var(--green-dark)}
.why-card:hover{border-color:rgba(47,191,94,.6);box-shadow:0 26px 50px rgba(34,160,85,.20)}
.why-card:hover .why-num{color:var(--green-mid)}

/* ---------- 6. FLEET: cherry (navy only on the Call button) ---------- */
.fleet-sec{
  background:
    radial-gradient(rgba(230,57,70,.055) 1px,transparent 1px) 0 0/28px 28px,
    linear-gradient(180deg,#FFF6F5 0%,#fff 100%);
}
.fleet-bg{
  background:
    radial-gradient(720px 400px at 4% 0%,rgba(230,57,70,.16),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(47,191,94,.14),transparent 62%);
}
.fleet-head h2 span{color:var(--red)}
.fleet-media{background:linear-gradient(170deg,#FFFCFC 0%,#FFF1F0 100%)}
.fleet-tag{background:var(--grad-warm);color:#fff;box-shadow:0 6px 14px rgba(230,57,70,.4)}
.fleet-specs svg{stroke:var(--green-mid)}
.fleet-card:hover{border-color:rgba(230,57,70,.55);box-shadow:0 26px 52px rgba(230,57,70,.20)}
.fb-call{background:var(--grad-blue);box-shadow:0 6px 16px rgba(30,58,138,.32)}  /* small navy */
.fp-amount b{color:var(--red)}

/* ---------- 7. SIGHTSEEING: cherry band ---------- */
.sight{
  background:
    radial-gradient(rgba(230,57,70,.05) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#fff 0%,#FFF6F6 100%);
}
.sight-head h2 span{color:var(--red)}
.ss-name::before,.ss-hover h4::after{background:var(--grad-warm)}
.ss-band{background:linear-gradient(115deg,#38070D 0%,#A80F1B 34%,#E63946 72%,#FF6B5A 100%)}
.ss-band-glow{background:radial-gradient(circle,rgba(255,201,60,.26),transparent 68%)}
.ssp-meta{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.3);color:#FFD9D5}
.ssp-card:hover{border-color:rgba(255,201,60,.55)}
.ss-cta-link{background:#fff;color:var(--red-deep);box-shadow:0 12px 30px rgba(38,6,10,.4)}
.ss-cta-link svg{stroke:var(--red-deep)}

/* ---------- 8. ROUTES: green ---------- */
.routes{
  background:
    radial-gradient(rgba(34,160,85,.06) 1px,transparent 1px) 0 0/28px 28px,
    radial-gradient(700px 400px at 4% 0%,rgba(47,191,94,.18),transparent 60%),
    radial-gradient(700px 420px at 98% 100%,rgba(230,57,70,.12),transparent 62%),
    linear-gradient(180deg,#EFFAF2 0%,#F7FCF8 100%);
}
.routes-bg{background:none}
.routes-head h2 span{color:var(--green-dark)}
.rp-from{background:var(--green-mid);box-shadow:0 0 0 3.5px rgba(34,160,85,.20)}
.rp-to svg{stroke:var(--red)}
.rp-line::after{background:linear-gradient(90deg,transparent,var(--green-bright),transparent)}
.route-card:hover{border-color:rgba(47,191,94,.6);box-shadow:0 24px 46px rgba(34,160,85,.20)}
.route-meta svg{stroke:var(--green-mid)}
.route-price b{color:var(--red)}

/* ---------- 9. HOW IT WORKS: deep cherry band ---------- */
.how{background:linear-gradient(122deg,#2E060B 0%,#7A0C15 32%,#C1121F 66%,#E63946 100%)}
.how-glow{background:radial-gradient(circle,rgba(255,201,60,.22),transparent 68%)}
.how-deco-1{stroke:#FFC93C}
.how-deco-2{stroke:#2FBF5E}
.how-line{background:repeating-linear-gradient(90deg,rgba(255,255,255,.55) 0 8px,transparent 8px 16px)}
.how-badge{background:#fff;color:var(--red-deep);box-shadow:0 8px 18px rgba(38,6,10,.45)}
.how-ic{background:linear-gradient(140deg,rgba(255,255,255,.20),rgba(47,191,94,.26))}
.how-ic svg{stroke:#FFD9D5}
.how-ic::after{border-color:rgba(255,255,255,.42)}
.how-card:hover .how-ic::after{border-color:#FFC93C}
.how-card:hover{border-color:rgba(255,201,60,.55)}
.how .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(47,191,94,.24),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(255,201,60,.22),transparent 64%);
}

/* ---------- 10. REVIEWS: green ---------- */
.reviews{
  background:
    radial-gradient(rgba(34,160,85,.055) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#F2FBF5 0%,#fff 100%);
}
.reviews-bg{
  background:
    radial-gradient(760px 440px at 100% 0%,rgba(47,191,94,.18),transparent 62%),
    radial-gradient(620px 400px at 0% 100%,rgba(230,57,70,.12),transparent 60%);
}
.rv-side h2 span{color:var(--green-dark)}
.rv-score-num{color:var(--green-dark)}
.rv-avatar{background:var(--grad-cool)}
.rv-write{background:var(--grad-warm);color:#fff;box-shadow:0 12px 28px rgba(230,57,70,.45)}
.rv-write svg{stroke:#fff}
.rv-all{color:var(--green-dark)}
.rv-all:hover{border-color:var(--green-mid);background:#EBF9F0}
.rv-card:hover{border-color:rgba(47,191,94,.55);box-shadow:0 22px 42px rgba(34,160,85,.18)}

/* ---------- 11. COVERAGE: cherry ---------- */
.coverage{
  background:
    radial-gradient(rgba(230,57,70,.055) 1px,transparent 1px) 0 0/26px 26px,
    radial-gradient(680px 420px at 100% 100%,rgba(47,191,94,.12),transparent 60%),
    linear-gradient(180deg,#fff 0%,#FFF4F4 100%);
}
.cov-copy h2 span{color:var(--red)}
.cov-copy a{color:var(--red);border-bottom-color:rgba(230,57,70,.32)}
.cov-copy a:hover{color:var(--green-dark);border-color:var(--green-mid)}
.cov-chips li{background:#FFF6F6;border-color:#FBDCDC}
.cov-chips li:hover{background:var(--grad-warm);border-color:transparent;color:#fff}
.cov-chips svg{stroke:var(--red)}
.cov-chips li:hover svg{stroke:#fff}
.cov-areas{border-color:#F7DEDE;box-shadow:0 10px 30px rgba(230,57,70,.12)}

/* ---------- 12. FAQ: green ---------- */
.faq{
  background:
    radial-gradient(rgba(34,160,85,.05) 1px,transparent 1px) 0 0/30px 30px,
    linear-gradient(180deg,#fff 0%,#F4FBF6 100%);
}
.faq-head h2 span{color:var(--green-dark)}
.faq-item[open]{border-color:rgba(47,191,94,.6);box-shadow:0 14px 34px rgba(34,160,85,.14)}
.faq-plus{background:#E4F6EA}
.faq-plus::before,.faq-plus::after{background:var(--green-dark)}
.faq-item[open] .faq-plus{background:var(--green-dark)}
.faq-item[open] .faq-plus::before,.faq-item[open] .faq-plus::after{background:#fff}
.faq-item summary:hover{background:#F4FBF6;color:var(--green-dark)}

/* ---------- 13. FINAL CTA: full cherry ---------- */
.finalcta{background:linear-gradient(125deg,#38070D 0%,#A80F1B 32%,#E63946 66%,#FF6B5A 100%)}
.fc-eyebrow{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.34);color:#FFE3E0}
.finalcta h2 span{color:#FFC93C}                              /* small yellow */
.fc-book{background:#fff;color:var(--red-deep);box-shadow:0 12px 30px rgba(38,6,10,.4)}
.fc-book svg{stroke:var(--red-deep)}
.fc-call{background:var(--grad-cool);color:#fff;box-shadow:0 12px 30px rgba(10,92,51,.45)}
.fc-call svg{stroke:#fff}
.fc-deco{stroke:#FFC93C}

/* ---------- LINK STRIP + FOOTER: deep cherry ---------- */
.linkstrip{background:linear-gradient(180deg,#FFF4F4 0%,#FDECEC 100%);border-top:1px solid rgba(230,57,70,.16)}
.linkstrip h3{color:var(--red-deep)}
.linkstrip a{color:var(--red);border-bottom-color:rgba(230,57,70,.32)}
.linkstrip a:hover{color:var(--green-dark);border-color:var(--green-mid);background:rgba(47,191,94,.10)}

.footer{background:linear-gradient(160deg,#2E060B 0%,#5C0D14 55%,#8C121D 100%)}
.footer::before{background:radial-gradient(circle,rgba(47,191,94,.16),transparent 68%)}
.f-col h4::after{background:var(--grad-cool)}
.f-col a:hover,.f-contact a:hover{color:#FFC93C}
.f-contact svg{stroke:#FFC93C}
.f-social a:hover{background:var(--grad-cool)}
.f-social a:hover svg{fill:#fff}

/* ---------- section top rule: cherry → green ---------- */
.services::before,.why::before,.fleet-sec::before,.routes::before,
.reviews::before,.coverage::before,.faq::before{
  background:linear-gradient(90deg,
    rgba(193,18,31,0) 0%, #C1121F 15%, #E63946 32%,
    #FFC93C 50%, #2FBF5E 68%, #0A5C33 85%, rgba(10,92,51,0) 100%);
  opacity:.85;height:4px;
}

/* ---------- chatbot: cherry ---------- */
.chat-launch{background:var(--grad-warm);box-shadow:0 12px 30px rgba(230,57,70,.5)}
.chat-head{background:linear-gradient(135deg,#4A0A10 0%,#E63946 100%)}
.chat-avatar{background:var(--grad-cool)}
.chat-avatar svg{stroke:#fff}
.chips button{border-color:var(--green-dark);color:var(--green-dark)}
.chips button:hover{background:var(--green-dark);color:#fff}
.chat-send{background:var(--grad-warm)}
.chat-send svg{stroke:#fff}
.bubble.summary{background:#FFF5F5;border-color:#FBD0D0;color:var(--red-deep)}

/* ---------- inner pages: cherry header ---------- */
.page-header{background:linear-gradient(120deg,#38070D 0%,#A80F1B 55%,#E63946 100%)}
.page-header::before{background:radial-gradient(circle,rgba(47,191,94,.22),transparent 68%)}
.breadcrumb span,.breadcrumb a:hover{color:#FFC93C}
.eyebrow-sm{background:#FFECEC;color:var(--red-deep)}
.card .ic{background:var(--grad-warm)}

/* =====================================================================
   RED · GREEN · WHITE  —  final pass
   Only three colours across the whole site. Red leads, green partners,
   white carries the space. No navy, no yellow anywhere.
   ===================================================================== */

/* ---------- script headings: size & spacing tuning ---------- */
h1,h2{font-family:'Pacifico',cursive;font-weight:400}
.hero h1{font-size:clamp(1.75rem,4vw,3.1rem);line-height:1.24;white-space:normal;letter-spacing:0}
.hero h2{font-family:'Poppins',sans-serif;font-weight:600;letter-spacing:-.01em}
.section-head h2,.about-copy h2,.why-head h2,.fleet-head h2,.sight-head h2,
.routes-head h2,.how-head h2,.rv-side h2,.cov-copy h2,.faq-head h2,
.finalcta h2,.page-header h1,.booking-head h2{line-height:1.3;letter-spacing:.005em}
.section-head h2,.why-head h2,.fleet-head h2,.sight-head h2,.routes-head h2,
.rv-side h2,.cov-copy h2,.faq-head h2,.about-copy h2{font-size:clamp(1.6rem,3.1vw,2.5rem)}
.how-head h2{font-size:clamp(1.55rem,3vw,2.3rem)}
.finalcta h2{font-size:clamp(1.9rem,4vw,3rem)}
.page-header h1{font-size:clamp(1.6rem,3.4vw,2.4rem)}
/* card / small titles stay in Poppins so they read fast */
.card h3,.svc-body h3,.why-card h3,.fleet-body h3,.route-card h3,.how-card h3,
.tb-item h3,.ssp-card h3,.cov-areas h3,.f-col h4,.ss-hover h4,.linkstrip h3,
.chat-head b,.rv-top b{font-family:'Poppins',sans-serif;font-weight:700}

/* ---------- header ---------- */
.topbar{background:linear-gradient(90deg,#3E0910 0%,#A80F1B 52%,#E63946 100%)}
.tb-badge{background:#fff;color:var(--red-deep)}
.tb-right svg{stroke:#fff}
.tb-right a:hover{color:#FFD9D9}
.site-header{border-image:linear-gradient(90deg,#C1121F,#E63946 30%,#fff 50%,#2FBF5E 70%,#0A5C33) 1}
.call-btn{background:var(--grad-warm);color:#fff;box-shadow:0 8px 20px rgba(230,57,70,.42)}
.call-ring{background:#fff}
.call-ring svg{stroke:var(--red)}
.menu > li > a::after{background:var(--grad-warm)}

/* ---------- hero ---------- */
.hero h1 span{color:#FF8A8A;text-shadow:0 4px 26px rgba(62,9,16,.7)}
.hero h2{color:#FFDCDA}
.hero-eyebrow{background:var(--grad-cool);color:#fff;box-shadow:0 6px 18px rgba(10,92,51,.45)}
.hero-stats b{color:#fff}
.hero-stats small{color:#F3DCDC}
.slider-dots button.on{background:#fff}

/* ---------- about ---------- */
.about-deco-1{stroke:#E63946}
.about-deco-2{stroke:#2FBF5E}
.about-copy h2 span{color:var(--red)}
.badge-ic{background:var(--grad-warm)}
.badge-ic::after{border-color:var(--red)}
.about-stats b{color:var(--red)}
.eyebrow-line{color:var(--red)}
.eyebrow-line::before{background:var(--grad-cool)}

/* ---------- trust bar (green band → white/red accents) ---------- */
.tb-eyebrow{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.36);color:#fff}
.tb-stripes{background-image:repeating-linear-gradient(90deg,#fff 0 42px,transparent 42px 96px)}
.tb-glow{background:radial-gradient(circle,rgba(255,255,255,.20) 0%,transparent 68%)}
.tb-ic{background:linear-gradient(140deg,rgba(255,255,255,.22),rgba(255,255,255,.10))}
.tb-ic > svg{stroke:#fff}
.tb-ic::after{border-color:rgba(255,255,255,.45)}
.tb-item:hover .tb-ic::after{border-color:#fff}
.tb-item:hover{border-color:rgba(255,255,255,.5)}
.tb-item::before{background:linear-gradient(160deg,rgba(255,255,255,.14),transparent 58%)}
.tb-tick{background:#fff;border-color:#0A5C33}
.tb-tick svg{stroke:var(--red)}
.trustbar .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(255,255,255,.18),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(230,57,70,.20),transparent 64%);
}

/* ---------- services ---------- */
.services .section-head h2 span{color:var(--red)}
.svc-emoji{background:var(--grad-warm);box-shadow:0 10px 24px rgba(230,57,70,.42)}
.svc-points svg{stroke:var(--g-mid);background:#E4F7EC}
.svc-more{color:var(--red)}
.svc-btn-enq{background:var(--grad-warm);box-shadow:0 8px 20px rgba(230,57,70,.35)}

/* ---------- fleet (call button now green, not navy) ---------- */
.fleet-head h2 span{color:var(--red)}
.fleet-tag{background:var(--grad-warm);color:#fff;box-shadow:0 6px 14px rgba(230,57,70,.36)}
.fleet-specs svg{stroke:var(--g-mid)}
.fb-call{background:var(--grad-cool);box-shadow:0 6px 16px rgba(10,92,51,.34)}
.fb-enq{background:var(--grad-warm);box-shadow:0 6px 16px rgba(230,57,70,.34)}
.fp-amount b{color:var(--red)}
.fleet-media{background:linear-gradient(170deg,#fff 0%,#FFF2F2 100%)}

/* ---------- sightseeing ---------- */
.ss-name::before,.ss-hover h4::after{background:var(--grad-warm)}
.ss-band-glow{background:radial-gradient(circle,rgba(255,255,255,.22),transparent 68%)}
.ssp-meta{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.34);color:#FFDCDA}
.ssp-card:hover{border-color:rgba(255,255,255,.5)}
.ssp-card::before{background:linear-gradient(160deg,rgba(255,255,255,.14),transparent 60%)}
.ssp-card:hover .ssp-num{color:#fff}
.ssp-view:hover{background:#fff;color:var(--red-deep);border-color:#fff}
.ss-cta-link{background:#fff;color:var(--red-deep);box-shadow:0 12px 30px rgba(62,9,16,.36)}
.ss-cta-link svg{stroke:var(--red-deep)}

/* ---------- routes (green section) ---------- */
.routes-head h2 span{color:var(--g-dark)}
.rp-from{background:var(--g-mid);box-shadow:0 0 0 3.5px rgba(31,168,92,.2)}
.rp-to svg{stroke:var(--red)}
.rp-line::after{background:linear-gradient(90deg,transparent,var(--g-bright),transparent)}
.route-meta svg{stroke:var(--g-mid)}
.route-price b{color:var(--red)}

/* ---------- how it works (deep cherry band) ---------- */
.how-glow{background:radial-gradient(circle,rgba(255,255,255,.18),transparent 68%)}
.how-deco-1{stroke:#fff}
.how-deco-2{stroke:#2FBF5E}
.how-line{background:repeating-linear-gradient(90deg,rgba(255,255,255,.6) 0 8px,transparent 8px 16px)}
.how-badge{background:#fff;color:var(--red-deep);box-shadow:0 8px 18px rgba(62,9,16,.42)}
.how-ic{background:linear-gradient(140deg,rgba(255,255,255,.20),rgba(47,191,94,.24))}
.how-ic svg{stroke:#fff}
.how-ic::after{border-color:rgba(255,255,255,.42)}
.how-card:hover .how-ic::after{border-color:#fff}
.how-card:hover{border-color:rgba(255,255,255,.45)}
.how .brand-wash{
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(47,191,94,.26),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(255,255,255,.16),transparent 64%);
}

/* ---------- reviews ---------- */
.rv-side h2 span{color:var(--g-dark)}
.rv-score-num{color:var(--g-dark)}
.rv-stars svg.on,.rv-rating svg.on{fill:var(--red)}
.rv-avatar{background:var(--grad-cool)}
.rv-write{background:var(--grad-warm);color:#fff;box-shadow:0 12px 28px rgba(230,57,70,.42)}
.rv-write svg{stroke:#fff}
.rv-all{color:var(--g-dark)}
.rv-all:hover{border-color:var(--g-mid);background:#EDF9F1}

/* ---------- coverage ---------- */
.cov-copy h2 span{color:var(--red)}
.cov-chips li:hover{background:var(--grad-warm);color:#fff;border-color:transparent}
.cov-chips svg{stroke:var(--red)}
.cov-chips li:hover svg{stroke:#fff}

/* ---------- faq ---------- */
.faq-head h2 span{color:var(--g-dark)}

/* ---------- final CTA ---------- */
.fc-glow{background:radial-gradient(circle,rgba(255,255,255,.20),transparent 66%)}
.fc-eyebrow{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.34);color:#FFDCDA}
.finalcta h2 span{color:#fff}
.fc-book{background:#fff;color:var(--red-deep);box-shadow:0 12px 30px rgba(62,9,16,.36)}
.fc-book svg{stroke:var(--red-deep)}
.fc-call{background:var(--grad-cool);color:#fff;box-shadow:0 12px 30px rgba(10,92,51,.42)}
.fc-call svg{stroke:#fff}
.fc-deco{stroke:#fff}
.fc-note{color:#F0D2D2}

/* ---------- link strip + footer ---------- */
.linkstrip a:hover{color:var(--g-dark);border-color:var(--g-mid);background:rgba(47,191,94,.10)}
.footer::before{background:radial-gradient(circle,rgba(47,191,94,.16),transparent 68%)}
.f-col h4::after{background:var(--grad-cool)}
.f-col a:hover,.f-contact a:hover{color:#FFB3B3}
.f-contact svg{stroke:#FF8A8A}
.f-social a:hover{background:var(--grad-cool)}
.f-social a:hover svg{fill:#fff}
.f-credit a{background:linear-gradient(90deg,#FF8A8A 0%,#2FBF5E 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent}

/* ---------- section top rule ---------- */
.services::before,.why::before,.fleet-sec::before,.routes::before,
.reviews::before,.coverage::before,.faq::before{
  background:linear-gradient(90deg,
    rgba(193,18,31,0) 0%, #C1121F 16%, #E63946 34%,
    #fff 50%, #2FBF5E 66%, #0A5C33 84%, rgba(10,92,51,0) 100%);
  opacity:.9;height:4px;
}

/* ---------- chatbot ---------- */
.chat-head{background:linear-gradient(135deg,#3E0910 0%,#E63946 100%)}
.chat-avatar{background:var(--grad-cool)}
.chat-avatar svg{stroke:#fff}
.chips button{border-color:var(--g-dark);color:var(--g-dark)}
.chips button:hover{background:var(--g-dark);color:#fff}
.chat-send{background:var(--grad-warm)}
.chat-send svg{stroke:#fff}

/* ---------- inner pages ---------- */
.page-header{background:linear-gradient(120deg,#3E0910 0%,#A80F1B 55%,#E63946 100%)}
.page-header::before{background:radial-gradient(circle,rgba(47,191,94,.22),transparent 68%)}
.breadcrumb span,.breadcrumb a:hover{color:#fff}
.eyebrow-sm{background:#FFECEC;color:var(--red-deep)}
.card .ic{background:var(--grad-warm)}

/* =====================================================================
   MOBILE REFINEMENT
   Fluid type, safe tap targets, no sideways scroll, and layouts that
   stack sensibly on small screens.
   ===================================================================== */

/* never allow a stray element to push the page sideways */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video{max-width:100%;height:auto}
.wrap{padding-inline:0}

/* every tappable thing meets the 44px touch target guideline */
@media (max-width:900px){
  .btn,.svc-btn,.fleet-btn,.ssp-btn,.rv-write,.rv-all,.ss-cta-link,
  .fc-btn,.call-btn,.route-wa,.chat-send,.faq-item summary{min-height:44px}
  .menu > li > a{min-height:48px}
  .dropdown a{min-height:44px}
  .f-col a,.f-contact a{padding-block:3px}
}

@media (max-width:768px){
  /* headings: script font needs a little more room to breathe */
  h1,h2{line-height:1.32}
  .section-head,.why-head,.fleet-head,.sight-head,.routes-head,
  .faq-head,.svc-head,.routes-head{margin-bottom:26px}

  /* sections: tighter, even rhythm */
  .about,.services,.why,.fleet-sec,.routes,.reviews,.coverage,.faq{padding:52px 0}
  .trustbar,.how,.finalcta{padding:52px 0 56px}
  .sight{padding:52px 0 0}

  /* about: media above copy, badge tucked in */
  .about-grid{gap:44px}
  .about-media{max-width:360px}
  .about-badge{left:2%;top:6%}
  .about-stats{gap:16px 26px}

  /* trust bar: 2 up */
  .tb-grid{grid-template-columns:repeat(2,1fr);gap:11px}

  /* services / fleet / routes / why: single column reads better */
  .svc-grid,.fleet-grid,.why-grid{grid-template-columns:1fr;gap:16px}
  .routes-grid{grid-template-columns:repeat(2,1fr);gap:12px}

  /* how it works: 2 up, connector hidden */
  .how-grid{grid-template-columns:repeat(2,1fr);gap:30px 14px}
  .how-line{display:none}

  /* reviews stack */
  .reviews-grid{grid-template-columns:1fr;gap:30px}
  .rv-score{gap:14px}

  /* coverage stacks */
  .cov-grid{grid-template-columns:1fr;gap:26px}

  /* sightseeing packages single column */
  .ss-band-grid{grid-template-columns:1fr;gap:12px}
}

@media (max-width:560px){
  .wrap{width:92%}

  /* hero: comfortable on a phone */
  .hero{min-height:auto;padding:44px 0 64px}
  .hero-content{max-width:none}
  .hero h1{font-size:1.72rem;line-height:1.26}
  .hero h2{font-size:1rem}
  .hero p.lede{font-size:13.5px}
  .hero-btns{gap:9px}
  .hero-btns .btn{flex:1 1 100%;justify-content:center;padding:13px 18px}
  .hero-stats{gap:14px 0;margin-top:22px;padding-top:16px}
  .hero-stats li{flex:0 0 50%}
  .hero-stats b{font-size:23px}
  .hero-stats small{font-size:11px}

  /* about */
  .about-media{min-height:300px;max-width:none}
  .about-img-main{width:82%}
  .about-img-sub{width:46%;right:0;bottom:-5%}
  .about-badge{padding:10px 14px 10px 10px}
  .badge-txt > span{font-size:13px}
  .about-stats b{font-size:21px}

  /* trust bar */
  .tb-item{padding:18px 11px 16px}
  .tb-ic{width:46px;height:46px;margin-bottom:10px}
  .tb-ic > svg{width:21px;height:21px}
  .tb-item h3{font-size:12.8px}
  .tb-item p{font-size:11px;line-height:1.55}

  /* services */
  .svc-body{padding:34px 17px 18px}
  .svc-emoji{width:44px;height:44px;font-size:20px;bottom:-20px}
  .svc-actions{gap:8px}
  .svc-btn-enq{font-size:13px;padding:12px 12px}
  .svc-btn-wa{width:46px}

  /* fleet */
  .fleet-media{min-height:auto;padding:18px 14px 8px}
  .fleet-media img,.fleet-illus{max-height:180px}
  .fleet-specs{gap:4px}
  .fleet-specs li{font-size:11px}
  .fleet-specs svg{width:13px;height:13px}
  .fleet-actions{gap:6px}
  .fleet-btn{font-size:12px;padding:12px 6px}
  .fb-wa{width:44px}
  .fp-amount b{font-size:22px}
  .fp-note{font-size:10.5px}

  /* sightseeing marquee */
  .ss-card{width:150px;border-radius:14px}
  .ss-track > .ss-card{margin-right:11px}
  .ss-marquee{margin-bottom:12px}
  .ss-name{font-size:12.5px;padding:11px 10px}
  .ss-name::before{width:18px;margin-bottom:6px}
  .ss-hover{padding:13px 11px}
  .ss-hover h4{font-size:13px}
  .ss-hover p{font-size:10.6px;line-height:1.5}
  .ssp-card{padding:20px 17px 17px}
  .ss-cta-link{width:100%;justify-content:center;font-size:14px}

  /* routes */
  .routes-grid{grid-template-columns:1fr;gap:11px}
  .route-card{padding:17px 15px 14px}
  .route-card h3{font-size:16px}

  /* how it works */
  .how-grid{grid-template-columns:1fr;gap:26px}
  .how-card{padding:26px 18px 20px}

  /* reviews */
  .rv-score-num{font-size:38px}
  .rv-blurb{font-size:13.5px}
  .rv-card{width:236px;padding:17px 15px}
  .rv-card p{font-size:12.3px}
  .rv-actions{gap:9px}
  .rv-write,.rv-all{flex:1 1 100%;justify-content:center}

  /* coverage */
  .cov-copy p{font-size:13.8px}
  .cov-chips{gap:7px}
  .cov-chips li{font-size:12px;padding:8px 12px}

  /* faq */
  .faq-item summary{font-size:13.8px;gap:12px;padding:15px 15px}
  .faq-answer{padding:0 15px 16px}
  .faq-answer p{font-size:13px;line-height:1.8}

  /* final CTA */
  .finalcta h2{font-size:1.85rem}
  .finalcta > .wrap > p{font-size:14px}
  .fc-btns{gap:9px}
  .fc-btn{flex:1 1 100%;justify-content:center;padding:14px 20px}

  /* link strip + footer */
  .linkstrip{padding:30px 0}
  .linkstrip p{font-size:13.5px}
  .footer{padding:44px 0 0}
  .f-bottom{margin-top:34px;padding:18px 0}

  /* floating buttons: keep clear of the thumb zone */
  .wa-float{width:50px;height:50px;right:13px;bottom:76px}
  .chat-launch{width:54px;height:54px;right:13px;bottom:13px}

  /* decorations scale down so they don't dominate small screens */
  .cherry-drop{width:30px}
  .cherry-drop:nth-child(3){width:34px}
  .cherry-drop:nth-child(5){display:none}
  .about-deco,.why-deco,.how-deco,.fc-deco{opacity:.05}
}

/* very small phones */
@media (max-width:380px){
  .hero h1{font-size:1.55rem}
  .tb-grid{grid-template-columns:1fr}
  .ss-card{width:136px}
  .logo-image{height:32px}
  .call-txt b{font-size:12.5px}
  .fleet-btn{font-size:11.5px}
}

/* landscape phones: don't let the hero eat the screen */
@media (max-height:520px) and (orientation:landscape){
  .hero{min-height:auto;padding:38px 0 48px}
}

/* =====================================================================
   HERO CAR
   Sits in the empty right-hand half of the hero. Swap the SVG for a
   transparent PNG by setting src on .hero-car-photo — the illustration
   hides itself automatically once a real image is supplied.
   ===================================================================== */
.hero-car{
  position:absolute;z-index:2;pointer-events:none;
  right:1%;bottom:7%;
  width:min(50%,660px);
  filter:drop-shadow(0 30px 40px rgba(62,9,16,.42));
  animation:heroCarIn 1s cubic-bezier(.2,.8,.3,1) both, carBob 4.5s ease-in-out 1s infinite;
}
@keyframes heroCarIn{from{opacity:0;transform:translateX(60px)}to{opacity:1;transform:none}}
@keyframes carBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

.hero-car-photo,.hero-car-illus{width:100%;height:auto;display:block}
/* hide the placeholder illustration as soon as a real photo is set */
.hero-car-photo[src=""],.hero-car-photo:not([src]){display:none}
.hero-car-photo[src]:not([src=""]) ~ .hero-car-illus{display:none}

/* give the copy room so the car never sits behind the text */
@media (min-width:1100px){
  .hero-content{max-width:600px}
}
@media (max-width:1099px) and (min-width:901px){
  .hero-car{width:46%;right:-2%;bottom:5%;opacity:.9}
  .hero-content{max-width:52%}
}
/* on phones the car would crowd the copy — drop it */
@media (max-width:900px){
  .hero-car{display:none}
}

/* =====================================================================
   FAQ — questions left, tilted photo right with a breakout cut-out
   The frame is turned in 3D space; the traveller sits on a higher
   layer and overflows the frame edge, so it reads as stepping out.
   ===================================================================== */
.faq-grid{
  display:grid;grid-template-columns:1.08fr .92fr;gap:52px;align-items:center;
}
.faq-list{max-width:none}

.faq-visual{
  position:relative;
  aspect-ratio:1/1.02;
  perspective:1400px;
  display:grid;place-items:center;
}

/* red / green diagonal shape behind the frame */
.faq-blob{
  position:absolute;inset:6% 2% 4% 6%;z-index:0;
  background:
    linear-gradient(115deg,#E63946 0%,#E63946 48%,#1FA85C 48%,#1FA85C 100%);
  border-radius:34px;
  clip-path:polygon(0 6%,100% 0,100% 94%,0 100%);
  opacity:.92;
  animation:blobTilt 9s ease-in-out infinite alternate;
}
@keyframes blobTilt{
  from{transform:rotate(-3deg) scale(1)}
  to{transform:rotate(1.5deg) scale(1.03)}
}

/* the tilted photo */
.faq-frame{
  position:relative;z-index:1;
  width:82%;aspect-ratio:4/5;
  border-radius:24px;overflow:hidden;
  background:#fff;padding:0;
  border:8px solid #fff;
  box-shadow:0 40px 70px rgba(62,9,16,.34);
  transform:perspective(1400px) rotateY(-16deg) rotateX(3deg) rotate(-3deg);
  transform-origin:center right;
  transition:transform .6s cubic-bezier(.2,.8,.3,1);
  margin-right:8%;
}
.faq-frame img{width:100%;height:100%;object-fit:cover;display:block;border-radius:16px}
.faq-visual:hover .faq-frame{transform:perspective(1400px) rotateY(-10deg) rotateX(1deg) rotate(-1.5deg)}

/* the cut-out that breaks out of the frame */
.faq-cutout{
  position:absolute;z-index:2;
  right:-2%;bottom:-3%;
  width:56%;
  filter:drop-shadow(-14px 26px 30px rgba(62,9,16,.4));
  animation:cutoutIn 1s cubic-bezier(.2,.8,.3,1) both,
            cutoutBob 5s ease-in-out 1s infinite;
}
@keyframes cutoutIn{from{opacity:0;transform:translate(30px,26px) scale(.94)}to{opacity:1;transform:none}}
@keyframes cutoutBob{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}

.faq-cutout img,.faq-cutout svg{width:100%;height:auto;display:block}
.faq-cutout-photo[src=""],.faq-cutout-photo:not([src]){display:none}
.faq-cutout-photo[src]:not([src=""]) ~ .faq-cutout-illus{display:none}

/* ---- responsive ---- */
@media (max-width:1080px){
  .faq-grid{grid-template-columns:1fr;gap:40px}
  .faq-visual{order:-1;max-width:460px;margin-inline:auto;width:100%}
}
@media (max-width:560px){
  .faq-visual{max-width:330px;aspect-ratio:1/1.05}
  .faq-frame{
    width:86%;margin-right:6%;
    transform:perspective(1000px) rotateY(-11deg) rotate(-2.5deg);
    border-width:6px;border-radius:18px;
    box-shadow:0 24px 44px rgba(62,9,16,.3);
  }
  .faq-cutout{width:58%;right:-4%;bottom:-2%}
  .faq-blob{border-radius:24px}
}
@media (prefers-reduced-motion:reduce){
  .faq-blob,.faq-cutout{animation:none}
  .faq-frame{transform:rotate(-2deg)}
}

/* =====================================================================
   HERO CAR — tilted 3D presentation
   The car is turned in 3D space and lifted at one corner so it reads
   as coming out of the page, rather than sitting flat on it.
   ===================================================================== */
.hero-car{
  right:0;bottom:9%;
  width:min(52%,700px);
  perspective:1500px;
  filter:none;                       /* shadow moves onto the inner layer */
  animation:heroCarIn 1.1s cubic-bezier(.2,.8,.3,1) both;
}
.hero-car-photo,.hero-car-illus{
  transform:rotateY(-19deg) rotateX(6deg) rotate(-6deg) scale(1.02);
  transform-origin:60% 70%;
  filter:drop-shadow(-18px 34px 34px rgba(62,9,16,.5));
  transition:transform .7s cubic-bezier(.2,.8,.3,1);
  animation:carBob 5s ease-in-out 1.1s infinite;
}
@keyframes heroCarIn{
  from{opacity:0;transform:translateX(70px)}
  to{opacity:1;transform:none}
}
@keyframes carBob{
  0%,100%{transform:rotateY(-19deg) rotateX(6deg) rotate(-6deg) scale(1.02) translateY(0)}
  50%    {transform:rotateY(-19deg) rotateX(6deg) rotate(-6deg) scale(1.02) translateY(-14px)}
}
/* straighten slightly on hover — feels like it turns toward you */
.hero:hover .hero-car-photo,
.hero:hover .hero-car-illus{
  transform:rotateY(-11deg) rotateX(3deg) rotate(-3deg) scale(1.05);
  animation-play-state:paused;
}

@media (max-width:1099px) and (min-width:901px){
  .hero-car{width:48%;right:-3%;bottom:7%}
}
@media (prefers-reduced-motion:reduce){
  .hero-car-photo,.hero-car-illus{animation:none;transform:rotate(-4deg)}
}

/* =====================================================================
   HERO CAR — real photo
   The photo already carries its own 3/4 perspective, so the 3D turn is
   dialled right back: just a gentle lift and float, no skewing.
   ===================================================================== */
.hero-car{
  right:-1%;bottom:6%;
  width:min(56%,760px);
  perspective:none;
}
.hero-car picture{display:block}
.hero-car-photo{
  width:100%;height:auto;display:block;
  transform:rotate(-2.5deg);
  transform-origin:60% 70%;
  filter:drop-shadow(-10px 30px 26px rgba(62,9,16,.42));
  transition:transform .7s cubic-bezier(.2,.8,.3,1);
  animation:carBobPhoto 5.5s ease-in-out 1.1s infinite;
}
@keyframes carBobPhoto{
  0%,100%{transform:rotate(-2.5deg) translateY(0)}
  50%    {transform:rotate(-2.5deg) translateY(-13px)}
}
.hero:hover .hero-car-photo{
  transform:rotate(-1deg) scale(1.03);
  animation-play-state:paused;
}

/* give the headline room beside the wider car */
@media (min-width:1200px){ .hero-content{max-width:560px} }
@media (max-width:1199px) and (min-width:1000px){
  .hero-car{width:52%;right:-3%;bottom:5%}
  .hero-content{max-width:48%}
}
@media (max-width:999px) and (min-width:901px){
  .hero-car{width:50%;right:-5%;bottom:4%;opacity:.92}
  .hero-content{max-width:52%}
}
@media (prefers-reduced-motion:reduce){
  .hero-car-photo{animation:none;transform:rotate(-2deg)}
}

/* =====================================================================
   SCROLL RHYTHM  —  calmer, cleaner, better vibe
   The page had too much going on at once: every light section carried
   a dot texture, two colour washes, a tinted gradient AND a rainbow
   rule, and five heavy dark bands. Scrolling felt busy and muddy.
   This pass strips the noise, gives each section one clean surface,
   and keeps only three dark moments as punctuation.
   ===================================================================== */

/* ---------- 1. kill the visual noise ---------- */
.services::before,.why::before,.fleet-sec::before,.routes::before,
.reviews::before,.coverage::before,.faq::before{display:none}
.svc-bg,.fleet-bg,.routes-bg,.reviews-bg{background:none}

/* ---------- 2. bigger logo ---------- */
.logo-image{height:64px}
.site-header.scrolled .logo-image{height:52px}
.logo{gap:0}
.f-logo img{height:78px}
@media (max-width:900px){
  .logo-image{height:52px}
  .site-header.scrolled .logo-image{height:44px}
}
@media (max-width:620px){
  .logo-image{height:44px}
  .site-header.scrolled .logo-image{height:38px}
  .f-logo img{height:56px}
}

/* ---------- 3. one clean surface per section ---------- */
.about      {background:#fff}
.trustbar   {background:linear-gradient(180deg,#FFF6F4 0%,#fff 100%)}
.services   {background:#FCFAF9}
.why        {background:#F4FBF6}
.fleet-sec  {background:#fff}
.sight      {background:#FCFAF9}
.routes     {background:#F4FBF6}
.reviews    {background:#fff}
.coverage   {background:#FFF8F6}
.faq        {background:#fff}
.linkstrip  {background:#F6F8F7;border-top:1px solid #ECE6E4}

/* one soft accent glow each — interest without clutter */
.about::after,.services::after,.why::after,.fleet-sec::after,
.routes::after,.reviews::after,.coverage::after,.faq::after{
  content:"";position:absolute;inset:0;pointer-events:none;z-index:0;
}
.about::after   {background:radial-gradient(620px 380px at 96% 8%,rgba(230,57,70,.07),transparent 62%)}
.services::after{background:radial-gradient(640px 400px at 4% 6%,rgba(230,57,70,.07),transparent 62%)}
.why::after     {background:radial-gradient(660px 400px at 96% 6%,rgba(31,168,92,.09),transparent 62%)}
.fleet-sec::after{background:radial-gradient(640px 400px at 6% 8%,rgba(31,168,92,.07),transparent 62%)}
.routes::after  {background:radial-gradient(660px 400px at 94% 8%,rgba(31,168,92,.09),transparent 62%)}
.reviews::after {background:radial-gradient(640px 400px at 4% 8%,rgba(31,168,92,.07),transparent 62%)}
.coverage::after{background:radial-gradient(640px 400px at 96% 10%,rgba(230,57,70,.07),transparent 62%)}
.faq::after     {background:radial-gradient(640px 400px at 4% 8%,rgba(230,57,70,.06),transparent 62%)}

/* ---------- 4. more air between sections ---------- */
.about,.services,.why,.fleet-sec,.routes,.reviews,.coverage,.faq{padding:96px 0}
.sight{padding:96px 0 0}
.trustbar{padding:72px 0 76px}
.how,.finalcta{padding:92px 0 96px}
.section-head,.about-copy,.why-head,.fleet-head,.sight-head,
.routes-head,.faq-head,.svc-head{margin-bottom:48px}

/* ---------- 5. softer, more consistent shadows ---------- */
.card,.svc-card,.fleet-card,.why-card,.route-card,.rv-card,.cov-areas{
  box-shadow:0 4px 16px rgba(62,9,16,.05);
}
.card:hover,.svc-card:hover,.fleet-card:hover,.why-card:hover,
.route-card:hover,.rv-card:hover{
  box-shadow:0 18px 38px rgba(62,9,16,.13);
  transform:translateY(-6px);
}
.card,.svc-card,.fleet-card,.why-card,.route-card,.rv-card{border-color:#F0E7E5}

/* =====================================================================
   TRUST BAR — now light
   Two dark blocks straight after the hero made the top of the page feel
   heavy. This one becomes light and airy; the icons carry the colour.
   ===================================================================== */
.trustbar .tb-glow,.trustbar .tb-stripes,.trustbar .brand-wash{display:none}
.tb-head h2{color:var(--ink)}
.tb-head p{color:var(--muted)}
.tb-eyebrow{background:#FFECEC;border:1px solid #FBD5D5;color:var(--red-deep)}
.tb-item{
  background:#fff;border:1px solid #F0E7E5;
  box-shadow:0 4px 16px rgba(62,9,16,.05);backdrop-filter:none;
}
.tb-item::before{background:linear-gradient(160deg,rgba(230,57,70,.06),transparent 60%)}
.tb-item:hover{
  background:#fff;border-color:rgba(230,57,70,.4);
  box-shadow:0 18px 38px rgba(62,9,16,.13);
}
.tb-item h3{color:var(--navy)}
.tb-item p{color:var(--muted)}
.tb-ic{background:linear-gradient(140deg,#FFECEC,#FFDCDC);border:1px solid #FBD5D5}
.tb-ic > svg{stroke:var(--red)}
.tb-ic::after{border-color:rgba(230,57,70,.35)}
.tb-item:hover .tb-ic::after{border-color:var(--red)}
.tb-item:nth-child(even) .tb-ic{background:linear-gradient(140deg,#E7F7EE,#D6F0E1);border-color:#CBE9D8}
.tb-item:nth-child(even) .tb-ic > svg{stroke:var(--g-dark)}
.tb-item:nth-child(even) .tb-ic::after{border-color:rgba(31,168,92,.35)}
.tb-item:nth-child(even):hover{border-color:rgba(31,168,92,.45)}
.tb-tick{background:var(--g-mid);border-color:#fff}
.tb-tick svg{stroke:#fff}

/* =====================================================================
   DARK MOMENTS — only three, and richer
   Sightseeing band, How It Works and the Final CTA. Deeper, less
   saturated, so they read as premium rather than loud.
   ===================================================================== */
.ss-band{background:linear-gradient(118deg,#4A0A10 0%,#8E1019 45%,#C1121F 100%)}
.ss-band-glow{background:radial-gradient(circle,rgba(255,255,255,.14),transparent 66%)}

.how{background:linear-gradient(122deg,#08331E 0%,#0A5C33 46%,#14834A 100%)}
.how-glow{background:radial-gradient(circle,rgba(255,255,255,.14),transparent 68%)}
.how .brand-wash{opacity:.32}

.finalcta{background:linear-gradient(125deg,#4A0A10 0%,#9E0E19 42%,#E63946 100%)}
.fc-glow{background:radial-gradient(circle,rgba(255,255,255,.16),transparent 66%)}

.footer{background:linear-gradient(165deg,#2E060B 0%,#4A0A10 60%,#6B0F17 100%)}

/* =====================================================================
   TYPE & DETAIL POLISH
   ===================================================================== */
.section-head p,.why-head p,.fleet-head p,.sight-head p,
.routes-head p,.faq-head p,.svc-head p{max-width:56ch;color:var(--muted)}
.eyebrow-line{letter-spacing:.12em;font-size:12px}

/* section headings: red and green alternate, nothing else */
.about-copy h2 span,.services .section-head h2 span,.fleet-head h2 span,
.sight-head h2 span,.cov-copy h2 span{color:var(--red)}
.why-head h2 span,.routes-head h2 span,.rv-side h2 span,
.faq-head h2 span{color:var(--g-dark)}

/* keep content above the glow layer */
.about > .wrap,.services > .wrap,.why > .wrap,.fleet-sec > .wrap,
.routes > .wrap,.reviews > .wrap,.coverage > .wrap,.faq > .wrap{
  position:relative;z-index:1;
}

@media (max-width:768px){
  .about,.services,.why,.fleet-sec,.routes,.reviews,.coverage,.faq{padding:60px 0}
  .sight{padding:60px 0 0}
  .trustbar,.how,.finalcta{padding:56px 0 60px}
  .section-head,.about-copy,.why-head,.fleet-head,.sight-head,
  .routes-head,.faq-head,.svc-head{margin-bottom:32px}
}

/* =====================================================================
   LOGO — larger and clearly legible
   The logo lockup is nearly square (cherries + script + tagline), so it
   needs real height to read. Header padding tightens to compensate.
   ===================================================================== */
.logo-image{height:86px}
.site-header.scrolled .logo-image{height:66px}
.nav{padding:10px 0}
.site-header.scrolled .nav{padding:6px 0}

@media (max-width:1180px){
  .logo-image{height:74px}
  .site-header.scrolled .logo-image{height:58px}
}
@media (max-width:900px){
  .logo-image{height:64px}
  .site-header.scrolled .logo-image{height:54px}
}
@media (max-width:620px){
  .logo-image{height:54px}
  .site-header.scrolled .logo-image{height:46px}
}
@media (max-width:380px){
  .logo-image{height:46px}
  .site-header.scrolled .logo-image{height:40px}
}

/* =====================================================================
   TRUST BAR — red gradient, matching the Final CTA
   ===================================================================== */
.trustbar{
  background:linear-gradient(125deg,#4A0A10 0%,#9E0E19 42%,#E63946 100%);
  position:relative;overflow:hidden;
}
/* bring the decorative layers back for this band */
.trustbar .tb-glow{
  display:block;
  background:radial-gradient(circle,rgba(255,255,255,.16),transparent 66%);
}
.trustbar .tb-stripes{
  display:block;opacity:.12;
  background-image:repeating-linear-gradient(90deg,#fff 0 42px,transparent 42px 96px);
}
.trustbar .brand-wash{
  display:block;opacity:.36;
  background:
    radial-gradient(420px 300px at 12% 20%,rgba(31,168,92,.30),transparent 62%),
    radial-gradient(460px 320px at 88% 78%,rgba(255,255,255,.16),transparent 64%);
}

/* headings and copy on the dark band */
.tb-head h2{color:#fff}
.tb-head p{color:#F5D7D5}
.tb-eyebrow{
  background:rgba(255,255,255,.16);
  border:1px solid rgba(255,255,255,.34);
  color:#FFE3E0;
}

/* cards go back to glass */
.tb-item{
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.16);
  backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);
  box-shadow:none;
}
.tb-item::before{background:linear-gradient(160deg,rgba(255,255,255,.14),transparent 58%)}
.tb-item:hover{
  background:rgba(255,255,255,.14);
  border-color:rgba(255,255,255,.46);
  box-shadow:0 22px 44px rgba(35,4,8,.42);
}
.tb-item h3{color:#fff}
.tb-item p{color:#F2CFCC}

/* icons: white on glass, with a green tick badge for contrast */
.tb-ic,
.tb-item:nth-child(even) .tb-ic{
  background:linear-gradient(140deg,rgba(255,255,255,.22),rgba(255,255,255,.10));
  border:1px solid rgba(255,255,255,.28);
}
.tb-ic > svg,
.tb-item:nth-child(even) .tb-ic > svg{stroke:#fff}
.tb-ic::after,
.tb-item:nth-child(even) .tb-ic::after{border-color:rgba(255,255,255,.42)}
.tb-item:hover .tb-ic::after,
.tb-item:nth-child(even):hover .tb-ic::after{border-color:#fff}
.tb-item:nth-child(even):hover{border-color:rgba(255,255,255,.46)}

.tb-tick{background:var(--g-mid);border-color:#4A0A10}
.tb-tick svg{stroke:#fff}