/* Ideate landing pages. Lives at wp-content/uploads/brand/ideate-landing.css on the site, never in the theme.
   Styles the "Landing" page template and the lp-* block family (hero, reasons, steps, form, results, split,
   call to action, people, articles). Ported from design-reference/ideate-consultancy-page.html.

   Every class is prefixed lp- and every rule is scoped to .lp (a block), .lp-band (its Section) or .lp-page
   (the template body), so nothing here reaches the rest of the site and the blocks look the same in the editor.
   Light and dark: the tokens below switch on prefers-color-scheme, or on data-theme="dark" / "light" on <html>. */

.lp,.lp-band,.lp-page{
  --bg:#FBFBF8; --fg:#0E0E0D; --muted:#555550; --dim:#9A9A90;
  --card:#FFFFFF; --line:#E4E4DE; --panel:#F3F3EE;
  --accent:#C8F135; --accent-ink:#0E0E0D; --accent-dark:#9BBD1F; --pulse:#9BBD1F;
  --ink:#0E0E0D; --ink-fg:#FBFBF8; --ink-muted:#B6B6B1; --ink-line:#2C2C2A;
  --lime-tint:#EEF9CF; --lime-ink:#2C340A;
  --r-lg:22px; --r-md:14px; --r-sm:10px; --r-pill:999px;
  --maxw:1150px;
  --sans:"DM Sans",system-ui,-apple-system,sans-serif;
  --display:"Poppins",system-ui,-apple-system,sans-serif;
  --shadow:0 18px 44px -26px rgba(14,14,13,.4);
}
/* dark only on landing pages, where the page itself turns dark: a block on an ordinary page stays light, or its light
   text would sit on the old theme's white (Codex, 26 Oct 2026). */
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .lp-page,:root:not([data-theme="light"]) .lp-page .lp,:root:not([data-theme="light"]) .lp-page .lp-band{
    --bg:#0E0E0D; --fg:#F3F3EE; --muted:#B6B6B1; --dim:#8A8A82;
    --card:#171615; --line:#2A2A28; --panel:#141413; --ink:#000000; --ink-fg:#F3F3EE; --ink-muted:#B6B6B1; --ink-line:#2C2C2A;
    --lime-tint:#20250C; --pulse:#C8F135; --lime-ink:#E8FBA2; color-scheme:dark; --shadow:0 18px 44px -26px rgba(0,0,0,.7);
  }
}
:root[data-theme="dark"] .lp-page,:root[data-theme="dark"] .lp-page .lp,:root[data-theme="dark"] .lp-page .lp-band{
  --bg:#0E0E0D; --fg:#F3F3EE; --muted:#B6B6B1; --dim:#8A8A82;
  --card:#171615; --line:#2A2A28; --panel:#141413; --ink:#000000; --ink-fg:#F3F3EE; --ink-muted:#B6B6B1; --ink-line:#2C2C2A;
  --lime-tint:#20250C; --pulse:#C8F135; --lime-ink:#E8FBA2; color-scheme:dark; --shadow:0 18px 44px -26px rgba(0,0,0,.7);
}

/* ---------- the page and its bands */
body.lp-page{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.lp-band{color:var(--fg)}
.lp-band.lp-on-panel{background:var(--panel)}
.lp-band.lp-on-ink{background:var(--ink);color:var(--ink-fg)}
.lp-skip{position:absolute;left:-9999px;top:0;z-index:100;background:var(--accent);color:var(--accent-ink);padding:10px 16px;font-weight:700;border-radius:0 0 var(--r-sm) 0}
.lp-skip:focus{left:0}

/* ---------- shared pieces */
.lp{font-family:var(--sans);font-size:17px;line-height:1.62;-webkit-font-smoothing:antialiased;text-align:left}
.lp,.lp *,.lp-bar,.lp-bar *,.lp-footer,.lp-footer *{box-sizing:border-box}
.lp :is(h1,h2,h3,h4),.lp-footer h4{font-family:var(--display);font-weight:700;line-height:1.1;margin:0;letter-spacing:-.02em;text-wrap:balance;color:inherit}
.lp h1{font-size:clamp(31px,4.3vw,50px);font-weight:800}
.lp h2{font-size:clamp(25px,3.4vw,38px)}
.lp h3{font-size:clamp(18px,2vw,21px)}
.lp p{margin:0}
.lp a,.lp-footer a{color:inherit}
.lp img{max-width:100%;display:block;height:auto}
.lp-wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(16px,5vw,42px)}
.lp .lp-lead{font-size:clamp(17px,1.7vw,20px);color:var(--muted);line-height:1.55}
.lp-on-ink .lp .lp-lead{color:var(--ink-muted)}
.lp-sec-head{max-width:46ch;margin-bottom:clamp(26px,4vw,46px)}
.lp-sec-head .lp-lead{margin-top:12px}

.lp-btn,.lp input[type=submit]{display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:700;font-size:16px;line-height:1.62;text-decoration:none;border-radius:var(--r-pill);padding:15px 28px;border:2px solid transparent;cursor:pointer;font-family:var(--sans);transition:transform .14s ease}
.lp-btn-primary,.lp input[type=submit]{background:var(--accent);color:var(--accent-ink) !important;box-shadow:0 5px 0 var(--accent-dark)}
.lp-btn-primary:hover,.lp input[type=submit]:hover{transform:translateY(-2px)}
.lp-btn-ghost{background:transparent;border-color:currentColor}
.lp-btn-ghost:hover{background:var(--fg);color:var(--bg) !important}
.lp-btn-sm{padding:10px 20px;font-size:15px;box-shadow:0 4px 0 var(--accent-dark)}
.lp-btn-row{display:flex;flex-wrap:wrap;gap:13px}
.lp-btn:focus-visible,.lp input:focus-visible,.lp select:focus-visible,.lp button:focus-visible,.lp-bar a:focus-visible,.lp-footer a:focus-visible{outline:3px solid var(--accent-dark);outline-offset:3px}

/* ---------- the bar */
.lp-bar{position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--line);font-family:var(--sans)}
.admin-bar .lp-bar{top:32px}
.lp-bar .lp-inner{max-width:var(--maxw);margin-inline:auto;padding:13px clamp(16px,5vw,42px);display:flex;align-items:center;justify-content:space-between;gap:18px}
.lp-logo{display:inline-flex;align-items:center;text-decoration:none;flex:none}
.lp-bar .lp-logo img{height:30px;width:auto;max-width:none;display:block}
.lp-bar .lp-logo .lp-logo-white{display:none}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]) .lp-bar .lp-logo .lp-logo-ink{display:none}
  :root:not([data-theme="light"]) .lp-bar .lp-logo .lp-logo-white{display:block}
}
:root[data-theme="dark"] .lp-bar .lp-logo .lp-logo-ink{display:none}
:root[data-theme="dark"] .lp-bar .lp-logo .lp-logo-white{display:block}
.lp-nav{display:flex;gap:26px;align-items:center}
.lp-nav a{text-decoration:none;font-weight:600;font-size:15px;color:var(--muted)}
.lp-nav a:hover{color:var(--fg)}
@media (max-width:760px){.lp-nav{display:none}}
/* the phone number, as a lozenge at the end of the bar (Simon, 9 Oct 2026, in place of "Get a quote") */
.lp-phone{display:inline-flex;align-items:center;gap:8px;flex:none;background:var(--accent);color:var(--accent-ink);font-family:var(--sans);font-weight:700;font-size:15px;line-height:1.62;text-decoration:none;border-radius:var(--r-pill);padding:8px 18px;white-space:nowrap}
.lp-phone::before{content:"";width:15px;height:15px;flex:none;background:currentColor;-webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25c1.1.37 2.3.57 3.6.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.3.2 2.5.57 3.6a1 1 0 0 1-.25 1l-2.2 2.2Z'/%3E%3C/svg%3E") center/contain no-repeat;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6.6 10.8a15.1 15.1 0 0 0 6.6 6.6l2.2-2.2a1 1 0 0 1 1-.25c1.1.37 2.3.57 3.6.57a1 1 0 0 1 1 1V20a1 1 0 0 1-1 1A17 17 0 0 1 3 4a1 1 0 0 1 1-1h3.5a1 1 0 0 1 1 1c0 1.3.2 2.5.57 3.6a1 1 0 0 1-.25 1l-2.2 2.2Z'/%3E%3C/svg%3E") center/contain no-repeat}
.lp-phone:hover{background:var(--accent-dark)}

/* ---------- hero */
.lp-hero-grid{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(26px,4vw,56px);align-items:center}
@media (max-width:900px){.lp-hero-grid{grid-template-columns:1fr}}
.lp .lp-hero-label{font-weight:700;color:var(--accent-dark);font-size:15px;margin-bottom:12px}
.lp-hero h1{margin-bottom:16px}
.lp-hero .lp-lead{max-width:44ch}
.lp-hero .lp-btn-row{margin-top:24px}
.lp img.lp-hero-img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--shadow)}
.lp-trust{display:flex;flex-wrap:wrap;gap:11px;margin-top:24px;align-items:center}
.lp-badge{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:600;color:var(--fg);background:var(--card);border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 14px}
.lp-badge .lp-tick{width:15px;height:15px;border-radius:50%;background:var(--accent);flex:none}
.lp-grev{display:inline-flex;align-items:center;gap:9px;background:var(--card);border:1px solid var(--line);border-radius:var(--r-pill);padding:8px 14px;font-size:13.5px;color:var(--fg)}
.lp-grev .lp-g{font-weight:700;font-family:var(--display)}
.lp-grev .lp-stars{color:#F5B400;letter-spacing:1px}

/* ---------- reasons */
.lp-why{display:grid;grid-template-columns:1fr 1fr;gap:clamp(22px,3vw,40px) clamp(30px,5vw,64px)}
@media (max-width:760px){.lp-why{grid-template-columns:1fr;gap:26px}}
.lp-why-item{display:grid;grid-template-columns:52px 1fr;gap:16px;align-items:start}
.lp-why-ic{width:52px;height:52px;border-radius:14px;background:var(--accent);display:grid;place-items:center}
.lp-why-ic svg{width:26px;height:26px;stroke:var(--accent-ink);fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.lp-why h3{margin-bottom:6px}
.lp-why p{color:var(--muted);font-size:15.5px}
.lp-reasons .lp-btn-row{margin-top:34px}
/* The icon tiles breathe: a soft glow and the slightest swell, one tile after another in reading order, then a
   rest. Not for a visitor who has asked for less motion. */
@media (prefers-reduced-motion:no-preference){
  .lp-why-ic{animation:lp-glow 4.8s ease-in-out infinite;animation-delay:calc(var(--k,0) * .6s)}
  .lp-why-ic svg{animation:lp-swell 4.8s ease-in-out infinite;animation-delay:calc(var(--k,0) * .6s)}
  .lp-why-item:nth-child(2){--k:1}.lp-why-item:nth-child(3){--k:2}.lp-why-item:nth-child(4){--k:3}
  .lp-why-item:nth-child(5){--k:4}.lp-why-item:nth-child(6){--k:5}.lp-why-item:nth-child(7){--k:6}.lp-why-item:nth-child(8){--k:7}
}
@keyframes lp-glow{0%,56%,100%{box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 0%,transparent)}28%{box-shadow:0 0 22px 3px color-mix(in srgb,var(--accent) 55%,transparent)}}
@keyframes lp-swell{0%,56%,100%{transform:scale(1)}28%{transform:scale(1.09)}}

/* ---------- steps */
.lp-proc{max-width:800px}
.lp-pstep{display:grid;grid-template-columns:62px 1fr;gap:20px;padding-bottom:30px;position:relative}
.lp-pstep:not(:last-child)::before{content:"";position:absolute;left:30px;top:62px;bottom:-4px;width:2px;background:var(--line)}
.lp-pnum{width:62px;height:62px;border-radius:50%;background:var(--ink);color:var(--accent);font-family:var(--display);font-weight:800;font-size:22px;display:grid;place-items:center;z-index:1}
.lp-pstep h3{margin-bottom:6px}
.lp-pstep p{color:var(--muted);font-size:15.5px;max-width:60ch}
.lp-steps .lp-btn-row{margin-top:14px}
/* On a desktop the steps walk down and across the band instead of hugging the left edge. Each step is one
   fixed-width block, pushed right by an equal share of the spare width, and the line between two numbers
   turns the corner with it. --i is the step's place, --n the number of gaps; both come from the markup's
   own shape, so a page with four or six steps spreads the same way. */
.lp-pstep{--i:0}
.lp-pstep:nth-child(2){--i:1}.lp-pstep:nth-child(3){--i:2}.lp-pstep:nth-child(4){--i:3}
.lp-pstep:nth-child(5){--i:4}.lp-pstep:nth-child(6){--i:5}.lp-pstep:nth-child(7){--i:6}
@media (min-width:1025px){
  .lp-proc{max-width:none;container-type:inline-size;--n:4}
  .lp-proc:has(> .lp-pstep:nth-child(2):last-child){--n:1}
  .lp-proc:has(> .lp-pstep:nth-child(3):last-child){--n:2}
  .lp-proc:has(> .lp-pstep:nth-child(4):last-child){--n:3}
  .lp-proc:has(> .lp-pstep:nth-child(6):last-child){--n:5}
  .lp-proc:has(> .lp-pstep:nth-child(7):last-child){--n:6}
  /* walked across only when the block itself is wide enough: in a narrow Section or the editor it stays stacked (Codex, 26 Oct 2026) */
  @container (min-width:900px){
    /* two to seven steps walk across; eight or more stay stacked, as the counts above stop at seven (Codex, 26 Oct 2026) */
    .lp-proc:not(:has(> .lp-pstep:nth-child(8))) > .lp-pstep{--w:620px;--d:calc((100cqw - var(--w)) / var(--n));width:var(--w);margin-left:calc(var(--d) * var(--i))}
    .lp-proc:not(:has(> .lp-pstep:nth-child(8))) > .lp-pstep:not(:last-child)::before{width:calc(var(--d) - 30px);bottom:-32px;background:none;border:solid var(--line);border-width:0 0 2px 2px;border-bottom-left-radius:18px}
  }
}
/* A light travels the line from each number to the next, one line after another, and round again, and each
   number gives a small ring as the light reaches it. The light is a second line in the accent colour laid
   over the grey one and shown through a moving window, so it follows the corner on a desktop and runs straight
   down on a phone. The window is three times the line's size and the lit band ends two thirds of the way
   along it, so the band is just out of sight at the start, and at 26% it has just left the far end: the same
   two numbers hold for any size of line. One sweep is 1.2s of a 4.2s loop; the next line starts 0.8s later,
   which is when the head arrives. Nothing is drawn for a visitor who has asked for less motion. */
@media (prefers-reduced-motion:no-preference){
  .lp-pstep:not(:last-child)::after{content:"";position:absolute;left:29px;top:62px;bottom:-4px;width:4px;border-radius:2px;background:var(--pulse);pointer-events:none;
    -webkit-mask:linear-gradient(135deg,transparent 50.6%,#000 65%,transparent 66.6%) 100% 100%/300% 300% no-repeat;
    mask:linear-gradient(135deg,transparent 50.6%,#000 65%,transparent 66.6%) 100% 100%/300% 300% no-repeat;
    animation:lp-pulse 4.2s linear infinite;animation-delay:calc(var(--i) * .8s)}
  .lp-pstep .lp-pnum{animation:lp-ring 4.2s ease-out infinite;animation-delay:calc(var(--i) * .8s)}
  @media (min-width:1025px){
    .lp-pstep:not(:last-child)::after{width:calc(var(--d) - 29px);bottom:-33px;background:none;border:solid var(--pulse);border-width:0 0 4px 4px;border-radius:0 0 0 19px}
  }
}
@keyframes lp-pulse{0%{-webkit-mask-position:100% 100%;mask-position:100% 100%}28.6%,100%{-webkit-mask-position:26% 26%;mask-position:26% 26%}}
@keyframes lp-ring{0%{box-shadow:0 0 0 0 color-mix(in srgb,var(--pulse) 55%,transparent)}16%,100%{box-shadow:0 0 0 9px color-mix(in srgb,var(--pulse) 0%,transparent)}}

/* ---------- form, split layout (the audit) */
.lp-audit-grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(28px,4vw,56px);align-items:stretch}
.lp-audit-copy{display:flex;flex-direction:column}
.lp .lp-audit-intro{margin-top:14px;color:var(--muted);font-size:17px;line-height:1.6}
.lp-on-ink .lp .lp-audit-intro{color:var(--ink-muted)}
.lp-auditpic{flex:1 1 0;min-height:240px;position:relative;margin-top:22px;border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow)}
.lp .lp-auditpic img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;margin:0}
/* minmax(0,…): a plain 1fr never shrinks below its widest field, which pushed a 390px phone 22px sideways */
@media (max-width:860px){.lp-audit-grid{grid-template-columns:minmax(0,1fr)}.lp-auditpic{flex:none;aspect-ratio:16/10}}
.lp-formcard{background:var(--card);color:var(--fg);border-radius:var(--r-lg);padding:clamp(20px,3vw,30px);box-shadow:var(--shadow)}
.lp-formcard form{margin:0}
.lp-formcard form p{margin:0}
.lp-formcard form br{display:none}
.lp-formcard .lp-row{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media (max-width:520px){.lp-formcard .lp-row{grid-template-columns:1fr;gap:0}}
.lp-field{margin-bottom:14px}
.lp-field label{display:block;font-weight:600;font-size:13.5px;line-height:1.62;margin-bottom:6px;color:var(--fg)}
.lp-field .lp-optional{color:var(--dim);font-weight:400}
.lp-field .wpcf7-form-control-wrap{display:block}
.lp-field input,.lp-field select,.lp-field textarea{width:100%;font-family:var(--sans);font-size:15px;line-height:1.4;color:var(--fg);background:var(--bg);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:12px 13px;box-shadow:none;margin:0}
.lp-field textarea{min-height:92px;resize:vertical}
.lp-field input:focus,.lp-field select:focus,.lp-field textarea:focus{outline:none;border-color:var(--accent-dark)}
.lp-field select{-webkit-appearance:none;-moz-appearance:none;appearance:none;padding-right:40px;cursor:pointer;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 14px center;background-size:13px}
.lp-consent{font-size:13px;line-height:1.5;color:var(--muted);margin:4px 0 12px}
.lp-consent .wpcf7-list-item{margin:0;display:block}
.lp-consent label{display:flex;gap:10px;align-items:flex-start;cursor:pointer}
.lp-consent input{margin:3px 0 0;flex:none;width:auto}
.lp-consent a{text-decoration:underline}
.lp-formcard input[type=submit]{width:100%;margin-top:4px}
.lp-formcard .wpcf7-spinner{display:none}
.lp .wpcf7-not-valid-tip{font-size:12.5px;color:#C2410C;margin-top:5px;display:block}
.lp .wpcf7-response-output{margin:14px 0 0;padding:12px 14px;border:1.5px solid var(--line);border-radius:var(--r-sm);font-size:14px;color:var(--fg)}
.lp .wpcf7 form.init .wpcf7-response-output,.lp .wpcf7 form.resetting .wpcf7-response-output,.lp .wpcf7 form.submitting .wpcf7-response-output{display:none}
/* sent: the fields give way to the thank-you, as the design does */
.lp-formcard form.sent > :not(.wpcf7-response-output){display:none}
.lp-formcard form.sent .wpcf7-response-output{margin:0;border:none;padding:26px 8px;text-align:center;font-family:var(--display);font-weight:700;font-size:clamp(18px,2vw,21px);line-height:1.3}
.lp-formcard form.sent .wpcf7-response-output::before{content:"";display:block;width:56px;height:56px;border-radius:50%;margin:0 auto 16px;background:var(--accent) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%230E0E0D' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 13l4 4L19 7'/%3E%3C/svg%3E") center/28px no-repeat}

/* ---------- form, band layout (the newsletter) */
.lp-news{background:var(--ink);color:var(--ink-fg);border-radius:var(--r-lg);padding:clamp(28px,4vw,52px);display:grid;grid-template-columns:1.1fr .9fr;gap:30px;align-items:center}
@media (max-width:760px){.lp-news{grid-template-columns:1fr}}
.lp-news h2{max-width:18ch}
.lp .lp-news-intro{color:var(--ink-muted);margin-top:10px}
.lp-news form{margin:0}
.lp-news form p{display:flex;gap:10px;flex-wrap:wrap;margin:0;align-items:center}
.lp-news form br{display:none}
.lp-news .wpcf7-form-control-wrap{flex:1;min-width:200px;display:block}
.lp-news input[type=email]{width:100%;font-family:var(--sans);font-size:15px;line-height:1.4;background:#fff;color:#0E0E0D;border:none;border-radius:var(--r-pill);padding:14px 18px;margin:0}
.lp-news .wpcf7-spinner{display:none}
.lp-news .wpcf7-response-output{border-color:var(--ink-line);color:var(--ink-fg)}
.lp-news form.sent > :not(.wpcf7-response-output){display:none}
.lp-news form.sent .wpcf7-response-output{margin:0;border:none;padding:0;font-weight:600;font-size:17px}

/* ---------- results carousel */
.lp-carousel{position:relative;background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);padding:clamp(22px,3.5vw,42px);box-shadow:var(--shadow)}
.lp-viewport{overflow:hidden}
.lp-track{display:flex;transition:transform .45s cubic-bezier(.4,0,.2,1)}
.lp-slide{flex:0 0 100%;min-width:0;display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,48px);align-items:center}
@media (max-width:800px){.lp-slide{grid-template-columns:1fr}}
.lp-clogo{display:inline-flex;align-items:center;height:54px;padding:0 15px;background:#fff;border:1px solid rgba(0,0,0,.09);border-radius:12px;box-shadow:0 2px 6px rgba(0,0,0,.10);margin-bottom:18px}
.lp .lp-clogo img{width:auto;height:auto;max-height:38px;max-width:150px}
.lp-scopy h3{font-size:clamp(21px,2.8vw,28px);margin-bottom:12px}
.lp-scopy p{color:var(--muted);margin-bottom:14px;max-width:46ch}
.lp .lp-smedia img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:var(--r-md)}
.lp-cnav{display:flex;align-items:center;justify-content:space-between;margin-top:24px}
.lp-cdots{display:flex;gap:8px}
.lp-cdot{width:9px;height:9px;border-radius:50%;background:var(--line);border:none;cursor:pointer;padding:0;transition:width .2s ease}
.lp-cdot.is-active{background:var(--accent);width:22px;border-radius:5px}
.lp-carr{display:flex;gap:10px}
.lp-carr button{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--line);background:var(--card);color:var(--fg);cursor:pointer;font-size:20px;line-height:1;display:grid;place-items:center;padding:0;font-family:var(--sans)}
.lp-carr button:hover{border-color:var(--fg)}
.lp-cstats{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);margin-top:20px;max-width:500px}
.lp-cstat{border-left:3px solid var(--accent);padding:2px 0 2px 14px}
.lp-cstat-n{font-family:var(--display);font-weight:800;font-size:clamp(20px,2.5vw,27px);color:var(--fg);line-height:1}
.lp-cstat-l{font-size:11.5px;color:var(--muted);margin-top:7px;line-height:1.3}
@media (max-width:420px){.lp-cstats{grid-template-columns:1fr;gap:14px}}

/* ---------- split */
.lp-split-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(26px,4vw,54px);align-items:center}
.lp-split-grid.is-reversed{grid-template-columns:.95fr 1.05fr}
.lp-split-grid.is-reversed .lp-split-media{order:-1}
@media (max-width:860px){.lp-split-grid,.lp-split-grid.is-reversed{grid-template-columns:1fr}.lp-split-grid.is-reversed .lp-split-media{order:0}}
.lp-split .lp-lead{margin-top:14px}
.lp .lp-split-body{margin-top:16px;color:var(--muted)}
.lp-split .lp-btn-row{margin-top:22px}
.lp .lp-split-media img{width:100%;aspect-ratio:5/6;object-fit:cover;border-radius:var(--r-lg);box-shadow:var(--shadow);max-height:560px}

/* ---------- call to action band */
.lp-cta-band{background:var(--accent);color:var(--accent-ink);border-radius:var(--r-lg);padding:clamp(28px,4vw,52px);display:flex;flex-wrap:wrap;gap:20px;align-items:center;justify-content:space-between}
.lp-cta-band h2{max-width:20ch}
.lp-cta-band .lp-btn-primary{background:var(--accent-ink);color:var(--accent) !important;box-shadow:0 5px 0 #000}

/* ---------- people */
.lp-member{display:grid;grid-template-columns:minmax(0,410px) 1fr;gap:clamp(22px,4vw,48px);align-items:center;padding-block:clamp(26px,4vw,44px)}
.lp-member:first-child{padding-top:0}
.lp-member:last-child{padding-bottom:0}
.lp-member:nth-child(even){grid-template-columns:1fr minmax(0,410px)}
.lp-member:nth-child(even) .lp-mphoto{order:2}
@media (max-width:760px){.lp-member,.lp-member:nth-child(even){grid-template-columns:1fr;text-align:center}.lp-member:nth-child(even) .lp-mphoto{order:0}}
.lp-mphoto{width:100%;max-width:410px;margin-inline:auto}
.lp .lp-mphoto img{width:100%;aspect-ratio:1/1;border-radius:50%;object-fit:cover;box-shadow:var(--shadow)}
@media (max-width:760px){.lp-mphoto{max-width:300px}}
.lp .lp-member-role{color:var(--accent-dark);font-weight:700;font-size:14px;margin:4px 0 12px}
.lp .lp-member-bio{color:var(--muted);margin-bottom:18px}

/* ---------- articles */
.lp-arts{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
@media (max-width:820px){.lp-arts{grid-template-columns:1fr}}
.lp a.lp-art{background:var(--card);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;display:flex;flex-direction:column;text-decoration:none;color:var(--fg)}
.lp a.lp-art:hover{border-color:var(--fg)}
.lp-art-top{height:8px;background:var(--accent)}
.lp-art-body{padding:22px;display:flex;flex-direction:column;gap:10px;flex:1}
.lp-art-cat{font-size:12px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-dark)}
.lp-art h3{font-size:18px}
.lp .lp-art-excerpt{color:var(--muted);font-size:14.5px;flex:1}
.lp-art-rm{font-weight:700;font-size:14px;color:var(--fg)}

/* ---------- the kit's Testimonial block on a landing page: add lp-quote to its Section.
   The block paints its own background inline from a colour field; here that is cleared so the quote
   follows light and dark with the rest of the page. */
.lp-quote .testimonial{background:transparent !important;max-width:840px;margin-inline:auto;padding:0 clamp(16px,5vw,42px);text-align:center;color:var(--fg);border-radius:0;font-family:var(--sans)}
.lp-quote .testimonial blockquote{margin:0;padding:0;border:0;font-family:var(--display);font-weight:600;font-size:clamp(20px,2.7vw,28px);line-height:1.4;letter-spacing:-.01em;color:var(--fg);quotes:"\201C" "\201D"}
.lp-quote .testimonial blockquote::before{content:open-quote}
.lp-quote .testimonial blockquote::after{content:close-quote}
.lp-quote .testimonial__attr{margin-top:20px;font-size:14px;line-height:1.5;color:var(--muted)}
.lp-quote .testimonial__attr strong{display:block;font-family:var(--display);font-weight:700;font-size:17px;color:var(--fg)}

/* ---------- footer: the site footer's details, on the same dark ground, in light and dark alike */
.lp-footer{background:var(--ink);color:var(--ink-muted);padding-block:56px 36px;font-family:var(--sans);font-size:17px;line-height:1.62}
.lp-fgrid{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:28px}
@media (max-width:760px){.lp-fgrid{grid-template-columns:1fr 1fr;row-gap:34px}}
.lp-footer h4{font-size:13px;text-transform:uppercase;letter-spacing:.08em;color:var(--ink-fg);margin:0 0 14px;font-family:var(--sans);font-weight:700}
.lp-footer .lp-fgrid a,.lp-footer .lp-fline{display:block;text-decoration:none;color:var(--ink-muted);font-size:14.5px;line-height:1.5;margin:0 0 6px}
.lp-footer .lp-fgrid a:hover{color:var(--ink-fg)}
.lp-footer .lp-fgrid a.lp-logo{display:inline-block;margin:0 0 18px}
.lp-footer .lp-logo img{height:35px;width:auto;max-width:none;display:block}
.lp-footer .lp-fgrid a.lp-femail{color:var(--ink-fg);font-weight:600}
.lp-footer .lp-fgrid a.lp-fsocial{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:50%;border:1.5px solid var(--ink-line);color:var(--ink-fg);margin:12px 0 0}
.lp-footer .lp-fgrid a.lp-fsocial:hover{border-color:var(--ink-fg)}
.lp-fbar{border-top:1px solid var(--ink-line);margin-top:34px;padding-top:20px;font-size:13px;color:var(--ink-muted)}
.lp-fbar a{color:inherit;text-decoration:none}
.lp-fbar a:hover{color:var(--ink-fg);text-decoration:underline}

/* ---------- answering the legacy theme. Its stylesheet still loads on a landing page: it boxes every Section
   at 1200px and styles every Contact Form 7 form for the old site. Each selector below is one step more
   specific than the rule it answers, so the order the two files load in does not matter. */
.lp-page .wp-block-kadence-column.lp-band,.editor-styles-wrapper .wp-block-kadence-column.lp-band{max-width:none;width:100%;margin:0}
.lp-band > .kt-inside-inner-col{width:100%}
/* The site also prints inline rules with !important, from the Customizer's Additional CSS and a small plugin
   (read from the live page, 9 October 2026; a local copy of the page does not carry them):
     body {background}, main {background: white}, h1 to h6 {font, weight 700, letter-spacing, colour near-black}, h1 {tighter}.
   Left alone they paint the page white in dark mode under light text, and black out headings on the dark bands.
   Each answer below is !important too and one step more specific. */
body.lp-page{background:var(--bg) !important}
body.lp-page #main{background:transparent !important}
html:has(> body.lp-page){background:#FBFBF8}
@media (prefers-color-scheme:dark){html:not([data-theme="light"]):has(> body.lp-page){background:#0E0E0D}}
html[data-theme="dark"]:has(> body.lp-page){background:#0E0E0D}
.lp :is(h1,h2,h3,h4,h5,h6){color:inherit !important}
.lp h1{font-weight:800 !important;letter-spacing:-.02em !important;line-height:1.1 !important}
.lp-footer h4{color:var(--ink-fg) !important;font-family:var(--sans) !important;letter-spacing:.08em !important}
.lp .wpcf7-form p{color:inherit;margin:0}
/* :not(.sent): once a form is sent, the hiding rules for .sent above must win (Codex, 26 Oct 2026) */
.lp .wpcf7-form:not(.sent) > p:first-of-type{display:block;margin:0}
.lp .wpcf7-form > p > label{font-size:inherit;line-height:inherit}
.lp .lp-field .wpcf7-form-control-wrap input,.lp .lp-field .wpcf7-form-control-wrap select,.lp .lp-field .wpcf7-form-control-wrap textarea{color:var(--fg);background-color:var(--bg);border:1.5px solid var(--line);border-radius:var(--r-sm);padding:12px 13px;font-size:15px;font-weight:400;line-height:1.4}
.lp .lp-field .wpcf7-form-control-wrap select{padding-right:40px;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='14' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");background-position:right 14px center;background-size:13px}
.lp .lp-field .wpcf7-form-control-wrap input:focus,.lp .lp-field .wpcf7-form-control-wrap select:focus,.lp .lp-field .wpcf7-form-control-wrap textarea:focus{border-color:var(--accent-dark)}
.lp .wpcf7-form-control-wrap input::placeholder,.lp .wpcf7-form-control-wrap textarea::placeholder{color:var(--dim);font-weight:400;opacity:1}
.lp .wpcf7-acceptance input[type=checkbox]{-webkit-appearance:auto;-moz-appearance:auto;appearance:auto;display:inline-block;width:16px;height:16px;border-radius:3px;margin:3px 0 0;flex:none;accent-color:var(--accent-dark)}
.lp .wpcf7-acceptance input[type=checkbox]::before{content:none}
.lp .wpcf7-acceptance .wpcf7-list-item > label{display:flex;align-items:flex-start;gap:10px}
.lp .wpcf7-acceptance .wpcf7-list-item-label{color:var(--muted);font-size:13px;font-weight:400;line-height:1.5}
.lp .wpcf7-acceptance .wpcf7-list-item-label a{font-style:normal;font-weight:600;text-decoration:underline}
.lp .wpcf7 input.wpcf7-submit{background-color:var(--accent);border:2px solid transparent;border-radius:var(--r-pill);width:auto;margin-top:0;padding:15px 28px;font-size:16px;font-weight:700;line-height:1.62}
.lp .lp-formcard .wpcf7 input.wpcf7-submit{width:100%;margin-top:4px}
.lp .lp-news .wpcf7-form:not(.sent) > p:first-of-type{display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;align-items:center}
.lp .lp-news .wpcf7-form-control-wrap input[type=email]{background-color:#fff;color:#0E0E0D;border:none;border-radius:var(--r-pill);padding:14px 18px;font-size:15px;font-weight:400;line-height:1.4}
.lp .lp-news .wpcf7-form-control-wrap input::placeholder{color:#6b6b66}

/* ---------- inside a Section. The Section supplies the gutter on tablets and phones (28px), so the
   block does not add its own there, and the bar and footer match it to keep one left edge. */
@media (max-width:1024px){
  .lp-band .lp-wrap{padding-inline:0}
  .lp-quote .testimonial{padding-inline:0}
  .lp-bar .lp-inner,.lp-footer .lp-wrap{padding-inline:28px}
}
@media (prefers-reduced-motion:reduce){.lp *,.lp-bar *{transition:none !important}}
