/*
Theme Name: Ecocore Basic
Theme URI: https://example.com/ecocore-basic
Author: Shortstop Creative
Description: A lightweight full-site editing theme for Ecocore Solutions Ltd., built around a dark industrial palette, Bebas Neue headlines, Inter body text, and angular technical graphics.
Version: 1.1.0
Requires at least: 6.4
Tested up to: 6.8
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ecocore-basic
Tags: block-patterns, full-site-editing, custom-colors, custom-logo, wide-blocks
*/

:root {
  --ecocore-green: #5faf34;
  --ecocore-dark-green: #3e8125;
  --ecocore-orange: #f39a1c;
  --ecocore-charcoal: #171717;
  --ecocore-off-black: #0d1112;
  --ecocore-white: #ffffff;
  --ecocore-light-grey: #e9e9e9;
  --ecocore-medium-grey: #7a7a7a;
}

html { scroll-behavior: smooth; }
body { text-rendering: optimizeLegibility; padding:0; margin:0; }

.wp-site-blocks { overflow: hidden; }

h1, h2, h3, h4, h5, h6,
.wp-block-post-title,
.ecocore-display {
  font-family: "Bebas Neue", Impact, sans-serif;
  font-weight: 400;
  letter-spacing: .025em;
}

a { text-underline-offset: .18em; }

.ecocore-eyebrow {
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .18em;
  text-transform: uppercase;
}

.ecocore-angle-line {
  position: relative;
  min-height: 3px;
  background: linear-gradient(90deg, var(--ecocore-green), transparent 76%);
}

.ecocore-angle-line::before {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 86px;
  height: 3px;
  background: var(--ecocore-green);
  transform: translateX(-64px) rotate(-45deg);
  transform-origin: right center;
}

.ecocore-grid {
  background-image: radial-gradient(circle at center, rgba(95,175,52,.38) 1.25px, transparent 1.5px);
  background-size: 22px 22px;
}

.ecocore-topography {
  background-image:
    repeating-radial-gradient(ellipse at 15% 20%, transparent 0 14px, rgba(255,255,255,.07) 15px 16px, transparent 17px 27px),
    repeating-radial-gradient(ellipse at 90% 80%, transparent 0 18px, rgba(95,175,52,.10) 19px 20px, transparent 21px 34px);
}

.ecocore-card {
  border-top: 3px solid var(--ecocore-green);
  transition: transform .2s ease, border-color .2s ease;
}

.ecocore-card:hover {
  transform: translateY(-4px);
  border-top-color: var(--ecocore-orange);
}

.ecocore-hero {
  position: relative;
  isolation: isolate;
}

.ecocore-hero::after {
  content: "";
  position: absolute;
  z-index: -1;
  right: -7vw;
  bottom: -3rem;
  width: min(46vw, 620px);
  aspect-ratio: 1;
  border: 2px solid rgba(95,175,52,.35);
  clip-path: polygon(25% 0, 100% 0, 100% 75%, 75% 100%, 0 100%, 0 25%);
  transform: rotate(8deg);
}

.wp-block-button__link {
  transition: transform .15s ease, filter .15s ease;
}

.wp-block-button__link:hover {
  transform: translateY(-2px);
  filter: brightness(1.08);
}

@media (max-width: 781px) {
  .ecocore-hero::after { opacity: .45; width: 80vw; }
}

/* --------------------------------------------------------------------------
   Ecocore Gutenberg block styles
   -------------------------------------------------------------------------- */

/* Buttons: the unstyled/default Button block remains the primary green button. */
.wp-block-button .wp-block-button__link {
  border: 2px solid var(--ecocore-green);
  border-radius: 4px;
  background: var(--ecocore-green);
  color: var(--ecocore-off-black);
  font-family: Inter, sans-serif;
  font-size: .88rem;
  font-weight: 700;
  letter-spacing: .07em;
  line-height: 1.2;
  padding: .9rem 1.35rem;
  text-transform: uppercase;
}

.wp-block-button.is-style-ecocore-outline .wp-block-button__link {
  background: transparent;
  border-color: currentColor;
  color: var(--ecocore-white);
}

.wp-block-button.is-style-ecocore-orange .wp-block-button__link {
  background: var(--ecocore-orange);
  border-color: var(--ecocore-orange);
  color: var(--ecocore-off-black);
}

.wp-block-button.is-style-ecocore-arrow .wp-block-button__link {
  align-items: center;
  display: inline-flex;
  gap: .8rem;
}

.wp-block-button.is-style-ecocore-arrow .wp-block-button__link::after {
  content: "→";
  font-size: 1.15em;
  line-height: 1;
  transition: transform .15s ease;
}

.wp-block-button.is-style-ecocore-arrow .wp-block-button__link:hover::after {
  transform: translateX(.25rem);
}

.wp-block-button.is-style-ecocore-ghost .wp-block-button__link {
  background: transparent;
  border-color: transparent;
  color: var(--ecocore-green);
  padding-inline: 0;
}

.wp-block-button.is-style-ecocore-ghost .wp-block-button__link::after {
  content: "→";
  margin-left: .65rem;
}

/* Image and Cover styles. */
.wp-block-image.is-style-ecocore-angled img,
.wp-block-cover.is-style-ecocore-angled,
.wp-block-cover.is-style-ecocore-angled .wp-block-cover__image-background,
.wp-block-cover.is-style-ecocore-angled .wp-block-cover__video-background {
  clip-path: polygon(0 0, 100% 0, 100% 100%, 12% 100%);
}

.wp-block-image.is-style-ecocore-angled-right img,
.wp-block-cover.is-style-ecocore-angled-right,
.wp-block-cover.is-style-ecocore-angled-right .wp-block-cover__image-background,
.wp-block-cover.is-style-ecocore-angled-right .wp-block-cover__video-background {
  clip-path: polygon(0 0, 100% 0, 88% 100%, 0 100%);
}

.wp-block-image.is-style-ecocore-rounded img {
  border-radius: 12px;
}

/* Group section styles. */
.wp-block-group.is-style-ecocore-section {
  padding-block: clamp(3rem, 7vw, 7rem);
}

.wp-block-group.is-style-ecocore-dark-section {
  background: var(--ecocore-off-black);
  color: var(--ecocore-white);
  padding-block: clamp(3rem, 7vw, 7rem);
}

.wp-block-group.is-style-ecocore-patterned-section {
  background-color: var(--ecocore-off-black);
  background-image:
    radial-gradient(circle at center, rgba(95,175,52,.26) 1.2px, transparent 1.4px),
    repeating-radial-gradient(ellipse at 20% 30%, transparent 0 22px, rgba(255,255,255,.04) 23px 24px, transparent 25px 38px);
  background-size: 24px 24px, auto;
  color: var(--ecocore-white);
  padding-block: clamp(3rem, 7vw, 7rem);
}

.wp-block-group.is-style-ecocore-bordered-section {
  border-block: 1px solid rgba(95,175,52,.45);
  padding-block: clamp(3rem, 7vw, 7rem);
}

/* Bottom-right dot treatment for hero/header Groups and Covers. */
.wp-block-group.is-style-ecocore-header-dots,
.wp-block-cover.is-style-ecocore-header-dots {
  isolation: isolate;
  overflow: hidden;
  position: relative;
}

.wp-block-group.is-style-ecocore-header-dots::after,
.wp-block-cover.is-style-ecocore-header-dots::after {
  background-image: radial-gradient(circle, rgba(95,175,52,.82) 1.5px, transparent 1.8px);
  background-size: 18px 18px;
  bottom: 0;
  content: "";
  height: 150px;
  mask-image: linear-gradient(135deg, transparent 8%, #000 62%);
  opacity: .8;
  pointer-events: none;
  position: absolute;
  right: 0;
  width: min(34vw, 360px);
  z-index: 1;
}

.wp-block-group.is-style-ecocore-header-dots > *,
.wp-block-cover.is-style-ecocore-header-dots > * {
  position: relative;
  z-index: 2;
}

/* Columns. */
.wp-block-columns.is-style-ecocore-feature-split {
  align-items: stretch !important;
  gap: 0;
}

.wp-block-columns.is-style-ecocore-feature-split > .wp-block-column {
  min-width: 0;
}

.wp-block-columns.is-style-ecocore-feature-split > .wp-block-column:first-child {
  padding: clamp(2rem, 5vw, 5rem);
}

/* Apply this style to an individual Column containing a Cover block. */
.wp-block-column.is-style-ecocore-feature-image {
  align-self: stretch;
  clip-path: polygon(0 0, 100% 0, 100% 100%, 12% 100%);
  display: flex;
  min-height: 650px;
  overflow: hidden;
}

.wp-block-column.is-style-ecocore-feature-image > .wp-block-cover {
  flex: 1 1 auto;
  height: 100%;
  margin: 0;
  min-height: 650px;
  width: 100%;
}

.wp-block-column.is-style-ecocore-feature-image .wp-block-cover__image-background,
.wp-block-column.is-style-ecocore-feature-image .wp-block-cover__video-background {
  height: 100%;
  object-fit: cover;
  width: 100%;
}

.wp-block-columns.is-style-ecocore-feature-cards {
  gap: 1rem;
}

.wp-block-columns.is-style-ecocore-feature-cards > .wp-block-column {
  border: 1px solid rgba(255,255,255,.14);
  border-top: 3px solid var(--ecocore-green);
  padding: clamp(1.25rem, 3vw, 2rem);
  transition: transform .2s ease, border-color .2s ease;
}

.wp-block-columns.is-style-ecocore-feature-cards > .wp-block-column:hover {
  border-top-color: var(--ecocore-orange);
  transform: translateY(-4px);
}

/* Separators. */
.wp-block-separator.is-style-ecocore-green-line {
  border: 0;
  height: 3px;
  max-width: 96px;
  opacity: 1;
  background: var(--ecocore-green);
}

.wp-block-separator.is-style-ecocore-gradient-line {
  border: 0;
  height: 2px;
  opacity: 1;
  background: linear-gradient(90deg, var(--ecocore-green), transparent);
}

/* Heading styles. */
.wp-block-heading.is-style-ecocore-accent-underline {
  position: relative;
  padding-bottom: .75rem;
}

.wp-block-heading.is-style-ecocore-accent-underline::after {
  background: var(--ecocore-green);
  bottom: 0;
  content: "";
  height: 3px;
  left: 0;
  position: absolute;
  width: 72px;
}

.wp-block-heading.is-style-ecocore-eyebrow {
  color: var(--ecocore-green);
  font-family: Inter, sans-serif;
  font-size: .78rem;
  font-weight: 700;
  letter-spacing: .18em;
  line-height: 1.4;
  text-transform: uppercase;
}

@media (max-width: 781px) {
  .wp-block-group.is-style-ecocore-header-dots::after,
  .wp-block-cover.is-style-ecocore-header-dots::after {
    opacity: .5;
    width: 58vw;
  }

  .wp-block-columns.is-style-ecocore-feature-split {
    gap: 1.5rem;
  }

  .wp-block-column.is-style-ecocore-feature-image {
    min-height: 400px;
  }

  .wp-block-column.is-style-ecocore-feature-image > .wp-block-cover {
    min-height: 400px;
  }
}

.is-style-hexagon-border {
	position: relative;
	padding:20px;
	aspect-ratio: 1 / 1;
	display: grid;
	place-items: center;

	  clip-path: polygon(
        50% 0%,
        93% 25%,
        93% 75%,
        50% 100%,
        7% 75%,
        7% 25%
    );
}

.is-style-hexagon-border::before {
	content: "";
	position: absolute;
	inset: 0;

	background: linear-gradient(
		135deg,
		#80c83d 0%,
		#55ad25 45%,
		#d4ad29 100%
	);

	clip-path: inherit;
}

.is-style-hexagon-border::after {
	content: "";
	position: absolute;
	inset: 4px;

	background: #111;
	clip-path: inherit;
}

.is-style-hexagon-border > * {
	position: relative;
	z-index: 1;
}


/* Container */
.wp-block-columns.is-style-process-steps {
	gap: 0;
	align-items: flex-start;
}

/* Each step */
.wp-block-columns.is-style-process-steps > .wp-block-column {
	position: relative;
	padding-inline: 2rem;
}

/* Remove padding from ends */
.wp-block-columns.is-style-process-steps > .wp-block-column:first-child {
	padding-left: 0;
}

.wp-block-columns.is-style-process-steps > .wp-block-column:last-child {
	padding-right: 0;
}

/* Vertical dividers */
.wp-block-columns.is-style-process-steps > .wp-block-column:not(:last-child)::after {
	content: "";
	position: absolute;
	top: .5rem;
	right: 0;
	width: 1px;
	height: calc(100% - 1rem);

	background: linear-gradient(
		to bottom,
		transparent,
		rgba(95,175,52,.4) 15%,
		rgba(95,175,52,.4) 85%,
		transparent
	);
}

.wp-block-columns.is-style-process-timeline {
	--process-color: #5faf34;
	--process-circle-size: 54px;

	position: relative;
	gap: 2rem;
	counter-reset: process-step;
	align-items: flex-start;
}

/* Continuous horizontal line */
.wp-block-columns.is-style-process-timeline::before {
	content: "";
	position: absolute;
	top: calc(var(--process-circle-size) / 2);
	left: 0;
	right: 0;
	height: 2px;
	background: var(--process-color);
	transform: translateY(-50%);
}

/* Individual steps */
.wp-block-columns.is-style-process-timeline > .wp-block-column {
	position: relative;
	z-index: 1;
	counter-increment: process-step;
	padding-top: calc(var(--process-circle-size) + 1.25rem);
}

/* Generated numbered circles */
.wp-block-columns.is-style-process-timeline > .wp-block-column::before {
	content: counter(process-step);

	position: absolute;
	top: 0;
	left: 0;

	display: grid;
	place-items: center;

	width: var(--process-circle-size);
	aspect-ratio: 1;
	border: 3px solid var(--process-color);
	border-radius: 50%;

	background: #111;
	color: #fff;

	font-weight: 700;
	font-size: 1.25rem;
	line-height: 1;
}

/* Hide the line before step one and after the final circle */
.wp-block-columns.is-style-process-timeline::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: calc(100% - var(--process-circle-size));
	height: var(--process-circle-size);
	pointer-events: none;
}

.wp-block-list.is-style-check-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.wp-block-list.is-style-check-list li {
	position: relative;
	padding-left: 2rem;
	margin-bottom: .75rem;
}

.wp-block-list.is-style-check-list li:last-child {
	margin-bottom: 0;
}

/* Circle */
.wp-block-list.is-style-check-list li::before {
	content: "";
	position: absolute;
	left: 0;
	top: .15em;

	width: 1.25rem;
	height: 1.25rem;

	border: 2px solid #5faf34;
	border-radius: 50%;
	box-sizing: border-box;
}

/* Checkmark */
.wp-block-list.is-style-check-list li::after {
	content: "";
	    position: absolute;
    left: .42rem;
    top: 0.37rem;
    width: .25rem;
    height: .5rem;

	border-right: 2px solid #5faf34;
	border-bottom: 2px solid #5faf34;

	transform: rotate(45deg);
}

/* =========================================
   HEADER
   ========================================= */

header {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
  border-bottom:0;

	padding: 1.5rem 0;

	background: linear-gradient(
		to bottom,
		rgba(8,10,9,.9),
		rgba(8,10,9,.45),
		transparent
	);
  background:transparent;

	transition:
		background .3s ease,
		padding .3s ease,
		box-shadow .3s ease,
		transform .3s ease;
}
.site-header{padding-left:15px!important; padding-right:15px!important  ;}
header .site-header{border-bottom:0;  background-color:transparent!important;}

/* Hero spacing */
.home .wp-block-cover:first-of-type,
.home .hero-section {
	padding-top: 10rem;
}

.home .entry-content{margin-top:0;}

/* Interior pages */
body:not(.home) header {
	position: relative;
	background: #0b0d0c;
}

/* =========================================
   SCROLLED STATE
   ========================================= */

header.is-scrolled {
	position: fixed;
	top: 0;
	left: 0;

	padding: .9rem 0;

	background: rgba(11,13,12,.85);

	backdrop-filter: blur(10px);
	-webkit-backdrop-filter: blur(10px);

	box-shadow:
		0 8px 30px rgba(0,0,0,.25);
}

@media (max-width: 781px) {
	.wp-block-columns.is-style-process-timeline {
		display: grid;
		gap: 2rem;
	}

	.wp-block-columns.is-style-process-timeline::before {
		top: 0;
		bottom: 0;
		left: calc(var(--process-circle-size) / 2);
		right: auto;
		width: 2px;
		height: auto;
		transform: translateX(-50%);
	}

	.wp-block-columns.is-style-process-timeline > .wp-block-column {
		padding-top: 0;
		padding-left: calc(var(--process-circle-size) + 1.25rem);
		min-height: var(--process-circle-size);
	}
  .wp-block-media-text .wp-block-media-text__content{margin:30px 0!important;}
}

.entry-content >*{padding-left:15px!important; padding-right:15px!important;}