/* ============================================================
   Go Capitals — CMS glue
   Small helpers the static template didn't need but the CMS does
   (dynamic form notices, rich-text spacing). Built on core.css tokens.
   ============================================================ */

.form-note{ border-radius:var(--radius-sm); padding:14px 18px; margin-block-end:18px; font-weight:600; font-size:.95rem; }
.form-note--success{ background:#e9f6ec; color:#1c7a3a; border:1px solid #b9e2c4; }
.form-note--error{ background:#fbeaec; color:var(--red); border:1px solid #f0c2c8; }

/* rich text coming from the admin editor */
.prose{ color:var(--brown-soft); }
.prose > * + *{ margin-block-start:1rem; }
.prose h2{ font-size:1.5rem; margin-block:28px 14px; color:var(--ink); }
.prose h3{ font-size:1.2rem; margin-block:22px 12px; color:var(--ink); }
.prose p{ margin-block-end:16px; }
.prose ul,.prose ol{ margin-inline-start:1.4em; margin-block-end:16px; display:grid; gap:8px; }
.prose ul{ list-style:disc; }
.prose ol{ list-style:decimal; }
.prose img{ border-radius:var(--radius); margin-block:24px; width:100%; }
.prose blockquote{ border-inline-start:4px solid var(--gold); background:var(--cream-2); padding:20px 24px; border-radius:0 var(--radius) var(--radius) 0; margin-block:22px; color:var(--ink); font-style:italic; }
.prose a{ color:var(--gold-dark); font-weight:600; }
.prose a:hover{ text-decoration:underline; }

/* ---------- Pricing (grid3 / packages) ---------- */
.price-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:26px; align-items:stretch; }
.price-card{ position:relative; background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:36px 30px; box-shadow:var(--shadow-sm); display:flex; flex-direction:column; text-align:center; transition:transform .4s var(--ease), box-shadow .4s var(--ease); }
.price-card:hover{ transform:translateY(-8px); box-shadow:var(--shadow); }
.price-card.is-featured{ border-color:var(--gold); box-shadow:var(--shadow); transform:scale(1.03); }
.price-card.is-featured:hover{ transform:scale(1.03) translateY(-6px); }
.price-badge{ position:absolute; inset-block-start:-13px; inset-inline-start:50%; transform:translateX(-50%); background:var(--gold); color:#fff; font-size:.76rem; font-weight:700; padding:.4em 1.2em; border-radius:var(--radius-pill); white-space:nowrap; box-shadow:var(--shadow-sm); }
.price-name{ font-size:1.15rem; color:var(--gold-dark); margin-block-end:12px; }
.price-value{ font-size:clamp(1.8rem,4vw,2.6rem); font-weight:800; color:var(--ink); line-height:1.1; margin-block-end:20px; }
.price-features{ text-align:start; color:var(--brown-soft); margin-block-end:26px; flex:1; }
.price-features ul{ display:grid; gap:12px; }
.price-features li{ position:relative; padding-inline-start:30px; font-size:.94rem; }
.price-features li::before{ content:""; position:absolute; inset-inline-start:0; inset-block-start:2px; width:20px; height:20px; border-radius:50%; background:var(--gold-tint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%239A5E2A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E") center/13px no-repeat; }
.price-card .btn{ align-self:center; }

/* Home services cards: always show the short text (not hover-only) + clamp */
.services-grid .service-card p{
  max-height:none; opacity:1; margin-block-start:6px;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden;
}

/* Hero on mobile: copy is inside each (absolute) slide, so let the active slide
   define the height (prevents the hero collapsing and the marquee jumping up). */
@media (max-width:900px){
  .hero{ min-height:auto !important; }
  .hero-slides{ position:relative !important; }
  .hero-slide{ position:absolute; }
  .hero-slide.is-active{ position:relative; }
  /* mobile nav drawer: use an explicit height so the scrolled header's
     backdrop-filter (which becomes the containing block) can't shrink it */
  .nav{ inset-block-start:0; inset-block-end:auto; height:100vh; height:100dvh; }
  /* "Menu" label under the hamburger */
  .nav-toggle{ height:auto; row-gap:8px; }
  .nav-label{ display:block; font-size:.6rem; font-weight:700; line-height:1; color:var(--brown); }
  .site-header:not(.scrolled) .nav-label{ color:#fff; }
}

/* footer bottom: copyright + payment icons */
.site-footer .footer-bottom{ display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; }
.pay-methods{ display:inline-flex; align-items:center; gap:8px; }
.pay-chip{ width:42px; height:26px; border-radius:5px; background:#fff; box-shadow:var(--shadow-sm); border:1px solid var(--line); display:inline-grid; place-items:center; overflow:hidden; }
.pay-chip svg{ width:100%; height:100%; display:block; }
@media (max-width:680px){ .site-footer .footer-bottom{ justify-content:center; text-align:center; } }

/* footer brand text (editor-driven) */
.footer-brand-text{ color:var(--muted); font-size:.95rem; margin-block-end:22px; }
.footer-brand-text p{ margin-block-end:.6rem; }
.footer-brand-text :last-child{ margin-block-end:0; }
@media (max-width:900px){ .price-grid{ grid-template-columns:1fr; max-width:440px; margin-inline:auto; } .price-card.is-featured{ transform:none; } }