/* Limbrick Consultancy LLP — shared styles.
   Brand: #364e7f with #3d3d3d ink, taken from cdn.edcol.org/LCLLP/screen.css.
   Deliberately NOT theEducationCollective's language: that site is a navy slab
   with an orange accent because it sells a product. This one sells a person,
   so it is light, editorial and single-chroma. Do not merge the stylesheets.

   Source Sans 3 is Adobe's open-source humanist sans by the designer of
   Myriad Pro, which is the face the LC wordmark is set in. */

:root{
  --blue:#364e7f; --blue-deep:#283a5f; --blue-lift:#44619c;
  --ink:#3d3d3d; --ink-soft:#5a6472; --muted:#828d96;
  --paper:#ffffff; --wash:#f4f6fa; --sunk:#e6eaf2; --rule:#dfe4ec;
  --measure:34rem;
}
*{box-sizing:border-box}
body{margin:0;background:var(--paper);color:var(--ink);
  font-family:"Source Sans 3","Myriad Pro",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17.5px;line-height:1.62;-webkit-font-smoothing:antialiased}
h1,h2,h3{margin:0;text-wrap:balance;letter-spacing:-.015em;line-height:1.16;color:var(--blue)}
h1{font-size:clamp(2rem,4.6vw,3.2rem);font-weight:600}
h2{font-size:clamp(1.4rem,2.8vw,1.95rem);font-weight:600}
h3{font-size:1.08rem;font-weight:600}
p{margin:0}
a{color:var(--blue);text-decoration-thickness:1px;text-underline-offset:2px}
a:hover{color:var(--blue-lift)}
.wrap{max-width:1060px;margin:0 auto;padding:0 24px}
.narrow{max-width:var(--measure)}
section{padding:66px 0;border-top:1px solid var(--rule)}
.stack{display:flex;flex-direction:column;gap:18px}
:focus-visible{outline:3px solid var(--blue);outline-offset:2px}

/* Anything Claude could not verify is marked, not quietly invented. */
.tbc{background:#fff3cd;border-bottom:2px dotted var(--blue);padding:0 3px;font-weight:600;color:var(--ink)}

/* Wordmark — "LC" reversed out of a solid brand-blue square, then the name in
   a light weight. Reproduces the logo in CSS; no image asset required. */
.wordmark{display:inline-flex;align-items:center;gap:12px;text-decoration:none;white-space:nowrap}
.wordmark .lc{display:grid;place-items:center;width:2.05em;height:2.05em;background:var(--blue);
  color:#fff;font-weight:600;font-size:.82em;letter-spacing:.01em;line-height:1}
.wordmark .nm{font-weight:300;letter-spacing:-.01em;color:var(--blue);font-size:1.16em}
.wordmark .nm b{font-weight:600}

.top{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:22px 0;flex-wrap:wrap}
.nav{display:flex;gap:26px;font-size:.96rem;flex-wrap:wrap}
.nav a{color:var(--ink-soft);text-decoration:none}
.nav a:hover,.nav a[aria-current]{color:var(--blue)}

/* Hero: light, with the portrait alongside rather than a coloured slab. */
.hero{padding:16px 0 62px}
.hero .cols{display:grid;grid-template-columns:1fr 232px;gap:52px;align-items:start}
.hero .cols > *{min-width:0}
.kicker{font-size:.74rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase;
  color:var(--blue);padding-top:16px;border-top:3px solid var(--blue);display:inline-block;margin-bottom:20px}
.hero h1{max-width:22ch}
.hero .lede{font-size:1.2rem;color:var(--ink-soft);max-width:48ch;margin-top:20px;font-weight:400}
.portrait{width:232px;height:232px;object-fit:cover;object-position:50% 22%;display:block;
  background:var(--sunk);border-radius:2px}
.portrait-cap{font-size:.86rem;color:var(--muted);margin-top:10px;line-height:1.4}

.btn{display:inline-block;font-weight:600;font-size:1rem;padding:13px 26px;border-radius:2px;
  text-decoration:none;border:2px solid transparent;cursor:pointer}
.btn-a{background:var(--blue);color:#fff}
.btn-a:hover{background:var(--blue-lift);color:#fff}
.btn-b{border-color:var(--blue);color:var(--blue)}
.btn-b:hover{background:var(--wash)}
.doors{display:flex;flex-wrap:wrap;gap:14px;margin-top:32px}

/* Fact strip */
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
.facts div{padding:26px 28px 26px 0}
.facts .n{font-weight:600;font-size:1.9rem;color:var(--blue);line-height:1.05;
  font-variant-numeric:tabular-nums;letter-spacing:-.02em}
.facts .l{color:var(--ink-soft);font-size:.95rem;margin-top:8px;max-width:26ch}

/* Service list — hairline rows, no card fills. */
.svc{margin-top:38px;border-top:1px solid var(--rule)}
.svc article{padding:26px 0;border-bottom:1px solid var(--rule);
  display:grid;grid-template-columns:15rem 1fr;gap:32px;align-items:start}
.svc article > *{min-width:0}
.svc h3{color:var(--blue)}
.svc p{color:var(--ink-soft);font-size:1rem}
.svc p + p{margin-top:10px}
.svc ul{list-style:none;margin:12px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
.svc li{font-size:.86rem;color:var(--ink-soft);background:var(--wash);
  border:1px solid var(--rule);padding:4px 10px;border-radius:2px}

/* Pull-quote / honesty block */
.note{background:var(--wash);border-left:4px solid var(--blue)}
.note .inner{padding:32px 34px;display:flex;flex-direction:column;gap:14px}
.note p{color:var(--ink-soft)}

/* Separate-business band — the whole point of the brand split. */
.band{background:var(--blue-deep);color:#fff}
.band h2{color:#fff}
.band p{color:#c2cde2}
.band a{color:#fff}

.bio{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:34px;margin-top:34px}
.bio h3{margin-bottom:6px}
.bio p{color:var(--ink-soft);font-size:.99rem}

.roles{list-style:none;margin:18px 0 0;padding:0;display:flex;flex-direction:column;gap:10px}
.roles li{padding-left:22px;position:relative;color:var(--ink-soft);font-size:1rem}
.roles li::before{content:"";position:absolute;left:0;top:.6em;width:11px;height:2px;background:var(--blue)}

/* Contact */
.contact{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:30px;margin-top:32px}
.contact .k{font-size:.73rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);display:block;margin-bottom:8px}
.contact .v{font-size:1.12rem;color:var(--blue);font-weight:600}

footer{background:var(--wash);border-top:1px solid var(--rule);padding:44px 0 52px;
  font-size:.92rem;color:var(--ink-soft)}
footer .fgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:30px}
footer a{color:var(--ink-soft)}
footer a:hover{color:var(--blue)}
footer .flinks{display:flex;flex-direction:column;gap:8px}
footer .legal{margin-top:36px;padding-top:22px;border-top:1px solid var(--rule);
  color:var(--muted);font-size:.86rem;line-height:1.6}

@media (max-width:760px){
  body{font-size:17px}
  section{padding:52px 0}
  .hero .cols{grid-template-columns:1fr;gap:34px}
  .portrait{width:168px;height:168px}
  .svc article{grid-template-columns:1fr;gap:12px}
  .facts div{padding:22px 0}
  .note .inner{padding:26px 22px}
}

/* Anecdote aside — the presentation opener. Set quieter than body copy on
   purpose: it has to read as an aside, not as a claim about the practice. */
.anec{max-width:var(--measure);margin-top:38px;padding:24px 26px;
  background:var(--wash);border:1px solid var(--rule);border-radius:2px}
.anec .lab{font-size:.73rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;
  color:var(--muted);margin-bottom:12px}
.anec p{color:var(--ink-soft);font-size:.99rem}
.anec p + p{margin-top:10px}
.anec p:last-child{color:var(--blue);font-weight:600}
