:root{
    --paper:#FAFAFA;
    --paper-2:#F1EFF6;
    --paper-3:#FFFFFF;
    --ink:#100E17;
    --ink-dim:#615D70;
    --pink:#EA1479;
    --purple:#7B2FF7;
    --gradient:linear-gradient(135deg, var(--pink), var(--purple));
    --line:rgba(16,14,23,0.11);
    --line-strong:rgba(16,14,23,0.24);
      --display:'Poppins', sans-serif;
    --body:'Poppins', sans-serif;
    --mono:'Poppins';

  }
  *{margin:0;padding:0;box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--paper);
    color:var(--ink);
    font-family:poppins;
    line-height:1.5;
    -webkit-font-smoothing:antialiased;
    overflow-x:hidden;
  }
  a{color:inherit;text-decoration:none;}
  ::selection{background:var(--pink);color:#fff;}

  @media (prefers-reduced-motion: reduce){
    *{animation-duration:0.001ms !important; animation-iteration-count:1 !important; transition-duration:0.001ms !important;}
  }

  .gradient-text{
    background:var(--gradient); -webkit-background-clip:text; background-clip:text; color:transparent;
  }

  header.nav{
    position:fixed; top:0; left:0; right:0; z-index:100;
    display:flex; align-items:center; justify-content:space-between;
    padding:14px 5vw;
    background:rgba(250,250,250,0.86);
    backdrop-filter:blur(10px);
    border-bottom:1px solid var(--line);
  }
  .logo{display:flex; align-items:center; gap:10px;}
  .logo img{height:60px; width:120px; display:block;}
  nav.links{display:flex; gap:2.1rem; font-family:var(--mono); font-size:14px; font-weight:500; letter-spacing:0.03em;}
  nav.links a{color:var(--ink-dim); position:relative; padding-bottom:4px; transition:color 0.2s; cursor:pointer;}
  nav.links a:hover{color:var(--ink);}
  .nav-cta{
    font-family:var(--mono); font-size:0.85rem; letter-spacing:0.02em;
    background:var(--gradient); color:#fff; padding:10px 18px; border-radius:2px;
    transition:opacity 0.2s; cursor:pointer;
  }
  .nav-cta:hover{opacity:0.88;}

  .mobile-toggle{display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none;}
  .mobile-toggle span{width:22px; height:2px; background:var(--ink);}

  section{padding:6.5rem 5vw;}
  .eyebrow{
    font-family:var(--mono); font-size:1rem; letter-spacing:0.08em; text-transform:uppercase;font-weight:600;
    color:var(--pink); display:flex; align-items:center; gap:10px; margin-bottom:1.4rem;
  }
  .eyebrow::before{content:'';width:26px;height:1px;background:var(--pink);display:inline-block;}
  h1,h2,h3{font-family:var(--display); font-weight:600; letter-spacing:-0.01em;}
  .lede{color:var(--ink-dim); max-width:640px; font-size:1.05rem;}

  .hero{min-height:100vh; display:flex; flex-direction:column; justify-content:center; position:relative; padding-top:8rem;}
  .hero-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:3rem; align-items:center;}
  .status-badge{
    font-family:var(--mono); font-size:0.72rem; letter-spacing:0.06em;
    color:var(--ink); background:var(--paper-3); border:1px solid var(--line-strong);
    display:inline-flex; align-items:center; gap:8px; padding:7px 12px; border-radius:100px;
    margin-bottom:2rem;
  }
  .status-dot{width:6px;height:6px;border-radius:50%; background:var(--pink); animation:pulse 1.8s infinite;}
  @keyframes pulse{0%,100%{opacity:1; box-shadow:0 0 0 0 rgba(234,20,121,0.4);} 50%{opacity:0.6; box-shadow:0 0 0 5px rgba(234,20,121,0);}}
  .hero h1{font-size:clamp(2.4rem, 5vw, 4.1rem); line-height:1.03; margin-bottom:1.6rem;}
  .hero-actions{display:flex; gap:1rem; margin-top:2.4rem; flex-wrap:wrap;}
  .btn{
    font-family:var(--mono); font-size:0.82rem; letter-spacing:0.02em;
    padding:14px 24px; border-radius:2px; cursor:pointer; display:inline-block;
    transition:all 0.2s; border:1px solid transparent;
  }
  .btn-primary{background:var(--gradient); color:#fff;}
  .btn-primary:hover{opacity:0.88;}
  .btn-secondary{border:1px solid var(--line-strong); color:var(--ink);}
  .btn-secondary:hover{border-color:var(--ink);}

  .network{position:relative; max- justify-self:center;}
  .network svg{width:100%; height:100%;}
  .node-label{font-family:var(--mono); font-size:9px; fill:var(--ink-dim); letter-spacing:0.05em;}
  .node-label.center{fill:#fff; font-weight:700;}
  .signal-line{stroke-dasharray:4 5; stroke:var(--line-strong); stroke-width:1; animation:dash 3s linear infinite;}
  @keyframes dash{to{stroke-dashoffset:-45;}}

  .strip{border-top:1px solid var(--line); border-bottom:1px solid var(--line); padding:1.4rem 5vw; display:flex; gap:3rem; overflow:hidden; background:var(--paper-3);}
  .strip-track{display:flex; gap:3rem; animation:scroll 22s linear infinite; white-space:nowrap;}
  .strip span{font-family:var(--mono); font-size:0.8rem; color:var(--ink-dim); letter-spacing:0.04em;}
  @keyframes scroll{from{transform:translateX(0);} to{transform:translateX(-50%);}}

  .services-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line); margin-top:3rem;}
  .service-card{background:var(--paper-3); padding:2.4rem 2rem; transition:background 0.25s;}
  .service-card:hover{background:var(--paper-2);}
  .service-num{font-family:var(--mono); font-weight:600; font-size:1rem; color:var(--pink); margin-bottom:1.2rem; display:block;}
  .service-card h3{font-size:1.15rem; margin-bottom:0.8rem;}
  .service-card p{color:var(--ink-dim); font-size:0.92rem;}

  .not-list{
    margin-top:3.5rem; border:1px dashed var(--line-strong); padding:1.8rem 2rem; border-radius:2px; font-weight:600;
    display:flex; gap:1.5rem; align-items:flex-start;  background:var(--paper-3);
  }
  .not-list .mark{font-family:var(--mono); color:var(--ink-dim); font-size:0.8rem; flex-shrink:0; margin-top:2px;}
  .not-list p{color:var(--ink-dim); font-size:0.92rem;}
  .not-list strong{color:var(--ink); font-weight:600;}

  .flow{margin-top:3.5rem; display:grid; grid-template-columns:repeat(4,1fr); gap:0;}
  .flow-step{position:relative; padding:0 1.6rem 0 0;}
  .flow-step:not(:last-child)::after{position:absolute; right:-0.2rem; top:0; color:var(--ink-dim); font-family:var(--mono);}
  .flow-step .step-tag{font-family:var(--mono); font-size:0.72rem; color:var(--purple); display:block; font-weight:600; margin-bottom:0.8rem;}
  .flow-step h4{font-family:var(--display); font-size:1rem; margin-bottom:0.5rem; font-weight:600;}
  .flow-step p{font-size:0.86rem; color:var(--ink-dim);}

  .cat-grid{margin-top:3rem; display:flex; flex-wrap:wrap; gap:0.8rem;}
  .cat-chip{
    font-family:var(--mono); font-size:0.8rem; padding:10px 18px; border:1px solid var(--line-strong);
    border-radius:100px; color:var(--ink-dim); transition:all 0.2s; background:var(--paper-3);
  }
  .cat-chip:hover{border-color:var(--pink); color:var(--ink);}

  .why-grid{margin-top:3rem; display:grid; grid-template-columns:repeat(3,1fr); gap:2rem;}
  .why-card{padding:1.8rem; border-left:2px solid var(--pink);}
  .why-card h4{font-family:var(--display); font-size:1.05rem; margin-bottom:0.5rem;}
  .why-card p{color:var(--ink-dim); font-size:0.9rem;}

  .about-split{display:grid; grid-template-columns:1fr 1fr; gap:4rem; margin-top:3rem; align-items:start;}
  .about-split p{color:var(--ink-dim); margin-bottom:1.2rem; font-size:1rem;}
  .values{display:flex; flex-direction:column; gap:1.6rem;}
  .value-row{border-left:2px solid var(--purple); padding-left:1.4rem;}
  .value-row h4{font-family:var(--display); font-size:1.05rem; margin-bottom:0.4rem;}
  .value-row p{color:var(--ink-dim); font-size:0.9rem;}

  .founder-note{margin-top:4rem; border-top:1px solid var(--line); padding-top:2.5rem;}
  .founder-note .eyebrow{color:var(--purple);}
  .founder-note .eyebrow::before{background:var(--purple);}
  .founder-note p{font-family:var(--display); font-size:1.1rem; line-height:1.45; color:var(--ink); font-weight:400;}

  .faq-list{margin-top:3rem; display:flex; flex-direction:column;}
  .faq-item{border-bottom:1px solid var(--line);}
  .faq-item summary{
    font-family:var(--display); font-size:1.05rem; font-weight:600; padding:1.4rem 0; cursor:pointer;
    display:flex; justify-content:space-between; align-items:center; list-style:none;
  }
  .faq-item summary::-webkit-details-marker{display:none;}
  .faq-item summary::after{content:'+'; font-family:var(--mono); font-size:1.2rem; color:var(--pink); transition:transform 0.2s;}
  .faq-item[open] summary::after{transform:rotate(45deg);}
  .faq-item p{color:var(--ink-dim); font-size:0.92rem; padding-bottom:1.5rem;}

  .toggle-row{display:flex; gap:0; border:1px solid var(--line-strong); width:fit-content; border-radius:2px; margin-top:2.4rem; overflow:hidden;}
  .toggle-btn{font-family:var(--mono); font-size:0.8rem; padding:12px 22px; cursor:pointer; background:var(--paper-3); border:none; color:var(--ink-dim); transition:all 0.2s;}
  .toggle-btn.active{background:var(--gradient); color:#fff;}

  .contact-wrap{display:grid; grid-template-columns:1fr 1.3fr; gap:4rem; padding-top:3rem;}
  .contact-side p{color:var(--ink-dim); margin-bottom:2rem; font-size:0.95rem;}
  .contact-detail{margin-bottom:1.6rem;}
  .contact-detail .label{font-family:var(--mono); font-size:0.72rem; color:var(--ink-dim); letter-spacing:0.05em; display:block; margin-bottom:4px;}
  .contact-detail .val{font-family:var(--display); font-size:1.05rem;}

  form{display:flex; flex-direction:column; gap:1.4rem;}
  .form-row{display:grid; grid-template-columns:1fr 1fr; gap:1.4rem;}
  .field label{font-family:var(--mono); font-size:0.72rem; font-weight:600; letter-spacing:0.05em; text-transform:uppercase; color:var(--ink-dim); display:block; margin-bottom:8px;}
  .field input, .field select, .field textarea{
    width:100%; background:var(--paper-3); border:1px solid var(--line-strong); color:var(--ink);
    padding:12px 14px; font-family:var(--body); font-size:0.95rem; border-radius:2px; transition:border-color 0.2s;
  }
  .field input:focus, .field select:focus, .field textarea:focus{outline:none; border-color:var(--pink);}
  .field input::placeholder, .field textarea::placeholder{color:#A7A3B3;}
  .field.mono input{font-family:var(--mono);}
  textarea{resize:vertical; min-height:90px;}
  .field select{appearance:none; background-image:linear-gradient(45deg, transparent 50%, var(--ink-dim) 50%), linear-gradient(135deg, var(--ink-dim) 50%, transparent 50%); background-position:calc(100% - 18px) center, calc(100% - 13px) center; background-size:5px 5px, 5px 5px; background-repeat:no-repeat;}
  .creator-fields, .brand-fields{display:flex; flex-direction:column; gap:1.4rem;}
  .hidden{display:none }
  .submit-row{display:flex; align-items:center; gap:1.4rem; margin-top:0.6rem;}
  .form-note{font-family:var(--mono); font-size:0.72rem; color:var(--ink-dim);}
  .confirm-msg{display:none; border:1px solid var(--pink); padding:1.6rem; border-radius:2px; font-family:var(--mono); font-size:0.85rem; margin-top:1rem; color:var(--ink); background:var(--paper-2);}
  .confirm-msg.show{display:block;}

  footer{border-top:1px solid var(--line); padding:3rem 5vw; display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:1.5rem;}
  footer .foot-links{display:flex; gap:2rem; font-family:var(--mono); font-size:0.78rem; color:var(--ink-dim);}
  footer .foot-links a:hover{color:var(--ink);}
  footer .copy{font-family:var(--mono); font-size:0.75rem; color:var(--ink-dim);}

  @media (max-width:860px){
    nav.links, .nav-cta{display:none;}
    .mobile-toggle{display:flex;}
    nav.links.open{
      display:flex; position:fixed; top:64px; left:0; right:0; background:var(--paper-3);
      flex-direction:column; padding:1.5rem 5vw; border-bottom:1px solid var(--line); gap:1.2rem; z-index:99;
    }
    .hero-grid{grid-template-columns:1fr;}
    .network{max-width:320px; margin-top:2rem;}
    .services-grid{grid-template-columns:1fr;}
    .flow{grid-template-columns:1fr; gap:2rem;}
    .flow-step::after{display:none;}
    .why-grid{grid-template-columns:1fr;}
    .about-split{grid-template-columns:1fr; gap:2rem;}
    .contact-wrap{grid-template-columns:1fr;}
    .form-row{grid-template-columns:1fr;}
    section{padding:4.5rem 5vw;}
  }