@import url("https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;500;600;700&family=Zilla+Slab:wght@500;600&display=swap");

:root {
  --sq-navy: #1a2438;
  --sq-sand: #e8dcc8;
  --sq-sand-dark: #d4c4a8;
  --sq-ink: #0f1520;
  --sq-muted: #6b7280;
  --sq-font-ui: "Space Grotesk", "Segoe UI", sans-serif;
  --sq-font-slab: "Zilla Slab", Georgia, serif;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.sleekque-body {
  margin: 0;
  font-family: var(--sq-font-ui);
  font-size: 1.05rem;
  line-height: 1.65;
  color: var(--sq-ink);
  background: var(--sq-sand);
}

h1, h2, .sleekque-logo {
  font-family: var(--sq-font-slab);
  font-weight: 600;
  line-height: 1.15;
}

a { color: var(--sq-navy); }

/* H09 utility + main bar */
.sleekque-utility {
  background: var(--sq-navy);
  color: var(--sq-sand);
  font-size: 0.78rem;
  padding: 0.35rem 1rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.5rem;
}
.sleekque-utility a { color: var(--sq-sand); text-decoration: none; }

.sleekque-header {
  text-align: center;
  padding: 1.25rem 1rem 0.75rem;
  background: var(--sq-sand);
  border-bottom: 1px solid var(--sq-sand-dark);
}
.sleekque-logo {
  display: inline-block;
  font-size: clamp(1.5rem, 4vw, 2.1rem);
  letter-spacing: 0.02em;
  color: var(--sq-navy);
  text-decoration: none;
  transition: letter-spacing 0.6s ease;
}
.sleekque-logo.is-settled { letter-spacing: 0.06em; }
.sleekque-nav-main {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.25rem;
  list-style: none;
  margin: 0.75rem 0 0;
  padding: 0;
  font-size: 0.92rem;
  font-weight: 500;
}
.sleekque-nav-main a { text-decoration: none; color: var(--sq-ink); }

.sleekque-nav-toggle {
  display: none;
  margin: 0.5rem auto 0;
  border: 1px solid var(--sq-navy);
  background: transparent;
  padding: 0.4rem 0.85rem;
  font: inherit;
  cursor: pointer;
}

/* L02 typographic first fold */
.sleekque-fold {
  max-width: 40rem;
  margin: 2rem auto;
  padding: 0 1.25rem;
  text-align: center;
}
.sleekque-fold h1 { font-size: clamp(2rem, 5vw, 2.75rem); margin: 0 0 0.75rem; }

/* Y09 tall color panel + text */
.sleekque-hero-split {
  display: grid;
  grid-template-columns: 2fr 3fr;
  gap: 0;
  max-width: 64rem;
  margin: 0 auto 2rem;
  min-height: 22rem;
}
.sleekque-hero-color {
  background: var(--sq-navy);
  color: var(--sq-sand);
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}
.sleekque-hero-color h2 { margin: 0 0 0.5rem; font-size: 1.35rem; color: var(--sq-sand); }
.sleekque-hero-text {
  padding: 2rem 1.5rem;
  background: var(--sq-sand);
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.sleekque-btn {
  display: inline-block;
  background: var(--sq-navy);
  color: var(--sq-sand);
  padding: 0.6rem 1.1rem;
  text-decoration: none;
  font-weight: 600;
  font-size: 0.92rem;
  margin-top: 0.75rem;
}

/* Horizontal service list */
.sleekque-services-row {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  border-block: 2px solid var(--sq-navy);
  max-width: 64rem;
  margin: 0 auto 2rem;
}
.sleekque-services-row a {
  flex: 1 1 12rem;
  padding: 1rem 1.25rem;
  text-decoration: none;
  color: var(--sq-ink);
  border-right: 1px solid var(--sq-sand-dark);
  font-weight: 600;
  font-size: 0.95rem;
}
.sleekque-services-row a:last-child { border-right: none; }
.sleekque-services-row a:hover { background: var(--sq-navy); color: var(--sq-sand); }

/* Large quote */
.sleekque-quote {
  max-width: 52rem;
  margin: 2.5rem auto;
  padding: 0 1.5rem;
  font-family: var(--sq-font-slab);
  font-size: clamp(1.35rem, 3vw, 1.85rem);
  line-height: 1.4;
  color: var(--sq-navy);
  border-left: 4px solid var(--sq-navy);
  padding-left: 1.25rem;
}

/* 40/60 panel */
.sleekque-split-panel {
  display: grid;
  grid-template-columns: 2fr 3fr;
  max-width: 64rem;
  margin: 2rem auto;
}
.sleekque-split-text { padding: 2rem 1.5rem; }
.sleekque-split-color {
  background: var(--sq-navy);
  color: var(--sq-sand);
  padding: 2rem 1.5rem;
}

/* S13 dark/light flips */
.sleekque-flip-dark {
  background: var(--sq-navy);
  color: var(--sq-sand);
  padding: 2.5rem 1.5rem;
}
.sleekque-flip-dark a { color: var(--sq-sand-dark); }
.sleekque-flip-light {
  background: var(--sq-sand);
  color: var(--sq-ink);
  padding: 2.5rem 1.5rem;
}

main.sleekque-main {
  max-width: 42rem;
  margin: 0 auto;
  padding: 1rem 1.5rem 2rem;
}

/* C17 FAQ spine */
.sleekque-faq details {
  border-bottom: 1px solid var(--sq-sand-dark);
  padding: 0.75rem 0;
}
.sleekque-faq summary {
  cursor: pointer;
  font-weight: 600;
  font-family: var(--sq-font-slab);
  list-style: none;
}
.sleekque-faq summary::-webkit-details-marker { display: none; }

/* K24 legal small print + form */
.sleekque-contact-block {
  max-width: 64rem;
  margin: 2rem auto;
  padding: 2rem 1.5rem;
  border-top: 1px solid var(--sq-sand-dark);
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 2rem;
}
.sleekque-small-print { font-size: 0.78rem; color: var(--sq-muted); line-height: 1.5; }
.sleekque-form {
  display: grid;
  gap: 0.65rem;
}
.sleekque-form label { display: grid; gap: 0.2rem; font-size: 0.88rem; }
.sleekque-form input,
.sleekque-form textarea,
.sleekque-form select {
  font: inherit;
  padding: 0.5rem 0.6rem;
  border: 1px solid var(--sq-sand-dark);
  background: #fff;
}
.sleekque-form-success {
  grid-column: 1 / -1;
  padding: 0.65rem;
  background: var(--sq-sand-dark);
  font-size: 0.9rem;
}

/* F11 footer */
.sleekque-footer {
  background: var(--sq-navy);
  color: var(--sq-sand);
  padding: 2rem 1.5rem;
  text-align: center;
}
.sleekque-footer-mail {
  font-family: var(--sq-font-slab);
  font-size: 1.25rem;
  margin-bottom: 0.75rem;
}
.sleekque-footer-mail a { color: var(--sq-sand); text-decoration: none; }
.sleekque-footer-links {
  list-style: none;
  margin: 1rem 0 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.25rem;
  font-size: 0.85rem;
}
.sleekque-footer-links a { color: var(--sq-sand-dark); text-decoration: none; }
.sleekque-footer-contact { font-size: 0.85rem; margin-top: 1rem; opacity: 0.9; }

/* N12 mobile footer dock */
.sleekque-dock {
  display: none;
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 80;
  background: var(--sq-ink);
  border-top: 1px solid var(--sq-navy);
}
.sleekque-dock ul {
  display: flex;
  margin: 0;
  padding: 0;
  list-style: none;
}
.sleekque-dock a {
  flex: 1;
  text-align: center;
  padding: 0.65rem 0.25rem;
  font-size: 0.72rem;
  color: var(--sq-sand);
  text-decoration: none;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

/* CB17 plain cookie bar */
.sleekque-cookie {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 100;
  background: var(--sq-ink);
  color: var(--sq-sand);
  padding: 0.85rem 1rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  font-size: 0.85rem;
}
.sleekque-cookie p { margin: 0; flex: 1 1 14rem; }
.sleekque-cookie-actions { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.sleekque-cookie-actions button {
  font: inherit;
  font-size: 0.82rem;
  padding: 0.4rem 0.7rem;
  cursor: pointer;
  border: 1px solid var(--sq-sand);
  background: transparent;
  color: var(--sq-sand);
}
.sleekque-cookie-settings {
  width: 100%;
  border-top: 1px solid var(--sq-muted);
  padding-top: 0.65rem;
  font-size: 0.82rem;
}
.sleekque-cookie-settings label { display: block; margin-bottom: 0.3rem; }

.sleekque-reduced .sleekque-logo { transition: none; }

@media (max-width: 720px) {
  .sleekque-hero-split,
  .sleekque-split-panel,
  .sleekque-contact-block { grid-template-columns: 1fr; }
  .sleekque-nav-main { display: none; }
  .sleekque-nav-toggle { display: block; }
  .sleekque-dock { display: block; }
  body.sleekque-body { padding-bottom: 3.5rem; }
  .sleekque-cookie { bottom: 3.25rem; }
}

.sleekque-nav-panel {
  display: none;
  position: fixed;
  inset: 0;
  z-index: 90;
  background: rgba(15, 21, 32, 0.95);
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
}
.sleekque-nav-panel.is-open { display: flex; }
.sleekque-nav-panel a {
  color: var(--sq-sand);
  font-family: var(--sq-font-slab);
  font-size: 1.35rem;
  text-decoration: none;
}
