/*
  Shared page theme (Arcrel contractor engine). Loaded on every page by site/snippets/head/jwg-theme.html.
  Every rule is scoped under .jwg-page (the class on each page's <main>), so it can never touch the nav,
  footer or blog. The homepage is a .jwg-page too; its own rules live inline under #jwg-home.
  Not content-hashed: never give /assets/css/ an immutable cache rule in engine/lib/vercel_config.py.

  THE LOOK. Every inner page opens on a night band (the page hero: breadcrumbs, the H1, the direct answer, the
  starting price in lamp amber, the two buttons, a photo or clip), turns to daylight on one rounded sheet for the
  practical part (what is included, how it is built, prices, FAQ), and returns to night for the related links and
  the closing CTA. The same hex values sit in site/components/nav.html, footer.html, the loader snippet and the
  inline #jwg-home block; search and replace across site/ when the palette changes.

    --night / --deep / --deeper   page base, raised surfaces, the deepest panels
    --mist / --mist-2             text and secondary text on night
    --cta / --cta-hi              the main button: brand blue, breathing a slow blue glow
    --lamp                        pond-light amber: prices on night, the callout rule, the final-CTA glow
    --day / --day-2               the daylight sheet and its cards      --ink / --ink-2   text on day
    --link                        links on day (the logo's deep blue)   --rule            hairlines on day

  The engine injects markup this file styles: .jwg-crumbs (breadcrumbs, inside .jwg-phero > .jwg-wrap),
  .jwg-seealso with .jwg-chips and .jwg-seealso-area (related services, before the final CTA) and .jwg-az (the
  service index). Keep those rules. This comment ships in the public CSS: never name a client here.
*/
html:has(main.jwg-page) { background: #0C1E22; }
.jwg-page {
  --night: #0C1E22; --deep: #12292D; --deeper: #081518;
  --line: rgba(214,232,228,.14); --line-2: rgba(214,232,228,.26);
  --mist: #E6EEEC; --mist-2: #A7BAB7;
  --lamp: #F2C46D; --lamp-hi: #F7D592;
  --cta: #4CAAC9; --cta-hi: #74C2DD; --blue: #4CAAC9;
  --day: #EDF2F0; --day-2: #FFFFFF; --day-3: #E2EAE7; --ink: #0C1E22; --ink-2: #45585B; --link: #0860A8; --rule: #CCD8D5;
  --err: #FFA394;
  --serif: "Newsreader", Georgia, "Times New Roman", serif;
  --sans: "Hanken Grotesk", system-ui, -apple-system, "Segoe UI", sans-serif;
  --t-h1: clamp(2.5rem, 5.2vw, 4.75rem); --t-h2: clamp(1.875rem, 3.4vw, 3rem); --t-h3: clamp(1.375rem, 1.8vw, 1.625rem);
  --t-lede: 1.25rem; --t-small: .9375rem;
  --s1: 8px; --s2: 16px; --s3: 24px; --s4: 32px; --s5: 48px; --s6: 64px; --s7: 96px; --s8: 128px;
  --wrap: 1280px; --gut: clamp(20px, 4vw, 48px); --section: clamp(72px, 9vw, 128px);
  --r-media: 20px; --r-sheet: 32px; --r-card: 20px;
  --ease: cubic-bezier(.16,1,.3,1);
  display: block; margin: 0; background: var(--night); color: var(--mist);
  font: 400 1.0625rem/1.6 var(--sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility; overflow-x: clip;
}
@media (min-width: 1024px) { .jwg-page { font-size: 1.125rem; } }
@media (max-width: 760px) { .jwg-page { --r-media: 16px; --r-sheet: 24px; --r-card: 16px; --t-lede: 1.125rem; --section: 64px; } }
.jwg-page *, .jwg-page *::before, .jwg-page *::after { box-sizing: border-box; }
.jwg-page h1, .jwg-page h2, .jwg-page h3, .jwg-page h4, .jwg-page p, .jwg-page ul, .jwg-page ol, .jwg-page figure, .jwg-page blockquote, .jwg-page dl, .jwg-page dd { margin: 0; padding: 0; }
.jwg-page ul, .jwg-page ol { list-style: none; }
.jwg-page img, .jwg-page video, .jwg-page svg { display: block; max-width: 100%; }
.jwg-page a { color: inherit; text-decoration: none; }
.jwg-page button { font: inherit; color: inherit; background: none; border: 0; cursor: pointer; }
.jwg-page :focus-visible { outline: 2px solid var(--lamp); outline-offset: 4px; }
.jwg-page .jwg-sheet :focus-visible { outline-color: var(--link); }
.jwg-page h1, .jwg-page h2, .jwg-page h3 { font-family: var(--serif); font-optical-sizing: auto; font-weight: 400; color: inherit; text-wrap: balance; }
.jwg-page h4 { font-weight: 600; color: inherit; }
.jwg-page p { text-wrap: pretty; }
.jwg-page strong, .jwg-page b { font-weight: 600; }
.jwg-page em, .jwg-page i { font-style: italic; }
.jwg-page .jwg-num { font-variant-numeric: tabular-nums lining-nums; }
.jwg-page .ic { width: 20px; height: 20px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; }
.jwg-page .jwg-sr { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ---------- Layout ---------- */
.jwg-page .jwg-wrap { max-width: calc(var(--wrap) + 2 * var(--gut)); margin: 0 auto; padding: 0 var(--gut); }
.jwg-page .jwg-narrow { max-width: 820px; }
.jwg-page .jwg-section { position: relative; padding: var(--section) 0; }
.jwg-page .jwg-section.jwg-tight { padding: clamp(48px, 6vw, 80px) 0; }
.jwg-page .jwg-section.jwg-flush-top { padding-top: 0; }
.jwg-page .jwg-center { text-align: center; }
.jwg-page .jwg-center .jwg-head { margin-left: auto; margin-right: auto; }
.jwg-page .jwg-center .jwg-eyebrow { justify-content: center; }
/* the daylight sheet: one rounded sheet that carries the practical part of the page */
.jwg-page .jwg-sheet { position: relative; z-index: 1; background: var(--day); color: var(--ink); border-radius: var(--r-sheet); }
.jwg-page .jwg-sheet > .jwg-section + .jwg-section { padding-top: 0; }
.jwg-page .jwg-sheet.is-last { border-radius: var(--r-sheet) var(--r-sheet) 0 0; }
.jwg-page .jwg-phero + .jwg-sheet { margin-top: calc(-1 * var(--r-sheet)); }
.jwg-page .jwg-band { background: var(--deep); }

/* ---------- Type ---------- */
.jwg-page .jwg-eyebrow { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: var(--t-small); letter-spacing: .01em; color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-eyebrow { color: var(--ink-2); }
.jwg-page .jwg-h1 { font-size: var(--t-h1); line-height: 1.02; font-weight: 360; letter-spacing: -.022em; }
.jwg-page .jwg-h1 em, .jwg-page .jwg-h2 em { font-style: italic; font-weight: 380; color: var(--cta); }
.jwg-page .jwg-sheet .jwg-h2 em { color: var(--link); }
.jwg-page .jwg-h2 { font-size: var(--t-h2); line-height: 1.08; font-weight: 380; letter-spacing: -.018em; }
.jwg-page .jwg-h3 { font-size: var(--t-h3); line-height: 1.2; font-weight: 440; letter-spacing: -.008em; }
.jwg-page .jwg-lede { font-size: var(--t-lede); line-height: 1.55; max-width: 34em; color: var(--mist); }
.jwg-page .jwg-sheet .jwg-lede { color: var(--ink); }
.jwg-page .jwg-muted { color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-muted { color: var(--ink-2); }
.jwg-page .jwg-head { max-width: 760px; margin-bottom: clamp(32px, 4vw, 56px); }
.jwg-page .jwg-head .jwg-h2 { margin-top: var(--s3); }
.jwg-page .jwg-head p { margin-top: var(--s2); max-width: 40em; }
.jwg-page .jwg-head .jwg-eyebrow + .jwg-h2 { margin-top: 14px; }
.jwg-page .jwg-prose { max-width: 66ch; }
.jwg-page .jwg-prose > * + * { margin-top: 18px; }
.jwg-page .jwg-prose h2 { margin-top: 44px; font-size: clamp(1.625rem, 2.4vw, 2.125rem); line-height: 1.15; }
.jwg-page .jwg-prose h3 { margin-top: 32px; font-size: 1.375rem; }
.jwg-page .jwg-prose h2:first-child, .jwg-page .jwg-prose h3:first-child { margin-top: 0; }
.jwg-page .jwg-prose ul, .jwg-page .jwg-prose ol { display: grid; gap: 8px; padding-left: 1.25em; }
.jwg-page .jwg-prose ul { list-style: disc; }
.jwg-page .jwg-prose ol { list-style: decimal; }
.jwg-page .jwg-prose li::marker { color: var(--cta); }
.jwg-page .jwg-sheet .jwg-prose li::marker { color: var(--link); }
.jwg-page .jwg-prose a, .jwg-page .jwg-link { color: var(--cta); text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .2em; text-decoration-color: rgba(76,170,201,.45); transition: text-decoration-color .25s var(--ease); }
.jwg-page .jwg-prose a:hover, .jwg-page .jwg-link:hover { text-decoration-color: currentColor; }
.jwg-page .jwg-sheet .jwg-prose a, .jwg-page .jwg-sheet .jwg-link { color: var(--link); text-decoration-color: rgba(8,96,168,.35); }
.jwg-page .jwg-prose blockquote { padding-left: var(--s3); border-left: 2px solid var(--cta); font-family: var(--serif); font-style: italic; font-size: 1.25rem; line-height: 1.4; }
.jwg-page .jwg-price { font-weight: 600; color: var(--lamp); font-variant-numeric: tabular-nums lining-nums; }
.jwg-page .jwg-price b, .jwg-page .jwg-price strong { font-weight: 600; }
.jwg-page .jwg-sheet .jwg-price { color: var(--ink); }
.jwg-page .jwg-price-line { margin-top: var(--s3); display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; font-size: 1.125rem; }
.jwg-page .jwg-price-line .jwg-price { font-family: var(--serif); font-size: 1.75rem; line-height: 1; font-weight: 400; }

/* ---------- Buttons and text links ---------- */
.jwg-page .jwg-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 50px; padding: 0 26px; border-radius: 999px; border: 0; font: 600 1rem/1 var(--sans); white-space: nowrap; cursor: pointer; transition: background-color .3s var(--ease), box-shadow .5s var(--ease), color .3s var(--ease), transform .2s var(--ease); }
.jwg-page .jwg-btn:active { transform: scale(.98); }
.jwg-page .jwg-btn .ic { width: 18px; height: 18px; transition: transform .4s var(--ease); }
.jwg-page .jwg-btn:hover .ic { transform: translateX(3px); }
.jwg-page .jwg-btn-cta { position: relative; isolation: isolate; background: var(--cta); color: var(--night); }
.jwg-page .jwg-btn-cta::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; pointer-events: none; box-shadow: 0 0 16px 4px rgba(76,170,201,.7), 0 0 56px 16px rgba(76,170,201,.36); opacity: .6; transition: opacity .4s var(--ease); }
.jwg-page .jwg-btn-cta:hover { background: var(--cta-hi); }
.jwg-page .jwg-btn-cta:hover::before { animation: none; opacity: 1; }
@media (prefers-reduced-motion: no-preference) { .jwg-page .jwg-btn-cta::before { animation: jwg-breathe 3.6s ease-in-out infinite; } }
@keyframes jwg-breathe { 0%, 100% { opacity: .25; } 50% { opacity: 1; } }
.jwg-page .jwg-sheet .jwg-btn-cta::before { box-shadow: 0 0 14px 2px rgba(76,170,201,.45), 0 0 40px 10px rgba(76,170,201,.2); }
.jwg-page .jwg-btn-line { background: transparent; color: var(--mist); box-shadow: inset 0 0 0 1px var(--mist-2); }
.jwg-page .jwg-btn-line:hover { background: rgba(230,238,236,.06); box-shadow: inset 0 0 0 1px var(--mist); }
.jwg-page .jwg-sheet .jwg-btn-line { color: var(--ink); box-shadow: inset 0 0 0 1.5px var(--ink); }
.jwg-page .jwg-sheet .jwg-btn-line:hover { background: rgba(12,30,34,.05); }
.jwg-page .jwg-btn-ink { background: var(--ink); color: var(--day); }
.jwg-page .jwg-btn-ink:hover { background: #21393D; }
.jwg-page .jwg-btns { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 16px; margin-top: var(--s4); }
.jwg-page .jwg-btns .jwg-tel { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 600; font-variant-numeric: tabular-nums lining-nums; }
.jwg-page .jwg-textlink { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; font-weight: 600; color: var(--cta); }
.jwg-page .jwg-textlink span { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: .22em; text-decoration-color: rgba(76,170,201,.45); transition: text-decoration-color .25s var(--ease); }
.jwg-page .jwg-textlink:hover span { text-decoration-color: currentColor; }
.jwg-page .jwg-textlink svg { width: 16px; height: 16px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; transition: transform .4s var(--ease); }
.jwg-page .jwg-textlink:hover svg { transform: translateX(4px); }
.jwg-page .jwg-sheet .jwg-textlink { color: var(--link); }
.jwg-page .jwg-sheet .jwg-textlink span { text-decoration-color: rgba(8,96,168,.35); }
.jwg-page .jwg-links { display: flex; flex-wrap: wrap; gap: 6px 28px; }

/* ---------- Breadcrumbs (injected by the engine) ---------- */
.jwg-page .jwg-crumbs { margin-bottom: clamp(24px, 3vw, 40px); }
.jwg-page .jwg-crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-crumbs li { display: inline-flex; align-items: center; gap: 10px; }
.jwg-page .jwg-crumbs li + li::before { content: ""; width: 4px; height: 4px; border-radius: 50%; background: var(--mist-2); opacity: .7; }
.jwg-page .jwg-crumbs a { min-height: 32px; display: inline-flex; align-items: center; }
.jwg-page .jwg-crumbs a:hover { color: var(--mist); }
.jwg-page .jwg-crumbs [aria-current] { color: var(--mist); }

/* ---------- Page hero: the night band ---------- */
.jwg-page .jwg-phero { position: relative; padding: clamp(40px, 5vw, 64px) 0 calc(clamp(56px, 7vw, 96px) + var(--r-sheet)); box-shadow: inset 0 -2px 0 var(--cta); }
.jwg-page .jwg-phero-grid { display: grid; grid-template-columns: minmax(0, 7fr) minmax(0, 5fr); gap: var(--s5) var(--s7); align-items: center; }
.jwg-page .jwg-phero .jwg-h1 { margin-top: 14px; max-width: 13em; }
.jwg-page .jwg-phero-intro { margin-top: var(--s3); }
.jwg-page .jwg-phero .jwg-btns { margin-top: var(--s4); }
.jwg-page .jwg-phero-media { position: relative; }
.jwg-page .jwg-phero-media .jwg-media { box-shadow: 0 24px 64px rgba(4,16,22,.5); }
.jwg-page .jwg-phero.is-compact .jwg-phero-grid { grid-template-columns: 1fr; }
.jwg-page .jwg-phero.is-compact .jwg-h1 { max-width: 18em; }
.jwg-page .jwg-phero-meta { margin-top: var(--s4); padding-top: var(--s3); border-top: 1px solid var(--line); display: flex; flex-wrap: wrap; gap: 10px 28px; font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-phero-meta b { color: var(--mist); font-weight: 600; }

/* ---------- Media ---------- */
.jwg-page .jwg-media { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--r-media); background: var(--deep); }
.jwg-page .jwg-media img, .jwg-page .jwg-media video { width: 100%; height: 100%; object-fit: cover; }
.jwg-page .jwg-media.is-45 { aspect-ratio: 4 / 5; }
.jwg-page .jwg-media.is-34 { aspect-ratio: 3 / 4; }
.jwg-page .jwg-media.is-43 { aspect-ratio: 4 / 3; }
.jwg-page .jwg-media.is-32 { aspect-ratio: 3 / 2; }
.jwg-page .jwg-media.is-169 { aspect-ratio: 16 / 9; }
.jwg-page .jwg-media.is-11 { aspect-ratio: 1 / 1; }
.jwg-page .jwg-media.is-wide { aspect-ratio: 21 / 9; }
.jwg-page .jwg-media.is-916 { aspect-ratio: 9 / 16; }
.jwg-page .jwg-media video { position: absolute; inset: 0; z-index: 1; opacity: 0; transition: opacity .8s var(--ease); }
.jwg-page .jwg-media.is-playing video { opacity: 1; }
.jwg-page .jwg-media .jwg-still { position: relative; z-index: 0; }
.jwg-page .jwg-media figcaption, .jwg-page .jwg-caption { margin-top: 12px; font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-media figcaption, .jwg-page .jwg-sheet .jwg-caption { color: var(--ink-2); }
.jwg-page figure.jwg-media { overflow: visible; background: none; border-radius: 0; }
.jwg-page figure.jwg-media > .jwg-frame { position: relative; overflow: hidden; border-radius: var(--r-media); background: var(--deep); }
.jwg-page figure.jwg-media.is-45 > .jwg-frame { aspect-ratio: 4 / 5; }
.jwg-page figure.jwg-media.is-34 > .jwg-frame { aspect-ratio: 3 / 4; }
.jwg-page figure.jwg-media.is-43 > .jwg-frame { aspect-ratio: 4 / 3; }
.jwg-page figure.jwg-media.is-32 > .jwg-frame { aspect-ratio: 3 / 2; }
.jwg-page figure.jwg-media.is-169 > .jwg-frame { aspect-ratio: 16 / 9; }
.jwg-page figure.jwg-media.is-11 > .jwg-frame { aspect-ratio: 1 / 1; }
.jwg-page figure.jwg-media.is-wide > .jwg-frame { aspect-ratio: 21 / 9; }
.jwg-page figure.jwg-media.is-916 > .jwg-frame { aspect-ratio: 9 / 16; }
.jwg-page figure.jwg-media.is-45, .jwg-page figure.jwg-media.is-34, .jwg-page figure.jwg-media.is-43, .jwg-page figure.jwg-media.is-32, .jwg-page figure.jwg-media.is-169, .jwg-page figure.jwg-media.is-11, .jwg-page figure.jwg-media.is-wide, .jwg-page figure.jwg-media.is-916 { aspect-ratio: auto; }
.jwg-page .jwg-sheet .jwg-media, .jwg-page .jwg-sheet figure.jwg-media > .jwg-frame { background: var(--day-3); }

/* ---------- Split: copy beside media ---------- */
.jwg-page .jwg-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--s5) var(--s7); align-items: center; }
.jwg-page .jwg-split.is-start { align-items: start; }
.jwg-page .jwg-split.is-reverse > :first-child { order: 2; }
.jwg-page .jwg-split .jwg-h2 { margin-top: 14px; }
.jwg-page .jwg-split .jwg-h2 + p, .jwg-page .jwg-split p + p, .jwg-page .jwg-split p + ul, .jwg-page .jwg-split ul + p { margin-top: 18px; }
.jwg-page .jwg-split .jwg-eyebrow + .jwg-h3 { margin-top: 10px; }
.jwg-page .jwg-split-copy > .jwg-btns { margin-top: var(--s4); }
.jwg-page .jwg-split-media { position: relative; }
.jwg-page .jwg-split-media.is-sticky { position: sticky; top: 100px; }

/* ---------- Cards (services, children, upgrades) ---------- */
.jwg-page .jwg-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.jwg-page .jwg-cards.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jwg-page .jwg-cards.is-four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.jwg-page .jwg-card { position: relative; display: flex; flex-direction: column; gap: 10px; padding: var(--s4); border-radius: var(--r-card); background: var(--deep); box-shadow: inset 0 0 0 1px var(--line); color: var(--mist); transition: box-shadow .4s var(--ease), transform .4s var(--ease), background-color .4s var(--ease); }
.jwg-page .jwg-sheet .jwg-card { background: var(--day-2); color: var(--ink); box-shadow: 0 1px 0 rgba(12,30,34,.06), 0 18px 40px -30px rgba(12,30,34,.35); }
.jwg-page a.jwg-card:hover { transform: translateY(-3px); box-shadow: inset 0 0 0 1px var(--line-2); }
.jwg-page .jwg-sheet a.jwg-card:hover { box-shadow: 0 1px 0 rgba(12,30,34,.08), 0 28px 48px -28px rgba(12,30,34,.45); }
.jwg-page .jwg-card h3 { font-size: clamp(1.375rem, 1.9vw, 1.75rem); line-height: 1.15; letter-spacing: -.012em; }
.jwg-page .jwg-card p { color: var(--mist-2); font-size: 1rem; }
.jwg-page .jwg-sheet .jwg-card p { color: var(--ink-2); }
.jwg-page .jwg-card .jwg-price { margin-top: 2px; }
.jwg-page .jwg-card .jwg-card-foot { margin-top: auto; padding-top: 8px; }
.jwg-page .jwg-card .jwg-textlink { min-height: 40px; }
.jwg-page .jwg-card-media { margin: calc(-1 * var(--s4)) calc(-1 * var(--s4)) 10px; border-radius: var(--r-card) var(--r-card) 0 0; overflow: hidden; aspect-ratio: 4 / 3; background: var(--deeper); }
.jwg-page .jwg-sheet .jwg-card-media { background: var(--day-3); }
.jwg-page .jwg-card-media img, .jwg-page .jwg-card-media video { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--ease); }
.jwg-page a.jwg-card:hover .jwg-card-media img { transform: scale(1.04); }
.jwg-page .jwg-card-media.is-45 { aspect-ratio: 4 / 5; }
.jwg-page .jwg-card-kicker { font-size: var(--t-small); font-weight: 600; color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-card-kicker { color: var(--ink-2); }
.jwg-page .jwg-card .jwg-ic-wrap { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(76,170,201,.55); color: var(--cta); margin-bottom: 6px; }
.jwg-page .jwg-sheet .jwg-card .jwg-ic-wrap { color: var(--link); box-shadow: inset 0 0 0 1px rgba(8,96,168,.4); }

/* ---------- Steps: a numbered process ---------- */
.jwg-page .jwg-steps { position: relative; display: grid; gap: var(--s4); counter-reset: step; }
.jwg-page .jwg-steps.is-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--s5) var(--s5); }
.jwg-page .jwg-steps.is-four { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--s4); }
.jwg-page .jwg-steps li { position: relative; display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: var(--s2); counter-increment: step; }
.jwg-page .jwg-steps li::before { content: counter(step); display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; box-shadow: inset 0 0 0 1px var(--mist-2); color: var(--mist); font: 500 1.0625rem var(--serif); }
.jwg-page .jwg-sheet .jwg-steps li::before { box-shadow: inset 0 0 0 1.5px var(--ink); color: var(--ink); }
.jwg-page .jwg-steps li.is-key::before { background: var(--cta); color: var(--night); box-shadow: none; }
.jwg-page .jwg-steps h3 { margin-top: 8px; font-size: 1.3125rem; font-weight: 440; }
.jwg-page .jwg-steps p { margin-top: 6px; font-size: 1rem; color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-steps p { color: var(--ink-2); }
.jwg-page .jwg-steps.is-four li { grid-template-columns: 1fr; }
.jwg-page .jwg-steps.is-four li::before { margin-bottom: 4px; }
.jwg-page .jwg-steps blockquote { margin-top: 10px; padding-left: var(--s2); border-left: 2px solid var(--cta); }
.jwg-page .jwg-steps blockquote p { font: italic 400 1.25rem/1.3 var(--serif); color: inherit; }
.jwg-page .jwg-steps blockquote footer { margin-top: 4px; font-size: var(--t-small); color: var(--mist-2); }

/* ---------- Lists ---------- */
.jwg-page .jwg-checks { display: grid; gap: 0; border-top: 1px solid var(--line); }
.jwg-page .jwg-checks li { position: relative; padding: 14px 0 14px 36px; border-bottom: 1px solid var(--line); }
.jwg-page .jwg-checks li::before { content: ""; position: absolute; left: 2px; top: 1.1em; width: 14px; height: 8px; border-left: 2px solid var(--cta); border-bottom: 2px solid var(--cta); transform: rotate(-45deg); }
.jwg-page .jwg-sheet .jwg-checks, .jwg-page .jwg-sheet .jwg-checks li { border-color: var(--rule); }
.jwg-page .jwg-sheet .jwg-checks li::before { border-color: var(--link); }
.jwg-page .jwg-checks li b { display: block; font-weight: 600; }
.jwg-page .jwg-checks.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 var(--s5); }
.jwg-page .jwg-list { display: grid; gap: 10px; }
.jwg-page .jwg-list li { position: relative; padding-left: 20px; }
.jwg-page .jwg-list li::before { content: ""; position: absolute; left: 0; top: .66em; width: 8px; height: 8px; border-radius: 50%; background: var(--cta); }
.jwg-page .jwg-sheet .jwg-list li::before { background: var(--link); }
.jwg-page .jwg-lights { border-bottom: 1px solid var(--line); }
.jwg-page .jwg-lights li { display: grid; grid-template-columns: 20px minmax(0, 1fr); gap: 4px var(--s2); padding: var(--s3) 0; border-top: 1px solid var(--line); }
.jwg-page .jwg-lights .jwg-lt { width: 10px; height: 10px; margin-top: .7em; border-radius: 50%; background: var(--lamp); box-shadow: 0 0 14px 4px rgba(242,196,109,.32); }
.jwg-page .jwg-lights b { display: block; font-weight: 600; font-size: 1.125rem; }
.jwg-page .jwg-lights p { grid-column: 2; color: var(--mist-2); }
.jwg-page .jwg-lights a:hover { color: var(--cta); }
.jwg-page .jwg-sheet .jwg-lights, .jwg-page .jwg-sheet .jwg-lights li { border-color: var(--rule); }
.jwg-page .jwg-sheet .jwg-lights p { color: var(--ink-2); }
.jwg-page .jwg-sheet .jwg-lights a:hover { color: var(--link); }
.jwg-page .jwg-linklist { border-top: 1px solid var(--line); }
.jwg-page .jwg-linklist a { display: flex; justify-content: space-between; align-items: center; gap: 20px; min-height: 64px; padding: 14px 0; border-bottom: 1px solid var(--line); font-weight: 500; transition: color .25s var(--ease); }
.jwg-page .jwg-linklist a svg { width: 18px; height: 18px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; color: var(--cta); transition: transform .4s var(--ease); }
.jwg-page .jwg-linklist a:hover svg { transform: translateX(4px); }
.jwg-page .jwg-sheet .jwg-linklist, .jwg-page .jwg-sheet .jwg-linklist a { border-color: var(--rule); }
.jwg-page .jwg-sheet .jwg-linklist a svg { color: var(--link); }
.jwg-page .jwg-sheet .jwg-linklist a:hover { color: var(--link); }

/* ---------- Tables ---------- */
.jwg-page .jwg-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.jwg-page .jwg-table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums lining-nums; }
.jwg-page .jwg-table th, .jwg-page .jwg-table td { text-align: left; padding: 16px 20px 16px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
.jwg-page .jwg-sheet .jwg-table th, .jwg-page .jwg-sheet .jwg-table td { border-color: var(--rule); }
.jwg-page .jwg-table thead th { font-size: var(--t-small); font-weight: 600; color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-table thead th { color: var(--ink-2); }
.jwg-page .jwg-table tbody th { font-weight: 600; }
.jwg-page .jwg-table td.jwg-price, .jwg-page .jwg-table .jwg-price { white-space: nowrap; }

/* ---------- Plan tiers (the price field renders nothing while empty) ---------- */
.jwg-page .jwg-tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); align-items: stretch; }
.jwg-page .jwg-tier { position: relative; display: flex; flex-direction: column; padding: var(--s4); border-radius: var(--r-card); background: var(--day-2); box-shadow: 0 1px 0 rgba(12,30,34,.06), 0 18px 40px -30px rgba(12,30,34,.35); }
.jwg-page .jwg-tier.is-featured { background: var(--night); color: var(--mist); box-shadow: inset 0 0 0 1px rgba(242,196,109,.3), 0 24px 56px -32px rgba(4,16,22,.6); }
.jwg-page .jwg-tier-flag { position: absolute; top: -13px; left: var(--s4); padding: 5px 12px; border-radius: 999px; background: var(--lamp); color: var(--night); font-size: .8125rem; font-weight: 600; }
.jwg-page .jwg-tier h3 { font-size: 1.75rem; }
.jwg-page .jwg-tier-for { margin-top: 6px; color: var(--ink-2); font-size: 1rem; }
.jwg-page .jwg-tier.is-featured .jwg-tier-for { color: var(--mist-2); }
.jwg-page .jwg-tier-price { margin-top: var(--s3); font-family: var(--serif); font-size: 2.25rem; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.jwg-page .jwg-tier-price:empty { display: none; }
.jwg-page .jwg-tier-price small { font-family: var(--sans); font-size: 1rem; color: var(--ink-2); margin-left: 6px; }
.jwg-page .jwg-tier.is-featured .jwg-tier-price { color: var(--lamp); }
.jwg-page .jwg-tier ul { margin: var(--s3) 0 var(--s4); border-top: 1px solid var(--rule); }
.jwg-page .jwg-tier.is-featured ul { border-color: var(--line); }
.jwg-page .jwg-tier li { position: relative; padding: 11px 0 11px 28px; border-bottom: 1px solid var(--rule); font-size: 1rem; }
.jwg-page .jwg-tier.is-featured li { border-color: var(--line); }
.jwg-page .jwg-tier li::before { content: ""; position: absolute; left: 2px; top: 17px; width: 12px; height: 7px; border-left: 2px solid var(--link); border-bottom: 2px solid var(--link); transform: rotate(-45deg); }
.jwg-page .jwg-tier.is-featured li::before { border-color: var(--cta); }
.jwg-page .jwg-tier .jwg-btn { margin-top: auto; width: 100%; }
.jwg-page .jwg-tier-note { margin-top: 12px; font-size: var(--t-small); color: var(--ink-2); }
.jwg-page .jwg-tier.is-featured .jwg-tier-note { color: var(--mist-2); }
.jwg-page .jwg-fineprint { margin-top: var(--s3); font-size: var(--t-small); color: var(--mist-2); max-width: 70ch; }
.jwg-page .jwg-sheet .jwg-fineprint { color: var(--ink-2); }

/* ---------- Callouts and quotes ---------- */
.jwg-page .jwg-note { padding: 20px 24px; border-radius: var(--r-card); background: rgba(242,196,109,.1); box-shadow: inset 0 0 0 1px rgba(242,196,109,.3); }
.jwg-page .jwg-sheet .jwg-note { background: rgba(76,170,201,.12); box-shadow: inset 0 0 0 1px rgba(76,170,201,.4); color: var(--ink); }
.jwg-page .jwg-note b { font-weight: 600; }
.jwg-page .jwg-note p + p { margin-top: 10px; }
.jwg-page .jwg-pull { padding-left: var(--s3); border-left: 2px solid var(--cta); }
.jwg-page .jwg-pull p { font: italic 400 clamp(1.375rem, 2vw, 1.75rem)/1.35 var(--serif); }
.jwg-page .jwg-pull footer { margin-top: 10px; font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-pull footer { color: var(--ink-2); }
.jwg-page .jwg-badge { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; padding: 6px 16px 6px 8px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-2); font-weight: 600; font-size: var(--t-small); }
.jwg-page .jwg-badge .jwg-drop { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--cta); color: var(--night); }
.jwg-page .jwg-badge .jwg-drop svg { width: 16px; height: 16px; }
.jwg-page .jwg-sheet .jwg-badge { box-shadow: inset 0 0 0 1.5px var(--ink); }

/* ---------- FAQ (details/summary, so FAQPage questions stay visible word for word) ---------- */
.jwg-page .jwg-faq-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s4) var(--s7); align-items: start; }
.jwg-page .jwg-faq-grid .jwg-head { position: sticky; top: 100px; margin-bottom: 0; }
.jwg-page .jwg-faq { border-top: 1px solid var(--rule); }
.jwg-page .jwg-faq details { border-bottom: 1px solid var(--rule); }
.jwg-page .jwg-faq summary { list-style: none; cursor: pointer; display: flex; justify-content: space-between; align-items: center; gap: 24px; padding: 20px 0; }
.jwg-page .jwg-faq summary::-webkit-details-marker { display: none; }
.jwg-page .jwg-faq summary h3 { font-size: clamp(1.125rem, 1.5vw, 1.375rem); line-height: 1.3; font-weight: 440; transition: color .25s var(--ease); }
.jwg-page .jwg-faq summary:hover h3 { color: var(--link); }
.jwg-page .jwg-faq summary::after { content: ""; flex: none; width: 16px; height: 16px; background: linear-gradient(var(--link), var(--link)) center / 16px 2px no-repeat, linear-gradient(var(--link), var(--link)) center / 2px 16px no-repeat; transition: transform .35s var(--ease); }
.jwg-page .jwg-faq details[open] summary::after { transform: rotate(45deg); }
.jwg-page .jwg-faq-a { padding: 0 44px 24px 0; max-width: 62ch; }
.jwg-page .jwg-faq-a p + p { margin-top: 12px; }
.jwg-page .jwg-faq-a a { color: var(--link); text-decoration: underline; text-underline-offset: .2em; text-decoration-color: rgba(8,96,168,.35); }
.jwg-page .jwg-faq-a a:hover { text-decoration-color: currentColor; }
.jwg-page .jwg-phero .jwg-faq, .jwg-page .jwg-night .jwg-faq, .jwg-page .jwg-night .jwg-faq details { border-color: var(--line); }

/* ---------- Gallery and showcases ---------- */
.jwg-page .jwg-gallery { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.jwg-page .jwg-gallery.is-two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.jwg-page .jwg-gallery figure { display: flex; flex-direction: column; }
.jwg-page .jwg-gallery .jwg-frame { aspect-ratio: 4 / 5; }
.jwg-page .jwg-gallery.is-wide .jwg-frame { aspect-ratio: 4 / 3; }
.jwg-page .jwg-gallery figcaption { margin-top: 12px; display: flex; flex-direction: column; gap: 2px; }
.jwg-page .jwg-gallery figcaption b { font-weight: 600; color: var(--mist); }
.jwg-page .jwg-gallery figcaption span { font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-sheet .jwg-gallery figcaption b { color: var(--ink); }
.jwg-page .jwg-sheet .jwg-gallery figcaption span { color: var(--ink-2); }
.jwg-page a.jwg-work { display: block; color: inherit; border-radius: var(--r-media); }
.jwg-page a.jwg-work .jwg-frame img { transition: transform 1.2s var(--ease); }
.jwg-page a.jwg-work:hover .jwg-frame img { transform: scale(1.04); }
.jwg-page .jwg-filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: var(--s4); }
.jwg-page .jwg-filters button, .jwg-page .jwg-filters a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-2); font-weight: 600; font-size: var(--t-small); transition: background-color .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease); }
.jwg-page .jwg-filters [aria-pressed="true"], .jwg-page .jwg-filters [aria-current] { background: var(--mist); color: var(--night); box-shadow: none; }
.jwg-page .jwg-filters button:hover { box-shadow: inset 0 0 0 1px var(--mist); }
.jwg-page .jwg-ba { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--s3); }
.jwg-page .jwg-ba figcaption b { display: inline-block; margin-bottom: 2px; padding: 3px 10px; border-radius: 999px; background: var(--lamp); color: var(--night); font-size: .8125rem; font-weight: 600; }
.jwg-page .jwg-sheet .jwg-ba figcaption b { background: var(--ink); color: var(--day); }

/* ---------- Media strip: a swipeable row of cards (jwg-theme.js moves it by arrow and keyboard) ---------- */
.jwg-page .jwg-strip-head { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--s3); margin-bottom: clamp(24px, 3vw, 40px); }
.jwg-page .jwg-strip-head > div:first-child { max-width: 62ch; }
.jwg-page .jwg-strip-head .jwg-h2 + p { margin-top: 14px; color: var(--mist-2); }
.jwg-page .jwg-strip-nav { display: flex; gap: 10px; flex: none; padding-bottom: 4px; }
.jwg-page .jwg-strip-nav button, .jwg-page .jwg-lb-btn { display: grid; place-items: center; width: 48px; height: 48px; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--mist); box-shadow: inset 0 0 0 1px var(--line-2); cursor: pointer; transition: background-color .25s var(--ease), color .25s var(--ease), opacity .25s var(--ease); }
.jwg-page .jwg-strip-nav button svg, .jwg-page .jwg-lb-btn svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.jwg-page .jwg-strip-nav button:hover, .jwg-page .jwg-lb-btn:hover { background: var(--mist); color: var(--night); }
.jwg-page .jwg-strip-nav button[aria-disabled="true"], .jwg-page .jwg-lb-btn:disabled { opacity: .35; pointer-events: none; }
.jwg-page .jwg-strip-nav button:focus-visible, .jwg-page .jwg-strip-open:focus-visible { outline: 2px solid var(--lamp); outline-offset: 3px; }
.jwg-page .jwg-strip-track { display: flex; gap: var(--s3); margin: 0; padding: 4px max(var(--gut), calc((100% - var(--wrap)) / 2)) 8px; list-style: none; overflow-x: auto; overscroll-behavior-x: contain; scroll-snap-type: x mandatory; scroll-padding-inline: max(var(--gut), calc((100% - var(--wrap)) / 2)); scrollbar-width: none; -webkit-overflow-scrolling: touch; }
.jwg-page .jwg-strip-track::-webkit-scrollbar { display: none; }
.jwg-page .jwg-strip-track:focus-visible { outline: 2px solid var(--lamp); outline-offset: -2px; }
.jwg-page .jwg-strip-item { flex: 0 0 clamp(240px, 26vw, 360px); scroll-snap-align: start; }
.jwg-page .jwg-strip-open { display: block; color: inherit; border-radius: var(--r-media); }
.jwg-page .jwg-strip-open .jwg-frame img { transition: transform 1.2s var(--ease); }
.jwg-page .jwg-strip-open:hover .jwg-frame img { transform: scale(1.04); }
.jwg-page .jwg-strip-open figcaption { display: flex; flex-direction: column; gap: 4px; }
.jwg-page .jwg-strip-open figcaption span { color: var(--mist); }
.jwg-page .jwg-strip-link { color: var(--blue); font-weight: 600; }
.jwg-page .jwg-play-badge { position: absolute; left: 14px; bottom: 14px; z-index: 2; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--cta); color: var(--night); box-shadow: 0 6px 18px rgba(8,21,24,.4); }
.jwg-page .jwg-play-badge svg { width: 22px; height: 22px; fill: currentColor; margin-left: 2px; }

/* ---------- Lightbox: the <dialog> jwg-theme.js builds for [data-jwg-lightbox] links ---------- */
.jwg-page .jwg-lightbox { position: fixed; inset: 0; width: 100vw; height: 100vh; max-width: none; max-height: none; margin: 0; padding: 0; border: 0; background: var(--deeper); color: var(--mist); display: none; grid-template-rows: minmax(0, 1fr) auto; overscroll-behavior: contain; touch-action: pan-y; }
.jwg-page .jwg-lightbox[open] { display: grid; }
.jwg-page .jwg-lightbox:focus { outline: none; }
.jwg-page .jwg-lightbox::backdrop { background: rgba(12,30,34,.92); }
.jwg-page .jwg-lb-stage { display: grid; place-items: center; min-height: 0; padding: calc(72px + env(safe-area-inset-top)) var(--s3) var(--s2); }
.jwg-page .jwg-lb-stage img, .jwg-page .jwg-lb-stage video { display: block; width: auto; height: auto; max-width: min(100%, 1600px); max-height: calc(100vh - 190px); object-fit: contain; border-radius: var(--r-media); background: var(--night); }
.jwg-page .jwg-lb-bar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: var(--s3); padding: 0 var(--s3) calc(var(--s3) + env(safe-area-inset-bottom)); }
.jwg-page .jwg-lb-cap { margin: 0; max-width: 60ch; font-size: 1rem; color: var(--mist-2); text-wrap: pretty; }
.jwg-page .jwg-lb-ctl { display: flex; align-items: center; gap: 12px; }
.jwg-page .jwg-lb-count { margin: 0; min-width: 5ch; text-align: center; font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-lb-close { position: absolute; top: calc(14px + env(safe-area-inset-top)); right: calc(14px + env(safe-area-inset-right)); background: rgba(12,30,34,.6); }
.jwg-page .jwg-lb-btn:focus-visible { outline: 2px solid var(--lamp); outline-offset: 2px; }
html.jwg-lb-open:has(main.jwg-page) { overflow: hidden; }

/* ---------- Click-to-play player ([data-jwg-player]): a clip with sound and controls, never a muted loop ---------- */
.jwg-page .jwg-media.jwg-player video { position: relative; inset: auto; z-index: 0; opacity: 1; background: var(--night); }
.jwg-page .jwg-player.is-916 { max-width: 400px; margin-inline: auto; }
.jwg-page .jwg-play { position: absolute; inset: 0; z-index: 2; display: grid; place-content: center; justify-items: center; gap: 10px; width: 100%; padding: 0; border: 0; background: linear-gradient(to top, rgba(8,21,24,.55), rgba(8,21,24,.1)); color: var(--mist); font: inherit; font-weight: 600; cursor: pointer; }
.jwg-page .jwg-play .jwg-play-ring { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--cta); color: var(--night); box-shadow: 0 0 0 10px rgba(76,170,201,.22), 0 10px 30px rgba(8,21,24,.4); transition: transform .3s var(--ease); }
.jwg-page .jwg-play .jwg-play-ring svg { width: 28px; height: 28px; fill: currentColor; margin-left: 3px; }
.jwg-page .jwg-play:hover .jwg-play-ring { transform: scale(1.06); }
.jwg-page .jwg-play:focus-visible { outline: 2px solid var(--lamp); outline-offset: -4px; }
.jwg-page .jwg-play span { font-size: var(--t-small); text-shadow: 0 1px 8px rgba(8,21,24,.6); }
.jwg-page .jwg-player.is-playing .jwg-play { display: none; }

/* ---------- Chips and the related block (injected by the engine before the final CTA) ---------- */
.jwg-page .jwg-chips { display: flex; flex-wrap: wrap; gap: 10px; }
.jwg-page .jwg-chips a { display: inline-flex; align-items: center; min-height: 44px; padding: 0 18px; border-radius: 999px; box-shadow: inset 0 0 0 1px var(--line-2); font-weight: 500; transition: background-color .25s var(--ease), color .25s var(--ease), box-shadow .25s var(--ease); }
.jwg-page .jwg-chips a:hover { background: var(--mist); color: var(--night); box-shadow: none; }
.jwg-page .jwg-sheet .jwg-chips a { box-shadow: inset 0 0 0 1.5px var(--ink); }
.jwg-page .jwg-sheet .jwg-chips a:hover { background: var(--ink); color: var(--day); }
.jwg-page .jwg-seealso { border-top: 1px solid var(--line); }
.jwg-page .jwg-seealso .jwg-h2 { margin-top: 14px; font-size: clamp(1.625rem, 2.6vw, 2.25rem); }
.jwg-page .jwg-seealso .jwg-chips { margin-top: var(--s3); }
.jwg-page .jwg-seealso .jwg-links { margin-top: var(--s3); }
.jwg-page .jwg-seealso-area { margin-top: var(--s3); max-width: 62ch; color: var(--mist-2); }
.jwg-page .jwg-seealso-area a { color: var(--mist); text-decoration: underline; text-decoration-color: rgba(76,170,201,.45); text-underline-offset: .2em; }
.jwg-page .jwg-seealso-area a:hover { color: var(--cta); }
.jwg-page .jwg-az { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: var(--s4) var(--s5); margin-top: var(--s5); }
.jwg-page .jwg-az-group h3 { font-size: 1.25rem; padding-bottom: 12px; border-bottom: 1px solid var(--line); }
.jwg-page .jwg-az-group h3 a:hover { color: var(--cta); }
.jwg-page .jwg-az-group ul { margin-top: 8px; }
.jwg-page .jwg-az-group li a { display: block; padding: 8px 0; color: var(--mist-2); }
.jwg-page .jwg-az-group li a:hover { color: var(--mist); }
.jwg-page .jwg-reviewed { margin-top: 18px; font-size: var(--t-small); color: var(--mist-2); }

/* ---------- Final CTA: night, with the lamp glow ---------- */
.jwg-page .jwg-final { position: relative; isolation: isolate; overflow: hidden; }
.jwg-page .jwg-final::before { content: ""; position: absolute; z-index: -1; left: 50%; top: 40%; width: min(900px, 120vw); height: 600px; transform: translate(-50%, -50%); background: radial-gradient(closest-side, rgba(242,196,109,.22), rgba(242,196,109,.1) 55%, rgba(242,196,109,0)); pointer-events: none; }
.jwg-page .jwg-final-grid { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--s5) var(--s7); align-items: start; }
.jwg-page .jwg-final .jwg-h2 { font-size: clamp(2.125rem, 4vw, 3.5rem); line-height: 1.05; }
.jwg-page .jwg-final .jwg-lede { margin-top: var(--s3); }
.jwg-page .jwg-final .jwg-btns { margin-top: var(--s4); }
.jwg-page .jwg-final .ec { box-shadow: inset 0 0 0 1px rgba(242,196,109,.3), 0 24px 64px rgba(4,16,22,.5); }
.jwg-page .jwg-final .ec-fallback { padding: var(--s4); border-radius: var(--r-media); background: var(--deep); }
.jwg-page .jwg-final .ec-fallback a { color: var(--cta); font-weight: 600; }
.jwg-page .jwg-routes { margin-top: var(--s4); border-bottom: 1px solid var(--line); }
.jwg-page .jwg-routes a { display: grid; grid-template-columns: 48px minmax(0, 1fr) auto; align-items: center; gap: var(--s2); min-height: 80px; padding: var(--s2) 0; border-top: 1px solid var(--line); color: var(--mist); }
.jwg-page .jwg-routes .rc { display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; box-shadow: inset 0 0 0 1px rgba(76,170,201,.55); color: var(--cta); }
.jwg-page .jwg-routes span { display: block; font-size: var(--t-small); }
.jwg-page .jwg-routes b { display: block; font-weight: 600; font-size: 1.125rem; line-height: 1.35; }
.jwg-page .jwg-routes .arr { color: var(--mist-2); transition: transform .4s var(--ease), color .3s; }
.jwg-page .jwg-routes a:hover .arr { transform: translateX(4px); color: var(--mist); }
.jwg-page .jwg-nap { margin-top: var(--s3); font-size: var(--t-small); color: var(--mist-2); }
.jwg-page .jwg-nap a { color: var(--mist); font-weight: 600; }

/* ---------- Legal pages ---------- */
.jwg-page .jwg-legal { max-width: 760px; }
.jwg-page .jwg-legal .jwg-updated { font-size: var(--t-small); color: var(--ink-2); }

/* ---------- Reveal (crawler-safe: jwg-theme.js shows everything to bots at once) ---------- */
.jwg-js .jwg-page [data-reveal] { opacity: 0; transform: translateY(18px); transition: opacity .9s var(--ease), transform .9s var(--ease); transition-delay: var(--d, 0s); }
.jwg-js .jwg-page [data-reveal].is-in { opacity: 1; transform: none; }

/* ---------- Responsive ---------- */
@media (max-width: 1024px) {
  .jwg-page .jwg-phero-grid, .jwg-page .jwg-split, .jwg-page .jwg-faq-grid, .jwg-page .jwg-final-grid { grid-template-columns: 1fr; }
  .jwg-page .jwg-split.is-reverse > :first-child { order: 0; }
  .jwg-page .jwg-phero-media { max-width: 520px; }
  .jwg-page .jwg-split-media { max-width: 560px; }
  .jwg-page .jwg-split-media.is-sticky { position: static; }
  .jwg-page .jwg-faq-grid .jwg-head { position: static; margin-bottom: var(--s2); }
  .jwg-page .jwg-cards, .jwg-page .jwg-cards.is-four, .jwg-page .jwg-gallery, .jwg-page .jwg-ba { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .jwg-page .jwg-tiers { grid-template-columns: 1fr; max-width: 560px; }
  .jwg-page .jwg-steps.is-four { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .jwg-page .jwg-h1 { font-size: clamp(2.125rem, 9vw, 2.75rem); }
  .jwg-page .jwg-phero { padding-top: var(--s4); }
  .jwg-page .jwg-cards, .jwg-page .jwg-cards.is-two, .jwg-page .jwg-cards.is-four, .jwg-page .jwg-gallery, .jwg-page .jwg-gallery.is-two, .jwg-page .jwg-ba, .jwg-page .jwg-steps.is-grid, .jwg-page .jwg-steps.is-four, .jwg-page .jwg-checks.is-two { grid-template-columns: 1fr; }
  .jwg-page .jwg-btns .jwg-btn { flex: 1 1 100%; }
  .jwg-page .jwg-faq-a { padding-right: 0; }
  .jwg-page .jwg-crumbs li:not(:first-child):not(:last-child) { display: none; }
  .jwg-page .jwg-table th, .jwg-page .jwg-table td { padding: 12px 14px 12px 0; }
  .jwg-page .jwg-media.is-wide, .jwg-page figure.jwg-media.is-wide > .jwg-frame { aspect-ratio: 4 / 3; }
  .jwg-page .jwg-strip-head { flex-direction: column; align-items: flex-start; }
  .jwg-page .jwg-strip-nav { display: none; }
  .jwg-page .jwg-strip-item { flex-basis: 78vw; }
  .jwg-page .jwg-lb-stage { padding: 64px var(--s2) var(--s2); }
  .jwg-page .jwg-lb-stage img, .jwg-page .jwg-lb-stage video { max-height: calc(100vh - 200px); }
  .jwg-page .jwg-lb-bar { grid-template-columns: 1fr; gap: var(--s2); padding: 0 var(--s2) calc(var(--s2) + env(safe-area-inset-bottom)); }
  .jwg-page .jwg-lb-ctl { justify-content: center; }
}
@media (prefers-reduced-motion: reduce) {
  .jwg-page *, .jwg-page *::before, .jwg-page *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; }
  .jwg-js .jwg-page [data-reveal] { opacity: 1; transform: none; }
  .jwg-page .jwg-media:not(.jwg-player) video { display: none; }
}

/* ---- Estimate calculator (contractor engine) ----
   Rendered by /assets/js/jwg-estimate.js into [data-estimate]. One question per screen, the price range after the
   contact step, then the booking panel. Every selector sits under .jwg-page .ec; the --ec-* tokens on .ec are the
   night palette of the chosen direction, and a page may override them on its own wrapper. The thin band at the top of
   the card is the progress bar: a waterline that rises with each answer. */
.jwg-page .ec{
  --ec-bg:#12292D; --ec-fg:#E6EEEC; --ec-muted:#A7BAB7;
  --ec-panel:rgba(230,238,236,.07); --ec-border:rgba(214,232,228,.14); --ec-track:rgba(230,238,236,.14);
  --ec-primary:#4CAAC9; --ec-primary-hover:#74C2DD; --ec-on-primary:#0C1E22;
  --ec-link:#4CAAC9; --ec-ring:#F2C46D; --ec-err:#FFA394; --ec-field:#6A8684; --ec-night:#0C1E22;
  --ec-head:"Newsreader",Georgia,"Times New Roman",serif; --ec-body:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;
  --ec-radius:20px; --ec-radius-sm:12px;
  --ec-shadow:inset 0 0 0 1px rgba(214,232,228,.14);
  --ec-ease:cubic-bezier(.16,1,.3,1);
  position:relative;display:flex;flex-direction:column;min-height:520px;
  background:var(--ec-bg);color:var(--ec-fg);border-radius:var(--ec-radius);box-shadow:var(--ec-shadow);
  padding:0 clamp(20px,3.5vw,40px) clamp(20px,3vw,32px);font-family:var(--ec-body);line-height:1.5;overflow:hidden;
}
.jwg-page .ec *{box-sizing:border-box}
.jwg-page .ec fieldset{border:0;padding:0;margin:0;min-width:0}
.jwg-page .ec legend{display:block;padding:0;max-width:100%}
.jwg-page .ec button,.jwg-page .ec input,.jwg-page .ec textarea{font:inherit;color:inherit}
.jwg-page .ec :focus-visible{outline:3px solid var(--ec-ring);outline-offset:3px;border-radius:6px}

/* the waterline: a thin band of water along the top of the card that rises with every answer */
.jwg-page .ec-top{display:flex;align-items:center;gap:14px;padding:18px 0 22px}
.jwg-page .ec-water{position:relative;flex:1;height:6px;border-radius:999px;background:var(--ec-track);overflow:visible}
.jwg-page .ec-water::before{content:"";position:absolute;left:0;top:0;bottom:0;width:calc(var(--p,0) * 100%);min-width:6px;border-radius:999px;background:var(--ec-primary);transition:width 650ms var(--ec-ease)}
.jwg-page .ec-wave{position:absolute;top:50%;left:calc(var(--p,0) * 100%);width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:var(--ec-primary);box-shadow:0 0 0 4px color-mix(in srgb,var(--ec-primary) 28%,transparent);transition:left 650ms var(--ec-ease)}
.jwg-page .ec-count{font-size:.875rem;font-weight:600;color:var(--ec-muted);font-variant-numeric:tabular-nums;white-space:nowrap}

/* steps slide in from the direction of travel; reduced motion gets a plain swap */
.jwg-page .ec-step,.jwg-page .ec-result{display:flex;flex-direction:column;flex:1;opacity:0;transform:translateY(14px);transition:opacity 280ms var(--ec-ease),transform 320ms var(--ec-ease)}
.jwg-page .ec-step[data-dir=back]{transform:translateY(-14px)}
.jwg-page .ec-step.in,.jwg-page .ec-result.in{opacity:1;transform:none}
.jwg-page .ec-result{padding-bottom:0}

.jwg-page .ec-q{display:block;font-family:var(--ec-head);font-optical-sizing:auto;font-weight:400;font-size:clamp(1.625rem,2.8vw,2.125rem);line-height:1.15;letter-spacing:-.012em;text-wrap:balance;outline:none}
.jwg-page .ec-q:focus-visible{outline:none;box-shadow:none}
.jwg-page .ec-hint{display:block;margin-top:8px;color:var(--ec-muted);max-width:40em;text-wrap:pretty}
.jwg-page .ec-opts{display:grid;gap:10px;margin-top:22px}
.jwg-page .ec-cols{grid-template-columns:1fr 1fr}
.jwg-page .ec-opt{position:relative;display:flex;align-items:center;gap:12px;min-height:56px;padding:12px 40px 12px 14px;border-radius:var(--ec-radius-sm);background:var(--ec-bg);box-shadow:inset 0 0 0 1px var(--ec-border);cursor:pointer;transition:box-shadow 160ms var(--ec-ease),background-color 160ms var(--ec-ease),transform 120ms var(--ec-ease)}
.jwg-page .ec-opt:hover{box-shadow:inset 0 0 0 1px var(--ec-link)}
.jwg-page .ec-opt:active{transform:scale(.99)}
.jwg-page .ec-opt input{position:absolute;opacity:0;width:1px;height:1px;margin:0;pointer-events:none}
.jwg-page .ec-opt:has(input:checked){background:rgba(76,170,201,.14);box-shadow:inset 0 0 0 2px var(--ec-link)}
.jwg-page .ec-opt:has(input:focus-visible){outline:3px solid var(--ec-ring);outline-offset:2px}
.jwg-page .ec-k{position:absolute;top:10px;right:10px;display:grid;place-items:center;width:24px;height:24px;border-radius:7px;background:var(--ec-panel);color:var(--ec-muted);font-size:.8125rem;font-weight:700;font-variant-numeric:tabular-nums;box-shadow:inset 0 0 0 1px var(--ec-border)}
.jwg-page .ec-opt:has(input:checked) .ec-k{opacity:0}
.jwg-page .ec-opt{background:var(--ec-night)}
@media (pointer:coarse){.ec-k{display:none}}
.jwg-page .ec-ic.ec-opt-ic{flex:none;width:42px;height:42px;padding:9px;border-radius:11px;background:var(--ec-panel);color:var(--ec-link)}
.jwg-page .ec-opt:has(input:checked) .ec-opt-ic{background:rgba(76,170,201,.18)}
.jwg-page .ec-ic{width:20px;height:20px;flex:none;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.jwg-page .ec-t{display:block;flex:1;font-weight:600;line-height:1.3}
.jwg-page .ec-d{display:block;margin-top:2px;font-weight:400;font-size:.9375rem;color:var(--ec-muted)}
.jwg-page .ec-tick{position:absolute;top:12px;right:12px;opacity:0;color:var(--ec-link);transform:scale(.6);transition:opacity 160ms var(--ec-ease),transform 200ms var(--ec-ease)}
.jwg-page .ec-opt:has(input:checked) .ec-tick{opacity:1;transform:none}

/* inputs */
.jwg-page .ec-fields{display:grid;gap:14px;margin-top:22px}
.jwg-page .ec-2{grid-template-columns:1fr 1fr}
.jwg-page .ec-field{display:grid;gap:6px;align-content:start}
.jwg-page .ec-field label{font-weight:600}
.jwg-page .ec-opt-l{font-weight:400;color:var(--ec-muted)}
.jwg-page .ec-field input,.jwg-page .ec-field textarea{width:100%;min-height:50px;padding:10px 14px;border:1px solid var(--ec-field);border-radius:var(--ec-radius-sm);background:var(--ec-night);color:var(--ec-fg);transition:border-color 160ms var(--ec-ease),box-shadow 160ms var(--ec-ease)}
.jwg-page .ec-field textarea{min-height:120px;resize:vertical}
.jwg-page .ec-field input:focus,.jwg-page .ec-field textarea:focus{outline:none;border-color:var(--ec-link);box-shadow:0 0 0 3px color-mix(in srgb,var(--ec-link) 22%,transparent)}
.jwg-page .ec-field.invalid input,.jwg-page .ec-field.invalid textarea{border-color:var(--ec-err)}
.jwg-page .ec-text .ec-field{margin-top:22px}
.jwg-page .ec-custom[hidden]{display:none}
.jwg-page .ec-custom{display:flex;align-items:end;gap:12px;margin-top:14px;padding:14px;border-radius:var(--ec-radius-sm);background:var(--ec-panel);flex-wrap:wrap}
.jwg-page .ec-custom .ec-field{flex:1 1 120px}
.jwg-page .ec-custom .ec-field input{max-width:160px}
.jwg-page .ec-x{padding-bottom:12px;color:var(--ec-muted);font-weight:600}
.jwg-page .ec-err{display:none;flex-basis:100%;font-size:.9375rem;font-weight:600;color:var(--ec-err)}
.jwg-page .invalid > .ec-err,.jwg-page .ec-err-foot{display:block}
.jwg-page fieldset.invalid > .ec-err{margin-top:12px}
.jwg-page fieldset.invalid .ec-opts{box-shadow:0 0 0 2px var(--ec-err);border-radius:var(--ec-radius-sm)}
.jwg-page .ec-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.jwg-page .ec-hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.jwg-page .ec-note{margin:14px 0 0;font-size:.9375rem;color:var(--ec-muted)}
.jwg-page .ec-note a{color:var(--ec-link);font-weight:600}

/* footer of each step: back, continue, the keyboard hint */
.jwg-page .ec-foot{display:flex;align-items:center;gap:14px;margin-top:auto;padding-top:26px;flex-wrap:wrap}
.jwg-page .ec-back,.jwg-page .ec-next,.jwg-page .ec-cta{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 22px;border:0;border-radius:999px;font-family:var(--ec-body);font-weight:600;font-size:1rem;cursor:pointer;text-decoration:none;transition:background-color 160ms var(--ec-ease),transform 120ms var(--ec-ease),color 160ms var(--ec-ease)}
.jwg-page .ec-back{background:transparent;color:var(--ec-link);padding-left:12px}
.jwg-page .ec-back:hover{background:var(--ec-panel)}
.jwg-page .ec-next,.jwg-page .ec-cta{background:var(--ec-primary);color:var(--ec-on-primary);padding-right:18px}
.jwg-page .ec-next:hover,.jwg-page .ec-cta:hover{background:var(--ec-primary-hover)}
.jwg-page .ec-next:active,.jwg-page .ec-cta:active{transform:scale(.97)}
.jwg-page .ec-next[disabled]{opacity:.7;cursor:progress}
.jwg-page .ec-key{font-size:.875rem;color:var(--ec-muted)}
.jwg-page .ec-err-foot{flex-basis:100%}
@media (pointer:coarse){.ec-key{display:none}}

/* the result: the number surfaces through the waterline, then the booking panel */
.jwg-page .ec-est{padding-top:4px}
.jwg-page .ec-eyebrow{margin:0;color:var(--ec-muted);font-weight:600}
.jwg-page .ec-title{margin:4px 0 0}
.jwg-page .ec-surface{position:relative;overflow:hidden;margin-top:12px;padding-bottom:10px;border-bottom:2px solid var(--ec-primary)}
.jwg-page .ec-rise{transform:translateY(110%);animation:ec-rise 820ms var(--ec-ease) 120ms forwards}
@keyframes ec-rise{to{transform:none}}
.jwg-page .ec-num{display:block;font-family:var(--ec-head);font-weight:400;font-size:clamp(2rem,5vw,3.25rem);line-height:1.05;letter-spacing:-.025em;font-variant-numeric:tabular-nums}
.jwg-page .ec-num.ec-words{font-size:clamp(1.5rem,3.4vw,2.25rem)}
.jwg-page .ec-to{font-size:.5em;font-weight:500;color:var(--ec-muted);letter-spacing:0}
.jwg-page .ec-math{margin:12px 0 0;color:var(--ec-muted);font-variant-numeric:tabular-nums}
.jwg-page .ec-fine{margin:10px 0 0;font-size:.9375rem;color:var(--ec-muted);max-width:44em;text-wrap:pretty}
.jwg-page .ec-notes{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.jwg-page .ec-notes li{position:relative;padding-left:18px;font-weight:600}
.jwg-page .ec-notes li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--ec-primary)}
.jwg-page .ec-book{display:grid;gap:12px;margin-top:24px;padding:20px;border-radius:var(--ec-radius);background:var(--ec-panel)}
.jwg-page .ec-book p{margin:0}
.jwg-page .ec-book-h{display:flex;align-items:center;gap:8px;font-family:var(--ec-head);font-weight:600;font-size:1.125rem;margin-bottom:4px}
.jwg-page .ec-book-h .ec-ic{color:var(--ec-link)}
.jwg-page .ec-book .ec-cta{justify-self:start;min-width:200px}
.jwg-page .ec-alt{display:flex;align-items:center;gap:6px;color:var(--ec-muted);flex-wrap:wrap}
.jwg-page .ec-alt .ec-ic{width:16px;height:16px;color:var(--ec-link)}
.jwg-page .ec-alt a{color:var(--ec-fg);font-weight:700;text-decoration:none}
.jwg-page .ec-sum{margin-top:20px;border-top:1px solid var(--ec-border);padding-top:14px}
.jwg-page .ec-sum summary{cursor:pointer;font-weight:600;color:var(--ec-link)}
.jwg-page .ec-sum dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:12px 0 0;font-size:.9375rem}
.jwg-page .ec-sum dt{color:var(--ec-muted)}
.jwg-page .ec-sum dd{margin:0}
.jwg-page .ec-restart{margin-top:16px}
.jwg-page .ec-link{background:none;border:0;padding:0;color:var(--ec-link);font-weight:600;text-decoration:underline;text-underline-offset:.2em;cursor:pointer}

/* the recap: the saved estimate on the booking page. Empty (and hidden) without a submitted estimate this session. */
.jwg-page .ec-recap:empty{display:none}
.jwg-page .ec-recap{display:block;padding:clamp(20px,3vw,28px) clamp(20px,3.5vw,32px);border-radius:var(--ec-radius,20px);background:rgba(230,238,236,.06);box-shadow:inset 0 0 0 1px rgba(214,232,228,.14);font-family:"Hanken Grotesk",system-ui,-apple-system,"Segoe UI",sans-serif;line-height:1.5}
.jwg-page .ec-recap *{box-sizing:border-box}
.jwg-page .ec-recap .ec-eyebrow{display:flex;align-items:center;gap:8px;margin:0;color:#A7BAB7;font-weight:600}
.jwg-page .ec-recap .ec-eyebrow .ec-ic{color:#4CAAC9}
.jwg-page .ec-recap-title{margin:10px 0 0;font-family:"Newsreader",Georgia,"Times New Roman",serif;font-size:1.25rem;line-height:1.25;text-wrap:balance}
.jwg-page .ec-recap .ec-num{margin:8px 0 0;font-family:"Newsreader",Georgia,"Times New Roman",serif;font-weight:400;font-size:clamp(1.875rem,3.4vw,2.5rem);line-height:1.05;letter-spacing:-.02em;color:#F2C46D;font-variant-numeric:tabular-nums}
.jwg-page .ec-recap .ec-num.ec-words{font-size:clamp(1.375rem,2.4vw,1.75rem);color:inherit}
.jwg-page .ec-recap .ec-to{font-size:.5em;font-weight:500;color:#A7BAB7;letter-spacing:0}
.jwg-page .ec-recap .ec-math{margin:10px 0 0;color:#A7BAB7;font-size:.9375rem;font-variant-numeric:tabular-nums}
.jwg-page .ec-recap .ec-notes{margin:10px 0 0;padding:0;list-style:none;display:grid;gap:6px}
.jwg-page .ec-recap .ec-notes li{position:relative;padding-left:18px;font-weight:600;font-size:.9375rem}
.jwg-page .ec-recap .ec-notes li::before{content:"";position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:#4CAAC9}
.jwg-page .ec-recap .ec-fine{margin:12px 0 0;font-size:.9375rem;color:#A7BAB7;text-wrap:pretty}
.jwg-page .ec-recap .ec-sum{margin-top:16px;border-top:1px solid rgba(214,232,228,.14);padding-top:12px}
.jwg-page .ec-recap .ec-sum summary{cursor:pointer;font-weight:600;color:#4CAAC9}
.jwg-page .ec-recap .ec-sum dl{display:grid;grid-template-columns:auto 1fr;gap:6px 18px;margin:12px 0 0;font-size:.9375rem}
.jwg-page .ec-recap .ec-sum dt{color:#A7BAB7}
.jwg-page .ec-recap .ec-sum dd{margin:0}

@media (max-width:640px){
  .jwg-page .ec{min-height:0;padding:0 18px 18px}
  .jwg-page .ec-recap .ec-sum dl{grid-template-columns:1fr}
  .jwg-page .ec-recap .ec-sum dt{margin-top:6px}
  .jwg-page .ec-cols,.jwg-page .ec-2{grid-template-columns:1fr}
  .jwg-page .ec-foot{position:sticky;bottom:0;background:var(--ec-bg);padding-bottom:4px}
  .jwg-page .ec-next{flex:1}
  .jwg-page .ec-sum dl{grid-template-columns:1fr}
  .jwg-page .ec-sum dt{margin-top:6px}
}
@media (prefers-reduced-motion:reduce){
  .jwg-page .ec-step,.jwg-page .ec-result,.jwg-page .ec-water::before,.jwg-page .ec-wave,.jwg-page .ec-opt,.jwg-page .ec-tick{transition:none}
  .jwg-page .ec-rise{animation:none;transform:none}
}