@font-face{font-family:'Cinzel';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/cinzel-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Cinzel';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/cinzel-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Raleway';font-style:normal;font-weight:400;font-display:swap;src:url(fonts/raleway-latin-400-normal.woff2) format('woff2')}
@font-face{font-family:'Raleway';font-style:normal;font-weight:500;font-display:swap;src:url(fonts/raleway-latin-500-normal.woff2) format('woff2')}
@font-face{font-family:'Raleway';font-style:normal;font-weight:600;font-display:swap;src:url(fonts/raleway-latin-600-normal.woff2) format('woff2')}
@font-face{font-family:'Raleway';font-style:normal;font-weight:700;font-display:swap;src:url(fonts/raleway-latin-700-normal.woff2) format('woff2')}
:root{
  --red:#9b1c1c; --gold:#b3a270; --gold-deep:#8f825a; --gold-text:#7a6d45; --gold-soft:rgba(179,162,112,.14);
  --ink:#1c1b19; --ink-dim:#4a4740; --ink-faint:#6e6a60;
  --paper:#fbf9f4; --card:#ffffff; --line:rgba(179,162,112,.38);
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  font-family:'Raleway',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;
  color:var(--ink); background:var(--paper);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  line-height:1.65; overflow-x:hidden;
}
body::before{
  content:''; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:
    radial-gradient(ellipse 90% 50% at 50% -12%, rgba(179,162,112,.16), transparent 62%),
    radial-gradient(ellipse 70% 45% at 50% 110%, rgba(179,162,112,.09), transparent 60%);
}
.wrap{position:relative; z-index:1; max-width:660px; margin:0 auto; padding:0 22px}
a{color:var(--gold-text)}
:focus-visible{outline:2px solid var(--gold-deep); outline-offset:3px}

/* ---------- testata ---------- */
.curtain{padding:56px 0 0; text-align:center}
.logo{display:block; width:min(340px,82%); height:auto; margin:0 auto 34px}
.kicker{
  font-family:'Cinzel',serif; font-size:12px; letter-spacing:.32em; text-transform:uppercase;
  color:var(--gold-text); margin-bottom:18px;
}
h1{
  font-family:'Cinzel',serif; font-weight:400;
  font-size:clamp(30px,7vw,46px); line-height:1.15; letter-spacing:.02em;
  color:var(--ink); margin-bottom:20px;
}
h1 em{font-style:normal; color:var(--gold-deep)}
.standfirst{font-size:15.5px; color:var(--ink-dim); max-width:460px; margin:0 auto}

/* ---------- data ---------- */
.datestone{
  margin:40px auto 0; max-width:360px; padding:20px 24px;
  border-top:1px solid var(--line); border-bottom:1px solid var(--line); text-align:center;
}
.datestone .day{
  font-family:'Cinzel',serif; font-size:clamp(22px,5.4vw,28px);
  color:var(--ink); letter-spacing:.04em; line-height:1.25;
}
.datestone .where{
  font-size:11px; letter-spacing:.2em; text-transform:uppercase;
  color:var(--ink-faint); margin-top:9px; font-weight:600;
}

/* ---------- programma ---------- */
.acts{margin:56px 0 0}
.acts-title{
  font-family:'Cinzel',serif; font-size:13px; letter-spacing:.3em; text-transform:uppercase;
  color:var(--gold-text); text-align:center; margin-bottom:34px;
}
.act{display:flex; gap:18px; margin-bottom:30px}
.act:last-child{margin-bottom:0}
.hour{
  flex:0 0 74px; text-align:right; padding-top:1px;
  font-family:'Cinzel',serif; font-size:18px; color:var(--gold-deep); letter-spacing:.02em; line-height:1.35;
}
.hour small{display:block; font-size:12px; color:var(--ink-faint)}
/* linea e pallino nascono entrambi da .body: non possono disallinearsi */
.body{flex:1; padding-left:24px; position:relative}
.body::before{
  content:''; position:absolute; left:0; top:9px; bottom:-30px; width:1px;
  background:linear-gradient(180deg,var(--gold),rgba(179,162,112,.15));
}
.act:last-child .body::before{display:none}
.body::after{
  content:''; position:absolute; left:-4px; top:5px; width:9px; height:9px;
  border-radius:50%; background:var(--paper); border:1px solid var(--gold-deep);
}
.act.highlight .body::after{background:var(--gold)}
.act h2{
  font-family:'Cinzel',serif; font-weight:500; font-size:18px;
  color:var(--ink); line-height:1.3; margin-bottom:4px; letter-spacing:.02em;
}
.act .sub{
  font-size:10.5px; letter-spacing:.17em; text-transform:uppercase;
  color:var(--gold-text); font-weight:700; margin-bottom:7px;
}
.act p{font-size:14.5px; color:var(--ink-dim)}
.path{display:flex; flex-wrap:wrap; gap:6px; margin-top:10px; list-style:none}
.path li{
  font-size:12px; padding:3px 10px; border:1px solid var(--line); border-radius:20px;
  color:var(--ink-dim); background:var(--card);
}

/* ---------- nota ---------- */
.note{
  margin:46px 0 0; padding:22px 26px; background:var(--gold-soft);
  border-left:2px solid var(--gold); border-radius:2px;
}
.note p{font-size:14.5px; color:var(--ink-dim)}
.note strong{color:var(--ink); font-weight:600}

/* ---------- form ---------- */
.rsvp{margin:68px 0 0; padding:38px 0 0; border-top:1px solid var(--line)}
.rsvp-head{text-align:center; margin-bottom:32px}
.rsvp-head h2{
  font-family:'Cinzel',serif; font-weight:400;
  font-size:clamp(24px,5.4vw,30px); color:var(--ink); margin-bottom:9px; letter-spacing:.03em;
}
.rsvp-head p{font-size:14px; color:var(--ink-faint)}
.field{margin-bottom:19px}
label{
  display:block; font-size:10.5px; letter-spacing:.16em; text-transform:uppercase;
  color:var(--gold-text); font-weight:700; margin-bottom:8px;
}
label .opt{color:var(--ink-faint); letter-spacing:.04em; text-transform:none; font-weight:500}
input,select,textarea{
  width:100%; padding:13px 15px; background:var(--card);
  border:1px solid rgba(143,130,90,.45); border-radius:3px;
  color:var(--ink); font-family:inherit; font-size:15px; transition:border-color .2s,box-shadow .2s;
}
input::placeholder,textarea::placeholder{color:#9a958a}
input:focus,select:focus,textarea:focus{
  outline:none; border-color:var(--gold-deep); box-shadow:0 0 0 3px rgba(179,162,112,.22);
}
select{appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath fill='%238f825a' d='M6 8 0 0h12z'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 15px center;
}
textarea{resize:vertical; min-height:78px}
.hp{position:absolute; left:-9999px}
.privacy{font-size:12.5px; color:var(--ink-faint); margin-top:4px}
button,.btn{
  display:block; width:100%; margin-top:14px; padding:17px; cursor:pointer; text-align:center; text-decoration:none;
  background:var(--ink); color:#fff; border:none; border-radius:3px;
  font-family:'Cinzel',serif; font-size:13px; font-weight:500;
  letter-spacing:.2em; text-transform:uppercase; transition:background .2s,transform .12s;
}
button:hover,.btn:hover{background:var(--gold-deep)}
button:active,.btn:active{transform:translateY(1px)}
.btn.ghost{background:transparent; color:var(--ink); border:1px solid var(--gold-deep)}
.btn.ghost:hover{background:var(--gold-soft)}

/* ---------- piede ---------- */
footer{
  margin-top:68px; padding:32px 0 52px; border-top:1px solid var(--line); text-align:center;
}
footer .name{
  font-family:'Cinzel',serif; font-size:15px; color:var(--ink);
  letter-spacing:.12em; margin-bottom:7px;
}
footer p{font-size:12.5px; color:var(--ink-faint); line-height:1.9}
footer a{color:var(--ink-dim); text-decoration:none; border-bottom:1px solid var(--line)}
footer a:hover{color:var(--gold-deep)}

@media (max-width:520px){
  .act{gap:12px}
  .hour{flex:0 0 60px; font-size:16px}
  .body{padding-left:20px}
}

/* ---------- scadenza conferma ---------- */
.deadline{margin:22px auto 0; font-size:14.5px; font-weight:700; letter-spacing:.02em}
.deadline a{color:var(--red); text-decoration:none; border-bottom:1px solid rgba(155,28,28,.35)}
.deadline a:hover{border-bottom-color:var(--red)}
.red{color:var(--red); font-weight:700}