:root {
    --ink: #0f2438;
    --side: #23438f;
    --side-2: #23438f;
    --paper: #fbf9f5;
    --card: #ffffff;
    --text: #2a3a4c;
    --muted: #667587;
    --line: #d9dfe7;
    --accent: #0f8f86;
    --cta: #e2412f;
    --cta-d: #bf3222;
    --err: #c62828;

    --serif: "Montserrat", sans-serif;
    --sans: "Montserrat", "Segoe UI", system-ui, sans-serif;
}
  *{box-sizing:border-box}
  body{font-family: 'Montserrat', sans-serif;margin:0;background:var(--paper);color:var(--text);font:400 1rem/1.55 var(--sans);-webkit-text-size-adjust:100%}
  a{color:inherit;text-decoration:none}
  :focus-visible{outline:3px solid var(--accent);outline-offset:2px}

  .page{display:grid;grid-template-columns:minmax(300px,4fr) minmax(0,8fr);min-height:100vh}

  /* ---------- Sidebar ---------- */
  .side{
    background:linear-gradient(170deg,var(--side),var(--side-2));color:#dbe6f1;
    padding:clamp(1.75rem,3.5vw,3rem);
    position:sticky;
    top:0;
    height:100vh;
    display:flex;
    flex-direction:column;
    gap:1rem;
    overflow:auto;
  }
  .logo {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    min-width: 0;
    flex-wrap: nowrap;
}

.logo img {
    max-width: 100%;
    height: auto;
    object-fit: contain;
}

/* Tablet */
@media (max-width: 768px) {
    .logo {
        gap: 0.5rem;
    }
}

/* Mobile */
@media (max-width: 480px) {
    .logo {
        gap: 0.35rem;
        flex-wrap: wrap;
    }

    .logo img {
        max-width: 100%;
    }
}
   
   
  .side h1 {
    margin: auto 0 0;
    font-size: 38px;
    font-weight: bold;
    color: #fff;
    letter-spacing: -0.01em;
}
  .side .lead{margin:.9rem 0 0;color:#a9bccf;max-width:32ch}
  .contact{display:grid;gap:1.1rem;padding-top:1.5rem;border-top:1px solid rgba(255,255,255,.15)}
  .c{display:flex;gap:.85rem;align-items:flex-start}
  .c .ico{flex:none;width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.12);display:grid;place-items:center;color:#fff}
  .c svg{width:18px;height:18px}
  .c h2{margin:0 0 .1rem;font:700 .78rem var(--sans);letter-spacing:.04em;color:#7fd3cb}
  .c p{margin:0;font-size:.95rem;line-height:1.45;color:#dbe6f1}
  .c a:hover{color:#fff;text-decoration:underline}

  /* ---------- Form area ---------- */
  .main{
      padding:clamp(1.5rem,2vw,4.5rem) clamp(1rem,5vw,4.5rem);
      display:flex;
      justify-content:center
      
  }
  .sheet{width:min(760px,100%)}
  .sheet > h2{margin:0 0 .35rem;font:700 clamp(1.6rem,3vw,2.2rem)/1.15 var(--serif);color:var(--ink)}
  .sheet > p{margin:0 0 2rem;color:var(--muted)}

  fieldset{border:0;margin:0 0 2.25rem;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:1.4rem 1.6rem}
  legend{
      float:left;
      width:100%;
      margin: 0 0 -0.8rem;
    padding: 0 0 0.6rem;
      border-bottom:2px solid var(--ink);
      font:700 1.15rem var(--serif);
      color:var(--ink)
      
  }
  legend + *{clear:both}
  .full{grid-column:1 / -1}

  label.lab{display:block;margin-bottom:.15rem;font-weight:600;font-size:.84rem;color:var(--muted)}
  .field{
    width:100%;height:50px;padding:0 .9rem;border:1.5px solid #8fa1b8;border-radius:8px;
    background:#fff;font:500 1.05rem var(--sans);color:var(--ink);transition:border-color .2s,box-shadow .2s;
  }
  .field::placeholder{color:#a3afbd;font-weight:400}
  .field:hover:not(.error):not(.valid):not(:focus){border-color:var(--ink)}
  .field:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 4px rgba(15,143,134,.18)}
  select.field{appearance:none;-webkit-appearance:none;cursor:pointer;padding-right:2.4rem;
    background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23667587' stroke-width='2'/%3E%3C/svg%3E") no-repeat right .9rem center}
  .phone{display:grid;grid-template-columns:96px 1fr;gap:.5rem}

  .field.error{border-color:var(--err);background-color:#fff7f7}
  .field.valid{border-color:var(--accent)}
  label.error{display:block;margin-top:.3rem;font-size:.8rem;font-weight:600;color:var(--err)}

  .cap{display:flex;align-items:center;justify-content:space-between;height:50px;padding:0 .9rem;border:1.5px solid #8fa1b8;border-radius:8px;background:#fff}
  .cap-code{font:700 1.45rem/1 "Courier New",monospace;letter-spacing:.14em;color:var(--ink);user-select:none;
    background:repeating-linear-gradient(115deg,transparent 0 8px,rgba(15,143,134,.14) 8px 10px);padding:.1rem .4rem}
  .cap button{border:0;background:none;cursor:pointer;color:var(--ink);display:grid;place-items:center;padding:.2rem}
  .cap svg{width:20px;height:20px}

  .consent{display:flex;gap:.65rem;align-items:flex-start;font-size:.92rem;color:var(--muted)}
  .consent input{flex:none;width:18px;height:18px;margin-top:.2rem;accent-color:var(--accent)}

  .send{height:54px;border:0;border-radius:6px;background:var(--cta);color:#fff;font:700 1.05rem var(--sans);cursor:pointer;transition:background .2s}
  .send:hover{background:var(--cta-d)}

  /* ---------- Responsive ---------- */
  @media (max-width:980px){
    .page{grid-template-columns:1fr}
    .side{position:static;height:auto;overflow:visible;gap:1.5rem}
    .side h1{margin-top:.5rem}
    .contact{grid-template-columns:1fr 1fr}
  }
  @media (max-width:640px){
    .contact{grid-template-columns:1fr}
    fieldset{grid-template-columns:1fr;gap:1.2rem}
    .main{padding-top:2rem}
  }
  @media (max-width:420px){.field{font-size:16px}}
  
  .brochure{
    display:inline-flex;align-items:center;justify-content:center;gap:.65rem;margin-top:1.5rem;
    padding:.95rem 1.5rem;border-radius:8px;background:#fff;color:var(--ink);
    font:700 1rem var(--sans);border:2px solid #fff;transition:background .2s,color .2s,transform .15s;
  }
  .brochure svg{width:20px;height:20px;flex:none}
  .brochure:hover{background:transparent;color:#fff}
  .brochure:active{transform:scale(.98)}
  .logo {
        display: flex;
        align-items: center;
        justify-content: space-between;
        gap: 15px;
        width: 100%;
    }
    
    .logo img {
        display: block;
        width: auto;
        max-width: 55%;
        height: 78px;
        object-fit: contain;
    }
    
    /* Mobile */
    @media (max-width: 480px) {
        .logo {
            flex-direction: column;
            align-items: center;
            gap: 12px;
            width: 100%;
        }
    
        .logo img {
            width: 90%;
            max-width: 90%;
            height: auto;
            object-fit: contain;
        }
    }
    @media (max-width: 576px) {
    .application-heading h1 {
        text-align: center;
        width: 100%;
    }
}
.error{
    color:red !important;
}

.btn-download {
    background-color: #12305f;
    color: #fff;
    border: none;
    padding: 10px 22px;
    border-radius: 6px;
    font-weight: 600;
}

.btn-download:hover {
    background-color: #0b2145;
    color: #fff;
}