/* Leonardo Firenze — v1.2: restored card stacking, archives rows and pinned scroll storytelling */

/* Sticky works only when ancestors do not create an independent scroll container. */
.v02-work{overflow:visible!important;isolation:isolate}
.v02-work .shell,.case-list{overflow:visible!important}
.case-list{position:relative}
.case-item{position:sticky!important;top:calc(var(--nav-h) + 14px + var(--stack-index)*9px)!important;z-index:calc(10 + var(--stack-index));padding-top:0!important;margin-bottom:clamp(105px,15vh,170px)!important}
.case-item:nth-child(1){--stack-index:0}
.case-item:nth-child(2){--stack-index:1}
.case-item:nth-child(3){--stack-index:2}
.case-item:nth-child(4){--stack-index:3;margin-bottom:0!important}
.case-item .case-card{transform-origin:top center}
/* Do not hide/fade entire sticky containers; this can break scroll compositing. */
.js .case-item[data-reveal]{opacity:1!important;transform:none!important;transition:none!important}

/* Archives: wide editorial rows, generous breathing room, no boxed cards. */
.v11-archives{
  --archives-text:#f3f3f3;--archives-muted:#96989f;
  background:radial-gradient(ellipse 42% 58% at 0 0,rgba(28,34,66,.54),transparent 88%),
             radial-gradient(ellipse 36% 44% at 100% 100%,rgba(230,34,61,.065),transparent 80%),
             #0e0e0f!important;
  color:var(--archives-text);padding-block:clamp(126px,12vw,210px) clamp(120px,11vw,200px);
  overflow:hidden;
}
.v11-archives::before,.v11-archives::after{pointer-events:none;opacity:.55}
.v11-archives-head{grid-template-columns:minmax(0,1.5fr) minmax(250px,.5fr);align-items:end;margin-bottom:clamp(80px,7.4vw,135px)}
.v11-archives-head .kicker{color:var(--archives-muted)}
.v11-archives-head h2{font:700 clamp(59px,6vw,112px)/1.01 'Mozilla Text',Arial,sans-serif;letter-spacing:-.07em;color:var(--archives-text);max-width:1030px}
.v11-archives-head h2 span{color:#9a9ca4}
.v11-archives-head .section-deck{color:var(--archives-muted);font-size:clamp(14px,1vw,17px);max-width:430px;line-height:1.6}
.v12-archive-list{position:relative;z-index:1;border-top:1px solid rgba(243,243,243,.16)}
.archive-row{border-bottom:1px solid rgba(243,243,243,.13);padding:0;position:relative}
.archive-row__summary{list-style:none;cursor:pointer;display:grid;grid-template-columns:minmax(64px,90px) minmax(0,1fr) minmax(120px,360px) 24px;column-gap:clamp(16px,2.1vw,38px);align-items:center;min-height:clamp(78px,6.3vw,116px);padding:15px 0;color:var(--archives-text);outline-offset:-4px}
.archive-row__summary::-webkit-details-marker{display:none}
.archive-row__summary::marker{content:''}
.archive-row__year,.archive-row__category{font-size:clamp(11px,.76vw,13px);letter-spacing:.055em;color:var(--archives-muted);line-height:1.4;text-transform:uppercase}
.archive-row__name{display:block;min-width:0;font:700 clamp(31px,3.1vw,55px)/1.08 'Mozilla Text',Arial,sans-serif;letter-spacing:-.057em;transition:transform 200ms var(--ease-out),color 200ms ease}
.archive-row__category{text-align:right}
.archive-row__arrow{font-size:clamp(22px,1.6vw,30px);line-height:1;color:var(--archives-muted);text-align:right;transition:transform 200ms var(--ease-out),color 200ms ease}
.archive-row__detail{padding:0 0 clamp(28px,3vw,50px) calc(clamp(64px,6.5vw,90px) + clamp(16px,2.1vw,38px));display:flex;align-items:baseline;justify-content:space-between;gap:36px}
.archive-row__detail p{max-width:700px;font:400 clamp(15px,1.04vw,18px)/1.6 'Mozilla Text',Arial,sans-serif;color:#b8bac0;margin:0}
.archive-row__detail>span{font-size:10px;white-space:nowrap;color:var(--archives-muted)}
.archive-note{color:var(--archives-muted);padding-top:24px;font-size:10px}
.archive-row[open] .archive-row__arrow{transform:rotate(90deg);color:#e6223d}
@media(hover:hover) and (pointer:fine){
  .archive-row__summary:hover .archive-row__name{transform:translateX(9px);color:#fdfdfd}
  .archive-row__summary:hover .archive-row__arrow{transform:translate(3px,-3px);color:#e6223d}
  .archive-row[open] .archive-row__summary:hover .archive-row__arrow{transform:rotate(90deg) translate(3px,-3px)}
}

/* Desktop: vertical scroll drives horizontal translation, section stays pinned. */
.v02-method{height:var(--method-scroll-height,340vh)!important;overflow:visible!important;isolation:isolate}
.method-pin{position:sticky!important;top:var(--nav-h)!important;height:calc(100svh - var(--nav-h))!important;min-height:0!important;overflow:hidden!important}
.method-pin>.shell{height:100%!important;padding-top:clamp(36px,3.2vw,58px)!important;padding-bottom:clamp(34px,3vw,54px)!important}
.method-heading{flex-shrink:0;margin-bottom:clamp(12px,1.5vw,25px)}
.method-rail{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;scroll-snap-type:none;flex:1;min-height:0;display:flex;align-items:center;touch-action:auto}
.method-rail::-webkit-scrollbar{display:none}
.method-track{display:flex;align-items:stretch;gap:clamp(24px,2.4vw,36px);width:max-content;max-width:none;padding:0 0 4px;transform:translate3d(0,0,0);will-change:transform;transition:none!important}
.method-card{flex:0 0 clamp(570px,48vw,810px);height:clamp(335px,44svh,470px);max-height:100%;padding:clamp(32px,3.2vw,52px);scroll-snap-align:none}
.method-card h3{font-size:clamp(58px,4.6vw,85px)}
.method-card p{max-width:450px}
.method-progress{display:block!important;flex-shrink:0;margin-top:16px;margin-bottom:14px}
.method-progress span{transform-origin:left;will-change:transform}
.method-hint{font-size:11px}
.v02-method[data-horizontal-ready] .method-rail{overflow:hidden}

@media(max-width:1100px){
 .archive-row__summary{grid-template-columns:62px minmax(0,1fr) minmax(120px,230px) 22px}
 .archive-row__name{font-size:clamp(30px,3.1vw,42px)}
 .archive-row__detail{padding-left:92px}
 .method-card{flex-basis:clamp(530px,58vw,690px)}
}
@media(max-width:780px){
 .case-item,.case-item:nth-child(n){position:relative!important;top:auto!important;margin-bottom:clamp(34px,6vw,65px)!important}
 .case-item:last-child{margin-bottom:0!important}
 .v11-archives-head{grid-template-columns:1fr;gap:20px}
 .v11-archives-head h2{font-size:clamp(48px,9vw,75px)}
 .v11-archives-head .section-deck{max-width:540px}
 .archive-row__summary{grid-template-columns:52px minmax(0,1fr) 22px;gap:12px;min-height:76px}
 .archive-row__name{font-size:clamp(29px,5vw,41px)}
 .archive-row__category{grid-column:2;grid-row:2;text-align:left;font-size:10px;margin-top:-14px}
 .archive-row__arrow{grid-column:3;grid-row:1/span 2}
 .archive-row__detail{padding-left:64px;display:block}
 .archive-row__detail>span{display:block;margin-top:16px;white-space:normal}
 .v02-method{height:auto!important;overflow:visible!important}
 .method-pin{position:relative!important;top:auto!important;height:auto!important;min-height:0!important;overflow:visible!important}
 .method-pin>.shell{padding-top:72px!important;padding-bottom:78px!important}
 .method-rail{overflow-x:auto!important;overflow-y:hidden!important;scroll-snap-type:x mandatory;scrollbar-width:thin;touch-action:pan-x pan-y;overscroll-behavior-inline:contain;margin-top:34px;padding-bottom:12px}
 .method-track{transform:none!important;will-change:auto;padding:0 0 10px}
 .method-card{flex-basis:min(82vw,520px);height:clamp(340px,48svh,430px);scroll-snap-align:start}
 .method-progress{display:none!important}
 .method-hint{margin-top:12px}
}
@media(max-width:540px){
 .v11-archives{padding-block:88px 96px}
 .v11-archives-head{margin-bottom:54px}
 .archive-row__summary{grid-template-columns:44px minmax(0,1fr) 22px;gap:9px}
 .archive-row__year{font-size:10px}
 .archive-row__name{font-size:clamp(25px,7vw,36px)}
 .archive-row__detail{padding-left:53px}
 .method-card{flex-basis:84vw;height:360px}
}
@media(prefers-reduced-motion:reduce){
 .case-item,.case-item:nth-child(n){position:relative!important;top:auto!important;margin-bottom:42px!important}
 .v02-method{height:auto!important}
 .method-pin{position:relative!important;top:auto!important;height:auto!important;overflow:visible!important}
 .method-rail{overflow-x:auto!important;scroll-snap-type:x mandatory;scrollbar-width:thin}
 .method-track{transform:none!important;will-change:auto}
 .method-card{scroll-snap-align:start}
 .method-progress{display:none!important}
 .archive-row__name,.archive-row__arrow{transition:none!important}
}
/* The decorative halo must not enlarge the page width while sticky cards use overflow:visible. */
.v02-work::before{left:0!important}
.v02-work::after{right:0!important}
