/**
 * CM Figure Hero - the layout and the looks. Every colour and space is a --cm-fgh-* variable: defaults from config.php
 * (build_global_css_properties), a site's own values from its site-specific.css. Sizes are the cm-fse classes; the figure, the headline
 * and the phone number are their size class times a scale variable. Two-selector rule.
 * The section spans the page; the inner wrapper carries the width classes (the sibling blocks' width) and is the container the band
 * measures (cqi below is its width): under 950 px of it the figure stands above the words; from 950 it stands at their left in a column
 * that is a fixed share of the band (--cm-fgh-figure-share-wide). The figure never leaves its column: its size is capped at the column's
 * width divided by the figure's own width in its own size (its characters, counted by the block into --cm-fgh-figure--n1..n4, times
 * --cm-fgh-figure-glyph, plus --cm-fgh-mark-width with a mark). The inner wrapper's own padding is set on the inner wrapper, and a
 * container cannot query itself: that rule measures the torso (the page's width), so it uses 851.
 */
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero,
.wp-block-w4ya-cm-figure-hero { box-sizing: border-box; display: block; clear: both; position: relative; overflow: clip; background: var(--cm-fgh-bg); color: var(--cm-fgh-text); }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero *,
.wp-block-w4ya-cm-figure-hero * { box-sizing: border-box; }

.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__inner,
.wp-block-w4ya-cm-figure-hero .cm-fgh__inner { padding: var(--cm-fgh-pad) 0; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__inner,
.wp-block-w4ya-cm-figure-hero .cm-fgh__inner,
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__inner p,
.wp-block-w4ya-cm-figure-hero .cm-fgh__inner p { letter-spacing: normal; } /* the z width classes set a tracking on the wrapper AND on every p inside it (.zt95 p) */
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__inner :where(p, h1, h2),
.wp-block-w4ya-cm-figure-hero .cm-fgh__inner :where(p, h1, h2) { margin: 0; } /* the size classes and the theme carry margins */

.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero p.cm-fgh__kicker,
.wp-block-w4ya-cm-figure-hero p.cm-fgh__kicker { font-weight: 500; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cm-fgh-kicker); } /* p: outranks the tracking reset above */
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__frame,
.wp-block-w4ya-cm-figure-hero .cm-fgh__frame { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.6em; margin-top: 0.75em; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__frame:first-child,
.wp-block-w4ya-cm-figure-hero .cm-fgh__frame:first-child { margin-top: 0; }

/* The figure: its width in its own size is read from the count class; one line, never wider than its share of the band */
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure,
.wp-block-w4ya-cm-figure-hero .cm-fgh__figure { --cm-fgh-n: 4; --cm-fgh-m: 0; min-width: 0; color: var(--cm-fgh-figure); font-weight: var(--cm-fgh-figure-weight); line-height: 0.86; letter-spacing: -0.03em; white-space: nowrap; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure--n1,
.wp-block-w4ya-cm-figure-hero .cm-fgh__figure--n1 { --cm-fgh-n: 1; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure--n2,
.wp-block-w4ya-cm-figure-hero .cm-fgh__figure--n2 { --cm-fgh-n: 2; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure--n3,
.wp-block-w4ya-cm-figure-hero .cm-fgh__figure--n3 { --cm-fgh-n: 3; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure--marked,
.wp-block-w4ya-cm-figure-hero .cm-fgh__figure--marked { --cm-fgh-m: 1; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure-text,
.wp-block-w4ya-cm-figure-hero .cm-fgh__figure-text { display: block; font-size: min(calc(1em * var(--cm-fgh-figure-scale)), calc(var(--cm-fgh-figure-share) * 1cqi / (var(--cm-fgh-n) * var(--cm-fgh-figure-glyph) + var(--cm-fgh-m) * var(--cm-fgh-mark-width)))); }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__mark,
.wp-block-w4ya-cm-figure-hero .cm-fgh__mark { display: inline-block; position: relative; top: 0.12em; margin-left: 0.04em; font-size: calc(1em * var(--cm-fgh-mark-scale)); line-height: 1; vertical-align: top; letter-spacing: 0; }

.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__words,
.wp-block-w4ya-cm-figure-hero .cm-fgh__words { min-width: 0; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__title,
.wp-block-w4ya-cm-figure-hero .cm-fgh__title { color: var(--cm-fgh-text); font-weight: 500; line-height: 1.1; letter-spacing: 0; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__title-text,
.wp-block-w4ya-cm-figure-hero .cm-fgh__title-text { display: block; font-size: calc(1em * var(--cm-fgh-title-scale)); }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__accent,
.wp-block-w4ya-cm-figure-hero .cm-fgh__accent { display: block; margin-top: 0.22em; color: var(--cm-fgh-accent); }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__title-text > .cm-fgh__accent:first-child,
.wp-block-w4ya-cm-figure-hero .cm-fgh__title-text > .cm-fgh__accent:first-child { margin-top: 0; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__lead,
.wp-block-w4ya-cm-figure-hero .cm-fgh__lead { max-width: var(--cm-fgh-lead-max); margin-top: 1em; line-height: 1.5; color: var(--cm-fgh-lead); }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__lead:first-child,
.wp-block-w4ya-cm-figure-hero .cm-fgh__lead:first-child { margin-top: 0; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__act,
.wp-block-w4ya-cm-figure-hero .cm-fgh__act { display: flex; flex-wrap: wrap; align-items: baseline; gap: 0.75em 1.75em; margin-top: 1.75em; padding-top: 1.4em; border-top: 1px solid var(--cm-fgh-hairline); }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__act:first-child,
.wp-block-w4ya-cm-figure-hero .cm-fgh__act:first-child { margin-top: 0; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__call,
.wp-block-w4ya-cm-figure-hero .cm-fgh__call { min-width: 0; max-width: 100%; line-height: 1; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__phone,
.wp-block-w4ya-cm-figure-hero .cm-fgh__phone { display: inline-block; color: var(--cm-fgh-phone); font-weight: 700; text-decoration: none; } /* one line while it fits (--cm-fgh-phone-fit keeps a usual number fitting); a far longer one wraps at its spaces rather than leave the band */
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__number,
.wp-block-w4ya-cm-figure-hero .cm-fgh__number { display: block; font-size: min(calc(1em * var(--cm-fgh-phone-scale)), calc(100cqi / var(--cm-fgh-phone-fit))); line-height: 1; }
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__text,
.wp-block-w4ya-cm-figure-hero .cm-fgh__text { flex: 1 1 14em; min-width: 0; line-height: 1.5; color: var(--cm-fgh-lead); }

/* The canvas stand-in: a band with nothing in it (the page prints none) */
.editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__placeholder,
.wp-block-w4ya-cm-figure-hero .cm-fgh__placeholder { opacity: 0.7; border: 1px dashed currentColor; border-radius: 4px; padding: 0.3em 0.5em; }

@container (min-width: 950px) { /* the inner wrapper's own width */
    .editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__frame,
    .wp-block-w4ya-cm-figure-hero .cm-fgh__frame { grid-template-columns: calc(var(--cm-fgh-figure-share-wide) * 1cqi) minmax(0, 1fr); gap: var(--cm-fgh-gap); align-items: center; margin-top: 1.1em; }
    .editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__frame > :only-child,
    .wp-block-w4ya-cm-figure-hero .cm-fgh__frame > :only-child { grid-column: 1 / -1; }
    .editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__figure-text,
    .wp-block-w4ya-cm-figure-hero .cm-fgh__figure-text { font-size: min(calc(1em * var(--cm-fgh-figure-scale-wide)), calc(var(--cm-fgh-figure-share-wide) * 1cqi / (var(--cm-fgh-n) * var(--cm-fgh-figure-glyph) + var(--cm-fgh-m) * var(--cm-fgh-mark-width)))); }
    .editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__title-text,
    .wp-block-w4ya-cm-figure-hero .cm-fgh__title-text { font-size: calc(1em * var(--cm-fgh-title-scale-wide)); }
    .editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__number,
    .wp-block-w4ya-cm-figure-hero .cm-fgh__number { font-size: min(calc(1em * var(--cm-fgh-phone-scale-wide)), calc((100 - var(--cm-fgh-figure-share-wide)) * 1cqi / var(--cm-fgh-phone-fit))); }
}
@container (min-width: 851px) { /* measured on the torso, not the inner wrapper (see the head comment) */
    .editor-styles-wrapper .wp-block-w4ya-cm-figure-hero .cm-fgh__inner,
    .wp-block-w4ya-cm-figure-hero .cm-fgh__inner { padding: var(--cm-fgh-pad-wide) 0; }
}
