/*
Theme Name: Nelani Transport
Theme URI: https://nelani-transport.online
Author: Nelani Reliable Transport
Description: Tour operator theme for Nelani Reliable Transport, focused on Cape Town and the Western Cape. Pair with the Nelani Core plugin, which creates the required pages and checks the templates on activation.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: nelani-transport
*/
:root{--bg:#fbf6ec;--ink:#1d2b36;--muted:#5c6a73;--card:#fff;--line:#e6dcc8;--accent:#c4501f;--accent-d:#a8410f;--deep:#12303f;--on-deep:#f6ead6}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:17px/1.65 Karla,system-ui,sans-serif}
h1,h2,h3{font-family:Fraunces,Georgia,serif;margin:0;line-height:1.1}
img{max-width:100%;height:auto}a{color:var(--accent-d)}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.wrap{max-width:1040px;margin:0 auto;padding:0 24px}
.sec{max-width:1040px;margin:0 auto;padding:64px 24px}
.sec h2{font-size:clamp(1.7rem,5vw,2.4rem);margin-bottom:10px}
.sub{color:var(--muted);margin:0 0 30px;max-width:38em}
.btn{display:inline-block;padding:13px 22px;border-radius:99px;font:600 1rem Karla,sans-serif;text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn.p{background:var(--accent);color:#fff}.btn.p:hover{background:var(--accent-d)}
.btn.s{border-color:rgba(255,255,255,.85);color:#fff}.btn.s:hover{background:rgba(255,255,255,.14)}
.btn.o{border-color:var(--accent);color:var(--accent-d);background:none}
.ctas{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
/* header */
.site-header{background:var(--bg);border-bottom:1px solid var(--line);position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px}
.brand{font:700 1.2rem Fraunces,Georgia,serif;color:var(--deep);text-decoration:none}
.nav ul{list-style:none;display:flex;gap:22px;margin:0;padding:0}
.nav a{color:var(--ink);text-decoration:none;font-weight:600}.nav .current-menu-item a,.nav a:hover{color:var(--accent-d)}
.call{font-weight:600;text-decoration:none;color:var(--deep)}
.menu-toggle{display:none;background:none;border:1px solid var(--line);border-radius:10px;padding:8px 12px;font:600 .95rem Karla,sans-serif}
@media(max-width:860px){.menu-toggle{display:block}.nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--bg);border-bottom:1px solid var(--line);padding:12px 24px}.nav.open{display:block}.nav ul{flex-direction:column;gap:12px}.call{display:none}}
/* hero */
.hero{position:relative;min-height:84vh;display:flex;align-items:flex-end;color:#fff;background:#12303f center 35%/cover no-repeat;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(8,22,30,.9),rgba(8,22,30,.4) 50%,rgba(8,22,30,.25))}
.hero .wrap{position:relative;width:100%;padding-bottom:clamp(36px,8vw,76px);animation:rise 1s .2s both}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
.hero h1{font-size:clamp(2.2rem,7.4vw,4.4rem);max-width:13em;text-wrap:balance}
.hero p{max-width:36em;margin:16px 0 0;font-size:1.12rem;color:#f3eadb}
.hero.small{min-height:300px}.hero.small h1{font-size:clamp(2rem,6vw,3.2rem)}
.strip{background:var(--deep);color:var(--on-deep)}
.strip ul{max-width:1040px;margin:0 auto;padding:16px 24px;list-style:none;display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:center;font-weight:600;font-size:.95rem}
/* cards */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px}
.card{background:var(--card);border:1px solid var(--line);border-radius:16px;overflow:hidden}
.card img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}
.card div{padding:18px 20px 22px}.card h3{font-size:1.25rem;margin-bottom:4px}.card p{margin:0;color:var(--muted);font-size:.97rem}
.feature{position:relative;min-height:420px;display:flex;align-items:flex-end;color:#fff;background:#12303f center 60%/cover no-repeat}
.feature::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(8,22,30,.88),rgba(8,22,30,.2) 75%)}
.feature .in{position:relative;max-width:1040px;width:100%;margin:0 auto;padding:56px 24px}
.feature h2{max-width:11em;font-size:clamp(1.7rem,5vw,2.5rem)}.feature p{max-width:30em;margin:10px 0 0;color:#f0e6d4}
.why{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:30px;border-top:1px solid var(--line);padding-top:30px}
.why h3{font-size:1.2rem;margin-bottom:4px}.why p{margin:0;color:var(--muted);font-size:.98rem}
.seasons{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.seasons div{background:var(--card);border:1px solid var(--line);border-top:4px solid var(--accent);border-radius:12px;padding:16px 18px}
.seasons h3{font-size:1.1rem}.seasons .m{color:var(--accent-d);font-weight:600;font-size:.88rem;margin:0 0 6px}.seasons p{margin:0;color:var(--muted);font-size:.95rem}
/* tours */
.n-tours{display:grid;gap:12px}
.n-tour{background:var(--card);border:1px solid var(--line);border-radius:14px;padding:0 22px}
.n-tour summary{cursor:pointer;padding:18px 0;list-style:none;display:flex;flex-direction:column;gap:2px}
.n-tour summary::-webkit-details-marker{display:none}
.n-tour-name{font:700 1.3rem Fraunces,Georgia,serif}.n-tour-meta{color:var(--accent-d);font-weight:600;font-size:.92rem}
.n-tour p{color:var(--muted);margin:0 0 14px}
.n-stops{list-style:none;margin:0 0 18px;padding:0;border-left:2px solid var(--line)}
.n-stops li{position:relative;padding:3px 0 12px 22px}.n-stops li::before{content:"";position:absolute;left:-7px;top:10px;width:12px;height:12px;border-radius:50%;background:var(--accent)}
.n-stops strong{display:block}.n-stops span{color:var(--muted);font-size:.95rem}
.n-tour .btn{margin-bottom:22px}
/* form */
.n-form{display:grid;gap:14px;background:var(--card);border:1px solid var(--line);border-radius:18px;padding:26px;max-width:760px}
@media(min-width:640px){.n-form{grid-template-columns:1fr 1fr}.n-form .wide{grid-column:1/-1}}
.n-form label{display:block;font-weight:600;font-size:.92rem;margin-bottom:4px}
.n-form input,.n-form select,.n-form textarea{width:100%;font:inherit;padding:11px 12px;border-radius:10px;border:1px solid var(--line);background:var(--bg);color:var(--ink)}
.n-form .hp{position:absolute;left:-9999px}
.n-notice{padding:14px 18px;border-radius:12px;margin-bottom:16px;max-width:760px}
.n-notice.ok{background:#e4f3e6;color:#1d4a26}.n-notice.err{background:#fde8e1;color:#7a2a10}
.steps{list-style:none;margin:0;padding:0;border-left:2px solid var(--line);max-width:640px}
.steps li{position:relative;padding:4px 0 18px 24px}.steps li::before{content:"";position:absolute;left:-7px;top:12px;width:12px;height:12px;border-radius:50%;background:var(--accent)}
.steps strong{display:block;font-size:1.1rem}.steps span{color:var(--muted)}
.contact-grid{display:grid;gap:36px}@media(min-width:820px){.contact-grid{grid-template-columns:1fr 1.3fr}}
.contact-grid h3{margin-bottom:8px}
.band{background:var(--deep);color:var(--on-deep);text-align:center}.band .sec{padding:72px 24px}.band p{max-width:34em;margin:10px auto 0;opacity:.88}
.band .ctas{justify-content:center}
.entry{max-width:760px}
.site-footer{background:#0c212c;color:#cfd8dc;padding:34px 0;font-size:.95rem;text-align:center}.site-footer a{color:#fff}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.hero .wrap{animation:none}}