/* ============================================================ SFVDT-Generale.css — Reset, variabili, tipografia di base Studio Fisioterapico Valli del Torre Unità: tutto in rem/em. Base 1rem = font-size di (100% = 16px). Cambiando il font-size di si riscala l'intera interfaccia. ============================================================ */ :root { /* Palette di brand (bianco + verde pavone) */ --c-primario: #0097B4; --c-primario-scuro: #075E73; --c-chiaro: #C6E9FF; --c-base: #FFFFFF; --c-testo: #1F2A2E; --c-neutro: #F2F6F7; --c-bordo: #E2EBED; --c-primario-soft: rgba(0, 151, 180, 0.10); /* Tipografia */ --font: "Segoe UI", Roboto, "Helvetica Neue", Arial, system-ui, sans-serif; --font-titoli: "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif; /* Misure (in rem) */ --contenitore: 87.5rem; --raggio: 0.875rem; --raggio-sm: 0.5rem; --bordo-sottile: 0.0625rem; --ombra: 0 0.5rem 1.875rem rgba(7, 94, 115, 0.10); --ombra-sm: 0 0.1875rem 0.75rem rgba(7, 94, 115, 0.08); --transizione: 0.25s ease; --header-h: 4.75rem; } *, *::before, *::after { box-sizing: border-box; } html { font-size: 100%; scroll-behavior: smooth; } body { margin: 0; font-family: var(--font); color: var(--c-testo); background: var(--c-base); line-height: 1.65; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; } h1, h2, h3, h4 { font-family: var(--font-titoli); line-height: 1.2; color: var(--c-primario-scuro); margin: 0 0 0.5em; font-weight: 700; } h1 { font-size: clamp(2rem, 5vw, 3.1rem); } h2 { font-size: clamp(1.6rem, 3.5vw, 2.3rem); } h3 { font-size: 1.25rem; } p { margin: 0 0 1rem; } a { color: var(--c-primario); text-decoration: none; transition: color var(--transizione); } a:hover { color: var(--c-primario-scuro); } img { max-width: 100%; display: block; } ul { margin: 0 0 1rem; padding-left: 1.2rem; } li { margin-bottom: 0.4rem; } strong { color: var(--c-primario-scuro); } /* Accessibilità */ :focus-visible { outline: 0.1875rem solid var(--c-primario); outline-offset: 0.125rem; } .sr-only { position: absolute; width: 0.0625rem; height: 0.0625rem; padding: 0; margin: -0.0625rem; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; } /* Utility */ .contenitore { width: 100%; max-width: var(--contenitore); margin-inline: auto; padding-inline: 1.375rem; } .testo-centro { text-align: center; } .occhiello { display: inline-block; text-transform: uppercase; letter-spacing: 0.12em; font-size: 0.78rem; font-weight: 700; color: var(--c-primario); background: var(--c-primario-soft); padding: 0.375rem 0.875rem; border-radius: var(--raggio); margin-bottom: 0.875rem; }