/*
 * Norah Soft Yoga visual system, version 3.0.1.
 *
 * This is the opinionated brand skin for the native Bricks homepage. It uses
 * Radix Themes' contextual radius and semantic color-scale ideas as a
 * foundation, then defines Norah's own warm, feminine, yoga-inspired visual
 * language:
 * https://www.radix-ui.com/themes/docs/theme/radius
 * https://www.radix-ui.com/themes/docs/theme/color
 *
 * The approved Bricks font pairing follows the canonical HTML prototype:
 * Ysabeau for display and brand roles, Barlow Semi Condensed for body and UI,
 * and Caveat for the signature. The HTML prototype remains unchanged.
 */

:root {
	/* Emotional palette: warm canvas, soft pastels, grounded plum. */
	--norah-yoga-canvas: #f6f0e9;
	--norah-yoga-paper: #fffdfa;
	--norah-yoga-blush: #e6c5c0;
	--norah-yoga-blush-deep: #a96f6b;
	--norah-yoga-lavender: #d8cee0;
	--norah-yoga-sage: #b5c3ad;
	--norah-yoga-plum: #4b3e49;
	--norah-yoga-plum-soft: #6e5d67;
	--norah-yoga-line: rgba(75, 62, 73, 0.2);
	--norah-yoga-line-on-pastel: rgba(75, 62, 73, 0.28);
	--norah-yoga-white-line: rgba(255, 253, 250, 0.55);

	/* Approved three-font pairing from the canonical HTML prototype. */
	--norah-yoga-font-display: "Ysabeau", sans-serif;
	--norah-yoga-font-body: "Barlow Semi Condensed", sans-serif;
	--norah-yoga-font-brand: "Ysabeau", sans-serif;
	--norah-yoga-font-signature: "Caveat", cursive;

	/* Visible role hierarchy. Eyebrows are metadata, never body copy. */
	--norah-yoga-type-body: clamp(1.7rem, 1.55rem + 0.2vw, 1.95rem);
	--norah-yoga-type-h1: clamp(5.8rem, 6vw, 9.2rem);
	--norah-yoga-type-h2: clamp(4.5rem, 4.7vw, 7rem);
	--norah-yoga-type-h3: clamp(2.4rem, 2.2vw, 3.2rem);
	--norah-yoga-type-h4: clamp(2.1rem, 1.9vw, 2.8rem);
	--norah-yoga-type-intro: clamp(2rem, 1.7rem + 0.65vw, 2.8rem);
	--norah-yoga-type-lead: clamp(2.4rem, 2.5vw, 3.8rem);
	--norah-yoga-type-quote: clamp(3.4rem, 3.6vw, 5.6rem);
	--norah-yoga-type-link: clamp(2rem, 2.1vw, 2.8rem);
	--norah-yoga-type-eyebrow: 1.2rem;
	--norah-yoga-type-control: 1.3rem;
	--norah-yoga-type-micro: 1.25rem;
	--norah-yoga-leading-display: 0.92;
	--norah-yoga-leading-body: 1.65;
	--norah-yoga-leading-quote: 1.08;

	/* Shape language: every major surface is visibly soft and intentional. */
	--norah-yoga-radius-note: 2.4rem 2.4rem 2.4rem 0.8rem;
	--norah-yoga-radius-card: 3.6rem;
	--norah-yoga-radius-panel: 4.8rem;
	--norah-yoga-radius-control: 999px;
	--norah-yoga-radius-circle: 50%;
	--norah-yoga-radius-arch: 50% 50% 4.8rem 4.8rem;
	--norah-yoga-radius-photo: 50% 50% 4.8rem 4.8rem;
	--norah-yoga-control-height: 5.2rem;
	--norah-yoga-shadow-soft: 0 2.4rem 6rem rgba(75, 62, 73, 0.11);
	--norah-yoga-shadow-card: 0 1.6rem 4.8rem rgba(75, 62, 73, 0.08);
	--norah-yoga-motion: 220ms cubic-bezier(0.22, 1, 0.36, 1);
}

/* Keep the existing Bricks interface stable while changing its visual skin. */
:root {
	--norah-color-page: var(--norah-yoga-canvas);
	--norah-color-surface: var(--norah-yoga-paper);
	--norah-color-surface-strong: var(--norah-yoga-paper);
	--norah-color-accent: var(--norah-yoga-blush);
	--norah-color-accent-strong: var(--norah-yoga-blush-deep);
	--norah-color-text: var(--norah-yoga-plum);
	--norah-color-text-muted: var(--norah-yoga-plum-soft);
	--norah-color-on-accent: var(--norah-yoga-plum);
	--norah-color-on-dark: var(--norah-yoga-paper);
	--norah-color-border: var(--norah-yoga-line);
	--norah-color-border-on-accent: var(--norah-yoga-line-on-pastel);
	--norah-color-border-on-light: var(--norah-yoga-white-line);
	--norah-color-muted-on-dark: rgba(255, 253, 250, 0.76);

	--norah-type-body-size: var(--norah-yoga-type-body);
	--norah-type-body-leading: var(--norah-yoga-leading-body);
	--norah-type-h1: var(--norah-yoga-type-h1);
	--norah-type-h2: var(--norah-yoga-type-h2);
	--norah-type-h3: var(--norah-yoga-type-h3);
	--norah-type-h4: var(--norah-yoga-type-h4);
	--norah-type-intro: var(--norah-yoga-type-intro);
	--norah-type-lead: var(--norah-yoga-type-lead);
	--norah-type-quote: var(--norah-yoga-type-quote);
	--norah-type-label: var(--norah-yoga-type-eyebrow);
	--norah-type-nav: var(--norah-yoga-type-control);
	--norah-type-control: var(--norah-yoga-type-control);
	--norah-type-control-small: var(--norah-yoga-type-control);
	--norah-type-micro: var(--norah-yoga-type-micro);
	--norah-leading-tight: var(--norah-yoga-leading-display);
	--norah-leading-copy: var(--norah-yoga-leading-body);
	--norah-leading-quote: var(--norah-yoga-leading-quote);
	--norah-font-display: var(--norah-yoga-font-display);
	--norah-font-body: var(--norah-yoga-font-body);
	--norah-font-brand: var(--norah-yoga-font-brand);
	--norah-font-signature: var(--norah-yoga-font-signature);
	--norah-radius-sm: 1.6rem;
	--norah-radius-md: 2.4rem;
	--norah-radius-lg: var(--norah-yoga-radius-panel);
	--norah-radius-pill: var(--norah-yoga-radius-control);
	--norah-radius-orb: var(--norah-yoga-radius-circle);
	--norah-radius-arch: var(--norah-yoga-radius-arch);
	--norah-radius-photo: var(--norah-yoga-radius-photo);
	--norah-radius: var(--norah-yoga-radius-card);
	--norah-shadow-orb: var(--norah-yoga-shadow-soft);
	--norah-shadow-note: var(--norah-yoga-shadow-card);
	--norah-motion-duration: 220ms;
	--norah-motion-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--norah-control-height: var(--norah-yoga-control-height);
}

body:has(.norah-home) {
	background: var(--norah-yoga-canvas);
	color: var(--norah-yoga-plum);
	font-family: var(--norah-yoga-font-body);
}

.norah-home {
	color: var(--norah-yoga-plum);
}

.norah-home h1,
.norah-home h2,
.norah-home h3,
.norah-home h4 {
	color: var(--norah-yoga-plum);
	font-family: var(--norah-yoga-font-display);
	font-weight: 500;
	letter-spacing: -0.025em;
	line-height: var(--norah-yoga-leading-display);
	text-transform: none;
}

.norah-home h1 {
	max-width: 12.5ch;
	margin-bottom: 3.2rem;
	font-size: var(--norah-yoga-type-h1);
}

.norah-home h2 {
	max-width: 12ch;
	margin-bottom: 2.8rem;
	font-size: var(--norah-yoga-type-h2);
}

.norah-home h3 {
	margin-bottom: 1.2rem;
	font-size: var(--norah-yoga-type-h3);
}

.norah-home h4 {
	margin-bottom: 1rem;
	font-size: var(--norah-yoga-type-h4);
}

.norah-home p {
	font-family: var(--norah-yoga-font-body);
}

.norah-home :focus-visible {
	outline: 3px solid var(--norah-yoga-paper);
	outline-offset: 3px;
	box-shadow: 0 0 0 6px var(--norah-yoga-plum);
}

.norah-home a {
	transition: color var(--norah-yoga-motion), background-color var(--norah-yoga-motion), border-color var(--norah-yoga-motion), box-shadow var(--norah-yoga-motion), transform var(--norah-yoga-motion), opacity var(--norah-yoga-motion);
}

/* Header: a soft paper threshold into the ritual. */
.norah-home .norah-header {
	background: var(--norah-yoga-paper);
	border-bottom: 1px solid rgba(75, 62, 73, 0.08);
	box-shadow: 0 1.2rem 3rem rgba(75, 62, 73, 0.04);
}

.norah-home .norah-nav {
	gap: 3.2rem;
}

.norah-home .norah-nav__link,
.norah-home .norah-footer__link {
	color: var(--norah-yoga-plum-soft);
	font-family: var(--norah-yoga-font-body);
	font-size: 1.25rem;
	font-weight: 700;
	letter-spacing: 0.09em;
}

.norah-home .norah-nav__link:hover,
.norah-home .norah-footer__link:hover {
	color: var(--norah-yoga-blush-deep);
}

.norah-home .norah-button {
	min-height: var(--norah-yoga-control-height);
	padding-inline: 2.8rem;
	border: 1px solid var(--norah-yoga-plum);
	border-radius: var(--norah-yoga-radius-control);
	background: var(--norah-yoga-plum);
	box-shadow: 0 1rem 2.4rem rgba(75, 62, 73, 0.12);
	color: var(--norah-yoga-paper) !important;
	font-family: var(--norah-yoga-font-body);
	font-size: var(--norah-yoga-type-control);
	font-weight: 800;
	letter-spacing: 0.09em;
}

.norah-home .norah-button:hover {
	border-color: var(--norah-yoga-blush-deep);
	background: var(--norah-yoga-blush-deep);
	box-shadow: 0 1.4rem 3rem rgba(75, 62, 73, 0.17);
	color: var(--norah-yoga-paper) !important;
	transform: translateY(-3px);
}

.norah-home .norah-button--light {
	border-color: var(--norah-yoga-paper);
	background: var(--norah-yoga-paper);
	color: var(--norah-yoga-plum) !important;
}

.norah-home .norah-button--light:hover {
	border-color: var(--norah-yoga-blush);
	background: var(--norah-yoga-blush);
	color: var(--norah-yoga-plum) !important;
}

.norah-home .norah-eyebrow {
	margin-bottom: 2.4rem;
	color: var(--norah-yoga-blush-deep);
	font-family: var(--norah-yoga-font-body);
	font-size: var(--norah-yoga-type-eyebrow);
	font-weight: 800;
	letter-spacing: 0.17em;
	line-height: 1.45;
}

.norah-home .norah-text-link {
	color: var(--norah-yoga-plum-soft);
	font-family: var(--norah-yoga-font-body);
	font-size: var(--norah-yoga-type-control);
	font-weight: 700;
}

.norah-home .norah-text-link:hover {
	color: var(--norah-yoga-blush-deep);
}

/* Hero: the photograph sits inside a continuous halo, not a rounded box. */
.norah-home .norah-hero {
	position: relative;
	isolation: isolate;
	overflow: clip;
	background: var(--norah-yoga-canvas);
}

.norah-home .norah-hero::before {
	content: "";
	position: absolute;
	z-index: -1;
	top: -34rem;
	right: -15rem;
	width: min(64vw, 78rem);
	height: min(64vw, 78rem);
	border: 1px solid rgba(169, 111, 107, 0.2);
	border-radius: var(--norah-yoga-radius-circle);
}

.norah-home .norah-hero__grid {
	position: relative;
	z-index: 1;
}

.norah-home .norah-hero h1 {
	max-width: 12.5ch;
	color: var(--norah-yoga-plum);
}

.norah-home .norah-hero__intro {
	max-width: 58rem;
	color: var(--norah-yoga-plum-soft);
	font-size: var(--norah-yoga-type-intro);
	line-height: 1.45;
}

.norah-home .norah-microcopy {
	color: var(--norah-yoga-blush-deep);
	font-size: var(--norah-yoga-type-micro);
	font-weight: 700;
	letter-spacing: 0.04em;
}

.norah-home .norah-hero__arch {
	border-radius: var(--norah-yoga-radius-arch);
	background: var(--norah-yoga-blush);
	box-shadow: var(--norah-yoga-shadow-soft);
}

.norah-home .norah-hero__arch::before {
	border-color: rgba(75, 62, 73, 0.28);
	border-radius: var(--norah-yoga-radius-circle);
}

.norah-home .norah-hero__arch::after {
	border-color: rgba(255, 253, 250, 0.82);
	border-radius: var(--norah-yoga-radius-circle);
}

.norah-home .norah-hero__orb {
	border: 1px solid rgba(255, 255, 255, 0.68);
	background-color: rgba(246, 243, 237, 0.16);
	background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.22), rgba(246, 243, 237, 0.06));
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.56), inset -1px -1px 0 rgba(71, 75, 72, 0.05), 0 1rem 2.4rem rgba(71, 75, 72, 0.1);
	-webkit-backdrop-filter: blur(14px) saturate(115%);
	backdrop-filter: blur(14px) saturate(115%);
	transition: none;
	transform: none;
	pointer-events: none;
}

.norah-home .norah-hero__note {
	padding: 2rem 2.4rem;
	border: 1px solid rgba(255, 255, 255, 0.68);
	border-radius: var(--norah-yoga-radius-note);
	background-color: rgba(246, 243, 237, 0.16);
	background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.22), rgba(246, 243, 237, 0.06));
	box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.56), inset -1px -1px 0 rgba(71, 75, 72, 0.05), 0 1rem 2.4rem rgba(71, 75, 72, 0.1);
	-webkit-backdrop-filter: blur(14px) saturate(115%);
	backdrop-filter: blur(14px) saturate(115%);
	overflow: hidden;
	pointer-events: none;
	transition: none;
	color: var(--norah-yoga-plum-soft);
	font-size: var(--norah-yoga-type-micro);
	font-weight: 600;
}

/* Belief: a lavender breathing space, bounded like a soft meditation mat. */
.norah-home .norah-belief {
	width: var(--norah-page);
	margin-inline: auto;
	border-radius: var(--norah-yoga-radius-panel);
	background: var(--norah-yoga-lavender);
	color: var(--norah-yoga-plum);
	overflow: clip;
}

.norah-home .norah-belief .norah-eyebrow,
.norah-home .norah-belief h2 {
	color: var(--norah-yoga-plum);
}

.norah-home .norah-belief h2 {
	max-width: 9ch;
}

.norah-home .norah-belief__quote-text {
	color: var(--norah-yoga-plum);
	font-family: var(--norah-yoga-font-display);
	font-size: var(--norah-yoga-type-quote);
	font-style: italic;
	font-weight: 500;
	letter-spacing: -0.02em;
	line-height: var(--norah-yoga-leading-quote);
}

.norah-home .norah-belief__cite {
	color: var(--norah-yoga-plum-soft);
	font-family: var(--norah-yoga-font-body);
	font-size: var(--norah-yoga-type-micro);
	font-weight: 800;
	letter-spacing: 0.14em;
}

/* Why: small rounded cards make the two invitations feel tangible. */
.norah-home .norah-why,
.norah-home .norah-about,
.norah-home .norah-contact {
	background: var(--norah-yoga-canvas);
}

.norah-home .norah-section-heading h2,
.norah-home .norah-why__lead,
.norah-home .norah-about__copy h2,
.norah-home .norah-contact__heading h2 {
	color: var(--norah-yoga-plum);
}

.norah-home .norah-why__lead {
	font-size: var(--norah-yoga-type-lead);
	line-height: 1.25;
}

.norah-home .norah-why__points {
	gap: 2.4rem;
}

.norah-home .norah-point {
	padding: 3.2rem 3rem 3.6rem;
	border: 1px solid var(--norah-yoga-line);
	border-top: 0.4rem solid var(--norah-yoga-blush);
	border-radius: var(--norah-yoga-radius-card);
	background: var(--norah-yoga-paper);
	box-shadow: var(--norah-yoga-shadow-card);
}

.norah-home .norah-point h3 {
	color: var(--norah-yoga-blush-deep);
}

.norah-home .norah-point p {
	color: var(--norah-yoga-plum-soft);
}

/* Process: sage, numbered, circular, and deliberately ritual-like. */
.norah-home .norah-process {
	position: relative;
	isolation: isolate;
	border-radius: var(--norah-yoga-radius-panel);
	background: var(--norah-yoga-sage);
	box-shadow: var(--norah-yoga-shadow-soft);
	overflow: clip;
}

.norah-home .norah-process::after {
	content: "";
	position: absolute;
	z-index: -1;
	right: -18rem;
	bottom: -25rem;
	width: 56rem;
	height: 56rem;
	border: 1px solid rgba(75, 62, 73, 0.18);
	border-radius: var(--norah-yoga-radius-circle);
}

.norah-home .norah-process .norah-eyebrow,
.norah-home .norah-process h2,
.norah-home .norah-process h3,
.norah-home .norah-process p {
	color: var(--norah-yoga-plum);
}

.norah-home .norah-process__intro h2 {
	max-width: 10ch;
}

.norah-home .norah-process__steps {
	counter-reset: norah-yoga-step;
}

.norah-home .norah-process__step {
	position: relative;
	padding: 3.2rem 0 3.2rem 6.8rem;
	border-color: var(--norah-yoga-line-on-pastel);
	counter-increment: norah-yoga-step;
}

.norah-home .norah-process__step::before {
	content: counter(norah-yoga-step, decimal-leading-zero);
	position: absolute;
	top: 2.5rem;
	left: 0;
	display: grid;
	width: 4.2rem;
	height: 4.2rem;
	place-items: center;
	border: 1px solid var(--norah-yoga-plum);
	border-radius: var(--norah-yoga-radius-circle);
	color: var(--norah-yoga-plum);
	font-family: var(--norah-yoga-font-body);
	font-size: 1.15rem;
	font-weight: 800;
	letter-spacing: 0.04em;
}

.norah-home .norah-process__step h3 {
	font-size: var(--norah-yoga-type-h3);
}

/* About: a rounded portrait and a soft moon behind it. */
.norah-home .norah-about__visual {
	background: transparent;
}

.norah-home .norah-about__visual::before {
	width: 78%;
	background: var(--norah-yoga-lavender);
	box-shadow: 0 1.6rem 4rem rgba(75, 62, 73, 0.08);
}

.norah-home .norah-about__image {
	border-radius: var(--norah-yoga-radius-photo);
	box-shadow: var(--norah-yoga-shadow-soft);
}

.norah-home .norah-about__copy h2 {
	max-width: 11ch;
}

.norah-home .norah-about__copy > p:not(.norah-eyebrow, .norah-signature) {
	color: var(--norah-yoga-plum-soft);
}

.norah-home .norah-signature {
	color: var(--norah-yoga-blush-deep);
	font-family: var(--norah-yoga-font-signature);
}

/* Offer: paper and plum, with soft card edges instead of hard UI boxes. */
.norah-home .norah-offer {
	background: var(--norah-yoga-blush);
	color: var(--norah-yoga-plum);
}

.norah-home .norah-offer__intro {
	border: 1px solid rgba(75, 62, 73, 0.12);
	border-radius: var(--norah-yoga-radius-panel);
	background: var(--norah-yoga-paper);
	box-shadow: var(--norah-yoga-shadow-card);
}

.norah-home .norah-offer .norah-eyebrow,
.norah-home .norah-offer h2 {
	color: var(--norah-yoga-plum);
}

.norah-home .norah-offer__card {
	border-radius: var(--norah-yoga-radius-panel);
	background: var(--norah-yoga-plum);
	box-shadow: var(--norah-yoga-shadow-soft);
	color: var(--norah-yoga-paper);
}

.norah-home .norah-offer__card h3 {
	color: var(--norah-yoga-paper);
	font-size: clamp(3.2rem, 3vw, 4.2rem);
	text-transform: none;
}

.norah-home .norah-offer__card p,
.norah-home .norah-offer__card li {
	color: rgba(255, 253, 250, 0.86);
}

.norah-home .norah-offer__card h3 {
	border-bottom-color: rgba(255, 253, 250, 0.28);
}

.norah-home .norah-offer__list li::before {
	border: 0;
	border-radius: var(--norah-yoga-radius-circle);
	background: var(--norah-yoga-blush);
	transform: none;
}

.norah-home .norah-offer__note {
	color: rgba(255, 253, 250, 0.7);
}

/* Contact: an inviting soft panel rather than a detached line and link. */
.norah-home .norah-contact__action {
	padding: 4.8rem;
	border: 0;
	border-radius: var(--norah-yoga-radius-panel);
	background: var(--norah-yoga-lavender);
	box-shadow: var(--norah-yoga-shadow-card);
}

.norah-home .norah-contact__action p {
	color: var(--norah-yoga-plum-soft);
}

.norah-home .norah-contact__action .norah-email-link {
	margin-top: 3.2rem;
	padding-bottom: 1.2rem;
	border-bottom: 2px solid var(--norah-yoga-plum);
	border-radius: 0;
	background: transparent !important;
	color: var(--norah-yoga-plum) !important;
	font-family: var(--norah-yoga-font-display);
	font-size: var(--norah-yoga-type-link);
	font-weight: 600;
}

.norah-home .norah-contact__action .norah-email-link:hover {
	border-bottom-color: var(--norah-yoga-blush-deep);
	color: var(--norah-yoga-blush-deep) !important;
}

.norah-home .norah-boundary {
	border: 1px solid var(--norah-yoga-line);
	border-radius: var(--norah-yoga-radius-panel);
	background: var(--norah-yoga-paper);
	color: var(--norah-yoga-plum-soft);
	font-size: var(--norah-yoga-type-micro);
	text-align: center;
}

/* Footer: the dark grounding surface closes the page like a calm exhale. */
.norah-home .norah-footer {
	border-radius: var(--norah-yoga-radius-panel) var(--norah-yoga-radius-panel) 0 0;
	background: var(--norah-yoga-plum);
	color: var(--norah-yoga-paper);
}

.norah-home .norah-footer .norah-brand__logo {
	filter: brightness(0) invert(1);
	opacity: 0.88;
}

.norah-home .norah-footer__copyright,
.norah-home .norah-footer__link {
	color: rgba(255, 253, 250, 0.78);
	font-family: var(--norah-yoga-font-body);
}

@media (max-width: 52rem) {
	.norah-home .norah-belief {
		border-radius: 3.6rem;
	}

	.norah-home .norah-contact__action {
		padding: 3.6rem;
	}
}

@media (max-width: 36rem) {
	:root {
		--norah-yoga-radius-panel: 3.2rem;
		--norah-yoga-radius-card: 2.8rem;
		--norah-yoga-type-h1: clamp(5rem, 13vw, 6.8rem);
		--norah-yoga-type-h2: clamp(4.2rem, 10.5vw, 5.8rem);
	}

	.norah-home .norah-belief,
	.norah-home .norah-process {
		width: 100%;
		border-radius: 3.2rem;
	}

	.norah-home .norah-process__step {
		padding-left: 5.8rem;
	}

	.norah-home .norah-contact__action {
		padding: 3.2rem 2.4rem;
	}
}

@media (prefers-reduced-motion: reduce) {
	.norah-home *,
	.norah-home *::before,
	.norah-home *::after {
		transition-duration: 0.01ms !important;
	}
}
