/* ============ tokens ============ */
:root{
  --wc-g1:#3DFF3D;--wc-g2:#1FC957;--wc-g3:#0D7A3D;--wc-g4:#6E806E;
  --wc-ink0:#F4F4F0;--wc-ink1:#CBDBCB;--wc-ink2:#9AAE9A;--wc-ink3:#6E806E;
  --wc-hair:rgba(61,255,61,.14);--wc-hair2:rgba(244,244,240,.08);
  --wc-surface:#0D140D;
}
.wc-ic{flex:none;width:22px;height:22px;display:block}
.wc-ic path,.wc-ic line,.wc-ic circle,.wc-ic polyline,.wc-ic rect,.wc-ic polygon{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.wc-ic-s{width:16px;height:16px}
.wc-ic-s path,.wc-ic-s line,.wc-ic-s circle,.wc-ic-s polyline{stroke-width:1.75}
.wc-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0}

/* Webflow ships flex:0 1 100% on form children; in a column flex container that makes every
   auto-height child claim the container height and shrink to an arbitrary slice. Pin them to content. */
#wc-form>*{flex:0 0 auto}
/* Turnstile is interaction-only. Until it has rendered we reserve no space for it. */
.wc-turnstile:empty,.wc-turnstile[data-collapsed]{display:none!important}

/* ============ hero result panel ============ */
.wc-hero-right{min-width:0;display:flex;flex-direction:column}
.wc-hp{border:1px solid var(--wc-hair);border-radius:8px;background:var(--wc-surface);padding:clamp(24px,2.6vw,34px);display:flex;flex-direction:column}
.wc-hp[hidden]{display:none!important}
.wc-hp-top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin:0 0 clamp(18px,2vw,26px);min-height:24px}
.wc-hp-label{display:inline-flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--wc-ink2)}
.wc-hp-label .wc-ic{color:var(--wc-g2)}
.wc-hp-host{font-size:12.5px;color:var(--wc-ink2);overflow-wrap:anywhere;min-width:0;text-align:right}

/* score gauge: one grid cell, ring and number stacked, both centred by the grid */
.wc-gauge{display:grid;place-items:center;width:min(210px,58%);aspect-ratio:1;margin:0 auto clamp(18px,2vw,24px)}
.wc-gauge>*{grid-area:1/1}
.wc-ring{display:block;width:100%;height:100%;transform:rotate(-90deg)}
.wc-ring-track{fill:none;stroke:rgba(61,255,61,.13);stroke-width:1.5}
.wc-ring-arc{fill:none;stroke:var(--wc-g1);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:339.292;stroke-dashoffset:339.292;transform-origin:60px 60px}
.wc-gauge-num{display:grid;place-items:center;text-align:center;line-height:1}
.wc-hp-num{font-family:"Newsreader 60 Pt",Georgia,serif;font-style:normal;font-weight:400;font-size:clamp(54px,6vw,76px);line-height:1;color:var(--wc-g1);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;letter-spacing:0;display:block}
.wc-hp-outof{display:block;margin-top:6px;font-family:"Instrument Sans",system-ui,sans-serif;font-size:10.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--wc-ink3)}
.wc-hp-stage{font-family:"Instrument Sans",system-ui,sans-serif;font-size:13px;color:var(--wc-ink1);text-align:center;max-width:11ch;line-height:1.35}
.wc-hp-verdict{margin:0;font-size:16px;line-height:1.5;color:var(--wc-ink0);text-wrap:pretty}
.wc-hp-cov{margin:10px 0 0;font-size:12.5px;line-height:1.55;color:var(--wc-ink2)}
.wc-hp-cta{margin:clamp(18px,2vw,24px) 0 0;align-self:flex-start}
.wc-hp-fail-t{margin:0 0 8px;font-size:17px;font-weight:500;color:var(--wc-ink0)}
.wc-hp-fail-b{margin:0 0 20px;font-size:14px;line-height:1.6;color:var(--wc-ink1)}
.wc-hp .wc-stages{margin:clamp(18px,2vw,24px) 0 0;padding:18px 0 0;border-top:1px solid var(--wc-hair);display:flex;flex-direction:column;gap:10px;list-style:none}
.wc-hp .wc-stage{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--wc-ink3);transition:color .3s ease}
.wc-hp .wc-stage[data-done]{color:var(--wc-ink2)}
.wc-hp .wc-stage[data-active]{color:var(--wc-ink0)}
.wc-stage-dot{width:6px;height:6px;border-radius:50%;background:#1E3A1E;flex:none;transition:background-color .3s ease}
.wc-stage[data-done] .wc-stage-dot{background:var(--wc-g3)}
.wc-stage[data-active] .wc-stage-dot{background:var(--wc-g1)}
/* per-state visibility */
.wc-hp .wc-stages,.wc-hp-fail,.wc-hp-retry,.wc-hp-cta,.wc-hp-stage{display:none}
.wc-hp[data-wc-hp="scanning"] .wc-stages{display:flex}
.wc-hp[data-wc-hp="scanning"] .wc-hp-stage{display:block}
.wc-hp[data-wc-hp="scanning"] .wc-gauge-num,.wc-hp[data-wc-hp="scanning"] .wc-hp-verdict,.wc-hp[data-wc-hp="scanning"] .wc-hp-cov{display:none}
/* Scanning spinner. Three things fight for this ring, so these rules are deliberate:
   1. The page head still carries an older spinner that rotates the SVG at 1.5s while this file
      rotated the arc at 1.25s. Two spins at different periods read as a wobble, and the SVG's
      base rotate(-90deg) is dropped while its animation runs, so the ring jumped on completion.
      The SVG is held still here and only the arc moves.
   2. The controller writes stroke-dasharray/stroke-dashoffset inline for the score arc. Inline
      beats a normal declaration, which is why "58 282" never applied and the spinner was really
      the finished score arc going round. Keyframes outrank inline, so the dash length is
      animated rather than declared.
   3. After a completed scan a finished Web Animations handle holds stroke-dashoffset with
      fill:both, and that outranks keyframes too. Only !important beats it, so the offset is
      pinned and every bit of motion comes from the dash length and the rotation. */
.wc-hp[data-wc-hp="scanning"] .wc-ring{animation:none!important}
.wc-hp[data-wc-hp="scanning"] .wc-ring-arc{stroke-dashoffset:0!important;animation:wcSpin 1.8s linear infinite,wcArc 1.35s ease-in-out infinite}
.wc-hp[data-wc-hp="complete"] .wc-hp-cta{display:inline-flex}
.wc-hp[data-wc-hp="partial"] .wc-hp-num{color:var(--wc-ink0);font-size:clamp(40px,4vw,52px)}
.wc-hp[data-wc-hp="partial"] .wc-hp-outof{visibility:hidden}
.wc-hp[data-wc-hp="failed"] .wc-gauge,.wc-hp[data-wc-hp="failed"] .wc-hp-verdict,.wc-hp[data-wc-hp="failed"] .wc-hp-cov,.wc-hp[data-wc-hp="failed"] .wc-hp-top{display:none}
.wc-hp[data-wc-hp="failed"] .wc-hp-fail{display:block}
.wc-hp[data-wc-hp="failed"] .wc-hp-retry{display:inline-flex}
@keyframes wcSpin{to{transform:rotate(360deg)}}
@keyframes wcArc{0%,100%{stroke-dasharray:14 325}50%{stroke-dasharray:170 169}}
@media(prefers-reduced-motion:reduce){.wc-hp[data-wc-hp="scanning"] .wc-ring-arc{animation:none!important;stroke-dasharray:90 249!important}}

/* ============ detailed report shell ============ */
#wc-results{display:none}
#wc-results[data-wc-state="complete"],#wc-results[data-wc-state="partial"]{display:grid}
#wc-results[hidden]{display:none!important}
[data-wc-panel]:not([hidden]){display:block!important;background:transparent!important;border:0!important;border-radius:0!important;padding:0!important;overflow:visible!important}
[data-wc-panel]>*{grid-column:1/-1!important;border:0!important;padding:0!important;margin:0!important;min-width:0}
.wc-sec{padding:clamp(38px,4.4vw,64px) 0!important;border-top:1px solid var(--wc-hair2)!important}
.wc-sec-h{display:flex;align-items:center;gap:10px;font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--wc-ink2);margin:0 0 8px!important}
.wc-sec-h .wc-ic{color:var(--wc-g2)}
.wc-sec-sub{margin:0 0 clamp(24px,2.6vw,34px);font-size:13.5px;line-height:1.6;color:var(--wc-ink3);max-width:70ch}

/* ============ keep-this-report + print-and-reset: one shared row ============ */
/* These two are the report's closing actions and belong side by side. They are already adjacent
   siblings, so the panel becomes a two-column grid rather than gaining a wrapper element: every
   other section spans both columns and only these two take one each. No column-gap, so the
   section hairline runs unbroken across the top and the vertical rule does the separating. */
/* The page head already lays the panel out as a 12-column grid, and its #wc-results [data-wc-panel]
   selector outranks anything unprefixed here, so these two just claim six columns each rather than
   redefining the template. display is forced because this file previously flattened the panel to
   block, which killed that grid. */
[data-wc-panel]:not([hidden]){display:grid!important}
.wc-gate.wc-sec{grid-column:1/span 6!important;padding-right:clamp(28px,3.4vw,56px)!important}
.wc-actions-sec{grid-column:7/-1!important;border-left:1px solid var(--wc-hair2)!important;padding-left:clamp(28px,3.4vw,56px)!important}
/* An example report has no email gate — there is nothing real to send — and the gate is hidden
   with [hidden], so it generates no grid item. Without this the actions would sit in column two
   beside a blank column one. */
[data-wc-panel]:has(.wc-gate[hidden]) .wc-actions-sec{grid-column:1/-1!important;border-left:0!important;padding-left:0!important}
/* The head stretches these buttons and sets width:100% on them, which was right when the section
   ran the full canvas width but makes them 500px slabs in a half-width column. They are discrete
   actions, so they size to their own label. The head already has a [data-wc-row] variant that does
   exactly this, but nothing sets that attribute, so it is done here instead. */
.wc-actions-sec .wc-actions{align-items:flex-start!important}
.wc-actions-sec .wc-actions>*{width:auto!important}

/* Consent checkbox. Webflow ships a block label with padding-left:20px and floats the input into
   that gutter, but the float has margin:0 here, so the box sat indented 20px from the left edge
   every other field starts at, and the label text wrapped around the float instead of sitting
   beside it. A flex row puts the box flush with the fields above and keeps the text alongside it
   when it wraps; flex-start pins it to the first line rather than the centre of a wrapped block. */
.wc-gate .w-checkbox{display:flex;align-items:flex-start;gap:12px;padding-left:0!important;margin:0!important}
.wc-gate .w-checkbox-input{float:none!important;margin:0!important;flex:0 0 auto}
/* Webflow's clearfix pseudo-elements exist only to contain that float. In a flex row they become
   flex items, so ::before took the first slot and the gap pushed the real box 12px off the edge. */
.wc-gate .w-checkbox::before,.wc-gate .w-checkbox::after{display:none!important}
.wc-gate .w-checkbox .w-form-label{margin:0}
.wc-gate .wc-lead{margin-bottom:18px!important}

/* ============ links to the privacy policy ============ */
/* Where personal details are collected, the policy is one click away. The Webflow builder could not
   attach a class to these two links, so they are found by where they point. */
.wc-gate a[href$="/privacy"]{display:block;margin:6px 0 0;padding:0;width:fit-content;font-size:13px;line-height:1.5;color:var(--wc-ink2);text-decoration:none;border-bottom:1px solid var(--wc-g2);transition:color .18s ease,border-color .18s ease}
.wc-gate a[href$="/privacy"]:hover,.wc-gate a[href$="/privacy"]:focus-visible{color:var(--wc-ink0);border-bottom-color:var(--wc-g1)}
.wc-gate:has([data-wc-gate-submit][aria-disabled="true"]) a[href$="/privacy"]{display:none!important}
.wc-q-a a[href$="/privacy"]{display:block;margin-top:12px;width:fit-content;color:inherit;text-decoration:none;border-bottom:1px solid #3DFF3D}
.wc-q-a a[href$="/privacy"]:hover{border-bottom-color:currentColor}

/* ============ gate confirmation ============ */
/* Submitting already set a message, but as a small grey note under the button it read as nothing
   having happened. The only success signal available to CSS is the aria-disabled the page sets on
   the submit button, so that drives a real confirmation: the fields collapse and the message
   becomes the whole panel. An error leaves aria-disabled off, so the form stays put and the same
   panel shows the error instead. Reset clears both, and the form returns. */
.wc-gate [data-wc-gate-status]:not(:empty){margin-top:20px!important;padding:18px 20px;border:1px solid var(--wc-hair2);border-left:3px solid var(--wc-g2);background:rgba(244,244,240,.03);font-size:14px;line-height:1.6;color:var(--wc-ink1)}
.wc-gate [data-wc-gate-submit][aria-disabled="true"]~[data-wc-gate-status]:not(:empty){border-left-color:var(--wc-g1)}
.wc-gate [data-wc-gate-submit][aria-disabled="true"]~[data-wc-gate-status]:not(:empty)::before{content:"Thank you.";display:block;margin:0 0 6px;font-family:"Newsreader 60 Pt",Georgia,serif;font-style:italic;font-size:20px;color:var(--wc-ink0)}
.wc-gate:has([data-wc-gate-submit][aria-disabled="true"]) .wc-label,
.wc-gate:has([data-wc-gate-submit][aria-disabled="true"]) .wc-gate-input,
.wc-gate:has([data-wc-gate-submit][aria-disabled="true"]) textarea,
.wc-gate:has([data-wc-gate-submit][aria-disabled="true"]) .wc-check-row2,
.wc-gate:has([data-wc-gate-submit][aria-disabled="true"]) .wc-btn{display:none!important}

/* ============ hero heading optical alignment ============ */
/* The head guards italic swashes from clipping with padding:0 .16em plus a matching negative
   margin, so the net offset is zero. But #wc-hero .wc-h1{margin:0} wipes the compensating margin
   and leaves the padding, so the headline sat .16em right of the eyebrow and body copy. Restoring
   the horizontal halves is idempotent: where the guard still applies this sets the same value. */
.wc-h1,.wc-h2,.wc-h3{margin-left:-.16em!important;margin-right:-.16em!important}

/* ============ closing row: no top rule ============ */
/* The vertical divider already separates the two columns, and the section padding holds it apart
   from the evidence section above, so the hairline just cut across the top of the pair. */
.wc-gate.wc-sec,.wc-actions-sec{border-top:0!important}

/* ============ secondary fields: underline, matching the site's #contact ============ */
/* The site's own form (.dd-input) is a transparent field on a hairline rule, not a pill. The
   scanner's secondary fields now match it so the page stops reading as a stack of rounded boxes.
   The hero URL field is deliberately NOT included: it is the page's primary call to action and
   should still look like a button-sized target next to the green button. */
.wc-gate-input,.wc-ctx-input,.wc-gate textarea,.wc-ctx textarea{
  background:transparent!important;border:0!important;border-bottom:1px solid rgba(244,244,240,.35)!important;
  border-radius:0!important;padding:6px 0 10px!important;height:auto!important;max-width:none!important;
  font-size:16px!important;color:var(--wc-ink0)!important;transition:border-color .18s ease}
.wc-gate-input:hover,.wc-ctx-input:hover{border-bottom-color:rgba(244,244,240,.6)!important}
/* Green underline on focus, as in the mockup. The existing focus ring is left alone so keyboard
   users still get the outline that was verified against the rest of the page. */
.wc-gate-input:focus,.wc-ctx-input:focus{border-bottom-color:var(--wc-g1)!important}
/* Sentence-case labels at the site's size, rather than the small uppercase eyebrow style. */
.wc-ctx-label,.wc-gate .wc-label{text-transform:none!important;letter-spacing:normal!important;font-size:13px!important;color:var(--wc-ink1)!important;font-weight:400!important;margin:0 0 8px!important}
/* Flattening the label margin above also removed the space between one field and the next
   label, leaving 4px. Put it back only where a label follows a field, so the first label
   still sits tight under the section intro. */
.wc-gate .wc-gate-input+.wc-label,.wc-gate textarea+.wc-label{margin-top:22px!important}

/* ============ optional context fields ============ */
/* One column. Three of these sit inside the hero's ~440px column, which left each about 139px —
   narrow enough to clip the example text mid-word ("e.g. Custom joinery for renov..."). Stacked
   underline fields also read like the site's own contact form, and it sidesteps the alignment
   problem three columns had, where one wrapped label pushed only its own input down. */
.wc-ctx-grid{grid-template-columns:minmax(0,1fr)!important;row-gap:18px!important}
@media(max-width:859px){
.wc-gate.wc-sec{grid-column:1/-1!important;padding-right:0!important}
.wc-actions-sec{grid-column:1/-1!important;border-left:0!important;padding-left:0!important}
}

/* Supplied page-and-reset mark. It is a filled glyph, while the icon set is stroked, so it is
   painted as a mask over currentColor instead of being restyled: it then inherits the same
   green as every other section heading and stays correct if that token changes. !important is
   required because the page head already masks this exact element with the old 24x24 mark, at a
   specificity an unprefixed selector here cannot reach. */
.wc-actions-sec .wc-sec-h .wc-ic>*{display:none}
.wc-actions-sec .wc-sec-h .wc-ic{background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.31 28.82'%3E%3Cpath fill='black' d='M22.29,6.95L16.18.97c-.64-.62-1.48-.97-2.37-.97H3.4C1.52,0,0,1.52,0,3.4v22.03c0,1.87,1.52,3.4,3.4,3.4h16.52c1.87,0,3.4-1.52,3.4-3.4V9.37c0-.91-.37-1.79-1.02-2.43ZM21.39,7.86c.12.12.22.25.31.4h-4.54c-1.16,0-2.11-.95-2.11-2.11V1.7c.08.06.16.11.23.18l6.11,5.98ZM19.92,27.53H3.4c-1.16,0-2.11-.95-2.11-2.11V3.4c0-1.16.95-2.11,2.11-2.11h10.37v4.86c0,1.87,1.52,3.4,3.4,3.4h4.86v15.88c0,1.16-.95,2.11-2.11,2.11Z'/%3E%3Cpath fill='black' d='M16.54,15.54c-.19-.07-.37-.06-.54.02-.16.08-.28.2-.35.37-.07.16-.09.33-.04.51.22.72.24,1.45.06,2.19-.18.74-.54,1.38-1.1,1.93-.81.81-1.78,1.22-2.92,1.22s-2.11-.41-2.92-1.22c-.81-.81-1.22-1.78-1.22-2.92s.41-2.11,1.22-2.92c.53-.53,1.15-.89,1.86-1.08.71-.19,1.42-.19,2.14,0l-1.56,1.56c-.14.14-.21.3-.21.49,0,.19.07.35.21.49s.3.21.49.21c.19,0,.35-.07.49-.21l2.43-2.43c.14-.14.21-.3.21-.49s-.07-.35-.21-.49l-2.43-2.43c-.14-.14-.3-.21-.49-.21-.19,0-.35.07-.49.21-.14.14-.21.3-.21.49,0,.19.07.35.21.49l.85.85c-.8-.07-1.56.04-2.31.32-.74.28-1.39.7-1.95,1.26-1.09,1.09-1.63,2.39-1.63,3.89s.54,2.81,1.63,3.89c1.09,1.09,2.39,1.63,3.89,1.63s2.81-.54,3.89-1.63c.75-.75,1.25-1.63,1.47-2.64s.18-2-.13-2.98c-.05-.18-.17-.3-.35-.38Z'/%3E%3C/svg%3E") no-repeat center/contain!important;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 23.31 28.82'%3E%3Cpath fill='black' d='M22.29,6.95L16.18.97c-.64-.62-1.48-.97-2.37-.97H3.4C1.52,0,0,1.52,0,3.4v22.03c0,1.87,1.52,3.4,3.4,3.4h16.52c1.87,0,3.4-1.52,3.4-3.4V9.37c0-.91-.37-1.79-1.02-2.43ZM21.39,7.86c.12.12.22.25.31.4h-4.54c-1.16,0-2.11-.95-2.11-2.11V1.7c.08.06.16.11.23.18l6.11,5.98ZM19.92,27.53H3.4c-1.16,0-2.11-.95-2.11-2.11V3.4c0-1.16.95-2.11,2.11-2.11h10.37v4.86c0,1.87,1.52,3.4,3.4,3.4h4.86v15.88c0,1.16-.95,2.11-2.11,2.11Z'/%3E%3Cpath fill='black' d='M16.54,15.54c-.19-.07-.37-.06-.54.02-.16.08-.28.2-.35.37-.07.16-.09.33-.04.51.22.72.24,1.45.06,2.19-.18.74-.54,1.38-1.1,1.93-.81.81-1.78,1.22-2.92,1.22s-2.11-.41-2.92-1.22c-.81-.81-1.22-1.78-1.22-2.92s.41-2.11,1.22-2.92c.53-.53,1.15-.89,1.86-1.08.71-.19,1.42-.19,2.14,0l-1.56,1.56c-.14.14-.21.3-.21.49,0,.19.07.35.21.49s.3.21.49.21c.19,0,.35-.07.49-.21l2.43-2.43c.14-.14.21-.3.21-.49s-.07-.35-.21-.49l-2.43-2.43c-.14-.14-.3-.21-.49-.21-.19,0-.35.07-.49.21-.14.14-.21.3-.21.49,0,.19.07.35.21.49l.85.85c-.8-.07-1.56.04-2.31.32-.74.28-1.39.7-1.95,1.26-1.09,1.09-1.63,2.39-1.63,3.89s.54,2.81,1.63,3.89c1.09,1.09,2.39,1.63,3.89,1.63s2.81-.54,3.89-1.63c.75-.75,1.25-1.63,1.47-2.64s.18-2-.13-2.98c-.05-.18-.17-.3-.35-.38Z'/%3E%3C/svg%3E") no-repeat center/contain!important}

/* ============ key numbers: ledger, not cards ============ */
/* Four statistics read as one band across the canvas. The numeral sits above its label rather than
   beside it: beside it, a value like "16/20" at display size leaves the label a hyphenating sliver. */
.wc-kf{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:clamp(20px,2.4vw,34px)}
.wc-kf-item{min-width:0;padding:clamp(20px,2vw,26px) 0 0;border-top:1px solid var(--wc-hair2);display:grid;grid-template-columns:minmax(0,1fr);row-gap:clamp(10px,1vw,14px);align-items:start}
.wc-kf-num{font-family:"Newsreader 60 Pt",Georgia,serif;font-style:normal;font-weight:400;font-size:clamp(46px,4.4vw,66px);line-height:.92;color:var(--wc-ink0);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1;display:flex;align-items:baseline;white-space:nowrap}
.wc-kf-den{font-size:.36em;color:var(--wc-ink3);margin-left:.06em}
.wc-kf-body{min-width:0;padding-top:0}
.wc-kf-lab{margin:0;font-family:"Instrument Sans",system-ui,sans-serif;font-size:13px;font-weight:500;color:var(--wc-ink0);letter-spacing:.01em}
.wc-kf-pct{margin:6px 0 0;font-size:12px;color:var(--wc-ink2);font-variant-numeric:tabular-nums}
.wc-kf-rail{margin:10px 0 0;height:2px;background:rgba(244,244,240,.1);border-radius:2px;overflow:hidden;max-width:180px}
.wc-kf-rail>i{display:block;height:100%;transform-origin:left center;border-radius:2px}
.wc-kf-item:nth-child(4n+1) .wc-kf-rail>i{background:var(--wc-g1)}
.wc-kf-item:nth-child(4n+2) .wc-kf-rail>i{background:var(--wc-g2)}
.wc-kf-item:nth-child(4n+3) .wc-kf-rail>i{background:var(--wc-g3)}
.wc-kf-item:nth-child(4n+4) .wc-kf-rail>i{background:var(--wc-g4)}
.wc-kf-scope{margin:10px 0 0;font-size:11.5px;line-height:1.5;color:var(--wc-ink3)}
.wc-kf-note{margin:5px 0 0;font-size:11.5px;line-height:1.5;color:var(--wc-ink2)}
.wc-kf-def{margin:8px 0 0}
.wc-kf-def>summary{list-style:none;cursor:pointer;font-size:11.5px;color:var(--wc-ink3);display:inline-flex;align-items:center;gap:6px;min-height:32px}
.wc-kf-def>summary::-webkit-details-marker{display:none}
.wc-kf-def>summary::before{content:"+";color:var(--wc-g2);font-size:13px}
.wc-kf-def[open]>summary::before{content:"\2013"}
.wc-kf-def>summary:hover{color:var(--wc-ink1)}
.wc-kf-def>p{margin:2px 0 0;font-size:11.5px;line-height:1.6;color:var(--wc-ink2);max-width:52ch}
/* Four across needs the full canvas. Below it, two across keeps the numerals large rather than
   letting four columns squeeze them; one across only once two would be too narrow to read. */
@media(max-width:1023px){.wc-kf{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,3vw,44px)}.wc-kf-num{font-size:clamp(52px,6vw,74px)}}
@media(max-width:539px){.wc-kf{grid-template-columns:minmax(0,1fr)}.wc-kf-num{font-size:clamp(54px,14vw,68px)}}

/* ============ categories ============ */
.wc-cats{display:flex;flex-direction:column}
.wc-cat{padding:clamp(24px,2.6vw,34px) 0;border-top:1px solid var(--wc-hair2)}
.wc-cat:first-child{border-top:0;padding-top:0}
.wc-cat:last-child{padding-bottom:0}
.wc-cat-head{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:14px 24px;align-items:start}
.wc-cat-name{margin:0;display:flex;align-items:center;gap:11px;font-family:"Instrument Sans",system-ui,sans-serif;font-size:16.5px;font-weight:500;color:var(--wc-ink0);min-width:0}
.wc-cat-name .wc-ic{color:var(--wc-g2)}
.wc-cat-score{text-align:right;white-space:nowrap;line-height:1}
.wc-cat-score b{font-family:"Newsreader 60 Pt",Georgia,serif;font-style:normal;font-weight:400;font-size:clamp(30px,3.2vw,40px);color:var(--wc-ink0);font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1,"lnum" 1}
.wc-cat-score span{color:var(--wc-ink3);font-size:.5em}
.wc-cat-score i{display:block;margin-top:6px;font-style:normal;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--wc-ink3)}
.wc-cat-def{margin:12px 0 0;font-size:13.5px;line-height:1.65;color:var(--wc-ink1);max-width:66ch}
.wc-segs{display:flex;gap:2px;margin:18px 0 0;height:6px;border-radius:3px;overflow:hidden;background:rgba(244,244,240,.07)}
.wc-segs>i{display:block;height:100%;transform-origin:left center}
.wc-segs>i[data-k="pass"]{background:var(--wc-g2)}
.wc-segs>i[data-k="att"]{background:var(--wc-g1)}
.wc-segs>i[data-k="un"]{background:var(--wc-g4)}
.wc-cat-counts{margin:12px 0 0;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:12px;color:var(--wc-ink2);font-variant-numeric:tabular-nums}
.wc-cat-counts span{display:inline-flex;align-items:center;gap:7px}
.wc-cat-counts .wc-key{width:8px;height:8px;border-radius:2px;flex:none}
.wc-cat-counts .p .wc-key{background:var(--wc-g2)}
.wc-cat-counts .a .wc-key{background:var(--wc-g1)}
.wc-cat-counts .u .wc-key{background:var(--wc-g4)}
.wc-cat-top{margin:16px 0 0;padding:14px 0 0;border-top:1px solid var(--wc-hair2);font-size:13px;line-height:1.6;color:var(--wc-ink1);max-width:66ch}
.wc-cat-top b{display:block;font-weight:400;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--wc-ink3);margin-bottom:5px}
@media(max-width:560px){.wc-cat-head{grid-template-columns:minmax(0,1fr)}.wc-cat-score{text-align:left}}

/* ============ checks (inside folds) ============ */
.wc-checks{display:flex;flex-direction:column;gap:20px;padding:4px 0 0}
.wc-check{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;align-items:start}
.wc-check>.wc-ic{margin-top:2px;color:var(--wc-ink3)}
.wc-check[data-o="pass"]>.wc-ic{color:var(--wc-g2)}
.wc-check[data-o="partial"]>.wc-ic,.wc-check[data-o="fail"]>.wc-ic{color:var(--wc-g1)}
.wc-check-b{min-width:0}
.wc-check-t{margin:0;font-size:14px;color:var(--wc-ink0);display:flex;flex-wrap:wrap;align-items:baseline;gap:10px}
.wc-check-o{font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--wc-ink2)}
.wc-check-w{font-size:10.5px;color:var(--wc-ink3);font-variant-numeric:tabular-nums}
.wc-check-d{margin:5px 0 0;font-size:12.5px;line-height:1.6;color:var(--wc-ink1);max-width:66ch}
.wc-check-ev{margin:9px 0 0;padding:0 0 0 12px;border-left:1px solid var(--wc-hair);list-style:none;display:flex;flex-direction:column;gap:3px}
.wc-check-ev li{font-size:11.5px;line-height:1.55;color:var(--wc-ink2);overflow-wrap:anywhere}
.wc-check-ev b{color:var(--wc-ink3);font-weight:400}
.wc-check-rec{margin:9px 0 0;font-size:12.5px;line-height:1.6;color:var(--wc-ink0);max-width:66ch}
.wc-check-rec b{color:var(--wc-g1);font-weight:400}

/* ============ priority + strength ============ */
.wc-cards2{display:flex;flex-direction:column}
.wc-ecard{background:transparent!important;border:0!important;border-radius:0!important;margin:0!important;padding:0 0 26px 20px!important;position:relative;display:flex;flex-direction:column;gap:9px}
.wc-ecard:last-child{padding-bottom:0!important}
.wc-ecard::before{content:"";position:absolute;left:0;top:7px;bottom:26px;width:2px;background:var(--wc-g1);border-radius:2px}
.wc-ecard:last-child::before{bottom:0}
.wc-ecard[data-kind="strength"]{padding-left:20px!important;padding-bottom:20px!important}
.wc-ecard[data-kind="strength"]::before{background:var(--wc-g3)}
.wc-ecard-t{margin:0;font-size:15.5px;color:var(--wc-ink0);font-family:"Instrument Sans",system-ui,sans-serif;font-weight:500;display:block}
.wc-ecard-t::before{display:none!important}
.wc-ecard[data-kind="strength"] .wc-ecard-t{font-size:14px;font-weight:400;color:var(--wc-ink1)}
.wc-ecard-p{margin:0;font-size:13.5px;line-height:1.65;color:var(--wc-ink1);max-width:64ch}
.wc-ecard-meta{margin:0;font-size:12px;line-height:1.6;color:var(--wc-ink2);max-width:64ch;overflow-wrap:anywhere}
.wc-ecard-meta b{color:var(--wc-ink3);font-weight:400}
.wc-ecard-next{margin:3px 0 0;font-size:13.5px;line-height:1.65;color:var(--wc-ink0);max-width:64ch}
.wc-ecard-next b{color:var(--wc-g1);font-weight:400}
.wc-ecard[data-kind="strength"] .wc-ecard-p{font-size:12.5px;color:var(--wc-ink2)}

/* ============ brand message ============ */
.wc-snapshot{background:transparent!important;border:0!important;border-radius:0!important;padding:0!important}
.wc-bm{display:flex;flex-direction:column}
.wc-bm-row{display:grid;grid-template-columns:minmax(0,4fr) minmax(0,8fr);gap:8px clamp(24px,3vw,48px);padding:20px 0;border-top:1px solid var(--wc-hair2)}
.wc-bm-row:first-child{border-top:0;padding-top:0}
.wc-bm-k{font-size:12.5px;color:var(--wc-ink2);min-width:0;display:flex;align-items:flex-start;gap:9px}
.wc-bm-k .wc-ic-s{margin-top:2px;color:var(--wc-ink3)}
.wc-bm-v{min-width:0}
.wc-bm-val{margin:0;font-size:14.5px;line-height:1.65;color:var(--wc-ink0);max-width:62ch}
.wc-bm-val.none{color:var(--wc-ink2)}
.wc-bm-st{margin:8px 0 0;display:inline-flex;align-items:center;gap:7px;font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--wc-ink2)}
.wc-bm-st[data-s="clear"]{color:var(--wc-g2)}
.wc-bm-st[data-s="unclear"]{color:var(--wc-g1)}
.wc-bm-ex{margin:12px 0 0;padding:0 0 0 14px;border-left:2px solid rgba(61,255,61,.25);font-size:13px;line-height:1.7;color:var(--wc-ink1);font-style:italic;max-width:62ch}
.wc-bm-src{display:block;margin:7px 0 0;font-size:11.5px;color:var(--wc-ink3);overflow-wrap:anywhere;font-style:normal}
.wc-bm-src a{color:var(--wc-ink2);text-decoration:underline;text-underline-offset:2px}
.wc-bm-src a:hover{color:var(--wc-g1)}
.wc-bm-notes{margin:24px 0 0;padding:20px 0 0;border-top:1px solid var(--wc-hair2);display:flex;flex-direction:column;gap:9px}
.wc-bm-note{margin:0;font-size:12px;line-height:1.65;color:var(--wc-ink3);max-width:76ch}
@media(max-width:700px){.wc-bm-row{grid-template-columns:minmax(0,1fr);gap:6px}}

/* ============ search + AI readiness ============ */
.wc-ai-legend{display:flex;flex-wrap:wrap;gap:8px 10px;margin:0 0 26px}
.wc-ai-legend span{display:inline-flex;align-items:center;gap:7px;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--wc-ink3);border:1px solid var(--wc-hair2);border-radius:999px;padding:5px 12px}
.wc-ai-legend .wc-key{width:7px;height:7px;border-radius:50%;flex:none;background:var(--wc-ink3)}
.wc-ai-legend .v .wc-key{background:var(--wc-g2)}
.wc-ai-legend .d .wc-key{background:var(--wc-g1)}
.wc-ai-grp{margin:0 0 28px}
.wc-ai-grp:last-child{margin-bottom:0}
.wc-ai-gh{margin:0 0 12px;display:flex;align-items:center;gap:9px;font-size:10.5px;letter-spacing:.1em;text-transform:uppercase;color:var(--wc-ink3)}
.wc-ai-gh .wc-ic-s{color:var(--wc-ink3)}
.wc-ai-item{display:grid;grid-template-columns:auto minmax(0,1fr);gap:12px;padding:15px 0;border-top:1px solid var(--wc-hair2)}
.wc-ai-grp .wc-ai-item:first-of-type{border-top:0;padding-top:0}
.wc-ai-item>.wc-ic-s{margin-top:3px;color:var(--wc-ink3)}
.wc-ai-item[data-s="ok"]>.wc-ic-s{color:var(--wc-g2)}
.wc-ai-item[data-s="warn"]>.wc-ic-s{color:var(--wc-g1)}
.wc-ai-b{min-width:0}
.wc-ai-t{margin:0;font-size:14px;color:var(--wc-ink0);display:flex;flex-wrap:wrap;align-items:baseline;gap:9px}
.wc-ai-st{font-size:12.5px;color:var(--wc-ink1)}
.wc-ai-kind{font-size:9.5px;letter-spacing:.09em;text-transform:uppercase;border:1px solid var(--wc-hair2);border-radius:999px;padding:3px 9px;color:var(--wc-ink3);white-space:nowrap}
.wc-ai-kind[data-k="verified"]{border-color:rgba(31,201,87,.4);color:var(--wc-g2)}
.wc-ai-kind[data-k="declared"]{border-color:rgba(61,255,61,.32);color:var(--wc-g1)}
.wc-ai-d{margin:5px 0 0;font-size:12.5px;line-height:1.6;color:var(--wc-ink1);max-width:68ch}
.wc-ai-ev{margin:7px 0 0;font-size:11.5px;line-height:1.55;color:var(--wc-ink2);overflow-wrap:anywhere}
.wc-ai-sc{margin:6px 0 0;font-size:11px;color:var(--wc-ink3)}
.wc-ai-ag{margin:10px 0 0;display:flex;flex-wrap:wrap;gap:6px}
.wc-ai-ag span{font-size:11px;color:var(--wc-ink2);border:1px solid var(--wc-hair2);border-radius:4px;padding:4px 9px;display:inline-flex;gap:6px}
.wc-ai-ag span[data-a="Blocked"]{color:var(--wc-ink0);border-color:rgba(244,244,240,.22)}
.wc-ai-ag b{font-weight:400;color:var(--wc-ink3)}

/* ============ evidence, pages, gaps ============ */
.wc-covmap{display:flex;flex-direction:column;list-style:none;margin:0;padding:0}
.wc-covrow{display:flex;justify-content:space-between;align-items:baseline;gap:18px;padding:11px 0;border-bottom:1px solid var(--wc-hair2);font-size:12.5px}
.wc-covmap>:last-child{border-bottom:0}
.wc-covurl{color:var(--wc-ink1);overflow-wrap:anywhere;min-width:0}
/* The status carries the page title, which has no bounded length, so it must be allowed to shrink
   and wrap. flex:none sized it to max-content and pushed it past the viewport on narrow screens. */
.wc-covstatus{flex:0 1 auto;min-width:0;color:var(--wc-ink3);font-size:11.5px;text-align:right;overflow-wrap:anywhere}
.wc-covrow[data-ok="0"] .wc-covstatus{color:var(--wc-ink0)}
@media(max-width:539px){.wc-covrow{flex-direction:column;align-items:stretch;gap:4px}.wc-covstatus{text-align:left}}
.wc-gaps{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:9px}
.wc-gaps li{font-size:12px;line-height:1.6;color:var(--wc-ink2);padding-left:14px;position:relative}
.wc-gaps li::before{content:"";position:absolute;left:0;top:9px;width:7px;height:1px;background:var(--wc-ink3)}
[data-wc-meta]{font-size:11.5px;line-height:1.6;color:var(--wc-ink3);word-break:break-word}

/* ============ folds ============ */
details.wc-fold{border-top:1px solid var(--wc-hair2);margin:0}
details.wc-fold:first-of-type{border-top:0}
.wc-cat details.wc-fold{border-top:0;margin-top:14px}
details.wc-fold>summary{list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 0;min-height:44px;font-size:13px;color:var(--wc-ink2);transition:color .22s ease}
.wc-cat details.wc-fold>summary{padding:10px 0}
details.wc-fold>summary::-webkit-details-marker{display:none}
details.wc-fold>summary::after{content:"";width:9px;height:9px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:rotate(45deg) translateY(-2px);flex:none;transition:transform .22s ease}
details.wc-fold[open]>summary::after{transform:rotate(-135deg) translateY(-2px)}
details.wc-fold>summary:hover{color:var(--wc-ink0)}
details.wc-fold>.wc-fold-body{padding:0 0 20px}

/* ============ actions + gate ============ */
.wc-actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.wc-gate{background:transparent!important;border:0!important}
#wc-results a:focus-visible,#wc-results button:focus-visible,#wc-results input:focus-visible,#wc-results summary:focus-visible,[data-wc-retry]:focus-visible,[data-wc-hero-cta]:focus-visible{outline:2px solid var(--wc-g1);outline-offset:3px;border-radius:3px}

/* ============ print ============ */

/* ============ plain-English pass: one icon set, one order, one voice ============ */
:root{--wc-mk-brick:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3.5' y='5' width='17' height='14' rx='1.5'/%3E%3Cpath d='M3.5 9.67h17M3.5 14.33h17M12 5v4.67M7.5 9.67v4.66M16.5 9.67v4.66M12 14.33V19'/%3E%3C/svg%3E");--wc-mk-globe:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='8'/%3E%3Cpath d='M4 12h16M12 4c2.5 2.4 2.5 13.2 0 16M12 4c-2.5 2.4-2.5 13.2 0 16'/%3E%3C/svg%3E");--wc-mk-struct:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='4' width='16' height='16' rx='2'/%3E%3Cpath d='M4 9h16M8 13h8M8 16.5h5'/%3E%3C/svg%3E");--wc-mk-biz:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 20V8l8-4 8 4v12'/%3E%3Cpath d='M9.5 20v-5h5v5'/%3E%3Cpath d='M3 20h18'/%3E%3C/svg%3E");--wc-mk-chat:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 5h14v10H9l-4 4z'/%3E%3Cpath d='M9 9h6M9 12h4'/%3E%3C/svg%3E");--wc-mk-prio:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M12 4v10'/%3E%3Cpath d='M7.5 8.5 12 4l4.5 4.5'/%3E%3Ccircle cx='12' cy='18.5' r='.6'/%3E%3C/svg%3E");}

/* "Website foundations" mark. The old three-block stack read as something else entirely; a brick
   wall says foundations. The page head already masks these two elements with the old mark, so this
   needs !important to replace it. */
.wc-hp-label .wc-ic,.wc-sec:has([data-wc-cats]) .wc-sec-h .wc-ic{-webkit-mask:var(--wc-mk-brick) no-repeat center/contain!important;mask:var(--wc-mk-brick) no-repeat center/contain!important}

/* Key numbers are the technical proof behind the score, not the first thing a visitor needs.
   They move to the end of the analysis, just above the raw evidence. order only reorders what is
   painted, so reading order for keyboard and screen-reader users follows the source. The category
   section leads now, so it takes the first-section treatment. */
[data-wc-panel] .wc-sec:has(.wc-kf){order:1}
[data-wc-panel] .wc-sec:has(.wc-gaps){order:2}
[data-wc-panel] .wc-gate.wc-sec,[data-wc-panel] .wc-actions-sec{order:3}
.wc-sec:has([data-wc-cats]){border-top:0!important;padding-top:0!important}
.wc-check-w{display:none}

/* limit countdown, written by enhance.js under the message */
.wc-hp-count{margin:16px 0 22px;padding:11px 14px;border:1px solid var(--wc-hair);border-radius:8px;background:rgba(61,255,61,.05);font-size:13.5px;line-height:1.5;color:var(--wc-ink0);display:flex;gap:10px;align-items:flex-start}
.wc-hp-count::before{content:"";flex:none;width:8px;height:8px;margin-top:.5em;border-radius:50%;background:var(--wc-g1)}

/* ---------- example report in the hero ---------- */
/* the three plain names each need a line saying what they mean, so the row becomes name, score,
   explainer, bar rather than name, score, bar */
.wc-xr-i{grid-row:1;grid-column:1}
.wc-xr-cn{grid-row:1;grid-column:2}
.wc-xr-cs{grid-row:1;grid-column:3}
/* the explainer is the only paragraph inside a row. It is targeted structurally because the
   Webflow builder that inserted it could not attach a new class name to it. */
.wc-xr-cat>p{grid-row:2;grid-column:2/-1;margin:0;font-size:12px;line-height:1.5;color:var(--wc-ink2)}
.wc-xr-seg{grid-row:3}
.wc-xr-cn{font-size:14px}
.wc-xr-i>*{display:none}
.wc-xr-i{stroke:none;background:var(--wc-g1);width:22px;height:22px;-webkit-mask:var(--wc-mk-globe) no-repeat center/contain;mask:var(--wc-mk-globe) no-repeat center/contain}
.wc-xr-cat:nth-child(2) .wc-xr-i{-webkit-mask-image:var(--wc-mk-struct);mask-image:var(--wc-mk-struct)}
.wc-xr-cat:nth-child(3) .wc-xr-i{-webkit-mask-image:var(--wc-mk-biz);mask-image:var(--wc-mk-biz)}
/* "Next" becomes a labelled priority fix, with the same mark as the Priority fixes section */
.wc-xr-nx{display:flex;align-items:center;gap:6px;margin:0 0 4px;font-weight:500;color:var(--wc-g1);white-space:nowrap}
.wc-xr-nx::before{content:"";width:15px;height:15px;background:currentColor;-webkit-mask:var(--wc-mk-prio) no-repeat center/contain;mask:var(--wc-mk-prio) no-repeat center/contain}

/* ---------- how it works ---------- */
/* An icon per column, the same ones the report itself uses, and headings large enough to scan.
   The old short green dash becomes the icon holder. */
#wc-method .wc-li{padding-top:28px;max-width:none}
#wc-method .wc-dash{position:static;display:block;width:34px;height:34px;margin:0 0 20px;background:var(--wc-g1);-webkit-mask:var(--wc-mk-brick) no-repeat center/contain;mask:var(--wc-mk-brick) no-repeat center/contain}
#wc-method .wc-li:nth-child(2) .wc-dash{-webkit-mask-image:var(--wc-mk-chat);mask-image:var(--wc-mk-chat)}
#wc-method .wc-li:nth-child(3) .wc-dash{-webkit-mask-image:var(--wc-mk-prio);mask-image:var(--wc-mk-prio)}
#wc-method .wc-li-h,#wc-method .wc-li>div:first-of-type{font-family:var(--wc-serif);font-style:italic;font-weight:200;font-size:clamp(28px,2.7vw,36px);line-height:1.08;letter-spacing:-.01em;color:var(--wc-ink0);margin:0 0 14px}
#wc-method .wc-li{font-size:16px;line-height:1.6;color:var(--wc-ink1)}
/* the limitation is a real answer to "what can't this do", so it reads as one, not as small print */
#wc-method .wc-body{max-width:64ch;padding:18px 22px;border:0;border-left:2px solid var(--wc-g2);background:rgba(61,255,61,.04);font-size:15px;line-height:1.65;color:var(--wc-ink1)}

/* ---------- Brand + Website Clarity Review card ---------- */
/* The icon stacked above the title made row one about 160px tall while the description beside it
   was 70px, so a gap opened under the description. With the icon beside the title the two share a
   row height and the card reads as a block. */
#wc-review-band .wc-review-offer{display:flex!important;align-items:center;gap:18px;max-width:none!important}
#wc-review-band .wc-review-offer::before{flex:none;width:46px!important;height:46px!important;margin:0!important}
#wc-review-band .wc-review-price{margin-top:clamp(14px,1.6vw,22px)!important}
/* Row one is as tall as the title, so a short description left a gap under it. Centring it against
   the title splits that gap above and below, and a tighter row gap closes the rest. */
#wc-review-band .wc-review>div:nth-child(2){row-gap:22px!important}
#wc-review-band .wc-review-desc{align-self:center}

/* The call to action above the card. It is inserted as a plain h2 directly inside the band because
   the Webflow builder could not attach a class to it, so it is styled by position. It shows in
   the idle page as well as the results, where the section above it only appears after a scan. */
/* Two short sentences, meant to read as two lines. 24ch suited the old single-headline text; this
   one is wider so text-wrap:balance settles on the natural "gaps. / We" break instead of a ragged
   three-line wrap. */
#wc-review-band>h2{margin:0 0 clamp(28px,3.4vw,48px);max-width:30ch;font-family:var(--wc-serif);font-style:italic;font-weight:200;font-size:clamp(34px,4.2vw,58px);line-height:1.08;letter-spacing:-.015em;color:var(--wc-ink);text-wrap:balance}
#wc-review-band .wc-review-desc{margin-bottom:22px!important}
/* the dash markers were a dull dark green; the site's own bright green, deepened just enough to
   show on beige (the pure neon is the same lightness as the card and vanishes) */
#wc-review-band .wc-review-deliverable::before{background-color:#17D24B!important;width:10px!important;height:2px!important}
/* the secondary action fills black on hover, matching the primary's weight */
#wc-review-band .wc-review-cta-secondary{transition:background-color .18s ease,color .18s ease,border-color .18s ease}
#wc-review-band .wc-review-cta-secondary:hover,#wc-review-band .wc-review-cta-secondary:focus-visible{background:#111!important;color:#F4F4F0!important;border-color:#111!important}
/* The privacy link joins the two enquiry links as a third .wc-quiet-link, pushed to the far end of
   the row so it reads as a quiet, separate item rather than a third equal option. Below 600px the
   row already wraps top-to-bottom; an auto margin there would strand it alone on its own line with
   nothing to push against, so it drops back to the normal left-aligned flow. */
#wc-review-band .wc-quiet-links>a:last-child{margin-left:auto}
@media(max-width:599px){#wc-review-band .wc-quiet-links>a:last-child{margin-left:0}}

/* ============ print / PDF ============ */
/* A printed check is a document, not a screenshot of a web page. Three things follow from that:
   the marketing around the report is dropped (it was padding the PDF out to eight pages), the
   page leads with a letterhead rather than the sales headline, and every card is kept whole
   across page turns — without the break rules a category or a finding splits down the middle.
   The nav logo is reused here because it is already dark type on a light ground. */
@page{margin:14mm 12mm}
@media print{
/* only the report itself, and the panel that identifies it */
.wc-h1,.wc-lead,.wc-eyebrow,#wc-form,.wc-scope-line,.wc-ctx,#wc-method,#wc-services,#wc-faq,#wc-tail,
#wc-review-band,.wc-gate,.wc-actions-sec,.wc-panel-meta,.wc-hp .wc-stages,.wc-hp-retry,
.wc-hp-cta,[data-wc-preview],.wc-demo-flag,#wc-status,.wc-hp-count,a[href$="/privacy"]{display:none!important}
/* .wc-panel-box wraps the hero result panel. Hiding it (as this block used to) took the score,
   the host and the verdict out of the PDF with it, which is why the printed report had no header
   at all. Flatten it instead. The marketing above is hidden by name, not by position, so a DOM
   change cannot silently take the panel with it again. */
.wc-panel-box{display:block!important;background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important}
/* #top.dd-page carries the site's near-black. Chrome drops backgrounds when printing by
   default, but anyone who ticks "Background graphics" would otherwise get black on black. */
html,body,#top,.dd-page{background:#fff!important}
body{font-size:10.5pt;line-height:1.5}
#wc-results,#wc-results *,.wc-hp,.wc-hp *{color:#111!important;background-color:transparent!important}
#wc-results{padding:0!important;margin:0!important;display:block!important}
.wc-hero-right,.wc-hp{display:block!important}

/* letterhead: logo, then the host and score the panel already carries */
.wc-hp{background:#fff!important;border:0!important;padding:0!important;margin:0 0 7mm!important}
.wc-hp::before{content:"";display:block;width:46mm;height:10.6mm;margin:0 0 7mm;background:url("https://cdn.prod.website-files.com/6a9e4e9f785d2056b5059e43/6a9e76a1fc84bdabd1ef10dc_dd-logo-nav-green.svg") left top/contain no-repeat;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.wc-hp-top{margin:0 0 4mm!important}
/* The screen gauge is a 60mm focal point; on a letterhead it only needs to carry the number. */
.wc-gauge{width:38mm!important;margin:0 0 5mm!important}
/* The score keeps its bright green through an !important rule in the page head, which is right on
   black and illegible on paper. Out-specify it rather than relying on source order. */
.wc-hp .wc-gauge .wc-hp-num{color:#111!important}

/* nothing splits across a page turn, and a heading never ends one */
.wc-sec{padding:6mm 0!important;border-top:.4pt solid #cfcfcf!important}
.wc-sec:has([data-wc-cats]){border-top:0!important;padding-top:0!important}
.wc-sec-h,.wc-h2,.wc-h3,.wc-sec-sub{break-after:avoid;page-break-after:avoid}
.wc-cat,.wc-kf-item,.wc-ai-item,.wc-bm-row,.wc-covrow,.wc-ecard,details.wc-fold,.wc-check-row{break-inside:avoid;page-break-inside:avoid}

/* everything collapsed on screen is open on paper: a PDF cannot be expanded */
details.wc-fold>.wc-fold-body,.wc-kf-def>p{display:block!important}
details.wc-fold>summary::after,.wc-kf-def>summary::before{content:""!important;border:0!important}
details.wc-fold[hidden],[hidden]{display:none!important}

/* ink-on-paper equivalents of the screen accents; bars need exact adjust or they print blank */
.wc-ring-track{stroke:#ddd!important}
.wc-ring-arc{stroke:#111!important;animation:none!important}
.wc-ecard::before{background:#111!important}
.wc-kf-rail,.wc-segs{background:#e6e6e6!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.wc-kf-rail>i,.wc-segs>i{background:#111!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
.wc-sec,details.wc-fold,.wc-cat,.wc-ai-item,.wc-bm-row,.wc-kf-item,.wc-covrow{border-color:#ddd!important}
a{text-decoration:none}
}