/*
Theme Name: BTPD Field Ops
Theme URI: https://btpdusa.com/
Author: BTPD
Author URI: https://btpdusa.com/
Description: Custom field-ops console theme for Body Telemetry & Protective Devices (BTPD). Dark charcoal/olive base with amber + steel-blue signal accents. Works alongside Elementor for all other page building.
Version: 1.0
Requires PHP: 7.4
Text Domain: btpd-fieldops
*/

:root{
  --bg-black:#14161A;
  --bg-panel:#1B1E19;
  --bg-panel-2:#242820;
  --line:#3A3F34;
  --line-soft:#2A2E26;
  --bone:#EAE6D9;
  --bone-dim:#A8A493;
  --amber:#CC8F2E;
  --amber-bright:#E4A93E;
  --steel:#6C8A94;
  --steel-dim:#44585F;
  --red-flag:#8C3B2A;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--bg-black);
  color:var(--bone);
  font-family:'Inter',sans-serif;
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%; display:block;}
a{color:inherit; text-decoration:none;}
ul{list-style:none;}
.eyebrow{
  font-family:'IBM Plex Mono',monospace;
  font-size:12px;
  letter-spacing:.18em;
  text-transform:uppercase;
  color:var(--amber);
  display:flex; align-items:center; gap:8px;
}
.eyebrow::before{
  content:"";
  width:7px; height:7px;
  background:var(--amber);
  display:inline-block;
  flex-shrink:0;
}
h1,h2,h3,h4{
  font-family:'Oswald',sans-serif;
  text-transform:uppercase;
  font-weight:600;
  letter-spacing:.01em;
  color:var(--bone);
}
.wrap{max-width:1180px; margin:0 auto; padding:0 28px;}
.btn{
  display:inline-flex; align-items:center; gap:10px;
  font-family:'IBM Plex Mono',monospace;
  font-size:13px; letter-spacing:.08em; text-transform:uppercase;
  padding:14px 22px;
  border:1px solid var(--amber);
  color:var(--bone);
  background:transparent;
  transition:background .15s ease, color .15s ease, transform .1s ease;
  cursor:pointer;
  white-space:nowrap;
}
.btn:hover{background:var(--amber); color:#1B1E19;}
.btn:active{transform:translateY(1px);}
.btn.solid{background:var(--amber); color:#181A15;}
.btn.solid:hover{background:var(--amber-bright);}
.btn.steel{border-color:var(--steel);}
.btn.steel:hover{background:var(--steel); color:#0F1416;}
.btn svg{width:14px; height:14px; flex-shrink:0;}

/* ===== TOPBAR ===== */
.topbar{
  background:#0F110E;
  border-bottom:1px solid var(--line-soft);
  font-family:'IBM Plex Mono',monospace;
  font-size:11.5px;
  letter-spacing:.06em;
  color:var(--bone-dim);
}
.topbar .wrap{
  display:flex; align-items:center; justify-content:center;
  gap:22px; padding:9px 28px;
  flex-wrap:wrap; text-align:center;
}
.topbar strong{color:var(--amber); font-weight:600;}
.topbar .sep{color:var(--line);}

/* ===== HEADER ===== */
header.site-header{
  background:var(--bg-black);
  border-bottom:1px solid var(--line-soft);
  position:sticky; top:0; z-index:50;
}
header.site-header .row{
  display:flex; align-items:center; justify-content:space-between;
  padding:16px 28px; gap:24px;
}
.logo{
  display:flex; align-items:center; gap:12px;
  font-family:'Oswald',sans-serif; text-transform:uppercase;
  font-size:19px; font-weight:700; letter-spacing:.03em; color:var(--bone);
}
.logo .mark{
  width:38px;height:38px;
  border:1.5px solid var(--amber);
  display:flex;align-items:center;justify-content:center;
  font-family:'IBM Plex Mono',monospace; font-size:13px; color:var(--amber);
  transform:rotate(45deg); flex-shrink:0;
}
.logo .mark span{transform:rotate(-45deg);}
.logo small{
  display:block; font-family:'IBM Plex Mono',monospace;
  font-size:10px; letter-spacing:.14em; color:var(--bone-dim);
  text-transform:uppercase; font-weight:400; margin-top:2px;
}
nav.mainnav ul{display:flex; gap:32px;}
nav.mainnav a{
  font-family:'IBM Plex Mono',monospace; font-size:12.5px;
  letter-spacing:.1em; text-transform:uppercase; color:var(--bone-dim);
  padding:6px 0; border-bottom:1px solid transparent;
  transition:color .15s, border-color .15s;
}
nav.mainnav a:hover, nav.mainnav a.active, nav.mainnav .current-menu-item a{color:var(--amber); border-color:var(--amber);}
.head-right{display:flex; align-items:center; gap:22px;}
.head-contact{
  font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--bone-dim);
  text-align:right; line-height:1.5;
}
.head-contact a:hover{color:var(--amber);}
.cart-pill{
  display:flex; align-items:center; gap:8px;
  border:1px solid var(--line); padding:9px 14px;
  font-family:'IBM Plex Mono',monospace; font-size:12.5px;
}
.navtoggle{display:none;}

/* ===== HERO ===== */
.hero{
  position:relative;
  background:var(--bg-panel);
  border-bottom:1px solid var(--line-soft);
  overflow:hidden;
}
.hero::before{
  content:"";
  position:absolute; inset:0;
  opacity:.35;
  background-image:
    repeating-radial-gradient(circle at 82% 20%, transparent 0, transparent 38px, rgba(108,138,148,0.07) 39px, transparent 40px, transparent 78px),
    repeating-radial-gradient(circle at 82% 20%, transparent 0, transparent 96px, rgba(204,143,46,0.05) 97px, transparent 98px, transparent 150px);
  pointer-events:none;
}
.hero-inner{
  position:relative; z-index:1;
  padding:78px 28px 0;
  display:grid; grid-template-columns:1.1fr .9fr; gap:50px; align-items:center;
  max-width:1180px; margin:0 auto;
}
.hero h1{
  font-size:clamp(38px,4.6vw,58px);
  line-height:1.04;
  margin:18px 0 20px;
}
.hero h1 em{font-style:normal; color:var(--amber);}
.hero p.lede{
  font-size:17px; color:var(--bone-dim); max-width:46ch; margin-bottom:32px;
}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
.hero-visual{
  border:1px solid var(--line);
  aspect-ratio:4/5;
  background:
    linear-gradient(180deg, rgba(20,22,26,0) 55%, rgba(20,22,26,.92) 100%),
    linear-gradient(135deg, #23271F 0%, #14161A 100%);
  position:relative;
  display:flex; align-items:flex-end;
  padding:22px;
}
.hero-visual .tag{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--steel);
  letter-spacing:.1em; text-transform:uppercase;
}
.hero-visual .tag strong{display:block; color:var(--bone); font-size:14px; margin-top:4px; font-family:'Inter',sans-serif; font-weight:600;}
.hero-visual::before{
  content:"";
  position:absolute; top:16px; right:16px; bottom:16px; left:16px;
  border:1px solid var(--line-soft);
  pointer-events:none;
}

/* SITREP ticker */
.sitrep{
  position:relative; z-index:1;
  margin-top:56px;
  border-top:1px solid var(--line-soft);
  background:#161812;
}
.sitrep .wrap{
  display:flex; flex-wrap:wrap; gap:0;
  font-family:'IBM Plex Mono',monospace;
}
.sitrep .stat{
  flex:1; min-width:180px;
  padding:18px 24px;
  border-right:1px solid var(--line-soft);
}
.sitrep .stat:last-child{border-right:none;}
.sitrep .stat .num{color:var(--amber); font-size:20px; font-weight:600; display:flex; align-items:center; gap:8px;}
.sitrep .stat .num .dot{width:6px;height:6px; border-radius:50%; background:#5BA86B; box-shadow:0 0 0 3px rgba(91,168,107,.15); flex-shrink:0;}
.sitrep .stat .label{font-size:10.5px; letter-spacing:.12em; text-transform:uppercase; color:var(--bone-dim); margin-top:5px;}

/* ===== SECTION SCAFFOLD ===== */
section{padding:88px 0;}
section.tight{padding:60px 0;}
.section-head{
  display:flex; justify-content:space-between; align-items:flex-end;
  gap:24px; margin-bottom:44px; flex-wrap:wrap;
}
.section-head h2{font-size:clamp(28px,3vw,38px); margin-top:12px;}
.section-head p{color:var(--bone-dim); max-width:44ch;}

/* ===== OPS CARDS (category ctas under hero, or shop grid) ===== */
.ops-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:1px;
  background:var(--line-soft);
  border:1px solid var(--line-soft);
}
.ops-card{
  background:var(--bg-black);
  padding:32px 26px;
  display:flex; flex-direction:column; gap:14px;
  transition:background .15s ease;
  position:relative;
}
.ops-card:hover{background:var(--bg-panel-2);}
.ops-card .idx{font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel); letter-spacing:.1em;}
.ops-card h3{font-size:21px;}
.ops-card p{color:var(--bone-dim); font-size:14.5px; flex-grow:1;}
.ops-card .go{
  font-family:'IBM Plex Mono',monospace; font-size:12px; letter-spacing:.08em;
  color:var(--amber); text-transform:uppercase; display:flex; align-items:center; gap:8px;
}
.ops-card:hover .go{color:var(--amber-bright);}

/* ===== READINESS BAND ===== */
.readiness{
  background:linear-gradient(120deg, #201B12 0%, #1B1E19 60%);
  border-top:1px solid var(--line-soft);
  border-bottom:1px solid var(--line-soft);
}
.readiness .wrap{
  display:grid; grid-template-columns:1.3fr .7fr; gap:40px; align-items:center;
  padding:64px 28px;
}
.readiness h2{font-size:clamp(24px,3vw,32px); margin:14px 0 16px; line-height:1.15;}
.readiness p{color:var(--bone-dim); max-width:52ch; margin-bottom:26px;}
.readiness-panel{
  border:1px solid var(--amber);
  padding:26px;
  font-family:'IBM Plex Mono',monospace;
}
.readiness-panel .line{display:flex; justify-content:space-between; padding:9px 0; border-bottom:1px solid var(--line-soft); font-size:12.5px;}
.readiness-panel .line:last-of-type{border-bottom:none;}
.readiness-panel .line span:first-child{color:var(--bone-dim);}
.readiness-panel .line span:last-child{color:var(--bone);}

/* ===== CATEGORY MANIFEST GRID ===== */
.cat-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:14px;}
.cat-card{
  border:1px solid var(--line);
  padding:26px 18px;
  text-align:left;
  transition:border-color .15s, background .15s;
}
.cat-card:hover{border-color:var(--amber); background:var(--bg-panel);}
.cat-card .count{
  font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel);
  letter-spacing:.06em;
}
.cat-card h4{font-size:16.5px; margin-top:10px; letter-spacing:0;}

/* ===== RADIO FINDER ===== */
.finder{background:var(--bg-panel); border-top:1px solid var(--line-soft); border-bottom:1px solid var(--line-soft);}
.finder-console{
  border:1px solid var(--line);
  background:#101210;
}
.finder-console .console-head{
  display:flex; justify-content:space-between; align-items:center;
  padding:14px 22px; border-bottom:1px solid var(--line-soft);
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--bone-dim);
}
.finder-console .console-head .dots{display:flex; gap:6px;}
.finder-console .console-head .dots span{width:8px;height:8px;border-radius:50%; background:var(--line);}
.finder-body{padding:30px 22px; display:grid; grid-template-columns:repeat(3,1fr) auto; gap:16px; align-items:end;}
.field label{
  display:block; font-family:'IBM Plex Mono',monospace; font-size:11px; color:var(--steel);
  letter-spacing:.1em; text-transform:uppercase; margin-bottom:8px;
}
.field select{
  width:100%; background:var(--bg-black); border:1px solid var(--line);
  color:var(--bone); padding:12px 12px; font-family:'Inter',sans-serif; font-size:14px;
  appearance:none;
}
.finder-body .btn{padding:13px 26px; justify-content:center;}
.finder-foot{
  padding:14px 22px; border-top:1px solid var(--line-soft);
  font-family:'IBM Plex Mono',monospace; font-size:12px; color:var(--bone-dim);
  display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
}
.finder-foot a{color:var(--amber);}

/* ===== WHY BTPD ===== */
.why-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-soft); border:1px solid var(--line-soft);}
.why-card{background:var(--bg-black); padding:30px 24px;}
.why-card .glyph{
  width:34px; height:34px; border:1px solid var(--steel); margin-bottom:18px;
  display:flex; align-items:center; justify-content:center; color:var(--steel);
}
.why-card h4{font-size:16px; letter-spacing:0; margin-bottom:8px;}
.why-card p{font-size:14px; color:var(--bone-dim);}

/* ===== FOOTER ===== */
footer.site-footer{background:#101210; border-top:1px solid var(--line-soft); padding-top:64px;}
.foot-grid{display:grid; grid-template-columns:1.4fr .8fr .8fr 1fr; gap:40px; padding-bottom:48px;}
.foot-brand .logo{margin-bottom:16px;}
.foot-brand p{color:var(--bone-dim); font-size:14px; max-width:34ch;}
.foot-col h5{
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; letter-spacing:.14em;
  text-transform:uppercase; color:var(--steel); margin-bottom:16px;
}
.foot-col li{margin-bottom:10px;}
.foot-col a{color:var(--bone-dim); font-size:14px;}
.foot-col a:hover{color:var(--amber);}
.foot-bottom{
  border-top:1px solid var(--line-soft);
  padding:20px 0; display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;
  font-family:'IBM Plex Mono',monospace; font-size:11.5px; color:var(--bone-dim); letter-spacing:.04em;
}

/* ===== RESPONSIVE ===== */
@media (max-width: 980px){
  nav.mainnav{display:none;}
  .head-contact{display:none;}
  .navtoggle{display:block; font-family:'IBM Plex Mono',monospace; font-size:12px; border:1px solid var(--line); padding:9px 14px; background:none; color:var(--bone);}
  .hero-inner{grid-template-columns:1fr; padding-top:48px;}
  .hero-visual{aspect-ratio:16/9;}
  .ops-grid{grid-template-columns:1fr;}
  .readiness .wrap{grid-template-columns:1fr;}
  .cat-grid{grid-template-columns:repeat(2,1fr);}
  .finder-body{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:1fr 1fr;}
  .foot-grid{grid-template-columns:1fr 1fr;}
  .sitrep .stat{min-width:50%;}
}
@media (max-width:560px){
  .cat-grid{grid-template-columns:1fr;}
  .why-grid{grid-template-columns:1fr;}
  .foot-grid{grid-template-columns:1fr;}
}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *{transition:none !important;}
}

:focus-visible{outline:2px solid var(--amber); outline-offset:2px;}

/* Elementor content compatibility - let Elementor-built pages render normally inside this theme */
.elementor-page .site-content{padding:0; max-width:none;}