/* ==========================================================================
   Cold Country Equipment LLC - coldcountryrentals.com
   One stylesheet for the whole site. No framework, no build step.
   Design tokens carried over from the original Claude Design export.
   ========================================================================== */

/* ---------- Tokens ---------- */
:root {
  /* Brand ramp: terracotta */
  --terra-50:#FBF1EC; --terra-100:#F4DDD2; --terra-300:#E29F84;
  --terra-400:#DD8A6C; --terra-500:#D97757; --terra-600:#C15F3C; --terra-700:#A04A2C;

  /* Warm neutrals */
  --ink-900:#1A1A18; --ink-800:#262521; --ink-700:#3D3B35; --ink-600:#57544C;
  --ink-500:#76726A; --ink-400:#9A968C; --ink-300:#BDB9AE; --ink-200:#DAD6CB;
  --ink-150:#E6E2D8;
  --cream:#F5F4EE; --cream-raised:#FAF9F5;

  --surface-sunken:#EFEDE4;
  --surface-brand-soft:var(--terra-50);
  --border-subtle:var(--ink-150);
  --border-default:var(--ink-200);
  --border-strong:var(--ink-300);
  --border-brand:var(--terra-300);

  --font-display:"Newsreader", Georgia, "Times New Roman", serif;
  --font-sans:"Hanken Grotesk", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-mono:"JetBrains Mono", ui-monospace, "SF Mono", Menlo, monospace;

  --radius-md:10px; --radius-lg:14px; --radius-xl:20px;
  --shadow-sm:0 1px 3px rgba(40,33,24,.08), 0 1px 2px rgba(40,33,24,.04);
  --shadow-lg:0 12px 28px rgba(40,33,24,.12);
  --focus-ring:0 0 0 3px rgba(217,119,87,.45);

  --wrap:1180px;
  --gutter:32px;
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing:border-box; }
html { scroll-behavior:smooth; -webkit-text-size-adjust:100%; }
body {
  margin:0;
  background:var(--cream);
  color:var(--ink-800);
  font-family:var(--font-sans);
  font-size:16px;
  line-height:1.6;
  overflow-x:hidden;
  -webkit-font-smoothing:antialiased;
}
img { max-width:100%; height:auto; display:block; }
address { font-style:normal; }
a { color:var(--terra-600); text-decoration:none; }
a:hover { color:var(--terra-700); text-decoration:underline; }
:focus-visible { outline:none; box-shadow:var(--focus-ring); border-radius:6px; }
h1, h2, h3, h4 { font-family:var(--font-display); font-weight:500; color:var(--ink-900); }

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *, *::before, *::after { animation-duration:.01ms !important; transition-duration:.01ms !important; }
}

.wrap { max-width:var(--wrap); margin:0 auto; padding-left:var(--gutter); padding-right:var(--gutter); }
.skip-link {
  position:absolute; left:-9999px; top:0; z-index:100;
  background:var(--ink-900); color:#fff; padding:12px 20px; border-radius:0 0 10px 0; font-weight:600;
}
.skip-link:focus { left:0; color:#fff; }
.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;
}

/* ---------- Type helpers ---------- */
.eyebrow {
  font-family:var(--font-mono); font-size:12px; letter-spacing:.12em;
  text-transform:uppercase; color:var(--terra-600); margin:0 0 16px;
}
.eyebrow-muted { color:var(--ink-400); font-size:11px; letter-spacing:.1em; }
.h-hero {
  font-size:clamp(34px,8vw,54px); line-height:1.06; letter-spacing:-.02em;
  margin:0 0 20px; text-wrap:balance;
}
.h-section {
  font-size:clamp(28px,6vw,38px); line-height:1.15; letter-spacing:-.01em;
  margin:0 0 8px; text-wrap:balance;
}
.h-card { font-size:21px; line-height:1.3; margin:0 0 8px; }
.lede { font-size:19px; line-height:1.6; color:var(--ink-600); margin:0 0 30px; max-width:680px; }
.muted { color:var(--ink-500); }
.small { font-size:14px; }

/* ---------- Buttons ---------- */
.btn {
  display:inline-flex; align-items:center; justify-content:center;
  min-height:48px; padding:0 24px;
  font-family:var(--font-sans); font-size:16px; font-weight:600;
  border-radius:var(--radius-md); border:1px solid transparent;
  cursor:pointer; text-decoration:none;
  transition:background 120ms ease, transform 120ms ease;
}
.btn:hover { text-decoration:none; transform:translateY(-1px); }
.btn:active { transform:translateY(0); }
.btn-primary { background:var(--terra-500); color:#fff; box-shadow:var(--shadow-sm); }
.btn-primary:hover { background:var(--terra-600); color:#fff; }
.btn-secondary { background:var(--cream-raised); color:var(--ink-800); border-color:var(--border-strong); }
.btn-secondary:hover { background:#fff; color:var(--ink-900); }
.btn-row { display:flex; gap:14px; flex-wrap:wrap; align-items:center; }

/* ---------- Header / nav ---------- */
.site-header {
  position:sticky; top:0; z-index:50;
  background:var(--cream-raised); border-bottom:1px solid var(--border-default);
}
.site-header .wrap {
  display:flex; align-items:center; justify-content:space-between;
  gap:16px; padding-top:14px; padding-bottom:14px;
}
.logo img { height:44px; width:auto; }
.nav-desktop { display:flex; align-items:center; gap:28px; }
.nav-desktop a { font-size:15px; color:var(--ink-700); }
.nav-desktop a:hover { color:var(--terra-600); text-decoration:none; }
.nav-desktop a[aria-current="page"] { color:var(--terra-600); font-weight:600; }
.nav-desktop .btn { min-height:40px; font-size:15px; }

.nav-mobile { display:none; }
.nav-mobile > summary {
  list-style:none; cursor:pointer;
  width:48px; height:48px; border:1px solid var(--border-strong);
  background:var(--cream-raised); border-radius:10px;
  display:flex; flex-direction:column; align-items:center; justify-content:center; gap:5px;
}
.nav-mobile > summary::-webkit-details-marker { display:none; }
.nav-mobile > summary span { display:block; width:22px; height:2px; background:var(--ink-800); border-radius:2px; }
.nav-mobile[open] > summary span:nth-of-type(2) { opacity:0; }
.nav-panel {
  position:absolute; left:0; right:0; top:100%;
  background:var(--cream-raised); border-top:1px solid var(--border-default);
  padding:6px 20px 22px; box-shadow:0 12px 28px rgba(40,33,24,.12);
}
.nav-panel a { display:block; padding:16px 6px; font-size:18px; color:var(--ink-800); border-bottom:1px solid var(--border-subtle); }
.nav-panel a:last-of-type { border-bottom:none; }
.nav-panel .btn { width:100%; margin-top:14px; min-height:52px; font-size:17px; }

@media (max-width:879px) {
  :root { --gutter:20px; }
  .nav-desktop { display:none; }
  .nav-mobile { display:block; }
  .site-header .wrap { position:relative; }
}

/* ---------- Sections ---------- */
.section { padding:64px 0; }
.section-tight { padding:40px 0; }
.section-lead { padding:60px 0 16px; }
.band { border-top:1px solid var(--border-default); border-bottom:1px solid var(--border-default); background:var(--cream-raised); }

.grid { display:grid; gap:24px; }
.grid-2 { grid-template-columns:repeat(auto-fit,minmax(320px,1fr)); }
.grid-3 { grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); }
.grid-cards { grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); }
.split { display:grid; grid-template-columns:repeat(auto-fit,minmax(360px,1fr)); gap:52px; align-items:center; }

/* ---------- Hero ---------- */
.hero { padding:72px 0 60px; }
.hero-media { border-radius:16px; overflow:hidden; border:1px solid var(--border-default); box-shadow:var(--shadow-lg); }
.hero-media img { width:100%; height:430px; object-fit:cover; }
@media (max-width:879px) { .hero-media img { height:280px; } .hero { padding:44px 0 40px; } }

/* ---------- Trust strip ---------- */
.stats { display:grid; grid-template-columns:repeat(auto-fit,minmax(196px,1fr)); margin:0 auto; }
.stats > div { padding:28px; border-right:1px solid var(--border-default); }
.stats > div:last-child { border-right:none; }
.stats dt { font-family:var(--font-display); font-size:28px; color:var(--terra-600); margin:0 0 6px; }
.stats dd { margin:0; font-size:14px; color:var(--ink-500); line-height:1.5; }

/* ---------- Cards ---------- */
.card {
  background:var(--cream-raised); border:1px solid var(--border-default);
  border-radius:var(--radius-lg); overflow:hidden;
  display:flex; flex-direction:column;
}
.card > img, .card picture img { width:100%; height:210px; object-fit:cover; }
.card-body { padding:24px 24px 28px; display:flex; flex-direction:column; flex:1; }
.card-title { font-family:var(--font-display); font-weight:500; font-size:24px; color:var(--ink-900); margin:0 0 8px; letter-spacing:-.01em; }
.card-body p { font-size:15px; line-height:1.55; color:var(--ink-500); margin:0 0 20px; }
a.card:hover { text-decoration:none; border-color:var(--border-brand); }
a.card:hover .card-title { color:var(--terra-600); }

/* Spec table inside an equipment card */
.specs { margin:auto 0 0; }
.specs > div {
  display:flex; justify-content:space-between; gap:16px;
  padding:9px 0; border-bottom:1px solid var(--border-subtle); font-size:14px;
}
.specs dt { color:var(--ink-500); margin:0; }
.specs dd { color:var(--ink-800); font-weight:600; text-align:right; margin:0; }

/* ---------- Feature list ---------- */
.features { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:32px 40px; }
.features h3 { font-size:21px; margin:0 0 8px; }
.features p { font-size:15px; line-height:1.6; color:var(--ink-500); margin:0; }

/* ---------- Dark band ---------- */
.dark {
  background:var(--ink-900); color:rgba(255,255,255,.78);
  border-radius:18px; padding:46px 48px;
}
.dark h2, .dark h3 { color:#fff; }
.dark a { color:#fff; text-decoration:underline; text-underline-offset:3px; }
.dark .eyebrow { color:var(--terra-300); }
.dark p { color:rgba(255,255,255,.78); }
@media (max-width:879px) { .dark { padding:32px 24px; } }

.badge {
  display:inline-flex; align-items:center; align-self:flex-start; height:24px; padding:0 10px;
  border-radius:999px; font-family:var(--font-mono); font-size:11px;
  letter-spacing:.06em; text-transform:uppercase;
}
.badge-brand { background:var(--terra-500); color:#fff; }
.badge-neutral { background:rgba(255,255,255,.14); color:rgba(255,255,255,.85); }

/* ---------- Numbered steps ---------- */
.steps { display:flex; flex-direction:column; gap:24px; list-style:none; margin:0; padding:0; counter-reset:step; }
.steps li { display:flex; gap:16px; }
.steps li::before {
  counter-increment:step; content:counter(step);
  flex:none; width:34px; height:34px; border-radius:50%;
  background:var(--terra-500); color:#fff;
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:14px;
}
.steps h3 { font-size:19px; margin:0 0 4px; }
.steps p { font-size:14px; line-height:1.55; color:var(--ink-500); margin:0; }

/* ---------- Callout ---------- */
.callout {
  background:var(--surface-brand-soft); border:1px solid var(--border-brand);
  border-radius:var(--radius-lg); padding:32px 36px;
  display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr));
  gap:24px; align-items:center;
}
.callout h2 { font-size:26px; margin:0 0 6px; }
.callout p { font-size:15px; line-height:1.6; color:var(--ink-600); margin:0; }
.panel {
  background:var(--cream-raised); border:1px solid var(--border-default);
  border-radius:16px; padding:32px;
}

/* ---------- FAQ ---------- */
.faq { border-top:1px solid var(--border-default); }
.faq details { border-bottom:1px solid var(--border-default); }
.faq summary {
  list-style:none; cursor:pointer;
  padding:20px 44px 20px 0; position:relative;
  font-family:var(--font-display); font-size:20px; color:var(--ink-900); line-height:1.35;
}
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after {
  content:"+"; position:absolute; right:8px; top:16px;
  font-family:var(--font-sans); font-size:28px; font-weight:400; color:var(--terra-600); line-height:1;
}
.faq details[open] summary::after { content:"\2013"; }
.faq summary:hover { color:var(--terra-600); }
.faq .answer { padding:0 44px 22px 0; }
.faq .answer p { font-size:16px; line-height:1.65; color:var(--ink-600); margin:0 0 12px; }
.faq .answer p:last-child { margin-bottom:0; }
.faq .answer ul { margin:0 0 12px; padding-left:20px; color:var(--ink-600); font-size:16px; line-height:1.65; }

/* ---------- Service area ---------- */
.area-list { display:flex; flex-wrap:wrap; gap:10px; padding:0; margin:24px 0 0; list-style:none; }
.area-list li {
  background:var(--cream-raised); border:1px solid var(--border-default);
  border-radius:999px; padding:8px 16px; font-size:15px; color:var(--ink-700);
}

/* ---------- Facts row ---------- */
.facts {
  display:grid; grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); gap:1px;
  background:var(--border-default); border:1px solid var(--border-default);
  border-radius:var(--radius-lg); overflow:hidden; margin:0;
}
.facts > div { background:var(--cream-raised); padding:30px 32px; }
.facts dt { font-family:var(--font-mono); font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-400); margin:0 0 10px; }
.facts dd { font-family:var(--font-display); font-size:24px; color:var(--ink-900); margin:0; }

/* ---------- Form ---------- */
.field { display:block; margin-bottom:18px; }
.field > span { display:block; font-size:14px; font-weight:600; color:var(--ink-700); margin-bottom:7px; }
.field input, .field textarea {
  width:100%; padding:12px 14px;
  background:#fff; border:1px solid var(--border-strong);
  border-radius:var(--radius-md);
  font-family:var(--font-sans); font-size:16px; color:var(--ink-900);
  line-height:1.5;
}
.field input { height:48px; }
.field textarea { resize:vertical; min-height:130px; background:var(--surface-sunken); border-color:var(--border-default); }
.field input:focus, .field textarea:focus { outline:none; border-color:var(--terra-400); box-shadow:var(--focus-ring); }
.field-row { display:grid; grid-template-columns:1fr 1fr; gap:16px; }
@media (max-width:600px) { .field-row { grid-template-columns:1fr; gap:0; } }
.honeypot { position:absolute; left:-9999px; width:1px; height:1px; opacity:0; }
.form-note { font-size:13px; line-height:1.55; color:var(--ink-400); margin:12px 0 0; }
.human-check {
  display:flex; align-items:center; gap:16px; flex-wrap:wrap;
  background:var(--surface-sunken); border:1px solid var(--border-default);
  border-radius:10px; padding:14px 16px; margin-bottom:18px;
}
.human-check .field { margin:0; }
.human-check input { width:104px; height:44px; }

/* ---------- Footer ---------- */
.site-footer { background:var(--ink-900); color:rgba(255,255,255,.7); margin-top:40px; }
.site-footer .wrap { padding-top:54px; padding-bottom:32px; display:grid; grid-template-columns:repeat(auto-fit,minmax(200px,1fr)); gap:36px; }
.site-footer h2 { font-size:22px; color:#fff; margin:0 0 10px; }
.site-footer p { font-size:14px; line-height:1.6; margin:0; max-width:280px; }
.site-footer h3 {
  font-family:var(--font-mono); font-size:11px; font-weight:400; letter-spacing:.1em;
  text-transform:uppercase; color:rgba(255,255,255,.45); margin:0 0 14px;
}
.footer-links { display:flex; flex-direction:column; gap:10px; font-size:15px; }
.footer-links a, .footer-links span, .footer-links address { color:rgba(255,255,255,.8); }
.footer-links a:hover { color:#fff; }
.footer-legal { border-top:1px solid rgba(255,255,255,.12); }
.footer-legal .wrap {
  display:flex; justify-content:space-between; gap:16px; flex-wrap:wrap;
  padding-top:20px; padding-bottom:20px; font-size:13px; color:rgba(255,255,255,.45);
}
.footer-legal .wrap span:last-child { font-family:var(--font-mono); }

/* ---------- Utility ---------- */
.center { text-align:center; }
.mt-0 { margin-top:0; }
.mb-0 { margin-bottom:0; }
.stack > * + * { margin-top:22px; }