/*
Theme Name: ADReS Now Blocks
Theme URI: https://www.adresnow.com/
Description: Full block (Gutenberg / Site Editor) theme for ADReS Now. Child of Twenty Twenty-Five. Header and footer are block template parts editable in the Site Editor; pages are native Gutenberg blocks.
Author: ADReS Now
Template: twentytwentyfive
Version: 1.1.16
Requires at least: 6.6
Requires PHP: 8.1
License: GNU General Public License v2 or later
Text Domain: adresnow-blocks
*/

/* ---------- Page frame (matches adresnow.com) ---------- */
.wp-site-blocks {
	padding-bottom: 50px; /* the original ends with 50px of white below the footer */
}
.wp-site-blocks > * {
	margin-block-start: 0 !important;
	margin-block-end: 0 !important;
}
.wp-block-post-content > :first-child {
	margin-block-start: 0 !important;
}
.wp-block-post-content {
	padding-inline: 0 !important;
}

/* ---------- Fonts ---------- */
.adres-din {
	font-family: var(--wp--preset--font-family--din-medium);
}
.adres-din-bold {
	font-family: var(--wp--preset--font-family--din-bold);
	font-weight: 700;
}
.adres-roboto {
	font-family: var(--wp--preset--font-family--roboto);
}
.adres-muted {
	font-family: var(--wp--preset--font-family--roboto);
	color: #7a7a7a;
}
.adres-justify {
	text-align: justify;
}

/* ---------- Top bar (33px, gray) ---------- */
.adres-topbar {
	min-height: 33px;
	display: flex;
	align-items: center;
}
.adres-topbar > .wp-block-group {
	width: 100%;
	padding-right: 9.5px;
}
.adres-topbar p {
	margin: 0;
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.6px;
	line-height: 16px;
}
.adres-topbar a {
	color: #00671a;
	text-decoration: none;
}

/* ---------- Header (105px: 17px + 71px logo + 17px) ---------- */
.adres-header > .wp-block-group {
	padding: 17px 4px 17px 12px;
	align-items: center;
}
.adres-header .wp-block-site-logo img {
	width: 225px;
	height: auto;
	display: block;
}
.adres-nav {
	font-size: 14px;
	font-weight: 600;
	letter-spacing: 0.6px;
}
.adres-nav .wp-block-navigation-item__content {
	color: #555555;
	padding: 0 15px;
	line-height: 71px;
	text-decoration: none;
}
.adres-nav .wp-block-navigation-item__content:hover,
.adres-nav .current-menu-item > .wp-block-navigation-item__content {
	color: #00671a;
}

/* ---------- Content ---------- */
.wp-block-video {
	margin-bottom: 0;
}
.wp-block-video video {
	width: 100%;
	display: block;
}

/* Page hero images: full content width with a green centered caption. */
.adres-hero-image {
	margin-bottom: 0;
}
.adres-hero-image img {
	width: 100%;
	height: auto;
	display: block;
}
.adres-hero-image figcaption {
	color: #00671a;
	font-family: var(--wp--preset--font-family--din-medium);
	font-size: 28px;
	font-weight: 700;
	line-height: 1.8;
	text-align: center;
	margin: 0;
}

/* Image-box (image + title + text): image is 80% of the column, centered. */
.adres-image-box {
	text-align: center;
}
.adres-image-box .wp-block-image {
	margin: 0;
}
.adres-image-box .wp-block-image img {
	width: 80%;
	height: auto;
	display: block;
	margin-inline: auto;
}
.adres-image-box h3 {
	font-size: 18px;
	line-height: 1.4;
	text-align: center;
}
.adres-image-box p {
	text-align: center;
	font-family: var(--wp--preset--font-family--din-medium);
}

/* Contact icons. */
.adres-contact-item {
	align-items: center; /* icon vertically centred with its text (the original top-aligns them) */
	gap: 15px;
}
.adres-contact-item p {
	margin: 0;
}
.adres-contact-icon {
	flex: 0 0 68px;
	width: 68px;
	height: 68px;
	padding: 17px;
	box-sizing: border-box;
	color: #00671a;
}
.adres-contact-icon svg {
	width: 34px;
	height: 34px;
	stroke: #00671a;
	fill: none;
	stroke-width: 2;
	stroke-linecap: round;
	stroke-linejoin: round;
	display: block;
}

/* ---------- Footer (black, 10px padding) ---------- */
.adres-footer {
	padding: 10px 0;
}
.adres-footer .wp-block-column {
	padding: 0 10px;
}
.adres-footer p {
	margin: 0;
	font-size: 14px;
	line-height: 1.8;
}
.adres-footer a {
	color: #ffffff;
	text-decoration: none;
}
.adres-footer .wp-block-image {
	margin: 0;
}
.adres-footer .wp-block-image + p {
	margin-top: 4px;
}
.adres-footer .adres-social {
	gap: 5px;
}
.adres-footer .adres-social .wp-social-link {
	width: 38px;
	height: 38px;
	border-radius: 10%;
}
.adres-footer .adres-social .wp-social-link a {
	padding: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.adres-footer .adres-social .wp-social-link svg {
	width: 19px;
	height: 19px;
}
.adres-footer .wp-social-link-facebook {
	background-color: #3b5998 !important;
}
.adres-footer .wp-social-link-linkedin {
	background-color: #0077b5 !important;
}
.adres-footer .wp-social-link-twitter {
	background-color: #1da1f2 !important;
}
@media (max-width: 781px) {
	.adres-footer .adres-social {
		justify-content: flex-start;
	}
}

/* ---------- Carousel (native gallery, enhanced by assets/js/carousel.js) ---------- */
/* Without JavaScript: a plain horizontal scroll-snap strip. */
.wp-block-gallery.adres-carousel {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	scroll-snap-type: x mandatory;
	gap: 0;
	margin-bottom: 0;
}
.wp-block-gallery.adres-carousel > .wp-block-image {
	flex: 0 0 100% !important;
	width: 100% !important;
	margin: 0 !important;
	scroll-snap-align: start;
}
.wp-block-gallery.adres-carousel .wp-block-image img {
	width: 100%;
	height: auto;
	display: block;
}

/* With JavaScript: one slide at a time, arrows and dots. */
.wp-block-gallery.adres-carousel.is-enhanced {
	display: block;
	overflow: visible;
	position: relative;
}
.adres-carousel__viewport {
	position: relative;
	overflow: hidden;
}
.adres-carousel__track {
	display: flex;
	align-items: flex-start;
	transition-property: transform;
	transition-timing-function: ease;
	will-change: transform;
}
.adres-carousel__track > .wp-block-image {
	flex: 0 0 100% !important;
	width: 100% !important;
	margin: 0 !important;
}
.adres-carousel__arrow {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 2;
	width: 50px;
	height: 50px;
	padding: 0;
	border: 0;
	background: none;
	color: #aaaaaa;
	cursor: pointer;
	line-height: 0;
}
.adres-carousel__arrow svg {
	width: 100%;
	height: 100%;
	fill: currentColor;
}
.adres-carousel__arrow--prev {
	left: 10px;
}
.adres-carousel__arrow--next {
	right: 10px;
}
.adres-carousel.adres-nav-arrows .adres-carousel__arrow {
	width: 25px;
	height: 25px;
}
.adres-carousel.adres-nav-arrows .adres-carousel__arrow--prev {
	left: 0;
}
.adres-carousel.adres-nav-arrows .adres-carousel__arrow--next {
	right: 0;
}
.adres-carousel__dots {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 12px;
	height: 25px;
}
.adres-carousel__dot {
	width: 6px;
	height: 6px;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #000000;
	opacity: 0.2;
	cursor: pointer;
}
.adres-carousel__dot.is-active {
	opacity: 1;
}

/* ---------- Divider (1px black line, 15px above/below like the original) ---------- */
.wp-block-post-content hr.wp-block-separator {
	border: 0;
	border-top: 1px solid #000000;
	opacity: 1;
	width: 100%;
	max-width: none;
	margin-block: 5px;
}

/* Nav items butt up against each other (each has 15px padding), like the original. */
.adres-nav,
.adres-nav .wp-block-navigation__container {
	--navigation-layout-gap: 0;
	gap: 0;
}

/* Carousel images: natural size, centered (Elementor "Image Stretch" off); stretched fills the slide. */
.wp-block-gallery.adres-carousel:not(.adres-stretch) .wp-block-image {
	text-align: center;
}
.wp-block-gallery.adres-carousel:not(.adres-stretch) .wp-block-image img {
	width: auto;
	max-width: 100%;
	height: auto;
	margin-inline: auto;
}

/* Divider keeps the content width. */
.wp-block-post-content hr.wp-block-separator {
	max-width: 1118px;
	margin-inline: auto;
}

/* Beat core's gallery "is-cropped" rules: show each slide at its natural size, centered. */
.wp-block-gallery.adres-carousel:not(.adres-stretch) figure.wp-block-image {
	display: block;
	text-align: center;
}
.wp-block-gallery.adres-carousel:not(.adres-stretch) figure.wp-block-image img {
	height: auto !important;
	max-width: 100% !important;
	flex: none !important;
	object-fit: contain !important;
	margin-inline: auto;
	display: inline-block;
}
.wp-block-gallery.adres-carousel.adres-stretch figure.wp-block-image img {
	width: 100% !important;
	height: auto !important;
	object-fit: fill !important;
}

/* ---------- Spacing that mirrors Elementor's widget paddings / paragraph margins ---------- */
/* The last paragraph of a text block keeps its 20px bottom margin (it doesn't collapse into the widget gap). */
.adres-pend {
	padding-bottom: 20px;
}
/* Image-box: 3px extra under the image, 20px under the last element (title margin-bottom). */
.adres-image-box .wp-block-image {
	padding-bottom: 3px;
}
.adres-image-box > h3:last-child {
	padding-bottom: 20px;
}
/* Footer social icons sit 3px in from the column edge. */
.adres-footer .adres-social {
	margin-right: 3px;
}

/* 10px between the last content block and the footer, as in the original. */
.adres-footer {
	margin-top: 10px;
}
/* Elementor widgets with a 10px left/right margin (the What We Do carousel). */
.adres-inset-10 {
	max-width: 1098px !important;
}

/* ---------- Bullet lists: 20px indent, 15px space after, 25px lines (matches the original) ---------- */
.wp-block-post-content ul.wp-block-list,
.wp-block-post-content ol.wp-block-list {
	padding-left: 20px;
	margin-block-end: 0;
}
.wp-block-post-content .wp-block-list li {
	margin: 0;
	padding: 0;
}
.wp-block-post-content .wp-block-list + * {
	margin-block-start: 15px !important;
}
/* Arrow-only carousels sit 23px above the vertical centre (as on the original What We Do banner). */
.adres-carousel.adres-nav-arrows .adres-carousel__arrow {
	top: calc(50% - 23px);
}

/* ---------- Team cards (Who We Are): name + 20px LinkedIn icon, role below ---------- */
.adres-team-head {
	align-items: flex-start;
}
.adres-team-head h4 {
	font-family: var(--wp--preset--font-family--din-medium);
	line-height: 1.4;
	margin: 0;
}
.adres-team-head .wp-block-social-links {
	margin: 0;
}
.adres-team-head .wp-social-link {
	color: #6ec1e4;
}
.adres-team-head .wp-social-link a {
	padding: 0;
}
.adres-team-head .wp-social-link svg {
	width: 20px;
	height: 20px;
}

/* ---------- Text pieces from Word-style content ---------- */
.adres-brline {
	margin: 0;
}
.adres-cont {
	margin-block-start: 0 !important;
}

/* ---------- Contact form (WPForms 2.x restyled to the original look) ---------- */
div.wpforms-container-full {
	margin: 45px 21px !important;
	max-width: none !important;
	width: auto !important;
}
div.wpforms-container-full .wpforms-form input[type="text"],
div.wpforms-container-full .wpforms-form input[type="email"],
div.wpforms-container-full .wpforms-form input[type="tel"],
div.wpforms-container-full .wpforms-form input[type="number"],
div.wpforms-container-full .wpforms-form select {
	height: 40px !important;
	font-size: 16px !important;
}
div.wpforms-container-full .wpforms-form .wpforms-submit-container button.wpforms-submit,
div.wpforms-container-full .wpforms-form button[type="submit"].wpforms-submit {
	background-color: #007a99 !important;
	color: #ffffff !important;
	border: 0.8px solid #007a99 !important;
	border-radius: 0 !important;
	font-family: var(--wp--preset--font-family--open-sans) !important;
	font-size: 14px !important;
	font-weight: 600 !important;
	line-height: 16.8px !important;
	padding: 14px 20px !important;
	height: auto !important;
}
div.wpforms-container-full .wpforms-form button[type="submit"].wpforms-submit:hover {
	background-color: #006783 !important;
}

/* Column widths are exact percentages (padding included), like Elementor's columns. */
.wp-block-post-content .wp-block-column {
	box-sizing: border-box;
}

/* ---------- Learn More / Contact refinements ---------- */
/* Divider: a 31px box with a 0.8px black line in the middle (15px above/below), as in the original. */
.wp-block-post-content hr.wp-block-separator {
	height: 31px;
	border: 0;
	background: linear-gradient(#000000, #000000) center / 100% 0.8px no-repeat;
	margin-block-start: 20px;
	margin-block-end: 0;
	opacity: 1;
}
/* Carousel with dots keeps 5px under the pagination. */
.adres-carousel__dots {
	box-sizing: border-box;
	height: 30px;
	padding-bottom: 5px;
}
/* Section with a faint background picture + border (Contact): image at 8% opacity, tinted, in a groove border. */
.adres-overlay-section {
	min-height: 0 !important;
	padding: 0 !important;
	align-items: stretch !important;
	justify-content: flex-start !important;
}
.adres-overlay-section.adres-bordered {
	border: 0.8px groove #555555;
}
.adres-overlay-section .wp-block-cover__background {
	opacity: 0.92 !important;
}
.adres-overlay-section .wp-block-cover__image-background {
	filter: hue-rotate(250deg) brightness(0.84) contrast(0.94);
}
.adres-overlay-section .wp-block-cover__inner-container {
	width: 100%;
	max-width: none;
	color: inherit;
}
/* Pages whose original footer has no "Contact Us" link. */
.adres-footer-no-contact .adres-footer a[href$="/contact-us/"] {
	display: none;
}

/* Video box is always 16:9 (as Elementor's wrapper), whether it shows a poster or the first frame. */
.wp-block-video video {
	aspect-ratio: 16 / 9;
	height: auto;
	object-fit: contain;
	background: #000000;
}
.wp-block-post-content .wp-block-list li {
	font-weight: inherit;
}

/* ---------- Menu: keep the original look in the block editor too ----------
   The editor loads its own default menu styles after this file, so restate the key values with
   higher specificity (desktop only; the small-screen overlay menu keeps WordPress' own layout). */
@media (min-width: 600px) {
	.wp-block-navigation.adres-nav {
		font-size: 14px !important;
		font-weight: 600 !important;
		letter-spacing: 0.6px !important;
	}
	.wp-block-navigation.adres-nav .wp-block-navigation__container {
		gap: 0 !important;
		justify-content: flex-end;
	}
	.wp-block-navigation.adres-nav .wp-block-navigation-item__content {
		padding: 0 15px !important;
		line-height: 71px;
	}
}