/* Cyber Cape Town — "Field Guide" theme */
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow";src:url("../fonts/barlow-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("../fonts/barlow-condensed-latin-600-normal.woff2") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"Barlow Condensed";src:url("../fonts/barlow-condensed-latin-700-normal.woff2") format("woff2");font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-latin-400-normal.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"IBM Plex Mono";src:url("../fonts/ibm-plex-mono-latin-500-normal.woff2") format("woff2");font-weight:500;font-style:normal;font-display:swap}

:root{
  --paper:#FFFFFF;--panel:#EEF1EC;--ink:#17231C;--green:#2F4A3A;--body:#3D4A42;--muted:#56625A;
  --amber:#E3A92B;--amber-soft:#FBF3DF;--line:#D5DBD3;--line-2:#B9C3B7;
  --cond:"Barlow Condensed","Arial Narrow",sans-serif;--sans:"Barlow",system-ui,sans-serif;--mono:"IBM Plex Mono",ui-monospace,monospace;
  --gutter:clamp(20px,4vw,48px);--radius:4px;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--sans);font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--green)}a:hover{color:var(--ink)}
button,input,select,textarea{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--amber);outline-offset:2px}
h1,h2,h3,h4{margin:0;font-family:var(--cond);font-weight:700;text-transform:uppercase;line-height:.96;letter-spacing:.005em}
p{margin:0}
.mono{font-family:var(--mono)}
.sr{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:-9999px;top:8px;z-index:100;background:var(--amber);color:var(--ink);padding:10px 14px}
.skip:focus{left:16px}
.wrap{max-width:1280px;margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.icon{flex:none}

/* Utilities */
.mt-18{margin-top:18px}.mt-24{margin-top:24px}.mt-32{margin-top:32px}.mt-40{margin-top:40px}.mb-40{margin-bottom:40px}.big{font-size:18px}.grow{flex:999 1 520px;min-width:0}

/* Photos */
.photo{width:100%;height:100%;object-fit:cover}
.fp-center{object-position:50% 50%}.fp-top{object-position:50% 15%}.fp-bottom{object-position:50% 85%}.fp-left{object-position:15% 50%}.fp-right{object-position:85% 50%}
.zoom{overflow:hidden}.zoom .photo{transition:transform .9s cubic-bezier(.2,.7,.2,1)}.zoom:hover .photo{transform:scale(1.04)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.zoom .photo{transition:none}.zoom:hover .photo{transform:none}}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:48px;padding:0 22px;border-radius:var(--radius);border:0;font-family:var(--cond);font-weight:700;font-size:19px;letter-spacing:.06em;text-transform:uppercase;text-decoration:none;cursor:pointer}
.btn--amber{background:var(--amber);color:var(--ink)}.btn--amber:hover{background:#D49A1E;color:var(--ink)}
.btn--green{background:var(--green);color:#fff}.btn--green:hover{background:var(--ink);color:#fff}
.btn--ink{background:var(--ink);color:#fff}.btn--ink:hover{background:var(--green);color:#fff}
.btn--outline{background:transparent;border:2px solid currentColor;color:var(--ink)}
.btn--outline-light{background:transparent;border:2px solid rgba(255,255,255,.8);color:#fff}.btn--outline-light:hover{color:#fff;background:rgba(255,255,255,.1)}
.link-arrow{font-weight:600;text-decoration:none;display:inline-flex;align-items:center;gap:6px}
.link-arrow:hover{text-decoration:underline}

/* Top bar & header */
.topbar{background:var(--green);color:#fff;font-size:14px}
.topbar__in{display:flex;flex-wrap:wrap;justify-content:space-between;gap:6px 24px;padding-top:9px;padding-bottom:9px}
.topbar__hours{font-size:12px;letter-spacing:.03em}
.topbar__links{display:flex;flex-wrap:wrap;gap:20px}
.topbar a{color:#fff;text-decoration:none;font-weight:500}.topbar a:hover{text-decoration:underline}
.site-header{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--line)}
.site-header__in{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:12px;padding-bottom:12px;flex-wrap:wrap}
.brand{display:flex;align-items:center;gap:12px;color:var(--ink);text-decoration:none}
.brand .brand-mark{color:var(--green)}
.brand__text{display:flex;flex-direction:column;line-height:1}
.brand__name{font-family:var(--cond);font-weight:700;font-size:26px;letter-spacing:.05em;text-transform:uppercase}
.brand__sub{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);margin-top:4px}
.site-nav ul{list-style:none;margin:0;padding:0;display:flex;align-items:center;gap:28px}
.site-nav a{font-family:var(--cond);font-weight:600;font-size:18px;letter-spacing:.06em;text-transform:uppercase;color:var(--ink);text-decoration:none;padding:6px 0}
.site-nav a[aria-current="page"]{box-shadow:inset 0 -3px 0 var(--amber)}
.site-nav a:hover{color:var(--green)}
.site-nav .btn{padding:0 22px;color:var(--ink)}
.burger{display:none;width:48px;height:48px;align-items:center;justify-content:center;border:1px solid var(--line);border-radius:var(--radius);background:#fff;cursor:pointer}
.burger__close{display:none}
@media (max-width:1180px){
  .topbar__hours{display:none}
  .burger{display:inline-flex}
  .site-nav{flex-basis:100%}
  .site-nav{display:none}
  .nav-open .site-nav{display:block}
  .nav-open .burger__open{display:none}.nav-open .burger__close{display:inline}
  .site-nav ul{flex-direction:column;align-items:stretch;gap:0;padding:4px 0 12px}
  .site-nav li{border-bottom:1px solid var(--panel)}
  .site-nav a{display:block;font-size:24px;padding:12px 0}
  .site-nav a[aria-current="page"]{box-shadow:none;color:var(--green)}
  .site-nav .site-nav__cta{border:0;padding-top:12px}
  .site-nav .btn{display:flex}
}

/* Section headings */
.eyebrow{font-family:var(--mono);font-size:13px;color:var(--muted)}
.h2{margin-top:10px;font-size:clamp(38px,4.4vw,62px)}
.section{padding:clamp(72px,8vw,120px) 0}
.section--panel{background:var(--panel)}
.section__head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:40px}
.section__head p.lede{max-width:440px;color:var(--body)}

/* Home hero */
.hero__media{position:relative;height:clamp(520px,50vw,740px);background:#2F4A3A;overflow:hidden}
.hero__slide{position:absolute;inset:0;margin:0;opacity:0;transition:opacity 1.4s ease}
.hero__slide.is-active{opacity:1}
.hero__slide .photo{transform:scale(1.001);transition:transform 9s linear}
.hero__slide.is-active .photo{transform:scale(1.06)}
.hero__controls{position:absolute;top:16px;right:var(--gutter);z-index:2;display:flex;align-items:center;gap:2px;background:rgba(23,35,28,.6);padding:4px 8px;border-radius:999px}
.hero__pause{width:36px;height:36px;display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:50%;background:transparent;color:#fff;cursor:pointer}
.hero__pause .i-play{display:none}.hero__pause.is-paused .i-play{display:inline}.hero__pause.is-paused .i-pause{display:none}
.hero__dot{width:28px;height:36px;border:0;padding:0;background:transparent;cursor:pointer;position:relative}
.hero__dot::before{content:"";position:absolute;left:50%;top:50%;width:9px;height:9px;margin:-4.5px 0 0 -4.5px;border-radius:50%;background:rgba(255,255,255,.6);transition:all .3s ease}
.hero__dot[aria-current="true"]::before{background:var(--amber);width:20px;margin-left:-10px;border-radius:5px}
@media (prefers-reduced-motion:reduce){.hero__slide{transition:none}.hero__slide .photo,.hero__slide.is-active .photo{transition:none;transform:none}}
.hero__card-wrap{position:relative;margin-top:clamp(-260px,-16vw,-150px)}
.hero__card{background:#fff;padding:clamp(24px,3.4vw,48px);max-width:840px;border-top:6px solid var(--amber);box-shadow:0 24px 60px rgba(23,35,28,.14)}
.hero__fig{font-family:var(--mono);font-size:13px;color:var(--muted)}
.hero__card h1{margin-top:12px;font-size:clamp(44px,5.6vw,84px);line-height:.94}
.hero__card p.lede{margin-top:18px;font-size:clamp(17px,1.4vw,20px);color:var(--body);max-width:640px}
.avail{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:12px;align-items:end;background:var(--panel);padding:20px;border-radius:var(--radius);margin-top:24px}

/* Forms */
.field{display:flex;flex-direction:column;gap:6px;font-family:var(--mono);font-size:12px;color:var(--body)}
.field input,.field select,.field textarea{height:52px;padding:0 12px;border:1px solid var(--line-2);border-radius:var(--radius);background:#fff;color:var(--ink);font-family:var(--sans);font-size:16px;width:100%}
.field textarea{height:auto;padding:12px;resize:vertical;min-height:120px}
.field--full{grid-column:1/-1}
.check{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--body)}
.check input{width:20px;height:20px;margin-top:3px;accent-color:var(--green)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.notice{padding:16px 18px;border-radius:var(--radius);font-weight:500}
.notice--ok{background:#E3F1E6;border:1px solid #9CC7A5;color:#1D4A2A}
.notice--err{background:#FBE9E4;border:1px solid #E2A898;color:#7A2513}

/* Drive-time explorer */
.drive{display:flex;flex-wrap:wrap;gap:32px}
.drive__routes{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:28px}
.drive__hub{display:flex;justify-content:space-between;align-items:flex-end;font-family:var(--cond);font-weight:700;font-size:22px;letter-spacing:.04em;text-transform:uppercase;border-bottom:2px solid var(--ink);padding-bottom:6px;margin-bottom:4px}
.drive__scale{font-family:var(--mono);font-weight:400;font-size:12px;letter-spacing:0;text-transform:none;color:var(--muted)}
.route{width:100%;display:flex;align-items:center;gap:16px;min-height:56px;padding:8px 12px;border:0;border-bottom:1px solid #E3E8E1;background:transparent;text-align:left;cursor:pointer}
.route:hover{background:#F4F6F2}
.route[aria-pressed="true"]{background:var(--amber-soft);box-shadow:inset 4px 0 0 var(--amber)}
.route__name{flex:0 0 220px;font-weight:600;font-size:16px}
.route__bar{flex:1;min-width:60px;height:10px;background:var(--panel);border-radius:5px;position:relative;overflow:hidden}
.route__bar svg{display:block;width:100%;height:10px}
.route__bar rect{fill:var(--green)}
.route[aria-pressed="true"] .route__bar rect{fill:var(--amber)}
.route__time{flex:0 0 126px;text-align:right;font-family:var(--mono);font-size:13px}
@media (max-width:640px){.route{flex-wrap:wrap;gap:8px}.route__name{flex:1 1 60%}.route__time{flex:0 0 auto}.route__bar{flex-basis:100%;order:3}}
.drive__panel{flex:1 1 380px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;align-self:flex-start}
.drive__img{position:relative;height:240px;background:var(--panel)}
.drive__img figure{margin:0;position:absolute;inset:0}
.drive__img figure[hidden]{display:none}
.drive__body{padding:24px}
.drive__body h3{margin-top:6px;font-size:34px;line-height:1}
.drive__body p.note{margin-top:12px;color:var(--body)}
.facts2{margin:18px 0 0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.facts2 dt{font-family:var(--mono);font-size:11px;color:var(--muted)}
.facts2 dd{margin:2px 0 0;font-weight:600}
.drive__body .btn{margin-top:22px}

/* Region cards */
.cards3{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px}
.rcard{background:#fff;border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.rcard__img{position:relative;height:260px}
.figtag{position:absolute;left:12px;top:12px;margin:0;font-family:var(--mono);font-size:11px;background:rgba(255,255,255,.92);padding:4px 8px}
.rcard__body{padding:24px;display:flex;flex-direction:column;flex:1}
.rcard__body h3{font-size:32px;line-height:1}
.rcard__body h3 a{color:inherit;text-decoration:none}
.rcard__body h3 a::after{content:"";position:absolute;inset:0}
.rcard{position:relative}
.rcard__body p.short{margin-top:10px;color:var(--body)}
.rcard__more{margin-top:auto;padding-top:20px;font-weight:600;position:relative}
.dtable{width:100%;border-collapse:collapse;margin-top:18px;font-size:15px}
.dtable tr{border-top:1px solid var(--line)}
.dtable tr:last-child{border-bottom:1px solid var(--line)}
.dtable th{text-align:left;font-family:var(--mono);font-weight:400;font-size:12px;color:var(--muted);padding:9px 0}
.dtable td{text-align:right;font-weight:600}
.dtable--strong tr:first-child{border-top:2px solid var(--ink)}
.dtable--strong th{font-family:var(--sans);font-size:15px;font-weight:500;color:var(--ink);padding:10px 0}
.dtable caption{text-align:left;font-family:var(--mono);font-size:12px;color:var(--muted);padding-bottom:6px}

/* Steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:24px}
.steps li{border-top:3px solid var(--ink);padding-top:18px}
.steps li:last-child{border-top-color:var(--amber)}
.steps .n{font-family:var(--mono);font-size:14px;color:var(--muted)}
.steps h3{margin-top:8px;font-size:26px}
.steps p{margin-top:8px;color:var(--body);font-size:16px}

/* Green band */
.band{background:var(--green);color:#fff}
.band__in{display:flex;flex-wrap:wrap;gap:clamp(32px,6vw,96px);align-items:center;padding-top:clamp(64px,8vw,112px);padding-bottom:clamp(64px,8vw,112px)}
.band .band__big{font-family:var(--cond);font-weight:700;font-size:clamp(96px,12vw,180px);line-height:.85;color:var(--amber)}
.band h2{font-size:clamp(36px,4vw,56px)}
.band p,.band li{color:#E4ECE6}
.band a{color:#fff}
.band ul{margin:20px 0 0;padding-left:20px;display:flex;flex-direction:column;gap:6px}

/* Contact block */
.contact{display:flex;flex-wrap:wrap;gap:40px}
.contact__info{flex:1 1 320px}
.contact__info address{font-style:normal;margin-top:28px;display:grid;gap:16px}
.contact__label{display:block;font-family:var(--mono);font-size:12px;color:var(--muted)}
.contact__value{font-size:22px;font-weight:600;text-decoration:none}
.form{flex:999 1 560px;min-width:0;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(20px,3vw,36px);display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;position:relative}
.form .btn{justify-self:start}

/* Inner page head */
.page-head{background:var(--panel)}
.page-head__in{padding-top:clamp(36px,5vw,64px);padding-bottom:clamp(36px,5vw,64px)}
.crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px;font-family:var(--mono);font-size:13px;color:var(--muted)}
.crumbs a{color:var(--muted)}
.crumbs [aria-current]{color:var(--ink)}
.page-head h1{margin-top:18px;font-size:clamp(46px,6vw,92px);line-height:.92;max-width:1000px}
.page-head p.lede{margin-top:20px;max-width:720px;font-size:19px;color:var(--body)}
.jump{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:12px;margin-top:32px}
.jump a{display:flex;justify-content:space-between;align-items:center;gap:12px;background:#fff;padding:18px 20px;border-radius:var(--radius);text-decoration:none;color:var(--ink);border:1px solid var(--line)}
.jump a:hover{border-color:var(--green)}
.jump strong{display:block;font-family:var(--cond);font-weight:700;font-size:24px;text-transform:uppercase}
.jump span.mono{font-size:12px;color:var(--muted)}

/* Sticky sub-navigation */
.subnav{position:sticky;top:0;z-index:30;background:var(--ink);overflow-x:auto;scrollbar-width:none}
.subnav::-webkit-scrollbar{display:none}
.subnav ul{list-style:none;margin:0 auto;display:flex;gap:28px;white-space:nowrap}
.subnav a{display:block;color:#fff;text-decoration:none;padding:18px 0;font-family:var(--cond);font-weight:600;font-size:18px;letter-spacing:.06em;text-transform:uppercase}
.subnav a:hover,.subnav a.is-active{color:var(--amber)}
@media (min-width:961px){.has-subnav .site-header{position:static}}

/* Area sections */
.area{padding-top:clamp(56px,7vw,100px);scroll-margin-top:64px}
.area__banner{position:relative}
.area__photo{height:clamp(320px,32vw,460px);overflow:hidden;border-radius:var(--radius);background:var(--panel)}
.area__title{position:absolute;left:0;bottom:0;background:#fff;padding:20px 28px 0 0;max-width:760px}
.area__title h2{margin-top:6px;font-size:clamp(40px,5vw,72px);line-height:.92}
.area__cols{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,72px);padding:32px 0 40px}
.area__text{flex:999 1 520px;min-width:0;font-size:18px;color:var(--body)}
.area__text p+p{margin-top:16px}
.area__text .link-arrow{margin-top:18px}
.area__cols .dtable{flex:1 1 340px;align-self:flex-start;margin-top:0}
.lodges__head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px}
.lodges__head h3{font-size:30px}
.lodges__count{margin-top:4px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chip{min-height:44px;padding:0 16px;border-radius:var(--radius);font-size:15px;font-weight:600;border:1px solid var(--line-2);background:#fff;color:var(--ink);cursor:pointer}
.chip[aria-pressed="true"]{background:var(--ink);border-color:var(--ink);color:#fff}
.lodge-grid{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,340px),1fr));gap:14px}
.lodge{display:flex;gap:14px;border:1px solid var(--line);border-radius:var(--radius);padding:12px;background:#fff;transition:border-color .2s ease,box-shadow .2s ease}
.lodge:hover{border-color:var(--green);box-shadow:0 10px 24px rgba(23,35,28,.08)}
.lodge[hidden]{display:none}
.lodge__img{flex:0 0 92px;height:92px;border-radius:3px;overflow:hidden;background:var(--panel)}
.lodge__body{min-width:0;display:flex;flex-direction:column}
.lodge__meta{font-family:var(--mono);font-size:11px;color:var(--muted)}
.lodge h4{margin-top:2px;font-size:22px;line-height:1.05}
.lodge p.d{margin-top:4px;font-size:15px;color:var(--body);line-height:1.45}
.lodge a{margin-top:6px;font-size:15px;font-weight:600}

/* FAQ */
.faq{display:flex;flex-wrap:wrap;gap:clamp(28px,5vw,72px)}
.faq__head{flex:1 1 300px}
.faq__list{flex:999 1 560px;min-width:0;border-top:2px solid var(--ink)}
.faq details{border-bottom:1px solid var(--line);padding:18px 0}
.faq summary{display:flex;justify-content:space-between;gap:16px;font-weight:600;font-size:19px;cursor:pointer;list-style:none}
.faq summary::-webkit-details-marker{display:none}
.faq summary .icon{margin-top:4px;transition:transform .25s ease}
.faq details[open] summary .icon{transform:rotate(180deg)}
.faq details p{margin-top:10px;color:var(--body);max-width:720px}

/* Amber CTA */
.cta{background:var(--amber)}
.cta__in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px;padding-top:clamp(48px,6vw,80px);padding-bottom:clamp(48px,6vw,80px)}
.cta h2{font-size:clamp(36px,4.4vw,60px);max-width:760px}
.cta .btns{display:flex;flex-wrap:wrap;gap:12px}

/* About page */
.split{display:flex;flex-wrap:wrap;gap:clamp(32px,6vw,88px);align-items:flex-start}
.split > *{flex:1 1 420px;min-width:0}
.prose p{color:var(--body);font-size:18px}
.prose p+p{margin-top:16px}
.prose h2{font-size:clamp(34px,4vw,52px);margin-bottom:18px}
.styles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.styles li{background:#fff;border-radius:var(--radius);padding:24px;border:1px solid var(--line)}
.styles h3{font-size:24px}
.styles p{margin-top:8px;color:var(--body);font-size:16px}
.banner-img{position:relative;height:clamp(260px,30vw,420px);overflow:hidden;border-radius:var(--radius);background:var(--panel)}
.story-img{position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:var(--radius);background:var(--panel)}

/* Footer */
.site-footer{background:var(--ink);color:#DCE4DE;font-size:15px}
.site-footer__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:32px;padding-top:56px;padding-bottom:28px}
.site-footer__brand{font-family:var(--cond);font-weight:700;font-size:26px;letter-spacing:.05em;text-transform:uppercase;color:#fff;margin-bottom:10px}
.site-footer__h{font-size:12px;color:var(--amber);margin-bottom:10px}
.site-footer ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.site-footer a{color:#DCE4DE;text-decoration:none}.site-footer a:hover{color:#fff;text-decoration:underline}
.site-footer address{font-style:normal;line-height:1.8}
.site-footer__bar{position:relative;display:flex;flex-wrap:wrap;justify-content:space-between;gap:12px;font-size:12px;color:#AEBBB2;padding-top:18px;padding-bottom:36px}

/* Mobile quick-contact bar */
.quickbar{display:none}
@media (max-width:640px){
  body{padding-bottom:76px}
  .quickbar{display:flex;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:10px 12px calc(12px + env(safe-area-inset-bottom));background:#fff;border-top:1px solid var(--line)}
  .quickbar a{flex:1;min-height:50px}
  .quickbar .btn--outline{border-color:var(--green);color:var(--green);font-size:17px}
}

/* 404 */
.notfound{padding:clamp(80px,10vw,140px) 0}
.notfound h1{font-size:clamp(56px,8vw,120px)}
.notfound p{margin-top:16px;color:var(--body);font-size:19px;max-width:560px}

/* Form errors & misc */
.field__err{color:#A03A20;font-family:var(--sans);font-size:13px}
[aria-invalid="true"]{border-color:#C0532F!important;box-shadow:0 0 0 1px #C0532F}
.ticks{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:8px}
.ticks li{position:relative;padding-left:28px;color:var(--body);font-size:18px}
.ticks li::before{content:"";position:absolute;left:0;top:9px;width:14px;height:8px;border-left:3px solid var(--green);border-bottom:3px solid var(--green);transform:rotate(-45deg)}
.banner-img--short{height:220px;margin-bottom:28px}
.rcard--line{border:1px solid var(--line)}
.contact__info address{font-style:normal}

.site-footer__bar::before{content:"";position:absolute;top:0;left:var(--gutter);right:var(--gutter);border-top:1px solid rgba(220,228,222,.16)}
@media (max-width:640px){
  .area__photo{height:240px}
  .area__title{position:static;padding:16px 0 0;max-width:none}
  .quickbar .btn{font-size:16px;letter-spacing:.03em;padding:0 12px}
}
@media (max-width:960px){
  .has-subnav .subnav{top:73px}
  .has-subnav .area{scroll-margin-top:140px}
}

/* Lodge card links & area links */
.lodge__links{margin-top:auto;padding-top:6px;display:flex;flex-wrap:wrap;gap:4px 16px}
.lodge__links a{margin-top:0}
.lodge__ext{display:inline-flex;align-items:center;gap:4px}
.area__links{display:flex;flex-wrap:wrap;gap:10px 28px;margin-top:18px}
.area__text .area__links .link-arrow{margin-top:0}

/* Navigation with six items: tighten between tablet and wide desktop */
@media (min-width:1181px) and (max-width:1380px){
  .site-nav ul{gap:18px}
  .site-nav a{font-size:16px;letter-spacing:.04em}
  .site-nav .btn{padding:0 16px}
  .brand__name{font-size:23px}
}

/* Directions & airports guides */
.small{font-size:14px;color:var(--muted);line-height:1.5}
.section--tight{padding:clamp(40px,5vw,72px) 0}
.guide-intro{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(28px,4vw,56px);align-items:start}
.guide-intro .h2{margin-bottom:18px}
@media (max-width:960px){.guide-intro{grid-template-columns:1fr}}
.guide{padding:clamp(64px,7vw,104px) 0}
.guide--panel{background:var(--panel)}
.guide__head{max-width:860px;margin-bottom:36px}
.guide__head h2,.guide__h2{margin-top:8px;font-size:clamp(38px,4.4vw,62px)}
.guide__h2{margin:0 0 32px}
.guide__head .lede{margin-top:16px;font-size:19px;color:var(--body)}
.guide__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:20px}
.gcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(20px,2.4vw,32px);min-width:0}
.guide--panel .gcard{border-color:#fff}
.gcard--wide{grid-column:1/-1}
.gcard h3{font-size:clamp(26px,2.4vw,32px);line-height:1.02}
.gcard h4{font-size:20px}
.gcard__meta{margin-top:8px;font-size:12px;color:var(--muted)}
.gcard>p{margin-top:12px;color:var(--body)}
.gcard .ttable-wrap{margin-top:14px}
.split-2{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr));gap:24px;margin-top:16px}
.split-2 .kv{margin-top:0}
.split-2 h4+p{margin-top:6px}
.steps-list{counter-reset:s;list-style:none;padding:0;margin:16px 0 0;display:grid;gap:12px;align-content:start}
.steps-list li{counter-increment:s;position:relative;padding-left:40px;color:var(--body);line-height:1.5}
.steps-list li::before{content:counter(s);position:absolute;left:0;top:0;width:27px;height:27px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--mono);font-size:13px;display:flex;align-items:center;justify-content:center}
.steps-list strong{color:var(--ink)}
.tip{margin-top:16px;background:var(--amber-soft);border-left:3px solid var(--amber);padding:10px 14px;border-radius:0 3px 3px 0;font-size:15px;color:var(--body)}
.kv{display:grid;grid-template-columns:minmax(110px,32%) minmax(0,1fr);margin:16px 0 0;font-size:15px}
.kv dt,.kv dd{border-top:1px solid var(--line);padding:9px 0}
.kv dt{font-family:var(--mono);font-size:12px;color:var(--muted);padding-right:14px;padding-top:11px}
.kv dd{margin:0;color:var(--ink)}
@media (max-width:480px){.kv{grid-template-columns:1fr}.kv dd{border-top:0;padding-top:0}}
.ttable-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
.ttable{width:100%;border-collapse:collapse;font-size:15px}
.ttable caption{text-align:left;font-family:var(--mono);font-size:12px;color:var(--muted);padding-bottom:6px}
.ttable th{text-align:left;font-family:var(--mono);font-size:12px;font-weight:400;color:var(--muted);padding:8px 12px 8px 0;border-bottom:2px solid var(--ink);white-space:nowrap}
.ttable td{padding:10px 12px 10px 0;border-bottom:1px solid var(--line);vertical-align:top}
.ttable td:last-child,.ttable th:last-child{padding-right:0}
.ttable td.num{white-space:nowrap;font-variant-numeric:tabular-nums;font-weight:600}
.ttable a{font-weight:600}
.ttable .via{display:block;margin-top:2px;font-size:12px;color:var(--muted);font-weight:400}
.ttable--drive td:first-child{white-space:nowrap}
@media (max-width:640px){
  .ttable{font-size:14px}
  .ttable--drive td:first-child{white-space:normal}
  .ttable--airlines td:nth-child(2),.ttable--airlines th:nth-child(2){display:none}
}
.reserves{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:36px 28px;margin-top:40px}
.rcard2{border-top:3px solid var(--ink);padding-top:16px;min-width:0}
.rcard2__meta{font-size:12px;color:var(--muted)}
.rcard2 h3{margin-top:6px;font-size:clamp(26px,2.4vw,32px);line-height:1.02}
.rcard2 p.small{margin-top:12px}
.apt-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,440px),1fr));gap:20px}
.apt-grid--compact{grid-template-columns:repeat(auto-fit,minmax(min(100%,320px),1fr))}
.apt{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:clamp(20px,2.2vw,28px);min-width:0}
.guide--panel .apt{border-color:#fff}
.apt:target{outline:3px solid var(--amber);outline-offset:2px}
.apt__head{display:flex;gap:14px;align-items:flex-start}
.apt__code{flex:0 0 auto;min-width:56px;text-align:center;background:var(--green);color:#fff;font-size:17px;font-weight:500;letter-spacing:.06em;padding:7px 9px;border-radius:3px;line-height:1.2}
.apt h3{font-size:24px;line-height:1.05}
.apt__where{margin-top:4px;font-size:12px;color:var(--muted)}
.apt__lede{margin-top:14px;color:var(--body)}
.has-subnav .guide,.has-subnav .gcard,.has-subnav .rcard2,.has-subnav .apt,.has-subnav .section{scroll-margin-top:72px}
@media (max-width:960px){.has-subnav .guide,.has-subnav .gcard,.has-subnav .rcard2,.has-subnav .apt,.has-subnav .section{scroll-margin-top:140px}}

/* SVG maps */
.map{margin:0;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:#E4ECEF}
.map__svg{display:block;width:100%;height:auto}
.map--inset{margin-top:8px;max-width:860px}
@media (min-width:961px){.guide-intro>.map{position:sticky;top:76px}}
.map__sea{fill:#E4ECEF}
.map__nb{fill:#F7F8F5;stroke:#C9D0C6;stroke-width:1;vector-effect:non-scaling-stroke}
.map__za{fill:#EEF1EC;stroke:var(--green);stroke-width:1.5;vector-effect:non-scaling-stroke;stroke-linejoin:round}
.map__ls{fill:#fff;stroke:#B9C3B7;stroke-width:1;vector-effect:non-scaling-stroke}
.map__route{fill:none;stroke:var(--amber);stroke-width:3;stroke-dasharray:7 5;stroke-linecap:round;stroke-linejoin:round;vector-effect:non-scaling-stroke}
.map__area{fill:rgba(227,169,43,.16);stroke:var(--amber);stroke-width:1.5;stroke-dasharray:6 4;vector-effect:non-scaling-stroke}
.map__pt--hub{fill:var(--ink)}
.map__pt--reserve{fill:var(--amber);stroke:var(--ink);stroke-width:1.5;vector-effect:non-scaling-stroke}
.map__pt--airport{fill:#fff;stroke:var(--green);stroke-width:3;vector-effect:non-scaling-stroke}
.map__label{font-family:var(--sans);font-weight:600;fill:var(--ink);paint-order:stroke;stroke:#fff;stroke-width:.24em;stroke-linejoin:round}
.map__label--reserve,.map__label--area{font-weight:700}
.map__label--area{fill:#6B4E0E}
.map__label--airport{font-family:var(--mono);font-weight:500}
.map a .map__mk{cursor:pointer}
.map a:hover .map__pt--reserve,.map a:focus .map__pt--reserve{fill:var(--ink)}
.map a:hover .map__pt--airport,.map a:focus .map__pt--airport{fill:var(--amber)}
.map a:hover .map__label,.map a:focus .map__label{fill:var(--green)}
.map a:focus-visible{outline:3px solid var(--amber)}
@media (max-width:640px){.map__label--minor{display:none}}
.map__key{display:flex;flex-wrap:wrap;align-items:center;gap:6px;background:#fff;border-top:1px solid var(--line);padding:9px 14px;font-size:11px;color:var(--muted)}
.map__key .k{display:inline-block;width:10px;height:10px;margin-left:6px}
.map__key .k:first-child{margin-left:0}
.k--hub{background:var(--ink)}
.k--reserve{background:var(--amber);border-radius:50%;border:1px solid var(--ink)}
.k--airport{border:2px solid var(--green);border-radius:50%;background:#fff}
.k--route{width:18px!important;height:0!important;border-top:3px dashed var(--amber)}

/* Four region cards on the home page */
.cards3--4{grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr))}
.cards3--4 .rcard__body h3{font-size:clamp(26px,2.2vw,30px)}
.gcard--feature{border-top:3px solid var(--amber)}

/* Buttons & pills (shared) */
.btn--sm{min-height:42px;font-size:16px;padding:0 16px}
.site-nav .btn[aria-current]{box-shadow:none}
.pill{display:inline-flex;align-items:center;min-height:30px;padding:2px 10px;border:1px solid var(--line-2);border-radius:999px;font-size:13px;font-weight:600;color:var(--green);text-decoration:none;background:#fff}
a.pill:hover{border-color:var(--green)}
.pill--static{color:var(--ink);background:var(--panel);border-color:var(--panel)}
.ticks--sm li{font-size:15px;padding-left:24px}
.ticks--sm li::before{top:7px;width:12px;height:7px}

/* Popular cities */
.dest-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,460px),1fr));gap:24px}
.dest{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column;min-width:0}
.guide--panel .dest{border-color:#fff}
.dest:target{outline:3px solid var(--amber);outline-offset:2px}
.dest__img{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--panel)}
.dest__body{padding:clamp(20px,2.4vw,30px);display:flex;flex-direction:column;flex:1}
.dest__body h3{font-size:clamp(28px,2.6vw,36px);line-height:1}
.dest__short{margin-top:10px;font-weight:600;color:var(--ink)}
.dest__body>p{margin-top:10px;color:var(--body)}
.dest__body .ticks{margin-top:14px}
.dest__pairs{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:16px}
.dest__pairs .mono{font-size:12px;color:var(--muted);margin-right:4px}
.dest__cta{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:auto;padding-top:20px}
.has-subnav .dest{scroll-margin-top:72px}
@media (max-width:960px){.has-subnav .dest{scroll-margin-top:140px}}

/* Packages */
.pkg-grid{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,360px),1fr));gap:24px;align-items:start}
.pkg[hidden]{display:none}
.pkg article{height:100%;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.pkg:target article{outline:3px solid var(--amber);outline-offset:2px}
.pkg__img{position:relative;aspect-ratio:16/9;overflow:hidden;background:var(--panel)}
.pkg__body{padding:22px 24px 24px;display:flex;flex-direction:column;flex:1}
.pkg__route{font-size:12px;color:var(--muted)}
.pkg h3{margin-top:6px;font-size:28px;line-height:1.02}
.pkg__sum{margin-top:10px;color:var(--body);font-size:16px}
.pkg__stops{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:0}
.pkg__stops li{display:flex;justify-content:space-between;gap:10px;border-top:1px solid var(--line);padding:7px 0;font-size:15px}
.pkg__stops li:last-child{border-bottom:1px solid var(--line)}
.pkg__stops a{font-weight:600}
.pkg__stops .mono{font-size:12px;color:var(--muted);white-space:nowrap}
.pkg__levels{display:flex;flex-wrap:wrap;align-items:center;gap:6px;margin-top:14px}
.pkg__levels .mono{font-size:12px;color:var(--muted);margin-right:4px}
.pkg__more{margin-top:14px}
.pkg__more summary{display:flex;justify-content:space-between;align-items:center;cursor:pointer;font-weight:600;color:var(--green);list-style:none;padding:6px 0}
.pkg__more summary::-webkit-details-marker{display:none}
.pkg__more[open] summary .icon{transform:rotate(180deg)}
.pkg__more .kv{grid-template-columns:minmax(80px,24%) minmax(0,1fr)}
.pkg__foot{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;margin-top:auto;padding-top:18px}
.pkg__price{display:flex;flex-direction:column;line-height:1.2}
.pkg__price .mono{font-size:11px;color:var(--muted)}
.pkg__price strong{font-family:var(--cond);font-size:22px;text-transform:uppercase;letter-spacing:.03em}

/* Trip builder */
.page-head--tight .page-head__in{padding-bottom:clamp(28px,3vw,44px)}
.tb-wrap{padding-top:clamp(28px,3vw,48px)}
.tb{margin-top:8px}
.tb__nav{list-style:none;margin:0 0 24px;padding:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px;counter-reset:none}
.tb__nav button{width:100%;display:flex;align-items:center;gap:8px;min-height:48px;padding:6px 12px;border:0;border-top:4px solid var(--line);background:none;font-family:var(--cond);font-weight:600;font-size:17px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted);cursor:pointer;text-align:left}
.tb__nav button .mono{font-size:12px;letter-spacing:0}
.tb__nav button[aria-current="step"]{border-top-color:var(--amber);color:var(--ink)}
.tb__nav button.is-done{border-top-color:var(--green);color:var(--green)}
@media (max-width:700px){.tb__nav button{font-size:0;justify-content:center;padding:6px}.tb__nav button .mono{font-size:13px}}
.tb__layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:clamp(24px,3vw,44px);align-items:start}
.tb__layout:not(:has(.tb__side:not([hidden]))){grid-template-columns:minmax(0,1fr)}
@media (max-width:1000px){.tb__layout{grid-template-columns:minmax(0,1fr)}}
.tb__main{min-width:0}
.tb__step{border:0;margin:0 0 40px;padding:0;min-width:0}
.tb.is-wizard .tb__step{margin-bottom:0}
.tb__step[hidden]{display:none}
.tb__step legend{display:block;font-family:var(--cond);font-weight:700;font-size:clamp(34px,3.6vw,48px);line-height:1;text-transform:uppercase;margin-bottom:18px;padding:0}
.tb__step legend .mono{display:block;font-family:var(--mono);font-weight:400;font-size:12px;color:var(--muted);text-transform:none;margin-bottom:8px}
.tb__h{font-size:24px;margin:28px 0 12px}
.tb__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,220px),1fr));gap:14px;align-items:end;margin-top:14px}
.tb__grid--ages{grid-template-columns:repeat(auto-fill,minmax(130px,1fr))}
.tb__narrow{max-width:420px;margin-top:24px}
.tb__wide{margin-top:24px}
.tb__nights{margin:0;align-self:center;font-family:var(--mono);font-size:14px;color:var(--green)}
.tb__ages{margin-top:16px}
.tb.is-wizard .tb__ages [data-age][hidden]{display:none}
.stepper{display:flex;align-items:stretch;max-width:180px}
.stepper button{flex:0 0 46px;border:1px solid var(--line-2);background:#fff;font-size:22px;line-height:1;cursor:pointer;color:var(--green)}
.stepper button:first-child{border-radius:var(--radius) 0 0 var(--radius)}
.stepper button:last-child{border-radius:0 var(--radius) var(--radius) 0}
.stepper input{width:100%;min-width:0;text-align:center;border-radius:0!important;border-left:0!important;border-right:0!important;-moz-appearance:textfield}
.stepper input::-webkit-outer-spin-button,.stepper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.pills{display:flex;flex-wrap:wrap;gap:8px}
.pick{position:relative}
.pick input{position:absolute;opacity:0;inset:0;cursor:pointer}
.pick span{display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--line-2);border-radius:999px;background:#fff;font-size:15px;font-weight:600;cursor:pointer}
.pick input:checked+span{background:var(--ink);border-color:var(--ink);color:#fff}
.pick input:focus-visible+span{outline:3px solid var(--amber);outline-offset:2px}
.levels{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,200px),1fr));gap:10px}
.level{position:relative;display:block;cursor:pointer}
.level input{position:absolute;opacity:0;inset:0}
.level>span{display:flex;flex-direction:column;gap:4px;height:100%;padding:14px 16px;border:1px solid var(--line-2);border-radius:var(--radius);background:#fff}
.level strong{font-family:var(--cond);font-size:22px;text-transform:uppercase;letter-spacing:.03em}
.level>span>span{font-size:14px;color:var(--body);line-height:1.4}
.level input:checked+span{border-color:var(--green);box-shadow:inset 0 0 0 2px var(--green);background:var(--amber-soft)}
.level input:focus-visible+span{outline:3px solid var(--amber);outline-offset:2px}
.dpick-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,300px),1fr));gap:10px}
.dpick{border:1px solid var(--line);border-radius:var(--radius);background:#fff;transition:border-color .15s}
.dpick:has(.dpick__on:checked){border-color:var(--green);box-shadow:inset 0 0 0 1px var(--green)}
.dpick__label{display:flex;gap:12px;padding:10px;cursor:pointer;position:relative}
.dpick__on{position:absolute;top:12px;right:12px;width:22px;height:22px;accent-color:var(--green)}
.dpick__img{flex:0 0 72px;height:72px;border-radius:3px;overflow:hidden;background:var(--panel)}
.dpick__img .photo,.dpick__img img{width:100%;height:100%;object-fit:cover}
.dpick__txt{display:flex;flex-direction:column;gap:3px;padding-right:28px;min-width:0}
.dpick__txt strong{font-family:var(--cond);font-size:20px;text-transform:uppercase;letter-spacing:.02em;line-height:1.05}
.dpick__txt>span{font-size:13px;color:var(--body);line-height:1.35}
.dpick__txt .mono{font-size:11px;color:var(--muted)}
.dpick__more{display:none;grid-template-columns:1fr 1fr;gap:10px;padding:0 10px 12px}
.dpick:has(.dpick__on:checked) .dpick__more{display:grid}
.tb.is-wizard .dpick .dpick__more{display:none!important}
.dpick__more .field--wide{grid-column:1/-1}
.route-list{list-style:none;margin:16px 0 0;padding:0;display:grid;gap:10px;counter-reset:r}
.route-list:empty::before{content:"No places chosen yet — go back to step 2 and tick at least one.";color:var(--muted);font-size:15px}
.rstop{counter-increment:r;border:1px solid var(--line);border-left:4px solid var(--green);border-radius:var(--radius);background:#fff;padding:12px 14px}
.rstop__head{display:flex;align-items:center;gap:10px}
.rstop__head::before{content:counter(r);flex:0 0 28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;font-family:var(--mono);font-size:13px;display:flex;align-items:center;justify-content:center}
.rstop__head strong{flex:1;font-family:var(--cond);font-size:22px;text-transform:uppercase;letter-spacing:.02em}
.rstop__btn{width:38px;height:38px;border:1px solid var(--line-2);border-radius:var(--radius);background:#fff;cursor:pointer;color:var(--green);font-size:16px}
.rstop__btn:disabled{opacity:.35;cursor:default}
.rstop .dpick__more{display:grid!important;padding:12px 0 0;grid-template-columns:120px 1fr}
@media (max-width:520px){.rstop .dpick__more{grid-template-columns:1fr}}
.tb__total{margin-top:14px;font-size:15px}
.tb__total.is-warn{color:#8A5300}
.tb__pager{display:flex;align-items:center;justify-content:space-between;gap:16px;border-top:1px solid var(--line);margin-top:32px;padding-top:20px}
.tb__pager .tb__err{flex:1;margin:0;color:#A03A20;font-size:14px;text-align:center}
.tb__pager [hidden]{visibility:hidden;display:inline-flex}
.tb__side{position:sticky;top:96px;background:var(--panel);border-radius:var(--radius);padding:22px}
.tb__side dl{margin:10px 0 0;display:grid;gap:10px;font-size:14px}
.tb__side dt{font-family:var(--mono);font-size:11px;color:var(--muted)}
.tb__side dd{margin:2px 0 0;font-weight:600}
.tb__side ol{margin:4px 0 0;padding-left:18px;font-weight:600}
.tb__side ol span{font-weight:400;color:var(--muted)}
@media (max-width:1000px){.tb__side{position:static}}
.tb__review{margin-top:24px;background:var(--panel);border-radius:var(--radius);padding:20px}
.tb__review h3{font-size:22px;margin-bottom:6px}
.tb-done{max-width:900px}
.tb__nav[hidden],.tb__pager[hidden],.tb__side[hidden],.tb__ages[hidden]{display:none}
.tb:not(.is-wizard) [data-js-only]{display:none}
