/* ============================================================
   Jamie Fortin, LMFT — Custom CSS layer · candidate D, variant BRIEF
   (Warm California Modernism per the 2026-09 design brief.)
   Paste this ENTIRE file into the Custom CSS panel. Source of truth is
   git; never edit the panel directly. Squarespace 7.1.

   Site Styles by hand (values in mockups/mock.css): palette, fonts,
   header layout. Section hooks key on data-section-id; readable names
   here map to the live site's hash ids at deploy time.
   ============================================================ */

@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500&display=swap");

:root {
  --jf-paper: #FAFAF7;
  --jf-linen: #F1ECE3;
  --jf-sage: #5C665B;
  --jf-ink: #303B34;
  --jf-gold: #B28B4C;
  --jf-bronze: #7C5B29;
  --jf-line: #E4DDD0;

  --jf-serif: var(--heading-font-font-family, "Instrument Serif"), Georgia, serif;
  --jf-sans: var(--body-font-font-family, "Inter"), system-ui, sans-serif;
  --jf-track: 0.16em;
}

/* ------------------------------------------------------------
   TYPE SYSTEM
   ------------------------------------------------------------ */
body, .sqs-html-content p, .sqs-html-content li {
  font-family: var(--jf-sans);
  font-size: 1.125rem;
  line-height: 1.65;
  color: var(--jf-ink);
}
.sqs-html-content h1, .sqs-html-content h2, .sqs-html-content h3,
.entry-title, .quote-block blockquote {
  font-family: var(--jf-serif);
  font-weight: 400;
  color: var(--jf-ink);
  letter-spacing: -0.005em;
}
.sqs-html-content h1 { font-size: clamp(2.8rem, 4.9vw, 4.4rem); line-height: 1.05; margin: 0 0 0.35em; }
.sqs-html-content h2 { font-size: clamp(2rem, 3.1vw, 2.9rem); line-height: 1.08; margin: 0 0 0.45em; }
.sqs-html-content h3 { font-size: clamp(1.45rem, 2vw, 1.85rem); line-height: 1.15; margin: 0 0 0.5em; }
/* Heading 4 = eyebrow label, sentence case. Uppercase is reserved for the nav. */
.sqs-html-content h4,
.blog-item-category-wrapper, .blog-item-meta-wrapper,
.sqs-block-image figcaption {
  font-family: var(--jf-sans);
  font-weight: 500;
  font-size: 0.875rem;
  letter-spacing: 0.01em;
  color: var(--jf-sage);
  margin: 0 0 1.1em;
  line-height: 1.5;
}
/* the short gold hairline under h1/h2 — the one place gold stays */
.sqs-html-content h1::after, .sqs-html-content h2::after {
  content: ""; display: block; width: 44px; height: 1px;
  background: var(--jf-gold); margin-top: 0.5em;
}
.sqs-html-content h2 + p, .sqs-html-content h1 + p { margin-top: 1.2em; }
.sqs-html-content p.sqsrte-large {
  font-family: var(--jf-serif);
  font-size: clamp(1.3rem, 1.7vw, 1.6rem);
  line-height: 1.4;
}
.sqs-html-content p.sqsrte-small { font-size: 0.95rem; color: var(--jf-sage); }

/* ------------------------------------------------------------
   LINKS + BUTTONS (functional color = charcoal)
   ------------------------------------------------------------ */
.sqs-html-content a {
  color: var(--jf-ink);
  text-decoration: none;
  border-bottom: 1px solid currentColor;
  padding-bottom: 1px;
}
.sqs-html-content p > a:only-child { font-family: var(--jf-sans); font-weight: 500; font-size: 1rem; }
.sqs-html-content p > a:only-child::after {
  content: "\2192"; display: inline-block; margin-left: 0.5em;
  transition: transform 0.2s ease;
}
.sqs-html-content p > a:only-child:hover::after { transform: translateX(4px); }

.sqs-block-button-element, .header-actions .btn {
  font-family: var(--jf-sans) !important;
  font-weight: 500 !important;
  font-size: 0.95rem !important;
  letter-spacing: 0.01em !important;
  border-radius: 0 !important;
  padding: 0.85em 1.5em !important;
  line-height: 1 !important;
  min-height: 44px;
  display: inline-flex !important; align-items: center;
  border: 1px solid var(--jf-ink) !important;
  transition: background 0.2s ease, color 0.2s ease;
}
.sqs-button-element--primary, .header-actions .btn { background: var(--jf-ink) !important; color: var(--jf-paper) !important; }
.sqs-button-element--primary::after, .header-actions .btn::after { content: "\2192"; margin-left: 0.7em; }
.sqs-button-element--primary:hover, .header-actions .btn:hover { background: var(--jf-sage) !important; border-color: var(--jf-sage) !important; }
.sqs-button-element--secondary { background: transparent !important; color: var(--jf-ink) !important; }
.sqs-button-element--secondary:hover { background: var(--jf-linen) !important; }

/* ------------------------------------------------------------
   HEADER
   ------------------------------------------------------------ */
.header { border-bottom: 1px solid var(--jf-line); }
.header-title-text a {
  font-family: var(--jf-serif) !important;
  font-size: 1.85rem !important;
  letter-spacing: -0.01em;
  color: var(--jf-ink) !important;
}
.header-title-text a::after {
  content: "LMFT";
  font-family: var(--jf-sans); font-weight: 500; font-size: 0.62rem; letter-spacing: 0.22em;
  color: var(--jf-sage); margin-left: 0.9em; vertical-align: 0.35em;
}
.header-nav-item a, .header-nav-folder-title {
  font-family: var(--jf-sans) !important; font-weight: 500 !important;
  font-size: 0.72rem !important; letter-spacing: 0.14em !important;
  text-transform: uppercase !important; color: var(--jf-ink) !important;
}
.header-nav-item--active a { border-bottom: 1px solid var(--jf-ink); padding-bottom: 2px; }

/* ------------------------------------------------------------
   SECTIONS (shared)
   ------------------------------------------------------------ */
.page-section { color: var(--jf-ink); }
[data-section-theme="light"] { background: var(--jf-linen); }
.content-wrapper { padding-top: 5.5vw; padding-bottom: 5.5vw; }
/* Framed photography is reserved for photographs from the practice
   (office, Sophie). Thumbnails and portraits go unframed. */
[data-section-id="jf-home-hero"] .sqs-block-image .image-block-outer-wrapper,
[data-section-id="jf-home-sophie"] .sqs-block-image .image-block-outer-wrapper,
.blog-item-content .sqs-block-image .image-block-outer-wrapper {
  background: var(--jf-linen);
  border: 1px solid var(--jf-line);
  padding: 10px;
}
.sqs-block-image figcaption { margin-top: 0.9em; letter-spacing: 0.1em; }

/* ------------------------------------------------------------
   HOME
   ------------------------------------------------------------ */
[data-section-id="jf-home-hero"] .content-wrapper { padding-top: 4vw; }
[data-section-id="jf-home-hero"] .sqs-html-content h1 { max-width: 11ch; }
[data-section-id="jf-home-hero"] .sqs-html-content p.sqsrte-large { max-width: 30ch; margin-top: 1em; }
[data-section-id="jf-home-hero"] .sqs-block-image img { aspect-ratio: 4 / 3; }
[data-section-id="jf-home-hero"] .fe-block-hero-button { margin-top: 0.4em; }

/* statement band: kept for parity with A/B/C, but compact */
[data-section-id="jf-home-statement"] .content-wrapper { padding-top: 3.5vw; padding-bottom: 3.5vw; }
[data-section-id="jf-home-statement"] .sqs-html-content { text-align: center; }
[data-section-id="jf-home-statement"] .sqs-html-content h2 {
  font-size: clamp(1.7rem, 2.4vw, 2.25rem); font-style: italic; line-height: 1.3;
  max-width: 34ch; margin: 0 auto;
}
[data-section-id="jf-home-statement"] .sqs-html-content h2::after { display: none; }

/* about: now second, portrait adjacent to the introduction */
[data-section-id="jf-home-about"] .sqs-block-image img { aspect-ratio: 4 / 5; object-position: 50% 20%; }
[data-section-id="jf-home-about"] .sqs-html-content p { max-width: 60ch; }
[data-section-id="jf-home-about"] .sqs-html-content ul { list-style: none; padding: 0; margin: 1.5em 0; max-width: 60ch; }
[data-section-id="jf-home-about"] .sqs-html-content li { font-size: 1rem; padding: 0.65em 0; border-top: 1px solid var(--jf-line); }
[data-section-id="jf-home-about"] .sqs-html-content li:last-child { border-bottom: 1px solid var(--jf-line); }

[data-section-id="jf-home-specialties"] .sqs-block-image .image-block-outer-wrapper { background: none; border: 0; padding: 0; }
[data-section-id="jf-home-specialties"] .sqs-block-image img { width: 32px; height: 32px; margin-bottom: 1.1em; }
[data-section-id="jf-home-specialties"] .sqs-html-content h3 { margin-bottom: 0.5em; }
[data-section-id="jf-home-specialties"] .sqs-html-content p { font-size: 1rem; max-width: 38ch; }
[data-section-id="jf-home-specialties"] .fe-block { padding-right: 3vw; }

[data-section-id="jf-home-articles"] .sqs-block-image img { aspect-ratio: 1; }
[data-section-id="jf-home-articles"] .sqs-html-content h3 { max-width: 24ch; }
[data-section-id="jf-home-articles"] .sqs-html-content p { font-size: 1rem; max-width: 50ch; }
[data-section-id="jf-home-articles"] .fe-block-articles-list .sqs-html-content p > a:only-child {
  display: block; font-family: var(--jf-serif); font-weight: 400; font-size: 1.3rem; line-height: 1.25;
  border-bottom: 1px solid var(--jf-line); padding: 0.7em 0;
}
[data-section-id="jf-home-articles"] .fe-block-articles-list .sqs-html-content p { margin: 0; max-width: none; }
[data-section-id="jf-home-articles"] .fe-block-articles-list .sqs-html-content p:first-child > a:only-child { border-top: 1px solid var(--jf-line); }
[data-section-id="jf-home-articles"] .fe-block-articles-list .sqs-html-content p > a:only-child::after { float: right; }

[data-section-id="jf-home-sophie"] .sqs-block-image img { aspect-ratio: 4 / 5; object-position: 50% 30%; }
[data-section-id="jf-home-sophie"] .sqs-html-content p { max-width: 50ch; }

[data-section-id="jf-home-close"] .content-wrapper { padding-top: 5vw; padding-bottom: 5vw; }
[data-section-id="jf-home-close"] .sqs-html-content { text-align: center; }
[data-section-id="jf-home-close"] .sqs-html-content h2::after { display: none; }
[data-section-id="jf-home-close"] .sqs-html-content h2 { margin-bottom: 0.3em; }
[data-section-id="jf-home-close"] .sqs-html-content p { color: var(--jf-sage); }

/* ------------------------------------------------------------
   FOOTER — practical details at reading size, not fine print
   ------------------------------------------------------------ */
footer.sections .page-section { border-top: 1px solid var(--jf-line); }
footer.sections .content-wrapper { padding-top: 3vw; padding-bottom: 3vw; }
footer.sections .sqs-html-content p { font-size: 1rem; line-height: 1.6; color: var(--jf-sage); margin: 0 0 0.25em; }
footer.sections .sqs-html-content p a { border-bottom-color: var(--jf-line); }
footer.sections .sqs-html-content h4 { color: var(--jf-ink); margin-bottom: 0.8em; }
footer.sections .fe-block-footer-right .sqs-html-content { text-align: right; }

/* ------------------------------------------------------------
   ARTICLES — centered title wrapper, answer before the photo
   ------------------------------------------------------------ */
.collection-type-blog-basic-grid .content-wrapper { padding-top: 4vw; }
.blog-item-inner-wrapper { max-width: 960px; margin: 0 auto; }
.blog-item-top-wrapper { margin-bottom: 2.5vw; }
.blog-item-category-wrapper { display: flex; gap: 0.6em; margin-bottom: 1.4em; }
.blog-item-category-wrapper a { color: var(--jf-sage); text-decoration: none; }
.blog-item-category-wrapper a + a::before { content: "\00b7"; margin-right: 0.6em; }
.entry-title {
  font-size: clamp(2.4rem, 4.2vw, 3.75rem) !important;
  line-height: 1.06 !important;
  margin: 0 0 0.4em !important;
  max-width: 24ch;
}
.entry-title::after { content: ""; display: block; width: 44px; height: 1px; background: var(--jf-gold); margin-top: 0.5em; }
.blog-item-meta-wrapper { color: var(--jf-sage); letter-spacing: 0; font-size: 0.95rem; }
.blog-item-meta-wrapper .blog-meta-item--date::after { content: "\00b7"; margin-left: 0.6em; }
.blog-item-meta-wrapper .blog-author-name { color: var(--jf-ink); text-decoration: none; }

/* reading column */
.blog-item-content { max-width: 760px; }
.blog-item-content .sqs-block { padding-left: 0; padding-right: 0; }
.blog-item-content .sqs-html-content p { font-size: 1.1875rem; line-height: 1.7; margin-bottom: 1.3em; }
.blog-item-content .sqs-html-content h2 { font-size: 2rem; line-height: 1.15; margin: 1.4em 0 0.55em; }
.blog-item-content .sqs-html-content h2::after { display: none; }
/* in-article photographs: wider than the column, never a second hero */
.blog-item-content .sqs-block-image { width: min(880px, calc(100vw - 2 * var(--sqs-site-gutter))); margin: 1.5vw 0 2vw; }
.blog-item-content .sqs-block-image img { aspect-ratio: 16 / 9; }
/* pull quote */
.blog-item-content .quote-block figure { margin: 2em 0 2.2em; padding-left: 1.6em; border-left: 1px solid var(--jf-gold); }
.quote-block blockquote { font-size: clamp(1.6rem, 2.2vw, 2rem); line-height: 1.25; font-style: italic; }
.quote-block figcaption {
  font-family: var(--jf-sans); font-size: 0.9rem; letter-spacing: 0.01em;
  color: var(--jf-sage); margin-top: 1em;
}

/* post-item sections (repeat under every article), constrained to the article wrapper */
[data-section-id="jf-post-author"] .fluid-engine,
[data-section-id="jf-post-related"] .fluid-engine { max-width: 960px; margin: 0 auto; }
[data-section-id="jf-post-author"] .content-wrapper { padding-top: 4.5vw; padding-bottom: 4.5vw; }
[data-section-id="jf-post-author"] .sqs-block-image img { aspect-ratio: 4 / 5; object-position: 50% 20%; }
[data-section-id="jf-post-author"] .sqs-html-content p { max-width: 60ch; }
[data-section-id="jf-post-author"] .sqs-html-content p.sqsrte-small { margin-top: 1.4em; }
[data-section-id="jf-post-related"] .content-wrapper { padding-top: 4vw; padding-bottom: 4.5vw; }
[data-section-id="jf-post-related"] .sqs-html-content h3 { border-top: 1px solid var(--jf-line); padding-top: 1em; margin-bottom: 0.4em; font-size: 1.5rem; max-width: 18ch; }
[data-section-id="jf-post-related"] .sqs-html-content p { font-size: 1rem; color: var(--jf-sage); max-width: 36ch; }
[data-section-id="jf-post-related"] .fe-block { padding-right: 2.5vw; }

/* ------------------------------------------------------------
   MOBILE
   ------------------------------------------------------------ */
@media (max-width: 767px) {
  .header-title-text a { font-size: 1.5rem !important; }
  .content-wrapper { padding-top: 11vw; padding-bottom: 11vw; }
  [data-section-id="jf-home-hero"] .sqs-html-content h1 { max-width: none; }
  [data-section-id="jf-home-hero"] .sqs-block-image { margin-top: 2em; }
  [data-section-id="jf-home-specialties"] .fe-block,
  [data-section-id="jf-post-related"] .fe-block { padding-right: 0; }
  [data-section-id="jf-home-specialties"] .fe-block .sqs-block-html,
  [data-section-id="jf-post-related"] .fe-block .sqs-block-html { margin-bottom: 2.2em; }
  [data-section-id="jf-home-specialties"] .sqs-block-image img { margin-bottom: 0.5em; }
  [data-section-id="jf-home-articles"] .fe-block-art-image { max-width: 55%; }
  [data-section-id="jf-home-articles"] .fe-block-articles-list { margin-top: 1.5em; }
  [data-section-id="jf-home-about"] .sqs-block-image { max-width: 50%; margin-top: 1.5em; }
  [data-section-id="jf-home-sophie"] .sqs-block-image { margin-bottom: 1.5em; }
  footer.sections .fe-block-footer-right .sqs-html-content { text-align: left; margin-top: 1.5em; }
  .entry-title { max-width: none; }
  .blog-item-content .sqs-block-image { width: 100%; }
  [data-section-id="jf-post-author"] .sqs-block-image { max-width: 45%; margin-bottom: 1.5em; }
}

.sqs-html-content h3 a { border-bottom: 0; }


/* ============================================================
   BRIEF-VARIANT DELTA — Warm California Modernism
   ============================================================ */

/* gold is light, not foil: hairline rules only. Functional small text
   uses bronze (5.9:1 on paper) where it needs to be warm. */
.sqs-html-content h4 { color: var(--jf-bronze); }
.sqs-block-image figcaption { color: var(--jf-sage); }

/* warm the phone photographs of the office: they were shot in cool
   white balance. Deployable: filter on img inside the section. */
[data-section-id="jf-home-office"] .sqs-block-image img,
[data-section-id="jf-service-office"] .sqs-block-image img,
[data-section-id="jf-post-author"] .sqs-block-image img,
[data-section-id="jf-home-jamie"] .sqs-block-image img {
  filter: sepia(0.16) saturate(1.06) brightness(1.02) contrast(0.98);
}

/* hero: framed coastal view, generous margins (white mockup structure) */
[data-section-id="jf-home-hero"] .sqs-block-image .image-block-outer-wrapper { padding: 12px; }
[data-section-id="jf-home-hero"] .sqs-block-image img { aspect-ratio: 4 / 3; }
[data-section-id="jf-home-hero"] .sqs-html-content h1 { max-width: 12ch; }
[data-section-id="jf-home-hero"] .sqs-html-content p.sqsrte-large { max-width: 34ch; }
[data-section-id="jf-home-hero"] .sqs-html-content p.sqsrte-small { max-width: 40ch; margin-top: 1.2em; }

/* "what people bring here": three recognizable situations */
[data-section-id="jf-home-bring"] .sqs-html-content h2 { max-width: 18ch; }
[data-section-id="jf-home-bring"] .sqs-html-content h3 { font-size: 1.6rem; max-width: 16ch; margin-bottom: 0.5em; }
[data-section-id="jf-home-bring"] .sqs-html-content p { max-width: 36ch; }
[data-section-id="jf-home-bring"] .fe-block { padding-right: 2.5vw; }

/* "what we'll pay attention to": Jamie's judgment as a numbered list.
   Native ordered list; numerals set in the serif via counters. */
.sqs-html-content ol.jf-attend, [data-section-id$="-attend"] .sqs-html-content ol {
  list-style: none; padding: 0; margin: 0; counter-reset: attend;
}
[data-section-id$="-attend"] .sqs-html-content ol li {
  counter-increment: attend;
  position: relative;
  padding: 1.3em 0 1.3em 3.2rem;
  border-top: 1px solid var(--jf-line);
  font-size: 1.15rem;
  line-height: 1.6;
  max-width: 60ch;
}
[data-section-id$="-attend"] .sqs-html-content ol li:last-child { border-bottom: 1px solid var(--jf-line); }
[data-section-id$="-attend"] .sqs-html-content ol li::before {
  content: counter(attend, decimal-leading-zero);
  position: absolute; left: 0; top: 1.15em;
  font-family: var(--jf-serif); font-size: 1.5rem; line-height: 1;
  color: var(--jf-bronze);
}
[data-section-id$="-attend"] .sqs-html-content h2 { max-width: 12ch; }
[data-section-id$="-attend"] .sqs-html-content p { max-width: 34ch; color: var(--jf-sage); }

/* Jamie: clinical identity first. Portrait unframed, credentials plain. */
[data-section-id="jf-home-jamie"] .sqs-block-image img { aspect-ratio: 4 / 5; object-position: 50% 15%; }
[data-section-id="jf-home-jamie"] .sqs-html-content p { max-width: 58ch; }
[data-section-id="jf-home-jamie"] .sqs-html-content ul { list-style: none; padding: 0; margin: 1.4em 0; max-width: 58ch; }
[data-section-id="jf-home-jamie"] .sqs-html-content li { padding: 0.55em 0; border-top: 1px solid var(--jf-line); }
[data-section-id="jf-home-jamie"] .sqs-html-content li:last-child { border-bottom: 1px solid var(--jf-line); }

/* the office: the warmth source. Framed, with Sophie second. */
[data-section-id="jf-home-office"] .sqs-block-image .image-block-outer-wrapper,
[data-section-id="jf-service-office"] .sqs-block-image .image-block-outer-wrapper {
  background: var(--jf-paper); border: 1px solid var(--jf-line); padding: 12px;
}
[data-section-id="jf-home-office"] .sqs-html-content p { max-width: 44ch; }

/* articles: titles as an editorial list */
[data-section-id="jf-home-articles"] .fe-block-articles-list .sqs-html-content p > a:only-child { font-size: 1.35rem; }

/* the one expansive photographic moment: a full-bleed section background
   (native: section › background image + overlay), statement over it */
[data-section-id="jf-home-moment"] { position: relative; overflow: hidden; }
[data-section-id="jf-home-moment"] .section-background img {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 60%;
}
[data-section-id="jf-home-moment"] .section-background::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(48,59,52,0.10) 0%, rgba(48,59,52,0.45) 100%);
}
[data-section-id="jf-home-moment"] .content-wrapper { padding-top: 14vw; padding-bottom: 6vw; min-height: 34vw; display: flex; align-items: flex-end; }
[data-section-id="jf-home-moment"] .sqs-html-content h2 {
  color: var(--jf-paper); font-style: italic; font-size: clamp(1.9rem, 3vw, 2.8rem); line-height: 1.2; max-width: 22ch;
  text-shadow: 0 1px 24px rgba(48,59,52,0.35);
}
[data-section-id="jf-home-moment"] .sqs-html-content h2::after { background: var(--jf-paper); opacity: 0.8; }
[data-section-id="jf-home-moment"] .sqs-html-content p { color: var(--jf-paper); }

/* closing: practical, one route in */
[data-section-id="jf-home-close"] .sqs-html-content p { max-width: 52ch; margin-left: auto; margin-right: auto; }

/* ---- service page ---- */
[data-section-id="jf-service-intro"] .content-wrapper { padding-top: 4vw; }
[data-section-id="jf-service-intro"] .sqs-html-content h1 { max-width: 14ch; font-size: clamp(2.6rem, 4.4vw, 4rem); }
[data-section-id="jf-service-intro"] .sqs-html-content p.sqsrte-large { max-width: 34ch; }
[data-section-id="jf-service-intro"] .sqs-html-content p { max-width: 52ch; }
[data-section-id="jf-service-intro"] .sqs-block-image img { aspect-ratio: 4 / 5; object-position: 50% 40%; }
[data-section-id="jf-service-intro"] .sqs-block-image .image-block-outer-wrapper { background: var(--jf-linen); border: 1px solid var(--jf-line); padding: 12px; }
[data-section-id="jf-service-bring"] .sqs-html-content ul { list-style: none; padding: 0; margin: 0; max-width: 56ch; }
[data-section-id="jf-service-bring"] .sqs-html-content li { padding: 0.75em 0; border-top: 1px solid var(--jf-line); font-size: 1.1rem; }
[data-section-id="jf-service-bring"] .sqs-html-content li:last-child { border-bottom: 1px solid var(--jf-line); }
[data-section-id="jf-service-bring"] .sqs-html-content h2 { max-width: 12ch; }
[data-section-id="jf-service-bring"] .sqs-html-content p { max-width: 36ch; color: var(--jf-sage); }
[data-section-id="jf-service-how"] .sqs-html-content p { max-width: 58ch; }
[data-section-id="jf-service-how"] .sqs-html-content h3 { font-size: 1.35rem; margin: 1.6em 0 0.4em; }
[data-section-id="jf-service-how"] .sqs-html-content h3:first-child { margin-top: 0; }
[data-section-id="jf-service-practical"] .sqs-html-content h3 { font-size: 1.3rem; margin-bottom: 0.4em; }
[data-section-id="jf-service-practical"] .sqs-html-content p { max-width: 34ch; font-size: 1rem; }
[data-section-id="jf-service-practical"] .fe-block { padding-right: 2.5vw; }
[data-section-id="jf-service-practical"] .fe-block-practical-heading .sqs-html-content h2 { margin-bottom: 1.2em; }

/* ---- article: a complete entrance ---- */
.blog-item-content .sqs-html-content p.sqsrte-large {
  font-family: var(--jf-serif); font-size: clamp(1.35rem, 1.75vw, 1.6rem); line-height: 1.4; margin: 0.4em 0 1.2em;
}
.blog-item-content .sqs-html-content h2 { font-size: 1.95rem; margin: 1.5em 0 0.5em; }
.blog-item-content .sqs-block-image { width: min(880px, calc(100vw - 2 * var(--sqs-site-gutter))); }
.blog-item-meta-wrapper { flex-direction: column; gap: 0.25em; }
.blog-item-author-date-wrapper { flex-direction: column; gap: 0.25em; align-items: flex-start; }
.blog-item-meta-wrapper .blog-meta-item--date::after { display: none; }
/* "what we'd pay attention to" callout inside an article: a quote block
   repurposed — blockquote holds the observation, figcaption the label */
.blog-item-content .quote-block figure { border-left: 1px solid var(--jf-bronze); padding: 0.4em 0 0.4em 1.6em; }
.quote-block blockquote { font-style: normal; font-size: clamp(1.35rem, 1.8vw, 1.65rem); line-height: 1.35; }
.quote-block figcaption { color: var(--jf-bronze); margin-top: 0.8em; }
[data-section-id="jf-post-entrance"] .fluid-engine { max-width: 960px; margin: 0 auto; }
[data-section-id="jf-post-entrance"] .content-wrapper { padding-top: 4vw; padding-bottom: 4vw; }
[data-section-id="jf-post-entrance"] .sqs-block-image img { aspect-ratio: 4 / 5; object-position: 50% 15%; }
[data-section-id="jf-post-entrance"] .sqs-html-content h2 { font-size: 1.8rem; }
[data-section-id="jf-post-entrance"] .sqs-html-content p { max-width: 58ch; }
[data-section-id="jf-post-related"] .sqs-html-content h3 a { border: 0; }

@media (max-width: 767px) {
  [data-section-id="jf-home-moment"] .content-wrapper { padding-top: 60vw; min-height: 0; }
  [data-section-id="jf-home-bring"] .fe-block, [data-section-id="jf-service-practical"] .fe-block { padding-right: 0; }
  [data-section-id="jf-home-bring"] .fe-block .sqs-block-html, [data-section-id="jf-service-practical"] .fe-block .sqs-block-html { margin-bottom: 2em; }
  [data-section-id="jf-home-jamie"] .sqs-block-image, [data-section-id="jf-post-entrance"] .sqs-block-image { max-width: 50%; margin-bottom: 1.5em; }
  [data-section-id="jf-service-intro"] .sqs-block-image { margin-top: 1.5em; }
}

/* service page: related articles at full content width (the centered
   960px wrapper is for blog items only) */
[data-section-id="jf-service-related"] .sqs-html-content h3 { border-top: 1px solid var(--jf-line); padding-top: 1em; margin-bottom: 0.4em; font-size: 1.5rem; max-width: 18ch; }
[data-section-id="jf-service-related"] .sqs-html-content h3 a { border: 0; }
[data-section-id="jf-service-related"] .sqs-html-content p { font-size: 1rem; color: var(--jf-sage); max-width: 36ch; }
[data-section-id="jf-service-related"] .fe-block { padding-right: 2.5vw; }
@media (max-width: 767px) {
  [data-section-id="jf-service-related"] .fe-block { padding-right: 0; }
  [data-section-id="jf-service-related"] .fe-block .sqs-block-html { margin-bottom: 2.2em; }
}


/* ============================================================
   ENLIVEN PASS — contrast, rhythm, one dark band, material
   ============================================================ */

/* type contrast: Canela Deck Light for the largest lines */
.sqs-html-content h1 { font-weight: 300; font-size: clamp(3rem, 5.6vw, 5.2rem); line-height: 1.0; letter-spacing: -0.01em; }
.sqs-html-content h2 { font-weight: 300; }
.sqs-html-content h4 { font-size: 0.8rem; }

/* material: a faint bronze paper grain on linen sections (pure CSS,
   deployable). Reads as warmth, not texture. */
[data-section-theme="light"] {
  background-color: var(--jf-linen);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='320' height='320'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 0.49 0 0 0 0 0.36 0 0 0 0 0.16 0 0 0 0.07 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* hero: big line, then a wide framed view */
[data-section-id="jf-home-hero"] .content-wrapper { padding-top: 5vw; padding-bottom: 5vw; }
[data-section-id="jf-home-hero"] .sqs-html-content h1 { max-width: 15ch; }
[data-section-id="jf-home-hero"] .sqs-html-content p.sqsrte-large { max-width: 40ch; font-weight: 300; }
[data-section-id="jf-home-hero"] .sqs-html-content p.sqsrte-small { max-width: 44ch; }
[data-section-id="jf-home-hero"] .sqs-block-image .image-block-outer-wrapper { padding: 10px; }
[data-section-id="jf-home-hero"] .sqs-block-image img { aspect-ratio: 21 / 9; object-position: 50% 45%; }
[data-section-id="jf-home-hero"] .sqs-block-image figcaption { text-align: right; }

/* what may bring you here: compact and dense after the big hero */
[data-section-id="jf-home-bring"] .content-wrapper { padding-top: 3.5vw; padding-bottom: 4vw; border-top: 1px solid var(--jf-line); }
[data-section-id="jf-home-bring"] .sqs-html-content h2 { font-size: clamp(1.7rem, 2.4vw, 2.2rem); }
[data-section-id="jf-home-bring"] .sqs-html-content h3 { font-size: 1.45rem; }
[data-section-id="jf-home-bring"] .sqs-html-content p { font-size: 1rem; }

/* the dark band: what we'll pay attention to */
[data-section-id="jf-home-attend"] { background: var(--jf-ink); color: var(--jf-paper); }
[data-section-id="jf-home-attend"] .content-wrapper { padding-top: 7vw; padding-bottom: 12vw; }
[data-section-id="jf-home-attend"] .sqs-html-content h2,
[data-section-id="jf-home-attend"] .sqs-html-content p,
[data-section-id="jf-home-attend"] .sqs-html-content li { color: var(--jf-paper); }
[data-section-id="jf-home-attend"] .sqs-html-content h2 { font-size: clamp(2.4rem, 3.6vw, 3.4rem); max-width: 10ch; }
[data-section-id="jf-home-attend"] .sqs-html-content h4 { color: var(--jf-gold); }
[data-section-id="jf-home-attend"] .sqs-html-content p { color: rgba(250,250,247,0.72); }
[data-section-id="jf-home-attend"] .sqs-html-content ol li { border-top-color: rgba(250,250,247,0.18); font-size: 1.2rem; font-weight: 300; }
[data-section-id="jf-home-attend"] .sqs-html-content ol li:last-child { border-bottom-color: rgba(250,250,247,0.18); }
[data-section-id="jf-home-attend"] .sqs-html-content ol li::before { color: var(--jf-gold); }
[data-section-id="jf-home-attend"] .jf-draft { opacity: 0.85; }

/* Jamie: the portrait straddles the dark band's lower edge */
[data-section-id="jf-home-jamie"] .content-wrapper { padding-top: 0; padding-bottom: 6vw; }
[data-section-id="jf-home-jamie"] .fe-block-jamie-image { margin-top: -9vw; position: relative; z-index: 2; }
[data-section-id="jf-home-jamie"] .sqs-block-image .image-block-outer-wrapper { background: var(--jf-paper); padding: 10px; border: 1px solid var(--jf-line); }
[data-section-id="jf-home-jamie"] .sqs-block-image img { aspect-ratio: 4 / 5; }
[data-section-id="jf-home-jamie"] .fe-block-jamie-text { padding-top: 3vw; }

/* the office: the big warm image, text tucked beside its lower edge */
[data-section-id="jf-home-office"] .sqs-block-image img { aspect-ratio: 4 / 3; }
[data-section-id="jf-home-office"] .sqs-html-content h2 { font-size: clamp(1.9rem, 2.6vw, 2.5rem); }
[data-section-id="jf-home-office"] .sqs-html-content p { font-size: 1rem; max-width: none; }

/* the expansive moment: taller, the line lighter and larger */
[data-section-id="jf-home-moment"] .content-wrapper { min-height: 44vw; padding-top: 18vw; }
[data-section-id="jf-home-moment"] .sqs-html-content h2 { font-size: clamp(2.2rem, 3.8vw, 3.6rem); max-width: 20ch; font-weight: 300; }
[data-section-id="jf-home-moment"] .sqs-html-content p.sqsrte-small { color: rgba(250,250,247,0.75); margin-top: 1.4em; }

/* closing: one short big line */
[data-section-id="jf-home-close"] .content-wrapper { padding-top: 8vw; padding-bottom: 8vw; }
[data-section-id="jf-home-close"] .sqs-html-content h2 { font-size: clamp(2.6rem, 4.2vw, 4rem); }

/* ---- article: sticky rail, drop cap, wide lead image, dark callout ---- */
.blog-item-inner-wrapper { max-width: none; display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 13fr); column-gap: 6vw; align-items: start; }
.blog-item-top-wrapper { position: sticky; top: 2.5rem; margin-bottom: 0; }
.blog-item-top-wrapper .jf-draft { display: inline-block; margin-bottom: 1.4em; }
.entry-title { font-weight: 300; font-size: clamp(2rem, 2.8vw, 2.7rem) !important; line-height: 1.1 !important; max-width: none; }
.blog-item-meta-wrapper { margin-top: 1.4em; }
.blog-item-content { max-width: 760px; margin-left: 0; }
.blog-item-content .sqs-html-content p.sqsrte-large { font-weight: 300; font-size: clamp(1.45rem, 1.9vw, 1.8rem); line-height: 1.35; }
.blog-item-content .sqs-html-content p.sqsrte-large::first-letter {
  font-family: var(--jf-serif); font-weight: 300; font-size: 4.6em; line-height: 0.8;
  float: left; margin: 0.08em 0.12em 0 0; color: var(--jf-bronze);
}
.blog-item-content .sqs-block-image { width: 100%; margin: 2vw 0 2.5vw; }
.blog-item-content .sqs-block-image .image-block-outer-wrapper { padding: 0; border: 0; background: none; }
.blog-item-content .sqs-block-image img { aspect-ratio: 16 / 9; }
.blog-item-content .sqs-html-content h2 { font-weight: 300; font-size: 2.1rem; margin: 1.6em 0 0.5em; padding-top: 1em; border-top: 1px solid var(--jf-line); }
/* the callout: the article's one dark element */
.blog-item-content .quote-block figure { margin: 2.5em 0; padding: 2em 2.2em 1.8em; border-left: 0; background: var(--jf-ink); }
.quote-block blockquote { color: var(--jf-paper); font-weight: 300; font-size: clamp(1.4rem, 1.9vw, 1.7rem); }
.quote-block figcaption { color: var(--jf-gold); }
[data-section-id="jf-post-entrance"] .fluid-engine { max-width: none; }
[data-section-id="jf-post-entrance"] .fe-block-entrance-image { grid-column: 1 / 5; }
[data-section-id="jf-post-entrance"] .fe-block-entrance-text, [data-section-id="jf-post-entrance"] .fe-block-entrance-button { grid-column: 7 / 21; }
/* related reading as an editorial list */
[data-section-id="jf-post-related"] .fluid-engine { max-width: none; }
[data-section-id="jf-post-related"] .sqs-html-content h3 { font-size: 1.7rem; font-weight: 300; max-width: none; }

@media (max-width: 767px) {
  .blog-item-inner-wrapper { display: block; }
  .blog-item-top-wrapper { position: static; margin-bottom: 2em; }
  [data-section-id="jf-home-jamie"] .fe-block-jamie-image { margin-top: -14vw; max-width: 55%; }
  [data-section-id="jf-home-jamie"] .fe-block-jamie-text { padding-top: 0; }
  [data-section-id="jf-home-attend"] .content-wrapper { padding-bottom: 20vw; }
  [data-section-id="jf-home-hero"] .sqs-block-image img { aspect-ratio: 4 / 3; }
  [data-section-id="jf-home-moment"] .content-wrapper { padding-top: 60vw; }
}