*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

    :root {
      --ivory:      #F5EFE0;
      --cream:      #EDE6D6;
      --gold:       #C8963E;
      --gold-light: #DEB06A;
      --gold-pale:  #EDD08A;
      --warm-black: #05060A;
      --charcoal:   #22252E;
      --dark:       #110E0C;
      --navy:       #1B2A4A;
      --mid:        #6A6058;
      --soft:       #908880;
      --border:     #DDD4C0;
      --white:      #FFFFFF;
    }

    html {
      scroll-behavior: smooth;
      overflow-x: hidden;  /* prevent any element from bleeding past the right edge */
    }

    body {
      background: var(--white);
      color: var(--charcoal);
      font-family: 'Optima', 'Jost', sans-serif;
      font-weight: 300;
      font-size: 15px;
      line-height: 1.78;
      -webkit-font-smoothing: antialiased;
      overflow-x: hidden;
      max-width: 100%;
    }

    /* ─── SCROLL REVEAL ─── */
    .reveal {
      opacity: 0;
      transform: translateY(18px);
      filter: blur(1.5px);
      transition: opacity 0.78s cubic-bezier(0.22,1,0.36,1),
                  transform 0.78s cubic-bezier(0.22,1,0.36,1),
                  filter 0.6s ease;
      will-change: transform, opacity;
    }
    .reveal.visible { opacity: 1; transform: none; filter: blur(0); will-change: auto; }
    .reveal-delay-1 { transition-delay: 0.1s; }
    .reveal-delay-2 { transition-delay: 0.22s; }
    .reveal-delay-3 { transition-delay: 0.34s; }
    .reveal-delay-4 { transition-delay: 0.46s; }
    .reveal-delay-5 { transition-delay: 0.58s; }

    /* ─── NAV ─── */
    nav {
      position: fixed; top: 0; left: 0; right: 0; z-index: 200;
      display: flex; flex-direction: column; align-items: center;
      padding: 24px 56px 0;
      background: transparent;
      border-bottom: 1px solid transparent;
      transition: padding 0.4s ease, background 0.4s ease, box-shadow 0.4s ease, border-color 0.4s ease;
    }
    nav.scrolled {
      padding: 24px 56px 0;
      background: rgba(245,239,224,0.97);
      backdrop-filter: blur(14px);
      border-bottom-color: rgba(200,150,62,0.12);
      box-shadow: 0 2px 40px rgba(5,6,10,0.07);
    }
    /* top row: logo centred, cart/lang pinned right */
    .nav-top {
      width: 100%; display: flex; justify-content: center; align-items: center;
      position: relative; padding-bottom: 14px; padding-top: 8px;
    }
    .nav-logo { text-decoration: none; }
    .nav-logo-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 30px; font-weight: 500; letter-spacing: 0.22em;
      text-transform: uppercase; color: var(--ivory);
      line-height: 1;
      transition: color 0.4s ease;
    }
    nav.scrolled .nav-logo-name { color: var(--charcoal); }
    .nav-logo-sub { display: none; }
    .nav-logo-img {
      height: 52px; width: auto; display: block;
      filter: brightness(0) invert(1) sepia(6%) brightness(97%);
      transition: filter 0.4s ease;
    }
    nav.scrolled .nav-logo-img { filter: none; }
    .nav-left {
      position: absolute; left: 0; top: 50%; transform: translateY(-50%);
      display: flex; align-items: center;
    }
    .nav-right {
      position: absolute; right: 0; top: 50%; transform: translateY(-50%);
      display: flex; align-items: center; gap: 20px;
    }
    /* bottom row: links centred */
    .nav-links {
      display: flex; gap: 40px; list-style: none; align-items: center;
      padding-bottom: 16px;
    }
    .nav-links a {
      font-size: 10.5px; letter-spacing: 0.18em; text-transform: uppercase;
      color: rgba(245,239,224,0.75); text-decoration: none;
      transition: color 0.25s; position: relative;
    }
    nav.scrolled .nav-links a { color: var(--mid); }
    .nav-links a::after {
      content: ''; position: absolute; bottom: -3px; left: 0; right: 0;
      height: 1px; background: var(--gold);
      transform: scaleX(0); transform-origin: left;
      transition: transform 0.3s ease;
    }
    .nav-links a:hover { color: var(--charcoal); }
    .nav-links a:hover::after { transform: scaleX(1); }
    .nav-right { display: flex; align-items: center; gap: 20px; }
    .lang-toggle {
      font-size: 9.5px; letter-spacing: 0.2em; text-transform: uppercase;
      color: rgba(245,239,224,0.78); cursor: pointer; border: none; background: none;
      font-family: 'Optima', 'Jost', sans-serif;
      transition: color 0.4s ease;
    }
    nav.scrolled .lang-toggle { color: var(--soft); }
    .cart-btn {
      font-size: 10.5px; letter-spacing: 0.15em; text-transform: uppercase;
      color: rgba(245,239,224,0.85); cursor: pointer;
      border: 1px solid rgba(245,239,224,0.35); padding: 9px 18px;
      transition: all 0.3s; background: transparent;
      font-family: 'Optima', 'Jost', sans-serif;
    }
    nav.scrolled .cart-btn { color: var(--mid); border-color: var(--border); }
    .cart-btn:hover { border-color: var(--gold); color: var(--gold); }
    /* hamburger + backdrop hidden on desktop */
    .nav-hamburger { display: none; }
    .nav-backdrop { display: none; }

    /* nav eyebrow — between logo and links */
    .nav-top { padding-bottom: 20px; } /* space below MALQETA */
    .nav-eyebrow {
      display: flex; align-items: center; gap: 18px; padding-bottom: 20px;
      max-height: 40px; overflow: hidden; opacity: 1;
      transition: max-height 0.4s ease, opacity 0.3s ease, padding 0.4s ease;
    }
    nav.scrolled .nav-eyebrow {
      max-height: 0; opacity: 0; padding-bottom: 0;
    }
    .nav-eyebrow-line {
      width: 32px; height: 1px; background: rgba(200,150,62,0.35);
      transition: background 0.4s;
    }
    nav.scrolled .nav-eyebrow-line { background: rgba(200,150,62,0.5); }
    .nav-eyebrow-text {
      font-size: 9px; letter-spacing: 0.38em; text-transform: uppercase;
      color: rgba(200,150,62,0.85); font-family: 'Optima','Jost',sans-serif;
      transition: color 0.4s;
    }
    nav.scrolled .nav-eyebrow-text { color: var(--gold); }

    /* ─── HERO ─── */
    .hero {
      position: relative;
      height: 100vh;
      overflow: hidden;
    }
    .hero-visual {
      position: absolute; inset: 0;
      background: linear-gradient(145deg, #2C1810 0%, #4A2C1A 35%, #3D2415 100%);
    }
    .hero-img {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      object-fit: cover; object-position: center;
    }
    .hero-img-overlay {
      position: absolute; inset: 0;
      background:
        linear-gradient(to bottom,
          rgba(5,6,10,0.55) 0%,
          rgba(5,6,10,0.18) 28%,
          rgba(5,6,10,0.14) 55%,
          rgba(5,6,10,0.78) 100%);
      z-index: 1;
    }
    .hero-badge {
      position: absolute; bottom: 44px; left: 44px; z-index: 3;
      border: 1px solid rgba(200,150,62,0.45);
      padding: 10px 20px;
      background: rgba(17,14,12,0.42);
      backdrop-filter: blur(6px);
    }
    .hero-badge-text {
      font-size: 9px; letter-spacing: 0.32em; text-transform: uppercase;
      color: var(--gold-light);
    }
    /* ─── HERO VIDEO ─── */
    .hero-video {
      position: absolute; inset: 0; z-index: 0;
      width: 100%; height: 100%;
      object-fit: cover; object-position: center;
      display: block;
      opacity: 0;
      transition: opacity 1.2s ease;
    }
    .hero-video.loaded { opacity: 1; }

    /* Centred content overlay — headline pinned above discover CTA */
    .hero-content {
      position: absolute;
      bottom: 160px; left: 0; right: 0; z-index: 2;
      text-align: center;
      padding: 0 64px;
      animation: heroTextIn 1.4s cubic-bezier(0.22,1,0.36,1) 0.4s both;
    }
    @keyframes heroTextIn {
      from { opacity: 0; transform: translateY(14px); }
      to   { opacity: 1; transform: translateY(0); }
    }
    .hero-eyebrow {
      display: flex; align-items: center; gap: 22px; margin-bottom: 32px;
    }
    .hero-eyebrow-line { width: 40px; height: 1px; background: rgba(200,150,62,0.5); }
    .hero-eyebrow-text {
      font-size: 9.5px; letter-spacing: 0.48em; text-transform: uppercase;
      color: rgba(200,150,62,0.8);
    }
    .hero-headline {
      font-family: 'Cormorant Garamond', serif;
      font-size: clamp(34px, 3.8vw, 58px);
      font-weight: 300; line-height: 1.18;
      color: var(--ivory);
      letter-spacing: 0.08em;
      white-space: normal;
      text-shadow: 0 2px 24px rgba(5,6,10,0.38);
    }
    .hero-headline em { font-style: italic; color: var(--gold-light); font-weight: 300; }
    .hero-tagline {
      font-family: 'Cormorant Garamond', serif;
      font-size: 19px; font-style: italic; font-weight: 300;
      color: rgba(245,239,224,0.55);
      letter-spacing: 0.03em;
    }

    /* Discover — pinned bottom centre, Dior/Buccellati style */
    .hero-discover {
      position: absolute; bottom: 52px; left: 0; right: 0; z-index: 3;
      display: flex; flex-direction: column; align-items: center; gap: 16px;
      animation: heroTextIn 1.4s cubic-bezier(0.22,1,0.36,1) 0.85s both;
    }
    .btn-discover-cta {
      background: transparent;
      border: none;
      border-bottom: 1px solid rgba(245,239,224,0.45);
      color: rgba(245,239,224,0.9);
      padding: 0 0 8px; cursor: pointer;
      font-family: 'Optima', 'Jost', sans-serif;
      font-size: 9.5px; letter-spacing: 0.38em; text-transform: uppercase;
      transition: border-bottom-color 0.22s ease, color 0.22s ease;
    }
    .btn-discover-cta:hover {
      border-bottom-color: var(--gold-light);
      color: var(--gold-light);
    }
    .hero-scroll-line {
      width: 1px; height: 36px;
      background: linear-gradient(to bottom, rgba(245,239,224,0.4), transparent);
      animation: scrollPulse 2.4s ease-in-out infinite;
    }
    @keyframes scrollPulse {
      0%,100% { opacity: 1; transform: translateY(0); }
      50% { opacity: 0.3; transform: translateY(6px); }
    }
    @keyframes pulse { 0%,100%{opacity:1} 50%{opacity:0.25} }

    .hero-stats {
      display: flex; gap: 48px;
    }
    .stat-num {
      font-family: 'Cormorant Garamond', serif;
      font-size: 36px; font-weight: 300; color: var(--charcoal);
      display: block; line-height: 1;
    }
    .stat-label {
      font-size: 9.5px; letter-spacing: 0.22em; text-transform: uppercase;
      color: var(--soft); margin-top: 6px; display: block;
    }

    /* ─── CATEGORY PANELS ─── */
    .categories {
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 3px;
      background: var(--warm-black);
    }
    .category-panel {
      position: relative; overflow: hidden; cursor: pointer;
      min-height: 680px;
    }
    .category-img {
      position: absolute; inset: 0; width: 100%; height: 100%;
      object-fit: cover; object-position: center;
      transition: transform 0.55s cubic-bezier(0.22,1,0.36,1);
      will-change: transform;
    }
    .category-panel:hover .category-img { transform: scale(1.04); }
    .category-overlay {
      position: absolute; inset: 0;
      background: linear-gradient(to top, rgba(5,6,10,0.62) 0%, rgba(5,6,10,0.38) 22%, rgba(5,6,10,0.0) 38%, rgba(5,6,10,0.0) 100%);
      transition: background 0.4s;
    }
    .category-panel:hover .category-overlay {
      background: linear-gradient(to top, rgba(5,6,10,0.68) 0%, rgba(5,6,10,0.42) 24%, rgba(5,6,10,0.0) 40%, rgba(5,6,10,0.0) 100%);
    }
    .category-content {
      position: absolute; bottom: 36px; left: 0; right: 0; z-index: 2;
      padding: 0 48px;
      display: flex; flex-direction: column; align-items: center; text-align: center;
    }
    .category-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 44px; font-weight: 300; color: white;
      line-height: 1.1; margin-bottom: 18px;
    }
    .category-desc {
      font-size: 13.5px; color: rgba(255,255,255,0.88); line-height: 1.75;
      max-width: 520px; margin-bottom: 28px;
    }
    .category-link {
      display: inline-flex; align-items: center; gap: 12px;
      font-size: 10.5px; letter-spacing: 0.25em; text-transform: uppercase;
      color: var(--gold-light); text-decoration: none;
      border-bottom: 1px solid rgba(200,150,62,0.4); padding-bottom: 4px;
      transition: color 0.2s, border-color 0.2s;
    }
    .category-link:hover { color: white; border-color: white; }
    .category-link-arrow { font-size: 14px; }
    /* coming-soon badge on category panel */
    .cat-coming-soon-badge {
      display: inline-block;
      font-size: 9px; letter-spacing: .32em; text-transform: uppercase;
      color: var(--gold); border: 1px solid rgba(200,150,62,.55);
      padding: 4px 10px; margin-bottom: 14px;
    }

    /* ─── PRESS BAR ─── */
    .press-bar {
      background: var(--warm-black);
      padding: 22px 56px;
      display: flex; align-items: center; justify-content: center; gap: 48px;
      overflow: hidden;  /* clips nowrap items on narrow screens */
    }
    .press-label {
      font-size: 11px; letter-spacing: 0.35em; text-transform: uppercase;
      color: rgba(245,239,224,0.82); white-space: nowrap;
    }
    .press-divider { width: 1px; height: 20px; background: rgba(245,239,224,0.15); }
    .press-item {
      font-family: 'Cormorant Garamond', serif;
      font-size: 15px; font-weight: 400; letter-spacing: 0.08em;
      color: rgba(245,239,224,0.78); white-space: nowrap;
      transition: color 0.2s;
    }
    .press-item:hover { color: var(--gold-light); cursor: pointer; }

    /* ─── EYEBROW ─── */
    .eyebrow {
      display: inline-flex; align-items: center; gap: 14px; margin-bottom: 20px;
    }
    .eyebrow-line { width: 36px; height: 1px; background: var(--gold); }
    .eyebrow-text {
      font-size: 12px; letter-spacing: 0.38em; text-transform: uppercase; color: var(--gold);
    }
    .section-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 48px; font-weight: 300; line-height: 1.15; color: var(--charcoal);
    }
    .section-title em { font-style: italic; }
    .story-body .eyebrow { justify-content: center; margin-bottom: 24px; }
    .story-body .eyebrow-line { background: var(--charcoal); }
    .story-body .eyebrow-text { color: var(--charcoal); }
    .story-body .section-title {
      font-size: 22px; letter-spacing: 0.02em;
      text-align: center; margin-top: 0; margin-bottom: 28px;
      line-height: 1.4;
    }

    /* ─── STORY ─── */
    .story {
      background: var(--warm-black);
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 3px;
      align-items: start;
    }
    .story-visual {
      position: sticky; top: 0;
      height: 100vh; overflow: hidden;
    }
    .story-visual-img {
      position: absolute; inset: 0; width: 100%; height: 100%;
      object-fit: cover; object-position: center; opacity: 0.28;
    }
    .story-visual-overlay {
      position: absolute; inset: 0;
      background: linear-gradient(155deg, #1A1208 0%, #2D1E0F 45%, #1A1208 100%);
      opacity: 0.9;
    }
    .story-visual-title {
      position: absolute;
      top: 48px; left: 0; right: 0;
      z-index: 2;
      text-align: center;
      font-family: 'Optima', 'Jost', sans-serif;
      font-size: 17px;
      font-weight: 400;
      font-style: normal;
      letter-spacing: 0.45em;
      text-transform: uppercase;
      color: var(--gold-light);
      line-height: 1;
    }
    .timeline {
      position: relative; z-index: 2; padding: 80px 64px;
      display: flex; flex-direction: column; gap: 0; justify-content: center; height: 100%;
    }
    .timeline-stop {
      display: flex; align-items: flex-start; gap: 28px;
    }
    .timeline-dot-col {
      display: flex; flex-direction: column; align-items: center; padding-top: 6px;
    }
    .timeline-dot {
      width: 13px; height: 13px; border-radius: 50%; flex-shrink: 0;
      background: rgba(200,150,62,0.18);
      border: 1px solid rgba(200,150,62,0.28);
      transition: background 0.25s ease, box-shadow 0.25s ease, transform 0.3s cubic-bezier(0.22,1,0.36,1), border-color 0.25s ease;
    }
    .timeline-dot.visited {
      background: rgba(200,150,62,0.48);
      border-color: rgba(200,150,62,0.55);
    }
    .timeline-dot.active {
      background: var(--gold);
      border-color: var(--gold);
      box-shadow: 0 0 20px rgba(200,150,62,0.65), 0 0 6px rgba(200,150,62,0.35);
      transform: scale(1.25);
    }
    .timeline-connector {
      width: 1px; height: 64px;
      background: rgba(200,150,62,0.1);
      margin: 0 auto; position: relative; overflow: hidden;
    }
    .connector-fill {
      position: absolute; top: 0; left: 0; right: 0; height: 0%;
      background: linear-gradient(to bottom, rgba(200,150,62,0.6), rgba(200,150,62,0.2));
      transition: height 0.55s ease;
    }
    .timeline-year {
      font-size: 10.5px; letter-spacing: 0.30em; text-transform: uppercase;
      color: var(--gold); opacity: 0.88; margin-bottom: 4px;
    }
    .timeline-place {
      font-family: 'Cormorant Garamond', serif;
      color: var(--gold-light); font-size: 26px; font-weight: 300; letter-spacing: 0.05em;
    }
    .timeline-event {
      font-size: 13px; color: rgba(245,239,224,0.68); margin-top: 5px; line-height: 1.6;
      transition: color 0.4s ease, opacity 0.4s ease;
    }
    .timeline-stop {
      cursor: pointer;
      opacity: 0; transform: translateY(16px);
      transition: opacity 0.5s ease, transform 0.5s ease;
    }
    .timeline-stop.tl-revealed { opacity: 1; transform: none; }
    .timeline-stop .timeline-place { transition: color 0.4s ease, opacity 0.4s ease; }
    .timeline-stop .timeline-year  { transition: opacity 0.4s ease; }
    .timeline-stop.tl-active .timeline-place { color: white; }
    .timeline-stop.tl-active .timeline-year  { opacity: 1 !important; }
    .timeline-stop.tl-active .timeline-event { color: rgba(245,239,224,0.82); }
    .timeline-stop.tl-visited .timeline-place { opacity: 0.65; }
    .timeline-stop.tl-visited .timeline-event { opacity: 0.5; }
    .story-body {
      position: relative;
      padding: 100px 72px;
      background: var(--cream);
    }
    /* Hover overlay — absolutely covers story-body, zero layout shift */
    #storyHoverPanel {
      position: absolute;
      inset: 0;
      padding: 100px 72px;
      background: var(--cream);
      opacity: 0;
      pointer-events: none;
      transition: opacity 0.28s ease;
      z-index: 3;
      overflow-y: auto;
    }
    #storyHoverPanel.active {
      opacity: 1;
      pointer-events: auto;
    }
    .story-body p {
      font-size: 15px; color: var(--mid); line-height: 1.95; margin-bottom: 22px;
    }
    .story-body p strong { color: var(--charcoal); font-weight: 500; }
    .story-read-more {
      display: inline-block; margin: 4px 0 0;
      font-size: 11px; letter-spacing: 0.26em; text-transform: uppercase;
      color: var(--gold); text-decoration: none;
      border-bottom: 1px solid rgba(200,150,62,0.35);
      padding-bottom: 1px;
      transition: opacity 0.2s, border-color 0.2s;
    }
    .story-read-more:hover { opacity: 0.7; border-color: var(--gold); }
    .story-read-more.expanded { display: none; }
    .story-pullquote {
      margin-top: 40px; padding: 0 0 0 24px;
      border-left: 2px solid var(--gold);
    }
    .story-pullquote p {
      font-family: 'Cormorant Garamond', serif;
      font-size: 21px; font-style: italic; font-weight: 300;
      color: var(--charcoal); line-height: 1.6; margin: 0;
    }

    /* ─── FOUNDER QUOTE ─── */
    .founder-quote {
      background: var(--warm-black); padding: 130px 80px; text-align: center;
      position: relative; overflow: hidden;
    }
    .founder-quote::before {
      content: '\201C'; position: absolute; top: -30px; left: 50%;
      transform: translateX(-50%);
      font-family: 'Cormorant Garamond', serif; font-size: 280px; font-weight: 300;
      color: rgba(200,150,62,0.05); line-height: 1; pointer-events: none;
    }
    .founder-quote-inner { position: relative; z-index: 1; max-width: 860px; margin: 0 auto; }
    .founder-quote-text {
      font-family: 'Cormorant Garamond', serif;
      font-size: 33px; font-weight: 300; font-style: italic;
      color: rgba(245,239,224,0.88); line-height: 1.55;
    }
    .founder-quote-attr {
      margin-top: 36px; display: flex; align-items: center; justify-content: center; gap: 20px;
    }
    .attr-line { width: 32px; height: 1px; background: var(--gold); opacity: 0.45; }
    .attr-text {
      font-size: 10.5px; letter-spacing: 0.28em; text-transform: uppercase;
      color: var(--gold); opacity: 0.7;
    }

    /* ─── COLLECTIONS ─── */
    .collections { background: var(--ivory); padding: 120px 56px; }
    .collections-title {
      font-size: 52px; font-weight: 300;
      text-align: center;
    }
    .collections-rule {
      height: 1px;
      background: rgba(200,150,62,0.45);
      margin: 22px auto;
      /* width matches the rendered title — set via JS */
      width: 40px;
    }
    .collections-note {
      font-size: 13.5px; color: var(--soft);
      line-height: 1.8; margin-bottom: 72px;
      text-align: center;
    }
    .collections-grid {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 64px;
    }

    /* Card: image on top, ivory info panel below */
    .collection-card {
      background: var(--ivory);
      display: flex; flex-direction: column;
      cursor: pointer;
      transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease;
      position: relative;
    }
    .collection-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 24px 64px rgba(5,6,10,0.11);
      z-index: 2;
    }

    /* Image zone — ivory background so mix-blend-mode works */
    .collection-visual {
      height: 460px;
      background: var(--ivory);
      overflow: hidden;
      position: relative;
      flex-shrink: 0;
    }
    .collection-img {
      width: 100%; height: 100%;
      object-fit: cover; object-position: center top;
      transition: transform 0.75s cubic-bezier(0.22,1,0.36,1);
      mix-blend-mode: multiply; /* dissolves grey studio backgrounds */
      display: block;
    }
    .collection-card:hover .collection-img { transform: scale(1.04); }

    .collection-name-row { margin-bottom: 4px; }

    /* President badge — under product photo */
    .president-badge {
      display: flex; align-items: center; justify-content: center; gap: 8px;
      background: #1A2744;
      padding: 8px 14px;
      width: 100%; box-sizing: border-box;
    }
    .president-badge-icon { font-size: 9px; color: rgba(200,175,120,0.8); }
    .president-badge-text {
      font-size: 8px; letter-spacing: 0.22em; text-transform: uppercase;
      color: rgba(245,239,224,0.85);
    }

    /* Info panel below image */
    .collection-info {
      padding: 28px 28px 32px;
      border-top: 1px solid var(--border);
      display: flex; flex-direction: column;
      flex: 1;
    }
    .collection-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 32px; font-weight: 300; color: var(--charcoal);
      letter-spacing: 0.03em; line-height: 1; margin-bottom: 0;
    }
    .collection-hebrew {
      font-family: 'Cormorant Garamond', serif;
      font-size: 13px; color: var(--soft); font-style: italic;
      margin-bottom: 14px; letter-spacing: 0.04em;
    }
    .collection-desc {
      font-size: 13px; color: var(--mid); line-height: 1.72;
      margin-bottom: 22px;
    }

    /* Price + CTA — stacked column */
    .collection-buy {
      display: flex; flex-direction: column;
      gap: 14px; margin-top: auto; padding-top: 20px;
      border-top: 1px solid var(--border);
    }
    .price-block { display: flex; flex-direction: column; gap: 2px; }
    .collection-price {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px; color: var(--gold); font-weight: 400;
      letter-spacing: 0.02em; white-space: nowrap;
    }
    .collection-price-usd {
      font-size: 11px; color: var(--mid); letter-spacing: 0.04em;
    }
    .price-usd-live {
      display: block;
      font-family: 'Optima', 'Jost', sans-serif;
      font-size: 11px; font-weight: 400;
      color: var(--mid); letter-spacing: 0.03em;
      margin-top: 3px;
    }
    .btn-shop {
      display: block; text-align: center; text-decoration: none;
      background: var(--warm-black); color: var(--ivory);
      padding: 13px 24px; border: none; cursor: pointer;
      font-family: 'Optima', 'Jost', sans-serif;
      font-size: 9.5px; letter-spacing: 0.22em; text-transform: uppercase;
      transition: background 0.25s, transform 0.2s;
    }
    .btn-shop:hover { background: var(--gold); transform: translateY(-1px); }

    /* ─── TRUST STRIP ─── */
    .trust-strip {
      background: var(--cream); border-top: 1px solid var(--border);
      border-bottom: 1px solid var(--border); padding: 26px 56px;
      display: flex; align-items: center; justify-content: center; gap: 56px;
    }
    .trust-item { display: flex; align-items: center; gap: 12px; }
    .trust-icon { font-size: 14px; color: var(--gold); opacity: 0.6; }
    .trust-text {
      font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase; color: var(--mid);
    }
    .trust-div { width: 1px; height: 20px; background: var(--border); }

    /* ─── PRESS / AS SEEN IN ─── */
    .press-section {
      background: var(--warm-black); padding: 80px 56px 100px;
    }
    .press-section-header {
      text-align: center; margin-bottom: 72px;
    }
    .press-section-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 44px; font-weight: 300; color: var(--ivory); margin-top: 16px;
    }
    .press-grid {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; max-width: 1240px; margin: 0 auto;
    }
    .press-card {
      background: rgba(245,239,224,0.04);
      border: 1px solid rgba(200,150,62,0.12);
      padding: 0;
      display: flex; flex-direction: column;
      transition: background 0.3s;
      overflow: hidden;
    }
    .press-card:hover { background: rgba(245,239,224,0.07); }
    .press-card-img { width: 100%; height: 320px; overflow: hidden; flex-shrink: 0; position: relative; }
    .press-card-img img {
      width: 100%; height: 100%; object-fit: cover; object-position: center 15%;
      opacity: 0.9; transition: opacity 0.4s, transform 0.6s cubic-bezier(0.22,1,0.36,1);
      mix-blend-mode: normal;
    }
    .press-card:hover .press-card-img img { opacity: 1; transform: scale(1.04); }
    .press-card-body {
      padding: 32px 36px 40px;
      display: flex; flex-direction: column; gap: 18px; flex: 1;
    }
    .press-card-source {
      font-size: 9.5px; letter-spacing: 0.32em; text-transform: uppercase;
      color: var(--gold); opacity: 0.92;
    }
    .press-card-quote {
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px; font-style: italic; font-weight: 300;
      color: rgba(245,239,224,0.75); line-height: 1.6; flex: 1;
    }
    .press-card-quote::before { content: '\201C'; }
    .press-card-quote::after { content: '\201D'; }
    .press-card-meta {
      font-size: 11px; color: rgba(245,239,224,0.55); letter-spacing: 0.04em;
    }
    .press-card-read-more {
      display: inline-block; margin-top: 18px;
      font-size: 9px; letter-spacing: 0.28em; text-transform: uppercase;
      color: var(--gold); text-decoration: none;
      border-bottom: 1px solid rgba(200,150,62,0.35); padding-bottom: 2px;
      transition: color 0.2s, border-color 0.2s;
    }
    .press-card-read-more:hover { color: var(--gold-light); border-color: rgba(200,150,62,0.7); }
    .press-card.president {
      background: rgba(200,150,62,0.06);
      border-color: rgba(200,150,62,0.22);
    }

    /* ─── LIFESTYLE ─── */
    .lifestyle { background: var(--white); }
    .lifestyle-header { padding: 100px 56px 48px; }
    .lifestyle-grid {
      display: grid;
      grid-template-columns: 1fr 1fr 1fr;
      grid-template-rows: 480px 280px;
      gap: 3px;
    }
    .lifestyle-main { grid-column: 1 / 3; grid-row: 1; overflow: hidden; position: relative; }
    .lifestyle-side { grid-column: 3; grid-row: 1 / 3; overflow: hidden; position: relative; }
    .lifestyle-bl { grid-column: 1; grid-row: 2; overflow: hidden; position: relative; }
    .lifestyle-br { grid-column: 2; grid-row: 2; overflow: hidden; position: relative; }
    .lifestyle-img {
      width: 100%; height: 100%; object-fit: cover; object-position: center;
      transition: transform 0.5s cubic-bezier(0.22,1,0.36,1);
      will-change: transform;
    }
    .lifestyle-main:hover .lifestyle-img,
    .lifestyle-side:hover .lifestyle-img,
    .lifestyle-bl:hover .lifestyle-img { transform: scale(1.04); }
    .lifestyle-br:hover .lifestyle-img { transform: scale(1.04); }

    /* ─── CRAFT (inline in story right panel) ─── */
    .story-craft-section { margin-top: 64px; padding-bottom: 100px; }
    .story-craft-divider {
      height: 1px; background: rgba(200,150,62,0.28);
      margin-bottom: 48px;
    }
    .story-craft-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 32px; font-weight: 300; color: var(--charcoal);
      line-height: 1.2; margin-bottom: 36px;
    }
    .story-craft-title em { color: var(--gold); font-style: italic; }
    .craft-steps-inline {
      display: flex; flex-direction: column; gap: 28px; margin-top: 28px;
    }
    .craft-step-inline {
      display: flex; gap: 20px; align-items: flex-start;
    }
    .craft-num-inline {
      font-family: 'Cormorant Garamond', serif;
      font-size: 48px; font-weight: 300; color: var(--gold);
      line-height: 1; flex-shrink: 0; width: 40px; text-align: right;
    }
    .craft-step-inline strong {
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px; font-weight: 400; color: var(--charcoal);
      display: block; margin-bottom: 4px;
    }
    .craft-step-inline p {
      font-size: 13.5px; color: var(--mid); line-height: 1.75; margin: 0;
    }

    /* ─── RECIPES ─── */
    .recipes { background: var(--ivory); padding: calc(120px - 2cm) 56px; }
    .recipes-header { margin-bottom: 72px; }
    .recipes-grid {
      display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px;
      background: var(--warm-black);
    }
    .recipe-card {
      background: #2D1E0F; padding: 52px 44px 48px;
      display: flex; flex-direction: column; gap: 0;
      transform: translateY(0);
      transition: transform 0.35s cubic-bezier(0.22,1,0.36,1), box-shadow 0.35s ease, background 0.35s ease;
    }
    .recipe-card:hover {
      background: #3D2A14;
      transform: translateY(-6px);
      box-shadow: 0 16px 40px rgba(200,150,62,0.22), 0 4px 12px rgba(5,6,10,0.4);
    }
    .recipe-num {
      font-family: 'Cormorant Garamond', serif;
      font-size: 13px; font-weight: 400; color: var(--gold); opacity: 0.85;
      letter-spacing: 0.18em; margin-bottom: 28px;
    }
    .recipe-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 28px; font-weight: 300; color: var(--ivory);
      line-height: 1.2; margin-bottom: 20px;
    }
    .recipe-name em { font-style: italic; }
    .recipe-desc {
      font-size: 13.5px; color: rgba(245,239,224,0.65); line-height: 1.85;
      flex: 1; margin-bottom: 32px;
    }
    .recipe-meta {
      display: flex; align-items: center; gap: 20px;
      border-top: 1px solid rgba(200,150,62,0.22); padding-top: 24px;
    }
    .recipe-meta-item {
      font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
      color: rgba(245,239,224,0.72);
    }
    .recipe-meta-div { width: 1px; height: 14px; background: rgba(200,150,62,0.45); }
    .recipe-link {
      margin-top: 56px; text-align: center;
    }
    .recipe-link a {
      font-size: 11px; letter-spacing: 0.3em; text-transform: uppercase;
      color: var(--charcoal); text-decoration: none;
      border-bottom: 1px solid rgba(200,150,62,0.45);
      padding-bottom: 2px;
      transition: border-color 0.2s, opacity 0.2s;
    }
    .recipe-link a:hover { border-color: var(--gold); opacity: 0.7; }
    .recipe-card { cursor: pointer; }
    .recipe-card:hover .recipe-open-hint { opacity: 1; }
    .recipe-open-hint {
      font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
      color: var(--gold-light); margin-top: 20px; opacity: 0;
      transition: opacity 0.25s ease;
    }

    /* ─── RECIPE DETAIL OVERLAY ─── */
    .recipe-detail-overlay {
      position: fixed; inset: 0; z-index: 8500;
      background: #1A1208;
      overflow-y: scroll; -webkit-overflow-scrolling: touch;
      overscroll-behavior: contain;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.32s ease, visibility 0s linear 0.32s;
    }
    .recipe-detail-overlay.active {
      opacity: 1;
      visibility: visible;
      transition: opacity 0.32s ease, visibility 0s linear 0s;
    }
    .recipe-detail-overlay .recipe-detail-inner {
      transform: translateY(22px);
      transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .recipe-detail-overlay.active .recipe-detail-inner {
      transform: translateY(0);
    }
    .recipe-detail-inner {
      max-width: 900px; margin: 0 auto;
      padding: 100px 56px 100px;
    }
    .recipe-d-close {
      position: fixed; top: 28px; right: 36px; z-index: 8600;
      background: rgba(255,255,255,0.14);
      backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
      border: none; border-radius: 28px;
      padding: 12px 24px;
      cursor: pointer;
      font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase;
      color: #fff; opacity: 1;
      font-family: 'Optima', 'Jost', sans-serif;
      transition: background 0.2s;
    }
    .recipe-d-close:hover { background: rgba(255,255,255,0.28); opacity: 1; }
    .recipe-d-back {
      display: inline-block; margin-bottom: 48px;
      font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
      color: var(--gold); opacity: 0.65; cursor: pointer;
      background: none; border: none;
      font-family: 'Optima', 'Jost', sans-serif;
      transition: opacity 0.2s;
    }
    .recipe-d-back:hover { opacity: 1; }
    .recipe-d-num {
      font-family: 'Cormorant Garamond', serif;
      font-size: 12px; color: var(--gold); opacity: 0.65;
      letter-spacing: 0.24em; margin-bottom: 14px;
    }
    .recipe-d-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 52px; font-weight: 300; color: var(--ivory);
      line-height: 1.05; margin-bottom: 10px;
    }
    .recipe-d-subtitle {
      font-family: 'Cormorant Garamond', serif;
      font-size: 26px; font-weight: 300; font-style: italic;
      color: var(--gold-light); margin-bottom: 24px;
    }
    .recipe-d-desc {
      font-size: 14px; color: rgba(245,239,224,0.6);
      line-height: 1.9; max-width: 580px; margin-bottom: 36px;
    }
    .recipe-d-meta {
      display: flex; gap: 40px; align-items: flex-start;
      padding: 22px 0;
      border-top: 1px solid rgba(200,150,62,0.2);
      border-bottom: 1px solid rgba(200,150,62,0.2);
      margin-bottom: 56px;
    }
    .recipe-d-meta-item { display: flex; flex-direction: column; gap: 5px; }
    .recipe-d-meta-label {
      font-size: 8.5px; letter-spacing: 0.3em; text-transform: uppercase;
      color: var(--gold); opacity: 0.65;
    }
    .recipe-d-meta-value {
      font-family: 'Cormorant Garamond', serif;
      font-size: 17px; font-weight: 300; color: var(--ivory);
    }
    .recipe-d-body {
      display: grid; grid-template-columns: 240px 1fr; gap: 64px; align-items: start;
    }
    .recipe-d-col-label {
      font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase;
      color: var(--gold); opacity: 0.65; margin-bottom: 24px;
    }
    .ingredient-row {
      display: flex; gap: 16px; align-items: baseline;
      padding: 9px 0; border-bottom: 1px solid rgba(200,150,62,0.08);
    }
    .ingredient-qty {
      font-family: 'Cormorant Garamond', serif;
      font-size: 15px; color: var(--gold-light); min-width: 52px; flex-shrink: 0;
    }
    .ingredient-name {
      font-size: 13px; color: rgba(245,239,224,0.78); line-height: 1.5;
    }
    .ingredient-section-label {
      font-size: 8.5px; letter-spacing: 0.26em; text-transform: uppercase;
      color: var(--gold); opacity: 0.5;
      padding: 18px 0 6px; display: block;
    }
    .recipe-d-step {
      display: flex; gap: 22px; align-items: flex-start;
      margin-bottom: 28px;
    }
    .step-num {
      font-family: 'Cormorant Garamond', serif;
      font-size: 20px; color: var(--gold); opacity: 0.4;
      min-width: 26px; flex-shrink: 0; line-height: 1.4;
    }
    .step-text {
      font-size: 14px; color: rgba(245,239,224,0.78); line-height: 1.9;
    }
    .recipe-d-tip {
      margin-top: 52px; padding: 24px 28px;
      background: rgba(200,150,62,0.07);
      border-left: 2px solid rgba(200,150,62,0.5);
    }
    .recipe-d-tip-label {
      font-size: 8.5px; letter-spacing: 0.3em; text-transform: uppercase;
      color: var(--gold); opacity: 0.7; margin-bottom: 10px;
    }
    .recipe-d-tip-text {
      font-size: 13.5px; color: rgba(245,239,224,0.65);
      line-height: 1.85; font-style: italic;
    }

    /* ─── RECIPE ACTION BUTTONS ─── */
    .recipe-actions {
      display: flex; gap: 10px; margin: 32px 0 52px; flex-wrap: wrap;
    }
    .recipe-action-btn {
      padding: 11px 20px;
      background: none;
      border: 1px solid rgba(200,150,62,0.25);
      color: rgba(245,239,224,0.6);
      font-family: 'Optima', 'Jost', sans-serif;
      font-size: 9.5px; letter-spacing: 0.22em; text-transform: uppercase;
      cursor: pointer; transition: border-color 0.2s, color 0.2s, opacity 0.2s;
    }
    .recipe-action-btn:hover { border-color: var(--gold); color: var(--gold); }
    .recipe-action-btn.confirmed { border-color: var(--gold); color: var(--gold); }

    /* ─── ALL RECIPES OVERLAY ─── */
    .recipes-all-overlay {
      position: fixed; inset: 0; z-index: 8000;
      background: #1A1208;
      overscroll-behavior: contain;
      overflow-y: auto; -webkit-overflow-scrolling: touch;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.32s ease, visibility 0s linear 0.32s;
    }
    .recipes-all-overlay.active {
      opacity: 1;
      visibility: visible;
      transition: opacity 0.32s ease, visibility 0s linear 0s;
    }
    .recipes-all-overlay .recipes-all-inner {
      transform: translateY(22px);
      transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .recipes-all-overlay.active .recipes-all-inner {
      transform: translateY(0);
    }
    .recipes-all-inner {
      max-width: 1100px; margin: 0 auto;
      padding: 100px 56px 100px;
    }
    .recipes-all-close {
      position: fixed; top: 28px; right: 36px;
      background: rgba(255,255,255,0.14);
      backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
      border: none; border-radius: 28px;
      padding: 12px 24px;
      cursor: pointer;
      font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase;
      color: #fff; opacity: 1;
      font-family: 'Optima', 'Jost', sans-serif;
      transition: background 0.2s;
    }
    .recipes-all-close:hover { background: rgba(255,255,255,0.28); opacity: 1; }
    .recipes-all-header { margin-bottom: 64px; }
    .recipes-all-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 44px; font-weight: 300; color: var(--ivory);
      line-height: 1.1; margin-bottom: 12px;
    }
    .recipes-all-sub {
      font-size: 10px; letter-spacing: 0.28em; text-transform: uppercase;
      color: var(--gold); opacity: 0.65;
    }
    .recipes-all-grid {
      display: grid; grid-template-columns: repeat(3, 1fr);
      gap: 3px; background: rgba(200,150,62,0.12);
    }
    .recipe-all-card {
      background: #241710; padding: 40px 36px;
      cursor: pointer; transition: background 0.25s ease;
    }
    .recipe-all-card:hover { background: #2D1E0F; }
    .recipe-all-num {
      font-size: 10.5px; letter-spacing: 0.24em; color: var(--gold); opacity: 0.85;
      margin-bottom: 16px;
    }
    .recipe-all-name {
      font-family: 'Cormorant Garamond', serif;
      font-size: 24px; font-weight: 300; color: var(--ivory);
      line-height: 1.15; margin-bottom: 6px;
    }
    .recipe-all-subtitle {
      font-family: 'Cormorant Garamond', serif;
      font-size: 17px; font-style: italic; color: var(--gold-light);
      opacity: 0.75; margin-bottom: 22px;
    }
    .recipe-all-meta {
      display: flex; gap: 10px; align-items: center;
      font-size: 9.5px; letter-spacing: 0.18em; text-transform: uppercase;
      color: rgba(245,239,224,0.62);
    }
    .recipe-all-meta-div { width: 1px; height: 10px; background: rgba(200,150,62,0.22); }
    .recipe-all-hint {
      font-size: 9.5px; letter-spacing: 0.2em; text-transform: uppercase;
      color: var(--gold); opacity: 0; margin-top: 18px;
      transition: opacity 0.2s;
    }
    .recipe-all-card:hover .recipe-all-hint { opacity: 0.7; }

    /* ─── RECIPES BACKGROUND ─── */
    .recipes { position: relative; overflow: visible; }
    .recipes-grid { overflow: visible; }
    .recipes-bg {
      position: absolute; inset: 0;
      background-image: url('/wp-content/uploads/malqeta/lifestyle/ls-main.jpg');
      background-size: cover; background-position: center 60%;
      opacity: 0.18; mix-blend-mode: multiply;
      pointer-events: none; z-index: 0;
    }
    .recipes > * { position: relative; z-index: 1; }

    /* ─── HAFRASHAT NOTE ─── */
    .hafrashat-note { max-width: 620px; margin: 64px auto 0; text-align: center; }
    .hafrashat-divider { width: 36px; height: 1px; background: rgba(200,150,62,0.28); margin: 0 auto 28px; }
    .hafrashat-hebrew {
      font-family: 'Cormorant Garamond', serif;
      font-size: 34px; color: var(--gold); opacity: 0.65; margin-bottom: 10px;
    }
    .hafrashat-title {
      font-size: 22px; letter-spacing: 0.18em; text-transform: uppercase;
      color: var(--charcoal); margin-bottom: 24px;
    }
    .hafrashat-body { font-size: 13.5px; color: var(--mid); line-height: 1.95; margin-bottom: 14px; }
    .hafrashat-how-title {
      display: inline-block;
      font-size: 11.5px; letter-spacing: 0.26em; text-transform: uppercase;
      color: var(--charcoal); opacity: 0.7; margin: 28px 0 0;
      background: none; border: none; cursor: pointer;
      font-family: 'Optima', 'Jost', sans-serif;
      border-bottom: 1px solid rgba(42,37,32,0.25);
      padding-bottom: 2px;
      transition: opacity 0.2s;
    }
    .hafrashat-how-title:hover { opacity: 1; }

    /* ─── HAFRASHAT OVERLAY ─── */
    .hafrashat-overlay {
      position: fixed; inset: 0; z-index: 8500;
      background: rgb(26,20,16);
      overflow-y: auto; -webkit-overflow-scrolling: touch;
      opacity: 0;
      visibility: hidden;
      transition: opacity 0.32s ease, visibility 0s linear 0.32s;
    }
    .hafrashat-overlay.active {
      opacity: 1;
      visibility: visible;
      transition: opacity 0.32s ease, visibility 0s linear 0s;
    }
    .hafrashat-overlay .hafrashat-overlay-inner {
      transform: translateY(22px);
      transition: transform 0.4s cubic-bezier(0.22, 1, 0.36, 1);
    }
    .hafrashat-overlay.active .hafrashat-overlay-inner {
      transform: translateY(0);
    }
    .hafrashat-overlay-close {
      position: fixed; top: 28px; right: 36px; z-index: 8600;
      background: rgba(255,255,255,0.14);
      backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
      border: none; border-radius: 28px;
      padding: 12px 24px;
      cursor: pointer;
      font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase;
      color: #fff; opacity: 1;
      font-family: 'Optima', 'Jost', sans-serif;
      transition: background 0.2s;
    }
    .hafrashat-overlay-close:hover { background: rgba(255,255,255,0.28); opacity: 1; }
    .hafrashat-overlay-inner {
      max-width: 640px; margin: 0 auto;
      padding: 100px 56px 100px; text-align: center;
    }
    .hafrashat-overlay-hebrew {
      font-family: 'Cormorant Garamond', serif;
      font-size: 42px; color: var(--gold); opacity: 0.7; margin-bottom: 10px;
    }
    .hafrashat-overlay-label {
      font-size: 9.5px; letter-spacing: 0.32em; text-transform: uppercase;
      color: rgba(245,239,224,0.72); margin-bottom: 48px;
    }
    .hafrashat-overlay-body {
      font-size: 14px; color: rgba(245,239,224,0.72);
      line-height: 1.95; margin-bottom: 18px;
    }
    .hafrashat-overlay-how {
      font-size: 9.5px; letter-spacing: 0.28em; text-transform: uppercase;
      color: var(--gold); opacity: 0.9; margin: 36px 0 18px;
    }
    .hafrashat-overlay-blessing {
      margin: 28px 0; padding: 32px 28px;
      border-top: 1px solid rgba(200,150,62,0.2);
      border-bottom: 1px solid rgba(200,150,62,0.2);
    }
    .hafrashat-overlay-blessing-heb {
      font-family: 'Cormorant Garamond', serif;
      font-size: 26px; color: var(--gold-light);
      line-height: 2.1; margin-bottom: 20px;
      direction: rtl; text-align: center;
    }
    .hafrashat-overlay-blessing-tr {
      font-size: 13.5px; color: rgba(245,239,224,0.6);
      line-height: 1.9; font-style: italic; text-align: center;
    }
    .hafrashat-overlay-small {
      font-size: 11.5px; color: rgba(245,239,224,0.62);
      line-height: 1.8; font-style: italic; margin-top: 28px;
    }
    .hafrashat-see-less {
      display: block; margin: 40px auto 0;
      background: none; border: none; cursor: pointer;
      font-size: 10px; letter-spacing: 0.26em; text-transform: uppercase;
      color: var(--ivory); opacity: 0.4;
      font-family: 'Optima', 'Jost', sans-serif;
      border-bottom: 1px solid rgba(245,239,224,0.2);
      padding-bottom: 2px;
      transition: opacity 0.2s;
    }
    .hafrashat-see-less:hover { opacity: 0.9; }

    /* ─── MISSION ─── */
    .mission { background: var(--white); padding: 140px 56px; }
    .mission-inner {
      max-width: 1080px; margin: 0 auto;
      display: grid; grid-template-columns: 1.15fr 1fr; gap: 80px; align-items: center;
    }
    .mission-left {
      background: var(--cream); padding: 56px 52px;
    }
    .mission-title { margin-top: 16px; }
    .mission-title em { font-style: italic; color: var(--gold); }
    .mission-body {
      font-size: 16px; color: #4A3E30; line-height: 1.95; margin-top: 28px;
    }
    .mission-right {
      display: flex; align-items: center; justify-content: center;
      overflow: hidden; position: relative;
      align-self: stretch; /* fills full grid-row height so abs image has something to cover */
      min-height: 420px;
    }
    .mission-visual {
      position: absolute; inset: 0;
      width: 100%; height: 100%;
      object-fit: cover;
      object-position: center 20%; /* show upper body / face of bride */
      opacity: 0.22;
    }
    .mission-badge {
      display: flex; flex-direction: column; align-items: center; gap: 0;
      text-align: center; border: 1px solid var(--border); padding: 56px 60px;
    }
    .mission-percent {
      font-family: 'Cormorant Garamond', serif;
      font-size: 96px; font-weight: 300; color: var(--gold); line-height: 1;
    }
    .mission-badge-label {
      font-size: 10.5px; letter-spacing: 0.24em; text-transform: uppercase;
      color: var(--mid); margin-top: 16px; line-height: 1.8; max-width: 200px;
    }
    .mission-badge-sub {
      font-family: 'Cormorant Garamond', serif;
      font-size: 18px; color: var(--charcoal); font-style: italic; margin-top: 12px;
    }

    /* ─── NEWSLETTER ─── */
    .newsletter {
      background: var(--dark); padding: 96px 56px;
      display: grid; grid-template-columns: 1fr 1fr; gap: 80px; align-items: center;
    }
    .newsletter-eyebrow {
      font-size: 9.5px; letter-spacing: 0.38em; text-transform: uppercase;
      color: var(--gold); opacity: 0.9; margin-bottom: 18px;
    }
    .newsletter-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 40px; font-weight: 300; color: var(--ivory); line-height: 1.2;
    }
    .newsletter-sub {
      font-size: 13px; color: rgba(245,239,224,0.65); margin-top: 12px; line-height: 1.8;
    }
    .newsletter-form { display: flex; gap: 0; }
    .newsletter-input {
      flex: 1; background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.1); border-right: none;
      padding: 15px 20px; color: white;
      font-family: 'Optima', 'Jost', sans-serif; font-size: 13px; outline: none;
      transition: border-color 0.2s;
    }
    .newsletter-input:focus { border-color: rgba(200,150,62,0.4); }
    .newsletter-input::placeholder { color: rgba(255,255,255,0.22); }
    .newsletter-btn {
      background: var(--gold); color: var(--dark);
      border: 1px solid var(--gold); padding: 15px 32px; cursor: pointer;
      font-family: 'Optima', 'Jost', sans-serif;
      font-size: 9.5px; letter-spacing: 0.25em; text-transform: uppercase;
      font-weight: 500; white-space: nowrap; transition: background 0.25s;
    }
    .newsletter-btn:hover { background: var(--gold-light); border-color: var(--gold-light); }
    .newsletter-btn-soon {
      background: transparent !important;
      border-color: rgba(200,150,62,.35) !important;
      color: rgba(200,150,62,.6) !important;
      cursor: default !important;
    }
    .newsletter-assurance {
      font-size: 10.5px; color: rgba(255,255,255,0.2); margin-top: 14px;
    }

    /* ─── REVIEW SECTION ─── */
    .review-section {
      background: var(--dark);
      border-top: 1px solid rgba(200,150,62,0.1);
      padding: 80px 56px;
      display: grid; grid-template-columns: 1fr 1fr;
      gap: 80px; align-items: start;
    }
    .review-title {
      font-family: 'Cormorant Garamond', serif;
      font-size: 36px; font-weight: 300; color: var(--ivory); line-height: 1.2;
      margin-bottom: 8px;
    }
    .review-stars {
      display: flex; gap: 6px; margin-bottom: 20px;
    }
    .review-star {
      background: none; border: none; cursor: pointer; padding: 2px;
      font-size: 26px; color: rgba(200,150,62,0.2);
      transition: color 0.15s, transform 0.12s;
      line-height: 1; font-family: serif;
      touch-action: manipulation;
    }
    .review-star.lit  { color: var(--gold); }
    .review-star:hover { transform: scale(1.18); }
    .review-form { display: flex; flex-direction: column; }
    .review-name-input { margin-bottom: -1px; }
    .review-textarea {
      background: rgba(255,255,255,0.05);
      border: 1px solid rgba(255,255,255,0.1);
      padding: 14px 20px; color: var(--ivory); resize: none;
      font-family: 'Optima', 'Jost', sans-serif; font-size: 13px;
      outline: none; transition: border-color 0.2s; line-height: 1.7;
      min-height: 96px;
    }
    .review-textarea:focus { border-color: rgba(200,150,62,0.4); }
    .review-textarea::placeholder { color: rgba(255,255,255,0.22); }
    .review-submit-btn { margin-top: -1px; width: 100%; }
    .review-thanks {
      font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase;
      color: var(--gold); opacity: 0.75; margin-top: 18px; display: none;
    }

    /* ─── FOOTER ─── */
    footer {
      background: #0D0B09; padding: 72px 56px 36px;
      border-top: 1px solid rgba(200,150,62,0.12);
    }
    .footer-grid {
      display: grid; grid-template-columns: 2.2fr 1fr 1fr 1fr;
      gap: 60px; margin-bottom: 60px; padding-bottom: 60px;
      border-bottom: 1px solid rgba(255,255,255,0.06);
    }
    .footer-logo {
      font-family: 'Cormorant Garamond', serif;
      font-size: 22px; font-weight: 500; letter-spacing: 0.15em;
      text-transform: uppercase; color: var(--ivory); display: block; margin-bottom: 6px;
    }
    .footer-logo-sub {
      font-size: 8.5px; letter-spacing: 0.3em; text-transform: uppercase;
      color: var(--gold); opacity: 0.82; margin-bottom: 18px; display: block;
    }
    .footer-logo-img {
      height: 52px; width: auto; display: block;
      margin-bottom: 18px; opacity: 0.92;
    }
    .footer-desc {
      font-size: 12.5px; color: rgba(255,255,255,0.52); line-height: 1.9;
      max-width: 240px; margin-bottom: 28px;
    }
    .footer-social { display: flex; gap: 18px; }
    .footer-social a {
      font-size: 10px; letter-spacing: 0.18em; text-transform: uppercase;
      color: rgba(255,255,255,0.50); text-decoration: none; transition: color 0.2s;
    }
    .footer-social a:hover { color: var(--gold); }
    .footer-col-title {
      font-size: 9px; letter-spacing: 0.35em; text-transform: uppercase;
      color: var(--gold); margin-bottom: 22px; opacity: 0.9;
    }
    .footer-links { list-style: none; display: flex; flex-direction: column; gap: 12px; }
    .footer-links a {
      font-size: 12.5px; color: rgba(255,255,255,0.55); text-decoration: none;
      transition: color 0.2s;
    }
    .footer-links a:hover { color: rgba(255,255,255,0.90); }
    .footer-link-soon { opacity:.5; cursor:default; pointer-events:none; }
    .footer-soon-tag {
      font-size:7px; letter-spacing:.28em; text-transform:uppercase;
      color:var(--gold); border:1px solid rgba(200,150,62,.3);
      padding:1px 5px; margin-left:6px; vertical-align:middle;
    }
    .footer-bottom {
      display: flex; justify-content: space-between; align-items: center;
      padding: 24px 0 8px; flex-wrap: wrap; gap: 12px;
    }
    .footer-bottom .footer-logo-sub {
      font-size: 10px; opacity: 0.85; margin-bottom: 0; letter-spacing: 0.35em;
    }
    .footer-legal { font-size: 11px; color: rgba(255,255,255,0.40); letter-spacing: 0.04em; }
    .footer-bottom-left {
      display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    }
    .footer-copyright {
      font-size: 11px; color: rgba(255,255,255,0.38); letter-spacing: 0.04em;
    }
    .footer-bottom-sep {
      color: rgba(255,255,255,0.2); font-size: 11px;
    }
    .footer-legal-link {
      font-size: 11px; color: rgba(255,255,255,0.48);
      text-decoration: none; letter-spacing: 0.04em;
      transition: color 0.2s;
    }
    .footer-legal-link:hover { color: var(--gold); }
    .footer-bottom-right { flex-shrink: 0; }
    .footer-location-bottom {
      font-family: 'Cormorant Garamond', serif;
      font-size: 13px; letter-spacing: 0.18em;
      color: var(--gold); opacity: 0.85;
    }
    .footer-location {
      color: var(--gold); opacity: 0.9;
      font-size: 13px; letter-spacing: 0.06em;
    }
    .footer-made {
      font-size: 11px; color: rgba(255,255,255,0.40);
      display: flex; align-items: center; gap: 10px;
    }
    .footer-made .glyph { color: var(--gold); opacity: 0.75; }  /* ══════════════════════════════════════
   MOBILE — index.html
══════════════════════════════════════ */
@media (max-width: 900px) {
  /* NAV */
  nav { padding: max(8px, env(safe-area-inset-top, 0px)) 24px 0; }
  .nav-top { padding: 6px 0 12px; }
  .nav-right { gap: 14px; }
  .nav-links { gap: 22px; }
  .nav-links a { font-size: 9px; letter-spacing: .14em; }

  /* HERO */
  .hero-headline { font-size: clamp(32px, 6vw, 52px); }

  /* CATEGORIES — stack vertically */
  .categories { flex-direction: column; height: auto; }
  .category-panel { height: 60vw; min-height: 280px; }

  /* COLLECTIONS — single column */
  .collections-grid { grid-template-columns: 1fr !important; gap: 40px; max-width: 400px; margin: 0 auto; }

  /* STORY — stack panels */
  .story { grid-template-columns: 1fr !important; }
  .story-visual { position: static !important; height: auto !important; min-height: 320px; }
  .story-body { min-height: 0; }

  /* MISSION — stack */
  .mission-inner { grid-template-columns: 1fr !important; }
  .mission-left { padding: 40px 32px; }
  /* Portrait bride photo — taller box on tablet breakpoint */
  .mission-right { height: 75vw; min-height: 320px; align-self: auto; }

  /* PRESS CARDS — 2 columns at tablet, carousel at mobile */
  .press-grid { grid-template-columns: 1fr 1fr !important; }

  /* NEWSLETTER */
  .newsletter { grid-template-columns: 1fr !important; gap: 28px; padding: 56px 24px !important; }
  .newsletter-form { flex-direction: column; }
  .newsletter-input { width: 100%; }
  .newsletter-btn-soon, .newsletter-btn { width: 100%; }

  /* FOOTER */
  .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 40px; }
  .footer-col-brand { grid-column: 1 / -1; }
}

/* ─── MOBILE ENTRANCE ANIMATION ─── */
@keyframes mobileSlideUp {
  from { opacity: 0; transform: translateY(18px); }
  to   { opacity: 1; transform: translateY(0); }
}



/* ═══════════════════════════════════════════════════════
   COLLECTION PAGES — hero + grid + prod-modal
   ═══════════════════════════════════════════════════════ */

/* ── Merged hero layout ── */
.collection-hero-merged { position: relative; overflow: hidden; }
/* No reveal fade on collection hero — elements appear immediately */
.collection-hero-merged .reveal,
.collection-hero-merged .reveal.visible {
  opacity: 1 !important;
  transform: none !important;
  filter: none !important;
  transition: none !important;
}
.merged-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  min-height: 100vh;
}
.merged-left {
  display: flex; flex-direction: column; justify-content: center;
  padding: 140px 72px 80px;
  background: var(--ivory);
  position: relative; z-index: 2;
  border-right: 1px solid rgba(92,79,61,0.18);
}
.merged-right {
  position: relative; overflow: hidden;
}
.merged-right img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  display: block;
}

/* ── Hero text elements ── */
.hero-collection-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(52px, 7vw, 100px);
  font-weight: 300;
  letter-spacing: -0.01em;
  line-height: 0.9;
  color: var(--charcoal);
  margin-bottom: 14px;
}
.hero-hebrew {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px; font-weight: 300;
  color: var(--gold);
  display: block; margin-bottom: 10px;
  letter-spacing: 0.04em;
}
.hero-divider {
  width: 48px; height: 1px;
  background: var(--gold);
  margin-bottom: 24px;
}
/* Draw-in animation — triggers alongside reveal, independent of transform/opacity */
.hero-divider.visible {
  animation: dividerExpand 0.58s cubic-bezier(0.22,1,0.36,1) 0.44s backwards;
}
@keyframes dividerExpand {
  from { clip-path: inset(0 100% 0 0); }
  to   { clip-path: inset(0 0% 0 0); }
}
.hero-desc {
  font-size: 14px; line-height: 1.88;
  color: var(--mid);
  max-width: 420px;
  margin-bottom: 28px;
}
.detail-pills { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 28px; }
.pill {
  font-size: 8.5px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--charcoal); border: 1px solid rgba(92,79,61,0.22);
  padding: 5px 12px;
}
.hero-price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px; font-weight: 300; color: var(--gold);
  display: block; margin-top: 8px; margin-bottom: 28px;
}
.hero-cta {
  display: inline-flex; align-items: center;
  font-size: 10px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--charcoal); text-decoration: none;
  border: 1px solid rgba(92,79,61,0.3);
  padding: 14px 28px;
  align-self: flex-start;
  transition: border-color 0.25s, color 0.25s;
  font-family: 'Optima', 'Jost', sans-serif;
}
.hero-cta:hover { border-color: var(--gold); color: var(--gold); }

/* ── Product grid section ── */
.product-grid-section { padding: 88px 56px 80px; background: var(--white); }
.grid-header,
.product-grid-header { text-align: center; margin-bottom: 56px; }
.grid-eyebrow {
  display: flex; align-items: center; justify-content: center; gap: 16px;
  margin-bottom: 16px;
}
.grid-eyebrow-line { width: 32px; height: 1px; background: rgba(200,150,62,0.35); }
.grid-eyebrow-text {
  font-size: 8px; letter-spacing: 0.44em; text-transform: uppercase;
  color: rgba(200,150,62,0.7);
}
.grid-title,
.product-grid-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px; font-weight: 300; color: var(--charcoal);
  margin-bottom: 8px;
}
.grid-note { font-size: 12px; color: var(--soft); }
.product-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2px;
  max-width: 1100px; margin: 0 auto;
}

/* ── Craft strip ── */
.craft-strip {
  background: var(--warm-black, #05060A);
  padding: 56px 56px;
}
.craft-strip-inner {
  display: flex; align-items: center; justify-content: center;
  gap: 0; max-width: 900px; margin: 0 auto;
}
.craft-fact {
  display: flex; flex-direction: column; align-items: center;
  gap: 6px; padding: 0 48px; text-align: center;
}
.craft-fact-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px; font-weight: 300; color: var(--ivory);
}
.craft-fact-label {
  font-size: 8.5px; letter-spacing: 0.32em; text-transform: uppercase;
  color: rgba(200,150,62,0.65);
}
.craft-divider {
  width: 1px; height: 40px;
  background: rgba(200,150,62,0.2);
  flex-shrink: 0;
}

/* ── Product image cross-fade on colour swap ── */
.prod-photo-bg img.fading {
  opacity: 0;
  transition: opacity 0.22s ease;
}
.prod-photo-bg img.fading-in {
  opacity: 1;
  transition: opacity 0.26s ease 0.04s;
}

/* ── When product modal is open, drop nav behind overlay (iOS compositing fix) ── */
body.prod-modal-open nav {
  z-index: 1 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* ── Product modal overlay ── */
.prod-modal-overlay {
  /* Always flex but hidden — lets CSS transitions fire on both open AND close */
  display: flex;
  position: fixed; inset: 0; z-index: 200001;
  background: rgba(5,6,10,0.72);
  align-items: center; justify-content: center;
  padding: 20px;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.24s ease, visibility 0s linear 0.24s;
  /* GPU compositing — prevents backdrop-filter repaints from hitting the panel */
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}
.prod-modal-overlay.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transition: opacity 0.24s ease, visibility 0s linear 0s;
}
.prod-modal-panel {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--white);
  max-width: 880px; width: 100%;
  position: relative;
  max-height: 90vh;
  overflow: hidden;
  /* Desktop: slide up + scale — opacity stays 1 so close btn never disappears */
  transform: translateY(22px) scale(0.975);
  opacity: 1;
  transition: transform 0.34s cubic-bezier(0.22,1,0.36,1);
  will-change: transform;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
}
.prod-modal-overlay.active .prod-modal-panel {
  transform: translateY(0) scale(1);
}
.prod-modal-close {
  position: absolute; top: 14px; right: 18px; z-index: 10;
  background: rgba(20,18,16,0.52);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: none; border-radius: 20px;
  padding: 7px 15px;
  cursor: pointer;
  font-size: 9px; letter-spacing: 0.24em; text-transform: uppercase;
  color: #fff;
  font-family: 'Optima', 'Jost', sans-serif;
  transition: background 0.2s;
}
.prod-modal-close:hover { background: var(--gold); }
.prod-modal-img-side {
  position: relative; overflow: hidden; min-height: 380px;
  background: var(--ivory);
}
.prod-modal-img-side img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
}
.prod-modal-nav-btn {
  position: absolute; top: 50%; transform: translateY(-50%);
  background: rgba(255,255,255,0.9); border: 1px solid rgba(200,150,62,0.2);
  width: 36px; height: 36px; border-radius: 50%;
  font-size: 20px; cursor: pointer; z-index: 5;
  display: flex; align-items: center; justify-content: center;
  transition: background 0.18s;
}
.prod-modal-nav-btn:hover { background: white; }
.prod-modal-nav-btn:disabled { opacity: 0; pointer-events: none; }
.prod-modal-nav-prev { left: 10px; }
.prod-modal-nav-next { right: 10px; }
.prod-modal-info {
  padding: 52px 36px 36px;
  overflow-y: auto; display: flex; flex-direction: column;
}
.prod-modal-eyebrow {
  font-size: 8.5px; letter-spacing: 0.44em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 10px;
}
.prod-modal-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 34px; font-weight: 300; color: var(--charcoal);
  margin-bottom: 4px; line-height: 1.1;
}
.prod-modal-hebrew {
  font-family: 'Cormorant Garamond', serif;
  font-size: 17px; font-weight: 300; color: var(--gold);
  display: block; margin-bottom: 18px;
}
.prod-modal-price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px; font-weight: 300; color: var(--gold);
  margin-bottom: 2px;
}
.prod-modal-price-usd {
  font-size: 11px; color: var(--soft); display: block; margin-bottom: 18px;
}
.prod-modal-specs {
  border-top: 1px solid rgba(92,79,61,0.1);
  padding-top: 14px; margin-bottom: 22px;
}
.prod-modal-spec-row {
  display: flex; justify-content: space-between;
  font-size: 11px; color: var(--mid);
  padding: 5px 0; border-bottom: 1px solid rgba(92,79,61,0.07);
  gap: 12px;
}
.prod-modal-spec-label { color: var(--soft); flex-shrink: 0; }
.prod-modal-spec-val { text-align: right; line-height: 1.5; }
.prod-modal-actions {
  display: flex; flex-direction: column; gap: 10px;
  margin-top: 22px; padding-top: 0;
}
.prod-modal-btn-cart {
  width: 100%; padding: 14px 12px;
  background: transparent; border: 1px solid var(--gold); color: var(--charcoal);
  font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase;
  cursor: pointer; transition: background 0.2s, color 0.2s;
  font-family: 'Optima', 'Jost', sans-serif;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.prod-modal-btn-cart:hover { background: var(--gold); color: var(--white); }
.prod-modal-btn-cart:active { background: var(--gold); color: var(--white); }
.prod-modal-btn-buynow {
  width: 100%; padding: 14px 12px;
  background: var(--gold); color: var(--white); border: none;
  font-size: 10px; letter-spacing: 0.3em; text-transform: uppercase;
  cursor: pointer; transition: background 0.2s;
  font-family: 'Optima', 'Jost', sans-serif;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.prod-modal-btn-buynow:hover { background: var(--charcoal); }
.prod-modal-btn-buynow:active { background: var(--charcoal); }
.prod-modal-delivery {
  font-size: 10px; line-height: 1.75; color: var(--soft);
  border-top: 1px solid rgba(92,79,61,0.1);
  padding-top: 14px; margin-top: 14px;
}
.prod-modal-color-section { margin-bottom: 14px; }
.prod-modal-color-row { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 5px; }
.prod-modal-color-dot {
  width: 18px; height: 18px; border-radius: 50%; cursor: pointer;
  border: 2px solid transparent; transition: border-color 0.2s, transform 0.2s;
}
.prod-modal-color-dot.pm-active { border-color: var(--gold); transform: scale(1.15); }
.prod-modal-color-label { font-size: 9px; letter-spacing: 0.2em; color: var(--soft); }

/* ── Cart toast ── */
.cart-toast {
  position: fixed; bottom: 28px; left: 50%; transform: translateX(-50%);
  background: var(--charcoal); color: var(--ivory);
  font-size: 10.5px; letter-spacing: 0.2em; text-transform: uppercase;
  padding: 12px 28px;
  opacity: 0; visibility: hidden; z-index: 300000;
  transition: opacity 0.3s, visibility 0.3s;
  white-space: nowrap; pointer-events: none;
}
.cart-toast.visible { opacity: 1; visibility: visible; }

/* ─── CHAPTER MODAL ─── */
.chapter-modal-overlay {
  position: fixed; inset: 0; z-index: 200000;
  background: rgba(5,6,10,0.88);
  opacity: 0; visibility: hidden;
  transition: opacity 0.35s ease, visibility 0s linear 0.35s;
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
}
.chapter-modal-overlay.active {
  opacity: 1; visibility: visible;
  transition: opacity 0.35s ease, visibility 0s linear 0s;
}
.chapter-modal-panel {
  background: var(--cream);
  max-width: 660px; width: 100%;
  max-height: 85vh; overflow-y: auto;
  padding: 56px 64px 48px;
  position: relative;
  transform: translateY(20px);
  transition: transform 0.4s cubic-bezier(0.22,1,0.36,1);
}
.chapter-modal-overlay.active .chapter-modal-panel { transform: none; }
.chapter-modal-close {
  position: absolute; top: 18px; right: 20px;
  background: rgba(20,18,16,0.52);
  backdrop-filter: blur(6px); -webkit-backdrop-filter: blur(6px);
  border: none; border-radius: 22px;
  padding: 9px 18px;
  cursor: pointer;
  font-size: 9.5px; letter-spacing: 0.24em; text-transform: uppercase;
  color: #fff; font-family: 'Optima','Jost',sans-serif;
  transition: background 0.2s;
}
.chapter-modal-close:hover { background: var(--gold); }
.chapter-modal-year {
  font-size: 9px; letter-spacing: 0.44em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 10px;
}
.chapter-modal-place {
  font-family: 'Cormorant Garamond', serif;
  font-size: 38px; font-weight: 300; line-height: 1.1;
  color: var(--charcoal); margin-bottom: 6px;
}
.chapter-modal-title {
  font-size: 10px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--soft); margin-bottom: 28px;
}
.chapter-modal-divider { width: 36px; height: 1px; background: var(--gold); margin-bottom: 28px; }
.chapter-modal-body {
  font-family: 'Cormorant Garamond', serif;
  font-size: 19px; line-height: 1.78; color: var(--mid);
}
.chapter-modal-nav {
  display: flex; justify-content: space-between; align-items: center;
  margin-top: 40px; padding-top: 20px;
  border-top: 1px solid rgba(92,79,61,0.15);
}
.chapter-nav-btn {
  background: none; border: none; cursor: pointer;
  font-size: 9.5px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--soft); font-family: 'Optima','Jost',sans-serif;
  transition: color 0.2s; padding: 0;
}
.chapter-nav-btn:hover { color: var(--gold); }
.chapter-nav-btn:disabled { opacity: 0; pointer-events: none; }
.chapter-modal-counter { font-size: 9px; letter-spacing: 0.3em; color: var(--soft); }
/* Timeline stops: show pointer + subtle hover highlight */
.timeline-stop { cursor: pointer; }
.timeline-stop:hover .timeline-place { color: var(--gold-light) !important; }

/* ─── RECIPE CAROUSEL DOTS ─── */
.recipe-dots {
  display: none;
  justify-content: center; align-items: center; gap: 7px;
  padding: 18px 0 0;
}
.recipe-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(200,150,62,0.22);
  transition: background 0.3s ease, transform 0.35s cubic-bezier(0.34,1.56,0.64,1);
  cursor: pointer;
}
.recipe-dot.active { background: var(--gold); transform: scale(1.55); }

/* ─── LIFESTYLE CAROUSEL DOTS ─── */
.lifestyle-dots {
  display: none;
  justify-content: center; align-items: center; gap: 7px;
  padding: 16px 0 0;
}
.lifestyle-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: rgba(5,6,10,0.18);
  transition: background 0.3s ease, transform 0.35s cubic-bezier(0.34,1.56,0.64,1);
  cursor: pointer;
}
.lifestyle-dot.active { background: var(--charcoal); transform: scale(1.55); }

/* ─── MOBILE SECOND-WAVE POLISH ─── */
@keyframes heroFloat {
  0%,100% { transform: translateY(0); }
  50%      { transform: translateY(-8px); }
}
@keyframes badgePop {
  from { transform: scale(0.82) rotate(-4deg); opacity: 0.4; }
  to   { transform: scale(1) rotate(0deg);    opacity: 1; }
}
@keyframes goldShimmer {
  0%   { background-position: -200% center; }
  100% { background-position:  200% center; }
}



/* ─── MOBILE POLISH WAVE 3 ─── */


/* ─── MOBILE LUXURY WAVE 4 — CINEMATIC FINISHINGS ─── */
@keyframes btnRipple {
  from { transform: translate(-50%,-50%) scale(0); opacity: 0.45; }
  to   { transform: translate(-50%,-50%) scale(3.2); opacity: 0; }
}


@media (max-width: 768px) {
/* Global: snappy tap response, no blue flash */
  button, a, .category-panel, .collection-card, .recipe-card, .timeline-stop {
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
  }

  /* NAV */
  nav { padding: max(14px, env(safe-area-inset-top, 0px)) 20px 0; }
  .nav-eyebrow { display: none !important; }
  /* Logo absolutely centred; lang left, cart right — equal side widths prevent overlap */
  .nav-top {
    display: flex; align-items: center; justify-content: space-between;
    position: relative;
    padding-top: 0; padding-bottom: 10px;
  }
  .nav-left  { position: static; transform: none; flex-shrink: 0; }
  .nav-right { position: static; transform: none; gap: 0; flex-shrink: 0; }
  .nav-logo  { position: absolute; left: 50%; transform: translateX(-50%); pointer-events: auto; }
  .nav-logo-img { height: 34px; width: auto; max-width: 120px; }
  /* ── Hamburger: bordered box matching cart icon ── */
  .nav-hamburger {
    display: flex !important;
    flex-direction: column; justify-content: center; gap: 4px;
    width: 32px !important; height: 32px !important;
    border: 1px solid rgba(245,239,224,0.50) !important;
    border-radius: 3px !important;
    background: transparent !important;
    padding: 7px !important;
    cursor: pointer; flex-shrink: 0;
    margin-left: 8px !important;
  }
  nav.scrolled .nav-hamburger { border-color: rgba(92,79,61,0.35) !important; }
  /* Cart: icon-only square button */
  .cart-btn {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 32px !important;
    height: 32px !important;
    border: 1px solid rgba(245,239,224,0.50) !important;
    border-radius: 3px !important;
    padding: 0 !important;
    font-size: 0 !important;
    letter-spacing: 0 !important;
    gap: 0 !important;
    position: relative !important;
    background: transparent !important;
  }
  nav.scrolled .cart-btn {
    border-color: rgba(92,79,61,0.35) !important;
  }
  .cart-btn::before {
    content: '';
    display: block;
    width: 16px; height: 16px;
    flex-shrink: 0;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23f5efe0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 01-8 0'/%3E%3C/svg%3E") center/contain no-repeat;
  }
  nav.scrolled .cart-btn::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%235c4f3d' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 2L3 6v14a2 2 0 002 2h14a2 2 0 002-2V6l-3-4z'/%3E%3Cline x1='3' y1='6' x2='21' y2='6'/%3E%3Cpath d='M16 10a4 4 0 01-8 0'/%3E%3C/svg%3E");
  }
  /* Cart badge: absolute over icon */
  .cart-badge {
    position: absolute !important;
    top: -5px !important; right: -5px !important;
    font-size: 9px !important;
    min-width: 15px !important; height: 15px !important;
  }
  /* Lang toggle: matching bordered box for visual balance */
  .lang-toggle {
    font-size: 8.5px !important;
    letter-spacing: 0.12em !important;
    border: 1px solid rgba(245,239,224,0.50) !important;
    padding: 0 9px !important;
    border-radius: 3px !important;
    height: 32px !important;
    display: inline-flex !important;
    align-items: center !important;
    background: transparent !important;
  }
  nav.scrolled .lang-toggle {
    border-color: rgba(92,79,61,0.35) !important;
  }

  /* Hamburger spans — 3 clean lines inside the bordered box */
  .nav-hamburger span {
    display: block; height: 1.5px; width: 100%; border-radius: 1px;
    background: rgba(245,239,224,0.85);
    transition: transform 0.32s cubic-bezier(0.22,1,0.36,1),
                opacity 0.22s ease, width 0.22s ease;
    transform-origin: center;
  }
  nav.scrolled .nav-hamburger span { background: var(--charcoal); }
  .nav-hamburger span:nth-child(2) { width: 75%; }
  /* X state when open */
  nav.nav-open .nav-hamburger span:nth-child(1) { transform: translateY(5.5px) rotate(45deg); }
  nav.nav-open .nav-hamburger span:nth-child(2) { opacity: 0; width: 0; }
  nav.nav-open .nav-hamburger span:nth-child(3) { transform: translateY(-5.5px) rotate(-45deg); }

  /* ── Full-screen overlay menu (visibility approach — animates on iOS/Chrome) ── */
  .nav-links {
    display: flex;
    position: fixed; inset: 0; z-index: 190;
    background: rgba(245,239,224,0.97);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    flex-direction: column; align-items: center; justify-content: center;
    gap: 0; padding: 0;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateY(-10px);
    transition: opacity 0.24s ease,
                transform 0.28s cubic-bezier(0.22,1,0.36,1),
                visibility 0s linear 0.28s;
    will-change: transform, opacity;
    -webkit-transform: translateY(-10px);
  }
  nav.nav-open .nav-links {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateY(0);
    -webkit-transform: translateY(0);
    transition: opacity 0.24s ease,
                transform 0.28s cubic-bezier(0.22,1,0.36,1),
                visibility 0s linear 0s;
  }
  .nav-links li { width: 100%; text-align: center; }
  .nav-links a {
    display: block; padding: 18px 0;
    font-size: 12px !important; letter-spacing: 0.28em !important;
    color: var(--charcoal) !important;
    border-bottom: 1px solid rgba(92,79,61,0.09);
  }
  .nav-links li:last-child a { border-bottom: none; }
  .nav-links a::after { display: none !important; }


  /* ── Backdrop (visibility approach) ── */
  .nav-backdrop {
    display: block; position: fixed; inset: 0; z-index: 189;
    background: rgba(5,6,10,0.3);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transition: opacity 0.28s ease, visibility 0s linear 0.28s;
  }
  nav.nav-open ~ .nav-backdrop,
  body.nav-body-lock .nav-backdrop {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transition: opacity 0.28s ease, visibility 0s linear 0s;
  }
  body.nav-body-lock { overflow: hidden; position: fixed; width: 100%; }

  /* HERO */
  .hero { height: 100vh; height: 100svh; } /* svh fallback: iOS < 15.4 uses 100vh */
  .hero-content { bottom: max(140px, 22vh); bottom: max(140px, 22svh); padding: 0 28px; text-align: center; }
  .hero-discover { bottom: max(28px, env(safe-area-inset-bottom, 28px)); }
  .hero-eyebrow {
    margin-bottom: 16px;
    animation: mobileSlideUp 0.9s cubic-bezier(0.22,1,0.36,1) 0.15s both;
  }
  .hero-headline {
    font-size: clamp(28px, 9vw, 46px);
    line-height: 1.2;
    letter-spacing: 0.05em;
  }
  .hero-headline em { white-space: nowrap; }
  .hero-tagline {
    font-size: 16px;
    animation: mobileSlideUp 0.85s cubic-bezier(0.22,1,0.36,1) 0.5s both;
  }
  .hero-badge { bottom: 100px; left: 20px; padding: 7px 14px; }
  .hero-badge-text { font-size: 9px; }
  /* btn-discover-cta: tap feedback */
  .btn-discover-cta:active { color: var(--gold-light); border-bottom-color: var(--gold-light); opacity: 0.8; }

  /* PRESS BAR */
  .press-bar { padding: 14px 20px; gap: 16px; flex-wrap: wrap; justify-content: center; }

  /* CATEGORIES — mobile: photo on top, clean ivory caption below */
  .categories { grid-template-columns: 1fr; gap: 3px; }
  .category-panel { min-height: unset; height: auto; display: flex; flex-direction: column; }
  .category-img { position: relative; height: 72vw; flex-shrink: 0; }
  .category-overlay { display: none; }
  .category-content {
    position: relative; bottom: auto;
    padding: 20px 24px 26px;
    background: var(--ivory);
    align-items: flex-start; text-align: left;
  }
  .category-name { font-size: 28px; margin-bottom: 6px; color: var(--charcoal); }
  .category-desc { font-size: 13px; line-height: 1.7; margin-bottom: 18px; color: var(--mid); }
  .category-link { color: var(--gold); border-bottom-color: rgba(200,150,62,0.45); }
  .cat-coming-soon-badge { margin-bottom: 10px; }
  .category-panel:active { opacity: 0.94; transition: opacity 0.1s ease; }

  /* COLLECTIONS */
  .collections { padding: 72px 24px; }
  .collections-grid { grid-template-columns: 1fr; gap: 28px; padding: 0; }
  .collection-visual { height: 62vw; }
  .collection-name { font-size: 28px; }
  .collection-card:active { transform: scale(0.994); transition: transform 0.12s ease; }
  .btn-shop { padding: 14px 24px; font-size: 9px; }
  .btn-shop:active { background: var(--gold); transform: scale(0.98); transition: transform 0.1s; }

  /* STORY — single column, timeline stays dark, body stays cream */
  .story { grid-template-columns: 1fr; gap: 0; }
  .story-visual { position: relative !important; height: auto !important; background: var(--warm-black); min-height: 0 !important; }
  .story-visual-overlay { position: absolute !important; inset: 0 !important; }
  .story-visual-img { position: absolute; }
  .story-visual-title { position: absolute; }
  .timeline { padding: 80px 28px 64px; height: auto; }
  .timeline-connector { height: 40px; }
  .timeline-place { font-size: 22px; }
  .timeline-event { font-size: 12px; }
  .story-body { padding: 52px 28px 40px; }
  .story-craft-section { padding-bottom: 32px; }
  #storyHoverPanel { padding: 52px 28px 40px; }
  .story-pullquote { padding: 0 0 0 18px; }
  .story-pullquote p { font-size: 18px; }
  .story-craft-title { font-size: 26px; }
  .craft-num-inline { font-size: 38px; }

  /* FOUNDER QUOTE */
  .founder-quote { padding: 64px 28px 72px; }
  .founder-quote-text { font-size: 21px; line-height: 1.55; }
  .founder-quote::before { font-size: 180px; }
  .founder-quote-attr { margin-top: 24px; gap: 12px; }

  /* TRUST STRIP */
  .trust-strip { flex-wrap: wrap; gap: 16px; padding: 24px 28px; justify-content: center; }
  .trust-div { display: none; }

  /* PRESS SECTION — swipe carousel on mobile */
  .press-section { padding: 56px 0 72px; }
  .press-section-header { padding: 0 24px; margin-bottom: 32px; }
  .press-grid {
    display: flex !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 12px;
    padding: 0 24px 4px;
    grid-template-columns: unset !important;
  }
  .press-grid::-webkit-scrollbar { display: none; }
  .press-card {
    flex: 0 0 82vw !important;
    scroll-snap-align: start;
    min-width: 0;
    display: flex;
    flex-direction: column;
  }
  .press-card-img { height: 52vw; }
  .press-card-body { padding: 20px 20px 28px; }
  .press-card-quote { font-size: 17px; }
  /* Press swipe dots — same pattern as lifestyle/recipe */
  .press-dots {
    display: flex; justify-content: center; gap: 6px;
    padding: 14px 0 0; margin: 0 24px;
  }
  .press-dot {
    width: 5px; height: 5px; border-radius: 50%;
    background: rgba(92,79,61,0.25);
    transition: background 0.25s ease, transform 0.25s ease;
  }
  .press-dot.active { background: var(--gold); transform: scale(1.25); }

  /* RECIPES — swipe carousel */
  .recipes { padding: 64px 0; }
  .recipes-header { padding: 0 24px; margin-bottom: 48px; }
  .recipes-grid {
    display: flex !important;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 3px;
    padding: 0 24px;
  }
  .recipes-grid::-webkit-scrollbar { display: none; }
  .recipe-card {
    flex: 0 0 82vw;
    scroll-snap-align: start;
    min-width: 0;
    padding: 36px 28px 36px;
  }
  .recipe-card:active { background: #3D2A14; transition: background 0.12s; }
  .hafrashat-note { padding: 0 24px; }

  /* RECIPE DETAIL OVERLAY */
  .recipe-detail-inner { padding: 80px 24px 64px; }
  .recipe-d-name { font-size: 36px; }
  .recipe-d-subtitle { font-size: 20px; }
  .recipe-d-body { grid-template-columns: 1fr; gap: 40px; }
  .recipe-d-meta { gap: 18px; flex-wrap: wrap; }
  .recipe-d-close { right: 18px !important; top: 18px !important; padding: 10px 20px !important; font-size: 9.5px !important; border-radius: 22px !important; }
  .recipes-all-close { right: 18px !important; top: 18px !important; padding: 10px 20px !important; font-size: 9.5px !important; border-radius: 22px !important; }

  /* HAFRASHAT OVERLAY */
  .hafrashat-overlay-close { right: 18px !important; top: 18px !important; padding: 10px 20px !important; font-size: 9.5px !important; border-radius: 22px !important; }

  /* FOOTER — brand + shop full-width, then About | Contact side by side */
  .footer-grid { grid-template-columns: 1fr 1fr !important; gap: 32px 24px; }
  .footer-col-brand { grid-column: 1 / -1; }
  .footer-col-shop { grid-column: 1 / -1; }

  /* NEWSLETTER */
  .newsletter { grid-template-columns: 1fr !important; gap: 28px; padding: 56px 24px !important; }
  .newsletter-form { flex-direction: column; }
  .newsletter-input { width: 100%; }
  .newsletter-btn-soon, .newsletter-btn { width: 100%; }
  .review-section { grid-template-columns: 1fr !important; gap: 36px; padding: 64px 24px; }
  .review-submit-btn { width: 100%; }

  /* CHAPTER MODAL — sheet from bottom on mobile */
  .chapter-modal-overlay { padding: 16px; align-items: flex-end; }
  .chapter-modal-panel { padding: 44px 24px 40px; max-height: 90vh; }
  .chapter-modal-place { font-size: 28px; }
  .chapter-modal-body { font-size: 17px; }
  .chapter-nav-btn { min-height: 44px; display: flex; align-items: center; }

  /* COLLECTIONS — responsive title */
  .collections { padding: 64px 24px; }
  .collections-title { font-size: clamp(36px, 11vw, 52px); }
  .collections-note { margin-bottom: 48px; font-size: 13px; }

  /* TIMELINE — tap feedback + mobile hint arrow */
  .timeline-stop:active { opacity: 0.75; transition: opacity 0.1s; }
  .timeline-stop::after {
    content: '→';
    position: absolute; right: 0;
    font-size: 11px; color: var(--gold); opacity: 0.4;
    top: 6px;
    transition: opacity 0.2s, transform 0.2s;
  }
  .timeline-stop { position: relative; }
  .timeline-stop:active::after { opacity: 0.9; transform: translateX(4px); }

  /* TIMELINE DOTS — gentle pulse on mobile to show tappability */
  @keyframes dotPulse {
    0%, 100% { box-shadow: 0 0 0 0 rgba(200,150,62,0); }
    50% { box-shadow: 0 0 0 5px rgba(200,150,62,0.18); }
  }
  .timeline-dot.visited {
    animation: dotPulse 3s ease-in-out infinite;
  }
/* Floating play icon in hero */

  /* Reveal — add scale for more dimensionality */
  .reveal { transform: translateY(26px) scale(0.975); }
  .reveal.visible { transform: none; }

  /* Chapter modal — spring up from off-screen bottom */
  .chapter-modal-panel {
    transform: translateY(100%);
    transition: transform 0.48s cubic-bezier(0.32,0.72,0,1);
    border-radius: 20px 20px 0 0;
  }
  .chapter-modal-overlay.active .chapter-modal-panel {
    transform: translateY(0);
  }

  /* Collection cards — stagger reveals */
  .collections-grid .collection-card:nth-child(2) { transition-delay: 0.14s; }
  .collections-grid .collection-card:nth-child(3) { transition-delay: 0.28s; }

  /* Category panel content — slide up on enter */
  .category-content {
    transform: translateY(18px);
    opacity: 0;
    transition: transform 0.85s cubic-bezier(0.22,1,0.36,1) 0.18s,
                opacity   0.65s ease                         0.18s;
  }
  .category-panel.cat-in-view .category-content {
    transform: none;
    opacity: 1;
  }

  /* Recipe dots — show on mobile */
  .recipe-dots { display: flex; }

  /* Mission badge pop animation */
  .mission-badge.badge-popped { animation: badgePop 0.65s cubic-bezier(0.34,1.56,0.64,1) forwards; }

  /* Collection price — subtle shimmer highlight on reveal */
  .collection-price {
    background: linear-gradient(90deg, var(--gold) 0%, var(--gold-pale,#EDD08A) 48%, var(--gold) 100%);
    background-size: 200% auto;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    animation: goldShimmer 3.5s ease infinite;
  }

  /* Smoother nav link underline on mobile */
  .nav-links a::after { transition: transform 0.2s ease; }

  /* Press bar items — larger touch area */
  .press-item { padding: 8px 4px; }

  /* Hero discover button — bigger on mobile */
  .btn-discover-cta { font-size: 8.5px; letter-spacing: 0.3em; padding-bottom: 10px; }
  .hero-scroll-line { height: 28px; }

  /* Hero video — portrait crop fills mobile screen */
  .hero-video { object-position: center center; }


  /* Lifestyle section — header tighter on mobile */
  .lifestyle-header { padding: 56px 28px 28px; }

  /* Lifestyle grid — horizontal swipe carousel on mobile */
  .lifestyle-grid {
    display: flex !important;
    flex-direction: row;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: 3px;
    height: 82vw; /* taller = better portrait/square photo proportions */
  }
  .lifestyle-grid::-webkit-scrollbar { display: none; }
  .lifestyle-main, .lifestyle-side, .lifestyle-bl, .lifestyle-br {
    flex: 0 0 88vw;
    scroll-snap-align: start;
    grid-column: unset !important; grid-row: unset !important;
    min-width: 0;
    height: 100%;
  }
  .lifestyle-dots { display: flex; }
/* Blur-in reveal — luxury "focus in" on each section entrance */
  .reveal {
    filter: blur(3px);
    transition: opacity 0.85s cubic-bezier(0.22,1,0.36,1),
                transform 0.85s cubic-bezier(0.22,1,0.36,1),
                filter 0.72s ease;
  }
  .reveal.visible { filter: blur(0); }

  /* Collection images — no zoom on mobile, just fade in */
  .collection-card .collection-img { transform: none; }
  .collection-card.visible .collection-img { transform: none; }

  /* Presidential badge — mobile: same block style, slightly tighter */
  .president-badge {
    padding: 7px 10px !important; gap: 6px !important;
  }
  .president-badge-text {
    font-size: 7px !important; letter-spacing: 0.16em !important;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
  }

  /* Section titles — properly scaled for mobile viewport */
  .section-title { font-size: clamp(26px, 8.5vw, 42px) !important; }
  .lifestyle-header .section-title { font-size: clamp(28px, 9vw, 44px) !important; }

  /* Press cards — 2nd card slightly staggered in single-column flow */
  .press-grid .press-card:nth-child(2) { transition-delay: 0.18s; }

  /* Newsletter input — gold glow on focus */
  .newsletter-input:focus {
    box-shadow: 0 0 0 1px rgba(200,150,62,0.4) !important;
    border-color: rgba(200,150,62,0.55) !important;
    transition: border-color 0.25s ease, box-shadow 0.25s ease;
  }

  /* CTA buttons — snappy press depth */
  .btn-shop:active { transform: scale(0.95) translateY(1px) !important; transition: transform 0.08s ease !important; }

  /* Craft steps — staggered entrance */
  .craft-step:nth-child(2) { transition-delay: 0.14s; }
  .craft-step:nth-child(3) { transition-delay: 0.28s; }
/* Hero — headline entrance handled by heroTextIn on all screens */

  /* Category panels — Ken Burns slow pull-back when entering viewport */
  .category-img {
    transform: scale(1.09) !important;
    transition: transform 2.2s cubic-bezier(0.22,1,0.36,1) !important;
  }
  .category-panel.cat-in-view .category-img {
    transform: scale(1.0) !important;
  }
  /* Video panels: skip Ken Burns — video already has motion */
  video.category-img,
  .category-panel:hover video.category-img,
  .category-panel.cat-in-view video.category-img {
    transform: none !important;
    transition: none !important;
  }

  /* CTA buttons — gold ripple burst on tap */
  .btn-shop { position: relative; overflow: hidden; isolation: isolate; }
  .btn-shop::after {
    content: '';
    position: absolute;
    top: 50%; left: 50%;
    width: 120%; padding-top: 120%;
    transform: translate(-50%,-50%) scale(0);
    background: radial-gradient(circle, rgba(255,255,255,0.22) 0%, transparent 65%);
    border-radius: 50%;
    pointer-events: none;
    opacity: 0;
  }
  .btn-shop:active::after {
    animation: btnRipple 0.52s ease-out forwards;
  }

  /* Press bar items — stagger fade-slide on page load */
  .press-item { animation: mobileSlideUp 0.55s cubic-bezier(0.22,1,0.36,1) both; }
  .press-item:nth-child(1) { animation-delay: 0.15s; }
  .press-item:nth-child(2) { animation-delay: 0.28s; }
  .press-item:nth-child(3) { animation-delay: 0.41s; }
  .press-item:nth-child(4) { animation-delay: 0.54s; }
  .press-item:nth-child(5) { animation-delay: 0.67s; }

  /* ── Collection pages — mobile overrides ── */
  .product-grid-section { padding: 48px 16px 56px; }
  .product-grid { grid-template-columns: 1fr; gap: 2px; }
  .grid-title, .product-grid-title { font-size: 28px; }

  /* Prod modal — split layout: ~38% photo, ~56% info, clear division */
  .prod-modal-overlay { padding: 0 !important; align-items: flex-end !important; }
  .prod-modal-panel {
    grid-template-columns: 1fr !important;
    grid-template-rows: 38vh 1fr !important;
    height: 94vh !important;
    max-height: 94vh !important;
    overflow: hidden !important;
    max-width: 100% !important;
    border-radius: 16px 16px 0 0 !important;
    /* Mobile: slide-up-from-bottom — opacity always 1 so close btn is always visible */
    transform: translateY(100%) !important;
    -webkit-transform: translateY(100%) !important;
    transition: transform 0.38s cubic-bezier(0.22,1,0.36,1) !important;
    will-change: transform !important;
    backface-visibility: hidden !important;
    -webkit-backface-visibility: hidden !important;
  }
  .prod-modal-overlay.active .prod-modal-panel {
    transform: translateY(0) !important;
    -webkit-transform: translateY(0) !important;
  }
  .prod-modal-img-side {
    height: 38vh !important;
    min-height: 0 !important;
    border-radius: 16px 16px 0 0 !important;
    overflow: hidden !important;
  }
  /* Zoom into the embroidery detail on mobile — !important beats JS inline style */
  .prod-modal-img-side img {
    transform: scale(1.6) !important;
    transform-origin: center 38% !important;
    transition: transform 0.5s cubic-bezier(0.22,1,0.36,1) !important;
  }
  .prod-modal-info {
    padding: 18px 20px 28px !important;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
  }
  .prod-modal-close { top: 12px !important; right: 12px !important; padding: 9px 16px !important; font-size: 9px !important; }
  .prod-modal-name { font-size: 24px !important; }
  .prod-modal-price { font-size: 22px !important; margin-bottom: 2px !important; }
  .prod-modal-hebrew { margin-bottom: 12px !important; }
  .prod-modal-price-usd { margin-bottom: 12px !important; }
  .prod-modal-spec-row { padding: 4px 0 !important; }
  .prod-modal-specs { padding-top: 10px !important; margin-bottom: 16px !important; }
  .prod-modal-actions { margin-top: 16px !important; gap: 8px !important; }
  .prod-modal-btn-cart, .prod-modal-btn-buynow { padding: 13px 12px !important; }

  /* Craft strip — wrap on mobile */
  .craft-strip { padding: 40px 24px; }
  .craft-strip-inner { flex-wrap: wrap; gap: 28px; }
  .craft-fact { padding: 0 20px; }
  .craft-divider { width: 100%; height: 1px; }
}

/* ─── CART PAGE: Policy links ─── */
.cart-policy-links {
  text-align: center;
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid rgba(92,79,61,0.1);
  font-size: 10px;
  letter-spacing: 0.12em;
}
.cart-policy-links a {
  color: var(--soft);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.18em;
  transition: color 0.2s;
}
.cart-policy-links a:hover { color: var(--gold); }
.cart-policy-divider {
  color: var(--border);
  margin: 0 10px;
}

/* ── OTHER COLLECTIONS SECTION ──────────────────────────────── */
.other-collections {
  background: var(--ivory);
  padding: 80px 64px 96px;
}
.other-collections-header {
  text-align: center;
  margin-bottom: 56px;
}
.other-collections-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px; font-weight: 300;
  color: var(--charcoal);
  letter-spacing: 0.02em; margin-top: 20px;
}
.other-collections-grid {
  display: grid; grid-template-columns: 1fr 1fr; gap: 3px;
  max-width: 1200px; margin: 0 auto;
}
.other-card {
  display: block;
  position: relative; overflow: hidden;
  height: 520px;
  text-decoration: none;
  cursor: pointer;
}
.other-card > img {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  object-fit: cover; object-position: center;
  transition: transform 0.8s cubic-bezier(0.22,1,0.36,1);
  display: block;
}
.other-card:hover > img { transform: scale(1.04); }
.other-card-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to top, rgba(5,6,10,0.78) 0%, rgba(5,6,10,0.46) 36%, rgba(5,6,10,0.12) 62%, transparent 100%);
  transition: background 0.4s;
}
.other-card:hover .other-card-overlay {
  background: linear-gradient(to top, rgba(5,6,10,0.84) 0%, rgba(5,6,10,0.54) 40%, rgba(5,6,10,0.18) 68%, transparent 100%);
}
.other-card-content {
  position: absolute; bottom: 0; left: 0; right: 0; z-index: 2;
  padding: 40px 40px 44px;
  display: flex; flex-direction: column;
}
.other-card-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 36px; font-weight: 300; color: #fff;
  letter-spacing: 0.02em; line-height: 1; margin-bottom: 4px;
}
.other-card-hebrew {
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px; font-style: italic;
  color: rgba(245,239,224,0.65); margin-bottom: 14px;
}
.other-card-desc {
  font-size: 13px; color: rgba(245,239,224,0.82); line-height: 1.7;
  margin-bottom: 18px; max-width: 320px;
}
.other-card-price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px; color: var(--gold); margin-bottom: 18px;
}
.other-card-link {
  display: inline-block;
  font-size: 9.5px; letter-spacing: 0.28em; text-transform: uppercase;
  color: rgba(245,239,224,0.75);
  border-bottom: 1px solid rgba(245,239,224,0.35);
  padding-bottom: 2px;
  transition: color 0.2s, border-color 0.2s;
}
.other-card:hover .other-card-link {
  color: var(--gold); border-color: rgba(200,150,62,0.6);
}
@media (max-width: 768px) {
  .other-collections { padding: 56px 24px 72px; }
  .other-collections-grid { grid-template-columns: 1fr; gap: 16px; }
  .other-card { height: 72vw; }
  .other-card-content { padding: 28px 24px 32px; }
  .other-card-name { font-size: 28px; }
}
@media (max-width: 480px) {
  .other-card { height: 88vw; }
}

/* ─── ARTICLE READER OVERLAY ─── */
.article-overlay {
  display: flex;
  flex-direction: column;
  position: fixed;
  inset: 0;
  z-index: 250000;
  background: var(--ivory);
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(100%);
  transition: opacity 0.32s ease,
              transform 0.40s cubic-bezier(0.22,1,0.36,1),
              visibility 0s linear 0.40s;
}
.article-overlay.active {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
  transition: opacity 0.32s ease,
              transform 0.40s cubic-bezier(0.22,1,0.36,1),
              visibility 0s linear 0s;
}
.article-overlay-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: max(16px, calc(env(safe-area-inset-top, 0px) + 12px)) 24px 16px;
  border-bottom: 1px solid var(--border);
  background: var(--ivory);
  flex-shrink: 0;
  min-height: 52px;
}
.article-overlay-close {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 10px;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--charcoal);
  background: none;
  border: none;
  cursor: pointer;
  padding: 0;
  min-width: 80px;
  transition: color 0.2s;
}
.article-overlay-close:hover { color: var(--gold); }
.article-overlay-close svg { flex-shrink: 0; }
.article-overlay-source {
  font-size: 10px;
  letter-spacing: 0.24em;
  text-transform: uppercase;
  color: var(--gold);
  text-align: center;
}
.article-overlay-open-btn {
  display: inline-flex;
  align-items: center;
  min-width: 80px;
  justify-content: flex-end;
  font-size: 10px;
  letter-spacing: 0.18em;
  text-transform: uppercase;
  color: var(--charcoal);
  text-decoration: none;
  font-family: 'Optima', 'Jost', sans-serif;
  transition: color 0.2s;
  white-space: nowrap;
}
.article-overlay-open-btn:hover { color: var(--gold); }
.article-overlay-body {
  flex: 1;
  position: relative; /* concrete pixel height for PDF viewer */
  min-height: 0;
  background: var(--cream);
  padding: 0;
}
.article-iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  background: var(--cream);
}
@media (max-width: 768px) {
  .article-overlay-header { padding: max(14px, calc(env(safe-area-inset-top, 0px) + 10px)) 18px 14px; }
  .article-overlay-close { font-size: 9px; gap: 6px; min-width: 60px; }
  .article-overlay-open-btn { font-size: 9px; min-width: 60px; }
  .article-overlay-source { font-size: 9px; letter-spacing: 0.2em; }
  .article-overlay-body { padding: 0; }
}

/* ═══════════════════════════════════════════════════════════
   REVIEWS PAGE
═══════════════════════════════════════════════════════════ */
.reviews-hero {
  padding: 96px 56px 64px;
  text-align: center;
  border-bottom: 1px solid var(--border);
  background: var(--ivory);
}
.reviews-hero-eyebrow {
  font-size: 9.5px; letter-spacing: 0.32em; text-transform: uppercase;
  color: var(--gold); opacity: 0.8; margin-bottom: 18px; display: block;
}
.reviews-hero-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(34px, 5vw, 52px); font-weight: 300;
  color: var(--charcoal); margin-bottom: 40px; line-height: 1.15;
}
.reviews-stats {
  display: flex; align-items: center; justify-content: center;
  gap: 0; max-width: 540px; margin: 0 auto;
}
.reviews-stats .stat-block {
  flex: 1; text-align: center;
}
.reviews-stats .stat-num {
  font-family: 'Cormorant Garamond', serif;
  font-size: 42px; font-weight: 300; color: var(--charcoal);
  display: block; line-height: 1;
}
.reviews-stats .stat-stars {
  display: flex; gap: 4px; justify-content: center; margin: 6px 0 4px;
}
.reviews-stats .review-star {
  font-size: 14px; color: var(--gold);
  background: none; border: none; padding: 0; cursor: default;
  transition: none; font-family: serif;
}
.reviews-stats .stat-label {
  font-size: 8.5px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--soft); display: block; margin-top: 4px;
}
.stat-div {
  width: 1px; height: 40px; background: var(--border);
  flex-shrink: 0; margin: 0 24px;
}

.reviews-section {
  padding: 64px 56px 80px;
  background: var(--ivory);
}
.reviews-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 28px;
  max-width: 1100px; margin: 0 auto;
}
.review-card {
  background: #fff;
  border: 1px solid var(--border);
  padding: 28px 26px 24px;
  display: flex; flex-direction: column; gap: 14px;
  transition: box-shadow 0.25s, border-color 0.25s;
}
.review-card:hover {
  border-color: rgba(200,150,62,0.3);
  box-shadow: 0 8px 28px rgba(5,6,10,0.07);
}
.review-card .review-stars {
  display: flex; gap: 4px; margin-bottom: 0;
}
.review-card .review-star {
  font-size: 13px; color: var(--gold);
  background: none; border: none; padding: 0; cursor: default;
  transition: none; font-family: serif; line-height: 1;
}
.review-quote {
  font-family: 'Cormorant Garamond', serif;
  font-size: 15.5px; font-weight: 400; font-style: italic;
  color: var(--charcoal); line-height: 1.65; flex: 1;
}
.review-attr {
  display: flex; flex-direction: column; gap: 3px;
  padding-top: 14px;
  border-top: 1px solid rgba(92,79,61,0.1);
}
.review-name {
  font-size: 10.5px; letter-spacing: 0.12em;
  text-transform: uppercase; color: var(--charcoal); font-weight: 500;
}
.review-meta {
  font-size: 10px; color: var(--soft);
}
.review-product { color: var(--gold); }
.review-date {
  font-size: 9.5px; color: var(--soft); letter-spacing: 0.08em;
}
.review-occasion {
  display: inline-block; margin-top: 4px;
  font-size: 8.5px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--gold); border: 1px solid rgba(200,150,62,0.3);
  padding: 2px 8px; background: rgba(200,150,62,0.06);
}

.reviews-cta {
  padding: 80px 56px 72px;
  text-align: center;
  background: var(--warm-black);
  border-top: 1px solid rgba(200,150,62,0.12);
}
.reviews-cta-eyebrow {
  font-size: 9px; letter-spacing: 0.3em; text-transform: uppercase;
  color: var(--gold); opacity: 0.7; margin-bottom: 16px; display: block;
}
.reviews-cta-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: clamp(28px, 4vw, 42px); font-weight: 300;
  color: var(--ivory); line-height: 1.25; margin-bottom: 36px;
}
.btn-share {
  background: transparent; border: 1px solid rgba(200,150,62,0.5);
  color: var(--gold); padding: 13px 36px;
  font-size: 9.5px; letter-spacing: 0.28em; text-transform: uppercase;
  cursor: pointer; transition: background 0.2s, border-color 0.2s;
}
.btn-share:hover { background: rgba(200,150,62,0.1); border-color: rgba(200,150,62,0.8); }
.btn-share .btn-close-hint { display: none; font-size: 9px; opacity: 0.5; }
.btn-share.open .btn-open-text { display: none; }
.btn-share.open .btn-close-hint { display: inline; }

.review-expand-wrap {
  max-height: 0; overflow: hidden;
  transition: max-height 0.5s cubic-bezier(0.4,0,0.2,1);
  background: var(--warm-black);
}
.review-expand-wrap.open { max-height: 1200px; }
.review-expand-inner {
  max-width: 640px; margin: 0 auto;
  padding: 48px 56px 72px;
}
.expand-form-header { text-align: center; margin-bottom: 40px; }
.expand-form-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px; font-weight: 300; color: var(--ivory); margin-bottom: 10px;
}
.expand-form-sub {
  font-size: 12px; color: var(--soft); line-height: 1.6;
}
.expand-form { display: flex; flex-direction: column; gap: 0; }
.f-group { display: flex; flex-direction: column; margin-bottom: 18px; }
.f-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.f-label {
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--soft); margin-bottom: 7px;
}
.f-label span { opacity: 0.55; text-transform: none; font-size: 8.5px; }
.f-input, .f-select, .f-textarea {
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.1);
  padding: 12px 16px; color: var(--ivory);
  font-family: 'Optima','Jost',sans-serif; font-size: 13px;
  outline: none; transition: border-color 0.2s; width: 100%;
  box-sizing: border-box; -webkit-appearance: none;
}
.f-input:focus, .f-select:focus, .f-textarea:focus {
  border-color: rgba(200,150,62,0.5);
}
.f-input::placeholder, .f-textarea::placeholder { color: rgba(255,255,255,0.2); }
.f-select { cursor: pointer; }
.f-select option { background: #1a1814; color: var(--ivory); }
.f-textarea { resize: vertical; min-height: 96px; line-height: 1.7; }
.f-star-group .f-stars-input {
  display: flex; flex-direction: row-reverse; gap: 6px; justify-content: flex-end;
}
.f-stars-input input[type="radio"] { display: none; }
.f-stars-input label {
  font-size: 24px; cursor: pointer; color: rgba(200,150,62,0.2);
  transition: color 0.15s; line-height: 1;
}
.f-stars-input label::before { content: '★'; }
.f-stars-input input:checked ~ label,
.f-stars-input label:hover,
.f-stars-input label:hover ~ label { color: var(--gold); }
.f-divider { border-top: 1px solid rgba(255,255,255,0.08); margin: 8px 0 20px; }
.btn-f-submit {
  background: var(--gold); color: #fff; border: none;
  padding: 14px; font-size: 9.5px; letter-spacing: 0.28em;
  text-transform: uppercase; cursor: pointer;
  transition: background 0.2s; width: 100%;
}
.btn-f-submit:hover { background: #b8852c; }
.f-privacy {
  font-size: 9.5px; color: var(--soft); text-align: center;
  margin-top: 14px; line-height: 1.6;
}
.expand-thankyou { text-align: center; padding: 32px 0; }
.expand-ty-ornament { color: var(--gold); letter-spacing: 0.4em; margin-bottom: 18px; opacity: 0.6; }
.expand-ty-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 32px; font-weight: 300; color: var(--ivory); margin-bottom: 12px;
}
.expand-ty-body { font-size: 12px; color: var(--soft); line-height: 1.7; }

.mini-footer {
  background: #0D0B09; padding: 28px 56px;
  display: flex; align-items: center; justify-content: space-between;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.mini-footer-logo {
  font-family: 'Cormorant Garamond', serif;
  font-size: 13px; letter-spacing: 0.3em; color: var(--ivory); opacity: 0.4;
}
.mini-footer-links { display: flex; gap: 24px; }
.mini-footer-link {
  font-size: 9.5px; letter-spacing: 0.18em; text-transform: uppercase;
  color: var(--soft); text-decoration: none;
  transition: color 0.2s;
}
.mini-footer-link:hover { color: var(--gold); }

@media (max-width: 900px) {
  .reviews-hero { padding: 72px 24px 48px; }
  .reviews-section { padding: 48px 24px 64px; }
  .reviews-grid { grid-template-columns: 1fr 1fr; gap: 20px; }
  .reviews-cta { padding: 60px 24px 56px; }
  .review-expand-inner { padding: 40px 24px 56px; }
  .mini-footer { padding: 24px 24px; flex-direction: column; gap: 16px; }
}
@media (max-width: 600px) {
  .reviews-grid { grid-template-columns: 1fr; }
  .reviews-stats { gap: 0; }
  .stat-div { height: 32px; margin: 0 16px; }
  .f-row { grid-template-columns: 1fr; }
}

/* ═══════════════════════════════════════════════════════════
   CART PAGE
═══════════════════════════════════════════════════════════ */
.cart-page {
  padding: 64px 56px 120px;
  max-width: 1160px; margin: 0 auto; min-height: 80vh;
}
.cart-wrap {
  display: grid; grid-template-columns: 1fr 400px;
  gap: 64px; align-items: start;
}
.cart-title-row {
  display: flex; align-items: baseline; gap: 16px; margin-bottom: 8px;
}
.cart-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 38px; font-weight: 300; color: var(--charcoal);
}
.cart-count-label {
  font-size: 9.5px; letter-spacing: 0.22em; text-transform: uppercase; color: var(--soft);
}
.cart-rule { border: none; border-top: 1px solid var(--border); margin: 16px 0 24px; }
.cart-empty { padding: 40px 0 20px; }
.cart-empty p { font-size: 14px; color: var(--soft); margin-bottom: 14px; }
.cart-empty a {
  color: var(--gold); text-decoration: none;
  font-size: 10.5px; letter-spacing: 0.14em;
}
.cart-continue a {
  font-size: 10px; letter-spacing: 0.14em; color: var(--soft); text-decoration: none;
}
.cart-continue a:hover { color: var(--charcoal); }

/* Cart item rows (populated by JS) */
.cart-item {
  display: grid; grid-template-columns: 92px 1fr;
  gap: 18px; align-items: start;
  padding: 20px 0; border-bottom: 1px solid var(--border);
}
.ci-img { width: 92px; flex-shrink: 0; }
.ci-img img { width: 92px; height: 69px; object-fit: cover; display: block; }
.ci-details { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.ci-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 8px; }
.ci-collection {
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--soft); margin-bottom: 3px;
}
.ci-name {
  font-family: 'Cormorant Garamond', serif;
  font-size: 18px; font-weight: 300; color: var(--charcoal); line-height: 1.2;
}
.ci-hebrew {
  font-family: 'Cormorant Garamond', serif;
  font-size: 14px; color: var(--gold); margin-top: 2px; direction: rtl;
}
.ci-color {
  display: flex; align-items: center; gap: 6px;
  font-size: 10px; color: var(--soft); margin-top: 3px;
}
.ci-color-dot { width: 10px; height: 10px; border-radius: 50%; flex-shrink: 0; }
.ci-remove {
  background: none; border: none; cursor: pointer;
  font-size: 20px; line-height: 1; color: var(--soft); padding: 0 4px;
  transition: color 0.2s; flex-shrink: 0;
  -webkit-tap-highlight-color: transparent;
}
.ci-remove:hover { color: var(--charcoal); }
.ci-bottom { display: flex; justify-content: space-between; align-items: center; }
.ci-qty { display: flex; align-items: center; }
.ci-qty button {
  width: 28px; height: 28px; border-radius: 50%;
  border: 1px solid var(--border); background: #fff; color: var(--charcoal);
  font-size: 16px; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  transition: border-color 0.2s; padding: 0; line-height: 1;
  -webkit-tap-highlight-color: transparent;
}
.ci-qty button:hover { border-color: var(--gold); }
.ci-qty span { min-width: 28px; text-align: center; font-size: 13px; color: var(--charcoal); }
.ci-price {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 300; color: var(--charcoal);
}

/* Summary sidebar */
.cart-summary-col { position: sticky; top: 100px; }
.summary-wrap {
  background: var(--ivory); border: 1px solid var(--border);
  padding: 28px 28px 24px;
}
.summary-heading {
  font-family: 'Cormorant Garamond', serif;
  font-size: 20px; font-weight: 300; color: var(--charcoal);
  margin-bottom: 20px; padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}
.summary-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-size: 12px; color: var(--mid); padding: 7px 0;
}
.summary-row-rule { border-top: 1px solid var(--border); margin: 8px 0; }
.tax-note { font-size: 9px; color: var(--soft); line-height: 1.5; margin: 4px 0 12px; }
.summary-total-row {
  display: flex; justify-content: space-between; align-items: baseline;
  font-family: 'Cormorant Garamond', serif;
  font-size: 22px; font-weight: 300; color: var(--charcoal);
  padding: 14px 0 4px; border-top: 1px solid var(--border); margin-top: 6px;
}
.summary-usd { font-size: 10px; color: var(--soft); text-align: right; margin-bottom: 2px; }
.summary-simple-note { font-size: 9.5px; color: var(--soft); margin-bottom: 8px; line-height: 1.5; }

/* Shipping section */
.shipping-section { margin: 16px 0 18px; }
.shipping-from-lbl {
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--soft); display: block; margin-bottom: 10px;
}
.shipping-selects {
  display: grid; grid-template-columns: 1fr auto;
  gap: 8px; margin-bottom: 8px;
}
.shipping-selects select,
.shipping-selects input,
#shipState {
  background: #fff; border: 1px solid var(--border);
  padding: 9px 12px; font-size: 11px; color: var(--charcoal);
  outline: none; width: 100%; box-sizing: border-box;
  -webkit-appearance: none; cursor: pointer;
  transition: border-color 0.2s;
}
.shipping-selects select:focus,
.shipping-selects input:focus,
#shipState:focus { border-color: var(--gold); }
.state-wrap { margin-bottom: 8px; }
.ship-calc-btn {
  width: 100%; padding: 10px; background: transparent;
  border: 1px solid var(--gold); color: var(--charcoal);
  font-size: 9px; letter-spacing: 0.24em; text-transform: uppercase;
  cursor: pointer; transition: background 0.2s; margin-top: 4px;
}
.ship-calc-btn:hover { background: rgba(200,150,62,0.08); }
.ship-result { margin-top: 10px; }
.ship-result-cost { font-size: 13px; color: var(--charcoal); font-weight: 500; }
.ship-result-days { font-size: 10px; color: var(--soft); margin-top: 3px; }

/* Checkout email */
.checkout-email-wrap { margin: 18px 0 14px; }
.checkout-email-input {
  width: 100%; padding: 11px 14px;
  border: 1px solid var(--border); background: #fff;
  font-size: 12px; color: var(--charcoal); outline: none;
  box-sizing: border-box; margin-bottom: 10px;
  transition: border-color 0.2s;
}
.checkout-email-input:focus { border-color: var(--gold); }
.checkout-email-input::placeholder { color: var(--soft); }
.updates-label {
  display: flex; align-items: center; gap: 10px;
  font-size: 11px; color: var(--mid); cursor: pointer;
}
.updates-label input { accent-color: var(--gold); flex-shrink: 0; }

/* Gift section */
.gift-section { margin: 4px 0 16px; }
.gift-toggle-row {
  display: flex; align-items: center; gap: 10px;
  font-size: 12px; color: var(--mid); cursor: pointer;
  padding: 10px 0; border-top: 1px solid var(--border);
}
.gift-toggle-row input { accent-color: var(--gold); flex-shrink: 0; }
.gift-toggle-label { flex: 1; }
.gift-toggle-icon { font-size: 14px; }
.gift-message-wrap { padding: 12px 0 8px; }
.gift-message-hint { font-size: 11px; color: var(--soft); margin-bottom: 10px; line-height: 1.5; }
.gift-message-textarea {
  width: 100%; min-height: 72px; padding: 10px 14px;
  border: 1px solid var(--border); background: #fff;
  font-family: 'Optima','Jost',sans-serif;
  font-size: 16px; /* 16px prevents iOS auto-zoom on focus */
  color: var(--charcoal);
  resize: vertical; outline: none; box-sizing: border-box;
  transition: border-color 0.2s;
}
.gift-message-textarea:focus { border-color: var(--gold); }
.gift-message-textarea::placeholder { color: var(--soft); font-size: 14px; }
.gift-char-count { font-size: 9.5px; color: var(--soft); text-align: right; margin-top: 5px; }

/* Done button — appears when textarea is active, dismisses keyboard */
.gift-done-btn {
  display: none;
  width: 100%;
  padding: 11px;
  background: var(--gold);
  border: none;
  color: #fff;
  font-family: 'Optima','Jost',sans-serif;
  font-size: 9.5px;
  letter-spacing: 0.28em;
  text-transform: uppercase;
  cursor: pointer;
  margin-top: 10px;
  transition: background 0.2s, opacity 0.3s ease, transform 0.35s cubic-bezier(0.22,1,0.36,1);
  -webkit-tap-highlight-color: transparent;
  opacity: 0;
  transform: translateY(6px);
}
.gift-done-btn:active { background: #b8852c; }
.gift-message-wrap.typing .gift-done-btn {
  display: block;
  opacity: 1;
  transform: translateY(0);
}

.checkout-divider { border-top: 1px solid var(--border); margin: 16px 0; }

/* Payment section */
.coming-soon-section { }
.coming-soon-tag {
  font-size: 9px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--soft); margin-bottom: 14px; display: block;
}
.apple-pay-btn {
  width: 100%; padding: 13px; background: #000;
  border: none; border-radius: 4px; cursor: pointer;
  display: flex; align-items: center; justify-content: center; gap: 6px;
  color: #fff; font-size: 14px; margin-bottom: 14px;
  transition: background 0.2s;
}
.apple-pay-btn:hover { background: #1a1a1a; }
.or-divider {
  display: flex; align-items: center; gap: 12px; margin-bottom: 16px;
}
.or-divider-line { flex: 1; height: 1px; background: var(--border); }
.or-divider-text { font-size: 10px; color: var(--soft); white-space: nowrap; }
.card-form-section { }
.form-label-main {
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--soft); display: block; margin-bottom: 8px;
}
.card-group { margin-bottom: 10px; }
.card-number-wrap { position: relative; margin-bottom: -1px; }
.card-number-wrap input,
.card-row input,
.form-field input {
  width: 100%; padding: 10px 14px;
  border: 1px solid var(--border); background: #fff;
  font-size: 12px; color: var(--charcoal); outline: none;
  box-sizing: border-box; transition: border-color 0.2s;
}
.card-number-wrap input:focus,
.card-row input:focus,
.form-field input:focus { border-color: var(--gold); z-index: 1; position: relative; }
.card-row { display: grid; grid-template-columns: 1fr 1fr; }
.card-row input:first-child { border-right: none; }
.card-brand-icons {
  position: absolute; right: 12px; top: 50%; transform: translateY(-50%);
  display: flex; gap: 4px; align-items: center;
}
.form-field { margin-top: -1px; }
.place-order-btn {
  width: 100%; padding: 14px; background: var(--gold);
  border: none; color: #fff;
  font-size: 9.5px; letter-spacing: 0.28em; text-transform: uppercase;
  cursor: pointer; display: flex; align-items: center; justify-content: center;
  gap: 10px; margin-top: 14px; transition: background 0.2s;
}
.place-order-btn:hover { background: #b8852c; }
.security-note {
  display: flex; align-items: center; justify-content: center; gap: 6px;
  font-size: 9.5px; color: var(--soft); margin-top: 12px;
}
.cart-policy-links {
  display: flex; align-items: center; justify-content: center; gap: 8px;
  margin-top: 16px; padding-top: 14px;
  border-top: 1px solid rgba(92,79,61,0.1);
}
.cart-policy-links a {
  font-size: 10px; color: var(--mid); text-decoration: none;
  letter-spacing: 0.1em; text-transform: uppercase;
  transition: color 0.2s;
}
.cart-policy-links a:hover { color: var(--gold); }
.cart-policy-divider { color: rgba(92,79,61,0.3); font-size: 10px; }

/* Address overlay */
.addr-overlay {
  display: none; position: fixed; inset: 0; z-index: 50000;
  background: rgba(5,6,10,0.6); align-items: center; justify-content: center;
}
.addr-overlay.active { display: flex; }
.addr-panel {
  background: var(--ivory); padding: 40px 36px;
  max-width: 520px; width: calc(100% - 48px);
  max-height: 90vh; overflow-y: auto;
  position: relative;
}
.addr-close {
  position: absolute; top: 14px; right: 14px;
  background: rgba(20,18,16,0.07); border: none; border-radius: 20px;
  padding: 6px 13px;
  cursor: pointer;
  font-size: 9px; letter-spacing: 0.22em; text-transform: uppercase;
  color: var(--charcoal);
  font-family: 'Optima','Jost',sans-serif;
  transition: background 0.2s, color 0.2s;
}
.addr-close:hover { background: var(--gold); color: #fff; }
.addr-eyebrow {
  font-size: 9px; letter-spacing: 0.28em; text-transform: uppercase;
  color: var(--gold); margin-bottom: 8px;
}
.addr-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 26px; font-weight: 300; color: var(--charcoal); margin-bottom: 24px;
}
.addr-row-2 { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.addr-field { display: flex; flex-direction: column; margin-bottom: 14px; }
.addr-field label {
  font-size: 9px; letter-spacing: 0.2em; text-transform: uppercase;
  color: var(--soft); margin-bottom: 6px;
}
.addr-field input {
  padding: 10px 14px; border: 1px solid var(--border); background: #fff;
  font-size: 12px; color: var(--charcoal); outline: none; box-sizing: border-box;
  transition: border-color 0.2s;
}
.addr-field input:focus { border-color: var(--gold); }
.addr-optional { opacity: 0.5; text-transform: none; letter-spacing: 0; font-size: 8px; }
.addr-error { border-color: #c0392b !important; }
.addr-confirm-btn {
  width: 100%; padding: 14px; background: var(--gold);
  border: none; color: #fff;
  font-size: 9.5px; letter-spacing: 0.28em; text-transform: uppercase;
  cursor: pointer; margin-top: 20px;
  display: flex; align-items: center; justify-content: center;
  font-family: 'Optima','Jost',sans-serif;
  transition: background 0.2s;
  -webkit-tap-highlight-color: transparent;
}
.addr-confirm-btn:hover { background: #b8852c; }

/* Order confirm overlay */
.order-confirm {
  display: none; position: fixed; inset: 0; z-index: 60000;
  background: rgba(5,6,10,0.65);
  align-items: center; justify-content: center; padding: 20px;
}
.order-confirm.active { display: flex; }
.order-confirm-box {
  background: var(--ivory); padding: 52px 40px 44px;
  max-width: 440px; width: calc(100% - 40px);
  text-align: center;
}
.oc-icon {
  font-size: 22px; color: var(--gold); margin-bottom: 20px; display: block;
}
.oc-title {
  font-family: 'Cormorant Garamond', serif;
  font-size: 30px; font-weight: 300; color: var(--charcoal); margin-bottom: 16px;
}
.oc-sub {
  font-size: 13px; color: var(--mid); line-height: 1.75; margin-bottom: 28px;
}
.oc-close {
  padding: 11px 32px;
  border: 1px solid var(--gold); background: transparent; color: var(--charcoal);
  font-size: 9.5px; letter-spacing: 0.2em; text-transform: uppercase;
  cursor: pointer; font-family: 'Optima','Jost',sans-serif;
  transition: background 0.2s, color 0.2s;
  -webkit-tap-highlight-color: transparent;
}
.oc-close:hover { background: var(--gold); color: #fff; }

/* Simple view toggle */
.svt-wrap {
  display: flex; align-items: center; gap: 8px;
}
.svt-label { font-size: 9.5px; letter-spacing: 0.14em; color: var(--soft); }
.svt-switch { position: relative; display: inline-block; width: 34px; height: 18px; cursor: pointer; }
.svt-switch input { opacity: 0; width: 0; height: 0; }
.svt-track {
  position: absolute; inset: 0; border-radius: 9px;
  background: rgba(92,79,61,0.18); transition: background 0.2s;
}
.svt-track::before {
  content: ''; position: absolute; width: 12px; height: 12px;
  border-radius: 50%; background: #fff; top: 3px; left: 3px;
  transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.svt-switch input:checked + .svt-track { background: var(--gold); }
.svt-switch input:checked + .svt-track::before { transform: translateX(16px); }

@media (max-width: 900px) {
  .cart-page { padding: 48px 24px 80px; }
  .cart-wrap { grid-template-columns: 1fr; gap: 40px; }
  .cart-summary-col { position: static; }
}
@media (max-width: 600px) {
  .cart-page { padding: 36px 16px 64px; }
  .shipping-selects { grid-template-columns: 1fr; }
  .cart-item { grid-template-columns: 76px 1fr; gap: 12px; }
  .ci-img { width: 76px; }
  .ci-img img { width: 76px; height: 57px; }
  .ci-name { font-size: 16px; }
  .ci-price { font-size: 17px; }
  .order-confirm-box { padding: 40px 24px 36px; }
  .oc-title { font-size: 26px; }
  .oc-sub { font-size: 12px; }
  .addr-row-2 { grid-template-columns: 1fr; }
}

/* ─────────────────────────────────────────────────────────
   iOS ZOOM + TOUCH TARGET FIXES
   iOS Safari zooms the viewport when any focused input has
   font-size < 16px. All interactive inputs/selects/textareas
   must be ≥ 16px on mobile. Touch targets < 44px cause
   missed taps — qty +/− and small buttons enlarged below.
───────────────────────────────────────────────────────── */
@media (max-width: 768px) {
  /* Address overlay inputs — were 12px → iOS zoom */
  .addr-field input,
  .addr-field select,
  .addr-field textarea {
    font-size: 16px !important;
  }

  /* Cart checkout email input — was 12px */
  .checkout-email-input {
    font-size: 16px !important;
  }

  /* Shipping calculator selects/inputs — were 11px */
  .shipping-selects select,
  .shipping-selects input,
  #shipState {
    font-size: 16px !important;
  }

  /* Gift message textarea already 16px — keep consistent */
  .gift-message-textarea {
    font-size: 16px !important;
  }

  /* Qty +/− buttons — enlarge tap area to 44×44 without changing visual */
  .ci-qty button {
    width: 44px !important;
    height: 44px !important;
    border-radius: 50% !important;
  }
  .ci-qty span {
    min-width: 32px !important;
  }

  /* Remove button — was 20px text, give it a larger tap zone */
  .ci-remove {
    padding: 10px 8px !important;
    font-size: 22px !important;
  }

  /* Review form inputs on submit page */
  .form-input,
  .form-select,
  .form-textarea {
    font-size: 16px !important;
  }
}