/* Hallmark · shape: Workbench · genre: editorial · theme: Studio (deal 1/3, seed b2b-editoriale-per-scout-e72c·nosalt·2026-10-31·r0) · job: sign up · draw: 76c257
 * hero: Settled · nav: slab · footer: statement · imagery: screenshots 11 (Playwright, demo organization; phone crops for the matrix and the motivation) · signature: the analysis matrix on a proof sheet, the hand-confirmed cell boxed in brand azure; a second measured box on the 0-10 score
 * axes: light/roman-serif/cool · posture: restrained · contrast: pass · fold: pass · brand: Scout (spec 2026-10-31, frontend/webroot/css/tailwind-extend.css) · v2.0.0 */
/* Hallmark · pre-emit critique: P4 H4 E4 S5 R4 V4 · weakest: P, the page argues "a P.IVA in, the offer out" but proof is only the product; kept every claim to what the app does and let the captures carry it */
/* Hallmark · waive 77 · the dossier stage capture is loading=lazy below the fold · once scrolled, each of the four dossier panels shows its capture in the sticky sheet */
/* Hallmark · dismissed 58 · the 85 words at y=5750 span the end of the data band and the first questions of the FAQ, two sections in one window */
/* Hallmark · dismissed 25 · .panel p holds one sentence, the panel's lede, which may sit from 28ch */
@import url("./tokens.css");
@import url("./base.css");

/* Fonts, served from this site (no third-party requests) */
@font-face { font-family: "Hedvig Letters Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/hedvig-letters-serif-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Hedvig Letters Serif"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/hedvig-letters-serif-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-latin.woff2") format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Geist"; font-style: normal; font-weight: 100 900; font-display: swap; src: url("../fonts/geist-latin-ext.woff2") format("woff2"); unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }

:root {
  --grain: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 .045 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  --nav-h: 72px;
}

html { scroll-padding-top: calc(var(--nav-h) + var(--space-lg)); }
body { font-feature-settings: "ss01" 0; }
h1, h2, h3, .footer__statement { font-optical-sizing: auto; color: var(--color-ink); line-height: 1.04; }
h1 { line-height: 1.08; }
h3 { letter-spacing: -0.005em; line-height: 1.2; }
p { color: var(--color-ink-2); }
.lead { color: var(--color-ink-2); }
a { text-decoration-color: color-mix(in oklab, currentColor 40%, transparent); }
a:hover { text-decoration-color: var(--color-accent); }

/* The proof: dot grid and grain on the hero, nav and footer only */
.proof {
  background-color: var(--color-paper);
  background-image: var(--grain), radial-gradient(circle at 1px 1px, var(--color-dot) 1px, transparent 1.4px);
  background-size: 160px 160px, 24px 24px;
}

/* Crop marks at the corners of every printed piece */
.crop { position: relative; --l: 10px; --o: 14px; }
.crop::before {
  content: ""; position: absolute; inset: calc(-1 * var(--o)); pointer-events: none; z-index: 2;
  background:
    linear-gradient(var(--color-mark), var(--color-mark)) 0 var(--o) / var(--l) 1px no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) var(--o) 0 / 1px var(--l) no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) 100% var(--o) / var(--l) 1px no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) calc(100% - var(--o)) 0 / 1px var(--l) no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) 0 calc(100% - var(--o)) / var(--l) 1px no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) var(--o) 100% / 1px var(--l) no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) 100% calc(100% - var(--o)) / var(--l) 1px no-repeat,
    linear-gradient(var(--color-mark), var(--color-mark)) calc(100% - var(--o)) 100% / 1px var(--l) no-repeat;
}
.sheet { background: var(--color-paper-hi); box-shadow: var(--shadow-sheet); border-radius: var(--radius-card); }

/* Captures of the product: never retouched, framed by the theme */
.shot { position: relative; margin: 0; overflow: hidden; border-radius: var(--radius-card); background: var(--color-paper-hi); }
.shot > img { width: 100%; height: auto; outline: 1px solid color-mix(in oklab, var(--color-ink) 8%, transparent); outline-offset: -1px; }
figure { margin: 0; }
.caption { margin-top: var(--space-sm); font-size: var(--text-sm); color: var(--color-muted); max-width: 60ch; }

/* Controls: printed, a rule inset inside the border, the primary filled with the brand azure */
.btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; gap: var(--space-xs);
  min-height: 48px; padding: 0 var(--space-lg); border: var(--rule-hair) solid var(--color-accent); border-radius: var(--radius-input);
  background: var(--color-accent); color: var(--color-accent-ink); font: 500 var(--text-md)/1 var(--font-body);
  text-decoration: none; white-space: nowrap; cursor: pointer;
  transition: background-color var(--dur-short) var(--ease-out), border-color var(--dur-short) var(--ease-out), transform var(--dur-micro) var(--ease-out);
}
.btn::after { content: ""; position: absolute; inset: 2px; border: var(--rule-hair) solid color-mix(in oklab, var(--color-accent-ink) 35%, transparent); border-radius: 1px; pointer-events: none; }
.btn:hover { background: var(--color-accent-deep); border-color: var(--color-accent-deep); }
.btn:active { transform: translateY(1px); }
.btn:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: 0.55; cursor: not-allowed; transform: none; }
.btn[aria-busy="true"] { cursor: progress; }
.btn--quiet { background: transparent; color: var(--color-ink); border-color: var(--color-ink); }
.btn--quiet::after { border-color: var(--color-rule); }
.btn--quiet:hover { background: var(--color-paper-2); border-color: var(--color-ink); }
.btn--small { min-height: 44px; padding: 0 var(--space-md); }
.btn--wide { width: 100%; }
.link-quiet { font-weight: 500; color: var(--color-ink); text-decoration: none; padding: var(--space-xs) 0; }
.link-quiet:hover { text-decoration: underline; text-decoration-color: var(--color-accent); }
.link-quiet:focus-visible, .slab__nav a:focus-visible, .brand:focus-visible, .footer a:focus-visible, .question summary:focus-visible, a:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 3px; }

.skip { position: absolute; left: var(--space-md); top: -100px; z-index: var(--z-tooltip); padding: var(--space-xs) var(--space-md); background: var(--color-ink); color: var(--color-paper); }
.skip:focus-visible { top: var(--space-md); }

/* Nav: a slab across the page */
.slab { position: sticky; top: 0; z-index: var(--z-sticky-nav); border-bottom: var(--rule-hair) solid var(--color-ink); }
.slab__row { display: flex; align-items: center; gap: var(--space-xl); min-height: var(--nav-h); }
.brand { display: block; flex-shrink: 0; }
.brand img { width: 132px; height: auto; }
.slab__nav { display: flex; gap: var(--space-lg); margin-left: auto; }
.slab__nav a { font-size: var(--text-sm); font-weight: 500; color: var(--color-ink-2); text-decoration: none; padding: var(--space-xs) 0; }
.slab__nav a:hover { color: var(--color-ink); text-decoration: underline; text-decoration-color: var(--color-accent); }
.slab__actions { display: flex; align-items: center; gap: var(--space-lg); }
.menu-toggle { display: none; align-items: center; justify-content: center; width: 44px; height: 44px; margin-left: auto; padding: 0; border: var(--rule-hair) solid var(--color-ink); border-radius: var(--radius-input); background: transparent; color: var(--color-ink); cursor: pointer; }
.menu-toggle:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.mobile-menu { display: grid; gap: var(--space-2xs); padding-bottom: var(--space-lg); }
.mobile-menu a:not(.btn) { padding: var(--space-sm) 0; border-bottom: var(--rule-hair) solid var(--color-rule); color: var(--color-ink); text-decoration: none; font-weight: 500; }
.mobile-menu .btn { margin-top: var(--space-md); }

/* Hero: settled, the text on six columns, the matrix on the other six */
.hero { position: relative; isolation: isolate; padding-block: var(--space-3xl); background: none; }
.hero::before { content: ""; position: absolute; inset: 0; z-index: -1; background-color: var(--color-paper); background-image: var(--grain), radial-gradient(circle at 1px 1px, var(--color-dot) 1px, transparent 1.4px); background-size: 160px 160px, 24px 24px; mask-image: linear-gradient(to bottom, var(--color-ink) 72%, transparent); }
.hero__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-3xl); align-items: center; min-height: min(calc(100dvh - var(--nav-h) - 2 * var(--space-3xl)), 640px); }
.hero__text .lead { margin-top: var(--space-lg); }
.hero__actions { display: flex; flex-wrap: wrap; gap: var(--space-sm); margin-top: var(--space-xl); }
.hero__note { margin-top: var(--space-md); font-size: var(--text-sm); color: var(--color-muted); }
.hero__sheet { padding: var(--space-md); }
.guide-box {
  position: absolute; z-index: 3; pointer-events: none;
  left: calc(var(--gx) - 5px); top: calc(var(--gy) - 5px); width: calc(var(--gw) + 10px); height: calc(var(--gh) + 10px);
  border: var(--rule-hair) solid var(--color-accent); outline: var(--rule-hair) dashed color-mix(in oklab, var(--color-accent) 45%, transparent); outline-offset: 4px;
  transform-origin: left center; animation: guide-in var(--dur-long) var(--ease-out) 0.3s both;
}
/* Measured on the captures: the hand-confirmed cell, and the score beside the motivation */
.guide-box--matrice { --gx: 32.11%; --gy: 54.77%; --gw: 9.84%; --gh: 4.02%; }
.guide-box--voto { --gx: 20.6%; --gy: 6.43%; --gw: 11.32%; --gh: 7.68%; }
@keyframes guide-in { from { opacity: 0; transform: scaleX(0.4); } to { opacity: 1; transform: none; } }
.hero__sheet .caption { margin-top: var(--space-md); }

/* Sections */
.section { padding-block: var(--section-gap); }
.section + .section { padding-top: 0; }
.dossier h2, .analisi .head, .catalogo h2, .faq h2 { margin-bottom: var(--space-2xl); }
.head--split { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--gap-columns); align-items: end; }
.head--split .lead { padding-bottom: var(--space-2xs); }

/* Dossier: one sheet held while four panels pass */
.pinned { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-3xl); }
.pinned__panels { list-style: none; margin: 0; padding: 0; counter-reset: panel; }
.panel { counter-increment: panel; display: flex; flex-direction: column; justify-content: center; min-height: 54vh; padding-block: var(--space-xl); border-top: var(--rule-hair) solid var(--color-rule); }
.panel:first-child { border-top-color: var(--color-ink); }
.panel h3 { display: flex; gap: var(--space-sm); align-items: baseline; font-size: var(--text-section); line-height: 1.05; max-width: 14ch; }
.panel h3::before { content: counter(panel); font: 500 var(--text-sm)/1 var(--font-body); color: var(--color-accent); font-variant-numeric: tabular-nums; transform: translateY(-0.9em); }
.panel p { margin-top: var(--space-md); font-size: var(--text-lead); max-width: 36ch; }
.panel__shot { display: none; margin-top: var(--space-xl); }
.pinned__stage { position: relative; }
.pinned__stage .sheet { position: sticky; top: calc(var(--nav-h) + var(--space-2xl)); padding: var(--space-xl); }
.stage__shot { display: none; box-shadow: 0 0 0 1px color-mix(in oklab, var(--color-ink) 6%, transparent); }
.stage__shot[data-active] { display: block; animation: stage-in var(--dur-long) var(--ease-out); }
@keyframes stage-in { from { opacity: 0; } to { opacity: 1; } }

/* Analyses: one capture across, two beneath at seven and five */
.showcase__lead .shot { box-shadow: var(--shadow-sheet); }
.showcase__pair { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--gap-columns); margin-top: var(--space-2xl); align-items: start; }
.showcase__pair .shot { border: var(--rule-hair) solid var(--color-rule); }

/* Rows: the head on four columns, the rows on eight */
.rows { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: var(--gap-columns); align-items: start; }
.rows > h2 { margin-bottom: 0; max-width: 11ch; }
.rows__list { margin: 0; border-top: var(--rule-hair) solid var(--color-ink); }
.rows__item { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--gap-columns); padding-block: var(--space-lg); border-bottom: var(--rule-hair) solid var(--color-rule); }
.rows__item dt { font: 400 var(--text-title)/1.2 var(--font-display); color: var(--color-ink); letter-spacing: -0.005em; }
.rows__item dd { margin: 0; color: var(--color-ink-2); padding-top: var(--space-3xs); }
.rows__shot { grid-column: 1 / -1; margin-top: var(--space-2xl); }
.rows__shot .shot { border: var(--rule-hair) solid var(--color-rule); }

/* Data band: ink paper, four facts parted by hairlines */
.band { padding-block: var(--section-gap-s); }
.band--ink { background: var(--color-ink); color: var(--color-paper); }
.band--ink h2 { color: var(--color-paper-hi); max-width: 16ch; }
.band--ink .lead { color: color-mix(in oklab, var(--color-paper) 82%, transparent); }
.facts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); margin: var(--space-2xl) 0 0; }
.facts__item { padding-inline: var(--space-lg); border-left: var(--rule-hair) solid color-mix(in oklab, var(--color-paper) 22%, transparent); }
.facts__item:first-child { padding-left: 0; border-left: 0; }
.facts__item dt { font: 400 var(--text-title)/1.2 var(--font-display); color: var(--color-paper-hi); letter-spacing: -0.005em; }
.facts__item dd { margin: var(--space-sm) 0 0; color: color-mix(in oklab, var(--color-paper) 80%, transparent); }
.band--ink .btn:focus-visible, .band--ink a:focus-visible { outline-color: var(--color-paper-hi); }

/* Questions */
.question { border-bottom: var(--rule-hair) solid var(--color-rule); }
.question summary { display: flex; justify-content: space-between; align-items: center; gap: var(--space-lg); padding-block: var(--space-lg); cursor: pointer; list-style: none; }
.question summary::-webkit-details-marker { display: none; }
.question summary h3 { font-size: var(--text-title); max-width: none; }
.question summary::after { content: ""; flex-shrink: 0; width: 16px; height: 16px; background: linear-gradient(var(--color-ink), var(--color-ink)) center / 16px 1px no-repeat, linear-gradient(var(--color-ink), var(--color-ink)) center / 1px 16px no-repeat; transition: transform var(--dur-short) var(--ease-out); }
.question[open] summary::after { transform: rotate(45deg); }
.question summary:hover h3 { text-decoration: underline; text-decoration-color: var(--color-accent); text-decoration-thickness: 1px; text-underline-offset: 0.2em; }
.question p { padding-bottom: var(--space-lg); max-width: 62ch; }
.question:not([open]) > p { display: none; }

/* Demo: the form on a sheet beside the head and the direct contacts */
.band--paper { background: var(--color-paper-2); }
.demo__grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--space-3xl); align-items: start; }
.demo__text .lead { margin-top: var(--space-lg); }
.direct { margin: var(--space-xl) 0 0; border-top: var(--rule-hair) solid var(--color-ink); }
.direct > div { display: grid; grid-template-columns: 7rem minmax(0, 1fr); gap: var(--space-md); padding-block: var(--space-sm); border-bottom: var(--rule-hair) solid var(--color-rule); }
.direct dt { font-size: var(--text-sm); color: var(--color-muted); padding-top: var(--space-3xs); }
.direct dd { margin: 0; color: var(--color-ink); }
.form { display: grid; gap: var(--space-lg); padding: var(--space-xl); }
.form__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--space-md); }
.field { display: grid; gap: var(--space-xs); }
.field label { font-size: var(--text-sm); font-weight: 500; color: var(--color-ink); }
.opt { font-weight: 400; color: var(--color-muted); }
.field input, .field textarea {
  width: 100%; min-height: 48px; padding: var(--space-sm) var(--space-md); border: var(--rule-hair) solid var(--color-muted); border-radius: var(--radius-input);
  background: var(--color-paper-hi); color: var(--color-ink); outline: 2px solid transparent; outline-offset: -3px;
  transition: border-color var(--dur-short) var(--ease-out);
}
.field textarea { min-height: 112px; resize: vertical; }
.field input::placeholder, .field textarea::placeholder { color: var(--color-muted); }
.field input:hover, .field textarea:hover { border-color: var(--color-ink-2); }
.field input:focus-visible, .field textarea:focus-visible { outline-color: var(--color-focus); }
.field input[aria-invalid="true"], .field textarea[aria-invalid="true"] { border-color: var(--color-error); }
.field input:disabled, .field textarea:disabled { opacity: 0.55; cursor: not-allowed; }
.consent { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: var(--space-sm); align-items: start; font-size: var(--text-sm); color: var(--color-ink-2); }
.consent input { width: 20px; height: 20px; margin: var(--space-3xs) 0 0; accent-color: var(--color-accent); }
.consent input:focus-visible { outline: 2px solid var(--color-focus); outline-offset: 2px; }
.consent a { color: var(--color-ink); }
.form__status { min-height: 1lh; font-size: var(--text-sm); color: var(--color-muted); }
.form__status:empty { min-height: 0; margin-top: calc(-1 * var(--space-lg)); }
.form__status[data-state="ok"] { color: var(--color-success); }
.form__status[data-state="error"] { color: var(--color-error); }
.hp { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }

/* Footer: one closing sentence, the links beneath */
.footer { padding-block: var(--space-3xl) var(--space-xl); border-top: var(--rule-hair) solid var(--color-ink); }
.footer__statement { margin: 0; font: 400 var(--text-section)/1.04 var(--font-display); letter-spacing: var(--tracking-display); max-width: 18ch; text-wrap: balance; }
.footer__grid { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 4fr) minmax(0, 4fr); gap: var(--gap-columns); margin-top: var(--space-2xl); padding-top: var(--space-lg); border-top: var(--rule-hair) solid var(--color-rule); }
.footer__brand img { width: 120px; height: auto; }
.footer__brand p { margin-top: var(--space-sm); font-size: var(--text-sm); }
.footer__address { font-style: normal; font-size: var(--text-sm); color: var(--color-ink-2); line-height: 1.7; }
.footer__links { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-2xs); font-size: var(--text-sm); }
.footer a { color: var(--color-ink); }
.footer__address a, .footer__links a { display: inline-block; padding-block: var(--space-2xs); }
.footer__legal { margin-top: var(--space-2xl); font-size: var(--text-xs); color: var(--color-muted); max-width: none; }

/* Legal pages and 404 */
.legal-page { padding-block: var(--space-3xl) var(--section-gap); }
.legal { max-width: 72ch; }
.legal h1 { font-size: var(--text-display-s); }
.legal h2 { font-size: var(--text-title); margin-top: var(--space-xl); }
.legal p, .legal li { line-height: 1.7; color: var(--color-ink-2); }
.legal p { margin-top: var(--space-md); }
.legal ul { padding-left: var(--space-lg); }
.legal__date { font-size: var(--text-sm); color: var(--color-muted); }
.legal__back { margin-top: var(--space-2xl); }

/* Under 60rem: everything stacks, the stage unpins and each panel shows its own capture */
@media (max-width: 75rem) {
  .slab__nav { display: none; }
  .slab__actions { margin-left: auto; }
}
@media (max-width: 60rem) {
  :root { --nav-h: 64px; }
  .slab__actions { display: none; }
  .menu-toggle { display: inline-flex; }
  .hero { padding-block: var(--space-2xl) var(--space-3xl); }
  .hero__grid, .pinned, .head--split, .rows, .demo__grid, .showcase__pair, .footer__grid { grid-template-columns: minmax(0, 1fr); gap: var(--space-xl); }
  .hero__grid { min-height: 0; }
  .pinned__stage { display: none; }
  .panel { min-height: 0; }
  .panel__shot { display: block; }
  .rows > h2 { margin-bottom: var(--space-xl); }
  .rows__item { grid-template-columns: minmax(0, 1fr); gap: var(--space-xs); }
  .facts { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); row-gap: var(--space-xl); }
  .facts__item:nth-child(3) { padding-left: 0; border-left: 0; }
}
@media (max-width: 40rem) {
  .form__row, .facts { grid-template-columns: minmax(0, 1fr); }
  .facts__item { padding: var(--space-lg) 0 0; border-left: 0; border-top: var(--rule-hair) solid color-mix(in oklab, var(--color-paper) 22%, transparent); }
  .facts__item:first-child { border-top: 0; padding-top: 0; }
  .form { padding: var(--space-lg); }
  .direct > div { grid-template-columns: minmax(0, 1fr); gap: var(--space-2xs); }
  .hero__actions .btn { flex: 1 1 100%; }
  .guide-box--matrice { --gx: 54.95%; --gy: 47.39%; --gw: 16.85%; --gh: 4.67%; }
  .guide-box--voto { --gx: 43.05%; --gy: 6.15%; --gw: 25.53%; --gh: 5.51%; }
  /* Captures too wide to read on a phone: the rows and the text carry them */
  .rows__shot, .panel[data-image="rischio"] .panel__shot, .panel:last-child .panel__shot { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .guide-box { animation: none; }
  .stage__shot[data-active] { animation: none; }
}