/*
 * LyfPath design tokens
 * ---------------------
 * The product's design system — palette, type ramp, spacing, radii, shadows
 * and motion — as authored in the app. Shared by every page on the site.
 */
:root{
/* ── Base palette ─────────────────────────────────────────── */
/* Teal — the brand core */
--teal-900:#0A3F3A;--teal-800:#0C4843;--teal-700:#0C5049;--teal-600:#10605A;--teal-550:#12665F;--teal-500:#147065;
--teal-450:#14655A;--teal-400:#1E5C4C;--teal-350:#1B6E60;--teal-300:#2C8375;--teal-200:#5FA99B;--teal-150:#8FB8AF;
--teal-100:#9EC1B6;--teal-80:#BFD8D1;--teal-40:#E3EDE9;--teal-30:#E7EFEA;--teal-20:#EAF3EE;--teal-15:#D6E6E0;

/* Paper — the warm cream ground */
--paper-000:#FFFFFF;--paper-050:#FFFDF8;--paper-100:#FCFAF4;--paper-200:#F7F6F3;--paper-300:#F6F1E7;
--paper-400:#F2EEE3;--paper-450:#F1EEE4;--paper-500:#F0ECE1;--paper-550:#EFEAE0;--paper-600:#EFE7D7;
--paper-650:#EDE8DB;--paper-700:#EBE5D8;--paper-750:#F7F4EA;

/* Ink — warm neutral text ramp */
--ink-900:#1C2620;--ink-800:#23211C;--ink-700:#3E3A33;--ink-600:#4A4438;--ink-500:#5C5445;
--ink-400:#6B6357;--ink-300:#857C6B;--ink-200:#B9AE97;--ink-100:#C8BCA4;

/* Line — hairlines and borders, warm */
--line-strong:#C9BFA9;--line-600:#D9D0BD;--line-500:#DCD0BA;--line-400:#E0D7C6;
--line-300:#E7DFD0;--line-200:#F0E9DC;--line-100:#EFE9DC;

/* Gold — paid services, vault, warm accents */
--gold-900:#6E430C;--gold-800:#86551F;--gold-750:#8C5712;--gold-700:#9A6B12;--gold-600:#A9712F;
--gold-500:#B0731C;--gold-400:#D8B679;--gold-300:#F0C25C;--gold-250:#E8B84A;--gold-200:#F0DDB8;
--gold-100:#F6EDDC;--gold-50:#FFF8EC;--gold-25:#FFF6E6;

/* Terracotta — alerts, refusals, disputes */
--clay-900:#7C3A22;--clay-800:#8A4630;--clay-700:#96391F;--clay-600:#A03D22;--clay-550:#A8432A;
--clay-500:#B0492B;--clay-450:#BE4E2C;--clay-400:#C97B4A;--clay-200:#F0D5C8;--clay-150:#F4E2DA;
--clay-125:#F7E4DC;--clay-100:#F9EAE2;--clay-75:#F9EFE9;--clay-50:#F0DCD1;

/* Sage — success, approvals, "done" */
--sage-700:#34593F;--sage-600:#33613F;--sage-550:#3F6B4D;--sage-500:#5C8A6A;--sage-300:#C8DDCA;
--sage-200:#CFE3D2;--sage-150:#D7E4D8;--sage-100:#E7F0E8;

/* Slate blue — AI summaries, informational */
--blue-700:#2F5872;--blue-600:#3F6E91;--blue-500:#1E5578;--blue-200:#CFE0EC;--blue-100:#E9EEF4;--blue-50:#E6EEF4;

/* ── Semantic aliases ─────────────────────────────────────── */
--bg-app:var(--paper-300);
--surface-card:var(--paper-050);
--surface-raised:var(--paper-100);
--surface-sunken:var(--paper-600);
--surface-muted:var(--paper-550);
--surface-glass:rgba(252,250,244,.62);
--surface-glass-strong:rgba(255,255,255,.66);
--surface-sheet:var(--paper-300);
--surface-inverse:var(--ink-800);

--text-heading:var(--ink-800);
--text-body:var(--ink-800);
--text-muted:var(--ink-400);
--text-faint:var(--ink-300);
--text-disabled:var(--ink-200);
--text-on-brand:#FCFAF4;
--text-link:var(--teal-600);

--brand:var(--teal-600);
--brand-hover:var(--teal-800);
--brand-tint:var(--teal-40);
--brand-ink:var(--teal-800);
--accent-gold:var(--gold-300);
--accent-gold-ink:var(--gold-900);

--border-subtle:var(--line-300);
--border-default:var(--line-600);
--border-strong:var(--line-strong);
--border-focus:var(--teal-600);

--status-success-bg:var(--sage-100);--status-success-border:var(--sage-200);--status-success-fg:var(--sage-550);
--status-warn-bg:var(--gold-50);--status-warn-border:var(--gold-200);--status-warn-fg:var(--gold-700);
--status-danger-bg:var(--clay-100);--status-danger-border:var(--clay-200);--status-danger-fg:var(--clay-800);
--status-info-bg:var(--blue-50);--status-info-border:var(--blue-200);--status-info-fg:var(--blue-700);
--status-neutral-bg:var(--paper-550);--status-neutral-border:var(--line-400);--status-neutral-fg:var(--ink-400);

/* Signature gradients, copied verbatim from the app */
--grad-plan-card:linear-gradient(150deg,#0C4843 0%,#10605A 55%,#1B6E60 100%);/* @kind color */
--grad-journey-hero:linear-gradient(135deg,#14655A 0%,#2C8375 54%,#5FA99B 100%);/* @kind color */
--grad-cta-deep:linear-gradient(160deg,#147065,#0C5049);/* @kind color */
--grad-alert:linear-gradient(135deg,#BE4E2C,#A03D22);/* @kind color */
--grad-gold:linear-gradient(145deg,#B0731C,#8C5712);/* @kind color */
--grad-app-shell:radial-gradient(340px 300px at 12% 6%,rgba(44,131,117,.18),transparent 62%),radial-gradient(300px 280px at 90% 28%,rgba(194,80,47,.10),transparent 65%),radial-gradient(380px 340px at 50% 100%,rgba(95,169,155,.16),transparent 62%),#F6F1E7;/* @kind color */
/* Service card shades — one per service, in order */
--grad-svc-blue:linear-gradient(150deg,#1E5578,#123852);/* @kind color */
--grad-svc-teal:linear-gradient(150deg,#12665F,#0A3F3A);/* @kind color */
--grad-svc-gold:linear-gradient(150deg,#7A5424,#4A3114);/* @kind color */
--grad-svc-green:linear-gradient(150deg,#33613F,#1C3B28);/* @kind color */
--grad-svc-clay:linear-gradient(150deg,#9C4426,#682B17);/* @kind color */
}

:root{
--font-display:'Fraunces',Georgia,'Times New Roman',serif;
--font-sans:'Hanken Grotesk',system-ui,-apple-system,sans-serif;
--font-body:var(--font-sans);

/* Weights actually used in product */
--fw-regular:400;/* @kind font */--fw-medium:500;/* @kind font */--fw-semibold:600;/* @kind font */--fw-bold:700;/* @kind font */--fw-black:800;/* @kind font */
/* Fraunces is set at 500 for headings and 600 for compact/emphatic headings. */
--fw-display:500;/* @kind font */--fw-display-strong:600;/* @kind font */

/* Size ramp — mobile-first, the values the app ships */
--fs-display:32px;   /* welcome hero */
--fs-h1:27px;        /* screen title, login title */
--fs-h2:26px;        /* step title, vault title */
--fs-h3:22px;        /* section screen title */
--fs-h4:20px;        /* "Ways we can help" */
--fs-h5:18px;        /* sub-screen title */
--fs-h6:17px;        /* card heading */
--fs-title:16px;     /* journey step card title */
--fs-body-lg:15.5px;
--fs-body:14px;
--fs-body-sm:13px;
--fs-caption:12.5px;
--fs-caption-sm:11.5px;
--fs-micro:10.5px;   /* eyebrow / uppercase labels */
--fs-nano:9.5px;

--lh-display:1.14;/* @kind font */--lh-heading:1.2;/* @kind font */--lh-title:1.3;/* @kind font */--lh-body:1.5;/* @kind font */--lh-prose:1.55;/* @kind font */--lh-loose:1.65;/* @kind font */

--ls-display:-.02em;/* @kind font */--ls-heading:-.015em;/* @kind font */--ls-tight:-.01em;/* @kind font */
--ls-eyebrow:.07em;/* @kind font */   /* uppercase micro labels */
--ls-eyebrow-wide:.1em;/* @kind font */
--ls-splash:.34em;/* @kind font */    /* splash tagline */
}

:root{
/* 4-ish base, but the product uses odd values freely — these are the real ones */
--space-1:3px;--space-2:5px;--space-3:7px;--space-4:9px;--space-5:11px;--space-6:12px;
--space-7:14px;--space-8:16px;--space-9:18px;--space-10:20px;--space-11:22px;--space-12:26px;
--space-14:34px;--space-16:44px;

/* Layout */
--screen-gutter:22px;         /* every scrolling screen */
--screen-gutter-wide:26px;    /* login, welcome, guest sheet */
--card-pad:15px;/* @kind spacing */
--card-pad-lg:17px;/* @kind spacing */
--sheet-pad:14px 22px 26px;/* @kind spacing */
--stack-gap:9px;              /* gap between stacked list cards */
--section-gap:18px;           /* gap before a new section heading */

/* Touch */
--tap-min:44px;/* @kind spacing */
--control-h:54px;/* @kind spacing */             /* primary buttons, inputs on login */
--control-h-sm:50px;/* @kind spacing */
--field-h:52px;/* @kind spacing */
}

:root{
--radius-pill:999px;
--radius-phone:44px;
--radius-sheet:24px;
--radius-card-lg:22px;
--radius-card:18px;
--radius-card-sm:16px;
--radius-tile:14px;
--radius-control:13px;
--radius-chip:12px;
--radius-input:12px;
--radius-tag:10px;
--radius-badge:7px;
--radius-bar:6px;
--radius-avatar:50%;
}

:root{
/* Shadows are coloured — teal for brand surfaces, warm brown for gold ones. */
--shadow-plan-card:0 16px 32px -16px rgba(16,96,90,.6);
--shadow-service-card:0 18px 34px -20px rgba(12,72,67,.6);
--shadow-float:0 12px 28px rgba(20,50,45,.12);
--shadow-hover:0 6px 16px -10px rgba(16,96,90,.4);
--shadow-gold:0 8px 18px -12px rgba(140,87,18,.9);
--shadow-gold-lip:0 2px 0 rgba(140,87,18,.08);
--shadow-dialog:0 24px 48px -18px rgba(20,50,45,.5);
--shadow-sheet:0 -18px 40px -24px rgba(20,26,24,.5);
--shadow-drawer:22px 0 46px -24px rgba(20,26,24,.45);
--shadow-toast:0 10px 30px -8px rgba(0,0,0,.5);
--shadow-thumb:0 1px 3px rgba(0,0,0,.22);
--shadow-phone:0 2px 0 rgba(255,255,255,.04) inset,0 40px 80px -20px rgba(0,0,0,.55),0 0 0 11px #0a1f1d,0 0 0 13px #1d3a36;

/* Frosted glass — used on nearly every secondary surface */
--blur-glass:blur(12px);/* @kind other */
--blur-glass-strong:blur(14px);/* @kind other */
--blur-scrim:blur(2px);/* @kind other */

--scrim-dark:rgba(20,26,24,.5);/* @kind color */
--scrim-sheet:rgba(15,30,28,.45);/* @kind color */
--scrim-light:rgba(15,30,28,.4);/* @kind color */
--scrim-faceid:rgba(8,28,26,.82);/* @kind color */
}

:root{
--ease-glide:cubic-bezier(.22,.7,.3,1);/* @kind other */   /* sheets, cards, drawers */
--ease-settle:cubic-bezier(.22,.9,.3,1);/* @kind other */  /* reveals, step entries */
--ease-splash:cubic-bezier(.32,0,.24,1);/* @kind other */
--dur-press:.12s;/* @kind other */
--dur-fast:.18s;/* @kind other */   /* button colour transitions */
--dur-base:.25s;/* @kind other */
--dur-sheet:.28s;/* @kind other */
--dur-card:.42s;/* @kind other */   /* card-stack shuffles */
--press-scale:.97;/* @kind other */
--stagger-step:90ms;/* @kind other */
}

@keyframes minaro-sheetup{from{transform:translateY(24px);opacity:.6}to{transform:none;opacity:1}}
@keyframes minaro-fadein{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
@keyframes minaro-stepin{from{opacity:0;transform:translateY(26px) scale(.97)}to{opacity:1;transform:none}}
@keyframes minaro-railin{from{transform:translateX(-50%) scaleY(0)}to{transform:translateX(-50%) scaleY(1)}}
@keyframes minaro-navin{from{transform:translateX(-100%)}to{transform:translateX(0)}}
@keyframes minaro-navfade{from{opacity:0}to{opacity:1}}
@keyframes minaro-pulsedot{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.35;transform:scale(.8)}}
@keyframes minaro-hintpulse{0%,100%{opacity:.28}50%{opacity:.65}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important}}