/* DEVALS complete-site visual system */
:root {
  --primary: #d33b31;
  --secondary: #d5a047;
  --dark: #17283a;
  --site-ink: #17283a;
  --site-muted: #657585;
  --site-line: #e2e8ee;
  --site-card-shadow: 0 12px 34px rgba(23, 40, 58, .07);
}

html { scroll-behavior: smooth; }
body {
  font-family: "Poppins", "Segoe UI", Arial, sans-serif;
  color: var(--site-ink);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, h4, h5, h6,
.stitle, .cart-title, .spd-copy h1, .spd-section-head h2,
.spd-related-head h2, .product-overview-head h2, .enquiry-title h2 {
  font-family: "Poppins", "Segoe UI", Arial, sans-serif;
  letter-spacing: -.025em;
}
p { color: var(--site-muted); line-height: 1.75; }
.slbl {
  color: var(--primary);
  font-family: "Poppins", "Segoe UI", Arial, sans-serif;
  font-size: .72rem;
  font-style: normal;
  font-weight: 700;
  letter-spacing: .14em;
  text-transform: uppercase;
}
img { height: auto; }
section { scroll-margin-top: 88px; }

/* Guard against narrow-screen overflow from long names and embedded media. */
body { min-width: 320px; overflow-x: clip; }
img, video, iframe { max-width: 100%; }
input, textarea, select, button { max-width: 100%; }
.container, .row, [class*="col-"] { min-width: 0; }
.spd-copy, .spd-info-card, .spd-related-card > div { min-width: 0; }
.spd-copy p, .spd-info-card p, .product-footer-contact a { overflow-wrap: anywhere; }

/* Keep product controls easy to use on touch screens and small phones. */
@media (max-width: 767.98px) {
  .spd-thumbs { gap: 10px; overflow-x: auto; padding: 2px 2px 8px; }
  .spd-thumb { flex: 0 0 74px; min-height: 48px; }
  .spd-actions { width: 100%; }
  .spd-actions .btn-red { min-height: 48px; }
  .product-footer-bottom a { overflow-wrap: anywhere; }
}

@media (max-width: 359.98px) {
  .container { --bs-gutter-x: 1rem; }
  .spd-view-badge { top: 18px; left: 18px; padding: 8px 10px; font-size: .68rem; }
  .spd-image-caption { bottom: 16px; font-size: .66rem; }
  .spd-related-card { grid-template-columns: 72px minmax(0, 1fr); }
  .spd-related-card img { width: 72px; height: 84px; }
}

/* Clear, consistent section headings */
.stitle {
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: -.04em;
}
.stitle span {
  transition: color .25s ease, text-shadow .25s ease, transform .25s ease;
}
.sline { border-radius: 10px; }

/* Shared links, controls and keyboard focus */
a, button, input, textarea, select { transition: color .22s ease, background-color .22s ease, border-color .22s ease, box-shadow .22s ease, transform .22s ease; }
a:focus-visible, button:focus-visible, input:focus-visible,
textarea:focus-visible, select:focus-visible {
  outline: 3px solid rgba(232, 40, 26, .38);
  outline-offset: 3px;
}
.btn-red, .nav-cta, .spd-actions .btn-red, .send-whatsapp, .send-email {
  border-radius: 12px;
  font-family: "Poppins", "Segoe UI", Arial, sans-serif;
  font-weight: 700;
  box-shadow: 0 8px 20px rgba(232, 40, 26, .16);
}
.btn-red:hover, .nav-cta:hover, .spd-actions .btn-red:hover,
.send-whatsapp:hover, .send-email:hover {
  transform: translateY(-3px);
  box-shadow: 0 13px 28px rgba(232, 40, 26, .24);
}

/* Product and content cards share the same crisp surface */
.catcard, .mcard, .chcard, .tescard, .blcard,
.spd-info-card, .spd-related-card, .related-product-card,
.product-fact-grid article, .cart-card, .enquiry-card {
  border-color: var(--site-line);
  box-shadow: var(--site-card-shadow);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.catcard:hover, .mcard:hover, .chcard:hover, .tescard:hover, .blcard:hover,
.spd-info-card:hover, .product-fact-grid article:hover {
  transform: translateY(-5px);
  border-color: rgba(232, 40, 26, .2);
  box-shadow: 0 18px 38px rgba(20, 36, 52, .12);
}
.catcard img, .mimg img, .related-product-image img,
.cart-img img, .spd-viewer img, .spd-thumb img, .spd-related-card img {
  object-fit: contain;
  object-position: center;
}

/* Keep product photographs and the full tester poster visible at every size */
#hero .hcircle, #productSlider { max-width: 100%; }
#productSlider .carousel-item img { object-fit: contain !important; }
#menu .mimg { background: #fff; }
.spd-viewer { min-width: 0; }
.spd-viewer img { max-width: 100%; object-fit: contain; }
.related-product-image { background: linear-gradient(145deg, #fff, #f2f5f7); }

/* Refined navigation, contact forms and footer links */
#nav { backdrop-filter: saturate(140%) blur(10px); }
.navbar-nav .nav-link, .product-footer a, .flinks a { transition: color .22s ease, transform .22s ease; }
.navbar-nav .nav-link:hover { transform: translateY(-1px); }
.fctrl, .cart-form input, .cart-form textarea, select { font-family: inherit; }
.fctrl:focus, .cart-form input:focus, .cart-form textarea:focus {
  box-shadow: 0 0 0 4px rgba(232, 40, 26, .1);
}

/* Product pages remain comfortable on tablets and phones */
@media (max-width: 767.98px) {
  #hero { background-attachment: scroll !important; }
  .spd-layout { grid-template-columns: minmax(0, 1fr) !important; }
  .spd-viewer { min-height: 0; }
  .spd-viewer img { height: clamp(300px, 92vw, 440px); padding: clamp(18px, 5vw, 28px); }
  .spd-copy h1 { font-size: clamp(2rem, 9vw, 3rem) !important; }
  .spd-actions { align-items: stretch; }
  .spd-actions .btn-red { justify-content: center; }
  .product-overview-head { align-items: flex-start; }
}
@media (max-width: 575.98px) {
  body { font-size: 15px; }
  .container { --bs-gutter-x: 1.25rem; }
  .stitle { font-size: clamp(1.8rem, 8vw, 2.35rem); }
  .spd-info-card { min-height: 0; }
  .cookie-banner { z-index: 100000; }
}

/* Motion is subtle and respects the visitor's system preference. */
@media (hover: hover) and (pointer: fine) {
  #about .stitle span:hover, .stitle span:hover { text-shadow: 0 5px 18px rgba(232, 40, 26, .15); }
  .spd-copy h1:hover, .product-overview-head h2:hover, .spd-section-head h2:hover {
    color: #c9251a;
    transition: color .25s ease;
  }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}