:root{
    --black: #0a0b0a;
    --charcoal: #12140f;
    --gold: #a9835a;
    --gold-soft: #cba97c;
    --cream: #f1e9da;
    --cream-dim: rgba(241,233,218,0.6);
    --hairline: rgba(203,169,124,0.35);
  }

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

  html,body{
    height:100%;
    width:100%;
    overflow:hidden;
    background:var(--black);
    font-family:'Jost', sans-serif;
  }

  body{
    position:relative;
    color:var(--cream);
  }

  /* ---------- Background Slider ---------- */
  .bg-slider{
    position:fixed;
    inset:0;
    z-index:0;
  }

  .bg-slide{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center 20%;
    opacity:0;
    animation: slideFade 24s infinite;
    filter:saturate(0.92) contrast(1.05);
    transform:scale(1.08);
  }

  .bg-slide::after{
    content:'';
    position:absolute;
    inset:0;
    background:
      radial-gradient(ellipse at 50% 40%, rgba(10,11,10,0.35) 0%, rgba(10,11,10,0.72) 68%, rgba(10,11,10,0.92) 100%),
      linear-gradient(180deg, rgba(10,11,10,0.75) 0%, rgba(10,11,10,0.35) 30%, rgba(10,11,10,0.55) 70%, rgba(10,11,10,0.95) 100%);
  }

  .bg-slide.s1{ background-image:url(../images/slide-1.png); animation-delay:0s; }
  .bg-slide.s2{ background-image:url(../images/slide-2.png); animation-delay:6s; }
  .bg-slide.s3{ background-image:url(../images/slide-4.png); animation-delay:12s; }
  .bg-slide.s4{ background-image:url(../images/slide-3.png); animation-delay:18s; }

  @keyframes slideFade{
    0%      { opacity:0; transform:scale(1.08); }
    3%      { opacity:1; }
    22%     { opacity:1; transform:scale(1.16); }
    26%     { opacity:0; transform:scale(1.18); }
    100%    { opacity:0; }
  }

  @keyframes slowZoom{
    0%   { transform:scale(1.05); }
    100% { transform:scale(1.18); }
  }

  /* subtle film-grain shimmer */
  .grain{
    position:fixed;
    inset:0;
    z-index:1;
    pointer-events:none;
    opacity:0.05;
    mix-blend-mode:overlay;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    animation:grainShift 1.4s steps(4) infinite;
  }
  @keyframes grainShift{
    0%,100%{ transform:translate(0,0); }
    25%{ transform:translate(-1%,1%); }
    50%{ transform:translate(1%,-1%); }
    75%{ transform:translate(-1%,-1%); }
  }

  /* ---------- Vignette border frame ---------- */
  .frame{
    position:fixed;
    inset:14px;
    z-index:2;
    border:1px solid var(--hairline);
    pointer-events:none;
    opacity:0;
    animation: frameIn 1.6s ease-out 0.3s forwards;
  }
  @keyframes frameIn{
    from{ opacity:0; inset:28px; }
    to{ opacity:1; inset:14px; }
  }

  .corner{
    position:fixed;
    width:18px; height:18px;
    z-index:3;
    opacity:0;
    animation: frameIn 1.6s ease-out 0.5s forwards;
    pointer-events:none;
  }
  .corner::before, .corner::after{
    content:'';
    position:absolute;
    background:var(--gold-soft);
  }
  .corner.tl{ top:14px; left:14px; }
  .corner.tr{ top:14px; right:14px; }
  .corner.bl{ bottom:14px; left:14px; }
  .corner.br{ bottom:14px; right:14px; }
  .corner.tl::before,.corner.bl::before{ width:1px; height:18px; left:0; top:0; }
  .corner.tl::after,.corner.tr::after{ width:18px; height:1px; left:0; top:0; }
  .corner.tr::before,.corner.br::before{ width:1px; height:18px; right:0; top:0; }
  .corner.bl::after,.corner.br::after{ width:18px; height:1px; left:0; bottom:0; }
  .corner.tr::before{ left:auto; right:0; }
  .corner.bl::before{ left:0; }
  .corner.br::before{ left:auto; right:0; }

  /* ---------- Main Content ---------- */
  .stage{
    position:relative;
    z-index:4;
    height:100vh;
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:space-between;
    padding: clamp(20px, 4vh, 48px) clamp(16px, 5vw, 64px);
    text-align:center;
  }

  /* Logo */
  .logo-wrap{
    display:flex;
    justify-content:center;
    opacity:0;
    animation: dropIn 1.1s cubic-bezier(.19,1,.22,1) 0.25s forwards;
  }
  .logo-wrap img{
    width: clamp(120px, 15vw, 190px);
    height:auto;
    filter: drop-shadow(0 0 22px rgba(169,131,90,0.25));
    animation: logoGlow 5s ease-in-out infinite 1.4s;
  }
  @keyframes dropIn{
    from{ opacity:0; transform:translateY(-24px) scale(0.94); }
    to{ opacity:1; transform:translateY(0) scale(1); }
  }
  @keyframes logoGlow{
    0%,100%{ filter: drop-shadow(0 0 16px rgba(169,131,90,0.22)); }
    50%{ filter: drop-shadow(0 0 30px rgba(203,169,124,0.4)); }
  }

  /* Center block */
  .center-block{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap: clamp(14px, 2.4vh, 26px);
    max-width:820px;
  }

  .eyebrow-mark{
    display:flex;
    align-items:center;
    gap:14px;
    opacity:0;
    animation: fadeUp 1s ease-out 0.9s forwards;
  }
  .eyebrow-mark .line{
    width:34px; height:1px;
    background:linear-gradient(90deg, transparent, var(--gold-soft));
  }
  .eyebrow-mark .line.right{
    background:linear-gradient(90deg, var(--gold-soft), transparent);
  }
  .eyebrow-mark .diamond{
    width:7px; height:7px;
    background:var(--gold-soft);
    transform:rotate(45deg);
    animation: spin 8s linear infinite;
  }
  @keyframes spin{
    from{ transform:rotate(45deg); }
    to{ transform:rotate(405deg); }
  }
  .eyebrow-mark span.txt{
    font-family:'Jost', sans-serif;
    font-size:12px;
    letter-spacing:0.32em;
    color:var(--gold-soft);
    font-weight:500;
    white-space:nowrap;
  }

  h1.headline{
    font-family:'Fraunces', serif;
    font-weight:400;
    font-style:normal;
    line-height:1.04;
    font-size: clamp(2.6rem, 8vw, 6.2rem);
    color:var(--cream);
    letter-spacing:-0.01em;
  }
  h1.headline .row{
    display:block;
    overflow:hidden;
  }
  h1.headline .row span{
    display:inline-block;
    transform:translateY(105%);
    opacity:0;
    animation: riseIn 1.1s cubic-bezier(.19,1,.22,1) forwards;
  }
  h1.headline .row:nth-child(1) span{ animation-delay:0.55s; }
  h1.headline .row:nth-child(2) span{ animation-delay:0.72s; color:var(--gold-soft); font-style:italic; font-weight:300; }
  @keyframes riseIn{
    to{ transform:translateY(0); opacity:1; }
  }

  p.subline{
    font-family:'Jost', sans-serif;
    font-weight:300;
    font-size: clamp(0.92rem, 1.6vw, 1.15rem);
    letter-spacing:0.02em;
    color:var(--cream-dim);
    line-height:1.65;
    max-width:480px;
    opacity:0;
    animation: fadeUp 1s ease-out 1.15s forwards;
  }

  @keyframes fadeUp{
    from{ opacity:0; transform:translateY(14px); }
    to{ opacity:1; transform:translateY(0); }
  }

  /* Notify form */
  .notify{
    display:flex;
    gap:0;
    margin-top:6px;
    opacity:0;
    animation: fadeUp 1s ease-out 1.35s forwards;
    border:1px solid var(--hairline);
    background:rgba(20,20,16,0.35);
    backdrop-filter: blur(6px);
    transition: border-color .4s ease, box-shadow .4s ease;
  }
  .notify:hover{
    border-color:var(--gold-soft);
    box-shadow:0 0 24px rgba(169,131,90,0.18);
  }
  .notify input{
    background:transparent;
    border:none;
    outline:none;
    padding: 15px 18px;
    font-family:'Jost', sans-serif;
    font-size:0.88rem;
    letter-spacing:0.02em;
    color:var(--cream);
    width: clamp(180px, 24vw, 260px);
  }
  .notify input::placeholder{ color:rgba(241,233,218,0.42); }
  .notify button{
    background:var(--gold);
    border:none;
    color:var(--black);
    font-family:'Jost', sans-serif;
    font-weight:500;
    font-size:0.78rem;
    letter-spacing:0.18em;
    padding: 0 26px;
    cursor:pointer;
    white-space:nowrap;
    transition: background .35s ease, letter-spacing .35s ease;
    position:relative;
    overflow:hidden;
  }
  .notify button:hover{
    background:var(--gold-soft);
    letter-spacing:0.24em;
  }
  .notify button:active{ transform:scale(0.98); }

  .notify-msg{
    font-size:0.76rem;
    letter-spacing:0.08em;
    color:var(--gold-soft);
    opacity:0;
    height:0;
    transition:opacity .4s ease;
  }
  .notify-msg.show{ opacity:1; margin-top:10px; }

  /* Footer */
  footer{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    opacity:0;
    animation: fadeUp 1.1s ease-out 1.5s forwards;
  }
  footer .socials{
    display:flex;
    gap:22px;
    margin-bottom:4px;
  }
  footer .socials a{
    color:var(--cream-dim);
    font-family:'Jost', sans-serif;
    font-size:11px;
    letter-spacing:0.18em;
    text-decoration:none;
    position:relative;
    transition:color .3s ease;
  }
  footer .socials a::after{
    content:'';
    position:absolute;
    left:0; bottom:-5px;
    width:0%; height:1px;
    background:var(--gold-soft);
    transition:width .35s ease;
  }
  footer .socials a:hover{ color:var(--cream); }
  footer .socials a:hover::after{ width:100%; }

  address{
    font-style:normal;
    font-family:'Jost', sans-serif;
    font-size:12px;
    letter-spacing:0.08em;
    color:var(--cream-dim);
    line-height:1.7;
  }
  address b{
    display:block;
    color:var(--gold-soft);
    font-weight:500;
    letter-spacing:0.22em;
    font-size:10px;
    margin-bottom:6px;
  }

  /* Responsive tuning */
  @media (max-width:640px){
    .stage{ padding: 22px 18px; justify-content:space-between; gap:10px; }
    .eyebrow-mark span.txt{ font-size:10px; letter-spacing:0.24em; }
    .eyebrow-mark .line{ width:22px; }
    p.subline{ font-size:0.86rem; }
    .notify{ flex-direction:column; width:100%; max-width:300px; }
    .notify input{ width:100%; text-align:center; padding:13px 16px; }
    .notify button{ padding:13px 0; letter-spacing:0.16em; }
    footer .socials{ gap:16px; }
    address{ font-size:10.5px; }
  }

  @media (max-height:620px){
    .logo-wrap img{ width:96px; }
    h1.headline{ font-size: clamp(2rem, 7vw, 3.4rem); }
    p.subline{ display:none; }
    .center-block{ gap:10px; }
  }

  @media (prefers-reduced-motion: reduce){
    *, *::before, *::after{
      animation-duration:0.01ms !important;
      animation-iteration-count:1 !important;
      transition-duration:0.01ms !important;
    }
  }