.how-page { background:#fff; color:#253342; }
.how-page main { overflow:clip; }
.how-page main h1,.how-page main h2,.how-page main h3 { color:#001b33; line-height:1.16; }
.how-page h1 { font-size:clamp(34px,4vw,56px); margin:16px 0 24px; text-wrap:balance; }
.how-page h2 { font-size:clamp(28px,3vw,38px); margin:12px 0 20px; text-wrap:balance; }
.how-page h3 { font-size:24px; margin:16px 0; }
.how-page p { line-height:1.6; }
.how-page .section-kicker { color:#004d99; font-size:14px; font-weight:700; letter-spacing:.05em; text-transform:uppercase; }
.how-page .primary { display:inline-flex; align-items:center; justify-content:center; min-height:48px; padding:12px 22px; background:#1266cc; color:white; border:0; border-radius:5px; font:600 18px/1.3 'Source Sans 3',sans-serif; text-decoration:none; text-align:center; }
.how-page .primary:hover { background:#004d99; }
.how-page a:focus-visible,.how-page button:focus-visible,.how-page summary:focus-visible,.how-page input:focus-visible,.how-page select:focus-visible { outline:3px solid #1266cc; outline-offset:4px; }
.how-hero { background:linear-gradient(115deg,#edf4fc,#f8faff); padding:40px 0 56px; }
.how-hero-grid { display:grid; grid-template-columns:minmax(0,1.3fr) minmax(0,1fr); align-items:center; gap:48px; }
.how-breadcrumb { font-size:15px; margin-bottom:36px; color:#42566b; }
.how-breadcrumb a,.how-note a,.how-link { color:#004d99; text-underline-offset:4px; }
.how-lead { font-size:21px; max-width:650px; }
.how-actions { display:flex; flex-wrap:wrap; align-items:center; gap:16px 24px; margin:28px 0 12px; }
.how-link { display:inline-flex; align-items:center; min-height:44px; font-size:17px; font-weight:600; }
.how-note { font-size:16px; }
.how-illustration { margin:0; text-align:center; }
.how-illustration > img { width:100%; max-width:430px; height:auto; display:block; margin:auto; }
.how-illustration figcaption { font-size:15px; color:#42566b; margin-top:12px; }
.how-section { padding:72px 0; }
.how-section-heading { max-width:760px; margin-bottom:32px; }
.how-section-heading > p { font-size:19px; }
.how-steps { padding:0; margin:0; list-style:none; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.how-steps li { padding:28px; border:1px solid #c6d4e1; border-radius:8px; display:flex; flex-direction:column; }
.how-steps p { font-size:18px; margin:0 0 16px; }
.how-steps .how-link { margin-top:auto; }
.how-number { font-size:17px; color:#004d99; font-weight:700; }
.how-focus { display:grid; grid-template-columns:1fr 1fr; gap:64px; padding:40px; margin-top:40px; background:#edf4fc; border-radius:8px; align-items:center; }
.how-focus p,.how-focus li { font-size:18px; }
.how-focus ul { padding-left:22px; line-height:1.8; margin-bottom:24px; }
.how-finder { background:#f5f8fc; scroll-margin-top:24px; }
.how-search { display:grid; grid-template-columns:minmax(0,1.6fr) minmax(0,1fr) auto auto; gap:16px; align-items:end; background:white; padding:24px; border:1px solid #c6d4e1; border-radius:8px; }
.how-search label { display:block; font-size:16px; font-weight:600; margin-bottom:8px; }
.how-search input,.how-search select { width:100%; min-width:0; min-height:48px; border:1px solid #7b8c9b; border-radius:4px; padding:10px; background:white; color:#253342; font:18px 'Source Sans 3',sans-serif; }
.how-reset { min-height:48px; background:none; border:0; text-decoration:underline; color:#004d99; font:16px 'Source Sans 3',sans-serif; cursor:pointer; }
.how-results { font-size:16px; color:#42566b; margin:20px 0; }
.how-admin-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:24px; }
.how-admin-card { background:#fff; border:1px solid #c6d4e1; border-radius:8px; overflow:hidden; display:flex; flex-direction:column; }
.how-admin-main { text-decoration:none; color:inherit; display:block; flex:1; }
.how-admin-main:hover h3 { text-decoration:underline; color:#004d99; }
.how-admin-main img { width:100%; height:155px; object-fit:cover; display:block; }
.how-admin-main > div { padding:20px 20px 8px; }
.how-admin-main > div > span { font-size:13px; color:#42566b; }
.how-admin-main h3 { font-size:23px; margin:10px 0; }
.how-admin-main p { color:#004d99; font-size:16px; }
.how-credit { font-size:12px; margin:0; padding:0 20px 16px; color:#42566b; }
.how-credit a { color:inherit; display:inline-block; padding-block:6px; }
.how-empty { padding:24px; background:#fff; border:1px solid #c6d4e1; border-radius:8px; }
.how-faq { display:grid; grid-template-columns:1fr 1.4fr; gap:64px; }
.how-faq details { border-bottom:1px solid #c6d4e1; padding:0 0 18px; margin-bottom:18px; }
.how-faq summary { font-size:20px; font-weight:600; cursor:pointer; padding:10px 0; min-height:48px; }
.how-faq details p { font-size:18px; }
.how-final { background:#001b33; color:white; border-radius:10px; margin-top:56px; padding:48px; text-align:center; }
.how-page .how-final h2,.how-final .section-kicker { color:white; }
.how-final p { font-size:19px; }
.how-final .how-link { display:flex; width:fit-content; margin:16px auto 0; color:#c4e1ff; }
.how-page [hidden] { display:none !important; }
@media(max-width:1100px) { .how-admin-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .how-search { grid-template-columns:1fr 1fr; } .how-steps li { padding:20px; } .how-focus { gap:32px; } }
@media(max-width:760px) { .how-hero-grid,.how-focus,.how-faq { grid-template-columns:1fr; gap:24px; } .how-hero { padding:24px 0 36px; } .how-breadcrumb { margin-bottom:24px; } .how-hero-grid { gap:12px; } .how-illustration > img { max-width:260px; } .how-lead { font-size:19px; } .how-steps { grid-template-columns:1fr; gap:16px; } .how-section { padding:40px 0; } .how-focus { padding:24px; margin-top:24px; } .how-final { margin-top:32px; padding:28px 20px; } .how-search { padding:20px; } }
@media(max-width:480px) { .how-admin-grid,.how-search { grid-template-columns:1fr; } .how-admin-main img { height:180px; } .how-actions { align-items:stretch; flex-direction:column; gap:8px; } .how-actions .how-link { justify-content:center; } .how-page .home-container { width:calc(100% - 40px); padding-inline:0; } .how-illustration { margin-top:12px; } }

.how-section-heading { text-align:center; margin-inline:auto; }
.how-focus h2,.how-focus h2 + p,.how-faq h2,.how-faq .section-kicker { text-align:center; }
.how-illustration .app-download-actions { margin-top:20px; flex-wrap:wrap; }
.how-illustration .app-platform { min-width:0; }

/* Le icone store non ereditano le dimensioni dell’illustrazione. */
.how-illustration .app-platform img { width:24px; height:24px; max-width:24px; margin:0; flex:0 0 24px; }
.how-illustration .app-download-actions { align-items:center; }

/* Trattamento fotografico condiviso: blu notte leggero, senza alterare i file. */
.how-admin-main { position:relative; }
.how-admin-main::before {
  content:'';
  position:absolute;
  inset:0 0 auto;
  height:155px;
  background:linear-gradient(180deg,rgba(0,27,51,.14),rgba(0,27,51,.30));
  pointer-events:none;
  z-index:1;
}
@media(max-width:480px) { .how-admin-main::before { height:180px; } }