/* Base styles (restored) */
:root{
  --blue:#0D3057;
  --ochre:#C3922D;
  --pearl:#F8F5F0;
  --ink:#0a1524;
  --bg:var(--pearl);
  --glass: rgba(255,255,255,0.18);
  --shadow: rgba(0,0,0,0.22);
}

/* Stili link coerenti con la palette */
a:not(.btn) {
  color: var(--blue);
  text-decoration: none;
  transition: color 0.3s ease;
}

a:not(.btn):hover, a:not(.btn):focus {
  color: var(--ochre);
  text-decoration: underline;
}

/* Link su sfondo scuro (hero) - escludendo bottoni */
.hero a:not(.btn) {
  color: var(--ochre);
}

.hero a:not(.btn):hover, .hero a:not(.btn):focus {
  color: #fff;
  text-decoration: underline;
}

/* Link nei contenuti chiari - escludendo bottoni */
.section a:not(.btn) {
  color: var(--blue);
}

.section a:not(.btn):hover, .section a:not(.btn):focus {
  color: var(--ochre);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;color:#142033;background:var(--bg);line-height:1.65;font-size:1.2rem}
.skip-link{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.skip-link:focus{position:fixed;left:1rem;top:1rem;width:auto;height:auto;padding:.5rem .75rem;background:#000;color:#fff;z-index:9999;border-radius:.5rem}
.site-header{position:sticky;top:0;z-index:9999;backdrop-filter:saturate(1.2) blur(8px);background:rgba(255,255,255,.78);border-bottom:1px solid rgba(13,48,87,.08)}
.top-nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;max-width:1100px;margin:0 auto;padding:.75rem 1rem}
.logo{font-weight:800;text-decoration:none;color:var(--blue);letter-spacing:.5px}.logo span{color:var(--ochre)}
.menu{display:flex;gap:1rem;list-style:none;margin:0;padding:0}.menu a{color:#1a2c45;text-decoration:none;padding:.5rem .65rem;border-radius:.6rem}
.menu a:hover,.menu a:focus{background:rgba(12,48,87,.08)}
.nav-toggle{display:none}
.hero{position:relative;display:grid;place-items:center;min-height:80vh;color:#fff;background-image:var(--bg-url);background-size:cover;background-position:center;background-attachment:fixed}
.hero .hero__overlay{position:relative;z-index:1;max-width:1000px;margin:0 1rem;padding:2rem 2.5rem;border-radius:18px;box-shadow:0 8px 32px var(--shadow);transition:all 0.4s ease;text-align:center}
.hero .hero__overlay:hover{background:linear-gradient(to bottom right, rgba(13,48,87,.45), rgba(12,12,16,.35));backdrop-filter:blur(16px) saturate(1.3);border:1px solid rgba(255,255,255,.4);box-shadow:0 12px 40px var(--shadow)}
.glass{background:linear-gradient(to bottom right, rgba(13,48,87,.30), rgba(12,12,16,.22));backdrop-filter:blur(12px) saturate(1.15);border:1px solid rgba(255,255,255,.28)}
.hero h1{font-family:"Playfair Display",serif;font-size:clamp(3.6rem,5vw,4.8rem);margin:.25rem 0 .5rem;line-height:1.1}
.lead{font-size:clamp(2.25rem,1.6vw,2.45rem);line-height:1.2;margin-bottom:0.5rem}
.cta-row{display:flex;gap:.75rem;flex-wrap:wrap;margin-top:2.2rem;justify-content:center}
.btn{background:var(--ochre);color:#1b1202;padding:.8rem 1.05rem;border-radius:.7rem;text-decoration:none;border:none;cursor:pointer;font-weight:700;transition:all 0.3s ease;transform:translateY(0)}
.btn:hover,.btn:focus{background:#B07A1F;color:#fff;transform:translateY(-2px);box-shadow:0 4px 12px rgba(195,146,45,0.3)}
.btn--ghost{background:transparent;color:#fff;border:1px solid rgba(255,255,255,.7);transition:all 0.3s ease;transform:translateY(0)}
.btn--ghost:hover,.btn--ghost:focus{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.9);transform:translateY(-2px);box-shadow:0 4px 12px rgba(255,255,255,0.2)}
.btn--small{padding:.5rem .8rem;font-size:1.1rem}
.to-top{position:absolute;right:1rem;bottom:1rem;border-radius:999px;border:none;width:42px;height:42px;background:rgba(0,0,0,.4);color:#fff;cursor:pointer;display:none}
.section{padding:4.2rem 1rem}.section--alt{background:linear-gradient(180deg, rgba(255,255,255,.65) 0%, rgba(255,255,255,.95) 100%)}.container{max-width:1100px;margin:0 auto}
.section__head h2{font-family:"Playfair Display",serif;font-size:clamp(2.9rem,2.8vw,3.5rem);margin:0 0 .5rem}
.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}

/* Layout da libro delle fiabe per Chi sono */
.story-layout {
  position: relative;
  max-width: 100%;
}

.story-photo {
  float: right;
  margin: 0 0 1rem 2rem;
  width: 400px;
}

.story-photo img {
  width: 100%;
  height: auto;
  object-fit: cover;
  aspect-ratio: 2/3;
  border-radius: 14px;
  box-shadow: 0 8px 26px rgba(0,0,0,.22);
  display: block;
}

.story-photo figcaption {
  font-size: 1.12rem;
  color: #4a5568;
  margin-top: .4rem;
  text-align: center;
  font-style: italic;
}

.story-text {
  /* Testo scorre naturalmente intorno alla foto */
}

.story-intro {
  margin-top: 0;
  font-size: 1.1rem;
  line-height: 1.7;
}

.story-text p {
  margin-bottom: 1.2rem;
  line-height: 1.6;
}

.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem}
.c3{position:relative;min-height:320px;background-image:var(--bg-url);background-size:cover;background-position:center;border-radius:16px;overflow:hidden;box-shadow:0 10px 26px rgba(0,0,0,.18)}
.c3__content{position:absolute;inset:auto 1rem 1rem 1rem;padding:1.1rem;border-radius:14px}
.timeline{list-style:none;margin:2rem 0;padding:0;position:relative}.timeline::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:rgba(13,48,87,.2)}
.tl-item{position:relative;margin:1.6rem 0}.tl-left{padding-right:55%}.tl-right{padding-left:55%}.tl-center{padding:0 30%}
.tl-item details{background:#fff;border:1px solid rgba(13,48,87,.12);border-radius:12px;padding:.9rem 1rem;box-shadow:0 6px 20px rgba(0,0,0,.06)}.tl-item summary{cursor:pointer;font-weight:700}
.badge{display:inline-block;background:var(--blue);color:#fff;border-radius:999px;font-size:.98rem;padding:.12rem .6rem;margin-right:.55rem}
.quiz{padding:1.1rem;border-radius:12px}.hidden{display:none}
.cards{position:relative;height:280px;max-width:700px;margin:1rem auto}.card{position:absolute;left:0;right:0;margin:auto;width:min(90%,640px);background:#fff;border-radius:12px;box-shadow:0 14px 36px rgba(0,0,0,.18);padding:1.1rem;transform-origin:bottom center;user-select:none;cursor:pointer;transition:all 0.3s ease;border:1px solid rgba(0,0,0,0.1);background:linear-gradient(145deg, #ffffff 0%, #f8f9fa 100%)}
.card:hover{transform:translateY(-5px) scale(1.02);box-shadow:0 20px 40px rgba(0,0,0,.25);border-color:var(--ochre)}
.card:focus{outline:2px solid var(--ochre);outline-offset:2px}
.card:not(:first-child){transform:translateY(6px) rotate(var(--rot, 0deg));filter:saturate(.96)}.card__quote{font-family:"Playfair Display",serif;font-size:1.38rem}.card__author{opacity:.75;margin-top:.55rem;font-size:1.15rem}
.contact-form label{display:block;font-weight:700;margin:.6rem 0}.contact-form input[type="text"],.contact-form input[type="email"],.contact-form textarea{width:100%;padding:.7rem;border:1px solid #cbd5e1;border-radius:10px;background:#fff}.contact-form .sr-only{position:absolute;left:-9999px}

/* Contact Form Modern */
.contact-form{max-width:600px;margin:0 auto;padding:1.5rem}
.form-group{margin-bottom:1rem}
.form-group--checkbox{margin-bottom:1.5rem}
.form-group--captcha{margin-bottom:1.5rem}
.form-label{display:block;font-weight:600;color:var(--blue);margin-bottom:0.5rem;font-size:1rem}
.form-input,.form-textarea{width:100%;padding:0.8rem;border:1px solid #e2e8f0;border-radius:12px;background:#fff;font-size:1rem;transition:all 0.3s ease;font-family:inherit}
.form-input:focus,.form-textarea:focus{outline:none;border-color:var(--ochre);box-shadow:0 0 0 3px rgba(195,146,45,0.1);transform:translateY(-1px)}
.form-input::placeholder,.form-textarea::placeholder{color:#94a3b8}
.form-textarea{resize:vertical;min-height:100px}
.checkbox-wrapper{display:flex;align-items:flex-start;gap:0.75rem}
.form-checkbox{width:1.25rem;height:1.25rem;margin-top:0.125rem;accent-color:var(--ochre)}
.checkbox-label{font-size:0.95rem;color:#64748b;line-height:1.5;font-weight:400}
.btn--submit{width:100%;padding:1rem 1.5rem;background:var(--ochre);color:#fff;border:none;border-radius:12px;font-size:1.1rem;font-weight:600;display:flex;align-items:center;justify-content:center;gap:0.5rem;transition:all 0.3s ease;cursor:pointer}
.btn--submit:hover{background:#B07A1F;transform:translateY(-2px);box-shadow:0 8px 25px rgba(195,146,45,0.3)}
.btn-icon{width:1.25rem;height:1.25rem}
.hidden{display:none}

/* Back to Top Button */
.back-to-top{position:fixed;bottom:2rem;right:2rem;width:3rem;height:3rem;background:var(--ochre);color:#fff;border:none;border-radius:50%;cursor:pointer;box-shadow:0 4px 12px rgba(195,146,45,0.3);transition:all 0.3s ease;z-index:1000;display:flex;align-items:center;justify-content:center}
.back-to-top:hover{background:#B07A1F;transform:translateY(-2px);box-shadow:0 6px 20px rgba(195,146,45,0.4)}
.back-to-top svg{width:1.5rem;height:1.5rem}
.back-to-top.show{opacity:1;visibility:visible;transform:translateY(0)}
.back-to-top.hidden{opacity:0;visibility:hidden;transform:translateY(10px)}

/* Floating Notification for Mobile */
.floating-notification{position:fixed;top:20px;right:20px;background:#fff;border-radius:12px;box-shadow:0 8px 32px rgba(0,0,0,0.15);padding:1rem 1.25rem;z-index:9999;max-width:300px;transform:translateX(100%);transition:transform 0.3s ease;border-left:4px solid}
.floating-notification.show{transform:translateX(0)}
.floating-notification.success{border-left-color:#10b981}
.floating-notification.error{border-left-color:#ef4444}
.floating-notification.warning{border-left-color:#f59e0b}
.floating-notification-content{display:flex;align-items:center;gap:0.75rem}
.floating-notification-icon{width:1.25rem;height:1.25rem;flex-shrink:0}
.floating-notification-text{font-size:0.9rem;line-height:1.4}
.floating-notification-close{position:absolute;top:0.5rem;right:0.5rem;background:none;border:none;color:#94a3b8;cursor:pointer;padding:0.25rem;border-radius:4px;transition:color 0.2s ease}
.floating-notification-close:hover{color:#64748b}

/* Contact Grid Layout */
.contact-grid{display:grid;grid-template-columns:1fr 1fr;gap:3rem;max-width:1000px;margin:0 auto;align-items:start}
.contact-info{padding:2rem;background:rgba(255,255,255,0.8);border-radius:16px;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,0.2)}
.contact-info h3{font-size:1.5rem;font-weight:600;color:var(--blue);margin-bottom:2rem}
.contact-item{display:flex;align-items:center;gap:1rem;margin-bottom:1.5rem}
.contact-icon{width:3rem;height:3rem;background:rgba(195,146,45,0.1);border-radius:12px;display:flex;align-items:center;justify-content:center;color:var(--ochre)}
.contact-icon svg{width:1.5rem;height:1.5rem}
.contact-details{flex:1}
.contact-label{font-weight:600;color:var(--blue);margin-bottom:0.25rem;font-size:0.95rem}
.contact-value{color:#64748b;font-size:1rem}
.contact-email{text-decoration:none;color:var(--ochre);transition:color 0.3s ease}
.contact-email:hover{color:#B07A1F;text-decoration:underline}
.email-svg{display:inline-block;vertical-align:middle}
.email-svg text{font-family:inherit}
.contact-response{margin-top:2rem;padding-top:2rem;border-top:1px solid rgba(13,48,87,0.1)}
.contact-response h4{font-size:1.1rem;font-weight:600;color:var(--blue);margin-bottom:0.75rem}
.contact-response p{color:#64748b;line-height:1.6;font-size:0.95rem}
.contact-form-wrapper{flex:1}

/* Form Error Messages */
.floating-message{position:fixed;top:20px;right:20px;padding:1rem 1.5rem;border-radius:12px;font-size:0.95rem;font-weight:500;z-index:10000;box-shadow:0 8px 25px rgba(0,0,0,0.15);max-width:350px;transform:translateX(400px);transition:transform 0.4s ease;backdrop-filter:blur(10px)}
.floating-message.show{transform:translateX(0)}
.floating-message.success{background:rgba(16,185,129,0.95);border:1px solid #10b981;color:#fff}
.floating-message.error{background:rgba(239,68,68,0.95);border:1px solid #ef4444;color:#fff}
.floating-message.warning{background:rgba(245,158,11,0.95);border:1px solid #f59e0b;color:#fff}
.floating-message.info{background:rgba(59,130,246,0.95);border:1px solid #3b82f6;color:#fff}
.floating-message-content{display:flex;align-items:center;gap:0.75rem}
.floating-message-icon{width:1.25rem;height:1.25rem;flex-shrink:0}
.floating-message-text{flex:1;line-height:1.4}
.form-group.has-error .form-input,.form-group.has-error .form-textarea{border-color:#f87171;box-shadow:0 0 0 3px rgba(248,113,113,0.1)}
.form-group.has-error .form-label{color:#991b1b}
.form-group.has-error .form-checkbox{accent-color:#f87171}
.form-group.has-error .checkbox-label{color:#991b1b}
.form-group.has-error .captcha-question{color:#991b1b}
.form-group{position:relative}

/* Captcha Styles */
.captcha-container{display:flex;align-items:center;gap:1rem}
.captcha-question{font-size:1.1rem;font-weight:600;color:var(--blue);min-width:120px}
.captcha-input{width:100px;text-align:center}

/* Responsive Contact */
@media (max-width:768px){.contact-grid{grid-template-columns:1fr;gap:2rem}.contact-info{padding:1.5rem}}

.site-footer{padding:2rem 1rem;text-align:center;border-top:1px solid rgba(13,48,87,.1)}
.parallax{background-attachment:fixed}
@media (max-width:1000px){.cards3{grid-template-columns:1fr;gap:.9rem}.grid.two{grid-template-columns:1fr}.story-photo{float:none;margin:0 auto 2rem;width:100%;max-width:400px}.story-photo img{aspect-ratio:2/3;object-fit:cover;height:auto}.tl-left,.tl-right,.tl-center{padding:0}.timeline::before{left:20px}.tl-item{padding-left:40px}}

/* Menu hamburger su mobile e tablet */
@media (max-width: 1024px) {
  .nav-toggle {
    display: block;
    background: none;
    border: none;
    font-size: 1.7rem;
    cursor: pointer;
    padding: 0.5rem;
    color: var(--blue);
  }
  
  .menu {
    display: none;
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    background: rgba(255,255,255,.95);
    backdrop-filter: blur(8px);
    flex-direction: column;
    padding: 1rem;
    border-bottom: 1px solid rgba(13,48,87,.08);
    box-shadow: 0 4px 12px rgba(0,0,0,.1);
    z-index: 9999;
  }
  
  .menu.open {
    display: flex;
  }
  
  .menu li {
    margin: 0.5rem 0;
  }
  
  .menu a {
    display: block;
    padding: 0.75rem 1rem;
    border-radius: 0.5rem;
  }
}

/* Fix per immagine hero su mobile */
@media (max-width: 768px) {
  .hero {
    background-attachment: scroll !important;
    background-position: center center !important;
    overflow: hidden;
  }
  
  .hero .hero__overlay {
    margin: 0 0.5rem;
    padding: 1.5rem 1.5rem;
    overflow: hidden;
  }
}

@media (prefers-reduced-motion:reduce){*{animation:none !important;transition:none !important}.parallax{background-attachment:scroll}}

/* Quiz Avanzato */
.quiz {
  padding: 2rem;
  border-radius: 12px;
  max-width: 800px;
  margin: 0 auto;
}

.quiz__start {
  text-align: center;
}

.quiz__start .hint {
  margin-top: 1rem;
  color: #666;
  font-size: 1rem;
}

/* Header quiz */
.quiz__header {
  margin-bottom: 2rem;
}

.quiz__counter {
  font-size: 1.1rem;
  color: var(--blue);
  font-weight: 600;
  margin-bottom: 0.5rem;
}

.quiz__progress {
  width: 100%;
  height: 8px;
  background: rgba(13, 48, 87, 0.1);
  border-radius: 4px;
  overflow: hidden;
}

.quiz__progress-bar {
  height: 100%;
  background: var(--ochre);
  width: 0%;
  transition: width 0.3s ease;
}

/* Domanda */
.quiz__question {
  font-size: 1.3rem;
  font-weight: 600;
  color: var(--blue);
  margin-bottom: 2rem;
  line-height: 1.5;
}

/* Opzioni */
.quiz__options {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-bottom: 2rem;
}

.quiz__option {
  padding: 1rem 1.5rem;
  border: 2px solid rgba(13, 48, 87, 0.2);
  border-radius: 8px;
  background: #fff;
  color: var(--blue);
  font-size: 1.1rem;
  text-align: left;
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
}

.quiz__option:hover:not(:disabled) {
  border-color: var(--ochre);
  background: rgba(195, 146, 45, 0.05);
  transform: translateY(-2px);
}

.quiz__option:disabled {
  cursor: not-allowed;
}

.quiz__option--correct {
  border-color: #10b981;
  background: #ecfdf5;
  color: #065f46;
}

.quiz__option--incorrect {
  border-color: #ef4444;
  background: #fef2f2;
  color: #991b1b;
}

.checkmark, .wrong-mark {
  position: absolute;
  right: 1rem;
  top: 50%;
  transform: translateY(-50%);
  font-weight: bold;
  font-size: 1.2rem;
}

.checkmark {
  color: #10b981;
}

.wrong-mark {
  color: #ef4444;
}

/* Feedback */
.quiz__feedback {
  margin: 2rem 0;
  padding: 1.5rem;
  border-radius: 8px;
  border: 1px solid;
}

.quiz__feedback--correct {
  background: #ecfdf5;
  border-color: #10b981;
}

.quiz__feedback--incorrect {
  background: #eff6ff;
  border-color: #3b82f6;
}

.quiz__feedback-content {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
}

.quiz__feedback-icon {
  flex-shrink: 0;
}

.quiz__icon {
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  color: white;
}

.quiz__icon--correct {
  background: #10b981;
}

.quiz__icon--info {
  background: #3b82f6;
}

.quiz__feedback-text {
  flex: 1;
}

.quiz__feedback-title {
  font-weight: 600;
  margin-bottom: 0.5rem;
  font-size: 1.1rem;
}

.quiz__feedback--correct .quiz__feedback-title {
  color: #065f46;
}

.quiz__feedback--incorrect .quiz__feedback-title {
  color: #1e40af;
}

.quiz__feedback-explanation {
  line-height: 1.6;
  font-size: 1rem;
}

.quiz__feedback--correct .quiz__feedback-explanation {
  color: #047857;
}

.quiz__feedback--incorrect .quiz__feedback-explanation {
  color: #1e3a8a;
}

/* Next button */
.quiz__next {
  text-align: center;
  margin-top: 2rem;
}

/* Risultati */
.quiz__results {
  text-align: center;
  padding: 2rem 0;
}

.quiz__results-icon {
  width: 120px;
  height: 120px;
  border-radius: 50%;
  margin: 0 auto 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 2rem;
  font-weight: bold;
  color: white;
}

.quiz__results-icon--excellent {
  background: #10b981;
}

.quiz__results-icon--good {
  background: #3b82f6;
}

.quiz__results-icon--improve {
  background: #f59e0b;
}

.quiz__results-icon-content {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.quiz__results-icon-text {
  font-size: 2.5rem;
  font-weight: bold;
}

.quiz__results-score {
  font-size: 1.2rem;
  color: var(--blue);
  font-weight: 600;
  margin-bottom: 1rem;
}

.quiz__results-message {
  font-size: 1.1rem;
  color: #666;
  margin-bottom: 2rem;
  line-height: 1.5;
}

/* Responsive */
@media (max-width: 768px) {
  .quiz {
    padding: 1.5rem;
  }
  
  .quiz__question {
    font-size: 1.2rem;
  }
  
  .quiz__option {
    padding: 0.8rem 1rem;
    font-size: 1rem;
  }
  
  .quiz__results-icon {
    width: 100px;
    height: 100px;
  }
  
  .quiz__results-icon-text {
    font-size: 2rem;
  }
}

.contact-encoded{text-decoration:none;color:var(--ochre);transition:all 0.3s ease;cursor:pointer;font-style:italic}
.contact-encoded:hover{color:#B07A1F;text-decoration:underline;transform:translateX(2px)}
.contact-encoded.revealed{font-style:normal;cursor:default}
.contact-encoded.revealed:hover{transform:none}
.contact-encoded.revealed.non-clickable{cursor:default;opacity:0.7}
.contact-encoded.revealed.non-clickable:hover{transform:none;text-decoration:none}

/* Animazione vibrante per Quizzione */
@keyframes vibrate {
  0%, 100% { transform: translateX(0); }
  25% { transform: translateX(-2px); }
  50% { transform: translateX(2px); }
  75% { transform: translateX(-1px); }
}

/* Animazione per la i che esce verticalmente */
@keyframes slideOut {
  0% { 
    transform: translateY(0);
    opacity: 1;
  }
  100% { 
    transform: translateY(-20px);
    opacity: 0;
  }
}

/* Stili per l'animazione Quizzione */
#quizzione h2 {
  transition: all 0.1s ease-in-out;
}

#quizzione h2 span {
  display: inline-block;
}
