/* ═══════════════════════════════════════════════════════
   ARISE POOLS: GOLDEN HOUR SERVICE PAGES
   Loads after arise-v2.css on every page under /services.
   Editorial intro + at-a-glance card, numbered feature grid,
   Arizona conditions band, featured project row, FAQ, serving.
   ═══════════════════════════════════════════════════════ */

/* ── Hero additions ── */
.page-hero .eyebrow-text { color: var(--gold-light); }
.page-hero .gh-crumbs { margin-bottom: 18px; }
.gh-hero-ctas { display: flex; flex-wrap: wrap; align-items: center; gap: 16px 28px; margin-top: 32px; }
.gh-hero-tel { color: var(--cream); text-decoration: none; font-size: .74rem; font-weight: 500; letter-spacing: .22em; text-transform: uppercase; border-bottom: 1px solid rgba(229,203,154,.55); padding-bottom: 5px; transition: color .3s, border-color .3s; }
.gh-hero-tel:hover { color: var(--gold-light); border-color: var(--gold-light); }

/* ── Left-aligned section heading variant ── */
.gh-left .section-heading, .section-heading.gh-left { text-align: left; }
.gh-left .eyebrow, .section-heading.gh-left .eyebrow { justify-content: flex-start; }
.gh-left .eyebrow-line:last-child, .section-heading.gh-left .eyebrow-line:last-child { display: none; }
.gh-left .gold-rule, .section-heading.gh-left .gold-rule { margin-left: 0; }
.gh-left .section-heading .subtitle, .section-heading.gh-left .subtitle { margin-left: 0; }

/* ── Intro: editorial copy + at-a-glance card ── */
.gh-intro { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, .8fr); gap: clamp(40px, 6vw, 96px); align-items: start; }
.gh-intro .section-heading { margin-bottom: 30px; }
.gh-intro .section-heading h2 { font-size: clamp(2.1rem, 3.8vw, 3.3rem); }
.gh-lede { font-family: 'Cormorant Garamond', serif; font-weight: 300; font-size: clamp(1.4rem, 2.2vw, 1.85rem); line-height: 1.38; color: var(--stone); margin-bottom: 28px; }
.gh-prose p { color: rgba(26,24,20,.74); line-height: 1.85; margin-bottom: 20px; }
.gh-prose p:last-child { margin-bottom: 0; }
.gh-prose a, .gh-faq-a a, .gh-serving-copy a { color: var(--pool-blue); text-decoration: underline; text-decoration-color: rgba(28,115,138,.35); text-underline-offset: 3px; transition: text-decoration-color .3s; }
.gh-prose a:hover, .gh-faq-a a:hover, .gh-serving-copy a:hover { text-decoration-color: var(--pool-blue); }
.gh-glance { position: sticky; top: 96px; background: #fff; padding: 34px 32px 32px; border-top: 2px solid var(--gold); border-radius: 0 0 3px 3px; box-shadow: 0 1px 0 rgba(26,24,20,.05), 0 30px 60px -40px rgba(26,24,20,.45); }
.gh-glance-title { font-family: 'Jost', sans-serif; font-weight: 500; font-size: .68rem; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 10px; }
.gh-glance ul { list-style: none; padding: 0; margin: 0; }
.gh-glance li { display: flex; gap: 14px; padding: 14px 0; border-bottom: 1px solid rgba(201,164,100,.24); font-family: 'Cormorant Garamond', serif; font-size: 1.2rem; line-height: 1.3; color: var(--stone); }
.gh-glance li:last-child { border-bottom: 0; }
.gh-glance li::before { content: ""; flex: none; width: 6px; height: 6px; margin-top: .5em; background: var(--gold); transform: rotate(45deg); }
.gh-glance-note { margin-top: 18px; font-size: .86rem; line-height: 1.65; color: rgba(26,24,20,.6); }
.gh-glance-note a { color: var(--gold-dark); }

/* ── Feature grid: numbered editorial columns ── */
.gh-feats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 48px clamp(28px, 4vw, 56px); }
.gh-feat { border-top: 1px solid rgba(139,105,20,.32); padding-top: 26px; }
.gh-feat-num { font-family: 'Cormorant Garamond', serif; font-size: 2.7rem; line-height: 1; color: transparent; -webkit-text-stroke: 1px var(--gold-dark); }
.gh-feat h3 { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 1.6rem; line-height: 1.15; color: var(--stone); margin: 14px 0 10px; }
.gh-feat p { font-size: .98rem; line-height: 1.75; color: rgba(26,24,20,.7); }
.gh-feats + .services-grid, .services-grid + .gh-feats { margin-top: 64px; }
.gh-cards-head { margin: 72px 0 28px; }
.gh-cards-head:first-child { margin-top: 0; }
.service-card .gh-card-go { display: inline-block; font-size: .66rem; font-weight: 500; letter-spacing: .24em; text-transform: uppercase; color: var(--gold-dark); }
.service-card .gh-card-go::after { content: " \2192"; transition: margin .35s var(--ease); }
.service-card:hover .gh-card-go::after { margin-left: 4px; }
.service-card p { margin-bottom: 18px; }
.gh-cta-line { max-width: 40rem; margin: 0 auto 22px; text-align: center; font-family: 'Cormorant Garamond', serif; font-size: clamp(1.3rem, 2vw, 1.6rem); line-height: 1.4; color: var(--stone); }
.gh-more .gh-or { display: block; margin-top: 16px; font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; color: rgba(26,24,20,.55); }
.gh-more .gh-or a { color: var(--gold-dark); }

/* ── Arizona conditions band (on .gh-dark) ── */
.gh-az-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 40px clamp(28px, 3.5vw, 48px); }
.gh-az-item { border-top: 1px solid rgba(229,203,154,.28); padding-top: 26px; }
.gh-az-label { font-size: .64rem; font-weight: 500; letter-spacing: .28em; text-transform: uppercase; color: var(--gold-light); }
.gh-az-item h3 { font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: 1.6rem; line-height: 1.15; color: var(--cream); margin: 12px 0 12px; }
.gh-az-item p { font-size: .97rem; line-height: 1.75; color: rgba(247,241,232,.74); }
.gh-dark .section-heading .subtitle { color: rgba(247,241,232,.7); }

/* ── Featured project row ── */
.gh-feature-work .gh-ch-text h3 { margin-top: 0; }
.gh-feature-work .gh-ch-eyebrow { font-size: .66rem; font-weight: 500; letter-spacing: .26em; text-transform: uppercase; color: var(--gold-dark); margin-bottom: 14px; }

/* ── Process: service-specific timeline ── */
.gh-steps { margin-top: 12px; }
.gh-steps .process-step { text-align: left; padding: 64px 14px 0 0 !important; border-left: 0; border-right: 0; border-bottom: 0; }
.gh-steps .process-step p { font-size: .94rem; line-height: 1.7; color: rgba(26,24,20,.66); }
@media (min-width: 1000px) { .gh-steps { grid-template-columns: repeat(var(--n, 4), minmax(0, 1fr)); gap: 32px; } }

/* ── FAQ ── */
.gh-faq { max-width: 880px; margin: 0 auto; border-top: 1px solid rgba(139,105,20,.3); }
.gh-faq details { border-bottom: 1px solid rgba(139,105,20,.3); }
.gh-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: flex-start; gap: 28px; padding: 26px 4px; font-family: 'Cormorant Garamond', serif; font-weight: 400; font-size: clamp(1.25rem, 2vw, 1.55rem); line-height: 1.3; color: var(--stone); transition: color .3s; }
.gh-faq summary::-webkit-details-marker { display: none; }
.gh-faq summary::after { content: ""; flex: none; width: 15px; height: 15px; margin-top: .45em; background: linear-gradient(var(--gold-dark), var(--gold-dark)) center / 100% 1px no-repeat, linear-gradient(var(--gold-dark), var(--gold-dark)) center / 1px 100% no-repeat; transition: transform .45s var(--ease); }
.gh-faq details[open] summary::after { transform: rotate(45deg); }
.gh-faq summary:hover { color: var(--pool-blue); }
.gh-faq summary:focus-visible { outline: 2px solid var(--gold); outline-offset: 4px; }
.gh-faq-a { padding: 0 48px 28px 4px; color: rgba(26,24,20,.74); line-height: 1.85; }

/* ── Serving + related ── */
.gh-serving-copy { max-width: 44rem; margin: -16px auto 36px; text-align: center; color: rgba(26,24,20,.7); line-height: 1.8; }
.gh-serving .city-grid { max-width: 1040px; margin: 0 auto; }
.gh-related-head { margin-top: clamp(80px, 9vw, 120px); }

@media (max-width: 960px) {
  .gh-intro { grid-template-columns: 1fr; }
  .gh-glance { position: static; }
  .gh-feats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 640px) {
  .gh-feats { grid-template-columns: 1fr; gap: 36px; }
  .gh-faq-a { padding-right: 4px; }
  .gh-hero-ctas { gap: 18px 22px; }
  .gh-glance { padding: 28px 22px 24px; }
}
.gh-dark .gh-az-item a { color: var(--gold-light); text-decoration: underline; text-decoration-color: rgba(229,203,154,.4); text-underline-offset: 3px; }
.gh-dark .gh-az-item a:hover { text-decoration-color: var(--gold-light); }