/* ATL KIA CARE | Mockup-matched UI theme | loaded after existing CSS */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');
:root{--night:#09141d;--scarlet:#d60027;--red:#d60027;--ink:#111b29;--canvas:#f5f7f9;--muted2:#667383;--line:#e1e6ec}
html{font-synthesis:none}body{font-family:Inter,Arial,sans-serif;color:var(--ink);background:var(--canvas);font-size:14px}button,input,select,textarea{font-family:inherit}a,button{transition:background-color .18s,border-color .18s,color .18s,box-shadow .18s}h1,h2,h3,.title,.panel-title{letter-spacing:-.035em}
/* PUBLIC: dark header with white Kia logo and red booking CTA */
.public-nav{background:linear-gradient(105deg,#07111a,#111f2b);color:#fff;height:72px;padding:0 clamp(20px,4vw,66px);border-bottom:1px solid rgba(255,255,255,.12);box-shadow:0 3px 16px #08131e12}
.public-nav .logo-lockup img{filter:brightness(0) invert(1);width:106px;height:40px}.public-nav .logo-lockup span{color:#c4cdd5;border-left-color:#42505c}.public-nav .nav-actions{gap:clamp(12px,2.2vw,32px)}.public-nav .nav-actions a:not(.btn){font-size:12px;font-weight:500;color:#f0f3f6}.public-nav .nav-actions a:hover{color:#fff;text-decoration:underline;text-decoration-color:var(--scarlet);text-underline-offset:9px}
.btn,.banner-action{background:#d60027;color:#fff;border-color:#d60027;border-radius:4px;font-weight:700;box-shadow:none}.btn:hover,.banner-action:hover{background:#b50021;border-color:#b50021;filter:none}.btn.outline{background:transparent;color:inherit;border:1px solid #c9d2db}.public-nav .btn.outline{color:white}.public-nav .btn{padding:11px 17px;min-height:39px;font-size:12px}
/* PUBLIC: hero mirrors split photographic service-bay reference */
.home-hero{min-height:540px;padding:70px clamp(24px,5vw,82px) 110px;background-color:#0b1823;background-image:linear-gradient(90deg,rgba(7,18,28,.98) 0%,rgba(7,18,28,.89) 28%,rgba(7,18,28,.32) 65%,rgba(7,18,28,.1) 100%),url('/assets/images/sportage-hero-reference.webp');background-position:center,right center;background-size:cover,auto 100%;background-repeat:no-repeat;position:relative;overflow:hidden}
.home-hero:after{content:'';position:absolute;inset:auto 0 0;height:90px;background:linear-gradient(0deg,#0b1823a6,transparent);pointer-events:none}.home-hero>div{max-width:650px;position:relative;z-index:1}.hero-kicker{color:#e4eaf0;font-size:11px;font-weight:700;letter-spacing:.12em}.home-hero h1{font-size:clamp(44px,5vw,74px);line-height:1.03;font-weight:800;text-transform:uppercase;letter-spacing:-.05em;max-width:610px;margin:19px 0 15px}.home-hero h1 em{color:#fff}.home-hero p{font-size:16px;line-height:1.65;color:#e1e7ec;max-width:445px}.hero-actions .btn{padding:15px 22px}.home-hero .btn.outline{border-color:#b4c0cb;color:white;background:#ffffff12}.home-hero .btn.outline:hover{background:#ffffff26}
/* Homepage benefits: cards visually overlap hero */
.home-hero+.section-wrap{position:relative;margin-top:-47px;padding-top:0;z-index:2}.home-hero+.section-wrap .section-heading{padding-top:80px}.benefit-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.benefit{background:#fff;border:1px solid #e3e8ed;border-radius:6px;box-shadow:0 12px 32px #1018200a;padding:28px}.benefit .symbol{color:var(--scarlet);font-size:32px}.benefit h3{font-size:18px;margin:16px 0 8px}.benefit p{font-size:13px;color:#697687}.section-heading h2{font-size:clamp(28px,3vw,42px)}
/* STAFF: reference dark vertical sidebar and dark top utility bar */
.staff-sidebar{background:linear-gradient(165deg,#09151e,#15232e);width:228px;padding:24px 12px;border-right:1px solid #23313d}.staff-sidebar .logo-lockup{padding:0 17px 22px;border-bottom:1px solid #ffffff20}.staff-sidebar .logo-lockup img{width:100px;filter:brightness(0) invert(1)}.staff-sidebar .logo-lockup span{color:#a8b5c1}.staff-sidebar .navlabel{color:#9aaab8;letter-spacing:.1em;margin:20px 16px 10px}.staff-nav{gap:3px;margin-top:8px}.staff-nav button{border-radius:3px;font-size:12px;font-weight:500;padding:13px 15px;color:#d5dce2}.staff-nav button.active,.staff-nav button:hover{background:#d60027;color:#fff;box-shadow:none}.staff-top{background:linear-gradient(105deg,#09141d,#152633);color:#fff;border-bottom:0;min-height:65px;padding:14px clamp(18px,2.5vw,36px)}.staff-top small{color:#b6c2cb}.staff-top strong{font-size:13px}.staff-top button{background:#ffffff12;border-color:#ffffff3a;color:white}.staff-top button:hover{background:#ffffff24}.staff-top .tiny-note{color:#e6edf2}.staff-content{padding:28px clamp(18px,2.4vw,38px) 75px;max-width:1560px}.staff-content .title{font-size:clamp(27px,2.6vw,35px);font-weight:800}.staff-content .sub{font-size:13px}.dashboard-hero{border-radius:7px;min-height:220px;background:#0c1822}.dashboard-hero h2{font-size:32px}.dashboard-hero>div:first-child{padding:32px}.dashboard-hero img{object-fit:cover;object-position:center}.summary-grid{gap:12px}.summary-grid .metric{border-radius:5px;box-shadow:0 4px 14px #10203008;padding:20px;border-left:3px solid #287cff}.summary-grid .metric:nth-child(2){border-left-color:#287cff}.summary-grid .metric:nth-child(3){border-left-color:#fa8b21}.summary-grid .metric:nth-child(4){border-left-color:#11ad6b}.summary-grid .metric strong{font-size:31px;margin:12px 0 4px}.summary-grid .metric small{font-size:11px}.panel,.job-card,.booking-card{border-radius:6px;border:1px solid #e3e8ee;box-shadow:0 5px 24px #15253808}.panel-title{font-size:17px}.data-table{min-width:730px}.data-table thead{background:#f0f3f5}.data-table th{font-size:11px;text-transform:none;letter-spacing:0;color:#1c2936;font-weight:700;border-bottom:1px solid #e0e6eb}.data-table td{font-size:12px;border-bottom:1px solid #e7ebef}.data-table td small{color:#788694}.pill{border-radius:6px;padding:6px 11px;font-size:11px;font-weight:600}.pill.in-service{background:#ffe3e7;color:#c50028}.pill.completed,.pill.ready-for-pickup{background:#dcf6e8;color:#087b53}.pill.booked{background:#e8edf3;color:#526174}.actions button{border-radius:4px}.actions .primary-small{background:#d60027}.form-panel .btn{border-radius:4px}
/* CUSTOMER: white tracking surfaces, clear red progress */
.customer-nav{background:linear-gradient(105deg,#09141d,#152633);color:#fff}.customer-main{max-width:1300px}.customer-welcome{background:linear-gradient(105deg,#0b1721,#22313d);border-radius:7px;padding:32px 38px}.customer-welcome h1{font-size:34px}.customer-grid{grid-template-columns:1.45fr .7fr}.job-card{padding:26px}.job-card h3{font-size:20px}.job-card .progress{display:flex;gap:0;overflow:visible;position:relative;margin:28px 0 21px}.job-card .progress span{height:4px;border-radius:0;background:#d7dfe6;position:relative}.job-card .progress span:first-child{border-radius:5px 0 0 5px}.job-card .progress span:last-child{border-radius:0 5px 5px 0}.job-card .progress span.done{background:#d60027}.job-card .progress span:after{content:'';position:absolute;right:-5px;top:-4px;width:12px;height:12px;background:#aab4bf;border-radius:50%;border:2px solid #fff;z-index:1}.job-card .progress span.done:after{background:#d60027}.job-card p{font-size:13px}.booking-card{padding:27px}.auth-shell{background:#f8fafb}.auth-photo{background-image:linear-gradient(180deg,rgba(10,20,30,.25),rgba(10,20,30,.9)),url('/assets/images/service-centre-reference.webp')}.auth-card h1{font-size:35px}.auth-card .btn{border-radius:4px}.input,select,textarea{border-radius:5px}
/* Focus & accessibility */
:focus-visible{outline:3px solid #e8536c;outline-offset:3px}.footer{background:#0b1721}
@media(max-width:1100px){.staff-sidebar{width:205px}.public-nav{padding:0 22px}.public-nav .nav-actions{gap:12px}.home-hero{background-size:cover,auto 85%}}
@media(max-width:780px){.public-nav{height:68px}.public-nav .logo-lockup span{display:none}.public-nav .nav-actions a:not(.btn){display:none}.home-hero{min-height:570px;padding:55px 22px 165px;background-image:linear-gradient(180deg,rgba(7,18,28,.96) 0%,rgba(7,18,28,.8) 46%,rgba(7,18,28,.24) 100%),url('/assets/images/sportage-hero-reference.webp');background-position:center,right bottom;background-size:cover,auto 55%}.home-hero h1{font-size:clamp(38px,8vw,56px)}.home-hero p{font-size:14px}.home-hero+.section-wrap{margin-top:-30px}.home-hero+.section-wrap .section-heading{padding-top:60px}.benefit-grid{grid-template-columns:1fr}.staff-sidebar{width:100%;padding:9px 10px}.staff-nav{margin-top:0;display:flex;overflow:auto}.staff-nav button{white-space:nowrap}.staff-top{padding:14px 16px}.staff-content{padding:23px 14px 60px}.summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-grid{grid-template-columns:1fr}.customer-main{padding:25px 15px}.customer-welcome{padding:26px}.dashboard-hero{grid-template-columns:1fr}.dashboard-hero img{height:190px}}
@media(max-width:460px){.public-nav .logo-lockup img{width:82px}.public-nav .nav-actions .btn{font-size:11px;padding:10px 11px}.home-hero h1{font-size:39px}.summary-grid{gap:9px}.summary-grid .metric{padding:14px}.summary-grid .metric strong{font-size:25px}.staff-top .badge-demo{display:none}.customer-welcome h1{font-size:26px}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{transition:none!important;scroll-behavior:auto!important}}

/* Vehicle imagery update — source: supplied mockup, not Kia licensed photos. */
.home-hero{background-size:cover,auto 100%;background-position:center,right center;background-color:#0a1620}
.auth-photo{background-image:linear-gradient(180deg,rgba(10,20,30,.26),rgba(10,20,30,.90)),url('/assets/images/service-centre-reference.webp');background-size:cover;background-position:center}
.dashboard-hero img{object-fit:cover;object-position:center;background:#e9edf0}
.job-card .vehicle-photo,.booking-card .vehicle-photo{max-width:240px;object-fit:contain}
@media(max-width:780px){.home-hero{background-image:linear-gradient(180deg,rgba(7,18,28,.97) 0%,rgba(7,18,28,.83) 43%,rgba(7,18,28,.32) 100%),url('/assets/images/sportage-hero-reference.webp');background-size:cover,auto 65%;background-position:center,right bottom}}

/* Kia model photography: generated demo images stored locally */
.home-hero{background-image:linear-gradient(90deg,rgba(7,18,28,.98) 0%,rgba(7,18,28,.9) 34%,rgba(7,18,28,.38) 70%,rgba(7,18,28,.16) 100%),url('/assets/images/kia-sportage.jpg');background-size:cover,auto 100%;background-position:center,right center;background-repeat:no-repeat}
.dashboard-hero img{object-fit:cover;object-position:center;background:#edf1f4}
.kia-vehicle-photo{display:block;width:100%;height:160px;object-fit:cover;object-position:center;border-radius:6px;background:#edf1f4}
.job-card .kia-vehicle-photo{max-width:310px;height:145px;margin:12px 0 16px}
.kia-vehicle-table{display:flex;align-items:center;gap:10px;min-width:175px}
.kia-vehicle-table img{width:66px;height:46px;object-fit:cover;border-radius:4px;background:#eef1f4;flex:none}
.kia-vehicle-table strong,.kia-vehicle-table small{display:block}
.kia-model-gallery{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin:28px 0 0}
.kia-model-gallery figure{margin:0;border:1px solid #e1e6ec;background:white;border-radius:8px;overflow:hidden}
.kia-model-gallery img{width:100%;height:120px;object-fit:cover;display:block}
.kia-model-gallery figcaption{padding:12px;font-weight:700;font-size:13px}
@media(max-width:1100px){.kia-model-gallery{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:780px){.home-hero{background-image:linear-gradient(180deg,rgba(7,18,28,.96),rgba(7,18,28,.76) 48%,rgba(7,18,28,.18)),url('/assets/images/kia-sportage.jpg');background-position:center,right bottom;background-size:cover,auto 55%}.kia-model-gallery{grid-template-columns:repeat(2,minmax(0,1fr))}.kia-vehicle-table img{width:52px;height:40px}}
@media(max-width:420px){.kia-model-gallery{gap:8px}.kia-model-gallery img{height:95px}}


/* === 2026 reference hero refresh — background contains no baked-in UI text === */
.home-hero {
  min-height: 610px;
  display: flex;
  align-items: center;
  padding: clamp(54px,7vw,110px) clamp(24px,5vw,82px) 110px;
  background-color: #07121d;
  background-image: linear-gradient(90deg,rgba(5,15,24,.42) 0%,rgba(5,15,24,.14) 48%,transparent 72%),url("../images/kia-service-hero-background.webp");
  background-size: cover, cover;
  background-position: center, center;
  background-repeat: no-repeat;
}
.home-hero > div { max-width: 640px; }
.home-hero h1 { color:#fff; font-size:clamp(45px,5.5vw,78px); line-height:1.04; margin:18px 0 17px; }
.home-hero p { max-width:470px; font-size:clamp(15px,1.3vw,18px); color:#eef2f5; line-height:1.55; }
.home-hero .hero-kicker { color:#f4b4c0; letter-spacing:.15em; }
.home-hero .hero-actions { display:flex; gap:12px; flex-wrap:wrap; margin-top:26px; }
.home-hero .hero-actions .btn { padding:16px 25px; min-height:52px; }
.home-hero .hero-actions .btn.outline { background:rgba(255,255,255,.1); border:1px solid rgba(255,255,255,.58); }
.home-hero + .section-wrap { margin-top:-32px; }
@media(max-width:780px) {
 .home-hero { min-height:640px; align-items:flex-start; padding:55px 22px 180px;
   background-image:linear-gradient(180deg,rgba(5,15,24,.93) 0%,rgba(5,15,24,.68) 48%,rgba(5,15,24,.16) 100%),url("../images/kia-service-hero-background.webp");
   background-position:center,62% center; background-size:cover,cover; }
 .home-hero h1 {font-size:clamp(39px,9vw,58px);}
 .home-hero p {max-width:420px;}
}
@media(max-width:460px) {
 .home-hero {min-height:610px; padding-bottom:145px; background-position:center,66% center;}
 .home-hero .hero-actions .btn {padding:13px 17px;min-height:46px;}
}