/* Approved concept 10: full dark glass cards with integrated, fading medical illustrations. */
body{font-family:'Cairo',sans-serif;background:radial-gradient(ellipse at 85% 20%,#12305b77,transparent 52%),radial-gradient(ellipse at 12% 85%,#113b4b55,transparent 50%),#070d18;color:#fff;padding:28px 0}
body>.bg-shape{display:none!important}
body>.container{max-width:1240px;padding:24px!important;min-height:0!important;margin-inline:auto!important}
.header-title{margin:0 0 30px!important;animation:none}
.header-title h1{font-size:clamp(25px,3vw,38px);line-height:1.5;letter-spacing:0;text-shadow:none;-webkit-text-fill-color:#f0f7ff;background:none;color:#f0f7ff}
.header-title p{font-size:13px;line-height:1.8;color:#91a7c0}
.cards-wrapper.clinic-gateway1102{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:18px!important;max-width:980px;width:100%}
.clinic-gateway1102 .gateway-card{position:relative;isolation:isolate;overflow:hidden;border:1px solid #c6ddff30;border-radius:30px;background:radial-gradient(ellipse at 100% 0%,#41648b66,transparent 90%),#0b1321;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);height:330px;min-height:0!important;padding:0!important;margin:0!important;text-decoration:none;color:#fff;display:block;box-shadow:inset 0 1px 0 #ffffff15,0 12px 40px -12px #163e7588,0 0 28px #8bbfff08;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.clinic-gateway1102 .gateway-card:hover{transform:translateY(-4px);border-color:#c6e1ff55;box-shadow:0 12px 48px -8px #4f91d94d,0 0 58px #79afff1a,inset 0 1px 0 #ffffff20}
.clinic-gateway1102 .gateway-card:focus-visible{outline:3px solid #8dccff;outline-offset:5px}
.clinic-gateway1102 .gateway-art{position:absolute;top:-3px;left:-22px;right:-22px;width:calc(100% + 44px);height:260px;pointer-events:none;z-index:-1;mask-image:linear-gradient(to bottom,#000 46%,#0008 70%,transparent 96%);-webkit-mask-image:linear-gradient(to bottom,#000 46%,#0008 70%,transparent 96%)}
.gateway-art svg{width:100%;height:100%;display:block;filter:saturate(1.25)}
.clinic-gateway1102 .card-content{position:absolute;bottom:23px;left:12px;right:12px;width:auto;flex:none;text-align:center}
.clinic-gateway1102 .card-title{font-family:'Cairo',sans-serif;font-size:21px!important;line-height:1.6;margin:0!important;font-weight:700;color:#fff;text-shadow:0 2px 12px #000a}
.gateway-staff-desktop{display:inline}.gateway-staff-mobile{display:none}
.clinic-gateway1102 .card-staff .card-content{bottom:23px}
.clinic-gateway1102 .gateway-card::before{content:''!important;position:absolute;inset:0;pointer-events:none;z-index:0;border-radius:inherit;background:radial-gradient(ellipse 38% 45% at var(--glass-x,50%) var(--glass-y,30%),#d0efff20 0%,#9edbff0b 38%,transparent 72%),radial-gradient(ellipse 48% 58% at calc(100% - var(--glass-x,50%)) calc(100% - var(--glass-y,30%)),#53d7f70b,transparent 72%);filter:blur(7px);opacity:0;transform:none;transition:opacity .2s ease}
.clinic-gateway1102 .card-content{z-index:1}
.clinic-gateway1102 .gateway-card:is(:hover,:active,:focus-visible,.gateway-glass-active)::before{opacity:1}
.clinic-gateway1102 .gateway-card::after{content:'';position:absolute;inset:0;border-radius:inherit;padding:1px;pointer-events:none;z-index:0;background:radial-gradient(ellipse 58% 64% at var(--glass-x,50%) var(--glass-y,30%),#d0efffa8 0%,#7ddcff45 35%,transparent 76%);opacity:0;filter:none;-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;transition:opacity .2s ease}
.clinic-gateway1102 .gateway-card:is(:hover,:active,:focus-visible,.gateway-glass-active)::after{opacity:.82}
.index-footer{margin-top:24px!important;color:#8096b0;font-size:11px!important;line-height:1.8}
@media(min-width:768px) and (max-width:1179px){.cards-wrapper.clinic-gateway1102{grid-template-columns:repeat(2,minmax(0,1fr))!important;max-width:820px}.clinic-gateway1102 .gateway-card{height:290px}.clinic-gateway1102 .gateway-art{height:255px}}
@media(max-width:767px){
 body{padding-top:max(16px,env(safe-area-inset-top,0px))!important;align-items:flex-start}
 body>.container{padding:18px 16px!important;justify-content:flex-start!important;min-height:0!important;max-width:500px}
 .header-title{margin:8px 0 25px!important;text-align:center}
 .header-title h1{font-size:clamp(21px,5.7vw,27px)!important;margin-bottom:6px}
 .header-title p{font-size:11px!important;line-height:1.8!important}
 .cards-wrapper.clinic-gateway1102{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:13px!important}
 .clinic-gateway1102 .gateway-card{height:214px;border-radius:30px}
 .clinic-gateway1102 .gateway-art{top:-13px;height:205px}
 .clinic-gateway1102 .card-content{bottom:18px;left:6px;right:6px}
 .clinic-gateway1102 .card-title{font-size:clamp(14px,4.3vw,19px)!important;line-height:1.6}
 .clinic-gateway1102 .card-staff,.clinic-gateway1102 .card-website{grid-column:1/-1;height:177px}
 .clinic-gateway1102 .card-staff .gateway-art,.clinic-gateway1102 .card-website .gateway-art{inset:-28px -35px -20px auto;width:75%;height:240px;mask-image:linear-gradient(to left,#000 28%,#000b 55%,transparent 87%);-webkit-mask-image:linear-gradient(to left,#000 28%,#000b 55%,transparent 87%)}
 .clinic-gateway1102 .card-staff .card-content,.clinic-gateway1102 .card-website .card-content{inset:0 auto 0 18px;width:46%;display:flex;align-items:center;justify-content:flex-start;text-align:right}
 .gateway-staff-desktop{display:none}.gateway-staff-mobile{display:block}.gateway-staff-first,.gateway-staff-second{display:block;white-space:nowrap}
 .clinic-gateway1102 .card-staff .card-title{width:100%;font-size:24px!important;line-height:1.65}
 .clinic-gateway1102 .card-website{height:135px}
 .clinic-gateway1102 .card-website .gateway-art{width:62%;height:197px;top:-30px;right:-8px}
 .clinic-gateway1102 .card-website .card-content{width:max(59%,184px);left:4px}
 .clinic-gateway1102 .card-website .card-title{font-size:22px!important;white-space:nowrap}
 .index-footer{font-size:10px!important;line-height:1.7;padding:10px 0!important;margin-top:20px!important}
}
@media(prefers-reduced-motion:reduce){.clinic-gateway1102 .gateway-card{transition:none}.clinic-gateway1102 .gateway-card:hover{transform:none}.clinic-gateway1102 .gateway-card:is(:hover,:active,:focus-visible,.gateway-glass-active)::after{transition:none;opacity:.45}}

@media(prefers-reduced-motion:reduce){.clinic-gateway1102 .gateway-card:is(:hover,:active,:focus-visible,.gateway-glass-active)::before{transition:none;opacity:.55}}

/* Keep the doctor's face fully lit. Fade the shoulders and the edge toward the label. */
@media(min-width:768px){.clinic-gateway1102 .card-staff .gateway-art{mask-image:linear-gradient(to bottom,#000 63%,#0008 82%,transparent 100%);-webkit-mask-image:linear-gradient(to bottom,#000 63%,#0008 82%,transparent 100%)}}
@media(max-width:767px){.clinic-gateway1102 .card-staff .gateway-art{mask-image:linear-gradient(to left,#000 67%,#000b 80%,transparent 97%),linear-gradient(to bottom,#000 70%,#0008 86%,transparent 100%);-webkit-mask-image:linear-gradient(to left,#000 67%,#000b 80%,transparent 97%),linear-gradient(to bottom,#000 70%,#0008 86%,transparent 100%);mask-composite:intersect;-webkit-mask-composite:source-in}}

/* A restrained moving specular edge, clipped to the border: never over the artwork. */
@property --clinic-rim-angle {syntax:'<angle>';initial-value:0deg;inherits:false}
@keyframes clinicRimOrbit1102 {to{--clinic-rim-angle:360deg}}
.clinic-gateway1102 .gateway-card::after{background:conic-gradient(from var(--clinic-rim-angle),transparent 0deg,transparent 224deg,#ffffff18 250deg,#ffffffb8 275deg,#ffffff18 300deg,transparent 326deg),radial-gradient(ellipse 58% 64% at var(--glass-x,50%) var(--glass-y,30%),#d0efff55,transparent 76%)}
.clinic-gateway1102 .gateway-card:is(:hover,:active,:focus-visible,.gateway-glass-active)::after{animation:clinicRimOrbit1102 2.8s linear infinite;opacity:.92}
@media(prefers-reduced-motion:reduce){.clinic-gateway1102 .gateway-card:is(:hover,:active,:focus-visible,.gateway-glass-active)::after{animation:none;opacity:.6}}