:root{
  --primary:#c257a2;
  --primary-600:#a8478a;
  --primary-700:#8f3a77;
  --primary-800:#6f2b5f;
  --primary-100:#f6e9f3;
  --primary-50:#fcf8fb;
  --text:#374151;
  --muted:#6b7280;
  --card-bg:#ffffff;
  --bg:#faf7fb;
  --border-color:#e5e7eb;
  --whatsapp:#25D366;
  --ring:0 0 0 3px rgba(194,87,162,.25);
  --shadow:0 4px 6px -1px rgba(0,0,0,.05), 0 2px 4px -2px rgba(0,0,0,.05);
  --shadow-lg:0 10px 15px -3px rgba(0,0,0,.07), 0 4px 6px -4px rgba(0,0,0,.07);
  --transition:all .25s cubic-bezier(.4,0,.2,1);
}
*, *::before, *::after { box-sizing:border-box; transition:var(--transition); }
html{ scroll-behavior:smooth; }
body{
  margin:0; font-family:Inter,system-ui,Segoe UI,Roboto,Helvetica,Arial,sans-serif;
  color:var(--text); background:var(--bg);
  -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale;
  animation:fadeIn .5s ease-out;
}
@keyframes fadeIn {
  from { opacity:0; transform:translateY(-5px); }
  to { opacity:1; transform:translateY(0); }
}
a{color:var(--primary); text-decoration:none}
img, svg{max-width:100%; height:auto; display:block}
h1,h2,h3{color:#111827; letter-spacing:-.02em}
ul{ list-style:none; padding-left:0; }

/* Header */
.container{max-width:1180px; padding:0 24px; margin:0 auto}
header{
  position:sticky; top:0; z-index:50; background:rgba(255,255,255,.8);
  backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--border-color);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:16px 0}
.brand{display:flex; align-items:center; gap:12px; font-weight:800; font-size:1.05rem; letter-spacing:.2px; color:#111827;}
.brand__logo{
  width:40px; height:40px; border-radius:12px; background:linear-gradient(135deg, var(--primary), var(--primary-700));
  display:grid; place-items:center; color:#fff; font-weight:800;
}
.menu{display:flex; gap:24px}
.menu a{font-weight:600; color:#404553; position:relative; padding:4px 0;}
.menu a::after{
  content:''; position:absolute; left:0; bottom:0; width:0; height:2px;
  background:var(--primary); transition:width .2s ease;
}
.menu a:hover{color:var(--primary)}
.menu a:hover::after{width:100%}

.cta{display:flex; gap:10px; align-items:center}
.btn{appearance:none; border:0; padding:10px 18px; border-radius:12px; font-weight:600; font-size:.95rem; cursor:pointer; display:inline-flex; align-items:center; justify-content:center; gap:8px; font-family:inherit;}
.btn--ghost{background:transparent; color:var(--primary); border:2px solid var(--primary); box-shadow:var(--shadow)}
.btn--primary{background:var(--primary); color:#fff; box-shadow:var(--shadow)}
.btn--whatsapp{background:var(--whatsapp); color:#fff; box-shadow:var(--shadow)}
.btn--whatsapp:hover{background:#1ebe57}
.btn:hover{transform:translateY(-2px); box-shadow:var(--shadow-lg)}
.btn--primary:hover{background:var(--primary-600)}
.btn--ghost:hover{background:var(--primary-50)}
.btn svg{width:18px; height:18px; flex-shrink:0}

/* Hero */
.hero{position:relative; padding:80px 0 60px; overflow:hidden}
.hero::before{
  content:""; position:absolute; inset:-20% -10% auto -10%; height:80%; z-index:-1;
  background:radial-gradient(ellipse 50% 40% at 50% 0%, rgba(194,87,162,.1), transparent 70%);
}
.hero__grid{display:grid; grid-template-columns:1fr .9fr; gap:48px; align-items:center}
.kicker{color:var(--primary-700); font-weight:700; letter-spacing:.1em; text-transform:uppercase; font-size:.85rem; margin-bottom:8px;}
h1{font-size:clamp(32px, 4.5vw, 48px); line-height:1.15; margin:.3em 0}
.lead{font-size:1.1rem; line-height:1.6; color:var(--muted); max-width:55ch}
.hero__actions{display:flex; gap:12px; margin-top:24px; flex-wrap:wrap}

/* Photo card */
.photo-card{
  background:#fff; border-radius:20px; box-shadow:var(--shadow-lg); padding:16px; position:relative;
  border:1px solid var(--border-color); margin:0;
}
.photo{
  aspect-ratio:4 / 3; width:100%; border-radius:14px; overflow:hidden;
  background:linear-gradient(135deg, #f5eef8, #fdfbff);
}
.photo img{width:100%; height:100%; object-fit:cover; object-position:center 20%}
.badge{
  position:absolute; left:24px; bottom:24px; background:rgba(255,255,255,.85); backdrop-filter:blur(5px);
  color:var(--primary-800); padding:10px 14px; border-radius:12px; font-weight:700;
  box-shadow:var(--shadow); border:1px solid rgba(255,255,255,.9);
}

/* Sezioni e Cards */
.section{padding:72px 0}
.section h2{font-size:clamp(26px, 3.5vw, 36px); margin:0 0 12px; text-align:center}
.section p.section-lead{color:var(--muted); margin:0 auto 36px; text-align:center; max-width:60ch; font-size:1.05rem; line-height:1.6;}

.cards{display:grid; grid-template-columns:repeat(auto-fit, minmax(240px, 1fr)); gap:24px}
.card{background:var(--card-bg); border-radius:16px; padding:24px; box-shadow:var(--shadow); border:1px solid var(--border-color)}
.card:hover{transform:translateY(-5px); box-shadow:var(--shadow-lg)}
.card .icon{width:48px; height:48px; border-radius:12px; display:grid; place-items:center; color:#fff; font-weight:800;
  background:linear-gradient(135deg, var(--primary), var(--primary-700)); margin-bottom:16px}
.card .icon svg{width:24px; height:24px; color:white;}
.card h3{margin:0 0 8px; font-size:1.2rem; color:#111827}
.card p{margin:0 0 16px; color:var(--muted); line-height:1.6}
.card a{font-weight:600; display:inline-flex; align-items:center; gap:4px}
.card a:hover{color:var(--primary-600); gap:8px;}

/* About */
.about{display:grid; grid-template-columns:.9fr 1.1fr; gap:48px; align-items:center}
.about h2, .about p.section-lead{text-align:left; margin-left:0;}
.about__photo{max-width:480px; width:100%; justify-self:center}
.about__photo .photo{aspect-ratio:4 / 5}
.about__photo .photo img{object-position:center 15%}
.pill{display:inline-block; background:var(--primary-100); color:var(--primary-800); padding:6px 12px; border-radius:999px; font-weight:600; font-size:.9rem; margin-bottom:12px}
.about ul li{display:flex; align-items:center; gap:10px; margin-bottom:8px; color:var(--muted)}
.about ul li::before{
  content:''; display:block; width:20px; height:20px; flex-shrink:0; background-color:var(--primary-100);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='%23c257a2'%3E%3Cpath fill-rule='evenodd' d='M16.707 5.293a1 1 0 010 1.414l-8 8a1 1 0 01-1.414 0l-4-4a1 1 0 011.414-1.414L8 12.586l7.293-7.293a1 1 0 011.414 0z' clip-rule='evenodd' /%3E%3C/svg%3E");
  background-size:14px; background-repeat:no-repeat; background-position:center;
  border-radius:50%;
}

/* Booking */
.booking{display:grid; grid-template-columns:1.1fr .9fr; gap:32px; align-items:start}
.booking h2, .booking p.section-lead{text-align:left; margin-left:0;}
.form{background:#fff; border-radius:20px; padding:32px; box-shadow:var(--shadow-lg); border:1px solid var(--border-color)}
.form .section-lead{margin:0 0 24px; text-align:left}
.field{display:flex; flex-direction:column; gap:8px; margin-bottom:18px; min-width:0}
.field-row{display:grid; grid-template-columns:1fr 1fr; gap:16px}
.label{font-weight:600; color:#374151; font-size:.9rem}
.fieldset{border:0; padding:0; margin:0 0 18px; min-width:0}
.fieldset legend{padding:0; margin-bottom:10px}
.input, .textarea{border:1px solid var(--border-color); padding:12px 14px; border-radius:12px; font-size:1rem; background-color:#f9fafb; font-family:inherit; color:#111827; width:100%}
.input[type="date"], .input[type="time"]{min-height:48px}
.input::placeholder, .textarea::placeholder{color:#9ca3af}
.input:focus, .textarea:focus{outline:none; box-shadow:var(--ring); border-color:var(--primary); background-color:#fff;}
.textarea{resize:vertical; min-height:96px;}

/* Scelta del tipo di colloquio (schede al posto del menu a tendina) */
.choices{display:grid; gap:10px}
.choice{position:relative; display:flex; align-items:center; gap:14px; padding:14px 16px; border:1px solid var(--border-color); border-radius:14px; background:#f9fafb; cursor:pointer}
.choice:hover{border-color:var(--primary-100); background:#fff; box-shadow:var(--shadow)}
.choice input{position:absolute; opacity:0; width:1px; height:1px; pointer-events:none}
.choice__dot{width:20px; height:20px; border-radius:50%; border:2px solid #d1d5db; flex-shrink:0; position:relative; background:#fff}
.choice input:checked ~ .choice__dot{border-color:var(--primary)}
.choice input:checked ~ .choice__dot::after{content:''; position:absolute; inset:3px; border-radius:50%; background:var(--primary)}
.choice:has(input:checked){border-color:var(--primary); background:var(--primary-50); box-shadow:var(--ring)}
.choice:has(input:focus-visible){box-shadow:var(--ring)}
.choice__body{flex:1; display:flex; flex-direction:column; min-width:0}
.choice__title{font-weight:600; color:#111827}
.choice__meta{font-size:.85rem; color:var(--muted)}
.choice__price{font-weight:800; color:var(--primary-700); white-space:nowrap; font-size:1.05rem}
.choice__price.is-free{color:#16a34a}
.form .btn--whatsapp{width:100%; padding:15px 18px; font-size:1rem; margin-top:4px}

/* Tariffe */
.price-list{display:flex; flex-direction:column; gap:14px; margin-top:4px;}
.price-row{display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding-bottom:12px; border-bottom:1px dashed var(--border-color);}
.price-row:last-child{border-bottom:none; padding-bottom:0;}
.price-row .price-label{color:#111827; font-weight:600;}
.price-row .price-label small{display:block; color:var(--muted); font-weight:400; font-size:.82rem; margin-top:2px;}
.price-row .price-value{color:var(--primary-700); font-weight:800; font-size:1.1rem; white-space:nowrap;}
.price-row .price-value.is-free{color:#16a34a}

/* FAQ */
.faq{max-width:760px; margin:0 auto; display:flex; flex-direction:column; gap:12px;}
.faq-item{background:#fff; border:1px solid var(--border-color); border-radius:12px; padding:18px 20px; box-shadow:var(--shadow);}
.faq-item summary{cursor:pointer; font-weight:700; color:#111827; list-style:none; display:flex; justify-content:space-between; align-items:center; gap:12px;}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary::after{content:'+'; font-size:1.4rem; line-height:1; color:var(--primary); font-weight:400; transition:transform .2s ease;}
.faq-item[open] summary::after{transform:rotate(45deg);}
.faq-item p{margin:12px 0 0; color:var(--muted); line-height:1.6}

/* Footer */
footer{margin-top:40px; background:#fff; border-top:1px solid var(--border-color)}
.footgrid{padding:48px 0 24px}
.footgrid h2{text-align:left}
.footgrid .section-lead{text-align:left; margin-left:0}
.small{color:var(--muted); font-size:.95rem}
#contatti h2, #contatti p.section-lead{text-align:left; margin-left:0;}
.footbar{padding:24px 0; display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; border-top:1px solid var(--border-color)}
.footbar nav{display:flex; gap:14px; flex-wrap:wrap}

/* WhatsApp floating button */
.whatsapp-float{
  position:fixed; right:24px; bottom:24px; z-index:60;
  width:60px; height:60px; border-radius:50%;
  background:var(--whatsapp); color:#fff; display:grid; place-items:center;
  box-shadow:0 8px 20px rgba(37,211,102,.45);
  animation:pulse 2.5s infinite;
}
.whatsapp-float:hover{transform:translateY(-4px) scale(1.06); box-shadow:0 12px 28px rgba(37,211,102,.55);}
.whatsapp-float svg{width:30px; height:30px;}
@keyframes pulse{
  0%{box-shadow:0 0 0 0 rgba(37,211,102,.5), 0 8px 20px rgba(37,211,102,.4);}
  70%{box-shadow:0 0 0 14px rgba(37,211,102,0), 0 8px 20px rgba(37,211,102,.4);}
  100%{box-shadow:0 0 0 0 rgba(37,211,102,0), 0 8px 20px rgba(37,211,102,.4);}
}

/* Modal */
.modal{position:fixed; inset:0; display:none; align-items:center; justify-content:center; background:rgba(17,24,39,.6); z-index:100; opacity:0; transition:opacity .2s ease}
.modal.open{display:flex; opacity:1}
.modal__card{background:#fff; border-radius:16px; padding:24px; width:min(560px, 92vw); box-shadow:var(--shadow-lg); transform:scale(.95); transition:transform .2s ease}
.modal.open .modal__card{transform:scale(1)}

/* Pagine legali */
.legal-page{padding:32px 0 72px}
.legal-back{display:inline-flex; align-items:center; gap:6px; font-weight:600; margin-bottom:20px}
.legal{max-width:820px; margin:0 auto; padding:48px 40px; background:#fff; border-radius:16px; box-shadow:var(--shadow); border:1px solid var(--border-color)}
.legal h1{font-size:clamp(28px, 4vw, 40px); margin:0 0 8px}
.legal h2{font-size:1.25rem; margin:2rem 0 .6rem}
.legal h3{font-size:1.05rem; margin:1.4rem 0 .4rem}
.legal p, .legal li{line-height:1.75; color:var(--text)}
.legal ul{list-style:disc; padding-left:1.4rem}
.legal li{margin-bottom:.4rem}
.legal .updated{color:var(--muted); font-size:.95rem; margin-bottom:24px}
.legal .note{background:var(--primary-50); border:1px solid var(--primary-100); border-radius:12px; padding:14px 16px; color:var(--primary-800)}
.legal table{width:100%; border-collapse:collapse; margin:12px 0 20px; font-size:.95rem}
.legal th, .legal td{padding:10px 12px; border:1px solid var(--border-color); text-align:left; vertical-align:top}
.legal th{background:var(--primary-50); color:var(--primary-800)}

/* Responsive */
@media (max-width: 980px){
  .hero{padding:48px 0;}
  .hero__grid, .about, .booking{grid-template-columns:1fr; gap:40px;}
  .photo-card{margin:0 auto; max-width:450px;}
  .about > div:first-child{order:1}
  .section h2, .section p.section-lead{text-align:center;}
  .booking h2, .booking p.section-lead, #contatti h2, #contatti p.section-lead{text-align:left;}
  .about h2, .about p.section-lead{text-align:left;}
}
@media (max-width: 640px){
  .menu{display:none}
  .hero__grid{gap:32px}
  .whatsapp-float{right:16px; bottom:16px; width:54px; height:54px;}
  .legal{padding:32px 22px;}
  .form{padding:24px 20px;}
}
@media (max-width: 480px){
  .field-row{grid-template-columns:1fr}
  .choice{padding:12px 14px}
}