*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
    :root{
      --pink:#ff1767;
      --pink-glow:#ff4d8a;
      --pink-deep:#c20e4d;
      --dark:#08080b;
      --dark-2:#0e0e13;
      --dark-card:#14141b;
      --dark-border:#22222c;
      --white:#f4f4f6;
      --gray:#8a8a9a;
    }
    html{scroll-behavior:smooth}
    body{
      font-family:'Inter',system-ui,sans-serif;
      background:var(--dark);
      color:var(--white);
      overflow-x:hidden;
      line-height:1.6;
      background-image:
        radial-gradient(ellipse at 15% 10%, rgba(255,23,103,0.14) 0%, transparent 55%),
        radial-gradient(ellipse at 85% 90%, rgba(255,23,103,0.08) 0%, transparent 60%),
        repeating-linear-gradient(135deg, rgba(255,255,255,0.012) 0 1px, transparent 1px 8px);
    }

    /* grain */
    body::before{
      content:'';position:fixed;inset:0;pointer-events:none;z-index:9999;
      background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='0.05'/%3E%3C/svg%3E");
      mix-blend-mode:overlay;
    }

    /* ── Animated Logo Mark (top-left) ── */
    .logo-mark{
      --size:40px;
      width:var(--size);height:var(--size);
      display:inline-block;position:relative;
      transform:rotate(-6deg);
    }
    .logo-mark svg{width:100%;height:100%;overflow:visible}
    .logo-mark .ring{
      fill:none;stroke:var(--pink);stroke-width:2.2;
      filter:drop-shadow(0 0 6px rgba(255,23,103,0.7));
      animation:spin 9s linear infinite;
      transform-origin:center;
    }
    .logo-mark .ring-dash{stroke-dasharray:6 6}
    .logo-mark .ecg{
      fill:none;stroke:var(--pink);stroke-width:2.6;
      stroke-linecap:round;stroke-linejoin:round;
      stroke-dasharray:120;
      stroke-dashoffset:120;
      animation:ecgDraw 1.8s ease-in-out infinite;
      filter:drop-shadow(0 0 4px rgba(255,23,103,0.8));
    }
    .logo-mark .core{
      fill:var(--pink);
      transform-origin:center;
      animation:beat 1.2s ease-in-out infinite;
      filter:drop-shadow(0 0 8px var(--pink));
    }
    @keyframes spin{to{transform:rotate(360deg)}}
    @keyframes ecgDraw{
      0%{stroke-dashoffset:120}
      60%{stroke-dashoffset:0}
      100%{stroke-dashoffset:-120}
    }
    @keyframes beat{
      0%,60%,100%{transform:scale(1)}
      15%{transform:scale(1.35)}
      30%{transform:scale(0.9)}
      45%{transform:scale(1.15)}
    }

    /* ── Nav ── */
    nav{
      position:fixed;top:0;left:0;right:0;z-index:100;
      display:flex;align-items:center;justify-content:space-between;
      padding:1rem 2.5rem;
      background:rgba(8,8,11,0.78);
      backdrop-filter:blur(14px);
      border-bottom:1px solid var(--dark-border);
    }
    .nav-brand{display:flex;align-items:center;gap:.75rem;text-decoration:none;color:var(--white)}
    .nav-brand .brand-text{
      font-family:'Bebas Neue',sans-serif;
      font-size:1.55rem;letter-spacing:.1em;
      transform:skewX(-6deg);
    }
    .nav-brand .brand-text .t2{color:var(--pink)}
    .nav-links{display:flex;gap:2rem;align-items:center;list-style:none}
    .nav-links a{
      color:var(--gray);text-decoration:none;
      font-size:.82rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;
      transition:color .2s;
    }
    .nav-links a:hover{color:var(--white)}

    /* ── Buttons ── */
    .btn{
      display:inline-flex;align-items:center;gap:.5rem;
      padding:.9rem 2rem;border-radius:3px;
      font-weight:700;font-size:.9rem;text-decoration:none;
      transition:all .25s;cursor:pointer;border:none;
      letter-spacing:.08em;text-transform:uppercase;
      position:relative;
    }
    .btn-primary{
      background:var(--pink);color:#fff;
      box-shadow:0 0 0 0 rgba(255,23,103,0.6), 4px 4px 0 0 #000;
      clip-path:polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
    }
    .btn-primary:hover{
      background:var(--pink-glow);
      box-shadow:0 0 30px rgba(255,23,103,0.55), 4px 4px 0 0 #000;
      transform:translate(-1px,-1px);
    }
    .btn-ghost{
      background:transparent;color:var(--white);
      border:1px solid var(--dark-border);
      clip-path:polygon(4% 0, 100% 0, 96% 100%, 0% 100%);
    }
    .btn-ghost:hover{border-color:var(--pink);color:var(--pink)}

    /* ── Hero ── */
    .hero{
      min-height:100vh;
      display:flex;flex-direction:column;align-items:flex-start;justify-content:center;
      padding:8rem 2rem 4rem;
      padding-left:max(2rem,8vw);
      position:relative;
    }
    .hero::before{
      content:'';position:absolute;
      top:-10%;left:5%;
      width:1000px;height:1000px;
      background:radial-gradient(circle, rgba(255,23,103,0.18) 0%, transparent 65%);
      pointer-events:none;
      animation:breathe 6s ease-in-out infinite;
    }
    @keyframes breathe{
      0%,100%{opacity:.7;transform:scale(1)}
      50%{opacity:1;transform:scale(1.08)}
    }

    .hero-logo{
      width:min(720px,92vw);
      margin-bottom:2rem;
      position:relative;z-index:1;
      filter:drop-shadow(0 0 80px rgba(255,23,103,0.35));
      transform:rotate(-2deg);
    }

    .hero-tagline{
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(2.75rem,5.5vw,5rem);
      letter-spacing:.05em;line-height:1.02;
      margin-bottom:1.25rem;
      position:relative;z-index:1;
      transform:skewX(-4deg);
    }
    .hero-tagline .highlight{
      color:var(--pink);
      text-shadow:0 0 30px rgba(255,23,103,0.6);
    }
    .hero-tagline .slash{
      display:inline-block;
      color:var(--pink);
      transform:rotate(15deg) translateY(-4px);
      margin:0 .3rem;
    }

    .hero-sub{
      color:var(--gray);font-size:1.2rem;
      max-width:620px;margin-bottom:2rem;
      position:relative;z-index:1;line-height:1.7;
    }

    .hero-powered{
      font-family:'Permanent Marker',cursive;
      font-size:.95rem;letter-spacing:.05em;
      color:var(--pink);
      margin-bottom:2.5rem;
      position:relative;z-index:1;
      transform:rotate(-2deg);
      display:inline-block;
    }
    .hero-powered::before{content:'— '}
    .hero-powered::after{content:' —'}

    .hero-cta{display:flex;gap:1rem;flex-wrap:wrap;position:relative;z-index:1}

    /* heartbeat ribbon */
    .heartbeat-line{
      width:100%;max-width:1000px;height:70px;
      margin:3.5rem auto 0;position:relative;z-index:1;opacity:.6;
    }
    .heartbeat-line svg{width:100%;height:100%}
    .heartbeat-path{
      stroke:var(--pink);stroke-width:2.5;fill:none;
      stroke-dasharray:1400;stroke-dashoffset:1400;
      animation:drawLine 3s ease-out forwards, pulseGlow 2s ease-in-out 3s infinite;
      filter:drop-shadow(0 0 6px rgba(255,23,103,0.8));
    }
    @keyframes drawLine{to{stroke-dashoffset:0}}
    @keyframes pulseGlow{
      0%,100%{filter:drop-shadow(0 0 6px rgba(255,23,103,0.8))}
      50%{filter:drop-shadow(0 0 14px rgba(255,23,103,1))}
    }

    /* ── Section base ── */
    section{padding:6rem 2rem;max-width:1200px;margin:0 auto}
    .section-label{
      font-family:'Permanent Marker',cursive;
      font-size:1rem;letter-spacing:.08em;
      color:var(--pink);text-transform:uppercase;
      margin-bottom:.75rem;transform:rotate(-1deg);display:inline-block;
    }
    .section-title{
      font-family:'Bebas Neue',sans-serif;
      font-size:clamp(2.2rem,4.5vw,3.5rem);
      letter-spacing:.04em;margin-bottom:1rem;
      transform:skewX(-3deg);
    }
    .section-title .accent{color:var(--pink)}
    .section-desc{color:var(--gray);max-width:620px;margin-bottom:3rem;font-size:1.05rem}

    /* ── Features ── */
    .features-grid{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
      gap:1.5rem;
    }
    .feature-card{
      background:linear-gradient(145deg,var(--dark-card) 0%,var(--dark-2) 100%);
      border:1px solid var(--dark-border);
      border-radius:4px;
      padding:2rem;
      position:relative;overflow:hidden;
      transition:border-color .3s, transform .3s, box-shadow .3s;
      clip-path:polygon(0 0, 100% 0, 100% calc(100% - 14px), calc(100% - 14px) 100%, 0 100%);
    }
    .feature-card::before{
      content:'';position:absolute;top:0;left:0;right:0;height:2px;
      background:linear-gradient(90deg, transparent, var(--pink), transparent);
      opacity:0;transition:opacity .3s;
    }
    .feature-card:hover{
      border-color:var(--pink);
      transform:translateY(-6px);
      box-shadow:0 20px 40px -20px rgba(255,23,103,0.4);
    }
    .feature-card:hover::before{opacity:1}
    .feature-icon{
      width:52px;height:52px;border-radius:8px;
      background:rgba(255,23,103,0.12);
      border:1px solid rgba(255,23,103,0.25);
      display:flex;align-items:center;justify-content:center;
      margin-bottom:1.25rem;
      transform:rotate(-4deg);
    }
    .feature-icon svg{
      width:26px;height:26px;stroke:var(--pink);fill:none;
      stroke-width:2;stroke-linecap:round;stroke-linejoin:round;
    }
    .feature-card h3{
      font-family:'Bebas Neue',sans-serif;
      font-size:1.35rem;letter-spacing:.05em;
      margin-bottom:.5rem;
    }
    .feature-card p{color:var(--gray);font-size:.92rem;line-height:1.65}
    .feature-tag{
      display:inline-block;margin-top:1rem;
      font-family:'Bebas Neue',sans-serif;
      font-size:.7rem;letter-spacing:.15em;
      color:var(--pink);
      padding:.2rem .6rem;
      border:1px solid rgba(255,23,103,0.4);
      border-radius:2px;
      text-transform:uppercase;
    }

    /* ── Hardware tiers ── */
    .tiers{
      display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:2rem;
    }
    .tier{
      background:var(--dark-card);
      border:1px solid var(--dark-border);
      padding:2.5rem;border-radius:4px;
      position:relative;
    }
    .tier.pro{
      border-color:var(--pink);
      box-shadow:inset 0 0 0 1px rgba(255,23,103,0.3), 0 0 40px -10px rgba(255,23,103,0.3);
    }
    .tier-badge{
      position:absolute;top:-12px;left:2rem;
      background:var(--pink);color:#000;
      font-family:'Bebas Neue',sans-serif;font-size:.75rem;
      letter-spacing:.2em;padding:.35rem .75rem;
      transform:skewX(-10deg);
    }
    .tier h3{
      font-family:'Bebas Neue',sans-serif;
      font-size:1.8rem;letter-spacing:.04em;
      margin-bottom:.5rem;
    }
    .tier .tier-sub{color:var(--pink);font-size:.85rem;text-transform:uppercase;letter-spacing:.15em;margin-bottom:1.5rem;font-family:'Bebas Neue',sans-serif}
    .tier ul{list-style:none;margin-top:1rem}
    .tier li{
      padding:.55rem 0;color:var(--gray);font-size:.92rem;
      border-bottom:1px dashed var(--dark-border);
      display:flex;align-items:flex-start;gap:.6rem;
    }
    .tier li::before{
      content:'▸';color:var(--pink);flex-shrink:0;
    }
    .tier li:last-child{border-bottom:none}

    /* ── Stats strip ── */
    .stats{
      display:flex;justify-content:center;gap:3.5rem;flex-wrap:wrap;
      padding:3.5rem 2rem;
      border-top:1px solid var(--dark-border);
      border-bottom:1px solid var(--dark-border);
      max-width:1000px;margin:0 auto;
      background:linear-gradient(180deg,transparent,rgba(255,23,103,0.03),transparent);
    }
    .stat{text-align:center}
    .stat-value{
      font-family:'Bebas Neue',sans-serif;
      font-size:3.2rem;color:var(--pink);
      line-height:1;
      text-shadow:0 0 20px rgba(255,23,103,0.5);
    }
    .stat-label{
      color:var(--gray);font-size:.78rem;margin-top:.35rem;
      text-transform:uppercase;letter-spacing:.12em;
    }

    /* ── How it works ── */
    .steps{
      display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
      gap:2rem;
    }
    .step{position:relative}
    .step-number{
      font-family:'Bebas Neue',sans-serif;
      font-size:5rem;color:rgba(255,23,103,0.18);
      line-height:1;margin-bottom:.25rem;
      transform:skewX(-8deg);display:inline-block;
      text-shadow:2px 2px 0 rgba(255,23,103,0.08);
    }
    .step h3{font-family:'Bebas Neue',sans-serif;font-size:1.4rem;letter-spacing:.04em;margin-bottom:.5rem}
    .step p{color:var(--gray);font-size:.95rem}

    /* ── ECU strip ── */
    .ecu-strip{
      margin-top:2.5rem;
      display:flex;flex-wrap:wrap;gap:.75rem;
    }
    .ecu-chip{
      font-family:'Bebas Neue',sans-serif;
      letter-spacing:.1em;font-size:.9rem;
      padding:.5rem 1rem;
      background:var(--dark-card);
      border:1px solid var(--dark-border);
      color:var(--gray);
      clip-path:polygon(6% 0, 100% 0, 94% 100%, 0% 100%);
    }
    .ecu-chip:hover{color:var(--pink);border-color:var(--pink)}

    /* ── CTA ── */
    .cta-section{text-align:center;padding:6rem 2rem 8rem}
    .cta-section .section-title{margin-bottom:1.25rem}
    .cta-section .section-desc{margin:0 auto 2.5rem}

    /* ── Footer ── */
    footer{
      border-top:1px solid var(--dark-border);
      padding:2.5rem;text-align:center;
      color:var(--gray);font-size:.8rem;
    }
    footer a{color:var(--gray);text-decoration:none;transition:color .2s}
    footer a:hover{color:var(--pink)}
    .footer-brand{
      display:flex;align-items:center;justify-content:center;gap:.6rem;
      margin-bottom:.75rem;color:var(--white);
      font-family:'Bebas Neue',sans-serif;font-size:1.2rem;letter-spacing:.1em;
    }

    /* ── Mobile ── */
    .nav-toggle{display:none}
    @media (max-width:768px){
      nav{padding:.85rem 1.2rem}
      .nav-brand .brand-text{font-size:1.3rem}
      .nav-links{
        display:none;position:absolute;top:100%;left:0;right:0;
        flex-direction:column;align-items:stretch;
        background:rgba(8,8,11,0.98);
        padding:1.25rem;gap:1rem;border-bottom:1px solid var(--dark-border);
      }
      .nav-links.open{display:flex}
      .nav-links li{width:100%}
      .nav-links a{display:block;padding:.5rem 0}
      .nav-toggle{
        display:block;background:none;border:none;color:var(--white);
        cursor:pointer;padding:.5rem;
      }
      .hero{padding:6rem 1.25rem 3rem;min-height:auto}
      .hero::before{width:600px;height:600px;left:-20%}
      .hero-logo{width:100%;margin-bottom:1.5rem}
      .hero-tagline{font-size:clamp(2rem,9vw,3rem);margin-bottom:1rem}
      .hero-sub{font-size:1rem;margin-bottom:1.5rem}
      .hero-powered{font-size:.85rem;margin-bottom:1.75rem}
      .hero-cta{width:100%}
      .hero-cta .btn{flex:1;justify-content:center;padding:.85rem 1rem;font-size:.8rem}
      .heartbeat-line{height:50px;margin-top:2.5rem}

      section{padding:3.5rem 1.25rem}
      .section-title{font-size:clamp(1.75rem,7vw,2.5rem)}
      .section-desc{font-size:.95rem;margin-bottom:2rem}

      .stats{gap:1.5rem 2rem;padding:2.5rem 1.25rem}
      .stat-value{font-size:2.4rem}
      .stat-label{font-size:.7rem}

      .features-grid{grid-template-columns:1fr;gap:1rem}
      .feature-card{padding:1.5rem}

      .tiers{grid-template-columns:1fr;gap:1.5rem}
      .tier{padding:2rem 1.5rem}

      .steps{grid-template-columns:1fr;gap:1.5rem}
      .step-number{font-size:3.5rem}

      .cta-section{padding:4rem 1.25rem 5rem}
      footer{padding:2rem 1.25rem}
    }
    @media (max-width:420px){
      .stats{gap:1.25rem}
      .stat{flex:1 1 40%}
      .stat-value{font-size:2rem}
      .hero-cta{flex-direction:column}
      .hero-cta .btn{width:100%}
    }