:root {
  --serif-a: "Instrument Serif", Georgia, serif;
  --sans-a: "DM Sans", Arial, sans-serif;
  --serif-b: "Lora", Georgia, serif;
  --sans-b: "Nunito Sans", Arial, sans-serif;
  --sans-core: "Poppins", Arial, sans-serif;
  --serif: var(--serif-a);
  --sans: var(--sans-a);
  --bg: #f1f0e8;
  --surface: #e4e7dc;
  --ink: #183229;
  --muted: #5d6963;
  --accent: #bdc99e;
  --dark: #1b342b;
  --light-on-dark: #f5f4ea;
  --line: rgba(24, 50, 41, 0.2);
  --radius: 0;
  --shell: min(90vw, 86rem);
  --step--1: clamp(0.76rem, 0.74rem + 0.1vw, 0.86rem);
  --step-0: clamp(0.98rem, 0.93rem + 0.18vw, 1.08rem);
  --step-1: clamp(1.24rem, 1.08rem + 0.6vw, 1.65rem);
  --step-2: clamp(1.8rem, 1.35rem + 1.55vw, 3rem);
  --step-3: clamp(3rem, 1.95rem + 3.7vw, 6rem);
  --step-4: clamp(4rem, 2.4rem + 5.8vw, 8.5rem);
  --space-1: clamp(0.8rem, 0.7rem + 0.3vw, 1rem);
  --space-2: clamp(1.4rem, 1.15rem + 0.8vw, 2rem);
  --space-3: clamp(2rem, 1.4rem + 2vw, 3.5rem);
  --space-4: clamp(3.5rem, 2.3rem + 4.5vw, 7rem);
  --space-5: clamp(5rem, 3.2rem + 7vw, 10rem);
}
.skin-harbour {
  --serif: var(--serif-b);
  --sans: var(--sans-b);
  --bg: #fff8ee;
  --surface: #f1ddca;
  --ink: #3a2924;
  --muted: #786359;
  --accent: #d96d49;
  --dark: #356663;
  --light-on-dark: #fffaf2;
  --line: rgba(58, 41, 36, 0.16);
  --radius: 1.8rem;
  --step-3: clamp(2.7rem, 1.9rem + 3vw, 5.2rem);
  --step-4: clamp(3.5rem, 2.3rem + 4.7vw, 6.8rem);
}
.skin-core {
  --serif: var(--sans-b);
  --sans: var(--sans-core);
  --bg: #ffffff;
  --surface: #f5f5f5;
  --ink: #000000;
  --muted: #797979;
  --accent: #000000;
  --dark: #000000;
  --light-on-dark: #ffffff;
  --line: rgba(0, 0, 0, 0.2);
  --radius: 0;
  --step-3: clamp(2.5rem, 1.8rem + 3vw, 5rem);
  --step-4: clamp(3.6rem, 2.4rem + 4.3vw, 6.5rem);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--ink); font-family: var(--sans); font-size: var(--step-0); line-height: 1.55; text-rendering: optimizeLegibility; }
a { color: inherit; }
button, input, textarea { font: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 400; }
h1, h2 { font-family: var(--serif); letter-spacing: -0.025em; line-height: 0.98; }
h2 { font-size: var(--step-2); }
.skin-core h1, .skin-core h2, .skin-core h3 { font-weight: 500; }
.skip-link { position: fixed; top: 0; left: 1rem; z-index: 100; padding: 0.7rem 1rem; background: var(--dark); color: var(--light-on-dark); transform: translateY(-110%); }
.skip-link:focus { transform: translateY(0); }
.fiction-banner { min-height: 2rem; padding: 0.45rem 5vw; display: flex; justify-content: center; align-items: center; gap: 1rem; background: #f2b85e; color: #211d18; font-size: 0.68rem; letter-spacing: 0.02em; text-align: center; }
.fiction-banner a { margin-left: auto; }
.skin-core .fiction-banner { background: #000; color: #fff; }
.demo-header { width: var(--shell); min-height: 6.8rem; margin: 0 auto; display: flex; align-items: center; gap: clamp(1.2rem, 3vw, 3.5rem); border-bottom: 1px solid var(--line); }
.firm-mark { display: inline-flex; align-items: center; gap: 0.8rem; text-decoration: none; margin-right: auto; }
.firm-mark--image { flex: 0 0 auto; }
.firm-mark__logo { width: clamp(8.75rem, 12vw, 11rem); height: auto; display: block; }
.firm-mark__symbol { width: 2.8rem; height: 2.8rem; display: grid; place-items: center; border: 1px solid currentColor; border-radius: var(--radius); font-family: var(--serif); font-size: 1.25rem; }
.skin-harbour .firm-mark__symbol { border-radius: 50% 50% 48% 52%; }
.skin-core .firm-mark__symbol { border-radius: 50%; border-width: 2px; box-shadow: inset 0 0 0 0.38rem var(--bg), inset 0 0 0 0.5rem var(--ink); }
.firm-mark__words { display: grid; line-height: 1.1; }
.firm-mark__words strong { font-family: var(--serif); font-size: 1.15rem; font-weight: 500; }
.firm-mark__words small { margin-top: 0.25rem; font-size: 0.56rem; font-weight: 600; letter-spacing: 0.12em; text-transform: uppercase; }
.demo-navigation { display: flex; align-items: center; gap: clamp(0.9rem, 1.6vw, 1.7rem); }
.demo-navigation a, .demo-footer nav a { text-decoration: none; font-size: var(--step--1); }
.demo-navigation a:hover, .demo-navigation a[aria-current="page"] { text-decoration: underline; text-underline-offset: 0.45em; text-decoration-thickness: 1px; }
.demo-header__cta, .demo-button { min-height: 3rem; padding: 0.75rem 1.1rem; display: inline-flex; align-items: center; justify-content: center; border: 1px solid var(--ink); border-radius: var(--radius); background: transparent; color: var(--ink); font-size: var(--step--1); font-weight: 600; text-decoration: none; cursor: pointer; transition: 180ms ease; }
.demo-header__cta:hover, .demo-button:hover { background: var(--ink); color: var(--bg); transform: translateY(-1px); }
.demo-menu { display: none; }
.demo-shell { width: var(--shell); margin-inline: auto; }
.demo-eyebrow { font-size: 0.66rem; font-weight: 600; letter-spacing: 0.16em; text-transform: uppercase; }
.demo-text-link { display: inline-flex; font-size: var(--step--1); font-weight: 600; text-underline-offset: 0.4em; }

.home-hero { width: var(--shell); min-height: calc(100vh - 8.8rem); margin-inline: auto; padding-block: var(--space-3); display: grid; grid-template-columns: 1.15fr 0.85fr; grid-template-rows: 1fr auto; gap: var(--space-2) var(--space-4); align-items: center; }
.home-hero h1 { margin-bottom: var(--space-2); font-size: var(--step-4); max-width: 10ch; }
.home-hero__content > p:not(.demo-eyebrow) { max-width: 39rem; font-size: var(--step-1); line-height: 1.4; }
.home-hero__actions { margin-top: var(--space-2); display: flex; align-items: center; gap: 1.5rem; flex-wrap: wrap; }
.home-hero__composition { height: min(65vh, 42rem); position: relative; overflow: hidden; background: var(--surface); border-radius: var(--radius); }
.home-hero__portrait { height: min(65vh, 42rem); margin: 0; position: relative; overflow: hidden; background: var(--surface); border-radius: var(--radius); }
.home-hero__portrait img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 50% 38%; }
.home-hero__portrait figcaption { position: absolute; inset: auto 0 0; padding: 4.5rem 1.2rem 1.2rem; background: linear-gradient(transparent, rgba(17, 17, 16, 0.78)); color: white; font-size: 0.7rem; font-weight: 600; letter-spacing: 0.08em; text-transform: uppercase; }
.home-hero__composition > span { position: absolute; right: 8%; bottom: 3%; font-family: var(--serif); font-size: clamp(7rem, 16vw, 16rem); color: color-mix(in srgb, var(--ink) 17%, transparent); line-height: 1; }
.composition-shape { position: absolute; border: 1px solid color-mix(in srgb, var(--ink) 42%, transparent); }
.composition-shape--one { width: 54%; aspect-ratio: 1; top: 8%; left: 12%; border-radius: 50%; background: color-mix(in srgb, var(--accent) 78%, transparent); }
.composition-shape--two { width: 42%; aspect-ratio: 0.68; bottom: -10%; right: 7%; transform: rotate(16deg); background: var(--dark); }
.composition-line { position: absolute; width: 120%; height: 1px; left: -10%; top: 53%; background: var(--ink); transform: rotate(-28deg); transform-origin: center; }
.skin-harbour .composition-shape--one { border-radius: 48% 52% 43% 57% / 56% 43% 57% 44%; transform: rotate(-12deg); }
.skin-harbour .composition-shape--two { border-radius: 48% 52% 30% 70% / 57% 30% 70% 43%; transform: rotate(9deg); background: var(--accent); }
.skin-harbour .composition-line { height: 1.5rem; background: var(--dark); border-radius: 50%; transform: rotate(-11deg); opacity: 0.45; }
.skin-core .home-hero__composition { background: #f5f5f5; }
.skin-core .composition-shape--one { width: 66%; top: 10%; left: 13%; border: 3px solid var(--ink); border-radius: 50%; background: transparent; box-shadow: inset 0 0 0 2.8rem #d9d8d2, inset 0 0 0 3rem var(--ink), inset 0 0 0 5.8rem #d9d8d2, inset 0 0 0 6rem var(--ink); }
.skin-core .composition-shape--two { width: 20%; aspect-ratio: 1; right: 14%; bottom: 13%; border-radius: 50%; background: var(--accent); transform: none; }
.skin-core .composition-line { width: 72%; left: 14%; top: auto; bottom: 15%; background: var(--ink); transform: rotate(-18deg); }
.home-hero__note { grid-column: 2; max-width: 34rem; margin: 0; font-size: 0.72rem; color: var(--muted); }
.statement-band { padding: var(--space-4) 5vw; background: var(--dark); color: var(--light-on-dark); }
.statement-band p { max-width: 28ch; margin: 0 auto; font-family: var(--serif); font-size: var(--step-3); line-height: 1.03; text-align: center; }

.audience-section { padding-block: var(--space-5); }
.section-intro { max-width: 48rem; margin-bottom: var(--space-3); }
.section-intro h2 { font-size: var(--step-3); }
.audience-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.audience-grid article { padding: var(--space-2); border-right: 1px solid var(--line); }
.audience-grid article:first-child { padding-left: 0; }
.audience-grid article:last-child { padding-right: 0; border: 0; }
.audience-grid h3 { font-family: var(--serif); font-size: var(--step-1); line-height: 1.13; }
.section-link { margin-top: var(--space-2); }
.service-section { padding-block: var(--space-5); background: var(--surface); }
.service-layout { display: grid; grid-template-columns: 0.7fr 1.3fr; gap: var(--space-4); }
.service-intro { position: sticky; top: 2rem; align-self: start; }
.service-list { border-top: 1px solid var(--ink); }
.service-list article { padding: var(--space-2) 0; display: grid; grid-template-columns: 4rem 1fr; border-bottom: 1px solid var(--line); }
.service-list article > span { font-family: var(--serif); color: var(--accent); font-size: var(--step-1); }
.skin-harbour .service-list article > span { color: var(--accent); font-weight: 600; }
.service-list h3 { margin-bottom: 0.4rem; font-family: var(--serif); font-size: var(--step-1); }
.service-list p { max-width: 39rem; margin-bottom: 0; }
.founder-section { padding-block: var(--space-5); display: grid; grid-template-columns: 0.78fr 1.22fr; gap: var(--space-4); align-items: center; }
.founder-portrait { min-height: 36rem; display: grid; place-items: center; position: relative; overflow: hidden; background: var(--dark); color: var(--light-on-dark); border-radius: var(--radius); }
.founder-portrait::before { content: ""; width: 65%; aspect-ratio: 0.77; border: 1px solid currentColor; border-radius: 50% 50% 12% 12%; opacity: 0.28; }
.founder-portrait::after { content: "Portrait supplied by client"; position: absolute; bottom: 1rem; left: 1rem; font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; opacity: 0.62; }
.founder-portrait > span { position: absolute; font-family: var(--serif); font-size: 6rem; opacity: 0.78; }
.founder-evidence { min-height: 36rem; padding: var(--space-3); display: flex; flex-direction: column; justify-content: flex-end; background: var(--dark); color: var(--light-on-dark); border-radius: var(--radius); }
.founder-evidence strong { display: block; margin-block: 0.2rem 1rem; font-family: var(--serif); font-size: clamp(6rem, 12vw, 11rem); font-weight: 400; line-height: 0.8; }
.founder-evidence small { max-width: 22rem; padding-top: 1rem; border-top: 1px solid color-mix(in srgb, var(--light-on-dark) 28%, transparent); color: color-mix(in srgb, var(--light-on-dark) 72%, transparent); font-size: 0.66rem; letter-spacing: 0.08em; text-transform: uppercase; }
.skin-harbour .founder-portrait::before { border-radius: 50% 50% 45% 45%; background: color-mix(in srgb, var(--accent) 55%, transparent); }
.founder-copy blockquote { max-width: 24ch; margin: 0 0 var(--space-3); font-family: var(--serif); font-size: var(--step-2); line-height: 1.05; }
.founder-copy h2 { margin-bottom: 0.3rem; }
.founder-role { color: var(--muted); }
.founder-copy > p:not(.demo-eyebrow):not(.founder-role) { max-width: 42rem; }
.founder-copy ul, .about-founder ul { padding: 1rem 0; margin-bottom: 1rem; list-style: none; border-top: 1px solid var(--line); }
.founder-copy li, .about-founder li { padding: 0.5rem 0; border-bottom: 1px solid var(--line); font-size: var(--step--1); }
.closing-cta { padding: var(--space-5) 5vw; background: var(--dark); color: var(--light-on-dark); text-align: center; }
.closing-cta h2 { max-width: 20ch; margin-inline: auto; font-size: var(--step-3); }
.closing-cta > p:not(.demo-eyebrow) { max-width: 43rem; margin: 0 auto var(--space-2); }
.closing-cta .demo-button { border-color: var(--light-on-dark); color: var(--light-on-dark); }
.closing-cta .demo-button:hover { background: var(--light-on-dark); color: var(--dark); }

.page-hero { width: var(--shell); min-height: 70vh; margin-inline: auto; padding-block: var(--space-5) var(--space-4); display: grid; grid-template-columns: 1.3fr 0.7fr; grid-template-rows: auto 1fr; column-gap: var(--space-4); align-items: end; }
.page-hero > * { min-width: 0; }
.page-hero .demo-eyebrow { grid-column: 1 / -1; align-self: start; }
.page-hero h1 { max-width: 12ch; margin-bottom: 0; font-size: var(--step-4); overflow-wrap: normal; word-break: normal; hyphens: none; }
.page-hero__intro { max-width: 35rem; margin-bottom: 0.6rem; font-size: var(--step-1); line-height: 1.45; }
.segment-section { padding-bottom: var(--space-5); }
.segment-section article { min-height: 18rem; padding: var(--space-3) 0; display: grid; grid-template-columns: 5rem 0.9fr 1.1fr; gap: var(--space-2); align-items: start; border-top: 1px solid var(--line); }
.segment-section article > span { font-family: var(--serif); font-size: var(--step-1); color: var(--accent); }
.segment-section article h2 { font-size: var(--step-2); }
.segment-section article p { max-width: 36rem; }
.editorial-callout { padding: var(--space-5) 5vw; background: var(--surface); }
.editorial-callout p { max-width: 28ch; margin: 0 auto; font-family: var(--serif); font-size: var(--step-3); line-height: 1.06; }
.questions-section { padding-block: var(--space-5); display: grid; grid-template-columns: 0.8fr 1.2fr; gap: var(--space-4); }
.questions-section ul { padding: 0; margin: 0; list-style: none; border-top: 1px solid var(--ink); }
.questions-section li { padding: 1.15rem 0; border-bottom: 1px solid var(--line); font-family: var(--serif); font-size: var(--step-1); }

.principles-section { padding-bottom: var(--space-5); }
.principles-grid, .values-grid { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--ink); }
.principles-grid article, .values-grid article { padding: var(--space-2); border-right: 1px solid var(--line); }
.principles-grid article:first-child, .values-grid article:first-child { padding-left: 0; }
.principles-grid article:last-child, .values-grid article:last-child { padding-right: 0; border-right: 0; }
.principles-grid h2, .values-grid h2 { font-size: var(--step-1); }
.planning-process { padding-block: var(--space-5); background: var(--dark); color: var(--light-on-dark); }
.planning-process ol { padding: 0; margin: 0; list-style: none; border-top: 1px solid color-mix(in srgb, var(--light-on-dark) 38%, transparent); }
.planning-process li { padding: var(--space-2) 0; display: grid; grid-template-columns: 7rem 1fr; border-bottom: 1px solid color-mix(in srgb, var(--light-on-dark) 20%, transparent); }
.planning-process li > span { font-family: var(--serif); font-size: var(--step-2); color: var(--accent); }
.planning-process h3 { font-family: var(--serif); font-size: var(--step-1); }
.planning-process p { max-width: 43rem; margin-bottom: 0; opacity: 0.78; }
.fees-placeholder { padding-block: var(--space-5); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.fees-placeholder h2 { max-width: 14ch; }
.fees-placeholder > p { padding: var(--space-2); background: var(--surface); border-radius: var(--radius); }

.about-founder { padding-bottom: var(--space-5); display: grid; grid-template-columns: 0.8fr 1.2fr; gap: var(--space-4); align-items: center; }
.founder-portrait--large { min-height: 44rem; }
.founder-photo { margin: 0; min-height: 36rem; overflow: hidden; background: var(--surface); border-radius: var(--radius); }
.founder-photo--large { min-height: 44rem; }
.founder-photo img { width: 100%; height: 100%; min-height: inherit; display: block; object-fit: cover; object-position: 50% 38%; }
.about-founder > div:last-child > p:not(.demo-eyebrow):not(.founder-role) { max-width: 45rem; }
.values-section { padding-block: var(--space-5); background: var(--surface); }
.proof-section { padding-block: var(--space-5); display: grid; grid-template-columns: 0.5fr 1fr 1fr; gap: var(--space-3); }
.proof-section h2 { font-size: var(--step-2); }

.page-hero--contact { min-height: 64vh; }
.contact-layout { padding-bottom: var(--space-5); display: grid; grid-template-columns: 0.8fr 1.2fr; gap: var(--space-4); }
.prompt-list { padding: 0; margin: 0 0 var(--space-3); list-style: none; border-top: 1px solid var(--ink); }
.prompt-list li { padding: 1rem 0; border-bottom: 1px solid var(--line); }
.contact-details { color: var(--muted); }
.contact-details p { margin-bottom: 0.3rem; }
.demo-form { padding: var(--space-3); background: var(--surface); border-radius: var(--radius); }
.demo-form label { display: block; margin-bottom: 1.3rem; font-size: var(--step--1); font-weight: 600; }
.demo-form input, .demo-form textarea { width: 100%; margin-top: 0.5rem; padding: 0.8rem 0; border: 0; border-bottom: 1px solid var(--ink); border-radius: 0; background: transparent; color: var(--ink); resize: vertical; }
.form-status { margin: 1rem 0 0; font-size: 0.7rem; color: var(--muted); }
.form-status.is-success { padding: 0.8rem; background: var(--bg); color: var(--ink); }
.form-status a { text-underline-offset: 0.25em; }
.next-steps { padding-block: var(--space-5); background: var(--dark); color: var(--light-on-dark); }
.next-steps ol { padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); list-style: none; }
.next-steps li { padding: var(--space-2); border-top: 1px solid; border-right: 1px solid color-mix(in srgb, var(--light-on-dark) 20%, transparent); }
.next-steps li:first-child { padding-left: 0; }
.next-steps li:last-child { border-right: 0; }
.next-steps li span { font-family: var(--serif); color: var(--accent); }

.demo-footer { padding: var(--space-4) 5vw var(--space-2); display: grid; grid-template-columns: 1fr 0.5fr 0.7fr; gap: var(--space-3); background: color-mix(in srgb, var(--surface) 60%, var(--bg)); }
.demo-footer__primary > p { max-width: 25rem; margin-top: var(--space-2); }
.demo-footer nav { display: flex; flex-direction: column; gap: 0.6rem; }
.demo-footer__contact p { margin-bottom: 0.35rem; font-size: var(--step--1); }
.regulatory-placeholder { grid-column: 1 / -1; padding: var(--space-2); border: 1px dashed var(--muted); font-size: 0.68rem; }
.regulatory-placeholder strong { text-transform: uppercase; letter-spacing: 0.1em; }
.regulatory-placeholder p { margin: 0.5rem 0 0; }
.demo-footer__end { grid-column: 1 / -1; display: flex; justify-content: space-between; font-size: 0.68rem; color: var(--muted); }

button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible { outline: 3px solid #e29462; outline-offset: 3px; }
.skin-core button:focus-visible, .skin-core a:focus-visible, .skin-core input:focus-visible, .skin-core textarea:focus-visible { outline-color: #000; }
@media (max-width: 900px) {
  .fiction-banner span { display: none; }
  .demo-header { min-height: 5.4rem; position: relative; }
  .demo-menu { display: flex; align-items: center; gap: 0.5rem; border: 0; background: transparent; color: var(--ink); }
  .demo-navigation { display: none; position: absolute; z-index: 20; top: 5.4rem; left: 0; right: 0; padding: 1.4rem; flex-direction: column; align-items: stretch; background: var(--bg); border-bottom: 1px solid var(--line); }
  .demo-navigation.is-open { display: flex; }
  .demo-header__cta { display: none; }
  .home-hero { min-height: auto; grid-template-columns: 1fr; }
  .home-hero__composition { height: 32rem; }
  .home-hero__portrait { height: 32rem; }
  .home-hero__note { grid-column: 1; }
  .audience-grid, .principles-grid, .values-grid { grid-template-columns: 1fr; }
  .audience-grid article, .principles-grid article, .values-grid article { padding: var(--space-2) 0; border-right: 0; border-bottom: 1px solid var(--line); }
  .service-layout, .founder-section, .page-hero, .questions-section, .fees-placeholder, .about-founder, .contact-layout { grid-template-columns: 1fr; }
  .service-intro { position: static; }
  .page-hero { min-height: 58vh; }
  .page-hero .demo-eyebrow { grid-column: 1; }
  .page-hero__intro { margin-top: var(--space-2); }
  .segment-section article { grid-template-columns: 4rem 1fr; min-height: auto; }
  .segment-section article p { grid-column: 2; }
  .proof-section { grid-template-columns: 1fr; }
  .next-steps ol { grid-template-columns: 1fr 1fr; }
  .demo-footer { grid-template-columns: 1fr 1fr; }
  .demo-footer__primary { grid-column: 1 / -1; }
}
@media (max-width: 560px) {
  .fiction-banner { justify-content: space-between; }
  .fiction-banner a { margin-left: 0; }
  .firm-mark__words small { display: none; }
  .skin-core .page-hero h1 { max-width: none; font-size: clamp(2.7rem, 11.5vw, 3.2rem); }
  .home-hero__composition { height: 25rem; }
  .home-hero__actions { align-items: stretch; flex-direction: column; }
  .segment-section article { grid-template-columns: 1fr; }
  .segment-section article p { grid-column: 1; }
  .planning-process li { grid-template-columns: 3.5rem 1fr; }
  .founder-portrait, .founder-portrait--large, .founder-evidence, .founder-photo, .founder-photo--large { min-height: 28rem; }
  .next-steps ol { grid-template-columns: 1fr; }
  .next-steps li, .next-steps li:first-child { padding: var(--space-2) 0; border-right: 0; }
  .demo-footer { grid-template-columns: 1fr; }
  .demo-footer__primary, .regulatory-placeholder, .demo-footer__end { grid-column: 1; }
  .demo-footer__end { flex-direction: column; gap: 0.5rem; }
}
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

/* Harbourline: a warmer, conversational branch of the shared system. */
.skin-harbour h1,
.skin-harbour h2 {
  font-family: var(--serif-b);
  font-weight: 500;
  line-height: 1.04;
  letter-spacing: -0.04em;
}
.skin-harbour h3 { font-family: var(--serif-b); font-weight: 500; letter-spacing: -0.025em; }
.skin-harbour .fiction-banner { background: #f3c967; }
.skin-harbour .demo-header { width: min(92vw, 90rem); min-height: 6.2rem; border-bottom: 0; }
.skin-harbour .firm-mark__symbol {
  border: 0;
  border-radius: 54% 46% 58% 42% / 47% 60% 40% 53%;
  background: var(--dark);
  color: var(--light-on-dark);
  transform: rotate(-4deg);
}
.skin-harbour .firm-mark__words strong { font-family: var(--serif-b); font-size: 1.2rem; }
.skin-harbour .demo-navigation { padding: 0.45rem 0.6rem; border-radius: 100vw; background: rgba(255,255,255,0.58); }
.skin-harbour .demo-navigation a { padding: 0.35rem 0.5rem; }
.skin-harbour .demo-navigation a:hover,
.skin-harbour .demo-navigation a[aria-current="page"] { text-decoration: none; color: var(--accent); }
.skin-harbour .demo-header__cta,
.skin-harbour .demo-button {
  border: 0;
  border-radius: 100vw;
  background: var(--accent);
  color: #fff;
  box-shadow: 0 0.4rem 0 rgba(82, 45, 33, 0.11);
}
.skin-harbour .demo-header__cta:hover,
.skin-harbour .demo-button:hover { background: var(--dark); color: var(--light-on-dark); }
.skin-harbour .demo-eyebrow { color: var(--muted); letter-spacing: 0.1em; }

.skin-harbour .home-hero {
  width: min(92vw, 90rem);
  min-height: calc(100vh - 8.2rem);
  grid-template-columns: minmax(0, 0.85fr) minmax(27rem, 1.15fr);
  gap: var(--space-3);
}
.skin-harbour .home-hero__content { position: relative; z-index: 2; }
.skin-harbour .home-hero h1 { max-width: 11ch; font-size: var(--step-4); }
.skin-harbour .home-hero__content > p:not(.demo-eyebrow) { max-width: 34rem; }
.skin-harbour .home-hero__composition {
  height: min(69vh, 45rem);
  border-radius: 48% 48% 2.2rem 2.2rem / 32% 32% 2.2rem 2.2rem;
  background: #c9ddd5;
  isolation: isolate;
}
.skin-harbour .home-hero__composition::before,
.skin-harbour .home-hero__composition::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  z-index: -1;
}
.skin-harbour .home-hero__composition::before {
  width: 75%;
  aspect-ratio: 1;
  left: -22%;
  top: -18%;
  background: rgba(255,248,238,0.72);
}
.skin-harbour .home-hero__composition::after {
  width: 48%;
  aspect-ratio: 1;
  right: -10%;
  bottom: -9%;
  background: rgba(53,102,99,0.34);
}
.skin-harbour .composition-shape--one {
  width: 58%;
  top: 13%;
  left: 20%;
  border: 0;
  border-radius: 63% 37% 53% 47% / 43% 58% 42% 57%;
  background: #fff4df;
  box-shadow: 1.1rem 1.2rem 0 rgba(217,109,73,0.15);
  transform: rotate(-7deg);
}
.skin-harbour .composition-shape--two {
  width: 27%;
  aspect-ratio: 0.72;
  right: 12%;
  bottom: 10%;
  border: 0;
  border-radius: 55% 45% 38% 62% / 40% 54% 46% 60%;
  background: var(--accent);
  transform: rotate(13deg);
}
.skin-harbour .composition-line {
  width: 120%;
  height: 42%;
  left: -12%;
  top: 58%;
  border-top: 1.1rem solid rgba(53,102,99,0.45);
  border-radius: 50%;
  background: transparent;
  transform: rotate(-8deg);
}
.skin-harbour .home-hero__composition > span {
  right: auto;
  left: 7%;
  bottom: 3%;
  font-family: var(--sans-b);
  font-size: clamp(4rem, 9vw, 8rem);
  font-weight: 700;
  color: rgba(58,41,36,0.12);
}
.skin-harbour .home-hero__note {
  padding: 0.75rem 1rem;
  border-radius: 1rem;
  background: rgba(255,255,255,0.62);
}

.skin-harbour .statement-band {
  position: relative;
  overflow: hidden;
  padding-block: var(--space-5);
  background: #fff1df;
  color: var(--ink);
}
.skin-harbour .statement-band::after {
  content: "";
  width: 18rem;
  height: 18rem;
  position: absolute;
  right: -5rem;
  bottom: -9rem;
  border-radius: 50%;
  background: #f2c7ad;
}
.skin-harbour .statement-band p {
  width: min(90vw, 72rem);
  max-width: 28ch;
  position: relative;
  z-index: 1;
  margin: 0 auto;
  font-family: var(--serif-b);
  font-size: var(--step-3);
  line-height: 1.1;
  text-align: left;
}

.skin-harbour .audience-section { width: min(92vw, 90rem); }
.skin-harbour .audience-grid { gap: 1rem; border-top: 0; align-items: start; }
.skin-harbour .audience-grid article {
  min-height: 21rem;
  padding: var(--space-2);
  border: 0;
  border-radius: 1.8rem;
  background: #fff;
  box-shadow: 0 1rem 3rem rgba(87,55,39,0.06);
}
.skin-harbour .audience-grid article:first-child,
.skin-harbour .audience-grid article:last-child { padding: var(--space-2); border: 0; }
.skin-harbour .audience-grid article:nth-child(2) { margin-top: 2rem; background: #f4e5d6; }
.skin-harbour .audience-grid article:nth-child(3) { margin-top: 4rem; background: #dceae5; }
.skin-harbour .audience-grid h3 { margin-top: 3rem; font-family: var(--serif-b); font-size: var(--step-1); }

.skin-harbour .service-section {
  width: min(96vw, 96rem);
  margin-inline: auto;
  border-radius: 4rem;
  background: #dcece7;
}
.skin-harbour .service-layout { width: min(88vw, 82rem); grid-template-columns: 0.6fr 1.4fr; }
.skin-harbour .service-list { display: grid; gap: 0.8rem; border-top: 0; }
.skin-harbour .service-list article {
  padding: var(--space-2);
  grid-template-columns: 3rem 1fr;
  border: 0;
  border-radius: 1.35rem;
  background: rgba(255,255,255,0.72);
}
.skin-harbour .service-list article > span { font-family: var(--sans-b); font-weight: 700; color: var(--accent); }
.skin-harbour .service-list h3 { font-family: var(--serif-b); }

.skin-harbour .founder-section { grid-template-columns: 1.02fr 0.98fr; }
.skin-harbour .founder-portrait,
.skin-harbour .founder-evidence {
  min-height: 34rem;
  border-radius: 46% 54% 1.8rem 1.8rem / 28% 34% 1.8rem 1.8rem;
  background: var(--dark);
}
.skin-harbour .founder-portrait::before { width: 58%; border: 0; background: rgba(255,248,238,0.15); }
.skin-harbour .founder-copy blockquote { font-family: var(--serif-b); font-size: var(--step-2); font-style: italic; line-height: 1.18; }
.skin-harbour .founder-copy ul,
.skin-harbour .about-founder ul { border-top: 0; }
.skin-harbour .founder-copy li,
.skin-harbour .about-founder li { margin-bottom: 0.5rem; padding: 0.65rem 0.85rem; border: 0; border-radius: 0.8rem; background: #fff1df; }

.skin-harbour .closing-cta {
  width: min(96vw, 96rem);
  margin-inline: auto;
  border-radius: 4rem 4rem 0 0;
  background: var(--accent);
  color: #fff;
}
.skin-harbour .closing-cta .demo-eyebrow { color: rgba(255,255,255,0.72); }
.skin-harbour .closing-cta .demo-button { border: 0; background: var(--light-on-dark); color: var(--ink); }

.skin-harbour .page-hero {
  width: min(92vw, 90rem);
  min-height: 64vh;
  position: relative;
  overflow: hidden;
  padding: var(--space-4);
  border-radius: 2.5rem;
  background: #f4e5d6;
}
.skin-harbour .page-hero::after {
  content: "";
  width: 23rem;
  height: 23rem;
  position: absolute;
  right: -8rem;
  top: -9rem;
  border-radius: 50%;
  background: rgba(217,109,73,0.18);
}
.skin-harbour .page-hero > * { position: relative; z-index: 1; }
.skin-harbour .page-hero h1 { max-width: 14ch; font-size: var(--step-3); }
.skin-harbour .segment-section { padding-top: var(--space-4); }
.skin-harbour .segment-section article {
  min-height: auto;
  margin-bottom: 1rem;
  padding: var(--space-2);
  grid-template-columns: 4rem 0.9fr 1.1fr;
  border: 0;
  border-radius: 1.4rem;
  background: #fff;
}
.skin-harbour .segment-section article:nth-child(2) { background: #f4e5d6; }
.skin-harbour .segment-section article:nth-child(3) { background: #dceae5; }
.skin-harbour .editorial-callout {
  width: min(92vw, 90rem);
  margin: 0 auto;
  border-radius: 3rem;
  background: var(--dark);
  color: var(--light-on-dark);
}
.skin-harbour .editorial-callout p { font-family: var(--serif-b); line-height: 1.12; }
.skin-harbour .questions-section ul { display: grid; gap: 0.6rem; border-top: 0; }
.skin-harbour .questions-section li { padding: 1rem 1.2rem; border: 0; border-radius: 0.8rem; background: #fff; font-family: var(--sans-b); }

.skin-harbour .principles-grid,
.skin-harbour .values-grid { gap: 1rem; border-top: 0; }
.skin-harbour .principles-grid article,
.skin-harbour .values-grid article,
.skin-harbour .principles-grid article:first-child,
.skin-harbour .values-grid article:first-child,
.skin-harbour .principles-grid article:last-child,
.skin-harbour .values-grid article:last-child {
  padding: var(--space-2);
  border: 0;
  border-radius: 1.3rem;
  background: #fff;
}
.skin-harbour .planning-process { width: min(96vw, 96rem); margin-inline: auto; border-radius: 4rem; background: var(--dark); }
.skin-harbour .planning-process ol { display: grid; gap: 0.7rem; border-top: 0; }
.skin-harbour .planning-process li { padding: var(--space-2); border: 0; border-radius: 1rem; background: rgba(255,255,255,0.09); }
.skin-harbour .fees-placeholder > p { border-radius: 1.4rem; }
.skin-harbour .about-founder { padding-top: var(--space-4); }
.skin-harbour .founder-portrait--large { border-radius: 48% 52% 1.8rem 1.8rem / 30% 35% 1.8rem 1.8rem; }
.skin-harbour .values-section { width: min(96vw, 96rem); margin-inline: auto; border-radius: 4rem; }
.skin-harbour .proof-section { padding: var(--space-4); border-radius: 2rem; background: #fff; }
.skin-harbour .demo-form { border-radius: 2rem; background: #fff; box-shadow: 0 1rem 3rem rgba(87,55,39,0.07); }
.skin-harbour .next-steps { width: min(96vw, 96rem); margin-inline: auto; border-radius: 4rem 4rem 0 0; background: #f0cbb5; color: var(--ink); }
.skin-harbour .next-steps ol { gap: 0.7rem; }
.skin-harbour .next-steps li,
.skin-harbour .next-steps li:first-child,
.skin-harbour .next-steps li:last-child { padding: var(--space-2); border: 0; border-radius: 1rem; background: rgba(255,255,255,0.52); }
.skin-harbour .demo-footer { background: #f4e5d6; }

@media (max-width: 900px) {
  .skin-harbour .demo-navigation { padding: 1.4rem; border-radius: 1rem; background: var(--bg); }
  .skin-harbour .home-hero { grid-template-columns: 1fr; }
  .skin-harbour .home-hero__composition { height: 34rem; border-radius: 3rem 3rem 1.5rem 1.5rem; }
  .skin-harbour .audience-grid { gap: 0.8rem; }
  .skin-harbour .audience-grid article,
  .skin-harbour .audience-grid article:first-child,
  .skin-harbour .audience-grid article:last-child,
  .skin-harbour .audience-grid article:nth-child(2),
  .skin-harbour .audience-grid article:nth-child(3) { min-height: auto; margin-top: 0; padding: var(--space-2); border: 0; }
  .skin-harbour .service-section,
  .skin-harbour .closing-cta,
  .skin-harbour .planning-process,
  .skin-harbour .values-section,
  .skin-harbour .next-steps { border-radius: 2.5rem; }
  .skin-harbour .service-layout { grid-template-columns: 1fr; }
  .skin-harbour .page-hero { min-height: 56vh; padding: var(--space-3); }
  .skin-harbour .segment-section article { grid-template-columns: 3rem 1fr; }
  .skin-harbour .segment-section article p { grid-column: 2; }
  .skin-harbour .principles-grid,
  .skin-harbour .values-grid { gap: 0.8rem; }
}

@media (max-width: 560px) {
  .skin-harbour .home-hero h1 { max-width: none; font-size: clamp(3rem, 14vw, 4.2rem); }
  .skin-harbour .home-hero__composition { height: 27rem; border-radius: 2.2rem 2.2rem 1.2rem 1.2rem; }
  .skin-harbour .service-section,
  .skin-harbour .closing-cta,
  .skin-harbour .planning-process,
  .skin-harbour .values-section,
  .skin-harbour .next-steps { width: 100%; border-radius: 2rem 2rem 0 0; }
  .skin-harbour .page-hero { width: 90vw; padding: var(--space-2); border-radius: 1.5rem; }
  .skin-harbour .segment-section article { grid-template-columns: 1fr; }
  .skin-harbour .segment-section article p { grid-column: 1; }
  .skin-harbour .editorial-callout { width: 94vw; border-radius: 2rem; }
}

/* Harbourline layout variant: conversational and centred, not Aster's split hero. */
.skin-harbour .home-hero {
  min-height: auto;
  padding-top: var(--space-4);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto;
  gap: var(--space-3);
  text-align: center;
}
.skin-harbour .home-hero__content {
  width: min(90vw, 64rem);
  margin-inline: auto;
}
.skin-harbour .home-hero h1 {
  max-width: 13ch;
  margin-inline: auto;
  font-size: clamp(3.2rem, 5.4vw, 5.5rem);
}
.skin-harbour .home-hero__content > p:not(.demo-eyebrow) { margin-inline: auto; }
.skin-harbour .home-hero__actions { justify-content: center; }
.skin-harbour .home-hero__composition {
  width: 100%;
  height: min(44vh, 28rem);
  border-radius: 2.5rem;
}
.skin-harbour .home-hero__note {
  grid-column: 1;
  justify-self: center;
  text-align: left;
}

@media (max-width: 560px) {
  .skin-harbour .home-hero { padding-top: var(--space-3); text-align: left; }
  .skin-harbour .home-hero__content { width: 100%; }
  .skin-harbour .home-hero h1 { margin-inline: 0; font-size: clamp(2.8rem, 13vw, 4rem); }
  .skin-harbour .home-hero__content > p:not(.demo-eyebrow) { margin-inline: 0; }
  .skin-harbour .home-hero__actions { justify-content: flex-start; }
  .skin-harbour .home-hero__composition { height: 22rem; border-radius: 1.5rem; }
}

/* Photographic direction: Aster is architectural; Harbourline is lived-in and human. */
.skin-aster .home-hero { grid-template-columns: minmax(0, 0.82fr) minmax(30rem, 1.18fr); }
.skin-aster .home-hero__portrait { height: min(70vh, 48rem); }
.skin-aster .home-hero__portrait img { object-position: 56% 50%; }
.skin-aster .home-hero__portrait figcaption { font-family: var(--sans-a); }

.skin-harbour .home-hero__portrait {
  width: 100%;
  height: min(48vh, 31rem);
  border-radius: 2.5rem;
}
.skin-harbour .home-hero__portrait img { object-position: 50% 48%; }
.skin-harbour .home-hero__portrait figcaption {
  padding: 5rem 1.5rem 1.4rem;
  font-family: var(--sans-b);
  letter-spacing: 0.05em;
}

/* Fieldwork Advisory: modular, commercially useful and intentionally non-editorial. */
.skin-fieldwork {
  --serif: "Space Grotesk", Arial, sans-serif;
  --sans: "Space Grotesk", Arial, sans-serif;
  --bg: #f5f7ff;
  --surface: #dfe6ff;
  --ink: #0b1020;
  --muted: #536078;
  --accent: #164bff;
  --dark: #0b1020;
  --light-on-dark: #ffffff;
  --line: rgba(11,16,32,0.22);
  --radius: 0;
}
.skin-fieldwork .fiction-banner {
  justify-content: space-between;
  background: #d9ff55;
  color: #0b1020;
  font-family: "IBM Plex Mono", monospace;
}
.skin-fieldwork .fiction-banner a { margin-left: 0; }
.skin-fieldwork .demo-header {
  width: min(94vw, 94rem);
  min-height: 6.25rem;
  gap: 2rem;
  border-bottom: 2px solid var(--ink);
}
.skin-fieldwork .firm-mark__symbol {
  width: 3rem;
  height: 3rem;
  border: 0;
  background: var(--accent);
  color: #fff;
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.85rem;
  font-weight: 600;
}
.skin-fieldwork .firm-mark__words strong {
  font-family: "Space Grotesk", sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: -0.04em;
}
.skin-fieldwork .firm-mark__words small,
.skin-fieldwork .demo-navigation a,
.skin-fieldwork .demo-header__cta {
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.68rem;
  letter-spacing: 0;
  text-transform: uppercase;
}
.skin-fieldwork .demo-navigation a:hover { color: var(--accent); text-decoration: none; }
.skin-fieldwork .demo-header__cta {
  min-height: 2.8rem;
  border: 0;
  background: var(--ink);
  color: #fff;
}
.skin-fieldwork .demo-header__cta:hover { background: var(--accent); }

.fw-hero,
.fw-decisions,
.fw-services,
.fw-contact { width: min(94vw, 94rem); margin-inline: auto; }
.fw-hero {
  min-height: calc(100vh - 8.25rem);
  padding-block: clamp(3rem, 7vw, 7rem);
  display: grid;
  grid-template-columns: minmax(0, 0.92fr) minmax(34rem, 1.08fr);
  align-items: center;
  gap: clamp(3rem, 7vw, 8rem);
}
.fw-kicker,
.fw-section-head > p,
.fw-contact > p {
  margin-bottom: 1.2rem;
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.69rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  text-transform: uppercase;
}
.fw-hero h1 {
  max-width: 12ch;
  margin-bottom: 1.8rem;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(3.7rem, 6.7vw, 7.4rem);
  font-weight: 600;
  letter-spacing: -0.07em;
  line-height: 0.88;
}
.fw-hero__copy > p:not(.fw-kicker) { max-width: 39rem; color: var(--muted); font-size: 1.12rem; }
.fw-button {
  margin-top: 1.4rem;
  padding: 0.9rem 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 2rem;
  border: 2px solid var(--ink);
  background: #d9ff55;
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.75rem;
  font-weight: 600;
  text-decoration: none;
  text-transform: uppercase;
  box-shadow: 0.45rem 0.45rem 0 var(--ink);
  transition: transform 160ms ease, box-shadow 160ms ease;
}
.fw-button:hover { transform: translate(0.2rem, 0.2rem); box-shadow: 0.25rem 0.25rem 0 var(--ink); }
.fw-dashboard { border: 2px solid var(--ink); background: var(--accent); color: #fff; box-shadow: 1rem 1rem 0 #b9c9ff; }
.fw-dashboard__head {
  padding: 0.9rem 1rem;
  display: flex;
  justify-content: space-between;
  border-bottom: 2px solid var(--ink);
  background: #fff;
  color: var(--ink);
  font-family: "IBM Plex Mono", monospace;
  font-size: 0.68rem;
  text-transform: uppercase;
}
.fw-metrics { display: grid; grid-template-columns: repeat(3, 1fr); }
.fw-metrics article { min-height: 17rem; padding: 1.2rem; display: flex; flex-direction: column; border-right: 2px solid var(--ink); }
.fw-metrics article:last-child { border-right: 0; }
.fw-metrics span,
.fw-metrics small,
.fw-signal span { font-family: "IBM Plex Mono", monospace; font-size: 0.64rem; text-transform: uppercase; }
.fw-metrics strong { margin: auto 0 0.6rem; font-size: clamp(2.8rem, 5vw, 5rem); line-height: 0.9; letter-spacing: -0.08em; }
.fw-metrics small { min-height: 2.5em; opacity: 0.75; }
.fw-metrics i { width: 100%; height: 0.45rem; margin-top: 1rem; display: block; background: rgba(255,255,255,0.25); }
.fw-metrics i::before { content: ""; width: var(--bar); height: 100%; display: block; background: #d9ff55; }
.fw-signal { padding: 1.1rem; display: grid; grid-template-columns: 8rem 1fr; gap: 1rem; border-top: 2px solid var(--ink); background: #d9ff55; color: var(--ink); }
.fw-signal strong { font-weight: 600; }

.fw-decisions { padding-block: clamp(5rem, 9vw, 9rem); border-top: 2px solid var(--ink); }
.fw-section-head { margin-bottom: clamp(2.5rem, 5vw, 5rem); display: grid; grid-template-columns: 0.5fr 1.5fr; gap: 2rem; }
.fw-section-head h2 {
  max-width: 18ch;
  margin: 0;
  font-family: "Space Grotesk", sans-serif;
  font-size: clamp(2.5rem, 5vw, 5.5rem);
  font-weight: 500;
  letter-spacing: -0.065em;
  line-height: 0.98;
}
.fw-decision-grid { display: grid; grid-template-columns: 1fr 1fr; border: 2px solid var(--ink); }
.fw-decision-grid article { min-height: 19rem; padding: 1.4rem; display: grid; grid-template-columns: 1fr auto; align-content: start; position: relative; border-right: 2px solid var(--ink); border-bottom: 2px solid var(--ink); background: #fff; }
.fw-decision-grid article:nth-child(2n) { border-right: 0; }
.fw-decision-grid article:nth-last-child(-n+2) { border-bottom: 0; }
.fw-decision-grid article > span { font-family: "IBM Plex Mono", monospace; font-size: 0.72rem; }
.fw-decision-grid article > b { color: var(--accent); font-size: 2rem; font-weight: 400; line-height: 0.8; }
.fw-decision-grid h3 { grid-column: 1 / -1; max-width: 15ch; margin: 4rem 0 0.8rem; font-family: "Space Grotesk", sans-serif; font-size: clamp(1.65rem, 2.5vw, 2.5rem); font-weight: 600; letter-spacing: -0.05em; line-height: 1; }
.fw-decision-grid p { grid-column: 1 / -1; max-width: 33rem; margin: 0; color: var(--muted); }

.fw-services { width: 100%; padding: clamp(5rem, 9vw, 9rem) max(3vw, calc((100vw - 94rem) / 2)); background: var(--ink); color: #fff; }
.fw-section-head--inverse { width: min(100%, 94rem); margin-inline: auto; }
.fw-service-grid { width: min(100%, 94rem); margin-inline: auto; display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid rgba(255,255,255,0.55); }
.fw-service-grid article { padding: 1.6rem 1.6rem 3rem 0; border-right: 1px solid rgba(255,255,255,0.25); }
.fw-service-grid article + article { padding-left: 1.6rem; }
.fw-service-grid article:last-child { border-right: 0; }
.fw-service-grid span { color: #d9ff55; font-family: "IBM Plex Mono", monospace; font-size: 0.7rem; }
.fw-service-grid h3 { max-width: 13ch; margin-top: 4rem; font-family: "Space Grotesk", sans-serif; font-size: 1.65rem; font-weight: 500; letter-spacing: -0.04em; line-height: 1.08; }
.fw-service-grid p { max-width: 25rem; color: rgba(255,255,255,0.7); }
.fw-process { width: min(100%, 94rem); margin: 4rem auto 0; padding: 0; border-top: 1px solid rgba(255,255,255,0.55); list-style: none; }
.fw-process li { padding: 1.2rem 0; display: grid; grid-template-columns: 7rem 1fr; gap: 1rem; border-bottom: 1px solid rgba(255,255,255,0.25); }
.fw-process li > span { color: #d9ff55; font-family: "IBM Plex Mono", monospace; }
.fw-process strong { display: block; font-size: 1.25rem; }
.fw-process p { margin: 0.35rem 0 0; color: rgba(255,255,255,0.66); }
.fw-contact { padding-block: clamp(5rem, 9vw, 9rem); display: grid; grid-template-columns: 0.42fr 1.1fr 0.72fr; gap: clamp(2rem, 5vw, 5rem); }
.fw-contact h2 { margin: 0; font-family: "Space Grotesk", sans-serif; font-size: clamp(2.7rem, 5.2vw, 5.5rem); font-weight: 600; letter-spacing: -0.065em; line-height: 0.95; }
.fw-contact div { align-self: end; }
.fw-contact div > p { color: var(--muted); }
.fw-contact a { display: inline-flex; gap: 1rem; font-family: "IBM Plex Mono", monospace; font-size: 0.78rem; font-weight: 600; text-underline-offset: 0.45em; }
.skin-fieldwork .demo-footer { border-top: 2px solid var(--ink); background: #dfe6ff; }
.skin-fieldwork .demo-footer .firm-mark__symbol { color: #fff; }

/* The Good Company: portrait-led, relational and deliberately paced. */
.skin-goodcompany {
  --serif: "Newsreader", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
  --bg: #f4eee9;
  --surface: #eaded7;
  --ink: #27141c;
  --muted: #6f5d62;
  --accent: #701f3a;
  --dark: #471126;
  --light-on-dark: #fff8f2;
  --line: rgba(39,20,28,0.2);
  --radius: 0;
}
.skin-goodcompany .fiction-banner { background: #2c1720; color: #fff8f2; }
.skin-goodcompany .demo-header { width: min(90vw, 88rem); min-height: 7.5rem; border-bottom: 1px solid var(--ink); }
.skin-goodcompany .firm-mark__symbol {
  width: 3.4rem;
  height: 2.1rem;
  border: 0;
  border-radius: 50%;
  background: var(--accent);
  color: #fff8f2;
  font-family: "Newsreader", serif;
  font-size: 0.9rem;
  font-style: italic;
}
.skin-goodcompany .firm-mark__words strong { font-family: "Newsreader", serif; font-size: 1.25rem; font-weight: 500; }
.skin-goodcompany .firm-mark__words small { letter-spacing: 0.08em; }
.skin-goodcompany .demo-navigation a { font-size: 0.78rem; }
.skin-goodcompany .demo-header__cta { border-color: var(--accent); border-radius: 100%; background: var(--accent); color: #fff8f2; }
.skin-goodcompany .demo-header__cta:hover { background: var(--ink); }

.gc-hero,
.gc-thesis,
.gc-questions,
.gc-work,
.gc-approach,
.gc-contact { width: min(90vw, 88rem); margin-inline: auto; }
.gc-hero {
  min-height: calc(100vh - 9.5rem);
  padding-block: clamp(2.5rem, 5vw, 5rem);
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  grid-template-rows: 1fr auto;
  gap: 1.5rem;
  align-items: center;
}
.gc-hero__copy { grid-column: 1 / 7; grid-row: 1; position: relative; z-index: 2; }
.gc-kicker { font-size: 0.66rem; font-weight: 600; letter-spacing: 0.15em; text-transform: uppercase; }
.gc-hero h1 {
  max-width: 11.5ch;
  margin-bottom: 1.8rem;
  font-family: "Newsreader", serif;
  font-size: clamp(4rem, 7vw, 8rem);
  font-weight: 400;
  letter-spacing: -0.055em;
  line-height: 0.88;
}
.gc-hero__copy > p:not(.gc-kicker) { max-width: 35rem; color: var(--muted); font-family: "DM Sans", sans-serif; font-size: 1.05rem; }
.gc-link { display: inline-flex; gap: 1.2rem; align-items: center; padding-bottom: 0.25rem; border-bottom: 1px solid currentColor; color: var(--accent); font-family: "DM Sans", sans-serif; font-size: 0.78rem; font-weight: 600; letter-spacing: 0.06em; text-decoration: none; text-transform: uppercase; }
.gc-hero__image { grid-column: 7 / 13; grid-row: 1; height: min(68vh, 48rem); margin: 0; position: relative; }
.gc-hero__image::before { content: ""; position: absolute; inset: 1.2rem -1.2rem -1.2rem 1.2rem; z-index: -1; border: 1px solid var(--accent); }
.gc-hero__image img { width: 100%; height: 100%; display: block; object-fit: cover; object-position: 58% center; filter: saturate(0.82) contrast(1.02); }
.gc-hero__image figcaption { position: absolute; right: 1rem; bottom: 1rem; padding: 0.55rem 0.7rem; background: rgba(244,238,233,0.9); font-family: "DM Sans", sans-serif; font-size: 0.65rem; }
.gc-edition { grid-column: 1 / -1; margin: 0; display: flex; justify-content: space-between; border-top: 1px solid var(--ink); padding-top: 0.8rem; color: var(--muted); font-family: "DM Sans", sans-serif; font-size: 0.65rem; line-height: 1.4; text-transform: uppercase; }

.gc-thesis { width: 100%; padding: clamp(5rem, 10vw, 11rem) max(5vw, calc((100vw - 88rem) / 2)); background: var(--dark); color: var(--light-on-dark); }
.gc-thesis .gc-kicker { color: #d8a8b8; }
.gc-thesis blockquote { max-width: 27ch; margin: 2rem 0 0; font-family: "Newsreader", serif; font-size: clamp(2.7rem, 5.4vw, 6.2rem); font-weight: 400; letter-spacing: -0.045em; line-height: 1; }
.gc-questions { padding-block: clamp(5rem, 9vw, 9rem); display: grid; grid-template-columns: repeat(3, 1fr); }
.gc-questions article { padding: 0 2rem 3rem; border-left: 1px solid var(--ink); }
.gc-questions article:first-child { padding-left: 0; border-left: 0; }
.gc-questions span { color: var(--accent); font-family: "Newsreader", serif; font-size: 1.4rem; font-style: italic; }
.gc-questions h2 { max-width: 12ch; margin-top: 5rem; font-family: "Newsreader", serif; font-size: clamp(2rem, 3.2vw, 3.6rem); line-height: 0.98; }
.gc-questions p { max-width: 25rem; color: var(--muted); font-family: "DM Sans", sans-serif; }

.gc-work { width: 100%; padding: clamp(5rem, 9vw, 9rem) max(5vw, calc((100vw - 88rem) / 2)); display: grid; grid-template-columns: 0.75fr 1.25fr; gap: clamp(3rem, 8vw, 9rem); background: #e8d9d1; }
.gc-work__intro h2 { max-width: 9ch; font-family: "Newsreader", serif; font-size: clamp(3rem, 5vw, 5.8rem); line-height: 0.95; }
.gc-work__list { border-top: 1px solid var(--ink); }
.gc-work__list article { padding: 1.5rem 0; display: grid; grid-template-columns: 9rem 1fr; gap: 1rem; border-bottom: 1px solid var(--line); }
.gc-work__list article > p { color: var(--accent); font-family: "DM Sans", sans-serif; font-size: 0.68rem; font-weight: 600; letter-spacing: 0.1em; text-transform: uppercase; }
.gc-work__list h3 { margin: 0 0 0.6rem; font-family: "Newsreader", serif; font-size: 1.7rem; font-weight: 500; line-height: 1.05; }
.gc-work__list span { grid-column: 2; color: var(--muted); font-family: "DM Sans", sans-serif; }
.gc-approach { padding-block: clamp(5rem, 8vw, 8rem); }
.gc-approach ol { margin: 2rem 0 0; padding: 0; display: grid; grid-template-columns: repeat(5, 1fr); border-top: 1px solid var(--ink); list-style: none; }
.gc-approach li { min-height: 12rem; padding: 1rem; display: flex; flex-direction: column; justify-content: space-between; border-right: 1px solid var(--line); }
.gc-approach li:first-child { padding-left: 0; }
.gc-approach li:last-child { border-right: 0; }
.gc-approach li span { color: var(--accent); font-family: "Newsreader", serif; font-style: italic; }
.gc-approach li strong { max-width: 12ch; font-family: "DM Sans", sans-serif; font-weight: 500; }
.gc-contact { width: 100%; padding: clamp(5rem, 9vw, 9rem) max(5vw, calc((100vw - 88rem) / 2)); display: grid; grid-template-columns: 0.35fr 1.15fr 0.65fr; gap: clamp(2rem, 6vw, 6rem); background: var(--accent); color: #fff8f2; }
.gc-contact h2 { margin: 0; font-family: "Newsreader", serif; font-size: clamp(3rem, 5.8vw, 6.5rem); line-height: 0.94; }
.gc-contact div { align-self: end; font-family: "DM Sans", sans-serif; }
.gc-contact .gc-link { color: #fff8f2; }
.skin-goodcompany .demo-footer { background: #2c1720; color: #fff8f2; }
.skin-goodcompany .demo-footer .firm-mark__symbol { background: #fff8f2; color: var(--accent); }
.skin-goodcompany .regulatory-placeholder { border-color: rgba(255,248,242,0.4); }
.skin-goodcompany .demo-footer__end { color: rgba(255,248,242,0.65); }

.skin-fieldwork a:focus-visible,
.skin-fieldwork button:focus-visible { outline-color: #164bff; }
.skin-goodcompany a:focus-visible,
.skin-goodcompany button:focus-visible { outline-color: #d58ca5; }

@media (max-width: 980px) {
  .skin-aster .home-hero { grid-template-columns: 1fr; }
  .fw-hero { min-height: auto; grid-template-columns: 1fr; }
  .fw-dashboard { box-shadow: 0.65rem 0.65rem 0 #b9c9ff; }
  .fw-section-head, .fw-contact { grid-template-columns: 1fr; }
  .fw-contact div { max-width: 38rem; }
  .gc-hero { min-height: auto; }
  .gc-hero__copy { grid-column: 1 / 8; }
  .gc-hero__image { grid-column: 7 / 13; opacity: 0.78; }
  .gc-hero__copy { padding: 2rem 0; }
  .gc-hero h1 { text-shadow: 0 0 2rem var(--bg); }
  .gc-work { grid-template-columns: 1fr; }
  .gc-work__intro h2 { max-width: 13ch; }
  .gc-contact { grid-template-columns: 1fr; }
  .gc-contact div { max-width: 38rem; }
}

@media (max-width: 700px) {
  .skin-fieldwork .demo-header,
  .skin-goodcompany .demo-header { min-height: 5.4rem; }
  .skin-fieldwork .demo-navigation,
  .skin-goodcompany .demo-navigation { top: 5.4rem; }
  .fw-hero h1 { font-size: clamp(3.1rem, 14vw, 5rem); }
  .fw-dashboard__head { gap: 1rem; }
  .fw-dashboard__head span:last-child { text-align: right; }
  .fw-metrics { grid-template-columns: 1fr; }
  .fw-metrics article { min-height: 11rem; border-right: 0; border-bottom: 2px solid var(--ink); }
  .fw-metrics article:last-child { border-bottom: 0; }
  .fw-metrics strong { margin-top: 2.5rem; }
  .fw-signal { grid-template-columns: 1fr; }
  .fw-decision-grid { grid-template-columns: 1fr; }
  .fw-decision-grid article,
  .fw-decision-grid article:nth-child(2n),
  .fw-decision-grid article:nth-last-child(-n+2) { min-height: 17rem; border-right: 0; border-bottom: 2px solid var(--ink); }
  .fw-decision-grid article:last-child { border-bottom: 0; }
  .fw-service-grid { grid-template-columns: 1fr; }
  .fw-service-grid article,
  .fw-service-grid article + article { padding: 1.5rem 0 2.5rem; border-right: 0; border-bottom: 1px solid rgba(255,255,255,0.25); }
  .fw-service-grid h3 { margin-top: 2rem; }
  .fw-process li { grid-template-columns: 3.5rem 1fr; }
  .skin-fieldwork .demo-footer { grid-template-columns: 1fr; }

  .gc-hero { display: flex; flex-direction: column; align-items: stretch; }
  .gc-hero__copy { order: 1; }
  .gc-hero__image { height: 28rem; order: 2; opacity: 1; }
  .gc-edition { order: 3; }
  .gc-hero h1 { max-width: 12ch; font-size: clamp(3.6rem, 15vw, 5.5rem); text-shadow: none; }
  .gc-questions { grid-template-columns: 1fr; }
  .gc-questions article,
  .gc-questions article:first-child { padding: 2rem 0; border-left: 0; border-top: 1px solid var(--ink); }
  .gc-questions h2 { margin-top: 2.5rem; }
  .gc-work__list article { grid-template-columns: 1fr; }
  .gc-work__list span { grid-column: 1; }
  .gc-approach ol { grid-template-columns: 1fr; }
  .gc-approach li,
  .gc-approach li:first-child { min-height: auto; padding: 1rem 0; flex-direction: row; gap: 2rem; border-right: 0; border-bottom: 1px solid var(--line); }
  .skin-goodcompany .demo-footer { grid-template-columns: 1fr; }
}
