/* ==========================================================================
   Reset (from the parent theme bethree/style.css, inlined here so the browser
   downloads one stylesheet less before the first paint; inc/performance.php
   dequeues the parent file). Keep in sync if the parent reset ever changes.
   ========================================================================== */
html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}html{scroll-behavior:smooth}body{line-height:1}a{text-decoration-skip-ink:auto}a[href^="tel"]{color:inherit;text-decoration:none}button{outline:0}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}q{display:inline;font-style:italic}q:before{content:'"';font-style:normal}q:after{content:'"';font-style:normal}textarea,input[type="text"],input[type="button"],input[type="submit"],input[type="reset"],input[type="search"],input[type="password"]{-webkit-appearance:none;appearance:none;border-radius:0}input[type="search"]{-webkit-appearance:textfield}table{border-collapse:collapse;border-spacing:0}th,td{padding:2px}big{font-size:120%}small,sup,sub{font-size:80%}sup{vertical-align:super}sub{vertical-align:sub}dd{margin-left:20px}kbd,tt{font-family:courier;font-size:12px}ins{text-decoration:underline}del,strike,s{text-decoration:line-through}dt{font-weight:bold}address,cite,var{font-style:italic}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}
.sticky{}.bypostauthor{}.wp-caption{}.wp-caption-text{}.gallery-caption{}.alignright{}.alignleft{}.aligncenter{}
.screen-reader-text{border:0;clip:rect(1px,1px,1px,1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute!important;width:1px;word-wrap:normal!important;word-break:normal}
.screen-reader-text:focus{background-color:#f7f7f7;border-radius:3px;box-shadow:0 0 2px 2px rgba(0,0,0,.6);clip:auto!important;-webkit-clip-path:none;clip-path:none;color:#007acc;display:block;font-size:14px;font-size:.875rem;font-weight:700;height:auto;right:5px;line-height:normal;padding:15px 23px 14px;text-decoration:none;top:5px;width:auto;z-index:100000}
.skip-link{left:-9999rem;top:2.5rem;z-index:999999999;text-decoration:underline}
.skip-link:focus{display:block;left:6px;top:7px;font-size:14px;font-weight:600;text-decoration:none;line-height:normal;padding:15px 23px 14px;z-index:100000;right:auto}
.visually-hidden:not(:focus):not(:active), .form-allowed-tags:not(:focus):not(:active){position:absolute !important;height:1px;width:1px;overflow:hidden;clip:rect(1px 1px 1px 1px);clip:rect(1px, 1px, 1px, 1px);white-space:nowrap}

/* ==========================================================================
   BeThree Child – main.css (drpolyzos.gr)
   Global stylesheet, loaded on every page (after the parent reset above).
   Per-page styles live in assets/css/pages/{key}.css (see inc/enqueue.php).
   Values come from the Figma file edXLeq6jBDdtRxMmlBlcvC (Desktop 8:62 at
   1920px, Mobile 57:1805 at 375px).

   1. Fonts        6. Header + menu
   2. Tokens       7. Footer
   3. Base         8. Mobile call bar
   4. Layout       9. Forms (Contact Form 7)
   5. Components  10. Content (post/page body)
   ========================================================================== */


/* 1. Fonts ----------------------------------------------------------------
   Syne (variable 400–800) and Manrope (variable 200–800), self-hosted Greek +
   Latin subsets (assets/fonts, from Google Fonts). Manrope is used only for
   phone numbers, e-mails, addresses and dates (Figma), so it is not preloaded.
   -------------------------------------------------------------------------- */
@font-face {
	font-family: "Syne";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("../fonts/syne-greek.woff2") format("woff2");
	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
	font-family: "Syne";
	font-style: normal;
	font-weight: 400 800;
	font-display: swap;
	src: url("../fonts/syne-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url("../fonts/manrope-greek.woff2") format("woff2");
	unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}

@font-face {
	font-family: "Manrope";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url("../fonts/manrope-latin.woff2") format("woff2");
	unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


/* 2. Tokens --------------------------------------------------------------- */

/* Arrow icons (arrow.svg, arrow-down.svg): the dotted arrow's stroke; registered so it fades */
@property --be-icon-stroke {
	syntax: "<color>";
	inherits: true;
	initial-value: #fff;
}

:root {
	/* Colours (Figma) */
	--be-ink: #49363a;                         /* text, footer ground */
	--be-mauve: #6b4f54;                       /* accent, card gradients, bullets */
	--be-cream: #f5f0ec;                       /* alternate section ground */
	--be-paper: #fffbf8;                       /* section ground */
	--be-black: #000;
	--be-white: #fff;
	--be-muted: rgba(73, 54, 58, 0.7);         /* body copy on light grounds */
	--be-faint: rgba(73, 54, 58, 0.5);         /* FAQ answers */
	--be-btn: rgba(107, 79, 84, 0.2);          /* Figma "Button" */
	--be-btn-menu: rgba(107, 79, 84, 0.1);     /* Figma "Menu Button" */
	--be-btn-light: rgba(255, 255, 255, 0.2);  /* Figma "Button" on cream / cards */

	/* Motion (Figma prototype: hover states are "Dissolve / Smart animate, Ease out")
	   fast: buttons, cards, FAQ (300ms); slow: hero, clinics, footer links (800ms) */
	--be-ease: ease-out;
	--be-t-fast: 0.3s;
	--be-t-slow: 0.8s;

	/* Typography (Figma text styles) */
	--be-font: "Syne", "Segoe UI", system-ui, -apple-system, sans-serif;
	--be-font-alt: "Manrope", "Segoe UI", system-ui, -apple-system, sans-serif;
	--be-hero: 400 45px/50px var(--be-font);        /* hero name */
	--be-title: 500 45px/50px var(--be-font);       /* "H1" style: section titles */
	--be-h2: 500 32px/40px var(--be-font);          /* "Η2": card / clinic / video titles */
	--be-h3: 500 24px/32px var(--be-font);          /* "H3": footer titles */
	--be-subtext: 400 26px/32px var(--be-font);
	--be-tile: 400 40px/45px var(--be-font);        /* gradient card titles */
	--be-body: 400 18px/24px var(--be-font);        /* "Body Text" */
	--be-btn-font: 400 18px/1.2 var(--be-font);
	--be-contact: 500 18px/24px var(--be-font-alt); /* phones, e-mails, addresses */

	/* Section padding: every section gets .be_row */
	--be-pad-x: 100px;
	--be-pad-y: 100px;
	--be-gap: 40px;
}

@media (max-width: 1440px) {
	:root {
		--be-hero: 400 40px/46px var(--be-font);
		--be-title: 500 40px/46px var(--be-font);
		--be-tile: 400 34px/40px var(--be-font);
	}
}

@media (max-width: 1100px) {
	:root {
		--be-pad-x: 60px;
		--be-pad-y: 80px;
		--be-title: 500 36px/42px var(--be-font);
		--be-h2: 500 28px/36px var(--be-font);
		--be-tile: 400 30px/36px var(--be-font);
	}
}

@media (max-width: 700px) {
	:root {
		--be-hero: 400 30px/36px var(--be-font);       /* "H1 Mobile" */
		--be-title: 400 30px/36px var(--be-font);      /* section titles, mobile */
		--be-h2: 400 24px/30px var(--be-font);         /* "H2 Mobile" */
		--be-h3: 500 20px/28px var(--be-font);
		--be-subtext: 400 20px/26px var(--be-font);    /* "Mobile Subtext" */
		--be-tile: 400 28px/36px var(--be-font);
		--be-body: 400 16px/20px var(--be-font);       /* "Mobile Body Text" */
		--be-btn-font: 400 16px/1.2 var(--be-font);
		--be-contact: 500 16px/22px var(--be-font-alt);
		--be-pad-x: 20px;
		--be-pad-y: 20px;
		--be-gap: 20px;
	}
}


/* 3. Base ----------------------------------------------------------------- */
html {
	-webkit-text-size-adjust: 100%;
}

body {
	font: var(--be-body);
	color: var(--be-ink);
	background: var(--be-paper);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin: 0;
	font-weight: 500;
}

strong,
b {
	font-weight: 600;
}

em,
i {
	font-style: italic;
}

img,
svg,
video,
iframe {
	max-width: 100%;
}

img {
	height: auto;
	display: block;
}

a {
	color: inherit;
}

button,
input,
select,
textarea {
	font: inherit;
	color: inherit;
}

button {
	cursor: pointer;
}

:focus-visible {
	outline: 2px solid var(--be-mauve);
	outline-offset: 2px;
}

[hidden] {
	display: none !important;
}

.be_icon {
	display: inline-flex;
	flex: 0 0 auto;
	line-height: 0;
}

.be_icon svg {
	display: block;
	width: 100%;
	height: 100%;
}


/* 4. Layout ---------------------------------------------------------------
   No max-width containers: every section is a full-width block with .be_row
   padding (Figma: 100px on desktop, 20px on mobile).
   -------------------------------------------------------------------------- */
.be_row {
	padding: var(--be-pad-y) var(--be-pad-x);
}

.be_sec-title {
	font: var(--be-title);
	color: var(--be-ink);
	margin: 0 0 var(--be-gap);
}

.be_sec-title--center {
	text-align: center;
}

.be_text p + p,
.be_text p + ul,
.be_text p + ol {
	margin-top: 24px;
}

.be_text--muted {
	color: var(--be-muted);
}

.be_text a {
	text-decoration: underline;
	text-underline-offset: 2px;
}

.be_text a[href^="tel:"] {
	white-space: nowrap; /* a phone number never breaks across lines */
}

@media (max-width: 700px) {
	.be_text p + p {
		margin-top: 20px;
	}
}


/* 5. Components -----------------------------------------------------------
   Button (Figma "Button" 26:878): square, 12/24 padding, mauve 20% ground,
   Syne 18, 20px dotted-arrow circle. Variants:
   --light  white 20% ground (on cream grounds and gradient cards)
   --solid  mauve ground, white text (floating «Επικοινωνία», 78:2042)
   --icon   icon only (cards, 33:2368)
   -------------------------------------------------------------------------- */
.be_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 12px 24px;
	border: 0;
	background: var(--be-btn);
	color: var(--be-ink);
	font: var(--be-btn-font);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color var(--be-t-fast) var(--be-ease), color var(--be-t-fast) var(--be-ease), box-shadow var(--be-t-fast) var(--be-ease);
}

.be_btn .be_icon {
	width: 20px;
	height: 20px;
	color: var(--be-ink);
	transition: color var(--be-t-fast) var(--be-ease), --be-icon-stroke var(--be-t-fast) var(--be-ease), transform var(--be-t-fast) var(--be-ease);
}

/* Hover = Figma Variant2 of each button. Text buttons: the arrow turns 45° (points
   down-right); icon-only card buttons keep it level. */
.be_btn:not(.be_btn--icon):hover .be_icon,
.be_btn:not(.be_btn--icon):focus-visible .be_icon {
	transform: rotate(45deg);
}

/* "Button" 26:877 (mauve 20%) → solid mauve, white text, white circle, mauve arrow */
.be_btn:hover,
.be_btn:focus-visible {
	background: var(--be-mauve);
	color: var(--be-white);
}

.be_btn:hover .be_icon,
.be_btn:focus-visible .be_icon {
	color: var(--be-white);
	--be-icon-stroke: var(--be-mauve);
}

/* "Button" 28:1867 / 33:2367 (white 20%) → white, mauve circle */
.be_btn--light {
	background: var(--be-btn-light);
	box-shadow: 0 2px 8px rgba(73, 54, 58, 0.08);
}

.be_btn--light:hover,
.be_btn--light:focus-visible {
	background: var(--be-white);
	color: var(--be-ink);
}

.be_btn--light:hover .be_icon,
.be_btn--light:focus-visible .be_icon {
	color: var(--be-mauve);
	--be-icon-stroke: var(--be-white);
}

/* "Button Contact" 78:1950 (solid mauve) → ink, white circle, mauve arrow */
.be_btn--solid {
	background: var(--be-mauve);
	color: var(--be-white);
}

.be_btn--solid:hover,
.be_btn--solid:focus-visible {
	background: var(--be-ink);
}

.be_btn--icon {
	padding: 12px 24px;
}

.be_btn:disabled,
.be_btn[aria-disabled="true"] {
	opacity: 0.45;
	cursor: not-allowed;
	pointer-events: none;
}

/* Contact list (phones / e-mails / address with the Figma icons, 32px icon column) */
.be_contact-list {
	display: flex;
	flex-direction: column;
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
	font: var(--be-contact);
}

.be_contact-list li {
	display: flex;
	align-items: flex-start;
	gap: 6px;
}

.be_contact-list .be_icon {
	width: 32px;
	height: 20px;
	margin-top: 2px;
	color: var(--be-mauve);
	justify-content: flex-start;
}

.be_contact-list .be_icon svg {
	width: auto;
}

.be_contact-list a {
	text-decoration: none;
}

.be_contact-list a:hover,
.be_contact-list a:focus-visible {
	text-decoration: underline;
}

.be_contact-list--light,
.be_contact-list--light .be_icon {
	color: var(--be-paper);
}

@media (min-width: 1641px) {
	.be_contact-list span,
	.be_contact-list a {
		white-space: nowrap; /* Figma: one line per row (e.g. both e-mails) */
	}
}

/* Social icons (Figma 44:4383…: 46px paper squares, 30px two-tone glyph) */
.be_social {
	display: flex;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.be_social-link {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 46px;
	height: 46px;
	background: var(--be-paper);
	transition: background-color 0.2s ease;
}

.be_social-link .be_icon {
	width: 30px;
	height: 30px;
}

.be_social-link:hover,
.be_social-link:focus-visible {
	background: var(--be-white);
}

/* Slider (scroll-snap track + prev/next buttons, main.js "Sliders") */
.be_slider {
	position: relative;
	min-width: 0; /* inside grids/flex the track must not widen its column */
}

.be_slider-track {
	display: flex;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	overscroll-behavior-x: contain;
	scrollbar-width: none;
}

.be_slider-track::-webkit-scrollbar {
	display: none;
}

.be_slider-track > * {
	scroll-snap-align: start;
	flex: 0 0 auto;
}

.be_slider-nav {
	display: flex;
	gap: 12px;
}

.be_slider-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 40px;
	height: 40px;
	padding: 0;
	border: 0;
	background: none;
}

.be_slider-btn .be_icon {
	width: 40px;
	height: 40px;
	color: var(--be-mauve);
	transition: opacity var(--be-t-fast) var(--be-ease), color var(--be-t-fast) var(--be-ease);
}

/* Figma "Arrow" 33:2485 Variant2: the circle turns ink */
.be_slider-btn:not(:disabled):hover .be_icon,
.be_slider-btn:focus-visible .be_icon {
	color: var(--be-ink);
}

.be_slider-btn--prev .be_icon {
	transform: scaleX(-1);
}

.be_slider-btn:disabled .be_icon {
	opacity: 0.35;
}

.be_slider-btn:disabled {
	cursor: default;
}

@media (max-width: 700px) {
	.be_slider-btn,
	.be_slider-btn .be_icon {
		width: 32px;
		height: 32px;
	}
}


/* 6. Header + menu --------------------------------------------------------
   Top bar (44:4382): cream, 12/50 padding, Manrope 18 mauve phones, socials and
   language pill on the right. Navigation bar (28:956): logos left, menu pills
   right (Figma "Menu Button": mauve 10% ground, 12/24, Syne 18, arrow circle).
   On the front page the navigation bar lies over the hero (page-home.css).
   -------------------------------------------------------------------------- */
.be_header {
	position: relative;
	z-index: 60;
}

.be_topbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	min-height: 70px;
	padding: 12px 50px;
	background: var(--be-cream);
}

.be_topbar-phones {
	display: flex;
	flex-wrap: wrap;
	gap: 12px 24px;
	margin: 0;
	padding: 0;
	list-style: none;
	font: 500 18px/24px var(--be-font-alt);
	color: var(--be-mauve);
}

.be_topbar-phone {
	display: flex;
	align-items: center;
	gap: 12px;
}

.be_topbar-phone .be_icon {
	width: 18px;
	height: 20px;
	color: var(--be-mauve);
}

.be_topbar-phone a {
	text-decoration: none;
}

.be_topbar-phone a:hover,
.be_topbar-phone a:focus-visible {
	text-decoration: underline;
}

.be_topbar-short,
.be_topbar-phone--urgent {
	display: none;
}

.be_topbar-end {
	display: flex;
	align-items: center;
	gap: 12px;
}

.be_navbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 24px;
	padding: 24px 50px;
	background: var(--be-paper);
}

/* Sticky navigation bar (main.js "Sticky navigation bar"): once the bar has scrolled out
   of view it returns fixed at the top, slides in and stays until the page is scrolled
   back to its place. The header keeps the bar's height (inline padding) so nothing jumps. */
.be_header--stuck .be_navbar {
	position: fixed;
	top: var(--wp-admin--admin-bar--height, 0px);
	left: 0;
	right: 0;
	z-index: 80;
	padding-top: 16px;
	padding-bottom: 16px;
	background: var(--be-paper);
	box-shadow: 0 8px 24px rgba(73, 54, 58, 0.1);
	animation: be-navbar-in var(--be-t-fast) var(--be-ease);
}

@keyframes be-navbar-in {
	from {
		transform: translateY(-100%);
	}
}

/* In-page anchors land below the sticky bar */
html {
	scroll-padding-top: calc(var(--be-sticky-h, 0px) + 16px);
}

/* Below 600px the admin bar scrolls away with the page */
@media (max-width: 600px) {
	.be_header--stuck .be_navbar {
		top: 0;
	}
}

.be_logo {
	display: flex;
	align-items: center;
	gap: 12px;
	flex: 0 0 auto;
}

.be_logo-main {
	width: 160px;
	height: 63px;
}

.be_logo-life {
	width: 63px;
	height: 63px;
}

.be_menu-toggle {
	display: none;
}

.be_nav-list {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 12px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.be_nav-list > li {
	position: relative;
	display: flex;
	align-items: center;
}

.be_nav-list > li > a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	padding: 12px 20px; /* Figma 24px; 20px keeps the six pills + «Επικοινωνία» on one line at 1920 */
	background: var(--be-btn-menu);
	color: var(--be-ink);
	font: 400 18px/1.2 var(--be-font);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color var(--be-t-fast) var(--be-ease), color var(--be-t-fast) var(--be-ease);
}

.be_nav-arrow {
	width: 20px;
	height: 20px;
	color: var(--be-ink);
	transition: color var(--be-t-fast) var(--be-ease), --be-icon-stroke var(--be-t-fast) var(--be-ease), transform var(--be-t-fast) var(--be-ease);
}

/* Hover / current = Figma "Menu Button" 8:12 Variant2: mauve 20%, mauve text and circle */
.be_nav-list > li > a:hover,
.be_nav-list > li > a:focus-visible,
.be_nav-list > li:hover > a,
.be_nav-list > li:focus-within > a,
.be_nav-list > li.is-open > a,
.be_nav-list > .current-menu-item > a,
.be_nav-list > .current-menu-ancestor > a,
.be_nav-list > .current-menu-parent > a {
	background: var(--be-btn);
	color: var(--be-mauve);
}

.be_nav-list > li > a:hover .be_nav-arrow,
.be_nav-list > li > a:focus-visible .be_nav-arrow,
.be_nav-list > li:hover > a .be_nav-arrow,
.be_nav-list > li:focus-within > a .be_nav-arrow,
.be_nav-list > li.is-open > a .be_nav-arrow,
.be_nav-list > .current-menu-item > a .be_nav-arrow,
.be_nav-list > .current-menu-ancestor > a .be_nav-arrow,
.be_nav-list > .current-menu-parent > a .be_nav-arrow {
	color: var(--be-mauve);
}

/* «Επικοινωνία» in the menu: class be_menu-cta on the item (Figma "Button Contact" 78:1950;
   hover: ink ground, white circle, mauve arrow turned 45°) */
.be_nav-list > li.be_menu-cta > a {
	background: var(--be-mauve);
	color: var(--be-white);
}

.be_nav-list > li.be_menu-cta > a:hover,
.be_nav-list > li.be_menu-cta > a:focus-visible,
.be_nav-list > li.be_menu-cta.current-menu-item > a {
	background: var(--be-ink);
	color: var(--be-white);
}

.be_nav-list > li.be_menu-cta > a:hover .be_nav-arrow,
.be_nav-list > li.be_menu-cta > a:focus-visible .be_nav-arrow,
.be_nav-list > li.be_menu-cta.current-menu-item > a .be_nav-arrow {
	color: var(--be-white);
	--be-icon-stroke: var(--be-mauve);
}

.be_nav-list > li.be_menu-cta > a:hover .be_nav-arrow,
.be_nav-list > li.be_menu-cta > a:focus-visible .be_nav-arrow {
	transform: rotate(45deg);
}

.be_nav-list > li.menu-item-has-children:hover .be_nav-arrow,
.be_nav-list > li.menu-item-has-children:focus-within .be_nav-arrow,
.be_nav-list > li.is-open .be_nav-arrow {
	transform: rotate(180deg);
}

.be_submenu-toggle {
	display: none;
}

/* Dropdown: starts right under the pill (top: 100%); the transparent
   padding-top is the visual gap, the visible panel is .be_dropdown-inner. */
.be_dropdown {
	position: absolute;
	top: 100%;
	right: 0;
	z-index: 70;
	min-width: 100%;
	margin: 0;
	padding: 8px 0 0;
	list-style: none;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s linear 0.2s;
}

.be_nav-list > li:first-child > .be_dropdown {
	right: auto;
	left: 0;
}

.be_nav-list > li:hover > .be_dropdown,
.be_nav-list > li:focus-within > .be_dropdown,
.be_nav-list > li.is-open > .be_dropdown {
	opacity: 1;
	visibility: visible;
	transform: none;
	transition: opacity 0.2s ease, transform 0.2s ease, visibility 0s;
}

.be_dropdown-inner {
	display: block;
	min-width: 280px;
	max-height: calc(100vh - 220px); /* long lists (Εγκυμοσύνη, Παθήσεις) scroll inside the panel */
	overflow-y: auto;
	padding: 16px 0;
	background: var(--be-paper);
	box-shadow: 0 12px 32px rgba(73, 54, 58, 0.16);
}

/* Group labels without a page (custom "#" items, e.g. «Ιατρική Εμβρύου») */
.be_dropdown-list a[href="#"] {
	font-weight: 600;
	cursor: default;
	pointer-events: none;
}

.be_dropdown-list,
.be_dropdown-list .sub-menu,
.be_mega-col-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.be_dropdown-list a {
	display: block;
	padding: 10px 24px;
	color: var(--be-ink);
	font: var(--be-body);
	text-decoration: none;
	white-space: nowrap;
	transition: background-color 0.2s ease;
}

.be_dropdown-list .sub-menu a {
	padding-left: 40px;
	color: var(--be-muted);
}

.be_dropdown-list a:hover,
.be_dropdown-list a:focus-visible,
.be_dropdown-list .current-menu-item > a {
	background: var(--be-cream);
}

.be_dropdown--mega .be_dropdown-list {
	display: flex;
}

/* The seven pills need 1506px at the Figma size, which only fits from 1920px. Narrower
   desktops tighten step by step so the menu always stays on ONE line:
   ≤1919 16px text, 16px padding, 8px gaps; ≤1700 no arrow circles; ≤1500 15px text,
   12px padding, 32px bar padding. Below 1366px the burger takes over. */
@media (min-width: 1366px) and (max-width: 1919px) {
	.be_nav-list {
		gap: 8px;
	}

	.be_nav-list > li > a {
		padding: 12px 16px;
		font-size: 16px;
	}
}

@media (min-width: 1366px) and (max-width: 1700px) {
	.be_nav-list > li > a {
		gap: 0;
	}

	.be_nav-list > li > a .be_nav-arrow {
		display: none;
	}
}

@media (min-width: 1366px) and (max-width: 1500px) {
	.be_navbar {
		padding-left: 32px;
		padding-right: 32px;
	}

	.be_nav-list > li > a {
		padding: 10px 12px;
		font-size: 15px;
	}
}

/* Tablet/mobile header (≤1365px): burger + full-screen menu */
@media (max-width: 1365px) {
	.be_navbar {
		padding: 20px var(--be-pad-x);
	}

	.be_menu-toggle {
		position: relative;
		z-index: 82;
		display: flex;
		flex-direction: column;
		align-items: flex-end;
		justify-content: center;
		gap: 6px;
		width: 44px;
		height: 44px;
		padding: 0;
		border: 0;
		background: none;
	}

	/* Burger: three 40px bars, all 2px (Figma "Menu" 57:1782 has 1/2/3px; equal by request) */
	.be_menu-toggle-bar {
		display: block;
		width: 40px;
		height: 2px;
		background: var(--be-ink);
		transition: transform 0.25s ease, opacity 0.2s ease;
	}

	.be_menu-toggle[aria-expanded="true"] .be_menu-toggle-bar:nth-child(2) {
		transform: translateY(8px) rotate(45deg);
	}

	.be_menu-toggle[aria-expanded="true"] .be_menu-toggle-bar:nth-child(3) {
		opacity: 0;
	}

	.be_menu-toggle[aria-expanded="true"] .be_menu-toggle-bar:nth-child(4) {
		transform: translateY(-8px) rotate(-45deg);
	}

	.be_menu {
		position: fixed;
		inset: 0;
		z-index: 81;
		display: flex;
		flex-direction: column;
		padding: calc(var(--wp-admin--admin-bar--height, 0px) + 124px) var(--be-pad-x) 40px; /* below the fixed bar */
		overflow-y: auto;
		background: var(--be-paper);
		visibility: hidden;
		opacity: 0;
		transition: opacity 0.25s ease, visibility 0s linear 0.25s;
	}

	body.be_menu-open {
		overflow: hidden;
	}

	body.be_menu-open .be_menu {
		visibility: visible;
		opacity: 1;
		transition: opacity 0.25s ease, visibility 0s;
	}

	/* Open menu: the bar (logo + close button) stays on top wherever the page was scrolled */
	body.be_menu-open .be_navbar {
		position: fixed;
		top: var(--wp-admin--admin-bar--height, 0px);
		left: 0;
		right: 0;
		z-index: 82;
		background: var(--be-paper);
	}

	body.be_menu-open .be_logo {
		position: relative;
		z-index: 82; /* above the menu panel, which lives inside the bar */
	}

	.be_nav-list {
		flex-direction: column;
		flex-wrap: nowrap;
		gap: 12px;
	}

	.be_nav-list > li {
		flex-wrap: wrap;
	}

	.be_nav-list > li > a {
		flex: 1 1 0;
		justify-content: space-between;
		padding: 12px 24px;
		font-size: 18px;
		white-space: normal;
	}

	.be_nav-list > li.menu-item-has-children > a .be_nav-arrow {
		display: none;
	}

	.be_submenu-toggle {
		display: flex;
		align-items: center;
		justify-content: center;
		width: 48px;
		align-self: stretch;
		margin-left: 4px;
		padding: 0;
		border: 0;
		background: var(--be-btn-menu);
	}

	.be_submenu-toggle::before {
		content: "";
		width: 10px;
		height: 10px;
		border-right: 1.5px solid var(--be-ink);
		border-bottom: 1.5px solid var(--be-ink);
		transform: translateY(-3px) rotate(45deg);
		transition: transform 0.2s ease;
	}

	/* follows the button state, so the chevron turns back as soon as a panel starts closing */
	.be_nav-list > li > .be_submenu-toggle[aria-expanded="true"]::before {
		transform: translateY(3px) rotate(-135deg);
	}

	.be_dropdown {
		position: static;
		flex: 0 0 100%;
		display: none;
		padding: 4px 0 0;
		opacity: 1;
		visibility: visible;
		transform: none;
		transition: none;
	}

	.be_nav-list > li:hover > .be_dropdown,
	.be_nav-list > li:focus-within > .be_dropdown {
		display: none;
	}

	.be_nav-list > li.is-open > .be_dropdown {
		display: block;
	}

	.be_dropdown-inner {
		min-width: 0;
		max-height: none;
		overflow: visible;
		padding: 8px 0;
		background: var(--be-cream);
		box-shadow: none;
	}

	.be_dropdown-list a {
		white-space: normal;
	}

	.be_dropdown--mega .be_dropdown-list {
		display: block;
	}
}

@media (max-width: 1100px) {
	.be_topbar {
		padding: 12px var(--be-pad-x);
	}
}

/* Mobile (≤700px, Figma 57:1684 / 57:1751) */
@media (max-width: 700px) {
	.be_topbar {
		min-height: 48px;
		padding: 12px 20px;
	}

	.be_topbar-phones {
		gap: 12px;
		font-size: 14px;
	}

	.be_topbar-full,
	.be_topbar-end .be_social {
		display: none;
	}

	.be_topbar-short {
		display: inline;
	}

	.be_topbar-phone--urgent {
		display: flex;
	}

	.be_navbar {
		padding: 20px;
	}

	.be_logo-main {
		width: 101px;
		height: 40px;
	}

	.be_logo-life {
		width: 36px;
		height: 36px;
	}

	.be_menu {
		padding-top: calc(var(--wp-admin--admin-bar--height, 0px) + 100px);
	}
}


/* 7. Footer ---------------------------------------------------------------
   Figma 44:3500: ink ground, 50/100 padding; three columns split by 1px paper
   lines (logos + socials | clinics | «ΕΞΕΙΔΙΚΕΥΣΕΙΣ» in two columns); paper
   bottom bar with copyright and legal links.
   -------------------------------------------------------------------------- */
.be_footer {
	display: flex;
	flex-direction: column;
	gap: 40px;
	padding: 50px var(--be-pad-x);
	background: var(--be-ink);
	color: var(--be-paper);
}

.be_footer-cols {
	display: grid;
	grid-template-columns: minmax(0, 417fr) minmax(0, 415fr) minmax(0, 662fr);
	gap: 113px;
}

.be_footer-col + .be_footer-col {
	position: relative;
}

.be_footer-col + .be_footer-col::before {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: -56px;
	width: 1px;
	background: var(--be-paper);
	opacity: 0.6;
}

.be_footer-col--brand,
.be_footer-col--clinics,
.be_footer-clinic {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}

.be_footer-col--brand {
	gap: 40px;
}

.be_footer-col--brand .be_footer-title {
	margin-bottom: -16px; /* Figma: 24px between the title and the icons */
}

.be_footer-col--clinics {
	gap: 40px;
}

.be_footer-clinic {
	gap: 32px;
}

.be_footer-logo {
	display: flex;
	align-items: center;
	gap: 12px;
}

.be_footer-logo-main {
	width: 290px;
	height: 114px;
}

.be_footer-logo-life {
	width: 114px;
	height: 114px;
}

.be_footer-title {
	margin: 0;
	font: var(--be-h3);
	color: var(--be-paper);
}

.be_footer-col--specialties .be_footer-title {
	margin-bottom: 32px;
}

.be_footer-specialties {
	display: grid;
	grid-template-columns: repeat(2, max-content);
	grid-template-rows: repeat(8, auto);
	grid-auto-flow: column;
	gap: 32px;
	margin: 0;
	padding: 0;
	list-style: none;
}

.be_footer-specialties a {
	display: flex;
	align-items: center;
	gap: 12px;
	color: var(--be-paper);
	font: 500 18px/24px var(--be-font); /* "Footer Desktop Catogories" */
	text-decoration: none;
}

.be_footer-specialties a::before {
	content: "";
	flex: 0 0 auto;
	width: 10px;
	height: 10px;
	background: var(--be-mauve);
}

/* Figma "Category" 54:4713 Variant2: the text dims to #e0d9d6 (dissolve, ease out, 800ms) */
.be_footer-specialties a {
	transition: color var(--be-t-slow) var(--be-ease);
}

.be_footer-specialties a:hover,
.be_footer-specialties a:focus-visible {
	color: #e0d9d6;
}

.be_footer-specialties a:focus-visible {
	text-decoration: underline;
}

.be_footer-bar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 12px 24px;
	padding: 12px 24px;
	background: var(--be-paper);
	color: var(--be-ink);
	font: 400 16px/22px var(--be-font);
}

.be_footer-copy {
	margin: 0;
}

.be_footer-bar a {
	text-decoration: none;
}

.be_footer-bar a:hover,
.be_footer-bar a:focus-visible {
	text-decoration: underline;
}

.be_footer-legal-list {
	display: flex;
	flex-wrap: wrap;
	margin: 0;
	padding: 0;
	list-style: none;
}

.be_footer-legal-list li + li::before {
	content: "|";
	margin: 0 12px;
}

@media (max-width: 1640px) {
	.be_footer-cols {
		gap: 64px;
	}

	.be_footer-col + .be_footer-col::before {
		left: -32px;
	}

	.be_footer-specialties {
		grid-template-columns: 1fr;
		grid-template-rows: none;
		grid-auto-flow: row;
		gap: 20px;
	}
}

@media (max-width: 1100px) {
	.be_footer-cols {
		grid-template-columns: 1fr 1fr;
	}

	.be_footer-col--specialties {
		grid-column: 1 / -1;
	}

	.be_footer-col--specialties::before {
		display: none;
	}

	.be_footer-specialties {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

/* Mobile footer (57:2948): one column, 1px lines between the blocks */
@media (max-width: 700px) {
	.be_footer {
		padding: 20px;
	}

	.be_footer-cols {
		grid-template-columns: 1fr;
		gap: 48px;
	}

	.be_footer-col + .be_footer-col::before {
		display: block;
		top: -24px;
		bottom: auto;
		left: 0;
		right: 0;
		width: auto;
		height: 1px;
	}

	.be_footer-col--brand .be_footer-title {
		margin-bottom: -12px;
	}

	.be_footer-logo-main {
		width: 160px;
		height: 63px;
	}

	.be_footer-logo-life {
		width: 63px;
		height: 63px;
	}

	.be_footer-specialties {
		grid-template-columns: 1fr;
		gap: 32px;
	}

	.be_footer-specialties a {
		font-size: 16px;
		line-height: 22px;
	}

	.be_social--footer .be_social-link {
		width: 32px;
		height: 32px;
	}

	.be_footer-bar {
		flex-direction: column;
		align-items: flex-start;
		padding: 12px;
		font-size: 14px;
		line-height: 20px;
	}
}


/* 8. Mobile call bar (footer.php) ------------------------------------------
   ≤860px: fixed bottom bar, «Καλέστε μας» (opens the clinics' phones above the bar)
   + «Κλείστε Ραντεβού». Hidden while the mobile menu is open.
   -------------------------------------------------------------------------- */
.be_callbar {
	display: none;
}

@media (max-width: 860px) {
	.be_callbar {
		position: fixed;
		left: 0;
		right: 0;
		bottom: 0;
		z-index: 55;
		display: flex;
		gap: 10px;
		padding: 10px 16px calc(10px + env(safe-area-inset-bottom, 0px));
		background: var(--be-paper);
		box-shadow: 0 -8px 24px rgba(73, 54, 58, 0.12);
	}

	.be_callbar > .be_btn,
	.be_callbar-call {
		flex: 1 1 0;
		min-width: 0;
	}

	.be_callbar .be_btn {
		width: 100%;
		min-height: 48px;
		padding: 0 10px;
		font-size: 15px;
	}

	.be_callbar-call summary {
		list-style: none;
		cursor: pointer;
	}

	.be_callbar-call summary::-webkit-details-marker {
		display: none;
	}

	.be_callbar-phones {
		position: absolute;
		left: 16px;
		right: 16px;
		bottom: calc(100% + 8px);
		display: flex;
		flex-direction: column;
		background: var(--be-paper);
		box-shadow: 0 8px 24px rgba(73, 54, 58, 0.18);
	}

	.be_callbar-phones a {
		display: flex;
		align-items: center;
		gap: 12px;
		padding: 16px 20px;
		color: var(--be-ink);
		font: var(--be-contact);
		text-decoration: none;
	}

	.be_callbar-phones a + a {
		border-top: 1px solid var(--be-btn);
	}

	.be_callbar-phones .be_icon {
		width: 20px;
		height: 20px;
		flex: none;
	}

	body {
		padding-bottom: calc(68px + env(safe-area-inset-bottom, 0px));
	}

	body.be_menu-open .be_callbar {
		display: none;
	}
}


/* 9. Forms (Contact Form 7, inc/forms.php) --------------------------------
   Figma 44:3405: underlined fields, Syne 18 placeholders at 70%; two per row
   (61px gap), message 190px high, acceptance + submit on the last row.
   -------------------------------------------------------------------------- */
.be_form .wpcf7-form {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 37px 61px;
	align-items: end;
}

.be_form .wpcf7-form > p,
.be_form .wpcf7-form > div:not(.wpcf7-response-output),
.be_form .wpcf7-form > span {
	margin: 0;
}

.be_form .wpcf7-form > fieldset.hidden-fields-container,
.be_form .wpcf7-form > div.hidden-fields-container {
	display: none;
}

.be_form .wpcf7-form-control-wrap {
	display: block;
}

.be_form .wpcf7-form-control-wrap:has(textarea) {
	grid-column: 1 / -1;
}

.be_form input[type="text"],
.be_form input[type="email"],
.be_form input[type="tel"],
.be_form textarea {
	display: block;
	width: 100%;
	height: 53px;
	padding: 0 0 22px;
	border: 0;
	border-bottom: 1px solid var(--be-ink);
	border-radius: 0;
	background: transparent;
	color: var(--be-ink);
	font: 400 18px/22px var(--be-font);
}

.be_form textarea {
	height: 190px;
	resize: vertical;
}

.be_form input::placeholder,
.be_form textarea::placeholder {
	color: var(--be-muted);
	opacity: 1;
}

.be_form input:focus,
.be_form textarea:focus {
	outline: none;
	border-bottom-width: 2px;
}

.be_form .wpcf7-form-control-wrap.novalidate,
.be_form .wpcf7-acceptance {
	align-self: center;
	font: 400 16px/20px var(--be-font);
}

.be_form .wpcf7-form-control-wrap.novalidate,
.be_form .wpcf7-acceptance,
.be_form .wpcf7-acceptance .wpcf7-list-item {
	display: block;
	width: 100%;
}

.be_form .wpcf7-acceptance label {
	display: flex;
	align-items: center;
	gap: 6px;
	cursor: pointer;
}

.be_form .wpcf7-acceptance input {
	appearance: none;
	width: 15px;
	height: 15px;
	margin: 0;
	border: 1px solid var(--be-ink);
	background: var(--be-ink);
	cursor: pointer;
}

.be_form .wpcf7-acceptance input:checked {
	box-shadow: inset 0 0 0 3px var(--be-paper);
}

.be_form .wpcf7-acceptance a {
	text-decoration: underline;
}

.be_form .wpcf7-list-item {
	margin: 0;
}

.be_form button[type="submit"] {
	justify-self: end;
}

.be_form .wpcf7-spinner {
	display: none;
}

.be_form .wpcf7-not-valid-tip {
	display: block;
	margin-top: 6px;
	color: #a3263a;
	font-size: 14px;
	line-height: 18px;
}

.be_form .wpcf7-response-output {
	grid-column: 1 / -1;
	margin: 0;
	padding: 12px 16px;
	border: 1px solid var(--be-ink);
	font-size: 16px;
	line-height: 22px;
}

.be_form .wpcf7-form.init .wpcf7-response-output,
.be_form .wpcf7-response-output:empty {
	display: none;
}

.be_form .screen-reader-response {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
}

@media (max-width: 700px) {
	.be_form .wpcf7-form {
		grid-template-columns: 1fr;
		gap: 40px;
	}

	.be_form input[type="text"],
	.be_form input[type="email"],
	.be_form input[type="tel"],
	.be_form textarea {
		height: 33px;
		padding-bottom: 12px;
		font-size: 16px;
		line-height: 20px;
	}

	.be_form textarea {
		height: 100px;
	}

	.be_form button[type="submit"] {
		justify-self: start;
	}
}


/* 9b. Inner pages: page hero + breadcrumb ----------------------------------
   No Figma frame for inner pages: built from the homepage hero (28:1679) – paper 80%
   text half over cream, photo in a paper frame on the right; Syne 45/50 H1.
   Markup: templates/page-contact.php (.be_page-hero-body + -aside with the form panel);
   pages with a photo use .be_page-hero-media > .be_page-hero-frame.
   -------------------------------------------------------------------------- */
.be_page-hero {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	background: var(--be-cream);
}

.be_page-hero-body {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	justify-content: center;
	gap: 32px;
	padding-top: 80px;
	padding-bottom: 80px;
	background: rgba(255, 251, 248, 0.8);
}

.be_page-hero-body > * {
	max-width: 650px;
}

.be_page-hero-title {
	margin: 0;
	font: var(--be-hero);
	color: var(--be-black);
}

.be_page-hero-text {
	margin: 0;
	padding: 32px 0;
	border-top: 2px solid var(--be-ink);
	border-bottom: 1px solid var(--be-ink);
	font: var(--be-subtext);
	color: var(--be-ink);
}

.be_page-hero-media {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 80px var(--be-pad-x) 80px 32px;
}

.be_page-hero-frame {
	width: min(665px, 100%);
	aspect-ratio: 665 / 712;
	margin: 0;
	overflow: hidden;
	background: var(--be-paper);
}

.be_page-hero-frame img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* Cut-out portrait placed as the homepage hero image (left 9.51%, top 22.34%, 80.99% wide,
   clipped by the frame) – biography page */
.be_page-hero-frame--portrait {
	position: relative;
}

.be_page-hero-frame--portrait img {
	position: absolute;
	left: 9.51%;
	top: 22.34%;
	width: 80.99%;
	height: auto;
}

/* Aside with a panel instead of a photo (contact page: the contact form) */
.be_page-hero-aside {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	padding: 80px var(--be-pad-x) 80px 32px;
}

.be_page-hero-panel {
	width: min(760px, 100%);
	padding: 50px;
	background: var(--be-paper);
}

.be_page-hero-panel-title {
	margin: 0 0 32px;
	font: var(--be-h2);
	color: var(--be-ink);
}

/* Phone / e-mail lines in a page hero (bethree_child_contact_quick()) */
.be_contact-quick {
	gap: 16px;
}

.be_contact-quick-label {
	margin-right: 4px;
	font-weight: 700;
	color: var(--be-ink);
}

/* Breadcrumb (Rank Math's trail: a › a › span.last) */
.be_breadcrumb {
	font: 500 16px/22px var(--be-font-alt);
	color: var(--be-muted);
}

.be_breadcrumb p {
	margin: 0;
}

.be_breadcrumb a {
	color: var(--be-mauve);
	text-decoration: none;
}

.be_breadcrumb a:hover,
.be_breadcrumb a:focus-visible {
	text-decoration: underline;
}

.be_breadcrumb .separator {
	margin: 0 8px;
}

@media (max-width: 1100px) {
	.be_page-hero {
		grid-template-columns: 1fr;
	}

	.be_page-hero-media {
		justify-content: center;
		padding: 0 var(--be-pad-x) 60px;
	}

	.be_page-hero-frame {
		width: min(520px, 100%);
		aspect-ratio: 4 / 3;
	}

	.be_page-hero-frame--portrait {
		width: min(420px, 100%);
		aspect-ratio: 665 / 712; /* the portrait keeps the homepage hero frame */
	}

	.be_page-hero-aside {
		justify-content: stretch;
		padding: 0 var(--be-pad-x) 60px;
	}

	.be_page-hero-panel {
		width: 100%;
	}
}

@media (max-width: 700px) {
	.be_page-hero-body {
		gap: 20px;
		padding-top: 32px;
		padding-bottom: 32px;
	}

	.be_page-hero-title {
		font: 400 30px/36px var(--be-font); /* Figma "H1 Mobile" */
		color: var(--be-ink);
	}

	.be_page-hero-text {
		padding: 20px 0;
		font: 400 18px/24px var(--be-font);
	}

	.be_page-hero-media,
	.be_page-hero-aside {
		padding-bottom: 20px;
	}

	.be_page-hero-panel {
		padding: 20px;
	}

	.be_page-hero-panel-title {
		margin-bottom: 12px;
		font: 400 24px/30px var(--be-font);
	}

	.be_breadcrumb {
		font-size: 14px;
	}

	.be_contact-quick {
		gap: 12px;
		font-size: 16px;
	}
}


/* 10. Content: the article body styles live in assets/css/article.css (article layout only). */


/* 11. Reduced motion ------------------------------------------------------
   Visitors who ask the system for less motion get every state change at once
   (hover fades, sticky bar slide-in, reveals); main.js skips its own animations. */
@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}

/* Laptop fix (Oct 2026): footer logos shrink to fit the brand column instead of overflowing into column 2 */
.be_footer-logo {
	max-width: 100%;
}

.be_footer-logo-main {
	flex: 0 1 290px;
	min-width: 0;
	width: auto;
	height: auto;
}

.be_footer-logo-life {
	flex: 0 0 auto;
	width: clamp(64px, 28%, 114px);
	height: auto;
}