/* Audited reading layout; preserves authored diagrams, controls and patient-guide hub. */
main { --nsh-reading-width:1200px; }
main [id] { scroll-margin-top:250px; }
main .w1400 { max-width:var(--nsh-reading-width); }
main img[data-semantic-media] { display:block; }
.nshMediaCaption { display:block; padding:9px 12px; color:#4a626c; background:#f4f8f7; font:400 12px/1.5 "Pretendard","Malgun Gothic",sans-serif; text-align:left; word-break:keep-all; }
.subVisual { position:relative; }
.subVisual .nshMediaCaption:not(.nshMediaCaption--hero) { position:absolute; bottom:24px; right:8px; z-index:3; background:rgba(255,255,255,.94); border-radius:5px; }
.nshMediaCaption--hero { display:none; }
/* Keep the whole symptom photograph visible beside its title, below the fixed header. */
body:not(:has(article > .nshHeroBanner)) .subVisual--hero { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:24px 40px; padding:36px max(24px,calc((100vw - 1200px)/2)) 20px !important; margin-top:108px; background:#edf6f4; box-sizing:border-box; }
.subVisual--hero .subVisual__imgAr { position:relative !important; grid-column:2; grid-row:1; height:auto !important; aspect-ratio:3/2; width:100%; border-radius:18px; overflow:hidden; background:#e4eeeb; }
.subVisual--hero .subVisual__imgAr::after { display:none !important; }
.subVisual--hero .subVisual__imgAr > img { display:block; width:100% !important; height:100% !important; margin:0 !important; object-fit:contain !important; object-position:center !important; }
.subVisual--hero .textArea { position:static !important; grid-column:1; grid-row:1; align-self:center; width:auto !important; max-width:none; transform:none !important; padding:12px 0; margin:0; text-align:left; }
.subVisual--hero .textArea .text1 { color:#143b4e !important; font-size:clamp(30px,3vw,44px) !important; line-height:1.35 !important; text-shadow:none; }
.subVisual--hero .textArea .text2 { color:#4c666f !important; font-size:17px; line-height:1.65; margin-top:18px; text-shadow:none; }
.subVisual--hero .lnb-area { position:static !important; grid-column:1/-1; grid-row:2; height:auto !important; width:100%; background:transparent; border-top:1px solid #cddfd9; padding-top:14px; }
.subVisual--hero #lnb { width:100%; padding:0; background:transparent; }
.subVisual--hero #lnb .lnb-item .lna { color:#284e59; }
@media(min-width:769px) and (max-width:1599px) { #nsOfficialQuick.quick { display:none !important; } }
article:has(> .nshHeroBanner) { column-gap:28px; grid-template-columns:minmax(20px,1fr) minmax(0,570px) minmax(0,602px) minmax(20px,1fr); }
article:has(> .nshHeroBanner) > section:first-of-type { max-width:none; }
article:has(> .nshHeroBanner) > .nshHeroBanner { max-width:none; }
.nshReadingPage.nshGuidePage > .nshHeroBanner { max-width:1000px; margin:28px auto !important; }
.nshReadingPage.nshGuidePage > section:first-of-type { width:100%; max-width:1200px; margin:0 auto !important; }
.nshReadingPage.nshGuidePage .nshGuideHero { padding:32px; }
.nshSpineCare { box-sizing:border-box; padding:40px 24px; margin:40px auto; color:#284753; background:#eef7f5; border:1px solid #cfe1dd; border-radius:20px; }
.nshSpineCare__eyebrow { color:#08796e; font-size:14px; font-weight:700; margin:0 0 12px; }
.nshSpineCare h2 { color:#153d50; font-size:clamp(25px,2.5vw,34px); line-height:1.4; margin:0 0 18px; }
.nshSpineCare p { line-height:1.8; font-size:17px; word-break:keep-all; }
.nshSpineCare__grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:18px; margin:24px 0; }
.nshSpineCare__card { min-width:0; padding:24px; border:1px solid #d8e5e1; border-radius:14px; background:#fff; }
.nshSpineCare__card h3 { font-size:21px; color:#163e4e; margin:0 0 12px; line-height:1.4; }
.nshSpineCare__note { padding-top:20px; border-top:1px solid #cbded8; }
.nshSpineCare__links { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }
.nshSpineCare__links a { display:flex; align-items:center; min-height:44px; padding:10px 16px; background:#fff; border:1px solid #bad5d0; border-radius:8px; color:#115d60; font-weight:700; text-decoration:none; }
.nshSpineCare__links a:focus-visible { outline:3px solid #157d75; outline-offset:3px; }
@media(max-width:1180px) {
 article:has(> .nshHeroBanner) { grid-template-columns:24px minmax(0,1fr) 24px; column-gap:0; }
 article:has(> .nshHeroBanner) > .nshHeroBanner, article:has(> .nshHeroBanner) > section:first-of-type { grid-column:2; }
 .nshSpineCare__grid { grid-template-columns:1fr; }
}
@media(max-width:768px) {
 main [id] { scroll-margin-top:210px; }
 article:has(> .nshHeroBanner) { grid-template-columns:18px minmax(0,1fr) 18px; }
 .nshReadingPage.nshGuidePage > .nshHeroBanner { width:calc(100% - 40px); margin:24px auto !important; }
 .nshReadingPage.nshGuidePage .nshGuideHero { padding:24px 20px; }
 .nshSpineCare { width:calc(100% - 32px); margin:28px auto; padding:28px 20px; border-radius:14px; }
 .nshSpineCare p { font-size:16px; }
 .nshSpineCare__card { padding:20px; }
 body:not(:has(article > .nshHeroBanner)) .subVisual--hero { grid-template-columns:1fr; margin-top:74px; padding:24px 20px 18px !important; gap:18px; }
 .subVisual--hero .textArea { grid-column:1; grid-row:1; padding:0; }
 .subVisual--hero .textArea .text1 { font-size:29px !important; }
 .subVisual--hero .textArea .text2 { font-size:15px; margin-top:10px; }
 .subVisual--hero .subVisual__imgAr { grid-column:1; grid-row:2; aspect-ratio:3/2; height:auto !important; }
 .subVisual--hero .lnb-area { grid-row:3; }
 .subVisual .nshMediaCaption { font-size:10px; }
}

/* Final production visual review: keep long copy and image captions in flow. */
.nshHongProfile { padding-top:32px; }
.subMission { overflow:hidden; }
.subMission .missionUl { display:grid!important; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.subMission .missionUl > li { display:flex!important; flex-direction:column; width:auto!important; height:auto!important; min-width:0; margin:0!important; overflow:hidden; }
.subMission .missionUl > li .textAr { position:static!important; width:auto!important; height:auto!important; min-height:0!important; padding:24px!important; flex:1; }
.subMission .missionUl > li .imgAr { position:relative!important; inset:auto!important; transform:none!important; width:100%!important; height:auto!important; margin:0!important; flex:none; }
.subMission .missionUl > li .imgAr img { width:100%!important; height:auto!important; aspect-ratio:3/2; object-fit:contain!important; }
.subMission .missionUl .nshMediaCaption { position:static!important; box-sizing:border-box; }
body:has(.nshReadingStack) .subVisual { display:none!important; }
.nshReadingStack { display:block!important; padding-top:32px; }
.nshReadingStack .nshHeroBanner { max-width:920px; margin:28px auto!important; }
.nshReadingStack .nshHeroBanner img { object-fit:contain!important; }
@media(max-width:1180px) { .subMission .missionUl { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:768px) { .subMission .missionUl { grid-template-columns:1fr; } .nshReadingStack { padding-top:90px; } }
