
.mobile-hero{display:none}

:root{--gold:#d8a72d;--gold-light:#f1c455}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#000;color:#fff;font-family:Arial,Helvetica,sans-serif}
.stage{
  position:relative;width:min(100vw,1536px);aspect-ratio:1536/1024;margin:0 auto;
  background:url("assets/luxcis-approved-v8.png") center top/100% 100% no-repeat
}
.hotspot{position:absolute;display:block;border:0;background:transparent;cursor:pointer;padding:0}
.phone{left:84.4%;top:1.6%;width:14.6%;height:4.8%}
.whatsapp{left:84.4%;top:5.8%;width:14.6%;height:4.1%}
.hero-quote{left:1.6%;top:37.1%;width:16.4%;height:4.7%}
.hero-services{left:19%;top:37.1%;width:15%;height:4.7%}

.field-wrap{position:absolute;height:6.6%;z-index:40}
.field-wrap label{
  position:absolute;left:4%;top:0;z-index:45;color:#d6d6d6;background:#050505;padding:0 5px;
  text-transform:uppercase;font-size:clamp(8px,.72vw,12px);line-height:1.1;white-space:nowrap
}
.field{
  position:absolute;left:0;bottom:0;width:100%;height:80%;background:#050505;
  border:1px solid #555;border-radius:7px;color:#fff;padding:0 12px;
  font-size:clamp(9px,.92vw,15px);outline:none
}
.field:focus{border-color:var(--gold);box-shadow:0 0 0 2px rgba(216,167,45,.12)}
.pickup-wrap{left:2.8%;top:57.8%;width:18.6%}
.destination-wrap{left:22.6%;top:57.8%;width:17.4%}
.date-wrap{left:41.2%;top:57.8%;width:13.9%}
.time-wrap{left:56.2%;top:57.8%;width:11.6%}
.passengers-wrap{left:69.2%;top:57.8%;width:11.9%}
.luggage-wrap{left:82.2%;top:57.8%;width:14.8%}
.selector{display:flex;align-items:center;cursor:pointer}

.fallback-suggestions{
  position:absolute;left:0;right:0;top:100%;z-index:500;background:#080808;border:1px solid var(--gold);
  border-radius:0 0 7px 7px;display:none;max-height:300px;overflow:auto;box-shadow:0 16px 45px rgba(0,0,0,.8)
}
.fallback-suggestions.show{display:block}
.fallback-suggestions button{
  width:100%;padding:12px;text-align:left;border:0;border-bottom:1px solid #292929;
  background:#080808;color:#fff;cursor:pointer;font-size:.82rem;line-height:1.35
}
.fallback-suggestions button:hover{background:#151515;color:var(--gold-light)}

/* Google autocomplete dropdown must stay above the booking panel */
.pac-container{
  z-index:9999!important;background:#080808!important;border:1px solid var(--gold)!important;
  color:#fff!important;font-family:Arial,Helvetica,sans-serif!important
}
.pac-item{color:#ddd!important;border-top:1px solid #292929!important;padding:8px 10px!important}
.pac-item:hover{background:#151515!important}
.pac-item-query{color:#fff!important}

.return-button{
  position:absolute;left:2.8%;top:66.6%;width:14.4%;height:4.8%;
  border:1px solid var(--gold);border-radius:6px;background:#080808;color:var(--gold-light);
  text-transform:uppercase;font-weight:700;cursor:pointer
}
.metric{position:absolute;top:65.8%;height:9%;padding:12px 14px;display:flex;flex-direction:column;justify-content:center;overflow:hidden}
.metric>span{color:#aaa;text-transform:uppercase;font-size:clamp(7px,.65vw,11px)}
.metric strong{color:#fff;font-size:clamp(14px,1.25vw,20px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-height:24px}
.metric small{color:#999;font-size:clamp(7px,.55vw,10px)}
.distance-metric{left:19%;width:14.5%;border-left:1px solid #333}
.duration-metric{left:34.2%;width:13.5%;border-left:1px solid #333}
.fare-metric{left:48.6%;width:18.4%;border-left:1px solid #333}
.fare-metric strong{color:var(--gold-light);font-size:clamp(17px,1.55vw,25px)}
.request-booking{left:69.3%;top:66.4%;width:27.7%;height:5%}

.anchor{position:absolute;top:76%;left:0;width:1px;height:1px}
.footer-phone{left:3%;top:95.1%;width:16.5%;height:3.6%}
.footer-whatsapp{left:22.8%;top:95.1%;width:17.3%;height:3.6%}
.footer-email{left:40.7%;top:95.1%;width:19.8%;height:3.6%}
.footer-web{left:61.6%;top:95.1%;width:18.2%;height:3.6%}

.calendar-modal,.time-modal,.return-modal{
  position:fixed;inset:0;z-index:3000;display:flex;align-items:center;justify-content:center;
  padding:20px;background:rgba(0,0,0,.84);backdrop-filter:blur(7px)
}
.calendar-modal[hidden],.time-modal[hidden],.return-modal[hidden]{display:none}
.modal-card{
  width:min(430px,100%);background:#080808;border:1px solid var(--gold);
  border-radius:14px;padding:18px;box-shadow:0 20px 70px rgba(0,0,0,.7)
}
.modal-card h2{margin:0 0 16px;text-align:center;color:var(--gold-light);font-family:Georgia,serif}
.calendar-head{display:grid;grid-template-columns:44px 1fr 44px;align-items:center;gap:8px}
.calendar-head h2{margin:0}
.calendar-head button,.close-button,.confirm-button{
  min-height:42px;border:1px solid #444;border-radius:7px;background:#111;color:#fff;cursor:pointer
}
.weekday-row,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:5px}
.weekday-row{margin:16px 0 7px;color:#aaa;text-align:center;font-size:.7rem}
.calendar-grid button{
  aspect-ratio:1;border:1px solid #2e2e2e;border-radius:6px;background:#0d0d0d;color:#fff;cursor:pointer
}
.calendar-grid button:hover,.calendar-grid button.selected{
  border-color:var(--gold);background:rgba(216,167,45,.18);color:var(--gold-light)
}
.calendar-grid button.disabled{opacity:.25;pointer-events:none}
.close-button{width:100%;margin-top:10px}
.confirm-button{
  width:100%;background:linear-gradient(135deg,var(--gold-light),#c98f16);
  color:#080808;border-color:var(--gold);font-weight:700
}
.digital-clock{display:flex;align-items:center;justify-content:center;gap:10px;margin:18px 0}
.digital-clock select{
  width:120px;height:68px;background:#050505;border:1px solid var(--gold);
  color:#fff;border-radius:9px;font-size:2rem;text-align:center
}
.digital-clock span{font-size:2rem;color:var(--gold-light)}
.return-select{
  width:100%;min-height:48px;border:1px solid #333;border-radius:7px;background:#0c0c0c;color:#fff;
  display:flex;justify-content:space-between;align-items:center;padding:0 12px;margin-bottom:10px;cursor:pointer
}
.return-select span{color:#aaa;text-transform:uppercase;font-size:.7rem}
.return-select strong{color:var(--gold-light)}


/* V9 top navigation */
.top-nav{
  position:absolute;
  top:2.1%;
  left:38.5%;
  z-index:100;
  display:flex;
  align-items:center;
  gap:34px;
}
.top-nav a{
  color:#fff;
  text-decoration:none;
  text-transform:uppercase;
  font-size:clamp(10px,.82vw,14px);
  font-weight:600;
  letter-spacing:.03em;
  padding:8px 0 9px;
  border-bottom:2px solid transparent;
}
.top-nav a:hover,
.top-nav a.active{
  color:var(--gold-light);
  border-bottom-color:var(--gold);
}

/* Keep metric separators fully inside the gold booking panel */
.metric{
  border-left:0 !important;
  overflow:visible !important;
}
.metric::before{
  content:"";
  position:absolute;
  left:0;
  top:14%;
  bottom:14%;
  width:1px;
  background:#4a4a4a;
}
.distance-metric::before{
  display:none;
}
.distance-metric,
.duration-metric,
.fare-metric{
  top:66.0% !important;
  height:7.9% !important;
  padding-top:8px !important;
  padding-bottom:8px !important;
}
.distance-metric{left:18.8% !important;width:14.8% !important}
.duration-metric{left:34.1% !important;width:13.8% !important}
.fare-metric{left:48.5% !important;width:18.6% !important}

/* Restore the uninterrupted lower gold border of the booking panel */
.booking-bottom-line{
  position:absolute;
  left:1.65%;
  right:1.65%;
  top:74.45%;
  height:1px;
  background:var(--gold);
  z-index:18;
  pointer-events:none;
}

/* Ensure the navigation remains readable on narrower screens */
@media(max-width:900px){
  .top-nav{
    left:31%;
    gap:18px;
  }
  .top-nav a{
    font-size:10px;
  }
}


/* V12 Google status */
.booking-status{
  position:absolute;
  left:2.8%;
  top:63.65%;
  width:64.5%;
  min-height:18px;
  z-index:80;
  color:#bdbdbd;
  font-size:clamp(7px,.58vw,10px);
  line-height:1.2;
  pointer-events:none;
}
.booking-status.error{color:#ffb4b4}
.booking-status.success{color:#b9e6bd}
.booking-status.loading{color:var(--gold-light)}

/* Avoid browser validation icons and preserve the approved design */
.field::-webkit-search-cancel-button,
.field::-webkit-search-decoration{display:none}
.field:invalid{box-shadow:none}

/* Better touch behaviour without changing the approved desktop artwork */
@media(max-width:700px){
  .top-nav a,.field,.return-button{touch-action:manipulation}
}

.booking-details-modal{position:fixed;inset:0;z-index:10000;display:flex;align-items:center;justify-content:center;padding:20px;background:rgba(0,0,0,.82);backdrop-filter:blur(8px)}
.booking-details-modal[hidden]{display:none}
.booking-details-card{position:relative;width:min(720px,100%);max-height:90vh;overflow:auto;border:1px solid rgba(210,168,73,.65);border-radius:18px;padding:32px;background:linear-gradient(145deg,#101010,#030303);box-shadow:0 30px 90px rgba(0,0,0,.7);color:#fff}
.booking-modal-x{position:absolute;right:18px;top:12px;border:0;background:transparent;color:#d9b45e;font-size:34px;cursor:pointer}
.booking-eyebrow{margin:0 0 8px;color:#d9b45e;font-size:12px;letter-spacing:.22em}
.booking-details-card h2{margin:0 42px 8px 0;font-size:clamp(25px,4vw,38px);font-weight:500}
.booking-note{margin:0 0 24px;color:#c6c6c6;line-height:1.5}
.booking-contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.booking-contact-grid label span{display:block;margin:0 0 7px;color:#d8d8d8;font-size:13px}
.booking-contact-grid input,.booking-contact-grid textarea{box-sizing:border-box;width:100%;border:1px solid #3b3b3b;border-radius:9px;padding:13px 14px;background:#090909;color:#fff;font:inherit;outline:none}
.booking-contact-grid input:focus,.booking-contact-grid textarea:focus{border-color:#d9b45e;box-shadow:0 0 0 3px rgba(217,180,94,.12)}
.booking-contact-wide{grid-column:1/-1}
.booking-honeypot{position:absolute!important;left:-10000px!important;width:1px!important;height:1px!important;overflow:hidden!important}
.send-booking-request{width:100%;margin-top:18px;border:1px solid #e0bd69;border-radius:9px;padding:15px 18px;background:linear-gradient(135deg,#d7ae50,#f0d48b);color:#050505;font-size:15px;font-weight:700;letter-spacing:.04em;cursor:pointer}
.send-booking-request:disabled{opacity:.55;cursor:wait}
.booking-submit-status{min-height:20px;margin-top:16px;color:#d8d8d8;line-height:1.45}
.booking-submit-status.error{color:#ffb5b5}.booking-submit-status.success{color:#bce7c1}.booking-submit-status.loading{color:#e4c775}
@media(max-width:650px){.booking-details-card{padding:26px 18px}.booking-contact-grid{grid-template-columns:1fr}.booking-contact-wide{grid-column:auto}}


/* =========================================================
   V16 — TRUE MOBILE HOMEPAGE
   Desktop design remains unchanged.
   ========================================================= */
@media (max-width:700px){
  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
    background:#050505;
  }

  body{
    padding:0;
  }

  .stage{
    width:100%;
    max-width:100%;
    min-height:100vh;
    margin:0;
    padding:92px 18px 42px;
    aspect-ratio:auto;
    background:
      radial-gradient(circle at 50% 8%,rgba(216,167,45,.16),transparent 30%),
      linear-gradient(180deg,#080808 0%,#030303 100%);
  }
.top-nav{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:2000;
    display:flex;
    justify-content:center;
    gap:0;
    width:100%;
    padding:13px 8px;
    border-bottom:1px solid rgba(216,167,45,.55);
    background:rgba(3,3,3,.96);
    backdrop-filter:blur(12px);
  }

  .top-nav a{
    flex:1;
    max-width:130px;
    padding:10px 4px;
    text-align:center;
    font-size:11px;
    letter-spacing:.04em;
  }

  .phone,
  .whatsapp{
    position:relative;
    left:auto;
    top:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:50px;
    margin:0 auto 12px;
    border:1px solid var(--gold);
    border-radius:8px;
    color:var(--gold-light);
    background:#0a0a0a;
    text-decoration:none;
    font-size:13px;
    font-weight:700;
    letter-spacing:.04em;
    text-transform:uppercase;
  }

  .phone::after{content:"Call 07341 923368"}
  .whatsapp::after{content:"Message us on WhatsApp"}

  .hero-quote,
  .hero-services{
    display:none;
  }

  .booking{
    position:relative;
    display:grid;
    grid-template-columns:1fr;
    gap:15px;
    width:100%;
    margin-top:28px;
    padding:24px 16px 22px;
    border:1px solid rgba(216,167,45,.72);
    border-radius:16px;
    background:linear-gradient(145deg,#101010,#050505);
    box-shadow:0 24px 70px rgba(0,0,0,.55);
  }

  .booking::before{
    content:"GET AN INSTANT ESTIMATE";
    display:block;
    margin:0 0 5px;
    color:var(--gold-light);
    text-align:center;
    font-family:Georgia,serif;
    font-size:23px;
    letter-spacing:.035em;
  }

  .field-wrap{
    position:relative;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:68px;
  }

  .field-wrap label{
    left:12px;
    top:0;
    padding:0 6px;
    font-size:10px;
    background:#0d0d0d;
  }

  .field{
    left:0;
    bottom:0;
    width:100%;
    height:55px;
    padding:0 14px;
    border-color:#4b4b4b;
    border-radius:8px;
    font-size:16px;
  }

  select.field{
    padding-right:32px;
  }

  .fallback-suggestions{
    top:65px;
    max-height:240px;
  }

  .return-button{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:50px;
    margin:1px 0 0;
    font-size:12px;
  }

  .booking-status{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    min-height:0;
    margin:-4px 0 0;
    font-size:12px;
    line-height:1.4;
  }

  .metric{
    position:relative;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:72px;
    padding:12px 14px!important;
    overflow:hidden!important;
    border:1px solid #2e2e2e!important;
    border-radius:8px;
    background:#090909;
  }

  .metric::before{
    display:none!important;
  }

  .metric>span{
    font-size:10px;
    letter-spacing:.05em;
  }

  .metric strong{
    min-height:auto;
    margin-top:3px;
    font-size:20px;
  }

  .metric small{
    font-size:10px;
  }

  .fare-metric{
    border-color:rgba(216,167,45,.55)!important;
  }

  .fare-metric strong{
    font-size:27px;
  }

  .request-booking{
    position:relative;
    left:auto;
    top:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:56px;
    margin-top:3px;
    border:1px solid var(--gold);
    border-radius:8px;
    background:linear-gradient(135deg,var(--gold-light),#c98f16);
    color:#050505;
    font-size:14px;
    font-weight:800;
    letter-spacing:.05em;
    text-transform:uppercase;
  }

  .request-booking::after{
    content:"Request booking";
  }

  .booking-bottom-line{
    display:none;
  }

  .anchor{
    position:relative;
    top:auto;
    left:auto;
    display:block;
  }

  .footer-phone,
  .footer-whatsapp,
  .footer-email,
  .footer-web{
    position:relative;
    left:auto;
    top:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:48px;
    margin:12px 0 0;
    border:1px solid #303030;
    border-radius:8px;
    color:#dedede;
    background:#080808;
    text-decoration:none;
    font-size:12px;
    font-weight:700;
    letter-spacing:.03em;
    text-transform:uppercase;
  }

  .footer-phone{margin-top:35px}
  .footer-phone::after{content:"Call LUXCIS"}
  .footer-whatsapp::after{content:"WhatsApp"}
  .footer-email::after{content:"info@luxcis.co.uk"}
  .footer-web::after{content:"luxcis.co.uk"}

  .calendar-modal,
  .time-modal,
  .return-modal{
    padding:12px;
    align-items:flex-end;
  }

  .modal-card{
    width:100%;
    max-height:88vh;
    overflow:auto;
    border-radius:18px 18px 10px 10px;
    padding:20px 14px 16px;
  }

  .calendar-grid{
    gap:4px;
  }

  .calendar-grid button{
    min-height:42px;
    aspect-ratio:auto;
  }

  .digital-clock select{
    width:42%;
    height:64px;
  }

  .booking-details-modal{
    align-items:flex-end;
    padding:10px;
  }

  .booking-details-card{
    width:100%;
    max-height:92vh;
    border-radius:20px 20px 10px 10px;
    padding:28px 17px 18px;
  }

  .booking-details-card h2{
    margin-right:34px;
    font-size:27px;
    line-height:1.15;
  }

  .booking-contact-grid{
    grid-template-columns:1fr;
    gap:13px;
  }

  .booking-contact-wide{
    grid-column:auto;
  }

  .booking-contact-grid input,
  .booking-contact-grid textarea{
    font-size:16px;
  }
}


/* =========================================================
   V16.2 — MOBILE VERSION MATCHING THE DESKTOP IDENTITY
   ========================================================= */
@media (max-width:700px){
  html,body{
    width:100%;
    max-width:100%;
    overflow-x:hidden;
    background:#000;
  }

  body{padding:0}

  .stage{
    width:100%;
    max-width:100%;
    min-height:100vh;
    margin:0;
    padding:68px 16px 36px;
    aspect-ratio:auto;
    background:#000;
  }

  .top-nav{
    position:fixed;
    top:0;
    left:0;
    right:0;
    z-index:3000;
    display:flex;
    justify-content:center;
    width:100%;
    gap:0;
    padding:11px 8px;
    border-bottom:1px solid rgba(216,167,45,.65);
    background:rgba(2,2,2,.96);
    backdrop-filter:blur(10px);
  }

  .top-nav a{
    flex:1;
    max-width:135px;
    padding:10px 4px;
    text-align:center;
    font-size:11px;
  }

  .mobile-hero{
    position:relative;
    display:block;
    width:calc(100% + 32px);
    min-height:620px;
    margin:0 -16px 24px;
    padding:24px 20px 32px;
    overflow:hidden;
    border-bottom:1px solid rgba(216,167,45,.75);
    background:
      linear-gradient(180deg,rgba(0,0,0,.12) 0%,rgba(0,0,0,.18) 38%,rgba(0,0,0,.96) 88%,#000 100%),
      url("assets/luxcis-cardiff-tesla-mobile.jpg") 58% 31%/auto 54% no-repeat,
      #000;
  }

  .mobile-hero::after{
    content:"";
    position:absolute;
    left:20px;
    right:20px;
    bottom:16px;
    height:1px;
    background:linear-gradient(90deg,transparent,var(--gold),transparent);
    opacity:.8;
  }

  .mobile-logo{
    position:relative;
    z-index:2;
    display:block;
    width:min(360px,94%);
    height:auto;
    margin:4px auto 0;
  }

  .mobile-hero-copy{
    position:absolute;
    z-index:2;
    left:20px;
    right:20px;
    bottom:38px;
  }

  .mobile-hero-copy h1{
    margin:0;
    color:#fff;
    font-family:Georgia,serif;
    font-size:clamp(40px,12vw,60px);
    font-weight:500;
    line-height:1.02;
    letter-spacing:-.02em;
    text-shadow:0 3px 20px #000;
  }

  .mobile-hero-copy h1 span{color:var(--gold-light)}

  .mobile-hero-copy p{
    max-width:520px;
    margin:17px 0 0;
    color:#e2e2e2;
    font-size:15px;
    line-height:1.52;
    text-shadow:0 2px 12px #000;
  }

  .mobile-hero-actions{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:12px;
    margin-top:22px;
  }

  .mobile-hero-actions button,
  .mobile-hero-actions a{
    display:flex;
    align-items:center;
    justify-content:center;
    min-height:50px;
    padding:10px 12px;
    border:1px solid var(--gold);
    border-radius:7px;
    text-decoration:none;
    text-transform:uppercase;
    font-size:11px;
    font-weight:800;
    letter-spacing:.04em;
  }

  .mobile-hero-actions button{
    background:linear-gradient(135deg,var(--gold-light),#c98f16);
    color:#050505;
  }

  .mobile-hero-actions a{
    background:rgba(0,0,0,.82);
    color:#fff;
  }

  .phone,.whatsapp{
    position:relative;
    left:auto;
    top:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:49px;
    margin:0 auto 10px;
    border:1px solid var(--gold);
    border-radius:7px;
    background:#080808;
    color:var(--gold-light);
    text-decoration:none;
    text-transform:uppercase;
    font-size:12px;
    font-weight:700;
  }
  .phone::after{content:"Call 07341 923368"}
  .whatsapp::after{content:"WhatsApp LUXCIS"}

  .hero-quote,.hero-services{display:none}

  .booking{
    position:relative;
    display:grid;
    grid-template-columns:1fr;
    gap:14px;
    width:100%;
    margin:22px 0 0;
    padding:24px 16px 22px;
    border:1px solid var(--gold);
    border-radius:12px;
    background:linear-gradient(145deg,#0e0e0e,#030303);
    box-shadow:0 20px 60px rgba(0,0,0,.55);
  }

  .booking::before{
    content:"GET AN INSTANT QUOTE";
    display:block;
    margin-bottom:4px;
    color:var(--gold-light);
    text-align:center;
    font-family:Georgia,serif;
    font-size:23px;
    letter-spacing:.03em;
  }

  .field-wrap{
    position:relative;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:68px;
  }

  .field-wrap label{
    left:12px;
    top:0;
    padding:0 6px;
    background:#0c0c0c;
    font-size:10px;
  }

  .field{
    left:0;
    bottom:0;
    width:100%;
    height:55px;
    padding:0 14px;
    border-color:#4a4a4a;
    border-radius:7px;
    font-size:16px;
  }

  .return-button,
  .request-booking{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    height:52px;
    border-radius:7px;
  }

  .request-booking{
    display:flex;
    align-items:center;
    justify-content:center;
    margin-top:2px;
    background:linear-gradient(135deg,var(--gold-light),#c98f16);
    color:#050505;
    font-weight:800;
  }
  .request-booking::after{content:"Request booking"}

  .booking-status{
    position:relative;
    left:auto;
    top:auto;
    width:100%;
    min-height:0;
    margin:-3px 0 0;
    font-size:12px;
  }

  .metric{
    position:relative;
    left:auto!important;
    top:auto!important;
    width:100%!important;
    height:auto!important;
    min-height:74px;
    padding:12px 14px!important;
    overflow:hidden!important;
    border:1px solid #303030!important;
    border-radius:7px;
    background:#080808;
  }
  .metric::before{display:none!important}
  .metric strong{min-height:auto;font-size:21px}
  .fare-metric{
    border-color:rgba(216,167,45,.65)!important;
  }
  .fare-metric strong{font-size:28px}

  .booking-bottom-line{display:none}
  .anchor{position:relative;top:auto;left:auto;display:block}

  .footer-phone,.footer-whatsapp,.footer-email,.footer-web{
    position:relative;
    left:auto;
    top:auto;
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:47px;
    margin:10px 0 0;
    border:1px solid #303030;
    border-radius:7px;
    background:#080808;
    color:#e0e0e0;
    text-decoration:none;
    text-transform:uppercase;
    font-size:11px;
    font-weight:700;
  }
  .footer-phone{margin-top:30px}
  .footer-phone::after{content:"07341 923368"}
  .footer-whatsapp::after{content:"WhatsApp"}
  .footer-email::after{content:"info@luxcis.co.uk"}
  .footer-web::after{content:"luxcis.co.uk"}

  .calendar-modal,.time-modal,.return-modal,.booking-details-modal{
    padding:10px;
    align-items:flex-end;
  }
  .modal-card,.booking-details-card{
    width:100%;
    max-height:91vh;
    overflow:auto;
    border-radius:18px 18px 8px 8px;
  }
  .booking-contact-grid{grid-template-columns:1fr}
  .booking-contact-wide{grid-column:auto}
  .booking-contact-grid input,.booking-contact-grid textarea{font-size:16px}
}


/* =========================================================
   V17 — MOBILE SERVICES + LUXCIS TRANSFER REBRAND
   ========================================================= */
.mobile-service-showcase{
  display:none;
}

@media (max-width:700px){
  .mobile-service-showcase{
    display:block;
    width:100%;
    margin:26px 0 4px;
    padding:26px 14px 14px;
    border:1px solid rgba(216,167,45,.72);
    border-radius:12px;
    background:
      radial-gradient(circle at 50% 0%,rgba(216,167,45,.10),transparent 42%),
      linear-gradient(145deg,#0d0d0d,#030303);
    text-align:center;
    box-shadow:0 20px 55px rgba(0,0,0,.45);
  }

  .mobile-service-kicker{
    margin:0 0 7px;
    color:var(--gold-light);
    font-size:10px;
    font-weight:800;
    letter-spacing:.22em;
    text-transform:uppercase;
  }

  .mobile-service-showcase h2{
    margin:0 0 18px;
    color:#fff;
    font-family:Georgia,serif;
    font-size:26px;
    font-weight:500;
    line-height:1.15;
  }

  .mobile-service-showcase img{
    display:block;
    width:100%;
    height:auto;
    border:1px solid rgba(216,167,45,.62);
    border-radius:8px;
  }
}


/* V17.4 — MOBILE PREMIUM SERVICE PANEL */
.mobile-premium-panel{display:none}

@media (max-width:700px){
  .mobile-premium-panel{
    display:block;
    width:100%;
    margin:22px 0 24px;
    padding:26px 16px 18px;
    border:1px solid rgba(216,167,45,.72);
    border-radius:12px;
    background:
      radial-gradient(circle at 50% 0%,rgba(216,167,45,.12),transparent 45%),
      linear-gradient(145deg,#0f0f0f,#040404);
    box-shadow:0 20px 60px rgba(0,0,0,.48);
    text-align:center;
  }

  .mobile-premium-kicker{
    margin:0 0 7px;
    color:var(--gold-light);
    font-size:10px;
    font-weight:800;
    letter-spacing:.22em;
    text-transform:uppercase;
  }

  .mobile-premium-panel h2{
    margin:0 0 20px;
    color:#fff;
    font-family:Georgia,serif;
    font-size:25px;
    font-weight:500;
    line-height:1.18;
  }

  .mobile-premium-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .mobile-premium-item{
    min-height:128px;
    padding:16px 12px 13px;
    border:1px solid #2f2f2f;
    border-radius:8px;
    background:rgba(5,5,5,.88);
    text-align:left;
  }

  .mobile-premium-item::before{
    content:"";
    display:block;
    width:9px;
    height:9px;
    margin:0 0 12px 2px;
    border:1px solid var(--gold);
    transform:rotate(45deg);
  }

  .mobile-premium-item strong{
    display:block;
    margin-bottom:7px;
    color:var(--gold-light);
    font-family:Georgia,serif;
    font-size:16px;
    font-weight:500;
    line-height:1.2;
  }

  .mobile-premium-item span{
    display:block;
    color:#bdbdbd;
    font-size:11px;
    line-height:1.45;
  }
}

@media (max-width:390px){
  .mobile-premium-grid{grid-template-columns:1fr}
  .mobile-premium-item{min-height:auto}
}


/* V17.5 — exact desktop feature set on mobile */
@media (max-width:700px){
  .mobile-premium-panel{
    padding:14px;
  }

  .mobile-premium-panel .mobile-premium-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
  }

  .mobile-premium-panel .mobile-premium-item{
    min-height:102px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    padding:14px 12px;
  }

  .mobile-premium-panel .mobile-premium-item strong{
    font-family:inherit;
    font-size:14px;
    font-weight:600;
    text-transform:uppercase;
    letter-spacing:.02em;
  }

  .mobile-premium-panel .mobile-premium-item span{
    font-size:12px;
  }

  .mobile-premium-panel .mobile-premium-wide{
    grid-column:1 / -1;
    min-height:88px;
    text-align:center;
    align-items:center;
  }
}


/* V17.6 — MOBILE CLEAN HEADER + GOLD CONTACT TILES */
@media (max-width:700px){
  /* Hide the two top Call / WhatsApp tiles on mobile only */
  .stage > .phone,
  .stage > .whatsapp{
    display:none !important;
  }

  /* Let the mobile page begin cleanly from the LUXCIS logo */
  .mobile-hero{
    margin-top:0 !important;
  }

  /* Gold frames for the lower contact tiles under Our Services */
  .footer-phone,
  .footer-whatsapp,
  .footer-email,
  .footer-web{
    border:1px solid #d8a72d !important;
    border-radius:8px;
    box-shadow:
      inset 0 0 0 1px rgba(255,255,255,.03),
      0 0 18px rgba(216,167,45,.12);
  }
}

.luxcis-footer{
text-align:center;
padding:34px 20px 26px;
border-top:1px solid rgba(216,167,45,.35);
background:#050505;
}
.luxcis-footer p{
margin:0;
color:#d8a72d;
font-size:14px;
letter-spacing:.04em;
}
.luxcis-footer-small{
margin-top:8px!important;
color:#9a9a9a!important;
font-size:12px!important;
}

.luxcis-footer-links{
margin-top:14px;
display:flex;
justify-content:center;
align-items:center;
gap:10px;
flex-wrap:wrap;
font-size:12px;
}
.luxcis-footer-links a{
color:#d8a72d;
text-decoration:none;
transition:opacity .2s;
}
.luxcis-footer-links a:hover{
opacity:.75;
}
.luxcis-footer-links span{
color:#666;
}


/* V17.9 — desktop logo/layout recovery */
.luxcis-footer{
  position:relative;
  z-index:5;
  width:100%;
  box-sizing:border-box;
}

@media (min-width:701px){
  .stage{
    margin-bottom:0 !important;
  }

  .luxcis-footer{
    clear:both;
    display:block;
  }
}
