.article-page { overflow-x:hidden;background:#fff; }
.reading-progress { position:fixed;top:0;left:0;z-index:1000;width:0;height:4px;background:var(--coral);box-shadow:0 1px 5px rgba(189,85,68,.3); }
.article-header { position:relative;overflow:hidden;padding:36px 0 48px;background:linear-gradient(120deg,#f9f6f0 0%,#edf7f4 100%);border-bottom:1px solid rgba(7,59,58,.08); }
.article-header::before { content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(7,59,58,.07) .8px,transparent .8px);background-size:18px 18px;mask-image:linear-gradient(to right,black,transparent 70%);opacity:.35; }
.article-header-orb { position:absolute;width:370px;height:370px;right:-120px;top:-210px;border:75px solid rgba(105,188,174,.1);border-radius:50%; }
.article-header .container { position:relative;z-index:1; }
.breadcrumbs { display:flex;align-items:center;gap:7px;margin-bottom:40px;color:var(--muted);font-size:12px;white-space:nowrap;overflow-x:auto; }
.breadcrumbs a:hover { color:var(--green-700); }
.breadcrumbs .material-symbols-rounded { font-size:16px; }
.breadcrumbs > span:last-child { color:var(--green-800);font-weight:700; }
.article-heading-wrap { display:grid;grid-template-columns:minmax(0,1fr) 310px;align-items:end;gap:55px; }
.article-heading { max-width:820px; }
.doctor-reviewed { display:inline-flex;align-items:center;gap:6px;padding:6px 10px;border-radius:99px;background:var(--green-100);color:var(--green-800);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.05em; }
.doctor-reviewed .material-symbols-rounded { font-size:17px;font-variation-settings:"FILL" 1; }
.article-category { margin:18px 0 6px;color:var(--coral-dark);font-size:12px;font-weight:800;text-transform:uppercase;letter-spacing:.12em; }
.article-heading h1 { margin:0;color:var(--green-950);font:800 clamp(39px,5vw,63px)/1.08 "Manrope",sans-serif;letter-spacing:-.045em; }
.article-heading h1 em { color:var(--coral-dark);font-style:normal; }
.article-deck { max-width:780px;margin:22px 0 0;color:var(--ink-soft);font-size:18px;line-height:1.7; }
.article-keypoint { display:flex;align-items:flex-start;gap:13px;padding:22px;border:1px solid rgba(255,255,255,.8);border-radius:18px 18px 18px 5px;background:rgba(255,255,255,.78);box-shadow:var(--shadow-sm);backdrop-filter:blur(10px); }
.article-keypoint > .material-symbols-rounded { width:43px;height:43px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;background:var(--coral-soft);color:var(--coral-dark); }
.article-keypoint p { display:grid;margin:0;line-height:1.5; }
.article-keypoint small { color:var(--coral-dark);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.07em; }
.article-keypoint strong { margin-top:5px;color:var(--green-950);font-size:13px; }
.article-byline { display:flex;align-items:center;justify-content:space-between;gap:30px;margin-top:38px;padding-top:24px;border-top:1px solid rgba(7,59,58,.12); }
.author { display:flex;align-items:center;gap:12px; }
.author img { width:48px;height:48px;object-fit:cover;border:3px solid white;border-radius:50%;box-shadow:0 5px 14px rgba(7,59,58,.1); }
.author p { display:grid;margin:0;line-height:1.25; }
.author small,.review-meta small { color:var(--muted);font-size:10px;text-transform:uppercase;letter-spacing:.05em; }
.author strong { margin:2px 0;color:var(--green-950);font-size:13px; }
.author p span { color:var(--ink-soft);font-size:11px; }
.review-meta { display:flex;align-items:center;gap:32px; }
.review-meta p { display:grid;margin:0;line-height:1.35; }
.review-meta strong { display:flex;align-items:center;gap:4px;margin-top:3px;color:var(--green-950);font-size:11px; }
.review-meta .material-symbols-rounded { font-size:15px;color:var(--green-700); }

.article-layout { display:grid;grid-template-columns:minmax(0,1fr) 310px;align-items:start;gap:68px;padding-top:60px;padding-bottom:105px; }
.health-article { min-width:0;max-width:800px; }
.article-feature { margin:0 0 45px;overflow:hidden;border-radius:24px;background:var(--green-50);box-shadow:var(--shadow-lg); }
.article-feature img { width:100%;aspect-ratio:16/9;object-fit:cover; }
.article-feature figcaption { display:flex;align-items:flex-start;gap:8px;padding:12px 17px;background:white;color:var(--muted);font-size:11px; }
.article-feature figcaption .material-symbols-rounded { flex:0 0 auto;color:var(--green-700);font-size:18px; }
.article-intro { margin-bottom:56px;padding:26px 29px;border-left:4px solid var(--coral);border-radius:0 14px 14px 0;background:var(--cream); }
.article-intro p { margin:0;color:var(--green-950);font:500 19px/1.75 "DM Sans",sans-serif; }
.article-section { position:relative;margin-bottom:65px;scroll-margin-top:115px; }
.section-number { display:block;margin-bottom:8px;color:var(--coral-dark);font-size:11px;font-weight:800;letter-spacing:.12em; }
.article-section h2,.urgent-callout h2,.references h2 { margin:0 0 18px;color:var(--green-950);font:800 clamp(27px,3vw,36px)/1.22 "Manrope",sans-serif;letter-spacing:-.035em; }
.article-section > p { margin:0 0 18px;color:var(--ink-soft);font-size:17px;line-height:1.82; }
.evidence-note { display:flex;align-items:flex-start;gap:13px;margin-top:25px;padding:18px 20px;border:1px solid #cde3de;border-radius:14px;background:var(--green-50); }
.evidence-note > .material-symbols-rounded { color:var(--green-700);font-size:23px; }
.evidence-note p { display:grid;margin:0;color:var(--ink-soft);font-size:13px; }
.evidence-note strong { margin-bottom:3px;color:var(--green-950);font-size:14px; }
.symptom-grid { display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:27px; }
.symptom-grid > div { display:flex;align-items:flex-start;gap:12px;padding:18px;border:1px solid var(--line);border-radius:14px;background:#fff; }
.symptom-grid > div > .material-symbols-rounded { width:39px;height:39px;display:grid;place-items:center;flex:0 0 auto;border-radius:11px;background:var(--coral-soft);color:var(--coral-dark);font-size:21px; }
.symptom-grid p { display:grid;margin:0;line-height:1.4; }
.symptom-grid strong { color:var(--green-950);font-size:13px; }
.symptom-grid small { margin-top:4px;color:var(--muted);font-size:11px; }
.urgent-callout { margin:4px 0 65px;padding:27px;border:1px solid #f1c7bd;border-radius:18px;background:var(--red-soft);scroll-margin-top:115px; }
.urgent-callout-heading { display:flex;align-items:center;gap:13px;margin-bottom:15px; }
.urgent-callout-heading > .material-symbols-rounded { width:50px;height:50px;display:grid;place-items:center;flex:0 0 auto;border-radius:14px;background:white;color:var(--red);font-size:26px; }
.urgent-callout-heading small { color:var(--red);font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.1em; }
.urgent-callout h2 { margin:2px 0 0;color:#6c2929;font-size:26px; }
.urgent-callout > p { margin:0 0 12px;color:#654343;font-size:14px; }
.urgent-callout ul { display:grid;grid-template-columns:1fr 1fr;gap:8px 26px;margin:0 0 18px;padding-left:20px;color:#654343;font-size:13px; }
.urgent-callout a { display:inline-flex;align-items:center;gap:6px;color:var(--red);font-size:12px;font-weight:800; }
.urgent-callout a .material-symbols-rounded { font-size:17px; }
.plain-language-box { display:flex;align-items:flex-start;gap:14px;margin-top:24px;padding:22px;border-radius:15px;background:#f4f1eb; }
.plain-language-box > .material-symbols-rounded { width:42px;height:42px;display:grid;place-items:center;flex:0 0 auto;border-radius:12px;background:white;color:var(--green-700); }
.plain-language-box strong { display:block;margin-bottom:5px;color:var(--green-950);font-size:14px; }
.plain-language-box p { margin:0;color:var(--ink-soft);font-size:13px;line-height:1.65; }
.article-section blockquote { position:relative;margin:28px 0 0;padding:28px 28px 28px 63px;border:0;border-radius:15px;background:var(--green-950);color:white; }
.article-section blockquote > .material-symbols-rounded { position:absolute;top:24px;left:24px;color:#80d1c6;font-size:27px; }
.article-section blockquote p { margin:0;color:#d4e2e0;font:500 16px/1.7 "DM Sans",sans-serif; }
.treatment-steps { display:grid;gap:11px;margin:26px 0; }
.treatment-steps > div { display:flex;align-items:flex-start;gap:14px;padding:17px 19px;border:1px solid var(--line);border-radius:14px; }
.treatment-steps > div > span { width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;background:var(--green-100);color:var(--green-800);font-weight:800; }
.treatment-steps p { display:grid;margin:0;line-height:1.45; }
.treatment-steps strong { color:var(--green-950);font-size:14px; }
.treatment-steps small { margin-top:4px;color:var(--muted);font-size:12px; }
.medical-disclaimer { display:flex;align-items:flex-start;gap:13px;padding:20px;border-radius:14px;background:#eef4f7;color:var(--ink-soft);font-size:13px; }
.medical-disclaimer > .material-symbols-rounded { color:#315c7a; }
.medical-disclaimer p { display:grid;margin:0; }
.medical-disclaimer strong { margin-bottom:4px;color:var(--green-950);font-size:14px; }
.prevention-list { display:grid;gap:12px;margin-top:25px; }
.prevention-list > div { display:flex;align-items:flex-start;gap:13px;padding:5px 0; }
.prevention-list > div > .material-symbols-rounded { color:var(--green-700);font-variation-settings:"FILL" 1; }
.prevention-list p { display:grid;margin:0;line-height:1.45; }
.prevention-list strong { color:var(--green-950);font-size:14px; }
.prevention-list small { margin-top:4px;color:var(--ink-soft);font-size:13px; }
.references { margin-top:75px;padding:28px;border:1px solid var(--line);border-radius:16px;background:var(--cream); }
.references h2 { font-size:22px; }
.references > p { color:var(--ink-soft);font-size:13px; }
.references ol { margin:18px 0 0;padding-left:20px;color:var(--muted);font-size:12px; }
.references li+li { margin-top:8px; }
.references a { color:var(--green-700);text-decoration:underline;text-underline-offset:3px; }
.article-share { display:flex;align-items:center;gap:9px;margin-top:26px;padding:20px 0;border-block:1px solid var(--line); }
.article-share > div { display:grid;flex:1;line-height:1.35; }
.article-share strong { color:var(--green-950);font-size:13px; }
.article-share > div span { margin-top:3px;color:var(--muted);font-size:11px; }
.share-button { width:41px;height:41px;display:grid;place-items:center;border:0;border-radius:11px;background:var(--green-900);color:white; }
.share-button.whatsapp { background:#218b54; }
.share-button:hover { transform:translateY(-2px); }
.ask-banner { position:relative;display:grid;grid-template-columns:1fr 190px;align-items:center;gap:30px;margin-top:55px;padding:36px;overflow:hidden;border-radius:22px;background:var(--green-800);color:white;box-shadow:var(--shadow-lg); }
.ask-banner::before { content:"";position:absolute;width:220px;height:220px;right:-80px;top:-100px;border:45px solid rgba(255,255,255,.05);border-radius:50%; }
.ask-banner > div { position:relative;z-index:1; }
.ask-banner h2 { margin:8px 0;color:white;font:800 30px/1.2 "Manrope",sans-serif; }
.ask-banner p { margin:0 0 22px;color:#cadbd8;font-size:14px; }
.ask-banner img { position:relative;z-index:1;width:190px;height:150px;object-fit:cover;border:1px solid rgba(255,255,255,.25);border-radius:15px; }
.mobile-toc { display:none; }

.article-sidebar { position:sticky;top:105px;display:grid;gap:22px; }
.desktop-toc { padding:24px;border:1px solid var(--line);border-radius:16px;background:white; }
.desktop-toc > p { margin:0 0 16px;color:var(--green-800);font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.1em; }
.desktop-toc a { display:block;padding:8px 0 8px 13px;border-left:2px solid var(--line);color:var(--ink-soft);font-size:12px; }
.desktop-toc a:hover,.desktop-toc a.active { border-color:var(--coral);color:var(--green-950);font-weight:700; }
.sidebar-consult { padding:25px;border-radius:18px 18px 18px 5px;background:var(--green-50);box-shadow:var(--shadow-sm); }
.sidebar-consult > .material-symbols-rounded { width:50px;height:50px;display:grid;place-items:center;margin-bottom:17px;border-radius:14px;background:white;color:var(--green-700);font-size:25px; }
.sidebar-consult h2 { margin:7px 0 8px;color:var(--green-950);font:700 23px "Manrope",sans-serif; }
.sidebar-consult > p:not(.kicker) { margin:0 0 17px;color:var(--ink-soft);font-size:12px; }
.sidebar-consult ul { display:grid;gap:7px;margin:0 0 21px;padding:0;list-style:none; }
.sidebar-consult li { display:flex;align-items:center;gap:7px;color:var(--green-800);font-size:11px;font-weight:700; }
.sidebar-consult li .material-symbols-rounded { color:var(--coral-dark);font-size:17px; }
.sidebar-consult .button { width:100%;padding-inline:13px;font-size:12px; }
.related-sidebar { padding-top:5px; }
.related-sidebar > p { margin:0 0 12px; }
.related-sidebar > a { display:flex;align-items:center;gap:11px;padding:10px;border-radius:12px;transition:background .2s; }
.related-sidebar > a:hover { background:var(--cream); }
.related-sidebar img { width:72px;height:62px;object-fit:cover;border-radius:9px; }
.related-sidebar a > span { display:grid;line-height:1.35; }
.related-sidebar strong { color:var(--green-950);font-size:11px; }
.related-sidebar small { margin-top:4px;color:var(--muted);font-size:10px; }

.article-videos { padding:85px 0 100px;background:var(--cream); }
.video-section-heading { display:flex;align-items:end;justify-content:space-between;gap:25px;margin-bottom:30px; }
.video-section-heading h2 { margin:8px 0 0;color:var(--green-950);font:800 36px/1.2 "Manrope",sans-serif;letter-spacing:-.035em; }
.video-section-heading > a { display:inline-flex;align-items:center;gap:6px;color:var(--green-700);font-size:13px;font-weight:800; }
.video-section-heading > a .material-symbols-rounded { font-size:18px; }
.article-video-grid { display:grid;grid-template-columns:repeat(3,1fr);gap:20px; }
.article-video-grid > button { display:grid;padding:0;border:0;background:transparent;text-align:left; }
.video-thumb { position:relative;display:block;aspect-ratio:16/9;margin-bottom:14px;overflow:hidden;border-radius:16px;background:var(--green-100); }
.video-thumb img { width:100%;height:100%;object-fit:cover;transition:transform .45s; }
.article-video-grid button:hover .video-thumb img { transform:scale(1.04); }
.video-thumb > .material-symbols-rounded { position:absolute;inset:0;width:52px;height:52px;display:grid;place-items:center;margin:auto;border:5px solid rgba(255,255,255,.25);border-radius:50%;background:var(--coral);color:white;font-size:27px;font-variation-settings:"FILL" 1; }
.video-thumb > small { position:absolute;right:10px;bottom:9px;padding:4px 6px;border-radius:6px;background:rgba(4,31,30,.78);color:white;font-size:9px; }
.article-video-grid button > strong { color:var(--green-950);font:700 15px/1.35 "Manrope",sans-serif; }
.article-video-grid button > small { margin-top:4px;color:var(--muted);font-size:11px; }

@media(max-width:1000px){
  .article-heading-wrap{grid-template-columns:1fr}.article-keypoint{max-width:600px}.article-layout{grid-template-columns:minmax(0,1fr) 270px;gap:38px}.review-meta{gap:18px}.ask-banner{grid-template-columns:1fr 150px}.ask-banner img{width:150px}
}
@media(max-width:820px){
  .article-heading-wrap{gap:30px}.article-byline{align-items:flex-start;flex-direction:column}.review-meta{width:100%;justify-content:space-between}.article-layout{grid-template-columns:1fr;padding-top:42px}.article-sidebar{position:static}.desktop-toc{display:none}.sidebar-consult{display:none}.related-sidebar{display:none}
  .mobile-toc{display:block;margin:0 0 25px;border:1px solid var(--line);border-radius:13px;background:white}.mobile-toc summary{display:flex;align-items:center;justify-content:space-between;padding:15px 17px;color:var(--green-950);font-weight:800;cursor:pointer;list-style:none}.mobile-toc summary>span:first-child{display:flex;align-items:center;gap:8px}.mobile-toc summary .material-symbols-rounded{font-size:20px}.mobile-toc nav{display:grid;padding:0 17px 15px}.mobile-toc nav a{padding:7px 0;color:var(--ink-soft);font-size:13px}
  .article-video-grid{grid-template-columns:repeat(2,1fr)}.article-video-grid>button:last-child{grid-column:1/-1;width:calc(50% - 10px);justify-self:center}
}
@media(max-width:600px){
  .article-header{padding:28px 0 38px}.breadcrumbs{margin-bottom:30px}.article-heading h1{font-size:39px}.article-deck{font-size:16px}.article-keypoint{padding:18px}.article-byline{margin-top:28px}.review-meta{display:grid;grid-template-columns:1fr 1fr;gap:15px}.review-meta p:last-child{grid-column:1/-1}
  .article-layout{padding-bottom:75px}.article-feature{margin-bottom:35px;border-radius:18px}.article-feature figcaption{font-size:10px}.article-intro{padding:21px}.article-intro p{font-size:17px}.article-section{margin-bottom:55px}.article-section>p{font-size:16px}.symptom-grid{grid-template-columns:1fr}.urgent-callout{padding:21px}.urgent-callout ul{grid-template-columns:1fr}.article-section blockquote{padding:24px 22px 24px 55px}
  .ask-banner{grid-template-columns:1fr;padding:28px}.ask-banner img{display:none}.article-share{align-items:flex-start;flex-wrap:wrap}.article-share>div{flex-basis:calc(100% - 100px)}
  .article-videos{padding:65px 0 80px}.video-section-heading{align-items:flex-start;flex-direction:column}.video-section-heading h2{font-size:30px}.article-video-grid{grid-template-columns:1fr}.article-video-grid>button:last-child{grid-column:auto;width:auto}.video-thumb>small{font-size:10px}
}
