/* MN Car Hire — Live layout, coastal blue / navy / white refresh
   Production styles for the linked website and enquiry form.
   Colours are intentionally restrained, in line with the approved MN social identity. */
:root {
  --black: #0c203b; --charcoal: #122b4b; --panel: #193554;
  --ivory: #f8fbff; --cream: #edf7ff; --paper: #ffffff;
  --gold: #2b91cf; --gold-deep: #1762a3; --gold-light: #bfe9ff;
  --text: #172e4a; --muted: #5b7188; --line: #d3e5f2;
  --green: #168b4a; --green-hover: #0c7339;
  --shadow: 0 24px 65px rgba(15,57,92,.10);
}
*, *::before, *::after {box-sizing:border-box}
html {scroll-behavior:smooth;scroll-padding-top:95px}
body {margin:0;background:var(--ivory);color:var(--text);font-family: "Segoe UI", Inter, Arial, sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}
h1,h2,h3,p{margin-top:0}h1,h2{font-family:Georgia,"Times New Roman",serif;letter-spacing:-.045em;font-weight:600}
a {color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}button{cursor:pointer}
img,svg{max-width:100%}img{display:block}svg{flex-shrink:0}
.container{width:min(1180px,calc(100% - 68px));margin-inline:auto}
[hidden]{display:none!important}
.skip-link {position:absolute;left:14px;top:-80px;z-index:120;padding:14px 18px;background:var(--gold);color:var(--black)}
.skip-link:focus{top:12px}
:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
::selection{background:#a9e0fd;color:#0c203b}
/* Navigation / wordmark */
.site-header {position:sticky;top:0;z-index:50;background:#0c203b;border-bottom:1px solid rgba(87,170,225,.28)}
.nav-wrap{display:flex;align-items:center;justify-content:space-between;gap:28px;height:96px}
.brand{display:flex;align-items:center;min-width:111px}
.brand img{width:123px;height:auto}
nav{display:flex;align-items:center;gap:38px;color:#f4fbff;font-size:13px;font-weight:600;letter-spacing:.018em}
nav a:not(.nav-book):hover{color:var(--gold-light)}
nav .nav-book{padding:15px 25px;border-radius:999px;background:linear-gradient(115deg,#b4e2ff,var(--gold));color:#122c4a;font-weight:750;transition:filter .2s}
nav .nav-book:hover{filter:brightness(1.06)}
.mobile-header-book{display:none}
.button{display:inline-flex;align-items:center;justify-content:center;gap:11px;border-radius:10px;min-height:54px;padding:16px 25px;font-size:13px;letter-spacing:.025em;font-weight:750;border:1px solid transparent;transition:background .2s,transform .2s,box-shadow .2s;text-align:center;white-space:normal}
.button:hover{transform:translateY(-2px)}
.button-primary{background:linear-gradient(120deg,#78c6f5,#2b91cf);color:#0b263f;box-shadow:0 10px 20px rgba(32,122,176,.16)}
.button-primary:hover{background:#3fa9ed}
.button-outline{background:#f7fbff;color:#142e4a;border-color:#7bbfe4}
.button-outline:hover{background:#ebf6ff}
.button-whatsapp{background:var(--green);color:#fff;border-color:var(--green);box-shadow:0 9px 19px rgba(17,95,50,.14)}
.button-whatsapp:hover{background:var(--green-hover);border-color:var(--green-hover)}
.button-whatsapp svg{width:20px;height:20px}
.button-full{width:100%}
/* Hero — original layout unchanged, full uncropped vehicle, brighter coastal daylight */
.hero-final{background:linear-gradient(118deg,#fafdff 0%,#eff8ff 72%,#d8edf9 100%);border-bottom:1px solid #d5e9f6;overflow:hidden}
.hero-final .hero-inner{min-height:650px;padding:69px 0 72px;display:grid;grid-template-columns:minmax(0,.98fr) minmax(0,1.02fr);gap:56px;align-items:center}
.hero-content{max-width:600px}
.eyebrow,.section-kicker{font-size:11px;font-weight:800;letter-spacing:.19em;color:#1775b5;margin:0}
.eyebrow:before{content:"";height:1px;width:26px;background:#2798d6;display:inline-block;vertical-align:middle;margin-right:10px}
.hero-final h1{font-size:clamp(49px,5.2vw,78px);color:#0c2645;line-height:1.07;margin:22px 0 23px;letter-spacing:-.058em}
h1 em,h2 em{font-weight:500;color:#2179b5;font-style:normal}
.hero-lead{font-size:17px;line-height:1.75;color:#58718a;max-width:480px;margin-bottom:24px}
.hero-price{margin:0 0 27px;padding:11px 0 10px 21px;border-left:2px solid #2a98d2}
.price-amount{font-size:19px;font-weight:650;color:#193754}
.price-amount strong{font-family:Georgia,serif;font-size:42px;letter-spacing:-.04em;color:#1262a0}
.price-amount span{font-size:16px;font-weight:550}
.price-sub{color:#627a91;font-size:12px;margin-top:4px}
.hero-actions{display:flex;flex-wrap:wrap;gap:13px;align-items:center}
.hero-proof{display:flex;align-items:center;gap:9px;font-size:13px;color:#4d6881;margin-top:22px}
.proof-tick{display:inline-grid;place-items:center;background:#dbf1ff;color:#2c719f;border-radius:50%;height:22px;width:22px;font-weight:800}
.hero-final .hero-visual{position:relative;height:auto;aspect-ratio:1092 / 958;overflow:hidden;border-radius:19px;box-shadow:0 24px 52px rgba(20,76,125,.18);background:#9ac6dc;isolation:isolate}
.hero-final .hero-visual>img{height:auto;width:100%;object-fit:contain;object-position:center;display:block}
.hero-price-badge{position:absolute;right:20px;top:20px;background:rgba(12,37,67,.94);color:#eaf8ff;border:1px solid rgba(184,227,255,.85);padding:15px 19px;display:flex;flex-direction:column;align-items:center;border-radius:12px;box-shadow:0 8px 30px #0005}
.hero-price-badge span{font-size:10px;letter-spacing:.16em;font-weight:750}
.hero-price-badge b{font:600 32px Georgia,serif;line-height:1.25}
/* Icons and section ribbons use the same visual vocabulary as MN social graphics */
.perks{background:var(--black);color:var(--ivory);border-top:1px solid rgba(119,192,241,.40);border-bottom:1px solid rgba(119,192,241,.30)}
.perk-grid{display:grid;grid-template-columns:repeat(3,1fr)}
.perk{display:flex;align-items:center;gap:17px;padding:24px 24px 24px 0;min-width:0}
.perk+.perk{border-left:1px solid rgba(119,192,241,.23);padding-left:31px}
.perk-icon{width:49px;height:49px;flex:0 0 49px;display:grid;place-items:center;color:#7dcefb;border:1px solid rgba(119,192,241,.65);border-radius:50%;background:#172f4b}
.perk-icon svg{width:24px;height:24px}
.perk b{display:block;font-size:13px;font-weight:750;color:#f7fbff}
.perk small{display:block;font-size:12px;color:#b8d1e3;line-height:1.45;margin-top:3px}
.section-pad{padding:100px 0}
.escape-section{position:relative;background:linear-gradient(112deg,#0c203b,#173758);color:#f2f9ff;overflow:hidden}
.escape-section:before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 5% 10%,rgba(103,182,234,.13),transparent 50%);pointer-events:none}
.escape-inner{display:grid;grid-template-columns:1fr 1fr;gap:92px;padding:89px 0;position:relative}
.escape-section .section-kicker,.contact-strip .section-kicker{color:#91d3f8}
.escape-heading h2,.booking-intro h2,.faq-layout h2,.contact-strip h2{font-size:clamp(41px,4.4vw,62px);line-height:1.12;margin:20px 0 24px}
.escape-heading h2{color:#f5fbff}.escape-heading h2 em{color:#96dcff}
.escape-heading>p:last-child{color:#bfd6e8;font-size:16px;line-height:1.7}
.step-list{display:flex;flex-direction:column;gap:28px}
.step{display:flex;align-items:flex-start;gap:23px}
.step-number{font:italic 31px Georgia,serif;color:#77c7f6;flex:0 0 51px}
.step h3{font-size:17px;margin:2px 0 8px;color:#f3fbff;font-weight:700}
.step p{margin:0;max-width:420px;color:#b9d0e4;line-height:1.7;font-size:14px}
/* Booking */
.booking-section{background:#eff8ff}
.booking-layout{display:grid;grid-template-columns:.84fr 1.16fr;gap:75px;align-items:start}
.booking-intro{padding-top:47px}
.booking-intro h2{color:#112d4c}
.booking-intro>p:not(.section-kicker):not(.small-note){color:#607890;font-size:16px;line-height:1.8;max-width:445px}
.booking-highlight{display:flex;align-items:flex-start;gap:17px;margin:35px 0 22px;padding:24px 26px;background:#122d49;color:#f5fbff;max-width:400px;border-radius:12px;border-top:3px solid #4aa4dc;box-shadow:0 15px 40px #173a5920}
.highlight-icon{font-size:37px;color:#85cdf4;line-height:1}
.booking-highlight b,.booking-highlight div>span{display:block;font-size:12px;color:#c5e0ef}
.booking-highlight strong{display:block;font:600 33px Georgia,serif;color:#fff;margin:7px 0}
.booking-highlight strong small{font-family:"Segoe UI",Arial,sans-serif;font-size:14px}
.small-note{font-size:12px;line-height:1.8;color:#5d748a;max-width:420px}
.booking-card{border:1px solid #dbeaf3;background:#ffffff;border-radius:19px;padding:38px 40px;box-shadow:var(--shadow)}
.booking-card h3{font:600 32px Georgia,serif;color:#102b49;letter-spacing:-.035em;margin:0 0 8px}
.booking-card>p{color:#60778c;font-size:14px;margin:0 0 27px}
.booking-card label{display:flex;flex-direction:column;gap:9px;font-weight:750;color:#23405b;font-size:13px;margin-bottom:18px}
.booking-card label span small{font-weight:500;color:#657e94}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.booking-card input,.booking-card select,.booking-card textarea{display:block;width:100%;min-width:0;border:1px solid #d6e6f2;border-radius:9px;background:#fff;color:#142f4c;padding:14px 15px;font-size:14px;font-weight:500;outline:none;transition:border-color .2s,box-shadow .2s}
.booking-card input:focus,.booking-card select:focus,.booking-card textarea:focus{border-color:#257cad;box-shadow:0 0 0 3px rgba(69,165,222,.14)}
.booking-card textarea{resize:vertical;min-height:89px}
.booking-card select{padding-right:12px}
.estimate{border:1px solid #e0effa;border-radius:12px;background:#f8fbff;padding:17px 18px;margin:7px 0 19px;display:grid;gap:14px}
.estimate>div{display:flex;justify-content:space-between;align-items:center;gap:15px;font-size:13px}
.estimate span{color:#5e758c}.estimate strong{font-size:13px;color:#193553}
.estimate .estimate-total{border-top:1px solid #d6e9f5;padding-top:12px}
.estimate-total strong{font:600 28px Georgia,serif;color:#1a6197}
.form-error,.enquiry-status{font-size:13px;line-height:1.6;border-radius:9px;padding:13px 15px;margin:12px 0}
.form-error{background:#fff1eb;color:#913b2c;border:1px solid #e7b9a6}
.enquiry-status{background:#e9f5ff;color:#205b8b;border:1px solid #a7d7f1}
.enquiry-status.success{background:#edf6ee;border-color:#add2b4;color:#285635}
.enquiry-status.warning{background:#fff2e7;border-color:#d8a682;color:#794225}
#enquiry-whatsapp{margin-top:13px}
.form-smallprint{font-size:11px;line-height:1.7;color:#617a90;margin:14px 0 0}
.message-preview{border-top:1px solid var(--line);padding-top:23px;margin-top:23px}
.message-preview label{font-size:13px}
.message-preview textarea{margin-bottom:12px;font-size:13px;line-height:1.55}
.copy-status{font-size:12px;color:#2d668f}
.honey{position:absolute!important;left:-99999px!important;opacity:0!important;pointer-events:none!important;width:1px!important;height:1px!important}
/* FAQ */
.faq-section{background:#fafcff}
.faq-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:74px}
.faq-layout h2{color:#163653}
.faq-list{border-top:1px solid var(--line)}
.faq-list details{border-bottom:1px solid var(--line)}
.faq-list summary{cursor:pointer;padding:21px 37px 21px 0;position:relative;color:#143553;font-weight:750;font-size:14px;list-style:none}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary:after{content:"+";position:absolute;right:4px;top:15px;color:#2078ae;font-size:25px;font-weight:400}
.faq-list details[open] summary:after{content:"−"}
.faq-list details p{color:#5a748b;line-height:1.8;font-size:14px;max-width:600px;margin:0 0 21px;padding-right:25px}
/* Gold-hour footer ribbon; a visual match for the approved social banner */
.contact-strip{position:relative;overflow:hidden;color:#f3fbff;background:#122d49}
.contact-strip:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(14,41,70,.92) 0%,rgba(12,38,65,.86) 50%,rgba(10,36,66,.60) 100%),url("assets/approved-coastal-design.webp") center 48%/cover no-repeat;filter:saturate(.78)}
.contact-inner{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:85px;align-items:center;padding:87px 0}
.contact-strip h2{color:#f8fcff}.contact-strip h2 em{color:#aadbf5}
.contact-inner>div>p:last-child{color:#d5e8f2;line-height:1.7}
.contact-panel{background:#f9fcff;color:#14314d;border:1px solid #57afd9;border-radius:15px;padding:29px 32px;box-shadow:0 18px 45px #0004}
.contact-panel-heading{font:600 28px Georgia,serif;color:#193653;margin-bottom:20px}
.contact-line{display:flex;align-items:center;gap:13px;border-top:1px solid #dbeef8;padding:13px 0;font-size:14px;font-weight:650;overflow-wrap:anywhere}
.contact-line a:hover{text-decoration:underline;text-underline-offset:3px}
.contact-symbol{width:30px;height:30px;flex:0 0 30px;border:1px solid #a3d6f0;background:#ecf7ff;color:#226b9f;border-radius:50%;display:grid;place-items:center}
.demo-disclaimer{display:block;padding-top:13px;color:#607990;font-size:11px;line-height:1.6}
.site-footer{background:#0c203b;color:#c3d8e8;border-top:1px solid #446982}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:22px;min-height:122px;font-size:12px}
.footer-inner img{width:108px;height:auto}
.footer-inner a:last-child{color:#deeffa;text-decoration:underline;text-underline-offset:5px}
/* Customer WhatsApp gets its own green, consistent brand button */
.whatsapp-float{display:flex;align-items:center;gap:10px;position:fixed;bottom:24px;right:24px;z-index:45;border:2px solid #e7f4eb;border-radius:999px;background:var(--green);color:#fff;padding:12px 18px 12px 14px;box-shadow:0 15px 38px rgba(9,58,31,.32);font-size:13px;font-weight:800;transition:background .2s,transform .2s}
.whatsapp-float:hover{background:var(--green-hover);transform:translateY(-2px)}
.whatsapp-float svg{width:24px;height:24px}
.mobile-sticky-cta{display:none}
/* Responsive */
@media(max-width:1050px){.container{width:min(100% - 46px,1180px)}.hero-final .hero-inner{gap:28px}.booking-layout,.escape-inner,.faq-layout,.contact-inner{gap:48px}.hero-final h1{font-size:clamp(45px,5.6vw,68px)}}
@media(max-width:760px){
 html{scroll-padding-top:75px}.container{width:calc(100% - 38px)}
 .nav-wrap{height:75px}.brand img{width:88px}.site-header nav{display:none}
 .mobile-header-book{display:inline-flex;align-items:center;gap:7px;background:var(--gold);color:#112d4a;border-radius:999px;font-weight:780;font-size:12px;padding:12px 17px}
 .hero-final .hero-inner{display:flex;flex-direction:column;align-items:stretch;gap:24px;min-height:0;padding:44px 0 53px}
 .hero-final h1{font-size:clamp(43px,9.2vw,59px);margin:16px 0 19px}
 .hero-lead{font-size:15px;line-height:1.7}.hero-price{margin-bottom:22px}
 .hero-actions{gap:11px}.hero-actions .button{padding:12px 16px;min-height:49px;font-size:12px}
 .hero-final .hero-visual{height:auto;aspect-ratio:1092 / 958;width:100%;border-radius:15px}.hero-price-badge{top:14px;right:14px;padding:11px 14px}.hero-price-badge b{font-size:26px}
 .perk-grid{grid-template-columns:1fr}.perk{padding:17px 0}.perk+.perk{border-left:0;border-top:1px solid rgba(119,192,241,.23);padding-left:0}
 .section-pad{padding:71px 0}.escape-inner,.booking-layout,.faq-layout,.contact-inner{grid-template-columns:1fr;gap:36px}
 .escape-inner{padding:71px 0}.escape-heading h2,.booking-intro h2,.faq-layout h2,.contact-strip h2{font-size:clamp(40px,8.8vw,56px);margin:17px 0 19px}
 .booking-intro{padding-top:0}.booking-highlight{margin:25px 0 18px}
 .booking-card{padding:26px 23px}.booking-card h3{font-size:29px}.faq-layout{gap:17px}
 .contact-inner{padding:73px 0}.contact-panel{padding:23px}
 .site-footer{padding-bottom:63px}.footer-inner{justify-content:center;flex-wrap:wrap;text-align:center;gap:12px;padding:18px 0}.footer-inner span{width:100%}
 .mobile-sticky-cta{display:flex;position:fixed;bottom:0;left:0;right:0;z-index:40;justify-content:center;gap:8px;padding:14px 14px calc(14px + env(safe-area-inset-bottom));background:#64bdec;color:#15314c;box-shadow:0 -3px 15px #0002;font-weight:800;font-size:13px}
 .whatsapp-float{bottom:75px;right:12px;padding:10px 14px 10px 11px;font-size:12px}
 .whatsapp-float svg{width:23px;height:23px}
}
@media(max-width:480px){.field-row{grid-template-columns:1fr;gap:0}.hero-final .hero-visual{height:auto;aspect-ratio:1092 / 958}.hero-final h1{font-size:42px}.hero-actions .button{flex:1 1 165px}.booking-highlight strong{font-size:30px}.estimate-total strong{font-size:23px}.contact-line{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition-duration:.01ms!important}}

/* On small screens, floating controls no longer cover any part of the vehicle.
   The header booking link and main WhatsApp button remain available. */
@media (max-width:760px) {
  .mobile-sticky-cta.hero-photo-in-view,
  .whatsapp-float.hero-photo-in-view {display:none}
}

/* MN Car Hire social links — keep approved bright/coastal layout intact. */
.nav-social{font-size:12px;font-weight:750;color:inherit;text-decoration:none;opacity:.85}
.nav-social:hover{opacity:1;text-decoration:underline}
.social-channel-links{display:flex;justify-content:center;align-items:center;gap:clamp(12px,3vw,32px);flex-wrap:wrap;padding:18px 15px 8px}
.social-channel-link{display:inline-flex;align-items:center;gap:8px;text-decoration:none;color:inherit;font-size:13px;font-weight:800}
.social-channel-link:hover{text-decoration:underline}
.social-circle{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;color:#fff;font-size:22px;font-weight:900;background:#155cbd}
.instagram-mark{background:#a43985;font-size:24px}.whatsapp-mark{background:#148847;font-size:19px}
@media(max-width:850px){.nav-social{display:none}}

.social-circle svg{width:21px;height:21px;display:block}