@import url('https://fonts.googleapis.com/css2?family=Great+Vibes&family=Cormorant+Garamond:ital,wght@0,400;0,500;0,600;1,400&family=Josefin+Sans:wght@300;400&display=swap');

  .f2h{
    --gold:#d4a845; --gold-light:#f5d98b; --gold-dark:#9c7425;
    --bg:#000; --card:#0b0905; --text:#e9dcc0; --muted:#a8987a;
    background:var(--bg); color:var(--text);
    font-family:'Cormorant Garamond',Georgia,serif; position:relative; overflow:hidden;
  }
  .f2h *{box-sizing:border-box;margin:0;padding:0}
  .f2h-wrap{max-width:1080px;margin:0 auto;padding:0 16px;position:relative}

  .f2h-r{opacity:0;transform:translateY(28px);transition:opacity .9s ease,transform .9s ease}
  .f2h-r.f2h-in{opacity:1;transform:none}

  .f2h-gold{
    background:linear-gradient(100deg,var(--gold-dark),var(--gold) 30%,var(--gold-light) 50%,var(--gold) 70%,var(--gold-dark));
    background-size:220% auto;-webkit-background-clip:text;background-clip:text;color:transparent;
    animation:f2hShine 6s linear infinite;
  }
  .f2h-script{font-family:'Great Vibes',cursive;font-weight:400}
  .f2h-caps{font-family:'Josefin Sans',sans-serif;font-weight:300;text-transform:uppercase;color:var(--gold)}

  /* ---------- HERO ---------- */
  .f2h-hero{
    min-height:92vh;display:flex;align-items:center;justify-content:center;text-align:center;
    padding:90px 0 70px;position:relative;
  }
  .f2h-hero::before{
    content:"";position:absolute;inset:0;pointer-events:none;
    background:radial-gradient(ellipse at 50% 40%,rgba(212,168,69,.16),transparent 60%);
  }
  .f2h-orbit{
    position:absolute;left:50%;top:50%;width:min(680px,94vw);aspect-ratio:1/1;transform:translate(-50%,-50%);
    pointer-events:none;
  }
  .f2h-orbit circle.f2h-o1{stroke-dasharray:1500;stroke-dashoffset:1500;animation:f2hDraw 3s ease forwards}
  .f2h-orbit g{transform-origin:50% 50%;animation:f2hSpin 50s linear infinite}
  .f2h-spark{position:absolute;width:3px;height:3px;border-radius:50%;background:var(--gold-light);
    box-shadow:0 0 8px var(--gold);opacity:0;animation:f2hTwinkle 4s ease-in-out infinite}
  .f2h-hero-in{position:relative}
  .f2h-welcome{letter-spacing:.5em;font-size:clamp(11px,2.2vw,14px)}
  .f2h-name{font-size:clamp(76px,15vw,160px);line-height:1;margin:14px 0 6px}
  .f2h-slogan{letter-spacing:.3em;font-size:clamp(11px,2.4vw,16px)}
  .f2h-divider{display:flex;align-items:center;justify-content:center;gap:12px;margin:28px auto;max-width:380px}
  .f2h-divider span{flex:1;height:1px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
  .f2h-divider i{width:9px;height:9px;background:var(--gold);transform:rotate(45deg);display:block;animation:f2hPulse 2.6s ease-in-out infinite}
  .f2h-intro{font-size:clamp(19px,2.8vw,23px);line-height:1.6;max-width:640px;margin:0 auto}
  .f2h-btns{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:36px}
  .f2h-btn{
    font-family:'Josefin Sans',sans-serif;font-size:13px;letter-spacing:.24em;text-transform:uppercase;
    text-decoration:none;padding:15px 30px;border:1px solid var(--gold);color:var(--gold);
    position:relative;overflow:hidden;transition:color .4s;display:inline-flex;align-items:center;gap:10px;
  }
  .f2h-btn svg{width:16px;height:16px}
  .f2h-btn::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,var(--gold),var(--gold-light));
    transform:scaleX(0);transform-origin:left;transition:transform .45s ease;z-index:-1}
  .f2h-btn:hover{color:#000}
  .f2h-btn:hover::before{transform:scaleX(1)}
  .f2h-btn.f2h-solid{background:linear-gradient(90deg,var(--gold),var(--gold-light));color:#000}
  .f2h-btn.f2h-solid:hover{box-shadow:0 0 28px rgba(212,168,69,.5)}
  .f2h-scroll{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);width:1px;height:50px;
    background:linear-gradient(var(--gold),transparent);animation:f2hScroll 2s ease-in-out infinite}

  /* ---------- Sections ---------- */
  .f2h-sec{padding:80px 0}
  .f2h-h3{text-align:center;letter-spacing:.36em;font-size:clamp(18px,3.4vw,26px);color:var(--gold-light)}
  .f2h-line{width:180px;height:1px;margin:14px auto 28px;background:linear-gradient(90deg,transparent,var(--gold),transparent)}
  .f2h-lead{text-align:center;font-size:20px;line-height:1.65;max-width:760px;margin:0 auto 18px}
  .f2h-lead strong{color:var(--gold-light);font-weight:600}

  /* ---------- Day timeline ---------- */
  .f2h-day{position:relative;max-width:900px;margin:40px auto 0}
  .f2h-arc{width:100%;height:auto;display:block}
  .f2h-arc .f2h-path{stroke-dasharray:1100;stroke-dashoffset:1100;transition:stroke-dashoffset 2.6s ease}
  .f2h-day.f2h-in .f2h-path{stroke-dashoffset:0}
  .f2h-sun{offset-path:path("M40 190 Q450 -60 860 190");offset-rotate:0deg;animation:f2hTravel 12s ease-in-out infinite}
  .f2h-steps{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:-10px}
  .f2h-step{text-align:center;padding:0 8px}
  .f2h-step svg{width:46px;height:46px;margin-bottom:10px}
  .f2h-step b{display:block;font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:12px;letter-spacing:.24em;text-transform:uppercase;color:var(--gold);margin-bottom:6px}
  .f2h-step p{font-size:18px;line-height:1.5;color:var(--text)}

  /* ---------- Menu strip ---------- */
  .f2h-strip{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;max-width:860px;margin:26px auto 0}
  .f2h-strip span{
    font-family:'Josefin Sans',sans-serif;font-size:12px;letter-spacing:.18em;text-transform:uppercase;
    padding:10px 16px;border:1px solid rgba(212,168,69,.3);color:var(--gold);transition:.35s;
  }
  .f2h-strip span:hover{background:var(--gold);color:#000}

  /* ---------- Come for ---------- */
  .f2h-come{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:18px;margin-top:10px}
  .f2h-card{
    padding:28px 20px;text-align:center;border:1px solid rgba(212,168,69,.18);position:relative;
    background:linear-gradient(160deg,#110d06,var(--card) 60%);transition:border-color .4s,box-shadow .4s,transform .4s;
  }
  .f2h-card svg{width:46px;height:46px;margin-bottom:14px;transition:transform .5s}
  .f2h-card p{font-size:19px;line-height:1.4}
  .f2h-card::before,.f2h-card::after{content:"";position:absolute;width:14px;height:14px;border:1px solid var(--gold);transition:.4s}
  .f2h-card::before{top:-1px;left:-1px;border-right:0;border-bottom:0}
  .f2h-card::after{bottom:-1px;right:-1px;border-left:0;border-top:0}
  .f2h-card:hover{border-color:rgba(212,168,69,.55);box-shadow:0 0 30px rgba(212,168,69,.13)}
  .f2h-card:hover svg{transform:translateY(-4px) scale(1.08)}
  .f2h-card:hover::before,.f2h-card:hover::after{width:30px;height:30px}

  /* ---------- Seats ---------- */
  .f2h-seats{display:flex;align-items:center;justify-content:center;gap:34px;flex-wrap:wrap;
    max-width:820px;margin:0 auto;padding:44px 26px;border-top:1px solid rgba(212,168,69,.3);border-bottom:1px solid rgba(212,168,69,.3)}
  .f2h-big{font-size:clamp(90px,16vw,140px);font-weight:600;line-height:.9}
  .f2h-seats-txt{max-width:420px}
  .f2h-seats-txt b{display:block;letter-spacing:.3em;font-size:13px;margin-bottom:10px}
  .f2h-seats-txt p{font-size:20px;line-height:1.55}

  /* ---------- Pillars ---------- */
  .f2h-pillars{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
  .f2h-pillar{text-align:center;padding:10px}
  .f2h-pillar .f2h-ico{width:96px;height:96px;margin:0 auto 18px;border:1px solid rgba(212,168,69,.35);border-radius:50%;
    display:flex;align-items:center;justify-content:center;position:relative}
  .f2h-pillar .f2h-ico::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px dashed rgba(212,168,69,.3);animation:f2hSpin 22s linear infinite}
  .f2h-pillar svg{width:46px;height:46px}
  .f2h-pillar h4{font-size:30px;font-style:italic;font-weight:600;color:var(--gold);margin-bottom:8px}
  .f2h-pillar p{font-size:18px;line-height:1.5}
  .f2h-bubble{animation:f2hBubble 2.6s ease-in infinite}

  /* ---------- Closing ---------- */
  .f2h-close{text-align:center;padding:40px 0 100px}
  .f2h-close .f2h-name{font-size:clamp(56px,10vw,100px)}
  .f2h-lines{display:flex;justify-content:center;gap:10px;height:70px;margin-top:26px}
  .f2h-lines i{width:1px;background:var(--gold);display:block;transform-origin:top;animation:f2hGrow 2.4s ease-in-out infinite alternate}
  .f2h-lines i:nth-child(1),.f2h-lines i:nth-child(5){height:60%}
  .f2h-lines i:nth-child(2),.f2h-lines i:nth-child(4){height:80%;animation-delay:.3s}
  .f2h-lines i:nth-child(3){height:100%;animation-delay:.6s}

  @keyframes f2hShine{to{background-position:220% center}}
  @keyframes f2hDraw{to{stroke-dashoffset:0}}
  @keyframes f2hSpin{to{transform:rotate(360deg)}}
  @keyframes f2hPulse{50%{box-shadow:0 0 14px var(--gold);opacity:.6}}
  @keyframes f2hTwinkle{0%,100%{opacity:0;transform:scale(.5)}50%{opacity:1;transform:scale(1.4)}}
  @keyframes f2hScroll{0%{transform:translateX(-50%) scaleY(0);transform-origin:top}50%{transform:translateX(-50%) scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:translateX(-50%) scaleY(0);transform-origin:bottom}}
  @keyframes f2hTravel{0%{offset-distance:0%}50%{offset-distance:100%}100%{offset-distance:0%}}
  @keyframes f2hBubble{0%{transform:translateY(0);opacity:0}30%{opacity:1}100%{transform:translateY(-12px);opacity:0}}
  @keyframes f2hGrow{from{transform:scaleY(.55)}to{transform:scaleY(1)}}

  @media (max-width:760px){
    .f2h-steps,.f2h-pillars{grid-template-columns:1fr;gap:34px}
    .f2h-sec{padding:60px 0}
    .f2h-lead{font-size:18px}
    .f2h-seats{text-align:center;gap:16px}
  }
  @media (prefers-reduced-motion:reduce){
    .f2h *{animation:none!important;transition:none!important}
    .f2h-r{opacity:1;transform:none}
    .f2h-arc .f2h-path,.f2h-orbit circle.f2h-o1{stroke-dashoffset:0}
  }
.f2h-card.f2h-wide { grid-column: 1 / -1; max-width: 520px; width: 100%; justify-self: center; }
@media (min-width: 600px) {
  .f2h-card.f2h-wide { grid-column: span 2; max-width: none; justify-self: stretch; }
}