/* ============================================================
   Hippo theme — D&H visual parity. Tokens first; brand swap = edit :root.
   ============================================================ */
:root{
  /* Hippo brand: red / tan / black */
  --h-red:#C40C40; --h-red-2:#A80A36; --h-tan:#F3E7C3; --h-cream:#FBF6E6; --h-black:#181819;
  --h-blue:var(--h-red); --h-blue-2:var(--h-red); --h-orange:var(--h-black); --h-ink:#181819; --h-text:#444340; --h-muted:#7A7670; --h-line:#E2DDD0; --h-line-2:#EFEBE0;
  --h-bg:#FFFFFF; --h-surface:var(--h-cream); --h-surface-2:#FAF7EE; --h-max:1200px; --h-font:"Inter",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; --h-display:"Archivo","Inter",system-ui,sans-serif; --h-radius:6px;
  --h-accent:var(--h-red); --h-accent-ink:#fff; --h-ease:cubic-bezier(.2,.7,.2,1);
}
*{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;font:16px/1.5 var(--h-font);color:var(--h-text);background:var(--h-bg)}
a{color:var(--h-blue)}img{max-width:100%;height:auto}
h1,h2,h3,h4{color:var(--h-black);line-height:1.15;margin:0 0 .5em;font-weight:800;font-family:var(--h-display);letter-spacing:-.01em}
.container{max-width:var(--h-max);margin:0 auto;padding:0 15px}
.skip-link{position:absolute;left:-999px}.skip-link:focus{left:8px;top:8px;background:#fff;padding:8px;z-index:100}
.button,button.single_add_to_cart_button,.checkout-button,button#place_order,.hippo-contact .button{display:inline-block;background:var(--h-blue);color:#fff;border:1px solid var(--h-blue);padding:10px 22px;border-radius:var(--h-radius);cursor:pointer;font:inherit;font-weight:500;text-decoration:none;text-align:center;transition:background .15s}
.button:hover,button.single_add_to_cart_button:hover{background:#163f6e}
.button--outline{background:#fff;color:var(--h-blue)}.button--outline:hover{background:var(--h-surface)}
.button--pill{background:var(--h-blue);border-radius:50px;padding:11px 26px;text-transform:uppercase;font-size:.85rem;letter-spacing:.02em}
.button--orange{background:var(--h-orange);border-color:var(--h-orange);border-radius:50px;padding:11px 28px}.button--orange:hover{background:#cf6a12}
.ic{width:18px;height:18px;vertical-align:-3px}
/* ---- header ---- */
.usp{background:var(--h-black);color:#fff;font-size:12.5px}.usp .ic{color:var(--h-tan)!important}
.usp__row{display:flex;justify-content:center;gap:0;padding:7px 15px}.usp__row span{padding:0 18px;border-left:1px solid rgba(255,255,255,.18)}.usp__row span:first-child{border:0}.usp .ic{width:15px;height:15px;color:var(--h-orange);margin-right:4px}
.site-header{position:sticky;top:0;z-index:80;background:#fff;transition:box-shadow .25s}.site-header.is-stuck{box-shadow:0 6px 24px rgba(24,24,25,.08)}.site-header__row{display:flex;align-items:center;gap:22px;padding:16px 15px}.site-header.is-stuck .site-logo img{transform:scale(.84);transform-origin:left center}.site-header .site-nav{border-top:0}
.nav-toggle{display:none;background:none;border:0;cursor:pointer;color:var(--h-blue)}.nav-toggle .ic{width:26px;height:26px}
.site-logo{text-decoration:none;display:flex;flex-direction:column;line-height:1;min-width:200px}.site-logo img{height:50px;width:auto;max-width:260px;transition:height .25s var(--h-ease)}.site-header.is-stuck .site-logo img{height:38px}.custom-logo-link{display:block;line-height:0}
.site-footer__logo img{height:44px;width:auto;filter:invert(1);margin-bottom:12px}
.site-logo__word{font-family:var(--h-display);font-size:30px;font-weight:900;font-style:italic;color:var(--h-black);letter-spacing:-.03em;text-transform:uppercase}.site-logo__word b{font-weight:400;font-style:normal;letter-spacing:.28em;font-size:13px;display:block;margin-left:2px}.site-logo__tag{display:none}
.site-search{display:flex;flex:1;max-width:520px}.site-search input[type=search]{flex:1;height:42px;padding:0 16px;border:1px solid var(--h-line);border-right:0;border-radius:21px 0 0 21px;font:inherit;font-size:.95rem;background:var(--h-surface-2)}.site-search input[type=search]:focus{outline:2px solid var(--h-red);outline-offset:-1px}.site-search button{height:42px;padding:0 24px;border:0;background:var(--h-red);color:#fff;border-radius:0 21px 21px 0;font:inherit;font-weight:600;cursor:pointer}
.site-icons{margin-left:auto;display:flex;gap:22px;align-items:center}.site-icons a{position:relative;color:var(--h-blue);text-decoration:none;display:flex;flex-direction:column;align-items:center;font-size:11px;gap:2px}.site-icons .ic{width:26px;height:26px;stroke-width:1.5}
.site-quote__count{position:absolute;top:-6px;right:-8px;background:var(--h-red);color:#fff;border-radius:999px;font-size:11px;min-width:18px;height:18px;line-height:18px;text-align:center;padding:0 5px;font-weight:600}
.site-nav{border-top:1px solid var(--h-line-2);border-bottom:1px solid var(--h-line-2);background:#fff;position:relative;z-index:50}
.site-nav__row{display:flex;align-items:stretch;gap:0;padding:0 15px}
.site-nav__menu{display:contents;list-style:none;margin:0;padding:0}
.site-nav__item,.site-nav__menu>li{position:relative}
.site-nav__item>a,.site-nav__menu>li>a{display:flex;align-items:center;gap:6px;padding:14px 16px;color:var(--h-ink);text-decoration:none;font-size:14.5px;font-weight:500;white-space:nowrap}
.site-nav__item>a:hover,.site-nav__menu>li>a:hover{color:var(--h-blue)}
.site-nav__item--mega>a{color:var(--h-red);font-weight:600}.site-nav__item .ic--chev{width:12px;height:12px;opacity:.6}
.mega,.drop{position:absolute;top:100%;left:0;background:#fff;border:1px solid var(--h-line-2);box-shadow:0 12px 30px rgba(20,40,70,.12);display:none;z-index:60}
.site-nav__item:hover>.mega,.site-nav__item:hover>.drop,.site-nav__item:focus-within>.mega,.site-nav__item:focus-within>.drop{display:block}
.mega{width:min(1100px,calc(100vw - 30px));padding:22px 26px}.mega__cols{column-count:5;column-gap:22px}.mega__col{break-inside:avoid;-webkit-column-break-inside:avoid;margin:0 0 16px;display:inline-block;width:100%}
.mega__head{display:block;font-weight:600;color:var(--h-blue);text-decoration:none;font-size:14px;margin-bottom:6px}.mega__col ul{list-style:none;padding:0;margin:0}.mega__col li a{display:block;font-size:13px;color:var(--h-text);text-decoration:none;padding:2px 0}.mega__col li a:hover{color:var(--h-orange)}
.drop ul{list-style:none;margin:0;padding:8px 0;min-width:220px}.drop li a{display:block;padding:8px 18px;font-size:14px;color:var(--h-text);text-decoration:none;white-space:nowrap}.drop li a:hover{background:var(--h-surface);color:var(--h-blue)}
.promo{background:var(--h-tan);color:var(--h-black);font-size:14px;font-weight:500;padding:8px 0;text-align:center}
/* ---- layout ---- */
.site-main{padding:24px 15px 60px}
.pd__crumbs{font-size:13px;color:var(--h-muted);margin-bottom:18px}.pd__crumbs a{color:var(--h-muted);text-decoration:none}.pd__crumbs a:hover{color:var(--h-blue)}
/* ---- footer ---- */
.site-footer{margin-top:60px;font-size:14px;background:var(--h-black);color:#D9D4C7}.site-footer a{color:#fff}.site-footer h3{color:var(--h-tan)}.site-footer .support{background:var(--h-cream);color:var(--h-text)}
.support{background:var(--h-surface);padding:34px 0;text-align:center}.support h2{font-size:26px;font-weight:600;margin-bottom:20px}
.support__tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:900px;margin:0 auto}.support__tiles a{background:#fff;border:1px solid var(--h-line-2);border-radius:8px;padding:20px;text-decoration:none;color:var(--h-text);display:flex;flex-direction:column;align-items:center;gap:4px}.support__tiles .ic{width:34px;height:34px;color:var(--h-blue);stroke-width:1.4;margin-bottom:6px}.support__tiles strong{color:var(--h-blue)}
.site-footer__cols{display:grid;grid-template-columns:repeat(4,1fr);gap:30px;padding:38px 15px 28px}.site-footer__cols h3{font-size:14px;text-transform:uppercase;letter-spacing:.06em;color:var(--h-blue);margin-bottom:12px}.site-footer__cols ul{list-style:none;padding:0;margin:0}.site-footer__cols li{margin:0 0 8px}.site-footer__cols a{color:var(--h-text);text-decoration:none}.site-footer__cols a:hover{color:var(--h-orange)}.site-footer__cols p{margin:0 0 8px}
.site-footer__legal{border-top:1px solid rgba(255,255,255,.12);padding:16px 0;font-size:13px;color:#A9A39A;text-align:center}.site-footer__legal a{color:#A9A39A;text-decoration:none}.site-footer__cols a{color:#D9D4C7}.site-footer__cols a:hover{color:var(--h-tan)}
/* ---- notices ---- */
.woocommerce-notices-wrapper .woocommerce-message,.woocommerce-info,.woocommerce-error,.woocommerce-message{border-left:4px solid var(--h-blue);background:var(--h-surface);padding:12px 16px;margin:0 0 18px;list-style:none;color:var(--h-ink)}.woocommerce-error{border-color:#c0392b}
.woocommerce-message a.button{margin-left:10px;padding:5px 12px;font-size:.85rem}
/* ---- cards ---- */
ul.products{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(255px,1fr));gap:22px}
ul.products li.card{border:1px solid var(--h-line);border-radius:10px;background:#fff;position:relative;transition:transform .3s var(--h-ease),box-shadow .3s var(--h-ease)}ul.products li.card:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(24,24,25,.1)}
.card__link{display:flex;flex-direction:column;padding:16px;text-decoration:none;color:inherit;height:100%;text-align:center}
.card__badge{position:absolute;top:10px;left:10px;background:var(--h-black);color:#fff;font-size:11px;font-weight:600;padding:3px 9px;border-radius:3px;text-transform:uppercase;letter-spacing:.03em}
.card__img{display:block;aspect-ratio:1;margin-bottom:12px}.card__img img{width:100%;height:100%;object-fit:contain}
.card__title{font-weight:600;color:var(--h-black);line-height:1.3;font-size:15px}.card__sub{font-size:13px;color:var(--h-muted);margin-top:4px}
.card__sku{font-size:12px;color:var(--h-muted);margin-top:6px}
.card__price{margin-top:auto;padding-top:10px;font-weight:600;color:var(--h-ink);font-size:15px}.card__price .amount{color:var(--h-ink)}.hippo-from,.hippo-from-note{font-size:12px;color:var(--h-muted);font-weight:400}
.card__cta{margin-top:10px;font-size:13px;font-weight:600;color:var(--h-red);border:1.5px solid var(--h-red);border-radius:50px;padding:6px 16px;align-self:center;transition:all .2s}li.card:hover .card__cta{background:var(--h-red);color:#fff}
/* ---- category ---- */
.cat-head{display:grid;grid-template-columns:1fr;gap:24px;align-items:center;margin:4px 0 18px}.cat-head--img{grid-template-columns:3fr 2fr}
.cat-head h1{font-size:28px;margin:0 0 8px;text-transform:uppercase}.cat-head__desc{max-width:none;color:var(--h-text);margin:0}.cat-head__count{font-size:13px;color:var(--h-muted);margin:8px 0 0}
.cat-head__img img{width:100%;border-radius:var(--h-radius)}
.cat-chips{display:flex;gap:10px;flex-wrap:wrap;margin:0 0 18px}.chip{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--h-line);border-radius:50px;padding:5px 14px 5px 5px;text-decoration:none;color:var(--h-ink);font-size:13.5px;background:#fff}.chip img{width:28px;height:28px;border-radius:50%;object-fit:cover}.chip small{color:var(--h-muted)}.chip:hover{border-color:var(--h-blue);color:var(--h-blue)}
.cat-tools{display:flex;justify-content:space-between;align-items:center;margin:0 0 16px;font-size:13.5px;color:var(--h-muted)}.cat-tools select{padding:6px 8px;border:1px solid var(--h-line);border-radius:var(--h-radius);font:inherit;font-size:13.5px}
.cat-about{margin-top:48px;padding-top:24px;border-top:1px solid var(--h-line-2);color:var(--h-text);font-size:15px}.cat-about h2{font-size:20px}.cat-about h2.p-head,.cat-about h3{font-size:16px}.cat-about iframe{max-width:100%}.cat-about p{text-align:left!important}
.woocommerce-pagination{margin:28px 0 0;text-align:center}.woocommerce-pagination ul{list-style:none;padding:0;display:inline-flex;gap:6px}.woocommerce-pagination a,.woocommerce-pagination span{display:inline-block;padding:6px 12px;border:1px solid var(--h-line);border-radius:var(--h-radius);text-decoration:none}.woocommerce-pagination span.current{background:var(--h-blue);color:#fff;border-color:var(--h-blue)}
/* ---- product page ---- */
.pd__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,6fr);grid-template-areas:"gallery head" "gallery buy";gap:0 44px;align-items:start}.pd__gallery{grid-area:gallery}.pd__head{grid-area:head}.pd__buy{grid-area:buy}
.woocommerce-product-gallery{position:relative}.woocommerce-product-gallery__wrapper{margin:0;padding:0}.woocommerce-product-gallery__image img{width:100%}
.woocommerce-product-gallery__trigger{display:none}
.flex-control-thumbs{list-style:none;padding:0;margin:12px 0 0;display:flex;gap:10px;flex-wrap:wrap}.flex-control-thumbs img{width:64px;height:64px;object-fit:cover;border:1px solid var(--h-line);cursor:pointer;opacity:.75}.flex-control-thumbs img.flex-active,.flex-control-thumbs img:hover{opacity:1;border-color:var(--h-blue)}
/* video inside the lightbox */
.lbx__figure iframe{width:min(1100px,100%);aspect-ratio:16/9;height:auto;border:0;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.5);background:#000}
.pd__title{font-size:20px;text-transform:uppercase;color:var(--h-ink);font-weight:600;letter-spacing:.01em;margin:0 0 4px}
.pd__sku{font-size:13px;color:var(--h-muted);margin:0 0 10px}.pd__stock{margin-left:8px;color:#2E7D4F}
.pd__bullets{margin:0 0 14px;padding-left:18px;font-size:13.5px;color:var(--h-text)}.pd__bullets li{margin:2px 0}.pd__excerpt{font-size:13.5px;margin:0 0 14px}.pd__excerpt p{margin:0 0 6px}.pd__excerpt ul{margin:0;padding-left:18px}
.pd__pricing-label{font-size:12px;text-transform:uppercase;letter-spacing:.06em;color:var(--h-muted);font-weight:600;margin:0 0 10px}
.hippo-form{margin:0}
.hippo-field{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:12px 22px;align-items:center;margin:0 0 12px}
.hippo-field__lab label{display:block;font-weight:600;color:var(--h-ink);font-size:14px}.hippo-field__hint{display:block;font-size:12px;color:var(--h-muted)}
.hippo-field select{width:100%;padding:9px 12px;border:1px solid var(--h-line);border-radius:var(--h-radius);background:#fff;font:inherit;font-size:14px;color:var(--h-ink)}
.hippo-tiers{margin:0 0 14px}.hippo-tiers--variant{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.6fr);gap:22px;align-items:center}.hippo-tiers__thumb{text-align:center}.hippo-tiers__thumb img{max-height:90px;width:auto}.hippo-tiers__thumb img[src=""]{display:none}
/* Rounded to match .hippo-kv and the rest of the page. border-collapse:collapse ignores
   radius on the inner cells, so this uses separate borders with zero spacing and draws
   the grid with one edge per cell — otherwise adjacent borders would double to 2px. */
.hippo-tiers__table{width:100%;border-collapse:separate;border-spacing:0;background:#fff;font-size:13px;font-variant-numeric:tabular-nums;border:1px solid var(--h-line);border-radius:10px;overflow:hidden}.hippo-tiers__table th,.hippo-tiers__table td{border:0;border-top:1px solid var(--h-line);border-left:1px solid var(--h-line);padding:9px 4px;text-align:center}.hippo-tiers__table tr:first-child th,.hippo-tiers__table tr:first-child td{border-top:0}.hippo-tiers__table th:first-child,.hippo-tiers__table td:first-child{border-left:0}.hippo-tiers__table th{font-weight:600;color:var(--h-ink);background:var(--h-surface)}.hippo-tiers__table .is-on{background:#EEEEEE;color:var(--h-black);font-weight:700}
.hippo-addon__tiers{grid-column:2}.hippo-tiers__table--sm{font-size:12px}.hippo-tiers__table--sm th,.hippo-tiers__table--sm td{padding:6px 3px}
.hippo-buyrow{display:flex;justify-content:space-between;align-items:center;gap:20px;margin:22px 0 14px;padding-top:14px;border-top:1px solid var(--h-line-2)}
.hippo-price strong{font-size:28px;color:var(--h-ink);font-weight:600;font-variant-numeric:tabular-nums}.hippo-price>span{display:block;font-size:12.5px;color:var(--h-muted);white-space:nowrap}
.hippo-qty{display:flex;align-items:center;gap:10px}.hippo-qty label{font-size:13px;color:var(--h-muted);font-weight:600}.hippo-qty__ctl{display:inline-flex;border:1px solid var(--h-line);border-radius:var(--h-radius);overflow:hidden;background:#fff}.hippo-qty__ctl button{width:40px;height:40px;border:0;background:#fff;font-size:1.2rem;cursor:pointer;color:var(--h-ink)}.hippo-qty__ctl input{width:90px;text-align:center;border:0;border-left:1px solid var(--h-line);border-right:1px solid var(--h-line);font:inherit;font-size:1.05rem;font-weight:600}
.hippo-min{color:#B3261E;font-size:.9rem;margin:0 0 10px}
.hippo-form .single_add_to_cart_button{width:100%;padding:13px;font-size:15px;font-weight:600;margin-bottom:10px}.hippo-form .single_add_to_cart_button:disabled{opacity:.5;cursor:not-allowed}
.hippo-form .button--outline{width:100%;padding:12px}
.hippo-note{font-size:12.5px;color:var(--h-muted);margin:12px 0 0}
.hippo-eco{margin:16px 0 0;padding:10px 12px;border-left:3px solid #3C8C4E;background:#EEF7F0;font-size:13.5px}
.hippo-tip{font-size:13px;color:var(--h-muted)}
.pd__tabs{margin-top:48px}.pd__tablist{display:flex;justify-content:center;gap:10px;border-bottom:1px solid #E3E5E8;flex-wrap:wrap;margin:8px 0 26px}.pd__tablist button{display:flex;align-items:center;gap:8px;background:none;border:0;border-bottom:3px solid transparent;margin:0 0 -1px;padding:12px 18px;font:inherit;font-size:13px;font-weight:500;color:var(--h-black);cursor:pointer;border-radius:0;transition:color .15s}.pd__tablist button .ic{width:15px;height:15px;stroke-width:2}.pd__tablist button:hover{color:var(--h-red)}.pd__tablist button[aria-selected=true]{color:var(--h-red);font-weight:700;border-bottom-color:var(--h-red)}
.pd__tabs [role=tabpanel]{padding:2px 0 8px;max-width:none;margin:0;font-size:16px;color:var(--h-text);line-height:1.6}.pd__tabhead{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.02em;color:#6B7280;margin:0 0 12px;font-family:var(--h-font);font-style:normal}.pd__tabs [role=tabpanel] iframe{display:block;margin:16px auto;max-width:100%}.pd__tabs [role=tabpanel] center{display:block}.pd__tabs [role=tabpanel] h3{font-size:16px}
.hippo-kv{border-collapse:separate;border-spacing:0;font-size:15px;width:100%;border:1px solid #E3E5E8;border-radius:10px;overflow:hidden}
.hippo-kv th{text-align:left;padding:13px 18px;color:var(--h-text);font-weight:500;width:34%;vertical-align:top}
.hippo-kv td{padding:13px 18px;color:var(--h-black);vertical-align:top}
.hippo-kv tr+tr th,.hippo-kv tr+tr td{border-top:1px solid #EDEFF2}
.hippo-kv tbody tr{transition:background .12s}.hippo-kv tbody tr:hover{background:#F6F7F9}
@media (max-width:600px){.hippo-kv th{width:42%;padding:11px 12px;font-size:14px}.hippo-kv td{padding:11px 12px;font-size:14px}}
.hippo-faq{border-bottom:1px solid var(--h-line-2);padding:10px 0}.hippo-faq summary{cursor:pointer;font-weight:600;color:var(--h-ink)}
.related.products{margin-top:52px}.related.products>h2{font-size:22px;text-transform:uppercase;text-align:center;margin-bottom:22px}
.hippo-child{color:var(--h-muted)}.hippo-child-qty{font-variant-numeric:tabular-nums}
/* ---- quote basket ---- */
.woocommerce-cart .site-main h1,.woocommerce-checkout .site-main h1{font-size:26px;text-transform:uppercase}
table.shop_table{width:100%;border-collapse:collapse;font-size:14.5px}table.shop_table th,table.shop_table td{border-bottom:1px solid var(--h-line-2);padding:12px 10px;text-align:left;vertical-align:middle}table.shop_table th{color:var(--h-ink);font-weight:600}
table.shop_table.cart td.product-thumbnail img{width:70px;height:70px;object-fit:contain;border:1px solid var(--h-line-2)}
table.shop_table.cart td.product-remove a.remove{color:var(--h-muted);text-decoration:none;font-size:1.3rem;line-height:1}
table.shop_table.cart .quantity input{width:80px;padding:7px;border:1px solid var(--h-line);border-radius:var(--h-radius);text-align:center;font:inherit}
table.shop_table.cart td.product-name a{text-decoration:none;color:var(--h-blue);font-weight:600}
table.shop_table.cart dl.variation{margin:4px 0 0;font-size:12.5px;color:var(--h-muted)}table.shop_table.cart dl.variation dt,table.shop_table.cart dl.variation dd{display:inline;margin:0}
table.shop_table.cart .actions{text-align:right}table.shop_table.cart .actions .coupon{display:none}
.cart-collaterals{display:flex;justify-content:flex-end;margin-top:20px}.cart_totals{width:100%;max-width:420px;background:var(--h-surface);border:1px solid var(--h-line-2);border-radius:var(--h-radius);padding:20px}
.cart_totals h2{font-size:18px;margin:0 0 10px}.cart_totals table{width:100%}.cart_totals th{font-weight:600;color:var(--h-ink)}.cart_totals td{text-align:right;font-variant-numeric:tabular-nums}
.wc-proceed-to-checkout .checkout-button{display:block;padding:13px;margin-top:12px;font-size:15px;font-weight:600}
.hippo-est{display:block;color:var(--h-muted);font-weight:400;font-size:12px}
.cart-empty{font-size:1.1rem}.return-to-shop .button{text-decoration:none;display:inline-block}
/* ---- quote form ---- */
form.checkout{display:grid;grid-template-columns:minmax(0,3fr) minmax(0,2fr);gap:36px;align-items:start}
form.checkout #customer_details{display:contents}form.checkout .col-1,form.checkout .col-2{grid-column:1}
form.checkout h3{font-size:17px;margin:0 0 12px;padding-top:6px}
form.checkout .form-row{margin:0 0 12px}form.checkout .form-row label{display:block;font-weight:600;font-size:13.5px;color:var(--h-ink);margin-bottom:3px}form.checkout .form-row .required{color:#B3261E;text-decoration:none}
form.checkout input,form.checkout textarea,form.checkout select{width:100%;padding:9px 11px;border:1px solid var(--h-line);border-radius:var(--h-radius);font:inherit;font-size:14.5px}
form.checkout .form-row-first,form.checkout .form-row-last{width:48%;display:inline-block;vertical-align:top}form.checkout .form-row-last{margin-left:4%}form.checkout .form-row-wide{width:100%}
form.checkout .woocommerce-shipping-fields{margin-top:16px}#ship-to-different-address{display:none}
form.checkout .woocommerce-additional-fields{margin-top:16px}form.checkout textarea{min-height:120px}
#order_review_heading{grid-column:2;grid-row:1;margin:0;font-size:17px}
#order_review{grid-column:2;grid-row:1;margin-top:34px;background:var(--h-surface);border:1px solid var(--h-line-2);border-radius:var(--h-radius);padding:18px;position:sticky;top:16px}
#order_review table{width:100%;font-size:14px}#order_review tfoot th{font-weight:600;color:var(--h-ink)}#order_review td{text-align:right;font-variant-numeric:tabular-nums}#order_review .product-quantity{color:var(--h-muted)}
#payment{background:none;margin-top:12px}#payment .place-order{padding:0}#payment button#place_order{width:100%;padding:13px;font-size:15px;font-weight:600}
.woocommerce-privacy-policy-text{font-size:12.5px;color:var(--h-muted)}
.select2-container .select2-selection--single{height:40px;border:1px solid var(--h-line);border-radius:var(--h-radius)}.select2-container .select2-selection--single .select2-selection__rendered{line-height:38px}.select2-container .select2-selection--single .select2-selection__arrow{height:38px}
.woocommerce-order .woocommerce-notice{font-size:1.15rem;font-weight:600;color:var(--h-blue)}.woocommerce-order-overview{list-style:none;padding:0;display:flex;gap:28px;flex-wrap:wrap;font-size:.9rem;color:var(--h-muted)}.woocommerce-order-overview strong{display:block;color:var(--h-ink)}
/* ---- content pages ---- */
.page .site-main article{max-width:900px}.page .entry{line-height:1.65;font-size:15.5px}.page .entry h1{font-size:28px;text-transform:uppercase}.page .entry h2{font-size:20px;margin:28px 0 8px}.page .entry h3{font-size:16px;margin:18px 0 6px}
.page .entry .lead{font-size:17px;color:var(--h-text)}.page .entry details{border-bottom:1px solid var(--h-line-2);padding:10px 0}.page .entry summary{cursor:pointer;font-weight:600;color:var(--h-ink)}
.two-col{display:grid;grid-template-columns:3fr 2fr;gap:36px;align-items:start}
.hippo-contact label{display:block;font-weight:600;font-size:13.5px;color:var(--h-ink);margin:0 0 12px}.hippo-contact label span{color:#B3261E}.hippo-contact input,.hippo-contact textarea{display:block;width:100%;padding:9px 10px;border:1px solid var(--h-line);border-radius:var(--h-radius);font:inherit;font-weight:400;margin-top:3px}
.hippo-contact__row{display:grid;grid-template-columns:1fr 1fr;gap:14px}.hippo-hp{position:absolute;left:-9999px}
/* ---- responsive ---- */
@media (max-width:1000px){.usp__row{display:none}.site-icons a span{display:none}.mega__cols{column-count:3}}
@media (max-width:860px){.pd__grid{grid-template-areas:"head" "gallery" "buy";gap:16px}.pd__title{font-size:18px}.site-logo img{height:34px;max-width:150px}.site-icons{gap:12px}.site-icons .ic{width:24px;height:24px}.site-header__row{gap:10px;padding:10px 12px}.site-logo{min-width:0}.promo{font-size:12.5px;padding:6px 0}.pd__grid,.cat-head--img,.hero,.two-col,.hippo-contact__row,form.checkout{grid-template-columns:1fr}.trust,.support__tiles,.site-footer__cols{grid-template-columns:1fr 1fr}#order_review_heading,#order_review{grid-column:1;grid-row:auto;position:static;margin-top:0}.cta-band{flex-direction:column;align-items:flex-start}.hippo-field,.hippo-tiers--variant{grid-template-columns:1fr}.hippo-tiers__thumb{display:none}.hippo-addon__tiers{grid-column:1}
  .nav-toggle{display:block}.site-header__row{flex-wrap:wrap;gap:14px}.site-search{order:3;flex-basis:100%;max-width:none}.site-logo{min-width:0}
  .site-nav{display:none}.site-nav.is-open{display:block}.site-nav__row{flex-direction:column;align-items:stretch}.site-nav__menu{display:block}.site-nav__item>a,.site-nav__menu>li>a{padding:12px 15px;border-bottom:1px solid var(--h-line-2)}.mega,.drop{position:static;box-shadow:none;border:0;width:auto;padding:6px 15px 12px}.mega__cols{column-count:2}.site-nav__item:hover>.mega{display:none}.site-nav__item.is-open>.mega,.site-nav__item.is-open>.drop{display:block}}
@media (max-width:600px){.trust,.support__tiles,.site-footer__cols{grid-template-columns:1fr}.hero h1{font-size:30px}.hippo-buyrow{flex-direction:column;align-items:flex-start}}

/* ============ MODERN LAYER ============ */
.hippo-js .reveal{opacity:0;transform:translateY(22px);transition:opacity .7s var(--h-ease),transform .7s var(--h-ease);transition-delay:var(--d,0ms)}.reveal.is-in{opacity:1;transform:none}
.reveal--d1{transition-delay:.08s}.reveal--d2{transition-delay:.16s}.reveal--d3{transition-delay:.24s}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none}*{scroll-behavior:auto!important}.site-header__row{transition:none}}
/* hero slider */
.home{padding-top:0}
.slider{position:relative;background:var(--h-black);color:#fff;overflow:hidden}
.slider__track{display:flex;transition:transform .7s var(--h-ease);will-change:transform}
.slide{min-width:100%;position:relative;min-height:min(560px,72vh);display:grid;align-items:center}
.slide__bg{position:absolute;inset:0;overflow:hidden}/* The scrim below already handles text legibility (85% ink on the left, 15% on the right).
   Dimming the image to .55 on top of it left only ~8% of the photo visible under the
   headline — hence the grey mush. Let the scrim do that job alone. */
/* The slides are 16:9 in a ~2.6:1 box, so cover crops ~30% of the height. Centred, that
   cuts the product off — the subjects sit low in these shots. Bias the window down. */
.slide__bg img{width:100%;height:100%;object-fit:cover;object-position:center 62%;opacity:.92;transform:scale(1.06);transition:transform 6s linear}.slide.is-active .slide__bg img{transform:scale(1)}
/* Holds ink across the text column (roughly the left 45%), then clears quickly so the
   product still reads on the right. Tuned against DSC03834, whose own printed text sits
   right behind the body copy. */
.slide__bg:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,24,25,.88) 0%,rgba(24,24,25,.78) 32%,rgba(24,24,25,.42) 62%,rgba(24,24,25,.10) 100%)}
.slide__inner{position:relative;padding:70px 84px;max-width:var(--h-max);margin:0 auto;width:100%}@media (max-width:560px){.slide__inner{padding:56px 18px}}
.slide__eyebrow{display:inline-block;background:var(--h-red);color:#fff;font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;padding:5px 12px;border-radius:3px;margin-bottom:18px}
.slide h1,.slide h2{color:#fff;font-size:clamp(32px,5vw,58px);font-weight:900;font-style:italic;letter-spacing:-.02em;max-width:14ch;margin:0 0 16px;text-wrap:balance;text-transform:uppercase}
.slide p{font-size:clamp(15px,1.5vw,19px);max-width:50ch;color:#E6E2D8;margin:0 0 26px}
.slide .button{background:var(--h-red);border-color:var(--h-red);border-radius:50px;padding:13px 28px;font-weight:600;margin-right:10px}.slide .button--ghost{background:transparent;color:#fff;border-color:rgba(255,255,255,.5)}.slide .button--ghost:hover{background:rgba(255,255,255,.1)}
.slide>*{opacity:0;transform:translateY(16px)}.slide.is-active .slide__inner{opacity:1;transform:none;transition:opacity .8s .15s var(--h-ease),transform .8s .15s var(--h-ease)}.slide.is-active .slide__bg{opacity:1;transform:none}
.slider__nav{position:absolute;top:50%;transform:translateY(-50%);width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.35);background:rgba(24,24,25,.35);color:#fff;cursor:pointer;display:grid;place-items:center;backdrop-filter:blur(4px);transition:background .2s}.slider__nav:hover{background:var(--h-red);border-color:var(--h-red)}.slider__nav--prev{left:18px}.slider__nav--next{right:18px}.slider__nav .ic{width:20px;height:20px}
.slider__dots{position:absolute;bottom:22px;left:0;right:0;display:flex;justify-content:center;gap:8px}.slider__dots button{width:34px;height:4px;border-radius:2px;border:0;background:rgba(255,255,255,.35);cursor:pointer;padding:0;transition:background .2s}.slider__dots button[aria-current=true]{background:var(--h-red)}
.slider__progress{position:absolute;left:0;bottom:0;height:3px;background:var(--h-red);width:0}
/* stats */
.stats{background:var(--h-tan)}.stats__row{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;padding:28px 15px}.stat{text-align:center}.stat strong{display:block;font-family:var(--h-display);font-size:clamp(28px,3.4vw,42px);font-weight:900;color:var(--h-black);font-variant-numeric:tabular-nums;line-height:1}.stat span{font-size:13px;color:var(--h-text);text-transform:uppercase;letter-spacing:.06em;font-weight:600}
/* rails */
.band{padding:48px 15px 10px}.band__head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:20px}.band__title{font-size:clamp(24px,3vw,34px);margin:0;text-transform:uppercase;font-style:italic}.band__title small{display:block;font-family:var(--h-font);font-style:normal;font-weight:500;font-size:14px;color:var(--h-muted);text-transform:none;letter-spacing:0;margin-top:4px}
.rail-ctl{display:flex;gap:8px}.rail-ctl button{width:40px;height:40px;border-radius:50%;border:1px solid var(--h-line);background:#fff;cursor:pointer;display:grid;place-items:center;color:var(--h-black);transition:all .2s}.rail-ctl button:hover{background:var(--h-black);color:#fff;border-color:var(--h-black)}.rail-ctl .ic{width:18px;height:18px}
.rail{display:flex;gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scroll-behavior:smooth;padding:4px 4px 18px;margin:0 -4px;scrollbar-width:none}.rail::-webkit-scrollbar{display:none}.rail>*{scroll-snap-align:start;flex:0 0 auto}
.rail.products{display:flex}.rail.products li.card{width:270px}
.cat-tile{width:300px;aspect-ratio:4/3;position:relative;border-radius:14px;overflow:hidden;background:var(--h-surface-2);text-decoration:none;display:block;border:1px solid var(--h-line-2)}.cat-tile img{width:100%;height:100%;object-fit:contain;padding:24px 24px 60px;transition:transform .5s var(--h-ease)}.cat-tile:hover img{transform:scale(1.06)}
.cat-tile__cap{position:absolute;left:0;right:0;bottom:0;padding:14px 16px;background:linear-gradient(180deg,rgba(24,24,25,0),rgba(24,24,25,.88));color:#fff;display:flex;justify-content:space-between;align-items:center}.cat-tile__cap strong{font-family:var(--h-display);font-size:17px;font-weight:800;line-height:1.15}.cat-tile__cap span{font-size:12px;background:var(--h-red);padding:3px 9px;border-radius:50px;white-space:nowrap}
/* parallax band */
.parallax{position:relative;min-height:380px;display:grid;align-items:center;color:#fff;margin-top:40px;overflow:hidden}/* Bias the visible slice down: centred, a 380px band lands on the white insert of the
   display and the headline disappears into it. Lower down is the printed panel — darker,
   more colourful, and it actually shows the printing this band is talking about. */
.parallax__bg{position:absolute;left:0;right:0;top:-140px;bottom:-140px;background-size:cover;background-position:center 88%;will-change:transform}/* Left-weighted, not a flat wash: the copy is left-aligned in a 16ch column while the
   subject sits centre, so a uniform 70% still let a white display bleed through the
   headline. Hold ink across the text column, then clear so the piece still reads. */
.parallax:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(24,24,25,.94) 0%,rgba(24,24,25,.90) 46%,rgba(24,24,25,.66) 74%,rgba(24,24,25,.42) 100%)}.parallax .container{position:relative;padding:60px 15px}.parallax h2{color:#fff;font-size:clamp(28px,4vw,46px);font-style:italic;text-transform:uppercase;max-width:16ch}.parallax p{max-width:52ch;color:#E6E2D8;font-size:17px}.parallax .button{background:var(--h-red);border-color:var(--h-red);border-radius:50px;padding:13px 28px}
@media (max-width:900px){.parallax{background-attachment:scroll}}
/* features */
.features{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:40px 15px}.feature{background:#fff;border:1px solid var(--h-line-2);border-radius:14px;padding:22px;transition:transform .3s var(--h-ease),box-shadow .3s}.feature:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(24,24,25,.08)}.feature .ic{width:30px;height:30px;color:var(--h-red);stroke-width:1.6;margin-bottom:10px}.feature strong{display:block;font-family:var(--h-display);font-size:17px;margin-bottom:4px}.feature span{font-size:14px;color:var(--h-text)}
/* faq accordion */
.faq{max-width:820px;margin:0 auto;padding:10px 15px 50px}.faq details{border-bottom:1px solid var(--h-line)}.faq summary{list-style:none;cursor:pointer;padding:16px 0;font-weight:600;font-size:16px;display:flex;justify-content:space-between;align-items:center;color:var(--h-black)}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:"+";font-size:22px;color:var(--h-red);transition:transform .3s}.faq details[open] summary:after{transform:rotate(45deg)}.faq details p{margin:0 0 16px;color:var(--h-text)}
.cta-band{display:flex;justify-content:space-between;align-items:center;gap:24px;background:var(--h-black);color:#fff;border-radius:16px;margin:28px auto 10px;padding:34px 38px;max-width:calc(var(--h-max) - 30px)}.cta-band h2{margin:0 0 6px;font-size:26px;color:#fff;font-style:italic;text-transform:uppercase}.cta-band p{margin:0;opacity:.85}.cta-band .button{background:var(--h-red);border-color:var(--h-red);border-radius:50px;white-space:nowrap;padding:13px 28px}
@media (max-width:860px){.stats__row,.features{grid-template-columns:1fr 1fr}.cta-band{flex-direction:column;align-items:flex-start}.slide{min-height:70vh}}
@media (max-width:560px){.stats__row{grid-template-columns:1fr 1fr}.features{grid-template-columns:1fr}.slider__nav{display:none}}
/* quantity slider w/ tier stops */
.hippo-range{margin:4px 0 16px}.hippo-range__track{position:relative;padding:6px 0}
.hippo-range input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:3px;background:linear-gradient(90deg,var(--h-red) var(--p,0%),var(--h-line) var(--p,0%));outline:none;margin:0}
.hippo-range input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--h-red);box-shadow:0 2px 8px rgba(24,24,25,.2);cursor:grab}.hippo-range input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:3px solid var(--h-red);cursor:grab}
.hippo-range__stops{position:relative;height:22px;margin-top:2px}.hippo-range__stop{position:absolute;transform:translateX(-50%);font-size:11px;color:var(--h-muted);white-space:nowrap}.hippo-range__stop:before{content:"";display:block;width:2px;height:6px;background:var(--h-line);margin:0 auto 2px}.hippo-range__stop.is-hit{color:var(--h-red);font-weight:700}.hippo-range__stop.is-hit:before{background:var(--h-red)}
.hippo-range__hint{font-size:12px;color:var(--h-muted);margin-top:2px}.hippo-range__hint b{color:var(--h-red)}
/* sticky buy bar */
.stickybuy{position:fixed;left:0;right:0;bottom:0;background:#fff;border-top:1px solid var(--h-line);box-shadow:0 -8px 30px rgba(24,24,25,.1);z-index:70;transform:translateY(110%);transition:transform .35s var(--h-ease)}.stickybuy.is-on{transform:none}
.stickybuy__row{display:flex;align-items:center;gap:18px;padding:10px 15px}.stickybuy__row img{width:46px;height:46px;object-fit:contain;border:1px solid var(--h-line-2);border-radius:6px}.stickybuy__name{font-weight:600;font-size:14px;flex:1;min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.stickybuy__price{font-family:var(--h-display);font-weight:800;font-size:20px}.stickybuy__price small{font-family:var(--h-font);font-weight:400;font-size:12px;color:var(--h-muted)}.stickybuy .button{padding:10px 22px;border-radius:50px}
@media (max-width:600px){.stickybuy__name{display:none}}
/* gallery zoom */
.woocommerce-product-gallery__image{overflow:hidden;border-radius:10px;border:1px solid var(--h-line-2);position:relative}
.flex-viewport{border:1px solid var(--h-line-2);border-radius:10px;overflow:hidden}
.flex-viewport .woocommerce-product-gallery__image{border:0;border-radius:0}
.woocommerce-product-gallery.is-zoomable .woocommerce-product-gallery__image{cursor:zoom-in}
.woocommerce-product-gallery.is-zoomable .woocommerce-product-gallery__image:after{content:"";position:absolute;right:12px;bottom:12px;width:34px;height:34px;border-radius:50%;background:rgba(24,24,25,.6) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23fff' stroke-width='1.8' stroke-linecap='round'%3E%3Ccircle cx='11' cy='11' r='7'/%3E%3Cpath d='M20 20l-4-4'/%3E%3C/svg%3E") center/17px no-repeat;opacity:0;transition:opacity .25s var(--h-ease)}
.woocommerce-product-gallery.is-zoomable .woocommerce-product-gallery__image:hover:after{opacity:1}.woocommerce-product-gallery__image img{transition:transform .5s var(--h-ease)}.woocommerce-product-gallery__image:hover img{transform:scale(1.04)}
/* load more */
.loadmore{text-align:center;margin:28px 0}.loadmore .button{border-radius:50px;padding:12px 30px}.loadmore .button[disabled]{opacity:.6}
.cat-tools{position:sticky;top:64px;z-index:5;background:rgba(255,255,255,.95);backdrop-filter:blur(6px);padding:8px 0;margin:0 0 16px}
.loadmore + .woocommerce-pagination{display:none}
.hippo-artwork{margin-top:14px}.hippo-artwork input[type=file]{width:100%;padding:10px;border:1.5px dashed var(--h-line);border-radius:var(--h-radius);background:var(--h-surface-2);font:inherit;font-size:14px}.hippo-artwork__list{list-style:none;padding:0;margin:8px 0 0;font-size:13.5px}.hippo-artwork__list li{padding:3px 0}.hippo-artwork__list .is-err{color:#B3261E}
/* ---- responsive cart/checkout tables ---- */
@media (max-width:760px){
  table.shop_table_responsive thead{display:none}
  table.shop_table_responsive tbody tr{display:block;border:1px solid var(--h-line);border-radius:10px;padding:12px 12px 12px 12px;margin:0 0 12px;position:relative;background:#fff}
  table.shop_table_responsive tbody td{display:flex;justify-content:space-between;align-items:center;gap:12px;border:0;padding:6px 0;text-align:right}
  table.shop_table_responsive tbody td:before{content:attr(data-title);font-weight:600;color:var(--h-muted);font-size:12.5px;text-transform:uppercase;letter-spacing:.04em;text-align:left}
  table.shop_table_responsive td.product-remove{position:absolute;top:6px;right:8px;padding:0}table.shop_table_responsive td.product-remove:before{display:none}
  table.shop_table_responsive td.product-thumbnail{display:block;text-align:left;padding-right:40px}table.shop_table_responsive td.product-thumbnail:before{display:none}
  table.shop_table_responsive td.product-name{display:block;text-align:left;padding-right:40px;font-size:15px}table.shop_table_responsive td.product-name:before{display:none}
  table.shop_table.cart .actions{text-align:center;display:block;padding:6px 0}table.shop_table.cart .actions .button{width:100%}
  .cart_totals{max-width:none}.cart-collaterals{display:block}
  #order_review table.shop_table tbody tr{display:table-row;border:0;padding:0}#order_review table.shop_table td,#order_review table.shop_table th{display:table-cell}#order_review table.shop_table td:before{display:none}#order_review table.shop_table thead{display:table-header-group}
  .pd__crumbs{font-size:12px}.woocommerce-cart .site-main h1,.woocommerce-checkout .site-main h1{font-size:22px}
}

/* ---- modal ---- */
.hmodal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:16px}.hmodal[hidden]{display:none}
.hmodal__backdrop{position:absolute;inset:0;background:rgba(24,24,25,.55);backdrop-filter:blur(2px)}
.hmodal__box{position:relative;background:#fff;border-radius:14px;width:min(680px,100%);max-height:calc(100vh - 32px);overflow:auto;padding:26px 28px;box-shadow:0 30px 80px rgba(0,0,0,.3);animation:hm-in .25s var(--h-ease)}@keyframes hm-in{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.hmodal__box{animation:none}}
.hmodal__x{position:absolute;top:10px;right:12px;background:none;border:0;font-size:28px;line-height:1;cursor:pointer;color:var(--h-muted)}.hmodal__x:hover{color:var(--h-black)}
.hmodal__title{font-size:24px;margin:0 0 4px;text-transform:uppercase;font-style:italic}.hmodal__sub{margin:0 0 14px;color:var(--h-muted);font-size:14px}
.hmodal__prod{display:flex;gap:12px;align-items:center;background:var(--h-cream);border-radius:8px;padding:10px 12px;margin:0 0 16px;font-size:14px}.hmodal__prod img{width:48px;height:48px;object-fit:contain;background:#fff;border-radius:6px}.hmodal__prod img[src=""]{display:none}
.hmodal__form label{display:block;font-weight:600;font-size:13px;color:var(--h-black);margin:0 0 12px}.hmodal__form label b{color:var(--h-red)}.hmodal__form label small{font-weight:400;color:var(--h-muted)}
.hmodal__form input,.hmodal__form select,.hmodal__form textarea{display:block;width:100%;margin-top:4px;padding:9px 10px;border:1px solid var(--h-line);border-radius:var(--h-radius);font:inherit;font-weight:400;font-size:14px}.hmodal__form input[type=file]{padding:7px;border-style:dashed;background:var(--h-surface-2)}
.hgrid2{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
.hmodal__actions{display:flex;justify-content:flex-end;gap:10px;margin-top:6px}.hmodal__msg{color:#B3261E;font-size:13.5px;margin:8px 0 0;min-height:1em}
.hmodal__thanks{text-align:center;padding:20px 0}.hmodal__thanks h3{font-size:22px}
@media (max-width:560px){.hgrid2{grid-template-columns:1fr}.hmodal__box{padding:20px 16px}}
.cf-turnstile{margin:8px 0 12px}
/* ---- filter bar (top, D&H-style pills + dropdown panels) ---- */
.cat-layout{display:block}
.fbar{position:sticky;top:132px;z-index:40;display:flex;align-items:center;gap:12px;background:#fff;padding:12px 0 10px;margin:0 0 8px;border-bottom:1px solid var(--h-line-2)}
.fbar__scroll{display:flex;gap:8px;align-items:center;flex:1;min-width:0;overflow-x:auto;scrollbar-width:none;padding:2px}.fbar__scroll::-webkit-scrollbar{display:none}
.fpill{position:relative;flex:0 0 auto}
.fpill__btn{display:inline-flex;align-items:center;gap:6px;border:1.5px solid var(--h-line);background:#fff;border-radius:50px;padding:8px 14px;font:inherit;font-size:13.5px;font-weight:600;color:var(--h-black);cursor:pointer;white-space:nowrap;transition:all .15s}
.fpill__btn:hover,.fpill.is-open .fpill__btn{border-color:var(--h-black)}.fpill.is-active .fpill__btn{border-color:var(--h-red);background:var(--h-red);color:#fff}
.fpill__btn .ic{width:13px;height:13px;opacity:.7;transition:transform .2s}.fpill.is-open .fpill__btn .ic{transform:rotate(180deg)}
.fpill__n{background:#fff;color:var(--h-red);border-radius:999px;font-size:11px;padding:0 6px;line-height:17px}
.fpanel{position:fixed;min-width:260px;max-width:min(360px,90vw);background:#fff;border:1px solid var(--h-line);border-radius:12px;box-shadow:0 18px 50px rgba(24,24,25,.16);padding:10px;z-index:45;animation:hm-in .18s var(--h-ease)}
.fpanel__search{width:100%;padding:8px 10px;border:1px solid var(--h-line);border-radius:8px;font:inherit;font-size:13.5px;margin:0 0 8px}
.fpanel__list{list-style:none;margin:0;padding:0;max-height:min(300px,50vh);overflow:auto}.fpanel__list label{display:flex;align-items:center;gap:10px;padding:7px 8px;border-radius:8px;cursor:pointer;font-size:14px;color:var(--h-text)}.fpanel__list label:hover{background:var(--h-cream);color:var(--h-black)}.fpanel__list input{accent-color:var(--h-red);width:17px;height:17px;margin:0;flex:0 0 auto}.fpanel__list small{margin-left:auto;color:var(--h-muted);font-size:12px}.fpanel__list li[hidden]{display:none}
.fpanel__foot{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:8px 4px 0;border-top:1px solid var(--h-line-2);margin-top:6px}.fpanel__clear{background:none;border:0;color:var(--h-muted);font:inherit;font-size:13px;cursor:pointer}.fpanel__clear:hover{color:var(--h-red)}.fpanel__done{padding:7px 16px;border-radius:50px;font-size:13px}
.fbar__clearall{flex:0 0 auto;font-size:13px;color:var(--h-red);text-decoration:none;font-weight:600;padding:0 6px}
.fbar__sort{flex:0 0 auto;margin-left:auto}.fbar__sort select{padding:8px 32px 8px 12px;border:1.5px solid var(--h-line);border-radius:50px;font:inherit;font-size:13.5px;font-weight:600;background:#fff}
.cat-tools{position:static;background:none;backdrop-filter:none;padding:4px 0;margin:0 0 12px}
.chips--active{margin:0 0 14px}.chip--x{background:var(--h-cream);border-color:var(--h-tan);font-size:12.5px;padding:4px 10px;cursor:pointer}
.cat-main.is-loading ul.products{opacity:.45;pointer-events:none;transition:opacity .2s}
.fbar-backdrop{position:fixed;inset:0;z-index:39;display:none}.fbar-backdrop.is-on{display:block}
@media (max-width:760px){.fbar{top:56px;flex-wrap:wrap}.fbar__sort{margin-left:0;flex-basis:100%}.fbar__sort select{width:100%}
  .fpanel{position:fixed;left:0;right:0;bottom:0;top:auto;max-width:none;border-radius:16px 16px 0 0;padding:14px 16px 18px;animation:sheet-in .25s var(--h-ease);max-height:75vh;display:flex;flex-direction:column}.fpanel__list{max-height:none;flex:1}
  .fbar-backdrop.is-on{background:rgba(24,24,25,.4)}}
@keyframes sheet-in{from{transform:translateY(30px);opacity:0}to{transform:none;opacity:1}}

/* ---- imprint configurator ---- */
.imprint{border:1px solid var(--h-line);border-radius:10px;padding:14px;margin:16px 0;background:#fff}
.imprint__head{display:flex;flex-direction:column;gap:2px;margin-bottom:8px}
.imprint__head label{font-weight:600;color:var(--h-ink);font-size:14px}
.imprint>select{width:100%;padding:9px 12px;border:1px solid var(--h-line);border-radius:var(--h-radius);background:#fff;font:inherit;font-size:14px}
.imprint__opts{margin-top:14px;display:flex;flex-direction:column;gap:14px;border-top:1px solid var(--h-line-2);padding-top:14px}
.imprint [hidden],.imprint__opts[hidden]{display:none}
.imprint__row{display:flex;flex-direction:column;gap:7px}
.imprint__lbl{font-size:12px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;color:var(--h-muted)}
.imprint__colors{display:flex;flex-direction:column;gap:7px}
.impcolor{display:flex;gap:8px;align-items:center}
.impcolor select{flex:1;padding:8px 10px;border:1px solid var(--h-line);border-radius:var(--h-radius);font:inherit;font-size:13.5px;background:#fff}
.impcolor input[type=text]{flex:1;padding:8px 10px;border:1px solid var(--h-line);border-radius:var(--h-radius);font:inherit;font-size:13.5px}
.impcolor__x{background:none;border:0;color:var(--h-muted);font-size:20px;line-height:1;cursor:pointer;padding:0 4px}
.impcolor__x:hover{color:var(--h-red)}
.impcolor__fee{font-size:11.5px;color:var(--h-red);white-space:nowrap;font-weight:600}
.imprint__add{align-self:flex-start;background:none;border:0;color:var(--h-red);font:inherit;font-size:13px;font-weight:600;cursor:pointer;padding:2px 0}
.imprint__add[disabled]{color:var(--h-muted);cursor:not-allowed}
.seg--sm button{padding:7px 12px;font-size:13px;border-radius:50px}
.imprint__area{font-size:12px;color:var(--h-muted);margin:0}
.imprint__lbl small{font-weight:400;text-transform:none;letter-spacing:0;color:var(--h-muted)}
.imprint__art{border-top:1px solid var(--h-line-2);padding-top:14px}
.imprint__art input[type=file]{width:100%;padding:9px;border:1.5px dashed var(--h-line);border-radius:var(--h-radius);background:var(--h-surface-2);font:inherit;font-size:13px}
.imprint__art .hint{font-size:11.5px;color:var(--h-muted)}
.imprint__art .hippo-artwork__list{margin:2px 0 0}
.artnote{border-top:1px dashed var(--h-line);margin-top:4px;padding-top:8px}
.artnote summary{cursor:pointer;font-size:12px;font-weight:600;color:var(--h-red);list-style:none;display:inline-flex;align-items:center;gap:5px}
.artnote summary::-webkit-details-marker{display:none}
.artnote summary:after{content:"+";font-size:14px;line-height:1}
.artnote[open] summary:after{content:"–"}
.artnote ul{margin:8px 0 0;padding-left:16px;font-size:11.5px;line-height:1.55;color:var(--h-muted)}
.artnote li{margin:3px 0}
.artnote p{font-size:11.5px;color:var(--h-muted);margin:8px 0 0}
.chk--sm{font-size:13.5px}
.imprint__quote{background:var(--h-cream);border-radius:8px;padding:10px 12px;font-size:13px;font-variant-numeric:tabular-nums}
.imprint__quote table{width:100%;border-collapse:collapse}
.imprint__quote td{padding:3px 0}
.imprint__quote td:last-child{text-align:right;font-weight:600;white-space:nowrap;padding-left:12px}
.imprint__quote td small{display:block;font-weight:400;color:var(--h-muted);font-size:11.5px;margin-top:1px}
.imprint__quote .sub{color:var(--h-muted);font-weight:400;font-size:11.5px}
.imprint__quote tr.tot td{border-top:1px solid var(--h-line);padding-top:7px;font-size:14px;font-weight:700;color:var(--h-black)}
.imprint__note b{color:var(--h-black);font-size:13px}
.linkbtn{background:none;border:0;padding:0;font:inherit;font-size:11.5px;color:var(--h-red);cursor:pointer;text-decoration:underline;text-decoration-style:dotted;text-underline-offset:2px}
.linkbtn:hover{text-decoration-style:solid}
.imprint__quote .sku{font-weight:600;color:var(--h-black)}
.imprint__quote .imprint__note{color:var(--h-muted);font-size:11.5px;padding-top:4px}
.imprint__warn{color:#B3261E;font-size:12.5px;margin-top:6px}
.imprint__fine{font-size:11.5px;line-height:1.45;color:var(--h-muted);margin:-4px 0 0}

/* ---- imprint colour swatches ---- */
.swatches{display:grid;grid-template-columns:repeat(auto-fill,minmax(58px,1fr));gap:10px}
.swatch{position:relative;display:flex;flex-direction:column;align-items:center;gap:5px;background:none;border:0;padding:0;cursor:pointer;font:inherit;-webkit-tap-highlight-color:transparent}
.swatch__chip{width:100%;aspect-ratio:1;border-radius:12px;border:1px solid rgba(24,24,25,.14);box-shadow:inset 0 -6px 12px rgba(0,0,0,.06);position:relative;transition:transform .16s var(--h-ease),box-shadow .16s var(--h-ease)}
.swatch:hover .swatch__chip{transform:translateY(-2px);box-shadow:inset 0 -6px 12px rgba(0,0,0,.06),0 6px 14px rgba(24,24,25,.16)}
.swatch__name{font-size:10.5px;line-height:1.25;color:var(--h-muted);text-align:center;letter-spacing:.01em}
.swatch[aria-pressed="true"] .swatch__chip{box-shadow:0 0 0 2px #fff inset,0 0 0 3px var(--h-red),inset 0 -6px 12px rgba(0,0,0,.06)}
.swatch[aria-pressed="true"] .swatch__name{color:var(--h-black);font-weight:600}
.swatch__tick{position:absolute;inset:0;display:none;align-items:center;justify-content:center;color:var(--tick,#fff);font-size:18px;font-weight:700;text-shadow:0 1px 3px rgba(0,0,0,.35)}
.swatch[aria-pressed="true"] .swatch__tick{display:flex}
.swatch__plus{position:absolute;top:-5px;right:-5px;background:var(--h-black);color:#fff;font-size:9px;font-weight:700;letter-spacing:.02em;padding:2px 5px;border-radius:999px;line-height:1.2}
.swatch--full .swatch__chip{opacity:.35}.swatch--full{cursor:not-allowed}
.swatch--custom .swatch__chip{background:conic-gradient(from 210deg,#E4002B,#FFC72C,#009639,#0085CA,#753BBD,#E4002B);border-style:dashed}
.swatch:focus-visible{outline:2px solid var(--h-red);outline-offset:3px;border-radius:12px}
.picked{display:flex;flex-wrap:wrap;gap:8px;margin-top:4px}
.pchip{display:inline-flex;align-items:center;gap:7px;background:var(--h-surface-2);border:1px solid var(--h-line);border-radius:50px;padding:5px 10px 5px 6px;font-size:12.5px}
.pchip__dot{width:18px;height:18px;border-radius:50%;border:1px solid rgba(24,24,25,.16);flex:0 0 auto}
.pchip__x{background:none;border:0;color:var(--h-muted);cursor:pointer;font-size:16px;line-height:1;padding:0 2px}.pchip__x:hover{color:var(--h-red)}
.pchip input[type=text]{border:0;border-bottom:1px solid var(--h-line);background:none;font:inherit;font-size:12.5px;width:110px;padding:1px 2px}
.pchip input[type=text]:focus{outline:none;border-bottom-color:var(--h-red)}
.pchip__fee{color:var(--h-red);font-weight:600;font-size:11px}
@media (max-width:600px){.swatches{grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:8px}}
/* ================= imprinting page ================= */
.imp{padding-top:0}
.imp-hero{background:linear-gradient(180deg,var(--h-cream),#fff);border-bottom:1px solid var(--h-line-2)}
.imp-hero__in{padding:56px 15px 44px;max-width:900px}
.imp-hero h1{font-size:clamp(28px,4.2vw,44px);font-style:italic;text-transform:uppercase;margin:10px 0 14px;max-width:20ch}
.imp-hero__sub{font-size:17px;color:var(--h-text);max-width:62ch}
.imp-hero__cta{display:flex;gap:12px;margin:22px 0 0;flex-wrap:wrap}.imp-hero__cta .button{border-radius:50px;padding:12px 26px}
.imp-hero__chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;padding:0;margin:24px 0 0;font-size:13px;color:var(--h-text)}
.imp-hero__chips li{display:inline-flex;align-items:center;gap:7px}.imp-hero__chips .ic{width:16px;height:16px;color:var(--h-red)}
/* process rail */
.steps-rail{list-style:none;margin:0;padding:0;position:relative}
.steps-rail__line{position:absolute;left:19px;top:14px;bottom:14px;width:2px;background:var(--h-line)}
.steps-rail__line i{display:block;width:100%;height:0;background:var(--h-red);transition:height .18s linear}
.rstep{position:relative;display:grid;grid-template-columns:40px 1fr;gap:18px;padding:0 0 26px}
.rstep__num{width:40px;height:40px;border-radius:50%;background:#fff;border:2px solid var(--h-line);color:var(--h-muted);display:grid;place-items:center;font-family:var(--h-display);font-weight:800;font-size:16px;position:relative;z-index:1;transition:background .3s var(--h-ease),color .3s,border-color .3s,transform .3s var(--h-ease)}
.rstep.is-in .rstep__num{border-color:var(--h-red);color:var(--h-red)}
.rstep.is-live .rstep__num{background:var(--h-red);border-color:var(--h-red);color:#fff;transform:scale(1.06)}
.rstep__body h3{display:flex;align-items:center;gap:9px;font-size:17px;margin:7px 0 5px;font-family:var(--h-display);font-weight:800}
.rstep__body h3 .ic{width:18px;height:18px;color:var(--h-red);flex:0 0 auto}
.rstep__body p{color:var(--h-text);font-size:15px;max-width:70ch;margin:0}
/* rate card */
.ratecard th,.ratecard td{padding:12px 14px;border-bottom:1px solid var(--h-line-2)}
.ratecard thead th{background:var(--h-surface-2);font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;color:var(--h-muted)}
.ratecard td.n,.ratecard th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
.ratecard tbody tr:hover{background:var(--h-cream)}
.feecards{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:14px;padding:0;margin:18px 0 0}
.feecards li{background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:12px;padding:16px 18px}
.feecards b{display:block;font-family:var(--h-display);font-size:24px;font-weight:800;color:var(--h-black)}
.feecards li > span{font-size:13px;color:var(--h-text);display:block;margin-top:4px}
.imp-fine{font-size:12.5px;color:var(--h-muted);margin:14px 0 0;max-width:80ch}
/* estimator */
.est{background:var(--h-black);color:#fff;border-radius:16px;padding:22px 24px;display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}
.est__controls{display:flex;flex-direction:column;gap:12px}
.est__controls label{display:flex;flex-direction:column;gap:5px;font-size:11.5px;letter-spacing:.07em;text-transform:uppercase;color:#B9B3A8}
.est__controls input,.est__controls select{padding:10px 12px;border-radius:8px;border:1px solid #3A382F;background:#211F18;color:#fff;font:inherit;font-size:15px}
.est__controls input:focus-visible,.est__controls select:focus-visible{outline:2px solid var(--h-red);outline-offset:2px}
.est__out table{width:100%;font-size:14px;font-variant-numeric:tabular-nums}
.est__out td{padding:6px 0;border-bottom:1px dashed #37342B;color:#E6E2D8}
.est__out td:last-child{text-align:right;font-weight:600;color:#fff}
.est__out tr.tot td{border-bottom:0;padding-top:10px;font-size:17px;font-weight:700;color:#fff}
.est__out small{display:block;color:#9C968B;font-size:11.5px}
.est .imp-fine{grid-column:1/-1;color:#9C968B;margin:0}
/* inks */
.inks{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:16px;padding:0;margin:0}
.ink{display:flex;flex-direction:column;align-items:center;gap:7px}
.ink__chip{width:100%;aspect-ratio:1;border-radius:14px;border:1px solid rgba(24,24,25,.12);position:relative;box-shadow:inset 0 -8px 16px rgba(0,0,0,.07);transition:transform .2s var(--h-ease)}
.ink:hover .ink__chip{transform:translateY(-3px) scale(1.03)}
.ink__chip i{position:absolute;top:-6px;right:-6px;background:var(--h-black);color:#fff;font-size:9.5px;font-style:normal;font-weight:700;padding:2px 6px;border-radius:999px}
.ink__name{font-size:12px;color:var(--h-text);text-align:center;line-height:1.3}
.artlist{margin:0;padding-left:20px;color:var(--h-text);font-size:15px;max-width:80ch}.artlist li{margin:6px 0}
@media (max-width:760px){.est{grid-template-columns:1fr}.rstep{grid-template-columns:34px 1fr;gap:14px}.steps-rail__line{left:16px}.rstep__num{width:34px;height:34px;font-size:14px}}

/* imprint sample gallery */
.samples{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:18px;padding:0;margin:0}
.sample{background:#fff;border:1px solid var(--h-line-2);border-radius:14px;overflow:hidden;display:flex;flex-direction:column;transition:transform .3s var(--h-ease),box-shadow .3s var(--h-ease)}
.sample:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(24,24,25,.1)}
.sample__img{display:block;aspect-ratio:4/3;background:var(--h-surface-2);overflow:hidden}
.sample__img img{width:100%;height:100%;object-fit:cover;transition:transform .5s var(--h-ease)}
.sample:hover .sample__img img{transform:scale(1.05)}
.sample__cap{padding:11px 14px;font-size:12.5px;color:var(--h-text);border-top:1px solid var(--h-line-2);display:block;text-align:left}
.sample__btn{display:flex;flex-direction:column;width:100%;height:100%;padding:0;border:0;background:none;font:inherit;cursor:zoom-in;text-align:left}
.sample__btn:focus-visible{outline:2px solid var(--h-red);outline-offset:2px;border-radius:14px}
.sample__img{position:relative}
.sample__zoom{position:absolute;right:10px;bottom:10px;width:32px;height:32px;border-radius:50%;background:rgba(24,24,25,.62);color:#fff;display:grid;place-items:center;opacity:0;transform:translateY(4px);transition:opacity .25s var(--h-ease),transform .25s var(--h-ease);backdrop-filter:blur(2px)}
.sample__zoom .ic{width:16px;height:16px}
.sample:hover .sample__zoom,.sample__btn:focus-visible .sample__zoom{opacity:1;transform:none}
/* lightbox */
.lbx{position:fixed;inset:0;z-index:120;display:none}
.lbx.is-open{display:block}
.lbx__bd{position:absolute;inset:0;background:rgba(16,15,12,.92);backdrop-filter:blur(3px);animation:lbx-fade .2s var(--h-ease)}
@keyframes lbx-fade{from{opacity:0}to{opacity:1}}
.lbx__stage{position:relative;height:100%;display:grid;grid-template-rows:1fr auto;padding:56px 20px 20px}
.lbx__figure{display:grid;place-items:center;min-height:0}
.lbx__figure img{max-width:100%;max-height:100%;object-fit:contain;border-radius:10px;box-shadow:0 30px 80px rgba(0,0,0,.5);animation:lbx-in .28s var(--h-ease)}
@keyframes lbx-in{from{opacity:0;transform:scale(.97)}to{opacity:1;transform:none}}
.lbx__cap{color:#EDE9DF;text-align:center;font-size:14px;padding:14px 10px 0;display:flex;flex-direction:column;gap:4px}
.lbx__count{font-size:11.5px;letter-spacing:.12em;text-transform:uppercase;color:#9C968B}
.lbx__x,.lbx__nav{position:absolute;border:1px solid rgba(255,255,255,.22);background:rgba(255,255,255,.08);color:#fff;border-radius:50%;cursor:pointer;display:grid;place-items:center;transition:background .18s,border-color .18s}
.lbx__x:hover,.lbx__nav:hover{background:var(--h-red);border-color:var(--h-red)}
.lbx__x{top:14px;right:16px;width:42px;height:42px;font-size:22px;line-height:1}
.lbx__nav{top:50%;transform:translateY(-50%);width:46px;height:46px}
.lbx__nav .ic{width:20px;height:20px}
.lbx__nav--prev{left:16px}.lbx__nav--next{right:16px}
.lbx__x:focus-visible,.lbx__nav:focus-visible{outline:2px solid #fff;outline-offset:2px}
@media (max-width:600px){.lbx__stage{padding:52px 10px 14px}.lbx__nav{width:40px;height:40px}.lbx__nav--prev{left:6px}.lbx__nav--next{right:6px}}
@media (prefers-reduced-motion:reduce){.lbx__bd,.lbx__figure img{animation:none}}

/* ---------- product gallery: video tile in the thumb strip + overlay browse controls ---------- */
.gnav{position:absolute;inset:0;pointer-events:none;z-index:3}
.gnav__arrow{position:absolute;top:50%;transform:translateY(-50%);width:40px;height:40px;border-radius:50%;border:1px solid var(--h-line);background:rgba(255,255,255,.92);color:var(--h-ink);display:grid;place-items:center;cursor:pointer;pointer-events:auto;opacity:.6;box-shadow:0 3px 12px rgba(24,24,25,.14);transition:opacity .2s var(--h-ease),background .2s,color .2s,border-color .2s}
.gnav__arrow svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.gnav__arrow--prev{left:12px}.gnav__arrow--next{right:12px}
.gnav__arrow[hidden]{display:none}
.gnav__all{position:absolute;right:12px;bottom:12px;pointer-events:auto;display:inline-flex;align-items:center;gap:7px;padding:8px 13px;border-radius:999px;border:0;background:rgba(24,24,25,.7);color:#fff;font:600 11.5px/1 var(--h-font);letter-spacing:.04em;text-transform:uppercase;cursor:pointer;opacity:.92;transition:background .2s,opacity .2s}
.gnav__all svg{width:14px;height:14px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}
.pd__gallery:hover .gnav__arrow,.gnav__arrow:hover,.gnav__arrow:focus-visible{opacity:1}
.gnav__arrow:hover,.gnav__arrow:focus-visible{background:var(--h-red);color:#fff;border-color:var(--h-red)}
.gnav__all:hover,.gnav__all:focus-visible{background:var(--h-red);opacity:1}
/* the browse pill replaces the hover magnifier badge, and would otherwise sit on top of it */
.woocommerce-product-gallery.has-gnav.is-zoomable .woocommerce-product-gallery__image:after{content:none}
@media (hover:none){.gnav__arrow{opacity:1}}
@media (max-width:640px){.gnav__arrow{width:34px;height:34px}.gnav__arrow--prev{left:8px}.gnav__arrow--next{right:8px}.gnav__all{right:8px;bottom:8px;padding:7px 11px;font-size:10.5px}}

/* video slide inside the gallery */
.gvid{cursor:pointer;background:var(--h-black)}
.gvid img{width:100%;display:block;opacity:.72;transition:opacity .3s var(--h-ease)}
.gvid__blank{display:block;width:100%;padding-top:75%;background:var(--h-black)}
.gvid__btn{all:unset;display:block;position:relative;width:100%;cursor:pointer}
.gvid__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:70px;height:70px;border-radius:50%;background:rgba(196,12,64,.92);color:#fff;display:grid;place-items:center;box-shadow:0 8px 26px rgba(0,0,0,.35);transition:transform .25s var(--h-ease),background .2s}
.gvid__play svg{width:32px;height:32px;margin-left:3px}
.gvid:hover .gvid__play{transform:translate(-50%,-50%) scale(1.08)}
.gvid:hover img{opacity:.85}
.gvid__cap{position:absolute;left:0;right:0;bottom:0;padding:10px 0;text-align:center;background:linear-gradient(transparent,rgba(24,24,25,.8));color:#fff;font:600 11.5px/1 var(--h-font);letter-spacing:.05em;text-transform:uppercase}
.gvid.is-playing{cursor:default}
.gvid.is-playing .gvid__btn{display:none}
.gvid iframe{display:block;width:100%;aspect-ratio:16/9;border:0;background:var(--h-black)}
.woocommerce-product-gallery.is-vplaying .gnav__all{display:none}
.woocommerce-product-gallery.is-vplaying .gnav__arrow{opacity:.35}
.woocommerce-product-gallery.is-vplaying .gnav__arrow:hover{opacity:1}
/* video tile in the thumbnail strip */
.flex-control-thumbs>li.gthumb--video{position:relative}
.flex-control-thumbs>li.gthumb--video img{opacity:.45;background:var(--h-black)}
.flex-control-thumbs>li.gthumb--video img.flex-active,.flex-control-thumbs>li.gthumb--video:hover img{opacity:.7}
.gthumb__play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:26px;height:26px;border-radius:50%;background:rgba(196,12,64,.95);color:#fff;display:grid;place-items:center;pointer-events:none}
.gthumb__play svg{width:14px;height:14px;margin-left:1px}

/* ---------- custom displays ---------- */
.eyebrow{display:inline-block;background:var(--h-red);color:#fff;font-size:11.5px;font-weight:700;letter-spacing:.09em;text-transform:uppercase;padding:5px 12px;border-radius:3px;margin:0}
.cd-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--h-cream),#fff);border-bottom:1px solid var(--h-line-2)}
.cd-hero:before{content:"";position:absolute;inset:-40% -10% auto auto;width:620px;height:620px;border-radius:50%;background:radial-gradient(circle,rgba(196,12,64,.10),transparent 65%);pointer-events:none}
.cd-hero__in{position:relative;padding:56px 15px 44px;max-width:900px}
.cd-hero h1{font-size:clamp(28px,4.2vw,44px);font-style:italic;text-transform:uppercase;margin:12px 0 14px;max-width:19ch}
.cd-hero__sub{font-size:17px;color:var(--h-text);max-width:62ch}
.cd-hero__cta{display:flex;gap:12px;margin:22px 0 0;flex-wrap:wrap}
.cd-hero__cta .button{border-radius:50px;padding:12px 26px;display:inline-flex;align-items:center;gap:8px}
.cd-hero__cta .ic{width:17px;height:17px}
.cd-hero__chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;padding:0;margin:24px 0 0;font-size:13px;color:var(--h-text)}
.cd-hero__chips li{display:inline-flex;align-items:center;gap:7px}
.cd-hero__chips .ic{width:16px;height:16px;color:var(--h-red)}

/* concept → produced comparison */
.cmp{--pos:50%;aspect-ratio:var(--ar,16/9);position:relative;margin:0;border-radius:14px;overflow:hidden;border:1px solid var(--h-line);background:var(--h-cream);line-height:0;isolation:isolate}
.cmp img{width:100%;height:100%;object-fit:cover;display:block}
.cmp__over{position:absolute;inset:0;clip-path:inset(0 calc(100% - var(--pos)) 0 0);will-change:clip-path}
.cmp__lab{position:absolute;bottom:14px;z-index:3;font:700 11px/1 var(--h-font);letter-spacing:.1em;text-transform:uppercase;padding:7px 12px;border-radius:50px;transition:opacity .25s var(--h-ease)}
.cmp__lab--a{left:14px;background:rgba(24,24,25,.78);color:#fff}
.cmp__lab--b{right:14px;background:var(--h-red);color:#fff}
.cmp[data-pos="0"] .cmp__lab--a,.cmp[data-pos="1"] .cmp__lab--a,.cmp[data-pos="2"] .cmp__lab--a{opacity:0}
.cmp__bar{position:absolute;top:0;bottom:0;left:var(--pos);width:2px;background:#fff;box-shadow:0 0 0 1px rgba(24,24,25,.18);z-index:2;pointer-events:none}
.cmp__grip{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:48px;height:48px;border-radius:50%;background:#fff;color:var(--h-black);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 18px rgba(24,24,25,.28)}
.cmp__grip .ic{width:16px;height:16px;margin:0 -3px}
.cmp__range{position:absolute;inset:0;width:100%;height:100%;margin:0;padding:0;opacity:0;cursor:ew-resize;z-index:4;touch-action:pan-y;-webkit-appearance:none;appearance:none;background:transparent}
.cmp__range::-webkit-slider-thumb{-webkit-appearance:none;width:64px;height:100vh;cursor:ew-resize}
.cmp__range::-moz-range-thumb{width:64px;height:100vh;border:0;cursor:ew-resize}
.cmp__range:focus-visible{opacity:1;outline:none}
.cmp__range:focus-visible+.cmp__bar,.cmp:focus-within .cmp__bar{box-shadow:0 0 0 2px var(--h-red)}

/* what custom can mean */
.makes{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.make{background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:14px;padding:24px 22px;transition:transform .3s var(--h-ease),box-shadow .3s var(--h-ease),border-color .3s}
.make:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(24,24,25,.09);border-color:var(--h-line)}
.make__ic{display:grid;place-items:center;width:44px;height:44px;border-radius:12px;background:var(--h-red);color:#fff;margin-bottom:14px}
.make__ic .ic{width:22px;height:22px}
.make h3{margin:0 0 8px;font-size:16px;font-family:var(--h-display);letter-spacing:.01em}
.make p{margin:0;font-size:14px;color:var(--h-text);line-height:1.55}

/* FAQ accordion */
.qa{list-style:none;padding:0;margin:0;border-top:1px solid var(--h-line-2)}
.qa li{border-bottom:1px solid var(--h-line-2)}
.qa summary{cursor:pointer;list-style:none;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 2px;font:600 16px/1.4 var(--h-display);color:var(--h-ink)}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--h-red)}
.qa__chev{flex:0 0 auto;color:var(--h-red);transition:transform .3s var(--h-ease)}
.qa__chev .ic{width:20px;height:20px}
.qa details[open] .qa__chev{transform:rotate(180deg)}
.qa__a{padding:0 2px 18px;max-width:76ch}
.qa__a p{margin:0;color:var(--h-text);line-height:1.6}
.qa details[open] .qa__a{animation:qaIn .3s var(--h-ease) both}
@keyframes qaIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

.cta-band__acts{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.cta-band__alt{color:#fff;opacity:.8;font-size:14px;white-space:nowrap}
.cta-band__alt:hover{opacity:1;color:#fff;text-decoration:underline}

@media (max-width:980px){.makes{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.makes{grid-template-columns:1fr}.cmp{aspect-ratio:4/3}.cmp__grip{width:40px;height:40px}.cmp__lab{font-size:10px;padding:6px 10px;bottom:10px}.cmp__lab--a{left:10px}.cmp__lab--b{right:10px}}

/* ---------- about us ---------- */
.ab-hero{position:relative;overflow:hidden;background:linear-gradient(180deg,var(--h-cream),#fff);border-bottom:1px solid var(--h-line-2)}
.ab-hero:before{content:"";position:absolute;inset:auto auto -60% -12%;width:680px;height:680px;border-radius:50%;background:radial-gradient(circle,rgba(196,12,64,.09),transparent 65%);pointer-events:none}
.ab-hero__in{position:relative;padding:56px 15px 44px;max-width:900px}
.ab-hero h1{font-size:clamp(30px,4.6vw,50px);font-style:italic;text-transform:uppercase;margin:12px 0 14px;max-width:16ch}
.ab-hero__sub{font-size:17px;color:var(--h-text);max-width:64ch}
.ab-hero__cta{display:flex;gap:12px;margin:22px 0 0;flex-wrap:wrap}
.ab-hero__cta .button{border-radius:50px;padding:12px 26px;display:inline-flex;align-items:center;gap:8px}
.ab-hero__cta .ic{width:17px;height:17px}
.ab-hero__chips{list-style:none;display:flex;flex-wrap:wrap;gap:8px 18px;padding:0;margin:24px 0 0;font-size:13px;color:var(--h-text)}
.ab-hero__chips li{display:inline-flex;align-items:center;gap:7px}
.ab-hero__chips .ic{width:16px;height:16px;color:var(--h-red)}

/* story rail — years instead of step numbers */
.steps-rail--story .rstep{grid-template-columns:96px 1fr}
.steps-rail--story .steps-rail__line{left:47px}
.steps-rail--story .rstep__num{width:96px;height:34px;border-radius:50px;font-size:13px;letter-spacing:.04em;text-transform:uppercase}
.steps-rail--story .rstep__body h3{font-size:19px;margin-top:4px}
@media (max-width:760px){.steps-rail--story .rstep{grid-template-columns:84px 1fr;gap:12px}.steps-rail--story .steps-rail__line{left:41px}.steps-rail--story .rstep__num{width:84px;height:30px;font-size:12px}}

/* team — mixed-aspect photos in a masonry, names are printed on the pictures */
.team{list-style:none;padding:0;margin:0;columns:4;column-gap:16px}
.tcard{break-inside:avoid;margin:0 0 16px;border-radius:14px;overflow:hidden;border:1px solid var(--h-line-2);background:var(--h-surface-2);transition:transform .3s var(--h-ease),box-shadow .3s var(--h-ease)}
.tcard img{width:100%;height:auto;display:block}
.tcard:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(24,24,25,.12)}

/* capabilities — expandable cards */
.caps{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;align-items:start}
.cap{background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:14px;transition:border-color .25s,box-shadow .25s var(--h-ease)}
.cap:hover,.cap[open]{border-color:var(--h-line);box-shadow:0 10px 26px rgba(24,24,25,.07)}
.cap summary{cursor:pointer;list-style:none;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;padding:20px}
.cap summary::-webkit-details-marker{display:none}
.cap__ic{display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:var(--h-red);color:#fff}
.cap__ic .ic{width:21px;height:21px}
.cap__t{display:block;min-width:0}
.cap__t b{display:block;font-family:var(--h-display);font-size:16px;color:var(--h-ink);line-height:1.25}
.cap__t i{display:block;font-style:normal;font-size:12.5px;color:var(--h-muted);margin-top:3px}
.cap__chev{color:var(--h-red);transition:transform .3s var(--h-ease)}
.cap__chev .ic{width:20px;height:20px}
.cap[open] .cap__chev{transform:rotate(180deg)}
.cap p{margin:0;padding:0 20px 20px;font-size:14px;line-height:1.6;color:var(--h-text)}
.cap[open] p{animation:qaIn .3s var(--h-ease) both}

/* visit */
.visit{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.visit li{background:var(--h-cream);border-radius:14px;padding:22px}
.visit__k{display:block;font:700 11px/1 var(--h-font);letter-spacing:.1em;text-transform:uppercase;color:var(--h-red);margin-bottom:10px}
.visit__v{display:block;font-size:15px;color:var(--h-ink);line-height:1.5}

@media (max-width:1100px){.team{columns:3}}
@media (max-width:980px){.caps{grid-template-columns:1fr 1fr}.visit{grid-template-columns:1fr 1fr}}
@media (max-width:640px){.team{columns:2;column-gap:12px}.tcard{margin-bottom:12px}.caps{grid-template-columns:1fr}.visit{grid-template-columns:1fr}}


/* ---------- motion layer ---------- */
/* drifting gradient field behind hero sections */
.mesh{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:0}
.mesh i{position:absolute;display:block;border-radius:50%;opacity:.72;will-change:transform}
.mesh i:nth-child(1){width:52vw;height:52vw;left:-8vw;top:-18vw;background:radial-gradient(circle,rgba(196,12,64,.26),transparent 62%);animation:drift1 26s var(--h-ease) infinite alternate}
.mesh i:nth-child(2){width:46vw;height:46vw;right:-10vw;top:-14vw;background:radial-gradient(circle,rgba(243,231,195,.85),transparent 64%);animation:drift2 32s var(--h-ease) infinite alternate}
.mesh i:nth-child(3){width:40vw;height:40vw;left:34vw;bottom:-24vw;background:radial-gradient(circle,rgba(24,24,25,.10),transparent 66%);animation:drift3 38s var(--h-ease) infinite alternate}
@keyframes drift1{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(7vw,4vw,0) scale(1.14)}}
@keyframes drift2{from{transform:translate3d(0,0,0) scale(1.06)}to{transform:translate3d(-6vw,6vw,0) scale(.94)}}
@keyframes drift3{from{transform:translate3d(0,0,0) scale(.96)}to{transform:translate3d(-8vw,-5vw,0) scale(1.12)}}
.ab-hero__in,.cd-hero__in,.imp-hero__in{position:relative;z-index:1}

/* cursor-tracking highlight on cards */
[data-spot] > *{position:relative}
[data-spot] > *::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:0;transition:opacity .35s var(--h-ease);
  background:radial-gradient(340px circle at var(--mx,50%) var(--my,50%),rgba(196,12,64,.10),transparent 62%)}
[data-spot] > *:hover::before{opacity:1}

[data-magnetic]{transition:transform .3s var(--h-ease),background .2s,color .2s,border-color .2s}

/* scroll-linked story */
.story{position:relative;padding:8px 0 4px}
.story__grid{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:56px;align-items:start}
.story__side{position:sticky;top:120px}
.story__stack{position:relative;height:300px}
.story__card{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:30px 32px;border-radius:18px;background:var(--h-black);color:#fff;opacity:0;transform:translateY(14px) scale(.97);transition:opacity .5s var(--h-ease),transform .5s var(--h-ease);pointer-events:none;overflow:hidden}
.story__card:after{content:"";position:absolute;right:-30%;top:-40%;width:80%;height:160%;background:radial-gradient(circle,rgba(196,12,64,.55),transparent 62%);pointer-events:none}
.story__card.is-live{opacity:1;transform:none}
.story__k{position:relative;font-family:var(--h-display);font-weight:900;font-size:clamp(44px,6vw,74px);line-height:.95;letter-spacing:-.02em}
.story__l{position:relative;margin:12px 0 0;font-size:14.5px;line-height:1.5;color:rgba(255,255,255,.78);max-width:34ch}
.story__beats{list-style:none;margin:0;padding:0 0 0 30px;position:relative}
.story__beats:before{content:"";position:absolute;left:0;top:10px;bottom:10px;width:2px;background:var(--h-line)}
.story__fill{position:absolute;left:0;top:10px;width:2px;background:var(--h-red);height:0;transition:height .18s linear}
.beat{position:relative;padding:0 0 44px}
.beat:last-child{padding-bottom:6px}
.beat:before{content:"";position:absolute;left:-35px;top:9px;width:12px;height:12px;border-radius:50%;background:#fff;border:2px solid var(--h-line);transition:border-color .3s,background .3s,transform .3s var(--h-ease)}
.beat.is-live:before{background:var(--h-red);border-color:var(--h-red);transform:scale(1.35)}
.beat h3{margin:0 0 8px;font-family:var(--h-display);font-size:21px;font-weight:800}
.beat p{margin:0;color:var(--h-text);font-size:15.5px;line-height:1.65;max-width:62ch}
.hippo-js .beat{opacity:.45;transform:translateY(10px);transition:opacity .5s var(--h-ease),transform .5s var(--h-ease)}
.hippo-js .beat.is-in{opacity:.62;transform:none}
.hippo-js .beat.is-live{opacity:1}

@media (max-width:980px){.story__grid{grid-template-columns:1fr;gap:26px}.story__side{position:static}.story__stack{height:210px}}
@media (prefers-reduced-motion:reduce){
  .mesh i{animation:none}
  [data-spot] > *::before{display:none}
  .story__card{transition:none}
  .hippo-js .beat{opacity:1;transform:none;transition:none}
}

/* ---------- contact ---------- */
.ctiles{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.ctile{display:flex;flex-direction:column;gap:4px;height:100%;background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:14px;padding:22px;text-decoration:none;transition:transform .3s var(--h-ease),box-shadow .3s var(--h-ease),border-color .25s}
.ctile:hover{transform:translateY(-4px);box-shadow:0 14px 34px rgba(24,24,25,.09);border-color:var(--h-line)}
.ctile__ic{display:grid;place-items:center;width:40px;height:40px;border-radius:11px;background:var(--h-red);color:#fff;margin-bottom:10px}
.ctile__ic .ic{width:20px;height:20px}
.ctile__k{font:700 10.5px/1 var(--h-font);letter-spacing:.1em;text-transform:uppercase;color:var(--h-muted)}
.ctile__v{font-family:var(--h-display);font-weight:800;font-size:17px;color:var(--h-ink);word-break:break-word}
.ctile__n{font-size:13px;color:var(--h-text);line-height:1.5;margin-top:2px}

.note{border-radius:12px;padding:16px 18px;margin:0 0 22px;font-size:15px;border:1px solid}
.note--ok{background:#EEF6F1;border-color:#9CC7B0;color:#1F4D36}
.note--bad{background:#FCEEF0;border-color:#E1A7B2;color:#7A1F2E}
.note a{color:inherit;text-decoration:underline}

.cwrap{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:34px;align-items:start}
.cform label{display:block;font-weight:600;font-size:13.5px;color:var(--h-ink);margin:0 0 16px}
.cform label span{color:var(--h-red);margin-left:2px}
.cform input,.cform textarea,.cform select{display:block;width:100%;margin-top:6px;padding:11px 13px;border:1px solid var(--h-line);border-radius:10px;background:#fff;font:inherit;font-weight:400;font-size:15px;color:var(--h-ink);transition:border-color .2s,box-shadow .2s}
.cform textarea{resize:vertical;min-height:150px}
.cform input:focus,.cform textarea:focus,.cform select:focus{outline:none;border-color:var(--h-red);box-shadow:0 0 0 3px rgba(196,12,64,.12)}
.cform__row{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.cform .button{border-radius:50px;padding:13px 30px}
.cform__fine{margin:14px 0 0;font-size:12.5px;color:var(--h-muted)}
.cside{display:flex;flex-direction:column;gap:14px}
.cside__box{background:var(--h-cream);border-radius:14px;padding:22px}
.cside__box--plain{background:none;border:1px solid var(--h-line-2)}
.cside__box h3{margin:0 0 10px;font-family:var(--h-display);font-size:15px;font-weight:800}
.cside__box p{margin:0;font-size:14px;line-height:1.6;color:var(--h-text)}
.cside__box code{font-size:12.5px;background:rgba(24,24,25,.06);padding:2px 5px;border-radius:4px}
.cside__box ol{margin:0;padding-left:18px;font-size:14px;line-height:1.65;color:var(--h-text)}
.cside__box ol li{margin-bottom:7px}
.cside__links{list-style:none;margin:0;padding:0;font-size:14px;line-height:1.6}
.cside__links li{padding:7px 0;border-bottom:1px solid var(--h-line-2);color:var(--h-muted)}
.cside__links li:last-child{border-bottom:0}
.cside__links a{font-weight:600}
@media (max-width:980px){.ctiles{grid-template-columns:1fr 1fr}.cwrap{grid-template-columns:1fr;gap:26px}}
@media (max-width:560px){.ctiles{grid-template-columns:1fr}.cform__row{grid-template-columns:1fr}}

/* ---------- FAQ / policy pages ---------- */
.ab-hero--tight .ab-hero__in{padding:42px 15px 34px}
.ab-hero--tight h1{font-size:clamp(28px,4vw,40px);max-width:20ch}
.ab-hero__sub a{font-weight:600}
.fq-bar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin:0 0 14px}
.fq-search{position:relative;display:flex;align-items:center;flex:1;min-width:240px}
.fq-search .ic{position:absolute;left:14px;width:18px;height:18px;color:var(--h-muted);pointer-events:none}
.fq-search input{width:100%;padding:12px 14px 12px 42px;border:1px solid var(--h-line);border-radius:50px;background:#fff;font:inherit;font-size:15px;color:var(--h-ink);transition:border-color .2s,box-shadow .2s}
.fq-search input:focus{outline:none;border-color:var(--h-red);box-shadow:0 0 0 3px rgba(196,12,64,.12)}
.fq-pills{display:flex;gap:8px;flex-wrap:wrap}
.fq-pills button{font:600 13px/1 var(--h-font);color:var(--h-ink);background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:50px;padding:9px 15px;cursor:pointer;transition:border-color .18s,background .18s,color .18s}
.fq-pills button:hover{border-color:var(--h-red)}
.fq-pills button[aria-pressed="true"]{background:var(--h-red);border-color:var(--h-red);color:#fff}
.fq-count{margin:0 0 18px;font-size:13px;color:var(--h-muted);min-height:1em}
.fq-group{margin:0 0 26px}
.fq-group[hidden]{display:none}
.fq-group__h{font:800 15px/1 var(--h-display);letter-spacing:.06em;text-transform:uppercase;color:var(--h-red);margin:0 0 6px}
.qa li[hidden]{display:none}
.fq-empty{padding:26px 0;color:var(--h-muted)}

.prose{max-width:74ch}
.prose p{color:var(--h-text);font-size:16px;line-height:1.7;margin:0 0 14px}
.prose__aside{background:var(--h-cream);border-radius:12px;padding:16px 18px;font-size:15px}
.policy{list-style:none;padding:0;margin:0 0 22px;max-width:80ch}
.policy li{position:relative;padding:12px 0 12px 30px;border-bottom:1px solid var(--h-line-2);color:var(--h-text);line-height:1.6}
.policy li:before{content:"";position:absolute;left:6px;top:20px;width:7px;height:7px;border-radius:50%;background:var(--h-red)}
.policy li:last-child{border-bottom:0}
.callout{background:var(--h-black);color:#fff;border-radius:14px;padding:24px 26px;max-width:80ch}
.callout__k{display:flex;align-items:center;gap:9px;font-family:var(--h-display);font-weight:800;font-size:16px;margin-bottom:8px}
.callout__k .ic{width:19px;height:19px;color:var(--h-red)}
.callout p{margin:0;color:rgba(255,255,255,.82);font-size:15px;line-height:1.65}
.callout a{color:#fff;text-decoration:underline}
.ctile--static{cursor:default}
.ctile--static:hover{transform:none;box-shadow:none;border-color:var(--h-line-2)}

.tc-grid{display:grid;grid-template-columns:minmax(0,240px) minmax(0,1fr);gap:44px;align-items:start}
.tc-toc{position:sticky;top:110px}
.tc-toc__k{margin:0 0 10px;font:700 10.5px/1 var(--h-font);letter-spacing:.12em;text-transform:uppercase;color:var(--h-muted)}
.tc-toc ol{margin:0;padding:0;list-style:none;counter-reset:toc}
.tc-toc li{counter-increment:toc;border-left:2px solid var(--h-line-2)}
.tc-toc a{display:block;padding:8px 0 8px 14px;font-size:14px;color:var(--h-text);text-decoration:none}
.tc-toc a:hover{color:var(--h-red)}
.clause{padding:0 0 26px}
.clause h2{display:flex;align-items:center;gap:12px;margin:0 0 8px;font:800 19px/1.25 var(--h-display)}
.clause__n{display:grid;place-items:center;width:28px;height:28px;flex:0 0 auto;border-radius:50%;background:var(--h-cream);color:var(--h-red);font-size:13px;font-weight:800}
.clause p{margin:0;color:var(--h-text);font-size:16px;line-height:1.7;max-width:74ch}
.tc-fine{margin:8px 0 0;padding-top:20px;border-top:1px solid var(--h-line-2);font-size:14px;color:var(--h-muted)}
@media (max-width:860px){.tc-grid{grid-template-columns:1fr;gap:24px}.tc-toc{position:static}}

/* ---------- my account ---------- */
.woocommerce-account .woocommerce{display:grid;grid-template-columns:minmax(0,250px) minmax(0,1fr);gap:36px;align-items:start;max-width:var(--h-max);margin:34px auto 60px;padding:0 15px}
.woocommerce-account .woocommerce:has(.acct-gate){display:block}
.acct-nav__who{display:flex;align-items:center;gap:12px;padding:0 0 16px;margin:0 0 12px;border-bottom:1px solid var(--h-line-2)}
.acct-nav__avatar{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border-radius:50%;background:var(--h-red);color:#fff;font-family:var(--h-display);font-weight:800;font-size:17px}
.acct-nav__name{display:flex;flex-direction:column;min-width:0;font-weight:600;font-size:14.5px;color:var(--h-ink)}
.acct-nav__name small{font-weight:400;font-size:12.5px;color:var(--h-muted);overflow:hidden;text-overflow:ellipsis}
.acct-nav ul{list-style:none;margin:0;padding:0}
.acct-nav li a{display:block;padding:11px 14px;border-radius:10px;font-size:14.5px;font-weight:500;color:var(--h-text);text-decoration:none;transition:background .18s,color .18s}
.acct-nav li a:hover{background:var(--h-surface-2);color:var(--h-ink)}
.acct-nav li.is-active a,.acct-nav li.woocommerce-MyAccount-navigation-link--dashboard.is-active a{background:var(--h-red);color:#fff}
.acct-dash__hi{margin:0 0 6px;font-family:var(--h-display);font-size:26px;font-weight:800;font-style:italic;text-transform:uppercase}
.acct-dash__sub{margin:0 0 24px;color:var(--h-muted)}
.acct-stats{list-style:none;display:flex;flex-wrap:wrap;gap:12px;padding:0;margin:0 0 28px}
.acct-stats li{flex:1 1 150px;background:var(--h-cream);border-radius:12px;padding:16px 18px}
.acct-stats b{display:block;font-family:var(--h-display);font-size:26px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.acct-stats span{font-size:12.5px;color:var(--h-text)}
.acct-h3{margin:0 0 10px;font-family:var(--h-display);font-size:15px;font-weight:800;letter-spacing:.05em;text-transform:uppercase;color:var(--h-muted)}
.acct-recent{list-style:none;padding:0;margin:0 0 28px;border-top:1px solid var(--h-line-2)}
.acct-recent li{display:flex;align-items:center;gap:14px;flex-wrap:wrap;padding:14px 2px;border-bottom:1px solid var(--h-line-2)}
.acct-recent__n{font-family:var(--h-display);font-weight:800;font-size:15px}
.acct-recent__d{font-size:13px;color:var(--h-muted)}
.acct-recent__s{font-size:11.5px;font-weight:700;letter-spacing:.05em;text-transform:uppercase;padding:5px 10px;border-radius:50px;background:var(--h-surface-2);color:var(--h-text)}
.acct-recent__s.status-quote-requested{background:#FBF1DF;color:#8A5300}
.acct-recent__s.status-quoted{background:#EAF0F6;color:#2C4C74}
.acct-recent__s.status-quote-won,.acct-recent__s.status-completed{background:#EAF3ED;color:#2E6A4F}
.acct-recent__t{margin-left:auto;font-weight:600}
.acct-recent__a{font-size:14px;font-weight:600}
.acct-empty{background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:14px;padding:26px;margin:0 0 28px}
.acct-empty p{margin:0 0 16px;color:var(--h-text);max-width:60ch}
.acct-empty .button{border-radius:50px}
.acct-links{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,1fr);gap:8px 20px}
.acct-links a{display:block;padding:10px 0;font-size:14.5px;font-weight:600;border-bottom:1px solid var(--h-line-2)}

/* signed-out gate */
.acct-gate{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start;max-width:960px;margin:0 auto}
.acct-gate__full{grid-column:1/-1}
.acct-gate__col h2{margin:0 0 14px;font-family:var(--h-display);font-size:21px;font-weight:800}
.acct-gate__col--alt{background:var(--h-cream);border-radius:16px;padding:26px}
.acct-gate__lede{margin:0 0 18px;font-size:14.5px;color:var(--h-text);line-height:1.6}
.acct-gate__row{display:flex;align-items:center;justify-content:space-between;gap:14px;flex-wrap:wrap;margin:0 0 16px}
.cform label.acct-gate__check{display:flex;align-items:center;gap:8px;font-size:13.5px;font-weight:500;margin:0}
.cform label.acct-gate__check input{width:auto;margin:0;flex:0 0 auto}
.acct-gate__lost{font-size:13.5px}
.acct-gate__fine{margin:14px 0 0;font-size:12.5px;color:var(--h-muted)}
.acct-content .woocommerce-Message,.acct-content .woocommerce-error{border-radius:12px}
@media (max-width:900px){.woocommerce-account .woocommerce{grid-template-columns:1fr;gap:24px}.acct-gate{grid-template-columns:1fr}.acct-links{grid-template-columns:1fr}}

/* ---------- company account ---------- */
.acct-co__box{background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:14px;padding:22px 24px;margin:0 0 16px}
.acct-co__status{margin:0 0 10px;font-weight:600;font-size:15px}
.acct-co__status--ok{color:#2E6A4F}
.acct-co__status--warn{color:#8A5300}
.acct-co__status--bad{color:#A80F33}
.acct-co__status--muted{color:var(--h-muted)}
.acct-co__lede{margin:0 0 14px;font-size:14px;color:var(--h-text);line-height:1.6;max-width:66ch}
.acct-co__view{font-weight:600;font-size:14px}
.acct-co__up{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.acct-co__up input[type=file]{font:inherit;font-size:13.5px;max-width:100%}
.acct-co__up .button{border-radius:50px;white-space:nowrap}
.acct-co__fine{margin:12px 0 0;font-size:12.5px;color:var(--h-muted)}
.acct-people{list-style:none;margin:0 0 4px;padding:0}
.acct-people li{display:flex;align-items:center;gap:12px;padding:11px 0;border-bottom:1px solid var(--h-line-2)}
.acct-people li:last-child{border-bottom:0}
.acct-people__av{display:grid;place-items:center;width:34px;height:34px;flex:0 0 auto;border-radius:50%;background:var(--h-black);color:#fff;font-family:var(--h-display);font-weight:800;font-size:14px}
.acct-people__n{display:flex;flex-direction:column;min-width:0;font-weight:600;font-size:14.5px}
.acct-people__n small{font-weight:400;font-size:12.5px;color:var(--h-muted)}
.acct-people__r,.acct-people__you{margin-left:auto;font:700 10.5px/1 var(--h-font);letter-spacing:.07em;text-transform:uppercase;padding:5px 9px;border-radius:50px}
.acct-people__r{background:var(--h-cream);color:var(--h-red)}
.acct-people__you{background:var(--h-black);color:#fff;margin-left:8px}
.acct-co__box--flat{background:none;border:1px solid var(--h-line-2)}
.acct-recent--full li{flex-wrap:wrap}
.acct-recent__by{font-size:12.5px;color:var(--h-muted);background:var(--h-surface-2);padding:4px 9px;border-radius:50px}

/* ---------- order documents & proofs ---------- */
.docs{list-style:none;padding:0;margin:0}
.doc{background:var(--h-surface-2);border:1px solid var(--h-line-2);border-radius:14px;padding:18px 20px;margin:0 0 12px}
.doc--proof{background:var(--h-cream);border-color:var(--h-line)}
.doc__head{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap}
.doc__kind{font:700 10.5px/1 var(--h-font);letter-spacing:.09em;text-transform:uppercase;color:#fff;background:var(--h-red);padding:5px 9px;border-radius:50px}
.doc--confirmation .doc__kind,.doc--invoice .doc__kind{background:var(--h-black)}
.doc__name{font-family:var(--h-display);font-weight:800;font-size:16px;flex:1;min-width:160px}
.doc__date{font-size:12.5px;color:var(--h-muted)}
.doc__state{margin:10px 0 0;font-size:14px;color:var(--h-text)}
.doc__state--ok{color:#2E6A4F;font-weight:600}
.doc__state--wait{color:#8A5300;font-weight:600}
.doc__note{margin:8px 0 0;padding:10px 14px;border-left:3px solid var(--h-red);background:#fff;border-radius:0 8px 8px 0;font-size:14px;color:var(--h-text)}
.doc__form{margin:14px 0 0;display:flex;flex-direction:column;gap:10px;align-items:flex-start}
.doc__form .button{border-radius:50px}
.doc__changes{width:100%}
.doc__changes summary{cursor:pointer;font-size:13.5px;color:var(--h-muted);padding:4px 0}
.doc__changes summary:hover{color:var(--h-red)}
.doc__changes textarea{display:block;width:100%;max-width:52ch;margin:8px 0;padding:11px 13px;border:1px solid var(--h-line);border-radius:10px;font:inherit;font-size:14.5px}
.doc__changes textarea:focus{outline:none;border-color:var(--h-red);box-shadow:0 0 0 3px rgba(196,12,64,.12)}
.doc__meta{display:flex;flex-wrap:wrap;gap:8px 22px;margin:10px 0 0;font-size:13.5px;color:var(--h-text)}
.doc__meta span{display:inline-flex;gap:6px}
.doc__meta strong{color:var(--h-ink)}
.doc__pay{margin:12px 0 0;padding:14px 16px;border-radius:10px;background:#fff;border:1px solid var(--h-red);font-size:14.5px;line-height:1.6;color:var(--h-text)}
.doc__pay strong{color:var(--h-ink);display:block;margin-bottom:4px}

/* Sage order header — the facts a customer checks first, above the line items */
.hippo-sage-head{list-style:none;margin:0 0 1.25rem;padding:1rem 1.25rem;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.85rem 1.5rem;
  background:var(--h-surface-2,#f7f8f9);border:1px solid var(--h-line-2);border-radius:10px}
.hippo-sage-head li{display:flex;flex-direction:column;gap:.15rem;margin:0}
.hippo-sage-head span{font-size:.75rem;letter-spacing:.04em;text-transform:uppercase;color:var(--h-muted,#6b7280)}
.hippo-sage-head strong{font-size:.975rem;font-weight:600;color:var(--h-ink,#111)}
.hippo-attn{color:var(--h-muted,#6b7280)}

/* ---- Sage order page: make the detail read like a confirmation, not a form dump ---- */

/* WooCommerce stacks item meta as a bulleted list with <p> inside each <li>, which turns
   two short facts into six lines. Lay them out inline under the product name instead. */
.woocommerce-table--order-details .wc-item-meta{
  list-style:none;margin:.3rem 0 0;padding:0;
  display:flex;flex-wrap:wrap;gap:.1rem 1.5rem;
  font-size:.875rem;color:var(--h-muted,#6b7280)}
.woocommerce-table--order-details .wc-item-meta li{display:flex;gap:.4rem;margin:0;padding:0}
.woocommerce-table--order-details .wc-item-meta li::before{content:none}
.woocommerce-table--order-details .wc-item-meta strong,
.woocommerce-table--order-details .wc-item-meta .wc-item-meta-label{
  font-weight:500;color:var(--h-muted,#6b7280)}
.woocommerce-table--order-details .wc-item-meta p{display:inline;margin:0;color:var(--h-ink,#111)}

/* The product name carries the weight; quantity sits with it rather than floating. */
.woocommerce-table--order-details .product-name{line-height:1.45}
.woocommerce-table--order-details .product-name .product-quantity{
  font-weight:600;color:var(--h-ink,#111)}
.woocommerce-table--order-details td,
.woocommerce-table--order-details th{vertical-align:top;padding:.85rem 0}
.woocommerce-table--order-details tfoot td,
.woocommerce-table--order-details tfoot th{padding:.6rem 0}
.woocommerce-table--order-details tfoot tr:last-child th,
.woocommerce-table--order-details tfoot tr:last-child td{
  font-size:1.05rem;font-weight:700;border-top:2px solid var(--h-line-2)}

/* Woo's <mark> is a highlighter by default — it is emphasis here, not a highlight. */
.woocommerce mark, .woocommerce-MyAccount-content mark{
  background:transparent;color:inherit;font-weight:600;padding:0}

/* Addresses sit closer together and stop mid-column when there is little to show. */
.woocommerce-customer-details address{
  font-style:normal;line-height:1.55;border:0;padding:0;margin:0}
.woocommerce-customer-details .woocommerce-column__title{margin-bottom:.4rem}

/* The order header should never fall to a single column — six stacked rows pushes the
   actual order detail below the fold on a laptop or a half-width window. */
.hippo-sage-head{grid-template-columns:repeat(auto-fit,minmax(clamp(120px,30%,180px),1fr))}
@media (max-width:640px){
  .hippo-sage-head{grid-template-columns:1fr 1fr;gap:.75rem 1rem;padding:.9rem 1rem}
  .hippo-sage-head strong{font-size:.925rem}
}

/* Belt and braces on the item meta: WooCommerce wraps each value in its own <p>, and a
   stray block rule anywhere would put the label and the value on separate lines. */
.woocommerce-table--order-details td.product-name .wc-item-meta,
.woocommerce-table--order-details td.product-name .wc-item-meta li{display:flex}
.woocommerce-table--order-details td.product-name .wc-item-meta li > p,
.woocommerce-table--order-details td.product-name .wc-item-meta li > strong{
  display:inline-block;margin:0}

/* ---- account dashboard: what needs you, then the numbers ---- */
.acct-todo{margin:1.5rem 0;padding:1rem 1.25rem;border-radius:10px;
  background:var(--h-accent-soft,#fdf3f4);border:1px solid var(--h-accent,#b3123a)}
.acct-todo h3{margin:0 0 .6rem;font-size:1rem;color:var(--h-accent,#b3123a)}
.acct-todo ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}
.acct-todo li{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin:0}
.acct-todo__t{margin-left:auto;font-weight:600}
.acct-flag{display:inline-block;padding:.1rem .5rem;border-radius:999px;font-size:.75rem;
  font-weight:600;background:var(--h-accent,#b3123a);color:#fff}
.acct-stats{list-style:none;margin:1.25rem 0;padding:0;display:grid;
  grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:.75rem}
.acct-stats li{margin:0;padding:.9rem 1rem;border:1px solid var(--h-line-2);border-radius:10px;
  background:var(--h-surface-2,#f7f8f9);display:flex;flex-direction:column;gap:.15rem}
.acct-stats b{font-size:1.35rem;font-weight:700;line-height:1.1;color:var(--h-ink,#111)}
.acct-stats span{font-size:.8rem;color:var(--h-muted,#6b7280)}
.acct-page{padding:0 .75rem;color:var(--h-muted,#6b7280)}

/* The USP and promo bars are NOT sticky — they simply scroll away, which is why the
   page no longer jumps. Nothing in the header changes height on scroll; the compact
   look comes from a transform, which does not affect layout. */
.site-logo img{transition:transform .25s var(--h-ease)}
@media (prefers-reduced-motion:reduce){
  .site-logo img,.site-header__row{transition:none}
}

/* ---- subcategory browse block ---- */
.subcats{margin:0 0 26px}
.subcats__head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;
  margin:0 0 14px;padding-bottom:10px;border-bottom:1px solid var(--h-line-2)}
.subcats__head h2{margin:0;font-size:17px;font-weight:700;letter-spacing:-.01em}
.subcats__head span{font-size:13px;color:var(--h-muted)}

/* B — wide rows: image, name, count, chevron */
.subcats__grid{display:grid;gap:10px;
  grid-template-columns:repeat(auto-fit,minmax(270px,1fr))}
.subcat-row{display:flex;align-items:center;gap:13px;padding:10px;text-decoration:none;
  color:var(--h-ink);background:#fff;border:1px solid var(--h-line-2);border-radius:12px;
  transition:border-color .18s,transform .18s}
.subcat-row:hover{border-color:var(--h-accent,#b3123a);transform:translateY(-1px)}
.subcat-row__img{width:60px;height:60px;flex:none;border-radius:9px;overflow:hidden;
  background:var(--h-surface-2,#f7f8f9);display:flex;align-items:center;justify-content:center}
.subcat-row__img img{width:100%;height:100%;object-fit:contain;mix-blend-mode:multiply}
.subcat-row__txt{flex:1;min-width:0}
.subcat-row__n{display:block;font-size:14.5px;font-weight:600;line-height:1.3}
.subcat-row__c{display:block;font-size:12.5px;color:var(--h-muted);margin-top:2px}
.subcat-row__go{font-size:22px;color:var(--h-muted);line-height:1}
.subcat-row:hover .subcat-row__go{color:var(--h-accent,#b3123a)}

@media (max-width:860px){.subcats__grid{grid-template-columns:1fr}}


/* Video in a category description: keep its aspect ratio and never overflow. */
.cat-about .wp-video,.cat-about iframe,.entry iframe{max-width:100%}
.cat-about iframe[src*="youtu"],.cat-about iframe[src*="vimeo"],
.entry iframe[src*="youtu"],.entry iframe[src*="vimeo"]{
  width:100%;aspect-ratio:16/9;height:auto;border:0;border-radius:10px;margin:18px 0}

/* Category prose: full width, single column. */
.cat-about .entry{max-width:none}

/* Logged-in staff get WordPress's 32px admin bar fixed over the viewport, so a header
   stuck at top:0 hides underneath it. */
body.admin-bar .site-header{top:32px}
@media screen and (max-width:782px){body.admin-bar .site-header{top:46px}}

/* The [hidden] attribute only hides via the browser's own [hidden]{display:none}, which
   ANY author display rule outranks. The mobile bottom-sheet rule sets display:flex, so
   every filter panel rendered at once. Restate it at higher specificity. */
.fpanel[hidden],[hidden]{display:none}

/* ---- mobile fixes ---- */
@media (max-width:860px){
  /* iOS Safari zooms the whole page when a field under 16px takes focus, and the page
     never zooms back. Tapping search or quantity was doing exactly that. */
  input:not([type=checkbox]):not([type=radio]),select,textarea{font-size:16px}
  .fbar__sort select,.fpanel__search,.hippo-qty input{font-size:16px}

  /* Header actions were 24×24 — too small to hit reliably. Widen the target without
     changing how they look. */
  .site-icons{gap:14px}
  .site-icons a{min-width:44px;min-height:44px;justify-content:center;padding:2px 0}
  .nav-toggle{min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}

  /* Two products per row. One card per row meant 24 cards of scrolling on a phone. */
  ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
  ul.products .woocommerce-loop-product__title,ul.products .pcard__title{font-size:13.5px;line-height:1.3}
  ul.products .pcard__meta,ul.products .pcard__sku{font-size:11.5px}
  ul.products .button{width:100%;padding-left:8px;padding-right:8px;font-size:12.5px}
}
@media (max-width:339px){
  /* Only genuinely tiny screens fall back to one card. 375px is the commonest iPhone
     width, and cutting over at 400px meant almost nobody got the two-up grid. */
  ul.products{grid-template-columns:1fr;gap:14px}
  ul.products .woocommerce-loop-product__title,ul.products .pcard__title{font-size:15px}
}

/* ---- mobile header and sticky buy bar ---- */
@media (max-width:860px){
  /* The row was 412px of content in 366px, so the icons wrapped and the header grew to
     178px. Trimming the logo and the icon gaps brings it back to one line while keeping
     every tap target at 44px. */
  /* 44 (toggle) + 136 (logo) + 164 (icons) + 12 (gaps) = 356 in 366. The space comes
     from the icons rather than the logo: at 112px the fine "DISPLAYS" lettering turned
     to mush. Icons keep a 40px target — under the ideal 44 but far better than the 24
     they were, and the row has nothing left to give. */
  .site-logo img{max-width:136px;width:auto;height:auto}
  .site-icons{gap:2px}
  .site-icons a{min-width:40px;min-height:44px}
  .site-header__row{gap:6px;flex-wrap:wrap}
  .site-search{order:3;flex-basis:100%}
}
@media (max-width:360px){
  .site-logo img{max-width:118px}
  .site-icons a{min-width:36px}
}

/* "Add to quote" was breaking over three lines in a 132px button. */
[data-h=stickybuy] button{white-space:nowrap;flex:0 0 auto;padding:13px 20px;line-height:1.2}
[data-h=stickybuy]{gap:10px}
[data-h=stickybuy] [data-h=sticky-price]{min-width:0;overflow:hidden}

/* ---- sorting on mobile: a compact control beside the filter pills ---- */
@media (max-width:860px){
  .fbar{flex-wrap:nowrap;align-items:center;gap:8px}
  .fbar__scroll{flex:1 1 auto;min-width:0}
  /* The select sat full width on its own row, dominating the bar. Collapse it to a pill
     the width of the filter pills beside it, with its own label so it stays findable —
     a bare icon reads as decoration and people miss it. */
  .fbar__sort{flex:0 0 auto;margin-left:0;position:relative}
  .fbar__sort::before{content:"Sort";position:absolute;left:34px;top:50%;
    transform:translateY(-50%);font-size:13.5px;font-weight:600;color:var(--h-ink);
    pointer-events:none;z-index:1}
  .fbar__sort::after{content:"";position:absolute;left:12px;top:50%;width:14px;height:14px;
    transform:translateY(-50%);pointer-events:none;z-index:1;
    background:currentColor;color:var(--h-ink);
    -webkit-mask:var(--sort-icon) center/contain no-repeat;mask:var(--sort-icon) center/contain no-repeat}
  .fbar__sort select{
    --sort-icon:none;
    width:auto;min-width:96px;max-width:104px;
    padding:9px 10px 9px 30px;
    color:transparent;            /* the real label is drawn by ::before */
    text-indent:-9999px;
    background-image:none;
    border-radius:50px;border:1.5px solid var(--h-line);background-color:#fff}
  .fbar__sort select option{color:var(--h-ink);text-indent:0}
  /* the chosen order still shows once something other than the default is picked */
  .fbar__sort.is-set::before{content:attr(data-label);color:var(--h-red)}
  .fbar__sort.is-set select{border-color:var(--h-red)}
}
:root{--sort-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 6h13M3 12h9M3 18h5'/%3E%3Cpath d='M17 10l4-4 4 4' transform='translate(-2,4)'/%3E%3C/svg%3E")}

/* Belt and braces: whatever the label says, it stays inside the pill. */
@media (max-width:860px){
  .fbar__sort::before{max-width:60px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
}

/* ---- mobile: logo and sort corrections ---- */
@media (max-width:860px){
  /* No scale-on-scroll here. The logo rasterises at its layout size and the transform
     then resamples that bitmap, which reads as distortion on a high-density screen.
     The mobile header is already compact, so it buys nothing. */
  .site-header.is-stuck .site-logo img{transform:none}

  /* Sort was a bordered capsule sitting in a row of bordered capsules, so it read as
     another filter. Strip the chrome, halve the width, and separate it with a rule —
     it should look like a control that acts on the list, not a value you can pick. */
  .fbar__sort{border-left:1px solid var(--h-line-2);padding-left:8px;margin-left:4px}
  .fbar__sort select{min-width:0;max-width:70px;padding:8px 2px 8px 22px;
    border:0;background-color:transparent;border-radius:0}
  .fbar__sort::before{left:22px;font-size:13px;font-weight:500;color:var(--h-muted);max-width:46px}
  .fbar__sort::after{left:2px;width:13px;height:13px;color:var(--h-muted)}
  .fbar__sort.is-set::before{color:var(--h-red);font-weight:600}
  .fbar__sort.is-set::after{color:var(--h-red)}
}

/* ---- mobile: the real logo fix, and an icon-only sort ---- */
@media (max-width:860px){
  /* The transform was only half of it. A separate stuck rule forces height:38px, and at
     that height the logo's 4.7 ratio wants 178px of width — clamped to 136 by max-width,
     so it squashed. Both height rules must be released, not just the transform. */
  .site-header.is-stuck .site-logo img{height:auto;transform:none;max-width:136px}

  /* Sort, icon only. The pill label was the thing making it read as a filter. */
  .fbar__sort{border-left:1px solid var(--h-line-2);padding-left:6px;margin-left:2px}
  .fbar__sort::before{content:none}
  .fbar__sort::after{left:50%;transform:translate(-50%,-50%);width:19px;height:19px;
    color:var(--h-ink)}
  .fbar__sort select{min-width:44px;max-width:44px;width:44px;height:44px;
    padding:0;border:0;background-color:transparent;border-radius:50%}
  .fbar__sort.is-set::after{color:var(--h-red)}
  /* a dot marks a non-default order, since there is no longer any text to change */
  .fbar__sort.is-set{position:relative}
  .fbar__sort.is-set::before{content:"";position:absolute;top:7px;right:3px;left:auto;
    width:7px;height:7px;border-radius:50%;background:var(--h-red);z-index:2}
}
@media (max-width:360px){
  .site-header.is-stuck .site-logo img{max-width:118px}
}

/* Tier table with imprint rows (item / options / imprint / all in).
   The label column is left-aligned and narrow so the price grid keeps the
   same rhythm as the plain two-row table it replaces. */
.hippo-tiers__table--rows th.hippo-tiers__lab{text-align:left;white-space:nowrap;width:1%;font-size:12px;font-weight:600;color:var(--h-muted);padding-left:9px;padding-right:11px}
.hippo-tiers__table--rows tr:first-child th.hippo-tiers__lab{background:var(--h-surface)}
.hippo-tiers__table--rows .is-na{color:var(--h-muted);background:var(--h-surface);font-size:11.5px}
.hippo-tiers__table--rows .hippo-tiers__allin th.hippo-tiers__lab,
.hippo-tiers__table--rows .hippo-tiers__allin td{font-weight:700;color:var(--h-black);border-top:2px solid var(--h-line-2,#D8D8D8)}
.hippo-tiers__table--rows .hippo-tiers__allin td.is-on{background:#EEEEEE}
@media (max-width:520px){
  .hippo-tiers__table--rows{font-size:12px}
  .hippo-tiers__table--rows th,.hippo-tiers__table--rows td{padding:7px 2px}
  .hippo-tiers__table--rows th.hippo-tiers__lab{font-size:11px;padding-left:6px;padding-right:6px;white-space:normal}
  /* band headers must stay on one line — "100–249" wrapping reads as a broken table */
  .hippo-tiers__table--rows tr:first-child th{font-size:10.5px;white-space:nowrap;letter-spacing:-.2px}
  .hippo-tiers__table--rows .is-na{font-size:10.5px}
}
.hippo-tiers__note{font-size:12px;color:var(--h-muted);margin:7px 0 0;line-height:1.45}
.hippo-tiers__note b{color:var(--h-ink);font-weight:600}
/* "Each additional color" is reference information, not this order's rate — tinted so it
   reads as the rate card rather than as a line the customer is being charged. */
.hippo-tiers__table--rows tr.hippo-tiers__addl th.hippo-tiers__lab,
.hippo-tiers__table--rows tr.hippo-tiers__addl td{background:var(--h-cream,#FBF6E6)}
.hippo-tiers__table--rows tr.hippo-tiers__addl td.is-on{background:#EEEEEE}
/* One-time charges block inside the rate card. Values span the quantity columns because they
   are flat — the layout itself says "this does not change with quantity". */
.hippo-tiers__table--rows tr.hippo-tiers__sub th.hippo-tiers__lab{font-family:var(--h-disp,inherit);font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--h-muted);padding-top:13px}
.hippo-tiers__table--rows tr.hippo-tiers__sub td{background:var(--h-surface)}
.hippo-tiers__table--rows tr.hippo-tiers__sub th.hippo-tiers__lab,
.hippo-tiers__table--rows tr.hippo-tiers__sub td{border-top:2px solid var(--h-line-2,#D8D8D8)}
.hippo-tiers__table--rows tr.hippo-tiers__fee td{text-align:left;font-family:inherit;padding-left:12px}
.hippo-tiers__table--rows tr.hippo-tiers__fee td b{font-family:var(--h-mono,ui-monospace,Menlo,monospace);font-weight:600;color:var(--h-ink)}
.hippo-tiers__table--rows tr.hippo-tiers__fee td span{color:var(--h-muted);font-size:12.5px}
@media (max-width:520px){
  .hippo-tiers__table--rows tr.hippo-tiers__fee td{padding-left:6px}
  .hippo-tiers__table--rows tr.hippo-tiers__fee td span{display:block;font-size:11.5px;margin-top:1px}
}
/* Quantity in the sticky buy bar. Reuses .hippo-qty__ctl so it looks and behaves like the
   stepper in the form — it drives that same field. */
.stickybuy__qty{flex:none}
.stickybuy__qty input{width:64px}
@media (max-width:600px){
  .stickybuy__row{gap:10px;padding:8px 12px}
  .stickybuy__row img{display:none}
  .stickybuy__price{font-size:16px}
  .stickybuy__price small{display:block;font-size:11px;line-height:1.2}
  .stickybuy__qty input{width:48px}
  .stickybuy .button{padding:10px 16px;white-space:nowrap}
}
/* Let the price take the room left over rather than wrapping to three lines in 68px. */
.stickybuy__price{flex:1;min-width:0}
@media (max-width:600px){
  .stickybuy__qty input{width:44px}
  .stickybuy__qty button{padding-left:9px;padding-right:9px}
  .stickybuy .button{padding:10px 14px;font-size:14px}
}

/* ---- Imprint pricing popup ----------------------------------------------
   The rate card and one-time charges left the page for a dialog, opened by a
   small link that appears once a print method is chosen. */
/* heading row: label left, pricing link right. The link carries [hidden] until a method is
   chosen — .linkbtn sets a display, which beats the attribute, so re-assert it here. */
.imprint__head-row{display:flex;align-items:baseline;gap:14px;flex-wrap:wrap}
.imprint__head-row .linkbtn{margin-left:auto;font-size:13px;white-space:nowrap}
.imprint__head-row [hidden]{display:none}
.hmodal__box--narrow{max-width:560px}
.hmodal__box--narrow .tw{overflow-x:auto}
.hmodal__note{font-size:12.5px;color:var(--h-muted);margin:9px 0 0}
.hmodal__h3{font-family:var(--h-display,inherit);font-weight:700;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--h-muted);margin:22px 0 10px;padding-bottom:7px;border-bottom:1px solid var(--h-line)}
.feelist{margin:0;display:grid;grid-template-columns:auto 1fr;gap:8px 16px;font-size:13.5px}
.feelist dt{font-weight:600;color:var(--h-ink)}
.feelist dd{margin:0;color:var(--h-muted)}
.feelist dd b{font-family:var(--h-mono,ui-monospace,Menlo,monospace);color:var(--h-ink);font-weight:600;margin-right:5px}
@media (max-width:520px){.feelist{grid-template-columns:1fr;gap:2px 0}.feelist dd{margin-bottom:8px}}
/* Popup table on narrow screens: the label column was collapsing to ~65px, so
   "Each additional color" wrapped to three lines and doubled that row's height.
   Give the label a fixed share and tighten the price cells to pay for it. */
@media (max-width:520px){
  .hmodal__box--narrow .hippo-tiers__table{table-layout:fixed}
  .hmodal__box--narrow .hippo-tiers__table th.hippo-tiers__lab{width:34%;font-size:11.5px;line-height:1.3;padding-left:9px;padding-right:8px}
  .hmodal__box--narrow .hippo-tiers__table th,
  .hmodal__box--narrow .hippo-tiers__table td{padding-left:3px;padding-right:3px;font-size:12px}
  .hmodal__box--narrow .hippo-tiers__table tr:first-child th{font-size:10.5px;white-space:nowrap;letter-spacing:-.2px}
}

/* Quote downloads on the customer's order page. The two PDFs are the point of the page,
   so they sit above the generic document list rather than reading as more attachments. */
.hippo-quotedl{margin:0 0 26px;padding:18px 20px;background:var(--h-cream,#FBF6E6);border:1px solid var(--h-line);border-radius:10px}
.hippo-quotedl h2{margin:0 0 12px;font-size:18px}
.hippo-quotedl__row{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center}
.hippo-quotedl__note{width:100%;margin:4px 0 0;font-size:13px;color:var(--h-muted)}
@media (max-width:520px){.hippo-quotedl__row .button{width:100%;text-align:center}}

/* Equal-width quantity columns in every price table, as on displaysandholders.com (user 2026-09-13).
   With automatic layout "100–249" took more room than "1–49" and the tiers looked uneven. Fixed layout
   splits the width evenly; tables with a row-label column give that column a set share first. */
.hippo-tiers__table{table-layout:fixed}
.hippo-tiers__table--rows tr:first-child th.hippo-tiers__lab{width:30%}