/* Colon clinic: page-local layout using the shared typography scale. */
.jik-sub--colon{--colon-green:#72994f;color:#5f5651;font-size:var(--jik-type-body);line-height:1.85}
.jik-sub--colon .colon-hero{background:#edece7;overflow:hidden}
.jik-sub--colon .colon-hero>.jik-container{display:grid;grid-template-columns:1fr 1fr;align-items:center;min-height:360px}
.jik-sub--colon .colon-hero p{font-size:var(--jik-type-page-lead);margin:0 0 12px}
.jik-sub--colon .colon-hero h1{font-size:var(--jik-type-page-title);font-weight:900;line-height:1.2;margin:0;color:#302b28}
.jik-sub--colon .colon-hero img{display:block;width:100%;height:360px;object-fit:cover}
.jik-sub--colon .colon-section{padding:72px 0}
.jik-sub--colon .colon-section h2{font-size:var(--jik-type-section);line-height:1.35}
.jik-sub--colon .colon-section h3{font-size:var(--jik-type-item);font-weight:800;line-height:1.4;margin:0 0 12px}
.jik-sub--colon .colon-section p{font-size:var(--jik-type-body)}
.jik-sub--colon .colon-copy{max-width:1080px;margin:0 auto 32px;text-align:center}
.jik-sub--colon .colon-copy p+p{margin-top:6px}
.jik-sub--colon .colon-tone--tint{background:#f2f1ee}
.jik-sub--colon .colon-tone--dark{background:#534840;color:#fff}
.jik-sub--colon .colon-tone--green{background:var(--colon-green);color:#fff}
.jik-sub--colon .colon-tone--dark h2,.jik-sub--colon .colon-tone--green h2{color:inherit}
.jik-sub--colon .colon-tone--herbal{background:#ece0bd}
.jik-sub--colon .colon-media{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:48px;max-width:1100px;margin:32px auto}
.jik-sub--colon .colon-media>img{width:100%;height:auto;display:block;max-width:600px;margin:auto}
.jik-sub--colon .colon-media--single{display:block}
.jik-sub--colon .colon-media--single>img{max-width:430px}
.jik-sub--colon .colon-checks{list-style:none;padding:0;margin:0}
.jik-sub--colon .colon-checks li{position:relative;padding-left:24px;margin:0 0 13px}
.jik-sub--colon .colon-checks li::before{content:'□';position:absolute;left:0}
.jik-sub--colon .colon-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;margin:32px auto;max-width:1200px}
.jik-sub--colon .colon-cards--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.jik-sub--colon .colon-cards--4{grid-template-columns:repeat(4,minmax(0,1fr))}
.jik-sub--colon .colon-cards>div{background:#f6f5f1;color:#514840;min-width:0}
.jik-sub--colon .colon-cards>div>div{padding:24px}
.jik-sub--colon .colon-cards img{display:block;width:100%;height:auto}
.jik-sub--colon .colon-cards h3{font-size:var(--jik-type-subtitle)}
.jik-sub--colon .colon-cards p{margin:0}
.jik-sub--colon .colon-pills,.jik-sub--colon .colon-rings{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;list-style:none;padding:0;margin:36px auto;max-width:1060px}
.jik-sub--colon .colon-pills li{width:160px;aspect-ratio:1;border-radius:50%;background:var(--colon-green);color:#fff;display:grid;place-items:center;text-align:center;padding:22px;font-weight:700}
.jik-sub--colon .colon-pills li:nth-child(even){background:#446e23}
.jik-sub--colon .colon-rings{gap:28px}.jik-sub--colon .colon-rings li{--ring-color:#71943b;position:relative;width:230px;aspect-ratio:1;border:25px solid var(--ring-color);border-radius:50%;display:grid;place-items:center;text-align:center;padding:18px;font-weight:700;line-height:1.6}
.jik-sub--colon .colon-rings li:nth-child(even){--ring-color:#566b2e}.jik-sub--colon .colon-rings li:not(:last-child)::after{content:"";position:absolute;z-index:1;right:-47px;top:50%;border:15px solid transparent;border-right:0;border-left:21px solid var(--ring-color);transform:translateY(-50%)}.colon-ulcerative-colitis .colon-rings li,.colon-crohns .colon-rings li{--ring-color:#007ca9}.colon-ulcerative-colitis .colon-rings li:nth-child(even),.colon-crohns .colon-rings li:nth-child(even){--ring-color:#008878}
.jik-sub--colon .colon-note{display:grid;grid-template-columns:180px 1fr;gap:28px;align-items:center;background:var(--colon-green);color:white;border-radius:18px;padding:28px 36px;max-width:1040px;margin:32px auto}
.jik-sub--colon .colon-note h3{font-size:var(--jik-type-subtitle);color:#f4ed79;margin:0}
.jik-sub--colon .colon-note p{margin:0}
.jik-sub--colon .colon-after{text-align:center;font-weight:700;max-width:1050px;margin:32px auto}
.jik-sub--colon .colon-numbered{counter-reset:colon-counter;list-style:none;background:var(--colon-green);color:white;border-radius:20px;padding:28px 40px;max-width:1040px;margin:32px auto 0}
.jik-sub--colon .colon-numbered li{counter-increment:colon-counter;position:relative;padding:12px 0 12px 55px}
.jik-sub--colon .colon-numbered li::before{content:counter(colon-counter,decimal-leading-zero);position:absolute;left:0;font-size:var(--jik-type-item);font-weight:800;color:#f1edbd}
.jik-sub--colon .colon-steps{list-style:none;padding:0;max-width:1120px;margin:36px auto}
.jik-sub--colon .colon-steps li{display:grid;grid-template-columns:190px 1fr;background:#efefed;margin:12px 0;align-items:stretch}
.jik-sub--colon .colon-steps li>span{display:grid;place-items:center;background:var(--colon-green);color:white;font-size:var(--jik-type-item);font-weight:800;padding:24px}
.jik-sub--colon .colon-steps li:nth-child(2)>span{background:#42b1a3}
.jik-sub--colon .colon-steps li:nth-child(3)>span{background:#19afdd}
.jik-sub--colon .colon-steps li>div{padding:24px 36px}
.jik-sub--colon .colon-steps p{margin:0}
.jik-sub--colon .colon-chart{max-width:720px;margin:40px auto}
.jik-sub--colon .colon-chart>div{display:flex;justify-content:space-around;align-items:end;border-bottom:1px solid #ccc;gap:14px}
.jik-sub--colon .colon-chart>div>div{text-align:center;flex:1}
.jik-sub--colon .colon-chart strong{color:var(--colon-green);font-size:var(--jik-type-emphasis)}
.jik-sub--colon .colon-chart span{display:block;width:65%;max-width:75px;background:#594c42;margin:12px auto 0;border-radius:18px 18px 0 0}
.jik-sub--colon .colon-chart figcaption{text-align:right;font-size:var(--jik-type-source);margin-top:12px}
.jik-sub--colon .colon-table{overflow-x:auto;max-width:1060px;margin:32px auto}
.jik-sub--colon .colon-table table{width:100%;border-collapse:collapse;background:#fff}
.jik-sub--colon .colon-table td,.jik-sub--colon .colon-table th{padding:15px;border:1px solid #dacfae;text-align:center}
.jik-sub--colon .colon-table thead{background:#958451;color:white}
.jik-sub--colon .colon-quality{display:grid;grid-template-columns:1fr 1fr;max-width:1060px;margin:auto;background:#aa9168}
.jik-sub--colon .colon-quality>div h3,.jik-sub--colon .colon-quality>div p{margin:24px 30px}
.jik-sub--colon .colon-quality img{display:block;width:100%;height:auto;align-self:center}
.jik-sub--colon .colon-doctors{display:grid;grid-template-columns:1fr 1.53fr 1fr;grid-template-rows:1fr 1fr;gap:2px;margin:36px auto;max-width:1100px;align-items:stretch}
.jik-sub--colon .colon-doctors img{display:block;width:100%;height:100%;object-fit:cover}.jik-sub--colon .colon-doctors img:nth-child(1){grid-area:1/1}.jik-sub--colon .colon-doctors img:nth-child(2){grid-area:2/1}.jik-sub--colon .colon-doctors img:nth-child(3){grid-area:1/2/3/3}.jik-sub--colon .colon-doctors img:nth-child(4){grid-area:1/3}.jik-sub--colon .colon-doctors img:nth-child(5){grid-area:2/3}
.jik-sub--colon .colon-contacts,.jik-sub--colon .colon-consult{display:grid;grid-template-columns:1fr 1fr;max-width:1080px;margin:36px auto;gap:24px}
.jik-sub--colon .colon-contacts{text-align:center;border-block:4px solid var(--colon-green);padding:28px 0}
.jik-sub--colon .colon-contacts a{font-size:var(--jik-type-section-sub);font-weight:800}
.jik-sub--colon .colon-consult>div{background:#f5f5f2;padding:28px}
.jik-sub--colon .colon-consult a{font-size:var(--jik-type-item);font-weight:800}
.jik-sub--colon .colon-cards--reasons{grid-template-columns:1fr;gap:10px}
.jik-sub--colon .colon-cards--reasons>div{display:grid;grid-template-columns:1fr 35%;align-items:center}
.jik-sub--colon .colon-cards--reasons>div>img{grid-column:2;grid-row:1}
.jik-sub--colon .colon-cards--reasons>div>div{grid-column:1;grid-row:1;padding:28px 40px}
.jik-sub--colon .colon-cards--causes{grid-template-columns:1fr;gap:3px;max-width:820px}
.jik-sub--colon .colon-cards--causes>div{display:grid;grid-template-columns:170px 1fr;align-items:center;background:#594a41;color:white}
.jik-sub--colon .colon-cards--causes>div:nth-child(even){background:#352c27}
.jik-sub--colon .colon-cards--causes h3{margin:0}
.jik-sub--colon .colon-card-number{display:block;color:var(--colon-green);font-size:var(--jik-type-emphasis);font-weight:800;line-height:1.2;margin-bottom:8px}.jik-sub--colon .colon-cards--causes .colon-card-number{color:#ddd4a5}
@media(max-width:1100px){.jik-sub--colon .colon-rings{flex-direction:column;align-items:center;gap:30px}.jik-sub--colon .colon-rings li:not(:last-child)::after{right:auto;left:50%;top:auto;bottom:-47px;transform:translateX(-50%) rotate(90deg)}.jik-sub--colon .colon-cards--4{grid-template-columns:repeat(2,minmax(0,1fr))}.jik-sub--colon .colon-rings li{width:205px;border-width:20px}.jik-sub--colon .colon-media{gap:28px}}
@media(max-width:767px){.jik-sub--colon .colon-cards--reasons>div{display:flex;flex-direction:column}.jik-sub--colon .colon-cards--reasons>div>div{padding:22px}.jik-sub--colon .colon-cards--causes>div{grid-template-columns:95px 1fr}.jik-sub--colon .colon-cards--causes>div>div{padding:16px}.jik-sub--colon .colon-hero>.jik-container{display:block;min-height:0;padding-top:var(--jik-page-mobile-top,44px);padding-bottom:0;text-align:center}.jik-sub--colon .colon-hero img{height:auto;max-height:260px;object-fit:contain;margin:24px auto 0}.jik-sub--colon .colon-section{padding:44px 0}.jik-sub--colon .colon-media,.jik-sub--colon .colon-cards,.jik-sub--colon .colon-quality,.jik-sub--colon .colon-contacts,.jik-sub--colon .colon-consult{grid-template-columns:1fr;gap:20px}.jik-sub--colon .colon-note{grid-template-columns:1fr;gap:12px;padding:24px}.jik-sub--colon .colon-pills{gap:10px}.jik-sub--colon .colon-pills li{width:130px;padding:14px}.jik-sub--colon .colon-rings li{width:220px}.jik-sub--colon .colon-numbered{padding:18px 22px}.jik-sub--colon .colon-numbered li{padding-left:42px}.jik-sub--colon .colon-steps li{grid-template-columns:1fr}.jik-sub--colon .colon-steps li>span{padding:10px}.jik-sub--colon .colon-steps li>div{padding:22px}.jik-sub--colon .colon-doctors{gap:2px}.jik-sub--colon .colon-chart{margin:28px 0}.jik-sub--colon .colon-chart>div{gap:8px}.jik-sub--colon .colon-table th,.jik-sub--colon .colon-table td{padding:10px 7px}.jik-sub--colon .colon-cards>div>div{padding:20px}}
/* Original cause diagrams: photographs and HTML remain separate. */
.jik-sub--colon .colon-diagram{max-width:1200px;margin:32px auto;display:grid;align-items:center;gap:36px;padding:48px;background:#e6e7df}
.jik-sub--colon .colon-diagram--diarrhea,.jik-sub--colon .colon-diagram--crohn{grid-template-columns:1fr 1fr 1fr;background:#203745 center/cover no-repeat;color:#fff}
.jik-sub--colon .colon-diagram--diarrhea{background-image:url('../img/page/colon/diarrhea-diagram-bg.webp')}
.jik-sub--colon .colon-diagram--crohn{background-image:url('../img/page/colon/crohn-diagram-bg.webp')}
.jik-sub--colon .colon-diagram__factor{position:relative;text-align:center;border:1px solid currentColor}
.jik-sub--colon .colon-diagram__factor h3{background:#fff;color:#302e2b;margin:0;padding:10px;font-size:var(--jik-type-subtitle)}
.jik-sub--colon .colon-diagram__factor p{padding:20px;margin:0}
.jik-sub--colon .colon-diagram--diarrhea .colon-diagram__factor:nth-child(2){grid-column:3;grid-row:1}
.jik-sub--colon .colon-diagram__gut{grid-column:2;grid-row:1}
.jik-sub--colon .colon-diagram__gut img,.jik-sub--colon .colon-diagram__anatomy img{display:block;width:100%;height:auto}
.jik-sub--colon .colon-diagram--diarrhea .colon-diagram__factor::after,.jik-sub--colon .colon-diagram--crohn .colon-diagram__factor:not(.colon-diagram__result)::after{content:'→';position:absolute;left:100%;width:36px;top:50%;font-size:var(--jik-type-item);font-weight:900;transform:translateY(-50%)}
.jik-sub--colon .colon-diagram--diarrhea .colon-diagram__factor:nth-child(2)::after,.jik-sub--colon .colon-diagram--crohn .colon-diagram__factor:last-child::after{left:auto;right:100%;content:'←'}
.jik-sub--colon .colon-diagram__result{border:3px solid #fff;border-radius:50%;aspect-ratio:1;display:flex;flex-direction:column;justify-content:center;padding:20px;outline:1px dashed #fff;outline-offset:-12px}
.jik-sub--colon .colon-diagram__result h3{background:none;color:inherit;font-size:var(--jik-type-body);padding:0}
.jik-sub--colon .colon-diagram__result p{font-size:var(--jik-type-item);font-weight:800;padding:4px 0}
.jik-sub--colon .colon-diagram--ulcerous{grid-template-columns:1fr 1.1fr;padding:0 36px 0 0;gap:32px}
.jik-sub--colon .colon-diagram__pair{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.jik-sub--colon .colon-diagram__pair .colon-diagram__factor{background:#fff;border-color:#aaa}
.jik-sub--colon .colon-diagram__outcome{background:#544942;color:#fff;padding:20px;text-align:center;font-weight:700}
@media(max-width:900px){.jik-sub--colon .colon-diagram{grid-template-columns:1fr;padding:24px;gap:40px}.jik-sub--colon .colon-diagram--diarrhea .colon-diagram__factor:nth-child(2),.jik-sub--colon .colon-diagram__gut{grid-column:auto;grid-row:auto}.jik-sub--colon .colon-diagram__gut{max-width:280px;justify-self:center}.jik-sub--colon .colon-diagram__factor::after{display:none}.jik-sub--colon .colon-diagram--diarrhea .colon-diagram__factor::after,.jik-sub--colon .colon-diagram--crohn .colon-diagram__factor:not(.colon-diagram__result)::after{display:block;left:50%;right:auto;top:auto;bottom:-35px;transform:translateX(-50%);content:'↓';line-height:30px}.jik-sub--colon .colon-diagram__result{order:3;width:260px;max-width:100%;justify-self:center}.jik-sub--colon .colon-diagram__anatomy{max-width:340px;justify-self:center}.jik-sub--colon .colon-diagram__pair{gap:12px}.jik-sub--colon .colon-diagram__factor p{padding:16px}.jik-sub--colon .colon-diagram__pair .colon-diagram__factor p{padding:12px 8px}}
.jik-sub--colon .colon-tone--herbal{background:#ece0bd url('../img/page/colon/herbal-paper.webp') repeat}
.jik-sub--colon .colon-note--photo{grid-template-columns:180px 1fr 230px;background:#d3c393;color:#382f24}.jik-sub--colon .colon-note--photo h3{color:inherit}.jik-sub--colon .colon-note--photo img{width:100%;height:auto}
@media(max-width:767px){.jik-sub--colon .colon-note--photo{grid-template-columns:1fr}.jik-sub--colon .colon-note--photo img{width:230px;max-width:100%;justify-self:center}}