/**
 * Atelier — T2 Home Editorial (campaign-led home variant).
 * Source: design/store-theme/01-atelier-fashion/pages/T2 Home Editorial.dc.html
 */
.atl-ed-hero { position: relative; margin: 0; }
.atl-ed-hero-media { aspect-ratio: 21/8; }
.atl-ed-hero-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 18px; text-align: center; }
.atl-ed-hero-eyebrow { font-size: 12px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--atl-accent-2); }
.atl-ed-hero-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; line-height: 1.12; margin: 0; font-size: 58px; text-wrap: balance; }

.atl-ed-collections { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; padding: 48px 40px 0; }
.atl-ed-collection { text-decoration: none; color: var(--atl-text); display: flex; flex-direction: column; gap: 14px; }
.atl-ed-collection-media { aspect-ratio: 4/3; }
.atl-ed-collection-foot { display: flex; justify-content: space-between; align-items: baseline; }
.atl-ed-collection-name { font-family: 'Cormorant Garamond', serif; font-weight: 400; line-height: 1.12; margin: 0; font-size: 24px; text-wrap: balance; }
.atl-ed-collection-link { color: var(--atl-text); text-decoration: none; border-bottom: 1px solid var(--atl-accent); padding-bottom: 2px; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; }

.atl-ed-curated { padding: 56px 40px 0; }
.atl-ed-curated-head { text-align: center; margin-bottom: 26px; }
.atl-ed-curated-eyebrow { font-size: 12px; letter-spacing: 0.28em; text-transform: uppercase; color: var(--atl-accent-2); }
.atl-ed-curated-title { font-family: 'Cormorant Garamond', serif; font-weight: 400; line-height: 1.12; margin: 8px 0 0; font-size: 32px; text-wrap: balance; }

.atl-ed-lookbook { padding: 64px 0 0; }
.atl-ed-lookbook-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.atl-ed-lookbook-frame { aspect-ratio: 4/5; }
.atl-ed-lookbook-cta { text-align: center; padding: 28px 0 0; }
.atl-ed-lookbook-cta a { color: var(--atl-text); text-decoration: none; border-bottom: 1px solid var(--atl-accent); padding-bottom: 2px; font-size: 13px; letter-spacing: 0.14em; text-transform: uppercase; }

@media (max-width: 767px) {
  .atl-ed-hero-title { font-size: 32px; }
  /* 21/8 banner is only ~143px tall at 375px — far too short for the centered
     overlay (eyebrow + 2-line title + copy + CTA), so the absolutely-positioned
     overlay overflowed and overlapped the announcement bar. Give the hero a
     content-proof height on mobile and pad the overlay off the screen edges. */
  .atl-ed-hero-media { aspect-ratio: auto; min-height: 360px; }
  .atl-ed-hero-overlay { padding: 0 24px; }
  .atl-ed-collections { grid-template-columns: minmax(0, 1fr); padding: 32px 20px 0; }
  .atl-ed-curated { padding: 40px 20px 0; }
  .atl-ed-lookbook-grid { grid-template-columns: minmax(0, 1fr); }
}