/* ==========================================================================
   Wedding Circle International – Stylesheet
   1. Schriften (lokal, DSGVO-konform – kein Google-Fonts-Aufruf)
   2. Design-Tokens (Farben, Typografie, Abstände …) aus dem Design-System
   3. Basis
   4. Layout & Komponenten
   ========================================================================== */

/* 1. Schriften ------------------------------------------------------------
   Ersatzschriften: Bodoni Seventy Two ITC → Bodoni Moda, Futura PT → Jost,
   Cover-Script → Pinyon Script. Bei lizenzierten Originalschriften hier tauschen. */
@font-face{font-family:"Bodoni Moda";font-style:normal;font-display:swap;font-weight:400 900;src:url(../fonts/bodoni-moda-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bodoni Moda";font-style:normal;font-display:swap;font-weight:400 900;src:url(../fonts/bodoni-moda-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-display:swap;font-weight:400 900;src:url(../fonts/bodoni-moda-latin-wght-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Bodoni Moda";font-style:italic;font-display:swap;font-weight:400 900;src:url(../fonts/bodoni-moda-latin-ext-wght-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Jost";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/jost-latin-wght-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Jost";font-style:normal;font-display:swap;font-weight:100 900;src:url(../fonts/jost-latin-ext-wght-normal.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Jost";font-style:italic;font-display:swap;font-weight:100 900;src:url(../fonts/jost-latin-wght-italic.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Jost";font-style:italic;font-display:swap;font-weight:100 900;src:url(../fonts/jost-latin-ext-wght-italic.woff2) format("woff2");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:"Pinyon Script";font-style:normal;font-display:swap;font-weight:400;src:url(../fonts/pinyon-script-latin-400-normal.woff2) format("woff2")}

/* 2. Design-Tokens ---------------------------------------------------------- */
:root{
  /* --- Base palette: gold ------------------------------------------------ */
  --wc-gold-700:#8F6113;
  --wc-gold-600:#A8741B;
  --wc-gold-500:#D89820; /* sampled from the logo rings + cover script */
  --wc-gold-400:#E2B05A;
  --wc-gold-200:#EFD9A6;
  --wc-gold-100:#F8EFDC;
  --wc-gold-050:#FCF8F0;

  /* --- Base palette: ink / neutral -------------------------------------- */
  --wc-ink-900:#0B0B0A; /* brochure serif headlines print near-black */
  --wc-ink-800:#1C1B19;
  --wc-ink-700:#33312D;
  --wc-ink-600:#57544E;
  --wc-ink-500:#7A766F;
  --wc-ink-400:#9A9A9A; /* logo wordmark grey */
  --wc-ink-300:#C4C3C0;
  --wc-ink-200:#DEDDDA;
  --wc-ink-100:#EDEDED; /* brochure back-cover ground */
  --wc-ink-050:#F6F5F3;
  --wc-white:#FFFFFF;

  /* --- Base palette: warm stone (photography undertone) ----------------- */
  --wc-stone-300:#C9BEB0;
  --wc-stone-200:#E2D9CD;
  --wc-stone-100:#F1EBE2;

  /* --- Semantic: text --------------------------------------------------- */
  --text-display:var(--wc-ink-900);
  --text-heading:var(--wc-ink-900);
  --text-body:var(--wc-ink-700);
  --text-muted:var(--wc-ink-500);
  --text-subtle:var(--wc-ink-400);
  --text-accent:var(--wc-gold-600);
  --text-on-dark:var(--wc-white);
  --text-on-dark-muted:rgba(255,255,255,.72);
  --text-on-gold:var(--wc-ink-900);
  --text-link:var(--wc-gold-600);
  --text-link-hover:var(--wc-ink-900);

  /* --- Semantic: surfaces ---------------------------------------------- */
  --surface-page:var(--wc-white);
  --surface-page-alt:var(--wc-ink-100);
  --surface-card:var(--wc-white);
  --surface-card-alt:var(--wc-ink-050);
  --surface-inset:var(--wc-gold-050);
  --surface-dark:var(--wc-ink-900);
  --surface-accent:var(--wc-gold-500);
  --surface-scrim:rgba(11,11,10,.42);
  --surface-veil:rgba(255,255,255,.86);

  /* --- Semantic: lines -------------------------------------------------- */
  --border-hairline:var(--wc-ink-200);
  --border-strong:var(--wc-ink-900);
  --border-accent:var(--wc-gold-500);
  --border-on-dark:rgba(255,255,255,.26);
  --rule-gold:var(--wc-gold-500); /* the gold vertical rule beside contacts */

  /* --- Semantic: interactive ------------------------------------------- */
  --action-primary-bg:var(--wc-ink-900);
  --action-primary-fg:var(--wc-white);
  --action-primary-bg-hover:var(--wc-gold-500);
  --action-primary-fg-hover:var(--wc-ink-900);
  --action-gold-bg:var(--wc-gold-500);
  --action-gold-bg-hover:var(--wc-gold-600);
  --action-ghost-fg:var(--wc-ink-900);
  --action-ghost-border:var(--wc-ink-900);
  --action-disabled-bg:var(--wc-ink-200);
  --action-disabled-fg:var(--wc-ink-400);
  --focus-ring:var(--wc-gold-500);

  /* --- Semantic: status (minimal — forms only) ------------------------- */
  --status-error:#9B2C22;
  --status-error-bg:#FBF0EE;
  --status-success:#4A6B3C;
  --status-success-bg:#F1F5EE;
}

:root{
  /* --- Families ---------------------------------------------------------- */
  --font-display:"Bodoni Moda","Bodoni 72","Bodoni Seventy Two ITC",Didot,"Times New Roman",serif;
  --font-sans:"Jost","Futura PT",Futura,"Century Gothic",system-ui,sans-serif;
  --font-script:"Pinyon Script","Snell Roundhand",cursive;
  --font-body:var(--font-sans);

  /* --- Size scale (1.25 major third, 16px base) ------------------------- */
  --text-3xs:.6875rem; /* 11px — impressum, photo credits */
  --text-2xs:.75rem;   /* 12px — eyebrow, meta */
  --text-xs:.8125rem;  /* 13px — captions, chips */
  --text-sm:.9375rem;  /* 15px — dense body, form labels */
  --text-base:1.0625rem;/* 17px — body */
  --text-md:1.25rem;   /* 20px — lead paragraph */
  --text-lg:1.5rem;    /* 24px — card title */
  --text-xl:2rem;      /* 32px — section heading */
  --text-2xl:2.75rem;  /* 44px — page heading */
  --text-3xl:3.75rem;  /* 60px — hero */
  --text-4xl:5.25rem;  /* 84px — cover wordmark */

  /* --- Weights ---------------------------------------------------------- */
  --weight-light:300;
  --weight-regular:400;
  --weight-medium:500;
  --weight-semibold:600;

  /* --- Line heights ----------------------------------------------------- */
  --leading-tight:1.02;  /* display serif, all-caps */
  --leading-snug:1.2;
  --leading-normal:1.45;
  --leading-relaxed:1.62; /* brochure body copy */

  /* --- Tracking ---------------------------------------------------------- */
  --tracking-display:.005em;
  --tracking-normal:0em;
  --tracking-wide:.06em;
  --tracking-wider:.14em;  /* "INTERNATIONAL", eyebrows */
  --tracking-widest:.24em; /* vertical spine labels */

  /* --- Composite roles -------------------------------------------------- */
  --type-display:var(--weight-regular) var(--text-3xl)/var(--leading-tight) var(--font-display);
  --type-h1:var(--weight-regular) var(--text-2xl)/var(--leading-tight) var(--font-display);
  --type-h2:var(--weight-regular) var(--text-xl)/var(--leading-snug) var(--font-display);
  --type-h3:var(--weight-regular) var(--text-lg)/var(--leading-snug) var(--font-display);
  --type-lead:var(--weight-light) var(--text-md)/var(--leading-normal) var(--font-sans);
  --type-body:var(--weight-light) var(--text-base)/var(--leading-relaxed) var(--font-sans);
  --type-body-sm:var(--weight-light) var(--text-sm)/var(--leading-relaxed) var(--font-sans);
  --type-eyebrow:var(--weight-medium) var(--text-2xs)/1.3 var(--font-sans);
  --type-label:var(--weight-medium) var(--text-sm)/1.3 var(--font-sans);
  --type-caption:var(--weight-light) var(--text-xs)/var(--leading-normal) var(--font-sans);
  --type-credit:var(--weight-light) var(--text-3xs)/1.4 var(--font-sans);
}

:root{
  --space-0:0;
  --space-1:.25rem;  /* 4  */
  --space-2:.5rem;   /* 8  */
  --space-3:.75rem;  /* 12 */
  --space-4:1rem;    /* 16 */
  --space-5:1.5rem;  /* 24 */
  --space-6:2rem;    /* 32 */
  --space-7:2.75rem; /* 44 */
  --space-8:3.5rem;  /* 56 */
  --space-9:5rem;    /* 80 */
  --space-10:7rem;   /* 112 */
  --space-11:9.5rem; /* 152 */

  /* Layout */
  --gutter:var(--space-5);
  --gutter-lg:var(--space-6);
  --measure:34rem;          /* comfortable body measure ~62ch */
  --measure-narrow:26rem;
  --container:76rem;        /* 1216px editorial max */
  --container-wide:88rem;
  --section-y:var(--space-10);
  --section-y-sm:var(--space-8);
  --header-h:4.75rem;

  /* Brochure page geometry (A4 portrait, 1:1.4142) */
  --page-ratio:.7071; /* @kind other */
}

:root{
  /* The brochure is square-cornered print. Radii stay near zero; only
     pills (chips, language toggle) and the flipbook page edge round. */
  --radius-none:0;
  --radius-xs:1px;
  --radius-sm:2px;
  --radius-md:3px;
  --radius-pill:999px;
  --radius-circle:50%;
}

:root{
  /* Elevation is used sparingly and always warm-neutral, never blue-grey.
     Cards on the site sit on hairlines; only lifted/floating things cast. */
  --shadow-none:none;
  --shadow-hairline:0 0 0 1px var(--border-hairline);
  --shadow-card:0 1px 2px rgba(11,11,10,.04),0 8px 24px -12px rgba(11,11,10,.10);
  --shadow-card-hover:0 2px 4px rgba(11,11,10,.05),0 18px 40px -16px rgba(11,11,10,.18);
  --shadow-float:0 24px 60px -20px rgba(11,11,10,.32);
  --shadow-page:0 30px 70px -28px rgba(11,11,10,.45); /* flipbook sheet */
  --shadow-inset-gutter:inset 14px 0 22px -14px rgba(11,11,10,.35); /* book spine */

  /* Protection gradients over photography (never a flat scrim on a hero) */
  --scrim-bottom:linear-gradient(to top,rgba(11,11,10,.62) 0%,rgba(11,11,10,.28) 34%,rgba(11,11,10,0) 68%); /* @kind other */
  --scrim-top:linear-gradient(to bottom,rgba(11,11,10,.46) 0%,rgba(11,11,10,0) 60%); /* @kind other */
  --scrim-full:linear-gradient(to top,rgba(11,11,10,.55),rgba(11,11,10,.18)); /* @kind other */

  /* Blur is reserved for the fixed header once scrolled */
  --blur-header:saturate(120%) blur(14px); /* @kind other */
}

:root{
  /* Slow, weighted, no bounce. Luxury print moves like a turning page. */
  --ease-standard:cubic-bezier(.22,.61,.36,1); /* @kind other */
  --ease-out-soft:cubic-bezier(.16,.84,.44,1); /* @kind other */
  --ease-in-out:cubic-bezier(.65,.05,.36,1); /* @kind other */
  --ease-page:cubic-bezier(.42,0,.28,1); /* @kind other */ /* flipbook sheet rotation */

  --duration-instant:90ms; /* @kind other */
  --duration-fast:180ms; /* @kind other */
  --duration-base:280ms; /* @kind other */
  --duration-slow:520ms; /* @kind other */
  --duration-page:760ms; /* @kind other */
  --duration-reveal:900ms; /* @kind other */

  --transition-color:color var(--duration-fast) var(--ease-standard),background-color var(--duration-fast) var(--ease-standard),border-color var(--duration-fast) var(--ease-standard); /* @kind other */
  --transition-lift:transform var(--duration-base) var(--ease-out-soft),box-shadow var(--duration-base) var(--ease-out-soft); /* @kind other */
  --transition-image:transform var(--duration-reveal) var(--ease-out-soft),opacity var(--duration-slow) var(--ease-standard); /* @kind other */
}


/* 3. Basis ------------------------------------------------------------------ */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-padding-top:calc(var(--header-h) + 1rem)}
body{margin:0;background:var(--surface-page);color:var(--text-body);font:var(--type-body);text-wrap:pretty;-webkit-font-smoothing:antialiased;overflow-x:hidden}
h1,h2,h3,h4{margin:0;color:var(--text-heading);font-weight:var(--weight-regular)}
h1{font:var(--type-h1)}h2{font:var(--type-h2)}h3{font:var(--type-h3)}
p{margin:0 0 var(--space-4)}
p:last-child{margin-bottom:0}
a{color:var(--text-link);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--text-link) 40%,transparent);transition:var(--transition-color)}
a:hover{color:var(--text-link-hover);border-bottom-color:var(--text-link-hover)}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:1px solid var(--focus-ring);outline-offset:3px}
img{display:block;max-width:100%;height:auto}
button{font:inherit;color:inherit}
ul,ol{margin:0;padding:0}
::selection{background:var(--wc-gold-200);color:var(--wc-ink-900)}
.icon{flex:none;display:inline-block;vertical-align:middle}
[hidden]{display:none!important}
.sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.skip-link{position:absolute;left:var(--space-4);top:-4rem;z-index:100;background:var(--wc-ink-900);color:#fff;padding:var(--space-3) var(--space-4);border:0}
.skip-link:focus{top:var(--space-4);color:#fff}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* Hilfsklassen */
.block{display:block}
.mt-3{margin-top:var(--space-3)!important}.mt-4{margin-top:var(--space-4)!important}.mt-5{margin-top:var(--space-5)!important}.mt-6{margin-top:var(--space-6)!important}.mt-7{margin-top:var(--space-7)!important}.mt-8{margin-top:var(--space-8)!important}
.mb-3{margin-bottom:var(--space-3)!important}.mb-4{margin-bottom:var(--space-4)!important}.mb-5{margin-bottom:var(--space-5)!important}
.measure{max-width:var(--measure)}
.muted{color:var(--text-muted)}
.small{font:var(--type-body-sm)}
.upper{text-transform:uppercase;letter-spacing:var(--tracking-display)}
.h3{font:var(--type-h3)}
.display{font:var(--type-display);text-transform:uppercase;letter-spacing:var(--tracking-display)}
.lead{font:var(--type-lead)}
.claim,.signature{font:var(--weight-regular) var(--text-md)/1.45 var(--font-display);font-style:italic;color:var(--text-heading);margin:0}
.credit{font:var(--type-credit);color:var(--text-subtle);margin:0}
.credit--on-dark{color:rgba(255,255,255,.55)}
.eyebrow{display:inline-block;font:var(--type-eyebrow);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--text-accent);margin:0}
h2.eyebrow{display:block}
.eyebrow--light{color:var(--wc-gold-400)}
.eyebrow--muted{color:var(--text-muted)}
.eyebrow--widest{letter-spacing:var(--tracking-widest)}
.rule{display:block;width:2.75rem;height:1px;background:var(--rule-gold);flex:none}
.rule--long{width:4rem}
.todo{background:var(--wc-gold-100);color:var(--status-error);padding:0 .25em}
.notice{border-left:1px solid var(--rule-gold);background:var(--surface-inset);padding:var(--space-4) var(--space-5);font:var(--type-body-sm)}
.gold{color:var(--wc-gold-400)!important}

/* 4. Layout ---------------------------------------------------------------- */
.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--gutter-lg)}
.narrow{max-width:calc(46rem + 2 * var(--gutter-lg))}
.section{position:relative;padding-block:var(--section-y);overflow:hidden}
.section--sm{padding-block:var(--section-y-sm)}
.section--top{padding-top:var(--space-8)}
.section--compact{padding-bottom:var(--space-7)}
.section--compact-top{padding-top:var(--space-7)}
.section--alt{background:var(--surface-page-alt)}
.section--inset{background:var(--surface-inset)}
.section--dark{background:var(--surface-dark);color:var(--text-on-dark)}
.section--dark>.container{position:relative}
.texture{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.12;mix-blend-mode:screen;pointer-events:none}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,20rem),1fr));gap:var(--space-8);align-items:start}
.split--center{align-items:center}
.split--start{align-items:start}
.split--wide-gap{gap:var(--space-9)}
.grid{display:grid;gap:var(--space-5)}
.grid--cards{grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr))}
.grid--contacts{grid-template-columns:repeat(auto-fit,minmax(min(100%,13rem),1fr));gap:var(--space-6)}
.grid--contacts-sm{grid-template-columns:repeat(auto-fit,minmax(min(100%,11rem),1fr))}
.btn-row{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center}

/* Section heading */
.sh{display:flex;flex-direction:column;gap:var(--space-4);align-items:flex-start}
.sh__title{font:var(--type-h1);text-transform:uppercase;letter-spacing:var(--tracking-display);color:var(--text-heading)}
.sh--sm .sh__title{font:var(--type-h2)}
.sh--lg .sh__title{font:var(--type-display)}
.sh__lead{font:var(--type-lead);color:var(--text-body);max-width:var(--measure);margin:0}
.sh--dark .eyebrow{color:var(--wc-gold-400)}
.sh--dark .sh__title{color:var(--text-on-dark)}
.sh--dark .sh__lead{color:var(--text-on-dark-muted)}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-3);min-height:2.875rem;padding:.8125rem 1.75rem;border:1px solid var(--action-primary-bg);border-radius:0;background:var(--action-primary-bg);color:var(--action-primary-fg);font:var(--weight-medium) var(--text-2xs)/1.2 var(--font-sans);letter-spacing:var(--tracking-wider);text-transform:uppercase;text-decoration:none;white-space:nowrap;cursor:pointer;transition:var(--transition-color)}
.btn:hover{background:var(--action-primary-bg-hover);border-color:var(--action-primary-bg-hover);color:var(--action-primary-fg-hover)}
.btn:active{background:var(--wc-gold-600);border-color:var(--wc-gold-600)}
.btn--sm{min-height:2.25rem;padding:.5rem 1.125rem;font-size:var(--text-3xs)}
.btn--lg{min-height:3.375rem;padding:1.0625rem 2.5rem;font-size:var(--text-xs)}
.btn--full{width:100%}
.btn--gold{background:var(--action-gold-bg);border-color:var(--action-gold-bg);color:var(--text-on-gold)}
.btn--gold:hover{background:var(--action-gold-bg-hover);border-color:var(--action-gold-bg-hover);color:var(--text-on-gold)}
.btn--outline{background:transparent;color:var(--action-ghost-fg);border-color:var(--action-ghost-border)}
.btn--outline:hover{background:var(--wc-ink-900);color:#fff;border-color:var(--wc-ink-900)}
.btn--on-dark{color:#fff;border-color:var(--border-on-dark)}
.btn--on-dark:hover{background:#fff;color:var(--wc-ink-900);border-color:#fff}
.btn:disabled,.btn[disabled]{background:var(--action-disabled-bg);border-color:var(--action-disabled-bg);color:var(--action-disabled-fg);cursor:not-allowed}
.textlink{display:inline;padding:0;border:0;background:none;cursor:pointer;font:var(--type-eyebrow);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-accent);box-shadow:inset 0 -1px 0 currentColor;border-bottom:0}
.textlink:hover{color:var(--text-accent);box-shadow:inset 0 -1px 0 var(--wc-gold-500)}
.textlink--ink{color:var(--wc-ink-900)}
.textlink--ink:hover{color:var(--text-accent)}
.textlink[aria-expanded="true"]{color:var(--text-accent)}

/* Icon button */
.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;background:transparent;color:var(--wc-ink-900);border:1px solid var(--border-hairline);cursor:pointer;transition:var(--transition-color)}
.icon-btn:hover:not(:disabled){background:var(--wc-gold-050);border-color:var(--border-accent);color:var(--text-accent)}
.icon-btn:disabled{opacity:.4;cursor:not-allowed}
.icon-btn--dark{color:#fff;border-color:var(--border-on-dark)}
.icon-btn--dark:hover{background:rgba(255,255,255,.14);color:var(--wc-gold-400);border-color:var(--wc-gold-400)}

/* Tags */
.tags{display:flex;flex-wrap:wrap;gap:var(--space-2)}
.tag{display:inline-flex;align-items:center;gap:var(--space-2);padding:.5rem 1.0625rem;border:1px solid var(--border-hairline);border-radius:var(--radius-pill);background:transparent;color:var(--text-body);font:var(--weight-medium) var(--text-2xs)/1.3 var(--font-sans);letter-spacing:var(--tracking-wide);text-transform:uppercase;transition:var(--transition-color);align-self:flex-start}
a.tag,button.tag{cursor:pointer}
a.tag:hover,button.tag:hover{background:var(--wc-gold-050);border-color:var(--border-accent);color:var(--wc-ink-900)}
.tag.is-active{background:var(--wc-ink-900);border-color:var(--wc-ink-900);color:#fff}
.tag--sm{padding:.3125rem .75rem;font-size:var(--text-3xs)}
.tag__count{color:var(--text-subtle);font-variant-numeric:tabular-nums}
.tag.is-active .tag__count{color:var(--wc-gold-400)}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.94);-webkit-backdrop-filter:var(--blur-header);backdrop-filter:var(--blur-header);border-bottom:1px solid var(--border-hairline)}
.site-header__bar{display:flex;align-items:center;gap:var(--space-4);height:var(--header-h)}
.site-header__logo{display:flex;border:0;flex:none}
.logo{height:34px;width:auto}
.logo--on-dark{filter:brightness(0) invert(1)}
.site-nav{display:flex;gap:var(--space-6);margin-left:auto}
.site-nav a{font:var(--type-eyebrow);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--wc-ink-900);border:0;padding-bottom:3px}
.site-nav a:hover,.site-nav a[aria-current="page"]{color:var(--wc-gold-500)}
.site-nav a[aria-current="page"]{box-shadow:inset 0 -1px 0 var(--wc-gold-500)}
.site-header__actions{display:flex;align-items:center;gap:var(--space-3);margin-left:auto}
/* Erstgespräch-Button vor der Sprachwahl, mit 3-fachem Abstand (12px Gap + 24px) */
.site-header__cta{margin-right:var(--space-5)}
.site-header__menu{display:none}
.icon-btn__close{display:none}
.site-header__menu[aria-expanded="true"] .icon-btn__open{display:none}
.site-header__menu[aria-expanded="true"] .icon-btn__close{display:inline-flex}
.mobile-nav{display:flex;flex-direction:column;gap:var(--space-1);padding-bottom:var(--space-5)}
.mobile-nav[hidden]{display:none}
.mobile-nav a:not(.btn){display:flex;align-items:center;min-height:48px;font:var(--type-label);letter-spacing:var(--tracking-wider);text-transform:uppercase;color:var(--wc-ink-900);border-bottom:1px solid var(--border-hairline)}
.mobile-nav a[aria-current="page"]{color:var(--wc-gold-500)}
.mobile-nav .btn{margin-top:var(--space-4)}
/* Header über dem Hero (Startseite), bis gescrollt wird */
.js .site-header--hero:not(.is-solid){position:fixed;left:0;right:0;background:transparent;border-bottom-color:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
.js .site-header--hero:not(.is-solid) .logo{filter:brightness(0) invert(1)}
.js .site-header--hero:not(.is-solid) .site-nav a{color:#fff}
.js .site-header--hero:not(.is-solid) .site-nav a[aria-current="page"]{color:var(--wc-gold-400)}
.js .site-header--hero:not(.is-solid) .lang-toggle{border-color:var(--border-on-dark)}
.js .site-header--hero:not(.is-solid) .lang-toggle a{color:var(--text-on-dark-muted)}
.js .site-header--hero:not(.is-solid) .lang-toggle a.is-active{background:#fff;color:var(--wc-ink-900)}
.js .site-header--hero:not(.is-solid) .icon-btn{color:#fff;border-color:var(--border-on-dark)}
.js .site-header--hero.is-solid{position:fixed;left:0;right:0}

/* Sprachumschalter */
.lang-toggle{display:inline-flex;border:1px solid var(--border-hairline);border-radius:var(--radius-pill);overflow:hidden}
.lang-toggle a{display:inline-flex;align-items:center;justify-content:center;min-width:2.875rem;min-height:2.25rem;padding:0 var(--space-3);border:0;font:var(--type-eyebrow);letter-spacing:var(--tracking-wider);color:var(--text-muted)}
.lang-toggle a:hover{color:var(--wc-ink-900)}
.lang-toggle a.is-active{background:var(--wc-ink-900);color:#fff}
.lang-toggle--dark{border-color:var(--border-on-dark)}
.lang-toggle--dark a{color:var(--text-on-dark-muted)}
.lang-toggle--dark a:hover{color:#fff}
.lang-toggle--dark a.is-active{background:#fff;color:var(--wc-ink-900)}

/* Footer */
.site-footer{position:relative;overflow:hidden;background:var(--surface-dark);color:var(--text-on-dark);padding-block:var(--space-9) var(--space-6)}
.site-footer__grid{position:relative;display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,15rem),1fr));gap:var(--space-7)}
.site-footer__brand{display:flex;flex-direction:column;gap:var(--space-4)}
.site-footer__brand .logo{height:38px;align-self:flex-start}
.site-footer__brand p{font:var(--type-body-sm);color:var(--text-on-dark-muted);max-width:20rem;margin:0}
.site-footer__insta{font:var(--type-body-sm);color:var(--wc-gold-400);border:0}
.site-footer__col{display:flex;flex-direction:column;gap:var(--space-3);align-items:flex-start}
.site-footer__col a{font:var(--type-body-sm);color:var(--text-on-dark);border:0}
.site-footer__col a:hover,.site-footer__insta:hover{color:var(--wc-gold-400)}
.site-footer__col .credit{color:var(--text-on-dark-muted);max-width:22rem;margin-top:var(--space-2)}
.site-footer__social{display:flex;gap:var(--space-2);align-items:flex-start}

/* Hero Startseite */
.hero{position:relative;background:var(--wc-ink-900);overflow:hidden;min-height:min(92vh,56rem);display:flex;align-items:flex-end}
.hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 58%;filter:contrast(1.06) saturate(1.04)}
.hero__scrim{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(11,11,10,.5),rgba(11,11,10,0) 34%),linear-gradient(to top,rgba(11,11,10,.78),rgba(11,11,10,.3) 44%,rgba(11,11,10,0) 78%)}
.hero__inner{position:relative;padding-block:calc(var(--header-h) + var(--space-11)) var(--space-8);color:var(--text-on-dark)}
.hero__eyebrow{display:block;margin:var(--space-5) 0 var(--space-4)}
.hero__lead{color:var(--text-on-dark);max-width:34rem}
.hero .btn-row{margin-top:var(--space-6)}
.hero .credit{margin-top:var(--space-6)}
.lockup{display:inline-block;text-align:center;line-height:1;color:#fff;font-weight:400;--h:92px}
.lockup__script{display:block;font-family:var(--font-script);font-size:calc(var(--h) * .52);color:var(--wc-gold-500);margin-bottom:calc(var(--h) * -.17);margin-left:calc(var(--h) * -.5)}
.lockup__main{display:block;font-family:var(--font-display);font-size:var(--h);letter-spacing:var(--tracking-display);text-transform:uppercase}
.lockup__sub{display:block;font-family:var(--font-sans);font-size:max(9px,calc(var(--h) * .15));font-weight:var(--weight-light);letter-spacing:var(--tracking-widest);text-transform:uppercase;margin-top:calc(var(--h) * .06)}

/* Bildrahmen */
.frame{margin:0}
.frame__img{position:relative;overflow:hidden;background:var(--wc-ink-100)}
.frame__img img{width:100%;height:100%;object-fit:cover;transition:var(--transition-image)}
.frame--zoom:hover .frame__img img{transform:scale(1.035)}
.frame figcaption{margin-top:var(--space-3)}

/* Magazin-Teaser */
.teaser-cover{display:flex;justify-content:center}
.teaser-cover a{border:0;display:block;width:76%;max-width:420px;box-shadow:var(--shadow-page)}
.teaser-cover img{width:100%}
.page-jumps{display:flex;gap:var(--space-3);flex-wrap:wrap;margin-top:var(--space-3)}
.page-jumps a{display:block;width:68px;border:1px solid var(--border-hairline);background:#fff;transition:var(--transition-color)}
.page-jumps a:hover{border-color:var(--border-accent)}

/* Zielgruppen-Liste (dunkel) */
.dash-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-4)}
.dash-list li:not(.dash-list__cta){display:flex;gap:var(--space-4);align-items:baseline;font:var(--type-body);color:var(--text-on-dark);border-bottom:1px solid var(--border-on-dark);padding-bottom:var(--space-4)}
.dash-list li:not(.dash-list__cta)::before{content:"—";color:var(--wc-gold-500);flex:none}

/* Suche */
.search-row{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:center;margin:var(--space-6) 0}
.search{display:flex;align-items:center;gap:var(--space-3);height:2.875rem;padding:0 var(--space-4);background:var(--surface-card);border:1px solid var(--border-hairline);flex:1 1 18rem;color:var(--text-subtle);transition:border-color var(--duration-fast) var(--ease-standard)}
.search:focus-within{border-color:var(--border-accent)}
.search input{flex:1;min-width:0;border:0;background:transparent;font:var(--type-body-sm);color:var(--text-heading);outline:none}
.search--lg{height:3.5rem;flex:1 1 20rem}
.filter-row{display:flex;flex-wrap:wrap;gap:var(--space-4);align-items:stretch;margin-top:var(--space-6)}
.select{position:relative;display:block}
.select::after{content:"";position:absolute;right:2px;top:50%;width:7px;height:7px;border-right:1px solid var(--wc-ink-700);border-bottom:1px solid var(--wc-ink-700);transform:translateY(-70%) rotate(45deg);pointer-events:none}
.select select{appearance:none;-webkit-appearance:none;width:100%;padding-right:var(--space-6);cursor:pointer}
.select--box{flex:0 1 13rem}
.select--box select{height:3.5rem;padding:0 var(--space-7) 0 var(--space-4);border:1px solid var(--border-hairline);border-radius:0;background:var(--surface-card);font:var(--type-body-sm);color:var(--text-heading)}
.select--box::after{right:var(--space-4)}
.results-bar{display:flex;justify-content:space-between;align-items:baseline;gap:var(--space-4);margin-bottom:var(--space-5)}

/* Partner-Karte */
.card{position:relative;display:flex;flex-direction:column;gap:var(--space-3);padding:var(--space-5);background:var(--surface-card);border:1px solid var(--border-hairline);transition:var(--transition-lift),var(--transition-color)}
.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-card);border-color:var(--wc-ink-300)}
.card[hidden]{display:none}
.card__title{font:var(--type-h3);text-transform:uppercase;letter-spacing:var(--tracking-display)}
.card__title a{color:var(--text-heading);border:0}
.card__title a:hover{color:var(--text-accent)}
.card__role{font:var(--type-body-sm);color:var(--text-muted);margin:0}
.card__claim{font:var(--weight-regular) var(--text-base)/1.5 var(--font-display);font-style:italic;color:var(--text-body);margin:0}
.card__meta{font:var(--type-caption);color:var(--text-subtle);margin:auto 0 0;padding-top:var(--space-3)}
.card__actions{display:flex;flex-wrap:wrap;gap:var(--space-4);padding-top:var(--space-3);border-top:1px solid var(--border-hairline)}

/* Kontakt-Block (goldene Linie) */
.contact-panel{display:flex;flex-direction:column;gap:var(--space-2);padding-left:var(--space-4);border-left:1px solid var(--rule-gold)}
.contact-panel__name{font:var(--type-label);color:var(--text-heading)}
.contact-panel__role{font:var(--type-caption);color:var(--text-muted)}
.contact-panel dl{display:grid;grid-template-columns:auto 1fr;column-gap:var(--space-4);row-gap:var(--space-1);margin:var(--space-2) 0 0}
.contact-panel dt{font:var(--type-credit);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-subtle);padding-top:3px}
.contact-panel dd{margin:0;font:var(--type-body-sm);color:var(--text-body);overflow-wrap:anywhere}
.contact-panel dd a{color:inherit;border-bottom-color:var(--wc-gold-200)}
.contact-panel dd a:hover{color:var(--text-accent)}

/* Zitat */
.quote{margin:0;display:flex;flex-direction:column;gap:var(--space-5);padding:var(--space-6);background:#fff;border:1px solid var(--border-hairline)}
.quote__mark{font:var(--weight-regular) var(--text-2xl)/.6 var(--font-display);color:var(--wc-gold-500);height:.5em}
.quote blockquote{margin:0;font:var(--weight-regular) var(--text-md)/1.5 var(--font-display);font-style:italic;color:var(--text-subtle)}
.quote figcaption{margin-top:auto;display:flex;flex-direction:column;gap:var(--space-1)}

/* Breadcrumb */
.breadcrumb ol{list-style:none;display:flex;flex-wrap:wrap;gap:var(--space-2);font:var(--type-caption);color:var(--text-muted)}
.breadcrumb li+li::before{content:"/";margin-right:var(--space-2);color:var(--text-subtle)}
.breadcrumb a{color:var(--text-muted);border:0}
.breadcrumb a:hover{color:var(--text-accent)}

/* Partner-Profil */
.profile-head{display:flex;flex-direction:column;gap:var(--space-4);margin-top:var(--space-6);align-items:flex-start}
.profile-head__title{font:var(--type-h1);text-transform:uppercase;letter-spacing:var(--tracking-display)}
.profile-head .claim{max-width:var(--measure)}
.prose{max-width:var(--measure)}
.prose p{font:var(--type-body)}
.prose h2{margin:var(--space-7) 0 var(--space-3)}
.narrow.prose{max-width:calc(46rem + 2 * var(--gutter-lg))}
.bullet-list{list-style:none;display:flex;flex-direction:column;gap:var(--space-2);margin-top:var(--space-4);max-width:var(--measure)}
.bullet-list li{position:relative;padding-left:var(--space-5);font:var(--type-body)}
.bullet-list li::before{content:"—";position:absolute;left:0;color:var(--wc-gold-500)}
.spread{margin:0;position:sticky;top:calc(var(--header-h) + var(--space-5))}
.spread figcaption{display:block}
.spread__pages{display:grid;grid-template-columns:1fr 1fr;gap:2px;background:#fff;box-shadow:var(--shadow-card);border:0}
.spread__pages:hover{box-shadow:var(--shadow-card-hover)}

/* Formulare */
.form{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,12rem),1fr));gap:var(--space-5) var(--space-6);padding:clamp(1.25rem,4vw,2.75rem);border:1px solid var(--border-hairline)}
.form--card{background:var(--surface-card-alt)}
.form--veil{background:var(--surface-veil)}
.field{display:block}
.field--full{grid-column:1/-1}
.field__label{display:block;font:var(--type-eyebrow);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--text-muted);margin-bottom:var(--space-2)}
.req{color:var(--wc-gold-500)}
.field__input{width:100%;padding:.6875rem 0;background:transparent;border:0;border-bottom:1px solid var(--border-hairline);border-radius:0;font:var(--type-body);color:var(--text-heading);outline:none;transition:border-color var(--duration-fast) var(--ease-standard)}
.field__input:focus{border-bottom-color:var(--wc-gold-500)}
.field__input:focus-visible{outline:none}
.field__input::placeholder{color:var(--text-subtle)}
textarea.field__input{resize:vertical;min-height:6rem}
.checkbox{position:relative;display:flex;align-items:flex-start;gap:var(--space-3);cursor:pointer;font:var(--type-body-sm);color:var(--text-body)}
.checkbox input{position:absolute;opacity:0;width:18px;height:18px;margin:3px 0 0}
.checkbox__box{position:relative;flex:none;width:18px;height:18px;margin-top:3px;border:1px solid var(--wc-ink-300);transition:var(--transition-color)}
.checkbox input:checked+.checkbox__box{background:var(--wc-ink-900);border-color:var(--wc-ink-900)}
.checkbox input:checked+.checkbox__box::after{content:"";position:absolute;left:5px;top:2px;width:5px;height:9px;border-right:1.5px solid var(--wc-gold-500);border-bottom:1.5px solid var(--wc-gold-500);transform:rotate(40deg)}
.checkbox input:focus-visible+.checkbox__box{outline:1px solid var(--focus-ring);outline-offset:3px}
.form__submit{display:flex;align-items:center;gap:var(--space-5);flex-wrap:wrap}
.form__status{font:var(--type-body-sm);margin:0}
.form__status.is-success{color:var(--status-success)}
.form__status.is-error{color:var(--status-error)}
.form__status.is-info{color:var(--text-accent)}

/* Flipbook */
.flipbook-wrap{background:#fff;padding:var(--space-5);border:1px solid var(--border-hairline)}
.flipbook{display:flex;flex-direction:column;gap:var(--space-4);outline:none}
.flipbook__stage{position:relative;width:100%;background:var(--surface-page-alt)}
.flipbook__fallback{margin-inline:auto;max-height:80vh;width:auto}
.flipbook.is-ready .flipbook__fallback{display:none}
.flipbook__book{position:relative;width:100%;aspect-ratio:1.4142/1;perspective:2600px}
.flipbook__book::before{content:"";position:absolute;inset:0;box-shadow:var(--shadow-page);pointer-events:none}
.flipbook__leaf{position:absolute;top:0;left:50%;width:50%;height:100%;transform-origin:left center;transform-style:preserve-3d;transition:transform var(--duration-page) var(--ease-page)}
.flipbook__leaf.is-turned{transform:rotateY(-180deg);pointer-events:none}
.flipbook__side{position:absolute;inset:0;backface-visibility:hidden;-webkit-backface-visibility:hidden;background:#fff;overflow:hidden;box-shadow:var(--shadow-inset-gutter);cursor:pointer}
.flipbook__side--back{transform:rotateY(180deg);box-shadow:inset -14px 0 22px -14px rgba(11,11,10,.35)}
.flipbook__side img{width:100%;height:100%;object-fit:contain}
.flipbook__single{position:relative;width:100%;aspect-ratio:.7071/1;box-shadow:var(--shadow-page);background:#fff}
.flipbook__single img{width:100%;height:100%;object-fit:contain}
.flipbook__controls{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4)}
.flipbook__nav{display:flex;gap:var(--space-2)}
.flipbook__count{font-variant-numeric:tabular-nums}
.flipbook__rail{display:grid;grid-auto-flow:column;grid-auto-columns:84px;gap:var(--space-3);overflow-x:auto;padding:var(--space-4);background:var(--surface-card-alt);border:1px solid var(--border-hairline)}
.flipbook__rail[hidden]{display:none}
.flipbook__rail button{display:block;padding:0;border:1px solid var(--border-hairline);background:#fff;cursor:pointer}
.flipbook__rail button.is-active{border-color:var(--border-accent)}
.flipbook__rail button:not(.is-active) img{opacity:.78}
.jump-list{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,17rem),1fr));gap:0 var(--space-5)}
.jump-list li{display:flex;align-items:center;gap:var(--space-3);border-bottom:1px solid var(--border-hairline)}
.jump-list a[data-goto]{flex:1;display:flex;justify-content:space-between;gap:var(--space-3);padding:var(--space-3) 0;font:var(--type-body-sm);color:var(--text-body);border:0}
.jump-list a[data-goto]:hover,.jump-list a[data-goto].is-active{color:var(--text-accent)}
.jump-list__pages{font:var(--type-credit);color:var(--text-subtle);font-variant-numeric:tabular-nums;flex:none;align-self:center}
.jump-list__profile{font:var(--type-credit);letter-spacing:var(--tracking-wide);text-transform:uppercase;color:var(--wc-ink-900);border:0;box-shadow:inset 0 -1px 0 currentColor}

/* BNI Monaco */
.monaco-hero{position:relative;color:var(--text-on-dark);overflow:hidden;background:var(--wc-ink-900)}
.monaco-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 40%}
.monaco-hero__scrim{position:absolute;inset:0;background:var(--scrim-full)}
.monaco-hero__inner{position:relative;padding-block:var(--space-6)}
.monaco-hero__bar{display:flex;align-items:center;gap:var(--space-5);flex-wrap:wrap;justify-content:space-between}
.monaco-hero__bar a{border:0}
.monaco-hero__text{padding-block:var(--space-9) var(--space-8);max-width:48rem;display:flex;flex-direction:column;gap:var(--space-5);align-items:flex-start}
.monaco-hero__text .display{color:#fff}
.monaco-hero__sub{font:var(--weight-regular) var(--text-xl)/1.22 var(--font-display);font-style:italic;color:var(--wc-gold-400);margin:0}
.monaco-hero__text .lead{color:#fff;max-width:36rem}
.points{display:flex;flex-direction:column;gap:var(--space-5)}
.point{display:flex;gap:var(--space-4);padding-bottom:var(--space-5);border-bottom:1px solid var(--border-hairline)}
.point__icon{color:var(--wc-gold-500);flex:none;padding-top:4px}
.point h3{margin-bottom:var(--space-2)}
.monaco-footer{background:var(--surface-dark);color:var(--text-on-dark-muted);padding-block:var(--space-7)}
.monaco-footer__inner{display:flex;justify-content:space-between;gap:var(--space-5);flex-wrap:wrap;align-items:center}
.monaco-footer .logo{height:30px}
.monaco-footer .credit{color:var(--text-on-dark-muted);letter-spacing:var(--tracking-wide);text-transform:uppercase}
.monaco-footer a{color:var(--text-on-dark-muted);border:0}
.monaco-footer a:hover{color:var(--wc-gold-400)}

/* Responsive */
@media (max-width:899px){
  :root{--section-y:var(--space-8);--section-y-sm:var(--space-7);--gutter-lg:var(--space-5)}
  .lockup{--h:68px}
  .spread{position:static}
  .split--wide-gap{gap:var(--space-8)}
}
@media (max-width:767px){
  .site-nav,.site-header__cta{display:none}
  .site-header__menu{display:inline-flex}
  .logo{height:26px}
  .site-header--hero.menu-open{background:#fff}
}
@media (max-width:599px){
  :root{--gutter-lg:var(--space-4);--header-h:3.75rem;--section-y:var(--space-7);--section-y-sm:var(--space-6);--text-2xl:2rem;--text-3xl:2.5rem;--text-xl:1.625rem}
  .lockup{--h:52px}
  .hero__inner{padding-top:calc(var(--header-h) + var(--space-8))}
  .teaser-cover a{width:100%}
  .flipbook-wrap{padding:var(--space-3)}
  .lang-toggle a{min-width:2.5rem}
}
@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
@media print{.site-header,.site-footer,.flipbook__controls{display:none}}