:root{--nav-height:52px;--collection-nav-height:54px}
.site-header{position:relative;top:auto}
.mobile-menu{display:none}

@media (min-width:761px){
  .site-header{z-index:70;background:rgba(250,248,243,.96);border-bottom:1px solid rgba(39,56,46,.09);backdrop-filter:saturate(1.4) blur(18px)}
  .header-inner{max-width:1260px;min-height:var(--nav-height);padding:0 clamp(1.4rem,4vw,3.5rem);gap:2rem}
  .brand{font-size:.94rem;letter-spacing:-.018em;gap:.25rem}
  .brand-logo{width:32px;height:40px}
  .primary-nav{flex:1;justify-content:flex-end;gap:clamp(1.1rem,3.2vw,3.1rem)}
  .primary-nav a{font-size:.74rem;font-weight:500;letter-spacing:.015em;padding:1.12rem .2rem;line-height:1;transition:color .18s ease}
  .primary-nav a::after{display:none}
  .primary-nav a:hover,.primary-nav a[aria-expanded="true"]{color:#81927d}
  .primary-nav a:focus-visible,.mega-panel a:focus-visible,.collection-toolbar a:focus-visible{outline:2px solid #5d765e;outline-offset:4px;border-radius:2px}
  .home-page .site-header{position:relative;left:auto;right:auto;top:auto}
  .home-page #main-content{padding-top:0}
  .home-page .home-film-sticky{top:0;height:100svh}
  .collection-page .site-header{position:relative;top:auto}
  .mega-panel{position:absolute;top:100%;left:0;right:0;height:0;overflow:hidden;background:rgba(250,248,243,.985);opacity:0;pointer-events:none;box-shadow:0 14px 30px rgba(25,32,25,.05);transition:height .42s cubic-bezier(.22,1,.36,1),opacity .26s ease}
  .mega-panel.is-open{opacity:1;pointer-events:auto}
  .mega-panel-inner{position:relative;max-width:1260px;height:100%;margin:auto;padding:0 clamp(1.4rem,4vw,3.5rem)}
  .mega-content{position:absolute;left:clamp(1.4rem,4vw,3.5rem);right:clamp(1.4rem,4vw,3.5rem);top:0;opacity:0;transform:translateY(10px);visibility:hidden;pointer-events:none;transition:opacity .22s ease,transform .34s cubic-bezier(.22,1,.36,1),visibility 0s .24s}
  .mega-content.is-active{opacity:1;transform:translateY(0);visibility:visible;pointer-events:auto;transition-delay:0s}
  .mega-grid{display:grid;grid-template-columns:minmax(230px,1.1fr) minmax(180px,.7fr) minmax(150px,.65fr);column-gap:clamp(2rem,6vw,7rem);padding:2.35rem 0 2.65rem;min-height:190px}
  .mega-eyebrow{display:block;margin:0 0 1rem;font:500 .66rem/1.4 var(--sans);letter-spacing:.1em;color:#7b897d}
  .mega-primary,.mega-aside{display:flex;flex-direction:column;align-items:flex-start}
  .mega-primary a{font:500 clamp(1.35rem,2.3vw,2.15rem)/1.24 var(--sans);letter-spacing:-.045em;color:#25372d;padding:.08rem 0;transition:color .18s ease,transform .25s ease}
  .mega-primary a:hover{color:#758c72;transform:translateX(4px)}
  .mega-aside a{font:500 .82rem/1.5 var(--sans);color:#48574b;padding:.26rem 0;transition:color .18s ease}
  .mega-aside a:hover{color:#80947d}
  .mega-signature{align-self:end;padding-bottom:.25rem;color:#88958a;font:400 clamp(1.35rem,2.2vw,2.2rem)/1.2 var(--serif);letter-spacing:-.045em}
  .mega-signature em{font-style:italic;color:#9da79a}
  .mega-backdrop{position:fixed;inset:var(--nav-height) 0 0;z-index:60;opacity:0;pointer-events:none;background:rgba(24,35,27,.34);backdrop-filter:blur(12px);transition:opacity .32s ease}
  .mega-open .mega-backdrop{opacity:1;pointer-events:auto}
  .collection-toolbar{position:fixed;inset:0 0 auto;z-index:65;height:var(--collection-nav-height);opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-100%);transition:opacity .2s,transform .2s,visibility .2s;background:rgba(249,247,241,.96);border-bottom:1px solid rgba(39,56,46,.12);backdrop-filter:saturate(1.4) blur(18px)}
  .collection-toolbar-inner{max-width:1260px;height:100%;padding:0 clamp(1.4rem,4vw,3.5rem);margin:auto;display:flex;align-items:center;gap:clamp(.9rem,2.3vw,2.2rem)}
  .collection-home{font:700 .94rem/1 var(--serif);color:var(--green);white-space:nowrap}
  .collection-home span{color:#8d9b87}
  .collection-title{font:500 1.1rem/1 var(--serif);color:var(--green);white-space:nowrap;margin-right:auto}
  .collection-chapters{display:flex;align-items:center;gap:clamp(.8rem,1.7vw,1.6rem);min-width:0;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
  .collection-chapters::-webkit-scrollbar{display:none}
  .collection-chapters a{position:relative;padding:12px 0}.collection-chapters a[aria-current="location"]::after{content:"";position:absolute;left:0;right:0;bottom:4px;height:1px;background:var(--green)}
  .collection-chapters a,.collection-listing{font:500 .73rem/1 var(--sans);color:#59695c;white-space:nowrap;transition:color .2s ease}
  .collection-chapters a:hover,.collection-chapters a[aria-current="location"],.collection-listing:hover{color:#1f3928}
  .collection-listing{display:inline-flex;align-items:center;justify-content:center;padding:11px 18px;border-radius:999px;background:var(--green);color:#fff}.collection-listing:hover{background:#526c55;color:#fff}
  .collection-page [id^="tema-"],.collection-page #racconto,.collection-page #inizio{scroll-margin-top:calc(var(--collection-nav-height) + 16px)}
  .collection-page .story-manifesto-sticky,.collection-page .sequence-stage{top:0;height:100svh}
}

@media (max-width:760px){
  .mega-panel,.mega-backdrop{display:none}
  .home-page .site-header{position:relative}
  .home-page #main-content{padding-top:0}
  .site-header{height:50px;background:#fbfaf7;border-bottom:1px solid rgba(39,56,46,.1);backdrop-filter:none}
  .header-inner{height:50px;min-height:50px;padding:0 19px;gap:0}
  .brand{gap:5px;font:500 15px/1 var(--serif)}
  .brand-logo{height:34px;width:29px}
  .brand span{font-size:15px}
  .menu-toggle{display:grid;align-content:center;justify-items:center;gap:5px;width:44px;height:50px;margin-right:-9px;padding:0;cursor:pointer}
  .menu-toggle span{width:18px;height:1.5px;margin:0;border-radius:1px;background:#263a2d}
  .primary-nav{display:none!important}
  .mobile-menu-open{overflow:hidden}
  .mobile-menu{display:block;position:fixed;inset:0;z-index:110;background:#fbfaf7;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px);transition:opacity .32s ease,transform .4s cubic-bezier(.22,1,.36,1),visibility 0s .4s}
  .mobile-menu.is-open{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0);transition-delay:0s}
  .mobile-menu-close{position:absolute;top:3px;right:10px;z-index:3;display:grid;place-items:center;width:44px;height:44px;border:0;background:transparent;cursor:pointer}
  .mobile-menu-close span{position:absolute;width:18px;height:1.5px;background:#263a2d;border-radius:1px;transform:rotate(45deg)}
  .mobile-menu-close span+span{transform:rotate(-45deg)}
  .mobile-menu-nav{position:relative;height:100%;overflow:hidden}
  .mobile-menu-page{position:absolute;inset:0;overflow-y:auto;overscroll-behavior:contain;padding:50px 40px 50px 48px;opacity:0;pointer-events:none;transform:translateX(44px);transition:opacity .28s ease,transform .42s cubic-bezier(.22,1,.36,1);scrollbar-width:none}
  .mobile-menu-page::-webkit-scrollbar{display:none}
  .mobile-menu-page.is-active{opacity:1;pointer-events:auto;transform:translateX(0)}
  .mobile-menu-root:not(.is-active){transform:translateX(-40px)}
  .mobile-menu-links{display:flex;flex-direction:column;align-items:stretch}
  .mobile-menu-links>a,.mobile-menu-links>button{display:flex;justify-content:space-between;align-items:center;min-height:46px;padding:2px 0;border:0;background:none;text-align:left;color:#263a2d;font:700 clamp(27px,7vw,34px)/1.16 var(--sans);letter-spacing:-.045em;cursor:pointer}
  .mobile-menu-links>button span{font:400 29px/1 var(--sans);color:#8c9a8d;opacity:0;transform:translateX(-5px);transition:opacity .2s ease,transform .2s ease}
  .mobile-menu-links>button:hover span,.mobile-menu-links>button:focus-visible span{opacity:1;transform:translateX(0)}
  .mobile-menu-back{display:grid;place-items:center;width:42px;height:42px;margin:-47px 0 5px -42px;padding:0;border:0;background:none;color:#263a2d;font:400 34px/1 var(--sans);cursor:pointer}
  .mobile-menu-subpage .mobile-menu-links{margin-top:0}
  .mobile-menu-extra{display:flex;flex-direction:column;align-items:flex-start;gap:12px;margin-top:40px}
  .mobile-menu-extra>span{margin-bottom:4px;color:#788779;font:500 14px/1.3 var(--sans)}
  .mobile-menu-extra>a{color:#3a4d3d;font:500 17px/1.3 var(--sans)}
  .mobile-menu button:focus-visible,.mobile-menu a:focus-visible,.menu-toggle:focus-visible{outline:2px solid #5d765e;outline-offset:4px;border-radius:2px}
}

@media (prefers-reduced-motion:reduce){
  .mega-panel,.mega-content,.mega-backdrop,.primary-nav a,.mega-panel a,.collection-toolbar a,.mobile-menu,.mobile-menu-page{transition:none!important}
}

.collection-toolbar.is-visible{opacity:1;visibility:visible;pointer-events:auto;transform:translateY(0)}
@media(min-width:761px){.collection-page .sequence-stage{top:var(--collection-nav-height);height:calc(100svh - var(--collection-nav-height))}}
@media(max-width:760px){
 :root{--collection-nav-height:88px}
 .collection-toolbar{position:fixed;inset:0 0 auto;z-index:65;height:var(--collection-nav-height);background:rgba(249,247,241,.98);border-bottom:1px solid #d7dcd2;opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-100%);transition:opacity .2s,transform .2s,visibility .2s}
 .collection-toolbar-inner{height:100%;padding:8px 19px 0;display:grid;grid-template-columns:1fr auto;grid-template-rows:32px 40px;gap:4px 14px}
 .collection-title{font:500 20px/1 var(--serif);color:var(--green);align-self:center}
 .collection-listing{grid-column:2;grid-row:1;display:flex;align-items:center;padding:8px 15px;border-radius:999px;background:var(--green);color:white;font:500 12px/1 var(--sans)}
 .collection-chapters{grid-column:1/-1;display:flex;gap:22px;overflow-x:auto;white-space:nowrap;scrollbar-width:none}
 .collection-chapters a{position:relative;flex:none;padding:10px 0;font:500 12px/1 var(--sans);color:#59695c}
 .collection-chapters a[aria-current="location"]{color:var(--green)}
 .collection-chapters a[aria-current="location"]::after{content:"";position:absolute;left:0;right:0;bottom:5px;height:1px;background:var(--green)}
 .collection-page [id^="tema-"],.collection-page #racconto{scroll-margin-top:calc(var(--collection-nav-height) + 16px)}
 .collection-page .sequence-visual{top:var(--collection-nav-height)}
}
@media(prefers-reduced-motion:reduce){.collection-toolbar{transition:none}}
