/* location.html centerpiece styles (skeleton: hero / reviews / venues /
   what-we-offer / areas-served / local-faq / form). Shared framework lives
   in css/patterns.css (arp-). NOTE: style.css's `.sec p{margin:0}` outranks a
   single class, so every rule that margins a <p> here is prefixed `.sec`. */

/* --- hero: centered headline over a staggered arch trio --------------------- */
.loc-hero{padding-top:130px;}
.sec .loc-hero-head .arp-lede{max-width:640px;margin:26px auto 0;}
.loc-hero .arp-actions{justify-content:center;margin-top:36px;}
.loc-hero .arp-orn{margin-top:38px;}

/* load choreography: kicker, headline, lede, actions, ornament rise in turn */
.loc-rise{opacity:0;animation:loc-rise .9s ease forwards;}
.loc-hero-head .loc-rise:nth-child(1){animation-delay:.05s;}
.loc-hero-head .loc-rise:nth-child(2){animation-delay:.16s;}
.loc-hero-head .loc-rise:nth-child(3){animation-delay:.3s;}
.loc-hero-head .loc-rise:nth-child(4){animation-delay:.44s;}
.loc-hero-head .loc-rise:nth-child(5){animation-delay:.56s;}
@keyframes loc-rise{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:none;}}

.loc-band{display:grid;grid-template-columns:repeat(3,1fr);gap:44px;margin-top:84px;align-items:end;}
.loc-shot{margin:0;text-align:center;}
.loc-shot .arp-arch{height:440px;border-radius:0;}
.loc-shot .arp-arch img,
.loc-shot .arp-arch video {animation:loc-drift 2.6s ease .2s both;}
@keyframes loc-drift{from{transform:scale(1.08);}to{transform:scale(1);}}
.loc-shot figcaption{margin-top:20px;font-family:var(--f-label);font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);}
.loc-shot figcaption::before{content:"";display:block;width:26px;height:1px;background:var(--line);margin:0 auto 14px;}
.loc-shot figcaption b{font-weight:400;display:block;}
.loc-shot figcaption span{display:block;margin-top:6px;font-size:10px;color:rgba(30,29,26,.5);}
.loc-band .loc-shot:nth-child(2){transition-delay:.12s;}
.loc-band .loc-shot:nth-child(3){transition-delay:.24s;}

/* --- reviews: staggered cards with a ghost quote glyph ---------------------- */
#reviews .arp-review{position:relative;overflow:hidden;}
#reviews .arp-review::before{content:"\201C";position:absolute;top:-14px;right:18px;font-family:var(--f-title);font-size:130px;line-height:1;color:#efede8;}
#reviews .arp-review:nth-child(2){margin-top:36px;transition-delay:.12s;}
#reviews .arp-review:nth-child(3){transition-delay:.24s;}

/* --- the venue guide (the page's one dark band) ----------------------------- */
#venues .arp-kicker{color:rgba(255,255,255,.58);}
#venues .arp-h2{color:var(--cream);}
#venues .arp-lede{color:rgba(255,255,255,.72);}
.vg-grid{display:grid;grid-template-columns:440px 1fr;gap:64px;margin-top:60px;align-items:start;}
.vg-list{display:flex;flex-direction:column;border-top:1px solid rgba(255,255,255,.22);counter-reset:vg;}
.vg-item{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:24px 18px;border:0;border-bottom:1px solid rgba(255,255,255,.22);background:none;cursor:pointer;text-align:left;transition:background .4s;}
.vg-item::before{counter-increment:vg;content:counter(vg,decimal-leading-zero);font-family:var(--f-label);font-size:10px;letter-spacing:.2em;color:rgba(255,255,255,.38);}
.vg-item > span:first-child{flex:1;}
.vg-item:hover,.vg-item.on{background:rgba(255,255,255,.07);}
.vg-name{display:block;font-family:var(--f-title);font-size:24px;line-height:1.2;color:var(--cream);}
.vg-sub{display:block;margin-top:6px;font-family:var(--f-label);font-size:10px;letter-spacing:.2em;text-transform:uppercase;color:rgba(255,255,255,.5);}
.vg-arrow{font-family:var(--f-title);font-size:22px;color:rgba(255,255,255,.35);transition:transform .4s,color .4s;}
.vg-item.on .vg-arrow{color:var(--cream);transform:translateX(6px);}
.vg-media{position:relative;height:440px;overflow:hidden;background:rgba(255,255,255,.08);}
.vg-media img,
.vg-media video {position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .9s ease;}
.vg-media img.on,
.vg-media video.on {opacity:1;animation:vg-ken 14s ease forwards;}
@keyframes vg-ken{from{transform:scale(1);}to{transform:scale(1.07);}}
.vg-count{position:absolute;top:16px;right:16px;background:rgba(30,29,26,.55);color:var(--cream);font-family:var(--f-label);font-size:10px;letter-spacing:.24em;padding:8px 12px;}
.vg-count b{font-weight:400;color:#fff;}
.vg-card{position:relative;background:var(--white);border:1px solid var(--line);padding:30px 34px 34px;margin:-72px 44px 0;}
.sec .vg-label{font-family:var(--f-label);font-size:10px;letter-spacing:.26em;text-transform:uppercase;color:rgba(30,29,26,.55);}
.vg-note{display:none;}
.sec .vg-note.on{display:block;margin:14px 0 0;font-size:14.5px;line-height:1.75;letter-spacing:.03em;color:rgba(30,29,26,.8);}
.vg-card .btn{margin-top:24px;}

/* --- what we offer: masonry stagger + card lift ----------------------------- */
#what-we-offer .arp-card:nth-child(2){margin-top:48px;transition-delay:.12s;}
#what-we-offer .arp-card:nth-child(3){transition-delay:.24s;}
#what-we-offer .arp-card-img,
#what-we-offer .arp-card-video {transition:transform .6s ease;}
#what-we-offer .arp-card:hover .arp-card-img,
#what-we-offer .arp-card:hover .arp-card-video {transform:translateY(-6px);}

/* --- areas served: hairline-framed zone band -------------------------------- */
#areas-served .arp-numrow{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:52px 0 48px;}
.sec .loc-zones-note{max-width:640px;margin:52px auto 0;text-align:center;}
.loc-chips{justify-content:center;margin-top:30px;}

@media (max-width:900px){
  .loc-hero{padding-top:100px;}
  .loc-band{grid-template-columns:1fr;gap:34px;margin-top:48px;}
  .loc-shot .arp-arch,.loc-shot:nth-child(2) .arp-arch{height:auto;aspect-ratio:3/4;}
  .loc-band .loc-shot:nth-child(2),.loc-band .loc-shot:nth-child(3){transition-delay:0s;}
  #reviews .arp-review:nth-child(2){margin-top:0;}
  #reviews .arp-review:nth-child(2),#reviews .arp-review:nth-child(3){transition-delay:0s;}
  .vg-grid{grid-template-columns:1fr;gap:34px;margin-top:40px;}
  .vg-media{height:auto;aspect-ratio:4/3;}
  .vg-card{margin:-40px 16px 0;padding:24px 22px 28px;}
  #what-we-offer .arp-card:nth-child(2){margin-top:0;}
  #what-we-offer .arp-card:nth-child(2),#what-we-offer .arp-card:nth-child(3){transition-delay:0s;}
  #areas-served .arp-numrow{padding:40px 0 36px;}
}

/* every animation this page adds sits behind the user's motion preference */
@media (prefers-reduced-motion: reduce){
  .loc-rise{animation:none;opacity:1;}
  .loc-shot .arp-arch img,
  .loc-shot .arp-arch video {animation:none;}
  .vg-media img,
  .vg-arrow,
  .vg-item,
  .vg-media video {transition:none;}
  .vg-media img.on,
  .vg-media video.on {animation:none;}
  #what-we-offer .arp-card-img,
  #what-we-offer .arp-card-video {transition:none;}
  .arp-track{animation:none;}
  .reveal{transition:none;opacity:1;transform:none;}
}
