/* World Beyond Home brand tokens: the one place colours, type and shapes are defined. Loaded by worldlings-brand.css (shared
   pages, home) and by the planner; the planner's new look reads them through its shadow root.
   Palette "Midnight & Champagne" (2027 redesign): one deep anchor for trust (midnight), one metallic accent for
   luxury (champagne gold), warm neutrals for calm (bone, linen). The variable names stay, so every page follows.
   Text pairs are checked: ink on ivory 15.6:1 · muted on ivory 5.9:1 · teal-ink (gold ink) on ivory 5.3:1 and on
   parchment 4.8:1 · ember-ink on ivory 5.6:1 · ink on lantern 7.5:1 · lantern on dusk 7.5:1.
   Lantern (champagne) and coral are never small text on light backgrounds. */
@import url("https://fonts.googleapis.com/css2?family=Instrument+Serif:ital@0;1&family=Inter:wght@400;500;600;700&display=swap");
:root{
  /* Palette */
  --wl-night:#0a1420;--wl-dusk:#0e1a2b;--wl-dusk-2:#16253a;
  --wl-lantern:#c8a46a;--wl-lantern-hi:#e2c894;--wl-lantern-soft:#f6eedd;
  --wl-teal:#a8854a;--wl-teal-ink:#7d5e2a;--wl-teal-soft:#f1e9da;
  --wl-ember:#c06a3c;--wl-ember-ink:#9a4220;--wl-ember-soft:#f7e6dc;
  --wl-coral:#e0907f;--wl-sky:#8fa9c4;
  --wl-parchment:#ece4d7;--wl-ivory:#f6f1e9;--wl-paper:#fffdf9;--wl-line:#ddd2c0;--wl-line-strong:#c9bba3;
  --wl-ink:#0e1a2b;--wl-muted:#625c53;--wl-mist:#c9c2b6;

  /* Roles: use these in components */
  --wl-bg:var(--wl-ivory);--wl-surface:var(--wl-paper);--wl-surface-2:var(--wl-parchment);
  --wl-text:var(--wl-ink);--wl-text-2:var(--wl-muted);--wl-on-dark:#fff8ea;--wl-on-dark-2:#e6ddc9;
  --wl-action:var(--wl-lantern);--wl-action-hover:var(--wl-lantern-hi);--wl-on-action:var(--wl-dusk);
  --wl-link:var(--wl-teal-ink);--wl-success:var(--wl-teal-ink);--wl-success-soft:var(--wl-teal-soft);
  --wl-warn-ink:#6b4e12;--wl-warn-soft:#fbf3e2;--wl-warn-line:#e8d6ae;
  --wl-focus:#2b6cb0;

  /* Type: Instrument Serif (one regular weight, with italic) for headings, Inter for everything else. */
  --wl-serif:"Instrument Serif","Cormorant Garamond",Georgia,"Times New Roman",serif;
  --wl-sans:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --wl-serif-weight:400;
  --wl-text-xs:12px;--wl-text-sm:14px;--wl-text-md:16px;--wl-text-lg:18px;
  --wl-h4:20px;--wl-h3:24px;--wl-h2:clamp(26px,3.4vw,34px);--wl-h1:clamp(32px,6vw,52px);--wl-display:clamp(40px,8vw,76px);
  --wl-leading:1.55;--wl-leading-tight:1.08;

  /* Shape and depth */
  --wl-r-sm:12px;--wl-r-md:18px;--wl-r-lg:24px;--wl-r-xl:30px;--wl-r-pill:999px;
  --wl-shadow-1:0 2px 8px rgba(14,26,43,.06);--wl-shadow-2:0 10px 28px rgba(14,26,43,.10);--wl-shadow-3:0 18px 44px rgba(14,26,43,.16);
  --wl-space-1:4px;--wl-space-2:8px;--wl-space-3:12px;--wl-space-4:16px;--wl-space-5:20px;--wl-space-6:28px;--wl-space-7:40px;
}

/* Headings use the serif's single regular weight; a synthetic bold would smear it. */
:where(h1,h2,h3,.wl-serif){font-weight:var(--wl-serif-weight)}

/* The World Beyond Home wordmark (2026-11): the name set in Fraunces SemiBold, after the two-balloon mark (a parent and a
   child balloon travelling together). Live text, so screen readers, search engines and copy-paste get "World Beyond Home", and it is crisp at
   every size. The old cartoon mark image beside the name is hidden. Gold on dark bars; gold ink on light bars. */
:is(.ft-global-brand,.wl-footer-brand,header .brand,.ft-404-page .brand)>img{display:none!important}
:is(.ft-global-brand,.wl-footer-brand,header .brand,.wl-wordmark,.ft-404-page .brand)>span:last-child:not(.wl-wordmark),
a.ft-public-brand,a.brand:not(:has(span)){display:inline-flex!important;align-items:center;gap:10px;font:400 29px/1 "Instrument Serif",Georgia,serif!important;letter-spacing:0!important;color:inherit!important;white-space:nowrap}
:is(.ft-global-brand,.wl-footer-brand,header .brand,.wl-wordmark,.ft-404-page .brand)>span:last-child:not(.wl-wordmark)::after,
a.ft-public-brand::after,a.brand:not(:has(span))::after{content:none!important}
:is(.ft-global-brand,.wl-footer-brand,header .brand,.wl-wordmark,.ft-404-page .brand)>span:last-child:not(.wl-wordmark)::before,
a.ft-public-brand::before,a.brand:not(:has(span))::before{content:"";flex:0 0 auto;width:35px;height:34px;
  background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23C8A46A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 43V21a13 13 0 0 1 26 0v22'/%3E%3Cpath d='M3 43h42'/%3E%3Cpath d='M11 33h26' stroke-width='2'/%3E%3C/g%3E%3Cpath fill='%23C8A46A' d='M18 33a6 6 0 0 1 12 0z'/%3E%3C/svg%3E") center/contain no-repeat}
a.ft-public-brand::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%237D5E2A' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M11 43V21a13 13 0 0 1 26 0v22'/%3E%3Cpath d='M3 43h42'/%3E%3Cpath d='M11 33h26' stroke-width='2'/%3E%3C/g%3E%3Cpath fill='%23C8A46A' d='M18 33a6 6 0 0 1 12 0z'/%3E%3C/svg%3E")}
.wl-footer-brand>span:last-child:not(.wl-wordmark){font-size:32px!important}
@media(max-width:480px){:is(.ft-global-brand,header .brand,.wl-wordmark,.ft-404-page .brand)>span:last-child:not(.wl-wordmark),a.ft-public-brand,a.brand:not(:has(span)){font-size:24px!important}}
@media print{:is(.ft-global-brand,.wl-footer-brand,header .brand,.wl-wordmark)>span:last-child:not(.wl-wordmark),a.ft-public-brand{color:#0e1a2b!important}}

/* Brand components any page can use. */
.wl-stamp{display:block}
.wl-kicker{font:800 var(--wl-text-xs)/1.2 var(--wl-sans);letter-spacing:.12em;text-transform:uppercase;color:var(--wl-teal-ink)}
@media(max-width:480px){:is(.ft-global-brand,header .brand,.ft-404-page .brand)>span:last-child:not(.wl-wordmark),a.ft-public-brand{font-size:21px!important;gap:6px!important}}
@media(max-width:420px){:is(.ft-global-brand,header .brand,.ft-404-page .brand)>span:last-child:not(.wl-wordmark)::before,a.ft-public-brand::before{display:none!important}}

/* World Beyond Home: "Beyond" in champagne italic wherever the wordmark appears. */
:is(.wl-wordmark,.brand-mark,.brand,.logo,.ft-public-brand) em{font-family:"Instrument Serif",Georgia,serif;font-style:italic;font-weight:400;letter-spacing:0;color:#C8A46A}
@media(max-width:420px){.wl-wordmark{gap:6px!important}.wl-wordmark>span{font-size:20px!important}.wl-wordmark img{height:26px!important}}