/*
Theme Name: Kodo Tours
Theme URI: https://kodotours.com/
Author: ORAVS Creative Solution
Description: Custom theme for Kodo Tours, Tanzania. Works with the Kodo Manager plugin.
Version: 1.3.3
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: kodo
*/

/* Layout: reference structure (top bar, centred logo, photo collage hero, search card, carousel, dark slider, big itinerary band, three columns, round image about, guides grid, black footer) with Kodo content and palette */
:root{
  color-scheme:light;
  --canvas:#F8F9FA; --white:#FFFFFF; --ink:#1A1A1A; --ink-2:#212529; --muted:#5F6368; --line:#E6E7E9; --grey:#F2F2F2;
  --orange:#FF5722; --orange-dk:#E64A19; --gold:#FFC107; --gold-dk:#F57C00; --sky:#E3F2FD; --sky-dk:#0288D1;
  --f-body:"Poppins",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --f-display:"Syne","Poppins",system-ui,sans-serif;
  --f-script:"Reenie Beanie","Bradley Hand","Segoe Print",cursive;
  --wrap:1240px; --r:8px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--canvas);color:var(--ink);font-family:var(--f-body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;padding-bottom:0}

img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4{margin:0;font-weight:700;line-height:1.2;text-wrap:balance}
p{margin:0}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.script{font-family:var(--f-script);color:var(--orange-dk);font-size:30px;line-height:1;font-weight:400}
.h2{font-size:clamp(28px,4vw,44px);font-weight:700;letter-spacing:-.01em}
.lead{color:var(--muted);font-size:16px;line-height:1.75;max-width:620px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;background:var(--orange-dk);color:#fff;font-weight:700;font-size:14px;padding:14px 28px;border-radius:5px;border:0;cursor:pointer;transition:background .2s;letter-spacing:.02em;font-family:var(--f-body)}
.btn:hover{background:var(--ink)}
.btn.dark{background:var(--ink)}.btn.dark:hover{background:var(--orange-dk)}
.btn.ghost{background:transparent;border:2px solid currentColor;color:var(--ink)}
.btn:focus-visible,a:focus-visible,button:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid var(--gold);outline-offset:2px}

/* top bar */
.topbar{background:#000;color:#fff;font-size:13px}
.topbar .wrap{display:flex;justify-content:space-between;align-items:center;padding-block:10px;gap:16px}
.topbar ul{list-style:none;display:flex;gap:10px;margin:0;padding:0;flex-wrap:wrap;align-items:center}
.topbar li+li::before{content:"";display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--orange);margin-right:10px;vertical-align:middle}
.topbar .sel{user-select:all}

/* header */
header.site{position:sticky;top:env(safe-area-inset-top,0px);z-index:50;background:var(--white);box-shadow:0 10px 30px rgba(0,0,0,.06)}
<meta name="google-site-verification" content="f7rjvvEUN0E2DzdHmOGpnH3k0FruhafWt3R5cmVw-ZU" />
header.site .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-block:14px;gap:16px}
.nav{display:flex;flex-wrap:wrap;gap:4px 0;font-size:15px}
.nav a{display:inline-flex;align-items:center;padding:2px 0}
.nav a+a::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--orange);margin:0 14px}
.nav a.on,.nav a:hover{color:var(--orange-dk)}
.logo img{height:58px;width:auto}
.hright{display:flex;justify-content:flex-end;align-items:center;gap:18px}
.burger{background:none;border:0;cursor:pointer;padding:8px;display:grid;gap:5px}
.burger span{width:24px;height:3px;background:var(--ink);border-radius:2px;display:block}
.drawer{position:fixed;inset:0;z-index:80;background:rgba(0,0,0,.5);display:flex;justify-content:flex-end}
.drawer nav{background:var(--white);width:min(360px,88vw);height:100%;padding:28px max(24px,env(safe-area-inset-right,0px)) 28px 28px;display:flex;flex-direction:column;gap:6px;overflow:auto}
.drawer nav a{font-size:18px;font-weight:600;padding:10px 0;border-bottom:1px solid var(--line)}
.drawer .close{align-self:flex-end;background:none;border:0;font-size:28px;cursor:pointer;line-height:1}

/* vehicle / dream section */
.dream{position:relative;padding-block:96px 40px;overflow:hidden}
.dream::before{content:"";position:absolute;right:-8%;top:40px;width:62%;height:560px;background-image:radial-gradient(rgba(26,26,26,.16) 1.6px,transparent 1.7px);background-size:12px 12px;-webkit-mask:radial-gradient(ellipse at 50% 50%,#000 35%,transparent 70%);mask:radial-gradient(ellipse at 50% 50%,#000 35%,transparent 70%)}
.dream .wrap.split{position:relative;display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.dream .copy{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.dream ul.facts{list-style:none;padding:0;margin:4px 0 6px;display:grid;gap:10px}
.dream ul.facts li{display:flex;gap:12px;align-items:flex-start}
.tick{flex:none;width:22px;height:22px;border-radius:50%;background:var(--orange);display:grid;place-items:center;margin-top:2px}
.tick svg{width:12px;height:12px}
.vehicle{position:relative}
.vehicle img{width:100%;height:auto;aspect-ratio:942/970;object-fit:cover;border-radius:var(--r);box-shadow:0 30px 60px rgba(0,0,0,.18)}
.vehicle .tag{position:absolute;left:-22px;bottom:34px;background:var(--white);padding:14px 18px;border-radius:6px;box-shadow:0 14px 34px rgba(0,0,0,.15);display:flex;gap:12px;align-items:center;max-width:260px}
.vehicle .tag b{display:block;font-size:14px}
.vehicle .tag span{font-size:12px;color:var(--muted)}
.vehicle .tag i{flex:none;width:40px;height:40px;border-radius:50%;background:var(--gold);display:grid;place-items:center}

/* feature tiles */
.feats{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:72px}
.feat{position:relative;border-radius:var(--r);overflow:hidden;min-height:150px;display:flex;align-items:flex-end;padding:22px;color:#fff;isolation:isolate}
.feat img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.feat::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.05),rgba(0,0,0,.72));z-index:-1}
.feat h3{font-size:20px}
.feat p{font-size:13px;opacity:.9}

/* tour cards */
.tours{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px;padding-bottom:40px}
.card{background:var(--white);border-radius:var(--r);box-shadow:0 18px 40px rgba(0,0,0,.07);overflow:hidden;display:flex;flex-direction:column}
.card .ph{position:relative;aspect-ratio:4/3;overflow:hidden}
.card .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.card:hover .ph img{transform:scale(1.05)}
.badge{position:absolute;right:14px;top:14px;background:var(--gold);color:var(--ink);font-size:11px;font-weight:700;letter-spacing:.06em;padding:5px 10px;border-radius:20px;text-transform:uppercase}
.meta{margin:-28px 22px 0;position:relative;background:var(--white);border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.09);display:flex;justify-content:space-between;align-items:center;padding:12px 16px;font-size:13px;color:var(--muted)}
.meta .dur{display:flex;align-items:center;gap:8px}
.meta .acts{display:flex;gap:12px}
.meta .acts a{color:var(--orange-dk);display:grid;place-items:center}
.card .body{padding:22px 26px 26px;display:flex;flex-direction:column;gap:10px;flex:1}
.card h3{font-size:20px}
.loc{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:14px;padding-bottom:14px;border-bottom:1px solid var(--line)}
.card .body p{color:var(--muted);font-size:14.5px}
.card .foot{margin-top:auto;padding-top:14px;display:flex;justify-content:space-between;align-items:flex-end;gap:12px}
.card .foot small{display:block;color:var(--muted);font-size:12px;text-align:right}
.card .foot strong{font-size:15px}
.card .btn{padding:11px 22px;font-size:13px}

/* search */
.choose{background:var(--grey);padding-block:72px 96px;text-align:center}
.choose .lead{margin:16px auto 0}
.search{margin:40px auto 0;max-width:1100px;background:var(--white);border-radius:10px;box-shadow:0 20px 50px rgba(0,0,0,.08);display:grid;grid-template-columns:1.2fr 1fr 1fr auto;align-items:center;gap:0;padding:14px;text-align:left}
.field{display:flex;align-items:center;gap:14px;padding:6px 22px;border-right:1px solid var(--line);min-width:0}
.field svg{flex:none;width:28px;height:28px;color:var(--orange-dk)}
.field label{display:block;font-weight:700;font-size:15px}
.field input,.field select{border:0;background:transparent;font:inherit;font-size:13px;color:var(--muted);width:100%;padding:2px 0;min-width:0}
.field input:focus,.field select:focus{outline:none;color:var(--ink)}
.search .btn{height:58px;padding:0 54px;margin-left:16px}
.results{max-width:1100px;margin:20px auto 0;text-align:left;display:grid;gap:10px}
.results .row{background:var(--white);border-radius:6px;padding:14px 18px;display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;font-size:14px}
.results .row b{font-size:15px}
.results .pill{font-size:12px;font-weight:600;background:var(--sky);padding:4px 10px;border-radius:20px;white-space:nowrap}
.results .row a{color:var(--orange-dk);font-weight:700;white-space:nowrap}
.results .none{color:var(--muted);text-align:center;padding:10px}

/* destinations carousel */
.dest{padding-block:96px 80px}
.dest .head{display:grid;grid-template-columns:1.2fr 1fr;gap:40px;align-items:end;margin-bottom:44px}
.dest .head .h2{font-size:clamp(30px,4.4vw,52px);margin-top:10px}
.track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 72px)/4);gap:24px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;scrollbar-width:none;padding-bottom:6px}
.track::-webkit-scrollbar{display:none}
.dcard{scroll-snap-align:start;position:relative;border-radius:12px;overflow:hidden;aspect-ratio:3/4;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;align-items:center;text-align:center;padding:26px 18px;isolation:isolate}
.dcard img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2;transition:transform .7s}
.dcard:hover img{transform:scale(1.07)}
.dcard::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,0) 40%,rgba(0,0,0,.78));z-index:-1}
.dcard h3{font-size:22px}
.dcard p{font-size:13px;opacity:.92;margin-top:6px}
.dcard .go{margin-top:14px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;background:var(--orange-dk);padding:8px 14px;border-radius:4px;opacity:0;transform:translateY(8px);transition:.3s}
.dcard:hover .go,.dcard:focus-visible .go{opacity:1;transform:none}
.ctrl{display:flex;gap:12px;justify-content:center;margin-top:32px}
.ctrl button{font:inherit;font-weight:600;font-size:14px;background:var(--white);border:1px solid var(--line);padding:10px 22px;border-radius:30px;cursor:pointer;display:flex;align-items:center;gap:8px}
.ctrl button:hover{border-color:var(--ink)}

/* dark slider section */
.adv{position:relative;color:#fff;isolation:isolate;overflow:hidden}
.adv>.bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.adv::after{content:"";position:absolute;inset:0;background:rgba(10,10,10,.72);z-index:-1}
.adv .wrap{display:grid;grid-template-columns:1fr 1fr;gap:0;align-items:stretch;padding-inline:0;max-width:none}
.slider{position:relative;min-height:600px;overflow:hidden}
.slider figure{margin:0;position:absolute;inset:0;opacity:0;transition:opacity .9s}
.slider figure.on{opacity:1}
.slider img{width:100%;height:100%;object-fit:cover}
.slider figcaption{position:absolute;left:20px;bottom:56px;background:rgba(0,0,0,.55);padding:6px 12px;border-radius:4px;font-size:12px}
.slider .arr{position:absolute;top:50%;transform:translateY(-50%);width:44px;height:44px;border-radius:50%;background:rgba(255,255,255,.92);color:var(--ink);border:0;cursor:pointer;display:grid;place-items:center;z-index:2}
.slider .prev{left:18px}.slider .next{right:18px}
.slider .dots{position:absolute;left:0;right:0;bottom:20px;display:flex;justify-content:center;gap:8px;z-index:2}
.slider .dots button{width:9px;height:9px;border-radius:50%;border:0;background:rgba(255,255,255,.5);padding:0;cursor:pointer}
.slider .dots button.on{background:#fff;width:24px;border-radius:5px}
.adv .copy{padding:80px max(24px,env(safe-area-inset-right,0px)) 80px 64px;display:flex;flex-direction:column;justify-content:center;gap:18px;max-width:640px}
.adv .script{color:#fff;opacity:.9}
.adv .h2{color:#fff}
.adv .copy p{color:rgba(255,255,255,.82)}
.adv ul{list-style:none;padding:0;margin:6px 0 10px;display:grid;gap:12px}
.adv li{display:flex;gap:12px;align-items:flex-start}
.adv li svg{flex:none;margin-top:4px;color:var(--gold)}

/* itinerary band */
.itin{padding-block:96px 0;text-align:center}
.itin .giant{font-size:clamp(36px,7vw,92px);font-weight:800;letter-spacing:-.03em;line-height:1.02}
.itin .sub{color:var(--muted);margin:18px auto 0;max-width:640px}
.band{position:relative;margin-top:56px;height:min(62vw,600px);min-height:360px;overflow:hidden}
.band img{width:100%;height:100%;object-fit:cover}
.band .cap{position:absolute;left:max(16px,env(safe-area-inset-left,0px));bottom:16px;font-size:12px;color:#fff;background:rgba(0,0,0,.45);padding:4px 10px;border-radius:3px}
.route{max-width:var(--wrap);margin:-90px auto 0;position:relative;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
.route ol{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(6,1fr);background:var(--white);border-radius:10px;box-shadow:0 24px 50px rgba(0,0,0,.12);overflow:hidden}
.route li{padding:22px 18px;text-align:left;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
.route li:last-child{border-right:0}
.route .d{font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--orange-dk)}
.route b{font-size:15px;line-height:1.3}
.route span{font-size:12.5px;color:var(--muted);line-height:1.5}
.route-foot{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 28px;align-items:center;margin-top:28px;font-size:14px;color:var(--muted)}

/* reviews */
.rev{position:relative;color:#fff;isolation:isolate;margin-top:96px;padding-block:96px}
.rev>img.bgimg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.rev::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.82),rgba(0,0,0,.45));z-index:-1}
.rev .top{display:grid;grid-template-columns:1fr auto;gap:40px;align-items:center}
.rev .top .h2{color:#fff;font-size:clamp(30px,4.4vw,52px)}
.rev .top p{color:rgba(255,255,255,.85);margin-top:16px;max-width:560px}
.gbadge{width:150px;height:150px;border-radius:50%;background:var(--white);display:grid;place-items:center;box-shadow:0 20px 40px rgba(0,0,0,.3);padding:22px}
.rcards{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:56px}
.rcard{background:var(--orange-dk);border-radius:10px;padding:40px;display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.rcard.alt{background:var(--white);color:var(--ink)}
.rcard h3{font-size:clamp(20px,2.4vw,28px);font-weight:500;line-height:1.35}
.rcard .stars{display:flex;gap:4px;color:var(--gold)}
.rcard .note{font-size:13px;opacity:.85}
.rcard .btn{background:#fff;color:var(--ink)}
.rcard .btn:hover{background:var(--ink);color:#fff}
.rcard.alt .btn{background:var(--orange-dk);color:#fff}

/* three columns */
.ways{padding-block:96px}
.ways .head{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:end;margin-bottom:48px}
.cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;align-items:stretch}
.col{background:var(--white);border-radius:10px;padding:36px 32px;display:flex;flex-direction:column;gap:16px;box-shadow:0 18px 40px rgba(0,0,0,.06);border-top:4px solid transparent}
.col.mid{background:var(--ink);color:#fff;border-top-color:var(--orange)}
.col .k{font-size:13px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--orange-dk)}
.col.mid .k{color:var(--gold)}
.col h3{font-size:30px;font-weight:800;letter-spacing:-.01em}
.col ul{list-style:none;margin:0;padding:0;display:grid;gap:12px;font-size:14.5px}
.col li{display:flex;gap:10px;align-items:flex-start;padding-bottom:12px;border-bottom:1px solid var(--line)}
.col.mid li{border-color:rgba(255,255,255,.14)}
.col li svg{flex:none;margin-top:4px;color:var(--orange)}
.col .btn{margin-top:auto;align-self:flex-start}
.col.mid .btn{background:var(--orange-dk)}
.ways .fine{text-align:center;margin-top:24px;font-size:14px;color:var(--muted)}

/* about */
.about{padding-block:40px 96px;overflow:hidden}
.about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:56px;align-items:center}
.about .copy{display:flex;flex-direction:column;gap:18px;align-items:flex-start}
.about .h2{font-size:clamp(30px,4.4vw,50px)}
.about dl{margin:6px 0;display:grid;gap:0;width:100%}
.about dl div{display:grid;grid-template-columns:150px 1fr;gap:16px;padding:14px 0;border-bottom:2px solid var(--ink)}
.about dt{font-weight:700}
.about dd{margin:0;color:var(--muted);font-size:15px}
.round{position:relative;aspect-ratio:1;border-radius:50%;overflow:hidden;width:min(560px,100%);justify-self:end;box-shadow:0 30px 60px rgba(0,0,0,.15)}
.round img{width:100%;height:100%;object-fit:cover}
.round-wrap{position:relative;display:grid}
.round-wrap .mini{position:absolute;left:0;bottom:6%;width:34%;aspect-ratio:1;border-radius:50%;overflow:hidden;border:8px solid var(--canvas);box-shadow:0 16px 30px rgba(0,0,0,.15)}
.round-wrap .mini img{width:100%;height:100%;object-fit:cover}

/* guides */
.guides{padding-block:0 96px;text-align:center}
.guides .lead{margin:16px auto 0}
.ggrid{display:grid;grid-template-columns:1.05fr 1fr;gap:40px;margin-top:48px;text-align:left}
.gbig .ph{border-radius:12px;overflow:hidden;aspect-ratio:4/3}
.gbig .ph img{width:100%;height:100%;object-fit:cover}
.gtag{display:inline-block;font-size:12px;font-weight:700;padding:4px 10px;border-radius:4px;background:var(--ink);color:#fff;margin:-16px 0 0 20px;position:relative}
.gtag.lt{background:var(--gold);color:var(--ink);margin:0}
.gbig h3{font-size:26px;margin:14px 0 10px}
.gbig p{color:var(--muted);margin-bottom:18px}
.glist{display:grid;gap:22px;align-content:start}
.gitem{display:grid;grid-template-columns:190px 1fr;gap:22px;align-items:center}
.gitem .ph{border-radius:10px;overflow:hidden;aspect-ratio:4/3}
.gitem .ph img{width:100%;height:100%;object-fit:cover}
.gitem h4{font-size:18px;margin:8px 0 6px}
.gitem p{font-size:14px;color:var(--muted)}

/* footer */
footer{background:#000;color:#fff;padding-block:80px 28px}
.fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:40px;align-items:start}
.fbig{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
.fbig img{height:64px;width:auto}
.fbig h2{font-size:clamp(28px,3.6vw,46px);font-weight:700;line-height:1.15}
.fbig .row{display:flex;flex-wrap:wrap;gap:12px}
.fbig .btn.ghost{color:#fff}
footer h4{font-size:18px;margin-bottom:18px}
footer .addr p{color:rgba(255,255,255,.72);font-size:14.5px;line-height:2}
.mailpill{display:inline-block;background:var(--orange-dk);color:#fff;font-weight:600;font-size:14px;padding:9px 18px;border-radius:4px;user-select:all}
.phone{display:block;font-size:26px;font-weight:700;margin-top:18px;user-select:all}
.ftime{font-size:13px;color:rgba(255,255,255,.6);margin-top:8px}
.fbottom{margin-top:64px;padding-top:24px;border-top:1px solid rgba(255,255,255,.12);display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap}
.flinks{display:flex;flex-wrap:wrap;gap:6px 0;font-size:13px;color:rgba(255,255,255,.7)}
.flinks a+a::before{content:"";display:inline-block;width:4px;height:4px;border-radius:50%;background:var(--orange);margin:0 12px;vertical-align:middle}
.thumbs{display:flex;gap:8px}
.thumbs img{width:56px;height:56px;object-fit:cover;border-radius:4px}
.copy-r{font-size:12.5px;color:rgba(255,255,255,.55);margin-top:18px}

/* mobile bar */
.mbar{display:none}

@media (max-width:1100px){
  .nav{display:none}
  header.site .wrap{grid-template-columns:auto 1fr;}
  .logo{justify-self:start}
  .hero .wrap{grid-template-columns:1fr 1fr;min-height:0}
  .hero-copy{grid-column:1/-1;order:-1}
  .collage{height:440px}
  .c-left .big{height:340px}.c-right .big{height:280px}
  .dream .wrap.split,.about .wrap{grid-template-columns:1fr}
  .vehicle{max-width:640px}
  .vehicle .tag{left:12px}
  .round{justify-self:center}
  .track{grid-auto-columns:calc((100% - 24px)/2.3)}
  .route ol{grid-template-columns:repeat(3,1fr)}
  .route li:nth-child(3){border-right:0}
  .route li:nth-child(-n+3){border-bottom:1px solid var(--line)}
  .adv .copy{padding-left:40px}
}
@media (max-width:820px){
  .topbar .wrap{justify-content:center}
  .topbar .r{display:none}
  .hero .wrap{grid-template-columns:1fr;padding-block:40px 48px}
  .c-left{height:360px}
  .c-left .big{width:72%;height:300px}.c-left .small{top:70px;height:170px}
  .c-left .tiny{display:none}
  .c-right{display:none}
  .feats,.tours,.cols{grid-template-columns:1fr}
  .search{grid-template-columns:1fr;padding:8px}
  .field{border-right:0;border-bottom:1px solid var(--line);padding:14px 12px}
  .search .btn{margin:10px 0 0;width:100%}
  .results .row{grid-template-columns:1fr;gap:6px}
  .dest .head,.ways .head,.rev .top{grid-template-columns:1fr;gap:16px}
  .gbadge{width:110px;height:110px}
  .track{grid-auto-columns:78%}
  .adv .wrap{grid-template-columns:1fr}
  .slider{min-height:360px}
  .adv .copy{padding:48px max(16px,env(safe-area-inset-right,0px)) 56px max(16px,env(safe-area-inset-left,0px))}
  .route{margin-top:-40px}
  .route ol{grid-template-columns:1fr 1fr}
  .route li{border-right:1px solid var(--line)!important;border-bottom:1px solid var(--line)}
  .route li:nth-child(2n){border-right:0!important}
  .rcards{grid-template-columns:1fr}
  .rcard{padding:28px}
  .ggrid{grid-template-columns:1fr}
  .gitem{grid-template-columns:120px 1fr;gap:14px}
  .about dl div{grid-template-columns:1fr;gap:4px}
  .fgrid{grid-template-columns:1fr}
  .vehicle .tag{position:static;margin-top:-30px;margin-left:12px;position:relative}
  body{padding-bottom:calc(64px + env(safe-area-inset-bottom,0px))}
  .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:70;background:var(--white);box-shadow:0 -8px 24px rgba(0,0,0,.1);padding:8px max(12px,env(safe-area-inset-right,0px)) calc(8px + env(safe-area-inset-bottom,0px)) max(12px,env(safe-area-inset-left,0px));gap:8px}
  .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;height:48px;border-radius:5px;font-weight:700;font-size:14px}
  .mbar .wa{background:#1A1A1A;color:#fff}
  .mbar .q{background:var(--orange-dk);color:#fff}
  .hright .btn{display:none}
}
@media (prefers-reduced-motion:reduce){
  *{transition:none!important;scroll-behavior:auto!important}
}

/* hero, rebuilt on the reference: three columns, six small sliders that slide sideways at different speeds */
.hero{position:relative;overflow:hidden;background:var(--white)}
.hero::before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(26,26,26,.08) 1.2px,transparent 1.3px);background-size:14px 14px;-webkit-mask:radial-gradient(ellipse at center,#000 25%,transparent 72%);mask:radial-gradient(ellipse at center,#000 25%,transparent 72%)}
.hgrid{position:relative;display:grid;grid-template-columns:1fr 1.1fr 1fr;align-items:center;gap:24px;padding-block:40px 64px}
.hcol{position:relative;height:620px}
.hs{position:absolute;overflow:hidden;background:var(--grey);will-change:transform}
.hs .ht{display:flex;height:100%;transition:transform .5s ease}
.hs img{flex:0 0 100%;width:100%;height:100%;object-fit:cover;transform:scale(1);transition:transform 0s}
.hs img.kb{transform:scale(1.14);transition:transform 4s linear}
.left .s1{left:0;top:50px;width:60%;height:440px}
.left .s2{right:0;top:170px;width:50%;height:230px;z-index:2;border:6px solid var(--white);box-shadow:0 22px 44px rgba(0,0,0,.16)}
.left .s3{left:20%;bottom:0;width:46%;height:180px;z-index:3;border:6px solid var(--white)}
.right .s4{right:0;top:0;width:62%;height:390px}
.right .s5{left:0;top:230px;width:50%;height:250px;z-index:2;border:6px solid var(--white);box-shadow:0 22px 44px rgba(0,0,0,.16)}
.right .s6{right:6%;bottom:10px;width:46%;height:190px;z-index:3;border:6px solid var(--white)}
.hcopy{text-align:center;display:flex;flex-direction:column;align-items:center;gap:20px;position:relative;z-index:4}
.hcopy .script{font-size:34px}
.word{background:#000;color:#fff;font-family:var(--f-display);font-weight:800;font-size:clamp(44px,6vw,84px);line-height:1;padding:14px 26px 18px;letter-spacing:-.02em;margin:0}
.hcopy p{color:var(--muted);max-width:440px}
.hcopy .row{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}
.hcopy .btn.ghost{color:var(--ink);border-width:2px}
@media (max-width:1024px){
 .hgrid{grid-template-columns:1fr;padding-block:36px 40px}
 .hcol.right{display:none}
 .hcol.left{height:280px;order:2}
 .left .s1{width:100%;height:280px;top:0}
 .left .s2,.left .s3{display:none}
}
/* sub-page banner */
.pbanner{position:relative;color:#fff;isolation:isolate;padding-block:96px 72px;overflow:hidden}
.pbanner>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;z-index:-2}
.pbanner::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.78),rgba(0,0,0,.25));z-index:-1}
.crumbs{font-size:13px;color:rgba(255,255,255,.8);margin-bottom:14px}
.crumbs a:hover{text-decoration:underline}
.pbanner h1{font-size:clamp(32px,5vw,58px);font-weight:800;max-width:820px;letter-spacing:-.01em}
.pbanner p{max-width:640px;margin-top:16px;color:rgba(255,255,255,.88);font-size:17px}
.pbanner .row{display:flex;gap:12px;flex-wrap:wrap;margin-top:26px}
.pbanner .btn.ghost{color:#fff}
.kfacts{display:grid;grid-template-columns:repeat(5,1fr);background:var(--white);border-radius:10px;box-shadow:0 20px 50px rgba(0,0,0,.08);margin-top:-40px;position:relative;z-index:2;overflow:hidden}
.kfacts div{padding:22px 20px;border-right:1px solid var(--line)}
.kfacts div:last-child{border-right:0}
.kfacts b{display:block;font-size:22px;font-weight:800}
.kfacts span{font-size:13px;color:var(--muted)}
.sec{padding-block:80px}
.sec.tight{padding-block:56px}
.sec .head{max-width:760px;margin-bottom:36px}
.sec .head .h2{margin-top:8px}
.sec .head p{margin-top:14px}
.tblwrap{overflow-x:auto;background:var(--white);border-radius:10px;box-shadow:0 14px 34px rgba(0,0,0,.06)}
table.cmp{width:100%;border-collapse:collapse;font-size:14px;min-width:860px}
table.cmp th,table.cmp td{padding:14px 16px;text-align:left;border-bottom:1px solid var(--line);vertical-align:top}
table.cmp th{background:var(--ink);color:#fff;font-weight:600;font-size:13px;letter-spacing:.02em}
table.cmp td:first-child{font-weight:700}
table.cmp td:first-child a{color:var(--orange-dk)}
table.cmp tr:last-child td{border-bottom:0}
.lvl{display:inline-block;font-size:12px;font-weight:600;padding:3px 9px;border-radius:20px;background:var(--grey)}
.lvl.lo{background:#E8F5E9}.lvl.md{background:#FFF8E1}.lvl.hi{background:#FDECEA}
.route-sec{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;padding-block:56px;border-top:1px solid var(--line);scroll-margin-top:110px}
.route-sec .ph{border-radius:10px;overflow:hidden;aspect-ratio:4/3;position:sticky;top:120px}
.route-sec .ph img{width:100%;height:100%;object-fit:cover}
.route-sec h2{font-size:clamp(26px,3.2vw,36px)}
.route-sec .nick{color:var(--orange-dk);font-family:var(--f-script);font-size:28px;line-height:1}
.route-sec .intro{color:var(--muted);margin:14px 0 18px}
.specs{display:grid;grid-template-columns:repeat(2,1fr);gap:0;border:1px solid var(--line);border-radius:8px;overflow:hidden;background:var(--white)}
.specs div{padding:12px 14px;border-bottom:1px solid var(--line);font-size:14px}
.specs div:nth-child(odd){border-right:1px solid var(--line)}
.specs dt{font-size:12px;color:var(--muted);text-transform:uppercase;letter-spacing:.06em}
.specs dd{margin:2px 0 0;font-weight:600}
.best{margin:18px 0;padding:14px 16px;background:var(--sky);border-radius:8px;font-size:14.5px}
.days{list-style:none;margin:20px 0 0;padding:0;border-left:2px solid var(--line)}
.days li{position:relative;padding:0 0 20px 22px}
.days li::before{content:"";position:absolute;left:-7px;top:6px;width:12px;height:12px;border-radius:50%;background:var(--white);border:3px solid var(--orange)}
.days .dn{font-size:12px;font-weight:700;color:var(--orange-dk);text-transform:uppercase;letter-spacing:.08em}
.days h3{font-size:16px;margin:2px 0 4px}
.days .alt{font-size:13px;color:var(--ink-2);font-weight:600}
.days p{font-size:14px;color:var(--muted)}
.months{display:grid;grid-template-columns:repeat(12,1fr);gap:6px;margin-top:10px}
.months div{text-align:center;border-radius:6px;padding:14px 4px;font-size:13px;font-weight:600}
.m-good{background:#2E7D32;color:#fff}.m-ok{background:var(--gold)}.m-wet{background:#CFD8DC;color:var(--ink)}
.legend{display:flex;gap:18px;flex-wrap:wrap;font-size:13px;color:var(--muted);margin-top:12px}
.legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px}
.zones{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}
.zones div{background:var(--white);border-radius:8px;padding:18px;border-top:4px solid var(--orange);box-shadow:0 10px 24px rgba(0,0,0,.05)}
.zones b{display:block}
.zones span{display:block;font-size:12.5px;color:var(--orange-dk);font-weight:600;margin:2px 0 6px}
.zones p{font-size:13.5px;color:var(--muted)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.panel{background:var(--white);border-radius:10px;padding:28px;box-shadow:0 14px 34px rgba(0,0,0,.05)}
.panel h3{font-size:20px;margin-bottom:14px}
.panel ul{margin:0;padding-left:18px;display:grid;gap:8px;font-size:14.5px;color:var(--ink-2)}
.panel dl{margin:0;display:grid;gap:12px}
.panel dt{font-weight:700;font-size:14.5px}
.panel dd{margin:2px 0 0;color:var(--muted);font-size:14px}
.faq details{background:var(--white);border-radius:8px;margin-bottom:10px;box-shadow:0 8px 20px rgba(0,0,0,.04)}
.faq summary{cursor:pointer;padding:18px 22px;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:16px}
.faq summary::after{content:"+";color:var(--orange-dk);font-size:22px;line-height:1}
.faq details[open] summary::after{content:"\2212"}
.faq details p{padding:0 22px 20px;color:var(--muted);font-size:15px}
/* route mini cards on home */
.rgrid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.rmini{background:var(--white);border-radius:10px;padding:20px;display:flex;flex-direction:column;gap:6px;box-shadow:0 12px 28px rgba(0,0,0,.05);border-bottom:3px solid transparent;transition:border-color .2s,transform .2s}
.rmini:hover{border-bottom-color:var(--orange);transform:translateY(-3px)}
.rmini b{font-size:17px}
.rmini .k{font-size:12px;color:var(--muted)}
.rmini .tags{display:flex;gap:6px;flex-wrap:wrap;margin-top:6px}
.kili-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:40px;align-items:center;margin-bottom:40px}
.kili-hero .ph{border-radius:12px;overflow:hidden;aspect-ratio:16/10}
.kili-hero .ph img{width:100%;height:100%;object-fit:cover}
/* region tabs */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:28px}
.tabs button{font:inherit;font-weight:600;font-size:14px;padding:10px 20px;border-radius:30px;border:1px solid var(--line);background:var(--white);cursor:pointer}
.tabs button[aria-selected="true"]{background:var(--ink);color:#fff;border-color:var(--ink)}
.tgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.tcard{background:var(--white);border-radius:10px;overflow:hidden;box-shadow:0 14px 34px rgba(0,0,0,.06);display:flex;flex-direction:column;scroll-margin-top:110px}
.tcard .ph{position:relative;aspect-ratio:3/2;overflow:hidden}
.tcard .ph img{width:100%;height:100%;object-fit:cover;transition:transform .6s}
.tcard:hover .ph img{transform:scale(1.05)}
.tcard .dpill{position:absolute;left:14px;bottom:14px;background:var(--white);font-size:12.5px;font-weight:600;padding:6px 12px;border-radius:20px;display:flex;gap:6px;align-items:center}
.tcard .typ{position:absolute;right:14px;top:14px;background:var(--gold);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;padding:5px 10px;border-radius:20px}
.tcard .body{padding:20px 22px 22px;display:flex;flex-direction:column;gap:10px;flex:1}
.tcard h3{font-size:18px;line-height:1.3}.tcard h3 a:hover{color:var(--orange-dk)}.tcard a.ph{display:block}
.tcard .start{font-size:13px;color:var(--muted);display:flex;gap:6px;align-items:center}
.tcard p{font-size:14px;color:var(--muted)}
.tcard ul{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:13.5px}
.tcard li{display:flex;gap:8px}
.tcard li svg{flex:none;margin-top:4px;color:var(--orange)}
.tcard .acts{margin-top:auto;padding-top:12px;display:flex;gap:10px;flex-wrap:wrap}
.tcard .acts .btn{padding:10px 18px;font-size:13px}
.tcard .acts .wa{background:var(--ink)}
.chips{display:flex;gap:8px;flex-wrap:wrap;margin:-8px 0 24px}
.chips button{font:inherit;font-size:13px;font-weight:600;padding:8px 16px;border-radius:30px;border:1px solid var(--line);background:var(--white);cursor:pointer}
.chips button[aria-pressed="true"]{background:var(--orange-dk);border-color:var(--orange-dk);color:#fff}
.region{scroll-margin-top:110px;padding-top:40px}
.region h2{font-size:clamp(24px,3vw,34px);margin-bottom:6px}
.region>p{color:var(--muted);margin-bottom:24px;max-width:720px}
/* enquiry form */
.enq{background:var(--ink);color:#fff;border-radius:14px;padding:44px;display:grid;grid-template-columns:.8fr 1.2fr;gap:44px}
.enq h2{font-size:clamp(26px,3.4vw,40px)}
.enq .side p{color:rgba(255,255,255,.75);margin-top:14px}
.enq .side ul{list-style:none;padding:0;margin:22px 0 0;display:grid;gap:10px;font-size:14.5px}
.enq .side li{display:flex;gap:10px}
.enq .side li svg{color:var(--gold);flex:none;margin-top:5px}
.enq form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.enq .f{display:flex;flex-direction:column;gap:6px;min-width:0}
.enq .f.full{grid-column:1/-1}
.enq label{font-size:13px;font-weight:600}
.enq input,.enq select,.enq textarea{font:inherit;font-size:15px;padding:12px 14px;border-radius:6px;border:1px solid #3a3a3a;background:#262626;color:#fff;width:100%}
.enq textarea{min-height:96px;resize:vertical}
.enq .err{font-size:12.5px;color:#FFB4A2;min-height:0}
.enq .f.bad input,.enq .f.bad select{border-color:#FF8A65}
.enq .send{grid-column:1/-1;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.enq .small{font-size:12.5px;color:rgba(255,255,255,.6)}
.okbox{grid-column:1/-1;background:#262626;border-radius:10px;padding:24px;border-left:4px solid var(--gold)}
.okbox h3{font-size:20px;margin-bottom:8px}
.okbox p{color:rgba(255,255,255,.8);margin-bottom:14px}
@media (max-width:1100px){.rgrid{grid-template-columns:repeat(2,1fr)}.zones{grid-template-columns:repeat(3,1fr)}.kfacts{grid-template-columns:repeat(3,1fr)}.kfacts div:nth-child(3){border-right:0}.kfacts div:nth-child(-n+3){border-bottom:1px solid var(--line)}}
@media (max-width:820px){
 .tgrid,.two,.kili-hero{grid-template-columns:1fr}
 .route-sec{grid-template-columns:1fr;gap:20px}
 .route-sec .ph{position:static}
 .specs{grid-template-columns:1fr}.specs div:nth-child(odd){border-right:0}
 .months{grid-template-columns:repeat(6,1fr)}
 .zones{grid-template-columns:1fr 1fr}
 .kfacts{grid-template-columns:1fr 1fr}.kfacts div{border-right:0!important;border-bottom:1px solid var(--line)}
 .rgrid{grid-template-columns:1fr}
 .enq{grid-template-columns:1fr;padding:26px}
 .enq form{grid-template-columns:1fr}
}

.tp-head{padding-block:28px 10px}
.tp-head .crumbs{color:var(--muted)}
.tp-head .crumbs a{color:var(--ink)}
.tp-head h1{font-size:clamp(28px,4vw,46px);font-weight:800;letter-spacing:-.01em;margin-top:8px}
.tp-meta{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:14px;font-size:14px;color:var(--muted)}
.tp-meta span{display:flex;gap:8px;align-items:center}
.gal{display:grid;grid-template-columns:2fr 1fr 1fr;grid-template-rows:220px 220px;gap:10px;margin-top:22px;border-radius:12px;overflow:hidden}
.gal button{padding:0;border:0;cursor:zoom-in;position:relative;overflow:hidden;background:var(--grey)}
.gal button:first-child{grid-row:1/3}
.gal img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.gal button:hover img{transform:scale(1.04)}
.gal .more{position:absolute;right:10px;bottom:10px;background:rgba(0,0,0,.6);color:#fff;font-size:12px;font-weight:600;padding:6px 10px;border-radius:4px}
.lb{position:fixed;inset:0;z-index:90;background:rgba(0,0,0,.92);display:grid;place-items:center;padding:20px max(16px,env(safe-area-inset-right,0px)) 20px max(16px,env(safe-area-inset-left,0px))}
.lb img{max-height:82vh;max-width:100%;object-fit:contain;border-radius:6px}
.lb .x,.lb .pv,.lb .nx{position:absolute;background:#fff;border:0;border-radius:50%;width:44px;height:44px;font-size:20px;cursor:pointer;display:grid;place-items:center}
.lb .x{top:calc(16px + env(safe-area-inset-top,0px));right:max(16px,env(safe-area-inset-right,0px))}.lb .pv{left:max(16px,env(safe-area-inset-left,0px));top:50%}.lb .nx{right:max(16px,env(safe-area-inset-right,0px));top:50%}
.lb p{color:#fff;font-size:13px;margin-top:10px;text-align:center}
.tp{display:grid;grid-template-columns:1fr 360px;gap:48px;padding-block:40px 40px;align-items:start}
.tp section{padding-bottom:34px;margin-bottom:34px;border-bottom:1px solid var(--line);scroll-margin-top:110px}
.tp h2{font-size:24px;margin-bottom:14px}
.tp .ov{font-size:17px;color:var(--ink-2);line-height:1.75}
.hl{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.hl div{display:flex;gap:10px;background:var(--white);padding:14px;border-radius:8px;font-size:14.5px;font-weight:500}
.hl svg{flex:none;color:var(--orange);margin-top:4px}
.it{list-style:none;margin:0;padding:0;border-left:2px solid var(--line)}
.it li{position:relative;padding:0 0 22px 24px}
.it li::before{content:"";position:absolute;left:-8px;top:4px;width:14px;height:14px;border-radius:50%;background:var(--orange)}
.it .dn{font-size:12px;font-weight:700;color:var(--orange-dk);letter-spacing:.08em;text-transform:uppercase}
.it h3{font-size:17px;margin:2px 0 6px}
.it p{color:var(--muted);font-size:15px}
.it .meal{display:inline-block;margin-top:8px;font-size:12px;font-weight:600;background:var(--sky);padding:3px 9px;border-radius:20px}
.ie{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.ie ul{list-style:none;margin:0;padding:0;display:grid;gap:10px;font-size:14.5px}
.ie li{display:flex;gap:10px}
.ie .yes svg{color:#2E7D32}.ie .no svg{color:#C62828}
.ie h3{font-size:16px;margin-bottom:12px}
.bookbox{position:sticky;top:110px;background:var(--white);border-radius:12px;box-shadow:0 20px 50px rgba(0,0,0,.09);padding:26px;display:flex;flex-direction:column;gap:14px}
.bookbox .q{font-size:13px;color:var(--muted)}
.bookbox dl{margin:0;display:grid;gap:10px;font-size:14px}
.bookbox dl div{display:flex;justify-content:space-between;gap:12px;padding-bottom:10px;border-bottom:1px solid var(--line)}
.bookbox dt{color:var(--muted)}.bookbox dd{margin:0;font-weight:600;text-align:right}
.bookbox .btn{width:100%}
.bookbox .wa2{background:var(--ink)}
.bookbox .note{font-size:12.5px;color:var(--muted);text-align:center}
.styles{display:flex;gap:6px;flex-wrap:wrap}
.styles span{font-size:12px;font-weight:600;background:var(--grey);padding:4px 10px;border-radius:20px}
.tp-mbar{display:none}
@media (max-width:980px){.tp{grid-template-columns:1fr}.bookbox{position:static}}
@media (max-width:820px){
 .gal{grid-template-columns:1fr 1fr;grid-template-rows:240px 120px}
 .gal button:first-child{grid-column:1/3;grid-row:auto}
 .gal button:nth-child(n+4){display:none}
 .hl,.ie{grid-template-columns:1fr}
}

.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice-ok,.notice-err{grid-column:1/-1;border-radius:10px;padding:18px 20px;margin-bottom:6px}
.notice-ok{background:#262626;border-left:4px solid var(--gold)}
.notice-err{background:#3a1d17;border-left:4px solid #FF8A65}
.notice-ok h3{font-size:19px;margin-bottom:6px}.notice-ok p,.notice-err p{color:rgba(255,255,255,.85)}
.enq .kodo-form{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:820px){.enq .kodo-form{grid-template-columns:1fr}}
.page-content{max-width:820px;margin:0 auto;padding-block:56px 80px}
.page-content h1{font-size:clamp(30px,4vw,44px);margin-bottom:20px}
.page-content p,.page-content li{color:var(--ink-2);font-size:16.5px;line-height:1.8}
.page-content h2{font-size:26px;margin:32px 0 12px}
.gr-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.gr-card{background:#fff;color:var(--ink);border-radius:10px;padding:24px;display:flex;flex-direction:column;gap:10px}
.gr-card .who{display:flex;gap:10px;align-items:center;font-weight:600}
.gr-card .who img{width:36px;height:36px;border-radius:50%}
.gr-card .stars{color:var(--gold);display:flex;gap:2px}
.gr-card p{color:var(--muted);font-size:14.5px}
.gr-sum{display:flex;align-items:center;gap:14px;margin-top:18px;font-size:18px}
.gr-sum b{font-size:40px}
@media (max-width:820px){.gr-cards{grid-template-columns:1fr}}
.screen-reader-text{position:absolute!important;clip:rect(1px,1px,1px,1px);width:1px;height:1px;overflow:hidden}
.card a.ph{display:block}

/* forms v2: booking and enquiry */
.enq .side .tourname{color:#fff;font-weight:700;font-size:17px;margin-top:10px;padding-left:12px;border-left:3px solid var(--orange)}
.enq .steps{list-style:none;counter-reset:s;padding:0;margin:24px 0 0;display:grid;gap:14px}
.enq .steps li{counter-increment:s;position:relative;padding-left:40px;font-size:14.5px}
.enq .steps li:before{content:counter(s);position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:50%;border:1.5px solid var(--gold);color:var(--gold);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center}
.enq .steps b{display:block;color:#fff}.enq .steps span{color:rgba(255,255,255,.65);font-size:13.5px}
.enq .kodo-form{display:block}
.enq .kodo-form .grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 16px}
.enq .kodo-form .grid.g3{grid-template-columns:1fr 1fr 1.4fr}
.enq fieldset{border:0;border-top:1px solid #333;margin:0 0 22px;padding:18px 0 0;min-width:0}
.enq fieldset:first-of-type{border-top:0;padding-top:0}
.enq legend{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--gold);padding:0 0 12px;display:flex;align-items:center;gap:10px}
.enq legend span{width:22px;height:22px;border-radius:50%;background:var(--orange-dk);color:#fff;display:inline-flex;align-items:center;justify-content:center;font-size:12px;letter-spacing:0}
.enq .req{color:var(--orange)}
.enq .hint{font-size:12px;color:rgba(255,255,255,.55)}
.enq input:focus,.enq select:focus,.enq textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 2px rgba(255,193,7,.25)}
.enq input[type=date]{color-scheme:dark}
.enq .f.bad textarea{border-color:#FF8A65}
.enq .consent{margin:4px 0 16px}
.enq .check{display:flex;gap:10px;align-items:flex-start;font-weight:400;font-size:14px;color:rgba(255,255,255,.85);cursor:pointer}
.enq .check input{width:18px;height:18px;flex:none;margin-top:2px;accent-color:var(--orange-dk)}
.enq .send .btn{min-width:220px}
.enq .send .btn[disabled]{opacity:.7;cursor:wait}
.enq-enquiry .kodo-form .grid .f:first-child select{font-weight:600}
@media (max-width:820px){.enq .kodo-form .grid,.enq .kodo-form .grid.g3{grid-template-columns:1fr}.enq .send .btn{width:100%}}
.enq .f[hidden]{display:none}
.enq .side .steps li{display:block}
/* header v2: logo always centred */
header.site .wrap{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding-block:12px;gap:20px}
.hleft{display:flex;align-items:center;min-width:0}
.nav{flex-wrap:nowrap;white-space:nowrap;font-size:15px;font-weight:500}
.nav a+a::before{margin:0 12px}
.logo{justify-self:center;display:block;line-height:0}
.logo img{height:62px;width:auto}
.hright{gap:14px}
.burger-m,.hwa{display:none}
.hwa{width:44px;height:44px;border-radius:50%;background:#1FA855;color:#fff;align-items:center;justify-content:center}
@media (max-width:1180px){
  .nav{display:none}
  .burger-m{display:grid;margin-left:-8px}
  .burger-d{display:none}
  header.site .wrap{grid-template-columns:1fr auto 1fr}
  .logo{justify-self:center}
}
@media (max-width:820px){
  header.site .wrap{padding-block:8px;gap:10px}
  .logo img{height:48px}
  .hright .btn{display:none}
  .hwa{display:inline-flex}
}

/* hero on tablets and phones: six sliding photos in a mosaic */
@media (max-width:1024px){
 .hgrid{grid-template-columns:1fr 1fr;gap:10px;padding-block:28px 36px}
 .hcopy{grid-column:1/-1;order:-1;margin-bottom:16px}
 .hcol,.hcol.left,.hcol.right{display:grid;height:auto;order:0;gap:10px;grid-template-columns:1.3fr 1fr;grid-template-rows:170px 170px}
 .hcol .hs{position:relative;left:auto;right:auto;top:auto;bottom:auto;width:auto;height:auto;border:0;box-shadow:none;border-radius:8px;display:block;transform:none}
 .left .s1{grid-column:1;grid-row:1/3}.left .s2{grid-column:2;grid-row:1}.left .s3{grid-column:2;grid-row:2}
 .right .s4{grid-column:2;grid-row:1/3}.right .s5{grid-column:1;grid-row:1}.right .s6{grid-column:1;grid-row:2}
}
@media (max-width:600px){
 .hgrid{gap:8px;padding-block:22px 28px}
 .hcol,.hcol.left,.hcol.right{grid-template-columns:1fr;grid-template-rows:170px 105px 105px;gap:8px}
 .left .s1,.right .s4{grid-column:1;grid-row:1}
 .left .s2,.right .s5{grid-column:1;grid-row:2}
 .left .s3,.right .s6{grid-column:1;grid-row:3}
 .right .s4{grid-row:3}.right .s6{grid-row:1}
 .hcopy .script{font-size:28px}
}
@media (max-width:1024px){.hero .hgrid{grid-template-columns:1fr 1fr}}
@media (max-width:600px){.hero .hgrid{padding-block:22px 28px}.topbar li+li{display:none}.topbar{font-size:12.5px}.topbar .wrap{padding-block:7px}}
/* hero v3 on tablets and phones: heading on top, two equal sliding photo panels side by side */
@media (max-width:1024px){
 .hero .hgrid{grid-template-columns:1fr 1fr;gap:10px;max-width:760px;margin-inline:auto;padding-block:36px 44px}
 .hero .hcopy{grid-column:1/-1;order:-1;margin-bottom:22px}
 .hero .hcol,.hero .hcol.left,.hero .hcol.right{display:block;position:relative;height:260px;order:0}
 .hero .hcol .hs{position:absolute;inset:0;width:auto;height:auto;border:0;box-shadow:none;border-radius:6px;transform:none}
 .hero .hcol .s2,.hero .hcol .s3,.hero .hcol .s5,.hero .hcol .s6{display:none}
}
@media (max-width:560px){
 .hero .hcol,.hero .hcol.left,.hero .hcol.right{height:190px}
 .hero .hgrid{padding-block:24px 30px}
}
/* feature banners v2: brush panel, animated line icons */
.feats{gap:24px}
.feat{display:block;position:relative;height:120px;min-height:0;padding:0;border-radius:15px;overflow:hidden;background:#000 var(--ph) 100% 50%/cover no-repeat;color:#fff;isolation:isolate;transition:transform .3s ease,box-shadow .3s ease}
.feat::after{content:none}
.feat:hover{transform:translateY(-3px);box-shadow:0 16px 34px rgba(0,0,0,.18)}
.feat .brush{position:absolute;left:0;top:0;height:100%;width:56%;fill:var(--orange-dk);z-index:0}
.feat.f2 .brush{fill:var(--ink)}
.feat .ico{position:absolute;left:24px;top:50%;width:58px;height:58px;margin-top:-29px;z-index:1;fill:none;stroke:#fff;stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;overflow:visible}
.feat h3{position:absolute;left:104px;right:14px;top:50%;transform:translateY(-50%);margin:0;font-size:20px;font-weight:700;line-height:1.2;z-index:1;text-shadow:0 2px 10px rgba(0,0,0,.55)}
.feat .ico .d{stroke-dasharray:220;stroke-dashoffset:0;animation:kdraw 7s ease-in-out infinite}
@keyframes kdraw{0%{stroke-dashoffset:220}25%,85%{stroke-dashoffset:0}100%{stroke-dashoffset:0}}
.i-car .wh{animation:kspin 1.2s linear infinite}
.i-car .road{stroke-dasharray:6 8;animation:kroad .7s linear infinite}
.i-car{animation:kbump .6s ease-in-out infinite alternate}
@keyframes kspin{to{transform:rotate(360deg)}}
@keyframes kroad{to{stroke-dashoffset:14}}
@keyframes kbump{to{transform:translateY(-1px)}}
.i-mtn .sun{transform-origin:49px 15px;animation:ksun 9s linear infinite}
.i-mtn .flag{transform-origin:24px 11px;animation:kflag 1.4s ease-in-out infinite alternate}
@keyframes ksun{0%{transform:translateY(5px) rotate(0)}50%{transform:translateY(0) rotate(90deg)}100%{transform:translateY(5px) rotate(180deg)}}
@keyframes kflag{from{transform:skewY(-6deg) scaleX(1)}to{transform:skewY(6deg) scaleX(.86)}}
.i-dhow .boat{transform-origin:32px 46px;animation:kbob 2.6s ease-in-out infinite}
.i-dhow .waves{animation:kwave 2s linear infinite}
@keyframes kbob{0%,100%{transform:translateY(0) rotate(-3deg)}50%{transform:translateY(-2px) rotate(3deg)}}
@keyframes kwave{to{transform:translateX(12px)}}
.feat:hover .ico{filter:drop-shadow(0 0 6px rgba(255,255,255,.45))}
@media (prefers-reduced-motion:reduce){.feat .ico *,.feat .ico{animation:none!important}}
@media (max-width:1100px) and (min-width:821px){.feat h3{font-size:17px;left:92px}.feat .ico{width:50px;height:50px;margin-top:-25px;left:20px}}
@media (max-width:820px){.feats{gap:14px;margin-top:48px}.feat{height:110px}}
/* forms v3: light, elegant card */
.enq{background:#fff;color:var(--ink);padding:0;gap:0;grid-template-columns:.82fr 1.18fr;overflow:hidden;border-radius:18px;box-shadow:0 30px 70px rgba(26,26,26,.12);border:1px solid var(--line)}
.enq>.side{background:linear-gradient(180deg,rgba(17,17,17,.80),rgba(17,17,17,.95)),url(assets/img/kodo-tours-land-cruiser-safari-vehicle.webp) center/cover;color:#fff;padding:46px 40px}
.enq>div:last-child{padding:40px 44px 34px}
.enq label,.enq .lbl{font-size:13.5px;font-weight:600;color:var(--ink);display:block}
.enq .side label{color:#fff}
.enq input,.enq select,.enq textarea{background:#F8F9FA;border:1px solid #E1E3E6;color:var(--ink);border-radius:10px;padding:13px 14px;font-size:15px;transition:border-color .2s,box-shadow .2s,background .2s}
.enq input::placeholder,.enq textarea::placeholder{color:#9AA0A6}
.enq input:focus,.enq select:focus,.enq textarea:focus{background:#fff;border-color:var(--orange-dk);box-shadow:0 0 0 4px rgba(230,74,25,.12)}
.enq input[type=date],.enq input[type=month]{color-scheme:light}
.enq fieldset{border-top:1px dashed #E1E3E6}
.enq legend{color:var(--ink);font-size:12.5px}
.enq .hint{color:var(--muted)}
.enq .err{color:#C62828;font-weight:500}
.enq .f.bad input,.enq .f.bad select,.enq .f.bad textarea{border-color:#E53935;background:#FFF8F7}
.enq .f.bad .kf-choice .opt span{border-color:#F3B4AC}
.enq .check{color:var(--ink);font-size:14px}
.enq .small{color:var(--muted)}
.enq .kodo-form>.grid,.enq .kodo-form fieldset>.grid{margin-bottom:14px}
.enq .kodo-form .f.full{margin-bottom:14px}
.kf-steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin:0 0 26px;padding:0;counter-reset:none}
.kf-steps li{position:relative;display:flex;flex-direction:column;align-items:center;gap:6px;font-size:12px;font-weight:600;color:#9AA0A6;text-transform:uppercase;letter-spacing:.08em}
.kf-steps li span{width:30px;height:30px;border-radius:50%;border:2px solid #E1E3E6;background:#fff;color:#9AA0A6;display:flex;align-items:center;justify-content:center;font-size:13px;position:relative;z-index:1;transition:all .25s}
.kf-steps li+li::before{content:"";position:absolute;top:15px;right:50%;width:100%;height:2px;background:#E1E3E6}
.kf-steps li.done span{background:var(--orange-dk);border-color:var(--orange-dk);color:#fff}
.kf-steps li.done+li::before,.kf-steps li.done::before{background:var(--orange-dk)}
.kf-steps li.on{color:var(--ink)}.kf-steps li.on span{border-color:var(--orange-dk);color:var(--orange-dk);box-shadow:0 0 0 4px rgba(230,74,25,.12)}
.kf-choice{display:flex;flex-wrap:wrap;gap:10px;margin-top:8px}
.kf-choice .opt{position:relative;cursor:pointer}
.kf-choice input{position:absolute;opacity:0;width:1px;height:1px}
.kf-choice .opt span{display:flex;align-items:center;gap:8px;border:1.5px solid #E1E3E6;background:#fff;border-radius:999px;padding:9px 16px;font-size:14px;color:var(--ink);transition:all .2s;height:100%}
.kf-choice .opt b{font-weight:600}
.kf-choice .fi{color:var(--orange-dk);flex:none}
.kf-choice .opt:hover span{border-color:#C9CCD1}
.kf-choice input:checked+span{border-color:var(--orange-dk);background:#FFF4EF;box-shadow:0 0 0 3px rgba(230,74,25,.10)}
.kf-choice input:focus-visible+span{outline:2px solid var(--orange-dk);outline-offset:2px}
.kf-choice.cards,.kf-choice.tiles{display:grid;grid-template-columns:repeat(4,1fr)}
.kf-choice.tiles{grid-template-columns:repeat(3,1fr)}
.kf-choice.cards .opt span,.kf-choice.tiles .opt span{flex-direction:column;justify-content:center;text-align:center;border-radius:12px;padding:16px 10px;gap:8px;font-size:13px;line-height:1.3}
.kf-choice.cards .fi,.kf-choice.tiles .fi{width:28px;height:28px}
.kf-choice.chips .opt span{padding:7px 14px;font-size:13.5px}
.kf-step{display:flex;align-items:stretch;border:1px solid #E1E3E6;border-radius:10px;overflow:hidden;background:#F8F9FA}
.kf-step button{width:46px;flex:none;border:0;background:#fff;font-size:20px;font-weight:600;color:var(--ink);cursor:pointer;transition:background .2s,color .2s}
.kf-step button:hover{background:#FFF4EF;color:var(--orange-dk)}
.kf-step input{border:0!important;border-radius:0!important;text-align:center;font-weight:700;-moz-appearance:textfield;box-shadow:none!important;min-width:0}
.kf-step input::-webkit-outer-spin-button,.kf-step input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.kf-step:focus-within{border-color:var(--orange-dk);box-shadow:0 0 0 4px rgba(230,74,25,.12)}
.enq .send{margin-top:6px}
.enq .send .btn{padding:16px 30px;font-size:15px;border-radius:8px;box-shadow:0 12px 26px rgba(230,74,25,.28)}
.enq .send .btn .fi{width:18px;height:18px}
.kf-trust{list-style:none;margin:22px 0 0;padding:18px 0 0;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.kf-trust li{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--muted);line-height:1.45}
.kf-trust .fi{color:#2E7D32;flex:none;width:18px;height:18px}
.enq .notice-ok{background:#F1F8F4;border-left:4px solid #2E7D32;color:var(--ink)}
.enq .notice-ok h3{color:var(--ink)}.enq .notice-ok p,.enq .notice-err p{color:var(--ink)}
.enq .notice-err{background:#FDECEA;border-left:4px solid #E53935}
@media (max-width:1100px){.enq{grid-template-columns:1fr}.enq>.side{padding:36px 32px}}
@media (max-width:820px){
 .enq{padding:0;border-radius:14px}
 .enq>.side{padding:30px 22px}
 .enq>div:last-child{padding:26px 18px 24px}
 .kf-choice.cards,.kf-choice.tiles{grid-template-columns:1fr 1fr}
 .kf-trust{grid-template-columns:1fr}
 .kf-steps li{font-size:10.5px;letter-spacing:.04em}
}

/* market planning pages */
.mkt{display:grid;grid-template-columns:1.6fr 1fr;gap:48px;align-items:start}
.mkt-body section{padding:0 0 26px;margin-bottom:26px;border-bottom:1px solid var(--line);scroll-margin-top:110px}
.mkt-body h2{font-size:clamp(22px,2.6vw,28px);margin-bottom:12px}
.mkt-body p{margin:0 0 12px;color:#3C4043}
.mkt-body ul{margin:0 0 12px;padding-left:20px;display:grid;gap:8px;color:#3C4043}
.mkt-body b{color:var(--ink)}
.mkt-note{font-size:13px;color:var(--muted);background:var(--sky);border-radius:8px;padding:12px 14px}
.mkt-facts{position:sticky;top:110px;background:#fff;border:1px solid var(--line);border-radius:14px;padding:26px;box-shadow:0 20px 44px rgba(26,26,26,.07)}
.mkt-facts h2{font-size:20px;margin-bottom:14px}
.mkt-facts dl{margin:0 0 18px;display:grid;gap:12px}
.mkt-facts dl div{border-left:3px solid var(--orange-dk);padding-left:12px}
.mkt-facts dt{font-size:11.5px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--orange-dk)}
.mkt-facts dd{margin:2px 0 0;font-size:14.5px;line-height:1.45}
.mkt-facts .btn{width:100%}
.mkt-facts .small{font-size:12.5px;color:var(--muted);margin-top:10px;text-align:center}
.mkt-cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}
.btn.ghost.light{color:#fff;border:2px solid rgba(255,255,255,.85);background:transparent}
.btn.ghost.light:hover{background:#fff;color:var(--ink)}
@media (max-width:980px){.mkt{grid-template-columns:1fr;gap:28px}.mkt-facts{position:static;order:-1}}
/* Instagram strip */
.igs{background:var(--white);padding-block:72px 64px;border-top:1px solid var(--line)}
.ig-head{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;flex-wrap:wrap;margin-bottom:28px}
.ig-head p{color:var(--muted);margin-top:8px;max-width:520px}
.ig-btn{background:linear-gradient(45deg,#F58529,#DD2A7B 55%,#8134AF);gap:10px}
.ig-btn:hover{filter:brightness(1.08);background:linear-gradient(45deg,#F58529,#DD2A7B 55%,#8134AF)}
.ig-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:8px}
.ig-grid a{position:relative;display:block;aspect-ratio:1;overflow:hidden;border-radius:10px;background:var(--grey)}
.ig-grid img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}
.ig-grid span{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:#fff;background:rgba(26,26,26,.35);opacity:0;transition:opacity .3s}
.ig-grid span svg{width:30px;height:30px}
.ig-grid a:hover img{transform:scale(1.07)}.ig-grid a:hover span,.ig-grid a:focus-visible span{opacity:1}
.ig-feed #sb_instagram{padding:0!important}
.ig-feed #sb_instagram .sbi_photo{border-radius:10px;overflow:hidden}
@media (max-width:900px){.ig-grid{grid-template-columns:repeat(3,1fr)}}
@media (max-width:560px){.igs{padding-block:52px 44px}.ig-grid{grid-template-columns:repeat(3,1fr);gap:6px}}
/* footer centred on phones */
@media (max-width:820px){
 footer{padding-block:56px 24px;text-align:center}
 .fgrid{gap:36px;justify-items:center}
 .fbig{align-items:center}
 .fbig img{margin-inline:auto}
 .fbig h2{font-size:clamp(24px,6.4vw,32px)}
 .fbig .row{justify-content:center}
 footer h4{margin-bottom:12px}
 .fgrid>div{width:100%}
 .fbottom{flex-direction:column;justify-content:center;align-items:center;margin-top:44px}
 .flinks{justify-content:center;flex-wrap:wrap}
 .thumbs{display:grid;grid-template-columns:repeat(3,64px);justify-content:center;gap:8px}
 .thumbs img{width:64px;height:64px}
 .copy-r{text-align:center}
}