/*
Theme Name: Sills Pump Co
Theme URI: https://www.sillspumpco.com
Author: Sills Well & Pump Co, LLC
Author URI: https://www.sillspumpco.com
Description: Tattoo / americana style one-page WordPress theme for Sills Well & Pump Co, LLC. 24 hour water well & pump service.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: sills-pump-co
Tags: one-page, business, custom-logo, custom-menu, dark
*/

/* Sills Well & Pump Co — tattoo / americana vibe */
:root{
  --ink:#0a0a0a;
  --ink-2:#141414;
  --paper:#f3ede2;
  --paper-2:#e8dfce;
  --bone:#cfc4ad;
  --rust:#b4321f;
  --rust-deep:#7a1f12;
  --gold:#c69a4a;
  --line:rgba(255,255,255,.12);
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{
  background:var(--paper);
  color:var(--ink);
  font-family:'Inter',system-ui,sans-serif;
  line-height:1.55;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;height:auto}
a{color:inherit;text-decoration:none}

.kicker{
  font-family:'Special Elite',serif;
  letter-spacing:.18em;
  font-size:.78rem;
  text-transform:uppercase;
  color:var(--rust);
  display:inline-block;
  margin-bottom:.9rem;
}
h1,h2,h3{font-family:'Cinzel',serif;letter-spacing:.02em;line-height:1.05}
h1{font-size:clamp(2.4rem,6vw,5rem);font-weight:800;text-transform:uppercase}
h2{font-size:clamp(1.8rem,3.6vw,2.8rem);font-weight:800;text-transform:uppercase}
h3{font-size:1.15rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em}

/* NAV */
.nav{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;gap:1rem;
  padding:.75rem 1.5rem;
  background:var(--ink);
  border-bottom:1px solid var(--line);
}
.nav .brand img{height:54px;width:auto}
.nav nav{display:flex;gap:1.6rem}
.nav nav a{
  color:var(--paper);font-family:'Special Elite',serif;
  font-size:.85rem;letter-spacing:.15em;text-transform:uppercase;
  padding:.4rem 0;border-bottom:1px solid transparent;transition:.2s;
}
.nav nav a:hover{border-color:var(--rust);color:var(--bone)}
.call-btn{
  background:var(--rust);color:var(--paper);
  padding:.7rem 1.1rem;font-family:'Special Elite',serif;
  letter-spacing:.1em;font-size:.85rem;text-transform:uppercase;
  border:1px solid var(--rust-deep);
  box-shadow:0 2px 0 var(--rust-deep);
  transition:.2s;
  white-space:nowrap;
}
.call-btn:hover{background:var(--rust-deep);transform:translateY(1px);box-shadow:0 1px 0 var(--rust-deep)}
@media(max-width:760px){
  .nav nav{display:none}
  .nav .brand img{height:44px}
}

/* HERO */
.hero{position:relative;min-height:88vh;display:flex;align-items:center;color:var(--paper);overflow:hidden}
.hero-img{
  position:absolute;inset:0;
  background-position:center;background-size:cover;background-repeat:no-repeat;
  filter:grayscale(.3) contrast(1.1);
}
.hero-overlay{
  position:absolute;inset:0;
  background:
    radial-gradient(ellipse at 30% 50%, rgba(0,0,0,.35), rgba(0,0,0,.85) 75%),
    linear-gradient(180deg, rgba(10,10,10,.6), rgba(10,10,10,.95));
}
.hero-content{
  position:relative;z-index:2;
  padding:6rem 1.5rem;max-width:1100px;margin:0 auto;width:100%;
}
.hero .kicker{color:var(--gold)}
.hero h1{color:var(--paper);text-shadow:0 4px 30px rgba(0,0,0,.6)}
.hero .lede{
  margin-top:1.5rem;max-width:620px;font-size:1.1rem;color:var(--bone);
}
.cta-row{display:flex;gap:1rem;margin-top:2rem;flex-wrap:wrap}
.btn{
  display:inline-block;padding:1rem 1.6rem;
  font-family:'Special Elite',serif;letter-spacing:.12em;
  text-transform:uppercase;font-size:.9rem;
  border:1px solid transparent;cursor:pointer;transition:.2s;
}
.btn.primary{background:var(--rust);color:var(--paper);border-color:var(--rust-deep);box-shadow:0 3px 0 var(--rust-deep)}
.btn.primary:hover{background:var(--rust-deep);transform:translateY(2px);box-shadow:0 1px 0 var(--rust-deep)}
.btn.ghost{border-color:var(--paper);color:var(--paper)}
.btn.ghost:hover{background:var(--paper);color:var(--ink)}
.badge-24{
  margin-top:2.5rem;display:inline-block;
  padding:.65rem 1.1rem;border:1px dashed var(--gold);
  font-family:'Special Elite',serif;color:var(--gold);
  letter-spacing:.18em;font-size:.78rem;
}

/* SECTION HEADS */
section{padding:6rem 1.5rem}
.section-head{text-align:center;max-width:720px;margin:0 auto 3.5rem}
.section-head .sub{color:#555;margin-top:.75rem}

/* SERVICES */
.services{background:var(--paper);position:relative}
.services::before,.services::after{
  content:"";display:block;height:6px;
  background:repeating-linear-gradient(90deg,var(--ink) 0 14px,transparent 14px 24px);
  position:absolute;left:0;right:0;
}
.services::before{top:0}.services::after{bottom:0}
.grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.2rem;max-width:1200px;margin:0 auto;
}
.card{
  background:var(--ink);color:var(--paper);
  padding:2rem 1.6rem;position:relative;
  border:1px solid #222;
  transition:.25s;
}
.card:hover{transform:translateY(-4px);border-color:var(--rust)}
.card-num{
  font-family:'Cinzel',serif;font-size:2.4rem;color:var(--rust);
  font-weight:800;line-height:1;margin-bottom:1rem;
}
.card h3{margin-bottom:.6rem;color:var(--paper)}
.card p{color:var(--bone);font-size:.95rem}
.card.emergency{background:var(--rust);border-color:var(--rust-deep)}
.card.emergency .card-num{color:var(--ink)}
.card.emergency p{color:#f7e9e6}

/* ABOUT */
.about{background:var(--ink);color:var(--paper)}
.about-inner{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center;
}
.about h2{color:var(--paper)}
.about p{color:var(--bone);margin-top:1rem;max-width:560px}
.checks{list-style:none;margin-top:1.6rem;display:grid;gap:.6rem}
.checks li{
  font-family:'Special Elite',serif;letter-spacing:.04em;
  padding-left:1.6rem;position:relative;color:var(--paper);
}
.checks li::before{
  content:"✶";position:absolute;left:0;color:var(--rust);
}
.about-mark img{
  display:block;margin:0 auto;width:100%;max-width:560px;height:auto;
}
@media(max-width:820px){
  .about-inner{grid-template-columns:1fr;gap:2.5rem}
  .about-mark img{max-width:360px}
}

/* AREA */
.area{
  text-align:center;background:var(--paper-2);
  border-top:1px solid rgba(0,0,0,.08);border-bottom:1px solid rgba(0,0,0,.08);
}
.area p{max-width:600px;margin:1rem auto 2rem;color:#3a3a3a}

/* CONTACT */
.contact{background:var(--ink);color:var(--paper)}
.contact-inner{
  max-width:1100px;margin:0 auto;
  display:grid;grid-template-columns:1.1fr 1fr;gap:4rem;align-items:center;
}
.contact h2{color:var(--paper)}
.contact p{color:var(--bone);margin-top:1rem}
.contact-list{list-style:none;display:grid;gap:1.1rem}
.contact-list li{
  display:flex;justify-content:space-between;align-items:baseline;gap:1rem;
  padding:1rem 1.2rem;background:#1c1c1c;border:1px solid #262626;
}
.contact-list .lbl{
  font-family:'Special Elite',serif;color:var(--gold);
  letter-spacing:.18em;text-transform:uppercase;font-size:.75rem;
}
.contact-list a,.contact-list span:last-child{
  font-family:'Cinzel',serif;font-size:1.05rem;color:var(--paper);
  text-align:right;
}
.contact-list a:hover{color:var(--rust)}
@media(max-width:820px){
  .contact-inner{grid-template-columns:1fr;gap:2rem}
}

/* FOOTER */
.foot{
  background:#050505;color:var(--bone);text-align:center;
  padding:3rem 1.5rem;border-top:1px solid var(--line);
}
.foot img{height:70px;margin:0 auto 1.2rem;opacity:.9}
.foot .fine{font-family:'Special Elite',serif;letter-spacing:.15em;font-size:.72rem;color:#777;margin-top:.4rem;text-transform:uppercase}

/* WP-required */
.screen-reader-text{
  border:0;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
  height:1px;width:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;word-wrap:normal!important;
}