:root{
  --text: #0b1220;
  --muted: rgba(11,18,32,.72);

  /* frosted panel */
  --panel-bg: rgba(255,255,255,.72);
  --panel-border: rgba(255,255,255,.30);
  --panel-shadow: 0 16px 50px rgba(0,0,0,.18);

  /* form fields */
  --field-bg: rgba(255,255,255,.94);
  --field-border: rgba(11,18,32,.14);
  --focus: rgba(58,128,255,.30);

  /* button */
  --btn1: #2d78ff;
  --btn2: #165cdc;
  --btn-shadow: 0 12px 28px rgba(22,92,220,.30);

  /* =========================
     🎛️ LOGO CONTROLS
     ========================= */
  --logo-scale: 2;    /* 2× size */
  --logo-x: 0px;      /* move left/right */
  --logo-y: 0px;      /* move up/down */
}

*{ box-sizing:border-box; }
html, body { height:100%; }

body{
  margin:0;
  font-family: system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  color: var(--text);
}

/* ===== Background ===== */
.hero{
  min-height: 100vh;
  position: relative;
  overflow: hidden;
}

.hero__bg{
  position: absolute;
  inset: 0;
  background-image: url("winter-bg.png");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  filter: saturate(1.02) contrast(1.02);
  transform: scale(1.01);
}

.hero__container{
  position: relative;
  z-index: 1;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  gap: 14px;
}

/* ===== Panel ===== */
.panel{
  width: min(920px, 100%);
  border-radius: 20px;
  border: 1px solid var(--panel-border);
  background: var(--panel-bg);
  backdrop-filter: blur(14px);
  box-shadow: var(--panel-shadow);
  overflow: hidden;
}

/* =========================
   LOGO BANNER
   (white box removed)
   ========================= */
.site-banner{
  margin: 32px 22px 26px;

  height: 200px;
  padding: 0 10px;

  /* removed the frosted white box look */
  background: transparent;
  border: 0;
  box-shadow: none;

  /* keep everything else the same */
  border-radius: 16px;
  overflow: hidden;

  display: flex;
  align-items: center;
  justify-content: center;
}

.site-banner img{
  max-width: 100%;
  max-height: 100%;
  width: auto;
  height: auto;

  transform:
    translate(var(--logo-x), var(--logo-y))
    scale(var(--logo-scale));

  transform-origin: center;
  object-fit: contain;
}

/* Mobile */
@media (max-width: 760px){
  .site-banner{
    margin: 14px 16px 10px;
    height: 150px;
    padding: 0 10px;

    background: transparent;
    border: 0;
    box-shadow: none;

    border-radius: 14px;
  }
}

/* ===== Form ===== */
.panel__form{
  padding: 22px 22px 36px;
}

.grid{
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}

label{
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 14px;
  color: rgba(11,18,32,.88);
}

.req{ color:#b00020; }

input, select, textarea{
  padding: 11px 12px;
  border-radius: 12px;
  border: 1px solid var(--field-border);
  background: var(--field-bg);
  font-size: 16px;
  outline: none;
}

textarea{ resize: vertical; }

input:focus, select:focus, textarea:focus{
  border-color: rgba(58,128,255,.55);
  box-shadow: 0 0 0 4px var(--focus);
}

.full{ grid-column: 1 / -1; }

/* ===== Footer row ===== */
.panel__footer{
  margin-top: 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.price__label{
  font-size: 12px;
  color: var(--muted);
}

.price__value{
  font-size: 26px;
  font-weight: 800;
}

.price__hint{
  font-size: 12px;
  color: var(--muted);
  min-height: 16px;
}

.btn{
  border: 0;
  border-radius: 14px;
  padding: 14px 18px;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
  color: #fff;
  background: linear-gradient(180deg, var(--btn1), var(--btn2));
  box-shadow: var(--btn-shadow);
}

.btn:disabled{
  opacity: .65;
  cursor: not-allowed;
  box-shadow: none;
}

/* Messages */
.msg{
  margin-top: 10px;
  font-size: 14px;
  min-height: 18px;
  text-align: center;
}

.msg.ok{ color:#0a7b2b; }
.msg.err{ color:#b00020; }

/* Footer */
.site-footer{
  color: rgba(255,255,255,.92);
  text-shadow: 0 2px 12px rgba(0,0,0,.22);
  text-align: center;
}

/* Mobile layout */
@media (max-width: 760px){
  .panel__form{ padding: 12px 16px 16px; }
  .grid{ grid-template-columns: 1fr; }

  .panel__footer{
    flex-direction: column;
    align-items: stretch;
  }

  .btn{ width: 100%; }
}