:root {
      --bg: #f7f7f3;
      --bg-soft: #fbfbf9;
      --text: #1f232a;
      --muted: #41464d;
      --gold: #c4a05f;
      --line: rgba(196, 160, 95, .62);
      --max: 1180px;
    }

    * { box-sizing: border-box; }
    html, body { min-height: 100%; }

    body {
      margin: 0;
      min-height: 100svh;
      background:
        radial-gradient(circle at 50% 22%, rgba(0,0,0,.03), transparent 36%),
        linear-gradient(180deg, #fbfbf9 0%, #f6f6f2 100%);
      color: var(--text);
      font-family: "Montserrat", ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
      overflow-x: hidden;
    }

    .page {
      min-height: 100svh;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 36px 24px;
    }

    .hero {
      width: min(100%, 900px);
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 4vh 0;
    }

    .brand-logo {
      width: min(460px, 74vw);
      height: auto;
      display: block;
      margin: 0 auto 44px;
    }

    h1 {
      margin: 0;
      font-size: clamp(38px, 5vw, 74px);
      line-height: 1.04;
      font-family: "Cormorant Garamond", Georgia, serif;
      font-weight: 300;
      letter-spacing: .14em;
      text-transform: uppercase;
      color: #1e2430;
    }

    .rule {
      width: 58px;
      height: 2px;
      background: var(--gold);
      margin: 26px 0 28px;
      border-radius: 999px;
    }

    .lead {
      margin: 0;
      max-width: 760px;
      color: var(--muted);
      font-size: clamp(16px, 1.35vw, 20px);
      line-height: 1.65;
      font-weight: 300;
      letter-spacing: .01em;
    }

    .contact-title {
      display: none;
    }

    .contact-grid {
      width: min(760px, 100%);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px;
      margin-top: 48px;
      padding-top: 26px;
      border-top: 1px solid var(--line);
    }

    .contact-item {
      min-width: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      color: var(--muted);
      font-size: clamp(15px, 1.2vw, 18px);
      line-height: 1.45;
      text-align: center;
      padding: 0;
      font-weight: 300;
    }

    .contact-item + .contact-item {
      border: 0;
    }

    .icon {
      flex: 0 0 auto;
      width: 20px;
      height: 20px;
      color: var(--gold);
    }

    a {
      color: inherit;
      text-decoration: none;
      transition: opacity .2s ease, color .2s ease;
      overflow-wrap: anywhere;
    }

    a:hover,
    a:focus-visible {
      color: #14181f;
      opacity: .88;
    }

    footer {
      display: none;
    }

    @media (max-width: 900px) {
      .page { padding: 32px 22px; }
      .brand-logo { width: min(430px, 80vw); margin-bottom: 36px; }
      .contact-grid { margin-top: 40px; }
    }

    @media (max-width: 640px) {
      .page { padding: 26px 18px; }
      .hero { width: 100%; }
      .brand-logo { width: min(340px, 86vw); margin-bottom: 30px; }
      h1 {
        font-size: clamp(26px, 9vw, 40px);
        letter-spacing: .11em;
      }
      .rule { margin: 20px 0 22px; }
      .lead {
        font-size: 15px;
        line-height: 1.6;
        max-width: 92%;
      }
      .contact-grid {
        gap: 14px;
        margin-top: 34px;
        padding-top: 22px;
      }
      .contact-item {
        font-size: 15px;
        flex-wrap: wrap;
        gap: 8px;
      }
    }

    @media (prefers-reduced-motion: no-preference) {
      .hero { animation: fadeIn .7s ease both; }
      @keyframes fadeIn {
        from { opacity: 0; transform: translateY(8px); }
        to { opacity: 1; transform: translateY(0); }
      }
    }
