/*
 Theme Name:   Terry Smith LLC
 Theme URI:    https://terrysmithllc.com
 Description:  Child theme of Astra for Terry Smith LLC
 Author:       Terry Smith LLC
 Template:     astra
 Version:      1.0.7
*/

:root{
  --ts-bg: #0c0f13;
  --ts-bg-alt: #12161c;
  --ts-border: #23282f;
  --ts-text: #e7e9ec;
  --ts-text-dim: #a2aab3;
  --ts-accent: #4f8ff7;
  --ts-accent-dim: #2a4a7c;
  --ts-mono: 'JetBrains Mono', 'Fira Code', ui-monospace, SFMono-Regular, Menlo, monospace;
  --ts-sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

body{
  background: var(--ts-bg) !important;
  color: var(--ts-text) !important;
  font-family: var(--ts-sans) !important;
}

a{ color: var(--ts-accent); }
a:hover{ color: #7aabf9; }

/* Header */
.site-header, .main-header-bar, .ast-primary-header-bar{
  background: var(--ts-bg) !important;
  border-bottom: 1px solid var(--ts-border) !important;
}
.ast-site-identity img, .custom-logo, .site-logo-img img{
  max-height: 34px !important;
  width: auto !important;
}
.site-title{
  font-size: 19px !important;
  font-weight: 700 !important;
  color: var(--ts-text) !important;
  line-height: 1.2 !important;
}
.site-title a{ color: var(--ts-text) !important; }
.ast-site-title-wrap{
  display: block !important;
}
.ast-site-title-wrap::after{
  content: "Software & Infrastructure Consulting";
  display: block;
  font-size: 11px;
  color: var(--ts-text-dim);
  letter-spacing: 0.02em;
  margin-top: 1px;
}
.main-header-menu .menu-item > a, .main-navigation ul li a{
  color: var(--ts-text-dim) !important;
  font-weight: 500;
}
.main-header-menu .menu-item > a:hover, .main-navigation ul li a:hover{
  color: var(--ts-text) !important;
}
.ast-header-button .ast-button, .ts-btn{
  background: var(--ts-accent) !important;
  color: #05070a !important;
  border-radius: 6px;
  padding: 10px 18px !important;
  font-weight: 600;
  border: none !important;
}
.ast-header-button .ast-button:hover{
  background: #7aabf9 !important;
}

/* Content area */
.ast-separate-container, .site-content, #content, .ast-container{
  background: var(--ts-bg) !important;
}
.entry-content, .page-content{
  color: var(--ts-text);
}

/* Custom section blocks */
.ts-hero{
  padding: 96px 24px 64px;
  max-width: 1040px;
  margin: 0 auto;
  text-align: left;
}
.ts-eyebrow{
  font-family: var(--ts-mono);
  color: var(--ts-accent);
  font-size: 13px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 18px;
  display: block;
}
.ts-hero h1{
  font-size: clamp(2.2rem, 5vw, 3.4rem);
  line-height: 1.15;
  color: var(--ts-text);
  margin: 0 0 22px;
  font-weight: 700;
}
.ts-hero h1 em{
  color: var(--ts-accent);
  font-style: normal;
}
.ts-hero p.ts-lead{
  font-size: 1.15rem;
  color: var(--ts-text-dim);
  max-width: 640px;
  margin: 0 0 32px;
  line-height: 1.6;
}
.ts-cta-row{
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  margin-bottom: 40px;
}
.ts-btn-primary{
  background: var(--ts-accent) !important;
  color: #05070a !important;
  padding: 13px 24px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  display: inline-block !important;
  border: none !important;
  line-height: 1.4 !important;
}
.ts-btn-primary:hover{ background:#7aabf9 !important; color:#05070a !important; text-decoration:none !important; }
.ts-btn-secondary{
  background: transparent !important;
  color: var(--ts-text) !important;
  padding: 13px 24px !important;
  border-radius: 6px !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  border: 1px solid var(--ts-border) !important;
  display: inline-block !important;
  line-height: 1.4 !important;
}
.ts-btn-secondary:hover{ border-color: var(--ts-accent) !important; color: var(--ts-accent) !important; text-decoration:none !important; }

.ts-terminal{
  background: var(--ts-bg-alt);
  border: 1px solid var(--ts-border);
  border-radius: 10px;
  padding: 22px 24px;
  font-family: var(--ts-mono);
  font-size: 14px;
  color: #8fd19e;
  max-width: 640px;
  line-height: 1.8;
  margin: 0 0 40px;
  overflow-x: auto;
}
.ts-terminal .ts-dim{ color: var(--ts-text-dim); }
.ts-terminal .ts-cmd{ color: #e7e9ec; }

.ts-section{
  max-width: 1040px;
  margin: 0 auto;
  padding: 56px 24px;
  border-top: 1px solid var(--ts-border);
}
.ts-section h2{
  font-size: clamp(1.6rem, 3vw, 2.1rem);
  color: var(--ts-text);
  margin: 0 0 12px;
  font-weight: 700;
}
.ts-section p.ts-section-lead{
  color: var(--ts-text-dim);
  font-size: 1.05rem;
  max-width: 640px;
  margin: 0 0 40px;
  line-height: 1.6;
}

.ts-grid-2{
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}
.ts-grid-4{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}
.ts-grid-3{
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}
@media (max-width: 900px){
  .ts-grid-2, .ts-grid-4, .ts-grid-3{ grid-template-columns: 1fr; }
}
.ts-tag{
  display: block;
  font-family: var(--ts-mono);
  color: var(--ts-text-dim);
  font-size: 11px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  margin-bottom: 10px;
}
.ts-card h3 a{
  color: var(--ts-text) !important;
  text-decoration: none !important;
}
.ts-card h3 a:hover{ color: var(--ts-accent) !important; }

.ts-card{
  background: var(--ts-bg-alt);
  border: 1px solid var(--ts-border);
  border-radius: 10px;
  padding: 26px;
}
.ts-card h3{
  color: var(--ts-text);
  font-size: 1.15rem;
  margin: 0 0 12px;
  font-weight: 600;
}
.ts-card ul{ margin: 0; padding-left: 18px; color: var(--ts-text-dim); }
.ts-card ul li{ margin-bottom: 6px; line-height: 1.55; }
.ts-card .ts-num{
  font-family: var(--ts-mono);
  color: var(--ts-accent);
  font-size: 13px;
  display: block;
  margin-bottom: 10px;
}

.ts-cta-band{
  max-width: 1040px;
  margin: 0 auto;
  padding: 56px 24px 88px;
  border-top: 1px solid var(--ts-border);
  text-align: left;
}
.ts-cta-band h2{ color: var(--ts-text); font-size: 1.7rem; margin: 0 0 14px; }
.ts-cta-band p{ color: var(--ts-text-dim); margin: 0 0 24px; max-width: 560px; }

.ts-contact-block{
  max-width: 1040px;
  margin: 0 auto;
  padding: 40px 24px 20px;
}
.ts-contact-block dl{ display: grid; grid-template-columns: 140px 1fr; gap: 10px 20px; }
.ts-contact-block dt{ color: var(--ts-text-dim); font-family: var(--ts-mono); font-size: 13px; }
.ts-contact-block dd{ color: var(--ts-text); margin: 0; }

/* Footer */
.site-footer, .ast-small-footer, footer{
  background: var(--ts-bg) !important;
  border-top: 1px solid var(--ts-border) !important;
}
.ast-small-footer-wrap, .ast-footer-copyright, .site-footer p, .site-footer a{
  color: var(--ts-text-dim) !important;
}
.site-footer a:hover{ color: var(--ts-accent) !important; }

/* Page title bar off (custom hero replaces it) */
.ast-archive-title, .page-header, .entry-header{ display: none; }

/* Nav CTA button */
.main-header-menu .ts-nav-cta,
.main-header-menu .ts-nav-phone{
  display: inline-flex !important;
  align-items: center !important;
  height: auto !important;
}
.ts-nav-cta > a{
  background: var(--ts-accent) !important;
  color: #05070a !important;
  border-radius: 999px !important;
  padding: 8px 18px !important;
  margin: 0 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  line-height: 1.2 !important;
  height: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  width: auto !important;
  display: inline-flex !important;
  align-items: center !important;
  align-self: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}
.ts-nav-cta > a:hover{ background: #7aabf9 !important; color:#05070a !important; text-decoration:none !important; }

/* Nav phone pill */
.ts-nav-phone > a{
  border: 1px solid var(--ts-border) !important;
  border-radius: 999px !important;
  padding: 7px 16px !important;
  margin: 0 !important;
  font-family: var(--ts-mono) !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  line-height: 1.2 !important;
  height: auto !important;
  color: var(--ts-text) !important;
  display: inline-flex !important;
  align-items: center !important;
  align-self: center !important;
  text-decoration: none !important;
  white-space: nowrap !important;
  box-sizing: border-box !important;
}
.ts-nav-phone > a:hover{ border-color: var(--ts-accent) !important; color: var(--ts-accent) !important; text-decoration:none !important; }
