
      *,
      *::before,
      *::after {
        box-sizing: border-box;
        margin: 0;
        padding: 0;
      }
      html {
        scroll-behavior: smooth;
        font-size: 112%;
      }

      :root {
        --wine: #fdfbf7;
        --wine2: #f4eee4;
        --wine3: #eae1d5;
        --wine4: #e1d6c7;
        --wine5: #d7caba;
        --burgundy: #7e2135;
        --deep: #f7f2e8;
        --cream: #24151d;
        --cream2: #38242e;
        --muted: rgba(36, 21, 29, 0.78);
        --muted2: rgba(36, 21, 29, 0.64);
        --muted3: rgba(36, 21, 29, 0.42);
        --border: rgba(163, 127, 44, 0.32);
        --border2: rgba(163, 127, 44, 0.16);
        --gold: #a1771f;
        --gold2: #c9a84c;
        --gold3: #a88030;
        --goldl: rgba(161, 119, 31, 0.15);
        --goldl2: rgba(161, 119, 31, 0.08);
      }

      body {
        font-family: "Sora", "Manrope", "DM Sans", sans-serif;
        background: var(--wine);
        color: var(--cream);
        overflow-x: hidden;
        cursor: none;
        transition:
          background 0.5s,
          color 0.5s;
      }

      /* CURSOR */
      #cur {
        width: 8px;
        height: 8px;
        border-radius: 50%;
        background: var(--gold);
        position: fixed;
        pointer-events: none;
        z-index: 9999;
        transform: translate(-50%, -50%);
        transition:
          width 0.22s,
          height 0.22s,
          opacity 0.2s;
      }
      #cur-r {
        width: 30px;
        height: 30px;
        border-radius: 50%;
        border: 1px solid rgba(201, 168, 76, 0.45);
        position: fixed;
        pointer-events: none;
        z-index: 9998;
        transform: translate(-50%, -50%);
        transition:
          left 0.07s,
          top 0.07s,
          width 0.22s,
          height 0.22s;
      }
      body.hov #cur {
        width: 16px;
        height: 16px;
        background: rgba(201, 168, 76, 0.25);
      }
      body.hov #cur-r {
        width: 48px;
        height: 48px;
        border-color: var(--gold);
      }

      /* GRAIN */
      body::before {
        content: "";
        position: fixed;
        inset: 0;
        pointer-events: none;
        z-index: 9990;
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='250' height='250'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='250' height='250' filter='url(%23n)' opacity='.04'/%3E%3C/svg%3E");
      }

      /* ═══ NAV ═══ */
      nav {
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 500;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 1rem 5vw;
        background: #fff; /* keep header background white */
        transition: all 0.5s;
      }
      nav.stuck {
        background: #fff; /* keep header background white on scroll */
        backdrop-filter: blur(20px) saturate(160%);
        padding: 1rem 5vw;
        border-bottom: 1px solid var(--border2);
      }
      .logo {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.6rem;
        font-weight: 300;
        color: var(--cream);
        text-decoration: none;
        letter-spacing: 0.08em;
        display: flex;
        align-items: center;
        gap: 0.55rem;
      }
      .logo em {
        color: var(--gold);
        font-style: italic;
      }
      .nav-ul {
        display: flex;
        gap: 2.8rem;
        list-style: none;
      }
      .nav-ul a {
        font-size: 0.67rem;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        color: var(--muted);
        text-decoration: none;
        transition: color 0.3s;
        position: relative;
        padding-bottom: 3px;
      }
      .nav-ul a::after {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        width: 0;
        height: 1px;
        background: var(--gold);
        transition: width 0.35s;
      }
      .nav-ul a:hover {
        color: var(--gold);
      }
      .nav-ul a:hover::after {
        width: 100%;
      }
      .nav-btn {
        font-size: 0.63rem;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        padding: 0.62rem 1.7rem;
        border: 1px solid var(--gold);
        color: var(--gold);
        background: transparent;
        font-family: "DM Sans", sans-serif;
        text-decoration: none;
        transition: all 0.3s;
      }
      .nav-btn:hover {
        background: var(--gold);
        color: var(--wine);
      }
      /* ═══ HERO ═══ */
      .hero {
        height: 100vh;
        min-height: 720px;
        display: grid;
        grid-template-columns: 1fr 1fr;
        overflow: hidden;
        position: relative;
        background: var(--deep);
      }
      .hero-left {
        position: relative;
        display: flex;
        flex-direction: column;
        justify-content: center;
        padding: 0 6vw 0 5vw;
        z-index: 2;
        background: linear-gradient(
          135deg,
          var(--deep) 0%,
          var(--wine) 60%,
          var(--wine2) 100%
        );
      }
      .hero-left::after {
        content: "";
        position: absolute;
        right: 0;
        top: 0;
        bottom: 0;
        width: 1px;
        background: linear-gradient(
          to bottom,
          transparent,
          var(--border),
          transparent
        );
      }
      .h-tag {
        display: inline-flex;
        align-items: center;
        gap: 0.7rem;
        font-size: 0.6rem;
        letter-spacing: 0.3em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 2.2rem;
        font-weight: 500;
        opacity: 0;
        transform: translateY(20px);
        animation: slideUp 0.8s 0.2s forwards;
      }
      .h-tagline {
        width: 28px;
        height: 1px;
        background: var(--gold);
      }
      .h-title {
        font-family: "Cormorant Garamond", serif;
        font-size: clamp(3.5rem, 5.5vw, 6rem);
        font-weight: 300;
        line-height: 1.01;
        color: var(--cream);
        letter-spacing: -0.01em;
        opacity: 0;
        transform: translateY(28px);
        animation: slideUp 0.9s 0.4s forwards;
      }
      .h-title em {
        font-style: italic;
        color: var(--gold);
        display: block;
      }
      .h-para {
        font-size: 0.88rem;
        line-height: 1.9;
        color: var(--muted);
        max-width: 400px;
        margin: 1.8rem 0 3rem;
        font-weight: 300;
        opacity: 0;
        transform: translateY(22px);
        animation: slideUp 0.8s 0.6s forwards;
      }
      .h-btns {
        display: flex;
        gap: 1.4rem;
        align-items: center;
        opacity: 0;
        transform: translateY(16px);
        animation: slideUp 0.7s 0.8s forwards;
      }
      .btn-w {
        display: inline-block;
        padding: 0.95rem 2.6rem;
        background: var(--gold);
        color: var(--wine);
        font-size: 0.63rem;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        font-weight: 500;
        text-decoration: none;
        font-family: "DM Sans", sans-serif;
        transition: all 0.3s;
      }
      .btn-w:hover {
        background: var(--gold2);
        transform: translateY(-2px);
      }
      .btn-ghost {
        display: inline-flex;
        align-items: center;
        gap: 0.8rem;
        font-size: 0.63rem;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        color: var(--muted);
        text-decoration: none;
        transition: color 0.3s;
      }
      .btn-ghost:hover {
        color: var(--gold);
      }
      .b-arr {
        width: 32px;
        height: 1px;
        background: currentColor;
        position: relative;
        transition: width 0.3s;
      }
      .b-arr::after {
        content: "";
        position: absolute;
        right: -1px;
        top: -3px;
        width: 7px;
        height: 7px;
        border-right: 1px solid currentColor;
        border-top: 1px solid currentColor;
        transform: rotate(45deg);
      }
      .btn-ghost:hover .b-arr {
        width: 48px;
      }
      .h-scroll {
        position: absolute;
        bottom: 3rem;
        left: 5vw;
        display: flex;
        align-items: center;
        gap: 0.8rem;
        font-size: 0.56rem;
        letter-spacing: 0.28em;
        text-transform: uppercase;
        color: rgba(201, 168, 76, 0.3);
        opacity: 0;
        animation: fadeIn 0.8s 1.2s forwards;
      }
      .h-scr-line {
        width: 32px;
        height: 1px;
        background: rgba(201, 168, 76, 0.25);
        animation: expandW 1.2s 1.5s forwards;
        transform: scaleX(0);
        transform-origin: left;
      }
      .hero-right {
        position: relative;
        overflow: hidden;
        background: linear-gradient(
          145deg,
          var(--wine2) 0%,
          var(--wine3) 50%,
          var(--wine4) 100%
        );
        clip-path: inset(0 100% 0 0);
        animation: revealRight 1.1s 0.1s cubic-bezier(0.16, 1, 0.3, 1) forwards;
      }
      .hero-art {
        position: absolute;
        top: 110px;
        right: 4vw;
        bottom: 4vw;
        left: 4vw;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 12px;
        overflow: hidden;
        box-shadow: 0 15px 40px rgba(0, 0, 0, 0.15);
      }
      .h-cards {
        position: absolute;
        bottom: 3rem;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        gap: 1px;
        z-index: 10;
        opacity: 0;
        animation: fadeIn 0.8s 1s forwards;
      }
      .h-card {
        background: rgba(250, 246, 240, 0.75);
        border: 1px solid var(--border2);
        padding: 0.9rem 1.2rem;
        text-align: center;
        backdrop-filter: blur(12px);
        min-width: 90px;
      }
      .h-card-n {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.4rem;
        font-weight: 300;
        color: var(--gold);
        line-height: 1;
      }
      .h-card-l {
        font-size: 0.5rem;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        color: var(--muted2);
        margin-top: 0.3rem;
      }

      @keyframes slideUp {
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }
      @keyframes fadeIn {
        to {
          opacity: 1;
        }
      }
      @keyframes revealRight {
        to {
          clip-path: inset(0 0% 0 0);
        }
      }
      @keyframes expandW {
        to {
          transform: scaleX(1);
        }
      }
      @keyframes marquee {
        to {
          transform: translateX(-50%);
        }
      }

      /* ═══ TICKER ═══ */
      .ticker {
        overflow: hidden;
        white-space: nowrap;
        background: var(--wine3);
        border-top: 1px solid var(--border2);
        border-bottom: 1px solid var(--border2);
        padding: 0.78rem 0;
      }
      .t-inner {
        display: inline-flex;
        animation: marquee 42s linear infinite;
      }
      .t-i {
        font-size: 0.6rem;
        letter-spacing: 0.26em;
        text-transform: uppercase;
        padding: 0 2.5rem;
        color: var(--muted2);
        font-weight: 300;
      }
      .t-sep {
        color: var(--gold);
        opacity: 0.55;
      }

      /* ═══ SHARED SECTION ═══ */
      .sec {
        padding: 6rem 5vw;
      }
      .eyebrow {
        display: inline-flex;
        align-items: center;
        gap: 0.8rem;
        font-size: 0.58rem;
        letter-spacing: 0.32em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 1.3rem;
        font-weight: 500;
      }
      .e-l {
        width: 22px;
        height: 1px;
        background: var(--gold);
      }
      .h2 {
        font-family: "Cormorant Garamond", serif;
        font-size: clamp(2.2rem, 4vw, 3.8rem);
        font-weight: 300;
        line-height: 1.1;
        color: var(--cream);
      }
      .h2 em {
        font-style: italic;
        color: var(--gold);
      }
      .lead {
        font-size: 0.88rem;
        line-height: 1.9;
        color: var(--muted);
        font-weight: 300;
        max-width: 520px;
        margin-top: 0.9rem;
      }

      /* ═══════════════════════════════════════════
         ABOUT SECTION — REDESIGNED
      ═══════════════════════════════════════════ */
      .about-section {
        padding: 7rem 5vw;
        background: var(--wine);
        border-top: 1px solid var(--border2);
        border-bottom: 1px solid var(--border2);
      }
      .about-inner {
        max-width: 1200px;
        margin: 0 auto;
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 5rem;
        align-items: start;
      }

      /* Left column */
      .about-left .eyebrow {
        margin-bottom: 1.6rem;
      }
      .about-heading {
        font-family: "Cormorant Garamond", serif;
        font-size: clamp(2.4rem, 3.6vw, 3.4rem);
        font-weight: 300;
        line-height: 1.08;
        color: var(--cream);
        margin-bottom: 1.6rem;
      }
      .about-heading em {
        font-style: italic;
        color: var(--gold);
      }
      .about-body {
        font-size: 0.9rem;
        line-height: 1.85;
        color: var(--muted);
        font-weight: 300;
        margin-bottom: 1.2rem;
      }
      .about-chips {
        display: flex;
        flex-wrap: wrap;
        gap: 0.6rem;
        margin: 1.8rem 0 2.2rem;
      }
      .about-chip {
        padding: 0.42rem 1rem;
        border: 1px solid var(--border);
        border-radius: 999px;
        color: var(--cream);
        background: var(--goldl2);
        font-size: 0.78rem;
        letter-spacing: 0.04em;
      }
      .about-stats-row {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 0;
        border: 1px solid var(--border2);
        border-radius: 14px;
        overflow: hidden;
      }
      .about-stat {
        padding: 1.4rem 1.2rem;
        text-align: center;
        border-right: 1px solid var(--border2);
        background: rgba(0, 0, 0, 0.18);
        position: relative;
      }
      .about-stat:last-child {
        border-right: none;
      }
      .about-stat-num {
        font-family: "Cormorant Garamond", serif;
        font-size: 2.2rem;
        color: var(--gold);
        line-height: 1;
        margin-bottom: 0.3rem;
      }
      .about-stat-lbl {
        font-size: 0.58rem;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--muted2);
      }

      /* Right column */
      .about-right h3 {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.3rem;
        font-weight: 400;
        color: var(--gold);
        margin-bottom: 0.9rem;
      }
      .about-right p {
        font-size: 0.88rem;
        line-height: 1.8;
        color: var(--muted);
        font-weight: 300;
        margin-bottom: 1.4rem;
      }
      .about-gallery {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 0.7rem;
        margin-bottom: 1.6rem;
      }
      .about-thumb {
        border-radius: 10px;
        overflow: hidden;
        border: 1px solid var(--border2);
        aspect-ratio: 4/3;
      }
      .about-thumb img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transition: transform 0.45s ease;
      }
      .about-thumb:hover img {
        transform: scale(1.05);
      }
      .about-quote {
        padding: 1.4rem 1.5rem;
        border-left: 2px solid var(--gold);
        background: var(--goldl2);
        border-radius: 0 10px 10px 0;
      }
      .about-quote p {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.05rem;
        font-style: italic;
        color: var(--cream);
        line-height: 1.6;
        margin-bottom: 0.6rem;
      }
      .about-quote cite {
        font-size: 0.62rem;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        color: var(--gold);
        font-style: normal;
      }

      /* ═══ COLLECTIONS ═══ */
      .coll-section {
        background: linear-gradient(180deg, #faf5eb 0%, #f5ecde 100%);
      }
      .coll-head {
        text-align: center;
        margin-bottom: 5rem;
      }
      .coll-head .lead {
        margin: 1rem auto 0;
      }
      .coll-grid {
        display: grid;
        grid-template-columns: repeat(12, 1fr);
        grid-template-rows: 280px 280px;
        gap: 2px;
      }
      .ci {
        position: relative;
        overflow: hidden;
        cursor: none;
        background: var(--wine3);
      }
      .ci:nth-child(1) {
        grid-column: span 5;
        grid-row: span 2;
      }
      .ci:nth-child(2) {
        grid-column: span 4;
      }
      .ci:nth-child(3) {
        grid-column: span 3;
      }
      .ci:nth-child(4) {
        grid-column: span 3;
      }
      .ci:nth-child(5) {
        grid-column: span 4;
      }
      .ci:nth-child(6) {
        grid-column: span 5;
      }
      .ci-fill {
        position: absolute;
        inset: 0;
        transition: transform 0.7s cubic-bezier(0.25, 0.46, 0.45, 0.94);
        background-size: cover;
        background-position: center;
        background-repeat: no-repeat;
        background-color: var(--wine3);
      }
      .ci:hover .ci-fill {
        transform: scale(1.05);
      }
      .ci-dots {
        position: absolute;
        inset: 0;
        background-image: radial-gradient(
          circle at 1.5px 1.5px,
          rgba(201, 168, 76, 0.14) 1px,
          transparent 0
        );
        background-size: 24px 24px;
        opacity: 0;
        transition: opacity 0.4s;
      }
      .ci:hover .ci-dots {
        opacity: 1;
      }
      .ci-glow {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 1px;
        background: linear-gradient(
          90deg,
          transparent,
          var(--gold),
          transparent
        );
        transform: scaleX(0);
        transition: transform 0.5s;
      }
      .ci:hover .ci-glow {
        transform: scaleX(1);
      }
      .ci-body {
        position: absolute;
        inset: 0;
        z-index: 3;
        display: flex;
        flex-direction: column;
        justify-content: flex-end;
        padding: 1.8rem;
        background: linear-gradient(
          to top,
          rgba(233, 223, 208, 0.65) 0%,
          rgba(233, 223, 208, 0) 40%
        );
      }
      .ci:nth-child(1) .ci-body {
        padding: 2.5rem;
      }
      .ci-badge {
        font-size: 0.52rem;
        letter-spacing: 0.24em;
        text-transform: uppercase;
        color: var(--gold);
        font-weight: 500;
        margin-bottom: 0.5rem;
        opacity: 0;
        transform: translateY(6px);
        transition: all 0.35s;
        display: flex;
        align-items: center;
        gap: 0.5rem;
      }
      .ci-badge::before {
        content: "";
        width: 14px;
        height: 1px;
        background: var(--gold);
      }
      .ci:hover .ci-badge {
        opacity: 1;
        transform: translateY(0);
      }
      .ci-name {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.35rem;
        font-weight: 300;
        color: var(--cream);
        line-height: 1.2;
      }
      .ci:nth-child(1) .ci-name {
        font-size: 2.1rem;
      }
      .ci-sub {
        font-size: 0.57rem;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--muted2);
        margin-top: 0.4rem;
      }
      .ci-ico {
        position: absolute;
        top: 1.4rem;
        right: 1.4rem;
        z-index: 4;
        opacity: 0.18;
        transition: opacity 0.4s;
      }
      .ci:hover .ci-ico {
        opacity: 0.5;
      }

      /* ═══ PRODUCTS ═══ */
      .prod-section {
        background: #f8f2e8;
      }
      .prod-top {
        display: flex;
        justify-content: space-between;
        align-items: flex-end;
        margin-bottom: 3.5rem;
        flex-wrap: wrap;
        gap: 2rem;
      }
      .ptabs {
        display: flex;
        flex-wrap: wrap;
      }
      .ptab {
        font-size: 0.6rem;
        letter-spacing: 0.18em;
        text-transform: uppercase;
        padding: 0.58rem 1.3rem;
        border: 1px solid var(--border2);
        background: transparent;
        color: var(--muted2);
        cursor: none;
        font-family: "DM Sans", sans-serif;
        transition: all 0.25s;
        margin-left: -1px;
        position: relative;
        z-index: 1;
      }
      .ptab.on,
      .ptab:hover {
        border-color: var(--gold);
        color: var(--gold);
        background: var(--goldl2);
        z-index: 2;
      }
      .pgrid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        gap: 2px;
      }
      .pc {
        display: none;
      }
      .pc.show {
        display: block;
      }
      .pcard {
        background: var(--wine3);
        border: 1px solid var(--border2);
        transition: border-color 0.3s;
        overflow: hidden;
      }
      .pcard:hover {
        border-color: rgba(201, 168, 76, 0.3);
      }
      .pthumb {
        height: 188px;
        position: relative;
        overflow: hidden;
      }
      .pthumb-fill {
        position: absolute;
        inset: 0;
        transition: transform 0.55s;
      }
      .pcard:hover .pthumb-fill {
        transform: scale(1.06);
      }
      .pthumb-ico {
        position: absolute;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        z-index: 2;
      }
      .pthumb-ico svg {
        width: 42px;
        height: 42px;
        opacity: 0.18;
        transition: opacity 0.3s;
      }
      .pcard:hover .pthumb-ico svg {
        opacity: 0.32;
      }

      /* ───────── PRODUCT MODAL ───────── */
      .p-modal {
        position: fixed;
        inset: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        padding: 1.5rem;
        background: rgba(18, 10, 8, 0.5);
        backdrop-filter: blur(8px);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity 0.25s ease;
        z-index: 1200;
      }
      .p-modal.show {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
      }
      .p-modal-content {
        position: relative;
        background: var(--wine);
        color: var(--cream);
        border-radius: 18px;
        width: min(980px, 96vw);
        padding: 1.75rem;
        box-shadow: 0 24px 60px rgba(18, 10, 8, 0.22);
      }
      .p-modal-close {
        position: absolute;
        top: 12px;
        right: 14px;
        font-size: 1.6rem;
        color: var(--muted2);
        cursor: pointer;
        line-height: 1;
        transition: color 0.2s;
      }
      .p-modal-close:hover {
        color: var(--cream2);
      }
      .p-modal-grid {
        display: grid;
        grid-template-columns: 1.05fr 1fr;
        gap: 1.4rem;
        align-items: stretch;
      }
      .p-modal-img {
        border-radius: 14px;
        background-size: cover;
        background-position: center;
        min-height: 320px;
        box-shadow: inset 0 0 0 1px var(--border2);
      }
      .p-modal-info {
        display: flex;
        flex-direction: column;
        gap: 0.75rem;
      }
      .p-modal-tag {
        display: inline-flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0.45rem 0.9rem;
        border-radius: 999px;
        background: var(--goldl2);
        color: var(--cream2);
        font-size: 0.65rem;
        letter-spacing: 0.04em;
        text-transform: uppercase;
      }
      .p-modal-title {
        font-size: 1.6rem;
        letter-spacing: -0.01em;
      }
      .p-modal-size {
        color: var(--muted2);
        font-weight: 600;
        letter-spacing: 0.02em;
      }
      .p-modal-desc {
        color: var(--muted);
        line-height: 1.6;
      }
      .p-modal-features {
        list-style: none;
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 0.75rem 1rem;
        padding: 0;
        margin: 0.4rem 0 0.2rem;
        color: var(--cream2);
        font-weight: 600;
      }
      .p-modal-features svg {
        color: var(--gold);
        flex-shrink: 0;
      }
      .p-modal-features li {
        display: inline-flex;
        align-items: center;
        gap: 0.55rem;
      }
      .p-modal-actions {
        display: flex;
        gap: 0.8rem;
        flex-wrap: wrap;
        margin-top: 0.4rem;
      }
      .p-modal-actions .btn-w,
      .p-modal-actions .btn-ghost {
        padding: 0.8rem 1.6rem;
      }
      .ptag {
        position: absolute;
        top: 0.9rem;
        left: 0.9rem;
        z-index: 3;
        font-size: 0.5rem;
        letter-spacing: 0.2em;
        text-transform: uppercase;
        color: var(--gold);
        background: rgba(250, 246, 240, 0.9);
        border: 1px solid var(--border2);
        padding: 0.25rem 0.6rem;
        backdrop-filter: blur(6px);
      }
      .pbody {
        padding: 1.3rem 1.4rem 1.5rem;
      }
      .pname {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.05rem;
        font-weight: 400;
        color: var(--cream);
        margin-bottom: 0.35rem;
      }
      .psize {
        font-size: 0.57rem;
        letter-spacing: 0.1em;
        text-transform: uppercase;
        color: var(--muted2);
        font-weight: 300;
      }

      /* ═══ WHY US ═══ */
      .why-section {
        background: #f3ecdf;
        border-top: 1px solid var(--border2);
        border-bottom: 1px solid var(--border2);
      }
      .why-grid {
        display: grid;
        grid-template-columns: repeat(4, 1fr);
        margin-top: 4.5rem;
      }
      .wc {
        padding: 3rem 2.5rem;
        border-right: 1px solid var(--border2);
        transition: background 0.4s;
        position: relative;
        overflow: hidden;
      }
      .wc:last-child {
        border-right: none;
      }
      .wc::before {
        content: "";
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 2px;
        background: linear-gradient(
          90deg,
          transparent,
          var(--gold),
          transparent
        );
        transform: scaleX(0);
        transition: transform 0.5s;
      }
      .wc:hover::before {
        transform: scaleX(1);
      }
      .wc:hover {
        background: rgba(201, 168, 76, 0.04);
      }
      .w-ico {
        width: 50px;
        height: 50px;
        border: 1px solid var(--border);
        display: flex;
        align-items: center;
        justify-content: center;
        margin-bottom: 2rem;
        transition: all 0.35s;
      }
      .wc:hover .w-ico {
        border-color: var(--gold);
        background: var(--goldl2);
      }
      .w-title {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.18rem;
        font-weight: 400;
        color: var(--cream);
        margin-bottom: 0.8rem;
      }
      .w-desc {
        font-size: 0.8rem;
        line-height: 1.85;
        color: var(--muted2);
        font-weight: 300;
      }

      /* ═══ OCCASIONS ═══ */
      .occ-section {
        background: var(--wine2);
      }
      .occ-grid {
        display: grid;
        grid-template-columns: repeat(6, 1fr);
        gap: 2px;
        margin-top: 4rem;
      }
      .oc {
        padding: 2.8rem 1.4rem;
        text-align: center;
        border: 1px solid var(--border2);
        background: var(--wine3);
        cursor: none;
        position: relative;
        overflow: hidden;
        transition: border-color 0.3s;
      }
      .oc:hover {
        border-color: rgba(201, 168, 76, 0.28);
        background: rgba(201, 168, 76, 0.03);
      }
      .oc-line {
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
        height: 2px;
        background: var(--gold);
        transform: scaleX(0);
        transition: transform 0.45s;
      }
      .oc:hover .oc-line {
        transform: scaleX(1);
      }
      .oc svg {
        width: 28px;
        height: 28px;
        margin: 0 auto 1.1rem;
        display: block;
      }
      .oc-name {
        font-family: "Cormorant Garamond", serif;
        font-size: 0.98rem;
        font-weight: 400;
        color: var(--cream);
        margin-bottom: 0.3rem;
      }
      .oc-sub {
        font-size: 0.56rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--muted2);
        font-weight: 300;
      }

      /* ═══ INFO BAR ═══ */
      .infobar {
        background: var(--gold);
        color: var(--wine);
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        padding: 2.5rem 5vw;
      }
      .ib {
        border-right: 1px solid rgba(26, 8, 16, 0.15);
        padding: 0 2.5rem;
      }
      .ib:first-child {
        padding-left: 0;
      }
      .ib:last-child {
        border-right: none;
      }
      .ib-l {
        font-size: 0.54rem;
        letter-spacing: 0.24em;
        text-transform: uppercase;
        font-weight: 600;
        opacity: 0.55;
        margin-bottom: 0.5rem;
      }
      .ib-v {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.08rem;
        font-weight: 400;
        line-height: 1.5;
      }
      .ib-v small {
        font-family: "DM Sans", sans-serif;
        font-size: 0.7rem;
        opacity: 0.58;
        display: block;
        font-weight: 300;
        margin-top: 0.15rem;
      }

      /* ═══════════════════════════════════════════
         CONTACT SECTION — REDESIGNED
      ═══════════════════════════════════════════ */
      .contact-section {
        padding: 7rem 5vw;
        background: var(--wine2);
        border-top: 1px solid var(--border2);
      }
      .contact-inner {
        max-width: 1100px;
        margin: 0 auto;
      }
      .contact-header {
        text-align: center;
        margin-bottom: 4rem;
      }
      .contact-header .lead {
        margin: 0.9rem auto 0;
        max-width: 560px;
      }
      .contact-grid {
        display: grid;
        grid-template-columns: 1fr 1.3fr;
        gap: 2rem;
        align-items: start;
      }

      /* Info card */
      .cinfo-card {
        background: var(--wine3);
        border: 1px solid var(--border2);
        border-radius: 18px;
        padding: 2.8rem;
        position: relative;
        overflow: hidden;
      }
      .cinfo-card::before {
        content: "";
        position: absolute;
        top: -60px;
        right: -60px;
        width: 180px;
        height: 180px;
        border-radius: 50%;
        background: radial-gradient(
          circle,
          rgba(201, 168, 76, 0.1),
          transparent 70%
        );
        pointer-events: none;
      }
      .cinfo-title {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.7rem;
        font-weight: 300;
        color: var(--cream);
        margin-bottom: 0.5rem;
        line-height: 1.15;
      }
      .cinfo-title em {
        font-style: italic;
        color: var(--gold);
      }
      .cinfo-sub {
        font-size: 0.82rem;
        color: var(--muted2);
        line-height: 1.7;
        margin-bottom: 2.2rem;
        font-weight: 300;
      }
      .cinfo-divider {
        height: 1px;
        background: var(--border2);
        margin-bottom: 2rem;
      }
      .cinfo-contact-item {
        display: flex;
        align-items: flex-start;
        gap: 1rem;
        margin-bottom: 1.6rem;
      }
      .cinfo-contact-item:last-of-type {
        margin-bottom: 0;
      }
      .cinfo-icon {
        width: 36px;
        height: 36px;
        border: 1px solid var(--border);
        border-radius: 8px;
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
        background: var(--goldl2);
      }
      .cinfo-icon svg {
        width: 14px;
        height: 14px;
      }
      .cinfo-label {
        font-size: 0.56rem;
        letter-spacing: 0.2em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 0.3rem;
      }
      .cinfo-value {
        font-size: 0.95rem;
        color: var(--cream);
        text-decoration: none;
        font-family: "Cormorant Garamond", serif;
        line-height: 1.4;
        transition: color 0.3s;
      }
      .cinfo-value:hover {
        color: var(--gold);
      }
      .cinfo-actions {
        display: flex;
        gap: 0.7rem;
        margin-top: 2rem;
        flex-wrap: wrap;
      }
      .cinfo-btn {
        padding: 0.6rem 1.4rem;
        border: 1px solid var(--border);
        background: transparent;
        color: var(--muted);
        font-size: 0.64rem;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        text-decoration: none;
        transition: all 0.3s;
        border-radius: 4px;
      }
      .cinfo-btn:hover {
        border-color: var(--gold);
        color: var(--gold);
      }
      .cinfo-btn.primary {
        background: var(--gold);
        border-color: var(--gold);
        color: var(--wine);
      }
      .cinfo-btn.primary:hover {
        background: var(--gold2);
        border-color: var(--gold2);
        color: var(--wine);
      }

      /* Form card */
      .cform-card {
        background: var(--wine3);
        border: 1px solid var(--border2);
        border-radius: 18px;
        padding: 2.8rem;
        position: relative;
        overflow: hidden;
      }
      .cform-card::after {
        content: "";
        position: absolute;
        bottom: -80px;
        left: -80px;
        width: 200px;
        height: 200px;
        border-radius: 50%;
        background: radial-gradient(
          circle,
          rgba(201, 168, 76, 0.07),
          transparent 70%
        );
        pointer-events: none;
      }
      .cform-title {
        font-family: "Cormorant Garamond", serif;
        font-size: 1.7rem;
        font-weight: 300;
        color: var(--cream);
        margin-bottom: 0.4rem;
      }
      .cform-sub {
        font-size: 0.82rem;
        color: var(--muted2);
        margin-bottom: 2rem;
        font-weight: 300;
      }
      .cform {
        position: relative;
        z-index: 2;
      }
      .form-row {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 1rem;
        margin-bottom: 1rem;
      }
      .form-field {
        display: flex;
        flex-direction: column;
      }
      .form-field.full {
        grid-column: span 2;
      }
      .form-field label {
        font-size: 0.55rem;
        letter-spacing: 0.2em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 0.5rem;
      }
      .form-field input,
      .form-field select,
      .form-field textarea {
        padding: 0.85rem 1rem;
        background: rgba(0, 0, 0, 0.22);
        border: 1px solid var(--border2);
        border-radius: 8px;
        color: var(--cream);
        font-family: "DM Sans", sans-serif;
        font-size: 0.88rem;
        outline: none;
        transition:
          border-color 0.3s,
          background 0.3s;
        width: 100%;
      }
      .form-field input::placeholder,
      .form-field textarea::placeholder {
        color: var(--muted3);
      }
      .form-field input:focus,
      .form-field select:focus,
      .form-field textarea:focus {
        border-color: rgba(201, 168, 76, 0.45);
        background: rgba(201, 168, 76, 0.04);
      }
      .form-field select {
        cursor: pointer;
        color: var(--muted2);
        appearance: none;
      }
      .form-field select option {
        background: var(--wine2);
        color: var(--cream);
      }
      .form-field textarea {
        resize: none;
        min-height: 110px;
      }
      .form-submit {
        width: 100%;
        margin-top: 0.5rem;
        padding: 1rem 2rem;
        background: var(--gold);
        color: var(--wine);
        border: none;
        font-family: "DM Sans", sans-serif;
        font-size: 0.7rem;
        letter-spacing: 0.22em;
        text-transform: uppercase;
        font-weight: 600;
        cursor: none;
        border-radius: 8px;
        transition: all 0.3s;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.8rem;
      }
      .form-submit:hover {
        background: var(--gold2);
        transform: translateY(-2px);
      }
      .form-success {
        display: none;
        margin-top: 1rem;
        padding: 1rem 1.2rem;
        background: rgba(201, 168, 76, 0.1);
        border: 1px solid rgba(201, 168, 76, 0.2);
        border-radius: 8px;
        color: var(--gold);
        font-size: 0.82rem;
        text-align: center;
      }

      /* ═══════════════════════════════════════════
         FOOTER — REDESIGNED
      ═══════════════════════════════════════════ */
      footer {
        position: relative;
        overflow: hidden;
        background:
          radial-gradient(
            circle at 20% 15%,
            rgba(201, 168, 76, 0.1),
            transparent 32%
          ),
          radial-gradient(
            circle at 80% -10%,
            rgba(201, 168, 76, 0.08),
            transparent 35%
          ),
          linear-gradient(160deg, var(--deep), var(--wine2));
        border-top: 1px solid var(--border2);
      }
      footer::before {
        content: "";
        position: absolute;
        inset: 0;
        background:
          linear-gradient(90deg, rgba(201, 168, 76, 0.08) 1px, transparent 1px)
            0 0 / 140px 140px,
          linear-gradient(0deg, rgba(201, 168, 76, 0.08) 1px, transparent 1px) 0
            0 / 140px 140px;
        opacity: 0.22;
        pointer-events: none;
      }
      .footer-wrap {
        width: 100%;
        margin: 0 auto;
        padding: 3.6rem 5vw 2.4rem;
        position: relative;
        z-index: 1;
        display: flex;
        flex-direction: column;
        gap: 2.6rem;
      }

      .footer-top {
        display: grid;
        grid-template-columns: 1.2fr 1fr 1fr;
        gap: 2.8rem;
        align-items: start;
      }

      /* Brand column */
      .f-brand-wrap {
      }
      .f-brand {
        display: inline-flex;
        align-items: center;
        gap: 0.75rem;
        margin-bottom: 1.1rem;
      }
      .f-logo {
        width: 180px;
        height: auto;
        display: block;
      }
      .f-logo-dark {
        display: block;
      }
      .f-logo-light {
        display: none;
      }
      .f-tagline {
        font-size: 0.86rem;
        color: var(--muted2);
        line-height: 1.8;
        font-weight: 300;
        max-width: 290px;
        margin-bottom: 1.2rem;
      }
      .f-badge {
        display: inline-flex;
        align-items: center;
        gap: 0.6rem;
        padding: 0.6rem 1rem;
        border: 1px solid var(--border);
        border-radius: 999px;
        font-size: 0.62rem;
        letter-spacing: 0.14em;
        text-transform: uppercase;
        color: var(--gold);
        background: var(--goldl2);
      }
      .f-badge-dot {
        width: 6px;
        height: 6px;
        border-radius: 50%;
        background: var(--gold);
        animation: pulse 2s infinite;
      }
      @keyframes pulse {
        0%,
        100% {
          opacity: 1;
          transform: scale(1);
        }
        50% {
          opacity: 0.5;
          transform: scale(0.8);
        }
      }

      /* Nav columns */
      .f-col-title {
        font-size: 0.58rem;
        letter-spacing: 0.26em;
        text-transform: uppercase;
        color: var(--gold);
        margin-bottom: 1.8rem;
        font-weight: 600;
        display: flex;
        align-items: center;
        gap: 0.6rem;
      }
      .f-col-title::after {
        content: "";
        flex: 1;
        height: 1px;
        background: var(--border2);
      }
      .f-nav-list {
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 1rem;
      }
      .f-nav-list li {
        display: flex;
        align-items: center;
        gap: 0.6rem;
      }
      .f-nav-arrow {
        width: 14px;
        height: 1px;
        background: var(--border);
        position: relative;
        flex-shrink: 0;
        transition:
          width 0.3s,
          background 0.3s;
      }
      .f-nav-arrow::after {
        content: "";
        position: absolute;
        right: 0;
        top: -2px;
        width: 5px;
        height: 5px;
        border-right: 1px solid var(--border);
        border-top: 1px solid var(--border);
        transform: rotate(45deg);
        transition: border-color 0.3s;
      }
      .f-nav-list a {
        color: var(--muted2);
        text-decoration: none;
        font-size: 0.88rem;
        transition: color 0.3s;
      }
      .f-nav-list li:hover .f-nav-arrow {
        width: 20px;
        background: var(--gold);
      }
      .f-nav-list li:hover .f-nav-arrow::after {
        border-color: var(--gold);
      }
      .f-nav-list a:hover {
        color: var(--cream);
      }

      /* Contact items in footer */
      .f-contact-list,
      .f-contact-list-new {
        list-style: none;
        display: flex;
        flex-direction: column;
        gap: 1.05rem;
        padding: 0;
        margin: 0;
      }
      .f-contact-list-new li {
        display: grid;
        grid-template-columns: auto 1fr;
        gap: 0.8rem;
        align-items: center;
      }
      .fc-icon {
        width: 44px;
        height: 44px;
        border-radius: 14px;
        background: var(--wine3);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        color: var(--gold);
        border: 1px solid var(--border2);
      }
      .fc-text {
        display: flex;
        flex-direction: column;
        gap: 0.18rem;
      }
      .fc-lbl {
        font-size: 0.55rem;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        color: var(--muted3);
      }
      .fc-text a,
      .fc-text span {
        font-size: 0.95rem;
        color: var(--cream2);
        text-decoration: none;
        line-height: 1.35;
        transition: color 0.25s ease;
      }
      .fc-text a:hover {
        color: var(--gold);
      }

      /* Footer divider & bottom bar */
      .footer-divider {
        height: 1px;
        background: var(--border2);
        margin: 0;
        opacity: 0.5;
      }
      .footer-bottom {
        padding: 0.8rem 0 0;
        display: flex;
        justify-content: space-between;
        align-items: center;
        flex-wrap: wrap;
        gap: 1rem;
      }
      .f-copy {
        font-size: 0.72rem;
        color: var(--muted3);
        font-weight: 300;
        letter-spacing: 0.04em;
      }
      .f-copy span {
        color: var(--muted2);
      }
      .f-bottom-links {
        display: flex;
        gap: 2rem;
        list-style: none;
      }
      .f-bottom-links a {
        font-size: 0.7rem;
        letter-spacing: 0.12em;
        text-transform: uppercase;
        color: var(--muted3);
        text-decoration: none;
        transition: color 0.3s;
      }
      .f-bottom-links a:hover {
        color: var(--gold);
      }

      /* ═══ REVEAL ═══ */
      .rv {
        opacity: 0;
        transform: translateY(26px);
        transition:
          opacity 0.85s cubic-bezier(0.16, 1, 0.3, 1),
          transform 0.85s cubic-bezier(0.16, 1, 0.3, 1);
      }
      .rv.in {
        opacity: 1;
        transform: translateY(0);
      }
      .d1 {
        transition-delay: 0.12s;
      }
      .d2 {
        transition-delay: 0.22s;
      }
      .d3 {
        transition-delay: 0.32s;
      }

      /* ═══ RESPONSIVE ═══ */
      @media (max-width: 1100px) {
        nav {
          padding: 1.2rem 4vw;
        }
        .nav-ul {
          display: none;
        }
        nav.stuck {
          padding: 0.9rem 4vw;
        }
        .hero {
          grid-template-columns: 1fr;
          height: auto;
          min-height: 100svh;
        }
        .hero-right {
          display: none;
        }
        .hero-left {
          padding: 7rem 4vw 5rem;
        }
        .h-title {
          font-size: 3.2rem;
        }
        .sec {
          padding: 4rem 4vw;
        }
        .about-inner {
          grid-template-columns: 1fr;
          gap: 3rem;
        }
        .about-section {
          padding: 5rem 4vw;
        }
        .coll-grid {
          grid-template-columns: 1fr 1fr;
          grid-template-rows: auto;
        }
        .ci:nth-child(n) {
          grid-column: span 1;
          grid-row: span 1;
        }
        .ci:nth-child(1) {
          grid-column: span 2;
        }
        .why-grid {
          grid-template-columns: 1fr 1fr;
        }
        .wc {
          border-bottom: 1px solid var(--border2);
          border-right: none;
        }
        .wc:nth-child(odd) {
          border-right: 1px solid var(--border2);
        }
        .occ-grid {
          grid-template-columns: repeat(3, 1fr);
        }
        .infobar {
          grid-template-columns: 1fr;
          padding: 2.5rem 4vw;
        }
        .ib {
          border: none;
          padding: 0.8rem 0;
          border-bottom: 1px solid rgba(26, 8, 16, 0.12);
        }
        .ib:last-child {
          border-bottom: none;
        }
        .contact-grid {
          grid-template-columns: 1fr;
        }
        .contact-section {
          padding: 5rem 4vw;
        }
        .footer-cta {
          grid-template-columns: 1fr;
          gap: 1rem;
          align-items: flex-start;
        }
        .footer-top {
          grid-template-columns: 1fr 1fr;
          gap: 3rem;
        }
        .f-brand-wrap {
          grid-column: span 2;
        }
        .p-modal-grid {
          grid-template-columns: 1fr;
        }
        .p-modal-img {
          min-height: 280px;
        }
        .pgrid {
          grid-template-columns: 1fr 1fr;
        }
        .h-cards {
          display: none;
        }
      }
      @media (max-width: 640px) {
        .h-btns {
          flex-direction: column;
          align-items: flex-start;
          gap: 0.65rem;
        }
        .btn-w {
          font-size: 0.55rem;
          padding: 0.8rem 1.8rem;
        }
        .btn-ghost {
          font-size: 0.55rem;
          gap: 0.6rem;
        }
        .b-arr {
          width: 24px;
        }
        .pgrid {
          grid-template-columns: 1fr;
        }
        .occ-grid {
          grid-template-columns: 1fr 1fr;
        }
        .why-grid {
          grid-template-columns: 1fr;
        }
        .wc {
          border-right: none !important;
        }
        .ptabs {
          gap: 0.4rem;
        }
        .ptab {
          margin-left: 0;
        }
        .form-row {
          grid-template-columns: 1fr;
        }
        .form-field.full {
          grid-column: span 1;
        }
        .cinfo-card,
        .cform-card {
          padding: 2rem 1.5rem;
        }
        .footer-cta {
          text-align: left;
          gap: 1.2rem;
        }
        .f-cta-actions {
          justify-content: flex-start;
        }
        .footer-top {
          grid-template-columns: 1fr;
        }
        .f-brand-wrap {
          grid-column: span 1;
        }
        .p-modal-content {
          padding: 1.4rem;
        }
        .p-modal-title {
          font-size: 1.4rem;
        }
        .p-modal-features {
          grid-template-columns: 1fr;
        }
        .footer-bottom {
          flex-direction: column;
          text-align: center;
          gap: 1rem;
        }
        .f-bottom-links {
          justify-content: center;
        }
        .about-stats-row {
          grid-template-columns: 1fr;
        }
        .about-stat {
          border-right: none;
          border-bottom: 1px solid var(--border2);
        }
        .about-stat:last-child {
          border-bottom: none;
        }
      }
    

