/* ============================== HOME ============================== */

.hero-home{ padding-top: clamp(2.5rem,6vw,4.5rem); overflow:hidden; }
.hero-grid{ display:grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem,5vw,4rem); align-items:center; }
.hero-title{ font-size: clamp(2.6rem,5.6vw,4.6rem); margin-top:1.2rem; }
.hero-lead{ margin-top:1.3rem; font-size:1.08rem; color: var(--ink-dim); max-width:46ch; }
.hero-actions{ display:flex; align-items:center; gap:1.1rem; flex-wrap:wrap; margin-top:2rem; }
.hero-stats{ display:flex; gap: clamp(1.4rem,3vw,2.4rem); margin-top:2.6rem; flex-wrap:wrap; }
.hero-stats .stat{ display:flex; flex-direction:column; gap:.3rem; }
.hero-stats .stat-num{ font-family:var(--f-display); font-size:1.7rem; font-weight:800; }
.hero-stats .stat-label{ font-size:.76rem; color: var(--ink-faint); max-width:15ch; }

.hero-visual{ position:relative; }
.hero-photo-frame{ position:relative; border-radius: var(--radius-xl); overflow:hidden; aspect-ratio: 4/4.6; box-shadow: var(--shadow-lg); }
.hero-photo-frame img{ width:100%; height:100%; object-fit:cover; }
.hero-float-badge{ position:absolute; background: var(--cream-card); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); padding:1rem 1.2rem; display:flex; align-items:center; gap:.7rem; z-index:2; }
.hero-float-badge .ico{ width:38px; height:38px; border-radius:10px; display:grid; place-items:center; flex:none; }
.hero-float-badge strong{ display:block; font-family:var(--f-display); font-size:.95rem; }
.hero-float-badge span{ font-size:.72rem; color: var(--ink-faint); }
.hero-badge-1{ top:6%; left:-8%; }
.hero-badge-2{ bottom:10%; right:-10%; }
@media (max-width: 980px){ .hero-grid{ grid-template-columns:1fr; } .hero-visual{ max-width:420px; margin-inline:auto; } .hero-badge-1{ left:-2%; } .hero-badge-2{ right:-2%; } }
@media (max-width: 560px){ .hero-float-badge{ padding:.7rem .9rem; } .hero-float-badge strong{ font-size:.82rem; } }

/* ---- Marquee ---- */
.marquee-strip{ border-top:2px dashed var(--line); border-bottom:2px dashed var(--line); padding:1.3rem 0; overflow:hidden; -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.marquee-track{ display:flex; gap:3rem; width:max-content; animation: marquee 28s linear infinite; }
.marquee-track span{ font-family:var(--f-display); font-weight:700; font-size:1.1rem; color: var(--ink-dim); white-space:nowrap; display:flex; align-items:center; gap:3rem; }
.marquee-track span em{ font-style:normal; color: var(--coral); }
@keyframes marquee{ from{transform:translateX(0);} to{transform:translateX(-50%);} }

/* ---- Numbered features ---- */
.feat-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:1.5rem; }
.feat-item{ padding:2rem 1.6rem; }
.feat-num{ font-family:var(--f-display); font-weight:800; font-size:2.4rem; color: var(--cream-deep); -webkit-text-stroke: 1.5px var(--coral); display:block; }
.feat-item h3{ font-size:1.1rem; margin-top:.6rem; }
.feat-item p{ font-size:.86rem; color: var(--ink-faint); margin-top:.5rem; line-height:1.5; }
@media (max-width: 900px){ .feat-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 560px){ .feat-grid{ grid-template-columns:1fr; } }

/* ---- Category showcase ---- */
.cat-showcase-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:1.4rem; }
@media (max-width: 900px){ .cat-showcase-grid{ grid-template-columns:1fr 1fr; } }
@media (max-width: 560px){ .cat-showcase-grid{ grid-template-columns:1fr; } }

/* ---- Bestsellers grid ---- */
.best-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:1.4rem; }
@media (max-width: 980px){ .best-grid{ grid-template-columns: 1fr 1fr; } }
@media (max-width: 560px){ .best-grid{ grid-template-columns: 1fr; } }
.best-ad-card{ display:flex; align-items:center; justify-content:center; }
.best-ad-card > .ad-block,
.best-ad-card .ad-slot{ width:100%; max-width:none; height:100%; aspect-ratio:auto; }

/* ---- Stat band ---- */
.stat-band{ padding: clamp(3rem,6vw,4.5rem) 0; }
.stat-band-grid{ display:grid; grid-template-columns: repeat(4,1fr); gap:2rem; text-align:center; }
.stat-band-grid b{ display:block; font-family:var(--f-display); font-size: clamp(2rem,4vw,2.8rem); font-weight:800; }
.stat-band-grid span{ font-size:.85rem; color:#c7bdae; }
@media (max-width: 760px){ .stat-band-grid{ grid-template-columns: 1fr 1fr; row-gap:2.4rem; } }

/* ---- Testimonials ---- */
.testi-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:1.4rem; }
@media (max-width: 900px){ .testi-grid{ grid-template-columns:1fr; } }
.testi-card{ padding:1.8rem; }
.testi-card p{ font-size:.94rem; color: var(--ink-dim); line-height:1.6; margin-top:.8rem; }
.testi-foot{ display:flex; align-items:center; gap:.8rem; margin-top:1.3rem; }
.avatar-circ{ width:44px; height:44px; border-radius:50%; overflow:hidden; flex:none; }
.avatar-circ img{ width:100%; height:100%; object-fit:cover; }
.testi-foot strong{ display:block; font-size:.88rem; }
.testi-foot span{ font-size:.76rem; color: var(--ink-faint); }

/* ---- CTA banner ---- */
.cta-banner{ position:relative; overflow:hidden; padding: clamp(3rem,7vw,5rem) clamp(1.5rem,5vw,4rem); border-radius: var(--radius-xl); background: var(--g-hero); text-align:center; color:#fff; }
.cta-banner h2{ font-size: clamp(2rem,4.4vw,3rem); max-width:20ch; margin-inline:auto; }
.cta-banner p{ opacity:.92; max-width:52ch; margin:1.1rem auto 2rem; }
.cta-shape{ position:absolute; border-radius:50%; background:rgba(255,255,255,.18); }
.cta-shape-1{ width:130px; height:130px; top:-40px; left:-30px; }
.cta-shape-2{ width:90px; height:90px; bottom:-25px; right:8%; }
.cta-banner .footer-newsletter input{ background:rgba(255,255,255,.18); color:#fff; }
.cta-banner .footer-newsletter input::placeholder{ color:rgba(255,255,255,.7); }
