/* Visual theme inspired by Sajib Ahmed's personal doctor landing page.
   Shared by every page; original content and routes stay in their HTML files. */
:root { --ink:#142b45; --ink-soft:#52657b; --sea:#3468c9; --paper:#f7f9fd; --line:#dce3ef; --radius:1.5rem; }
body { background:#f7f9fd; }
.mobile-telegram[hidden] { display:none; }
.site-header { max-width:1360px; min-height:92px; padding:1.2rem 4vw; position:relative; z-index:30; }
.brand { font-size:1rem; gap:.7rem; }
.brand img { width:3rem; height:3rem; }
.site-nav { gap:clamp(.65rem,1.3vw,1.4rem); }
.site-nav a { font-size:.875rem; font-weight:600; position:relative; padding:.5rem 0; }
.site-nav a::after { content:''; position:absolute; left:0; bottom:0; width:100%; height:2px; background:var(--sea); transform:scaleX(0); transform-origin:left; transition:transform .25s; }
.site-nav a:hover::after,.site-nav a[aria-current=page]::after { transform:scaleX(1); }
.section { max-width:1280px; padding:6rem 5vw; }
h1,h2 { letter-spacing:-.045em; font-weight:750; line-height:1.12; text-wrap:balance; }
h1 { font-size:clamp(2.6rem,4.7vw,4.8rem); }
h2 { font-size:clamp(2rem,3.3vw,3rem); }
.eyebrow { font-size:.875rem; letter-spacing:.09em; }
.hero { max-width:1360px; margin:0 auto 2rem; min-height:650px; grid-template-columns:1.15fr .85fr; gap:4rem; padding:4.5rem 5vw 5rem; background:#fff; border-radius:2rem; position:relative; overflow:hidden; box-shadow:0 20px 80px #17315b09; }
.hero::before { content:''; position:absolute; inset:0 0 0 56%; background:linear-gradient(140deg,#eaf1ff,#a8c4ff); clip-path:polygon(48% 0,100% 0,100% 100%,0 100%,0 48%); pointer-events:none; }
.hero-copy,.hero-photo { position:relative; z-index:1; }
.hero h1 { max-width:760px; }
.hero-lead { color:var(--sea); font-size:1.3rem; }
.hero-text { line-height:1.75; max-width:650px; }
.hero-photo { min-height:470px; border-radius:48% 48% 1.5rem 1.5rem; background:linear-gradient(150deg,#e9f0ff,#adc4ed); border:1px solid #ffffffb0; box-shadow:0 24px 60px #23487820; }
.hero-photo span { font-size:1rem; font-weight:500; color:#476389; }
.portrait { width:100%; height:520px; object-fit:cover; object-position:center 35%; display:block; }
.doctor-work-photo { display:block; width:100%; max-width:540px; height:auto; border-radius:1.5rem; margin-top:2rem; box-shadow:0 20px 50px #17315b14; }
.honeypot { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.button:disabled { opacity:.6; cursor:wait; transform:none; }
.form-status[data-state="error"] { color:#a33137; }
.analytics-consent { position:fixed; z-index:50; left:1rem; right:1rem; bottom:1rem; max-width:980px; margin:auto; display:flex; align-items:center; justify-content:space-between; gap:1.5rem; padding:1rem 1.2rem; border:1px solid #cfdaeb; border-radius:1rem; background:#fff; color:var(--ink); box-shadow:0 12px 38px #122b4a2b; font-size:.9rem; }
.analytics-consent[hidden] { display:none; }
.analytics-consent p { margin:0; }
.analytics-consent a { color:#2454ab; }
.analytics-consent-actions { display:flex; flex-shrink:0; gap:.65rem; }
.analytics-consent-actions button,.analytics-settings { border:1px solid #c6d2e4; border-radius:.65rem; background:#fff; color:var(--ink); padding:.65rem .85rem; font:inherit; cursor:pointer; }
.analytics-consent-actions button[data-analytics-choice="accept"] { border-color:#3468c9; background:#3468c9; color:#fff; }
.analytics-settings { position:fixed; z-index:40; left:1rem; bottom:1rem; font-size:.75rem; box-shadow:0 4px 16px #122b4a22; }
.analytics-consent:not([hidden]) ~ .analytics-settings { display:none; }
@media (max-width:760px) { .analytics-consent { flex-direction:column; align-items:stretch; gap:.8rem; left:.7rem; right:.7rem; bottom:.7rem; padding:.9rem; font-size:.85rem; }.analytics-consent-actions { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }.analytics-consent-actions button { padding:.7rem .4rem; font-size:.8rem; }.analytics-settings { left:.7rem; bottom:.7rem; } }
.button { border-radius:.85rem; font-weight:650; padding:.85rem 1.5rem; transition:transform .25s,box-shadow .25s,background .25s; }
.button-primary { background:var(--sea); box-shadow:0 8px 24px #3468c925; }
.button-primary:hover { background:#2454ab; box-shadow:0 12px 30px #3468c940; transform:translateY(-3px); }
.button-light:hover { transform:translateY(-3px); box-shadow:0 10px 24px #0002; }
.intro { max-width:1060px; text-align:center; border:0; padding-top:4rem; }
.intro h2,.intro p:last-child { margin-left:auto; margin-right:auto; }
.intro p:last-child { line-height:1.8; }
.service-grid { max-width:none; background:#edf2fb; padding-left:max(5vw,calc((100vw - 1280px)/2 + 5vw)); padding-right:max(5vw,calc((100vw - 1280px)/2 + 5vw)); }
.service-card { padding:2.5rem; border:0; box-shadow:0 16px 50px #1a3a6610; transition:transform .3s,box-shadow .3s; }
.service-card:hover { transform:translateY(-5px); box-shadow:0 24px 55px #1a3a6618; }
.service-card p,.service-card li { line-height:1.85; }
.service-card li { padding:.3rem 0; }
.service-card li::marker { color:var(--sea); }
.two-column { gap:6vw; align-items:start; }
.two-column > div:last-child p { line-height:1.85; }
.credentials { background:white; padding:.5rem 1.5rem; border-radius:1rem; box-shadow:0 12px 35px #213b5c09; }
.credentials div:first-child { border:0; }
.dark-section { max-width:none; background:linear-gradient(125deg,#173756,#10263e); position:relative; overflow:hidden; padding-left:max(5vw,calc((100vw - 1280px)/2 + 5vw)); padding-right:max(5vw,calc((100vw - 1280px)/2 + 5vw)); }
.dark-section::after { content:''; position:absolute; width:440px; height:440px; border:1px solid #ffffff18; border-radius:50%; right:-80px; top:60px; pointer-events:none; box-shadow:0 0 0 70px #ffffff04,0 0 0 140px #ffffff03; }
.dark-section>* { position:relative; z-index:1; }
.dark-section .eyebrow { color:#a9caff; }
.dark-section>p:not(.eyebrow) { max-width:820px; color:#dbe6f5; line-height:1.85; }
.page-hero { max-width:1280px; padding-top:5rem; padding-bottom:4.5rem; background:linear-gradient(120deg,#fff,#edf3ff); border:0; border-radius:1.5rem; margin-bottom:1rem; }
.page-hero .hero-text { max-width:800px; }
.contact-section { background:#edf2fb; }
.request-form { background:#fff; padding:2rem; border-radius:1.5rem; box-shadow:0 20px 55px #1a3a6610; }
.request-form input,.request-form select,.request-form textarea { border-color:#cfdaeb; border-radius:.7rem; }
.request-form :is(input,select,textarea):focus { outline:3px solid #3468c923; border-color:var(--sea); }
.request-form label { font-size:1rem; }
.request-form .consent { font-size:.875rem; }
.article-grid article { border:0; padding:2rem; box-shadow:0 12px 35px #213b5c0a; transition:transform .3s; }
.article-grid article:hover { transform:translateY(-6px); }
.article-grid article:nth-child(2) { background:#eaf1ff; }
.article-grid article:nth-child(3) { background:#e5eff0; }
.article-grid h2 { font-size:1.55rem; }
.article-grid article { display:flex; flex-direction:column; align-items:flex-start; border-radius:var(--radius); background:#fff; }
.article-grid article:nth-child(2) { background:#eaf1ff; }
.article-grid article p:not(.eyebrow) { color:var(--ink-soft); line-height:1.75; }
.article-grid article .text-link { margin-top:auto; padding-top:1.25rem; }
.article-intro { min-height:0; }
.article-intro .hero-text + .hero-text { margin-top:1rem; }
.article-section { padding-top:2rem; }
.article-body { max-width:880px; margin:0 auto; color:var(--ink); }
.article-body h2 { margin:3.25rem 0 1.15rem; font-size:clamp(1.75rem,3vw,2.35rem); }
.article-body h2:first-child { margin-top:0; }
.article-body h3 { margin:2.2rem 0 .85rem; font-size:clamp(1.25rem,2.2vw,1.65rem); line-height:1.25; }
.article-body p,.article-body li { color:var(--ink-soft); font-size:1.04rem; line-height:1.85; }
.article-body p { margin:.9rem 0; }
.article-body li { padding:.2rem 0 .2rem .2rem; }
.article-body ul,.article-body ol { padding-left:1.5rem; }
.article-body li::marker { color:var(--sea); font-weight:700; }
.article-body strong { color:var(--ink); }
.article-figure { margin:1.8rem 0 2rem; }
.article-figure img { display:block; width:100%; height:auto; max-height:680px; object-fit:contain; border:1px solid var(--line); border-radius:1rem; background:#fff; }
.article-figure figcaption { margin:.65rem .15rem 0; color:var(--ink-soft); font-size:.88rem; line-height:1.55; }
.article-figure-grid { display:grid; grid-template-columns:1fr 1fr; gap:1.25rem; align-items:start; }
.article-figure-grid .article-figure { min-width:0; }
.article-table-wrap { max-width:100%; margin:1.5rem 0; overflow-x:auto; border:1px solid var(--line); border-radius:.9rem; background:#fff; }
.article-table { width:100%; border-collapse:collapse; min-width:520px; }
.article-table th,.article-table td { padding:1rem 1.1rem; border-bottom:1px solid var(--line); text-align:left; vertical-align:top; line-height:1.6; }
.article-table th { color:var(--ink); background:#eaf1ff; font-weight:750; }
.article-table td { color:var(--ink-soft); }
.article-table tr:last-child td { border-bottom:0; }
.article-callout { margin:1.5rem 0; padding:1rem 1.4rem; border-left:4px solid var(--sea); border-radius:.5rem 1rem 1rem .5rem; background:#eaf4f1; }
.article-callout p { margin:.25rem 0; }
.article-body .placeholder-note { margin-top:2.5rem; padding-left:1rem; border-left:3px solid #9fc4bc; font-size:.9rem; }
.article-body .text-link { margin-top:1.5rem; }
.site-footer { max-width:1280px; padding:2.5rem 5vw; border-top:1px solid var(--line); }
.microcopy,.placeholder-note { font-size:.875rem; }
a:focus-visible,button:focus-visible { outline:3px solid #3468c980; outline-offset:5px; }
.reveal { opacity:0; transform:translateY(24px); transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1); }
.reveal.is-visible { opacity:1; transform:none; }
.hero-copy,.page-hero { animation:enter .75s both; }
.hero-photo { animation:enter .9s .12s both; }
@keyframes enter { from { opacity:0; transform:translateY(22px); } to { opacity:1; transform:none; } }
@media (max-width:1100px) { .site-header { flex-wrap:wrap; }.site-nav { flex-wrap:wrap; }.hero { gap:2rem; }.site-nav a { font-size:.85rem; } }
@media (max-width:900px) { .site-header { min-height:76px; position:sticky; top:0; background:#f7f9fdf5; backdrop-filter:blur(16px); }.menu-toggle { display:block; margin-left:auto; padding:.6rem .9rem; border:1px solid var(--line); border-radius:.65rem; background:#fff; font:inherit; color:var(--ink); }.site-nav { display:none; width:100%; margin:0; order:3; flex-direction:column; padding:1rem 0; gap:.4rem; }.site-nav.is-open { display:flex; animation:enter .25s both; }.site-nav a { font-size:1rem; padding:.55rem 0; }.hero { margin:0 1rem 1rem; grid-template-columns:1fr; padding:3rem 6vw; }.hero::before { inset:58% 0 0 20%; }.hero-photo { min-height:360px; max-width:520px; width:100%; margin:auto; }.hero h1 { font-size:clamp(2.4rem,7vw,3.7rem); }.section { padding:4rem 6vw; }.page-hero { margin:0 1rem; }.two-column,.contact-section { grid-template-columns:1fr; gap:2rem; }.article-grid { grid-template-columns:1fr; }.service-card { padding:1.6rem; }.request-form { padding:1.5rem; } }
@media (max-width:760px) { .hero { padding-top:2.5rem; }.hero-photo { min-height:330px; }.portrait { height:420px; }.brand img { width:2.5rem; height:2.5rem; }.brand { font-size:.95rem; }.mobile-telegram { border-radius:.85rem; background:#3468c9; }.site-footer { padding-bottom:2rem; }.hero-lead { font-size:1.15rem; } }
@media (max-width:760px) { .article-section { padding-top:2.5rem; }.article-body p,.article-body li { font-size:1rem; line-height:1.75; }.article-figure-grid { grid-template-columns:1fr; gap:.25rem; }.article-figure { margin:1.35rem 0 1.6rem; }.article-table th,.article-table td { padding:.8rem; font-size:.93rem; } }
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; }*,*::before,*::after { animation:none!important; transition:none!important; }.reveal { opacity:1; transform:none; } }
.career-timeline { margin-top: 2rem; border-left: 2px solid #c9d9ee; padding-left: clamp(1rem, 4vw, 2.5rem); }
.career-item { padding: 1rem 0 2rem; max-width: 850px; }
.career-item h3, .qualification-card h3 { font-size: clamp(1.15rem, 2vw, 1.5rem); line-height: 1.35; overflow-wrap: anywhere; }
.qualification-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem; margin-top: 2rem; }
.qualification-card { background: white; border-radius: 1.5rem; padding: clamp(1.25rem, 3vw, 2rem); }
@media (max-width: 650px) { .qualification-grid { grid-template-columns: 1fr; } }
