/*
Theme Name: Brinton Kay
Theme URI: https://brintonkay.com
Author: Brinton Kay Technology Solutions
Description: Custom theme for Brinton Kay Technology Solutions, built on the approved Brand & Style Guide v1.0. Ported from the approved static prototype (bktech_new_site_static).
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: brinton-kay
*/

@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500;600&family=Inter:wght@400;500;600&display=swap');

:root{
  --navy:#192944;
  --blue:#426CB4;
  --blue-dim:#345896;
  --amber:#D97F1F;
  --amber-dim:#B8690F;
  --paper:#F7F9FC;
  --paper-dim:#EDF1F8;
  --white:#FFFFFF;
  --slate:#5B6472;
  --line:#DCE2ED;
  --mono:'IBM Plex Mono', monospace;
  --sans:'IBM Plex Sans', sans-serif;
  --body:'Inter', sans-serif;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0; background:var(--paper); color:var(--navy);
  font-family:var(--body); line-height:1.6; font-size:16px;
}
img{max-width:100%; display:block;}
a{color:inherit;}
.wrap{max-width:1160px; margin:0 auto; padding:0 32px;}
@media (max-width:700px){ .wrap{padding:0 20px;} }

/* ---------- Utility: node/connector motif ---------- */
.connector{display:flex; align-items:center; gap:0; margin:0 0 40px;}
.connector .n{width:7px;height:7px;border-radius:50%;background:var(--blue); flex:none;}
.connector .l{height:1px; background:var(--line); flex:1;}
.hatch{
  position:absolute; inset:0; opacity:0.05; pointer-events:none;
  background-image: repeating-linear-gradient(115deg, currentColor 0, currentColor 1px, transparent 1px, transparent 14px);
}
.eyebrow-mono{
  font-family:var(--mono); font-size:12.5px; letter-spacing:.12em; text-transform:uppercase;
  display:flex; align-items:center; gap:10px; margin-bottom:20px; color:var(--blue-dim);
}
.eyebrow-mono .node{width:6px;height:6px;border-radius:50%;background:var(--amber);display:inline-block;}
.section-num{font-family:var(--mono); font-size:13px; color:var(--blue); font-weight:600; margin-right:14px;}

/* ---------- Nav ---------- */
header.site-nav{
  border-bottom:1px solid var(--line); background:var(--white);
  position:sticky; top:0; z-index:50;
}
.nav-inner{display:flex; align-items:center; justify-content:space-between; padding:16px 32px; max-width:1160px; margin:0 auto;}
.nav-logo img{height:56px; width:auto;}
.nav-links{display:flex; gap:30px; font-size:14px; font-weight:500; list-style:none; margin:0; padding:0;}
.nav-links a{text-decoration:none; color:var(--slate); padding:6px 2px; border-bottom:2px solid transparent; transition:color .15s, border-color .15s;}
.nav-links a:hover{color:var(--navy);}
.nav-links a.active,.nav-links li.current-menu-item a,.nav-links li.current_page_item a{color:var(--navy); border-bottom-color:var(--amber);}
.nav-cta{
  font-family:var(--sans); font-weight:600; font-size:13.5px; background:var(--amber); color:var(--white);
  padding:10px 18px; border-radius:2px; text-decoration:none; white-space:nowrap;
}
.nav-toggle{
  display:none; background:none; border:none; cursor:pointer; padding:6px; margin-left:12px;
}
.nav-toggle span{display:block; width:22px; height:2px; background:var(--navy); margin:4px 0;}
@media (max-width:900px){
  .nav-links{
    display:none; position:absolute; top:100%; left:0; right:0; background:var(--white);
    flex-direction:column; gap:0; border-bottom:1px solid var(--line); padding:8px 20px;
  }
  .nav-links.open{display:flex;}
  .nav-links li{width:100%; border-bottom:1px solid var(--line);}
  .nav-links li:last-child{border-bottom:none;}
  .nav-links a{display:block; padding:12px 2px;}
  .nav-cta{padding:8px 14px; font-size:12.5px;}
  .nav-toggle{display:block;}
}

/* ---------- Buttons ---------- */
.btn{
  font-family:var(--sans); font-weight:600; font-size:14px; display:inline-flex; align-items:center; gap:8px;
  padding:13px 24px; border-radius:2px; text-decoration:none; border:none; cursor:pointer;
}
.btn-primary{background:var(--amber); color:var(--white);}
.btn-primary:hover{background:var(--amber-dim);}
.btn-secondary{background:transparent; color:var(--navy); border:1px solid var(--line);}
.btn-secondary:hover{border-color:var(--navy);}
.btn-on-navy{background:transparent; color:var(--white); border:1px solid rgba(255,255,255,0.35);}
.btn-on-navy:hover{border-color:var(--white);}

/* ---------- Hero blocks ---------- */
.hero{
  background:var(--navy); color:var(--white); padding:88px 0 76px; position:relative; overflow:hidden;
}
.hero .wrap{position:relative; z-index:1;}
.hero .eyebrow-mono{color:#9FB4DC;}
.hero h1{font-family:var(--sans); font-weight:700; font-size:48px; line-height:1.12; margin:0 0 20px; letter-spacing:-0.01em; max-width:700px;}
.hero p.lede{font-size:18px; color:#C7D2E8; max-width:560px; margin:0 0 34px;}
.hero-actions{display:flex; gap:14px; flex-wrap:wrap;}
.page-hero{
  background:var(--paper-dim); padding:64px 0 48px; border-bottom:1px solid var(--line);
}
.page-hero h1{font-family:var(--sans); font-weight:700; font-size:38px; margin:0 0 14px; letter-spacing:-0.01em;}
.page-hero p{color:var(--slate); max-width:600px; font-size:16px; margin:0;}

@media (max-width:700px){
  .hero h1{font-size:32px;}
  .page-hero h1{font-size:28px;}
}

/* ---------- Sections ---------- */
section{padding:72px 0;}
section.tight{padding:56px 0;}
section.bordered{border-bottom:1px solid var(--line);}
.section-head{display:flex; align-items:baseline; margin-bottom:8px;}
h2.section-title{font-family:var(--sans); font-size:28px; font-weight:700; margin:0; letter-spacing:-0.01em;}
p.section-sub{color:var(--slate); max-width:620px; margin:14px 0 44px; font-size:15.5px;}

/* ---------- Cards / grids ---------- */
.grid-3{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.grid-2{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.card{background:var(--white); padding:32px 28px;}
.card .k{font-family:var(--mono); font-size:11px; color:var(--blue-dim); margin-bottom:14px; letter-spacing:.03em;}
.card h3{font-family:var(--sans); font-size:18px; margin:0 0 10px;}
.card p{font-size:14.5px; color:var(--slate); margin:0 0 16px;}
.card a.card-link{font-size:13.5px; font-weight:600; color:var(--blue-dim); text-decoration:none;}
.card a.card-link:hover{color:var(--navy);}
@media (max-width:860px){
  .grid-3{grid-template-columns:1fr;}
  .grid-2{grid-template-columns:1fr;}
}

/* ---------- Stack tags ---------- */
.stack-tags{display:flex; flex-wrap:wrap; gap:8px;}
.stack-tag{font-family:var(--mono); font-size:12px; padding:6px 11px; border:1px solid var(--line); background:var(--white); color:var(--slate);}

/* ---------- Signature step / process ---------- */
.sig-steps{display:flex; align-items:flex-start; position:relative; z-index:1;}
.sig-step{flex:1; text-align:center; position:relative; padding:0 8px;}
.sig-step .n{width:11px;height:11px;border-radius:50%;background:var(--paper); border:2px solid var(--blue); margin:0 auto 14px; position:relative; z-index:2;}
.sig-step.active .n{background:var(--blue);}
.sig-step .lbl{font-family:var(--mono); font-size:11.5px; letter-spacing:.03em; margin-bottom:6px;}
.sig-step p{font-size:13px; color:var(--slate); margin:0;}
.sig-line{position:absolute; top:5px; left:50%; right:-50%; height:1px; background:var(--blue); opacity:0.4; z-index:1;}
.sig-step:last-child .sig-line{display:none;}
@media (max-width:700px){ .sig-steps{flex-direction:column; gap:24px;} .sig-line{display:none;} }

/* ---------- Stat strip ---------- */
.stat-strip{display:flex; gap:0; border:1px solid var(--line); background:var(--white);}
.stat{flex:1; padding:26px 24px; border-right:1px solid var(--line); text-align:center;}
.stat:last-child{border-right:none;}
.stat .num{font-family:var(--sans); font-weight:700; font-size:30px; color:var(--navy);}
.stat .lbl{font-family:var(--mono); font-size:11px; color:var(--slate); text-transform:uppercase; letter-spacing:.05em; margin-top:6px;}
@media (max-width:700px){ .stat-strip{flex-wrap:wrap;} .stat{flex:1 1 50%; border-bottom:1px solid var(--line);} }

/* ---------- Testimonial ---------- */
.testimonial{background:var(--navy); color:var(--white); padding:64px 0; position:relative; overflow:hidden;}
.testimonial .hatch{color:var(--white);}
.testimonial blockquote{
  font-family:var(--sans); font-weight:600; font-size:26px; line-height:1.4; max-width:780px; margin:0 0 24px;
  position:relative; z-index:1;
}
.testimonial cite{font-family:var(--mono); font-size:13px; color:#9FB4DC; font-style:normal; position:relative; z-index:1;}

/* ---------- Forms ---------- */
.form-panel{background:var(--white); border:1px solid var(--line); padding:36px;}
.form-row{margin-bottom:18px;}
.form-row label{display:block; font-size:13px; font-weight:600; margin-bottom:7px; color:var(--navy);}
.form-row input, .form-row select, .form-row textarea{
  width:100%; padding:11px 13px; border:1px solid var(--line); font-family:var(--body); font-size:14px;
  background:var(--paper); color:var(--navy); border-radius:2px;
}
.form-row textarea{resize:vertical; min-height:110px;}
.form-row input:focus, .form-row select:focus, .form-row textarea:focus{outline:2px solid var(--blue); outline-offset:1px; background:var(--white);}
.form-note{font-family:var(--mono); font-size:11px; color:var(--slate); margin-top:14px;}

/* ---------- Contact segment cards ---------- */
.contact-option{
  background:var(--white); border:1px solid var(--line); padding:30px 26px; display:flex; flex-direction:column; gap:12px;
}
.contact-option .k{font-family:var(--mono); font-size:11px; color:var(--blue-dim);}
.contact-option h3{font-family:var(--sans); font-size:17px; margin:0;}
.contact-option p{font-size:14px; color:var(--slate); margin:0; flex:1;}

/* ---------- Resource cards ---------- */
.resource-card{background:var(--white); border:1px solid var(--line); padding:28px; display:flex; flex-direction:column; gap:14px;}
.resource-card .fmt{font-family:var(--mono); font-size:10.5px; color:var(--white); background:var(--blue); display:inline-block; padding:3px 8px; width:fit-content;}
.resource-card h3{font-family:var(--sans); font-size:16.5px; margin:0;}
.resource-card p{font-size:13.5px; color:var(--slate); margin:0; flex:1;}
.gated-note{font-family:var(--mono); font-size:11px; color:var(--slate); border-top:1px solid var(--line); padding-top:12px;}

/* ---------- Marketplace badges ---------- */
.mp-badge{
  display:inline-flex; align-items:center; gap:10px; border:1px solid var(--line); background:var(--white);
  padding:12px 18px; font-family:var(--mono); font-size:12.5px; color:var(--navy);
}
.mp-badge .dot{width:8px;height:8px;border-radius:50%;}
.mp-badge.live .dot{background:#3E7A2E;}
.mp-badge.soon .dot{background:var(--amber);}

/* ---------- Team ---------- */
.team-card{background:var(--white); border:1px solid var(--line); padding:26px; text-align:left;}
.team-avatar{width:56px; height:56px; border-radius:50%; background:var(--paper-dim); border:2px solid var(--blue); margin-bottom:16px; display:flex; align-items:center; justify-content:center; font-family:var(--sans); font-weight:700; color:var(--blue-dim); font-size:18px;}
.team-card h3{font-family:var(--sans); font-size:16px; margin:0 0 3px;}
.team-card .role{font-family:var(--mono); font-size:11.5px; color:var(--slate); margin-bottom:12px;}
.team-card p{font-size:13.5px; color:var(--slate); margin:0;}

/* ---------- Generic page content (for admin-added copy under templates) ---------- */
.page-content-block{padding:0 0 8px;}
.page-content-block .wrap > *:first-child{margin-top:0;}

/* ---------- Footer ---------- */
footer.site-footer{background:var(--navy); color:#C7D2E8; padding:56px 0 28px;}
.footer-grid{display:grid; grid-template-columns:2fr 1fr 1fr 1fr; gap:40px; margin-bottom:40px;}
.footer-grid img{height:30px; margin-bottom:16px;}
.footer-grid p{font-size:13.5px; color:#9FB4DC; max-width:280px;}
.footer-col h4{font-family:var(--mono); font-size:11.5px; letter-spacing:.06em; text-transform:uppercase; color:#7C8FB8; margin:0 0 16px;}
.footer-col ul{list-style:none; margin:0; padding:0;}
.footer-col li{margin-bottom:10px;}
.footer-col a{text-decoration:none; color:#C7D2E8; font-size:13.5px;}
.footer-col a:hover{color:var(--white);}
.footer-bottom{border-top:1px solid rgba(255,255,255,0.12); padding-top:20px; display:flex; justify-content:space-between; font-family:var(--mono); font-size:11px; color:#7C8FB8; flex-wrap:wrap; gap:10px;}
@media (max-width:860px){ .footer-grid{grid-template-columns:1fr 1fr; } }
@media (max-width:560px){ .footer-grid{grid-template-columns:1fr;} }