/* Orfinitalia — foglio di stile unico del sito (mobile-first).
   È il CSS da portare nel tema WordPress: nessuna dipendenza, nessun framework.
   I valori dei token stanno in tokens.json; il blocco :root qui sotto li ripete
   come riserva, così il file funziona anche da solo. */

@font-face { font-family: "Inter"; font-style: normal; font-weight: 400; font-display: swap; src: url("../fonts/inter-latin-400-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 700; font-display: swap; src: url("../fonts/inter-latin-700-normal.woff2") format("woff2"); }
@font-face { font-family: "Inter"; font-style: normal; font-weight: 800; font-display: swap; src: url("../fonts/inter-latin-800-normal.woff2") format("woff2"); }

:root {
  --navy: #003b63; --ink: #102a43; --ink-muted: #52677a; --link: #115ca9;
  --yellow: #fdca14; --yellow-hover: #eeb800; --on-yellow: #003b63;
  --surface: #ffffff; --surface-alt: #f5f9fc; --tint-blue: #eaf4fa; --tint-yellow: #fff5da;
  --border: #dce7ef; --border-control: #7d8fa0; --on-navy: #ffffff; --on-navy-muted: #aebdca;
  --error: #b42318; --star: #8a6d00; --focus-ring: #115ca9; --focus-ring-on-dark: #fdca14;
  --radius-md: 12px; --radius-lg: 16px; --radius-full: 999px;
  --font-sans: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
}

/* ---------- Base ---------- */
.or { font-family: var(--font-sans); font-size: 17px; line-height: 28px; color: var(--ink); background: var(--surface); -webkit-font-smoothing: antialiased; text-size-adjust: 100%; }
.or *, .or *::before, .or *::after { box-sizing: border-box; }
:where(.or) :where(h1, h2, h3, h4, p, ul, ol, figure, blockquote, dl, dd) { margin: 0; }
:where(.or) :where(ul, ol) { padding: 0; list-style: none; }
:where(.or) :where(a) { color: var(--link); }
:where(.or) :where(img, svg) { display: block; max-width: 100%; }
.or-wrap { width: 100%; max-width: 1248px; margin: 0 auto; padding: 0 16px; }
.or-section { padding: 56px 0; }
.or-section--alt { background: var(--surface-alt); }
.or-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.or-h1 { font-size: 36px; line-height: 40px; font-weight: 800; letter-spacing: -0.03em; color: var(--navy); }
.or-h2 { font-size: 28px; line-height: 34px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); }
.or-h3 { font-size: 20px; line-height: 26px; font-weight: 700; letter-spacing: -0.01em; color: var(--navy); }
.or-lead { font-size: 18px; line-height: 28px; color: var(--ink-muted); }
.or-muted { color: var(--ink-muted); }
.or-small { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-hide-sm { display: none; }
@media (min-width: 1100px) { .or-hide-sm { display: inline; } }
.or-ico { width: 24px; height: 24px; flex: none; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
@media (min-width: 768px) {
  .or { font-size: 16px; line-height: 26px; }
  .or-wrap { padding: 0 24px; }
  .or-section { padding: 88px 0; }
  .or-h1 { font-size: 52px; line-height: 56px; letter-spacing: -0.035em; }
  .or-h2 { font-size: 40px; line-height: 46px; letter-spacing: -0.03em; }
}

/* ---------- Focus ---------- */
.or :focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 2px; }
.or-on-dark :focus-visible { outline-color: var(--focus-ring-on-dark); }
.or-on-yellow :focus-visible { outline-color: var(--navy); }

/* ---------- Buttons ---------- */
.or-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 48px; padding: 12px 20px;
  border: 2px solid transparent; border-radius: var(--radius-md); font: 700 16px/20px var(--font-sans); text-align: center;
  text-decoration: none; cursor: pointer; transition: background-color .15s, border-color .15s; }
.or-btn--lg { min-height: 56px; padding: 16px 24px; font-size: 17px; }
.or-btn--block { display: flex; width: 100%; }
.or-btn--primary { background: var(--yellow); color: var(--on-yellow); }
.or-btn--primary:hover { background: var(--yellow-hover); }
.or-btn--secondary { background: transparent; color: var(--navy); border-color: var(--navy); }
.or-btn--secondary:hover { background: var(--tint-blue); }
.or-on-dark .or-btn--secondary { color: var(--on-navy); border-color: var(--on-navy); }
.or-on-yellow .or-btn--primary { background: var(--navy); color: var(--on-navy); }
.or-on-yellow .or-btn--primary:hover { background: var(--ink); }
.or-link { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; color: var(--link); font-weight: 700; text-decoration: underline; text-underline-offset: 3px; }
.or-link:hover { text-decoration-thickness: 2px; }
.or-on-dark .or-link, .or-on-yellow .or-link { color: inherit; }

/* ---------- Legal note next to CTAs ---------- */
.or-note { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-on-dark .or-note { color: var(--on-navy-muted); }
.or-on-yellow .or-note { color: var(--navy); }

/* ---------- Header + mobile menu ---------- */
.or-header { background: var(--surface); border-bottom: 1px solid var(--border); position: relative; z-index: 20; }
.or-header__row { display: flex; align-items: center; gap: 12px; min-height: 64px; }
.or-header__logo { display: block; margin-right: auto; }
.or-header__logo img { width: 118px; height: auto; }
.or-header__nav { display: none; }
.or-header__cta { min-height: 44px; padding: 10px 14px; font-size: 15px; }
.or-menu > summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; min-height: 44px; padding: 0 8px; border-radius: var(--radius-md); color: var(--navy); font-weight: 700; font-size: 15px; cursor: pointer; }
.or-menu > summary::-webkit-details-marker { display: none; }
.or-menu__panel { position: absolute; left: 0; right: 0; top: 100%; background: var(--surface); border-top: 1px solid var(--border); padding: 8px 16px 24px; max-height: calc(100vh - 64px); overflow-y: auto; }
.or-menu__item, .or-menu__group > summary { display: flex; align-items: center; justify-content: space-between; min-height: 52px; border-bottom: 1px solid var(--border); color: var(--navy); font-weight: 700; font-size: 17px; text-decoration: none; cursor: pointer; list-style: none; }
.or-menu__group > summary::-webkit-details-marker { display: none; }
.or-menu__group > summary::after { content: "+"; font-size: 22px; font-weight: 400; }
.or-menu__group[open] > summary::after { content: "−"; }
.or-menu__sub a { display: flex; align-items: center; min-height: 44px; padding-left: 16px; color: var(--ink); text-decoration: none; font-size: 16px; }
.or-menu__label { padding: 12px 0 4px 16px; font-size: 13px; line-height: 18px; font-weight: 700; color: var(--ink-muted); }
.or-menu__contact { margin-top: 20px; display: grid; gap: 8px; }
@media (min-width: 1100px) {
  .or-header__row { min-height: 76px; gap: 24px; }
  .or-header__logo img { width: 136px; }
  .or-menu { display: none; }
  .or-header__nav { display: flex; gap: 22px; }
  .or-header__nav > a, .or-header__nav summary { display: inline-flex; align-items: center; gap: 4px; min-height: 44px; color: var(--navy); font-size: 15px; font-weight: 700; text-decoration: none; cursor: pointer; list-style: none; }
  .or-header__nav summary::-webkit-details-marker { display: none; }
  .or-header__nav summary::after { content: "▾"; font-size: 12px; }
  .or-drop { position: relative; }
  .or-drop__panel { position: absolute; top: 100%; left: -16px; min-width: 260px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 8px; box-shadow: var(--shadow-drop, 0 12px 32px rgba(0, 59, 99, 0.12)); }
  .or-drop__panel a { display: flex; align-items: center; min-height: 40px; padding: 0 12px; border-radius: 8px; color: var(--ink); text-decoration: none; font-size: 15px; }
  .or-drop__panel a:hover { background: var(--tint-blue); }
  .or-drop__panel--2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px 16px; min-width: 560px; padding: 12px; }
  .or-drop__label { padding: 4px 12px 6px; font-size: 13px; line-height: 18px; font-weight: 700; color: var(--ink-muted); }
  .or-header__cta { min-height: 48px; padding: 12px 20px; font-size: 16px; }
}

/* ---------- Breadcrumb ---------- */
.or-bc { padding-top: 12px; padding-bottom: 12px; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-bc ol { display: flex; flex-wrap: wrap; gap: 4px; }
.or-bc li + li::before { content: "›"; margin-right: 4px; }
.or-bc a { color: var(--link); }

/* ---------- Hero ---------- */
.or-hero { background: var(--surface-alt); padding: 32px 0 40px; }
.or-hero__lead { margin-top: 16px; max-width: 620px; }
.or-hero__art { display: none; }
@media (min-width: 900px) { .or-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 360px; gap: 48px; align-items: center; } .or-hero__art { display: block; width: 360px; height: auto; } }
.or-hero__cta { margin-top: 24px; }
.or-checks { margin-top: 20px; display: grid; gap: 8px; }
.or-checks li { display: flex; gap: 10px; align-items: flex-start; font-weight: 700; color: var(--ink); }
.or-checks .or-ico { color: var(--link); width: 22px; height: 22px; margin-top: 3px; }
.or-trust { margin-top: 20px; display: flex; flex-wrap: wrap; gap: 8px 20px; font-size: 15px; line-height: 22px; color: var(--ink-muted); }
.or-trust strong { color: var(--navy); }
.or-trust__stars { color: var(--star); letter-spacing: 1px; }
.or-hero .or-note { margin-top: 12px; }
@media (min-width: 768px) { .or-hero { padding: 72px 0 80px; } .or-hero__cta { width: auto; } }

/* ---------- Section header ---------- */
.or-sechead { margin-bottom: 24px; max-width: 760px; }
.or-sechead p { margin-top: 12px; }
.or-sechead__row { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 24px; margin-bottom: 24px; }
.or-sechead__row .or-sechead { margin-bottom: 0; }
@media (min-width: 768px) { .or-sechead, .or-sechead__row { margin-bottom: 40px; } }

/* ---------- Profile rows ---------- */
.or-profiles { display: grid; gap: 12px; }
.or-profile { display: flex; align-items: center; gap: 14px; min-height: 72px; padding: 12px 16px; background: var(--surface); border: 1.5px solid var(--border-control); border-radius: var(--radius-md); color: var(--navy); text-decoration: none; }
.or-profile:hover { background: var(--tint-blue); border-color: var(--navy); }
.or-profile__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-full); background: var(--tint-blue); color: var(--navy); flex: none; }
.or-profile__text { display: flex; flex-direction: column; flex: 1; }
.or-profile__label { font-size: 18px; line-height: 24px; font-weight: 700; }
.or-profile__sub { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-profile__go { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--radius-full); background: var(--yellow); color: var(--on-yellow); flex: none; }
.or-profile__go .or-ico { width: 20px; height: 20px; }
@media (min-width: 768px) { .or-profiles { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } .or-profile { min-height: 88px; padding: 16px 20px; } }

/* ---------- Convenzione cards (distinguibili per icona, etichetta e bordo) ---------- */
.or-convs { display: grid; gap: 16px; }
.or-conv { display: flex; flex-direction: column; gap: 10px; padding: 24px; background: var(--surface); border: 1px solid var(--border); border-top: 4px solid var(--navy); border-radius: var(--radius-lg); }
.or-conv--inps { border-top-color: var(--yellow); }
.or-conv--noipa { border-top-color: var(--link); }
.or-conv--aziende { border-top-color: var(--navy); }
.or-conv__head { display: flex; align-items: center; gap: 12px; }
.or-conv__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-md); flex: none; }
.or-conv--inps .or-conv__icon { background: var(--tint-yellow); color: var(--navy); }
.or-conv--noipa .or-conv__icon { background: var(--tint-blue); color: var(--link); }
.or-conv--aziende .or-conv__icon { background: var(--surface-alt); color: var(--navy); border: 1px solid var(--border); }
.or-conv__tag { font-size: 13px; line-height: 18px; font-weight: 700; color: var(--ink-muted); }
.or-conv__text { color: var(--ink-muted); flex: 1; }
.or-conv .or-link { align-self: flex-start; }
@media (min-width: 768px) { .or-convs { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }

/* ---------- Product list ---------- */
.or-products { border-top: 1px solid var(--border); }
.or-products li { border-bottom: 1px solid var(--border); }
.or-product { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding: 20px 0; text-decoration: none; color: inherit; }
.or-product__name { grid-column: 1; color: var(--navy); }
.or-product__desc { grid-column: 1; color: var(--ink-muted); }
.or-product__go { grid-column: 2; grid-row: 1 / span 2; color: var(--link); font-weight: 700; display: inline-flex; gap: 6px; align-items: center; }
.or-product__go span { display: none; }
.or-product:hover .or-product__name { color: var(--link); }
@media (min-width: 768px) {
  .or-product { grid-template-columns: 300px minmax(0, 1fr) auto; padding: 24px 0; }
  .or-product__name, .or-product__desc { grid-column: auto; }
  .or-product__go { grid-column: auto; grid-row: auto; }
  .or-product__go span { display: inline; }
}

/* ---------- Calculator ---------- */
.or-calc { display: grid; gap: 20px; padding: 16px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.or-field { display: grid; gap: 6px; }
.or-field > label, .or-legend { font-size: 16px; line-height: 22px; font-weight: 700; color: var(--ink); padding: 0; }
.or-hint { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-input { width: 100%; min-height: 52px; padding: 12px 14px; border: 1.5px solid var(--border-control); border-radius: var(--radius-md); background: var(--surface); color: var(--ink); font: 400 18px/24px var(--font-sans); }
.or-input:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 1px; border-color: var(--navy); }
.or-input[aria-invalid="true"] { border-color: var(--error); border-width: 2px; }
.or-error { display: flex; gap: 6px; align-items: flex-start; font-size: 15px; line-height: 20px; font-weight: 700; color: var(--error); }
.or-seg { display: grid; gap: 8px; border: 0; padding: 0; margin: 0; min-width: 0; }
.or-seg__opts { display: grid; gap: 8px; }
.or-seg label { display: flex; align-items: center; gap: 10px; min-height: 48px; padding: 10px 14px; border: 1.5px solid var(--border-control); border-radius: var(--radius-md); font-weight: 700; color: var(--navy); cursor: pointer; }
.or-seg input { width: 20px; height: 20px; accent-color: var(--navy); margin: 0; }
.or-seg label:has(input:checked) { border-color: var(--navy); border-width: 2px; background: var(--tint-blue); }
.or-calc__result { padding: 16px; border-radius: var(--radius-md); background: var(--tint-yellow); display: grid; gap: 4px; }
.or-calc__value { font-size: 32px; line-height: 38px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); }
@media (min-width: 768px) {
  .or-calc { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 24px 40px; padding: 32px; }
  .or-seg__opts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .or-calc__wide { grid-column: 1 / -1; }
}

/* ---------- Steps ---------- */
.or-steps { display: grid; gap: 16px; counter-reset: s; }
.or-step { display: grid; grid-template-columns: 40px minmax(0, 1fr); gap: 4px 16px; padding: 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.or-step__num { grid-row: 1 / span 2; display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--radius-full); background: var(--navy); color: var(--on-navy); font-weight: 800; font-size: 15px; }
.or-step p { color: var(--ink-muted); }
@media (min-width: 768px) { .or-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } .or-step { grid-template-columns: 1fr; padding: 28px; } .or-step__num { grid-row: auto; margin-bottom: 12px; } }

/* ---------- Benefits ---------- */
.or-benefits { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
.or-benefit { display: grid; gap: 8px; align-content: start; }
.or-benefit__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--tint-blue); color: var(--navy); }
.or-benefit p { color: var(--ink-muted); font-size: 15px; line-height: 22px; }
@media (min-width: 768px) { .or-benefits { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 32px; } }

/* ---------- Reviews & trust ---------- */
.or-score { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.or-score__value { font-size: 44px; line-height: 44px; font-weight: 800; letter-spacing: -0.03em; color: var(--navy); }
.or-reviews { display: grid; gap: 16px; }
.or-review { display: grid; gap: 12px; padding: 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.or-review__stars { color: var(--star); letter-spacing: 2px; }
.or-review__who { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-review__who strong { color: var(--navy); }
.or-facts { margin-top: 24px; display: grid; gap: 12px; }
.or-fact { display: flex; gap: 12px; align-items: center; padding: 16px; border-radius: var(--radius-md); background: var(--surface); border: 1px solid var(--border); }
.or-fact .or-ico { color: var(--navy); }
.or-fact strong { display: block; color: var(--navy); }
@media (min-width: 768px) { .or-reviews, .or-facts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }

/* ---------- Guides ---------- */
.or-guides { display: grid; gap: 16px; }
.or-guide { position: relative; display: grid; gap: 10px; align-content: start; padding: 20px; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius-lg); }
.or-tag { justify-self: start; padding: 4px 10px; border-radius: var(--radius-full); background: var(--tint-blue); color: var(--navy); font-size: 13px; line-height: 18px; font-weight: 700; }
.or-guide :is(h2, h3) a { color: var(--navy); text-decoration: none; }
.or-guide :is(h2, h3) a:hover { text-decoration: underline; }
.or-guide :is(h2, h3) a::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.or-guide p { color: var(--ink-muted); font-size: 15px; line-height: 22px; }
.or-guide__more { color: var(--link); font-weight: 700; }
@media (min-width: 768px) { .or-guides { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }

/* ---------- FAQ ---------- */
.or-faq { border-top: 1px solid var(--border); }
.or-faq details { border-bottom: 1px solid var(--border); }
.or-faq summary { display: flex; justify-content: space-between; align-items: center; gap: 16px; min-height: 60px; padding: 14px 0; font-size: 18px; line-height: 24px; font-weight: 700; color: var(--navy); cursor: pointer; list-style: none; }
.or-faq summary::-webkit-details-marker { display: none; }
.or-faq summary::after { content: "+"; flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-full); background: var(--tint-blue); font-weight: 400; font-size: 22px; }
.or-faq details[open] summary::after { content: "−"; }
.or-faq details > div { padding: 0 0 18px; color: var(--ink); max-width: 720px; }

/* ---------- Prose (pagine interne) ---------- */
.or-prose { max-width: 720px; display: grid; gap: 16px; }
.or-prose h2 { margin-top: 24px; }
.or-prose ul.or-list { display: grid; gap: 8px; }
.or-prose ul.or-list li { display: flex; gap: 10px; }
.or-prose ul.or-list li::before { content: ""; width: 8px; height: 8px; margin-top: 10px; border-radius: 50%; background: var(--link); flex: none; }
.or-meta { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-box { padding: 20px; border-radius: var(--radius-lg); background: var(--surface-alt); border: 1px solid var(--border); }
.or-box--info { background: var(--tint-blue); border-color: var(--tint-blue); }
.or-sources { font-size: 14px; line-height: 22px; color: var(--ink-muted); }

/* ---------- Come funziona nelle pagine interne ---------- */
.or-howto { display: grid; gap: 12px; }
.or-howto li { display: flex; gap: 14px; align-items: center; min-height: 48px; }
.or-howto__num { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--radius-full); background: var(--navy); color: var(--on-navy); font-weight: 800; font-size: 15px; flex: none; }

/* ---------- CTA band ---------- */
.or-cta { background: var(--yellow); color: var(--navy); padding: 48px 0; }
.or-cta__row { display: grid; gap: 20px; }
.or-cta__actions { display: grid; gap: 8px; justify-items: start; }
@media (min-width: 768px) { .or-cta { padding: 72px 0; } .or-cta__row { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 48px; } }

/* ---------- Footer ---------- */
.or-footer { background: var(--navy); color: var(--on-navy-muted); padding: 48px 0 96px; font-size: 15px; line-height: 24px; }
.or-footer a { color: var(--on-navy); text-decoration: none; }
.or-footer a:hover { text-decoration: underline; }
.or-footer__top { display: grid; gap: 32px; }
.or-footer__brand img { width: 150px; height: auto; }
.or-footer__brand p { margin-top: 12px; }
.or-footer__cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 28px 16px; }
.or-footer h2 { font-size: 15px; line-height: 20px; font-weight: 700; color: var(--on-navy); margin-bottom: 8px; }
.or-footer__cols a { display: inline-flex; min-height: 36px; align-items: center; }
.or-footer__legal { margin-top: 32px; padding-top: 24px; border-top: 1px solid rgba(255, 255, 255, 0.18); display: grid; gap: 10px; font-size: 14px; line-height: 21px; }
.or-footer__legal strong { color: var(--on-navy); }
.or-footer__legal p a { text-decoration: underline; text-underline-offset: 2px; }
@media (min-width: 768px) { .or-footer { padding-bottom: 48px; } .or-footer__top { grid-template-columns: 320px minmax(0, 1fr); gap: 48px; } .or-footer__cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } }

/* ---------- Mobile bar (max due azioni) ---------- */
.or-mbar { position: fixed; left: 0; right: 0; bottom: 0; z-index: 30; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 8px 12px calc(8px + env(safe-area-inset-bottom)); background: var(--surface); border-top: 1px solid var(--border); box-shadow: 0 -4px 16px rgba(0, 59, 99, 0.10); }
.or-mbar .or-btn { min-height: 48px; padding: 10px 14px; }
@media (min-width: 1100px) { .or-mbar { display: none; } }

/* ---------- Form preventivo ---------- */
.or-qform { display: grid; gap: 20px; }
.or-progress { display: grid; gap: 8px; }
.or-progress__segs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.or-progress__seg { display: block; height: 6px; border-radius: var(--radius-full); background: var(--border); }
.or-progress__seg[data-on="true"] { background: var(--navy); }
.or-choice { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 16px; border: 1.5px solid var(--border-control); border-radius: var(--radius-md); background: var(--surface); color: var(--navy); font-weight: 700; font-size: 17px; cursor: pointer; }
.or-choice input { width: 22px; height: 22px; accent-color: var(--navy); margin: 0; flex: none; }
.or-choice:has(input:checked) { border: 2px solid var(--navy); background: var(--tint-blue); }
.or-consent { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border: 1.5px solid var(--border-control); border-radius: var(--radius-md); font-size: 15px; line-height: 22px; }
.or-consent input { width: 22px; height: 22px; margin: 1px 0 0; accent-color: var(--navy); flex: none; }
.or-qform__nav { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 12px; }

/* ---------- Blog: articolo ----------
   Un solo percorso: "In breve" con le cifre, il primo passo del form dentro la pagina
   (in colonna fissa da 1024px), un calcolo della rata, i documenti in lista. */
.or-bc--short li[aria-current] { display: none; }
@media (min-width: 768px) { .or-bc--short li[aria-current] { display: list-item; } }
/* La testata sta nella griglia: il fondo si estende a tutta larghezza (box-shadow + clip-path),
   così su desktop la colonna del preventivo parte all'altezza del titolo. */
.or-article__head { background: var(--surface-alt); box-shadow: 0 0 0 100vmax var(--surface-alt); clip-path: inset(0 -100vmax); padding: 8px 0 28px; }
.or-article__headwrap { display: grid; gap: 14px; max-width: 760px; }
.or-article__head .or-tag { text-decoration: none; }
.or-article__title { font-size: 28px; line-height: 34px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); }
.or-article__lead { max-width: 720px; }
.or-byline { display: flex; align-items: center; gap: 12px; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-byline a { color: var(--link); font-weight: 700; }
.or-avatar { display: grid; place-items: center; width: 40px; height: 40px; border-radius: var(--radius-full); background: var(--navy); color: var(--on-navy); font-size: 14px; line-height: 1; font-weight: 700; flex: none; }
.or-avatar--alt { background: var(--tint-blue); color: var(--navy); }
.or-article__grid { display: grid; gap: 24px; padding-bottom: 56px; }
.or-article__body { min-width: 0; display: grid; gap: 24px; align-content: start; }
.or-article__aside { display: none; }

/* In breve: tre cifre grandi */
.or-kfacts { border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); overflow: hidden; }
.or-kfacts__title { padding: 12px 20px; background: var(--tint-yellow); font-size: 15px; line-height: 20px; font-weight: 700; color: var(--navy); }
.or-kfacts li { display: grid; grid-template-columns: 116px minmax(0, 1fr); gap: 12px; align-items: center; padding: 14px 20px; border-top: 1px solid var(--border); font-size: 16px; line-height: 22px; }
.or-kfacts__num { font-size: 26px; line-height: 30px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); white-space: nowrap; }

/* Primo passo del form */
.or-fstart { display: grid; gap: 16px; padding: 20px; border-radius: var(--radius-lg); background: var(--navy); color: var(--on-navy); }
.or-fstart__progress { display: grid; gap: 8px; }
.or-fstart__step { font-size: 14px; line-height: 20px; font-weight: 700; color: var(--yellow); }
.or-fstart__segs { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 4px; }
.or-fstart__segs span { display: block; height: 6px; border-radius: var(--radius-full); background: rgba(255, 255, 255, 0.24); }
.or-fstart__segs span[data-on="true"] { background: var(--yellow); }
.or-fstart__q { font-size: 24px; line-height: 30px; font-weight: 800; letter-spacing: -0.02em; color: var(--on-navy); }
.or-fstart__opts { display: grid; gap: 10px; }
.or-fstart__opt { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 10px 12px 10px 10px; border-radius: var(--radius-md); background: var(--surface); color: var(--navy); font-size: 17px; line-height: 22px; font-weight: 700; text-decoration: none; }
.or-fstart__opt:hover { background: var(--tint-blue); }
.or-fstart__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--tint-blue); color: var(--navy); flex: none; }
.or-fstart__label { flex: 1; min-width: 0; }
.or-fstart__go { display: grid; place-items: center; width: 36px; height: 36px; border-radius: var(--radius-full); background: var(--yellow); color: var(--on-yellow); flex: none; }
.or-fstart__go .or-ico { width: 20px; height: 20px; }
.or-fstart .or-link { justify-self: start; }
.or-content .or-fstart { margin: 16px 0 8px; }

/* Indice a fisarmonica */
.or-toc { border: 1.5px solid var(--border-control); border-radius: var(--radius-md); }
.or-toc > summary { display: flex; justify-content: space-between; align-items: center; min-height: 52px; padding: 0 16px; font-weight: 700; color: var(--navy); cursor: pointer; list-style: none; }
.or-toc > summary::-webkit-details-marker { display: none; }
.or-toc > summary::after { content: "+"; font-size: 22px; font-weight: 400; }
.or-toc[open] > summary::after { content: "−"; }
.or-toc ol { list-style: none; padding: 0 16px 12px; margin: 0; }
.or-toc li a { display: flex; align-items: center; min-height: 40px; color: var(--ink); text-decoration: none; font-size: 15px; line-height: 20px; }
.or-toc li a:hover { color: var(--link); text-decoration: underline; }

/* Testo */
.or-content { display: grid; gap: 16px; max-width: 720px; }
.or-content h2 { font-size: 24px; line-height: 30px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); margin-top: 24px; scroll-margin-top: 16px; }
.or-content > :where(ul, ol):not([class]) { display: grid; gap: 8px; padding-left: 24px; list-style: revert; }
.or-content > ul:not([class]) li::marker { color: var(--link); }
.or-content > ol:not([class]) li::marker { color: var(--navy); font-weight: 800; }
.or-sources-list { display: grid; gap: 8px; font-size: 15px; line-height: 22px; }

/* Calcolo della rata dentro l'articolo */
.or-qcalc { display: grid; gap: 16px; padding: 20px 16px; margin: 8px 0; border-radius: var(--radius-lg); background: var(--tint-yellow); }
.or-qcalc__title { font-size: 20px; line-height: 26px; font-weight: 800; letter-spacing: -0.01em; color: var(--navy); }
.or-qcalc__row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 16px; align-items: end; }
.or-qcalc__out { display: grid; padding-left: 14px; border-left: 3px solid var(--navy); }
.or-qcalc__value { font-size: 32px; line-height: 38px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); font-variant-numeric: tabular-nums; }
.or-euro { position: relative; }
.or-euro .or-input { padding-right: 36px; appearance: textfield; -moz-appearance: textfield; }
.or-euro .or-input::-webkit-inner-spin-button, .or-euro .or-input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.or-euro span { position: absolute; right: 14px; top: 50%; transform: translateY(-50%); font-weight: 700; color: var(--ink-muted); pointer-events: none; }

/* Pagine prodotto: stessa griglia e stessi blocchi dell'articolo (la testata ha H1 in scala hero) */
.or-article__trust { margin-top: 0; font-size: 14px; line-height: 20px; }
.or-fstart__hint { font-size: 14px; line-height: 20px; color: var(--on-navy-muted); }
.or-content .or-box h2 { font-size: 20px; line-height: 26px; margin-top: 0; letter-spacing: -0.01em; }
.or-content .or-box { margin: 8px 0; }
.or-table--compare th, .or-table--compare td { text-align: left; vertical-align: top; }
.or-table.or-table--compare td:last-child, .or-table.or-table--compare th:last-child { text-align: left; }
.or-table--compare tbody th { background: var(--surface-alt); color: var(--navy); font-weight: 700; border-top: 1px solid var(--border); }
.or-table--compare { font-size: 15px; line-height: 21px; table-layout: fixed; }
.or-table--compare th, .or-table--compare td { padding: 10px 12px; }
.or-table--compare thead th:first-child, .or-table--compare tbody th { width: 30%; }

/* Documenti */
.or-doclist { border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.or-doclist li { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-top: 1px solid var(--border); }
.or-doclist li:first-child { border-top: 0; }
.or-doclist .or-ico { width: 22px; height: 22px; margin-top: 3px; color: var(--link); }

/* Tabelle (DataTable) */
.or-table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-md); }
.or-table { width: 100%; border-collapse: collapse; font-size: 16px; line-height: 22px; font-variant-numeric: tabular-nums; }
.or-table caption { caption-side: bottom; padding: 10px 14px; text-align: left; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-table th { background: var(--navy); color: var(--on-navy); text-align: left; font-weight: 700; padding: 12px 14px; }
.or-table td { padding: 12px 14px; border-top: 1px solid var(--border); }
.or-table td:last-child, .or-table th:last-child { text-align: right; }

/* Autore */
.or-authorbox { display: grid; gap: 14px; padding: 20px; border-radius: var(--radius-lg); border: 1px solid var(--border); font-size: 15px; line-height: 22px; }
.or-authorbox__row { display: flex; gap: 12px; align-items: center; }
.or-authorbox strong { color: var(--navy); }

@media (min-width: 768px) {
  .or-article__head { padding: 16px 0 40px; }
  .or-article__title { font-size: 40px; line-height: 46px; letter-spacing: -0.03em; }
  .or-content h2 { font-size: 28px; line-height: 34px; }
  .or-kfacts ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .or-kfacts li { grid-template-columns: 1fr; align-items: start; gap: 6px; padding: 20px; font-size: 15px; }
  .or-kfacts li + li { border-left: 1px solid var(--border); }
  .or-kfacts__num { font-size: 36px; line-height: 40px; }
  .or-fstart { padding: 24px; }
  .or-qcalc { padding: 24px; }
}
@media (min-width: 1024px) {
  .or-article__grid { grid-template-columns: minmax(0, 720px) 340px; grid-template-rows: auto 1fr; justify-content: space-between; gap: 40px 64px; }
  .or-article__head, .or-article__body { grid-column: 1; }
  .or-article__head { padding: 24px 0 48px; }
  .or-fstart--inline { display: none; }
  .or-article__aside { display: block; grid-column: 2; grid-row: 1 / span 2; align-self: start; position: sticky; top: 24px; margin-top: 24px; }
  .or-article__aside .or-fstart__q { font-size: 22px; line-height: 28px; }
}

/* ---------- Blog: archivio guide ---------- */
.or-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.or-chip { display: inline-flex; align-items: center; min-height: 40px; padding: 0 14px; white-space: nowrap; border: 1.5px solid var(--border-control); border-radius: var(--radius-full); color: var(--navy); font-weight: 700; font-size: 15px; text-decoration: none; }
.or-chip:hover { background: var(--tint-blue); }
.or-chip[aria-current="page"] { background: var(--navy); border-color: var(--navy); color: var(--on-navy); }
.or-pager { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-top: 32px; color: var(--ink-muted); }

/* ---------- Bollino OAM ----------
   Il bollino ufficiale OAM porta sempre alla scheda dell'iscrizione sul sito dell'OAM. */
.or-oam { display: inline-block; flex: none; border-radius: 10px; line-height: 0; }
.or-oam img { width: 100%; height: auto; border-radius: 10px; }
.or-oam:focus-visible { outline: 3px solid var(--focus-ring); outline-offset: 3px; }
.or-footer__oam { width: 80px; }
.or-footer .or-oam:focus-visible { outline-color: var(--focus-ring-on-dark); }
.or-trust__oam { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.or-trustbadge { display: grid; grid-template-columns: 88px minmax(0, 1fr); gap: 16px; align-items: center; padding: 20px; border-radius: var(--radius-lg); border: 1px solid var(--border); background: var(--surface); }
.or-trustbadge .or-oam { width: 88px; }
.or-trustbadge p { font-size: 15px; line-height: 22px; }
.or-trustbadge p + p { margin-top: 6px; }
.or-trustbadge strong { color: var(--navy); }

/* ---------- Contatti ---------- */
.or-contacts { display: grid; gap: 12px; }
.or-contact { display: flex; gap: 14px; align-items: center; min-height: 76px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); color: var(--navy); text-decoration: none; }
.or-contact:hover { border-color: var(--border-control); background: var(--tint-blue); }
.or-contact__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--tint-blue); color: var(--navy); flex: none; }
.or-contact__text { display: grid; min-width: 0; }
.or-contact__label { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-contact__value { font-size: 18px; line-height: 24px; font-weight: 700; overflow-wrap: anywhere; }
@media (min-width: 768px) { .or-contacts { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 24px; } }

/* Point: una card per sede, filiale o point */
.or-point { display: grid; gap: 12px; padding: 20px; border: 1px solid var(--border); border-radius: var(--radius-lg); background: var(--surface); align-content: start; }
.or-point__head { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.or-point__type { display: inline-flex; align-items: center; min-height: 26px; padding: 0 10px; border-radius: var(--radius-full); background: var(--tint-blue); color: var(--navy); font-size: 13px; line-height: 18px; font-weight: 700; }
.or-point__type--sede { background: var(--tint-yellow); }
.or-point__rows { display: grid; gap: 8px; font-size: 16px; line-height: 24px; }
.or-point__rows li { display: flex; gap: 10px; align-items: flex-start; }
.or-point__rows .or-ico { width: 20px; height: 20px; margin-top: 2px; color: var(--link); }
.or-point__actions { display: flex; flex-wrap: wrap; gap: 8px 20px; }
.or-points { display: grid; gap: 16px; }
@media (min-width: 768px) { .or-points { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; } }
.or-content .or-point, .or-article__body .or-point { border-color: var(--border-control); }

/* Elenco dei point per regione: una fisarmonica per regione */
.or-regions { border-top: 1px solid var(--border); }
.or-regions details { border-bottom: 1px solid var(--border); }
.or-regions summary { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 12px 0; font-size: 18px; line-height: 24px; font-weight: 700; color: var(--navy); cursor: pointer; list-style: none; }
.or-regions summary::-webkit-details-marker { display: none; }
.or-regions summary .or-small { margin-left: auto; font-weight: 400; }
.or-regions summary::after { content: "+"; display: grid; place-items: center; width: 32px; height: 32px; border-radius: var(--radius-full); background: var(--tint-blue); font-weight: 400; font-size: 22px; flex: none; }
.or-regions details[open] summary::after { content: "−"; }
.or-regions ul { display: grid; gap: 4px; padding: 0 0 16px; }
.or-regions li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; padding: 10px 12px; border-radius: var(--radius-md); background: var(--surface-alt); }
.or-regions li strong { color: var(--navy); }
.or-regions li a { font-weight: 700; }
@media (min-width: 1024px) { .or-regions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 48px; border-top: 0; } .or-regions details:nth-child(-n+2) { border-top: 1px solid var(--border); } }

/* Mappa: si carica solo al clic, dopo il consenso */
.or-map { display: grid; place-items: center; gap: 8px; min-height: 200px; padding: 20px; border-radius: var(--radius-lg); background: var(--tint-blue); text-align: center; color: var(--navy); }
.or-map .or-ico { width: 32px; height: 32px; }
.or-map p { font-size: 14px; line-height: 20px; color: var(--ink-muted); max-width: 320px; }

/* Elenco di dati (trasparenza, dati societari) */
.or-dl { display: grid; border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.or-dl > div { display: grid; gap: 2px; padding: 12px 16px; border-top: 1px solid var(--border); }
.or-dl > div:first-child { border-top: 0; }
.or-dl dt { font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-dl dd { margin: 0; font-weight: 700; color: var(--navy); overflow-wrap: anywhere; }
@media (min-width: 768px) { .or-dl > div { grid-template-columns: 220px minmax(0, 1fr); gap: 16px; } }

/* Documenti scaricabili */
.or-doclinks { display: grid; gap: 8px; }
.or-doclinks a { display: flex; gap: 12px; align-items: center; min-height: 64px; padding: 12px 16px; border: 1px solid var(--border); border-radius: var(--radius-md); color: var(--navy); font-weight: 700; text-decoration: none; }
.or-doclinks a:hover { background: var(--tint-blue); }
.or-doclinks .or-ico { color: var(--link); }
.or-doclinks span { display: grid; flex: 1; }
.or-doclinks small { font-size: 14px; line-height: 20px; font-weight: 400; color: var(--ink-muted); }

/* ---------- Chi siamo: persone ---------- */
.or-team { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.or-person { display: grid; gap: 8px; align-content: start; font-size: 15px; line-height: 21px; }
.or-person__photo { display: grid; place-items: center; aspect-ratio: 4 / 5; border-radius: var(--radius-lg); background: var(--tint-blue); color: var(--ink-muted); font-size: 13px; line-height: 18px; text-align: center; padding: 8px; }
.or-person strong { color: var(--navy); font-size: 16px; }
@media (min-width: 768px) { .or-team { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; } }

/* ---------- Grazie e 404 ---------- */
.or-done { display: grid; gap: 16px; justify-items: start; }
.or-done__icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: var(--radius-full); background: var(--navy); color: var(--yellow); }
.or-done__icon .or-ico { width: 32px; height: 32px; stroke-width: 2.5; }
.or-tag--plain { background: var(--tint-blue); }

/* ---------- Banner cookie ----------
   Rifiuta e Accetta hanno lo stesso peso; la X chiude e rifiuta. Niente giallo: il giallo è del preventivo. */
.or-cookie { position: fixed; left: 0; right: 0; bottom: 0; z-index: 40; display: grid; gap: 14px; padding: 20px 16px calc(16px + env(safe-area-inset-bottom)); background: var(--surface); border-top: 1px solid var(--border); border-radius: var(--radius-lg) var(--radius-lg) 0 0; box-shadow: 0 -8px 24px rgba(0, 59, 99, 0.16); font-size: 15px; line-height: 22px; }
.or-cookie__head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.or-cookie__title { font-size: 20px; line-height: 26px; font-weight: 800; color: var(--navy); }
.or-cookie__close { display: grid; place-items: center; width: 44px; height: 44px; margin: -8px -8px -8px 0; border: 0; border-radius: var(--radius-full); background: transparent; color: var(--navy); cursor: pointer; font: inherit; font-size: 24px; }
.or-cookie__close:hover { background: var(--tint-blue); }
.or-cookie__actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.or-cookie__actions .or-btn { min-height: 48px; padding: 10px 12px; }
.or-cookie__more { justify-self: center; }
.or-cookie__prefs { display: grid; border-top: 1px solid var(--border); }
.or-switchrow { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 16px; align-items: center; padding: 12px 0; border-bottom: 1px solid var(--border); }
.or-switchrow strong { color: var(--navy); }
.or-switchrow p { grid-column: 1; font-size: 14px; line-height: 20px; color: var(--ink-muted); }
.or-switch { grid-row: 1 / span 2; grid-column: 2; position: relative; width: 52px; height: 32px; flex: none; }
.or-switch input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: pointer; }
.or-switch span { display: block; width: 52px; height: 32px; border-radius: var(--radius-full); background: var(--border-control); transition: background .15s; }
.or-switch span::after { content: ""; position: absolute; top: 4px; left: 4px; width: 24px; height: 24px; border-radius: 50%; background: var(--surface); transition: transform .15s; }
.or-switch input:checked + span { background: var(--navy); }
.or-switch input:checked + span::after { transform: translateX(20px); }
.or-switch input:disabled + span { opacity: .55; }
.or-switch input:focus-visible + span { outline: 3px solid var(--focus-ring); outline-offset: 2px; }
@media (min-width: 768px) { .or-cookie { left: auto; right: 24px; bottom: 24px; width: 440px; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 24px; } }

/* ---------- Pagine di testo legale ---------- */
.or-legal { display: grid; gap: 16px; max-width: 720px; }
.or-legal h2 { font-size: 22px; line-height: 28px; font-weight: 800; color: var(--navy); margin-top: 20px; scroll-margin-top: 16px; }
.or-placeholder { padding: 12px 16px; border: 1.5px dashed var(--border-control); border-radius: var(--radius-md); color: var(--ink-muted); font-size: 15px; line-height: 22px; }
.or-cookie__more { background: none; border: 0; padding: 0 8px; font: inherit; font-weight: 700; cursor: pointer; }
.or-cookie a { font-weight: 700; }
@media (min-width: 768px) { .or-footer__legal { grid-template-columns: 80px minmax(0, 1fr); column-gap: 24px; align-items: start; } .or-footer__legal > p { grid-column: 2; } .or-footer__oam { grid-row: 1 / span 3; } }

/* Card convenzione con bollino (INPS, NoiPA): il bollino Orfin sostituisce l'icona */
.or-conv__badge { width: 80px; height: 80px; flex: none; }
.or-conv--badge .or-conv__head { gap: 16px; }
.or-conv-more { margin-top: 20px; display: flex; flex-wrap: wrap; align-items: center; gap: 0 8px; }
.or-conv-more + .or-note { margin-top: 8px; }
@media (min-width: 768px) {
  .or-convs.or-convs--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .or-convs--2 .or-conv { padding: 28px 32px; }
  .or-convs--2 .or-conv--badge { display: grid; grid-template-columns: 112px minmax(0, 1fr); column-gap: 28px; row-gap: 8px; align-content: start; }
  .or-convs--2 .or-conv--badge .or-conv__head { display: contents; }
  .or-convs--2 .or-conv__badge { grid-column: 1; grid-row: 1 / span 4; width: 112px; height: 112px; }
  .or-convs--2 .or-conv--badge > :not(.or-conv__head), .or-convs--2 .or-conv--badge .or-conv__tag { grid-column: 2; }
}

/* ---------- CTA e form di contesto negli articoli ----------
   Domanda di contesto (stile FormStart), CTA in riga, WhatsApp, Richiamami. */
.or-cb { display: grid; gap: 14px; padding: 20px 16px; border-radius: var(--radius-lg); background: var(--tint-blue); }
.or-cb__title { font-size: 22px; line-height: 28px; font-weight: 800; letter-spacing: -0.02em; color: var(--navy); }
.or-cb__sub { font-size: 16px; line-height: 24px; color: var(--ink); }
.or-cb__form { display: grid; gap: 16px; }
.or-cb__row { display: grid; gap: 16px; }
.or-cb .or-consent { background: var(--surface); }
.or-cb .or-seg label { background: var(--surface); }
.or-cb__done { display: grid; gap: 6px; }
.or-content .or-cb { margin: 16px 0 8px; }
.or-ctainline { display: grid; gap: 12px; padding: 16px 20px; border-radius: var(--radius-lg); background: var(--tint-yellow); }
.or-ctainline p { font-size: 17px; line-height: 26px; color: var(--ink); }
.or-ctainline strong { color: var(--navy); }
.or-ctainline .or-btn { justify-self: start; }
.or-content .or-ctainline { margin: 8px 0; }
.or-wa { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 4px 14px; align-items: start; padding: 16px; border: 1.5px solid var(--border-control); border-radius: var(--radius-lg); background: var(--surface); }
.or-wa__icon { grid-row: 1 / span 2; display: grid; place-items: center; width: 44px; height: 44px; border-radius: var(--radius-md); background: var(--tint-blue); color: var(--navy); }
.or-wa__title { font-size: 18px; line-height: 24px; font-weight: 800; color: var(--navy); }
.or-wa p { font-size: 16px; line-height: 24px; }
.or-wa__actions { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 20px; margin-top: 8px; }
.or-content .or-wa { margin: 8px 0; }
.or-kit__label { display: flex; align-items: center; gap: 10px; margin-top: 16px; font-size: 14px; line-height: 20px; font-weight: 700; color: var(--ink-muted); }
.or-kit__label span { display: grid; place-items: center; width: 26px; height: 26px; border-radius: var(--radius-full); background: var(--navy); color: var(--on-navy); font-size: 13px; }
@media (min-width: 768px) {
  .or-cb { padding: 24px; }
  .or-cb__row { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .or-cb .or-seg__opts { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .or-ctainline { grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 24px; padding: 20px 24px; }
  .or-ctainline .or-btn { justify-self: end; }
}

/* ---------- Compatibilità iPhone e Android ----------
   Campi a 18px (niente zoom di iOS al tocco), select uguali su tutti i sistemi, niente evidenziazione
   grigia al tocco, altezze con dvh dove serve, ancore che non finiscono sotto il bordo. */
.or a, .or button, .or input, .or select, .or summary, .or label { -webkit-tap-highlight-color: rgba(0, 59, 99, 0.12); touch-action: manipulation; }
.or button { font-family: inherit; }
.or input, .or select, .or textarea { font-family: inherit; }
select.or-input { -webkit-appearance: none; appearance: none; padding-right: 44px; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23003b63' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; }
.or-input::placeholder { color: var(--ink-muted); opacity: 1; }
.or input[type="radio"], .or input[type="checkbox"] { flex: none; }
.or [id] { scroll-margin-top: 16px; }
@supports (height: 100dvh) { .or-menu__panel { max-height: calc(100dvh - 64px); } }