/* Total Tech Systems */
:root {
  --blue-950: #082b49;
  --blue-900: #0d3659;
  --blue-800: #123f68;
  --blue-700: #1f5f91;
  --blue-100: #e8f1f8;
  --silver-700: #59636c;
  --silver-500: #8f9aa3;
  --silver-200: #dce2e7;
  --silver-100: #eef2f5;
  --white: #ffffff;
  --ink: #1e2933;
  --muted: #5b6874;
  --success: #146c43;
  --danger: #9f2d2d;
  --shadow: 0 18px 50px rgba(8, 43, 73, .10);
  --radius: 18px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--ink);
  font-family: Inter, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  line-height: 1.65;
  background:
    radial-gradient(circle at 10% 0%, rgba(31,95,145,.08), transparent 30rem),
    linear-gradient(180deg, #f8fafc 0%, #eef3f7 100%);
}
a { color: var(--blue-700); }
img { max-width: 100%; }
h1,h2,h3 { line-height: 1.15; margin-top: 0; color: var(--blue-950); }
h1 { font-size: clamp(2.4rem, 6vw, 4.6rem); letter-spacing: -.045em; }
h2 { font-size: clamp(1.85rem, 4vw, 3rem); letter-spacing: -.03em; }
h3 { font-size: 1.15rem; }
p { margin: 0 0 1rem; }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.skip-link { position: fixed; left: 1rem; top: -5rem; z-index: 9999; background: var(--white); padding: .75rem 1rem; border-radius: 10px; }
.skip-link:focus { top: 1rem; }

.site-header {
  position: sticky; top: 0; z-index: 1000;
  background: rgba(255,255,255,.92);
  border-bottom: 1px solid rgba(143,154,163,.24);
  backdrop-filter: blur(16px);
}
.header-inner {
  max-width: 1180px; margin: 0 auto; min-height: 92px; padding: .6rem 1.4rem;
  display:flex; align-items:center; justify-content:space-between; gap:2rem;
}
.brand img { display:block; width: min(430px, 42vw); max-height: 78px; object-fit: contain; object-position:left center; }
.site-nav { display:flex; align-items:center; gap:.4rem; }
.site-nav a { color: var(--blue-950); text-decoration:none; font-weight:700; padding:.75rem 1rem; border-radius:999px; }
.site-nav a:hover, .site-nav a.active { background:var(--blue-100); color:var(--blue-800); }
.nav-toggle { display:none; background:none; border:0; padding:.6rem; }
.nav-toggle span:not(.sr-only) { display:block; width:26px; height:2px; margin:5px 0; background:var(--blue-950); }

main { max-width: 1180px; margin:0 auto; padding: 3.5rem 1.4rem 5rem; }
.hero {
  min-height: 600px; display:grid; grid-template-columns: 1.5fr .7fr; gap:3rem; align-items:center;
  padding: clamp(2rem,6vw,5rem); border-radius: 30px;
  background: linear-gradient(135deg, rgba(8,43,73,.98), rgba(31,95,145,.94));
  box-shadow: var(--shadow); color:var(--white); overflow:hidden; position:relative;
}
.hero::after { content:""; position:absolute; inset:auto -10rem -15rem auto; width:35rem; height:35rem; border:1px solid rgba(255,255,255,.14); border-radius:50%; box-shadow:0 0 0 5rem rgba(255,255,255,.03),0 0 0 10rem rgba(255,255,255,.02); }
.hero-content,.hero-panel { position:relative; z-index:1; }
.hero h1,.hero .eyebrow { color:var(--white); }
.hero-copy { max-width: 720px; font-size:1.2rem; color:#dcebf6; }
.eyebrow { margin:0 0 .8rem; color:var(--blue-700); font-weight:800; letter-spacing:.12em; text-transform:uppercase; font-size:.78rem; }
.eyebrow.light { color:#c7deef; }
.hero-actions { display:flex; flex-wrap:wrap; gap:.9rem; margin-top:2rem; }
.button { display:inline-flex; justify-content:center; align-items:center; min-height:48px; padding:.8rem 1.3rem; border-radius:999px; font-weight:800; text-decoration:none; border:0; cursor:pointer; }
.button-primary { background:var(--blue-700); color:var(--white); box-shadow:0 10px 30px rgba(5,34,57,.25); }
.hero .button-primary { background:var(--white); color:var(--blue-900); }
.button-secondary { color:var(--white); border:1px solid rgba(255,255,255,.4); }
.button-light { background:var(--white); color:var(--blue-900); }
.hero-panel { display:grid; gap:1rem; }
.hero-panel div { padding:1.2rem; border:1px solid rgba(255,255,255,.2); border-radius:16px; background:rgba(255,255,255,.08); }
.hero-panel strong,.hero-panel span { display:block; }
.hero-panel strong { font-size:1.35rem; }
.hero-panel span { color:#d9e8f2; font-size:.92rem; }

.section,.split-section,.founder-section,.contact-layout { margin-top:4rem; }
.section-heading { max-width:760px; margin-bottom:2rem; }
.card-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1.2rem; }
.service-card,.values-grid article { padding:1.7rem; border-radius:var(--radius); background:rgba(255,255,255,.9); border:1px solid var(--silver-200); box-shadow:0 8px 26px rgba(8,43,73,.06); }
.service-card .icon { display:grid; place-items:center; width:48px; height:48px; border-radius:14px; margin-bottom:1.2rem; background:var(--blue-100); color:var(--blue-800); font-weight:800; }
.split-section { display:grid; grid-template-columns:1.3fr .7fr; gap:2rem; align-items:center; padding:2.2rem; border-radius:var(--radius); background:var(--white); box-shadow:var(--shadow); }
.check-list { list-style:none; padding:0; margin:1.5rem 0 0; }
.check-list li { position:relative; padding-left:1.8rem; margin:.7rem 0; }
.check-list li::before { content:"✓"; position:absolute; left:0; color:var(--blue-700); font-weight:900; }
.quote-card { padding:2rem; border-radius:var(--radius); background:linear-gradient(150deg,var(--silver-100),var(--blue-100)); }
.quote-card p { font-size:1.25rem; }
.quote-card strong,.quote-card span { display:block; }
.quote-card span { color:var(--muted); }
.cta-band { margin-top:4rem; padding:2.2rem 2.5rem; display:flex; justify-content:space-between; align-items:center; gap:2rem; border-radius:var(--radius); background:linear-gradient(135deg,var(--blue-950),var(--blue-700)); color:var(--white); box-shadow:var(--shadow); }
.cta-band h2 { color:var(--white); margin-bottom:.5rem; }
.cta-band p { color:#d7e7f2; margin-bottom:0; }

.page-hero { padding:3.2rem; border-radius:var(--radius); background:var(--white); box-shadow:var(--shadow); }
.page-hero p:last-child { max-width:760px; font-size:1.15rem; color:var(--muted); }
.accordion { display:grid; gap:.8rem; }
.accordion-item { border:1px solid var(--silver-200); border-radius:14px; overflow:hidden; background:var(--white); }
.accordion-trigger { width:100%; display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1.2rem 1.3rem; border:0; background:transparent; color:var(--blue-950); font:inherit; font-weight:800; text-align:left; cursor:pointer; }
.accordion-trigger:hover { background:var(--blue-100); }
.chevron { font-size:1.6rem; transition:transform .2s ease; }
.accordion-trigger[aria-expanded="true"] .chevron { transform:rotate(45deg); }
.accordion-panel { padding:0 1.3rem 1.2rem; color:var(--muted); }

.founder-section { display:grid; grid-template-columns:minmax(230px,.65fr) 1.35fr; gap:2.5rem; align-items:center; padding:2.2rem; background:var(--white); border-radius:var(--radius); box-shadow:var(--shadow); }
.founder-photo img { width:100%; max-height:460px; object-fit:cover; border-radius:16px; }
.values-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; }

.contact-layout { display:grid; grid-template-columns:1.4fr .6fr; gap:1.5rem; align-items:start; }
.contact-card,.contact-sidebar { padding:2rem; border-radius:var(--radius); background:var(--white); box-shadow:var(--shadow); }
.contact-sidebar { position:sticky; top:120px; }
.contact-sidebar hr { border:0; border-top:1px solid var(--silver-200); margin:1.5rem 0; }
.small { font-size:.9rem; color:var(--muted); }
.contact-form { display:grid; gap:1rem; }
.form-grid { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
.contact-form label { display:block; margin-bottom:.35rem; font-weight:700; color:var(--blue-950); }
.contact-form input,.contact-form textarea { width:100%; padding:.85rem 1rem; border:1px solid #cbd4dc; border-radius:10px; font:inherit; background:#fbfdff; }
.contact-form input:focus,.contact-form textarea:focus { outline:3px solid rgba(31,95,145,.18); border-color:var(--blue-700); }
.captcha-row { max-width:260px; }
.honeypot { position:absolute !important; left:-9999px !important; }
.alert { padding:1rem; margin-bottom:1rem; border-radius:10px; font-weight:700; }
.alert.success { background:#e7f5ed; color:var(--success); }
.alert.error { background:#fbeaea; color:var(--danger); }

.site-footer { color:#dce8f0; background:var(--blue-950); }
.footer-grid { max-width:1180px; margin:0 auto; padding:3rem 1.4rem; display:grid; grid-template-columns:1.3fr .8fr .8fr; gap:2rem; }
.footer-grid a { color:var(--white); }
.footer-bottom { padding:1.1rem 1.4rem; text-align:center; border-top:1px solid rgba(255,255,255,.12); color:#b8c9d5; }

@media (max-width: 850px) {
  .header-inner { min-height:76px; }
  .brand img { width:min(330px,65vw); max-height:62px; }
  .nav-toggle { display:block; }
  .site-nav { display:none; position:absolute; top:76px; left:0; right:0; flex-direction:column; align-items:stretch; padding:1rem; background:var(--white); border-bottom:1px solid var(--silver-200); box-shadow:var(--shadow); }
  .site-nav.open { display:flex; }
  .site-nav a { text-align:center; }
  .hero { grid-template-columns:1fr; min-height:auto; }
  .hero-panel { grid-template-columns:repeat(3,1fr); }
  .card-grid { grid-template-columns:repeat(2,1fr); }
  .split-section,.founder-section,.contact-layout { grid-template-columns:1fr; }
  .contact-sidebar { position:static; }
  .values-grid { grid-template-columns:repeat(2,1fr); }
  .cta-band { align-items:flex-start; flex-direction:column; }
}
@media (max-width: 560px) {
  main { padding:2rem 1rem 4rem; }
  .brand img { width:min(260px,72vw); max-height:56px; }
  .hero,.page-hero,.section,.split-section,.founder-section,.contact-card,.contact-sidebar { padding:1.35rem; }
  .hero-actions { flex-direction:column; }
  .hero-actions .button { width:100%; }
  .hero-panel,.card-grid,.values-grid,.form-grid,.footer-grid { grid-template-columns:1fr; }
  .cta-band { padding:1.6rem; }
}
