/* Vito · reading pages: /come-lavoro/, /contatti/, /privacy/, 404 (2026-09-20). Generated by vito-drafts/home-v3/gen-home.mjs — edit there. */
:root{
  --paper:#FBFAF5; --ink:#23271F; --olive:#24382C; --mute:#707564;
  --rule:rgba(35,39,31,.17); --rule-f:rgba(35,39,31,.085);
  --la:"Vito Bodoni","Vito Noto Serif SC",serif; --zh:"Vito Noto Serif SC",serif; --mo:"Vito Plex Mono","Vito Noto Serif SC",monospace;
  --gutter:clamp(16px,4vw,56px); --col:min(92vw,760px);
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--la);font-optical-sizing:auto;font-size:17px;line-height:1.5;text-wrap:pretty}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
[lang="zh"],[lang="zh-Hans"]{font-family:var(--zh)}
.L{display:none}
html[data-lang="it"] .L[lang="it"],html[data-lang="en"] .L[lang="en"],html[data-lang="zh"] .L[lang="zh"]{display:inline}
html[data-lang="zh"] body{line-height:1.75}

/* header — same as the home, but in the flow */
.hd{display:grid;grid-template-columns:auto 1fr auto auto;align-items:center;gap:20px;padding:22px var(--gutter);border-bottom:1px solid var(--rule-f)}
.wordmark{display:inline-flex;color:var(--ink);line-height:0}
.wordmark svg{width:68px;height:auto;display:block}
.hd__tag{font-family:var(--mo);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
html[data-lang="zh"] .hd__tag{letter-spacing:.24em;text-transform:none}
.hd__come{font-family:var(--mo);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--ink);border-bottom:1px solid var(--ink);padding-bottom:2px;margin-right:14px}
html[data-lang="zh"] .hd__come{text-transform:none;letter-spacing:.2em}
.hd__lang{display:flex;gap:2px;font-family:var(--mo);font-size:12px;letter-spacing:.14em}
.hd__lang button{appearance:none;background:none;border:0;padding:6px 8px;color:var(--mute);font:inherit;cursor:pointer;border-bottom:1px solid transparent}
.hd__lang button[aria-pressed="true"]{color:var(--ink);border-bottom-color:var(--ink)}
.hd__lang button[data-lang="zh"]{font-family:var(--zh);letter-spacing:0}

/* page */
.cl{width:var(--col);margin:0 auto;padding:56px 0 40px}
.eyebrow{font-family:var(--mo);font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--mute);margin:0 0 18px}
html[data-lang="zh"] .eyebrow{text-transform:none;letter-spacing:.3em}
.h1{font-weight:400;font-size:clamp(40px,5vw,64px);line-height:1.02;letter-spacing:-.01em;margin:0 0 22px}
html[data-lang="zh"] .h1{font-family:var(--zh);letter-spacing:.02em;line-height:1.25}
h2{font-weight:400;font-size:clamp(28px,3.2vw,36px);line-height:1.1;letter-spacing:-.005em;margin:0 0 18px}
html[data-lang="zh"] h2{font-family:var(--zh);line-height:1.3}
h3{font-family:var(--mo);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute);font-weight:400;margin:0 0 10px}
html[data-lang="zh"] h3{text-transform:none;letter-spacing:.24em}
.lead{font-size:20px;line-height:1.45;max-width:34em;margin:0 0 14px}
html[data-lang="zh"] .lead{font-size:18px;line-height:1.7}
p{margin:0 0 14px;max-width:38em}
.nota{color:var(--mute);font-size:15px}
.azioni{display:flex;gap:22px;align-items:center;flex-wrap:wrap;margin:22px 0 0}
.cta{display:inline-block;font-family:var(--mo);font-size:12px;letter-spacing:.18em;text-transform:uppercase;padding:12px 18px;border:1px solid var(--ink);color:var(--ink)}
html[data-lang="zh"] .cta{text-transform:none;letter-spacing:.28em}
.apri{font-family:var(--mo);font-size:12px;letter-spacing:.16em;text-transform:uppercase;border-bottom:1px solid var(--rule)}
html[data-lang="zh"] .apri{text-transform:none;letter-spacing:.24em}
.salta{display:flex;gap:18px;flex-wrap:wrap;margin:34px 0 0;padding-top:16px;border-top:1px solid var(--rule-f);font-family:var(--mo);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
html[data-lang="zh"] .salta{text-transform:none;letter-spacing:.2em}
.salta a:hover{color:var(--ink)}
.cl__sez{padding:44px 0 8px;margin-top:36px;border-top:1px solid var(--rule)}
ul,ol{margin:0;padding:0;list-style:none}
.comune ul li,.pacchetto ul li{padding:9px 0;border-top:1px solid var(--rule-f)}
.comune{margin:8px 0 26px}
.pacchetti{display:grid;grid-template-columns:1fr 1fr;gap:36px}
.pacchetto h3{color:var(--ink)}
.pacchetto h3 b{font-family:var(--la);font-weight:400;font-size:22px;letter-spacing:0;text-transform:none;margin-right:8px}
html[data-lang="zh"] .pacchetto h3 b{font-family:var(--zh)}
.pacchetto h3 span{color:var(--mute)}
#ottieni .nota{margin-top:24px}
.persona{border-bottom:1px solid var(--rule)}
.scelte{margin:0 0 22px}
.scelte>div{display:grid;grid-template-columns:150px minmax(0,1fr);gap:12px 24px;padding:16px 0;border-top:1px solid var(--rule-f)}
.scelte dt{font-size:17px;color:var(--ink)}
.scelte dd{margin:0;max-width:38em}
@media(max-width:719px){.scelte>div{grid-template-columns:1fr;gap:6px}}
.esempio{margin:0 0 20px}
.esempio img{border:1px solid var(--rule)}
.esempio figcaption{font-family:var(--mo);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute);margin-top:10px}
html[data-lang="zh"] .esempio figcaption{text-transform:none;letter-spacing:.2em}
.passi{counter-reset:p}
.passi li{counter-increment:p;position:relative;padding:12px 0 12px 46px;border-top:1px solid var(--rule-f);max-width:40em}
.passi li::before{content:"0" counter(p);position:absolute;left:0;top:15px;font-family:var(--mo);font-size:12px;letter-spacing:.12em;color:var(--mute)}
.cl__scrivi .azioni{margin-top:10px}
.ft{width:var(--col);margin:0 auto;padding:28px 0 34px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;border-top:1px solid var(--rule);font-family:var(--mo);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
html[data-lang="zh"] .ft{text-transform:none;letter-spacing:.2em}
.ft a{border-bottom:1px solid var(--rule)}

@media (max-width:719px){
  .hd{grid-template-columns:1fr auto;grid-template-areas:"mark lang" "tag come";row-gap:6px;padding:18px 16px 12px}
  .wordmark{grid-area:mark}.hd__lang{grid-area:lang;justify-self:end}.hd__tag{grid-area:tag}.hd__come{grid-area:come;justify-self:end;margin-right:0}
  .cl{padding-top:36px}
  .pacchetti{grid-template-columns:1fr;gap:26px}
  .lead{font-size:18px}
  .ft{padding-left:16px;padding-right:16px}
}

/* contact form (pagina.css) */
.reg{padding:44px 0 8px;margin-top:36px;border-top:1px solid var(--rule)}
.diretti{margin:26px 0 0;padding:0;list-style:none;border-top:1px solid var(--rule)}
.diretti li{display:grid;grid-template-columns:110px 1fr;gap:8px 18px;align-items:baseline;padding:14px 0;border-bottom:1px solid var(--rule-f)}
html:not([data-lang="zh"]) .diretti li[lang="zh"]{display:none}
.diretti .k{font-family:var(--mo);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
.diretti .v{font-size:22px}
.diretti li.pari{padding:22px 0;scroll-margin-top:24px}
.diretti .pari__title{grid-column:1/-1;font-family:var(--la);font-size:20px;line-height:1.4;letter-spacing:0;text-transform:none;color:var(--ink);margin:0 0 4px}
.diretti .pari .nota{grid-column:2;margin:0;font-size:15px;line-height:1.6}
.diretti .pari__cta{grid-column:2;justify-self:start;max-width:100%;padding:10px 0;letter-spacing:.08em}
@media(max-width:719px){.diretti .pari .nota,.diretti .pari__cta{grid-column:1}}
.diretti .n{grid-column:2;font-family:var(--mo);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
html[data-lang="zh"] .diretti .n{text-transform:none;letter-spacing:.2em}
.modulo{display:grid;grid-template-columns:1fr 1fr;gap:22px 32px}
.modulo .f{display:grid;gap:8px}
.modulo .f--wide{grid-column:1/-1}
.modulo label{font-family:var(--mo);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--mute)}
html[data-lang="zh"] .modulo label{text-transform:none;letter-spacing:.24em}
.modulo .req{color:var(--ink);margin-left:4px}
.modulo input[type="text"],.modulo input[type="email"],.modulo input[type="tel"],.modulo textarea{width:100%;font:inherit;font-size:17px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--rule);border-radius:0;padding:10px 0}
.modulo textarea{resize:vertical;min-height:110px}
.modulo input:focus,.modulo textarea:focus{outline:none;border-bottom-color:var(--ink)}
.modulo .nota{margin:-8px 0 0}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.modulo label.consenso{display:flex;gap:12px;align-items:flex-start;font-size:15px;color:var(--mute);font-family:var(--la);text-transform:none;letter-spacing:0}
html[data-lang="zh"] .modulo label.consenso{font-family:var(--zh)}
.consenso input{margin-top:5px;width:16px;height:16px;accent-color:var(--ink)}
.consenso a{border-bottom:1px solid var(--rule);color:var(--ink)}
.stato{font-family:var(--mo);font-size:12px;letter-spacing:.14em;color:var(--mute)}
.stato[data-s="err"]{color:var(--ink)}
.cta[type="submit"]{cursor:pointer;background:var(--ink);color:var(--paper)}
.cta[type="submit"]:disabled{opacity:.5;cursor:default}
.legale h2{font-size:22px;margin:26px 0 8px}
code{font-family:var(--mo);font-size:.92em}
@media (max-width:719px){ .modulo{grid-template-columns:1fr} .diretti li{grid-template-columns:1fr} .diretti .n{grid-column:1} }
