
/* ===== Crestline Autolocks-style Skin ===== */

/* Normalize weird template rules */
header, footer { position: initial !important; bottom: auto !important; }
html { box-sizing: border-box; }
*, *::before, *::after { box-sizing: inherit; }

:root{
  --ink: #2665AA;      /* Light blue navy */
  --accent: #F15A29;   /* orange accent */
  --muted: #6B7280;
  --bg: #FFFFFF;
  --ring: rgba(14,42,71,.12);
  --radius: 12px;
}

html, body{
  margin:0; padding:0; background:var(--bg); color:#111827;
  font-family:"Plus Jakarta Sans", system-ui, -apple-system, Segoe UI, Roboto, Arial, sans-serif;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
}

a{ color:var(--ink); text-underline-offset:2px; text-decoration-thickness:1.2px; }
a:hover{ text-decoration-thickness:2px; }

.container{ max-width:1100px; margin:0 auto; padding:0 1.25rem; }

h1,h2,h3{ font-family:"Manrope","Plus Jakarta Sans",system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif; color:var(--ink); margin:0 0 .4rem; }
h1{ font-weight:800; font-size:clamp(2.1rem, 1.6rem + 2.2vw, 3.4rem); letter-spacing:-.02em; line-height:.98; }
h2{ font-weight:800; font-size:clamp(1.5rem, 1.2rem + 1.2vw, 2.2rem); }
h3{ font-weight:700; font-size:clamp(1.15rem, 1rem + .6vw, 1.35rem); }

.small{ font-size:.95rem; color:var(--muted); }

.stack-sm > * + *{ margin-top:.5rem; }
.stack-md > * + *{ margin-top:1rem; }
.stack-lg > * + *{ margin-top:1.5rem; }

/* Topbar similar to autolocks */
.site-topbar{ position:sticky; top:0; z-index:999; background:#fff; border-bottom:1px solid #e5e7eb; }
.site-topbar .bar{ display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:.75rem 0; }
.site-topbar .brand{ display:flex; align-items:center; gap:.6rem; text-decoration:none; color:var(--ink); font-weight:800; }
.site-topbar .brand img{ height:34px; width:auto; }
.site-topbar nav{ display:flex; gap:1rem; flex-wrap:wrap; }
.site-topbar nav a{ text-decoration:none; color:var(--ink); font-weight:600; }
.top-cta a{ display:inline-flex; align-items:center; padding:.55rem .9rem; border-radius:999px; background:var(--ink); color:#fff; text-decoration:none; font-weight:800; box-shadow:0 6px 16px rgba(14,42,71,.18);}
.top-cta a:hover{ background:#122f54; }

/* Hero block with image */
.hero-block{ position:relative; isolation:isolate; color:#fff; padding:clamp(2.5rem, 2rem + 4vw, 6rem) 0; }
.hero-block .media{ position:absolute; inset:0; z-index:-1; }
.hero-block picture, .hero-block img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
.hero-block::after{ content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(180deg, rgba(10,22,38,.55) 0%, rgba(10,22,38,.35) 35%, rgba(10,22,38,.6) 100%); }
.hero-block .eyebrow{ text-transform:uppercase; letter-spacing:.12em; color:#e5e7eb; font-weight:700; font-size:.85rem; }
.hero-block .title mark{ background:linear-gradient(90deg, var(--accent), #FFB703); -webkit-background-clip:text; background-clip:text; color:transparent; padding:0 .06em; }
.hero-block .sub{ font-weight:600; font-size:clamp(1.05rem, .9rem + .6vw, 1.35rem); color:#F3F4F6; }

/* Buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:.5rem; padding:.9rem 1.15rem; border-radius:var(--radius); font-weight:800; text-decoration:none; border:2px solid transparent; transition:transform .08s ease, box-shadow .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease; }
.btn:active{ transform:translateY(1px); }
.btn-primary{ background:var(--ink); color:#fff; border-color:var(--ink); box-shadow:0 6px 18px rgba(14,42,71,.18); }
.btn-primary:hover{ background:#122f54; }
.btn-outline{ background:transparent; color:#fff; border-color:rgba(255,255,255,.55); }
.btn-outline:hover{ border-color:#fff; }

/* Cards grid and locations */
.card-grid{ display:grid; gap:1.25rem; grid-template-columns:repeat(auto-fit, minmax(260px,1fr)); }
.card{ border:1px solid #e5e7eb; border-radius:var(--radius); padding:1.1rem; background:#fff; box-shadow:0 1px 0 var(--ring); }
.link-grid{ columns:2; gap:2rem; list-style:none; padding:0; }
.link-grid li{ margin:0 0 .5rem 0; }

/* Footer */
.site-footer{ border-top:1px solid #e5e7eb; margin-top:2rem; }
.site-footer .inner{ padding:1rem 0; }
