/* Shared visual language: warm paper, fine lines and restrained red accents. */
:root { --body-ink:#656159; --rule:#d8d1c5; }
.phrase { display:inline-block; }
.section-head h2 { text-wrap:balance; }
.questions .eyebrow,.works>.eyebrow,.flow>.eyebrow,.contact-grid>div>.eyebrow {
  display:flex; align-items:center; gap:15px; line-height:1.6; letter-spacing:.18em;
}
.eyebrow>span { border-right:1px solid #db4b4070; padding-right:15px; letter-spacing:.04em; }
.section-head>p,.story-copy>p:not(.eyebrow):not(.note),.team div>p,
.faq details p,.contact-grid>div>p:not(.eyebrow) { font-size:16px; line-height:1.9; color:var(--body-ink); }
.story-copy .note,.note { color:var(--body-ink); font-size:13px; }
.experience-tags span { font-size:12px; color:var(--body-ink); }
.story-copy .text-link { font-size:15px; }
.story-media video::-webkit-media-controls,
.story-media video::-webkit-media-controls-enclosure,
.story-media video::-webkit-media-controls-start-playback-button { display:none!important; }

/* Four editorial portraits share the About section's red linework. */
.question-grid { gap:16px; }
.question-grid article { border:1px solid #e5dfd5; padding:25px 24px 28px; min-height:312px; border-radius:12px; }
.question-top { display:flex; align-items:flex-start; justify-content:space-between; margin-bottom:20px; }
.question-top .question-person { display:block; width:84px; height:84px; flex:none; object-fit:contain; }
.question-top>span { font-size:11px; letter-spacing:.08em; color:#8a786c; padding-top:3px; }
.question-copy h3 { font-size:19px; line-height:1.65; }
.question-copy p { font-size:16px; line-height:1.85; color:var(--body-ink); margin-top:14px; }
.questions .button { font-size:15px; }

/* A continuous path on desktop; a readable vertical timeline on small screens. */
.flow .flow-steps { margin:0; padding:0; gap:28px; grid-template-columns:repeat(4,minmax(0,1fr)); }
.flow .flow-step { position:relative; border:0; padding:0; min-width:0; }
.flow-step:not(:last-child)::after {
  content:""; position:absolute; top:24px; left:64px; right:-12px; height:1px; background:var(--rule);
}
.flow .step-marker {
  display:grid; place-items:center; width:48px; height:48px; border:1px solid #d8c8bd;
  border-radius:50%; font-size:17px; font-weight:650; letter-spacing:.02em; color:var(--red); background:#f0ece5;
}
.flow-step:first-child .step-marker { color:white; background:var(--red); border-color:var(--red); }
.flow .step-body h3 { font-size:20px; line-height:1.5; margin:24px 0 14px; }
.flow .step-body p { font-size:16px; line-height:1.9; color:var(--body-ink); }

/* A film-frame treatment gives the optional sample its own identity. */
.flow .sample {
  position:relative; display:grid; grid-template-columns:minmax(0,1fr) 290px;
  align-items:center; gap:38px; margin-top:58px; padding:38px;
  background:#eee9df; border:1px solid #e3dccf; border-radius:14px;
}
.sample-main { display:grid; grid-template-columns:135px minmax(0,1fr); gap:17px 26px; align-items:center; }
.sample-film {
  position:relative; grid-row:1/3; align-self:center; min-height:156px; display:grid; place-items:center;
  padding:16px 14px; border-block:1px solid #bda89a; color:var(--red);
}
.sample-film::before,.sample-film::after {
  content:""; position:absolute; inset:6px auto 6px 0; width:4px;
  background:repeating-linear-gradient(to bottom,#c5b4a7 0 6px,transparent 6px 13px);
}
.sample-film::after { left:auto; right:0; }
.sample-film-inner { text-align:center; }
.sample .sample-film p { display:flex; align-items:baseline; justify-content:center; gap:5px; line-height:1; color:var(--red); }
.sample-film strong { font-size:60px; font-weight:650; line-height:1; letter-spacing:-.055em; }
.sample .sample-film span { font-size:12px; font-weight:600; letter-spacing:0; }
.sample-film small { display:block; font-size:8px; letter-spacing:.1em; margin-top:15px; color:#8a6356; white-space:nowrap; }
.sample .sample-copy .eyebrow { font-size:10px; letter-spacing:.16em; color:var(--red); margin:0 0 12px; }
.sample .sample-copy h3 { font-size:24px; line-height:1.6; margin:0; letter-spacing:-.045em; }
.sample .sample-copy h3 .phrase { font:inherit; color:inherit; letter-spacing:inherit; }
.sample .sample-message { grid-column:2; font-size:15px; line-height:1.9; color:var(--body-ink); }
.sample-action { padding-left:28px; border-left:1px solid #d8d0c3; }
.sample .sample-route { font-size:13px; font-weight:650; color:var(--ink); line-height:1.6; margin-bottom:16px; }
.sample .sample-route span { font-size:11px; color:var(--red); border:1px solid #d8c2b5; border-radius:50%; padding:4px 5px; margin-right:7px; letter-spacing:0; }
.sample .button { width:100%; margin:0; font-size:14px; padding:16px 20px; gap:12px; }
.sample .button>span { border:0; padding:0; font-size:22px; color:inherit; }
.sample .sample-conditions { font-size:12px; line-height:1.9; color:var(--body-ink); margin-top:16px; }

/* Keep supporting information readable without competing with headlines. */
.faq summary { font-size:16px; line-height:1.8; padding:22px 0; }
.faq summary>span { flex:none; color:var(--red); font-size:20px; width:24px; text-align:center; }
.faq details[open] summary>span { font-size:0; }
.faq details[open] summary>span::after { content:"−"; font-size:20px; }
.form-intro { font-size:15px; color:var(--body-ink); }
form label { font-size:14px; }
form label span,form label small { font-size:11px; }
form label small { color:var(--body-ink); }
input,select,textarea { font-size:16px; }
.contact small { font-size:13px; }
.form-disclaimer { font-size:13px; color:var(--body-ink); }
.footer-top p,.footer-company { font-size:14px; color:var(--body-ink); }
.footer-end { font-size:12px; color:var(--body-ink); }

@media(max-width:1100px) {
  header.site-header nav { display:none; }
  header.site-header>.cta-pair { margin-left:auto; }
  .flow .sample { grid-template-columns:minmax(0,1fr) 270px; padding:30px; gap:28px; }
  .sample-main { grid-template-columns:105px minmax(0,1fr); column-gap:20px; }
  .sample-film { min-height:142px; }
  .sample-film strong { font-size:50px; }
  .sample .sample-copy h3 { font-size:22px; }
  .sample-action { padding-left:22px; }
}
@media(max-width:900px) {
  .flow .flow-steps { grid-template-columns:1fr; gap:0; }
  .flow .flow-step { display:grid; grid-template-columns:48px minmax(0,1fr); gap:22px; padding:0 0 32px; }
  .flow .flow-step:last-child { padding-bottom:0; }
  .flow-step:not(:last-child)::after { left:23px; right:auto; top:60px; bottom:12px; width:1px; height:auto; }
  .flow .step-body h3 { margin:8px 0 10px; }
  .flow .sample { grid-template-columns:1fr; padding:32px; gap:26px; }
  .sample-main { grid-template-columns:125px minmax(0,1fr); gap:15px 25px; }
  .sample-action { border-left:0; border-top:1px solid #d8d0c3; padding:24px 0 0; }
  .sample .button { width:auto; min-width:260px; }
  .sample .sample-conditions { max-width:560px; font-size:13px; }
}
@media(max-width:760px) {
  html { scroll-padding-top:28px; }
  header.site-header { height:72px; padding:18px 20px; flex-wrap:nowrap; }
  header.site-header>.cta-pair { display:none; }
  header.site-header>a { margin:auto; }
  .hero { min-height:0; height:auto; padding:32px 24px 24px; }
  .hero-content { position:relative; top:auto; left:auto; right:auto; max-width:none; }
  .hero .eyebrow { font-size:9px; line-height:1.6; margin-bottom:18px; }
  .hero h1 { font-size:40px; }
  .hero .hero-lead { font-size:16px; line-height:1.7; margin:20px 0 10px; }
  .hero-content>p:not(.eyebrow):not(.hero-lead):not(.cta-help) { font-size:16px; line-height:1.75; }
  .hero .cta-pair { max-width:280px; }
  .hero .cta-pair { margin-top:20px; }
  .hero .cta-pair .button { font-size:14px; min-height:50px; padding:13px 20px; }
  .hero .cta-help { font-size:12px!important; line-height:1.7; color:#ffffffe0; max-width:290px; margin-top:10px; }
  .hero .hero-bottom { top:14px; right:14px; left:auto; bottom:auto; }
  .hero .hero-bottom>span { display:none; }
  .hero-bottom small { font-size:9px; }
  .hero-bottom button { width:30px; height:30px; flex:none; }
  .questions .eyebrow,.works>.eyebrow,.flow>.eyebrow,.contact-grid>div>.eyebrow { font-size:10px; gap:12px; }
  .eyebrow>span { padding-right:12px; }
  .question-grid { grid-template-columns:1fr; gap:12px; }
  .question-grid article { display:grid; grid-template-columns:64px minmax(0,1fr); gap:18px; padding:24px 20px; min-height:0; }
  .question-top { margin:0; display:block; }
  .question-top .question-person { width:64px; height:64px; }
  .question-top>span { display:block; text-align:center; font-size:10px; margin-top:10px; }
  .question-copy h3 { font-size:18px; }
  .question-copy p { margin-top:10px; }
  .questions .cta-pair { max-width:none; }
  .questions .button { min-height:54px; font-size:15px; }
  .section-head>p { font-size:16px; line-height:1.85; }
  .story-copy>p:not(.eyebrow):not(.note),.team div>p { font-size:16px; }
  .story-copy h3 { text-wrap:balance; }
  .flow .section-head h2 { text-align:left; }
  .flow .section-head h2 .phrase { display:block; }
  .flow .step-body h3 { font-size:20px; }
  .flow .sample { margin-top:42px; padding:25px 23px; gap:23px; }
  .sample-main { grid-template-columns:84px minmax(0,1fr); gap:19px 17px; }
  .sample-film { grid-row:1; min-height:110px; padding:15px 10px; }
  .sample-film strong { font-size:40px; }
  .sample .sample-film p { flex-direction:column; align-items:center; gap:6px; }
  .sample .sample-film span { font-size:10px; white-space:nowrap; }
  .sample-film small { font-size:6px; letter-spacing:.01em; margin-top:11px; }
  .sample .sample-copy .eyebrow { font-size:9px; letter-spacing:.08em; margin-bottom:10px; }
  .sample .sample-copy h3 { font-size:21px; line-height:1.6; }
  .sample .sample-message { grid-column:1/-1; font-size:16px; }
  .sample .button { width:100%; min-width:0; font-size:15px; }
  .sample .sample-route { font-size:14px; }
  .sample .sample-conditions { font-size:13px; }
  .faq summary { font-size:16px; }
  .faq details p { font-size:16px; }
  .contact h2 { font-size:clamp(27px,8.3vw,34px); }
  .contact h2 em { display:inline-block; }
  .contact-grid>div>p:not(.eyebrow) { font-size:16px; }
  .footer-top p,.footer-company { font-size:14px; }
  .footer-end { flex-wrap:wrap; gap:15px; font-size:12px; }
}
@media(max-width:360px) {
  .craft-about .brand-watermark { right:2px; }
  .hero { height:auto; min-height:0; padding-inline:20px; }
  .hero h1 { font-size:36px; }
  .hero .hero-lead { font-size:16px; }
  .question-grid article { padding:22px 16px; gap:14px; grid-template-columns:54px minmax(0,1fr); }
  .question-top .question-person { width:54px; height:54px; }
  .question-copy h3 { font-size:17px; }
  .sample-main { grid-template-columns:70px minmax(0,1fr); gap:18px 12px; }
  .sample .sample-copy h3 { font-size:19px; }
  .sample-film strong { font-size:34px; }
  .sample-film small { display:none; }
  .sample .button { font-size:14px; padding-inline:16px; }
}