/* V33: photographic before/after for the illustrative Excel-to-contracts example. */
.landing-v33 #esempio { background: #07162e; color: #fff; }
.landing-v33 #esempio .example-kicker { color: #a5f3fc; font: 700 .75rem/1.5 ui-monospace, monospace; letter-spacing: .18em; text-transform: uppercase; }
.landing-v33 #esempio h2 { max-width: 15ch; }
.landing-v33 #esempio h2 em { color: #8ce9f5; font-family: Georgia, 'Times New Roman', serif; font-weight: 700; }
.landing-v33 #esempio .example-intro { color: #dbeafe; font-size: clamp(1.1rem, 1.8vw, 1.4rem); line-height: 1.55; }
.landing-v33 #esempio .example-grid { display: grid; grid-template-columns: minmax(0, 1fr) 2.5rem minmax(0, 1fr); align-items: center; gap: 1rem; }
.landing-v33 #esempio .example-panel { min-width: 0; overflow: hidden; background: #fff; color: #0f172a; border: 1px solid #b9cee8; box-shadow: 10px 15px 0 rgba(67, 113, 174, .28); }
.landing-v33 #esempio .example-panel-after { border-color: #67e8f9; }
.landing-v33 #esempio .example-media { aspect-ratio: 3 / 2; overflow: hidden; background: #e2e8f0; }
.landing-v33 #esempio .example-media img { display: block; width: 100%; height: 100%; object-fit: cover; }
.landing-v33 #esempio .example-copy { padding: clamp(1.25rem, 2.3vw, 2rem); }
.landing-v33 #esempio .example-step { color: #1d4ed8; font: 700 .78rem/1.4 ui-monospace, monospace; letter-spacing: .15em; text-transform: uppercase; }
.landing-v33 #esempio .example-copy h3 { margin: .7rem 0 .6rem; font-size: clamp(1.65rem, 2.7vw, 2.6rem); line-height: 1.06; letter-spacing: -.05em; }
.landing-v33 #esempio .example-copy p { max-width: 52ch; color: #475569; line-height: 1.65; }
.landing-v33 #esempio .example-arrow { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 50%; background: #67e8f9; color: #06253c; font-size: 1.5rem; font-weight: 800; }
.landing-v33 #esempio .example-footer { display: flex; align-items: flex-start; justify-content: space-between; gap: 2rem; margin-top: 2.5rem; padding-top: 1.5rem; border-top: 1px solid rgba(255,255,255,.25); }
.landing-v33 #esempio .example-footer p { max-width: 78ch; color: #cbd5e1; font-size: .9rem; line-height: 1.7; }
.landing-v33 #esempio .example-footer strong { color: #fff; }
.landing-v33 #esempio .example-footer a { flex-shrink: 0; display: inline-flex; gap: .5rem; align-items: center; padding: .85rem 1rem; border: 1px solid #67e8f9; color: #fff; font-weight: 700; text-decoration: none; }
.landing-v33 #esempio .example-footer a:hover { background: #67e8f9; color: #06253c; }
@media (max-width: 900px) {
  .landing-v33 #esempio .example-grid { grid-template-columns: minmax(0, 1fr); gap: 1.5rem; }
  .landing-v33 #esempio .example-arrow { justify-self: center; transform: rotate(90deg); }
  .landing-v33 #esempio .example-footer { flex-direction: column; }
}
@media (max-width: 600px) {
  .landing-v33 #esempio .example-media { aspect-ratio: 1.35; }
  .landing-v33 #esempio .example-copy h3 { font-size: 1.8rem; }
}
