/* group A pages: how it works, pricing, about, contact */

/* ---------- Shared: the loop band under a header ---------- */
.hero-band { padding: 0; }
.hero-video .hv-media { position: absolute; inset: 0; z-index: 0; background: var(--field-2); overflow: hidden; }
.hero-video .hv-media video { z-index: 1; filter: saturate(0.8) contrast(1.05) brightness(1.02); }
.hero-video .hv-media::before { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: #DCE8DF; mix-blend-mode: multiply; opacity: 0.14; }
.hero-video .hv-media::after { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: #A04219; mix-blend-mode: soft-light; opacity: 0.05; }
.hero-video .hv-media .bb-motif { position: absolute; left: 50%; top: 50%; width: min(64vw, 960px); height: auto; transform: translate(-50%, -50%); opacity: 0.6; z-index: 0; }
.hero-video .hv-media .bb-motif .bb-motif-tag { animation: motif-breathe 6s ease-in-out infinite; }
@keyframes motif-breathe { 0%, 100% { transform: scale(1); } 50% { transform: scale(1.05); } }
.hero-video.has-copy::after { content: ''; position: absolute; inset: 0; z-index: 2; pointer-events: none; background: linear-gradient(90deg, rgba(220,232,223,0.97) 0%, rgba(220,232,223,0.9) 34%, rgba(220,232,223,0.2) 62%, rgba(220,232,223,0) 80%); }
.hv-copy { position: absolute; z-index: 3; left: var(--gutter); top: 50%; transform: translateY(-50%); width: min(46vw, 900px); }
.hv-copy .lead { max-width: 58ch; margin: 0; }
.hero-video .hv-cap { position: absolute; right: var(--gutter); bottom: 14px; z-index: 3; margin: 0; font-size: 0.8125rem; }
@media (max-width: 1023px) {
  .hero-video.has-copy { aspect-ratio: auto; max-height: none; }
  .hero-video.has-copy .hv-media { position: relative; aspect-ratio: 16 / 9; }
  .hero-video.has-copy::after { display: none; }
  .hv-copy { position: static; transform: none; width: auto; padding: 36px var(--gutter) 28px; }
  .hero-video .hv-cap { position: static; padding: 8px var(--gutter) 10px; text-align: right; }
}
@media (prefers-reduced-motion: reduce) { .hero-video .hv-media .bb-motif .bb-motif-tag { animation: none; } }

/* ---------- Shared: scene bands ---------- */
.scene-band canvas { z-index: 0; }
.scene-band .scene-poster { object-fit: cover; z-index: 1; transition: opacity 0.5s var(--feed); }
.scene-band.is-live .scene-poster { opacity: 0; }
.scene-band .scene-cap { max-width: 64ch; margin: 0; padding-right: var(--gutter); }
.scene-band .scene-tag { position: absolute; right: var(--gutter); top: 18px; z-index: 2; display: inline-flex; align-items: center; gap: 8px; font-family: var(--rec); font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 500; font-size: 0.75rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--muted); }
.scene-band .scene-tag::before { content: ''; width: 14px; height: 18px; background: var(--copper); clip-path: polygon(0 0, 70% 0, 100% 30%, 100% 100%, 0 100%); }
@media (max-width: 767px) { .scene-band { height: min(60vh, 520px); } .scene-band .scene-tag { display: none; } }

/* ---------- Shared: the small Kept Line (price line on Pricing, opening line on About) ---------- */
.page-pricing .price-kept, .page-about .about-open { --mono: 1; --casl: 0; --wght: 600; font-family: var(--rec); font-variation-settings: 'MONO' var(--mono), 'CASL' var(--casl), 'wght' var(--wght), 'CRSV' 0.5, 'slnt' 0; }
.page-about .about-open { --wght: 500; font-size: clamp(1.375rem, 1rem + 1.4vw, 2.5rem); line-height: 1.2; }
.price-kept.is-kept, .about-open.is-kept { --mono: 0; --casl: 0.65; --wght: 720; }
.kl-tag { display: inline-block; width: 0.5em; height: 0.62em; margin-left: 0.28em; background: var(--copper); clip-path: polygon(0 100%, 0 30%, 30% 0, 100% 0, 100% 100%); transform: scaleY(0); transform-origin: bottom; transition: transform var(--base) var(--feed); }
.is-kept .kl-tag { transform: scaleY(1); }
@media (prefers-reduced-motion: reduce) { .page-pricing .price-kept, .page-about .about-open { --mono: 0; --casl: 0.65; --wght: 720; } .kl-tag { transform: scaleY(1); } }
html.qa-rm .price-kept, html.qa-rm .about-open { --mono: 0; --casl: 0.65; --wght: 720; }
html.qa-rm .kl-tag { transform: scaleY(1); }

/* ---------- Shared: figures roll (Pricing hover) ---------- */
.roll .dg { position: relative; display: inline-block; clip-path: inset(0); line-height: 1.02; vertical-align: baseline; }
.roll .dg .ph { visibility: hidden; }
.roll .dg .strip { position: absolute; left: 0; top: 0; display: block; transition: transform 0.7s var(--feed); }
.roll .dg .strip span { display: block; }
.roll:hover .dg .strip, .roll:focus-visible .dg .strip, .roll:active .dg .strip { transform: translateY(-90.9091%); }
@media (prefers-reduced-motion: reduce) { .roll .dg .strip { transition: none; } .roll:hover .dg .strip { transform: none; } }

/* ---------- HOW IT WORKS ---------- */
.page-how .step-copy { display: grid; gap: 28px; align-items: start; }
@media (min-width: 1800px) { .page-how .step-copy { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(28px, 3vw, 64px); } .page-how .step-side { padding-top: 12px; } }
.page-how .step-text .lead { max-width: 64ch; }
.page-how .step-side .facts-strip { margin-top: 0; }
.page-how .step-side .chips-row { margin-top: 0; }
.page-how .step-head { display: flex; align-items: flex-end; gap: 22px; margin: 0 0 0.3em; }
.page-how .step-head .numeral { font-size: clamp(3.5rem, 2rem + 4vw, 7.5rem); }
.page-how .step-head h2 { margin: 0 0 0.1em; }
.page-how .screen-name { margin: 0 0 1.2em; }
.page-how .shot-bank { display: grid; gap: 24px; align-items: start; justify-items: center; }
@media (min-width: 1800px) { .page-how .shot-bank.two { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); align-items: center; } }
.page-how .shot-slot { width: min(100%, 508px); position: relative; padding: 12px 44px 56px; }
@media (min-width: 1800px) { .page-how .shot-slot { width: min(100%, 608px); } }
@media (min-width: 2400px) { .page-how .shot-slot { width: min(100%, 688px); } }
.page-how .shot-slot::before { content: ''; position: absolute; left: 44px; right: 44px; top: 0; height: 4px; border-radius: 2px; background: var(--rule); }
.page-how .step-shot { width: 100%; }
.page-how .screen-cap { margin: 12px 0 0; font-size: 0.875rem; text-align: center; }
.page-how .facts-strip { width: 100%; max-width: 460px; margin-top: 24px; }
.page-how .chips-row { display: flex; gap: 8px; margin: 1.2em 0 10px; }
.page-how .elig { margin: 0; color: var(--ink); }
.page-how .how-photo { margin-top: 0; }
.page-how .year-band { width: calc(100% + 2 * var(--gutter)); margin: clamp(16px, 2vw, 32px) 0 0 calc(-1 * var(--gutter)); padding: 12px 0 0; }
.page-how .year-cap { max-width: 80ch; margin: 14px 0 0; font-size: 0.9375rem; }
.page-how .cta-band .btn-row { justify-content: flex-start; }
.page-how .cta-band h2 { margin-bottom: 0.3em; }
.page-how .cta-band .lead { margin: 0; max-width: 60ch; }

/* ---------- Wide banks (1800px and up): a bank subdivides so no third of the width sits empty ---------- */
@media (min-width: 1800px) {
  .page-pricing .hero-main, .page-contact .hero-main { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: clamp(28px, 3vw, 64px); align-items: start; }
  .page-pricing .hero-main { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); }
  .page-pricing .hero-main .renew-strip { margin-top: 8px; max-width: none; }
  .page-pricing .price-kept { font-size: 3rem; white-space: nowrap; }
  .page-contact .hero-main .contact-lines { margin-top: 8px; max-width: none; }
  .page-about .article .two-col { columns: 2; column-gap: clamp(32px, 3vw, 64px); }
  .page-about .article .two-col > p { break-inside: avoid; max-width: none; }
}

/* ---------- PRICING ---------- */
.plan .foot { padding: 0; background: none; }
.plan .foot::before, .plan .foot::after { display: none; }
.page-pricing .price-kept { margin-top: 0.5em; }
.page-pricing .hero-side { display: grid; gap: 22px; align-content: start; }
.page-pricing .renew-strip { padding-bottom: 30px; max-width: 560px; margin-top: 28px; }
.page-pricing .cancel-line { margin: 0; }
.page-pricing .proofs { margin-top: clamp(28px, 3vw, 52px); grid-template-columns: repeat(auto-fit, minmax(min(380px, 100%), 1fr)); align-items: start; gap: clamp(20px, 2.4vw, 44px); }
.page-pricing .proof { margin: 0; display: grid; gap: 14px; align-items: center; }
@media (min-width: 640px) { .page-pricing .proof { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); } .page-pricing .proof.is-phone { grid-template-columns: minmax(0, 300px) minmax(0, 1fr); } }
@media (min-width: 1800px) { .page-pricing .proof.is-phone { grid-template-columns: minmax(0, 360px) minmax(0, 1fr); } }
.page-pricing .proof figcaption { margin: 0; }
.page-pricing .proof-plus { display: grid; gap: 22px; align-content: start; }
.page-pricing .never-short li { display: grid; gap: 4px; }
.page-pricing .never-short strong { font-family: var(--rec); font-variation-settings: 'MONO' 0, 'CASL' 0.65, 'wght' 700; }
.page-pricing .price-photo { margin: 0; }
.page-pricing .faq { grid-template-columns: repeat(auto-fit, minmax(min(440px, 100%), 1fr)); gap: 14px; align-items: start; }
.page-pricing .faq details { padding: 16px 20px; }
.page-pricing .faq details p { max-width: 70ch; }
.page-pricing .cta-band .pull { margin: 0; }
.page-pricing .cta-band .btn-row { justify-content: flex-start; }

/* ---------- ABOUT ---------- */
.page-about .article p { max-width: 68ch; }
@media (min-width: 1280px) and (max-width: 1799px) { .page-about .article p { max-width: 78ch; } }
.page-about .rules-grid { display: grid; gap: 22px clamp(20px, 2.4vw, 44px); grid-template-columns: repeat(auto-fit, minmax(min(300px, 100%), 1fr)); margin-top: 8px; }
.page-about .rules-grid .rule { display: grid; grid-template-columns: auto 1fr; gap: 14px; align-items: start; }
.page-about .rules-grid .numeral { font-size: clamp(3.25rem, 1.5rem + 3.4vw, 6.5rem); line-height: 0.9; }
.page-about .rules-grid p { margin: 0.35em 0 0; max-width: none; }
.page-about .rules-close { margin: 26px 0 0; max-width: none; }
@media (min-width: 1800px) { .page-about .rules-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.page-about .article h2, .page-about .article h2:first-of-type { margin-top: 0; }
.page-about .side-shot { width: min(100%, 420px); margin: 0 auto; }
@media (min-width: 1800px) { .page-about .side-shot { width: min(100%, 520px); } }
.page-about .fade-shelf { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 18px; align-items: start; padding-top: 12px; max-width: 560px; }
.page-about .fade-shelf .receipt-slip { width: 100%; max-width: 170px; transform: rotate(var(--rot, 0deg)); }
.page-about .fade-shelf .receipt-slip:nth-child(1) { --rot: -2deg; }
.page-about .fade-shelf .receipt-slip:nth-child(3) { --rot: 1.5deg; }
.page-about .fade-shelf .receipt-slip.is-faded { color: rgba(78, 94, 86, 0.45); filter: blur(0.5px); }
.page-about .fade-shelf .receipt-slip.is-faded .m { color: rgba(78, 94, 86, 0.55); }
.page-about .shelf-cap { margin-top: 14px; font-size: 0.875rem; }
@media (min-width: 1024px) { .page-about .never-block.seal-left { grid-template-columns: minmax(0, 1fr) minmax(0, 2.4fr); } }
@media (max-width: 1023px) { .page-about .sticky-rail { position: static; } .page-about .never-block .seal-wrap { min-height: 0; justify-items: start; } }
.page-about .never-block .seal-wrap { min-height: 0; }
.page-about .never-block .seal-big { width: min(70%, 320px); }
.page-about .house-shot .leaders { left: -8%; }
.page-about .totals-line { margin-top: 12px; }
.page-about .addr-card { display: grid; gap: 6px; font-family: var(--rec); font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 500; font-size: var(--mono-size); }
.page-about .addr-card address { font-style: normal; }
.page-about .addr-card .h { font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 700; letter-spacing: 0.04em; text-transform: uppercase; font-size: 0.8125rem; color: var(--muted); margin: 0 0 4px; }
.page-about .addr-card p { margin: 0; }
.page-about .addr-card a { text-decoration: none; }
.page-about .addr-card .seal-sm { width: 96px; height: 96px; margin-top: 10px; }
.page-about .cta-band .btn-row { justify-content: flex-start; }
.page-about .cta-band .lead { max-width: 60ch; }
.page-about .about-photo { margin: 0; }

/* ---------- CONTACT ---------- */
.page-contact .contact-lines { padding: 18px 20px 26px; margin: 1.4em 0 18px; max-width: 600px; }
.page-contact .contact-lines li { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.page-contact .contact-lines address { font-style: normal; }
.page-contact .contact-lines a { text-decoration: none; display: inline-block; transform-origin: 8% 0; transition: transform var(--fast) var(--feed), color var(--fast) var(--feed); border-bottom: 1px dotted var(--copper); }
.page-contact .contact-lines a:hover, .page-contact .contact-lines a:focus-visible { transform: rotate(2deg); color: var(--copper); }
.page-contact .hours-line { font-size: 0.875rem; margin: 0; }
.page-contact .cta-band .btn-row { justify-content: flex-start; }
.page-contact .cta-band .lead { max-width: 60ch; margin: 0; }
.page-contact .contact-photo { margin: 0; }
.page-contact .contact-form .form-fields { display: grid; gap: 18px; }
.page-contact .contact-form .help { margin: 0; }
.page-contact .write-side { display: grid; gap: 28px; align-content: start; }
.page-contact .rules-strip { padding-bottom: 30px; }
.page-contact .map-card { padding: 16px; }
.page-contact .map-card svg { width: 100%; height: auto; display: block; }
.page-contact .map-card .st { fill: none; stroke: var(--ink); stroke-width: 1; stroke-linecap: round; stroke-dasharray: 1; stroke-dashoffset: 1; transition: stroke-dashoffset var(--slow) var(--feed); }
.page-contact .map-card .st.main { stroke-width: 1.6; }
.page-contact .map-card .st.d2 { transition-delay: 0.25s; }
.page-contact .map-card .st.d3 { transition-delay: 0.5s; }
.page-contact .map-card .st.d4 { transition-delay: 0.75s; }
.page-contact .map-card .river { fill: var(--field-2); stroke: var(--rule); stroke-width: 1; }
.page-contact .map-card .block { fill: var(--field-3); stroke: var(--rule); stroke-width: 0.8; }
.page-contact .map-card .lbl { font-family: var(--rec); font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 500; font-size: 9px; letter-spacing: 0.08em; fill: var(--muted); opacity: 0; transition: opacity var(--base) var(--feed) 0.9s; }
.page-contact .map-card .lbl.main { fill: var(--ink); font-size: 10px; font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 700; }
.page-contact .map-card .pin { transform-origin: 240px 200px; transform: scaleY(0); transition: transform var(--base) var(--feed) 1.1s; }
.page-contact .map-card.is-in .st { stroke-dashoffset: 0; }
.page-contact .map-card.is-in .lbl { opacity: 1; }
.page-contact .map-card.is-in .pin { transform: scaleY(1); }
.page-contact .map-card figcaption { margin: 12px 0 0; font-size: 0.875rem; }
@media (prefers-reduced-motion: reduce) { .page-contact .map-card .st { stroke-dashoffset: 0; transition: none; } .page-contact .map-card .lbl { opacity: 1; transition: none; } .page-contact .map-card .pin { transform: none; transition: none; } }
html.qa-rm .map-card .st { stroke-dashoffset: 0; transition: none; } html.qa-rm .map-card .lbl { opacity: 1; } html.qa-rm .map-card .pin { transform: none; }

/* The Address Tag (2.5D scene) */
.scene-25d { background: var(--field); }
.tag-rig { position: absolute; inset: 0; z-index: 2; overflow: hidden; }
.tag-pivot { position: absolute; left: 50%; top: 0; width: 0; height: 0; transform-origin: 0 0; will-change: transform; }
.tag-string { position: absolute; left: -1px; top: 0; width: 2px; height: min(22vh, 150px); background: var(--ink); opacity: 0.7; }
.addr-tag { position: absolute; top: calc(min(22vh, 150px) - 4px); left: 0; transform: translateX(-50%); width: clamp(280px, 28vw, 460px); padding: clamp(30px, 3vw, 46px) clamp(24px, 2.4vw, 40px) clamp(24px, 2.4vw, 36px); background: var(--copper); color: #fff; clip-path: polygon(13% 0, 100% 0, 100% 100%, 0 100%, 0 22%); font-family: var(--rec); cursor: grab; }
.addr-tag::after { content: ''; position: absolute; inset: 0; pointer-events: none; background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='g'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.06 0'/></filter><rect width='160' height='160' filter='url(%23g)'/></svg>"); opacity: 0.8; }
.addr-tag .hole { position: absolute; left: 50%; top: 14px; width: 14px; height: 14px; margin-left: -7px; border-radius: 50%; background: var(--field); box-shadow: inset 0 0 0 2px rgba(27, 38, 34, 0.35); }
.addr-tag .t-brand { font-variation-settings: 'MONO' 0, 'CASL' 0.65, 'wght' 720; font-size: clamp(1.25rem, 1rem + 1vw, 2rem); margin: 0 0 0.3em; }
.addr-tag .t-addr { font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 600; font-size: clamp(1rem, 0.8rem + 0.8vw, 1.5rem); line-height: 1.3; margin: 0 0 0.6em; }
.addr-tag .t-line { font-variation-settings: 'MONO' 1, 'CASL' 0, 'wght' 500; font-size: clamp(0.8125rem, 0.7rem + 0.4vw, 1rem); margin: 0; opacity: 0.92; }
.addr-tag .t-line + .t-line { margin-top: 2px; }
.tag-shadow { position: absolute; left: 50%; bottom: 8%; width: clamp(220px, 24vw, 400px); height: 36px; margin-left: calc(clamp(220px, 24vw, 400px) / -2); border-radius: 50%; background: radial-gradient(ellipse at center, rgba(27, 38, 34, 0.28) 0%, rgba(27, 38, 34, 0.1) 45%, rgba(27, 38, 34, 0) 72%); will-change: transform; }
.scene-25d .scene-poster { z-index: 1; }
.scene-25d.is-live .scene-poster { opacity: 0; }
@media (prefers-reduced-motion: reduce) { .tag-rig { display: none; } }
html.qa-rm .tag-rig { display: none; }