/* ==========================================================================
   Nashmiya Atelier — front end
   Identity: white ground, burgundy ink, gold tatreez; arch frames; stitch rule.
   Every rule is scoped under .nsh; resets use :where() so components win.
   ========================================================================== */

.nsh {
  --nsh-p: #9E1C22;
  --nsh-deep: #6E1218;
  --nsh-gold: #C4B58A;
  --nsh-gold-soft: #EDE6D3;
  --nsh-ink: #2B1517;
  --nsh-bg: #FFFFFF;
  --nsh-mist: #FBF9F6;
  --nsh-ink-soft: color-mix(in srgb, var(--nsh-ink) 68%, var(--nsh-bg));
  --nsh-line: color-mix(in srgb, var(--nsh-gold) 45%, var(--nsh-bg));
  --nsh-wa: #1F8F4E;
  --nsh-f-display: "Amiri", "Noto Naskh Arabic", "Times New Roman", serif;
  --nsh-f-body: "IBM Plex Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  --nsh-f-latin: "Marcellus", "Times New Roman", serif;
  --nsh-radius: 999px;

  --s--1: .875rem;
  --s-0: 1.0625rem;
  --s-1: 1.3rem;
  --s-2: 1.75rem;
  --s-3: clamp(1.9rem, 4vw, 2.75rem);
  --s-4: clamp(2.4rem, 6.4vw, 4.5rem);

  --wrap: 1200px;
  --gutter: clamp(1rem, 4vw, 3rem);
  --section: clamp(3.5rem, 9vw, 7.5rem);
  --ease: cubic-bezier(.22, .61, .36, 1);
  --header-h: 84px;
  --bottom-h: 0px;

  position: relative;
  background: var(--nsh-bg);
  color: var(--nsh-ink);
  font-family: var(--nsh-f-body);
  font-size: var(--s-0);
  line-height: 1.85;
  -webkit-font-smoothing: antialiased;
  text-align: right;
  overflow-x: clip;
}
@supports not (color: color-mix(in srgb, red, blue)) {
  .nsh { --nsh-ink-soft: #6B5557; --nsh-line: #E6DECC; }
}

/* ---------- Reset (zero specificity inside the root) ---------- */
.nsh :where(*, *::before, *::after) { box-sizing: border-box; }
.nsh :where(h1, h2, h3, h4, p, ul, ol, li, figure, figcaption, dl, dt, dd, blockquote) { margin: 0; padding: 0; }
.nsh :where(ul, ol) { list-style: none; }
.nsh :where(a) { color: inherit; text-decoration: none; }
.nsh :where(img) { max-width: 100%; height: auto; display: block; border: 0; }
.nsh :where(button) { font: inherit; color: inherit; background: none; border: 0; padding: 0; margin: 0; cursor: pointer; border-radius: 0; box-shadow: none; text-transform: none; letter-spacing: inherit; }
.nsh :where(input) { font: inherit; }
.nsh :where(h1, h2, h3, h4) { font-family: var(--nsh-f-display); font-weight: 700; line-height: 1.3; color: var(--nsh-ink); letter-spacing: 0; text-wrap: balance; }
.nsh :where(svg) { flex: none; }
.nsh [hidden] { display: none !important; }
.nsh :focus-visible { outline: 2px solid var(--nsh-p); outline-offset: 3px; }
.nsh .screen-reader-text { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(1px, 1px, 1px, 1px); white-space: nowrap; }
body.nsh-canvas { margin: 0; background: var(--nsh-bg, #fff); }

@media (prefers-reduced-motion: reduce) {
  .nsh *, .nsh *::before, .nsh *::after { animation: none !important; transition: none !important; }
}

/* ---------- Layout ---------- */
.nsh-wrap {
  width: 100%; max-width: var(--wrap); margin-inline: auto;
  padding-left: max(var(--gutter), env(safe-area-inset-left, 0px));
  padding-right: max(var(--gutter), env(safe-area-inset-right, 0px));
}
.nsh-section { padding-block: var(--section); }
.nsh-section--mist { background: var(--nsh-mist); }
.nsh-section--flush { padding-top: 0; }
.nsh-lede { font-size: var(--s-1); color: var(--nsh-ink-soft); line-height: 1.9; max-width: 34em; }
.nsh-eyebrow { font-size: var(--s--1); color: var(--nsh-p); font-weight: 500; letter-spacing: .02em; margin-bottom: .6rem; }

/* Stitch rule: a row of cross-stitched diamonds — the brand divider */
.nsh-stitch { height: 28px; max-width: 224px; background: var(--nsh-stitch) center / 32px 28px repeat-x; margin-bottom: 1.5rem; }
.nsh-stitch--center { margin-inline: auto; }
.nsh-stitch--wide { max-width: none; opacity: .85; margin-bottom: 3rem; }

/* ---------- Buttons ---------- */
.nsh .nsh-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .55em;
  min-height: 52px; padding: .65em 1.9em;
  font-family: var(--nsh-f-body); font-size: var(--s-0); font-weight: 500; line-height: 1.3;
  background: var(--nsh-p); color: #fff; border: 1px solid var(--nsh-p);
  border-radius: var(--nsh-radius); cursor: pointer; text-decoration: none; text-align: center;
  transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}
.nsh .nsh-btn:hover { background: var(--nsh-deep); border-color: var(--nsh-deep); color: #fff; }
.nsh .nsh-btn--ghost { background: transparent; color: var(--nsh-p); }
.nsh .nsh-btn--ghost:hover { background: var(--nsh-p); color: #fff; }
.nsh .nsh-btn--light { background: #fff; color: var(--nsh-p); border-color: #fff; }
.nsh .nsh-btn--light:hover { background: var(--nsh-gold-soft); border-color: var(--nsh-gold-soft); color: var(--nsh-deep); }
.nsh .nsh-btn--sm { min-height: 44px; padding: .5em 1.3em; font-size: .95rem; }
.nsh .nsh-btn--block { display: flex; width: 100%; }
.nsh-btns { display: flex; flex-wrap: wrap; gap: .85rem; align-items: center; }
.nsh-btns--center { justify-content: center; }

/* ---------- Header ---------- */
.nsh-header {
  position: sticky; top: env(safe-area-inset-top, 0px); z-index: 40;
  background: var(--nsh-bg); border-bottom: 1px solid transparent;
  transition: border-color .3s;
}
.nsh.is-scrolled .nsh-header { border-bottom-color: var(--nsh-line); }
.nsh-header__in { display: flex; align-items: center; justify-content: space-between; gap: 1.5rem; min-height: var(--header-h); }
.nsh-brand { display: flex; align-items: center; }
.nsh-brand img { height: 62px; width: auto; }
.nsh-nav { display: flex; gap: clamp(1rem, 2.4vw, 2.2rem); }
.nsh-nav a { font-size: .98rem; padding-block: .35rem; border-bottom: 1px solid transparent; transition: color .25s, border-color .25s; }
.nsh-nav a:hover, .nsh-nav a.is-active { color: var(--nsh-p); border-bottom-color: var(--nsh-gold); }

/* ---------- Mobile bottom bar ---------- */
.nsh-bottom { display: none; }
@media (max-width: 899px) {
  .nsh { --header-h: 64px; --bottom-h: calc(64px + env(safe-area-inset-bottom, 0px)); padding-bottom: var(--bottom-h); }
  .nsh-nav, .nsh-header__cta { display: none !important; }
  .nsh-header__in { justify-content: center; }
  .nsh-brand img { height: 46px; }
  .nsh-bottom {
    display: grid; grid-template-columns: repeat(5, 1fr);
    position: fixed; z-index: 45; inset: auto 0 0 0;
    background: var(--nsh-bg); border-top: 1px solid var(--nsh-line);
    padding: 6px max(8px, env(safe-area-inset-right, 0px)) calc(6px + env(safe-area-inset-bottom, 0px)) max(8px, env(safe-area-inset-left, 0px));
    box-shadow: 0 -8px 24px -18px rgba(43, 21, 23, .35);
  }
  .nsh-bottom a { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; min-height: 52px; font-size: .72rem; color: var(--nsh-ink-soft); border-radius: 12px; }
  .nsh-bottom a.is-active { color: var(--nsh-p); }
  .nsh-bottom a.is-active svg { stroke-width: 2; }
  .nsh-bottom .nsh-bottom__wa { color: var(--nsh-wa); font-weight: 500; }
  .nsh-wa-float { display: none !important; }
}

/* ---------- Floating WhatsApp (desktop) ---------- */
.nsh-wa-float {
  position: fixed; z-index: 45;
  bottom: calc(1.25rem + env(safe-area-inset-bottom, 0px)); left: calc(1.25rem + env(safe-area-inset-left, 0px));
  display: flex; align-items: center; gap: .55rem;
  background: var(--nsh-bg); color: var(--nsh-ink);
  border: 1px solid var(--nsh-line); border-radius: 999px;
  padding: .45rem .45rem .45rem 1.1rem;
  box-shadow: 0 10px 30px -12px rgba(43, 21, 23, .35);
  font-size: .92rem; font-weight: 500;
  transition: border-color .25s, color .25s;
}
.nsh-wa-float:hover { color: var(--nsh-p); border-color: var(--nsh-gold); }
.nsh-wa-float__icon { width: 40px; height: 40px; border-radius: 50%; background: var(--nsh-wa); color: #fff; display: grid; place-items: center; }

/* ---------- Frames ---------- */
.nsh-frame { position: relative; display: block; overflow: hidden; background: var(--nsh-gold-soft); max-width: 100%; }
.nsh-frame img { width: 100%; height: 100%; object-fit: cover; }
.nsh-frame--arch { border-radius: 999px 999px 0 0; }
.nsh-frame--tall { aspect-ratio: 3 / 4.2; }
.nsh-frame--card { aspect-ratio: 3 / 4; }
.nsh-ph { position: absolute; inset: 0; background: var(--nsh-gold-soft) var(--nsh-tatreez) center / 84px; }

/* ---------- Section heads ---------- */
.nsh-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 1.25rem 2rem; flex-wrap: wrap; margin-bottom: clamp(2rem, 4vw, 3rem); }
.nsh-head > div { min-width: 0; max-width: 40rem; }
.nsh-head h2 { font-size: var(--s-3); }
.nsh-head p { margin-top: .5rem; color: var(--nsh-ink-soft); }
.nsh-head--center { flex-direction: column; align-items: center; text-align: center; }
.nsh-head--center > div { margin-inline: auto; }

/* ---------- Hero ---------- */
.nsh-hero { padding-block: clamp(1.5rem, 5vw, 4rem) var(--section); }
.nsh-hero__grid { display: grid; grid-template-columns: 1.05fr .95fr; gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.nsh-hero__intro { min-width: 0; }
.nsh-hero__title { font-size: var(--s-4); color: var(--nsh-p); line-height: 1.45; margin-bottom: .45em; }
.nsh-hero .nsh-eyebrow { margin-bottom: 1.1rem; }
.nsh-hero__text { font-size: var(--s-1); color: var(--nsh-ink-soft); max-width: 26em; margin-bottom: 2.2rem; line-height: 1.9; }
.nsh-hero__occ { display: flex; flex-wrap: wrap; gap: .5rem 1.4rem; margin-top: 2.2rem; padding-top: 1.4rem; border-top: 1px solid var(--nsh-line); }
.nsh-hero__occ a { font-family: var(--nsh-f-display); font-size: var(--s-1); color: var(--nsh-ink); display: inline-flex; align-items: center; gap: .5rem; }
.nsh-hero__occ li + li a::before { content: ""; width: 7px; height: 7px; background: var(--nsh-gold); transform: rotate(45deg); margin-inline-end: .9rem; }
.nsh-hero__occ a:hover { color: var(--nsh-p); }
.nsh-hero__media { position: relative; }
.nsh-frame--hero { aspect-ratio: 3 / 4.1; max-width: 460px; margin-inline: auto; }
.nsh-hero__detail {
  position: absolute; width: clamp(110px, 30%, 170px); aspect-ratio: 1; border-radius: 50%;
  bottom: 6%; right: max(0px, calc(50% - 280px));
  border: 6px solid var(--nsh-bg); box-shadow: 0 0 0 1px var(--nsh-gold);
}
.nsh-hero__intro > * { animation: nsh-rise .9s var(--ease) both; }
.nsh-hero__intro > *:nth-child(2) { animation-delay: .08s; }
.nsh-hero__intro > *:nth-child(3) { animation-delay: .16s; }
.nsh-hero__intro > *:nth-child(4) { animation-delay: .24s; }
.nsh-hero__intro > *:nth-child(5) { animation-delay: .32s; }
.nsh-frame--hero { animation: nsh-unveil 1.3s var(--ease) both .15s; }
@keyframes nsh-rise { from { opacity: .001; transform: translateY(12px); } to { opacity: 1; transform: none; } }
@keyframes nsh-unveil { from { clip-path: inset(100% 0 0 0); } to { clip-path: inset(0); } }
@media (max-width: 860px) {
  .nsh-hero__grid { grid-template-columns: 1fr; gap: 2rem; }
  .nsh-hero__media { order: -1; }
  .nsh-frame--hero { max-width: 250px; }
  .nsh-hero__detail { width: 92px; right: calc(50% - 175px); bottom: 4%; border-width: 4px; }
  .nsh-hero__intro { text-align: center; }
  .nsh-hero__intro .nsh-stitch { margin-inline: auto; }
  .nsh-hero__text { margin-inline: auto; }
  .nsh-hero__intro .nsh-btns, .nsh-hero__occ { justify-content: center; }
}
@media (max-width: 380px) {
  .nsh-hero__detail { right: 4px; }
  .nsh-hero__intro .nsh-btns .nsh-btn { width: 100%; }
}

/* ---------- Occasions ---------- */
.nsh-occasions { display: grid; grid-template-columns: repeat(4, 1fr); gap: clamp(1rem, 2.4vw, 2rem); }
.nsh-occasion { display: flex; flex-direction: column; align-items: center; text-align: center; min-width: 0; }
.nsh-frame--occ { width: 100%; aspect-ratio: 3 / 4.3; }
.nsh-frame--occ img, .nsh-card .nsh-frame img, .nsh-work img { transition: transform 1.2s var(--ease); }
.nsh-occasion:hover .nsh-frame img, .nsh-card:hover .nsh-frame img { transform: scale(1.04); }
.nsh-occasion__name { font-family: var(--nsh-f-display); font-weight: 700; font-size: var(--s-2); margin-top: 1rem; line-height: 1.3; }
.nsh-occasion:hover .nsh-occasion__name { color: var(--nsh-p); }
.nsh-occasion__desc { font-size: var(--s--1); color: var(--nsh-ink-soft); line-height: 1.7; margin-top: .3rem; max-width: 22em; }
.nsh-occasion__count { font-size: .8rem; color: var(--nsh-p); margin-top: .5rem; }
@media (max-width: 900px) {
  .nsh-occasions { grid-template-columns: none; grid-auto-flow: column; grid-auto-columns: minmax(200px, 58%); overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: .75rem; overscroll-behavior-x: contain; scrollbar-width: thin; }
  .nsh-occasion { scroll-snap-align: start; }
}

/* ---------- Split ---------- */
.nsh-split { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(2rem, 7vw, 7rem); align-items: center; }
.nsh-split__text { min-width: 0; }
.nsh-split__text h2 { font-size: var(--s-3); margin-bottom: .6em; }
.nsh-split__media .nsh-frame--tall { max-width: 460px; }
.nsh-split--reverse .nsh-split__media { order: 2; }
@media (max-width: 860px) {
  .nsh-split { grid-template-columns: 1fr; }
  .nsh-split--reverse .nsh-split__media { order: 0; }
  .nsh-split__media .nsh-frame--tall { max-width: 340px; margin-inline: auto; }
}
.nsh-pillars { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.3rem 2rem; margin-top: 2rem; }
.nsh-pillars li { border-top: 1px solid var(--nsh-line); padding-top: 1rem; min-width: 0; }
.nsh-pillars strong { display: block; font-family: var(--nsh-f-display); font-size: var(--s-1); color: var(--nsh-p); font-weight: 700; line-height: 1.4; }
.nsh-pillars span { color: var(--nsh-ink-soft); font-size: .95rem; line-height: 1.7; }
@media (max-width: 520px) { .nsh-pillars { grid-template-columns: 1fr; } }

/* ---------- Piece cards ---------- */
.nsh-grid { display: grid; gap: clamp(2rem, 4vw, 3rem) clamp(.9rem, 2vw, 1.5rem); }
.nsh-grid--4 { grid-template-columns: repeat(4, 1fr); }
.nsh-grid--3 { grid-template-columns: repeat(3, 1fr); }
@media (max-width: 1000px) { .nsh-grid--4, .nsh-grid--3 { grid-template-columns: repeat(2, 1fr); } }
.nsh-card { display: flex; flex-direction: column; min-width: 0; }
.nsh-badge, .nsh-count, .nsh-status { position: absolute; z-index: 1; font-size: .78rem; line-height: 1; padding: .45em .9em; border-radius: 999px; }
.nsh-badge { top: .75rem; right: .75rem; background: var(--nsh-p); color: #fff; }
.nsh-count { bottom: .75rem; left: .75rem; background: rgba(255, 255, 255, .9); color: var(--nsh-ink); }
.nsh-status { top: .75rem; left: .75rem; background: var(--nsh-bg); color: var(--nsh-ink); border: 1px solid var(--nsh-line); }
.nsh-status--preorder { color: #7A5A12; border-color: var(--nsh-gold); background: #FBF5E4; }
.nsh-status--soldout { color: #5F5B5B; background: #F1EFEE; border-color: #DDD8D6; }
.nsh-status--available.nsh-status--inline { color: #2F6B3A; border-color: #BFD8C4; background: #F1F8F2; }
.nsh-status--inline { position: static; display: inline-flex; align-items: center; }
.nsh-card__body { display: flex; flex-direction: column; gap: .15rem; padding-top: .9rem; }
.nsh-card__occ { font-size: .8rem; color: var(--nsh-p); }
.nsh-card__title { font-family: var(--nsh-f-display); font-weight: 700; font-size: var(--s-1); line-height: 1.35; }
.nsh-card:hover .nsh-card__title { color: var(--nsh-p); }
.nsh-card__price { font-size: .95rem; font-weight: 500; font-variant-numeric: tabular-nums; }
.nsh-card__price del, .nsh-piece__price del { color: var(--nsh-ink-soft); font-weight: 400; font-size: .85em; margin-inline-start: .5em; }
.nsh-card__fabric { font-size: .82rem; color: var(--nsh-ink-soft); line-height: 1.6; }
@media (max-width: 520px) {
  .nsh-card__title { font-size: 1.1rem; }
  .nsh-card__price { font-size: .88rem; }
  .nsh-count { display: none; }
}

/* ---------- Embroidery band ---------- */
.nsh-band { background: var(--nsh-p); color: #fff; position: relative; overflow: hidden; }
.nsh-band::before { content: ""; position: absolute; inset-block: 0; right: 0; width: 64px; background: var(--nsh-tatreez) center top / 64px repeat-y; opacity: .5; }
.nsh-band .nsh-wrap { position: relative; }
.nsh-band h2 { color: #fff; }
.nsh-band .nsh-lede { color: rgba(255, 255, 255, .84); }
.nsh-band .nsh-frame { background: var(--nsh-deep); }
.nsh-details { display: grid; grid-template-columns: 1.3fr 1fr; grid-template-rows: 1fr 1fr; gap: .9rem; }
.nsh-details .nsh-frame { aspect-ratio: 1; }
.nsh-details .nsh-frame:first-child { grid-row: span 2; aspect-ratio: auto; min-height: 100%; border-radius: 999px 999px 0 0; }
.nsh-motifs { margin: 2rem 0 2.4rem; }
.nsh-motifs li { padding: 1rem 0; border-bottom: 1px solid rgba(255, 255, 255, .2); }
.nsh-motifs strong { display: block; font-family: var(--nsh-f-display); font-size: var(--s-1); color: var(--nsh-gold-soft); line-height: 1.4; }
.nsh-motifs span { color: rgba(255, 255, 255, .8); font-size: .95rem; }
@media (max-width: 860px) { .nsh-band::before { width: 40px; background-size: 40px; } }

/* ---------- Services ---------- */
.nsh-services { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 1.25rem; }
.nsh-service { display: flex; flex-direction: column; gap: .7rem; background: var(--nsh-bg); border: 1px solid var(--nsh-line); padding: 1.6rem 1.5rem; min-width: 0; }
.nsh-service h3 { font-size: var(--s-2); }
.nsh-service p { color: var(--nsh-ink-soft); font-size: .95rem; line-height: 1.8; }
.nsh-service__icon { width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: var(--nsh-gold-soft); color: var(--nsh-p); }
.nsh-service__foot { margin-top: auto; padding-top: 1rem; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem; border-top: 1px dashed var(--nsh-line); }
.nsh-service__price { font-weight: 500; color: var(--nsh-p); font-size: .95rem; }
.nsh-services--detailed { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: clamp(1.25rem, 3vw, 2rem); }
.nsh-services--detailed .nsh-service { padding: 0 0 1.6rem; border: 0; border-bottom: 1px solid var(--nsh-line); background: transparent; }
.nsh-frame--svc { aspect-ratio: 3 / 3.6; margin-bottom: .6rem; }
.nsh-services--detailed .nsh-service__icon { margin-top: -2.2rem; position: relative; border: 4px solid var(--nsh-bg); margin-inline-start: 1rem; }
.nsh-checks { display: grid; gap: .35rem; font-size: .93rem; }
.nsh-checks li { display: flex; gap: .5rem; align-items: flex-start; line-height: 1.7; }
.nsh-checks svg { color: var(--nsh-p); margin-top: .3em; }

/* ---------- Works (masonry) ---------- */
.nsh-works { columns: 3 230px; column-gap: 1rem; }
.nsh-work { break-inside: avoid; margin-bottom: 1.25rem; }
.nsh-work__btn { display: block; width: 100%; overflow: hidden; background: var(--nsh-gold-soft); cursor: zoom-in; }
.nsh-work__btn:hover img { transform: scale(1.03); }
.nsh-work figcaption { display: flex; justify-content: space-between; gap: 1rem; padding-top: .55rem; font-size: .9rem; }
.nsh-work figcaption a:hover { color: var(--nsh-p); }
.nsh-work figcaption span { color: var(--nsh-ink-soft); font-size: .82rem; }

/* ---------- Steps (a real sequence: numbered) ---------- */
.nsh-steps { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 2rem 1.5rem; counter-reset: nsh-step; }
.nsh-steps li { counter-increment: nsh-step; position: relative; padding-top: 4.2rem; min-width: 0; }
.nsh-steps li::before { content: counter(nsh-step, decimal-leading-zero); position: absolute; top: 0; right: 0; font-family: var(--nsh-f-display); font-size: 3.1rem; line-height: 1; color: var(--nsh-gold); }
.nsh-steps li::after { content: ""; position: absolute; top: 1.55rem; right: 4.3rem; left: -.75rem; border-top: 1px dashed var(--nsh-gold); }
.nsh-steps li:last-child::after { display: none; }
.nsh-steps h3 { font-size: var(--s-1); margin-bottom: .35rem; }
.nsh-steps p { color: var(--nsh-ink-soft); font-size: .95rem; line-height: 1.75; }
@media (max-width: 760px) {
  .nsh-steps { grid-template-columns: 1fr; gap: 0; }
  .nsh-steps li { padding: 0 4rem 2rem 0; min-height: 4.5rem; }
  .nsh-steps li::before { font-size: 2.5rem; }
  .nsh-steps li::after { top: 3.1rem; bottom: .3rem; right: 1.2rem; left: auto; border-top: 0; border-right: 1px dashed var(--nsh-gold); }
}

/* ---------- Stats / quotes ---------- */
.nsh-stats { background: var(--nsh-gold-soft); padding-block: 2.5rem; }
.nsh-stats ul { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 1.5rem; text-align: center; }
.nsh-stats strong { display: block; font-family: var(--nsh-f-display); font-size: var(--s-3); color: var(--nsh-p); line-height: 1.2; }
.nsh-stats span { color: var(--nsh-ink-soft); font-size: .92rem; }
.nsh-quotes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 2.5rem; }
.nsh-quote blockquote { font-family: var(--nsh-f-display); font-size: var(--s-1); line-height: 1.75; margin-bottom: 1rem; }
.nsh-quote blockquote::before { content: "”"; display: block; font-size: 3.4rem; line-height: .6; color: var(--nsh-gold); margin-bottom: .5rem; }
.nsh-quote figcaption { color: var(--nsh-ink-soft); font-size: .92rem; }

/* ---------- FAQ ---------- */
.nsh-faq-wrap { max-width: 860px; }
.nsh-faq details { border-bottom: 1px solid var(--nsh-line); }
.nsh-faq details:first-child { border-top: 1px solid var(--nsh-line); }
.nsh-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.15rem 0; font-family: var(--nsh-f-display); font-weight: 700; font-size: var(--s-1); line-height: 1.5; }
.nsh-faq summary::-webkit-details-marker { display: none; }
.nsh-faq summary::after { content: "+"; font-family: var(--nsh-f-body); font-weight: 300; font-size: 1.6rem; color: var(--nsh-p); line-height: 1; flex: none; transition: transform .3s var(--ease); }
.nsh-faq details[open] summary::after { transform: rotate(45deg); }
.nsh-faq details p { color: var(--nsh-ink-soft); padding-bottom: 1.3rem; max-width: 46em; }

/* ---------- Location ---------- */
.nsh-location { display: grid; grid-template-columns: 1fr 1.2fr; gap: 3rem; align-items: start; }
.nsh-location .nsh-lede { display: flex; gap: .5rem; align-items: flex-start; margin-bottom: 1rem; }
.nsh-hours { border-collapse: collapse; margin-top: .75rem; font-size: .95rem; }
.nsh-hours th, .nsh-hours td { padding: .4rem 0 .4rem 2rem; text-align: right; border-bottom: 1px solid var(--nsh-line); font-weight: 400; }
.nsh-open { display: inline-block; padding: .3em .9em; border-radius: 999px; font-size: .82rem; background: #F1EFEE; color: #5F5B5B; }
.nsh-open.is-open { background: #F1F8F2; color: #2F6B3A; }
.nsh-map iframe { width: 100%; aspect-ratio: 4 / 3; border: 0; }
@media (max-width: 860px) { .nsh-location { grid-template-columns: 1fr; } }

/* ---------- Final CTA ---------- */
.nsh-cta { text-align: center; padding-block: var(--section); background: var(--nsh-bg); }
.nsh-cta h2 { font-size: var(--s-3); color: var(--nsh-p); max-width: 16em; margin: 0 auto .5rem; }
.nsh-cta p { color: var(--nsh-ink-soft); max-width: 32em; margin: 0 auto 2rem; }

/* ---------- Inner page hero ---------- */
.nsh-page-hero { padding-block: clamp(2.5rem, 7vw, 5rem) clamp(1.75rem, 4vw, 3rem); text-align: center; }
.nsh-page-hero h1 { font-size: var(--s-4); color: var(--nsh-p); margin-bottom: .25em; }
.nsh-page-hero p { color: var(--nsh-ink-soft); font-size: var(--s-1); max-width: 32em; margin-inline: auto; }

/* ---------- Toolbar (pieces) ---------- */
.nsh-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: clamp(1.75rem, 4vw, 3rem); }
.nsh-chips { display: flex; gap: .5rem; overflow-x: auto; padding-bottom: 2px; scrollbar-width: none; min-width: 0; max-width: 100%; }
.nsh-chips::-webkit-scrollbar { display: none; }
.nsh .nsh-chips button { white-space: nowrap; padding: .5em 1.2em; border: 1px solid var(--nsh-line); border-radius: 999px; font-size: .95rem; background: var(--nsh-bg); transition: all .2s; }
.nsh .nsh-chips button small { font-size: .75rem; color: var(--nsh-ink-soft); margin-inline-start: .2rem; }
.nsh .nsh-chips button:hover { border-color: var(--nsh-gold); color: var(--nsh-p); }
.nsh .nsh-chips button.is-active { background: var(--nsh-p); border-color: var(--nsh-p); color: #fff; }
.nsh .nsh-chips button.is-active small { color: rgba(255, 255, 255, .8); }
.nsh-search { position: relative; display: flex; align-items: center; flex: 0 1 320px; min-width: 0; }
.nsh-search svg { position: absolute; right: 1rem; color: var(--nsh-ink-soft); pointer-events: none; }
.nsh .nsh-search input { width: 100%; min-height: 46px; padding: .5rem 2.75rem .5rem 1rem; border: 1px solid var(--nsh-line); border-radius: 999px; background: var(--nsh-bg); color: var(--nsh-ink); font-size: .95rem; box-shadow: none; }
.nsh .nsh-search input:focus { outline: none; border-color: var(--nsh-p); box-shadow: 0 0 0 3px color-mix(in srgb, var(--nsh-p) 14%, transparent); }
@media (max-width: 700px) { .nsh-search { flex: 1 1 100%; order: -1; } .nsh-chips { flex-wrap: wrap; overflow: visible; } }
.nsh-empty { text-align: center; padding: 3.5rem 1rem; border: 1px dashed var(--nsh-gold); display: grid; gap: 1.25rem; justify-items: center; }
.nsh-empty p { color: var(--nsh-ink-soft); max-width: 30em; }

/* ---------- Single piece ---------- */
.nsh-piece { padding-block: clamp(1rem, 3vw, 2rem) var(--section); }
.nsh-crumbs { display: flex; flex-wrap: wrap; gap: .45rem; font-size: .85rem; color: var(--nsh-ink-soft); margin-bottom: clamp(1rem, 3vw, 2rem); }
.nsh-crumbs a:hover { color: var(--nsh-p); }
.nsh-crumbs [aria-current] { color: var(--nsh-ink); }
.nsh-piece__grid { display: grid; grid-template-columns: 1.15fr 1fr; gap: clamp(1.75rem, 5vw, 4.5rem); align-items: start; }
.nsh-gallery { min-width: 0; }
.nsh-gallery__main { position: relative; }
.nsh .nsh-gallery__slide { position: relative; display: block; width: 100%; aspect-ratio: 4 / 5; background: var(--nsh-gold-soft); cursor: zoom-in; overflow: hidden; border-radius: 999px 999px 0 0; }
.nsh-gallery__slide img { width: 100%; height: 100%; object-fit: contain; }
.nsh-gallery__slide.is-active { animation: nsh-fade .45s var(--ease); }
@keyframes nsh-fade { from { opacity: .4; } to { opacity: 1; } }
.nsh-gallery__zoom { position: absolute; bottom: 1rem; left: 1rem; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .92); color: var(--nsh-ink); }
.nsh-gallery__thumbs { display: flex; gap: .6rem; margin-top: .8rem; overflow-x: auto; padding-bottom: 4px; scrollbar-width: thin; }
.nsh .nsh-gallery__thumbs button { flex: none; width: 72px; aspect-ratio: 3 / 4; overflow: hidden; background: var(--nsh-gold-soft); border: 1px solid transparent; opacity: .65; transition: opacity .2s, border-color .2s; }
.nsh .nsh-gallery__thumbs button.is-active, .nsh .nsh-gallery__thumbs button:hover { opacity: 1; border-color: var(--nsh-p); }
.nsh-gallery__thumbs img { width: 100%; height: 100%; object-fit: cover; }
.nsh-piece__info { position: sticky; top: calc(var(--header-h) + 1.5rem); min-width: 0; display: flex; flex-direction: column; gap: 1rem; }
.nsh-piece__tags { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.nsh-tag { display: inline-flex; align-items: center; padding: .38em 1em; border-radius: 999px; font-size: .8rem; line-height: 1; background: var(--nsh-gold-soft); color: var(--nsh-deep); }
.nsh-tag--gold { background: var(--nsh-p); color: #fff; }
.nsh-piece__title { font-size: var(--s-3); color: var(--nsh-p); line-height: 1.3; }
.nsh-piece__sku { font-size: .85rem; color: var(--nsh-ink-soft); margin-top: -.6rem; }
.nsh-piece__price { font-family: var(--nsh-f-display); font-weight: 700; font-size: var(--s-2); line-height: 1.3; font-variant-numeric: tabular-nums; }
.nsh-piece__lead { font-size: var(--s-1); color: var(--nsh-ink-soft); line-height: 1.85; }
.nsh-piece__actions { display: grid; gap: .65rem; margin-top: .25rem; }
.nsh-piece__note { display: flex; gap: .6rem; align-items: flex-start; font-size: .88rem; color: var(--nsh-ink-soft); background: var(--nsh-mist); padding: .9rem 1rem; line-height: 1.7; border-right: 2px solid var(--nsh-gold); }
.nsh-piece__note svg { color: var(--nsh-p); margin-top: .2em; }
.nsh-specs { border-top: 1px solid var(--nsh-line); margin-top: .25rem; }
.nsh-specs div { display: grid; grid-template-columns: 8.5rem 1fr; gap: 1rem; padding: .75rem 0; border-bottom: 1px solid var(--nsh-line); font-size: .95rem; }
.nsh-specs dt { color: var(--nsh-ink-soft); }
.nsh-specs dd { min-width: 0; }
@media (max-width: 860px) {
  .nsh-piece__grid { grid-template-columns: 1fr; }
  .nsh-piece__info { position: static; }
  .nsh .nsh-gallery__slide { border-radius: 260px 260px 0 0; }
}
@media (max-width: 420px) { .nsh-specs div { grid-template-columns: 6.5rem 1fr; } }

.nsh-story { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: clamp(1.75rem, 4vw, 3.5rem); margin-top: clamp(3rem, 7vw, 5.5rem); padding-top: 2.5rem; border-top: 1px solid var(--nsh-line); position: relative; }
.nsh-story::before { content: ""; position: absolute; top: -14px; right: 0; width: 160px; height: 28px; background: var(--nsh-bg) var(--nsh-stitch) center / 32px 28px repeat-x; }
.nsh-story__block { min-width: 0; }
.nsh-story__block h2 { font-size: var(--s-2); color: var(--nsh-p); margin-bottom: .6rem; }
.nsh-prose { color: var(--nsh-ink-soft); }
.nsh-prose p + p { margin-top: .9em; }
.nsh-prose strong { color: var(--nsh-ink); }

.nsh-order { margin-top: clamp(3rem, 7vw, 5rem); background: var(--nsh-mist); padding: clamp(1.75rem, 4vw, 3rem); display: grid; gap: 1.75rem; justify-items: start; }
.nsh-order h2 { font-size: var(--s-2); }
.nsh-order .nsh-steps { width: 100%; }
.nsh-steps--compact li { padding-top: 3.4rem; }
.nsh-steps--compact li::before { font-size: 2.4rem; }
.nsh-steps--compact li::after { top: 1.2rem; right: 3.6rem; }
@media (max-width: 760px) {
  .nsh-steps--compact li { padding-top: 0; }
  .nsh-steps--compact li::after { top: 2.6rem; right: 1rem; }
}
.nsh-related { margin-top: var(--section); }

/* ---------- Links (link in bio) ---------- */
.nsh-links { padding: clamp(1.5rem, 5vw, 3.5rem) max(16px, env(safe-area-inset-right, 0px)) var(--section) max(16px, env(safe-area-inset-left, 0px)); background: linear-gradient(var(--nsh-bg) 0, var(--nsh-bg) 40%, var(--nsh-mist) 100%); }
.nsh-links__card { max-width: 520px; margin-inline: auto; text-align: center; }
.nsh-links__logo { width: 150px; height: auto; margin: 0 auto 1rem; }
.nsh-links__bio { color: var(--nsh-ink-soft); max-width: 28em; margin: 0 auto 1rem; line-height: 1.85; }
.nsh-links__list { display: grid; gap: .8rem; margin-top: .5rem; text-align: right; }
.nsh-linkbtn { display: flex; align-items: center; gap: 1rem; min-height: 68px; padding: .6rem .7rem .6rem 1.2rem; background: var(--nsh-bg); border: 1px solid var(--nsh-line); border-radius: calc(min(var(--nsh-radius), 40px)); transition: border-color .25s, transform .25s var(--ease), box-shadow .25s; }
.nsh-linkbtn:hover { border-color: var(--nsh-gold); transform: translateY(-2px); box-shadow: 0 12px 24px -18px rgba(43, 21, 23, .45); }
.nsh-linkbtn__icon { width: 48px; height: 48px; border-radius: 50%; display: grid; place-items: center; background: var(--nsh-gold-soft); color: var(--nsh-p); flex: none; }
.nsh-linkbtn__text { display: flex; flex-direction: column; flex: 1; min-width: 0; line-height: 1.45; }
.nsh-linkbtn__text strong { font-weight: 500; }
.nsh-linkbtn__text small { font-size: .8rem; color: var(--nsh-ink-soft); }
.nsh-linkbtn__arrow { color: var(--nsh-gold); }
.nsh-linkbtn--whatsapp { background: var(--nsh-p); border-color: var(--nsh-p); color: #fff; }
.nsh-linkbtn--whatsapp .nsh-linkbtn__icon { background: rgba(255, 255, 255, .16); color: #fff; }
.nsh-linkbtn--whatsapp small, .nsh-linkbtn--whatsapp .nsh-linkbtn__arrow { color: rgba(255, 255, 255, .8); }
.nsh-links__social { display: flex; justify-content: center; gap: .7rem; margin-top: 2rem; }
.nsh-links__social a { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; border: 1px solid var(--nsh-line); color: var(--nsh-p); background: var(--nsh-bg); }
.nsh-links__social a:hover { border-color: var(--nsh-p); }
.nsh[data-state="links"] .nsh-footer { display: none; }

/* ---------- Footer ---------- */
.nsh-footer { padding-block: 3.5rem 2rem; background: var(--nsh-bg); }
.nsh-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 2.5rem; }
.nsh-footer__grid > div { min-width: 0; }
.nsh-footer__brand img { height: 84px; width: auto; margin-bottom: 1rem; }
.nsh-footer__brand p { color: var(--nsh-ink-soft); font-size: .95rem; max-width: 22em; }
.nsh-footer h4 { font-size: var(--s-1); color: var(--nsh-p); margin-bottom: .9rem; }
.nsh-footer li { margin-bottom: .5rem; }
.nsh-footer a:hover { color: var(--nsh-p); }
.nsh-contact a { display: inline-flex; align-items: center; gap: .55rem; }
.nsh-contact svg { color: var(--nsh-p); }
.nsh-footer__bottom { margin-top: 2.5rem; padding-top: 1.4rem; border-top: 1px solid var(--nsh-line); display: flex; justify-content: space-between; flex-wrap: wrap; gap: .75rem; font-size: var(--s--1); color: var(--nsh-ink-soft); }
@media (max-width: 860px) { .nsh-footer__grid { grid-template-columns: 1fr 1fr; } .nsh-footer__brand { grid-column: 1 / -1; } }
@media (max-width: 480px) { .nsh-footer__grid { grid-template-columns: 1fr; } }

/* ---------- Lightbox ---------- */
.nsh-lightbox { position: fixed; inset: 0; z-index: 100; background: rgba(24, 10, 11, .95); display: grid; place-items: center; padding: max(16px, env(safe-area-inset-top, 0px)) max(16px, env(safe-area-inset-right, 0px)) max(16px, env(safe-area-inset-bottom, 0px)) max(16px, env(safe-area-inset-left, 0px)); }
.nsh-lightbox__fig { margin: 0; display: grid; gap: .75rem; justify-items: center; max-width: 100%; }
.nsh-lightbox__fig img { max-width: min(92vw, 1100px); max-height: 84vh; width: auto; height: auto; object-fit: contain; }
.nsh-lightbox__fig figcaption { color: rgba(255, 255, 255, .85); font-size: .92rem; text-align: center; }
.nsh .nsh-lightbox__close, .nsh .nsh-lightbox__nav { position: absolute; color: #fff; width: 52px; height: 52px; border-radius: 50%; display: grid; place-items: center; background: rgba(255, 255, 255, .08); }
.nsh .nsh-lightbox__close:hover, .nsh .nsh-lightbox__nav:hover { background: rgba(255, 255, 255, .18); }
.nsh-lightbox__close { top: calc(14px + env(safe-area-inset-top, 0px)); left: calc(14px + env(safe-area-inset-left, 0px)); }
.nsh-lightbox__prev { right: calc(14px + env(safe-area-inset-right, 0px)); top: 50%; transform: translateY(-50%); }
.nsh-lightbox__next { left: calc(14px + env(safe-area-inset-left, 0px)); top: 50%; transform: translateY(-50%); }
@media (max-width: 600px) { .nsh-lightbox__prev, .nsh-lightbox__next { top: auto; bottom: calc(16px + env(safe-area-inset-bottom, 0px)); transform: none; } }
.nsh-lock { overflow: hidden; }

/* WordPress admin bar (logged-in view) */
.admin-bar .nsh-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .nsh-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .nsh-header { top: 0; } }
