/* About: an editorial field journal. Contact: a letter with a clear next step. */
#next-steps .ww-next-links { display: flex; flex-wrap: wrap; gap: 22px 40px; }
.ww-about-hero { padding-top: 80px; padding-bottom: 60px; }
.ww-about-title, .ww-contact-title { font-family: Newsreader, Georgia, serif; font-size: clamp(64px, 8.1vw, 124px); font-weight: 400; line-height: 1.02; letter-spacing: -.055em; margin: 0; }
.ww-about-title { max-width: 1250px; }
.ww-about-opening { display: grid; grid-template-columns: 1.1fr .85fr; align-items: center; gap: 95px; margin-top: 25px !important; }
.ww-about-art { margin: 0; width: 100%; max-width: 620px; }
.ww-about-art img { display: block; width: 100%; height: auto; aspect-ratio: 760 / 620; }
.ww-about-art .wp-element-caption { color: #B9B9C2; font: 11px/1.8 Inter, sans-serif; margin-top: 8px; padding-left: 30px; }
.ww-about-opening-copy { max-width: 460px; }
.ww-about-opening-copy .ww-about-lead { color: #F5F5F5; font-size: 20px; line-height: 1.65; }
.ww-about-opening-copy p + p { margin-top: 23px; }
.ww-about-founding { border-top: 1px solid #242428; }
.ww-about-founding-layout { display: grid; grid-template-columns: .85fr 1.15fr; gap: 120px; }
.ww-about-founding-layout .ww-section-title { font-size: clamp(44px, 4vw, 62px); }
.ww-about-questions { border-top: 1px solid #242428; }
.ww-about-questions > .ww-section-title { max-width: 800px; }
.ww-field-notes { width: min(100%, 1000px); margin: 50px 0 0 auto !important; }
.ww-field-note { display: grid; grid-template-columns: 42px 1fr; column-gap: 20px; padding: 28px 0; border-top: 1px solid #35353B; }
.ww-field-note:nth-child(2) { margin-left: 12% !important; }
.ww-field-note:nth-child(3) { margin-left: 24% !important; }
.ww-field-index { color: #DE6973; font-size: 10px; padding-top: 8px; }
.ww-field-question { font-size: clamp(29px, 2.7vw, 41px); line-height: 1.15; letter-spacing: -.025em; max-width: 700px; }
.ww-field-answer { grid-column: 2; color: #B9B9C2; font-size: 14px; line-height: 1.85; max-width: 500px; margin-top: 18px !important; }
.ww-about-questions > .ww-quiet-link { margin-top: 38px; }
.ww-about-relationship { border-top: 1px solid #242428; }
.ww-about-relationship-layout { align-items: center; }
.ww-about-relationship-notes { padding-left: 32px; border-left: 1px solid #71333C; }
.ww-relationship-note h3 { font-size: 33px; line-height: 1.2; letter-spacing: -.025em; }
.ww-relationship-note p { color: #B9B9C2; font-size: 14px; line-height: 1.9; margin-top: 21px; }
.ww-relationship-note + .ww-relationship-note { margin-top: 38px !important; }
.ww-about-relationship > .ww-quiet-link { margin-top: 40px; }
.ww-about-care { border-block: 1px solid #242428; }
.ww-about-care-layout { display: grid; grid-template-columns: .8fr 1.2fr; gap: 130px; align-items: center; }
.ww-about-principle { font-family: Newsreader, Georgia, serif; font-size: clamp(43px, 4.5vw, 68px); line-height: 1.25; letter-spacing: -.035em; color: #B9B9C2; padding-left: 30px; border-left: 1px solid #C1121F; }
.ww-about-care .ww-section-title { font-size: clamp(40px, 3.6vw, 56px); }
.ww-about-next { border-top: 0; }
.ww-about-next-links { display: flex; flex-wrap: wrap; gap: 25px 45px; margin-top: 35px !important; }
.ww-about-next-links .ww-quiet-link { margin-top: 0; }
/* Contact is centered on writing a real inquiry, rather than another illustrative hero panel. */
.ww-contact-hero { position: relative; padding-top: 90px; padding-bottom: 80px; }
.ww-contact-title { max-width: 1280px; }
.ww-contact-opening { margin-top: 35px !important; max-width: 640px; }
.ww-contact-intro { font-size: 17px; line-height: 1.9; color: #B9B9C2; }
.ww-contact-opening .ww-quiet-link { margin-top: 28px; }
.ww-contact-hero::after { content: ''; position: absolute; right: 30px; bottom: 40px; width: 270px; height: 235px; background: url('../art/conversation-thread.svg') center / contain no-repeat; pointer-events: none; }
.ww-contact-inquiry { padding-top: 35px; padding-bottom: 95px; }
.ww-contact-body { display: grid; grid-template-columns: 1.45fr .65fr; gap: 80px; align-items: start; }
.ww-contact-letter { position: relative; padding: 40px 45px 42px 60px; background: linear-gradient(135deg, #18181D95, #0F0F12); border: 1px solid #35353B; }
.ww-contact-letter::before { content: ''; position: absolute; left: 22px; top: 42px; bottom: 42px; width: 1px; background: linear-gradient(#C1121F, #643039, #35353B); }
.ww-contact-letter > .ww-section-tag { padding-left: 0; margin-bottom: 24px; }
.ww-contact-letter > .ww-section-tag::before { display: none; }
.ww-contact-letter .ww-section-title { font-size: 45px; }
.ww-form-instruction { color: #B9B9C2; font-size: 11px; margin-top: 20px !important; }
.ww-form-preview { color: #B9B9C2; font-size: 11px; line-height: 1.75; border-bottom: 1px solid #35353B; padding-bottom: 20px; margin-top: 25px !important; }
.ww-form-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 28px 28px; margin-top: 28px; }
.ww-form-field { min-width: 0; }
.ww-form-field-wide { grid-column: 1 / -1; }
.ww-form-field label { display: block; color: #F5F5F5; font-size: 12px; line-height: 1.7; margin-bottom: 10px; }
.ww-form-field label span { color: #DE6973; }
.ww-form-field input, .ww-form-field textarea { display: block; width: 100%; box-sizing: border-box; min-height: 46px; padding: 9px 2px; background: transparent; border: 0; border-bottom: 1px solid #676773; border-radius: 0; color: #F5F5F5; font: 14px/1.7 Inter, sans-serif; }
.ww-form-field textarea { min-height: 155px; resize: vertical; }
.ww-form-field input::placeholder { color: #91919F; }
.ww-form-field input:focus-visible, .ww-form-field textarea:focus-visible { outline: 2px solid #DE6973; outline-offset: 5px; border-color: transparent; }
.ww-form-field [aria-invalid='true'] { border-color: #EE8894; }
.ww-form-field .ww-field-error { color: #EE8894; font-size: 12px; line-height: 1.75; margin-top: 10px; }
.ww-form-submit { display: flex; flex-wrap: wrap; gap: 20px 24px; align-items: center; margin-top: 5px; }
.ww-form-submit button { display: inline-flex; justify-content: space-between; align-items: center; gap: 35px; padding: 16px 20px; background: #151519; border: 1px solid #A6414D; color: #F5F5F5; font: 13px/1.4 Inter, sans-serif; cursor: pointer; min-height: 50px; }
.ww-form-submit button span { color: #DE6973; font-size: 20px; }
.ww-form-submit button:hover { background: #242428; border-color: #DE6973; }
.ww-form-submit button:disabled { opacity: .5; cursor: default; }
.ww-form-submit p { color: #B9B9C2; font-size: 11px; line-height: 1.8; max-width: 180px; }
.ww-form-feedback { border-left: 2px solid #DE6973; padding: 20px; margin-top: 25px !important; background: #1B1B20; scroll-margin-top: 25px; }
.ww-form-feedback h3 { font-family: Newsreader, Georgia, serif; font-size: 28px; font-weight: 400; line-height: 1.2; margin: 0 0 15px; }
.ww-form-feedback p, .ww-form-feedback li { color: #F5F5F5; font-size: 13px; line-height: 1.8; }
.ww-form-feedback ul { padding-left: 18px; margin: 0; }
.ww-form-success { border-color: #B9B9C2; }
.ww-contact-aside { padding-top: 10px; }
.ww-contact-aside-label { color: #B9B9C2; font-size: 10px; letter-spacing: .15em; }
.ww-contact-steps { margin-top: 35px !important; }
.ww-contact-step { position: relative; padding-left: 28px; margin-bottom: 35px !important; }
.ww-contact-step-index { position: absolute; top: 5px; left: 0; font-size: 9px; color: #DE6973; }
.ww-contact-step h3 { font-size: 27px; line-height: 1.2; letter-spacing: -.025em; }
.ww-contact-step > p:last-child { color: #B9B9C2; font-size: 13px; line-height: 1.9; margin-top: 15px; }
.ww-contact-availability { color: #B9B9C2; font-size: 12px; line-height: 1.9; border-top: 1px solid #35353B; padding-top: 24px; }
.ww-contact-resources { border-top: 1px solid #242428; padding-top: 80px; }
.ww-contact-resource-links { max-width: 940px; margin-top: 38px !important; }
.ww-contact-resource-links .ww-quiet-link { margin-top: 0; }
.ww-contact-resource-links a { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 24px 0; border-top: 1px solid #35353B; border-bottom: 0; font-size: 16px; }
.ww-contact-resource-links .ww-quiet-link:last-child a { border-bottom: 1px solid #643039; }
.ww-contact-footnotes { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 20px; margin-top: 38px !important; }
.ww-contact-footnotes p { color: #B9B9C2; font-size: 12px; line-height: 1.8; }
@media (max-width: 1100px) {
  .ww-about-opening { gap: 45px; grid-template-columns: 1fr 1fr; }
  .ww-about-founding-layout, .ww-about-care-layout { gap: 60px; }
  .ww-contact-body { grid-template-columns: 1.35fr .65fr; gap: 45px; }
  .ww-contact-letter { padding: 32px 30px 35px 40px; }
  .ww-contact-letter::before { left: 15px; }
  .ww-contact-hero::after { width: 200px; right: 0; }
  .ww-contact-opening { max-width: 65%; }
  .ww-contact-step { padding-left: 24px; }
  .ww-contact-step h3 { font-size: 24px; }
}
@media (max-width: 800px) {
  .ww-about-opening { grid-template-columns: 1fr; gap: 28px; }
  .ww-about-art { max-width: 570px; margin-inline: auto; }
  .ww-about-opening-copy { max-width: 650px; margin-inline: auto; }
  .ww-about-founding-layout, .ww-about-care-layout { grid-template-columns: 1fr; gap: 38px; }
  .ww-field-note:nth-child(2) { margin-left: 6% !important; }
  .ww-field-note:nth-child(3) { margin-left: 12% !important; }
  .ww-contact-body { grid-template-columns: 1fr; gap: 50px; }
  .ww-contact-aside { max-width: 620px; }
  .ww-contact-steps { display: grid; grid-template-columns: 1fr 1fr; column-gap: 30px; }
  .ww-contact-step:last-child { grid-column: 1 / -1; max-width: 450px; }
}
@media (max-width: 700px) {
  .ww-about-hero, .ww-contact-hero { padding-top: 58px; }
  .ww-about-title { font-size: clamp(43px, 10.9vw, 70px); }
  .ww-contact-title { font-size: clamp(43px, 11.2vw, 70px); }
  .ww-about-opening { margin-top: 22px !important; }
  .ww-about-art .wp-element-caption { font-size: 10px; padding-left: 0; text-align: center; }
  .ww-about-opening-copy .ww-about-lead { font-size: 18px; }
  .ww-field-notes { margin-top: 35px !important; }
  .ww-field-note { grid-template-columns: 25px 1fr; column-gap: 12px; padding-block: 25px; }
  .ww-field-note:nth-child(2), .ww-field-note:nth-child(3) { margin-left: 0 !important; }
  .ww-field-question { font-size: 29px; }
  .ww-field-answer { font-size: 13px; }
  .ww-about-relationship-notes { padding-left: 24px; }
  .ww-relationship-note h3 { font-size: 29px; }
  .ww-about-principle { font-size: 43px; padding-left: 24px; }
  .ww-about-next-links { gap: 25px; }
  .ww-contact-title { max-width: 100%; }
  .ww-contact-opening { max-width: 100%; }
  .ww-contact-intro { font-size: 15px; }
  .ww-contact-hero { padding-bottom: 65px; }
  .ww-contact-hero::after { display: none; }
  .ww-contact-inquiry { padding-top: 12px; padding-bottom: 75px; }
  .ww-contact-letter { padding: 30px 22px 32px 30px; }
  .ww-contact-letter::before { left: 10px; top: 30px; bottom: 30px; }
  .ww-contact-letter .ww-section-title { font-size: 38px; }
  .ww-form-fields { grid-template-columns: 1fr; gap: 25px; }
  .ww-form-field input, .ww-form-field textarea { font-size: 16px; }
  .ww-form-submit { display: block; }
  .ww-form-submit button { width: 100%; }
  .ww-form-submit p { max-width: 100%; margin-top: 20px; }
  .ww-contact-steps { display: block; }
  .ww-contact-step:last-child { max-width: 100%; }
  .ww-contact-resources { padding-top: 65px; }
  .ww-contact-resource-links a { font-size: 14px; }
}

/* About narrative refinement. These rules do not change the Contact page. */
.ww-about-opening-copy .ww-about-lead { font-size: 21px; line-height: 1.7; }
.ww-about-founding-layout .ww-about-story-lead { font-size: 18px; line-height: 1.85; color: #F5F5F5; }
.ww-about-founding-layout .ww-about-story-bridge { font-size: 14px; color: #B9B9C2; padding-top: 22px; border-top: 1px solid #35353B; }
.ww-about-philosophy { display: grid; grid-template-columns: .85fr 1.15fr; gap: 100px; margin-top: 42px !important; align-items: start; }
.ww-about-philosophy-statement { font-family: Newsreader, Georgia, serif; font-size: clamp(29px, 2.6vw, 39px); line-height: 1.3; letter-spacing: -.02em; border-left: 1px solid #C1121F; padding-left: 28px; max-width: 470px; }
.ww-about-accent { color: #C1121F; }
.ww-about-philosophy-copy { max-width: 650px; }
.ww-about-philosophy-copy p { font-size: 15px; line-height: 1.9; }
.ww-about-questions .ww-field-notes { width: min(100%, 1060px); margin-top: 60px !important; }
.ww-about-questions .ww-field-note { padding-block: 32px; }
.ww-about-questions .ww-field-question { font-size: clamp(29px, 2.5vw, 37px); }
.ww-about-questions .ww-field-answer { font-size: 15px; max-width: 600px; line-height: 1.9; }
.ww-field-implication { grid-column: 2; max-width: 600px; color: #B9B9C2; font-size: 13px; line-height: 1.9; margin-top: 16px !important; }
.ww-field-implication strong { color: #F5F5F5; font-weight: 500; }
.ww-about-relationship .ww-about-relationship-layout { align-items: start; }
.ww-about-relationship .ww-relationship-note h3 { font-size: 30px; }
.ww-about-relationship .ww-relationship-note p { margin-top: 18px; }
.ww-about-care .ww-about-principle { font-size: clamp(36px, 3.5vw, 54px); line-height: 1.3; border-left: 0; padding-left: 0; max-width: 480px; }
.ww-about-care .ww-about-care-layout { grid-template-columns: .8fr 1.2fr; }
@media (max-width: 1000px) {
  .ww-about-philosophy { gap: 50px; }
}
@media (max-width: 800px) {
  .ww-about-philosophy { grid-template-columns: 1fr; gap: 30px; }
  .ww-about-philosophy-statement { max-width: 600px; }
  .ww-about-care .ww-about-care-layout { grid-template-columns: 1fr; }
}
@media (max-width: 700px) {
  .ww-about-opening-copy .ww-about-lead { font-size: 18px; }
  .ww-about-founding-layout .ww-about-story-lead { font-size: 16px; }
  .ww-about-philosophy { margin-top: 32px !important; }
  .ww-about-philosophy-statement { font-size: 30px; padding-left: 22px; }
  .ww-about-philosophy-copy p { font-size: 14px; }
  .ww-about-questions .ww-field-notes { margin-top: 35px !important; }
  .ww-about-questions .ww-field-question { font-size: 28px; }
  .ww-about-questions .ww-field-answer { font-size: 14px; }
  .ww-field-implication { font-size: 13px; }
  .ww-about-care .ww-about-principle { font-size: 38px; }
}
