/* Shared customer-facing design. Existing commerce and admin behavior is retained. */
body.storefront {
  --ink: #202624; --muted: #69716e; --paper: #fff; --soft: #f4f6f5;
  --line: #dfe5e2; --accent: #202624; --accent-strong: #202624;
  --action: #007c75; --action-hover: #005c56; --action-soft: #eaf5f2;
  --wilter-primary: #007c75; --wilter-dark: #202624;
  font-family: Arial, Helvetica, sans-serif; color: var(--ink); background: #fff;
  padding: 0; letter-spacing: 0;
}
.storefront *, .storefront *::before, .storefront *::after { letter-spacing: 0; }
.storefront [hidden] { display: none !important; }
.storefront a, .storefront button { -webkit-tap-highlight-color: transparent; }
.storefront :focus-visible { outline: 3px solid #007c75; outline-offset: 4px; }
.storefront input, .storefront select, .storefront textarea { font: inherit; font-size: 16px; }
.storefront button, .storefront a { touch-action: manipulation; }
.storefront svg { width: 20px; height: 20px; flex-shrink: 0; }
.storefront main { padding-top: 0; }
.skip-link { position: fixed; left: 20px; top: -80px; z-index: 100; background: #fff; padding: 14px; }
.skip-link:focus { top: 10px; }
.skip-link:not(:focus) { clip-path: inset(50%); width: 1px; height: 1px; padding: 0; overflow: hidden; }
.storefront .site-header { position: sticky; top: 0; min-height: 84px; padding: 0 max(24px, calc((100% - 1320px)/2)); gap: 32px; background: #fff; border-bottom: 1px solid var(--line); box-shadow: none; z-index: 40; }
.storefront .brand { width: 164px; height: 44px; flex: 0 0 164px; }
.storefront .brand img { width: 100%; height: 100%; object-fit: contain; }
.storefront .main-nav { gap: 28px; font-size: 14px; font-weight: 600; text-transform: none; flex: 1; justify-content: center; }
.storefront .main-nav a { padding: 30px 0; white-space: nowrap; }
.storefront .main-nav .is-current-page { display: inline-flex !important; color: var(--action); border-bottom: 2px solid var(--action); }
.storefront .header-actions { display: flex; gap: 10px; align-items: center; }
.storefront .icon-link, .storefront .menu-toggle { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; min-width: 44px; border: 1px solid var(--line); border-radius: 4px; padding: 0; background: #fff; color: var(--ink); }
.storefront .icon-link:hover { background: var(--soft); }
.storefront .header-cart { position: relative; overflow: visible; }
.storefront .header-cart span { position: absolute; right: -5px; top: -5px; background: var(--action); color: #fff; font-size: 10px; min-width: 18px; height: 18px; border-radius: 50%; display: grid; place-items: center; padding: 0 3px; }
.storefront .menu-toggle { display: none; }
.storefront .mega-menu { left: 0; right: 0; top: 100%; border: 0; border-bottom: 1px solid var(--line); padding: 28px max(24px, calc((100% - 1200px)/2)); box-shadow: 0 18px 22px #20262412; }
.storefront .mega-menu-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.storefront .mega-menu-detail { margin-top: 18px; padding: 14px 0; border: 0; background: none; }
.storefront .mega-detail-copy small { display: none; }
.storefront .button, .storefront .quick-cart { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 48px; padding: 13px 22px; border-radius: 4px; font-size: 14px; font-weight: 600; line-height: 1.4; text-transform: none; box-shadow: none; transition: background .18s, border-color .18s; }
.storefront .button.primary, .storefront .quick-cart { background: var(--action); color: #fff; border: 1px solid var(--action); }
.storefront .button.primary:hover, .storefront .quick-cart:hover { background: var(--action-hover); border-color: var(--action-hover); transform: none; }
.storefront .button.outline { background: #fff; color: var(--ink); border: 1px solid #c5cfca; }
.storefront .button.outline:hover { background: var(--soft); }
.storefront .button:disabled, .storefront .quick-cart:disabled { opacity: .5; cursor: not-allowed; }
.storefront .section { width: 100%; max-width: none; margin: 0; padding: 80px max(24px, calc((100% - 1240px)/2)); }
.storefront .section-head { display: block; margin: 0 0 32px; max-width: 760px; }
.storefront .eyebrow { font-size: 12px; font-weight: 700; text-transform: uppercase; color: var(--action); margin: 0 0 14px; }
.storefront h1, .storefront h2, .storefront h3 { font-weight: 600; overflow-wrap: break-word; }
.storefront h2 { font-size: 36px; line-height: 1.18; margin: 0 0 18px; }
.storefront h3 { font-size: 22px; line-height: 1.3; }
.storefront p { color: var(--muted); }
.storefront .hero { position: relative; display: flex; align-items: center; min-height: 510px; height: min(660px, calc(100svh - 178px)); margin: 0; padding: 56px max(24px, calc((100% - 1240px)/2)); background: #242b2b; overflow: hidden; }
.storefront .hero-media { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center; }
.storefront .hero-overlay { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(12,19,20,.73),rgba(12,19,20,.12) 65%,transparent); }
.storefront .hero-content { position: relative; z-index: 1; width: 530px; max-width: 100%; padding: 0; margin: 0; }
.storefront .hero .eyebrow { color: #95ded0; }
.storefront .hero-title { display: block; font-size: 64px; line-height: 1.04; color: #fff; margin: 0 0 24px; max-width: 560px; }
.storefront .hero-content > p:not(.eyebrow) { color: #e1e7e5; font-size: 17px; line-height: 1.7; max-width: 430px; margin-bottom: 30px; }
.storefront .hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.storefront .hero .button.primary { background: #fff; color: #202624; border-color: #fff; }
.storefront .hero .button.ghost { color: #fff; background: #20262455; border: 1px solid #ffffff70; }
.service-ribbon { display: grid; grid-template-columns: repeat(3,1fr); gap: 24px; padding: 24px max(24px,calc((100% - 1240px)/2)); background: #f1f5f3; border-bottom: 1px solid var(--line); }
.service-ribbon a { display: flex; gap: 14px; align-items: center; font-size: 14px; font-weight: 600; }
.service-ribbon svg { color: var(--action); width: 24px; height: 24px; }
.service-ribbon small { display: block; color: var(--muted); font-size: 12px; font-weight: 400; margin-top: 3px; }
.section-heading-row { display: flex; justify-content: space-between; gap: 24px; align-items: end; margin-bottom: 32px; }
.section-heading-row .section-head { margin: 0; }
.text-link { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 600; padding: 10px 0; border-bottom: 1px solid var(--ink); white-space: nowrap; }
.storefront .category-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 28px; }
.storefront .home-product { display: block; padding: 0; border: 0; background: none; }
.home-product-media { position: relative; aspect-ratio: 1.65; background: var(--soft); border-radius: 4px; overflow: hidden; }
.home-product-media img { width: 100%; height: 100%; object-fit: contain; transition: transform .4s; }
.home-product:hover img { transform: scale(1.025); }
.home-product-number { position: absolute; left: 20px; top: 16px; color: #fff; font-size: 12px; background: #202624; padding: 5px 9px; border-radius: 3px; }
.home-product-copy { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 22px 0; border-bottom: 1px solid var(--line); }
.home-product-copy h3 { margin: 0 0 5px; }
.home-product-copy p { margin: 0; font-size: 14px; }
.home-product-copy > svg { width: 24px; height: 24px; color: var(--action); }
.storefront .renewal-band { background: #eff4f1; display: grid; grid-template-columns: .85fr 1.15fr; gap: 48px 72px; align-items: start; }
.storefront .renewal-band { color: var(--ink); }
.storefront .renewal-copy h2 { font-size: 40px; max-width: 420px; color: var(--ink); }
.storefront .renewal-copy > p { font-size: 16px; line-height: 1.8; }
.renewal-steps { padding: 0; list-style: none; margin: 28px 0; counter-reset: step; }
.renewal-steps li { counter-increment: step; display: flex; align-items: center; gap: 12px; padding: 14px 0; border-bottom: 1px solid #d7e1db; font-size: 14px; }
.renewal-steps li::before { content: '0' counter(step); color: var(--action); font-size: 12px; font-weight: 700; }
.storefront .renewal-form { background: #fff; border: 1px solid #d7e1db; border-radius: 6px; padding: 28px; box-shadow: none; min-width: 0; }
.storefront .form-grid { gap: 16px; }
.storefront .checkout-form label { font-size: 13px; color: var(--ink); gap: 8px; text-transform: none; font-weight: 600; }
.storefront .checkout-form .remember-row { display: flex; flex-direction: row; align-items: center; gap: 10px; font-weight: 400; }
.storefront .checkout-form .remember-row input { width: 18px; height: 18px; min-height: 18px; margin: 0; }
.storefront .checkout-form input, .storefront .checkout-form select, .storefront .checkout-form textarea { font-weight: 400; }
.storefront .checkout-form input:not([type=checkbox]), .storefront .checkout-form select, .storefront .checkout-form textarea, .storefront .search-box input, .storefront .catalog-filters select { width: 100%; border: 1px solid #cbd5cf; border-radius: 4px; background: #fff; color: var(--ink); min-height: 48px; padding: 12px; box-shadow: none; }
.storefront .renewal-price-box { border: 0; border-left: 3px solid var(--action); background: #f2f7f4; padding: 16px; margin: 8px 0; }
.storefront .renewal-price-box p { font-size: 13px; margin: 6px 0 0; }
.storefront .renewal-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.storefront .renewal-actions .button { width: 100%; margin: 0; min-height: 48px; padding: 12px; }
.storefront .renewal-seo-copy { display: block; grid-column: 1/-1; border-top: 1px solid #d7e1db; padding-top: 26px; margin: 0; }
.storefront .renewal-seo-copy summary { font-weight: 600; cursor: pointer; padding: 12px 0; }
.storefront .renewal-seo-copy h3 { font-size: 19px; margin-top: 25px; color: var(--ink); }
.storefront .renewal-links a { color: var(--action); border: 0; padding: 8px 0; font-weight: 600; text-decoration: underline; }
.storefront .renewal-seo-copy p { max-width: 850px; font-size: 14px; }
.storefront .renewal-links { display: flex; flex-wrap: wrap; gap: 14px 24px; font-size: 13px; }
.storefront .split-section { display: grid; grid-template-columns: 1fr 1fr; gap: 70px; border-bottom: 1px solid var(--line); }
.storefront .copy-stack p { margin-top: 0; font-size: 16px; line-height: 1.85; }
.storefront .blog-preview-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 28px; margin-bottom: 28px; }
.storefront .blog-preview-card { border: 0; border-top: 2px solid var(--action); border-radius: 0; padding: 24px 0; background: none; box-shadow: none; }
.storefront .blog-preview-card h3 { font-size: 23px; margin: 14px 0; }
.storefront .blog-preview-card p { font-size: 14px; line-height: 1.7; }
.storefront .blog-preview-card > span { color: var(--action); font-size: 12px; }
.storefront .seo-band { background: var(--soft); }
.storefront .seo-grid { gap: 24px; }
.storefront .seo-grid article { background: transparent; border: 0; border-radius: 0; padding: 0; }
.storefront .seo-grid h3 { font-size: 19px; }
.storefront .seo-grid p { font-size: 14px; }
.storefront .contact-strip { background: #202c28; color: #fff; display: flex; align-items: center; justify-content: space-between; gap: 32px; }
.storefront .contact-strip h2 { max-width: 630px; font-size: 32px; color: #fff; }
.storefront .contact-strip .eyebrow { color: #9cdac9; }
.storefront .contact-actions { display: flex; flex-wrap: wrap; gap: 12px; }
.storefront .site-footer { margin: 0; padding: 0; background: #fff; color: var(--ink); border-top: 1px solid var(--line); }
.storefront .footer-main { display: grid; grid-template-columns: 1fr 2fr; gap: 70px; padding: 56px max(24px,calc((100% - 1240px)/2)); background: #fff; }
.storefront .footer-brand-panel { background: none; padding: 0; min-height: 0; border: 0; }
.storefront .footer-logo { width: 180px; height: 48px; object-fit: contain; object-position: left; mix-blend-mode: multiply; filter: none; }
.storefront .footer-brand-panel p { color: var(--muted); font-size: 13px; max-width: 250px; margin-top: 20px; }
.storefront .footer-columns { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; padding: 0; }
.storefront .footer-columns > div { display: block; }
.storefront .footer-columns h2 { font-size: 14px; margin-bottom: 20px; }
.storefront .footer-columns a { display: block; padding: 9px 0; margin: 0; font-size: 13px; font-weight: 400; color: var(--muted); }
.storefront .footer-columns a:hover { color: var(--action); }
.storefront .footer-bottom { padding: 22px max(24px,calc((100% - 1240px)/2)); border-top: 1px solid var(--line); background: #fff; font-size: 12px; color: var(--muted); }
.storefront .mobile-dock { display: none; }
.storefront .catalog-hero, .storefront .admin-head { background: none; color: var(--ink); }
.storefront .catalog-hero { padding: 52px max(24px,calc((100% - 1240px)/2)) 30px; min-height: 0; border-bottom: 1px solid var(--line); }
.storefront .catalog-hero h1 { font-size: 42px; line-height: 1.15; margin: 12px 0; }
.storefront .catalog-hero .title-logo { display: none; }
.storefront .catalog-hero p { font-size: 14px; }
.storefront .breadcrumb { font-size: 12px; color: var(--muted); }
.storefront .shop-layout { max-width: 1288px; margin: 0 auto; padding: 36px 24px 64px; display: grid; grid-template-columns: 225px minmax(0,1fr); gap: 40px; }
.storefront .shop-sidebar { background: none; border: 0; padding: 0; border-radius: 0; position: static; min-width: 0; }
.storefront .catalog-filters { display: grid; gap: 16px; padding: 20px 0; }
.storefront .catalog-filters label > span, .storefront .search-box > span { display: block; font-size: 12px; margin-bottom: 7px; color: var(--muted); }
.storefront .category-menu a, .storefront .category-menu button { font-size: 13px; }
.storefront .category-tile-grid { display: none; }
.storefront .shop-titlebar h2 { font-size: 24px; }
.storefront .listing-toolbar { margin: 20px 0; font-size: 12px; border: 0; padding: 0; }
.storefront .listing-toolbar > span { display: none; }
.storefront .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 24px; }
.storefront .product-card { border: 1px solid var(--line); border-radius: 6px; box-shadow: none; overflow: hidden; min-width: 0; background: #fff; }
.storefront .product-card:hover { transform: none; box-shadow: 0 6px 20px #20262409; }
.storefront .product-card__media { aspect-ratio: 1.3; width: 100%; height: auto !important; min-height: 0; padding: 0; border: 0; background: #f4f6f5; }
.storefront .product-card__media img { width: 100% !important; height: 100% !important; max-height: 100% !important; max-width: 100% !important; object-fit: contain !important; padding: 0 !important; }
.storefront .product-card__content { padding: 22px; }
.storefront .product-card__title { font-size: 22px; min-height: 0; margin: 10px 0; }
.storefront .product-card__description { display: none !important; }
.storefront .product-card__features { display: none; }
.storefront .product-card__tags { display: none; }
.storefront .product-card__code { font-size: 12px; color: var(--muted); }
.storefront .product-card__purchase { border-top: 1px solid var(--line); padding-top: 16px; margin-top: 18px; }
.storefront .product-card__price { font-size: 22px; }
.storefront .product-card__stock { color: #007452; font-size: 12px; }
.storefront .product-card__actions { display: grid !important; grid-template-columns: 1fr 1fr; padding: 0 22px 22px !important; gap: 8px; }
.storefront .product-card__actions .button, .storefront .product-card__actions .quick-cart { min-height: 44px; padding: 10px 8px; font-size: 13px; }
.storefront .category-seo { margin-top: 48px; padding-top: 32px; border-top: 1px solid var(--line); }
.storefront .category-seo h2 { font-size: 24px; }
.storefront .detail-shell { max-width: 1288px; margin: 0 auto; padding: 32px 24px 64px; }
.storefront .detail-top { display: grid; grid-template-columns: 1fr 1fr; gap: 56px; align-items: start; }
.storefront .detail-main-image { width: 100%; height: auto !important; aspect-ratio: 1; background: #f3f5f4; border: 1px solid var(--line); border-radius: 6px; padding: 0; }
.storefront .detail-main-image img { width: 100% !important; height: 100% !important; max-width: 100% !important; max-height: 100% !important; object-fit: contain !important; padding: 0 !important; }
.storefront .detail-info h1 { font-size: 34px; line-height: 1.15; margin: 12px 0 20px; }
.storefront .detail-info > p { font-size: 14px; line-height: 1.75; }
.storefront .detail-price strong { font-size: 30px; }
.storefront .option-panel { padding: 24px 0 0; border: 0; border-top: 1px solid var(--line); border-radius: 0; background: #fff; }
.storefront .variant-choice-grid { grid-template-columns: repeat(4,minmax(0,1fr)); gap: 8px; }
.storefront .variant-choice { min-height: 44px; padding: 10px 4px; border: 1px solid var(--line); border-radius: 4px; background: #fff; }
.storefront .variant-choice span { display: none; }
.storefront .variant-choice.active { background: var(--action-soft); color: var(--action); border-color: var(--action); }
.storefront .variant-choice strong { font-size: 13px; }
.storefront .technical-section, .storefront .product-detail-content, .storefront .product-faq, .storefront .related-products { margin-top: 48px; border-top: 1px solid var(--line); padding-top: 32px; }
.storefront .technical-section h2, .storefront .product-detail-content h2, .storefront .product-faq h2, .storefront .related-products h2 { font-size: 25px; }
.storefront .product-detail-content article { background: none; border: 0; border-radius: 0; padding: 0; }
.storefront .spec-table td, .storefront .spec-table th { font-size: 14px; padding: 14px; overflow-wrap: anywhere; }
.storefront .cart-shell, .storefront .account-shell, .storefront .blog-shell { max-width: 1288px; margin: 0 auto; padding: 48px 24px 72px; }
.storefront .admin-head { margin-bottom: 32px; }
.storefront .admin-head h1 { font-size: 38px; }
.storefront .cart-item { border: 1px solid var(--line); border-radius: 6px; background: #fff; box-shadow: none; }
.storefront .cart-item .product-photo { width: 100px; height: 100px; min-height: 0; padding: 0; }
.storefront .cart-item img { width: 100%; height: 100%; object-fit: contain; }
.storefront .cart-item h3 { font-size: 18px; }
.storefront .cart-summary { border-radius: 6px; background: var(--soft); box-shadow: none; }
.storefront .checkout-form { border-radius: 6px; box-shadow: none; }
.storefront .blog-card { border: 0; border-top: 1px solid var(--line); padding: 28px 0; border-radius: 0; background: none; }
.storefront .blog-card h2 { font-size: 26px; }
.storefront .blog-keywords { display: none; }
.storefront .blog-post-shell { max-width: 840px; padding: 48px 24px 72px; margin: auto; }
.storefront .blog-post-shell h1 { font-size: 40px; line-height: 1.2; }
.storefront .blog-post-content h2 { font-size: 26px; }
.storefront .blog-post-content p { font-size: 17px; line-height: 1.85; }
.storefront .personal-offer-card { border: 1px solid var(--line); border-radius: 6px; box-shadow: none; }
.storefront .form-message { font-size: 14px; overflow-wrap: anywhere; }
.filter-toggle { display: none !important; }
.detail-quantity { display: flex; align-items: center; gap: 14px; margin: 12px 0; font-size: 14px; }
.detail-quantity input { width: 84px; min-height: 44px; border: 1px solid var(--line); padding: 10px; border-radius: 4px; }
.storefront .footer-columns h2 { color: var(--ink); }
.storefront .account-grid { display: block; max-width: 520px; margin: 0 auto; }
.storefront .account-grid .checkout-form { border: 0; padding: 24px 0; }
.storefront .account-grid h2 { font-size: 26px; }
.account-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; background: var(--soft); padding: 4px; border-radius: 4px; }
.account-tabs button { min-height: 46px; border: 0; border-radius: 3px; background: transparent; font: inherit; font-size: 14px; cursor: pointer; }
.account-tabs button[aria-selected=true] { color: var(--action); background: #fff; box-shadow: 0 1px 4px #20262416; }
.storefront .blog-index { padding: 40px max(24px,calc((100% - 1240px)/2)) 72px; }
.storefront .blog-grid { gap: 32px; }
.storefront .seo-band { padding-top: 28px; padding-bottom: 28px; }
.storefront .seo-band summary { cursor: pointer; font-size: 14px; font-weight: 600; }
.storefront .seo-band[open] .section-head { margin-top: 28px; }
.storefront #renewal, .storefront #about, .storefront #contact { scroll-margin-top: 100px; }
@media (min-width: 1001px) { .storefront .product-grid.list-view { grid-template-columns: 1fr; } }
@media (max-width: 1100px) {
  .storefront .site-header { gap: 18px; }
  .storefront .main-nav { gap: 18px; }
  .storefront .main-nav a { font-size: 13px; }
  .storefront .renewal-band { gap: 40px; }
}
@media (max-width: 1000px) {
  .storefront .site-header { min-height: 72px; padding: 12px 24px; justify-content: space-between; }
  .storefront .brand { width: 150px; flex-basis: 150px; height: 38px; }
  .storefront .menu-toggle { display: inline-flex; }
  .storefront .main-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; background: #fff; border-bottom: 1px solid var(--line); padding: 20px 24px; box-shadow: 0 16px 25px #20262415; }
  .storefront .main-nav.open { display: flex; flex-direction: column; align-items: stretch; gap: 0; }
  .storefront .main-nav a { display: block; padding: 16px 0; font-size: 16px; border-bottom: 1px solid var(--line); }
  .storefront .mega-menu { display: none !important; }
  .storefront .section { padding-top: 56px; padding-bottom: 56px; }
  .storefront .hero { min-height: 500px; height: 560px; }
  .storefront .hero-title { font-size: 54px; }
  .storefront .renewal-band { grid-template-columns: 1fr 1fr; gap: 28px; }
  .storefront .renewal-copy h2 { font-size: 32px; }
  .storefront .renewal-form { padding: 22px; }
  .storefront .shop-layout { grid-template-columns: 1fr; gap: 20px; }
  .filter-toggle { display: inline-flex !important; margin-bottom: 8px; }
  .storefront .shop-sidebar { display: none; }
  .storefront .shop-sidebar.filters-open { display: block; padding: 20px; background: var(--soft); }
  .storefront .catalog-filters { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .storefront .detail-top { gap: 28px; }
  .storefront .detail-info h1 { font-size: 28px; }
  .storefront .footer-main { gap: 36px; }
}
@media (max-width: 700px) {
  .storefront { padding-bottom: 66px; }
  .storefront .site-header { min-height: 68px; padding: 10px 18px; }
  .storefront .brand { width: 135px; flex-basis: 135px; }
  .storefront .header-actions { gap: 7px; }
  .storefront .header-actions > a[href='account.html'] { display: none; }
  .storefront .icon-link, .storefront .menu-toggle { width: 42px; height: 42px; min-width: 42px; }
  .storefront .section { padding: 44px 20px; }
  .storefront h2 { font-size: 28px; }
  .storefront .hero { min-height: 480px; height: min(620px,calc(100svh - 128px)); padding: 36px 22px; align-items: end; }
  .storefront .hero-media { object-position: 61% center; }
  .storefront .hero-overlay { background: linear-gradient(0deg,rgba(12,19,20,.94),rgba(12,19,20,.25)); }
  .storefront .hero-title { font-size: 43px; max-width: 340px; margin-bottom: 18px; }
  .storefront .hero-content > p:not(.eyebrow) { font-size: 15px; line-height: 1.65; max-width: 320px; margin-bottom: 22px; }
  .storefront .hero-actions { gap: 10px; }
  .storefront .hero-actions .button { font-size: 12px; padding: 12px 14px; }
  .service-ribbon { grid-template-columns: 1fr; gap: 0; padding: 12px 20px; }
  .service-ribbon a { padding: 12px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
  .service-ribbon a:last-child { border: 0; }
  .service-ribbon small { display: inline; margin-left: 8px; }
  .section-heading-row { display: block; }
  .section-heading-row .text-link { margin-top: 8px; }
  .storefront .category-grid { grid-template-columns: 1fr; gap: 26px; }
  .home-product-media { aspect-ratio: 1.5; }
  .home-product-copy { padding: 16px 0; }
  .home-product-copy h3 { font-size: 23px; }
  .storefront .renewal-band, .storefront .split-section { grid-template-columns: 1fr; gap: 28px; }
  .storefront .renewal-copy h2 { font-size: 32px; }
  .storefront .renewal-form { padding: 20px; }
  .storefront .renewal-form .form-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
  .storefront .renewal-form label { font-size: 12px; }
  .storefront .renewal-actions .button { font-size: 12px; padding: 11px 6px; }
  .storefront .blog-preview-grid { grid-template-columns: 1fr; gap: 10px; }
  .storefront .seo-grid { grid-template-columns: 1fr; }
  .storefront .contact-strip { display: block; }
  .storefront .contact-strip h2 { font-size: 28px; }
  .storefront .contact-actions { margin-top: 22px; }
  .storefront .footer-main { grid-template-columns: 1fr; padding: 36px 20px; gap: 30px; }
  .storefront .footer-columns { grid-template-columns: 1fr 1fr; gap: 28px; }
  .storefront .footer-bottom { padding: 20px; }
  .storefront .mobile-dock { position: fixed; left: 0; right: 0; bottom: 0; z-index: 45; display: grid; grid-template-columns: repeat(4,1fr); background: #fff; border-top: 1px solid var(--line); padding: 8px 8px max(8px,env(safe-area-inset-bottom)); }
  .mobile-dock a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 4px; font-size: 10px; color: var(--muted); min-height: 42px; }
  .mobile-dock a[aria-current=page] { color: var(--action); font-weight: 700; }
  .storefront .catalog-hero { padding: 30px 20px 24px; display: block; }
  .storefront .catalog-hero h1 { font-size: 32px; }
  .storefront .catalog-hero > .button { display: none; }
  .storefront .shop-layout { padding: 24px 20px 48px; }
  .storefront .shop-titlebar h2 { font-size: 22px; }
  .storefront .product-grid { grid-template-columns: 1fr; gap: 22px; }
  .storefront .product-card__media { aspect-ratio: 1.35; }
  .storefront .product-card__content { padding: 18px; }
  .storefront .product-card__actions { padding: 0 18px 18px !important; }
  .storefront .detail-shell { padding: 24px 20px 48px; }
  .storefront .detail-top { grid-template-columns: 1fr; gap: 26px; }
  .storefront .detail-main-image { aspect-ratio: 1.15; }
  .storefront .detail-info h1 { font-size: 30px; }
  .storefront .variant-choice-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
  .storefront .product-detail-content { grid-template-columns: 1fr; }
  .storefront .cart-shell, .storefront .account-shell, .storefront .blog-shell { padding: 30px 20px 48px; }
  .storefront .admin-head { display: block; }
  .storefront .admin-head h1 { font-size: 32px; }
  .storefront .cart-layout { grid-template-columns: 1fr; }
  .storefront .cart-item { grid-template-columns: 70px minmax(0,1fr); padding: 14px; gap: 14px; }
  .storefront .cart-item .product-photo { width: 70px; height: 80px; }
  .storefront .cart-item-actions { grid-column: 1/-1; flex-direction: row; justify-content: space-between; }
  .storefront .checkout-grid, .storefront .auth-grid { grid-template-columns: 1fr; }
  .storefront .blog-post-shell h1 { font-size: 32px; }
}
.storefront .account-shell {max-width:1100px;min-height:65vh}
.storefront .account-shell .admin-head {border-bottom:1px solid var(--line);padding-bottom:24px;margin-bottom:36px;align-items:center}
.storefront .account-shell .admin-head h1 {font-size:34px;line-height:1.2;margin:8px 0 0}
.storefront .account-shell .breadcrumb {color:var(--muted);font-size:13px}
.storefront .account-grid {max-width:480px;margin:0 auto;background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:28px;box-sizing:border-box}
.storefront .account-tabs {background:var(--soft);border:1px solid var(--line);gap:4px;margin-bottom:8px}
.storefront .account-tabs button {font-weight:600;color:var(--muted);transition:background .18s,color .18s}
.storefront .account-tabs button[aria-selected=true] {background:var(--action);color:#fff;box-shadow:none}
.storefront .account-grid .checkout-form {background:transparent;padding:24px 0 0;margin:0;box-shadow:none;display:flex;flex-direction:column;gap:18px}
.storefront .account-grid h2,.storefront .forgot-panel h2 {font-size:24px;line-height:1.3;margin:0;color:var(--ink)}
.storefront .account-grid .checkout-form>p:not(.form-message),.storefront .forgot-panel p {font-size:14px;line-height:1.65;color:var(--muted);margin:0}
.storefront .account-shell input,.storefront .account-shell textarea {transition:border-color .18s,box-shadow .18s}
.storefront .account-shell input:focus,.storefront .account-shell textarea:focus {border-color:var(--action);box-shadow:0 0 0 3px var(--action-soft);outline:none}
.storefront .account-shell .button.primary {background:var(--action);color:#fff;border:1px solid var(--action);min-height:48px;font-size:14px;transition:background .18s}
.storefront .account-shell .button.primary:hover {background:var(--action-hover)}
.storefront .account-shell .link-button {color:var(--action);background:transparent;border:0;font-size:14px;min-height:44px;text-decoration:underline;text-underline-offset:4px;cursor:pointer}
.storefront .account-shell .form-message:empty {display:none}
.storefront .account-shell .form-message:not(:empty) {font-size:14px;line-height:1.6;padding:12px;border-left:3px solid currentColor;background:var(--soft);overflow-wrap:anywhere}
.storefront .forgot-panel {max-width:480px;margin:20px auto 0;background:var(--action-soft);border:1px solid #bddbd5;border-radius:6px;padding:24px;box-sizing:border-box}
.storefront .account-shell:has([data-forgot-panel]:not([hidden])) .account-grid {display:none}
.storefront .forgot-panel .checkout-form {padding:0;background:transparent;border:0;box-shadow:none;display:grid;gap:16px}
.storefront .account-dashboard {display:block;max-width:900px;margin:0 auto}
.storefront .account-dashboard-tabs {display:flex;gap:24px;border-bottom:1px solid var(--line);margin-bottom:28px}
.storefront .account-dashboard-tabs button {border:0;border-bottom:3px solid transparent;background:none;color:var(--muted);font:inherit;font-size:15px;font-weight:600;padding:16px 4px;cursor:pointer;min-height:48px}
.storefront .account-dashboard-tabs button[aria-selected=true] {border-bottom-color:var(--action);color:var(--action)}
.storefront .account-dashboard>section {padding:0;background:transparent;border:0;box-shadow:none;min-width:0}
.storefront .account-dashboard h2 {font-size:24px;overflow-wrap:anywhere}
.storefront .account-dashboard .panel-title {gap:16px;align-items:center;flex-wrap:wrap}
.storefront .account-dashboard form {max-width:680px;display:grid;gap:18px}
.storefront .account-dashboard .form-grid {display:grid;grid-template-columns:1fr 1fr;gap:18px}
.storefront .account-dashboard .order-card {border:1px solid var(--line);border-radius:6px;background:white;margin-bottom:18px;padding:22px}
.storefront .account-dashboard .status-badge {background:var(--action-soft);color:var(--action-hover);border-radius:4px}
.storefront .account-grid [role=tabpanel]:not([hidden]),.storefront .account-dashboard [role=tabpanel]:not([hidden]),.storefront .forgot-panel:not([hidden]) {animation:account-reveal .18s ease-out}
@keyframes account-reveal {from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.storefront .account-grid{padding:20px}.storefront .account-shell .admin-head{margin-bottom:24px}.storefront .account-shell .admin-head h1{font-size:28px}.storefront .account-shell .admin-head>.button{margin-top:16px}.storefront .account-dashboard-tabs{gap:0;justify-content:space-between}.storefront .account-dashboard-tabs button{font-size:13px}.storefront .account-dashboard .form-grid{grid-template-columns:1fr}.storefront .account-grid h2{font-size:22px}.storefront .account-dashboard .panel-actions{display:flex;gap:8px;flex-wrap:wrap}}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .storefront * { animation: none !important; transition: none !important; } }
