/* Lincoln Pump Co — style options.
   Loaded AFTER site.css, so everything here wins on cascade order.

   site.css is written almost entirely against CSS custom properties, so a theme
   is mostly a matter of redefining those same variable names. The handful of
   rules below the theme blocks exist because site.css hardcodes a few
   navy-tinted greys on its dark surfaces; they are re-pointed at per-theme
   variables so a cream or charcoal theme doesn't inherit blue-grey text.

   Themes:
     ironworks   charcoal + safety orange, condensed caps, sharp corners
     homestead   cream + forest green, Fraunces serif, title case
     clearwater  white + teal, Inter throughout, sentence case, soft & round
     deepwell    the original navy + amber (closest to Flynn Drilling)

   The --scrim-* stops are the hero's photo overlay, written out per theme as
   plain rgba. Don't reach for color-mix() here: if it isn't supported the whole
   background declaration is dropped and the hero becomes white text on a bare
   photo.

   The --logo-* values recolour the inline waterdrop mark. Without them a blue
   logo sits on a forest-green or charcoal page and reads as a mistake.
*/

@font-face{font-family:'Fraunces';src:url('/assets/fonts/Fraunces-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Fraunces';src:url('/assets/fonts/Fraunces-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

/* Fallbacks, in case a page ever renders without a data-theme attribute. */
:root{
  --on-accent:#2A1B00;
  --on-dark:#C7D7E4;
  --on-dark-2:#B9CDDD;
  --on-dark-3:#93AABD;
  --scrim-1:rgba(7,26,43,.94);
  --scrim-2:rgba(7,26,43,.86);
  --scrim-3:rgba(7,26,43,.45);
  --scrim-4:rgba(7,26,43,.30);
  --logo-1:#1B7FC4;
  --logo-2:#0E5C8A;
  --logo-3:#0A2540;
  --logo-accent:#6FD3F5;
  --logo-footer:#14456B;
}

/* --- 1. IRONWORKS — industrial ------------------------------------------- */
[data-theme="ironworks"]{
  --navy-900:#131518;
  --navy-800:#1C2026;
  --navy-700:#2A2F37;
  --navy-600:#3A414B;
  --blue:#FF6A13;
  --blue-700:#A8400A;
  --water:#FF8A3D;
  --amber:#FF6A13;
  --amber-700:#D9550E;
  --on-accent:#17100A;

  --ink:#14161A;
  --body:#454B54;
  --muted:#6C737C;
  --line:#DEE1E5;
  --line-soft:#EDEFF1;
  --mist:#F3F3F1;
  --mist-2:#E7E8E6;
  --paper:#FFFFFF;

  --on-dark:#E4E6E9;
  --on-dark-2:#B9BEC6;
  --on-dark-3:#8A9099;
  --scrim-1:rgba(19,21,24,.95);
  --scrim-2:rgba(19,21,24,.84);
  --scrim-3:rgba(19,21,24,.42);
  --scrim-4:rgba(19,21,24,.28);

  --logo-1:#FF8A3D;
  --logo-2:#E2560B;
  --logo-3:#1C2026;
  --logo-accent:#FFC08A;
  --logo-footer:#C2560F;

  --radius:3px;
  --radius-lg:5px;
  --shadow:0 1px 2px rgba(19,21,24,.08), 0 6px 16px -10px rgba(19,21,24,.3);
  --shadow-lg:0 2px 4px rgba(19,21,24,.1), 0 18px 36px -18px rgba(19,21,24,.45);
}
/* Hard-edged and slightly wider-tracked: reads like stencilled equipment. */
[data-theme="ironworks"] h1,
[data-theme="ironworks"] h2{letter-spacing:.022em}
[data-theme="ironworks"] .card__icon{border-radius:2px}
[data-theme="ironworks"] .brandlist li{border-radius:2px}
[data-theme="ironworks"] .alertlist li{border-left-width:4px}
[data-theme="ironworks"] .btn{border-radius:2px}

/* --- 2. HOMESTEAD — warm, local, serif ----------------------------------- */
[data-theme="homestead"]{
  --navy-900:#1E3A2C;
  --navy-800:#25452F;
  --navy-700:#2F5639;
  --navy-600:#3E6B47;
  --blue:#9B3226;
  --blue-700:#8A2B1F;
  --water:#E8C77A;
  --amber:#9B3226;
  --amber-700:#7A2119;
  --on-accent:#FFF6ED;

  --ink:#2A211A;
  --body:#54463B;
  --muted:#7A6A5C;
  --line:#E2D8C9;
  --line-soft:#EFE8DC;
  --mist:#FBF6EC;
  --mist-2:#F3EADA;
  --paper:#FFFDF8;

  --on-dark:#F3EADB;
  --on-dark-2:#D8C9B3;
  --on-dark-3:#B0A08A;
  --scrim-1:rgba(30,58,44,.94);
  --scrim-2:rgba(30,58,44,.82);
  --scrim-3:rgba(30,58,44,.42);
  --scrim-4:rgba(30,58,44,.28);

  --logo-1:#5C9068;
  --logo-2:#3E6B47;
  --logo-3:#1E3A2C;
  --logo-accent:#E8C77A;
  --logo-footer:#4E8257;
  --band-end:#3E6B47;

  --display:'Fraunces',Georgia,'Times New Roman',serif;
  --radius:10px;
  --radius-lg:16px;
  --shadow:0 1px 2px rgba(42,33,26,.05), 0 10px 26px -14px rgba(42,33,26,.28);
  --shadow-lg:0 2px 4px rgba(42,33,26,.06), 0 28px 58px -24px rgba(42,33,26,.4);
}
/* A serif in all-caps looks like a legal notice — title case instead. */
[data-theme="homestead"] h1,
[data-theme="homestead"] h2,
[data-theme="homestead"] h3,
[data-theme="homestead"] h4,
[data-theme="homestead"] .faq summary,
[data-theme="homestead"] .points strong,
[data-theme="homestead"] .brand__name,
[data-theme="homestead"] .bigphone,
[data-theme="homestead"] .footer__phone a,
[data-theme="homestead"] .stat__num{text-transform:none;letter-spacing:-.008em;line-height:1.12}
[data-theme="homestead"] .btn,
[data-theme="homestead"] .card__more{font-family:var(--sans);text-transform:none;letter-spacing:.005em;font-weight:700}
[data-theme="homestead"] body{background:var(--paper)}

/* --- 3. CLEARWATER — clean, modern, light -------------------------------- */
[data-theme="clearwater"]{
  --navy-900:#07323B;
  --navy-800:#0B4450;
  --navy-700:#0F5967;
  --navy-600:#147285;
  --blue:#12A5BE;
  --blue-700:#0B7C91;
  --water:#6FE3F5;
  --amber:#0B7C91;
  --amber-700:#085F70;
  --on-accent:#FFFFFF;

  --ink:#0B2229;
  --body:#3D5560;
  --muted:#6B838D;
  --line:#DCE7EA;
  --line-soft:#EDF3F5;
  --mist:#F4FAFB;
  --mist-2:#E4F1F4;
  --paper:#FFFFFF;

  --on-dark:#DCEEF2;
  --on-dark-2:#AFD3DC;
  --on-dark-3:#84AFBB;
  --scrim-1:rgba(7,50,59,.93);
  --scrim-2:rgba(7,50,59,.80);
  --scrim-3:rgba(7,50,59,.40);
  --scrim-4:rgba(7,50,59,.26);

  --logo-1:#17B8CE;
  --logo-2:#0B7C91;
  --logo-3:#07323B;
  --logo-accent:#7FE8F7;
  --logo-footer:#0E7E94;

  --display:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --radius:20px;
  --radius-lg:28px;
  --shadow:0 1px 2px rgba(11,34,41,.04), 0 12px 32px -14px rgba(11,34,41,.18);
  --shadow-lg:0 2px 6px rgba(11,34,41,.05), 0 34px 70px -26px rgba(11,34,41,.3);
}
/* No condensed caps anywhere — tight sentence case is the whole point here. */
[data-theme="clearwater"] h1,
[data-theme="clearwater"] h2,
[data-theme="clearwater"] h3,
[data-theme="clearwater"] h4,
[data-theme="clearwater"] .faq summary,
[data-theme="clearwater"] .points strong,
[data-theme="clearwater"] .brand__name,
[data-theme="clearwater"] .bigphone,
[data-theme="clearwater"] .footer__phone a,
[data-theme="clearwater"] .stat__num{text-transform:none;letter-spacing:-.022em;line-height:1.1;font-weight:700}
[data-theme="clearwater"] .btn,
[data-theme="clearwater"] .card__more{font-family:var(--sans);text-transform:none;letter-spacing:-.005em;font-weight:600}
[data-theme="clearwater"] .btn{border-radius:999px}
[data-theme="clearwater"] .card__icon{border-radius:16px}

/* --- 4. DEEP WELL — the original navy + amber ----------------------------- */
[data-theme="deepwell"]{
  --on-accent:#2A1B00;
  --on-dark:#C7D7E4;
  --on-dark-2:#B9CDDD;
  --on-dark-3:#93AABD;
  --scrim-1:rgba(7,26,43,.94);
  --scrim-2:rgba(7,26,43,.86);
  --scrim-3:rgba(7,26,43,.45);
  --scrim-4:rgba(7,26,43,.30);
  --logo-1:#1B7FC4;
  --logo-2:#0E5C8A;
  --logo-3:#0A2540;
  --logo-accent:#6FD3F5;
  --logo-footer:#14456B;
}

/* --- Shared: re-point site.css's hardcoded dark-surface greys ------------- */
/* site.css was written with one navy palette baked in. These rules swap those
   literals for per-theme variables so every theme's dark surfaces stay legible. */
.utilbar{color:var(--on-dark-3)}
.hero__inner{color:var(--on-dark)}
.hero__lede,
.hero__trust li{color:var(--on-dark-2)}
.hero__media::after{
  background:linear-gradient(105deg,
    var(--scrim-1) 0%,
    var(--scrim-2) 42%,
    var(--scrim-3) 78%,
    var(--scrim-4) 100%);
}
.pagehead{color:var(--on-dark-2)}
.bg-ink{color:var(--on-dark)}
.stat__label{color:var(--on-dark-3)}
.band{color:var(--on-dark-2)}
/* site.css ends the CTA band's gradient on --blue-700. That is fine where the
   accent is a near neighbour of the base, but homestead maps --blue-700 to barn
   red and the green-to-red sweep reads as a mistake. --band-end lets a theme
   pick its own final stop; the fallback keeps the original behaviour. */
.band{background:linear-gradient(135deg,
  var(--navy-800),
  var(--navy-700) 55%,
  var(--band-end, var(--blue-700)))}
.band__lede{color:var(--on-dark-2)}
.footer{color:var(--on-dark-3)}
.footer a{color:var(--on-dark-3)}
.footer__blurb{color:var(--on-dark-2)}
.footer__built,
.footer__note{color:var(--on-dark-3)}
.footer address{color:var(--on-dark-3)}
.footer__base{color:var(--on-dark-3)}
.btn--primary,
.btn--amber,
.callbar__call{color:var(--on-accent)}
.btn--primary:hover,
.btn--amber:hover{color:var(--on-accent)}
.lightbox{background:var(--scrim-1)}

/* --- Shared: the brand mark follows the theme ---------------------------- */
/* The waterdrop is inline SVG with its gradient stops written as presentation
   attributes; CSS overrides those, so the logo recolours with everything else. */
.brand__mark stop:nth-of-type(1){stop-color:var(--logo-1)}
.brand__mark stop:nth-of-type(2){stop-color:var(--logo-2)}
.brand__mark stop:nth-of-type(3){stop-color:var(--logo-3)}
.brand__mark g path:last-of-type{stroke:var(--logo-accent)}
.brand__mark--footer > path{fill:var(--logo-footer)}

/* --- Dev-only preview switcher ------------------------------------------- */
/* Emitted only while DEV_THEME_SWITCHER is on in build.py. Not part of the
   finished site — see README, "Choosing a style". */
.themebar{background:#0E1116;color:#E7EAEE;font-family:var(--sans);
  border-bottom:1px solid rgba(255,255,255,.12)}
.themebar__inner{width:var(--shell);margin-inline:auto;display:flex;align-items:center;
  gap:1rem 1.25rem;padding-block:.6rem;flex-wrap:wrap}
.themebar__label{font-size:.7rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:#8C949F;flex-shrink:0}
.themebar__opts{display:flex;gap:.4rem;flex-wrap:wrap}
.themebar__btn{
  display:flex;flex-direction:column;gap:.1rem;text-align:left;cursor:pointer;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
  color:#E7EAEE;border-radius:7px;padding:.42rem .75rem;font-family:inherit;
  transition:background .15s ease, border-color .15s ease;
}
.themebar__btn:hover{background:rgba(255,255,255,.13)}
.themebar__btn b{font-size:.84rem;font-weight:600;line-height:1.2}
.themebar__btn small{font-size:.66rem;color:#99A1AC;line-height:1.2}
.themebar__btn[aria-pressed="true"]{background:#2C6DF0;border-color:#5B8DF5;color:#fff}
.themebar__btn[aria-pressed="true"] small{color:#D3E0FC}
.themebar__note{font-size:.72rem;color:#767E89;margin-left:auto}
@media (max-width:760px){
  .themebar__note{display:none}
  .themebar__label{width:100%}
}
@media print{.themebar{display:none}}
