/* AI Homepage Builder — CRO palette tokens + utility classes (generated; do not hand-edit). */
:root{
	--ahb-grad-start: #eef4ff;
	--ahb-grad-end: #d7e6ff;
	--ahb-accent: #2563eb;
	--ahb-accent-contrast: #ffffff;
	--ahb-accent-soft: #e0e9fc;
	--ahb-on-grad: #0f172a;
	--ahb-text: #1f2937;
	--ahb-card-bg: #ffffff;
	--ahb-border: #e5e7eb;
	--ahb-hero-scrim-rgb: 16, 34, 73;
}

/* --- Sections --- */
.ahb-cro-section{ padding:clamp(32px,5vw,64px) 24px; }
.ahb-cro-section-title{ color:var(--ahb-text); font-size:clamp(1.6rem,3vw,2.25rem); margin:0 0 .2em; }

.ahb-cro-hero{ background:linear-gradient(135deg,var(--ahb-grad-start),var(--ahb-grad-end)); color:var(--ahb-on-grad); padding:clamp(40px,6vw,72px) 24px; }
.ahb-cro-hero__title{ color:var(--ahb-on-grad); font-size:clamp(2rem,4vw,3rem); line-height:1.12; margin:0 0 .4em; }
.ahb-cro-hero__sub{ color:var(--ahb-on-grad); opacity:.92; max-width:60ch; }
/* --- Full-bleed hero: background scene + palette scrim + left-aligned HTML overlay --- */
.ahb-cro-hero--full{
	position:relative; padding:0;
	background-color:var(--ahb-grad-start);
	background-image:linear-gradient(135deg,var(--ahb-grad-start),var(--ahb-grad-end));
	background-size:cover; background-position:75% center; background-repeat:no-repeat;
	min-height:clamp(340px,42vh,480px); display:flex; align-items:center; overflow:hidden;
}
/* Palette-tinted scrim, heavier on the left where the text sits (white text stays AA). */
.ahb-cro-hero--full::before{
	content:""; position:absolute; inset:0; z-index:0;
	background:linear-gradient(90deg, rgba(var(--ahb-hero-scrim-rgb),.90) 0%, rgba(var(--ahb-hero-scrim-rgb),.66) 46%, rgba(var(--ahb-hero-scrim-rgb),.18) 100%);
}
.ahb-cro-hero__inner{ position:relative; z-index:1; max-width:1100px; margin:0 auto; width:100%; padding:clamp(28px,4vw,52px) 24px; }
.ahb-cro-hero__content{ max-width:min(600px,92%); text-align:left; }
.ahb-cro-hero--full :is(h1,h2,p,li){ color:#fff; }
.ahb-cro-hero--full .ahb-cro-hero__title{ color:#fff; text-shadow:0 2px 18px rgba(0,0,0,.38); }
.ahb-cro-hero--full .ahb-cro-hero__sub{ color:#fff; opacity:.96; max-width:46ch; text-shadow:0 1px 10px rgba(0,0,0,.38); }
.ahb-cro-hero--full .ahb-cro-hero__sub{ font-size:clamp(1.02rem,1.6vw,1.2rem); }
.ahb-cro-hero--full .wp-block-buttons{ margin-top:18px; }
.ahb-cro-hero__disc{ color:#fff; opacity:.85; font-size:.72rem; margin:.8em 0 0; max-width:48ch; }
@media (max-width:781px){
	.ahb-cro-hero--full{ background-position:center; min-height:clamp(320px,52vh,440px); }
	.ahb-cro-hero--full::before{ background:rgba(var(--ahb-hero-scrim-rgb),.74); }
	.ahb-cro-hero__content{ max-width:100%; }
}

.ahb-cro-band{ background:var(--ahb-accent); color:var(--ahb-accent-contrast); padding:clamp(28px,4vw,48px) 24px; text-align:center; border-radius:16px; }
.ahb-cro-band :is(h1,h2,h3,p){ color:var(--ahb-accent-contrast); }

.ahb-cro-banner{ background:linear-gradient(135deg,var(--ahb-grad-start),var(--ahb-grad-end)); color:var(--ahb-on-grad); padding:clamp(40px,6vw,72px) 24px; text-align:center; }
.ahb-cro-banner :is(h1,h2,h3,p){ color:var(--ahb-on-grad); }
.ahb-cro-banner__title{ font-size:clamp(1.6rem,3vw,2.4rem); margin:0 0 .3em; }

/* Affiliate CTA disclosure (FTC) baked into the CTA bands */
.ahb-cro-cta__disc{ font-size:.75rem; opacity:.82; margin:.7em auto 0; max-width:70ch; }
.ahb-cro-banner .ahb-cro-cta__disc{ color:var(--ahb-on-grad); }
.ahb-cro-cta-amazon .ahb-cro-cta__disc{ color:var(--ahb-text); }

/* --- Value props --- */
.ahb-cro-valueprops .wp-block-column{ flex-basis:0; }
.ahb-cro-prop{ text-align:center; padding:8px; }
.ahb-cro-prop__icon{ font-size:2rem; line-height:1; margin:0 0 .35em; }
.ahb-cro-prop :is(h2,h3){ color:var(--ahb-text); margin:.1em 0 .35em; font-size:1.15rem; }
.ahb-cro-prop p{ color:var(--ahb-text); opacity:.85; margin:0; }

.ahb-cro-card{ background:var(--ahb-card-bg); color:var(--ahb-text); border:1px solid var(--ahb-border); border-radius:16px; padding:18px; box-shadow:0 8px 20px rgba(0,0,0,.06); height:100%; }
.ahb-cro-card :is(h2,h3){ color:var(--ahb-text); margin:.2em 0 .45em; }
.ahb-cro-card p{ color:var(--ahb-text); opacity:.85; }

/* --- Funnel blocks (Phase B) --- */
.ahb-cro-problem p,
.ahb-cro-solution p{ color:var(--ahb-text); font-size:1.05rem; max-width:62ch; }
/* Solution Intro credibility line (folded site mission — "why you can trust our take") */
.ahb-cro-solution__trust{ border-left:3px solid var(--ahb-accent); padding-left:12px; margin-top:1.1em; opacity:.92; font-size:.98rem; }
/* ===================================================================
 * UNIFORM IMAGE SIZING SYSTEM (by role). Fixed aspect-ratio containers +
 * object-fit:cover so varying SOURCE dimensions never produce ragged layout —
 * the box governs display, the image just fills it.
 * =================================================================== */
/* SECTION/INLINE images (agitation, solution intro, value stack): ONE shared 3:2
   box, capped width + centered, so the value-stack image can NOT go full-width. */
.ahb-cro-media{ margin:0 auto; max-width:520px; width:100%; }
.ahb-cro-media img{ display:block; width:100%; height:auto; aspect-ratio:3 / 2; object-fit:cover; border-radius:14px; box-shadow:0 14px 36px rgba(0,0,0,.16); }
/* balance image-vs-text columns so a short image doesn't leave ragged whitespace */
.ahb-cro-problem .wp-block-columns,
.ahb-cro-solution .wp-block-columns{ align-items:center; }

/* CARDS (topic + latest): equal card+image heights across the row, one 16:9 image. */
.ahb-featured-topics .wp-block-column{ display:flex; }
.ahb-silo-card{ display:flex; flex-direction:column; height:100%; }
.ahb-topic-icon{ margin:0 0 12px; }
.ahb-topic-icon img{ display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover; border-radius:12px; }
.ahb-latest-posts-grid{ align-items:stretch; }
.ahb-latest-card{ display:flex; flex-direction:column; height:100%; }
/* override the legacy fixed-220px thumb with the shared 16:9 aspect box */
.ahb-latest-card__thumb, .ahb-card-thumb{ height:auto; overflow:hidden; border-radius:12px; }
.ahb-latest-card__thumb > a{ display:block; }
.ahb-latest-card__thumb img, .ahb-card-thumb img{ display:block; width:100%; height:auto; aspect-ratio:16 / 9; object-fit:cover; }
/* Who-it's-for qualifier: two-up checklist */
.ahb-cro-qualifier .ahb-cro-checklist{ columns:2; column-gap:36px; }
.ahb-cro-qualifier .ahb-cro-checklist li{ break-inside:avoid; }
@media (max-width:600px){ .ahb-cro-qualifier .ahb-cro-checklist{ columns:1; } }
/* Pros & cons: accent rail on "like", neutral on "consider" (plain bullets) */
.ahb-cro-proscons__like{ border-top:4px solid var(--ahb-accent); }
.ahb-cro-proscons__consider{ border-top:4px solid var(--ahb-border); }
.ahb-cro-proscons__consider ul{ margin:1em 0; padding-left:1.2em; }
.ahb-cro-proscons__consider li{ color:var(--ahb-text); opacity:.9; margin:.35em 0; }
/* Safety & realistic expectations: soft tinted card */
.ahb-cro-safety__card{ background:var(--ahb-accent-soft); border-color:var(--ahb-accent); }
.ahb-cro-safety__card :is(h2,p){ color:var(--ahb-text); }
.ahb-cro-safety__consult{ margin-top:.6em; }
/* Footer disclaimers (YMYL): muted, small, top-bordered */
.ahb-cro-disclaimers{ border-top:1px solid var(--ahb-border); margin-top:24px; }
.ahb-cro-disclaimers__title{ color:var(--ahb-text); font-size:1.1rem; opacity:.8; margin:0 0 .4em; }
.ahb-cro-disclaimers__item{ color:var(--ahb-text); opacity:.72; font-size:.8rem; line-height:1.5; margin:.4em 0; }

/* --- Bits --- */
.ahb-cro-eyebrow{ display:inline-block; background:var(--ahb-accent-soft); color:var(--ahb-accent); font-weight:700; text-transform:uppercase; letter-spacing:.04em; font-size:.78rem; padding:6px 12px; border-radius:999px; }

.ahb-cro-checklist{ list-style:none; padding:0; margin:1em 0; }
.ahb-cro-checklist li{ position:relative; padding-left:1.7em; margin:.35em 0; }
.ahb-cro-checklist li::before{ content:"\2713"; position:absolute; left:0; color:var(--ahb-accent); font-weight:800; }

/* --- Buttons (core wp:button) --- */
.ahb-cro-btn-primary .wp-block-button__link{ background:var(--ahb-accent); color:var(--ahb-accent-contrast) !important; border:0; border-radius:12px; font-weight:800; padding:14px 22px; }
.ahb-cro-btn-primary .wp-block-button__link:hover{ filter:brightness(.96); }
.ahb-cro-btn-secondary .wp-block-button__link{ background:transparent; color:var(--ahb-on-grad); border:2px solid var(--ahb-border); border-radius:12px; padding:12px 20px; }
.ahb-cro-band .ahb-cro-btn-secondary .wp-block-button__link{ color:var(--ahb-accent-contrast); border-color:var(--ahb-accent-contrast); }
.ahb-cro-pill .wp-block-button__link{ background:var(--ahb-accent-soft); color:var(--ahb-accent); border-radius:999px; font-weight:700; padding:10px 16px; }

/* --- Support-post CRO: semantic callouts, related-reading card, closing band (Phase B) --- */
.ahb-cro-callout{ border:1px solid var(--ahb-border); border-left-width:4px; background:var(--ahb-card-bg); color:var(--ahb-text); border-radius:12px; padding:14px 18px; margin:1.5em 0; }
.ahb-cro-callout :is(h2,h3){ margin:.1em 0 .4em; font-size:1.15rem; color:var(--ahb-text); }
.ahb-cro-callout :is(p,li){ color:var(--ahb-text); opacity:.92; }
.ahb-cro-callout > strong:first-child{ display:block; margin-bottom:.4em; color:var(--ahb-text); }
.ahb-cro-callout--tip{ border-left-color:var(--ahb-accent); background:var(--ahb-accent-soft); }
.ahb-cro-callout--highlight{ border-left-color:var(--ahb-accent); background:var(--ahb-accent-soft); box-shadow:0 8px 20px rgba(0,0,0,.06); }
.ahb-cro-callout--info{ border-left-color:#3b82f6; background:rgba(59,130,246,.08); }
.ahb-cro-callout--caution{ border-left-color:#f59e0b; background:rgba(245,158,11,.10); }
.ahb-cro-callout--info :is(h2,h3) , .ahb-cro-callout--info > strong:first-child{ color:#2563eb; }
.ahb-cro-callout--caution :is(h2,h3) , .ahb-cro-callout--caution > strong:first-child{ color:#b45309; }

.ahb-cro-linkcard{ background:var(--ahb-card-bg); border:1px solid var(--ahb-border); border-radius:12px; padding:14px 18px; margin:1.5em 0; }
.ahb-cro-linkcard__title{ color:var(--ahb-text); font-weight:800; text-transform:uppercase; letter-spacing:.03em; font-size:.82rem; opacity:.7; margin:0 0 .55em; }
.ahb-cro-linkcard__list{ list-style:none; margin:0; padding:0; display:grid; gap:.45em; }
.ahb-cro-linkcard__list li{ margin:0; padding-left:1.3em; position:relative; }
.ahb-cro-linkcard__list li::before{ content:"\2192"; position:absolute; left:0; color:var(--ahb-accent); font-weight:800; }
.ahb-cro-linkcard__list a{ color:var(--ahb-accent); text-decoration:none; font-weight:600; }
.ahb-cro-linkcard__list a:hover{ text-decoration:underline; }

.are-closing-band{ margin:1.8em 0 0; text-align:left; }
.are-closing-band .ahb-cro-band__in{ display:flex; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; max-width:1080px; margin:0 auto; }
.ahb-cro-band__title{ color:var(--ahb-accent-contrast); font-size:clamp(1.2rem,2.4vw,1.6rem); font-weight:800; }
.ahb-cro-band__sub{ color:var(--ahb-accent-contrast); opacity:.92; margin-top:.25em; max-width:60ch; }
.ahb-cro-band__btn{ flex:0 0 auto; }
@media (max-width:640px){ .are-closing-band .ahb-cro-band__in{ justify-content:center; text-align:center; } }