/* Visual refinement, September 2026. Load after instop-mobile.css.
   No dependency on a framework upgrade or on JavaScript. */
:root { --instop-text: #252d32; --instop-muted: #606b71; --instop-line: #dfe4e6; --instop-soft: #f4f6f6; }
body { background: #fff; -webkit-text-size-adjust: 100%; }
#header { background: #fff; }
#header .header-search form .input { border-radius: 10px 0 0 10px; background: #f7f8f8; height: 50px; }
#header .header-search form .search-btn { border-radius: 0 10px 10px 0; height: 50px; }
#header .header-ctn > div > button { border-radius: 10px; }
#header .cart-dropdown { border-radius: 12px; box-shadow: 0 12px 32px #15252e24; }
#top-header .header-links a { min-height: 44px; }
#mobile-live-results a { min-height: 60px; }
#navigation { border-top: 1px solid var(--instop-line); }
#navigation .main-nav > li > a { font-size: 14px; }
.instop-home-main:focus { outline: none; }
.instop-welcome { display: grid; grid-template-columns: 1.2fr 1fr; gap: 48px; align-items: center; padding: 40px; background: #f1f4f3; border-radius: 20px; margin: 0 0 24px; }
.instop-eyebrow { color: #8f281d; font-size: 11px; font-weight: 700; letter-spacing: 1.4px; margin-bottom: 16px; }
.instop-welcome h1 { font-size: clamp(32px, 4vw, 48px); line-height: 1.13; letter-spacing: -1.5px; margin: 0 0 18px; }
.instop-welcome-description { max-width: 360px; color: #536068; font-size: 16px; line-height: 1.6; margin-bottom: 20px; }
.instop-explore { display: inline-flex; align-items: center; gap: 22px; padding: 12px 18px; min-height: 48px; background: var(--instop-red); color: #fff; border-radius: 9px; font-weight: 700; font-size: 14px; }
.instop-explore:hover, .instop-explore:focus { background: var(--instop-red-dark); color: #fff; }
.instop-service-links { display: grid; gap: 10px; }
.instop-service-links a { display: flex; align-items: center; gap: 14px; padding: 18px; background: #fff; border: 1px solid #e0e6e3; border-radius: 12px; min-width: 0; }
.instop-service-links a > i { display: flex; align-items: center; justify-content: center; flex: 0 0 40px; height: 40px; color: #a52d21; background: #fbefeb; border-radius: 10px; font-size: 18px; }
.instop-service-links a > span:last-child { margin-left: auto; font-size: 24px; color: #7a8687; }
.instop-service-links strong, .instop-service-links small { display: block; }
.instop-service-links strong { font-size: 15px; }
.instop-service-links small { font-size: 12px; color: #657076; margin-top: 3px; }
.instop-shortcut-grid .shop { border-radius: 12px; overflow: hidden; }
.instop-shortcut-grid .shop .shop-body { border-top: 0; padding: 16px; }
.instop-shortcut-grid .shop .shop-body h4 { font-size: 16px; }
.instop-home-title { font-size: 25px; letter-spacing: -.6px; scroll-margin-top: 20px; }
.instop-category-grid .elem, .instop-category-grid .product { border-radius: 12px; background: #fff; }
.instop-category-grid .elem > a { padding: 16px; background: #fafbfb; }
.instop-category-grid .elem h4 { padding: 14px 16px 18px; font-size: 15px; }
.instop-category-grid .elem h4 a { min-height: 44px; display: flex; align-items: center; }
.instop-category-grid .elem:hover, .instop-category-grid .product:hover { box-shadow: 0 4px 16px #263e4a0d; }
.product.instop-product-card { overflow: hidden; }
.product.instop-product-card .product-img { height: auto !important; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; padding: 16px; }
.product.instop-product-card .product-img img { max-width: 100%; max-height: 100%; width: auto; object-fit: contain; }
.product.instop-product-card .product-body { height: auto !important; padding: 16px; text-align: left; }
.product.instop-product-card .product-name { line-height: 1.5; overflow-wrap: anywhere; }
.product.instop-product-card .instop-card-purchase { gap: 12px; }
.product.instop-product-card .instop-card-actions { width: 100%; }
.product.instop-product-card .instop-card-actions .instop-buy-btn { width: 100%; border-radius: 8px; }
.product.instop-product-card > center { padding: 0 12px 14px; font-size: 13px; }
.product-details .product-name { letter-spacing: -.5px; }
.product-details .add-to-cart { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
#product-tab .tab-nav { gap: 8px; }
#product-tab .tab-nav li a { padding: 12px 16px; border-radius: 8px; background: #f2f4f4; }
#product-tab .tab-nav li.active a { color: #8f281d; background: #fbefeb; }
#footer { margin-top: 24px; background: #f4f6f6; border-top: 1px solid var(--instop-line); }
#footer .footer-title { text-transform: none; letter-spacing: 0; }
#footer .instop-footer-offices > div { padding: 20px; border: 1px solid var(--instop-line); border-radius: 12px; background: #fff; }
#footer .instop-footer-offices { gap: 16px; }
@media (max-width: 991px) {
  #navigation .main-nav { gap: 8px; padding: 8px 0; }
  #navigation .main-nav > li > a { border: 1px solid #e3e7e7; border-radius: 8px; padding: 14px 12px; background: #f7f9f8; }
  .instop-welcome { gap: 24px; padding: 28px; }
}
@media (max-width: 767px) {
  .instop-welcome { grid-template-columns: 1fr; padding: 24px 20px; gap: 24px; border-radius: 16px; }
  .instop-welcome h1 { font-size: 36px; }
  .instop-welcome-description { font-size: 15px; margin-bottom: 18px; }
  .instop-eyebrow { font-size: 10px; letter-spacing: 1px; margin-bottom: 12px; }
  .instop-service-links a { padding: 12px; gap: 12px; }
  .instop-service-links strong { font-size: 14px; }
  .instop-service-links small { font-size: 12px; }
  .instop-shortcut-grid .shop { flex-direction: row; align-items: center; min-height: 86px; }
  .instop-shortcut-grid .shop .shop-img { width: 40%; flex: 0 0 40%; background: #fff; }
  .instop-shortcut-grid .shop .shop-img img { aspect-ratio: 1; object-fit: contain; }
  .instop-shortcut-grid .shop .shop-body { padding: 10px 8px; }
  .instop-shortcut-grid .shop .shop-body h4 { font-size: 12px; line-height: 1.4; overflow-wrap: anywhere; }
  .instop-home-title { font-size: 23px; margin-top: 30px; }
  .instop-category-grid .elem > a { padding: 10px; }
  .instop-category-grid .elem h4 { padding: 8px 12px 12px; font-size: 14px; }
  .instop-category-grid .elem .principal { aspect-ratio: 1.25; }
  .product.instop-product-card .product-body { padding: 12px; }
  .product.instop-product-card .product-name { font-size: 14px; }
  .product.instop-product-card .product-price { font-size: 17px; overflow-wrap: anywhere; }
  #header .header-search form .input { font-size: 16px; }
  #footer .instop-footer-offices { gap: 12px; }
}
@media (max-width: 359px) {
  .instop-welcome { padding: 20px 14px; }
  .instop-welcome h1 { font-size: 32px; }
  .instop-service-links a { gap: 8px; padding: 10px; }
  .instop-service-links a > i { flex-basis: 32px; height: 36px; }
  .instop-service-links strong { font-size: 13px; }
  .instop-service-links small { font-size: 11px; }
  .instop-shortcut-grid .shop { flex-direction: column; padding-top: 8px; }
  .instop-shortcut-grid .shop .shop-img { width: 60%; }
  .instop-shortcut-grid .shop .shop-body { text-align: center; }
}
/* Compact mobile layout: content determines height, without empty spacers. */
#top-header .instop-top-layout { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
#top-header .instop-top-layout::before, #top-header .instop-top-layout::after { display: none; }
#top-header .header-logo { display: block; float: none; }
#top-header .logo { display: flex; align-items: center; min-height: 54px; }
#top-header .logo img { width: 160px; height: auto; filter: brightness(0) invert(1); }
#top-header .header-links { gap: 20px; }
#header .instop-header-layout { grid-template-columns: minmax(0, 1fr) auto; gap: 16px; }
#header .instop-header-search { grid-column: 1; grid-row: 1; }
#header .instop-header-actions { grid-column: 2; grid-row: 1; }
@media (max-width: 767px) {
  #top-header .instop-top-layout { gap: 12px; }
  #top-header .logo { min-height: 48px; }
  #top-header .logo img { width: 132px; }
  #top-header .header-links li:last-child { display: none; }
  #top-header .header-links a { font-size: 12px; }
  #header .header-search form .search-btn { flex-basis: 44px; width: 44px; font-size: 0; }
  #header .header-search form .search-btn::before { content: '\f002'; font-family: FontAwesome; font-size: 17px; }
  #header .header-ctn { gap: 2px; }
  #header .header-ctn > div > button { width: 44px !important; min-height: 48px; font-size: 11px; }
  #header { padding: 10px 0 12px; }
  #header .instop-header-layout { gap: 10px; }
  .instop-home-main { padding-top: 12px; padding-bottom: 12px; }
  .instop-welcome { padding: 18px 16px; gap: 16px; margin-bottom: 16px; }
  .instop-welcome h1 { font-size: 30px; line-height: 1.12; margin-bottom: 10px; letter-spacing: -.8px; }
  .instop-eyebrow { margin-bottom: 8px; }
  .instop-welcome-description { margin-bottom: 12px; font-size: 14px; line-height: 1.5; }
  .instop-explore { padding: 10px 14px; min-height: 44px; }
  .instop-service-links { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
  .instop-service-links a { flex-direction: column; justify-content: flex-start; gap: 6px; padding: 10px 4px; text-align: center; }
  .instop-service-links a > i { flex: 0 0 28px; width: 28px; height: 28px; background: transparent; font-size: 18px; }
  .instop-service-links strong { font-size: 12px; line-height: 1.35; }
  .instop-service-links small, .instop-service-links a > span:last-child { display: none; }
  .instop-shortcut-grid, .instop-category-grid { gap: 10px; margin-top: 12px; }
  .instop-shortcut-grid .shop { flex-direction: row; padding-top: 0; min-height: 76px; }
  .instop-shortcut-grid .shop .shop-img { width: 38%; flex-basis: 38%; }
  .instop-shortcut-grid .shop .shop-body { text-align: left; padding: 8px 6px; }
  .instop-home-title { margin-top: 22px; margin-bottom: 0; }
  .instop-category-grid .elem > a { padding: 6px; }
  .instop-category-grid .elem h4 { padding: 4px 10px 8px; }
  #footer { margin-top: 12px; }
  #footer > .section { padding-top: 20px; padding-bottom: 16px; }
  #footer .instop-footer-offices { padding-top: 16px; gap: 10px; }
  #footer .instop-footer-offices > div { padding: 14px; }
  #footer .instop-footer-offices .footer { margin-bottom: 0; }
  #footer .instop-footer-offices h4 { margin-bottom: 6px; }
  #footer .instop-footer-offices .footer-title { margin-bottom: 8px; }
  #footer .instop-footer-offices .footer-links li { margin-bottom: 0; }
  #footer .instop-footer-offices .footer-links li a { min-height: 44px; padding-top: 8px; padding-bottom: 8px; }
}