/* ==========================================================================
   Specialties – listing cards and specialty pages
   ========================================================================== */

/* ---------- Listing cards: photo cards with text on a dark fade ---------- */
.sw-specs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.sw-spec {
	position: relative; isolation: isolate;
	display: flex; flex-direction: column; justify-content: space-between;
	height: clamp(360px, 30vw, 420px);
	padding: 18px;
	border-radius: 26px; overflow: hidden;
	color: #fff;
	background: var(--sw-overlay);
	transition: transform .5s cubic-bezier(.22, .61, .36, 1), box-shadow .5s;
}
.sw-spec:hover { transform: translateY(-6px); box-shadow: 0 34px 60px -30px rgba(10, 34, 51, .55); }
.sw-spec__img { position: absolute; inset: 0; z-index: -2; }
.sw-spec__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1s cubic-bezier(.22, .61, .36, 1); }
.sw-spec:hover .sw-spec__img img { transform: scale(1.07); }
.sw-spec::after {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(180deg, rgba(8, 28, 40, .1) 0%, rgba(8, 28, 40, .25) 40%, rgba(8, 28, 40, .88) 100%);
	transition: opacity .5s;
}
.sw-spec__top { display: flex; justify-content: space-between; align-items: flex-start; }
.sw-spec__icon, .sw-spec__go {
	display: grid; place-items: center;
	width: 48px; height: 48px; border-radius: 50%;
	background: rgba(255, 255, 255, .18);
	border: 1px solid rgba(255, 255, 255, .3);
	-webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px);
}
.sw-spec__icon .sw-icon { width: 22px; height: 22px; }
.sw-spec__go { width: 44px; height: 44px; background: #fff; color: var(--sw-dark); border: 0; transition: transform .45s cubic-bezier(.22, .61, .36, 1), background-color .3s, color .3s; }
.sw-spec__go .sw-icon { width: 18px; height: 18px; }
.sw-spec:hover .sw-spec__go { transform: rotate(45deg); background: var(--sw-primary); color: #fff; }
.sw-spec__body { display: grid; gap: 8px; }
.sw-spec__count { justify-self: start; padding: 5px 11px; border-radius: 999px; background: rgba(255, 255, 255, .16); -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); font-size: .76rem; }
.sw-spec__title { font-size: 1.45rem; font-weight: 500; letter-spacing: -0.025em; line-height: 1.15; }
.sw-spec__text { font-size: .9rem; line-height: 1.5; color: rgba(255, 255, 255, .8); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---------- Overview ---------- */
.sw-sover { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(24px, 5vw, 80px); }
.sw-sover__head .sw-tag { margin-bottom: 16px; }
.sw-sover__title { margin: 0; font-size: clamp(1.8rem, 1.2rem + 1.8vw, 2.7rem); line-height: 1.08; letter-spacing: -0.04em; }
.sw-sover__text { font-size: 1.05rem; color: color-mix(in srgb, var(--sw-dark) 78%, var(--sw-white)); }
.sw-sover__text p:first-child { font-size: 1.2rem; line-height: 1.55; color: var(--sw-dark); letter-spacing: -0.01em; }
.sw-shead__note { max-width: 360px; margin: 0; color: var(--sw-muted); font-size: .95rem; }

/* ---------- Conditions ---------- */
.sw-conds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.sw-cond {
	position: relative;
	padding: 24px;
	border-radius: 20px;
	background: var(--sw-light);
	overflow: hidden;
	transition: background-color .4s var(--sw-ease), transform .4s var(--sw-ease);
}
.sw-cond::after {
	content: ""; position: absolute; left: 24px; right: 24px; bottom: 0; height: 3px;
	border-radius: 3px 3px 0 0; background: var(--sw-primary);
	transform: scaleX(0); transform-origin: left; transition: transform .5s var(--sw-ease);
}
.sw-cond:hover { background: color-mix(in srgb, var(--sw-primary) 9%, var(--sw-white)); transform: translateY(-3px); }
.sw-cond:hover::after { transform: scaleX(1); }
.sw-cond__num { display: block; margin-bottom: 26px; font-size: .82rem; font-weight: 600; color: var(--sw-primary); }
.sw-cond h3 { margin: 0 0 8px; font-size: 1.15rem; letter-spacing: -0.02em; }
.sw-cond p { margin: 0; font-size: .92rem; line-height: 1.55; color: var(--sw-muted); }

/* ---------- Procedures ---------- */
.sw-procs { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(24px, 5vw, 80px); align-items: start; }
.sw-procs__side { position: sticky; top: 110px; }
.sw-procs__side .sw-blog__title { margin-bottom: 14px; }
.sw-procs__side > p { margin: 0 0 22px; color: var(--sw-muted); }
.sw-procs__img { margin: 0; aspect-ratio: 4 / 3; border-radius: 20px; overflow: hidden; }
.sw-procs__img img { width: 100%; height: 100%; object-fit: cover; }
.sw-procs__list { margin: 0; padding: 0; list-style: none; }
.sw-procs__list li { display: grid; grid-template-columns: 52px 1fr; gap: 18px; padding: 22px 0; border-top: 1px solid var(--sw-border); transition: padding .4s var(--sw-ease); }
.sw-procs__list li:last-child { border-bottom: 1px solid var(--sw-border); }
.sw-procs__list li > span {
	display: grid; place-items: center;
	width: 52px; height: 52px; border-radius: 50%;
	border: 1px solid var(--sw-border);
	font-size: .9rem; font-weight: 600; color: var(--sw-primary);
	transition: background-color .35s, color .35s, border-color .35s;
}
.sw-procs__list li:hover > span { background: var(--sw-primary); border-color: var(--sw-primary); color: #fff; }
.sw-procs__list h3 { margin: 4px 0 6px; font-size: 1.2rem; letter-spacing: -0.02em; }
.sw-procs__list p { margin: 0; font-size: .94rem; line-height: 1.55; color: var(--sw-muted); }

/* ---------- Journey (dark band) ---------- */
.sw-journey {
	padding: clamp(28px, 4vw, 52px) clamp(22px, 4vw, 56px);
	border-radius: var(--sw-radius);
	color: rgba(255, 255, 255, .72);
	background:
		radial-gradient(55% 85% at 100% 0%, color-mix(in srgb, var(--sw-primary) 42%, transparent) 0%, transparent 70%),
		linear-gradient(135deg, #0A2233 0%, var(--sw-overlay) 100%);
}
.sw-journey__title { margin: 0 0 clamp(24px, 3vw, 40px); color: #fff; font-size: clamp(1.7rem, 1.1rem + 1.6vw, 2.5rem); letter-spacing: -0.035em; }
.sw-journey__steps { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 24px; margin: 0; padding: 0; list-style: none; }
.sw-journey__steps::before { content: ""; position: absolute; left: 22px; right: 22px; top: 22px; height: 1px; background: linear-gradient(90deg, rgba(255, 255, 255, .35), rgba(255, 255, 255, .08)); }
.sw-journey__steps li { position: relative; }
.sw-journey__dot {
	position: relative;
	display: grid; place-items: center;
	width: 44px; height: 44px; margin-bottom: 18px;
	border-radius: 50%;
	background: var(--sw-primary); color: #fff; font-weight: 600;
	box-shadow: 0 0 0 6px color-mix(in srgb, var(--sw-primary) 22%, transparent);
}
.sw-journey__steps h3 { margin: 0 0 6px; color: #fff; font-size: 1.1rem; }
.sw-journey__steps p { margin: 0; font-size: .9rem; line-height: 1.55; }

@media (max-width: 1023px) {
	.sw-specs, .sw-conds { grid-template-columns: 1fr 1fr; }
	.sw-journey__steps { grid-template-columns: 1fr 1fr; row-gap: 28px; }
	.sw-journey__steps::before { display: none; }
}
@media (max-width: 860px) {
	.sw-sover, .sw-procs { grid-template-columns: 1fr; }
	.sw-procs__side { position: static; }
	.sw-procs__img { display: none; }
}
@media (max-width: 620px) {
	.sw-specs, .sw-conds, .sw-journey__steps { grid-template-columns: 1fr; }
	.sw-spec { height: 320px; }
	.sw-cond__num { margin-bottom: 12px; }
}
.sw-spec__icon { background: var(--sw-primary); border-color: transparent; }
@media (max-width: 620px) {
	.sw-conds { gap: 10px; }
	.sw-cond { display: grid; grid-template-columns: 30px 1fr; column-gap: 10px; padding: 16px 18px; border-radius: 16px; }
	.sw-cond__num { grid-row: span 2; margin: 3px 0 0; }
	.sw-cond h3 { margin-bottom: 4px; font-size: 1.05rem; }
	.sw-cond p { font-size: .88rem; }
	.sw-procs__list li { grid-template-columns: 40px 1fr; gap: 14px; padding: 16px 0; }
	.sw-procs__list li > span { width: 40px; height: 40px; }
	.sw-procs__list h3 { font-size: 1.05rem; }
}

/* ---------- Specialists (1–2 doctors): wide profile cards ---------- */
.sw-wdocs { display: grid; gap: 20px; }
.sw-wdocs--2 { grid-template-columns: 1fr 1fr; }
.sw-wdoc {
	position: relative;
	display: grid; grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr);
	border: 1px solid var(--sw-border); border-radius: 26px;
	background: var(--sw-white); overflow: hidden;
	transition: box-shadow .4s var(--sw-ease), border-color .4s;
}
.sw-wdoc:hover { border-color: transparent; box-shadow: 0 34px 60px -34px rgba(10, 34, 51, .4); }
.sw-wdoc__media {
	position: relative; display: block; min-height: 400px; overflow: hidden;
	background:
		radial-gradient(90% 55% at 50% 105%, color-mix(in srgb, var(--sw-primary) 42%, #fff) 0%, transparent 70%),
		radial-gradient(60% 45% at 85% 8%, rgba(255, 255, 255, .9) 0%, transparent 70%),
		linear-gradient(165deg, #F3F8FA 0%, color-mix(in srgb, var(--sw-primary) 16%, #EEF6F9) 100%);
}
.sw-wdoc__media::before { content: ""; position: absolute; left: 50%; top: 14%; width: 84%; aspect-ratio: 1; transform: translateX(-50%); border-radius: 50%; border: 1px solid color-mix(in srgb, var(--sw-primary) 22%, transparent); background: radial-gradient(circle, rgba(255, 255, 255, .75) 0%, transparent 68%); }
.sw-wdoc__img { position: absolute; left: 50%; bottom: 0; height: 90%; width: auto; max-width: none; transform: translateX(-50%); transition: transform .8s var(--sw-ease); }
.sw-wdoc:hover .sw-wdoc__img { transform: translateX(-50%) scale(1.03); }
.sw-wdoc .sw-dcard__initials { top: 22%; font-size: clamp(5rem, 7vw, 7rem); }
.sw-wdoc .sw-dcard__silhouette { top: calc(22% + clamp(5.6rem, 7.8vw, 7.8rem)); }
.sw-wdoc__exp { position: absolute; left: 14px; bottom: 14px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border-radius: 999px; background: rgba(255, 255, 255, .9); font-size: .8rem; font-weight: 500; }
.sw-wdoc__exp .sw-icon { width: 15px; height: 15px; color: var(--sw-primary); }
.sw-wdoc__body { display: flex; flex-direction: column; padding: clamp(22px, 2.6vw, 34px); }
.sw-wdoc__spec { align-self: flex-start; }
.sw-wdoc__name { margin: 0 0 4px; font-size: clamp(1.5rem, 1.1rem + 1vw, 2.1rem); letter-spacing: -0.03em; }
.sw-wdoc__name a:hover { color: var(--sw-primary); }
.sw-wdoc__role { margin: 0 0 12px; font-weight: 500; color: color-mix(in srgb, var(--sw-primary) 70%, var(--sw-dark)); }
.sw-wdoc__deg { display: flex; gap: 8px; margin: 0 0 14px; font-size: .88rem; line-height: 1.5; }
.sw-wdoc__deg .sw-icon { width: 17px; height: 17px; margin-top: 2px; flex: none; color: var(--sw-primary); }
.sw-wdoc__intro { margin: 0 0 18px; max-width: 620px; color: var(--sw-muted); line-height: 1.6; }
.sw-wdoc__hl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0 0 16px; padding: 0; list-style: none; }
.sw-wdoc__hl li { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 14px; background: var(--sw-light); }
.sw-wdoc__hl i { display: grid; place-items: center; flex: none; width: 32px; height: 32px; border-radius: 10px; background: var(--sw-white); color: color-mix(in srgb, var(--sw-primary) 75%, var(--sw-dark)); }
.sw-wdoc__hl .sw-icon { width: 16px; height: 16px; }
.sw-wdoc__hl span { display: grid; line-height: 1.3; }
.sw-wdoc__hl b { font-size: .88rem; font-weight: 600; }
.sw-wdoc__hl small { font-size: .74rem; color: var(--sw-muted); }
.sw-wdoc__chips { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 20px; padding: 0; list-style: none; }
.sw-wdoc__chips li { padding: 5px 12px; border: 1px solid var(--sw-border); border-radius: 999px; font-size: .8rem; }
.sw-wdoc__actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin-top: auto; }
.sw-wdoc__profile { display: inline-flex; align-items: center; gap: 5px; font-size: .92rem; font-weight: 500; }
.sw-wdoc__profile .sw-icon { width: 15px; height: 15px; }
.sw-wdoc__profile:hover { color: var(--sw-primary); }
/* two doctors: photo on top, details below, side by side */
.sw-wdocs--2 .sw-wdoc { grid-template-columns: 1fr; }
.sw-wdocs--2 .sw-wdoc__media { min-height: 300px; }
.sw-wdocs--2 .sw-wdoc__hl { grid-template-columns: 1fr; }
@media (max-width: 1023px) {
	.sw-wdocs--2 { grid-template-columns: 1fr; }
	.sw-wdoc { grid-template-columns: 1fr; }
	.sw-wdoc__media { min-height: 320px; }
}
@media (max-width: 620px) {
	.sw-wdoc__hl { grid-template-columns: 1fr; }
	.sw-wdoc__media { min-height: 280px; }
}
/* fixes: pill + round icon button styles, two doctors = stacked horizontal rows */
.sw-wdoc__spec { margin-bottom: 10px; padding: 5px 12px; border-radius: 999px; background: color-mix(in srgb, var(--sw-primary) 12%, var(--sw-white)); color: color-mix(in srgb, var(--sw-primary) 70%, var(--sw-dark)); font-size: .78rem; font-weight: 500; }
.sw-wdoc .sw-fdoc__icon { display: grid; place-items: center; width: 50px; height: 50px; border-radius: 50%; border: 1px solid var(--sw-border); color: #1fb457; transition: background-color .25s, color .25s, border-color .25s; }
.sw-wdoc .sw-fdoc__icon .sw-icon { width: 20px; height: 20px; }
.sw-wdoc .sw-fdoc__icon:hover { background: #25D366; border-color: #25D366; color: #fff; }
.sw-wdocs--2 { grid-template-columns: 1fr; }
.sw-wdocs--2 .sw-wdoc { grid-template-columns: minmax(0, .62fr) minmax(0, 1.38fr); }
.sw-wdocs--2 .sw-wdoc__media { min-height: 360px; }
.sw-wdocs--2 .sw-wdoc__hl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
@media (max-width: 1023px) { .sw-wdocs--2 .sw-wdoc { grid-template-columns: 1fr; } .sw-wdocs--2 .sw-wdoc__media { min-height: 300px; } }
@media (max-width: 620px) { .sw-wdocs--2 .sw-wdoc__hl { grid-template-columns: 1fr; } }

/* ---------- When to see a specialist + What to expect ---------- */
.sw-sx { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.sw-sx > div { padding: clamp(24px, 3vw, 36px); border-radius: var(--sw-radius); }
.sw-sx__signs { background: var(--sw-light); }
.sw-sx__expect { color: rgba(255, 255, 255, .75); background: radial-gradient(60% 80% at 100% 0%, color-mix(in srgb, var(--sw-primary) 40%, transparent) 0%, transparent 70%), linear-gradient(135deg, #0A2233 0%, var(--sw-overlay) 100%); }
.sw-sx__icon { display: grid; place-items: center; width: 46px; height: 46px; margin-bottom: 16px; border-radius: 14px; background: var(--sw-white); color: color-mix(in srgb, var(--sw-primary) 75%, var(--sw-dark)); }
.sw-sx__icon .sw-icon { width: 22px; height: 22px; }
.sw-sx__title { margin: 0 0 8px; font-size: clamp(1.4rem, 1.05rem + .9vw, 1.85rem); letter-spacing: -0.03em; }
.sw-sx__expect .sw-sx__title { color: #fff; margin-bottom: 20px; }
.sw-sx__lead { margin: 0 0 14px; color: var(--sw-muted); }
.sw-sx__list { display: grid; gap: 10px; margin: 0 0 18px; padding: 0; list-style: none; }
.sw-sx__list li { display: flex; gap: 10px; font-size: .95rem; line-height: 1.45; }
.sw-sx__list .sw-icon { flex: none; width: 20px; height: 20px; padding: 3px; border-radius: 50%; background: var(--sw-primary); color: #fff; stroke-width: 3; }
.sw-sx__urgent { display: flex; gap: 10px; margin: 0; padding: 12px 14px; border-radius: 12px; background: #FFF4F2; color: #9A3B2C; font-size: .85rem; line-height: 1.45; }
.sw-sx__urgent .sw-icon { flex: none; width: 17px; height: 17px; margin-top: 1px; }
.sw-sx__steps { display: grid; gap: 0; margin: 0; padding: 0; list-style: none; }
.sw-sx__steps li { position: relative; display: grid; grid-template-columns: 40px 1fr; gap: 14px; padding-bottom: 22px; }
.sw-sx__steps li:not(:last-child)::after { content: ""; position: absolute; left: 19px; top: 42px; bottom: 4px; width: 1px; background: rgba(255, 255, 255, .2); }
.sw-sx__steps li > span { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 50%; background: var(--sw-primary); color: #fff; font-weight: 600; }
.sw-sx__steps h3 { margin: 6px 0 4px; color: #fff; font-size: 1.08rem; }
.sw-sx__steps p { margin: 0; font-size: .92rem; line-height: 1.55; }
@media (max-width: 860px) { .sw-sx { grid-template-columns: 1fr; } }

/* Full photos (JPG with background) fill the frame */
.sw-wdoc__img.is-full { left: 0; top: 0; bottom: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 18%; transform: none; }
.sw-wdoc:hover .sw-wdoc__img.is-full { transform: scale(1.03); }