/*
 SIREGENCE — Conservative Variant (pill mapping update)
 - Footer is light
 - Nav hover uses only thick bottom bar
 - Fineprint readable (graphite)
 - Contact card accent respects radius
 - Pill mapping: (1) Blue, (2) Blue, (3) Green, (4) Gold, (5) Red
*/
:root{
  --graphite:#2B2F33;
  --midnight:#11161C;
  --soft:#F3F4F6;
  --blue:#1F4E79;
  --gold:#C8961A;
  --green:#2F6F57;
  --red:#B23A2F;
  --muted:#6B7276;
  --border:#E5E7EB;
}
*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; font-family:Inter, system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif; color:var(--graphite); background:#fff; }

/* Links */
a{ color:var(--blue); text-decoration:none; transition:color .15s ease; }
a:hover{ color:var(--gold); text-decoration:underline; }

/* Layout */
.container{ width:min(1100px, 92vw); margin:0 auto; }

/* Topbar (conservative) */
.topbar{ position:sticky; top:0; z-index:10; backdrop-filter:saturate(140%) blur(8px); background:rgba(255,255,255,0.85); border-bottom:1px solid var(--border); }
.topbar::after{ content:""; position:absolute; left:0; right:0; bottom:-1px; height:2px; pointer-events:none; background: linear-gradient(90deg, var(--blue), var(--gold) 55%, var(--green)); opacity:.55; }
.topbar__inner{ display:flex; align-items:center; justify-content:space-between; gap:16px; padding:18px 0; }

.brand{ display:flex; align-items:center; gap:12px; min-width:0; }
.brand--link{ color:inherit; text-decoration:none; }
.brand--link:hover{ text-decoration:none; }
.brand__type{ min-width:0; }
.brand__mark{ width:64px; height:64px; object-fit:contain; flex:0 0 auto; }
.brand__name{ font-weight:700; letter-spacing:0.8px; font-size:18px; }
.brand__tag{ font-size:12px; color:var(--blue); font-weight:600; margin-top:2px; }

/* Wordmark underline accent (toned down) */
.brand__nameText{ position:relative; display:inline-block; padding-bottom:4px; }
.brand__nameText::after{ content:""; position:absolute; left:0; bottom:0; width:100%; height:2px; background: linear-gradient(90deg, var(--gold), var(--blue) 60%, var(--green)); opacity:.6; border-radius:999px; }

/* Primary nav */
.topnav{ display:flex; align-items:center; gap:18px; flex-wrap:wrap; }
.topnav a{ margin-left:0; font-weight:600; color:var(--graphite); font-size:14px; white-space:nowrap; padding:6px 0; border-bottom:2px solid transparent; transition:border-color .15s ease,color .15s ease; text-decoration:none; }
.topnav a:hover{ color:var(--blue); border-color:var(--blue); text-decoration:none; }

/* Hero — gentle radial tints */
.hero{ background:
  radial-gradient(1200px 400px at 0% 0%, rgba(31,78,121,0.05), transparent 65%),
  radial-gradient(1000px 380px at 100% 0%, rgba(200,150,26,0.06), transparent 60%),
  radial-gradient(900px 360px at 50% 20%, rgba(47,111,87,0.05), transparent 70%),
  linear-gradient(180deg, var(--soft), #fff 70%);
}
.hero__inner{ display:grid; grid-template-columns: 1.25fr 0.75fr; gap:28px; padding:52px 0 44px; }

h1{ font-size:33px; line-height:1.05; margin:0 0 10px; letter-spacing:-0.6px; }
.lead{ font-size:18px; color:var(--graphite); margin:0 0 14px; }

/* Pills — fixed brand mapping (1&2 same) */
.pill-row{ display:flex; gap:8px; flex-wrap:wrap; margin-top:8px; }
.pill{ background:#fff; border:1.5px solid var(--border); color:var(--graphite); border-radius:999px; padding:7px 10px 7px 20px; font-size:12px; font-weight:700; position:relative; isolation:isolate; transition:border-color .15s ease; }
.pill::before{ content:""; width:8px; height:8px; border-radius:50%; position:absolute; left:8px; top:50%; transform:translateY(-50%); background:var(--blue); }
/* Mapping: 1 Blue, 2 Blue, 3 Green, 4 Gold, 5 Red */
.pill:nth-child(1){ border-color:rgba(31,78,121,0.45); }
.pill:nth-child(1)::before{ background:var(--blue); }
.pill:nth-child(2){ border-color:rgba(31,78,121,0.45); }
.pill:nth-child(2)::before{ background:var(--blue); }
.pill:nth-child(3){ border-color:rgba(47,111,87,0.45); }
.pill:nth-child(3)::before{ background:var(--green); }
.pill:nth-child(4){ border-color:rgba(200,150,26,0.45); }
.pill:nth-child(4)::before{ background:var(--gold); }
.pill:nth-child(5){ border-color:rgba(178,58,47,0.45); }
.pill:nth-child(5)::before{ background:var(--red); }

.note{ margin:18px 0 0; color:var(--muted); font-size:13px; }

/* Cards & CTA */
.hero__card{ background:#fff; border:1px solid var(--border); border-radius:18px; padding:18px; box-shadow: 0 10px 25px rgba(17,22,28,0.06); align-self:start; position:relative; overflow:hidden; }
.hero__card::before{ content:""; position:absolute; left:0; right:0; top:0; height:3px; background:linear-gradient(90deg, var(--blue), var(--gold) 55%, var(--green)); opacity:.6; border-top-left-radius:inherit; border-top-right-radius:inherit; }

.card__title{ font-weight:800; color:var(--blue); font-size:12px; letter-spacing:1.6px; text-transform:uppercase; margin-bottom:12px; }

.form{ display:flex; flex-direction:column; gap:10px; }
.field span{ display:block; font-size:12px; font-weight:700; color:var(--graphite); margin-bottom:6px; }
input, textarea{ width:100%; padding:10px 12px; border-radius:12px; border:1px solid var(--border); font-family:inherit; font-size:14px; outline:none; }
input:focus, textarea:focus{ border-color:rgba(31,78,121,0.55); box-shadow: 0 0 0 4px rgba(31,78,121,0.10); }

.btn{ display:inline-flex; align-items:center; justify-content:center; padding:10px 14px; border-radius:12px; font-weight:700; font-size:14px; border:1px solid transparent; cursor:pointer; transition:filter .15s ease, box-shadow .15s ease, transform .04s ease; }
.btn--primary{ background:var(--blue); color:#fff; box-shadow:0 4px 12px rgba(31,78,121,0.22); }
.btn--primary:hover{ filter:brightness(0.98); box-shadow:0 6px 14px rgba(31,78,121,0.28); }
.btn--primary:active{ transform:translateY(1px); }

/* Fineprint readability */
.fineprint{ margin:8px 0 0; font-size:12px; color:var(--graphite); }
.fineprint.subtle{ color:var(--graphite); }

.section{ padding:44px 0; }
h2{ margin:0 0 14px; font-size:22px; letter-spacing:-0.2px; }
p{ margin:0 0 14px; color:var(--graphite); line-height:1.5; }

/* Footer — light */
.footer{ background:#fff; color:var(--graphite); padding:22px 0; }
.footer__inner{ display:flex; justify-content:space-between; gap:18px; border-top:1px solid var(--border); padding-top:18px; position:relative; }
.footer__inner::before{ content:""; position:absolute; left:0; right:0; top:-1px; height:1px; background:linear-gradient(90deg, var(--blue), var(--gold) 55%, var(--green)); opacity:.25; }
.footer__brand{ font-weight:800; letter-spacing:0.6px; color:var(--graphite); }
.small{ font-size:12px; line-height:1.35; }
.subtle{ color:var(--muted); }
.footer a{ color:var(--blue); }
.footer a:hover{ color:var(--gold); }

/* Responsive */
@media (max-width: 900px){
  .hero__inner{ grid-template-columns:1fr; }
  h1{ font-size:36px; }
  .topbar__inner{ flex-wrap:wrap; align-items:flex-start; gap:12px 16px; padding:14px 0; }
  .brand{ flex:1 1 100%; gap:10px; }
  .brand__mark{ width:52px; height:52px; }
  .brand__name{ font-size:16px; }
  .brand__tag{ font-size:11px; }
  .topnav{ width:100%; padding-top:10px; border-top:1px solid var(--border); }
}

/* CTA card */
.btn--full{ width:100%; }
.card__text{ margin:0 0 12px; color:var(--graphite); font-size:13px; line-height:1.5; }

/* Privacy section (compact) */
.privacy p{ font-size:13px; color:var(--graphite); }
.privacy h2{ margin-bottom:10px; }
.privacy .micro{ font-size:12px; color:var(--muted); }

/* Modal */
.no-scroll{ overflow:hidden; }
.modal{ position:fixed; inset:0; display:none; z-index:50; }
.modal.is-open{ display:block; }
.modal__backdrop{ position:absolute; inset:0; background:rgba(17,22,28,0.55); }
.modal__panel{ position:relative; width:min(960px, 94vw); height:min(720px, 88vh); margin:6vh auto 0; background:#fff; border-radius:18px; overflow:hidden; border:1px solid var(--border); box-shadow: 0 24px 60px rgba(17,22,28,0.28); }
.modal__header{ display:flex; align-items:center; justify-content:space-between; padding:12px 14px; border-bottom:1px solid var(--border); background:rgba(255,255,255,0.95); }
.modal__title{ font-weight:800; color:var(--graphite); font-size:14px; letter-spacing:0.2px; }
.modal__close{ width:34px; height:34px; border-radius:10px; border:1px solid var(--border); background:#fff; cursor:pointer; font-size:20px; line-height:30px; color:var(--graphite); }
.modal__close:hover{ border-color:rgba(31,78,121,0.55); color:var(--blue); }
.modal__iframe{ width:100%; height:calc(100% - 58px); border:0; }

/* Subtle motion */
.brand__mark--anim{ transform-origin: 50% 50%; animation: logoIn 700ms cubic-bezier(0.2, 0.8, 0.2, 1) 80ms both; }
@keyframes logoIn{ from{ transform: translateY(6px) scale(0.98); opacity: 0; filter: saturate(0.95); } to{ transform: translateY(0) scale(1); opacity: 1; filter: saturate(1); } }
@media (prefers-reduced-motion: reduce){ .brand__mark--anim{ animation:none; } }

/* Accessibility */
.skip-link{ position:absolute; left:12px; top:10px; padding:10px 12px; background:#fff; border:1px solid var(--border); border-radius:12px; color:var(--graphite); font-weight:700; transform: translateY(-140%); transition: transform 160ms ease; z-index:100; }
.skip-link:focus{ transform: translateY(0); outline: 3px solid rgba(31,78,121,0.35); outline-offset: 2px; }
:focus-visible{ outline: 3px solid rgba(31,78,121,0.35); outline-offset: 2px; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible{ border-radius: 10px; }

/* Small screens */
@media (max-width: 520px){
  .modal__panel{ width: 94vw; height: 92vh; margin: 3vh auto 0; border-radius: 16px; }
  .modal__header{ padding: 10px 12px; }
}
@media (max-width: 520px){
  .topnav{ gap:12px; }
  .topnav a{ font-size:13px; }
}

/* Content cards/services */
.note--intro{ margin-top:18px; max-width:72ch; font-size:16px; line-height:1.65; color:var(--graphite); }
.service-section{ background:#fff; }
.service-section .card-grid{ display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:5px; align-items:stretch; }
.content-card{ height:100%; }
.content-card h2{ margin-bottom:14px; }
.content-card h3{ margin:6px 0 8px; font-size:17px; letter-spacing:-0.1px; }
.content-card p:last-child, .service-item p:last-child{ margin-bottom:0; }
.service-stack{ display:grid; gap:12px; }
.service-item{ background:var(--soft); border:1px solid var(--border); border-radius:14px; padding:14px; position:relative; }
.service-item::before{ content:""; position:absolute; left:14px; right:14px; top:-1px; height:2px; background:linear-gradient(90deg, var(--blue), var(--gold) 55%, var(--green)); border-radius:2px; opacity:.40; }
.list-clean{ margin:8px 0 0; padding-left:20px; }
.list-clean li{ margin:0 0 10px; line-height:1.5; }

.hero--compact .policy-copy{ padding-top:44px; padding-bottom:28px; }
.policy-copy{ width:min(860px, 92vw); margin:0 auto; }
.policy-card{ padding:28px; background:#fff; border:1px solid var(--border); border-radius:18px; box-shadow: 0 10px 25px rgba(17,22,28,0.04); }
.policy-card h2{ margin-top:22px; }
.policy-card h2:first-child{ margin-top:0; }

@media (max-width: 900px){
  .card-grid{ grid-template-columns:1fr; }
  .service-section .card-grid{ grid-template-columns:1fr; }
}