:root { --stories-yellow:#f5c400; --stories-cream:#f5f2ea; --stories-black:#080709; }
.page-storie { background:var(--stories-black); color:var(--stories-cream); overflow-x:hidden; }
.page-storie main,.page-storie .stories-experience { background:var(--stories-black)!important; }
.page-storie .navbar { display:none; }
.page-storie #main > section:not(.stories-experience), .page-storie > footer { display:none; }
.stories-experience { position:relative; height:420vh; background:var(--stories-black); }
.stories-sticky { position:sticky; top:0; height:100svh; min-height:620px; overflow:hidden; }
.stories-sticky::before { content:""; position:absolute; inset:0; z-index:0; background:radial-gradient(circle at 75% 42%,rgba(122,44,148,.25),transparent 38%),linear-gradient(180deg,#0b0910 0%,#180e1f 52%,#080709 100%); }
.stories-atmosphere { position:absolute; inset:0; z-index:1; opacity:.7; background:repeating-linear-gradient(90deg,transparent 0 14vw,rgba(245,196,0,.035) 14vw 14.1vw); }
.stories-atmosphere span { position:absolute; display:block; border:1px solid rgba(245,196,0,.2); border-radius:50%; filter:blur(1px); }.stories-atmosphere span:nth-child(1){width:28vw;height:28vw;top:-12vw;right:-6vw}.stories-atmosphere span:nth-child(2){width:18vw;height:18vw;bottom:-8vw;left:-4vw}.stories-atmosphere span:nth-child(3){width:9vw;height:9vw;top:22%;left:18%;}
.stories-heading { position:absolute; z-index:3; top:50%; left:clamp(22px,8vw,120px); width:390px; transform:translateY(-50%); transition:opacity .7s ease,transform .8s cubic-bezier(.22,1,.36,1); }.stories-heading p,.story-feature-copy small { margin:0 0 22px; color:var(--stories-yellow); font:600 10px/1 var(--sans); letter-spacing:.24em; text-transform:uppercase; }.stories-heading h1 { margin:0; color:var(--stories-cream); font:500 clamp(3.8rem,7vw,8rem)/.84 Manrope,sans-serif; letter-spacing:-.11em; }.stories-heading h1 em,.story-feature-copy h2 em { color:var(--stories-yellow); font-style:normal; }.stories-heading span { display:block; margin-top:32px; color:rgba(245,242,234,.62); font:600 9px/1 var(--sans); letter-spacing:.19em; text-transform:uppercase; }
.stories-feed { position:absolute; z-index:4; top:50%; left:55%; width:min(720px,calc(100% - 44px)); height:520px; transform:translate(-50%,-50%); }.story-feature { position:absolute; inset:0; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; align-items:center; opacity:0; transform:translateY(60px); filter:blur(7px); pointer-events:none; transition:opacity .75s ease,transform .9s cubic-bezier(.22,1,.36,1),filter .9s ease; }.story-feature.is-active { opacity:1; transform:none; filter:none; pointer-events:auto; }.story-feature-image { height:420px; overflow:hidden; border:1px solid rgba(245,196,0,.4); border-radius:28px 8px 28px 8px; }.story-feature-image img { width:100%;height:100%;object-fit:cover;filter:saturate(.72) contrast(1.05); }.story-feature-copy h2 { margin:0; color:var(--stories-cream); font:500 clamp(3.3rem,5vw,5.5rem)/.84 Manrope,sans-serif; letter-spacing:-.11em; }.story-feature-copy p { max-width:330px; margin:28px 0; color:rgba(245,242,234,.82); font-size:1rem; line-height:1.55; }.story-feature-copy a { display:inline-flex; align-items:center; gap:18px; color:var(--stories-yellow); font:600 10px/1 var(--sans); letter-spacing:.16em; text-transform:uppercase; }.story-feature-copy a b { font-size:18px; font-weight:400; }.story-feature--cta { grid-template-columns:1fr; text-align:center; }.story-feature--cta .story-feature-copy { display:flex; flex-direction:column; align-items:center; }.story-feature--cta .story-feature-copy p { max-width:420px; }.stories-cta { min-height:62px; padding:0 28px; color:var(--stories-black)!important; background:var(--stories-yellow); border:1px solid var(--stories-yellow); border-radius:999px; }.stories-cta:hover { color:var(--stories-yellow)!important; background:transparent; }
.stories-progress { position:absolute; z-index:5; right:clamp(22px,5vw,78px); bottom:46px; left:clamp(22px,5vw,78px); height:2px; background:rgba(245,242,234,.3); }.stories-progress span { display:block;width:0;height:100%;background:var(--stories-yellow); }.stories-progress i { position:absolute;top:50%;width:9px;height:9px;border:1px solid rgba(245,242,234,.7);border-radius:50%;background:var(--stories-black);transform:translate(-50%,-50%); }.stories-progress i:nth-of-type(1){left:0}.stories-progress i:nth-of-type(2){left:33.33%}.stories-progress i:nth-of-type(3){left:66.66%}.stories-progress i:nth-of-type(4){left:100%}.stories-hint { position:absolute; z-index:5; right:clamp(22px,5vw,78px); bottom:64px; margin:0; color:rgba(245,242,234,.55); font:600 9px/1 var(--sans); letter-spacing:.2em; text-transform:uppercase; }
@media (max-width:900px){.stories-heading{top:23%;left:22px;width:calc(100% - 44px)}.stories-heading h1{font-size:clamp(3.5rem,12vw,6rem)}.stories-heading span{margin-top:18px}.stories-feed{top:67%;left:50%;height:430px}.story-feature{grid-template-columns:1fr;gap:18px;align-content:center}.story-feature-image{height:205px;border-radius:22px 7px 22px 7px}.story-feature-copy h2{font-size:clamp(2.7rem,11vw,5rem)}.story-feature-copy p{margin:16px 0;font-size:.9rem}.stories-hint{display:none}.stories-progress{bottom:34px}}
@media (prefers-reduced-motion:reduce){.story-feature,.stories-heading{transition:none!important}}

/* Editorial archive: pagina normale, senza scroll-driven storytelling. */
.stories-experience { height:auto; min-height:100svh; padding:150px clamp(22px,6vw,92px) 110px; }
.stories-sticky { position:relative; top:auto; height:auto; min-height:0; overflow:visible; }
.stories-heading { position:relative; top:auto; left:auto; width:min(900px,100%); margin:0 auto 92px; transform:none; }
.stories-heading h1 { font-size:clamp(4rem,9vw,10rem); }
.stories-heading span { margin-top:28px; }
.stories-feed { position:relative; top:auto; left:auto; width:min(1180px,100%); height:auto; margin:0 auto; transform:none; display:grid; grid-template-columns:repeat(12,minmax(0,1fr)); gap:28px; }
.story-feature { position:relative; inset:auto; grid-column:span 6; min-height:480px; display:grid; grid-template-columns:1fr; gap:0; align-content:end; opacity:1!important; transform:none!important; filter:none!important; pointer-events:auto!important; padding:0; overflow:hidden; border:1px solid rgba(245,242,234,.16); border-radius:28px 8px 28px 8px; background:rgba(22,13,29,.72); transition:transform .45s ease,border-color .45s ease; }
.story-feature:nth-child(1) { grid-column:span 7; min-height:620px; }
.story-feature:nth-child(2) { grid-column:span 5; min-height:620px; }
.story-feature:nth-child(3),.story-feature:nth-child(4) { grid-column:span 6; min-height:470px; }
.story-feature:hover { transform:translateY(-8px)!important; border-color:rgba(245,196,0,.72); }
.story-feature-image { position:absolute; inset:0; height:auto; border:0; border-radius:0; }
.story-feature-image::after { content:""; position:absolute; inset:0; background:linear-gradient(180deg,transparent 24%,rgba(8,7,9,.94) 82%); }
.story-feature-copy { position:relative; z-index:1; padding:32px; }
.story-feature-copy h2 { font-size:clamp(2.8rem,5vw,6rem); }
.story-feature-copy p { max-width:440px; margin:20px 0; }
.story-feature--cta { background:linear-gradient(135deg,rgba(245,196,0,.92),rgba(130,65,160,.9)); color:var(--stories-black); }
.story-feature--cta .story-feature-copy { padding:44px; }.story-feature--cta .story-feature-copy small { color:var(--stories-black); }.story-feature--cta .story-feature-copy h2,.story-feature--cta .story-feature-copy h2 em { color:var(--stories-black); }.story-feature--cta .story-feature-copy p { color:rgba(8,7,9,.78); }.story-feature--cta .stories-cta { color:var(--stories-cream)!important; background:var(--stories-black); border-color:var(--stories-black); }
.stories-progress,.stories-hint { display:none; }
@media (max-width:900px){.stories-experience{padding:125px 20px 70px}.stories-heading{margin-bottom:54px}.stories-heading h1{font-size:clamp(3.5rem,13vw,6rem)}.stories-feed{display:grid;grid-template-columns:1fr;gap:18px}.story-feature,.story-feature:nth-child(n){grid-column:auto;min-height:430px}.story-feature:nth-child(1),.story-feature:nth-child(2){min-height:500px}.story-feature-copy,.story-feature--cta .story-feature-copy{padding:24px}.story-feature-copy h2{font-size:clamp(2.7rem,12vw,5rem)}}

/* Liquid-glass carousel: pannelli infiniti, inerzia e messa a fuoco centrale. */
.page-storie { height:100svh; overflow:hidden; background:#080709; }
.page-storie main { height:100svh; overflow:hidden; }
.page-storie .stories-experience { height:100svh; min-height:0; padding:0; overflow:hidden; perspective:900px; perspective-origin:50% 46%; }
.page-storie .stories-sticky { height:100svh; min-height:0; display:block; overflow:hidden; }
.page-storie .stories-sticky::before { background:radial-gradient(circle at 50% 46%,rgba(110,45,143,.3),transparent 30%),radial-gradient(circle at 83% 22%,rgba(245,196,0,.08),transparent 22%),linear-gradient(180deg,#09080c 0%,#150d1d 58%,#080709 100%); }
.page-storie .stories-atmosphere { opacity:.55; }
.page-storie .stories-heading { position:absolute; z-index:5; top:clamp(145px,17vh,190px); left:0; width:100%; margin:0; transform:none; text-align:center; pointer-events:none; }
.page-storie .stories-heading h1 { margin:0; color:var(--stories-cream); font-size:clamp(3rem,6vw,6.4rem); letter-spacing:-.1em; }
.stories-rating { display:flex; justify-content:center; gap:8px; margin-top:24px; color:var(--stories-yellow); font-size:clamp(15px,1.6vw,22px); line-height:1; text-shadow:0 0 18px rgba(245,196,0,.28); }
.page-storie .stories-rating span { display:inline; margin:0; color:var(--stories-yellow); font:inherit; letter-spacing:normal; }
.page-storie .stories-feed { position:absolute; z-index:4; top:63%; left:50%; width:100%; height:min(510px,58vh); margin:0; display:block; transform:translate3d(calc(-50% + var(--carousel-x, 0) * 10px), calc(-50% + var(--carousel-y, 0) * 7px), 0) rotateX(calc(var(--carousel-y, 0) * -2deg)) rotateY(calc(var(--carousel-x, 0) * 3deg)); transform-style:preserve-3d; transition:transform .45s cubic-bezier(.22,1,.36,1); }
.page-storie .story-feature { position:absolute; inset:0 auto auto 50%; width:min(380px,68vw); height:min(510px,58vh); min-height:0!important; display:block; border:1px solid rgba(245,242,234,.24); border-radius:30px; overflow:hidden; background:rgba(20,16,25,.42); box-shadow:0 38px 110px rgba(0,0,0,.5),inset 0 1px rgba(255,255,255,.2); backdrop-filter:blur(10px) saturate(1.12); transform:translate3d(-50%,0,0); transform-style:preserve-3d; opacity:0; transition:transform .1s linear,opacity .35s ease,filter .35s ease; will-change:transform,opacity; }
.page-storie .story-feature { transform:var(--story-transform) !important; opacity:var(--story-opacity,0) !important; filter:var(--story-filter,none) !important; }
.page-storie .story-feature.is-carousel-visible { opacity:1; }
.page-storie .story-feature-image { position:absolute; inset:0 0 42%; height:auto; border:0; border-radius:0; transform:translateZ(24px) scale(1.04); transform-origin:center top; }
.page-storie .story-feature-image::after { background:linear-gradient(180deg,rgba(8,7,9,.02),rgba(8,7,9,.1)); }
.page-storie .story-feature-copy { position:absolute; z-index:2; right:0; bottom:0; left:0; min-height:42%; padding:clamp(18px,2.5vw,30px); background:linear-gradient(180deg,rgba(11,9,14,.9),rgba(11,9,14,.98)); transform:translateZ(38px); }
.page-storie .story-feature-copy h2 { font-size:clamp(2.7rem,5vw,5rem); }
.page-storie .story-feature-copy p { margin:16px 0 20px; font-size:.94rem; }
.page-storie .story-feature--cta { background:linear-gradient(145deg,rgba(245,196,0,.96),rgba(123,61,153,.96)); }
.page-storie .story-feature--cta .story-feature-copy { position:absolute; top:50%; bottom:auto; min-height:100%; display:flex; flex-direction:column; justify-content:center; transform:translateY(-50%); background:linear-gradient(145deg,rgba(23,15,29,.97),rgba(45,23,56,.97)); color:var(--stories-cream); }
.page-storie .story-feature--cta .story-feature-copy small { color:var(--stories-yellow); }
.page-storie .story-feature--cta .story-feature-copy h2,.page-storie .story-feature--cta .story-feature-copy h2 em { color:var(--stories-cream); }
.page-storie .story-feature--cta .story-feature-copy p { color:rgba(245,242,234,.84); }
@media (max-width:900px){.page-storie .stories-heading{top:122px}.page-storie .stories-heading h1{font-size:clamp(2.8rem,11vw,5.6rem)}.stories-rating{margin-top:18px}.page-storie .stories-feed{top:66%;height:clamp(430px,57vh,520px)}.page-storie .story-feature{width:min(340px,78vw);height:100%}}
@media (prefers-reduced-motion:reduce){.page-storie .story-feature{transition:none!important}}
