/* =========================================================
      BASE
    ========================================================= */
    *{box-sizing:border-box}
    html,body{height:100%}

    body{
      margin:0;
      font-family:"Montserrat", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
      color:var(--text);
      background:var(--bg);
      line-height:1.6;
    }

    a{color:inherit; text-decoration:none}
    img{max-width:100%; display:block}

    .container{
      max-width:var(--container);
      margin:0 auto;
      padding:0 22px;
    }

    .muted{color:var(--muted)}

    /* Global micro-motion + cursor */
    a, button, .btn{
      transition:
        color .15s ease,
        background-color .15s ease,
        border-color .15s ease,
        transform .12s ease,
        opacity .18s ease;
    }
    a, button{cursor:pointer}

    /* =========================================================
      ACCESSIBILITY
    ========================================================= */
    .btn:focus-visible{
      outline:3px solid rgba(75,91,115,.35);
      outline-offset:3px;
    }

    a:focus-visible{
      outline:3px solid rgba(75,91,115,.28);
      outline-offset:3px;
      border-radius:10px;
    }

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

            /* =========================================================
      COMPONENTS
    ========================================================= */
    .btn{
      display:inline-flex;
      align-items:center;
      justify-content:center;
      padding:12px 40px;
      border-radius:999px;
      border:1px solid var(--accent);
      background:var(--accent);
      color:var(--accentText);
      font-weight:600;
      letter-spacing:.02em;
      user-select:none;
      white-space:nowrap;
    }

    .btn:hover{
      opacity:.92;
      transform:translateY(-5px);
    }

    .btn:active{
      opacity:.95;
      transform:translateY(0);
    }

    .btn.secondary{
      background:transparent;
      color:var(--accent);
      border-color:var(--line);
    }

    /* Short centered separator */
    .rule{
      width:min(58vw, 760px);
      height:1px;
      background:var(--line);
      margin:40px auto;
    }

    /* =========================================================
      TWO-COLUMN SECTIONS
    ========================================================= */
    .section{padding:38px 0}

    .sectionGrid{
      display:grid;
      grid-template-columns:1fr 1.05fr;
      gap:44px;
      align-items:center;
    }

    .sectionGrid:not(:has(.sectionMedia)){
      grid-template-columns:1fr;
    }

    .kicker{
      margin:0 0 10px;
      font-size:12px;
      letter-spacing:.14em;
      text-transform:uppercase;
      color:var(--muted);
      font-weight:700;
    }

    h2{
      margin:0 0 12px;
      font-size:26px;
      letter-spacing:-.01em;
      line-height:1.25;
      font-weight:600;
      color:#243041;
    }

    .body{
      margin: 0 0 14px;
      color:var(--muted);
      max-width:70ch;
    }

    .list{
      margin:12px 0 0;
      padding-left:18px;
      color:var(--muted);
    }

    .list li{margin:6px 0}

    .media{
      border-radius:var(--radius);
      border:1px solid var(--line);
      background:var(--soft);
      min-height:280px;
      display:flex;
      align-items:center;
      justify-content:center;
      position:relative;
      overflow:hidden;
      box-shadow:
        0 1px 2px rgba(0,0,0,.04),
        0 12px 32px rgba(0,0,0,.06);
    }

    .media::after{
      content:"";
      position:absolute;
      inset:18px;
      border-radius:14px;
      border:1px dashed rgba(17,24,39,.18);
    }

    .media span{
      color:rgba(17,24,39,.45);
      font-weight:600;
    }

    .reverse .sectionText{order:2}
    .reverse .sectionMedia{order:1}

    /* =========================================================
      CENTERED SECTION
    ========================================================= */
    .sectionCenter{
      padding:56px 0;
      text-align:center;
    }

    .sectionCenter h2{
      margin:0;
      text-transform:uppercase;
      letter-spacing:.10em;
      font-size:22px;
      color:#4c5a70;
    }

    .sectionCenter .centerLead{
      margin:14px auto 0;
      max-width:92ch;
      color:var(--muted);
    }

    .sectionCenter .centerMedia{
      margin:34px auto 0;
      width:min(980px, 92%);
      border-radius:var(--radius);
      border:1px solid var(--line);
      background:var(--soft);
      min-height:420px;
      display:flex;
      align-items:center;
      justify-content:center;
      position:relative;
      overflow:hidden;
      box-shadow:
        0 1px 2px rgba(0,0,0,.04),
        0 12px 32px rgba(0,0,0,.06);
    }

    .sectionCenter .centerMedia::after{
      content:"";
      position:absolute;
      inset:18px;
      border-radius:14px;
      border:1px dashed rgba(17,24,39,.18);
    }

    .sectionCenter .centerMedia span{
      color:rgba(17,24,39,.45);
      font-weight:600;
    }

    .brand .custom-logo{
  height: 28px; /* header */
  width: auto;
  display: block;
}

.sectionMedia .sectionImg{
  width:100%;
  height:auto;
  display:block;
  border-radius:16px;
}