/* ART CAR SERVICE — customer-facing visual polish only.
   No business content or booking behaviour is defined in this file. */
:root{
  --customer-polish-blue:#0968df;
  --customer-polish-cyan:#39b8e8;
  --customer-polish-ink:#0d2748;
  --customer-polish-line:rgba(185,211,238,.72);
  --customer-polish-shadow:0 24px 70px rgba(19,57,101,.11);
}

.art-customer-ui{
  background-color:#f3f8fd;
  background-image:
    radial-gradient(circle at 8% 7%,rgba(75,163,244,.12),transparent 25rem),
    radial-gradient(circle at 94% 29%,rgba(44,185,222,.08),transparent 28rem),
    linear-gradient(180deg,#f8fbff 0,#f2f7fc 48%,#f6f9fd 100%);
  background-attachment:fixed;
}

.art-customer-ui>.page-frame,
.art-customer-ui>.booking-frame,
.art-customer-ui>.tracking-shell,
.art-customer-ui>.renew-shell,
.art-customer-ui>.wrap,
.art-customer-ui>.legal-card{
  position:relative;
  z-index:1;
}

.art-customer-ui .booking-frame{
  width:min(1240px,calc(100% - 24px));
  margin-top:12px;
  border-radius:24px;
  border:1px solid rgba(194,216,238,.72);
  box-shadow:var(--customer-polish-shadow);
}

.art-customer-ui.customer-home .page-frame{
  width:100%;
  margin:0;
  border:0;
  border-radius:0;
  box-shadow:none;
}

.art-customer-ui .customer-header,
.art-customer-ui .booking-header{
  background:rgba(255,255,255,.94);
  box-shadow:0 1px 0 rgba(21,76,132,.035);
  backdrop-filter:blur(16px) saturate(1.08);
  -webkit-backdrop-filter:blur(16px) saturate(1.08);
}

@media (min-width:681px){
  .art-customer-ui .customer-header,
  .art-customer-ui .booking-header{height:108px}
  .art-customer-ui .customer-header .brand-logo,
  .art-customer-ui .booking-header .brand-logo{width:190px;height:88px}
  .art-customer-ui.customer-home .customer-header{height:96px}
  .art-customer-ui.customer-home .customer-header .brand-logo{width:168px;height:78px}
}

.art-customer-ui .brand-logo,
.art-customer-ui .tracking-logo,
.art-customer-ui .renew-logo{
  filter:drop-shadow(0 10px 18px rgba(19,62,107,.08));
}

.art-customer-ui .menu-btn,
.art-customer-ui .customer-account-quick-btn,
.art-customer-ui .simple-lang,
.art-customer-ui .lang-segment{
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease,background-color .22s ease;
}

@media (hover:hover){
  .art-customer-ui .menu-btn:hover{
    transform:translateY(-50%) scale(1.035);
    box-shadow:0 10px 24px rgba(9,104,223,.11);
  }
  .art-customer-ui .customer-account-quick-btn:hover{
    transform:scale(1.035);
    box-shadow:0 10px 24px rgba(9,104,223,.11);
  }
  .art-customer-ui .simple-lang:hover,
  .art-customer-ui .lang-segment:hover{
    border-color:#a8c9eb;
    box-shadow:0 8px 20px rgba(27,78,132,.075);
  }
}

/* Home hero: same content and image, with more depth and controlled movement. */
.art-customer-ui.customer-home .home-hero{
  width:min(1280px,100%);
  margin-inline:auto;
  min-height:620px;
  gap:22px;
  padding:24px;
  isolation:isolate;
  background:
    radial-gradient(circle at 16% 18%,rgba(86,173,247,.11),transparent 19rem),
    radial-gradient(circle at 52% 86%,rgba(39,185,226,.08),transparent 24rem),
    #fff;
}

.art-customer-ui.customer-home .home-main{
  width:min(1240px,100%);
  margin-inline:auto;
}

.art-customer-ui.customer-home .home-hero::before{
  content:"";
  position:absolute;
  z-index:-1;
  width:310px;
  height:310px;
  inset-inline-start:-150px;
  top:74px;
  border-radius:50%;
  border:48px solid rgba(62,150,237,.055);
  box-shadow:0 0 0 32px rgba(62,150,237,.025);
  pointer-events:none;
}

.art-customer-ui.customer-home .hero-copy{
  padding:48px 26px 42px 38px;
}

[dir="ltr"] .art-customer-ui.customer-home .hero-copy{
  direction:ltr;
  text-align:left;
  padding:48px 38px 42px 26px;
}

.art-customer-ui.customer-home .hero-art{
  min-height:540px;
  border:1px solid rgba(196,218,239,.78);
  border-radius:30px;
  box-shadow:0 28px 65px rgba(17,58,104,.13);
}

.art-customer-ui.customer-home .hero-art::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  border-radius:inherit;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.45);
  pointer-events:none;
}

.art-customer-ui.customer-home .hero-car{
  will-change:auto;
}

.art-customer-ui.customer-home .hero-title{
  letter-spacing:-.025em;
  text-wrap:balance;
  text-shadow:0 2px 0 rgba(255,255,255,.75);
}

.art-customer-ui.customer-home .hero-title span{
  color:var(--customer-polish-blue);
  background:linear-gradient(115deg,#0865dc 5%,#1594ed 72%,#31b7d7);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
}

.art-customer-ui.customer-home .hero-lead{
  position:relative;
  display:inline-block;
  width:fit-content;
}

.art-customer-ui.customer-home .hero-lead::after{
  content:"";
  display:block;
  width:58px;
  height:4px;
  margin-top:11px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--customer-polish-blue),var(--customer-polish-cyan));
  box-shadow:0 5px 14px rgba(9,104,223,.18);
}

.art-customer-ui.customer-home .mini-benefit{
  padding:12px 8px;
  border:1px solid rgba(211,226,241,.78);
  border-radius:17px;
  background:rgba(255,255,255,.72);
  box-shadow:0 8px 24px rgba(25,65,108,.045);
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.art-customer-ui.customer-home .mini-benefit .mi{
  background:linear-gradient(180deg,#fff,#f3f8ff);
  box-shadow:0 8px 18px rgba(9,104,223,.085);
}

.art-customer-ui .customer-line-icon svg{
  width:25px;
  height:25px;
  display:block;
  fill:none;
  stroke:currentColor;
  stroke-width:1.75;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.art-customer-ui .why-icon.customer-line-icon{
  display:grid;
  place-items:center;
}

.art-customer-ui .why-icon.customer-line-icon svg{width:34px;height:34px}
.art-customer-ui .comfort-icon.customer-line-icon svg{width:29px;height:29px}

.art-customer-ui.customer-home .hero-book{
  position:relative;
  overflow:hidden;
  border-width:1px;
  border-radius:16px;
  box-shadow:0 15px 35px rgba(9,104,223,.22);
  transition:transform .22s ease,box-shadow .22s ease;
}

.art-customer-ui.customer-home .hero-book .arrow{transition:transform .22s ease}

.art-customer-ui.customer-home .hero-book::after{
  content:"";
  position:absolute;
  inset:-60% auto -60% -42%;
  width:28%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.46),transparent);
  transform:skewX(-18deg);
  animation:customerButtonSheen 1.25s .75s ease-out both;
  pointer-events:none;
}

.art-customer-ui.customer-home .hero-bubble{
  opacity:.28;
  filter:blur(.2px);
}

.art-customer-ui.customer-home .hero-bubble.b2,
.art-customer-ui.customer-home .hero-bubble.b4,
.art-customer-ui.customer-home .hero-bubble.b5{display:none}

/* Cards keep the approved palette while feeling less flat. */
.art-customer-ui .why-card,
.art-customer-ui .package-card,
.art-customer-ui .additional-category-card,
.art-customer-ui .comfort-card,
.art-customer-ui .home-reviews-section,
.art-customer-ui .selected-service,
.art-customer-ui .booking-step,
.art-customer-ui .customer-entry-gate,
.art-customer-ui .wash-location-box,
.art-customer-ui .membership-login-card,
.art-customer-ui .membership-profile-summary,
.art-customer-ui .membership-history-premium,
.art-customer-ui .renew-card,
.art-customer-ui .tracking-card,
.art-customer-ui .legal-card{
  transition:transform .26s ease,border-color .26s ease,box-shadow .26s ease;
}

.art-customer-ui .why-card{
  position:relative;
  overflow:hidden;
  box-shadow:0 18px 48px rgba(17,55,98,.075);
}

.art-customer-ui .why-card::before{
  content:"";
  position:absolute;
  inset:0 0 auto;
  height:4px;
  background:linear-gradient(90deg,transparent,#1887ec 28%,#46c3df 70%,transparent);
  opacity:.72;
}

.art-customer-ui .package-card{
  border-color:rgba(206,224,241,.88);
  box-shadow:0 13px 34px rgba(17,56,99,.07);
}

.art-customer-ui .package-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  background:linear-gradient(135deg,rgba(255,255,255,.76),transparent 36%);
  pointer-events:none;
}

.art-customer-ui .package-card>*{position:relative;z-index:1}

.art-customer-ui .package-icon{
  filter:drop-shadow(0 9px 13px rgba(31,92,150,.10));
  transition:transform .3s cubic-bezier(.2,.8,.2,1),filter .3s ease;
}

.art-customer-ui .book-btn,
.art-customer-ui .submit-booking,
.art-customer-ui .wizard-next,
.art-customer-ui .location-action.primary,
.art-customer-ui .btn-blue{
  box-shadow:0 10px 24px rgba(9,104,223,.15);
  transition:transform .2s ease,box-shadow .2s ease,filter .2s ease;
}

.art-customer-ui .field,
.art-customer-ui input,
.art-customer-ui select,
.art-customer-ui textarea{
  transition:border-color .2s ease,box-shadow .2s ease,background-color .2s ease;
}

.art-customer-ui .field:focus-within{border-color:#77afe8;box-shadow:0 0 0 4px rgba(9,104,223,.07)}

@media (hover:hover){
  .art-customer-ui.customer-home .mini-benefit:hover,
  .art-customer-ui .why-item:hover{
    transform:translateY(-3px);
  }
  .art-customer-ui.customer-home .hero-book:hover{
    transform:translateY(-3px);
    box-shadow:0 20px 42px rgba(9,104,223,.28);
  }
  .art-customer-ui.customer-home .hero-book:hover .arrow{transform:translateX(-4px)}
  [dir="ltr"] .art-customer-ui.customer-home .hero-book:hover .arrow{transform:translateX(4px)}
  .art-customer-ui .package-card:hover,
  .art-customer-ui .additional-category-card:hover,
  .art-customer-ui .comfort-card:hover,
  .art-customer-ui .booking-step:hover,
  .art-customer-ui .renew-card:hover,
  .art-customer-ui .legal-card:hover{
    transform:translateY(-4px);
    border-color:#b7d3ee;
    box-shadow:0 20px 48px rgba(17,56,99,.105);
  }
  .art-customer-ui .package-card:hover .package-icon{
    transform:translateY(-4px) scale(1.035);
    filter:drop-shadow(0 12px 18px rgba(31,92,150,.15));
  }
  .art-customer-ui .book-btn:hover,
  .art-customer-ui .submit-booking:hover,
  .art-customer-ui .wizard-next:hover,
  .art-customer-ui .location-action.primary:hover,
  .art-customer-ui .btn-blue:hover{
    transform:translateY(-2px);
    box-shadow:0 15px 32px rgba(9,104,223,.22);
    filter:saturate(1.05);
  }
}

.art-customer-ui .book-btn:active,
.art-customer-ui .submit-booking:active,
.art-customer-ui .wizard-next:active,
.art-customer-ui .location-action:active,
.art-customer-ui .btn:active{transform:translateY(1px) scale(.99)}

.art-customer-ui .hero-book:focus-visible,
.art-customer-ui .book-btn:focus-visible,
.art-customer-ui .btn:focus-visible,
.art-customer-ui .menu-btn:focus-visible,
.art-customer-ui .customer-account-quick-btn:focus-visible{
  outline:3px solid rgba(9,104,223,.25);
  outline-offset:3px;
}

.art-customer-ui .additional-services-box[open]>.additional-services-body,
.art-customer-ui .additional-category-card[open]>.additional-category-services,
.art-customer-ui details[open]>.customer-details-body{
  animation:customerDetailsIn .28s cubic-bezier(.2,.8,.2,1) both;
}

/* Clean vertical contact rail. It stays still after a short entrance. */
.art-customer-ui .customer-social-rail{
  left:18px!important;
  top:50%!important;
  bottom:auto!important;
  gap:7px!important;
  padding:7px!important;
  border:1px solid rgba(192,213,234,.88)!important;
  background:rgba(255,255,255,.91)!important;
  box-shadow:0 18px 45px rgba(17,56,99,.14)!important;
  backdrop-filter:blur(16px) saturate(1.12)!important;
  -webkit-backdrop-filter:blur(16px) saturate(1.12)!important;
  animation:customerRailIn .65s cubic-bezier(.2,.8,.2,1) both!important;
}

.art-customer-ui .customer-social-rail::before{
  content:"";
  position:absolute;
  inset:12px;
  z-index:-1;
  border-radius:999px;
  box-shadow:0 0 32px rgba(54,159,232,.11);
  pointer-events:none;
}

.art-customer-ui .customer-social-rail .social-float{
  position:relative;
  width:44px!important;
  height:44px!important;
  padding:9px!important;
  border-color:rgba(215,228,241,.96)!important;
  background:linear-gradient(180deg,#fff,#f9fcff)!important;
  box-shadow:0 5px 14px rgba(17,56,99,.075)!important;
  animation:none!important;
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease!important;
}

.art-customer-ui .customer-social-rail .social-float:focus-visible{
  outline:3px solid rgba(9,104,223,.22)!important;
  outline-offset:3px;
}

@media (hover:hover){
  .art-customer-ui .customer-social-rail .social-float::after{
    content:attr(aria-label);
    position:absolute;
    left:calc(100% + 12px);
    top:50%;
    transform:translate(-5px,-50%);
    opacity:0;
    pointer-events:none;
    white-space:nowrap;
    padding:7px 10px;
    border:1px solid #d8e6f3;
    border-radius:9px;
    background:#fff;
    color:#193452;
    box-shadow:0 8px 22px rgba(17,56,99,.11);
    font-size:12px;
    font-weight:800;
    transition:opacity .18s ease,transform .18s ease;
  }
  .art-customer-ui .customer-social-rail .social-float:hover::after,
  .art-customer-ui .customer-social-rail .social-float:focus-visible::after{
    opacity:1;
    transform:translate(0,-50%);
  }
  .art-customer-ui .customer-social-rail .social-float:hover{
    transform:translateX(4px) scale(1.06)!important;
    border-color:#b8d4ee!important;
    box-shadow:0 10px 22px rgba(17,56,99,.14)!important;
  }
}

/* Reveal motion is progressively enabled by customer-polish-v1.js. */
.art-customer-ui.customer-motion-ready .customer-reveal{
  opacity:0;
  transform:translate3d(0,18px,0);
  transition:
    opacity .62s cubic-bezier(.2,.8,.2,1),
    transform .62s cubic-bezier(.2,.8,.2,1);
  transition-delay:var(--customer-reveal-delay,0ms);
}

.art-customer-ui.customer-motion-ready .customer-reveal.customer-reveal-side{
  transform:translate3d(var(--customer-reveal-x,22px),8px,0);
}

[dir="ltr"] .art-customer-ui.customer-motion-ready .customer-reveal.customer-reveal-side{
  --customer-reveal-x:-22px;
}

.art-customer-ui.customer-motion-ready .customer-reveal.is-visible{
  opacity:1;
  transform:translate3d(0,0,0);
}

@keyframes customerButtonSheen{
  0%{left:-42%;opacity:0}
  18%{opacity:.8}
  100%{left:118%;opacity:0}
}
@keyframes customerRailIn{
  from{opacity:0;transform:translate(-16px,-50%)}
  to{opacity:1;transform:translate(0,-50%)}
}
@keyframes customerDetailsIn{
  from{opacity:0;transform:translateY(-7px)}
  to{opacity:1;transform:translateY(0)}
}

@media (max-width:900px){
  .art-customer-ui.customer-home .home-hero{
    min-height:0;
    padding:18px;
    gap:16px;
  }
  .art-customer-ui.customer-home .hero-copy{padding:32px 18px}
  .art-customer-ui.customer-home .hero-art{min-height:430px;border-radius:24px}
}

@media (max-width:680px){
  .art-customer-ui{
    background-image:
      radial-gradient(circle at 2% 5%,rgba(75,163,244,.11),transparent 15rem),
      linear-gradient(180deg,#f8fbff,#f2f7fc);
  }
  .art-customer-ui .page-frame,
  .art-customer-ui .booking-frame{
    width:100%;
    margin:0;
    border:0;
    border-radius:0;
    box-shadow:none;
  }
  .art-customer-ui .customer-header,
  .art-customer-ui .booking-header{
    height:92px!important;
    min-height:92px!important;
  }
  .art-customer-ui .customer-header>.brand-logo,
  .art-customer-ui .booking-header>.brand-logo,
  .art-customer-ui .customer-header>a>.brand-logo,
  .art-customer-ui .booking-header>a>.brand-logo{
    height:70px!important;
    max-width:138px!important;
  }
  .art-customer-ui .customer-header .customer-account-quick-btn,
  .art-customer-ui .booking-header .customer-account-quick-btn{
    width:44px!important;
    height:44px!important;
  }
  .art-customer-ui.customer-home .home-hero{
    display:flex;
    flex-direction:column;
    padding:12px;
    gap:8px;
    min-height:0;
  }
  .art-customer-ui.customer-home .hero-copy{
    order:2;
    width:100%;
    min-height:0;
    padding:26px 12px 22px;
  }
  .art-customer-ui.customer-home .hero-title{font-size:clamp(30px,9vw,36px)}
  .art-customer-ui.customer-home .hero-lead{font-size:17px}
  .art-customer-ui.customer-home .hero-desc{font-size:14px;line-height:1.8}
  .art-customer-ui.customer-home .hero-art{
    position:relative;
    inset:auto;
    order:1;
    width:100%;
    height:auto;
    min-height:0;
    aspect-ratio:16/10;
    border-radius:21px;
    box-shadow:0 16px 36px rgba(17,58,104,.11);
  }
  .art-customer-ui.customer-home .hero-art::after{
    background:linear-gradient(180deg,transparent 68%,rgba(255,255,255,.12));
  }
  .art-customer-ui.customer-home .hero-car{object-position:center}
  .art-customer-ui.customer-home .hero-bubble{display:none}
  .art-customer-ui.customer-home .hero-mini-benefits{gap:6px}
  .art-customer-ui.customer-home .mini-benefit{padding:9px 5px;border-radius:14px}
  .art-customer-ui.customer-home .mini-benefit b{font-size:12px;line-height:1.55}
  .art-customer-ui.customer-home .hero-book{width:100%;max-width:310px}
  .art-customer-ui.customer-home .packages-grid{grid-template-columns:1fr}
  .art-customer-ui.customer-home .package-card{min-height:0;padding:18px 16px}
  .art-customer-ui.customer-home .package-card h3{font-size:19px}
  .art-customer-ui.customer-home .package-services{font-size:13px;line-height:1.72}
  .art-customer-ui.customer-home .book-btn{min-height:44px;padding:11px;font-size:14px}
  .art-customer-ui.customer-home .why-item small{font-size:12px}
  .art-customer-ui .customer-social-rail{
    left:7px!important;
    top:56%!important;
    gap:5px!important;
    padding:5px!important;
  }
  .art-customer-ui .customer-social-rail .social-float{
    width:44px!important;
    height:44px!important;
    padding:9px!important;
  }
}

@media (min-width:481px) and (max-width:680px){
  .art-customer-ui.customer-home .packages-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (prefers-reduced-motion:reduce){
  .art-customer-ui *,
  .art-customer-ui *::before,
  .art-customer-ui *::after{
    scroll-behavior:auto!important;
    animation-duration:.01ms!important;
    animation-iteration-count:1!important;
    transition-duration:.01ms!important;
  }
  .art-customer-ui.customer-motion-ready .customer-reveal{
    opacity:1!important;
    transform:none!important;
  }
  .art-customer-ui .customer-social-rail{transform:translateY(-50%)!important}
}