/*
 * ANA — site-wide theme variant
 *
 * Loaded by inc/enqueue.php when WPANGEL_THEME_VARIANT === 'ana'
 * (see DEPLOY.md and docs/WP-ANGEL-FRAMEWORK.md). It carries ANA branding and
 * overrides that apply across the whole site. Homepage-only composition lives
 * in ana-home.css; reusable defaults live in child-style.css.
 */

/* Brand overrides for generic phearum-core / WP Angel components. */
:root {
    --wpangel-block-header-divider-color: var(--arn-green-700);
}

/* ANA palette (moved from child-style.css). */
* {
    --arn-green-950: #003f35;
    --arn-green-900: #064735;
    --arn-green-800: #08734f;
    --arn-green-700: #0a7c50;
    --arn-green-600: #3ca463;
    --arn-green-100: #eaf6e5;
    --arn-cream: #fffaf1;
    --arn-cream-strong: #f7f0df;
    --arn-yellow: #f5d763;
    --arn-text: #173d33;
    --arn-muted: #597268;
    --arn-border: rgb(6 71 53 / 0.12);
    --arn-shadow: 0 22px 56px rgb(20 65 48 / 0.1);
}

/* Gray Two Columns Section (#064f3d, #043f32 + rgba(255, 255, 255, 0.11)) */
.gray-columns-section {
    color: hsl(var(--color-surface));
    padding: 5.25rem 0;
    background: radial-gradient(circle at 15% 20%, rgba(238, 209, 107, 0.14), transparent 32%), linear-gradient(135deg, #064f3d 0%, #043f32 100%);
}

.gray-columns-section .wp-block-group__inner-container {
    width: min(80rem, calc(100% - 40px));
    margin-inline: auto;
    margin: 0 auto;
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}

.gray-columns-section .wp-block-columns {
    display: grid;
    grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
    gap: clamp(2rem, 6vw, 5rem);
    align-items: center;
    padding: clamp(2rem, 5vw, 4.5rem);
    border-radius: 32px;
    background: rgba(255, 255, 255, 0.11);
    border: 1px solid rgba(255, 255, 255, 0.18);
    box-shadow: 0 30px 80px rgba(0, 35, 25, 0.22);
}

/* Gray Two Columns Section (#f7f0df + #ffffff) */
.warm-ivory-column-section {
    padding: 5.25rem 0;
    background: radial-gradient(circle at 18% 30%, rgb(245 215 99 / 0.24), transparent 18rem), var(--arn-cream-strong);
}

.warm-ivory-column-section .wp-block-group__inner-container {
    width: min(80rem, calc(100% - 40px));
    margin-inline: auto;
    max-width: 920px;
    padding: 3rem;
    text-align: center;
    background: #ffffff;
    border: 1px solid var(--arn-border);
    border-radius: 36px;
    box-shadow: var(--arn-shadow);
}

/* ANA WPForms buttons: lime pill (moved from child-style.css). */
.wp-block-button__link .wp-element-button, div.wpforms-container-full .wpforms-form input[type=submit]:not(:hover):not(:active), div.wpforms-container-full .wpforms-form button[type=submit]:not(:hover):not(:active), div.wpforms-container-full .wpforms-form .wpforms-page-button:not(:hover):not(:active), .wp-core-ui div.wpforms-container-full input[type=submit]:not(:hover):not(:active), .wp-core-ui div.wpforms-container-full button[type=submit]:not(:hover):not(:active), .wp-core-ui div.wpforms-container-full .wpforms-page-button:not(:hover):not(:active) {
  background-color: #a6de9b;
  width: fit-content;
  height: 3rem;
  font-size: 1.25rem;
  border-radius: 9999px;
}
div.wpforms-container-full .wpforms-form input[type=submit]:hover, div.wpforms-container-full .wpforms-form input[type=submit]:active, div.wpforms-container-full .wpforms-form button[type=submit]:hover, div.wpforms-container-full .wpforms-form button[type=submit]:active, div.wpforms-container-full .wpforms-form .wpforms-page-button:hover, div.wpforms-container-full .wpforms-form .wpforms-page-button:active, .wp-core-ui div.wpforms-container-full input[type=submit]:hover, .wp-core-ui div.wpforms-container-full input[type=submit]:active, .wp-core-ui div.wpforms-container-full button[type=submit]:hover, .wp-core-ui div.wpforms-container-full button[type=submit]:active, .wp-core-ui div.wpforms-container-full .wpforms-page-button:hover, .wp-core-ui div.wpforms-container-full .wpforms-page-button:active {
  background-color: #a6de9b;
  width: fit-content;
  height: 3rem;
  font-size: 1.25rem;
  border-radius: 9999px;
}

/* ANA success-story card layout (moved from child-style.css; not used by the current homepage). */
/* =========================================================
   Success Story
   ========================================================= */

.ana-success-story {
	background: #fbf9f3;
	padding: 90px 24px;
}

.ana-success-story__inner {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(380px, .9fr);
	gap: 64px;
	align-items: start;
	max-width: 1200px !important;
	margin-inline: auto;
}

.ana-success-story__left,
.ana-success-story__right,
.ana-success-story__list,
.ana-success-story__card-copy,
.ana-success-story__stats,
.ana-success-story__stat {
	margin-block-start: 0 !important;
}

.ana-success-story__eyebrow {
	margin: 0 0 14px;
	color: #26715d;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
}

.ana-success-story__title {
	max-width: 600px;
	margin: 0;
	color: #123b32;
	font-size: clamp(38px, 4vw, 58px);
	font-weight: 700;
	line-height: 1.02;
	letter-spacing: -.035em;
}

.ana-success-story__intro {
	max-width: 620px;
	margin: 22px 0 0;
	color: #64726d;
	font-size: 17px;
	line-height: 1.65;
}

.ana-success-story__list {
	display: grid;
	gap: 14px;
	margin-top: 36px !important;
}

.ana-success-story__card {
	display: grid;
	grid-template-columns: 112px minmax(0, 1fr);
	gap: 22px;
	align-items: center;
	padding: 16px;
	border-radius: 14px;
}

.ana-success-story__card--pink {
	background: #fce9e8;
}

.ana-success-story__card--yellow {
	background: #fbe9c9;
}

.ana-success-story__card--green {
	background: #e1f0e7;
}

.ana-success-story__thumb {
	width: 112px;
	height: 100px;
	margin: 0 !important;
	overflow: hidden;
	border-radius: 10px;
}

.ana-success-story__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ana-success-story__card-copy h3 {
	margin: 0 0 8px;
	color: #123b32;
	font-size: 18px;
	line-height: 1.3;
}

.ana-success-story__card-copy > p:not(.ana-success-story__meta) {
	margin: 0;
	color: #435750;
	font-size: 14px;
	line-height: 1.55;
}

.ana-success-story__meta {
	margin: 12px 0 0;
	color: #41574f;
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .08em;
	text-transform: uppercase;
}

.ana-success-story__actions {
	margin-top: 20px;
}

.ana-success-story__button .wp-block-button__link {
	padding: 11px 20px;
	border-radius: 999px;
	background: #28695b;
	color: #fff;
	font-size: 14px;
	font-weight: 600;
}

.ana-success-story__button .wp-block-button__link:hover {
	background: #1d5549;
}

.ana-success-story__hero {
	height: 330px;
	margin: 0 !important;
	overflow: hidden;
	border-radius: 18px;
}

.ana-success-story__hero img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ana-success-story__stats {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 14px;
	margin-top: 18px !important;
}

.ana-success-story__stat {
	min-height: 150px;
	padding: 26px 24px;
	border-radius: 14px;
}

.ana-success-story__stat--green {
	background: #e2f0e8;
}

.ana-success-story__stat--pink {
	background: #fbe8e8;
}

.ana-success-story__stat--blue {
	background: #e2f1f4;
}

.ana-success-story__stat--yellow {
	background: #fbeacb;
}

.ana-success-story__stat-number {
	margin: 0 0 6px;
	color: #123b32;
	font-size: 32px;
	line-height: 1;
}

.ana-success-story__stat p {
	margin: 0;
	color: #435750;
	font-size: 14px;
	line-height: 1.4;
}


/* =========================================================
   Tablet
   ========================================================= */

@media (max-width: 960px) {
	.ana-success-story {
		padding: 72px 24px;
	}

	.ana-success-story__inner {
		grid-template-columns: 1fr;
		gap: 44px;
	}

	.ana-success-story__right {
		max-width: none;
	}
}


/* =========================================================
   Mobile
   ========================================================= */

@media (max-width: 600px) {
	.ana-success-story {
		padding: 56px 18px;
	}

	.ana-success-story__inner {
		gap: 36px;
	}

	.ana-success-story__title {
		font-size: 38px;
	}

	.ana-success-story__intro {
		font-size: 16px;
	}

	.ana-success-story__card {
		grid-template-columns: 86px minmax(0, 1fr);
		gap: 14px;
		padding: 12px;
	}

	.ana-success-story__thumb {
		width: 86px;
		height: 86px;
	}

	.ana-success-story__card-copy h3 {
		font-size: 16px;
	}

	.ana-success-story__card-copy > p:not(.ana-success-story__meta) {
		font-size: 13px;
	}

	.ana-success-story__hero {
		height: 260px;
	}

	.ana-success-story__stats {
		grid-template-columns: 1fr 1fr;
		gap: 10px;
	}

	.ana-success-story__stat {
		min-height: 130px;
		padding: 20px 16px;
	}

	.ana-success-story__stat-number {
		font-size: 27px;
	}
}