.hero-section { min-height: calc(100vh - 82px); display: grid; align-items: center; gap: 36px; padding: 54px 18px; overflow: hidden; }
.hero-copy p { max-width: 590px; font-size: 1.05rem; margin-top: 18px; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }
.hero-visual { position: relative; min-height: 430px; }
.fashion-card { position: absolute; border-radius: 34px; box-shadow: var(--shadow-lg); overflow: hidden; background: hsl(var(--secondary)); }
.fashion-card img { width: 100%; height: 100%; opacity: 0.95; }
.card-one { inset: 20px 70px 80px 0; z-index: 3; }
.card-two { right: 0; bottom: 20px; width: 62%; height: 260px; z-index: 2; }
.card-three { left: 18px; bottom: 0; width: 42%; height: 180px; z-index: 1; }

.section-heading { margin-bottom: 24px; }
.category-grid, .featured-grid { display: grid; gap: 16px; }
.category-card { border-radius: var(--radius-lg); background: hsl(var(--card)); border: 1px solid hsl(var(--border)); transition: var(--transition-smooth); overflow: hidden; display: flex; flex-direction: column; }
.category-img { height: 220px; overflow: hidden; background: hsl(var(--secondary)); }
.category-img img { width: 100%; height: 100%; transition: var(--transition-smooth); }
.category-card:hover .category-img img { transform: scale(1.05); }
.category-content { padding: 24px; flex-grow: 1; display: flex; flex-direction: column; justify-content: flex-end; }
.category-card:hover { transform: translateY(-6px); box-shadow: var(--shadow-md); }
.category-mark { color: hsl(var(--accent)); font-weight: 900; }
.category-card p { margin-top: 10px; }

.editorial-strip { margin: 70px 18px 0; padding: 34px; border-radius: var(--radius-lg); background: hsl(var(--primary)); color: hsl(var(--primary-foreground)); display: grid; gap: 18px; }
.editorial-strip p { color: hsl(var(--primary-foreground)); font-size: 1.6rem; font-weight: 900; letter-spacing: -.04em; }
.editorial-strip a { color: hsl(var(--primary-foreground)); text-decoration: underline; font-weight: 800; }

@media (min-width: 760px) { 
  .hero-section { grid-template-columns: 1fr .82fr; padding-inline: 36px; } 
  .category-grid, .featured-grid { grid-template-columns: repeat(3, 1fr); } 
  .editorial-strip { margin-inline: 36px; grid-template-columns: 1fr auto; align-items: center; } 
}
@media (min-width: 1120px) { 
  .hero-section { padding-inline: 64px; } 
  .editorial-strip { margin-inline: 64px; } 
}