/* ============================================================
   PLUTONIS — Shared premium enhancement layer
   Additive only. Works on both class systems (home + engine pages).
   Loads once, cached across all pages. ~transform/opacity only.
   ============================================================ */
:root{
  --plx-gold:#c4a052;
  --plx-gold-soft:#d8bd7e;
  --plx-navy:#141a3e;
  --plx-ink:#0a0e1a;
  --plx-ease:cubic-bezier(.22,.61,.36,1);
  --plx-ease-out:cubic-bezier(.16,1,.3,1);
}

/* Base anti-CLS: le immagini scalano nel contenitore e mantengono le proporzioni,
   così width/height espliciti prenotano lo spazio senza distorcere. Senza !important:
   qualunque regola più specifica esistente vince. */
img{max-width:100%;height:auto}

/* ---- Smooth, accessible base ---- */
html{scroll-behavior:smooth}
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto}
}
*{-webkit-tap-highlight-color:transparent}

/* Visible, on-brand focus ring for keyboard users (a11y) */
a:focus-visible,button:focus-visible,input:focus-visible,
select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{
  outline:2px solid var(--plx-gold-soft);
  outline-offset:3px;
  border-radius:6px;
}

/* Skip link (injected by JS) */
.plx-skip{
  position:fixed;top:-60px;left:16px;z-index:2000;
  background:var(--plx-gold);color:#0a0e1a;font-weight:600;
  padding:10px 18px;border-radius:0 0 10px 10px;text-decoration:none;
  transition:top .25s var(--plx-ease);
}
.plx-skip:focus{top:0}

/* ============================================================
   1. SCROLL PROGRESS BAR (gold) — injected by JS
   ============================================================ */
.plx-progress{
  position:fixed;top:0;left:0;height:3px;width:100%;
  transform:scaleX(0);transform-origin:0 50%;
  background:linear-gradient(90deg,var(--plx-gold),var(--plx-gold-soft));
  z-index:1200;pointer-events:none;
  box-shadow:0 0 12px rgba(196,160,82,.5);
  will-change:transform;
}

/* ============================================================
   2. NAV — premium scroll behaviour (both nav systems)
   ============================================================ */
nav,nav.site-topnav{transition:background .35s var(--plx-ease),box-shadow .35s var(--plx-ease),backdrop-filter .35s var(--plx-ease)}
.plx-js nav.plx-nav-scrolled,
.plx-js nav.site-topnav.plx-nav-scrolled{
  background:rgba(13,17,38,.82);
  backdrop-filter:saturate(140%) blur(14px);
  -webkit-backdrop-filter:saturate(140%) blur(14px);
  box-shadow:0 10px 40px -12px rgba(0,0,0,.55);
}

/* ============================================================
   3. MOBILE NAV — hamburger + slide-in drawer (built by JS)
   ============================================================ */
.plx-burger{
  display:none;
  width:46px;height:46px;border:0;background:transparent;cursor:pointer;
  padding:11px;border-radius:12px;z-index:1101;position:relative;
  transition:background .2s var(--plx-ease);
}
.plx-burger:hover{background:rgba(255,255,255,.08)}
.plx-burger span{
  display:block;height:2px;width:100%;background:#fff;border-radius:2px;
  transition:transform .32s var(--plx-ease),opacity .2s var(--plx-ease);
}
.plx-burger span+span{margin-top:5px}
.plx-burger[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.plx-burger[aria-expanded="true"] span:nth-child(2){opacity:0}
.plx-burger[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

.plx-drawer{
  position:fixed;inset:0 0 0 auto;width:min(86vw,360px);
  background:linear-gradient(180deg,#141a3e 0%,#0a0e22 100%);
  z-index:1100;transform:translateX(100%);
  transition:transform .42s var(--plx-ease-out);
  padding:96px 26px 40px;overflow-y:auto;
  box-shadow:-30px 0 80px -20px rgba(0,0,0,.6);
  -webkit-overflow-scrolling:touch;
}
.plx-drawer.plx-open{transform:translateX(0)}
.plx-drawer a{
  display:block;color:#eef0f7;text-decoration:none;font-size:18px;
  font-weight:500;padding:15px 6px;border-bottom:1px solid rgba(255,255,255,.07);
  opacity:0;transform:translateX(18px);transition:color .2s var(--plx-ease);
}
.plx-drawer.plx-open a{animation:plxDrawerIn .5s var(--plx-ease-out) forwards}
.plx-drawer a:hover{color:var(--plx-gold-soft)}
.plx-drawer a small{display:block;font-size:13px;font-weight:300;color:#a9aec6;margin-top:2px}
.plx-drawer .plx-drawer-cta{
  margin-top:22px;text-align:center;background:var(--plx-gold);color:#0a0e1a;
  font-weight:600;border-radius:100px;border-bottom:0;padding:15px;
}
.plx-drawer .plx-drawer-cta:hover{background:var(--plx-gold-soft);color:#0a0e1a}
.plx-drawer-group-label{
  color:var(--plx-gold);font-size:11px;letter-spacing:.18em;text-transform:uppercase;
  margin:22px 6px 2px;font-weight:600;
}
@keyframes plxDrawerIn{to{opacity:1;transform:translateX(0)}}
.plx-scrim{
  position:fixed;inset:0;background:rgba(8,11,26,.55);
  backdrop-filter:blur(2px);-webkit-backdrop-filter:blur(2px);
  z-index:1099;opacity:0;visibility:hidden;transition:opacity .35s var(--plx-ease);
}
.plx-scrim.plx-open{opacity:1;visibility:visible}
body.plx-noscroll{overflow:hidden}

/* "Accedi" link — styling condiviso (le pagine engine non hanno la regola .nav-login) */
nav .nav-login{color:#fff;text-decoration:none;font-size:15px;opacity:.85;transition:opacity .2s}
nav .nav-login:hover{opacity:1}

@media (max-width:1024px){
  .plx-burger{display:block}
  /* hide the desktop inline menu cleanly; drawer takes over.
     Breakpoint alzato da 860 a 1024: sotto ~1050px il menu desktop si
     schiacciava (logo attaccato a "Chi siamo", "Contattaci"/"Accedi"
     attaccati, label a capo su due righe). Ora l'hamburger subentra prima. */
  nav .nav-menu{display:none !important}
  nav .nav-login{display:none !important}
}

/* ============================================================
   4. SCROLL REVEALS (JS adds .plx-reveal; .plx-in when visible)
   ============================================================ */
.plx-js .plx-reveal{
  opacity:0;transform:translateY(26px);
  transition:opacity .75s var(--plx-ease),transform .75s var(--plx-ease);
  will-change:opacity,transform;
}
.plx-js .plx-reveal.plx-r-left{transform:translateX(-32px)}
.plx-js .plx-reveal.plx-r-right{transform:translateX(32px)}
.plx-js .plx-reveal.plx-r-scale{transform:translateY(26px) scale(.97)}
.plx-js .plx-reveal.plx-in{opacity:1;transform:none}

@media (prefers-reduced-motion: reduce){
  .plx-js .plx-reveal{opacity:1 !important;transform:none !important;transition:none !important}
}

/* ============================================================
   5. HERO — cinematic entrance (CSS only, no FOUC)
   Targets both .hero (home + engine) heading stacks.
   ============================================================ */
.plx-js .hero{--plx-d:0ms}
.plx-js .hero .pill,
.plx-js .hero h1,
.plx-js .hero .sub,
.plx-js .hero .cta-row,
.plx-js .hero .press-top,
.plx-js .hero .eyebrow,
.plx-js .hero .lede,
.plx-js .hero .stat-band,
.plx-js .hero .btn-row{
  animation:plxHeroUp .9s var(--plx-ease-out) both;
}
.plx-js .hero .pill,.plx-js .hero .eyebrow{animation-delay:.05s}
.plx-js .hero h1{animation-delay:.16s}
.plx-js .hero .sub,.plx-js .hero .lede{animation-delay:.30s}
.plx-js .hero .cta-row,.plx-js .hero .btn-row{animation-delay:.44s}
.plx-js .hero .press-top,.plx-js .hero .stat-band{animation-delay:.58s}
@keyframes plxHeroUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion: reduce){
  .plx-js .hero *{animation:none !important}
}

/* Slow drifting aura behind hero (uses ::before we don't own, so add a layer) */
.plx-js .hero{position:relative}
.plx-js .hero .plx-aura{
  position:absolute;inset:-20% -10% auto -10%;height:140%;z-index:0;pointer-events:none;
  background:radial-gradient(50% 50% at 30% 20%,rgba(91,115,232,.25),transparent 60%),
             radial-gradient(40% 40% at 80% 10%,rgba(196,160,82,.16),transparent 60%);
  filter:blur(8px);animation:plxAura 18s ease-in-out infinite alternate;
}
@keyframes plxAura{from{transform:translate3d(-2%,0,0) scale(1)}to{transform:translate3d(3%,2%,0) scale(1.08)}}
@media (prefers-reduced-motion: reduce){.plx-js .hero .plx-aura{animation:none}}
.plx-js .hero>*{position:relative;z-index:1}

/* Gradient sheen on accent words */
.plx-js .hero h1 .em,
.plx-js .hero h1 .accent{
  background:linear-gradient(100deg,var(--plx-gold-soft),#f0dca6 45%,var(--plx-gold) 75%);
  -webkit-background-clip:text;background-clip:text;
  background-size:200% auto;
}
@media (prefers-reduced-motion: no-preference){
  .plx-js .hero h1 .em,.plx-js .hero h1 .accent{
    -webkit-text-fill-color:transparent;color:transparent;
    animation:plxSheen 6s linear infinite;
  }
}
@keyframes plxSheen{to{background-position:200% center}}

/* ============================================================
   6. PREMIUM MICRO-INTERACTIONS — buttons & cards
   ============================================================ */
/* Gold shine sweep on primary CTAs (both systems) */
.btn-primary,.nav-cta,.btn-yellow{position:relative;overflow:hidden}
.btn-primary::after,.nav-cta::after,.btn-yellow::after{
  content:"";position:absolute;top:0;left:-130%;width:60%;height:100%;
  background:linear-gradient(100deg,transparent,rgba(255,255,255,.45),transparent);
  transform:skewX(-18deg);transition:none;pointer-events:none;
}
.btn-primary:hover::after,.nav-cta:hover::after,.btn-yellow:hover::after{
  animation:plxShine .85s var(--plx-ease)}
@keyframes plxShine{from{left:-130%}to{left:130%}}

/* Modale candidatura (form GHL, costruito da plutonis.js su [data-apply-modal]) */
.plx-modal-scrim{position:fixed;inset:0;background:rgba(6,9,20,.72);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);z-index:9998;opacity:0;visibility:hidden;transition:opacity .25s ease,visibility .25s ease}
.plx-modal-scrim.plx-open{opacity:1;visibility:visible}
.plx-modal{position:fixed;z-index:9999;top:50%;left:50%;transform:translate(-50%,-46%);width:min(560px,calc(100vw - 28px));max-height:92vh;background:linear-gradient(160deg,#1a2150,#0a0e22);border:1px solid rgba(196,160,82,.28);border-radius:18px;overflow:hidden;box-shadow:0 30px 80px rgba(0,0,0,.45);opacity:0;visibility:hidden;transition:opacity .25s ease,transform .25s ease,visibility .25s ease;display:flex;flex-direction:column}
.plx-modal.plx-open{opacity:1;visibility:visible;transform:translate(-50%,-50%)}
.plx-modal-head{flex:none;display:flex;align-items:center;justify-content:space-between;padding:14px 16px 12px;border-bottom:1px solid rgba(255,255,255,.10)}
.plx-modal-head strong{font-family:'IBM Plex Sans',sans-serif;font-size:15px;font-weight:600;color:#fff}
.plx-modal-close{border:0;background:rgba(255,255,255,.08);width:34px;height:34px;border-radius:50%;cursor:pointer;font-size:20px;line-height:1;color:#fff;display:grid;place-items:center;transition:background .15s}
.plx-modal-close:hover{background:rgba(255,255,255,.16)}
.plx-modal-body{overflow-y:auto;-webkit-overflow-scrolling:touch}
body.plx-modal-lock{overflow:hidden}
@media (prefers-reduced-motion:reduce){.plx-modal-scrim,.plx-modal{transition:none}}
.btn-primary:active,.nav-cta:active,.btn-yellow:active{transform:translateY(0) scale(.97)}

/* Refined card lift + gold edge for known card components */
.step,.case,.fit-col,.cand-card{
  transition:transform .35s var(--plx-ease),box-shadow .35s var(--plx-ease),border-color .35s var(--plx-ease);
}
.step:hover,.case:hover{transform:translateY(-6px)}
.step{position:relative}
.step::before{
  content:"";position:absolute;inset:0;border-radius:inherit;padding:1px;
  background:linear-gradient(140deg,rgba(196,160,82,.5),transparent 45%);
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;mask-composite:exclude;
  opacity:0;transition:opacity .35s var(--plx-ease);pointer-events:none;
}
.step:hover::before{opacity:1}

/* ============================================================
   7. FORMS — premium focus & validation feedback
   ============================================================ */
.cand-card input,.cand-card select,.cand-card textarea{
  transition:border-color .2s var(--plx-ease),box-shadow .2s var(--plx-ease),background .2s var(--plx-ease);
}
.cand-card input:focus,.cand-card select:focus,.cand-card textarea:focus{
  border-color:var(--plx-gold) !important;
  box-shadow:0 0 0 4px rgba(196,160,82,.18);
  outline:none;
}
.cand-card .plx-invalid{
  border-color:#e06b6b !important;box-shadow:0 0 0 4px rgba(224,107,107,.16);
}
.plx-field-err{
  display:block;color:#e58f8f;font-size:13px;margin-top:6px;min-height:1px;
}
button[type="submit"]{transition:transform .15s var(--plx-ease),opacity .2s var(--plx-ease)}
button[type="submit"][disabled]{opacity:.6;cursor:progress}

/* ============================================================
   8. ANIMATED COUNTERS — tabular figures to avoid layout shift
   ============================================================ */
.plx-count{font-variant-numeric:tabular-nums}

/* ============================================================
   9. BACK TO TOP (injected by JS)
   ============================================================ */
.plx-top{
  position:fixed;right:20px;bottom:20px;z-index:1000;
  width:48px;height:48px;border-radius:50%;border:1px solid rgba(196,160,82,.45);
  background:rgba(13,17,38,.9);color:var(--plx-gold-soft);cursor:pointer;
  display:grid;place-items:center;opacity:0;transform:translateY(14px) scale(.9);
  transition:opacity .3s var(--plx-ease),transform .3s var(--plx-ease),background .2s var(--plx-ease);
  backdrop-filter:blur(8px);pointer-events:none;
}
.plx-top.plx-show{opacity:1;transform:none;pointer-events:auto}
.plx-top:hover{background:var(--plx-gold);color:#0a0e1a}
.plx-top svg{width:20px;height:20px}
@media (max-width:560px){.plx-top{right:14px;bottom:14px}}

/* respect safe areas on notched devices */
@supports(padding:max(0px)){
  .plx-top{bottom:max(20px,env(safe-area-inset-bottom))}
  .plx-drawer{padding-right:max(26px,env(safe-area-inset-right))}
}

/* ============================================================
   10. READABILITY FIX — bolder, higher-contrast body copy
   Both class systems. Soft greys are LIGHT-bg only → safe to darken.
   ============================================================ */
:root{
  --txt-soft:#3e4453 !important;   /* home light-bg soft text */
  --gray-text:#3e4453 !important;  /* engine light-bg soft text */
}
/* Lift thin 300-weight body text to a readable 400 everywhere */
.sec-head p,.lede,.step p,.agit p,.meaning-card p,.case-body p,
.apply p,.apply-cta p,.hero .sub,.cred-list li,.fit-list li,
.foot-brand p,.block-navy p,.stefano-note,.case-meta .v,
.dropdown a small{font-weight:400 !important}
/* Body base: never below 400, smoother rendering */
body{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
/* Brighten subheadlines on dark surfaces for stronger presence */
.hero .sub,.hero .lede,.block-navy .lede,.on-dark .sec-head p,
.apply p,.apply-cta p,.meaning-card p,.case-body p{
  color:#c3c8de !important;
}
/* Section eyebrows: a touch more weight/letterspacing = premium */
.sec-eyebrow,.eyebrow{font-weight:600;letter-spacing:.16em}

/* ============================================================
   11. MEGA MENU (Circle-style) — built by JS, desktop only
   ============================================================ */
.plx-js nav .dropdown{display:none !important} /* replaced by mega */

.plx-mega-wrap{
  position:absolute;left:0;right:0;top:100%;
  display:flex;justify-content:center;pointer-events:none;z-index:60;
}
.plx-mega{
  position:absolute;top:10px;left:50%;
  width:min(960px,calc(100vw - 48px));
  background:#fff;border:1px solid var(--plx-line,#e8e8ec);
  border-radius:18px;box-shadow:0 30px 80px -24px rgba(10,14,26,.45);
  padding:26px;opacity:0;transform:translate(-50%,8px) scale(.99);
  transition:opacity .26s var(--plx-ease),transform .26s var(--plx-ease);
  pointer-events:none;display:grid;
  grid-template-columns:1.6fr .9fr;gap:22px;
}
.plx-mega.plx-mega-open{opacity:1;transform:translate(-50%,0) scale(1);pointer-events:auto}
.plx-mega-cols{display:grid;grid-template-columns:1fr 1fr;gap:6px 18px;align-content:start}
.plx-mega-single .plx-mega-cols{grid-template-columns:1fr}
.plx-mega-item{
  display:flex;gap:14px;align-items:flex-start;
  padding:13px 14px;border-radius:12px;text-decoration:none;
  transition:background .16s var(--plx-ease),transform .16s var(--plx-ease);
}
.plx-mega-item:hover{background:#f5f6f9}
.plx-mega-item:hover .plx-mega-ic{border-color:var(--plx-gold);color:var(--plx-gold);background:#fbf7ee}
.plx-mega-ic{
  flex-shrink:0;width:40px;height:40px;border-radius:10px;
  border:1px solid #e3e4ea;display:grid;place-items:center;
  color:#3b56d4;background:#fff;transition:.16s var(--plx-ease);
}
.plx-mega-ic svg{width:20px;height:20px}
.plx-mega-tx b{display:block;color:#1a1d28;font-size:15.5px;font-weight:600;line-height:1.25}
.plx-mega-tx span{display:block;color:#5a5f6e;font-size:13px;line-height:1.4;margin-top:3px;font-weight:400}
/* Featured panel */
.plx-mega-feat{
  border-radius:14px;padding:24px;color:#fff;position:relative;overflow:hidden;
  /* bagliore oro: ellisse in % della card, sfuma sempre dentro (un ::before piu' stretto
     del gradiente veniva tagliato netto sulle card alte) */
  background:radial-gradient(55% 38% at 84% 14%,rgba(196,160,82,.30),rgba(196,160,82,0) 70%),
             linear-gradient(160deg,#1a2150,#0a0e22);
  display:flex;flex-direction:column;justify-content:flex-end;min-height:200px;
}
.plx-mega-feat .plx-feat-eyebrow{
  position:relative;font-size:11px;letter-spacing:.16em;text-transform:uppercase;
  color:var(--plx-gold-soft);font-weight:600;margin-bottom:10px;
}
.plx-mega-feat h4{position:relative;font-size:19px;font-weight:600;line-height:1.25;margin-bottom:8px;color:#fff}
.plx-mega-feat p{position:relative;font-size:13.5px;color:#c3c8de;margin-bottom:16px;font-weight:400}
.plx-mega-feat .plx-feat-cta{
  position:relative;align-self:flex-start;background:var(--plx-gold);color:#0a0e1a;
  font-weight:600;font-size:13.5px;padding:10px 18px;border-radius:100px;text-decoration:none;
  transition:background .18s var(--plx-ease),transform .18s var(--plx-ease);
}
.plx-mega-feat .plx-feat-cta:hover{background:var(--plx-gold-soft);transform:translateY(-1px)}
/* doppia card (menu Servizi): due card separate, spazio bianco in mezzo, NON dentro un riquadro */
.plx-mega-feat-duo{display:flex;flex-direction:column;gap:16px;background:none;padding:0}
.plx-mega-feat-duo .plx-feat-card{flex:1;min-height:0;justify-content:center}
.plx-mega-feat-duo .plx-feat-cta{align-self:flex-start}
.plx-mega-feat-duo .plx-feat-cta--ghost{background:transparent;color:var(--plx-gold);border:1px solid rgba(196,160,82,.55)}
.plx-mega-feat-duo .plx-feat-cta--ghost:hover{background:rgba(196,160,82,.12);color:var(--plx-gold-soft)}
/* caret rotation when its menu is open */
.plx-js nav .nav-menu>li .caret{transition:transform .22s var(--plx-ease);display:inline-block}
.plx-js nav .nav-menu>li.plx-mega-active .caret{transform:rotate(180deg)}

@media (max-width:980px){
  .plx-mega{grid-template-columns:1fr}
  .plx-mega-feat{min-height:auto}
}
@media (max-width:1024px){
  .plx-mega-wrap{display:none !important} /* drawer handles mobile (allineato a 1024) */
}

/* Language switcher as real cross-language links (migration to /it/ + /en/).
   Styles the <a> that replaced the old dead <button>s; works on both the bespoke
   home (--gold) and engine pages (--yellow) via var fallbacks. */
.lang a{display:inline-flex;align-items:center;justify-content:center;padding:6px 16px;min-height:32px;border-radius:100px;text-decoration:none;color:var(--txt-invert-soft,#a9aec6);font-family:'IBM Plex Sans',sans-serif;font-size:13px;font-weight:500;transition:color .15s ease,background .15s ease}
.lang a.active{background:var(--yellow,var(--gold,#c4a052));color:var(--ink,#0a0e1a);font-weight:600}
.lang a:not(.active):hover{color:#fff}

/* "Lavora con noi" — link presente SOLO nel footer, con badge "stiamo assumendo".
   Definito qui (condiviso) cosi' rende identico su home e pagine engine. */
.foot-hire{display:inline-flex;flex-direction:column;align-items:flex-start;gap:10px;margin-top:20px;color:var(--txt-invert-soft,#a9aec6);text-decoration:none;font-size:14.5px;font-weight:500;line-height:1.2;transition:color .2s ease}
.foot-hire:hover{color:#fff}
.hiring-badge{display:inline-flex;align-items:center;gap:6px;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;font-weight:600;color:#7ee0a8;background:rgba(46,204,113,0.12);border:1px solid rgba(46,204,113,0.35);border-radius:100px;padding:3px 10px 3px 8px;white-space:nowrap}
.hiring-badge::before{content:"";width:6px;height:6px;border-radius:50%;background:#2ecc71;box-shadow:0 0 0 0 rgba(46,204,113,0.55);animation:hiringPulse 2.2s infinite}
@keyframes hiringPulse{0%{box-shadow:0 0 0 0 rgba(46,204,113,0.55)}70%{box-shadow:0 0 0 7px rgba(46,204,113,0)}100%{box-shadow:0 0 0 0 rgba(46,204,113,0)}}
@media (prefers-reduced-motion:reduce){.hiring-badge::before{animation:none}}

/* Scenario box (spiegazione "4 scenari su 5" — analogia assicurativa). Card scura su
   qualsiasi ground; usata su il-sistema e sferae. */
.scenario-box{background:linear-gradient(160deg,#141a3e,#0d1126);border:1px solid rgba(196,160,82,0.28);border-radius:20px;padding:28px 26px;box-shadow:0 20px 60px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.06)}
.scenario-kicker{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:2px;text-transform:uppercase;color:#c4a052;display:block;margin-bottom:14px}
.scenario-list{list-style:none;padding:0;margin:0 0 16px}
.scenario-list li{display:flex;align-items:center;gap:12px;padding:12px 0;border-top:1px solid rgba(255,255,255,0.08);font-size:15.5px;color:#eef0f7}
.scenario-list li:first-child{border-top:none}
.scenario-list li::before{width:22px;height:22px;border-radius:50%;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}
.scenario-list li.ok::before{content:'\2713';background:rgba(43,217,159,0.15);color:#2bd99f}
.scenario-list li.ko::before{content:'!';background:rgba(192,57,43,0.20);color:#ff8a7a}
.scenario-list li.ko{color:#f3d9d4}
.scenario-note{font-size:13.5px;line-height:1.55;color:#a9aec6;margin:0}
.scenario-note a{color:#c4a052;text-decoration:none;border-bottom:1px solid rgba(196,160,82,0.4)}

/* ── TRUSTPILOT WIDGET (riprova sociale, recensioni reali) ── */
.tp-section .tp-row{display:flex;flex-wrap:wrap;justify-content:center;gap:18px;padding:6px 2px 18px}
.tp-section .tp-row.tp-marquee{flex-wrap:nowrap;justify-content:flex-start;gap:0;overflow:hidden;padding:6px 0 18px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent);mask-image:linear-gradient(90deg,transparent,#000 5%,#000 95%,transparent)}
.tp-track{display:flex;width:max-content;animation:tpScroll 70s linear infinite}
.tp-track .tp-card{margin-right:18px}
.tp-section .tp-row.tp-marquee:hover .tp-track{animation-play-state:paused}
@keyframes tpScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.tp-track{animation:none}.tp-section .tp-row.tp-marquee{overflow-x:auto;-webkit-mask-image:none;mask-image:none}}
.tp-card{flex:0 0 300px;max-width:300px;scroll-snap-align:start;background:#fff;border:1px solid #e8e8ec;border-radius:14px;padding:20px;display:flex;flex-direction:column;box-shadow:0 1px 3px rgba(10,30,67,0.05),0 6px 18px rgba(10,30,67,0.06)}
.block-navy .tp-card{background:rgba(255,255,255,0.04);border-color:rgba(255,255,255,0.1)}
.tp-stars{display:inline-flex;gap:3px;margin-bottom:14px}
.tp-stars i{width:22px;height:22px;background:#00b67a;border-radius:3px;display:inline-flex;align-items:center;justify-content:center}
.tp-stars svg{width:15px;height:15px;fill:#fff;display:block}
.tp-card h4{font-size:16px;font-weight:600;color:#0a0e1a;letter-spacing:-.2px;margin:0 0 8px}
.block-navy .tp-card h4{color:#fff}
.tp-card .tp-txt{font-size:14px;line-height:1.55;color:#5a5f6e;margin:0 0 14px;flex:1}
.block-navy .tp-card .tp-txt{color:#a9aec6}
.tp-author{font-size:13px;font-weight:600;color:#0a0e1a}
.block-navy .tp-author{color:#fff}
.tp-author span{font-weight:400;color:#687793}
.tp-foot{text-align:center;margin-top:24px;font-size:15px;color:#5a5f6e}
.block-navy .tp-foot{color:#a9aec6}
.tp-foot a{color:inherit}
.tp-foot .tp-logo{font-weight:700;color:#0a0e1a;text-decoration:none}
.block-navy .tp-foot .tp-logo{color:#fff}
.tp-foot .tp-logo::before{content:'\2605';color:#00b67a;margin-right:4px}

/* FIX leggibilità: .inline-cta è una fascia ORO. Il <p> descrittivo ereditava il
   colore chiaro di .block-navy p (illeggibile su oro). Forza testo scuro dentro l'inline-cta. */
.block-navy .inline-cta p, .block-blue-1 .inline-cta p, .block-white .inline-cta p{color:var(--ink)}
.inline-cta .cta-note{color:var(--navy)}
.inline-cta .cta-note a{color:var(--navy) !important;text-decoration:underline}
/* Pulsante primario dentro l'inline-cta oro: renderlo navy (come su Azienda), altrimenti oro-su-oro si mimetizza. */
.inline-cta .btn-yellow{background:var(--navy);color:#fff;border-color:var(--navy);box-shadow:none}
.inline-cta .btn-yellow:hover{background:var(--navy-2);border-color:var(--navy-2);color:#fff;transform:translateY(-2px)}

/* ── a11y: contrast overrides (footer/bridge) 2026-07-13 ── */
.site-footer .foot-col h4,.foot-col h4{opacity:1!important;color:#c4c9da!important}
.site-footer .disclaimer,.disclaimer{color:#9298b0!important}
.foot-bottom>span,.foot-bottom span[style]{opacity:1!important;color:#9298b0!important}
.bridge em,.bridge-link{color:#6b5320!important}

/* ── case-study result badge: cifra su una riga anche da mobile ── */
.rb-num{white-space:nowrap!important}
.result-badge{flex-wrap:wrap!important}
/* ── leggibilita': sottotitoli/note muti su scuro piu' chiari ── */
.block-navy .sec-head p{color:#b7bccf!important}
.result-note{color:#a6acc2!important}

/* ── footer social icons ── */
.foot-social{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin:18px 0 6px;max-width:280px}
.foot-social-lbl{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;color:#9298b0;width:100%;margin-top:10px}
.foot-social-lbl:first-child{margin-top:0}
.foot-social a{display:inline-flex;width:34px;height:34px;align-items:center;justify-content:center;border:1px solid rgba(255,255,255,0.14);border-radius:9px;color:#b7bccf;transition:color .15s,border-color .15s,background .15s}
.foot-social a:hover{color:#fff;border-color:rgba(196,160,82,0.55);background:rgba(255,255,255,0.04)}
.foot-social a svg{width:17px;height:17px}

/* ── Form custom: honeypot + esito invio ─────────────────────────────────────
   .hp e' il campo trappola per i bot: fuori schermo, mai raggiungibile da tastiera
   (tabindex -1) e ignorato dagli screen reader (aria-hidden sul contenitore). */
.hp{position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden}
.form-msg{margin:14px 0 0;font-size:14px;line-height:1.55}
.form-msg:empty{display:none}
/* A invio riuscito i campi spariscono e resta solo questa riga: le diamo il respiro
   che avevano loro, altrimenti la card collassa in un rettangolino. */
.form-msg--ok{color:#8fe3b0;font-weight:600;font-size:17px;text-align:center;padding:30px 8px;margin:0}
.form-msg--ko{color:#ff9a9a;font-weight:600}

/* ── Candidatura: wizard di prequalifica a 3 passi ───────────────────────────
   Vive in due posti (pagina candidatura e popup su 11 pagine) e su due sistemi
   di classi diversi: la home non ha ne' .btn ne' .cand-*. Percio' qui non si
   eredita niente dalla pagina, gli stili sono tutti e soli questi.
   Le regole .ap-step stanno anche nel CSS critico di /it/candidatura/: questo
   foglio arriva async, e senza di esse i tre passi lampeggerebbero insieme. */
.plx-apply{padding:22px 28px 28px;text-align:left}
.plx-apply .ap-step{display:none;padding:0;margin:0}
.plx-apply .ap-step.is-active{display:block}
.plx-apply .ap-step-titolo{font-family:'IBM Plex Mono',monospace;font-size:12px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:var(--plx-gold);margin:0 0 22px}
.plx-apply .ap-campo{border:0;padding:0;margin:0 0 24px;min-width:0}
.plx-apply .ap-campo>label,.plx-apply .ap-campo legend{display:block;font-size:16px;font-weight:600;color:#fff;margin:0 0 8px;padding:0;line-height:1.45}
.plx-apply .ap-aiuto{font-size:13px;line-height:1.5;color:#c3c8de;margin:0 0 12px}

/* campi di testo: stesso look dei form del sito, ma senza dipendere da .cand-form */
.plx-apply input[type=text],.plx-apply input[type=email],.plx-apply input[type=tel],.plx-apply textarea{
  width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.30);border-radius:6px;
  color:#fff;font-family:'IBM Plex Sans',sans-serif;font-size:16px;padding:14px 15px;outline:none;
  appearance:none;min-height:50px;transition:border-color .15s ease,background .15s ease}
.plx-apply textarea{resize:vertical;line-height:1.5}
.plx-apply input::placeholder,.plx-apply textarea::placeholder{color:rgba(255,255,255,.5)}
.plx-apply input:focus,.plx-apply textarea:focus{border-color:var(--plx-gold);background:rgba(255,255,255,.1)}

/* risposte a scelta singola */
.plx-apply .ap-opts{display:flex;flex-direction:column;gap:8px}
.plx-apply .ap-opt{display:flex;align-items:flex-start;gap:11px;padding:13px 15px;border:1px solid rgba(255,255,255,.14);border-radius:12px;cursor:pointer;font-size:15px;line-height:1.45;color:#e8ebf5;transition:border-color .18s ease,background .18s ease}
.plx-apply .ap-opt:hover{border-color:rgba(196,160,82,.5);background:rgba(196,160,82,.06)}
.plx-apply .ap-opt input{width:18px;height:18px;min-width:18px;margin:2px 0 0;flex:none;accent-color:var(--plx-gold);cursor:pointer}
.plx-apply .ap-opt:has(input:checked){border-color:var(--plx-gold);background:rgba(196,160,82,.12)}

/* consenso privacy */
.plx-apply .ap-consenso{display:flex;align-items:flex-start;gap:10px;margin:2px 0 6px}
.plx-apply .ap-consenso[hidden]{display:none}
.plx-apply .ap-consenso input{width:18px;height:18px;min-width:18px;margin-top:2px;accent-color:var(--plx-gold);cursor:pointer}
.plx-apply .ap-consenso span{font-size:12.5px;line-height:1.45;color:rgba(255,255,255,.72)}
.plx-apply .ap-consenso a{color:var(--plx-gold);text-decoration:underline}

/* errori */
.plx-apply .ap-err{margin:8px 0 0;font-size:13px;color:#ff9a9a;font-weight:600}
.plx-apply .ap-err:empty{display:none}
.plx-apply .ap-campo.is-error>label,.plx-apply .ap-campo.is-error legend{color:#ff9a9a}
.plx-apply .ap-campo.is-error input,.plx-apply .ap-campo.is-error textarea{border-color:#ff9a9a}

/* avanzamento */
.plx-apply .ap-progress{display:flex;align-items:center;gap:14px;margin:0 0 26px}
.plx-apply .ap-progress-bar{flex:1;height:4px;border-radius:100px;background:rgba(255,255,255,.12);overflow:hidden}
.plx-apply .ap-progress-bar i{display:block;height:100%;border-radius:100px;background:var(--plx-gold);transition:width .3s var(--plx-ease)}
.plx-apply .ap-progress-txt{flex:none;font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#c3c8de}

/* navigazione */
.plx-apply .ap-nav{display:flex;gap:12px;margin-top:26px}
.plx-apply .ap-btn{flex:1;font-family:'IBM Plex Sans',sans-serif;font-size:15px;font-weight:600;padding:15px 22px;border-radius:100px;border:1px solid transparent;cursor:pointer;transition:background .2s var(--plx-ease),border-color .2s var(--plx-ease),opacity .2s}
.plx-apply .ap-btn[hidden]{display:none}
.plx-apply .ap-btn-primary{background:var(--plx-gold);color:#0a0e1a}
.plx-apply .ap-btn-primary:hover{background:var(--plx-gold-soft)}
.plx-apply .ap-btn-primary:disabled{opacity:.6;cursor:default}
.plx-apply .ap-btn-ghost{background:transparent;color:#e8ebf5;border-color:rgba(255,255,255,.24)}
.plx-apply .ap-btn-ghost:hover{border-color:rgba(255,255,255,.5)}
.plx-apply .ap-helper{margin:16px 0 0;font-size:12px;line-height:1.5;color:#c3c8de;text-align:center}
@media (max-width:600px){.plx-apply{padding:20px}}
@media (prefers-reduced-motion:reduce){.plx-apply .ap-progress-bar i{transition:none}}