:root{
    --maxw:1440px;
    --ink:#120622; --plum:#2E0F48; --magenta:#7A1E5E; --ember:#D9522A; --amber:#F6A623; --gold:#FFD65A; --cream:#FFF3DC;
    --sun:#FFC72C; --sunpale:#FFDA8A; --card:#A86A0A; --cocoa:#3B1A0F; --rust:#8C2C1E; --white:#fff;
    --pad: clamp(20px, 5.5vw, 80px);
    color-scheme: dark;
    box-sizing:border-box; padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
  }
  @media (prefers-color-scheme: dark){ :root:not([data-theme="light"]){ color-scheme: dark; } }
  :root[data-theme="dark"]{ color-scheme: dark; }
  html{ scroll-padding-top: env(safe-area-inset-top,0px); }
  *{box-sizing:border-box;margin:0;padding:0}
  html,body{color:var(--white);font-family:"Figtree",system-ui,-apple-system,"Segoe UI",sans-serif;-webkit-font-smoothing:antialiased}
  html{background:var(--ink)}
  body{position:relative;background:var(--ink) linear-gradient(180deg,#120622 0%,#2E0F48 17%,#7A1E5E 33%,#D9522A 50%,#F6A623 64%,#FFD65A 80%,#FFF3DC 100%) center top / 100% 250vh no-repeat}
  body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--ink)}

  /* ---------- background layers (sun), scroll slower than content ---------- */
  .sun{position:fixed;left:50%;top:0;z-index:0;pointer-events:none;will-change:transform,filter,opacity;transform:translate(-50%,-50%);}
  .sun__halo,.sun__disc{position:absolute;left:50%;top:50%;border-radius:50%;transform:translate(-50%,-50%)}
  .sun__halo{background:radial-gradient(circle, rgb(255 154 61) 0%, rgb(255 154 61) 40%, rgb(255 154 61 / 6%) 70%)}
  .sun__disc{background:#FFD24A}

  /* ---------- header ---------- */
  .hdr{position:fixed;left:0;right:0;top:0;z-index:20;height:calc(96px + env(safe-area-inset-top,0px));padding-top:env(safe-area-inset-top,0px)}
  .hdr__blur{position:absolute;inset:0;pointer-events:none;
    background:linear-gradient(180deg,rgba(18,6,34,.55),rgba(18,6,34,0));
    backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);
    -webkit-mask-image:linear-gradient(180deg,#000 0%,#000 35%,transparent 100%);mask-image:linear-gradient(180deg,#000 0%,#000 35%,transparent 100%)}
  .hdr__row{position:relative;height:96px;display:flex;align-items:center;justify-content:space-between;padding:0 var(--pad);max-width:var(--maxw);margin:0 auto}
  .logo{font-family:"Pacifico",cursive;font-size:26px;line-height:1;color:var(--white);text-decoration:none;letter-spacing:-.5px}
  .hdr__right{display:flex;align-items:center;gap:28px}
  .lock{position:relative;font-weight:700;font-size:26px;letter-spacing:.04em;line-height:1;white-space:nowrap;opacity:0;transform:translateY(6px);transition:opacity .35s ease,transform .35s ease;pointer-events:none}
  .lock.is-on{opacity:1;transform:none}
  .lock span{display:inline-block;position:relative;color:transparent;-webkit-text-stroke:1.3px var(--white)}
  .lock span i{position:absolute;inset:0;font-style:normal;color:var(--white);-webkit-text-stroke:0}
  .lock .m i{clip-path:inset(0 0 var(--drain,0%) 0)}
  .lock .s i{clip-path:inset(var(--rise,100%) 0 0 0)}

  /* ---------- buttons / bits ---------- */
  .btn{display:inline-flex;align-items:center;gap:10px;border-radius:999px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;text-decoration:none;cursor:pointer;border:0;color:var(--plum);background:var(--sun);white-space:nowrap}
  .btn svg{width:1em;height:1em}
  .btn--sm{height:44px;padding:0 22px;font-size:13px}
  .btn--lg{height:72px;padding:0 40px;font-size:18px}
  .btn--rust{color:#F6F6F6;background:#210142}
  .btn:focus-visible{outline:3px solid var(--white);outline-offset:3px}
  .pill{display:inline-flex;align-items:center;padding:6px 14px;border:1.5px dashed currentColor;border-radius:999px;font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
  .eyebrow{display:flex;align-items:center;gap:14px;font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase}
  .eyebrow::after{content:"";width:56px;height:2px;background:currentColor}
  .venue .eyebrow,.rsvp .eyebrow{justify-content:center}
  .details{display:flex;flex-wrap:wrap;align-items:center;gap:12px 18px;font-size:13px;font-weight:700;letter-spacing:.12em;text-transform:uppercase}
  .details .dot{width:4px;height:4px;border-radius:50%;background:currentColor;opacity:.6}

  /* ---------- sections: each fills one viewport ---------- */
  main{position:relative;z-index:1;overflow-x:clip}
  section{min-height:100vh;min-height:100svh;display:flex;flex-direction:column;justify-content:center;padding:calc(96px + env(safe-area-inset-top,0px)) var(--pad) 48px;position:relative;max-width:var(--maxw);margin:0 auto}

  /* hero */
  .hero{display:grid;grid-template-rows:1fr auto 1fr;grid-template-columns:100%}
  .hero__top{grid-row:2;margin:0;padding:0}
  .hero__bottom{display:none}
  .hero__note{font-size:13px;opacity:.65}

  .cmark{position:absolute;right:-22rem;top:4rem;opacity:.07;pointer-events:none;user-select:none;z-index:0}
  .hero__top,.hero__bottom{position:relative;z-index:1}
  .hero__top{display:grid;grid-template-columns:1fr;row-gap:36px}
  .hero__top .hero__row{margin-top:-12px}
  .hero__row{display:grid;grid-template-columns:1fr 460px;column-gap:64px;align-items:stretch}
  .hero__event{display:flex;flex-direction:column;gap:14px}
  .hero__event .tagline{font-size:inherit;font-weight:inherit;opacity:.7}
  .card__line{font-size:17px;line-height:1.55;font-weight:500}
  .hero__event>.eyebrow{color:var(--sun)}
  .hero__event h2{font-size:34px;line-height:1.15;font-weight:600;margin:0}
  .hero__rule{height:1px;background:linear-gradient(90deg,rgba(255,79,163,.9),rgba(246,124,10,.9) 40%,rgba(255,199,44,.9) 78%,rgba(255,199,44,0))}
  .hero__right{display:flex;flex-direction:column;gap:16px}
  .hero__right .countdown{flex:1}
  .hero__right .countdown div{display:flex;flex-direction:column;justify-content:center}
  .hero__right .btn--lg{width:100%;justify-content:center}
  .card .chips{margin-top:0}
  .lockup .l0{display:block;font-size:.38em;letter-spacing:.02em;margin-bottom:.12em}
  .lockup{white-space:nowrap}
  .lockup .l1,.lockup .l2{display:inline}
  .lockup .l2{margin-left:.18em}
  .card .details{gap:12px 18px}
  .hero__row .card{display:flex;flex-direction:column;justify-content:center}
  .hero__top .hero__sub{margin-top:24px}
  .hero__top .countdown{margin-top:0}
  .hero__top .countdown div{display:flex;flex-direction:column;justify-content:center}
  .hero__eyebrow{color:var(--sun);margin-bottom:28px}
  .lockup{font-weight:900;font-size:clamp(48px,10.9vw,156px);line-height:1;letter-spacing:-.01em}
  .lockup .l2{color:transparent;-webkit-text-stroke:3px var(--white)}
  .lockup .l1{display:inline}
  .lockup-wrap{width:fit-content}
  .event{display:flex;flex-direction:column;gap:16px}
  .card>*+*{margin-top:16px}
  .card h2{margin-top:22px!important}
  .card .chips{margin-top:22px!important}
  .card{position:relative;background:rgba(0,0,0,.4);border-radius:24px;padding:26px 28px;overflow:hidden;backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
  .card::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#FF4FA3,#F67C0A 50%,#FFC72C);box-shadow:0 0 14px rgba(246,124,10,.6)}
  .event h2,.card h2{font-size:32px;line-height:1.18;margin:0;font-weight:600}
  .card p{font-size:16px;line-height:1.6;opacity:.85}
  .card .chips{margin-top:0}
  .event p{font-size:16px;line-height:1.6;opacity:.85;max-width:40ch}
  .chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:16px;color:var(--sun)}
  .hero__cta{display:flex;flex-direction:column;gap:22px;align-items:flex-start}
  .hero__sub{display:flex;flex-direction:column;gap:16px;margin-top:40px}
  .event .countdown{margin-top:16px}
  .tagline{font-size:clamp(24px,2.5vw,36px);font-weight:600}
  .countdown{display:flex;gap:14px}
  .countdown div{flex:1;padding:14px 0 12px;border-radius:14px;background:rgba(18,6,32,.45);text-align:center}
  .countdown b{display:block;font-size:40px;line-height:1.1;font-weight:900}
  .countdown small{display:block;font-size:11px;font-weight:700;letter-spacing:.14em;opacity:.75}
  .countdown div:last-child b{color:var(--sun)}

  /* venue */
  .venue{align-items:center;text-align:center}
  .venue h2{font-size:clamp(48px,9.2vw,132px);line-height:.98;margin:18px 0 10px;font-weight:900}
  .venue .sub{font-size:22px;font-weight:600;margin-bottom:36px}
  .bento{display:grid;grid-template-columns:760fr 480fr;grid-template-rows:auto;gap:16px 24px;width:min(100%,1280px);text-align:left}
  .bento img{display:block;width:100%;height:100%;object-fit:cover;border-radius:20px;box-shadow:0 24px 48px rgba(26,5,13,.35)}
  .bento .big{grid-row:1/3;aspect-ratio:760/500}
  .bento .small{aspect-ratio:480/300}
  .vcard{background:rgba(179,62,63,.4);border-radius:20px;padding:18px 20px;display:flex;flex-direction:column;justify-content:center;gap:10px;font-size:15px;line-height:1.5}
  .vcard .pill{align-self:flex-start}

  /* rsvp */
  .rsvp{align-items:center;text-align:center;color:#290152}
  .rsvp>*{position:relative;top:20px}
  .rsvp .eyebrow{color:#290152}
  .rsvp h2{font-size:clamp(40px,9.6vw,150px);line-height:.93;margin:28px 0 24px;font-weight:900;white-space:nowrap;background:linear-gradient(90deg,#290152,#C71685);-webkit-background-clip:text;background-clip:text;color:transparent}
  .rsvp .lead{font-size:26px;font-weight:600;margin-bottom:22px}
  .rsvp .details{justify-content:center;color:#290152;margin-bottom:28px}
  .rsvp .note{font-size:14px;opacity:.7;margin-top:22px;color:#290152}

  footer{position:relative;z-index:1;background:var(--cream)}
  .ft__row{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:28px var(--pad);color:#5A2A14;font-size:14px;max-width:var(--maxw);margin:0 auto}
  footer .logo{color:#C2410C;font-size:22px}

  @media (max-width:900px){
    .hero__top{row-gap:24px}
    .hero__row{grid-template-columns:1fr;gap:16px}
    .lockup{white-space:normal}.lockup .l1,.lockup .l2{display:block}.lockup .l2{margin-left:0}
    .hero__bottom{margin-top:32px}
    .hero__bottom .btn--lg{width:100%}
    .rsvp h2{white-space:normal}
    .btn--lg{height:60px;padding:0 32px;font-size:16px;width:100%;justify-content:center}
    .countdown{gap:8px;width:100%}
    .countdown div{flex:1;width:auto}
    .countdown b{font-size:28px}
    .bento{grid-template-columns:1fr}
    .bento .big{grid-row:auto}
    .lock{display:none}
    .ft__row{flex-direction:column;align-items:flex-start}
    .hdr__row{height:72px}
    .hdr{height:calc(72px + env(safe-area-inset-top,0px))}
    .hdr__rsvp-btn{height: 40px; padding: 0 18px;font-size: 12px;}
    .rsvp .details{flex-direction: column;}
    .rsvp .details .dot{display: none;}
  }
  @media (max-width:600px){
    .hero__left{container-type:inline-size}
    .lockup{font-size:clamp(48px,20.05cqw,156px)}
    .cmark{display:none}
  }
  @media (prefers-reduced-motion:reduce){
    body{background:var(--ink) linear-gradient(180deg,#120622,#7A1E5E 45%,#F6A623 80%,#FFF3DC) center top / 100% 100% no-repeat}
    .sun{display:none}
    .lock{transition:none}

  }