/* Content hierarchy: showcase, category collections, then an editorial spread. */
.z4d-home { --media-surface:#222526; }
html[data-home-palette="light"] .z4d-home { --media-surface:#ffffff; }
.sr-only { position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap; }
.sphere-showcase { padding-block:36px 64px; }
.showcase-heading { display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:30px; }
.showcase-heading h1 { font-size:clamp(36px,4.4vw,66px);line-height:1.06;letter-spacing:-.04em;max-width:14ch; }
.showcase-heading>.text-link { white-space:nowrap; }
.sphere-browser { display:grid;grid-template-columns:minmax(0,1fr) 142px;gap:24px;max-width:1066px;margin-inline:auto; }
.sphere-selected { min-width:0; }
.sphere-stage { display:block;width:100%;background:var(--media-surface);aspect-ratio:4/3;touch-action:pan-y; }
.sphere-main-image { width:100%;height:100%;object-fit:contain; }
.sphere-selected figcaption { display:flex;align-items:center;gap:24px;padding-block:20px;border-bottom:1px solid var(--line); }
.sphere-identity { display:flex;gap:14px;align-items:center;margin-right:auto; }
.sphere-identity>img { width:56px;height:56px;object-fit:contain;image-rendering:pixelated; }
.sphere-identity small { display:block;color:var(--accent);font-family:ui-monospace,Consolas,monospace;font-size:13px; }
.sphere-identity strong { display:block;font-size:26px;font-weight:500;line-height:1.2;margin-top:5px; }
.sphere-controls { display:flex;align-items:center;gap:12px; }
.sphere-controls button { width:48px;height:48px;border:1px solid var(--line);background:var(--surface);font-size:22px; }
.sphere-controls button:hover { border-color:var(--accent);color:var(--accent); }
.sphere-controls>span { font-size:13px;color:var(--muted);white-space:nowrap;min-width:34px;text-align:center; }
.sphere-thumbnails { display:grid;align-content:start;gap:12px; }
.sphere-thumbnails button { padding:5px;background:var(--media-surface);border:1px solid var(--line);text-align:left;min-width:0; }
.sphere-thumbnails button[aria-pressed="true"] { border:2px solid var(--accent);padding:4px; }
.sphere-thumbnails button img { aspect-ratio:4/3;width:100%;height:auto;object-fit:contain; }
.sphere-thumbnails button>span { display:flex;gap:8px;padding:7px 3px 2px;color:var(--muted);font-size:12px; }
.sphere-thumbnails b { color:var(--ink);font-weight:500; }
[data-home-style="retro"] .sphere-stage { border:1px solid var(--retro-edge);padding:7px;box-shadow:inset 0 0 0 4px var(--bg),inset 0 0 0 5px var(--retro-edge); }
.collection-mosaic { display:grid;grid-template-columns:1.3fr 1fr;gap:28px 44px;align-items:start; }
.collection-label { display:flex;justify-content:space-between;align-items:center;gap:20px;padding-block:20px; }
.collection-label h3 { font-size:30px; }
.collection-label .text-link { font-size:14px;white-space:nowrap; }
.collection-panel { border-top:1px solid var(--line);min-width:0; }
.collection-spheres { grid-column:1;grid-row:1; }
.sphere-examples { display:grid;grid-template-columns:1fr 1fr;gap:20px; }
.sphere-examples>a { min-width:0; }
.sphere-examples img { width:100%;aspect-ratio:1;height:auto;object-fit:contain;background:var(--media-surface); }
.sphere-examples>a>span,.figure-example>span,.art-example>span { display:flex;justify-content:space-between;gap:20px;font-size:18px;padding-block:14px; }
.sphere-examples>a>span>span,.figure-example>span>span,.art-example>span>span { color:var(--accent); }
.collection-figures { grid-column:2;grid-row:1/3; }
.figure-example { display:block; }
.figure-example img { width:100%;height:clamp(470px,53vw,760px);object-fit:contain;background:var(--media-surface); }
.collection-art { grid-column:1;grid-row:2; }
.art-example { display:block; }
.art-example img { width:100%;height:auto;max-height:450px;object-fit:contain;background:var(--media-surface); }
.collection-text-example { display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:52px;border-top:1px solid var(--line);font-size:16px; }
.collection-text-example>span { color:var(--accent); }
.collection-accessories { display:grid;grid-template-columns:1fr 1fr;gap:44px;margin-top:34px; }
.collection-accessories article { border-block:1px solid var(--line);padding-block:22px; }
.collection-accessories h3 { font-size:23px;margin-bottom:12px; }
.collection-accessories h3>a { display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:44px; }
.collection-accessories h3 span { color:var(--accent); }
.collection-accessories article>a,.collection-accessories li>a { display:inline-flex;align-items:center;min-height:44px;color:var(--muted);font-size:16px; }
.collection-accessories ul { list-style:none;margin:0;padding:0;display:flex;gap:8px 26px;flex-wrap:wrap; }
.editorial-gallery { padding-block:54px 80px; }
.editorial-gallery>h2 { font-size:clamp(32px,3vw,44px);margin-bottom:35px; }
.editorial-layout { display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(28px,6vw,90px);align-items:center; }
.editorial-layout figure>a { display:block; }
.editorial-photo img { max-height:650px;max-width:100%;width:auto;object-fit:contain;margin-inline:auto; }
.editorial-wide { margin-top:110px; }
.editorial-wide img { width:100%;height:auto;object-fit:contain; }
.editorial-layout figcaption { display:flex;justify-content:space-between;flex-wrap:wrap;gap:6px 18px;border-top:1px solid var(--line);padding-top:16px;margin-top:18px;font-size:16px; }
.editorial-layout figcaption a { min-height:44px;display:inline-flex;align-items:center; }
.editorial-photo figcaption small { display:block;width:100%;font-size:13px;color:var(--muted); }
[data-home-style="retro"] .home-find { margin-top:0; }
.home-footer-top #progetto { align-self:start; }
@media(max-width:900px) {
  .sphere-browser{grid-template-columns:minmax(0,1fr) 112px;gap:18px}
  .sphere-selected figcaption{flex-wrap:wrap;gap:14px}
  .sphere-controls{margin-left:auto}.sphere-thumbnails button>span{font-size:10px;gap:4px}
  .collection-mosaic{gap:24px}.collection-label{align-items:start;flex-direction:column;gap:0}
  .collection-figures .figure-example img{height:630px}
}
@media(max-width:700px) {
  .sphere-showcase{padding-block:28px 38px}.showcase-heading{display:block;margin-bottom:24px}
  .showcase-heading h1{font-size:clamp(34px,9vw,48px);max-width:16ch}.showcase-heading>.text-link{margin-top:16px}
  .sphere-browser{grid-template-columns:1fr;gap:18px}.sphere-stage{max-height:none}
  .sphere-thumbnails{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;grid-row:2}
  .sphere-thumbnails button>span{justify-content:center;font-size:12px}.sphere-thumbnails b{display:none}
  .sphere-selected figcaption{padding-block:14px;gap:12px}.sphere-identity{gap:8px}
  .sphere-identity>img{width:44px;height:44px}.sphere-identity strong{font-size:23px}
  .sphere-selected figcaption>.text-link{font-size:13px}.sphere-controls{width:100%;justify-content:flex-end;border-top:1px solid var(--line);padding-top:12px}
  .collection-mosaic{display:flex;flex-direction:column;gap:28px}.collection-panel{width:100%}
  .collection-label{flex-direction:row;align-items:center;gap:10px}.collection-label h3{font-size:28px}
  .collection-label .text-link{font-size:12px}.sphere-examples{gap:12px}.sphere-examples>a>span{font-size:16px;gap:8px}
  .collection-figures .figure-example img{height:500px;max-height:75svh}.collection-art img{max-height:360px}
  .collection-accessories{grid-template-columns:1fr;gap:20px;margin-top:28px}
  .collection-accessories article{padding-block:16px}.collection-accessories h3{font-size:23px}
  .editorial-gallery{padding-block:28px 45px}.editorial-layout{display:block}.editorial-wide{margin-top:48px}
  .editorial-photo img{max-height:560px}.editorial-layout figcaption{font-size:15px}.editorial-photo figcaption small{font-size:13px}
}
