/* A photographic index: one quiet spread, nine clear destinations. */
#concerns.hc-gallery{background:#fffdf9;overflow:hidden;padding-block:clamp(64px,7.5vw,104px)}
#concerns.hc-gallery .hc-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:0 36px;margin-bottom:42px}
#concerns.hc-gallery .hc-heading .hp-entry-eyebrow{grid-column:1/-1}
#concerns.hc-gallery .hc-heading h2{font-size:clamp(25px,2.7vw,35px);letter-spacing:.045em;line-height:1.65}
#concerns.hc-gallery .hc-heading-note{max-width:22em;margin:0 0 7px;color:var(--hp-muted);font-size:12px;line-height:1.9;letter-spacing:.045em}
#concerns.hc-gallery .hc-spread{display:grid;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr);gap:clamp(42px,5.6vw,76px);align-items:start}
#concerns.hc-gallery .hc-stage{position:relative;min-width:0;aspect-ratio:.75;margin-top:24px;pointer-events:none}
#concerns.hc-gallery .hc-slide{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:translateY(5px);transition:opacity 180ms ease,transform 260ms ease,visibility 180ms;will-change:auto}
#concerns.hc-gallery .hc-slide.is-active{opacity:1;visibility:visible;transform:translateY(0)}
#concerns.hc-gallery .hc-stage-number{position:absolute;left:0;top:-22px;z-index:1;display:flex;align-items:baseline;gap:14px;color:#726653;font-family:var(--latin,"Times New Roman",serif);font-size:clamp(72px,7.4vw,104px);font-weight:400;font-variant-numeric:tabular-nums;line-height:.9;letter-spacing:.055em;opacity:.78}
#concerns.hc-gallery .hc-stage-number::after{content:"";display:block;width:42px;height:1px;margin-bottom:9px;background:#b09a78;opacity:.8}
#concerns.hc-gallery .hc-stage-photo{margin:29px 0 0 45px;overflow:hidden;aspect-ratio:4/5;background:#f0ece5}
#concerns.hc-gallery .hc-stage-photo img{display:block;width:100%;height:100%;object-fit:cover}
#concerns.hc-gallery .hc-stage-caption{display:flex;align-items:baseline;justify-content:space-between;flex-wrap:wrap;gap:6px 16px;margin:17px 0 0 45px;padding-top:13px;border-top:1px solid var(--hp-line)}
#concerns.hc-gallery .hc-stage-label{color:var(--hp-ink);font-family:var(--mincho);font-size:17px;font-weight:400;line-height:1.7;letter-spacing:.025em}
#concerns.hc-gallery .hc-stage-detail{color:var(--hp-muted);font-size:10px;line-height:1.8;letter-spacing:.025em}
#concerns.hc-gallery .hc-index{list-style:none;margin:0;padding:0;border-top:1px solid var(--hp-line);min-width:0}
#concerns.hc-gallery .hc-index li{min-width:0;margin:0;padding:0}
#concerns.hc-gallery .hc-link{position:relative;display:grid;grid-template-columns:24px minmax(0,1fr) 18px;align-items:center;gap:14px;min-width:0;min-height:68px;padding:16px 0;border-bottom:1px solid var(--hp-line);text-decoration:none;color:#5d554a;transition:border-color 180ms ease,color 180ms ease}
#concerns.hc-gallery .hc-number{color:#a2947f;font-family:Georgia,serif;font-size:12px;line-height:1.5;font-variant-numeric:tabular-nums;letter-spacing:.03em}
#concerns.hc-gallery .hc-thumb{display:none}
#concerns.hc-gallery .hc-thumb-crop{display:none}
#concerns.hc-gallery .hc-stage-more{display:none}
#concerns.hc-gallery [data-hc-slide="melasma"] .hc-stage-image,
#concerns.hc-gallery [data-hc-key="melasma"] .hc-thumb{transform:scale(1.55);transform-origin:50% 100%}
#concerns.hc-gallery .hc-copy{display:flex;align-items:baseline;justify-content:space-between;gap:12px;min-width:0}
#concerns.hc-gallery .hc-name{display:block;font-family:var(--mincho);font-size:21px;font-weight:400;line-height:1.65;letter-spacing:.02em;transition:color 180ms ease}
#concerns.hc-gallery .hc-detail{display:block;flex-shrink:0;color:var(--hp-muted);font-size:10px;line-height:1.8;letter-spacing:.02em}
#concerns.hc-gallery .hc-arrow{justify-self:end;color:var(--hp-gold);font-family:Arial,sans-serif;font-size:15px;line-height:1.5;opacity:.4;transform:translate(0,0);transition:opacity 180ms ease,transform 180ms ease}
#concerns.hc-gallery .hc-link.is-active{color:var(--hp-ink);border-bottom-color:#aa987a}
#concerns.hc-gallery .hc-link.is-active .hc-number{color:#816845}
#concerns.hc-gallery .hc-link.is-active .hc-arrow{opacity:1;transform:translate(2px,-2px)}
#concerns.hc-gallery .hc-link:focus-visible{outline:2px solid var(--hp-gold);outline-offset:5px}
@media(hover:hover){#concerns.hc-gallery .hc-link:hover{color:var(--hp-ink)}}
html[lang^="en"] #concerns.hc-gallery .hc-copy{display:block}
html[lang^="en"] #concerns.hc-gallery .hc-name{font-size:20px;line-height:1.45;letter-spacing:0}
html[lang^="en"] #concerns.hc-gallery .hc-detail{margin-top:3px}
@media(min-width:801px) and (max-width:1100px){
  #concerns.hc-gallery .hc-spread{grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:38px}
  #concerns.hc-gallery .hc-heading-note{max-width:15em}
  #concerns.hc-gallery .hc-copy{display:block}
  #concerns.hc-gallery .hc-name{font-size:20px}
  #concerns.hc-gallery .hc-detail{margin-top:3px}
  #concerns.hc-gallery .hc-link{min-height:75px;padding:12px 0;gap:11px}
  #concerns.hc-gallery .hc-stage{margin-top:56px;position:sticky;top:110px}
  #concerns.hc-gallery .hc-stage-photo{margin-left:30px}
  #concerns.hc-gallery .hc-stage-caption{margin-left:30px}
  #concerns.hc-gallery .hc-stage-number{font-size:82px}
}
@media(max-width:800px){
  /* Phones: the same photograph-and-list interaction as on computers, stacked vertically. The stage stays
     visible at the top while the names are tapped (2026-09-26 user request). */
  #concerns.hc-gallery{padding-block:54px}
  #concerns.hc-gallery .hp-entry-wrap{width:calc(100% - 40px)}
  #concerns.hc-gallery .hc-heading{display:block;margin-bottom:22px}
  #concerns.hc-gallery .hc-heading h2{font-size:25px;line-height:1.7;letter-spacing:.025em}
  #concerns.hc-gallery .hc-heading-note{margin:12px 0 0;max-width:none;font-size:11px;line-height:1.8}
  #concerns.hc-gallery .hc-spread{display:block}
  #concerns.hc-gallery .hc-stage{display:block;position:sticky;top:60px;z-index:2;aspect-ratio:auto;margin:0 0 18px;padding:8px 0 12px;background:#fffdf9;pointer-events:auto}
  #concerns.hc-gallery .hc-slide{position:static;display:none;opacity:1;visibility:visible;transform:none;transition:none}
  #concerns.hc-gallery .hc-slide.is-active{display:block;animation:hc-fade 260ms ease}
  #concerns.hc-gallery .hc-stage-number{position:static;display:flex;align-items:baseline;gap:10px;margin:0 0 8px;font-size:30px;line-height:1}
  #concerns.hc-gallery .hc-stage-number::after{width:26px;margin-bottom:4px}
  #concerns.hc-gallery .hc-stage-photo{margin:0;aspect-ratio:3/2}
  #concerns.hc-gallery .hc-stage-caption{align-items:center;margin:12px 0 0;padding-top:10px}
  #concerns.hc-gallery .hc-stage-label{font-size:16px}
  #concerns.hc-gallery .hc-stage-detail{flex-basis:100%;order:3;margin-top:-2px}
  #concerns.hc-gallery .hc-stage-more{display:inline-flex;align-items:center;gap:8px;margin-left:auto;padding:6px 0 3px;border-bottom:1px solid #aa987a;color:var(--hp-ink);font-size:12px;line-height:1.5;letter-spacing:.06em;text-decoration:none}
  #concerns.hc-gallery .hc-index{display:block;border-top:1px solid var(--hp-line)}
  #concerns.hc-gallery .hc-link{display:grid;grid-template-columns:24px minmax(0,1fr) 18px;align-items:center;gap:12px;min-height:56px;padding:12px 0;border-bottom:1px solid var(--hp-line);color:#5d554a}
  #concerns.hc-gallery .hc-number{font-size:11px;line-height:1.5}
  #concerns.hc-gallery .hc-thumb,#concerns.hc-gallery .hc-thumb-crop{display:none}
  #concerns.hc-gallery .hc-copy{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
  #concerns.hc-gallery .hc-name{min-height:0;font-size:17px;line-height:1.55;letter-spacing:.01em;overflow-wrap:anywhere}
  #concerns.hc-gallery .hc-detail{display:none}
  #concerns.hc-gallery .hc-arrow{position:static;font-size:13px;opacity:.35;transform:none}
  #concerns.hc-gallery .hc-link.is-active{color:var(--hp-ink);border-bottom-color:#aa987a}
  #concerns.hc-gallery .hc-link.is-active .hc-arrow{opacity:1;transform:translate(2px,-2px)}
  html[lang^="en"] #concerns.hc-gallery .hc-name{font-size:15px;line-height:1.45}
}
@keyframes hc-fade{from{opacity:0}to{opacity:1}}
@media(max-width:359px){
  #concerns.hc-gallery .hc-name{font-size:15px}
}
@media(prefers-reduced-motion:reduce){
  #concerns.hc-gallery .hc-slide,#concerns.hc-gallery .hc-link,#concerns.hc-gallery .hc-name,#concerns.hc-gallery .hc-arrow{transition:none!important;transform:none!important}
}
/* Pending concern (page not ready): same row, muted, no link (2026-10-01) */
#concerns.hc-gallery .hc-link-pending{grid-template-columns:24px minmax(0,1fr) auto;color:#9a9184;cursor:default}
#concerns.hc-gallery .hc-link-pending.is-active{color:#9a9184}
#concerns.hc-gallery .hc-link-pending.is-active .hc-number{color:#a2947f}
#concerns.hc-gallery .hc-status{justify-self:end;white-space:nowrap;color:var(--hp-muted);font-size:10px;line-height:1.6;letter-spacing:.04em}
#concerns.hc-gallery .hc-stage-pending{display:none}
@media(hover:hover){#concerns.hc-gallery .hc-link-pending:hover{color:#9a9184}}
@media(max-width:800px){
  #concerns.hc-gallery .hc-link-pending{grid-template-columns:24px minmax(0,1fr) auto}
  #concerns.hc-gallery .hc-status{font-size:10px}
  #concerns.hc-gallery .hc-stage-pending{display:inline-flex;align-items:center;margin-left:auto;padding:6px 0 3px;color:var(--hp-muted);font-size:12px;line-height:1.5;letter-spacing:.06em}
}