:root{
      --bg:#07111f;
      --bg-soft:#0b1728;
      --panel:rgba(255,255,255,.075);
      --panel-strong:rgba(255,255,255,.11);
      --text:#f5f7fb;
      --muted:#a9b5c7;
      --line:rgba(255,255,255,.12);
      --cyan:#35d5ff;
      --blue:#5588ff;
      --violet:#8f6bff;
      --green:#59f0b5;
      --shadow:0 24px 70px rgba(0,0,0,.35);
      --radius:24px;
      --max:1200px;
    }

    *{box-sizing:border-box}
    html{scroll-behavior:smooth}
    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 20% 15%, rgba(53,213,255,.16), transparent 30%),
        radial-gradient(circle at 80% 10%, rgba(143,107,255,.20), transparent 30%),
        radial-gradient(circle at 55% 75%, rgba(85,136,255,.13), transparent 33%),
        linear-gradient(180deg,#06101c 0%,#091626 48%,#07111f 100%);
      min-height:100vh;
      overflow-x:hidden;
    }

    body::before{
      content:"";
      position:fixed;
      inset:0;
      pointer-events:none;
      opacity:.28;
      background-image:
        linear-gradient(rgba(255,255,255,.025) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.025) 1px, transparent 1px);
      background-size:42px 42px;
      mask-image:linear-gradient(to bottom, black, transparent 90%);
    }

    a{color:inherit;text-decoration:none}
    img{max-width:100%}
    button,a{transition:.25s ease}

    .wrap{
      width:min(var(--max), calc(100% - 36px));
      margin:auto;
    }

    .nav{
      position:sticky;
      top:0;
      z-index:20;
      backdrop-filter:blur(18px);
      background:rgba(5,13,23,.68);
      border-bottom:1px solid var(--line);
    }

    .nav-inner{
      height:78px;
      display:flex;
      align-items:center;
      justify-content:space-between;
      gap:24px;
    }

    .logo{
      display:flex;
      align-items:center;
      gap:12px;
      font-weight:800;
      letter-spacing:.02em;
      font-size:1.18rem;
    }

    .logo-mark{
      width:38px;height:38px;
      display:grid;place-items:center;
      border-radius:12px;
      background:linear-gradient(135deg,var(--cyan),var(--violet));
      box-shadow:0 10px 35px rgba(53,213,255,.28);
      color:#04101a;
      font-weight:1000;
    }

    .logo em{
      font-style:normal;
      color:var(--cyan);
    }

    .nav-links{
      display:flex;
      align-items:center;
      gap:26px;
      color:var(--muted);
      font-size:.95rem;
    }

    .nav-links a:hover{color:white}
    .nav-cta{
      padding:11px 17px;
      border:1px solid var(--line);
      border-radius:999px;
      background:rgba(255,255,255,.06);
      color:white!important;
    }
    .nav-cta:hover{
      transform:translateY(-2px);
      background:rgba(255,255,255,.1);
    }

    .hero{
      min-height:calc(100vh - 78px);
      display:grid;
      grid-template-columns:1.12fr .88fr;
      align-items:center;
      gap:54px;
      padding:82px 0 70px;
      position:relative;
    }

    .eyebrow{
      display:inline-flex;
      align-items:center;
      gap:9px;
      padding:8px 12px;
      border:1px solid var(--line);
      background:rgba(255,255,255,.055);
      border-radius:999px;
      color:#d8e3ef;
      font-size:.86rem;
      margin-bottom:23px;
    }

    .dot{
      width:9px;height:9px;border-radius:50%;
      background:var(--green);
      box-shadow:0 0 18px var(--green);
    }

    h1{
      font-size:clamp(3.3rem,7.2vw,6.7rem);
      line-height:.92;
      letter-spacing:-.07em;
      margin:0 0 26px;
      max-width:900px;
    }

    h1 .gradient{
      display:block;
      background:linear-gradient(90deg,var(--cyan),#8edbff 36%,var(--violet) 76%,#d6c9ff);
      -webkit-background-clip:text;
      background-clip:text;
      color:transparent;
    }

    .lead{
      font-size:clamp(1.05rem,1.6vw,1.3rem);
      line-height:1.65;
      color:var(--muted);
      max-width:680px;
      margin:0 0 34px;
    }

    .actions{
      display:flex;
      gap:14px;
      flex-wrap:wrap;
    }

    .btn{
      display:inline-flex;
      justify-content:center;
      align-items:center;
      gap:10px;
      min-height:52px;
      padding:0 21px;
      border-radius:15px;
      font-weight:750;
      border:1px solid transparent;
    }

    .btn-primary{
      color:#04111c;
      background:linear-gradient(135deg,var(--cyan),#8edbff);
      box-shadow:0 14px 40px rgba(53,213,255,.24);
    }

    .btn-primary:hover{transform:translateY(-3px);box-shadow:0 18px 48px rgba(53,213,255,.34)}
    .btn-secondary{
      border-color:var(--line);
      background:rgba(255,255,255,.055);
      color:white;
    }
    .btn-secondary:hover{transform:translateY(-3px);background:rgba(255,255,255,.1)}

    .hero-visual{
      position:relative;
      min-height:520px;
      display:grid;
      place-items:center;
    }

    .orb{
      position:absolute;
      width:390px;height:390px;
      border-radius:50%;
      background:
        radial-gradient(circle at 35% 28%, rgba(255,255,255,.82), transparent 8%),
        radial-gradient(circle at 45% 42%, rgba(53,213,255,.76), transparent 24%),
        radial-gradient(circle at 68% 64%, rgba(143,107,255,.72), transparent 34%),
        radial-gradient(circle at 50% 50%, #18386d 0%, #08111e 72%);
      filter:saturate(1.2);
      box-shadow:
        inset -38px -45px 80px rgba(0,0,0,.42),
        0 0 90px rgba(85,136,255,.2);
    }

    .ring{
      position:absolute;
      width:510px;height:510px;
      border-radius:50%;
      border:1px solid rgba(255,255,255,.12);
      transform:rotateX(66deg) rotateZ(-8deg);
      box-shadow:0 0 70px rgba(53,213,255,.08);
    }
    .ring::after{
      content:"";
      position:absolute;inset:34px;
      border:1px dashed rgba(255,255,255,.11);
      border-radius:50%;
    }

    .tag{
      position:absolute;
      width:210px;
      aspect-ratio:1.55;
      border-radius:28px;
      padding:22px;
      background:linear-gradient(145deg,rgba(255,255,255,.18),rgba(255,255,255,.06));
      border:1px solid rgba(255,255,255,.22);
      backdrop-filter:blur(18px);
      box-shadow:var(--shadow);
      transform:rotate(-10deg) translate(-86px,20px);
      z-index:3;
    }

    .tag::before{
      content:"";
      position:absolute;
      top:22px;right:22px;
      width:24px;height:24px;border-radius:50%;
      background:#07111f;
      border:1px solid rgba(255,255,255,.22);
      box-shadow:inset 0 0 0 5px rgba(255,255,255,.08);
    }

    .tag-small{
      position:absolute;
      width:175px;
      aspect-ratio:1.45;
      border-radius:24px;
      padding:20px;
      background:linear-gradient(145deg,rgba(53,213,255,.22),rgba(143,107,255,.12));
      border:1px solid rgba(255,255,255,.2);
      backdrop-filter:blur(16px);
      box-shadow:var(--shadow);
      transform:rotate(11deg) translate(105px,-50px);
      z-index:2;
    }

    .mini-logo{
      font-weight:900;
      letter-spacing:.08em;
      font-size:.82rem;
      color:#eaf8ff;
    }

    .tag-title{
      margin-top:30px;
      font-size:1.45rem;
      font-weight:850;
      letter-spacing:-.03em;
    }

    .tag-sub{
      color:#c9d7e7;
      font-size:.78rem;
      margin-top:7px;
    }

    section{padding:92px 0}

    .section-head{
      display:flex;
      justify-content:space-between;
      align-items:end;
      gap:30px;
      margin-bottom:38px;
    }

    .section-kicker{
      color:var(--cyan);
      text-transform:uppercase;
      letter-spacing:.18em;
      font-size:.78rem;
      font-weight:800;
      margin-bottom:12px;
    }

    h2{
      font-size:clamp(2.15rem,4vw,4rem);
      line-height:1.03;
      letter-spacing:-.055em;
      margin:0;
    }

    .section-copy{
      max-width:520px;
      color:var(--muted);
      line-height:1.65;
      margin:0;
    }

    .brands{
      display:grid;
      grid-template-columns:repeat(4,1fr);
      gap:18px;
    }

    .brand-card{
      min-height:235px;
      border:1px solid var(--line);
      border-radius:var(--radius);
      background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.035));
      padding:26px;
      position:relative;
      overflow:hidden;
      box-shadow:0 16px 50px rgba(0,0,0,.16);
    }

    .brand-card::after{
      content:"";
      position:absolute;
      width:140px;height:140px;
      right:-50px;bottom:-50px;
      border-radius:50%;
      background:var(--glow,rgba(53,213,255,.22));
      filter:blur(20px);
    }

    .brand-card:hover{
      transform:translateY(-6px);
      border-color:rgba(255,255,255,.25);
      background:linear-gradient(145deg,rgba(255,255,255,.11),rgba(255,255,255,.045));
    }

    .brand-label{
      display:inline-block;
      font-size:.76rem;
      color:#c8d3e1;
      padding:7px 9px;
      border-radius:999px;
      border:1px solid var(--line);
    }

    .brand-name{
      font-size:1.65rem;
      font-weight:900;
      letter-spacing:-.04em;
      margin-top:44px;
    }

    .brand-desc{
      color:var(--muted);
      font-size:.92rem;
      line-height:1.5;
      max-width:210px;
      margin-top:8px;
    }

    .products-grid{
      display:grid;
      grid-template-columns:1.25fr .75fr .75fr;
      grid-template-rows:220px 220px;
      gap:18px;
    }

    .product-card{
      border:1px solid var(--line);
      border-radius:var(--radius);
      background:rgba(255,255,255,.055);
      padding:26px;
      position:relative;
      overflow:hidden;
      min-height:220px;
    }

    .product-card.large{grid-row:span 2}
    .product-card h3{
      margin:0;
      font-size:1.35rem;
      letter-spacing:-.03em;
    }

    .product-card p{
      color:var(--muted);
      line-height:1.55;
      margin:9px 0 0;
      max-width:300px;
    }

    .shape{
      position:absolute;
      border-radius:28px;
      border:1px solid rgba(255,255,255,.16);
      background:linear-gradient(145deg,rgba(255,255,255,.17),rgba(255,255,255,.04));
      box-shadow:0 20px 50px rgba(0,0,0,.22);
    }

    .large .shape.one{
      width:270px;height:180px;
      right:35px;bottom:38px;
      transform:rotate(-8deg);
    }

    .large .shape.two{
      width:155px;height:105px;
      right:120px;bottom:105px;
      transform:rotate(12deg);
      background:linear-gradient(145deg,rgba(53,213,255,.25),rgba(143,107,255,.15));
    }

    .small-shape{
      width:120px;height:80px;
      right:20px;bottom:18px;
      transform:rotate(-8deg);
    }

    .store{
      border:1px solid var(--line);
      border-radius:32px;
      padding:46px;
      background:
        radial-gradient(circle at 80% 20%, rgba(143,107,255,.22), transparent 28%),
        linear-gradient(135deg,rgba(53,213,255,.12),rgba(255,255,255,.05));
      display:grid;
      grid-template-columns:1fr auto;
      align-items:center;
      gap:35px;
      box-shadow:var(--shadow);
    }

    .store p{
      color:var(--muted);
      max-width:720px;
      line-height:1.65;
      margin:14px 0 0;
    }

    .pill{
      display:inline-flex;
      align-items:center;
      gap:8px;
      padding:11px 14px;
      border-radius:999px;
      background:rgba(89,240,181,.1);
      color:#a7ffd8;
      border:1px solid rgba(89,240,181,.25);
      white-space:nowrap;
      font-weight:750;
    }

    footer{
      border-top:1px solid var(--line);
      padding:32px 0 42px;
      color:var(--muted);
    }

    .footer-inner{
      display:flex;
      justify-content:space-between;
      gap:20px;
      flex-wrap:wrap;
      align-items:center;
    }

    .footer-links{display:flex;gap:18px;flex-wrap:wrap}
    .footer-links a:hover{color:white}

    @media (max-width:980px){
      .hero{grid-template-columns:1fr;padding-top:65px}
      .hero-visual{min-height:450px}
      .brands{grid-template-columns:repeat(2,1fr)}
      .products-grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
      .product-card.large{grid-column:span 2;grid-row:auto;min-height:390px}
      .store{grid-template-columns:1fr}
      .nav-links a:not(.nav-cta){display:none}
    }

    @media (max-width:620px){
      .wrap{width:min(var(--max), calc(100% - 24px))}
      .nav-inner{height:70px}
      .hero{min-height:auto;padding:58px 0 45px}
      h1{font-size:3.3rem}
      .hero-visual{min-height:360px}
      .orb{width:270px;height:270px}
      .ring{width:350px;height:350px}
      .tag{width:165px;transform:rotate(-9deg) translate(-58px,16px)}
      .tag-small{width:140px;transform:rotate(12deg) translate(72px,-38px)}
      .tag-title{font-size:1.05rem;margin-top:24px}
      section{padding:68px 0}
      .section-head{display:block}
      .section-copy{margin-top:18px}
      .brands{grid-template-columns:1fr}
      .products-grid{display:block}
      .product-card{margin-bottom:16px;min-height:250px}
      .product-card.large{min-height:365px}
      .large .shape.one{width:210px;height:140px;right:20px}
      .large .shape.two{width:125px;height:85px;right:85px}
      .store{padding:30px 24px}
      .actions{display:grid}
      .btn{width:100%}
    }


/* Podstrony marek */
.brand-card{
  display:block;
  color:inherit;
}
.brand-page{
  min-height:100vh;
}
.brand-hero{
  min-height:72vh;
  display:grid;
  grid-template-columns:1.05fr .95fr;
  align-items:center;
  gap:54px;
  padding:88px 0 70px;
}
.brand-back{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--cyan);
  font-weight:750;
  margin-bottom:26px;
}
.brand-hero h1{
  font-size:clamp(3.1rem,7vw,6.4rem);
}
.brand-symbol{
  min-height:430px;
  display:grid;
  place-items:center;
  position:relative;
}
.brand-symbol-card{
  width:min(390px,90%);
  aspect-ratio:1.35;
  border:1px solid rgba(255,255,255,.22);
  border-radius:38px;
  background:
    radial-gradient(circle at 70% 25%, var(--brand-glow), transparent 32%),
    linear-gradient(145deg,rgba(255,255,255,.15),rgba(255,255,255,.045));
  box-shadow:var(--shadow);
  display:grid;
  place-items:center;
  transform:rotate(-5deg);
}
.brand-symbol-card strong{
  font-size:clamp(2.3rem,6vw,4.8rem);
  letter-spacing:-.06em;
}
.brand-benefits{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:18px;
}
.brand-benefit{
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:27px;
  background:rgba(255,255,255,.055);
}
.brand-benefit h3{
  margin:0 0 10px;
  font-size:1.15rem;
}
.brand-benefit p{
  color:var(--muted);
  line-height:1.6;
  margin:0;
}
.brand-products{
  display:grid;
  grid-template-columns:repeat(2,1fr);
  gap:18px;
}
.brand-product{
  min-height:180px;
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:26px;
  background:linear-gradient(145deg,rgba(255,255,255,.075),rgba(255,255,255,.035));
}
.brand-product h3{margin:0 0 9px}
.brand-product p{margin:0;color:var(--muted);line-height:1.6}
.brand-cta{
  border:1px solid var(--line);
  border-radius:30px;
  padding:42px;
  background:
    radial-gradient(circle at 85% 20%, var(--brand-glow), transparent 30%),
    rgba(255,255,255,.055);
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
}
.brand-cta p{color:var(--muted);line-height:1.6;margin:10px 0 0}
@media (max-width:900px){
  .brand-hero{grid-template-columns:1fr}
  .brand-benefits{grid-template-columns:1fr}
  .brand-products{grid-template-columns:1fr}
  .brand-cta{display:block}
  .brand-cta .btn{margin-top:24px}
}

/* Profesjonalny formularz kontaktowy */
.nav-cta.active{
  color:#06111c!important;
  background:linear-gradient(135deg,var(--cyan),#9ee5ff);
  border-color:transparent;
  box-shadow:0 10px 30px rgba(53,213,255,.22);
}

.contact-page{
  min-height:100vh;
}

.contact-hero{
  position:relative;
  padding:82px 0 46px;
  overflow:hidden;
}

.contact-hero::after{
  content:"";
  position:absolute;
  width:520px;
  height:520px;
  right:-170px;
  top:-230px;
  border-radius:50%;
  background:radial-gradient(circle,rgba(53,213,255,.16),transparent 67%);
  pointer-events:none;
}

.contact-hero h1{
  max-width:900px;
}

.contact-hero .lead{
  max-width:720px;
  margin-bottom:0;
}

.contact-section{
  padding:28px 0 110px;
}

.contact-layout{
  display:grid;
  grid-template-columns:minmax(300px,.78fr) minmax(560px,1.32fr);
  gap:26px;
  align-items:stretch;
}

.contact-sidebar{
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:20px;
  min-width:0;
}

.contact-sidebar-main,
.contact-security-note{
  position:relative;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.13);
  box-shadow:0 24px 75px rgba(0,0,0,.22);
}

.contact-sidebar-main{
  flex:1;
  border-radius:30px;
  padding:34px;
  background:
    radial-gradient(circle at 12% 10%,rgba(53,213,255,.16),transparent 32%),
    radial-gradient(circle at 88% 88%,rgba(143,107,255,.18),transparent 35%),
    linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.035));
}

.contact-sidebar-main::after{
  content:"";
  position:absolute;
  width:180px;
  height:180px;
  right:-80px;
  top:-75px;
  border-radius:50%;
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 0 0 34px rgba(255,255,255,.025),0 0 0 68px rgba(255,255,255,.018);
  pointer-events:none;
}

.contact-sidebar-badge{
  display:inline-flex;
  align-items:center;
  gap:9px;
  padding:8px 12px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(3,11,20,.34);
  color:#dce8f5;
  font-size:.79rem;
  font-weight:750;
  letter-spacing:.02em;
}

.contact-sidebar-badge-dot{
  width:8px;
  height:8px;
  border-radius:50%;
  background:var(--green);
  box-shadow:0 0 15px rgba(89,240,181,.8);
}

.contact-sidebar h2{
  margin:30px 0 14px;
  max-width:440px;
  font-size:clamp(2rem,3vw,3.15rem);
  line-height:1.02;
  letter-spacing:-.05em;
}

.contact-sidebar-lead{
  margin:0;
  color:var(--muted);
  line-height:1.72;
}

.contact-email-card{
  display:grid;
  grid-template-columns:auto 1fr auto;
  align-items:center;
  gap:14px;
  margin:30px 0;
  padding:16px;
  border:1px solid rgba(255,255,255,.14);
  border-radius:20px;
  background:rgba(2,9,17,.42);
}

.contact-email-card:hover{
  transform:translateY(-3px);
  border-color:rgba(53,213,255,.38);
  background:rgba(6,20,35,.62);
}

.contact-icon,
.contact-security-icon,
.consent-panel-icon{
  display:grid;
  place-items:center;
  flex:0 0 auto;
}

.contact-icon{
  width:44px;
  height:44px;
  border-radius:14px;
  background:linear-gradient(135deg,rgba(53,213,255,.22),rgba(143,107,255,.22));
  border:1px solid rgba(255,255,255,.13);
}

.contact-icon svg,
.contact-security-icon svg,
.consent-panel-icon svg,
.contact-form-symbol svg,
.form-control-icon svg{
  width:21px;
  height:21px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.contact-email-card small,
.contact-email-card strong{
  display:block;
}

.contact-email-card small{
  color:var(--muted);
  font-size:.77rem;
  margin-bottom:4px;
}

.contact-email-card strong{
  font-size:1.02rem;
  overflow-wrap:anywhere;
}

.contact-email-arrow{
  color:var(--cyan);
  font-size:1.35rem;
}

.contact-topic-list{
  display:grid;
  gap:4px;
}

.contact-topic-item{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:13px;
  padding:17px 0;
  border-top:1px solid rgba(255,255,255,.09);
}

.contact-topic-number{
  color:var(--cyan);
  font-size:.75rem;
  font-weight:900;
  letter-spacing:.12em;
}

.contact-topic-item strong,
.contact-topic-item small{
  display:block;
}

.contact-topic-item strong{
  font-size:.95rem;
}

.contact-topic-item small{
  margin-top:5px;
  color:var(--muted);
  font-size:.82rem;
  line-height:1.5;
}

.contact-security-note{
  display:flex;
  align-items:center;
  gap:13px;
  border-radius:22px;
  padding:17px 19px;
  background:rgba(89,240,181,.07);
  border-color:rgba(89,240,181,.18);
}

.contact-security-icon{
  width:38px;
  height:38px;
  border-radius:12px;
  color:#9affd3;
  background:rgba(89,240,181,.1);
}

.contact-security-note strong,
.contact-security-note small{
  display:block;
}

.contact-security-note strong{
  color:#d8ffed;
  font-size:.88rem;
}

.contact-security-note small{
  color:#93b7a7;
  margin-top:3px;
  line-height:1.4;
}

.contact-form-card{
  position:relative;
  min-width:0;
  border-radius:30px;
  padding:38px;
  color:#172337;
  background:
    radial-gradient(circle at 100% 0,rgba(53,213,255,.12),transparent 28%),
    linear-gradient(180deg,#ffffff 0%,#f4f8fc 100%);
  border:1px solid rgba(255,255,255,.72);
  box-shadow:0 28px 90px rgba(0,0,0,.32);
}

.contact-form-card::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius:inherit;
  pointer-events:none;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.9);
}

.contact-form-header{
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:24px;
  padding-bottom:27px;
  margin-bottom:27px;
  border-bottom:1px solid #dde6ef;
}

.contact-form-kicker{
  color:#557086;
  text-transform:uppercase;
  letter-spacing:.15em;
  font-size:.7rem;
  font-weight:850;
  margin-bottom:9px;
}

.contact-form-header h2{
  margin:0;
  color:#101c2d;
  font-size:clamp(2rem,3vw,2.75rem);
  letter-spacing:-.045em;
}

.contact-form-header p{
  margin:9px 0 0;
  color:#66778b;
  line-height:1.55;
  font-size:.91rem;
}

.contact-form-header p span{
  color:#087b9e;
  font-weight:900;
}

.contact-form-symbol{
  display:grid;
  place-items:center;
  width:54px;
  height:54px;
  flex:0 0 auto;
  border-radius:17px;
  color:#0b7697;
  background:linear-gradient(135deg,#dff8ff,#eee9ff);
  border:1px solid #d7e6ef;
}

.contact-form-symbol svg{
  width:26px;
  height:26px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
}

.form-field{
  min-width:0;
  margin-bottom:20px;
}

.form-field label{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin-bottom:9px;
  color:#25354a;
  font-size:.82rem;
  font-weight:800;
}

.required-mark{
  color:#0780a5;
  font-size:.95rem;
}

.optional-mark{
  color:#8492a3;
  font-size:.69rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.form-control{
  position:relative;
}

.form-control-icon{
  position:absolute;
  left:15px;
  top:50%;
  transform:translateY(-50%);
  z-index:2;
  display:grid;
  place-items:center;
  color:#7b8ca0;
  pointer-events:none;
}

.form-control-icon-top{
  top:17px;
  transform:none;
}

.form-control input,
.form-control textarea{
  width:100%;
  color:#152235;
  background:#fff;
  border:1px solid #ced9e4;
  border-radius:14px;
  outline:none;
  font:inherit;
  transition:border-color .2s ease,box-shadow .2s ease,background .2s ease;
}

.form-control input{
  height:53px;
  padding:0 15px 0 46px;
}

.form-control textarea{
  min-height:190px;
  padding:15px 15px 15px 46px;
  resize:vertical;
  line-height:1.58;
}

.form-control input::placeholder,
.form-control textarea::placeholder{
  color:#99a6b4;
}

.form-control input:hover,
.form-control textarea:hover{
  border-color:#b9c9d8;
}

.form-control input:focus,
.form-control textarea:focus{
  border-color:#14a9d0;
  box-shadow:0 0 0 4px rgba(20,169,208,.12);
  background:#fff;
}

.form-control:focus-within .form-control-icon{
  color:#0780a5;
}

.form-field-help{
  margin-top:7px;
  color:#8a98a8;
  font-size:.74rem;
  text-align:right;
}

.consent-panel{
  margin-top:4px;
  padding:20px;
  border:1px solid #dbe4ed;
  border-radius:18px;
  background:#f7fafc;
}

.consent-panel-title{
  display:flex;
  align-items:center;
  gap:10px;
  color:#314156;
  font-size:.78rem;
  font-weight:850;
  text-transform:uppercase;
  letter-spacing:.08em;
  margin-bottom:15px;
}

.consent-panel-icon{
  width:30px;
  height:30px;
  border-radius:10px;
  color:#087b9e;
  background:#e3f8fd;
}

.checkbox-field{
  position:relative;
  display:grid;
  grid-template-columns:22px 1fr;
  gap:11px;
  align-items:start;
  margin:0;
  padding:12px 0;
  color:#5d6c7e;
  font-size:.82rem;
  line-height:1.55;
  cursor:pointer;
}

.checkbox-field + .checkbox-field{
  border-top:1px solid #e1e8ef;
}

.checkbox-field input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.checkbox-custom{
  position:relative;
  width:20px;
  height:20px;
  margin-top:1px;
  border:1.5px solid #aebdca;
  border-radius:6px;
  background:#fff;
  transition:.2s ease;
}

.checkbox-field:hover .checkbox-custom{
  border-color:#1ba8cd;
}

.checkbox-field input:focus-visible + .checkbox-custom{
  box-shadow:0 0 0 4px rgba(20,169,208,.14);
}

.checkbox-field input:checked + .checkbox-custom{
  border-color:#0c9fc7;
  background:linear-gradient(135deg,#12b9df,#597dff);
}

.checkbox-field input:checked + .checkbox-custom::after{
  content:"";
  position:absolute;
  left:6px;
  top:2px;
  width:5px;
  height:10px;
  border:solid #fff;
  border-width:0 2px 2px 0;
  transform:rotate(45deg);
}

.checkbox-copy b{
  color:#0780a5;
}

.checkbox-copy a{
  color:#087b9e;
  font-weight:800;
  text-decoration:none;
  border-bottom:1px solid rgba(8,123,158,.3);
}

.checkbox-copy a:hover{
  border-color:#087b9e;
}

.form-actions{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:22px;
  margin-top:24px;
}

.form-submit{
  min-width:235px;
  min-height:55px;
  border:0;
  border-radius:15px;
  cursor:pointer;
  font:inherit;
  font-weight:850;
  box-shadow:0 14px 32px rgba(34,163,204,.28);
}

.form-submit-arrow{
  font-size:1.2rem;
}

.form-submit:hover{
  transform:translateY(-2px);
  box-shadow:0 18px 38px rgba(34,163,204,.34);
}

.form-actions-note{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  color:#7d8b9a;
  font-size:.74rem;
  text-align:right;
  line-height:1.4;
}

.form-alert{
  display:grid;
  grid-template-columns:36px 1fr;
  gap:13px;
  align-items:start;
  border-radius:15px;
  padding:16px;
  margin-bottom:24px;
  line-height:1.5;
}

.form-alert-icon{
  display:grid;
  place-items:center;
  width:34px;
  height:34px;
  border-radius:11px;
  font-weight:950;
}

.form-alert strong,
.form-alert small{
  display:block;
}

.form-alert small{
  margin-top:3px;
}

.form-success{
  color:#175c45;
  border:1px solid #b8e9d7;
  background:#edf9f4;
}

.form-success .form-alert-icon{
  color:#176548;
  background:#c9f0e0;
}

.form-error{
  color:#7c2e39;
  border:1px solid #f0c5ca;
  background:#fff1f2;
}

.form-error .form-alert-icon{
  color:#842d39;
  background:#ffd9dd;
}

.form-error ul{
  margin:7px 0 0;
  padding-left:18px;
}

.hp-field{
  position:absolute!important;
  width:1px!important;
  height:1px!important;
  overflow:hidden!important;
  clip:rect(0,0,0,0)!important;
  white-space:nowrap!important;
}

@media (max-width:1050px){
  .contact-layout{
    grid-template-columns:1fr;
  }

  .contact-sidebar{
    display:grid;
    grid-template-columns:1fr;
  }
}

@media (max-width:700px){
  .contact-hero{
    padding:58px 0 32px;
  }

  .contact-section{
    padding-top:16px;
  }

  .contact-sidebar-main{
    padding:27px 23px;
  }

  .contact-form-card{
    padding:27px 22px;
  }

  .contact-form-header{
    gap:15px;
  }

  .contact-form-symbol{
    width:46px;
    height:46px;
    border-radius:14px;
  }

  .form-grid{
    grid-template-columns:1fr;
    gap:0;
  }

  .form-actions{
    display:block;
  }

  .form-submit{
    width:100%;
  }

  .form-actions-note{
    justify-content:center;
    margin-top:13px;
    text-align:center;
  }
}

@media (max-width:430px){
  .contact-sidebar h2{
    font-size:2rem;
  }

  .contact-email-card{
    grid-template-columns:auto 1fr;
  }

  .contact-email-arrow{
    display:none;
  }

  .contact-form-card{
    padding:23px 16px;
    border-radius:24px;
  }

  .contact-form-header{
    display:block;
  }

  .contact-form-symbol{
    margin-top:16px;
  }

  .consent-panel{
    padding:16px;
  }
}