/* =============================================================
   Vertamed — əsas üslub faylı
   Palitra loqodan götürülüb: #2786C8 / #70B3E2 / #E3EFF8
   ============================================================= */

:root{
	--c-primary:#2786C8;
	--c-primary-dark:#1B6AA6;
	--c-deep:#12496F;
	--c-sky:#70B3E2;
	--c-mist:#EEF6FC;
	--c-ink:#1E2B36;
	--c-muted:#5D6E7C;
	--c-line:#D9E7F2;
	--c-white:#FFFFFF;
	--c-wa:#25D366;
	--radius:14px;
	--shadow:0 10px 30px rgba(18,73,111,.10);
	--shadow-sm:0 4px 14px rgba(18,73,111,.08);
	--font-display:"Montserrat",system-ui,sans-serif;
	--font-body:"Inter",system-ui,sans-serif;
	--container:1180px;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
	margin:0;
	font-family:var(--font-body);
	font-size:16.5px;
	line-height:1.7;
	color:var(--c-ink);
	background:var(--c-white);
	-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--c-primary);text-decoration:none}
a:hover{color:var(--c-primary-dark)}
h1,h2,h3,h4{font-family:var(--font-display);line-height:1.25;color:var(--c-deep);margin:0 0 .5em}
h1{font-size:clamp(2rem,4.5vw,3.1rem);font-weight:800;letter-spacing:-.01em}
h2{font-size:clamp(1.5rem,3vw,2.15rem);font-weight:700}
h3{font-size:1.15rem;font-weight:700}
p{margin:0 0 1em}

.container{max-width:var(--container);margin:0 auto;padding:0 22px}

.skip-link{position:absolute;left:-9999px;top:0;background:var(--c-deep);color:#fff;padding:10px 16px;z-index:200}
.skip-link:focus{left:12px;top:12px;color:#fff}

:focus-visible{outline:3px solid var(--c-sky);outline-offset:2px}

/* ------------------------------ Düymələr */
.btn{
	display:inline-flex;align-items:center;gap:9px;
	font-family:var(--font-display);font-weight:700;font-size:.95rem;
	padding:13px 26px;border-radius:999px;border:2px solid transparent;
	transition:transform .18s,box-shadow .18s,background .18s,color .18s;
	cursor:pointer;
}
.btn:hover{transform:translateY(-2px)}
.btn svg{width:19px;height:19px;fill:currentColor}
.btn-primary{background:var(--c-primary);color:#fff;box-shadow:var(--shadow-sm)}
.btn-primary:hover{background:var(--c-primary-dark);color:#fff}
.btn-outline{border-color:var(--c-primary);color:var(--c-primary)}
.btn-outline:hover{background:var(--c-primary);color:#fff}
.btn-whatsapp{background:var(--c-wa);color:#fff;padding:10px 20px}
.btn-whatsapp:hover{background:#1fb757;color:#fff}
.btn-white{background:#fff;color:var(--c-deep)}
.btn-white:hover{color:var(--c-primary)}
.btn-ghost{border-color:rgba(255,255,255,.55);color:#fff}
.btn-ghost:hover{background:rgba(255,255,255,.12);color:#fff}

/* ------------------------------ Topbar */
.topbar{background:var(--c-deep);color:#cfe4f4;font-size:.83rem}
.topbar-in{display:flex;gap:26px;align-items:center;min-height:38px;flex-wrap:wrap}
.topbar-item{display:inline-flex;align-items:center;gap:7px;color:#cfe4f4}
.topbar-item svg{width:14px;height:14px;fill:var(--c-sky)}
a.topbar-item:hover{color:#fff}
.topbar-in a:last-child{margin-left:auto}

/* ------------------------------ Header */
.site-header{
	position:sticky;top:0;z-index:100;
	background:rgba(255,255,255,.94);backdrop-filter:blur(10px);
	border-bottom:1px solid var(--c-line);
	transition:box-shadow .2s;
}
.site-header.is-scrolled{box-shadow:var(--shadow-sm)}
.header-in{display:flex;align-items:center;gap:30px;min-height:82px}
.site-logo img,.custom-logo{width:auto;height:52px}
.site-nav{margin-left:auto;display:flex;align-items:center;gap:26px}
.site-nav .menu{list-style:none;display:flex;gap:6px;margin:0;padding:0}
.site-nav .menu a{
	display:block;padding:10px 14px;border-radius:9px;
	color:var(--c-ink);font-weight:500;font-size:.98rem;
}
.site-nav .menu a:hover,
.site-nav .menu .current-menu-item>a{color:var(--c-primary);background:var(--c-mist)}
.site-nav .menu .sub-menu{display:none}

.nav-toggle{display:none;background:none;border:0;padding:10px;cursor:pointer}
.nav-toggle span{display:block;width:24px;height:2.5px;background:var(--c-deep);margin:5px 0;border-radius:2px;transition:.25s}

/* ------------------------------ Bölmə skeleti */
.section{padding:78px 0}
.section-tint{background:var(--c-mist)}
.section-head{max-width:640px;margin-bottom:44px}
.section-more{text-align:center;margin-top:44px}

.eyebrow{
	display:flex;align-items:center;gap:10px;
	font-family:var(--font-display);font-weight:700;font-size:.8rem;
	letter-spacing:.13em;text-transform:uppercase;color:var(--c-primary);
	margin-bottom:10px;
}
.eyebrow-light{color:var(--c-sky)}

/* İmza elementi: loqodakı onurğa nöqtələri motivi */
.spine-dots{
	width:34px;height:8px;flex:none;
	background-image:radial-gradient(circle,var(--c-primary) 2.6px,transparent 2.9px);
	background-size:11px 8px;background-position:left center;background-repeat:repeat-x;
}
.spine-dots-light{background-image:radial-gradient(circle,var(--c-sky) 2.6px,transparent 2.9px)}

/* ------------------------------ Hero */
.hero{
	background:linear-gradient(180deg,var(--c-mist) 0%,#fff 100%);
	overflow:hidden;
}
.hero-in{
	display:grid;grid-template-columns:1.15fr .85fr;gap:40px;
	align-items:center;padding-top:64px;padding-bottom:64px;
}
.hero h1 em{font-style:normal;color:var(--c-primary);position:relative}
.hero-lead{font-size:1.1rem;color:var(--c-muted);max-width:520px}
.hero-actions{display:flex;gap:14px;flex-wrap:wrap;margin:26px 0 22px}
.hero-chips{list-style:none;display:flex;gap:10px;flex-wrap:wrap;margin:0;padding:0}
.hero-chips li{
	background:#fff;border:1px solid var(--c-line);border-radius:999px;
	padding:7px 15px;font-size:.85rem;font-weight:500;color:var(--c-deep);
	box-shadow:var(--shadow-sm);
}
.hero-chips li::before{content:"✓ ";color:var(--c-primary);font-weight:700}

.hero-visual{position:relative;display:flex;justify-content:center}
.hero-visual img{
	position:relative;z-index:2;max-height:480px;width:auto;
	filter:drop-shadow(0 24px 34px rgba(18,73,111,.22));
}
.hero-ring{
	position:absolute;inset:0;margin:auto;width:min(400px,90%);aspect-ratio:1;
	border-radius:50%;background:var(--c-sky);opacity:.18;
}
.hero-ring::after{
	content:"";position:absolute;inset:-26px;border-radius:50%;
	border:2px dashed var(--c-sky);opacity:.7;
}

/* ------------------------------ Kateqoriya kartları */
.cat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.cat-card{
	background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);
	overflow:hidden;display:flex;flex-direction:column;
	transition:transform .2s,box-shadow .2s;
}
.cat-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.cat-card img{aspect-ratio:1;object-fit:cover;background:var(--c-mist)}
.cat-body{padding:18px 20px 20px}
.cat-body h3{margin-bottom:4px}
.cat-body p{margin:0;font-size:.88rem;color:var(--c-muted)}

/* ------------------------------ Məhsul kartları */
.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.product-card{
	background:#fff;border-radius:var(--radius);overflow:hidden;
	box-shadow:var(--shadow-sm);transition:transform .2s,box-shadow .2s;
	display:flex;flex-direction:column;
}
.product-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}
.product-card img{aspect-ratio:1;object-fit:contain;padding:18px;background:#fff}
.product-body{padding:0 20px 20px;border-top:1px solid var(--c-mist)}
.product-body h3{font-size:1.02rem;margin:14px 0 4px}
.product-body p{margin:0;font-size:.85rem;color:var(--c-muted)}

/* ------------------------------ Üstünlüklər */
.feature-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.feature{padding:28px 24px;border:1px solid var(--c-line);border-radius:var(--radius)}
.feature-ico{
	width:52px;height:52px;border-radius:14px;background:var(--c-mist);
	display:flex;align-items:center;justify-content:center;margin-bottom:16px;
}
.feature-ico svg{width:26px;height:26px;fill:var(--c-primary)}
.feature p{margin:0;font-size:.92rem;color:var(--c-muted)}

/* ------------------------------ Proses (tünd bölmə) */
.section-deep{background:var(--c-deep)}
.section-deep h2{color:#fff}
.steps{
	list-style:none;margin:0;padding:0;
	display:grid;grid-template-columns:repeat(4,1fr);gap:22px;
	counter-reset:step;
}
.steps li{
	background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);
	border-radius:var(--radius);padding:26px 22px;position:relative;
}
.steps h3{color:#fff;font-size:1.05rem}
.steps p{margin:0;color:#b8d3e8;font-size:.9rem}
.step-n{
	display:inline-flex;align-items:center;justify-content:center;
	width:40px;height:40px;border-radius:50%;
	background:var(--c-primary);color:#fff;
	font-family:var(--font-display);font-weight:800;
	margin-bottom:14px;
}

/* ------------------------------ Xəstəliklər */
.disease-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}
.disease-card{
	display:block;background:var(--c-mist);border-radius:var(--radius);
	padding:26px 24px;color:inherit;
	border:1px solid transparent;transition:.2s;
}
.disease-card:hover{background:#fff;border-color:var(--c-line);box-shadow:var(--shadow);transform:translateY(-4px);color:inherit}
.disease-card p{font-size:.9rem;color:var(--c-muted)}
.link-more{font-weight:600;color:var(--c-primary);font-size:.9rem}

/* ------------------------------ Rəylər */
.quote-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}
.quote{
	margin:0;background:#fff;border-radius:var(--radius);
	padding:28px 26px;box-shadow:var(--shadow-sm);
	border-top:4px solid var(--c-sky);
}
.quote p{font-size:.96rem}
.quote footer{font-weight:600;color:var(--c-deep);font-size:.9rem}
.quote footer span{font-weight:400;color:var(--c-muted)}

/* ------------------------------ CTA lenti */
.cta-band{background:linear-gradient(115deg,var(--c-primary) 0%,var(--c-deep) 100%);padding:64px 0}
.cta-in{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap}
.cta-band h2,.cta-band p{color:#fff}
.cta-band p{margin:0;opacity:.9}
.cta-actions{display:flex;gap:14px;flex-wrap:wrap}

/* ------------------------------ Daxili səhifələr */
.page-hero{background:var(--c-mist);padding:52px 0 44px}
.page-hero h1{margin:0}
.breadcrumbs{font-size:.85rem;color:var(--c-muted);margin-bottom:10px}
.breadcrumbs a{color:var(--c-muted)}
.breadcrumbs a:hover{color:var(--c-primary)}
.entry{padding:60px 0;max-width:820px}
.entry img{border-radius:var(--radius)}
.entry h2{margin-top:1.6em}

/* Məhsul arxivi */
.archive-toolbar{display:flex;gap:10px;flex-wrap:wrap;margin-bottom:36px}
.archive-toolbar a{
	padding:8px 18px;border-radius:999px;border:1px solid var(--c-line);
	font-size:.9rem;font-weight:500;color:var(--c-ink);
}
.archive-toolbar a:hover,.archive-toolbar a.is-active{background:var(--c-primary);border-color:var(--c-primary);color:#fff}

/* Tək məhsul */
.single-product-in{display:grid;grid-template-columns:.9fr 1.1fr;gap:50px;padding:60px 0;align-items:start}
.single-product-img{
	background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);
	padding:30px;position:sticky;top:110px;
}
.single-product-img img{margin:auto;object-fit:contain}
.single-cta{
	margin-top:30px;background:var(--c-mist);border-radius:var(--radius);
	padding:24px 26px;
}
.single-cta h3{margin-bottom:6px}
.single-cta p{font-size:.92rem;color:var(--c-muted)}
.single-cta .btn{margin-right:10px;margin-top:6px}

/* Bloq siyahısı */
.post-list{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;padding:60px 0}
.post-card{background:#fff;border:1px solid var(--c-line);border-radius:var(--radius);overflow:hidden;display:flex;flex-direction:column}
.post-card img{aspect-ratio:16/10;object-fit:cover}
.post-card-body{padding:20px 22px}
.post-card h2{font-size:1.1rem}
.post-card .meta{font-size:.82rem;color:var(--c-muted)}

.pagination{display:flex;gap:8px;justify-content:center;padding-bottom:60px}
.pagination .page-numbers{padding:9px 16px;border:1px solid var(--c-line);border-radius:9px;font-weight:500}
.pagination .current{background:var(--c-primary);border-color:var(--c-primary);color:#fff}

/* ------------------------------ Footer */
.site-footer{background:var(--c-deep);color:#b8d3e8;font-size:.93rem}
.footer-grid{
	display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:36px;
	padding:64px 22px 46px;
}
.footer-brand img{height:56px;width:auto;margin-bottom:18px}
.footer-col h3{color:#fff;font-size:1rem;margin-bottom:14px}
.footer-menu,.footer-contact{list-style:none;margin:0;padding:0}
.footer-menu li,.footer-contact li{margin-bottom:9px}
.footer-menu a,.footer-contact a{color:#b8d3e8}
.footer-menu a:hover,.footer-contact a:hover{color:#fff}
.footer-social{display:flex;gap:10px;margin-top:16px}
.footer-social a{
	width:38px;height:38px;border-radius:10px;background:rgba(255,255,255,.09);
	display:flex;align-items:center;justify-content:center;
}
.footer-social a:hover{background:var(--c-primary)}
.footer-social svg{width:18px;height:18px;fill:#fff}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding:18px 0;font-size:.85rem}
.footer-bottom p{margin:0}

/* ------------------------------ WhatsApp üzən düymə */
.wa-float{
	position:fixed;right:20px;bottom:20px;z-index:90;
	width:58px;height:58px;border-radius:50%;
	background:var(--c-wa);display:flex;align-items:center;justify-content:center;
	box-shadow:0 10px 24px rgba(37,211,102,.4);
	transition:transform .2s;
}
.wa-float:hover{transform:scale(1.08)}
.wa-float svg{width:30px;height:30px;fill:#fff}

/* ------------------------------ Görünmə animasiyası */
@media (prefers-reduced-motion:no-preference){
	.reveal{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease}
	.reveal.is-in{opacity:1;transform:none}
}

/* ------------------------------ Responsiv */
@media (max-width:1024px){
	.cat-grid,.product-grid,.feature-grid,.steps,.disease-grid{grid-template-columns:repeat(2,1fr)}
	.quote-grid{grid-template-columns:1fr 1fr}
	.post-list{grid-template-columns:1fr 1fr}
	.footer-grid{grid-template-columns:1fr 1fr}
	.single-product-in{grid-template-columns:1fr;gap:34px}
	.single-product-img{position:static}
}

@media (max-width:860px){
	.hero-in{grid-template-columns:1fr;text-align:center;padding-top:44px;padding-bottom:44px}
	.hero-lead{margin-inline:auto}
	.hero-actions,.hero-chips{justify-content:center}
	.eyebrow{justify-content:center}
	.section-head .eyebrow{justify-content:flex-start}
	.hero-visual img{max-height:360px}
	.topbar-hours{display:none}

	.nav-toggle{display:block;margin-left:auto}
	.site-nav{
		position:fixed;inset:0;top:0;z-index:99;
		background:#fff;flex-direction:column;justify-content:center;gap:14px;
		transform:translateX(100%);transition:transform .28s ease;
		padding:80px 30px 40px;
	}
	.site-nav.is-open{transform:none;box-shadow:var(--shadow)}
	.site-nav .menu{flex-direction:column;text-align:center;gap:4px}
	.site-nav .menu a{font-size:1.15rem;padding:12px}
	.nav-toggle{position:relative;z-index:100}
	.nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(7.5px) rotate(45deg)}
	.nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0}
	.nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-7.5px) rotate(-45deg)}
	body.nav-open{overflow:hidden}
}

@media (max-width:560px){
	.section{padding:56px 0}
	.cat-grid,.product-grid,.feature-grid,.steps,.disease-grid,.quote-grid,.post-list{grid-template-columns:1fr}
	.footer-grid{grid-template-columns:1fr;gap:28px}
	.topbar-in{justify-content:center;font-size:.78rem;gap:14px}
	.topbar-in a:last-child{margin-left:0}
	.cta-in{flex-direction:column;text-align:center}
	.btn{width:100%;justify-content:center}
	.hero-actions .btn{width:auto}
	.nav-cta{width:auto}
}