/*
 * Alfa Constructions — design tokens and site CSS.
 *
 * WHERE THIS CAME FROM
 * Migrated (Nov 2026) out of the WordPress Customizer's "Additional CSS"
 * (wp_custom_css post 6418, 10,088 bytes). That CSS lived only in the database:
 * unversioned, invisible to anyone reading the theme, and larger than the whole
 * child theme on disk. The Customizer field is now empty and points here.
 *
 * THREE SELECTOR BUGS WERE FIXED ON MIGRATION
 * Each was a misplaced comma that silently turned a scoped rule into a global
 * one. They are marked "BUG FIX" below with the original text, because fixing
 * them changes rendering site-wide and that change should be traceable.
 *
 * CONVENTION
 * The asset CDN serves theme CSS with no version string and caches it for a
 * long time, so changing this file means bumping its name (-v3, -v4, ...) and
 * the enqueue in functions.php. Same convention as ac-elements-v2.css.
 */

/* ===================================================================
 * Tokens
 * =================================================================== */

:root {
	/* Brand.
	   --ac-olive is the fill. It measures 3.41:1 on white, which clears the 3:1
	   bar for large text, fills and graphics but fails the 4.5:1 bar for body
	   text, so it must not carry 14-16px copy.
	   --ac-olive-ink is the text-safe companion: 6.69:1 on white, and 6.69:1
	   under white text, so it works as ink and as a filled background. */
	--ac-olive: #7b953c;
	--ac-olive-ink: #4f6320;
	--ac-olive-hover: #637732;

	/* Neutrals */
	--ac-ink: #2b2b2b;
	--ac-white: #ffffff;
	--ac-grey-mid: #444444;
	--ac-grey-soft: #cccccc;
	--ac-grey-wash: #f7f7f7;
	--ac-footer-bg: #111111;

	/* Type scale, as the site actually uses it. */
	--ac-text-sm: 14px;
	--ac-text-base: 16px;
	--ac-text-lg: 22px;
	--ac-text-xl: 28px;

	/* Reading measure. Expressed in rem, NOT ch: `ch` resolves against the
	   font-size of the element it is used on, so 68ch on a 28px heading is
	   1089px while 68ch on 16px body copy is 622px — capped blocks would not
	   line up with each other.
	   NOTE the root here is 10px (this theme sets html{font-size:10px}), not
	   the usual 16px, so 1rem = 10px. 62.2rem is 622px, which is 68ch of
	   16px Open Sans (1ch measures 9.14px). If the root size ever changes,
	   this number has to change with it. */
	--ac-measure: 62.2rem;

	/* Spacing */
	--ac-space-sm: 20px;
	--ac-space-md: 30px;
	--ac-space-lg: 40px;
}

/* ===================================================================
 * Γενικά Στυλ & Διορθώσεις Plugin
 * =================================================================== */

/* Στυλ για τα στοιχεία λίστας του Contact Form 7 */
span.wpcf7-list-item {
	display: inline-block;
	padding-right: 5px;
}

.single-page-section { margin-top: 35px; }

.navbar-nav li.drop ul.dropdown li a { text-align: left; }
.navbar-nav li.drop ul.dropdown li a:hover {
	background-color: var(--ac-olive);
	color: var(--ac-white);
}
.navbar-nav li.drop ul.dropdown li.active > a {
	background-color: var(--ac-olive);
	color: var(--ac-white) !important;
}

.blog-section .blog-box .blog-post img { width: 100%; }

/* Γενικό στυλ για όλους τους συνδέσμους (links).
   The colour stays as the brand olive it has always been. Note it is 3.41:1 on
   white, so inline body links do not meet WCAG AA for normal text; switching
   this to var(--ac-olive-ink) would fix that, but it is a visible brand change
   and is deliberately left as a decision rather than made here. */
a {
	color: var(--ac-olive);
	text-decoration: none !important;
}

/* Απόκρυψη του κουμπιού εναλλαγής μενού (hamburger icon) σε desktop */
.navbar-toggle { display: none; }

/* Κουμπί υποβολής του Contact Form 7 να πιάνει όλο το πλάτος */
.wpcf7-submit { width: 100%; }

/* Γενικό στυλ για τις ετικέτες (labels) φορμών */
label {
	display: inline-block;
	max-width: 100%;
	margin-bottom: 5px;
	font-weight: 700;
	width: 100% !important;
}

/* Κρύβει το "Log In" link του WordPress στο header.
   Was `.top-line p a {display:none!important}`, which hid EVERY link in the
   top bar — including the phone number once it became a tel: link, which then
   needed its own counter-rule to undo. Scoped to the login link itself, so the
   phone link needs no exception. */
.top-line p a[href*="wp-login"] { display: none !important; }

/* Στοχεύει μόνο τις σελίδες που είναι 'single portfolio' */
.single-portfolio .wpb_single_image img {
	max-width: 100%;
	object-fit: contain;
	height: 600px;
}

.vc_empty_space { display: none; }

/* Change share buttons colour */
.single-page-section .project-content-box ul li span { color: var(--ac-white); }

/* ===================================================================
 * Αλλαγή Σειράς Τίτλου & Εικόνας στις Σελίδες Έργων (Portfolio)
 * =================================================================== */

.single-portfolio .project-content-box {
	display: flex;
	flex-direction: column;
}
.single-portfolio .project-content-box > .vc_row:first-of-type { order: 1; }
.single-portfolio .project-content-box > h1.project-title { order: 2; }
.single-portfolio .project-content-box > .vc_row:not(:first-of-type) { order: 3; }
#dpsp-content-bottom { order: 4; }
.single-page-section .dpsp-share-text { order: 5; }

/* ===================================================================
 * Στυλ για την ενότητα του Blog
 * =================================================================== */

.blog-section .blog-box .blog-post { margin-bottom: var(--ac-space-lg); }

/* BUG FIX 1 — was:
 *   .blog-section .blog-box .blog-post h2, a { ... }
 * The bare `a` applied display:inline-block, text-align:center, font-size:1.3em
 * and line-height:1.2 to EVERY link on the site. Body links measurably rendered
 * centred at 1.2 leading before this fix (verified in-browser).
 * NOTE: an earlier analysis attributed the detector's tight-leading findings to
 * this rule. That was wrong — a real-browser scan puts them on .wpb_text_column,
 * span.citation and blockquote > p, none of which are links, and the counts are
 * unchanged by this fix.
 * Now scoped to the blog-post heading it was written for. */
.blog-section .blog-box .blog-post h2 {
	display: inline-block;
	text-decoration: none;
	transition: all .2s ease-in-out;
	text-transform: none;
	text-align: center;
	font-size: 1.3em;
	font-weight: 400;
	line-height: 1.2;
}

/* BUG FIX 2 — was:
 *   .blog-section .blog-box .blog-post p, a, li {font-size:14px;}
 * The bare `a` and `li` forced EVERY link and list item site-wide to 14px,
 * including navigation, footer menus and bullet lists in body copy. It also
 * meant inline body links were charged against the 4.5:1 contrast bar for
 * normal text rather than the 3:1 large-text bar. Now scoped. */
.blog-section .blog-box .blog-post:not(.single-post) p,
.blog-section .blog-box .blog-post:not(.single-post) a {
	font-size: var(--ac-text-sm);
}
/* `li` is deliberately NOT included. The original rule's bare `li` never won
   against the theme's own 16px rule, so list items rendered at 16px; scoping it
   here would have made them 14px — a change the original never actually had,
   and the wrong direction for reading. */

/* Brand button.
 * Was an override of WPBakery's "juicy-pink" preset to olive, which meant an
 * editor had to pick "juicy pink" in the page builder to get a brand button,
 * and anyone picking a different preset got an off-brand colour. The preset
 * override is kept so existing pages do not change, but .ac-btn is the one to
 * use from here on. White on --ac-olive-ink is 6.69:1; white on the old
 * --ac-olive was 3.41:1 and failed AA for button text. */
.ac-btn,
.vc_btn3.vc_btn3-color-juicy-pink,
.vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat {
	background-color: var(--ac-olive);
}
.ac-btn:hover,
.vc_btn3.vc_btn3-color-juicy-pink:hover,
.vc_btn3.vc_btn3-color-juicy-pink.vc_btn3-style-flat:hover {
	background-color: var(--ac-olive-hover);
}
.ac-btn {
	display: inline-block;
	padding: 14px 28px;
	background-color: var(--ac-olive-ink);
	color: var(--ac-white) !important;
	font-size: var(--ac-text-base);
	font-weight: 600;
	line-height: 1.2;
	border: 0;
}

.blog-section .blog-box .blog-post h4 {
	color: var(--ac-olive);
	line-height: 1.4;
}

.blog-section .blog-box .single-post h1,
.project-title {
	text-transform: none;
	font-weight: 500;
	font-size: var(--ac-text-xl);
	color: var(--ac-olive);
	text-align: left;
	margin-bottom: var(--ac-space-sm);
}

/* Εφαρμόζουμε το στυλ τόσο στην ενότητα "Νέα" της αρχικής σελίδας
 * όσο και στη σελίδα του blog. */
.news-section .news-post p,
.blog-section .blog-box .single-post p {
	overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
}

/* ...but never the article body. The rule above is an excerpt clamp, and its
   `.single-post p` arm also matched the paragraphs inside .post-content-text —
   the actual article — so every blog post rendered 3 lines per paragraph with
   an ellipsis and roughly two thirds of its text hidden. That predates this
   file (the rule is migrated verbatim from the Customizer), but capping the
   measure made it much more visible, since 3 lines now hold far less text.
   Scoped to body.single-post, which WordPress sets only on a single post, so
   blog index and homepage news cards keep their excerpt clamp. */
/* The selector is long on purpose: the excerpt rule above is
   (0,3,1), so this must out-rank it on specificity rather than rely on
   source order. This chain is (0,5,2). */
body.single-post .blog-section .blog-box .single-post .post-content-text p {
	overflow: visible;
	text-overflow: clip;
	display: block;
	-webkit-line-clamp: none;
}

.blog-section .blog-box .blog-post ul.post-tags li a {
	font-size: var(--ac-text-sm);
	color: var(--ac-olive);
}

/* ===================================================================
 * Στυλ για το Υποσέλιδο (Footer)
 * =================================================================== */

/* BUG FIX 3 — was:
 *   .footer-widget .acceptance-row a, h4 { color:#fff; text-decoration:underline }
 * The bare `h4` made EVERY h4 on the site white and underlined. Most homepage
 * h4s carry an inner coloured span that masked the colour, but text-decoration
 * propagates to descendants and cannot be undone by a child's colour, so those
 * section headings rendered underlined. The "Privacy Overview" h4 in the cookie
 * modal rendered white on a light background. Now scoped to the footer link. */
.footer-widget .acceptance-row a {
	color: var(--ac-white);
	text-decoration: underline;
}

/* Headings in the dark footer. These were white only as a side effect of the
   bare `h4` in BUG FIX 3 above; scoping that rule left "Λάβετε Ιδέες &
   Προσφορές" at the inherited #0c0c0c on the #111111 footer — 1.0:1, invisible.
   Declared properly here, white on --ac-footer-bg is 18.9:1. They are headings,
   so unlike the acceptance link they carry no underline. */
footer .up-footer h4,
.footer-widget h4 {
	color: var(--ac-white);
}
.footer-widget .acceptance-row a:hover { color: var(--ac-grey-soft); }
.footer-widget .acceptance-row .wpcf7-response-output { color: var(--ac-white); }

footer .up-footer { background-color: var(--ac-footer-bg); }

/* Χρώμα συνδέσμων για τα widgets στο footer */
.widget_recent_entries ul li a,
.widget_categories ul li a,
.widget_nav_menu ul li a {
	color: var(--ac-white);
}

footer .up-footer p { color: var(--ac-white) !important; }

/* ===================================================================
 * Στυλ για την Πλοήγηση (Navigation Bar)
 * =================================================================== */

/* Κρύβει την ενότητα του banner της σελίδας.
   NOTE: this also hides koncecpt_breadcrumb(), which is rendered inside
   .page-banner-section — so service, blog and project pages have no breadcrumb
   and no "you are here". Left as-is: restoring it is a design decision. */
.page-banner-section {
	padding: 0;
	display: none !important;
}

/* Ειδικό στυλ για το στοιχείο μενού #menu-item-3849 (ΕΡΓΑ) */
#menu-item-3849 a { color: var(--ac-grey-mid) !important; }
#menu-item-3849 a:hover {
	color: var(--ac-olive) !important;
	background: var(--ac-grey-wash) !important;
}

/* ===================================================================
 * Διάφορες Διορθώσεις & Κανόνες
 * =================================================================== */

/* Απόκρυψη συγκεκριμένου στοιχείου στο header */
header a.elemadded { display: none; }

/* NOTE: this is why no blog post shows a date — one line, hiding every
   published date on the site. Left as-is: showing dates again is a content
   decision, but it is the cause of the "44 undated articles" problem. */
.post-date { display: none; }

/* Override για το πλάτος της στήλης .col-md-9 (πιθανόν από Bootstrap) */
.col-md-9 {
	width: 100%;
	display: block;
	position: relative;
	margin-top: var(--ac-space-md);
	padding-left: var(--ac-space-md);
	padding-right: var(--ac-space-md);
}

/* Στυλ για το slogan στο banner */
.banner-slogan {
	font-size: 24px;
	line-height: 1.1;
}

/* ===================================================================
 * Responsive Στυλ για Tablet & Κινητά
 * =================================================================== */

@media only screen and (max-width: 1024px) {
	.top-line,
	.top-line ul.social-icons { display: none; }

	.single-page-section {
		margin-top: 0;
		padding: 0 5%;
		max-width: 100vw;
	}

	/* Στοχεύει μόνο τις σελίδες που είναι 'single portfolio' */
	.single-portfolio .wpb_single_image img {
		width: 100vw;
		object-fit: contain;
		max-width: 100vw;
		margin-left: calc(50% - 50vw);
		height: 400px;
	}

	#container > header > nav > div.container { max-width: 100vw; }

	.vc_custom_1644245664748 { display: none; }

	.blog-section .blog-box .single-post h1 {
		font-size: var(--ac-text-lg);
		text-align: center;
	}
}

.navbar-brand > img { max-height: 120px; padding: 0; }
.navbar-right { margin-top: var(--ac-space-md); }

/* The five separate max-width:768px blocks this replaced were applied in this
   order and fought over the same properties. Declarations are kept in their
   original order so the resolved values are unchanged; the ones that never win
   are marked. Resolved on a phone today: logo max-height 70px (the
   .navbar-brand > img rule outranks every `header img` rule on specificity),
   max-width 120px, margin-top -5px; header padding 2px 12px 6px. */
@media only screen and (max-width: 768px) {
	.navbar-brand > img {
		max-height: 70px !important;
		width: auto !important;
		padding: 0 !important;
	}
	.navbar-brand {
		padding-top: 10px !important;
		padding-bottom: 10px !important;
	}
	.navbar-right { margin-top: 10px !important; }
	.navbar-toggle {
		display: block !important;
		margin-top: 18px !important;
	}
}

@media (max-width: 768px) {
	header img {
		max-width: 120px !important;
		max-height: 55px !important; /* overridden below by 50px */
		height: auto !important;
		width: auto !important;
		margin-top: -10px !important; /* overridden below by -5px */
	}

	header {
		min-height: auto !important;
		padding: 8px 12px !important; /* top/bottom overridden below */
	}

	.site-header,
	header {
		padding-top: 2px !important;
		padding-bottom: 6px !important;
	}

	header img { margin-top: -5px !important; }

	header img {
		max-height: 50px !important;
		width: auto !important;
	}

	/* Βγάζει το header από overlay */
	header,
	.site-header,
	.header-wrapper {
		position: relative !important;
		background: var(--ac-white) !important;
		z-index: 999 !important;
	}

	/* Κατεβάζει το slider */
	.rev_slider_wrapper,
	.smart-slider { margin-top: 90px !important; }
}

/* ===================================================================
 * Typography
 *
 * Added Nov 2026. Three problems, all measured before the change:
 *   - Body copy ran 123-142 characters per rendered line at 1440px against a
 *     comfortable maximum near 70. The detector's line-length rule was the
 *     single most frequent finding on the site.
 *   - body{line-height:21px} on 16px is 1.31. Greek carries τόνοι and
 *     διαλυτικά above the x-height (ά έ ή ί ό ύ ώ ϊ ϋ), so tight leading
 *     crowds the accents into the descenders of the line above.
 *   - The article body rendered smaller than the homepage marketing copy:
 *     reading type set smaller than selling type.
 * =================================================================== */

/* Reading measure. max-width only ever constrains, so columns already narrower
   than this are untouched — in practice only full-width rows are affected.
   The blocks are centred so that a capped block in a wide row does not sit
   against the left edge while its text is centred inside it. */
.wpb_text_column,
.post-content-text,
.project-content-box > p {
	max-width: var(--ac-measure);
	margin-inline: auto;
}

/* Leading for Greek body copy. Set on the reading elements rather than on
   body, so buttons, navigation and other tight UI keep their own values. An
   element's own declaration beats an inherited one, so no !important is needed
   against the theme's inline body{line-height:21px}. */
p,
li,
blockquote,
dd {
	line-height: 1.6;
}

/* Article body back to 16px. .post-content-text is the article itself
   (single.php line 41); blog index cards keep the smaller size. */
.post-content-text p,
.post-content-text li {
	font-size: var(--ac-text-base);
}

/* Line breaking. Capping the measure above shortened every line, which made
   orphans and lopsided heading wraps more visible — the detector's straggler
   and unbalanced-heading counts both rose when the cap landed. These two
   properties are the fix for exactly that, and they degrade to normal wrapping
   in browsers that do not support them.
     balance — evens out the lines of a short block (headings)
     pretty  — avoids leaving a single short word on the last line */
h1, h2, h3, h4, h5, h6,
.project-title,
.banner-slogan {
	text-wrap: balance;
}

p,
li,
blockquote {
	text-wrap: pretty;
}


/* ===================================================================
 * Portfolio
 *
 * The index is a WPBakery basic grid using the built-in
 * "basicGrid_NoAnimation" item template: the photo is zone-a, and the project
 * name and date sit in zone-b, an absolutely positioned overlay at opacity 0
 * that only appears on hover. The detector measured 77% of the page's text
 * (6,960 of 9,013 characters) hidden at rest, and a touch device never fires
 * hover at all — so on a phone the neighbourhood names, which are the most
 * persuasive thing on the page, were simply unreachable.
 *
 * This turns zone-b from a hover overlay into a caption that always sits under
 * its tile. The !important flags are unavoidable rather than lazy: WPBakery
 * writes the heading colour and size as inline style attributes on the
 * elements themselves, which nothing but !important can override.
 * =================================================================== */

/* Only grids whose zone-b actually carries a post title become captions. The
   homepage project carousel uses the same markup with an EMPTY zone-b — it is
   purely a hover-darkening layer — and treating that as a caption left a 28px
   dead strip under each of its six tiles. :has() keeps the rule where the
   content is; where it is unsupported, zone-b simply stays a hover overlay,
   which is the behaviour this replaces. */
.vc_grid-item .vc_gitem-animated-block:has(.vc_gitem-zone-b .vc_gitem-post-data-source-post_title) {
	height: auto !important;
}

.vc_grid-item .vc_gitem-zone-b:has(.vc_gitem-post-data-source-post_title) {
	position: static !important;
	opacity: 1 !important;
	height: auto !important;
	/* the template's 30% black scrim belongs on an overlay, not a caption */
	background-color: transparent !important;
	background-image: none !important;
	padding: 10px 2px 4px;
}

/* Zone-b carried an aspect-ratio spacer (::before with padding-top equal to the
   photo's height) so that, as an overlay, it covered zone-a exactly. As a
   caption that spacer is 458px of empty space above the text, so it goes.
   Zone-a keeps its own spacer, which is what gives the photo its box. */
.vc_grid-item .vc_gitem-zone-b:has(.vc_gitem-post-data-source-post_title)::before {
	display: none !important;
	padding-top: 0 !important;
}

/* The caption's own link layer would otherwise cover the text. */
.vc_grid-item .vc_gitem-zone-b:has(.vc_gitem-post-data-source-post_title) > a.vc_gitem-link {
	display: none !important;
}

.vc_grid-item .vc_gitem-zone-b:has(.vc_gitem-post-data-source-post_title) .vc_gitem_row,
.vc_grid-item .vc_gitem-zone-b:has(.vc_gitem-post-data-source-post_title) .vc_gitem-zone-mini {
	position: static !important;
	transform: none !important;
}

/* Project name: readable ink on the page, not white on a photo. */
.vc_grid-item .vc_gitem-zone-b .vc_gitem-post-data-source-post_title h3 {
	color: var(--ac-ink) !important;
	font-size: 17px !important;
	line-height: 1.35 !important;
	text-align: left !important;
	margin: 0 !important;
	font-weight: 500 !important;
}

/* The date is the WordPress publish date, not the date of the work, so it
   tells the visitor nothing and competes with the name. */
.vc_grid-item .vc_gitem-zone-b .vc_gitem-post-data-source-post_date {
	display: none !important;
}

/* ---- Single project page ---- */

/* The navbar is position:fixed and 168px tall on desktop, but this template
   started its content at 100px — so the top ~68px of every project page sat
   behind the header. That predates the breadcrumb below; it was simply
   invisible when the first thing in the flow was a photo whose top edge nobody
   missed. Only desktop needs this: the Customizer CSS makes the header
   position:relative under 768px. */
@media (min-width: 768px) {
	body.single-portfolio .single-page-section {
		padding-top: 150px;
	}
}

/* Align the project title with the body copy under it. Paragraphs are capped
   to 68ch and centred, so a full-width heading starts 270px to their left. */
.single-portfolio h1.project-title {
	/* width:100% is required, not redundant: .project-content-box is a flex
	   column, and margin-inline:auto on a flex item cancels the default stretch,
	   which shrink-wrapped the heading to its text and left it 100px off the
	   body copy it heads. */
	width: 100%;
	max-width: var(--ac-measure);
	margin-inline: auto;
}


.ac-breadcrumb {
	margin: 0 0 24px;
	font-size: var(--ac-text-sm);
}
.ac-breadcrumb ul,
.ac-breadcrumb #breadcrumbs {
	list-style: none;
	margin: 0;
	padding: 0;
}
.ac-breadcrumb li {
	display: inline;
	line-height: 1.5;
}
.ac-breadcrumb li + li::before {
	content: "›";
	margin: 0 8px;
	color: #767676;
}
.ac-breadcrumb a { color: var(--ac-olive-ink); }

.ac-project-cta {
	max-width: var(--ac-measure);
	margin: 48px auto 0;
	padding: 28px var(--ac-space-md);
	background: var(--ac-grey-wash);
	text-align: center;
}
.ac-project-cta__title {
	margin: 0 0 8px;
	font-size: var(--ac-text-lg);
	line-height: 1.25;
	color: var(--ac-ink);
}
.ac-project-cta__text {
	margin: 0 0 var(--ac-space-sm);
	color: var(--ac-ink);
}
.ac-project-cta__actions {
	display: flex;
	flex-wrap: wrap;
	gap: 14px var(--ac-space-sm);
	align-items: center;
	justify-content: center;
	margin: 0;
}
.ac-project-cta__secondary {
	color: var(--ac-olive-ink);
	font-weight: 500;
}

.ac-project-nav {
	display: flex;
	flex-wrap: wrap;
	gap: var(--ac-space-sm);
	max-width: var(--ac-measure);
	margin: var(--ac-space-md) auto 0;
	padding-top: var(--ac-space-sm);
	border-top: 1px solid #e3e3e3;
}
.ac-project-nav__link {
	flex: 1 1 240px;
	min-height: 44px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 2px;
	color: var(--ac-ink) !important;
}
.ac-project-nav__link--next { text-align: right; }
.ac-project-nav__label {
	font-size: 13px;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: #6b6b6b;
}
.ac-project-nav__title {
	color: var(--ac-olive-ink);
	font-weight: 500;
	line-height: 1.35;
}
.ac-project-nav__link:hover .ac-project-nav__title { text-decoration: underline !important; }

@media (max-width: 600px) {
	.ac-project-nav__link,
	.ac-project-nav__link--next { text-align: left; }
}
