@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:ital,opsz,wght@0,6..96,500;0,6..96,700;0,6..96,900;1,6..96,500;1,6..96,700&display=swap');

/* =====================================================
   FASHION-HOUSE LAYER: scroll reveals, progress line,
   and the full-bleed "Made in Nepal" statement
   ===================================================== */

/* thin scroll progress line */
.scroll-line{ position:fixed; top:0; left:0; height:2px; width:100%; z-index:200; background:var(--madder);
  transform:scaleX(0); transform-origin:left; pointer-events:none; }

/* soft reveal on scroll (only when JS is running) */
html.js .rv{ opacity:0; transform:translateY(26px); transition:opacity .9s cubic-bezier(.2,.7,.2,1), transform .9s cubic-bezier(.2,.7,.2,1); }
html.js .rv.is-in{ opacity:1; transform:none; }
html.js .rv.d1{ transition-delay:.12s } html.js .rv.d2{ transition-delay:.24s }

/* slow image zoom on hover, like a lookbook */
.media-frame img{ transition:transform 1.4s cubic-bezier(.2,.7,.2,1); }
.media-frame:hover img{ transform:scale(1.045); }

/* ---------- MADE IN NEPAL STATEMENT ---------- */
.mn{
  position:relative; height:100vh; height:100svh; min-height:640px; padding:0; border:0;
  overflow:hidden; background:#14100d; color:#f6efe3; isolation:isolate;
}
.mn-media{ position:absolute; inset:0; z-index:-3; overflow:hidden; }
.mn-media img, .mn-media .mn-fg{ position:absolute; max-width:none; will-change:transform; transition:transform .6s cubic-bezier(.2,.7,.2,1); }
.mn-bg{
  inset:-6%; width:112%; height:112%; object-fit:cover; filter:blur(26px) brightness(.5) saturate(1.1);
  transform:translate3d(calc(var(--mx,0) * -10px), calc(var(--py,0px) * .4), 0) scale(1.08);
}
.mn-fg{
  top:-10%; right:2%; height:122%; width:auto;
  box-shadow:0 30px 120px rgba(0,0,0,.55);
  transform:translate3d(calc(var(--mx,0) * -26px), calc(var(--py,0px) + var(--my,0) * -18px), 0);
}
.mn-shade{
  position:absolute; inset:0; z-index:-2; pointer-events:none;
  background:
    linear-gradient(to right, rgba(14,10,8,.55) 0, rgba(14,10,8,.25) 40%, rgba(14,10,8,0) 62%),
    linear-gradient(to top, rgba(14,10,8,.75) 0, rgba(14,10,8,0) 38%);
}
.mn-glow{
  position:absolute; inset:0; z-index:-1; pointer-events:none; opacity:0; transition:opacity .5s;
  background:radial-gradient(520px circle at calc(50% + var(--mx,0) * 100%) calc(50% + var(--my,0) * 100%), rgba(255,236,205,.22), transparent 60%);
  mix-blend-mode:soft-light;
}
.mn:hover .mn-glow{ opacity:1; }

.mn-content{
  position:absolute; z-index:2; left:clamp(24px,6vw,96px); right:24px; bottom:clamp(96px,16vh,150px);
  transform:translate3d(calc(var(--mx,0) * 14px), calc(var(--my,0) * 10px), 0); transition:transform .6s cubic-bezier(.2,.7,.2,1);
}
.mn-kicker{
  font-size:13px; letter-spacing:.32em; text-transform:uppercase; color:rgba(246,239,227,.78); margin:0 0 clamp(8px,2vh,22px);
}
.mn-title{ margin:0; font-weight:inherit; color:inherit; }
.mn-small{
  display:block; font-family:'Bodoni Moda','Fraunces',serif; font-style:italic; font-weight:500;
  font-size:clamp(30px,5vw,76px); line-height:1; letter-spacing:.01em; margin-bottom:clamp(-14px,-1.2vw,-4px);
  opacity:0; transform:translateY(18px); transition:opacity 1s .1s, transform 1s .1s cubic-bezier(.2,.7,.2,1);
}
.mn-big{
  display:flex; font-family:'Bodoni Moda','Fraunces',serif; font-weight:900; text-transform:uppercase;
  font-size:clamp(84px,16vw,300px); line-height:.86; text-shadow:0 4px 40px rgba(0,0,0,.45); letter-spacing:.015em; color:#f6efe3;
}
.mn-big .ch{ display:inline-block; overflow:hidden; padding:.02em .01em .06em; }
.mn-big .ch > i{
  display:block; font-style:normal; transform:translateY(112%);
  transition:transform 1.25s cubic-bezier(.16,.84,.24,1); transition-delay:calc(var(--i) * 90ms + 250ms);
}
.mn.is-in .mn-small{ opacity:1; transform:none; }
.mn.is-in .mn-big .ch > i{ transform:none; }

/* interactive link */
.mn-link{
  display:inline-flex; align-items:center; gap:18px; margin-top:clamp(22px,4vh,40px);
  color:#f6efe3; text-decoration:none; font-size:15px; letter-spacing:.2em; text-transform:uppercase; font-weight:500;
  transition:transform .35s cubic-bezier(.2,.7,.2,1);
  opacity:0; transition:opacity 1s 1.3s, transform .35s cubic-bezier(.2,.7,.2,1);
}
.mn.is-in .mn-link{ opacity:1; }
.mn-link-text{ position:relative; padding-bottom:6px; }
.mn-link-text::after{
  content:''; position:absolute; left:0; bottom:0; height:1px; width:100%; background:currentColor;
  transform-origin:left; transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.mn-link:hover .mn-link-text::after{ transform:scaleX(.35); }
.mn-link-circle{
  position:relative; width:62px; height:62px; border-radius:50%; border:1px solid rgba(246,239,227,.7);
  display:grid; place-items:center; overflow:hidden; font-size:22px; letter-spacing:0;
  transition:transform .5s cubic-bezier(.2,.7,.2,1), border-color .4s, color .4s;
}
.mn-link-circle::before{
  content:''; position:absolute; inset:0; background:#f6efe3; border-radius:50%;
  transform:scale(0); transition:transform .5s cubic-bezier(.2,.7,.2,1);
}
.mn-link-circle span{ position:relative; transition:transform .5s cubic-bezier(.2,.7,.2,1); }
.mn-link:hover .mn-link-circle{ transform:scale(1.18); color:#14100d; }
.mn-link:hover .mn-link-circle::before{ transform:scale(1); }
.mn-link:hover .mn-link-circle span{ transform:translateX(4px) rotate(-45deg); }
.mn-link:focus-visible{ outline:2px solid #f6efe3; outline-offset:8px; }

/* running ticker */
.mn-ticker{
  position:absolute; left:0; right:0; bottom:0; z-index:2; overflow:hidden; white-space:nowrap;
  border-top:1px solid rgba(246,239,227,.28); background:rgba(14,10,8,.35); backdrop-filter:blur(6px);
  padding:15px 0; font-size:12.5px; letter-spacing:.3em; text-transform:uppercase; color:rgba(246,239,227,.85);
}
.mn-track{ display:inline-flex; gap:0; animation:mn-scroll 38s linear infinite; }
.mn-ticker:hover .mn-track{ animation-play-state:paused; }
.mn-track span{ padding-right:3.2em; }
.mn-track span::after{ content:'✦'; padding-left:3.2em; color:#c9a46a; }
@keyframes mn-scroll{ to{ transform:translateX(-50%); } }

@media(max-width:700px){
  .mn{ min-height:600px; }
  .mn-fg{ right:-12%; top:-4%; height:78%; }
  .mn-shade{ background:linear-gradient(to top, rgba(14,10,8,.9) 0, rgba(14,10,8,.45) 55%, rgba(14,10,8,.1) 100%); }
  .mn-big{ font-size:clamp(70px,24vw,150px); }
  .mn-link-circle{ width:52px; height:52px; }
  .mn-kicker{ letter-spacing:.2em; font-size:11.5px; }
}
@media (prefers-reduced-motion: reduce){
  html.js .rv{ opacity:1; transform:none; transition:none; }
  .mn-big .ch > i, .mn-small, .mn-link{ transition:none; transform:none; opacity:1; }
  .mn-track{ animation:none; } .mn-media img, .mn-content{ transition:none; }
}

/* ---------- STATEMENT HEROES: Weaving & Knitting ---------- */
.mn-page .mn-big{ font-size:clamp(70px,14.5vw,270px); }
.mn-fg--loom{ top:-2%; height:104%; aspect-ratio:760/900; width:auto; background:#e9dfcd; overflow:hidden; }
.mn-fg--loom svg{ width:100%; height:100%; display:block; }
.mn-fg--tall{ top:-8%; height:116%; }
.mn-lede{
  max-width:46ch; margin:clamp(14px,2.4vh,26px) 0 0; font-size:clamp(15px,1.3vw,19px); line-height:1.55; color:rgba(246,239,227,.88);
  opacity:0; transform:translateY(14px); transition:opacity 1s 1.1s, transform 1s 1.1s cubic-bezier(.2,.7,.2,1);
}
.mn.is-in .mn-lede{ opacity:1; transform:none; }
.mn-links{ display:flex; align-items:center; flex-wrap:wrap; gap:18px 44px; }
.mn-links .mn-link{ margin-top:clamp(18px,3vh,32px); }
.mn-sub{
  margin-top:clamp(18px,3vh,32px); color:rgba(246,239,227,.85); text-decoration:none; font-size:14px; letter-spacing:.2em; text-transform:uppercase;
  border-bottom:1px solid rgba(246,239,227,.4); padding-bottom:5px; transition:color .3s, border-color .3s, letter-spacing .4s;
}
.mn-sub:hover{ color:#fff; border-color:#fff; letter-spacing:.26em; }
@media(max-width:700px){
  .mn-page .mn-big{ font-size:clamp(56px,19vw,120px); }
  .mn-page .mn-content{ bottom:92px; }
  .mn-fg--loom{ right:-10%; top:-2%; height:62%; }
  .mn-fg--tall{ right:-10%; top:-2%; height:66%; }
  .mn-lede{ font-size:14.5px; }
}
@media(prefers-reduced-motion:reduce){ .mn-lede{ transition:none; opacity:1; transform:none; } }
.mn-fg--loom svg{ filter:brightness(.6) contrast(1.08) saturate(.9); }
.mn-fg--loom{ background:#3a3229; }
.mn-page .mn-big--long{ font-size:clamp(56px,12.6vw,232px); }
@media(max-width:700px){ .mn-page .mn-big--long{ font-size:clamp(46px,15.5vw,100px); } }