/*
 * WedUploader UI Foundation
 * Shared by documentation, public guest experiences, and the account application.
 * Bootstrap owns layout primitives; .wu-* owns WedUploader identity.
 */

@import url('https://fonts.googleapis.com/css2?family=Inter:ital,opsz,wght@0,14..32,100..900;1,14..32,100..900&family=Playfair+Display:ital,wght@0,400..900;1,400..900&display=swap');

:root {
  color-scheme: light;

  /* Brand Gold 0-900 */
  --wu-gold-0: #fffdf8;
  --wu-gold-50: #fbf8f2;
  --wu-gold-100: #f5ecdd;
  --wu-gold-200: #ead7b7;
  --wu-gold-300: #dfc18e;
  --wu-gold-400: #d3ae6f;
  --wu-gold-500: #c19a5b;
  --wu-gold-600: #a47d45;
  --wu-gold-700: #806036;
  --wu-gold-800: #604828;
  --wu-gold-900: #453015;

  /* Brand Bronze 0-900 */
  --wu-bronze-0: #fdfbf8;
  --wu-bronze-50: #FBF9F5;
  --wu-bronze-100: #F1EADF;
  --wu-bronze-200: #E4D4C0;
  --wu-bronze-300: #D3BEA1;
  --wu-bronze-400: #C2A47F;
  --wu-bronze-500: #AB8965;
  --wu-bronze-600: #8F6F4F;
  --wu-bronze-700: #71563D;
  --wu-bronze-800: #57412E;
  --wu-bronze-900: #3E2E21;

  /* Brand Warm 50-900 */
  --wu-warm-50: #FAF7F3;
  --wu-warm-100: #F2EEE9;
  --wu-warm-200: #ECE7DD;
  --wu-warm-300: #E6DEC6;
  --wu-warm-400: #D9D2BF;
  --wu-warm-500: #C8BEA8;
  --wu-warm-600: #AA9C83;
  --wu-warm-700: #87775F;
  --wu-warm-800: #665846;
  --wu-warm-900: #493F32;

  /* Neutral 0-900 */
  --wu-neutral-0: #ffffff;
  --wu-neutral-50: #faf9f7;
  --wu-neutral-100: #f4f1ec;
  --wu-neutral-200: #e8e3da;
  --wu-neutral-300: #d8d1c6;
  --wu-neutral-400: #bdb4a7;
  --wu-neutral-500: #958c80;
  --wu-neutral-600: #736b61;
  --wu-neutral-700: #59524a;
  --wu-neutral-800: #403b35;
  --wu-neutral-900: #2b2824;

  /* Warm surfaces */
  --wu-primary: var(--wu-gold-500);
  --wu-primary-2: #8C7954;
  --wu-warm-ivory: #f2eee9;
  --wu-canvas: #fffefc;
  --wu-soft-stone: #d9d2bf;
  --wu-pale-oat: #e6dec6;
  --wu-accessible-deep: #57412e;
  --wu-warm-ink: #292723;

  /* Semantic families */
  --wu-success-0: #f9fdfb;
  --wu-success-50: #eef8f2;
  --wu-success-100: #d9efe2;
  --wu-success-200: #b4dec5;
  --wu-success-300: #86c9a4;
  --wu-success-400: #58af80;
  --wu-success-500: #2f7a58;
  --wu-success-600: #1d4e38;
  --wu-success-700: #1d4e38;
  --wu-success-800: #163a2b;
  --wu-success-900: #10291e;
  --wu-warning-0: #fffdf7;
  --wu-warning-50: #fff8eb;
  --wu-warning-100: #ffedc6;
  --wu-warning-200: #fddc93;
  --wu-warning-300: #f8c55b;
  --wu-warning-400: #efad2e;
  --wu-warning-500: #c98916;
  --wu-warning-600: #a56d10;
  --wu-warning-700: #82520d;
  --wu-warning-800: #633d0b;
  --wu-warning-900: #452a07;
  --wu-danger-0: #fffafa;
  --wu-danger-50: #fff1f1;
  --wu-danger-100: #ffe0e0;
  --wu-danger-200: #ffc2c2;
  --wu-danger-300: #ff9797;
  --wu-danger-400: #f46c6c;
  --wu-danger-500: #b23a3a;
  --wu-danger-600: #962f2f;
  --wu-danger-700: #772424;
  --wu-danger-800: #5a1a1a;
  --wu-danger-900: #3e1010;
  --wu-info-0: #fafcfe;
  --wu-info-50: #eef7fb;
  --wu-info-100: #d9eef6;
  --wu-info-200: #b8dcea;
  --wu-info-300: #8ec5dd;
  --wu-info-400: #64aacd;
  --wu-info-500: #4e7484;
  --wu-info-600: #3f6270;
  --wu-info-700: #304b56;
  --wu-info-800: #23373f;
  --wu-info-900: #172529;


  /* Typography */
  --wu-font-sans: "Inter", ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --wu-font-display: "Playfair Display", serif;
  --wu-text-xs: 0.75rem;
  --wu-text-sm: 0.875rem;
  --wu-text-md: 1rem;
  --wu-text-lg: 1.125rem;
  --wu-text-xl: 1.5rem;
  --wu-text-2xl: clamp(1.875rem, 4vw, 3.25rem);
  --wu-display: clamp(3rem, 8vw, 6rem);
  --wu-leading-tight: 1.08;
  --wu-leading-body: 1.55;
  --wu-letter-spacing: -0.02em;

  /* Spacing: 2px base with practical product and marketing steps */
  --wu-space-0: 0;
  --wu-space-1: 0.125rem;
  --wu-space-2: 0.25rem;
  --wu-space-3: 0.375rem;
  --wu-space-4: 0.5rem;
  --wu-space-6: 0.75rem;
  --wu-space-8: 1rem;
  --wu-space-10: 1.25rem;
  --wu-space-12: 1.5rem;
  --wu-space-16: 2rem;
  --wu-space-20: 2.5rem;
  --wu-space-24: 3rem;
  --wu-space-32: 4rem;
  --wu-space-40: 5rem;
  --wu-space-48: 6rem;
  --wu-space-64: 8rem;

  /* Radius */
  --wu-radius-none: 0;
  --wu-radius-xs: 0.25rem;
  --wu-radius-sm: 0.5rem;
  --wu-radius-md: 0.75rem;
  --wu-radius-lg: 1rem;
  --wu-radius-xl: 1.5rem;
  --wu-radius-2xl: 2rem;
  --wu-radius-full: 999rem;

  /* Border + elevation */
  --wu-border-subtle: rgba(47, 36, 26, 0.12);
  --wu-border-strong: rgba(90, 64, 40, 0.28);
  --wu-shadow-xs: 0 1px 2px rgba(47, 36, 26, 0.05);
  --wu-shadow-sm: 0 4px 12px rgba(47, 36, 26, 0.07);
  --wu-shadow-md: 0 12px 28px rgba(47, 36, 26, 0.09);
  --wu-shadow-lg: 0 24px 50px rgba(47, 36, 26, 0.12);
  --wu-shadow-xl: 0 32px 80px rgba(47, 36, 26, 0.16);
  --wu-shadow-overlay: 0 40px 96px rgba(31, 29, 27, 0.25);
  --wu-shadow-jumbo: 0px 32px 80px 0px rgba(24, 22, 20, 0.051);

  /* Layout */
  --wu-container: 1280px;
  --wu-container-reading: 760px;
  --wu-section-space: clamp(4rem, 8vw, 8rem);
  --wu-transition: 180ms ease;

  /* Bootstrap bridge */
  --bs-body-font-family: var(--wu-font-sans);
  --bs-body-color: var(--wu-neutral-900);
  --bs-body-bg: var(--wu-neutral-0);
  --bs-primary: var(--wu-primary);
  --bs-primary-rgb: 193, 154, 91;
  --bs-secondary: var(--wu-primary-2);
  --bs-secondary-rgb: 140, 121, 84;
  --bs-border-color: var(--wu-border-subtle);
  --bs-border-radius-sm: var(--wu-radius-sm);
  --bs-border-radius: var(--wu-radius-md);
  --bs-border-radius-lg: var(--wu-radius-lg);
  --bs-link-color: var(--wu-gold-700);
  --bs-link-hover-color: var(--wu-gold-900);
  --bs-focus-ring-color: rgba(193, 154, 91, 0.24);

  /* Motion ms */
  --wu-motion-fast: 120ms;
  --wu-motion-base: 180ms;
  --wu-motion-relaxed: 280ms;
}


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

body {
  font-family: var(--wu-font-sans);
  color: var(--wu-neutral-900);
  background: var(--wu-canvas);
  text-rendering: optimizeLegibility;
}

:where(button, a, input, select, textarea, summary):focus-visible {
  outline: 3px solid rgba(193, 154, 91, 0.42);
  outline-offset: 3px;
}

.wu-font-display {
  font-family: var(--wu-font-display) !important;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
  letter-spacing: var(--wu-letter-spacing);
}
.wu-font-standard {
  font-family: var(--wu-font-sans) !important;
  font-optical-sizing: auto;
  font-weight: 400;
  font-style: normal;
}

.wu-text-lg-display{
    font-size: 60px !important;
}

.wu-text-md-standard{
    font-size: 48px !important;
}

.wu-text-sm-standard{
    font-size: 24px !important;
}


/* BG COLOR */
.bg-neutral-0{
  background: var(--wu-neutral-0) !important
}
.bg-neutral-50{
  background: var(--wu-neutral-50) !important
}
.bg-neutral-100{
  background: var(--wu-neutral-100) !important
}
.bg-neutral-200{
  background: var(--wu-neutral-200) !important
}
.bg-neutral-300{
  background: var(--wu-neutral-300) !important
}
.bg-neutral-400{
  background: var(--wu-neutral-400) !important
}
.bg-neutral-500{
  background: var(--wu-neutral-500) !important
}
.bg-neutral-600{
  background: var(--wu-neutral-600) !important
}
.bg-neutral-700{
  background: var(--wu-neutral-700) !important
}
.bg-neutral-800{
  background: var(--wu-neutral-800) !important
}
.bg-neutral-900{
  background: var(--wu-neutral-900) !important
}



.bg-gold-0{
  background: var(--wu-gold-0) !important
}
.bg-gold-50{
  background: var(--wu-gold-50) !important
}
.bg-gold-100{
  background: var(--wu-gold-100) !important
}
.bg-gold-200{
  background: var(--wu-gold-200) !important
}
.bg-gold-300{
  background: var(--wu-gold-300) !important
}
.bg-gold-400{
  background: var(--wu-gold-400) !important
}
.bg-gold-500{
  background: var(--wu-gold-500) !important
}
.bg-gold-600{
  background: var(--wu-gold-600) !important
}
.bg-gold-700{
  background: var(--wu-gold-700) !important
}
.bg-gold-800{
  background: var(--wu-gold-800) !important
}
.bg-gold-900{
  background: var(--wu-gold-900) !important
}



.bg-bronze-0{
  background: var(--wu-bronze-0) !important
}
.bg-bronze-50{
  background: var(--wu-bronze-50) !important
}
.bg-bronze-100{
  background: var(--wu-bronze-100) !important
}
.bg-bronze-200{
  background: var(--wu-bronze-200) !important
}
.bg-bronze-300{
  background: var(--wu-bronze-300) !important
}
.bg-bronze-400{
  background: var(--wu-bronze-400) !important
}
.bg-bronze-500{
  background: var(--wu-bronze-500) !important
}
.bg-bronze-600{
  background: var(--wu-bronze-600) !important
}
.bg-bronze-700{
  background: var(--wu-bronze-700) !important
}
.bg-bronze-800{
  background: var(--wu-bronze-800) !important
}
.bg-bronze-900{
  background: var(--wu-bronze-900) !important
}


.bg-warm-50{
  background: var(--wu-warm-50) !important
}
.bg-warm-100{
  background: var(--wu-warm-100) !important
}
.bg-warm-200{
  background: var(--wu-warm-200) !important
}
.bg-warm-300{
  background: var(--wu-warm-300) !important
}
.bg-warm-400{
  background: var(--wu-warm-400) !important
}
.bg-warm-500{
  background: var(--wu-warm-500) !important
}
.bg-warm-600{
  background: var(--wu-warm-600) !important
}
.bg-warm-700{
  background: var(--wu-warm-700) !important
}
.bg-warm-800{
  background: var(--wu-warm-800) !important
}
.bg-warm-900{
  background: var(--wu-warm-900) !important
}


.bg-success-50{
  background: var(--wu-success-50) !important
}
.bg-success-100{
  background: var(--wu-success-100) !important
}
.bg-success-200{
  background: var(--wu-success-200) !important
}
.bg-success-300{
  background: var(--wu-success-300) !important
}
.bg-success-400{
  background: var(--wu-success-400) !important
}
.bg-success-500{
  background: var(--wu-success-500) !important
}
.bg-success-600{
  background: var(--wu-success-600) !important
}
.bg-success-700{
  background: var(--wu-success-700) !important
}
.bg-success-800{
  background: var(--wu-success-800) !important
}
.bg-success-900{
  background: var(--wu-success-900) !important
}



.bg-warning-0{
  background: var(--wu-warning-0) !important
}
.bg-warning-50{
  background: var(--wu-warning-50) !important
}
.bg-warning-100{
  background: var(--wu-warning-100) !important
}
.bg-warning-200{
  background: var(--wu-warning-200) !important
}
.bg-warning-300{
  background: var(--wu-warning-300) !important
}
.bg-warning-400{
  background: var(--wu-warning-400) !important
}
.bg-warning-500{
  background: var(--wu-warning-500) !important
}
.bg-warning-600{
  background: var(--wu-warning-600) !important
}
.bg-warning-700{
  background: var(--wu-warning-700) !important
}
.bg-warning-800{
  background: var(--wu-warning-800) !important
}
.bg-warning-900{
  background: var(--wu-warning-900) !important
}


.bg-danger-0{
  background: var(--wu-danger-0) !important
}
.bg-danger-50{
  background: var(--wu-danger-50) !important
}
.bg-danger-100{
  background: var(--wu-danger-100) !important
}
.bg-danger-200{
  background: var(--wu-danger-200) !important
}
.bg-danger-300{
  background: var(--wu-danger-300) !important
}
.bg-danger-400{
  background: var(--wu-danger-400) !important
}
.bg-danger-500{
  background: var(--wu-danger-500) !important
}
.bg-danger-600{
  background: var(--wu-danger-600) !important
}
.bg-danger-700{
  background: var(--wu-danger-700) !important
}
.bg-danger-800{
  background: var(--wu-danger-800) !important
}
.bg-danger-900{
  background: var(--wu-danger-900) !important
}



/* TEXT COLOR */
.text-primary{
  color: var(--wu-gold-500) !important
}
.text-primary-2{
  color: var(--wu-primary-2) !important;
}
.text-gold-100{
  color: var(--wu-gold-100) !important
}
.text-gold-200{
  color: var(--wu-gold-200) !important
}
.text-gold-300{
  color: var(--wu-gold-300) !important
}
.text-gold-400{
  color: var(--wu-gold-400) !important
}
.text-gold-500{
  color: var(--wu-gold-500) !important
}
.text-gold-600{
  color: var(--wu-gold-600) !important
}
.text-gold-700{
  color: var(--wu-gold-700) !important
}
.text-gold-800{
  color: var(--wu-gold-800) !important
}
.text-gold-900{
  color: var(--wu-gold-900) !important
}

/* TEXT COLOR */
.text-info-50{
  color: var(--wu-info-50) !important
}
.text-info-100{
  color: var(--wu-info-100) !important
}
.text-info-200{
  color: var(--wu-info-200) !important
}
.text-info-300{
  color: var(--wu-info-300) !important
}
.text-info-400{
  color: var(--wu-info-400) !important
}
.text-info-500{
  color: var(--wu-info-500) !important
}
.text-info-600{
  color: var(--wu-info-600) !important
}
.text-info-700{
  color: var(--wu-info-700) !important
}
.text-info-800{
  color: var(--wu-info-800) !important
}
.text-info-900{
  color: var(--wu-info-900) !important
}


/* success */
.text-success-50{
  color: var(--wu-success-50) !important
}
.text-success-100{
  color: var(--wu-success-100) !important
}
.text-success-200{
  color: var(--wu-success-200) !important
}
.text-success-300{
  color: var(--wu-success-300) !important
}
.text-success-400{
  color: var(--wu-success-400) !important
}
.text-success-500{
  color: var(--wu-success-500) !important
}
.text-success-600{
  color: var(--wu-success-600) !important
}
.text-success-700{
  color: var(--wu-success-700) !important
}
.text-success-800{
  color: var(--wu-success-800) !important
}
.text-success-900{
  color: var(--wu-success-900) !important
}


.text-neutral-0{
  color: var(--wu-neutral-0) !important
}
.text-neutral-50{
  color: var(--wu-neutral-50) !important
}
.text-neutral-100{
  color: var(--wu-neutral-100) !important
}
.text-neutral-200{
  color: var(--wu-neutral-200) !important
}
.text-neutral-300{
  color: var(--wu-neutral-300) !important
}
.text-neutral-400{
  color: var(--wu-neutral-400) !important
}
.text-neutral-500{
  color: var(--wu-neutral-500) !important
}
.text-neutral-600{
  color: var(--wu-neutral-600) !important
}
.text-neutral-700{
  color: var(--wu-neutral-700) !important
}
.text-neutral-800{
  color: var(--wu-neutral-800) !important
}
.text-neutral-900{
  color: var(--wu-neutral-900) !important
}


.text-bronze-0{
  color: var(--wu-bronze-0) !important
}
.text-bronze-50{
  color: var(--wu-bronze-50) !important
}
.text-bronze-100{
  color: var(--wu-bronze-100) !important
}
.text-bronze-200{
  color: var(--wu-bronze-200) !important
}
.text-bronze-300{
  color: var(--wu-bronze-300) !important
}
.text-bronze-400{
  color: var(--wu-bronze-400) !important
}
.text-bronze-500{
  color: var(--wu-bronze-500) !important
}
.text-bronze-600{
  color: var(--wu-bronze-600) !important
}
.text-bronze-700{
  color: var(--wu-bronze-700) !important
}
.text-bronze-800{
  color: var(--wu-bronze-800) !important
}
.text-bronze-900{
  color: var(--wu-bronze-900) !important
}


.text-gold-0{
  color: var(--wu-gold-0) !important
}
.text-gold-50{
  color: var(--wu-gold-50) !important
}
.text-gold-100{
  color: var(--wu-gold-100) !important
}
.text-gold-200{
  color: var(--wu-gold-200) !important
}
.text-gold-300{
  color: var(--wu-gold-300) !important
}
.text-gold-400{
  color: var(--wu-gold-400) !important
}
.text-gold-500{
  color: var(--wu-gold-500) !important
}
.text-gold-600{
  color: var(--wu-gold-600) !important
}
.text-gold-700{
  color: var(--wu-gold-700) !important
}
.text-gold-800{
  color: var(--wu-gold-800) !important
}
.text-gold-900{
  color: var(--wu-gold-900) !important
}


.text-warning-0{
  color: var(--wu-warning-0) !important
}
.text-warning-50{
  color: var(--wu-warning-50) !important
}
.text-warning-100{
  color: var(--wu-warning-100) !important
}
.text-warning-200{
  color: var(--wu-warning-200) !important
}
.text-warning-300{
  color: var(--wu-warning-300) !important
}
.text-warning-400{
  color: var(--wu-warning-400) !important
}
.text-warning-500{
  color: var(--wu-warning-500) !important
}
.text-warning-600{
  color: var(--wu-warning-600) !important
}
.text-warning-700{
  color: var(--wu-warning-700) !important
}
.text-warning-800{
  color: var(--wu-warning-800) !important
}
.text-warning-900{
  color: var(--wu-warning-900) !important
}




.text-danger-0{
  color: var(--wu-danger-0) !important
}
.text-danger-50{
  color: var(--wu-danger-50) !important
}
.text-danger-100{
  color: var(--wu-danger-100) !important
}
.text-danger-200{
  color: var(--wu-danger-200) !important
}
.text-danger-300{
  color: var(--wu-danger-300) !important
}
.text-danger-400{
  color: var(--wu-danger-400) !important
}
.text-danger-500{
  color: var(--wu-danger-500) !important
}
.text-danger-600{
  color: var(--wu-danger-600) !important
}
.text-danger-700{
  color: var(--wu-danger-700) !important
}
.text-danger-800{
  color: var(--wu-danger-800) !important
}
.text-danger-900{
  color: var(--wu-danger-900) !important
}


.text-secondary{
  color: var(--wu-gold-700) !important
}

.wu-text-balance {
  text-wrap: balance;
}

.wu-container {
  width: min(var(--wu-container), calc(100% - 2rem));
  margin-inline: auto;
}

.wu-reading {
  max-width: var(--wu-container-reading);
}

.wu-section-space {
  padding-block: var(--wu-section-space);
}

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

@media (max-width: 767.98px) {
  :root {
    --wu-section-space: 4rem;
  }

  .wu-container {
    width: min(100% - 1.5rem, var(--wu-container));
  }
}

@media (prefers-reduced-motion: reduce) {
  html {
    scroll-behavior: auto;
  }

  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}
:root {
  --wu-white: var(--wu-neutral-0);
  --wu-ink: #211f1b;
  --wu-ink-soft: #59544c;
  --wu-ink-muted: #7a746a;
  --wu-line: var(--wu-neutral-200);
  --wu-line-strong: #d8cdbb;
  --wu-oat: var(--wu-warm-300);
  --wu-ivory: var(--wu-warm-100);
  --wu-stone: var(--wu-warm-400);
  --wu-sage: #d9e2d4;
  --wu-sage-strong: #657460;
  --wu-blue: #dce8ec;
  --wu-blue-strong: var(--wu-info-500);
  --wu-success: var(--wu-success-500);
  --wu-error: var(--wu-danger-500);
  --wu-radius-pill: 999px;
  --wu-shadow-focus: 0 0 0 3px rgba(193,154,91,.22);
  --wu-space-5: 20px;
  --wu-space-30: 120px;
}

body[data-page]:not(.wu-guest):not(.wu-app):not(.wu-account) {
  --wu-bronze-50: #FBF9F5;
  --wu-bronze-100: #F1EADF;
  --wu-bronze-200: #E4D4C0;
  --wu-bronze-300: #D3BEA1;
  --wu-bronze-400: #C2A47F;
  --wu-bronze-500: #AB8965;
  --wu-bronze-600: #8F6F4F;
  --wu-bronze-700: #71563D;
  --wu-bronze-800: #57412E;
  --wu-bronze-900: #3E2E21;


  --wu-radius-sm: 12px;
  --wu-radius-md: 18px;
  --wu-radius-lg: 26px;
  --wu-radius-xl: 36px;

  --wu-shadow-xs: 0 1px 2px rgba(33,31,27,.05);
  --wu-shadow-sm: 0 8px 24px rgba(33,31,27,.08);
  --wu-shadow-md: 0 20px 50px rgba(33,31,27,.12);

  --wu-space-1: 4px;
  --wu-space-2: 8px;
  --wu-space-3: 12px;
  --wu-space-4: 16px;
  --wu-space-6: 24px;
  --wu-space-8: 32px;
  --wu-space-10: 40px;
  --wu-space-12: 48px;
  --wu-space-16: 64px;
  --wu-space-20: 80px;
  --wu-space-24: 96px;

  --wu-container: 1240px;
  --bs-border-radius: var(--wu-radius-md);
  --bs-border-radius-lg: var(--wu-radius-lg);
}
