/* Compact treatment references. Load after case-story-v3.css. */
.treatment-options{margin-top:28px}
.options-heading{margin-bottom:14px}
.treatment-grid{gap:14px}
.cards-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.treatment-card{padding:14px 18px;color:var(--ink-2)}
.product-image{height:122px;--display-height:116px;gap:14px;margin-bottom:8px}
.card-rf .cutout{max-width:calc(50% - 7px)}
.product-copy .overline{font-size:11px;line-height:1.6;letter-spacing:.06em}
.product-copy h4{font-family:var(--sans);font-size:18px;font-weight:400;color:var(--ink-2);line-height:1.5;margin-top:3px;letter-spacing:0}
.product-note{font-size:12px;line-height:1.5;color:var(--ink-2);margin:3px 0 7px}
.product-links{gap:0 12px;padding-top:3px}
.product-links a{font-size:12px;font-weight:400;color:var(--ink-2);line-height:1.5;gap:8px;min-height:44px}
.product-links a span{font-size:18px}

/* The treatment menu is the first decision point after the hero. Keep it
   visually distinct from the chapter-specific assessment blocks. */
.case-treatments{padding:4px 0 52px;scroll-margin-top:calc(var(--nav-height) + 14px)}
.case-treatments-heading{display:flex;align-items:baseline;gap:20px;margin-bottom:16px}
.case-treatments-heading .overline{color:var(--gold-ink);font-size:11px}
.case-treatments-heading h2{font-family:var(--mincho);font-size:24px;font-weight:500;line-height:1.5;color:var(--ink-2);margin:0}
.case-treatments .treatment-options{margin-top:0}
.case-treatments .options-heading{display:none}
.case-treatments .treatment-grid{max-width:none}

/* A single choice reads as one small reference card, not a full-width banner. */
.cards-1{max-width:660px}
.cards-1 .treatment-card{grid-template-columns:190px minmax(0,1fr);gap:24px;padding:14px 22px}
.cards-1 .product-image{height:124px;--display-height:124px;margin:0}
.cards-1 .product-copy h4{font-family:var(--sans);font-size:20px;line-height:1.5}
.cards-1 .product-note{font-size:12px}
.cards-1 .product-links{max-width:none}

@media(max-width:1100px){
  .treatment-card{padding:14px 16px}
  .cards-4{grid-template-columns:repeat(4,minmax(0,1fr))}
  .cards-4 .product-copy h4{font-size:17px}
  .cards-4 .card-rf .product-links{gap:0 8px}
  .cards-4 .card-rf .product-links a{font-size:11px;gap:4px}
}

@media(max-width:900px) and (min-width:761px){
  .cards-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}

/* On narrow screens the photograph and name share one compact horizontal row. */
@media(max-width:760px){
  .case-treatments{padding:2px 0 36px}
  .case-treatments-heading{display:block;margin-bottom:12px}
  .case-treatments-heading .overline{margin-bottom:3px}
  .case-treatments-heading h2{font-size:21px}
  .treatment-grid,.cards-3,.cards-4{grid-template-columns:1fr;gap:10px}
  .cards-1{max-width:none}
  .treatment-card,.cards-1 .treatment-card,.cards-3 .card-ha{
    display:grid;grid-template-columns:112px minmax(0,1fr);align-items:center;
    gap:20px;padding:14px 18px;grid-column:auto;
  }
  .product-image,.cards-1 .product-image,.cards-3 .card-ha .product-image{
    height:116px;--display-height:110px;margin:0;gap:10px;
  }
  .card-rf .cutout{max-width:calc(50% - 5px)}
  .product-copy h4,.cards-1 .product-copy h4{font-family:var(--sans);font-size:18px;line-height:1.5;margin-top:3px}
  .product-copy .overline{font-size:11px;line-height:1.5}
  .product-note,.cards-1 .product-note{font-size:12px;line-height:1.5;margin:3px 0 5px}
  .product-links,.card-rf .product-links{flex-direction:row;gap:0 12px;padding-top:3px}
  .product-links a{font-size:12px;min-height:44px;gap:6px}
  .cards-4 .product-copy h4{font-size:18px}
  .cards-4 .card-rf .product-links{gap:0 12px}
  .cards-4 .card-rf .product-links a{font-size:12px;gap:6px}
}

@media(max-width:480px){
  .treatment-card,.cards-1 .treatment-card,.cards-3 .card-ha{
    grid-template-columns:96px minmax(0,1fr);gap:14px;padding:12px 14px;
  }
  .product-image,.cards-1 .product-image,.cards-3 .card-ha .product-image{
    height:116px;--display-height:110px;gap:8px;
  }
  .card-rf .cutout{max-width:calc(50% - 4px)}
  .product-copy h4,.cards-1 .product-copy h4,.cards-4 .product-copy h4{font-size:17px}
  .product-note,.cards-1 .product-note{font-size:11px}
  .product-links,.cards-4 .card-rf .product-links{gap:0 8px}
  .product-links a,.cards-4 .card-rf .product-links a{font-size:11px;gap:4px}
}

@media(max-width:359px){
  .treatment-card,.cards-1 .treatment-card,.cards-3 .card-ha{
    grid-template-columns:82px minmax(0,1fr);gap:10px;padding:12px;
  }
  .product-copy h4,.cards-1 .product-copy h4,.cards-4 .product-copy h4{font-size:16px}
  .product-links,.cards-4 .card-rf .product-links{gap:0 5px}
}

/* Beside the case photos, keep actual-treatment cards compact and easy to scan. */
.chapter-treatments .treatment-options{margin-top:0}
.chapter-treatments .options-heading{margin-bottom:18px}
.chapter-treatments .options-heading h3{font-family:var(--sans);font-size:16px;font-weight:500;color:var(--ink-2);line-height:1.9}
.chapter-treatments .treatment-grid{grid-template-columns:1fr;max-width:none;gap:12px}
.chapter-treatments .treatment-card{display:grid;grid-template-columns:112px minmax(0,1fr);gap:20px;padding:18px;align-items:center}
.chapter-treatments .product-image{height:112px;--display-height:108px;margin:0}
.chapter-treatments .product-copy h4{font-family:var(--sans);font-size:18px;line-height:1.6}
.chapter-treatments .product-note{font-size:12px}
.chapter-treatments .product-links{max-width:none}
@media(max-width:1100px) and (min-width:761px){
 .chapter-treatments .treatment-card{grid-template-columns:94px minmax(0,1fr);gap:14px;padding:14px}
 .chapter-treatments .product-copy h4{font-size:17px}
}
@media(max-width:760px){
 .chapter-treatments .options-heading{margin-bottom:12px}
 .chapter-treatments .options-heading h3{font-size:15px}
 .chapter-treatments .treatment-card{grid-template-columns:112px minmax(0,1fr);gap:18px;padding:14px 18px}
}
@media(max-width:480px){
 .chapter-treatments .treatment-card{grid-template-columns:96px minmax(0,1fr);gap:14px;padding:12px 14px}
 .chapter-treatments .product-copy h4{font-size:17px}
 .chapter-treatments .product-note{font-size:11px}
}
@media(max-width:359px){
 .chapter-treatments .treatment-card{grid-template-columns:82px minmax(0,1fr);gap:10px;padding:12px}
 .chapter-treatments .product-copy h4{font-size:16px}
}
