/* ==========================================================================
   RishteDesk design system
   --------------------------------------------------------------------------
   One stylesheet, no framework, no build step, small enough to read end to end
   -- every page on this site depends on it.

   Emerald and gold on warm paper: emerald reads as trustworthy and is
   culturally at home here, gold carries the occasion without tipping into
   gaudy. Deliberately not pink, not red, and no swipe metaphor anywhere. A site
   that asks people for their identity documents has to look like an
   institution, not a startup.
   ========================================================================== */


/* ---------- tokens ---------- */
:root {
    --ink: #14161c;
    --ink-soft: #3d4350;
    --ink-muted: #6b7280;
    --line: #efe3e5;
    --line-strong: #e2cfd2;
    --paper: #fbfaf7;
    --paper-warm: #fdf3f4;
    --card: #ffffff;

    --emerald: #b3122e;
    --emerald-mid: #c8203c;
    --emerald-dark: #7d0d24;
    --emerald-deep: #4e0716;
    --emerald-soft: #fdeef1;
    --gold: #b07a4f;
    --gold-bright: #d4a373;
    --gold-soft: #f8ece2;
    --plum: #4a2c48;
    --danger: #8f2f24;
    --danger-soft: #fbecea;
    --ok: #1f7a4d;

    --radius-xs: 6px;
    --radius-sm: 10px;
    --radius: 16px;
    --radius-lg: 24px;
    --radius-pill: 999px;

    /* A three-step shadow scale. Depth is how a flat page starts to feel built. */
    --shadow-sm: 0 1px 2px rgba(20, 22, 28, .05), 0 2px 6px rgba(20, 22, 28, .04);
    --shadow: 0 1px 2px rgba(20, 22, 28, .04), 0 10px 30px rgba(20, 22, 28, .07);
    --shadow-lg: 0 2px 4px rgba(20, 22, 28, .04), 0 24px 60px rgba(125, 13, 36, .13);
    --ring: 0 0 0 3px rgba(176, 122, 79, .28);

    --wrap: 1140px;
    --wrap-narrow: 760px;

    --serif: 'Fraunces', 'Iowan Old Style', 'Palatino Linotype', Palatino, Georgia, serif;
    --sans: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

    /* Display sizes use clamp() so headings shrink on a phone without a single
       media query doing it by hand. */
    --t-display: clamp(2.3rem, 1.4rem + 3.6vw, 4rem);
    --t-h1: clamp(1.95rem, 1.35rem + 2.3vw, 3rem);
    --t-h2: clamp(1.5rem, 1.2rem + 1.2vw, 2.1rem);
    --t-h3: 1.2rem;
    --t-lede: clamp(1.03rem, .98rem + .35vw, 1.2rem);
}

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }

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

body {
    margin: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
    font-family: var(--sans);
    font-size: 16px;
    line-height: 1.65;
    color: var(--ink-soft);
    background: var(--paper);
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
}

main { flex: 1 0 auto; }

img, svg, video { max-width: 100%; height: auto; }
svg { display: inline-block; vertical-align: middle; }

/* ---------- typography ---------- */
h1, h2, h3, h4 {
    font-family: var(--serif);
    font-weight: 600;
    line-height: 1.15;
    color: var(--ink);
    margin: 0 0 .5em;
    letter-spacing: -.015em;
    font-variation-settings: 'opsz' 40, 'SOFT' 20;
}

h1 { font-size: var(--t-h1); }
h2 { font-size: var(--t-h2); }
h3 { font-size: var(--t-h3); letter-spacing: -.005em; }
h4 { font-size: 1.02rem; }

p { margin: 0 0 1rem; }
p:last-child { margin-bottom: 0; }

a { color: var(--emerald); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }

strong, b { color: var(--ink); font-weight: 600; }

.lede { font-size: var(--t-lede); color: var(--ink-soft); line-height: 1.6; }
.muted { color: var(--ink-muted); }
.small { font-size: .875rem; }
.tiny { font-size: .8rem; }
.center { text-align: center; }

.eyebrow {
    font-size: .74rem;
    font-weight: 600;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--gold);
    margin: 0 0 .6rem;
}

/* ---------- layout ---------- */
.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 20px; }
.wrap.narrow { max-width: var(--wrap-narrow); }

.section { padding: clamp(48px, 6vw, 84px) 0; }
.section-tight { padding: clamp(32px, 4vw, 52px) 0; }
.section-paper { background: var(--paper-warm); }
.section-soft { background: var(--emerald-soft); }

.grid { display: grid; gap: 22px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.grid-3 { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.grid-4 { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }

.stack > * + * { margin-top: 14px; }
.row { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; }
.row-between { justify-content: space-between; }

/* ---------- header ---------- */
.site-header {
    position: sticky;
    top: 0;
    z-index: 50;
    background: rgba(255, 255, 255, .88);
    backdrop-filter: saturate(180%) blur(14px);
    border-bottom: 1px solid var(--line);
}

.site-header .wrap {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
    min-height: 68px;
}

.brand {
    font-family: var(--serif);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--emerald-dark);
    letter-spacing: -.025em;
    font-variation-settings: 'opsz' 60, 'SOFT' 40;
}
.brand:hover { text-decoration: none; }
.brand span { color: var(--gold); }

.site-nav { display: flex; align-items: center; gap: 26px; }
.site-nav a { color: var(--ink-soft); font-size: .94rem; font-weight: 500; }
.site-nav a:hover { color: var(--emerald); text-decoration: none; }
.site-nav a.active { color: var(--emerald-dark); font-weight: 600; }

/* ---------- buttons ---------- */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: .78rem 1.45rem;
    border-radius: var(--radius-pill);
    border: 1px solid transparent;
    font-family: var(--sans);
    font-size: .95rem;
    font-weight: 600;
    line-height: 1.2;
    cursor: pointer;
    text-align: center;
    transition: transform .16s ease, box-shadow .16s ease, background-color .16s ease, border-color .16s ease;
}
.btn:hover { text-decoration: none; transform: translateY(-1px); }
.btn:active { transform: translateY(0); }
.btn:focus-visible { outline: none; box-shadow: var(--ring); }

.btn-primary {
    background: linear-gradient(180deg, var(--emerald-mid), var(--emerald));
    color: #fff;
    box-shadow: 0 1px 2px rgba(125, 13, 36, .28), 0 8px 20px rgba(125, 13, 36, .22);
}
.btn-primary:hover { box-shadow: 0 2px 4px rgba(125, 13, 36, .3), 0 14px 30px rgba(125, 13, 36, .28); }

.btn-gold {
    background: linear-gradient(180deg, var(--gold-bright), var(--gold));
    color: #fff;
    box-shadow: 0 1px 2px rgba(122, 80, 48, .3), 0 8px 20px rgba(176, 122, 79, .3);
}
.btn-gold:hover { box-shadow: 0 2px 4px rgba(122, 80, 48, .32), 0 14px 30px rgba(176, 122, 79, .36); }

.btn-ghost { background: transparent; border-color: var(--line-strong); color: var(--ink); }
.btn-ghost:hover { border-color: var(--emerald); color: var(--emerald-dark); background: rgba(179, 18, 46, .04); }

.btn-on-dark { background: rgba(255, 255, 255, .1); border-color: rgba(255, 255, 255, .35); color: #fff; }
.btn-on-dark:hover { background: rgba(255, 255, 255, .18); border-color: rgba(255, 255, 255, .6); color: #fff; }

.btn-danger { background: var(--danger); color: #fff; }
.btn-sm { padding: .5rem 1rem; font-size: .86rem; }
.btn-lg { padding: .95rem 1.9rem; font-size: 1.02rem; }
.btn-block { width: 100%; }

/* ---------- hero ---------- */
.hero {
    position: relative;
    overflow: hidden;
    background:
        radial-gradient(1100px 520px at 12% -10%, rgba(176, 122, 79, .28), transparent 62%),
        radial-gradient(900px 480px at 92% 8%, rgba(200, 32, 60, .5), transparent 60%),
        linear-gradient(160deg, var(--emerald-dark) 0%, var(--emerald-deep) 100%);
    color: #fff;
    padding: clamp(56px, 8vw, 110px) 0 clamp(48px, 6vw, 88px);
}

/* A faint lattice, the kind you see in tile and jali work. Drawn in CSS rather
   than loaded as an image, so it costs nothing and scales cleanly. */
.hero::before {
    content: '';
    position: absolute;
    inset: 0;
    background-image:
        linear-gradient(45deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, .05) 75%),
        linear-gradient(45deg, rgba(255, 255, 255, .05) 25%, transparent 25%, transparent 75%, rgba(255, 255, 255, .05) 75%);
    background-size: 46px 46px;
    background-position: 0 0, 23px 23px;
    opacity: .5;
    pointer-events: none;
}

.hero > .wrap { position: relative; z-index: 1; }
.hero h1 { color: #fff; font-size: var(--t-display); max-width: 16ch; font-variation-settings: 'opsz' 100, 'SOFT' 30; }
.hero .lede { color: rgba(255, 255, 255, .84); max-width: 58ch; }
.hero .eyebrow { color: var(--gold-bright); }
.hero .actions { display: flex; gap: 14px; flex-wrap: wrap; margin-top: 30px; }
.hero .muted { color: rgba(255, 255, 255, .6); }

/* A compact page header for inner pages -- same family as the hero, less shouting. */
.page-head {
    background: linear-gradient(160deg, var(--emerald-dark), var(--emerald-deep));
    color: #fff;
    padding: clamp(36px, 5vw, 64px) 0;
}
.page-head h1 { color: #fff; margin-bottom: .3rem; }
.page-head .lede { color: rgba(255, 255, 255, .8); }
.page-head .eyebrow { color: var(--gold-bright); }

/* ---------- trust row ---------- */
.trust-row {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(230px, 1fr));
    gap: 1px;
    margin-top: clamp(38px, 5vw, 62px);
    background: rgba(255, 255, 255, .14);
    border: 1px solid rgba(255, 255, 255, .14);
    border-radius: var(--radius);
    overflow: hidden;
}
.trust-row > div {
    padding: 20px 22px;
    background: rgba(255, 255, 255, .05);
    font-size: .88rem;
    color: rgba(255, 255, 255, .74);
    line-height: 1.5;
}
.trust-row strong {
    display: flex;
    align-items: center;
    gap: 9px;
    color: #fff;
    font-family: var(--serif);
    font-size: 1.04rem;
    font-weight: 600;
    margin-bottom: .35rem;
}
.trust-row svg { width: 18px; height: 18px; flex: none; color: var(--gold-bright); }

/* ---------- cards ---------- */
.card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 26px;
    box-shadow: var(--shadow-sm);
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card-tight { padding: 18px; }
.card-lift:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.card h3 { margin-bottom: .45rem; }

/* An icon medallion: small, consistent, and the single biggest reason a page of
   text starts reading as a designed page. */
.icon-badge {
    width: 46px;
    height: 46px;
    border-radius: 13px;
    display: grid;
    place-items: center;
    margin-bottom: 16px;
    background: linear-gradient(160deg, var(--emerald-soft), #fff);
    border: 1px solid var(--line);
    color: var(--emerald);
}
.icon-badge svg { width: 22px; height: 22px; }
.icon-badge.gold { background: linear-gradient(160deg, var(--gold-soft), #fff); color: var(--gold); }

/* ---------- steps ---------- */
.steps { counter-reset: step; display: grid; gap: 24px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.step { position: relative; padding-top: 52px; }
.step::before {
    counter-increment: step;
    content: counter(step);
    position: absolute;
    top: 0;
    left: 0;
    width: 38px;
    height: 38px;
    border-radius: 50%;
    display: grid;
    place-items: center;
    font-family: var(--serif);
    font-size: 1.05rem;
    font-weight: 700;
    color: var(--emerald-dark);
    background: var(--gold-soft);
    border: 1px solid var(--gold);
}
.step h3 { margin-bottom: .3rem; }

/* ---------- badges ---------- */
.badge {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: .26rem .66rem;
    border-radius: var(--radius-pill);
    font-size: .76rem;
    font-weight: 600;
    background: var(--emerald-soft);
    color: var(--emerald-dark);
    border: 1px solid rgba(179, 18, 46, .16);
}
.badge-gold { background: var(--gold-soft); color: #7a5030; border-color: rgba(176, 122, 79, .28); }
.badge-off { background: #f1efe9; color: var(--ink-muted); border-color: var(--line); }
.badge-bad { background: var(--danger-soft); color: var(--danger); border-color: rgba(143, 47, 36, .2); }

/* ---------- pricing ---------- */
.period-switch {
    display: inline-flex;
    padding: 5px;
    gap: 4px;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius-pill);
    box-shadow: var(--shadow-sm);
    flex-wrap: wrap;
    justify-content: center;
}
.period-switch a {
    padding: .5rem 1.05rem;
    border-radius: var(--radius-pill);
    font-size: .88rem;
    font-weight: 600;
    color: var(--ink-soft);
    white-space: nowrap;
}
.period-switch a:hover { text-decoration: none; background: var(--paper-warm); }
.period-switch a.active, .period-switch a.active:hover { background: var(--emerald); color: #fff; }
.period-switch .save { font-size: .7rem; opacity: .9; margin-left: 5px; font-weight: 700; }

.plan-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fit, minmax(245px, 1fr)); align-items: stretch; }

.plan {
    position: relative;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: 26px 24px;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease;
}
.plan:hover { transform: translateY(-3px); box-shadow: var(--shadow); }

.plan-featured { border-color: var(--emerald); box-shadow: var(--shadow-lg); }
.plan-featured::after {
    content: 'Most chosen';
    position: absolute;
    top: -12px;
    left: 50%;
    transform: translateX(-50%);
    padding: .3rem .85rem;
    border-radius: var(--radius-pill);
    background: linear-gradient(180deg, var(--gold-bright), var(--gold));
    color: #fff;
    font-size: .72rem;
    font-weight: 700;
    letter-spacing: .06em;
    text-transform: uppercase;
    white-space: nowrap;
}

.plan-name { font-family: var(--serif); font-size: 1.25rem; font-weight: 600; color: var(--ink); margin: 0 0 .15rem; }
.plan-price { font-family: var(--serif); font-size: 2.1rem; font-weight: 700; color: var(--emerald-dark); line-height: 1.1; margin: 14px 0 2px; letter-spacing: -.02em; }
.plan-price .cur { font-size: .95rem; font-weight: 600; color: var(--ink-muted); letter-spacing: 0; }
.plan-term { font-size: .82rem; color: var(--ink-muted); margin: 0 0 18px; }

.plan ul { list-style: none; margin: 0 0 22px; padding: 0; display: grid; gap: 9px; }
.plan li { display: flex; gap: 9px; align-items: flex-start; font-size: .89rem; line-height: 1.45; }
.plan li svg { width: 16px; height: 16px; flex: none; margin-top: 3px; color: var(--emerald); }
.plan li.off { color: var(--ink-muted); }
.plan li.off svg { color: var(--line-strong); }
.plan .btn { margin-top: auto; }

/* ---------- forms ---------- */
label { display: block; font-size: .9rem; font-weight: 600; color: var(--ink); margin-bottom: .35rem; }
label .opt { font-weight: 400; color: var(--ink-muted); }

input[type=text], input[type=email], input[type=password], input[type=tel],
input[type=number], input[type=date], input[type=search], input[type=url], select, textarea {
    width: 100%;
    padding: .72rem .9rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-sm);
    background: #fff;
    font-family: var(--sans);
    font-size: .97rem;
    color: var(--ink);
    transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--emerald); box-shadow: 0 0 0 3px rgba(179, 18, 46, .13); }
input::placeholder, textarea::placeholder { color: #9aa1ad; }
textarea { resize: vertical; min-height: 110px; }
select {
    appearance: none;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%236b7280' stroke-width='1.6'%3E%3Cpath d='M4 6l4 4 4-4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right .8rem center;
    background-size: 16px;
    padding-right: 2.4rem;
}

.field { margin-bottom: 18px; }
.field .hint { font-size: .82rem; color: var(--ink-muted); margin: .4rem 0 0; }
.field-error { color: var(--danger); font-size: .84rem; margin: .4rem 0 0; }
input.is-error, select.is-error, textarea.is-error { border-color: var(--danger); }

.check { display: flex; gap: 10px; align-items: flex-start; margin-bottom: 12px; }
.check input[type=checkbox], .check input[type=radio] { width: 17px; height: 17px; margin: 3px 0 0; flex: none; accent-color: var(--emerald); }
.check label { font-weight: 400; font-size: .92rem; color: var(--ink-soft); margin: 0; }

fieldset { border: 0; margin: 0; padding: 0; }

/* ---------- auth / form pages ---------- */
.form-shell { max-width: 560px; margin: 0 auto; }
.form-card { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: clamp(24px, 4vw, 38px); box-shadow: var(--shadow); }

.stepper { display: flex; align-items: center; gap: 8px; margin-bottom: 22px; }
.stepper span { width: 34px; height: 4px; border-radius: var(--radius-pill); background: var(--line-strong); }
.stepper span.done { background: var(--emerald); }
.stepper span.now { background: var(--gold); }

/* ---------- alerts ---------- */
.alert { padding: 14px 16px; border-radius: var(--radius-sm); border: 1px solid; margin-bottom: 18px; font-size: .92rem; }
.alert-note { background: var(--gold-soft); border-color: rgba(176, 122, 79, .3); color: #7a5030; }
.alert-good { background: var(--emerald-soft); border-color: rgba(179, 18, 46, .22); color: var(--emerald-dark); }
.alert-bad { background: var(--danger-soft); border-color: rgba(143, 47, 36, .24); color: var(--danger); }

/* ---------- tables ---------- */
table { width: 100%; border-collapse: collapse; font-size: .92rem; }
th, td { padding: .7rem .8rem; text-align: left; border-bottom: 1px solid var(--line); }
th { font-weight: 600; color: var(--ink); background: var(--paper-warm); font-size: .84rem; letter-spacing: .02em; }
tbody tr:hover { background: var(--paper); }

/* ---------- misc ---------- */
.stat b { display: block; font-family: var(--serif); font-size: 1.9rem; line-height: 1.1; color: var(--emerald-dark); }
.divider { height: 1px; background: var(--line); border: 0; margin: 28px 0; }

.quote {
    border-left: 3px solid var(--gold);
    padding: 4px 0 4px 18px;
    font-family: var(--serif);
    font-size: 1.12rem;
    color: var(--ink);
    line-height: 1.5;
}

.cta-band {
    background: linear-gradient(140deg, var(--emerald-dark), var(--emerald-deep));
    color: #fff;
    border-radius: var(--radius-lg);
    padding: clamp(30px, 5vw, 54px);
    text-align: center;
    box-shadow: var(--shadow-lg);
}
.cta-band h2 { color: #fff; }
.cta-band p { color: rgba(255, 255, 255, .82); max-width: 54ch; margin-left: auto; margin-right: auto; }

/* ---------- footer ---------- */
.site-footer { background: #101318; color: rgba(255, 255, 255, .62); padding: clamp(40px, 5vw, 64px) 0 30px; font-size: .92rem; }
.site-footer .brand { color: #fff; }
.site-footer h4 { color: #fff; font-family: var(--sans); font-size: .82rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 14px; }
.site-footer a { color: rgba(255, 255, 255, .62); }
.site-footer a:hover { color: #fff; }
.site-footer .foot-grid { display: grid; gap: 34px; grid-template-columns: 1.6fr 1fr 1fr; }
@media (max-width: 760px) { .site-footer .foot-grid { grid-template-columns: 1fr 1fr; } }
.site-footer .legal { border-top: 1px solid rgba(255, 255, 255, .1); margin-top: 34px; padding-top: 20px; font-size: .84rem; color: rgba(255, 255, 255, .45); }

/* ---------- accessibility ---------- */
.skip-link {
    position: absolute;
    inset-inline-start: -9999px;
    top: 8px;
    background: #fff;
    color: var(--emerald-dark);
    padding: .6rem 1rem;
    border-radius: var(--radius-sm);
    z-index: 100;
    font-weight: 600;
}
.skip-link:focus { inset-inline-start: 12px; }

:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

/* ---------- small screens ---------- */
@media (max-width: 760px) {
    .site-nav { gap: 16px; }
    .site-header .wrap { min-height: 60px; flex-wrap: wrap; padding-top: 10px; padding-bottom: 10px; }
    .hero .actions .btn { width: 100%; }
    .trust-row { margin-top: 32px; }
}

/* ==========================================================================
   Carried forward from the first stylesheet
   --------------------------------------------------------------------------
   These selectors are used by views across the site -- the admin shell in
   particular -- so they are kept, restyled onto the new tokens rather than
   dropped. A class audit across all 80 blade files found each of them still in
   use; removing any one silently breaks a page that has no test covering its
   layout.
   ========================================================================== */

.site-header .bar { display: flex; align-items: center; gap: 24px; min-height: 68px; }

.field-row { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

.alert-ok { background: var(--emerald-soft); border-color: rgba(179, 18, 46, .22); color: var(--emerald-dark); }

.errors {
    margin: 0 0 20px;
    padding: .85rem 1rem .85rem 2rem;
    background: var(--danger-soft);
    border: 1px solid rgba(143, 47, 36, .24);
    border-radius: var(--radius-sm);
    color: var(--danger);
    font-size: .9rem;
}

.badge-ok { background: var(--emerald-soft); color: var(--emerald-dark); border-color: rgba(179, 18, 46, .16); }
.badge-wait { background: var(--gold-soft); color: #7a5030; border-color: rgba(176, 122, 79, .28); }

.meter { height: 8px; background: #eceae4; border-radius: var(--radius-pill); overflow: hidden; }
.meter i { display: block; height: 100%; border-radius: var(--radius-pill); background: linear-gradient(90deg, var(--emerald), var(--emerald-mid)); }

.table-wrap { overflow-x: auto; border-radius: var(--radius-sm); }

/* profile detail list */
.facts { display: grid; gap: 0; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.facts div { padding: 12px 0; border-bottom: 1px solid #f1efea; }
.facts dt { font-size: .8rem; text-transform: uppercase; letter-spacing: .06em; color: var(--ink-muted); }
.facts dd { margin: .2rem 0 0; font-size: 1rem; color: var(--ink); }

.site-footer .cols { display: grid; gap: 28px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }

/* ---------- admin shell ---------- */
.admin-shell { display: grid; grid-template-columns: 250px 1fr; min-height: 100vh; }
.admin-side { background: #10131a; color: #c8cfd9; padding: 22px 16px; }
.admin-side .brand { color: #fff; font-size: 1.18rem; }
.admin-side .brand span { color: var(--gold-bright); }
.admin-side nav { margin-top: 22px; display: grid; gap: 2px; }
.admin-side nav a { display: block; padding: .55rem .7rem; border-radius: var(--radius-sm); color: #c8cfd9; font-size: .92rem; }
.admin-side nav a:hover, .admin-side nav a.active { background: rgba(255, 255, 255, .09); color: #fff; text-decoration: none; }
.admin-side nav a.active { box-shadow: inset 3px 0 0 var(--gold); }
.admin-side .group { font-size: .72rem; text-transform: uppercase; letter-spacing: .1em; color: #6b7686; margin: 20px 0 6px .7rem; }
.admin-main { padding: clamp(20px, 3vw, 34px); background: var(--paper); }

@media (max-width: 900px) {
    .admin-shell { grid-template-columns: 1fr; }
    .admin-side { padding: 16px; }
    .admin-side nav { grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); }
}
/* A checkbox row is often written as <label class="check"> wrapping the input and
   its text. The generic `label` rule above would make that text bold and blocky,
   so it is reset here rather than in every view that uses the pattern. */
label.check { font-weight: 400; font-size: .92rem; color: var(--ink-soft); margin-bottom: 0; }
label.check a { font-weight: 500; }
/* ==========================================================================
   Live assistant widget
   ========================================================================== */
#rd-assistant { position: fixed; right: 18px; bottom: 18px; z-index: 80; font-family: var(--sans); }

#rd-assistant-toggle {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    padding: .72rem 1.15rem;
    border: 0;
    border-radius: var(--radius-pill);
    background: linear-gradient(180deg, var(--emerald-mid), var(--emerald));
    color: #fff;
    font-family: var(--sans);
    font-size: .92rem;
    font-weight: 600;
    cursor: pointer;
    box-shadow: 0 2px 6px rgba(125, 13, 36, .3), 0 12px 30px rgba(125, 13, 36, .28);
    transition: transform .16s ease, box-shadow .16s ease;
}
#rd-assistant-toggle:hover { transform: translateY(-2px); }
#rd-assistant-toggle svg { width: 19px; height: 19px; }
#rd-assistant.is-open #rd-assistant-toggle { display: none; }

/* Must come before the sizing rule below: `display: flex` there would otherwise
   override the browser's own `[hidden] { display: none }`, which is exactly how
   the panel ended up impossible to close. */
#rd-assistant-panel[hidden] { display: none; }

#rd-assistant-panel {
    width: min(380px, calc(100vw - 32px));
    height: min(560px, calc(100vh - 120px));
    display: flex;
    flex-direction: column;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-lg);
    overflow: hidden;
}

#rd-assistant-panel header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
    padding: 16px 18px;
    background: linear-gradient(150deg, var(--emerald-dark), var(--emerald-deep));
    color: #fff;
}
#rd-assistant-panel header strong { display: block; color: #fff; font-family: var(--serif); font-size: 1.05rem; }
#rd-assistant-panel header span { font-size: .78rem; color: rgba(255, 255, 255, .7); }
#rd-assistant-close {
    background: transparent; border: 0; color: rgba(255, 255, 255, .75);
    font-size: 1.5rem; line-height: 1; cursor: pointer; padding: 0 2px;
}
#rd-assistant-close:hover { color: #fff; }

#rd-assistant-log { flex: 1; overflow-y: auto; padding: 16px; background: var(--paper); }

.rd-msg { margin-bottom: 12px; display: flex; }
.rd-msg p {
    margin: 0;
    padding: .65rem .85rem;
    border-radius: 14px;
    font-size: .89rem;
    line-height: 1.5;
    max-width: 88%;
    white-space: pre-wrap;
}
.rd-bot p { background: #fff; border: 1px solid var(--line); color: var(--ink-soft); }
.rd-user { justify-content: flex-end; }
.rd-user p { background: var(--emerald-soft); border: 1px solid rgba(179, 18, 46, .16); color: var(--ink); }
.rd-thinking p { color: var(--ink-muted); letter-spacing: .2em; }

.rd-chips { display: flex; flex-wrap: wrap; gap: 7px; margin: 0 0 14px; }
.rd-chips button, .rd-chips a {
    padding: .38rem .78rem;
    border-radius: var(--radius-pill);
    border: 1px solid var(--line-strong);
    background: #fff;
    color: var(--emerald-dark);
    font-family: var(--sans);
    font-size: .8rem;
    font-weight: 600;
    cursor: pointer;
    text-decoration: none;
}
.rd-chips button:hover, .rd-chips a:hover { border-color: var(--emerald); background: var(--emerald-soft); text-decoration: none; }

#rd-assistant-form { display: flex; gap: 8px; padding: 12px 14px; border-top: 1px solid var(--line); background: #fff; }
#rd-assistant-form input { flex: 1; padding: .6rem .8rem; font-size: .9rem; }
#rd-assistant-send:disabled { opacity: .55; cursor: default; transform: none; }

#rd-assistant .rd-foot {
    margin: 0;
    padding: 10px 14px 13px;
    background: #fff;
    border-top: 1px solid var(--line);
    font-size: .72rem;
    line-height: 1.45;
    color: var(--ink-muted);
}

@media (max-width: 520px) {
    #rd-assistant { right: 12px; bottom: 12px; left: 12px; }
    #rd-assistant-panel { width: 100%; height: min(70vh, 520px); }
    #rd-assistant-toggle { width: 100%; justify-content: center; }
}
/* ---------- collapsible panels (filters, "read more") ---------- */
details > summary {
    position: relative;
    padding-right: 28px;
    list-style: none;
}
details > summary::-webkit-details-marker { display: none; }
details > summary::after {
    content: '';
    position: absolute;
    right: 4px;
    top: .35em;
    width: 8px;
    height: 8px;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .18s ease;
    opacity: .6;
}
details[open] > summary::after { transform: rotate(-135deg); }
details > summary:hover { color: var(--emerald); }
/* ---------- profile card ---------- */
.p-card {
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow-sm);
    display: flex;
    flex-direction: column;
    transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.p-card:hover { transform: translateY(-3px); box-shadow: var(--shadow); border-color: var(--line-strong); }

.p-card-media { position: relative; display: block; aspect-ratio: 4 / 5; background: var(--emerald-soft); }
.p-card-media:hover { text-decoration: none; }
.p-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; }

.p-card-nophoto {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    color: var(--emerald);
    opacity: .55;
}
.p-card-nophoto svg { width: 42px; height: 42px; }

/* The name sits on the image, over a gradient so it stays readable whatever the
   photo behind it looks like. */
.p-card-name {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 34px 14px 12px;
    background: linear-gradient(to top, rgba(78, 7, 22, .88), rgba(78, 7, 22, 0));
    color: #fff;
}
.p-card-name strong { display: block; font-family: var(--serif); font-size: 1.1rem; color: #fff; line-height: 1.2; }
.p-card-name span { display: block; font-size: .82rem; color: rgba(255, 255, 255, .82); margin-top: 2px; }

.p-card-verified {
    position: absolute;
    top: 10px;
    left: 10px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    padding: .28rem .6rem;
    border-radius: var(--radius-pill);
    background: rgba(255, 255, 255, .94);
    color: var(--emerald-dark);
    font-size: .73rem;
    font-weight: 700;
    box-shadow: 0 2px 8px rgba(125, 13, 36, .22);
}
.p-card-verified svg { width: 13px; height: 13px; }

.p-card-body { padding: 14px; display: flex; flex-direction: column; flex: 1; }
.p-card-body .row { margin-top: auto; }
/* The match band, over the photo, opposite the verification badge. */
.p-card-flag {
    position: absolute;
    top: 10px;
    right: 10px;
    box-shadow: 0 2px 8px rgba(125, 13, 36, .22);
    background: rgba(255, 255, 255, .94);
}
/* ---------- conversation list ---------- */
.conv {
    display: flex;
    align-items: center;
    gap: 14px;
    padding: 14px 16px;
    background: var(--card);
    border: 1px solid var(--line);
    border-radius: var(--radius-sm);
    margin-bottom: 10px;
    color: var(--ink-soft);
    transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.conv:hover { text-decoration: none; border-color: var(--line-strong); box-shadow: var(--shadow-sm); transform: translateY(-1px); }

/* An unread conversation is the reason someone opened this page, so it is marked
   rather than left to a small badge alone. */
.conv-unread { border-color: rgba(179, 18, 46, .3); background: linear-gradient(90deg, var(--emerald-soft), #fff 40%); }
.conv-unread strong { color: var(--emerald-dark); }

.conv-avatar { width: 52px; height: 52px; border-radius: 50%; object-fit: cover; flex: none; }
.conv-avatar-blank { background: var(--emerald-soft); display: block; }

.conv-main { flex: 1; min-width: 0; display: block; }
.conv-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 2px; }
.conv-top strong { font-family: var(--serif); font-size: 1.02rem; color: var(--ink); }
.conv-main .small { display: block; }

.conv-end { flex: none; display: flex; align-items: center; gap: 10px; }

@media (max-width: 560px) {
    .conv { padding: 12px; gap: 11px; }
    .conv-avatar { width: 44px; height: 44px; }
}
/* ---------- profile page header ---------- */
.p-head { display: grid; gap: 28px; grid-template-columns: minmax(0, 340px) minmax(0, 1fr); align-items: start; margin-bottom: 30px; }
@media (max-width: 820px) { .p-head { grid-template-columns: 1fr; } }

.p-head-main {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 5;
    border-radius: var(--radius);
    overflow: hidden;
    background: var(--emerald-soft);
    box-shadow: var(--shadow);
}
.p-head-main img { width: 100%; height: 100%; object-fit: cover; }

.p-head-nophoto {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 10px;
    color: var(--emerald);
    opacity: .5;
}
.p-head-nophoto svg { width: 54px; height: 54px; }

.p-head-strip { display: flex; gap: 8px; margin-top: 10px; flex-wrap: wrap; }
.p-head-strip img {
    width: 62px;
    height: 62px;
    object-fit: cover;
    border-radius: var(--radius-xs);
    border: 1px solid var(--line);
}
.p-head-strip a:hover img { border-color: var(--emerald); }
/* ==========================================================================
   Urdu / right-to-left
   --------------------------------------------------------------------------
   <html dir="rtl" lang="ur"> is set by the layout from config('rishtedesk.locales').
   Flexbox and grid mirror themselves under dir=rtl; what follows handles the
   things that do not: physical left/right, letter-spacing, and the script.
   ========================================================================== */

/* Nastaliq for Urdu, with Inter still used for any Latin in the same line
   (brand name, emails, numbers). Nastaliq is tall and sloping: it needs a much
   larger line-height than Latin, and a touch more size to stay legible. */
[lang="ur"] body,
[lang="ur"] input, [lang="ur"] select, [lang="ur"] textarea, [lang="ur"] button, [lang="ur"] .btn {
    font-family: 'Noto Nastaliq Urdu', var(--sans);
}
[lang="ur"] body { font-size: 17px; line-height: 2.15; }
[lang="ur"] h1, [lang="ur"] h2, [lang="ur"] h3, [lang="ur"] h4,
[lang="ur"] .brand-tagline, [lang="ur"] .plan-name, [lang="ur"] .p-card-name strong, [lang="ur"] .conv-top strong {
    font-family: 'Noto Nastaliq Urdu', var(--serif);
    line-height: 1.9;
    font-variation-settings: normal;
}
[lang="ur"] .lede { line-height: 2.1; }
[lang="ur"] .btn { line-height: 1.9; padding-top: .55rem; padding-bottom: .55rem; }

/* Letter-spacing and uppercase break Arabic-script joining: letters that must
   connect are pushed apart. Every tracked or uppercased style is reset. */
[lang="ur"] *, [lang="ur"] *::before, [lang="ur"] *::after { letter-spacing: 0 !important; }
[lang="ur"] .eyebrow, [lang="ur"] .site-footer h4, [lang="ur"] th, [lang="ur"] .facts dt { text-transform: none; }

/* The brand is a Latin wordmark and stays in its own face on every page. */
[lang="ur"] .brand { font-family: var(--serif); line-height: 1.2; }

/* ---- physical directions that do not mirror by themselves ---- */
[dir="rtl"] th, [dir="rtl"] td { text-align: right; }
[dir="rtl"] .quote { border-left: 0; border-right: 3px solid var(--gold); padding: 4px 18px 4px 0; }
[dir="rtl"] .period-switch .save { margin-left: 0; margin-right: 5px; }
[dir="rtl"] select { background-position: left .8rem center; padding-right: .9rem; padding-left: 2.4rem; }
[dir="rtl"] details > summary { padding-right: 0; padding-left: 28px; }
[dir="rtl"] details > summary::after { right: auto; left: 4px; }
[dir="rtl"] .p-card-verified { left: auto; right: 10px; }
[dir="rtl"] .p-card-flag { right: auto; left: 10px; }
[dir="rtl"] .conv-unread { background: linear-gradient(270deg, var(--emerald-soft), #fff 40%); }
[dir="rtl"] .meter i { background: linear-gradient(270deg, var(--emerald), var(--emerald-mid)); }
[dir="rtl"] .admin-side nav a.active { box-shadow: inset -3px 0 0 var(--gold); }
[dir="rtl"] #rd-assistant { right: auto; left: 18px; }
@media (max-width: 520px) { [dir="rtl"] #rd-assistant { left: 12px; right: 12px; } }

/* Inline styles written for left-to-right, overridden by what they contain. */
[dir="rtl"] [style*="text-align:right"], [dir="rtl"] [style*="text-align: right"] { text-align: left !important; }
[dir="rtl"] [style*="margin-left:auto"], [dir="rtl"] [style*="margin-left: auto"] { margin-left: 0 !important; margin-right: auto !important; }

/* Numbers, emails, IBANs and phone numbers read left-to-right even inside Urdu. */
[dir="rtl"] .ltr, [dir="rtl"] input[type=email], [dir="rtl"] input[type=tel], [dir="rtl"] input[type=number] { direction: ltr; text-align: right; }

/* ---- the language switch in the header ---- */
.lang-switch {
    padding: .3rem .8rem;
    border: 1px solid var(--line-strong);
    border-radius: var(--radius-pill);
    font-weight: 600 !important;
    color: var(--emerald-dark) !important;
}
.lang-switch:hover { border-color: var(--emerald); background: var(--emerald-soft); text-decoration: none; }
.lang-switch:lang(ur) { font-family: 'Noto Nastaliq Urdu', var(--sans); line-height: 1.6; }


/* ---------- homepage (photography + ornament, 2026-09 redesign) ----------
   Everything here is prefixed h- and only used by pages/home.blade.php.
   Logical properties throughout so the Urdu (dir=rtl) page mirrors. */
.h-orn { display: block; width: 140px; height: 18px; color: var(--gold-bright); margin-block: 16px 0; }
.h-head { max-width: 60ch; margin-block-end: 38px; }
.h-head .h-orn { margin-inline-start: 0; }

.h-hero-grid { display: grid; gap: clamp(32px, 5vw, 64px); grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); align-items: center; }
.h-hero-media { position: relative; padding-block-end: 28px; padding-inline-start: 36px; }
.h-frame { position: relative; border-radius: 200px 200px var(--radius-lg) var(--radius-lg); max-width: 500px; margin-inline-start: auto; }
.h-frame::before {
    content: ''; position: absolute; inset: -12px; border: 1px solid rgba(212, 163, 115, .55);
    border-radius: 212px 212px 30px 30px; pointer-events: none;
}
.h-frame::after {
    content: ''; position: absolute; inset-block-start: -22px; inset-inline-start: 50%; width: 14px; height: 14px;
    background: var(--gold-bright); transform: translateX(-50%) rotate(45deg); box-shadow: 0 0 0 5px var(--emerald-dark);
}
[dir="rtl"] .h-frame::after { transform: translateX(50%) rotate(45deg); }
.h-frame img {
    display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover;
    border-radius: 200px 200px var(--radius-lg) var(--radius-lg);
    box-shadow: 0 30px 70px rgba(0, 0, 0, .38);
}
.h-glass-stack { position: absolute; inset-inline-start: 0; inset-block-end: 0; display: grid; gap: 10px; width: min(300px, 70%); }
.h-glass {
    background: rgba(78, 7, 22, .62); border: 1px solid rgba(255, 255, 255, .18); border-radius: var(--radius);
    padding: 16px 18px; backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px);
    box-shadow: 0 12px 30px rgba(0, 0, 0, .25);
}

.h-split { display: grid; gap: clamp(28px, 4vw, 52px); grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: center; }
.h-photo { margin: 0; position: relative; border-radius: var(--radius-lg); overflow: hidden; box-shadow: var(--shadow-lg); }
.h-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.h-photo::after { content: ''; position: absolute; inset: 10px; border: 1px solid rgba(248, 236, 226, .5); border-radius: calc(var(--radius-lg) - 8px); pointer-events: none; }
.h-photo-tall img { aspect-ratio: 4 / 4.4; }
.h-feature-list { display: grid; gap: 14px; }
.h-feature { display: flex; gap: 16px; align-items: flex-start; padding: 20px 22px; }
.h-feature .icon-badge { flex: none; margin: 0; }
.h-feature h3 { font-size: 1.12rem; }

.h-steps-section .steps { position: relative; }
.h-steps-section .h-head { margin-inline: auto; text-align: center; }
.h-steps-section .h-head .h-orn { margin-inline: auto; }

.h-media-card { position: relative; padding-block-end: 90px; }
.h-checklist {
    position: absolute; inset-block-end: 0; inset-inline-end: -8px; width: min(400px, 88%);
    background: var(--card); border-color: rgba(176, 122, 79, .35); box-shadow: var(--shadow-lg); padding: 22px;
    border-block-start: 3px solid var(--gold-bright);
}
.h-guide { border-block-start: 3px solid var(--gold-bright); }

.h-cta { position: relative; overflow: hidden; isolation: isolate; padding-block: clamp(48px, 8vw, 96px); }
.h-cta-bg { position: absolute; inset: 0; z-index: -1; }
.h-cta-bg img { width: 100%; height: 100%; object-fit: cover; }
.h-cta-bg::after {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(180deg, rgba(78, 7, 22, .78), rgba(78, 7, 22, .9)), radial-gradient(600px 300px at 50% 0, rgba(212, 163, 115, .25), transparent 70%);
}
.h-cta .h-orn { margin: 0 auto 14px; }
.h-cta-body { position: relative; }

@media (max-width: 860px) {
    .h-hero-grid, .h-split { grid-template-columns: minmax(0, 1fr); }
    .h-hero-media { padding: 0; max-width: 460px; margin-inline: auto; width: 100%; }
    .h-frame { margin-inline: auto; }
    .h-glass-stack { position: static; width: auto; margin-block-start: -60px; margin-inline: 12px; }
    .h-split-rev .h-media-card { order: 2; }
    .h-media-card { padding: 0; }
    .h-checklist { position: relative; inset: auto; width: auto; margin: -40px 12px 0; }
}
@media (max-width: 480px) {
    .h-feature { flex-direction: column; gap: 12px; }
}

/* Phase B: hero quick search, verification tiers, stories, trust */
.h-qs{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;align-items:end;margin-top:22px;padding:14px;border-radius:14px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16)}
.h-qs label{display:flex;flex-direction:column;gap:4px;font-size:.78rem;color:rgba(255,255,255,.8);margin:0}
.h-qs select,.h-qs input{width:100%;min-width:0;padding:9px 10px;border-radius:9px;border:1px solid rgba(255,255,255,.25);background:#fff;color:#4e0716;font:inherit;font-size:.9rem}
.h-qs-age{display:flex;gap:6px;align-items:center;color:#fff}
.h-qs-age input{width:100%}
@media (max-width:640px){.h-qs{grid-template-columns:1fr 1fr}.h-qs button{grid-column:1/-1}}
.h-tiers{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:18px}
.h-stories{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.h-stories a{text-decoration:none;color:inherit}
@media (max-width:900px){.h-tiers{grid-template-columns:1fr 1fr}.h-stories{grid-template-columns:1fr}}
@media (max-width:520px){.h-tiers{grid-template-columns:1fr}}
.h-trust{border-inline-start:3px solid var(--gold,#d4a373)}

/* C2: verification tier emphasis */
.p-card-verified.tier-fully_verified,.p-card-verified.tier-identity_verified{background:var(--gold,#d4a373);color:#4e0716}
.tier-badge{font-weight:700}
.tier-badge.tier-fully_verified,.tier-badge.tier-identity_verified{background:var(--gold,#d4a373);color:#4e0716}

/* C3: behaviour signals — tap to read the rule (details/summary, no JS) */
.sig{display:inline-block;margin:0 6px 6px 0;font-size:.78rem;vertical-align:top}
.sig summary{list-style:none;cursor:pointer;padding:3px 10px;border-radius:999px;background:#fdeef1;color:#7d0d24;font-weight:600}
.sig summary::-webkit-details-marker{display:none}
.sig summary::before{content:"\2713  "}
.sig[open] span{display:block;margin-top:6px;max-width:260px;padding:8px 10px;border-radius:8px;background:#fff;border:1px solid #f3d6db;color:#44524a;font-size:.76rem;line-height:1.45}
.sig-row{margin:0 0 .5rem}

/* quick search v2: readable age boxes, 3x2 grid */
.h-qs-age input{min-width:64px;text-align:center;-moz-appearance:textfield;appearance:textfield}
.h-qs-age input::-webkit-outer-spin-button,.h-qs-age input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}
.h-qs-age b{font-weight:400;color:#fff}
.h-qs button{align-self:end;height:40px}

.cur-switch a{display:inline-block;margin:0 2px;padding:2px 10px;border-radius:999px;border:1px solid #d9d2c2;text-decoration:none;color:inherit;font-weight:600}
.cur-switch a.on{background:var(--gold,#d4a373);border-color:transparent;color:#4e0716}

/* Rebrand 26 Sep 2026: shadi.pk-style red/white — buttons read white on red */
.btn-gold{background:linear-gradient(135deg,#c8203c,#8f0e27)!important;color:#fff!important;border-color:transparent!important;box-shadow:0 6px 18px rgba(179,18,46,.28)!important}
.btn-gold:hover{background:linear-gradient(135deg,#b3122e,#7d0d24)!important}
.eyebrow{color:var(--gold)}

/* 27 Sep 2026 (owner): plain hero background, professional rectangular photo, brand footer */
.hero{background:#7d0d24!important}
.hero::before{display:none!important}
.h-frame,.h-frame img{border-radius:14px!important}
.h-frame::before,.h-frame::after{display:none!important}
.h-frame img{aspect-ratio:4/5;box-shadow:0 24px 60px rgba(0,0,0,.35)!important;border:1px solid rgba(255,255,255,.14)}
.site-footer{background:#4e0716!important;color:rgba(255,255,255,.72)!important}
.site-footer a{color:rgba(255,255,255,.72)!important}
.site-footer a:hover{color:#fff!important}
.site-footer .legal{border-top-color:rgba(255,255,255,.14)!important;color:rgba(255,255,255,.55)!important}

/* Every faith strip */
.h-faiths{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-top:20px}
.h-faiths figure{margin:0;position:relative;border-radius:14px;overflow:hidden;box-shadow:var(--shadow)}
.h-faiths img{display:block;width:100%;height:auto;aspect-ratio:4/3;object-fit:cover}
.h-faiths figcaption{position:absolute;inset-inline:0;inset-block-end:0;padding:22px 14px 10px;color:#fff;font-weight:600;background:linear-gradient(transparent,rgba(78,7,22,.85))}
@media (max-width:760px){.h-faiths{grid-template-columns:1fr 1fr}}

/* 27 Sep 2026 homepage polish */
@media (max-width:760px){
  .site-nav{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;white-space:nowrap;max-width:100%}
  .site-nav::-webkit-scrollbar{display:none}
  .site-nav a{flex:0 0 auto}
}
@media (max-width:640px){.h-qs label:nth-child(2){grid-column:1/-1}}
.h-faq{border:1px solid var(--line);border-radius:12px;background:#fff;padding:0 18px;margin-top:10px}
.h-faq summary{cursor:pointer;padding:16px 0;font-weight:600;list-style:none;display:flex;justify-content:space-between;gap:12px}
.h-faq summary::-webkit-details-marker{display:none}
.h-faq summary::after{content:"+";color:var(--emerald);font-size:1.2rem;line-height:1}
.h-faq[open] summary::after{content:"–"}
.h-faq p{margin:0 0 16px;color:var(--ink-soft)}

/* 27 Sep 2026 mobile friendliness pass */
@media (max-width: 520px) {
  /* Ask-us launcher: a compact pill in the corner, not a bar covering the page */
  #rd-assistant:not(.is-open) { left: auto !important; right: 12px !important; }
  [dir="rtl"] #rd-assistant:not(.is-open) { right: auto !important; left: 12px !important; }
  #rd-assistant:not(.is-open) #rd-assistant-toggle { width: auto !important; padding: 10px 16px; }
}
@media (max-width: 560px) {
  /* Guest header: keep the sign-up button whole; How it works and Safety stay in the footer */
  .site-nav a[href$="/how-it-works"], .site-nav a[href$="/safety"] { display: none; }
  .site-nav .btn-sm { padding: 7px 12px; font-size: .82rem; }
  .site-nav { gap: 10px !important; }
}
/* Tap targets and form inputs sized for thumbs; 16px inputs stop iOS zooming in */
@media (max-width: 760px) {
  input, select, textarea { font-size: 16px !important; }
  .btn { min-height: 44px; }
  .btn-sm { min-height: 38px; }
  table { display: block; overflow-x: auto; }
  img, video { max-width: 100%; height: auto; }
}

/* 27 Sep 2026: stop any sideways page scroll without breaking sticky elements */
html, body { overflow-x: clip; }

/* Footer v2 */
.site-footer { padding-top: clamp(48px, 6vw, 80px) !important; }
.site-footer .foot-top { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(0, 2.8fr); gap: clamp(32px, 5vw, 72px); }
.site-footer .foot-brand p { margin: .8rem 0 1.1rem; max-width: 34ch; color: rgba(255,255,255,.78); }
.site-footer .foot-brand .brand { font-size: 1.6rem; }
.site-footer .foot-trust { list-style: none; padding: 0; margin: 1.3rem 0 0; display: grid; gap: 8px; font-size: .85rem; color: rgba(255,255,255,.6); }
.site-footer .foot-trust li::before { content: "\2713"; color: var(--gold-bright); margin-inline-end: 8px; }
.site-footer .foot-cols { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 28px; }
.site-footer .foot-cols a { display: block; padding: 5px 0; font-size: .93rem; transition: color .15s ease, transform .15s ease; }
.site-footer .foot-cols a:hover { transform: translateX(2px); }
[dir="rtl"] .site-footer .foot-cols a:hover { transform: translateX(-2px); }
.site-footer h4 { color: var(--gold-bright) !important; margin-bottom: 12px !important; }
.site-footer .foot-contact { display: flex; flex-wrap: wrap; gap: 10px 28px; margin-top: clamp(32px, 4vw, 48px); padding: 18px 22px; border-radius: 14px; background: rgba(255,255,255,.06); border: 1px solid rgba(255,255,255,.1); font-size: .88rem; color: rgba(255,255,255,.7); }
.site-footer .foot-contact a { color: #fff !important; }
@media (max-width: 900px) { .site-footer .foot-top { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .site-footer .foot-cols { grid-template-columns: 1fr 1fr; } }

/* CTA band: less empty height above and below */
.h-cta { padding-block: clamp(28px, 4.5vw, 52px) !important; }

/* Main-page banner photos */
.page-photo { margin: 22px 0 26px; border-radius: 16px; overflow: hidden; box-shadow: var(--shadow); }
.page-photo img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 6; object-fit: cover; }

/* Member Account menu */
.nav-menu { position: relative; }
.nav-menu summary { list-style: none; cursor: pointer; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-strong); font-weight: 600; }
.nav-menu summary::-webkit-details-marker { display: none; }
.nav-menu summary::after { content: " \25BE"; }
.nav-menu-panel { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); min-width: 210px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); padding: 6px; z-index: 60; display: grid; }
.nav-menu-panel a, .nav-menu-panel button { display: block; text-align: start; padding: 9px 12px; border-radius: 8px; background: none; border: 0; font: inherit; color: var(--ink); cursor: pointer; white-space: nowrap; }
.nav-menu-panel a:hover, .nav-menu-panel button:hover { background: var(--emerald-soft); }
.nav-menu-panel form { margin: 0; border-top: 1px solid var(--line); margin-top: 4px; padding-top: 4px; }
@media (max-width: 760px) { .nav-menu-panel { position: fixed; inset-inline: 12px; top: 64px; } }

/* App coming soon */
.h-app { background: linear-gradient(180deg, #fff, var(--emerald-soft)); }
.h-app-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.2fr); gap: clamp(28px, 5vw, 72px); align-items: center; }
.h-phone { justify-self: center; width: 240px; aspect-ratio: 9 / 18.5; border-radius: 38px; background: #1c0a10; padding: 10px; box-shadow: 0 30px 70px rgba(78, 7, 22, .35), inset 0 0 0 2px #3a1520; transform: rotate(-6deg); }
.h-phone-screen { height: 100%; border-radius: 30px; background: linear-gradient(165deg, #c8203c, #7d0d24 60%, #4e0716); padding: 26px 16px; display: flex; flex-direction: column; gap: 12px; color: #fff; }
.h-phone-brand { font-family: var(--serif); font-size: 1.35rem; font-weight: 700; text-align: center; margin-bottom: 6px; }
.h-phone-brand span { color: var(--gold-bright); }
.h-phone-card { background: rgba(255,255,255,.95); border-radius: 14px; padding: 12px; display: grid; grid-template-columns: 40px 1fr; gap: 6px 10px; align-items: center; }
.h-phone-card i { grid-row: span 3; width: 40px; height: 40px; border-radius: 50%; background: linear-gradient(135deg, #f3d6db, #d4a373); }
.h-phone-card b { height: 7px; border-radius: 4px; background: #eadde0; }
.h-phone-card b.s { width: 60%; }
.h-phone-card em { font-style: normal; font-size: .68rem; font-weight: 700; color: #7d0d24; }
.h-phone-btn { margin-top: auto; text-align: center; background: var(--gold-bright); color: #4e0716; font-weight: 700; font-size: .8rem; padding: 10px; border-radius: 999px; }
.h-app-list { list-style: none; padding: 0; margin: 16px 0; display: grid; gap: 8px; }
.h-app-list li::before { content: "\2713"; color: var(--emerald); font-weight: 700; margin-inline-end: 10px; }
.h-stores { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 18px; }
.h-store { display: inline-flex; flex-direction: column; padding: 8px 18px; border-radius: 12px; background: #1c0a10; color: #fff; font-weight: 700; font-size: 1.05rem; line-height: 1.15; opacity: .9; }
.h-store small { font-weight: 500; font-size: .66rem; opacity: .75; text-transform: uppercase; letter-spacing: .06em; }
@media (max-width: 860px) { .h-app-grid { grid-template-columns: 1fr; } .h-phone { width: 200px; } }

/* hero v3: couple stays visible, status cards compact in the corner */
.h-glass-stack{width:min(250px,58%)!important;gap:8px!important;inset-inline-start:-8px!important}
.h-glass{padding:11px 14px!important}
.h-glass p,.h-glass span{font-size:.78rem!important}
.h-glass-stack > :first-child{display:none!important}

/* FAQ toggle: drawn chevron instead of a text glyph */
.h-faq summary::after{content:""!important;width:9px;height:9px;flex:0 0 9px;margin-top:4px;border-right:2px solid var(--emerald);border-bottom:2px solid var(--emerald);transform:rotate(45deg);transition:transform .2s ease}
.h-faq[open] summary::after{content:""!important;transform:rotate(-135deg);margin-top:8px}

/* hero v4: cut-out couple on the hero colour, no photo frame */
.h-frame{background:radial-gradient(closest-side at 50% 45%,rgba(212,163,115,.35),rgba(212,163,115,.12) 55%,transparent 72%)!important;border-radius:0!important}
.h-frame img{border:0!important;border-radius:0!important;box-shadow:none!important;filter:drop-shadow(0 18px 30px rgba(40,4,12,.45))}

/* hero v5: bigger couple */
.h-frame{max-width:600px!important}
.h-frame img{transform:scale(1.12);transform-origin:50% 100%}
@media (max-width:860px){.h-frame img{transform:none}}

/* Parent-company link: a slim strip under the footer columns */
.site-footer .foot-cols a.foot-parent{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;margin-top:14px;padding:12px 16px;border-radius:12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);text-decoration:none;font-size:.86rem;color:rgba(255,255,255,.7)!important}
.site-footer .foot-cols a.foot-parent:hover{transform:none;background:rgba(255,255,255,.09)}
.site-footer .foot-parent small{font-size:.66rem;letter-spacing:.12em;text-transform:uppercase;color:var(--gold-bright)}
.site-footer .foot-parent strong{color:#fff;font-weight:700}
.site-footer .foot-parent em{margin-inline-start:auto;font-style:normal;font-weight:600;color:#fff}
[lang="ur"] .site-footer .foot-parent small{letter-spacing:0;text-transform:none}

/* ===== 27 Sep 2026: light blush hero + footer (owner's choice), matching the guides/steps sections ===== */
.hero { background: linear-gradient(180deg, #fdf1f3 0%, #fbe7eb 100%) !important; color: var(--ink) !important; border-bottom: 1px solid var(--line); }
.hero h1 { color: var(--ink) !important; }
.hero .lede, .hero p { color: var(--ink-soft); }
.hero .eyebrow { color: var(--gold) !important; }
.hero .muted, .hero .small.muted { color: var(--ink-muted) !important; }
.hero .btn-on-dark { background: #fff !important; color: var(--emerald-dark) !important; border: 1px solid var(--line-strong) !important; }
.hero .btn-on-dark:hover { border-color: var(--emerald) !important; }
.h-qs { background: #fff !important; border: 1px solid var(--line) !important; box-shadow: var(--shadow); }
.h-qs label { color: var(--ink-soft) !important; }
.h-qs select, .h-qs input { border: 1px solid var(--line-strong) !important; background: #fff !important; color: var(--ink) !important; }
.h-qs-age b { color: var(--ink-muted) !important; }
.h-glass { background: rgba(255, 255, 255, .9) !important; border: 1px solid var(--line) !important; color: var(--ink) !important; box-shadow: var(--shadow-lg) !important; }
.h-glass * { color: inherit; }
.h-glass p, .h-glass span, .h-glass small { color: var(--ink-soft) !important; }
.h-glass strong, .h-glass b, .h-glass h3, .h-glass h4 { color: var(--ink) !important; }
.h-frame { background: radial-gradient(closest-side at 50% 45%, rgba(212, 163, 115, .30), rgba(200, 32, 60, .08) 55%, transparent 72%) !important; }
.h-frame img { filter: drop-shadow(0 18px 28px rgba(125, 13, 36, .18)) !important; }
/* the three feature pills under the hero */
.hero .h-feats, .hero [class*="feat"] { background: #fff !important; border-color: var(--line) !important; }
.hero [class*="feat"] strong, .hero [class*="feat"] h3 { color: var(--ink) !important; }
.hero [class*="feat"] p, .hero [class*="feat"] span { color: var(--ink-soft) !important; }

.site-footer { background: #fdf1f3 !important; color: var(--ink-soft) !important; border-top: 1px solid var(--line); }
.site-footer .brand { color: var(--ink) !important; }
.site-footer .foot-brand p { color: var(--ink-soft) !important; }
.site-footer .foot-trust { color: var(--ink-muted) !important; }
.site-footer h4 { color: var(--gold) !important; }
.site-footer a, .site-footer .foot-cols a { color: var(--ink-soft) !important; }
.site-footer a:hover, .site-footer .foot-cols a:hover { color: var(--emerald) !important; }
.site-footer .foot-contact { background: #fff !important; border-color: var(--line) !important; color: var(--ink-muted) !important; }
.site-footer .foot-contact a { color: var(--emerald-dark) !important; }
.site-footer .foot-cols a.foot-parent { background: #fff !important; border-color: var(--line) !important; color: var(--ink-muted) !important; }
.site-footer .foot-cols a.foot-parent strong, .site-footer .foot-cols a.foot-parent em { color: var(--emerald-dark) !important; }
.site-footer .foot-cols a.foot-parent small { color: var(--gold) !important; }
.site-footer .legal { border-top-color: var(--line) !important; color: var(--ink-muted) !important; }
.site-footer .btn-gold { color: #fff !important; }

.hero .trust-row{background:#fff!important;border:1px solid var(--line)!important;box-shadow:var(--shadow)}
.hero .trust-row > div{color:var(--ink-soft)!important;border-color:var(--line)!important}
.hero .trust-row strong{color:var(--ink)!important}
.hero .trust-row svg{color:var(--emerald)!important}

/* CTA band in the same light blush as the other sections (owner, 27 Sep) */
.cta-band.h-cta{background:linear-gradient(135deg,#fdf1f3,#fbe3e8)!important;border:1px solid var(--line);box-shadow:var(--shadow)!important}
.h-cta-bg img{opacity:.14;filter:saturate(.7)}
.h-cta-bg::after{background:linear-gradient(135deg,rgba(253,241,243,.55),rgba(251,227,232,.4))!important}
.cta-band.h-cta h2{color:var(--ink)!important}
.cta-band.h-cta p{color:var(--ink-soft)!important}
.cta-band.h-cta .eyebrow,.cta-band.h-cta .h-orn{color:var(--gold)!important}
.cta-band.h-cta .btn-on-dark{background:#fff!important;color:var(--emerald-dark)!important;border:1px solid var(--line-strong)!important}

/* Brand consistency: success stays green; admin sidebar in brand maroon; Account menu arrow spacing */
.badge-ok{background:#e7f5ee!important;color:#1f7a4d!important;border-color:rgba(31,122,77,.2)!important}
.admin-side{background:#4e0716!important;color:#f3dfe3!important}
.admin-side nav a{color:#f3dfe3!important}
.admin-side nav a:hover,.admin-side nav a.active{background:rgba(255,255,255,.12)!important;color:#fff!important}
.admin-side .muted,.admin-side small{color:rgba(243,223,227,.7)!important}
.nav-menu summary{display:inline-flex;align-items:center;gap:6px}
.nav-menu summary::after{content:""!important;width:6px;height:6px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(45deg) translateY(-2px)}

/* E3/E4: featured (boosted) and premium profile cards — always labelled */
.p-card { position: relative; }
.p-card-media { position: relative; }
.p-card-ribbons { position: absolute; inset-block-start: 10px; inset-inline-start: 10px; display: flex; flex-wrap: wrap; gap: 6px; z-index: 2; }
.p-ribbon { display: inline-block; padding: 3px 10px; border-radius: 999px; font-size: .72rem; font-weight: 700; letter-spacing: .02em; box-shadow: 0 4px 10px rgba(0,0,0,.18); }
.p-ribbon--premium { background: linear-gradient(135deg, #d4a373, #b07a4f); color: #fff; }
.p-ribbon--featured { background: #fff; color: var(--emerald-dark); border: 1px solid var(--line-strong); }
.p-card--premium { border: 1.5px solid #d4a373 !important; box-shadow: 0 10px 28px rgba(176, 122, 79, .22) !important; }
.p-card--boosted:not(.p-card--premium) { border: 1.5px solid rgba(179, 18, 46, .35) !important; }

/* F1 biodata — screen preview + A4 print */
.bio-form { display: grid; gap: 12px; margin-top: 16px; }
.bio-form label { display: grid; gap: 6px; font-weight: 600; font-size: .9rem; }
.biodata { background: #fff; border: 1px solid var(--line); border-top: 6px solid var(--emerald); border-radius: 16px; padding: 36px 40px; box-shadow: var(--shadow); }
.bio-head { display: flex; justify-content: space-between; gap: 24px; align-items: flex-start; border-bottom: 1px solid var(--line); padding-bottom: 20px; margin-bottom: 8px; }
.bio-brand { font-family: var(--serif); font-weight: 700; font-size: 1.1rem; color: var(--emerald-dark); }
.bio-brand span { color: var(--gold); }
.bio-kicker { margin: 10px 0 2px; font-size: .75rem; letter-spacing: .14em; text-transform: uppercase; color: var(--gold); }
.bio-name { margin: 0; font-size: 2rem; }
.bio-sub { margin: 4px 0 0; color: var(--ink-soft); }
.bio-photo { width: 150px; height: 190px; object-fit: cover; border-radius: 12px; border: 3px solid #fff; box-shadow: 0 0 0 1px var(--line-strong); }
.bio-h { margin: 22px 0 10px; font-size: 1.05rem; color: var(--emerald-dark); border-inline-start: 3px solid var(--gold-bright); padding-inline-start: 10px; }
.bio-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 28px; margin: 0; }
.bio-grid div { display: flex; justify-content: space-between; gap: 12px; border-bottom: 1px dashed var(--line); padding: 6px 0; }
.bio-grid dt { color: var(--ink-muted); font-size: .9rem; }
.bio-grid dd { margin: 0; font-weight: 600; text-align: end; }
.bio-text { white-space: pre-line; color: var(--ink-soft); margin: 0; }
.bio-foot { margin-top: 26px; padding-top: 14px; border-top: 1px solid var(--line); font-size: .82rem; color: var(--ink-muted); }
.bio-foot p { margin: 4px 0; }
[lang="ur"] .bio-kicker { letter-spacing: 0; text-transform: none; }
@media (max-width: 640px) { .biodata { padding: 22px; } .bio-grid { grid-template-columns: 1fr; } .bio-head { flex-direction: column-reverse; } }
@media print {
  @page { size: A4; margin: 12mm; }
  body { background: #fff !important; }
  .site-header, .site-footer, .bio-controls, #rd-assistant, .skip-link, nav[aria-label="Breadcrumb"] { display: none !important; }
  .section-tight { padding: 0 !important; }
  .biodata { box-shadow: none; border-radius: 0; padding: 0 0 0 0; border-left: 0; border-right: 0; border-bottom: 0; }
  .biodata * { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

.bio-form label.check{display:flex;align-items:center;gap:10px;font-weight:600}

/* F2 who viewed me — locked preview for free members */
.viewers-blur { display: flex; gap: 10px; margin-bottom: 16px; }
.viewers-blur span { width: 64px; height: 64px; border-radius: 50%; background: linear-gradient(135deg, #f3d6db, #d4a373); filter: blur(3px); opacity: .85; }

/* F3 travel mode label on cards */
.p-travel { position: absolute; inset-inline: 10px; inset-block-end: 10px; z-index: 2; padding: 4px 10px; border-radius: 999px; background: rgba(255,255,255,.92); color: var(--emerald-dark); font-size: .72rem; font-weight: 700; text-align: center; box-shadow: 0 4px 10px rgba(0,0,0,.15); }

/* Wave 2/3 languages: script fonts (self-hosted) */
[lang="ar"] body, [lang="sd"] body, [lang="ps"] body { font-family: 'Noto Naskh Arabic', var(--sans); line-height: 1.8; }
[lang="ar"] h1, [lang="ar"] h2, [lang="ar"] h3, [lang="sd"] h1, [lang="sd"] h2, [lang="sd"] h3, [lang="ps"] h1, [lang="ps"] h2, [lang="ps"] h3 { font-family: 'Noto Naskh Arabic', var(--serif); letter-spacing: 0; }
[lang="pa"] body { font-family: 'Noto Nastaliq Urdu', var(--sans); line-height: 2; }
[lang="pa"] h1, [lang="pa"] h2, [lang="pa"] h3 { font-family: 'Noto Nastaliq Urdu', var(--serif); letter-spacing: 0; }
[lang="bn"] body { font-family: 'Noto Sans Bengali', var(--sans); }
[dir="rtl"] .eyebrow, [dir="rtl"] .site-footer h4 { letter-spacing: 0; text-transform: none; }

/* Header: language + currency pickers (like the big brands: 🌐 English ▾  PKR ▾) */
.pick { position: relative; }
.pick summary { list-style: none; cursor: pointer; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-strong); font-weight: 600; font-size: .88rem; white-space: nowrap; }
.pick summary::-webkit-details-marker { display: none; }
.pick summary::after { content: ""; width: 6px; height: 6px; border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg) translateY(-2px); }
.pick-panel { position: absolute; inset-inline-end: 0; top: calc(100% + 8px); min-width: 210px; max-height: 70vh; overflow: auto; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-lg); padding: 6px; z-index: 70; display: grid; }
.pick-panel a { display: flex; justify-content: space-between; gap: 12px; padding: 9px 12px; border-radius: 8px; color: var(--ink); white-space: nowrap; text-decoration: none; }
.pick-panel a:hover { background: var(--emerald-soft); }
.pick-panel a.on { background: var(--emerald-soft); color: var(--emerald-dark); font-weight: 700; }
.pick-panel small { color: var(--ink-muted); }
@media (max-width: 760px) { .pick-panel { position: fixed; inset-inline: 12px; top: 64px; } }

.pick summary::after,.nav-menu summary::after{position:static!important;inset:auto!important;margin:0 0 0 2px!important}

/* D1/D2 social sign-in */
.social-login { display: grid; gap: 10px; margin-bottom: 14px; }
.social-btn { display: flex !important; align-items: center; justify-content: center; gap: 10px; background: #fff !important; color: var(--ink) !important; border: 1px solid var(--line-strong) !important; font-weight: 600; }
.social-btn:hover { border-color: var(--emerald) !important; }
.social-or { text-align: center; color: var(--ink-muted); font-size: .85rem; margin: 6px 0 0; }

/* Incoming call banner */
.rd-incoming { position: fixed; z-index: 100; inset-inline: 12px; top: 12px; margin-inline: auto; max-width: 560px; display: flex; align-items: center; gap: 12px; padding: 14px 16px; border-radius: 16px; background: #fff; border: 2px solid var(--emerald); box-shadow: 0 20px 50px rgba(125,13,36,.3); animation: rdRing 1.2s ease-in-out infinite; }
.rd-incoming[hidden] { display: none; }
.rd-incoming > div { flex: 1; }
.rd-incoming-icon { font-size: 1.6rem; }
@keyframes rdRing { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-3px); } }

/* Call room v2 (27 Sep 2026) — full-bleed stage, picture-in-picture self view, round controls */
.call-wrap { max-width: 980px; margin: 0 auto; padding: 18px 12px 28px; }
.call-stage { position: relative; height: min(78vh, 720px); border-radius: 22px; overflow: hidden; background: radial-gradient(circle at 50% 35%, #7d0d24, #2a050d 70%); box-shadow: var(--shadow-lg); }
.call-stage #remote { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity .4s ease; background: #000; }
.call-stage.is-live #remote { opacity: 1; }
.call-stage[data-kind="voice"].is-live #remote { opacity: 0; }
.call-avatar { position: absolute; left: 50%; top: 42%; transform: translate(-50%, -50%); width: 128px; height: 128px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, #d4a373, #b07a4f); color: #fff; font-family: var(--serif); font-size: 3.2rem; font-weight: 700; }
.call-avatar .pulse { position: absolute; inset: -10px; border-radius: 50%; border: 2px solid rgba(212,163,115,.7); animation: callPulse 1.6s ease-out infinite; }
.call-stage.is-live:not([data-kind="voice"]) .call-avatar { display: none; }
.call-stage.is-live .call-avatar .pulse, .call-stage.is-ended .call-avatar .pulse { display: none; }
@keyframes callPulse { from { transform: scale(.9); opacity: 1; } to { transform: scale(1.35); opacity: 0; } }
.call-top { position: absolute; inset-inline: 0; top: 0; display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 20px; color: #fff; background: linear-gradient(rgba(0,0,0,.45), transparent); }
.call-top strong { display: block; font-size: 1.15rem; }
.call-state { font-size: .9rem; opacity: .85; }
.call-timer { font-variant-numeric: tabular-nums; background: rgba(0,0,0,.35); padding: 4px 10px; border-radius: 999px; font-weight: 600; }
.call-self { position: absolute; inset-inline-end: 16px; bottom: 110px; width: min(28%, 180px); aspect-ratio: 3 / 4; object-fit: cover; border-radius: 14px; border: 2px solid rgba(255,255,255,.8); box-shadow: 0 10px 30px rgba(0,0,0,.4); background: #111; transform: scaleX(-1); }
.call-controls { position: absolute; inset-inline: 0; bottom: 0; display: flex; justify-content: center; gap: 22px; padding: 18px 12px 22px; background: linear-gradient(transparent, rgba(0,0,0,.55)); }
.call-btn { width: 64px; height: 64px; border-radius: 50%; border: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: rgba(255,255,255,.18); color: #fff; cursor: pointer; backdrop-filter: blur(6px); }
.call-btn svg { width: 24px; height: 24px; fill: currentColor; }
.call-btn small { font-size: .62rem; opacity: .9; }
.call-btn:hover { background: rgba(255,255,255,.28); }
.call-btn.is-off { background: #fff; color: var(--emerald-dark); }
.call-btn.call-end { background: #e0263c; }
.call-btn.call-end svg { transform: rotate(135deg); }
.call-btn.call-end:hover { background: #c01a2f; }
.call-note { text-align: center; color: var(--ink-muted); font-size: .85rem; margin-top: 12px; }
@media (max-width: 640px) { .call-wrap { padding: 8px 8px 18px; } .call-stage { height: calc(100vh - 150px); border-radius: 16px; } .call-self { width: 32%; bottom: 104px; } }

/* ================= Messages v2 (27 Sep 2026): inbox + chat, app-grade ================= */
.chat-page { padding: clamp(14px, 3vw, 34px) 12px clamp(24px, 4vw, 48px); }
.chat-avatar { position: relative; flex: none; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: #fff; font-family: var(--serif); font-weight: 700; font-size: 1.15rem; }
.chat-avatar img { width: 100%; height: 100%; border-radius: 50%; object-fit: cover; }
.chat-avatar-lg { width: 54px; height: 54px; font-size: 1.35rem; }
.presence-dot { position: absolute; right: 0; bottom: 1px; width: 12px; height: 12px; border-radius: 50%; background: #b9bec7; border: 2px solid #fff; }
.presence-dot.is-on { background: #22c55e; box-shadow: 0 0 0 0 rgba(34,197,94,.5); animation: rdOnline 2.4s infinite; }
@keyframes rdOnline { 0% { box-shadow: 0 0 0 0 rgba(34,197,94,.45); } 70% { box-shadow: 0 0 0 7px rgba(34,197,94,0); } 100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); } }
.msg-tick { color: #9aa1ad; letter-spacing: -3px; font-size: .78em; margin-inline-start: 2px; }
.msg-tick.is-read { color: #2f8fe6; }

/* ---------- chat shell ---------- */
.chat-shell { max-width: 900px; margin: 0 auto; display: flex; flex-direction: column; height: min(84vh, 820px); background: #fff; border: 1px solid var(--line); border-radius: 24px; box-shadow: var(--shadow-lg); overflow: hidden; }
.chat-head { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--line); background: linear-gradient(180deg, #fff, var(--paper-warm)); }
.chat-person { display: flex; align-items: center; gap: 12px; flex: 1; min-width: 0; color: inherit; }
.chat-person:hover { text-decoration: none; }
.chat-who { min-width: 0; display: flex; flex-direction: column; }
.chat-who strong { font-family: var(--serif); font-size: 1.12rem; color: var(--ink); display: flex; align-items: center; gap: 8px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-status { font-size: .82rem; color: var(--ink-muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.chat-status .is-on { color: #16a34a; font-weight: 600; }
.chat-actions { display: flex; align-items: center; gap: 6px; }
.chat-icon { width: 42px; height: 42px; border-radius: 50%; border: 0; display: grid; place-items: center; background: transparent; color: var(--emerald-dark); cursor: pointer; list-style: none; transition: background .15s ease; }
.chat-icon::-webkit-details-marker { display: none; }
.chat-icon:hover { background: var(--emerald-soft); text-decoration: none; }
.chat-icon svg { width: 22px; height: 22px; fill: currentColor; }
.chat-actions [data-call] { background: var(--emerald-soft); }
.chat-actions [data-call]:hover { background: var(--emerald); color: #fff; }
.chat-back { display: none; }
.chat-more { position: relative; }
.chat-menu { position: absolute; inset-inline-end: 0; top: 48px; z-index: 20; min-width: 210px; padding: 6px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-lg); }
.chat-menu a, .chat-menu button { display: block; width: 100%; text-align: start; padding: 10px 12px; border: 0; background: none; border-radius: 10px; color: var(--ink); font: inherit; font-size: .92rem; cursor: pointer; }
.chat-menu a:hover, .chat-menu button:hover { background: var(--emerald-soft); text-decoration: none; }
.chat-menu form { margin: 0; }
.chat-menu button { color: var(--emerald); }
.chat-banner { padding: 10px 16px; font-size: .86rem; background: var(--gold-soft); border-bottom: 1px solid var(--line); color: var(--ink-soft); }
.chat-banner-warn { background: #fff7e6; }
.chat-banner-bad { background: #fdecec; color: #9b1c1c; }

/* ---------- thread ---------- */
.chat-thread { flex: 1; overflow-y: auto; padding: 18px clamp(12px, 3vw, 28px) 8px; background-color: #fbf6f4;
    background-image: radial-gradient(rgba(176,122,79,.09) 1px, transparent 1px); background-size: 18px 18px; scroll-behavior: smooth; }
.chat-safe { max-width: 520px; margin: 0 auto 14px; text-align: center; font-size: .8rem; color: #7a5a2e; background: #fff8e8; border: 1px solid #f3e2bd; border-radius: 12px; padding: 8px 12px; }
.chat-day { display: flex; justify-content: center; margin: 14px 0 10px; position: sticky; top: 0; z-index: 2; }
.chat-day span { font-size: .74rem; font-weight: 600; color: var(--ink-soft); background: rgba(255,255,255,.95); border: 1px solid var(--line); padding: 4px 12px; border-radius: 999px; box-shadow: var(--shadow-sm); }
.chat-event { display: flex; justify-content: center; margin: 6px 0; }
.chat-event span { display: inline-flex; align-items: center; gap: 7px; font-size: .78rem; color: var(--ink-muted); background: rgba(255,255,255,.85); border: 1px solid var(--line); padding: 5px 12px; border-radius: 999px; }
.chat-event svg { width: 14px; height: 14px; fill: var(--gold); }
.chat-event time { opacity: .7; }
.msg { display: flex; align-items: flex-start; gap: 4px; margin: 3px 0 8px; }
.msg-mine { justify-content: flex-end; }
.msg-bubble { position: relative; max-width: min(74%, 560px); padding: 8px 12px 6px; border-radius: 18px; box-shadow: 0 1px 1.5px rgba(20,22,28,.08); animation: msgIn .18s ease-out; }
@keyframes msgIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }
.msg-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.45; color: inherit; }
.msg-theirs .msg-bubble { background: #fff; color: var(--ink); border-top-left-radius: 6px; }
.msg-mine .msg-bubble { background: linear-gradient(135deg, var(--emerald-mid), var(--emerald-dark)); color: #fff; border-top-right-radius: 6px; }
.msg-meta { display: flex; justify-content: flex-end; align-items: center; gap: 3px; font-size: .68rem; opacity: .75; margin-top: 2px; }
.msg-mine .msg-tick { color: rgba(255,255,255,.7); }
.msg-mine .msg-tick.is-read { color: #9fd4ff; }
.msg-role { display: block; font-size: .72rem; font-weight: 700; color: var(--gold); margin-bottom: 2px; }
.msg-report { position: relative; align-self: center; }
.msg-report summary { list-style: none; cursor: pointer; width: 26px; height: 26px; border-radius: 50%; display: grid; place-items: center; color: var(--ink-muted); opacity: 0; transition: opacity .15s; }
.msg-report summary::-webkit-details-marker { display: none; }
.msg:hover .msg-report summary, .msg-report[open] summary { opacity: 1; background: rgba(255,255,255,.9); }
.msg-report-form { position: absolute; z-index: 15; top: 30px; inset-inline-start: 0; width: 260px; display: grid; gap: 8px; padding: 12px; background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow-lg); }
.msg-report-form strong { font-size: .88rem; }
@media (hover: none) { .msg-report summary { opacity: .6; } }

/* ---------- composer ---------- */
.chat-typing { margin: 0; min-height: 1.4em; padding: 2px 20px; font-size: .8rem; color: var(--emerald); font-style: italic; background: #fbf6f4; }
.chat-composer { display: flex; align-items: flex-end; gap: 10px; padding: 10px 12px 6px; border-top: 1px solid var(--line); background: #fff; }
.chat-composer textarea { flex: 1; resize: none; min-height: 46px; max-height: 160px; padding: 12px 16px; border-radius: 24px; border: 1px solid var(--line-strong); background: var(--paper); font: inherit; line-height: 1.4; box-shadow: none; }
.chat-composer textarea:focus { outline: none; border-color: var(--emerald); background: #fff; box-shadow: 0 0 0 3px rgba(179,18,46,.12); }
.chat-send { flex: none; width: 48px; height: 48px; border-radius: 50%; border: 0; display: grid; place-items: center; cursor: pointer; background: linear-gradient(135deg, var(--emerald-mid), var(--emerald-dark)); color: #fff; box-shadow: 0 6px 16px rgba(179,18,46,.3); transition: transform .12s ease; }
.chat-send:hover { transform: scale(1.06); }
.chat-send svg { width: 22px; height: 22px; fill: currentColor; margin-inline-start: 3px; }
[dir="rtl"] .chat-send svg, [dir="rtl"] .chat-back svg { transform: scaleX(-1); }
.chat-hint { margin: 0; padding: 0 20px 10px; font-size: .74rem; color: var(--ink-muted); background: #fff; }

/* ---------- inbox ---------- */
.inbox { max-width: 900px; margin: 0 auto; }
.inbox-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; margin-bottom: 16px; }
.inbox-head h1 { margin: 0; font-size: var(--t-h2); }
.inbox-sub { margin: 4px 0 0; color: var(--ink-muted); font-size: .92rem; }
.inbox-new { color: var(--emerald); }
.inbox-search { display: flex; align-items: center; gap: 10px; padding: 0 16px; margin-bottom: 14px; background: #fff; border: 1px solid var(--line-strong); border-radius: 999px; }
.inbox-search svg { width: 20px; height: 20px; fill: var(--ink-muted); flex: none; }
.inbox-search input { border: 0; background: transparent; padding: 12px 0; box-shadow: none; }
.inbox-search input:focus { outline: none; box-shadow: none; }
.inbox-list { background: #fff; border: 1px solid var(--line); border-radius: 22px; box-shadow: var(--shadow); overflow: hidden; }
.inbox-row { display: flex; align-items: center; gap: 14px; padding: 14px 18px; color: inherit; border-bottom: 1px solid var(--line); transition: background .15s ease; }
.inbox-row:last-of-type { border-bottom: 0; }
.inbox-row:hover { background: var(--paper-warm); text-decoration: none; }
.inbox-row.is-unread { background: linear-gradient(90deg, var(--emerald-soft), #fff 55%); }
.inbox-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 3px; }
.inbox-top { display: flex; align-items: center; gap: 8px; min-width: 0; }
.inbox-top strong { font-family: var(--serif); font-size: 1.06rem; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.inbox-top time { margin-inline-start: auto; flex: none; font-size: .78rem; color: var(--ink-muted); }
.inbox-row.is-unread .inbox-top time { color: var(--emerald); font-weight: 700; }
.inbox-preview { display: flex; align-items: center; gap: 10px; }
.inbox-text { flex: 1; min-width: 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; font-size: .9rem; color: var(--ink-muted); }
.inbox-row.is-unread .inbox-text { color: var(--ink); font-weight: 600; }
.inbox-count { flex: none; min-width: 22px; height: 22px; padding: 0 7px; border-radius: 999px; display: grid; place-items: center; font-size: .74rem; font-weight: 700; color: #fff; background: var(--emerald); }
.inbox-empty { text-align: center; padding: clamp(32px, 6vw, 56px) 20px; }
.inbox-empty-icon { font-size: 2.6rem; display: block; margin-bottom: 8px; }
.inbox-empty p { max-width: 46ch; margin: 0 auto 18px; }
.inbox-none { text-align: center; padding: 22px; color: var(--ink-muted); margin: 0; }
.inbox-foot { margin: 18px 4px 0; font-size: .84rem; color: var(--ink-muted); line-height: 1.6; }

@media (max-width: 640px) {
    .chat-page { padding: 0; }
    .chat-shell { height: calc(100dvh - 64px); border-radius: 0; border-inline: 0; box-shadow: none; }
    .chat-back { display: grid; }
    .chat-meta { display: none; }
    .chat-head { padding: 8px 8px; gap: 6px; }
    .chat-icon { width: 40px; height: 40px; }
    .msg-bubble { max-width: 84%; }
    .chat-hint { display: none; }
    .chat-composer { padding-bottom: max(10px, env(safe-area-inset-bottom)); }
    .inbox { padding: 4px 0; }
    .inbox-list { border-radius: 16px; }
    .inbox-row { padding: 12px 14px; }
}

/* Homepage imagery v3 (27 Sep 2026): modern couples, real app photo */
.h-faiths img { aspect-ratio: 4 / 5; transition: transform .5s ease; }
.h-faiths figure:hover img { transform: scale(1.04); }
.h-faiths figcaption { font-family: var(--serif); font-size: 1.1rem; letter-spacing: .01em; padding: 40px 16px 14px; }
.h-app-photo { position: relative; margin: 0; justify-self: center; width: min(100%, 480px); }
.h-app-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 28px; box-shadow: 0 30px 70px rgba(78, 7, 22, .25); }
.h-float { position: absolute; display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: rgba(255,255,255,.96); border-radius: 16px; box-shadow: 0 14px 34px rgba(78,7,22,.2); animation: hFloat 5s ease-in-out infinite; }
.h-float i { width: 34px; height: 34px; border-radius: 50%; display: grid; place-items: center; font-style: normal; background: var(--emerald-soft); color: var(--emerald); font-size: 1rem; }
.h-float b { display: block; font-size: .86rem; color: var(--ink); }
.h-float small { display: block; font-size: .72rem; color: var(--ink-muted); }
.h-float-1 { left: -22px; top: 16%; }
.h-float-2 { right: -18px; bottom: 14%; animation-delay: -2.5s; }
.h-float-2 i { background: var(--emerald); color: #fff; }
.h-float-3 { right: 18px; top: -16px; padding: 7px 12px; animation-delay: -1.2s; }
.h-float-3 i { width: 24px; height: 24px; background: #22c55e; color: #fff; font-size: .8rem; }
@keyframes hFloat { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-7px); } }
@media (max-width: 860px) { .h-app-grid { grid-template-columns: 1fr; } .h-float-1 { left: 8px; } .h-float-2 { right: 8px; } }
@media (max-width: 760px) { .h-faiths img { aspect-ratio: 4 / 5; } }
@media (prefers-reduced-motion: reduce) { .h-float { animation: none; } }

/* Privacy block: the checklist sits under the photo instead of covering the couple */
.h-media-card { padding-block-end: 0; }
.h-media-card .h-photo img { aspect-ratio: 4 / 3.3; }
.h-media-card .h-checklist { position: relative; inset: auto; width: auto; margin: -56px 20px 0 56px; }
@media (max-width: 860px) { .h-media-card .h-checklist { margin: -32px 12px 0; } }

/* Unread badges on the main menu */
.nav-count { display: inline-grid; place-items: center; min-width: 18px; height: 18px; padding: 0 5px; margin-inline-start: 5px; border-radius: 999px; background: var(--emerald); color: #fff; font-size: .68rem; font-weight: 700; line-height: 1; vertical-align: 2px; animation: navPop .3s ease-out; }
.nav-count[hidden] { display: none; }
@keyframes navPop { from { transform: scale(.4); } to { transform: scale(1); } }

/* H3 Elite Picks */
.elite-picks { margin: 0 0 26px; padding: clamp(16px, 3vw, 24px); border-radius: 22px; background: linear-gradient(135deg, #fff8ef, #fdeef1); border: 1px solid #f0dcc4; }
.elite-picks-head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 16px; }
.elite-picks-head h2 { margin: 0; font-size: 1.3rem; }
.elite-picks-head p { margin: .25rem 0 0; color: var(--ink-muted); font-size: .92rem; }
.elite-picks-icon { flex: none; width: 42px; height: 42px; border-radius: 50%; display: grid; place-items: center; background: linear-gradient(135deg, var(--gold-bright), var(--gold)); color: #fff; font-size: 1.2rem; }
.elite-picks-empty { margin: 0; color: var(--ink-muted); }
.elite-teaser { display: flex; align-items: center; gap: 14px; margin: 0 0 20px; padding: 14px 18px; border-radius: 18px; background: linear-gradient(135deg, #fff8ef, #fdeef1); border: 1px solid #f0dcc4; color: inherit; }
.elite-teaser:hover { text-decoration: none; box-shadow: var(--shadow-sm); }
.elite-teaser > span:nth-child(2) { flex: 1; display: flex; flex-direction: column; font-size: .9rem; color: var(--ink-muted); }
.elite-teaser strong { color: var(--ink); font-size: 1rem; }
@media (max-width: 560px) { .elite-teaser { flex-wrap: wrap; } }

/* B5 illustrative journeys (until real stories exist) */
.ill-stories { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; margin-top: 20px; }
.ill-story { background: #fff; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.ill-story img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; object-fit: cover; }
.ill-story-body { padding: 16px 18px 20px; }
.ill-tag { display: inline-block; font-size: .7rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--gold); background: var(--gold-soft); padding: 3px 9px; border-radius: 999px; }
.ill-story h3 { margin: 10px 0 2px; font-size: 1.15rem; }
.ill-place { margin: 0 0 8px; font-size: .84rem; color: var(--ink-muted); }
.ill-story-body p:last-child { margin: 0; font-size: .92rem; line-height: 1.6; }
.ill-note { margin: 16px 0 0; font-size: .84rem; color: var(--ink-muted); line-height: 1.6; }
@media (max-width: 860px) { .ill-stories { grid-template-columns: 1fr; } }

/* H1: inside the Android app the native tab bar replaces the site navigation */
body.in-app .site-footer, body.in-app .h-app, body.in-app .assist-launcher, body.in-app #rd-incoming { display: none !important; }
body.in-app .site-header { position: static; box-shadow: none; }
body.in-app .site-nav > a, body.in-app .site-nav > details.pick, body.in-app .site-nav .nav-menu { display: none !important; }
body.in-app .chat-shell { height: calc(100dvh - 70px); }

/* H1 enterprise pass: the native app bar + drawer replace the site header entirely */
body.in-app .site-header { display: none !important; }
body.in-app main, body.in-app .chat-page { padding-top: 0; }
body.in-app .chat-shell { height: calc(100dvh - 8px); border-radius: 0; border-inline: 0; box-shadow: none; }
body.in-app { -webkit-tap-highlight-color: transparent; overscroll-behavior-y: contain; }


/* ==========================================================================
   Pricing page redesign (27 Sep 2026) — light-blush brand, launch banner,
   plan cards, comparison table. Classes prefixed .pp- ; used only by
   resources/views/billing/pricing.blade.php.
   ========================================================================== */
.pp-hero {
    background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%);
    border-bottom: 1px solid var(--line);
    padding: 44px 0 40px;
    text-align: center;
}
.pp-hero .eyebrow { color: var(--gold); }
.pp-hero h1 { color: var(--emerald-dark); margin: .2rem auto .4rem; max-width: 20ch; }
.pp-hero-lede { font-size: var(--t-lede, 1.15rem); color: var(--ink); max-width: 46ch; margin: 0 auto 22px; font-weight: 500; }
.pp-progress { max-width: 560px; margin: 0 auto 22px; background: #fff; border: 1px solid var(--line-strong); border-radius: 16px; padding: 16px 18px; text-align: left; box-shadow: var(--shadow-sm); }
.pp-progress-top { display: flex; justify-content: space-between; gap: 12px; font-size: .92rem; margin-bottom: 10px; }
.pp-progress-top span { font-weight: 700; color: var(--emerald); }
.pp-bar { height: 12px; border-radius: 999px; background: var(--emerald-soft); overflow: hidden; }
.pp-bar-fill { display: block; height: 100%; border-radius: 999px; background: linear-gradient(90deg, var(--gold-bright), var(--emerald)); }
.pp-progress-note { font-size: .78rem; color: var(--ink-muted); margin: 8px 0 0; }
.pp-hero-cta { display: flex; flex-direction: column; align-items: center; gap: 8px; margin-bottom: 20px; }
.pp-hero-cta .btn-lg { padding: .95rem 2.2rem; font-size: 1.05rem; }
.pp-hero-sub { font-size: .85rem; color: var(--ink-muted); margin: 6px 0 0; }
.pp-have { display: inline-flex; align-items: center; gap: 8px; padding: .7rem 1.3rem; border-radius: 999px; background: #fff; border: 1px solid var(--emerald); color: var(--emerald-dark); font-weight: 700; }
.pp-have svg { width: 18px; height: 18px; }
.pp-founder { list-style: none; padding: 0; margin: 0 auto; max-width: 560px; display: grid; gap: 8px; text-align: left; }
.pp-founder li, .pp-feats li, .pp-steps li { display: flex; gap: 9px; align-items: flex-start; font-size: .92rem; line-height: 1.45; }
.pp-founder svg, .pp-feats svg, .pp-steps svg { width: 16px; height: 16px; flex: none; margin-top: 3px; color: var(--emerald); }

.pp-plans { padding-top: 40px; }
.pp-switch-row { display: flex; flex-direction: column; align-items: center; gap: 10px; margin-bottom: 34px; text-align: center; }
.pp-switch-row .period-switch { max-width: 100%; flex-wrap: wrap; justify-content: center; }
.pp-grid { display: grid; gap: 22px; grid-template-columns: 1fr; align-items: stretch; }
@media (min-width: 640px) { .pp-grid { grid-template-columns: repeat(2, 1fr); } }
@media (min-width: 1080px) { .pp-grid { grid-template-columns: repeat(4, 1fr); } }
.pp-plan { position: relative; background: var(--card, #fff); border: 1px solid var(--line); border-radius: 18px; padding: 28px 22px 22px; display: flex; flex-direction: column; box-shadow: var(--shadow-sm); min-width: 0; }
.pp-featured { border: 2px solid var(--emerald); box-shadow: var(--shadow-lg); background: linear-gradient(180deg, #fff 0%, #FFF8F9 100%); }
.pp-current { border-color: var(--gold); }
.pp-ribbon { position: absolute; top: -12px; left: 50%; transform: translateX(-50%); padding: .3rem .9rem; border-radius: 999px; background: var(--emerald); color: #fff; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; white-space: nowrap; }
.pp-plan-head { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.pp-tagline { font-size: .88rem; color: var(--ink-muted); margin: 4px 0 0; min-height: 2.6em; }
.pp-price { font-family: var(--serif); font-size: 2.1rem; font-weight: 700; color: var(--emerald-dark); line-height: 1.1; margin: 14px 0 2px; letter-spacing: -.02em; }
.pp-per { font-family: inherit; font-size: .95rem; font-weight: 600; color: var(--ink-muted); letter-spacing: 0; margin-left: 2px; }
.pp-price-na { font-size: 1.35rem; color: var(--gold); }
.pp-feats { list-style: none; padding: 0; margin: 4px 0 22px; display: grid; gap: 9px; }
.pp-action { margin-top: auto; }
.pp-coupon { margin-bottom: 12px; }
.pp-pill { display: block; text-align: center; padding: .75rem 1rem; border-radius: 999px; background: var(--gold-soft); color: var(--gold); border: 1px dashed var(--gold); font-weight: 600; font-size: .88rem; cursor: not-allowed; }
.pp-note { font-size: .82rem; color: var(--ink-muted); text-align: center; margin: 20px 0 0; }

.pp-compare-sec { background: #FDF6F7; }
.pp-h2 { text-align: center; margin-bottom: 24px; }
.pp-h3 { font-size: 1.3rem; margin-bottom: 14px; }
.pp-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--line); border-radius: 16px; background: #fff; max-width: 100%; }
.pp-table { width: 100%; min-width: 640px; border-collapse: collapse; font-size: .9rem; }
.pp-table th, .pp-table td { padding: 12px 14px; border-bottom: 1px solid var(--line); text-align: center; }
.pp-table thead th { font-family: var(--serif); font-size: 1rem; color: var(--ink); background: #FDF1F3; position: sticky; top: 0; }
.pp-table tbody th { text-align: left; font-weight: 500; color: var(--ink-soft); position: sticky; left: 0; background: #fff; min-width: 170px; }
[dir="rtl"] .pp-table tbody th { text-align: right; }
.pp-table td.pp-col-featured, .pp-table th.pp-col-featured { background: #FFF5F7; }
.pp-table thead th.pp-col-featured { color: var(--emerald); background: #FBE7EB; }
.pp-yes { display: inline-block; width: 18px; height: 18px; color: var(--emerald); }
.pp-yes svg { width: 100%; height: 100%; }
.pp-no { color: var(--line-strong); }
.pp-group th { background: var(--gold-soft) !important; color: var(--gold) !important; font-weight: 700; text-align: left; font-size: .8rem; letter-spacing: .06em; text-transform: uppercase; }
.pp-scroll-hint { display: block; }
@media (min-width: 760px) { .pp-scroll-hint { display: none; } }

.pp-info-grid { display: grid; gap: 22px; grid-template-columns: 1fr; align-items: start; }
@media (min-width: 860px) { .pp-info-grid { grid-template-columns: 1fr 1fr; } }
.pp-card { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 24px 22px; box-shadow: var(--shadow-sm); min-width: 0; }
.pp-steps { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.pp-faq { border-top: 1px solid var(--line); padding: 12px 0; }
.pp-faq:first-of-type { border-top: 0; padding-top: 0; }
.pp-faq summary { cursor: pointer; font-weight: 600; color: var(--ink); }
.pp-faq p { margin: 8px 0 0; color: var(--ink-soft); font-size: .92rem; }
/* ===== end pricing page redesign ===== */

/* No popularity claims: the old ribbon text is neutral now */
.plan-featured::after { content: "Recommended"; }

/* ==========================================================================
   Legal / policy pages (layouts/legal.blade.php) — added 27 Sep 2026
   ========================================================================== */
.legal { overflow-x: clip; }
.legal-hero { background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border-bottom: 1px solid var(--line); padding: clamp(36px, 6vw, 72px) 0 clamp(28px, 4vw, 48px); }
.legal-hero-in { max-width: 860px; }
.legal-eyebrow { margin: 0 0 10px; font: 600 .78rem/1.2 var(--sans); letter-spacing: .12em; text-transform: uppercase; color: var(--gold); }
.legal-title { margin: 0; font-family: var(--serif); font-weight: 600; font-size: clamp(2rem, 1.4rem + 2.6vw, 3.2rem); line-height: 1.1; color: var(--emerald-deep); overflow-wrap: anywhere; }
.legal-lede { margin: 14px 0 0; max-width: 62ch; font-size: var(--t-lede); line-height: 1.6; color: var(--ink-soft); }
.legal-meta { display: flex; flex-wrap: wrap; gap: 6px 18px; margin: 16px 0 0; font-size: .88rem; color: var(--ink-muted); }
.legal-meta strong { color: var(--ink); font-weight: 600; }
.legal-note { margin: 14px 0 0; padding: 10px 14px; border-radius: var(--radius-sm); background: #fff; border: 1px solid var(--line-strong); font-size: .88rem; color: var(--ink-soft); }
.legal-short { margin-top: 26px; padding: clamp(18px, 3vw, 28px); background: #fff; border: 1px solid var(--line-strong); border-left: 5px solid var(--emerald); border-radius: var(--radius); box-shadow: var(--shadow); }
.legal-short-h { margin: 0 0 12px; font-family: var(--serif); font-size: 1.35rem; color: var(--emerald-dark); }
.legal-short-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.legal-short-list li { position: relative; padding-left: 28px; line-height: 1.6; color: var(--ink); }
.legal-short-list li::before { content: ""; position: absolute; left: 4px; top: .62em; width: 10px; height: 10px; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px var(--gold-soft); }
.legal-short-foot { margin: 14px 0 0; font-size: .86rem; color: var(--ink-muted); }
.legal-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 24px; padding-top: clamp(24px, 4vw, 48px); padding-bottom: clamp(40px, 6vw, 80px); }
.legal-aside { min-width: 0; }
.legal-toc ol { margin: 0; padding: 0 0 0 1.2em; display: grid; gap: 6px; }
.legal-toc a { color: var(--ink-soft); text-decoration: none; line-height: 1.4; }
.legal-toc a:hover, .legal-toc a:focus-visible { color: var(--emerald); text-decoration: underline; }
.legal-toc-mobile { background: #fff; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); padding: 12px 16px; }
.legal-toc-mobile summary { cursor: pointer; font-weight: 600; color: var(--emerald-dark); }
.legal-toc-mobile[open] summary { margin-bottom: 10px; }
.legal-toc-desk { display: none; }
.legal-toc-h { margin: 0 0 10px; font: 600 .78rem/1.2 var(--sans); letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.legal-body { min-width: 0; max-width: 72ch; font-size: 1.02rem; line-height: 1.75; color: var(--ink-soft); }
.legal-sec { scroll-margin-top: 90px; padding: 6px 0 22px; border-bottom: 1px solid var(--line); margin-bottom: 22px; }
.legal-sec:last-of-type { border-bottom: 0; }
.legal-sec h2 { margin: 0 0 12px; font-family: var(--serif); font-weight: 600; font-size: clamp(1.3rem, 1.15rem + .6vw, 1.6rem); line-height: 1.25; color: var(--emerald-deep); }
.legal-sec h3 { margin: 18px 0 8px; font-size: 1.05rem; color: var(--ink); }
.legal-sec p { margin: 0 0 12px; }
.legal-sec ul, .legal-sec ol { margin: 0 0 12px; padding-left: 1.3em; display: grid; gap: 8px; }
.legal-sec strong { color: var(--ink); }
.legal-sec a, .legal-contact a, .legal-short a { color: var(--emerald); text-underline-offset: 2px; }
.legal-table-wrap { overflow-x: auto; margin: 6px 0 14px; border: 1px solid var(--line-strong); border-radius: var(--radius-sm); background: #fff; }
.legal-table { width: 100%; border-collapse: collapse; font-size: .95rem; line-height: 1.5; }
.legal-table th, .legal-table td { padding: 12px 14px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line); }
.legal-table th { background: var(--emerald-soft); color: var(--emerald-dark); font-weight: 600; }
.legal-table tr:last-child td { border-bottom: 0; }
.legal-callout { margin: 6px 0 14px; padding: 14px 16px; border-radius: var(--radius-sm); background: var(--gold-soft); border: 1px solid #ecd6c3; color: var(--ink); }
.legal-contact { margin-top: 10px; padding: clamp(18px, 3vw, 28px); border-radius: var(--radius); background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border: 1px solid var(--line-strong); }
.legal-contact h2 { margin: 0 0 8px; font-family: var(--serif); font-size: 1.4rem; color: var(--emerald-deep); }
.legal-contact p { margin: 0 0 12px; }
.legal-contact-list { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 8px; }
.legal-contact-list li { display: flex; flex-wrap: wrap; gap: 4px 12px; align-items: baseline; }
.legal-contact-list span { min-width: 9.5em; font-size: .9rem; color: var(--ink-muted); }
.legal-contact-list a { font-weight: 600; overflow-wrap: anywhere; }
.legal-operator { font-size: .85rem; color: var(--ink-muted); }
.legal-related { margin-top: 26px; }
.legal-related ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.legal-related a { display: inline-block; padding: 7px 14px; border-radius: var(--radius-pill); border: 1px solid var(--line-strong); background: #fff; color: var(--emerald-dark); text-decoration: none; font-size: .9rem; }
.legal-related a:hover, .legal-related a:focus-visible { border-color: var(--emerald); }
@media (min-width: 960px) {
    .legal-grid { grid-template-columns: 250px minmax(0, 1fr); gap: 56px; }
    .legal-toc-mobile { display: none; }
    .legal-toc-desk { display: block; position: sticky; top: 96px; max-height: calc(100vh - 120px); overflow-y: auto; padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: var(--radius); font-size: .92rem; }
}
[dir="rtl"] .legal-short-list li { padding-left: 0; padding-right: 28px; }
[dir="rtl"] .legal-short-list li::before { left: auto; right: 4px; }
[dir="rtl"] .legal-short { border-left-width: 1px; border-right: 5px solid var(--emerald); }
[dir="rtl"] .legal-table th, [dir="rtl"] .legal-table td { text-align: right; }
/* ===== end legal / policy pages ===== */

/* ==========================================================================
   Main content pages (partials/page-hero.blade.php: about, contact, how it works) — added 27 Sep 2026
   Full .wrap width, photo fades into the blush background (no frame).
   ========================================================================== */
.phero { background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border-bottom: 1px solid var(--line); overflow: hidden; }
.phero-in { display: grid; grid-template-columns: minmax(0, 1fr); align-items: center; gap: 8px; padding-top: clamp(32px, 5vw, 56px); }
.phero-title { margin: 0; font-family: var(--serif); font-weight: 600; font-size: clamp(2.1rem, 1.4rem + 3vw, 3.6rem); line-height: 1.08; color: var(--emerald-deep); }
.phero-lede { margin: 16px 0 0; max-width: 56ch; font-size: var(--t-lede); line-height: 1.6; color: var(--ink-soft); }
.phero-text { padding-bottom: 8px; min-width: 0; }
.phero-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 22px; }
.phero-photo { display: block; justify-self: center; width: min(100%, 460px); }
.phero-photo img { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; object-fit: cover;
    -webkit-mask-image: linear-gradient(180deg, #000 70%, transparent 100%), linear-gradient(90deg, transparent 0, #000 16%, #000 84%, transparent 100%);
    -webkit-mask-composite: source-in; mask-image: linear-gradient(180deg, #000 70%, transparent 100%), linear-gradient(90deg, transparent 0, #000 16%, #000 84%, transparent 100%); mask-composite: intersect; }
@media (min-width: 900px) {
    .phero-in { grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr); gap: 48px; padding-top: 40px; }
    .phero-text { padding-bottom: 48px; }
    .phero-photo { justify-self: end; }
}
.pbody { padding-top: clamp(28px, 4vw, 56px); padding-bottom: clamp(40px, 6vw, 80px); }
.pgrid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.pcard { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--emerald); border-radius: var(--radius); padding: 22px; box-shadow: var(--shadow-sm); min-width: 0; }
.pcard.is-gold { border-top-color: var(--gold); }
.pcard h2, .pcard h3 { margin: 0 0 8px; font-family: var(--serif); font-size: 1.25rem; color: var(--emerald-deep); }
.pcard p { margin: 0; line-height: 1.65; color: var(--ink-soft); }
.pcard a { color: var(--emerald); font-weight: 600; overflow-wrap: anywhere; }
.pcard .pnum { display: inline-grid; place-items: center; width: 34px; height: 34px; margin-bottom: 10px; border-radius: 50%; background: var(--emerald-soft); color: var(--emerald); font-weight: 700; }
.psection-h { margin: 36px 0 16px; font-family: var(--serif); font-size: clamp(1.4rem, 1.2rem + .8vw, 1.9rem); color: var(--emerald-deep); }
.pnote { margin-top: 26px; padding: 18px 20px; border-radius: var(--radius); background: var(--gold-soft); border: 1px solid #ecd6c3; color: var(--ink); line-height: 1.6; }
/* ===== end main content pages ===== */

/* ===== Admin panel, enterprise shell (27 Sep 2026) =====
   Scoped to .adm / .adm-body so nothing on the member site changes. Brand:
   crimson var(--emerald), rose-gold var(--gold), deep #4E0716 sidebar, blush
   #FDF1F3 surfaces. Success is always green (#1F7A4D on #E7F5EE), never crimson. */
.adm-body { background: #fbf6f7; }
.adm.admin-shell { display: grid; grid-template-columns: 256px minmax(0, 1fr); min-height: 100vh; }
.adm .adm-side { position: sticky; top: 0; height: 100vh; overflow-y: auto; padding: 0 12px 24px !important; background: #4e0716 !important; color: #f3dfe3 !important; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.2) transparent; }
.adm .adm-side-head { display: flex; align-items: center; gap: 10px; padding: 20px 6px 14px; position: sticky; top: 0; background: #4e0716; z-index: 2; }
.adm .adm-side .brand { color: #fff; font-family: var(--serif); font-size: 1.25rem; font-weight: 600; }
.adm .adm-side .brand span { color: #e8b98f; }
.adm .adm-env { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; padding: 2px 7px; border-radius: 999px; background: rgba(232,185,143,.16); color: #e8b98f; }
.adm .adm-close { display: none; margin-left: auto; background: none; border: 0; color: #fff; cursor: pointer; padding: 4px; }
.adm .adm-nav { margin-top: 4px; display: grid; gap: 1px; grid-template-columns: minmax(0, 1fr) !important; }
.adm .adm-nav .group { font-size: .68rem; text-transform: uppercase; letter-spacing: .12em; color: rgba(243,223,227,.55) !important; margin: 18px 0 5px 10px; }
.adm .adm-nav a { display: flex !important; align-items: center; gap: 10px; padding: .5rem .65rem !important; border-radius: 9px; color: #f3dfe3 !important; font-size: .9rem; line-height: 1.25; text-decoration: none; }
.adm .adm-nav a .ai-ico { flex: none; opacity: .75; }
.adm .adm-nav a span { flex: 1; min-width: 0; }
.adm .adm-nav a:hover { background: rgba(255,255,255,.08) !important; color: #fff !important; }
.adm .adm-nav a.active { background: rgba(255,255,255,.13) !important; color: #fff !important; box-shadow: inset 3px 0 0 #d4a373 !important; font-weight: 600; }
.adm .adm-nav a.active .ai-ico { opacity: 1; color: #e8b98f; }
.adm .adm-count { font-style: normal; font-size: .7rem; font-weight: 700; min-width: 20px; padding: 1px 6px; border-radius: 999px; background: #d4a373; color: #3a0510; text-align: center; }
.adm-wrap { min-width: 0; display: flex; flex-direction: column; }
.adm-top { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 14px; padding: 10px clamp(16px, 3vw, 30px); background: rgba(255,255,255,.94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.adm-burger { display: none; background: none; border: 1px solid var(--line-strong); border-radius: 9px; padding: 6px; color: var(--ink); cursor: pointer; }
.adm-title { min-width: 0; flex: 1; }
.adm-title strong { display: block; font-family: var(--serif); font-size: 1.12rem; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.adm-crumb { font-size: .74rem; color: var(--ink-muted); display: flex; gap: 6px; }
.adm-crumb a { color: var(--ink-muted); }
.adm-search { display: flex; align-items: center; gap: 8px; width: min(340px, 36vw); padding: 0 12px; border: 1px solid var(--line-strong); border-radius: 999px; background: #fdf1f3; color: var(--ink-muted); }
.adm-search:focus-within { border-color: var(--emerald); background: #fff; }
.adm-search input { border: 0 !important; background: transparent !important; padding: .55rem 0 !important; margin: 0 !important; box-shadow: none !important; font-size: .88rem; width: 100%; min-width: 0; }
.adm-search input:focus { outline: none; }
.adm-me { position: relative; }
.adm-me summary { list-style: none; display: flex; align-items: center; gap: 9px; cursor: pointer; padding: 4px 6px; border-radius: 999px; }
.adm-me summary::-webkit-details-marker { display: none; }
.adm-me summary:hover { background: #fdf1f3; }
.adm-avatar { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: linear-gradient(160deg, var(--emerald), #4e0716); color: #fff; font-weight: 700; font-size: .9rem; }
.adm-me-txt { display: grid; line-height: 1.15; }
.adm-me-txt b { font-size: .86rem; }
.adm-me-txt small { font-size: .72rem; color: var(--ink-muted); }
.adm-menu { position: absolute; right: 0; top: calc(100% + 8px); min-width: 230px; background: #fff; border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 14px 40px rgba(78,7,22,.14); padding: 6px; display: grid; }
.adm-menu-head { padding: 8px 10px; font-size: .78rem; color: var(--ink-muted); border-bottom: 1px solid var(--line); margin-bottom: 4px; overflow-wrap: anywhere; }
.adm-menu a, .adm-menu button { display: flex; align-items: center; gap: 9px; width: 100%; padding: 8px 10px; border-radius: 8px; color: var(--ink); background: none; border: 0; font: inherit; font-size: .88rem; cursor: pointer; text-align: left; }
.adm-menu a:hover, .adm-menu button:hover { background: #fdf1f3; text-decoration: none; }
.adm-main.admin-main { background: transparent; padding: clamp(16px, 3vw, 30px); max-width: 1440px; width: 100%; }
.adm-main h1 { font-size: clamp(1.5rem, 1.2rem + 1vw, 2rem); margin: 0 0 4px; }
.adm-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.adm-h2 { display: flex; align-items: center; gap: 8px; font-family: var(--serif); font-size: 1.08rem; margin: 0 0 12px; color: var(--ink); }
.adm-h2 .ai-ico { color: var(--emerald); }
.adm-section { font-family: var(--sans); font-size: .76rem; letter-spacing: .12em; text-transform: uppercase; color: var(--gold); margin: 28px 0 10px; }
.adm-card-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; }
.adm-card-head .adm-h2 { margin: 0; }
.adm-main .card { border-radius: 14px; border-color: var(--line); box-shadow: 0 1px 2px rgba(78,7,22,.04); }
/* KPI cards */
.adm-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 12px; }
.adm-kpi { position: relative; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 14px 16px; display: flex; flex-direction: column; gap: 6px; transition: border-color .15s, box-shadow .15s; }
.adm-kpi:has(.adm-kpi-link):hover { border-color: var(--line-strong); box-shadow: 0 6px 20px rgba(78,7,22,.08); }
.adm-kpi-top { display: flex; align-items: center; gap: 9px; }
.adm-kpi-ico { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 9px; background: #fdf1f3; color: var(--emerald); flex: none; }
.adm-kpi-label { font-size: .82rem; color: var(--ink-soft); line-height: 1.25; }
.adm-kpi-val { font-family: var(--serif); font-size: 1.75rem; line-height: 1.1; color: var(--ink); }
.adm-kpi-trend { display: flex; align-items: flex-end; justify-content: space-between; gap: 8px; }
.adm-kpi-trend small { font-size: .72rem; color: var(--ink-muted); white-space: nowrap; }
.adm-kpi-link { position: absolute; inset: 0; border-radius: 14px; }
.ai-spark .l { stroke: var(--emerald); stroke-width: 1.6; stroke-linejoin: round; stroke-linecap: round; }
.ai-spark .a { fill: rgba(179,18,46,.08); }
/* Needs attention + launch */
.adm-top-grid { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 16px; }
.adm-attn ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.adm-attn li > a, .adm-attn li > span { display: flex; align-items: center; gap: 10px; padding: 9px 10px; border-radius: 10px; color: var(--ink-soft); }
.adm-attn li > a:hover { background: #fdf1f3; text-decoration: none; }
.adm-attn li.hot > a, .adm-attn li.hot > span { color: var(--ink); font-weight: 600; }
.adm-attn li .ai-ico { color: var(--emerald); flex: none; }
.adm-attn .t { flex: 1; }
.adm-launch-num { font-size: .95rem; margin: 6px 0 8px; }
.adm-launch-num b { font-family: var(--serif); font-size: 1.6rem; color: var(--ink); }
.adm-bar { height: 10px; border-radius: 999px; background: #f6e3e6; overflow: hidden; }
.adm-bar span { display: block; height: 100%; min-width: 2px; border-radius: 999px; background: linear-gradient(90deg, var(--gold), var(--emerald)); }
/* Pills (status) */
.adm-pill { display: inline-flex; align-items: center; gap: 5px; font-style: normal; font-size: .74rem; font-weight: 600; padding: 3px 10px; border-radius: 999px; white-space: nowrap; border: 1px solid transparent; }
.adm-pill-ok { background: #e7f5ee; color: #1f7a4d; border-color: rgba(31,122,77,.2); }
.adm-pill-warn { background: #fbf0e3; color: #8a5a1f; border-color: rgba(176,122,79,.3); }
.adm-pill-bad { background: #fbe9e7; color: #8f2f24; border-color: rgba(143,47,36,.2); }
.adm-pill-off { background: #f1efe9; color: var(--ink-muted); border-color: var(--line); }
.adm-pill-info { background: #fdf1f3; color: #7d0d24; border-color: rgba(179,18,46,.15); }
/* Rows, feed, empty states */
.adm-row { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.adm-row:last-child { border-bottom: 0; }
.adm-hbar { flex: 1; height: 6px; border-radius: 999px; background: #f6e3e6; overflow: hidden; }
.adm-hbar span { display: block; height: 100%; background: var(--gold); }
.adm-feed { list-style: none; margin: 12px 0 0; padding: 0; }
.adm-feed li { display: flex; gap: 12px; padding: 10px 0; border-bottom: 1px solid var(--line); }
.adm-feed li:last-child { border-bottom: 0; }
.adm-feed p { margin: 0; font-size: .9rem; color: var(--ink-soft); }
.adm-feed-ico { display: grid; place-items: center; flex: none; width: 30px; height: 30px; border-radius: 50%; background: #fdf1f3; color: var(--emerald); }
.adm-empty { text-align: center; padding: 22px 10px; color: var(--ink-muted); }
.adm-empty .ai-ico { color: var(--gold); }
.adm-empty p { margin: 6px 0 0; }
/* Every admin list page: tables, filters, pagination */
.adm-main .table-wrap { border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.adm-main table th { background: #fdf1f3; color: #4e0716; font-size: .76rem; text-transform: uppercase; letter-spacing: .05em; white-space: nowrap; }
.adm-main table tbody tr:hover td { background: #fffafb; }
.adm-main table td { vertical-align: middle; }
.adm-main .card > .table-wrap:first-child { margin-top: 0; }
.adm-main .badge-ok { background: #e7f5ee !important; color: #1f7a4d !important; border-color: rgba(31,122,77,.2) !important; }
.adm-main .field-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 12px; }
.adm-filters { display: flex; flex-wrap: wrap; gap: 10px; align-items: flex-end; }
.adm-filters .field { margin: 0; min-width: 160px; flex: 1; }
.adm-tabs { display: flex; flex-wrap: wrap; gap: 6px; margin: 12px 0; }
.adm-tabs a { padding: 6px 12px; border-radius: 999px; border: 1px solid var(--line-strong); color: var(--ink-soft); font-size: .84rem; background: #fff; }
.adm-tabs a.on { background: #4e0716; border-color: #4e0716; color: #fff; }
.adm-tabs a:hover { text-decoration: none; border-color: var(--emerald); }
.adm-main nav[role="navigation"] { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; font-size: .86rem; }
.adm-main nav[role="navigation"] svg { width: 16px; height: 16px; }
.adm-main nav[role="navigation"] a, .adm-main nav[role="navigation"] span[aria-current] span, .adm-main nav[role="navigation"] span[aria-disabled] span { display: inline-flex; align-items: center; justify-content: center; min-width: 34px; padding: 5px 9px; border: 1px solid var(--line-strong); border-radius: 8px; background: #fff; color: var(--ink); }
.adm-main nav[role="navigation"] span[aria-current] span { background: #4e0716; color: #fff; border-color: #4e0716; }
.adm-main nav[role="navigation"] .hidden { display: none; }
.adm-main nav[role="navigation"] > div { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; }
.adm-main nav[role="navigation"] p { margin: 0; color: var(--ink-muted); }
.adm-code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .8rem; background: #fdf1f3; padding: 1px 6px; border-radius: 5px; }
.adm-json { width: 100%; min-height: 320px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .82rem; }
.adm-danger { border: 1px solid rgba(143,47,36,.25) !important; background: #fffafa !important; }
/* Mobile: off-canvas sidebar */
.adm-scrim { display: none; }
@media (max-width: 960px) {
    .adm.admin-shell { grid-template-columns: minmax(0, 1fr); }
    .adm .adm-side { position: fixed; left: 0; top: 0; bottom: 0; width: 280px; max-width: 86vw; z-index: 50; transform: translateX(-102%); transition: transform .22s ease; }
    .adm-open .adm .adm-side { transform: none; box-shadow: 0 0 40px rgba(0,0,0,.3); }
    .adm-open .adm-scrim { display: block; position: fixed; inset: 0; background: rgba(20,4,8,.45); z-index: 40; }
    .adm .adm-close, .adm-burger { display: inline-flex; }
    .adm-top-grid { grid-template-columns: minmax(0, 1fr); }
    .adm-me-txt { display: none; }
}
@media (max-width: 640px) {
    .adm-top { flex-wrap: wrap; gap: 10px; }
    .adm-search { order: 5; width: 100%; }
    .adm-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .adm-kpi { padding: 12px; }
    .adm-kpi-val { font-size: 1.4rem; }
    .adm-kpi-trend { flex-direction: column; align-items: flex-start; }
    .adm-kpi-trend .ai-spark { width: 100%; }
    .adm-main .grid-2, .adm-main .grid-3, .adm-main .grid-4 { grid-template-columns: minmax(0, 1fr); }
    .adm-menu { right: -6px; }
}
[dir="rtl"] .adm .adm-nav a.active { box-shadow: inset -3px 0 0 #d4a373 !important; }
/* ===== end admin enterprise shell ===== */

/* ===== Admin list pages, consistent pills + empty states (27 Sep 2026) ===== */
.adm-main .badge { border-radius: 999px; font-size: .74rem; font-weight: 600; padding: 3px 10px; }
.adm-main .badge-wait { background: #fbf0e3; color: #8a5a1f; border-color: rgba(176,122,79,.3); }
.adm-main .badge-bad { background: #fbe9e7; color: #8f2f24; border-color: rgba(143,47,36,.2); }
.adm-main td.muted[colspan], .adm-main td[colspan] > .muted { text-align: center; padding: 28px 12px; }
.adm-main .card-tight form, .adm-main form .field-row { align-items: end; }
.adm-main input:not([type=checkbox]):not([type=radio]), .adm-main select, .adm-main textarea { border-radius: 9px; }
.adm-main .alert-ok { background: #e7f5ee; color: #1f7a4d; border-color: rgba(31,122,77,.25); }
.adm-main table input { min-width: 70px; padding: .4rem .5rem; font-size: .86rem; }
/* ===== end admin list pages ===== */

/* About page v2 (27 Sep 2026): cut-out hero couple + full content sections */
.phero-photo.is-cutout { align-self: end; }
.phero-photo.is-cutout img { -webkit-mask-image: none; mask-image: none; object-fit: contain; filter: drop-shadow(0 24px 40px rgba(78,7,22,.18)); }
.ab-h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); margin: 0 0 22px; color: var(--ink); }
.ab-mission { display: grid; gap: 32px; padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(24px, 4vw, 40px); align-items: center; }
.ab-mission h2 { font-size: clamp(1.5rem, 2.8vw, 2.1rem); margin: 0 0 14px; }
.ab-mission p:not(.eyebrow) { font-size: 1.05rem; line-height: 1.75; color: var(--ink-soft); margin: 0; max-width: 64ch; }
.ab-facts { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.ab-facts li { background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 18px; box-shadow: var(--shadow-sm); }
.ab-facts strong { display: block; font-family: var(--serif); font-size: 1.45rem; color: var(--emerald); }
.ab-facts span { font-size: .88rem; color: var(--ink-muted); }
.ab-section { padding: clamp(40px, 6vw, 72px) 0; }
.ab-section:nth-of-type(even) { background: linear-gradient(180deg, #fff, var(--paper-warm)); }
.ab-features { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr)); }
.ab-feature { background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 22px; box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease; }
.ab-feature:hover { transform: translateY(-3px); box-shadow: var(--shadow); }
.ab-feature h3 { font-size: 1.08rem; margin: 12px 0 6px; color: var(--emerald-deep); }
.ab-feature p { margin: 0; font-size: .93rem; line-height: 1.6; color: var(--ink-soft); }
.ab-ico { display: inline-grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: var(--emerald-soft); color: var(--emerald); }
.ab-ico svg { width: 24px; height: 24px; }
.ab-two { display: grid; gap: 24px; padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(40px, 6vw, 72px); }
.ab-promises ul { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 12px; }
.ab-promises li { display: flex; gap: 12px; align-items: flex-start; font-size: 1rem; line-height: 1.55; color: var(--ink); }
.ab-tick { flex: none; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: #E7F5EE; color: #1F7A4D; }
.ab-tick svg { width: 15px; height: 15px; }
.ab-launch { background: linear-gradient(135deg, #fff8ef, var(--emerald-soft)); border: 1px solid #f0dcc4; border-radius: 22px; padding: 26px; align-self: start; }
.ab-launch h3 { font-size: 1.3rem; margin: 4px 0 10px; }
.ab-launch p { color: var(--ink-soft); line-height: 1.65; margin: 0 0 16px; }
.ab-serve-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); }
.ab-serve-card { background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: 18px; padding: 22px; }
.ab-serve-card h3 { margin: 0 0 8px; font-size: 1.12rem; color: var(--emerald-deep); }
.ab-serve-card p { margin: 0; line-height: 1.65; color: var(--ink-soft); }
.ab-company { display: grid; gap: 24px; padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(40px, 6vw, 72px); align-items: start; }
.ab-company p:not(.eyebrow) { line-height: 1.75; color: var(--ink-soft); max-width: 60ch; }
.ab-contact { margin: 0; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 8px 22px; box-shadow: var(--shadow-sm); }
.ab-contact div { display: flex; justify-content: space-between; gap: 14px; padding: 14px 0; border-bottom: 1px solid var(--line); flex-wrap: wrap; }
.ab-contact div:last-child { border-bottom: 0; }
.ab-contact dt { color: var(--ink-muted); font-size: .92rem; }
.ab-contact dd { margin: 0; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.ab-contact a { color: var(--emerald); }
.ab-faq details { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 16px 20px; margin-bottom: 10px; }
.ab-faq summary { cursor: pointer; font-weight: 600; color: var(--ink); }
.ab-faq details p { margin: 10px 0 0; line-height: 1.65; color: var(--ink-soft); }
.ab-cta { text-align: center; padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(48px, 7vw, 88px); }
.ab-cta h2 { font-size: clamp(1.5rem, 3vw, 2.2rem); max-width: 26ch; margin: 0 auto 20px; }
.ab-cta .phero-actions { justify-content: center; }
@media (min-width: 900px) {
    .ab-mission { grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: 56px; }
    .ab-two { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); gap: 48px; }
    .ab-company { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 48px; }
}

/* Contact page v2 (27 Sep 2026): form first, channels beside it */
.ct-main { display: grid; gap: 24px; padding-top: clamp(32px, 5vw, 60px); padding-bottom: clamp(32px, 5vw, 56px); scroll-margin-top: 20px; }
.ct-form-card { background: #fff; border: 1px solid var(--line); border-radius: 24px; padding: clamp(20px, 3vw, 32px); box-shadow: var(--shadow); }
.ct-form-card h2 { margin: 0 0 6px; font-size: clamp(1.4rem, 2.4vw, 1.8rem); }
.ct-form { display: grid; gap: 14px; margin-top: 16px; }
.ct-form label { display: grid; gap: 6px; font-weight: 600; font-size: .92rem; color: var(--ink); }
.ct-form input, .ct-form select, .ct-form textarea { font-weight: 400; }
.ct-row { display: grid; gap: 14px; }
.ct-err { color: #b3122e; font-weight: 500; font-size: .85rem; }
.ct-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.ct-sent { display: grid; gap: 4px; margin-top: 14px; padding: 14px 16px; border-radius: 14px; background: #E7F5EE; color: #1F7A4D; border: 1px solid #bfe3cf; }
.ct-channels { display: grid; gap: 12px; align-content: start; }
.ct-channel { display: flex; gap: 14px; align-items: flex-start; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 18px; color: inherit; box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease; }
.ct-channel:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow); }
.ct-channel > span:last-child { display: grid; gap: 3px; min-width: 0; }
.ct-channel strong { color: var(--emerald-deep); font-family: var(--serif); font-size: 1.05rem; }
.ct-channel em { font-style: normal; color: var(--emerald); font-weight: 600; overflow-wrap: anywhere; }
.ct-channel small { color: var(--ink-muted); line-height: 1.5; }
.ct-ico { flex: none; display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: var(--emerald-soft); color: var(--emerald); }
.ct-ico svg { width: 22px; height: 22px; }
.ct-channel.is-safety .ct-ico { background: var(--gold-soft); color: var(--gold); }
.ct-urgent { display: grid; gap: 2px; padding: 14px 16px; border-radius: 14px; background: #fff8ef; border: 1px solid #f0dcc4; font-size: .9rem; color: var(--ink-soft); }
.ct-urgent strong { color: var(--ink); }
.ct-link { color: inherit; }
.ct-link:hover { text-decoration: none; }
@media (min-width: 640px) { .ct-row { grid-template-columns: 1fr 1fr; } }
@media (min-width: 960px) { .ct-main { grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 32px; } }

/* Cut-out hero photos (27 Sep 2026): natural height, no empty band above the heads */
.phero-photo.is-cutout img { aspect-ratio: auto; height: auto; width: 100%; max-height: min(64vh, 540px); object-fit: contain; object-position: bottom center; }
.phero:has(.phero-photo.is-cutout) .phero-in { padding-top: clamp(20px, 3vw, 36px); align-items: end; }
.phero:has(.phero-photo.is-cutout) .phero-text { padding-bottom: clamp(28px, 5vw, 64px); }

/* Cut-out heroes: text vertically centred, photo stays on the bottom edge */
.phero:has(.phero-photo.is-cutout) .phero-text { align-self: center; padding-bottom: clamp(20px, 3vw, 36px); }

/* Help centre v2 (27 Sep 2026): full width, search, topic cards, sticky topics */
.hc-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.hc-search { position: relative; max-width: 560px; margin-top: 8px; }
.hc-search svg { position: absolute; left: 18px; top: 50%; width: 20px; height: 20px; transform: translateY(-50%); color: var(--ink-muted); }
.hc-search input { width: 100%; padding: 16px 20px 16px 50px; border-radius: 999px; border: 1px solid var(--line-strong); background: #fff; font-size: 1rem; box-shadow: var(--shadow); }
.hc-search input:focus { outline: none; border-color: var(--emerald); box-shadow: 0 0 0 4px rgba(179,18,46,.12); }
.hc-topics { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); padding-top: clamp(28px, 4vw, 48px); }
.hc-topic { display: grid; gap: 6px; padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 18px; color: inherit; box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease; }
.hc-topic:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow); }
.hc-topic strong { color: var(--emerald-deep); font-family: var(--serif); font-size: 1.02rem; }
.hc-topic small { color: var(--ink-muted); }
.hc-body { display: grid; gap: 28px; padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(48px, 7vw, 88px); }
.hc-nav { display: none; }
.hc-group { margin-bottom: 28px; scroll-margin-top: 20px; }
.hc-group h2 { display: flex; align-items: center; gap: 12px; font-size: clamp(1.3rem, 2.2vw, 1.6rem); margin: 0 0 12px; }
.hc-group h2 .ab-ico { width: 40px; height: 40px; }
.hc-q { background: #fff; border: 1px solid var(--line); border-radius: 16px; margin-bottom: 10px; transition: box-shadow .2s ease; }
.hc-q[open] { box-shadow: var(--shadow); border-color: var(--line-strong); }
.hc-q summary { list-style: none; cursor: pointer; padding: 18px 52px 18px 20px; font-weight: 600; color: var(--ink); position: relative; }
.hc-q summary::-webkit-details-marker { display: none; }
.hc-q summary::after { content: ''; position: absolute; right: 22px; top: 50%; width: 10px; height: 10px; border-right: 2px solid var(--emerald); border-bottom: 2px solid var(--emerald); transform: translateY(-70%) rotate(45deg); transition: transform .2s ease; }
.hc-q[open] summary::after { transform: translateY(-30%) rotate(-135deg); }
.hc-a { padding: 0 20px 18px; }
.hc-a p { margin: 0 0 10px; line-height: 1.7; color: var(--ink-soft); max-width: 75ch; }
.hc-a p:last-child { margin-bottom: 0; }
.hc-none { padding: 18px; border-radius: 14px; background: #fff8ef; border: 1px solid #f0dcc4; }
.hc-still { display: grid; gap: 16px; align-items: center; margin-top: 12px; padding: clamp(22px, 3vw, 32px); border-radius: 24px; background: linear-gradient(135deg, #FDF1F3, #FBE7EB); border: 1px solid var(--line); }
.hc-still h2 { margin: 0 0 6px; font-size: 1.5rem; }
.hc-still p { margin: 0; color: var(--ink-soft); line-height: 1.6; }
@media (min-width: 960px) {
    .hc-body { grid-template-columns: 240px minmax(0, 1fr); gap: 44px; }
    .hc-nav { display: grid; gap: 4px; align-self: start; position: sticky; top: 20px; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 18px; }
    .hc-nav a { padding: 8px 10px; border-radius: 10px; color: var(--ink-soft); font-size: .93rem; }
    .hc-nav a:hover { background: var(--emerald-soft); color: var(--emerald-dark); text-decoration: none; }
    .hc-nav-cta { margin-top: 8px; color: var(--emerald) !important; font-weight: 600; }
    .hc-still { grid-template-columns: minmax(0, 1fr) auto; }
}

/* Help topics: 6 per row on desktop so 11 topics sit as 6 + 5 */
@media (min-width: 1100px) { .hc-topics { grid-template-columns: repeat(6, minmax(0, 1fr)); } }

/* How it works v2 (27 Sep 2026): numbered journey timeline */
.hw-steps { padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(32px, 5vw, 56px); }
.hw-timeline { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; counter-reset: none; }
.hw-step { display: grid; grid-template-columns: 44px minmax(0, 1fr); gap: 14px; position: relative; }
.hw-step:not(:last-child)::before { content: ''; position: absolute; left: 21px; top: 46px; bottom: -14px; width: 2px; background: linear-gradient(var(--emerald-soft), var(--line)); }
.hw-num { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, var(--emerald-mid), var(--emerald-dark)); color: #fff; font-weight: 700; font-family: var(--serif); font-size: 1.1rem; box-shadow: 0 6px 16px rgba(179,18,46,.25); position: relative; z-index: 1; }
.hw-card { display: flex; gap: 16px; align-items: flex-start; background: #fff; border: 1px solid var(--line); border-radius: 18px; padding: 18px 20px; box-shadow: var(--shadow-sm); }
.hw-card h3 { margin: 0 0 4px; font-size: 1.1rem; color: var(--emerald-deep); }
.hw-card p { margin: 0; line-height: 1.65; color: var(--ink-soft); }
@media (max-width: 560px) { .hw-card .ab-ico { display: none; } }
@media (min-width: 960px) {
    .hw-timeline { grid-template-columns: 1fr 1fr; column-gap: 28px; }
    .hw-step:not(:last-child)::before { display: none; }
}

/* How it works: the last (odd) step becomes a full-width final card on desktop */
@media (min-width: 960px) { .hw-step:last-child:nth-child(odd) { grid-column: 1 / -1; } .hw-step:last-child:nth-child(odd) .hw-card { background: linear-gradient(135deg, #FDF1F3, #FBE7EB); border-color: #f0dcc4; } }

/* Success stories v2 (27 Sep 2026) */
.ss-body { padding-top: clamp(40px, 6vw, 72px); padding-bottom: clamp(32px, 5vw, 56px); }
.ss-grid { display: grid; gap: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); margin-top: 20px; }
.ss-card { display: grid; gap: 6px; background: #fff; border: 1px solid var(--line); border-radius: 20px; padding: 22px; color: inherit; box-shadow: var(--shadow-sm); }
.ss-card:hover { text-decoration: none; box-shadow: var(--shadow); }
.ss-card h3 { margin: 6px 0 0; font-size: 1.2rem; }
.ss-real { background: #E7F5EE; color: #1F7A4D; }
.ss-more { color: var(--emerald); font-weight: 600; }
.ss-check { display: flex !important; grid-template-columns: none; gap: 10px; align-items: flex-start; font-weight: 400 !important; line-height: 1.5; }
.ss-check input { margin-top: 4px; flex: none; }
.ss-next { margin: 8px 0 0; padding-left: 20px; display: grid; gap: 10px; color: var(--ink-soft); line-height: 1.55; }

/* Policy pages (28 Sep 2026): hero uses the full layout width - title left, In short card right; wider reading column */
@media (min-width: 960px) {
  .legal-hero-in { max-width: var(--wrap); display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); column-gap: 56px; align-items: start; }
  .legal-hero-in > * { grid-column: 1; }
  .legal-hero-in > .legal-short { grid-column: 2; grid-row: 1 / span 8; margin-top: 0; }
}
.legal-body { max-width: 82ch; }

/* Policy TOC: labels that already carry their number (1. Be real) are not numbered twice */
.legal-toc ol.legal-toc-numbered { list-style: none; padding-left: 0; }

/* Contact: Report misuse card (moved here from the footer, 28 Sep 2026) */
.ct-channel.ct-misuse { border-color: #f3c7cf; background: linear-gradient(135deg, #fff, #FDF1F3); }
.ct-channel.ct-misuse .ct-ico { background: var(--emerald); color: #fff; }

/* Admin in the ONE brand (28 Sep 2026): the same light blush as the website and the app,
   not the old deep-maroon sidebar. Crimson for the active item, rose-gold accents. */
.adm .adm-side, .admin-side { background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%) !important; color: var(--ink-soft) !important; border-right: 1px solid var(--line); scrollbar-color: rgba(125,13,36,.25) transparent; }
.adm .adm-side-head { background: #FDF1F3 !important; border-bottom: 1px solid var(--line); }
.adm .adm-side .brand { color: #7d0d24 !important; }
.adm .adm-side .brand span { color: #b07a4f !important; }
.adm .adm-env { background: #fff; color: #b07a4f; border: 1px solid #f0dcc4; }
.adm .adm-close { color: var(--ink); }
.adm .adm-nav .group { color: #b07a4f !important; font-weight: 700; }
.adm .adm-nav a, .admin-side nav a { color: var(--ink-soft) !important; }
.adm .adm-nav a .ai-ico { opacity: .85; color: #7d0d24; }
.adm .adm-nav a:hover, .admin-side nav a:hover { background: rgba(255,255,255,.75) !important; color: #7d0d24 !important; }
.adm .adm-nav a.active, .admin-side nav a.active { background: #fff !important; color: #b3122e !important; box-shadow: inset 3px 0 0 #b3122e, 0 1px 3px rgba(125,13,36,.08) !important; font-weight: 600; }
.adm .adm-nav a.active .ai-ico { color: #b3122e; }
.adm .adm-count { background: #b3122e; color: #fff; }
.admin-side .muted, .admin-side small { color: var(--ink-muted) !important; }

/* Marriage guides v2 (28 Sep 2026): blog index + article, enterprise layout */
.gd-body { padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(48px, 7vw, 88px); }
.gd-topics { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 24px; }
.gd-topics a { padding: 8px 16px; border-radius: 999px; border: 1px solid var(--line-strong); background: #fff; color: var(--ink-soft); font-size: .9rem; font-weight: 600; }
.gd-topics a:hover { text-decoration: none; border-color: var(--emerald); color: var(--emerald); }
.gd-topics a.on { background: var(--emerald); border-color: var(--emerald); color: #fff; }
.gd-cat { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.gd-meta { font-size: .84rem; color: var(--ink-muted); }
.gd-featured { display: grid; gap: 0; background: #fff; border: 1px solid var(--line); border-radius: 24px; overflow: hidden; color: inherit; box-shadow: var(--shadow); margin-bottom: 24px; transition: box-shadow .2s ease; }
.gd-featured:hover { text-decoration: none; box-shadow: var(--shadow-lg); }
.gd-featured img { width: 100%; height: 100%; min-height: 240px; object-fit: cover; display: block; }
.gd-featured-text { padding: clamp(22px, 3vw, 36px); display: flex; flex-direction: column; gap: 10px; justify-content: center; }
.gd-featured h2 { margin: 0; font-size: clamp(1.4rem, 2.6vw, 2rem); color: var(--ink); }
.gd-featured p { margin: 0; color: var(--ink-soft); line-height: 1.65; }
.gd-read { color: var(--emerald); font-weight: 700; margin-top: 4px; }
.gd-grid { display: grid; gap: 20px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr)); }
.gd-card { display: flex; flex-direction: column; background: #fff; border: 1px solid var(--line); border-radius: 20px; overflow: hidden; color: inherit; box-shadow: var(--shadow-sm); transition: transform .2s ease, box-shadow .2s ease; }
.gd-card:hover { text-decoration: none; transform: translateY(-3px); box-shadow: var(--shadow); }
.gd-card img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; display: block; }
.gd-card-body { padding: 18px 20px 22px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.gd-card h3 { margin: 0; font-size: 1.14rem; line-height: 1.35; color: var(--ink); }
.gd-card p { margin: 0; font-size: .92rem; line-height: 1.6; color: var(--ink-soft); }
.gd-card .gd-meta { margin-top: auto; padding-top: 6px; }
.gd-none { padding: 16px; border-radius: 14px; background: #fff8ef; border: 1px solid #f0dcc4; }
.gd-cta { margin-top: 36px; }
.gd-hero { background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border-bottom: 1px solid var(--line); padding: clamp(28px, 5vw, 56px) 0; }
.gd-hero-in { display: grid; gap: 24px; align-items: center; }
.gd-hero h1 { margin: 8px 0 12px; font-size: clamp(1.8rem, 4vw, 2.8rem); line-height: 1.15; color: var(--emerald-deep); }
.gd-lede { font-size: 1.1rem; line-height: 1.65; color: var(--ink-soft); margin: 0 0 12px; max-width: 60ch; }
.gd-hero-img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 22px; box-shadow: var(--shadow-lg); }
.gd-layout { display: grid; gap: 32px; padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(32px, 5vw, 56px); }
.gd-article { min-width: 0; max-width: 74ch; font-size: 1.06rem; line-height: 1.8; color: var(--ink-soft); }
.gd-article h2 { margin: 1.8em 0 .6em; font-size: 1.45rem; color: var(--emerald-deep); scroll-margin-top: 20px; }
.gd-article h2:first-child { margin-top: 0; }
.gd-article ul { padding-left: 1.3rem; }
.gd-article li { margin-bottom: .5rem; }
.gd-share { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 32px; padding: 16px 18px; border-radius: 16px; background: #fff; border: 1px solid var(--line); }
.gd-share strong { margin-right: 6px; font-size: .92rem; }
.gd-share a, .gd-share button { padding: 7px 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: #fff; color: var(--emerald-dark); font: inherit; font-size: .86rem; font-weight: 600; cursor: pointer; }
.gd-share a:hover, .gd-share button:hover { text-decoration: none; border-color: var(--emerald); }
.gd-note { margin-top: 18px; font-size: .84rem; color: var(--ink-muted); line-height: 1.6; }
.gd-side { display: grid; gap: 18px; align-content: start; }
.gd-sidecta h3 { font-size: 1.15rem; margin: 4px 0 8px; }
@media (min-width: 900px) {
    .gd-featured { grid-template-columns: 1.1fr 1fr; }
    .gd-hero-in { grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 48px; }
    .gd-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 56px; }
    .gd-side { position: sticky; top: 20px; }
    .gd-toc { display: grid !important; }
}
@media (max-width: 899px) { .gd-toc { display: none !important; } }

/* Guide article polish (28 Sep 2026) */
.gd-progress { position: sticky; top: 0; z-index: 30; height: 3px; background: transparent; }
.gd-progress span { display: block; height: 100%; width: 0; background: linear-gradient(90deg, var(--emerald-mid), var(--gold)); transition: width .1s linear; }
.gd-article > p:first-child { font-size: 1.14rem; color: var(--ink); }
.gd-article h2 { padding-top: .2em; border-top: 1px solid var(--line); padding-top: 1em; }
.gd-article h2:first-child { border-top: 0; padding-top: 0; }
.gd-article p { margin: 0 0 1.1em; }
.gd-author { display: flex; gap: 14px; align-items: flex-start; margin-top: 28px; padding: 18px 20px; border-radius: 18px; background: linear-gradient(135deg, #FDF1F3, #FBE7EB); border: 1px solid var(--line); }
.gd-author strong { font-family: var(--serif); color: var(--emerald-deep); font-size: 1.05rem; }
.gd-author p { margin: 4px 0 0; font-size: .92rem; line-height: 1.6; color: var(--ink-soft); }
.gd-author-logo { flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 50%; background: #fff; border: 1px solid var(--line-strong); font-family: var(--serif); font-weight: 700; font-size: 1.05rem; color: #7d0d24; }
.gd-author-logo span { color: #b07a4f; }
.gd-toc a { line-height: 1.35; }

/* Guide article fixes 2 (28 Sep 2026) */
.gd-author { height: auto; overflow: visible; margin-bottom: 8px; }
.gd-author > div { min-width: 0; flex: 1; }
.gd-author-logo { display: flex; align-items: center; justify-content: center; white-space: nowrap; letter-spacing: -.02em; }
.gd-author-logo span { display: inline; }
.gd-article ul { margin: 0 0 1.1em; }
.gd-article li::marker { color: var(--gold); }

/* Language picker lives in the footer (28 Sep 2026) */
.foot-contact .pick-up { position: relative; }
.foot-contact .pick-up > summary { padding: 6px 14px; border-radius: 999px; border: 1px solid var(--line-strong); background: #fff; font-weight: 600; cursor: pointer; }
.foot-contact .pick-up .pick-panel { top: auto; bottom: calc(100% + 8px); }
@media (max-width: 760px) { .foot-contact .pick-up .pick-panel { position: absolute; inset-inline: auto; inset-inline-start: 0; top: auto; bottom: calc(100% + 8px); } }

.foot-contact .foot-cur-label { margin-inline-end: -8px; }

/* Profile builder hub (28 Sep 2026) */
.ob-page { padding: clamp(24px, 4vw, 44px) 0 clamp(48px, 6vw, 80px); }
.ob-hero { display: grid; gap: 28px; align-items: center; padding: clamp(24px, 4vw, 40px); border-radius: 26px; background: linear-gradient(135deg, #FDF1F3 0%, #FBE7EB 100%); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.ob-hero h1 { margin: 6px 0 10px; font-size: clamp(1.7rem, 3.4vw, 2.5rem); line-height: 1.15; color: var(--emerald-deep); }
.ob-lede { margin: 0; max-width: 58ch; font-size: 1.05rem; line-height: 1.65; color: var(--ink-soft); }
.ob-actions { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: center; margin-top: 22px; }
.ob-actions form { margin: 0; }
.ob-progress { display: grid; justify-items: center; gap: 10px; position: relative; }
.ob-ring { width: 150px; height: 150px; transform: rotate(-90deg); }
.ob-ring circle { fill: none; stroke-width: 9; }
.ob-ring-bg { stroke: #fff; }
.ob-ring-fg { stroke: var(--emerald); stroke-linecap: round; transition: stroke-dashoffset .8s ease; }
.ob-ring-text { position: absolute; top: 0; height: 150px; display: grid; place-content: center; text-align: center; }
.ob-ring-text strong { font-family: var(--serif); font-size: 2.1rem; line-height: 1; color: var(--emerald-deep); }
.ob-ring-text span { font-size: .8rem; color: var(--ink-muted); text-transform: uppercase; letter-spacing: .08em; }
.ob-progress-note { margin: 0; text-align: center; font-weight: 600; color: var(--ink); font-size: .95rem; }
.ob-progress-note span { font-weight: 400; font-size: .85rem; color: var(--ink-muted); }
.ob-journey { list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 200px), 1fr)); gap: 10px; margin: 20px 0 0; padding: 0; }
.ob-journey li { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--line); font-size: .9rem; color: var(--ink-soft); }
.ob-journey b { flex: none; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: #FBE7EB; color: #7d0d24; font-size: .85rem; }
.ob-journey li.on { border-color: var(--emerald); color: var(--ink); font-weight: 600; }
.ob-journey li.on b { background: var(--emerald); color: #fff; }
.ob-layout { display: grid; gap: 28px; margin-top: 34px; }
.ob-h2 { font-size: 1.35rem; margin: 0 0 14px; color: var(--emerald-deep); }
.ob-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 330px), 1fr)); }
.ob-card { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 18px; background: #fff; border: 1px solid var(--line); color: inherit; box-shadow: var(--shadow-sm); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.ob-card:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.ob-card.is-next { border-color: var(--emerald); box-shadow: 0 0 0 3px rgba(179, 18, 46, .08), var(--shadow-sm); }
.ob-icon { flex: none; display: grid; place-items: center; width: 46px; height: 46px; border-radius: 14px; background: #FDF1F3; color: #b07a4f; }
.ob-icon svg { width: 22px; height: 22px; }
.ob-card.is-done .ob-icon { background: #eef7f0; color: #2f7a4a; }
.ob-card-body { flex: 1; min-width: 0; display: grid; gap: 2px; }
.ob-num { font-size: .7rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--gold); }
.ob-card strong { font-family: var(--serif); font-size: 1.08rem; color: var(--ink); }
.ob-hint, .ob-left { font-size: .86rem; color: var(--ink-muted); line-height: 1.45; }
.ob-left { color: #9a5b1c; }
.ob-chip { flex: none; align-self: flex-start; padding: 4px 10px; border-radius: 999px; font-size: .74rem; font-weight: 700; white-space: nowrap; background: #f3f1ec; color: var(--ink-muted); }
.ob-card.is-part .ob-chip { background: #fff4e5; color: #9a5b1c; }
.ob-card.is-done .ob-chip { background: #eef7f0; color: #2f7a4a; }
.ob-side { display: grid; gap: 16px; align-content: start; }
.ob-trust, .ob-tips { padding: 20px 22px; border-radius: 20px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.ob-trust h3 { margin: 4px 0 10px; font-size: 1.15rem; }
.ob-side ul { list-style: none; margin: 0 0 14px; padding: 0; display: grid; gap: 9px; }
.ob-side li { position: relative; padding-inline-start: 22px; font-size: .9rem; line-height: 1.5; color: var(--ink-soft); }
.ob-side li::before { content: "✓"; position: absolute; inset-inline-start: 0; color: var(--gold); font-weight: 700; }
.ob-tips li::before { content: "•"; }
.ob-tips a { font-weight: 600; font-size: .9rem; }
@media (min-width: 900px) {
    .ob-hero { grid-template-columns: minmax(0, 1fr) 240px; gap: 40px; }
    .ob-layout { grid-template-columns: minmax(0, 1fr) 320px; gap: 36px; }
    .ob-side { position: sticky; top: 20px; }
}

/* Member dashboard (28 Sep 2026) */
.db-page { padding: clamp(24px, 4vw, 44px) 0 clamp(48px, 6vw, 80px); }
.db-hero { display: grid; gap: 28px; align-items: center; padding: clamp(24px, 4vw, 40px); border-radius: 26px; background: linear-gradient(135deg, #FDF1F3 0%, #FBE7EB 100%); border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.db-hero.is-bad { background: linear-gradient(135deg, #fff4f2, #fde8e4); }
.db-hero h1 { margin: 6px 0 10px; font-size: clamp(1.7rem, 3.4vw, 2.5rem); line-height: 1.15; color: var(--emerald-deep); }
.db-lede { margin: 0; max-width: 58ch; font-size: 1.05rem; line-height: 1.65; color: var(--ink-soft); }
.db-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 22px; }
.db-stats { display: grid; gap: 12px; margin-top: 18px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); }
.db-stat { display: flex; align-items: center; gap: 14px; padding: 16px 18px; border-radius: 18px; background: #fff; border: 1px solid var(--line); color: inherit; box-shadow: var(--shadow-sm); transition: transform .18s ease, box-shadow .18s ease; }
.db-stat:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow); }
.db-stat b { display: block; font-family: var(--serif); font-size: 1.7rem; line-height: 1.1; color: var(--ink); }
.db-stat small { font-size: .84rem; color: var(--ink-muted); }
.db-stat.has-new { border-color: var(--emerald); }
.db-stat.has-new b { color: var(--emerald); }
.db-ico { flex: none; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 14px; background: #FDF1F3; color: #b07a4f; }
.db-ico svg { width: 22px; height: 22px; }
.db-layout { display: grid; gap: 28px; margin-top: 28px; }
.db-col { min-width: 0; }
.db-card { padding: 22px 24px; border-radius: 20px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.db-card-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 10px; }
.db-card-head h2 { margin: 0; font-size: 1.25rem; color: var(--emerald-deep); }
.db-missing { margin: .6rem 0 0; font-size: .88rem; color: #9a5b1c; }
.db-btns { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.db-h2 { font-size: 1.2rem; margin: 28px 0 12px; color: var(--emerald-deep); }
.db-tiles { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.db-tile { display: grid; gap: 6px; align-content: start; padding: 18px; border-radius: 18px; background: #fff; border: 1px solid var(--line); color: inherit; box-shadow: var(--shadow-sm); transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease; }
.db-tile:hover { text-decoration: none; transform: translateY(-2px); box-shadow: var(--shadow); border-color: var(--line-strong); }
.db-tile .db-ico { margin-bottom: 4px; }
.db-tile strong { font-family: var(--serif); font-size: 1.05rem; color: var(--ink); }
.db-tile > span:last-child { font-size: .87rem; line-height: 1.5; color: var(--ink-muted); }
.db-side { display: grid; gap: 16px; align-content: start; }
.db-count { font-weight: 700; color: var(--gold); }
.db-check { list-style: none; margin: 0; padding: 0; display: grid; gap: 4px; }
.db-check a { display: flex; align-items: center; gap: 10px; padding: 10px 8px; border-radius: 12px; color: var(--ink); font-size: .93rem; }
.db-check a:hover { text-decoration: none; background: #FDF1F3; }
.db-check span:nth-child(2) { flex: 1; }
.db-check em { font-style: normal; font-size: .8rem; font-weight: 700; color: var(--emerald); white-space: nowrap; }
.db-check .is-done em { color: #2f7a4a; }
.db-tick { flex: none; display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; border: 1.5px solid var(--line-strong); font-size: .75rem; font-weight: 700; }
.db-check .is-done .db-tick { background: #2f7a4a; border-color: #2f7a4a; color: #fff; }
.db-check .is-done span:nth-child(2) { color: var(--ink-muted); }
.db-quick { display: grid; gap: 2px; }
.db-quick a { display: flex; align-items: center; gap: 10px; padding: 9px 8px; border-radius: 10px; color: var(--ink); font-size: .92rem; }
.db-quick a:hover { text-decoration: none; background: #FDF1F3; }
.db-quick svg { width: 18px; height: 18px; color: #b07a4f; }
@media (min-width: 900px) {
    .db-hero { grid-template-columns: minmax(0, 1fr) 220px; gap: 40px; }
    .db-layout { grid-template-columns: minmax(0, 1fr) 330px; gap: 32px; }
    .db-side { position: sticky; top: 20px; }
}

/* Messages inbox polish (28 Sep 2026) */
.msg-hero { padding: clamp(20px, 3vw, 28px) clamp(20px, 3vw, 30px); border-radius: 22px; background: linear-gradient(135deg, #FDF1F3 0%, #FBE7EB 100%); border: 1px solid var(--line); margin-bottom: 16px; align-items: center; }
.msg-hero .eyebrow { margin: 0 0 4px; }
.msg-hero h1 { color: var(--emerald-deep); }
.msg-head-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.msg-empty { padding: clamp(32px, 5vw, 56px) clamp(20px, 4vw, 44px); text-align: center; }
.msg-empty-icon { display: inline-grid; place-items: center; width: 68px; height: 68px; border-radius: 22px; background: #FDF1F3; color: #b07a4f; margin-bottom: 14px; }
.msg-empty-icon svg { width: 32px; height: 32px; }
.msg-empty h2 { margin: 0 0 8px; font-size: 1.5rem; color: var(--emerald-deep); }
.msg-empty > p { max-width: 52ch; margin: 0 auto; line-height: 1.65; }
.msg-steps { list-style: none; padding: 0; margin: 26px auto 0; max-width: 820px; display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 220px), 1fr)); text-align: start; }
.msg-steps li { display: grid; grid-template-columns: auto 1fr; gap: 2px 12px; padding: 14px 16px; border-radius: 16px; background: #fbf8f6; border: 1px solid var(--line); }
.msg-steps b { grid-row: span 2; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #FBE7EB; color: #7d0d24; font-size: .9rem; }
.msg-steps strong { font-size: .95rem; color: var(--ink); }
.msg-steps span { font-size: .85rem; line-height: 1.45; color: var(--ink-muted); }
.msg-empty-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: center; margin-top: 24px; }
.msg-trust { list-style: none; padding: 0; margin: 16px 0 0; display: grid; gap: 10px; grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.msg-trust li { display: flex; gap: 8px; align-items: flex-start; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid var(--line); font-size: .86rem; line-height: 1.45; color: var(--ink-soft); }

.msg-trust { grid-template-columns: repeat(2, minmax(0, 1fr)); }
@media (min-width: 900px) { .msg-trust { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
@media (max-width: 520px) { .msg-trust { grid-template-columns: 1fr; } }
.msg-trust li { align-items: center; }
.msg-trust-ico { flex: none; display: grid; place-items: center; width: 32px; height: 32px; border-radius: 10px; background: #FDF1F3; color: #b07a4f; }
.msg-trust-ico svg { width: 17px; height: 17px; }

.gd-article ol { padding-left: 1.4rem; margin: 0 0 1.1em; }
.gd-article ol li { margin-bottom: .55rem; }
.gd-article ol li::marker { color: var(--gold); font-weight: 700; }
.gd-article a { color: var(--emerald); text-decoration: underline; text-decoration-color: rgba(179,18,46,.3); text-underline-offset: 3px; }
.gd-article a:hover { text-decoration-color: currentColor; }

/* Related reading (28 Sep 2026) */
.rr { margin-top: 36px; margin-bottom: 36px; padding: 20px 22px; border-radius: 18px; background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow-sm); }
.rr .eyebrow { margin: 0 0 10px; }
.rr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px 24px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 280px), 1fr)); }
.rr-list li { position: relative; padding-inline-start: 18px; font-size: .95rem; line-height: 1.45; }
.rr-list li::before { content: "→"; position: absolute; inset-inline-start: 0; color: var(--gold); }
.rr-list li.rr-ext::before { content: "↗"; }
.rr-list a { color: var(--emerald-dark, var(--emerald)); font-weight: 600; }

/* Local landing pages (28 Sep 2026) */
.lp-hero { background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border-bottom: 1px solid var(--line); padding: clamp(24px, 4vw, 48px) 0 clamp(28px, 5vw, 56px); }
.lp-crumbs { font-size: .84rem; color: var(--ink-muted); margin-bottom: 18px; }
.lp-crumbs a { color: var(--emerald); }
.lp-hero .eyebrow { margin: 0 0 6px; }
.lp-hero h1 { margin: 0 0 14px; font-size: clamp(2rem, 4.4vw, 3.1rem); line-height: 1.1; color: var(--emerald-deep); max-width: 22ch; }
.lp-lede { font-size: 1.12rem; line-height: 1.7; color: var(--ink); max-width: 68ch; margin: 0 0 10px; }
.lp-sub { font-size: 1rem; line-height: 1.7; color: var(--ink-soft); max-width: 68ch; margin: 0; }
.lp-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.lp-trust { list-style: none; display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 0; margin: 20px 0 0; font-size: .88rem; color: var(--ink-soft); }
.lp-trust li::before { content: "✓ "; color: var(--gold); font-weight: 700; }
.lp-article h2 { font-size: 1.4rem; }
.lp-faq { display: grid; gap: 10px; }
.lp-faq details { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 4px 18px; }
.lp-faq summary { cursor: pointer; padding: 12px 0; font-weight: 600; color: var(--ink); list-style: none; position: relative; padding-inline-end: 26px; }
.lp-faq summary::-webkit-details-marker { display: none; }
.lp-faq summary::after { content: "+"; position: absolute; inset-inline-end: 0; top: 10px; font-size: 1.2rem; color: var(--gold); }
.lp-faq details[open] summary::after { content: "−"; }
.lp-faq details p { margin: 0 0 14px; }
.lp-related { padding-bottom: 12px; }
.lp-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.lp-chips a { padding: 8px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--line-strong); color: var(--ink-soft); font-size: .9rem; font-weight: 600; }
.lp-chips a:hover { text-decoration: none; border-color: var(--emerald); color: var(--emerald); }

/* Analytics consent bar (28 Sep 2026) */
.rd-consent { position: fixed; inset-inline: 16px; bottom: 16px; z-index: 80; max-width: 560px; margin-inline: auto; display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; padding: 14px 18px; background: #fff; border: 1px solid var(--line-strong); border-radius: 16px; box-shadow: var(--shadow-lg); font-size: .9rem; }
.rd-consent p { margin: 0; flex: 1 1 260px; color: var(--ink-soft); line-height: 1.5; }
.rd-consent div { display: flex; gap: 8px; }
.rd-consent[hidden] { display: none; }

/* ===== Header & footer v3 (29 Sep 2026) ===== */
/* Header: frosted, sticky, refined nav with an animated underline */
.site-header { position: sticky; top: 0; z-index: 60; background: rgba(255,255,255,.86) !important; -webkit-backdrop-filter: saturate(160%) blur(14px); backdrop-filter: saturate(160%) blur(14px); border-bottom: 1px solid rgba(179,18,46,.08) !important; box-shadow: 0 1px 0 rgba(255,255,255,.6), 0 6px 24px -18px rgba(78,7,22,.35); }
.site-header .bar { min-height: 72px; }
.site-header .brand { font-size: 1.62rem; letter-spacing: -.01em; }
.site-nav { gap: 6px !important; }
.site-nav > a:not(.btn) { position: relative; padding: 9px 13px; border-radius: 10px; color: #3b3f47; font-weight: 500; transition: color .18s ease, background .18s ease; }
.site-nav > a:not(.btn)::after { content: ""; position: absolute; left: 13px; right: 13px; bottom: 4px; height: 2px; border-radius: 2px; background: linear-gradient(90deg, #B3122E, #B07A4F); transform: scaleX(0); transform-origin: left; transition: transform .22s ease; }
.site-nav > a:not(.btn):hover { color: #7d0d24; background: #FDF1F3; text-decoration: none; }
.site-nav > a:not(.btn):hover::after, .site-nav > a.active::after { transform: scaleX(1); }
.site-nav > a.active { color: #7d0d24 !important; font-weight: 600; }
.site-nav > a[href$="/login"] { margin-inline-start: 6px; padding: 9px 16px; border: 1px solid #e8d3d8; background: #fff; }
.site-nav > a[href$="/login"]::after { display: none; }
.site-nav > a.btn { margin-inline-start: 6px; padding: 10px 20px; border-radius: 999px; font-weight: 600; box-shadow: 0 8px 20px -10px rgba(179,18,46,.7); }
.site-nav .nav-menu > summary { padding: 9px 16px; border-radius: 999px; border: 1px solid #e8d3d8; background: #fff; }
@media (max-width: 760px) {
  .site-header .bar { min-height: 60px; }
  .site-header .brand { font-size: 1.4rem; }
  .site-nav > a:not(.btn) { padding: 7px 9px; }
  .site-nav > a:not(.btn)::after { left: 9px; right: 9px; }
}

/* Footer */
.site-footer.ft { background: linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%) !important; color: #5b5f68 !important; border-top: 1px solid #f1dde2; padding: clamp(48px, 6vw, 76px) 0 26px !important; }
.ft .ft-top { display: grid; gap: clamp(32px, 5vw, 64px); grid-template-columns: 1fr; }
@media (min-width: 980px) { .ft .ft-top { grid-template-columns: minmax(0, 330px) minmax(0, 1fr); } }
.ft .brand { font-size: 1.7rem; color: #1c1f24 !important; }
.ft .brand:hover { text-decoration: none; }
.ft .ft-tag { margin: 12px 0 16px; max-width: 34ch; font-size: .95rem; line-height: 1.6; color: #4a4e57; }
.ft .ft-trust { list-style: none; padding: 0; margin: 0 0 18px; display: grid; gap: 7px; font-size: .86rem; color: #5b5f68; }
.ft .ft-trust li::before { content: "✓"; display: inline-grid; place-items: center; width: 18px; height: 18px; margin-inline-end: 9px; border-radius: 50%; background: #fff; color: #B07A4F; font-size: .7rem; font-weight: 700; border: 1px solid #ecd9c9; }
.ft .ft-cta { margin-bottom: 22px; }
.ft .ft-parent { display: flex; align-items: center; gap: 12px; max-width: 330px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #efdbe0; color: inherit !important; box-shadow: 0 6px 18px -14px rgba(78,7,22,.45); transition: border-color .18s ease, transform .18s ease; }
.ft .ft-parent:hover { text-decoration: none; border-color: #d9aeb8; transform: translateY(-1px); }
.ft .ft-parent-mark { flex: none; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; background: linear-gradient(135deg, #7d0d24, #B3122E); color: #fff; font-family: var(--serif); font-weight: 700; font-size: 1.15rem; }
.ft .ft-parent-text { flex: 1; min-width: 0; display: grid; line-height: 1.3; }
.ft .ft-parent-text small { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: #B07A4F; font-weight: 700; }
.ft .ft-parent-text strong { font-size: .98rem; color: #7d0d24; }
.ft .ft-parent-text span { font-size: .8rem; color: #6b6f78; }
.ft .ft-parent-go { flex: none; color: #B3122E; font-weight: 700; }
.ft .ft-cols { display: grid; gap: 28px 24px; grid-template-columns: repeat(2, minmax(0, 1fr)); align-content: start; }
@media (min-width: 720px) { .ft .ft-cols { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.ft .ft-cols h4 { margin: 0 0 14px !important; font-size: .74rem !important; letter-spacing: .14em; text-transform: uppercase; color: #B07A4F !important; font-weight: 700; }
.ft .ft-cols a { display: block; padding: 5px 0; font-size: .93rem; color: #3b3f47 !important; transition: color .15s ease, transform .15s ease; }
.ft .ft-cols a:hover { color: #B3122E !important; transform: translateX(3px); text-decoration: none; }
.ft .ft-contact { display: flex; flex-wrap: wrap; gap: 16px 28px; align-items: center; justify-content: space-between; margin-top: clamp(34px, 4vw, 48px); padding: 16px 22px; border-radius: 16px; background: rgba(255,255,255,.75); border: 1px solid #efdbe0; }
.ft .ft-contact-items { display: flex; flex-wrap: wrap; gap: 12px 30px; }
.ft .ft-contact-items > span { display: grid; gap: 1px; font-size: .9rem; }
.ft .ft-contact-items small { font-size: .68rem; letter-spacing: .12em; text-transform: uppercase; color: #9a8f86; font-weight: 700; }
.ft .ft-contact-items a { color: #7d0d24 !important; font-weight: 500; }
.ft .ft-contact-items address { font-style: normal; color: #3b3f47; max-width: 42ch; }
.ft .ft-picks { display: flex; gap: 8px; align-items: center; }
.ft .ft-picks .pick > summary { padding: 7px 14px; border-radius: 999px; border: 1px solid #e8d3d8; background: #fff; font-weight: 600; font-size: .88rem; color: #3b3f47; cursor: pointer; }
.ft .ft-picks .pick-panel { top: auto; bottom: calc(100% + 8px); }
.ft .ft-legal { display: flex; flex-wrap: wrap; gap: 8px 20px; justify-content: space-between; align-items: center; margin-top: 22px; padding-top: 18px; border-top: 1px solid #efd9de; font-size: .82rem; color: #7a7e86; }
.ft .ft-legal-links { display: flex; gap: 18px; }
.ft .ft-legal-links a { color: #7a7e86 !important; }
.ft .ft-legal-links a:hover { color: #B3122E !important; }
@media (max-width: 760px) {
  .ft .ft-contact { padding: 14px 16px; }
  .ft .ft-picks .pick-panel { position: absolute; inset-inline: auto; inset-inline-end: 0; top: auto; bottom: calc(100% + 8px); }
  .ft .ft-legal { justify-content: center; text-align: center; }
}

.ft .ft-right { display: grid; gap: 30px; align-content: start; }
.ft .ft-right .ft-parent { justify-self: end; width: 100%; max-width: 360px; }
@media (max-width: 719px) { .ft .ft-right .ft-parent { justify-self: stretch; max-width: none; } }
.site-footer.ft a.ft-cta, .site-footer.ft a.ft-cta:hover { color: #fff !important; }

/* Footer newsletter card — same box as the Arbsbuy Pakistan card */
.ft .ft-right .ft-news, .ft .ft-right .ft-parent { justify-self: end; width: 100%; max-width: 360px; box-sizing: border-box; min-height: 92px; }
.ft .ft-right .ft-news + .ft-parent { margin-top: -18px; }
.ft .ft-news { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 14px; background: #fff; border: 1px solid #efdbe0; box-shadow: 0 6px 18px -14px rgba(78,7,22,.45); }
.ft .ft-news-mark { background: linear-gradient(135deg, #B07A4F, #8f5c36) !important; }
.ft .ft-news-mark svg { width: 20px; height: 20px; }
.ft .ft-news-body { flex: 1; min-width: 0; display: grid; gap: 3px; }
.ft .ft-news-body small { font-size: .66rem; letter-spacing: .12em; text-transform: uppercase; color: #B07A4F; font-weight: 700; }
.ft .ft-news-title { font-size: .9rem; font-weight: 600; color: #7d0d24; }
.ft .ft-news-row { display: flex; gap: 6px; }
.ft .ft-news-row input[type=email] { flex: 1; min-width: 0; padding: 7px 10px; border-radius: 9px; border: 1px solid #e8d3d8; font: inherit; font-size: .84rem; background: #fdf9fa; }
.ft .ft-news-row input[type=email]:focus { outline: 2px solid rgba(179,18,46,.25); border-color: #B3122E; background: #fff; }
.ft .ft-news-row button { flex: none; padding: 7px 14px; border: 0; border-radius: 9px; background: linear-gradient(135deg, #B3122E, #7d0d24); color: #fff; font: inherit; font-size: .84rem; font-weight: 600; cursor: pointer; }
.ft .ft-news-row button:hover { filter: brightness(1.08); }
.ft .ft-hp { position: absolute !important; left: -9999px !important; width: 1px; height: 1px; opacity: 0; }
@media (max-width: 719px) { .ft .ft-right .ft-news, .ft .ft-right .ft-parent { justify-self: stretch; max-width: none; } }

/* Live assistant v2 — blush brand, logo avatar, online light (29 Sep 2026) */
#rd-assistant-toggle { display: inline-flex !important; align-items: center; gap: 10px; padding: 7px 18px 7px 7px !important; border-radius: 999px !important; background: linear-gradient(135deg, #B3122E, #7d0d24) !important; color: #fff !important; font-weight: 600; box-shadow: 0 14px 30px -12px rgba(125,13,36,.6) !important; border: 0; }
#rd-assistant .rd-av { position: relative; flex: none; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 50%; background: #fff; color: #7d0d24; font-family: var(--serif); font-weight: 700; font-size: .92rem; letter-spacing: -.02em; box-shadow: inset 0 0 0 1px #f0d9de; }
#rd-assistant .rd-av > span { color: #B07A4F; }
#rd-assistant .rd-av-lg { width: 44px; height: 44px; font-size: 1.1rem; box-shadow: 0 4px 12px -6px rgba(125,13,36,.45), inset 0 0 0 1px #f0d9de; }
#rd-assistant .rd-dot { position: absolute; right: -1px; bottom: -1px; width: 11px; height: 11px; border-radius: 50%; background: #22c55e; border: 2px solid #fff; }
#rd-assistant .rd-av-lg .rd-dot { width: 13px; height: 13px; }
#rd-assistant .rd-dot::after { content: ""; position: absolute; inset: -2px; border-radius: 50%; border: 2px solid #22c55e; opacity: .6; animation: rdPulse 2s ease-out infinite; }
@keyframes rdPulse { 0% { transform: scale(.8); opacity: .7; } 100% { transform: scale(2); opacity: 0; } }
@media (prefers-reduced-motion: reduce) { #rd-assistant .rd-dot::after { animation: none; } }
#rd-assistant-panel { border-radius: 22px !important; border: 1px solid #efdbe0 !important; box-shadow: 0 30px 70px -28px rgba(78,7,22,.45) !important; overflow: hidden; }
#rd-assistant-panel header { display: flex !important; align-items: center; gap: 12px; padding: 16px 18px !important; background: linear-gradient(135deg, #FDF1F3 0%, #FBE7EB 100%) !important; border-bottom: 1px solid #f1dde2; }
#rd-assistant-panel .rd-head-text { flex: 1; min-width: 0; display: grid; gap: 2px; }
#rd-assistant-panel header strong { color: #1c1f24 !important; font-family: var(--serif); font-size: 1.05rem; }
#rd-assistant-panel .rd-status { display: inline-flex; align-items: center; gap: 6px; font-size: .78rem !important; color: #3f7a4e !important; font-weight: 600; }
#rd-assistant-panel .rd-status i { width: 7px; height: 7px; border-radius: 50%; background: #22c55e; }
#rd-assistant-close { width: 34px; height: 34px; border-radius: 50%; border: 1px solid #ecd6db !important; background: #fff !important; color: #7d0d24 !important; font-size: 1.25rem; line-height: 1; display: grid; place-items: center; cursor: pointer; }
#rd-assistant-close:hover { background: #FDF1F3 !important; }
#rd-assistant-log { background: #fffafb !important; }
#rd-assistant .rd-msg.rd-bot p, #rd-assistant .rd-bot { border-color: #f0dde2 !important; }
#rd-assistant .rd-chips button { border-color: #ecd0d7 !important; color: #7d0d24 !important; background: #fff !important; }
#rd-assistant .rd-chips button:hover { background: #FDF1F3 !important; border-color: #B3122E !important; }
#rd-assistant-form input { border-radius: 999px !important; border: 1px solid #ecd6db !important; padding: .62rem 1rem !important; }
#rd-assistant-form input:focus { outline: 2px solid rgba(179,18,46,.2); border-color: #B3122E !important; }
#rd-assistant-send { border-radius: 999px !important; }

/* Footer cards side by side, equal size (newsletter first) */
.ft .ft-cards { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: stretch; }
.ft .ft-right .ft-cards .ft-news, .ft .ft-right .ft-cards .ft-parent { justify-self: stretch; max-width: none; width: auto; min-height: 96px; margin: 0; }
.ft .ft-right .ft-news + .ft-parent { margin-top: 0; }
@media (max-width: 719px) { .ft .ft-cards { grid-template-columns: 1fr; } }

/* Assistant fixes: one-line monogram, toggle hidden while open */
#rd-assistant .rd-av { display: inline-flex !important; align-items: center; justify-content: center; white-space: nowrap; }
#rd-assistant.is-open #rd-assistant-toggle { display: none !important; }

/* ===== Directory: /find-rishta-by-city (29 Sep 2026) ===== */
.dir-hero { background: radial-gradient(1200px 400px at 85% -10%, rgba(176,122,79,.14), transparent 60%), linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border-bottom: 1px solid #f1dde2; padding: clamp(36px, 6vw, 72px) 0 clamp(32px, 5vw, 56px); }
.dir-hero-in { max-width: 860px; text-align: center; }
.dir-hero .eyebrow { margin: 0 0 8px; }
.dir-hero h1 { margin: 0 0 14px; font-size: clamp(2.1rem, 5vw, 3.4rem); line-height: 1.08; color: #3b0a16; }
.dir-lede { margin: 0 auto 26px; max-width: 64ch; font-size: 1.08rem; line-height: 1.7; color: #4a4e57; }
.dir-search { display: flex; align-items: center; gap: 10px; max-width: 560px; margin: 0 auto; padding: 6px 8px 6px 18px; border-radius: 999px; background: #fff; border: 1px solid #ecd6db; box-shadow: 0 18px 40px -26px rgba(78,7,22,.5); }
.dir-search svg { width: 20px; height: 20px; color: #B07A4F; flex: none; }
.dir-search input { flex: 1; min-width: 0; border: 0 !important; background: transparent; padding: 12px 6px !important; font: inherit; font-size: 1rem; box-shadow: none !important; outline: none; }
.dir-jump { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 18px; }
.dir-jump a { padding: 6px 14px; border-radius: 999px; background: rgba(255,255,255,.8); border: 1px solid #ecd6db; color: #7d0d24; font-size: .86rem; font-weight: 600; }
.dir-jump a:hover { text-decoration: none; background: #fff; border-color: #B3122E; }
.dir-body { padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(40px, 6vw, 72px); }
.dir-none { padding: 14px 18px; border-radius: 14px; background: #fff8ef; border: 1px solid #f0dcc4; }
.dir-sec { margin-bottom: clamp(36px, 5vw, 60px); }
.dir-head { margin-bottom: 18px; }
.dir-head h2 { margin: 0 0 4px; font-size: clamp(1.5rem, 3vw, 2rem); color: #3b0a16; }
.dir-head p { margin: 0; color: #6b6f78; }
.dir-group { margin-bottom: 26px; }
.dir-group[hidden] { display: none; }
.dir-group-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 8px; border-bottom: 1px solid #f1dde2; }
.dir-group-head h3 { margin: 0; font-size: 1.1rem; color: #1c1f24; }
.dir-group-head a { font-size: .88rem; font-weight: 600; color: #B3122E; }
.dir-grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 230px), 1fr)); }
.dir-grid-hubs { grid-template-columns: repeat(auto-fit, minmax(min(100%, 300px), 1fr)); }
.dir-card { position: relative; display: flex; flex-direction: column; overflow: hidden; border-radius: 18px; background: #fff; border: 1px solid #f0dde2; color: inherit; box-shadow: 0 10px 28px -24px rgba(78,7,22,.55); transition: transform .2s ease, box-shadow .2s ease, border-color .2s ease; }
.dir-card:hover { text-decoration: none; transform: translateY(-3px); border-color: #e2bcc5; box-shadow: 0 22px 40px -26px rgba(78,7,22,.6); }
.dir-card[hidden] { display: none; }
.dir-card-img { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #FBE7EB; }
.dir-card-img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .5s ease; }
.dir-card:hover .dir-card-img img { transform: scale(1.04); }
.dir-card-mono { display: grid; place-items: center; height: 72px; background: linear-gradient(135deg, #FDF1F3, #FBE7EB); color: #B07A4F; font-family: var(--serif); font-size: 1.8rem; font-weight: 700; }
.dir-card-body { display: grid; gap: 3px; padding: 14px 16px 16px; padding-inline-end: 42px; }
.dir-card-body strong { font-family: var(--serif); font-size: 1.12rem; color: #1c1f24; }
.dir-card-body small { font-size: .84rem; color: #6b6f78; line-height: 1.45; }
.dir-card-go { position: absolute; right: 14px; bottom: 16px; width: 26px; height: 26px; display: grid; place-items: center; border-radius: 50%; background: #FDF1F3; color: #B3122E; font-weight: 700; font-size: .85rem; transition: background .2s ease, color .2s ease; }
.dir-card:hover .dir-card-go { background: #B3122E; color: #fff; }
.dir-card.is-big .dir-card-body strong { font-size: 1.28rem; }
.dir-chips { display: flex; flex-wrap: wrap; gap: 8px; }
.dir-chips a { padding: 8px 16px; border-radius: 999px; background: #fff; border: 1px solid #ecd6db; color: #3b3f47; font-family: 'Noto Nastaliq Urdu', var(--sans); line-height: 1.9; }
.dir-chips a:hover { text-decoration: none; border-color: #B3122E; color: #B3122E; }
.dir-chips a[hidden] { display: none; }
.dir-about { display: grid; gap: 28px; padding: clamp(22px, 4vw, 36px); border-radius: 22px; background: #fff; border: 1px solid #f0dde2; }
@media (min-width: 900px) { .dir-about { grid-template-columns: 1.2fr 1fr; gap: 44px; } }
.dir-about h2 { margin: 0 0 12px; font-size: 1.4rem; color: #3b0a16; }
.dir-about p { line-height: 1.75; color: #4a4e57; }
.dir-faq details { border-bottom: 1px solid #f1dde2; padding: 10px 0; }
.dir-faq summary { cursor: pointer; font-weight: 600; color: #1c1f24; }
.dir-faq details p { margin: 8px 0 4px; }

/* Local landing pages v2 — hero visual without frames (29 Sep 2026) */
.lp-hero { position: relative; overflow: hidden; background: radial-gradient(900px 380px at 90% 0%, rgba(176,122,79,.13), transparent 60%), linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%) !important; }
.lp-hero-grid { display: grid; gap: 24px; align-items: center; }
@media (min-width: 960px) { .lp-hero.has-visual .lp-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); gap: 40px; } }
.lp-hero h1 { color: #3b0a16 !important; letter-spacing: -.01em; }
.lp-visual { position: relative; min-height: 300px; }
@media (min-width: 960px) { .lp-visual { min-height: 440px; } }
.lp-visual-bg { position: absolute; inset: 0 -12% 0 0; display: block; }
.lp-visual-bg img { width: 100%; height: 100%; object-fit: cover; display: block;
  -webkit-mask-image: radial-gradient(120% 95% at 70% 45%, #000 42%, rgba(0,0,0,.55) 62%, transparent 80%);
          mask-image: radial-gradient(120% 95% at 70% 45%, #000 42%, rgba(0,0,0,.55) 62%, transparent 80%); }
.lp-visual-couple { position: absolute; right: 4%; bottom: -8px; width: min(62%, 330px); display: block; filter: drop-shadow(0 24px 30px rgba(78,7,22,.28)); }
.lp-visual-couple img { width: 100%; height: auto; display: block; }
.lp-visual:not(:has(.lp-visual-couple)) .lp-visual-bg { inset: 0 -12% 0 -4%; }
@media (max-width: 959px) {
  .lp-visual { margin: 4px -16px -8px; min-height: 260px; }
  .lp-visual-bg { inset: 0; }
  .lp-visual-couple { width: 46%; right: 6%; }
}
[dir="rtl"] .lp-visual-bg { inset: 0 0 0 -12%; }
[dir="rtl"] .lp-visual-couple { right: auto; left: 4%; }
.lp-subnav { padding-top: 16px; font-size: .9rem; }
.lp-subnav a { color: #B3122E; font-weight: 600; }
/* body polish */
.lp-article h2 { position: relative; padding-top: 1.1em !important; margin-top: 1.4em !important; border-top: 1px solid #f1dde2 !important; }
.lp-article h2:first-child { border-top: 0 !important; padding-top: 0 !important; margin-top: 0 !important; }
.lp-article ul { background: #fffafb; border: 1px solid #f3e3e7; border-radius: 16px; padding: 14px 18px 14px 34px; }
.lp-article li::marker { color: #B07A4F; }
.lp-faq details { transition: border-color .2s ease, box-shadow .2s ease; }
.lp-faq details[open] { border-color: #e2bcc5; box-shadow: 0 10px 24px -20px rgba(78,7,22,.5); }
.lp-chips a { transition: all .18s ease; }

/* ===== Directory v2 — premium (29 Sep 2026) ===== */
.dx-hero { position: relative; overflow: hidden; padding: clamp(40px, 6vw, 84px) 0 clamp(40px, 5vw, 64px); background: radial-gradient(1100px 520px at 100% 0%, rgba(176,122,79,.16), transparent 60%), radial-gradient(900px 500px at -10% 100%, rgba(179,18,46,.08), transparent 60%), linear-gradient(180deg, #FDF1F3 0%, #FBE7EB 100%); border-bottom: 1px solid #f1dde2; }
.dx-hero-grid { display: grid; gap: 40px; align-items: center; }
@media (min-width: 1000px) { .dx-hero-grid { grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 56px; } }
.dx-kicker { display: inline-flex; align-items: center; gap: 8px; margin: 0 0 16px; padding: 6px 14px; border-radius: 999px; background: #fff; border: 1px solid #efd6dc; color: #7d0d24; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.dx-kicker::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #B07A4F; }
.dx-hero h1 { margin: 0 0 16px; font-size: clamp(2.3rem, 5.2vw, 3.8rem); line-height: 1.04; letter-spacing: -.02em; color: #2a0710; }
.dx-lede { margin: 0 0 26px; max-width: 56ch; font-size: 1.1rem; line-height: 1.7; color: #4a4e57; }
.dx-search { display: flex; align-items: center; gap: 10px; max-width: 620px; padding: 8px 10px 8px 20px; border-radius: 18px; background: #fff; border: 1px solid #ecd6db; box-shadow: 0 24px 50px -30px rgba(78,7,22,.55), 0 2px 0 rgba(255,255,255,.8) inset; }
.dx-search:focus-within { border-color: #B3122E; box-shadow: 0 0 0 4px rgba(179,18,46,.1), 0 24px 50px -30px rgba(78,7,22,.55); }
.dx-search svg { width: 21px; height: 21px; color: #B07A4F; flex: none; }
.dx-search input { flex: 1; min-width: 0; border: 0 !important; background: transparent !important; padding: 14px 4px !important; font: inherit; font-size: 1.02rem; box-shadow: none !important; outline: none; }
.dx-search kbd { flex: none; padding: 3px 9px; border-radius: 7px; border: 1px solid #ead7dc; background: #fbf5f6; color: #9a8f86; font-size: .8rem; font-family: inherit; }
.dx-stats { list-style: none; display: flex; flex-wrap: wrap; gap: 10px 30px; padding: 0; margin: 26px 0 0; }
.dx-stats li { display: grid; }
.dx-stats strong { font-family: var(--serif); font-size: 1.9rem; line-height: 1; color: #7d0d24; }
.dx-stats span { margin-top: 4px; font-size: .82rem; color: #6b6f78; }
.dx-mosaic { position: relative; display: grid; grid-template-columns: 1.15fr 1fr; grid-template-rows: 1fr 1fr; gap: 14px; height: clamp(320px, 38vw, 470px); }
.dx-m { display: block; overflow: hidden; border-radius: 22px; box-shadow: 0 30px 60px -34px rgba(78,7,22,.6); }
.dx-m img { width: 100%; height: 100%; object-fit: cover; display: block; }
.dx-m1 { grid-row: 1 / span 2; }
.dx-m3, .dx-m4 { display: none; }
@media (min-width: 1000px) {
  .dx-mosaic { grid-template-columns: 1.1fr 1fr 1fr; }
  .dx-m1 { grid-column: 1; grid-row: 1 / span 2; }
  .dx-m2 { grid-column: 2 / span 2; }
  .dx-m3 { display: block; grid-column: 2; }
  .dx-m4 { display: block; grid-column: 3; }
}
@media (max-width: 640px) { .dx-mosaic { height: 240px; } }
/* sticky section tabs */
.dx-tabs { position: sticky; top: 72px; z-index: 40; background: rgba(255,255,255,.88); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); border-bottom: 1px solid #f1dde2; }
.dx-tabs-in { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; padding-top: 10px; padding-bottom: 10px; }
.dx-tabs-in::-webkit-scrollbar { display: none; }
.dx-tabs a { flex: none; padding: 8px 16px; border-radius: 999px; color: #3b3f47; font-weight: 600; font-size: .92rem; border: 1px solid transparent; transition: all .18s ease; }
.dx-tabs a:hover { text-decoration: none; background: #FDF1F3; color: #7d0d24; }
.dx-tabs a.on { background: #7d0d24; color: #fff; }
@media (max-width: 760px) { .dx-tabs { top: 60px; } }
.dx-body { padding-top: clamp(28px, 4vw, 48px); padding-bottom: clamp(40px, 6vw, 80px); }
.dx-sec { margin-bottom: clamp(44px, 6vw, 76px); scroll-margin-top: 150px; }
.dx-sec[hidden], .dx-prov[hidden] { display: none; }
.dx-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 8px 30px; margin-bottom: 22px; }
.dx-head h2 { margin: 0; font-size: clamp(1.6rem, 3.2vw, 2.3rem); letter-spacing: -.01em; color: #2a0710; }
.dx-head > p { margin: 0; max-width: 46ch; color: #6b6f78; }
.dx-eyebrow { margin: 0 0 6px; font-size: .74rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #B07A4F; }
.dx-feature { display: grid; gap: 18px; }
@media (min-width: 900px) { .dx-feature { grid-template-columns: 1.4fr 1fr 1fr; } }
.dx-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 250px), 1fr)); }
.dx-card { position: relative; display: block; overflow: hidden; border-radius: 22px; aspect-ratio: 4 / 3; color: #fff; background: #3b0a16; box-shadow: 0 18px 40px -30px rgba(40,4,12,.8); isolation: isolate; }
.dx-card.is-big { aspect-ratio: auto; min-height: 280px; }
@media (min-width: 900px) { .dx-feature .dx-card.is-big:first-child { min-height: 340px; } }
.dx-card:hover { text-decoration: none; color: #fff; }
.dx-card-img, .dx-card-img img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.dx-card-img img { object-fit: cover; transition: transform .7s cubic-bezier(.2,.7,.2,1); }
.dx-card:hover .dx-card-img img { transform: scale(1.06); }
.dx-card-shade { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(20,2,6,0) 35%, rgba(20,2,6,.35) 60%, rgba(20,2,6,.82) 100%); z-index: 1; }
.dx-card-text { position: absolute; left: 18px; right: 56px; bottom: 16px; z-index: 2; display: grid; gap: 2px; }
.dx-card-text small { font-size: .72rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: rgba(255,255,255,.78); }
.dx-card-text strong { font-family: var(--serif); font-size: 1.35rem; line-height: 1.15; text-shadow: 0 2px 12px rgba(0,0,0,.35); }
.dx-card.is-big .dx-card-text strong { font-size: clamp(1.5rem, 2.4vw, 2rem); }
.dx-card-text em { font-style: normal; font-size: .88rem; line-height: 1.45; color: rgba(255,255,255,.86); margin-top: 4px; }
.dx-card-go { position: absolute; right: 16px; bottom: 16px; z-index: 2; width: 34px; height: 34px; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.35); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); transition: background .2s ease, transform .2s ease; }
.dx-card:hover .dx-card-go { background: #fff; color: #7d0d24; transform: translateX(3px); }
.dx-card[hidden], .dx-tile[hidden] { display: none; }
.dx-tiles { display: grid; gap: 10px; margin-top: 14px; grid-template-columns: repeat(auto-fill, minmax(min(100%, 210px), 1fr)); }
.dx-tile { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 16px; background: #fff; border: 1px solid #f0dde2; color: inherit; transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease; }
.dx-tile:hover { text-decoration: none; border-color: #e2bcc5; transform: translateY(-2px); box-shadow: 0 14px 28px -22px rgba(78,7,22,.55); }
.dx-tile-mark { flex: none; display: grid; place-items: center; width: 38px; height: 38px; border-radius: 12px; background: linear-gradient(135deg, #FDF1F3, #F6DCE2); color: #7d0d24; font-family: var(--serif); font-weight: 700; }
.dx-tile-text { flex: 1; min-width: 0; display: grid; }
.dx-tile-text strong { font-size: .98rem; color: #1c1f24; }
.dx-tile-text small { font-size: .78rem; color: #8a8e96; }
.dx-tile-go { color: #B3122E; font-weight: 700; }
.dx-prov { margin-bottom: 30px; padding: 20px; border-radius: 24px; background: #fff; border: 1px solid #f3e3e7; box-shadow: 0 16px 40px -36px rgba(78,7,22,.5); }
.dx-prov-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.dx-prov-head h3 { margin: 0; font-size: 1.2rem; color: #1c1f24; display: flex; align-items: baseline; gap: 10px; }
.dx-prov-head h3 span { font-family: var(--sans); font-size: .8rem; font-weight: 600; color: #9a8f86; }
.dx-link { font-size: .9rem; font-weight: 600; color: #B3122E; white-space: nowrap; }
.dx-urdu .dir-chips a { font-size: 1rem; }
.dx-cta { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 30px; padding: clamp(26px, 4vw, 44px); border-radius: 28px; color: #fff; background: radial-gradient(700px 300px at 100% 0%, rgba(176,122,79,.45), transparent 60%), linear-gradient(135deg, #7d0d24 0%, #B3122E 100%); box-shadow: 0 30px 60px -36px rgba(78,7,22,.8); }
.dx-cta h2 { margin: 0 0 6px; color: #fff; font-size: clamp(1.5rem, 3vw, 2.1rem); }
.dx-cta p { margin: 0; color: rgba(255,255,255,.85); }
.dx-cta .btn-primary { background: #fff !important; color: #7d0d24 !important; }
.dx-cta .btn-ghost { color: #fff !important; border-color: rgba(255,255,255,.5) !important; background: transparent !important; }

/* Directory: card titles always legible on photos */
.dx-card, .dx-card:hover, .dx-card:visited { color: #fff !important; }
.dx-card .dx-card-text strong, .dx-card .dx-card-text small, .dx-card .dx-card-text em { color: #fff !important; }
.dx-card .dx-card-text small { opacity: .85; }
.dx-card .dx-card-text strong { text-shadow: 0 2px 14px rgba(0,0,0,.55), 0 1px 2px rgba(0,0,0,.4); }
.dx-card .dx-card-shade { background: linear-gradient(180deg, rgba(20,2,6,0) 30%, rgba(20,2,6,.45) 58%, rgba(20,2,6,.88) 100%) !important; }
.dx-card .dx-card-go { color: #fff; }

/* admin: full profile view */
.adm-photos{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.adm-photos figure{margin:0}
.adm-photos img{width:100%;aspect-ratio:3/4;object-fit:cover;border-radius:12px;border:1px solid rgba(0,0,0,.08);display:block}
.adm-photo-missing{aspect-ratio:3/4;border-radius:12px;background:#f4eef0;display:grid;place-items:center;color:#8a7a80;font-size:.85rem}
.adm-photos figcaption{margin-top:6px}
.adm-sections{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.adm-sections .card{margin:0}
.adm-note{border-left:4px solid #d9a441}

/* 6 Oct 2026: logo (emblem traced from the owner's logo; wordmark in Fraunces, logo teal + gold) */
:root { --logo-teal: var(--emerald-dark); --logo-gold: var(--gold); }
.brand-logo { display: inline-flex; align-items: center; gap: 10px; line-height: 1; }
.brand-logo .brand-mark { height: 44px; width: auto; display: block; flex: none; }
.brand-logo .brand-word { color: var(--logo-teal); }
.brand-logo .brand-word span { color: var(--logo-gold); }
.admin-side .brand-logo .brand-mark { height: 36px; }
.admin-side .brand-logo .brand-word { color: var(--logo-teal); }
.admin-side .brand-logo .brand-word span { color: var(--logo-gold); }
.site-footer .brand-emblem-only { display: inline-block; line-height: 0; }
.site-footer .brand-emblem-only img { height: 64px; width: auto; display: block; }
@media (max-width: 600px) { .brand-logo .brand-mark { height: 36px; } .brand-logo { gap: 8px; } }

/* 6 Oct 2026: logo tagline under the wordmark, as in the owner logo */
.brand-logo .brand-text { display: inline-flex; flex-direction: column; align-items: flex-start; gap: 4px; line-height: 1; }
.brand-logo .brand-word { display: block; line-height: 1; }
.brand.brand-logo .brand-tag { display: block; font-family: Inter, system-ui, sans-serif; font-size: .58rem; font-weight: 600; letter-spacing: .22em; text-transform: uppercase; color: #6b7280 !important; white-space: nowrap; font-variation-settings: normal; padding-left: 2px; }
@media (max-width: 600px) { .brand.brand-logo .brand-tag { font-size: .5rem; letter-spacing: .14em; } }

/* WhatsApp alerts (12 Oct 2026) */
.wa-optin{border:1px solid var(--line);border-radius:12px;padding:14px 16px;margin-top:18px}
.wa-copy{font-family:ui-monospace,Consolas,monospace;width:100%}
.wa-err{max-width:300px;word-break:break-word}

/* 13 Oct 2026: zakat (ported from arbsbuy.pk, RishteDesk crimson + gold) */
.zk-banner{display:grid;grid-template-columns:auto 1.3fr 1fr 1fr auto;gap:22px;align-items:center;margin:0 0 18px;padding:18px 22px;border-radius:16px;text-decoration:none!important;color:#fff!important;background:linear-gradient(135deg,#4e0716,#7d0d24 55%,#a3142f);box-shadow:0 8px 22px rgba(125,13,36,.22)}
.zk-banner .zk-ico{font-size:2rem;line-height:1}
.zk-l{font-size:.7rem;letter-spacing:.09em;text-transform:uppercase;color:#f3d9c2}
.zk-n{font-size:1.55rem;font-weight:800;margin-top:2px;color:#fff}
.zk-n.sm{font-size:1.25rem}
.zk-s{font-size:.78rem;color:#f6e6ea;margin-top:2px}
.zk-cta{background:#b07a4f;color:#fff;font-weight:700;font-size:.82rem;padding:10px 16px;border-radius:999px;white-space:nowrap}
.zk-banner:hover .zk-cta{background:#c08a5e}
.zk-hero{display:grid;grid-template-columns:repeat(4,1fr);gap:18px;padding:22px 24px;border-radius:16px;margin:0 0 18px;background:linear-gradient(135deg,#4e0716,#7d0d24 55%,#a3142f);color:#fff}
.zk-hero .zk-n{font-size:1.5rem}
.zk-ayah{background:#fbf3ec;border:1px solid #ecd6c2;border-radius:14px;padding:14px 18px;margin:0 0 18px;color:#6b4426;line-height:1.7}
.zk-ayah b{font-size:1.15rem}
.zk-due{color:#7d0d24}
.zk-flash{border-left:4px solid #1d6b3f;color:#1d6b3f}.zk-flash.bad{border-left-color:#a12727;color:#a12727}
.zk-pay{margin-top:8px}.zk-pay summary{cursor:pointer;color:#7d0d24;font-weight:600;font-size:.85rem}
.zk-pay form{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:8px;padding:12px;border:1px solid #f0dde2;border-radius:12px;background:#fffafa;min-width:320px}
.zk-pay label{font-size:.8rem;display:grid;gap:4px}.zk-pay button{grid-column:1/-1;justify-self:start}
.zk-pay .zk-del{grid-template-columns:1fr auto;align-items:center}
.zk-rate{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.zk-rate input{width:110px}
@media(max-width:900px){.zk-banner,.zk-hero{grid-template-columns:1fr 1fr}.zk-pay form{grid-template-columns:1fr;min-width:0}}
.zk-under-rev .zk-banner{margin:14px 0 6px}

/* 13 Oct 2026: Google review invitation (verified paying members only) */
.db-greview{background:linear-gradient(135deg,#fff7ef,#fdeef1);border:1px solid #f0d9c4;text-align:left}
.db-greview-stars{color:#e3a33b;font-size:1.15rem;letter-spacing:2px}
.db-greview h2{font-size:1.05rem;margin:6px 0}
.db-greview p{font-size:.88rem;color:var(--ink-soft);margin:0 0 12px}
.db-greview form{display:inline}
.db-greview-later{background:none;border:0;color:var(--ink-muted);font-size:.85rem;margin-left:10px;cursor:pointer;text-decoration:underline}

/* 13 Oct 2026: linked sign-in accounts */
.linked-acc .linked-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-top:1px solid var(--line,#eee)}
.linked-acc .linked-row:first-of-type{border-top:0}
.linked-acc .linked-row span{display:block}

/* Govt taxes card on the admin dashboard (ported from arbsbuy.com, 27 Oct 2026) */
.tx-banner{display:grid;grid-template-columns:auto 1.3fr 1fr 1fr auto;gap:22px;align-items:center;margin:0;padding:18px 22px;border-radius:16px;text-decoration:none!important;color:#fff!important;background:linear-gradient(135deg,#7a2e0e,#a8431a);box-shadow:0 8px 22px rgba(122,46,14,.2)}
.tx-banner .tx-ico{font-size:2rem;line-height:1}
.tx-l{font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:#f6d3bf}
.tx-n{font-size:1.55rem;font-weight:800;margin-top:2px}
.tx-n.sm{font-size:1.25rem}
.tx-s{font-size:.78rem;color:#fbe4d6}
.tx-cta{background:#fff;color:#7a2e0e;font-weight:700;font-size:.82rem;padding:10px 16px;border-radius:999px;white-space:nowrap}
.tx-lines{margin:8px 0 18px;border-radius:14px;overflow:hidden;border:1px solid #efd3c2;background:#fff}
.tx-lines summary{cursor:pointer;padding:10px 18px;font-weight:700;font-size:.85rem;color:#7a2e0e;background:#fbf3ee}
.tx-note{padding:8px 18px;margin:0;font-size:.76rem;color:#8a6a58}
.tx-scroll{overflow-x:auto}
.tx-lines table{width:100%;border-collapse:collapse;font-size:.86rem;min-width:620px}
.tx-lines th{background:#fbf3ee;color:#7a2e0e;text-align:left;padding:9px 16px}
.tx-lines td{padding:8px 16px;border-top:1px solid #f3e4db}
.tx-lines .r{text-align:right}
.tx-lines .w{color:#8a6a58;font-size:.8rem}
.tx-lines .z{color:#c4b4ab}
.tx-lines tr.sub{background:#fdf8f5;font-weight:700}
.tx-lines tr.tot{background:#fbeee6;font-weight:800;color:#7a2e0e}
@media(max-width:900px){.tx-banner{grid-template-columns:1fr 1fr}}
.tfa-nudge{background:var(--gold-soft);border:1px solid var(--gold-bright)}