:root{
    --ivory:#F5F1E9;
    --warm-white:#FBF9F5;
    --charcoal:#171717;
    --soft-black:#0C0C0C;
    --stone:#B7B0A4;
    --champagne:#B7A078;
    --taupe:#82796D;

    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-6: 24px;
    --space-8: 32px;
    --space-12: 48px;
    --space-16: 64px;
    --space-20: 80px;
    --space-24: 96px;
    --space-30: 120px;

    --dur-1: .5s;
    --dur-2: .9s;
    --ease: cubic-bezier(.16,.8,.24,1);
  }

  *{ box-sizing:border-box; margin:0; padding:0; }
  html{ scroll-behavior:smooth; }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
  }
@media (max-width: 759px) {
  .hero-foot .btn {
         /* ابعاد */
    width: 100px;
    height: 46px;

    /* فاصله داخلی */
    padding: 0 5px;

    /* فونت */
    font-family: "Vazirmatn", sans-serif;
    font-size: 11px;
    font-weight: 500;
    line-height: 1;

    /* فاصله حروف */
    letter-spacing: 0;

    /* وسط‌چین */
    display: inline-flex;
    align-items: center;
    justify-content: center;
    transform: translateY(-20px);
  }
}
  body{
    background:var(--ivory);
    color:var(--charcoal);
    font-family:'Vazirmatn', sans-serif;
    font-weight:300;
    line-height:1.8;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }

  img, svg{ display:block; max-width:100%; }

  .latin{
    font-family: Georgia, 'Times New Roman', serif;
    letter-spacing: .28em;
    text-transform: uppercase;
  }

  a{ color:inherit; text-decoration:none; }

  .wrap{
    max-width:1400px;
    margin:0 auto;
    padding-inline: var(--space-6);
  }
  @media (min-width:900px){
    .wrap{ padding-inline: var(--space-16); }
  }

  /* ---------- reveal ---------- */
  .reveal{
    opacity:0;
    transform: translateY(24px);
    transition: opacity var(--dur-2) var(--ease), transform var(--dur-2) var(--ease);
  }
  .reveal.in{ opacity:1; transform:none; }
  @media (prefers-reduced-motion: reduce){
    .reveal{ opacity:1; transform:none; transition:none; }
  }

  /* ---------- measure-line signature motif ---------- */
  .ruler{
    position:relative;
    height:1px;
    background:var(--stone);
    opacity:.5;
    margin: var(--space-12) 0;
  }
  .ruler::before, .ruler::after{
    content:"";
    position:absolute;
    top:-4px;
    width:1px;
    height:9px;
    background:var(--stone);
  }
  .ruler::before{ right:0; }
  .ruler::after{ left:0; }

  .tick-label{
    display:flex;
    justify-content:space-between;
    font-size:11px;
    letter-spacing:.18em;
    color:var(--taupe);
    margin-top:var(--space-2);
  }

  /* ---------- header ---------- */
  header{
    position:absolute;
    inset-inline:0;
    top:0;
    z-index:50;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding: var(--space-4) var(--space-6);
    mix-blend-mode: difference;
      position:absolute;
  top:14px;
    left:14px;
    right:14px;

    height:58px;
    padding:0 17px;

    border-radius:30px;

  display:flex;
  align-items:center;
  justify-content:space-between;

  border-radius:34px;

  /* شیشه حبابی */
  background:rgba(245,241,233,.20);

  backdrop-filter:blur(22px) saturate(160%);
  -webkit-backdrop-filter:blur(22px) saturate(160%);

  /* لبه شیشه */
  border:1px solid rgba(255,255,255,.32);

  /* عمق و انعکاس */
  box-shadow:
    0 8px 30px rgba(0,0,0,.14),
    inset 0 1px 1px rgba(255,255,255,.45),
    inset 0 -1px 1px rgba(255,255,255,.08);

  z-index:100;
  }
  header::before{
  content:"";
  position:absolute;

  top:1px;
  left:12%;
  right:12%;

  height:35%;

  border-radius:999px;

  background:linear-gradient(
    180deg,
    rgba(255,255,255,.32),
    transparent
  );

  pointer-events:none;
}
  @media (min-width:900px){
    header{ padding: var(--space-6) var(--space-16); }
  }
  header, header a, header button{ color:#F5F1E9; }

  .wordmark{ font-size:13px; }

  nav.desk-nav{ display:none; gap: var(--space-8); font-size:13px;
  letter-spacing:.05em; }
  @media (min-width:960px){ nav.desk-nav{ display:flex; } }

  .menu-btn{
    color: #F5F1E9;
    background:none; border:none; cursor:pointer;
    font-family:inherit; font-size:12px; letter-spacing:.22em;
    display:flex; align-items:center; gap:8px;
  }
  @media (min-width:960px){ .menu-btn{ display:none; } }

  .menu-btn .bar{ width:20px; height:1px; background:currentColor; display:block; }
  .menu-btn .bars{ display:flex; flex-direction:column; gap:4px; }
  @media (max-width:759px){
  .foot-bottom{
    padding-bottom: 90px;
  }
}
  /* ---------- mobile menu ---------- */
  #mobileMenu{
   position: fixed;
    inset: 0;

    /* بالاتر از هدر */
    z-index: 9999;

    background: var(--soft-black);
    color: var(--ivory);

    display: flex;
    flex-direction: column;
    justify-content: center;

    padding: var(--space-8);

    transform: translateY(-100%);
    visibility: hidden;
    pointer-events: none;
    transition: transform var(--dur-2) var(--ease), visibility 0s linear var(--dur-2);
}

#mobileMenu.open {
    transform: none;
    visibility: visible;
    pointer-events: auto;
    transition: transform var(--dur-2) var(--ease);
  }
  #mobileMenu a{ display:block; font-size:18px; padding: var(--space-3) 0; border-bottom:1px solid rgba(255,255,255,.08); }
  #mobileMenu .close{
    position:absolute; top:var(--space-6); left:var(--space-6);
    background:none; border:none; color:var(--ivory); font-size:13px; letter-spacing:.2em; cursor:pointer;
  }

  /* ---------- hero ---------- */
  .hero{
    position:relative;
    min-height:100svh;
    display:flex; flex-direction:column; justify-content:flex-end;
    background:
      radial-gradient(120% 90% at 30% 0%, #262420 0%, transparent 55%),
      linear-gradient(155deg, var(--soft-black) 0%, #201d19 55%, #2b2620 100%);
    color:var(--ivory);
    padding: var(--space-24) var(--space-6) var(--space-16);
    overflow:hidden;
  }
  @media (min-width:900px){ .hero{ padding: var(--space-24) var(--space-16) var(--space-20); } }

  .hero::before{
    content:"";
    position:absolute; inset:0;
    background-image: repeating-linear-gradient(90deg, rgba(255,255,255,.035) 0 1px, transparent 1px 120px);
    pointer-events:none;
  }

  .hero-eyebrow{
    font-size:12px; letter-spacing:.3em; color:var(--champagne);
    margin-bottom: var(--space-6);
  }
.hero::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    290deg,
    rgba(0,0,0,.72) 0%,
    rgba(0,0,0,.42) 38%,
    rgba(0,0,0,.08) 75%
  );
  pointer-events: none;
}

.hero-content {
  position: relative;
  z-index: 2;
}
  .hero h1{
    font-size: clamp(40px, 9vw, 108px);
    font-weight:200;
    line-height:1.18;
    max-width: 16ch;
    letter-spacing:-.01em;
      color: #F7F2E8;
  text-shadow:
    0 2px 4px rgba(0,0,0,.85),
    0 8px 30px rgba(0,0,0,.65);
  }

  .hero-foot{
    display:flex; flex-wrap:wrap; align-items:flex-end; justify-content:space-between;
    
    gap: var(--space-8);
    margin-top: var(--space-16);
  }

  .hero-copy{
    font-size:15px; color:var(--stone); max-width:32ch; font-weight:300;
  }

  .btn{
    display:inline-flex; align-items:center; gap:10px;
    border:1px solid currentColor;
    padding: 15px 30px;
    font-size:13px; letter-spacing:.14em;
    background:none; cursor:pointer; color:inherit;
    font-family:inherit;
    transition: background var(--dur-1) var(--ease), color var(--dur-1) var(--ease);
    white-space:nowrap;
  }
  .btn:hover{ background:currentColor; }
  .btn.on-dark:hover{ color:var(--soft-black); }
  .btn.on-light{ border-color:var(--charcoal); }
  .btn.on-light:hover{ color:var(--ivory); }

 .scroll-cue{
  position:absolute;
  bottom:90px;
  left:50%;
  transform:translateX(-50%);
  font-size:10px;
  letter-spacing:.3em;
  color:var(--stone);
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:10px;
}
/* ================================
   ROYA SADR — LUXURY HEADER TYPE
   ================================ */

header .wordmark {
    color: #f5f2ed !important;
    font-family: "Times New Roman", Georgia, serif !important;

    font-size: 25px !important;
    font-weight: 400 !important;

    letter-spacing: 7px !important;
    line-height: 1;

    opacity: 1 !important;

    text-shadow:
        0 2px 14px rgba(0, 0, 0, .75);

    transition:
        opacity .3s ease,
        text-shadow .3s ease,
        transform .3s ease;
}


/* منو */

header .menu-btn {
    color: #f5f2ed !important;

    font-family: "Vazirmatn", sans-serif !important;
    font-size: 17px !important;
    font-weight: 500 !important;

    letter-spacing: 0 !important;
    opacity: 1 !important;

    text-shadow:
        0 2px 10px rgba(0, 0, 0, .8);

    transition:
        opacity .3s ease,
        text-shadow .3s ease,
        transform .3s ease;
}


/* خطوط آیکون منو */

header .menu-btn .bar {
    background: #f5f2ed !important;

    box-shadow:
        0 1px 6px rgba(0, 0, 0, .7);
}


/* Hover */

header .wordmark:hover {
    text-shadow:
        0 2px 16px rgba(0, 0, 0, .85),
        0 0 12px rgba(245, 242, 237, .15);

    transform: translateY(-1px);
}

header .menu-btn:hover {
    text-shadow:
        0 2px 14px rgba(0, 0, 0, .9);

    transform: translateY(-1px);
}


/* موبایل */

@media (max-width: 759px) {

    header .wordmark {
        font-size: 20px !important;
        letter-spacing: 5px !important;
    }

    header .menu-btn {
        font-size: 15px !important;
    }

}
.scroll-cue .line{
  width:1px;
  height:36px;
  background:linear-gradient(var(--stone), transparent);
}

  /* ---------- section shell ---------- */
  section{ padding: var(--space-24) 0; }
  .eyebrow{
    font-size:12px; letter-spacing:.28em; color:var(--champagne); margin-bottom: var(--space-4);
  }
  h2{
    font-size: clamp(28px, 4.4vw, 52px);
    font-weight:200; line-height:1.28; letter-spacing:-.005em;
  }
  .lede{ font-size:17px; color:var(--taupe); max-width:56ch; margin-top:var(--space-6); font-weight:300; }

  /* ---------- statement ---------- */
  .statement{ text-align:center; }
  .statement .wrap{ max-width:900px; }
  .statement h2{ font-size:clamp(24px,4vw,40px); }

  /* ---------- plate (image placeholder) ---------- */
  .plate{
    position:relative;
    background:
      linear-gradient(160deg, #E3DACB 0%, #CFC3AE 45%, #B7A078 100%);
    aspect-ratio: 3/4;
    overflow:hidden;
  }
  .plate::after{
    content:"";
    position:absolute; inset:0;
    background-image: repeating-linear-gradient(115deg, rgba(255,255,255,.06) 0 2px, transparent 2px 5px);
    mix-blend-mode:overlay;
  }
  .plate.dark{ background: linear-gradient(160deg, #2b2620 0%, #171512 60%, #0C0C0C 100%); }
  .plate .cap{
    position:absolute; bottom:0; right:0; left:0;
    padding: var(--space-4) var(--space-5);
    display:flex; justify-content:space-between; align-items:flex-end;
    color:var(--warm-white);
    font-size:12px; letter-spacing:.08em;
    background:linear-gradient(0deg, rgba(0,0,0,.35), transparent);
  }

  /* ---------- craft / split ---------- */
  .split{
    display:grid; gap: var(--space-10, 40px);
    align-items:center;
  }
  @media (min-width:860px){
    .split{ grid-template-columns: .85fr 1fr; gap: var(--space-16); }
    .split.rev{ grid-template-columns: 1fr .85fr; }
    .split.rev .split-media{ order:2; }
  }

  .stat-row{ display:flex; gap: var(--space-10, 40px); margin-top: var(--space-8); flex-wrap:wrap; }
  .stat b{ display:block; font-size:34px; font-weight:200; }
  .stat span{ font-size:12px; letter-spacing:.1em; color:var(--taupe); }

  /* ---------- dress discovery ---------- */
  .rail{
    display:flex; gap: var(--space-4);
    overflow-x:auto;
    scroll-snap-type:x proximity;
    padding-bottom: var(--space-4);
    margin: 0 calc(-1 * var(--space-6));
    padding-inline: var(--space-6);
    -webkit-overflow-scrolling:touch;
  }
  @media (min-width:900px){ .rail{ margin:0; padding-inline:0; } }
  .rail::-webkit-scrollbar{ height:3px; }
  .rail::-webkit-scrollbar-thumb{ background:var(--stone); }

  .card{
    flex: 0 0 250px;
    scroll-snap-align:start;
  }
  @media (min-width:900px){ .card{ flex-basis: 300px; } }
  .card .plate{ aspect-ratio:3/4; margin-bottom:var(--space-3); }
  .card h3{ font-size:16px; font-weight:400; }
  .card p{ font-size:13px; color:var(--taupe); margin-top:2px; }

  /* ---------- why list ---------- */
  .why-list{ display:grid; gap:0; }
  .why-item{
    display:grid; grid-template-columns: auto 1fr; gap: var(--space-6);
    padding: var(--space-6) 0;
    border-top:1px solid rgba(23,23,23,.12);
  }
  .why-list .why-item:last-child{ border-bottom:1px solid rgba(23,23,23,.12); }
  .why-item .mark{ font-size:12px; color:var(--champagne); letter-spacing:.1em; padding-top:6px; }
  .why-item h3{ font-size:19px; font-weight:400; margin-bottom:4px; }
  .why-item p{ font-size:14px; color:var(--taupe); max-width:60ch; }

  /* ---------- editorial / journal ---------- */
  .journal-grid{
    display:grid; gap: var(--space-8);
  }
  /* =========================================
   SIGNATURE COLLECTION
   ========================================= */

.collection-set {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 14px;
  width: 100%;
}

.collection-item {
  min-width: 0;
}

.collection-item .plate {
  position: relative;
  width: 100%;
  aspect-ratio: 3 / 5;
  overflow: hidden;
  background: #171717;
}

.collection-item .plate img {
  position: absolute;
  inset: 0;

  width: 100%;
  height: 100%;

  object-fit: cover;
  object-position: center;

  display: block;

  transition: transform .8s cubic-bezier(.16,.8,.24,1);
}

.collection-item:hover .plate img {
  transform: scale(1.035);
}

.collection-item .cap {
  position: absolute;
  z-index: 2;
  bottom: 0;
  right: 0;
  left: 0;

  padding: 18px;

  display: flex;
  justify-content: space-between;
  align-items: flex-end;

  color: #fff;

  background: linear-gradient(
    0deg,
    rgba(0,0,0,.55),
    transparent
  );
}


/* ---------- MOBILE ---------- */

@media (max-width: 768px) {

  #collections {
    overflow: hidden;
  }

  #collections .wrap {
    padding-inline: 12px;
  }

  .collection-set {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 5px;
  }

  .collection-item .plate {
    aspect-ratio: 0.68 / 1;
  }

  .collection-item .plate img {
    object-fit: cover;
  }

  .collection-item .cap {
    padding: 8px 6px;
    font-size: 9px;
  }

  .collection-item .cap .latin {
    font-size: 6px !important;
    letter-spacing: .12em;
  }

}
  @media (min-width:760px){ .journal-grid{ grid-template-columns:repeat(3,1fr); } }
  .jcard .plate{ aspect-ratio:4/5; margin-bottom: var(--space-4); }
  .jcard .eyebrow{ font-size:11px; }
  .jcard h3{ font-size:19px; font-weight:400; margin-top:6px; }

  /* ---------- testimonial ---------- */
  .testi{
    background:var(--soft-black); color:var(--ivory);
  }
  .testi .wrap{ max-width:880px; text-align:center; }
  .testi q{
    display:block; font-size:clamp(20px,3.4vw,32px); font-weight:200; line-height:1.6;
  }
  .testi cite{ display:block; margin-top:var(--space-6); font-size:13px; color:var(--stone); font-style:normal; letter-spacing:.06em; }

  /* ---------- appointment cta ---------- */
  .appt{
    background: linear-gradient(160deg, #2b2620 0%, var(--soft-black) 100%);
    color:var(--ivory);
    text-align:center;
  }
  .appt .wrap{ max-width:760px; }
  .appt h2{ margin-bottom:var(--space-6); }
  .appt .btn{ margin-top:var(--space-8); }

  /* ---------- footer ---------- */
  footer{ background:var(--warm-white); padding-top:var(--space-20); }
  .foot-grid{
    display:grid; gap: var(--space-10, 40px);
    padding-bottom: var(--space-16);
    border-bottom:1px solid rgba(23,23,23,.12);
  }
 @media (max-width:759px){
  .foot-grid{
    display:flex;
    flex-direction:row;
    justify-content:space-between;
    align-items:flex-start;
    gap:12px;
    flex-wrap:nowrap;
  }

  .foot-grid > *{
    flex:1;
    min-width:0;
  }

  .foot-grid h4{
    font-size:10px;
    margin-bottom:12px;
    white-space:nowrap;
  }

  .foot-grid a,
  .foot-grid p{
    font-size:11px;
    line-height:1.8;
  }
}

  /* ---------- sticky mobile CTA ---------- */
.sticky-cta {
    position: fixed;
    bottom: var(--space-4);

    /* عرض دکمه */
    width: 280px;
    height: 64px;

    /* وسط صفحه */
    left: 50%;
    transform: translateX(-50%);

    z-index: 40;

    background: var(--soft-black);
    color: var(--ivory);

    display: flex;
    align-items: center;
    justify-content: center;

    padding: 0;

    font-size: 15px;
    font-weight: 500;
    letter-spacing: .08em;

    /* گرد کردن گوشه‌ها */
    border-radius: 36px;

    /* حاشیه لوکس */
    border: 1px solid rgba(245, 242, 237, .35);

    /* سایه */
    box-shadow:
        0 10px 35px rgba(0, 0, 0, .35);

    box-sizing: border-box;

    transition:
        transform .3s ease,
        box-shadow .3s ease,
        background .3s ease;
}
@media (max-width: 759px) {

    .sticky-cta {
        width: calc(80% - 48px);
        max-width: 340px;
        height: 60px;

        bottom: 20px;

        border-radius: 28px;

        font-size: 14px;
    }

}
  @media (min-width:960px){ .sticky-cta{ display:none; } }

  /* ---------- supplied editorial imagery ---------- */
  .hero{
    background:
      linear-gradient(180deg, rgba(0,0,0,.10) 0%, rgba(0,0,0,.12) 34%, rgba(0,0,0,.78) 100%),
      url("hero.webp") center 32% / cover no-repeat;
  }

  .hero::before{
    background:
      linear-gradient(90deg, rgba(0,0,0,.16), transparent 55%),
      repeating-linear-gradient(90deg, rgba(255,255,255,.025) 0 1px, transparent 1px 120px);
  }

  .hero-content{
    position:relative;
    z-index:2;
  }

  .hero h1{
    text-shadow:0 3px 24px rgba(0,0,0,.28);
  }

  .hero-copy{
    text-shadow:0 2px 14px rgba(0,0,0,.35);
  }

  .designer-photo{
    position:relative;
    aspect-ratio:3/4;
    overflow:hidden;
    background:#171717;
  }

  .designer-photo img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center center;
    filter:grayscale(100%);
    transition:transform 1.2s cubic-bezier(.16,.8,.24,1);
  }

  .designer-photo:hover img{
    transform:scale(1.025);
  }

  .designer-photo::after{
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg, transparent 55%, rgba(0,0,0,.28));
    pointer-events:none;
  }

  .designer-photo .cap{
    position:absolute;
    z-index:2;
    bottom:0;
    right:0;
    left:0;
    padding:var(--space-4) var(--space-5);
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    color:var(--warm-white);
    font-size:12px;
    letter-spacing:.08em;
    background:linear-gradient(0deg, rgba(0,0,0,.42), transparent);
  }

  @media (max-width:759px){
    .hero{
      background-position:center top;
    }
    .hero h1{
      max-width:13ch;
    }
  }