:root{
    --color-parchment:#e5e4e0;
    --color-ink:#1d1d1d;
    --color-paper:#ffffff;
    --color-ash:#bfbebe;
    --color-stone:#cdcdc9;
    --color-sphere: linear-gradient(255deg, rgb(250,203,14), rgb(240,107,168) 30%, rgb(120,186,230) 65%, rgb(255,255,255));

    --font: 'Space Grotesk', 'Neue Haas Grotesk Display', Inter, sans-serif;

    --text-caption: 11px;
    --text-body-sm: 15px;
    --text-body: 18px;
    --text-subheading: 34px;
    --text-heading-sm: 46px;
    --text-heading: 70px;
    --text-heading-lg: 76px;
    --text-display: 103px;

    --sp-5:5px; --sp-6:6px; --sp-8:8px; --sp-15:15px; --sp-19:19px;
    --sp-30:30px; --sp-32:32px; --sp-46:46px; --sp-76:76px; --sp-119:119px;

    --radius-link:10px;
  }

  *{box-sizing:border-box; margin:0; padding:0;}

  html{scroll-behavior:smooth;}

  section[id]{ scroll-margin-top:80px; }

  body{
    background:var(--color-parchment);
    color:var(--color-ink);
    font-family:var(--font);
    font-weight:400;
    line-height:1.4;
    -webkit-font-smoothing:antialiased;
  }

  a{color:inherit; text-decoration:none;}

  .wrap{
    max-width:1400px;
    margin:0 auto;
    padding:0 var(--sp-46);
    position:relative;
  }

  @media (max-width:700px){
    .wrap{padding:0 var(--sp-19);}
  }

  /* ---------- NAV ---------- */
  nav.wrap{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding-top:var(--sp-19);
    padding-bottom:var(--sp-19);
    position:sticky;
    top:0;
    z-index:50;
    background:var(--color-parchment);
    border-bottom:1px solid var(--color-ash);
    max-width:none;
  }
  nav.wrap > *{
    max-width:1400px;
  }
  .nav-inner{
    max-width:1400px;
    margin:0 auto;
    width:100%;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 var(--sp-46);
  }
  @media (max-width:700px){
    .nav-inner{padding:0 var(--sp-19);}
  }
  .logo{
    font-size:var(--text-body-sm);
    font-weight:700;
    letter-spacing:0.05em;
    text-transform:uppercase;
  }
  .nav-links{
    display:flex;
    gap:var(--sp-32);
  }
  .nav-links a{
    font-size:var(--text-body-sm);
    border-radius:var(--radius-link);
    padding:var(--sp-5) 0;
    position:relative;
  }
  .nav-links a:hover{ text-decoration:underline; text-underline-offset:4px; }
  .nav-cta{
    font-size:var(--text-body-sm);
    display:flex;
    align-items:center;
    gap:6px;
  }
  .nav-cta:hover .arrow{ transform:translateX(3px); }
  .arrow{ display:inline-block; transition:transform .2s ease; }

  @media (max-width:700px){
    .nav-links{display:none;}
  }

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding-top:var(--sp-46);
    padding-bottom:var(--sp-119);
    overflow:hidden;
  }

  .sphere{
    position:absolute;
    top:-8%;
    right:2%;
    width:52vh;
    height:52vh;
    max-width:620px;
    max-height:620px;
    border-radius:50%;
    background:var(--color-sphere);
    z-index:0;
    filter:blur(0.3px);
  }

  .ring{
    position:absolute;
    border:1px solid var(--color-ash);
    border-radius:50%;
    z-index:0;
  }

  .hero-label{
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
    margin-bottom:var(--sp-19);
    position:relative;
    z-index:2;
    display:flex;
    align-items:center;
    gap:var(--sp-15);
    flex-wrap:wrap;
  }

  .ai-badge{
    border:1px solid var(--color-ink);
    border-radius:20px;
    padding:4px 12px;
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
    display:inline-block;
  }

  .hero h1{
    font-size:var(--text-display);
    font-weight:400;
    line-height:0.80;
    letter-spacing:0.013em;
    text-transform:uppercase;
    max-width:1100px;
    position:relative;
    z-index:2;
  }

  .hero-sub{
    margin-top:var(--sp-32);
    font-size:var(--text-body);
    line-height:1.4;
    max-width:520px;
    position:relative;
    z-index:2;
  }

  .hero-actions{
    margin-top:var(--sp-46);
    display:flex;
    align-items:center;
    gap:var(--sp-32);
    position:relative;
    z-index:2;
  }

  .ghost-link{
    font-size:var(--text-body-sm);
    padding:var(--sp-5) 0;
    border-bottom:1px solid var(--color-ink);
    display:inline-flex;
    align-items:center;
    gap:8px;
  }
  .ghost-link:hover .arrow{ transform:translateX(3px); }

  .plain-link{
    font-size:var(--text-body-sm);
    color:var(--color-ink);
    opacity:0.7;
  }
  .plain-link:hover{ opacity:1; text-decoration:underline; text-underline-offset:4px; }

  .scroll-indicator{
    position:absolute;
    right:var(--sp-30);
    bottom:var(--sp-30);
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:6px;
    z-index:2;
  }

  @media (max-width:900px){
    .hero h1{ font-size:56px; }
    .sphere{ width:70vw; height:70vw; right:-10%; top:-4%; opacity:0.85; }
    .scroll-indicator{ display:none; }
  }

  /* ---------- SECTION LABEL ---------- */
  .section-label{
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
    margin-bottom:var(--sp-19);
  }

  /* ---------- INTRO / FOUNDER-STYLE BLOCK ---------- */
  .intro{
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
    display:grid;
    grid-template-columns:1fr 1.4fr;
    gap:var(--sp-76);
  }
  .intro-left p{
    font-size:var(--text-body-sm);
    text-transform:uppercase;
    max-width:260px;
    margin-bottom:var(--sp-32);
  }
  .intro-right p{
    font-size:var(--text-body);
    line-height:1.4;
    max-width:640px;
  }
  .intro-right p + p{ margin-top:var(--sp-19); }

  @media (max-width:800px){
    .intro{ grid-template-columns:1fr; gap:var(--sp-32); }
  }

  /* ---------- FEATURES GRID ---------- */
  .features{
    padding-bottom:var(--sp-119);
  }
  .features-grid{
    margin-top:var(--sp-46);
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:1px;
    background:var(--color-ash);
    border:1px solid var(--color-ash);
  }
  .feature-card{
    background:var(--color-paper);
    background-image:
      linear-gradient(var(--color-parchment) 1px, transparent 1px),
      linear-gradient(90deg, var(--color-parchment) 1px, transparent 1px);
    background-size:24px 24px;
    padding:var(--sp-46) var(--sp-30) var(--sp-30);
    min-height:260px;
    display:flex;
    flex-direction:column;
    justify-content:flex-end;
  }
  .feature-num{
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    margin-bottom:auto;
  }
  .feature-card h3{
    font-size:var(--text-heading-sm);
    font-weight:400;
    line-height:1;
    letter-spacing:0.006em;
    margin-bottom:var(--sp-15);
    text-transform:uppercase;
  }
  .feature-card p{
    font-size:var(--text-body-sm);
    max-width:380px;
    line-height:1.4;
  }

  @media (max-width:800px){
    .features-grid{ grid-template-columns:1fr; }
    .feature-card h3{ font-size:32px; }
  }

  /* ---------- HOW IT WORKS ---------- */
  .steps{
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
    padding-top:var(--sp-119);
  }
  .steps-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    margin-bottom:var(--sp-76);
    gap:var(--sp-32);
  }
  .steps-head h2{
    font-size:var(--text-heading);
    font-weight:400;
    line-height:0.8;
    letter-spacing:0.009em;
    text-transform:uppercase;
    max-width:640px;
  }
  .steps-list{
    display:grid;
    grid-template-columns:repeat(4,1fr);
    gap:var(--sp-32);
  }
  .step{
    border-top:1px solid var(--color-ink);
    padding-top:var(--sp-19);
  }
  .step .n{
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    display:block;
    margin-bottom:var(--sp-19);
  }
  .step h4{
    font-size:var(--text-body);
    font-weight:400;
    margin-bottom:var(--sp-8);
    text-transform:uppercase;
    letter-spacing:0.006em;
  }
  .step p{
    font-size:var(--text-body-sm);
    line-height:1.4;
  }

  /* --- mockup visivo animato per ogni step --- */
  .step-visual{
    background:var(--color-paper);
    background-image:
      linear-gradient(var(--color-parchment) 1px, transparent 1px),
      linear-gradient(90deg, var(--color-parchment) 1px, transparent 1px);
    background-size:16px 16px;
    border:1px solid var(--color-ash);
    aspect-ratio:4/3;
    margin-bottom:var(--sp-19);
    position:relative;
    overflow:hidden;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .step-visual svg{ width:100%; height:100%; display:block; }
  .step-visual .bar-fill{
    transform-origin:left center;
    animation:fillbar 2.6s ease-in-out infinite;
  }
  .step-visual .row-in{
    animation:rowslide 2.4s ease-out infinite;
  }
  .step-visual .pulse-dot{
    animation:dotpulse 1.8s ease-in-out infinite;
  }
  .step-visual .check-draw{
    stroke-dasharray:24;
    stroke-dashoffset:24;
    animation:drawcheck 2.2s ease-in-out infinite;
  }
  .step-visual .beam{
    animation:beammove 2.6s linear infinite;
  }

  @keyframes fillbar{
    0%{ transform:scaleX(0); }
    45%{ transform:scaleX(1); }
    100%{ transform:scaleX(1); }
  }
  @keyframes rowslide{
    0%{ opacity:0; transform:translateX(-6px); }
    25%{ opacity:1; transform:translateX(0); }
    85%{ opacity:1; }
    100%{ opacity:0; }
  }
  @keyframes dotpulse{
    0%,100%{ opacity:0.35; r:3; }
    50%{ opacity:1; r:5; }
  }
  @keyframes drawcheck{
    0%{ stroke-dashoffset:24; }
    40%{ stroke-dashoffset:0; }
    100%{ stroke-dashoffset:0; }
  }
  @keyframes beammove{
    0%{ transform:translateX(-40px); opacity:0; }
    15%{ opacity:1; }
    50%{ transform:translateX(40px); opacity:1; }
    65%{ opacity:0; }
    100%{ opacity:0; transform:translateX(40px); }
  }

  @media (prefers-reduced-motion: reduce){
    .step-visual *{ animation:none !important; }
  }

  @media (max-width:900px){
    .steps-head{ flex-direction:column; align-items:flex-start; }
    .steps-head h2{ font-size:42px; }
    .steps-list{ grid-template-columns:1fr 1fr; }
  }
  @media (max-width:520px){
    .steps-list{ grid-template-columns:1fr; }
  }

  /* ---------- CTA ---------- */
  .cta{
    border-top:1px solid var(--color-ash);
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    position:relative;
    overflow:hidden;
  }
  .cta .sphere{
    width:38vh; height:38vh; max-width:420px; max-height:420px;
    left:-6%; right:auto; top:10%;
    opacity:0.9;
  }
  .cta-inner{
    position:relative;
    z-index:2;
    text-align:right;
  }
  .cta h2{
    font-size:var(--text-heading-lg);
    font-weight:400;
    line-height:0.8;
    letter-spacing:0.0099em;
    text-transform:uppercase;
    margin-bottom:var(--sp-32);
  }
  @media (max-width:900px){
    .cta{ text-align:left; }
    .cta-inner{ text-align:left; }
    .cta h2{ font-size:48px; }
    .cta .sphere{ display:none; }
  }

  /* ---------- DEVICE ---------- */
  .devices{
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
  }
  .devices-head{
    display:flex;
    justify-content:space-between;
    align-items:flex-end;
    margin-bottom:var(--sp-46);
    gap:var(--sp-32);
  }
  .devices-head h2{
    font-size:var(--text-heading);
    font-weight:400;
    line-height:0.8;
    letter-spacing:0.009em;
    text-transform:uppercase;
    max-width:640px;
  }
  .devices-sub{
    font-size:var(--text-body-sm);
    max-width:340px;
    opacity:0.75;
  }
  .devices-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1px;
    background:var(--color-ash);
    border:1px solid var(--color-ash);
  }
  .device-card{
    background:var(--color-paper);
    display:flex;
    flex-direction:column;
  }
  .device-media{
    background:var(--color-parchment);
    display:flex;
    align-items:center;
    justify-content:center;
    padding:var(--sp-32);
    min-height:260px;
  }
  .device-media img{
    max-width:100%;
    max-height:220px;
    object-fit:contain;
    mix-blend-mode:multiply;
  }
  .device-body{
    padding:var(--sp-32) var(--sp-30) var(--sp-46);
    border-top:1px solid var(--color-ash);
  }
  .device-eyebrow{
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
    opacity:0.6;
    margin-bottom:var(--sp-8);
  }
  .device-body h3{
    font-size:var(--text-heading-sm);
    font-weight:400;
    line-height:1;
    text-transform:uppercase;
    margin-bottom:var(--sp-15);
  }
  .device-body p.device-desc{
    font-size:var(--text-body-sm);
    line-height:1.4;
    margin-bottom:var(--sp-19);
    max-width:420px;
  }
  .device-specs{
    list-style:none;
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:var(--sp-8) var(--sp-19);
    border-top:1px solid var(--color-ash);
    padding-top:var(--sp-19);
  }
  .device-specs li{
    font-size:13px;
    line-height:1.4;
  }
  .device-specs li b{
    display:block;
    font-size:10px;
    letter-spacing:0.05em;
    text-transform:uppercase;
    opacity:0.55;
    font-weight:400;
    margin-bottom:2px;
  }
  .device-footer{
    margin-top:var(--sp-30);
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:var(--sp-19);
  }
  .device-price{
    font-size:var(--text-body);
  }

  @media (max-width:1000px){
    .devices-grid{ grid-template-columns:1fr 1fr; }
  }
  @media (max-width:800px){
    .devices-head{ flex-direction:column; align-items:flex-start; }
    .devices-head h2{ font-size:42px; }
    .devices-grid{ grid-template-columns:1fr; }
  }

  /* ---------- GALLERIA ---------- */
  .gallery{
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
  }
  .gallery-head{
    margin-bottom:var(--sp-46);
  }
  .gallery-head h2{
    font-size:var(--text-heading);
    font-weight:400;
    line-height:0.8;
    letter-spacing:0.009em;
    text-transform:uppercase;
    max-width:700px;
    margin-bottom:var(--sp-19);
  }
  .gallery-head p{
    font-size:var(--text-body-sm);
    max-width:520px;
    opacity:0.75;
  }
  .gallery-note{
    font-size:12px;
    opacity:0.55;
    margin-top:var(--sp-15);
    max-width:520px;
    line-height:1.4;
  }
  .gallery-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:var(--sp-30);
    max-width:640px;
  }

  .browser-frame{
    grid-column:1 / -1;
    background:var(--color-paper);
    border:1px solid var(--color-ash);
    border-radius:14px;
    padding:0;
    overflow:hidden;
    margin-bottom:var(--sp-32);
  }
  .browser-frame-bar{
    display:flex;
    align-items:center;
    gap:6px;
    padding:10px 14px;
    border-bottom:1px solid var(--color-ash);
  }
  .browser-frame-bar span{
    width:8px; height:8px; border-radius:50%;
    background:var(--color-ash);
    display:inline-block;
  }
  .browser-frame video{
    display:block;
    width:100%;
    height:auto;
    background:#0f2b2c;
  }
  .browser-frame-caption{
    padding:var(--sp-15) var(--sp-19);
    display:flex;
    justify-content:space-between;
    align-items:center;
    flex-wrap:wrap;
    gap:8px;
  }
  .browser-frame-caption h3{
    font-size:var(--text-body);
    font-weight:400;
    text-transform:uppercase;
  }
  .browser-frame-caption .tag-real{
    font-size:11px;
    letter-spacing:0.05em;
    text-transform:uppercase;
    border:1px solid var(--color-ink);
    border-radius:20px;
    padding:3px 10px;
  }
  .phone-mock{
    background:var(--color-paper);
    border:1px solid var(--color-ash);
    border-radius:18px;
    padding:var(--sp-15);
  }
  .phone-screen{
    background:var(--color-parchment);
    border:1px solid var(--color-ash);
    border-radius:10px;
    aspect-ratio:9/16;
    position:relative;
    overflow:hidden;
  }
  .phone-frame-label{
    margin-top:var(--sp-15);
    font-size:var(--text-body-sm);
    text-transform:uppercase;
    letter-spacing:0.02em;
  }
  .phone-frame-caption{
    font-size:13px;
    opacity:0.65;
    margin-top:4px;
  }
  .screen-layer{
    position:absolute;
    inset:0;
    padding:16px;
    opacity:0;
    animation:cyclefade 6s infinite;
  }
  .screen-layer.l2{ animation-delay:2s; }
  .screen-layer.l3{ animation-delay:4s; }
  @keyframes cyclefade{
    0%{ opacity:0; }
    5%{ opacity:1; }
    28%{ opacity:1; }
    35%{ opacity:0; }
    100%{ opacity:0; }
  }
  .sl-topbar{
    height:8px;
    width:60%;
    background:var(--color-ink);
    opacity:0.85;
    margin-bottom:14px;
  }
  .sl-row{
    height:10px;
    background:var(--color-ink);
    opacity:0.15;
    margin-bottom:8px;
    border-radius:2px;
  }
  .sl-row.active{ opacity:0.85; }
  .sl-card{
    border:1px solid var(--color-ink);
    border-radius:6px;
    padding:10px;
    margin-bottom:10px;
  }
  .sl-badge{
    display:inline-block;
    font-size:9px;
    letter-spacing:0.05em;
    text-transform:uppercase;
    border:1px solid var(--color-ink);
    border-radius:10px;
    padding:2px 8px;
    margin-top:8px;
  }

  @media (max-width:900px){
    .gallery-grid{ gap:var(--sp-19); }
  }
  @media (max-width:600px){
    .gallery-grid{ grid-template-columns:1fr; max-width:280px; margin:0 auto; }
  }

  @media (prefers-reduced-motion: reduce){
    .screen-layer{ animation:none !important; opacity:1 !important; }
    .screen-layer.l2, .screen-layer.l3{ display:none; }
  }


  /* ---------- TRUST BAR ---------- */
  .trust-bar{
    border-top:1px solid var(--color-ash);
    border-bottom:1px solid var(--color-ash);
    padding:var(--sp-19) 0;
  }
  .trust-bar-inner{
    display:flex;
    flex-wrap:wrap;
    gap:var(--sp-19) var(--sp-46);
    justify-content:space-between;
    align-items:center;
  }
  .trust-item{
    display:flex;
    align-items:center;
    gap:8px;
    font-size:13px;
    letter-spacing:0.02em;
    text-transform:uppercase;
    opacity:0.8;
    white-space:nowrap;
  }
  .trust-item .dot{
    width:6px; height:6px; border-radius:50%;
    background:var(--color-ink);
    display:inline-block;
    flex-shrink:0;
  }

  /* ---------- CONFRONTO PRIMA/DOPO ---------- */
  .compare{
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
  }
  .compare-head h2{
    font-size:var(--text-heading);
    font-weight:400;
    line-height:0.8;
    letter-spacing:0.009em;
    text-transform:uppercase;
    max-width:700px;
    margin-bottom:var(--sp-46);
  }
  .compare-grid{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:1px;
    background:var(--color-ash);
    border:1px solid var(--color-ash);
  }
  .compare-col{
    background:var(--color-paper);
    padding:var(--sp-32) var(--sp-30);
  }
  .compare-col.after{
    background:var(--color-ink);
    color:var(--color-parchment);
  }
  .compare-col-label{
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
    opacity:0.6;
    margin-bottom:var(--sp-19);
  }
  .compare-list{
    list-style:none;
    display:flex;
    flex-direction:column;
    gap:var(--sp-15);
  }
  .compare-list li{
    font-size:var(--text-body-sm);
    line-height:1.4;
    padding-left:22px;
    position:relative;
  }
  .compare-list li::before{
    content:"×";
    position:absolute;
    left:0;
    opacity:0.5;
  }
  .compare-col.after .compare-list li::before{
    content:"✓";
    opacity:0.9;
  }

  @media (max-width:800px){
    .compare-grid{ grid-template-columns:1fr; }
    .compare-head h2{ font-size:42px; }
  }

  /* ---------- TESTIMONIANZA ---------- */
  .testimonial{
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
  }
  .testimonial-inner{
    max-width:760px;
  }
  .testimonial-quote{
    font-size:var(--text-subheading);
    font-weight:400;
    line-height:1.25;
    letter-spacing:0.003em;
  }
  .testimonial-attrib{
    margin-top:var(--sp-30);
    display:flex;
    align-items:center;
    gap:var(--sp-15);
  }
  .testimonial-avatar{
    width:44px; height:44px;
    border-radius:50%;
    border:1px solid var(--color-ink);
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:var(--text-caption);
    flex-shrink:0;
  }
  .testimonial-name{
    font-size:var(--text-body-sm);
    text-transform:uppercase;
    letter-spacing:0.02em;
  }
  .testimonial-role{
    font-size:13px;
    opacity:0.6;
  }
  .testimonial-placeholder-tag{
    display:inline-block;
    margin-top:var(--sp-19);
    font-size:11px;
    letter-spacing:0.05em;
    text-transform:uppercase;
    border:1px dashed var(--color-ash);
    border-radius:20px;
    padding:4px 12px;
    opacity:0.6;
  }

  @media (max-width:700px){
    .testimonial-quote{ font-size:24px; }
  }

  /* ---------- FAQ ---------- */
  .faq{
    padding-top:var(--sp-119);
    padding-bottom:var(--sp-119);
    border-top:1px solid var(--color-ash);
  }
  .faq-head h2{
    font-size:var(--text-heading);
    font-weight:400;
    line-height:0.8;
    letter-spacing:0.009em;
    text-transform:uppercase;
    max-width:700px;
    margin-bottom:var(--sp-46);
  }
  .faq-list{
    max-width:820px;
  }
  .faq-item{
    border-top:1px solid var(--color-ash);
    padding:var(--sp-19) 0;
  }
  .faq-item:last-child{
    border-bottom:1px solid var(--color-ash);
  }
  .faq-item summary{
    cursor:pointer;
    list-style:none;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:var(--text-body);
    gap:var(--sp-19);
  }
  .faq-item summary::-webkit-details-marker{ display:none; }
  .faq-item summary .faq-icon{
    font-size:20px;
    flex-shrink:0;
    transition:transform .2s ease;
  }
  .faq-item[open] summary .faq-icon{ transform:rotate(45deg); }
  .faq-item p{
    font-size:var(--text-body-sm);
    line-height:1.5;
    margin-top:var(--sp-15);
    max-width:640px;
    opacity:0.8;
  }

  @media (max-width:700px){
    .faq-head h2{ font-size:42px; }
    .faq-item summary{ font-size:16px; }
  }

  /* ---------- FOOTER ---------- */
  footer{
    border-top:1px solid var(--color-ash);
    padding-top:var(--sp-46);
    padding-bottom:var(--sp-46);
    display:flex;
    justify-content:space-between;
    flex-wrap:wrap;
    gap:var(--sp-19);
    font-size:var(--text-caption);
    letter-spacing:0.05em;
    text-transform:uppercase;
  }
  footer .col{
    display:flex;
    flex-direction:column;
    gap:var(--sp-8);
  }
  footer a:hover{ text-decoration:underline; text-underline-offset:3px; }

/* ---------- MULTI-PAGE HELPERS ---------- */
.nav-links a.active{
  text-decoration:underline;
  text-underline-offset:4px;
}
.page-first{
  border-top:none !important;
  padding-top:var(--sp-76) !important;
}

/* ---------- HOME TEASERS ---------- */
.teasers{
  padding-top:var(--sp-119);
  padding-bottom:var(--sp-119);
  border-top:1px solid var(--color-ash);
}
.teasers-head{
  margin-bottom:var(--sp-46);
}
.teasers-head h2{
  font-size:var(--text-heading);
  font-weight:400;
  line-height:0.8;
  letter-spacing:0.009em;
  text-transform:uppercase;
  max-width:700px;
}
.teasers-grid{
  display:grid;
  grid-template-columns:repeat(3, 1fr);
  gap:1px;
  background:var(--color-ash);
  border:1px solid var(--color-ash);
}
.teaser-card{
  background:var(--color-paper);
  background-image:
    linear-gradient(var(--color-parchment) 1px, transparent 1px),
    linear-gradient(90deg, var(--color-parchment) 1px, transparent 1px);
  background-size:24px 24px;
  padding:var(--sp-32) var(--sp-30);
  min-height:220px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
}
.teaser-card h3{
  font-size:var(--text-heading-sm);
  font-weight:400;
  line-height:1;
  letter-spacing:0.006em;
  text-transform:uppercase;
  margin-bottom:var(--sp-15);
}
.teaser-card p{
  font-size:var(--text-body-sm);
  line-height:1.4;
  max-width:320px;
  margin-bottom:var(--sp-19);
}

@media (max-width:800px){
  .teasers-grid{ grid-template-columns:1fr; }
  .teasers-head h2{ font-size:42px; }
}

/* ============================================================
   CHATBOT WIDGET
   ============================================================ */
.iocook-chat-root{
  position:fixed;
  right:24px;
  bottom:24px;
  z-index:200;
  font-family:var(--font);
}

.iocook-chat-bubble{
  display:flex;
  align-items:center;
  gap:8px;
  background:var(--color-ink);
  color:var(--color-parchment);
  border:none;
  border-radius:30px;
  padding:14px 20px;
  font-family:var(--font);
  font-size:14px;
  letter-spacing:0.02em;
  cursor:pointer;
  box-shadow:0 6px 18px rgba(0,0,0,0.18);
  transition:transform .15s ease;
}
.iocook-chat-bubble:hover{ transform:translateY(-2px); }
.iocook-chat-bubble-icon{ font-size:16px; }

.iocook-chat-panel{
  width:340px;
  max-width:calc(100vw - 32px);
  height:480px;
  max-height:calc(100vh - 48px);
  background:var(--color-parchment);
  border:1px solid var(--color-ink);
  border-radius:14px;
  box-shadow:0 12px 32px rgba(0,0,0,0.22);
  flex-direction:column;
  overflow:hidden;
}

.iocook-chat-header{
  background:var(--color-ink);
  color:var(--color-parchment);
  padding:14px 16px;
  font-size:14px;
  letter-spacing:0.02em;
  text-transform:uppercase;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.iocook-chat-close{
  background:none;
  border:none;
  color:var(--color-parchment);
  font-size:22px;
  line-height:1;
  cursor:pointer;
  padding:0 4px;
}

.iocook-chat-body{
  flex:1;
  overflow-y:auto;
  padding:16px;
  display:flex;
  flex-direction:column;
  gap:12px;
  background:var(--color-paper);
  background-image:
    linear-gradient(var(--color-parchment) 1px, transparent 1px),
    linear-gradient(90deg, var(--color-parchment) 1px, transparent 1px);
  background-size:20px 20px;
}

.iocook-chat-msg{
  display:flex;
  flex-direction:column;
  max-width:88%;
}
.iocook-chat-msg-bot{ align-self:flex-start; }
.iocook-chat-msg-user{ align-self:flex-end; }

.iocook-chat-msg-bubble{
  font-size:13.5px;
  line-height:1.45;
  padding:10px 12px;
  border-radius:10px;
}
.iocook-chat-msg-bot .iocook-chat-msg-bubble{
  background:var(--color-parchment);
  border:1px solid var(--color-ash);
  color:var(--color-ink);
  border-bottom-left-radius:2px;
}
.iocook-chat-msg-user .iocook-chat-msg-bubble{
  background:var(--color-ink);
  color:var(--color-parchment);
  border-bottom-right-radius:2px;
}
.iocook-chat-msg-link{
  align-self:flex-start;
  margin-top:6px;
  font-size:12px;
  text-decoration:underline;
  text-underline-offset:3px;
  color:var(--color-ink);
}

.iocook-chat-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:0 16px 10px;
  background:var(--color-paper);
}
.iocook-chat-chip{
  font-family:var(--font);
  font-size:11.5px;
  border:1px solid var(--color-ink);
  background:var(--color-paper);
  border-radius:20px;
  padding:5px 10px;
  cursor:pointer;
  white-space:nowrap;
}
.iocook-chat-chip:hover{ background:var(--color-ink); color:var(--color-parchment); }

.iocook-chat-form{
  display:flex;
  border-top:1px solid var(--color-ash);
  background:var(--color-parchment);
}
.iocook-chat-input{
  flex:1;
  border:none;
  background:transparent;
  padding:12px 14px;
  font-family:var(--font);
  font-size:13.5px;
  color:var(--color-ink);
  outline:none;
}
.iocook-chat-send{
  border:none;
  background:none;
  font-family:var(--font);
  font-size:13px;
  padding:0 16px;
  cursor:pointer;
  color:var(--color-ink);
  white-space:nowrap;
}
.iocook-chat-send:hover{ text-decoration:underline; text-underline-offset:3px; }

@media (max-width:480px){
  .iocook-chat-root{ right:12px; bottom:12px; }
  .iocook-chat-panel{ width:calc(100vw - 24px); height:70vh; }
}

/* ---------- CHATBOT WIDGET ---------- */
#iocook-chat-launcher{
  position:fixed;
  right:20px;
  bottom:74px;
  width:56px;
  height:56px;
  border-radius:50%;
  background:var(--color-ink);
  color:var(--color-parchment);
  border:none;
  cursor:pointer;
  display:flex;
  align-items:center;
  justify-content:center;
  z-index:200;
  font-family:var(--font);
}
#iocook-chat-launcher svg{ width:24px; height:24px; }

#iocook-chat-panel{
  position:fixed;
  right:20px;
  bottom:142px;
  width:340px;
  max-width:calc(100vw - 40px);
  height:460px;
  max-height:calc(100vh - 120px);
  background:var(--color-paper);
  border:1px solid var(--color-ash);
  border-radius:14px;
  box-shadow:0 8px 24px rgba(0,0,0,0.12);
  display:none;
  flex-direction:column;
  overflow:hidden;
  z-index:200;
  font-family:var(--font);
}
#iocook-chat-panel.open{ display:flex; }

.iocook-chat-header{
  background:var(--color-ink);
  color:var(--color-parchment);
  padding:14px 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  flex-shrink:0;
}
.iocook-chat-header strong{
  font-size:14px;
  text-transform:uppercase;
  letter-spacing:0.03em;
  font-weight:500;
}
.iocook-chat-header span.sub{
  display:block;
  font-size:11px;
  opacity:0.65;
  font-weight:400;
  text-transform:none;
  letter-spacing:normal;
  margin-top:2px;
}
.iocook-chat-close{
  background:none;
  border:none;
  color:var(--color-parchment);
  font-size:18px;
  cursor:pointer;
  line-height:1;
  padding:4px;
}

.iocook-chat-messages{
  flex:1;
  overflow-y:auto;
  padding:14px 14px 6px;
  display:flex;
  flex-direction:column;
  gap:10px;
  background:var(--color-parchment);
}
.iocook-msg{
  max-width:84%;
  font-size:13px;
  line-height:1.45;
  padding:9px 12px;
  border-radius:12px;
}
.iocook-msg.bot{
  align-self:flex-start;
  background:var(--color-paper);
  border:1px solid var(--color-ash);
  border-bottom-left-radius:3px;
}
.iocook-msg.user{
  align-self:flex-end;
  background:var(--color-ink);
  color:var(--color-parchment);
  border-bottom-right-radius:3px;
}

.iocook-chat-chips{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:0 14px 10px;
  background:var(--color-parchment);
  flex-shrink:0;
}
.iocook-chip{
  font-size:11px;
  border:1px solid var(--color-ink);
  border-radius:20px;
  padding:5px 10px;
  background:var(--color-paper);
  cursor:pointer;
  white-space:nowrap;
}
.iocook-chip:hover{ background:var(--color-ink); color:var(--color-parchment); }

.iocook-chat-inputrow{
  display:flex;
  border-top:1px solid var(--color-ash);
  flex-shrink:0;
}
.iocook-chat-inputrow input{
  flex:1;
  border:none;
  padding:12px 14px;
  font-family:var(--font);
  font-size:13px;
  background:var(--color-paper);
  outline:none;
}
.iocook-chat-inputrow button{
  border:none;
  background:var(--color-ink);
  color:var(--color-parchment);
  padding:0 18px;
  cursor:pointer;
  font-family:var(--font);
  font-size:13px;
}

@media (max-width:480px){
  #iocook-chat-panel{
    right:10px;
    left:10px;
    width:auto;
    bottom:134px;
  }
  #iocook-chat-launcher{ right:14px; bottom:68px; }
}

/* ---------- LOTTINO MASCOT ---------- */
#iocook-chat-launcher svg{ width:26px; height:26px; }
#iocook-chat-launcher{
  animation: lottino-bounce 4.5s ease-in-out infinite;
}
@keyframes lottino-bounce{
  0%, 78%, 100%{ transform:translateY(0); }
  82%{ transform:translateY(-5px); }
  86%{ transform:translateY(0); }
  90%{ transform:translateY(-3px); }
  94%{ transform:translateY(0); }
}
@media (prefers-reduced-motion: reduce){
  #iocook-chat-launcher{ animation:none; }
}

.iocook-chat-title{
  display:flex;
  align-items:center;
  gap:10px;
}
.iocook-mascot-avatar{
  width:28px;
  height:28px;
  flex-shrink:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
.iocook-mascot-avatar svg{ width:100%; height:100%; }

.iocook-msg.bot{
  display:flex;
  align-items:flex-start;
  gap:8px;
}
.iocook-mascot-mini{
  width:18px;
  height:18px;
  flex-shrink:0;
  margin-top:1px;
  color:var(--color-ink);
}
.iocook-mascot-mini svg{ width:100%; height:100%; }
.iocook-msg-text{ flex:1; }

/* =============================================
   REPORT UPGRADES — settembre 2026
   ============================================= */

/* --- HERO v2 --- */
.hero-microcopy{
  display:flex;
  flex-wrap:wrap;
  gap:0 var(--sp-19);
  margin-top:var(--sp-15);
  font-size:12px;
  opacity:0.7;
}
.hero-microcopy span::before{ content:"✓ "; }

/* --- VIDEO DEMO ABOVE THE FOLD --- */
.hero-video-wrap{
  padding-top:var(--sp-76);
  padding-bottom:0;
  border-top:1px solid var(--color-ash);
}
.hero-video-label{
  font-size:var(--text-body-sm);
  text-transform:uppercase;
  letter-spacing:0.04em;
  margin-bottom:var(--sp-15);
  opacity:0.6;
}
.hero-video-head{
  font-size:var(--text-heading-sm);
  font-weight:400;
  line-height:1;
  letter-spacing:0.006em;
  text-transform:uppercase;
  max-width:600px;
  margin-bottom:var(--sp-30);
}

/* --- TARGET SECTION --- */
.targets{
  padding-top:var(--sp-119);
  padding-bottom:var(--sp-119);
  border-top:1px solid var(--color-ash);
}
.targets-head{
  margin-bottom:var(--sp-46);
}
.targets-head h2{
  font-size:var(--text-heading);
  font-weight:400;
  line-height:0.85;
  letter-spacing:0.009em;
  text-transform:uppercase;
  max-width:640px;
}
.targets-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:1px;
  background:var(--color-ash);
  border:1px solid var(--color-ash);
}
.target-card{
  background:var(--color-paper);
  padding:var(--sp-30) var(--sp-30) var(--sp-46);
  display:flex;
  flex-direction:column;
  gap:var(--sp-15);
}
.target-card-icon{
  font-size:28px;
  line-height:1;
}
.target-card h3{
  font-size:var(--text-heading-sm);
  font-weight:400;
  line-height:1;
  letter-spacing:0.006em;
  text-transform:uppercase;
}
.target-card p{
  font-size:var(--text-body-sm);
  line-height:1.45;
  opacity:0.8;
  flex:1;
}
.target-card .target-msg{
  font-size:12.5px;
  font-style:italic;
  opacity:0.65;
  border-left:2px solid var(--color-ash);
  padding-left:10px;
  line-height:1.4;
}
@media (max-width:900px){
  .targets-grid{ grid-template-columns:1fr 1fr; }
}
@media (max-width:560px){
  .targets-grid{ grid-template-columns:1fr; }
}

/* --- SOCIAL PROOF --- */
.social-proof{
  padding-top:var(--sp-119);
  padding-bottom:var(--sp-119);
  border-top:1px solid var(--color-ash);
}
.social-proof-head{
  margin-bottom:var(--sp-46);
}
.social-proof-head h2{
  font-size:var(--text-heading);
  font-weight:400;
  line-height:0.85;
  letter-spacing:0.009em;
  text-transform:uppercase;
  max-width:640px;
}
.social-proof-metrics{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--color-ash);
  border:1px solid var(--color-ash);
  margin-bottom:var(--sp-46);
}
.metric-card{
  background:var(--color-paper);
  padding:var(--sp-32) var(--sp-30);
  text-align:center;
}
.metric-num{
  font-size:52px;
  font-weight:700;
  line-height:1;
  display:block;
  margin-bottom:6px;
}
.metric-label{
  font-size:12px;
  text-transform:uppercase;
  letter-spacing:0.04em;
  opacity:0.6;
}
.metric-placeholder{
  font-size:11px;
  opacity:0.4;
  margin-top:4px;
  display:block;
}
.reviews-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:var(--sp-19);
}
.review-card{
  border:1px solid var(--color-ash);
  border-radius:10px;
  padding:var(--sp-19) var(--sp-19) var(--sp-15);
  display:flex;
  flex-direction:column;
  gap:var(--sp-15);
  position:relative;
}
.review-card.placeholder{ opacity:0.45; }
.review-placeholder-tag{
  font-size:10px;
  text-transform:uppercase;
  letter-spacing:0.05em;
  border:1px dashed var(--color-ash);
  border-radius:20px;
  padding:3px 10px;
  display:inline-block;
  margin-bottom:4px;
}
.review-stars{ color:#1d1d1d; font-size:13px; letter-spacing:1px; }
.review-text{ font-size:13.5px; line-height:1.5; flex:1; }
.review-author{ display:flex; align-items:center; gap:10px; }
.review-avatar{
  width:28px; height:28px; border-radius:50%;
  background:var(--color-ash);
  display:flex; align-items:center; justify-content:center;
  font-size:12px; font-weight:700;
  flex-shrink:0;
}
.review-name{ font-size:12px; font-weight:500; }
.review-role{ font-size:11px; opacity:0.6; }
@media (max-width:800px){
  .social-proof-metrics{ grid-template-columns:1fr 1fr; }
  .reviews-grid{ grid-template-columns:1fr; }
}
@media (max-width:560px){
  .social-proof-metrics{ grid-template-columns:1fr; }
  .metric-num{ font-size:40px; }
}

/* --- PRICING / ABBONAMENTI --- */
.pricing{
  padding-top:var(--sp-119);
  padding-bottom:var(--sp-119);
  border-top:1px solid var(--color-ash);
}
.pricing-head{
  margin-bottom:var(--sp-46);
}
.pricing-head h2{
  font-size:var(--text-heading);
  font-weight:400;
  line-height:0.85;
  letter-spacing:0.009em;
  text-transform:uppercase;
  max-width:700px;
}
.pricing-head p{
  font-size:var(--text-body-sm);
  max-width:520px;
  margin-top:var(--sp-15);
  opacity:0.75;
}
.pricing-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:1px;
  background:var(--color-ash);
  border:1px solid var(--color-ash);
}
.pricing-card{
  background:var(--color-paper);
  padding:var(--sp-32) var(--sp-30) var(--sp-46);
  display:flex;
  flex-direction:column;
}
.pricing-card.featured{ background:var(--color-ink); color:var(--color-parchment); }
.pricing-card.featured .pricing-feature-item{ opacity:0.85; }
.pricing-card.featured .pricing-feature-item::before{ color:var(--color-parchment); }
.pricing-plan-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.05em;
  margin-bottom:var(--sp-15);
  opacity:0.6;
}
.pricing-card.featured .pricing-plan-label{ opacity:0.7; }
.pricing-price{
  font-size:40px;
  font-weight:700;
  line-height:1;
  margin-bottom:4px;
}
.pricing-price-note{
  font-size:12px;
  opacity:0.55;
  margin-bottom:var(--sp-19);
}
.pricing-placeholder-badge{
  font-size:10px;
  border:1px dashed;
  border-radius:20px;
  padding:3px 10px;
  display:inline-block;
  opacity:0.5;
  margin-bottom:var(--sp-15);
}
.pricing-desc{
  font-size:13px;
  line-height:1.5;
  opacity:0.75;
  margin-bottom:var(--sp-19);
}
.pricing-features{
  list-style:none;
  padding:0;
  margin:0 0 var(--sp-30);
  flex:1;
  display:flex;
  flex-direction:column;
  gap:8px;
}
.pricing-feature-item{
  font-size:13px;
  padding-left:18px;
  position:relative;
}
.pricing-feature-item::before{
  content:"✓";
  position:absolute;
  left:0;
  font-weight:700;
  color:var(--color-ink);
}
.pricing-cta{
  display:block;
  text-align:center;
  padding:11px 0;
  border:1px solid currentColor;
  border-radius:10px;
  font-size:13px;
  font-weight:500;
  text-decoration:none;
  color:inherit;
}
.pricing-cta:hover{ opacity:0.75; }
.pricing-card.featured .pricing-cta{
  background:var(--color-parchment);
  color:var(--color-ink);
  border-color:var(--color-parchment);
}
.pricing-footnote{
  font-size:12px;
  opacity:0.55;
  margin-top:var(--sp-19);
}
@media (max-width:800px){
  .pricing-grid{ grid-template-columns:1fr; }
}

/* --- HERO VIDEO nell'hero (sezione galleria) --- */
.hero-video-wrap .browser-frame{ margin-top:0; }

/* --- PRICING AGGIORNATO --- */
.pricing-grid-single{
  display:grid;
  grid-template-columns:1fr 1.4fr;
  gap:1px;
}
.pricing-coming-soon{
  background:var(--color-parchment);
}
.pricing-coming-title{
  font-size:var(--text-heading-sm);
  font-weight:400;
  line-height:1;
  letter-spacing:0.006em;
  text-transform:uppercase;
  margin-bottom:var(--sp-15);
}
@media (max-width:700px){
  .pricing-grid-single{ grid-template-columns:1fr; }
}

/* --- EXCEL vs IOCOOK --- */
.excel-vs{
  padding-top:var(--sp-119);
  padding-bottom:var(--sp-119);
  border-top:1px solid var(--color-ash);
}
.excel-vs-head{
  margin-bottom:var(--sp-46);
}
.excel-vs-head h2{
  font-size:var(--text-heading);
  font-weight:400;
  line-height:0.85;
  letter-spacing:0.009em;
  text-transform:uppercase;
  max-width:640px;
}
.excel-vs-head p{
  font-size:var(--text-body-sm);
  max-width:500px;
  margin-top:var(--sp-15);
  opacity:0.75;
}
.excel-vs-table{
  width:100%;
  border-collapse:collapse;
  font-size:var(--text-body-sm);
}
.excel-vs-table th{
  text-align:left;
  font-size:11px;
  font-weight:500;
  letter-spacing:0.04em;
  text-transform:uppercase;
  padding:10px 16px;
  border-bottom:2px solid var(--color-ink);
}
.excel-vs-table th:last-child{
  color:var(--color-paper);
  background:var(--color-ink);
}
.excel-vs-table td{
  padding:14px 16px;
  border-bottom:1px solid var(--color-ash);
  vertical-align:top;
  line-height:1.4;
}
.excel-vs-table td:first-child{ opacity:0.55; }
.excel-vs-table td:last-child{
  background:var(--color-paper);
  font-weight:500;
}
.excel-vs-table td .badge-ok{
  display:inline-block;
  font-size:10px;
  background:var(--color-ink);
  color:var(--color-parchment);
  border-radius:4px;
  padding:2px 7px;
  margin-right:6px;
  vertical-align:middle;
}
@media (max-width:640px){
  .excel-vs-table th, .excel-vs-table td{ padding:10px 10px; font-size:13px; }
}

/* --- FLUSSO VELOCITÀ --- */
.speed-section{
  padding-top:var(--sp-119);
  padding-bottom:var(--sp-119);
  border-top:1px solid var(--color-ash);
}
.speed-head{
  margin-bottom:var(--sp-46);
}
.speed-head h2{
  font-size:var(--text-heading);
  font-weight:400;
  line-height:0.85;
  letter-spacing:0.009em;
  text-transform:uppercase;
  max-width:640px;
}
.speed-head p{
  font-size:var(--text-body-sm);
  max-width:500px;
  margin-top:var(--sp-15);
  opacity:0.75;
}
.speed-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:1px;
  background:var(--color-ash);
  border:1px solid var(--color-ash);
}
.speed-col{
  background:var(--color-paper);
  padding:var(--sp-32) var(--sp-30) var(--sp-46);
}
.speed-col.iocook-col{ background:var(--color-ink); color:var(--color-parchment); }
.speed-col-label{
  font-size:11px;
  text-transform:uppercase;
  letter-spacing:0.05em;
  margin-bottom:var(--sp-19);
  opacity:0.6;
}
.speed-badge{
  display:inline-block;
  font-size:11px;
  font-weight:500;
  border:1px solid currentColor;
  border-radius:20px;
  padding:4px 12px;
  margin-bottom:var(--sp-19);
  opacity:0.85;
}
.speed-steps{
  display:flex;
  flex-direction:column;
  gap:0;
}
.speed-step{
  display:flex;
  align-items:flex-start;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid rgba(128,128,128,0.2);
  font-size:14px;
  line-height:1.3;
}
.speed-step:last-child{ border-bottom:none; }
.speed-step-icon{ font-size:18px; flex-shrink:0; width:28px; text-align:center; }
.speed-step-text{ flex:1; }
.speed-step-arrow{
  font-size:10px;
  opacity:0.4;
  flex-shrink:0;
  padding-top:4px;
}
.speed-step-note{
  font-size:11px;
  opacity:0.55;
  margin-top:3px;
}
.speed-total{
  margin-top:var(--sp-19);
  font-size:12px;
  opacity:0.55;
}
.speed-total strong{ font-size:22px; opacity:1; display:block; margin-bottom:4px; }
@media (max-width:640px){
  .speed-grid{ grid-template-columns:1fr; }
}