/* Generated from the approved EMF Protection designs. Edit the source designs, then rerun build/split_css.py. */
.hero{background: var(--ink); overflow: hidden; position: relative;}
.hero-grain{position: absolute; inset: 0; opacity: 0.025; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E"); background-size: 200px; pointer-events: none;}
.hero-inner{max-width: 1340px; margin: 0 auto; display: grid; grid-template-columns: 1fr 460px; align-items: center; min-height: 640px; gap: 3rem; padding: 0 1.5rem; position: relative; z-index: 1;}
.hero-content{padding: 5rem 0;}
.hero-pill{display: inline-flex; align-items: center; gap: 0.625rem; background: rgba(56,119,128,0.15); border: 1px solid rgba(56,119,128,0.3); border-radius: 100px; padding: 0.375rem 1rem; margin-bottom: 1.75rem;}
.hero-pill-dot{width: 7px; height: 7px; background: var(--action); border-radius: 50%; flex-shrink: 0;}
.hero-pill span{font-size: 0.8125rem; font-weight: 600; color: var(--action);}
.hero-title{font-size: clamp(2.75rem, 5vw, 4.5rem); font-weight: 800; color: var(--white); line-height: 1.04; letter-spacing: -0.035em; margin-bottom: 1.375rem; text-wrap: balance;}
.hero-title em{font-style: normal; color: var(--action);}
.hero-body{font-size: 1.0625rem; color: rgba(255,255,255,0.65); line-height: 1.7; max-width: 48ch; margin-bottom: 2.25rem;}
.hero-ctas{display: flex; gap: 0.875rem; flex-wrap: wrap; margin-bottom: 2.75rem; align-items: center;}
.hero-social-proof{display: flex; align-items: center; gap: 1rem; flex-wrap: wrap;}
.tp-pill{display: flex; align-items: center; gap: 0.75rem; background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.1); border-radius: 100px; padding: 0.5rem 1rem;}
.tp-pill-stars{display: flex; gap: 2px;}
.tp-pill-star{width: 14px; height: 14px; background: #00b67a; display: flex; align-items: center; justify-content: center; border-radius: 2px;}
.tp-pill-text{font-size: 0.8125rem; color: rgba(255,255,255,0.7);}
.tp-pill-text strong{color: var(--white); font-weight: 700;}
.hero-stat-row{display: flex; gap: 2.5rem; flex-wrap: wrap;}
.hero-stat .num{font-size: 1.875rem; font-weight: 800; color: var(--white); line-height: 1; letter-spacing: -0.03em;}
.hero-stat .lbl{font-size: 0.8125rem; color: rgba(255,255,255,0.48); margin-top: 0.2rem;}
.hero-panel{background: var(--ink-mid); border-left: 1px solid rgba(255,255,255,0.08); align-self: stretch; display: flex; align-items: center; justify-content: center; padding: 3rem; position: relative;}
.hero-panel::after{content: ''; position: absolute; top: 0; bottom: 0; left: 100%; width: 50vw; background: var(--ink-mid);}
.shield-card{background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); border-radius: var(--r-lg); padding: 2rem; width: 100%; max-width: 340px; position: relative; z-index: 1;}
.shield-card-hd{font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.4); margin-bottom: 1.25rem; display: flex; justify-content: space-between; align-items: center;}
.live-chip{display: flex; align-items: center; gap: 0.375rem; color: #4ade80; font-size: 0.6875rem; font-weight: 700;}
.live-chip::before{content: ''; width: 7px; height: 7px; border-radius: 50%; background: #4ade80; animation: blink 1.5s infinite;}
@keyframes blink{0%,100%{opacity:1}
50%{opacity:0.4}}
.shield-num{font-size: 4.5rem; font-weight: 800; color: var(--white); line-height: 1; letter-spacing: -0.05em;}
.shield-num sup{font-size: 1.5rem; color: rgba(255,255,255,0.5); font-weight: 600;}
.shield-label{font-size: 0.8125rem; color: rgba(255,255,255,0.45); margin-top: 0.25rem; margin-bottom: 1.5rem;}
.freq-list{display: flex; flex-direction: column; gap: 0.625rem; margin-bottom: 1.5rem;}
.freq-item{display: flex; align-items: center; gap: 0.75rem;}
.freq-name{font-size: 0.75rem; color: rgba(255,255,255,0.45); width: 88px; flex-shrink: 0;}
.freq-bar{flex: 1; height: 4px; background: rgba(255,255,255,0.1); border-radius: 2px; overflow: hidden;}
.freq-fill{height: 100%; border-radius: 2px; background: linear-gradient(90deg, var(--brand) 0%, var(--action) 100%);}
.freq-db{font-size: 0.75rem; font-weight: 700; color: rgba(255,255,255,0.7); width: 38px; text-align: right;}
.cert-tags{display: flex; gap: 0.5rem; flex-wrap: wrap;}
.cert-tag{background: rgba(255,255,255,0.12); border: 1px solid rgba(255,255,255,0.22); border-radius: 100px; padding: 0.25rem 0.75rem; font-size: 0.6875rem; font-weight: 600; color: rgba(255,255,255,0.82);}
.cat-section{background: var(--white);}
.cat-hd{display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2rem; gap: 1rem; flex-wrap: wrap;}
.view-all{font-size: 0.875rem; font-weight: 700; color: var(--action); display: inline-flex; align-items: center; gap: 0.375rem; transition: gap 150ms;}
.view-all:hover{gap: 0.625rem;}
.cat-grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: 1rem;}
.cat-card{border-radius: var(--r-lg); overflow: hidden; aspect-ratio: 3/4; position: relative; display: flex; flex-direction: column; justify-content: flex-end; cursor: pointer; transition: transform 200ms, box-shadow 200ms;}
.cat-card:hover{transform: translateY(-4px); box-shadow: var(--sh-lg);}
.cat-card::before{content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(15,30,46,0.92) 0%, rgba(15,30,46,0.2) 55%, transparent 100%); z-index: 1;}
.cc-1{background: linear-gradient(160deg, #0d2035 0%, #1a3a52 100%);}
.cc-2{background: linear-gradient(160deg, #1a3040 0%, #2a5060 100%);}
.cc-3{background: linear-gradient(160deg, #162838 0%, #1e4050 100%);}
.cc-4{background: linear-gradient(160deg, #0f2030 0%, #24404e 100%);}
.cat-card-icon{position: absolute; top: 50%; left: 50%; transform: translate(-50%, -60%); opacity: 0.12; color: white; z-index: 0;}
.cat-card-body{position: relative; z-index: 2; padding: 1.375rem;}
.cat-badge{display: inline-block; background: var(--action); color: var(--white); font-size: 0.625rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; padding: 0.2rem 0.5rem; border-radius: 100px; margin-bottom: 0.5rem;}
.cat-name{font-size: 1.0625rem; font-weight: 800; color: var(--white); line-height: 1.2; margin-bottom: 0.3rem;}
.cat-meta{font-size: 0.8125rem; color: rgba(255,255,255,0.72); margin-bottom: 0.75rem;}
.cat-link{display: inline-flex; align-items: center; gap: 0.375rem; font-size: 0.8125rem; font-weight: 700; color: var(--action);}
.products-section{background: var(--warm);}
.products-hd{display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2.5rem; gap: 1rem; flex-wrap: wrap;}
.products-grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: 1.25rem;}
.product-card{background: var(--white); border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border); box-shadow: var(--sh); transition: box-shadow 200ms, transform 200ms; display: flex; flex-direction: column;}
.product-card:hover{box-shadow: var(--sh-md); transform: translateY(-3px);}
.product-img{aspect-ratio: 4/3; position: relative; overflow: hidden; flex-shrink: 0;}
.product-img-inner{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}
.pi-1{background: linear-gradient(140deg, #0d2035 0%, #1a3a52 100%);}
.pi-2{background: linear-gradient(140deg, #1a3040 0%, #2a5060 100%);}
.pi-3{background: linear-gradient(140deg, #162838 0%, #264858 100%);}
.pi-4{background: linear-gradient(140deg, #0f2030 0%, #1e3c4c 100%);}
.pi-icon{opacity: 0.18;}
.p-badge{position: absolute; top: 0.875rem; left: 0.875rem; background: var(--white); color: var(--ink); font-size: 0.6875rem; font-weight: 700; padding: 0.3rem 0.625rem; border-radius: 100px; box-shadow: var(--sh);}
.p-sale{position: absolute; top: 0.875rem; right: 0.875rem; background: var(--amber); color: var(--white); font-size: 0.6875rem; font-weight: 700; padding: 0.3rem 0.625rem; border-radius: 100px;}
.p-new{position: absolute; top: 0.875rem; right: 0.875rem; background: var(--success); color: var(--white); font-size: 0.6875rem; font-weight: 700; padding: 0.3rem 0.625rem; border-radius: 100px;}
.quick-add{position: absolute; bottom: 0; left: 0; right: 0; background: var(--action); color: var(--white); font-size: 0.8125rem; font-weight: 700; padding: 0.75rem; text-align: center; transform: translateY(100%); transition: transform 200ms;}
.product-card:hover .quick-add{transform: translateY(0);}
.product-body{padding: 1.25rem; display: flex; flex-direction: column; flex: 1;}
.product-name{font-size: 0.9375rem; font-weight: 700; color: var(--ink); margin-bottom: 0.2rem; line-height: 1.3;}
.product-sub{font-size: 0.8125rem; color: var(--ink-light); margin-bottom: 0.75rem;}
.product-stars{display: flex; align-items: center; gap: 0.375rem; margin-bottom: 0.75rem;}
.stars-row{display: flex; gap: 1px; color: var(--amber);}
.star-lbl{font-size: 0.8125rem; color: var(--ink-light);}
.product-sizes{display: flex; gap: 0.375rem; flex-wrap: wrap; margin-bottom: 0.875rem;}
.sz{font-size: 0.6875rem; font-weight: 600; padding: 0.2rem 0.5rem; border-radius: 4px; background: var(--surface); border: 1px solid var(--border); color: var(--ink-mid);}
.product-footer{display: flex; align-items: center; justify-content: space-between; padding-top: 0.875rem; border-top: 1px solid var(--border); margin-top: auto;}
.price-lbl{font-size: 0.6875rem; color: var(--ink-light); font-weight: 500; display: block;}
.price-val{font-size: 1.125rem; font-weight: 800; color: var(--ink);}
.proof-strip{text-align: center; padding: 0.625rem; font-size: 0.8125rem; font-weight: 600; color: var(--white); background: var(--action);}
.numbers-section{background: var(--ink);}
.numbers-grid{display: grid; grid-template-columns: repeat(4, 1fr); gap: 0; border: 1px solid rgba(255,255,255,0.08); border-radius: var(--r-lg); overflow: hidden;}
.number-item{padding: 3rem 2.5rem; border-right: 1px solid rgba(255,255,255,0.08);}
.number-item:last-child{border-right: none;}
.number-val{font-size: 3.5rem; font-weight: 800; color: var(--white); line-height: 1; letter-spacing: -0.04em; margin-bottom: 0.5rem;}
.number-val span{color: var(--action);}
.number-label{font-size: 1rem; font-weight: 600; color: rgba(255,255,255,0.85); margin-bottom: 0.375rem;}
.number-desc{font-size: 0.875rem; color: rgba(255,255,255,0.45); line-height: 1.6;}
.why-section{background: var(--white);}
.why-layout{display: grid; grid-template-columns: 1fr 1fr; gap: 6rem; align-items: start;}
.why-benefits{display: flex; flex-direction: column; gap: 1.5rem; margin-top: 2rem;}
.benefit{display: flex; gap: 1.125rem;}
.benefit-num{width: 36px; height: 36px; border-radius: 50%; background: var(--action); color: var(--white); font-size: 0.875rem; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0; margin-top: 0.125rem;}
.benefit-title{font-size: 1rem; font-weight: 700; color: var(--ink); margin-bottom: 0.3rem;}
.benefit-desc{font-size: 0.875rem; color: var(--ink-light); line-height: 1.65;}
.why-visual{}
.cert-panel{background: var(--ink); border-radius: var(--r-xl); padding: 2.5rem; color: white; margin-bottom: 1.25rem;}
.cert-panel-title{font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.45); margin-bottom: 1.75rem;}
.cert-table{width: 100%; border-collapse: collapse;}
.cert-table td{padding: 0.75rem 0; border-bottom: 1px solid rgba(255,255,255,0.07); font-size: 0.875rem; vertical-align: middle;}
.cert-table tr:last-child td{border-bottom: none;}
.cert-table td:first-child{color: rgba(255,255,255,0.55);}
.cert-table td:last-child{font-weight: 800; color: var(--action); text-align: right;}
.cert-footer{display: flex; justify-content: space-between; font-size: 0.75rem; color: rgba(255,255,255,0.35); border-top: 1px solid rgba(255,255,255,0.07); padding-top: 1rem; margin-top: 1rem;}
.cert-footer strong{color: rgba(255,255,255,0.65);}
.rating-card{background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 1.75rem; display: flex; gap: 1.5rem; align-items: center;}
.rating-big{font-size: 3.5rem; font-weight: 800; color: var(--ink); letter-spacing: -0.04em; line-height: 1;}
.rating-stars-lg{display: flex; gap: 3px; color: var(--amber); margin: 0.375rem 0;}
.rating-label{font-size: 0.875rem; font-weight: 700; color: var(--ink);}
.rating-count{font-size: 0.8125rem; color: var(--ink-light);}
.how-section{background: var(--warm);}
.how-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; margin-top: 3.5rem;}
.how-card{background: var(--white); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 2.25rem; position: relative; overflow: hidden; transition: box-shadow 200ms;}
.how-card:hover{box-shadow: var(--sh-md);}
.how-card::before{content: attr(data-num); position: absolute; top: -0.5rem; right: 1.25rem; font-size: 5rem; font-weight: 800; color: rgba(56,119,128,0.09); line-height: 1; letter-spacing: -0.04em; pointer-events: none;}
.how-icon{width: 48px; height: 48px; background: var(--action-pale); border-radius: var(--r); display: flex; align-items: center; justify-content: center; color: var(--action); margin-bottom: 1.375rem; position: relative; z-index: 1;}
.how-title{font-size: 1.125rem; font-weight: 700; color: var(--ink); margin-bottom: 0.625rem; position: relative; z-index: 1;}
.how-desc{font-size: 0.875rem; color: var(--ink-light); line-height: 1.65; position: relative; z-index: 1;}
.reviews-section{background: var(--white);}
.reviews-hd{display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 2.5rem; gap: 1rem; flex-wrap: wrap;}
.tp-widget-badge{display: inline-flex; flex-direction: column; align-items: center; gap: 0.5rem; border: 1.5px solid var(--border); border-radius: var(--r-lg); padding: 1rem 1.375rem; text-align: center; text-decoration: none; transition: border-color 150ms, box-shadow 150ms;}
.tp-widget-badge:hover{border-color: #00b67a; box-shadow: 0 4px 16px rgba(0,182,122,0.1);}
.tp-logo{font-size: 0.9375rem; font-weight: 800; color: var(--ink); letter-spacing: -0.01em;}
.tp-stars-row{display: flex; gap: 3px;}
.tp-sq{width: 26px; height: 26px; background: #00b67a; display: flex; align-items: center; justify-content: center; border-radius: 3px;}
.tp-info{text-align: center;}
.tp-info .score{font-size: 1.375rem; font-weight: 800; color: var(--ink);}
.tp-info .label{font-size: 0.875rem; font-weight: 700; color: #00b67a;}
.tp-info .count{font-size: 0.8125rem; color: var(--ink-light);}
.reviews-grid{display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem;}
.review-card{background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 1.75rem;}
.r-stars{display: flex; gap: 2px; margin-bottom: 1rem;}
.r-sq{width: 18px; height: 18px; background: #00b67a; display: flex; align-items: center; justify-content: center; border-radius: 2px;}
.r-title{font-size: 0.9375rem; font-weight: 700; color: var(--ink); margin-bottom: 0.5rem;}
.r-text{font-size: 0.875rem; color: var(--ink-mid); line-height: 1.65; margin-bottom: 1.25rem; font-style: italic;}
.r-footer{display: flex; justify-content: space-between; align-items: flex-end; padding-top: 1rem; border-top: 1px solid var(--border);}
.r-author{font-size: 0.8125rem; font-weight: 700; color: var(--ink);}
.r-verified{display: flex; align-items: center; gap: 0.25rem; font-size: 0.6875rem; font-weight: 600; color: var(--action); margin-top: 0.2rem;}
.r-date{font-size: 0.75rem; color: var(--ink-light);}
.media-bar{background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 2rem 1.5rem;}
.media-bar-inner{max-width: 1340px; margin: 0 auto; display: flex; align-items: center; justify-content: center; gap: 3rem; flex-wrap: wrap;}
.media-lbl{font-size: 0.75rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-light);}
.media-logos{display: flex; align-items: center; gap: 2.5rem; flex-wrap: wrap; justify-content: center;}
.media-logo{font-size: 1rem; font-weight: 700; color: var(--border); letter-spacing: -0.01em;}
.cta-section{background: var(--ink); padding: 6rem 1.5rem;}
.cta-inner{max-width: 560px; margin: 0 auto; text-align: center;}
.cta-eyebrow{font-size: 0.75rem; font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase; color: var(--action); margin-bottom: 1rem;}
.cta-title{font-size: clamp(2rem, 3.5vw, 2.875rem); font-weight: 800; color: var(--white); letter-spacing: -0.03em; line-height: 1.12; margin-bottom: 1rem;}
.cta-desc{font-size: 1rem; color: rgba(255,255,255,0.55); line-height: 1.7; margin-bottom: 2rem;}
.cta-form{display: flex; gap: 0; background: rgba(255,255,255,0.08); border: 1.5px solid rgba(255,255,255,0.14); border-radius: var(--r); overflow: hidden;}
.cta-input{flex: 1; padding: 0.875rem 1.125rem; background: transparent; border: none; color: var(--white); font-family: var(--font); font-size: 0.9375rem; outline: none;}
.cta-input::placeholder{color: rgba(255,255,255,0.35);}
.cta-btn{padding: 0.875rem 1.75rem; background: var(--action); color: var(--white); font-family: var(--font); font-size: 0.9375rem; font-weight: 700; border: none; cursor: pointer; transition: background 150ms; white-space: nowrap;}
.cta-btn:hover{background: var(--action-dark);}
.cta-fine{font-size: 0.75rem; color: rgba(255,255,255,0.3); margin-top: 0.875rem;}
footer{background: #070f18; padding: 4rem 1.5rem 2rem;}
.fc{background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.09); border-radius: 4px; padding: 0.25rem 0.5rem; font-size: 0.6875rem; font-weight: 600; color: rgba(255,255,255,0.35);}
.payment-row{display: flex; gap: 0.5rem;}
.pay{display: inline-flex; border-radius: 4px; overflow: hidden; line-height: 0;}
@media(max-width:1100px){.hero-inner{grid-template-columns:1fr;min-height:auto}
.hero-panel{display:none}
.products-grid{grid-template-columns:repeat(2,1fr)}
.cat-grid{grid-template-columns:repeat(2,1fr)}
.why-layout{grid-template-columns:1fr;gap:3rem}
.numbers-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.how-grid{grid-template-columns:1fr}
.reviews-grid{grid-template-columns:1fr}}
@media(max-width:640px){.products-grid{grid-template-columns:1fr}
.cat-grid{grid-template-columns:1fr}
.numbers-grid{grid-template-columns:1fr}
.hero-ctas{flex-direction:column}
.cta-form{flex-direction:column;border-radius:var(--r)}
.cta-btn{border-radius:var(--r)}}
@media (max-width:900px){.hero{background: var(--ink); padding: 2.5rem 1.25rem 2.25rem; position: relative; overflow: hidden;}}
@media (max-width:900px){.hero-bg-dots{position: absolute; inset: 0; opacity: 0.04; background-image: radial-gradient(circle at 1px 1px, white 1px, transparent 0); background-size: 28px 28px; pointer-events: none;}}
@media (max-width:900px){.hero-eyebrow{display: inline-flex; align-items: center; gap: 0.5rem; background: rgba(56,119,128,0.18); border: 1px solid rgba(56,119,128,0.32); border-radius: 100px; padding: 0.3125rem 0.75rem; margin-bottom: 1.25rem;}}
@media (max-width:900px){.hero-eyebrow-dot{width: 6px; height: 6px; border-radius: 50%; background: var(--action); animation: pulse 2s infinite; flex-shrink: 0;}}
@media (max-width:900px){@keyframes pulse{0%,100%{opacity:1;transform:scale(1)} 50%{opacity:0.7;transform:scale(1.2)}}}
@media (max-width:900px){.hero-eyebrow span{font-size: 0.75rem; font-weight: 600; color: rgba(255,255,255,0.85);}}
@media (max-width:900px){.hero-title{font-size: 2.125rem; font-weight: 800; color: var(--white); line-height: 1.1; letter-spacing: -0.03em; margin-bottom: 1rem;}}
@media (max-width:900px){.hero-title em{font-style: normal; color: var(--action);}}
@media (max-width:900px){.hero-desc{font-size: 0.9375rem; color: rgba(255,255,255,0.65); line-height: 1.65; margin-bottom: 1.75rem;}}
@media (max-width:900px){.hero-actions{display: flex; flex-direction: column; gap: 0.625rem; margin-bottom: 2rem;}}
@media (max-width:900px){.hero-stats{display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem;}}
@media (max-width:900px){.stat-box{background: rgba(255,255,255,0.07); border: 1px solid rgba(255,255,255,0.14); border-radius: var(--r-lg); padding: 0.875rem 1rem;}}
@media (max-width:900px){.stat-num{font-size: 1.625rem; font-weight: 800; color: var(--white); line-height: 1; letter-spacing: -0.02em;}}
@media (max-width:900px){.stat-lbl{font-size: 0.75rem; color: rgba(255,255,255,0.5); margin-top: 0.2rem;}}
@media (max-width:900px){.view-all-link{font-size: 0.8125rem; font-weight: 700; color: var(--action); display: flex; align-items: center; gap: 0.25rem; white-space: nowrap; flex-shrink: 0;}}
@media (max-width:900px){.cat-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 1.375rem;}}
@media (max-width:900px){.cat-card{border-radius: var(--r-lg); position: relative; overflow: hidden; aspect-ratio: 4/3; display: flex; flex-direction: column; justify-content: flex-end; -webkit-tap-highlight-color: transparent;}}
@media (max-width:900px){.cat-card:active{opacity: 0.88;}}
@media (max-width:900px){.cat-card::before{content: ''; position: absolute; inset: 0; background: linear-gradient(to top, rgba(15,30,46,0.9) 0%, rgba(15,30,46,0.08) 55%, transparent 100%); z-index: 1;}}
@media (max-width:900px){.cat-bg-1{background: linear-gradient(145deg, #0d2035 0%, #1a3a52 100%);}}
@media (max-width:900px){.cat-bg-2{background: linear-gradient(145deg, #1a3040 0%, #2a5060 100%);}}
@media (max-width:900px){.cat-bg-3{background: linear-gradient(145deg, #162838 0%, #1e4050 100%);}}
@media (max-width:900px){.cat-bg-4{background: linear-gradient(145deg, #0f2030 0%, #24404e 100%);}}
@media (max-width:900px){.cat-card-body{position: relative; z-index: 2; padding: 0.875rem;}}
@media (max-width:900px){.cat-badge{display: inline-block; background: var(--action); color: var(--white); font-size: 0.5625rem; font-weight: 700; letter-spacing: 0.07em; text-transform: uppercase; padding: 0.175rem 0.425rem; border-radius: 100px; margin-bottom: 0.3rem;}}
@media (max-width:900px){.cat-name{font-size: 0.875rem; font-weight: 800; color: var(--white); line-height: 1.2;}}
@media (max-width:900px){.cat-meta{font-size: 0.6875rem; color: rgba(255,255,255,0.72);}}
@media (max-width:900px){.products-section{background: var(--surface);}}
@media (max-width:900px){.products-grid{display: grid; grid-template-columns: 1fr 1fr; gap: 0.75rem; margin-top: 1.375rem;}}
@media (max-width:900px){.product-card{background: var(--white); border-radius: var(--r-lg); overflow: hidden; border: 1px solid var(--border); box-shadow: var(--sh);}}
@media (max-width:900px){.product-img{aspect-ratio: 4/3; position: relative; overflow: hidden;}}
@media (max-width:900px){.product-img-inner{width: 100%; height: 100%; display: flex; align-items: center; justify-content: center;}}
@media (max-width:900px){.pi-1{background: linear-gradient(140deg, #0d2035 0%, #1a3a52 100%);}}
@media (max-width:900px){.pi-2{background: linear-gradient(140deg, #1a3040 0%, #2a5060 100%);}}
@media (max-width:900px){.pi-3{background: linear-gradient(140deg, #162838 0%, #264858 100%);}}
@media (max-width:900px){.pi-4{background: linear-gradient(140deg, #0f2030 0%, #1e3c4c 100%);}}
@media (max-width:900px){.img-icon{opacity: 0.18;}}
@media (max-width:900px){.product-badge{position: absolute; top: 0.625rem; left: 0.625rem; background: var(--white); color: var(--ink); font-size: 0.5625rem; font-weight: 700; padding: 0.2rem 0.5rem; border-radius: 100px; box-shadow: var(--sh);}}
@media (max-width:900px){.product-badge-sale{position: absolute; top: 0.625rem; right: 0.625rem; background: var(--amber); color: var(--white); font-size: 0.5625rem; font-weight: 700; padding: 0.2rem 0.5rem; border-radius: 100px;}}
@media (max-width:900px){.product-body{padding: 0.75rem;}}
@media (max-width:900px){.product-name{font-size: 0.8125rem; font-weight: 700; color: var(--ink); line-height: 1.3; margin-bottom: 0.2rem;}}
@media (max-width:900px){.product-rating{display: flex; align-items: center; gap: 0.25rem; margin-bottom: 0.5rem;}}
@media (max-width:900px){.stars{display: flex; gap: 1px; color: var(--amber);}}
@media (max-width:900px){.rating-lbl{font-size: 0.6875rem; color: var(--ink-light);}}
@media (max-width:900px){.product-footer{display: flex; align-items: center; justify-content: space-between; padding-top: 0.625rem; border-top: 1px solid var(--border);}}
@media (max-width:900px){.price-val{font-size: 1rem; font-weight: 800; color: var(--ink);}}
@media (max-width:900px){.price-from{font-size: 0.5625rem; color: var(--ink-light); display: block;}}
@media (max-width:900px){.social-proof{background: var(--action-pale); padding: 0.4375rem 0.75rem; font-size: 0.6875rem; font-weight: 600; color: var(--action-dark); border-top: 1px solid var(--border);}}
@media (max-width:900px){.numbers-section{background: var(--ink);}}
@media (max-width:900px){.numbers-grid{display: flex; flex-direction: column; gap: 0; margin-top: 1.75rem; border: 1px solid rgba(255,255,255,0.08); border-radius: var(--r-lg); overflow: hidden;}}
@media (max-width:900px){.number-item{padding: 1.375rem 1.25rem; border-bottom: 1px solid rgba(255,255,255,0.08);}}
@media (max-width:900px){.number-item:last-child{border-bottom: none;}}
@media (max-width:900px){.number-val{font-size: 2.25rem; font-weight: 800; color: var(--white); line-height: 1; letter-spacing: -0.03em; margin-bottom: 0.25rem;}}
@media (max-width:900px){.number-val span{color: var(--action);}}
@media (max-width:900px){.number-label{font-size: 0.875rem; font-weight: 600; color: rgba(255,255,255,0.85); margin-bottom: 0.25rem;}}
@media (max-width:900px){.number-desc{font-size: 0.8125rem; color: rgba(255,255,255,0.45); line-height: 1.6;}}
@media (max-width:900px){.why-section{background: var(--white);}}
@media (max-width:900px){.benefits{display: flex; flex-direction: column; gap: 1.125rem; margin-top: 1.5rem;}}
@media (max-width:900px){.benefit{display: flex; gap: 0.875rem; align-items: flex-start;}}
@media (max-width:900px){.benefit-num{width: 32px; height: 32px; border-radius: 50%; background: var(--action); color: var(--white); font-size: 0.8125rem; font-weight: 800; display: flex; align-items: center; justify-content: center; flex-shrink: 0;}}
@media (max-width:900px){.benefit-title{font-size: 0.9375rem; font-weight: 700; color: var(--ink); margin-bottom: 0.175rem;}}
@media (max-width:900px){.benefit-desc{font-size: 0.8125rem; color: var(--ink-light); line-height: 1.6;}}
@media (max-width:900px){.cert-panel{background: var(--ink); border-radius: var(--r-xl); padding: 1.5rem; color: var(--white); margin-top: 1.75rem;}}
@media (max-width:900px){.cert-panel-title{font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: rgba(255,255,255,0.45); margin-bottom: 1.25rem;}}
@media (max-width:900px){.cert-table{width: 100%; border-collapse: collapse;}}
@media (max-width:900px){.cert-table td{padding: 0.625rem 0; border-bottom: 1px solid rgba(255,255,255,0.08); font-size: 0.8125rem; vertical-align: middle;}}
@media (max-width:900px){.cert-table tr:last-child td{border-bottom: none;}}
@media (max-width:900px){.cert-table td:first-child{color: rgba(255,255,255,0.55);}}
@media (max-width:900px){.cert-table td:last-child{font-weight: 800; color: var(--action); text-align: right;}}
@media (max-width:900px){.how-section{background: var(--warm);}}
@media (max-width:900px){.how-steps{display: flex; flex-direction: column; gap: 0.875rem; margin-top: 1.75rem;}}
@media (max-width:900px){.how-card{background: var(--white); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 1.375rem; position: relative; overflow: hidden;}}
@media (max-width:900px){.how-card::before{content: attr(data-num); position: absolute; top: -0.25rem; right: 0.75rem; font-size: 3rem; font-weight: 800; color: rgba(56,119,128,0.09); line-height: 1; letter-spacing: -0.04em; pointer-events: none;}}
@media (max-width:900px){.how-icon{width: 40px; height: 40px; background: var(--action-pale); border-radius: var(--r); display: flex; align-items: center; justify-content: center; color: var(--action); margin-bottom: 0.875rem; position: relative; z-index: 1;}}
@media (max-width:900px){.how-title{font-size: 0.9375rem; font-weight: 700; color: var(--ink); margin-bottom: 0.375rem; position: relative; z-index: 1;}}
@media (max-width:900px){.how-desc{font-size: 0.8125rem; color: var(--ink-light); line-height: 1.6; position: relative; z-index: 1;}}
@media (max-width:900px){.reviews-section{background: var(--white);}}
@media (max-width:900px){.tp-row{display: flex; align-items: center; gap: 0.875rem; margin-bottom: 1.25rem;}}
@media (max-width:900px){.tp-stars{display: flex; gap: 3px;}}
@media (max-width:900px){.tp-star{width: 24px; height: 24px; background: #00b67a; display: flex; align-items: center; justify-content: center; border-radius: 3px;}}
@media (max-width:900px){.tp-score{font-size: 1.25rem; font-weight: 800; color: var(--ink);}}
@media (max-width:900px){.tp-label{font-size: 0.8125rem; font-weight: 700; color: #00b67a;}}
@media (max-width:900px){.review-cards{display: flex; flex-direction: column; gap: 0.875rem;}}
@media (max-width:900px){.review-card{background: var(--surface); border: 1px solid var(--border); border-radius: var(--r-lg); padding: 1.25rem;}}
@media (max-width:900px){.review-stars{display: flex; gap: 2px; margin-bottom: 0.75rem;}}
@media (max-width:900px){.rstar{width: 16px; height: 16px; background: #00b67a; display: flex; align-items: center; justify-content: center; border-radius: 2px;}}
@media (max-width:900px){.review-title{font-size: 0.9375rem; font-weight: 700; color: var(--ink); margin-bottom: 0.375rem;}}
@media (max-width:900px){.review-text{font-size: 0.8125rem; color: var(--ink-mid); line-height: 1.65; margin-bottom: 0.875rem; font-style: italic;}}
@media (max-width:900px){.review-footer{display: flex; justify-content: space-between; align-items: flex-end; padding-top: 0.75rem; border-top: 1px solid var(--border);}}
@media (max-width:900px){.review-author{font-size: 0.8125rem; font-weight: 700; color: var(--ink);}}
@media (max-width:900px){.review-verified{display: flex; align-items: center; gap: 0.25rem; font-size: 0.6875rem; font-weight: 600; color: var(--action); margin-top: 0.2rem;}}
@media (max-width:900px){.review-date{font-size: 0.6875rem; color: var(--ink-light);}}
@media (max-width:900px){.media-section{background: var(--surface); border-top: 1px solid var(--border); border-bottom: 1px solid var(--border); padding: 1.5rem 1.25rem;}}
@media (max-width:900px){.media-label{font-size: 0.6875rem; font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-light); text-align: center; margin-bottom: 1rem;}}
@media (max-width:900px){.media-logos{display: flex; overflow-x: auto; gap: 1.75rem; padding-bottom: 0.25rem; justify-content: flex-start; -webkit-overflow-scrolling: touch; scrollbar-width: none;}}
@media (max-width:900px){.media-logos::-webkit-scrollbar{display: none;}}
@media (max-width:900px){.media-logo{font-size: 0.9375rem; font-weight: 700; color: var(--border); letter-spacing: -0.01em; white-space: nowrap; flex-shrink: 0;}}
@media (max-width:900px){.cta-section{background: var(--ink); padding: 2.5rem 1.25rem;}}
@media (max-width:900px){.cta-title{font-size: 1.625rem; font-weight: 800; color: var(--white); letter-spacing: -0.025em; margin-bottom: 0.625rem; line-height: 1.15;}}
@media (max-width:900px){.cta-desc{font-size: 0.9375rem; color: rgba(255,255,255,0.55); line-height: 1.65; margin-bottom: 0.375rem;}}
@media (max-width:900px){.cta-privacy{font-size: 0.75rem; color: rgba(255,255,255,0.32); margin-bottom: 1.5rem;}}
@media (max-width:900px){.cta-form{display: flex; flex-direction: column; gap: 0.625rem;}}
@media (max-width:900px){.cta-input{width: 100%; padding: 0.875rem 1rem; background: rgba(255,255,255,0.08); border: 1.5px solid rgba(255,255,255,0.16); border-radius: var(--r); color: var(--white); font-family: var(--font); font-size: 1rem; outline: none;}}
@media (max-width:900px){.cta-input::placeholder{color: rgba(255,255,255,0.4);}}
@media (max-width:900px){.cta-btn{padding: 0.875rem 1.5rem; background: var(--action); color: var(--white); font-family: var(--font); font-size: 1rem; font-weight: 700; border-radius: var(--r); cursor: pointer; border: none; -webkit-tap-highlight-color: transparent;}}
@media (max-width:900px){.cta-btn:active{background: var(--action-dark);}}
@media (max-width:900px){footer{background: var(--footer-bg); padding: 2rem 1.25rem 1.5rem;}}
@media (max-width:900px){.fc{background: rgba(255,255,255,0.06); border: 1px solid rgba(255,255,255,0.09); border-radius: 4px; padding: 0.2rem 0.5rem; font-size: 0.625rem; font-weight: 600; color: rgba(255,255,255,0.35);}}
@media (max-width:900px){.payment-icons{display: flex; gap: 0.375rem; flex-wrap: wrap;}}
@media (max-width:900px){.pay{display: inline-flex; border-radius: 4px; overflow: hidden; line-height: 0;}}