/* ==========================================================================
   location-premium.css
   Premium layer for /deck-builder/ location pages.
   Loaded AFTER brand.css. Uses the existing brand tokens only - no new
   colors, no new fonts. Scoped to .locp so no other page is affected.
   ========================================================================== */

.locp{
  --locp-gold:      hsl(38, 46%, 62%);           /* warm accent, derived from --sand */
  --locp-gold-soft: hsla(38, 46%, 62%, .22);
  --locp-ring:      hsla(143, 17%, 29%, .16);
  --locp-ease:      cubic-bezier(.22, 1, .36, 1);
}

/* --------------------------------------------------------------------------
   1. Scroll reveal  (opt-in, honors reduced motion)
   -------------------------------------------------------------------------- */
.locp [data-reveal]{
  opacity: 0;
  transform: translateY(22px);
  transition: opacity .7s var(--locp-ease), transform .7s var(--locp-ease);
  transition-delay: var(--reveal-delay, 0ms);
  will-change: opacity, transform;
}
.locp [data-reveal].is-in{
  opacity: 1;
  transform: none;
}
/* If JS never runs, content must still be visible. */
.locp.no-js [data-reveal]{ opacity:1; transform:none; }

@media (prefers-reduced-motion: reduce){
  .locp [data-reveal],
  .locp [data-reveal].is-in{
    opacity: 1 !important;
    transform: none !important;
    transition: none !important;
  }
}

/* --------------------------------------------------------------------------
   2. Hero
   -------------------------------------------------------------------------- */
.locp-hero{
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  min-height: clamp(30rem, 74vh, 44rem);
  padding-block: clamp(6rem, 14vw, 9rem) clamp(3rem, 7vw, 4.5rem);
  overflow: hidden;
  background: var(--ink);
}
.locp-hero__bg{ position:absolute; inset:0; z-index:-2; }
.locp-hero__bg img{
  width:100%; height:100%; object-fit:cover; display:block;
  transform: scale(1.06);
  will-change: transform;
}
.locp-hero::after{
  content:""; position:absolute; inset:0; z-index:-1;
  background:
    linear-gradient(to top, hsla(140,16%,7%,.93) 0%, hsla(140,16%,7%,.72) 38%, hsla(140,16%,7%,.30) 70%, hsla(140,16%,7%,.42) 100%);
}
.locp-hero .container{ position:relative; }

.locp-hero__crumbs{
  font-size:.82rem; color:hsla(0,0%,100%,.62); margin-bottom:1.1rem;
  display:flex; flex-wrap:wrap; gap:.4rem; align-items:center;
}
.locp-hero__crumbs a{ color:hsla(0,0%,100%,.78); text-decoration:none; }
.locp-hero__crumbs a:hover{ color:#fff; text-decoration:underline; }
.locp-hero__crumbs span[aria-hidden]{ opacity:.45; }

.locp-hero .eyebrow{
  display:inline-flex; align-items:center; gap:.55rem;
  color:var(--locp-gold); letter-spacing:.14em;
}
.locp-hero .eyebrow::before{
  content:""; width:26px; height:2px; background:var(--locp-gold); border-radius:2px;
}
.locp-hero h1{
  color:#fff; margin:.55rem 0 0; max-width:17ch;
  text-wrap: balance;
  text-shadow: 0 2px 26px hsla(140,16%,5%,.5);
}
.locp-hero__sub{
  color:hsla(0,0%,100%,.86); font-size:var(--fs-lead);
  max-width:52ch; margin:1.1rem 0 0;
}
.locp-hero .btn-row{ margin-top:1.9rem; }

/* --------------------------------------------------------------------------
   3. Stat strip  (the research, made scannable)
   -------------------------------------------------------------------------- */
.locp-stats{
  background: var(--ink-2);
  border-top: 1px solid hsla(0,0%,100%,.08);
  padding-block: clamp(2.2rem, 4.5vw, 3rem);
}
.locp-stats__grid{
  display:grid; gap:1.6rem 1.2rem;
  grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr));
}
.locp-stat{ position:relative; padding-left:1.15rem; }
.locp-stat::before{
  content:""; position:absolute; left:0; top:.28rem; bottom:.28rem;
  width:2px; border-radius:2px;
  background: linear-gradient(to bottom, var(--locp-gold), hsla(38,46%,62%,0));
}
.locp-stat__num{
  display:block; font-family:var(--font-head); font-weight:800;
  font-size: clamp(1.75rem, 1.2rem + 1.6vw, 2.45rem);
  line-height:1.05; color:#fff; letter-spacing:-.02em;
  font-variant-numeric: tabular-nums;
}
.locp-stat__num .u{ font-size:.5em; font-weight:700; opacity:.72; margin-left:.12em; }
.locp-stat__lbl{
  display:block; margin-top:.5rem; font-size:.88rem; line-height:1.45;
  color:hsla(0,0%,100%,.70); max-width:26ch;
}

/* --------------------------------------------------------------------------
   4. Intro
   -------------------------------------------------------------------------- */
.locp-intro{ padding-block: clamp(3.5rem, 8vw, 5.5rem); }
.locp-intro .lead{
  font-size: clamp(1.14rem, 1rem + .58vw, 1.42rem);
  line-height:1.62; color:var(--text);
}
.locp-intro .lead::first-letter{
  float:left; font-family:var(--font-head); font-weight:800;
  font-size:3.3em; line-height:.84; padding:.06em .14em 0 0;
  color:var(--green);
}
.locp-intro p + p{ margin-top:1.3rem; color:var(--muted); }

/* --------------------------------------------------------------------------
   5. Services  (numbered editorial cards)
   -------------------------------------------------------------------------- */
/* 5 services on a 6-cell grid: the two flagship services take 3 columns
   each on the top row, the remaining three take 2 columns each below.
   Result is two full, symmetrical rows instead of a 3 + 2 orphan row.
   Each card carries its own photo, so no orphan image is needed below. */
.locp-services{
  display:grid; gap:1.35rem;
  grid-template-columns: 1fr;
  counter-reset: svc;
}
@media (min-width: 760px){
  .locp-services{ grid-template-columns: repeat(6, 1fr); }
  .locp-svc{ grid-column: span 3; }                 /* row 1: two cards */
  .locp-svc:nth-child(n+3){ grid-column: span 2; }  /* row 2: three cards */
  /* Card counts other than 5 tile evenly on their own. */
  .locp-services--even{ grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); }
  .locp-services--even .locp-svc,
  .locp-services--even .locp-svc:nth-child(n+3){ grid-column: auto; }
}
.locp-svc{
  counter-increment: svc;
  position:relative;
  display:flex; flex-direction:column;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  overflow:hidden;
  box-shadow: var(--shadow-sm);
  transition: transform .45s var(--locp-ease), box-shadow .45s var(--locp-ease), border-color .45s var(--locp-ease);
}
.locp-svc:hover{
  transform: translateY(-6px);
  box-shadow: var(--shadow-lg);
  border-color: var(--locp-ring);
}

/* ---- card photo ---- */
.locp-svc__media{
  position:relative; overflow:hidden; line-height:0;
  background:var(--sand);
}
.locp-svc__media img{
  width:100%; height:100%; object-fit:cover; display:block;
  aspect-ratio: 16 / 10;
  transition: transform .8s var(--locp-ease);
}
.locp-svc:nth-child(-n+2) .locp-svc__media img{ aspect-ratio: 16 / 9; }
.locp-svc:hover .locp-svc__media img{ transform: scale(1.055); }
.locp-svc__media::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, hsla(140,16%,9%,.42), hsla(140,16%,9%,0) 55%);
}
/* number badge sits on the photo */
.locp-svc__media .n{
  position:absolute; left:1rem; bottom:.85rem; z-index:1;
  font-family:var(--font-head); font-weight:800; font-size:.8rem;
  letter-spacing:.1em; color:#fff; opacity:.9;
}
.locp-svc__media .n::before{ content: counter(svc, decimal-leading-zero); }

/* ---- card body ---- */
.locp-svc__body{
  display:flex; flex-direction:column; flex:1;
  padding: 1.5rem 1.6rem 1.5rem;
}
.locp-svc__ico{
  width:40px; height:40px; border-radius:11px;
  display:grid; place-items:center; margin-bottom:.9rem;
  background: linear-gradient(145deg, hsla(143,17%,29%,.10), hsla(143,17%,29%,.04));
  border:1px solid var(--locp-ring);
  color:var(--green); flex:none;
}
.locp-svc__ico svg{ width:20px; height:20px; }
.locp-svc h3{
  font-size:1.16rem; margin:0 0 .55rem; letter-spacing:-.01em;
}
.locp-svc h3 a{ color:var(--ink); text-decoration:none; }
.locp-svc h3 a:hover{ color:var(--green); }
.locp-svc p{ margin:0; font-size:.965rem; line-height:1.7; color:var(--muted); }

/* ---- read more ---- */
.locp-svc__more{
  overflow:hidden;
  max-height:0;
  opacity:0;
  transition: max-height .55s var(--locp-ease), opacity .4s var(--locp-ease), margin-top .55s var(--locp-ease);
}
.locp-svc.is-open .locp-svc__more{
  max-height: 46rem;      /* generous: never clips real copy */
  opacity:1;
  margin-top:.75rem;
}
.locp-svc__toggle{
  appearance:none; border:0; background:transparent; cursor:pointer;
  margin-top:auto; padding:.9rem 0 0;
  display:inline-flex; align-items:center; gap:.45rem; align-self:flex-start;
  font-family:var(--font-head); font-weight:700; font-size:.875rem;
  letter-spacing:.02em; color:var(--green);
  transition: color .3s var(--locp-ease), gap .3s var(--locp-ease);
}
.locp-svc__toggle:hover{ color:var(--green-dark); gap:.7rem; }
.locp-svc__toggle:focus-visible{
  outline:2px solid var(--green); outline-offset:3px; border-radius:4px;
}
.locp-svc__toggle svg{
  width:15px; height:15px; flex:none;
  transition: transform .4s var(--locp-ease);
}
.locp-svc.is-open .locp-svc__toggle svg{ transform: rotate(180deg); }
.locp-svc__toggle .lbl-less{ display:none; }
.locp-svc.is-open .locp-svc__toggle .lbl-more{ display:none; }
.locp-svc.is-open .locp-svc__toggle .lbl-less{ display:inline; }

/* No JS: show everything, hide the control. */
.locp.no-js .locp-svc__more{ max-height:none; opacity:1; margin-top:.75rem; }
.locp.no-js .locp-svc__toggle{ display:none; }

@media (prefers-reduced-motion: reduce){
  .locp-svc,
  .locp-svc__media img,
  .locp-svc__more,
  .locp-svc__toggle,
  .locp-svc__toggle svg{ transition:none; }
  .locp-svc:hover{ transform:none; }
  .locp-svc:hover .locp-svc__media img{ transform:none; }
}

/* --------------------------------------------------------------------------
   6. Wide media band
   -------------------------------------------------------------------------- */
.locp-media{
  border-radius: var(--radius-lg);
  overflow:hidden;
  box-shadow: var(--shadow-lg);
  position:relative;
}
.locp-media img{
  display:block; width:100%; height:100%; object-fit:cover;
  aspect-ratio: 21 / 9;
}
@media (max-width:700px){ .locp-media img{ aspect-ratio: 4 / 3; } }

/* --------------------------------------------------------------------------
   7. Ground / long-form editorial
   Not a single column of stacked <p>. Three subjects, each given its own
   composition: an opening spread, an offset image + text row, and a closing
   full-width band. Same words, arranged as an article rather than a stack.
   -------------------------------------------------------------------------- */
.locp-ground{ display:block; }

/* shared prose treatment */
.locp-ground p{
  font-size:1.045rem;
  line-height:1.8;            /* generous leading: dense research prose */
  color:var(--text);
  text-wrap: pretty;
  margin:0;
}
.locp-ground p + p{ margin-top:1.35rem; }

/* ---- chapter 1: heading + lead paragraph beside a tall image ---- */
.locp-ground__open{
  display:grid; gap:clamp(1.8rem, 4.5vw, 3.2rem); align-items:center;
}
@media (min-width: 981px){
  .locp-ground__open{ grid-template-columns: 1.05fr 1fr; }
}
.locp-ground__open img{
  display:block; width:100%; border-radius:var(--radius-lg);
  box-shadow:var(--shadow); aspect-ratio: 5/4; object-fit:cover;
}
.locp-ground__open .locp-head{ margin-bottom:1.4rem; }
.locp-ground__open p{
  font-size:1.1rem; line-height:1.74; color:var(--ink);
}

/* ---- chapter 2: two prose columns ----
   The two blocks are unequal by nature (123 words vs 71). Stretching both
   to equal height would leave the short one half empty, so instead the
   columns are weighted to the copy: the longer block gets more width, and
   align-items:stretch makes the cards end on the same baseline. The result
   is two cards of matching height with neither one padded out with dead
   space. */
.locp-ground__cols{
  margin-top: clamp(2.4rem, 5.5vw, 3.6rem);
  display:grid; gap:clamp(1.4rem, 3.5vw, 2.6rem);
  align-items:stretch;
}
@media (min-width: 861px){
  /* Columns are weighted to the copy so both blocks land on a similar number
     of rendered lines and the cards fill to nearly the same height on their
     own. The builder sets --col-ratio from the actual character counts;
     1.4 is the Wendell value and the fallback. */
  .locp-ground__cols{ grid-template-columns: calc(var(--col-ratio, 1.4) * 1fr) 1fr; }
}

/* single mid-block variant: one card, full width */
.locp-ground__single{
  margin-top: clamp(2.4rem, 5.5vw, 3.6rem);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding: clamp(1.5rem, 3vw, 2rem);
  box-shadow: var(--shadow-sm);
}
.locp-ground__single p{ font-size:1.005rem; line-height:1.78; color:var(--muted); }
.locp-ground__col{
  display:flex; flex-direction:column;
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  padding: clamp(1.5rem, 3vw, 2rem);
  box-shadow: var(--shadow-sm);
}
/* Centre the shorter block's text within its card so the extra room reads
   as deliberate breathing space rather than a gap at the bottom. */
.locp-ground__col p{ margin-block:auto; }
.locp-ground__col p{ font-size:1.005rem; line-height:1.78; color:var(--muted); }
.locp-ground__col p strong{ color:var(--ink); }

/* small gold tick marking each column's topic, no text */
.locp-ground__tick{
  width:30px; height:3px; border-radius:3px; margin-bottom:1.1rem;
  background:linear-gradient(to right, var(--green), var(--locp-gold));
  flex:none;          /* stays pinned to the top of the card */
}

/* ---- chapter 3: closing band on sand with a side image ---- */
.locp-ground__close{
  margin-top: clamp(2.4rem, 5.5vw, 3.6rem);
  display:grid; gap:clamp(1.6rem, 4vw, 3rem); align-items:center;
  background: linear-gradient(135deg, hsla(143,17%,29%,.055), hsla(38,46%,62%,.05));
  border:1px solid var(--line);
  border-radius: var(--radius-lg);
  padding: clamp(1.6rem, 3.5vw, 2.4rem);
}
@media (min-width: 861px){
  .locp-ground__close{ grid-template-columns: 1fr 1.25fr; }
}
.locp-ground__close img{
  display:block; width:100%; border-radius:var(--radius);
  box-shadow:var(--shadow-sm); aspect-ratio: 4/3; object-fit:cover;
}
.locp-ground__close p{ font-size:1.02rem; line-height:1.78; }

/* pull-fact: a designed aside between prose blocks */
.locp-fact{
  margin: 1.9rem 0;
  padding: 1.3rem 1.5rem;
  background: linear-gradient(135deg, hsla(143,17%,29%,.055), hsla(38,46%,62%,.05));
  border-left: 3px solid var(--locp-gold);
  border-radius: 0 var(--radius) var(--radius) 0;
  display:flex; gap:1rem; align-items:flex-start;
}
.locp-fact svg{ width:22px; height:22px; color:var(--green); flex:none; margin-top:.15rem; }
.locp-fact p{ margin:0; font-size:.97rem; line-height:1.6; color:var(--text); }
.locp-fact strong{ font-family:var(--font-head); font-weight:700; color:var(--ink); }

/* --------------------------------------------------------------------------
   8. Assurance list  (dark, iconified)
   -------------------------------------------------------------------------- */
/* optional lead paragraph above the assurance list (present on some towns) */
.locp-assure__lead{
  max-width:64ch; margin:0 0 clamp(1.6rem, 3vw, 2.2rem);
  font-size:var(--fs-lead); line-height:1.7;
  color:hsla(0,0%,100%,.82);
}

.locp-assure{
  display:grid; gap:1rem;
  grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr));
  list-style:none; margin:0; padding:0;
}
.locp-assure li{
  display:flex; gap:.95rem; align-items:flex-start;
  padding:1.15rem 1.25rem;
  background: hsla(0,0%,100%,.038);
  border:1px solid hsla(0,0%,100%,.085);
  border-radius: var(--radius);
  color: hsla(0,0%,100%,.84);
  font-size:.97rem; line-height:1.6;
  transition: background .4s var(--locp-ease), border-color .4s var(--locp-ease);
}
.locp-assure li:hover{
  background: hsla(0,0%,100%,.06);
  border-color: hsla(38,46%,62%,.34);
}
.locp-assure__tick{
  flex:none; width:26px; height:26px; border-radius:50%;
  display:grid; place-items:center; margin-top:.05rem;
  background: hsla(38,46%,62%,.16);
  border:1px solid hsla(38,46%,62%,.4);
  color: var(--locp-gold);
}
.locp-assure__tick svg{ width:14px; height:14px; }
@media (prefers-reduced-motion: reduce){ .locp-assure li{ transition:none; } }

/* --------------------------------------------------------------------------
   8b. Client reviews  (present on some towns)
   -------------------------------------------------------------------------- */
.locp-reviews{
  display:grid; gap:1.15rem;
  grid-template-columns: repeat(auto-fit, minmax(17rem, 1fr));
}
.locp-review{
  display:flex; flex-direction:column;
  margin:0; padding: clamp(1.4rem, 3vw, 1.9rem);
  background:var(--white);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-sm);
  position:relative;
  transition: transform .45s var(--locp-ease), box-shadow .45s var(--locp-ease);
}
.locp-review:hover{ transform:translateY(-4px); box-shadow:var(--shadow); }
.locp-review__stars{
  color:var(--locp-gold); font-size:1.02rem; letter-spacing:.14em;
  margin-bottom:.85rem; line-height:1;
}
.locp-review__text{
  margin:0; font-size:.975rem; line-height:1.74; color:var(--text);
  flex:1;
}
.locp-review__who{
  margin-top:1.1rem; padding-top:.9rem;
  border-top:1px solid var(--line);
  font-family:var(--font-head); font-weight:700; font-size:.9rem;
  color:var(--green);
}
@media (prefers-reduced-motion: reduce){
  .locp-review{ transition:none; }
  .locp-review:hover{ transform:none; }
}

/* --------------------------------------------------------------------------
   8c. Paired media + prose block  (optional second long-form section)
   -------------------------------------------------------------------------- */
.locp-pair{ display:grid; gap:clamp(1.8rem, 4.5vw, 3.2rem); align-items:center; }
@media (min-width: 901px){
  .locp-pair{ grid-template-columns: 1fr 1.1fr; }
  /* alternate sides when several of these blocks stack */
  .locp-pair--flip{ grid-template-columns: 1.1fr 1fr; }
  .locp-pair--flip .locp-pair__media{ order:2; }
}
.locp-pair__media img{
  display:block; width:100%; border-radius:var(--radius-lg);
  box-shadow:var(--shadow); aspect-ratio:4/3; object-fit:cover;
}
.locp-pair__text h2{ margin-top:0; }
.locp-pair__text p{
  font-size:1.03rem; line-height:1.78; color:var(--text); margin:0;
  max-width:62ch;
}
.locp-pair__text p + p{ margin-top:1.2rem; }

/* --------------------------------------------------------------------------
   9. Process steps  (connected timeline)
   -------------------------------------------------------------------------- */
.locp-steps{
  display:grid; gap:1.4rem;
  grid-template-columns: repeat(auto-fit, minmax(16rem, 1fr));
  position:relative;
}
.locp-step{ position:relative; padding-top:.4rem; }
.locp-step__n{
  width:52px; height:52px; border-radius:50%;
  display:grid; place-items:center; margin-bottom:1.05rem;
  font-family:var(--font-head); font-weight:800; font-size:1.18rem;
  color:var(--green); background:var(--white);
  border:2px solid var(--locp-ring);
  box-shadow: 0 0 0 6px hsla(143,17%,29%,.045);
  position:relative; z-index:1;
}
/* connector line between steps on wide screens */
@media (min-width: 900px){
  .locp-step:not(:last-child)::after{
    content:""; position:absolute; top:calc(.4rem + 26px); left:60px; right:-1.4rem;
    height:2px; background:linear-gradient(to right, var(--locp-ring), hsla(143,17%,29%,.05));
  }
}
.locp-step h3{ font-size:1.12rem; margin:0 0 .45rem; }
.locp-step p{ margin:0; color:var(--muted); font-size:.97rem; line-height:1.65; }

/* --------------------------------------------------------------------------
   10. Areas + map
   -------------------------------------------------------------------------- */
.locp-areas{ display:grid; gap:clamp(1.8rem,4vw,3rem); align-items:center; }
@media (min-width: 900px){ .locp-areas{ grid-template-columns: 1fr 1.15fr; } }
/* optional intro paragraphs above the areas list (present on some towns) */
.locp-areas__intro{
  max-width:60ch; margin:1.25rem 0 0;
  font-size:1.005rem; line-height:1.75; color:var(--muted);
}
.locp-areas__intro + .locp-areas__intro{ margin-top:.9rem; }

.locp-areas__list{
  list-style:none; margin:1.6rem 0 0; padding:0;
  display:flex; flex-wrap:wrap; gap:.6rem;
}
.locp-areas__list a{
  display:inline-block; padding:.58rem 1.05rem;
  background:var(--white); border:1px solid var(--line);
  border-radius: var(--radius-pill);
  font-size:.93rem; color:var(--text); text-decoration:none;
  transition: border-color .3s var(--locp-ease), color .3s var(--locp-ease), transform .3s var(--locp-ease);
}
.locp-areas__list a:hover{
  border-color:var(--green); color:var(--green); transform:translateY(-2px);
}
@media (prefers-reduced-motion: reduce){ .locp-areas__list a:hover{ transform:none; } }
.locp-areas__map{
  border-radius:var(--radius-lg); overflow:hidden;
  box-shadow:var(--shadow); border:1px solid var(--line);
  line-height:0;
}
.locp-areas__map iframe{ width:100%; height:clamp(20rem,42vw,26rem); border:0; display:block; }

/* --------------------------------------------------------------------------
   11. FAQ  (animated accordion)
   -------------------------------------------------------------------------- */
/* optional lead paragraph under the FAQ heading (present on some towns) */
.locp-faq__lead{
  max-width:62ch; margin:-.6rem auto clamp(1.8rem, 3.5vw, 2.4rem);
  text-align:center; font-size:var(--fs-lead); line-height:1.7;
  color:var(--muted);
}

.locp-faq{ display:grid; gap:.85rem; }
.locp-faq details{
  background:var(--white); border:1px solid var(--line);
  border-radius:var(--radius); overflow:hidden;
  transition: border-color .35s var(--locp-ease), box-shadow .35s var(--locp-ease);
}
.locp-faq details[open]{ border-color:var(--locp-ring); box-shadow:var(--shadow-sm); }
.locp-faq summary{
  list-style:none; cursor:pointer;
  padding:1.2rem 3.2rem 1.2rem 1.4rem;
  font-family:var(--font-head); font-weight:700; font-size:1.02rem;
  color:var(--ink); position:relative; line-height:1.45;
}
.locp-faq summary::-webkit-details-marker{ display:none; }
.locp-faq summary::after{
  content:""; position:absolute; right:1.4rem; top:1.42rem;
  width:11px; height:11px;
  border-right:2px solid var(--green); border-bottom:2px solid var(--green);
  transform: rotate(45deg); transform-origin:center;
  transition: transform .35s var(--locp-ease);
}
.locp-faq details[open] summary::after{ transform: rotate(-135deg); }
.locp-faq summary:hover{ color:var(--green); }
.locp-faq__a{
  padding:0 1.4rem 1.35rem;
  color:var(--muted); font-size:.98rem; line-height:1.72;
}
.locp-faq__a p{ margin:0; }
.locp-faq details[open] .locp-faq__a{ animation: locpFaqIn .4s var(--locp-ease); }
@keyframes locpFaqIn{
  from{ opacity:0; transform:translateY(-6px); }
  to{ opacity:1; transform:none; }
}
@media (prefers-reduced-motion: reduce){
  .locp-faq summary::after{ transition:none; }
  .locp-faq details[open] .locp-faq__a{ animation:none; }
}

/* --------------------------------------------------------------------------
   12. Closing CTA
   -------------------------------------------------------------------------- */
.locp-cta{ position:relative; isolation:isolate; overflow:hidden; }
.locp-cta::before{
  content:""; position:absolute; z-index:-1;
  width:44rem; height:44rem; border-radius:50%;
  top:-18rem; right:-14rem;
  background: radial-gradient(circle, hsla(38,46%,62%,.10) 0%, hsla(38,46%,62%,0) 68%);
  pointer-events:none;
}
.locp-cta .contact-line a{ color:hsla(0,0%,100%,.9); }
.locp-cta .contact-line a:hover{ color:var(--locp-gold); }

/* --------------------------------------------------------------------------
   13. Section rhythm helpers
   -------------------------------------------------------------------------- */
.locp-sec{ padding-block: clamp(3.6rem, 8vw, 6rem); }
.locp-sec--tight{ padding-block: clamp(2.6rem, 5.5vw, 3.8rem); }
.locp-head{ margin-bottom: clamp(2rem, 4vw, 2.9rem); }
.locp-head .eyebrow{ color:var(--green); letter-spacing:.14em; }
.locp-head h2{ margin:.5rem 0 0; letter-spacing:-.015em; text-wrap:balance; }
.locp-head--center{ text-align:center; }
.locp-head--center h2{ margin-inline:auto; max-width:22ch; }
.locp-head__rule{
  width:54px; height:3px; border-radius:3px; margin-top:1.05rem;
  background: linear-gradient(to right, var(--green), var(--locp-gold));
}
.locp-head--center .locp-head__rule{ margin-inline:auto; }
.locp-sec--dark .locp-head .eyebrow{ color:var(--locp-gold); }
.locp-sec--dark .locp-head h2{ color:#fff; }