@font-face { font-family: "Sora"; font-weight: 400; font-style: normal; font-display: swap; src: url(//retreva.de/wp-content/themes/retreva/assets/fonts/sora/Sora-Regular.woff2) format("woff2"); }
@font-face { font-family: "Sora"; font-weight: 500; font-style: normal; font-display: swap; src: url(//retreva.de/wp-content/themes/retreva/assets/fonts/sora/Sora-Medium.woff2) format("woff2"); }
@font-face { font-family: "Sora"; font-weight: 600; font-style: normal; font-display: swap; src: url(//retreva.de/wp-content/themes/retreva/assets/fonts/sora/Sora-SemiBold.woff2) format("woff2"); }
@font-face { font-family: "Sora"; font-weight: 700; font-style: normal; font-display: swap; src: url(//retreva.de/wp-content/themes/retreva/assets/fonts/sora/Sora-Bold.woff2) format("woff2"); }
@font-face { font-family: "DM Sans"; font-weight: 400 700; font-style: normal; font-display: swap; src: url(//retreva.de/wp-content/themes/retreva/assets/fonts/dm-sans/DMSans-400-700.woff2) format("woff2"); }
:root { --c-ink: #14243A; --c-navy: #1E3D63; --c-link: #2A5A8A; --c-book: #F7C548; --c-on-book: #1B1606;
--c-star: #F2B83A;
--c-text: #14243A;
--c-text-2: #33475B;
--c-muted: #4A5D70;
--c-placeholder: #647587;
--c-disabled: #B7C1CB;
--c-on-navy: #FFFFFF;
--c-on-navy-2: #C6D4E2;
--c-bg: #F4F6F8;
--c-surface: #FFFFFF;
--c-surface-2: #EEF2F5;
--c-discovery-shade: rgb(0 0 0 / .6);
--c-gallery-matte: #F3F3F3;
--c-gallery-backdrop: rgb(0 0 0 / .72);
--c-dialog-backdrop: rgb(0 0 0 / .42);
--c-navy-tint: #E8F0F8;
--c-line: #E1E7ED;
--c-line-strong: #C9D3DD;
--c-line-field: #7F8E9E;
--c-overlay: #14243A;
--c-heart: #E8505B; --c-hero-text: #FFFFFF;
--c-hero-shade: rgb(0 0 0 / 56%);
--c-hero-credit-bg: rgb(0 0 0 / 65%);
--c-hero-credit-line: rgb(255 255 255 / 45%);
--c-card-chip-bg: var(--c-navy-tint);
--c-card-chip-text: var(--c-ink);
--card-motion-duration: var(--dur-4);
--card-motion-ease: var(--ease-emphasized);
--card-hover-lift: -3px; --c-error: #B3261E;   --c-error-bg: #FCECEA;   --c-error-text: #8C1D18;
--c-warning: #A8551C; --c-warning-bg: #FBEFE6; --c-warning-text: #6B3A12;
--c-success: #2E7D4F; --c-success-bg: #E8F4EC; --c-success-text: #1D5235;
--c-info: #2A5A8A;    --c-info-bg: #E8F0F8;    --c-info-text: #1E3D63; --c-season-winter: #E9EFF6;
--c-season-autumn: #F5EFE6;
--c-season-spa: #E6F0F0; --list-marker: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 12'%3E%3Cellipse cx='9' cy='9.1' rx='7.6' ry='2.7'/%3E%3Cellipse cx='8.2' cy='3.9' rx='4.7' ry='2.2'/%3E%3C/svg%3E");
--c-list-marker: #2A5A8A;
--c-list-marker-on-dark: #C6D4E2; --ff-head: "Sora", system-ui, -apple-system, "Segoe UI", sans-serif;
--ff-body: "DM Sans", system-ui, -apple-system, "Segoe UI", sans-serif;
--fs-display: clamp(40px, 5.2vw, 76px); --fs-h1: clamp(32px, 3.7vw, 52px); --fs-h1-small: clamp(16px, 1.4vw, 20px); --fs-h2-lg: clamp(30px, 3.1vw, 44px); --fs-h2: clamp(26px, 2.4vw, 34px); --fs-h3: 22px; --fs-h4: 18px; --fs-eyebrow: 13px; --fs-lead: 18px; --fs-body: 16px; --fs-small: 14px; --fs-caption: 13px;  --sp-1: 4px; --sp-2: 8px; --sp-3: 12px; --sp-4: 16px; --sp-5: 20px; --sp-6: 24px;
--sp-7: 32px; --sp-8: 40px; --sp-9: 48px; --sp-10: 64px; --sp-11: 80px; --sp-12: 96px;
--section-gap: clamp(64px, 7vw, 104px); --r-sm: 10px; --r-md: 14px; --r-lg: 18px; --r-xl: 22px; --r-2xl: 28px; --r-pill: 999px;  --sh-1: 0 2px 4px rgba(20, 36, 58, .05), 0 12px 32px rgba(20, 36, 58, .07); --sh-2: 0 2px 4px rgba(20, 36, 58, .06), 0 18px 44px rgba(20, 36, 58, .12); --sh-3: 0 4px 10px rgba(20, 36, 58, .06), 0 30px 70px rgba(20, 36, 58, .2);  --focus-ring: 2px solid var(--c-link);
--focus-offset: 2px;
--focus-halo: 0 0 0 4px var(--c-navy-tint); --container: 1312px;
--gutter: 24px;
--page-pad: 64px; --header-h: 80px; --header-h-mobile: 60px; --touch: 44px;  --ease: cubic-bezier(.2, .7, .2, 1); --ease-emphasized: cubic-bezier(.2, .65, .3, 1); --ease-exit: cubic-bezier(.4, 0, 1, 1); --dur-1: 120ms; --dur-2: 220ms; --dur-3: 360ms; --dur-4: 420ms; --z-header: 50; --z-dropdown: 60; --z-pricebar: 70; --z-sheet: 80; --z-modal: 90; --z-toast: 100; --z-consent: 110;
} @media (max-width: 1199px) { :root { --page-pad: 32px; } }
@media (max-width: 767px)  { :root { --page-pad: 16px; --gutter: 16px; } }