/* Bulen — shared design system (DEMO mockup) */
:root{
  --bg:#f4f6f9; --surface:#ffffff; --ink:#0f1b29; --muted:#5b6b7c; --line:#e4e9ef; --line2:#eef2f6;
  --primary:#143a5c; --primary-d:#0e2c46; --accent:#ff7a18; --accent-d:#e96a0c;
  --green:#15a34a; --green-ink:#0a7233; --green-bg:#e7f6ec; --amber:#8a5a12; --amber-bg:#fbf2e0; --red:#c81e1e; --red-bg:#fdecec;   /* vibrant green for badges; --green-ink = deep green for text on light (AA) */
  --merchant:#0f766e; --merchant-bg:#e6f4f2;
  --radius:14px; --radius-lg:18px; --shadow:0 1px 2px rgba(16,32,45,.06),0 6px 20px rgba(16,32,45,.06);
}
*{box-sizing:border-box}
html,body{margin:0}
body{font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif;background:var(--bg);color:var(--ink);line-height:1.5;-webkit-font-smoothing:antialiased;padding-top:58px}   /* reserve the fixed-header height -> no layout shift when JS mounts it */
a{color:inherit;text-decoration:none}
img{max-width:100%}
.wrap{max-width:1200px;margin:0 auto;padding:0 16px}
.section{padding:34px 0}
section[id]{scroll-margin-top:90px}   /* anchor jumps land below the sticky navbar, with breathing room */
.section h2{font-size:clamp(20px,2.6vw,26px);margin:0 0 4px;letter-spacing:-.3px}
.section .lead{color:var(--muted);margin:0 0 20px}
.row-head{display:flex;align-items:baseline;justify-content:space-between;gap:12px;margin-bottom:18px}
.row-head a.more{color:var(--primary);font-weight:700;font-size:14px;white-space:nowrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:10px;padding:11px 18px;font-weight:700;font-size:15px;cursor:pointer;font-family:inherit}
.btn-primary{background:var(--primary);color:#fff}
.btn-primary:hover{background:var(--primary-d)}
.btn-accent{background:var(--accent);color:#10202e}
.btn-accent:hover{background:var(--accent-d)}
.btn-ghost{background:#fff;border:1px solid var(--line);color:var(--ink)}
.btn-block{width:100%}

/* Header */
.site-header{background:var(--primary);color:#fff;position:fixed;top:0;left:0;right:0;z-index:40}
.hdr{display:flex;align-items:center;gap:16px;padding:11px 16px;max-width:1200px;margin:0 auto;height:58px}
.logo{font-weight:800;letter-spacing:.5px;font-size:21px;display:flex;align-items:center;gap:9px;color:#fff}
.logo .spark{width:26px;height:26px;border-radius:7px;background:linear-gradient(135deg,var(--accent),#ffb061);display:grid;place-items:center;color:#10202e;font-size:15px}
.nav{display:flex;gap:4px;margin-left:8px}
.nav a{color:#cfe0ee;font-size:14.5px;font-weight:600;padding:7px 11px;border-radius:8px;white-space:nowrap}
.nav a:hover,.nav a.active{color:#fff;background:#ffffff14}
/* nav dropdown (hover on desktop) */
.nav-dd{position:relative}
.nav-dd>a{display:inline-flex;align-items:center;gap:5px}
.dd-caret{font-size:10px;opacity:.85}
.dd-panel{position:absolute;top:100%;left:0;min-width:246px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 16px 40px rgba(16,32,45,.20);padding:7px;display:none;z-index:60}
.nav-dd:hover .dd-panel,.nav-dd:focus-within .dd-panel{display:block}
.dd-panel a{display:block;color:var(--ink);font-size:14px;font-weight:600;padding:9px 12px;border-radius:8px;white-space:nowrap}
.dd-panel a:hover{background:#f1f4f8;color:var(--primary)}
.hdr-right{margin-left:auto;display:flex;align-items:center;gap:10px}
.role-toggle{display:flex;align-items:center;gap:7px;background:#ffffff14;border:1px solid #ffffff26;border-radius:10px;padding:8px 13px;font-size:14px;font-weight:800;color:#fff;cursor:pointer}
.role-toggle.on{background:var(--merchant);border-color:var(--merchant)}
.demo-badge{background:#ffffff1a;border:1px solid #ffffff33;color:#fff;font-size:11px;font-weight:700;padding:4px 9px;border-radius:999px;letter-spacing:.4px}
.cartbtn{display:flex;align-items:center;gap:7px;background:var(--accent);color:#10202e;font-weight:800;border:none;border-radius:10px;padding:8px 13px;cursor:pointer;font-size:14px}
.cartbtn .n{background:#10202e;color:#fff;border-radius:999px;min-width:20px;height:20px;display:grid;place-items:center;font-size:12px;padding:0 5px}
/* click-to-dial phone — always visible, tel: link opens the dialer */
.navphone{display:flex;align-items:center;gap:9px;color:#fff;padding:5px 12px 5px 6px;border-radius:10px;border:1px solid #ffffff26;background:#ffffff10}
.navphone:hover{background:#ffffff1f;border-color:#ffffff40}
.np-ic{width:30px;height:30px;border-radius:8px;background:var(--accent);color:#10202e;display:grid;place-items:center;font-size:15px;flex:none}
.np-txt{display:flex;flex-direction:column;line-height:1.12}
.np-txt small{font-size:9.5px;color:#bcd2e6;font-weight:700;text-transform:uppercase;letter-spacing:.4px}
.np-txt b{font-size:15px;font-weight:800;color:#fff;white-space:nowrap}
.menu-toggle{display:none;background:none;border:none;color:#fff;font-size:22px;cursor:pointer}
.merchant-banner{background:var(--merchant-bg);color:var(--merchant);border-bottom:1px solid #cde8e4;font-size:13.5px;font-weight:600;text-align:center;padding:8px 16px}
.merchant-banner b{font-weight:800}

/* Hero / finder */
.hero{background:linear-gradient(180deg,var(--primary),var(--primary-d));color:#fff;padding:30px 0 32px}
.hero h1{font-size:clamp(23px,3.6vw,34px);margin:0 0 6px;font-weight:800;letter-spacing:-.5px}
.hero p.sub{margin:0 0 18px;color:#c4d6e6;font-size:16.5px;max-width:960px}
.finder{background:var(--surface);color:var(--ink);border-radius:var(--radius-lg);box-shadow:var(--shadow);padding:18px}
.tabs{display:flex;gap:6px;margin-bottom:14px;flex-wrap:wrap}
.tab{border:1px solid var(--line);background:#fff;border-radius:999px;padding:8px 15px;font-size:14px;font-weight:600;color:var(--muted);cursor:pointer}
.tab.active{background:var(--primary);border-color:var(--primary);color:#fff}
.selects{display:grid;grid-template-columns:repeat(4,1fr) auto;gap:10px}
.field label{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:4px;text-transform:uppercase;letter-spacing:.4px}
select,textarea,input[type=text],input[type=email],input[type=tel]{width:100%;padding:11px 12px;border:1px solid var(--line);border-radius:10px;font-size:15px;background:#fff;color:var(--ink);appearance:none;font-family:inherit}
textarea{resize:vertical;min-height:64px;line-height:1.45}
select:disabled{background:#f3f5f8;color:#9aa7b4}
.gobtn{align-self:end;background:var(--accent);color:#10202e;font-weight:800;border:none;border-radius:10px;padding:12px 18px;cursor:pointer;font-size:15px;white-space:nowrap}
.gobtn:hover{background:var(--accent-d)}
.pane{display:none}.pane.active{display:block}
.hint{font-size:13px;color:var(--muted);margin-top:10px}
.trust{display:flex;gap:14px 22px;flex-wrap:wrap;margin-top:16px;padding-top:14px;border-top:1px solid var(--line);color:var(--muted);font-size:13px}
.trust span{display:flex;align-items:center;gap:7px}
.trust span::before{content:"✓";color:var(--green);font-weight:800}
.trust b{color:var(--ink)}
@media(min-width:1024px){
  .trust{flex-wrap:nowrap;justify-content:space-between;gap:8px 16px;font-size:12.5px}
  .trust span{white-space:nowrap}
}

/* Product grid + cards */
.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:15px;display:flex;flex-direction:column;box-shadow:var(--shadow);position:relative}
.card[data-href]{cursor:pointer}
.card .cardbtns,.card .addbtn,.card .cmpbtn{cursor:default}.card .addbtn:not(:disabled),.card .cmpbtn{cursor:pointer}
.card .fitflag,.card .offerflag{position:absolute;top:0;left:15px;transform:translateY(-50%);color:#fff;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:999px;white-space:nowrap;max-width:46%;overflow:hidden;text-overflow:ellipsis}
.card .fitflag{background:#16833d;color:#fff}
.card .offerflag{background:#c8500a;left:auto;right:15px;color:#fff}
.battviz{height:96px;border-radius:10px;display:flex;align-items:center;justify-content:center;margin-bottom:12px;background:#f1f4f8}
.case{height:62px;border-radius:6px;position:relative;box-shadow:inset 0 -10px 0 rgba(0,0,0,.08);background:linear-gradient(180deg,#2b3a48,#1b2733)}
.term{width:11px;height:13px;border-radius:2px;position:absolute;top:-9px;background:#aeb8c2}
.term.l{left:14px}.term.r{right:14px}.term.plus{background:var(--accent)}
.brandrow{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:3px}
.brand{font-size:12px;font-weight:800;letter-spacing:.4px;text-transform:uppercase}
.tech{font-size:11px;font-weight:700;padding:3px 8px;border-radius:999px}
.tech.AGM{background:#10202e;color:#fff}.tech.EFB{background:#27506f;color:#fff}.tech.SLI{background:#eef1f4;color:#5b6b7c}
.ss{font-size:11px;color:var(--primary);font-weight:700}
.mname{font-size:15px;font-weight:700;margin:2px 0 10px;min-height:38px}
.mname a:hover{color:var(--primary)}
.specs{display:grid;grid-template-columns:1fr 1fr;gap:7px 10px;font-size:13px;margin-bottom:12px}
.specs .s b{display:block;font-size:11px;color:var(--muted);font-weight:700;text-transform:uppercase;letter-spacing:.3px}
.priceRow{display:flex;align-items:flex-end;justify-content:space-between;margin-top:auto;gap:8px}
.price .eur{font-size:21px;font-weight:800}
.price .bgn{font-size:12px;color:var(--muted)}
.price .was{font-size:13px;color:var(--muted);text-decoration:line-through;margin-right:6px}
.price .mtag{display:inline-block;font-size:10.5px;font-weight:800;color:var(--merchant);background:var(--merchant-bg);padding:2px 6px;border-radius:6px;margin-top:3px}
.stock{font-size:12px;font-weight:700;padding:4px 9px;border-radius:8px}
.stock.in{background:var(--green-bg);color:var(--green-ink)}.stock.low{background:var(--amber-bg);color:var(--amber)}.stock.out{background:var(--red-bg);color:var(--red)}
.addbtn{margin-top:12px;width:100%;background:var(--primary);color:#fff;border:none;border-radius:10px;padding:11px;font-weight:700;font-size:14px;cursor:pointer}
.addbtn:hover{background:var(--primary-d)}
.addbtn:disabled{background:#e7ebf0;color:#9aa7b4;cursor:not-allowed}
.warranty{font-size:12px;color:var(--muted);margin-top:8px;text-align:center}

/* Catalog layout */
.catalog{display:grid;grid-template-columns:260px 1fr;gap:22px;padding:24px 0 50px}
.filters{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;align-self:start;position:sticky;top:74px}
.filters h3{margin:0 0 4px;font-size:15px}
.fgroup{padding:13px 0;border-top:1px solid var(--line)}.fgroup:first-of-type{border-top:none}
.fgroup .ttl{font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.5px;color:var(--muted);margin-bottom:9px}
.chk{display:flex;align-items:center;gap:9px;font-size:14px;padding:4px 0;cursor:pointer}
.chk input{width:16px;height:16px;accent-color:var(--primary)}
.rng{display:flex;align-items:center;gap:8px;font-size:13px;color:var(--muted)}
.rng input[type=range]{flex:1;accent-color:var(--accent)}
.clearbtn{margin-top:6px;width:100%;background:#fff;border:1px solid var(--line);border-radius:9px;padding:9px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer}
.toolbar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:14px}
.count{font-weight:800;font-size:18px}
.reqchip{background:#eef4fa;border:1px solid #d7e6f3;color:var(--primary);border-radius:999px;padding:6px 12px;font-size:13px;font-weight:600}
.sortwrap{margin-left:auto;display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted)}
.sortwrap select{width:auto;padding:8px 30px 8px 11px;font-size:14px}
.filterToggle{display:none}
.empty{grid-column:1/-1;text-align:center;padding:50px 20px;color:var(--muted)}

/* Tiles / chips */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}   /* 2 rows of 4 on desktop */
.tile{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:30px 18px;text-align:center;font-weight:700;font-size:16px;box-shadow:var(--shadow)}
.tile:hover{border-color:var(--primary)}
.tile .ic{font-size:34px;display:block;margin-bottom:12px}
.tile small{display:block;color:var(--muted);font-weight:600;font-size:12px;margin-top:3px}
/* shop-by-car brand tiles (logo placeholder + name) */
.maketiles{grid-template-columns:repeat(4,1fr)}
.maketile{display:flex;flex-direction:column;align-items:center;gap:11px;background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:22px 12px;box-shadow:var(--shadow);font-weight:700;color:var(--ink);transition:transform .18s ease,box-shadow .2s ease,border-color .18s ease}
.maketile:hover{transform:translateY(-3px);box-shadow:var(--shadow-hover);border-color:#d4dde6}
.mlogo{width:58px;height:58px;border-radius:50%;display:grid;place-items:center;color:#fff;font-weight:800;font-size:17px;letter-spacing:.3px;flex:none}
.maketile:hover .mlogo{transform:scale(1.05)}
.mname{font-size:15px}
.allcars .mlogo{background:#eef3f8;color:var(--primary);font-size:22px}
/* "Как работи" — distinct numbered process (not bullets, not FAQ) */
.process{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:22px;margin-top:22px;position:relative}
.process::before{content:"";position:absolute;top:24px;left:12%;right:12%;height:2px;background:linear-gradient(90deg,var(--line),#cdd8e4,var(--line));z-index:0}
.pstep{position:relative;text-align:center;z-index:1}
.pnum{width:48px;height:48px;border-radius:50%;background:var(--primary);color:#fff;font-size:20px;font-weight:800;display:grid;place-items:center;margin:0 auto 12px;box-shadow:0 5px 16px rgba(20,58,92,.28);border:3px solid var(--bg)}
.pstep h4{margin:0 0 5px;font-size:15.5px}
.pstep p{margin:0;font-size:14px;color:var(--muted);line-height:1.55}
@media(max-width:700px){
  .process{grid-template-columns:1fr;gap:0}
  .process::before{display:none}
  .pstep{display:flex;gap:14px;text-align:left;padding:10px 0;border-bottom:1px solid var(--line2)}
  .pnum{margin:0;width:42px;height:42px;font-size:18px;flex:none}
}
.brandchips{display:flex;flex-wrap:wrap;gap:12px}
.brandchip{background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px 20px;font-weight:800;letter-spacing:.3px;box-shadow:var(--shadow)}

/* PDP */
.pdp{display:grid;grid-template-columns:1.1fr 1fr;gap:30px;padding:24px 0}
.gallery .main-img{background:#eef2f6;border:1px solid var(--line);border-radius:var(--radius-lg);height:320px;display:flex;align-items:center;justify-content:center}
.gallery .main-img .case{height:150px}
.thumbs{display:flex;gap:10px;margin-top:12px}
.thumb{width:74px;height:60px;border:1px solid var(--line);border-radius:10px;background:#eef2f6;display:flex;align-items:center;justify-content:center;cursor:pointer}
.thumb .case{height:34px}
#pdp .breadcrumb{font-size:13px;color:var(--muted);padding:28px 0 4px}
.pdp h1{font-size:26px;margin:6px 0 8px;letter-spacing:-.3px}
.pdp .subttl{color:var(--muted);margin:0 0 14px}
.spectable{width:100%;border-collapse:collapse;margin:8px 0 16px;font-size:14px}
.spectable td{padding:9px 10px;border-bottom:1px solid var(--line2)}
.spectable td:first-child{color:var(--muted);width:46%}
.spectable td:last-child{font-weight:700;text-align:right}
.pricebox{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow);margin:8px 0 16px}
.pricebox .big{font-size:30px;font-weight:800}
.pricebox .bgn{color:var(--muted);font-size:14px}
.pricebox .was{text-decoration:line-through;color:var(--muted);font-size:16px;margin-right:8px}
.qty{display:inline-flex;align-items:center;border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-right:10px}
.qty button{width:38px;height:42px;border:none;background:#fff;font-size:18px;cursor:pointer}
.qty input{width:46px;text-align:center;border:none;border-left:1px solid var(--line);border-right:1px solid var(--line);height:42px}
.fitcars{background:var(--surface);border:1px solid var(--line);border-radius:var(--radius);padding:16px;margin-top:8px}
.fitcars h3{margin:0 0 10px;font-size:16px}
.fitcars .carlist{display:flex;flex-wrap:wrap;gap:8px}
.carpill{background:#eef4fa;color:var(--primary);border:1px solid #d7e6f3;border-radius:999px;padding:5px 11px;font-size:13px;font-weight:600}
.feat{display:flex;gap:10px;align-items:flex-start;margin:10px 0;font-size:14px}
.feat .fic{color:var(--green);font-weight:800;margin-top:1px}

/* Pricing comparison table (merchant page) */
.ptable{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;font-size:14px}
.ptable th,.ptable td{padding:12px 14px;text-align:left;border-bottom:1px solid var(--line2)}
.ptable th{background:#f7f9fb;font-size:12px;text-transform:uppercase;letter-spacing:.4px;color:var(--muted)}
.ptable td.num{text-align:right;font-weight:700}
.ptable .merch{color:var(--merchant);font-weight:800}

/* Checkout */
.checkout{display:grid;grid-template-columns:1.4fr .9fr;gap:26px;padding:24px 0 50px}
.cobox{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;margin-bottom:18px;box-shadow:var(--shadow)}
.cobox h3{margin:0 0 14px;font-size:17px;display:flex;align-items:center;gap:9px}
.cobox h3 .step{width:24px;height:24px;border-radius:999px;background:var(--primary);color:#fff;display:grid;place-items:center;font-size:13px}
.opt{display:flex;gap:12px;align-items:flex-start;border:1px solid var(--line);border-radius:11px;padding:13px;margin-bottom:10px;cursor:pointer}
.opt.sel{border-color:var(--primary);background:#f5f9fc}
.opt input{margin-top:3px;accent-color:var(--primary)}
.opt .t{font-weight:700}.opt .d{font-size:13px;color:var(--muted)}
.opt .pill{margin-left:auto;font-size:12px;font-weight:700;color:var(--green-ink);background:var(--green-bg);padding:3px 9px;border-radius:999px;white-space:nowrap}
.cart-line{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--line2)}
.cart-line .cv{width:54px;height:42px;border-radius:8px;background:linear-gradient(180deg,#2b3a48,#1b2733);flex:none}
.cart-line .nm{font-size:14px;font-weight:700}
.cart-line .meta{font-size:12px;color:var(--muted)}
.cart-line .lp{margin-left:auto;font-weight:800;white-space:nowrap}
.summary{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;align-self:start;position:sticky;top:74px;box-shadow:var(--shadow)}
.sumrow{display:flex;justify-content:space-between;padding:7px 0;font-size:14px}
.sumrow.total{border-top:1px solid var(--line);margin-top:8px;padding-top:12px;font-size:20px;font-weight:800}
.sumrow .muted{color:var(--muted)}

/* Blog */
.bloggrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:18px}
.post{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.post .ph{height:120px;background:linear-gradient(135deg,#1b3a5b,#26597f);display:flex;align-items:flex-end;padding:12px}
.post .cat{background:#ffffff26;color:#fff;font-size:11px;font-weight:700;padding:3px 9px;border-radius:999px}
.post .pb{padding:15px}
.post h3{margin:0 0 7px;font-size:16px;line-height:1.35}
.post .ex{font-size:13.5px;color:var(--muted);margin:0 0 10px}
.post .meta{font-size:12px;color:var(--muted)}

/* Fleet / generic CTA bands */
.band{background:linear-gradient(120deg,var(--primary),var(--primary-d));color:#fff;border-radius:var(--radius-lg);padding:30px;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
.band h2{margin:0 0 6px;color:#fff}
.band p{margin:0;color:#c4d6e6;max-width:560px}
.band .spacer{flex:1}
/* Landing / service / segment page shared blocks */
.answerbox{background:#f5f9fc;border:1px solid #d7e6f3;border-left:4px solid var(--primary);border-radius:12px;padding:16px 18px;font-size:16px;font-weight:600;margin:22px 0 6px;max-width:900px}
.faqwrap{max-width:760px}
.faqitem{border:1px solid var(--line);border-radius:12px;padding:2px 16px;margin-bottom:10px;background:#fff}
.faqitem summary{font-weight:700;cursor:pointer;padding:12px 0;font-size:15.5px;list-style:none}
.faqitem summary::-webkit-details-marker{display:none}
.faqitem summary::before{content:"+";float:right;color:var(--accent);font-weight:800}
.faqitem[open] summary::before{content:"–"}
.faqitem .faqa{padding:0 0 14px;color:#2c3a48;font-size:15px;line-height:1.65}
.cta-box{background:linear-gradient(120deg,var(--primary),var(--primary-d));color:#fff;border-radius:16px;padding:26px;margin:10px 0 30px;text-align:center}
.cta-box h3{margin:0 0 8px;color:#fff;font-size:21px}.cta-box p{margin:0 0 16px;color:#c4d6e6;max-width:640px;margin-left:auto;margin-right:auto}
.lp-col{max-width:960px;margin:0 auto}
.rngf .dualrng{position:relative;height:26px}.rngf .dualrng input[type=range]{position:absolute;width:100%;top:0;left:0;margin:0;height:26px;background:none;pointer-events:none;-webkit-appearance:none;appearance:none}.rngf .dualrng input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;pointer-events:auto;width:15px;height:15px;border-radius:50%;background:var(--primary);border:2px solid #fff;box-shadow:0 1px 3px rgba(16,32,45,.35);cursor:pointer}.rngf .dualrng input[type=range]::-moz-range-thumb{pointer-events:auto;width:15px;height:15px;border-radius:50%;background:var(--primary);border:2px solid #fff;cursor:pointer}.rngf .dualrng::before{content:'';position:absolute;top:11px;left:0;right:0;height:4px;background:var(--line);border-radius:4px}.rngf .rngio{display:flex;align-items:center;gap:5px;margin-top:1px}.rngf .rngio input[type=number]{width:100%;padding:5px 7px;font-size:12.5px}.rngf .rngio .r-unit{font-size:11.5px;color:var(--muted);font-weight:700;white-space:nowrap}.ttlcount{color:var(--primary);font-weight:800;text-transform:none;letter-spacing:0;font-size:12px}.fscrollwrap{position:relative}.fscrollwrap::after{content:'';position:absolute;left:0;right:0;bottom:0;height:22px;background:linear-gradient(rgba(255,255,255,0),#fff);pointer-events:none;border-radius:0 0 8px 8px}.fscroll{max-height:188px;overflow-y:auto;border:1px solid var(--line2);border-radius:8px;padding:4px 9px 8px}.fscroll::-webkit-scrollbar{width:9px}.fscroll::-webkit-scrollbar-track{background:#f1f5f9;border-radius:8px}.fscroll::-webkit-scrollbar-thumb{background:#c4d2de;border-radius:8px;border:2px solid #f1f5f9}.fscroll::-webkit-scrollbar-thumb:hover{background:var(--primary)}
.viewtoggle{display:flex;border:1px solid var(--line);border-radius:9px;overflow:hidden}.viewtoggle .vt{background:#fff;border:none;padding:7px 12px;font-size:13px;font-weight:700;cursor:pointer;color:var(--muted)}.viewtoggle .vt.on{background:var(--primary);color:#fff}
#tableWrap{display:none}
.tablescroll{overflow:auto;max-height:72vh;border:1px solid var(--line);border-radius:12px;background:#fff}
.dtable{border-collapse:collapse;table-layout:fixed;font-size:12.5px}
.dtable thead th{position:sticky;background:#eef3f8;text-align:left;padding:7px 8px;font-weight:800;font-size:11.5px;border-bottom:1px solid var(--line);user-select:none;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtable thead .hrow th{top:0;cursor:pointer;z-index:3}
.dtable thead .hrow th:hover{background:#e3ebf3}
.dtable thead .frow th{top:31px;background:#fafdff;cursor:default;z-index:2;padding:4px 6px}
.dtable th.num,.dtable td.num{text-align:right}
.dtable td{padding:6px 8px;border-bottom:1px solid var(--line2);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.dtable tbody tr{cursor:pointer}.dtable tbody tr:hover{background:#f6f9fc}.dtable tbody tr.rowsel{background:#eaf4ff}
.dtable .cbc,.dtable .qtyc{text-align:center}
.dtable .rowview{display:inline-block;vertical-align:middle;margin-right:7px;width:21px;height:21px;line-height:19px;text-align:center;border:1px solid var(--line);border-radius:5px;background:#fff;color:var(--primary);font-size:12px;font-weight:800;cursor:pointer;padding:0;flex:none}
.dtable .rowview:hover{background:var(--primary);color:#fff;border-color:var(--primary)}
.dtable td.namecell .nm{vertical-align:middle}
.dtable .rqty{width:46px;padding:3px;font-size:12px;text-align:center}
.dtable .rsz{position:absolute;top:0;right:0;width:8px;height:100%;cursor:col-resize}
.dtable .rsz:hover{background:var(--accent)}
.dtable .colf{display:flex;gap:2px}.dtable .colf input{width:50%;min-width:0}.dtable .frow input[type=number]::-webkit-outer-spin-button,.dtable .frow input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.dtable .frow input[type=number]{-moz-appearance:textfield;appearance:textfield}
.dtable .frow input,.dtable .frow select{padding:3px 5px;font-size:11px;width:100%;border-radius:6px}
.dtable .hrow th{cursor:pointer}.dtable .thsort{display:inline-block;font-size:14px;line-height:1;cursor:pointer;color:#8593a3;margin-right:5px;vertical-align:middle}.dtable .thsort:hover{color:var(--primary)}.dtable .thsort.on{color:var(--accent)}.dtable .thsort sup{font-size:8px;font-weight:800}.dtable .thname{cursor:pointer}.dtable .hrow th.filtered{background:#e2eefb}.dtable .hrow th.filtered .thname{color:var(--primary);font-weight:800}
.filterpop{position:fixed;z-index:80;background:#fff;border:1px solid var(--line);border-radius:10px;box-shadow:0 16px 44px rgba(16,32,45,.26);padding:10px;min-width:228px;max-width:300px;font-size:13px;text-align:left;white-space:normal}.filterpop .fp-title{font-weight:800;font-size:11px;color:var(--muted);text-transform:uppercase;letter-spacing:.4px;margin-bottom:8px}.fp-numpop{min-width:244px}
.filterpop .fp-search input{width:100%;padding:6px 8px;font-size:12.5px;margin-bottom:6px}
.filterpop .fp-all{display:flex;align-items:center;gap:7px;font-weight:700;padding:5px 6px;border-bottom:1px solid var(--line2);margin-bottom:4px;cursor:pointer}
.filterpop .fp-list{max-height:210px;overflow:auto}
.filterpop .fp-item{display:flex;align-items:center;gap:7px;padding:4px 6px;border-radius:6px;cursor:pointer}
.filterpop .fp-item:hover{background:#f1f5f9}
.filterpop .fp-item span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.filterpop .fp-num{display:flex;gap:12px}.filterpop .fp-num label{display:flex;flex-direction:column;font-size:11px;color:var(--muted);font-weight:700;gap:3px;flex:1}.filterpop .fp-num input{width:100%;padding:8px;font-size:13px;border-radius:7px}
.filterpop .fp-actions{display:flex;gap:6px;margin-top:8px;justify-content:flex-end}
.filterpop .fp-actions button{padding:5px 12px;border:1px solid var(--line);background:#fff;border-radius:7px;font-size:12.5px;font-weight:700;cursor:pointer}
.filterpop .fp-actions .prim{background:var(--primary);color:#fff;border-color:var(--primary)}
.sortbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:10px}
.sortchip{background:var(--primary);color:#fff;border-radius:999px;padding:4px 11px;font-size:12.5px;font-weight:700;cursor:grab;display:inline-flex;align-items:center;gap:5px}.sortchip.dragging{opacity:.45}.sortchip .sc-h{cursor:grab;opacity:.75;letter-spacing:-1px}
.sortchip b{cursor:pointer;margin-left:3px}
.presetbtn{background:#fff;border:1px solid var(--line);border-radius:999px;padding:5px 12px;font-size:12.5px;font-weight:700;cursor:pointer;color:var(--primary)}
.gtbar{position:sticky;bottom:0;display:flex;align-items:center;gap:16px;flex-wrap:wrap;background:var(--primary);color:#fff;border-radius:12px;padding:11px 18px;margin-top:12px;font-size:14px;box-shadow:0 -2px 12px rgba(16,32,45,.12)}
.gtbar b{font-weight:800}.gtbar .gttotal{margin-left:auto;font-size:16px}.gtbar .gtcart{background:var(--accent);color:#fff;border:1px solid var(--accent);border-radius:8px;padding:8px 16px;font-size:13.5px;font-weight:800;cursor:pointer}.gtbar .gtcart:hover{filter:brightness(1.07)}.gtbar .presetbtn{background:#ffffff22;border-color:#ffffff55;color:#fff}
body.table-view{overflow-x:hidden}
body.table-view .catalog{display:block}
body.table-view #filters,body.table-view #grid{display:none}
body.table-view #tableWrap{display:block;width:100vw;margin-left:calc(50% - 50vw);padding:0 20px;box-sizing:border-box}
nav.breadcrumb{font-size:13px;color:var(--muted);padding:14px 0 2px}nav.breadcrumb .wrap{display:flex;gap:7px;flex-wrap:wrap;align-items:center}nav.breadcrumb a{color:var(--primary);font-weight:600}nav.breadcrumb .sep{color:#c4d2de}nav.breadcrumb [aria-current]{color:var(--ink);font-weight:600}
.typechips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.tchip{background:#fff;border:1px solid var(--line);border-radius:999px;padding:7px 14px;font-weight:700;font-size:13.5px;cursor:pointer;color:var(--ink);white-space:nowrap;transition:border-color .15s,background .15s}
.tchip:hover{border-color:#b9c7d6}
.tchip.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.mapembed{margin:10px 0 6px}.mapembed iframe{width:100%;height:420px;border-radius:12px;border:1px solid var(--line);display:block}            /* one consistent, centered column: cards + text aligned */
.lp-col .lp-body,.lp-col .faqwrap{max-width:none}
.lp-body{max-width:760px;font-size:17px}.lp-body h2{font-size:23px;letter-spacing:-.3px;margin:28px 0 8px}.lp-body p{margin:0 0 14px;line-height:1.75}.lp-body ul{margin:0 0 14px;padding-left:22px}.lp-body li{margin:0 0 7px}.lp-body a{color:var(--primary);font-weight:600;text-decoration:underline}
.bullets{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:18px}
.bullets.cols3{grid-template-columns:repeat(auto-fit,minmax(330px,1fr))}  /* 6 cards -> balanced 3x2 desktop, 2/1 on smaller */
.bullet{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:18px;box-shadow:var(--shadow)}
.bullet .ic{font-size:24px}
.bullet h4{margin:8px 0 5px;font-size:16px}
.bullet p{margin:0;font-size:13.5px;color:var(--muted)}
.split{display:grid;grid-template-columns:1fr 1fr;gap:26px;align-items:center}
#service .split{align-items:start}
#service .band{margin-top:82px}   /* drop the "Авариен старт?" band to align with the subtext */

/* Footer */
.site-footer{background:#0e1b27;color:#9fb2c4;margin-top:20px}
.foot{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:26px;padding:34px 16px;max-width:1200px;margin:0 auto}
.foot h4{color:#fff;font-size:14px;margin:0 0 12px}
.foot a{display:block;color:#9fb2c4;font-size:13.5px;padding:4px 0}
.foot a:hover{color:#fff}
.foot .badges{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
.foot .badge{background:#ffffff14;border:1px solid #ffffff1f;border-radius:8px;padding:6px 10px;font-size:12px;color:#cfe0ee}
.foot-note{border-top:1px solid #ffffff14;text-align:center;font-size:12.5px;padding:16px;color:#7e93a6}
.foot-note b{color:#cfe0ee}

/* toast */
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%) translateY(20px);background:#10202e;color:#fff;padding:12px 18px;border-radius:12px;font-size:14px;opacity:0;pointer-events:none;transition:.25s;z-index:60;box-shadow:0 8px 30px rgba(0,0,0,.3)}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

@media(max-width:920px){
  .pdp,.split,.checkout{grid-template-columns:1fr}
  #service .band{margin-top:0}        /* no big gap once the split stacks */
  .nav{display:none;position:absolute;top:56px;left:0;right:0;background:var(--primary-d);flex-direction:column;padding:8px;max-height:calc(100vh - 64px);overflow-y:auto;box-shadow:0 18px 40px rgba(0,0,0,.3)}
  .nav.open{display:flex}
  .menu-toggle{display:block;order:-1}
  .summary,.filters{position:static}
  /* dropdowns expand inline inside the mobile menu */
  .nav-dd .dd-panel{display:none;position:static;background:transparent;border:none;box-shadow:none;padding:2px 0 8px 14px;min-width:0}
  .nav-dd.open .dd-panel{display:block}
  .nav-dd>a{display:flex;justify-content:space-between;align-items:center}
  .nav-dd .dd-caret{padding:6px 8px;margin:-6px -4px -6px 6px;transition:transform .2s}
  .nav-dd.open .dd-caret{transform:rotate(180deg)}
  .nav-dd .dd-panel a{color:#bcd2e6;font-weight:600}
  .nav-dd .dd-panel a:hover{background:#ffffff14;color:#fff}
}
@media(max-width:760px){
  .selects{grid-template-columns:1fr 1fr}.gobtn{grid-column:1/-1}
  .tiles{grid-template-columns:repeat(2,1fr)}
  .catalog{grid-template-columns:1fr}
  .filters{display:none}.filters.open{display:block}
  .filterToggle{display:inline-flex;align-items:center;gap:7px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:9px 14px;font-weight:700;font-size:14px;cursor:pointer}
  .foot{grid-template-columns:1fr 1fr}
  .demo-badge{display:none}
}
@media(max-width:640px){
  .hdr{gap:8px;padding:10px 12px}
  .rt-lbl,.ct-lbl{display:none}              /* show icons only — no wrapping */
  .role-toggle{padding:8px 11px;font-size:16px;line-height:1}
  .cartbtn{padding:8px 11px;gap:5px;font-size:13px}
  .ct-ico{font-size:15px}
  .acct{gap:7px}
  .acct-name{max-width:108px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .logo{font-size:20px}
  .np-txt{display:none}                        /* phone becomes a tappable icon on mobile */
  .navphone{padding:0;border:none;background:none}
  .np-ic{width:38px;height:38px;font-size:17px}
}
@media(max-width:480px){
  /* checkout order rows: wrap so the price never gets cut off */
  .cart-line{flex-wrap:wrap}
  .cart-line>div:nth-child(2){flex:1 1 55%;min-width:120px}
  .cart-line .lp{margin-left:auto}
}
@media(max-width:430px){
  .hero h1{font-size:27px;line-height:1.18}
  .merchant-banner{font-size:12px}
  .acct-name{max-width:84px}
}

/* fit confirmation + compare (added) */
.fitaffirm{display:flex;gap:10px;align-items:center;border-radius:12px;padding:12px 14px;margin:0 0 14px;font-size:14px;font-weight:600}
.fitaffirm .fi{font-size:18px;flex:none}
.fitaffirm.ok{background:var(--green-bg);color:#0f7a37;border:1px solid #bfe6cd}
.fitaffirm.warn{background:var(--amber-bg);color:#8a5a12;border:1px solid #f0d9a8}
.fitaffirm.neutral{background:#eef4fa;color:var(--primary);border:1px solid #d7e6f3}
.fitaffirm a{color:inherit;text-decoration:underline;font-weight:700}
.cardbtns{display:flex;gap:8px;margin-top:12px}
.cardbtns .addbtn{margin-top:0;flex:1;width:auto}
.cmpbtn{width:46px;border:1px solid var(--line);background:#fff;border-radius:10px;cursor:pointer;font-size:17px;color:var(--muted)}
.cmpbtn.on{background:var(--primary);color:#fff;border-color:var(--primary)}
.comparebar{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);display:none;align-items:center;gap:12px;background:#10202e;color:#fff;border-radius:14px;padding:10px 14px;box-shadow:0 10px 40px rgba(0,0,0,.35);z-index:55;max-width:94vw}
.comparebar.show{display:flex}
.comparebar .lbl{font-weight:700;font-size:14px}
.cmpwrap,.tablewrap{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
.cmptable{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.cmptable td{padding:12px 14px;border-bottom:1px solid var(--line2);border-left:1px solid var(--line2);text-align:center;font-size:14px;vertical-align:middle;min-width:150px}
.cmptable td:first-child{text-align:left;border-left:none;color:var(--muted);font-weight:700;background:#f7f9fb;min-width:160px}
.cmptable .prodhead{font-weight:800;font-size:15px}
.cmptable tr:first-child td{background:#fff;border-bottom:2px solid var(--line)}
.cmptable tr:first-child td:first-child{background:#f7f9fb}

/* account + sign-in modal (added) */
.acct{display:flex;align-items:center;gap:10px;color:#fff}
.acct-name{font-size:14px;font-weight:700}
.acct-badge{background:var(--merchant);color:#fff;font-size:11px;font-weight:800;padding:2px 7px;border-radius:999px}
.linklike{background:none;border:none;color:#cfe0ee;cursor:pointer;font-size:13px;text-decoration:underline;font-family:inherit}
.modal-overlay{position:fixed;inset:0;background:rgba(15,27,41,.55);display:none;align-items:center;justify-content:center;z-index:80;padding:16px}
.modal-overlay.show{display:flex}
.modal{background:#fff;border-radius:var(--radius-lg);padding:24px;max-width:380px;width:100%;box-shadow:0 20px 60px rgba(0,0,0,.3);position:relative}
.modal h3{margin:0 0 6px;font-size:20px}
.modal-x{position:absolute;top:14px;right:14px;border:none;background:none;font-size:18px;cursor:pointer;color:var(--muted)}

/* ===================================================================
   Hover / focus micro-interactions (GPU-cheap: transform/opacity/shadow)
   Animates only transform, opacity, box-shadow, border-color, background.
   Never width/height/top/left/margin. Motion disabled under
   prefers-reduced-motion. — appended block
   =================================================================== */

/* Shared lift shadow for elevated cards */
:root{ --shadow-hover:0 2px 6px rgba(16,32,45,.10),0 14px 34px rgba(16,32,45,.14); }

/* --- Product cards (.card) + blog cards (.post) ------------------- */
.card,.post{
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.card:hover,.post:hover,
.card:focus-within,.post:focus-within{
  transform:translateY(-3px);
  box-shadow:var(--shadow-hover);
  border-color:#d4dde6;
}
/* subtle zoom on the battery visual / blog photo header */
.card .battviz,.post .ph{ overflow:hidden; }
.card .battviz .case,.post .ph{
  transition:transform .25s ease;
}
.card:hover .battviz .case,
.card:focus-within .battviz .case{ transform:scale(1.04); }
.post:hover .ph,.post:focus-within .ph{ transform:scale(1.04); }
/* blog title shifts to brand colour on hover */
.post h3{ transition:color .18s ease; }
.post:hover h3,.post:focus-within h3{ color:var(--primary); }

/* --- "Защо Bulen" feature cards (.bullet) ------------------------- */
.bullet{
  transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease;
}
.bullet:hover,.bullet:focus-within{
  transform:translateY(-3px);
  box-shadow:var(--shadow-hover);
  border-color:#d4dde6;
}
.bullet .ic{ transition:transform .2s ease; display:inline-block; }
.bullet:hover .ic,.bullet:focus-within .ic{ transform:scale(1.08); }

/* --- "Пазарувай по автомобил" tiles (.tile) ----------------------- */
.tile{
  transition:transform .18s ease,box-shadow .2s ease,border-color .18s ease;
}
.tile:hover,.tile:focus-visible{
  transform:translateY(-3px);
  box-shadow:var(--shadow-hover);
  /* keep existing :hover border-color:var(--primary) */
}
.tile .ic{ transition:transform .2s ease; }
.tile:hover .ic,.tile:focus-visible .ic{ transform:scale(1.06); }

/* --- Brand tiles / "Пазарувай по марка" chips (.brandchip) -------- */
.brandchip{
  transition:transform .18s ease,box-shadow .2s ease,border-color .18s ease;
}
.brandchip:hover,.brandchip:focus-visible{
  transform:translateY(-2px);
  box-shadow:var(--shadow-hover);
  border-color:#d4dde6;
}

/* --- Buttons (.btn, primary, accent, ghost, gobtn, addbtn) -------- */
.btn,.btn-primary,.btn-accent,.btn-ghost,.gobtn,.addbtn,.cartbtn{
  transition:transform .15s ease,box-shadow .18s ease,background .18s ease;
}
.btn:hover,.btn-ghost:hover,
.btn-primary:hover,.btn-accent:hover,
.gobtn:hover,.cartbtn:hover,
.addbtn:hover:not(:disabled){
  transform:translateY(-1px);
  box-shadow:0 4px 14px rgba(16,32,45,.18);
}
.btn:active,.btn-primary:active,.btn-accent:active,.btn-ghost:active,
.gobtn:active,.cartbtn:active,.addbtn:active:not(:disabled){
  transform:translateY(0);
  box-shadow:0 2px 6px rgba(16,32,45,.14);
}
.btn-accent:hover,.gobtn:hover,.cartbtn:hover{
  box-shadow:0 4px 14px rgba(255,122,24,.28);
}
.addbtn:disabled{ transform:none; box-shadow:none; }

/* --- Nav links (.nav a) ------------------------------------------- */
.nav a{ transition:color .15s ease,background .15s ease; }

/* --- "Виж всички / Всички статии" links (.more) ------------------- */
.more{
  display:inline-block;
  transition:color .15s ease,transform .18s ease;
}
.more:hover,.more:focus-visible{
  color:var(--primary-d);
  transform:translateX(2px);   /* nudge the whole "… →" label */
}

/* --- Service feature rows (.feat) --------------------------------- */
.feat{ transition:transform .18s ease; }
.feat:hover{ transform:translateX(3px); }
.feat .fic{ transition:transform .18s ease; }
.feat:hover .fic{ transform:scale(1.12); }

/* --- Focus-visible affordance for keyboard users ------------------ */
.card a:focus-visible,.post:focus-visible,.tile:focus-visible,
.brandchip:focus-visible,.more:focus-visible,.btn:focus-visible,
.btn-primary:focus-visible,.btn-accent:focus-visible,.gobtn:focus-visible,
.addbtn:focus-visible,.cartbtn:focus-visible{
  outline:2px solid var(--accent);
  outline-offset:2px;
}

/* --- Accessibility: disable motion for reduced-motion users ------- */
@media (prefers-reduced-motion: reduce){
  .card,.post,.bullet,.tile,.brandchip,
  .card .battviz .case,.post .ph,.post h3,
  .bullet .ic,.tile .ic,
  .btn,.btn-primary,.btn-accent,.btn-ghost,.gobtn,.addbtn,.cartbtn,
  .nav a,.more,.feat,.feat .fic{
    transition:none !important;
  }
  .card:hover,.post:hover,.card:focus-within,.post:focus-within,
  .bullet:hover,.bullet:focus-within,
  .tile:hover,.tile:focus-visible,
  .brandchip:hover,.brandchip:focus-visible,
  .card:hover .battviz .case,.card:focus-within .battviz .case,
  .post:hover .ph,.post:focus-within .ph,
  .bullet:hover .ic,.bullet:focus-within .ic,
  .tile:hover .ic,.tile:focus-visible .ic,
  .btn:hover,.btn-primary:hover,.btn-accent:hover,.btn-ghost:hover,
  .gobtn:hover,.cartbtn:hover,.addbtn:hover:not(:disabled),
  .more:hover,.more:focus-visible,
  .feat:hover,.feat:hover .fic{
    transform:none;
  }
}

.exh{margin:14px 0 6px;font-size:13.5px;font-weight:800;color:var(--ink)}
.exrow{display:flex;align-items:center;gap:9px;padding:7px 0;border-bottom:1px solid var(--line2);font-size:13.5px}
.exrow .extag{background:#eef3f8;border-radius:999px;padding:2px 9px;font-size:11.5px;font-weight:800;color:var(--primary);white-space:nowrap}
.exrow .exsp{flex:1}
.exrow .expct{width:64px;padding:5px 6px;border:1px solid var(--line);border-radius:6px;text-align:right}
.exrow .exrm{background:none;border:none;color:var(--muted);cursor:pointer;font-size:15px;line-height:1;padding:2px 6px}
.exrow .exrm:hover{color:#c8501a}
.exempty{color:var(--muted);font-size:13px;padding:7px 0}
.exadd{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:11px;padding-top:11px;border-top:1px dashed var(--line)}
.exadd select,.exadd input{padding:7px 9px;font-size:13px;border:1px solid var(--line);border-radius:7px;background:#fff}
.exadd input{width:74px}
.btn-small{padding:7px 13px;font-size:13px}

.specform{display:flex;gap:12px;flex-wrap:wrap;align-items:flex-end}
.specform .sf-field{display:flex;flex-direction:column;gap:5px}
.specform .sf-field label{font-size:12.5px;font-weight:700;color:var(--muted)}
.specform .sf-field select,.specform .sf-field input{padding:11px 13px;border:1.5px solid var(--line);border-radius:10px;font-size:15px;min-width:140px;background:#fff}