/* ========================================
   VARIABLES & RESET
======================================== */
:root{
    --primary:#d4a574;
    --primary-light:#e8c4a0;
    --primary-dark:#b8956a;
    --secondary:#f7f5f2;
    --text:#2c2c2c;
    --muted:#666;
    --stroke:#eadfd5;
    --success:#28a745;
    --danger:#dc3545;
    --uno: #CEB9AF;
    --due: #842330;
    --tre: #5B1521;
    --quattro: #F7F5F2;
    --cinque: #E1C7B7;
    --sei: #B49C92;
    --sette: #45121D;
    --vh:1vh;
    --container-pad:clamp(12px,2.5vw,24px);
  }
  *{box-sizing:border-box}
  html{scroll-behavior:smooth}
  body{
    font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;
    color:var(--text);background:#fff;line-height:1.6;margin:0;
  }
  .font-display{font-family:"Playfair Display",serif}
  
  p,h1,h2,h3,h4,h5,h6,span,div,a,li,small{-webkit-user-select:text;user-select:text}
  a{text-decoration:none}
  
  /* ========================================
     LOADING
  ======================================== */
  .loading-overlay{position:fixed;inset:0;background:#fff;display:flex;align-items:center;justify-content:center;z-index:9999;transition:opacity .5s ease}
  .loading-overlay.fade-out{opacity:0;pointer-events:none}
  .loading-spinner{width:40px;height:40px;border:3px solid var(--due);border-top-color:var(--cinque);border-radius:50%;animation:spin 1s linear infinite}
  @keyframes spin{to{transform:rotate(360deg)}}
  
  /* ========================================
     NAV (REMOVED)
  ======================================== */
  .navbar{display:none!important}
  
  /* ========================================
     HERO
  ======================================== */
  .hero{
    min-height:100dvh;
    /* overlay + tua immagine locale */
    background:
      linear-gradient(rgba(0,0,0,.35), rgba(0,0,0,.35)),
      url('assets/castello.jpg') center/cover no-repeat;
    display:flex;align-items:center;color:#fff;text-align:center;
    padding:8vh var(--container-pad);
    position:relative;overflow:hidden;
  }
  @media (max-width:576px){
    .hero{ background-position:center 35%; }
  }
  .hero::before{
    content:"";position:absolute;inset:0;background:linear-gradient(45deg,rgba(212,165,116,.10),rgba(0,0,0,.20));
    animation:shimmer 6s ease-in-out infinite;pointer-events:none
  }
  @keyframes shimmer{0%,100%{opacity:.3}50%{opacity:.6}}
  .hero-content{position:relative;z-index:1}
  .hero h1{font-size:clamp(3rem,8vw,6rem);font-weight:700;letter-spacing:2px;margin:.25rem 0}
  .ampersand{color:var(--cinque);display:inline-block;animation:pulse 2s ease-in-out infinite}
  @keyframes pulse{50%{transform:scale(1.1)}}
  .hero-subtitle{font-weight:300;font-size:1.4rem;opacity:.95;margin-bottom:1.5rem}
  .divider{width:200px;height:20px;margin:1rem auto 0;display:block;opacity:.9}
  
  /* Particelle / anelli */
  .particles,.rings-animation{position:absolute;pointer-events:none}
  .particles{inset:0}
  .particle{position:absolute;width:4px;height:4px;background:rgba(255,255,255,.6);border-radius:50%;animation:float 8s ease-in-out infinite}
  @keyframes float{0%,100%{transform:translateY(0) rotate(0);opacity:0}10%,90%{opacity:1}100%{transform:translateY(-100vh) rotate(360deg)}}
  .rings-animation{top:20%;right:10%;opacity:.1;animation:float-rings 8s ease-in-out infinite}
  @keyframes float-rings{50%{transform:translateY(-20px) rotate(180deg)}}
  
  /* Countdown */
  .countdown-container{background:rgba(255,255,255,.1);backdrop-filter:blur(10px);border-radius:15px;padding:1.2rem;margin-top:1.2rem;border:1px solid rgba(255,255,255,.2)}
  .countdown-timer{display:flex;justify-content:center;gap:1rem;flex-wrap:wrap}
  .countdown-item{text-align:center;min-width:70px}
  .countdown-number{display:block;font-size:2rem;font-weight:700;color:var(--cinque);font-family:"Playfair Display",serif}
  .countdown-label{display:block;font-size:1.4rem;text-transform:uppercase;letter-spacing:1px;opacity:.8}
  
  /* Dettagli hero */
  .hero-details{
    background:rgba(255,255,255,.18);backdrop-filter:blur(15px);border-radius:20px;padding:1.4rem;border:1px solid rgba(255,255,255,.25);
    transition:transform .3s ease;position:relative;z-index:1
  }
  .hero-details:hover{transform:translateY(-5px)}
  .detail-icon{width:24px;height:24px;color:var(--cinque)}
  
  /* ========================================
     SECTIONS
  ======================================== */
  .section-bg{background:var(--quattro);padding-left:var(--container-pad);padding-right:var(--container-pad)}
  .section-title{font-size:clamp(2.2rem,6vw,3.6rem);font-weight:600;margin-bottom:1rem;color:var(--tre);position:relative}
  .section-title::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:-10px;width:60px;height:3px;background:var(--tre);border-radius:2px}
  .section-titledue{font-size:clamp(2.2rem,6vw,3.6rem);font-weight:600;margin-bottom:1rem;color:var(--cinque);position:relative}
  .section-titledue::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:-10px;width:60px;height:3px;background:var(--cinque);border-radius:2px}
  .section-titletre{font-size:clamp(2.2rem,6vw,3.6rem);font-weight:600;margin-bottom:1rem;color:var(--tre);position:relative}
  .section-titletre::after{content:"";position:absolute;left:50%;transform:translateX(-50%);bottom:-10px;width:60px;height:3px;background:#ffffff;border-radius:2px}
  .signature{font-size:1.1rem;color:var(--primary);font-weight:500;margin-top:1rem}
  .nomi{font-size:2.2rem;color:var(--tre);font-weight:500;margin-top:1rem}
  /* ========================================
     FORM & FIELDS
  ======================================== */
  .form-container{background:#fff;padding:3rem;border-radius:20px;box-shadow:0 25px 50px rgba(0,0,0,.12);border:1px solid rgba(212,165,116,.2);position:relative;overflow:hidden}
  .form-container::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--tre);pointer-events:none}
  .form-title{font-size:2.2rem;margin:0 0 .4rem;font-weight:600; color:var(--tre)}
  .form-subtitle{color:var(--muted);margin-bottom:1.2rem}
  .form-progress{height:4px;background:#e9ecef;border-radius:2px;margin-bottom:1.2rem;overflow:hidden}
  .form-progress-bar{height:100%;background:linear-gradient(90deg,var(--tre),var(--tre));width:0;transition:width .3s ease}
  .form-label{font-weight:600;color:var(--text);margin-bottom:.6rem}
  .required{color:var(--tre)}
  .form-control,.form-select{padding:1rem;border:2px solid #e8ecef;border-radius:12px;background:#fafbfc;font-size:1rem;transition:.25s}
  .form-control:focus,.form-select:focus{border-color:var(--tre);box-shadow:0 0 0 3px rgba(212,165,116,.12);background:#fff;transform:translateY(-1px)}
  .form-control:hover,.form-select:hover{border-color:var(--tre);background:#fff}
  .form-control.is-valid{border-color:var(--success)}
  .form-control.is-invalid{border-color:var(--danger)}
  .invalid-feedback{display:block;color:var(--danger);font-size:.875rem;margin-top:.25rem}
  .valid-feedback{display:none;color:var(--success);font-size:.875rem;margin-top:.25rem}
  .form-control.is-valid + .valid-feedback,.form-select.is-valid + .valid-feedback{display:block}
  
  /* Radio cards */
  .radio-card{border:2px solid #e8ecef;border-radius:12px;padding:1rem;cursor:pointer;transition:.25s;background:#fafbfc;position:relative;overflow:hidden;z-index:1}
  .radio-card::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(212,165,116,.1),transparent);left:-100%;transition:left .5s ease;pointer-events:none;z-index:0}
  .radio-card:hover::before{left:100%}
  .radio-card:hover{border-color:var(--tre);background:#fff;transform:translateY(-2px);box-shadow:0 5px 15px rgba(212,165,116,.2)}
  .radio-card.active{border-color:var(--tre);background:rgba(212,165,116,.05);transform:translateY(-2px);box-shadow:0 8px 25px rgba(212,165,116,.3)}
  .radio-card input{position:relative;z-index:1}
  
  /* ========================================
     BUTTONS
  ======================================== */
  .btn-calendar{border:2px solid var(--primary);color:var(--primary);font-weight:700;transition:.3s;position:relative;overflow:hidden;min-width:240px}
  .btn-calendar::before{content:"";position:absolute;inset:0;left:-100%;background:var(--due);transition:left .3s ease;z-index:-1;pointer-events:none}
  .btn-calendar:hover::before{left:0}
  .btn-calendar:hover{color:#fff;border-color:var(--due);transform:translateY(-2px)}
  .btn-calendardue:hover{background-color:rgba(255, 255, 255, 0)!important;color:var(--due)!important;border-color:var(--due)!important;transform:translateY(-2px)}
  .btn-submit{
    background:var(--tre);color:#fff;border:none;padding:1.05rem 1.4rem;font-size:1.05rem;font-weight:700;
    border-radius:999px;text-transform:uppercase;letter-spacing:.06em;box-shadow:0 10px 24px rgba(212,165,116,.3);transition:.25s;position:relative;overflow:hidden
  }
  .btn-submit::before{content:"";position:absolute;top:50%;left:50%;width:0;height:0;background:rgba(255,255,255,.2);border-radius:50%;transform:translate(-50%,-50%);transition:width .6s ease,height .6s ease;pointer-events:none}
  .btn-submit:hover::before{width:300px;height:300px}
  .btn-submit:hover{transform:translateY(-3px);box-shadow:0 16px 32px rgba(69,18,29,.4);background:var(--tre)}
  
  /* ========================================
     INFO CARDS
  ======================================== */
  .info-card{background:#fff;padding:2rem;border-radius:15px;box-shadow:0 10px 25px rgba(0,0,0,.08);text-align:left;border-top:4px solid var(--primary);height:100%;border:1px solid var(--stroke);transition:.3s;position:relative;overflow:hidden;z-index:1}
  .info-card::before{content:"";position:absolute;inset:0;background:linear-gradient(135deg,rgba(212,165,116,.05),transparent);opacity:0;transition:opacity .3s;pointer-events:none;z-index:0}
  .info-card:hover::before{opacity:1}
  .info-card:hover{transform:translateY(-8px);box-shadow:0 20px 40px rgba(0,0,0,0.15);border-top-color:var(--primary-dark)}
  .info-card .flourish{
  display: block;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}
  .card-title{font-size:1.5rem;font-weight:600;margin-bottom:1rem;color:var(--text)}
  .card-content{color:var(--muted);line-height:1.6;overflow-wrap:anywhere}
  .card-content a{pointer-events:auto}
  .card-content h4{color:var(--primary);font-weight:600;margin:.5rem 0}
  .flourish{width:60px;height:10px;margin-bottom:.5rem;display:block}
  .info-card ul{margin:.1rem 0 .75rem 1.2rem}
  .info-card li{margin:.25rem 0}
  .badge-note{display:inline-block;background:rgba(212,165,116,.1);border:1px solid rgba(212,165,116,.35);color:#8d6a3e;padding:.25rem .5rem;border-radius:999px;font-size:.85rem;font-weight:600;animation:glow 2s ease-in-out infinite alternate}
  @keyframes glow{from{box-shadow:0 0 5px rgba(212,165,116,.3)}to{box-shadow:0 0 10px rgba(212,165,116,.6)}}
  
  /* Timeline & services */
  .timeline-item{padding:.5rem 0;border-left:2px solid var(--sei);padding-left:1rem;margin-left:.5rem;position:relative}
  .timeline-item::before{content:"";position:absolute;left:-6px;top:1rem;width:10px;height:10px;background:var(--sei);border-radius:50%}
  .service-list{list-style:none;padding:0}
  .service-list li{padding:.25rem 0;color:var(--text)}
  .gift-info{background:#B49C920D;border-radius:10px;padding:1rem;border:1px solid rgba(212,165,116,.3);overflow-wrap:anywhere}
  
  /* ========================================
     MAP
  ======================================== */
  .map-card{background:#fff;border:1px solid var(--stroke);border-radius:16px;overflow:hidden;box-shadow:0 14px 32px rgba(0,0,0,.08);transition:.3s}
  .map-card:hover{transform:translateY(-5px);box-shadow:0 20px 40px rgba(0,0,0,.12)}
  .map-header{display:flex;justify-content:space-between;align-items:center;padding:1rem 1.25rem;border-bottom:1px solid var(--stroke);background:linear-gradient(90deg,rgba(212,165,116,.05),transparent)}
  .map-embed{width:100%;height:360px;border:0;display:block}
  
  /* ========================================
     SUCCESS MESSAGE
  ======================================== */
  .success-message{display:none;background:linear-gradient(135deg,#eaf6ee,#f0f9f2);border:1px solid #cfead7;border-radius:15px;padding:2rem;text-align:center;color:#235d3a;animation:slideInUp .5s ease}
  .success-message.show{display:block}
  @keyframes slideInUp{from{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}
  
  /* ========================================
     FOOTER
  ======================================== */
  .footer{background:linear-gradient(135deg,#1a1a1a,#2c2c2c);color:#fff;padding:3rem 0 2rem;position:relative;overflow:hidden;padding-left:var(--container-pad);padding-right:var(--container-pad)}
  .footer::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,transparent,var(--primary),transparent)}
  .footer-title{font-size:2rem;margin-bottom:1rem}
  .contact-item{color:#fff;transition:.3s}
  .contact-item:hover{color:var(--primary);transform:translateY(-2px)}
  
  /* ========================================
     BACK TO TOP
  ======================================== */
  .back-to-top{position:fixed;bottom:30px;right:30px;width:50px;height:50px;background:var(--due);border:none;border-radius:50%;color:#fff;font-size:1.2rem;cursor:pointer;opacity:0;visibility:hidden;transition:.3s;z-index:1000}
  .back-to-top.show{opacity:1;visibility:visible}
  .back-to-top:hover{background:var(--tre);transform:translateY(-3px)}
  
  /* ========================================
     TOASTS
  ======================================== */
  .toast-container{position:fixed;top:20px;right:20px;z-index:1050}
  .toast{background:#fff;border-radius:10px;box-shadow:0 10px 30px rgba(0,0,0,.2);border-left:4px solid var(--primary)}
  
  /* Helpers animazione */
  .fade-in-up{opacity:0;transform:translateY(30px);transition:all .6s ease}
  .fade-in-up.animated{opacity:1;transform:translateY(0)}
  
  /* ========================================
     RESPONSIVE
  ======================================== */
  @media (max-width:992px){
    .info-card{padding:clamp(1.2rem,2.3vw,2rem)}
    .map-embed{height:300px}
  }
  @media (max-width:576px){
    .hero{padding-top:10vh;padding-bottom:6vh}
    .hero h1{font-size:clamp(2.2rem,10vw,3.2rem);line-height:1.1}
    .hero-subtitle{font-size:1.05rem}
    .hero-details{padding:1rem}
    .countdown-number{font-size:1.4rem}
    .btn-calendar{width:100%;min-width:0}
    a.btn.btn-outline-light[href*="download_ics"]{width:100%}
    .form-container{padding:2rem 1.25rem}
    .form-title{font-size:2rem}
  }
  
  /* ========================================
     POINTER-EVENTS SAFETY
  ======================================== */
  .info-card::before,
  .radio-card::before,
  .hero::before,
  .btn-submit::before,
  .btn-calendar::before,
  .rings-animation,
  .particles{pointer-events:none}
  .info-card,.radio-card,.form-container,.hero-details{position:relative;z-index:1}
  
  /* --- layering dell'hero: background < overlay < particles < contenuti --- */
.hero { position: relative; overflow: hidden; }
.hero::before { z-index: 0; }           /* overlay */
.particles, .rings-animation { z-index: 1; } /* particelle sopra overlay */
.hero-content,
.hero-details { z-index: 2; }           /* testi e box sopra le particelle */

/* --- particelle più visibili --- */
.particle{
  width: 5px;
  height: 5px;
  background: rgba(255,255,255,0.85);
  border-radius: 50%;
  box-shadow: 0 0 6px rgba(255,255,255,0.6);
}
.hero::before {
    background: linear-gradient(45deg, rgba(212,165,116,0.08), rgba(0,0,0,0.18));
  }
  /* aspetto “filled” di default */
.btn-calendar{
    color: #fff !important;
    background: var(--tre) !important;
    border-color: var(--tre) !important;
  }
  .btn-calendar:hover{
    filter: brightness(0.95);
  }
  .btn-calendardue{
    
    border-color: var(--cinque)!important;
    color: var(--cinque)!important;
  }
  .btn-calendardue:hover{
    filter: brightness(0.95);
  }
  @font-face {
    font-family: 'CormorantGaramond';
    src: url('/fonts/CormorantGaramond-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;  /* puoi usare other valori se hai più pesi */
    font-style: normal;
    font-display: swap;
  }
  
  @font-face {
    font-family: 'CormorantGaramond';
    src: url('/fonts/CormorantGaramond-Italic-VariableFont_wght.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;
    font-display: swap;
  }
  body {
    font-family: 'CormorantGaramond', serif;
  }
  #la_nostra_storia {
    background: url('img/la_nostra_storia_bg.jpg') center/cover no-repeat fixed;
    position: relative;
    color: #fff;
  }
  
  #la_nostra_storia::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
    z-index: 1;
  }
  
  #la_nostra_storia .container {
    position: relative;
    z-index: 2;
  }

  #location {
    background: url('img/hero2.jpg') center/cover no-repeat;
    position: relative;
    color: #fff;
  }
  #location::before {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(104, 99, 99, 0.45);
    z-index: 1;
  }
  
  #location .container {
    position: relative;
    z-index: 2;
  }