/* RedHawk Defense V6.8.7 - Responsive density / less giant screen blocks
   Default is compact because most visitors do not need billboard-sized panels.
   Users can switch density from the top header: Compact / Standard / Large.
*/
:root{
  --rhd-page-top-gap: clamp(14px, 2vw, 28px);
  --rhd-panel-radius: 24px;
  --rhd-panel-pad: clamp(16px, 2.2vw, 28px);
  --rhd-card-pad: clamp(14px, 1.6vw, 20px);
  --rhd-section-gap: clamp(14px, 2vw, 24px);
  --rhd-hero-max: 1180px;
  --rhd-density-scale: .86;
}

/* JS sets density class, but compact is also the no-JS default. */
body:not(.rhd-density-standard):not(.rhd-density-large),
body.rhd-density-compact{
  --rhd-density-scale: .82;
  --rhd-panel-radius: 22px;
  --rhd-panel-pad: clamp(14px, 1.7vw, 22px);
  --rhd-card-pad: clamp(12px, 1.4vw, 17px);
  --rhd-section-gap: clamp(12px, 1.6vw, 18px);
  --rhd-hero-max: 1080px;
}
body.rhd-density-standard{
  --rhd-density-scale: .92;
  --rhd-panel-radius: 26px;
  --rhd-panel-pad: clamp(18px, 2.3vw, 32px);
  --rhd-card-pad: clamp(15px, 1.8vw, 22px);
  --rhd-section-gap: clamp(16px, 2.2vw, 28px);
  --rhd-hero-max: 1220px;
}
body.rhd-density-large{
  --rhd-density-scale: 1;
  --rhd-panel-radius: 30px;
  --rhd-panel-pad: clamp(22px, 3vw, 44px);
  --rhd-card-pad: clamp(18px, 2.4vw, 28px);
  --rhd-section-gap: clamp(20px, 3vw, 38px);
  --rhd-hero-max: 1440px;
}

/* Header density control */
.rhd-density-btn{
  color:#fff!important;
  text-decoration:none!important;
  border:1px solid rgba(255,255,255,.17);
  background:rgba(255,255,255,.07);
  border-radius:999px;
  padding:9px 11px;
  font:950 12px/1 Segoe UI,Arial,sans-serif;
  white-space:nowrap;
  cursor:pointer;
}
.rhd-density-btn:hover{border-color:#ffd166;box-shadow:0 0 22px rgba(255,209,102,.18)}
body.rhd-density-compact .rhd-density-btn{border-color:rgba(125,255,171,.5)}
body.rhd-density-standard .rhd-density-btn{border-color:rgba(106,165,255,.55)}
body.rhd-density-large .rhd-density-btn{border-color:rgba(255,209,102,.65)}

/* Header itself: cleaner, smaller by default. */
body.rhd-has-global-header{padding-top:88px!important}
body.rhd-has-global-header.rhd-has-context{padding-top:122px!important}
.rhd-nav-wrap{min-height:82px!important}
.rhd-brand-mark{width:62px!important;height:62px!important;flex-basis:62px!important;border-radius:16px!important}
.rhd-brand-text b{font-size:20px!important}
.rhd-brand-text span{font-size:10px!important;line-height:1.18!important;max-width:330px!important}
.rhd-primary-nav a,.rhd-lang a,.rhd-menu-btn,.rhd-more-btn{padding:9px 12px!important;font-size:12px!important}
.rhd-contextbar{padding-top:7px!important;margin-bottom:7px!important}
.rhd-contextbar a{padding:6px 9px!important;font-size:11.5px!important}

/* Large display mode intentionally expands header a bit. */
body.rhd-density-large.rhd-has-global-header{padding-top:106px!important}
body.rhd-density-large.rhd-has-global-header.rhd-has-context{padding-top:148px!important}
body.rhd-density-large .rhd-nav-wrap{min-height:96px!important}
body.rhd-density-large .rhd-brand-mark{width:74px!important;height:74px!important;flex-basis:74px!important}
body.rhd-density-large .rhd-brand-text b{font-size:23px!important}
body.rhd-density-large .rhd-brand-text span{font-size:10.5px!important}

/* Page width and spacing. */
.rhd-v66-wrap,
.wrap,
.shell{
  width:min(1360px, calc(100% - 28px))!important;
  padding-top:var(--rhd-page-top-gap)!important;
}
body.rhd-density-large .rhd-v66-wrap,
body.rhd-density-large .wrap,
body.rhd-density-large .shell{
  width:min(1500px, calc(100% - 28px))!important;
}

/* Hero / big panels are the main waste issue. */
.rhd-v66-hero,
.rhd-v66-section,
.rhd-v66-panel,
.rhd-seo-engine,
.rhd-visual-section,
.rhd-cameras-merge,
.panel,
.cta{
  border-radius:var(--rhd-panel-radius)!important;
  padding:var(--rhd-panel-pad)!important;
  margin-top:var(--rhd-section-gap)!important;
}

/* Do not let the homepage hero become a stadium jumbotron. */
.rhd-v66-hero{
  max-width:var(--rhd-hero-max)!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
.rhd-v66-h1,
.hero .lead h2,
.rhd-visual-title,
.rhd-seo-engine h2,
.rhd-cameras-merge h2{
  font-size:clamp(34px, calc(5.1vw * var(--rhd-density-scale)), 72px)!important;
  line-height:.93!important;
  letter-spacing:-.055em!important;
}
body.rhd-density-compact .rhd-v66-h1,
body.rhd-density-compact .hero .lead h2{
  font-size:clamp(34px, 4.3vw, 58px)!important;
}
body.rhd-density-standard .rhd-v66-h1,
body.rhd-density-standard .hero .lead h2{
  font-size:clamp(38px, 5vw, 68px)!important;
}
body.rhd-density-large .rhd-v66-h1,
body.rhd-density-large .hero .lead h2{
  font-size:clamp(44px, 6vw, 88px)!important;
}

.rhd-v66-lead{
  font-size:clamp(17px, 1.7vw, 23px)!important;
  line-height:1.46!important;
  max-width:980px!important;
}
.rhd-v66-copy,
.rhd-visual-copy,
.rhd-seo-engine p,
.rhd-cameras-merge p,
.panel p{
  font-size:clamp(14px, 1.2vw, 17px)!important;
  line-height:1.52!important;
}
body.rhd-density-compact .rhd-v66-copy,
body.rhd-density-compact .rhd-visual-copy,
body.rhd-density-compact .rhd-seo-engine p,
body.rhd-density-compact .rhd-cameras-merge p,
body.rhd-density-compact .panel p{
  line-height:1.44!important;
}

/* Cards and grids tighter. */
.rhd-v66-card,
.rhd-visual-card,
.rhd-cameras-merge-card,
.rhd-seo-flow .step,
.card,
.serviceCard,
.galleryCard,
.kpi,
.stat,
.step{
  border-radius:18px!important;
  padding:var(--rhd-card-pad)!important;
  min-height:auto!important;
}
.rhd-v66-grid4,
.rhd-visual-grid,
.rhd-cameras-merge-grid,
.rhd-seo-flow,
.grid,
.grid2,
.grid3,
.serviceGrid,
.gallery,
.stats{
  gap:clamp(10px, 1.4vw, 16px)!important;
  margin-top:clamp(10px, 1.5vw, 16px)!important;
}
.rhd-v66-card b,
.rhd-visual-body h3,
.rhd-cameras-merge-card b,
.card b{
  line-height:1.02!important;
}
.rhd-visual-body,
.serviceCard .body,
.galleryCard .copy{
  padding:var(--rhd-card-pad)!important;
}

/* Badges/buttons shrink a bit but remain touchable. */
.rhd-v66-badges,
.badges,
.rhd-v66-cta,
.rhd-visual-cta{
  gap:8px!important;
  margin-top:12px!important;
}
.rhd-v66-badges span,
.badges span,
.pill{
  padding:5px 9px!important;
  font-size:11.5px!important;
}
.rhd-v66-cta a,
.rhd-visual-cta a,
button,.btn,label.btn{
  padding:9px 12px!important;
  font-size:12.5px!important;
}

/* Visual/image sections were tall. Keep visual impact without hogging the whole screen. */
.rhd-visual-media,
.serviceCard .media{
  aspect-ratio:16 / 8.4!important;
}
.impactVisual,
.heroVisual{
  min-height:clamp(280px, 32vw, 420px)!important;
}
.mapFrame,
.aerialImage{
  height:clamp(280px, 32vw, 360px)!important;
}
.plannerBoard{
  height:clamp(380px, 48vw, 560px)!important;
}

/* Optional fold/collapse helper class used by JS toggle. */
body.rhd-hero-collapsed .rhd-v66-hero .rhd-v66-copy,
body.rhd-hero-collapsed .rhd-v66-hero .rhd-v66-badges,
body.rhd-hero-collapsed .rhd-v66-hero .rhd-v66-cta{
  display:none!important;
}
body.rhd-hero-collapsed .rhd-v66-hero{
  padding-top:16px!important;
  padding-bottom:16px!important;
}

/* Mobile cleanups */
@media(max-width:1220px){
  body.rhd-has-global-header,
  body.rhd-density-large.rhd-has-global-header{padding-top:82px!important}
  body.rhd-has-global-header.rhd-has-context,
  body.rhd-density-large.rhd-has-global-header.rhd-has-context{padding-top:82px!important}
  .rhd-nav-wrap{min-height:78px!important}
  .rhd-brand-mark{width:58px!important;height:58px!important;flex-basis:58px!important}
  .rhd-density-btn{display:inline-flex}
}
@media(max-width:720px){
  .rhd-v66-wrap,.wrap,.shell{width:min(100% - 18px, 1360px)!important}
  .rhd-brand-text span{display:none!important}
  .rhd-brand-text b{font-size:16px!important}
  .rhd-brand-mark{width:52px!important;height:52px!important;flex-basis:52px!important}
  .rhd-v66-hero,.rhd-v66-section,.rhd-v66-panel,.rhd-seo-engine,.rhd-visual-section,.rhd-cameras-merge,.panel,.cta{
    padding:14px!important;
    border-radius:18px!important;
  }
  .rhd-v66-h1,.hero .lead h2{font-size:32px!important}
  .rhd-v66-lead{font-size:16px!important}
}