/* ELITE-KEYS — base styles */
:root{
  --ek-gold:#c9a046;
  --ek-gold-2:#e6c168;
  --ek-dark:#0e0f12;
  --ek-dark-2:#1a1c22;
  --ek-text:#1f2329;
}
*{box-sizing:border-box}
body{
  font-family:'Segoe UI',Tahoma,Arial,sans-serif;
  color:var(--ek-text);
  background:#fafafa;
}
body.rtl{font-family:'Segoe UI','Tahoma','Arial',sans-serif}
a{text-decoration:none}

/* ===== Header ===== */
.topbar{background:var(--ek-dark);color:#ddd;font-size:.85rem;padding:.4rem 0}
.topbar a{color:#ddd}
.topbar a:hover{color:var(--ek-gold-2)}
.topbar .text-warning{color:var(--ek-gold-2)!important}

.navbar-dark.bg-dark{background:var(--ek-dark-2)!important;border-bottom:2px solid var(--ek-gold)}
.brand-logo{display:flex;align-items:center;gap:.6rem;color:#fff!important}
.brand-mark{
  display:inline-flex;align-items:center;justify-content:center;
  width:42px;height:42px;border-radius:8px;
  background:linear-gradient(135deg,var(--ek-gold),var(--ek-gold-2));
  color:#000;font-weight:800;letter-spacing:1px;
}
.brand-mark.sm{width:32px;height:32px;font-size:.85rem}
.brand-text{display:flex;flex-direction:column;line-height:1.1}
.brand-name{font-weight:800;letter-spacing:.5px}
.brand-tag{font-size:.7rem;opacity:.7;font-weight:400;text-transform:uppercase}

.navbar .nav-link{color:#ddd;font-weight:500}
.navbar .nav-link:hover{color:var(--ek-gold-2)}
.btn-warning{background:var(--ek-gold);border-color:var(--ek-gold);color:#111}
.btn-warning:hover{background:var(--ek-gold-2);border-color:var(--ek-gold-2);color:#000}

/* ===== Hero ===== */
.hero{
  position:relative;color:#fff;padding:90px 0 110px;
  background:
    linear-gradient(120deg,rgba(14,15,18,.85),rgba(14,15,18,.6)),
    radial-gradient(circle at 80% 20%,#3a3a4a 0,#0e0f12 60%);
  overflow:hidden;
}
.hero::after{
  content:"";position:absolute;inset:0;
  background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100"><path d="M0 50h100M50 0v100" stroke="%23c9a046" stroke-opacity=".05" stroke-width="1"/></svg>');
  pointer-events:none;
}
.hero h1{font-size:clamp(2rem,4.5vw,3.5rem);font-weight:800;line-height:1.15}
.hero .lead{font-size:1.15rem;opacity:.9;max-width:560px}
.hero .gold{color:var(--ek-gold-2)}

/* ===== Finder card ===== */
.finder-card{
  background:#fff;border-radius:16px;padding:1.75rem;
  box-shadow:0 25px 60px rgba(0,0,0,.25);
  border-top:4px solid var(--ek-gold);
}
.finder-card label{font-weight:600;color:#333;font-size:.85rem;text-transform:uppercase;letter-spacing:.5px}
.finder-card .form-select,.finder-card .form-control{padding:.65rem .9rem;border-color:#e3e3e8}
.finder-card .form-select:focus,.finder-card .form-control:focus{
  border-color:var(--ek-gold);box-shadow:0 0 0 .2rem rgba(201,160,70,.2);
}

/* ===== Section ===== */
.section{padding:70px 0}
.section-title{font-weight:800;margin-bottom:.5rem}
.section-title::after{
  content:"";display:block;width:60px;height:3px;background:var(--ek-gold);margin-top:.6rem;
}
.text-center .section-title::after{margin-left:auto;margin-right:auto}

/* ===== Service cards ===== */
.service-card{
  background:#fff;border-radius:14px;padding:1.75rem 1.25rem;
  border:1px solid #eee;height:100%;transition:.25s;text-align:center;
}
.service-card:hover{
  transform:translateY(-4px);
  box-shadow:0 18px 40px rgba(0,0,0,.08);
  border-color:var(--ek-gold);
}
.service-card .icon-wrap{
  width:64px;height:64px;border-radius:14px;margin:0 auto 1rem;
  display:flex;align-items:center;justify-content:center;
  background:linear-gradient(135deg,var(--ek-gold),var(--ek-gold-2));
  color:#000;font-size:1.7rem;
}
.service-card h5{font-weight:700;margin-bottom:.5rem}
.service-card p{font-size:.92rem;color:#666;margin-bottom:1rem;min-height:3em}
.service-card a.more{color:var(--ek-gold);font-weight:600}

/* ===== Brand list ===== */
.brand-pill{
  display:inline-flex;align-items:center;justify-content:center;
  padding:.6rem 1.1rem;border-radius:999px;background:#fff;
  border:1px solid #e6e6e6;color:#333;font-weight:600;margin:.25rem;
  transition:.2s;
}
.brand-pill:hover{border-color:var(--ek-gold);color:#000;background:#fff8e6}

/* ===== Why us ===== */
.why-card{padding:1rem;text-align:center}
.why-card i{font-size:2.4rem;color:var(--ek-gold)}
.why-card h6{font-weight:700;margin-top:.6rem}
.why-card p{font-size:.9rem;color:#666}

/* ===== Footer ===== */
.site-footer{background:var(--ek-dark);color:#ccc;margin-top:60px}
.site-footer a{color:#ccc}
.site-footer a:hover{color:var(--ek-gold-2)}
.site-footer h5,.site-footer h6{color:#fff}

/* ===== Float WhatsApp ===== */
.whatsapp-float{
  position:fixed;bottom:24px;right:24px;width:56px;height:56px;border-radius:50%;
  background:#25d366;color:#fff;display:flex;align-items:center;justify-content:center;
  font-size:1.7rem;box-shadow:0 8px 22px rgba(37,211,102,.4);z-index:1000;
}
.whatsapp-float:hover{color:#fff;background:#1da851}
body.rtl .whatsapp-float{right:auto;left:24px}

/* ===== Result/key cards ===== */
.key-card{
  background:#fff;border-radius:12px;border:1px solid #eee;
  padding:1.25rem;height:100%;transition:.2s;
}
.key-card:hover{border-color:var(--ek-gold);box-shadow:0 14px 30px rgba(0,0,0,.06)}
.key-card .key-image{
  width:100%;height:160px;border-radius:8px;
  background:#f4f4f5 url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 64 64"><circle cx="22" cy="32" r="10" fill="none" stroke="%23bbb" stroke-width="3"/><path d="M32 32h22M48 32v8M54 32v6" stroke="%23bbb" stroke-width="3" stroke-linecap="round" fill="none"/></svg>') center/64px no-repeat;
  margin-bottom:1rem;
}
.key-card .key-image.has-img{background:#f4f4f5}
.key-card img{max-width:100%;max-height:160px;display:block;margin:0 auto 1rem;object-fit:contain}
.key-meta{font-size:.85rem;color:#666}
.key-meta strong{color:#222}
.badge-keytype{
  background:#fff8e6;color:#8a6d20;border:1px solid #f0d98a;
  padding:.25rem .6rem;border-radius:999px;font-size:.75rem;font-weight:600;
}

/* ===== Service hero ===== */
.page-hero{
  background:linear-gradient(120deg,var(--ek-dark),var(--ek-dark-2));
  color:#fff;padding:60px 0;border-bottom:3px solid var(--ek-gold);
}
.page-hero h1{font-weight:800;margin:0}
.page-hero .breadcrumb{--bs-breadcrumb-divider-color:#888;margin:0}
.page-hero .breadcrumb a{color:#bbb}
.page-hero .breadcrumb .active{color:var(--ek-gold-2)}

/* ===== Forms ===== */
.form-card{background:#fff;border-radius:14px;padding:2rem;border:1px solid #eee}
.alert-success-soft{background:#e8f7ee;color:#1a6b3b;border:1px solid #b6e3c4}
.alert-error-soft{background:#fdecec;color:#a32626;border:1px solid #f5c2c2}

/* ===== Service / Key-type card images ===== */
.service-card .key-image-wrap{
  width:140px;height:140px;margin:0 auto 1.1rem;border-radius:16px;
  background:#fafafa;border:1px solid #efe9d9;
  display:flex;align-items:center;justify-content:center;overflow:hidden;
  padding:10px;transition:.25s;
}
.service-card:hover .key-image-wrap{
  border-color:var(--ek-gold);
  background:#fff8e6;
}
.service-card .key-image-wrap img{
  max-width:100%;max-height:100%;object-fit:contain;
  filter:drop-shadow(0 2px 6px rgba(0,0,0,.08));
}
.service-card .key-image-wrap i{
  font-size:2.6rem;color:var(--ek-gold);
}

/* ===== Page-hero icon ===== */
.page-hero-icon{width:72px;height:72px;border-radius:14px;background:#fff;padding:6px;object-fit:contain}
.page-hero-icon-fallback{
  width:72px;height:72px;border-radius:14px;background:linear-gradient(135deg,var(--ek-gold),var(--ek-gold-2));
  display:inline-flex;align-items:center;justify-content:center;font-size:2rem;color:#000;
}

/* ===== Origin filter pills ===== */
.origin-bar{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem}
.origin-pill{
  padding:.4rem 1rem;border-radius:999px;background:#eef0f3;color:#444;
  font-weight:600;font-size:.9rem;transition:.2s;
}
.origin-pill:hover{background:#fff8e6;color:#000}
.origin-pill.active{background:var(--ek-dark);color:var(--ek-gold-2)}

/* ===== Brand grid ===== */
.brand-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(160px,1fr));
  gap:1rem;
}
.brand-tile{
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid #e9e9ee;border-radius:12px;
  height:140px;padding:1.25rem;transition:.2s;text-align:center;
}
.brand-tile:hover{transform:translateY(-3px);border-color:var(--ek-gold);box-shadow:0 14px 30px rgba(0,0,0,.07)}
.brand-tile img{max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain}
.brand-tile-name{font-weight:700;font-size:1.05rem;color:#222;letter-spacing:.5px}

/* ===== Model grid ===== */
.model-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(220px,1fr));
  gap:1.25rem;
}
.model-tile{
  background:#fff;border:1px solid #e9e9ee;border-radius:14px;
  overflow:hidden;transition:.2s;color:inherit;text-align:center;display:block;
  position:relative;
}
.model-tile:hover{transform:translateY(-3px);border-color:var(--ek-gold);box-shadow:0 14px 30px rgba(0,0,0,.07);color:inherit}
.model-photo{
  height:140px;background:#f6f6f8;display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.model-photo img{max-width:90%;max-height:90%;width:auto;height:auto;object-fit:contain}
.model-photo img.uploaded{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:cover}
.model-photo i{font-size:3.5rem;color:#bbb}
.model-name{padding:1rem;font-weight:700;font-size:1.05rem}
.model-badge{
  position:absolute;top:.5rem;right:.5rem;
  background:var(--ek-gold);color:#000;font-size:.7rem;font-weight:700;
  padding:.2rem .55rem;border-radius:999px;letter-spacing:.3px;
}
body.rtl .model-badge{right:auto;left:.5rem}

/* ===== Brochure-style services section ===== */
.brochure-section{
  background:
    linear-gradient(180deg,#fff 0%,#fbf6e9 100%);
  position:relative;
  padding:80px 0 90px;
}
.brochure-section::before{
  content:"";position:absolute;inset:0;
  background:url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="80" height="80"><path d="M0 40h80M40 0v80" stroke="%23c9a046" stroke-opacity=".05" stroke-width="1"/></svg>');
  pointer-events:none;
}
.brochure-section .container{position:relative;z-index:1}
.brochure-header{margin-bottom:3rem}
.brochure-tagline{
  display:block;font-size:.85rem;letter-spacing:5px;
  color:var(--ek-gold);font-weight:700;text-transform:uppercase;margin-bottom:.55rem;
}
.brochure-heading{
  font-size:clamp(2rem,4vw,3rem);font-weight:900;
  color:var(--ek-dark);letter-spacing:3px;margin:0 0 1rem;text-transform:uppercase;
}
.brochure-divider{
  width:80px;height:3px;background:var(--ek-gold);margin:0 auto;
  position:relative;
}
.brochure-divider::before,.brochure-divider::after{
  content:"";position:absolute;top:50%;width:8px;height:8px;border-radius:50%;
  background:var(--ek-gold);transform:translateY(-50%);
}
.brochure-divider::before{left:-18px}
.brochure-divider::after{right:-18px}

.brochure-card{
  text-align:center;background:#fff;
  border-radius:14px;padding:1.75rem 1.4rem 1.5rem;
  border:1px solid #ece4ce;
  transition:.28s;height:100%;
  display:flex;flex-direction:column;
}
.brochure-card:hover{
  transform:translateY(-5px);
  border-color:var(--ek-gold);
  box-shadow:0 22px 45px rgba(0,0,0,.08);
}
.brochure-card .key-image-wrap{
  width:170px;height:170px;margin:0 auto 1.2rem;
  background:transparent;border:none;padding:0;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
}
.brochure-card .key-image-wrap img{
  max-width:100%;max-height:100%;
  width:auto;height:auto;
  object-fit:contain;
  border-radius:14px;
  display:block;
}
.brochure-card .key-image-wrap img{
  transition:transform .3s;
}
.brochure-card:hover .key-image-wrap{
  background:transparent !important;
  border:none !important;
}
.brochure-card:hover .key-image-wrap img{
  transform:scale(1.05);
}
.brochure-card h5{
  text-transform:uppercase;font-weight:800;letter-spacing:1.8px;
  font-size:1rem;margin:.4rem 0 .9rem;color:var(--ek-dark);
  position:relative;padding-bottom:.7rem;
}
.brochure-card h5::after{
  content:"";display:block;width:36px;height:2px;background:var(--ek-gold);
  margin:.55rem auto 0;
}
.brochure-card p{
  font-size:.88rem;color:#5b6270;line-height:1.65;
  flex-grow:1;margin-bottom:1rem;min-height:4.5em;
}
.brochure-card .more{
  font-size:.78rem;text-transform:uppercase;letter-spacing:1.5px;
  color:var(--ek-gold);font-weight:700;
}

.brochure-call-bar{
  display:flex;flex-wrap:wrap;justify-content:center;gap:1rem;
}
.brochure-phone{
  display:inline-flex;align-items:center;gap:.65rem;
  padding:.95rem 2.1rem;background:var(--ek-dark);color:#fff;
  font-weight:700;border-radius:999px;font-size:1.05rem;
  transition:.2s;letter-spacing:.6px;
}
.brochure-phone:hover{
  background:var(--ek-gold);color:#000;
  transform:translateY(-2px);
  box-shadow:0 10px 22px rgba(201,160,70,.3);
}
.brochure-phone.emergency{background:var(--ek-gold);color:#000}
.brochure-phone.emergency:hover{background:#a8842b;color:#fff}
.brochure-phone i{font-size:1.1rem}

@media(max-width:768px){
  .brochure-card .key-image-wrap{width:130px;height:130px}
  .brochure-phone{padding:.8rem 1.4rem;font-size:.95rem}
  .brochure-divider::before,.brochure-divider::after{display:none}
}

/* ===== Gold-gradient utility button (used by Install-as-App) ===== */
.btn-gold-grad{
  background: linear-gradient(135deg, #c9a046, #e6c168);
  color: #000 !important;
  border: none;
  position: relative;
  overflow: hidden;
}
.btn-gold-grad:hover{
  background: linear-gradient(135deg, #e6c168, #c9a046);
  color: #000 !important;
  transform: translateY(-1px);
  box-shadow: 0 6px 18px rgba(201,160,70,.35);
}
.btn-gold-grad:active{ transform: translateY(0); }

/* ===== Offcanvas mobile sidebar — slim & refined, slides from start ===== */
@media (max-width: 991.98px) {
  .offcanvas{
    background:
      radial-gradient(120% 80% at 0% 0%, #232531 0%, #0e0f12 60%) !important;
    color: #ddd;
    width: 280px !important;
    border: none !important;
    box-shadow: 4px 0 30px rgba(0,0,0,.45);
  }
  body.rtl .offcanvas{ box-shadow: -4px 0 30px rgba(0,0,0,.45); }

  .offcanvas-header{
    background: rgba(0,0,0,.25);
    padding: .85rem 1rem;
    position: relative;
    border-bottom: 1px solid rgba(255,255,255,.06);
  }
  .offcanvas-header::after{
    content: "";
    position: absolute;
    bottom: -1px;
    left: 1rem; right: 1rem;
    height: 2px;
    background: linear-gradient(90deg, transparent, var(--ek-gold) 50%, transparent);
  }
  .offcanvas-header .brand-logo{
    color: #fff !important;
    text-decoration: none;
    display: flex;
    align-items: center;
    gap: .55rem;
  }
  .offcanvas-header .brand-mark{
    width: 34px; height: 34px;
    font-size: .78rem;
    border-radius: 7px;
  }
  .offcanvas-header .brand-name{
    font-size: .98rem;
    font-weight: 800;
    letter-spacing: .8px;
  }
  .offcanvas-header .brand-tag{
    font-size: .55rem;
    letter-spacing: 1.4px;
    opacity: .65;
  }
  .offcanvas-header .btn-close{
    filter: invert(1) brightness(2);
    opacity: .55;
    width: .8rem; height: .8rem;
    padding: .35rem;
  }
  .offcanvas-header .btn-close:hover{ opacity: 1; }

  .offcanvas-body{
    padding: .35rem 0 0;
    display: flex;
    flex-direction: column;
  }
  .offcanvas-body .navbar-nav{
    width: 100%;
    margin: 0 !important;
  }
  .offcanvas-body .nav-item{
    border-bottom: 1px solid rgba(255,255,255,.04);
  }
  .offcanvas-body .nav-link{
    color: #ccc;
    padding: .8rem 1rem !important;
    font-size: .92rem;
    font-weight: 500;
    display: flex;
    align-items: center;
    gap: .7rem;
    transition: all .22s ease;
    position: relative;
  }
  .offcanvas-body .nav-link i{
    color: var(--ek-gold);
    font-size: 1rem;
    width: 18px;
    text-align: center;
    transition: transform .22s ease;
  }
  .offcanvas-body .nav-link::before{
    content: "";
    position: absolute;
    inset-inline-start: 0;
    top: 0; bottom: 0;
    width: 0;
    background: var(--ek-gold);
    transition: width .22s ease;
  }
  .offcanvas-body .nav-link:hover,
  .offcanvas-body .nav-link.show{
    color: var(--ek-gold-2);
    background: linear-gradient(90deg, rgba(201,160,70,.12), transparent);
    padding-inline-start: 1.25rem !important;
  }
  .offcanvas-body .nav-link:hover::before,
  .offcanvas-body .nav-link.show::before{ width: 3px; }
  .offcanvas-body .nav-link:hover i{ transform: scale(1.12); }

  .offcanvas-body .dropdown-menu{
    background: rgba(0,0,0,.35);
    border: none;
    border-radius: 0;
    margin: 0 !important;
    padding: 0;
    width: 100%;
    box-shadow: inset 0 6px 8px -6px rgba(0,0,0,.55);
  }
  .offcanvas-body .dropdown-item{
    color: #999;
    padding: .6rem 1rem .6rem 2.4rem;
    font-size: .82rem;
    display: flex;
    align-items: center;
    gap: .5rem;
    border-bottom: 1px solid rgba(255,255,255,.03);
    transition: all .15s ease;
  }
  body.rtl .offcanvas-body .dropdown-item{
    padding: .6rem 2.4rem .6rem 1rem;
  }
  .offcanvas-body .dropdown-item i{
    color: var(--ek-gold);
    font-size: .85rem;
    opacity: .75;
  }
  .offcanvas-body .dropdown-item:hover{
    background: rgba(201,160,70,.07);
    color: var(--ek-gold-2);
  }

  .offcanvas-cta{
    margin-top: auto;
    padding: .85rem;
    background: rgba(0,0,0,.25);
    border-top: 1px solid rgba(255,255,255,.05);
  }
  .offcanvas-cta .btn{
    font-size: .8rem;
    padding: .55rem .75rem;
    margin-bottom: .45rem;
    border-radius: 8px;
  }
  .offcanvas-cta .btn:last-child{ margin-bottom: 0; }
  .offcanvas-cta .btn i{ font-size: .9rem; }

  .offcanvas-backdrop.show{ opacity: .65; }
}

/* Restore inline navbar at lg+ */
@media (min-width: 992px) {
  .navbar .offcanvas{
    background: transparent !important;
    color: inherit;
    width: auto !important;
    position: static !important;
    transform: none !important;
    visibility: visible !important;
    border: none;
    flex-grow: 1;
  }
  .navbar .offcanvas-header{ display: none !important; }
  .navbar .offcanvas-body{ padding: 0; flex-direction: row; align-items: center; }
  .navbar .offcanvas-cta{ display: none !important; }
}

/* ===== Services grid: 2-per-row on mobile ===== */
@media (max-width: 767.98px) {
  .brochure-section .row > [class*="col-"]{
    /* Force 2 columns even though Bootstrap col-md-6 starts at md */
    flex: 0 0 50%;
    max-width: 50%;
  }
  .brochure-card{
    padding: 1rem .75rem 1rem;
  }
  .brochure-card .key-image-wrap{
    width: 110px;
    height: 110px;
    margin-bottom: .8rem;
  }
  .brochure-card h5{
    font-size: .82rem;
    letter-spacing: .8px;
    margin: .3rem 0 .55rem;
    padding-bottom: .45rem;
  }
  .brochure-card h5::after{ width: 24px; }
  .brochure-card p{
    font-size: .78rem;
    line-height: 1.45;
    min-height: 0;
    /* clamp to ~3 lines on small screens to keep cards even */
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .brochure-card .more{
    font-size: .7rem;
    letter-spacing: 1px;
  }
  .brochure-heading{ letter-spacing: 2px; font-size: 1.6rem !important; }
  .brochure-tagline{ letter-spacing: 3px; font-size: .72rem; }
  .brochure-call-bar{ flex-direction: column; }
  .brochure-call-bar .brochure-phone{ width: 100%; justify-content: center; }
}

/* ===== WhatsApp success screen ===== */
.wa-success{padding:1.5rem .5rem .5rem}
.wa-success .wa-icon{
  width:78px;height:78px;border-radius:50%;
  background:#25d366;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:2.6rem;box-shadow:0 10px 28px rgba(37,211,102,.35);
}
.wa-success h4{color:#1a1c22}

/* ===== Selected-key preview on contact form ===== */
.selected-key{
  display:flex;align-items:center;gap:1rem;
  background:#fff8e6;border:1px solid #f0d98a;border-radius:12px;
  padding:.85rem 1rem;
}
.selected-key img{
  width:64px;height:64px;object-fit:contain;border-radius:8px;
  background:#fff;padding:4px;
}
body.rtl .selected-key{flex-direction:row-reverse}

/* ===== Key card price ===== */
.key-price{text-align:center;font-size:1.05rem}
.key-price .price-amount{
  display:inline-block;background:#fff8e6;border:1px solid #f0d98a;
  color:#8a6d20;font-weight:800;padding:.35rem .9rem;border-radius:999px;
}
.key-price .price-onreq{
  display:inline-block;color:#888;font-size:.85rem;font-style:italic;
}

/* ===== Year grid ===== */
.year-grid{
  display:grid;
  grid-template-columns:repeat(auto-fill,minmax(90px,1fr));
  gap:.6rem;
}
.year-tile{
  display:flex;align-items:center;justify-content:center;
  background:#fff;border:1px solid #e9e9ee;border-radius:10px;
  height:54px;font-weight:700;font-size:1.05rem;color:#222;
  transition:.18s;letter-spacing:.5px;
}
.year-tile:hover{
  background:var(--ek-gold);border-color:var(--ek-gold);color:#000;
  transform:translateY(-2px);box-shadow:0 8px 20px rgba(201,160,70,.25);
}
.year-tile.has-key{
  border-color:var(--ek-gold);
  background:#fff8e6;
  position:relative;
}
.year-tile.has-key::after{
  content:"";position:absolute;top:6px;right:8px;width:6px;height:6px;
  border-radius:50%;background:var(--ek-gold);
}
body.rtl .year-tile.has-key::after{right:auto;left:8px}

/* ===== Misc ===== */
.divider-gold{height:3px;width:60px;background:var(--ek-gold);border-radius:2px}
@media(max-width:768px){
  .hero{padding:60px 0 80px}
  .section{padding:30px 0}

  /* Compact page-hero on mobile */
  .page-hero{padding:18px 0 14px;border-bottom-width:2px}
  .page-hero h1{font-size:1.15rem;line-height:1.2;display:flex;align-items:center;gap:.5rem;margin:0}
  .page-hero h1 .text-warning{font-size:.95rem}
  .page-hero .lead{display:none}
  .page-hero .breadcrumb{font-size:.75rem;margin-bottom:.3rem}
  .page-hero-icon,.page-hero-icon-fallback{width:42px;height:42px;font-size:1.2rem;border-radius:8px;padding:3px}
  .page-hero .d-flex{gap:.6rem!important;align-items:center!important}

  /* Brand grid: 3 per row, tight gap */
  .brand-grid{grid-template-columns:repeat(3,1fr);gap:.55rem}
  .brand-tile{height:88px;padding:.5rem;border-radius:10px}

  /* Model grid: 2 per row on phones */
  .model-grid{grid-template-columns:repeat(2,1fr);gap:.7rem}
  .model-photo{height:100px}
  .model-name{font-size:.85rem;padding:.55rem .4rem}

  /* Origin filter bar — smaller pills */
  .origin-bar{font-size:.8rem;gap:.35rem}
  .origin-bar strong{margin-right:.4rem!important;font-size:.78rem}
  .origin-pill{padding:.3rem .65rem;font-size:.78rem}

  /* Section title compact */
  .section-title{font-size:1.1rem!important;margin-bottom:1rem!important}
}