/* ==========================================================================
   Locus case study (Figma: "LOCUS case study (new)", 1728px wide)
   Every size is written as (Figma px) x var(--u): at 1728px wide and up it
   matches Figma 1:1, on smaller screens everything shrinks in proportion.
   max(…) keeps text readable on phones.
   Loaded after style.css + home.css (they give the header, footer and fonts).
   ========================================================================== */

@font-face {
  font-family: "Playfair Display";
  font-style: normal; font-weight: 600; font-display: swap;
  src: url("../assets/fonts/playfair-display-latin-ext-600-normal.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
  font-family: "Playfair Display";
  font-style: normal; font-weight: 600; font-display: swap;
  src: url("../assets/fonts/playfair-display-latin-600-normal.woff2") format("woff2");
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ---------- Tokens ---------- */
html body.cstudy,
html[data-theme] body.cstudy {
  --u: min(1px, calc(100vw / 1728));
  --pink: #d5277d;
  --purple: #8323ca;
  --plum: #481273;
  --rose: #eb97c0;
  --ink: #1a1a1a;
  --grey: #5e5560;
  --blush: #fce7f0;
  --blush-2: #f8d9e7;
  --tint: #fff4f8;
  --serif: "Domine", Georgia, serif;
  --display: "Chonburi", "Domine", Georgia, serif;

  /* the header + footer stay the site's dark blurred glass */
  --h-bar: rgba(29, 27, 28, .55);
  --h-bar-top: rgba(74, 40, 43, .7);
  --h-menu: #1d1b1c;
  --h-text: #f3eeee;
  --h-muted: #b8adad;
  --h-accent: #c9807b;
  --h-bg: #1d1b1c;

  background: #fff;
  color: var(--ink);
  font-family: var(--serif);
}
html.js body.cstudy { scroll-snap-type: none; }
html:has(body.cstudy) { scroll-snap-type: none !important; scroll-padding-top: 66px; }

.lc { overflow-x: clip; }
.lc p, .lc h1, .lc h2, .lc h3, .lc dl, .lc dd, .lc ul, .lc figure { margin: 0; }
.lc img { max-width: 100%; height: auto; }

/* ---------- Shared type ---------- */
.lc-kicker {
  font-family: var(--display); font-weight: 400;
  font-size: max(24px, calc(36 * var(--u)));
  line-height: 1.2; letter-spacing: .02em; text-transform: uppercase;
}
.lc-h1 {
  max-width: 78%;
  font-family: var(--display); font-weight: 400;
  font-size: max(34px, calc(64 * var(--u)));
  line-height: 1.15;
}
.lc-h1--sm { font-size: max(32px, calc(56 * var(--u))); }
.lc-phase {
  display: flex; align-items: flex-end; gap: calc(40 * var(--u));
  font-family: var(--display); font-weight: 400;
}
.lc-phase__num {
  font-size: max(84px, calc(180 * var(--u)));
  line-height: .9;
  color: rgba(213, 39, 125, .15);
}
.lc-phase__name {
  font-size: max(44px, calc(96 * var(--u)));
  line-height: 1.1; letter-spacing: .02em; text-transform: uppercase;
}
.lc-h2 {
  max-width: 71%;
  font-family: var(--display);
  font-size: max(30px, calc(52 * var(--u)));
  line-height: 1.15;
}
.lc-lead {
  max-width: 64%;
  font-size: max(17px, calc(22 * var(--u)));
  line-height: 1.6;
  color: var(--grey);
}
.lc-label {
  font-weight: 700;
  font-size: max(13px, calc(16 * var(--u)));
  line-height: 1.5; letter-spacing: .08em; text-transform: uppercase;
  color: var(--pink);
}
.lc-h3 {
  font-family: var(--display); font-weight: 400;
  font-size: max(28px, calc(44 * var(--u)));
  line-height: 1.2;
}
.lc-p {
  font-size: max(16px, calc(21 * var(--u)));
  line-height: 1.6;
  color: var(--grey);
}
.lc-group {
  display: flex; flex-direction: column;
  gap: calc(16 * var(--u));
  max-width: 71%;
}
.lc-spacer { height: calc(var(--s, 24) * var(--u)); }

/* ---------- Sections ---------- */
.lc-sec {
  display: flex; flex-direction: column; align-items: stretch;
  gap: calc(48 * var(--u));
  padding: calc(150 * var(--u)) calc(160 * var(--u));
}
.lc-sec > * { flex: none; }
.lc-sec--tint { background: var(--tint); }
.lc-sec--overview { gap: calc(40 * var(--u)); padding-block: calc(120 * var(--u)); }
.lc-sec--process { gap: calc(40 * var(--u)); padding-block: calc(130 * var(--u)); }
.lc-sec--deliver { padding-bottom: calc(120 * var(--u)); }
.lc-sec--reflection { gap: calc(40 * var(--u)); padding-bottom: calc(80 * var(--u)); }

/* ---------- Hero ---------- */
.lc-hero {
  position: relative;
  min-height: calc(1080 * var(--u));
  background: #fdf4f6;
  overflow: hidden;
}
.lc-hero__panel {
  position: absolute;
  top: 0; right: 0; bottom: 0;
  width: calc(468 * var(--u));
  background: linear-gradient(148.7deg, #8e40d0 3.4%, #d3277f 98.9%);
}
.lc-hero__img {
  position: absolute;
  left: calc(1020 * var(--u));
  bottom: 0;
  width: calc(708 * var(--u));
  height: auto;
}
.lc-hero__text {
  position: relative;
  padding: calc(220 * var(--u)) 0 calc(117 * var(--u)) calc(160 * var(--u));
  max-width: calc(1004 * var(--u) + 160 * var(--u));
}
.lc-hero__eyebrow {
  font-weight: 700;
  font-size: max(13px, calc(16 * var(--u)));
  letter-spacing: .1em; text-transform: uppercase;
  color: var(--pink);
}
.lc-hero__title {
  margin: calc(12 * var(--u)) 0 0 calc(-10 * var(--u)) !important;
  font-family: "Playfair Display", Georgia, serif;
  font-weight: 600;
  font-size: max(84px, calc(180 * var(--u)));
  line-height: 1.333;
  color: var(--ink);
}
.lc-hero__tagline {
  margin-top: calc(10 * var(--u)) !important;
  font-family: var(--display);
  font-size: max(24px, calc(40 * var(--u)));
  line-height: 1.2;
  color: var(--pink);
}
.lc-hero__intro {
  max-width: calc(720 * var(--u));
  margin-top: calc(42 * var(--u)) !important;
  font-size: max(17px, calc(24 * var(--u)));
  line-height: 1.5;
}
.lc-meta {
  display: grid;
  grid-template-columns: repeat(4, calc(190 * var(--u)));
  gap: calc(28 * var(--u));
  margin-top: calc(142 * var(--u)) !important;
}
.lc-meta div { padding-top: calc(18 * var(--u)); border-top: 1px solid #d9bfcc; }
.lc-meta dt {
  font-weight: 700;
  font-size: max(12px, calc(14 * var(--u)));
  letter-spacing: .08em; text-transform: uppercase;
  color: var(--pink);
}
.lc-meta dd {
  margin-top: calc(10 * var(--u));
  font-size: max(14px, calc(17 * var(--u)));
  line-height: 1.5;
}

/* ---------- Overview ---------- */
.lc-overview {
  display: grid;
  grid-template-columns: minmax(0, 780fr) minmax(0, 546fr);
  gap: calc(96 * var(--u));
  align-items: start;
}
.lc-overview__text { display: grid; gap: calc(20 * var(--u)); font-size: max(17px, calc(22 * var(--u))); line-height: 1.6; }
.lc-figures div {
  display: flex; align-items: center; gap: calc(28 * var(--u));
  padding: calc(22 * var(--u)) 0;
  border-bottom: 1px solid var(--blush-2);
}
.lc-figures div:first-child { border-top: 1px solid var(--blush-2); }
.lc-figures dt {
  font-family: var(--display);
  font-size: max(34px, calc(52 * var(--u)));
  line-height: 1.1; white-space: nowrap;
  color: var(--pink);
}
.lc-figures dd { max-width: calc(320 * var(--u) + 40px); font-size: max(14px, calc(17 * var(--u))); line-height: 1.5; }

/* ---------- Process ---------- */
.lc-diamond svg { display: block; width: 100%; height: auto; overflow: visible; }
.lc-diamond text { text-anchor: middle; }
.lc-dd-num text { font: 700 15px var(--serif); letter-spacing: .06em; }
.lc-dd-name text { font: 400 24px var(--display); letter-spacing: .02em; fill: var(--ink); }
.lc-dd-sub text { font: 400 15px var(--serif); fill: var(--grey); }
.lc-dd-end text { font: 700 15px var(--serif); letter-spacing: .04em; fill: var(--pink); }
.lc-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(16 * var(--u)); }
.lc-steps > div {
  display: flex; flex-direction: column; gap: calc(14 * var(--u));
  padding: calc(24 * var(--u));
  background: var(--blush-2);
  border-radius: calc(16 * var(--u));
}
.lc-steps__head { font-weight: 700; font-size: max(13px, calc(15 * var(--u))); line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: var(--pink); }
.lc-steps ul { padding: 0; list-style: none; font-size: max(14px, calc(16 * var(--u))); line-height: 1.75; }

/* ---------- Discover ---------- */
.lc-funnel {
  display: grid;
  grid-template-columns: minmax(0, 660fr) minmax(0, 748fr);
  align-items: center;
  min-height: calc(560 * var(--u));
  background: var(--tint);
  border-radius: calc(28 * var(--u));
  overflow: hidden;
}
.lc-funnel__rings { display: block; width: 100%; height: auto; }
.lc-funnel__rings text { text-anchor: middle; font: 700 13px var(--serif); letter-spacing: .06em; fill: var(--pink); }
.lc-funnel__list { padding-right: calc(88 * var(--u)); }
.lc-funnel__list div { min-height: calc(105 * var(--u)); }
.lc-funnel__list dt { font-weight: 700; font-size: max(13px, calc(15 * var(--u))); line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; color: var(--pink); }
.lc-funnel__list dd { margin-top: calc(5 * var(--u)); font-size: max(15px, calc(19 * var(--u))); line-height: 1.5; }

.lc-stats { display: grid; grid-template-columns: minmax(0, 1005fr) minmax(0, 380fr); gap: calc(24 * var(--u)); align-items: start; }
.lc-stat {
  display: flex; flex-direction: column; gap: calc(12 * var(--u));
  padding: calc(44 * var(--u)) calc(48 * var(--u)) calc(48 * var(--u));
  background: linear-gradient(to right, rgba(213, 39, 125, .7), rgba(131, 35, 202, .7));
  border-radius: calc(28 * var(--u));
  color: #fff;
}
.lc-stat__label { font-weight: 700; font-size: max(12px, calc(15 * var(--u))); line-height: 1.5; letter-spacing: .08em; text-transform: uppercase; }
.lc-stat__big { font-family: var(--display); font-size: max(36px, calc(96 * var(--u))); line-height: 1.05; white-space: nowrap; }
.lc-stat__text { max-width: calc(720 * var(--u) + 40px); font-family: var(--display); font-size: max(18px, calc(24 * var(--u))); line-height: 1.4; }
.lc-stat__note { max-width: calc(720 * var(--u) + 40px); font-size: max(12px, calc(15 * var(--u))); line-height: 1.4; }
.lc-scotland {
  display: flex; flex-direction: column; gap: calc(16 * var(--u));
  padding: calc(40 * var(--u)) calc(40 * var(--u)) calc(44 * var(--u));
  background: var(--blush);
  border-radius: calc(28 * var(--u));
}
.lc-scotland__name { font-family: var(--display); font-size: max(28px, calc(40 * var(--u))); line-height: 1.5; margin-block: calc(-8 * var(--u)) !important; }
.lc-scotland__text { font-size: max(15px, calc(19 * var(--u))); line-height: 1.55; color: var(--grey); }

.lc-cards { display: grid; gap: calc(24 * var(--u)); align-items: stretch; }
.lc-cards--4 { grid-template-columns: repeat(4, 1fr); }
.lc-cards--3 { grid-template-columns: repeat(3, 1fr); align-items: start; }
.lc-cards--2 { grid-template-columns: repeat(2, 1fr); align-items: start; }
.lc-land {
  display: flex; flex-direction: column; align-items: flex-start; gap: calc(12 * var(--u));
  padding: calc(30 * var(--u)) calc(28 * var(--u));
  background: var(--blush);
  border-radius: calc(24 * var(--u));
}
.lc-land__title { font-weight: 700; font-size: max(18px, calc(22 * var(--u))); line-height: 1.3; }
.lc-land__text { font-size: max(15px, calc(17 * var(--u))); line-height: 1.5; color: var(--grey); }
.lc-pill {
  padding: calc(8 * var(--u)) calc(18 * var(--u));
  background: #fff;
  border-radius: 999px;
  font-weight: 700;
  font-size: max(10px, calc(11 * var(--u)));
  line-height: 1.3; letter-spacing: .06em; text-transform: uppercase;
  color: var(--pink);
}

.lc-bars {
  display: flex; flex-direction: column; gap: calc(24 * var(--u));
  padding: calc(40 * var(--u)) calc(44 * var(--u)) calc(44 * var(--u));
  background: var(--tint);
  border-radius: calc(28 * var(--u));
}
.lc-bars__bar { display: flex; gap: 6px; }
.lc-bars__bar span { flex: var(--n) 1 0; height: calc(64 * var(--u)); min-height: 28px; background: var(--c); border-radius: calc(12 * var(--u)); }
.lc-bars__legend { display: flex; flex-wrap: wrap; gap: calc(16 * var(--u)) calc(40 * var(--u)); margin: 0; padding: 0; list-style: none; }
.lc-bars__legend li { display: flex; align-items: center; gap: 10px; font-size: max(13px, calc(15 * var(--u))); line-height: 1.5; }
.lc-bars__legend li::before { content: ""; flex: none; width: 16px; height: 16px; border-radius: 50%; background: var(--c); }

.lc-media img { display: block; width: 100%; border-radius: calc(28 * var(--u)); }

.lc-insight {
  display: flex; flex-direction: column; gap: calc(18 * var(--u));
  padding: calc(48 * var(--u)) calc(56 * var(--u)) calc(52 * var(--u));
  background: var(--plum);
  border-radius: calc(32 * var(--u));
  color: #fff;
}
.lc-insight .lc-label { color: var(--rose); }
.lc-insight__big { max-width: 92%; font-family: var(--display); font-size: max(30px, calc(56 * var(--u))); line-height: 1.15; }
.lc-insight__text { max-width: 85%; font-size: max(16px, calc(21 * var(--u))); line-height: 1.6; color: rgba(255, 255, 255, .9); }

/* ---------- Define ---------- */
.lc-problem {
  display: flex; flex-direction: column; gap: calc(22 * var(--u));
  padding: calc(60 * var(--u)) calc(64 * var(--u)) calc(64 * var(--u));
  background: linear-gradient(to right, var(--pink), var(--purple));
  border-radius: calc(32 * var(--u));
  color: #fff;
}
.lc-problem .lc-label { color: #fff; }
.lc-problem__text { max-width: 88%; font-family: var(--display); font-size: max(30px, calc(60 * var(--u))); line-height: 1.15; }
.lc-hmw {
  display: flex; flex-direction: column; gap: calc(20 * var(--u));
  padding: calc(36 * var(--u)) calc(36 * var(--u)) calc(40 * var(--u));
  background: var(--blush-2);
  border-radius: calc(28 * var(--u));
}
.lc-hmw__tag { font-family: var(--display); font-size: max(34px, calc(48 * var(--u))); line-height: 1; color: var(--pink); }
.lc-hmw__text { font-family: var(--display); font-size: max(19px, calc(26 * var(--u))); line-height: 1.4; }
.lc-goal {
  align-self: flex-start;
  display: flex; align-items: center; gap: calc(28 * var(--u));
  padding: calc(30 * var(--u)) calc(48 * var(--u)) calc(30 * var(--u)) calc(40 * var(--u));
  background: var(--plum);
  border-radius: 999px;
  color: #fff;
}
.lc-goal__pill {
  flex: none;
  padding: calc(8 * var(--u)) calc(18 * var(--u));
  background: var(--rose);
  border-radius: 999px;
  font-weight: 700; font-size: max(12px, calc(15 * var(--u))); line-height: 1.3; letter-spacing: .06em; text-transform: uppercase;
  color: var(--plum);
}
.lc-goal p { font-family: var(--display); font-size: max(18px, calc(26 * var(--u))); line-height: 1.4; }

/* ---------- Develop ---------- */
.lc-solution {
  display: flex; flex-direction: column; gap: calc(16 * var(--u));
  padding: calc(48 * var(--u)) calc(56 * var(--u)) calc(52 * var(--u));
  background: var(--blush);
  border-radius: calc(32 * var(--u));
}
.lc-solution__text { max-width: 92%; font-family: var(--display); font-size: max(22px, calc(38 * var(--u))); line-height: 1.3; color: var(--plum); }
.lc-pillars { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(24 * var(--u)); align-items: end; }
.lc-pillar {
  display: flex; flex-direction: column; justify-content: flex-end; gap: calc(12 * var(--u));
  height: calc(var(--h) * var(--u));
  min-height: 190px;
  padding: calc(36 * var(--u));
  background: #f1e4fb;
  border-radius: calc(28 * var(--u));
  color: var(--plum);
}
.lc-pillar:nth-child(2) { background: #e2c9f6; }
.lc-pillar:nth-child(3) { background: var(--purple); color: #fff; }
.lc-pillar__num { font-family: var(--display); font-size: max(32px, calc(48 * var(--u))); line-height: 1; opacity: .6; }
.lc-pillar__title { font-family: var(--display); font-size: max(22px, calc(30 * var(--u))); line-height: 1.5; }
.lc-pillar__text { font-size: max(15px, calc(20 * var(--u))); line-height: 1.5; }
.lc-feature {
  display: flex; flex-direction: column; align-items: flex-start; gap: calc(16 * var(--u));
  padding: calc(32 * var(--u)) calc(32 * var(--u)) calc(36 * var(--u));
  background: var(--blush);
  border-radius: calc(28 * var(--u));
}
.lc-feature img { height: max(34px, calc(48 * var(--u))); width: auto; }
.lc-feature__title { font-family: var(--display); font-size: max(22px, calc(28 * var(--u))); line-height: 1.5; }
.lc-feature__text { font-size: max(15px, calc(18 * var(--u))); line-height: 1.5; color: var(--grey); }
.lc-ia {
  display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center;
  gap: calc(24 * var(--u));
  padding: calc(40 * var(--u));
  background: var(--tint);
  border-radius: calc(32 * var(--u));
}
.lc-ia img { display: block; width: 100%; border-radius: calc(16 * var(--u)); }
.lc-wires {
  display: flex; justify-content: center; align-items: center;
  gap: calc(24 * var(--u));
  padding: calc(40 * var(--u));
  background: #f4f2f4;
  border-radius: calc(32 * var(--u));
}
.lc-wires figure { display: flex; flex-direction: column; align-items: center; gap: calc(16 * var(--u)); width: calc(560 * var(--u)); }
.lc-wires img { display: block; width: 100%; }
.lc-wires figcaption { font-weight: 700; font-size: max(12px, calc(14 * var(--u))); line-height: 1.5; letter-spacing: .06em; text-transform: uppercase; color: var(--pink); }

/* ---------- Deliver ---------- */
.lc-brand { display: flex; align-items: center; gap: calc(72 * var(--u)); }
.lc-brand__logo {
  flex: none;
  display: flex; justify-content: center; align-items: flex-start;
  width: calc(620 * var(--u)); height: calc(380 * var(--u));
  padding-top: calc(55.6 * var(--u));
  background: #fff;
  border-radius: calc(32 * var(--u));
}
.lc-brand__logo img { width: calc(514 * var(--u)); }
.lc-brand .lc-group { max-width: calc(700 * var(--u) + 60px); }
.lc-onboarding {
  display: flex; justify-content: center;
  padding: calc(24 * var(--u)) calc(8 * var(--u));
  background: #fff;
  border-radius: calc(32 * var(--u));
}
.lc-onboarding img { display: block; width: calc(1380 * var(--u)); }

/* ---------- Core features (map background) ---------- */
.lc-core {
  background: #c98fb0 url("../assets/img/locus/final-bg.jpg") center bottom / 100% 138.89% no-repeat;   /* stretched like in Figma */
  color: #fff;
}
.lc-core .lc-label { color: #fff; }
.lc-feat { display: flex; align-items: center; gap: calc(96 * var(--u)); }
.lc-feat--flip .lc-feat__phone { order: 2; }
.lc-feat__phone { flex: none; padding: calc(50 * var(--u)) calc(60 * var(--u)); }
.lc-feat__phone img { display: block; width: calc(316 * var(--u)); min-width: 150px; }
.lc-feat__text { display: flex; flex-direction: column; gap: calc(20 * var(--u)); max-width: calc(720 * var(--u) + 40px); }
.lc-feat__num { font-family: var(--display); font-size: max(36px, calc(56 * var(--u))); line-height: 1; color: rgba(255, 255, 255, .6); }
.lc-feat__title { font-family: var(--display); font-size: max(28px, calc(44 * var(--u))); line-height: 1.2; }
.lc-feat__text p:last-child { font-size: max(16px, calc(21 * var(--u))); line-height: 1.6; color: rgba(255, 255, 255, .92); }

/* ---------- Impact ---------- */
.lc-impact {
  display: flex; align-items: center; gap: calc(80 * var(--u));
  padding: calc(56 * var(--u)) calc(64 * var(--u));
  background: linear-gradient(to right, #a25dd9, var(--plum));
  border-radius: calc(40 * var(--u));
  color: #fff;
}
.lc-impact__phone { flex: none; width: calc(391 * var(--u)); min-width: 170px; }
.lc-impact .lc-label { color: var(--rose); }
.lc-impact .lc-group { max-width: calc(720 * var(--u) + 40px); gap: calc(20 * var(--u)); }
.lc-impact .lc-p { color: rgba(255, 255, 255, .9); }

/* ---------- Reflection ---------- */
.lc-list {
  display: flex; flex-direction: column; gap: calc(22 * var(--u));
  padding: calc(40 * var(--u)) calc(40 * var(--u)) calc(44 * var(--u));
  background: var(--blush);
  border-radius: calc(28 * var(--u));
}
.lc-list ul { display: grid; gap: calc(22 * var(--u)); padding: 0; list-style: none; }
.lc-list li {
  position: relative;
  padding-left: calc(33 * var(--u) + 4px);
  font-size: max(16px, calc(20 * var(--u)));
  line-height: 1.55;
}
.lc-list li::before {                  /* pink diamond bullet */
  content: "";
  position: absolute;
  left: 2px; top: .55em;
  width: calc(12 * var(--u) + 1px); height: calc(12 * var(--u) + 1px);
  background: var(--pink);
  transform: rotate(45deg);
}

/* ---------- Closing sticker ---------- */
.lc-closing {
  display: flex; justify-content: center; align-items: flex-start;
  height: calc(645 * var(--u));
  min-height: 260px;
  padding-top: calc(120 * var(--u));
}
.lc-closing__sticker {
  width: calc(744 * var(--u)); min-width: 300px;
  aspect-ratio: 744 / 339;
  overflow: hidden;
}
.lc-closing__sticker img { width: 100%; height: 100%; object-fit: cover; object-position: bottom; }

/* ---------- Tablets ---------- */
@media (max-width: 1000px) {
  .lc-cards--4, .lc-steps { grid-template-columns: repeat(2, 1fr); }
  .lc-overview, .lc-stats { grid-template-columns: 1fr; }
  .lc-funnel { grid-template-columns: 1fr; padding-bottom: 28px; }
  .lc-funnel__rings { max-width: 440px; margin: 0 auto; }
  .lc-funnel__list { padding: 0 28px; display: grid; gap: 16px; }
  .lc-funnel__list div { min-height: 0; }
  .lc-brand { flex-direction: column; align-items: stretch; gap: 32px; }
  .lc-brand__logo { width: 100%; height: auto; padding: 40px 24px; }
  .lc-brand__logo img { width: min(514px, 90%); }
  .lc-brand .lc-group { max-width: none; }
}

/* ---------- Phones ---------- */
@media (max-width: 720px) {
  .lc-sec { padding: 64px 20px; gap: 24px; }
  .lc-sec--overview, .lc-sec--process, .lc-sec--reflection { gap: 20px; }
  .lc-h1, .lc-h2, .lc-lead, .lc-group, .lc-insight__big, .lc-insight__text, .lc-problem__text, .lc-solution__text { max-width: none; }
  .lc-spacer { height: 8px; }

  .lc-hero { display: flex; flex-direction: column; min-height: 0; padding-bottom: 0; }
  .lc-hero__text { order: 1; }
  .lc-hero__img { order: 2; z-index: 1; }
  .lc-hero__text { padding: 56px 20px 32px; max-width: none; }
  .lc-hero__title { margin-left: -4px !important; }
  .lc-hero__intro { max-width: none; margin-top: 20px !important; }
  .lc-meta { grid-template-columns: repeat(2, 1fr); gap: 20px; margin-top: 36px !important; }
  .lc-hero__panel { top: auto; height: 260px; width: 42%; z-index: 0; }
  .lc-hero__img { position: relative; display: block; left: auto; width: min(360px, 88%); margin-left: auto; }

  .lc-phase { gap: 12px; }
  .lc-phase__num { font-size: 64px; }
  .lc-phase__name { font-size: 36px; }
  .lc-figures dd { flex: 1; max-width: none; }
  .lc-diamond { overflow-x: auto; margin: 0 -20px; padding: 0 20px; }
  .lc-diamond svg { width: 720px; }
  .lc-cards--4, .lc-cards--3, .lc-cards--2, .lc-steps, .lc-pillars, .lc-ia { grid-template-columns: 1fr; }
  .lc-pillar { height: auto; min-height: 0; }
  .lc-stat, .lc-scotland, .lc-insight, .lc-problem, .lc-solution, .lc-bars, .lc-list, .lc-hmw, .lc-land, .lc-feature, .lc-steps > div { padding: 24px; border-radius: 20px; }
  .lc-stat__big { white-space: normal; }
  .lc-goal { flex-direction: column; align-items: flex-start; gap: 12px; padding: 24px; border-radius: 20px; }
  .lc-wires { flex-direction: column; padding: 24px; border-radius: 20px; }
  .lc-wires figure { width: 100%; }
  .lc-ia, .lc-onboarding { padding: 16px; border-radius: 20px; }
  .lc-onboarding { overflow-x: auto; justify-content: flex-start; }
  .lc-onboarding img { width: 900px; max-width: none; }

  .lc-feat, .lc-feat--flip { flex-direction: column; align-items: flex-start; gap: 8px; }
  .lc-feat--flip .lc-feat__phone { order: 0; }
  .lc-feat__phone { padding: 16px 0; }
  .lc-feat__phone img { width: 190px; }

  .lc-impact { flex-direction: column; align-items: flex-start; gap: 24px; padding: 28px 24px; border-radius: 24px; }
  .lc-impact__phone { width: 200px; align-self: center; }
  .lc-list li { padding-left: 26px; }
}