
/* DIANA ULANOVA — LUXURY EDITORIAL IMAGE SYSTEM */
.lux-hero{
  width:min(1380px,94%);margin:0 auto;padding:34px 0 90px;
  display:grid;grid-template-columns:1.02fr .98fr;gap:22px;align-items:stretch;
}
.lux-hero-copy{
  min-height:720px;background:#151412;color:#fff;padding:76px 64px;
  display:flex;flex-direction:column;justify-content:flex-end;position:relative;overflow:hidden
}
.lux-hero-copy:before{
  content:"DIANA ULANOVA";position:absolute;top:34px;left:64px;
  font-size:10px;letter-spacing:.32em;opacity:.55
}
.lux-hero-copy h1{
  font:76px/.96 Georgia,serif;font-weight:400;margin:12px 0 25px;max-width:620px
}
.lux-hero-copy p{max-width:520px;font-size:17px;line-height:1.8;color:#d7d0c7}
.lux-hero-copy .btn{margin-top:25px;align-self:flex-start}
.lux-hero-media{position:relative;min-height:720px;background:#eee;overflow:hidden}
.lux-hero-media img{width:100%;height:100%;object-fit:cover;object-position:center;transition:transform .9s ease}
.lux-hero-media:hover img{transform:scale(1.025)}
.lux-caption{
  position:absolute;left:22px;bottom:22px;background:rgba(246,243,237,.93);
  padding:12px 14px;font-size:9px;letter-spacing:.18em;text-transform:uppercase
}

.lux-intro{padding:110px 0;text-align:center}
.lux-intro .eyebrow{margin-bottom:14px}
.lux-intro h2{font:58px/1.08 Georgia,serif;font-weight:400;max-width:920px;margin:0 auto 20px}
.lux-intro p{max-width:720px;margin:auto;line-height:1.85;color:#756e66;font-size:16px}

.lux-editorial{width:min(1380px,94%);margin:0 auto;padding:25px 0 115px}
.lux-editorial-grid{
  display:grid;grid-template-columns:1.15fr .85fr;grid-template-rows:440px 440px;gap:18px
}
.lux-shot{position:relative;overflow:hidden;background:#eee}
.lux-shot.tall{grid-row:1 / span 2}
.lux-shot img{width:100%;height:100%;object-fit:cover;transition:transform .8s ease}
.lux-shot:hover img{transform:scale(1.025)}
.lux-shot .lux-caption{background:rgba(20,19,17,.88);color:#fff}

.lux-product-story{
  width:min(1240px,92%);margin:0 auto;padding:110px 0;
  display:grid;grid-template-columns:.9fr 1.1fr;gap:70px;align-items:center
}
.lux-product-story-media{background:#fff;min-height:650px;display:flex;align-items:center;justify-content:center}
.lux-product-story-media img{width:95%;height:610px;object-fit:contain}
.lux-product-story-copy h2{font:56px/1.04 Georgia,serif;font-weight:400;margin:14px 0 25px}
.lux-product-story-copy p{font-size:16px;line-height:1.85;color:#756e66}
.lux-rule{width:48px;height:1px;background:#b69a68;margin:25px 0}

.lux-lookbook{background:#e7e1d9;padding:110px 0}
.lux-lookbook-inner{width:min(1380px,94%);margin:auto}
.lux-lookbook-head{display:flex;justify-content:space-between;align-items:end;gap:25px;margin-bottom:35px}
.lux-lookbook-head h2{font:55px Georgia,serif;font-weight:400;margin:10px 0 0}
.lux-lookbook-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.lux-lookbook-card{aspect-ratio:.72;overflow:hidden;background:#ddd;position:relative}
.lux-lookbook-card img{width:100%;height:100%;object-fit:cover;transition:transform .75s ease}
.lux-lookbook-card:hover img{transform:scale(1.03)}

.lux-mosaic{width:min(1380px,94%);margin:0 auto;padding:115px 0}
.lux-mosaic-grid{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-rows:115px;gap:16px}
.lux-mosaic-item{overflow:hidden;background:#eee;position:relative}
.lux-mosaic-item img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.lux-mosaic-item:hover img{transform:scale(1.025)}
.lux-mosaic-item:nth-child(1){grid-column:1/7;grid-row:1/6}
.lux-mosaic-item:nth-child(2){grid-column:7/13;grid-row:1/4}
.lux-mosaic-item:nth-child(3){grid-column:7/10;grid-row:4/7}
.lux-mosaic-item:nth-child(4){grid-column:10/13;grid-row:4/7}
.lux-mosaic-item:nth-child(5){grid-column:1/7;grid-row:6/9}
.lux-mosaic-item:nth-child(6){grid-column:7/13;grid-row:7/9}

.lux-quote{
  background:#151412;color:#fff;padding:120px 20px;text-align:center
}
.lux-quote h2{font:58px/1.12 Georgia,serif;font-weight:400;max-width:980px;margin:15px auto}
.lux-quote p{color:#bdb5ad;font-size:11px;letter-spacing:.18em;text-transform:uppercase}

.lux-rose-hero{
  width:min(1380px,94%);margin:30px auto 80px;display:grid;
  grid-template-columns:.9fr 1.1fr;background:#161513;color:#fff
}
.lux-rose-copy{padding:70px;display:flex;flex-direction:column;justify-content:center}
.lux-rose-copy h1{font:74px/.98 Georgia,serif;font-weight:400;margin:15px 0 20px}
.lux-rose-copy p{line-height:1.8;color:#d8d0c8}
.lux-rose-media{min-height:700px;overflow:hidden}
.lux-rose-media img{width:100%;height:100%;object-fit:cover}

.lux-atelier-gallery{width:min(1380px,94%);margin:0 auto 110px;display:grid;grid-template-columns:1fr 1fr;gap:18px}
.lux-atelier-gallery .lux-shot{min-height:620px}

@media(max-width:1000px){
  .lux-hero,.lux-product-story,.lux-rose-hero{grid-template-columns:1fr}
  .lux-hero-copy,.lux-hero-media{min-height:560px}
  .lux-editorial-grid{grid-template-columns:1fr;grid-template-rows:auto}
  .lux-shot,.lux-shot.tall{grid-row:auto;min-height:560px}
  .lux-lookbook-grid{grid-template-columns:repeat(2,1fr)}
  .lux-mosaic-grid{display:grid;grid-template-columns:1fr 1fr;grid-auto-rows:420px}
  .lux-mosaic-item:nth-child(n){grid-column:auto;grid-row:auto}
  .lux-atelier-gallery{grid-template-columns:1fr}
}
@media(max-width:640px){
  .lux-hero{width:100%;padding-top:0}
  .lux-hero-copy{padding:52px 28px;min-height:470px}
  .lux-hero-copy:before{left:28px}
  .lux-hero-copy h1{font-size:50px}
  .lux-hero-media{min-height:520px}
  .lux-intro{padding:75px 20px}
  .lux-intro h2{font-size:42px}
  .lux-editorial{width:92%;padding-bottom:80px}
  .lux-shot,.lux-shot.tall{min-height:430px}
  .lux-product-story{grid-template-columns:1fr;padding:80px 0;gap:35px}
  .lux-product-story-copy h2{font-size:43px}
  .lux-product-story-media{min-height:450px}
  .lux-product-story-media img{height:420px}
  .lux-lookbook{padding:80px 0}
  .lux-lookbook-grid{grid-template-columns:1fr 1fr;gap:8px}
  .lux-lookbook-head{align-items:start;flex-direction:column}
  .lux-lookbook-head h2{font-size:43px}
  .lux-mosaic{padding:80px 0}
  .lux-mosaic-grid{grid-template-columns:1fr;grid-auto-rows:460px}
  .lux-quote h2{font-size:42px}
  .lux-rose-copy{padding:50px 28px}
  .lux-rose-copy h1{font-size:52px}
  .lux-rose-media{min-height:540px}
}
