﻿/* Contact page */
.contact-page{background:linear-gradient(#f2fdfc,#fff 520px);padding-bottom:50px}
.c-wrap{width:94%;max-width:1760px;margin:auto}@media(min-width:1060px){.c-wrap{width:92%}}
.c-hero{position:relative;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:20px;padding:26px 0 40px}
.c-hero:before{content:'';position:absolute;z-index:0;right:-4%;top:-60px;width:62%;height:120%;border-radius:50%;background:radial-gradient(closest-side,#d6f7f4,#ecfdfc 70%,transparent);pointer-events:none}
.c-hero>*{position:relative;z-index:1}
.crumbs{display:flex;gap:10px;color:#46607f;font-size:14px;align-items:center}
.crumbs span{color:#8aa0b5}
.crumbs-rule{width:48px;height:2px;background:#0796aa;margin:6px 0 18px}
.c-hero h1{font-size:clamp(40px,5.2vw,68px);letter-spacing:-1.6px;margin:0 0 14px;color:#0b2a5b}
.c-hero h1 em{color:#04949f}
.c-lead{font-size:clamp(18px,1.6vw,22px);color:#0b2a5b;margin-bottom:12px}
.c-sub{max-width:480px;font-size:clamp(16px,1.05vw,19px);line-height:1.6;color:#587089}
.c-quick{display:flex;flex-wrap:wrap;gap:24px 34px;margin-top:28px}
.c-quick a{display:flex;align-items:center;gap:12px;color:#0b2a5b;font-size:15px;line-height:1.3;transition:transform .2s}
.c-quick a:hover{transform:translateY(-2px)}
.c-quick .ico{width:46px;height:46px;border-radius:50%;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,#17c3bb,#04949f);box-shadow:0 6px 14px #04949f40}
.c-quick svg{width:22px;height:22px;fill:currentColor}
.c-quick b{font-weight:600;display:block}
.c-art{width:100%;max-width:clamp(520px,34vw,680px);justify-self:end}
.c-art svg{width:100%;height:auto;display:block;overflow:visible}
.c-float{animation:c-float 6s ease-in-out infinite}.c-float.d2{animation-delay:-2s}.c-float.d3{animation-delay:-4s}
@keyframes c-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
.c-main{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(300px,1fr);gap:26px;align-items:start}
.c-panel{background:#fff;border:1px solid #d9f2f1;border-radius:22px;box-shadow:0 14px 40px #0b6f7a14;padding:26px}
.c-panel h2{font-size:clamp(26px,2.4vw,34px);margin:0;letter-spacing:-.8px;color:#0b2a5b}
.c-panel h2 em{color:#04949f}
.c-title-rule{width:42px;height:2px;background:#0796aa;margin:8px 0 0}
.clinics-head{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:20px}
.clinics-nav{display:flex;align-items:center;gap:12px;color:#5b7288;font-size:14px;white-space:nowrap}
.clinics-nav button{width:38px;height:38px;border-radius:50%;border:1px solid #cdeeee;background:#fff;color:#04949f;font-size:20px;line-height:1;cursor:pointer;transition:background .2s,color .2s}
.clinics-nav button:hover{background:#04949f;color:#fff}
.clinic-track{display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 36px)/3);gap:18px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:none;padding:4px 2px 10px}
.clinic-track::-webkit-scrollbar{display:none}
.clinic-card{scroll-snap-align:start;background:linear-gradient(#fff,#f4fcfc);border:1px solid #d9f2f1;border-radius:18px;padding:18px;display:flex;flex-direction:column;transition:transform .25s,box-shadow .25s}
.clinic-card:hover{transform:translateY(-4px);box-shadow:0 14px 28px #04949f22}
.clinic-card h3{margin:0 0 12px;font-size:15px;letter-spacing:.3px;color:#0b2a5b}
.clinic-thumb{height:94px;border-radius:12px;margin-bottom:14px;display:grid;place-items:center;background:linear-gradient(135deg,#d4f6f2,#a9e8e3 55%,#7fd8d3);overflow:hidden;position:relative}
.clinic-thumb:before{content:'';position:absolute;inset:auto -10% -45% -10%;height:80%;border-radius:50%;background:#ffffff55}
.clinic-thumb svg{position:relative;width:62px;height:62px}
.clinic-card ul{list-style:none;margin:0 0 16px;padding:0;display:grid;gap:9px;font-size:14px;color:#2f4a68;line-height:1.4}
.clinic-card li{display:flex;gap:10px;align-items:flex-start}
.clinic-card li svg{flex:0 0 18px;width:18px;height:18px;margin-top:1px;fill:none;stroke:#04949f;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.dir-btn{margin-top:auto;align-self:flex-start;display:inline-flex;gap:8px;align-items:center;padding:10px 16px;border-radius:999px;background:#d8f6f3;color:#0a6f7a;font-weight:600;font-size:14px;transition:background .2s,color .2s}
.dir-btn:hover{background:#04949f;color:#fff}
.clinics-note{margin-top:8px;font-size:13px;color:#6b8196}
.c-form h2{font-size:clamp(24px,2vw,30px)}
.c-form p.hint{margin:8px 0 18px;font-size:14px;color:#6b8196}
.c-form form{display:grid;gap:12px}
.field{position:relative}
.field svg{position:absolute;left:14px;top:15px;width:18px;height:18px;fill:#04949f;pointer-events:none}
.field input,.field textarea{width:100%;border:1px solid #d6ecec;border-radius:10px;background:#fbfefe;padding:13px 14px 13px 44px;font:15px Arial,sans-serif;color:#0b2a5b;outline:none;transition:border-color .2s,box-shadow .2s}
.field textarea{min-height:108px;resize:vertical}
.field input:focus,.field textarea:focus{border-color:#04949f;box-shadow:0 0 0 3px #04949f22}
.send-btn{display:flex;align-items:center;justify-content:center;gap:10px;border:0;border-radius:10px;padding:14px;background:linear-gradient(90deg,#049098,#1ec6bd);color:#fff;font:700 16px Arial,sans-serif;cursor:pointer;box-shadow:0 10px 20px #04949f33;transition:transform .2s,box-shadow .2s}
.send-btn:hover{transform:translateY(-2px);box-shadow:0 14px 24px #04949f44}
.send-btn svg{width:18px;height:18px;fill:#fff}
#sent{display:none;margin:2px 0 0;color:#168353;font-size:14px;font-weight:700}
.c-bottom{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(300px,1fr);gap:26px;margin-top:26px}
.c-banner{position:relative;overflow:hidden;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);align-items:center;gap:20px;padding:26px 36px;border-radius:22px;background:linear-gradient(100deg,#d9f7f4,#eefdfc 70%);border:1px solid #d9f2f1}
.c-banner svg{width:100%;height:auto;max-height:190px}
.c-banner h2{font-size:clamp(26px,2.4vw,34px);line-height:1.15;color:#0b2a5b}
.c-banner h2 em{display:block}
.c-banner p{margin-top:14px;font-size:15px;line-height:1.6;color:#587089;max-width:460px}
.c-trust{display:grid;grid-template-columns:repeat(3,1fr);align-items:center;padding:22px 8px;border-radius:22px;background:linear-gradient(135deg,#dff8f5,#eefdfc);border:1px solid #d9f2f1;text-align:center}
.c-trust div{padding:6px 10px;color:#0b2a5b;font-size:14px;line-height:1.35}
.c-trust div+div{border-left:1px solid #bfe9e6}
.c-trust .ti{width:54px;height:54px;margin:0 auto 8px;border-radius:50%;background:#fff;display:grid;place-items:center;box-shadow:0 6px 14px #04949f22}
.c-trust svg{width:28px;height:28px;fill:none;stroke:#04949f;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
@media(max-width:1180px){.clinic-track{grid-auto-columns:calc((100% - 18px)/2)}}
@media(max-width:980px){.c-hero{grid-template-columns:minmax(0,1fr)}.c-art{justify-self:center;max-width:460px}.c-main,.c-bottom{grid-template-columns:minmax(0,1fr)}}
@media(max-width:640px){.c-hero{padding-top:18px}.c-panel{padding:20px 16px}.clinic-track{grid-auto-columns:88%}.clinics-head{flex-direction:column}.clinics-nav span{display:none}.c-banner{grid-template-columns:1fr;padding:22px 20px}.c-banner svg{max-height:150px}.c-trust{grid-template-columns:1fr;gap:10px}.c-trust div+div{border-left:0;border-top:1px solid #bfe9e6;padding-top:14px}.c-quick{gap:16px 22px}}

.c-main>*,.c-bottom>*,.c-hero>*{min-width:0}
.crumbs{display:flex!important;justify-content:flex-start!important;gap:10px!important}
.crumbs a:hover{color:#04949f}

.contact-page{overflow-x:clip}

@media(min-width:1500px){.c-hero{padding:40px 0 56px}.c-main,.c-bottom{grid-template-columns:minmax(0,2fr) minmax(360px,1fr)}.clinic-thumb{height:120px}.clinic-card ul{font-size:15px}.c-quick .ico{width:52px;height:52px}}


/* Hospital photo banner */
.c-banner{grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);padding:0;gap:0;align-items:stretch;min-height:200px}
.c-banner-img{width:100%;height:100%;min-height:200px;object-fit:cover;object-position:35% 50%;display:block;-webkit-mask-image:linear-gradient(to right,#000 78%,transparent);mask-image:linear-gradient(to right,#000 78%,transparent)}
.c-banner-copy{align-self:center;padding:24px 34px 24px 10px}
@media(max-width:640px){.c-banner{grid-template-columns:1fr}.c-banner-img{height:190px;-webkit-mask-image:linear-gradient(#000 75%,transparent);mask-image:linear-gradient(#000 75%,transparent)}.c-banner-copy{padding:6px 20px 24px}}

/* Full-bleed hero picture */
.c-hero{display:block;min-height:clamp(380px,31vw,600px);padding:clamp(30px,3.4vw,70px) 0}
.c-hero:before{content:'';position:absolute;z-index:0;top:0;bottom:0;left:50%;right:auto;width:100vw;height:auto;border-radius:0;transform:translateX(-50%);background:url(assets/contact-hero.png) 62% center/cover no-repeat}
.c-hero>div{max-width:min(640px,52%)}
@media(max-width:980px){.c-hero{min-height:0;padding:22px 0 calc(58vw + 10px)}.c-hero>div{max-width:none}.c-hero:before{top:auto;height:62vw;background-position:68% center;-webkit-mask-image:linear-gradient(transparent,#000 22%);mask-image:linear-gradient(transparent,#000 22%)}}

@media(min-width:981px){.c-hero{min-height:clamp(360px,25vw,520px)}.c-hero:before{background-size:auto 100%;background-position:right center;-webkit-mask-image:linear-gradient(to right,transparent,#000 18%);mask-image:linear-gradient(to right,transparent,#000 18%)}.c-hero>div{max-width:min(600px,44%)}}

@media(min-width:981px){.c-hero{min-height:clamp(360px,23vw,480px);padding:clamp(28px,2.6vw,52px) 0}.c-hero:before{background-size:70vw auto;background-position:right center;-webkit-mask-image:linear-gradient(to right,transparent,#000 20%),linear-gradient(transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(to right,transparent,#000 20%),linear-gradient(transparent,#000 14%,#000 86%,transparent);-webkit-mask-composite:source-in;mask-composite:intersect}.c-hero>div{max-width:min(600px,44%)}}

/* Match the AI reference: compact hero, panels overlapping it, clinic photos */
.clinic-photo{display:block;width:100%;aspect-ratio:2.8/1;object-fit:cover;border-radius:10px;margin-bottom:14px}
.clinic-card{padding:16px;background:#fff}
.clinic-card h3{font-size:15px;letter-spacing:.2px}
.clinic-card li svg{width:20px;height:20px}
.clinic-card li{font-size:14.5px}
.dir-btn{background:#e0f7f5}
@media(min-width:981px){.c-hero{min-height:clamp(300px,19.5vw,400px);padding-top:clamp(20px,1.8vw,36px);padding-bottom:0}.c-main{position:relative;z-index:2;margin-top:clamp(-70px,-3.6vw,-28px)}.c-hero h1{font-size:clamp(44px,4.6vw,76px)}}
.c-panel{border-radius:20px}
.c-bottom{margin-top:18px;gap:22px}
@media(min-width:981px){.c-hero{min-height:clamp(370px,24.4vw,500px);padding-bottom:clamp(40px,3.6vw,64px)}.c-main{margin-top:clamp(-64px,-3.2vw,-30px)}}

@media(min-width:981px){.c-hero:before{-webkit-mask-image:none!important;mask-image:none!important}}


.c-banner-img{-webkit-mask-image:none!important;mask-image:none!important;object-position:left center}
@media(max-width:640px){.c-banner-img{object-position:center}}

