:root{
  --bg:#ffffff;
  --text:#0f172a;
  --muted:#4b5563;
  --brand:#0ea5e9;
  --accent:#f59e0b;
  --mint:#34d399;
  --lilac:#a78bfa;
  --tint:#f8fafc;
  color-scheme: light;
}
html,body{overflow-x:hidden}
body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Arial,sans-serif;color:var(--text);background:var(--bg)}
.section{padding:4.2rem 0}
.bg-tint{background:var(--tint)}
.small-muted{color:var(--muted)}

/* NAVBAR fixed (sticky) */
.navbar.fixed-top{
  z-index:1040;
  background:rgba(255,255,255,.95)!important;
  backdrop-filter:saturate(180%) blur(6px);
  border-bottom:1px solid #e5e7eb;
}
body{padding-top:64px}
@media (max-width:576px){body{padding-top:56px}}

/* HERO */
.hero{padding:4.5rem 0 3rem}
.badge-soft{border:1px solid rgba(14,165,233,.25);color:var(--brand);background:#e6f6fd;padding:.5rem .95rem;border-radius:999px;font-weight:600;font-size:.95rem}
.btn-brand{background:var(--brand);color:#fff;border:none;padding:.85rem 1.15rem;border-radius:.8rem;font-weight:600}
.hero-image img{max-width:100%;height:auto;display:block;border-radius:18px;box-shadow:0 10px 30px rgba(2,6,23,.05)}

/* HERO mobile layout */
@media (max-width:767px){
  .hero.container{padding-left:22px;padding-right:22px}
  .hero .row{display:grid;grid-template-columns:1fr 132px;column-gap:16px;align-items:center}
  .hero .col-text{padding-right:6px}
  .hero .col-image img{width:100%;max-width:132px;height:auto;object-fit:contain;border-radius:16px;box-shadow:0 8px 24px rgba(2,6,23,.06)}
}
@media (max-width:360px){
  .hero .row{grid-template-columns:1fr 110px}
  .hero .col-image img{max-width:110px}
}

/* GRID & CARDS */
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1.25rem}
@media (max-width:768px){ .grid-2{grid-template-columns:1fr !important} }
.card-clean{border:1px solid #e5e7eb;border-radius:1rem;background:#fff;padding:1.25rem;position:relative}
.card-clean.accent-left::before{content:"";position:absolute;left:-1px;top:-1px;bottom:-1px;width:6px;background:#34d399;border-radius:1rem 0 0 1rem}
.card-clean.accent-left.purple::before{background:#a78bfa}

/* STEPS */
.steps{display:flex;gap:1rem;flex-wrap:wrap}
.step{border:1px solid #e5e7eb;border-radius:1rem;background:#fff;flex:1 1 240px;display:flex;gap:.75rem;align-items:flex-start;padding:1rem}
.step-icon{width:40px;height:40px;border-radius:999px;display:grid;place-items:center;color:var(--text)}
.step-icon.mint{background:rgba(52,211,153,.2)}
.step-icon.lilac{background:rgba(167,139,250,.2)}
.step-icon.orange{background:rgba(245,158,11,.2)}

/* PILLS */
.pill-list{list-style:none;padding:0;margin:0;display:flex;flex-wrap:wrap;gap:.5rem}
.pill-list li{background:#fff;border:1px solid #e5e7eb;border-radius:999px;padding:.5rem .8rem;font-weight:600}

/* FORM CARD */
.form-card{background:#fff;border:1px solid #e5e7eb;border-radius:1rem;padding:1.25rem;box-shadow:0 10px 30px rgba(2,6,23,.03)}
.form-label{font-weight:600;margin-bottom:.25rem}
.form-control{border-radius:.8rem;border:1px solid #d1d5db;padding:.7rem .9rem}
.form-control:focus{border-color:var(--brand);box-shadow:0 0 0 .2rem rgba(14,165,233,.15)}
.privacy{color:#6b7280}

/* CV icons grid */
.bi{vertical-align:-.125em}
.cv-icons{display:grid;grid-template-columns:repeat(3,minmax(120px,1fr));gap:.75rem}
.cv-icons .card-clean{display:flex;align-items:center;gap:.6rem;padding:.8rem}
.cv-icons i{font-size:1.1rem;color:var(--brand)}
@media (max-width:576px){ .cv-icons{grid-template-columns:repeat(2,minmax(120px,1fr))} }

/* Pagine interne padding */
main.container.section{padding-left:24px;padding-right:24px}
@media (max-width:576px){main.container.section{padding-left:18px;padding-right:18px}}

/* No legacy timeline visuals */
.timeline, .timeline::before, .timeline .t-item, .timeline .t-item::before{ all:unset; }
/* Fix griglia competenze su mobile */
.cv-icons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: .75rem;
}

/* Righe di testo lunghe non devono uscire dal box */
.cv-icons .card-clean {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem;
  word-wrap: break-word;
  white-space: normal;
}
.cv-icons .card-clean span {
  font-size: .9rem;
  line-height: 1.2;
}
/* --- FIX: testo lungo nei box Competenze (CV) --- */
.cv-icons {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); /* box un filo più larghi */
  gap: .75rem;
}

.cv-icons .card-clean {
  display: flex;
  align-items: center;
  gap: .6rem;
  padding: .8rem;
  flex-wrap: wrap;              /* consenti andare a capo */
}

.cv-icons .card-clean i {
  flex: 0 0 auto;               /* l’icona resta compatta */
}

.cv-icons .card-clean span {
  flex: 1 1 0;                  /* il testo occupa lo spazio disponibile */
  min-width: 0;                 /* fondamentale per permettere il wrapping in flex */
  overflow-wrap: anywhere;      /* forza a capo se necessario */
  word-break: break-word;
  hyphens: auto;
  line-height: 1.25;
}

/* telefoni molto piccoli: riduci leggermente il font */
@media (max-width: 400px){
  .cv-icons .card-clean span { font-size: .9rem; }
}