/* War Room brand, HOMEPAGE BODY ONLY (scoped to body.ops-home). Colors and fonts come from chrome.css. */
body.ops-home{background:var(--ops-flat);color:var(--ops-white)}
html:has(body.ops-home){background:var(--ops-flat)}

/* ---------- Main: full-width bands ---------- */
html body.ops-home .xray-landing{max-width:none!important;padding:0!important;background:var(--ops-flat)}

/* HERO: dark band, light text */
html body.ops-home .xray-hero{
  --pad:max(24px,calc((100% - 1140px)/2));
  display:grid;grid-template-columns:1.25fr 1fr;gap:48px;align-items:center;
  padding:72px var(--pad) 190px;color:var(--ops-white);
  background:
    url("/assets/brand/skyline.svg") center bottom/1600px 220px repeat-x,
    repeating-linear-gradient(0deg,rgba(241,237,226,.035) 0 1px,transparent 1px 48px),
    repeating-linear-gradient(90deg,rgba(241,237,226,.035) 0 1px,transparent 1px 48px),
    linear-gradient(180deg,var(--ops-forest) 0%,var(--ops-forest-deep) 100%);
}
html body.ops-home .xray-eyebrow{display:inline-flex;align-items:center;gap:12px;margin:0;font-family:var(--stencil-label)!important;font-weight:400;font-size:16px!important;letter-spacing:.22em;color:var(--ops-gold);text-transform:uppercase}
html body.ops-home .xray-eyebrow:before{content:"";width:14px;height:14px;background:var(--ops-gold);flex:none}
html body.ops-home .xray-hero h1{font-family:var(--stencil-big);font-weight:400;font-size:clamp(28px,3.5vw,44px)!important;line-height:1.1;letter-spacing:.02em;text-transform:uppercase;color:var(--ops-white);margin:20px 0 26px}
html body.ops-home .xray-hero p{color:var(--ops-white-soft);font:19px/1.65 Arial,sans-serif;max-width:34em}
html body.ops-home .xray-hero .home-question{color:var(--ops-gold);font:700 24px/1.4 Arial,sans-serif}

/* Primary button: sand with dark text, notched corners */
html body.ops-home .xray-primary{display:inline-flex;align-items:center;min-height:58px;padding:14px 34px;margin-top:10px;background:var(--ops-gold);color:var(--ops-ink);border:0;border-radius:0;font-family:var(--stencil-label);font-weight:400;font-size:19px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;
  clip-path:polygon(14px 0,100% 0,100% calc(100% - 14px),calc(100% - 14px) 100%,0 100%,0 14px)}
html body.ops-home .xray-primary:hover{background:var(--ops-gold-hi);color:var(--ops-ink)}
html body.ops-home .xray-primary:focus-visible{clip-path:none;outline:4px solid var(--ops-white);outline-offset:4px}

/* Phone-only sticky call-to-action bar */
html body.ops-home .mobile-sticky .btn{display:flex;align-items:center;justify-content:center;min-height:58px;padding:14px 20px;background:var(--ops-gold);color:var(--ops-ink);border:3px solid var(--ops-flat);border-radius:0;font-family:var(--stencil-label);font-weight:400;font-size:19px;letter-spacing:.12em;text-transform:uppercase;text-decoration:none;box-shadow:0 0 0 2px var(--ops-gold),0 12px 28px rgba(0,0,0,.45)}
html body.ops-home .mobile-sticky .btn:hover{background:var(--ops-gold-hi);color:var(--ops-ink)}
html body.ops-home .mobile-sticky .btn:focus-visible{outline:4px solid var(--ops-white);outline-offset:4px}

/* Art panel */
html body.ops-home .xray-hero-art{margin:0;background:var(--ops-flat);border:2px solid var(--ops-line);border-radius:0;color:var(--ops-white);overflow:hidden}
html body.ops-home .xray-hero-art img{display:block;width:100%;height:auto}
html body.ops-home .xray-hero-art figcaption{padding:16px 20px;background:var(--ops-flat);color:var(--ops-white);font:700 17px/1.45 Arial,sans-serif;border-top:2px solid var(--ops-gold)}
html body.ops-home .xray-hero-art figcaption span{display:block;margin-top:4px;color:var(--ops-white-soft);font-weight:400;font-size:15px}

/* STORY BAND: flat black, white text. Coordination gaps + Pac-Man problem, told once. */
html body.ops-home .ops-story{--pad:max(24px,calc((100% - 1140px)/2));background:var(--ops-flat);color:var(--ops-white);padding:72px var(--pad) 76px;border-top:3px solid var(--ops-gold)}
html body.ops-home .ops-story h2{font-family:var(--stencil-big);font-weight:400;font-size:clamp(28px,3.4vw,42px)!important;line-height:1.1;letter-spacing:.02em;text-transform:uppercase;color:var(--ops-white);margin:16px 0 30px}
html body.ops-home .ops-story-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
html body.ops-home .ops-card{display:grid;grid-template-columns:150px 1fr;gap:20px;align-items:start;padding:20px;background:var(--ops-flat);border:2px solid var(--ops-gold);margin:0}
html body.ops-home .ops-card img{display:block;width:150px;height:auto;border:1px solid var(--ops-line)}
html body.ops-home .ops-card h3{font-family:var(--stencil-label);font-weight:400;font-size:21px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ops-gold);margin:0 0 10px}
html body.ops-home .ops-card p{color:var(--ops-white-soft);font:17px/1.6 Arial,sans-serif;margin:0}
html body.ops-home .ops-story-close{color:var(--ops-white);font:700 20px/1.5 Arial,sans-serif;max-width:44em;margin:30px 0 10px}
html body.ops-home .ops-story small{display:block;color:var(--ops-white-soft);font:15px/1.5 Arial,sans-serif}
@media (max-width:900px){
  html body.ops-home .ops-story{padding:48px 20px 52px}
  html body.ops-home .ops-story-grid{grid-template-columns:1fr}
  html body.ops-home .ops-card{grid-template-columns:110px 1fr;gap:16px;padding:16px}
  html body.ops-home .ops-card img{width:110px}
}

/* Sample case study: thumbnail opens a larger view; button opens the full PDF */
html body.ops-home .ops-sample{display:grid;grid-template-columns:200px 1fr;gap:28px;align-items:center;margin-top:28px;padding:22px;border:2px solid var(--ops-gold);background:var(--ops-flat)}
html body.ops-home .ops-sample-thumb{display:block;padding:0;margin:0;background:var(--ops-paper);border:2px solid var(--ops-white);border-radius:0;cursor:zoom-in;position:relative;width:200px}
html body.ops-home .ops-sample-thumb img{display:block;width:100%;height:auto}
html body.ops-home .ops-sample-thumb span{display:block;padding:8px 6px;background:var(--ops-gold);color:var(--ops-ink);font-family:var(--stencil-label);font-size:14px;letter-spacing:.1em;text-transform:uppercase;text-align:center}
html body.ops-home .ops-sample-thumb:focus-visible{outline:4px solid var(--ops-white);outline-offset:4px}
html body.ops-home .ops-sample h3{font-family:var(--stencil-label);font-weight:400;font-size:21px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ops-gold);margin:0 0 10px}
html body.ops-home .ops-sample p{color:var(--ops-white-soft);font:17px/1.6 Arial,sans-serif;margin:0 0 6px;max-width:40em}
html body.ops-home .ops-sample small{margin-top:14px}
html body.ops-home .ops-dialog{width:min(920px,calc(100% - 24px));max-height:92vh;padding:0;border:3px solid var(--ops-gold);border-radius:0;background:var(--ops-flat);color:var(--ops-white);overflow:auto}
html body.ops-home .ops-dialog::backdrop{background:rgba(0,0,0,.8)}
html body.ops-home .ops-dialog-bar,html body.ops-home .ops-dialog-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:14px 18px;background:var(--ops-flat)}
html body.ops-home .ops-dialog-bar{position:sticky;top:0;border-bottom:2px solid var(--ops-gold)}
html body.ops-home .ops-dialog h2{font-family:var(--stencil-label);font-weight:400;font-size:20px!important;letter-spacing:.08em;text-transform:uppercase;color:var(--ops-white);margin:0}
html body.ops-home .ops-dialog>p{margin:0;padding:10px 18px;color:var(--ops-white-soft);font:15px/1.5 Arial,sans-serif}
html body.ops-home .ops-dialog>img{display:block;width:100%;height:auto;background:var(--ops-paper)}
html body.ops-home .ops-dialog button{min-height:44px;padding:8px 18px;background:var(--ops-flat);color:var(--ops-white);border:2px solid var(--ops-gold);border-radius:0;font-family:var(--stencil-label);font-size:15px;letter-spacing:.1em;text-transform:uppercase;cursor:pointer}
html body.ops-home .ops-dialog button:hover{background:var(--ops-steel)}
html body.ops-home .ops-dialog .xray-primary{margin-top:0}
@media (max-width:900px){html body.ops-home .ops-sample{grid-template-columns:1fr;gap:18px;padding:16px}html body.ops-home .ops-sample-thumb{width:160px}}

/* CLOSING BAND: light band, dark text */
html body.ops-home .funnel-close{
  --pad:max(24px,calc((100% - 1140px)/2));
  background:var(--ops-paper);color:var(--ops-ink);text-align:left;
  padding:76px var(--pad) 84px;border:0;border-radius:0;box-shadow:none;margin:0;
  border-top:6px solid var(--ops-gold);
}
html body.ops-home .funnel-close .xray-eyebrow{color:var(--ops-forest)}
html body.ops-home .funnel-close .xray-eyebrow:before{background:var(--ops-forest)}
html body.ops-home .funnel-close h2{font-family:var(--stencil-big);font-weight:400;font-size:clamp(34px,4.6vw,58px);line-height:1.05;letter-spacing:.02em;text-transform:uppercase;color:var(--ops-ink);margin:18px 0 20px}
html body.ops-home .funnel-close p{color:var(--ops-ink-soft);font:19px/1.65 Arial,sans-serif;max-width:40em;margin:0 0 22px}
html body.ops-home .funnel-close p.xray-eyebrow{margin:0}
html body.ops-home .funnel-close .xray-primary{background:var(--ops-flat);color:var(--ops-white)}
html body.ops-home .funnel-close .xray-primary:hover{background:var(--ops-steel);color:var(--ops-white)}
html body.ops-home .funnel-close .xray-primary:focus-visible{outline-color:var(--ops-ink)}
html body.ops-home .funnel-close small{display:block;margin-top:22px;color:var(--ops-ink-soft);font:15px/1.5 Arial,sans-serif}

/* ---------- Small screens ---------- */
@media (max-width:900px){
  html body.ops-home .xray-hero{grid-template-columns:1fr;gap:30px;padding:44px 20px 150px;--pad:20px}
  html body.ops-home .xray-hero p{font-size:18px}
  html body.ops-home .funnel-close{padding:52px 20px 60px}
}
@media (prefers-reduced-motion:reduce){html body.ops-home *{transition:none!important;animation:none!important}}

html body.ops-home .ops-sample-more{margin:14px 0 0}html body.ops-home .ops-sample-more a{color:var(--ops-gold-hi);font-weight:700;text-underline-offset:3px}