/* Manrope, served from this domain. Google Fonts cost a 750ms round trip on
   the critical path: DNS, TLS, the CSS, then the font file. Same typeface,
   one hop. font-display:swap so text is readable immediately and never
   invisible while the font arrives. */
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("../fonts/manrope-latin.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"Manrope";
  font-style:normal;
  font-weight:400 800;
  font-display:swap;
  src:url("../fonts/manrope-latin-ext.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}

/* Lock N Key Storage design system v2 */
:root{
  --green:#54be73; --green-d:#2b8a52; --green-dd:#1f6e3e; --green-ink:#0f2e1d;
  --ink:#15231b; --body:#41514781; --body:#3d4c43; --muted:#728278;
  --bg:#ffffff; --bg-soft:#f3f8f4; --line:#e4ede7; --gold:#f5b301;
  --radius:16px; --radius-sm:12px;
  --shadow:0 8px 26px rgba(20,40,28,.07); --shadow-lg:0 24px 56px rgba(20,40,28,.16);
  --wrap:1180px; --font:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,Arial,sans-serif;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font);color:var(--body);background:var(--bg);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased}
img{max-width:100%;display:block}
a{color:var(--green-d);text-decoration:none}
h1,h2,h3,h4{color:var(--ink);line-height:1.13;margin:0 0 .35em;font-weight:800;letter-spacing:-.022em}
h1{font-size:clamp(2.1rem,4.8vw,3.5rem)}
h2{font-size:clamp(1.7rem,3.6vw,2.6rem)}
h3{font-size:1.28rem}
p{margin:0 0 1rem}
.wrap{max-width:var(--wrap);margin:0 auto;padding:0 24px}
.sec{padding:84px 0}
.sec-sm{padding:56px 0}
.sec-soft{background:var(--bg-soft)}
.eyebrow{color:var(--green-d);font-weight:800;text-transform:uppercase;letter-spacing:.14em;font-size:.78rem;margin-bottom:.7rem}
.center{text-align:center}
.lead{font-size:1.16rem;color:var(--body)}
.muted{color:var(--muted)}
.shead{max-width:640px;margin:0 auto 3rem}
.shead.left{margin-left:0}
.shead p{margin:0}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.55rem;font-weight:700;font-size:1rem;padding:.95rem 1.7rem;border-radius:999px;border:2px solid transparent;cursor:pointer;transition:.18s;line-height:1;white-space:nowrap}
.btn svg{width:18px;height:18px;stroke:currentColor;flex:none}
.btn-primary{background:var(--green);color:#fff;box-shadow:0 10px 22px rgba(84,190,115,.36)}
.btn-primary:hover{background:var(--green-d);color:#fff;transform:translateY(-2px)}
.btn-ghost{background:#fff;color:var(--green-dd);border-color:var(--line)}
.btn-ghost:hover{border-color:var(--green);color:var(--green-d)}
.btn-white{background:#fff;color:var(--green-dd)}
.btn-white:hover{transform:translateY(-2px)}
.btn-outline{background:transparent;color:#fff;border-color:rgba(255,255,255,.55)}
.btn-outline:hover{background:rgba(255,255,255,.12)}
.btn-lg{padding:1.1rem 2.1rem;font-size:1.08rem}
.btn-block{width:100%}

/* header */
.lk-offer{background:var(--green-ink);color:#eafaef;text-align:center;padding:.6rem 1rem;font-weight:600;font-size:.9rem}
.lk-offer b{color:#ffd766}
.lk-head{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.95);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}
.lk-head .wrap{display:flex;align-items:center;gap:1.4rem;height:76px}
.lk-logo{display:flex;align-items:center;gap:.55rem;font-weight:800;color:var(--ink);font-size:1.18rem;letter-spacing:-.02em}
.lk-logo b{color:var(--green-d)}
.lk-nav{display:flex;gap:1.3rem;margin-left:auto;align-items:center}
.lk-nav a{color:var(--ink);font-weight:600;font-size:.95rem;white-space:nowrap}
.lk-nav a:not(.btn):hover{color:var(--green-d)}
.lk-head .btn{padding:.62rem 1.2rem;font-size:.92rem}
.lk-tel{display:inline-flex;align-items:center;gap:.4rem;font-weight:800;color:var(--green-dd);white-space:nowrap}
.lk-tel svg{width:16px;height:16px;stroke:var(--green-dd);flex:none}
.lk-burger{display:none;margin-left:auto;background:none;border:0;cursor:pointer;padding:8px}
.lk-burger span{display:block;width:24px;height:2px;background:var(--ink);margin:5px 0;border-radius:2px}

/* hero */
.hero{position:relative;color:#fff;overflow:hidden;background:var(--green-ink)}
.hero-bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;z-index:0}
.hero::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(9,32,19,.94) 32%,rgba(9,32,19,.62) 70%,rgba(9,32,19,.4));z-index:1}
.hero .wrap{position:relative;z-index:2;padding:104px 24px 96px;max-width:1180px}
.hero-inner{max-width:640px}
.hero .eyebrow{color:#8fe3a9}
.hero h1{color:#fff}
.hero p{color:#e3f2e8;font-size:1.22rem;max-width:560px}
.hero .btns{display:flex;gap:.8rem;flex-wrap:wrap;margin-top:1.7rem}

/* trust bar (under hero) */
.trustbar{background:#fff;border-bottom:1px solid var(--line)}
.trustbar .wrap{display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.trustbar .ti{display:flex;align-items:center;gap:.8rem;padding:22px 20px;border-right:1px solid var(--line)}
.trustbar .ti:last-child{border-right:0}
.trustbar .ti .ic{width:42px;height:42px;border-radius:11px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;flex:none}
.trustbar .ti .ic svg{width:22px;height:22px;stroke:var(--green-d)}
.trustbar .ti b{display:block;color:var(--ink);font-size:.98rem;line-height:1.25}
.trustbar .ti span{font-size:.82rem;color:var(--muted)}

/* location cards */
.loc-grid{display:grid;grid-template-columns:1fr 1fr;gap:30px}
.loc-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.2s;display:flex;flex-direction:column}
.loc-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.loc-media{position:relative;height:250px;overflow:hidden;background:var(--bg-soft)}
.loc-media img{height:100%;width:100%;object-fit:cover;transition:.4s}
.loc-card:hover .loc-media img{transform:scale(1.05)}
.loc-media .badge{position:absolute;top:14px;left:14px;background:rgba(255,255,255,.95);color:var(--green-dd);font-weight:800;font-size:.8rem;padding:.35rem .8rem;border-radius:999px}
.loc-card .body{padding:28px;flex:1;display:flex;flex-direction:column}
.loc-card h3{font-size:1.5rem;margin-bottom:.15rem}
.loc-card .addr{color:var(--muted);font-size:.94rem;margin-bottom:.9rem;display:flex;align-items:center;gap:.4rem}
.loc-card .addr svg{width:16px;height:16px;stroke:var(--green-d);flex:none}
.tags{display:flex;flex-wrap:wrap;gap:.45rem;margin:.2rem 0 1.1rem}
.tag{background:var(--bg-soft);color:var(--green-dd);font-weight:600;font-size:.83rem;padding:.32rem .75rem;border-radius:999px;border:1px solid var(--line)}
.loc-card p{font-size:.98rem}
.loc-card .btns{display:flex;gap:.6rem;margin-top:auto;flex-wrap:wrap}
.loc-card .btns .btn{flex:1}

/* how it works */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;counter-reset:step}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px 28px;position:relative}
.step .n{width:44px;height:44px;border-radius:12px;background:var(--green);color:#fff;font-weight:800;font-size:1.2rem;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.step h3{margin-bottom:.3rem}
.step p{margin:0;font-size:.97rem}

/* features */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.feat{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px}
.feat .ic{width:50px;height:50px;border-radius:13px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.feat .ic svg{width:26px;height:26px;stroke:var(--green-d)}
.feat h3{font-size:1.14rem;margin-bottom:.35rem}
.feat p{font-size:.96rem;margin:0}

.units-note{font-size:.92rem;color:var(--muted);margin:1.1rem 0 0;text-align:center}

/* features as photo cards */
.fcards{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
.fcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:.2s}
.fcard:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.fcard-media{height:200px;overflow:hidden;background:var(--bg-soft);flex:none}
.fcard-media img{width:100%;height:100%;object-fit:cover;object-position:center 38%;transition:.4s}
.fcard:hover .fcard-media img{transform:scale(1.05)}
.fcard-body{padding:24px 26px 26px}
.fcard-head{display:flex;align-items:center;gap:.7rem;margin-bottom:.5rem}
.fcard-head .ic{width:38px;height:38px;border-radius:11px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;flex:none}
.fcard-head .ic svg{width:20px;height:20px;stroke:var(--green-d)}
.fcard h3{font-size:1.12rem;margin:0;line-height:1.25}
.fcard p{font-size:.96rem;margin:0}

/* feature split (image + list) */
.fsplit{display:grid;grid-template-columns:1.25fr 1fr;gap:52px;align-items:stretch}
.fsplit img{border-radius:var(--radius);box-shadow:var(--shadow);height:100%;min-height:520px;max-height:660px;width:100%;object-fit:cover;object-position:center 34%;background:var(--bg-soft)}
.fsplit>div{align-self:center}
.checks{list-style:none;padding:0;margin:1.2rem 0 0}
.checks li{display:flex;gap:.7rem;padding:.55rem 0;align-items:flex-start;font-size:1.02rem;color:var(--body)}
.checks li svg{width:22px;height:22px;stroke:#fff;background:var(--green);border-radius:50%;padding:4px;flex:none;margin-top:2px}

/* gallery band */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gal img{height:210px;width:100%;object-fit:cover;border-radius:var(--radius-sm);background:var(--bg-soft)}
.gal .tall{grid-row:span 2;height:auto}

/* units table */
.units{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow)}
.units table{width:100%;border-collapse:collapse}
.units th,.units td{text-align:left;padding:17px 22px;border-bottom:1px solid var(--line)}
.units th{background:var(--green-ink);color:#fff;font-size:.78rem;text-transform:uppercase;letter-spacing:.07em}
.units tr:last-child td{border-bottom:0}
.units tbody tr:hover{background:var(--bg-soft)}
.units .sz{font-weight:800;color:var(--ink);font-size:1.12rem}
.units .price{font-weight:800;color:var(--green-d);white-space:nowrap}
.units .price small{display:block;color:var(--muted);font-weight:600;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em}
.units td .btn{padding:.5rem 1.1rem;font-size:.86rem}
.pill-type{display:inline-block;font-size:.78rem;font-weight:700;padding:.24rem .7rem;border-radius:999px}
.pill-cov{background:#e7f6ec;color:var(--green-dd)}
.pill-unc{background:#eef1ef;color:var(--muted)}

/* city links */
.citylinks{display:flex;flex-wrap:wrap;gap:12px;justify-content:center}
.citylinks a{display:inline-flex;align-items:center;gap:.4rem;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.7rem 1.3rem;font-weight:700;color:var(--green-dd);box-shadow:var(--shadow);transition:.18s}
.citylinks a:hover{border-color:var(--green);transform:translateY(-2px);color:var(--green-d)}
.citylinks a svg{width:17px;height:17px;stroke:var(--green-d)}

/* size cards */
.sizes{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:20px}
.szcard{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;box-shadow:var(--shadow);transition:.2s}
.szcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.szcard .d{font-size:2rem;font-weight:800;color:var(--green-d);letter-spacing:-.02em}
.szcard .t{font-size:.76rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:.35rem 0 .7rem}
.szcard p{font-size:.95rem;margin:0}

/* info + map split */
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:stretch}
.info-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow)}
.info-card .row{display:flex;gap:.8rem;padding:.85rem 0;border-bottom:1px solid var(--line);align-items:flex-start}
.info-card .row:last-child{border-bottom:0}
.info-card .row svg{width:21px;height:21px;stroke:var(--green-d);flex:none;margin-top:2px}
.info-card .row b{color:var(--ink);display:block;font-size:.99rem}
.info-card .row span{font-size:.93rem;color:var(--muted)}
.mapframe{border:0;width:100%;height:100%;min-height:420px;border-radius:var(--radius);box-shadow:var(--shadow);display:block}

/* use-case "who this is for" */
.uc-who{display:grid;grid-template-columns:1fr 1fr;gap:48px;align-items:center}
.uc-who .checks{margin:0}
.uc-who img{border-radius:var(--radius);box-shadow:var(--shadow);width:100%;height:100%;min-height:340px;max-height:460px;object-fit:cover;background:var(--bg-soft)}

/* reviews */
.rating-badge{display:inline-flex;align-items:center;gap:.5rem;background:#fff;border:1px solid var(--line);border-radius:999px;padding:.5rem 1.1rem;margin-top:1rem;font-size:.95rem;color:var(--body);box-shadow:var(--shadow)}
.rating-badge .stars{color:var(--gold);letter-spacing:1px;font-size:1rem;margin:0}
.rating-badge b{color:var(--ink)}
.rev-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.rev{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:30px;box-shadow:var(--shadow);display:flex;flex-direction:column}
.stars{color:var(--gold);font-size:1.1rem;letter-spacing:2px;margin-bottom:.7rem}
.rev p{font-size:1rem;color:var(--body);flex:1}
.rev .who{font-weight:800;color:var(--ink);margin-top:1rem;font-size:.93rem;display:flex;align-items:center;gap:.55rem}
.rev .who .av{width:34px;height:34px;border-radius:50%;background:var(--green);color:#fff;display:flex;align-items:center;justify-content:center;font-size:.85rem;font-weight:800;flex:none}

/* group locations page */
.grp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.grp-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:.2s}
.grp-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.grp-card.is-here{border-color:var(--green);box-shadow:0 0 0 2px rgba(84,190,115,.25),var(--shadow)}
.grp-top{display:flex;gap:.85rem;align-items:flex-start;position:relative}
.grp-top .ic{width:42px;height:42px;border-radius:11px;background:var(--bg-soft);display:flex;align-items:center;justify-content:center;flex:none}
.grp-top .ic svg{width:22px;height:22px;stroke:var(--green-d)}
.grp-card h3{font-size:1.16rem;margin:0 0 .15rem;line-height:1.3}
.grp-type{font-size:.87rem;color:var(--muted)}
.grp-card.is-here .grp-top h3{padding-right:6.2rem}
.grp-badge{position:absolute;top:-4px;right:0;background:var(--green);color:#fff;font-weight:700;font-size:.7rem;letter-spacing:.03em;padding:.25rem .6rem;border-radius:999px}
.grp-meta{list-style:none;padding:0;margin:1.1rem 0 1.4rem;font-size:.95rem;color:var(--body)}
.grp-meta li{padding:.2rem 0}
.grp-card .btns{display:flex;gap:.6rem;margin-top:auto;flex-wrap:wrap}
.grp-card .btns .btn{flex:1;padding:.75rem 1rem;font-size:.92rem}

/* climate callout */
.climate{background:linear-gradient(120deg,var(--green-ink),#123f27);color:#eaf6ee;border-radius:var(--radius);padding:0;display:grid;grid-template-columns:1fr 1fr;gap:0;overflow:hidden;align-items:stretch}
.climate .txt{padding:48px;align-self:center}
.climate img{height:100%;width:100%;object-fit:cover;min-height:320px;align-self:stretch}
.climate h2{color:#fff}
.climate p{color:#cfe6d6;margin:0}
.climate .checks li{color:#dcefe2}
.climate .checks li svg{background:rgba(255,255,255,.16);stroke:#fff}
.climate .btns{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.7rem}

/* CTA band */
.cta-band{background:linear-gradient(120deg,var(--green-dd),var(--green-d));color:#fff;text-align:center;border-radius:var(--radius);padding:60px 30px}
.cta-band h2{color:#fff}
.cta-band p{color:#e6f4ea;max-width:560px;margin:0 auto 1.6rem}
.cta-band .btns{display:flex;gap:.8rem;justify-content:center;flex-wrap:wrap}

/* page hero (sub) */
.phero{position:relative;color:#fff;background:var(--green-ink);overflow:hidden}
.phero-bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;z-index:0;opacity:.5}
.phero::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(9,32,19,.92),rgba(9,32,19,.6));z-index:1}
.phero .wrap{position:relative;z-index:2;padding:64px 24px 68px}
.phero h1{color:#fff;margin-bottom:.35rem}
.phero p{color:#d3e8da;font-size:1.18rem;max-width:660px;margin:0}
.phero .btns{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.5rem}
.crumb{font-size:.85rem;color:#a9c9b5;margin-bottom:1rem}
.crumb a{color:#a9c9b5}

/* faq */
.faq-item{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);margin-bottom:12px;overflow:hidden}
.faq-item summary{padding:20px 24px;font-weight:700;color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;font-size:1.06rem}
.faq-item summary::-webkit-details-marker{display:none}
.faq-item summary::after{content:"+";color:var(--green-d);font-size:1.5rem;line-height:1;flex:none}
.faq-item[open] summary::after{content:"\2013"}
.faq-item .a{padding:0 24px 20px;color:var(--body)}

/* form */
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:32px;box-shadow:var(--shadow)}
.form label{display:block;font-weight:700;color:var(--ink);margin:0 0 .35rem;font-size:.9rem}
.form input,.form select,.form textarea{width:100%;padding:.85rem 1rem;border:1px solid var(--line);border-radius:10px;font-family:inherit;font-size:1rem;margin-bottom:1.1rem;color:var(--ink);background:#fff}
.form input:focus,.form select:focus,.form textarea:focus{outline:none;border-color:var(--green);box-shadow:0 0 0 3px rgba(84,190,115,.15)}

/* footer */
.lk-foot{background:var(--green-ink);color:#b9d2c3;padding:60px 0 26px}
.lk-foot a{color:#cfe6d6}
.lk-foot a:hover{color:#fff}
.lk-foot .cols{display:grid;grid-template-columns:1.5fr 1fr 1fr 1.2fr;gap:36px}
/* single-location sites render 3 columns, so spread them across the full width */
.lk-foot .cols.cols-3{grid-template-columns:1.5fr 1fr 1.2fr;gap:56px}
.lk-foot h4{color:#fff;font-size:1rem;margin-bottom:1rem}
.lk-foot ul{list-style:none;padding:0;margin:0}
.lk-foot li{margin-bottom:.55rem;font-size:.94rem}
.lk-foot .brand{font-weight:800;color:#fff;font-size:1.25rem;margin-bottom:.7rem}
.lk-foot .brand b{color:var(--green)}
.lk-foot .bottom{border-top:1px solid rgba(255,255,255,.12);margin-top:38px;padding-top:22px;font-size:.85rem;display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem;color:#8fae9c}
.foot-areas{border-top:1px solid rgba(255,255,255,.12);margin-top:36px;padding-top:26px}
.foot-areas h4{margin-bottom:.3rem}
.foot-areas-sub{color:#8fae9c;font-size:.9rem;margin:0 0 1.3rem;max-width:640px}
.foot-city-cols{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(4,1fr);gap:.7rem 2rem}
.foot-city-cols li a,.foot-city-cols li span{display:inline-flex;align-items:center;gap:.5rem;color:#cfe6d6;font-size:.9rem;line-height:1.3}
.foot-city-cols li a svg,.foot-city-cols li span svg{width:14px;height:14px;stroke:var(--green);flex:none}
.foot-city-cols li a:hover{color:#fff}
@media(max-width:900px){.foot-city-cols{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.foot-city-cols{grid-template-columns:1fr}}

@media(max-width:980px){
  .lk-nav{display:none}
  .lk-burger{display:block}
  .lk-nav.open{display:flex;position:absolute;top:76px;left:0;right:0;background:#fff;flex-direction:column;align-items:flex-start;padding:20px 24px;gap:1.1rem;border-bottom:1px solid var(--line);box-shadow:var(--shadow-lg)}
  .loc-grid,.steps,.feat-grid,.rev-grid,.split,.fsplit,.climate,.uc-who{grid-template-columns:1fr}
  .fcards{grid-template-columns:1fr 1fr}
  .trustbar .wrap{grid-template-columns:1fr 1fr}
  .trustbar .ti:nth-child(2){border-right:0}
  .trustbar .ti{border-bottom:1px solid var(--line)}
  .gal{grid-template-columns:1fr 1fr}
  .gal .tall{grid-row:auto}
  .climate img{min-height:240px;max-height:320px}
  .grp-grid{grid-template-columns:1fr 1fr}
  .fsplit img{min-height:280px;max-height:360px}
  .sec{padding:56px 0}
}
@media(max-width:560px){
  body{font-size:16px}
  .feat-grid,.rev-grid,.gal,.grp-grid,.fcards{grid-template-columns:1fr}
  .hero .wrap{padding:72px 24px 64px}
  .loc-card .btns{flex-direction:column}
  .loc-card .btns .btn{width:100%}
}

/* blog */
.post-hero{position:relative;color:#fff;background:var(--green-ink);overflow:hidden}
.post-hero .phero-bg{position:absolute;inset:0;object-fit:cover;width:100%;height:100%;z-index:0;opacity:.42}
.post-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,rgba(9,32,19,.92),rgba(9,32,19,.62));z-index:1}
.post-hero .wrap{position:relative;z-index:2;padding:60px 24px 62px}
.post-hero h1{color:#fff;margin-bottom:.55rem;max-width:820px}
.post-hero p{color:#d3e8da;font-size:1.12rem;max-width:680px;margin:0}
.post-meta{display:inline-flex;align-items:center;gap:.5rem;color:#bfe0cb;font-weight:600;font-size:.95rem;margin-top:.3rem}
.post-meta svg{width:17px;height:17px;stroke:#bfe0cb;flex:none}

.post-body{max-width:760px;margin:0 auto}
.post-body > *:first-child{margin-top:0}
.post-body h2{font-size:1.72rem;margin:2.3rem 0 .8rem}
.post-body h3{font-size:1.32rem;margin:1.9rem 0 .6rem}
.post-body p{margin:0 0 1.25rem;color:var(--body)}
.post-body a{color:var(--green-d);text-decoration:underline;text-underline-offset:2px}
.post-body a:hover{color:var(--green-dd)}
.post-body ul,.post-body ol{margin:0 0 1.3rem;padding-left:1.3rem}
.post-body li{margin:0 0 .55rem;line-height:1.65}
.post-body ul li::marker{color:var(--green-d)}
.post-body strong{color:var(--ink)}
.post-body img{max-width:100%;height:auto;border-radius:var(--radius-sm);box-shadow:var(--shadow);margin:1.6rem 0}
.post-body figure{margin:1.6rem 0}
.post-body figure img{margin:0}
.post-body figcaption{font-size:.88rem;color:var(--muted);text-align:center;margin-top:.6rem}
.post-body blockquote{margin:1.7rem 0;padding:1rem 1.4rem;border-left:4px solid var(--green);background:var(--bg-soft);border-radius:0 var(--radius-sm) var(--radius-sm) 0;color:var(--ink);font-style:italic}
.post-body blockquote p:last-child{margin:0}
.post-body hr{border:0;border-top:1px solid var(--line);margin:2.2rem 0}
.post-body table{width:100%;border-collapse:collapse;margin:1.6rem 0;font-size:.97rem}
.post-body th,.post-body td{text-align:left;padding:.7rem 1rem;border-bottom:1px solid var(--line)}
.post-body th{background:var(--bg-soft);color:var(--ink)}

/* faq accordion inside blog content (pipeline outputs details/summary or .lk-faq) */
.post-body details,.lk-faq details{background:#fff;border:1px solid var(--line);border-radius:var(--radius-sm);margin:0 0 12px;overflow:hidden}
.post-body summary,.lk-faq summary{padding:18px 22px;font-weight:700;color:var(--ink);cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem;font-size:1.04rem}
.post-body summary::-webkit-details-marker,.lk-faq summary::-webkit-details-marker{display:none}
.post-body summary::after,.lk-faq summary::after{content:"+";color:var(--green-d);font-size:1.5rem;line-height:1;flex:none}
.post-body details[open] summary::after,.lk-faq details[open] summary::after{content:"\2013"}
.post-body details > *:not(summary),.lk-faq details > *:not(summary){padding:0 22px 18px;margin:0}

.blog-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.blog-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:.2s;display:flex;flex-direction:column}
.blog-card:hover{transform:translateY(-5px);box-shadow:var(--shadow-lg)}
.bc-media{display:block;height:200px;background:var(--bg-soft);overflow:hidden}
.bc-media img{width:100%;height:100%;object-fit:cover;display:block;transition:.3s}
.blog-card:hover .bc-media img{transform:scale(1.04)}
.bc-ph{display:flex;align-items:center;justify-content:center;height:100%;background:var(--bg-soft)}
.bc-ph svg{width:46px;height:46px;stroke:var(--green-d);opacity:.5}
.bc-body{padding:24px 24px 26px;display:flex;flex-direction:column;flex:1}
.bc-date{color:var(--green-d);font-weight:700;font-size:.78rem;text-transform:uppercase;letter-spacing:.06em;margin-bottom:.6rem}
.bc-body h2{font-size:1.24rem;line-height:1.25;margin:0 0 .6rem}
.bc-body h2 a{color:var(--ink)}
.bc-body h2 a:hover{color:var(--green-d)}
.bc-body p{color:var(--body);font-size:.98rem;margin:0 0 1.1rem}
.bc-more{margin-top:auto;font-weight:700;color:var(--green-d)}
.bc-more:hover{color:var(--green-dd)}

.blog-pag{display:flex;gap:.5rem;justify-content:center;margin-top:48px;flex-wrap:wrap}
.blog-pag .page-numbers{display:inline-flex;align-items:center;justify-content:center;min-width:44px;height:44px;padding:0 .9rem;border:1px solid var(--line);border-radius:10px;font-weight:700;color:var(--green-dd);background:#fff}
.blog-pag .page-numbers.current{background:var(--green);color:#fff;border-color:var(--green)}
.blog-pag a.page-numbers:hover{border-color:var(--green);color:var(--green-d)}

.blog-empty{text-align:center;padding:40px 0}
.blog-empty p{color:var(--muted);font-size:1.1rem;margin-bottom:1.5rem}

@media(max-width:980px){.blog-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){
  .blog-grid{grid-template-columns:1fr}
  .post-body h2{font-size:1.45rem}
  .post-hero .wrap{padding:48px 24px 50px}
}

/* =========================================================================
   Mobile. The location pages are read almost entirely on phones — someone
   sitting in a truck with a boat behind them — so the phone layout is the
   real layout, not a fallback.
   ========================================================================= */

/* Nothing may ever scroll the page sideways. */
html, body { max-width: 100%; overflow-x: hidden; }
img, iframe, video, table { max-width: 100%; }

@media (max-width: 900px) {
  /* A 420px map is most of a phone screen before you have read anything. */
  .mapframe { min-height: 260px; height: 260px; }
  .split { gap: 24px; }
  .info-card { padding: 22px 18px; }
  .cta-band { padding: 40px 22px; border-radius: 12px; }
  .phero .wrap { padding: 48px 20px 52px; }
  .phero p { font-size: 1.05rem; }
}

@media (max-width: 640px) {
  /* Four trust items across a phone is unreadable; two rows of two is not
     much better once the icons and two lines of text are in. Go to one. */
  .trustbar .wrap { grid-template-columns: 1fr; }
  .trustbar .ti { border-right: 0; border-bottom: 1px solid var(--line); padding: 15px 4px; }
  .trustbar .ti:last-child { border-bottom: 0; }

  .wrap { padding-left: 18px; padding-right: 18px; }
  .sec { padding: 40px 0; }
  .sec-sm { padding: 32px 0; }
  .shead { margin-bottom: 2rem; }

  /* Long button labels must wrap rather than push the page wide. */
  .btn { white-space: normal; text-align: center; padding: .9rem 1.3rem; }
  .btns { width: 100%; }
  .btns .btn { flex: 1 1 100%; }

  /* Thumb-sized targets for the things people actually tap on a dock or a lot. */
  .lk-tel, .lk-nav a { padding: 10px 0; display: flex; align-items: center; min-height: 44px; }
  .lk-head .wrap { height: 66px; }
  .lk-offer { font-size: .82rem; line-height: 1.4; padding: .55rem .9rem; }

  .checks li { font-size: .97rem; align-items: flex-start; }
  .info-card .row { padding: .8rem 0; }
  .crumb { font-size: .8rem; }
  .foot-areas h4 { font-size: .95rem; }
  .lk-foot { padding: 40px 0 20px; }
  .lk-foot .bottom { flex-direction: column; gap: .4rem; }
}

@media (max-width: 430px) {
  /* Small phones: keep the headline from breaking mid-word. */
  h1 { font-size: clamp(1.75rem, 8.5vw, 2.3rem); overflow-wrap: break-word; }
  h2 { font-size: clamp(1.4rem, 6.5vw, 1.9rem); }
  .hero .wrap { padding: 60px 18px 52px; }
  .mapframe { min-height: 220px; height: 220px; }
}

/* Respect a reduced-motion preference. */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: .01ms !important; transition-duration: .01ms !important; }
}

/* -------------------------------------------------------------------------
   The rates table on a phone.
   Five columns (size, type, best-for, price, reserve) will not fit a 375px
   screen at any sane font size. A sideways scroll is the usual dodge, but
   people are comparing sizes here, so each row becomes a card instead.
   ------------------------------------------------------------------------- */

.units { overflow-x: auto; -webkit-overflow-scrolling: touch; }

@media (max-width: 720px) {
  .units { overflow: visible; background: transparent; border: 0; box-shadow: none; }
  .units table, .units tbody, .units tr, .units td { display: block; width: 100%; }
  .units thead { display: none; }

  .units tr {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 6px 12px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    box-shadow: var(--shadow);
    padding: 15px 16px;
    margin-bottom: 10px;
  }
  .units tr:last-child { margin-bottom: 0; }
  .units td { border: 0; padding: 0; }

  .units td.sz { grid-column: 1; grid-row: 1; font-size: 1.35rem; line-height: 1; }
  .units td:nth-child(2) { grid-column: 2; grid-row: 1; justify-self: start; }
  .units td:nth-child(3) {
    grid-column: 1 / -1; grid-row: 2;
    font-size: .92rem; color: var(--muted); line-height: 1.45;
  }
  .units td.price {
    grid-column: 1; grid-row: 3; font-size: 1.05rem; white-space: normal;
    padding-top: 4px;
  }
  .units td.price small { font-size: .68rem; }
  .units td:nth-child(5) { grid-column: 2; grid-row: 3; justify-self: end; padding-top: 4px; }
  .units td:nth-child(5) .btn { padding: .6rem 1.15rem; font-size: .88rem; white-space: nowrap; }
}

/* Any other table keeps a proper scroll container with a visible edge. */
.lk-table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 720px) {
  table:not(.units table) { display: block; overflow-x: auto; white-space: nowrap; }
}

/* Components that only exist on the single-location sites. */
@media (max-width: 640px) {
  .fcards, .grp-grid, .blog-grid { grid-template-columns: 1fr; }
  .fcard-media img, .bc-media img { height: 190px; }
  .post-hero .wrap { padding: 44px 18px 46px; }
  .post-body { font-size: 1rem; }
  .post-body h2 { font-size: 1.35rem; }
  .grp-top { flex-wrap: wrap; gap: .5rem; }
  .units-note { font-size: .85rem; line-height: 1.5; }
  .blog-pag { flex-wrap: wrap; gap: .5rem; }
}

/* -------------------------------------------------------------------------
   Second mobile pass. Every rule below corrects a desktop-first rule at
   phone and small-tablet widths. Nothing here changes the desktop layout.
   ------------------------------------------------------------------------- */

/* Jumping to an anchor used to park the heading under the sticky header. */
html { scroll-padding-top: 92px; }

/* The footer held four fixed columns at every width, so the address and the
   phone number ran off the side of the screen on a phone. */
@media (max-width: 900px) {
  .lk-foot .cols,
  .lk-foot .cols.cols-3 { grid-template-columns: 1fr 1fr; gap: 28px; }
}

/* The number was buried in the collapsed menu, two taps from a page whose
   whole job is to get the call. It now rides in the header itself. */
.lk-call-m { display: none; }

@media (max-width: 980px) {
  .lk-head .wrap { gap: .6rem; }
  .lk-logo { margin-right: auto; min-width: 0; }
  .lk-call-m {
    display: inline-flex; align-items: center; gap: .4rem; flex: none;
    background: var(--green-dd); color: #fff; text-decoration: none;
    padding: 0 1rem; min-height: 44px; border-radius: 999px;
    font-size: .95rem; font-weight: 800; white-space: nowrap;
  }
  .lk-call-m svg { width: 16px; height: 16px; stroke: #fff; flex: none; }
  .lk-burger { margin-left: 0; padding: 10px; min-width: 44px; min-height: 44px; }

  /* The open menu sat 10px below the header, showing a strip of the page
     scrolling through the seam. */
  .lk-nav.open { top: 76px; }
}

@media (max-width: 720px) {
  /* 48px of padding on a one-column panel left a 188px column of text. */
  .climate .txt { padding: 28px 20px; }
}

@media (max-width: 640px) {
  .lk-foot .cols,
  .lk-foot .cols.cols-3 { grid-template-columns: 1fr; gap: 26px; }
  .foot-city-cols li a,
  .foot-city-cols li span { min-height: 40px; }
  .lk-nav.open { top: 66px; }
}

@media (max-width: 560px) {
  /* The size cards exist to be compared, so keep two of them side by side
     rather than dropping to a single column and losing the comparison. */
  .sizes { grid-template-columns: 1fr 1fr; gap: 12px; }
  .szcard { padding: 18px 15px; }
  .szcard .d { font-size: 1.55rem; }
  .szcard p { font-size: .88rem; line-height: 1.45; }

  /* Four full-width photos was 880px of scrolling before the contact card. */
  .gal img { height: 165px; }
}

@media (max-width: 430px) {
  /* Card padding was eating a fifth of the usable width. */
  .feat, .rev, .step { padding: 22px 18px; }
  .lk-logo img { height: 44px !important; }
  .lk-call-m { padding: 0 .8rem; }
  .lk-call-m .num { display: none; }
  .lk-call-m::after { content: "Call"; }
}

/* The badge used five solid stars regardless of the score. Fill to the real
   fraction so the stars and the number tell the same story. */
.stars-part { position: relative; display: inline-block; color: var(--line); letter-spacing: 1px; }
.stars-part::before { content: "\2605\2605\2605\2605\2605"; }
.stars-part i { position: absolute; left: 0; top: 0; overflow: hidden; white-space: nowrap; color: var(--gold); font-style: normal; }
.stars-part i::before { content: "\2605\2605\2605\2605\2605"; }

/* Reserve form: confirmation and error notes, plus the bot honeypot. */
.lk-note { border-radius: var(--radius-sm); padding: 16px 18px; margin-bottom: 1.3rem; font-size: .96rem; line-height: 1.55; }
.lk-note b { display: block; margin-bottom: .2rem; }
.lk-note-ok { background: #eaf6ee; border: 1px solid #bfe0cb; color: var(--green-dd); }
.lk-note-err { background: #fdeeee; border: 1px solid #f1c4c4; color: #8a2020; }
.lk-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }