/* Raymell's public site: shared design system (same family as the owner dashboard).
   Light = warm paper; dark = black and gold. Bodoni Moda for display, Manrope for reading.
   Page-specific layout stays in each page's own <style>; the legacy token names below are
   aliases, so every page follows the theme. */

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

:root{
  --bg:#F5F2EC; --bg-2:#EFEAE0; --surface:#FFFDF8; --surface-2:#FBF7EE;
  --ink:#16130F; --ink-2:#4A443B; --ink-3:#6B6458;
  --line:#E4DED2; --line-2:#D6CEBE;
  --accent:#C9A84C; --accent-ink:#7A5E15; --accent-wash:#F3E9CC;
  --btn-bg:#0A0A0A; --btn-fg:#F5F2EC; --btn-hover:#2A2622;
  --nav-bg:rgba(245,242,236,0.92); --shadow:0 20px 44px -20px rgba(22,19,15,0.35);
  --error:#B4412F;
  color-scheme:light;
}
:root[data-theme="dark"]{
  --bg:#0A0A0A; --bg-2:#111110; --surface:#141311; --surface-2:#1A1816;
  --ink:#F5F2EC; --ink-2:rgba(245,242,236,0.84); --ink-3:rgba(245,242,236,0.64);
  --line:#24211D; --line-2:#332F2A;
  --accent:#C9A84C; --accent-ink:#E2C47A; --accent-wash:rgba(201,168,76,0.14);
  --btn-bg:#C9A84C; --btn-fg:#0A0A0A; --btn-hover:#E2C47A;
  --nav-bg:rgba(10,10,10,0.9); --shadow:0 20px 44px -20px rgba(0,0,0,0.8);
  --error:#E8736F;
  color-scheme:dark;
}
:root{
  /* legacy names used by page styles */
  --gold:var(--accent); --gold-light:var(--accent-ink); --gold-dim:var(--accent-wash); --gold-border:var(--line-2);
  --black:var(--bg); --black-mid:var(--bg-2); --black-card:var(--surface); --white:var(--ink);
  --text-soft:var(--ink-2); --text-muted:var(--ink-3); --text-faint:var(--line);

  --serif:'Bodoni Moda',Georgia,serif;
  --sans:'Manrope',system-ui,sans-serif;
  --fs-label:0.8rem; --fs-small:0.88rem; --fs-body:1rem;
  --ease:cubic-bezier(0.16,1,0.3,1);
  --gutter:clamp(1.25rem,4vw,3.5rem);
  --nav-h:4.25rem;
  --r:16px;
}

html{
  scroll-behavior:smooth;scroll-padding-top:5rem;
  scrollbar-color:var(--line-2) var(--bg);scrollbar-width:thin;
  -webkit-text-size-adjust:100%;
}
body{
  background:var(--bg);color:var(--ink);
  font-family:var(--sans);font-weight:400;font-size:var(--fs-body);line-height:1.6;
  overflow-x:hidden;-webkit-font-smoothing:antialiased;
  transition:background-color 0.35s,color 0.35s;
}
img,video{display:block;max-width:100%;}
::selection{background:var(--accent);color:#0A0A0A;}
h1,h2,h3{text-wrap:balance;}
p{text-wrap:pretty;}
.hidden{display:none!important;}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px;}
a:focus:not(:focus-visible),button:focus:not(:focus-visible){outline:none;}
.num{font-variant-numeric:lining-nums tabular-nums;}

/* ── ICONS ── */
.ico-arrow{
  display:inline-block;flex:none;width:1.05em;height:1.05em;background:currentColor;
  -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
          mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12h16M14 6l6 6-6 6'/%3E%3C/svg%3E") center/contain no-repeat;
  transition:transform 0.45s var(--ease);
}
.ico-back{transform:scaleX(-1);}
a:hover>.ico-arrow,button:hover>.ico-arrow{transform:translateX(4px);}
a:hover>.ico-back,button:hover>.ico-back{transform:scaleX(-1) translateX(4px);}

/* ── NAV ── */
nav.site-nav{
  position:fixed;top:0;left:0;right:0;z-index:200;height:var(--nav-h);
  display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1rem;
  padding:0 var(--gutter);
  background:var(--nav-bg);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);
  border-bottom:1px solid var(--line);
  transition:background 0.35s,border-color 0.35s;
}
.nav-wordmark{display:flex;align-items:center;gap:0.6rem;min-height:44px;justify-self:start;text-decoration:none;color:var(--ink);}
.nav-logo{height:30px;width:auto;display:block;}
.nav-brand-text{font:600 1.15rem/1 var(--serif);white-space:nowrap;}
.nav-center{font-size:var(--fs-label);color:var(--ink-3);text-align:center;font-weight:500;}
.nav-right{display:flex;align-items:center;gap:0.4rem;justify-content:flex-end;}
.nav-links{display:flex;align-items:center;gap:0.25rem;margin-right:0.4rem;}
.nav-link{
  font-size:0.92rem;font-weight:600;color:var(--ink-2);text-decoration:none;
  padding:0.55rem 0.85rem;border-radius:999px;transition:color 0.25s,background 0.25s;
}
.nav-link:hover{color:var(--ink);background:var(--bg-2);}
.nav-link[aria-current="page"]{color:var(--ink);background:var(--accent-wash);}
.nav-reserve{
  font-size:0.9rem;font-weight:700;text-decoration:none;white-space:nowrap;
  color:var(--btn-fg);background:var(--btn-bg);padding:0.6rem 1.1rem;border-radius:999px;transition:background 0.25s;
}
.nav-reserve:hover{background:var(--btn-hover);}
.theme-toggle,.nav-toggle{
  width:44px;height:44px;border-radius:50%;display:inline-grid;place-items:center;
  background:none;border:0;color:var(--ink-2);cursor:pointer;transition:background 0.25s,color 0.25s;
}
.theme-toggle:hover,.nav-toggle:hover{background:var(--bg-2);color:var(--ink);}
.theme-toggle svg,.nav-toggle svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.theme-toggle .sun{display:none;}
:root[data-theme="dark"] .theme-toggle .sun{display:block;}
:root[data-theme="dark"] .theme-toggle .moon{display:none;}
.nav-toggle{display:none;}
.nav-toggle .x{display:none;}
nav.open .nav-toggle .bars{display:none;}
nav.open .nav-toggle .x{display:block;}

@media(max-width:960px){
  nav.site-nav{grid-template-columns:1fr auto;}
  .nav-brand-text,.nav-center{display:none;}
  .nav-reserve{padding:0.55rem 0.9rem;font-size:0.85rem;}
  .nav-toggle{display:inline-grid;}
  .nav-links{
    position:absolute;top:100%;left:0;right:0;margin:0;
    flex-direction:column;align-items:stretch;gap:0;
    padding:0.5rem var(--gutter) 1.25rem;background:var(--bg);border-bottom:1px solid var(--line);
    visibility:hidden;opacity:0;transform:translateY(-8px);
    transition:opacity 0.3s,transform 0.4s var(--ease),visibility 0s 0.4s;
  }
  nav.open .nav-links{visibility:visible;opacity:1;transform:none;transition-delay:0s;}
  .nav-links .nav-link{font-size:1.05rem;padding:1rem 0.25rem;border-radius:0;border-bottom:1px solid var(--line);background:none;}
  .nav-links .nav-link:last-child{border-bottom:none;}
}

/* ── BUTTONS + LINKS ── */
.cta-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:0.6rem;
  font-family:var(--sans);font-size:0.95rem;font-weight:700;
  color:var(--btn-fg);background:var(--btn-bg);border:none;border-radius:999px;
  padding:0.9rem 1.6rem;min-height:48px;cursor:pointer;text-decoration:none;white-space:nowrap;
  transition:background 0.25s,transform 0.25s var(--ease);
}
.cta-primary:hover{background:var(--btn-hover);}
.cta-primary:active{transform:scale(0.98);}
.cta-ghost,.link-arrow{
  display:inline-flex;align-items:center;gap:0.5rem;
  font-family:var(--sans);font-size:0.95rem;font-weight:700;
  color:var(--ink);background:none;border:none;cursor:pointer;text-decoration:none;min-height:44px;
  text-decoration-line:underline;text-decoration-color:var(--accent);text-decoration-thickness:1.5px;text-underline-offset:6px;
}
.cta-ghost:hover,.link-arrow:hover{color:var(--accent-ink);}
.cta-line{
  display:inline-flex;align-items:center;gap:0.6rem;min-height:48px;padding:0 1.4rem;border-radius:999px;
  border:1px solid var(--line-2);color:var(--ink);font-weight:700;font-size:0.95rem;text-decoration:none;background:var(--surface);
  transition:border-color 0.25s;
}
.cta-line:hover{border-color:var(--ink-3);}

/* ── TABS (category / class pickers) ── */
.tabs{display:flex;gap:0.4rem;flex-wrap:wrap;}
.tab{
  height:42px;padding:0 1.1rem;border-radius:999px;border:1px solid var(--line-2);background:var(--surface);
  font:600 0.92rem var(--sans);color:var(--ink-2);cursor:pointer;white-space:nowrap;
  transition:background 0.25s,color 0.25s,border-color 0.25s;
}
.tab:hover{border-color:var(--ink-3);color:var(--ink);}
.tab[aria-selected="true"]{background:var(--btn-bg);border-color:var(--btn-bg);color:var(--btn-fg);}
.tab .n{opacity:0.6;margin-left:0.35rem;font-variant-numeric:tabular-nums;}

/* ── CAR CARD (homepage rail, fleet, transfers) ── */
.car{display:flex;flex-direction:column;text-decoration:none;color:inherit;border-radius:22px;background:var(--surface);border:1px solid var(--line);overflow:hidden;transition:transform 0.45s var(--ease),box-shadow 0.45s var(--ease),border-color 0.3s;}
.car:hover{transform:translateY(-4px);box-shadow:var(--shadow);}
.car-ph{aspect-ratio:4/3;background:var(--bg-2);position:relative;overflow:hidden;}
.car-ph img{width:100%;height:100%;object-fit:cover;transition:transform 0.9s var(--ease);}
.car:hover .car-ph img{transform:scale(1.04);}
.car-ph .no-photo{position:absolute;inset:0;display:grid;place-items:center;color:var(--ink-3);}
.car-ph .no-photo svg{width:36px;height:36px;stroke:currentColor;fill:none;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round;}
.car-tags{position:absolute;left:0.9rem;top:0.9rem;right:0.9rem;display:flex;gap:0.35rem;flex-wrap:wrap;}
.car-mode{height:30px;padding:0 0.8rem;border-radius:999px;display:inline-flex;align-items:center;background:rgba(10,10,10,0.72);color:#F5F2EC;font-size:0.78rem;font-weight:700;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);}
.car-body{padding:1.15rem 1.3rem 1.3rem;display:flex;flex-direction:column;gap:0.35rem;flex:1;}
.car-name{font:500 1.55rem/1.15 var(--serif);}
.car-spec{font-size:0.9rem;color:var(--ink-3);}
.car-row{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:0.4rem 1rem;margin-top:auto;padding-top:0.9rem;}
.car-price{font-weight:700;font-size:1.02rem;white-space:nowrap;}
.car-price small{font-weight:500;color:var(--ink-3);font-size:0.9rem;}
.car-go{display:inline-flex;align-items:center;gap:0.4rem;font-weight:700;font-size:0.9rem;color:var(--accent-ink);white-space:nowrap;}
.car.skel-card{pointer-events:none;}
.car.skel-card .car-ph{animation:skel 1.6s linear infinite;background:linear-gradient(100deg,var(--bg-2) 30%,var(--surface) 50%,var(--bg-2) 70%);background-size:220% 100%;}
.car-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(290px,100%),1fr));gap:1.5rem;}
@media(hover:none){.car:hover{transform:none;box-shadow:none;}}
/* Phones: two cars per row. The whole card is the link, so the "View & book" label goes. */
@media(max-width:600px){
  .car-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:0.75rem;}
  .car-grid .car{border-radius:16px;}
  .car-grid .car-tags{left:0.5rem;top:0.5rem;right:0.5rem;}
  .car-grid .car-mode{height:24px;padding:0 0.55rem;font-size:0.7rem;}
  .car-grid .car-body{padding:0.75rem 0.8rem 0.85rem;gap:0.2rem;}
  .car-grid .car-name{font-size:1.12rem;}
  .car-grid .car-spec{font-size:0.78rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
  .car-grid .car-row{padding-top:0.5rem;}
  .car-grid .car-price{font-size:0.9rem;}
  .car-grid .car-price small{font-size:0.78rem;}
  .car-grid .car-go{display:none;}
}

/* ── CHIPS ── */
.chip{display:inline-flex;align-items:center;height:30px;padding:0 0.85rem;border-radius:999px;font-size:0.82rem;font-weight:700;background:var(--accent-wash);color:var(--accent-ink);white-space:nowrap;}
.chip.line{background:none;border:1px solid var(--line-2);color:var(--ink-2);}

/* ── PANEL ── */
.panel{background:var(--surface);border:1px solid var(--line);border-radius:22px;padding:clamp(1.25rem,3vw,1.75rem);}

/* ── FORMS ── */
.field{display:flex;flex-direction:column;gap:0.4rem;}
.label{font-size:var(--fs-label);font-weight:700;color:var(--ink-2);}
.label small{font-weight:500;color:var(--ink-3);font-size:inherit;}
.input{
  width:100%;min-height:48px;padding:0.7rem 0.95rem;border-radius:12px;
  background:var(--bg);border:1px solid var(--line-2);color:var(--ink);
  font:500 0.98rem/1.4 var(--sans);transition:border-color 0.25s,box-shadow 0.25s;
  appearance:none;-webkit-appearance:none;
}
.input::placeholder{color:var(--ink-3);opacity:0.8;}
.input:hover{border-color:var(--ink-3);}
.input:focus-visible{outline:none;border-color:var(--accent);box-shadow:0 0 0 3px var(--accent-wash);}
.input[aria-invalid="true"]{border-color:var(--error);}
textarea.input{min-height:130px;resize:vertical;line-height:1.6;}
.field-err{font-size:var(--fs-small);color:var(--error);line-height:1.4;}
.field-err:empty{display:none;}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:0.9rem;}
@media(max-width:520px){.form-row{grid-template-columns:1fr;}}
.cta-primary[disabled]{opacity:0.55;cursor:not-allowed;}
.cta-primary[aria-busy="true"]{cursor:progress;}

/* ── SEARCH ── */
.search{position:relative;display:block;}
.search .input{border-radius:999px;padding-left:2.75rem;background:var(--surface);min-width:250px;}
.search svg{position:absolute;left:1rem;top:50%;transform:translateY(-50%);width:17px;height:17px;stroke:var(--ink-3);fill:none;stroke-width:1.8;stroke-linecap:round;pointer-events:none;}
.search .input::-webkit-search-cancel-button{-webkit-appearance:none;}

/* ── REVEAL ── */
.js .fu{opacity:0;transform:translateY(18px);transition:opacity 0.9s var(--ease),transform 0.9s var(--ease);transition-delay:calc(var(--i,0)*80ms);}
.js .fu.vis{opacity:1;transform:none;}
.fu-d1{--i:1;}.fu-d2{--i:2;}.fu-d3{--i:3;}.fu-d4{--i:4;}.fu-d5{--i:5;}

/* ── FILTERS (fleet + transfers) ── */
.filter-label{font-size:var(--fs-label);font-weight:700;color:var(--ink-3);}
.cars-select{
  background-color:var(--surface);border:1px solid var(--line-2);border-radius:999px;
  color:var(--ink);font-family:var(--sans);font-size:0.92rem;font-weight:600;
  padding:0.7rem 2.6rem 0.7rem 1.1rem;cursor:pointer;min-height:46px;min-width:230px;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23C9A84C' stroke-width='1.6' fill='none'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 1.1rem center;transition:border-color 0.25s;
}
.cars-select:hover,.cars-select:focus-visible{border-color:var(--ink-3);}
.cars-select option{background:var(--surface);color:var(--ink);}
@media(max-width:900px){.cars-select{width:100%;min-width:0;}}

/* ── LOADING / EMPTY / ERROR ── */
.skel{background:linear-gradient(100deg,var(--bg-2) 30%,var(--surface) 50%,var(--bg-2) 70%);background-size:220% 100%;animation:skel 1.6s linear infinite;}
@keyframes skel{from{background-position:120% 0;}to{background-position:-120% 0;}}
.state{grid-column:1/-1;display:flex;flex-direction:column;align-items:center;gap:1rem;padding:4.5rem 1.5rem;text-align:center;border:1px dashed var(--line-2);border-radius:var(--r);}
.state svg{width:30px;height:30px;stroke:var(--accent-ink);fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.state-title{font-family:var(--serif);font-size:1.6rem;color:var(--ink);line-height:1.2;}
.state-text{font-size:var(--fs-small);color:var(--ink-3);max-width:36ch;}
.state .cta-ghost{margin-top:0.25rem;}

/* ── PAGE HEADER (fleet + transfers) ── */
.page-header{
  padding:calc(var(--nav-h) + 4rem) var(--gutter) 2.5rem;border-bottom:1px solid var(--line);
  display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-wrap:wrap;
}
.page-heading{font-family:var(--serif);font-weight:500;font-size:clamp(2.6rem,5.4vw,4.8rem);line-height:1;color:var(--ink);letter-spacing:-0.015em;}
.page-heading em{font-style:italic;color:var(--accent-ink);}
.page-sub{color:var(--ink-2);max-width:46ch;margin-top:0.9rem;font-size:1.05rem;}
@media(max-width:900px){.page-header{padding-top:calc(var(--nav-h) + 2.25rem);padding-bottom:1.75rem;flex-direction:column;align-items:flex-start;gap:1.25rem;}}

/* ── FOCUS PAGES (booking confirmation, review): one card in the middle of the screen ── */
.focus-wrap{min-height:100svh;display:flex;align-items:center;justify-content:center;padding:calc(var(--nav-h) + 2.5rem) var(--gutter) 3rem;}
.focus-card{width:100%;max-width:560px;background:var(--surface);border:1px solid var(--line);border-radius:28px;padding:clamp(1.75rem,5vw,2.75rem);box-shadow:var(--shadow);}
.focus-title{font:500 clamp(2.1rem,6vw,2.9rem)/1.05 var(--serif);letter-spacing:-0.02em;}
.focus-title em{font-style:italic;color:var(--accent-ink);}
.focus-text{color:var(--ink-2);margin-top:0.75rem;font-size:1.02rem;max-width:44ch;}
.focus-actions{display:flex;flex-wrap:wrap;align-items:center;gap:0.75rem 1.25rem;margin-top:1.75rem;}

/* ── FOOTER ── */
footer{background:var(--bg-2);border-top:1px solid var(--line);padding:3rem var(--gutter) 2rem;}
.footer-main{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1.5rem;}
.footer-wordmark{display:inline-flex;text-decoration:none;}
.footer-logo{height:84px;width:auto;display:block;}
.footer-social,.closing-social{display:flex;gap:0.25rem;align-items:center;}
.closing-social{justify-content:center;margin-top:1.75rem;}
.footer-social a,.closing-social a{color:var(--ink-3);display:flex;align-items:center;justify-content:center;min-width:44px;min-height:44px;border-radius:50%;transition:color 0.25s,background 0.25s;}
.footer-social a:hover,.closing-social a:hover{color:var(--ink);background:var(--line);}
.footer-social svg,.closing-social svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;}
.footer-links{display:flex;gap:0.25rem 1.5rem;list-style:none;flex-wrap:wrap;}
.footer-links a{font-size:0.92rem;font-weight:600;color:var(--ink-2);text-decoration:none;display:inline-block;padding-block:0.4rem;transition:color 0.25s;}
.footer-links a:hover{color:var(--accent-ink);}
.footer-contacts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:1.5rem 2rem;padding-block:2rem;margin-top:2rem;border-block:1px solid var(--line);}
.footer-contact{display:flex;flex-direction:column;gap:0.35rem;}
.footer-contact-label{font-size:var(--fs-label);font-weight:700;color:var(--ink-3);}
.footer-contact-val{font-size:0.95rem;color:var(--ink);text-decoration:none;display:inline-flex;align-items:center;gap:0.5rem;transition:color 0.25s;overflow-wrap:anywhere;}
a.footer-contact-val{padding-block:0.2rem;}
a.footer-contact-val:hover{color:var(--accent-ink);}
.footer-bottom{padding-top:1.5rem;}
.footer-copy{font-size:var(--fs-label);color:var(--ink-3);}
@media(max-width:900px){.footer-main{flex-direction:column;align-items:flex-start;}.footer-logo{height:64px;}.footer-contacts{grid-template-columns:1fr 1fr;}}
@media(max-width:520px){.footer-contacts{grid-template-columns:1fr;}}

/* ── MOTION PREFERENCES ── */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:0.01ms!important;animation-iteration-count:1!important;transition-duration:0.01ms!important;transition-delay:0s!important;}
  .js .fu{opacity:1;transform:none;}
}