/* Clear Fork Security - Blackout Tactical - shared site stylesheet.
   Part 1 is the as-delivered Phase 2 homepage CSS, lifted verbatim out of
   index.html so index.html renders identically. Part 2 adds the multi-page
   rules. Part 3 adds the products section. Generated by
   scripts/build_site.py - edit the sources, not this file. */

/* ===== PART 1: Phase 2 homepage CSS (verbatim) ===== */
  :root{
    --bg:#0a0a0a;
    --panel:#141414;
    --border:#2a2a2a;
    --text:#f2f1ec;
    --muted:#9a978f;
    --accent:#b00020;
    --steel:#3a3d3f;
  }
  *{box-sizing:border-box;margin:0;padding:0;}
  html{scroll-behavior:smooth;}
  body{
    background:var(--bg);
    color:var(--text);
    font-family:'Barlow Semi Condensed', sans-serif;
    line-height:1.5;
    overflow-x:hidden;
  }
  h1,h2,h3,.display{
    font-family:'Anton', sans-serif;
    text-transform:uppercase;
    letter-spacing:0.01em;
    line-height:1.02;
    font-weight:400;
  }
  a{color:inherit;text-decoration:none;}
  .wrap{max-width:1180px;margin:0 auto;padding:0 24px;}

  /* ---------- NAV ---------- */
  header{
    position:sticky;top:0;z-index:100;
    background:rgba(10,10,10,0.92);
    backdrop-filter:blur(6px);
    border-bottom:1px solid var(--border);
  }
  nav{
    display:flex;align-items:center;justify-content:space-between;
    padding:16px 24px;max-width:1180px;margin:0 auto;
    flex-wrap:wrap;gap:16px;
  }
  .logo-block{display:flex;flex-direction:column;gap:2px;}
  .logo-word{
    font-family:'Anton', sans-serif;
    font-size:1.35rem;
    letter-spacing:0.03em;
    text-transform:uppercase;
  }
  .logo-word span{color:var(--accent);}
  .logo-tag{
    font-size:0.68rem;
    letter-spacing:0.12em;
    text-transform:uppercase;
    color:var(--muted);
    font-weight:600;
  }
  .nav-links{display:flex;align-items:center;gap:36px;}
  .nav-links a{
    font-size:0.82rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    font-weight:600;
    color:var(--text);
    position:relative;
    padding:4px 0;
  }
  .nav-links a::after{
    content:'';position:absolute;left:0;bottom:0;width:0;height:2px;
    background:var(--accent);transition:width 0.25s ease;
  }
  .nav-links a:hover::after{width:100%;}
  .nav-links a:hover{color:#fff;}
  .btn{
    display:inline-block;
    font-family:'Barlow Semi Condensed', sans-serif;
    font-weight:700;
    letter-spacing:0.08em;
    text-transform:uppercase;
    font-size:0.82rem;
    padding:12px 26px;
    border:1px solid var(--accent);
    background:var(--accent);
    color:#fff;
    clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
    transition:background 0.2s ease,transform 0.15s ease,box-shadow 0.2s ease;
    cursor:pointer;
  }
  .btn:hover{
    background:#d10026;
    transform:translateY(-1px);
    box-shadow:0 0 22px rgba(176,0,32,0.55);
  }
  .btn-outline{
    background:transparent;
    border:1px solid var(--steel);
    color:var(--text);
  }
  .btn-outline:hover{
    border-color:var(--accent);
    background:rgba(200,16,46,0.08);
    box-shadow:none;
  }
  .nav-cta{display:none;}
  @media(min-width:860px){.nav-cta{display:inline-block;}}

  .burger{display:flex;flex-direction:column;gap:5px;cursor:pointer;background:none;border:none;padding:8px;}
  .burger span{width:24px;height:2px;background:var(--text);display:block;}
  @media(min-width:860px){.burger{display:none;}}
  .nav-links{display:none;}
  @media(min-width:860px){.nav-links{display:flex;}}

  /* ---------- HERO ---------- */
  .hero{
    position:relative;
    padding:120px 24px 100px;
    background:
      radial-gradient(ellipse at 50% 0%, rgba(200,16,46,0.08), transparent 55%),
      var(--bg);
    border-bottom:1px solid var(--border);
    overflow:hidden;
  }
  .hero::before{
    content:'';
    position:absolute;inset:0;
    background-image:
      linear-gradient(rgba(255,255,255,0.035) 1px, transparent 1px),
      linear-gradient(90deg, rgba(255,255,255,0.035) 1px, transparent 1px);
    background-size:64px 64px;
    mask-image:radial-gradient(ellipse at 50% 30%, black 0%, transparent 70%);
    pointer-events:none;
  }
  .reticle{
    position:absolute;
    top:50%;left:50%;
    width:520px;height:520px;
    transform:translate(-50%,-50%);
    border:1px solid rgba(200,16,46,0.18);
    border-radius:50%;
    pointer-events:none;
  }
  .reticle::before,.reticle::after{
    content:'';position:absolute;background:rgba(200,16,46,0.18);
  }
  .reticle::before{top:50%;left:-40px;width:calc(100% + 80px);height:1px;transform:translateY(-50%);}
  .reticle::after{left:50%;top:-40px;height:calc(100% + 80px);width:1px;transform:translateX(-50%);}
  .hero-inner{position:relative;z-index:2;max-width:1180px;margin:0 auto;text-align:center;}
  .eyebrow{
    display:inline-block;
    font-size:0.78rem;
    letter-spacing:0.2em;
    text-transform:uppercase;
    color:var(--accent);
    font-weight:600;
    margin-bottom:22px;
    border:1px solid rgba(200,16,46,0.4);
    padding:6px 16px;
    clip-path:polygon(8px 0,100% 0,100% calc(100% - 8px),calc(100% - 8px) 100%,0 100%,0 8px);
  }
  .hero h1{
    font-size:clamp(2.6rem,7vw,6.4rem);
    color:var(--text);
    max-width:980px;
    margin:0 auto 28px;
  }
  .hero h1 .cut{
    color:var(--accent);
    position:relative;
    display:inline-block;
  }
  .hero h1 .cut::after{
    content:'';
    position:absolute;left:2%;right:2%;bottom:-0.08em;
    height:5px;background:var(--accent);
  }
  .hero p{
    font-size:clamp(1.05rem,1.6vw,1.3rem);
    color:var(--muted);
    max-width:640px;
    margin:0 auto 40px;
  }
  .hero-actions{display:flex;gap:24px;align-items:center;justify-content:center;flex-wrap:wrap;}
  .text-link{
    font-weight:600;letter-spacing:0.05em;text-transform:uppercase;font-size:0.85rem;
    border-bottom:1px solid var(--steel);
    padding-bottom:4px;
    transition:border-color 0.2s ease,color 0.2s ease;
  }
  .text-link:hover{border-color:var(--accent);color:var(--accent);}

  /* ---------- STATS ---------- */
  .stats-band{
    position:relative;
    background:var(--panel);
    border-bottom:1px solid var(--border);
    padding:0;
    overflow:hidden;
  }
  .hazard{
    height:10px;width:100%;
    background:repeating-linear-gradient(-45deg, var(--accent) 0 14px, #1a1a1a 14px 28px);
    opacity:1;
  }
  .stats-grid{
    display:grid;grid-template-columns:repeat(2,1fr);
    max-width:1180px;margin:0 auto;
  }
  @media(min-width:760px){.stats-grid{grid-template-columns:repeat(4,1fr);}}
  .stat{
    padding:40px 24px;
    text-align:center;
    border-right:1px solid var(--border);
    border-bottom:1px solid var(--border);
  }
  @media(min-width:760px){.stat:nth-child(4n){border-right:none;} .stat{border-bottom:none;}}
  .stat:nth-child(2n){border-right:none;}
  @media(min-width:760px){.stat:nth-child(2n){border-right:1px solid var(--border);}}
  .stat-num{
    font-family:'Anton', sans-serif;
    font-size:clamp(1.9rem,3.4vw,2.7rem);
    color:var(--text);
  }
  .stat-num span{color:var(--accent);}
  .stat-label{
    margin-top:8px;
    font-size:0.76rem;
    letter-spacing:0.1em;
    text-transform:uppercase;
    color:var(--muted);
    font-weight:600;
  }

  /* ---------- SERVICES ---------- */
  .section{padding:100px 24px;}
  .section-head{max-width:640px;margin:0 auto 60px;text-align:center;}
  .kicker{
    font-size:0.78rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent);
    font-weight:600;margin-bottom:14px;display:block;
  }
  .section-head h2{font-size:clamp(2rem,4vw,3.2rem);color:var(--text);}
  .services-grid{
    display:grid;grid-template-columns:1fr;gap:1px;
    max-width:1180px;margin:0 auto;
    background:var(--border);
    border:1px solid var(--border);
  }
  @media(min-width:640px){.services-grid{grid-template-columns:repeat(2,1fr);}}
  @media(min-width:980px){.services-grid{grid-template-columns:repeat(3,1fr);}}
  .service-card{
    background:var(--panel);
    padding:36px 28px;
    clip-path:polygon(0 0,100% 0,100% 100%,16px 100%,0 calc(100% - 16px));
    transition:background 0.25s ease;
    position:relative;
  }
  .service-card:hover{background:#191919;}
  .service-card svg{width:40px;height:40px;stroke:var(--accent);fill:none;stroke-width:1.5;margin-bottom:22px;}
  .service-card h3{
    font-family:'Barlow Semi Condensed', sans-serif;
    font-weight:700;
    font-size:1.05rem;
    letter-spacing:0.04em;
    text-transform:uppercase;
    margin-bottom:12px;
    color:var(--text);
  }
  .service-card p{font-size:0.92rem;color:var(--muted);}

  /* ---------- AUDIENCE SPLIT ---------- */
  .audience-band{
    background:var(--panel);
    border-bottom:1px solid var(--border);
    padding:56px 24px;
    text-align:center;
  }
  .audience-label{
    font-size:0.78rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--accent);
    font-weight:600;margin-bottom:22px;display:block;
  }
  .audience-toggle{
    display:inline-flex;
    border:1px solid var(--steel);
    clip-path:polygon(10px 0,100% 0,100% calc(100% - 10px),calc(100% - 10px) 100%,0 100%,0 10px);
  }
  .audience-btn{
    font-family:'Barlow Semi Condensed', sans-serif;
    font-weight:700;letter-spacing:0.08em;text-transform:uppercase;font-size:0.85rem;
    padding:14px 30px;background:transparent;border:none;color:var(--muted);cursor:pointer;
    transition:background 0.2s ease,color 0.2s ease;
  }
  .audience-btn:not(:last-child){border-right:1px solid var(--steel);}
  .audience-btn.active{background:var(--accent);color:#fff;}
  .audience-btn:not(.active):hover{color:var(--text);}
  .pillar-copy{display:none;}
  .pillar-business{display:block;}
  body.audience-personal .pillar-business{display:none;}
  body.audience-personal .pillar-personal{display:block;}

  /* ---------- NEWS FEED ---------- */
  .live-indicator{
    display:inline-flex;align-items:center;gap:8px;margin-top:16px;
    font-size:0.78rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);font-weight:600;
  }
  .live-dot{
    width:8px;height:8px;border-radius:50%;background:var(--accent);
    box-shadow:0 0 8px var(--accent);
    animation:news-pulse 1.6s ease-in-out infinite;
  }
  @keyframes news-pulse{
    0%,100%{opacity:1;}
    50%{opacity:0.35;}
  }
  .news-list{
    max-width:900px;margin:0 auto;
    border:1px solid var(--border);background:var(--panel);
  }
  .news-row{
    display:flex;align-items:center;flex-wrap:wrap;gap:16px;
    padding:18px 22px;border-bottom:1px solid var(--border);
    position:relative;transition:background 0.2s ease;
  }
  .news-row:last-child{border-bottom:none;}
  .news-row::before{
    content:'';position:absolute;left:0;top:0;bottom:0;width:3px;
    background:var(--accent);transform:scaleY(0);transition:transform 0.2s ease;
  }
  .news-row:hover{background:#191919;}
  .news-row:hover::before{transform:scaleY(1);}
  .news-time{font-size:0.74rem;letter-spacing:0.08em;color:var(--muted);font-weight:600;white-space:nowrap;flex:0 0 auto;}
  .news-tag{
    font-size:0.66rem;letter-spacing:0.08em;font-weight:700;padding:4px 10px;
    border:1px solid;white-space:nowrap;text-transform:uppercase;flex:0 0 auto;
    clip-path:polygon(6px 0,100% 0,100% calc(100% - 6px),calc(100% - 6px) 100%,0 100%,0 6px);
  }
  .tag-breach{border-color:var(--accent);background:rgba(176,0,32,0.18);color:var(--accent);}
  .tag-ransomware{border-color:var(--accent);background:transparent;color:var(--accent);}
  .tag-scam{border-color:var(--steel);background:rgba(58,61,63,0.35);color:var(--text);}
  .tag-iot{border-color:var(--steel);background:transparent;color:var(--muted);}
  .tag-privacy{border-color:var(--accent);background:rgba(176,0,32,0.08);color:var(--muted);}
  .news-headline{font-size:0.95rem;color:var(--text);flex:1 1 260px;}
  .news-source{font-size:0.76rem;color:var(--muted);letter-spacing:0.04em;white-space:nowrap;flex:0 0 auto;}
  .news-footnote{max-width:900px;margin:24px auto 0;font-size:0.8rem;color:var(--muted);text-align:center;}

  /* ---------- ABOUT ---------- */
  .about{
    background:var(--panel);
    border-top:1px solid var(--border);
    border-bottom:1px solid var(--border);
    padding:100px 24px;
    position:relative;
  }
  .about-inner{max-width:760px;margin:0 auto;text-align:center;}
  .about h2{font-size:clamp(1.8rem,3.6vw,2.8rem);margin-bottom:26px;}
  .about p{color:var(--muted);font-size:1.08rem;margin-bottom:16px;}
  .about strong{color:var(--text);font-weight:700;}

  /* ---------- FOOTER ---------- */
  footer{padding:70px 24px 30px;background:var(--bg);}
  .footer-grid{
    max-width:1180px;margin:0 auto;
    display:grid;grid-template-columns:1fr;gap:40px;
    padding-bottom:40px;border-bottom:1px solid var(--border);
  }
  @media(min-width:760px){.footer-grid{grid-template-columns:2fr 1fr 1fr;}}
  .footer-brand .logo-word{margin-bottom:10px;}
  .footer-brand p{color:var(--muted);font-size:0.92rem;max-width:340px;}
  .footer-col h4{
    font-size:0.78rem;letter-spacing:0.14em;text-transform:uppercase;
    color:var(--accent);margin-bottom:16px;font-weight:700;
  }
  .footer-col p, .footer-col a{
    display:block;color:var(--muted);font-size:0.92rem;margin-bottom:10px;
  }
  .footer-col a:hover{color:var(--text);}
  .footer-bottom{
    max-width:1180px;margin:0 auto;padding-top:24px;
    display:flex;justify-content:space-between;flex-wrap:wrap;gap:10px;
    font-size:0.78rem;color:var(--steel);letter-spacing:0.04em;
  }

/* ===== PART 2: multi-page additions ===== */
/* ============================================================
   BLACKOUT TACTICAL — multi-page additions
   Appended to the Phase 2 homepage CSS. Only ADDS rules; the
   homepage's own selectors are untouched so index.html renders
   identically to the Phase 2 version.
   ============================================================ */

/* --- working mobile nav (burger was decorative in Phase 2) --- */
@media(max-width:859px){
  .nav-links.open{
    display:flex;flex-direction:column;align-items:flex-start;gap:18px;
    width:100%;padding:18px 0 6px;border-top:1px solid var(--border);
  }
}

/* --- page hero (interior pages) --- */
.page-hero{
  position:relative;
  padding:84px 24px 64px;
  background:
    radial-gradient(ellipse at 50% 0%, rgba(176,0,32,0.10), transparent 60%),
    var(--bg);
  border-bottom:1px solid var(--border);
  overflow:hidden;
}
.page-hero::before{
  content:'';position:absolute;inset:0;
  background-image:
    linear-gradient(rgba(255,255,255,0.03) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.03) 1px, transparent 1px);
  background-size:64px 64px;
  mask-image:radial-gradient(ellipse at 50% 20%, black 0%, transparent 72%);
  pointer-events:none;
}
.page-hero-inner{position:relative;z-index:2;max-width:860px;margin:0 auto;text-align:center;}
.page-hero h1{font-size:clamp(2.1rem,5vw,4rem);margin-bottom:20px;}
.page-hero p{color:var(--muted);font-size:clamp(1rem,1.4vw,1.18rem);max-width:680px;margin:0 auto;}
.hero-rule{
  width:88px;height:4px;margin:26px auto 0;
  background:repeating-linear-gradient(-45deg, var(--accent) 0 8px, #1a1a1a 8px 16px);
}
.crumbs{
  position:relative;z-index:2;max-width:1180px;margin:0 auto 18px;
  font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--steel);font-weight:600;text-align:center;
}
.crumbs a{color:var(--muted);}
.crumbs a:hover{color:var(--accent);}
.crumbs span{color:var(--steel);padding:0 8px;}

/* --- generic interior blocks --- */
.section-alt{background:var(--panel);border-top:1px solid var(--border);border-bottom:1px solid var(--border);}
.section-head-left{max-width:1180px;margin:0 auto 44px;text-align:left;}
.section-head-left h2{font-size:clamp(1.6rem,3.2vw,2.5rem);}
.narrow{max-width:900px;margin:0 auto;}
.lede{font-size:1.1rem;color:var(--muted);max-width:760px;margin:0 auto 44px;text-align:center;}
.prose p{color:var(--muted);font-size:1.04rem;margin-bottom:18px;}
.prose strong{color:var(--text);font-weight:700;}

/* --- "what's included" list --- */
.inc-grid{
  display:grid;grid-template-columns:1fr;gap:1px;
  max-width:1180px;margin:0 auto;background:var(--border);
  border:1px solid var(--border);
}
@media(min-width:720px){.inc-grid{grid-template-columns:repeat(2,1fr);}}
/* odd item count would leave a visible empty cell; let the last one span */
@media(min-width:720px){.inc-item:last-child:nth-child(odd){grid-column:1 / -1;}}
.inc-item{
  background:var(--panel);padding:26px 24px;
  clip-path:polygon(0 0,100% 0,100% 100%,14px 100%,0 calc(100% - 14px));
  transition:background 0.2s ease;
}
.inc-item:hover{background:#191919;}
.inc-item h3{
  font-family:'Barlow Semi Condensed', sans-serif;font-weight:700;
  font-size:0.98rem;letter-spacing:0.05em;text-transform:uppercase;
  color:var(--text);margin-bottom:10px;
  display:flex;align-items:baseline;gap:10px;
}
.inc-item h3::before{
  content:'';flex:0 0 auto;width:8px;height:8px;background:var(--accent);
  transform:translateY(-2px);
}
.inc-item p{font-size:0.92rem;color:var(--muted);}

/* --- who it's for (business / personal blocks) --- */
.who-grid{display:grid;grid-template-columns:1fr;gap:24px;max-width:1180px;margin:0 auto;}
@media(min-width:860px){.who-grid{grid-template-columns:repeat(2,1fr);}}
.who-col{
  background:var(--panel);border:1px solid var(--border);padding:30px 26px;
  clip-path:polygon(0 0,100% 0,100% 100%,18px 100%,0 calc(100% - 18px));
}
.who-col.is-active{border-color:var(--accent);box-shadow:inset 3px 0 0 var(--accent);}
.who-col h3{
  font-family:'Barlow Semi Condensed', sans-serif;font-weight:700;font-size:0.84rem;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:18px;
}
.who-col ul{list-style:none;}
.who-col li{
  position:relative;padding-left:22px;margin-bottom:14px;
  font-size:0.94rem;color:var(--muted);
}
.who-col li::before{
  content:'';position:absolute;left:0;top:0.55em;
  width:10px;height:1px;background:var(--accent);
}

/* --- engagement steps --- */
.steps{max-width:900px;margin:0 auto;counter-reset:step;}
.step{
  position:relative;display:flex;gap:22px;align-items:flex-start;
  padding:24px 0;border-bottom:1px solid var(--border);
}
.step:last-child{border-bottom:none;}
.step-num{
  flex:0 0 auto;width:46px;height:46px;
  display:flex;align-items:center;justify-content:center;
  font-family:'Anton', sans-serif;font-size:1.15rem;
  color:var(--accent);border:1px solid var(--accent);
  clip-path:polygon(9px 0,100% 0,100% calc(100% - 9px),calc(100% - 9px) 100%,0 100%,0 9px);
}
.step-body h3{
  font-family:'Barlow Semi Condensed', sans-serif;font-weight:700;font-size:1rem;
  letter-spacing:0.08em;text-transform:uppercase;margin-bottom:8px;color:var(--text);
}
.step-body p{font-size:0.94rem;color:var(--muted);}

/* --- FAQ --- */
.faq{max-width:900px;margin:0 auto;border:1px solid var(--border);background:var(--panel);}
.faq details{border-bottom:1px solid var(--border);}
.faq details:last-child{border-bottom:none;}
.faq summary{
  cursor:pointer;list-style:none;padding:20px 24px;
  font-family:'Barlow Semi Condensed', sans-serif;font-weight:700;
  font-size:0.98rem;letter-spacing:0.03em;color:var(--text);
  display:flex;align-items:center;gap:14px;transition:background 0.2s ease;
}
.faq summary::-webkit-details-marker{display:none;}
.faq summary::before{
  content:'+';flex:0 0 auto;color:var(--accent);
  font-family:'Anton', sans-serif;font-size:1.1rem;width:14px;
}
.faq details[open] summary::before{content:'\2212';}
.faq summary:hover{background:#191919;}
.faq .faq-a{padding:0 24px 22px 52px;font-size:0.94rem;color:var(--muted);}

/* --- CTA band --- */
.cta-band{
  background:var(--panel);border-top:1px solid var(--border);
  padding:72px 24px;text-align:center;
}
.cta-band h2{font-size:clamp(1.6rem,3.2vw,2.4rem);margin-bottom:18px;}
.cta-band p{color:var(--muted);max-width:560px;margin:0 auto 30px;}
.cta-actions{display:flex;gap:20px;justify-content:center;flex-wrap:wrap;align-items:center;}

/* --- services overview cards (link variant) --- */
.pillar-link{
  display:flex;align-items:center;gap:8px;margin-top:18px;
  font-size:0.8rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--accent);
}
.service-card:hover .pillar-link{color:#d10026;}

/* --- news page --- */
.feed-meta{
  max-width:900px;margin:0 auto 20px;display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:12px;
  font-size:0.74rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--steel);font-weight:600;
}
.news-row a.news-headline{flex:1 1 260px;}
.news-row a.news-headline:hover{color:var(--accent);}
.news-aud{
  font-size:0.64rem;letter-spacing:0.08em;font-weight:700;padding:3px 8px;
  border:1px solid var(--steel);color:var(--steel);text-transform:uppercase;
  white-space:nowrap;flex:0 0 auto;
}
.news-summary{
  flex:1 1 100%;font-size:0.86rem;color:var(--steel);margin-top:-4px;
}
.feed-empty{padding:28px 22px;color:var(--muted);font-size:0.94rem;text-align:center;}
.news-more{margin-top:26px;text-align:center;}
.src-grid{
  display:grid;grid-template-columns:repeat(2,1fr);gap:1px;max-width:900px;margin:0 auto;
  background:var(--border);border:1px solid var(--border);
}
@media(min-width:720px){.src-grid{grid-template-columns:repeat(4,1fr);}}
.src-cell{background:var(--panel);padding:20px 16px;text-align:center;}
.src-cell .src-name{
  font-family:'Anton', sans-serif;font-size:0.98rem;text-transform:uppercase;
  color:var(--text);letter-spacing:0.02em;
}
.src-cell .src-count{font-size:0.74rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--muted);margin-top:6px;font-weight:600;}

/* --- contact page --- */
.contact-grid{display:grid;grid-template-columns:1fr;gap:40px;max-width:1180px;margin:0 auto;}
@media(min-width:900px){.contact-grid{grid-template-columns:1fr 1.15fr;}}
.contact-card{
  background:var(--panel);border:1px solid var(--border);padding:30px 26px;
  clip-path:polygon(0 0,100% 0,100% 100%,18px 100%,0 calc(100% - 18px));
  margin-bottom:24px;
}
.contact-card h3{
  font-family:'Barlow Semi Condensed', sans-serif;font-weight:700;font-size:0.82rem;
  letter-spacing:0.14em;text-transform:uppercase;color:var(--accent);margin-bottom:16px;
}
.contact-card a, .contact-card p{display:block;color:var(--muted);font-size:1rem;margin-bottom:10px;}
.contact-card a.big{
  font-family:'Anton', sans-serif;font-size:1.6rem;color:var(--text);letter-spacing:0.02em;
}
.contact-card a:hover{color:var(--accent);}
.contact-form{
  background:var(--panel);border:1px solid var(--border);padding:30px 26px;
  clip-path:polygon(0 0,100% 0,100% 100%,18px 100%,0 calc(100% - 18px));
}
.form-row{margin-bottom:20px;}
.form-row label{
  display:block;font-size:0.74rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--muted);font-weight:600;margin-bottom:8px;
}
.form-row input, .form-row select, .form-row textarea{
  width:100%;background:#0d0d0d;border:1px solid var(--border);color:var(--text);
  font-family:'Barlow Semi Condensed', sans-serif;font-size:1rem;padding:12px 14px;
}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{
  outline:none;border-color:var(--accent);
}
.form-row textarea{min-height:140px;resize:vertical;}
.form-note{font-size:0.8rem;color:var(--steel);margin-top:16px;}

/* --- about page --- */
.doctrine-grid{display:grid;grid-template-columns:1fr;gap:1px;max-width:1180px;margin:0 auto;background:var(--border);border:1px solid var(--border);}
@media(min-width:680px){.doctrine-grid{grid-template-columns:repeat(2,1fr);}}
@media(min-width:1000px){.doctrine-grid{grid-template-columns:repeat(3,1fr);}}
.doctrine-item{background:var(--panel);padding:28px 24px;}
.doctrine-item h3{
  font-family:'Barlow Semi Condensed', sans-serif;font-weight:700;font-size:0.95rem;
  letter-spacing:0.05em;text-transform:uppercase;color:var(--text);margin-bottom:10px;
}
.doctrine-item p{font-size:0.92rem;color:var(--muted);}
.wont-list{max-width:760px;margin:0 auto;list-style:none;}
.wont-list li{
  position:relative;padding-left:30px;margin-bottom:16px;font-size:1.02rem;color:var(--muted);
}
.wont-list li::before{
  content:'\00d7';position:absolute;left:0;top:-2px;
  color:var(--accent);font-family:'Anton', sans-serif;font-size:1.2rem;
}

/* --- footer nav --- */
.footer-col a.fnav{margin-bottom:10px;}

@media(max-width:420px){
  .section{padding:64px 18px;}
  .page-hero{padding:56px 18px 44px;}
  .news-row{padding:16px 16px;gap:10px;}
  .step{gap:14px;}
  .step-num{width:38px;height:38px;font-size:1rem;}
  .faq .faq-a{padding-left:24px;}
}


/* ===== PART 3: products section - 01 Blackout Tactical =====
   Anton + Barlow Semi Condensed, deep-red accent, angular cut corners,
   hazard-stripe emphasis. Generated into assets/site.css by build_site.py. */

/* ---------- catalogue grid ---------- */
.prod-grid{
  display:grid;grid-template-columns:1fr;gap:28px;
  max-width:1180px;margin:0 auto;
}
.prod-card{
  background:var(--panel);border:1px solid var(--border);
  display:flex;flex-direction:column;
  clip-path:polygon(0 0,calc(100% - 18px) 0,100% 18px,100% 100%,18px 100%,0 calc(100% - 18px));
}
.prod-card:hover{border-color:var(--accent);}
.prod-card-art{background:#111;border-bottom:1px solid var(--border);line-height:0;}
.prod-card-art svg,.prod-hero-art svg{display:block;width:100%;height:auto;}
.prod-card-body{padding:26px 24px 30px;display:flex;flex-direction:column;gap:12px;}
.prod-card-body h3{
  font-family:'Anton',sans-serif;font-size:1.35rem;letter-spacing:0.02em;
  text-transform:uppercase;line-height:1.15;
}
.prod-card-body h3 a{color:var(--text);}
.prod-card-body h3 a:hover{color:var(--accent);}
.prod-tagline{color:var(--text);font-size:1rem;font-weight:600;}
.prod-short{color:var(--muted);font-size:0.94rem;}
.prod-price{
  font-family:'Anton',sans-serif;font-size:1.05rem;letter-spacing:0.08em;
  text-transform:uppercase;color:var(--accent);
}
.prod-price-big{font-size:1.6rem;}
.prod-doesnot-count{
  font-size:0.78rem;letter-spacing:0.1em;text-transform:uppercase;
  color:var(--steel);font-weight:700;
}

/* ---------- status badge ---------- */
.prod-badge{
  align-self:flex-start;
  font-size:0.7rem;letter-spacing:0.16em;text-transform:uppercase;font-weight:700;
  padding:6px 12px;border:1px solid var(--border);color:var(--muted);
}
.prod-badge-available{border-color:#2f7d32;color:#6fcf73;}
.prod-badge-preorder{border-color:var(--accent);color:#ff5b73;}
.prod-badge-development{border-color:#8a6d1f;color:#e0b53c;}

/* ---------- product page hero ---------- */
.prod-hero-grid{
  display:grid;grid-template-columns:1fr;gap:34px;
  max-width:1180px;margin:0 auto;align-items:start;
}
.prod-hero-art{background:var(--panel);border:1px solid var(--border);padding:0 0 14px;}
.prod-art-note{
  padding:14px 18px 0;font-size:0.78rem;color:var(--steel);line-height:1.5;
}
.prod-hero-body{display:flex;flex-direction:column;gap:16px;}
.prod-action{display:flex;flex-direction:column;gap:10px;align-items:flex-start;}
.prod-action-note{font-size:0.82rem;color:var(--muted);max-width:420px;}
.prod-licence-line{font-size:0.84rem;color:var(--muted);}
.prod-licence-line strong{color:var(--text);}

/* ---------- what it does / does NOT do ---------- */
.prod-does,.prod-doesnot{
  list-style:none;max-width:900px;margin:0 auto;
}
.prod-does li,.prod-doesnot li{
  position:relative;padding:14px 0 14px 34px;color:var(--muted);
  font-size:0.98rem;border-bottom:1px solid var(--border);
}
.prod-does li:last-child,.prod-doesnot li:last-child{border-bottom:none;}
.prod-does li::before{
  content:'';position:absolute;left:4px;top:22px;width:12px;height:12px;
  border-left:2px solid var(--accent);border-bottom:2px solid var(--accent);
  transform:rotate(-45deg);
}
.prod-doesnot-section{
  border-top:3px solid var(--accent);
  background:linear-gradient(180deg,#1a0d10 0%,var(--bg) 60%);
}
.prod-doesnot-lead{color:var(--text);font-weight:600;}
.prod-doesnot li{color:var(--text);}
.prod-doesnot li::before{
  content:'\00d7';position:absolute;left:4px;top:11px;
  color:var(--accent);font-size:1.3rem;font-weight:700;line-height:1;
}

/* ---------- specs ---------- */
.prod-specs{
  max-width:980px;margin:0 auto;border:1px solid var(--border);
  background:var(--panel);
}
.prod-spec-row{
  display:grid;grid-template-columns:1fr;gap:4px;
  padding:16px 20px;border-bottom:1px solid var(--border);
}
.prod-spec-row:last-child{border-bottom:none;}
.prod-spec-label{
  font-size:0.74rem;letter-spacing:0.14em;text-transform:uppercase;
  color:var(--accent);font-weight:700;
}
.prod-spec-value{color:var(--muted);font-size:0.94rem;}

.prod-attribution p,.prod-opensource p{font-size:1rem;}

/* ---------- homepage teaser ---------- */
.prod-teaser{border-top:1px solid var(--border);}
.prod-teaser-head{max-width:1180px;margin:0 auto 18px;text-align:center;}
.prod-teaser-kicker{
  display:block;font-size:0.76rem;letter-spacing:0.22em;text-transform:uppercase;
  color:var(--accent);font-weight:700;margin-bottom:12px;
}
.prod-teaser-h2{
  font-family:'Anton',sans-serif;font-size:clamp(1.6rem,3.2vw,2.5rem);
  text-transform:uppercase;letter-spacing:0.01em;
}
.prod-teaser-lead{
  max-width:720px;margin:0 auto 40px;text-align:center;color:var(--muted);
  font-size:1.05rem;
}
.prod-teaser-grid{
  display:grid;grid-template-columns:1fr;gap:16px;max-width:1180px;margin:0 auto;
}
.prod-teaser-card{
  display:flex;flex-direction:column;gap:10px;padding:22px 20px;
  background:var(--panel);border:1px solid var(--border);
  clip-path:polygon(0 0,calc(100% - 14px) 0,100% 14px,100% 100%,14px 100%,0 calc(100% - 14px));
}
.prod-teaser-card:hover{border-color:var(--accent);background:#191919;}
.prod-teaser-badge{
  align-self:flex-start;font-size:0.66rem;letter-spacing:0.16em;
  text-transform:uppercase;font-weight:700;padding:5px 10px;
  border:1px solid var(--border);color:var(--muted);
}
.prod-teaser-name{
  font-family:'Anton',sans-serif;font-size:1.05rem;text-transform:uppercase;
  letter-spacing:0.02em;color:var(--text);line-height:1.2;
}
.prod-teaser-card:hover .prod-teaser-name{color:var(--accent);}
.prod-teaser-tag{color:var(--muted);font-size:0.9rem;}
.prod-teaser-price{
  margin-top:auto;font-size:0.76rem;letter-spacing:0.12em;text-transform:uppercase;
  color:var(--accent);font-weight:700;
}
.prod-teaser-more{margin-top:28px;text-align:center;}
.prod-teaser-all{
  font-size:0.8rem;letter-spacing:0.16em;text-transform:uppercase;font-weight:700;
  color:var(--accent);border-bottom:1px solid var(--accent);padding-bottom:3px;
}

@media (min-width:700px){
  .prod-spec-row{grid-template-columns:230px 1fr;gap:20px;align-items:baseline;}
  .prod-teaser-grid{grid-template-columns:repeat(2,1fr);}
}
@media (min-width:1000px){
  .prod-grid{grid-template-columns:repeat(2,1fr);}
  .prod-hero-grid{grid-template-columns:1.1fr 1fr;gap:44px;}
  .prod-teaser-grid{grid-template-columns:repeat(4,1fr);}
}