/*
Theme Name: Yarra Valley Taxis
Description: Custom theme for Yarra Valley Taxis. Direction D: Refined Signature.
Author: MH Tech Solutions
Version: 1.0.0
Text Domain: yvt
*/

:root{
  --bg:#FFFFFF;
  --dark:#171717;
  --accent:#FF6600;
  --muted:#8A9199;
  --line:#ECECEC;
  --ink:#2A2A2A;

  --font-display:'Barlow Condensed', sans-serif;
  --font-body:'Barlow', sans-serif;

  --container:1180px;
  --radius:2px;
}

*, *::before, *::after{ box-sizing:border-box; }

html{ scroll-behavior:smooth; }

body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

img{ max-width:100%; height:auto; display:block; }

a{ color:inherit; text-decoration:none; }

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:800;
  text-transform:uppercase;
  line-height:1.02;
  letter-spacing:.005em;
  margin:0 0 .5em;
  text-wrap:balance;
}

h1{ font-size:clamp(34px,5.2vw,58px); }
h2{ font-size:clamp(26px,3.6vw,38px); }
h3{ font-size:20px; }

p{ margin:0 0 1em; }

.container{ max-width:var(--container); margin:0 auto; padding:0 24px; }

.eyebrow{
  font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); font-weight:700; margin:0 0 14px; display:block;
  font-family:var(--font-body);
}

.btn{
  display:inline-block;
  background:var(--dark);
  color:#fff;
  border-radius:var(--radius);
  padding:14px 32px;
  font-family:var(--font-display);
  font-weight:700;
  font-size:15px;
  letter-spacing:.08em;
  text-transform:uppercase;
  border-bottom:3px solid var(--accent);
  border-top:none; border-left:none; border-right:none;
  cursor:pointer;
}
.btn:hover{ background:#000; }
.btn.btn-outline{
  background:transparent; color:var(--dark); border:1.5px solid var(--dark); border-bottom:1.5px solid var(--accent);
}

.status-pill{
  display:inline-flex; align-items:center; gap:7px; font-size:12px; font-weight:600;
  letter-spacing:.06em; text-transform:uppercase; color:var(--muted); font-family:var(--font-body);
}
.status-pill .dot{ width:7px; height:7px; border-radius:50%; background:var(--accent); }

section{ padding:72px 0; }
section.tight{ padding:40px 0; }
.section-line{ border-top:1px solid var(--line); }

/* Fare board (signature component) */
.fareboard{ background:var(--dark); border-radius:var(--radius); padding:26px 28px 10px; }
.fareboard .fb-label{
  font-family:var(--font-display); font-size:12px; letter-spacing:.14em; text-transform:uppercase;
  color:var(--accent); font-weight:700; margin-bottom:16px;
}
.fb-row{
  display:flex; justify-content:space-between; gap:16px; padding:14px 0;
  border-top:1px solid #333; font-family:var(--font-display); text-transform:uppercase; letter-spacing:.02em;
}
.fb-row .route{ color:#e6e6e6; font-size:15px; font-weight:600; }
.fb-row .fare{ color:var(--accent); font-size:15px; font-weight:700; font-variant-numeric:tabular-nums; white-space:nowrap; }
.fareboard .fb-note{ font-family:var(--font-body); text-transform:none; letter-spacing:0; font-size:12px; color:#888; padding:14px 0 4px; border-top:1px solid #333; }

/* Services strip */
.services-strip{ display:flex; align-items:center; gap:28px; flex-wrap:wrap; }
.services-strip .lbl{ font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); font-weight:700; }
.services-strip .items{ display:flex; gap:0; flex-wrap:wrap; }
.services-strip .items a{ font-family:var(--font-display); font-weight:700; font-size:15px; letter-spacing:.03em; text-transform:uppercase; padding:8px 20px; border-left:1px solid var(--line); }
.services-strip .items a:first-child{ border-left:none; padding-left:0; }
.services-strip .items a:hover{ color:var(--accent); }

/* Cards grid (services / fleet) */
.card-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1px; background:var(--line); border:1px solid var(--line); }
.card{ background:var(--bg); padding:32px 26px; }
.card .card-eyebrow{ font-size:11px; letter-spacing:.12em; text-transform:uppercase; color:var(--accent); font-weight:700; margin-bottom:10px; }
.card h3{ margin-bottom:10px; }
.card p{ font-size:14.5px; color:#555; margin-bottom:16px; }
.card a.more{ font-family:var(--font-display); font-size:13px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; border-bottom:2px solid var(--accent); padding-bottom:2px; }

/* Dark section band (breaks up long stretches of white) */
.section-dark{ background:var(--dark); }
.section-dark .eyebrow{ color:var(--accent); }
.card-grid.dark{ background:#2b2b2b; border-color:#2b2b2b; }
.card-grid.dark .card{ background:var(--dark); color:#e6e6e6; }
.card-grid.dark .card h3{ color:#fff; }
.card-grid.dark .card p{ color:#a8a8a8; }

/* Subtle tint band (alternative to pure white, stays in-palette) */
.section-tint{ background:#F7F7F7; }

/* Header / Footer */
.site-header{ border-bottom:1px solid var(--line); position:sticky; top:0; background:var(--bg); z-index:50; }
.site-header .container{ display:flex; align-items:center; justify-content:space-between; padding-top:8px; padding-bottom:8px; gap:20px; }
.site-header .logo{ display:flex; align-items:center; }
.site-header .logo img{ height:78px; width:auto; }
@media (max-width:880px){
  .site-header .logo img{ height:60px; }
}
.site-header nav ul{ list-style:none; display:flex; gap:26px; margin:0; padding:0; }
.site-header nav a{ font-size:14px; font-weight:600; }
.site-header nav a:hover{ color:var(--accent); }
.site-header .header-right{ display:flex; align-items:center; gap:22px; }
.site-header .phone{ font-weight:700; font-size:14.5px; }
.header-nav-toggle{ display:none; }
.mobile-nav{ display:none; }

@media (max-width:880px){
  .site-header nav, .site-header .header-right .status-pill, .site-header .header-right .btn{ display:none; }

  .header-nav-toggle{
    display:flex; flex-direction:column; justify-content:center; align-items:center; gap:5px;
    width:38px; height:38px; background:none; border:none; padding:0; cursor:pointer;
  }
  .header-nav-toggle span{ width:22px; height:2px; background:var(--dark); transition:transform .2s, opacity .2s; }
  .header-nav-toggle[aria-expanded="true"] span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .header-nav-toggle[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .header-nav-toggle[aria-expanded="true"] span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

  .mobile-nav{
    display:block; max-height:0; overflow:hidden; background:var(--bg); border-top:1px solid var(--line);
    transition:max-height .25s ease;
  }
  .mobile-nav.open{ max-height:480px; }
  .mobile-nav ul{ list-style:none; margin:0; padding:18px 24px 0; display:flex; flex-direction:column; gap:16px; }
  .mobile-nav li a{ font-size:16px; font-weight:600; }
  .mobile-nav > .btn, .mobile-nav > a.phone{ margin-left:24px; margin-right:24px; }
  .mobile-nav{ padding-bottom:0; }
  .mobile-nav.open{ padding-bottom:20px; }
}

.site-footer{ background:var(--dark); color:#d8d8d8; padding:56px 0 26px; margin-top:0; }
.site-footer .footer-grid{ display:grid; grid-template-columns:1.4fr 1fr 1fr 1fr; gap:36px; margin-bottom:40px; }
.site-footer h4{ font-family:var(--font-display); color:#fff; font-size:14px; letter-spacing:.08em; margin-bottom:16px; }
.site-footer ul{ list-style:none; margin:0; padding:0; }
.site-footer li{ margin-bottom:9px; font-size:14px; }
.site-footer a:hover{ color:var(--accent); }
.site-footer .foot-bottom{ border-top:1px solid #333; padding-top:22px; font-size:12.5px; color:#888; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px; }
@media (max-width:760px){ .site-footer .footer-grid{ grid-template-columns:1fr 1fr; } }

/* Hero */
.hero{ padding:64px 0 0; }
.hero-grid{ display:grid; grid-template-columns:1.15fr .85fr; gap:48px; align-items:start; }
@media (max-width:880px){ .hero-grid{ grid-template-columns:1fr; } }
.hero h1 span{ color:var(--accent); }
.hero p.lead{ font-size:17px; color:#4a4a4a; max-width:440px; margin-bottom:28px; }

/* Suburb / service page hero */
.page-hero{ padding:48px 0 40px; border-bottom:1px solid var(--line); }
.page-hero .eyebrow{ margin-bottom:10px; }
.page-hero p.lead{ font-size:16.5px; color:#4a4a4a; max-width:640px; }

.breadcrumb{ font-size:12.5px; color:var(--muted); margin-bottom:16px; }
.breadcrumb a:hover{ color:var(--accent); }

/* FAQ */
.faq-item{ border-top:1px solid var(--line); padding:20px 0; }
.faq-item h3{ font-family:var(--font-body); text-transform:none; font-weight:700; font-size:16px; margin-bottom:8px; }
.faq-item p{ font-size:14.5px; color:#555; margin:0; }

/* Regions / suburb pill list */
.pill-row{ display:flex; flex-wrap:wrap; gap:8px; }
.pill-row a{ font-size:13px; border:1px solid var(--line); border-radius:999px; padding:7px 16px; }
.pill-row a:hover{ border-color:var(--accent); color:var(--accent); }

.skip-link{ position:absolute; left:-9999px; top:0; background:var(--dark); color:#fff; padding:12px 20px; z-index:100; }
.skip-link:focus{ left:12px; top:12px; }

/* Fare estimator */
.fe-grid{ display:grid; grid-template-columns:1fr 1fr; gap:32px; align-items:start; }
@media (max-width:880px){ .fe-grid{ grid-template-columns:1fr; } }
.fe-panel{ border:1px solid var(--line); border-radius:var(--radius); padding:28px; }
.fe-field{ margin-bottom:18px; }
.fe-field label{ display:block; font-size:12px; font-weight:700; letter-spacing:.04em; text-transform:uppercase; color:var(--muted); margin-bottom:6px; }
.fe-field input{ width:100%; padding:12px 14px; border:1px solid var(--line); border-radius:var(--radius); font-family:var(--font-body); font-size:15px; }
.fe-field input:focus{ outline:none; border-color:var(--accent); }
.fe-row-2{ display:grid; grid-template-columns:1fr 1fr; gap:16px; }
.fe-vehicles{ display:grid; gap:10px; margin:22px 0; }
.fe-vehicle{ display:grid; grid-template-columns:1fr auto auto; align-items:center; gap:10px; border:1.5px solid var(--line); border-radius:var(--radius); padding:12px 16px; cursor:pointer; }
.fe-vehicle.selected{ border-color:var(--accent); background:#FFF7F0; }
.fe-vehicle input{ display:none; }
.fe-vehicle .fv-name{ font-weight:700; font-size:14.5px; }
.fe-vehicle .fv-pax{ font-size:12.5px; color:var(--muted); }
.fe-vehicle .fv-price{ font-family:var(--font-display); font-weight:700; font-size:14px; color:var(--accent); white-space:nowrap; }
.fe-tariff-badge{ display:none; background:#FFF3E8; border:1px solid #FFD6B0; border-radius:var(--radius); padding:10px 14px; font-size:13px; font-weight:600; color:#a35b1a; margin-bottom:16px; }
.fe-result{ display:none; background:var(--dark); color:#fff; border-radius:var(--radius); padding:20px 22px; }
.fe-result-head{ display:flex; justify-content:space-between; align-items:baseline; font-family:var(--font-display); text-transform:uppercase; letter-spacing:.04em; font-size:13px; color:#bbb; padding-bottom:14px; border-bottom:1px solid #333; margin-bottom:10px; }
.fe-result-head span:last-child{ font-size:26px; color:var(--accent); font-weight:800; }
.fe-row{ display:flex; justify-content:space-between; font-size:13.5px; padding:8px 0; color:#ddd; border-top:1px solid #333; }
.fe-row:first-of-type{ border-top:none; }
#feAirportRow, #feSurchargeRow, #feMinRow{ display:none; }
.fe-disclaimer{ font-size:11.5px; color:#888; margin:12px 0 0; }
.fe-placeholder{ text-align:center; padding:24px; color:var(--muted); font-size:14px; border:1px dashed var(--line); border-radius:var(--radius); }
.fe-map-panel{ border-radius:var(--radius); overflow:hidden; border:1px solid var(--line); min-height:420px; }
#feMap{ width:100%; height:100%; min-height:420px; }

/* Service page */
.service-layout{ display:grid; grid-template-columns:1.6fr 1fr; gap:48px; align-items:start; }
@media (max-width:880px){ .service-layout{ grid-template-columns:1fr; } }
.service-content{ font-size:16px; }
.service-content h2{ margin-top:1.4em; }
.service-content ul{ padding-left:20px; }
.service-content li{ margin-bottom:8px; }
.service-aside{ position:sticky; top:90px; }