/*
Theme Name:   Incourage (Hello Elementor child)
Description:  Header, footer and site-wide styles for the Incourage Counselling Elementor build. Page content is the client's HTML blocks, one Elementor HTML widget per block.
Theme URI:    https://www.geekedoutweb.com
Author:       GO Web Services
Author URI:   https://www.geekedoutweb.com
Template:     hello-elementor
Version:      1.0.0
Text Domain:  incourage
*/

/* Design tokens — taken from the client's blocks (copy/client-blocks-2026-10). */
:root {
	/* Palette from the client's library (22 Oct 2026): forest and deep green replace navy and
	   teal. Gold #F2DCA0 is type on forest only; #C9A227 is never a letter. */
	--icg-forest: #246B53;        /* dark bands, buttons, small labels on light */
	--icg-forest-hover: #1C553F;
	--icg-deep: #12352A;          /* headings, names, nav text */
	--icg-ground: #E6ECE4;        /* page background */
	--icg-card: #F2F6F0;
	--icg-soft: #D3DFD0;          /* panels, hover tint */
	--icg-gold: #F2DCA0;          /* type on forest only */
	--icg-gold-mark: #C9A227;     /* rules and dots on pale only */
	--icg-text: #48524A;
	--icg-text-on-forest: #D8E6DB;
	--icg-muted: #5E6A62;
	--icg-hairline: #C8D4C5;
	--icg-display: 'Fraunces', Georgia, serif;
	--icg-sans: 'Karla', system-ui, -apple-system, "Segoe UI", sans-serif;
}

:root { color-scheme: only light; }
body { margin: 0; background: var(--icg-ground); color: var(--icg-text); font-family: var(--icg-sans); -webkit-font-smoothing: antialiased; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

/* Blocks sit edge to edge: no gaps from Elementor containers. */
.elementor .e-con.icg-block { --padding-top: 0px; --padding-bottom: 0px; --padding-left: 0px; --padding-right: 0px; --gap: 0px; }
.elementor .icg-block .elementor-widget-html { width: 100%; }
.site-main { padding: 0 !important; max-width: none !important; }

/* ---------- Header ---------- */
.icg-site-header { position: sticky; top: 0; z-index: 100; background: rgba(230, 236, 228, 0.96); border-bottom: 1px solid var(--icg-hairline); backdrop-filter: saturate(1.2) blur(10px); -webkit-backdrop-filter: saturate(1.2) blur(10px); font-family: var(--icg-sans); }
.admin-bar .icg-site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .icg-site-header { top: 46px; } }
.icg-site-header__inner { max-width: 1180px; margin: 0 auto; padding: 0 24px; height: 76px; display: flex; align-items: center; gap: 24px; }
.icg-site-header__logo { flex: 0 0 auto; display: block; line-height: 0; }
.icg-site-header__logo img { width: 186px; height: auto; }
.icg-nav { margin-left: auto; }
.icg-nav ul { list-style: none; margin: 0; padding: 0; }
.icg-nav > ul { display: flex; align-items: center; gap: 4px; }
.icg-nav li { position: relative; }
.icg-nav a { display: block; padding: 10px 12px; color: var(--icg-deep); text-decoration: none; font-size: .98rem; font-weight: 500; border-radius: 6px; transition: color .2s, background-color .2s; }
.icg-nav a:hover, .icg-nav a:focus-visible { color: var(--icg-forest-hover); }
.icg-nav .current-menu-item > a, .icg-nav .current-menu-ancestor > a { color: var(--icg-forest); }
.icg-nav .menu-item-has-children > a::after { content: ''; display: inline-block; width: 6px; height: 6px; margin: 0 0 3px 8px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: rotate(45deg); }
.icg-nav .sub-menu { position: absolute; top: 100%; left: 0; min-width: 260px; padding: 8px; background: #fff; border: 1px solid var(--icg-hairline); border-radius: 8px; box-shadow: 0 18px 40px -22px rgba(18, 53, 42, .3); opacity: 0; visibility: hidden; transform: translateY(6px); transition: opacity .18s, transform .18s, visibility .18s; }
.icg-nav li:hover > .sub-menu, .icg-nav li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; }
.icg-nav .sub-menu a { padding: 9px 12px; font-size: .95rem; }
.icg-nav .sub-menu a:hover { background: var(--icg-soft); color: var(--icg-deep); }
.icg-site-header__cta { flex: 0 0 auto; display: inline-block; padding: 12px 20px; background: var(--icg-forest); color: #fff !important; border-radius: 6px; font-weight: 700; font-size: .95rem; text-decoration: none; transition: background-color .2s, transform .2s; }
.icg-site-header__cta:hover { background: var(--icg-forest-hover); transform: translateY(-1px); }
.icg-nav-toggle { display: none; margin-left: auto; width: 44px; height: 44px; border: 0; background: transparent; color: var(--icg-deep); cursor: pointer; border-radius: 6px; }
.icg-nav-toggle span, .icg-nav-toggle span::before, .icg-nav-toggle span::after { display: block; width: 22px; height: 2px; margin: 0 auto; background: currentColor; position: relative; transition: transform .2s, background-color .2s; content: ''; }
.icg-nav-toggle span::before { position: absolute; top: -7px; }
.icg-nav-toggle span::after { position: absolute; top: 7px; }
.icg-nav-open .icg-nav-toggle span { background: transparent; }
.icg-nav-open .icg-nav-toggle span::before { transform: translateY(7px) rotate(45deg); }
.icg-nav-open .icg-nav-toggle span::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 1080px) {
	.icg-site-header__cta { display: none; }
}
@media (max-width: 900px) {
	.icg-nav-toggle { display: block; }
	/* backdrop-filter makes a fixed child size itself to the header instead of the screen,
	   which left the iPhone menu 0px tall (you had to scroll inside it). Solid header instead. */
	.icg-site-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--icg-ground); }
	.icg-nav { position: fixed; left: 0; right: 0; top: var(--icg-nav-top, 76px); bottom: 0; height: auto; margin: 0; padding: 12px 24px calc(40px + env(safe-area-inset-bottom)); background: var(--icg-ground); overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; display: none; }
	.icg-nav-open { overflow: hidden; }
	.icg-nav-open .icg-nav { display: block; }
	.icg-nav > ul { display: block; }
	.icg-nav > ul > li { border-bottom: 1px solid var(--icg-hairline); }
	.icg-nav a { padding: 15px 0; font-size: 1.08rem; }
	.icg-nav .menu-item-has-children > a::after { display: none; }
	.icg-nav .sub-menu { position: static; opacity: 1; visibility: visible; transform: none; box-shadow: none; border: 0; padding: 0 0 10px 14px; min-width: 0; background: transparent; }
	.icg-nav .sub-menu a { padding: 9px 0; }
	.icg-nav__cta-mobile { display: block !important; margin-top: 22px; text-align: center; }
}
.icg-nav__cta-mobile { display: none !important; }

/* ---------- Footer ---------- */
.icg-site-footer { background: var(--icg-forest); color: var(--icg-text-on-forest); font-family: var(--icg-sans); font-size: .95rem; line-height: 1.65; }
.icg-site-footer a { color: #fff; text-decoration: none; }
.icg-site-footer a:hover { color: var(--icg-gold); text-decoration: underline; text-underline-offset: 3px; }
.icg-site-footer__inner { max-width: 1180px; margin: 0 auto; padding: 64px 24px 28px; }
.icg-site-footer__grid { display: grid; grid-template-columns: 1.3fr 1fr 1fr 1fr; gap: 40px; }
.icg-site-footer__logo img { width: 150px; height: auto; }
.icg-site-footer h2 { margin: 0 0 14px; font-family: var(--icg-display); font-weight: 600; font-size: 1.05rem; color: #fff; }
.icg-site-footer ul { list-style: none; margin: 0; padding: 0; }
.icg-site-footer li { margin: 0 0 8px; }
.icg-site-footer p { margin: 0 0 8px; }
.icg-site-footer address { font-style: normal; }
.icg-site-footer__returning { margin-top: 14px; }
.icg-site-footer ul.icg-site-footer__social { display: flex; gap: 6px; margin: 14px 0 0 -10px; }
.icg-site-footer__social li { margin: 0; }
.icg-site-footer__social a { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; transition: background-color .2s, color .2s; }
.icg-site-footer__social a:hover { background: rgba(255, 255, 255, .1); color: var(--icg-gold); text-decoration: none; }
.icg-site-footer__land { margin-top: 48px; padding-top: 28px; border-top: 1px solid rgba(216, 230, 219, .22); font-size: .88rem; color: rgba(216, 230, 219, .85); }

.icg-site-footer__base { margin-top: 28px; padding-top: 20px; border-top: 1px solid rgba(216, 230, 219, .22); display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; font-size: .85rem; color: rgba(216, 230, 219, .8); }
.icg-site-footer__base ul { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.icg-site-footer__base li { margin: 0; }
@media (max-width: 900px) { .icg-site-footer__grid { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .icg-site-footer__grid { grid-template-columns: 1fr; gap: 28px; } .icg-site-footer__inner { padding-top: 48px; } }

:focus-visible { outline: 2px solid var(--icg-forest); outline-offset: 2px; }
.icg-nav a[href="#"] { cursor: default; }

/* The parent theme's "Skip to content" link (keyboard users) showed at 4.1:1 when focused. */
.skip-link.screen-reader-text { color: var(--icg-deep); }
.skip-link.screen-reader-text:focus { background: var(--icg-forest); color: #fff; padding: 12px 18px; border-radius: 6px; z-index: 100000; font-family: var(--icg-sans); font-weight: 700; text-decoration: none; }