/* Mezbaan marketing site
Palette and type follow the Mezbaan brand and interface concepts (Oct 2026):
cream fields, pomegranate panels, Kohl text, one turmeric highlight. */

/* ------------------------------------------------------------------ fonts */
@font-face {
font-family: 'Inter';
font-style: normal;
font-display: swap;
font-weight: 100 900;
src: url('../fonts/inter-latin-opsz-normal.woff2') format('woff2-variations'),
url('../fonts/inter-latin-opsz-normal.woff2') format('woff2');
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
@font-face {
font-family: 'Inter';
font-style: normal;
font-display: swap;
font-weight: 100 900;
src: url('../fonts/inter-latin-ext-opsz-normal.woff2') format('woff2-variations'),
url('../fonts/inter-latin-ext-opsz-normal.woff2') format('woff2');
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
@font-face {
font-family: 'Noto Serif Devanagari';
font-style: normal;
font-display: swap;
font-weight: 700;
src: url('../fonts/noto-serif-devanagari-devanagari-700-normal.woff2') format('woff2');
unicode-range: U+0900-097F, U+1CD0-1CF9, U+200C-200D, U+20A8, U+20B9, U+20F0, U+25CC, U+A830-A839, U+A8E0-A8FF;
}

/* ----------------------------------------------------------------- tokens */
:root {
--pom: #9b1d3a;
--pom-700: #831931;
--pom-800: #6e1529;
--pom-900: #4c0f1e;
--pom-300: #d9909f;
--pom-100: #f7e3e8;
--pom-50: #fcf1f3;
--cardamom: #5c7a3a;
--cardamom-700: #46612a;
--cardamom-100: #e6eedc;
--turmeric: #e8a317;
--turmeric-text: #855a06;
--turmeric-100: #fbefd2;
--kohl: #231f20;
--cream: #fff8ec;
--sand: #fbf1e1;
--paper: #ffffff;
--slate: #6b5e57;
--line: #e7dccb;
--line-strong: #d9cbb4;
--error: #b3261e;
--error-bg: #fbe4e1;
--info: #2f5fa8;
--info-bg: #e4ecf8;

--font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
--font-deva: 'Noto Serif Devanagari', 'Inter', serif;

--step--2: 0.8125rem;
--step--1: 0.9375rem;
--step-0: 1.0625rem;
--step-1: 1.25rem;
--step-2: clamp(1.375rem, 1.2rem + 0.6vw, 1.625rem);
--step-3: clamp(1.75rem, 1.35rem + 1.5vw, 2.5rem);
--step-4: clamp(2.25rem, 1.55rem + 2.9vw, 3.75rem);
--step-5: clamp(2.6rem, 1.4rem + 5vw, 5.25rem);

--gutter: clamp(1rem, 4vw, 2.5rem);
--maxw: 72rem;
--section: clamp(3.5rem, 8vw, 7rem);

--r-sm: 10px;
--r-md: 14px;
--r-lg: 18px;
--r-xl: 22px;

--shadow-1: 0 1px 0 rgba(76, 15, 30, 0.04), 0 1px 2px rgba(76, 15, 30, 0.05);
--shadow-2: 0 1px 0 rgba(76, 15, 30, 0.04), 0 18px 40px -22px rgba(76, 15, 30, 0.28);
--focus: 0 0 0 3px var(--cream), 0 0 0 5px var(--pom);
}

/* ------------------------------------------------------------------- base */
*, *::before, *::after { box-sizing: border-box; }

html {
-webkit-text-size-adjust: 100%;
text-size-adjust: 100%;
scroll-padding-top: 6rem;
}

body {
margin: 0;
background: var(--cream);
color: var(--kohl);
font-family: var(--font);
font-size: var(--step-0);
line-height: 1.6;
font-optical-sizing: auto;
font-feature-settings: 'cv11' 1;
text-rendering: optimizeLegibility;
-webkit-font-smoothing: antialiased;
overflow-x: hidden;
}

img, svg { display: block; max-width: 100%; }
figure { margin: 0; }
img { height: auto; }

h1, h2, h3, h4 {
margin: 0;
color: var(--kohl);
font-weight: 700;
line-height: 1.12;
letter-spacing: -0.018em;
text-wrap: balance;
}

p { margin: 0; text-wrap: pretty; }
ul, ol { margin: 0; padding: 0; }
[role='list'] { list-style: none; }

a { color: var(--pom); text-underline-offset: 0.18em; text-decoration-thickness: 1px; }
a:hover { color: var(--pom-700); text-decoration-thickness: 2px; }

:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 6px; }

.deva { font-family: var(--font-deva); font-weight: 700; letter-spacing: 0; }

.visually-hidden {
position: absolute !important;
width: 1px; height: 1px;
padding: 0; margin: -1px;
overflow: hidden; clip: rect(0 0 0 0);
white-space: nowrap; border: 0;
}

.skip-link {
position: absolute;
left: 1rem; top: -4rem;
z-index: 100;
padding: 0.75rem 1rem;
background: var(--kohl);
color: #fff;
font-weight: 600;
border-radius: var(--r-sm);
text-decoration: none;
}
.skip-link:focus { top: 1rem; color: #fff; }

.container { width: min(100% - 2 * var(--gutter), var(--maxw)); margin-inline: auto; }
.prose-width { max-width: 42rem; }

.icon { flex: none; }

/* ----------------------------------------------------------------- header */
.site-header {
position: sticky;
top: 0;
z-index: 50;
background: rgba(255, 248, 236, 0.96);
border-bottom: 1px solid var(--line);
}
@supports (backdrop-filter: blur(8px)) {
.site-header { background: rgba(255, 248, 236, 0.86); backdrop-filter: saturate(1.2) blur(10px); }
}
.site-header__bar {
display: flex;
align-items: center;
gap: 1.5rem;
min-height: 4.5rem;
}
.brand {
display: inline-flex;
flex-direction: column;
gap: 0.3rem;
text-decoration: none;
margin-right: auto;
padding: 0.25rem 0;
}
.brand .logo { width: 138px; height: auto; }
.endorsement {
font-size: 0.625rem;
font-weight: 500;
letter-spacing: 0.18em;
text-transform: uppercase;
color: var(--slate);
line-height: 1;
white-space: nowrap;
}
.endorsement--dark { color: var(--pom-100); }

.site-nav__list { display: flex; align-items: center; gap: 0.15rem; list-style: none; }
.site-nav__link {
display: block;
padding: 0.5rem 0.65rem;
border-radius: 8px;
color: var(--kohl);
font-size: 0.9375rem;
font-weight: 500;
text-decoration: none;
white-space: nowrap;
}
.site-nav__link:hover { color: var(--pom); background: var(--pom-50); }
.site-nav__link[aria-current='page'] { color: var(--pom); box-shadow: inset 0 -2px 0 var(--pom); border-radius: 0; }
.site-nav__link[aria-current='page']:focus-visible { box-shadow: var(--focus); border-radius: 6px; }
.site-header__actions { display: flex; align-items: center; gap: 0.5rem; }
.signin-link { font-weight: 500; font-size: 0.9375rem; color: var(--kohl); text-decoration: none; padding: 0.5rem 0.6rem; border-radius: 8px; }
.signin-link:hover { color: var(--pom); }

.nav-toggle {
display: none;
align-items: center;
gap: 0.4rem;
min-height: 44px;
padding: 0.5rem 0.85rem;
border: 1px solid var(--line-strong);
border-radius: 12px;
background: var(--paper);
color: var(--kohl);
font: inherit;
font-weight: 600;
font-size: 0.9375rem;
cursor: pointer;
}
.nav-toggle .icon-close { display: none; }
.nav-toggle[aria-expanded='true'] .icon-open { display: none; }
.nav-toggle[aria-expanded='true'] .icon-close { display: block; }

@media (max-width: 74.99rem) {
.nav-toggle { display: inline-flex; }
.site-nav {
display: none;
position: absolute;
left: 0; right: 0; top: 100%;
background: var(--cream);
border-bottom: 1px solid var(--line);
box-shadow: 0 24px 40px -24px rgba(76, 15, 30, 0.35);
max-height: calc(100vh - 4.5rem);
overflow-y: auto;
}
.site-nav.is-open { display: block; }
.site-nav__list {
flex-direction: column;
align-items: stretch;
gap: 0;
width: min(100% - 2 * var(--gutter), var(--maxw));
margin: 0 auto;
padding: 0.5rem 0 1.25rem;
}
.site-nav__link { padding: 0.85rem 0.25rem; font-size: 1.0625rem; border-bottom: 1px solid var(--line); border-radius: 0; }
.site-nav__link[aria-current='page'] { box-shadow: inset 3px 0 0 var(--pom); padding-left: 0.85rem; }
.site-nav__mobile-cta { display: block; padding-top: 1rem; }
.site-header__actions .btn--header, .site-header__actions .signin-link { display: none; }
}
@media (min-width: 75rem) {
.site-nav__mobile-cta { display: none; }
}
@media (max-width: 26rem) {
.brand .logo { width: 124px; }
.endorsement { font-size: 0.5625rem; }
}

/* ---------------------------------------------------------------- buttons */
.actions { display: flex; flex-wrap: wrap; gap: 0.75rem; align-items: center; }
.btn {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.5rem;
min-height: 48px;
padding: 0.75rem 1.35rem;
border: 1px solid transparent;
border-radius: 12px;
font: inherit;
font-weight: 600;
font-size: 1rem;
line-height: 1.2;
text-decoration: none;
cursor: pointer;
transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.btn:hover { text-decoration: none; }
.btn--primary { background: var(--pom); color: #fff; }
.btn--primary:hover { background: var(--pom-700); color: #fff; }
.btn--secondary { background: transparent; color: var(--kohl); border-color: var(--line-strong); }
.btn--secondary:hover { border-color: var(--pom); color: var(--pom); }
.btn--light { background: var(--cream); color: var(--pom-900); }
.btn--light:hover { background: #fff; color: var(--pom); }
.btn--light:focus-visible { box-shadow: 0 0 0 3px var(--pom), 0 0 0 5px var(--cream); }
.btn--header { min-height: 42px; padding: 0.55rem 1rem; font-size: 0.9375rem; }
.btn[disabled], .btn[aria-disabled='true'] { background: #e9e0d3; color: #6b5e57; border-color: #e9e0d3; cursor: not-allowed; }

.text-link { font-weight: 600; text-decoration: underline; }

/* ------------------------------------------------------------------ chips */
.chip {
display: inline-flex;
align-items: center;
gap: 0.3rem;
padding: 0.2rem 0.6rem;
border-radius: 999px;
font-size: 0.75rem;
font-weight: 600;
line-height: 1.35;
white-space: nowrap;
letter-spacing: 0.005em;
}
.chip--p1 { color: #4e6b2f; background: #e6eedc; }
.chip--p2 { color: #8e1a35; background: #f7e3e8; }
.chip--p3 { color: #855a06; background: #fbefd2; }
.chip--later { color: #6e625c; background: #f1ece4; }
.chip--neutral { color: var(--kohl); background: var(--paper); border: 1px solid var(--line); }
.chip--flag { color: var(--pom-900); background: var(--paper); border: 1px solid var(--pom-300); }
.chip--est { color: #7a5208; background: #fbefd0; }
.chip--ok { color: #46612a; background: #eaf0df; }
.chip__icon { width: 12px; height: 12px; flex: none; }
.plan__list .chip, .feature-item__head .chip, .locked .chip { flex: none; }

.sample-tag {
display: inline-flex;
align-items: center;
gap: 0.35rem;
padding: 0.25rem 0.65rem;
border: 1px dashed var(--line-strong);
border-radius: 999px;
background: var(--paper);
color: var(--slate);
font-size: 0.75rem;
font-weight: 600;
white-space: nowrap;
}

/* ------------------------------------------------------------------- hero */
.hero {
display: grid;
grid-template-columns:
[full-start] minmax(var(--gutter), 1fr)
[content-start] minmax(0, calc(var(--maxw) * 0.6))
[panel-start] minmax(0, calc(var(--maxw) * 0.4))
minmax(var(--gutter), 1fr) [full-end];
background: var(--cream);
border-bottom: 1px solid var(--line);
}
.hero__field { grid-column: content-start / panel-start; display: flex; align-items: center; }
.hero__content { padding: clamp(3.5rem, 9vw, 7.5rem) clamp(1.5rem, 5vw, 4.5rem) clamp(3.5rem, 9vw, 7.5rem) 0; max-width: 46rem; }
.hero__intro { color: var(--slate); font-size: var(--step--1); margin-bottom: 1.25rem; }
.hero__title {
font-size: var(--step-5);
line-height: 1.0;
letter-spacing: -0.032em;
font-weight: 750;
margin-bottom: 1.5rem;
}
.hero__lede { color: var(--slate); font-size: clamp(1.125rem, 1rem + 0.45vw, 1.3125rem); line-height: 1.55; max-width: 36rem; margin-bottom: 2rem; }
.hero__note { margin-top: 1.5rem; color: var(--slate); font-size: var(--step--1); display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; }
.hero__panel {
grid-column: panel-start / full-end;
position: relative;
background: var(--pom);
color: #fff;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: clamp(2.5rem, 6vw, 5rem) clamp(1.5rem, 4vw, 3.5rem);
min-height: 22rem;
}
.hero-symbol { width: min(64%, 300px); height: auto; overflow: visible; }
.hero__panel-caption {
position: absolute;
left: clamp(1.5rem, 4vw, 3.5rem);
right: clamp(1.5rem, 4vw, 3.5rem);
bottom: clamp(1.25rem, 3vw, 2.25rem);
color: var(--pom-100);
font-size: var(--step--1);
line-height: 1.5;
}
.hero__panel-caption span { display: block; color: #fff; font-weight: 600; }

/* The one load-time moment: the diya is lit for the arriving guest. */
@media (prefers-reduced-motion: no-preference) {
.hero-symbol .flame {
transform-box: fill-box;
transform-origin: 50% 100%;
animation: diya-light 1.1s cubic-bezier(0.2, 0.7, 0.2, 1) 0.35s both;
}
}
@keyframes diya-light {
0% { opacity: 0; transform: scale(0.35); }
55% { opacity: 1; transform: scale(1.08); }
100% { opacity: 1; transform: scale(1); }
}

/* Edition hero panel: Devanagari edition name */
.hero__panel--edition { align-items: flex-start; justify-content: space-between; gap: 2.5rem; }
.hero__panel--edition .panel-symbol { width: 72px; height: auto; }
.edition-deva {
font-family: var(--font-deva);
font-weight: 700;
font-size: clamp(2.4rem, 1.5rem + 3vw, 4.25rem);
line-height: 1.25;
color: #fff;
}
.edition-panel__meta { color: var(--pom-100); font-size: var(--step--1); display: grid; gap: 0.25rem; }
.edition-panel__meta strong { color: #fff; font-weight: 600; }

@media (max-width: 56rem) {
.hero { grid-template-columns: [full-start] var(--gutter) [content-start] minmax(0, 1fr) [content-end] var(--gutter) [full-end]; }
.hero__field { grid-column: content-start / content-end; }
.hero__content { padding: 3rem 0 3rem; }
.hero__panel { grid-column: full-start / full-end; min-height: 0; padding: 2.5rem var(--gutter) 2rem; gap: 1.75rem; }
.hero-symbol { width: min(42%, 170px); }
.hero__panel-caption { position: static; text-align: left; align-self: stretch; }
.hero__panel--edition { min-height: 0; padding: 2.25rem var(--gutter); flex-direction: column; align-items: flex-start; justify-content: flex-start; gap: 1.25rem; }
.hero__panel--edition .panel-symbol { width: 52px; }
}

/* ------------------------------------------------------------ page header */
.page-header { padding: clamp(3rem, 7vw, 6rem) 0 clamp(2.5rem, 5vw, 4rem); border-bottom: 1px solid var(--line); }
.page-header__grid { display: grid; gap: 2.5rem; }
.page-header__grid--aside { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); align-items: end; }
.page-title { font-size: var(--step-4); letter-spacing: -0.03em; line-height: 1.04; margin-bottom: 1.25rem; max-width: 18ch; }
.lede { color: var(--slate); font-size: clamp(1.125rem, 1rem + 0.4vw, 1.3125rem); line-height: 1.55; max-width: 38rem; }
.page-header .actions { margin-top: 2rem; }
@media (max-width: 56rem) {
.page-header__grid--aside { grid-template-columns: minmax(0, 1fr); }
}

/* --------------------------------------------------------------- sections */
.section { padding-block: var(--section); }
.section--sand { background: var(--sand); border-block: 1px solid var(--line); }
.section--tight { padding-block: clamp(2.5rem, 5vw, 4.5rem); }
.section__head { display: grid; gap: 1rem; margin-bottom: clamp(2rem, 4vw, 3.5rem); max-width: 46rem; }
.section__head--split { max-width: none; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); align-items: end; gap: 1.5rem 3rem; }
.section__title { font-size: var(--step-3); letter-spacing: -0.026em; }
.section__intro { color: var(--slate); font-size: 1.125rem; }
@media (max-width: 56rem) { .section__head--split { grid-template-columns: minmax(0, 1fr); } }

.sub-title { font-size: var(--step-2); letter-spacing: -0.02em; margin-bottom: 0.75rem; }
.muted { color: var(--slate); }
.small { font-size: var(--step--1); }
.stack > * + * { margin-top: 1rem; }
.stack-lg > * + * { margin-top: 1.5rem; }

.grid-2 { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 2.5rem); }
.grid-3 { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.75rem); }
.split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.1fr); gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.split--top { align-items: start; }
@media (max-width: 62rem) { .grid-3 { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 56rem) { .grid-2, .split { grid-template-columns: minmax(0, 1fr); } }

.card {
background: var(--paper);
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: clamp(1.25rem, 2.5vw, 1.75rem);
box-shadow: var(--shadow-1);
}
.card--tint { background: var(--pom-50); border-color: #efd3da; }
.card__title { font-size: 1.25rem; letter-spacing: -0.015em; margin-bottom: 0.5rem; }

/* ------------------------------------------------------- problems (home) */
.problems { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--kohl); }
.problem { padding: 1.75rem clamp(1rem, 2.5vw, 2rem) 0 0; display: grid; gap: 0.85rem; align-content: start; }
.problem + .problem { padding-left: clamp(1rem, 2.5vw, 2rem); border-left: 1px solid var(--line); }
.problem__title { font-size: var(--step-2); letter-spacing: -0.02em; }
.problem__pain { color: var(--slate); }
.problem__answer { padding-top: 0.85rem; border-top: 1px dashed var(--line-strong); display: grid; gap: 0.6rem; }
.problem__answer strong { font-weight: 600; }
.problem__answer .chip { justify-self: start; }
@media (max-width: 62rem) {
.problems { grid-template-columns: minmax(0, 1fr); border-top: 0; }
.problem, .problem + .problem { padding: 1.75rem 0; border-left: 0; border-top: 1px solid var(--line); }
.problem:first-child { border-top: 1px solid var(--kohl); }
}

/* ------------------------------------------------------------- dark bands */
.band { padding-block: clamp(3rem, 7vw, 5.5rem); }
.band--pom { background: var(--pom); color: #fff; }
.band--deep { background: var(--pom-900); color: #fff; }
.band__grid { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 2rem 4rem; align-items: center; }
.band__title { color: #fff; font-size: var(--step-3); letter-spacing: -0.026em; margin-bottom: 0.85rem; max-width: 24ch; }
.band__text { color: var(--pom-100); max-width: 40rem; font-size: 1.125rem; }
@media (max-width: 48rem) { .band__grid { grid-template-columns: minmax(0, 1fr); } }
.band a:not(.btn) { color: #fff; }

.differentiator { display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, 0.85fr); gap: clamp(2rem, 6vw, 6rem); align-items: center; }
.differentiator__tagline { color: #fff; font-size: var(--step-4); letter-spacing: -0.032em; line-height: 1.04; margin-bottom: 1.5rem; }
.differentiator__hinglish { color: var(--pom-100); font-size: var(--step-1); font-weight: 500; margin-bottom: 2rem; }
.differentiator__points { display: grid; gap: 1.1rem; color: var(--pom-100); }
.differentiator__points li { display: grid; grid-template-columns: auto 1fr; gap: 0.75rem; align-items: start; }
.differentiator__points strong { color: #fff; font-weight: 600; }
.differentiator__points .icon { color: #fff; margin-top: 0.2rem; }
.differentiator__note { margin-top: 2rem; color: var(--pom-100); font-size: var(--step--1); }
@media (max-width: 56rem) { .differentiator { grid-template-columns: minmax(0, 1fr); } }

/* ---------------------------------------------------------------- steps */
.steps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.75rem); counter-reset: step; list-style: none; }
.step { display: grid; grid-template-rows: auto auto 1fr; gap: 1rem; }
.step__num {
display: inline-grid;
place-items: center;
width: 2.25rem; height: 2.25rem;
border-radius: 999px;
background: var(--kohl);
color: #fff;
font-weight: 700;
font-size: 0.9375rem;
font-variant-numeric: tabular-nums;
}
.step__title { font-size: var(--step-2); letter-spacing: -0.02em; }
.step__head { display: flex; align-items: center; gap: 0.85rem; }
.step__text { color: var(--slate); }
.step__visual { margin-top: 0.5rem; }
@media (max-width: 62rem) { .steps { grid-template-columns: minmax(0, 1fr); } }

/* -------------------------------------------------------------- editions */
.editions { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.5rem); }
.edition {
position: relative;
display: grid;
grid-template-rows: auto auto auto 1fr auto;
gap: 0.85rem;
background: var(--paper);
border: 1px solid var(--line);
border-radius: var(--r-lg);
padding: clamp(1.25rem, 2.5vw, 1.75rem);
box-shadow: var(--shadow-1);
}
.edition--flagship { background: var(--pom-50); border-color: #ecc9d2; }
.edition__chips { display: flex; gap: 0.4rem; flex-wrap: wrap; }
.edition__for { display: block; color: var(--kohl); font-weight: 600; margin-bottom: 0.25rem; }
.edition__deva { color: var(--pom); font-size: 1.375rem; line-height: 1.4; }
.edition__text { color: var(--slate); }
.edition__link { font-weight: 600; text-decoration: none; }
.edition__link::after { content: ''; position: absolute; inset: 0; border-radius: inherit; }
.edition__link:hover { text-decoration: underline; }
.edition:has(.edition__link:focus-visible) { box-shadow: var(--focus); }
.edition__link:focus-visible { box-shadow: none; }
@media (max-width: 62rem) { .editions { grid-template-columns: minmax(0, 1fr); } }

.lockup { display: inline-flex; align-items: center; gap: 0.65rem; color: var(--kohl); }
.lockup__logo { width: auto; }
.lockup--sm .lockup__logo { height: 22px; }
.lockup--md .lockup__logo { height: 28px; }
.lockup--lg .lockup__logo { height: 40px; }
.lockup__rule { width: 1px; align-self: stretch; background: var(--line-strong); }
.lockup__word { font-weight: 700; letter-spacing: -0.02em; line-height: 1; }
.lockup--sm .lockup__word { font-size: 1.15rem; }
.lockup--md .lockup__word { font-size: 1.45rem; }
.lockup--lg .lockup__word { font-size: 2.05rem; }
.lockup--white { color: #fff; }
.lockup--white .lockup__rule { background: rgba(255, 255, 255, 0.45); }

/* --------------------------------------------------------------- roadmap */
.roadmap { list-style: none; display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 0; position: relative; }
.roadmap__item { position: relative; padding: 2.25rem 0.75rem 0 0; }
.roadmap__item::before {
content: '';
position: absolute;
top: 0.6rem; left: 0; right: 0;
height: 2px;
background: var(--line-strong);
}
.roadmap__dot {
position: absolute;
top: 0.15rem; left: 0;
width: 1rem; height: 1rem;
border-radius: 999px;
background: var(--cream);
border: 2px solid var(--slate);
}
.roadmap__item--mvp .roadmap__dot { background: var(--pom); border-color: var(--pom); }
.roadmap__item--mvp::before { background: var(--pom); }
.roadmap__item--gate .roadmap__dot { width: 0.85rem; height: 0.85rem; top: 0.22rem; border-radius: 2px; transform: rotate(45deg); background: var(--kohl); border-color: var(--kohl); }
.roadmap__phase { font-size: 0.75rem; font-weight: 700; color: var(--slate); font-variant-numeric: tabular-nums; }
.roadmap__name { font-size: 0.9375rem; font-weight: 650; line-height: 1.3; margin: 0.2rem 0 0.35rem; color: var(--kohl); }
.roadmap__date { font-size: 0.8125rem; color: var(--slate); }
.roadmap__item--gate .roadmap__name { color: var(--pom-800); }
@media (max-width: 68rem) {
.roadmap { grid-template-columns: minmax(0, 1fr); }
.roadmap__item { padding: 0 0 1.4rem 2rem; }
.roadmap__item::before { top: 0.6rem; bottom: -0.6rem; left: 0.44rem; right: auto; width: 2px; height: auto; }
.roadmap__item:last-child::before { display: none; }
.roadmap__dot { top: 0.2rem; }
.roadmap__name { margin-top: 0; }
}

.roadmap-table { width: 100%; border-collapse: collapse; }
.roadmap-table th, .roadmap-table td { text-align: left; vertical-align: top; padding: 1rem 1rem 1rem 0; border-top: 1px solid var(--line); }
.roadmap-table th { font-weight: 650; width: 30%; }
.roadmap-table .gate-row th, .roadmap-table .gate-row td { color: var(--pom-800); background: var(--pom-50); padding-left: 0.75rem; }

/* ---------------------------------------------------------------- legend */
.legend { display: flex; flex-wrap: wrap; gap: 0.6rem 1.25rem; align-items: center; }
.legend__item { display: inline-flex; align-items: center; gap: 0.5rem; font-size: var(--step--1); color: var(--slate); }

/* -------------------------------------------------------------- features */
.feature-layout { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.toc { position: sticky; top: 6.5rem; }
.toc__title { font-size: var(--step--1); font-weight: 700; margin-bottom: 0.75rem; color: var(--kohl); }
.toc ol { list-style: none; display: grid; gap: 0.1rem; border-left: 1px solid var(--line-strong); }
.toc a { display: block; padding: 0.4rem 0.85rem; color: var(--slate); text-decoration: none; font-size: 0.9375rem; margin-left: -1px; border-left: 2px solid transparent; }
.toc a:hover { color: var(--pom); border-left-color: var(--pom); }
@media (max-width: 62rem) {
.feature-layout { grid-template-columns: minmax(0, 1fr); }
.toc { position: static; }
.toc ol { display: flex; flex-wrap: wrap; gap: 0.5rem; border-left: 0; }
.toc a { border: 1px solid var(--line-strong); border-radius: 999px; padding: 0.4rem 0.85rem; margin: 0; background: var(--paper); }
}
.feature-group { padding-bottom: clamp(2.5rem, 5vw, 4rem); }
.feature-group + .feature-group { padding-top: clamp(2.5rem, 5vw, 4rem); border-top: 1px solid var(--line); }
.feature-group__head { display: grid; gap: 0.6rem; margin-bottom: 1.75rem; max-width: 44rem; }
.feature-group__title { font-size: var(--step-3); letter-spacing: -0.026em; }
.feature-group__note { margin-top: 1.5rem; display: flex; gap: 0.6rem; align-items: flex-start; color: var(--slate); font-size: var(--step--1); max-width: 46rem; }
.feature-group__note .icon { margin-top: 0.15rem; color: var(--slate); }

.feature-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0 clamp(1.5rem, 3vw, 2.5rem); list-style: none; }
.feature-item { padding: 1.15rem 0; border-top: 1px solid var(--line); }
.feature-item__head { display: flex; justify-content: space-between; align-items: flex-start; gap: 0.75rem; margin-bottom: 0.35rem; }
.feature-item__title { font-size: 1.0625rem; letter-spacing: -0.01em; line-height: 1.35; font-weight: 650; }
.feature-item__head .chip { margin-top: 0.1rem; }
.feature-item__text { color: var(--slate); font-size: 0.9875rem; }
@media (max-width: 48rem) { .feature-list { grid-template-columns: minmax(0, 1fr); } }

.check-list { list-style: none; display: grid; gap: 0.7rem; }
.check-list li { display: grid; grid-template-columns: auto 1fr; gap: 0.65rem; align-items: start; }
.check-list .icon { color: var(--cardamom-700); margin-top: 0.22rem; }

/* --------------------------------------------------------------- pricing */
.plans { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.5rem); }
.plan { display: grid; grid-template-rows: auto auto auto 1fr; gap: 1rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); padding: clamp(1.35rem, 2.5vw, 1.9rem); box-shadow: var(--shadow-1); }
.plan__name { font-size: var(--step-2); letter-spacing: -0.02em; }
.plan__for { color: var(--slate); }
.plan__price { padding: 0.9rem 1rem; border-radius: var(--r-sm); background: var(--sand); border: 1px dashed var(--line-strong); color: var(--kohl); font-size: var(--step--1); font-weight: 500; }
.plan__list { list-style: none; display: grid; gap: 0; align-content: start; }
.plan__list li { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.35rem 0.75rem; padding: 0.7rem 0; border-top: 1px solid var(--line); align-items: flex-start; }
.plan { min-width: 0; }
.plan__list li:first-child { font-weight: 600; }
@media (max-width: 62rem) { .plans { grid-template-columns: minmax(0, 1fr); } }

.table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: var(--r-md); background: var(--paper); }
.data-table { width: 100%; border-collapse: collapse; font-size: 0.9875rem; }
.data-table caption { text-align: left; padding: 1rem 1.25rem 0; font-weight: 650; color: var(--kohl); }
.data-table th, .data-table td { padding: 0.85rem 1.25rem; text-align: left; border-bottom: 1px solid var(--line); vertical-align: top; }
.data-table thead th { font-size: 0.8125rem; font-weight: 650; color: var(--slate); background: var(--sand); }
.data-table tbody tr:last-child th, .data-table tbody tr:last-child td { border-bottom: 0; }
.data-table tbody th { font-weight: 600; }
.data-table .num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.data-table .nowrap { white-space: nowrap; }
.cell-note { display: block; margin-top: 0.2rem; color: var(--slate); font-size: 0.8125rem; font-weight: 500; }
@media (max-width: 30rem) { .data-table th, .data-table td { padding: 0.7rem 0.6rem; } .data-table th:first-child, .data-table td:first-child { padding-left: 0.85rem; } .data-table { font-size: 0.9375rem; } .data-table--terms th[scope='row'] { min-width: 6.5rem; } }

/* ------------------------------------------------------------------- faq */
.faq-group + .faq-group { margin-top: clamp(2.5rem, 5vw, 3.5rem); }
.faq-group__title { font-size: var(--step-2); letter-spacing: -0.02em; margin-bottom: 1rem; }
.faq { border-top: 1px solid var(--line-strong); }
.faq details { border-bottom: 1px solid var(--line-strong); }
.faq summary {
list-style: none;
cursor: pointer;
display: flex;
justify-content: space-between;
gap: 1.5rem;
align-items: center;
padding: 1.15rem 0.25rem;
font-weight: 600;
font-size: 1.0625rem;
line-height: 1.4;
border-radius: 6px;
}
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after {
content: '';
flex: none;
width: 0.65rem; height: 0.65rem;
border-right: 2px solid var(--pom);
border-bottom: 2px solid var(--pom);
transform: translateY(-25%) rotate(45deg);
transition: transform 0.2s ease;
}
.faq details[open] summary::after { transform: translateY(15%) rotate(225deg); }
.faq summary:hover { color: var(--pom); }
.faq__answer { padding: 0 0.25rem 1.4rem; color: var(--slate); max-width: 46rem; display: grid; gap: 0.75rem; }
@media (prefers-reduced-motion: reduce) { .faq summary::after { transition: none; } }

/* ------------------------------------------------------------------ forms */
.form-layout { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(0, 0.8fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
@media (max-width: 62rem) { .form-layout { grid-template-columns: minmax(0, 1fr); } }
.form-card { background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-xl); padding: clamp(1.25rem, 3.5vw, 2.5rem); box-shadow: var(--shadow-2); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.25rem 1.25rem; }
.form-grid .span-2 { grid-column: 1 / -1; }
@media (max-width: 40rem) { .form-grid { grid-template-columns: minmax(0, 1fr); } }
.field { display: grid; gap: 0.4rem; align-content: start; }
.field label, .field legend { font-weight: 600; font-size: 0.9375rem; color: var(--kohl); }
.field .req { color: var(--pom); font-weight: 700; }
.field__hint { color: var(--slate); font-size: 0.875rem; }
.field input, .field select, .field textarea {
width: 100%;
min-height: 48px;
padding: 0.7rem 0.85rem;
font: inherit;
font-size: 1rem;
color: var(--kohl);
background: #fff;
border: 1px solid #b9a993;
border-radius: 10px;
transition: border-color 0.15s ease;
}
.field textarea { min-height: 8rem; resize: vertical; }
.field select { appearance: none; background-image: linear-gradient(45deg, transparent 50%, var(--kohl) 50%), linear-gradient(135deg, var(--kohl) 50%, transparent 50%); background-position: calc(100% - 20px) 55%, calc(100% - 15px) 55%; background-size: 5px 5px, 5px 5px; background-repeat: no-repeat; padding-right: 2.5rem; }
.field input:hover, .field select:hover, .field textarea:hover { border-color: var(--slate); }
.field input:focus-visible, .field select:focus-visible, .field textarea:focus-visible { border-color: var(--pom); box-shadow: 0 0 0 3px var(--pom-100); border-radius: 10px; }
.field [aria-invalid='true'] { border-color: var(--error); box-shadow: 0 0 0 1px var(--error); }
.field__error { display: flex; gap: 0.4rem; align-items: flex-start; color: var(--error); font-size: 0.875rem; font-weight: 600; }
.field__error:empty { display: none; }
.field__error .icon { margin-top: 0.1rem; }
fieldset.field { border: 0; padding: 0; margin: 0; min-width: 0; }
fieldset.field legend { padding: 0; margin-bottom: 0.4rem; }
.choice-row { display: flex; flex-wrap: wrap; gap: 0.6rem; }
.choice { position: relative; }
.choice input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.choice label {
display: inline-flex; align-items: center; gap: 0.5rem;
min-height: 44px; padding: 0.55rem 1rem;
border: 1px solid #b9a993; border-radius: 10px;
background: #fff; cursor: pointer; font-weight: 500;
}
.choice label::before { content: ''; width: 1rem; height: 1rem; border-radius: 999px; border: 2px solid var(--slate); background: #fff; flex: none; }
.choice input:checked + label { border-color: var(--pom); background: var(--pom-50); color: var(--pom-900); }
.choice input:checked + label::before { border-color: var(--pom); background: radial-gradient(circle, var(--pom) 0 45%, #fff 50%); }
.choice input:focus-visible + label { box-shadow: var(--focus); }
fieldset[aria-invalid='true'] .choice label { border-color: var(--error); }
.consent { display: grid; grid-template-columns: auto 1fr; gap: 0.75rem; align-items: start; }
.consent input { width: 1.35rem; height: 1.35rem; min-height: 0; padding: 0; margin: 0.15rem 0 0; accent-color: var(--pom); border-radius: 4px; }
.field .consent input[aria-invalid='true'] { outline: 2px solid var(--error); outline-offset: 2px; box-shadow: none; }
.consent label { font-weight: 500; }
.hp-field { position: absolute; left: -10000px; width: 1px; height: 1px; overflow: hidden; }
.form-actions { display: flex; flex-wrap: wrap; gap: 1rem; align-items: center; margin-top: 1.75rem; }
.form-actions .small { color: var(--slate); }

.notice {
display: grid;
grid-template-columns: auto 1fr;
gap: 0.75rem;
padding: 1rem 1.15rem;
border-radius: var(--r-md);
border: 1px solid;
margin-bottom: 1.75rem;
font-size: 0.9875rem;
}
.notice .icon { margin-top: 0.15rem; }
.notice__title { font-weight: 650; color: inherit; }
.notice--info { background: var(--info-bg); border-color: #c6d4ee; color: #1f3f73; }
.notice--warn { background: #fbefd0; border-color: #ecd59a; color: #5d3e05; }
.notice--error { background: var(--error-bg); border-color: #f0c2bc; color: #8a1d16; }
.notice--success { background: #eaf0df; border-color: #c9d8b5; color: #34491f; }
.notice a { color: inherit; font-weight: 600; }
.notice ul { margin: 0.4rem 0 0 1.1rem; padding: 0; }

.form-status:empty { display: none; }
.form-status { margin-bottom: 1.5rem; }
.form-status:focus { outline: none; }

.next-steps { list-style: none; counter-reset: next; display: grid; gap: 1.25rem; }
.next-steps li { display: grid; grid-template-columns: auto 1fr; gap: 0.9rem; counter-increment: next; }
.next-steps li::before { content: counter(next); display: grid; place-items: center; width: 1.9rem; height: 1.9rem; border-radius: 999px; border: 1.5px solid var(--kohl); font-weight: 700; font-size: 0.875rem; }
.next-steps strong { display: block; font-weight: 650; }
.next-steps span { color: var(--slate); font-size: 0.9875rem; }

/* ----------------------------------------------------------------- prose */
.prose { max-width: 44rem; }
.prose h2 { font-size: var(--step-2); letter-spacing: -0.02em; margin: 2.5rem 0 0.75rem; }
.prose h2:first-child { margin-top: 0; }
.prose p, .prose ul { color: var(--slate); margin-bottom: 1rem; }
.prose ul { padding-left: 1.25rem; }
.prose li + li { margin-top: 0.4rem; }
.prose strong { color: var(--kohl); font-weight: 600; }

/* ----------------------------------------------------------------- about */
.name-card { display: grid; grid-template-columns: auto 1fr; gap: 1.75rem; align-items: center; }
.name-card__deva { font-family: var(--font-deva); font-weight: 700; color: var(--pom); font-size: clamp(2.6rem, 1.8rem + 3vw, 4rem); line-height: 1.3; }
.symbol-anatomy { display: grid; grid-template-columns: minmax(140px, 220px) 1fr; gap: clamp(1.5rem, 4vw, 3rem); align-items: center; }
.symbol-anatomy img { width: 100%; }
.anatomy-list { list-style: none; display: grid; gap: 1rem; }
.anatomy-list li { display: grid; grid-template-columns: auto 1fr; gap: 0.85rem; align-items: start; }
.swatch { width: 1.1rem; height: 1.1rem; border-radius: 4px; margin-top: 0.25rem; }
.swatch--pom { background: var(--pom); }
.swatch--turmeric { background: var(--turmeric); }
.swatch--cardamom { background: var(--cardamom); }
@media (max-width: 40rem) { .symbol-anatomy, .name-card { grid-template-columns: minmax(0, 1fr); } .symbol-anatomy img { max-width: 160px; } }

/* ------------------------------------------------------------------ footer */
.site-footer { background: var(--pom-900); color: var(--pom-100); padding: clamp(3rem, 6vw, 4.5rem) 0 2rem; }
.site-footer a { color: #fff; text-decoration: none; }
.site-footer a:hover { text-decoration: underline; color: #fff; }
.site-footer :focus-visible { box-shadow: 0 0 0 3px var(--pom-900), 0 0 0 5px #fff; }
.footer-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 2.5rem; }
.footer-brand { display: grid; gap: 0.9rem; align-content: start; }
.footer-brand .logo { width: 170px; height: auto; }
.footer-brand p { max-width: 22rem; font-size: var(--step--1); }
.footer-col h2 { color: #fff; font-size: 0.9375rem; font-weight: 650; margin-bottom: 0.85rem; letter-spacing: 0; }
.footer-col ul { list-style: none; display: grid; gap: 0.55rem; font-size: 0.9375rem; }
.footer-base { margin-top: 3rem; padding-top: 1.5rem; border-top: 1px solid rgba(247, 227, 232, 0.2); display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.75rem 2rem; font-size: 0.875rem; }
@media (max-width: 62rem) { .footer-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 36rem) { .footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* ------------------------------------------------------- product mock-ups */
.mock {
background: var(--paper);
border: 1px solid var(--line);
border-radius: var(--r-xl);
box-shadow: var(--shadow-2);
overflow: hidden;
font-size: 0.875rem;
line-height: 1.45;
color: var(--kohl);
font-variant-numeric: tabular-nums;
}
.mock__bar { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem; flex-wrap: wrap; padding: 0.7rem 1rem; border-bottom: 1px solid var(--line); background: var(--sand); }
.mock__where { display: flex; align-items: center; gap: 0.6rem; font-weight: 600; font-size: 0.8125rem; min-width: 0; }
.mock__where .tenant { display: inline-grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 7px; background: #7d5527; color: #fff; font-size: 0.6875rem; font-weight: 700; flex: none; }
.tenant--dv { background: #2f6b66 !important; }
.tenant--nk { background: #3a4f8f !important; }
.mock__body { padding: 1rem; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0.85rem; }
.mock__title { font-size: 1rem; font-weight: 700; letter-spacing: -0.01em; }
.mock__sub { color: var(--slate); font-size: 0.8125rem; }
.mock figcaption { padding: 0.65rem 1rem; border-top: 1px solid var(--line); color: var(--slate); font-size: 0.8125rem; background: var(--paper); }

.mock-row { display: flex; justify-content: space-between; gap: 1rem; padding: 0.5rem 0; border-top: 1px solid var(--line); align-items: baseline; }
.mock-row:first-child { border-top: 0; }
.mock-row > span:last-child { font-weight: 600; text-align: right; white-space: nowrap; }
.mock-row--total { border-top: 1.5px solid var(--kohl); font-weight: 700; font-size: 0.9375rem; }
.mock-check { display: grid; grid-template-columns: auto 1fr auto; gap: 0.55rem; align-items: center; padding: 0.4rem 0; }
.mock-check .icon { color: var(--cardamom-700); }
.mock-check span:last-child { color: var(--slate); font-size: 0.8125rem; text-align: right; }
.mock-field { display: grid; gap: 0.25rem; }
.mock-field span { font-size: 0.75rem; color: var(--slate); font-weight: 600; }
.mock-field b { display: block; padding: 0.5rem 0.65rem; border: 1px solid var(--line-strong); border-radius: 8px; font-weight: 500; background: #fff; }
.mock-fields { display: grid; grid-template-columns: 1fr 1.5fr; gap: 0.65rem; }
.mock-note { padding: 0.65rem 0.75rem; border-radius: 10px; background: var(--sand); color: var(--kohl); font-size: 0.8125rem; border: 1px solid var(--line); }
.mock-btn { display: inline-flex; align-items: center; gap: 0.4rem; justify-self: end; padding: 0.5rem 0.85rem; border-radius: 9px; background: var(--pom); color: #fff; font-weight: 600; font-size: 0.8125rem; }
.mock-btn--ghost { background: #fff; color: var(--kohl); border: 1px solid var(--line-strong); }
.mock-actions { display: flex; justify-content: flex-end; gap: 0.5rem; flex-wrap: wrap; }

.mock-table { width: 100%; border-collapse: collapse; font-size: 0.8125rem; }
.mock-table th, .mock-table td { padding: 0.5rem 0.4rem; text-align: left; border-top: 1px solid var(--line); vertical-align: top; }
.mock-table thead th { border-top: 0; color: var(--slate); font-weight: 600; font-size: 0.75rem; }
.mock-table .num { text-align: right; white-space: nowrap; }
.mock-table tbody th { font-weight: 600; }

/* WhatsApp-style nightly summary */
.chat { background: #efe5d4; border-radius: var(--r-xl); overflow: hidden; border: 1px solid rgba(255, 255, 255, 0.18); box-shadow: 0 30px 60px -30px rgba(0, 0, 0, 0.55); color: var(--kohl); max-width: 26rem; width: 100%; justify-self: center; }
.chat__head { display: flex; align-items: center; gap: 0.7rem; padding: 0.8rem 1rem; background: var(--paper); border-bottom: 1px solid var(--line); }
.chat__avatar { width: 2.25rem; height: 2.25rem; border-radius: 999px; background: #7d5527; color: #fff; font-size: 0.75rem; font-weight: 700; display: grid; place-items: center; flex: none; }
.chat__name { font-weight: 650; font-size: 0.9375rem; line-height: 1.2; }
.chat__meta { color: var(--slate); font-size: 0.75rem; }
.chat__body { padding: 1rem; display: grid; gap: 0.6rem; font-size: 0.875rem; }
.bubble { background: var(--paper); border-radius: 4px 14px 14px 14px; padding: 0.75rem 0.9rem 0.45rem; box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06); max-width: 94%; }
.bubble--out { background: #e3f1d5; justify-self: end; border-radius: 14px 4px 14px 14px; }
.bubble__title { font-weight: 700; margin-bottom: 0.4rem; }
.bubble__time { display: block; text-align: right; color: var(--slate); font-size: 0.6875rem; margin-top: 0.2rem; }
.bubble dl { display: grid; grid-template-columns: 1fr auto; gap: 0.2rem 1rem; margin: 0; font-variant-numeric: tabular-nums; }
.bubble dt { color: var(--slate); }
.bubble dd { margin: 0; font-weight: 600; text-align: right; }
.bubble__foot { margin-top: 0.55rem; padding-top: 0.5rem; border-top: 1px solid var(--line); color: var(--slate); font-size: 0.8125rem; }
.bubble__link { display: block; margin-top: 0.5rem; padding-top: 0.45rem; border-top: 1px solid var(--line); text-align: center; color: var(--info); font-weight: 600; }
.chat__label { padding: 0.55rem 1rem; background: var(--paper); border-top: 1px solid var(--line); display: flex; justify-content: space-between; gap: 0.5rem; flex-wrap: wrap; align-items: center; font-size: 0.75rem; color: var(--slate); }

/* Dashboard mock-ups */
.dash { display: grid; gap: 1rem; }
.dash__head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 0.75rem; }
.period-switch { display: inline-flex; padding: 3px; border-radius: 10px; background: var(--sand); border: 1px solid var(--line); gap: 2px; }
.period-switch button { white-space: nowrap; font: inherit; font-size: 0.8125rem; font-weight: 600; border: 0; background: transparent; color: var(--slate); padding: 0.4rem 0.7rem; border-radius: 7px; cursor: pointer; min-height: 32px; }
.period-switch button[aria-pressed='true'] { background: var(--paper); color: var(--kohl); box-shadow: var(--shadow-1); }
.period-switch button:hover { color: var(--kohl); }
.period-switch[hidden] { display: none; }
.period-static { font-size: 0.8125rem; color: var(--slate); font-weight: 600; }
.dash { container-type: inline-size; }
.kpis { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.6rem; }
@container (min-width: 34rem) {
.kpis--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpis--6 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
.kpi { border: 1px solid var(--line); border-radius: 12px; padding: 0.75rem 0.85rem; display: grid; gap: 0.15rem; align-content: start; background: #fff; }
.kpi { min-width: 0; }
.kpi__label { color: var(--slate); font-size: 0.75rem; font-weight: 600; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.25rem 0.4rem; align-items: center; }
.kpi__label .chip { padding: 0.1rem 0.45rem; font-size: 0.6875rem; }
.kpi__value { font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem); font-weight: 700; letter-spacing: -0.02em; line-height: 1.15; font-optical-sizing: auto; }
.kpi__sub { color: var(--slate); font-size: 0.75rem; }
.dash-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 16.5rem), 1fr)); gap: 0.75rem; }
.dash-locked { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 15rem), 1fr)); gap: 0.5rem; }
.dash-panel { border: 1px solid var(--line); border-radius: 12px; padding: 0.85rem; background: #fff; display: grid; gap: 0.5rem; align-content: start; }
.dash-panel--wide { grid-column: 1 / -1; }
.dash-panel__title { font-weight: 650; font-size: 0.875rem; display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; flex-wrap: wrap; }
.dash-panel__title small { font-weight: 500; color: var(--slate); font-size: 0.75rem; }
.locked { border: 1px dashed var(--line-strong); border-radius: 10px; padding: 0.55rem 0.7rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.4rem 0.6rem; align-items: center; color: var(--slate); font-size: 0.8125rem; background: transparent; }
.locked .icon { color: var(--slate); }
.locked span:first-child { display: inline-flex; gap: 0.45rem; align-items: center; }
@media (max-width: 40rem) { .dash-grid { grid-template-columns: minmax(0, 1fr); } }

.hbar { display: grid; grid-template-columns: 6.5rem 1fr 2.75rem; gap: 0.6rem; align-items: center; font-size: 0.8125rem; }
.hbar svg { width: 100%; height: 8px; }
.hbar__track { fill: var(--pom-50); }
.hbar__fill { fill: var(--pom); }
.hbar span:last-child { text-align: right; font-weight: 600; }

.explainer { border: 1px solid #ecd59a; background: #fffaf0; border-radius: 10px; font-size: 0.8125rem; }
.explainer summary { cursor: pointer; padding: 0.5rem 0.7rem; font-weight: 600; color: var(--turmeric-text); display: flex; gap: 0.4rem; align-items: center; list-style: none; border-radius: 10px; }
.explainer summary::-webkit-details-marker { display: none; }
.explainer summary::before { content: '?'; display: inline-grid; place-items: center; width: 1.1rem; height: 1.1rem; border-radius: 999px; border: 1.5px solid currentColor; font-size: 0.6875rem; font-weight: 700; }
.explainer[open] summary { border-bottom: 1px solid #f1e2bb; border-radius: 10px 10px 0 0; }
.explainer__body { padding: 0.6rem 0.75rem 0.75rem; display: grid; gap: 0.35rem; }
.explainer__formula { padding: 0.45rem 0.6rem; background: var(--turmeric-100); border-radius: 8px; font-weight: 600; }
.explainer__note { color: var(--slate); }

.columns-chart { width: 100%; height: auto; }
.columns-chart .grid { stroke: var(--line); stroke-width: 1; }
.columns-chart .col { fill: var(--pom); }
.columns-chart .col--max { fill: var(--turmeric); }
.columns-chart text { font-family: var(--font); font-size: 11.5px; fill: var(--slate); }
.columns-chart .label { fill: var(--kohl); font-weight: 700; }

/* Tape chart (front desk) */
.tape { display: grid; grid-template-columns: 4.25rem repeat(7, minmax(0, 1fr)); font-size: 0.75rem; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; }
.tape > * { min-width: 0; }
.tape__row { display: contents; }
.tape__h { padding: 0.45rem 0.3rem; background: var(--sand); color: var(--slate); font-weight: 600; text-align: center; border-bottom: 1px solid var(--line); }
.tape__room { padding: 0.45rem 0.5rem; font-weight: 600; border-top: 1px solid var(--line); background: #fff; }
.tape__room small { display: block; color: var(--slate); font-weight: 500; font-size: 0.6875rem; }
.tape__lane { grid-column: 2 / -1; display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); border-top: 1px solid var(--line); padding: 0.35rem 0; background-image: linear-gradient(to right, var(--line) 1px, transparent 1px); background-size: calc(100% / 7) 100%; }
.stay { margin: 0 2px; padding: 0.3rem 0.45rem; border-radius: 6px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; align-self: center; }
.stay--in { background: var(--pom); color: #fff; }
.stay--conf { background: var(--pom-100); color: var(--pom-900); }
.stay--hold { background: #fff; color: var(--slate); border: 1px dashed var(--line-strong); }
.stay--ooo { background: #f1ece4; color: #6e625c; }
.gs-1 { grid-column-start: 1; } .gs-2 { grid-column-start: 2; } .gs-3 { grid-column-start: 3; } .gs-4 { grid-column-start: 4; } .gs-5 { grid-column-start: 5; } .gs-6 { grid-column-start: 6; } .gs-7 { grid-column-start: 7; }
.sp-1 { grid-column-end: span 1; } .sp-2 { grid-column-end: span 2; } .sp-3 { grid-column-end: span 3; } .sp-4 { grid-column-end: span 4; } .sp-5 { grid-column-end: span 5; } .sp-6 { grid-column-end: span 6; } .sp-7 { grid-column-end: span 7; }
.tape-legend { display: flex; flex-wrap: wrap; gap: 0.4rem 1rem; color: var(--slate); font-size: 0.75rem; }
.tape-legend span { display: inline-flex; align-items: center; gap: 0.35rem; }
.tape-legend i { width: 0.9rem; height: 0.6rem; border-radius: 3px; display: inline-block; }
.tape-legend .k-in { background: var(--pom); }
.tape-legend .k-conf { background: var(--pom-100); }
.tape-legend .k-hold { border: 1px dashed var(--slate); }
.tape-legend .k-ooo { background: #ddd3c7; }
@media (max-width: 30rem) { .tape { grid-template-columns: 3.4rem repeat(7, minmax(0, 1fr)); font-size: 0.6875rem; } .stay { padding: 0.25rem 0.3rem; } }

.offline-banner { display: grid; grid-template-columns: auto 1fr; gap: 0.6rem; padding: 0.65rem 0.75rem; border-radius: 10px; background: #fbefd0; color: #5d3e05; font-size: 0.8125rem; border: 1px solid #ecd59a; }
.sync { display: inline-flex; align-items: center; gap: 0.3rem; font-weight: 600; font-size: 0.75rem; }
.sync--ok { color: var(--cardamom-700); }
.sync--wait { color: #7a5208; }

.split-figure { display: grid; gap: 0.75rem; }

/* ------------------------------------------------------- page additions */
.mb-0 { margin-bottom: 0 !important; }
.split--reverse > :first-child { order: 2; }
@media (max-width: 56rem) { .split--reverse > :first-child { order: 0; } }

/* Edition hero */
.hero--edition .hero__intro { margin-bottom: 1.75rem; }
.hero--edition .hero__title { font-size: var(--step-4); line-height: 1.04; }
.edition__name { font-size: inherit; line-height: 1; }

/* Phase legend (features header) */
.phase-legend { display: grid; gap: 0.7rem; margin: 0; padding: 1.25rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); }
.phase-legend div { display: grid; grid-template-columns: 9.5rem 1fr; gap: 0.75rem; align-items: start; }
.phase-legend dt { margin: 0; }
.phase-legend dd { margin: 0; color: var(--slate); font-size: var(--step--1); line-height: 1.45; }
@media (max-width: 26rem) { .phase-legend div { grid-template-columns: minmax(0, 1fr); gap: 0.3rem; } }

/* How it works (home): alternating text and mock-up */
.how { list-style: none; display: grid; gap: clamp(3rem, 7vw, 5.5rem); }
.how__step { display: grid; grid-template-columns: minmax(0, 0.85fr) minmax(0, 1.15fr); gap: clamp(1.5rem, 5vw, 5rem); align-items: center; }
.how__step:nth-child(even) .how__text { order: 2; }
.how__text { display: grid; gap: 1rem; justify-items: start; max-width: 32rem; }
.how__visual { min-width: 0; display: grid; }
@media (max-width: 56rem) {
.how__step { grid-template-columns: minmax(0, 1fr); }
.how__step:nth-child(even) .how__text { order: 0; }
}

.roadmap-key { flex: none; display: inline-block; width: 0.9rem; height: 0.9rem; border-radius: 999px; }
.roadmap-key--mvp { background: var(--pom); }
.roadmap-key--gate { width: 0.75rem; height: 0.75rem; border-radius: 2px; transform: rotate(45deg); background: var(--kohl); }

/* Related edition cards */
.related-card { display: grid; gap: 0.75rem; text-decoration: none; color: var(--kohl); transition: border-color 0.15s ease; }
.related-card:hover { border-color: var(--pom-300); color: var(--kohl); }
.related-card:focus-visible { border-radius: var(--r-lg); }

/* Dashboards page */
.dash-section { display: grid; grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr); gap: clamp(2rem, 5vw, 4.5rem); align-items: start; }
.dash-section__text { display: grid; gap: 0.9rem; align-content: start; }
.dash-section__h { display: flex; align-items: center; gap: 0.6rem; flex-wrap: wrap; font-size: 1rem; letter-spacing: 0; margin-top: 0.85rem; }
.dash-section__mock { min-width: 0; position: sticky; top: 6.5rem; }
@media (max-width: 62rem) { .dash-section { grid-template-columns: minmax(0, 1fr); } .dash-section__mock { position: static; } }
.explainer-badge { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 999px; border: 2px solid var(--turmeric-text); color: var(--turmeric-text); font-weight: 700; font-size: 0.9375rem; }

/* Demo form page */
.page-header--form { padding-bottom: clamp(1.5rem, 3vw, 2.5rem); border-bottom: 0; }
.section--form { padding-top: 0; }
/* City, rooms and outlets share one row; subgrid lines up their labels,
inputs and error messages even when a label wraps. */
.form-row-3 { grid-column: 1 / -1; display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr) minmax(0, 1fr); column-gap: 1.25rem; row-gap: 0; }
.form-row-3 > .field { grid-row: span 3; }
@supports (grid-template-rows: subgrid) {
.form-row-3 > .field { display: grid; grid-template-rows: subgrid; row-gap: 0.4rem; }
.form-row-3 > .field label { align-self: end; }
}
@media (max-width: 40rem) {
.form-row-3 { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 1.25rem; }
.form-row-3 > .field:first-child { grid-column: 1 / -1; }
}

/* 404 */
.link-list { list-style: none; display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; }
.page-header--404 { min-height: 50vh; border-bottom: 0; }

/* Utility */
.mt-0 { margin-top: 0 !important; }
.mt-1 { margin-top: 0.5rem; }
.mt-2 { margin-top: 1rem; }
.mt-3 { margin-top: 1.5rem; }
.mt-4 { margin-top: 2.5rem; }
.mb-2 { margin-bottom: 1rem; }
.center { text-align: center; }

/* --------------------------------------------------------- additions v1.1 */
/* Home: India-first workflows */
.india-grid { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(0.85rem, 2vw, 1.25rem); }
.india-card { display: grid; grid-template-rows: auto auto 1fr; gap: 0.6rem; padding: 1.25rem; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-lg); box-shadow: var(--shadow-1); }
.india-card__icon { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 12px; background: var(--pom-50); color: var(--pom); }
.india-card__top { display: flex; align-items: center; justify-content: space-between; gap: 0.6rem; margin-bottom: 0.25rem; }
.india-card__title { font-size: 1.0625rem; letter-spacing: -0.01em; line-height: 1.3; font-weight: 650; }
.india-card__text { color: var(--slate); font-size: 0.9375rem; }
@media (max-width: 68rem) { .india-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 34rem) { .india-grid { grid-template-columns: minmax(0, 1fr); } }

.hero__signin { white-space: nowrap; padding: 0.5rem 0.25rem; }

/* Demo page without an online form */
.email-card .sub-title { margin-bottom: 0.5rem; }
.email-card__h { font-size: 1rem; letter-spacing: 0; margin: 2rem 0 0.85rem; }
.email-card .btn { max-width: 100%; overflow-wrap: anywhere; }
.notice .notice__title a { overflow-wrap: anywhere; }

/* About: pilot steps */
.pilot-steps { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.75rem); counter-reset: pilot; }
.pilot-step { counter-increment: pilot; display: grid; gap: 0.7rem; align-content: start; padding-top: 1.25rem; border-top: 2px solid var(--pom); }
.pilot-step__when { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; font-size: var(--step--1); font-weight: 600; color: var(--slate); }
.pilot-step__title { font-size: var(--step-1); letter-spacing: -0.015em; }
.pilot-step__title::before { content: counter(pilot) '. '; color: var(--pom); }
.pilot-step .check-list { font-size: 0.9375rem; color: var(--slate); gap: 0.5rem; }
@media (max-width: 68rem) { .pilot-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 40rem) { .pilot-steps { grid-template-columns: minmax(0, 1fr); } }

/* Mock-up: guest profile */
.view-tabs { display: flex; flex-wrap: wrap; gap: 2px; padding: 3px; border-radius: 10px; background: var(--sand); border: 1px solid var(--line); justify-self: start; font-size: 0.75rem; font-weight: 600; color: var(--slate); }
.view-tabs span { padding: 0.35rem 0.6rem; border-radius: 7px; }
.view-tabs .is-on { background: var(--paper); color: var(--kohl); box-shadow: var(--shadow-1); }
.guest-head { display: grid; grid-template-columns: auto 1fr auto; gap: 0.75rem; align-items: center; }
.guest-avatar { display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 999px; background: var(--pom-100); color: var(--pom-900); font-weight: 700; font-size: 0.875rem; }
.guest-spend { display: grid; justify-items: end; text-align: right; gap: 0.05rem; }
.guest-spend span, .guest-spend small { color: var(--slate); font-size: 0.75rem; }
.guest-spend b { font-size: 1.125rem; letter-spacing: -0.01em; }
.tag-row { display: flex; flex-wrap: wrap; gap: 0.35rem; }
.tag-row .chip { font-size: 0.6875rem; }
.mock-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.85rem; }
.mock-row--wrap > span:last-child { white-space: normal; }
.mock-row--wrap > span:first-child { flex: none; }
.mock-table__cap { caption-side: top; text-align: left; font-weight: 650; font-size: 0.8125rem; padding-bottom: 0.25rem; }
@media (max-width: 30rem) {
.guest-head { grid-template-columns: auto 1fr; }
.guest-spend { grid-column: 1 / -1; justify-items: start; text-align: left; }
}
@media (max-width: 40rem) { .mock-cols { grid-template-columns: minmax(0, 1fr); } }

/* Mock-up: kitchen display */
.qr-order { border: 1px solid var(--line); border-radius: 12px; padding: 0.75rem 0.85rem; display: grid; gap: 0.5rem; background: #fff; }
.qr-order__head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 0.4rem; align-items: center; font-size: 0.8125rem; }
.qr-order p { font-size: 0.8125rem; }
.kds { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0.6rem; }
.kds__col { display: grid; gap: 0.4rem; align-content: start; min-width: 0; }
.kds__station { font-size: 0.75rem; font-weight: 700; color: var(--slate); text-transform: uppercase; letter-spacing: 0.06em; }
.ticket { border: 1px solid var(--line-strong); border-top: 4px solid var(--cardamom); border-radius: 10px; padding: 0.55rem 0.6rem; background: #fff; display: grid; gap: 0.3rem; font-size: 0.8125rem; }
.ticket--late { border-color: #f0c2bc; border-top-color: var(--error); background: var(--error-bg); }
.ticket__head { display: flex; justify-content: space-between; gap: 0.4rem; }
.ticket--late .ticket__head span { color: var(--error); font-weight: 700; }
.ticket__src { color: var(--slate); font-size: 0.6875rem; }
.ticket__item { display: flex; justify-content: space-between; gap: 0.4rem; }
.ticket__state { font-size: 0.6875rem; font-weight: 700; color: var(--slate); text-transform: uppercase; letter-spacing: 0.05em; }
@media (max-width: 30rem) { .kds { grid-template-columns: minmax(0, 1fr); } }

@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation-duration: 0.01ms !important; animation-iteration-count: 1 !important; transition-duration: 0.01ms !important; scroll-behavior: auto !important; }
}

@media print {
.site-header, .site-footer, .band--pom, .nav-toggle { display: none !important; }
body { background: #fff; }
}

/* Header and footer tagline under the logo */
.endorsement--tagline { text-transform: none; letter-spacing: 0.01em; font-size: 0.75rem; }


/* ==========================================================================
   v2 refinement (Oct 2026): same brand, calmer and more precise.
   Cream field, pomegranate accents, Kohl text. Loaded last so it refines
   the components above without changing their markup.
   ========================================================================== */
:root {
  --section: clamp(3.5rem, 7vw, 6rem);
  --r-lg: 16px;
  --r-xl: 20px;
  --line-soft: #efe5d5;
  --shadow-1: 0 1px 2px rgba(76, 15, 30, 0.05), 0 0 0 1px rgba(76, 15, 30, 0.02);
  --shadow-2: 0 1px 2px rgba(76, 15, 30, 0.05), 0 24px 48px -28px rgba(76, 15, 30, 0.32);
  --shadow-3: 0 2px 4px rgba(76, 15, 30, 0.06), 0 40px 80px -40px rgba(76, 15, 30, 0.45);
}

body { line-height: 1.6; }
h1, h2, h3, h4 { font-weight: 700; }
.section__title { font-size: clamp(1.75rem, 1.3rem + 1.6vw, 2.5rem); letter-spacing: -0.028em; line-height: 1.1; }
.section__intro { font-size: 1.0625rem; line-height: 1.6; max-width: 40rem; }
.section__head { gap: 0.85rem; }
.page-title { font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem); letter-spacing: -0.032em; }
.lede { font-size: clamp(1.0625rem, 1rem + 0.3vw, 1.25rem); }

.eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.8125rem;
  font-weight: 650;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pom);
}
.eyebrow::before { content: ''; width: 1.25rem; height: 2px; border-radius: 2px; background: var(--turmeric); }

/* Buttons: one primary, one secondary, one quiet */
.btn { border-radius: 10px; font-size: 0.9875rem; letter-spacing: -0.005em; box-shadow: none; }
.btn--primary { box-shadow: 0 1px 0 rgba(255, 255, 255, 0.18) inset, 0 6px 16px -8px rgba(155, 29, 58, 0.7); }
.btn--secondary { background: var(--paper); border-color: var(--line-strong); }
.btn--secondary:hover { background: var(--paper); }
.btn--quiet { background: transparent; color: var(--kohl); padding-inline: 0.6rem; min-height: 48px; }
.btn--quiet:hover { color: var(--pom); }
.btn--quiet .icon { transition: transform 0.15s ease; }
.btn--quiet:hover .icon { transform: translateX(2px); }
.btn--lg { min-height: 52px; padding: 0.85rem 1.6rem; font-size: 1.0625rem; }
.btn--header { border-radius: 10px; }

/* Cards and panels */
.card, .edition, .india-card, .plan, .form-card { border-color: var(--line-soft); box-shadow: var(--shadow-1); }
.card { border-radius: var(--r-lg); }
.related-card:hover, .edition:hover { border-color: var(--pom-300); box-shadow: var(--shadow-2); }
.mock { border-color: var(--line-soft); box-shadow: var(--shadow-2); }
.chat { box-shadow: var(--shadow-2); border-color: var(--line-soft); }
.table-wrap { border-color: var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-1); }
.section--sand { border-color: var(--line-soft); }
.page-header { border-color: var(--line-soft); }

/* Chips used for integration status */
.chip--pending { color: #6b4a08; background: #fbefd0; border: 1px solid #efdba8; }
.chip--ok { color: #3d5424; }
.chip--neutral { border-color: var(--line-strong); }

/* ------------------------------------------------------------ home hero */
.home-hero { position: relative; overflow: hidden; border-bottom: 1px solid var(--line-soft); background:
  radial-gradient(60rem 30rem at 85% 0%, rgba(247, 227, 232, 0.65), transparent 60%), var(--cream); }
.home-hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.08fr); gap: clamp(2.5rem, 5vw, 4.5rem); align-items: center; padding-block: clamp(3rem, 7vw, 6rem); }
.home-hero__copy { display: grid; gap: 1.35rem; justify-items: start; max-width: 36rem; }
.home-hero__title { font-size: clamp(2.35rem, 1.5rem + 3vw, 3.75rem); line-height: 1.04; letter-spacing: -0.034em; }
.home-hero__lede { color: var(--slate); font-size: clamp(1.0625rem, 1rem + 0.35vw, 1.25rem); line-height: 1.55; }
.home-hero__copy .actions { margin-top: 0.4rem; }
.hero-proof { list-style: none; display: grid; gap: 0.5rem; margin-top: 0.6rem; padding-top: 1.25rem; border-top: 1px solid var(--line); width: 100%; }
.hero-proof li { display: flex; gap: 0.6rem; align-items: flex-start; color: var(--kohl); font-size: 0.9375rem; }
.hero-proof .icon { color: var(--cardamom-700); margin-top: 0.2rem; }
.home-hero__visual { position: relative; min-width: 0; padding: clamp(1rem, 2.5vw, 2rem) 0 clamp(1rem, 2.5vw, 2rem) clamp(1rem, 2.5vw, 2rem); }
.home-hero__visual::before { content: ''; position: absolute; inset: 0 -40vw 0 0; background: var(--pom); border-radius: 28px 0 0 28px; }
@media (max-width: 62rem) {
  .home-hero__grid { grid-template-columns: minmax(0, 1fr); }
  .home-hero__visual { padding: 1.25rem; }
  .home-hero__visual::before { inset: 0 calc(-1 * var(--gutter)); border-radius: 0; }
}

/* App window mock-up */
.app { position: relative; z-index: 1; background: var(--paper); border-radius: 16px; overflow: hidden; box-shadow: var(--shadow-3); font-size: 0.8125rem; line-height: 1.4; color: var(--kohl); font-variant-numeric: tabular-nums; }
.app__top { display: flex; align-items: center; gap: 0.75rem; padding: 0.6rem 0.85rem; background: var(--sand); border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.app__dots { display: inline-flex; gap: 5px; }
.app__dots i { width: 9px; height: 9px; border-radius: 999px; background: var(--line-strong); }
.app__title { font-weight: 600; font-size: 0.8125rem; margin-right: auto; }
.app__frame { display: grid; grid-template-columns: 9.5rem minmax(0, 1fr); }
.app__side { display: grid; align-content: start; gap: 0.15rem; padding: 0.85rem 0.6rem; background: #fbf6ee; border-right: 1px solid var(--line); color: var(--slate); font-weight: 500; }
.app__tenant { display: flex; align-items: center; gap: 0.5rem; color: var(--kohl); font-weight: 650; margin-bottom: 0.6rem; font-size: 0.78rem; }
.app__tenant .tenant { display: inline-grid; place-items: center; width: 1.6rem; height: 1.6rem; border-radius: 7px; background: #7d5527; color: #fff; font-size: 0.625rem; font-weight: 700; flex: none; }
.app__nav { padding: 0.4rem 0.55rem; border-radius: 7px; }
.app__nav.is-on { background: var(--pom-50); color: var(--pom); font-weight: 650; }
.app__main { padding: 0.95rem; display: grid; gap: 0.75rem; min-width: 0; }
.app__head { display: flex; justify-content: space-between; align-items: center; gap: 0.5rem; }
.app .kpi { padding: 0.6rem 0.7rem; }
.app .kpi__value { font-size: 1.125rem; }
.app .mock-row > span:last-child { display: inline-flex; align-items: center; gap: 0.4rem; }
.app .mock-row .chip { font-size: 0.6875rem; padding: 0.05rem 0.45rem; }
@media (max-width: 40rem) {
  .app__frame { grid-template-columns: minmax(0, 1fr); }
  .app__side { display: none; }
}

/* Pillars under the hero */
.pillars-section { background: var(--paper); border-bottom: 1px solid var(--line-soft); }
.pillars { list-style: none; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: clamp(1.25rem, 3vw, 2.5rem); }
.pillar { display: grid; gap: 0.5rem; align-content: start; }
.pillar__icon { display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 10px; background: var(--pom-50); color: var(--pom); margin-bottom: 0.35rem; }
.pillar__title { font-size: 1.0625rem; letter-spacing: -0.01em; }
.pillar p { color: var(--slate); font-size: 0.9375rem; }
@media (max-width: 62rem) { .pillars { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 34rem) { .pillars { grid-template-columns: minmax(0, 1fr); } }

/* How it works: tighter rhythm */
.how { gap: clamp(2.5rem, 6vw, 4.5rem); }
.step__num { background: var(--pom); width: 2rem; height: 2rem; font-size: 0.875rem; }
.step__title { font-size: clamp(1.25rem, 1.1rem + 0.5vw, 1.5rem); }

/* Benefits */
.benefits { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: clamp(1rem, 2.5vw, 1.5rem); }
.benefit { display: grid; gap: 0.85rem; align-content: start; padding: clamp(1.35rem, 2.5vw, 1.85rem); background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); box-shadow: var(--shadow-1); }
.benefit__icon { display: inline-grid; place-items: center; width: 2.75rem; height: 2.75rem; border-radius: 12px; background: var(--pom); color: #fff; }
.benefit__title { font-size: 1.25rem; letter-spacing: -0.018em; line-height: 1.25; }
.benefit__text { color: var(--slate); }
.benefit .check-list { padding-top: 0.85rem; border-top: 1px solid var(--line-soft); font-size: 0.9375rem; gap: 0.5rem; }
@media (max-width: 62rem) { .benefits { grid-template-columns: minmax(0, 1fr); } }

/* Edition comparison table */
.compare-table thead th { vertical-align: bottom; font-size: 0.9375rem; color: var(--kohl); background: var(--sand); }
.compare-table thead th:first-child { color: var(--slate); font-size: 0.8125rem; }
.compare-table thead a { color: var(--kohl); text-decoration: none; font-weight: 700; }
.compare-table thead a:hover { color: var(--pom); text-decoration: underline; }
.compare-table td { text-align: center; width: 17%; }
.compare-table th[scope='col']:not(:first-child) { text-align: center; }
.compare-table tbody th { font-weight: 500; }
.compare-table .is-flag { background: var(--pom-50); }
.compare-table thead .is-flag { background: var(--pom-100); }
.mark { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 999px; }
.mark--yes { background: #e6eedc; color: var(--cardamom-700); }
.mark--no { color: var(--slate); }
@media (max-width: 40rem) { .compare-table { min-width: 34rem; } }

.explore-grid { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: clamp(1rem, 2.5vw, 1.5rem); align-items: start; }
@media (max-width: 56rem) { .explore-grid { grid-template-columns: minmax(0, 1fr); } }
.panel { background: var(--paper); border: 1px solid var(--line-soft); border-radius: var(--r-lg); padding: clamp(1.25rem, 2.5vw, 1.75rem); box-shadow: var(--shadow-1); display: grid; gap: 1rem; align-content: start; }
.panel__title { font-size: 1.25rem; letter-spacing: -0.018em; }
.status-list { list-style: none; display: grid; }
.status-list li { display: flex; justify-content: space-between; align-items: center; gap: 0.75rem 1rem; padding: 0.8rem 0; border-top: 1px solid var(--line-soft); }
.status-list li:first-child { border-top: 0; padding-top: 0; }
.status-list strong { display: block; font-weight: 650; font-size: 0.9875rem; }
.status-list__note { display: block; color: var(--slate); font-size: 0.875rem; line-height: 1.45; }
.status-list .chip { flex: none; }
@media (max-width: 30rem) { .status-list li { flex-direction: column; align-items: flex-start; } }
.dash-links { list-style: none; display: grid; gap: 0.5rem; }
.dash-links a { display: grid; gap: 0.1rem; padding: 0.8rem 0.95rem; border: 1px solid var(--line-soft); border-radius: 12px; text-decoration: none; color: var(--kohl); background: var(--cream); transition: border-color 0.15s ease; }
.dash-links a:hover { border-color: var(--pom-300); color: var(--kohl); }
.dash-links strong { font-weight: 650; }
.dash-links span { color: var(--slate); font-size: 0.875rem; }

/* Trust */
.trust-grid { list-style: none; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0; border: 1px solid var(--line-soft); border-radius: var(--r-lg); background: var(--paper); overflow: hidden; box-shadow: var(--shadow-1); }
.trust-grid li { padding: clamp(1.15rem, 2.2vw, 1.6rem); border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); display: grid; gap: 0.4rem; align-content: start; }
.trust-grid li:nth-child(3n) { border-right: 0; }
.trust-grid li:nth-last-child(-n+3) { border-bottom: 0; }
.trust-grid h3 { font-size: 1.0625rem; letter-spacing: -0.01em; }
.trust-grid p { color: var(--slate); font-size: 0.9375rem; }
@media (max-width: 62rem) {
  .trust-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trust-grid li, .trust-grid li:nth-child(3n), .trust-grid li:nth-last-child(-n+3) { border-right: 1px solid var(--line-soft); border-bottom: 1px solid var(--line-soft); }
  .trust-grid li:nth-child(2n) { border-right: 0; }
  .trust-grid li:nth-last-child(-n+2) { border-bottom: 0; }
}
@media (max-width: 36rem) {
  .trust-grid { grid-template-columns: minmax(0, 1fr); }
  .trust-grid li, .trust-grid li:nth-child(2n), .trust-grid li:nth-last-child(-n+2) { border-right: 0; border-bottom: 1px solid var(--line-soft); }
  .trust-grid li:last-child { border-bottom: 0; }
}

/* Closing band */
.band--pom { background: linear-gradient(135deg, var(--pom) 0%, var(--pom-800) 100%); }
.band__title { max-width: 26ch; }

/* Edition pages: English edition name replaces the Devanagari panel title */
.edition-name-lg { font-weight: 700; font-size: clamp(2rem, 1.4rem + 2.2vw, 3.25rem); line-height: 1.08; letter-spacing: -0.03em; color: #fff; }

/* About: founder note */
.founder-note blockquote { margin: 0; }
.founder-note blockquote p + p { margin-top: 0.85rem; }
.founder-note blockquote p { color: var(--kohl); }

/* Header: slightly firmer bar */
.site-header { border-bottom-color: var(--line-soft); }
.site-nav__link { font-weight: 500; }

/* Keep visually hidden helpers inside scrolling tables from widening the page */
.table-wrap { position: relative; }

/* Edition pages: hero title in step with the homepage */
.hero--edition .hero__title { font-size: clamp(2.25rem, 1.6rem + 2.6vw, 3.5rem); line-height: 1.05; letter-spacing: -0.032em; }
.hero__panel--edition { min-height: 0; }

.name-card { grid-template-columns: minmax(0, 1fr); }