
:root{
  --bg:#0b1220;
  --bg-2:#10192d;
  --bg-3:#13203a;
  --surface:#18233b;
  --surface-2:#1d2944;
  --surface-3:#223151;
  --ink:#eef2fb;
  --ink-soft:#d7ddef;
  --muted:#9cabc7;
  --line:rgba(210,221,245,.14);
  --line-strong:rgba(230,238,255,.22);
  --night:#0f1730;
  --moon:#efe2b3;
  --moon-soft:#f7f1dc;
  --lavender:#9d96d8;
  --lavender-soft:#c7c2ed;
  --sage:#7f9a8a;
  --sage-soft:#a8c1b3;
  --amber:#d7b47a;
  --rose:#d9a5ba;
  --sky:#7d92d6;
  --shadow:0 18px 48px rgba(4,10,22,.36);
  --radius:28px;
  --max:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif;
  color:var(--ink-soft);
  background:
    radial-gradient(circle at 12% 0%, rgba(157,150,216,.16), transparent 20%),
    radial-gradient(circle at 88% 12%, rgba(239,226,179,.12), transparent 16%),
    linear-gradient(180deg,var(--bg),var(--bg-2) 42%,var(--bg-3) 100%);
  line-height:1.75;
  font-size:18px;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit}
img{max-width:100%;display:block}
h1,h2,h3,.brand{font-family:ui-serif,Georgia,'Times New Roman',serif;color:var(--moon-soft)}
h1,h2,h3{line-height:1.08;margin:0 0 14px}
h1{font-size:clamp(2.5rem,6vw,5.2rem);letter-spacing:-.055em}
h2{font-size:clamp(2rem,4vw,3.15rem);letter-spacing:-.035em}
h3{font-size:1.35rem}
p,li{color:var(--ink-soft)}
.container{width:min(var(--max),calc(100% - 36px));margin:auto}
.site-header{
  position:sticky;top:0;z-index:50;
  background:rgba(11,18,32,.82);
  backdrop-filter:blur(16px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:14px 0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font-weight:800;letter-spacing:.01em}
.brand-mark{
  width:42px;height:42px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(180deg,rgba(239,226,179,.18),rgba(157,150,216,.18));
  box-shadow:inset 0 0 0 1px rgba(239,226,179,.15),0 6px 18px rgba(0,0,0,.22);
}
.nav-links{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.nav-links a,.footer a{padding:8px 12px;border-radius:999px;text-decoration:none;color:var(--ink-soft)}
.nav-links a:hover,.nav-links a.active{background:rgba(255,255,255,.06);border:1px solid var(--line);color:var(--moon-soft)}
.hero{
  background:
    radial-gradient(circle at 78% 20%, rgba(239,226,179,.12), transparent 25%),
    radial-gradient(circle at 18% 15%, rgba(157,150,216,.14), transparent 22%),
    linear-gradient(180deg,rgba(255,255,255,.02),transparent 35%);
  padding:82px 0 62px;overflow:hidden;
}
.hero-inner{display:grid;grid-template-columns:1.04fr .96fr;gap:42px;align-items:center}
.eyebrow{
  display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border-radius:999px;
  background:rgba(255,255,255,.05);color:var(--sage-soft);border:1px solid var(--line-strong);
  font-size:.9rem;font-weight:700;text-decoration:none;
}
.hero p,.section-lead{font-size:1.08rem;color:var(--muted);max-width:760px}
.hero-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px}
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:999px;
  background:linear-gradient(180deg,var(--sky),#677fc7);color:white;text-decoration:none;
  padding:13px 18px;font-weight:800;box-shadow:var(--shadow);cursor:pointer;font-family:inherit;font-size:1rem
}
.btn:hover{filter:brightness(1.06)}
.btn.secondary{background:rgba(255,255,255,.05);color:var(--moon-soft);border:1px solid var(--line);box-shadow:none}
.btn.light{background:rgba(127,154,138,.18);color:var(--ink);box-shadow:none;border:1px solid rgba(168,193,179,.18)}
.hero-card,.story-cover{
  border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);
  background:rgba(255,255,255,.035);padding:10px;border:1px solid var(--line);transform:rotate(1deg)
}
.hero-card img,.story-cover img{border-radius:calc(var(--radius) - 10px);aspect-ratio:4/3;object-fit:cover}
.section{padding:68px 0}
.section-head{display:flex;justify-content:space-between;align-items:end;gap:24px;margin-bottom:24px}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.card,.feature,.side-card,.legal-box,.page-content,.story-content,.cookie-banner,.privacy-panel,.empty{
  background:rgba(24,35,59,.88);
  border:1px solid var(--line);
  box-shadow:var(--shadow);
}
.card{border-radius:24px;overflow:hidden;display:flex;flex-direction:column}
.card-media img{aspect-ratio:4/3;object-fit:cover;width:100%}
.card-body{padding:18px;flex:1}
.card h3 a{text-decoration:none}
.card p{margin:0;color:var(--muted);font-size:.98rem}
.card-footer{display:flex;justify-content:space-between;align-items:center;border-top:1px solid var(--line);padding:14px 18px}
.read-link{font-weight:800;text-decoration:none;color:var(--moon-soft)}
.meta{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.pill{display:inline-flex;padding:6px 10px;border-radius:999px;background:rgba(125,146,214,.17);font-size:.83rem;font-weight:800;color:#dbe4ff}
.pill.theme{background:rgba(127,154,138,.18);color:#cde4d8}
.feature-band{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:24px}
.feature,.side-card,.legal-box{border-radius:24px;padding:20px}
.feature b{display:block;margin-bottom:6px;color:var(--moon-soft)}
.feature span,.small,.feature p{color:var(--muted);font-size:.95rem}
.filters{display:grid;grid-template-columns:1.2fr .8fr .6fr;gap:12px;margin:22px 0}
.input,.select{
  width:100%;border:1px solid var(--line);border-radius:999px;padding:13px 16px;
  background:rgba(255,255,255,.04);font:inherit;color:var(--ink-soft)
}
.input::placeholder{color:#7f8ca9}
.empty{display:none;padding:18px;border-radius:20px}
.story-hero{
  padding:54px 0;
  background:radial-gradient(circle at 80% 18%, rgba(239,226,179,.10), transparent 24%),linear-gradient(180deg,#111a2d,#15213a);
}
.story-hero-inner{display:grid;grid-template-columns:1fr .72fr;gap:32px;align-items:center}
.story-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:32px}
.story-content,.page-content{border-radius:30px;padding:clamp(24px,4vw,48px)}
.story-content p{font-size:1.16rem;line-height:1.95;color:var(--ink)}
.moral{margin-top:28px;padding:20px;border-radius:22px;background:rgba(127,154,138,.16);border:1px solid rgba(168,193,179,.16);font-weight:800;color:var(--moon-soft)}
.montessori-note{margin-top:16px;padding:18px;border-radius:20px;background:rgba(239,226,179,.08);border:1px solid rgba(239,226,179,.16)}
.story-nav{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-top:30px}
.sidebar{display:flex;flex-direction:column;gap:16px}
.footer{background:#0a1020;color:#fff;padding:42px 0;margin-top:50px;border-top:1px solid var(--line)}
.footer-grid{display:grid;grid-template-columns:1.2fr .8fr .8fr;gap:22px}
.footer .small,.footer p{color:rgba(255,255,255,.72)}
.footer a{color:#fff;border:1px solid rgba(255,255,255,.12);display:inline-block;margin:4px 4px 0 0;background:rgba(255,255,255,.02)}
.ad-slot{
  border:1px dashed rgba(215,180,122,.45);
  background:linear-gradient(135deg,rgba(255,255,255,.035),rgba(239,226,179,.05));
  border-radius:24px;min-height:96px;padding:18px;display:flex;align-items:center;justify-content:center;text-align:center;
  color:#d8ccb0;font-size:.93rem;margin:24px 0
}
.ad-slot::before{
  content:'Pubblicità';display:inline-flex;margin-right:10px;padding:4px 8px;border-radius:999px;
  background:rgba(255,255,255,.07);border:1px solid var(--line);font-weight:800;color:#f2e6be
}
.ad-slot[data-ad-size='sidebar']{min-height:260px}
.special-hero{background:radial-gradient(circle at 22% 10%, rgba(157,150,216,.12), transparent 22%),linear-gradient(180deg,#121b31,#1a2741)}
.special-badge{background:rgba(239,226,179,.08);border-color:rgba(239,226,179,.18);color:var(--moon-soft)}
.page-content h2{font-size:2rem;margin-top:1.4em}
.page-content ul{padding-left:1.2em}
.compliance-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.cookie-banner{
  position:fixed;left:18px;right:18px;bottom:18px;z-index:200;border-radius:24px;padding:18px;display:none
}
.cookie-banner.visible{display:block}
.cookie-banner-inner{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center}
.cookie-actions{display:flex;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.privacy-modal{position:fixed;inset:0;background:rgba(5,10,22,.68);z-index:210;display:none;place-items:center;padding:18px}
.privacy-modal.visible{display:grid}
.privacy-panel{width:min(720px,100%);max-height:88vh;overflow:auto;border-radius:26px;padding:24px}
.choice{display:flex;justify-content:space-between;gap:12px;border:1px solid var(--line);border-radius:18px;padding:14px;margin:12px 0;background:rgba(255,255,255,.02)}
.switch{display:inline-flex;align-items:center;gap:8px}
.switch input{width:22px;height:22px;accent-color:#7d92d6}
.sr-only{position:absolute;left:-9999px}
.ad-section{padding:24px 0 0}
.story-content .ad-slot{margin:30px 0}
.ad-slot-story-top{min-height:110px}
.ad-slot-story-bottom{min-height:110px}
.ad-slot[data-ad-size='leaderboard']{min-height:110px}
.page-content a,.story-content a,.side-card a,.feature a{color:var(--moon-soft)}
.btn.light{color:var(--moon-soft)}
::selection{background:rgba(157,150,216,.35);color:#fff}
:focus-visible{outline:2px solid var(--moon);outline-offset:3px;border-radius:8px}
@media(max-width:900px){
  .hero-inner,.story-hero-inner,.story-layout,.footer-grid{grid-template-columns:1fr}
  .grid,.feature-band,.compliance-grid{grid-template-columns:1fr 1fr}
  .filters{grid-template-columns:1fr}
  .cookie-banner-inner{grid-template-columns:1fr}
  .cookie-actions{justify-content:flex-start}
}
@media(max-width:620px){
  body{font-size:16px;line-height:1.7}
  .grid,.feature-band,.compliance-grid{grid-template-columns:1fr}
  .section-head{align-items:start;flex-direction:column}
  .nav{align-items:flex-start;flex-direction:column}
  .nav-links a{padding:8px 10px}
  .hero{padding-top:46px}
  .story-content p{font-size:1.05rem;line-height:1.88}
  .container{width:min(var(--max),calc(100% - 24px))}
}

.legal-kv{display:grid;grid-template-columns:220px 1fr;gap:10px 18px;margin:18px 0;padding:18px;border:1px solid var(--line);border-radius:22px;background:rgba(255,255,255,.025)}
.legal-kv dt{color:var(--muted);font-weight:800}.legal-kv dd{margin:0;color:var(--ink-soft)}
.status-ok,.status-warn,.status-todo{display:inline-flex;border-radius:999px;padding:4px 9px;font-weight:800;font-size:.82rem}.status-ok{background:rgba(127,154,138,.18);color:#cde4d8}.status-warn{background:rgba(215,180,122,.16);color:#f0d9aa}.status-todo{background:rgba(217,165,186,.15);color:#eec6d4}
.check-list li{margin:.55rem 0}.legal-notice{padding:16px 18px;border-radius:20px;background:rgba(239,226,179,.08);border:1px solid rgba(239,226,179,.16);color:var(--ink-soft)}
@media (prefers-reduced-motion: reduce){*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}
@media(max-width:620px){.legal-kv{grid-template-columns:1fr}.legal-kv dt{margin-top:8px}}


/* Global compliance additions */
.legal-notice{padding:16px 18px;border-radius:18px;background:rgba(239,226,179,.08);border:1px solid rgba(239,226,179,.18)}
.legal-kv{display:grid;grid-template-columns:210px minmax(0,1fr);gap:10px 18px;margin:18px 0}
.legal-kv dt{font-weight:800;color:var(--moon-soft)}
.legal-kv dd{margin:0;color:var(--ink-soft)}
.check-list{list-style:none;padding-left:0}
.check-list li{padding:10px 0;border-bottom:1px solid var(--line)}
.status-ok,.status-warn,.status-todo{display:inline-flex;align-items:center;padding:3px 8px;border-radius:999px;font-size:.78rem;font-weight:800;margin-right:8px}
.status-ok{background:rgba(127,154,138,.18);color:#cde4d8;border:1px solid rgba(127,154,138,.32)}
.status-warn{background:rgba(215,180,122,.16);color:#f2e6be;border:1px solid rgba(215,180,122,.32)}
.status-todo{background:rgba(217,165,186,.15);color:#f2cbd8;border:1px solid rgba(217,165,186,.30)}
.global-table{width:100%;border-collapse:collapse;margin:22px 0;font-size:.95rem}
.global-table th,.global-table td{border:1px solid var(--line);padding:12px;vertical-align:top}
.global-table th{background:rgba(255,255,255,.05);color:var(--moon-soft);text-align:left}
.global-table td{color:var(--ink-soft)}
.callout-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0}
@media(max-width:800px){.legal-kv{grid-template-columns:1fr}.callout-grid{grid-template-columns:1fr}.global-table{font-size:.88rem}.global-table th,.global-table td{padding:9px}}



/* Mobile/tablet readability hardening */
html, body{
  max-width:100%;
  overflow-x:hidden;
}
body{
  -webkit-text-size-adjust:100%;
}
img, svg, video, canvas{
  max-width:100%;
  height:auto;
}
button, .btn, .nav-links a, .read-link, input, select{
  min-height:44px;
}
.site-header{
  max-width:100vw;
}
.nav-links{
  max-width:100%;
}
.page-content, .story-content, .card, .feature, .side-card, .legal-box{
  overflow-wrap:anywhere;
}
.global-table{
  display:block;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.global-table table{
  width:100%;
}
.cookie-banner{
  max-height:78vh;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
}
.privacy-panel{
  max-height:86vh;
}
.story-content{
  scroll-margin-top:110px;
}
@media(max-width:900px){
  .hero-inner,.story-hero-inner,.story-layout,.footer-grid{
    grid-template-columns:1fr !important;
  }
  .story-cover{
    max-width:560px;
    margin-inline:auto;
    transform:none;
  }
  .sidebar{
    order:2;
  }
  .ad-slot[data-ad-size='sidebar']{
    min-height:100px;
  }
}
@media(max-width:720px){
  .site-header{
    position:sticky;
  }
  .nav{
    gap:10px;
  }
  .brand{
    width:100%;
    justify-content:flex-start;
  }
  .nav-links{
    width:100%;
    display:flex;
    gap:8px;
    overflow-x:auto;
    flex-wrap:nowrap;
    padding-bottom:4px;
    scrollbar-width:none;
  }
  .nav-links::-webkit-scrollbar{
    display:none;
  }
  .nav-links a{
    flex:0 0 auto;
    white-space:nowrap;
    font-size:.9rem;
    padding:8px 12px;
  }
  .hero{
    padding:42px 0 38px;
  }
  .hero-inner{
    gap:24px;
  }
  h1{
    font-size:clamp(2.25rem,11vw,3.5rem);
    letter-spacing:-.045em;
  }
  h2{
    font-size:clamp(1.75rem,8vw,2.55rem);
  }
  .hero p,.section-lead{
    font-size:1rem;
  }
  .hero-actions{
    flex-direction:column;
  }
  .btn{
    width:100%;
    text-align:center;
    padding:13px 16px;
  }
  .hero-card{
    transform:none;
  }
  .section{
    padding:44px 0;
  }
  .story-hero{
    padding:38px 0;
  }
  .story-content,.page-content{
    border-radius:22px;
    padding:22px;
  }
  .story-content p{
    font-size:1.08rem;
    line-height:1.88;
  }
  .legal-kv{
    grid-template-columns:1fr !important;
    gap:4px 0;
  }
  .legal-kv dd{
    margin-bottom:12px;
  }
  .cookie-banner{
    left:10px;
    right:10px;
    bottom:10px;
    border-radius:20px;
    padding:14px;
  }
  .cookie-actions{
    width:100%;
  }
  .cookie-actions .btn,
  .cookie-actions button{
    width:100%;
  }
  .choice{
    display:block;
  }
  .switch{
    margin-top:10px;
  }
}
@media(max-width:420px){
  .container{
    width:calc(100% - 20px);
  }
  body{
    font-size:16px;
  }
  .brand-mark{
    width:38px;
    height:38px;
  }
  .brand{
    font-size:1rem;
  }
  .nav-links a{
    font-size:.84rem;
  }
  .card-body{
    padding:16px;
  }
  .card-footer{
    padding:12px 16px;
  }
  .story-content,.page-content{
    padding:18px;
  }
  .story-content p{
    font-size:1.04rem;
  }
  .moral,.montessori-note,.legal-notice{
    padding:15px;
  }
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{
    animation-duration:.01ms !important;
    animation-iteration-count:1 !important;
    scroll-behavior:auto !important;
    transition-duration:.01ms !important;
  }
}


/* Multilingual additions */
.language-switcher{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 18px}
.lang-pill{display:inline-flex;align-items:center;justify-content:center;min-height:36px;padding:6px 10px;border:1px solid var(--line);border-radius:999px;text-decoration:none;background:rgba(255,255,255,.04);color:var(--ink-soft);font-size:.88rem}
.lang-pill.active{background:rgba(239,226,179,.12);color:var(--moon-soft);border-color:rgba(239,226,179,.30)}
@media(max-width:720px){.language-switcher{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.lang-pill{flex:0 0 auto}}



/* Language gateway */
.language-gateway-body{
  min-height:100vh;
  background:
    radial-gradient(circle at 80% 12%, rgba(239,226,179,.13), transparent 22%),
    radial-gradient(circle at 16% 8%, rgba(157,150,216,.17), transparent 24%),
    linear-gradient(180deg,#08101f,#10192d 55%,#13203a);
}
.language-gateway{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:28px 14px;
}
.language-panel{
  width:min(960px,100%);
  background:rgba(24,35,59,.82);
  border:1px solid var(--line);
  border-radius:32px;
  box-shadow:var(--shadow);
  padding:clamp(24px,5vw,54px);
  text-align:center;
}
.gateway-moon{
  width:76px;
  height:76px;
  display:grid;
  place-items:center;
  margin:0 auto 14px;
  border-radius:999px;
  background:rgba(239,226,179,.10);
  border:1px solid rgba(239,226,179,.20);
  font-size:2.2rem;
}
.language-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:14px;
  margin:30px 0 20px;
}
.language-card{
  display:flex;
  align-items:center;
  gap:12px;
  min-height:86px;
  padding:16px;
  border-radius:22px;
  text-decoration:none;
  text-align:left;
  background:rgba(255,255,255,.045);
  border:1px solid var(--line);
  transition:transform .2s ease, background .2s ease, border-color .2s ease;
}
.language-card:hover,
.language-card:focus-visible{
  transform:translateY(-2px);
  background:rgba(255,255,255,.075);
  border-color:rgba(239,226,179,.32);
}
.language-card .flag{
  width:46px;
  height:46px;
  display:grid;
  place-items:center;
  border-radius:999px;
  background:rgba(255,255,255,.06);
  font-size:1.55rem;
  flex:0 0 auto;
}
.language-card strong{
  display:block;
  color:var(--moon-soft);
  font-size:1.06rem;
}
.language-card small{
  display:block;
  color:var(--muted);
  font-size:.86rem;
  margin-top:2px;
}
.planned-languages{
  margin-top:18px;
  padding:16px;
  border-radius:20px;
  background:rgba(255,255,255,.035);
  border:1px solid var(--line);
  text-align:left;
}
.planned-languages summary{
  cursor:pointer;
  color:var(--moon-soft);
  font-weight:800;
}
.planned-languages-list{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin:14px 0;
}
.planned-lang{
  display:inline-flex;
  min-height:34px;
  align-items:center;
  padding:5px 10px;
  border-radius:999px;
  background:rgba(255,255,255,.05);
  border:1px solid var(--line);
  color:var(--ink-soft);
  font-size:.88rem;
}
.gateway-note,
.gateway-return-note{
  max-width:720px;
  margin:16px auto 0;
}
.gateway-return-note a{
  color:var(--moon-soft);
  font-weight:800;
}
@media(max-width:760px){
  .language-grid{
    grid-template-columns:1fr;
  }
  .language-card{
    min-height:74px;
  }
  .language-panel{
    border-radius:24px;
  }
}


/* Image compatibility hardening */
.gateway-illustration{
  width:min(340px,100%);
  margin:0 auto 20px;
  border-radius:24px;
  overflow:hidden;
  border:1px solid var(--line);
  box-shadow:0 16px 40px rgba(0,0,0,.28);
  background:rgba(255,255,255,.04);
}
.gateway-illustration img{
  display:block;
  width:100%;
  aspect-ratio:4/3;
  object-fit:cover;
}
.card-media,
.story-cover,
.hero-card{
  background:rgba(255,255,255,.04);
}
.card-media img,
.story-cover img,
.hero-card img{
  width:100%;
  height:auto;
}


/* Automatic language redirect fallback */
.language-redirect-fallback{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding:24px 14px;
  background:
    radial-gradient(circle at 80% 12%, rgba(239,226,179,.13), transparent 22%),
    radial-gradient(circle at 16% 8%, rgba(157,150,216,.17), transparent 24%),
    linear-gradient(180deg,#08101f,#10192d 55%,#13203a);
}


/* ===================================================
   MOBILE & TABLET IMPROVEMENTS — v2
   =================================================== */

/* --- Hamburger Button --- */
.nav-toggle {
  display: none;
  background: rgba(255,255,255,.05);
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 9px 11px;
  cursor: pointer;
  color: var(--moon-soft);
  min-height: 44px;
  min-width: 44px;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  gap: 5px;
  flex-shrink: 0;
}
.nav-toggle .bar {
  display: block;
  width: 20px;
  height: 2px;
  background: var(--moon-soft);
  border-radius: 2px;
  transition: transform .25s ease, opacity .25s ease;
  pointer-events: none;
}
.nav-toggle.open .bar:nth-child(1) { transform: translateY(7px) rotate(45deg); }
.nav-toggle.open .bar:nth-child(2) { opacity: 0; transform: scaleX(0); }
.nav-toggle.open .bar:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

/* --- Hamburger nav layout (≤768px) --- */
@media(max-width:768px) {
  .nav {
    flex-wrap: wrap;
    gap: 0;
    padding: 12px 0;
    align-items: center;
  }
  .brand {
    flex: 1;
    width: auto;
    justify-content: flex-start;
  }
  .nav-toggle {
    display: inline-flex;
  }
  /* Override scrollable-row rule from 720px breakpoint */
  .nav-links {
    display: none !important;
    width: 100%;
    flex-direction: column !important;
    flex-wrap: wrap !important;
    overflow: visible !important;
    padding: 8px 0 6px !important;
    gap: 3px;
    order: 10;
    scrollbar-width: unset;
  }
  .nav-links::-webkit-scrollbar { display: none; }
  .nav-links.open {
    display: flex !important;
  }
  .nav-links a {
    flex: unset !important;
    white-space: normal !important;
    font-size: .98rem !important;
    padding: 12px 14px !important;
    border-radius: 14px !important;
    border: 1px solid transparent !important;
    width: 100%;
    display: block;
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .nav-links a:hover,
  .nav-links a.active {
    background: rgba(255,255,255,.07) !important;
    border-color: var(--line) !important;
    color: var(--moon-soft) !important;
  }
}

/* --- Tablet filters (601–900px): ricerca a piena riga, selects in coppia --- */
@media(min-width:601px) and (max-width:900px) {
  .filters {
    grid-template-columns: 1fr 1fr;
    gap: 10px;
  }
  .filters #search {
    grid-column: 1 / -1;
  }
  .section { padding: 52px 0; }
  .hero { padding: 58px 0 48px; }
  .story-hero { padding: 42px 0; }
}

/* --- Story nav: pulsanti full-width su mobile --- */
@media(max-width:620px) {
  .story-nav {
    flex-direction: column;
    gap: 10px;
  }
  .story-nav .btn {
    width: 100%;
    justify-content: center;
    text-align: center;
  }
  /* Spaziatura sezioni più compatta */
  .section { padding: 40px 0; }
  .hero { padding: 40px 0 34px; }
  .story-hero { padding: 30px 0 26px; }
  /* Pill più grandi per il tocco */
  .pill { padding: 7px 12px; font-size: .85rem; }
  /* Eyebrow back link: area di tocco più grande */
  .eyebrow { padding: 10px 16px; font-size: .93rem; }
  /* Footer links: blocchi più grandi */
  .footer-grid a {
    display: block;
    padding: 9px 12px;
    margin: 2px 0;
    border-radius: 10px;
  }
  /* Moral e nota Montessori */
  .moral, .montessori-note { padding: 16px; border-radius: 18px; }
  .moral { font-size: 1rem; line-height: 1.65; }
}

/* --- Language switcher: wrap su schermi stretti --- */
@media(max-width:480px) {
  .language-switcher {
    overflow: visible !important;
    flex-wrap: wrap !important;
    gap: 6px;
  }
  .lang-pill {
    flex: unset !important;
    font-size: .85rem;
    padding: 7px 11px;
  }
}

/* --- Mobile piccolo (≤420px) --- */
@media(max-width:420px) {
  .story-hero-inner, .hero-inner { gap: 18px; }
  .section { padding: 34px 0; }
  .footer { padding: 34px 0; }
  .side-card { padding: 16px; }
  .side-card h3 { font-size: 1.1rem; }
  .cookie-banner { left: 8px; right: 8px; bottom: 8px; }
  /* Grid cards più compatte */
  .card-body { padding: 14px; }
  .card h3 { font-size: 1.15rem; }
}

/* --- Tablet read-link touch target --- */
@media(max-width:900px) {
  .read-link { padding: 4px 2px; display: inline-block; }
}

/* --- Featured cards (Aurora e Nando section) --- */
.grid-featured{display:grid;grid-template-columns:repeat(2,1fr);gap:2rem;margin-bottom:2.5rem}
.card-featured{display:flex;flex-direction:column;border:2px solid var(--moon-soft,#e8d5b0);background:linear-gradient(160deg,var(--surface,#131a2e) 0%,#1a2540 100%)}
.card-featured .card-media img{aspect-ratio:16/9;object-fit:cover}
.card-featured .card-body{padding:1.5rem}
.card-featured .eyebrow{font-size:.75rem;letter-spacing:.1em;text-transform:uppercase;color:var(--moon-soft,#e8d5b0);margin-bottom:.5rem}
.card-featured h3{font-size:1.3rem;margin:.4rem 0 .6rem}
.card-featured .card-footer{padding:1rem 1.5rem;border-top:1px solid rgba(255,255,255,.07)}
@media(max-width:600px){.grid-featured{grid-template-columns:1fr}}
