*{box-sizing:border-box;}

    body{
      margin:0;
      font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
    }

    .hero{
      background:linear-gradient(180deg,#f0f5ff 0%,#ffffff 100%);
      padding:72px 0 56px;
      width:100%;
    }
    .hero .wrap{
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:40px;
      align-items:stretch;
      max-width:1300px;
      margin:0 auto;
      padding:0 60px;
    }
    .hero-left{
      display:flex;
      flex-direction:column;
      justify-content:space-between;
    }
    .hero-maincopy p{
      color:var(--muted);
      font-size:1.05rem;
      margin:0 0 12px;
    }

    .hero-notes{
      margin:16px 0 24px;
      padding-left:1.2rem;
      color:var(--muted);
      font-size:.95rem;
      line-height:1.45;
    }
    .hero-notes li{margin-bottom:8px;}
    .hero-notes li::marker{content:"§ ";color:#0072C6;font-weight:bold;}

    .hero-ctas{
      margin-top:auto;
      display:flex;
      flex-wrap:wrap;
      gap:14px;
    }

    .hero .card{
      background:#fff;
      border:1px solid var(--line);
      border-radius:var(--radius);
      padding:22px;
      box-shadow:var(--shadow);
      display:flex;
      flex-direction:column;
      justify-content:space-between;
    }

    .breadcrumbs .container{
      max-width:1300px;
      margin:0 auto;
      padding:12px 60px;
    }
    .breadcrumbs .sep{
      margin:0 8px;
      color:var(--muted);
    }

    .pricing-divider{
      height:1px;
      background:var(--line);
      margin-top:40px;
      margin-bottom:0;
    }

    .pricing-teaser{
      padding:80px 60px 60px;
      max-width:1300px;
      margin:0 auto;
    }
    .pricing-teaser h2{
      font-size:2rem;
      margin-bottom:24px;
    }
    .pricing-teaser p{
      line-height:1.6;
    }

    .table-wrapper{
      width:100%;
      overflow-x:auto;
      -webkit-overflow-scrolling:touch;
      margin:20px 0;
    }

    table{
      width:100%;
      border-collapse:collapse;
      border-radius:8px;
      overflow:hidden;
      font-size:0.95rem;
      min-width:640px;
    }
    table th,
    table td{
      padding:14px;
      border:1px solid var(--line);
      vertical-align:top;
    }
    table th{
      background:#f7f9fc;
      font-weight:600;
      text-align:left;
    }
    table td{
      background:#fff;
    }

    .grid{
      display:grid;
      grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
      gap:28px;
    }

    .info-box{
      background:#f7f9fc;
      border:1px solid var(--line);
      border-radius:12px;
      padding:18px 20px;
      font-size:0.95rem;
      margin-top:24px;
    }

    .contact{
      max-width:1300px;
      margin:0 auto;
      padding:80px 60px;
      display:grid;
      grid-template-columns:1.1fr .9fr;
      gap:60px;
    }
    .contact .panel{
      background:#fff;
      border:1px solid var(--line);
      border-radius:16px;
      padding:32px 36px;
      box-shadow:var(--shadow);
    }
    .contact h2{
      font-size:1.7rem;
      margin-top:0;
    }
    .contact label{
      display:block;
      font-weight:600;
      margin:8px 0 6px;
    }
    .contact input,
    .contact select,
    .contact textarea{
      width:100%;
      padding:12px;
      border:1px solid var(--line);
      border-radius:10px;
      font-size:1rem;
      margin-bottom:10px;
    }
    .contact button{
      margin-top:14px;
      background:#0072C6;
      color:#fff;
      border:none;
      padding:14px 22px;
      font-weight:600;
      border-radius:10px;
      cursor:pointer;
    }
    .contact button:hover{
      background:#0058a1;
      transform:translateY(-1px);
    }
    .alt-contact{
      margin-top:24px;
      padding-top:18px;
      border-top:1px solid var(--line);
      font-size:0.95rem;
    }

    .faq{
      background:var(--surface);
      border-radius:16px;
      border:1px solid var(--line);
      padding:32px;
      box-shadow:var(--shadow-sm);
    }
    .faq h2{
      margin-top:0;
      margin-bottom:18px;
      font-size:1.6rem;
      color:var(--ink);
    }
    .faq details{
      background:#fff;
      border:1px solid var(--line);
      border-radius:10px;
      padding:14px 16px;
      margin-bottom:12px;
    }
    .faq summary{
      font-weight:600;
      cursor:pointer;
      list-style:none;
    }
    .faq summary::-webkit-details-marker{
      display:none;
    }
    .faq p{
      color:var(--muted);
      margin-top:10px;
      font-size:0.95rem;
    }
    .faq details[open]{
      border-color:var(--brand);
    }

    /* RESPONSIVE ADJUSTMENTS */

    @media(max-width:1100px){
      .hero .wrap,
      .breadcrumbs .container,
      .pricing-teaser,
      .contact{
        padding:0 24px;
      }
      .contact{
        padding-top:60px;
        padding-bottom:60px;
      }
    }

    @media(max-width:768px){
      .hero{
        padding:56px 0 40px;
      }
      .hero .wrap{
        grid-template-columns:1fr;
        gap:28px;
        padding:0 18px;
      }
      .hero-maincopy h1{
        font-size:1.7rem;
        line-height:1.25;
      }
      .hero-maincopy p{
        font-size:0.98rem;
      }
      .hero-ctas{
        margin-top:18px;
      }
      .hero .card{
        margin-top:8px;
      }

      .breadcrumbs .container{
        padding:10px 18px;
        font-size:0.9rem;
      }

      .pricing-teaser{
        padding:52px 18px 40px;
      }
      .pricing-teaser h2{
        font-size:1.55rem;
      }

      .contact{
        grid-template-columns:1fr;
        gap:32px;
        padding:52px 18px 56px;
      }

      .faq{
        padding:24px 20px;
      }
    }

    @media(max-width:480px){
      .hero-maincopy h1{
        font-size:1.5rem;
      }
      .hero-notes{
        font-size:0.9rem;
      }
      table{
        font-size:0.9rem;
        min-width:520px;
      }
    }
