/* Approved graphic homepage. Scoped to the marketing home; reading themes are independent. */
.graphic-site {
  color-scheme:light;
  --light:#fff9e9;--white:#fff;
  --teal:var(--color-offer-band);--red:var(--color-brand-display);--crimson:var(--color-action);--charcoal:var(--color-inverse-surface);
  --ink:#262626;--muted-ink:#525252;--boundary:#a0aaa6;
  --lens-tech:#168c8c;--lens-content:#e5aa3d;--lens-relationship:#d87555;--lens-ink:#111;--lens-light-ink:#fff;
  --chain-delivered:#e0e9e3;--chain-inboxed:#b5cbbd;--chain-seen:var(--teal);
  --shell:1080px;--gutter:clamp(24px,5vw,80px);
  --section-space:clamp(56px,7.8vw,112px);--section-corner:clamp(44px,6vw,88px);
  --leaf-corner:28px;--process-label-corner:6px;--panel-corner:10px;--panel-surface:var(--white);
  --prose:var(--type-marketing-prose);--summary:var(--type-summary);--support:var(--type-marketing-support);--prose-weight:var(--weight-marketing-prose);--inverse-prose-weight:var(--weight-inverse-prose);--prose-leading:var(--leading-marketing-prose);--sans:var(--font-body);--serif:var(--font-heading);
}
.graphic-site * {box-sizing:border-box}
.graphic-site {margin:0;background:var(--light);color:var(--ink);font:var(--prose-weight) var(--prose)/var(--prose-leading) var(--sans)}
.graphic-site h1, .graphic-site h2, .graphic-site h3 {font-family:var(--serif);font-variation-settings:"opsz" 24;line-height:1.25;letter-spacing:-.025em;color:inherit;text-wrap:pretty}
.graphic-site h1 {font-size:48px;font-weight:650;letter-spacing:-.035em;margin:0 0 30px}
.graphic-site h2 {font-size:36px;font-weight:650;margin:0 0 24px}
.graphic-site h3 {font-size:28px;font-weight:600;margin:0 0 20px}
.graphic-site h4 {font:700 22px/1.3 var(--sans);margin:0 0 10px}
.graphic-site p {margin:0 0 24px}
.graphic-site p:last-child {margin-bottom:0}
.graphic-site button, .graphic-site a, .graphic-site summary {-webkit-tap-highlight-color:transparent}
.graphic-site button {font-family:inherit;cursor:pointer}
.graphic-site a {color:var(--teal);text-underline-offset:5px;text-decoration-thickness:1px}
.graphic-site a:hover {text-decoration-thickness:2px}
.graphic-site a:focus-visible, .graphic-site button:focus-visible, .graphic-site summary:focus-visible {outline:3px solid var(--teal);outline-offset:5px}
.graphic-site section:focus, .graphic-site main:focus {outline:none}
.graphic-site .shell {width:min(var(--shell),calc(100% - var(--gutter)*2));margin-inline:auto}
.graphic-site .band {--surface:var(--light);--text:var(--ink);--next:var(--light);--previous:var(--light);position:relative;background:var(--next);color:var(--text)}
.graphic-site .tone-light {--surface:var(--light);--text:var(--ink)}
.graphic-site .tone-teal {--surface:var(--teal);--text:var(--white)}
.graphic-site .tone-charcoal {--surface:var(--charcoal);--text:var(--white)}
.graphic-site .tone-crimson {--surface:var(--crimson);--text:var(--white)}
.graphic-site [data-next=light] {--next:var(--light)}
.graphic-site [data-next=teal] {--next:var(--teal)}
.graphic-site [data-next=charcoal] {--next:var(--charcoal)}
.graphic-site [data-next=crimson] {--next:var(--crimson)}
.graphic-site .surface {background:var(--surface);padding-block:var(--section-space)}
.graphic-site .band:is(.tone-teal,.tone-charcoal,.tone-crimson)>.surface {font-weight:var(--inverse-prose-weight)}
.graphic-site .bend-right>.surface {border-bottom-right-radius:var(--section-corner)}
.graphic-site .bend-left>.surface {border-bottom-left-radius:var(--section-corner)}
.graphic-site [data-next=white] {--next:var(--white)}
.graphic-site .band:is(.tone-teal,.tone-charcoal,.tone-crimson) a:not(.action) {color:var(--white)}
.graphic-site .band:is(.tone-teal,.tone-charcoal,.tone-crimson) :is(a,button,summary):focus-visible {outline-color:var(--white)}
.graphic-site .band .panel :is(a,button,summary):focus-visible {outline-color:var(--teal)}
.graphic-site .band.tone-teal .focused-services__list>li a:not(.action) {color:var(--teal)}
.graphic-site .band.tone-teal .focused-services__list>li :is(a,button,summary):focus-visible {outline-color:var(--teal)}
.graphic-site .section-rule {display:block;background:var(--ink);width:48px;height:5px;margin-bottom:26px}
.graphic-site .band:is(.tone-teal,.tone-charcoal,.tone-crimson) .section-rule {background:var(--white)}
.graphic-site .band.tone-charcoal .section-rule {background:var(--red)}
.graphic-site .section-grid {display:grid;grid-template-columns:300px minmax(0,1fr);gap:88px}
.graphic-site .section-heading p {font-size:var(--summary);line-height:1.6}
.graphic-site .wide-heading {max-width:800px;margin-bottom:44px}
.graphic-site .wide-heading p {max-width:37em}
.graphic-site .prose {max-width:36em}
.graphic-site .panel {background:var(--panel-surface);color:var(--ink);border:1px solid var(--boundary);border-radius:var(--panel-corner);font-weight:var(--prose-weight)}
.graphic-site .action {display:inline-flex;align-items:center;justify-content:space-between;gap:22px;padding:14px 20px;border:0;border-radius:6px;background:var(--red);color:var(--white);text-decoration:none;font-size:var(--type-marketing-action);font-weight:700;line-height:1.4;margin-top:8px;max-width:100%;text-align:left}
.graphic-site .action:hover {text-decoration:underline;text-underline-offset:4px}
.graphic-site .action-arrow {display:inline-block;width:18px;height:18px;flex-shrink:0;vertical-align:-3px}
.graphic-site .opening {position:relative;isolation:isolate;overflow:hidden;padding-block:52px 48px}
.graphic-site .hero-shell {position:relative;z-index:1;width:min(var(--shell),calc(100% - var(--gutter)*2 - 32px));display:grid;grid-template-columns:minmax(0,3fr) minmax(100px,1fr);grid-template-areas:"reading ." "action .";gap:28px clamp(28px,4.5vw,64px);align-items:end}
.graphic-site .hero-reading {grid-area:reading;min-width:0;max-width:730px}
.graphic-site .hero-mark {position:absolute;z-index:0;top:0;right:0;width:clamp(192px,23vw,333px);pointer-events:none}
.graphic-site .home-hero-shape {width:100%;aspect-ratio:1;background:var(--red);-webkit-mask:url("../img/masthead-curve-mask.svg") center/100% 100% no-repeat;mask:url("../img/masthead-curve-mask.svg") center/100% 100% no-repeat}
.graphic-site .opening h1 {max-width:none;line-height:1.15;text-wrap:balance}
.graphic-site .hero-copy {max-width:none}
.graphic-site .hero-copy p {font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .hero-copy p+p {margin-top:-4px}
.graphic-site .hero-action {grid-area:action;margin-top:0}
.graphic-site .hero-action .action {margin-top:0}
.graphic-site .email-chain {list-style:none;margin:24px 0 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.graphic-site .email-chain li {position:relative;min-width:0;border:1px solid transparent;padding:20px 20px 22px 28px;background:var(--white);color:var(--ink);border-radius:var(--leaf-corner) 0 var(--leaf-corner) 0}
.graphic-site .email-chain li:nth-child(2) {background:var(--chain-delivered)}
.graphic-site .email-chain li:nth-child(3) {background:var(--chain-inboxed)}
.graphic-site .email-chain li:last-child {background:var(--chain-seen);color:var(--white);font-weight:var(--inverse-prose-weight)}
.graphic-site .email-chain h3 {font-size:23px;margin-bottom:8px}
.graphic-site .email-chain p {font-size:var(--support);line-height:1.5}
.graphic-site .trust-strip {background:var(--white);color:var(--ink);padding-block:26px}
.graphic-site .client-line {font-size:16px;line-height:1.5;text-align:center;margin:0}
.graphic-site .journey {padding-block:60px 68px}
.graphic-site .journey .wide-heading {margin-bottom:28px}
.graphic-site .journey .wide-heading p {font-size:var(--type-lede);line-height:1.55;max-width:38em}
.graphic-site .journey .email-chain {margin:0}
.graphic-site .email-chain li:first-child {border-color:var(--boundary)}
.graphic-site .symptoms {list-style:none;margin:28px 0;padding:0}
.graphic-site .symptoms li {border-top:1px solid var(--boundary);position:relative;padding:16px 0 16px 24px;font-size:var(--summary);line-height:1.6}
.graphic-site .symptoms li::before {content:"↳";position:absolute;left:0;color:var(--light)}
.graphic-site .framework {display:grid;grid-template-columns:340px minmax(0,1fr);align-items:center;gap:44px;padding:40px}
.graphic-site .venn-figure {margin:0;min-width:0}
.graphic-site .venn {display:block;width:100%;height:auto;overflow:visible}
.graphic-site .venn-circles {isolation:isolate}
.graphic-site .venn-circles circle {mix-blend-mode:multiply}
.graphic-site .venn-tech {fill:var(--lens-tech)}
.graphic-site .venn-content {fill:var(--lens-content)}
.graphic-site .venn-relationship {fill:var(--lens-relationship)}
.graphic-site .venn-labels text {font:700 33px var(--sans);text-anchor:middle;fill:var(--lens-ink)}
.graphic-site .venn-labels .label-content {font-size:31px}
.graphic-site .venn-figure figcaption {text-align:center;font-size:16px;font-weight:600;margin-top:20px}
.graphic-site .lens-list article {display:flex;align-items:flex-start;gap:20px;padding-block:24px;border-top:1px solid var(--boundary)}
.graphic-site .lens-list article:first-child {padding-top:0;border-top:0}
.graphic-site .lens-list article:last-child {padding-bottom:0}
.graphic-site .lens-list h3 {font:700 22px/1.3 var(--sans);margin-bottom:10px}
.graphic-site .lens-list p {font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .lens-symbol {display:flex;align-items:center;justify-content:center;width:40px;height:40px;flex-shrink:0;border-radius:50% 50% 0 50%;color:var(--lens-ink);font:700 23px/1 var(--serif)}
.graphic-site .lens-tech .lens-symbol {background:var(--lens-tech);color:var(--lens-light-ink)}
.graphic-site .venn-labels .label-tech, .graphic-site .venn-labels .label-relationship {fill:var(--lens-light-ink)}
.graphic-site .lens-content .lens-symbol {background:var(--lens-content);border-radius:0 50% 50% 50%}
.graphic-site .lens-relationship .lens-symbol {background:var(--lens-relationship);color:var(--lens-light-ink);border-radius:50% 0 50% 50%}
.graphic-site .lens-bridge {max-width:38em;margin:30px 0 0;font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .profiles {display:grid;grid-template-columns:1fr 1fr;gap:20px 32px}
.graphic-site .profiles article {display:grid;grid-template-rows:subgrid;grid-row:span 2;padding:28px}
.graphic-site .profiles h3, .graphic-site .profiles p {margin:0}
.graphic-site .sender-section {padding-block:76px 84px}
.graphic-site .profiles h3 {font-size:24px}
.graphic-site .profiles p {font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .process-panel {--panel-surface:var(--teal);--process-line:var(--white);color:var(--white);border-color:var(--teal);font-weight:var(--inverse-prose-weight);padding:36px 40px}
.graphic-site .process-heading {margin-bottom:34px}
.graphic-site .process-heading h3 {margin:0}
.graphic-site .framework-label {font-size:16px;font-weight:650;color:var(--red);line-height:1.5;margin:0}
.graphic-site .process-list {list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr))}
.graphic-site .process-list li {position:relative;padding:0 22px 0 0;min-width:0}
.graphic-site .process-list li:last-child {padding-right:0}
.graphic-site .process-list li::before {content:"";position:absolute;top:29px;left:0;right:0;border-top:1px solid var(--process-line)}
.graphic-site .process-list li:last-child::before {display:none}
.graphic-site .process-list h4 {position:relative;display:flex;align-items:center;justify-content:center;min-height:58px;padding:14px 12px;margin:0 0 16px;background:var(--white);color:var(--teal);border-radius:var(--process-label-corner);font-size:20px;line-height:1.4}
.graphic-site .process-list p {font-size:var(--support);line-height:1.55}
.graphic-site .process-scope {font-size:var(--support);line-height:1.55;border-top:1px solid var(--process-line);margin-top:30px;padding-top:22px;max-width:48em}
.graphic-site .testimonials {padding:4px 40px}
.graphic-site .testimonial {display:grid;grid-template-columns:250px minmax(0,1fr);gap:44px;padding:32px 0}
.graphic-site .testimonial+.testimonial {border-top:1px solid var(--boundary)}
.graphic-site .testimonial h3 {font-size:23px;margin-bottom:18px}
.graphic-site .testimonial .attribution {font-size:16px;line-height:1.5}
.graphic-site blockquote {margin:0}
.graphic-site .testimonial-body>p {font-size:var(--prose);line-height:var(--prose-leading);margin-bottom:20px}
.graphic-site blockquote p {font-family:var(--serif);font-size:20px;line-height:1.65}
.graphic-site blockquote p::before {content:"“"}
.graphic-site blockquote p::after {content:"”"}
.graphic-site .service-list {min-width:0}
.graphic-site .service-list article {border-top:1px solid var(--teal);padding-block:32px}
.graphic-site .service-list article:first-child {padding-top:0;border-top:0}
.graphic-site .band:is(.tone-teal,.tone-charcoal,.tone-crimson) .service-list article {border-color:var(--boundary)}
.graphic-site .service-list h3 {margin-bottom:18px}
.graphic-site .service-question {font-family:var(--serif);font-optical-sizing:none;font-variation-settings:"opsz" 24;font-size:18px;font-style:italic;font-weight:600;line-height:1.45;color:var(--muted-ink);margin-bottom:14px}
.graphic-site .service-list article div>p:not(.service-question) {font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .service-scope {font-size:var(--support);line-height:1.55;border-top:1px solid var(--boundary);padding-top:24px;margin-top:4px}
.graphic-site .principle {padding-block:76px 84px}
.graphic-site .principle-inner {max-width:880px}
.graphic-site .principle p {font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .closing {padding-block:76px 84px}
.graphic-site .closing-inner {display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:80px;align-items:center}
.graphic-site .closing h2 {font-size:36px}
.graphic-site .closing-action p {font-size:var(--summary);line-height:1.6;margin-top:22px}
.graphic-site .closing-action .signature {font:500 italic 30px/1.3 var(--serif);margin-top:12px}
.graphic-site .newsletter-inner {display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:80px;align-items:center}
.graphic-site .newsletter-inner p {max-width:38em;font-size:var(--prose);line-height:var(--prose-leading)}
@media(max-width:760px){.graphic-site .hero-shell {display:block}
.graphic-site .hero-mark {display:none}
.graphic-site .hero-reading {max-width:620px}}
@media(min-width:761px) and (max-width:1100px){.graphic-site .section-grid {grid-template-columns:240px minmax(0,1fr);gap:42px}
.graphic-site .hero-shell {width:min(var(--shell),calc(100% - var(--gutter)*2))}
.graphic-site .email-chain li {padding:18px 16px 18px 24px}
.graphic-site .email-chain h3 {font-size:22px}
.graphic-site .framework {grid-template-columns:260px minmax(0,1fr);gap:30px;padding:30px}
.graphic-site .lens-list article {gap:14px}
.graphic-site .lens-list p {font-size:var(--prose)}
.graphic-site .testimonial {grid-template-columns:220px minmax(0,1fr);gap:32px}
.graphic-site .closing-inner {grid-template-columns:minmax(0,1fr) 275px;gap:40px}}
@media(max-width:900px){.graphic-site .framework {grid-template-columns:1fr;gap:30px;padding:32px}
.graphic-site .venn-figure {width:min(380px,100%);margin-inline:auto}
.graphic-site .lens-list article {gap:20px}
.graphic-site .process-list {display:block;margin-left:3px}
.graphic-site .process-list li, .graphic-site .process-list li:last-child {padding:0 0 28px}
.graphic-site .process-list li:last-child {padding-bottom:0}
.graphic-site .process-list li::before {left:12px;right:auto;top:29px;bottom:-29px;border-top:0;border-left:1px solid var(--process-line)}
.graphic-site .process-list h4 {width:min(180px,100%)}
.graphic-site .process-list p {max-width:33em;padding-left:30px}}
@media(max-width:760px){.graphic-site {--gutter:24px;--section-space:52px;--section-corner:44px;--leading-marketing-prose:1.5;--panel-corner:8px}
.graphic-site h1 {font-size:34px;line-height:1.25;margin-bottom:26px}
.graphic-site h2 {font-size:30px}
.graphic-site h3 {font-size:26px}
.graphic-site h4 {font-size:22px}
.graphic-site .opening {padding-block:34px 36px}
.graphic-site .hero-shell {width:calc(100% - var(--gutter)*2)}
.graphic-site .hero-copy p {font-size:var(--prose)}
.graphic-site .hero-action {margin-top:26px}
.graphic-site .action {font-size:var(--type-marketing-action);padding:13px 16px;gap:15px}
.graphic-site .email-chain {grid-template-columns:1fr 1fr;gap:10px;margin-top:30px}
.graphic-site .email-chain li {padding:16px 14px 18px 22px;border-radius:var(--leaf-corner) 0 var(--leaf-corner) 0}
.graphic-site .email-chain h3 {font-size:22px}
.graphic-site .email-chain p {font-size:var(--support)}
.graphic-site .trust-strip {padding-block:24px}
.graphic-site .client-line {font-size:15px;text-align:left}
.graphic-site .journey {padding-block:48px 52px}
.graphic-site .journey .wide-heading p {font-size:var(--type-lede)}
.graphic-site .sender-section {padding-block:52px 60px}
.graphic-site .section-grid {display:block}
.graphic-site .section-heading {margin-bottom:28px}
.graphic-site .section-heading p {font-size:var(--summary)}
.graphic-site .section-rule {margin-bottom:24px}
.graphic-site .wide-heading {margin-bottom:32px}
.graphic-site .symptoms li {font-size:var(--summary);padding-block:14px}
.graphic-site .framework {padding:26px 22px;gap:30px}
.graphic-site .lens-list article {display:block;position:relative;padding-block:22px}
.graphic-site .lens-list .lens-symbol {position:absolute;left:0;top:22px}
.graphic-site .lens-list article:first-child .lens-symbol {top:0}
.graphic-site .lens-list h3 {min-height:34px;padding-left:50px;display:flex;align-items:center}
.graphic-site .lens-symbol {width:34px;height:34px;font-size:21px}
.graphic-site .lens-list h3 {font-size:21px}
.graphic-site .venn-labels text {font-size:33px}
.graphic-site .venn-figure figcaption {font-size:15px;margin-top:16px}
.graphic-site .lens-bridge {font-size:var(--prose);margin-bottom:30px}
.graphic-site .profiles {display:block}
.graphic-site .profiles article {display:block;padding:24px 22px}
.graphic-site .profiles h3 {margin-bottom:20px}
.graphic-site .profiles article+article {margin-top:26px}
.graphic-site .profiles h3 {font-size:23px}
.graphic-site .profiles p {font-size:var(--prose)}
.graphic-site .process-panel {padding:26px 22px}
.graphic-site .process-heading {margin-bottom:28px}
.graphic-site .process-heading h3 {font-size:24px}
.graphic-site .process-scope {font-size:var(--support)}
.graphic-site .framework-label {font-size:15px}
.graphic-site .testimonials {padding:0 22px}
.graphic-site .testimonial {display:block;padding:28px 0}
.graphic-site .testimonial h3 {font-size:23px;margin-bottom:12px}
.graphic-site .testimonial .attribution {margin-bottom:22px}
.graphic-site .testimonial-body>p {font-size:var(--prose)}
.graphic-site blockquote p {font-size:19px;line-height:1.65}
.graphic-site .service-list article {padding-block:28px}
.graphic-site .service-question {font-size:17px}
.graphic-site .service-list article div>p:not(.service-question) {font-size:var(--prose)}
.graphic-site .service-scope {font-size:var(--support)}
.graphic-site .principle {padding-block:56px 64px}
.graphic-site .principle p {font-size:var(--prose)}
.graphic-site .closing {padding-block:52px 60px}
.graphic-site .closing-inner {display:block}
.graphic-site .closing h2 {font-size:31px}
.graphic-site .closing-action {margin-top:30px}
.graphic-site .newsletter-inner {display:block}
.graphic-site .newsletter-inner p {font-size:var(--prose)}
.graphic-site .newsletter-inner .action {margin-top:0}
}
@media(max-width:360px){.graphic-site {--gutter:20px;--gutter-identity:20px}
.graphic-site h1 {font-size:30px}
.graphic-site .email-chain {grid-template-columns:1fr}
.graphic-site .email-chain li {display:block}
.graphic-site .email-chain h3 {font-size:21px;margin:0 0 8px}
.graphic-site .framework {padding:24px 16px}
.graphic-site .lens-list article {gap:12px}
.graphic-site .testimonials {padding-inline:18px}}
/* Service cards use one peer grid; the short advisory is distinguished by surface. */
.graphic-site .services-layout>.section-heading {max-width:800px;margin-bottom:44px}
.graphic-site .services-layout>.section-heading p {max-width:37em;font-size:var(--summary);line-height:1.6}
.graphic-site .service-grid {display:grid;gap:24px}
.graphic-site .service-list .service-card {padding:28px;border:1px solid var(--boundary)}
.graphic-site .service-list .service-card:first-child {padding:28px;border:1px solid var(--boundary)}
.graphic-site .service-card>div {display:flex;height:100%;flex-direction:column}
.graphic-site .service-card .action {align-self:flex-start;margin-top:auto}
.graphic-site .service-card--advisory {background:var(--color-surface-muted)}
.graphic-site .service-card :is(a,button):focus-visible {outline-color:var(--teal)}
.graphic-site .service-list .service-scope {margin:24px 0 0}
@media(min-width:761px){.graphic-site .service-grid {grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:1fr}}
.graphic-site .hero-image {max-width:100%;height:auto}
.graphic-site .trust-organizations {display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px 24px;list-style:none;padding:0;margin:8px 0 0;font-size:16px}
/* These component lists own their spacing; prose li + li margins must not offset their first item. */
.graphic-site :is(.email-chain,.process-list,.trust-organizations,.symptoms)>li {margin:0}
.graphic-site .trust-organizations img {display:block;max-width:160px;max-height:48px;width:auto;height:auto}
.graphic-site .site-footer {margin-top:0}
@media(max-width:760px){.graphic-site .services-layout>.section-heading{margin-bottom:32px}.graphic-site .service-list .service-card,.graphic-site .service-list .service-card:first-child{padding:24px 22px}.graphic-site .trust-organizations{justify-content:flex-start}}

.graphic-site .skip-link { color: var(--white); background: var(--red); }
/* The selected graphic palette stays constant under either OS theme. */
.graphic-site {
  --color-offer-band: #455e59;
  --color-inverse-surface: #3d3d3d;
  --color-action: #b30020;
  --color-action-hover: #7f0016;
  --color-on-action: #ffffff;
  --color-text: #262626;
  --color-heading: #262626;
  --color-text-muted: #525252;
  --color-surface: #fff9e9;
  --color-canvas: #fff9e9;
  --color-focus: #b30020;
  --color-boundary: #a0aaa6;
  --color-surface-muted: #f1f1f1;
  --color-inverse-text: #ffffff;
  --color-inverse-muted: #ded7d3;
}

/* Shared graphic language for interior marketing pages. */
.graphic-site .tone-white {--surface:var(--white);--text:var(--ink)}
.graphic-site .masthead__shape {background:var(--red)}
.page-contact .masthead__shape {width:clamp(160px,13vw,208px)}
.graphic-site .marketing-page__prelude {
  padding-block:30px;
  background:var(--white);
  color:var(--ink);
}
.graphic-site .marketing-page__reading,
.graphic-site .marketing-section__inner {
  width:min(var(--shell),calc(100% - var(--gutter)*2));
}
.graphic-site .marketing-page__prelude :last-child {margin-bottom:0}
.graphic-site .marketing-page__prelude hr {margin:0 0 22px;border-color:var(--boundary)}
.graphic-site .marketing-page__prelude p {
  font-family:var(--serif);
  font-size:var(--type-lede);
  line-height:1.5;
}
.graphic-site .marketing-section {padding-block:76px 84px}
.graphic-site .marketing-section__body {max-width:36em}
.graphic-site .marketing-section__body>h2:first-child {margin-bottom:26px}
.graphic-site .marketing-section__groups {max-width:36em}
.graphic-site .marketing-section__group+.marketing-section__group {
  margin-top:48px;
  padding-top:48px;
  border-top:1px solid var(--boundary);
}
.graphic-site .marketing-section__body>h3 {
  margin-top:34px;
  font-size:26px;
}
.graphic-site .marketing-section__body>h3:first-of-type {margin-top:0}
.graphic-site .marketing-section__body p,
.graphic-site .marketing-section__body li {
  font-size:var(--prose);
  line-height:var(--prose-leading);
}
.graphic-site .marketing-section__body>p+p {margin-top:20px}
.graphic-site .marketing-section__body ul {margin-bottom:0;padding-left:24px}
.graphic-site .marketing-section__body li+li {margin-top:10px}
.graphic-site .marketing-section__body hr {
  margin:34px 0;
  border-color:var(--boundary);
}
.graphic-site .tone-teal .marketing-section__body :is(h2,h3,p,li,strong,em) {color:var(--white)}
.graphic-site .tone-teal .marketing-section__body hr {border-color:var(--boundary)}
.graphic-site .marketing-section--talks .marketing-section__body {max-width:none}
.graphic-site .speaking-talks {display:grid;gap:24px;margin-top:36px}
.graphic-site .speaking-talk {padding:28px}
.graphic-site .tone-teal .marketing-section__body .speaking-talk :is(h3,p,strong,em) {color:var(--ink)}
.graphic-site .speaking-talk h3 {font-size:26px}
.graphic-site .speaking-talk p {font-size:var(--summary);line-height:1.55}
.graphic-site .speaking-talk p:last-child {margin-bottom:0}
@media(min-width:901px){.graphic-site .speaking-talks {grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr}}
.graphic-site .marketing-final {padding-block:72px 80px}
.graphic-site .marketing-final .cta-card {
  max-width:38em;
  margin:0;
  padding:0;
  color:var(--white);
  background:transparent;
  border:0;
}
.graphic-site .marketing-final .cta-card__heading {
  color:var(--white);
  font-size:32px;
}
.graphic-site .marketing-final .cta-card__text {
  color:var(--white);
  font-size:var(--prose);
  line-height:var(--prose-leading);
}
.graphic-site :is(.cta-card__button,.consultancy-action,.consultancy-offer__button,.masthead__action--primary) {
  color:var(--white);
  background:var(--red);
  border-color:var(--red);
  border-radius:6px;
  font-family:var(--sans);
  font-size:var(--type-marketing-action);
  font-weight:700;
}
.graphic-site :is(.cta-card__button,.consultancy-action,.consultancy-offer__button,.masthead__action--primary):hover {
  color:var(--white);
  background:var(--crimson);
  border-color:var(--crimson);
  text-decoration:underline;
  text-underline-offset:4px;
}
@media(max-width:760px){
  .graphic-site .marketing-section {padding-block:52px 60px}
  .graphic-site .marketing-page__prelude {padding-block:26px}
  .graphic-site .marketing-page__prelude p {font-size:var(--type-lede)}
  .graphic-site .marketing-section__body>h3 {font-size:24px}
  .graphic-site .speaking-talks {margin-top:28px}
  .graphic-site .speaking-talk {padding:24px 22px}
  .graphic-site .speaking-talk h3 {font-size:24px}
  .graphic-site .marketing-section__body p,
  .graphic-site .marketing-section__body li {font-size:var(--prose)}
  .graphic-site .marketing-final {padding-block:52px 60px}
  .graphic-site .marketing-final .cta-card__heading {font-size:27px}
}

.graphic-site .contact-page__section {padding-block:76px 84px}
.graphic-site .contact-page__inner {
  display:block;
}
.graphic-site .contact-page__context {
  max-width:46rem;
  margin-bottom:var(--space-10);
}
.graphic-site .contact-page__context h2 {margin-bottom:20px}
.graphic-site .contact-page__body {max-width:42rem}
.graphic-site .contact-page__body p {font-size:var(--prose);line-height:var(--prose-leading)}
.graphic-site .contact-form {
  width:100%;
  margin:0;
  padding:clamp(24px,4vw,40px);
  background:var(--white);
  border:1px solid var(--boundary);
  border-radius:var(--panel-corner);
}
.graphic-site .contact-form>form {max-width:48rem}
.graphic-site .contact-form__heading {margin-bottom:8px}
.graphic-site .contact-form__required,
.graphic-site .contact-form__help,
.graphic-site .contact-form__privacy,
.graphic-site .contact-form__optional {
  color:var(--muted-ink);
  font-size:var(--support);
  line-height:1.5;
}
.graphic-site .contact-form__required {margin-bottom:28px}
.graphic-site .contact-form__grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:20px;
}
.graphic-site .contact-form__field {margin:0 0 24px;padding:0;border:0}
.graphic-site .contact-form__field>label,
.graphic-site .contact-form__field>legend {
  display:block;
  margin-bottom:8px;
  color:var(--ink);
  font-weight:700;
}
.graphic-site .contact-form__field>legend {padding:0}
.graphic-site .contact-form__field> :is(input,select,textarea) {
  display:block;
  width:100%;
  min-height:48px;
  padding:11px 14px;
  color:var(--ink);
  background:var(--white);
  border:1px solid var(--boundary);
  border-radius:var(--radius-action);
  font:inherit;
  line-height:1.45;
}
.graphic-site .contact-form__field>textarea {min-height:180px;resize:vertical}
.graphic-site .contact-form__field>textarea::placeholder {color:var(--muted-ink);opacity:1}
.graphic-site .contact-form__field> :is(input,select,textarea):focus-visible,
.graphic-site .contact-form__consent input:focus-visible {
  outline:3px solid var(--teal);
  outline-offset:2px;
}
.graphic-site .contact-form__field> :is(input,select,textarea)[aria-invalid="true"] {
  border-color:var(--crimson);
  border-width:2px;
}
.graphic-site .contact-form__help {margin:8px 0 0}
.graphic-site .contact-form__choice-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:10px;
}
.graphic-site .contact-form__choice {
  display:flex;
  gap:10px;
  align-items:flex-start;
  min-height:48px;
  margin:0;
  padding:12px 14px;
  color:var(--ink);
  background:var(--white);
  border:1px solid var(--boundary);
  border-radius:var(--panel-corner);
  cursor:pointer;
  line-height:1.4;
}
.graphic-site .contact-form__choice:hover {border-color:var(--red)}
.graphic-site .contact-form__choice:has(input:checked) {
  background:var(--cream);
  border-color:var(--red);
  box-shadow:inset 0 0 0 1px var(--red);
}
.graphic-site .contact-form__choice input {
  flex:0 0 auto;
  width:20px;
  height:20px;
  margin:1px 0 0;
  accent-color:var(--red);
}
.graphic-site .contact-form__choice:has(input:focus-visible) {
  outline:3px solid var(--teal);
  outline-offset:2px;
}
.graphic-site .contact-form__choices[aria-invalid="true"] .contact-form__choice {border-color:var(--crimson)}
.graphic-site .contact-form__error {
  margin:8px 0 0;
  color:var(--crimson);
  font-size:var(--support);
  font-weight:700;
  line-height:1.5;
}
.graphic-site .contact-form__status {
  max-width:48rem;
  margin:0 0 24px;
  padding:16px 18px;
  color:var(--ink);
  background:var(--light);
  border-left:4px solid var(--crimson);
}
.graphic-site .contact-form__status p {margin:0}
.graphic-site .contact-form__consent {
  display:grid;
  grid-template-columns:auto minmax(0,1fr);
  gap:12px;
  align-items:start;
  margin:4px 0 24px;
}
.graphic-site .contact-form__consent input {
  width:22px;
  height:22px;
  margin-top:2px;
  accent-color:var(--red);
}
.graphic-site .contact-form__consent label {line-height:1.5}
.graphic-site .contact-form__submit {
  min-height:48px;
  padding:12px 24px;
  color:var(--white);
  background:var(--red);
  border:1px solid var(--red);
  border-radius:6px;
  font:700 var(--type-marketing-action)/1.4 var(--sans);
}
.graphic-site .contact-form__submit:hover {
  background:var(--crimson);
  border-color:var(--crimson);
  text-decoration:underline;
  text-underline-offset:4px;
}
.graphic-site .contact-form__privacy {max-width:44rem;margin:16px 0 0}
.graphic-site .contact-form__success {max-width:46rem}
.graphic-site .contact-form__success h2 {font-size:30px}
.graphic-site .contact-form__trap {
  position:absolute;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}
.graphic-site .consultancy-offer {padding-bottom:0}
.graphic-site ::selection {color:var(--white);background:var(--red)}

@media(max-width:760px){
  .graphic-site .contact-page__section {padding-block:52px 60px}
  .graphic-site .contact-page__context {margin-bottom:30px}
  .graphic-site .contact-page__body p {font-size:var(--prose)}
  .graphic-site .contact-form {padding:24px 18px}
  .graphic-site .contact-form__grid {grid-template-columns:1fr;gap:0}
  .graphic-site .contact-form__choice-grid {grid-template-columns:1fr}
  .graphic-site .contact-form__submit {width:100%}
}
