/* ============================================================
   LUCANIA IS MORE — Segnala un evento · modulo
   Campi mappati sul modello dati della scheda evento.
   Builds on styles.css.
   ============================================================ */

body{ --accent:#A91013; }

.nav .brand .lim-logo{ display:block; height:54px; width:auto; aspect-ratio:814/399; }
.foot .brand .lim-logo{ display:block; width:188px; height:auto; aspect-ratio:814/399; }
@media (max-width:560px){ .nav .brand .lim-logo{ height:42px; } }

/* ============================================================
   HEADER
   ============================================================ */
.sg-hero{ position:relative; padding:calc(78px + 56px) 0 46px;
  border-bottom:1px solid var(--line-strong); background:var(--cream); overflow:hidden; }
.sg-hero .wm{ position:absolute; right:-2%; top:50%; transform:translateY(-50%);
  font-family:var(--sans); font-weight:800; font-size:min(26vw,330px); line-height:1;
  color:rgba(28,28,28,.04); letter-spacing:-.04em; white-space:nowrap;
  pointer-events:none; user-select:none; z-index:1; }
.sg-hero .shell{ position:relative; z-index:2; }
.sg-back{ display:flex; width:fit-content; align-items:center; gap:9px; color:var(--ink-55);
  font:600 11.5px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase;
  padding-bottom:5px; border-bottom:1px solid var(--line-strong); transition:.18s; margin-bottom:34px; }
.sg-back:hover{ color:var(--accent); gap:14px; }
.sg-kick{ display:inline-flex; align-items:center; gap:11px; color:var(--accent);
  font:600 11.5px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; }
.sg-kick::before{ content:""; width:26px; height:1px; background:var(--accent); }
.sg-hero h1{ font-family:var(--sans); font-weight:800; letter-spacing:-.022em;
  font-size:clamp(34px,5vw,60px); line-height:1.02; margin:18px 0 0; color:var(--ink);
  max-width:18ch; text-wrap:balance; }
.sg-hero .deck{ font-family:var(--serif); font-size:clamp(18px,1.8vw,21px); line-height:1.5;
  color:var(--ink-70); max-width:56ch; margin:20px 0 0; text-wrap:pretty; }

/* ============================================================
   FORM SHELL
   ============================================================ */
.sg-wrap{ max-width:780px; margin:0 auto; padding:56px var(--pad) 40px; }
.sg-form{ display:flex; flex-direction:column; }

/* labelled section */
.sg-sec{ padding:0 0 44px; margin:0 0 44px; border-bottom:1px solid var(--line); }
.sg-sec:last-of-type{ border-bottom:0; }
.sg-lab{ display:flex; align-items:center; gap:12px; margin:0 0 26px;
  color:var(--accent); font:600 12px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; }
.sg-lab .n{ color:var(--ink-40); }
.sg-hint{ font-family:var(--serif); font-style:italic; font-size:15px; color:var(--ink-55);
  margin:-14px 0 24px; }

/* field grid */
.sg-grid{ display:grid; grid-template-columns:1fr 1fr; gap:22px; }
.sg-field{ display:flex; flex-direction:column; gap:9px; min-width:0; }
.sg-field.full{ grid-column:1 / -1; }
.sg-field > label{ font:600 11px/1 var(--sans); letter-spacing:.14em; text-transform:uppercase;
  color:var(--ink-55); display:flex; align-items:center; gap:8px; }
.sg-field > label .opt{ color:var(--ink-40); font-weight:500; letter-spacing:.04em;
  text-transform:none; font-size:12px; font-family:var(--serif); font-style:italic; }
.sg-field .req{ color:var(--accent); }

.sg-input, .sg-select, .sg-area{ box-sizing:border-box; width:100%; min-width:0; font-family:var(--sans); font-size:16px; color:var(--ink);
  background:rgba(255,249,227,.55); border:1px solid var(--line); border-radius:10px;
  padding:13px 15px; outline:none; transition:border-color .16s, background .16s; }
.sg-area{ font-family:var(--serif); font-size:16.5px; line-height:1.55; resize:vertical; min-height:96px; }
.sg-input::placeholder, .sg-area::placeholder{ color:var(--ink-40); }
.sg-input:focus, .sg-select:focus, .sg-area:focus{ border-color:var(--ink); background:#fffdf3; }
.sg-input.bad, .sg-select.bad{ border-color:var(--accent); background:rgba(169,16,19,.04); }
.sg-select{ appearance:none; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%231C1C1C' stroke-width='1.5'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 15px center; background-size:11px; padding-right:38px; }

/* counter / meta under a field */
.sg-meta{ display:flex; align-items:baseline; justify-content:space-between; gap:14px; margin-top:-1px; }
.sg-meta-hint{ font-family:var(--serif); font-style:italic; font-size:13px; color:var(--ink-40); }
.sg-count{ font:600 11px/1 var(--sans); letter-spacing:.06em; color:var(--ink-40);
  font-variant-numeric:tabular-nums; white-space:nowrap; transition:color .16s; }
.sg-count.warn{ color:var(--accent); }

/* checkbox chips (tag secondari) */
.sg-chips{ display:flex; flex-wrap:wrap; gap:10px; }
.sg-chips label{ cursor:pointer; }
.sg-chips input{ position:absolute; opacity:0; pointer-events:none; }
.sg-chips span{ display:inline-flex; align-items:center; gap:9px; padding:10px 16px;
  border:1px solid var(--line); border-radius:100px; background:rgba(255,249,227,.55);
  font:600 12.5px/1 var(--sans); letter-spacing:.02em; color:var(--ink-70); transition:.16s; }
.sg-chips span::before{ content:""; width:7px; height:7px; border-radius:50%;
  border:1px solid var(--line-strong); transition:.16s; }
.sg-chips label:hover span{ border-color:var(--line-strong); }
.sg-chips input:checked + span{ border-color:var(--ink); color:var(--ink); background:#fffdf3; }
.sg-chips input:checked + span::before{ background:var(--accent); border-color:var(--accent); }

/* free / paid price toggle */
.sg-price{ display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.sg-toggle{ display:inline-flex; align-items:center; gap:11px; cursor:pointer;
  font:600 13px/1 var(--sans); color:var(--ink); user-select:none; white-space:nowrap; }
.sg-toggle input{ position:absolute; opacity:0; pointer-events:none; }
.sg-toggle .sw{ width:44px; height:26px; border-radius:100px; background:var(--line);
  position:relative; transition:.18s; flex:0 0 44px; }
.sg-toggle .sw::after{ content:""; position:absolute; top:3px; left:3px; width:20px; height:20px;
  border-radius:50%; background:#fffdf3; transition:.18s; box-shadow:0 1px 3px rgba(0,0,0,.3); }
.sg-toggle input:checked + .sw{ background:var(--green); }
.sg-toggle input:checked + .sw::after{ transform:translateX(18px); }
.sg-price .amount{ flex:1; min-width:140px; transition:opacity .18s; }
.sg-price.is-free .amount{ opacity:.4; pointer-events:none; }

/* repeatable rows (programma · organizzatori) */
.sg-rep{ display:flex; flex-direction:column; gap:14px; }
.rep-item{ position:relative; border:1px solid var(--line); border-radius:14px;
  background:rgba(255,249,227,.4); padding:18px 18px 18px; }
.rep-item .rep-x{ position:absolute; top:12px; right:12px; width:28px; height:28px; border:0;
  border-radius:50%; background:none; color:var(--ink-40); display:grid; place-items:center; transition:.16s; }
.rep-item .rep-x:hover{ background:rgba(169,16,19,.1); color:var(--accent); }
.rep-item .rep-x svg{ width:14px; height:14px; stroke:currentColor; stroke-width:2; fill:none; }
.rep-prog{ display:grid; grid-template-columns:150px minmax(0,1fr); gap:14px; align-items:start; }
.rep-org{ display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.rep-org .full{ grid-column:1 / -1; }
.rep-add{ display:inline-flex; align-items:center; gap:10px; align-self:flex-start; margin-top:4px;
  white-space:nowrap; background:none; border:1px dashed var(--line-strong); border-radius:100px; color:var(--ink);
  font:600 11.5px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase; padding:12px 20px; transition:.16s; }
.rep-add:hover{ border-color:var(--ink); border-style:solid; background:rgba(28,28,28,.03); }
.rep-add svg{ width:14px; height:14px; stroke:currentColor; stroke-width:1.8; fill:none; }

/* submit bar */
.sg-actions{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; margin-top:8px; }
.sg-submit{ display:inline-flex; align-items:center; gap:12px; cursor:pointer; white-space:nowrap;
  background:var(--accent); color:#fff; border:0; border-radius:100px;
  font:600 12.5px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase;
  height:56px; padding:0 30px; transition:.18s; box-shadow:0 12px 26px -12px rgba(169,16,19,.8); }
.sg-submit:hover{ transform:translateY(-2px); box-shadow:0 16px 30px -12px rgba(169,16,19,.9); }
.sg-submit svg{ width:16px; height:16px; stroke:currentColor; stroke-width:1.8; fill:none; }
.sg-note{ font-family:var(--serif); font-style:italic; font-size:14px; color:var(--ink-55); }

/* success */
.sg-done{ display:none; max-width:780px; margin:0 auto; padding:72px var(--pad) 60px; text-align:center; }
.sg-done.show{ display:block; }
.sg-done .ok{ width:72px; height:72px; margin:0 auto 28px; border-radius:50%;
  background:var(--green); display:grid; place-items:center; }
.sg-done .ok svg{ width:34px; height:34px; stroke:#FFF9E3; stroke-width:2.4; fill:none; }
.sg-done h2{ font-family:var(--sans); font-weight:800; font-size:clamp(28px,3.4vw,40px);
  letter-spacing:-.02em; margin:0; color:var(--ink); }
.sg-done p{ font-family:var(--serif); font-size:18px; line-height:1.6; color:var(--ink-70);
  max-width:48ch; margin:18px auto 0; }
.sg-done .again{ display:inline-flex; align-items:center; gap:10px; margin-top:34px;
  background:none; border:1px solid var(--line-strong); border-radius:100px; color:var(--ink);
  font:600 12px/1 var(--sans); letter-spacing:.13em; text-transform:uppercase; padding:14px 26px; transition:.16s; }
.sg-done .again:hover{ border-color:var(--ink); background:rgba(28,28,28,.03); }
.sg-done .recap{ text-align:left; border:1px solid var(--line); border-radius:16px;
  background:rgba(255,249,227,.6); padding:24px 26px; margin:40px auto 0; max-width:560px; }
.sg-done .recap .rl{ font:600 10.5px/1 var(--sans); letter-spacing:.18em; text-transform:uppercase;
  color:var(--ink-40); margin-bottom:14px; }
.sg-done .recap dl{ display:grid; grid-template-columns:auto 1fr; gap:10px 20px; margin:0; }
.sg-done .recap dt{ font:600 12px/1.3 var(--sans); letter-spacing:.04em; color:var(--ink-55); }
.sg-done .recap dd{ margin:0; font-family:var(--serif); font-size:16px; color:var(--ink); }

/* native date/time controls render content-box in WebKit — force border-box so
   their padding+border don't push them past the grid cell on narrow screens */
/* stripping the native control leaves an empty date/time field with no content
   height, so it collapses shorter than a filled one. Pin it to the same height
   as a normal text input in both states. */
.sg-input[type="date"], .sg-input[type="time"]{ box-sizing:border-box; -webkit-appearance:none; appearance:none;
  min-height:49px; line-height:21px; }
.sg-input[type="date"]::-webkit-date-and-time-value,
.sg-input[type="time"]::-webkit-date-and-time-value{ text-align:left; }
.sg-field{ min-width:0; }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width:760px){
  .sg-grid{ grid-template-columns:1fr; gap:18px; }
  .rep-prog, .rep-org{ grid-template-columns:1fr; }
}
@media (max-width:640px){
  .sg-hero{ padding-top:calc(78px + 36px); }
  .sg-wrap{ padding-top:40px; }
  .sg-grid{ grid-template-columns:1fr; gap:18px; }
  .rep-prog{ grid-template-columns:1fr; }
  .rep-org{ grid-template-columns:1fr; }
}

/* phones — contain the oversized hero watermark + tighten type */
@media (max-width:480px){
  .sg-hero .wm{ font-size:34vw; right:-6%; }
  .sg-hero h1{ font-size:clamp(30px,8.6vw,40px); }
  .sg-hero .deck{ font-size:16px; }
  .sg-price{ gap:12px; }
  .sg-price .amount{ flex:1 1 100%; min-width:0; }
  .sg-done .recap{ padding:20px 18px; }
  .sg-done .recap dl{ grid-template-columns:1fr; gap:3px 0; }
  .sg-done .recap dt{ margin-top:10px; }
}

.sg-field input[type=file]{ font-family:var(--sans); font-size:14px; padding:11px 14px; cursor:pointer; }
.sg-foto-list{ display:flex; flex-wrap:wrap; gap:8px; margin-top:10px; }
.sg-foto-chip{ background:var(--cream-2); border:1px solid var(--line); border-radius:8px; padding:6px 11px; font:500 12px/1.2 var(--sans); color:var(--ink-70); }
