/*
 * Aathiyoga Hello Child – main stylesheet.
 * Colours match the Elementor global colours set by the Journal Kit:
 * Primary #1B2B4B · Secondary #A9481A · Text #1F2430 · Accent #2E6B4E
 */

:root {
	--ay-ink: #1b2b4b;
	--ay-ink-2: #121e36;
	--ay-saffron: #a9481a;
	--ay-saffron-dark: #8a3a14;
	--ay-gold: #e9b872;
	--ay-gold-soft: #f5d9a8;
	--ay-leaf: #2e6b4e;
	--ay-cream: #fbf7f1;
	--ay-sand: #f3ebdd;
	--ay-peach: #fdf1e6;
	--ay-line: #e5daca;
	--ay-text: #1f2430;
	--ay-muted: #5b6170;
	--ay-mist: #c9d3e6;
	--ay-white: #fff;
	--ay-serif: "Aathi Serif", "Noto Serif", Georgia, "Times New Roman", serif;
	--ay-sans: "Aathi Sans", "Noto Sans", system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif;
	--ay-radius: 10px;
	--ay-shadow: 0 10px 30px -12px rgba(18, 30, 54, .25);
	--ay-wrap: 1200px;
	--ay-gutter: 20px;
	--ay-masthead-h: 0px;
}

/* ---------- Base ---------- */

html { scroll-padding-top: 90px; }

body.aathiyoga {
	font-family: var(--ay-sans);
	font-size: 17px;
	line-height: 1.65;
	color: var(--ay-text);
	background: var(--ay-white);
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
}

.aathiyoga h1, .aathiyoga h2, .aathiyoga h3, .aathiyoga h4, .aathiyoga h5, .aathiyoga h6 {
	font-family: var(--ay-serif);
	color: var(--ay-ink);
	font-weight: 700;
	line-height: 1.25;
	margin-block: 0 .6em;
}
.aathiyoga h1 { font-size: clamp(2rem, 1.4rem + 2.2vw, 2.9rem); }
.aathiyoga h2 { font-size: clamp(1.55rem, 1.2rem + 1.2vw, 2.1rem); }
.aathiyoga h3 { font-size: 1.3rem; }
.aathiyoga h4 { font-size: 1.1rem; }

.aathiyoga a { color: var(--ay-saffron); text-underline-offset: .18em; }
.aathiyoga a:hover, .aathiyoga a:focus { color: var(--ay-saffron-dark); }
.aathiyoga :focus-visible { outline: 3px solid var(--ay-gold); outline-offset: 2px; border-radius: 3px; }

/* Tamil reads better with a taller line and a touch more size. */
.aathiyoga :lang(ta) { line-height: 1.8; }
.aathiyoga h1 :lang(ta), .aathiyoga h2 :lang(ta) { line-height: 1.45; }

.aathiyoga ::selection { background: var(--ay-gold-soft); color: var(--ay-ink); }

.ay-wrap {
	width: 100%;
	max-width: calc(var(--ay-wrap) + 2 * var(--ay-gutter));
	margin-inline: auto;
	padding-inline: var(--ay-gutter);
	box-sizing: border-box;
}
.ay-narrow { max-width: 820px; }

.ay-eyebrow {
	font-size: .8rem;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--ay-saffron);
	font-weight: 700;
	margin: 0 0 .5rem;
}

/* ---------- Buttons ---------- */

.ay-btn {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 0;
	padding: .65rem 1.25rem;
	border-radius: 8px;
	font-weight: 700;
	font-size: .95rem;
	line-height: 1.2;
	text-decoration: none;
	border: 2px solid transparent;
	transition: background-color .2s, color .2s, border-color .2s, transform .2s;
}
.ay-btn--primary { background: var(--ay-saffron); color: var(--ay-white) !important; }
.ay-btn--primary:hover, .ay-btn--primary:focus { background: var(--ay-saffron-dark); }
.ay-btn--ghost { border-color: currentColor; color: var(--ay-ink) !important; }
.ay-btn__ta { font-size: .78rem; font-weight: 600; opacity: .9; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-btn .l-ta { font-size: .78rem; font-weight: 600; opacity: .9; }

/* ---------- Top bar ---------- */

.ay-topbar {
	background: var(--ay-ink-2);
	color: var(--ay-mist);
	font-size: .8rem;
}
.ay-topbar__inner {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: .25rem 1.5rem;
	min-height: 36px;
	padding-block: .3rem;
}
.ay-topbar p { margin: 0; }
.ay-topbar__ids { display: flex; flex-wrap: wrap; gap: .2rem 1.1rem; }
.ay-topbar__ids strong { color: var(--ay-white); font-weight: 700; letter-spacing: .02em; }
.ay-topbar__badges { color: var(--ay-gold); font-weight: 600; }
.ay-utility__menu { list-style: none; display: flex; gap: 1rem; margin: 0; padding: 0; }
.ay-utility__menu a { color: var(--ay-mist); text-decoration: none; }
.ay-utility__menu a:hover, .ay-utility__menu a:focus { color: var(--ay-white); text-decoration: underline; }

/* ---------- Masthead ---------- */

.ay-header { background: var(--ay-white); position: relative; z-index: 60; }
.ay-masthead {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 1.25rem;
	padding-block: 1rem;
}
.ay-brand { display: flex; align-items: center; gap: .9rem; min-width: 0; }
.ay-brand__mark { flex: 0 0 auto; line-height: 0; }
.ay-brand__logo img { max-height: 70px; width: auto; }
.ay-brand__text { min-width: 0; }
.ay-brand__text p { margin: 0; }
.ay-brand__title {
	font-family: var(--ay-serif);
	font-size: clamp(1.45rem, 1.1rem + 1.2vw, 2rem);
	font-weight: 700;
	line-height: 1.1;
	letter-spacing: .01em;
}
.ay-brand__title a { color: var(--ay-ink); text-decoration: none; }
.ay-brand__sub {
	font-size: .82rem;
	text-transform: uppercase;
	letter-spacing: .12em;
	color: var(--ay-muted);
	font-weight: 600;
	margin-top: .2rem !important;
}
.ay-brand__ta { font-size: .88rem; color: var(--ay-saffron); font-weight: 600; }
.ay-masthead__actions { display: flex; align-items: center; gap: .75rem; flex: 0 0 auto; }

body.aathiyoga .ay-nav-toggle {
	display: none;
	align-items: center;
	gap: .5rem;
	padding: .6rem .8rem;
	border: 2px solid var(--ay-ink);
	border-radius: 8px;
	background: transparent;
	color: var(--ay-ink);
	font: 700 .9rem/1 var(--ay-sans);
	cursor: pointer;
	box-shadow: none;
}
body.aathiyoga .ay-nav-toggle:hover, body.aathiyoga .ay-nav-toggle:focus { background: var(--ay-ink); color: var(--ay-white); }
.ay-nav-toggle__bars { display: inline-grid; gap: 4px; }
.ay-nav-toggle__bars span { display: block; width: 18px; height: 2px; background: currentColor; transition: transform .2s, opacity .2s; }
.ay-nav-toggle[aria-expanded="true"] .ay-nav-toggle__bars span:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.ay-nav-toggle[aria-expanded="true"] .ay-nav-toggle__bars span:nth-child(2) { opacity: 0; }
.ay-nav-toggle[aria-expanded="true"] .ay-nav-toggle__bars span:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

/* ---------- Main menu ---------- */

.ay-nav {
	background: var(--ay-ink);
	border-top: 3px solid var(--ay-gold);
}
.ay-nav ul { list-style: none; margin: 0; padding: 0; }
.ay-nav .ay-menu, .ay-nav #ay-menu-fallback { display: flex; flex-wrap: wrap; align-items: stretch; }
.ay-nav li { position: relative; }
.ay-nav a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: .7rem 1rem;
	color: var(--ay-white);
	text-decoration: none;
	line-height: 1.25;
	min-height: 56px;
	box-sizing: border-box;
}
.ay-nav .menu-en, .ay-nav .menu-ta { font-weight: 600; font-size: .95rem; }
/* Both languages: the Tamil label is a second, smaller line. */
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-nav .menu-ta { font-size: .74rem; font-weight: 400; color: var(--ay-gold-soft); line-height: 1.4; }
.ay-nav a:hover, .ay-nav a:focus, .ay-nav li:focus-within > a { background: rgba(255, 255, 255, .08); color: var(--ay-white); }
.ay-nav .current-menu-item > a, .ay-nav .current-menu-ancestor > a, .ay-nav .current_page_item > a {
	box-shadow: inset 0 -3px 0 var(--ay-gold);
}
.ay-nav .menu-item-has-children > a { padding-right: 1.9rem; }
.ay-nav .menu-item-has-children > a::after {
	content: "";
	position: absolute;
	right: .85rem;
	top: 50%;
	width: 6px;
	height: 6px;
	border-right: 2px solid var(--ay-gold);
	border-bottom: 2px solid var(--ay-gold);
	transform: translateY(-70%) rotate(45deg);
}

/* Dropdowns */
.ay-nav .sub-menu {
	position: absolute;
	left: 0;
	top: 100%;
	min-width: 270px;
	background: var(--ay-white);
	border-radius: 0 0 var(--ay-radius) var(--ay-radius);
	box-shadow: var(--ay-shadow);
	border-top: 3px solid var(--ay-saffron);
	padding: .4rem 0;
	opacity: 0;
	visibility: hidden;
	transform: translateY(6px);
	transition: opacity .15s, transform .15s, visibility .15s;
	z-index: 70;
}
.ay-nav li:hover > .sub-menu, .ay-nav li:focus-within > .sub-menu, .ay-nav li.is-open > .sub-menu {
	opacity: 1;
	visibility: visible;
	transform: none;
}
.ay-nav .sub-menu a { color: var(--ay-text); min-height: 0; padding: .55rem 1.1rem; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-nav .sub-menu .menu-ta { color: var(--ay-saffron); }
.ay-nav .sub-menu a:hover, .ay-nav .sub-menu a:focus { background: var(--ay-cream); color: var(--ay-ink); }
.ay-nav .sub-menu .current-menu-item > a { box-shadow: inset 3px 0 0 var(--ay-saffron); }
.ay-subtoggle { display: none; }

/* Sticky menu bar (header slides up so only the menu stays) */
@media (min-width: 1025px) {
	.ay-sticky-nav .ay-header { position: sticky; top: calc(-1 * var(--ay-masthead-h)); }
	.admin-bar.ay-sticky-nav .ay-header { top: calc(32px - var(--ay-masthead-h)); }
}

/* ---------- Breadcrumbs ---------- */

.ay-breadcrumbs { background: var(--ay-cream); border-bottom: 1px solid var(--ay-line); font-size: .85rem; }
.ay-crumbs ol, .ay-breadcrumbs .rank-math-breadcrumb p { list-style: none; display: flex; flex-wrap: wrap; margin: 0; padding: .55rem 0; gap: .2rem; }
.ay-crumbs li { display: inline-flex; align-items: center; color: var(--ay-muted); }
.ay-crumbs li + li::before { content: "›"; margin: 0 .45rem; color: var(--ay-saffron); }
.ay-crumbs a { color: var(--ay-ink); text-decoration: none; }
.ay-crumbs a:hover { text-decoration: underline; }
.ay-breadcrumbs .rank-math-breadcrumb { padding: .55rem 0; }
.ay-breadcrumbs .rank-math-breadcrumb p { padding: 0; }

/* ---------- Content (non-Elementor pages, posts, Quick Submit pages) ---------- */

body.aathiyoga:not(.ay-elementor-page) .site-main {
	max-width: calc(var(--ay-wrap) + 2 * var(--ay-gutter));
	margin-inline: auto;
	padding: 2.5rem var(--ay-gutter) 3.5rem;
	box-sizing: border-box;
}
.aathiyoga .page-header .entry-title { margin-bottom: 1rem; }
.aathiyoga .page-content > * { max-width: 900px; }
.aathiyoga .page-content > .alignwide, .aathiyoga .page-content > .alignfull,
.aathiyoga .page-content > [class*="qsub"], .aathiyoga .page-content > [class*="qst"] { max-width: none; }

.aathiyoga table { border-collapse: collapse; width: 100%; margin: 1.25rem 0; font-size: .95rem; }
.aathiyoga th, .aathiyoga td { border: 1px solid var(--ay-line); padding: .6rem .8rem; text-align: left; vertical-align: top; }
.aathiyoga thead th, .aathiyoga th[scope="row"] { background: var(--ay-cream); color: var(--ay-ink); font-weight: 700; }
.aathiyoga blockquote {
	margin: 1.5rem 0;
	padding: 1rem 1.25rem;
	border-left: 4px solid var(--ay-gold);
	background: var(--ay-cream);
	font-family: var(--ay-serif);
	font-style: italic;
}

.aathiyoga input[type="text"], .aathiyoga input[type="email"], .aathiyoga input[type="url"],
.aathiyoga input[type="search"], .aathiyoga input[type="tel"], .aathiyoga input[type="number"],
.aathiyoga input[type="date"], .aathiyoga select, .aathiyoga textarea {
	border: 1px solid #cfc4b3;
	border-radius: 8px;
	padding: .6rem .75rem;
	font: inherit;
	color: var(--ay-text);
	background: var(--ay-white);
	max-width: 100%;
}
.aathiyoga input:focus, .aathiyoga select:focus, .aathiyoga textarea:focus {
	border-color: var(--ay-saffron);
	box-shadow: 0 0 0 3px rgba(169, 72, 26, .15);
	outline: none;
}
.aathiyoga button[type="submit"], .aathiyoga input[type="submit"] {
	background: var(--ay-saffron);
	color: var(--ay-white);
	border: 0;
	border-radius: 8px;
	padding: .7rem 1.3rem;
	font-weight: 700;
	cursor: pointer;
}
.aathiyoga button[type="submit"]:hover, .aathiyoga input[type="submit"]:hover { background: var(--ay-saffron-dark); }

.search-form { display: flex; gap: .5rem; margin: 1.25rem 0; }
.search-form label { flex: 1; }
.search-form .search-field { width: 100%; }

.ay-linklist { list-style: none; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: .6rem; }
.ay-linklist a {
	display: block;
	padding: .8rem 1rem;
	border: 1px solid var(--ay-line);
	border-radius: var(--ay-radius);
	text-decoration: none;
	color: var(--ay-ink);
	font-weight: 600;
	background: var(--ay-cream);
}
.ay-linklist a:hover { border-color: var(--ay-saffron); }
.ay-notfound { padding-block: 3rem 4rem; }

/* News posts */
.aathiyoga .post .entry-title a { color: var(--ay-ink); text-decoration: none; }

/* ---------- Footer ---------- */

.ay-footer { background: var(--ay-ink); color: var(--ay-mist); font-size: .92rem; margin-top: 0; border-top: 4px solid var(--ay-gold); }
.ay-footer a { color: var(--ay-white); text-decoration: none; }
.ay-footer a:hover, .ay-footer a:focus { color: var(--ay-gold); text-decoration: underline; }
.ay-footer__grid {
	display: grid;
	grid-template-columns: 1.5fr 1fr 1fr 1.2fr;
	gap: 2rem;
	padding-block: 3rem 2rem;
}
.ay-footer__title {
	font-family: var(--ay-serif) !important;
	color: var(--ay-white) !important;
	font-size: 1.1rem !important;
	margin: 0 0 .9rem !important;
}
.ay-footer__about .ay-footer__title { font-size: 1.6rem !important; margin-bottom: .2rem !important; }
.ay-footer__sub { margin: 0; color: var(--ay-white); font-weight: 600; }
.ay-footer__ta { margin: .2rem 0 .8rem; color: var(--ay-gold-soft); font-size: .88rem; }
.ay-footer__ids { display: flex; flex-wrap: wrap; gap: .3rem 1rem; margin: 0 0 .9rem; }
.ay-footer__ids strong { color: var(--ay-white); }
.ay-footer__menu { list-style: none; padding: 0; margin: 0; display: grid; gap: .45rem; }
.ay-footer address { font-style: normal; margin-bottom: .9rem; line-height: 1.6; }
.ay-footer__bottom { background: var(--ay-ink-2); font-size: .82rem; }
.ay-footer__bottom-inner { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.5rem; padding-block: 1rem; }
.ay-footer__bottom p { margin: 0; }
.ay-footer__licence { display: flex; align-items: center; gap: .75rem; max-width: 640px; }
.ay-cc { flex: 0 0 auto; line-height: 0; }
.ay-footer__bottom-nav ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .4rem 1rem; }


/* ---------- English / Tamil ----------
 * Text comes in pairs: span.l-en + span.l-ta (div.l-block for paragraphs).
 * The Aathiyoga Language add-on sets html[data-ajk-lang] to "en", "both" or
 * "ta" and hides the other language. With "both" – or without the add-on –
 * English comes first and Tamil sits under it.
 *   .l-compact  no room for two lines: English only when both are shown
 *   .l-both     shown only when both languages are
 * The "both" defaults have zero specificity, so component rules win.
 */
.l-ta, [lang="ta"] { letter-spacing: normal; text-transform: none; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) :where(.l-ta:not(.l-block)) { display: block; font-size: .86em; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) :where(.l-ta.l-block) { margin-top: .5em; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) :is(.l-compact, .ay-brand, .ay-footer__name, .ay-footer__sub) .l-ta,
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) body.ay-menu-en-only .ay-nav .l-ta { display: none !important; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-footer__title .l-ta { font-family: var(--ay-sans); font-size: .78rem; color: var(--ay-gold-soft); font-weight: 600; margin-top: .2rem; line-height: 1.5; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-footer__menu .l-ta { font-size: .8em; opacity: .72; line-height: 1.5; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-footer__about .l-ta.l-block { color: var(--ay-gold-soft); font-size: .92em; background: none; border-radius: 0; border-left: 2px solid var(--ay-gold); padding: 0 0 0 .8rem; margin: .2rem 0 .8rem; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-footer__licence .l-ta { margin-top: .2rem; opacity: .8; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-notfound h1 .l-ta { font-size: .6em; margin-top: .35em; }
:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-linklist .l-ta { opacity: .75; }
.ay-footer__about .l-block p { margin: 0 0 .6rem; }
/* Tamil only: Tamil script reads larger than Latin at the same size. */
html[data-ajk-lang="ta"] .ay-notfound h1 .l-ta { font-size: .8em; }

/* ---------- Responsive ---------- */

@media (max-width: 1024px) {
	body.aathiyoga .ay-nav-toggle { display: inline-flex; }
	.ay-topbar__badges { display: none; }
	.ay-nav { display: none; border-top-width: 2px; }
	.ay-nav.is-open { display: block; }
	.ay-nav .ay-menu, .ay-nav #ay-menu-fallback { flex-direction: column; padding-block: .4rem; }
	.ay-nav a { min-height: 0; padding: .7rem .25rem; flex-direction: row; flex-wrap: wrap; align-items: baseline; justify-content: flex-start; gap: 0 .6rem; text-align: left; }
	.ay-nav .current-menu-item > a, .ay-nav .current-menu-ancestor > a, .ay-nav .current_page_item > a { box-shadow: inset 3px 0 0 var(--ay-gold); padding-left: .75rem; }
	.ay-nav li { border-bottom: 1px solid rgba(255, 255, 255, .08); }
	.ay-nav .menu-item-has-children > a { padding-right: 3rem; }
	.ay-nav .menu-item-has-children > a::after { display: none; }
	body.aathiyoga .ay-subtoggle {
		display: inline-flex;
		padding: 0;
		border-radius: 0;
		box-shadow: none;
		position: absolute;
		right: 0;
		top: 4px;
		width: 44px;
		height: 40px;
		align-items: center;
		justify-content: center;
		border: 0;
		background: transparent;
		color: var(--ay-gold);
		cursor: pointer;
	}
	.ay-subtoggle::before {
		content: "";
		width: 8px;
		height: 8px;
		border-right: 2px solid currentColor;
		border-bottom: 2px solid currentColor;
		transform: rotate(45deg);
		transition: transform .2s;
	}
	.ay-subtoggle[aria-expanded="true"]::before { transform: rotate(-135deg); }
	.ay-nav .sub-menu {
		position: static;
		opacity: 1;
		visibility: visible;
		transform: none;
		display: none;
		box-shadow: none;
		border-top: 0;
		border-radius: 0;
		background: rgba(255, 255, 255, .05);
		min-width: 0;
		padding: 0 0 .4rem .9rem;
	}
	.ay-nav li.is-open > .sub-menu { display: block; }
	.ay-nav .sub-menu a { color: var(--ay-white); }
	:where(html:not([data-ajk-lang="en"]):not([data-ajk-lang="ta"])) .ay-nav .sub-menu .menu-ta { color: var(--ay-gold-soft); }
	.ay-nav .sub-menu a:hover, .ay-nav .sub-menu a:focus { background: rgba(255, 255, 255, .08); color: var(--ay-white); }
	.ay-footer__grid { grid-template-columns: 1fr 1fr; }
}

@media (max-width: 767px) {
	body.aathiyoga { font-size: 16px; }
	:root { --ay-gutter: 16px; }
	.ay-topbar__badges { display: none; }
	.ay-masthead { padding-block: .75rem; }
	.ay-brand { gap: .6rem; }
	.ay-brand__mark svg { width: 42px; height: 42px; }
	.ay-brand__logo img { max-height: 52px; }
	.ay-brand__title { font-size: 1.4rem; }
	.ay-brand__sub { font-size: .62rem; letter-spacing: .06em; line-height: 1.35; }
	.ay-brand__ta { display: none; }
	.ay-masthead__cta { display: none; }
	.ay-topbar__inner { justify-content: center; text-align: center; }
	body.aathiyoga .ay-nav-toggle { padding: .55rem .65rem; }
	.ay-footer__grid { grid-template-columns: 1fr; gap: 1.6rem; padding-block: 2.2rem 1.5rem; }
}

@media (prefers-reduced-motion: reduce) {
	.aathiyoga *, .aathiyoga *::before, .aathiyoga *::after { transition: none !important; animation: none !important; }
}

@media print {
	.ay-topbar, .ay-nav, .ay-nav-toggle, .ay-breadcrumbs, .ay-footer__grid nav { display: none !important; }
	.ay-footer { background: none; color: #000; }
}
