/* ============================================================
   THEME: teal-ocean-fresh
   Teal Ocean Fresh — deep blue-green teal + pale aqua tints
   Mood: clean-teal-fresh-trustworthy
   Path B theme (recipe palette). Built on the 2026 signature
   colour — blue-green/teal (ocean + clean-tech). Crisp white base,
   pale-aqua section tints for ABAB, deep teal accent, teal-charcoal
   ink, geometric Sora display. Reads medical, wellness, eco, SaaS.
   Distinct from white-azure (pure blue) — this is decidedly green-
   leaning teal. All AA-checked (accent #0A6E64 clears AA on white,
   the pale-aqua alt-section AND as a white-text CTA bg).
   Added 2026-06-09 (user request: +3 trend themes, 12 -> 15).
   ============================================================ */

.aibt-theme-teal-ocean-fresh {
	--bg-main: #FFFFFF;
	--bg-section: #E6F4F2;    /* pale aqua — ABAB alternation */
	--bg-card: #F2FAF9;
	--ink: #0E2A2C;           /* deep teal-charcoal — ~15:1 on white */
	--ink-soft: #3C5658;      /* teal-gray — ~7.8:1 on white */
	--ink-dim: #4F696B;       /* muted — AA on the pale-aqua alt-section (~4.86:1) */
	--ink-mute: #AFCFCC;      /* light aqua-gray — borders/disabled */
	--ink-inverse: #FFFFFF;
	--on-accent: #FFFFFF;     /* white on deep teal clears AA (~5.9:1) */
	--on-dark: #E9F7F4;       /* light aqua-white for teal-black dark bands */
	--line: rgba(14, 42, 44, 0.10);
	--line-strong: rgba(14, 42, 44, 0.20);

	--font-display: 'Sora', system-ui, sans-serif;
	--font-body: 'Plus Jakarta Sans', system-ui, sans-serif;
	--font-mono: 'JetBrains Mono', 'SF Mono', monospace;

	--radius: 10px;
	--radius-card: 12px;
	--photo-filter: saturate(1.05) brightness(1.02) contrast(1.02); /* cool, fresh */

	/* === Path B semantic tokens (Layer 2 variant API) — superset over legacy.
	   Deep teal #0A6E64 clears AA everywhere it's used as foreground: on white
	   (~5.9:1), on the pale-aqua alt-section (~4.86:1), and as a white-on-accent
	   CTA bg (~5.9:1). Deeper teal-black for conversion bands. === */
	--accent:               #0A6E64;
	--background:           var(--bg-main);
	--background-alt:       var(--bg-section);
	--background-dark:      #06302C;   /* deep teal-black for dark bands + footer */
	--background-card:      var(--bg-card);
	--text-primary:         var(--ink);
	--text-secondary:       var(--ink-soft);
	--text-muted:           var(--ink-dim);
	--text-on-photo:        #FFFFFF;
	--text-on-dark:         var(--on-dark);
	--accent-hover:         #085A52;
	--accent-fade:          rgba(10, 110, 100, 0.10);
	--cta-bg-primary:       #0A6E64;
	--cta-text-primary:     #FFFFFF;
	--cta-border-primary:   #0A6E64;
	--cta-bg-secondary:     transparent;
	--cta-text-secondary:   #085A52;
	--cta-border-secondary: #0A6E64;
	--divider-primary:      var(--line);
	--divider-accent:       rgba(10, 110, 100, 0.30);
	--decor-radius:         10px;
	--decor-radius-photo:   10px;
	--decor-shadow:         0 1px 3px rgba(14, 42, 44, 0.06);
	--decor-shadow-elevated:0 14px 40px rgba(10, 110, 100, 0.16);
	--decor-border-width:   1px;
	--italic-color:         var(--accent);
	--italic-weight:        600;

	/* === HERO text-on-photo: translucent white glass panel === */
	--hero-scrim:        linear-gradient(180deg, rgba(0,0,0,0) 40%, rgba(6,48,44,0.24) 100%);
	--hero-panel-bg:     rgba(255, 255, 255, 0.88);
	--hero-panel-blur:   blur(10px) saturate(1.1);
	--hero-panel-text:   var(--ink);
	--hero-panel-pad:    clamp(1.5rem, 3vw, 2.5rem);
	--hero-panel-max:    44ch;
	--hero-panel-radius: 12px;
	--hero-panel-border: 1px solid rgba(10, 110, 100, 0.16);
	--hero-panel-shadow: 0 12px 40px rgba(14, 42, 44, 0.12);
	--hero-text-shadow:  none;
	--hero-em-color:     var(--accent);

	/* === Conversion band: deep teal-black, white text clears AA (~10:1) === */
	--conversion-band-bg:   #064F47;
	--conversion-band-text: #FFFFFF;

	font-family: var(--font-body);
	font-size: 16px;
	line-height: 1.65;
	color: var(--ink);
	background: var(--bg-main);
	-webkit-font-smoothing: antialiased;
}

.aibt-theme-teal-ocean-fresh h1,
.aibt-theme-teal-ocean-fresh h2,
.aibt-theme-teal-ocean-fresh h3,
.aibt-theme-teal-ocean-fresh h4 {
	font-family: var(--font-display);
	font-weight: 600;
	color: var(--ink);
	letter-spacing: -0.015em;
	line-height: 1.14;
	margin: 0;
}

.aibt-theme-teal-ocean-fresh a {
	color: var(--accent);
	text-decoration: none;
	transition: color 0.22s ease;
}

.aibt-theme-teal-ocean-fresh img {
	filter: var(--photo-filter);
}

/* End theme teal-ocean-fresh. */