:root {
      --bg: #f7f9fc;
      --surface: #ffffff;
      --surface-2: #eef4fb;
      --text: #142033;
      --muted: #56657a;
      --brand: #1f5eff;
      --brand-dark: #1647c5;
      --accent: #08a6a6;
      --line: #dce4ef;
      --shadow: 0 18px 55px rgba(20, 32, 51, .09);
      --radius: 20px;
      --max: 1160px;
      --header-h: 76px;
      --duration: .22s;
    }

    * { box-sizing: border-box; }
    html { scroll-behavior: smooth; scroll-padding-top: calc(var(--header-h) + 20px); }
    body {
      margin: 0;
      font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      color: var(--text);
      background:
        radial-gradient(circle at 15% 0%, rgba(31,94,255,.08), transparent 34rem),
        radial-gradient(circle at 90% 28%, rgba(8,166,166,.07), transparent 30rem),
        var(--bg);
      line-height: 1.65;
    }
    a { color: inherit; }
    button, a { -webkit-tap-highlight-color: transparent; }
    button { font: inherit; }
    img, svg { display: block; max-width: 100%; }
    p { margin: 0; }
    section { scroll-margin-top: calc(var(--header-h) + 20px); }

    .skip-link {
      position: fixed; left: 1rem; top: -4rem; z-index: 1000;
      padding: .7rem 1rem; border-radius: 10px;
      background: var(--text); color: white; text-decoration: none;
    }
    .skip-link:focus { top: 1rem; }

    .container {
      width: min(calc(100% - 40px), var(--max));
      margin-inline: auto;
    }

    header {
      position: sticky;
      top: 0;
      z-index: 100;
      min-height: var(--header-h);
      background: rgba(255,255,255,.9);
      border-bottom: 1px solid rgba(220,228,239,.9);
      backdrop-filter: blur(16px);
    }

    .nav {
      min-height: var(--header-h);
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }

    .brand {
      display: inline-flex;
      align-items: center;
      gap: .65rem;
      color: var(--text);
      text-decoration: none;
      font-weight: 800;
      letter-spacing: -.04em;
      font-size: 1.25rem;
      white-space: nowrap;
    }
    .brand-mark {
      width: 38px; height: 38px; border-radius: 11px;
      display: grid; place-items: center;
      color: white;
      background: linear-gradient(135deg, var(--brand), var(--accent));
      box-shadow: 0 8px 20px rgba(31,94,255,.25);
      font-size: .95rem;
    }
    .brand small {
      display: block;
      font-size: .62rem;
      letter-spacing: .11em;
      color: var(--muted);
      text-transform: uppercase;
      font-weight: 700;
    }

    .nav-actions { display: flex; align-items: center; gap: .75rem; }
    .nav-cta, .button {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: .5rem;
      border: 0;
      border-radius: 999px;
      padding: .8rem 1.15rem;
      font-weight: 750;
      text-decoration: none;
      cursor: pointer;
      transition: transform var(--duration), box-shadow var(--duration), background var(--duration);
    }
    .nav-cta, .button.primary {
      color: #fff;
      background: var(--brand);
      box-shadow: 0 10px 24px rgba(31,94,255,.2);
    }
    .nav-cta:hover, .button.primary:hover { transform: translateY(-2px); background: var(--brand-dark); }
    .menu-button {
      display: none;
      width: 44px; height: 44px;
      border: 1px solid var(--line);
      border-radius: 12px;
      background: var(--surface);
      cursor: pointer;
    }
    .menu-button svg { width: 22px; margin: auto; }

    .mobile-menu {
      display: none;
      padding: 0 0 1rem;
    }
    .mobile-menu.open { display: grid; gap: .5rem; }
    .mobile-menu a {
      padding: .75rem 1rem;
      border-radius: 12px;
      background: var(--surface-2);
      text-decoration: none;
      font-weight: 700;
    }

    main { overflow: clip; }

    .hero {
      padding: clamp(5rem, 11vw, 9rem) 0 clamp(4rem, 8vw, 7rem);
      position: relative;
    }
    .hero-grid {
      display: grid;
      grid-template-columns: minmax(0, 1.08fr) minmax(280px, .92fr);
      gap: clamp(2rem, 7vw, 6rem);
      align-items: center;
    }
    .eyebrow {
      display: inline-flex;
      align-items: center;
      gap: .55rem;
      color: var(--brand-dark);
      font-weight: 800;
      letter-spacing: .03em;
      margin-bottom: 1.25rem;
    }
    .eyebrow svg { width: 20px; height: 20px; }
    h1, h2, h3 { line-height: 1.12; letter-spacing: -.035em; margin: 0; }
    h1 { font-size: clamp(2.65rem, 5.7vw, 5.2rem); max-width: 850px; }
    h2 { font-size: clamp(2rem, 4vw, 3.3rem); }
    h3 { font-size: 1.15rem; }
    .lead {
      margin-top: 1.5rem;
      max-width: 850px;
      color: var(--muted);
      font-size: clamp(1.02rem, 1.6vw, 1.16rem);
    }
    .lead strong { color: var(--text); }

    .hero-card {
      position: relative;
      min-height: 390px;
      border: 1px solid rgba(31,94,255,.14);
      border-radius: 28px;
      padding: 2rem;
      background:
        linear-gradient(145deg, rgba(255,255,255,.96), rgba(238,244,251,.94));
      box-shadow: var(--shadow);
      overflow: hidden;
    }
    .hero-card::before {
      content: "";
      position: absolute;
      width: 230px; height: 230px;
      border-radius: 50%;
      right: -70px; top: -70px;
      background: rgba(31,94,255,.12);
      filter: blur(3px);
    }
    .network {
      position: relative;
      height: 100%;
      min-height: 330px;
      display: grid;
      place-items: center;
    }
    .network .core {
      width: 130px; height: 130px;
      border-radius: 50%;
      display: grid; place-items: center;
      color: white;
      text-align: center;
      font-weight: 850;
      background: linear-gradient(135deg, var(--brand), var(--accent));
      box-shadow: 0 20px 55px rgba(31,94,255,.28);
      z-index: 2;
    }
    .node {
      position: absolute;
      width: 100px; height: 86px;
      border: 1px solid var(--line);
      border-radius: 22px;
      display: grid; place-items: center;
      text-align: center;
      padding: .45rem;
      background: rgba(255,255,255,.92);
      box-shadow: 0 10px 30px rgba(20,32,51,.08);
      font-size: .78rem;
      font-weight: 800;
    }
    .node::after {
      content: "";
      position: absolute;
      width: 1px; height: 95px;
      background: linear-gradient(var(--brand), transparent);
      z-index: -1;
      opacity: .35;
    }
    .node.n1 { top: 2%; left: 8%; }
    .node.n2 { top: 7%; right: 6%; }
    .node.n3 { bottom: 5%; left: 8%; }
    .node.n4 { bottom: 2%; right: 8%; }
    .node.n5 { top: 40%; right: -1%; }
    .node.n6 { top: 39%; left: -1%; }

    .section { padding: clamp(4.5rem, 9vw, 7rem) 0; }
    .section.alt { background: rgba(255,255,255,.62); border-block: 1px solid rgba(220,228,239,.7); }
    .section-head { max-width: 820px; margin-bottom: 2.5rem; }
    .section-label {
      color: var(--accent);
      font-size: .82rem;
      text-transform: uppercase;
      letter-spacing: .13em;
      font-weight: 850;
      margin-bottom: .7rem;
    }
    .section-head p { margin-top: 1rem; color: var(--muted); font-size: 1.05rem; }

    .benefit-list {
      margin: 1.5rem 0 0;
      padding-left: 1.35rem;
      color: var(--muted);
      display: grid;
      gap: .7rem;
    }
    .benefit-list strong { color: var(--text); }

    .tabs {
      margin-top: 3rem;
      display: grid;
      grid-template-columns: 300px minmax(0,1fr);
      border: 1px solid var(--line);
      border-radius: var(--radius);
      overflow: hidden;
      background: var(--surface);
      box-shadow: var(--shadow);
    }
    .tablist {
      display: grid;
      align-content: start;
      background: #f2f6fb;
      border-right: 1px solid var(--line);
    }
    .tab {
      position: relative;
      display: flex;
      align-items: center;
      gap: .8rem;
      text-align: left;
      padding: 1rem 1.1rem;
      min-height: 78px;
      border: 0;
      border-bottom: 1px solid var(--line);
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      font-weight: 780;
      transition: background var(--duration), color var(--duration);
    }
    .tab:last-child { border-bottom: 0; }
    .tab:hover { background: rgba(255,255,255,.75); color: var(--text); }
    .tab[aria-selected="true"] {
      color: var(--brand-dark);
      background: var(--surface);
    }
    .tab[aria-selected="true"]::before {
      content: "";
      position: absolute;
      left: 0; top: 12px; bottom: 12px;
      width: 4px; border-radius: 0 5px 5px 0;
      background: var(--brand);
    }
    .tab-icon {
      flex: 0 0 auto;
      width: 34px; height: 34px;
      display: grid; place-items: center;
      border-radius: 10px;
      color: var(--brand);
      background: #e8f0ff;
    }
    .tab-icon svg { width: 19px; height: 19px; }
    .tabpanel { padding: clamp(1.6rem, 4vw, 3rem); }
    .tabpanel[hidden] { display: none; }
    .tabpanel h3 { font-size: clamp(1.4rem, 2.4vw, 2rem); }
    .tabpanel p { margin-top: 1rem; color: var(--muted); }
    .tabpanel ul { margin: 1.1rem 0 0; padding-left: 1.2rem; color: var(--muted); display: grid; gap: .65rem; }

    .cta {
      padding: clamp(4rem, 8vw, 6rem) 0;
    }
    .cta-card {
      display: grid;
      grid-template-columns: 1fr auto;
      align-items: center;
      gap: 2rem;
      padding: clamp(2rem, 5vw, 4rem);
      border-radius: 28px;
      color: white;
      background:
        radial-gradient(circle at 80% 10%, rgba(8,166,166,.5), transparent 22rem),
        linear-gradient(135deg, #102a64, #174bc7);
      box-shadow: 0 24px 60px rgba(20,55,125,.25);
    }
    .cta-card h2 { max-width: 700px; }
    .cta-card p { margin-top: 1rem; color: rgba(255,255,255,.82); }
    .cta-card .button { background: white; color: #1745b5; }
    .cta-card .button:hover { transform: translateY(-2px); box-shadow: 0 12px 28px rgba(0,0,0,.16); }


    .contact-section{padding:clamp(4.5rem,9vw,7rem) 0;background:radial-gradient(circle at 10% 15%,rgba(31,94,255,.08),transparent 26rem),radial-gradient(circle at 95% 80%,rgba(8,166,166,.07),transparent 28rem);border-top:1px solid rgba(220,228,239,.7)}
    .contact-grid{display:grid;grid-template-columns:minmax(0,.82fr) minmax(420px,1.18fr);gap:clamp(2rem,7vw,6rem);align-items:start}
    .contact-copy{padding-top:.5rem}.contact-copy h2{max-width:650px}.contact-copy>p{max-width:620px;margin-top:1.2rem;color:var(--muted);font-size:1.05rem}
    .contact-points{display:grid;gap:1rem;margin-top:2rem}.contact-point{display:flex;align-items:flex-start;gap:.9rem}.contact-point>span{flex:0 0 auto;width:34px;height:34px;display:grid;place-items:center;border-radius:10px;color:var(--brand);background:#e8f0ff;font-weight:900}.contact-point strong,.contact-point small{display:block}.contact-point strong{line-height:1.3}.contact-point small{margin-top:.2rem;color:var(--muted)}
    .form-card{padding:clamp(1.35rem,3vw,2rem);border:1px solid var(--line);border-radius:24px;background:rgba(255,255,255,.96);box-shadow:var(--shadow)}
    #contact-form{display:grid;gap:1.1rem}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}.field{display:grid;gap:.42rem}.field label{font-size:.88rem;font-weight:800;color:var(--text)}.field label span,.consent span span{color:var(--brand)}
    .field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:12px;padding:.82rem .9rem;background:#fbfcfe;color:var(--text);font:inherit;outline:none;transition:border-color var(--duration),box-shadow var(--duration),background var(--duration)}
    .field textarea{min-height:145px;resize:vertical}.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgba(31,94,255,.1)}
    .consent{display:flex;align-items:flex-start;gap:.65rem;color:var(--muted);font-size:.88rem;line-height:1.45;cursor:pointer}.consent input{width:18px;height:18px;margin:.08rem 0 0;accent-color:var(--brand);flex:0 0 auto}
    .submit-button{width:100%;border-radius:12px;padding:.95rem 1.2rem}.submit-button:disabled{opacity:.7;cursor:wait;transform:none}.form-status{min-height:1.4em;font-size:.9rem;font-weight:700}.form-status.success{color:#16734b}.form-status.error{color:#a63e3e}.form-note{color:#78869a;font-size:.78rem;line-height:1.5}

    .faq {
      max-width: 900px;
      margin: 2.5rem auto 0;
      border-top: 1px solid var(--line);
    }
    .faq-item { border-bottom: 1px solid var(--line); }
    .faq-question {
      width: 100%;
      border: 0;
      background: transparent;
      padding: 1.35rem 0;
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 1rem;
      align-items: center;
      text-align: left;
      color: var(--text);
      cursor: pointer;
      font-weight: 800;
      font-size: 1.03rem;
    }
    .chevron { width: 20px; height: 20px; transition: transform var(--duration); }
    .faq-question[aria-expanded="true"] .chevron { transform: rotate(180deg); }
    .faq-answer {
      display: grid;
      grid-template-rows: 0fr;
      transition: grid-template-rows .25s ease;
    }
    .faq-answer > div { overflow: hidden; }
    .faq-answer.open { grid-template-rows: 1fr; }
    .faq-answer p {
      padding: 0 2rem 1.4rem 0;
      color: var(--muted);
    }
    .source-note {
      margin-top: 1rem;
      color: #78869a;
      font-size: .82rem;
    }

    footer {
      padding: 3rem 0;
      border-top: 1px solid var(--line);
      background: #fff;
    }
    .footer-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 1rem;
    }
    .footer-row .brand { font-size: 1.05rem; }
    .copyright { color: var(--muted); font-size: .9rem; }

    .reveal {
      opacity: 0;
      transform: translateY(20px);
      transition: opacity .6s ease, transform .6s ease;
    }
    .reveal.visible { opacity: 1; transform: none; }

    :focus-visible {
      outline: 3px solid rgba(31,94,255,.35);
      outline-offset: 3px;
    }

    @media (max-width: 900px) {
      .hero-grid, .tabs { grid-template-columns: 1fr; }
      .tablist {
        display: flex;
        overflow-x: auto;
        border-right: 0;
        border-bottom: 1px solid var(--line);
      }
      .tab {
        min-width: 220px;
        border-bottom: 0;
        border-right: 1px solid var(--line);
      }
      .tab[aria-selected="true"]::before {
        top: auto; bottom: 0; left: 12px; right: 12px;
        width: auto; height: 4px;
        border-radius: 5px 5px 0 0;
      }
      .hero-card { min-height: 330px; }
      .network { min-height: 285px; }
      .node { transform: scale(.86); }
      .cta-card { grid-template-columns: 1fr; }
      .contact-grid { grid-template-columns: 1fr; }
    }

    @media (max-width: 680px) {
      :root { --header-h: 68px; }
      .container { width: min(calc(100% - 28px), var(--max)); }
      .nav-cta { display: none; }
      .menu-button { display: block; }
      .hero { padding-top: 4rem; }
      .hero-card { display: none; }
      .tabs { border-radius: 16px; }
      .tab { min-width: 205px; }
      .footer-row { flex-direction: column; align-items: flex-start; }
      .form-row { grid-template-columns: 1fr; }
    }

    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        scroll-behavior: auto !important;
        transition-duration: .01ms !important;
        animation-duration: .01ms !important;
      }
      .reveal { opacity: 1; transform: none; }
    }
	
	 input.c1 {position:absolute;left:-9999px;opacity:0; display:none !important;}
	 
	 
	 .faq-container {
  max-width: 600px;
  margin: 20px auto;
  font-family: sans-serif;
}

details {
  border-bottom: 1px solid #ddd;
  padding: 10px 0;
}

summary {
  font-weight: bold;
  cursor: pointer;
  padding: 8px 0;
}