/* Componenti · Design v4 B · namespace mfcomp- */
.mfcomp{
  --mfcomp-ink:#1E1E1E;--mfcomp-neb:#F7F7FA;--mfcomp-line:#DDDDE5;--mfcomp-lead:#4B4B57;--mfcomp-on-dark:#C8C8D0;
  --mfcomp-panel:#1E1E1E;--mfcomp-out:#141414;--mfcomp-field:#0A0A0A;--mfcomp-border:#464646;
  --mfcomp-grad:linear-gradient(90deg,#4F46E5,#9333EA 55%,#E11D48);
  --mfcomp-lock:#B6DFC1;
  color:#1E1E1E;
}
.mfcomp .sec{scroll-margin-top:84px}
.mfcomp .page-cta{box-shadow:none;background:#F7F7FA;border-color:#DDDDE5}
.mfcomp-gr{
  background:var(--mfcomp-grad);-webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;color:transparent;
}

.mfcomp-pill{
  display:inline-flex;align-items:center;justify-content:center;
  border:1.5px solid transparent;border-radius:999px;padding:6px 14px;
  font-size:12px;line-height:1.2;font-weight:600;letter-spacing:.01em;
  color:#1E1E1E;
  background:linear-gradient(#fff,#fff) padding-box,var(--mfcomp-grad) border-box;
}
.mfcomp-sec--neb .mfcomp-pill{
  background:linear-gradient(#F7F7FA,#F7F7FA) padding-box,var(--mfcomp-grad) border-box;
}
.mfcomp-sec--dark .mfcomp-pill{
  color:#fff;
  background:linear-gradient(#1E1E1E,#1E1E1E) padding-box,var(--mfcomp-grad) border-box;
}

.mfcomp-sec h2{
  margin:16px 0 14px;font-size:3rem;line-height:1.12;font-weight:600;letter-spacing:-.025em;
  text-wrap:balance;
}
.mfcomp-sec .lead,
.mfcomp-copy .lead{
  margin:0;max-width:38rem;font-size:1.375rem;line-height:32px;color:#4B4B57;
}
.mfcomp-sec--white{background:#fff;color:#1E1E1E}
.mfcomp-sec--dark{background:#1E1E1E;color:#fff}
.mfcomp-sec--dark h2{color:#fff}
.mfcomp-sec--dark .lead{color:#C8C8D0}
.mfcomp-sec--neb{background:#F7F7FA;color:#1E1E1E}
.mfcomp-split{
  display:grid;grid-template-columns:minmax(0,1fr);gap:32px;align-items:center;
}
.mfcomp-shot{
  margin:0;border-radius:16px;overflow:hidden;box-shadow:none;
  border:1px solid #DEDEE7;background:#fff;
}
.mfcomp-sec--dark .mfcomp-shot{border-color:#464646;background:#141414}
.mfcomp-shot img{display:block;width:100%;height:auto}
.mfcomp-visual{min-width:0}

@media (min-width:64rem){
  .mfcomp-split{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:48px}
  .mfcomp-split--rev .mfcomp-visual{order:-1}
}


.mfcomp{font-family:"Plus Jakarta Sans",sans-serif}
.mfcomp-hero{position:relative;background:#0A0A0A;color:#fff;padding:64px 0;isolation:isolate;--btn-outline-default-bg:#0A0A0A;--btn-outline-default-fg:#fff;--btn-outline-default-border:#8f8299;--btn-outline-hover-bg:#0A0A0A;--btn-outline-hover-border:#fff;--btn-outline-active-bg:#0A0A0A}
.mfcomp-hero__grid{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:30px;align-items:center;min-height:660px}
.mfcomp-hero__copy{position:relative;z-index:1;min-width:0}
.mfcomp-hero .mfcomp-pill{color:#fff;background:linear-gradient(#0A0A0A,#0A0A0A) padding-box,var(--mfcomp-grad) border-box}
.mfcomp-hero h1{font-size:clamp(50px,5.3vw,76px);line-height:1.07;font-weight:600;letter-spacing:-.055em;color:#fff;margin:22px 0;max-width:12ch}
.mfcomp-hero__gradient{background:linear-gradient(100deg,#b48bff,#f095d4);background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
.mfcomp-hero .lead{font-size:19px;line-height:1.65;color:#c8becf;max-width:26rem;margin:0}
.mfcomp-hero .actions{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:12px;margin-top:28px}
.mfcomp-hero .btn{box-shadow:none;min-height:48px;white-space:normal;text-align:center}
.mfcomp-caption{color:#a99bb5;font-size:12px;line-height:1.6;margin:24px 0 0}
.mfcomp-hero__stage{min-width:0;position:relative}
.mfcomp-hero__art{margin:0;pointer-events:none;user-select:none}
.mfcomp-puzzle{display:block;width:100%;height:auto;overflow:visible;font-family:"Plus Jakarta Sans",sans-serif}
.mfcomp-motion{display:block;margin:8px auto 0;padding:8px 14px;min-height:44px;border:1px solid #55425f;border-radius:30px;background:transparent;color:#c1b0ce;font:500 11px/1.4 "Plus Jakarta Sans",sans-serif;cursor:pointer}
.mfcomp-motion[hidden]{display:none}
.mfcomp-motion:focus-visible{outline:2px solid #c99cff;outline-offset:4px}
.mfcomp-copy,.mfcomp-visual,.mfcomp-parx,.mfcomp-hero__follow{min-width:0}
.mfcomp-shot img{aspect-ratio:4/3;object-fit:contain}
.mfcomp .acc summary{overflow-wrap:anywhere;min-height:48px}
.mfcomp .acc summary>.ico{flex-shrink:0}
@media(max-width:63.9375rem){
 .mfcomp-hero{padding:52px 0 38px}
 .mfcomp-hero__grid{grid-template-columns:minmax(0,1fr);gap:24px;min-height:0}
 .mfcomp-hero__copy{text-align:center;max-width:650px;margin-inline:auto}
 .mfcomp-hero h1{font-size:60px;max-width:15ch;margin-inline:auto}
 .mfcomp-hero h1 br:last-child{display:none}
 .mfcomp-hero .lead{margin-inline:auto;max-width:30rem}
 .mfcomp-hero .actions{justify-content:center}
 .mfcomp-hero__stage{width:min(100%,640px);margin-inline:auto}
 .mfcomp-sec h2{font-size:40px}
 .mfcomp-split--rev .mfcomp-visual{order:0}
}
@media(max-width:47.9375rem){
 .mfcomp-hero{padding:38px 0 30px}
 .mfcomp-hero__grid{gap:16px}
 .mfcomp-hero h1{font-size:clamp(34px,9.7vw,42px);line-height:1.1;letter-spacing:-.05em;margin:18px auto}
 .mfcomp-hero .lead,.mfcomp-sec .lead,.mfcomp-copy .lead{font-size:17px;line-height:1.65}
 .mfcomp-hero .actions{display:grid;grid-template-columns:1fr;gap:10px;width:100%;max-width:22rem;margin:22px auto 0}
 .mfcomp-hero .btn{width:100%;min-height:48px;padding-inline:16px}
 .mfcomp-caption{margin:18px auto 0;font-size:11px}
 .mfcomp-sec h2{font-size:clamp(28px,8vw,34px);line-height:1.15;overflow-wrap:normal}
 .mfcomp-split{gap:24px}
 .mfcomp-shot{border-radius:10px}
 .mfcomp-hero__art{margin-inline:-8px}
 .mfcomp .page-cta .actions{display:grid;grid-template-columns:1fr}
 .mfcomp .page-cta .btn{min-height:48px;width:100%;white-space:normal;text-align:center}
 .mfcomp .acc summary{font-size:16px;line-height:1.5;gap:12px}
 .mfcomp .acc__body p{font-size:16px;line-height:1.65}
}
@media(max-height:500px) and (orientation:landscape){
 .mfcomp-hero{padding:30px 0}
 .mfcomp-hero__grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
 .mfcomp-hero__copy{text-align:left}
 .mfcomp-hero h1{font-size:clamp(29px,4.4vw,43px);margin:15px 0}
 .mfcomp-hero .lead{font-size:15px}
 .mfcomp-hero .actions{display:grid;grid-template-columns:1fr;margin-top:18px;max-width:270px;gap:8px}
 .mfcomp-hero .actions .btn{font-size:12px;min-height:44px}
 .mfcomp-caption{font-size:10px}
}