/* Abang Recond V3: HIG-inspired automotive storefront (no Apple font distribution). */
:root{--ar-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--ar-ios-red:#e52419}
html,body,button,input,select,textarea{font-family:var(--ar-font)}
body{font-size:16px}
body:not(.ar-ios-mode) .arh{position:sticky;top:0;z-index:75;background:rgba(255,255,255,.93);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);border-bottom:1px solid #ececf0}
.arh-mark{background:#101014;color:#fff;border-radius:10px;width:40px;height:40px;font-weight:750;letter-spacing:-.07em}
.arh-name{font-weight:700;letter-spacing:-.03em}
.arh-menu>summary{border-radius:13px;background:#121317}
#ar-language-switch{border-radius:999px!important;background:#f2f2f6!important}
#ar-language-switch button{border-radius:999px!important;min-width:44px!important;min-height:44px!important;font-weight:700!important}
.ar-ios-launch{padding:16px 0 12px;background:#fff}
.ar-ios-launch-btn{border:1px solid #e9eaef!important;border-radius:22px!important;background:#f5f5f8!important;box-shadow:none!important;padding:14px 17px!important}
.ar-ios-launch-btn span{color:#555862;font-size:clamp(13px,3.5vw,15px)}
.ar-v3-top{padding:0 0 16px;background:#fff}
.ar-v3-budget{border-radius:24px!important;border:1px solid #e9eaf0;background:linear-gradient(130deg,#fff,#f7f8fb)!important;box-shadow:0 5px 25px rgba(15,20,35,.035);padding:18px 20px!important}
.ar-v3-budget .budget-top{flex-wrap:nowrap;align-items:center;gap:12px}
.ar-v3-budget label{font-weight:730;font-size:16px;letter-spacing:-.02em}
.ar-v3-budget output{font-size:clamp(17px,4.4vw,24px);font-weight:760;white-space:nowrap}
.ar-v3-budget output small{font-size:12px;font-weight:600;color:#626675}
.ar-v3-budget input[type=range]{accent-color:#ff1729;margin:8px 0 1px;min-height:44px}
.ar-v3-budget .budget-scale{font-size:11px;color:#737783}
.ar-v3-budget .budget-result{margin-top:6px;gap:8px;align-items:center}
.ar-v3-budget .budget-result p{font-size:13px;color:#5a5c66}
.ar-v3-budget .budget-result b{color:#13141a}
.ar-v3-budget .budget-result .ar-btn{border-radius:14px;background:#e52419;color:#fff;padding:0 18px;min-height:44px;font-size:13px;font-weight:730}
.ar-v3-hero{background:#fff;padding-bottom:14px;overflow:visible}
.ar-v3-banner{position:relative;isolation:isolate;min-height:400px;border-radius:26px;overflow:hidden;background:#0b1626;color:#fff;box-shadow:0 8px 28px rgba(13,24,36,.11)}
.ar-v3-scene{position:absolute;inset:0;z-index:-2}
.ar-v3-scene img{width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.ar-v3-banner:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,12,22,.28),transparent 80%);pointer-events:none;z-index:-1}
.ar-v3-hero-content{position:relative;z-index:1;padding:clamp(24px,4vw,48px);max-width:680px}
.ar-v3-eyebrow{font-size:11px;letter-spacing:.15em;font-weight:740;color:#edeeef}
.ar-v3-hero h1{font-size:clamp(29px,4.3vw,62px);line-height:1.05;letter-spacing:-.048em;font-weight:760;max-width:17ch;margin:12px 0 12px;color:#fff}
.ar-v3-hero h1 strong{font-weight:760;color:#fff}
.ar-v3-hero .hero-lede{font-size:clamp(14px,1.8vw,19px);max-width:42ch;line-height:1.45;font-weight:450;letter-spacing:-.01em;margin:0 0 18px;background:transparent;padding:0;color:#f3f3f5}
.ar-v3-hero-link{display:inline-flex;align-items:center;justify-content:center;gap:16px;background:#e52419;color:#fff!important;min-height:44px;padding:0 18px;border-radius:999px;font-size:14px;font-weight:720}
.ar-v3-trust{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px!important;margin:13px 0 0!important}
.ar-v3-trust li{display:flex;align-items:center;gap:10px;padding:12px;border-radius:16px;background:#f6f6f8;line-height:1.3;color:#3b4049;min-width:0;font-size:12px!important}
.ar-v3-trust-icon{display:grid;place-items:center;border-radius:11px;background:#ffeded;color:#d91627;min-width:33px;width:33px;height:33px;font-weight:800;font-size:16px}
.ar-v3-trust li b{display:block;font-weight:730;font-size:clamp(12px,2vw,14px)!important;color:#11141a;margin:0 0 2px!important;letter-spacing:-.01em}
.ar-v3-trust li small{display:block;font-size:11px;color:#51545c;line-height:1.25}
.ar-v3-quick-models{display:flex;gap:9px;align-items:center;overflow-x:auto;padding:18px 0 8px;scrollbar-width:none;overscroll-behavior-inline:contain}
.ar-v3-quick-models::-webkit-scrollbar{display:none}
.ar-v3-quick-models a{display:flex;flex:0 0 auto;align-items:center;justify-content:center;border-radius:13px;min-height:48px;background:#f1f2f5;color:#3e4249;padding:0 18px;font-size:13px;font-weight:650}
.ar-v3-quick-models a.is-selected{background:#101217;color:#fff}
.ar-v3-count{margin:0;font-size:12px;color:#646973}
.ar-v3-count b{color:#20242a}
/* Catalogue begins quickly, before secondary editorial/motorcycle content. */
#stock.sec{padding-top:38px}
#stock .stock-intro h2{font-weight:750;letter-spacing:-.04em}
#stock .stock-card{border-radius:16px;overflow:hidden;box-shadow:0 3px 13px rgba(12,21,33,.045)}
#stock .stock-cover{border-radius:13px}
.ar-v3-promo{padding:36px 0;background:#fff}
.ar-v3-promo-inner{display:grid;grid-template-columns:1fr 170px;align-items:center;gap:20px;border:1px solid #eeeff3;border-radius:22px;padding-top:20px;padding-bottom:20px;background:#fafafb}
.ar-v3-promo-copy h2{font-size:clamp(21px,3vw,32px);line-height:1.12;font-weight:740;letter-spacing:-.035em;margin:7px 0 9px}
.ar-v3-promo-copy p{font-size:14px;color:#535965;max-width:46ch;margin:0 0 14px}
.ar-v3-promo-label{font-size:11px;font-weight:740;color:#d21b29;letter-spacing:.11em}
.ar-v3-promo-copy a{display:inline-flex;align-items:center;gap:12px;border:1px solid #d8dae0;border-radius:12px;padding:10px 15px;min-height:44px;font-size:13px;font-weight:700}
.ar-v3-promo img{display:block;width:100%;border-radius:12px;max-height:195px;object-fit:contain}
body.ar-ios-mode .ar-v3-promo{display:none!important}
/* Feature motorcycle stays below stock on homepage and does not pre-empt shopping. */
@media(max-width:760px){
 .arh-in{min-height:60px}
 .arh-name{font-size:17px!important}
 .ar-v3-top{padding-bottom:13px}
 .ar-v3-budget{padding:13px 15px 12px!important;border-radius:18px!important}
 .ar-v3-budget .budget-top{align-items:flex-start}
 .ar-v3-budget label{font-size:14px;max-width:40%}
 .ar-v3-budget output{font-size:17px}
 .ar-v3-budget .budget-result{margin-top:4px}
 .ar-v3-budget .budget-result p{max-width:54%;font-size:11.5px}
 .ar-v3-budget .budget-result .ar-btn{font-size:12px;padding:0 12px;white-space:nowrap}
 .ar-v3-banner{min-height:430px;border-radius:22px}
 .ar-v3-hero-content{padding:21px 20px;max-width:100%}
 .ar-v3-eyebrow{font-size:9.5px}
 .ar-v3-hero h1{font-size:clamp(27px,7vw,35px);margin:9px 0}
 .ar-v3-hero .hero-lede{font-size:13px;max-width:32ch;margin-bottom:12px}
 .ar-v3-hero-link{font-size:12px;min-height:44px}
 .ar-v3-trust{gap:5px!important}
 .ar-v3-trust li{padding:10px 7px;gap:4px;align-items:flex-start;flex-direction:column;border-radius:13px}
 .ar-v3-trust-icon{width:27px;min-width:27px;height:27px;font-size:13px}
 .ar-v3-trust li b{font-size:11px!important}
 .ar-v3-trust li small{font-size:10px}
 .ar-v3-quick-models{padding:12px 0 4px}
 #stock.sec{padding-top:24px}
 .ar-v3-promo-inner{grid-template-columns:1fr 110px;gap:9px}
 .ar-v3-promo img{max-height:170px}
}
@media(max-width:370px){.ar-v3-budget .budget-result p{max-width:47%}.ar-v3-budget .budget-result .ar-btn{padding:0 9px}.ar-v3-trust li small{font-size:9.5px}.ar-v3-trust li b{font-size:10.5px!important}}
@media(prefers-reduced-motion:reduce){.ar-v3-banner *, .ar-v3-budget *, .ar-v3-quick-models *{transition:none!important;animation:none!important}}
@media(prefers-reduced-transparency:reduce){body:not(.ar-ios-mode) .arh{background:#fff;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* V3 hero is no longer the previous grid-based black-banner hero. */
.ar-v3-hero h1{display:block!important;position:relative;grid-column:auto;grid-row:auto;background:transparent!important;padding:0!important;color:#fff!important;text-wrap:balance}
.ar-v3-hero .hero-lede{grid-column:auto;grid-row:auto;background:transparent!important;padding:0!important;align-self:auto}
.ar-v3-hero .ar-v3-banner{background:#091320}
.ar-v3-hero .ar-v3-scene img{object-position:center center}
/* Language switch must remain above sticky public header, without covering menu. */
body:has(.arh) #ar-language-switch{z-index:95!important}

/* Home: compact floating WhatsApp, no large green bar obscuring hero/stocks. */
@media(max-width:760px){
 body:not(.ar-ios-mode) .sticky-wa{left:auto!important;right:16px!important;bottom:calc(16px + env(safe-area-inset-bottom,0px))!important;width:56px;height:56px;min-height:56px;max-width:none;padding:0!important;border-radius:50%;display:grid;place-items:center;background:#25D366;box-shadow:0 8px 28px rgba(4,40,20,.22);z-index:75}
 body:not(.ar-ios-mode) .sticky-wa .sticky-wa-icon{width:56px;height:56px;border-radius:50%;background:transparent;color:#fff}
 body:not(.ar-ios-mode) .sticky-wa .sticky-wa-icon svg{width:26px;height:26px}
 body:not(.ar-ios-mode) .sticky-wa .sticky-wa-text,
 body:not(.ar-ios-mode) .sticky-wa .sticky-wa-arrow{display:none}
}

/* BRAND LOGO V1 (2026-10-25): logo bulat Abang Recond di header/footer/login */
body .arh-mark.arh-logo{width:44px;height:44px;padding:0;background:transparent!important;border:0!important;border-radius:50%!important;overflow:hidden;box-shadow:0 0 0 1.5px rgba(184,150,70,.6);display:block;flex:none}
body .arh-mark.arh-logo img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%}
.arf-brand-logo{display:block;width:72px;height:72px;margin:0 0 12px;border-radius:50%;box-shadow:0 0 0 1.5px rgba(184,150,70,.6)}
