:root{--primary:#C9977C;--accent:#C9977C;--light:#E8C4A8;--dark:#434343;--muted:var(--dark)}
*{box-sizing:border-box;font-family:Segoe UI,Roboto,Arial,sans-serif}
body{margin:0;padding-top:180px;color:#C9977C;line-height:1.6;background:#F5F3F0}
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  background: #434343 !important;
  background-color: #434343 !important;
  color: #fff;
  padding: 12px 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.2);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  z-index: 1000;
  transition: padding 0.3s ease;
  overflow: hidden;
}

header.shrink {
  padding: 6px 12px;
}

header > * {
  transition: all 0.3s ease;
}

header img {
  height: 100px;
  display: block;
  max-height: 100px;
  margin-bottom: 4px;
}

header.shrink img {
  height: 50px;
  max-height: 50px;
  margin-bottom: 2px;
}

header nav {
  width: 100%;
  margin: 0;
  padding: 8px 0;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0,0,0,0.05);
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
}

header h1{margin:0;font-size:1.8rem;font-weight:600;color:#C9977C}
header p{margin:4px 0 0 0;opacity:0.92;font-size:0.95rem}
main{padding:24px;margin-top:0;max-width:920px;margin:0 auto}
section{margin-bottom:32px;background:#fff;padding:20px;border-radius:6px;box-shadow:0 1px 3px rgba(0,0,0,0.12)}
section h2{color:var(--primary);margin-top:0;font-size:1.3rem;border-bottom:3px solid var(--accent);padding-bottom:8px}
label{display:block;margin:12px 0 4px 0;color:var(--dark);font-weight:500;font-size:0.9rem}
input,select,textarea{width:100%;padding:10px;border:2px solid #D4A574;border-radius:4px;font-size:1rem;transition:border-color 0.2s}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--accent);background-color:#F5EBE0}
button{background:linear-gradient(135deg, var(--accent) 0%, #A67C59 100%);color:#fff;border:0;padding:11px 20px;border-radius:4px;cursor:pointer;font-weight:600;transition:transform 0.1s,box-shadow 0.2s}
button:hover{transform:translateY(-2px);box-shadow:0 4px 12px rgba(201,151,124,0.4)}
button:active{transform:translateY(0)}
.msg{margin-top:12px;color:#C9977C;font-weight:500;padding:8px;background:#F5EBE0;border-left:4px solid var(--accent);border-radius:2px}
#pricing-list table{width:100%;border-collapse:collapse}
#pricing-list th{background:var(--accent);color:#fff;padding:12px;text-align:left;font-weight:600}
#pricing-list td{padding:12px;border-bottom:1px solid #DDD4C8}
#pricing-list tr:hover{background:#F5EBE0}

@media (max-width: 900px) {
  body {
    padding-top: 180px;
  }
}

@media (max-width: 768px) {
  body {
    padding-top: 160px;
  }
  header {
    padding: 6px 12px;
  }
  header nav {
    padding: 6px 0;
  }
  header img {
    height: 85px;
    max-height: 85px;
    margin-bottom: 3px;
  }
  header.shrink img {
    height: 45px;
    max-height: 45px;
  }
  main {
    padding: 16px;
  }
}

@media (max-width: 600px) {
  body {
    padding-top: 140px;
  }
  header {
    padding: 4px 10px;
  }
  header nav {
    padding: 4px 0;
  }
  header img {
    height: 70px;
    max-height: 70px;
    margin-bottom: 2px;
  }
  header.shrink img {
    height: 40px;
    max-height: 40px;
  }
  header h1 {
    font-size: 1.3rem;
  }
  header p {
    font-size: 0.8rem;
  }
  main {
    padding: 12px;
  }
  section {
    padding: 12px;
    margin-bottom: 16px;
  }
  section h2 {
    font-size: 1.1rem;
  }
}

@media (max-width: 400px) {
  body {
    padding-top: 130px;
  }
  header {
    padding: 3px 8px;
  }
  header nav {
    padding: 3px 0;
  }
  header img {
    height: 60px;
    max-height: 60px;
    margin-bottom: 2px;
  }
  header.shrink img {
    height: 35px;
    max-height: 35px;
  }
  header h1 {
    font-size: 1.1rem;
  }
  header p {
    font-size: 0.7rem;
  }
  main {
    padding: 8px;
  }
  section {
    padding: 8px;
  }
}

footer{padding:16px;text-align:center;color:var(--dark);border-top:2px solid var(--accent);background:#C9977C;color:#E8C4A8;margin-top:32px}
