/* Mobile direction: atmosphere, fluid type and comfortable reading.
   Desktop compositions and editorial breaks remain above 800px. */
@media (max-width: 800px) {
  h1, h2, .principles h3 { text-wrap: balance; }
  h2 .editorial-break, .principles .editorial-break { display: none; }
  .headline-line { display: inline; }
  .intro, .about-copy p, .personal-copy p, .formats p, details p { text-wrap: pretty; }
  .hero h1 { font-size: clamp(42px, 5.6vw, 46px); line-height: 1.09; }
  .presence h2 { font-size: clamp(43px, 7.1vw, 56px); line-height: 1.08; }
  .openings h2 { font-size: clamp(46px, 6.5vw, 54px); line-height: 1.09; max-width: 15ch; }
  .about h2 { font-size: clamp(44px, 6.1vw, 50px); line-height: 1.1; max-width: 15ch; }
  .about h2 em, .openings h2 em { display: block; }
  .path h2 { font-size: clamp(44px, 6.5vw, 54px); line-height: 1.09; max-width: 17ch; }
  .path-head { display: block; }
  .path-head > p:last-child { margin-top: 28px; max-width: 52ch; }
  .section-heading { display: block; }
  .section-heading > p:last-child { margin-top: 25px; }
  .faq { display: block; }
  .questions { padding-top: 35px; }
  .principles h3 { font-size: clamp(26px, 3.65vw, 29px); line-height: 1.2; }
  .manifesto h2 { font-size: clamp(34px, 5.1vw, 40px); line-height: 1.2; max-width: 27ch; }
  .manifesto-answer em { font-size: clamp(36px, 6.7vw, 52px); line-height: 1.15; text-wrap: balance; }
  .personal-section h2 { font-size: clamp(43px, 6.2vw, 49px); line-height: 1.1; }
  .section-heading h2 { font-size: clamp(45px, 6.5vw, 54px); line-height: 1.1; max-width: 17ch; }
  .faq h2 { font-size: clamp(45px, 6.2vw, 51px); line-height: 1.1; max-width: 16ch; }
  .final h2 { font-size: clamp(62px, 10vw, 78px); line-height: 1.08; max-width: 13ch; }
}
@media (max-width: 600px) {
  .hero {
    padding: 18px 24px 38px;
    background: #f5f0ea;
    overflow: hidden;
  }
  .hero::after {
    background: radial-gradient(ellipse at 86% 23%, #c7a49865, transparent 67%),
      radial-gradient(ellipse at 12% 8%, #fffdf7cc, transparent 65%),
      linear-gradient(155deg, #f5f0ea, #f2e8e1 48%, #f5f0ea 88%);
  }
  .hero-wave {
    width: 160%; max-width: none; height: 66%; right: -38%; top: -3%; bottom: auto;
    object-fit: cover; object-position: 72% 32%;
    opacity: .14; filter: grayscale(1) sepia(.3) contrast(1.05);
    mask-image: radial-gradient(ellipse at 66% 26%, #000 28%, transparent 80%);
  }
  .hero-photo { width: 69%; max-width: 280px; }
  .hero-copy { padding-top: 25px; }
  .hero .eyebrow { margin-bottom: 17px; line-height: 1.6; }
  .hero h1 {
    font-size: clamp(40px, 10.5vw, 46px);
    line-height: 1.08; letter-spacing: -.65px; max-width: 19ch;
  }
  .hero .intro { font-size: 16px; line-height: 1.75; margin: 21px 0 24px; }
  .hero .care-note { margin-top: 22px; line-height: 1.7; }
  .hero .button { min-height: 56px; }
  .presence h2 { max-width: 14ch; font-size: clamp(43px, 11.2vw, 51px); }
  .openings h2 { font-size: clamp(46px, 12vw, 53px); max-width: 14ch; }
  .openings h2 em { display: block; }
  .openings-title > p:not(.eyebrow) { margin-top: 25px; line-height: 1.85; }
  .editorial-portrait { width: 90%; margin-top: 32px; }
  .themes { margin-top: 32px; padding-top: 0; }
  .themes li { font-size: clamp(25px, 6.55vw, 29px); line-height: 1.3; padding: 24px 0; gap: 18px; }
  .themes span { flex: 0 0 23px; }
  .about h2 { font-size: clamp(44px, 11.6vw, 51px); max-width: 15ch; }
  .about h2 em { display: block; }
  .about-copy > p:not(.eyebrow) { margin-top: 26px; line-height: 1.85; }
  .credentials { margin-top: 30px; padding-top: 24px; }
  .credentials p { line-height: 1.85; }
  .about-photo { width: 88%; }
  .path h2 { font-size: clamp(44px, 11.7vw, 52px); }
  .path-head > p:last-child { margin-top: 28px; line-height: 1.85; }
  .principles { grid-template-columns: 1fr; gap: 30px; margin-top: 42px; }
  .principles li { display: grid; grid-template-columns: 32px 1fr; gap: 20px; padding-top: 24px; align-items: baseline; }
  .path .principles span { font-size: 26px; }
  .principles h3 { font-size: clamp(28px, 7.25vw, 32px); margin: 0; max-width: 26ch; text-wrap: pretty; }
  .manifesto { min-height: 560px; }
  .manifesto .panel-copy { padding-block: 80px; width: 100%; }
  .manifesto h2 { font-size: clamp(34px, 8.8vw, 39px); max-width: 24ch; }
  .manifesto-answer { font-size: clamp(22px, 5.7vw, 25px); line-height: 1.4; margin-top: 42px; }
  .manifesto-answer em { font-size: clamp(35px, 9.2vw, 43px); margin-top: 18px; }
  .manifesto::after { background: linear-gradient(90deg, #351817df, #35181759 85%); }
  .personal-section { gap: 28px; }
  .personal-section h2 { font-size: clamp(43px, 11.3vw, 49px); }
  .personal-section .reading-photo { height: auto; object-fit: contain; }
  .personal-section .personal-copy p { line-height: 1.9; margin-bottom: 25px; }
  .section-heading h2 { font-size: clamp(45px, 11.8vw, 52px); }
  .formats { gap: 22px; margin-top: 32px; }
  .formats article { padding: 28px; }
  .formats article:first-child { border-top-width: 4px; background: linear-gradient(145deg, #dfc8bd, #eee3db); }
  .formats article:last-child { background: #f0eae3; }
  .formats h3 { margin-top: 24px; }
  .formats p { line-height: 1.85; }
  .formats .text-link { min-height: 48px; }
  .faq h2 { font-size: clamp(45px, 11.7vw, 52px); max-width: 16ch; }
  summary { min-height: 80px; padding: 24px 38px 24px 0; line-height: 1.65; }
  summary::after { top: 50%; transform: translateY(-50%); }
  details p { font-size: 16px; }
  .final { padding-top: 65px; padding-bottom: 65px; }
  .final h2 { font-size: clamp(62px, 16vw, 72px); max-width: 12ch; }
  .final .final-art { left: 5%; opacity: .55; }
  .final .final-copy > p { line-height: 1.8; }
}
/* Narrow phones keep a little more room for type; wider phones gain breathing space. */
@media (max-width: 374px) {
  .hero { padding-inline: 20px; }
  .section { padding-inline: 20px; }
  .presence .panel-copy, .manifesto .panel-copy { padding-inline: 20px; }
  .personal-section h2, .personal-section .personal-copy { padding-inline: 20px; }
}
@media (min-width: 414px) and (max-width: 600px) {
  .hero { padding-inline: 28px; }
  .hero-photo { width: 68%; }
  .section { padding-inline: 28px; }
  .presence .panel-copy, .manifesto .panel-copy { padding-inline: 28px; }
  .personal-section h2, .personal-section .personal-copy { padding-inline: 28px; }
}