:root{
  --primary:#d51f2a;
  --primary-dark:#a9141e;
  --primary-soft:#ffe6e8;
  --dark:#101827;
  --muted:#657184;
  --bg:#f4f7fb;
  --bg-soft:#ffffff;
  --card:#ffffff;
  --border:#e6ddd2;
  --success:#1f8b4c;
  --warning:#ba6d12;
  --info:#0f5fc2;
  --danger:#ba2d2d;
  --shadow:0 18px 40px rgba(20,33,45,.08);
}
*{box-sizing:border-box}
html,body{margin:0;padding:0;font-family:"Trebuchet MS","Segoe UI",sans-serif;background:radial-gradient(circle at top left,#fff7f2 0,#f4f7fb 38%,#eef4ff 100%);color:var(--dark)}
a{text-decoration:none;color:inherit}
img,video{max-width:100%}
body{min-height:100vh}
.container{width:min(1240px, calc(100% - 32px));margin:0 auto}
.topbar{background:rgba(255,255,255,.92);backdrop-filter:blur(10px);border-bottom:1px solid rgba(230,221,210,.8);position:sticky;top:0;z-index:20}
.nav{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:16px}
.brand{display:flex;align-items:center;gap:12px;font-weight:800;letter-spacing:.02em}
.brand img{width:58px;height:58px;object-fit:contain;border-radius:16px;background:#fff;box-shadow:0 10px 20px rgba(207,32,40,.12)}
.brand small{display:block;color:var(--muted);font-weight:600}
.nav-links{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.app-topbar{background:rgba(255,255,255,.78);box-shadow:0 16px 40px rgba(16,24,39,.08)}
.app-nav{padding:10px 0}
.app-top-actions{display:flex;align-items:center;gap:10px}
.quick-emergency{display:inline-flex;align-items:center;justify-content:center;padding:12px 16px;border-radius:16px;background:#111827;color:#fff;font-weight:900;box-shadow:0 14px 28px rgba(17,24,39,.18)}
.menu-toggle{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--border);background:#fff;color:var(--dark);border-radius:16px;padding:11px 15px;font-weight:900;cursor:pointer;box-shadow:0 12px 24px rgba(16,24,39,.08)}
.menu-toggle-icon{display:grid;gap:4px}
.menu-toggle-icon span{display:block;width:18px;height:2px;background:var(--primary);border-radius:999px}
body.drawer-open{overflow:hidden}
.app-drawer-backdrop{position:fixed;inset:0;background:rgba(15,23,42,.46);opacity:0;pointer-events:none;transition:opacity .22s ease;z-index:58}
.app-drawer{position:fixed;top:0;left:0;width:min(420px,92vw);height:100vh;overflow:auto;z-index:59;padding:22px;background:linear-gradient(180deg,#fff 0,#fff8f4 48%,#eef6ff 100%);border-right:1px solid rgba(214,221,230,.9);box-shadow:28px 0 70px rgba(16,24,39,.25);transform:translateX(-105%);transition:transform .24s ease}
body.drawer-open .app-drawer{transform:translateX(0)}
body.drawer-open .app-drawer-backdrop{opacity:1;pointer-events:auto}
.drawer-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid var(--border)}
.drawer-head strong{display:block;font-size:24px;letter-spacing:-.03em}
.drawer-head small{display:block;color:var(--muted);margin-top:4px}
.drawer-close{border:none;background:#101827;color:#fff;border-radius:14px;padding:10px 12px;font-weight:900;cursor:pointer}
.drawer-feature{display:block;padding:18px;border-radius:24px;background:linear-gradient(135deg,#101827,#293b56);color:#fff;margin-bottom:16px;box-shadow:0 18px 34px rgba(16,24,39,.16)}
.drawer-feature strong{display:block;font-size:18px}
.drawer-feature span{display:block;color:#dbe7f4;margin-top:5px;line-height:1.45}
.drawer-section{margin-top:16px}
.drawer-section h3{margin:0 0 10px;font-size:13px;text-transform:uppercase;letter-spacing:.13em;color:var(--primary)}
.drawer-link{display:flex;align-items:center;gap:12px;padding:13px;border:1px solid rgba(226,232,240,.9);border-radius:18px;background:rgba(255,255,255,.9);margin-bottom:9px;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.drawer-link:hover,.drawer-link.active,.drawer-feature.active{transform:translateX(3px);border-color:#f3b4b8;box-shadow:0 12px 26px rgba(213,31,42,.10)}
.drawer-link-mark{width:38px;height:38px;border-radius:14px;display:inline-flex;align-items:center;justify-content:center;background:var(--primary-soft);color:var(--primary);font-weight:900;flex:0 0 auto}
.drawer-link strong{display:block;font-size:15px}
.drawer-link small{display:block;color:var(--muted);line-height:1.35;margin-top:2px}
.drawer-footer{position:sticky;bottom:0;margin:18px -22px -22px;padding:16px 22px;background:linear-gradient(180deg,rgba(255,255,255,.18),#fff)}
.btn,.btn-outline,.btn-light{display:inline-flex;align-items:center;justify-content:center;border-radius:16px;padding:12px 18px;font-weight:700;border:none;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease}
.btn:hover,.btn-outline:hover,.btn-light:hover{transform:translateY(-1px)}
.btn{background:linear-gradient(135deg,var(--primary),#ef4444);color:#fff;box-shadow:0 12px 28px rgba(207,32,40,.2)}
.btn:hover{background:linear-gradient(135deg,var(--primary-dark),#d63c42)}
.btn-outline{background:#fff;border:1px solid var(--border);color:var(--dark)}
.btn-light{background:#fff7f5;color:var(--dark)}
.btn-danger{background:linear-gradient(135deg,var(--danger),#ef4444);color:#fff;box-shadow:0 12px 28px rgba(186,45,45,.18)}
.btn-danger:hover{background:linear-gradient(135deg,#8f1f1f,#d93636)}
.danger-zone{border-color:#fecaca;background:#fff7f7}
.admin-editor{border:1px solid var(--border);border-radius:20px;background:#fff;overflow:hidden}
.admin-editor summary{cursor:pointer;padding:14px 16px;font-weight:900;list-style:none}
.admin-editor summary::-webkit-details-marker{display:none}
.admin-editor[open] summary{border-bottom:1px solid var(--border);background:#f8fafc}
.admin-editor-body{padding:16px;display:grid;gap:12px}
.admin-thumb{width:120px;height:120px;object-fit:cover;border-radius:22px;border:1px solid var(--border);background:#fff}
.hero{display:grid;grid-template-columns:1.1fr .9fr;gap:28px;padding:36px 0}
.hero-card,.card{background:rgba(255,255,255,.94);border:1px solid var(--border);border-radius:28px;box-shadow:var(--shadow)}
.hero-card{padding:30px}
.hero-title{font-size:clamp(36px,4vw,58px);line-height:1.04;margin:10px 0 14px;font-weight:900;letter-spacing:-.03em}
.hero-title span{color:var(--primary)}
.hero p{color:var(--muted);line-height:1.6}
.badge{display:inline-flex;background:#14212d;color:#fff;border-radius:999px;padding:8px 12px;font-size:13px;font-weight:700}
.grid-2,.grid-3,.grid-4{display:grid;gap:18px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.kpi{padding:18px}
.kpi .label{color:var(--muted);font-size:14px}
.kpi .value{font-size:30px;font-weight:900;margin-top:8px;letter-spacing:-.04em}
.section{padding:20px 0 28px}
.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px;gap:16px}
.section-head h2{margin:0;font-size:34px;letter-spacing:-.03em}
.section-head p{margin:6px 0 0;color:var(--muted)}
.card{padding:22px}
.card h2,.card h3{margin:0 0 6px}
.card p.sub{margin:0;color:var(--muted)}
.form-card{max-width:620px;margin:36px auto;background:rgba(255,255,255,.95);border:1px solid var(--border);border-radius:30px;padding:30px;box-shadow:0 20px 40px rgba(20,33,45,.08)}
.form-card h1{margin:0 0 18px;font-size:30px;letter-spacing:-.03em}
label{display:block;font-weight:700;margin:14px 0 8px}
input,select,textarea{width:100%;padding:14px 16px;border:1px solid #d6d7dc;border-radius:16px;background:#fff;font-size:15px;font-family:inherit}
input:focus,select:focus,textarea:focus{outline:none;border-color:#f59b9e;box-shadow:0 0 0 4px rgba(207,32,40,.08)}
textarea{min-height:110px;resize:vertical}
.row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.alert{padding:14px 16px;border-radius:16px;margin:14px 0;font-weight:600}
.alert-error{background:#fef2f2;color:#991b1b;border:1px solid #fecaca}
.alert-success{background:#f0fdf4;color:#166534;border:1px solid #bbf7d0}
.alert-info{background:#eff6ff;color:#1d4ed8;border:1px solid #bfdbfe}
.muted{color:var(--muted)}
.center{text-align:center}
.app-shell{display:grid;grid-template-columns:292px 1fr;min-height:100vh;background:linear-gradient(135deg,#eff4fb 0,#f8fbff 100%)}
.sidebar{background:linear-gradient(180deg,#101827 0,#17243a 52%,#24151a 100%);color:#fff;padding:22px;position:sticky;top:0;height:100vh;overflow:auto;border-right:1px solid rgba(255,255,255,.08)}
.sidebar .list{display:block}
.sidebar a{display:flex;align-items:center;gap:10px;padding:11px 13px;border-radius:15px;color:#dbe7f4;margin-bottom:7px;font-weight:700;letter-spacing:.01em}
.sidebar a.active,.sidebar a:hover{background:linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.05));color:#fff;box-shadow:inset 0 0 0 1px rgba(255,255,255,.08)}
.main{padding:24px 28px 34px;min-width:0}
.admin-topbar{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:22px;padding:16px 18px;border:1px solid rgba(214,221,230,.9);border-radius:24px;background:rgba(255,255,255,.82);backdrop-filter:blur(12px);box-shadow:0 18px 38px rgba(16,24,39,.06)}
.admin-topbar strong{display:block;font-size:22px;letter-spacing:-.03em}
.admin-actions{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.eyebrow{display:inline-flex;text-transform:uppercase;letter-spacing:.12em;font-size:11px;font-weight:900;color:var(--primary);margin-bottom:6px}
.page-hero{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:18px;padding:24px;border-radius:30px;background:linear-gradient(135deg,#fff 0,#fff4f1 45%,#eef6ff 100%);border:1px solid var(--border);box-shadow:var(--shadow)}
.page-hero h1{margin:0;font-size:36px;letter-spacing:-.04em}
.page-hero p{margin:8px 0 0;color:var(--muted)}
.report-filter{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.table-wrap{overflow:auto}
table{width:100%;border-collapse:collapse;background:#fff;border-radius:20px;overflow:hidden}
th,td{padding:14px;border-bottom:1px solid var(--border);text-align:left;font-size:14px;vertical-align:top}
th{background:#f7f4ef}
.status{display:inline-flex;padding:8px 10px;border-radius:999px;font-size:12px;font-weight:800;text-transform:capitalize}
.status-pendente,.status-recebido,.status-aberto,.status-pedido,.status-novo{background:#fff0c9;color:#915705}
.status-confirmado,.status-em_execucao,.status-em_servico,.status-a_caminho,.status-aprovado,.status-pago,.status-ativo,.status-disponivel{background:#dbeafe;color:#1d4ed8}
.status-concluido,.status-pronto,.status-entregue,.status-fechado{background:#dcfce7;color:#166534}
.status-cancelado,.status-recusado,.status-atrasado,.status-pausado{background:#fee2e2;color:#b91c1c}
.status-diagnostico,.status-aguardando_aprovacao,.status-teste_final,.status-despachado,.status-parcial,.status-proposta,.status-negociacao,.status-qualificado{background:#ede9fe;color:#6d28d9}
.app-grid{display:grid;grid-template-columns:320px 1fr;gap:20px}
.user-card{background:linear-gradient(180deg,#14212d 0,#223548 100%);color:#fff;border-radius:28px;padding:24px;box-shadow:0 18px 36px rgba(20,33,45,.22)}
.user-card .points{background:linear-gradient(135deg,var(--primary),#ef4444);padding:18px;border-radius:20px;margin:18px 0}
.progress{background:#ece5dc;border-radius:999px;height:10px;overflow:hidden}
.progress>span{display:block;height:100%;background:linear-gradient(90deg,var(--primary),#ef4444)}
.tabs{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:14px}
.tab-link{padding:10px 14px;border-radius:14px;background:#fff;border:1px solid var(--border);font-weight:700}
.tab-link.active{background:linear-gradient(135deg,var(--primary),#ef4444);color:#fff;border-color:transparent}
.list{display:grid;gap:12px}
.list-item{padding:16px;border:1px solid var(--border);border-radius:18px;background:#fff}
.product{display:flex;flex-direction:column;gap:10px;border:1px solid var(--border);border-radius:24px;padding:18px;background:#fff}
.product .thumb{height:120px;background:#f3eee6;border-radius:18px;display:flex;align-items:center;justify-content:center}
.footer-space{height:34px}
.pwa-banner{padding:12px 16px;background:#14212d;color:#fff;border-radius:16px;margin:14px 0}
.quick-links{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.quick-card{display:flex;flex-direction:column;gap:8px;padding:18px;border-radius:22px;border:1px solid var(--border);background:linear-gradient(180deg,#fff 0,#fbf6ef 100%);box-shadow:0 12px 28px rgba(20,33,45,.05);transition:transform .18s ease,box-shadow .18s ease}
.quick-card:hover{transform:translateY(-2px);box-shadow:0 18px 38px rgba(20,33,45,.1)}
.quick-card strong{font-size:18px}
.quick-card span{color:var(--muted);line-height:1.45}
.check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
.check-card{display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:18px;border:1px solid var(--border);background:#fff}
.check-card input{width:auto;margin:0}
.media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.media-card{overflow:hidden;border:1px solid var(--border);border-radius:20px;background:#fff}
.media-card img,.media-card video{display:block;width:100%;height:190px;object-fit:cover;background:#f5f5f5}
.media-copy{padding:12px 14px}
.inline-actions{display:flex;gap:10px;flex-wrap:wrap}
.install-card{display:grid;grid-template-columns:1.3fr .7fr;gap:18px;align-items:center;margin-bottom:18px;padding:24px;border-radius:30px;background:radial-gradient(circle at top left,rgba(255,255,255,.96),rgba(255,241,226,.96) 45%,rgba(230,243,255,.96));border:1px solid rgba(226,232,240,.9);box-shadow:0 22px 54px rgba(16,24,39,.1);overflow:hidden;position:relative}
.install-card:before{content:"";position:absolute;right:-60px;top:-70px;width:180px;height:180px;border-radius:999px;background:rgba(213,31,42,.11)}
.install-card>*{position:relative}
.install-card.claimed{background:linear-gradient(135deg,#ecfdf5,#f8fff7)}
.install-badge{display:inline-flex;align-items:center;border-radius:999px;padding:8px 12px;background:#101827;color:#fff;font-size:13px;font-weight:900;margin-bottom:10px}
.install-card h3{font-size:28px;line-height:1.08;margin:0 0 8px;letter-spacing:-.03em}
.install-card p{margin:0;color:var(--muted);line-height:1.55}
.install-perks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:16px}
.install-perks span{padding:10px 12px;border-radius:16px;background:rgba(255,255,255,.8);border:1px solid rgba(226,232,240,.9);font-weight:800;font-size:13px}
.install-actions{display:grid;gap:10px;justify-items:stretch}
.install-status{display:block;color:var(--muted);line-height:1.45}
button:disabled,.btn:disabled,.btn-outline:disabled{opacity:.62;cursor:not-allowed;transform:none;box-shadow:none}
.vehicle-wallet{margin-bottom:18px;padding:24px;border-radius:32px;background:linear-gradient(135deg,#101827,#263f5e 58%,#d51f2a);color:#fff;box-shadow:0 24px 54px rgba(16,24,39,.2);overflow:hidden;position:relative}
.vehicle-wallet:after{content:"";position:absolute;right:-50px;bottom:-80px;width:220px;height:220px;border-radius:999px;background:rgba(255,255,255,.12)}
.vehicle-wallet>*{position:relative}
.vehicle-wallet-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}
.vehicle-wallet h3{font-size:30px;line-height:1.05;margin:0}
.vehicle-wallet p{margin:8px 0 0;color:#dbe7f4}
.vehicle-wallet-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.vehicle-wallet-item{padding:14px;border-radius:18px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16)}
.vehicle-wallet-item small{display:block;color:#cbd5e1;font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
.vehicle-wallet-item strong{display:block;margin-top:6px;font-size:18px}
.savings-card{background:linear-gradient(135deg,#fff7ed,#ecfeff)}
.choice-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.choice-card{display:flex;flex-direction:column;gap:6px;padding:14px;border-radius:18px;background:#fff;border:1px solid var(--border);cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.choice-card:hover{transform:translateY(-1px);box-shadow:0 14px 30px rgba(16,24,39,.08)}
.choice-card input{width:auto;margin:0}
.choice-card:has(input:checked){border-color:rgba(213,31,42,.5);background:linear-gradient(180deg,#fff,#fff1f2);box-shadow:0 16px 34px rgba(213,31,42,.12)}
.choice-card strong{font-size:16px}
.choice-card small{color:var(--muted);line-height:1.4}
.diagnostic-result{padding:24px;border-radius:30px;background:linear-gradient(150deg,#101827,#263f5e);color:#fff;box-shadow:0 24px 54px rgba(16,24,39,.18)}
.diagnostic-result p{color:#dbe7f4;line-height:1.55}
.diagnostic-result .list-item{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.16);color:#fff}
.timeline-shell{position:relative;display:grid;gap:14px;margin-top:18px}
.timeline-shell:before{content:"";position:absolute;left:17px;top:4px;bottom:4px;width:2px;background:linear-gradient(180deg,var(--primary),rgba(15,23,42,.12));border-radius:999px}
.timeline-item{position:relative;display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:flex-start;padding:18px;border:1px solid var(--border);border-radius:24px;background:rgba(255,255,255,.94);box-shadow:0 12px 28px rgba(16,24,39,.06)}
.timeline-dot{width:18px;height:18px;margin-top:4px;border-radius:999px;background:linear-gradient(135deg,var(--primary),#ef4444);box-shadow:0 0 0 6px #fff;z-index:1}
.timeline-item small{display:block;color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.08em;font-size:11px}
.timeline-item strong{display:block;font-size:18px;margin-top:4px}
.timeline-item p{margin:6px 0 0;color:var(--muted)}
.reward-shop-card{display:grid;grid-template-columns:120px 1fr;gap:14px;align-items:center}
.reward-thumb{width:120px;height:120px;border-radius:22px;object-fit:cover;border:1px solid var(--border);background:#fff}
.mini-product{display:flex;align-items:center;gap:12px}
.mini-product img{width:54px;height:54px;border-radius:14px;object-fit:cover;border:1px solid var(--border);background:#fff}
.chat-thread{display:grid;gap:12px}
.chat-bubble{padding:16px;border-radius:18px;max-width:88%}
.chat-user{justify-self:end;background:linear-gradient(135deg,#ffe3e3 0,#ffd2d2 100%);border:1px solid #f5b4b6}
.chat-staff{justify-self:start;background:#f8fafc;border:1px solid #dbe3ec}
.queue-bar{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:10px}
.queue-pill{display:flex;justify-content:space-between;align-items:center;padding:12px 14px;border-radius:18px;background:#fff7f5;border:1px solid #f0d9d2}
.loyalty-card{background:linear-gradient(135deg,#14212d 0,#233f59 55%,#cf2028 100%);color:#fff}
.points-big{font-size:40px;font-weight:900;letter-spacing:-.04em;margin:10px 0 14px}
.hero-card .badge{background:#14212d}
.banner-strip{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.app-banner{display:flex;align-items:center;gap:14px;padding:16px;border-radius:24px;background:linear-gradient(135deg,#101827,#293b56);color:#fff;overflow:hidden;min-height:112px}
.app-banner img{width:86px;height:86px;border-radius:18px;object-fit:cover;background:#fff}
.app-banner strong{display:block;font-size:18px}
.app-banner small{display:block;color:#dbe7f4;margin-top:4px}
.label-sheet{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.label-card{min-height:128px;border:1px dashed #9aa7b8;border-radius:14px;padding:14px;background:#fff;display:flex;flex-direction:column;justify-content:center;gap:5px}
.label-card strong{font-size:16px}
.label-card span{font-weight:800}

.home-page{min-height:100vh;background:#f7f8fb;color:#111827;overflow:hidden}
.home-topbar{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.86);backdrop-filter:blur(18px);border-bottom:1px solid rgba(226,232,240,.88)}
.home-nav{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:14px 0}
.home-brand{display:flex;align-items:center;gap:12px;font-weight:900;font-size:20px;letter-spacing:0}
.home-brand img{width:54px;height:54px;object-fit:contain;border-radius:15px;background:#fff;box-shadow:0 12px 30px rgba(213,31,42,.14)}
.home-brand small{display:block;margin-top:2px;color:#64748b;font-size:12px;font-weight:800}
.home-nav-links{display:flex;align-items:center;gap:6px;padding:6px;border:1px solid #e2e8f0;border-radius:18px;background:#fff;box-shadow:0 12px 28px rgba(15,23,42,.06)}
.home-nav-links a{padding:10px 14px;border-radius:13px;color:#334155;font-weight:900;font-size:14px}
.home-nav-links a:hover{background:#f1f5f9;color:#d51f2a}
.home-hero{position:relative;isolation:isolate;min-height:680px;background:linear-gradient(128deg,#111827 0,#1f2937 38%,#d51f2a 100%);color:#fff}
.home-hero:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,24,39,.98) 0,rgba(17,24,39,.86) 46%,rgba(17,24,39,.2) 100%);z-index:-1}
.home-hero:after{content:"";position:absolute;right:-12vw;top:-16vw;width:48vw;height:48vw;min-width:520px;min-height:520px;border-radius:999px;background:rgba(255,255,255,.1);z-index:-1}
.home-hero-inner{display:grid;grid-template-columns:minmax(0,1fr) minmax(430px,.9fr);align-items:center;gap:48px;min-height:680px;padding:68px 0 56px}
.home-hero-copy{max-width:720px}
.home-kicker{display:inline-flex;align-items:center;gap:8px;margin-bottom:16px;padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);color:#fff;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.home-hero h1{margin:0;font-size:clamp(64px,10vw,132px);line-height:.86;letter-spacing:0;font-weight:900}
.home-lead{max-width:660px;margin:26px 0 0;color:#e5edf6;font-size:clamp(18px,2vw,23px);line-height:1.5}
.home-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:30px}
.home-primary,.home-secondary{min-height:52px;padding:15px 22px;border-radius:16px;font-size:16px}
.home-secondary{background:rgba(255,255,255,.08);color:#fff;border-color:rgba(255,255,255,.28)}
.home-secondary:hover{background:#fff;color:#111827}
.home-trust{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}
.home-trust span{display:inline-flex;align-items:center;padding:10px 12px;border-radius:999px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.14);color:#f8fafc;font-size:13px;font-weight:900}
.home-hero-art{position:relative;min-height:590px}
.home-hero-art img{position:absolute;right:-70px;bottom:-56px;width:min(560px,45vw);max-height:640px;object-fit:contain;filter:drop-shadow(0 36px 50px rgba(0,0,0,.42))}
.home-phone{position:absolute;left:0;top:52px;width:min(330px,72%);padding:18px;border:1px solid rgba(255,255,255,.18);border-radius:34px;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,250,252,.92));color:#111827;box-shadow:0 34px 70px rgba(0,0,0,.28);z-index:2}
.home-phone-top{display:flex;align-items:center;gap:10px;margin-bottom:16px}
.home-phone-top span{width:38px;height:38px;border-radius:14px;background:linear-gradient(135deg,#d51f2a,#ef4444)}
.home-phone-top strong{font-size:18px}
.home-status-card{padding:18px;border-radius:24px;background:#111827;color:#fff}
.home-status-card small{display:block;color:#cbd5e1;text-transform:uppercase;letter-spacing:.1em;font-weight:900;font-size:11px}
.home-status-card strong{display:block;margin-top:8px;font-size:26px;letter-spacing:0}
.home-progress{height:10px;margin-top:16px;border-radius:999px;background:rgba(255,255,255,.16);overflow:hidden}
.home-progress span{display:block;width:72%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#d51f2a,#fbbf24)}
.home-service-list{display:grid;gap:10px;margin-top:14px}
.home-service-list span{display:block;padding:13px 14px;border-radius:18px;background:#fff;border:1px solid #e2e8f0;color:#334155;font-weight:800}
.home-access{position:relative;margin-top:-44px;z-index:5}
.home-access-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.home-access-grid-duo{grid-template-columns:repeat(2,minmax(0,1fr));max-width:860px}
.home-access-card{display:grid;gap:11px;min-height:196px;padding:24px;border-radius:8px;background:#fff;border:1px solid #e2e8f0;box-shadow:0 24px 60px rgba(15,23,42,.12);transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.home-access-card:hover{transform:translateY(-4px);border-color:#f2a9ae;box-shadow:0 30px 70px rgba(213,31,42,.16)}
.home-access-icon{width:44px;height:44px;display:inline-flex;align-items:center;justify-content:center;border-radius:8px;background:#fff1f2;color:#d51f2a;font-weight:900}
.home-access-card strong{font-size:22px;letter-spacing:0}
.home-access-card small{color:#64748b;line-height:1.55;font-size:15px}
.home-showcase{display:grid;grid-template-columns:.86fr 1.14fr;gap:42px;align-items:start;padding:82px 0 90px}
.home-section-copy{position:sticky;top:110px}
.home-showcase .home-kicker{background:#111827;color:#fff;border:none}
.home-section-copy h2{margin:0;font-size:clamp(34px,4vw,54px);line-height:1.02;letter-spacing:0}
.home-section-copy p{margin:18px 0 0;color:#64748b;font-size:18px;line-height:1.6}
.home-feature-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.home-feature{min-height:180px;padding:24px;border-radius:8px;background:#fff;border:1px solid #e2e8f0;box-shadow:0 18px 44px rgba(15,23,42,.07)}
.home-feature strong{display:block;font-size:21px;margin-bottom:10px}
.home-feature span{display:block;color:#64748b;line-height:1.55}
.login-page{min-height:100vh;background:linear-gradient(135deg,#111827 0,#1f2937 52%,#f8fafc 52%,#eef2f7 100%);color:#fff;overflow:hidden}
.login-shell{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(430px,.92fr)}
.login-promo{position:relative;isolation:isolate;padding:34px 48px 42px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(135deg,#101827 0,#202b3d 48%,#d51f2a 100%);overflow:hidden}
.login-promo:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(17,24,39,.96),rgba(17,24,39,.74) 48%,rgba(17,24,39,.2));z-index:-2}
.login-promo:after{content:"";position:absolute;right:-180px;bottom:-220px;width:620px;height:620px;border-radius:999px;background:rgba(255,255,255,.1);z-index:-2}
.login-brand{position:relative;z-index:2;display:flex;align-items:center;gap:12px;width:max-content;color:#fff;font-size:22px;font-weight:900}
.login-brand img{width:58px;height:58px;border-radius:16px;object-fit:contain;background:#fff;box-shadow:0 20px 44px rgba(0,0,0,.24)}
.login-brand small{display:block;margin-top:2px;color:#dbe7f4;font-size:12px;font-weight:800}
.login-promo-copy{position:relative;z-index:2;max-width:620px;margin-top:42px}
.login-kicker{display:inline-flex;margin-bottom:16px;padding:9px 12px;border-radius:999px;background:#fbbf24;color:#3b2100;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.12em}
.login-promo h1{margin:0;font-size:clamp(44px,6vw,86px);line-height:.94;letter-spacing:0}
.login-promo p{max-width:560px;margin:20px 0 0;color:#edf3f8;font-size:20px;line-height:1.5}
.login-promo-cards{position:relative;z-index:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:34px;max-width:760px}
.login-promo-cards div{padding:16px;border-radius:8px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.18);backdrop-filter:blur(12px)}
.login-promo-cards strong{display:block;font-size:16px}
.login-promo-cards span{display:block;margin-top:6px;color:#dbe7f4;font-size:13px;line-height:1.4}
.login-mascot{position:absolute;right:-92px;bottom:-42px;width:min(620px,52vw);max-height:84vh;object-fit:contain;filter:drop-shadow(0 42px 54px rgba(0,0,0,.44));z-index:1;pointer-events:none}
.login-panel-wrap{display:flex;align-items:center;justify-content:center;padding:40px;background:radial-gradient(circle at top,#fff 0,#f8fafc 58%,#eef2f7 100%);color:#111827}
.login-panel{width:min(100%,460px);padding:36px;border-radius:18px;background:#fff;border:1px solid #e2e8f0;box-shadow:0 30px 80px rgba(15,23,42,.16)}
.login-panel-head{text-align:center;margin-bottom:22px}
.login-panel-head img{display:block;width:92px;height:92px;object-fit:contain;margin:0 auto 16px}
.login-panel-head span{display:none}
.login-panel-head h2{margin:0 0 8px;font-size:34px;line-height:1;letter-spacing:0;color:#0f172a}
.login-panel-head p{margin:0;color:#475569;line-height:1.5;font-size:16px}
.login-panel label{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:#1f2937}
.login-panel input{border-radius:12px;background:#fff;color:#111827;border-color:#cbd5e1}
.login-panel input::placeholder{color:#94a3b8}
.login-submit{width:100%;margin-top:20px;min-height:52px;border-radius:12px;font-size:16px}
.login-create{margin:18px 0 0;text-align:center;color:#64748b}
.login-create a{font-weight:900;color:#d51f2a}
.login-form-mascot{display:block;width:min(280px,78%);margin:24px auto 0;object-fit:contain;filter:drop-shadow(0 18px 26px rgba(15,23,42,.18))}

@media print{
  .sidebar,.admin-topbar,.page-hero .inline-actions,.topbar,.btn,.btn-outline,.btn-danger{display:none!important}
  .app-shell{display:block;background:#fff}
  .main{padding:0}
  .card,.page-hero{box-shadow:none;border:none}
  .print-sheet{display:grid!important}
  .label-sheet{grid-template-columns:repeat(3,1fr)}
}

@media (max-width: 1100px){
  .grid-4,.quick-links{grid-template-columns:repeat(2,minmax(0,1fr))}
  .queue-bar{grid-template-columns:repeat(3,minmax(0,1fr))}
  .home-hero-inner{grid-template-columns:1fr;gap:20px;padding-top:52px}
  .home-hero,.home-hero-inner{min-height:auto}
  .home-hero-art{min-height:500px}
  .home-hero-art img{right:2vw;width:min(500px,58vw)}
  .home-showcase{grid-template-columns:1fr;padding-top:64px}
  .home-section-copy{position:static}
  .login-shell{grid-template-columns:1fr}
  .login-promo{min-height:640px}
  .login-mascot{right:-40px;width:min(560px,68vw)}
  .login-panel-wrap{padding:34px 24px 48px}
}

@media (max-width: 980px){
  .hero,.grid-4,.grid-3,.app-grid,.grid-2,.app-shell,.quick-links,.media-grid,.check-grid,.banner-strip,.label-sheet,.install-card,.install-perks,.vehicle-wallet-grid,.choice-grid{grid-template-columns:1fr}
  .sidebar{position:relative;height:auto}
  .main{padding:18px}
  .admin-topbar,.page-hero{align-items:flex-start;flex-direction:column}
  .nav{align-items:flex-start;flex-direction:column}
  .app-nav{align-items:center;flex-direction:row}
  .app-top-actions{margin-left:auto;gap:8px}
  .app-topbar .brand img{width:48px;height:48px}
  .quick-emergency{padding:10px 12px;font-size:13px}
  .menu-toggle{padding:10px 12px}
  .section-head{align-items:flex-start;flex-direction:column}
  .vehicle-wallet-head{flex-direction:column}
  .reward-shop-card{grid-template-columns:1fr}
  .reward-thumb{width:100%;height:190px}
  .row,.queue-bar{grid-template-columns:1fr}
  .chat-bubble{max-width:100%}
  .home-nav{align-items:flex-start;flex-direction:column}
  .home-nav-links{width:100%;justify-content:space-between;overflow:auto}
  .home-nav-links a{white-space:nowrap}
  .home-access-grid,.home-feature-grid{grid-template-columns:1fr}
  .home-access{margin-top:-26px}
  .home-access-card{min-height:auto}
  .login-page{background:#f8fafc}
  .login-promo{padding:26px 24px 34px;min-height:620px}
  .login-promo-cards{grid-template-columns:1fr}
  .login-promo-copy{margin-top:34px}
  .login-promo h1{font-size:48px}
  .login-promo p{font-size:17px}
  .login-mascot{right:-100px;bottom:-28px;width:470px;max-width:none;opacity:.96}
  .login-panel{padding:26px}
}

@media (max-width: 720px){
  .home-hero-inner{padding:38px 0 42px}
  .home-hero h1{font-size:72px}
  .home-lead{font-size:17px}
  .home-actions .btn,.home-actions .btn-outline{width:100%}
  .home-trust span{width:100%;justify-content:center}
  .home-hero-art{min-height:420px;margin-top:8px}
  .home-phone{left:0;top:0;width:82%;padding:14px;border-radius:28px}
  .home-status-card strong{font-size:21px}
  .home-service-list span{padding:11px 12px;font-size:13px}
  .home-hero-art img{right:-108px;bottom:-42px;width:360px;max-width:none}
  .home-showcase{padding:56px 0 64px}
}
