/* Whistler Labs — responsive static landing page */
:root { --orange:#e87512; --charcoal:#414141; --panel:rgba(255,255,255,.88); }
* { box-sizing:border-box; }
html, body { min-height:100%; margin:0; }
body { font-family:Arial, Helvetica, sans-serif; color:var(--charcoal); }
.hero {
  position:relative; display:flex; align-items:flex-end; justify-content:center;
  min-height:100vh; min-height:100svh; padding:clamp(1rem,5vw,3.5rem);
  padding-bottom:clamp(2rem,7vh,4.5rem); overflow:hidden;
  background:#c77a1c url("assets/hero-background.jpg") center center / cover no-repeat;
}
.hero__shade { position:absolute; inset:0; background:linear-gradient(180deg,rgba(0,0,0,.03),rgba(0,0,0,.14)); }
.brand-panel {
  position:relative; z-index:1; display:flex; align-items:center; gap:1rem;
  width:min(100%,1040px); min-height:96px; padding:1rem 1.25rem;
  border-radius:16px; background:var(--panel); box-shadow:0 8px 28px rgba(0,0,0,.12);
  -webkit-backdrop-filter:blur(5px); backdrop-filter:blur(5px);
}
.brand { display:inline-flex; flex-direction:column; flex:0 0 auto; color:inherit; text-decoration:none; }
.brand__logo { display:block; width:clamp(190px,23vw,300px); height:auto; }
.brand__tagline { margin-top:.45rem; font-size:clamp(.7rem,1.6vw,.86rem); font-weight:700; white-space:nowrap; }
.brand-panel__descriptor {
  margin:0; padding-left:.9rem; border-left:1px solid rgba(65,65,65,.25);
  color:var(--charcoal); font-family:Impact,"Arial Narrow",sans-serif; font-size:.83rem; line-height:1.05;
}
.brand-panel__descriptor span { color:var(--orange); }
.contact-button {
  display:inline-flex; align-items:center; justify-content:center; min-height:42px;
  margin-left:auto; padding:.75rem 1.5rem; border-radius:6px; background:var(--orange);
  color:#fff; font-size:.9rem; font-weight:700; text-decoration:none; white-space:nowrap;
  transition:background-color 160ms ease,transform 160ms ease;
}
.contact-button:hover { background:#c96008; transform:translateY(-1px); }
.contact-button:focus-visible { outline:3px solid #252525; outline-offset:4px; }
@media (max-width:600px) {
  .hero { padding:1rem; padding-bottom:1.5rem; background-position:48% center; }
  .brand-panel { display:grid; grid-template-columns:minmax(0,1fr) auto; gap:.85rem; padding:1rem; border-radius:12px; }
  .brand { min-width:0; }
  .brand__logo { width:min(100%,230px); }
  .brand__tagline { white-space:normal; line-height:1.3; }
  .brand-panel__descriptor { display:none; }
  .contact-button { padding:.75rem 1rem; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important; transition:none!important; } }