/* Direct-mail letter landing page: quiet, mobile-first surfaces and clear response actions. */
.letter-page { background: var(--ocf-bg); color: var(--ocf-body); }
.letter-section { padding-block: calc(var(--ocf-space-unit) * 4); }
.letter-hero { padding-block: calc(var(--ocf-space-unit) * 5); background: var(--cardinal-band); color: var(--ocf-bg); }
.letter-hero-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.02fr); gap: calc(var(--ocf-grid-gap) * 1.5); align-items: center; }
.letter-hero-copy { max-width: 42rem; }
.letter-hero .eyebrow { color: var(--cardinal-star); }
.letter-hero .heading-1 { max-width: 16ch; margin-block: calc(var(--ocf-space-unit) * 0.75); color: var(--ocf-bg); }
.letter-hero-intro { max-width: 60ch; color: var(--ocf-bg); }
.letter-actions { display: flex; flex-wrap: wrap; gap: calc(var(--ocf-space-unit) * 0.75); align-items: center; }
.letter-hero-actions { margin-top: calc(var(--ocf-space-unit) * 1.25); }
.letter-hero .btn-secondary { border-color: color-mix(in srgb, var(--ocf-bg) 48%, transparent); color: var(--ocf-bg); }
.letter-hero .btn-secondary:hover { background: color-mix(in srgb, var(--ocf-bg) 10%, transparent); }
.letter-hero-note { margin-top: calc(var(--ocf-space-unit) * 0.9); color: var(--ocf-bg); font-size: var(--ocf-font-small-size); }
.letter-hero-visual { overflow: hidden; min-height: 22rem; aspect-ratio: 4 / 3; border-radius: var(--card-radius); background: var(--cardinal-bg-alt); }
.letter-hero-image, .letter-support-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.letter-hero-image { min-height: 22rem; }
.letter-video { background: var(--ocf-bg); }
.letter-video-inner { max-width: 66rem; }
.letter-section-heading { max-width: 52rem; margin: 0 auto calc(var(--ocf-grid-gap) * 1.25); text-align: center; }
.letter-section-heading .heading-2 { margin-bottom: calc(var(--ocf-space-unit) * 0.625); }
.letter-video-frame { display: grid; place-content: center; justify-items: center; gap: calc(var(--ocf-space-unit) * 0.75); width: 100%; aspect-ratio: 16 / 9; min-height: 18rem; padding: var(--ocf-grid-gap); border: var(--card-border-width) solid var(--ocf-border); border-radius: var(--card-radius); background: var(--cardinal-bg-alt); color: var(--ocf-heading); text-align: center; }
.letter-video-play { display: grid; place-items: center; width: calc(var(--ocf-space-unit) * 4); height: calc(var(--ocf-space-unit) * 4); border-radius: 50%; background: var(--ocf-primary); color: var(--ocf-bg); }
.letter-video-play svg { width: 1.45rem; height: 1.45rem; }
.letter-video-placeholder { color: var(--ocf-body); font-size: var(--ocf-font-small-size); }
.letter-form-section { background: var(--cardinal-bg-alt); }
.letter-form-grid { display: grid; grid-template-columns: minmax(0, 0.78fr) minmax(0, 1.22fr); gap: calc(var(--ocf-grid-gap) * 1.5); align-items: start; }
.letter-form-copy { max-width: 34rem; }
.letter-form-copy .heading-2 { margin-bottom: calc(var(--ocf-space-unit) * 0.75); }
.letter-form-panel { min-width: 0; }
.letter-form-panel .hero-form-card { width: 100%; max-width: none; border-color: var(--ocf-border); box-shadow: none; }
.letter-form-panel .form-submit-btn { width: 100%; }
.letter-form-panel .ocf-form-no-obligation { margin: calc(var(--ocf-space-unit) * 0.6) 0 0; text-align: center; }
.letter-privacy-note { margin-top: calc(var(--ocf-space-unit) * 0.75); font-size: var(--ocf-font-small-size); }
.letter-trust { padding-block: calc(var(--ocf-space-unit) * 1.5); border-bottom: var(--card-border-width) solid var(--ocf-border); background: var(--ocf-bg); }
.letter-trust-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--ocf-grid-gap); margin: 0; padding: 0; list-style: none; }
.letter-trust-list li { padding: calc(var(--ocf-space-unit) * 0.75); border-left: calc(var(--card-border-width) * 2) solid var(--cardinal-star); color: var(--ocf-heading); font-weight: var(--font-weight-bold); }
.letter-why { background: var(--ocf-bg); }
.letter-why-grid { display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); gap: calc(var(--ocf-grid-gap) * 1.5); align-items: center; }
.letter-why-copy .heading-2 { margin-bottom: calc(var(--ocf-grid-gap) * 0.75); }
.letter-support-visual { overflow: hidden; min-height: 19rem; aspect-ratio: 4 / 3; border-radius: var(--card-radius); background: var(--cardinal-bg-alt); }
.letter-editorial { background: var(--cardinal-bg-alt); }
.letter-editorial-body { max-width: 58rem; margin-inline: auto; }
.letter-editorial-body h2 { margin: calc(var(--ocf-grid-gap) * 1.4) 0 calc(var(--ocf-grid-gap) * 0.5); color: var(--ocf-heading); }
.letter-editorial-body > section:first-child h2 { margin-top: 0; }
.letter-editorial-body .letter-process-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--ocf-grid-gap); margin: calc(var(--ocf-grid-gap) * 0.75) 0 0; padding: 0; list-style: none; counter-reset: letter-step; }
.letter-editorial-body .letter-process-list li { min-width: 0; padding: calc(var(--ocf-grid-gap) * 0.9); border: var(--card-border-width) solid var(--ocf-border); border-radius: var(--card-radius); background: var(--ocf-bg); counter-increment: letter-step; }
.letter-editorial-body .letter-process-list li::before { display: block; margin-bottom: calc(var(--ocf-space-unit) * 0.4); color: var(--ocf-primary); font-weight: var(--font-weight-bold); content: "0" counter(letter-step); }
.letter-editorial-body .letter-process-list h3 { margin: 0 0 calc(var(--ocf-space-unit) * 0.4); color: var(--ocf-heading); }
.letter-editorial-body .letter-faq-list { border-bottom: var(--card-border-width) solid var(--ocf-border); }
.letter-editorial-body .letter-faq { border-top: var(--card-border-width) solid var(--ocf-border); }
.letter-editorial-body .letter-faq summary { position: relative; padding: calc(var(--ocf-space-unit) * 0.9) calc(var(--ocf-space-unit) * 2.25) calc(var(--ocf-space-unit) * 0.9) 0; color: var(--ocf-heading); font-weight: var(--font-weight-bold); cursor: pointer; list-style: none; }
.letter-editorial-body .letter-faq summary::-webkit-details-marker { display: none; }
.letter-editorial-body .letter-faq summary::after { position: absolute; top: 50%; right: 0; color: var(--ocf-primary); content: "+"; font-size: 1.35rem; transform: translateY(-50%); }
.letter-editorial-body .letter-faq[open] summary::after { content: "−"; }
.letter-editorial-body .letter-faq p { margin: 0 0 calc(var(--ocf-space-unit) * 0.9); max-width: 75ch; }
.letter-contact { background: var(--cardinal-bg-alt); }
.letter-contact-inner, .letter-final-inner { display: flex; justify-content: space-between; gap: calc(var(--ocf-grid-gap) * 1.25); align-items: center; }
.letter-contact-inner > div, .letter-final-inner > div { max-width: 48rem; }
.letter-contact-phone { color: var(--ocf-primary); font-family: var(--ocf-font-heading); font-size: clamp(1.5rem, 3vw, 2.25rem); font-weight: var(--font-weight-bold); text-decoration: none; white-space: nowrap; }
.letter-final-cta { background: var(--cardinal-band); color: var(--ocf-bg); }
.letter-final-cta .heading-2, .letter-final-cta p { color: var(--ocf-bg); }
.letter-final-cta .btn-secondary { border-color: color-mix(in srgb, var(--ocf-bg) 48%, transparent); color: var(--ocf-bg); }
.letter-final-cta .btn-secondary:hover { background: color-mix(in srgb, var(--ocf-bg) 10%, transparent); }
@media (max-width: 767px) {
  .letter-section { padding-block: calc(var(--ocf-space-unit) * 2.75); }
  .letter-hero { padding-block: calc(var(--ocf-space-unit) * 3); }
  .letter-hero-grid, .letter-form-grid, .letter-why-grid { grid-template-columns: minmax(0, 1fr); }
  .letter-hero-grid { gap: calc(var(--ocf-grid-gap) * 1.1); }
  .letter-hero-visual, .letter-hero-image { min-height: 15rem; }
  .letter-hero-visual { aspect-ratio: 4 / 3; }
  .letter-actions { align-items: stretch; }
  .letter-actions > * { flex: 1 1 100%; justify-content: center; text-align: center; }
  .letter-video-frame { min-height: 0; }
  .letter-form-grid { gap: calc(var(--ocf-grid-gap) * 0.85); }
  .letter-trust-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--ocf-space-unit) * 0.5); }
  .letter-trust-list li { padding: calc(var(--ocf-space-unit) * 0.6); }
  .letter-support-visual { min-height: 14rem; }
  .letter-editorial-body .letter-process-list { grid-template-columns: minmax(0, 1fr); }
  .letter-contact-inner, .letter-final-inner { flex-direction: column; align-items: stretch; }
  .letter-contact-phone { white-space: normal; }
}

/* OCF_AGENT_BLOCK:letter-page-polish-v1 START */
/* Intentional video feature, process-image rhythm, and tap-friendly contact action. */
.letter-video { background: var(--cardinal-bg-alt); }
.letter-video-inner {
  display: grid;
  grid-template-columns: minmax(0, 0.82fr) minmax(0, 1.18fr);
  align-items: center;
  gap: calc(var(--ocf-grid-gap) * 1.5);
  max-width: 76rem;
}
.letter-section-heading { max-width: 38rem; margin: 0; text-align: left; }
.letter-section-heading p { max-width: 50ch; margin-bottom: 0; }
.letter-video-frame {
  min-height: 0;
  padding: clamp(1.5rem, 4vw, 3rem);
  border-color: color-mix(in srgb, var(--ocf-primary) 22%, var(--ocf-border));
  background: var(--cardinal-band);
  color: var(--ocf-bg);
  box-shadow: 0 1rem 2rem color-mix(in srgb, var(--ocf-heading) 12%, transparent);
}
.letter-video-play { width: 4rem; height: 4rem; background: var(--cardinal-star); color: var(--ocf-heading); }
.letter-video-placeholder { max-width: 34ch; color: var(--ocf-bg); }
.letter-process-visual {
  width: 100%;
  max-width: 100%;
  margin: calc(var(--ocf-grid-gap) * 1.2) 0;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  border: var(--card-border-width) solid var(--ocf-border);
  border-radius: var(--card-radius);
  background: var(--ocf-bg);
}
.letter-process-image { display: block; width: 100%; height: 100%; object-fit: cover; }
.letter-contact-inner {
  padding: calc(var(--ocf-grid-gap) * 1.25);
  border: var(--card-border-width) solid var(--ocf-border);
  border-left: calc(var(--card-border-width) * 3) solid var(--cardinal-star);
  border-radius: var(--card-radius);
  background: var(--ocf-bg);
}
.letter-contact-phone {
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  min-height: 3.25rem;
  align-items: center;
  justify-content: center;
  padding: 0.65rem 1.15rem;
  border-radius: var(--radius-sm);
  background: var(--ocf-primary);
  color: var(--ocf-bg);
  font-size: clamp(1.25rem, 2.2vw, 2rem);
  text-align: center;
  transition: background var(--duration), transform var(--duration);
}
.letter-contact-phone:hover { background: color-mix(in srgb, var(--ocf-primary) 86%, var(--ocf-heading)); transform: translateY(-1px); }
.letter-contact-phone:focus-visible { outline: 3px solid var(--cardinal-star); outline-offset: 3px; }
@media (max-width: 767px) {
  .letter-video-inner { grid-template-columns: minmax(0, 1fr); gap: calc(var(--ocf-grid-gap) * 0.9); }
  .letter-section-heading { max-width: 44rem; margin: 0; text-align: left; }
  .letter-video-frame { width: 100%; min-height: 0; aspect-ratio: 16 / 9; padding: var(--ocf-grid-gap); }
  .letter-contact-inner { padding: calc(var(--ocf-space-unit) * 1.25); }
  .letter-contact-phone { width: 100%; white-space: nowrap; }
}
/* OCF_AGENT_BLOCK:letter-page-polish-v1 END */
