:root {
        --black:#0a0907;
        --deep:#100e0b;
        --teal:#1d4a47;
        --gold:#c9a96e;
        --gold-dim:#8a6f3f;
        --cream:#e8dcc8;
        --cream-dim:#b8a888;
        --white:#f5f0e8;
      }
      *,*::before,*::after {
        margin:0;
        padding:0;
        box-sizing:border-box
      }
      html,body {
        height:100%
      }
      body {
        background:var(--black);
        color:var(--cream);
        font-family:'Cormorant Garamond',serif;
        overflow-x:hidden;
        /* cursor handled in site.css */}
      body::before {
        content:'';
        position:fixed;
        inset:0;
        background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='1'/%3E%3C/svg%3E");
        opacity:.035;
        pointer-events:none;
        z-index:200
      }
      .cursor {
        width:10px;
        height:10px;
        border-radius:50%;
        background:var(--gold);
        position:fixed;
        top:0;
        left:0;
        pointer-events:none;
        z-index:9999;
        transform:translate(-50%,-50%);
        mix-blend-mode:difference;
        transition:width .2s,height .2s
      }
      .cursor-ring {
        width:36px;
        height:36px;
        border:1px solid var(--gold);
        border-radius:50%;
        position:fixed;
        top:0;
        left:0;
        pointer-events:none;
        z-index:9998;
        transform:translate(-50%,-50%);
        opacity:.5
      }
      /* NAV */
      nav {
        position:fixed;
        top:0;
        left:0;
        right:0;
        z-index:500;
        padding:24px clamp(32px,6vw,80px);
        display:flex;
        align-items:center;
        justify-content:space-between;
        transition:background .4s
      }
      nav.scrolled {
        background:rgba(10,9,7,.95);
        backdrop-filter:blur(8px)
      }
      .nav-logo img {
        height:40px;
        width:auto;
        display:block
      }
      .nav-links {
        display:flex;
        gap:clamp(20px,3vw,44px);
        list-style:none;
        align-items:center
      }
      .nav-links a {
        font-family:'Josefin Sans',sans-serif;
        font-size:10px;
        font-weight:300;
        letter-spacing:.35em;
        text-transform:uppercase;
        color:var(--cream-dim);
        text-decoration:none;
        transition:color .25s
      }
      .nav-links a:hover,.nav-links a.active {
        color:var(--gold)
      }
      .nav-reserve {
        border:1px solid rgba(201,169,110,.4);
        padding:10px 22px;
        color:var(--cream)!important;
        transition:all .3s!important
      }
      .nav-reserve:hover {
        background:var(--gold);
        color:var(--black)!important;
        border-color:var(--gold)!important
      }
      .nav-burger {
        display:none;
        flex-direction:column;
        gap:5px;
        cursor:pointer;
        background:none;
        border:none;
        padding:4px
      }
      .nav-burger span {
        display:block;
        width:24px;
        height:1px;
        background:var(--cream)
      }
      .nav-mobile {
        display:none;
        position:fixed;
        inset:0;
        background:var(--black);
        z-index:490;
        flex-direction:column;
        align-items:center;
        justify-content:center;
        gap:32px
      }
      .nav-mobile.open {
        display:flex
      }
      .nav-mobile a {
        font-family:'Playfair Display',serif;
        font-size:clamp(28px,6vw,48px);
        font-style:italic;
        color:var(--white);
        text-decoration:none
      }
      .nav-mobile a:hover {
        color:var(--gold)
      }
      /* HERO — exact mockup positioning:
         - .hero is 100vh (image fills viewport, matches mockup)
         - .hero-content absolute-positioned with bottom:-120px, so content's
           bottom edge sits 120px below the hero (matches mockup)
         - Mockup uses overflow:hidden which clips the last 120px of content
           (i.e. the submit button). We keep visibility by adding
           margin-bottom to .hero instead — footer gets pushed down past
           the content overhang so nothing collides + nothing clips.
         - Mobile (max-width:760px) reverts content to normal flow so it
           can be as tall as it needs, matching the mockup mobile rules. */
      .hero {
        position:relative;
        width:100%;
        height:100vh;
        margin-bottom:200px
      }
      .hero-bg {
        position:absolute;
        inset:0;
        background-image:url('/assets/images/extracted/contact-00.jpg');
        background-size:cover;
        background-position:top center
      }
      .hero-bg::after {
        content:'';
        position:absolute;
        inset:0;
        background:linear-gradient(to top,rgba(10,9,7,1) 0%,rgba(10,9,7,.97) 25%,rgba(10,9,7,.7) 50%,rgba(10,9,7,.1) 75%,rgba(10,9,7,0) 100%)
      }
      .hero-content {
        position:absolute;
        bottom:-120px;
        left:0;
        right:0;
        padding:0 clamp(32px,6vw,80px) clamp(48px,6vh,80px)
      }
      .contact-grid {
        display:grid;
        grid-template-columns:1fr 1fr;
        gap:clamp(40px,6vw,80px);
        align-items:end
      }
      /* CONTACT INFO */
      .section-label {
        font-family:'Josefin Sans',sans-serif;
        font-size:10px;
        font-weight:100;
        letter-spacing:.4em;
        text-transform:uppercase;
        color:var(--gold);
        margin-bottom:20px;
        display:flex;
        align-items:center;
        gap:16px
      }
      .section-label::before {
        content:'';
        display:block;
        width:32px;
        height:1px;
        background:var(--gold)
      }
      .contact-heading {
        font-family:'Playfair Display',serif;
        font-size:clamp(32px,4vw,54px);
        color:var(--white);
        margin-bottom:28px
      }
      .contact-heading em {
        font-style:italic;
        color:var(--gold)
      }
      .info-block {
        margin-bottom:24px
      }
      .info-block-label {
        font-family:'Josefin Sans',sans-serif;
        font-size:11px;
        letter-spacing:.4em;
        text-transform:uppercase;
        color:var(--gold);
        margin-bottom:8px
      }
      .info-block p,.info-block a {
        font-size:clamp(14px,1.2vw,16px);
        font-weight:300;
        line-height:1.8;
        color:var(--cream-dim);
        text-decoration:none;
        display:block
      }
      .info-block a:hover {
        color:var(--gold)
      }
      .hours-grid {
        display:grid;
        gap:6px
      }
      .hours-row {
        display:flex;
        justify-content:space-between;
        align-items:baseline;
        border-bottom:1px solid rgba(201,169,110,.1);
        padding-bottom:6px;
        gap:16px
      }
      .hours-day {
        font-family:'Josefin Sans',sans-serif;
        font-size:11px;
        letter-spacing:.2em;
        text-transform:uppercase;
        color:var(--cream-dim)
      }
      .hours-time {
        font-size:13px;
        font-weight:300;
        color:var(--cream-dim);
        text-align:right
      }
      .hours-closed {
        color:var(--gold-dim);
        font-style:italic
      }
      .social-links {
        display:flex;
        gap:16px
      }
      .social-links a {
        font-family:'Josefin Sans',sans-serif;
        font-size:10px;
        letter-spacing:.3em;
        text-transform:uppercase;
        color:var(--gold-dim);
        text-decoration:none;
        transition:color .2s
      }
      .social-links a:hover {
        color:var(--gold)
      }
      /* FORM */
      .form-heading {
        font-family:'Playfair Display',serif;
        font-size:clamp(28px,3.5vw,44px);
        color:var(--white);
        margin-bottom:8px
      }
      .form-heading em {
        font-style:italic;
        color:var(--gold)
      }
      .form-sub {
        font-size:14px;
        font-weight:300;
        font-style:italic;
        color:var(--cream-dim);
        margin-bottom:24px;
        line-height:1.6
      }
      .form-sub a {
        color:var(--gold);
        text-decoration:underline;
        text-underline-offset:3px
      }
      .form-stack {
        display:flex;
        flex-direction:column;
        gap:16px
      }
      .form-group {
        display:flex;
        flex-direction:column;
        gap:6px
      }
      label {
        font-family:'Josefin Sans',sans-serif;
        font-size:11px;
        letter-spacing:.35em;
        text-transform:uppercase;
        color:var(--gold-dim)
      }
      input,textarea {
        background:rgba(10,9,7,.5);
        border:1px solid rgba(201,169,110,.25);
        color:var(--cream);
        font-family:'Cormorant Garamond',serif;
        font-size:15px;
        padding:12px 16px;
        width:100%;
        transition:border-color .3s;
        outline:none
      }
      input:focus,textarea:focus {
        border-color:var(--gold)
      }
      textarea {
        resize:vertical;
        min-height:100px
      }
      .btn-gold {
        font-family:'Josefin Sans',sans-serif;
        font-size:11px;
        font-weight:300;
        letter-spacing:.3em;
        text-transform:uppercase;
        color:var(--black);
        background:var(--gold);
        padding:16px 40px;
        border:none;
        cursor:pointer;
        transition:background .3s;
        display:inline-block
      }
      .btn-gold:hover {
        background:var(--cream)
      }
      /* FOOTER */
      footer {
        border-top:1px solid rgba(201,169,110,.15);
        padding:36px clamp(32px,6vw,80px);
        display:flex;
        align-items:center;
        justify-content:space-between;
        gap:24px;
        flex-wrap:wrap
      }
      .footer-logo img {
        height:44px;
        width:auto
      }
      .footer-middle {
        font-family:'Josefin Sans',sans-serif;
        font-size:10px;
        font-weight:100;
        letter-spacing:.3em;
        text-transform:uppercase;
        color:var(--cream-dim);
        text-align:center
      }
      .footer-links {
        display:flex;
        gap:24px
      }
      .footer-links a {
        font-family:'Josefin Sans',sans-serif;
        font-size:10px;
        font-weight:100;
        letter-spacing:.3em;
        text-transform:uppercase;
        color:var(--gold-dim);
        text-decoration:none;
        transition:color .2s
      }
      .footer-links a:hover {
        color:var(--gold)
      }
      @keyframes fadeUp {
        from {
          opacity:0;
          transform:translateY(30px)
        }
        to {
          opacity:1;
          transform:translateY(0)
        }
      }
      @media(max-width:760px) {
        .nav-links {
          display:none
        }
        .nav-burger {
          display:flex
        }
        .contact-grid {
          grid-template-columns:1fr
        }
        footer {
          flex-direction:column;
          align-items:center;
          text-align:center
        }
        .hero {
          height:auto;
          min-height:100vh;
          margin-bottom:0
        }
        .hero-content {
          position:relative;
          bottom:auto;
          padding:100px clamp(24px,5vw,48px) 60px
        }
        .hero-bg::after {
          background:rgba(10,9,7,.82)
        }
      }