@font-face { font-family:VazirmatnLocal; src:url('../backend/assets/fonts/Vazirmatn-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap; }
@font-face { font-family:VazirmatnLocal; src:url('../backend/assets/fonts/Vazirmatn-Bold.ttf') format('truetype'); font-weight:700 900; font-style:normal; font-display:swap; }

:root { --ink:#17191b; --muted:#687073; --red:#d71920; --red-dark:#8d1018; --cream:#fff3f0; --line:#eadbd6; --card:#fff; }
* { box-sizing:border-box; }
body { margin:0; color:var(--ink); background:#fff; font-family:VazirmatnLocal,Vazirmatn,Tahoma,sans-serif; }
a { color:inherit; text-decoration:none; }
button,input { font:inherit; }
.container { width:min(1180px, calc(100% - 40px)); margin:auto; }
.site-header { background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:5; }
.header-inner { height:78px; display:flex; align-items:center; justify-content:space-between; gap:30px; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-logo { width:78px; height:48px; object-fit:contain; }
.brand-mark { width:47px; height:47px; display:grid; place-items:center; color:#fff; background:var(--red); border-radius:12px 3px 12px 3px; font-weight:800; font-size:18px; transform:skew(-7deg); }
.brand strong,.brand small { display:block; }
.brand strong { font-size:16px; }.brand small { color:var(--muted); font-size:10px; margin-top:2px; }
.main-nav { display:flex; align-items:center; gap:26px; color:#52595b; font-size:13px; }
.main-nav a:hover { color:var(--red); }.nav-cta { color:#fff!important; background:var(--red); padding:10px 17px; border-radius:9px; }
.menu-button { display:none; border:0; background:none; font-size:23px; }
.hero { overflow:hidden; background:linear-gradient(135deg,#fff8f1 0%,#fff 62%); border-bottom:1px solid var(--line); }
.hero-grid { min-height:480px; display:grid; grid-template-columns:1.1fr .9fr; align-items:center; gap:50px; }
.eyebrow { color:var(--red); font-size:12px; font-weight:700; letter-spacing:.2px; }
h1,h2,p { margin-top:0; } h1 { font-size:clamp(38px,5vw,66px); line-height:1.22; margin:17px 0; letter-spacing:-2px; } h1 em { color:var(--red); font-style:normal; }
.hero-copy p { color:var(--muted); max-width:580px; line-height:2; font-size:15px; }
.search-box { display:flex; max-width:610px; background:#fff; padding:6px; border:1px solid #e8ded5; border-radius:14px; box-shadow:0 12px 35px #c84a2412; margin-top:28px; }
.search-box input { flex:1; min-width:0; border:0; outline:0; padding:12px 15px; color:var(--ink); }
.search-box button { border:0; background:var(--red); color:#fff; border-radius:10px; padding:0 24px; cursor:pointer; }
.filter-panel { display:flex; gap:8px; flex-wrap:wrap; max-width:720px; margin-top:10px; }
.filter-panel select,.filter-panel button { border:1px solid #e8ded5; background:#fff; border-radius:9px; color:#606767; padding:9px 11px; font-size:11px; }
.filter-panel select:focus { outline:2px solid #f2b1a8; border-color:var(--red); }
.filter-panel button { cursor:pointer; color:var(--red); }
.catalog-filter-card { margin-top:18px; max-width:900px; padding:18px 20px; border:1px solid #eadbd0; border-radius:16px; background:#fff; box-shadow:0 14px 32px #4a26230d; }
.filter-card-heading { display:flex; align-items:center; justify-content:space-between; gap:15px; margin-bottom:15px; }
.filter-card-heading > div { display:flex; align-items:center; gap:10px; }
.filter-card-heading strong,.filter-card-heading small { display:block; }.filter-card-heading strong { font-size:13px; }.filter-card-heading small { color:var(--muted); font-size:10px; margin-top:3px; }
.filter-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#fff; background:var(--red); font-size:20px; }
.filter-card-heading button { border:0; background:#fff4f0; color:var(--red); border-radius:8px; padding:8px 11px; cursor:pointer; font-size:10px; }
.catalog-filter-card .filter-panel { max-width:none; margin-top:0; display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.catalog-filter-card label { display:grid; gap:6px; color:var(--muted); font-size:10px; }
.catalog-filter-card select { width:100%; min-height:40px; background:#fcfaf8; }
.active-filter-note { margin-top:12px; padding-top:11px; border-top:1px solid #f0e9e4; color:var(--red-dark); font-size:10px; }
.catalog-filter-card select { font-family:Vazirmatn,Tahoma,sans-serif; font-size:12px; font-weight:500; color:#303536; }
.catalog-filter-card select option { font-family:Vazirmatn,Tahoma,sans-serif; font-size:12px; color:#303536; }
body[data-home="true"] .vehicle-showcase,
body[data-home="true"] #categories,
body[data-home="true"] .vehicle-strip,
body[data-home="true"] .trust-strip,
body[data-home="true"] .brand-section,
body[data-home="true"] .feature-row,
body[data-home="true"] #catalog { display:none; }
body[data-home="true"] .hero { min-height:auto; }
body[data-home="true"] .hero-grid { min-height:0; padding:45px 0 35px; }
body[data-home="true"] .service-cards { display:none; }
.home-products { margin-top:26px; max-width:1060px; }
.home-products-heading { display:flex; align-items:end; justify-content:space-between; gap:14px; margin-bottom:12px; }
.home-products-heading h2 { margin:4px 0 0; font-size:20px; }.home-products-heading a { color:var(--red); font-size:11px; }
.home-product-track { display:flex; gap:12px; overflow-x:auto; padding:12px; border-radius:17px; background:linear-gradient(105deg,#e9363d,#f64955); scrollbar-width:thin; }
.home-product-card { min-width:186px; max-width:186px; padding:10px; border:0; border-radius:12px; background:#fff; text-align:right; color:var(--ink); cursor:pointer; box-shadow:0 8px 18px #5e0c171f; }
.home-product-image { height:115px; display:grid; place-items:center; overflow:hidden; border-radius:9px; background:linear-gradient(145deg,#f7f2ee,#fff); color:var(--red); font-size:43px; }
.home-product-image img { width:100%; height:100%; object-fit:contain; }
.home-product-category { color:var(--red); font-size:9px; margin-top:9px; }
.home-product-card h3 { height:37px; overflow:hidden; font-size:11px; font-weight:600; line-height:1.7; margin:5px 0 8px; }
.home-product-bottom { display:flex; flex-direction:column; gap:3px; border-top:1px solid #f1ece8; padding-top:7px; }.home-product-bottom .stock { font-size:9px; }.home-product-bottom strong { color:#273b86; font-size:10px; }
.home-product-status { color:#fff; font-size:9px; margin-top:8px; padding-right:5px; }
.quick-links { display:flex; gap:11px; align-items:center; flex-wrap:wrap; margin-top:14px; color:var(--muted); font-size:11px; }.quick-links button { border:0; color:var(--red); background:none; cursor:pointer; padding:0; }
.hero-visual { min-height:355px; position:relative; display:grid; place-items:center; }
.hero-visual:before { content:''; position:absolute; width:280px; height:280px; border-radius:50%; background:#f9dfd8; filter:blur(1px); }
.hero-orbit { position:absolute; border:1px solid #e59a8e; border-radius:50%; transform:rotate(-25deg); }.orbit-one { width:360px; height:160px; }.orbit-two { width:320px; height:230px; transform:rotate(32deg); }
.hero-part { position:relative; width:170px; height:170px; display:grid; place-items:center; border-radius:38px; background:linear-gradient(145deg,#ed5c4d,#a82420); color:#fff; font-size:95px; box-shadow:15px 24px 30px #a8242038; transform:rotate(-12deg); }
.hero-card { position:absolute; z-index:2; bottom:22px; right:12px; background:#fff; border:1px solid var(--line); border-radius:12px; padding:14px 17px; box-shadow:0 15px 30px #40201812; }.hero-card span { display:block; color:var(--muted); font-size:10px; }.hero-card strong { color:var(--red); font-size:26px; display:block; margin:2px 0; }
.section { padding:70px 0; }.section-heading { display:flex; justify-content:space-between; align-items:end; gap:20px; margin-bottom:25px; }.section-heading h2 { margin:7px 0 0; font-size:27px; }.section-heading a { color:var(--red); font-size:12px; }.result-count { color:var(--muted); font-size:12px; }.compact { margin-bottom:20px; }.catalog-actions { display:flex; align-items:center; gap:12px; }.pdf-button { border:0; border-radius:9px; background:var(--red); color:#fff; padding:10px 14px; cursor:pointer; font-size:11px; }.pdf-button:disabled { opacity:.6; cursor:wait; }
.category-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:14px; }.category-card { text-align:right; border:1px solid var(--line); background:var(--card); border-radius:14px; padding:22px; cursor:pointer; transition:.2s; }.category-card:hover { border-color:#eb9c91; transform:translateY(-3px); box-shadow:0 10px 25px #7e24150d; }.category-card span { display:grid; place-items:center; width:42px; height:42px; border-radius:11px; background:#fff0ec; color:var(--red); font-size:23px; margin-bottom:18px; }.category-card strong,.category-card small { display:block; }.category-card strong { font-size:14px; }.category-card small { color:var(--muted); font-size:11px; margin-top:6px; }
.vehicle-strip { background:var(--cream); padding:47px 0; }.vehicle-list { display:flex; gap:10px; flex-wrap:wrap; }.vehicle-list button { border:1px solid #ead9cb; background:#fff; border-radius:30px; padding:10px 19px; cursor:pointer; color:#555; }.vehicle-list button:hover { border-color:var(--red); color:var(--red); }
.product-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }.product { border:1px solid var(--line); border-radius:14px; padding:17px; display:grid; grid-template-columns:85px 1fr; gap:15px; }.product-visual { width:85px; height:85px; border-radius:12px; display:grid; place-items:center; color:#c63a2f; background:linear-gradient(145deg,#fff0e9,#f8d9d1); font-size:36px; overflow:hidden; }.product-visual img { width:100%; height:100%; object-fit:cover; }.product h3 { font-size:14px; margin:3px 0 8px; }.product p { color:var(--muted); font-size:11px; margin-bottom:10px; }.product-meta { display:flex; justify-content:space-between; align-items:center; font-size:11px; }.stock { color:#358b62; }.price { font-weight:700; }.empty { grid-column:1/-1; color:var(--muted); padding:30px; text-align:center; border:1px dashed var(--line); border-radius:14px; }
.product-button { width:100%; text-align:right; cursor:pointer; background:#fff; color:var(--ink); transition:.2s; }.product-button:hover { border-color:#e59a8e; transform:translateY(-3px); box-shadow:0 12px 24px #7e24150d; }
.detail-section { padding-top:0; }.detail-loading { color:var(--muted); padding:30px; text-align:center; }.detail-back { border:0; background:none; color:var(--red); cursor:pointer; font-size:12px; margin-bottom:16px; }.detail-card { display:grid; grid-template-columns:340px 1fr; gap:35px; border:1px solid var(--line); border-radius:20px; padding:25px; background:#fff; box-shadow:0 18px 40px #4a262310; }.detail-image { min-height:290px; display:grid; place-items:center; border-radius:16px; background:linear-gradient(145deg,#fff0e9,#f7d4cc); overflow:hidden; }.detail-image img { width:100%; height:100%; min-height:290px; object-fit:cover; }.detail-image span { color:var(--red); font-size:90px; }.detail-copy h2 { font-size:30px; margin:10px 0; }.detail-sku { color:var(--muted); font-size:12px; }.detail-description { line-height:2; color:#5e6667; font-size:13px; margin:25px 0; }.detail-specs { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:0; }.detail-specs div { background:#fff8f1; border-radius:10px; padding:11px; }.detail-specs dt { color:var(--muted); font-size:10px; }.detail-specs dd { margin:5px 0 0; font-size:12px; }.detail-action { margin-top:24px; border:0; background:var(--red); color:#fff; border-radius:10px; padding:12px 20px; cursor:pointer; }
.feature-row { display:grid; grid-template-columns:1.5fr repeat(3,1fr); gap:18px; padding:65px 0 80px; border-top:1px solid var(--line); }.feature-row h2 { font-size:23px; margin-top:10px; }.feature { border-right:1px solid var(--line); padding:8px 20px; }.feature strong { color:var(--red); display:block; font-size:24px; margin-bottom:10px; }.feature span { font-size:12px; color:var(--muted); line-height:1.8; }
footer { background:#202424; color:#fff; padding:24px 0; }.footer-inner { display:flex; gap:22px; align-items:center; font-size:12px; }.footer-logo { width:170px; max-height:58px; object-fit:contain; background:#fff; border-radius:7px; padding:4px 8px; }.footer-inner span { color:#aeb5b4; flex:1; }.footer-inner a { color:#f38a7d; direction:ltr; }
.catalog-page { background:#fff; min-height:calc(100vh - 150px); }
.catalog-toolbar { padding:42px 0 26px; background:linear-gradient(180deg,#fff8f1 0%,#fff 100%); border-bottom:1px solid var(--line); }
.catalog-search { max-width:760px; margin:0 auto 18px; }
.catalog-filter-card { max-width:1000px; margin:0 auto; }
.catalog-results { padding-top:35px; }
.catalog-results .section-heading { margin-bottom:22px; }
.catalog-results h1 { font-size:32px; margin:8px 0 0; letter-spacing:-.5px; }
.catalog-actions { display:flex; align-items:center; gap:14px; }
@media (max-width:760px) { .catalog-actions { align-items:flex-start; flex-direction:column; gap:8px; }.catalog-results h1 { font-size:26px; } }
@media (max-width:760px) { .container { width:min(100% - 28px,1180px); }.main-nav { display:none; }.menu-button { display:block; }.hero-grid { grid-template-columns:1fr; min-height:auto; padding:65px 0 30px; gap:10px; }.hero-visual { min-height:280px; transform:scale(.86); }.category-grid,.product-grid { grid-template-columns:1fr 1fr; }.feature-row { grid-template-columns:1fr 1fr; }.feature-row>div:first-child { grid-column:1/-1; }.footer-inner { flex-wrap:wrap; } }
@media (max-width:470px) { h1 { font-size:39px; }.category-grid,.product-grid { grid-template-columns:1fr; }.feature-row { grid-template-columns:1fr; }.feature { border-right:0; border-top:1px solid var(--line); padding:18px 0; } }

/* Rahyaft brand layer */
.utility-bar { background:#202424; color:#c5ccca; font-size:10px; }
.utility-bar { display:none; }
.utility-inner { height:30px; display:flex; align-items:center; justify-content:space-between; }
.utility-inner a { color:#f39486; direction:ltr; display:inline-block; margin-right:4px; }
.hero-photo { position:absolute; width:320px; height:320px; border-radius:44% 56% 52% 48%; background:linear-gradient(145deg,#0005,#0000),url('https://images.unsplash.com/photo-1492144534655-ae79c964c9d7?auto=format&fit=crop&w=900&q=85') center/cover; box-shadow:18px 25px 55px #5a211d32; transform:rotate(-6deg); }
.hero-part { width:105px; height:105px; font-size:54px; z-index:1; }
.vehicle-showcase { padding-bottom:25px; }
.vehicle-cards { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; }
.vehicle-card { min-height:205px; border:0; border-radius:18px; padding:20px; text-align:right; color:#fff; cursor:pointer; overflow:hidden; position:relative; background-size:cover; background-position:center; box-shadow:0 14px 25px #4a26231c; transition:.25s; }
.vehicle-card:after { content:''; position:absolute; inset:0; background:linear-gradient(0deg,#111c,transparent 75%); }
.vehicle-card>* { position:relative; z-index:1; display:block; }
.vehicle-card span { font-size:10px; color:#ffd1c9; }
.vehicle-card strong { font-size:20px; margin-top:85px; }
.vehicle-card small { font-size:11px; margin-top:5px; color:#f5e6e2; }
.vehicle-card:hover { transform:translateY(-5px); box-shadow:0 20px 30px #4a26232e; }
.vehicle-peugeot { background-image:url('https://images.unsplash.com/photo-1503376780353-7e6692767b70?auto=format&fit=crop&w=900&q=80'); }
.vehicle-pride { background-image:url('https://images.unsplash.com/photo-1542362567-b07e54358753?auto=format&fit=crop&w=900&q=80'); }
.vehicle-samand { background-image:url('https://images.unsplash.com/photo-1493238792000-8113da705763?auto=format&fit=crop&w=900&q=80'); }
.trust-strip { background:#202424; color:#fff; padding:26px 0; }
.trust-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:20px; }
.trust-grid div { border-left:1px solid #ffffff22; padding-left:20px; }
.trust-grid div:last-child { border-left:0; }
.trust-grid strong,.trust-grid span { display:block; }
.trust-grid strong { font-size:13px; }
.trust-grid span { color:#abb4b1; font-size:10px; margin-top:5px; }
@media (max-width:760px) {
  .utility-inner { height:auto; min-height:30px; padding:6px 0; gap:10px; }
  .vehicle-cards { grid-template-columns:1fr; }
  .vehicle-card { min-height:180px; }
  .trust-grid { grid-template-columns:1fr 1fr; }
  .trust-grid div:nth-child(2) { border-left:0; }
  .detail-card { grid-template-columns:1fr; }.detail-image { min-height:210px; }.detail-image img { min-height:210px; }
  .catalog-filter-card .filter-panel { grid-template-columns:1fr; }.filter-card-heading { align-items:flex-start; flex-direction:column; }
  body[data-home="true"] .hero { min-height:auto; }
  body[data-home="true"] .hero-grid { min-height:0; }
  .home-product-card { min-width:160px; max-width:160px; }
}

/* Interactive TGR header: reference visual language, real controls */
.interactive-header { position:sticky; top:0; z-index:20; background:#fff; border:0; box-shadow:0 8px 24px #10151c18; }
.header-service-bar { background:#11161d; color:#f4f5f5; border-bottom:1px solid #ffffff1c; }
.service-bar-inner { min-height:38px; display:flex; align-items:center; justify-content:space-between; gap:20px; font-size:10px; }
.service-bar-inner span { white-space:nowrap; }.service-bar-inner span::first-letter { color:#ed1c29; }
.service-bar-inner a { color:#fff; white-space:nowrap; direction:rtl; }.service-bar-inner a::first-letter { color:#ed1c29; }
.header-main-row { min-height:126px; display:grid; grid-template-columns:190px minmax(300px,1fr) 250px; align-items:center; gap:28px; }
.header-logo { display:block; line-height:0; }.header-logo img { width:180px; height:100px; object-fit:contain; }
.interactive-search { height:58px; display:flex; align-items:center; padding:0; margin:0; max-width:none; border:1px solid #cfd1d3; border-radius:12px; box-shadow:none; overflow:hidden; background:#fff; }
.interactive-search .search-category { width:145px; height:100%; display:flex; align-items:center; justify-content:center; gap:14px; color:#4d5256; font-size:12px; border-left:1px solid #e3e4e5; }
.interactive-search .search-category span { font-size:20px; color:#777; }
.interactive-search input { height:100%; padding:0 18px; font-size:13px; }
.interactive-search button { width:72px; height:100%; border-radius:0; padding:0; background:var(--red); font-size:31px; }
.header-actions { display:flex; align-items:center; justify-content:flex-end; gap:14px; }
.header-actions a { position:relative; display:flex; align-items:center; gap:8px; min-height:54px; padding:0 14px; border-radius:10px; font-size:12px; white-space:nowrap; }
.action-login { color:var(--red); border:1px solid var(--red); }
.action-cart { color:#fff; background:#11161d; border:1px solid #11161d; }
.action-icon { font-size:27px; line-height:1; }
.action-cart i { position:absolute; top:-9px; right:-7px; display:grid; place-items:center; width:22px; height:22px; border-radius:50%; color:#fff; background:var(--red); font-size:10px; font-style:normal; }
.header-nav { background:#11161d; border-bottom:3px solid var(--red); }
.header-nav-inner { min-height:58px; display:flex; justify-content:center; align-items:center; gap:0; }
.header-nav-inner a { position:relative; padding:18px 36px 16px; color:#fff; font-size:14px; font-weight:700; border-left:1px solid #ffffff25; transition:.2s; }
.header-nav-inner a:first-child { border-left:0; }.header-nav-inner a:hover,.header-nav-inner a.is-current { color:#ff2b35; }
.header-nav-inner a.is-current::after { content:''; position:absolute; bottom:-3px; right:50%; width:44px; height:5px; border-radius:4px 4px 0 0; background:var(--red); transform:translateX(50%); }
@media (max-width:900px) {
  .service-bar-inner { overflow:hidden; justify-content:flex-start; gap:25px; }
  .service-bar-inner span:nth-child(2) { display:none; }
  .header-main-row { min-height:105px; grid-template-columns:135px 1fr; gap:15px; }
  .header-logo img { width:130px; height:78px; }
  .header-actions { grid-column:1/-1; grid-row:2; justify-content:center; margin-top:-22px; }
  .interactive-search { grid-column:2; grid-row:1; height:48px; }
  .interactive-search .search-category { display:none; }
  .interactive-search button { width:56px; font-size:26px; }
  .header-nav-inner { overflow-x:auto; justify-content:flex-start; }
  .header-nav-inner a { padding:15px 20px 13px; white-space:nowrap; font-size:12px; }
}

/* Compact footer with only the remaining menus and contact icons. */
.compact-footer {
  margin-top:60px;
  color:#e8ecef;
  background:#111820;
  border-top:3px solid var(--red);
}
.compact-footer-grid {
  display:grid;
  grid-template-columns:1.35fr repeat(3,1fr);
  gap:36px;
  padding:34px 0 26px;
}
.compact-footer-brand img {
  width:142px;
  height:auto;
  display:block;
  margin-bottom:12px;
  filter:drop-shadow(0 4px 8px #0006);
}
.compact-footer-brand p {
  max-width:235px;
  margin:0;
  color:#aeb8bf;
  font-size:11px;
  line-height:2;
}
.compact-footer-column {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:10px;
}
.compact-footer-column h4 {
  margin:0 0 5px;
  color:#fff;
  font-size:14px;
}
.compact-footer-column h4::after {
  content:'';
  display:block;
  width:28px;
  height:3px;
  margin-top:8px;
  background:var(--red);
}
.compact-footer-column a {
  color:#adb7bd;
  font-size:11px;
}
.compact-footer-column a:hover { color:#ff4a52; }
.compact-footer-contact {
  display:flex;
  flex-wrap:wrap;
  gap:12px 34px;
  padding:14px 0;
  border-top:1px solid #ffffff1b;
  color:#c8d0d4;
  font-size:11px;
}
.compact-footer-contact span { white-space:nowrap; }
.compact-footer-contact span:first-letter { color:var(--red); }
.compact-footer-bottom {
  padding:13px 20px;
  text-align:center;
  color:#89949b;
  font-size:10px;
  border-top:1px solid #ffffff12;
}
@media (max-width:760px) {
  .compact-footer-grid { grid-template-columns:1fr 1fr; gap:25px 18px; padding:28px 0 22px; }
  .compact-footer-brand { grid-column:1/-1; }
  .compact-footer-contact { flex-direction:column; gap:9px; }
}
@media (max-width:470px) {
  .compact-footer-grid { grid-template-columns:1fr; }
  .compact-footer-brand { grid-column:auto; }
}
@media (max-width:600px) {
  .interactive-header { position:relative; }
  .service-bar-inner { min-height:32px; font-size:9px; }
  .service-bar-inner span:first-child { display:none; }
  .service-bar-inner a { margin:auto; }
  .header-main-row { min-height:125px; grid-template-columns:1fr; padding:8px 0 15px; gap:8px; }
  .header-logo { text-align:center; }.header-logo img { width:145px; height:66px; }
  .interactive-search { grid-column:1; grid-row:2; width:100%; }
  .header-actions { grid-column:1; grid-row:3; margin:0; }
  .header-actions a { min-height:37px; padding:0 12px; font-size:10px; }
  .action-icon { font-size:20px; }
  .header-nav-inner { min-height:48px; }
  .header-nav-inner a { padding:14px 15px 11px; font-size:11px; }
}

/* Compact centered TGR visual header */
.header-brand-visual {
  position:relative;
  height:185px;
  overflow:hidden;
  background:#f3f3f2 url('./assets/tgr-header-reference.png') center 68% / cover no-repeat;
  border-bottom:1px solid #d7d7d7;
}
.header-brand-visual::after {
  content:'';
  position:absolute;
  top:16px;
  left:50%;
  width:250px;
  height:105px;
  transform:translateX(-50%);
  background:url('./assets/TGR.png') center/contain no-repeat;
  filter:drop-shadow(0 5px 8px #0003);
  pointer-events:none;
}
.header-main-row { min-height:78px; grid-template-columns:minmax(0,1fr) 250px; padding-top:10px; padding-bottom:10px; }
.header-main-row .header-search { grid-column:1; }
.header-main-row .header-actions { grid-column:2; }
.header-logo { display:none; }
.header-nav-inner { min-height:48px; }
.header-nav-inner a { padding-top:14px; padding-bottom:12px; }
.hero-slider,.hero-slides,.hero-slide-inner,body[data-home="true"] .hero-slider { min-height:300px; }
.hero-slide-copy { padding-top:24px; padding-bottom:24px; }
.hero-slide-copy h1 { font-size:clamp(30px,4vw,48px); margin:8px 0; }
.hero-slide-copy p { font-size:12px; margin-bottom:14px; }
@media (max-width:900px) {
  .header-brand-visual { height:155px; background-position:center 68%; }
  .header-main-row { min-height:110px; grid-template-columns:1fr; }
  .header-main-row .header-search,.header-main-row .header-actions { grid-column:1; }
  .header-main-row .header-actions { margin:0; }
}
@media (max-width:600px) {
  .header-brand-visual { height:125px; background-size:auto 255px; background-position:center 68%; }
  .header-brand-visual::after { top:10px; width:175px; height:72px; }
  .header-main-row { min-height:116px; padding-top:9px; padding-bottom:12px; }
  .hero-slider,.hero-slides,.hero-slide-inner,body[data-home="true"] .hero-slider { min-height:250px; }
  .hero-slide-copy { padding:20px 0 35px; }
  .hero-slide-copy h1 { font-size:31px; }
}

/* Compact service strip: keep the brand's black line without extra text */
.header-service-bar { height:22px; min-height:22px; }
.service-bar-inner { min-height:22px; height:22px; }
.service-bar-inner > * { display:none; }

/* TGR signature header and footer */
.site-header {
  background:rgba(255,255,255,.94);
  border-bottom:1px solid #eaded6;
  box-shadow:0 8px 24px rgba(63,28,19,.06);
  backdrop-filter:blur(14px);
}
.header-inner { min-height:86px; height:auto; padding:13px 0; }
.brand { gap:11px; }
.brand-symbol {
  width:52px; height:52px; display:grid; place-items:center; flex:0 0 auto;
  color:#fff; font:900 16px/1 Arial,sans-serif; letter-spacing:-1px;
  border-radius:16px 5px 16px 5px; transform:skew(-7deg);
  background:linear-gradient(145deg,#f04b3d,#a91e29);
  box-shadow:0 9px 18px rgba(187,35,38,.25);
}
.brand strong { color:#18282d; font-size:20px; letter-spacing:.5px; }
.brand small { color:#8a7770; font-size:10px; margin-top:4px; }
.main-nav { gap:8px; padding:5px; border:1px solid #eee4dc; border-radius:14px; background:#fffaf7; }
.main-nav a { padding:10px 13px; border-radius:9px; color:#596264; transition:.2s; }
.main-nav a:hover,.main-nav a.is-current { color:var(--red); background:#fff0eb; }
.header-action {
  display:flex; align-items:center; gap:8px; padding:10px 13px; color:#fff;
  background:#1d2f35; border-radius:11px; font-size:11px; box-shadow:0 8px 18px #1d2f3526;
}
.header-action b { width:22px; height:22px; display:grid; place-items:center; border-radius:7px; color:#1d2f35; background:#fff; font-size:18px; line-height:1; }
.menu-button { color:#1d2f35; }
.site-footer { margin-top:70px; padding:48px 0 0; color:#dce4e2; background:radial-gradient(circle at 90% 0%,#3c2527 0,#202b30 35%,#152025 100%); }
.footer-grid { display:grid; grid-template-columns:1.45fr 1fr 1fr 1.1fr; gap:34px; padding-bottom:38px; }
.footer-brand h3 { margin:13px 0 8px; color:#fff; font:700 18px/1.4 Arial,sans-serif; direction:ltr; text-align:right; }
.footer-brand p { max-width:280px; margin:0; color:#aebcba; font-size:11px; line-height:2; }
.footer-column,.footer-contact { display:flex; flex-direction:column; align-items:flex-start; gap:10px; }
.footer-grid h4 { margin:4px 0 8px; color:#fff; font-size:13px; position:relative; }
.footer-grid h4:after { content:''; display:block; width:25px; height:3px; margin-top:8px; border-radius:2px; background:var(--red); }
.footer-column a,.footer-column span,.footer-contact span,.footer-contact a:not(.footer-phone) { color:#aebcba; font-size:11px; transition:.2s; }
.footer-column a:hover,.footer-contact a:hover { color:#ff8c7f; transform:translateX(-3px); }
.footer-phone { color:#fff!important; font-size:18px!important; font-weight:700; direction:ltr; }
.footer-bottom { display:flex; justify-content:space-between; gap:15px; padding:17px 0; border-top:1px solid #ffffff18; color:#839493; font-size:10px; }
.brand-logo { width:112px; height:60px; object-fit:contain; }
.brand strong { color:#111; }
.site-header:before { content:''; display:block; height:3px; background:linear-gradient(90deg,#111 0 22%,var(--red) 22% 78%,#111 78%); }
.site-header { border-bottom-color:#1b1b1b; }
.main-nav { background:#17191b; border-color:#17191b; }
.main-nav a { color:#f4f4f4; }
.main-nav a:hover,.main-nav a.is-current { color:#fff; background:var(--red); }
.hero-slider { background:#101112; }
.hero-slide-copy h1 em { color:#ff555d; }
.home-product-track { background:linear-gradient(105deg,#b70e18,#e3262e); }
.trust-strip { background:#111315; }
@media (max-width:760px) {
  .header-inner { min-height:72px; }
  .main-nav { display:none; }
  .header-action { margin-right:auto; padding:8px 10px; }
  .header-action span { display:none; }
  .footer-grid { grid-template-columns:1fr 1fr; gap:27px 18px; }
  .footer-brand { grid-column:1/-1; }
  .footer-bottom { flex-direction:column; text-align:center; align-items:center; }
}
@media (max-width:470px) {
  .footer-grid { grid-template-columns:1fr; }
  .footer-brand { grid-column:auto; }
}

/* Final TGR header layout: one dark shell, centered logo, no white spacer */
.interactive-header {
  position:sticky;
  top:0;
  z-index:20;
  overflow:visible;
  background:#11161d;
  border:0;
  box-shadow:0 8px 24px #10151c30;
}
.interactive-header .header-service-bar {
  height:42px;
  min-height:42px;
  background:#11161d;
  border-bottom:1px solid #ffffff1c;
}
.interactive-header .service-bar-inner {
  height:42px;
  min-height:42px;
  justify-content:flex-start;
  direction:ltr;
  color:#f4f5f5;
  font-size:12px;
}
.interactive-header .service-bar-inner > span:first-child {
  display:block;
  white-space:nowrap;
}
.interactive-header .service-bar-inner > *:not(:first-child) { display:none; }
.interactive-header .header-brand-visual {
  height:112px;
  background:#11161d;
  border:0;
  overflow:visible;
}
.interactive-header .header-brand-visual::after {
  top:50%;
  left:50%;
  width:300px;
  height:108px;
  transform:translate(-50%,-50%);
  background:url('./assets/TGR.png') center/contain no-repeat;
  filter:drop-shadow(0 5px 8px #0008);
}
.interactive-header .header-main-row {
  min-height:72px;
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:18px;
  padding-top:10px;
  padding-bottom:10px;
  background:#11161d;
}
.interactive-header .interactive-search {
  height:52px;
  border:0;
  border-radius:8px;
  background:#fff;
  box-shadow:none;
}
.interactive-header .interactive-search .search-category {
  background:#f5f5f5;
  border-left:1px solid #ddd;
}
.interactive-header .header-actions { gap:10px; }
.interactive-header .header-actions a { min-height:46px; }
.interactive-header .action-login { color:#fff; border-color:#ffffff55; }
.interactive-header .action-cart { background:#20262e; border-color:#ffffff22; }
.interactive-header .header-nav {
  background:#11161d;
  border-top:1px solid #ffffff1c;
  border-bottom:3px solid var(--red);
}
.interactive-header .header-nav-inner { min-height:54px; }
.interactive-header .header-nav-inner a {
  padding:16px 30px 13px;
  color:#f4f4f4;
}
.interactive-header .header-nav-inner a:hover,
.interactive-header .header-nav-inner a.is-current { color:#fff; background:var(--red); }
.interactive-header .header-nav-inner a.is-current::after { display:none; }

/* Exact supplied header artwork with the site menu directly beneath it. */
.reference-header { background:#10151c; border:0; }
.reference-header-art { width:100%; line-height:0; background:#10151c; }
.reference-header-art img { display:block; width:100%; height:auto; max-height:none; object-fit:contain; }
.reference-header .reference-nav { min-height:54px; background:#151a21; border-top:1px solid #ffffff1c; }
.reference-header .header-nav-inner { min-height:54px; display:flex; align-items:center; justify-content:center; gap:4px; }
.reference-header .header-nav-inner a { padding:9px 17px; border-radius:8px; color:#e9ecec; font-size:12px; transition:.2s; }
.reference-header .header-nav-inner a:hover,
.reference-header .header-nav-inner a.is-current { color:#fff; background:var(--red); }
@media (max-width:760px) {
  .reference-header-art img { min-height:0; object-fit:contain; }
  .reference-header .header-nav-inner { overflow-x:auto; justify-content:flex-start; padding:0 12px; }
  .reference-header .header-nav-inner a { white-space:nowrap; padding:8px 12px; font-size:10px; }
}
@media (max-width:900px) {
  .interactive-header .header-brand-visual { height:96px; }
  .interactive-header .header-brand-visual::after { width:240px; height:86px; }
  .interactive-header .header-main-row { grid-template-columns:1fr; gap:8px; }
  .interactive-header .header-actions { justify-content:center; }
  .interactive-header .header-nav-inner { overflow-x:auto; justify-content:flex-start; }
  .interactive-header .header-nav-inner a { white-space:nowrap; padding-left:18px; padding-right:18px; }
}
@media (max-width:600px) {
  .interactive-header { position:relative; }
  .interactive-header .header-service-bar,
  .interactive-header .service-bar-inner { height:34px; min-height:34px; }
  .interactive-header .service-bar-inner { font-size:10px; }
  .interactive-header .header-brand-visual { height:82px; }
  .interactive-header .header-brand-visual::after { width:190px; height:68px; }
  .interactive-header .header-main-row { min-height:108px; padding-top:8px; padding-bottom:8px; }
  .interactive-header .interactive-search { height:46px; }
  .interactive-header .interactive-search .search-category { width:112px; font-size:10px; }
  .interactive-header .header-nav-inner { min-height:46px; }
  .interactive-header .header-nav-inner a { padding-top:13px; padding-bottom:10px; font-size:10px; }
}

/* Keep the supplied banner artwork intact; unify only the menu/search chrome. */
.interactive-header .header-brand-visual {
  height:185px;
  background:#f3f3f2 url('./assets/tgr-header-reference.png') center 68% / cover no-repeat;
  border-bottom:1px solid #d7d7d7;
}
.interactive-header .header-brand-visual::after {
  display:none;
}
.interactive-header .header-main-row {
  min-height:72px;
  grid-template-columns:minmax(300px,1fr) auto;
  padding:10px 20px;
  background:#11161d;
}
.interactive-header .interactive-search {
  height:52px;
  border:0;
  border-radius:4px;
  background:#fff;
  box-shadow:none;
}
.interactive-header .interactive-search .search-category {
  background:#f5f5f5;
}
.interactive-header .header-actions a {
  min-height:46px;
}
.interactive-header .header-nav {
  background:#11161d;
  border-top:1px solid #ffffff1c;
  border-bottom:3px solid var(--red);
}
.interactive-header .header-nav-inner {
  min-height:58px;
}
.interactive-header .header-nav-inner a {
  padding:17px 30px 14px;
}
@media (max-width:900px) {
  .interactive-header .header-brand-visual { height:155px; }
  .interactive-header .header-main-row {
    grid-template-columns:1fr;
    padding:8px 14px 10px;
  }
}
@media (max-width:600px) {
  .interactive-header .header-brand-visual { height:125px; }
  .interactive-header .header-main-row { min-height:110px; }
}

/* The search/actions live visually inside the same black navigation bar. */
@media (min-width:901px) {
  .interactive-header { position:relative; }
  .interactive-header .header-main-row {
    position:absolute;
    right:0;
    bottom:0;
    left:0;
    z-index:3;
    height:78px;
    min-height:78px;
    display:block;
    padding:13px 18px;
    pointer-events:none;
    background:transparent;
  }
  .interactive-header .header-search {
    position:absolute;
    top:13px;
    right:18px;
    width:min(360px, 30vw);
    max-width:360px;
    pointer-events:auto;
  }
  .interactive-header .header-actions {
    position:absolute;
    top:13px;
    left:18px;
    pointer-events:auto;
  }
  .interactive-header .header-nav-inner {
    justify-content:center;
    padding-right:390px;
    padding-left:205px;
  }
}

/* Reference-inspired TGR mega header */
.site-header { background:#f7f7f6; overflow:visible; }
.header-showcase { background:linear-gradient(115deg,#171b22 0%,#20252d 62%,#e11b25 62%,#f02c31 84%,#171b22 84%); color:#fff; }
.showcase-inner { min-height:136px; display:grid; grid-template-columns:1.1fr 1fr 1.3fr; align-items:center; gap:30px; }
.showcase-inner .brand { color:#fff; }
.showcase-inner .brand strong { color:#fff; }
.showcase-inner .brand small { color:#d1d3d4; }
.showcase-inner .brand-logo { width:145px; height:88px; background:#fff; border-radius:8px; padding:4px 8px; }
.showcase-copy { text-align:center; }
.showcase-copy strong { display:block; font-size:25px; letter-spacing:-.5px; }
.showcase-copy span { display:block; margin-top:8px; color:#f5f5f5; font-size:14px; }
.showcase-copy b { color:#ff3a42; padding:0 8px; }
.showcase-benefits { display:flex; justify-content:flex-start; gap:18px; flex-wrap:wrap; }
.showcase-benefits span { color:#fff; font-size:10px; white-space:nowrap; }
.header-tools { background:#171b22; border-top:1px solid #ffffff1c; }
.tools-inner { min-height:82px; display:flex; align-items:center; gap:20px; }
.vehicle-picker { min-width:210px; display:flex; align-items:center; justify-content:space-between; gap:10px; padding:14px 17px; border:1px solid #5a3036; border-radius:12px; color:#fff; background:linear-gradient(105deg,#242a35,#68252c); cursor:pointer; }
.vehicle-picker span { flex:1; text-align:right; font-weight:700; }
.vehicle-picker b { font-size:20px; color:#ff4c54; }
.header-search { flex:1; display:flex; height:52px; padding:4px; border-radius:30px; background:#fff; box-shadow:0 8px 22px #0004; }
.header-search input { flex:1; min-width:0; padding:0 20px; border:0; outline:0; background:transparent; color:#262b30; }
.header-search button { width:62px; border:0; border-radius:26px; color:#fff; background:var(--red); font-size:29px; line-height:1; cursor:pointer; }
.header-future-links { display:flex; align-items:center; gap:17px; }
.header-future-links a { display:flex; align-items:center; gap:6px; position:relative; color:#fff; font-size:11px; white-space:nowrap; }
.header-future-links a:first-letter { font-size:24px; }
.header-future-links a:hover { color:#ff525a; }
.header-future-links i { position:absolute; top:-11px; right:-10px; width:18px; height:18px; display:grid; place-items:center; border-radius:50%; background:var(--red); color:#fff; font-size:9px; font-style:normal; }
.header-categories { background:#15191f; border-top:1px solid #ffffff17; }
.categories-inner { min-height:61px; display:flex; align-items:center; gap:0; }
.categories-inner > a { padding:9px 21px; color:#f1f3f3; font-size:12px; border-left:1px solid #ffffff26; white-space:nowrap; }
.categories-inner > a:hover { color:#ff5058; }
.categories-inner .category-menu { margin-left:auto; border:0; border-radius:0 0 0 17px; background:linear-gradient(105deg,#ed1d2a,#a90d1b); font-size:14px; }
.categories-inner .category-menu strong { margin-right:8px; }
.categories-inner .special-offer { margin-right:auto; border:0; border-radius:17px 0 0 17px; background:linear-gradient(105deg,#ed1d2a,#a90d1b); font-weight:700; }
@media (max-width:900px) {
  .showcase-inner { grid-template-columns:1fr 1fr; min-height:112px; }
  .showcase-copy { display:none; }
  .showcase-benefits { justify-content:flex-end; }
  .tools-inner { flex-wrap:wrap; padding:12px 0; }
  .vehicle-picker { min-width:175px; order:2; }
  .header-search { order:1; flex-basis:100%; }
  .header-future-links { order:3; margin-right:auto; }
  .categories-inner { overflow-x:auto; justify-content:flex-start; }
  .categories-inner .category-menu,.categories-inner .special-offer { margin:0; }
}
@media (max-width:600px) {
  .showcase-inner { min-height:92px; grid-template-columns:1fr; }
  .showcase-inner .brand { justify-content:center; }
  .showcase-inner .brand-logo { width:125px; height:65px; }
  .showcase-benefits { display:none; }
  .vehicle-picker { flex:1; }
  .header-future-links { gap:12px; }
  .header-future-links span { display:none; }
  .categories-inner > a { padding:9px 15px; font-size:10px; }
}

/* Exact supplied TGR artwork, normalized for web proportions */
.reference-header { background:#10151c; border:0; position:relative; }
.reference-header-art { width:100%; line-height:0; background:#10151c; }
.reference-header-art img { display:block; width:100%; height:auto; max-height:560px; object-fit:fill; }
.reference-nav { min-height:48px; display:flex; align-items:center; justify-content:center; gap:4px; background:#151a21; border-top:1px solid #ffffff1c; }
.reference-nav a { padding:9px 17px; border-radius:8px; color:#e9ecec; font-size:11px; transition:.2s; }
.reference-nav a:hover,.reference-nav a.is-current { color:#fff; background:var(--red); }
.reference-footer { width:100%; line-height:0; background:#0f151c; border-top:3px solid var(--red); }
.reference-footer img { display:block; width:100%; height:auto; max-height:650px; object-fit:fill; }
@media (max-width:760px) {
  .reference-header-art img { min-height:205px; object-fit:cover; object-position:center top; }
  .reference-nav { overflow-x:auto; justify-content:flex-start; padding:0 12px; }
  .reference-nav a { white-space:nowrap; padding:8px 12px; font-size:10px; }
  .reference-footer img { min-height:370px; object-fit:cover; object-position:center top; }
}

/* TGR storefront navigation and merchandising sections */
.nav-menu { position:relative; }
.nav-menu summary { cursor:pointer; list-style:none; }
.nav-menu summary::-webkit-details-marker { display:none; }
.nav-menu-panel { position:absolute; top:28px; right:-15px; min-width:190px; padding:8px; border:1px solid var(--line); border-radius:12px; background:#fff; box-shadow:0 18px 35px #4a26231a; z-index:8; }
.nav-menu-panel a { display:block; padding:9px 10px; border-radius:7px; font-size:11px; }
.nav-menu-panel a:hover { background:var(--cream); }
.service-cards { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; position:relative; margin-top:-28px; z-index:2; }
.service-card { display:flex; align-items:center; gap:11px; min-height:72px; padding:12px 14px; border:1px solid var(--line); border-radius:13px; background:#fff; box-shadow:0 12px 25px #4a26230d; }
.service-icon { width:35px; height:35px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; background:#fff0ec; color:var(--red); font-size:19px; }
.service-card strong,.service-card small { display:block; }.service-card strong { font-size:11px; }.service-card small { color:var(--muted); font-size:9px; margin-top:4px; }
.brand-section { background:#fff8f1; padding:55px 0; }.brand-chips { display:flex; gap:10px; flex-wrap:wrap; }
.brand-chips button { min-width:105px; padding:12px 18px; border:1px solid #ead9cb; border-radius:10px; background:#fff; color:#545b5c; cursor:pointer; }
.brand-chips button:hover { color:var(--red); border-color:var(--red); box-shadow:0 7px 15px #7e24150d; }
@media (max-width:760px) { .service-cards { grid-template-columns:1fr 1fr; margin-top:0; padding-top:15px; }.service-card { min-height:62px; padding:10px; }.service-card strong { font-size:10px; }.service-card small { font-size:8px; } }

/* Homepage banner carousel */
.hero-slider { position:relative; min-height:410px; overflow:hidden; border-bottom:0; background:#171717; }
body[data-home="true"] .hero-slider { min-height:410px; }
.hero-slides { position:relative; min-height:410px; }
.hero-slide { position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .65s ease, visibility .65s ease; background-image:linear-gradient(90deg,rgba(12,14,15,.88) 0%,rgba(12,14,15,.52) 43%,rgba(12,14,15,.13) 100%),var(--slide-image); background-position:center; background-size:cover; }
.hero-slide.is-active { opacity:1; visibility:visible; }
.hero-slide-inner { min-height:410px; display:flex; align-items:center; }
.hero-slide-copy { max-width:540px; color:#fff; padding:35px 0; }
.hero-slide-copy .eyebrow { color:#ffb0a5; }
.hero-slide-copy h1 { margin:14px 0 13px; font-size:clamp(34px,5vw,62px); line-height:1.2; letter-spacing:-1.5px; }
.hero-slide-copy h1 em { color:#ff796c; }
.hero-slide-copy p { max-width:465px; color:#e7e8e8; line-height:2; font-size:14px; margin-bottom:23px; }
.hero-slide-cta { display:inline-flex; align-items:center; gap:12px; padding:11px 17px; color:#fff; background:var(--red); border-radius:9px; font-size:12px; box-shadow:0 10px 20px #0004; }
.hero-slide-cta span { font-size:18px; line-height:0; }
.hero-slider-control { position:absolute; top:50%; z-index:2; width:38px; height:38px; border:1px solid #ffffff55; border-radius:50%; color:#fff; background:#1118; cursor:pointer; transform:translateY(-50%); font-size:27px; line-height:1; }
.hero-slider-control:hover { background:var(--red); border-color:var(--red); }
.hero-slider-control.prev { right:22px; }.hero-slider-control.next { left:22px; }
.hero-slider-dots { position:absolute; right:50%; bottom:18px; z-index:2; display:flex; gap:7px; transform:translateX(50%); }
.hero-slider-dots button { width:8px; height:8px; border:0; border-radius:50%; padding:0; background:#fff8; cursor:pointer; transition:.2s; }
.hero-slider-dots button.is-active { width:24px; border-radius:10px; background:#fff; }
body[data-home="true"] > .utility-bar { display:none; }
body[data-home="true"] .hero:not(.hero-slider) { background:#fff; border-bottom:0; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .eyebrow,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > h1,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > p,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .search-box,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .filter-panel,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .quick-links,
body[data-home="true"] .hero:not(.hero-slider) .hero-visual { display:none; }
body[data-home="true"] .hero:not(.hero-slider) .hero-grid { display:block; min-height:0; padding:0 0 30px; }
body[data-home="true"] .hero:not(.hero-slider) .home-products { margin-top:0; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .search-box,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .filter-panel,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .quick-links { display:flex; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .search-box { max-width:none; margin-top:0; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .filter-panel { max-width:none; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy { display:flex; flex-direction:column; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .search-box { order:1; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .filter-panel { order:2; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .quick-links { order:3; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .home-products { order:4; }
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .filter-panel,
body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .quick-links { display:none !important; }
.home-products-carousel { position:relative; }
.home-products-carousel .home-product-track { margin:0 34px; scroll-behavior:smooth; }
.home-products-arrow { position:absolute; top:50%; z-index:2; width:30px; height:30px; display:grid; place-items:center; border:1px solid #ffffff66; border-radius:50%; color:#fff; background:#9f1724; cursor:pointer; transform:translateY(-50%); font-size:22px; line-height:1; }
.home-products-arrow:hover { background:#7e101b; }
.home-products-arrow.prev { right:0; }.home-products-arrow.next { left:0; }
.hero:not(.hero-slider) { background:#fff; }
.hero:not(.hero-slider) .hero-copy > .filter-panel { padding:13px; border:1px solid #eadbd0; border-radius:14px; background:#fffaf6; box-shadow:0 9px 22px #4a26230d; }
.hero:not(.hero-slider) .hero-copy > .filter-panel select,
.hero:not(.hero-slider) .hero-copy > .filter-panel button { min-height:38px; }
.hero:not(.hero-slider) .hero-copy > .quick-links { margin:12px 0 2px; }
@media (max-width:760px) {
  .home-products-carousel .home-product-track { margin:0 28px; }
  .home-products-arrow { width:27px; height:27px; }
  body[data-home="true"] .hero:not(.hero-slider) .hero-copy > .filter-panel { display:grid; grid-template-columns:1fr 1fr; }
}
@media (max-width:760px) {
  .hero-slider,.hero-slides,.hero-slide-inner,body[data-home="true"] .hero-slider { min-height:390px; }
  .hero-slide { background-position:62% center; }
  .hero-slide-copy { padding:25px 0 45px; }
  .hero-slide-copy h1 { font-size:39px; }
  .hero-slide-copy p { font-size:12px; max-width:330px; }
  .hero-slider-control { width:32px; height:32px; font-size:22px; }
  .hero-slider-control.prev { right:12px; }.hero-slider-control.next { left:12px; }
}

/* final compact sizing overrides */
.hero-slider,.hero-slides,.hero-slide-inner,body[data-home="true"] .hero-slider { min-height:300px; }
@media (max-width:760px) {
  .hero-slider,.hero-slides,.hero-slide-inner,body[data-home="true"] .hero-slider { min-height:250px; }
}

/* Exact supplied image: full-width, never cropped. */
.interactive-header .header-service-bar { display:none; }
.interactive-header .header-brand-visual {
  height:23.525vw;
  min-height:0;
  overflow:hidden;
  background:#fff url('./assets/heder-final.png') center / 100% 100% no-repeat;
  border:0;
}

/* Final reference menu: only the five requested links, with no search/actions row. */
.interactive-header .header-main-row { display:none !important; }
.interactive-header .header-nav,
.interactive-header .header-nav-inner {
  min-height:82px;
  height:82px;
}
.interactive-header .header-nav-inner {
  display:flex;
  align-items:stretch;
  justify-content:center;
  gap:0;
  padding:0;
  overflow:hidden;
}
.interactive-header .header-nav-inner a {
  flex:0 1 180px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 22px;
  color:#f5f5f5;
  font-size:18px;
  font-weight:700;
  white-space:nowrap;
  border-left:1px solid #ffffff2b;
}
.interactive-header .header-nav-inner a:first-child { border-left:0; }
.interactive-header .header-nav-inner a:hover,
.interactive-header .header-nav-inner a.is-current {
  color:#ed1c24;
  background:transparent;
}
.interactive-header .header-nav-inner a.is-current {
  position:relative;
}
.interactive-header .header-nav-inner a.is-current::after {
  content:'';
  position:absolute;
  right:18%;
  bottom:5px;
  left:18%;
  height:4px;
  background:#ed1c24;
  border-radius:0;
}
@media (max-width:900px) {
  .interactive-header .header-brand-visual { height:23.525vw; }
  .interactive-header .header-nav,
  .interactive-header .header-nav-inner { min-height:60px; height:60px; }
  .interactive-header .header-nav-inner { overflow-x:auto; justify-content:flex-start; }
  .interactive-header .header-nav-inner a { flex:0 0 auto; padding:0 16px; font-size:13px; }
}
.interactive-header .header-brand-visual img {
  display:none;
}

/* ── Black Nav Bar with integrated search & actions ── */
.interactive-header .header-nav {
  min-height:44px;
  height:44px;
  background:#11161d;
  border:0;
  border-bottom:3px solid var(--red);
}
.interactive-header .header-nav-inner {
  min-height:44px;
  height:44px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:0;
  overflow:hidden;
}
.interactive-header .header-nav-inner a {
  flex:0 0 auto;
  height:44px;
  padding:0 16px;
  display:flex;
  align-items:center;
  color:#f5f5f5;
  font-size:13px;
  font-weight:500;
  white-space:nowrap;
  border-left:1px solid #ffffff18;
}
.interactive-header .header-nav-inner a:first-child { border-left:0; }
.interactive-header .header-nav-inner a:hover,
.interactive-header .header-nav-inner a.is-current { color:#fff; background:var(--red); }
.interactive-header .header-nav-inner a.is-current::after { display:none; }

/* Search inside nav */
.interactive-header .header-search {
  display:flex;
  align-items:center;
  height:30px;
  margin-right:auto;
  margin-left:10px;
  background:#1a2129;
  border:1px solid #2a3039;
  border-radius:4px;
  overflow:hidden;
  flex-shrink:0;
}
.interactive-header .header-search input {
  width:160px;
  height:100%;
  padding:0 10px;
  border:0;
  background:transparent;
  color:#e8ecef;
  font-size:11px;
  outline:none;
}
.interactive-header .header-search input::placeholder { color:#5a6a7a; }
.interactive-header .header-search button {
  height:100%;
  padding:0 12px;
  border:0;
  background:var(--red);
  color:#fff;
  cursor:pointer;
  font-size:14px;
  display:flex;
  align-items:center;
}
.interactive-header .interactive-search .search-category { display:none; }

/* Actions inside nav */
.interactive-header .header-actions {
  display:flex;
  align-items:center;
  gap:6px;
  flex-shrink:0;
}
.interactive-header .header-actions a {
  height:30px;
  padding:0 10px;
  display:flex;
  align-items:center;
  gap:5px;
  font-size:11px;
  border-radius:4px;
  color:#e8ecef;
  background:#1a2129;
  white-space:nowrap;
}
.interactive-header .action-cart { background:var(--red) !important; }
.interactive-header .action-cart b { font-weight:400; }
.interactive-header .action-cart i {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:18px;
  height:18px;
  border-radius:9px;
  background:#fff;
  color:var(--red);
  font-size:9px;
  font-weight:700;
  font-style:normal;
}

@media (max-width:900px) {
  .interactive-header .header-nav,
  .interactive-header .header-nav-inner {
    min-height:40px;
    height:40px;
  }
  .interactive-header .header-nav-inner {
    justify-content:flex-start;
    overflow-x:auto;
  }
  .interactive-header .header-nav-inner a {
    height:40px;
    padding:0 12px;
    font-size:11px;
  }
  .interactive-header .header-search { height:26px; }
  .interactive-header .header-search input { width:110px; font-size:10px; }
  .interactive-header .header-actions a { height:26px; padding:0 8px; font-size:10px; }
}

/* ══════════════════════════════════════════
   TGR Footer
   ══════════════════════════════════════════ */
.tgr-footer {
  margin-top:50px;
  color:#c8d0d4;
  background:#111820;
  border-top:3px solid var(--red);
}
.tgr-footer-brand img {
  width:100px;
  height:auto;
  display:block;
  margin:16px auto 0;
  filter:drop-shadow(0 3px 6px #0006);
}
.tgr-footer-contact {
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:18px;
  padding:20px 0 0;
}
.tgr-footer-contact > div {
  display:flex;
  flex-direction:column;
  gap:4px;
}
.tgr-contact-icon {
  font-size:18px;
  color:var(--red);
  margin-bottom:2px;
}
.tgr-footer-contact strong {
  color:#fff;
  font-size:13px;
  font-weight:600;
}
.tgr-footer-contact b {
  color:#e8ecef;
  font-size:14px;
  font-weight:500;
  direction:ltr;
  display:inline-block;
}
.tgr-footer-contact span {
  color:#aeb8bf;
  font-size:12px;
}
.tgr-footer-contact small {
  color:#7a858c;
  font-size:10px;
}
.tgr-footer-bottom {
  padding:14px 20px;
  text-align:center;
  color:#7a858c;
  font-size:10px;
  border-top:1px solid #ffffff12;
}
@media (max-width:760px) {
  .tgr-footer-contact { grid-template-columns:1fr 1fr; gap:14px; }
}
@media (max-width:470px) {
  .tgr-footer-contact { grid-template-columns:1fr; }
}
.auth-modal{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;background:#141b2388;padding:20px}.auth-modal[hidden]{display:none!important}.auth-card{width:min(100%,460px);max-height:90vh;overflow:auto;background:#fff;border-radius:18px;padding:26px;position:relative;box-shadow:0 20px 60px #0003}.auth-close{position:absolute;top:10px;left:14px;border:0;background:none;font-size:26px;color:var(--muted);cursor:pointer}.auth-card h2{margin:0 0 20px}.auth-card label{display:grid;gap:7px;font-size:12px;color:var(--muted);margin-bottom:14px}.auth-card input,.auth-card select{border:1px solid var(--line);border-radius:9px;padding:11px}.auth-message{color:var(--red);font-size:12px;min-height:20px}.auth-logout{border:0;background:none;color:var(--red);cursor:pointer}.website-account-area{padding:30px 0}.account-grid{display:grid;grid-template-columns:1fr 1.4fr;gap:18px}.account-card{background:#fff;border:1px solid var(--line);border-radius:16px;padding:20px}.account-card h2{margin-top:0}.order-list{display:grid;gap:8px}.order-list button{text-align:right;border:1px solid var(--line);background:#fff;border-radius:9px;padding:12px;cursor:pointer}.order-list span{display:block;color:var(--muted);font-size:11px;margin-top:5px}.order-detail-items{display:grid;gap:8px;margin:16px 0}.order-detail-items div{padding:10px;background:#fff8f1;border-radius:8px}.order-detail-items span{display:block;color:var(--muted);font-size:11px;margin-top:4px}@media(max-width:760px){.account-grid{grid-template-columns:1fr}.website-account-area{padding:20px 16px}}
.cart-lines{display:grid;gap:9px}.cart-line{display:grid;grid-template-columns:1fr auto auto auto;gap:10px;align-items:center;padding:10px;border:1px solid var(--line);border-radius:9px}.cart-line small{display:block;color:var(--muted);font-size:10px;margin-top:4px}.cart-line button{border:1px solid var(--line);background:#fff;border-radius:6px;padding:4px 8px;cursor:pointer}.cart-qty{display:flex;align-items:center;gap:7px}.cart-total{font-weight:700;margin:16px 0}.checkout-items{padding:10px;background:#fff8f1;border-radius:9px;margin-bottom:15px}.checkout-items p{margin:4px 0;font-size:12px}
@media(max-width:600px){.cart-line{grid-template-columns:1fr auto;}.cart-line>strong{grid-column:1}.cart-line>[data-cart-remove]{grid-column:2;grid-row:2}.cart-qty{grid-column:2;grid-row:1}}
.detail-image{width:100%;border:0;padding:0;cursor:zoom-in}
.detail-gallery{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.gallery-thumb{width:58px;height:58px;padding:2px;border:1px solid var(--line);border-radius:8px;background:#fff;cursor:pointer;overflow:hidden}
.gallery-thumb.is-active{border-color:var(--red);box-shadow:0 0 0 2px #d6283220}
.gallery-thumb img{width:100%;height:100%;object-fit:cover}
.image-lightbox{position:fixed;z-index:2000;inset:0;display:grid;place-items:center;padding:35px;background:#111b;cursor:zoom-out}
.image-lightbox img{max-width:min(92vw,1000px);max-height:88vh;object-fit:contain;border-radius:12px;box-shadow:0 20px 70px #0008}
.image-lightbox-close{position:absolute;top:18px;right:24px;width:42px;height:42px;border:0;border-radius:50%;background:#fff;color:#222;font-size:28px;cursor:pointer}
.image-footer{padding:0;background:#11161d}.footer-image-wrap{width:100%;overflow:hidden;line-height:0}.footer-image{display:block;width:100%;height:auto}.image-footer .tgr-footer-bottom{padding:12px 20px}
.home-product-track{max-height:360px;overflow-x:auto;overflow-y:auto;align-content:flex-start;flex-wrap:wrap}.home-product-card{flex:0 0 186px}

/* Existing site information presented without changing the storefront layout. */
.site-information{box-sizing:border-box;width:min(92vw,540px);max-height:85dvh;border:1px solid #e2e5ea;border-radius:18px;padding:24px;color:#263343;background:white;box-shadow:0 20px 80px #0003;font-family:inherit;text-align:right}
.site-information::backdrop{background:#14202d99}.site-information header{display:flex;justify-content:space-between;align-items:center;gap:20px;border-bottom:1px solid #eee;padding-bottom:14px}
.site-information h2{font-size:21px;margin:0}.site-information header button{border:0;background:#f3f4f6;color:#374151;border-radius:8px;width:38px;height:38px;font-size:26px;cursor:pointer}
.site-information h3{font-size:14px;color:#a8202e;margin:16px 0 4px}.site-information p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:2;margin:12px 0}.site-information button:focus-visible{outline:2px solid #b52030;outline-offset:2px}
#site-information-body{padding-top:12px;line-height:2}
@media(max-width:600px){.site-information{padding:18px;width:calc(100vw - 24px);max-height:88dvh}.site-information h2{font-size:19px}}
/* =========================================================
   TGR HOME PRODUCTS - FINAL LAYOUT
   Desktop:
   - 40 products loaded
   - 5 columns
   - 4 visible rows
   - remaining products accessible by vertical scroll

   Catalog:
   - normal page layout
   - no internal product scroll
   ========================================================= */


/* ---------- HOME PRODUCT AREA ---------- */

body[data-home="true"] .home-products {
  width: 100%;
  max-width: 1180px;
  margin-left: auto;
  margin-right: auto;
}


/* Outer carousel wrapper */

body[data-home="true"] .home-products-carousel {
  position: relative;
}


/* Product container */

body[data-home="true"] .home-product-track {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));

  gap: 12px;

  margin: 0;
  padding: 12px;

  /*
   * 4 visible rows:
   * card height is controlled below.
   */
  max-height: 1050px;

  overflow-x: hidden;
  overflow-y: auto;

  align-content: start;

  border-radius: 17px;

  background:
    linear-gradient(
      105deg,
      #e9363d,
      #f64955
    );

  scrollbar-width: thin;
  scroll-behavior: smooth;
}


/* Product cards */

body[data-home="true"] .home-product-card {
  box-sizing: border-box;

  width: 100%;
  min-width: 0;
  max-width: none;

  height: 245px;

  padding: 10px;

  border: 0;
  border-radius: 12px;

  background: #fff;

  text-align: right;

  color: var(--ink);

  cursor: pointer;

  box-shadow:
    0 8px 18px #5e0c171f;

  overflow: hidden;
}


/* Product image */

body[data-home="true"] .home-product-image {
  width: 100%;
  height: 115px;

  display: grid;
  place-items: center;

  overflow: hidden;

  border-radius: 9px;

  background:
    linear-gradient(
      145deg,
      #f7f2ee,
      #fff
    );
}


body[data-home="true"] .home-product-image img {
  width: 100%;
  height: 100%;

  object-fit: contain;
}


/* Product title */

body[data-home="true"] .home-product-card h3 {
  height: 37px;

  overflow: hidden;

  margin: 5px 0 8px;

  font-size: 11px;
  font-weight: 600;

  line-height: 1.7;
}


/* Old horizontal navigation arrows are not needed anymore */

body[data-home="true"] .home-products-arrow {
  display: none !important;
}


/* ---------- CATALOG PAGE ---------- */

/*
 * Catalog remains a normal page.
 * No internal scrolling.
 */

body[data-catalog-page="true"] #product-grid {
  max-height: none;

  overflow: visible;

  align-content: initial;
}


/* =========================================================
   RESPONSIVE
   ========================================================= */


/* Tablet */

@media (max-width: 1000px) {

  body[data-home="true"] .home-product-track {
    grid-template-columns:
      repeat(4, minmax(0, 1fr));
  }

}


/* Small tablet */

@media (max-width: 760px) {

  body[data-home="true"] .home-product-track {
    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    max-height: 1020px;
  }

  body[data-home="true"] .home-product-card {
    height: 240px;
  }

}


/* Mobile */

@media (max-width: 470px) {

  body[data-home="true"] .home-product-track {
    grid-template-columns: 1fr;

    max-height: 1010px;
  }

}
/* =========================================================
   TGR PRODUCT DETAIL MODAL
   ========================================================= */

body.product-modal-open {
  overflow: hidden;
}


/* Modal root */

.product-detail-modal {
  position: fixed;

  inset: 0;

  z-index: 1500;

  display: flex;

  align-items: center;
  justify-content: center;

  padding: 28px;
}


/* IMPORTANT:
   hidden must override display:flex
*/

.product-detail-modal[hidden] {
  display: none !important;
}


/* Dark background */

.product-detail-overlay {
  position: absolute;

  inset: 0;

  background: rgba(15, 18, 22, 0.72);

  backdrop-filter: blur(4px);
}


/* Main dialog */

.product-detail-dialog {
  position: relative;

  z-index: 1;

  width: min(1120px, 96vw);

  max-height: 92vh;

  overflow-y: auto;

  background: #fff;

  border-radius: 22px;

  box-shadow:
    0 30px 90px rgba(0, 0, 0, 0.35);
}


/* Close X */

.product-detail-close {
  position: absolute;

  top: 14px;
  left: 14px;

  z-index: 20;

  width: 42px;
  height: 42px;

  display: grid;
  place-items: center;

  border: 0;

  border-radius: 50%;

  background: #f3f4f5;

  color: #202428;

  font-size: 28px;
  line-height: 1;

  cursor: pointer;

  transition: 0.2s;
}


.product-detail-close:hover {
  color: #fff;

  background: var(--red);

  transform: rotate(90deg);
}


/* Content */

.product-detail-content {
  padding: 34px;
}


.product-modal-layout {
  display: grid;

  grid-template-columns:
    minmax(390px, 0.95fr)
    minmax(0, 1.05fr);

  gap: 42px;

  align-items: start;
}


/* =========================================================
   IMAGE AREA
   ========================================================= */

.product-modal-media {
  min-width: 0;
}


.product-modal-main-wrap {
  position: relative;

  width: 100%;
}


.product-modal-main-image {
  width: 100%;

  height: 470px;

  display: grid;
  place-items: center;

  overflow: hidden;

  padding: 20px;

  border: 1px solid #ece7e3;

  border-radius: 18px;

  background:
    linear-gradient(
      145deg,
      #faf8f6,
      #ffffff
    );

  cursor: zoom-in;
}


.product-modal-main-image img {
  display: block;

  width: 100%;
  height: 100%;

  object-fit: contain;
}


.product-modal-no-image {
  color: var(--red);

  font-size: 100px;
}


/* Previous / next */

.product-gallery-nav {
  position: absolute;

  top: 50%;

  z-index: 5;

  width: 42px;
  height: 42px;

  display: grid;
  place-items: center;

  transform: translateY(-50%);

  border: 1px solid #ddd;

  border-radius: 50%;

  background: rgba(255, 255, 255, 0.94);

  color: #333;

  font-size: 27px;

  cursor: pointer;

  box-shadow:
    0 5px 18px rgba(0, 0, 0, 0.12);
}


.product-gallery-nav:hover {
  color: #fff;

  border-color: var(--red);

  background: var(--red);
}


.product-gallery-prev {
  right: 12px;
}


.product-gallery-next {
  left: 12px;
}


/* Thumbnails */

.product-modal-thumbnails {
  display: flex;

  gap: 10px;

  margin-top: 13px;

  padding: 4px 2px 7px;

  overflow-x: auto;
}


.product-modal-thumb {
  flex: 0 0 76px;

  width: 76px;
  height: 76px;

  padding: 4px;

  overflow: hidden;

  border: 2px solid transparent;

  border-radius: 11px;

  background: #f7f7f7;

  cursor: pointer;

  transition: 0.18s;
}


.product-modal-thumb img {
  width: 100%;
  height: 100%;

  object-fit: contain;
}


.product-modal-thumb:hover {
  border-color: #d9a1a5;
}


.product-modal-thumb.is-active {
  border-color: var(--red);

  background: #fff;
}


/* =========================================================
   PRODUCT INFORMATION
   ========================================================= */

.product-modal-info {
  min-width: 0;

  padding-top: 25px;
}


.product-modal-category {
  display: inline-block;

  margin-bottom: 10px;

  color: var(--red);

  font-size: 12px;

  font-weight: 700;
}


.product-modal-info h2 {
  margin: 0 0 13px;

  color: var(--ink);

  font-size: 30px;

  line-height: 1.55;
}


.product-modal-sku {
  display: inline-flex;

  gap: 6px;

  align-items: center;

  padding: 7px 11px;

  border-radius: 8px;

  color: #666;

  background: #f5f5f5;

  font-size: 12px;
}


.product-modal-sku strong {
  color: #222;

  direction: ltr;
}


.product-modal-description {
  margin: 23px 0;

  color: #60686b;

  font-size: 13px;

  line-height: 2.1;
}


/* Specifications */

.product-modal-specs {
  display: grid;

  grid-template-columns: 1fr 1fr;

  gap: 11px;
}


.product-modal-spec {
  min-height: 72px;

  padding: 12px 14px;

  border: 1px solid #f0e7df;

  border-radius: 11px;

  background: #fffaf6;
}


.product-modal-spec span {
  display: block;

  margin-bottom: 6px;

  color: #8a8f91;

  font-size: 10px;
}


.product-modal-spec strong {
  display: block;

  color: #303536;

  font-size: 12px;

  line-height: 1.8;
}


/* Actions */

.product-modal-actions {
  display: flex;

  align-items: center;

  gap: 10px;

  margin-top: 25px;
}


.product-modal-add-cart {
  min-width: 190px;

  margin-top: 0;
}


.product-modal-secondary-close {
  min-height: 42px;

  padding: 10px 20px;

  border: 1px solid #ddd;

  border-radius: 10px;

  color: #555;

  background: #fff;

  cursor: pointer;
}


.product-modal-secondary-close:hover {
  border-color: #bbb;

  background: #f7f7f7;
}


/* Loading / error */

.product-modal-loading,
.product-modal-error {
  min-height: 300px;

  display: flex;

  align-items: center;
  justify-content: center;

  flex-direction: column;

  gap: 20px;

  color: #777;

  text-align: center;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 900px) {

  .product-detail-modal {
    padding: 18px;
  }


  .product-detail-content {
    padding: 26px;
  }


  .product-modal-layout {
    grid-template-columns: 1fr;

    gap: 20px;
  }


  .product-modal-main-image {
    height: 380px;
  }


  .product-modal-info {
    padding-top: 0;
  }

}


/* =========================================================
   MOBILE
   ========================================================= */

@media (max-width: 600px) {

  .product-detail-modal {
    padding: 8px;
  }


  .product-detail-dialog {
    width: 100%;

    max-height: 96vh;

    border-radius: 15px;
  }


  .product-detail-content {
    padding: 18px;
    padding-top: 55px;
  }


  .product-detail-close {
    top: 10px;
    left: 10px;

    width: 38px;
    height: 38px;
  }


  .product-modal-main-image {
    height: 285px;

    padding: 10px;
  }


  .product-modal-info h2 {
    font-size: 22px;
  }


  .product-modal-specs {
    grid-template-columns: 1fr;
  }


  .product-modal-actions {
    flex-direction: column;

    align-items: stretch;
  }


  .product-modal-add-cart,
  .product-modal-secondary-close {
    width: 100%;
  }


  .product-modal-thumb {
    flex-basis: 64px;

    width: 64px;
    height: 64px;
  }


  .product-gallery-nav {
    width: 36px;
    height: 36px;
  }

}
/* Keep the existing footer artwork; replace only its baked-in contact strip. */
.footer-brand-art{aspect-ratio:1717/293}.footer-contact-strip{display:grid;grid-template-columns:1fr 1.5fr 1.2fr 1fr;direction:ltr;align-items:center;padding:12px 4%;gap:18px;color:#f1f3f5;background:#11161b;border-top:1px solid #ffffff12}.footer-contact-item{display:flex;direction:rtl;align-items:center;justify-content:center;gap:12px;font-size:14px;line-height:1.8;overflow-wrap:anywhere;white-space:pre-wrap}.footer-contact-item+ .footer-contact-item{border-left:1px solid #ffffff35;padding-left:12px}.footer-contact-icon{font-size:24px;flex:none}.footer-social-art{background:url('./assets/footer.png') right bottom/400% auto no-repeat;aspect-ratio:4.25;min-width:0}.footer-contact-item:has([data-footer-setting]:empty){display:none}@media(max-width:700px){.footer-contact-strip{grid-template-columns:1fr 1fr;padding:14px;gap:14px}.footer-contact-item{font-size:13px;justify-content:flex-start}.footer-contact-item+ .footer-contact-item{border:0;padding:0}.footer-social-art{width:100%;max-width:260px;justify-self:center}}@media(max-width:420px){.footer-contact-strip{grid-template-columns:1fr}.footer-social-art{width:220px}}
