/* =====================================================================
   Rediseño tienda Absolut 360° — 2026-10-12
   Archivo único: quitar el <link> en layout.php revierte todo lo visual.
   ===================================================================== */
:root {
  --ui-sans: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --rd-line: rgba(17, 17, 17, 0.12);
  --rd-line2: rgba(17, 17, 17, 0.22);
  --rd-photo: #f5f5f2;
  --rd-radius: 12px;
  --rd-shadow: 0 1px 2px rgba(0,0,0,.05), 0 6px 18px rgba(0,0,0,.06);
}

/* ---------- 3. Tipografía legible ---------- */
body { font-family: var(--ui-sans); font-size: 16px; }
.nav-desktop > a, .btn, .mobile-menu, .filter-bar a, .m-cats a, .shop-tabs a,
.form-group label, .alert, .pc-cat, .search-box input, .search-box button, select, input, textarea {
  font-family: var(--ui-sans) !important;
}
.btn { letter-spacing: 0.02em; text-transform: none; font-size: 0.9rem; font-weight: 700; }
.btn-sm { font-size: 0.82rem; }
.nav-desktop > a { text-transform: none; letter-spacing: 0; font-size: 0.9rem; font-weight: 600; }
h1, h2, .page-head h1, .sh-title, .pd-title { font-family: var(--disp); }
.page-head .sub, .sh-kicker, .pc-cat { font-family: var(--mono) !important; } /* mono solo como acento pequeño */
.product-card .pc-cat { letter-spacing: 0.06em; font-size: 0.68rem; }
.pd-desc, .pd-desc p, .pd-desc li { font-family: var(--ui-sans); font-size: 0.98rem; line-height: 1.6; }

/* ---------- Bordes y sombras más ligeros + aire ---------- */
.btn { border-width: 1.5px; box-shadow: none; border-radius: 8px; }
.btn:hover, .btn-sm:hover { box-shadow: none; transform: translateY(-1px); }
.btn-sm { box-shadow: none; }
.page-head { border-bottom: 1px solid var(--rd-line2); padding-bottom: 1.2rem; margin-bottom: 2.4rem; }
.tienda-main { padding-bottom: 4rem; }
.catalog-grid { gap: 1.6rem !important; }
.filter-bar a { border: 1px solid var(--rd-line2); border-radius: 999px; background: #fff; box-shadow: none !important; text-transform: none; letter-spacing: 0; font-size: 0.85rem; }
.filter-bar a.active, .filter-bar a:hover { background: var(--ink); color: var(--paper); }
.search-box, .tienda-toolbar select { border: 1px solid var(--rd-line2) !important; border-radius: 8px; overflow: hidden; }
.cart-summary, .co-box, .bank-col, .pay-card, .empty-state, .alert {
  border: 1px solid var(--rd-line) !important; box-shadow: var(--rd-shadow) !important; border-radius: var(--rd-radius);
}
.product-detail, .product-detail .pd-stage { border-color: var(--rd-line) !important; box-shadow: var(--rd-shadow) !important; }

/* ---------- 1. Fotos uniformes (sin tocar archivos) ---------- */
.product-card {
  background: #fff; border: 1px solid var(--rd-line); box-shadow: none; border-radius: var(--rd-radius);
  display: flex; flex-direction: column; transition: box-shadow .2s, transform .2s;
}
.product-card:hover { transform: translateY(-2px); box-shadow: var(--rd-shadow); }
.product-card > a:first-child { display: block; background: var(--rd-photo); }
.product-card img {
  display: block; width: 100%; aspect-ratio: 1 / 1 !important; object-fit: contain !important;
  background: transparent !important; padding: 8% !important; border-bottom: 0 !important;
  mix-blend-mode: multiply; /* fondos blancos de las fotos se funden con el gris claro */
}
.m-cats a { border: 1px solid var(--rd-line2) !important; border-radius: 999px; background: #fff !important; box-shadow: none !important; font-weight: 600 !important; }
.m-cats a.active { background: var(--ink) !important; color: var(--paper) !important; }
.cf-toggle { border: 1px solid var(--rd-line2) !important; border-radius: 10px; font-family: var(--ui-sans); }
.badge, .badge-outline { font-family: var(--ui-sans) !important; border-width: 1px !important; border-radius: 6px; }
.product-card .pc-placeholder { aspect-ratio: 1 / 1; border-bottom: 0; background: var(--rd-photo); }
.product-card .pc-body { padding: 1rem 1.1rem 1.2rem; display: flex; flex-direction: column; flex: 1; }
.product-card .pc-body form, .product-card .pc-body > .btn:last-child, .product-card .pc-body > div:last-child { margin-top: auto !important; }
.product-card .pc-body .btn { width: 100%; }

/* ---------- 2. Logo único (wordmark) ---------- */
#header .logo { font-family: var(--disp); font-size: 1.35rem; letter-spacing: -0.01em; white-space: nowrap; }
#header { border-bottom: 1px solid var(--rd-line2); }

/* ---------- 4. Hero de tienda ---------- */
.shop-hero {
  display: grid; grid-template-columns: 1.1fr 1fr; gap: 2rem; align-items: center;
  background: #fff; border: 1px solid var(--rd-line); border-radius: 16px; padding: 2rem 2.2rem; margin: 0 0 2.4rem;
}
.sh-kicker { font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--red); font-weight: 700; margin-bottom: 0.6rem; }
.sh-title { text-transform: uppercase; font-size: clamp(1.5rem, 3.2vw, 2.4rem); line-height: 1.08; margin-bottom: 0.8rem; }
.sh-sub { font-size: 1.02rem; line-height: 1.55; opacity: 0.8; max-width: 32rem; margin-bottom: 1.3rem; }
.sh-ctas { display: flex; flex-wrap: wrap; gap: 0.7rem; }
.sh-ctas .btn { width: auto; }
.sh-wa { background: #25D366 !important; color: #fff !important; border-color: #25D366 !important; }
.sh-photos { display: grid; grid-template-columns: 1fr 1fr; gap: 0.7rem; }
.sh-ph { display: block; background: var(--rd-photo); border-radius: 10px; overflow: hidden; }
.sh-ph img { width: 100%; aspect-ratio: 4 / 3; object-fit: contain; padding: 10%; mix-blend-mode: multiply; display: block; }

/* ---------- 6. Pestañas Merch y NFC / Servicios ---------- */
.shop-tabs { display: flex; gap: 0.3rem; border-bottom: 1px solid var(--rd-line2); margin: 0 0 1.4rem; scroll-margin-top: 90px; }
.shop-tabs a { padding: 0.75rem 1.1rem; font-weight: 700; font-size: 0.98rem; border-bottom: 3px solid transparent; margin-bottom: -1px; opacity: 0.65; }
.shop-tabs a.active, .shop-tabs a:hover { opacity: 1; border-bottom-color: var(--red); }
.catalog-filters { border-radius: var(--rd-radius) !important; border: 1px solid var(--rd-line) !important; }
.feat-block .btn { width: auto; }

/* ---------- 5. Franja de confianza ---------- */
.trust-bar { background: #fff !important; border-top: 1px solid var(--rd-line) !important; padding: 1.6rem 0 1rem !important; margin-top: 3rem !important; }
.tb-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; }
.tb-item { display: flex; gap: 0.7rem; align-items: center; font-size: 0.88rem; line-height: 1.35; }
.tb-item strong { display: block; font-size: 0.92rem; }
.tb-item span { opacity: 0.7; }
.tb-item a { text-decoration: underline; }
.tb-ico { font-size: 1.4rem; width: 40px; text-align: center; opacity: 1 !important; }
.tb-item img { width: 40px; height: auto; }
.social-proof { display: flex; flex-wrap: wrap; gap: 1.2rem; align-items: center; justify-content: space-between; margin: -1.2rem 0 2.2rem; padding: 0.9rem 1.2rem; background: #fff; border: 1px solid var(--rd-line); border-radius: var(--rd-radius); }
.sp-logos { display: flex; flex-wrap: wrap; gap: 1.2rem; align-items: center; }
.sp-logos img { height: 34px; width: auto; filter: grayscale(1); opacity: 0.75; }

/* ---------- Header: iconos ---------- */
.hdr-actions .btn { gap: 0.4rem; }
.hdr-ico { display: none; }

/* ---------- Cookie banner compacto ---------- */
.ck-bar { padding: 0.55rem 0 !important; }
.ck-in { display: flex; align-items: center; justify-content: space-between; gap: 0.8rem; }
.ck-txt { font-size: 0.82rem; margin: 0; opacity: 0.9; }
.ck-txt a { color: var(--red); text-decoration: underline; }
.ck-btn { width: auto !important; padding: 0.45rem 1rem !important; flex: 0 0 auto; }

/* ---------- Tablet ---------- */
@media (max-width: 960px) {
  .shop-hero { grid-template-columns: 1fr; padding: 1.5rem; }
  .sh-photos { grid-template-columns: repeat(4, 1fr); }
  .tb-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* ---------- 7. Móvil ---------- */
@media (max-width: 760px) {
  .hdr-cur { display: none !important; }
  .hdr-actions { gap: 0.4rem !important; }
  .hdr-actions .btn { width: auto !important; padding: 0.5rem 0.6rem; min-width: 40px; }
  .hdr-ico { display: block; }
  .hdr-wa .hdr-lbl, .hdr-cart .hdr-lbl { display: none; }
  #header .logo { font-size: 1.15rem; }
  .head-in { gap: 0.5rem; }
  .shop-hero { padding: 1.1rem; gap: 1rem; margin-bottom: 1.4rem; border-radius: 12px; }
  .sh-title { font-size: 1.3rem; }
  .sh-sub { font-size: 0.92rem; margin-bottom: 0.9rem; }
  .sh-ctas .btn { flex: 1 1 0; padding: 0.75rem 0.6rem; font-size: 0.86rem; }
  .sh-photos { grid-template-columns: repeat(4, 1fr); gap: 0.4rem; }
  .shop-tabs a { flex: 1; text-align: center; padding: 0.7rem 0.4rem; font-size: 0.92rem; }
  .catalog-grid { gap: 0.7rem !important; }
  .product-card .pc-body { padding: 0.7rem 0.75rem 0.85rem; }
  .product-card .pc-body .btn { font-size: 0.78rem; padding: 0.55rem 0.4rem; }
  .tb-grid { grid-template-columns: 1fr 1fr; gap: 0.8rem; }
  .tb-item { font-size: 0.8rem; }
  .ck-in { gap: 0.6rem; }
  .ck-txt { font-size: 0.74rem; line-height: 1.3; }
  .ck-txt a + a, .ck-txt a:last-child { } 
  .page-head { margin-bottom: 1.2rem; padding-bottom: 0.7rem; }
  .page-head h1 { font-size: 1.4rem !important; }
  .sh-ph img { aspect-ratio: 1 / 1; }
}
@media (max-width: 420px) {
  .ck-txt { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
}

/* ---------- Ficha de producto: bordes ligeros ---------- */
.product-detail { border: 1px solid var(--rd-line) !important; border-radius: 14px; overflow: hidden; background: #fff; }
.product-detail .pd-img { border-right: 1px solid var(--rd-line) !important; border-bottom-color: var(--rd-line) !important; background: var(--rd-photo); }
.product-detail .pd-stage { background: var(--rd-photo) !important; box-shadow: none !important; border: 0 !important; }
.product-detail .pd-stage img { background: transparent !important; mix-blend-mode: multiply; }

/* =====================================================================
   Cabecera nueva (hx) — limpia, 64px, sticky
   ===================================================================== */
#header.hx { position: fixed; top: 0; left: 0; right: 0; z-index: 200; height: 64px; padding: 0 !important; background: rgba(255,255,255,0.96); backdrop-filter: saturate(1.4) blur(8px); border-bottom: 1px solid var(--rd-line); box-shadow: none !important; font-family: var(--ui-sans); }
#header.hx.scrolled { box-shadow: 0 2px 12px rgba(0,0,0,0.06) !important; }
.tienda-main { padding-top: 96px !important; }
.hx-in { height: 64px; display: flex; align-items: center; gap: 1.5rem; }
.hx-logo { font-family: var(--disp); font-size: 1.3rem !important; white-space: nowrap; flex: 0 0 auto; }
.hx-nav { display: flex; align-items: center; gap: 1.6rem; margin: 0 auto; }
.hx-nav a { position: relative; font-size: 15px; font-weight: 500; color: #3a3a3a; text-transform: none; letter-spacing: 0; padding: 0.4rem 0; transition: color .15s; }
.hx-nav a:hover { color: var(--ink); }
.hx-nav a.is-active { color: var(--red); font-weight: 600; }
.hx-nav a.is-active::after { content: ""; position: absolute; left: 0; right: 0; bottom: -2px; height: 2px; background: var(--red); border-radius: 2px; }
.hx-tools { display: flex; align-items: center; gap: 0.35rem; flex: 0 0 auto; }
.hx-cur select { appearance: none; -webkit-appearance: none; border: 1px solid transparent; background: transparent; font: 500 13px var(--ui-sans) !important; color: #666; padding: 0.3rem 0.5rem; border-radius: 6px; cursor: pointer; }
.hx-cur select:hover, .hx-cur select:focus { border-color: var(--rd-line2); color: var(--ink); outline: none; }
.hx-ico { position: relative; display: inline-grid; place-items: center; width: 40px; height: 40px; border-radius: 10px; color: #2b2b2b; transition: background .15s; }
.hx-ico:hover { background: rgba(0,0,0,0.05); }
.hx-badge { position: absolute; top: 3px; right: 2px; min-width: 17px; height: 17px; padding: 0 4px; border-radius: 999px; background: var(--ink); color: #fff; font: 700 10.5px/17px var(--ui-sans); text-align: center; }
.hx-badge--red { background: var(--red); }
.hx-cta { display: inline-flex; align-items: center; gap: 0.45rem; margin-left: 0.5rem; padding: 0.55rem 1rem; border-radius: 999px; background: #25D366; color: #fff !important; font: 600 14px var(--ui-sans); white-space: nowrap; box-shadow: none; transition: background .15s, transform .15s; }
.hx-cta:hover { background: #1ebe5a; transform: translateY(-1px); }
.hx-burger { display: none; width: 40px !important; height: 40px !important; border: 0 !important; box-shadow: none !important; border-radius: 10px; background: transparent; margin-left: 0.2rem; }
.hx-burger:hover { background: rgba(0,0,0,0.05); }
.hx-burger span { left: 10px !important; right: 10px !important; height: 2px !important; border-radius: 2px; }
.hx-burger span:nth-child(1) { top: 13px !important; } .hx-burger span:nth-child(2) { top: 19px !important; } .hx-burger span:nth-child(3) { top: 25px !important; }
.hx-burger.open span:nth-child(1), .hx-burger.open span:nth-child(3) { top: 19px !important; }

/* Panel lateral móvil */
.hx-drawer { position: fixed !important; inset: 0 0 0 auto !important; width: min(86vw, 340px); padding: 80px 1.4rem 1.6rem !important; background: #fff !important; z-index: 199 !important; clip-path: none !important; transform: translateX(100%); visibility: hidden; transition: transform .3s ease, visibility .3s; box-shadow: -10px 0 30px rgba(0,0,0,0.12); overflow-y: auto; display: flex; flex-direction: column; gap: 1.2rem; font-family: var(--ui-sans); }
.hx-drawer.open { transform: translateX(0); visibility: visible; }
.hx-dnav { display: flex; flex-direction: column; }
.hx-dnav a { padding: 0.85rem 0.2rem; font-size: 17px; font-weight: 600; border-bottom: 1px solid var(--rd-line); color: var(--ink); }
.hx-dnav a.is-active { color: var(--red); }
.hx-dsub { display: flex; flex-wrap: wrap; gap: 0.5rem; }
.hx-dsub a { padding: 0.45rem 0.8rem; border: 1px solid var(--rd-line2); border-radius: 999px; font-size: 14px; }
.hx-dcur { font-size: 14px; color: #666; display: flex; gap: 0.6rem; align-items: center; }
.hx-dcur a { padding: 0.25rem 0.55rem; border-radius: 6px; }
.hx-dcur a.is-on { background: var(--ink); color: #fff; }
.hx-cta--block { justify-content: center; margin: auto 0 0; padding: 0.85rem 1rem; font-size: 15px; }
.hx-scrim { position: fixed; inset: 0; background: rgba(0,0,0,0.35); z-index: 198; opacity: 0; visibility: hidden; transition: opacity .3s; }
body.menu-open .hx-scrim { opacity: 1; visibility: visible; }
body.menu-open { overflow: hidden; }

@media (max-width: 1180px) { .hx-nav { gap: 1.1rem; } .hx-cta span { display: none; } .hx-cta { padding: 0.55rem; } }
@media (max-width: 960px) {
  .hx-nav { display: none; }
  .hx-burger { display: block !important; }
  .hx-tools { margin-left: auto; }
  .hx-cta span { display: inline; } .hx-cta { padding: 0.5rem 0.9rem; }
}
@media (max-width: 600px) {
  .hx-in { gap: 0.5rem; }
  .hx-cur, .hx-ico[href*="comparar"], .hx-ico[href*="wishlist"] { display: none !important; }
  .hx-cta span { display: none; } .hx-cta { padding: 0.55rem; margin-left: 0.1rem; }
  .hx-logo { font-size: 1.12rem !important; }
  .tienda-main { padding-top: 84px !important; }
}
.hx-cta--block span { display: inline !important; } .hx-cta--block { padding: 0.85rem 1rem !important; }
/* Logo original (versión para fondo claro) */
.hx-logo { display: inline-flex; align-items: center; line-height: 0; }
.hx-logo img { height: 46px; width: auto; display: block; }
@media (max-width: 600px) { .hx-logo img { height: 36px; } }

/* ===== r2 (2026-10-12) ===== */
/* Insignia de pedido mínimo */
.r2-min { display: inline-block; align-self: flex-start; width: fit-content; max-width: 100%; margin-top: 0.35rem; padding: 0.18rem 0.55rem; border-radius: 999px; background: #fff4e5; color: #8a4b00; border: 1px solid #f3c98b; font: 600 0.72rem/1.3 var(--ui-sans, system-ui, sans-serif); letter-spacing: 0; text-transform: none; white-space: nowrap; }
.r2-min--pd { margin: 0 0 0.8rem; font-size: 0.82rem; padding: 0.25rem 0.7rem; }
/* Banner de cookies: texto corto en móvil */
.ck-short { display: none; }
body.ck-open .wa-float { bottom: calc(1.25rem + 52px) !important; transition: bottom .2s; }
@media (max-width: 600px) {
  .ck-long { display: none; }
  .ck-short { display: inline; }
  .ck-bar { padding: 0.4rem 0 !important; border-top-width: 2px !important; }
  .ck-in { gap: 0.5rem !important; }
  .ck-txt { font-size: 0.76rem !important; line-height: 1.2 !important; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
  .ck-btn { padding: 0.3rem 0.75rem !important; font-size: 0.74rem !important; min-height: 0 !important; line-height: 1.2 !important; }
  body.ck-open .wa-float { bottom: calc(1rem + 44px) !important; width: 50px !important; height: 50px !important; }
  body.ck-open:has(.m-paybar) .wa-float { bottom: 130px !important; }
}
/* Hero v2 tienda — Absolut 360 */
.shop-hero.v2{display:grid;grid-template-columns:1.05fr 1fr;gap:2rem;align-items:center;padding:2.4rem 2.6rem;border-radius:18px;margin-bottom:2rem;position:relative;overflow:hidden;
 background:radial-gradient(120% 140% at 100% 0%,#2a2a2a 0%,#141414 55%,#0d0d0d 100%);color:#fff;border:0;box-shadow:0 18px 40px -22px rgba(0,0,0,.55)}
.shop-hero.v2:before{content:"";position:absolute;right:-120px;top:-120px;width:380px;height:380px;border-radius:50%;background:radial-gradient(circle,rgba(255,77,0,.35),transparent 65%)}
.shop-hero.v2 .sh-kicker{color:#ff6a2b}
.shop-hero.v2 .sh-title{color:#fff;font-size:clamp(1.6rem,3.3vw,2.6rem)}
.shop-hero.v2 .sh-title em{font-style:normal;color:#ff6a2b}
.shop-hero.v2 .sh-sub{color:rgba(255,255,255,.78);opacity:1}
.sh-trust{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:.55rem .9rem;margin:1.3rem 0 0;padding:1.1rem 0 0;border-top:1px solid rgba(255,255,255,.12);font-size:.82rem;color:rgba(255,255,255,.85)}
.sh-trust li{display:flex;gap:.5rem;align-items:center;line-height:1.3}
.sh-trust b{color:#fff}
.sh-trust i{flex:0 0 26px;height:26px;border-radius:8px;display:grid;place-items:center;background:rgba(255,255,255,.08);font-style:normal;font-size:.8rem}
.sh-pay{display:inline-flex;gap:.3rem}
.sh-pay span{font-size:.66rem;font-weight:800;padding:.18rem .45rem;border-radius:5px;color:#fff}
.sh-pay .y{background:#742284}.sh-pay .p{background:#00b6c9}
.sh-collage{position:relative;z-index:1;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(2,1fr);gap:.7rem;aspect-ratio:3/2}
.sh-collage .shc{display:block!important;min-height:0;position:relative;background:#f4efe8;border-radius:14px;overflow:hidden;display:block;transition:transform .25s}
.sh-collage a:hover{transform:translateY(-3px)}
.sh-collage .shc:nth-of-type(1){grid-row:span 2}
.sh-collage .shc img{max-width:none;width:100%;height:100%;object-fit:cover;display:block}
.sh-collage span{position:absolute;left:.5rem;bottom:.5rem;right:.5rem;font-size:.68rem;font-weight:700;color:#111;background:rgba(255,255,255,.9);padding:.25rem .45rem;border-radius:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sh-badge{position:absolute;z-index:2;top:-.6rem;right:-.4rem;background:#ff4d00;color:#fff;font-weight:800;font-size:.72rem;padding:.4rem .7rem;border-radius:999px;box-shadow:0 6px 16px -6px rgba(255,77,0,.8)}
@media (max-width:900px){.shop-hero.v2{grid-template-columns:1fr;padding:1.6rem}}
@media (max-width:600px){.shop-hero.v2{padding:1.2rem;gap:1.1rem;border-radius:14px}
 .shop-hero.v2 .sh-title{font-size:1.35rem}.sh-trust{grid-template-columns:1fr;font-size:.8rem;gap:.45rem}
 .sh-collage{grid-template-columns:repeat(5,1fr);grid-template-rows:1fr;aspect-ratio:5/1;gap:.4rem}
 .sh-collage .shc:nth-of-type(1){grid-row:auto}.sh-collage span{display:none}.sh-badge{top:-1.5rem;right:0;font-size:.62rem;padding:.25rem .55rem}.sh-collage{margin-top:.6rem}}
/* hv4 encabezado catálogo */
.page-head.ph4{display:grid;grid-template-columns:1fr auto;gap:1rem 2rem;align-items:end}
.ph4-lead{max-width:38rem;opacity:.8;margin-top:.6rem;font-size:.95rem;line-height:1.55}
.ph4-side{display:flex;align-items:center;gap:1rem;padding-bottom:.3rem}
.ph4-stat{display:flex;flex-direction:column;align-items:flex-end;line-height:1;border-right:1px solid rgba(0,0,0,.12);padding-right:1rem}
.ph4-stat b{font-family:var(--disp);font-size:2.2rem;color:var(--red,#ff4d00)}
.ph4-stat span{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;opacity:.7;margin-top:.25rem}
.ph4-cta{display:inline-flex;align-items:center;gap:.5rem;background:#25D366;color:#fff!important;font-weight:700;font-size:.9rem;padding:.75rem 1.1rem;border-radius:999px;text-decoration:none;box-shadow:0 8px 20px -10px rgba(37,211,102,.9);transition:transform .2s}
.ph4-cta:hover{transform:translateY(-2px)}
.ph4-bar{grid-column:1/-1;overflow:hidden;border-radius:999px;background:#141414;color:#fff;font-size:.8rem;font-weight:600;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ph4-track{display:flex;width:max-content;animation:ph4m 38s linear infinite}
.ph4-track span{padding:.6rem 1.6rem;white-space:nowrap}
.ph4-bar:hover .ph4-track{animation-play-state:paused}
@keyframes ph4m{to{transform:translateX(-50%)}}
@media (prefers-reduced-motion:reduce){.ph4-track{animation:none;flex-wrap:wrap;width:auto}}
@media (max-width:700px){.page-head.ph4{grid-template-columns:1fr;gap:.8rem}.ph4-side{justify-content:space-between}
 .ph4-stat{align-items:flex-start}.ph4-stat b{font-size:1.7rem}.ph4-cta{font-size:.82rem;padding:.65rem .9rem}.ph4-bar{font-size:.74rem}}
@media (max-width:700px){.ph4-lead{display:none}}