/* ===================== CANDLE LAND LIFESTYLE: STYLES =====================
   Sab kuch .clf-root ke andar scoped hai taake theme par asar na pare.
   Design values original section jaise hi hain.
========================================================================== */
.clf-root{
  --clf-night:#0E0D18;
  --clf-wax:#C88FA1;
  --clf-ember:#FFB463;
  --clf-paper:#F4EBE8;
  --clf-display:"Fraunces",Georgia,serif;
  --clf-sans:"Jost",system-ui,-apple-system,"Segoe UI",sans-serif;
  --clf-gut:clamp(20px,5vw,72px);
  --clf-maxw:1440px;
  width:100%;
  overflow-x:clip;
}
.clf-root *,.clf-root *::before,.clf-root *::after{box-sizing:border-box}
.clf-root h2,.clf-root p,.clf-root figure,.clf-root figcaption{margin:0;padding:0}
.clf-root img{max-width:100%;display:block;border:0;box-shadow:none}

/* section */
.clf-root .clf-life{
  background:var(--clf-night);color:var(--clf-paper);
  padding-block:clamp(90px,13vw,180px);overflow:hidden;
  font-family:var(--clf-sans);font-weight:300;line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
.clf-root .clf-wrap{max-width:var(--clf-maxw);margin-inline:auto;padding-inline:var(--clf-gut)}

/* head */
.clf-root .clf-head{margin-bottom:clamp(44px,6vw,86px)}
.clf-root .clf-rv{display:block;overflow:hidden;padding-bottom:.06em}
.clf-root .clf-rv > span{display:block;will-change:transform}
.clf-root .clf-kicker{font-size:clamp(.66rem,.78vw,.76rem);letter-spacing:.24em;text-transform:uppercase;
  font-weight:400;line-height:1.6;color:var(--clf-wax)!important}
.clf-root .clf-display,
.clf-root .clf-display *{color:var(--clf-paper)!important}
.clf-root .clf-display{
  margin-top:20px;
  font-family:var(--clf-display);font-weight:300;
  font-variation-settings:"SOFT" 40,"WONK" 1,"opsz" 120;
  font-size:clamp(2.1rem,5.2vw,4.2rem);line-height:.92;letter-spacing:-.022em;
  text-transform:none;max-width:14ch;
}
.clf-root .clf-display em{font-style:italic;font-weight:300;font-family:inherit}

/* grid */
.clf-root .clf-grid{display:grid;gap:clamp(14px,2vw,28px);align-items:start}
.clf-root .clf-grid.is-mag{grid-template-columns:repeat(12,1fr)}
.clf-root .clf-grid.is-even{grid-template-columns:repeat(2,1fr)}
.clf-root .clf-grid.is-even .clf-tile{aspect-ratio:4/3}

/* magazine layout (chaar images) */
.clf-root .is-mag .clf-t1{grid-column:1/8;aspect-ratio:16/10}
.clf-root .is-mag .clf-t2{grid-column:8/13;aspect-ratio:3/4;margin-top:clamp(30px,6vw,90px)}
.clf-root .is-mag .clf-t3{grid-column:1/5;aspect-ratio:1;margin-top:clamp(14px,2vw,28px)}
.clf-root .is-mag .clf-t4{grid-column:5/13;aspect-ratio:16/9;margin-top:clamp(14px,2vw,28px)}

/* tile */
.clf-root .clf-tile{position:relative;overflow:hidden;border-radius:3px;background:rgba(244,235,232,.04)}
.clf-root .clf-tile img{width:100%;height:100%;object-fit:cover;transform:scale(1.14);will-change:transform}
.clf-root .clf-tile figcaption{position:absolute;left:0;right:0;bottom:0;padding:clamp(16px,2.2vw,30px);
  background:linear-gradient(transparent,rgba(7,6,12,.86));
  font-family:var(--clf-display);font-weight:400;font-size:clamp(1rem,1.7vw,1.45rem);line-height:1.25;
  text-transform:none;letter-spacing:normal;
  font-variation-settings:"SOFT" 50,"WONK" 1;color:var(--clf-paper)!important}
.clf-root .clf-tile figcaption small{display:block;font-family:var(--clf-sans);font-size:.74rem;letter-spacing:.14em;
  text-transform:uppercase;margin-bottom:7px;font-weight:400;line-height:1.6;color:var(--clf-wax)!important}

.clf-root :focus-visible{outline:2px solid var(--clf-ember);outline-offset:4px;border-radius:2px}

@media (prefers-reduced-motion:reduce){
  .clf-root *,.clf-root *::before,.clf-root *::after{animation-duration:.001ms!important;
    animation-iteration-count:1!important;transition-duration:.01ms!important}
  .clf-root .clf-tile img{transform:none}
}

@media (max-width:820px){
  .clf-root .clf-grid,
  .clf-root .clf-grid.is-mag,
  .clf-root .clf-grid.is-even{grid-template-columns:1fr}
  .clf-root .clf-grid .clf-tile,
  .clf-root .is-mag .clf-t1,.clf-root .is-mag .clf-t2,
  .clf-root .is-mag .clf-t3,.clf-root .is-mag .clf-t4{grid-column:1/-1;margin-top:0}
  .clf-root .is-mag .clf-t2{aspect-ratio:4/5}
  .clf-root .is-mag .clf-t3{aspect-ratio:4/3}
}