:root {
  --girly-red: #cc313c;
  --girly-pink: #facace;
  --girly-blush: #fff4f5;
  --girly-ink: #2b2023;
  --girly-green: #edf4ef;
}

body { background: var(--fashion-bg); color: var(--girly-ink); }
body .fashion-wrap { width: min(var(--fashion-page-width), calc(100% - (var(--fashion-desktop-gutter) * 2))); }
body [ui-layout="navbar"] { min-height: 70px; padding-block: 12px; background: var(--fashion-header-bg); color: var(--fashion-accent); border-bottom: 1px solid rgb(204 49 60 / 10%); }
body.fashion-home [ui-layout="navbar"] { position: relative; inset: auto; background: var(--fashion-header-bg) !important; color: var(--fashion-accent) !important; }
body [ui-layout="navbar"] .logo .name { color: var(--fashion-accent); font-family: var(--font-heading-family); font-size: clamp(25px, 2.2vw, 36px); font-weight: 400; }
body [ui-layout="navbar"] .links a,
body [ui-layout="navbar"] .actions button,
body [ui-layout="navbar"] .actions a { color: var(--fashion-accent) !important; }
body [ui-layout="navbar"] .links a { font-size: 11px; font-weight: 600; }
body .fashion-announcement { height: 34px; background: var(--fashion-notice-bg); color: var(--fashion-notice-text); }
body .fashion-announcement__track { min-height: 34px; }

.fashion-banner { background: var(--girly-pink); }
.fashion-banner__link { min-height: min(var(--fashion-hero-desktop), 820px); }
.fashion-banner picture img { height: min(var(--fashion-hero-desktop), 820px); min-height: 600px; object-position: center; }
.fashion-banner__copy { top: 50%; bottom: auto; left: max(5vw, calc((100vw - var(--fashion-page-width)) / 2)); right: auto; width: min(520px, 42vw); transform: translateY(-50%); gap: 12px; color: var(--fashion-hero-text); text-shadow: none; }
.fashion-banner__eyebrow { font-size: 11px; font-weight: 600; letter-spacing: .12em; }
.fashion-banner__copy strong { font-family: var(--font-heading-family); font-size: clamp(46px, 5.5vw, 88px); font-weight: 400; line-height: .94; }
.fashion-banner__description { max-width: 430px; font-size: 15px; line-height: 1.6; }
.fashion-banner__button { min-width: 0; min-height: 46px; margin-top: 8px; padding: 0 25px; border: 0; background: var(--fashion-accent); color: var(--fashion-accent-text); font-size: 12px; font-weight: 600; }
.fashion-banner__link:hover .fashion-banner__button { background: var(--girly-ink); color: #fff; }
.fashion-hero-announcement { background: var(--fashion-notice-bg); color: var(--fashion-notice-text); }
body.fashion-home .fashion-banner picture img { height: calc(var(--fashion-hero-desktop) - var(--fashion-home-notice-height)); max-height: 820px; min-height: 600px; object-position: center; }
body.fashion-home .fashion-banner__copy { inset: 50% auto auto max(5vw, calc((100vw - var(--fashion-page-width)) / 2)); width: min(520px, 42vw); transform: translateY(-50%); gap: 12px; }
body.fashion-home .fashion-banner__copy strong { max-width: 520px; font-size: clamp(46px, 5.5vw, 88px); line-height: .94; }
body.fashion-home .fashion-banner__button { width: auto; min-width: 0; min-height: 46px; padding: 0 25px; border: 0; background: var(--fashion-accent); color: var(--fashion-accent-text); font-size: 12px; font-weight: 600; }

.fashion-section { padding-block: clamp(50px, 6vw, 88px); }
.fashion-section-head { align-items: flex-end; margin-bottom: 28px; }
.fashion-section-head h2,
.fashion-social__heading h2,
.fashion-boutique__intro { color: var(--fashion-accent); font-family: var(--font-heading-family); font-size: clamp(34px, 4vw, 58px); font-weight: 400; line-height: 1; }
.fashion-section-head a { padding-bottom: 4px; color: var(--girly-ink); font-size: 11px; font-weight: 600; text-decoration: none; border-bottom: 1px solid currentColor; }
.fashion-grid { gap: 34px 14px; }
[ui-block="product"] .media { aspect-ratio: var(--fashion-card-ratio); background: var(--fashion-card-bg); }
[ui-block="product"] .content { gap: 4px; }
[ui-block="product"] .content .title { font-size: var(--fashion-card-title-size); font-weight: 500; }
[ui-block="product"] .content .price { color: var(--fashion-accent); font-size: var(--fashion-card-price-size); }
.fashion-card-action__toggle { background: #fff; color: var(--fashion-accent); border-radius: 50%; box-shadow: 0 3px 16px rgb(43 32 35 / 12%); }
.fashion-card-action__options { background: #fff; }

[ui-section="fashion-editorial-ribbon"] { background: var(--girly-pink) !important; color: var(--fashion-accent) !important; }

.fashion-shop-look { padding: clamp(64px, 8vw, 112px) 0; background: var(--girly-blush); }
.fashion-shop-look__inner { display: grid; grid-template-columns: minmax(0, 1.06fr) minmax(360px, .94fr); align-items: stretch; gap: 0; }
.fashion-shop-look__media { position: relative; min-height: 680px; overflow: hidden; }
.fashion-shop-look__media > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.fashion-shop-look__hotspot { position: absolute; left: var(--hotspot-x); top: var(--hotspot-y); transform: translate(-50%, -50%); display: grid; place-items: center; width: 36px; height: 36px; border: 1px solid #fff; border-radius: 50%; background: rgb(255 255 255 / 88%); color: var(--fashion-accent); text-decoration: none; box-shadow: 0 5px 25px rgb(43 32 35 / 18%); }
.fashion-shop-look__hotspot::after { content: ""; position: absolute; inset: -7px; border: 1px solid rgb(255 255 255 / 75%); border-radius: 50%; animation: girly-hotspot 2.4s ease-out infinite; }
@keyframes girly-hotspot { 0% { transform: scale(.75); opacity: 0; } 35% { opacity: 1; } 100% { transform: scale(1.35); opacity: 0; } }
.fashion-shop-look__content { display: flex; flex-direction: column; justify-content: center; padding: clamp(36px, 6vw, 92px); background: var(--fashion-accent); color: #fff; }
.fashion-shop-look__eyebrow { font-size: 10px; font-weight: 600; letter-spacing: .12em; }
.fashion-shop-look__content h2 { max-width: 520px; margin: 14px 0 16px; color: #fff; font-family: var(--font-heading-family); font-size: clamp(42px, 5vw, 70px); font-weight: 400; line-height: .98; }
.fashion-shop-look__description { max-width: 490px; margin: 0 0 26px; font-size: 13px; line-height: 1.65; }
.fashion-shop-look__items { border-top: 1px solid rgb(255 255 255 / 35%); }
.fashion-shop-look__item { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto 18px; align-items: center; gap: 12px; min-height: 74px; border-bottom: 1px solid rgb(255 255 255 / 35%); color: #fff; text-decoration: none; }
.fashion-shop-look__number { font-family: var(--font-heading-family); font-size: 18px; }
.fashion-shop-look__item > span:nth-child(2) { display: flex; flex-direction: column; gap: 3px; }
.fashion-shop-look__item strong { font-size: 12px; font-weight: 600; }
.fashion-shop-look__item small { opacity: .72; font-size: 10px; }
.fashion-shop-look__item em { font-size: 11px; font-style: normal; white-space: nowrap; }
.fashion-shop-look__button { align-self: flex-start; margin-top: 28px; padding: 13px 20px; background: #fff; color: var(--fashion-accent); font-size: 11px; font-weight: 600; text-decoration: none; }

.fashion-social--editorial { background: var(--girly-pink); }
.fashion-social__inner { width: min(var(--fashion-page-width), calc(100% - (var(--fashion-desktop-gutter) * 2))); margin-inline: auto; }
.fashion-reel__media { border-radius: 0 !important; }
.fashion-reel__placeholder-play { background: #fff; color: var(--fashion-accent); }
[ui-section="fashion-benefits-marquee"] { background: var(--girly-green) !important; }
.fashion-boutique { background: #fff; }
.fashion-boutique__media { border-radius: 0 !important; }

body [ui-section="single-collection"] { max-width: var(--fashion-page-width); padding-inline: var(--fashion-desktop-gutter); }
[ui-section="single-collection"] > [ui-slot="head"] { padding: clamp(44px, 7vw, 90px) 0 34px; border-bottom: 1px solid var(--fashion-border); text-align: center; }
[ui-section="single-collection"] > [ui-slot="head"] .heading { color: var(--fashion-accent); font-family: var(--font-heading-family); font-size: clamp(44px, 6vw, 76px); font-weight: 400; }
[ui-section="single-collection"] > [ui-slot="head"] .description { max-width: 720px; margin-inline: auto; color: var(--fashion-muted); }
[ui-section="single-collection"] .controller { padding-block: 20px; }
[ui-section="single-collection"] .items { gap: 38px 14px; }

[ui-section="single-product"] .core > .content { border-left: 1px solid var(--fashion-border); padding-left: clamp(24px, 3vw, 52px); }
[ui-section="single-product"] .core .content [ui-block="title"][data-size] { color: var(--fashion-accent); font-family: var(--font-heading-family); font-size: clamp(34px, 3.4vw, 52px); font-weight: 400; line-height: 1; }
[ui-section="single-product"] .ruby-inline-checkout { border-color: var(--fashion-border); background: var(--girly-blush); }
[ui-section="single-product"] .ruby-inline-checkout [ui-slot="button"],
[ui-section="single-product"] .fashion-product-cart-actions [ui-slot="button"] { background: var(--fashion-accent) !important; color: #fff !important; }
[ui-section="single-product"] .ruby-product-accordion summary { color: var(--girly-ink); }
[ui-section="fashion-product-confidence"] { background: var(--girly-green); }

body [ui-layout="footer"] { background: var(--fashion-footer-bg); color: var(--fashion-accent); }
body [ui-layout="footer"] .logo .name,
body [ui-layout="footer"] a { color: var(--fashion-accent); }

@media (max-width: 800px) {
  body .fashion-wrap,
  .fashion-social__inner { width: calc(100% - (var(--fashion-mobile-gutter) * 2)); }
  body [ui-layout="navbar"] { min-height: 60px; padding-inline: var(--fashion-mobile-gutter); }
  .fashion-banner__link { min-height: min(var(--fashion-hero-mobile), 680px); }
  .fashion-banner picture img { height: min(var(--fashion-hero-mobile), 680px); min-height: 520px; object-position: 64% center; }
  .fashion-banner__link::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgb(43 32 35 / 34%), transparent 72%); pointer-events: none; }
  .fashion-banner__copy { z-index: 1; top: auto; bottom: 9%; left: var(--fashion-mobile-gutter); right: var(--fashion-mobile-gutter); width: auto; transform: none; color: #fff; }
  .fashion-banner__copy strong { max-width: 310px; font-size: clamp(42px, 13vw, 62px); }
  .fashion-banner__description { max-width: 300px; font-size: 12px; }
  .fashion-banner__button { background: #fff; color: var(--fashion-accent); }
  body.fashion-home .fashion-banner picture img { height: calc(var(--fashion-hero-mobile) - var(--fashion-home-notice-height)); min-height: 520px; object-position: 64% center; }
  body.fashion-home .fashion-banner__copy { inset: auto var(--fashion-mobile-gutter) 9%; width: auto; transform: none; color: #fff !important; }
  body.fashion-home .fashion-banner__copy strong { max-width: 310px; font-size: clamp(42px, 13vw, 62px); }
  body.fashion-home .fashion-banner__button { width: auto; min-height: 44px; background: #fff; color: var(--fashion-accent); font-size: 11px; }
  .fashion-section-head { align-items: flex-end; }
  .fashion-section-head h2 { font-size: 36px; }
  .fashion-grid { grid-template-columns: repeat(var(--fashion-mobile-columns), minmax(0, 1fr)) !important; gap: 28px 8px; }
  .fashion-shop-look { padding-block: 52px; }
  .fashion-shop-look__inner { width: 100%; grid-template-columns: 1fr; }
  .fashion-shop-look__media { min-height: 0; aspect-ratio: 4 / 5; }
  .fashion-shop-look__content { padding: 38px var(--fashion-mobile-gutter) 44px; }
  .fashion-shop-look__content h2 { font-size: 44px; }
  .fashion-shop-look__item { grid-template-columns: 30px minmax(0, 1fr) auto 14px; gap: 8px; }
  body [ui-section="single-collection"] { padding-inline: var(--fashion-mobile-gutter) !important; }
  [ui-section="single-product"] .core > .content { border-left: 0; padding-left: 0; }
}

@media (prefers-reduced-motion: reduce) {
  .fashion-shop-look__hotspot::after { animation: none; }
}