/* Event Fairy: editable website foundation. No framework or build step required.
   Load this before catalog-brand.css. All relative font URLs travel with this folder.
   Select exactly one reference with data-ef-palette="01".."04" on <html>.
   Omitting it gives a neutral foundation; no final palette is assumed. */
@font-face {font-family:"Basteleur";src:url("fonts/Basteleur-Moonlight.woff2") format("woff2");font-style:normal;font-weight:400;font-display:swap}
@font-face {font-family:"DM Sans";src:url("fonts/DMSans.woff2") format("woff2");font-style:normal;font-weight:100 1000;font-display:swap}
:root {
 --ef-ink:#353642; --ef-paper:#FFFFFF; --ef-muted:#6A6973; --ef-rule:#DEDFE4;
 --ef-display:"Basteleur",Georgia,serif; --ef-body:"DM Sans",Arial,sans-serif;
 --ef-h1:clamp(2.5rem,1.75rem + 3.1vw,4rem);
 --ef-h2:clamp(2rem,1.5rem + 2vw,2.75rem);
 --ef-h3:clamp(1.5rem,1.2rem + 1vw,1.75rem);
 --ef-lead:clamp(1.125rem,1rem + .5vw,1.25rem);
 --ef-text:clamp(1rem,.94rem + .25vw,1.125rem);
 --ef-space-1:8px; --ef-space-2:16px; --ef-space-3:24px; --ef-space-4:32px;
 --ef-space-5:48px; --ef-space-6:64px; --ef-content:1240px;
 --ef-color-1:var(--ef-paper);--ef-color-2:var(--ef-paper);--ef-color-3:var(--ef-paper);
 --ef-color-4:var(--ef-paper);--ef-color-5:var(--ef-paper);--ef-color-6:var(--ef-paper);
}

[data-ef-palette="01"] {
 --ef-color-1:#EDDADE; /* Pink Marshmallow; sampled */
 --ef-color-2:#BAD2DE; /* Delicate Blue; sampled */
 --ef-color-3:#BFDDC5; /* Veiled Vista; sampled */
 --ef-color-4:#F1F0B0; /* 9121 C / Yellow; printed */
}

[data-ef-palette="02"] {
 --ef-color-1:#D7897F; /* Nectarine; printed */
 --ef-color-2:#F9B95C; /* Pêche; printed */
 --ef-color-3:#96C7B3; /* Menthe; printed */
 --ef-color-4:#6398A9; /* Lagune; printed */
}

[data-ef-palette="03"] {
 --ef-color-1:#F1E8B1; /* Pastel Yellow; sampled */
 --ef-color-2:#B0CBE8; /* Whispy Blue; sampled */
 --ef-color-3:#B5C48D; /* Margarita; sampled */
 --ef-color-4:#D89C9B; /* Pressed Rose; sampled */
}

[data-ef-palette="04"] {
 --ef-color-1:#FF845E; /* Coral; printed */
 --ef-color-2:#F5A9B8; /* Bubblegum Pink; printed */
 --ef-color-3:#FFE382; /* Jasmine; printed */
 --ef-color-4:#D7F9F1; /* Mint Green; printed */
 --ef-color-5:#9AD4D6; /* Tiffany Blue; printed */
 --ef-color-6:#C9BBF4; /* Periwinkle; printed */
}

/* Semantic roles intentionally preserve the exact palette swatches. */
.ef-brand {
 color:var(--ef-ink);background:var(--ef-paper);font-family:var(--ef-body);
 font-size:var(--ef-text);line-height:1.6;font-synthesis:none;font-optical-sizing:auto;
}
.ef-brand *, .ef-brand *::before, .ef-brand *::after {box-sizing:border-box}
.ef-brand :where(h1,h2,h3) {font-family:var(--ef-display);font-weight:400;font-style:normal;font-kerning:normal;font-variant-ligatures:common-ligatures;margin:0 0 24px}
.ef-brand h1 {font-size:var(--ef-h1);line-height:1.08;letter-spacing:-.015em}
.ef-brand h2 {font-size:var(--ef-h2);line-height:1.16;letter-spacing:-.012em}
.ef-brand h3 {font-size:var(--ef-h3);line-height:1.25;letter-spacing:-.008em}
.ef-brand :where(button,input,select,textarea) {font-family:var(--ef-body);font-size:1rem;line-height:1.5}
.ef-brand p {max-width:62ch}
.ef-lead {font-size:var(--ef-lead);line-height:1.5;max-width:46ch}
.ef-eyebrow {font-size:12px;line-height:18px;font-weight:500;letter-spacing:.07em;text-transform:uppercase}
.ef-button {display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:48px;padding:12px 22px;border:1px solid var(--ef-ink);background:var(--ef-ink);color:var(--ef-paper);font-family:var(--ef-body);font-size:16px;font-weight:500;line-height:24px;text-decoration:none;cursor:pointer}
.ef-button:hover {text-decoration:underline;text-underline-offset:4px}
.ef-button--secondary {color:var(--ef-ink);background:var(--ef-paper)}
.ef-brand :focus-visible {outline:2px solid var(--ef-ink);outline-offset:5px}
.ef-logo {display:block;width:clamp(240px,24vw,340px);height:auto;max-width:100%}
.ef-monogram {display:block;min-width:64px;height:auto}
.ef-field-1 {background:var(--ef-color-1)} .ef-field-2 {background:var(--ef-color-2)}
.ef-field-3 {background:var(--ef-color-3)} .ef-field-4 {background:var(--ef-color-4)}
.ef-field-5 {background:var(--ef-color-5)} .ef-field-6 {background:var(--ef-color-6)}
/* Do not assume all palette fields pass contrast for small text.
   Use paper/ink for copy and controls. Light-on-white logos are decorative only.
   SVGs loaded via <img> do not inherit CSS color; use a supplied color variant,
   or inline the SVG and replace its fill without altering the path geometry. */