:root {
  --ink: #172033;
  --muted: #64748b;
  --paper: #ffffff;
  --wash: #f4f7fb;
  --line: #dfe7f1;
  --brand: #2563eb;
  --brand-dark: #1d4ed8;
  --accent: #f97316;
  --radius: 16px;
  --shadow: 0 18px 45px rgba(23, 32, 51, .10);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body.custom,
body.spt-page {
  margin: 0;
  background: var(--wash);
  color: var(--ink);
  font: 16px/1.75 Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--brand); text-decoration-thickness: .08em; text-underline-offset: .18em; }
a:hover { color: var(--brand-dark); }
img, video, iframe { max-width: 100%; height: auto; }

.full_width { width: 100%; }
.page { width: min(1120px, calc(100% - 40px)); margin-inline: auto; }

#header_area {
  background: #0f172a;
  color: #fff;
  border-bottom: 1px solid rgba(255,255,255,.1);
}
#header_area > .page { width: min(1120px, calc(100% - 40px)); }
#header {
  min-height: 146px;
  padding: 34px 0 26px;
  background: url('/wp-content/themes/thesis-ver16/custom/images/spt-headthumbs.jpg') right center / auto 100% no-repeat;
  position: relative;
}
#header::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #0f172a 0%, #0f172a 45%, rgba(15,23,42,.08) 100%);
  pointer-events: none;
}
#logo, #tagline { position: relative; z-index: 1; margin: 0; max-width: 680px; }
#logo a {
  color: #fff;
  font-size: clamp(2rem, 5vw, 3.25rem);
  font-weight: 800;
  letter-spacing: -.045em;
  text-decoration: none;
}
#tagline { color: #bfdbfe; font-size: .96rem; letter-spacing: .04em; }

.menu {
  display: flex;
  align-items: center;
  gap: 4px;
  margin: 0;
  padding: 0 0 14px;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: thin;
}
.menu li { margin: 0; list-style: none; white-space: nowrap; }
.menu a {
  display: block;
  padding: 9px 13px;
  border-radius: 9px;
  color: #e2e8f0;
  font-size: .9rem;
  font-weight: 700;
  text-decoration: none;
}
.menu a:hover, .menu a[aria-current="page"] { background: rgba(255,255,255,.12); color: #fff; }
.menu-toggle { display: none; }

#content_area { padding: 42px 0 64px; }
#content_box, #column_wrap { display: block; }
#content {
  width: min(820px, 100%);
  margin: 0 auto;
}
.post_box, .post, .teaser, .spt-card {
  margin: 0 0 24px;
  padding: clamp(24px, 5vw, 48px);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--paper);
  box-shadow: var(--shadow);
}
.teaser { padding: 28px; }
.teaser_right { clear: none; }
.headline_area { margin-bottom: 22px; }
h1, h2, h3, h4 { line-height: 1.18; letter-spacing: -.025em; color: #0f172a; }
h1 { margin: 0 0 14px; font-size: clamp(2rem, 5vw, 3.25rem); }
h2 { margin: 1.6em 0 .55em; font-size: clamp(1.45rem, 3vw, 2rem); }
h3 { margin: 1.4em 0 .45em; font-size: 1.25rem; }
.entry-title { margin-top: 0; }
.entry-title a { color: #0f172a; text-decoration: none; }
.entry-title a:hover { color: var(--brand); }
.headline_meta, .byline, .post_date, .post_tags, .to_comments, .teaser_date, .teaser_link { color: var(--muted); font-size: .86rem; }
.format_text p, .entry-content p { margin: 0 0 1.2em; }
.format_text ul, .format_text ol { padding-left: 1.35em; }
blockquote {
  margin: 1.5em 0;
  padding: 18px 22px;
  border-left: 4px solid var(--brand);
  background: #eff6ff;
  border-radius: 0 10px 10px 0;
}
pre, code { font-family: "SFMono-Regular", Consolas, monospace; }
pre { padding: 18px; overflow: auto; background: #0f172a; color: #e2e8f0; border-radius: 10px; }
table { width: 100%; border-collapse: collapse; }
th, td { padding: 10px 12px; border-bottom: 1px solid var(--line); text-align: left; }

#sidebar_1, #sidebars, #comments, .facebook_like_button, .postrank, .postrank-widget,
.social-buttons, .sharedaddy, object, embed { display: none !important; }
.prev_next { display: flex; gap: 16px; justify-content: space-between; padding: 18px 0; list-style: none; }
.prev_next li { list-style: none; }

.car-container ul { padding-left: 1.25rem; }
.car-yearmonth { margin-top: 1.4rem; color: #0f172a; font-weight: 800; }
.car-monthlisting { display: block !important; }

#footer_area { background: #0f172a; color: #94a3b8; }
#footer { padding: 32px 0; font-size: .86rem; }
#footer a { color: #bfdbfe; }
#footer img { display: none; }

.spt-hero {
  padding: 72px 0 58px;
  background: radial-gradient(circle at 80% 0, rgba(37,99,235,.2), transparent 35%), #0f172a;
  color: white;
}
.spt-hero-inner { width: min(1120px, calc(100% - 40px)); margin: auto; }
.spt-eyebrow { color: #93c5fd; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; font-size: .78rem; }
.spt-hero h1 { max-width: 760px; color: #fff; }
.spt-hero p { max-width: 700px; color: #cbd5e1; font-size: 1.12rem; }
.spt-button {
  display: inline-flex;
  margin-top: 14px;
  padding: 11px 18px;
  border-radius: 10px;
  background: var(--brand);
  color: #fff;
  font-weight: 800;
  text-decoration: none;
}
.spt-button:hover { background: var(--brand-dark); color: #fff; }
.spt-main { width: min(1120px, calc(100% - 40px)); margin: auto; padding: 46px 0 68px; }
.spt-section-title { margin: 0 0 22px; }
.spt-grid { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 20px; }
.spt-card { padding: 26px; box-shadow: none; }
.spt-card h2, .spt-card h3 { margin-top: 0; }
.spt-card p { color: var(--muted); }
.spt-card-meta { color: var(--accent); font-size: .76rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.spt-note { padding: 18px 20px; border: 1px solid #bfdbfe; background: #eff6ff; border-radius: 12px; color: #1e3a8a; }

@media (max-width: 760px) {
  .page, .spt-main, .spt-hero-inner, #header_area > .page { width: min(100% - 28px, 1120px); }
  #header { min-height: 118px; padding-top: 25px; background-size: auto 80%; }
  #header::after { background: linear-gradient(90deg, #0f172a 0%, #0f172a 68%, rgba(15,23,42,.35)); }
  #logo a { font-size: 2rem; }
  #tagline { max-width: 75%; font-size: .78rem; }
  .menu { gap: 2px; }
  .menu a { padding: 8px 10px; font-size: .82rem; }
  #content_area { padding-top: 24px; }
  .post_box, .post, .teaser, .spt-card { border-radius: 12px; padding: 22px; }
  .spt-grid { grid-template-columns: 1fr; }
  .spt-hero { padding: 48px 0 42px; }
}