.diagonal-page{isolation:isolate;position:fixed;inset:0;overflow:hidden}.diagonal-heading{z-index:30;pointer-events:none;justify-content:space-between;align-items:center;gap:24px;display:flex;position:absolute;top:108px;left:40px;right:40px}.diagonal-eyebrow{text-transform:uppercase;letter-spacing:.15em;color:var(--color-accent);font-size:10px}.diagonal-heading h1{letter-spacing:-.05em;margin-top:7px;font-size:66px;font-weight:500;line-height:1}.diagonal-heading h1 span{vertical-align:middle;letter-spacing:0;color:var(--color-foreground-muted);margin-left:14px;font-size:12px;display:inline-block}.diagonal-heading>p{text-align:right;color:var(--color-foreground-muted);font-size:11px;line-height:1.8}.diagonal-stage{touch-action:none;cursor:grab;position:absolute;inset:190px 0 214px}.diagonal-stage:active{cursor:grabbing}.diagonal-stage:focus-visible{outline-offset:-6px;border-radius:12px}.diagonal-track{perspective:1800px;pointer-events:none;position:absolute;inset:0}.diagonal-poster{will-change:transform;position:absolute;top:50%;left:50%}.diagonal-poster-button{border:1px solid var(--line-strong);width:100%;height:100%;box-shadow:0 16px 35px var(--shadow-soft);background:var(--color-surface);pointer-events:auto;cursor:inherit;border-radius:8px;display:block;position:relative;overflow:hidden}.diagonal-poster-button.is-current{border-color:var(--color-accent)}.diagonal-poster-number{background:var(--control-fill);color:var(--color-foreground);border-radius:4px;padding:6px 9px;font-size:11px;position:absolute;top:12px;left:12px}.diagonal-details{z-index:40;border:1px solid var(--line-soft);background:var(--control-fill);min-height:164px;box-shadow:0 10px 40px var(--shadow-soft);border-radius:16px;grid-template-columns:1fr auto;align-items:center;gap:30px;padding:24px 28px;display:grid;position:absolute;bottom:26px;left:40px;right:104px}.diagonal-selection{min-width:0}.diagonal-selection .diagonal-eyebrow span{color:var(--color-foreground-subtle);margin-left:16px}.diagonal-selection h2{letter-spacing:-.025em;margin:10px 0;font-size:clamp(22px,2.3vw,32px);font-weight:500;line-height:1.2}.diagonal-selection h2 a{display:inline}.diagonal-selection h2 a:hover{color:var(--color-accent)}.diagonal-selection h2 span{color:var(--color-accent);margin-left:14px;display:inline-block}.diagonal-description{max-width:740px;color:var(--color-foreground-muted);font-size:13px;line-height:1.6}.diagonal-navigation{flex-direction:column;align-items:center;gap:10px;display:flex}.diagonal-arrows{gap:10px;display:flex}.diagonal-arrows button{border:1px solid var(--line-strong);border-radius:50%;width:44px;height:44px;font-size:20px}.diagonal-arrows button:hover{background:var(--control-hover)}.diagonal-dots{display:flex}.diagonal-dots button{place-items:center;width:24px;height:30px;display:grid}.diagonal-dots span{background:var(--color-foreground-subtle);opacity:.45;border-radius:50%;width:5px;height:5px}.diagonal-dots [aria-pressed=true] span{opacity:1;background:var(--color-accent);transform:scale(1.6)}.diagonal-static{max-width:1100px;margin:auto;padding:36px 24px 100px}.diagonal-static h1{letter-spacing:-.04em;margin:24px 0 40px;font-size:clamp(36px,6vw,64px);line-height:1.1}.diagonal-static h1 em{color:var(--color-accent);font-family:Georgia,serif;font-weight:400}.diagonal-static-grid{grid-template-columns:repeat(2,1fr);gap:40px 28px;display:grid}.diagonal-static-image{aspect-ratio:4/3;border:1px solid var(--line-soft);border-radius:8px;position:relative;overflow:hidden}.diagonal-static-grid h2{margin-top:16px;font-size:23px;line-height:1.3}.diagonal-static-grid p{color:var(--color-foreground-muted);margin-top:10px;font-size:14px;line-height:1.7}@media (max-width:1000px){.diagonal-heading{left:24px;right:24px}.diagonal-heading h1 span{margin:8px 0 0;display:block}.diagonal-details{gap:18px;padding:20px;left:24px;right:88px}.diagonal-selection .diagonal-eyebrow span{margin-left:8px}}@media (max-width:600px){.diagonal-static-grid{grid-template-columns:1fr}}.diagonal-hint{color:var(--color-foreground-subtle);white-space:nowrap;font-size:10px}.diagonal-navigation{z-index:1;pointer-events:auto;position:relative}.diagonal-arrows button{touch-action:manipulation;flex-shrink:0;place-items:center;padding:0;display:grid}.diagonal-arrows svg{fill:none;stroke:currentColor;stroke-width:1.5px;stroke-linecap:round;stroke-linejoin:round;pointer-events:none;width:22px;height:22px}.diagonal-arrows button{width:44px;height:44px;color:var(--color-foreground);background:0 0;border:0;border-radius:0}.diagonal-arrows button:hover{color:var(--color-accent);background:0 0}
