/* Moonflow ToolHub design tokens — combined verbatim from the design-system project (tokens/*.css). */
/* Webfonts shipped with moonflow-media.de. Gotham = body/UI face, Montserrat = display face. */
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-XLight.woff2') format('woff2'),url('../font/Gotham/Gotham-XLight.woff') format('woff');font-weight:200;font-style:normal;font-display:swap}
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-XLightItalic.woff2') format('woff2'),url('../font/Gotham/Gotham-XLightItalic.woff') format('woff');font-weight:200;font-style:italic;font-display:swap}
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-Light.woff2') format('woff2'),url('../font/Gotham/Gotham-Light.woff') format('woff');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-LightItalic.woff2') format('woff2'),url('../font/Gotham/Gotham-LightItalic.woff') format('woff');font-weight:300;font-style:italic;font-display:swap}
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-Book.woff2') format('woff2'),url('../font/Gotham/Gotham-Book.woff') format('woff');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-Medium.woff2') format('woff2'),url('../font/Gotham/Gotham-Medium.woff') format('woff');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Gotham';src:url('../font/Gotham/Gotham-Bold.woff2') format('woff2'),url('../font/Gotham/Gotham-Bold.woff') format('woff');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-Light.woff2') format('woff2');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-Regular.woff2') format('woff2');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-Medium.woff2') format('woff2');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-SemiBold.woff2') format('woff2');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-Bold.woff2') format('woff2');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-ExtraBold.woff2') format('woff2');font-weight:800;font-style:normal;font-display:swap}
@font-face{font-family:'Montserrat';src:url('../font/Montserrat/Montserrat-Black.woff2') format('woff2');font-weight:900;font-style:normal;font-display:swap}

:root{
/* ---- Brand ---- */
--moonflow-purple:#7a1b8b;
--moonflow-purple-light:#9B4B9D;
--moonflow-purple-deep:#7F227C;
--moonflow-violet:#743ad5;
--moonflow-ink:#3E4E7E;
--moonflow-gradient:linear-gradient(45deg,var(--moonflow-purple),var(--moonflow-purple-light));
--moonflow-gradient-135:linear-gradient(135deg,var(--moonflow-purple),var(--moonflow-purple-light));
--moonflow-border-gradient:linear-gradient(to left,#743ad5,#7F227C);
/* ---- Neutrals ---- */
--white:#ffffff;--gray-50:#f8f9fa;--gray-200:#eeeeee;--gray-300:#dee2e6;--gray-600:#6c757d;--gray-700:#495057;--gray-900:#212529;--footer-ink:#1a1e23;
/* ---- Semantic status ---- */
--status-available:#e8f5e9;--status-pending:#fff3e0;--status-booked:#ffebee;--status-blocked:#eeeeee;
/* ---- Semantic aliases ---- */
--text-heading:var(--moonflow-purple);--text-body:var(--gray-900);--text-muted:var(--gray-600);--text-strong:var(--gray-700);--text-on-brand:var(--white);
--surface-page:var(--white);--surface-card:var(--white);--surface-subtle:var(--gray-50);--surface-footer:var(--footer-ink);--surface-brand:var(--moonflow-gradient);
--border-hairline:var(--gray-300);--border-subtle:#eeeeee;--focus-ring:rgba(123,27,139,.25);--overlay-scrim:rgba(0,0,0,.2);--overlay-chip:rgba(255,255,255,.9);

/* ---- Typography ---- */
--font-body:'Gotham',sans-serif;--font-display:'Montserrat',sans-serif;--font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
--fw-xlight:200;--fw-light:300;--fw-book:400;--fw-medium:500;--fw-bold:700;--fw-black:900;
--fs-display-4:3.5rem;--fs-stat:3rem;--fs-h1:2.5rem;--fs-project-title:3rem;--fs-h2:2rem;--fs-h3:1.5rem;--fs-h4:1.3rem;--fs-h5:1.25rem;
--fs-lead:1.1rem;--fs-body:1rem;--fs-sm:.95rem;--fs-xs:.9rem;--fs-2xs:.85rem;--fs-3xs:.8rem;
--lh-tight:1.1;--lh-heading:1.2;--lh-body:1.5;--lh-prose:1.8;

/* ---- Spacing ---- */
--space-1:.25rem;--space-2:.5rem;--space-3:1rem;--space-4:1.5rem;--space-5:3rem;--space-05:.125rem;--space-25:.75rem;
--card-pad:1.5rem;--card-pad-sm:1rem;--section-pad-y:3rem;--hero-pad-y:5rem;--hero-pad-y-sm:3rem;--grid-gutter:1.5rem;
--container-max:1320px;--content-max:1200px;--video-max:1300px;

/* ---- Radius ---- */
--radius-sm:3px;--radius-md:8px;--radius-lg:10px;--radius-xl:15px;--radius-2xl:20px;--radius-pill:20px;--radius-full:50%;
--border-hairline-w:1px;--border-accent-w:3px;

/* ---- Elevation ---- */
--shadow-navbar:0 2px 10px rgba(0,0,0,.1);--shadow-xs:0 2px 4px rgba(0,0,0,.1);--shadow-sm:0 3px 10px rgba(0,0,0,.1);
--shadow-card:0 4px 8px rgba(0,0,0,.1);--shadow-md:0 5px 15px rgba(0,0,0,.1);--shadow-lg:0 10px 30px rgba(0,0,0,.1);
--shadow-hover:0 8px 25px rgba(116,58,213,.1);--shadow-hover-sm:0 8px 20px rgba(116,58,213,.1);
--shadow-btn-hover:0 4px 15px rgba(123,27,139,.3);--focus-shadow:0 0 0 .2rem rgba(123,27,139,.25);
--lift-y:-5px;--lift-y-sm:-2px;

/* ---- Motion ---- */
--ease:ease;--ease-out:ease-out;--dur-fast:.2s;--dur-base:.3s;--dur-slow:.5s;--dur-carousel:.6s;
--t-lift:transform var(--dur-base) var(--ease),box-shadow var(--dur-base) var(--ease);
--t-lift-fast:transform var(--dur-fast) var(--ease),box-shadow var(--dur-fast) var(--ease);
--t-underline:transform var(--dur-base) var(--ease);
--zoom-hover:1.05;
}

/* ---- Base ---- */
body{font-family:var(--font-body);color:var(--text-body);background:var(--surface-page)}
h1,h2,h3,h4,h5,h6{line-height:var(--lh-heading)}
a{color:var(--moonflow-purple);text-decoration:none;transition:color var(--dur-fast) var(--ease)}
a:hover{color:var(--moonflow-purple-light)}
.mf-gradient-rule{height:var(--border-accent-w);background:var(--moonflow-gradient)}
.mf-section-title{position:relative;color:var(--moonflow-purple);margin-bottom:2rem;padding-bottom:1rem}
.mf-section-title::after{content:'';position:absolute;bottom:0;left:0;width:100px;height:var(--border-accent-w);background:var(--moonflow-gradient)}