/* Lincoln Pump Co — hand-written, one stylesheet, no build step.
   Palette is drawn off the logo: the navy and blue of the waterdrop, the bright
   water cyan of the rising chevrons, and an amber that stays legible on navy
   for the things we want people to actually press. */

/* --- Fonts ---------------------------------------------------------------- */
@font-face{font-family:'Barlow Condensed';src:url('/assets/fonts/BarlowCondensed-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Barlow Condensed';src:url('/assets/fonts/BarlowCondensed-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-400.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-500.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-600.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Inter';src:url('/assets/fonts/Inter-700.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}

/* --- Tokens --------------------------------------------------------------- */
:root{
  --navy-900:#071A2B;
  --navy-800:#0A2540;
  --navy-700:#0E3A5C;
  --navy-600:#14557F;
  --blue:#1B7FC4;
  --blue-700:#0E5C8A;
  --water:#6FD3F5;

  --amber:#F5A623;
  --amber-700:#D0850C;

  --ink:#0F1E2E;
  --body:#41525F;
  --muted:#6B7C8B;
  --line:#DCE4EC;
  --line-soft:#EBF0F5;
  --mist:#F4F7FA;
  --mist-2:#E9F0F6;
  --paper:#FFFFFF;

  --shell:min(1180px, 100% - 2.5rem);
  --radius:14px;
  --radius-lg:22px;
  --shadow:0 1px 2px rgba(10,37,64,.05), 0 8px 26px -12px rgba(10,37,64,.22);
  --shadow-lg:0 2px 4px rgba(10,37,64,.06), 0 26px 60px -22px rgba(10,37,64,.35);
  --header-h:76px;

  --display:'Barlow Condensed','Arial Narrow',system-ui,sans-serif;
  --sans:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;

  --step--1:clamp(.82rem,.79rem + .14vw,.9rem);
  --step-0:clamp(1rem,.96rem + .2vw,1.09rem);
  --step-1:clamp(1.2rem,1.12rem + .38vw,1.42rem);
  --step-2:clamp(1.55rem,1.36rem + .92vw,2.15rem);
  --step-3:clamp(2.1rem,1.68rem + 2.05vw,3.3rem);
  --step-4:clamp(2.6rem,1.9rem + 3.6vw,4.9rem);
}

/* --- Base ----------------------------------------------------------------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{
  margin:0;background:var(--paper);color:var(--body);
  font-family:var(--sans);font-size:var(--step-0);line-height:1.68;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4{
  font-family:var(--display);text-transform:uppercase;color:var(--ink);
  line-height:1.04;letter-spacing:.005em;margin:0;font-weight:700;
}
h1{font-size:var(--step-3)}
h2{font-size:var(--step-2)}
h3{font-size:var(--step-1)}
p{margin:0}
a{color:var(--blue-700);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--navy-700)}
img{max-width:100%;height:auto;display:block}
ul{margin:0;padding:0;list-style:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px;border-radius:4px}

.shell{width:var(--shell);margin-inline:auto}
section{padding-block:clamp(3.25rem,6.5vw,6rem)}
.bg-soft{background:var(--mist)}
.bg-ink{background:var(--navy-800);color:#C7D7E4}
.bg-ink h2,.bg-ink h3{color:#fff}

.skip{
  position:absolute;left:-9999px;top:0;z-index:100;background:var(--navy-800);
  color:#fff;padding:.85rem 1.3rem;border-radius:0 0 var(--radius) 0;font-weight:600;
}
.skip:focus{left:0}

.eyebrow{
  font-family:var(--display);text-transform:uppercase;letter-spacing:.14em;
  font-size:.86rem;font-weight:600;color:var(--blue-700);margin:0;
}
.eyebrow--light{color:var(--water)}
.lede{font-size:var(--step-1);line-height:1.5;color:var(--body)}

.section-head{max-width:62ch}
.section-head h2{margin-top:.7rem}
.section-head .lede{margin-top:1.1rem}

/* --- Buttons -------------------------------------------------------------- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  font-family:var(--display);text-transform:uppercase;font-weight:700;
  font-size:1.02rem;letter-spacing:.045em;line-height:1;
  padding:.95rem 1.5rem;border-radius:10px;border:2px solid transparent;
  text-decoration:none;cursor:pointer;white-space:nowrap;
  transition:transform .12s ease, background-color .16s ease, border-color .16s ease, color .16s ease;
}
.btn:active{transform:translateY(1px)}
.btn--lg{padding:1.15rem 1.9rem;font-size:1.12rem}
.btn--primary{background:var(--amber);color:#2A1B00;border-color:var(--amber)}
.btn--primary:hover{background:var(--amber-700);border-color:var(--amber-700);color:#2A1B00}
.btn--amber{background:var(--amber);color:#2A1B00;border-color:var(--amber)}
.btn--amber:hover{background:#FFB93D;border-color:#FFB93D;color:#2A1B00}
.btn--navy{background:var(--navy-800);color:#fff;border-color:var(--navy-800)}
.btn--navy:hover{background:var(--navy-700);border-color:var(--navy-700);color:#fff}
.btn--ghost{background:transparent;color:var(--navy-800);border-color:var(--line)}
.btn--ghost:hover{border-color:var(--navy-800);color:var(--navy-800)}
.btn--ghost-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.4)}
.btn--ghost-light:hover{border-color:#fff;color:#fff;background:rgba(255,255,255,.08)}

/* --- Util bar ------------------------------------------------------------- */
.utilbar{background:var(--navy-900);color:#9FB6C9;font-size:.8rem}
.utilbar__inner{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;padding-block:.55rem}
.utilbar p{margin:0}
.utilbar a{color:#fff;font-weight:600;text-decoration:none}
.utilbar a:hover{color:var(--water)}
.utilbar strong{color:var(--water);font-weight:600}

/* --- Header --------------------------------------------------------------- */
.header{position:sticky;top:0;z-index:50;background:rgba(255,255,255,.96);backdrop-filter:blur(10px);border-bottom:1px solid var(--line-soft)}
.header.is-stuck{box-shadow:0 8px 28px -18px rgba(10,37,64,.55)}
.header__inner{display:flex;align-items:center;gap:1.5rem;min-height:var(--header-h)}

.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;flex-shrink:0}
.brand__mark{width:38px;height:38px;flex-shrink:0}
.brand__text{display:flex;flex-direction:column;line-height:1}
.brand__name{font-family:var(--display);text-transform:uppercase;font-weight:700;font-size:1.42rem;color:var(--navy-800);letter-spacing:.01em}
.brand__tag{font-size:.6rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-top:.22rem}

.nav{display:flex;align-items:center;gap:.15rem;margin-left:auto}
.nav__item{position:relative}
.nav__link{
  display:flex;align-items:center;gap:.25rem;padding:.6rem .78rem;border-radius:8px;
  font-weight:600;font-size:.94rem;color:var(--ink);text-decoration:none;
}
.nav__link:hover{background:var(--mist);color:var(--navy-800)}
.nav__link[aria-current="page"]{color:var(--blue-700)}
.nav__link[aria-current="page"]::after{
  content:"";position:absolute;left:.78rem;right:.78rem;bottom:.28rem;height:2px;
  background:var(--amber);border-radius:2px;
}
.nav__caret{width:13px;height:13px;opacity:.55}
.nav__menu{
  position:absolute;top:calc(100% + .45rem);left:0;min-width:286px;padding:.5rem;
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  box-shadow:var(--shadow-lg);opacity:0;visibility:hidden;transform:translateY(-6px);
  transition:opacity .16s ease, transform .16s ease, visibility .16s;
}
.nav__item:hover .nav__menu,.nav__item:focus-within .nav__menu{opacity:1;visibility:visible;transform:none}
.nav__menu a{display:block;padding:.6rem .75rem;border-radius:9px;text-decoration:none;color:var(--ink);font-weight:600;font-size:.94rem}
.nav__menu a small{display:block;font-weight:400;font-size:.79rem;color:var(--muted);margin-top:.1rem;line-height:1.4}
.nav__menu a:hover{background:var(--mist)}

.header__actions{display:flex;align-items:center;gap:.8rem;flex-shrink:0}
.header__phone{display:flex;align-items:center;gap:.5rem;text-decoration:none;color:var(--navy-800);font-family:var(--display);font-size:1.22rem;font-weight:700;letter-spacing:.01em}
.header__phone svg{width:19px;height:19px;color:var(--blue)}
.header__phone span{display:flex;flex-direction:column;line-height:1.05}
.header__phone small{font-family:var(--sans);font-size:.58rem;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.header__phone:hover{color:var(--blue-700)}

.burger{display:none;width:44px;height:40px;border:1px solid var(--line);background:#fff;border-radius:9px;cursor:pointer;padding:0;flex-direction:column;align-items:center;justify-content:center;gap:4px}
.burger span{display:block;width:19px;height:2px;background:var(--navy-800);border-radius:2px;transition:transform .18s ease,opacity .18s ease}
body.nav-open .burger span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.nav-open .burger span:nth-child(2){opacity:0}
body.nav-open .burger span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}

/* --- Hero ----------------------------------------------------------------- */
.hero{position:relative;background:var(--navy-900);overflow:hidden;padding-block:clamp(3.5rem,8vw,7rem)}
.hero__media{position:absolute;inset:0;z-index:0}
.hero__media img{width:100%;height:100%;object-fit:cover;object-position:50% 58%}
.hero__media::after{
  content:"";position:absolute;inset:0;
  background:linear-gradient(105deg,rgba(7,26,43,.94) 0%,rgba(7,26,43,.86) 42%,rgba(7,26,43,.45) 78%,rgba(7,26,43,.3) 100%);
}
.hero__inner{position:relative;z-index:1;max-width:44rem;color:#C7D7E4}
.hero h1{color:#fff;font-size:var(--step-4);margin-top:.9rem}
.hero h1 em{font-style:normal;color:var(--water)}
.hero__lede{font-size:var(--step-1);line-height:1.5;color:#B9CDDD;margin-top:1.4rem;max-width:34rem}
.hero__actions{display:flex;flex-wrap:wrap;gap:.9rem;margin-top:2.2rem}
.hero__trust{display:flex;flex-wrap:wrap;gap:.6rem 2rem;margin-top:2.6rem;padding-top:1.7rem;border-top:1px solid rgba(255,255,255,.16)}
.hero__trust li{display:flex;align-items:center;gap:.55rem;font-size:.9rem;font-weight:500;color:#B9CDDD}
.hero__trust svg{width:17px;height:17px;color:var(--water);flex-shrink:0}

/* --- Page head ------------------------------------------------------------ */
.pagehead{background:var(--navy-800);color:#B9CDDD;padding-block:clamp(2.75rem,5.5vw,4.5rem)}
.pagehead h1{color:#fff;margin-top:.75rem;max-width:20ch}
.pagehead .eyebrow{color:var(--water)}
.pagehead p:not(.eyebrow){margin-top:1.25rem;max-width:58ch;font-size:var(--step-1);line-height:1.52}

/* --- Grid & cards --------------------------------------------------------- */
.grid{display:grid;gap:1.4rem}
.grid--2{grid-template-columns:repeat(2,1fr)}
.grid--3{grid-template-columns:repeat(3,1fr)}
.grid--4{grid-template-columns:repeat(4,1fr)}

.card{
  background:#fff;border:1px solid var(--line);border-radius:var(--radius);
  padding:1.7rem;display:flex;flex-direction:column;
  transition:transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.card h3{margin-bottom:.6rem}
.card p{color:var(--muted);font-size:.96rem;line-height:1.62}
.card__icon{
  width:46px;height:46px;border-radius:11px;display:grid;place-items:center;
  background:var(--mist-2);color:var(--blue-700);margin-bottom:1.1rem;
}
.card__icon svg{width:23px;height:23px}
.card__more{margin-top:auto;padding-top:1.2rem;font-family:var(--display);text-transform:uppercase;font-weight:700;font-size:.95rem;letter-spacing:.04em;color:var(--blue-700);text-decoration:none}
.card__more:hover{color:var(--navy-800)}
a.card:hover,.card--link:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:var(--blue)}
a.card{text-decoration:none}

/* --- Split ---------------------------------------------------------------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(2rem,5vw,4rem);align-items:center}
.split--narrow{grid-template-columns:.85fr 1fr}
.split__media{border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow-lg);position:relative}
/* Several of the job photos are phone shots in portrait (one is 1600x2842).
   Cap the height and crop rather than letting a 900px-tall image strand the
   text column beside it. */
.split__media img{width:100%;max-height:min(72vh,640px);object-fit:cover}
.figure__cap{
  position:absolute;left:0;right:0;bottom:0;padding:1.6rem 1.3rem .9rem;
  background:linear-gradient(transparent,rgba(7,26,43,.86));
  color:#DCE8F1;font-size:.82rem;font-weight:500;
}

/* --- Checklist ------------------------------------------------------------ */
.checklist{display:grid;gap:.85rem;margin-top:1.6rem}
.checklist li{display:flex;gap:.75rem;align-items:flex-start;line-height:1.55}
.checklist svg{width:20px;height:20px;color:var(--blue);flex-shrink:0;margin-top:.17rem}
.checklist strong{color:var(--ink);font-weight:600}

/* --- Numbered points ------------------------------------------------------ */
.points{counter-reset:pt;display:grid;gap:1.15rem}
.points li{counter-increment:pt;display:flex;gap:1.1rem;align-items:flex-start}
.points li::before{
  content:counter(pt);flex-shrink:0;width:38px;height:38px;border-radius:50%;
  display:grid;place-items:center;background:var(--navy-800);color:var(--water);
  font-family:var(--display);font-weight:700;font-size:1.12rem;
}
.points p{line-height:1.6}
.points strong{display:block;color:var(--ink);font-family:var(--display);text-transform:uppercase;font-size:1.12rem;letter-spacing:.01em;margin-bottom:.15rem}

/* --- Stats ---------------------------------------------------------------- */
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem}
.stat{text-align:center;padding:1.4rem 1rem;border-radius:var(--radius);background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.1)}
.stat__num{font-family:var(--display);font-weight:700;font-size:clamp(2.1rem,4vw,3rem);color:#fff;line-height:1}
.stat__num span{color:var(--water)}
.stat__label{font-size:.82rem;color:#9FB6C9;margin-top:.5rem;line-height:1.45}

/* --- Symptom / alert list ------------------------------------------------- */
.alertlist{display:grid;grid-template-columns:repeat(2,1fr);gap:.8rem;margin-top:2rem}
.alertlist li{
  display:flex;gap:.8rem;align-items:flex-start;background:#fff;border:1px solid var(--line);
  border-left:3px solid var(--amber);border-radius:10px;padding:.95rem 1.15rem;
  font-size:.97rem;line-height:1.5;color:var(--ink);font-weight:500;
}

/* --- Brand list ----------------------------------------------------------- */
.brandlist{display:flex;flex-wrap:wrap;gap:.6rem;margin-top:1.5rem}
.brandlist li{
  border:1px solid var(--line);border-radius:999px;padding:.5rem 1.05rem;
  font-family:var(--display);text-transform:uppercase;font-weight:600;
  letter-spacing:.045em;font-size:.95rem;color:var(--navy-700);background:#fff;
}
.brandlist li.is-lead{background:var(--navy-800);color:#fff;border-color:var(--navy-800)}

/* --- Reviews -------------------------------------------------------------- */
.quote{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:1.75rem;display:flex;flex-direction:column}
.quote__stars{display:flex;gap:.15rem;color:var(--amber);margin-bottom:1rem}
.quote__stars svg{width:17px;height:17px}
.quote p{color:var(--ink);line-height:1.62;font-size:.99rem}
.quote__who{margin-top:auto;padding-top:1.2rem;font-size:.85rem;color:var(--muted)}
.quote__who strong{display:block;color:var(--ink);font-weight:600;font-size:.95rem}

/* --- FAQ ------------------------------------------------------------------ */
.faq{display:grid;gap:.7rem;margin-top:2.2rem}
.faq details{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.faq details[open]{border-color:var(--blue);box-shadow:var(--shadow)}
.faq summary{
  cursor:pointer;padding:1.15rem 3rem 1.15rem 1.35rem;position:relative;
  font-family:var(--display);text-transform:uppercase;font-weight:700;
  font-size:1.1rem;color:var(--ink);letter-spacing:.008em;list-style:none;line-height:1.25;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:"";position:absolute;right:1.3rem;top:1.35rem;width:11px;height:11px;
  border-right:2px solid var(--blue);border-bottom:2px solid var(--blue);
  transform:rotate(45deg);transition:transform .18s ease;
}
.faq details[open] summary::after{transform:rotate(-135deg);top:1.55rem}
.faq__body{padding:0 1.35rem 1.35rem;color:var(--body);line-height:1.68}
.faq__body p + p{margin-top:.9rem}

/* --- Gallery -------------------------------------------------------------- */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;margin-top:2.2rem}
.gallery button{padding:0;border:0;background:none;cursor:zoom-in;border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:block}
.gallery img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .3s ease}
.gallery button:hover img{transform:scale(1.04)}

/* --- Form ----------------------------------------------------------------- */
.formcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.4rem);box-shadow:var(--shadow);scroll-margin-top:calc(var(--header-h) + 1.5rem)}
.form__grid{display:grid;grid-template-columns:1fr 1fr;gap:1.1rem;margin-top:1.6rem}
.form__field{display:flex;flex-direction:column;gap:.4rem}
.form__field--wide{grid-column:1 / -1}
.form__field label{font-size:.82rem;font-weight:600;color:var(--ink);letter-spacing:.01em}
.form__field label span{color:var(--muted);font-weight:400}
.form__field input,.form__field select,.form__field textarea{
  font-family:inherit;font-size:1rem;color:var(--ink);background:var(--mist);
  border:1px solid var(--line);border-radius:10px;padding:.8rem .95rem;width:100%;
}
.form__field textarea{min-height:120px;resize:vertical}
.form__field input:focus,.form__field select:focus,.form__field textarea:focus{background:#fff;border-color:var(--blue);outline:none;box-shadow:0 0 0 3px rgba(27,127,196,.15)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.form__actions{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;margin-top:1.5rem}
.form__note{font-size:.82rem;color:var(--muted);line-height:1.5}
.form__status{margin-top:1rem;font-size:.92rem;line-height:1.55;padding:.85rem 1.05rem;border-radius:10px;display:none}
.form__status.is-working{display:block;background:var(--mist);color:var(--muted)}
.form__status.is-good{display:block;background:#E8F6EC;color:#1C6B33;border:1px solid #BFE4C9}
.form__status.is-warn{display:block;background:#FFF4E0;color:#8A5A06;border:1px solid #F3DCAE}

/* --- Contact rail --------------------------------------------------------- */
.contactcard{display:grid;gap:1.3rem}
.contactcard__row{display:flex;gap:1rem;align-items:flex-start}
.contactcard__row svg{width:21px;height:21px;color:var(--blue);flex-shrink:0;margin-top:.2rem}
.contactcard__row h3{font-size:1.02rem;margin-bottom:.15rem}
.contactcard__row a{font-weight:600;text-decoration:none}
.contactcard__row address{font-style:normal;line-height:1.6}
.bigphone{font-family:var(--display);font-weight:700;font-size:clamp(1.9rem,3.5vw,2.5rem);color:var(--navy-800);text-decoration:none;line-height:1;display:block}
.bigphone:hover{color:var(--blue-700)}
.mapframe{border-radius:var(--radius);overflow:hidden;border:1px solid var(--line);margin-top:1.8rem;line-height:0}
.mapframe iframe{width:100%;height:320px;border:0}

/* --- Area list ------------------------------------------------------------ */
.arealist{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem 1.5rem;margin-top:1.6rem}
.arealist li{display:flex;gap:.6rem;align-items:center;font-size:.97rem;color:var(--ink)}
.arealist li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--blue);flex-shrink:0}

/* --- CTA band ------------------------------------------------------------- */
.band{background:linear-gradient(135deg,var(--navy-800),var(--navy-700) 55%,var(--blue-700));color:#C7D7E4;padding-block:clamp(3rem,6vw,4.5rem)}
.band__inner{display:flex;align-items:center;justify-content:space-between;gap:clamp(1.8rem,4vw,4rem);flex-wrap:wrap}
.band h2{color:#fff;margin-top:.65rem;font-size:var(--step-2)}
.band__lede{margin-top:.9rem;max-width:44ch;color:#B9CDDD}
.band__actions{display:flex;flex-wrap:wrap;gap:.9rem}

/* --- Footer --------------------------------------------------------------- */
.footer{background:var(--navy-900);color:#93AABD;padding-top:clamp(3rem,5vw,4.5rem);font-size:.93rem}
.footer__grid{display:grid;grid-template-columns:1.6fr 1fr 1fr 1.25fr;gap:2.5rem}
.footer h3{color:#fff;font-size:1.02rem;margin-bottom:1rem;letter-spacing:.06em}
.footer ul{display:grid;gap:.6rem}
.footer a{color:#93AABD;text-decoration:none}
.footer a:hover{color:var(--water)}
.brand__mark--footer{width:42px;height:42px;margin-bottom:1.1rem}
.footer__blurb{color:#A9BECE;line-height:1.65}
.footer__built{margin-top:.9rem;color:#728DA3;line-height:1.6;font-size:.87rem}
.footer__phone{margin-bottom:.2rem}
.footer__phone a{font-family:var(--display);font-weight:700;font-size:1.65rem;color:#fff}
.footer__phone a:hover{color:var(--water)}
.footer__note{font-size:.82rem;color:#728DA3;margin-bottom:1rem}
.footer address{font-style:normal;line-height:1.65;margin-top:1.1rem;color:#93AABD}
.footer__base{
  display:flex;justify-content:space-between;gap:1.5rem;flex-wrap:wrap;
  margin-top:3rem;padding-block:1.4rem;border-top:1px solid rgba(255,255,255,.1);
  font-size:.83rem;color:#6E869B;
}
.footer__base p{margin:0}

/* --- Mobile call bar ------------------------------------------------------ */
.callbar{display:none;position:fixed;left:0;right:0;bottom:0;z-index:60;gap:1px;background:rgba(255,255,255,.14);box-shadow:0 -6px 24px -10px rgba(7,26,43,.5)}
.callbar a{flex:1;display:flex;align-items:center;justify-content:center;gap:.5rem;padding:1.05rem .8rem;text-decoration:none;font-family:var(--display);text-transform:uppercase;font-weight:700;font-size:1.06rem;letter-spacing:.05em}
.callbar__call{background:var(--amber);color:#2A1B00}
.callbar__call svg{width:18px;height:18px}
.callbar__text{background:var(--navy-800);color:#fff;flex:0 0 34%}

/* --- Lightbox ------------------------------------------------------------- */
.lightbox{position:fixed;inset:0;z-index:90;background:rgba(7,26,43,.93);display:grid;place-items:center;padding:clamp(1rem,4vw,3rem)}
.lightbox[hidden]{display:none}
.lightbox__img{max-width:100%;max-height:88vh;border-radius:10px;box-shadow:var(--shadow-lg)}
.lightbox__close{position:absolute;top:1.1rem;right:1.4rem;width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.3);background:rgba(255,255,255,.1);color:#fff;font-size:1.8rem;line-height:1;cursor:pointer}
.lightbox__close:hover{background:rgba(255,255,255,.2)}

/* --- Reveal --------------------------------------------------------------- */
.js .reveal{opacity:0;transform:translateY(16px);transition:opacity .6s ease, transform .6s ease}
.js .reveal.is-in{opacity:1;transform:none}

/* --- Responsive ----------------------------------------------------------- */
@media (max-width:1040px){
  .nav__link{padding:.6rem .6rem;font-size:.9rem}
  .header__phone small{display:none}
  .footer__grid{grid-template-columns:1fr 1fr}
}
@media (max-width:920px){
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .grid--3{grid-template-columns:repeat(2,1fr)}
  .split,.split--narrow{grid-template-columns:1fr}
  .split__media{order:-1}
  .stats{grid-template-columns:repeat(2,1fr)}
  .arealist{grid-template-columns:repeat(2,1fr)}
  .gallery{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:860px){
  .utilbar__area{display:none}
  .utilbar__inner{justify-content:center}
  .header__phone{display:none}
  /* The sticky call bar carries the CTA on mobile, so the header keeps only the
     brand and the menu button — otherwise they collide and push the burger off
     the screen, leaving no way to open the menu. */
  .header__actions .btn--primary{display:none}
  .burger{display:flex}
  /* backdrop-filter makes .header a containing block for fixed-position
     descendants, which clips the fixed nav panel below to the header's own
     height instead of the viewport. Drop the blur on mobile. */
  .header{backdrop-filter:none;background:#fff}
  /* Drop the util bar while the menu is open so the panel lines up under the
     header instead of overlapping it. */
  body.nav-open .utilbar{display:none}
  .nav{
    position:fixed;inset:var(--header-h) 0 0;margin:0;background:#fff;
    flex-direction:column;align-items:stretch;gap:0;padding:1rem 1.25rem 3rem;
    overflow-y:auto;transform:translateX(100%);transition:transform .24s ease;
    border-top:1px solid var(--line-soft);
  }
  body.nav-open{overflow:hidden}
  body.nav-open .nav{transform:none}
  .nav__link{padding:1rem .3rem;font-size:1.08rem;border-bottom:1px solid var(--line-soft);border-radius:0;justify-content:space-between}
  .nav__link[aria-current="page"]::after{display:none}
  .nav__menu{
    position:static;opacity:1;visibility:visible;transform:none;box-shadow:none;
    border:0;border-bottom:1px solid var(--line-soft);border-radius:0;padding:.25rem 0 .75rem .8rem;
    min-width:0;display:none;
  }
  .nav__item--has-menu.is-open .nav__menu{display:block}
  .nav__item--has-menu.is-open .nav__caret{transform:rotate(180deg)}
  body{padding-bottom:4.4rem}
  .callbar{display:flex}
  .band__inner{flex-direction:column;align-items:flex-start}
}
@media (max-width:620px){
  :root{--shell:min(1180px, 100% - 2rem)}
  .grid--2,.grid--3,.grid--4{grid-template-columns:1fr}
  .alertlist{grid-template-columns:1fr}
  .form__grid{grid-template-columns:1fr}
  .stats{grid-template-columns:1fr 1fr;gap:.9rem}
  .arealist{grid-template-columns:1fr 1fr}
  .gallery{grid-template-columns:1fr 1fr}
  .footer__grid{grid-template-columns:1fr;gap:2rem}
  .hero__actions .btn{width:100%}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms !important;transition-duration:.01ms !important}
  html{scroll-behavior:auto}
  .js .reveal{opacity:1;transform:none}
}
@media print{
  .utilbar,.header,.callbar,.band,.footer,.hero__media{display:none}
  body{color:#000}
}
