:root {
  --bg: #fcfbf8;
  --surface: #ffffff;
  --text: #161616;
  --muted: rgba(22,22,22,0.64);
  --line: rgba(22,22,22,0.10);
  --olive: #3f6a56;
  --terracotta: #c65b3a;
  --sand: #efe1c6;
  --shadow: 0 26px 80px rgba(20, 16, 12, 0.08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  color: var(--text);
  background:
    radial-gradient(circle at 10% 0%, rgba(198,91,58,.14), transparent 34%),
    radial-gradient(circle at 90% 10%, rgba(63,106,86,.12), transparent 38%),
    var(--bg);
}
a { color: inherit; text-decoration: none; }
.page { width: min(1180px, calc(100% - 28px)); margin: 0 auto; padding: 26px 0 72px; }
.hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
}
.hero-copy,
.hero-mosaic {
  align-self: start;
  min-width: 0;
}
.hero-copy, .mosaic-card, .project, .service, .process-copy, .process-list article, .notes-grid article, .footer-trust article {
  border: 1px solid var(--line);
  background: var(--surface);
  backdrop-filter: none;
  box-shadow: var(--shadow);
}
.hero-copy {
  padding: 28px 30px 30px;
  border-radius: 28px;
  min-height: 0;
  display: flex;
  flex-direction: column;
}
.brand { display: inline-flex; align-items: center; gap: 12px; margin-bottom: 22px; font-weight: 700; }
.brand img { width: 48px; height: 48px; }
.eyebrow, .tag { display: inline-flex; width: fit-content; padding: 7px 12px; border-radius: 999px; text-transform: uppercase; letter-spacing: .08em; font-size: .76rem; }
.eyebrow, .tag { background: rgba(63,106,86,.10); color: var(--olive); }
.eyebrow.soft { background: rgba(198,91,58,.12); color: var(--terracotta); }
.hero h1, .section-head h2, .process-copy h2 { font-family: Georgia, "Times New Roman", serif; letter-spacing: -0.02em; }
.hero h1 {
  margin: 14px 0 12px;
  font-size: clamp(1.85rem, 3.1vw, 2.85rem);
  line-height: 1.1;
}
.hero p, .project p, .service p, .process-copy p, .process-list p, .notes-grid p, .footer-trust p { color: var(--muted); line-height: 1.82; }
.mosaic-card, .process-copy, .notes-grid article { overflow: hidden; }
.mosaic-card img, .process-copy img, .notes-grid img {
  width: 100%; display: block; border-radius: 22px; object-fit: cover; background: #f5efe6;
}
.article-cover {
  width: 100%; display: block; margin: 16px 0 0; border-radius: 24px; border: 1px solid rgba(35, 35, 31, 0.08);
  aspect-ratio: 16 / 10; object-fit: cover; background: #f5efe6;
}
.mosaic-card img { margin-bottom: 16px; }
.process-copy img { margin-bottom: 18px; }
.mosaic-card img { aspect-ratio: 16 / 10; }
.process-copy img { aspect-ratio: 16 / 10; }
.notes-grid img { aspect-ratio: 16 / 11; margin-bottom: 16px; border: 1px solid rgba(35, 35, 31, 0.08); }
.nav { display: flex; flex-wrap: wrap; gap: 10px; margin-top: auto; padding-top: 28px; }
.nav a {
  padding: 10px 12px;
  border-radius: 12px;
  border: 1px solid var(--line);
  background: rgba(22, 22, 22, 0.05);
  color: rgba(22, 22, 22, 0.82);
}
.nav a:hover,
.nav a:focus-visible,
.subpage-nav a:hover,
.subpage-nav a:focus-visible {
  outline: none;
  border-color: rgba(95, 114, 93, 0.35);
  box-shadow: 0 0 0 4px rgba(95, 114, 93, 0.12);
  color: var(--text);
}
.hero-mosaic {
  display: grid;
  gap: 16px;
  grid-auto-rows: minmax(0, auto);
  align-content: start;
}
.mosaic-card {
  padding: 20px 22px 22px;
  border-radius: 28px;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
}
.mosaic-card span { color: var(--muted); }
.mosaic-card strong { margin-top: 10px; font-size: 1.55rem; line-height: 1.3; font-family: Georgia, "Times New Roman", serif; }
.warm { background: linear-gradient(180deg, rgba(230,214,190,.9), rgba(255,255,255,.62)); }
.soft { background: linear-gradient(180deg, rgba(255,255,255,.82), rgba(214,225,213,.72)); }
.accent { background: linear-gradient(180deg, rgba(187,119,81,.18), rgba(255,255,255,.64)); }
.section { margin-top: 26px; }
.project-grid, .service-grid, .notes-grid, .footer-trust {
  display: grid;
  gap: 18px;
  align-items: start;
}
.project-grid { grid-template-columns: 1.18fr .82fr .82fr; }
.project, .service, .process-copy, .process-list article, .notes-grid article, .footer-trust article { padding: 24px; border-radius: 28px; }
.project-large { background: linear-gradient(180deg, rgba(95,114,93,.92), rgba(95,114,93,.76)); color: white; }
.project-large p { color: rgba(255,255,255,.82); }
.section-head h2, .process-copy h2 { margin: 12px 0 0; font-size: clamp(1.95rem, 3vw, 2.72rem); line-height: 1.14; }
.service-grid { grid-template-columns: repeat(4,minmax(0,1fr)); }
.process-section {
  display: grid;
  /* Stacked: removes dead space when copy column is taller than the card stack */
  grid-template-columns: 1fr;
  gap: 16px;
  align-items: start;
}
.process-list { display: grid; gap: 18px; }
.notes-grid, .footer-trust { grid-template-columns: repeat(3,minmax(0,1fr)); }
.footer-links { display: grid; grid-template-columns: repeat(auto-fit,minmax(150px,1fr)); gap: 18px; }
.footer-links a { padding: 16px 18px; border: 1px solid var(--line); border-radius: 20px; background: rgba(255,255,255,0.74); text-align: center; color: var(--muted); }
.footer-links a:hover, .footer-links a:focus-visible {
  outline: none;
  transform: translateY(-1px);
  border-color: rgba(187,119,81,.25);
}
.subpage-body { margin: 0; font-family: "Segoe UI", Arial, sans-serif; color: var(--text); background: var(--bg); }
.subpage-shell { width: min(940px, calc(100% - 24px)); margin: 0 auto; padding: 24px 0 56px; }
.subpage-header, .subpage-main, .subpage-aside, .footer-links a { border: 1px solid var(--line); border-radius: 28px; background: rgba(255,255,255,0.84); }
.subpage-header { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 22px; margin-bottom: 18px; }
.subpage-nav { display: flex; flex-wrap: wrap; gap: 10px; }
.subpage-nav a { padding: 10px 14px; border-radius: 999px; border: 1px solid var(--line); color: var(--muted); }
.subpage-layout {
  display: grid;
  grid-template-columns: 1fr;
  gap: 14px;
}
.subpage-main, .subpage-aside { padding: 24px; }
.subpage-main h1, .subpage-main h2 { font-family: Georgia, "Times New Roman", serif; }
.subpage-main h1 { margin: 8px 0 10px; font-size: clamp(1.62rem, 2.95vw, 2.62rem); line-height: 1.12; }
.subpage-main h2 { margin: 24px 0 10px; font-size: 1.55rem; }
.subpage-main p, .subpage-main li, .subpage-aside p { color: var(--muted); line-height: 1.85; }
.subpage-main ul { padding-left: 20px; }
.breadcrumb { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 8px; font-size: .92rem; }
.article-meta { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 8px 0 0; font-size: .92rem; }
.author-box {
  margin-top: 22px;
  padding: 18px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #faf8f4;
  color: #1a1a1a;
}
.author-box .author-role,
.author-box p {
  color: rgba(26, 26, 26, 0.78);
}
.article-hero {
  margin-bottom: 12px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--line);
}
.article-hero .eyebrow {
  border: 1px solid rgba(63, 106, 86, 0.35);
  background: rgba(63, 106, 86, 0.14);
  color: #2d4a3c;
}
.breadcrumb,
.article-meta {
  color: rgba(42, 42, 42, 0.82);
}
.site-footer {
  margin-top: 18px;
  padding: 18px 22px;
  border: 1px solid var(--line);
  border-radius: 22px;
  background: #faf8f4;
  line-height: 1.75;
  color: #1a1a1a;
}
.site-footer a {
  color: #5a3d28;
}
.site-footer-nav { display: flex; flex-wrap: wrap; gap: 10px 14px; margin-top: 10px; }
.related-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin-top: 12px;
}
.related-links a {
  flex: 1 1 160px;
  padding: 12px 14px;
  border: 1px solid var(--line);
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.92);
  color: #1a1a1a;
}
.related-links a:hover {
  border-color: rgba(63, 106, 86, 0.35);
  color: #2d4a3c;
}
.subpage-nav a.is-here {
  border-color: rgba(198, 91, 58, 0.45);
  color: var(--text);
  box-shadow: 0 0 0 3px rgba(198, 91, 58, 0.1);
}
.journal-mosaic {
  display: grid;
  gap: 20px;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
}
.journal-card {
  border-radius: 26px;
  border: 1px solid var(--line);
  background: linear-gradient(165deg, rgba(255, 255, 255, 0.95), rgba(239, 225, 198, 0.45));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  box-shadow: 0 22px 60px rgba(20, 16, 12, 0.1);
}
.journal-card img {
  width: 100%;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  display: block;
}
.journal-inset {
  padding: 16px 20px 20px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.journal-meta {
  font-size: 0.82rem;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  font-variant-numeric: tabular-nums;
}
.journal-card h3 {
  margin: 0;
  font-size: 1.18rem;
  line-height: 1.3;
  font-family: Georgia, "Times New Roman", serif;
}
.journal-card p {
  margin: 0;
  font-size: 0.96rem;
}
.journal-more {
  margin-top: 18px;
  text-align: right;
  font-size: 0.95rem;
}
.journal-more a {
  color: var(--terracotta);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.library-shell {
  padding-bottom: 72px;
}
.library-hero {
  padding-bottom: 18px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--line);
}
.library-hero h1 {
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.65rem, 2.8vw, 2.35rem);
  margin: 10px 0 0;
}
.library-grid {
  display: grid;
  gap: 20px;
}
.library-card {
  display: grid;
  grid-template-columns: minmax(0, 200px) minmax(0, 1fr);
  gap: 18px;
  padding: 18px;
  border-radius: 22px;
  border: 1px solid var(--line);
  background: rgba(255, 255, 255, 0.92);
  align-items: center;
}
.library-card-media img {
  width: 100%;
  border-radius: 16px;
  aspect-ratio: 16 / 10;
  object-fit: cover;
  border: 1px solid rgba(22, 22, 22, 0.06);
}
.library-card-meta {
  font-size: 0.85rem;
  color: var(--muted);
  display: flex;
  flex-wrap: wrap;
  gap: 8px 12px;
}
.library-card-body h2 {
  margin: 0 0 6px;
  font-size: 1.22rem;
}
.library-card-body p {
  margin: 0 0 8px;
  font-size: 0.95rem;
}
.library-card-body p.library-excerpt {
  line-height: 1.72;
  margin-bottom: 12px;
}
.text-link {
  font-size: 0.92rem;
  color: var(--olive);
  text-decoration: underline;
  text-underline-offset: 3px;
}
.article-detail .article-deck {
  font-size: 1.1rem;
  line-height: 1.75;
}
.article-figure {
  margin: 0;
}
.author-role {
  font-size: 0.88rem;
  color: var(--muted);
  margin: 0 0 8px;
}
.prose-flow {
  max-width: 56rem;
}
.prose-flow h2 {
  margin-top: 1.6rem;
  margin-bottom: 0.35em;
}
.prose-flow h2:first-child {
  margin-top: 0;
}
.prose-flow p {
  margin: 0 0 1.1em;
  max-width: 46rem;
}
a.card-hit {
  display: block;
  color: inherit;
  text-decoration: none;
  min-height: 0;
}
a.card-hit:hover h2,
a.card-hit:hover h3,
a.card-hit:hover strong {
  text-decoration: underline;
  text-decoration-color: rgba(198, 91, 58, 0.45);
  text-underline-offset: 3px;
}
a.journal-hit {
  display: flex;
  flex-direction: column;
  min-height: 0;
  color: inherit;
  text-decoration: none;
}
a.journal-hit:hover h3 {
  text-decoration: underline;
  text-decoration-color: rgba(63, 106, 86, 0.5);
}
@media (max-width: 980px) {
  .hero, .project-grid, .service-grid, .process-section, .notes-grid, .journal-mosaic, .footer-trust, .footer-links, .subpage-layout, .library-card { grid-template-columns: 1fr; }
  .hero-mosaic { grid-auto-rows: minmax(0, auto); }
  .subpage-header { display: grid; }
}
@media (max-width: 640px) {
  .page { width: min(100% - 18px,1140px); padding: 18px 0 48px; }
  .hero-copy, .mosaic-card, .project, .service, .process-copy, .process-list article, .notes-grid article, .footer-trust article { padding: 20px; }
  .hero h1 { font-size: 1.95rem; }
}

/* --- Article detail: Wellnest “room journal” (aside first, magazine rhythm) --- */
.detail-pattern--wellnest .subpage-shell {
  width: min(1020px, calc(100% - 24px));
}
.detail-pattern--wellnest .subpage-main,
.detail-pattern--wellnest .subpage-aside {
  border-radius: 14px;
}
.detail-pattern--wellnest .subpage-main {
  box-shadow: 0 28px 70px rgba(20, 16, 12, 0.08);
  border: 1px solid rgba(187, 119, 81, 0.18);
  background: linear-gradient(180deg, rgba(255, 255, 255, 0.97), rgba(250, 248, 244, 0.92));
}
.detail-pattern--wellnest .article-hero {
  border-bottom: 0;
  padding-bottom: 0;
  margin-bottom: 20px;
}
.detail-pattern--wellnest .article-meta span,
.detail-pattern--wellnest .article-meta time {
  display: inline-block;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(63, 106, 86, 0.22);
  background: rgba(63, 106, 86, 0.08);
  font-size: 0.86rem;
}
.detail-pattern--wellnest .article-figure {
  margin: 12px -12px 16px;
  border-radius: 18px;
  overflow: hidden;
  border: 1px solid rgba(22, 22, 22, 0.08);
}
.detail-pattern--wellnest .article-figure img {
  display: block;
  width: 100%;
}
.detail-pattern--wellnest .prose-flow > p:first-of-type {
  font-size: 1.05rem;
}
.detail-pattern--wellnest .prose-flow > p:first-of-type::first-letter {
  float: left;
  font-family: Georgia, "Times New Roman", serif;
  font-size: 3.1rem;
  line-height: 0.82;
  padding-right: 10px;
  margin-top: 4px;
  color: #6b4a32;
}
.detail-pattern--wellnest .subpage-main h2 {
  font-family: ui-sans-serif, system-ui, "Segoe UI", Arial, sans-serif;
  font-weight: 650;
  letter-spacing: -0.01em;
  color: #2a241c;
}
.detail-pattern--wellnest .subpage-aside {
  background: rgba(255, 255, 255, 0.72);
  border-style: dashed;
}
@media (min-width: 900px) {
  .detail-pattern--wellnest .subpage-layout {
    grid-template-columns: minmax(200px, 240px) minmax(0, 1fr);
    gap: 20px;
    align-items: start;
  }
  .detail-pattern--wellnest .subpage-aside {
    order: -1;
  }
}

.detail-pattern--wellnest .detail-rail-note {
  margin: 0 0 14px;
  padding: 12px 14px;
  border-radius: 12px;
  font-size: 0.9rem;
  line-height: 1.6;
  font-style: italic;
  color: rgba(42, 36, 28, 0.82);
  background: rgba(239, 225, 198, 0.45);
  border: 1px solid rgba(187, 119, 81, 0.22);
}