:root {
--hph-deep:  #0b0c1e;
--hph-mid:   #171634;
--hph-violet:#241a44;
--hph-gold:  #ffc200;
--hph-gold-hi:#ffe27a;
--hph-magenta:#ff7ad9;
--hph-ink:   #f4f2ff;
--hph-ink-dim: rgba(244, 242, 255, .66);
--hph-display: "Sanchez", "Domine", Georgia, "Times New Roman", serif;
} body.hp-hits-page { background: var(--hph-deep); } body.hp-hits-page::before {
content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none;
background:
radial-gradient(90% 55% at 50% -10%, rgba(255, 194, 0, .13), transparent 62%),
radial-gradient(120% 70% at 50% 108%, rgba(255, 122, 217, .22), transparent 62%),
radial-gradient(70% 50% at 85% 30%, rgba(139, 123, 255, .16), transparent 60%),
linear-gradient(180deg, var(--hph-deep) 0%, var(--hph-mid) 45%, var(--hph-violet) 100%);
} body.hp-hits-page::after {
content: ""; position: fixed; inset: 0; z-index: 0; pointer-events: none; opacity: .5;
background-image: url("data:image/svg+xml;utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/%3E%3CfeColorMatrix type='matrix' values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.035 0'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)'/%3E%3C/svg%3E");
}
body.hp-hits-page #content, body.hp-hits-page .site-main { position: relative; z-index: 1; }
body.hp-hits-page #content, body.hp-hits-page .site-main,
body.hp-hits-page .elementor-section, body.hp-hits-page .e-con { background-color: transparent; } body.hp-hits-page #content, body.hp-hits-page .site-main { padding-top: 208px; }
@media (max-width: 767px) { body.hp-hits-page #content, body.hp-hits-page .site-main { padding-top: 138px; } } body.hp-hits-page .page-content > h1:first-child,
body.hp-hits-page .entry-title,
body.hp-hits-page .page-header { display: none; } .hp-hits-hero { position: relative; text-align: center; margin: 0 0 40px; }
.hp-hits-eyebrow {
display: inline-flex; align-items: center; gap: 7px;
padding: 7px 17px; border-radius: 999px; margin-bottom: 18px;
font-size: 12.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
color: #ffe9b0;
background: rgba(255, 194, 0, .1);
background-color: rgba(255, 194, 0, .1); border: 1px solid rgba(255, 194, 0, .42);
box-shadow: 0 4px 18px rgba(255, 194, 0, .16), inset 0 1px 0 rgba(255, 255, 255, .14);
}
.hp-hits-title {
font-family: var(--hph-display); font-size: clamp(38px, 6.2vw, 74px); line-height: 1.28; font-weight: 700;
padding-bottom: .08em; letter-spacing: -.015em; margin: 0; text-wrap: balance; color: var(--hph-gold-hi);
background: linear-gradient(178deg, #fff6d8 4%, var(--hph-gold-hi) 38%, var(--hph-gold) 68%, #e39a00 100%);
-webkit-background-clip: text; background-clip: text;
-webkit-text-fill-color: transparent;
filter: drop-shadow(0 4px 22px rgba(255, 194, 0, .3));
}
.hp-hits-sub {
max-width: 54ch; margin: 16px auto 0; font-size: 15.5px; line-height: 1.65;
color: var(--hph-ink-dim);
} .hp-hits-rule {
display: block; width: min(280px, 62%); height: 12px; margin: 26px auto 0;
background:
linear-gradient(90deg, transparent, rgba(255, 194, 0, .55) 22%, rgba(255, 194, 0, .55) 40%, transparent 46%),
linear-gradient(90deg, transparent 54%, rgba(255, 194, 0, .55) 60%, rgba(255, 194, 0, .55) 78%, transparent);
background-size: 100% 1px, 100% 1px;
background-position: center, center;
background-repeat: no-repeat;
position: relative;
}
.hp-hits-rule::before {
content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px;
margin: -4.5px 0 0 -4.5px; transform: rotate(45deg);
background: linear-gradient(160deg, var(--hph-gold-hi), #d99a00);
box-shadow: 0 0 12px rgba(255, 194, 0, .6);
} .hp-hits-grid ul.products { counter-reset: hphit; }
.hp-hits-grid ul.products li.product .woocommerce-loop-product__title::before {
content: counter(hphit); counter-increment: hphit;
display: inline-grid; place-items: center; vertical-align: text-bottom;
width: 24px; height: 24px; margin-right: 8px; border-radius: 50%;
font-size: 13px; font-weight: 700; line-height: 1; font-style: normal;
background: linear-gradient(160deg, #4a4a68, #2e2e48); color: #fff;
border: 1.5px solid rgba(255, 255, 255, .3);
box-shadow: 0 2px 6px rgba(0, 0, 0, .4);
}
.hp-hits-grid ul.products li.product:nth-child(1) .woocommerce-loop-product__title::before {
background: linear-gradient(160deg, var(--hph-gold-hi), #f5b301 60%, #d99a00); color: #2a1a00;
border-color: rgba(255, 255, 255, .6); box-shadow: 0 2px 10px rgba(245, 179, 1, .6);
}
.hp-hits-grid ul.products li.product:nth-child(2) .woocommerce-loop-product__title::before {
background: linear-gradient(160deg, #f2f2f6, #bfc3cf 60%, #9aa0b0); color: #22243a;
}
.hp-hits-grid ul.products li.product:nth-child(3) .woocommerce-loop-product__title::before {
background: linear-gradient(160deg, #e8a06a, #b96d35 60%, #94511f); color: #2a1200;
} body.hp-hits-page .hp-hits-grid ul.products {
display: grid !important; grid-template-columns: repeat(5, minmax(0, 1fr));
gap: 18px; margin: 0 !important; padding: 0 !important; list-style: none;
}
body.hp-hits-page .hp-hits-grid ul.products::before,
body.hp-hits-page .hp-hits-grid ul.products::after { content: none !important; display: none !important; }
body.hp-hits-page .hp-hits-grid ul.products li.product {
float: none !important; width: auto !important; margin: 0 !important; clear: none !important;
}
@media (max-width: 1100px) { body.hp-hits-page .hp-hits-grid ul.products { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px)  { body.hp-hits-page .hp-hits-grid ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; } } body.hp-hits-page .hp-hits-grid ul.products li.product {
box-sizing: border-box; padding: 14px 14px 18px; border-radius: 18px; text-align: center;
background: rgba(255, 255, 255, .045);
background-color: rgba(255, 255, 255, .045); border: 1px solid rgba(255, 255, 255, .09);
box-shadow: 0 10px 30px rgba(0, 0, 0, .3);
transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease;
}
body.hp-hits-page .hp-hits-grid ul.products li.product:hover {
transform: translateY(-4px); border-color: rgba(255, 194, 0, .35);
box-shadow: 0 16px 38px rgba(0, 0, 0, .42), 0 0 26px rgba(255, 194, 0, .1);
}
body.hp-hits-page .hp-hits-grid ul.products li.product .woocommerce-loop-product__title {
color: var(--hph-ink) !important; font-size: 15px; line-height: 1.4;
}
body.hp-hits-page .hp-hits-grid ul.products li.product a { text-decoration: none; } body.hp-hits-page .hp-hits-grid ul.products li.product { display: flex; flex-direction: column; } body.hp-hits-page .hp-hits-grid ul.products li.product > a.woocommerce-LoopProduct-link {
display: flex; flex-direction: column; flex: 1 1 auto;
} body.hp-hits-page .hp-hits-grid ul.products li.product .price { margin: auto 0 12px; }
body.hp-hits-page .hp-hits-grid ul.products li.product .button,
body.hp-hits-page .hp-hits-grid ul.products li.product .hp-gramaz-wrap { margin-top: 0; } body.hp-hits-page .hp-hits-grid ul.products li.product .woocommerce-loop-product__title {
min-height: 2.8em; margin: 0 0 6px;
} body.hp-hits-page .hp-hits-grid ul.products li.product:nth-child(-n+3) {
background: rgba(255, 194, 0, .05);
background-color: rgba(255, 194, 0, .05);
border-color: rgba(255, 194, 0, .22);
} body.hp-hits-page .hp-hits-grid .price { color: var(--hph-ink); font-size: 15px; }
body.hp-hits-page .hp-hits-grid .price del { color: rgba(244, 242, 255, .5); }
body.hp-hits-page .hp-hits-grid .price ins { color: var(--hph-gold); text-decoration: none; font-weight: 700; } .hp-hits-all { text-align: center; margin: 34px 0 0; }
.hp-hits-shop {
display: inline-block; padding: 13px 30px; border-radius: 999px; text-decoration: none;
font-weight: 700; letter-spacing: .02em; color: #2a1a00;
background: linear-gradient(160deg, #ffd75e, #f5b301 60%, #d99a00);
background-color: #f5b301; box-shadow: 0 8px 22px rgba(245, 179, 1, .28), inset 0 1px 0 rgba(255, 255, 255, .5);
transition: transform .15s ease, filter .15s ease;
}
.hp-hits-shop, .hp-hits-shop:hover { text-decoration: none !important; }
.hp-hits-shop:hover { filter: saturate(1.08); transform: translateY(-2px); color: #2a1a00; }
@media (prefers-reduced-motion: reduce) {
body.hp-hits-page .hp-hits-grid ul.products li.product,
.hp-hits-shop { transition: none; }
}