:root {
    --bg: #f3f8f8;
    --surface: #ffffff;
    --surface-soft: #eaf4f4;
    --ink: #061f28;
    --muted: #64777b;
    --line: rgba(6, 31, 40, .11);
    --cyan: #20d6d3;
    --cyan-dark: #0db7b8;
    --blue: #3478f6;
    --wa: #22c76f;
    --dark: #061f28;
    --radius-xl: 34px;
    --radius-lg: 24px;
    --radius-md: 17px;
    --shadow: 0 26px 80px rgba(5, 39, 48, .12);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
    margin: 0;
    background: var(--bg);
    color: var(--ink);
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    overflow-x: hidden;
    text-rendering: optimizeLegibility;
}
body.modal-open { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
img { display: block; max-width: 100%; }
[hidden] { display: none !important; }
.container { width: min(1180px, calc(100% - 40px)); margin-inline: auto; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; left: 16px; top: 10px; z-index: 200; transform: translateY(-160%); background: #fff; padding: 12px 16px; border-radius: 12px; box-shadow: var(--shadow); font-weight: 800; }
.skip-link:focus { transform: translateY(0); }
:focus-visible { outline: 3px solid rgba(52, 120, 246, .45); outline-offset: 3px; }

.site-header { position: sticky; top: 0; z-index: 70; border-bottom: 1px solid transparent; background: rgba(243, 248, 248, .78); backdrop-filter: blur(20px); transition: border-color .25s ease, box-shadow .25s ease; }
.site-header.scrolled { border-color: var(--line); box-shadow: 0 10px 35px rgba(6,31,40,.05); }
.navbar { min-height: 78px; display: flex; align-items: center; justify-content: space-between; gap: 28px; }
.brand { display: inline-flex; align-items: center; gap: 10px; font-size: 21px; font-weight: 900; letter-spacing: -.045em; }
.brand img { width: 48px; height: 48px; object-fit: contain; }
.nav-links { display: flex; align-items: center; gap: 30px; color: #466066; font-size: 13px; font-weight: 750; }
.nav-links a { position: relative; }
.nav-links a::after { content: ""; position: absolute; left: 0; right: 0; bottom: -8px; height: 2px; border-radius: 99px; background: var(--cyan-dark); transform: scaleX(0); transition: transform .25s ease; }
.nav-links a:hover::after { transform: scaleX(1); }
.menu-toggle { display: none; width: 45px; height: 45px; border: 1px solid var(--line); border-radius: 14px; background: #fff; padding: 0 12px; cursor: pointer; }
.menu-toggle span { display: block; width: 100%; height: 2px; margin: 6px 0; border-radius: 99px; background: var(--ink); transition: .25s ease; }

.btn { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; gap: 9px; border: 0; border-radius: 999px; padding: 0 19px; font-weight: 850; font-size: 12px; cursor: pointer; transition: transform .24s ease, box-shadow .24s ease, background .24s ease; }
.btn:hover { transform: translateY(-2px); }
.btn-primary { background: linear-gradient(135deg, var(--cyan), #72ece2); color: #032429; box-shadow: 0 14px 30px rgba(32,214,211,.2); }
.btn-primary:hover { box-shadow: 0 17px 34px rgba(32,214,211,.3); }
.btn-wa { background: var(--wa); color: #062518; box-shadow: 0 12px 28px rgba(34,199,111,.18); }
.btn-wa:hover { background: #1ab862; box-shadow: 0 15px 32px rgba(34,199,111,.28); }
.btn-affiliate { background: var(--ink); color: #fff; }
.btn-affiliate:hover { box-shadow: 0 15px 30px rgba(6,31,40,.22); }
.btn-dark { background: var(--dark); color: #fff; }

.hero { min-height: 720px; padding: 86px 0 96px; display: grid; grid-template-columns: 1.04fr .96fr; gap: 72px; align-items: center; }
.eyebrow, .section-kicker { text-transform: uppercase; letter-spacing: .145em; font-size: 10px; font-weight: 900; }
.eyebrow { display: inline-flex; align-items: center; gap: 10px; color: #4e696e; margin-bottom: 24px; }
.eyebrow span { width: 8px; height: 8px; border-radius: 50%; background: var(--cyan-dark); box-shadow: 0 0 0 6px rgba(13,183,184,.13); }
.hero h1 { margin: 0; max-width: 710px; font-size: clamp(58px, 6.4vw, 91px); line-height: .96; letter-spacing: -.078em; }
.hero h1 em { font-style: normal; color: #779095; font-weight: 520; }
.hero-copy > p { max-width: 620px; margin: 29px 0 0; color: var(--muted); font-size: 17px; line-height: 1.78; }
.hero-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; margin-top: 32px; }
.hero-facts { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 12px; margin-top: 48px; }
.hero-facts div { padding: 15px 0; border-top: 1px solid var(--line); }
.hero-facts strong, .hero-facts span { display: block; }
.hero-facts strong { font-size: 20px; letter-spacing: -.04em; }
.hero-facts span { margin-top: 4px; color: var(--muted); font-size: 10px; line-height: 1.45; }

.hero-visual { position: relative; min-height: 560px; display: grid; place-items: center; }
.hero-aura { position: absolute; width: 470px; height: 470px; border-radius: 50%; background: radial-gradient(circle at 35% 30%, rgba(32,214,211,.48), rgba(52,120,246,.18) 44%, transparent 70%); filter: blur(2px); animation: breathe 5s ease-in-out infinite; }
.logo-orbit { position: absolute; right: 4%; top: 5%; width: 126px; height: 126px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.76); border: 1px solid rgba(255,255,255,.85); box-shadow: 0 20px 55px rgba(6,31,40,.13); backdrop-filter: blur(14px); animation: float 5.5s ease-in-out infinite; }
.logo-orbit img { width: 94px; height: 94px; object-fit: contain; }
.featured-card { position: relative; z-index: 2; width: min(440px, 88%); padding: 13px; border: 1px solid rgba(255,255,255,.8); border-radius: 34px; background: rgba(255,255,255,.88); box-shadow: var(--shadow); transform: rotate(2.2deg); backdrop-filter: blur(12px); transition: transform .5s cubic-bezier(.2,.8,.2,1); }
.featured-card:hover { transform: rotate(0) translateY(-7px); }
.featured-image { position: relative; overflow: hidden; aspect-ratio: 1.17/1; border-radius: 24px; background: #0a3340; }
.featured-image img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s ease; }
.featured-card:hover .featured-image img { transform: scale(1.025); }
.featured-image span { position: absolute; left: 14px; top: 14px; padding: 8px 10px; border-radius: 999px; background: rgba(255,255,255,.88); color: var(--ink); font-size: 9px; font-weight: 900; backdrop-filter: blur(8px); }
.featured-content { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 17px 8px 6px; }
.featured-content small { display: block; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .12em; font-weight: 850; }
.featured-content h2 { margin: 5px 0 4px; font-size: 17px; letter-spacing: -.03em; }
.featured-content strong { font-size: 13px; }
.featured-content > a { width: 45px; height: 45px; display: grid; place-items: center; flex: 0 0 auto; border-radius: 50%; background: var(--wa); font-size: 11px; font-weight: 950; transition: transform .25s ease; }
.featured-content > a:hover { transform: rotate(7deg) scale(1.06); }
.floating-note { position: absolute; z-index: 3; display: inline-flex; align-items: center; gap: 8px; padding: 11px 14px; border-radius: 14px; background: #fff; box-shadow: 0 18px 45px rgba(6,31,40,.13); font-size: 10px; font-weight: 850; animation: float 4.7s ease-in-out infinite; }
.floating-note span { width: 20px; height: 20px; display: grid; place-items: center; border-radius: 50%; background: #dffaf0; color: #11995c; }
.note-one { left: -1%; top: 19%; }
.note-two { right: -2%; bottom: 15%; animation-delay: -2s; }

.trust-strip { overflow: hidden; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: rgba(255,255,255,.5); }
.trust-items { min-height: 70px; display: flex; align-items: center; justify-content: space-between; gap: 25px; color: #4a6267; font-size: 10px; text-transform: uppercase; letter-spacing: .13em; font-weight: 850; white-space: nowrap; }
.trust-items i { width: 5px; height: 5px; flex: 0 0 auto; border-radius: 50%; background: var(--cyan-dark); }

.products-section { padding: 116px 0 124px; }
.section-heading { display: flex; align-items: end; justify-content: space-between; gap: 50px; margin-bottom: 42px; }
.section-heading h2 { margin: 9px 0 0; max-width: 650px; font-size: clamp(38px, 4.7vw, 62px); line-height: 1.02; letter-spacing: -.06em; }
.section-heading > p { max-width: 430px; margin: 0; color: var(--muted); font-size: 14px; line-height: 1.75; }
.section-kicker { color: var(--cyan-dark); }
.toolbar { display: grid; grid-template-columns: auto auto minmax(220px,1fr); align-items: end; gap: 16px; padding: 18px; margin-bottom: 28px; border: 1px solid var(--line); border-radius: 22px; background: rgba(255,255,255,.72); }
.filter-block { min-width: 0; }
.filter-label { display: block; margin: 0 0 8px 4px; color: var(--muted); font-size: 9px; text-transform: uppercase; letter-spacing: .13em; font-weight: 900; }
.filter-chips { display: flex; gap: 7px; flex-wrap: wrap; }
.chip { min-height: 39px; padding: 0 14px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: #53676c; font-size: 10px; font-weight: 850; cursor: pointer; transition: .22s ease; }
.chip:hover, .chip.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.select-wrap select, .search-box { min-height: 42px; border: 1px solid var(--line); border-radius: 999px; background: #fff; }
.select-wrap select { min-width: 160px; padding: 0 34px 0 14px; color: #53676c; font-size: 10px; font-weight: 800; cursor: pointer; }
.search-box { display: flex; align-items: center; gap: 8px; padding: 0 14px; }
.search-box span { color: var(--muted); }
.search-box input { width: 100%; min-width: 0; border: 0; outline: 0; background: transparent; color: var(--ink); font-size: 11px; }
.search-box input::placeholder { color: #8da0a3; }

.product-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 17px; }
.product-card { min-width: 0; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius-lg); background: var(--surface); transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease; }
.product-card:hover { transform: translateY(-7px); border-color: rgba(13,183,184,.32); box-shadow: 0 22px 55px rgba(6,31,40,.11); }
.product-image { position: relative; overflow: hidden; aspect-ratio: 1.15/1; margin: 8px; border-radius: 17px; background: #0b3b49; }
.product-image > img { width: 100%; height: 100%; object-fit: cover; transition: transform .55s ease; }
.product-card:hover .product-image > img { transform: scale(1.035); }
.product-topline { position: absolute; left: 9px; right: 9px; top: 9px; display: flex; align-items: flex-start; justify-content: space-between; gap: 7px; }
.badge, .mode-badge { padding: 7px 8px; border-radius: 999px; font-size: 8px; font-weight: 900; line-height: 1; backdrop-filter: blur(8px); }
.badge { background: rgba(255,255,255,.9); color: var(--ink); }
.mode-badge { max-width: 120px; background: rgba(6,31,40,.82); color: #fff; text-align: right; }
.quick-view { position: absolute; right: 10px; bottom: 10px; min-height: 35px; padding: 0 12px; border: 0; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--ink); font-size: 9px; font-weight: 900; cursor: pointer; box-shadow: 0 9px 25px rgba(6,31,40,.13); transition: transform .22s ease; }
.quick-view:hover { transform: translateY(-2px); }
.product-content { padding: 14px 17px 18px; }
.product-meta { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.product-card h3 { min-height: 44px; margin: 10px 0 7px; font-size: 17px; line-height: 1.28; letter-spacing: -.035em; }
.product-card p { min-height: 57px; margin: 0; color: var(--muted); font-size: 10px; line-height: 1.65; }
.price-row { display: flex; align-items: end; justify-content: space-between; gap: 10px; margin-top: 14px; padding-top: 14px; border-top: 1px solid var(--line); }
.price-row strong, .price-row del { display: block; }
.price-row strong { font-size: 16px; letter-spacing: -.025em; }
.price-row del { margin-top: 3px; color: #99a8aa; font-size: 9px; }
.discount { padding: 6px 8px; border-radius: 999px; background: #e2faf4; color: #0e8f69; font-size: 8px; font-weight: 900; }
.product-actions { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 7px; margin-top: 14px; }
.product-actions .btn:only-child { grid-column: 1/-1; }
.product-actions .btn { min-height: 39px; padding: 0 10px; font-size: 9px; }
.empty-state { padding: 80px 20px; text-align: center; }
.empty-state > span { width: 58px; height: 58px; display: grid; place-items: center; margin: 0 auto 15px; border-radius: 50%; background: #fff; font-size: 24px; }
.empty-state h3 { margin: 0; font-size: 20px; }
.empty-state p { color: var(--muted); }

.steps-section { padding: 115px 0 125px; background: var(--dark); color: #fff; }
.section-heading.light .section-kicker { color: #6ce9e2; }
.section-heading.light > p { color: #9db0b5; }
.steps-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; }
.step-card { min-height: 260px; padding: 28px; border: 1px solid rgba(255,255,255,.12); border-radius: 24px; background: linear-gradient(145deg, rgba(255,255,255,.07), rgba(255,255,255,.025)); }
.step-card > span { width: 39px; height: 39px; display: grid; place-items: center; border-radius: 13px; background: rgba(32,214,211,.14); color: #7cf1ea; font-size: 10px; font-weight: 900; }
.step-card h3 { margin: 67px 0 10px; font-size: 21px; letter-spacing: -.035em; }
.step-card p { margin: 0; color: #a7b9bd; font-size: 12px; line-height: 1.75; }

.security-section { padding: 120px 0; }
.security-panel { display: grid; grid-template-columns: .9fr 1.1fr; gap: 70px; padding: 58px; overflow: hidden; border-radius: var(--radius-xl); background: linear-gradient(135deg, #d9f8f5, #ecf3ff); box-shadow: inset 0 0 0 1px rgba(6,31,40,.06); }
.security-copy h2 { margin: 10px 0 18px; font-size: clamp(36px,4.5vw,58px); line-height: 1.04; letter-spacing: -.06em; }
.security-copy p { max-width: 510px; margin: 0; color: #536e73; font-size: 14px; line-height: 1.78; }
.text-link { display: inline-flex; align-items: center; gap: 9px; margin-top: 24px; font-size: 12px; font-weight: 900; }
.text-link span { transition: transform .22s ease; }
.text-link:hover span { transform: translateX(4px); }
.security-list { display: grid; gap: 10px; }
.security-list > div { display: grid; grid-template-columns: 40px 1fr; gap: 13px; padding: 17px; border: 1px solid rgba(6,31,40,.08); border-radius: 17px; background: rgba(255,255,255,.68); }
.security-list span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; background: var(--ink); color: #72ece2; font-size: 9px; font-weight: 900; }
.security-list p { margin: 0; color: #587176; font-size: 11px; line-height: 1.65; }
.security-list strong { color: var(--ink); }

.disclosure { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 34px; padding: 32px 36px; margin-bottom: 120px; border: 1px solid var(--line); border-radius: 26px; background: #fff; }
.disclosure img { width: 88px; height: 88px; object-fit: contain; }
.disclosure h2 { margin: 7px 0 7px; font-size: 27px; letter-spacing: -.045em; }
.disclosure p { max-width: 720px; margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }

footer { padding: 60px 0 28px; background: #03161d; color: #fff; }
.footer-main { display: flex; align-items: flex-start; justify-content: space-between; gap: 40px; padding-bottom: 50px; }
.footer-brand-block p { margin: 12px 0 0; color: #8fa4a9; font-size: 11px; }
.footer-links { display: flex; gap: 26px; color: #b5c3c6; font-size: 11px; font-weight: 750; }
.footer-links a:hover { color: #fff; }
.footer-bottom { display: flex; justify-content: space-between; gap: 30px; padding-top: 24px; border-top: 1px solid rgba(255,255,255,.1); color: #80959a; font-size: 10px; }

.modal { position: fixed; inset: 0; z-index: 120; display: grid; place-items: center; padding: 20px; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.modal.is-open { opacity: 1; pointer-events: auto; }
.modal-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(2,18,23,.7); backdrop-filter: blur(10px); cursor: pointer; }
.modal-panel { position: relative; z-index: 1; width: min(880px, 100%); max-height: min(680px, calc(100vh - 40px)); display: grid; grid-template-columns: 1fr 1fr; overflow: auto; border-radius: 29px; background: #fff; box-shadow: 0 35px 100px rgba(0,0,0,.34); transform: translateY(15px) scale(.98); transition: transform .25s ease; }
.modal.is-open .modal-panel { transform: translateY(0) scale(1); }
.modal-close { position: absolute; right: 14px; top: 14px; z-index: 3; width: 39px; height: 39px; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); font-size: 22px; cursor: pointer; }
.modal-image-wrap { min-height: 520px; background: #0b3b49; }
.modal-image-wrap img { width: 100%; height: 100%; object-fit: cover; }
.modal-content { display: flex; flex-direction: column; justify-content: center; padding: 48px; }
.modal-content h2 { margin: 9px 0 14px; font-size: 35px; line-height: 1.06; letter-spacing: -.055em; }
.modal-content > p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.75; }
.modal-order { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-top: 26px; padding: 18px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.quantity-field label, .modal-price-block small { display: block; margin-bottom: 8px; color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .11em; font-weight: 900; }
.quantity-control { display: grid; grid-template-columns: 38px 48px 38px; overflow: hidden; min-height: 40px; border: 1px solid var(--line); border-radius: 999px; }
.quantity-control button { border: 0; background: transparent; cursor: pointer; font-size: 18px; }
.quantity-control button:hover { background: var(--surface-soft); }
.quantity-control input { width: 100%; border: 0; outline: 0; text-align: center; font-weight: 900; appearance: textfield; }
.quantity-control input::-webkit-inner-spin-button, .quantity-control input::-webkit-outer-spin-button { appearance: none; margin: 0; }
.modal-price-block { text-align: right; }
.modal-price-block strong { font-size: 22px; }
.modal-actions { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; margin-top: 20px; }
.modal-actions .btn:only-child { grid-column: 1/-1; }
.order-note { display: block; margin-top: 13px; color: var(--muted); font-size: 9px; line-height: 1.55; }

.floating-whatsapp { position: fixed; right: 20px; bottom: 20px; z-index: 90; display: flex; align-items: center; gap: 9px; padding: 8px 14px 8px 8px; border-radius: 999px; background: var(--wa); color: #062518; box-shadow: 0 18px 42px rgba(0,0,0,.2); transition: transform .24s ease; }
.floating-whatsapp:hover { transform: translateY(-4px); }
.floating-whatsapp span { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 50%; background: #fff; font-size: 9px; font-weight: 950; }
.floating-whatsapp strong { font-size: 10px; }
.toast { position: fixed; left: 50%; bottom: 24px; z-index: 150; max-width: min(420px, calc(100% - 32px)); padding: 13px 17px; border-radius: 14px; background: #061f28; color: #fff; box-shadow: 0 18px 50px rgba(0,0,0,.25); font-size: 11px; font-weight: 750; opacity: 0; pointer-events: none; transform: translate(-50%, 18px); transition: .25s ease; }
.toast.show { opacity: 1; transform: translate(-50%,0); }

.reveal { opacity: 0; transform: translateY(22px); transition: opacity .75s ease, transform .75s cubic-bezier(.2,.75,.25,1); }
.reveal.visible { opacity: 1; transform: translateY(0); }
.delay-1 { transition-delay: .1s; }
.delay-2 { transition-delay: .2s; }

@keyframes float { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-9px); } }
@keyframes breathe { 0%,100% { transform: scale(.96); opacity: .82; } 50% { transform: scale(1.04); opacity: 1; } }

@media (max-width: 1050px) {
    .hero { grid-template-columns: 1fr 1fr; gap: 35px; }
    .product-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
    .toolbar { grid-template-columns: 1fr 1fr; }
    .search-box { grid-column: 1/-1; }
    .security-panel { gap: 35px; padding: 45px; }
}

@media (max-width: 820px) {
    .container { width: min(100% - 28px, 720px); }
    .desktop-cta, .nav-links { display: none; }
    .menu-toggle { display: block; }
    .nav-links.open { position: absolute; left: 14px; right: 14px; top: 72px; display: flex; flex-direction: column; align-items: stretch; gap: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: #fff; box-shadow: var(--shadow); }
    .nav-links.open a { padding: 15px 18px; border-bottom: 1px solid var(--line); }
    .nav-links.open a:last-child { border-bottom: 0; }
    .nav-links a::after { display: none; }
    .hero { min-height: auto; grid-template-columns: 1fr; padding: 64px 0 80px; }
    .hero-copy { text-align: center; }
    .eyebrow { justify-content: center; }
    .hero-copy > p { margin-inline: auto; }
    .hero-actions { justify-content: center; }
    .hero-facts { max-width: 560px; margin-inline: auto; margin-top: 38px; text-align: left; }
    .hero-visual { min-height: 510px; }
    .trust-items { justify-content: flex-start; overflow-x: auto; scrollbar-width: none; }
    .trust-items::-webkit-scrollbar { display: none; }
    .section-heading { display: block; }
    .section-heading > p { margin-top: 18px; }
    .product-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .steps-grid { grid-template-columns: 1fr; }
    .step-card { min-height: 220px; }
    .step-card h3 { margin-top: 50px; }
    .security-panel { grid-template-columns: 1fr; }
    .disclosure { grid-template-columns: auto 1fr; }
    .disclosure .btn { grid-column: 1/-1; }
    .modal-panel { grid-template-columns: 1fr; }
    .modal-image-wrap { min-height: 300px; max-height: 330px; }
    .modal-content { padding: 34px; }
}

@media (max-width: 560px) {
    .container { width: min(100% - 22px, 500px); }
    .navbar { min-height: 70px; }
    .brand img { width: 43px; height: 43px; }
    .hero { padding-top: 48px; }
    .hero h1 { font-size: clamp(48px, 15vw, 68px); }
    .hero-copy > p { font-size: 14px; }
    .hero-actions .btn { width: 100%; }
    .hero-facts { gap: 8px; }
    .hero-facts span { font-size: 8px; }
    .hero-visual { min-height: 430px; }
    .hero-aura { width: 350px; height: 350px; }
    .featured-card { width: 92%; }
    .logo-orbit { width: 92px; height: 92px; right: 0; }
    .logo-orbit img { width: 68px; height: 68px; }
    .floating-note { font-size: 8px; padding: 9px 10px; }
    .note-one { left: -2%; top: 23%; }
    .note-two { right: -2%; bottom: 9%; }
    .products-section { padding: 82px 0 90px; }
    .section-heading h2 { font-size: 39px; }
    .toolbar { grid-template-columns: 1fr; padding: 13px; }
    .search-box { grid-column: auto; }
    .filter-chips { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; }
    .filter-chips::-webkit-scrollbar { display: none; }
    .category-filter, .select-wrap select { width: 100%; }
    .product-grid { grid-template-columns: 1fr; }
    .product-card h3, .product-card p { min-height: auto; }
    .steps-section { padding: 82px 0 90px; }
    .security-section { padding: 82px 0; }
    .security-panel { padding: 28px 20px; border-radius: 25px; }
    .security-copy h2 { font-size: 39px; }
    .security-list > div { grid-template-columns: 35px 1fr; padding: 14px; }
    .disclosure { grid-template-columns: 1fr; padding: 25px 20px; margin-bottom: 85px; text-align: center; }
    .disclosure img { margin-inline: auto; }
    .footer-main, .footer-bottom { display: block; }
    .footer-links { flex-wrap: wrap; margin-top: 30px; }
    .footer-bottom small { display: block; margin-top: 7px; }
    .modal { padding: 10px; }
    .modal-panel { max-height: calc(100vh - 20px); border-radius: 22px; }
    .modal-image-wrap { min-height: 240px; max-height: 260px; }
    .modal-content { padding: 25px 20px; }
    .modal-content h2 { font-size: 29px; }
    .modal-actions { grid-template-columns: 1fr; }
    .modal-order { align-items: center; }
    .floating-whatsapp { right: 12px; bottom: 12px; padding-right: 8px; }
    .floating-whatsapp strong { display: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
    .reveal { opacity: 1; transform: none; }
}
.error-page { min-height: 100vh; display: grid; place-items: center; text-align: center; }
.error-page img { margin-inline: auto; }
.error-page h1 { margin: 10px 0 0; font-size: clamp(72px,14vw,160px); letter-spacing: -.08em; }
.error-page p { margin: 0 0 24px; color: var(--muted); }
.legal-page { min-height: calc(100vh - 160px); padding: 90px 0 110px; }
.legal-page > section { max-width: 820px; margin-inline: auto; }
.legal-page h1 { margin: 12px 0 22px; font-size: clamp(45px,7vw,78px); line-height: .98; letter-spacing: -.07em; }
.legal-lead { color: var(--muted); font-size: 16px; line-height: 1.8; }
.legal-page article { margin-top: 38px; padding-top: 28px; border-top: 1px solid var(--line); }
.legal-page article h2 { margin: 0 0 10px; font-size: 23px; letter-spacing: -.04em; }
.legal-page article p { margin: 0; color: var(--muted); font-size: 13px; line-height: 1.8; }
.legal-page .btn { margin-top: 34px; }

/* Affilia Channel SuperAPP collections */
.brand-copy { display: flex; flex-direction: column; line-height: 1.02; }
.brand-copy small { margin-top: 4px; color: var(--cyan-dark); font-size: 7px; font-weight: 950; letter-spacing: .18em; text-transform: uppercase; }
.nav-tools { display: flex; align-items: center; gap: 7px; margin-left: auto; }
.nav-tool { position: relative; min-width: 48px; min-height: 45px; display: grid; grid-template-columns: auto auto; place-content: center; align-items: center; gap: 2px 5px; padding: 5px 10px; border: 1px solid var(--line); border-radius: 15px; background: rgba(255,255,255,.8); color: var(--ink); cursor: pointer; transition: transform .22s ease, border-color .22s ease, background .22s ease; }
.nav-tool:hover { transform: translateY(-2px); border-color: rgba(13,183,184,.35); background: #fff; }
.nav-tool > span { font-size: 17px; line-height: 1; }
.nav-tool b { min-width: 16px; height: 16px; display: grid; place-items: center; border-radius: 999px; background: var(--ink); color: #fff; font-size: 7px; }
.nav-tool em { grid-column: 1/-1; color: var(--muted); font-size: 7px; font-style: normal; font-weight: 850; line-height: 1; }

.collection-tip { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 12px; margin: -10px 0 24px; padding: 13px 15px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(120deg, rgba(32,214,211,.07), rgba(52,120,246,.05)); }
.collection-tip > div { display: grid; grid-template-columns: 34px 1fr; align-items: center; gap: 10px; }
.collection-tip > div > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 11px; background: #fff; box-shadow: 0 8px 20px rgba(6,31,40,.06); font-size: 16px; }
.collection-tip p { margin: 0; color: var(--muted); font-size: 9px; line-height: 1.55; }
.collection-tip strong { color: var(--ink); }
.text-button { padding: 8px 0; border: 0; border-bottom: 1px solid currentColor; background: transparent; color: #486267; font-size: 9px; font-weight: 900; cursor: pointer; }
.text-button:hover { color: var(--ink); }

.product-card-tools { position: absolute; left: 10px; bottom: 10px; z-index: 3; display: flex; gap: 6px; }
.card-tool { width: 35px; height: 35px; display: grid; place-items: center; border: 0; border-radius: 50%; background: rgba(255,255,255,.92); color: var(--ink); box-shadow: 0 9px 25px rgba(6,31,40,.13); cursor: pointer; transition: transform .22s ease, background .22s ease, color .22s ease; }
.card-tool:hover { transform: translateY(-2px); }
.card-tool span { font-size: 15px; line-height: 1; }
.card-tool.active { background: var(--ink); color: #fff; }
.wishlist-toggle.active { background: #fff0f3; color: #d72e59; }
.compare-toggle.active { background: var(--cyan); color: #032429; }

.modal-collection-actions { display: flex; flex-wrap: wrap; gap: 7px; margin-top: 18px; }
.collection-button { min-height: 38px; display: inline-flex; align-items: center; gap: 7px; padding: 0 13px; border: 1px solid var(--line); border-radius: 999px; background: #fff; color: var(--ink); font-size: 9px; font-weight: 850; cursor: pointer; transition: .22s ease; }
.collection-button:hover, .collection-button.active { border-color: var(--ink); background: var(--ink); color: #fff; }
.collection-button span { font-size: 14px; }

.side-panel, .compare-panel { position: fixed; inset: 0; z-index: 135; opacity: 0; pointer-events: none; transition: opacity .25s ease; }
.side-panel.is-open, .compare-panel.is-open { opacity: 1; pointer-events: auto; }
.panel-backdrop { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: rgba(2,18,23,.72); backdrop-filter: blur(9px); cursor: pointer; }
.panel-card { position: absolute; right: 0; top: 0; bottom: 0; width: min(480px, 100%); display: grid; grid-template-rows: auto 1fr auto; padding: 28px; background: #fff; box-shadow: -25px 0 75px rgba(0,0,0,.22); transform: translateX(100%); transition: transform .3s cubic-bezier(.2,.8,.2,1); }
.side-panel.is-open .panel-card { transform: translateX(0); }
.panel-card > header, .compare-card > header { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.panel-card h2, .compare-card h2 { margin: 7px 0 0; font-size: 30px; letter-spacing: -.055em; }
.panel-close { width: 40px; height: 40px; flex: 0 0 auto; border: 1px solid var(--line); border-radius: 50%; background: #fff; font-size: 22px; cursor: pointer; }
.panel-card > footer, .compare-card > footer { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding-top: 18px; border-top: 1px solid var(--line); }
.panel-card > footer small, .compare-card > footer small { color: var(--muted); font-size: 8px; line-height: 1.5; }
.saved-list { min-height: 0; overflow-y: auto; padding: 16px 2px; }
.saved-item { position: relative; display: grid; grid-template-columns: 92px 1fr auto; gap: 13px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
.saved-item > img { width: 92px; height: 76px; object-fit: cover; border-radius: 14px; background: #0b3b49; }
.saved-copy { min-width: 0; }
.saved-copy small { color: var(--cyan-dark); font-size: 7px; font-weight: 900; text-transform: uppercase; letter-spacing: .1em; }
.saved-copy h3 { margin: 4px 0 5px; overflow: hidden; font-size: 13px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.saved-copy strong { font-size: 11px; }
.saved-remove { width: 28px; height: 28px; border: 1px solid var(--line); border-radius: 50%; background: #fff; color: var(--muted); cursor: pointer; }
.saved-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.saved-actions.compact { justify-content: flex-start; margin-top: 8px; }
.mini-action { min-height: 31px; display: inline-flex; align-items: center; justify-content: center; padding: 0 10px; border-radius: 999px; font-size: 8px; font-weight: 900; }
.mini-action.affiliate { background: var(--ink); color: #fff; }
.mini-action.whatsapp { background: var(--wa); color: #052619; }
.panel-empty { align-self: center; padding: 45px 20px; text-align: center; }
.panel-empty > span { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto 14px; border-radius: 50%; background: var(--surface-soft); font-size: 27px; }
.panel-empty h3 { margin: 0; font-size: 19px; }
.panel-empty p { max-width: 320px; margin: 8px auto 0; color: var(--muted); font-size: 10px; line-height: 1.6; }

.compare-panel { display: grid; place-items: center; padding: 22px; }
.compare-card { position: relative; z-index: 1; width: min(1180px, 100%); max-height: calc(100vh - 44px); display: grid; grid-template-rows: auto 1fr auto; overflow: hidden; padding: 27px; border-radius: 28px; background: #fff; box-shadow: 0 35px 100px rgba(0,0,0,.32); transform: translateY(18px) scale(.98); transition: transform .25s ease; }
.compare-panel.is-open .compare-card { transform: translateY(0) scale(1); }
.compare-content { min-height: 0; overflow: auto; padding: 15px 0; }
.comparison-table { width: 100%; min-width: 780px; border-collapse: separate; border-spacing: 0; table-layout: fixed; }
.comparison-table th, .comparison-table td { padding: 13px 14px; border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); vertical-align: top; text-align: center; font-size: 10px; line-height: 1.55; }
.comparison-table tr > :first-child { width: 125px; border-left: 1px solid var(--line); background: #f6f9f9; text-align: left; color: #53696e; font-weight: 900; }
.comparison-table thead th { border-top: 1px solid var(--line); background: #fff; }
.comparison-table thead tr > :first-child { border-top-left-radius: 15px; }
.comparison-table thead tr > :last-child { border-top-right-radius: 15px; }
.comparison-product { display: grid; justify-items: center; gap: 8px; }
.comparison-product img { width: 130px; height: 96px; object-fit: cover; border-radius: 14px; background: #0b3b49; }
.comparison-product strong { min-height: 32px; font-size: 12px; line-height: 1.3; }
.comparison-product button { border: 0; background: transparent; color: #a5445e; font-size: 8px; font-weight: 900; cursor: pointer; }
.comparison-table .price-cell { color: var(--ink); font-size: 14px; font-weight: 950; }
.comparison-table .saving-cell { color: #0e8f69; font-weight: 900; }
.comparison-table .description-cell { color: var(--muted); text-align: left; }

.compare-dock { position: fixed; left: 50%; bottom: 20px; z-index: 92; display: flex; align-items: center; gap: 25px; padding: 9px 10px 9px 17px; border: 1px solid rgba(255,255,255,.14); border-radius: 999px; background: rgba(6,31,40,.94); color: #fff; box-shadow: 0 20px 55px rgba(0,0,0,.24); backdrop-filter: blur(12px); transform: translateX(-50%); }
.compare-dock > div { display: grid; }
.compare-dock strong { font-size: 10px; }
.compare-dock small { margin-top: 2px; color: #9bb0b5; font-size: 7px; }
.compare-dock button { min-height: 38px; padding: 0 15px; border: 0; border-radius: 999px; background: var(--cyan); color: #04252a; font-size: 9px; font-weight: 950; cursor: pointer; }

@media (max-width: 1120px) {
    .navbar { gap: 16px; }
    .nav-links { gap: 17px; }
    .desktop-cta { display: none; }
    .collection-tip { grid-template-columns: 1fr 1fr; }
    .collection-tip > .text-button { grid-column: 1/-1; justify-self: start; }
}

@media (max-width: 820px) {
    .navbar { justify-content: flex-start; }
    .nav-tools { margin-left: auto; }
    .menu-toggle { margin-left: 0; }
    .nav-tool em { display: none; }
    .nav-tool { min-width: 43px; padding-inline: 7px; }
    .collection-tip { grid-template-columns: 1fr; }
    .collection-tip > .text-button { grid-column: auto; }
    .compare-card { padding: 20px; border-radius: 22px; }
    .floating-whatsapp { bottom: 78px; }
}

@media (max-width: 560px) {
    .brand { gap: 7px; font-size: 15px; }
    .brand-copy small { font-size: 6px; }
    .nav-tools { gap: 4px; }
    .nav-tool { min-width: 38px; min-height: 39px; grid-template-columns: auto auto; border-radius: 12px; padding: 4px 6px; }
    .nav-tool > span { font-size: 14px; }
    .nav-tool b { min-width: 14px; height: 14px; font-size: 6px; }
    .menu-toggle { width: 40px; height: 40px; border-radius: 12px; }
    .collection-tip { padding: 12px; }
    .collection-tip > div { grid-template-columns: 31px 1fr; }
    .collection-tip > div > span { width: 31px; height: 31px; }
    .modal-collection-actions { display: grid; grid-template-columns: 1fr; }
    .collection-button { justify-content: center; }
    .panel-card { padding: 21px 16px; }
    .panel-card h2, .compare-card h2 { font-size: 24px; }
    .saved-item { grid-template-columns: 76px 1fr auto; gap: 10px; }
    .saved-item > img { width: 76px; height: 67px; }
    .compare-panel { padding: 8px; }
    .compare-card { max-height: calc(100vh - 16px); padding: 17px 13px; border-radius: 18px; }
    .compare-card > footer { align-items: flex-start; }
    .compare-dock { left: 10px; right: 10px; bottom: 10px; justify-content: space-between; transform: none; border-radius: 18px; }
    .compare-dock button { padding-inline: 12px; }
    .floating-whatsapp { bottom: 80px; }
    .toast { bottom: 135px; }
}

/* Nested panel footers should not inherit the site footer skin. */
.panel-card > footer,
.compare-card > footer {
    padding: 18px 0 0;
    background: transparent;
    color: inherit;
}

/* Mobile web shell with an app-like presentation */
.mobile-app-header,
.mobile-bottom-nav { display: none; }

@media (max-width: 767px) {
    :root {
        --mobile-header-height: 70px;
        --mobile-nav-height: 72px;
        --mobile-page-pad: 12px;
        --radius-app: 22px;
    }

    html {
        scroll-padding-top: calc(var(--mobile-header-height) + env(safe-area-inset-top) + 14px);
        scroll-padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 20px);
    }

    body {
        min-height: 100dvh;
        padding-top: calc(var(--mobile-header-height) + env(safe-area-inset-top));
        padding-bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
        background:
            radial-gradient(circle at 85% 8%, rgba(32,214,211,.11), transparent 29%),
            #eef4f5;
        overscroll-behavior-y: none;
    }

    .site-header { display: none; }
    .skip-link { top: calc(8px + env(safe-area-inset-top)); }
    .container { width: min(100% - 24px, 520px); }

    .mobile-app-header {
        position: fixed;
        inset: 0 0 auto;
        z-index: 110;
        min-height: calc(var(--mobile-header-height) + env(safe-area-inset-top));
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 14px;
        padding: env(safe-area-inset-top) 14px 0;
        border-bottom: 1px solid rgba(6,31,40,.08);
        background: rgba(247,250,250,.88);
        box-shadow: 0 8px 28px rgba(6,31,40,.05);
        backdrop-filter: blur(22px) saturate(1.25);
        -webkit-backdrop-filter: blur(22px) saturate(1.25);
    }

    .mobile-app-brand {
        min-width: 0;
        display: flex;
        align-items: center;
        gap: 10px;
    }

    .mobile-app-brand img {
        width: 43px;
        height: 43px;
        flex: 0 0 auto;
        object-fit: contain;
        filter: drop-shadow(0 8px 15px rgba(13,183,184,.15));
    }

    .mobile-app-brand > span { min-width: 0; display: flex; flex-direction: column; }
    .mobile-app-brand small {
        margin-bottom: 2px;
        color: var(--cyan-dark);
        font-size: 7px;
        font-weight: 950;
        letter-spacing: .16em;
        text-transform: uppercase;
    }
    .mobile-app-brand strong {
        overflow: hidden;
        font-size: 16px;
        line-height: 1.1;
        letter-spacing: -.035em;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    .mobile-app-actions { display: flex; align-items: center; gap: 7px; }
    .mobile-header-favorite {
        position: relative;
        width: 42px;
        height: 42px;
        display: grid;
        place-items: center;
        border: 1px solid rgba(6,31,40,.09);
        border-radius: 15px;
        background: #fff;
        color: var(--ink);
        box-shadow: 0 8px 20px rgba(6,31,40,.06);
        cursor: pointer;
    }
    .mobile-header-favorite span { font-size: 20px; line-height: 1; }
    .mobile-header-favorite b {
        position: absolute;
        right: -3px;
        top: -3px;
        min-width: 17px;
        height: 17px;
        display: grid;
        place-items: center;
        padding: 0 4px;
        border: 2px solid #f7fafa;
        border-radius: 999px;
        background: #f15478;
        color: #fff;
        font-size: 7px;
    }

    .hero {
        min-height: 0;
        display: block;
        padding: 14px 0 20px;
    }

    .hero-copy {
        position: relative;
        overflow: hidden;
        padding: 24px 22px 20px;
        border-radius: 29px;
        background:
            radial-gradient(circle at 86% 9%, rgba(63,231,220,.32), transparent 31%),
            radial-gradient(circle at 15% 110%, rgba(52,120,246,.28), transparent 36%),
            linear-gradient(145deg, #062a34, #041a22 72%);
        color: #fff;
        text-align: left;
        box-shadow: 0 22px 48px rgba(4,29,37,.2);
    }

    .hero-copy::after {
        content: "";
        position: absolute;
        width: 150px;
        height: 150px;
        right: -64px;
        bottom: -75px;
        border: 1px solid rgba(255,255,255,.12);
        border-radius: 50%;
        box-shadow: 0 0 0 24px rgba(255,255,255,.03), 0 0 0 48px rgba(255,255,255,.025);
        pointer-events: none;
    }

    .eyebrow {
        justify-content: flex-start;
        margin-bottom: 15px;
        color: #a9c7cc;
        font-size: 8px;
    }
    .eyebrow span { background: #65eee5; box-shadow: 0 0 0 5px rgba(101,238,229,.13); }
    .hero h1 {
        max-width: 330px;
        font-size: clamp(34px, 10.5vw, 48px);
        line-height: .98;
        letter-spacing: -.065em;
    }
    .hero h1 em { color: #87a4aa; }
    .hero-copy > p {
        max-width: 330px;
        margin: 17px 0 0;
        color: #b7c9cc;
        font-size: 12px;
        line-height: 1.62;
    }
    .hero-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        margin-top: 20px;
    }
    .hero-actions .btn {
        width: auto;
        min-height: 45px;
        padding: 0 11px;
        font-size: 10px;
    }
    .hero-actions .btn-wa { background: rgba(255,255,255,.12); color: #fff; box-shadow: inset 0 0 0 1px rgba(255,255,255,.13); }
    .hero-facts { gap: 7px; margin-top: 21px; }
    .hero-facts div { padding: 11px 0 0; border-color: rgba(255,255,255,.12); }
    .hero-facts strong { font-size: 16px; }
    .hero-facts span { color: #91aaae; font-size: 7px; }
    .hero-visual { display: none; }

    .trust-strip {
        border: 0;
        background: transparent;
    }
    .trust-items {
        min-height: 56px;
        gap: 8px;
        padding: 6px 0;
    }
    .trust-items span {
        flex: 0 0 auto;
        padding: 10px 13px;
        border: 1px solid rgba(6,31,40,.08);
        border-radius: 999px;
        background: rgba(255,255,255,.86);
        box-shadow: 0 8px 18px rgba(6,31,40,.04);
        color: #51696e;
        font-size: 8px;
        letter-spacing: .08em;
    }
    .trust-items i { display: none; }

    .products-section { padding: 24px 0 50px; }
    .section-heading { margin-bottom: 16px; }
    .section-heading .section-kicker { font-size: 8px; }
    .section-heading h2 {
        max-width: 330px;
        margin-top: 7px;
        font-size: 28px;
        line-height: 1.04;
        letter-spacing: -.05em;
    }
    .section-heading > p { display: none; }

    .toolbar {
        position: sticky;
        top: calc(var(--mobile-header-height) + env(safe-area-inset-top));
        z-index: 62;
        display: grid;
        grid-template-columns: minmax(0,1fr) 118px;
        align-items: stretch;
        gap: 8px;
        margin: 0 -5px 14px;
        padding: 9px 5px 11px;
        border: 0;
        border-radius: 0 0 20px 20px;
        background: rgba(238,244,245,.9);
        box-shadow: 0 12px 20px rgba(6,31,40,.025);
        backdrop-filter: blur(18px);
        -webkit-backdrop-filter: blur(18px);
    }
    .toolbar .search-box {
        grid-column: 1 / -1;
        grid-row: 1;
        min-height: 48px;
        order: -3;
        padding: 0 15px;
        border: 1px solid rgba(6,31,40,.09);
        border-radius: 16px;
        box-shadow: 0 8px 22px rgba(6,31,40,.045);
    }
    .search-box span { font-size: 20px; }
    .search-box input { font-size: 12px; }
    .filter-block { order: -2; }
    .category-filter { order: -1; }
    .filter-label { display: none; }
    .filter-chips {
        flex-wrap: nowrap;
        gap: 6px;
        overflow-x: auto;
        padding: 1px 0 3px;
        scroll-snap-type: x proximity;
        scrollbar-width: none;
    }
    .filter-chips::-webkit-scrollbar { display: none; }
    .chip {
        min-height: 40px;
        flex: 0 0 auto;
        scroll-snap-align: start;
        padding: 0 13px;
        border-color: rgba(6,31,40,.09);
        background: #fff;
        font-size: 9px;
    }
    .select-wrap,
    .select-wrap select { width: 100%; }
    .select-wrap select {
        min-width: 0;
        min-height: 40px;
        padding-left: 12px;
        border-color: rgba(6,31,40,.09);
        border-radius: 13px;
        font-size: 9px;
    }

    .collection-tip {
        grid-template-columns: 1fr 1fr;
        gap: 8px;
        margin: 0 0 14px;
        padding: 0;
        border: 0;
        background: transparent;
    }
    .collection-tip > div {
        min-height: 68px;
        display: flex;
        align-items: center;
        gap: 8px;
        padding: 10px;
        border: 1px solid rgba(6,31,40,.08);
        border-radius: 17px;
        background: #fff;
        box-shadow: 0 9px 22px rgba(6,31,40,.04);
    }
    .collection-tip > div > span {
        width: 32px;
        height: 32px;
        flex: 0 0 auto;
        box-shadow: none;
        background: #eaf8f8;
        color: var(--cyan-dark);
    }
    .collection-tip p { font-size: 8px; line-height: 1.4; }
    .collection-tip .text-button { display: none; }

    .product-grid {
        grid-template-columns: repeat(2, minmax(0,1fr));
        gap: 10px;
    }
    .product-card {
        border: 0;
        border-radius: 19px;
        background: #fff;
        box-shadow: 0 9px 25px rgba(6,31,40,.065);
    }
    .product-card:hover { transform: none; box-shadow: 0 9px 25px rgba(6,31,40,.065); }
    .product-image {
        aspect-ratio: 1 / 1;
        margin: 6px;
        border-radius: 15px;
    }
    .product-topline { left: 7px; right: 7px; top: 7px; }
    .badge { padding: 6px 7px; font-size: 6px; }
    .mode-badge { display: none; }
    .quick-view {
        width: 34px;
        min-height: 34px;
        right: 8px;
        bottom: 8px;
        padding: 0;
        overflow: hidden;
        font-size: 0;
    }
    .quick-view::before { content: "↗"; font-size: 15px; font-weight: 900; }
    .product-card-tools { left: 8px; bottom: 8px; gap: 5px; }
    .card-tool { width: 32px; height: 32px; box-shadow: 0 7px 18px rgba(6,31,40,.13); }
    .card-tool span { font-size: 13px; }
    .product-content { padding: 8px 10px 11px; }
    .product-meta { gap: 5px; font-size: 6px; letter-spacing: .045em; }
    .product-card h3 {
        min-height: 34px;
        display: -webkit-box;
        overflow: hidden;
        margin: 7px 0 5px;
        font-size: 13px;
        line-height: 1.28;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    .product-card p { display: none; }
    .price-row { margin-top: 8px; padding-top: 8px; }
    .price-row strong { font-size: 13px; }
    .price-row del { font-size: 7px; }
    .discount { padding: 5px 6px; font-size: 6px; }
    .product-actions { gap: 5px; margin-top: 9px; }
    .product-actions .btn {
        min-height: 35px;
        padding: 0 6px;
        border-radius: 11px;
        font-size: 7px;
        line-height: 1.1;
    }

    .steps-section { padding: 52px 0 58px; }
    .steps-section .section-heading > p { display: block; margin-top: 12px; font-size: 10px; }
    .steps-grid {
        display: flex;
        gap: 10px;
        overflow-x: auto;
        margin-right: -12px;
        padding-right: 12px;
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
    }
    .steps-grid::-webkit-scrollbar { display: none; }
    .step-card {
        min-width: min(78vw, 300px);
        min-height: 190px;
        flex: 0 0 auto;
        padding: 22px;
        border-radius: 22px;
        scroll-snap-align: start;
    }
    .step-card h3 { margin-top: 39px; font-size: 19px; }
    .step-card p { font-size: 10px; }

    .security-section { padding: 48px 0; }
    .security-panel { gap: 22px; padding: 23px 18px; border-radius: 26px; }
    .security-copy h2 { margin: 8px 0 13px; font-size: 30px; }
    .security-copy p { font-size: 11px; }
    .security-list { gap: 7px; }
    .security-list > div { grid-template-columns: 34px 1fr; padding: 12px; border-radius: 15px; }
    .security-list p { font-size: 9px; }

    .disclosure {
        padding: 22px 18px;
        margin-bottom: 45px;
        border-radius: 23px;
        text-align: left;
    }
    .disclosure img { width: 70px; height: 70px; margin: 0; }
    .disclosure h2 { font-size: 23px; }
    .disclosure p { font-size: 9px; }
    .disclosure .btn { width: 100%; }

    footer { padding: 34px 0 calc(28px + env(safe-area-inset-bottom)); }
    .footer-main { padding-bottom: 24px; }
    .footer-links { display: none; }
    .footer-bottom { padding-top: 16px; }

    .modal {
        align-items: end;
        padding: 0;
    }
    .modal-backdrop { background: rgba(2,18,23,.62); }
    .modal-panel {
        width: 100%;
        max-height: min(91dvh, 760px);
        grid-template-columns: 1fr;
        overflow-y: auto;
        border-radius: 28px 28px 0 0;
        padding-bottom: env(safe-area-inset-bottom);
        transform: translateY(100%);
        box-shadow: 0 -20px 65px rgba(0,0,0,.25);
    }
    .modal.is-open .modal-panel { transform: translateY(0); }
    .modal-panel::before {
        content: "";
        position: absolute;
        z-index: 5;
        left: 50%;
        top: 9px;
        width: 44px;
        height: 5px;
        border-radius: 999px;
        background: rgba(6,31,40,.18);
        transform: translateX(-50%);
    }
    .modal-close { top: 15px; right: 15px; }
    .modal-image-wrap { min-height: 215px; max-height: 235px; }
    .modal-content { padding: 22px 18px 18px; }
    .modal-content h2 { margin: 7px 0 9px; font-size: 27px; }
    .modal-content > p { font-size: 11px; }
    .modal-collection-actions { grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 13px; }
    .collection-button { min-height: 40px; padding: 0 8px; border-radius: 13px; font-size: 8px; }
    .modal-order { margin-top: 15px; padding: 14px 0; }
    .modal-actions {
        position: sticky;
        bottom: 0;
        z-index: 2;
        grid-template-columns: 1fr 1fr;
        margin: 15px -18px -18px;
        padding: 12px 18px calc(12px + env(safe-area-inset-bottom));
        background: rgba(255,255,255,.95);
        box-shadow: 0 -10px 24px rgba(6,31,40,.06);
        backdrop-filter: blur(15px);
    }
    .modal-actions .btn { border-radius: 13px; }
    .order-note { margin-bottom: 70px; }

    .side-panel,
    .compare-panel {
        display: flex;
        align-items: flex-end;
        padding: 0;
    }
    .panel-backdrop { background: rgba(2,18,23,.62); }
    .panel-card,
    .compare-card {
        position: relative;
        inset: auto;
        width: 100%;
        height: min(82dvh, 720px);
        max-height: none;
        padding: 22px 16px calc(16px + env(safe-area-inset-bottom));
        border-radius: 28px 28px 0 0;
        background: #fff;
        transform: translateY(100%);
        box-shadow: 0 -20px 65px rgba(0,0,0,.24);
    }
    .side-panel.is-open .panel-card,
    .compare-panel.is-open .compare-card { transform: translateY(0); }
    .panel-card::before,
    .compare-card::before {
        content: "";
        position: absolute;
        left: 50%;
        top: 8px;
        width: 43px;
        height: 5px;
        border-radius: 999px;
        background: rgba(6,31,40,.17);
        transform: translateX(-50%);
    }
    .panel-card > header,
    .compare-card > header { padding-top: 7px; }
    .panel-card h2,
    .compare-card h2 { font-size: 24px; }
    .saved-item { grid-template-columns: 72px 1fr auto; }
    .saved-item > img { width: 72px; height: 66px; }
    .compare-content { padding-top: 12px; }
    .comparison-table { min-width: 720px; }

    .floating-whatsapp { display: none; }
    .compare-dock {
        left: 12px;
        right: 12px;
        bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 10px);
        z-index: 96;
        justify-content: space-between;
        gap: 8px;
        border-radius: 18px;
        transform: none;
    }
    .compare-dock button { min-height: 39px; border-radius: 13px; }
    .toast {
        bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 18px);
        border-radius: 16px;
    }

    .mobile-bottom-nav {
        position: fixed;
        inset: auto 0 0;
        z-index: 105;
        min-height: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
        display: grid;
        grid-template-columns: repeat(5, minmax(0,1fr));
        align-items: start;
        padding: 7px 5px env(safe-area-inset-bottom);
        border-top: 1px solid rgba(6,31,40,.09);
        background: rgba(250,252,252,.93);
        box-shadow: 0 -12px 30px rgba(6,31,40,.07);
        backdrop-filter: blur(22px) saturate(1.25);
        -webkit-backdrop-filter: blur(22px) saturate(1.25);
    }
    .mobile-nav-item {
        position: relative;
        min-width: 0;
        min-height: 58px;
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 4px;
        border: 0;
        background: transparent;
        color: #73868a;
        font-size: 7px;
        font-weight: 850;
        cursor: pointer;
        transition: color .2s ease, transform .2s ease;
    }
    .mobile-nav-item:active { transform: scale(.94); }
    .mobile-nav-item svg {
        width: 22px;
        height: 22px;
        fill: currentColor;
    }
    .mobile-nav-item > span:last-child { line-height: 1; }
    .mobile-nav-item.active { color: var(--ink); }
    .mobile-nav-item.active::before {
        content: "";
        position: absolute;
        top: -7px;
        width: 28px;
        height: 3px;
        border-radius: 0 0 999px 999px;
        background: var(--cyan-dark);
    }
    .mobile-nav-icon-wrap { position: relative; display: grid; place-items: center; }
    .mobile-nav-icon-wrap b {
        position: absolute;
        right: -9px;
        top: -7px;
        min-width: 16px;
        height: 16px;
        display: grid;
        place-items: center;
        padding: 0 4px;
        border: 2px solid #fafcfc;
        border-radius: 999px;
        background: var(--ink);
        color: #fff;
        font-size: 6px;
    }


}

@media (max-width: 370px) {
    .mobile-app-brand strong { font-size: 14px; }
    .mobile-app-header { padding-inline: 10px; }
    .hero-copy { padding-inline: 18px; }
    .hero h1 { font-size: 33px; }
    .product-grid { gap: 8px; }
    .product-content { padding-inline: 8px; }
    .product-card h3 { font-size: 12px; }
    .product-actions .btn { font-size: 6.5px; }
}

/* Public utility controls and responsive security page */
.scroll-top {
    position: fixed;
    right: 22px;
    bottom: 82px;
    z-index: 94;
    width: 46px;
    height: 46px;
    display: grid;
    place-items: center;
    border: 1px solid rgba(255,255,255,.22);
    border-radius: 15px;
    background: rgba(6,31,40,.94);
    color: #fff;
    box-shadow: 0 15px 38px rgba(0,0,0,.22);
    font-size: 20px;
    font-weight: 900;
    cursor: pointer;
    opacity: 0;
    pointer-events: none;
    transform: translateY(14px);
    transition: opacity .22s ease, transform .22s ease, background .22s ease;
    backdrop-filter: blur(12px);
}
.scroll-top.visible { opacity: 1; pointer-events: auto; transform: translateY(0); }
.scroll-top:hover { background: var(--cyan-dark); transform: translateY(-3px); }

.legal-body { background: #f3f8f8; }
.legal-hero {
    min-height: 600px;
    display: grid;
    grid-template-columns: minmax(0,1.08fr) minmax(360px,.72fr);
    align-items: center;
    gap: 72px;
    padding-block: 82px 90px;
}
.legal-hero h1 {
    max-width: 760px;
    margin: 12px 0 22px;
    font-size: clamp(48px, 6vw, 78px);
    line-height: .98;
    letter-spacing: -.067em;
}
.legal-hero-copy > p { max-width: 690px; color: var(--muted); font-size: 16px; line-height: 1.8; }
.legal-hero-actions { display: flex; flex-wrap: wrap; gap: 11px; margin-top: 29px; }
.legal-security-card {
    position: relative;
    overflow: hidden;
    padding: 31px;
    border: 1px solid rgba(255,255,255,.16);
    border-radius: 30px;
    background: radial-gradient(circle at 95% 0,rgba(32,214,211,.26),transparent 38%),linear-gradient(145deg,#05242e,#0a4d55);
    color: #fff;
    box-shadow: 0 28px 70px rgba(5,39,48,.24);
}
.legal-security-card::after { content:""; position:absolute; right:-74px; bottom:-92px; width:220px; height:220px; border:1px solid rgba(255,255,255,.11); border-radius:50%; }
.legal-shield { width: 64px; height: 64px; display:grid; place-items:center; margin-bottom:35px; border-radius:21px; background:linear-gradient(135deg,var(--cyan),#7bf2dc); color:#05262c; font-size:27px; font-weight:950; box-shadow:0 16px 38px rgba(32,214,211,.23); }
.legal-security-card > span { display:block; color:#9bded8; font-size:10px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; }
.legal-security-card > strong { display:block; margin:7px 0 22px; font-size:27px; letter-spacing:-.035em; }
.legal-security-card ul { display:grid; gap:12px; margin:0; padding:0; list-style:none; color:#d2e8e6; font-size:12px; }
.legal-security-card li { position:relative; padding-left:22px; }
.legal-security-card li::before { content:"✓"; position:absolute; left:0; color:#5fe0bd; font-weight:950; }
.legal-stat-strip { border-block:1px solid var(--line); background:rgba(255,255,255,.58); }
.legal-stat-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); }
.legal-stat-grid article { min-height:112px; display:flex; flex-direction:column; justify-content:center; padding:20px 28px; border-right:1px solid var(--line); }
.legal-stat-grid article:last-child { border-right:0; }
.legal-stat-grid strong { font-size:25px; letter-spacing:-.045em; }
.legal-stat-grid span { margin-top:5px; color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.09em; font-weight:800; }
.legal-content { padding-block:110px; }
.legal-section-heading { max-width:820px; margin-bottom:43px; }
.legal-section-heading h2 { margin:10px 0 15px; font-size:clamp(39px,5vw,62px); line-height:1.02; letter-spacing:-.06em; }
.legal-section-heading p { max-width:700px; margin:0; color:var(--muted); font-size:14px; line-height:1.75; }
.legal-card-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.legal-info-card { min-height:270px; padding:27px; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:0 14px 42px rgba(6,31,40,.055); transition:transform .25s ease,box-shadow .25s ease; }
.legal-info-card:hover { transform:translateY(-4px); box-shadow:0 22px 55px rgba(6,31,40,.09); }
.legal-info-card > span { width:42px; height:42px; display:grid; place-items:center; border-radius:14px; background:#e6f7f4; color:#087b7b; font-size:10px; font-weight:950; }
.legal-info-card h3 { margin:45px 0 10px; font-size:20px; letter-spacing:-.03em; }
.legal-info-card p { margin:0; color:var(--muted); font-size:12px; line-height:1.75; }
.legal-privacy-section { padding:100px 0; background:linear-gradient(140deg,#061f28,#093b44); color:#fff; }
.legal-split { display:grid; grid-template-columns:minmax(0,1fr) minmax(360px,.85fr); gap:75px; align-items:center; }
.legal-split h2 { margin:10px 0 18px; font-size:clamp(39px,5vw,62px); line-height:1.02; letter-spacing:-.06em; }
.legal-split > div:first-child p { color:#b8d0d2; font-size:14px; line-height:1.8; }
.privacy-do-dont { display:grid; gap:12px; }
.privacy-do-dont article { display:grid; grid-template-columns:46px 1fr; gap:14px; padding:20px; border:1px solid rgba(255,255,255,.13); border-radius:20px; background:rgba(255,255,255,.055); }
.privacy-do-dont article > span { width:46px; height:46px; display:grid; place-items:center; border-radius:15px; background:rgba(32,214,211,.14); color:#72ebcf; font-size:20px; font-weight:950; }
.privacy-do-dont strong { font-size:15px; }
.privacy-do-dont p { margin:5px 0 0; color:#aac6c8; font-size:11px; line-height:1.65; }
.transaction-checklist { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }
.transaction-checklist > div { display:grid; grid-template-columns:48px 1fr; gap:14px; align-items:center; padding:20px; border:1px solid var(--line); border-radius:20px; background:#fff; }
.transaction-checklist b { width:48px; height:48px; display:grid; place-items:center; border-radius:16px; background:var(--ink); color:#fff; }
.transaction-checklist span { display:grid; }
.transaction-checklist strong { font-size:14px; }
.transaction-checklist small { margin-top:4px; color:var(--muted); font-size:10px; line-height:1.5; }
.official-contact-card { display:grid; grid-template-columns:76px 1fr auto; gap:20px; align-items:center; margin-top:18px; padding:22px; border-radius:24px; background:linear-gradient(135deg,#dff8f3,#eefafa); border:1px solid #c6e8e2; }
.official-contact-card img { width:76px; height:76px; object-fit:contain; }
.official-contact-card div { display:grid; }
.official-contact-card span { color:#477076; font-size:9px; text-transform:uppercase; letter-spacing:.1em; font-weight:850; }
.official-contact-card strong { margin:4px 0; font-size:22px; }
.official-contact-card p { margin:0; color:var(--muted); font-size:10px; }
.legal-source-note { margin-bottom:100px; padding:30px; border:1px solid #ecd5a8; border-radius:24px; background:#fff8e9; }
.legal-source-note h2 { margin:0 0 9px; font-size:22px; }
.legal-source-note p { margin:0; color:#735b2e; font-size:12px; line-height:1.75; }
.legal-mobile-nav { display:none; }
.mobile-back-button,.mobile-security-wa { display:none; }

@media (max-width: 980px) {
    .legal-hero { grid-template-columns:1fr; gap:34px; min-height:auto; }
    .legal-security-card { max-width:620px; }
    .legal-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
    .legal-split { grid-template-columns:1fr; gap:40px; }
}

@media (max-width: 767px) {
    .scroll-top { right:13px; bottom:calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 16px); width:43px; height:43px; border-radius:14px; }
    .legal-body { padding-bottom:calc(72px + env(safe-area-inset-bottom)); overscroll-behavior-y:auto; }
    .legal-mobile-header { justify-content:flex-start; }
    .legal-mobile-header .mobile-app-brand { flex:1; }
    .mobile-back-button,.mobile-security-wa { display:grid; place-items:center; flex:0 0 auto; width:42px; height:42px; border:1px solid rgba(6,31,40,.09); border-radius:15px; background:#fff; box-shadow:0 8px 20px rgba(6,31,40,.06); font-weight:900; }
    .mobile-security-wa { background:var(--wa); color:#062518; font-size:9px; }
    .legal-hero { width:100%; padding:28px 12px 44px; gap:18px; }
    .legal-hero-copy { padding:27px 20px; border-radius:27px; background:linear-gradient(145deg,#fff,#f5fbfa); box-shadow:0 12px 34px rgba(6,31,40,.06); }
    .legal-hero h1 { margin:10px 0 15px; font-size:37px; line-height:1.01; }
    .legal-hero-copy > p { font-size:13px; line-height:1.7; }
    .legal-hero-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:21px; }
    .legal-hero-actions .btn { min-width:0; padding-inline:10px; font-size:10px; }
    .legal-security-card { padding:24px; border-radius:25px; }
    .legal-shield { width:54px; height:54px; margin-bottom:27px; border-radius:18px; }
    .legal-security-card > strong { font-size:23px; }
    .legal-security-card ul { font-size:11px; }
    .legal-stat-strip { margin-inline:12px; border:0; border-radius:22px; overflow:hidden; background:#fff; box-shadow:0 10px 29px rgba(6,31,40,.055); }
    .legal-stat-grid { width:100%; grid-template-columns:repeat(2,1fr); }
    .legal-stat-grid article { min-height:90px; padding:15px; border-right:1px solid var(--line); border-bottom:1px solid var(--line); }
    .legal-stat-grid article:nth-child(2n) { border-right:0; }
    .legal-stat-grid article:nth-last-child(-n+2) { border-bottom:0; }
    .legal-stat-grid strong { font-size:20px; }
    .legal-stat-grid span { font-size:8px; }
    .legal-content { padding-block:64px; }
    .legal-section-heading { margin-bottom:25px; }
    .legal-section-heading h2 { font-size:34px; }
    .legal-section-heading p { font-size:12px; }
    .legal-card-grid { grid-template-columns:1fr; gap:10px; }
    .legal-info-card { min-height:0; padding:21px; border-radius:20px; }
    .legal-info-card h3 { margin:25px 0 8px; font-size:18px; }
    .legal-info-card p { font-size:11px; }
    .legal-privacy-section { padding:62px 0; }
    .legal-split { gap:27px; }
    .legal-split h2 { font-size:35px; }
    .legal-split > div:first-child p { font-size:12px; }
    .privacy-do-dont article { grid-template-columns:40px 1fr; padding:16px; border-radius:17px; }
    .privacy-do-dont article > span { width:40px; height:40px; border-radius:13px; }
    .transaction-checklist { grid-template-columns:1fr; gap:9px; }
    .transaction-checklist > div { padding:16px; grid-template-columns:43px 1fr; border-radius:17px; }
    .transaction-checklist b { width:43px; height:43px; border-radius:14px; }
    .official-contact-card { grid-template-columns:58px 1fr; padding:18px; border-radius:20px; }
    .official-contact-card img { width:58px; height:58px; }
    .official-contact-card strong { font-size:18px; }
    .official-contact-card .btn { grid-column:1/-1; width:100%; }
    .legal-source-note { margin-bottom:55px; padding:21px; border-radius:20px; }
    .legal-source-note h2 { font-size:19px; }
    .legal-source-note p { font-size:11px; }
    .legal-mobile-nav { position:fixed; inset:auto 0 0; z-index:105; min-height:calc(72px + env(safe-area-inset-bottom)); display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); padding:7px 6px env(safe-area-inset-bottom); border-top:1px solid rgba(6,31,40,.09); background:rgba(250,252,252,.94); box-shadow:0 -12px 30px rgba(6,31,40,.07); backdrop-filter:blur(22px); }
    .legal-mobile-nav a { position:relative; min-height:58px; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; color:#718589; font-weight:850; }
    .legal-mobile-nav a > span { width:25px; height:25px; display:grid; place-items:center; font-size:17px; font-weight:950; }
    .legal-mobile-nav a > small { font-size:9px; }
    .legal-mobile-nav a.active { color:var(--ink); }
    .legal-mobile-nav a.active::before { content:""; position:absolute; top:-7px; width:30px; height:3px; border-radius:0 0 99px 99px; background:var(--cyan-dark); }

    /* Improve mobile readability and touch targets on the catalog. */
    .badge { font-size:8px; }
    .product-meta { font-size:9px; }
    .product-card h3 { min-height:36px; font-size:14px; }
    .price-row strong { font-size:14px; }
    .price-row del { font-size:9px; }
    .discount { font-size:8px; }
    .product-actions .btn { min-height:39px; font-size:9px; }
    .collection-tip p,.security-list p,.disclosure p { font-size:11px; }
    .mobile-nav-item { font-size:9px; }
    .mobile-nav-icon-wrap b { font-size:7px; }
    .card-tool,.quick-view,.mobile-header-favorite { min-width:40px; min-height:40px; }
}

@media (max-width: 390px) {
    .legal-hero-actions { grid-template-columns:1fr; }
    .legal-hero h1 { font-size:34px; }
    .legal-mobile-header .mobile-app-brand strong { font-size:14px; }
    .legal-mobile-nav a > small { font-size:8px; }
    .product-card h3 { font-size:13px; }
    .product-actions .btn { font-size:8px; }
}
@media (max-width: 767px) {
    body.has-compare-dock .scroll-top { bottom: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom) + 86px); }
}

/* Affilia Channel v3: compact storefront and scheduled promo */
body.promo-open { overflow: hidden; }
.hero-compact { min-height: 620px; padding-block: 64px 76px; }
.hero-compact .hero-copy > p { max-width: 510px; }
.hero-compact .hero-visual { min-height: 500px; }
.catalog-heading { display:flex; align-items:end; justify-content:space-between; gap:24px; margin-bottom:24px; }
.catalog-heading h2 { margin:7px 0 0; font-size:clamp(36px,4vw,54px); line-height:1; letter-spacing:-.055em; }
.catalog-heading > span { padding:9px 13px; border:1px solid var(--line); border-radius:999px; background:#fff; color:var(--muted); font-size:10px; font-weight:850; }
.products-section { padding-top:82px; }
.recommended-badge { margin-left:auto; padding:8px 10px; border-radius:999px; background:#061f28; color:#fff; font-size:8px; font-weight:900; letter-spacing:.04em; }
.product-recommendation { min-height:42px !important; display:-webkit-box; overflow:hidden; color:#536c71 !important; font-size:10px !important; line-height:1.55 !important; -webkit-box-orient:vertical; -webkit-line-clamp:2; }
.product-meta small { font-size:.85em; font-weight:700; }
.essential-note { display:flex; align-items:center; justify-content:space-between; gap:24px; margin-bottom:70px; padding:20px 24px; border:1px solid var(--line); border-radius:20px; background:#fff; }
.essential-note p { margin:0; color:var(--muted); font-size:11px; line-height:1.6; }
.essential-note p strong { color:var(--ink); }
.essential-note a { flex:0 0 auto; font-size:11px; font-weight:900; }
.modal-meta-line { display:flex; align-items:center; justify-content:space-between; gap:16px; }
.modal-rating { color:#e29512; font-size:11px; font-weight:900; }
.modal-recommendation { margin:0 0 12px !important; padding:11px 13px; border-radius:13px; background:#edf8f7; color:#315b5f !important; font-size:11px !important; font-weight:750; line-height:1.5 !important; }

.promo-intro { position:fixed; inset:0; z-index:300; display:grid; place-items:center; padding:20px; visibility:hidden; opacity:0; transition:opacity .28s ease, visibility .28s ease; }
.promo-intro.is-open { visibility:visible; opacity:1; }
.promo-intro-backdrop { position:absolute; inset:0; border:0; background:rgba(2,20,27,.62); backdrop-filter:blur(12px); -webkit-backdrop-filter:blur(12px); }
.promo-intro-card { position:relative; z-index:1; width:min(430px,100%); overflow:hidden; padding:34px 32px 30px; border:1px solid rgba(255,255,255,.78); border-radius:30px; background:linear-gradient(155deg,#fff,#edf9f8); box-shadow:0 35px 100px rgba(2,20,27,.28); text-align:center; transform:translateY(22px) scale(.96); opacity:0; transition:transform .5s cubic-bezier(.2,.85,.2,1), opacity .35s ease; }
.promo-intro.is-open .promo-intro-card { transform:translateY(0) scale(1); opacity:1; }
.promo-intro-card > img { width:72px; height:72px; margin:0 auto 12px; object-fit:contain; filter:drop-shadow(0 12px 20px rgba(13,183,184,.18)); animation:promoLogo 2.8s ease-in-out infinite; }
.promo-intro-card > span { display:inline-flex; padding:7px 10px; border-radius:999px; background:#d8f8f4; color:#087f83; font-size:8px; font-weight:950; letter-spacing:.12em; text-transform:uppercase; }
.promo-intro-card h2 { margin:15px auto 10px; max-width:350px; font-size:32px; line-height:1.05; letter-spacing:-.055em; }
.promo-intro-card > p { margin:0 auto 20px; max-width:340px; color:var(--muted); font-size:12px; line-height:1.65; }
.promo-intro-card > .btn { width:100%; min-height:50px; }
.promo-close { position:absolute; right:15px; top:15px; width:39px; height:39px; display:grid; place-items:center; border:1px solid rgba(6,31,40,.09); border-radius:50%; background:rgba(255,255,255,.82); color:var(--ink); font-size:21px; cursor:pointer; }
.promo-code { width:100%; min-height:58px; display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto; align-items:center; margin:0 0 12px; padding:10px 14px; border:1px dashed rgba(13,183,184,.5); border-radius:15px; background:#fff; text-align:left; cursor:pointer; }
.promo-code small { color:var(--muted); font-size:8px; font-weight:850; text-transform:uppercase; letter-spacing:.1em; }
.promo-code strong { grid-row:2; font-size:16px; letter-spacing:.08em; }
.promo-code em { grid-column:2; grid-row:1/3; font-style:normal; color:var(--cyan-dark); font-size:10px; font-weight:900; }
.promo-code.copied em::after { content:' ✓'; }
.promo-spark i { position:absolute; width:8px; height:8px; border-radius:2px; background:var(--cyan); animation:promoSpark 2.5s ease-in-out infinite; }
.promo-spark i:nth-child(1){left:12%;top:18%;transform:rotate(22deg)}
.promo-spark i:nth-child(2){right:13%;top:24%;background:#3478f6;animation-delay:-.6s}
.promo-spark i:nth-child(3){left:20%;bottom:22%;background:#22c76f;animation-delay:-1.2s}
.promo-spark i:nth-child(4){right:17%;bottom:19%;width:6px;height:6px;animation-delay:-1.8s}
.promo-spark i:nth-child(5){left:50%;top:9%;width:5px;height:5px;background:#f0ad35;animation-delay:-.9s}
@keyframes promoLogo { 0%,100%{transform:translateY(0) rotate(0)} 50%{transform:translateY(-5px) rotate(2deg)} }
@keyframes promoSpark { 0%,100%{opacity:.3;transform:translateY(5px) rotate(0) scale(.8)} 50%{opacity:1;transform:translateY(-8px) rotate(140deg) scale(1.15)} }

@media (max-width: 767px) {
    .hero-compact { padding:12px 0 14px; }
    .hero-compact .hero-copy { padding:21px 18px 19px; border-radius:24px; }
    .hero-compact .hero-copy > p { margin-top:13px; font-size:11px; }
    .hero-compact .hero-actions { margin-top:17px; }
    .products-section { padding-top:18px; }
    .catalog-heading { align-items:center; margin-bottom:10px; }
    .catalog-heading .section-kicker { font-size:7px; }
    .catalog-heading h2 { margin-top:4px; font-size:25px; }
    .catalog-heading > span { padding:7px 10px; font-size:8px; }
    .toolbar { margin-bottom:10px; }
    .product-recommendation { min-height:0 !important; margin:3px 0 0 !important; font-size:9px !important; -webkit-line-clamp:1; }
    .recommended-badge { padding:6px 7px; font-size:6px; }
    .essential-note { display:block; margin-bottom:28px; padding:15px 16px; border-radius:17px; }
    .essential-note p { font-size:9px; }
    .essential-note a { display:inline-block; margin-top:9px; font-size:9px; }
    .promo-intro { align-items:end; padding:0; }
    .promo-intro-card { width:100%; padding:28px 20px calc(24px + env(safe-area-inset-bottom)); border-radius:28px 28px 0 0; transform:translateY(100%); }
    .promo-intro.is-open .promo-intro-card { transform:translateY(0); }
    .promo-intro-card h2 { font-size:28px; }
    .promo-intro-card > p { font-size:11px; }
    .promo-close { right:13px; top:13px; }
    .modal-meta-line { align-items:flex-start; }
    .modal-rating { font-size:9px; }
    .modal-recommendation { font-size:10px !important; }
}

@media (max-width: 390px) {
    .hero-compact .hero-copy { padding-inline:16px; }
    .hero-compact h1 { font-size:34px; }
    .catalog-heading h2 { font-size:23px; }
    .product-recommendation { display:none; }
}

@media (prefers-reduced-motion: reduce) {
    .promo-intro-card, .promo-intro, .promo-intro-card > img, .promo-spark i { animation:none !important; transition:none !important; }
}

/* Berita dan artikel SEO */
.news-page,.article-page{background:#f4f8f7;color:var(--ink)}
.news-hero{padding-top:92px;padding-bottom:38px;max-width:920px;text-align:center}
.news-hero h1{margin:12px auto 10px;max-width:780px;font-size:clamp(38px,6vw,72px);line-height:.98;letter-spacing:-.055em}
.news-hero p{margin:0 auto;max-width:620px;color:var(--muted);font-size:17px;line-height:1.7}
.news-featured{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:0;overflow:hidden;border:1px solid var(--line);border-radius:30px;background:#fff;box-shadow:var(--shadow)}
.news-featured-image{min-height:430px;background:#e8f1ef}.news-featured-image img{width:100%;height:100%;object-fit:cover;display:block}
.news-featured>div{padding:44px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}
.news-featured>div>span,.news-card>div>span{display:inline-flex;color:var(--cyan-dark);font-size:11px;font-weight:850;letter-spacing:.08em;text-transform:uppercase}
.news-featured h2{font-size:clamp(28px,4vw,46px);line-height:1.06;letter-spacing:-.04em;margin:14px 0}.news-featured h2 a,.news-card h2 a,.home-news article a{color:inherit;text-decoration:none}
.news-featured p{color:var(--muted);line-height:1.7;margin:0 0 16px}.news-featured small,.news-card small{color:#7b8e93}
.news-read-link{margin-top:22px;font-weight:850;color:var(--cyan-dark);text-decoration:none}
.news-list-section{padding-top:72px;padding-bottom:100px}.news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.news-grid.compact{grid-template-columns:repeat(3,minmax(0,1fr))}
.news-card{overflow:hidden;border:1px solid var(--line);border-radius:23px;background:#fff;box-shadow:0 14px 34px rgba(7,36,43,.07);transition:.25s ease}.news-card:hover{transform:translateY(-5px);box-shadow:0 22px 48px rgba(7,36,43,.12)}
.news-card-image{display:block;aspect-ratio:16/9;overflow:hidden;background:#e8f1ef}.news-card-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}.news-card:hover img{transform:scale(1.035)}
.news-card>div{padding:20px}.news-card h2{font-size:20px;line-height:1.3;letter-spacing:-.025em;margin:10px 0}.news-card p{margin:0 0 14px;color:var(--muted);line-height:1.6;font-size:14px}.news-empty{padding:60px 20px;text-align:center;border:1px dashed var(--line);border-radius:24px;background:#fff}
.news-mobile-back{display:none;width:42px;height:42px;border-radius:14px;background:#e3f4f0;color:var(--cyan-dark);align-items:center;justify-content:center;text-decoration:none;font-weight:900}
.article-shell{max-width:920px;padding-top:72px;padding-bottom:70px}.article-head{text-align:center}.article-head nav{display:flex;gap:8px;justify-content:center;align-items:center;flex-wrap:wrap;color:#789096;font-size:12px;margin-bottom:30px}.article-head nav a{color:inherit;text-decoration:none}.article-head h1{font-size:clamp(38px,6vw,70px);line-height:1.02;letter-spacing:-.055em;margin:14px 0 20px}.article-head>p{font-size:18px;line-height:1.7;color:var(--muted);max-width:760px;margin:0 auto}.article-meta{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:22px;color:#768a8f;font-size:12px}.article-cover{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:28px;margin:44px 0 34px;box-shadow:var(--shadow)}
.article-body{max-width:740px;margin:0 auto;font-size:18px;line-height:1.9;color:#263f47}.article-body p{margin:0 0 26px}.article-footer{max-width:740px;margin:44px auto 0;padding:22px;border-radius:18px;background:#e5f5f1;display:flex;align-items:center;justify-content:space-between;gap:16px}.article-footer a{color:var(--cyan-dark);font-weight:850;text-decoration:none}.related-news{padding-bottom:100px}
.home-news{padding-top:20px;padding-bottom:44px}.home-news-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.home-news article{border:1px solid var(--line);border-radius:19px;background:#fff;overflow:hidden;box-shadow:0 10px 25px rgba(7,36,43,.05)}.home-news article a{display:grid;grid-template-columns:120px 1fr;grid-template-rows:auto auto 1fr;column-gap:15px;padding:10px;align-items:center}.home-news article img{grid-row:1/4;width:120px;height:92px;border-radius:13px;object-fit:cover;background:#edf4f2}.home-news article span{color:var(--cyan-dark);font-size:9px;font-weight:850;text-transform:uppercase;letter-spacing:.08em}.home-news article h3{font-size:14px;line-height:1.3;margin:4px 0}.home-news article small{color:#84969a;font-size:9px}.catalog-heading>a{color:var(--cyan-dark);font-weight:800;text-decoration:none;font-size:13px}

@media(max-width:900px){.news-featured{grid-template-columns:1fr}.news-featured-image{min-height:330px}.news-featured>div{padding:30px}.news-grid,.news-grid.compact{grid-template-columns:repeat(2,minmax(0,1fr))}.home-news-grid{grid-template-columns:1fr 1fr}.news-hero{padding-top:65px}.article-shell{padding-top:50px}}
@media(max-width:767px){.news-mobile-back{display:flex}.news-page,.article-page{padding-bottom:calc(78px + env(safe-area-inset-bottom))}.news-hero{padding:34px 18px 26px}.news-hero h1{font-size:36px}.news-hero p{font-size:14px}.news-featured{margin-inline:14px;border-radius:22px}.news-featured-image{min-height:220px}.news-featured>div{padding:22px}.news-featured h2{font-size:28px}.news-list-section{padding:45px 14px 70px}.news-grid,.news-grid.compact{grid-template-columns:1fr}.news-card{border-radius:19px}.news-card>div{padding:17px}.news-card h2{font-size:18px}.article-shell{padding:34px 16px 55px}.article-head{text-align:left}.article-head nav{justify-content:flex-start;margin-bottom:22px}.article-head h1{font-size:37px}.article-head>p{font-size:15px}.article-meta{justify-content:flex-start}.article-cover{margin:30px 0 25px;border-radius:19px}.article-body{font-size:16px;line-height:1.8}.article-footer{display:grid;padding:18px}.related-news{padding:0 14px 65px}.home-news{padding:15px 14px 35px}.home-news-grid{grid-template-columns:1fr}.home-news article a{grid-template-columns:105px 1fr}.home-news article img{width:105px;height:82px}.news-bottom-nav .mobile-nav-item>span:first-child{font-size:19px;font-weight:900}.news-bottom-nav .mobile-nav-item>span:last-child{font-size:8px}}
@media(max-width:390px){.news-hero h1,.article-head h1{font-size:32px}.news-featured>div{padding:18px}.article-meta{gap:8px;font-size:10px}}

/* Affilia Channel v5: multi-campaign, marketplace, and product detail */
.product-content h3 a{color:inherit;text-decoration:none}.product-content h3 a:hover{color:var(--cyan-dark)}
.product-actions .btn-detail{background:#eef5f4;color:var(--ink);border:1px solid rgba(6,31,40,.09)}
.product-actions{flex-wrap:wrap}.product-actions .btn{flex:1;min-width:112px}
.campaign-showcase{margin-top:18px;margin-bottom:54px}.campaign-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:16px}.campaign-head h2{margin:5px 0 0;font-size:30px;letter-spacing:-.045em}.campaign-controls{display:flex;gap:8px}.campaign-controls button{width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--ink);font-size:18px;cursor:pointer}.campaign-controls button:hover{background:var(--ink);color:#fff}.campaign-track{display:flex;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;overscroll-behavior-inline:contain;padding:2px 2px 10px}.campaign-track::-webkit-scrollbar{display:none}.campaign-slide{position:relative;flex:0 0 min(760px,86vw);min-height:270px;display:grid;grid-template-columns:1.08fr .92fr;overflow:hidden;border-radius:28px;background:linear-gradient(135deg,#062d36,#0b7d7c);color:#fff;scroll-snap-align:start;box-shadow:0 22px 52px rgba(5,46,55,.15)}.campaign-slide>img{width:100%;height:100%;min-height:270px;object-fit:cover;filter:saturate(.95)}.campaign-slide>div{display:flex;flex-direction:column;justify-content:center;padding:30px}.campaign-slide span{align-self:flex-start;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.15);font-size:9px;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.campaign-slide h3{margin:14px 0 8px;font-size:29px;line-height:1.06;letter-spacing:-.045em}.campaign-slide p{margin:0;color:rgba(255,255,255,.78);font-size:12px;line-height:1.65}.campaign-slide-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:20px}.campaign-slide-actions a,.campaign-slide-actions button{min-height:42px;padding:10px 14px;border:0;border-radius:12px;background:#fff;color:#082832;text-decoration:none;font-weight:900;cursor:pointer}.campaign-slide-actions button{background:rgba(255,255,255,.14);color:#fff;border:1px dashed rgba(255,255,255,.45)}.campaign-theme-green{background:linear-gradient(135deg,#07472f,#22a55d)}.campaign-theme-blue{background:linear-gradient(135deg,#092c5f,#3478f6)}.campaign-theme-orange{background:linear-gradient(135deg,#6f2f07,#e58b27)}.campaign-theme-dark{background:linear-gradient(135deg,#07141b,#243845)}.promo-intro-card.promo-theme-green{background:linear-gradient(155deg,#fff,#e8f8ee)}.promo-intro-card.promo-theme-blue{background:linear-gradient(155deg,#fff,#edf3ff)}.promo-intro-card.promo-theme-orange{background:linear-gradient(155deg,#fff,#fff3e4)}.promo-intro-card.promo-theme-dark{background:linear-gradient(155deg,#0a2029,#173844);color:#fff;border-color:rgba(255,255,255,.18)}.promo-intro-card.promo-theme-dark>p{color:#c7d8dc}.promo-intro-card>img{width:128px;height:88px;border-radius:18px;object-fit:cover;background:#fff}
.marketplace-section{margin-top:70px}.marketplace-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.marketplace-grid article{display:grid;grid-template-columns:66px 1fr auto;gap:14px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:20px;background:#fff;box-shadow:0 15px 38px rgba(6,31,40,.06);scroll-margin-top:110px}.marketplace-grid img{width:66px;height:66px;object-fit:contain;border-radius:16px;background:#edf6f4;padding:8px}.marketplace-grid h3{margin:0;font-size:16px}.marketplace-grid p{margin:5px 0;color:var(--muted);font-size:10px;line-height:1.5}.marketplace-grid small{color:var(--cyan-dark);font-weight:850}.marketplace-grid>a{padding:9px 11px;border-radius:11px;background:#eef7f5;color:var(--ink);text-decoration:none;font-size:10px;font-weight:900}
.product-detail-page{padding-bottom:70px}.product-breadcrumb{display:flex;align-items:center;gap:8px;padding-top:28px;padding-bottom:20px;color:var(--muted);font-size:11px;white-space:nowrap;overflow:hidden}.product-breadcrumb a{color:inherit;text-decoration:none}.product-breadcrumb strong{overflow:hidden;text-overflow:ellipsis;color:var(--ink)}.product-detail-shell{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(340px,.92fr);gap:46px;align-items:start}.product-gallery{min-width:0}.product-main-image{position:relative;overflow:hidden;border-radius:30px;background:#edf5f3;box-shadow:0 25px 70px rgba(6,31,40,.1)}.product-main-image>img{display:block;width:100%;aspect-ratio:1.2/1;object-fit:cover}.product-main-image>span{position:absolute;left:18px;top:18px;padding:8px 11px;border-radius:999px;background:rgba(255,255,255,.92);font-size:9px;font-weight:950;text-transform:uppercase;letter-spacing:.07em}.product-thumbnails{display:flex;gap:10px;overflow-x:auto;padding:13px 2px 3px;scrollbar-width:thin}.product-thumbnails button{flex:0 0 88px;height:72px;padding:0;overflow:hidden;border:2px solid transparent;border-radius:14px;background:#fff;cursor:pointer}.product-thumbnails button.active{border-color:var(--cyan);box-shadow:0 0 0 3px rgba(13,183,184,.12)}.product-thumbnails img{width:100%;height:100%;object-fit:cover}.product-detail-copy{position:sticky;top:110px;padding:8px 0}.detail-label-row{display:flex;gap:8px;flex-wrap:wrap}.detail-label-row span{padding:7px 10px;border-radius:999px;background:#e8f5f2;color:var(--cyan-dark);font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.product-detail-copy h1{margin:15px 0 10px;font-size:42px;line-height:1.03;letter-spacing:-.055em}.detail-rating{display:flex;gap:10px;align-items:center;color:var(--muted);font-size:11px}.detail-rating strong{color:#d88415}.detail-recommendation{padding:13px 14px;border-left:4px solid var(--cyan);border-radius:0 12px 12px 0;background:#eff9f7;color:#35525b;font-size:12px;line-height:1.55}.detail-price{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:20px 0 14px}.detail-price strong{font-size:31px;letter-spacing:-.04em}.detail-price del{color:#89999e}.detail-price span{padding:6px 8px;border-radius:9px;background:#ffe8e9;color:#a03940;font-size:10px;font-weight:900}.detail-description{color:var(--muted);font-size:13px;line-height:1.75}.detail-info-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin:18px 0}.detail-info-grid>div{padding:12px;border:1px solid var(--line);border-radius:14px;background:#fff}.detail-info-grid small,.detail-info-grid strong{display:block}.detail-info-grid small{color:var(--muted);font-size:8px;text-transform:uppercase;letter-spacing:.08em}.detail-info-grid strong{margin-top:5px;font-size:11px}.detail-marketplace{display:grid;grid-template-columns:54px 1fr;gap:12px;align-items:center;padding:13px;border-radius:16px;background:#f2f8f7}.detail-marketplace img{width:54px;height:54px;object-fit:contain;border-radius:13px;background:#fff;padding:6px}.detail-marketplace div{display:grid}.detail-marketplace small{color:var(--muted);font-size:8px;text-transform:uppercase}.detail-marketplace strong{font-size:13px}.detail-marketplace span{margin-top:3px;color:var(--muted);font-size:9px}.detail-order-box{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-top:18px;padding:13px 14px;border:1px solid var(--line);border-radius:16px;background:#fff}.detail-order-box>label{font-weight:850;font-size:11px}.detail-quantity{display:grid;grid-template-columns:38px 48px 38px;overflow:hidden;border:1px solid var(--line);border-radius:11px}.detail-quantity button,.detail-quantity input{height:38px;border:0;background:#fff;text-align:center}.detail-quantity button{cursor:pointer;font-weight:900}.detail-quantity input{width:48px;border-inline:1px solid var(--line)}.detail-actions{display:flex;gap:10px;margin-top:13px}.detail-actions .btn{flex:1}.mobile-detail-back{display:none}.related-products{margin-top:75px}.related-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.related-grid article{overflow:hidden;border:1px solid var(--line);border-radius:18px;background:#fff}.related-grid a{display:block;color:inherit;text-decoration:none;padding-bottom:15px}.related-grid img{width:100%;aspect-ratio:1.25/1;object-fit:cover}.related-grid span,.related-grid h3,.related-grid strong{display:block;margin-inline:14px}.related-grid span{margin-top:12px;color:var(--muted);font-size:9px;text-transform:uppercase}.related-grid h3{margin-top:5px;margin-bottom:8px;font-size:14px}.related-grid strong{font-size:13px;color:var(--cyan-dark)}
@media(max-width:980px){.marketplace-grid{grid-template-columns:1fr 1fr}.product-detail-shell{grid-template-columns:1fr;gap:24px}.product-detail-copy{position:static}.related-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:767px){.campaign-showcase{margin:10px 0 34px;padding-inline:12px}.campaign-head h2{font-size:23px}.campaign-controls{display:none}.campaign-track{gap:10px}.campaign-slide{flex-basis:88vw;min-height:235px;grid-template-columns:1fr}.campaign-slide>img{height:132px;min-height:132px}.campaign-slide>div{padding:18px}.campaign-slide h3{font-size:22px}.campaign-slide p{font-size:10px}.campaign-slide-actions{margin-top:13px}.marketplace-section{margin-top:45px;padding-inline:12px}.marketplace-grid{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px}.marketplace-grid article{flex:0 0 82vw;scroll-snap-align:start;grid-template-columns:54px 1fr}.marketplace-grid article>a{grid-column:1/-1;text-align:center}.marketplace-grid img{width:54px;height:54px}.product-detail-page{padding-top:74px}.product-breadcrumb{padding:12px;font-size:9px}.product-detail-shell{padding-inline:12px}.product-main-image{border-radius:20px}.product-detail-copy h1{font-size:31px}.detail-info-grid{grid-template-columns:1fr 1fr}.detail-actions{display:grid}.mobile-detail-back{display:grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#eef6f4;color:var(--ink);text-decoration:none;font-weight:900}.related-products{padding-inline:12px;margin-top:48px}.related-grid{grid-template-columns:1fr 1fr;gap:10px}.related-grid h3{font-size:12px}.promo-intro-card>img{width:110px;height:72px}.toolbar .marketplace-filter{min-width:100%}}
@media(max-width:430px){.campaign-slide{flex-basis:92vw}.marketplace-grid article{flex-basis:88vw}.product-detail-copy h1{font-size:28px}.detail-price strong{font-size:26px}.detail-info-grid{grid-template-columns:1fr}.related-grid{grid-template-columns:1fr 1fr}.product-thumbnails button{flex-basis:76px;height:62px}}