/* Studio Lisa Schroth — sole active stylesheet.
   Typography and spacing are shared across all pages; no page-specific scales. */
:root {
  --font: Arial, Helvetica, sans-serif;
  --text: 1.0625rem; --text-small: .9375rem; --nav-text: .9375rem;
  --h1: 2.75rem; --h2: 1.875rem; --h3: 1.375rem;
  --text-line: 1.65; --h1-line: 1.12; --h2-line: 1.18; --h3-line: 1.3;
  --weight-text: 400; --weight-heading: 500; --weight-label: 600;
  --ink: #343230; --muted: #605b57; --line: #ded8d3;
  --paper: #fff; --cream: #f0e9e3; --card-line: #e4dcd5;
  --page-max: 70rem; --content-max: 62.16rem;
  --page-gutter: 6%; --content-gutter: 5.6%;
  --home-hero-height: 25rem;
  --header-height: calc(2.75rem + 1.5 * var(--nav-text) + .6rem + 1px);
  --intro-height: calc(var(--home-hero-height) - var(--header-height));
  --section-space: 2.25rem; --card-padding: 1.375rem; --grid-gap: 1.25rem;
  --space-1: .5rem; --space-2: 1rem; --space-3: 1.5rem; --space-4: 2rem;
  --radius: 1.5rem; --card-radius: var(--radius);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 7rem; }
body { margin: 0 auto; width: calc(100% - 2 * var(--page-gutter)); max-width: var(--page-max); padding: 1.25rem 0; background: var(--paper); color: var(--ink); font-family: var(--font); font-size: var(--text); font-weight: var(--weight-text); line-height: var(--text-line); }
button,input,textarea,select { font: inherit; }
h1,h2,h3 { margin: 0; font-weight: var(--weight-heading); letter-spacing: -.035em; overflow-wrap: break-word; }
h1 { font-size: var(--h1); line-height: var(--h1-line); }
h2 { font-size: var(--h2); line-height: var(--h2-line); }
h3 { font-size: var(--h3); line-height: var(--h3-line); }
p { margin: var(--space-2) 0; color: var(--muted); }
p,li,.offer-description { font-size: var(--text); line-height: var(--text-line); }
strong { font-weight: var(--weight-label); }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
a:focus-visible,button:focus-visible,summary:focus-visible { outline: 2px solid currentColor; outline-offset: .3rem; }
.wide,.reading-width { width: 100%; max-width: var(--content-max); margin-inline: auto; }
/* Inner sections use one gap rather than two adjacent blocks of padding. */
.compact-section,.section { padding: 0 var(--content-gutter); }
main>.compact-section+*,main>.section+* { margin-top: var(--section-space); }
.page-intro,.legal-hero,.about-intro,.detail-intro {
  min-height: var(--intro-height);
  padding: var(--section-space) var(--content-gutter);
  display: flex; flex-direction: column; justify-content: center;
}
.tinted { padding: var(--section-space) var(--card-padding); }
/* Colored content panels follow the homepage contact panel's inner frame. */
.tinted,.closing { width: calc(100% - 2 * var(--content-gutter)); max-width: var(--content-max); margin-inline: auto; }
.compact-section .wide>h2 { margin-bottom: var(--space-3); }
.reading-section p,.approach-fields p { max-width: 65ch; }
.kicker,.list-label,.small-print,.qual-line,.contact-disclaimer p,.site-footer,.site-footer p,.site-footer a { font-size: var(--text-small); line-height: var(--text-line); }
.kicker,.list-label { font-weight: var(--weight-label); margin: 0 0 var(--space-2); }
.kicker:empty { display: none; }
/* Header is shared, including inside the homepage hero. */
.site-header { position: relative; z-index: 20; display: flex; justify-content: space-between; align-items: center; gap: var(--space-3); width: 100%; padding: 1.375rem 2.25%; }
.brand strong,.site-nav { font-size: var(--nav-text); line-height: 1.5; }
.brand strong { letter-spacing: -.03em; white-space: nowrap; }
.brand small { display: none; }
.site-nav { display: flex; align-items: center; gap: 1.25rem; }
.site-nav a { padding: .3rem 0; border-bottom: 1px solid transparent; }
.site-nav [aria-current=page] { border-bottom: 1px solid currentColor; }
.nav-toggle { display: none; width: 2.75rem; height: 2.75rem; padding: .75rem; border: 1px solid currentColor; border-radius: 50%; background: transparent; color: inherit; flex-shrink: 0; }
.nav-toggle span { display: block; height: 1px; background: currentColor; width: 1rem; margin: .25rem 0; }
/* All controls and standalone links use the body scale. */
.button { display: inline-flex; align-items: center; justify-content: center; padding: .6875rem 1.25rem; min-height: 2.75rem; border: 1px solid var(--line); border-radius: 99rem; background: var(--paper); color: var(--ink); font-size: var(--text); line-height: 1.5; font-weight: var(--weight-heading); text-align: center; }
.button:hover { background: var(--cream); }
.text-link,.email-link { font-size: var(--text); line-height: var(--text-line); display: inline-block; color: var(--ink); border-bottom: 1px solid #a69d96; padding-bottom: .3125rem; }
.text-link { margin-top: var(--space-2); }
.email-link { overflow-wrap: anywhere; max-width: 100%; }
/* Blur is confined to decorative image layers. Text stays on a separate layer. */
.reference-hero,.page-intro,.legal-hero { position: relative; isolation: isolate; overflow: hidden; border-radius: var(--radius); color: white; background: #102e24; }
.reference-hero::before,.page-intro::before,.legal-hero::before { content: ''; position: absolute; inset: 0; z-index: -2; pointer-events: none; background: linear-gradient(0deg,rgba(9,35,23,.55),rgba(9,35,23,.3)),url('assets/rainforest-hero.png') center/cover; }
.page-intro::before,.legal-hero::before { inset: -1.25rem; filter: blur(.5rem); background-image: linear-gradient(rgba(12,42,29,.4),rgba(12,42,29,.4)),url('assets/rainforest-hero.png'); }
.page-intro::after,.legal-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; background: rgba(255,255,255,.035); backdrop-filter: blur(.75rem); -webkit-backdrop-filter: blur(.75rem); }
.page-intro p,.legal-hero p { color: inherit; }
.reference-hero { min-height: var(--home-hero-height); display: flex; flex-direction: column; justify-content: space-between; align-items: center; text-align: center; padding-bottom: 2.8125rem; }
.reference-title { padding: var(--section-space) var(--content-gutter); }
.reference-title h1 { max-width: 60rem; }
.reference-title .button { margin-top: 1.75rem; }

.page-intro h1 { max-width: 75rem; }
.intro-copy { max-width: 65ch; margin-top: var(--space-3); }
.intro-copy p:last-child { margin-bottom: 0; }
/* Repeated cards share type, padding, borders and gaps. */
.reference-tiles,.horizontal-fields,.note-grid,.approach-fields { display: grid; gap: var(--grid-gap); }
.reference-tiles,.note-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
.horizontal-fields { grid-template-columns: repeat(3,minmax(0,1fr)); }
.reference-tile,.color-field,.editorial-note,.approach-fields details,.legal-content { min-width: 0; padding: var(--card-padding); background: var(--cream); border: 1px solid var(--card-line); border-radius: var(--card-radius); }
.reference-tile:nth-child(2),.color-field:nth-child(2),.editorial-note:nth-child(even) { background: var(--paper); }
.reference-tile { display: block; border-radius: var(--radius); }
.reference-tile:hover { border-color: var(--muted); }
.reference-tile strong { display: block; font-size: var(--h3); line-height: var(--h3-line); font-weight: var(--weight-heading); letter-spacing: -.035em; }
.offer-description { display: block; margin-top: var(--space-2); font-weight: var(--weight-text); }
.color-field p:last-child,.editorial-note p:last-child { margin-bottom: 0; }
.reference-intro { max-width: 65ch; padding: 0 var(--space-3); text-align: center; margin: var(--section-space) auto; }
.reference-offers,.reference-banner,.legal-note { width: calc(100% - 2 * var(--content-gutter)); max-width: var(--content-max); margin-inline: auto; }
.reference-offers { margin-bottom: var(--section-space); }
.reference-offers>h2 { text-align: center; margin-bottom: var(--space-3); }
.reference-banner,.closing { padding: var(--section-space) var(--card-padding); background: var(--cream); border: 1px solid var(--card-line); border-radius: var(--radius); }

.reference-banner { margin-bottom: var(--section-space); }
.tinted,.about-intro { background: var(--cream); border-radius: var(--radius); }
.facts { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-4); padding: var(--space-3) 0; border-block: 1px solid var(--line); }
.facts p { margin: 0; color: var(--ink); }
.portrait-layout { display: grid; grid-template-columns: .7fr 1.3fr; gap: var(--section-space); align-items: center; }
.about-photo { margin: 0; width: 100%; max-width: 20.625rem; border-radius: var(--card-radius); overflow: hidden; }
.about-photo img { width: 100%; height: auto; }
.approach-fields summary { cursor: pointer; }
.approach-fields summary h3 { display: inline; }
.approach-fields .kicker { display: block; }
.qualification-list { list-style: none; padding: 0; display: grid; gap: var(--space-1); color: var(--muted); }
.qualification-list li { padding-left: 1.25rem; position: relative; }
.qualification-list li::before { content: '—'; position: absolute; left: 0; }
.gaps-small { padding: var(--section-space) var(--content-gutter) 0; border-top: 1px solid var(--line); }
.contact-minimal { padding: var(--section-space) var(--content-gutter); }
.contact-options { display: flex; flex-wrap: wrap; gap: .75rem; margin: 0; }
.contact-email { margin: 1rem 0 0; font-size: var(--text-small); color: var(--muted); }
.contact-email a { overflow-wrap: anywhere; }
.contact-email a:hover { text-decoration: underline; }
.page-contact .contact-minimal { padding-top: 1.75rem; padding-bottom: .75rem; }
.legal-note { padding: 0 0 var(--section-space); }
.contact-disclaimer { border-top: 1px solid var(--line); padding-top: var(--space-3); }
.legal-block+.legal-block { margin-top: var(--section-space); }
.legal-block a { text-decoration: underline; overflow-wrap: anywhere; }
.site-footer { margin-top: var(--section-space); display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-3); padding: 1.75rem var(--content-gutter); border-top: 1px solid var(--line); color: var(--muted); }
.site-footer p { margin: 0; }
.footer-links { display: flex; flex-wrap: wrap; gap: var(--space-3); }
.skip-link { position: absolute; top: -10rem; left: 1.25rem; }
.skip-link:focus { top: .5rem; z-index: 100; background: white; padding: .5rem; }
/* Accessible, live-text diagrams using the site's existing type and palette. */
.intro-action { margin-top: var(--space-3); }
.section-heading { max-width: 48rem; margin: 0 auto var(--space-4); text-align: center; }
.section-heading p { margin-bottom: 0; }
.focus-map { position: relative; display: grid; grid-template-columns: minmax(0,1fr) minmax(0,.85fr) minmax(0,1fr); grid-template-areas: "perceive goal understand" "regulate goal act"; gap: var(--space-4) var(--space-3); align-items: stretch; }
.focus-map-lines { position: absolute; inset: 0; width: 100%; height: 100%; fill: none; stroke: #a69d96; stroke-width: 1; pointer-events: none; }
.focus-map-lines path { vector-effect: non-scaling-stroke; }
.focus-node { position: relative; padding: var(--card-padding); border: 1px solid var(--card-line); border-radius: var(--card-radius); background: var(--cream); }
.focus-node p { margin-bottom: 0; }
.focus-perceive { grid-area: perceive; }
.focus-understand { grid-area: understand; background: var(--paper); }
.focus-regulate { grid-area: regulate; background: var(--paper); }
.focus-act { grid-area: act; }
.focus-symbol { display: block; width: 2.25rem; height: 2.25rem; margin-bottom: var(--space-2); color: var(--ink); }
.focus-symbol svg { width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.35; stroke-linecap: round; stroke-linejoin: round; }
.focus-goal { grid-area: goal; position: relative; align-self: center; padding: var(--space-3) var(--space-2); text-align: center; background: var(--paper); border-block: 1px solid var(--line); }
.focus-goal .kicker { color: var(--muted); }
.focus-goal-copy { color: var(--ink); font-size: var(--h3); line-height: var(--h3-line); font-weight: var(--weight-heading); margin: 0; }
.journey { list-style: none; padding: 0; margin: var(--space-4) 0; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-4); }
.journey-step { position: relative; min-width: 0; }
.journey-number { position: relative; display: flex; align-items: center; justify-content: center; width: 3rem; height: 3rem; margin-bottom: var(--space-3); border-radius: 50%; background: var(--cream); border: 1px solid var(--card-line); font-size: var(--text-small); }
.journey-step:not(:last-child)::before { content: ''; position: absolute; top: 1.5rem; left: 4rem; right: 0; border-top: 1px solid var(--line); }
.journey-step:not(:last-child)::after { content: ''; position: absolute; top: 1.3125rem; right: 0; width: .375rem; height: .375rem; border-top: 1px solid #a69d96; border-right: 1px solid #a69d96; transform: rotate(45deg); }
.journey-step p { margin-bottom: 0; }
.journey-summary { padding: var(--card-padding); border: 1px solid var(--card-line); border-radius: var(--card-radius); background: linear-gradient(120deg,#ffffffcc,#f0e9e3a6); box-shadow: inset 0 1px 0 white; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); }
.journey-summary p { margin: 0; }
.journey-summary .journey-summary-intro { margin-bottom: var(--space-3); }
.journey-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: var(--space-2); }
.journey-fact { display: flex; align-items: center; gap: .75rem; min-width: 0; }
.journey-fact+ .journey-fact { border-left: 1px solid var(--line); padding-left: var(--space-2); }
.journey-fact>span { flex: 0 0 2rem; height: 2rem; }
.journey-fact strong,.journey-fact p>span { display: block; }
.journey-fact p,.journey-summary-note { font-size: var(--text-small); }
.journey-summary-note { padding-top: var(--space-3); }
.journey-fact svg { width: 100%; height: 100%; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; }
.supplementary { margin-top: var(--section-space); }
.supplementary-grid { padding-top: var(--space-3); border-top: 1px solid var(--line); display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-4); }
.supplementary p,.supplementary .text-link { font-size: var(--text-small); }
.supplementary p:first-child { margin-top: 0; }
.supplementary .text-link { margin-top: 0; }
@media(max-width:60rem) {
  .journey-facts { grid-template-columns: 1fr; }
  .journey-fact+ .journey-fact { border-left: 0; border-top: 1px solid var(--line); padding: var(--space-2) 0 0; }
  .focus-map { grid-template-columns: repeat(2,minmax(0,1fr)); grid-template-areas: "perceive understand" "goal goal" "regulate act"; gap: var(--grid-gap); }
  .focus-map-lines { display: none; }
  .focus-goal { max-width: 28rem; justify-self: center; padding: var(--space-3); }
}
@media(max-width:40rem) {
  .focus-map { grid-template-columns: 1fr; grid-template-areas: "perceive" "understand" "regulate" "act" "goal"; }
  .focus-goal { width: 100%; }
  .journey,.supplementary-grid { grid-template-columns: 1fr; }
  .journey-step { padding-left: 4rem; }
  .journey-number { position: absolute; left: 0; top: 0; }
  .journey-step:not(:last-child)::before { left: 1.5rem; right: auto; top: 3.75rem; bottom: -1.25rem; border-top: 0; border-left: 1px solid var(--line); }
  .journey-step:not(:last-child)::after { display: none; }
}

/* Central breakpoints: tablet then phone. No page-specific type overrides. */
@media(max-width:75rem) {
  :root { --header-height: 5.5rem; --h1: 2.5rem; --h2: 1.875rem; --h3: 1.375rem; --text: 1.0625rem; }
  .horizontal-fields { grid-template-columns: 1fr; }
  .nav-toggle { display: block; }
  .site-nav { display: none; position: absolute; top: 100%; left: 0; right: 0; padding: var(--space-3); background: white; color: var(--ink); border: 1px solid var(--line); border-radius: var(--card-radius); box-shadow: 0 1rem 2rem #34323015; }
  .site-nav.is-open { display: flex; flex-direction: column; align-items: stretch; }
}
@media(max-width:40rem) {
  :root { --header-height: 5rem; --home-hero-height: 23.5rem; --h1: 2rem; --h2: 1.75rem; --h3: 1.375rem; --text: 1.0625rem; --text-small: .9375rem; --nav-text: 1rem; --page-gutter: .625rem; --content-gutter: 1.5rem; --section-space: 2.25rem; --card-padding: 1.5rem; --grid-gap: 1rem; }
  body { padding: .625rem 0; }
  .site-header { padding: 1.125rem .875rem; gap: var(--space-2); }
  
  .reference-tiles,.note-grid,.portrait-layout { grid-template-columns: 1fr; }
  .reference-offers,.reference-banner,.legal-note,.tinted,.closing { width: 100%; }
  .about-photo { max-width: 16.25rem; }
  
  .facts,.contact-options { display: grid; }
  .site-footer { padding: 1.5rem; }
}
@media(prefers-reduced-motion:reduce) { html { scroll-behavior: auto; } }
