/* Audi-inspired product hierarchy, with native Stubero product data and ordering. */
html body#product #primary_block.spa-product { display:block!important; width:100%; padding:0; margin:0; }
html body#product .spa-product *, .spa-editorial-galleries *, .spa-footer-action *, .spa-lightbox * { box-sizing:border-box; }
html body#product .spa-product #pb-right-column { float:none!important; width:100%!important; margin:0 0 42px; }
html body#product .spa-product #pb-left-column { display:flex; flex-direction:column; float:none!important; width:100%!important; max-width:1120px; margin:0 auto; }
html body#product .spa-product #pb-left-column > * { order:5; }
html body#product .spa-product #pb-left-column > h1 { order:0; max-width:1040px; margin:0 0 20px; font:400 clamp(28px,3.1vw,46px)/1.18 var(--stubero-sans, sans-serif); letter-spacing:-.025em; text-wrap:balance; }
html body#product .spa-product #pb-left-column > #buy_block { order:1; margin:0 0 28px; }
html body#product .spa-product #pb-left-column > .spa-copy { order:2; }
html body#product .spa-product #our_price_display .ttc_price { order:-1; font-size:30px; font-weight:600; }
html body#product .spa-product #our_price_display .ht_price { font-size:13px; }
html body#product .spa-product #product_manufacturer:has(.editable:empty) { display:none; }
html body#product .spa-stage#image-block { position:relative; border:0; background:#f2f3f4; overflow:hidden; }
.spa-hero-link { position:relative; display:block; color:#202124; }
html body#product .spa-product .spa-stage #bigpic { display:block; width:100%!important; height:auto!important; max-height:700px; aspect-ratio:16/9; object-fit:contain; background:#f2f3f4; }
html body#product .spa-product:not(.spa-vehicle) .spa-stage #bigpic { max-height:540px; }
html body#product .spa-product .spa-stage #bigpic[hidden] { display:none; }
.spa-enlarge { position:absolute; right:24px; bottom:22px; padding:12px 18px; background:#fff; border:1px solid #d5d7d8; border-radius:4px; font-size:12px; line-height:1.5; }
.spa-status { position:absolute; left:24px; top:22px; padding:8px 16px; color:#fff; background:#202124; font-size:13px; }
.spa-gallery-tools { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px 20px; padding:18px 0; border-bottom:1px solid #dedfe0; }
.spa-scenes { display:flex; flex-wrap:wrap; gap:8px 24px; }
.spa-gallery button, .spa-lightbox button, .spa-share { font-family:var(--stubero-sans, sans-serif); cursor:pointer; }
.spa-scenes button { min-height:44px; padding:10px 0; background:transparent; border:0; border-bottom:2px solid transparent; color:#66696c; font-size:13px; }
.spa-scenes button[aria-pressed=true] { color:#17191b; border-bottom-color:#f4ad43; }
.spa-navigation { display:flex; align-items:center; gap:16px; color:#66696c; font-size:12px; }
.spa-navigation button { min-width:44px; min-height:44px; border:1px solid #d5d7d8; border-radius:4px; background:#fff; color:#202124; font-size:20px; }
.spa-navigation button:disabled { opacity:.35; cursor:default; }
.spa-thumbnails { display:flex; gap:12px; overflow-x:auto; padding:18px 2px 12px; scrollbar-width:thin; scroll-behavior:auto; }
.spa-thumbnails a { display:block; flex:0 0 112px; border:2px solid transparent; border-radius:2px; background:#f2f3f4; }
.spa-thumbnails a[hidden] { display:none; }
.spa-thumbnails a[aria-current=true] { border-color:#202124; }
.spa-thumbnails img { display:block; width:108px; height:81px; object-fit:contain; }
.spa-gallery [hidden] { display:none!important; }
.spa-intro { max-width:830px; margin:0 0 20px; color:#5f6265; font-size:16px; line-height:1.8; }
.spa-highlights { display:flex; flex-wrap:wrap; gap:12px 28px; margin:0 0 26px; padding:0; list-style:none; }
.spa-highlights li { font-size:13px; line-height:1.7; color:#3f4245; padding:0 0 0 14px; border-left:2px solid #d8dadc; }
.spa-actions { display:flex; align-items:center; flex-wrap:wrap; gap:12px; margin:24px 0 32px; }
.spa-button { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:13px 22px; border:1px solid #6b6e70; border-radius:4px; color:#202124!important; background:#fff; font:600 13px/1.6 var(--stubero-sans, sans-serif); text-decoration:none!important; text-align:center; }
.spa-button-primary { color:#fff!important; background:#202124; border-color:#202124; }
.spa-button:hover { background:#f0f1f2; }
.spa-button-primary:hover { background:#414447; }
.spa-share { padding:12px 4px; margin-left:12px; min-height:48px; border:0; border-bottom:1px solid #c3c6c8; background:transparent; color:#4b4e50; font-size:12px; }
.spa-share-status { color:#5f6265; font-size:12px; }
.spa-facts { border-top:1px solid #dedfe0; padding:28px 0 12px; margin:0 0 24px; }
.spa-facts h2, .spa-section-heading h2 { font:400 28px/1.3 var(--stubero-sans, sans-serif); color:#202124; letter-spacing:-.02em; margin:0; }
.spa-facts dl { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:26px 42px; margin:24px 0 0; }
.spa-facts dl > div { min-width:0; }
.spa-facts dt { margin:0 0 7px; color:#74777a; font-size:12px; font-weight:400; }
.spa-facts dd { margin:0; color:#202124; font-size:16px; line-height:1.6; font-weight:500; overflow-wrap:anywhere; }
.spa-illustration { max-width:850px; padding:12px 16px; border-left:2px solid #f4ad43; background:#f3f4f5; font-size:12px; line-height:1.8; }
.spa-illustration p { margin:0; }
.spa-illustration details { margin-top:8px; }
.spa-illustration summary { cursor:pointer; }
.spa-availability { color:#696c6e; font-size:13px; margin:0 0 22px; }
.spa-no-photo { display:flex; align-items:center; justify-content:center; min-height:260px; background:#f2f3f4; color:#686b6d; font-size:15px; padding:30px; }
.spa-image-error { color:#676a6c; padding:16px; background:#f2f3f4; font-size:13px; }
.spa-editorial-galleries { margin:60px 0 0; }
.spa-editorial-gallery { margin:0 0 48px; }
.spa-section-heading { display:flex; align-items:baseline; justify-content:space-between; gap:18px; margin:0 0 22px; }
.spa-section-heading > span { font-size:12px; color:#74777a; }
.spa-photo-strip { display:flex; gap:20px; overflow:auto; padding:0 0 14px; scrollbar-width:thin; scroll-snap-type:x proximity; }
.spa-photo-strip a { display:block; flex:0 0 calc(50% - 10px); min-width:0; background:#f2f3f4; scroll-snap-align:start; }
.spa-photo-strip img { display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:contain; }
.spa-footer-action { display:flex; align-items:center; justify-content:space-between; gap:24px; margin:48px 0 0; padding:28px 0; border-top:1px solid #dedfe0; }
.spa-footer-action p { max-width:70%; font-size:18px; line-height:1.5; color:#202124; margin:0; }
html body#product.spa-ready #more_info_block { margin-top:24px; }
html body#product.spa-ready .spl-equipment { gap:32px; }
html body#product.spa-ready .spl-equipment > section { border:0; border-top:1px solid #dedfe0; border-radius:0; padding:24px 0; background:transparent; }
.spa-lightbox { position:fixed; inset:0; width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; padding:74px 32px 88px; border:0; background:#f4f5f6; color:#202124; }
.spa-lightbox::backdrop { background:rgba(0,0,0,.7); }
.spa-lightbox-image { display:block; width:100%; height:100%; object-fit:contain; }
.spa-lightbox-close { position:absolute; top:16px; right:24px; min-height:44px; padding:10px 20px; border:1px solid #c6c9cb; border-radius:4px; background:#fff; color:#202124; }
.spa-lightbox-controls { position:absolute; bottom:20px; left:24px; right:24px; display:flex; align-items:center; justify-content:center; gap:28px; font-size:13px; }
.spa-lightbox-controls button { min-height:44px; padding:10px 18px; border:1px solid #c6c9cb; border-radius:4px; background:#fff; color:#202124; font-size:12px; }
body.spa-zoom-open { overflow:hidden; }
.spa-gallery a:focus-visible, .spa-gallery button:focus-visible, .spa-button:focus-visible, .spa-share:focus-visible, .spa-photo-strip a:focus-visible, .spa-lightbox button:focus-visible { outline:2px solid #202124; outline-offset:4px; }
@media(max-width:760px) {
  html body#product .spa-product #pb-right-column { margin-bottom:28px; }
  html body#product .spa-product #pb-left-column > h1 { font-size:28px; margin-bottom:16px; }
  html body#product .spa-product .spa-stage #bigpic { aspect-ratio:4/3; max-height:none; }
  .spa-enlarge { right:10px; bottom:10px; font-size:10px; padding:8px 12px; }
  .spa-gallery-tools { gap:4px; padding:10px 0; }
  .spa-scenes { gap:8px 18px; }
  .spa-scenes button { font-size:12px; }
  .spa-navigation { width:100%; justify-content:space-between; gap:10px; margin-top:6px; }
  .spa-thumbnails { gap:8px; padding-top:12px; }
  .spa-thumbnails a { flex-basis:88px; }
  .spa-thumbnails img { width:84px; height:63px; }
  .spa-intro { font-size:14px; }
  .spa-highlights { display:block; margin-bottom:20px; }
  .spa-highlights li { margin-bottom:10px; }
  .spa-actions { display:grid; grid-template-columns:minmax(0,1fr); gap:10px; margin:20px 0 28px; }
  .spa-share { justify-self:start; margin-left:0; }
  .spa-facts dl { grid-template-columns:repeat(2,minmax(0,1fr)); gap:24px 22px; }
  .spa-facts dd { font-size:14px; }
  .spa-facts h2, .spa-section-heading h2 { font-size:25px; }
  .spa-editorial-galleries { margin-top:36px; }
  .spa-editorial-gallery { margin-bottom:32px; }
  .spa-photo-strip { gap:12px; }
  .spa-photo-strip a { flex-basis:86%; }
  .spa-footer-action { flex-direction:column; align-items:stretch; gap:18px; margin-top:32px; }
  .spa-footer-action p { max-width:100%; font-size:17px; }
  .spa-lightbox { padding:74px 8px 110px; }
  .spa-lightbox-controls { bottom:calc(20px + env(safe-area-inset-bottom,0px)); left:12px; right:12px; gap:12px; flex-wrap:wrap; }
  .spa-lightbox-controls span { order:3; width:100%; text-align:center; }
}
@media(prefers-reduced-motion:reduce) { .spa-gallery *, .spa-photo-strip { scroll-behavior:auto; animation:none; transition:none; } }