/* dueseweb-newprod modernization overlay.
 *
 * Scoped under .dueseweb-modern (body class added by
 * wp/mu-plugins/10-modernize.php) so nothing leaks into wp-admin.
 *
 * Design spec:
 *   docs/superpowers/specs/2026-04-11-dueseweb-newprod-modernize-design.md
 */

/* ===== 0. Self-hosted fonts ======================================*/
@font-face {
    font-family: 'Fraunces';
    font-style: normal;
    font-weight: 400;
    /* `optional` instead of `swap`: avoids the late-load font-swap
       reflow that causes the reservation-page wahl-panel CLS 0.176.
       If Fraunces isn't ready within ~100 ms, the browser commits to
       the Georgia fallback for the remainder of the page lifetime —
       no swap = no shift. Fraunces is preloaded above so on warm-
       cache / fast networks it still renders. */
    font-display: optional;
    src: url('/wp-content/css/fonts/fraunces-400-latin.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: 'Fraunces';
    font-style: normal;
    font-weight: 400;
    font-display: optional;  /* see comment on first @font-face above */
    src: url('/wp-content/css/fonts/fraunces-400-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, 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: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('/wp-content/css/fonts/inter-latin.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: 'Inter';
    font-style: normal;
    font-weight: 400 700;
    font-display: swap;
    src: url('/wp-content/css/fonts/inter-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02AF, U+0304, U+0308, U+0329, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Atkinson Hyperlegible — purpose-built by the Braille Institute for
   low-vision readers. High x-height + open apertures + character
   differentiation (I/l/1, O/0). Sourced as the body font candidate
   for the `?font=atkinson` A/B toggle aimed at the elderly visitor
   audience (Feriendialyse patients average ~65 yrs). 53 KB total
   across 4 subset files. */
@font-face {
    font-family: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/wp-content/css/fonts/atkinson-hyperlegible-400-latin.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: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src: url('/wp-content/css/fonts/atkinson-hyperlegible-400-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, 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: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/wp-content/css/fonts/atkinson-hyperlegible-700-latin.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: 'Atkinson Hyperlegible';
    font-style: normal;
    font-weight: 700;
    font-display: swap;
    src: url('/wp-content/css/fonts/atkinson-hyperlegible-700-latin-ext.woff2') format('woff2');
    unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

/* Atkinson Hyperlegible is now the canonical body sans (2026-04-26
   evening — superseding the brief A/B toggle from commit 4eb9a5c4).
   The token swap below makes it the site-wide default; the
   `.dw-font-atkinson` class + URL toggle + footer button were removed
   in the same commit. Atkinson serves the patient audience (avg ~65 yrs)
   better than Inter on every legibility metric (x-height, apertures,
   character differentiation) without ever being measurably worse for
   younger readers. See docs/font-strategy-2026-04-26.md.

   Slight body letter-spacing applied via .dueseweb-modern below (not
   here on :root) so it scopes to our content, not theme/admin
   surfaces. */

/* ===== 1. Design tokens — Deep blue bg + warm peach text =========*/
.dueseweb-modern {
    /* Inverted palette: deep navy background with WARM PEACH
     * foreground text (--dw-ink/--dw-navy = #ffdcb8).
     *
     * Peach offers the best readability/contrast balance:
     *  - lighter than gold (#ffc94a), so higher luminance contrast
     *    on the dark navy bg — 11.5:1 vs 11.9:1 (both pass AA+++)
     *  - warm tone holds against the cool slideshow frames (turquoise
     *    water, blue skies) better than gold which competes with
     *    sandy beach tones
     *  - still "warm" feel — evokes vacation skin tone vs clinical
     *    bright white
     *
     * Token names are semantic misnomers after this pivot — kept
     * unchanged so sections 2-14 below didn't need a rewrite.
     *
     * Contrast reference (WCAG AA):
     *   #ffdcb8 on #0c4a78 (mid blue)  → 8.2:1   ✓
     *   #ffdcb8 on #061a2c (deep navy) → 13.2:1  ✓
     *   #ffdcb8 on #0e3558 (cards)     → 10.9:1  ✓
     */
    --dw-navy:         #ffdcb8;  /* PRIMARY TEXT — warm peach */
    --dw-navy-dark:    #031321;  /* deepest blue, footer bg */
    --dw-navy-soft:    #ffe9d3;  /* lighter peach, for hover */
    --dw-terracotta:   #ef6c3a;  /* burnt-orange CTA accent (decorative) */
    --dw-terracotta-dark: #d1501e;
    /* CTA-only variant — used as the BACKGROUND of buttons that carry
       white text. #ef6c3a:#ffffff is 3.05:1 (fails WCAG 2.2 AA 4.5:1);
       #bf501c:#ffffff is 4.57:1 (passes). The decorative --dw-terracotta
       above stays unchanged so accent strokes and icons keep their
       brand vibrancy. Added 2026-04-26 a11y pass. */
    --dw-terracotta-cta: #bf501c;
    /* Reisepartner-Zentrum (travel tier): olive. --dw-tier-travel = badge/marker/tile strip
       (ivory #fff4e4 text on it 5.24:1); -ink = text on ivory (#3e4a2c on #fff4e4 8.7:1). */
    --dw-tier-travel: #5f6b4a;
    --dw-tier-travel-ink: #3e4a2c;
    /* Reference tier (information only, no service): grey. --dw-tier-reference = pin/dot/strip
       (decorative); -ink = text on ivory/white (#4a4f54 on #fff4e4 7.2:1). */
    --dw-tier-reference: #8a8f94;
    --dw-tier-reference-ink: #4a4f54;
    /* Hover/focus/active state of a white-text CTA. --dw-terracotta-dark
       (#d1501e) is LIGHTER in luminance than the CTA base and only reaches
       4.31:1 against white (fails AA); #a3431a is 6.22:1 against #fff and
       4.79:1 against peach #ffdcb8. Added 2026-10-08 health review. */
    --dw-terracotta-cta-hover: #a3431a;
    --dw-sand:         #0c4a78;  /* mid blue, top of gradient */
    --dw-cream:        #0e3558;  /* card surface blue */
    --dw-clay:         #061a2c;  /* deep navy, bottom of gradient */
    --dw-ink:          #ffdcb8;  /* body text — warm peach */
    --dw-muted:        #fdba74;  /* secondary text — muted peach */
    --dw-border:       #1e5c87;  /* visible blue-on-blue borders */
    --dw-eucalyptus:   #fbbf24;  /* success — amber gold */

    /* Typography — T1 Fraunces (display) + Atkinson Hyperlegible (body)
       Atkinson Hyperlegible became the canonical body sans
       on 2026-04-26 evening; Inter is kept as the immediate
       fallback for the ~20-50 ms before Atkinson loads (and for
       visitors whose Atkinson fetch fails). */
    --dw-font-serif:   'Fraunces', Georgia, serif;
    --dw-font-sans:    'Atkinson Hyperlegible', 'Inter', -apple-system, 'Segoe UI', system-ui, sans-serif;
    /* Tabular-numeric variant — used on data surfaces (forecast
       heatmap, krankenkassen tables, phone numbers, currency, time-of-
       day stamps) so columns align cleanly. Atkinson supports
       `tabular-nums` via OpenType. */
    --dw-numeric-tabular: tabular-nums;

    /* Modular scale — ratio 1.250 */
    --dw-fs-xs:    0.875rem;
    --dw-fs-sm:    1rem;
    --dw-fs-base:  1.125rem;
    --dw-fs-lg:    1.25rem;
    --dw-fs-xl:    1.563rem;
    --dw-fs-2xl:   1.953rem;
    --dw-fs-3xl:   2.441rem;
    --dw-fs-4xl:   3.052rem;
    --dw-fs-5xl:   3.815rem;

    --dw-lh-tight: 1.2;
    --dw-lh-snug:  1.4;
    --dw-lh-base:  1.65;
    --dw-lh-loose: 1.8;

    /* Spacing — 8px grid */
    --dw-sp-1:  0.25rem;
    --dw-sp-2:  0.5rem;
    --dw-sp-3:  0.75rem;
    --dw-sp-4:  1rem;
    --dw-sp-5:  1.5rem;
    --dw-sp-6:  2rem;
    --dw-sp-7:  3rem;
    --dw-sp-8:  4rem;
    --dw-sp-9:  6rem;

    /* Layout */
    --dw-container: 1200px;
    --dw-measure:   68ch;
    --dw-radius-sm: 4px;
    --dw-radius-md: 8px;
    --dw-radius-lg: 16px;

    /* Shadows (navy-tinted, subtle) */
    --dw-shadow-sm: 0 1px 3px rgba(20, 41, 67, 0.06);
    --dw-shadow-md: 0 4px 12px rgba(20, 41, 67, 0.08);
    --dw-shadow-lg: 0 12px 32px rgba(20, 41, 67, 0.10);

    /* Motion */
    --dw-ease:       cubic-bezier(0.2, 0.8, 0.2, 1);
    --dw-dur-fast:   150ms;
    --dw-dur-base:   250ms;
}

/* ===== 2. Reset / base ===========================================*/
.dueseweb-modern *,
.dueseweb-modern *::before,
.dueseweb-modern *::after {
    box-sizing: border-box;
}
.dueseweb-modern img,
.dueseweb-modern picture,
.dueseweb-modern video {
    max-width: 100%;
    display: block;
}
.dueseweb-modern a {
    color: var(--dw-navy);
    text-decoration-color: rgba(30, 58, 95, 0.35);
    text-underline-offset: 0.18em;
    transition: color var(--dw-dur-fast) var(--dw-ease),
                text-decoration-color var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern a:hover {
    color: var(--dw-terracotta-dark);
    text-decoration-color: var(--dw-terracotta);
}

/* ===== 3. Typography + page background ==========================*/
/* NOTE: `.dueseweb-modern` is the <body> itself (added via
 * body_class filter), so `.dueseweb-modern body` matches nothing.
 * Use `body.dueseweb-modern`.
 *
 * Body is transparent — the background is a real DOM element
 * (#dw-bg-slideshow, injected by wp/mu-plugins/12-bg-slideshow.php)
 * that crossfades through destination photos. `html` has the
 * fallback dark-navy color so there's never a flash of white. */
html {
    background-color: #061a2c;
}
body.dueseweb-modern {
    font-family: var(--dw-font-sans);
    font-size:   var(--dw-fs-base);
    line-height: var(--dw-lh-base);
    color:       var(--dw-ink);
    background: transparent;
    min-height: 100vh;
    -webkit-font-smoothing: antialiased;
    text-rendering: optimizeLegibility;
    /* Slight letter-spacing for elderly-eye legibility (Atkinson body
       sans, default since 2026-04-26 evening). 0.005em is below the
       perception threshold for "looks spaced-out" but reduces letter-
       crowding for older readers. */
    letter-spacing: 0.005em;
}

/* Tabular-numeric scope — data surfaces where column alignment
   matters more than proportional digit spacing. Atkinson supports
   `tabular-nums` via OpenType. */
.dueseweb-modern .dw-occ-heatmap,
.dueseweb-modern .dw-occ-heatmap-cell,
.dueseweb-modern .dw-forecast-cell,
.dueseweb-modern .dw-finder-table,
.dueseweb-modern .dw-finder-table td,
.dueseweb-modern .dw-finder-table th,
.dueseweb-modern .dw-wahl-phone-num,
.dueseweb-modern .dw-cta[href^="tel:"],
.dueseweb-modern time,
.dueseweb-modern code,
.dueseweb-modern .dw-tile-rating,
.dueseweb-modern .dw-trust-badge {
    font-variant-numeric: var(--dw-numeric-tabular);
}

/* Background slideshow layers — 2 absolutely-positioned <div>s
 * inside a fixed container. JS swaps background-image and toggles
 * .active to crossfade. brightness filter keeps yellow text
 * readable over any of the ~50 rotation frames. */
#dw-bg-slideshow {
    position: fixed;
    inset: 0;
    z-index: -1;
    pointer-events: none;
    overflow: hidden;
    background-color: #061a2c;
}
#dw-bg-slideshow .dw-bg-layer {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    opacity: 0;
    transition: opacity 1500ms ease-in-out;
    /* Gentler darken — the glassy hero overlay adds another
     * dark layer on top, so two heavy filters compound into
     * an almost-black image. Leave the photo visible. */
    filter: brightness(0.78) saturate(1.1);
}
#dw-bg-slideshow .dw-bg-layer.active {
    opacity: 1;
}

/* Nirvana was designed for a DARK #main background, so its theme CSS
 * sets body text to white and headings to teal. We overrode the bg
 * to warm sand/cream, but the theme colors still inherit — resulting
 * in white text on a bright background (invisible).
 *
 * Force dark text across every content element inside the body,
 * scoped away from the hero (where white-on-image is correct). */
.dueseweb-modern #main p,
.dueseweb-modern #main li,
.dueseweb-modern #main dt,
.dueseweb-modern #main dd,
.dueseweb-modern #main td,
.dueseweb-modern #main th,
.dueseweb-modern #main caption,
.dueseweb-modern #main figcaption,
.dueseweb-modern #main span,
.dueseweb-modern #main label,
.dueseweb-modern #main strong,
.dueseweb-modern #main em,
.dueseweb-modern #main small,
.dueseweb-modern #main blockquote,
.dueseweb-modern #main cite {
    color: var(--dw-ink) !important;
}

/* Headings in content: navy */
.dueseweb-modern #main h1:not(.dw-hero-title),
.dueseweb-modern #main h2,
.dueseweb-modern #main h3,
.dueseweb-modern #main h4,
.dueseweb-modern #main h5,
.dueseweb-modern #main h6 {
    color: var(--dw-navy) !important;
}

/* Links in content area: navy, terracotta on hover.
   :not() chain excludes our terracotta-bg CTAs so the inherited cream
   text colour doesn't leak onto white-on-orange buttons (WCAG 4.5:1
   regression — see 2026-04-26 a11y pass). */
.dueseweb-modern #main a:not(.dw-cta):not(.dw-hero-title):not(.wpcf7-submit):not(.dw-home-intro__cta-primary):not(.dw-home-intro__cta-secondary) {
    color: var(--dw-navy) !important;
}
.dueseweb-modern #main a:not(.dw-cta):not(.dw-hero-title):not(.wpcf7-submit):not(.dw-home-intro__cta-primary):not(.dw-home-intro__cta-secondary):hover {
    color: var(--dw-terracotta-dark) !important;
}

/* Hero content is yellow — re-assert to beat #main rules */
.dueseweb-modern #main .dw-hero *,
.dueseweb-modern #main .dw-hero p,
.dueseweb-modern #main .dw-hero h1,
.dueseweb-modern #main .dw-hero h2 {
    color: var(--dw-ink) !important;
}
/* CTA keeps white-on-terracotta — yellow on orange fails AA */
.dueseweb-modern #main .dw-hero .dw-cta,
.dueseweb-modern #main .dw-hero a.dw-cta {
    color: #ffffff !important;
}

/* Footer — yellow on deepest-blue bg */
.dueseweb-modern #footer p,
.dueseweb-modern #footer li,
.dueseweb-modern #footer a,
.dueseweb-modern #colophon p,
.dueseweb-modern #colophon li,
.dueseweb-modern #colophon a,
.dueseweb-modern #footer-widget-area p,
.dueseweb-modern #footer-widget-area li,
.dueseweb-modern #footer-widget-area a {
    color: var(--dw-ink) !important;
}

.dueseweb-modern h1,
.dueseweb-modern h2,
.dueseweb-modern h3 {
    font-family: var(--dw-font-serif);
    font-weight: 400;
    line-height: var(--dw-lh-tight);
    letter-spacing: -0.015em;
    color: var(--dw-navy);
    margin-top: var(--dw-sp-7);
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern h1 { font-size: var(--dw-fs-4xl); }
.dueseweb-modern h2 { font-size: var(--dw-fs-3xl); }
.dueseweb-modern h3 { font-size: var(--dw-fs-2xl); }

.dueseweb-modern h4 {
    font-family: var(--dw-font-sans);
    font-weight: 600;
    font-size: var(--dw-fs-xl);
    line-height: var(--dw-lh-snug);
    color: var(--dw-navy);
    margin-top: var(--dw-sp-6);
    margin-bottom: var(--dw-sp-3);
    letter-spacing: 0;
}
.dueseweb-modern h5 {
    font-family: var(--dw-font-sans);
    font-weight: 600;
    font-size: var(--dw-fs-lg);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--dw-muted);
    margin-top: var(--dw-sp-6);
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern h6 {
    font-family: var(--dw-font-sans);
    font-weight: 600;
    font-size: var(--dw-fs-sm);
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--dw-muted);
}

.dueseweb-modern p,
.dueseweb-modern li,
.dueseweb-modern blockquote {
    margin-top: 0;
    margin-bottom: var(--dw-sp-4);
}

.dueseweb-modern .entry-content p,
.dueseweb-modern .entry-content li,
.dueseweb-modern .entry-content blockquote {
    max-width: var(--dw-measure);
}

.dueseweb-modern strong { font-weight: 600; }
.dueseweb-modern em     { font-style: italic; }

.dueseweb-modern blockquote {
    padding-left: var(--dw-sp-5);
    border-left: 3px solid var(--dw-terracotta);
    font-style: italic;
    color: var(--dw-muted);
}

/* ===== 4. Header — hidden, replaced by hamburger drawer ==========*/
/* Hide Nirvana topbars, rotating headline, and the horizontal
 * primary nav — replaced entirely by the #dw-nav-toggle hamburger
 * + #dw-nav-drawer right-edge drawer (see section 4a below).
 * The nav markup stays in the DOM so any legacy theme JS that
 * references #access still resolves, just invisibly. */
.dueseweb-modern #topbar,
.dueseweb-modern .topbar,
.dueseweb-modern #top-bar,
.dueseweb-modern #nirvana-topbar,
.dueseweb-modern .nirvana-topbar,
.dueseweb-modern #header-section-headline,
.dueseweb-modern .section-headline,
.dueseweb-modern #presentation-page-news,
.dueseweb-modern .presentation-news,
.dueseweb-modern #access,
.dueseweb-modern nav#access,
.dueseweb-modern #prime_nav,
.dueseweb-modern .jssafe,
/* Unstructured promo text block between hero and card grid.
 * Looks hideous on mobile (a wall of yellow prose with emoji)
 * and duplicates destination links already in the card grid. */
.dueseweb-modern #pp-texttop,
.dueseweb-modern #front-text3,
/* Nirvana sidebar widget area — a 220px-wide column of search
 * box + promo text that competes visually with the modernized
 * layout. Full-width primary content looks much cleaner. */
.dueseweb-modern #secondary,
.dueseweb-modern #secondary.sidey,
.dueseweb-modern .widget-area.sidey {
    display: none !important;
}
/* With the sidebar gone, force every content wrapper Nirvana
 * uses to full width so the main column expands into the space
 * vacated by #secondary. `#content` is the critical one — it has
 * `float: left; width: 1025px` baked into the theme, leaving
 * ~300 px of dead space on the right of every inner page. */
.dueseweb-modern #primary,
.dueseweb-modern .content-area,
.dueseweb-modern #content-sidebar-wrap,
.dueseweb-modern #content,
.dueseweb-modern section#container,
.dueseweb-modern section#container.two-columns-right,
.dueseweb-modern section#container.two-columns-left {
    width: 100% !important;
    max-width: 100% !important;
    float: none !important;
    margin: 0 !important;
}
/* Inside the entry body, paragraphs keep a readable measure
 * (~68ch), but wide elements — images, maps, cards, tables —
 * burst out to the full column width so the screen real
 * estate actually gets used. */
.dueseweb-modern .entry-content {
    max-width: 1400px !important;
    margin: 0 auto !important;
    padding-left: var(--dw-sp-6) !important;
    padding-right: var(--dw-sp-6) !important;
}
.dueseweb-modern .entry-content > p,
.dueseweb-modern .entry-content > ul,
.dueseweb-modern .entry-content > ol,
.dueseweb-modern .entry-content > blockquote,
.dueseweb-modern .entry-content > h2,
.dueseweb-modern .entry-content > h3,
.dueseweb-modern .entry-content > h4 {
    max-width: 72ch;
}
.dueseweb-modern .entry-content > figure,
.dueseweb-modern .entry-content > .wp-block-image,
.dueseweb-modern .entry-content > .wp-block-columns,
.dueseweb-modern .entry-content > .wp-block-group,
.dueseweb-modern .entry-content > .elementor,
.dueseweb-modern .entry-content > .gmp-map-wrapper,
.dueseweb-modern .entry-content > .wpgmp_map_parent_wraper {
    max-width: 100% !important;
    width: 100% !important;
}

/* Neutralize #header-wrap / div#header if present */
.dueseweb-modern #header,
.dueseweb-modern header#header,
.dueseweb-modern .site-header,
.dueseweb-modern #header-wrap,
.dueseweb-modern #branding {
    background: transparent !important;
    background-color: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    min-height: 0 !important;
}

/* Nirvana ships `body.nirvana-topbarfixed #header-full { margin-top: 42px }`
 * to reserve space for the (now-hidden) topbar. That margin
 * collapses out of #wrapper and leaves a 42px gap above the
 * breadcrumb on every inner page — desktop and mobile. Zero it. */
.dueseweb-modern #header-full,
.dueseweb-modern #main,
body.nirvana-topbarfixed.dueseweb-modern #header-full {
    margin-top: 0 !important;
    padding-top: 0 !important;
}

/* Sub-page logo — floating top-left, not on homepage.
   Desktop: larger asset, vertically centred with hamburger.
   Mobile: smaller asset. */
body.dueseweb-modern:not(.home)::before {
    content: '';
    position: fixed;
    top: 10px;
    left: 16px;
    z-index: 9998;
    height: 36px;
    width: 168px;
    background: url('desktop-logo.png') no-repeat left center / contain;
    pointer-events: none;
    opacity: 0.92;
}
@media (max-width: 959px) {
    body.dueseweb-modern:not(.home)::before {
        left: 10px;
        width: 150px;
        height: 32px;
        background-image: url('iphone-logo.png');
    }
}
/* Desktop ≥ 960px: dw-desktop-banner already renders a brand logo
   inside its own pill. The body::before logo above is a holdover
   from the pre-banner days and shows up as a second identical
   "Feriendialyse Dr. Berger" pill at the top-left, which becomes
   particularly visible at zoomed-out viewports. Hide it on
   desktop; mobile keeps the iphone-logo variant since the desktop
   banner is hidden there. */
@media (min-width: 960px) {
    body.dueseweb-modern:not(.home)::before {
        display: none !important;
    }
}

/* Breadcrumb — disabled globally, superseded by hamburger menu. */
.dueseweb-modern #breadcrumbs,
.dueseweb-modern #breadcrumbs-box {
    display: none !important;
}

/* Floating glass page title — replaces the flat Nirvana h1 on
 * inner pages (not homepage) with a glassmorphism-backed
 * hero-esque title bar. */
.dueseweb-modern .entry-title,
.dueseweb-modern h1.entry-title {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(2rem, 4vw, 3rem) !important;
    font-weight: 400 !important;
    line-height: 1.1 !important;
    letter-spacing: -0.015em !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-6) !important;
    padding: var(--dw-sp-6) var(--dw-sp-6) !important;
    background: rgba(3, 19, 33, 0.52) !important;
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    border: 1px solid rgba(255, 220, 184, 0.12);
    border-radius: var(--dw-radius-lg);
    box-shadow: var(--dw-shadow-md);
    text-shadow: 0 2px 18px rgba(3, 19, 33, 0.7);
}
@media (max-width: 767px) {
    .dueseweb-modern .entry-title,
    .dueseweb-modern h1.entry-title {
        font-size: clamp(1.6rem, 7vw, 2.2rem) !important;
        padding: var(--dw-sp-4) var(--dw-sp-4) !important;
    }
}

/* Nirvana ships its own responsive hamburger at `button#nav-toggle`
 * which appears centered at the top of the mobile header. We
 * already inject our own `#dw-nav-toggle` (right-edge, navy box,
 * drawer) so this built-in button is duplicate clutter. Hide it. */
.dueseweb-modern #nav-toggle,
.dueseweb-modern button#nav-toggle,
.dueseweb-modern .menu-toggle,
.dueseweb-modern .menu-mobile,
.dueseweb-modern #mobile-menu-toggle,
.dueseweb-modern .primary-menu-toggle {
    display: none !important;
}

/* ===== 4a-pre. Back button (inner pages only) ===================*/
/* Large glass "‹" arrow in the top-left corner. Only rendered on
 * non-homepage pages (PHP guard in 13-nav-drawer.php). Uses
 * history.back() with a fallback to "/" so it works even when the
 * visitor arrived via a direct link (no history). Sized for
 * elderly users (65+) — 52px hit area, same as the hamburger. */
.dueseweb-modern .dw-back-btn {
    position: fixed;
    top: 18px;
    left: 22px;
    z-index: 1002;
    width: 52px;
    height: 52px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1;
    color: var(--dw-ink) !important;
    text-decoration: none !important;
    background: rgba(3, 19, 33, 0.62);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-md);
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    cursor: pointer;
    transition: background 200ms ease,
                border-color 200ms ease,
                transform 200ms ease;
}
.dueseweb-modern .dw-back-btn:hover,
.dueseweb-modern .dw-back-btn:focus-visible {
    background: rgba(3, 19, 33, 0.85);
    border-color: var(--dw-ink);
    outline: none;
    transform: translateX(-2px);
}
body.dueseweb-modern.dw-nav-open .dw-back-btn {
    display: none !important;
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-back-btn {
        top: 38px;       /* below the office status bar */
        left: 14px;
    }
}

/* ===== 4a. Hamburger toggle + right-edge drawer ==================*/
/* The hamburger button is always visible in the top-right corner.
 * When clicked, the drawer slides in from the right over an
 * overlay, JS adds `.dw-nav-open` to <body> to trigger both
 * the transform and the overlay fade-in. */
/* Phone icon — fixed next to hamburger, same glass style */
.dw-header-phone {
    position: fixed;
    top: 4px;
    right: 68px;
    z-index: 1002;
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.5rem;
    line-height: 1;
    text-decoration: none !important;
    color: var(--dw-ink) !important;
    background: rgba(3, 19, 33, 0.62);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-md);
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    transition: background var(--dw-dur-base) var(--dw-ease),
                border-color var(--dw-dur-base) var(--dw-ease),
                transform var(--dw-dur-base) var(--dw-ease);
}
.dw-header-phone:hover,
.dw-header-phone:focus-visible {
    background: rgba(3, 19, 33, 0.85);
    border-color: var(--dw-ink);
    color: var(--dw-terracotta) !important;
    outline: none;
    transform: translateY(-1px);
}

#dw-nav-toggle {
    position: fixed;
    top: 4px;
    right: 8px;
    z-index: 1002;
    width: 52px;
    height: 52px;
    padding: 12px 10px;
    background: rgba(3, 19, 33, 0.62);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-md);
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    cursor: pointer;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: stretch;
    transition: background var(--dw-dur-base) var(--dw-ease),
                border-color var(--dw-dur-base) var(--dw-ease),
                transform var(--dw-dur-base) var(--dw-ease);
}
/* Flash tooltip — "Menü" label that appears on page load,
 * floats next to the hamburger for 3s, then fades out. Teaches
 * elderly users what the ☰ button does on first visit. */
#dw-nav-toggle .dw-nav-tooltip {
    position: absolute;
    top: 50%;
    right: calc(100% + 8px);
    transform: translateY(-50%);
    white-space: nowrap;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.82);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 999px;
    padding: 4px 12px;
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    pointer-events: none;
    animation: dw-nav-tooltip-flash 4s ease-in-out forwards;
}
@keyframes dw-nav-tooltip-flash {
    0%   { opacity: 0; transform: translateY(-50%) translateX(8px); }
    10%  { opacity: 1; transform: translateY(-50%) translateX(0); }
    70%  { opacity: 1; transform: translateY(-50%) translateX(0); }
    100% { opacity: 0; transform: translateY(-50%) translateX(8px); }
}
@media (prefers-reduced-motion: reduce) {
    #dw-nav-toggle .dw-nav-tooltip {
        animation: none;
        display: none;
    }
}

#dw-nav-toggle:hover,
#dw-nav-toggle:focus-visible {
    background: rgba(3, 19, 33, 0.85);
    border-color: var(--dw-ink);
    outline: none;
    transform: translateY(-1px);
}
#dw-nav-toggle .dw-nav-bar {
    display: block;
    height: 2px;
    width: 100%;
    background: var(--dw-ink);
    border-radius: 2px;
    transition: transform var(--dw-dur-base) var(--dw-ease),
                opacity var(--dw-dur-base) var(--dw-ease);
}
body.dw-nav-open #dw-nav-toggle .dw-nav-bar:nth-child(1) {
    transform: translateY(12px) rotate(45deg);
}
body.dw-nav-open #dw-nav-toggle .dw-nav-bar:nth-child(2) {
    opacity: 0;
}
body.dw-nav-open #dw-nav-toggle .dw-nav-bar:nth-child(3) {
    transform: translateY(-12px) rotate(-45deg);
}

#dw-nav-overlay {
    position: fixed;
    inset: 0;
    z-index: 1000;
    background: rgba(3, 19, 33, 0.60);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    pointer-events: none;
    transition: opacity var(--dw-dur-base) var(--dw-ease);
}
body.dw-nav-open #dw-nav-overlay {
    opacity: 1;
    pointer-events: auto;
}

#dw-nav-drawer {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    width: min(420px, 86vw);
    z-index: 1001;
    background: linear-gradient(180deg, #05253d 0%, #021018 100%);
    border-left: 1px solid rgba(255, 220, 184, 0.18);
    box-shadow: -20px 0 60px rgba(0, 0, 0, 0.55);
    overflow-y: auto;
    transform: translateX(100%);
    transition: transform var(--dw-dur-base) var(--dw-ease);
}
body.dw-nav-open #dw-nav-drawer {
    transform: translateX(0);
}
.dw-nav-drawer-inner {
    padding: 92px var(--dw-sp-7) var(--dw-sp-7);
    min-height: 100%;
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-5);
}
.dw-nav-drawer-heading {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: rgba(255, 220, 184, 0.55);
    margin: 0 0 var(--dw-sp-2);
}
.dw-drawer-menu,
.dw-drawer-menu ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dw-drawer-menu > li {
    margin: 0;
    padding: var(--dw-sp-2) 0;
    border-bottom: 1px solid rgba(255, 220, 184, 0.08);
}
.dw-drawer-menu > li:last-child {
    border-bottom: 0;
}
.dw-drawer-menu a {
    display: block;
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    line-height: 1.25;
    letter-spacing: -0.01em;
    color: var(--dw-ink);
    text-decoration: none;
    padding: var(--dw-sp-3) 0;
    transition: color var(--dw-dur-fast) var(--dw-ease),
                transform var(--dw-dur-fast) var(--dw-ease);
}
.dw-drawer-menu a:hover,
.dw-drawer-menu a:focus-visible {
    color: var(--dw-navy-soft);
    transform: translateX(4px);
    outline: none;
}
/* WhatsApp team channel (2026-09-27): hours rule as two plain text lines
   right under the drawer link — text, never colour-only. */
.dw-wa-hours-line { display: block; }
/* Temporary WhatsApp notice (02-dueseweb-constants.php DUESEWEB_WHATSAPP_NOTICE):
   peach text on a navy-tinted box with a terracotta edge — text, not colour-only. */
.dw-wa-notice {
    display: block;
    margin: 0 0 var(--dw-sp-2, 8px);
    padding: 6px 10px;
    border-left: 3px solid var(--dw-terracotta-cta, #bf501c);
    background: rgba(191, 80, 28, 0.14);
    color: var(--dw-ink, #ffdcb8);
    font-family: var(--dw-font-sans);
    font-weight: 600;
    line-height: 1.4;
    text-align: left;
}
.dw-wa-notice a { color: inherit; text-decoration: underline; white-space: nowrap; }
.dw-drawer-menu .dw-menu-whatsapp .dw-wa-hours {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    line-height: 1.4;
    color: var(--dw-ink);
    padding: 0 0 var(--dw-sp-2);
}
/* Sub-level items: smaller, sans, indented, one line of subtlety */
.dw-drawer-menu .sub-menu {
    margin: var(--dw-sp-2) 0 var(--dw-sp-3) var(--dw-sp-3);
    padding-left: var(--dw-sp-3);
    border-left: 1px solid rgba(255, 220, 184, 0.14);
}
.dw-drawer-menu .sub-menu a {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: rgba(255, 220, 184, 0.78);
    padding: var(--dw-sp-2) 0;
}
.dw-drawer-cta {
    margin-top: auto;
    align-self: flex-start;
    /* Ensure the drawer CTA passes WCAG AA — the ambient dw-cta
     * rule renders white on terracotta (#ef6c3a) which scores
     * 2.8:1. Use a darker terracotta + pure white for a ~4.9:1
     * contrast ratio. */
    background: #c24012 !important;
    color: #ffffff !important;
}
.dw-drawer-cta:hover,
.dw-drawer-cta:focus-visible {
    background: #9e310a !important;
}

/* ===== 5. Hero ====================================================*/
/* Shrunk from 72vh → 55vh so the carousel peeks above the fold
 * on a standard 900 px laptop screen. The carousel (section 7b
 * below) then pulls itself up with a negative margin-top so its
 * top edge overlaps with the hero's bottom scrim, creating a
 * smooth visual blend into the destinations section. */
.dueseweb-modern .dw-hero {
    position: relative;
    min-height: 55vh;
    max-height: 620px;
    overflow: hidden;
    margin-top: 0;
}
.dueseweb-modern .dw-hero img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center 40%;
    /* Darkened so warm yellow text reads over the palm/sand tones. */
    filter: brightness(0.50) saturate(1.05);
}
.dueseweb-modern .dw-hero::after {
    content: '';
    position: absolute;
    inset: 0;
    /* Deep navy overlay — strong contrast for yellow foreground.
     * The bottom 35 % ramps to full navy so the carousel can
     * visually emerge from it without a hard edge. */
    background: linear-gradient(
        180deg,
        rgba(6, 26, 44, 0.45) 0%,
        rgba(6, 26, 44, 0.55) 50%,
        rgba(3, 19, 33, 0.85) 78%,
        rgba(3, 19, 33, 0.98) 100%
    );
}
.dueseweb-modern .dw-hero-inner {
    position: relative;
    z-index: 2;
    max-width: var(--dw-container);
    margin: 0 auto;
    padding: 0 var(--dw-sp-6);
    height: 55vh;
    max-height: 620px;
    display: flex;
    flex-direction: column;
    /* Push the hero text upward into the top 2/3 of the hero so
     * the bottom third is "breathing room" into which the
     * carousel overlaps. */
    justify-content: center;
    padding-bottom: 6vh;
    align-items: flex-start;
    color: var(--dw-ink);
}
.dueseweb-modern .dw-hero-title {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(2.5rem, 6vw, 4.5rem) !important;
    font-weight: 400 !important;
    font-style: normal;
    line-height: 1.05 !important;
    letter-spacing: -0.02em;
    margin: 0 0 var(--dw-sp-5) !important;
    max-width: 14ch;
    color: var(--dw-ink) !important;  /* yellow; beats theme h1 */
    text-shadow: 0 2px 24px rgba(3, 19, 33, 0.75), 0 1px 3px rgba(0, 0, 0, 0.55);
}
.dueseweb-modern .dw-hero-sub {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-lg);
    font-weight: 400;
    line-height: var(--dw-lh-base);
    max-width: 52ch;
    margin: 0 0 var(--dw-sp-6);
    color: var(--dw-ink);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}

/* Primary CTA — used in hero and as .wpcf7-submit skin */
.dueseweb-modern .dw-cta {
    display: inline-flex;
    align-items: center;
    gap: var(--dw-sp-2);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: var(--dw-sp-4) var(--dw-sp-6);
    /* WCAG 2.2 AA: white-on-terracotta needs the darker CTA-only variant. */
    background: var(--dw-terracotta-cta, #bf501c);
    color: #fff;
    border: 0;
    border-radius: var(--dw-radius-md);
    text-decoration: none;
    box-shadow: var(--dw-shadow-md);
    cursor: pointer;
    transition: background var(--dw-dur-base) var(--dw-ease),
                transform var(--dw-dur-base) var(--dw-ease),
                box-shadow var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .dw-cta:hover {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    color: #fff;
    transform: translateY(-1px);
    box-shadow: var(--dw-shadow-lg);
    text-decoration: none;
}
.dueseweb-modern .dw-cta::after {
    content: '→';
    display: inline-block;
    transition: transform var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .dw-cta:hover::after {
    transform: translateX(4px);
}
/* WhatsApp CTAs carry their own ↗ new-tab marker (2026-09-27); the generic
   → would make it "↗ →". */
.dueseweb-modern .dw-cta[href^="https://wa.me/"]::after {
    content: none;
}

/* ===== 6. Container + main + entry-content =======================*/
.dueseweb-modern .site,
.dueseweb-modern #page,
.dueseweb-modern #wrapper,
.dueseweb-modern #header-full,
.dueseweb-modern #masthead {
    max-width: 100%;
    margin: 0;
    background: transparent !important;
    background-color: transparent !important;
}
/* #main is Nirvana's outer wrapper — defaults to dark grey bg
 * and rgb(208,208,208) text (designed for dark-mode). Let the body
 * ocean-depth gradient show through by making #main transparent,
 * and force dark text for cascade. */
.dueseweb-modern #main {
    background: transparent !important;
    background-color: transparent !important;
    color: var(--dw-ink) !important;
    max-width: 100%;
    margin: 0;
    padding: 0;
}
/* Nuclear: every descendant of #main except .dw-hero* gets dark ink,
 * inheriting via the cascade. .dw-hero-title / .dw-hero-sub / .dw-cta
 * explicitly set their own color in section 5. */
.dueseweb-modern #main *:not(.dw-hero-title):not(.dw-hero-sub):not(.dw-cta) {
    color: inherit;
}
.dueseweb-modern .site-content,
.dueseweb-modern .entry-content {
    max-width: var(--dw-container);
    margin: 0 auto;
    padding: var(--dw-sp-7) var(--dw-sp-5);
}

/* Section containers — GLASSMORPHISM.
 *
 * Frosted-glass pattern: a semi-transparent navy tint plus a
 * backdrop-filter blur so the bg slideshow photo is softened
 * into a color wash. Peach text sits on a near-uniform dark
 * surface at AA+ contrast while the photo still informs the
 * section mood (beach → teal tint, architecture → warm tint).
 *
 * The previous thin (0.15 alpha, no blur) version let the
 * slideshow through but washed out text. Full opaque panels
 * hid the slideshow. Glass is the middle path. */
.dueseweb-modern #pp-afterslider,
.dueseweb-modern #front-columns-box,
.dueseweb-modern #pp-texttop,
.dueseweb-modern .home-section,
.dueseweb-modern .entry-content,
.dueseweb-modern .site-content {
    padding: var(--dw-sp-9) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.52) !important;
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    color: var(--dw-ink);
}
.dueseweb-modern #pp-texttop {
    text-align: center;
    padding: var(--dw-sp-8) var(--dw-sp-5);
}
.dueseweb-modern #pp-texttop *,
.dueseweb-modern #front-columns-box > h2,
.dueseweb-modern #front-columns-box > h3 {
    color: var(--dw-ink) !important;
}
.dueseweb-modern #front-columns-box {
    background: rgba(3, 19, 33, 0.58) !important;
}
.dueseweb-modern #front-columns {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
    gap: var(--dw-sp-6);
    max-width: var(--dw-container);
    margin: 0 auto;
}

/* ===== 6b. Escaped Elementor sections ============================
 *
 * Elementor splits page content into multiple top-level <section>
 * elements. On ~36 city pages under /feriendialysen-finden/ the
 * Nirvana theme only wraps the first chunk inside .entry-content
 * (which gets glassmorphism). The remaining sections — Hotels,
 * Lage map, accordion, CTA buttons — escape as siblings of
 * section#container inside #forbottom with no glass at all,
 * leaving peach text on a transparent/slideshow background.
 *
 * Fix: give the same frosted-glass treatment to any
 * .elementor-section that lives directly inside #forbottom
 * (i.e. outside .entry-content). */
.dueseweb-modern #forbottom > .elementor-section {
    padding: var(--dw-sp-7) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.52) !important;
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    color: var(--dw-ink);
    max-width: var(--dw-container);
    margin: 0 auto;
}
/* Readable text measure inside escaped sections. */
.dueseweb-modern #forbottom > .elementor-section p,
.dueseweb-modern #forbottom > .elementor-section li,
.dueseweb-modern #forbottom > .elementor-section blockquote {
    max-width: 72ch;
    line-height: var(--dw-lh-base);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
}
.dueseweb-modern #forbottom > .elementor-section h2,
.dueseweb-modern #forbottom > .elementor-section h3 {
    font-family: var(--dw-font-serif);
    color: var(--dw-navy);
}
/* Full-bleed for maps and wide elements inside escaped sections. */
.dueseweb-modern #forbottom > .elementor-section .dw-city-map-section,
.dueseweb-modern #forbottom > .elementor-section .leaflet-container,
.dueseweb-modern #forbottom > .elementor-section iframe {
    max-width: 100% !important;
    width: 100% !important;
}

/* ===== 7. Cards (.ppcolumn + generic .dw-card) ===================*/
/* Nirvana's .ppcolumn defaults to float:left; width:50% which
 * cramms 2 cards into each grid cell. Force full-cell width and
 * drop the float so the grid layout wins.
 *
 * A few of the original card images are tiny (~3-5 KB) placeholder
 * webps with solid mint-green fill (dialyseplatz2, kein-katalog,
 * katalog2a). Rather than curating them one by one, we apply a
 * strong darken + dark gradient overlay to every card so any
 * image — scenic photo or flat placeholder — reads as consistently
 * moody dark, with a yellow serif title floating on top. */
.dueseweb-modern .ppcolumn,
.dueseweb-modern .dw-card {
    position: relative;
    background: var(--dw-cream) !important;
    width: 100% !important;
    float: none !important;
    margin: 0 !important;
    border-radius: var(--dw-radius-lg);
    overflow: hidden;
    box-shadow: var(--dw-shadow-md);
    border: 1px solid var(--dw-border);
    transition: transform var(--dw-dur-base) var(--dw-ease),
                box-shadow var(--dw-dur-base) var(--dw-ease),
                border-color var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .ppcolumn::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg,
        rgba(3, 19, 33, 0.35) 0%,
        rgba(3, 19, 33, 0.55) 50%,
        rgba(3, 19, 33, 0.92) 100%);
    border-radius: inherit;
}
/* Hide tiny placeholder images (solid mint-green fill, ~3-5 KB)
 * that were used as throwaway "text-only card" backgrounds. The
 * card bg + overlay gradient takes over so the title reads
 * cleanly on solid dark navy instead. */
.dueseweb-modern .ppcolumn img[src*="dialyseplatz2"],
.dueseweb-modern .ppcolumn img[src*="kein-katalog"],
.dueseweb-modern .ppcolumn img[src*="katalog2a"],
.dueseweb-modern .ppcolumn img[src*="katalog2-1"] {
    display: none !important;
}
.dueseweb-modern .ppcolumn:hover,
.dueseweb-modern .dw-card:hover {
    transform: translateY(-4px);
    box-shadow: var(--dw-shadow-lg);
    border-color: var(--dw-ink);
}
.dueseweb-modern .ppcolumn .column-image {
    aspect-ratio: 4 / 3;
    overflow: hidden;
}
.dueseweb-modern .ppcolumn img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.88) saturate(1.08);
    transition: transform var(--dw-dur-base) var(--dw-ease),
                filter var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .ppcolumn:hover img {
    transform: scale(1.04);
    filter: brightness(1.0) saturate(1.1);
}
.dueseweb-modern .column-header-image,
.dueseweb-modern .ppcolumn h3 {
    position: absolute;
    left: var(--dw-sp-4);
    right: var(--dw-sp-4);
    bottom: var(--dw-sp-4);
    z-index: 2;
    font-family: var(--dw-font-serif) !important;  /* beat Nirvana's Yanone Kaffeesatz */
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    color: #fff9f0 !important;
    margin: 0;
    line-height: 1.15;
    letter-spacing: -0.01em;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    background: rgba(3, 19, 33, 0.58);
    backdrop-filter: saturate(1.2) blur(8px);
    -webkit-backdrop-filter: saturate(1.2) blur(8px);
    border-radius: var(--dw-radius-md);
    border: 1px solid rgba(255, 220, 184, 0.20);
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
    /* Long titles (eg "Erleben Sie Griechenland im Winter! …")
     * get clamped to 2 lines with ellipsis — keeps card heights
     * uniform regardless of title length. */
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Any other text/link inside a card floats with the title */
.dueseweb-modern .ppcolumn .column-text {
    position: absolute;
    inset: auto var(--dw-sp-5) calc(var(--dw-sp-4) + 2.2rem) var(--dw-sp-5);
    z-index: 2;
    font-size: var(--dw-fs-xs);
    color: rgba(255, 220, 184, 0.75);
    max-height: 3.5em;
    overflow: hidden;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}
.dueseweb-modern .ppcolumn .column-text-separator {
    display: none !important;
}

/* ===== 7b. Homepage hero+carousel section =======================*/
/* Single unified section that serves as BOTH the hero and the
 * destination carousel. The .dw-home-carousel-as-hero variant
 * adds the title + CTA above the tile track. The slideshow
 * shows through a glassy glass panel — no separate hero image.
 *
 * `#pp-afterslider` is the theme's entry-content wrapper. It
 * normally gets a 0.52 alpha glass background, but that stacks
 * ON TOP of our 0.28 alpha hero glass and doubles the occlusion
 * so the slideshow image drops to ~35 % visibility. On the
 * homepage we transparent it out so only our single glass
 * pane sits above the fixed slideshow. */
body.home .dueseweb-modern #pp-afterslider,
body.home .dueseweb-modern #pp-afterslider.entry-content,
.dueseweb-modern #pp-afterslider:has(.dw-home-carousel-as-hero) {
    background: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
    padding: 0 !important;
}
.dueseweb-modern .dw-home-carousel {
    position: relative;
    z-index: 3;
    padding: var(--dw-sp-9) 0;
    /* Fully transparent — no glass panel. The slideshow photo
     * shows through as-is, only the tiles themselves have a
     * readable surface. */
    background: transparent;
    color: var(--dw-ink);
    overflow: visible;
}
.dueseweb-modern .dw-home-carousel-inner {
    position: relative;
    z-index: 1;
}
/* Desktop: hero auto-adapts to viewport using dvh (dynamic viewport height).
 * dvh accounts for browser chrome (URL bar, tabs) so the hero
 * always fills exactly the available canvas — no scroll, no waste.
 * Fallback to vh for browsers without dvh support. */
@media (min-width: 960px) {
    .dueseweb-modern .dw-home-carousel-as-hero {
        min-height: auto;
        height: calc(100vh - 50px);
        height: calc(100dvh - 50px); /* dvh override — accounts for dynamic browser chrome */
        padding-top: 2vh;
        padding-top: 2dvh;
        padding-bottom: 1vh;
        padding-bottom: 1dvh;
        gap: var(--dw-sp-2);
        overflow: hidden;
    }
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-header {
        flex-direction: row;
        justify-content: center;
        align-items: center;
        gap: var(--dw-sp-5);
        padding: 0 var(--dw-sp-4);
    }
    .dueseweb-modern .dw-home-carousel-heading-hero {
        font-size: clamp(1.4rem, 2.5vw, 2rem) !important;
        padding: var(--dw-sp-3) var(--dw-sp-4) !important;
        margin: 0 !important;
    }
    .dueseweb-modern .dw-home-carousel-cta {
        margin: 0;
        white-space: nowrap;
    }
}
.dueseweb-modern .dw-home-carousel-as-hero {
    /* Full-height hero section where the tile row is the main
     * subject. Title + CTA are a tight top-stack; the carousel
     * gets the lion's share of vertical space. */
    position: relative;
    min-height: 96vh;
    max-height: none;
    padding-top: 8vh;
    padding-bottom: var(--dw-sp-5);
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    gap: var(--dw-sp-5);
}
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-header {
    text-align: center;
    margin-bottom: 0;
    padding: 0 var(--dw-sp-4);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--dw-sp-4);
}
.dueseweb-modern .dw-home-carousel-heading-hero {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(2rem, 4.2vw, 3.25rem) !important;
    font-weight: 400 !important;
    line-height: 1.08 !important;
    letter-spacing: -0.015em;
    color: var(--dw-ink) !important;
    margin: 0 !important;
    text-shadow: 0 2px 24px rgba(3, 19, 33, 0.75),
                 0 1px 3px rgba(0, 0, 0, 0.55);
    /* Glass backing so the title reads on any slideshow frame */
    padding: var(--dw-sp-4) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.45);
    backdrop-filter: saturate(1.2) blur(12px);
    -webkit-backdrop-filter: saturate(1.2) blur(12px);
    border-radius: var(--dw-radius-lg);
    border: 1px solid rgba(255, 220, 184, 0.10);
}
/* Hero brand logo — prominent image above the headline */
.dueseweb-modern .dw-hero-brand {
    text-align: center;
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern .dw-hero-brand-logo {
    display: inline-block;
    height: 48px;
    width: auto;
    filter: drop-shadow(0 2px 8px rgba(0, 0, 0, 0.5));
}
@media (min-width: 960px) {
    .dueseweb-modern .dw-hero-brand-logo {
        height: 56px;
    }
}
@media (max-width: 599px) {
    .dueseweb-modern .dw-hero-brand-logo {
        height: 40px;
    }
    .dueseweb-modern .dw-hero-brand {
        /* Clear the fixed .dw-auth-avatar pill (position:fixed top:6 centered
           on mobile). Without this, the centered 👤 avatar sits on top of
           the 40px hero brand logo at scroll=0 — they overlap at y:41..50. */
        margin-top: 20px;
        margin-bottom: var(--dw-sp-2);
    }
}
.dueseweb-modern .dw-home-carousel-heading-hero em {
    font-style: italic;
    color: var(--dw-terracotta);
    font-size: 0.8em;
}
.dueseweb-modern .dw-home-carousel-cta {
    margin: 0 0 20px;
}

/* Tile track gets all remaining vertical space and a little
 * bottom breathing room for the dots. */
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-track-wrap {
    flex: 1 1 auto;
    margin-top: var(--dw-sp-5);
    display: flex;
    align-items: stretch;
}
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-track {
    align-items: stretch;
    width: 100%;
}

/* BIG tiles: 2 per view on desktop so each is ~50% wide.
 * Desktop uses 4:3 landscape to fit within the 980px height cap.
 * Mobile keeps 3:4 portrait (overridden below). */
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-item {
    flex: 0 0 calc((100% - var(--dw-sp-5)) / 2);
}
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-tile {
    aspect-ratio: 4 / 3;
    max-height: 70vh;
    max-height: 70dvh;
    /* Soft blurred vignette around tile edges */
    -webkit-mask-image: radial-gradient(
        ellipse 92% 92% at center,
        rgba(0, 0, 0, 1) 65%,
        rgba(0, 0, 0, 0) 100%
    );
    mask-image: radial-gradient(
        ellipse 92% 92% at center,
        rgba(0, 0, 0, 1) 65%,
        rgba(0, 0, 0, 0) 100%
    );
}
/* On very wide screens let 3 tiles fit but bigger than the old
 * size — tile width ~420 px. */
@media (min-width: 1500px) {
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-item {
        flex: 0 0 calc((100% - var(--dw-sp-5) * 2) / 3);
    }
}
@media (max-width: 959px) {
    /* Mobile/tablet: same tile *card* language as desktop Splide (4:5, glass border,
     * shadow, caption scrim ::after) — not the old full-bleed portrait + radial mask. */
    .dueseweb-modern .dw-home-carousel-as-hero {
        padding-left: var(--dw-sp-4) !important;
        padding-right: var(--dw-sp-4) !important;
        padding-top: 5vh !important;
        gap: var(--dw-sp-3) !important;
        min-height: auto !important;
    }
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-item {
        flex: 0 0 100%;
    }
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-tile {
        aspect-ratio: 4 / 5;
        max-height: min(68dvh, 520px);
        width: 100%;
        max-width: 440px;
        margin: 0 auto;
        border-radius: var(--dw-radius-lg);
        overflow: hidden;
        border: 1px solid rgba(255, 220, 184, 0.22);
        box-shadow: var(--dw-shadow-md);
        background: var(--dw-cream);
        -webkit-mask-image: none;
        mask-image: none;
    }
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-track-wrap {
        padding: 0;
    }
    /* BIG arrows INSIDE the carousel tile area — left and right
     * edges, vertically centered. Glass circles that float over
     * the tile image so elderly users always see them. */
    .dueseweb-modern .splide__arrow {
        display: flex !important;
        position: absolute !important;
        top: 50% !important;
        width: 52px !important;
        height: 52px !important;
        background: rgba(3, 19, 33, 0.75) !important;
        border: 2px solid rgba(255, 220, 184, 0.40) !important;
        border-radius: 999px !important;
        backdrop-filter: saturate(1.2) blur(10px);
        -webkit-backdrop-filter: saturate(1.2) blur(10px);
        opacity: 1 !important;
        transform: translateY(-50%) !important;
        z-index: 10;
    }
    .dueseweb-modern .splide__arrow--prev {
        left: 8px !important;
    }
    .dueseweb-modern .splide__arrow--next {
        right: 8px !important;
    }
    .dueseweb-modern .splide__arrow svg {
        fill: var(--dw-ink) !important;
        width: 22px !important;
        height: 22px !important;
    }
    .dueseweb-modern .splide__arrow:active {
        background: rgba(3, 19, 33, 0.95) !important;
        transform: translateY(-50%) scale(0.92) !important;
    }
    /* Inactive tile emphasis OFF on mobile — only one tile
     * visible at a time, dimming it looks broken. */
    .dueseweb-modern .splide__slide:not(.is-active) .dw-home-carousel-tile {
        opacity: 1;
        filter: none;
        transform: none;
    }
}

/* Larger tile titles — the tiles ARE the hero now. */
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-title {
    font-size: clamp(1.5rem, 2.2vw, 2rem);
    line-height: 1.08;
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-tile-kicker {
    font-size: var(--dw-fs-sm);
    letter-spacing: 0.16em;
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-sub {
    font-size: var(--dw-fs-base);
    line-height: 1.45;
}

@media (max-width: 959px) {
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-title {
        font-size: clamp(1.2rem, 4.2vw, 1.7rem);
        line-height: 1.1;
    }
    .dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-sub {
        font-size: var(--dw-fs-sm);
        line-height: 1.4;
    }
}

@media (max-width: 759px) {
    .dueseweb-modern .dw-home-carousel-as-hero {
        min-height: auto;
        padding-top: 52px;       /* just below the office status bar */
        padding-bottom: var(--dw-sp-5);
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-home-carousel-heading-hero {
        font-size: clamp(1.2rem, 5vw, 1.6rem) !important;
        line-height: 1.12 !important;
        margin-bottom: 0 !important;
    }
    .dueseweb-modern .dw-home-carousel-cta {
        padding: var(--dw-sp-3) var(--dw-sp-5) !important;
        font-size: var(--dw-fs-sm) !important;
    }
    /* Hide hero CTAs on mobile — redundant with sticky bar */
    .dueseweb-modern .dw-hero-ctas {
        display: none !important;
    }
    /* Move hero sub + trust badges to bottom on mobile */
    .dueseweb-modern .dw-hero-sub,
    .dueseweb-modern .dw-trust-badges {
        display: none !important;
    }
}
.dueseweb-modern .dw-home-carousel-inner {
    width: 100%;
    max-width: 1600px;
    margin: 0 auto;
    padding: 0 var(--dw-sp-5);
}
.dueseweb-modern .dw-home-carousel-header {
    text-align: center;
    margin-bottom: var(--dw-sp-7);
}
.dueseweb-modern .dw-home-carousel-kicker {
    display: inline-block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--dw-muted);
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern .dw-home-carousel-heading {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-3xl);
    font-weight: 400;
    line-height: 1.1;
    color: var(--dw-ink);
    margin: 0;
    letter-spacing: -0.015em;
}
.dueseweb-modern .dw-home-carousel-track-wrap {
    position: relative;
    padding: 0 64px;   /* room for the arrow buttons */
}
.dueseweb-modern .dw-home-carousel-track {
    display: flex;
    gap: var(--dw-sp-5);
    list-style: none;
    margin: 0;
    padding: 0;
    /* Long, slow ease-out-quint gives the glide a "ship" feel —
     * starts fast, settles gently. The JS wrap-around uses a
     * transient `transition: none` + rAF snap so the back-edge
     * never slides visibly across the whole track. */
    transition: transform 900ms cubic-bezier(0.16, 1, 0.3, 1);
}
.dueseweb-modern .dw-home-carousel-item {
    flex: 0 0 calc((100% - var(--dw-sp-5) * 2) / 3);
    margin: 0;
    padding: 0;
}
@media (max-width: 1199px) {
    .dueseweb-modern .dw-home-carousel-item {
        flex: 0 0 calc((100% - var(--dw-sp-5)) / 2);
    }
}
@media (max-width: 759px) {
    .dueseweb-modern .dw-home-carousel-item {
        flex: 0 0 100%;
    }
    .dueseweb-modern .dw-home-carousel-track-wrap {
        padding: 0;
    }
}
.dueseweb-modern .dw-home-carousel-tile {
    position: relative;
    display: block;
    aspect-ratio: 4 / 5;
    border-radius: var(--dw-radius-lg);
    overflow: hidden;
    text-decoration: none !important;
    color: var(--dw-ink) !important;
    border: 1px solid rgba(255, 220, 184, 0.18);
    box-shadow: var(--dw-shadow-md);
    transition: transform 350ms cubic-bezier(0.22, 0.61, 0.36, 1),
                box-shadow 350ms ease,
                border-color 350ms ease;
    background: var(--dw-cream);
}
/* Safari fix: backdrop-filter on ANY ancestor creates a new
 * containing block that breaks Splide's scroll-snap + transform
 * pipeline. Force the Splide track and its container to use
 * hardware-accelerated compositing so Safari doesn't try to
 * re-composite through the backdrop-filter chain. */
.dueseweb-modern .dw-home-splide,
.dueseweb-modern .dw-home-splide .splide__track,
.dueseweb-modern .dw-home-splide .splide__list {
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}
/* Ensure the Splide track wrapper clips correctly on all
 * browsers — Splide sets this internally but our CSS might
 * be overriding it with the carousel section's overflow:visible. */
.dueseweb-modern .dw-home-splide .splide__track {
    overflow: hidden !important;
}

/* Active tile — glassmorphism emphasis via Splide's .is-active. */
.dueseweb-modern .splide__slide:not(.is-active) .dw-home-carousel-tile {
    opacity: 0.55;
    filter: brightness(0.85);
    transition: opacity 500ms ease, filter 500ms ease;
}
.dueseweb-modern .splide__slide.is-active .dw-home-carousel-tile {
    opacity: 1;
    border-color: rgba(255, 220, 184, 0.35);
    box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.12),
                0 24px 50px rgba(0, 0, 0, 0.55),
                inset 0 1px 0 rgba(255, 255, 255, 0.08);
    transition: opacity 500ms ease, filter 500ms ease;
}
.dueseweb-modern .dw-home-carousel-tile:hover,
.dueseweb-modern .dw-home-carousel-tile:focus-visible {
    transform: translateY(-6px) scale(1);
    opacity: 1;
    box-shadow: 0 24px 50px rgba(0, 0, 0, 0.55);
    border-color: var(--dw-ink);
    outline: none;
    filter: none;
}
/* Splide arrows — glass style matching the site. */
.dueseweb-modern .splide__arrow {
    background: rgba(3, 19, 33, 0.72) !important;
    border: 1px solid rgba(255, 220, 184, 0.25) !important;
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    opacity: 1 !important;
    width: 48px !important;
    height: 48px !important;
}
.dueseweb-modern .splide__arrow:hover {
    background: rgba(3, 19, 33, 0.90) !important;
    border-color: var(--dw-ink) !important;
}
.dueseweb-modern .splide__arrow svg {
    fill: var(--dw-ink) !important;
}
.dueseweb-modern .dw-home-carousel-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.88) saturate(1.25) contrast(1.05);
    transition: transform 800ms cubic-bezier(0.22, 0.61, 0.36, 1),
                filter 600ms ease,
                opacity 1.2s ease-in-out;
}
/* Second image layer for per-tile crossfade — stacks behind the
   scrim but above layer A when fading in. */
.dueseweb-modern .dw-tile-img-b {
    opacity: 0;
    z-index: 1;
}
.dueseweb-modern .dw-tile-img-a {
    z-index: 0;
}
.dueseweb-modern .dw-home-carousel-tile:hover .dw-home-carousel-img,
.dueseweb-modern .dw-home-carousel-tile:focus-visible .dw-home-carousel-img {
    transform: scale(1.08);
    filter: brightness(1) saturate(1.35) contrast(1.05);
}
/* Gradient scrim bottom → bottom so the caption reads regardless
 * of image content. */
.dueseweb-modern .dw-home-carousel-tile::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(3, 19, 33, 0.10) 0%,
        rgba(3, 19, 33, 0.25) 45%,
        rgba(3, 19, 33, 0.88) 100%
    );
    pointer-events: none;
}
/* "Zuhause" weather — glass pill top-left of the carousel,
   shows Wetzlar's current weather as contrast to the sunny
   destinations. Motivates German visitors to book. */
/* "Zuhause" weather — glass pill upper-left of the carousel section.
   Shows Wetzlar/home weather as contrast to sunny destinations. */
.dueseweb-modern .dw-home-weather-home {
    position: absolute;
    top: 40px;
    left: var(--dw-sp-3);
    z-index: 10;
    font-family: var(--dw-font-sans);
    font-size: clamp(1rem, 2.5vw, 1.3rem);
    font-weight: 600;
    color: var(--dw-muted);
    background: rgba(3, 19, 33, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 220, 184, 0.15);
    border-radius: 999px;
    padding: 0.4rem 1rem;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    pointer-events: none;
    line-height: 1.4;
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-home-weather-home {
        display: none !important;
    }
}

/* "Sonne gesucht?" weather pills */
.dueseweb-modern .dw-sun-row {
    text-align: center;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    font-family: var(--dw-font-sans);
}
.dueseweb-modern .dw-sun-home {
    display: block;
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    margin-bottom: var(--dw-sp-2);
}
.dueseweb-modern .dw-sun-pills {
    display: flex;
    justify-content: center;
    gap: var(--dw-sp-2);
    flex-wrap: wrap;
}
.dueseweb-modern .dw-sun-pill {
    display: inline-block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.40);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 220, 184, 0.15);
    border-radius: 999px;
    padding: 8px 16px;
    text-decoration: none;
    transition: background 150ms ease, border-color 150ms ease;
    min-height: 44px;
    line-height: 1.4;
}
.dueseweb-modern .dw-sun-pill:hover {
    background: rgba(3, 19, 33, 0.65);
    border-color: var(--dw-ink);
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-sun-row {
        display: none;
    }
}

/* Live treatment tile */
.dueseweb-modern .dw-live-tile {
    background: linear-gradient(145deg, rgba(3, 19, 33, 0.85), rgba(3, 19, 33, 0.65));
    display: flex;
    align-items: center;
    justify-content: center;
}
.dueseweb-modern .dw-live-tile-body {
    padding: var(--dw-sp-6);
    text-align: center;
    width: 100%;
}
.dueseweb-modern .dw-live-tile-count {
    font-size: var(--dw-fs-lg);
    font-weight: 600;
    color: #22c55e;
    margin: var(--dw-sp-3) 0;
}
.dueseweb-modern .dw-live-tile-list {
    list-style: none;
    padding: 0;
    margin: var(--dw-sp-4) 0 0;
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-2);
}
.dueseweb-modern .dw-live-tile-list li {
    font-size: var(--dw-fs-sm);
    color: var(--dw-ink);
    opacity: 0.9;
}
.dueseweb-modern .dw-live-tile-num {
    display: inline-block;
    background: rgba(34, 197, 94, 0.2);
    color: #22c55e;
    border-radius: 999px;
    padding: 0 0.5em;
    font-size: 0.85em;
    font-weight: 600;
    margin-left: 0.3em;
}

/* Live counter — "Gerade im Urlaub" */
.dueseweb-modern .dw-live-counter {
    display: flex;
    align-items: center;
    gap: var(--dw-sp-3);
    flex-wrap: wrap;
    margin-top: var(--dw-sp-3);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    opacity: 0.9;
}
.dueseweb-modern .dw-live-counter-dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #22c55e;
    flex-shrink: 0;
    animation: dw-pulse 2s ease-in-out infinite;
}
.dueseweb-modern .dw-live-counter-text {
    font-weight: 600;
}
.dueseweb-modern .dw-live-counter-locations {
    width: 100%;
    display: flex;
    gap: var(--dw-sp-2);
    flex-wrap: wrap;
    font-size: var(--dw-fs-sm);
    opacity: 0.75;
}
.dueseweb-modern .dw-live-counter-locations span::after {
    content: ' \00B7';
}
.dueseweb-modern .dw-live-counter-locations span:last-child::after {
    content: '';
}
.dueseweb-modern .dw-live-counter-fallback {
    opacity: 0.7;
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-live-counter {
        font-size: var(--dw-fs-sm);
        justify-content: center;
        text-align: center;
    }
    .dueseweb-modern .dw-live-counter-locations {
        justify-content: center;
    }
}

/* Weather badge — glass pill top-right of each tile */
.dueseweb-modern .dw-home-carousel-weather {
    position: absolute;
    top: var(--dw-sp-3);
    right: var(--dw-sp-3);
    z-index: 3;
    font-family: var(--dw-font-sans);
    font-size: clamp(1rem, 2.5vw, 1.3rem);
    font-weight: 600;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 220, 184, 0.20);
    border-radius: 999px;
    padding: 0.4rem 1rem;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    pointer-events: none;
    line-height: 1.4;
}
.dueseweb-modern .dw-home-carousel-caption {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: var(--dw-sp-6) var(--dw-sp-6) var(--dw-sp-6);
    z-index: 2;
}
.dueseweb-modern .dw-home-carousel-tile-kicker {
    display: inline-block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.14em;
    color: var(--dw-muted);
    margin-bottom: var(--dw-sp-2);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.6);
}
.dueseweb-modern .dw-home-carousel-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-2xl);
    font-weight: 400;
    line-height: 1.1;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-2);
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.7);
    letter-spacing: -0.015em;
}
.dueseweb-modern .dw-home-carousel-sub {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    line-height: 1.4;
    color: rgba(255, 220, 184, 0.88);
    margin: 0;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
}
.dueseweb-modern .dw-home-carousel-arrow {
    position: absolute;
    top: 50%;
    width: 52px;
    height: 52px;
    padding: 0;
    transform: translateY(-50%);
    background: rgba(3, 19, 33, 0.72);
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 999px;
    color: var(--dw-ink);
    font-size: 1.75rem;
    line-height: 1;
    cursor: pointer;
    z-index: 3;
    transition: background 200ms ease,
                border-color 200ms ease,
                transform 200ms ease;
}
.dueseweb-modern .dw-home-carousel-arrow:hover,
.dueseweb-modern .dw-home-carousel-arrow:focus-visible {
    background: rgba(3, 19, 33, 0.92);
    border-color: var(--dw-ink);
    transform: translateY(-50%) scale(1.08);
    outline: none;
}
.dueseweb-modern .dw-home-carousel-prev { left: 6px; }
.dueseweb-modern .dw-home-carousel-next { right: 6px; }
@media (max-width: 759px) {
    .dueseweb-modern .dw-home-carousel-arrow {
        width: 44px;
        height: 44px;
        font-size: 1.4rem;
    }
    .dueseweb-modern .dw-home-carousel-prev { left: 8px; }
    .dueseweb-modern .dw-home-carousel-next { right: 8px; }
}
.dueseweb-modern .dw-home-carousel-dots {
    display: flex;
    justify-content: center;
    gap: var(--dw-sp-3);
    margin-top: var(--dw-sp-6);
}
.dueseweb-modern .dw-home-carousel-dot {
    width: 10px;
    height: 10px;
    padding: 0;
    border: 1px solid rgba(255, 220, 184, 0.45);
    background: transparent;
    border-radius: 999px;
    cursor: pointer;
    transition: background 200ms ease,
                border-color 200ms ease,
                transform 200ms ease;
}
.dueseweb-modern .dw-home-carousel-dot[aria-selected="true"] {
    background: var(--dw-ink);
    border-color: var(--dw-ink);
    transform: scale(1.25);
}
.dueseweb-modern .dw-home-carousel-dot:hover,
.dueseweb-modern .dw-home-carousel-dot:focus-visible {
    border-color: var(--dw-ink);
    outline: none;
}

/* Also hide any remaining leftover front-columns grid that
 * somehow survives the buffer transformer strip (defensive). */
.dueseweb-modern.dueseweb-home #front-columns-box,
.dueseweb-modern #front-columns-box:has(~ .dw-home-carousel),
.dueseweb-modern.home #front-columns-box {
    display: none !important;
}

/* ===== 7a. Nirvana text widget — hidden ==========================*/
/* The homepage's `ppbox.nirvana-widget-columns` drops text widgets
 * into narrow (~180 px) columns via a CSS multi-column layout
 * that resists every `display: block`, `column-count: 1`, and
 * `grid-template-columns` override. The widget content
 * ("Feriendialyse-Dialyseurlaub Beratung und Organisation" +
 * intro paragraph) is duplicated in the finder page hero and
 * the country cards grid anyway, so we just hide it. */
.dueseweb-modern #frontpage .ppbox.nirvana-widget-columns .widget-container.widget_text,
.dueseweb-modern #frontpage .ppbox.nirvana-widget-columns .widget_text {
    display: none !important;
}

/* ===== 8. Team members ==========================================*/
.dueseweb-modern .tmm-team-member,
.dueseweb-modern .tmm_team_member {
    background: var(--dw-cream);
    border-radius: var(--dw-radius-lg);
    padding: var(--dw-sp-5);
    box-shadow: var(--dw-shadow-sm);
    border: 1px solid var(--dw-border);
    text-align: center;
}
.dueseweb-modern .tmm_photo {
    width: 140px !important;
    height: 140px !important;
    aspect-ratio: 1 / 1;
    border-radius: 50%;
    margin: 0 auto var(--dw-sp-4);
    background-size: cover;
    background-position: center top;
}
.dueseweb-modern .tmm_name,
.dueseweb-modern .tmm_team_member h3 {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-lg);
    font-weight: 500;
    color: var(--dw-navy);
    margin: 0 0 var(--dw-sp-2);
}
.dueseweb-modern .tmm_position,
.dueseweb-modern .tmm_team_member .position {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
}

/* ===== 9. Contact Form 7 ========================================*/
.dueseweb-modern .wpcf7-form {
    max-width: 640px;
    font-family: var(--dw-font-sans);
}
.dueseweb-modern .wpcf7-form label {
    display: block;
    font-weight: 500;
    font-size: var(--dw-fs-sm);
    color: var(--dw-navy);
    margin-bottom: var(--dw-sp-2);
    margin-top: var(--dw-sp-5);
}
.dueseweb-modern .wpcf7-form input[type="text"],
.dueseweb-modern .wpcf7-form input[type="email"],
.dueseweb-modern .wpcf7-form input[type="tel"],
.dueseweb-modern .wpcf7-form input[type="url"],
.dueseweb-modern .wpcf7-form input[type="date"],
.dueseweb-modern .wpcf7-form input[type="number"],
.dueseweb-modern .wpcf7-form select,
.dueseweb-modern .wpcf7-form textarea {
    width: 100%;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    line-height: var(--dw-lh-snug);
    color: var(--dw-ink);
    background: var(--dw-cream);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-radius-md);
    min-height: 48px;
    transition: border-color var(--dw-dur-fast) var(--dw-ease),
                box-shadow var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .wpcf7-form input::placeholder,
.dueseweb-modern .wpcf7-form textarea::placeholder {
    color: rgba(255, 220, 184, 0.45);
}
.dueseweb-modern .wpcf7-form input:focus,
.dueseweb-modern .wpcf7-form select:focus,
.dueseweb-modern .wpcf7-form textarea:focus {
    outline: none;
    border-color: var(--dw-muted);
    box-shadow: 0 0 0 3px rgba(251, 191, 36, 0.25);
}
.dueseweb-modern .wpcf7-form textarea {
    min-height: 140px;
    resize: vertical;
}
.dueseweb-modern .wpcf7-form .wpcf7-submit {
    display: inline-flex;
    align-items: center;
    gap: var(--dw-sp-2);
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA: white-on-orange needs 4.57:1, not --dw-terracotta 3.05:1 */
    color: #fff;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    font-weight: 600;
    letter-spacing: 0.02em;
    padding: var(--dw-sp-4) var(--dw-sp-6);
    border: 0;
    border-radius: var(--dw-radius-md);
    cursor: pointer;
    margin-top: var(--dw-sp-6);
    box-shadow: var(--dw-shadow-md);
    transition: background var(--dw-dur-base) var(--dw-ease),
                transform var(--dw-dur-base) var(--dw-ease),
                box-shadow var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .wpcf7-form .wpcf7-submit:hover {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    transform: translateY(-1px);
    box-shadow: var(--dw-shadow-lg);
}
.dueseweb-modern .wpcf7-response-output {
    padding: var(--dw-sp-4);
    border-radius: var(--dw-radius-md);
    margin-top: var(--dw-sp-5);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .wpcf7-form .wpcf7-mail-sent-ok {
    background: #e8f3ea;
    border: 1px solid var(--dw-eucalyptus);
    color: var(--dw-eucalyptus);
}
.dueseweb-modern .wpcf7-form .wpcf7-validation-errors,
.dueseweb-modern .wpcf7-form .wpcf7-mail-sent-ng {
    background: #fbeceb;
    border: 1px solid #d13a2f;
    color: #991a0f;
}

/* ===== 10. Footer — modernised glass ============================*/
/* Less boxy, no hard-edge section dividers, the slideshow
 * shows through a translucent panel. Each widget column
 * floats on its own mini glass card. */
.dueseweb-modern #footer,
.dueseweb-modern .site-footer,
.dueseweb-modern #colophon,
.dueseweb-modern #footer-widget-area {
    background: rgba(3, 19, 33, 0.45) !important;
    background-color: rgba(3, 19, 33, 0.45) !important;
    backdrop-filter: saturate(1.15) blur(16px);
    -webkit-backdrop-filter: saturate(1.15) blur(16px);
    border-top: none;
    color: var(--dw-ink);
    padding: var(--dw-sp-9) var(--dw-sp-5) var(--dw-sp-7);
    margin-top: 0;
}
.dueseweb-modern #footer h1,
.dueseweb-modern #footer h2,
.dueseweb-modern #footer h3,
.dueseweb-modern #footer h4,
.dueseweb-modern #footer h5,
.dueseweb-modern #footer h6,
.dueseweb-modern #footer .widget-title,
.dueseweb-modern .site-footer .widget-title,
.dueseweb-modern #footer-widget-area h1,
.dueseweb-modern #footer-widget-area h2,
.dueseweb-modern #footer-widget-area h3,
.dueseweb-modern #footer-widget-area h4 {
    font-family: var(--dw-font-serif) !important;
    font-size: var(--dw-fs-base) !important;
    font-weight: 400 !important;
    line-height: 1.2 !important;
    text-transform: none !important;
    letter-spacing: -0.01em !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-4) !important;
    padding-bottom: var(--dw-sp-3) !important;
    border-bottom: 1px solid rgba(255, 220, 184, 0.15);
}
.dueseweb-modern #footer a,
.dueseweb-modern .site-footer a {
    color: var(--dw-ink);
    opacity: 0.82;
    text-decoration: none;
    transition: opacity var(--dw-dur-fast) var(--dw-ease),
                color var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern #footer a:hover,
.dueseweb-modern .site-footer a:hover {
    opacity: 1;
    color: var(--dw-navy-soft) !important;
}
.dueseweb-modern #footer li,
.dueseweb-modern .site-footer li {
    margin-bottom: var(--dw-sp-2);
    padding-bottom: var(--dw-sp-2);
    border-bottom: 1px solid rgba(255, 220, 184, 0.06);
    list-style: none;
}
/* ---- Footer cleanup: hide social icons, language widget, Quick Links ---- */
.dueseweb-modern .socials,
.dueseweb-modern #footer .socials,
.dueseweb-modern .widget_gtranslate,
.dueseweb-modern .widget_polylang,
.dueseweb-modern [class*="language-switcher"],
.dueseweb-modern [class*="gtranslate"] {
    display: none !important;
}
.dueseweb-modern #footer #colophon,
.dueseweb-modern #footer > .inside,
.dueseweb-modern .site-footer .footer-widgets {
    max-width: var(--dw-container);
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--dw-sp-7);
}
/* Each footer widget column gets its own glass card — removes
 * the "flat boxes on flat bg" feel. */
.dueseweb-modern #footer .widget-container,
.dueseweb-modern .site-footer .widget {
    background: rgba(255, 220, 184, 0.04);
    border: 1px solid rgba(255, 220, 184, 0.10);
    border-radius: var(--dw-radius-lg);
    padding: var(--dw-sp-5) var(--dw-sp-5);
}
/* Footer text — softer, smaller, no aggressive underlines. */
.dueseweb-modern #footer p,
.dueseweb-modern #footer li,
.dueseweb-modern .site-footer p {
    font-size: var(--dw-fs-sm);
    color: rgba(255, 220, 184, 0.78);
    line-height: 1.5;
}

/* The original #footer is replaced by a floating "?" info drawer
 * (see section 16 below). Hide the static footer entirely. */
.dueseweb-modern #footer,
.dueseweb-modern .site-footer {
    display: none !important;
}

/* ===== 11. gtranslate widget minor restyle =====================*/
.dueseweb-modern .gt_switcher,
.dueseweb-modern .gtranslate_wrapper {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern #gtranslate_selector {
    padding: var(--dw-sp-2) var(--dw-sp-3);
    border-radius: var(--dw-radius-sm);
    border: 1px solid var(--dw-border);
    background: var(--dw-cream);
    color: var(--dw-ink);
}

/* ===== 12. Mobile (<768px) =====================================*/
@media (max-width: 767px) {
    .dueseweb-modern {
        --dw-fs-base: 1.0625rem;
        --dw-fs-4xl:  2.25rem;
        --dw-fs-3xl:  1.875rem;
        --dw-fs-5xl:  2.75rem;
    }
    body.dueseweb-modern {
        line-height: 1.7;
    }

    .dueseweb-modern #main,
    .dueseweb-modern .site-content,
    .dueseweb-modern .entry-content {
        padding: var(--dw-sp-5) var(--dw-sp-4);
    }
    .dueseweb-modern #pp-afterslider,
    .dueseweb-modern #front-columns-box,
    .dueseweb-modern .home-section {
        padding: var(--dw-sp-7) var(--dw-sp-4);
    }

    /* Hero shrinks */
    .dueseweb-modern .dw-hero {
        min-height: 60vh;
        max-height: 540px;
    }
    .dueseweb-modern .dw-hero-inner {
        height: 60vh;
        max-height: 540px;
        padding: 0 var(--dw-sp-4);
        align-items: center;
        text-align: center;
    }
    .dueseweb-modern .dw-hero-title {
        max-width: 100%;
        font-size: clamp(2.25rem, 9vw, 2.75rem);
    }

    /* Header — always solid on mobile */
    .dueseweb-modern #header,
    .dueseweb-modern header#header,
    .dueseweb-modern .site-header {
        padding: var(--dw-sp-3) 0;
        background: rgba(3, 19, 33, 0.95);
        backdrop-filter: blur(8px);
        -webkit-backdrop-filter: blur(8px);
        box-shadow: var(--dw-shadow-sm);
    }
    .dueseweb-modern:not(.has-scrolled) #header a:not(.dw-cta),
    .dueseweb-modern:not(.has-scrolled) .site-header a:not(.dw-cta) {
        color: var(--dw-navy);
        text-shadow: none;
    }

    /* Cards stack + uniform height + bigger titles ----------------- */
    .dueseweb-modern #front-columns {
        grid-template-columns: 1fr;
        gap: var(--dw-sp-5);
    }
    .dueseweb-modern .ppcolumn {
        /* Force a fixed 16:9 card so every stack entry is the same
         * height regardless of what content leaks in from Nirvana. */
        aspect-ratio: 16 / 10;
        height: auto;
        max-height: 280px;
        overflow: hidden;
    }
    .dueseweb-modern .ppcolumn .column-image {
        aspect-ratio: auto;
        width: 100%;
        height: 100%;
    }
    /* Kill all body text inside the mobile card — leave only the
     * image + the floating title pill. Long Nirvana/Elementor
     * paragraphs otherwise wrap vertically one-word-per-line. */
    .dueseweb-modern .ppcolumn .column-text,
    .dueseweb-modern .ppcolumn .column-text-separator,
    .dueseweb-modern .ppcolumn p,
    .dueseweb-modern .ppcolumn ul,
    .dueseweb-modern .ppcolumn ol,
    .dueseweb-modern .ppcolumn dl,
    .dueseweb-modern .ppcolumn .column-header,
    .dueseweb-modern .ppcolumn .column-subheader {
        display: none !important;
    }
    /* Bump the floating title font so it actually reads on 390 px. */
    .dueseweb-modern .ppcolumn h3,
    .dueseweb-modern .ppcolumn .column-header-image {
        font-size: var(--dw-fs-xl) !important;
        line-height: 1.1 !important;
        padding: var(--dw-sp-3) var(--dw-sp-4) !important;
        max-width: calc(100% - 2 * var(--dw-sp-3));
    }

    /* (Desktop has its own widget_text rules outside this media
     * query — see section 7a below.) */

    /* Touch targets */
    .dueseweb-modern a,
    .dueseweb-modern button,
    .dueseweb-modern input[type="submit"] {
        min-height: 44px;
    }

    /* Footer — minimal on mobile. Collapse to a single compact
     * strip with just the essential legal links (Impressum,
     * Datenschutz) + language picker. No boxes, no headings,
     * no padding bloat. */
    .dueseweb-modern #footer,
    .dueseweb-modern .site-footer,
    .dueseweb-modern #colophon,
    .dueseweb-modern #footer-widget-area {
        padding: var(--dw-sp-5) var(--dw-sp-4) var(--dw-sp-4) !important;
    }
    .dueseweb-modern #footer #colophon,
    .dueseweb-modern #footer > .inside,
    .dueseweb-modern .site-footer .footer-widgets {
        grid-template-columns: 1fr;
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern #footer .widget-container,
    .dueseweb-modern .site-footer .widget {
        background: transparent;
        border: none;
        padding: var(--dw-sp-2) 0;
        border-radius: 0;
    }
    .dueseweb-modern #footer h1,
    .dueseweb-modern #footer h2,
    .dueseweb-modern #footer h3,
    .dueseweb-modern #footer h4,
    .dueseweb-modern #footer h5,
    .dueseweb-modern #footer h6,
    .dueseweb-modern #footer .widget-title {
        font-size: var(--dw-fs-xs) !important;
        padding-bottom: var(--dw-sp-1) !important;
        margin-bottom: var(--dw-sp-2) !important;
    }
    .dueseweb-modern #footer li {
        display: inline;
        margin: 0 var(--dw-sp-2) 0 0;
        padding: 0;
        border-bottom: none;
        font-size: var(--dw-fs-xs);
    }
    .dueseweb-modern #footer ul {
        margin: 0;
        padding: 0;
    }
}

/* ===== 13. Tablet (768–1024px) =================================*/
@media (min-width: 768px) and (max-width: 1024px) {
    .dueseweb-modern #front-columns {
        grid-template-columns: repeat(2, 1fr);
    }
}

/* ===== 14b. Office status bar ===================================*/
/* Floating glassmorphism bar at the top of every page showing
 * office hours, phone, email, staff absences, and PBX phone
 * count. Data from DueseCal's SQLite databases. */
/* Office bar removed — merged into team presence pill (see below) */
@media (max-width: 767px) {
    .dueseweb-modern .dw-auth-avatar {
        top: 6px;
        left: 50%;
        transform: translateX(-50%);
        font-size: 0.7rem;
        padding: 0.25rem 0.5rem;
    }
    .dueseweb-modern .dw-auth-avatar-name {
        display: none; /* icon only on mobile */
    }
}

/* ===== 18. Multi-step form wizard ==============================*/
/* Glassmorphism multi-step forms for CF7. Wraps the CF7 output
 * in step divs with progress dots + next/back navigation.
 * See docs/superpowers/specs/2026-04-12-dueseweb-newprod-form-wizard-design.md */

/* Progress bar */
.dueseweb-modern .dw-wizard-progress {
    display: flex;
    align-items: center;
    gap: var(--dw-sp-3);
    margin-bottom: var(--dw-sp-6);
    padding: var(--dw-sp-3) var(--dw-sp-4);
    background: rgba(3, 19, 33, 0.42);
    border-radius: var(--dw-radius-md);
    backdrop-filter: saturate(1.15) blur(10px);
    -webkit-backdrop-filter: saturate(1.15) blur(10px);
}
.dueseweb-modern .dw-wizard-dots {
    display: flex;
    gap: var(--dw-sp-2);
}
.dueseweb-modern .dw-wizard-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid var(--dw-border);
    background: transparent;
    transition: background 200ms ease, border-color 200ms ease, transform 200ms ease;
}
.dueseweb-modern .dw-wizard-dot.is-active {
    background: var(--dw-ink);
    border-color: var(--dw-ink);
    transform: scale(1.2);
}
.dueseweb-modern .dw-wizard-dot.is-completed {
    background: var(--dw-muted);
    border-color: var(--dw-muted);
}
.dueseweb-modern .dw-wizard-progress-label {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    margin-left: auto;
    letter-spacing: 0.04em;
}

/* Step container */
.dueseweb-modern .dw-wizard-step {
    padding: var(--dw-sp-5) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.52);
    border: 1px solid rgba(255, 220, 184, 0.12);
    border-radius: var(--dw-radius-lg);
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    margin-bottom: var(--dw-sp-5);
}
.dueseweb-modern .dw-wizard-step-title {
    font-family: var(--dw-font-serif) !important;
    font-size: var(--dw-fs-xl) !important;
    font-weight: 400 !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-5) !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
    letter-spacing: -0.01em;
}

/* Form inputs — glassmorphism treatment */
.dueseweb-modern .wpcf7-form input[type="text"],
.dueseweb-modern .wpcf7-form input[type="email"],
.dueseweb-modern .wpcf7-form input[type="tel"],
.dueseweb-modern .wpcf7-form input[type="url"],
.dueseweb-modern .wpcf7-form input[type="date"],
.dueseweb-modern .wpcf7-form input[type="number"],
.dueseweb-modern .wpcf7-form select,
.dueseweb-modern .wpcf7-form textarea {
    width: 100% !important;
    min-height: 52px;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    font-family: var(--dw-font-sans);
    font-size: 16px;         /* prevents Safari auto-zoom */
    line-height: 1.4;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.62) !important;
    border: 1px solid rgba(255, 220, 184, 0.22) !important;
    border-radius: var(--dw-radius-md);
    transition: border-color 200ms ease, box-shadow 200ms ease;
}
.dueseweb-modern .wpcf7-form input:focus,
.dueseweb-modern .wpcf7-form select:focus,
.dueseweb-modern .wpcf7-form textarea:focus {
    outline: none;
    border-color: var(--dw-ink) !important;
    box-shadow: 0 0 0 3px rgba(255, 220, 184, 0.2);
}
.dueseweb-modern .wpcf7-form input::placeholder,
.dueseweb-modern .wpcf7-form textarea::placeholder {
    color: rgba(255, 220, 184, 0.4);
}
.dueseweb-modern .wpcf7-form textarea {
    min-height: 120px;
    resize: vertical;
}
.dueseweb-modern .wpcf7-form select {
    appearance: auto;
    cursor: pointer;
}

/* Labels */
.dueseweb-modern .wpcf7-form label,
.dueseweb-modern .wpcf7-form .wpcf7-list-item-label {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: var(--dw-ink);
    margin-bottom: var(--dw-sp-2);
}

/* Helper text */
.dueseweb-modern .dw-wizard-helper {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    margin-top: var(--dw-sp-1);
    margin-bottom: var(--dw-sp-3);
}

/* Validation errors */
.dueseweb-modern .dw-wizard-invalid {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.25) !important;
}
.dueseweb-modern .dw-wizard-error {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: #ef4444;
    margin-top: var(--dw-sp-1);
}

/* Checkboxes */
.dueseweb-modern .wpcf7-form .wpcf7-checkbox,
.dueseweb-modern .wpcf7-form .wpcf7-acceptance {
    display: flex;
    align-items: flex-start;
    gap: var(--dw-sp-3);
    margin: var(--dw-sp-3) 0;
}
.dueseweb-modern .wpcf7-form .wpcf7-checkbox input[type="checkbox"],
.dueseweb-modern .wpcf7-form .wpcf7-acceptance input[type="checkbox"] {
    width: 24px !important;
    height: 24px !important;
    min-height: 24px !important;
    flex-shrink: 0;
    accent-color: var(--dw-terracotta);
    cursor: pointer;
}

/* Navigation buttons */
.dueseweb-modern .dw-wizard-nav {
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-3);
    margin-top: var(--dw-sp-5);
}
.dueseweb-modern .dw-wizard-next {
    width: 100%;
    min-height: 56px;
    padding: var(--dw-sp-4) var(--dw-sp-6);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    font-weight: 600;
    color: #fff;
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA white-on-orange */
    border: none;
    border-radius: var(--dw-radius-md);
    cursor: pointer;
    transition: background 200ms ease, transform 200ms ease;
}
.dueseweb-modern .dw-wizard-next:hover {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    transform: translateY(-1px);
}
.dueseweb-modern .dw-wizard-back {
    width: 100%;
    min-height: 44px;
    padding: var(--dw-sp-3);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    background: transparent;
    border: none;
    cursor: pointer;
    transition: color 200ms ease;
}
.dueseweb-modern .dw-wizard-back:hover {
    color: var(--dw-ink);
}

/* Final submit button — green */
.dueseweb-modern .dw-wizard-submit-final {
    width: 100% !important;
    min-height: 56px !important;
    padding: var(--dw-sp-4) var(--dw-sp-6) !important;
    font-family: var(--dw-font-sans) !important;
    font-size: var(--dw-fs-base) !important;
    font-weight: 600 !important;
    color: #fff !important;
    background: #16a34a !important;
    border: none !important;
    border-radius: var(--dw-radius-md) !important;
    cursor: pointer;
    transition: background 200ms ease;
}
.dueseweb-modern .dw-wizard-submit-final:hover {
    background: #15803d !important;
}

/* Success state */
.dueseweb-modern .dw-wizard-success {
    text-align: center;
    padding: var(--dw-sp-9) var(--dw-sp-5);
}
.dueseweb-modern .dw-wizard-success-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 72px;
    height: 72px;
    border-radius: 50%;
    background: #16a34a;
    color: #fff;
    font-size: 2.5rem;
    margin-bottom: var(--dw-sp-5);
}
.dueseweb-modern .dw-wizard-success-title {
    font-family: var(--dw-font-serif) !important;
    font-size: var(--dw-fs-2xl) !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-3) !important;
}
.dueseweb-modern .dw-wizard-success-sub {
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-4);
}
.dueseweb-modern .dw-wizard-success-email {
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    margin: 0 0 var(--dw-sp-6);
}
.dueseweb-modern .dw-wizard-success-home {
    color: var(--dw-ink) !important;
    text-decoration: underline;
}

/* Retry message */
.dueseweb-modern .dw-wizard-retry {
    text-align: center;
    padding: var(--dw-sp-5);
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: var(--dw-radius-md);
    margin-top: var(--dw-sp-5);
}
.dueseweb-modern .dw-wizard-retry-btn {
    margin-top: var(--dw-sp-3);
    padding: var(--dw-sp-3) var(--dw-sp-5);
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA white-on-orange */
    color: #fff;
    border: none;
    border-radius: var(--dw-radius-md);
    cursor: pointer;
}

/* Mobile — full bleed steps */
@media (max-width: 767px) {
    .dueseweb-modern .dw-wizard-step {
        border-radius: 0;
        border-left: none;
        border-right: none;
        padding: var(--dw-sp-5) var(--dw-sp-4);
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .dueseweb-modern .dw-wizard-step {
        transition: none !important;
    }
}

/* Hide CF7's default response output — we handle it ourselves */
.dueseweb-modern .wpcf7-response-output {
    display: none !important;
}

/* ===== 21. Staff page — hero layout + carousel =================*/
/* Same pattern as the homepage: heading + CTA + big carousel
 * filling the viewport. Body text below gets glass backing. */

/* Hide TMM plugin blocks */
.dueseweb-modern .tmm_member,
.dueseweb-modern .tmm_container,
.dueseweb-modern .tmm_wrap,
.dueseweb-modern .tmm_3_columns {
    display: none !important;
}
.dueseweb-modern .tmm.tmm_reiseabteilung-taub {
    display: none !important;
}

/* Staff carousel section — full viewport hero */
.dueseweb-modern .dw-staff-carousel {
    padding: var(--dw-sp-4) var(--dw-sp-5) var(--dw-sp-7);
    min-height: 90vh;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.dueseweb-modern .dw-staff-header {
    text-align: center;
    margin-bottom: var(--dw-sp-5);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--dw-sp-4);
}
.dueseweb-modern .dw-staff-heading {
    font-family: var(--dw-font-serif);
    font-size: clamp(1.8rem, 4vw, 2.8rem);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0;
    padding: var(--dw-sp-4) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.45);
    backdrop-filter: saturate(1.2) blur(12px);
    -webkit-backdrop-filter: saturate(1.2) blur(12px);
    border-radius: var(--dw-radius-lg);
    border: 1px solid rgba(255, 220, 184, 0.10);
    text-shadow: 0 2px 18px rgba(3, 19, 33, 0.7);
}
.dueseweb-modern .dw-staff-cta {
    margin: 0 0 var(--dw-sp-5);
}

/* Staff cards */
.dueseweb-modern .dw-staff-splide {
    width: 100%;
    max-width: 1600px;
}
.dueseweb-modern .dw-staff-card {
    text-align: center;
    padding: var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.52);
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    border: 1px solid rgba(255, 220, 184, 0.14);
    border-radius: var(--dw-radius-lg);
    transition: transform 300ms ease, box-shadow 300ms ease, opacity 300ms ease;
    /* Blurred vignette edges */
    -webkit-mask-image: radial-gradient(
        ellipse 92% 92% at center,
        rgba(0, 0, 0, 1) 65%,
        rgba(0, 0, 0, 0) 100%
    );
    mask-image: radial-gradient(
        ellipse 92% 92% at center,
        rgba(0, 0, 0, 1) 65%,
        rgba(0, 0, 0, 0) 100%
    );
}
.dueseweb-modern .splide__slide.is-active .dw-staff-card {
    transform: scale(1.03);
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.4);
    border-color: rgba(255, 220, 184, 0.28);
    opacity: 1;
}
.dueseweb-modern .splide__slide:not(.is-active) .dw-staff-card {
    opacity: 0.55;
    transform: scale(0.93);
}
.dueseweb-modern .dw-staff-photo {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    background-size: cover;
    background-position: center top;
    margin: 0 auto var(--dw-sp-4);
    border: 3px solid rgba(255, 220, 184, 0.25);
}
.dueseweb-modern .dw-staff-name {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-2);
}
.dueseweb-modern .dw-staff-since {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    margin: 0;
    font-style: italic;
}
/* Staff Splide arrows — glass, inside the cards */
.dueseweb-modern .dw-staff-splide .splide__arrow {
    background: rgba(3, 19, 33, 0.72) !important;
    border: 1px solid rgba(255, 220, 184, 0.25) !important;
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    opacity: 1 !important;
    width: 48px !important;
    height: 48px !important;
}
.dueseweb-modern .dw-staff-splide .splide__arrow svg {
    fill: var(--dw-ink) !important;
}

/* Mobile: 95% width, bigger cards */
@media (max-width: 959px) {
    .dueseweb-modern .dw-staff-carousel {
        padding: var(--dw-sp-3) 0 var(--dw-sp-5);
    }
    .dueseweb-modern .dw-staff-card {
        width: 95%;
        margin: 0 auto;
    }
    .dueseweb-modern .dw-staff-photo {
        width: 180px;
        height: 180px;
    }
    .dueseweb-modern .dw-staff-name {
        font-size: var(--dw-fs-2xl);
    }
}

/* On mobile: hide the page text content, breadcrumb, and title.
 * Keep the carousel (which is inside .entry-content > .tmm). */
@media (max-width: 959px) {
    body.page-id-59.dueseweb-modern .entry-title {
        display: none !important;
    }
    /* Hide paragraphs and other text inside entry-content,
     * but NOT the .tmm wrapper that holds the carousel. */
    body.page-id-59.dueseweb-modern .entry-content > p,
    body.page-id-59.dueseweb-modern .entry-content > h2,
    body.page-id-59.dueseweb-modern .entry-content > h3,
    body.page-id-59.dueseweb-modern .entry-content > ul,
    body.page-id-59.dueseweb-modern .entry-content > ol,
    body.page-id-59.dueseweb-modern .entry-content > div:not(.tmm),
    body.page-id-59.dueseweb-modern .entry-content > .elementor {
        display: none !important;
    }
    /* Strip glass/padding from entry-content itself so
     * only the carousel is visible — clean, no boxes. */
    body.page-id-59.dueseweb-modern .entry-content {
        background: transparent !important;
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        border: none !important;
        padding: 0 !important;
        margin: 0 !important;
    }
}
/* Desktop: show body text with glass + peach */
@media (min-width: 960px) {
    body.page-id-59.dueseweb-modern .entry-content {
        background: rgba(3, 19, 33, 0.52) !important;
        backdrop-filter: saturate(1.15) blur(14px) !important;
        -webkit-backdrop-filter: saturate(1.15) blur(14px) !important;
        border: 1px solid rgba(255, 220, 184, 0.10) !important;
        border-radius: var(--dw-radius-lg) !important;
        padding: var(--dw-sp-6) var(--dw-sp-5) !important;
        color: var(--dw-ink) !important;
    }
    body.page-id-59.dueseweb-modern .entry-content p,
    body.page-id-59.dueseweb-modern .entry-content li,
    body.page-id-59.dueseweb-modern .entry-content span,
    body.page-id-59.dueseweb-modern .entry-content a {
        font-size: var(--dw-fs-lg) !important;
        line-height: 1.7 !important;
        color: var(--dw-ink) !important;
    }
    body.page-id-59.dueseweb-modern .entry-content h1,
    body.page-id-59.dueseweb-modern .entry-content h2,
    body.page-id-59.dueseweb-modern .entry-content h3 {
        color: var(--dw-ink) !important;
    }
}

/* ===== 22. Full-page Leaflet map ================================*/

/* Break the map page out of Nirvana's containers — full-width,
   edge-to-edge, no sidebar, no padding. */
body.page-id-112.dueseweb-modern #main,
body.page-id-112.dueseweb-modern #forbottom,
body.page-id-112.dueseweb-modern #container,
body.page-id-112.dueseweb-modern #content,
body.page-id-112.dueseweb-modern #post-112,
body.page-id-112.dueseweb-modern .entry-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
}
body.page-id-112.dueseweb-modern #container {
    display: block !important;
}
/* Hide the sidebar on map page */
body.page-id-112.dueseweb-modern #sidebar {
    display: none !important;
}
.dueseweb-modern .dw-map-hero {
    text-align: center;
    padding: var(--dw-sp-4) var(--dw-sp-5) var(--dw-sp-3);
    background: rgba(3, 19, 33, 0.52);
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
}
.dueseweb-modern .dw-map-hero-title {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(1.5rem, 3.5vw, 2.4rem) !important;
    font-weight: 400 !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-2) !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    text-shadow: 0 2px 18px rgba(3, 19, 33, 0.7);
}
.dueseweb-modern .dw-map-hero-sub {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    max-width: 56ch;
    margin: 0 auto;
}
.dueseweb-modern .dw-map-hero-num {
    color: var(--dw-ink);
    font-weight: 600;
}
/* Compact top variant — instruction line + search form. The 80px
   top padding clears the fixed .dw-desktop-banner-lean banner
   (height ~68px, z-index 1000) that overlays the page from y=0
   on every site URL. Without this clearance the instruction was
   visually hidden under the banner. */
.dueseweb-modern .dw-map-hero--compact {
    padding: 80px var(--dw-sp-4) var(--dw-sp-3);
}
.dueseweb-modern .dw-map-hero-instruction {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-md);
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-3);
    text-align: center;
    line-height: 1.45;
    max-width: 64ch;
    margin-left: auto;
    margin-right: auto;
}
.dueseweb-modern .dw-map-hero-instruction strong {
    color: var(--dw-terracotta);
    font-weight: 600;
}
/* Centre the search form and give it breathing room so the input,
   button, and live-status don't fight each other. */
.dueseweb-modern .dw-map-hero--compact .dw-map-search {
    max-width: 720px;
    margin: 0 auto;
}

.dueseweb-modern .dw-fullmap {
    width: 100%;
    /* Tuned so a 1440x900 / 1366x768 laptop fits the entire page
       (top hero + map + theme chrome) inside one viewport without a
       scrollbar. Empirically: hero with banner clearance ~200px +
       theme padding/footer offset ~75px ≈ 270. */
    height: calc(100vh - 270px);
    min-height: 380px;
    border-radius: 0;
    overflow: hidden;
    border: none;
    position: relative; /* anchors the basemap toggle button */
}

/* Basemap toggle — Satellit / Karte. Hardcoded hex (not --dw-cream
   / --dw-navy) because those tokens are inverted on this theme
   (--dw-navy resolves to cream, --dw-cream to dark blue), which
   would render an invisible cream-on-cream button. */
.dueseweb-modern .dw-map-layer-toggle {
    position: absolute;
    top: 12px;
    right: 12px;
    z-index: 800;
    padding: 8px 14px;
    font-family: var(--dw-font-sans);
    font-size: 0.85rem;
    font-weight: 600;
    color: #ffdcb8; /* warm peach */
    background: #0e3558; /* navy */
    border: none;
    border-radius: 999px;
    cursor: pointer;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
    transition: background 120ms ease;
}
.dueseweb-modern .dw-map-layer-toggle:hover,
.dueseweb-modern .dw-map-layer-toggle:focus-visible {
    /* Peach text stays; #a3431a keeps it at 4.79:1 (was #ef6c3a, 2.35:1). */
    background: var(--dw-terracotta-cta-hover, #a3431a);
    outline: none;
}
/* Hide the old GMP plugin output entirely */
.dueseweb-modern .gmpMapDetailsContainer,
.dueseweb-modern .gmp_map_opts,
.dueseweb-modern [id*="google_map_easy"],
.dueseweb-modern .elementor-widget-shortcode:has([class*="gmp"]) {
    display: none !important;
}
/* Hide broken FooGallery images — cached from old domain, 404 */
.dueseweb-modern .foogallery-container {
    display: none !important;
}

/* No CSS-side label-readability filters: street view (Esri World
   Street Map, see DUESEWEB_TILES_* in 02-dueseweb-constants.php) is
   the default basemap on /interaktive-karte/ and ships crisp,
   halo-free labels by design. The per-leaf mini-maps
   (.dw-city-map) still use the satellite stack, so leave their
   built-in label halos alone — earlier filter experiments
   (white drop-shadow trio, letterpress dual-shadow, dim-satellite-
   no-halo) all produced visible halo bleed around dense clusters. */

/* Map marker dots — volume-tiered sizing */
.dueseweb-modern .dw-finder-marker {
    pointer-events: auto;
}
.dueseweb-modern .dw-fullmap .dw-finder-marker-dot {
    display: block;
    border-radius: 50%;
    border: 2px solid var(--dw-ink);
    transition: transform var(--dw-dur-fast) var(--dw-ease);
}
/* XL: 1000+ sessions — gold glow, largest */
.dueseweb-modern .dw-fullmap .dw-vol-xl .dw-finder-marker-dot {
    width: 24px;
    height: 24px;
    margin: 4px;
    background: #f4a261;
    box-shadow: 0 0 6px 3px rgba(244, 162, 97, 0.6),
                0 0 0 2px rgba(3, 19, 33, 0.65);
}
/* Large: 500-999 — bright terracotta */
.dueseweb-modern .dw-fullmap .dw-vol-lg .dw-finder-marker-dot {
    width: 18px;
    height: 18px;
    margin: 4px;
    background: #e76f51;
    box-shadow: 0 0 4px 2px rgba(231, 111, 81, 0.5),
                0 0 0 2px rgba(3, 19, 33, 0.65);
}
/* Medium: 100-499 — standard terracotta */
.dueseweb-modern .dw-fullmap .dw-vol-md .dw-finder-marker-dot {
    width: 13px;
    height: 13px;
    margin: 3.5px;
    background: var(--dw-terracotta);
    box-shadow: 0 0 0 2px rgba(3, 19, 33, 0.65);
}
/* Small: <100 — muted, subtle */
.dueseweb-modern .dw-fullmap .dw-vol-sm .dw-finder-marker-dot {
    width: 8px;
    height: 8px;
    margin: 3px;
    background: rgba(255, 220, 184, 0.5);
    border-width: 1px;
    box-shadow: 0 0 0 1px rgba(3, 19, 33, 0.5);
}
.dueseweb-modern .dw-fullmap .leaflet-marker-icon:hover .dw-finder-marker-dot {
    transform: scale(1.4);
}

/* Map popup with image thumbnail */
.dueseweb-modern .dw-map-popup {
    text-align: left;
}
.dueseweb-modern .dw-map-popup-img {
    display: block;
    width: 100%;
    height: 120px;
    object-fit: cover;
    border-radius: var(--dw-radius-md) var(--dw-radius-md) 0 0;
    margin: -12px -20px 10px;
    width: calc(100% + 40px);
}
.dueseweb-modern .dw-map-popup b {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-base);
    display: block;
    margin-bottom: 4px;
}
.dueseweb-modern .dw-map-popup span {
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
}
.dueseweb-modern .dw-map-popup-badge {
    display: inline-block;
    color: #f4a261 !important;
    font-style: normal;
    font-size: var(--dw-fs-xs);
    font-weight: 600;
}
.dueseweb-modern .dw-map-popup-weather {
    display: block;
    font-size: clamp(0.95rem, 2vw, 1.15rem) !important;
    font-weight: 600;
    color: var(--dw-ink) !important;
    margin: 4px 0;
}
.dueseweb-modern .dw-map-popup a {
    color: var(--dw-ink) !important;
    font-weight: 600;
}
/* Action row in the marker popup — two CTAs side-by-side. */
.dueseweb-modern .dw-map-popup-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
    margin-top: 10px;
}
.dueseweb-modern .dw-map-popup-btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 1 1 auto;
    min-width: 0;
    padding: 6px 10px;
    font-family: var(--dw-font-sans);
    font-size: 0.82rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: 8px;
    transition: background 120ms ease, color 120ms ease, border-color 120ms ease;
    text-align: center;
    white-space: nowrap;
}
.dueseweb-modern .dw-map-popup-btn--primary {
    color: #fff;
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA white-on-orange (13px/600 = normal text) */
    border: 1.5px solid var(--dw-terracotta-cta, #bf501c);
}
.dueseweb-modern .dw-map-popup-btn--primary:hover,
.dueseweb-modern .dw-map-popup-btn--primary:focus-visible {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    border-color: var(--dw-terracotta-cta-hover, #a3431a);
    color: #fff;
    outline: none;
}
.dueseweb-modern .dw-map-popup-btn--secondary {
    color: var(--dw-terracotta);
    background: transparent;
    border: 1.5px solid var(--dw-terracotta);
}
.dueseweb-modern .dw-map-popup-btn--secondary:hover,
.dueseweb-modern .dw-map-popup-btn--secondary:focus-visible {
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA white-on-orange on hover/focus */
    color: #fff;
    outline: none;
}
.dueseweb-modern .dw-map-popup-title {
    display: block;
    font-size: 1rem;
    margin-bottom: 2px;
}
.dueseweb-modern .dw-map-popup-country {
    display: block;
    font-size: 0.85rem;
    color: var(--dw-muted);
    margin-bottom: 4px;
}
.dueseweb-modern .dw-map-popup-address,
.dueseweb-modern .dw-map-popup-pointer {
    display: block;
    font-size: 0.85rem;
    margin-bottom: 4px;
}
/* Tour popup — slightly larger, no close button */
.dueseweb-modern .dw-tour-popup-wrap .leaflet-popup-content-wrapper {
    padding: 0 !important;
    overflow: hidden;
}
.dueseweb-modern .dw-tour-popup-wrap .leaflet-popup-content {
    margin: 12px 20px;
}
.dueseweb-modern .dw-tour-popup b {
    font-size: clamp(1rem, 2.5vw, 1.2rem);
}

/* Diamond marker — live treatment overlay */
.dw-live-diamond {
    pointer-events: auto !important;
}
.dw-diamond-shape {
    display: block;
    width: 14px;
    height: 14px;
    margin: 5px;
    background: #ff6b6b;
    border: 2px solid #fff;
    transform: rotate(45deg);
    box-shadow: 0 0 8px 3px rgba(255, 107, 107, 0.6),
                0 0 0 1px rgba(3, 19, 33, 0.5);
    animation: dw-diamond-pulse 2.5s ease-in-out infinite;
}
@keyframes dw-diamond-pulse {
    0%, 100% { box-shadow: 0 0 8px 3px rgba(255, 107, 107, 0.6), 0 0 0 1px rgba(3, 19, 33, 0.5); }
    50% { box-shadow: 0 0 16px 6px rgba(255, 107, 107, 0.8), 0 0 0 1px rgba(3, 19, 33, 0.5); }
}

/* Legend bar below the hero subtitle */
.dueseweb-modern .dw-map-legend {
    display: flex;
    justify-content: center;
    gap: var(--dw-sp-4);
    margin-top: var(--dw-sp-3);
    flex-wrap: wrap;
}
.dueseweb-modern .dw-map-legend-item {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
}
.dueseweb-modern .dw-legend-dot {
    display: inline-block;
    border-radius: 50%;
    border: 1.5px solid var(--dw-ink);
}
.dueseweb-modern .dw-legend-xl {
    width: 16px; height: 16px;
    background: #f4a261;
    box-shadow: 0 0 4px 2px rgba(244, 162, 97, 0.5);
}
.dueseweb-modern .dw-legend-lg {
    width: 13px; height: 13px;
    background: #e76f51;
    box-shadow: 0 0 3px 1px rgba(231, 111, 81, 0.4);
}
.dueseweb-modern .dw-legend-md {
    width: 10px; height: 10px;
    background: var(--dw-terracotta);
}
.dueseweb-modern .dw-legend-sm {
    width: 7px; height: 7px;
    background: rgba(255, 220, 184, 0.5);
}
.dueseweb-modern .dw-legend-diamond {
    display: inline-block;
    width: 10px; height: 10px;
    background: #ff6b6b;
    border: 1.5px solid #fff;
    transform: rotate(45deg);
    box-shadow: 0 0 4px 2px rgba(255, 107, 107, 0.5);
}
/* Replay tour button */
.dueseweb-modern .dw-map-replay {
    display: inline-block;
    margin-top: var(--dw-sp-3);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.52);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 999px;
    padding: 0.5rem 1.2rem;
    cursor: pointer;
    transition: background var(--dw-dur-fast) var(--dw-ease),
                border-color var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-map-replay:hover {
    background: rgba(3, 19, 33, 0.72);
    border-color: var(--dw-ink);
}

/* City search bar above the map */
.dueseweb-modern .dw-map-search {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    margin: var(--dw-sp-3) 0 0;
    padding: 0;
    max-width: 720px;
}
.dueseweb-modern .dw-map-search-input {
    flex: 1 1 220px;
    min-width: 200px;
    padding: 0.55rem 0.95rem;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.52);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 999px;
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    outline: none;
}
.dueseweb-modern .dw-map-search-input::placeholder {
    color: rgba(255, 220, 184, 0.55);
}
.dueseweb-modern .dw-map-search-input:focus {
    border-color: var(--dw-accent, #e8702a);
    box-shadow: 0 0 0 3px rgba(232, 112, 42, 0.2);
}
.dueseweb-modern .dw-map-search-btn {
    padding: 0.55rem 1.1rem;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: #fff;
    background: var(--dw-accent, #e8702a);
    border: 1px solid var(--dw-accent, #e8702a);
    border-radius: 999px;
    cursor: pointer;
    transition: transform 120ms ease, box-shadow 120ms ease;
}
.dueseweb-modern .dw-map-search-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
}
.dueseweb-modern .dw-map-search-status {
    flex: 1 1 100%;
    font-family: var(--dw-font-sans);
    font-size: 0.82rem;
    color: rgba(255, 220, 184, 0.85);
    line-height: 1.45;
}
.dueseweb-modern .dw-map-search-status strong {
    color: var(--dw-ink);
    font-weight: 600;
}
.dueseweb-modern .dw-map-share-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
    margin-left: 0.5em;
    padding: 0.25em 0.7em;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    color: var(--dw-terracotta);
    background: transparent;
    border: 1.5px solid var(--dw-terracotta);
    border-radius: 999px;
    cursor: pointer;
    position: relative;
    transition: background 120ms ease, color 120ms ease;
}
.dueseweb-modern .dw-map-share-pill:hover,
.dueseweb-modern .dw-map-share-pill:focus-visible {
    /* Peach on #a3431a = 4.79:1 (was --dw-terracotta, 2.35:1). */
    background: var(--dw-terracotta-cta-hover, #a3431a);
    border-color: var(--dw-terracotta-cta-hover, #a3431a);
    color: var(--dw-ink);
    outline: none;
}
.dueseweb-modern .dw-map-share-pill__tooltip {
    position: absolute;
    bottom: calc(100% + 6px);
    left: 50%;
    transform: translateX(-50%);
    padding: 0.25em 0.6em;
    font-size: var(--dw-fs-xs);
    font-weight: 500;
    color: #fff;
    background: rgba(3, 19, 33, 0.92);
    border-radius: 6px;
    white-space: nowrap;
    pointer-events: none;
    animation: dw-map-share-tip 2s ease forwards;
}
@keyframes dw-map-share-tip {
    0% { opacity: 0; transform: translateX(-50%) translateY(2px); }
    15%, 85% { opacity: 1; transform: translateX(-50%) translateY(0); }
    100% { opacity: 0; transform: translateX(-50%) translateY(-2px); }
}
/* Search result pin — neutral blue diamond with outer ring */
.dw-map-search-pin {
    background: transparent !important;
    border: 0 !important;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dw-map-search-pin::before {
    content: "";
    width: 22px; height: 22px;
    background: rgba(59, 130, 246, 0.92);
    border: 3px solid #fff;
    border-radius: 50%;
    box-shadow: 0 0 0 4px rgba(59, 130, 246, 0.35);
}

/* Hide legend on mobile — takes too much space */
@media (max-width: 767px) {
    .dueseweb-modern .dw-map-legend {
        display: none;
    }
    .dueseweb-modern .dw-map-search-input {
        flex-basis: 100%;
    }
    .dueseweb-modern .dw-map-search-btn {
        flex-basis: 100%;
    }
}

/* Leaflet popup styling */
.dueseweb-modern .dw-fullmap .leaflet-popup-content-wrapper {
    background: #02101c;
    color: var(--dw-ink);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: var(--dw-radius-md);
}
.dueseweb-modern .dw-fullmap .leaflet-popup-tip {
    background: #02101c;
}
.dueseweb-modern .dw-fullmap .leaflet-popup-content {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-ink);
}
.dueseweb-modern .dw-fullmap .leaflet-popup-content b {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-base);
    display: block;
    margin-bottom: var(--dw-sp-2);
}
.dueseweb-modern .dw-fullmap .leaflet-popup-content a {
    color: var(--dw-ink) !important;
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-fullmap {
        height: calc(100vh - 60px);
    }
    .dueseweb-modern .dw-map-hero {
        padding: var(--dw-sp-3) var(--dw-sp-4);
    }
}

/* Preserve the existing phone header/back controls: the generic mobile
   hero shorthand above must not put map instructions underneath them. */
@media (max-width: 600px) {
    .dueseweb-modern .dw-map-hero.dw-map-hero--compact {
        padding-top: calc(100px + env(safe-area-inset-top, 0px));
    }
    /* Touch subpages already expose the named menu button; its animated
       desktop tooltip overlaps the neighbouring contact control. */
    .dueseweb-modern:not(.home):not(.dw-phone-enquiry) #dw-nav-toggle .dw-nav-tooltip {
        display: none;
    }
}

/* ===== 22b. City detail pages — Elementor glassmorphism overrides */

/* Kill all Elementor inline background colours — the green #28bfbd
   teal, the dark greys, everything. We paint our own glass. */
.dueseweb-modern .elementor-section,
.dueseweb-modern .elementor-column,
.dueseweb-modern .elementor-widget-wrap,
.dueseweb-modern .elementor-element {
    background-color: transparent !important;
    background-image: none !important;
    border: none !important;
    box-shadow: none !important;
}

/* Elementor headings — use our serif + ink colour */
.dueseweb-modern .elementor-heading-title {
    font-family: var(--dw-font-serif) !important;
    color: var(--dw-ink) !important;
    background: none !important;
    border: none !important;
    padding: 0 !important;
}
.dueseweb-modern .elementor-heading-title.elementor-size-default {
    font-size: clamp(1.3rem, 3vw, 1.8rem) !important;
    font-weight: 400 !important;
    margin: var(--dw-sp-4) 0 var(--dw-sp-3) !important;
}

/* Elementor text widgets — our font + colours */
.dueseweb-modern .elementor-widget-text-editor .elementor-widget-container {
    font-family: var(--dw-font-sans) !important;
    font-size: var(--dw-fs-base) !important;
    color: var(--dw-muted) !important;
    line-height: 1.7 !important;
}
.dueseweb-modern .elementor-widget-text-editor .elementor-widget-container strong {
    color: var(--dw-ink) !important;
}

/* Elementor buttons — glassmorphism CTA replacing the green teal */
.dueseweb-modern .elementor-button {
    background: rgba(3, 19, 33, 0.52) !important;
    backdrop-filter: saturate(1.15) blur(14px) !important;
    -webkit-backdrop-filter: saturate(1.15) blur(14px) !important;
    border: 1px solid rgba(255, 220, 184, 0.25) !important;
    border-radius: var(--dw-radius-md) !important;
    color: var(--dw-ink) !important;
    font-family: var(--dw-font-sans) !important;
    font-size: var(--dw-fs-sm) !important;
    padding: 0.6rem 1.4rem !important;
    transition: background var(--dw-dur-fast) var(--dw-ease),
                border-color var(--dw-dur-fast) var(--dw-ease) !important;
    text-decoration: none !important;
}
.dueseweb-modern .elementor-button:hover,
.dueseweb-modern .elementor-button:focus-visible {
    background: rgba(3, 19, 33, 0.72) !important;
    border-color: var(--dw-ink) !important;
}
.dueseweb-modern .elementor-button-text {
    color: var(--dw-ink) !important;
}
/* Button bar at the bottom — flex row, no inline bg */
.dueseweb-modern .elementor-button-wrapper {
    display: inline-flex !important;
    margin: 0 var(--dw-sp-2) var(--dw-sp-2) 0 !important;
}

/* Elementor tabs (hotel listings) — glass cards */
.dueseweb-modern .elementor-tab-title {
    font-family: var(--dw-font-serif) !important;
    font-size: var(--dw-fs-base) !important;
    color: var(--dw-ink) !important;
    background: rgba(3, 19, 33, 0.40) !important;
    border: 1px solid rgba(255, 220, 184, 0.12) !important;
    border-radius: var(--dw-radius-md) !important;
    padding: var(--dw-sp-3) var(--dw-sp-4) !important;
    margin-bottom: var(--dw-sp-2) !important;
    cursor: pointer;
    transition: background var(--dw-dur-fast) var(--dw-ease) !important;
}
.dueseweb-modern .elementor-tab-title:hover,
.dueseweb-modern .elementor-tab-title[aria-selected="true"] {
    background: rgba(3, 19, 33, 0.65) !important;
    border-color: rgba(255, 220, 184, 0.30) !important;
}
.dueseweb-modern .elementor-tab-title a {
    color: var(--dw-ink) !important;
    text-decoration: none !important;
}
.dueseweb-modern .elementor-tab-content {
    font-family: var(--dw-font-sans) !important;
    font-size: var(--dw-fs-sm) !important;
    color: var(--dw-muted) !important;
    line-height: 1.7 !important;
    background: rgba(3, 19, 33, 0.30) !important;
    border: 1px solid rgba(255, 220, 184, 0.08) !important;
    border-radius: 0 0 var(--dw-radius-md) var(--dw-radius-md) !important;
    padding: var(--dw-sp-4) !important;
    margin-top: calc(-1 * var(--dw-sp-2)) !important;
    margin-bottom: var(--dw-sp-3) !important;
}
.dueseweb-modern .elementor-tab-content img {
    border-radius: var(--dw-radius-md);
    margin: 0 var(--dw-sp-3) var(--dw-sp-3) 0;
    border: 1px solid rgba(255, 220, 184, 0.15);
}

/* Elementor accordion (FAQ) — same glass treatment */
.dueseweb-modern .elementor-accordion-item {
    border: none !important;
    margin-bottom: var(--dw-sp-2) !important;
}
.dueseweb-modern .elementor-accordion .elementor-tab-title {
    font-family: var(--dw-font-sans) !important;
    font-size: var(--dw-fs-base) !important;
}
.dueseweb-modern .elementor-accordion .elementor-tab-content {
    border-top: none !important;
}
.dueseweb-modern .elementor-accordion-icon i {
    color: var(--dw-ink) !important;
}
.dueseweb-modern .elementor-accordion-title {
    color: var(--dw-ink) !important;
}

/* Elementor section padding — tighter, remove giant gaps */
.dueseweb-modern .elementor-section.elementor-section-boxed > .elementor-container {
    max-width: 900px !important;
}
.dueseweb-modern .elementor-section {
    padding: 0 !important;
    margin-bottom: var(--dw-sp-3) !important;
}
.dueseweb-modern .elementor-column-gap-default > .elementor-column > .elementor-element-populated {
    padding: var(--dw-sp-2) !important;
}

/* ===== 22c. City detail page mini-map ===========================*/
.dueseweb-modern .dw-city-map-section {
    margin: var(--dw-sp-5) 0;
}
.dueseweb-modern .dw-city-map-heading {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(1.2rem, 2.5vw, 1.6rem) !important;
    font-weight: 400 !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-3) !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}
.dueseweb-modern .dw-city-map {
    width: 100%;
    height: 350px;
    border-radius: var(--dw-radius-lg);
    overflow: hidden;
    border: 1px solid rgba(255, 220, 184, 0.15);
    box-shadow: var(--dw-shadow-lg);
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern .dw-city-map .dw-finder-marker-dot {
    display: block;
    width: 18px;
    height: 18px;
    margin: 5px;
    border-radius: 50%;
    background: var(--dw-terracotta);
    border: 2px solid var(--dw-ink);
    box-shadow: 0 0 0 2px rgba(3, 19, 33, 0.65);
}
.dueseweb-modern .dw-city-map .leaflet-popup-content-wrapper {
    background: #02101c;
    color: var(--dw-ink);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: var(--dw-radius-md);
}
.dueseweb-modern .dw-city-map .leaflet-popup-tip {
    background: #02101c;
}
.dueseweb-modern .dw-city-map-cta {
    background: rgba(3, 19, 33, 0.52);
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    border-radius: var(--dw-radius-lg);
    padding: var(--dw-sp-4);
    text-align: center;
}
.dueseweb-modern .dw-city-map-cta p {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    margin: 0 0 var(--dw-sp-3);
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-city-map {
        height: 280px;
        border-radius: var(--dw-radius-md);
    }
}

/* ===== 23. Auth / Login =========================================*/

/* Break login + dashboard pages out of Nirvana containers —
   full-width, no sidebar, no breadcrumb, no padding. */
body.page-id-266798.dueseweb-modern #main,
body.page-id-266798.dueseweb-modern #forbottom,
body.page-id-266798.dueseweb-modern #container,
body.page-id-266798.dueseweb-modern #content,
body.page-id-266798.dueseweb-modern .entry-content,
body.page-id-266799.dueseweb-modern #main,
body.page-id-266799.dueseweb-modern #forbottom,
body.page-id-266799.dueseweb-modern #container,
body.page-id-266799.dueseweb-modern #content,
body.page-id-266799.dueseweb-modern .entry-content {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
    float: none !important;
    background: none !important;
    border: none !important;
}
body.page-id-266798.dueseweb-modern #sidebar,
body.page-id-266799.dueseweb-modern #sidebar {
    display: none !important;
}
body.page-id-266798.dueseweb-modern .post,
body.page-id-266799.dueseweb-modern .post {
    background: none !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Full-screen layout — no card box, content floats on the
   background slideshow. Large, airy, elderly-friendly. */
.dueseweb-modern .dw-auth {
    min-height: 92vh;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: var(--dw-sp-5) var(--dw-sp-4);
}
.dueseweb-modern .dw-auth-card {
    width: 100%;
    max-width: 560px;
    background: none;
    border: none;
    padding: 0;
    text-align: center;
}
.dueseweb-modern .dw-auth-title {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(2rem, 6vw, 3rem) !important;
    font-weight: 400 !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-3) !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
    text-shadow: 0 2px 20px rgba(3, 19, 33, 0.8);
}
.dueseweb-modern .dw-auth-sub {
    font-family: var(--dw-font-sans);
    font-size: clamp(1rem, 2.5vw, 1.2rem);
    color: var(--dw-muted);
    margin: 0 0 var(--dw-sp-6);
    line-height: 1.7;
    text-shadow: 0 1px 8px rgba(3, 19, 33, 0.6);
}
.dueseweb-modern .dw-auth-label {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    text-align: left;
    margin-bottom: var(--dw-sp-2);
    text-shadow: 0 1px 6px rgba(3, 19, 33, 0.5);
}
.dueseweb-modern .dw-auth-input {
    display: block;
    width: 100%;
    font-family: var(--dw-font-sans);
    font-size: clamp(1.2rem, 3.5vw, 1.5rem);
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.45);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 220, 184, 0.20);
    border-radius: var(--dw-radius-lg);
    padding: var(--dw-sp-4) var(--dw-sp-5);
    margin-bottom: var(--dw-sp-4);
    outline: none;
    transition: border-color var(--dw-dur-fast) var(--dw-ease),
                background var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-auth-input:focus {
    border-color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.55);
}
.dueseweb-modern .dw-auth-btn {
    width: 100%;
    font-size: clamp(1.1rem, 3vw, 1.4rem) !important;
    padding: var(--dw-sp-4) var(--dw-sp-5) !important;
}
.dueseweb-modern .dw-auth-btn:disabled {
    opacity: 0.6;
    cursor: wait;
}
.dueseweb-modern .dw-auth-error {
    color: #ff6b6b;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    margin: var(--dw-sp-3) 0;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}

/* /anmelden tab pills — Phase 5b 2026-05-03 (WA login).
 * Visual treatment mirrors the .dw-mb-tabs row used inside
 * /mein-bereich/, kept narrow + low-contrast so the existing email
 * tab UX doesn't shift when the WA pane is selected. */
.dueseweb-modern .dw-auth-pills {
    display: flex;
    gap: 4px;
    border-bottom: 1px solid rgba(255, 220, 184, 0.20);
    margin-bottom: var(--dw-sp-5);
    justify-content: center;
}
.dueseweb-modern .dw-auth-pill {
    padding: 12px 18px;
    background: transparent;
    border: 0;
    border-bottom: 2px solid transparent;
    color: var(--dw-muted);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    cursor: pointer;
    text-transform: none;
    letter-spacing: 0;
    text-shadow: 0 1px 6px rgba(3, 19, 33, 0.5);
    transition: color var(--dw-dur-fast) var(--dw-ease),
                border-color var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-auth-pill[aria-selected="true"] {
    border-bottom-color: var(--dw-ink);
    color: var(--dw-ink);
    font-weight: 500;
}
.dueseweb-modern .dw-auth-pill:hover {
    color: var(--dw-ink);
}
.dueseweb-modern .dw-auth-pane {
    /* Container for the active tab's form; the actual layout is
     * inherited from .dw-auth-card, this just resets margin. */
    margin: 0;
}

/* OTP digit inputs — large, airy, glass background */
.dueseweb-modern .dw-auth-otp-wrap {
    display: flex;
    gap: clamp(0.5rem, 2vw, 1rem);
    justify-content: center;
    margin-bottom: var(--dw-sp-5);
}
.dueseweb-modern .dw-auth-otp-digit {
    width: clamp(3rem, 10vw, 4rem);
    height: clamp(3.5rem, 12vw, 5rem);
    font-family: var(--dw-font-sans);
    font-size: clamp(1.8rem, 5vw, 2.5rem);
    font-weight: 600;
    text-align: center;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.45);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 2px solid rgba(255, 220, 184, 0.20);
    border-radius: var(--dw-radius-lg);
    outline: none;
    transition: border-color var(--dw-dur-fast) var(--dw-ease),
                background var(--dw-dur-fast) var(--dw-ease);
    -moz-appearance: textfield;
}
.dueseweb-modern .dw-auth-otp-digit::-webkit-inner-spin-button,
.dueseweb-modern .dw-auth-otp-digit::-webkit-outer-spin-button {
    display: none;
}
.dueseweb-modern .dw-auth-otp-digit:focus {
    border-color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.55);
}
.dueseweb-modern .dw-auth-resend,
.dueseweb-modern .dw-auth-back {
    display: inline-block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    margin-top: var(--dw-sp-4);
    text-decoration: underline;
    text-underline-offset: 4px;
    text-shadow: 0 1px 6px rgba(3, 19, 33, 0.5);
}
.dueseweb-modern .dw-auth-contact {
    display: flex;
    gap: var(--dw-sp-4);
    justify-content: center;
    margin: var(--dw-sp-5) 0;
}
.dueseweb-modern .dw-auth-contact-btn {
    flex: 1;
    text-align: center;
    font-size: clamp(1rem, 2.5vw, 1.2rem) !important;
    padding: var(--dw-sp-3) var(--dw-sp-4) !important;
}
/* Floating avatar pill — upper-left, visible on all pages when logged in */
.dueseweb-modern .dw-auth-avatar {
    position: fixed;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.55);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 220, 184, 0.15);
    border-radius: 999px;
    padding: 0.35rem 0.9rem 0.35rem 0.5rem;
    text-decoration: none;
    text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
    transition: background var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-auth-avatar:hover {
    background: rgba(3, 19, 33, 0.75);
    border-color: rgba(255, 220, 184, 0.30);
}
.dueseweb-modern .dw-auth-avatar-icon {
    font-size: 1.2em;
    line-height: 1;
}
.dueseweb-modern .dw-auth-avatar-name {
    color: var(--dw-ink);
}
.dueseweb-modern .dw-auth-avatar-wrap {
    position: fixed;
    top: 6px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
    display: inline-flex;
    align-items: center;
    gap: 2px;
}
.dueseweb-modern .dw-auth-avatar-wrap .dw-auth-avatar {
    position: static;
    transform: none;
}
.dueseweb-modern .dw-auth-avatar-logout {
    font-size: 0.75rem !important;
    padding: 0.35rem 0.55rem !important;
    opacity: 0.7;
    border-left: none !important;
    border-radius: 0 999px 999px 0 !important;
}
.dueseweb-modern .dw-auth-avatar-wrap .dw-auth-avatar:first-child {
    border-radius: 999px 0 0 999px !important;
    padding-right: 0.5rem !important;
}
.dueseweb-modern .dw-auth-avatar-logout:hover {
    opacity: 1;
    background: rgba(255, 107, 107, 0.3);
}

/* ---- Auth mobile overrides ---- */
@media (max-width: 767px) {
    .dueseweb-modern .dw-auth {
        min-height: 100vh;
        min-height: 100dvh;
        padding: 80px var(--dw-sp-4) var(--dw-sp-5);
        align-items: flex-start;
        padding-top: 15vh;
    }
    .dueseweb-modern .dw-auth-card {
        max-width: 100%;
    }
    .dueseweb-modern .dw-auth-title {
        font-size: 2.2rem !important;
        margin-bottom: var(--dw-sp-2) !important;
    }
    .dueseweb-modern .dw-auth-sub {
        font-size: 1rem;
        margin-bottom: var(--dw-sp-4);
    }
    .dueseweb-modern .dw-auth-input {
        font-size: 1.2rem;
        padding: var(--dw-sp-4);
        border-radius: var(--dw-radius-md);
    }
    .dueseweb-modern .dw-auth-btn {
        font-size: 1.2rem !important;
        padding: var(--dw-sp-4) !important;
        border-radius: var(--dw-radius-md) !important;
    }
    .dueseweb-modern .dw-auth-otp-wrap {
        gap: 0.4rem;
    }
    .dueseweb-modern .dw-auth-otp-digit {
        width: 2.8rem;
        height: 3.5rem;
        font-size: 1.6rem;
        border-radius: var(--dw-radius-md);
    }
    .dueseweb-modern .dw-auth-contact {
        flex-direction: column;
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-auth-resend,
    .dueseweb-modern .dw-auth-back {
        display: block;
        text-align: center;
        margin-top: var(--dw-sp-4);
        font-size: 1rem;
    }
}

/* ===== 18b. Reservation page — wide shell (wizard in DOM only) =====
 * :has(#dw-reservation-wizard) avoids fragile page IDs across DB imports.
 * Mirrors map/auth breakout: full-width chain, hide theme sidebar. */
body.dueseweb-modern:has(#dw-reservation-wizard) #main,
body.dueseweb-modern:has(#dw-reservation-wizard) #forbottom,
body.dueseweb-modern:has(#dw-reservation-wizard) #container,
body.dueseweb-modern:has(#dw-reservation-wizard) #content {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
    float: none !important;
}
body.dueseweb-modern:has(#dw-reservation-wizard) #container {
    display: block !important;
}
body.dueseweb-modern:has(#dw-reservation-wizard) .entry-content {
    width: 100% !important;
    max-width: min(1600px, 100%) !important;
    margin-left: auto !important;
    margin-right: auto !important;
    padding: var(--dw-sp-6) clamp(1rem, 3vw, 2.5rem) !important;
    float: none !important;
}
body.dueseweb-modern:has(#dw-reservation-wizard) .post {
    max-width: 100% !important;
}
body.dueseweb-modern:has(#dw-reservation-wizard) #sidebar {
    display: none !important;
}

/* ===== 19. Reservation wizard ===================================*/
/* Standalone 11-screen conversational wizard for the reservation
 * form. Replaces CF7 entirely. Optimized for 65+ mobile users.
 * Spec: docs/superpowers/specs/2026-04-12-dueseweb-newprod-reservation-wizard-design.md */

/* Wizard container — full-page on mobile, centered card on desktop */
.dueseweb-modern .dw-res-wizard {
    min-height: 80vh;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    padding: 8vh var(--dw-sp-4) var(--dw-sp-7);
}

/* Glass card per screen — compact, minimal whitespace */
.dueseweb-modern .dw-res-card {
    margin: 0; /* <form> UA stylesheet can add block margins */
    width: 100%;
    max-width: 640px;
    padding: var(--dw-sp-5) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.55);
    backdrop-filter: saturate(1.15) blur(14px);
    -webkit-backdrop-filter: saturate(1.15) blur(14px);
    border: 1px solid rgba(255, 220, 184, 0.14);
    border-radius: var(--dw-radius-lg);
    box-shadow: var(--dw-shadow-lg);
    color: var(--dw-ink);
}

/* Top bar — help link + version */
.dueseweb-modern .dw-res-topbar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 0 var(--dw-sp-2) var(--dw-sp-2);
}
.dueseweb-modern .dw-res-help {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    text-decoration: none;
    background: rgba(3, 19, 33, 0.40);
    border: 1px solid rgba(255, 220, 184, 0.12);
    border-radius: 999px;
    padding: 0.25rem 0.7rem;
    transition: background var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-res-help:hover {
    background: rgba(3, 19, 33, 0.60);
    border-color: rgba(255, 220, 184, 0.25);
    color: var(--dw-ink);
}
.dueseweb-modern .dw-res-version {
    font-family: var(--dw-font-sans);
    font-size: 0.6rem;
    color: rgba(255, 220, 184, 0.3);
}

/* Confirmation info panel (Kasse/Zentrum address details) */
.dueseweb-modern .dw-res-confirm-box {
    background: rgba(46, 204, 113, 0.08);
    border: 1px solid rgba(46, 204, 113, 0.25);
    border-radius: var(--dw-radius-md);
    padding: var(--dw-sp-3) var(--dw-sp-4);
    margin: var(--dw-sp-2) 0 var(--dw-sp-3);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    line-height: 1.6;
}
.dueseweb-modern .dw-res-confirm-box p {
    margin: 0;
}
.dueseweb-modern .dw-res-confirm-box p:first-child {
    color: var(--dw-ink);
    font-weight: 600;
    font-size: var(--dw-fs-sm);
}
/* Reassurance headline — the first line when it starts with ✓ is a
   promise to the patient (e.g. GKV: "Abkommen vorhanden — wir
   klären die Kostenübernahme direkt"). Bump size + green so the
   tone lands. */
.dueseweb-modern .dw-res-confirm-box p.dw-res-confirm-reassure {
    color: rgba(46, 204, 113, 1);
    font-weight: 700;
    font-size: var(--dw-fs-md, 1rem);
    margin-bottom: 4px;
    line-height: 1.45;
}

/* Occupancy-warning modal (T3.3) — shown when the patient picks a
   currently-full/high destination. Offers a one-click swap to the
   nearest alternative. */
.dw-res-occ-warn-overlay {
    position: fixed; inset: 0;
    z-index: 9500;
    background: rgba(3, 19, 33, 0.82);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: dwOccFade 200ms ease-out;
}
@keyframes dwOccFade { from { opacity: 0; } to { opacity: 1; } }
.dw-res-occ-warn {
    max-width: 480px;
    width: 100%;
    background: #fbf7f2;
    color: #1a1a1a;
    border-radius: 14px;
    padding: 24px 26px 22px;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.35);
    border-top: 4px solid #c0392b;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, sans-serif;
}
.dw-res-occ-warn-title {
    margin: 0 0 8px;
    font-family: Georgia, serif;
    font-size: 20px;
    color: #061a2c;
    line-height: 1.3;
}
.dw-res-occ-warn-sub {
    margin: 0 0 18px;
    font-size: 14.5px;
    line-height: 1.55;
    color: #3a4a5a;
}
.dw-res-occ-warn-btns {
    display: flex;
    flex-direction: column;
    gap: 10px;
}
.dw-res-occ-warn-btn {
    padding: 11px 16px;
    font-size: 14px;
    font-weight: 600;
    border-radius: 999px;
    border: 1px solid transparent;
    cursor: pointer;
    transition: transform 120ms ease, box-shadow 120ms ease;
    font-family: inherit;
}
.dw-res-occ-warn-btn:hover {
    transform: translateY(-1px);
    box-shadow: 0 3px 10px rgba(0, 0, 0, 0.15);
}
.dw-res-occ-warn-btn-primary {
    background: #e8702a;
    color: #fff;
    border-color: #e8702a;
}
.dw-res-occ-warn-btn-secondary {
    background: #fff;
    color: #3a4a5a;
    border-color: #d8e0ee;
}
@media (max-width: 560px) {
    .dw-res-occ-warn { padding: 20px 18px 18px; border-radius: 12px; }
    .dw-res-occ-warn-title { font-size: 17px; }
    .dw-res-occ-warn-sub { font-size: 13.5px; }
}

/* Quick-pick destination pills */
.dueseweb-modern .dw-res-dest-pills {
    display: flex;
    flex-wrap: wrap;
    gap: var(--dw-sp-2);
    margin: var(--dw-sp-3) 0;
}
.dueseweb-modern .dw-res-dest-pill {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.40);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 220, 184, 0.15);
    border-radius: 999px;
    padding: 0.4rem 1rem;
    cursor: pointer;
    transition: background var(--dw-dur-fast) var(--dw-ease),
                border-color var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-res-dest-pill:hover {
    background: rgba(3, 19, 33, 0.65);
    border-color: var(--dw-ink);
}
.dueseweb-modern .dw-res-pill-active {
    background: rgba(196, 120, 67, 0.35);
    border-color: var(--dw-accent);
    color: var(--dw-ink);
}

/* Progress bar — sticky so it's always visible while scrolling */
.dueseweb-modern .dw-res-progress {
    position: sticky;
    top: 0;
    z-index: 10;
    width: 100%;
    max-width: 640px;
    margin-bottom: var(--dw-sp-4);
    padding: var(--dw-sp-3) 0;
    background: rgba(6, 26, 44, 0.85);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.dueseweb-modern .dw-res-progress-track {
    height: 6px;
    background: rgba(255, 220, 184, 0.15);
    border-radius: 3px;
    overflow: hidden;
}
.dueseweb-modern .dw-res-progress-fill {
    height: 100%;
    background: var(--dw-ink);
    border-radius: 3px;
    transition: width 300ms ease-out;
}
.dueseweb-modern .dw-res-progress-label {
    display: block;
    text-align: center;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    margin-top: var(--dw-sp-2);
    letter-spacing: 0.03em;
}

/* Question headline — tight margin to reduce whitespace */
.dueseweb-modern .dw-res-question {
    font-family: var(--dw-font-serif);
    font-size: clamp(1.3rem, 3.5vw, 1.8rem);
    font-weight: 400;
    line-height: 1.15;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-4);
    letter-spacing: -0.01em;
}

/* Form fields */
.dueseweb-modern .dw-res-field {
    margin-bottom: var(--dw-sp-5);
}
.dueseweb-modern .dw-res-label {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 700;
    color: var(--dw-ink);
    margin-bottom: var(--dw-sp-2);
}
.dueseweb-modern .dw-res-input,
.dueseweb-modern .dw-res-textarea,
.dueseweb-modern .dw-res-select {
    width: 100%;
    min-height: 60px;
    padding: var(--dw-sp-4) var(--dw-sp-4);
    font-family: var(--dw-font-sans);
    font-size: 18px;
    line-height: 1.4;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.62);
    border: 2px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-md);
    transition: border-color 200ms ease, box-shadow 200ms ease;
}
.dueseweb-modern .dw-res-input:focus,
.dueseweb-modern .dw-res-textarea:focus {
    outline: none;
    border-color: var(--dw-ink);
    box-shadow: 0 0 0 3px rgba(255, 220, 184, 0.2);
}
.dueseweb-modern .dw-res-input::placeholder,
.dueseweb-modern .dw-res-textarea::placeholder {
    color: rgba(255, 220, 184, 0.35);
}
.dueseweb-modern .dw-res-textarea {
    min-height: 120px;
    resize: vertical;
}
.dueseweb-modern .dw-res-helper {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    margin-top: var(--dw-sp-1);
}

/* Validation errors */
.dueseweb-modern .dw-res-input-error {
    border-color: #ef4444 !important;
    box-shadow: 0 0 0 2px rgba(239, 68, 68, 0.25) !important;
}
.dueseweb-modern .dw-res-error-msg {
    display: block;
    font-size: var(--dw-fs-xs);
    color: #ef4444;
    margin-top: var(--dw-sp-1);
}
/* Shake animation for invalid field */
@keyframes dw-res-shake {
    0%, 100% { transform: translateX(0); }
    20%, 60% { transform: translateX(-6px); }
    40%, 80% { transform: translateX(6px); }
}
.dueseweb-modern .dw-res-shake {
    animation: dw-res-shake 400ms ease;
}

/* Email valid checkmark */
.dueseweb-modern .dw-res-valid-mark {
    color: #22c55e;
    font-size: 1.2em;
    margin-left: var(--dw-sp-2);
}

/* Autocomplete destination cards */
.dueseweb-modern .dw-res-results {
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-3);
    margin-top: var(--dw-sp-4);
    max-height: 50vh;
    overflow-y: auto;
}
.dueseweb-modern .dw-res-result-card {
    display: flex;
    align-items: center;
    gap: var(--dw-sp-3);
    padding: var(--dw-sp-4);
    background: rgba(255, 220, 184, 0.06);
    border: 1px solid rgba(255, 220, 184, 0.15);
    border-radius: var(--dw-radius-md);
    cursor: pointer;
    transition: background 200ms ease, border-color 200ms ease;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    min-height: 56px;
}
.dueseweb-modern .dw-res-result-card:hover,
.dueseweb-modern .dw-res-result-card:focus-visible {
    background: rgba(255, 220, 184, 0.14);
    border-color: var(--dw-ink);
    outline: none;
}
.dueseweb-modern .dw-res-result-flag {
    font-size: 1.4em;
    flex-shrink: 0;
}
.dueseweb-modern .dw-res-result-name {
    font-weight: 600;
}
.dueseweb-modern .dw-res-result-sub {
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
}
@media (min-width: 760px) {
    .dueseweb-modern .dw-res-results {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }
}
/* Reiseziel step, elderly-first affordances (2026-10-20). */
.dueseweb-modern .dw-res-result-cta {
    margin-left: auto;
    flex-shrink: 0;
    font-weight: 700;
    white-space: nowrap;
    color: var(--dw-ink);
}
.dueseweb-modern .dw-res-didyoumean,
.dueseweb-modern .dw-res-noresult {
    grid-column: 1 / -1;
    margin: 0;
    font-size: var(--dw-fs-base);
    font-weight: 600;
    color: var(--dw-ink);
}
.dueseweb-modern .dw-res-noresult-hint {
    grid-column: 1 / -1;
    margin: 0;
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
}
.dueseweb-modern .dw-res-wish-btn,
.dueseweb-modern .dw-res-recent-btn,
.dueseweb-modern .dw-res-preset-btn {
    grid-column: 1 / -1;
}
.dueseweb-modern .dw-res-preset,
.dueseweb-modern .dw-res-recent {
    padding: var(--dw-sp-4);
    margin-bottom: var(--dw-sp-5);
    background: rgba(255, 220, 184, 0.08);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: var(--dw-radius-md);
}
.dueseweb-modern .dw-res-preset-text,
.dueseweb-modern .dw-res-recent-text {
    margin: 0 0 var(--dw-sp-2);
    font-size: var(--dw-fs-lg);
    font-weight: 600;
    color: var(--dw-ink);
}
/* Reisepartner-Zentrum refused on the destination step (2026-11-04). */
.dueseweb-modern .dw-res-travel-card {
    padding: var(--dw-sp-4);
    margin-bottom: var(--dw-sp-4);
    background: rgba(255, 220, 184, 0.08);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: var(--dw-radius-md);
    color: var(--dw-ink);
}
.dueseweb-modern .dw-res-travel-text {
    margin: 0 0 var(--dw-sp-3);
    font-size: var(--dw-fs-lg);
    font-weight: 600;
}
.dueseweb-modern .dw-res-travel-card .dw-res-travel-near {
    margin: 0 0 var(--dw-sp-3);
    font-size: var(--dw-fs-base);
    line-height: 1.5;
}
.dueseweb-modern .dw-res-travel-link {
    display: inline-block;
    min-height: 44px;
    padding: 10px 0;
    margin-right: var(--dw-sp-4);
}
.dueseweb-modern .dw-res-recent-or {
    margin: var(--dw-sp-3) 0 0;
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
}
.dueseweb-modern .dw-res-link-btn {
    display: block;
    margin-top: var(--dw-sp-3);
    min-height: 44px;
    padding: var(--dw-sp-2) 0;
    background: none;
    border: none;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
.dueseweb-modern .dw-res-link-btn:hover,
.dueseweb-modern .dw-res-link-btn:focus-visible {
    text-decoration-thickness: 2px;
    outline: none;
}

/* Navigation buttons */
.dueseweb-modern .dw-res-next {
    display: block;
    width: 100%;
    min-height: 64px;
    padding: var(--dw-sp-4) var(--dw-sp-6);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-lg);
    font-weight: 700;
    color: #fff;
    background: var(--dw-terracotta-cta, #bf501c); /* primary booking CTA — use AA token, not the floor-riding --dw-terracotta */
    border: none;
    border-radius: var(--dw-radius-md);
    cursor: pointer;
    margin-top: var(--dw-sp-4);
    transition: background 200ms ease, transform 200ms ease;
}
.dueseweb-modern .dw-res-next:hover {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    transform: translateY(-1px);
}
.dueseweb-modern .dw-res-next:disabled {
    opacity: 0.6;
    cursor: not-allowed;
    transform: none;
}
.dueseweb-modern .dw-res-back {
    display: block;
    width: 100%;
    min-height: 48px;
    padding: var(--dw-sp-3);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    background: transparent;
    border: none;
    cursor: pointer;
    margin-top: var(--dw-sp-2);
    transition: color 200ms ease;
}
.dueseweb-modern .dw-res-back:hover {
    color: var(--dw-ink);
}

/* Submit button — green */
.dueseweb-modern .dw-res-submit {
    display: block;
    width: 100%;
    min-height: 64px;
    padding: var(--dw-sp-4) var(--dw-sp-6);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-lg);
    font-weight: 700;
    color: #fff;
    background: #16a34a;
    border: none;
    border-radius: var(--dw-radius-md);
    cursor: pointer;
    margin-top: var(--dw-sp-5);
    transition: background 200ms ease;
}
.dueseweb-modern .dw-res-submit:hover {
    background: #15803d;
}
.dueseweb-modern .dw-res-submit:disabled {
    opacity: 0.6;
    cursor: not-allowed;
}

/* Checkboxes */
.dueseweb-modern .dw-res-checkbox-row {
    display: flex;
    align-items: flex-start;
    gap: var(--dw-sp-3);
    margin: var(--dw-sp-4) 0;
    font-size: var(--dw-fs-sm);
    line-height: 1.4;
    color: var(--dw-ink);
}
.dueseweb-modern .dw-res-checkbox {
    width: 28px !important;
    height: 28px !important;
    min-width: 28px;
    flex-shrink: 0;
    accent-color: var(--dw-terracotta);
    cursor: pointer;
    margin-top: 2px;
}

/* Summary table */
.dueseweb-modern .dw-res-summary {
    margin-bottom: var(--dw-sp-6);
    padding: var(--dw-sp-4);
    background: rgba(255, 220, 184, 0.05);
    border: 1px solid rgba(255, 220, 184, 0.12);
    border-radius: var(--dw-radius-md);
}
.dueseweb-modern .dw-res-summary-row {
    display: flex;
    justify-content: space-between;
    gap: var(--dw-sp-3);
    padding: var(--dw-sp-2) 0;
    border-bottom: 1px solid rgba(255, 220, 184, 0.06);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .dw-res-summary-row:last-child {
    border-bottom: none;
}
.dueseweb-modern .dw-res-summary-label {
    color: var(--dw-muted);
    flex-shrink: 0;
}
.dueseweb-modern .dw-res-summary-value {
    color: var(--dw-ink);
    font-weight: 600;
    text-align: right;
}

/* Success screen */
.dueseweb-modern .dw-res-success {
    text-align: center;
    padding: var(--dw-sp-9) var(--dw-sp-5);
}
.dueseweb-modern .dw-res-success-check {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 80px;
    height: 80px;
    border-radius: 50%;
    background: #16a34a;
    color: #fff;
    font-size: 2.5rem;
    margin-bottom: var(--dw-sp-6);
}
.dueseweb-modern .dw-res-success-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-2xl);
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-3);
}
.dueseweb-modern .dw-res-success-sub {
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-4);
}
.dueseweb-modern .dw-res-success-email {
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    margin: 0 0 var(--dw-sp-6);
}
.dueseweb-modern .dw-res-success-home {
    color: var(--dw-ink) !important;
    text-decoration: underline;
}
/* „Anfrage drucken“ (wizard success, spec 2026-11-05 § 7.6). The review data
   prints only; reservation-wizard.js marks <html>.dw-res-printing and the card's
   ancestors .dw-res-print-root (the angehoerige.css idiom). */
.dueseweb-modern .dw-res-print-btn {
    display: block;
    margin: var(--dw-sp-5) auto 0;
}
.dw-res-print-summary { display: none; }
@media print {
    html.dw-res-printing body > :not(.dw-res-print-root):not(#dw-res-x):not(#dw-res-y),
    html.dw-res-printing .dw-res-print-root > :not(.dw-res-print-root):not(.dw-res-success):not(#dw-res-x):not(#dw-res-y),
    html.dw-res-printing .dw-res-success :is(.dw-res-print-btn, .dw-res-review-prompt, .dw-res-success-home, .dw-res-review-actions, .dw-res-success-check) { display: none !important; }
    html.dw-res-printing .dw-res-print-root { display: block !important; margin: 0 !important; padding: 0 !important; border: 0 !important; background: #fff !important; box-shadow: none !important; position: static !important; min-height: 0 !important; max-width: none !important; }
    html.dw-res-printing body, html.dw-res-printing .dw-res-success { background: #fff !important; box-shadow: none !important; backdrop-filter: none !important; }
    html.dw-res-printing .dw-res-success { text-align: left !important; padding: 0 !important; border: 0 !important; }
    html.dw-res-printing .dw-res-success :is(h2, h3, p, span, div, a, strong) { color: #000 !important; -webkit-text-fill-color: #000 !important; text-shadow: none !important; background: none !important; }
    html.dw-res-printing .dw-res-print-summary { display: block !important; margin-top: 12pt; }
    html.dw-res-printing .dw-res-print-summary .dw-res-summary-row { display: flex; gap: 12pt; border-bottom: 1px solid #999; padding: 4pt 0; break-inside: avoid; }
    html.dw-res-printing .dw-res-print-summary .dw-res-summary-label { flex: 0 0 38%; font-weight: 700; }
}

/* Review prompt on success screen */
.dueseweb-modern .dw-res-review-prompt {
    margin-top: var(--dw-sp-5);
    padding: var(--dw-sp-4);
    background: rgba(251, 191, 36, 0.06);
    border: 1px solid rgba(251, 191, 36, 0.15);
    border-radius: var(--dw-radius-md);
    text-align: center;
}
.dueseweb-modern .dw-res-review-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-2);
}
.dueseweb-modern .dw-res-review-text {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    margin: 0 0 var(--dw-sp-3);
}
.dueseweb-modern .dw-res-review-btn {
    display: inline-block;
    padding: var(--dw-sp-2) var(--dw-sp-5) !important;
    font-size: var(--dw-fs-sm) !important;
    background: transparent !important;
    border: 1px solid rgba(251, 191, 36, 0.3) !important;
    color: var(--dw-eucalyptus) !important;
}
.dueseweb-modern .dw-res-review-btn:hover {
    background: rgba(251, 191, 36, 0.1) !important;
    border-color: var(--dw-eucalyptus) !important;
}

/* Error / retry */
.dueseweb-modern .dw-res-error-banner {
    padding: var(--dw-sp-4);
    background: rgba(239, 68, 68, 0.15);
    border: 1px solid rgba(239, 68, 68, 0.3);
    border-radius: var(--dw-radius-md);
    text-align: center;
    margin-top: var(--dw-sp-4);
    font-size: var(--dw-fs-sm);
    color: #fca5a5;
}
.dueseweb-modern .dw-res-error-banner:focus { outline: none; }
.dueseweb-modern .dw-res-error-banner-text { margin: 0; }
.dueseweb-modern .dw-res-error-banner .dw-res-error-action {
    display: block;
    width: auto;
    margin-top: var(--dw-sp-3);
    text-align: center;
    text-decoration: none;
    min-height: 48px;
}

/* Resume dialog */
.dueseweb-modern .dw-res-resume {
    text-align: center;
    padding: var(--dw-sp-6);
}
.dueseweb-modern .dw-res-resume-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-5);
}
.dueseweb-modern .dw-res-resume-btns {
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-3);
}

/* Narrow viewports: no sidebar in DOM; hook for future CSS if needed */
.dueseweb-modern .dw-res-wizard.dw-res-wizard--mobile {
    flex-direction: column;
    align-items: center;
}

/* Desktop — two-column layout: sidebar + wizard (JS: min-width 960px) */
@media (min-width: 960px) {
    .dueseweb-modern .dw-res-wizard.dw-res-wizard--desktop {
        min-height: auto;
        padding: 2dvh var(--dw-sp-4) var(--dw-sp-5);
        justify-content: flex-start;
        flex-direction: row;
        align-items: flex-start;
        gap: var(--dw-sp-4);
        overflow: visible;
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
    }
    /* Sidebar — readable width; grows with clamp; scrolls inside only if taller than viewport */
    .dueseweb-modern .dw-res-sidebar {
        flex: 0 0 clamp(240px, 20vw, 300px);
        width: clamp(240px, 20vw, 300px);
        max-width: 100%;
        position: sticky;
        top: var(--dw-sp-3);
        align-self: flex-start;
        max-height: calc(100dvh - 88px);
        overflow-y: auto;
        -webkit-overflow-scrolling: touch;
        background: rgba(3, 19, 33, 0.45);
        backdrop-filter: saturate(1.1) blur(10px);
        -webkit-backdrop-filter: saturate(1.1) blur(10px);
        border: 1px solid rgba(255, 220, 184, 0.10);
        border-radius: var(--dw-radius-lg);
        padding: var(--dw-sp-2) var(--dw-sp-3);
    }
    .dueseweb-modern .dw-res-sidebar-title {
        font-family: var(--dw-font-serif);
        font-size: var(--dw-fs-base);
        color: var(--dw-ink);
        margin: 0 0 var(--dw-sp-2);
        padding-bottom: var(--dw-sp-1);
        border-bottom: 1px solid rgba(255, 220, 184, 0.10);
    }
    .dueseweb-modern .dw-res-sidebar-row {
        display: flex;
        justify-content: space-between;
        align-items: flex-start;
        gap: var(--dw-sp-2);
        padding: var(--dw-sp-1) 0;
        font-family: var(--dw-font-sans);
        font-size: 0.8125rem;
        line-height: 1.5;
        border-bottom: 1px solid rgba(255, 220, 184, 0.05);
    }
    .dueseweb-modern .dw-res-sidebar-label {
        color: var(--dw-muted);
        flex-shrink: 0;
    }
    .dueseweb-modern .dw-res-sidebar-value {
        flex: 1;
        min-width: 0;
        color: var(--dw-ink);
        text-align: right;
        overflow-wrap: anywhere;
        word-break: break-word;
    }
    .dueseweb-modern .dw-res-sidebar-empty {
        color: rgba(255, 220, 184, 0.25);
    }
    .dueseweb-modern .dw-res-sidebar-active {
        color: var(--dw-terracotta);
        font-weight: 600;
    }
    /* Sidebar visual cards — single compact image row (no map tiles) */
    .dueseweb-modern .dw-res-sidebar-card {
        background: rgba(255, 220, 184, 0.04);
        border: 1px solid rgba(255, 220, 184, 0.08);
        border-radius: var(--dw-radius-md);
        overflow: hidden;
        margin-bottom: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-res-sidebar-img {
        width: 100%;
        height: 48px;
        object-fit: cover;
        display: block;
        border-bottom: 1px solid rgba(255, 220, 184, 0.06);
    }
    .dueseweb-modern .dw-res-sidebar-brand-wrap {
        display: block;
        line-height: 0;
        text-decoration: none;
        color: inherit;
    }
    .dueseweb-modern .dw-res-sidebar-brand-wrap:focus-visible {
        outline: 2px solid var(--dw-terracotta);
        outline-offset: 2px;
    }
    .dueseweb-modern .dw-res-sidebar-brand.dw-res-sidebar-dest-visual,
    .dueseweb-modern .dw-res-sidebar-brand.dw-res-sidebar-heim-visual,
    .dueseweb-modern .dw-res-sidebar-brand.dw-res-sidebar-kasse-visual {
        object-fit: cover;
    }
    .dueseweb-modern .dw-res-sidebar-kasse-visual {
        object-fit: contain;
        background: rgba(255, 255, 255, 0.06);
        padding: 4px;
        box-sizing: border-box;
    }
    .dueseweb-modern .dw-res-sidebar-card.dw-res-sidebar-card--img-fail .dw-res-sidebar-img {
        display: none !important;
    }
    .dueseweb-modern .dw-res-sidebar-card.dw-res-sidebar-card--img-fail::before {
        content: '';
        display: block;
        height: 48px;
        border-bottom: 1px solid rgba(255, 220, 184, 0.06);
        background: linear-gradient(165deg, rgba(3, 19, 33, 0.96), rgba(28, 52, 78, 0.42));
    }
    .dueseweb-modern .dw-res-sidebar-card-info {
        padding: var(--dw-sp-1) var(--dw-sp-2);
    }
    .dueseweb-modern .dw-res-sidebar-card-info strong {
        font-family: var(--dw-font-serif);
        font-size: var(--dw-fs-xs);
        font-weight: 400;
        color: var(--dw-ink);
        display: block;
        min-width: 0;
        overflow-wrap: anywhere;
        word-break: break-word;
    }
    .dueseweb-modern .dw-res-sidebar-detail {
        display: block;
        font-family: var(--dw-font-sans);
        font-size: 0.72rem;
        color: var(--dw-muted);
        margin-top: 2px;
        line-height: 1.35;
    }
    .dueseweb-modern .dw-res-sidebar-badge {
        display: inline-block;
        font-family: var(--dw-font-sans);
        font-size: 0.7rem;
        color: var(--dw-eucalyptus);
        background: rgba(251, 191, 36, 0.08);
        border: 1px solid rgba(251, 191, 36, 0.15);
        border-radius: 999px;
        padding: 2px 10px;
        margin: var(--dw-sp-2) 0;
    }
    /* Sidebar progress bar */
    .dueseweb-modern .dw-res-sidebar-progress {
        margin-top: var(--dw-sp-4);
        padding: var(--dw-sp-3) 0 var(--dw-sp-4);
        border-top: 1px solid rgba(255, 220, 184, 0.10);
    }
    .dueseweb-modern .dw-res-sidebar-progress-bar {
        height: 4px;
        background: rgba(255, 220, 184, 0.10);
        border-radius: 2px;
        overflow: hidden;
        margin-bottom: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-res-sidebar-progress-fill {
        height: 100%;
        background: var(--dw-terracotta);
        border-radius: 2px;
        transition: width 0.5s var(--dw-ease);
    }
    .dueseweb-modern .dw-res-sidebar-progress-label {
        font-family: var(--dw-font-sans);
        font-size: 0.72rem;
        color: var(--dw-muted);
        display: block;
        margin-top: var(--dw-sp-1);
        padding-bottom: 2px;
        line-height: 1.4;
    }
    /* Main column — grow to use remaining viewport width */
    .dueseweb-modern .dw-res-main {
        flex: 1 1 0;
        min-width: 0;
        width: 100%;
        max-width: none;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .dueseweb-modern .dw-res-main .dw-res-topbar,
    .dueseweb-modern .dw-res-main .dw-res-progress,
    .dueseweb-modern .dw-res-main .dw-res-card {
        width: 100%;
        max-width: min(1040px, 100%);
        box-sizing: border-box;
    }
    .dueseweb-modern .dw-res-main .dw-res-card {
        padding: var(--dw-sp-4) var(--dw-sp-5) var(--dw-sp-3);
    }
    /* Use the full viewport height so the card doesn't float at the top
       with a half-empty background below. Sidebar matches via sticky +
       max-height: calc(100dvh - 88px). */
    .dueseweb-modern .dw-res-wizard.dw-res-wizard--desktop {
        min-height: calc(100dvh - 64px);
    }
    .dueseweb-modern .dw-res-question {
        font-size: 1.4rem;
        margin-bottom: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-res-field {
        margin-bottom: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-res-input,
    .dueseweb-modern .dw-res-textarea,
    .dueseweb-modern .dw-res-select {
        min-height: 48px;
        font-size: 16px;
        padding: var(--dw-sp-3) var(--dw-sp-3);
    }
    .dueseweb-modern .dw-res-textarea {
        min-height: 80px;
    }
    .dueseweb-modern .dw-res-next {
        min-height: 52px;
        font-size: var(--dw-fs-base);
        margin-top: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-res-submit {
        min-height: 52px;
        font-size: var(--dw-fs-base);
    }
    .dueseweb-modern .dw-res-progress {
        padding: var(--dw-sp-2) var(--dw-sp-4);
    }
    .dueseweb-modern .dw-res-topbar {
        padding-bottom: var(--dw-sp-1);
    }
    .dueseweb-modern .dw-res-checkbox-row {
        gap: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-res-checkbox {
        width: 22px;
        height: 22px;
    }

    @media (min-width: 1280px) {
        .dueseweb-modern .dw-res-main .dw-res-topbar,
        .dueseweb-modern .dw-res-main .dw-res-progress,
        .dueseweb-modern .dw-res-main .dw-res-card {
            max-width: min(960px, 100%);
        }
    }

    /* Medizin step (11): two columns on wide desktop — fields only */
    @media (min-width: 1200px) {
        .dueseweb-modern .dw-res-card:has(#dw-res-infektionen):has(#dw-res-wuensche) {
            display: grid;
            grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
            column-gap: var(--dw-sp-5);
            row-gap: var(--dw-sp-3);
            align-items: start;
        }
        .dueseweb-modern .dw-res-card:has(#dw-res-infektionen):has(#dw-res-wuensche) > .dw-res-question {
            grid-column: 1 / -1;
        }
        .dueseweb-modern .dw-res-card:has(#dw-res-infektionen):has(#dw-res-wuensche) > .dw-res-field {
            margin-bottom: 0;
        }
        .dueseweb-modern .dw-res-card:has(#dw-res-infektionen):has(#dw-res-wuensche) > input[name="website"],
        .dueseweb-modern .dw-res-card:has(#dw-res-infektionen):has(#dw-res-wuensche) > .dw-res-next,
        .dueseweb-modern .dw-res-card:has(#dw-res-infektionen):has(#dw-res-wuensche) > .dw-res-back {
            grid-column: 1 / -1;
        }
    }
}

/* Mobile — full bleed card, fixed bottom button, dvh for real viewport */
@media (max-width: 759px) {
    /* Set by reservation-wizard.js from Visual Viewport API when the software keyboard opens (iOS/Android). */
    .dueseweb-modern #dw-reservation-wizard.dw-res-wizard {
        --dw-vv-keyboard: 0px;
    }
    .dueseweb-modern .dw-res-wizard {
        padding: 36px 0 0 0;
        min-height: 100vh;
        min-height: 100dvh;
    }
    .dueseweb-modern .dw-res-card {
        border-radius: 0;
        border-left: none;
        border-right: none;
        /* Room for fixed primary + home indicator; extra when keyboard avoids via JS */
        padding: var(--dw-sp-4) var(--dw-sp-4) max(5.5rem, calc(5rem + env(safe-area-inset-bottom, 0px)));
    }
    .dueseweb-modern .dw-res-next,
    .dueseweb-modern .dw-res-submit {
        position: fixed;
        /* Above keyboard + iPhone home indicator — --dw-vv-keyboard from visualViewport */
        bottom: calc(env(safe-area-inset-bottom, 0px) + var(--dw-vv-keyboard, 0px));
        left: 0;
        right: 0;
        z-index: 100;
        border-radius: 0;
        margin: 0;
    }
    /* Progress sticky at top on mobile — with dark bg so it
     * doesn't overlap content transparently */
    .dueseweb-modern .dw-res-progress {
        position: fixed;
        top: 32px;
        left: 0;
        right: 0;
        max-width: none;
        padding: var(--dw-sp-2) var(--dw-sp-4);
        background: rgba(3, 19, 33, 0.92);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        z-index: 50;
        border-bottom: 1px solid rgba(255, 220, 184, 0.08);
    }
    .dueseweb-modern .dw-res-input,
    .dueseweb-modern .dw-res-textarea {
        min-height: 56px;
        font-size: 18px;
    }
    /* scrollIntoView / iOS: keep field + Photon list out from under fixed chrome + keyboard */
    .dueseweb-modern .dw-res-wizard--mobile .dw-res-field {
        scroll-margin-top: 3.5rem;
        scroll-margin-bottom: calc(5.5rem + env(safe-area-inset-bottom, 0px));
    }
    .dueseweb-modern .dw-res-wizard--mobile .dw-res-results {
        max-height: min(38vh, 220px);
    }
    .dueseweb-modern .dw-res-progress {
        padding: 0 var(--dw-sp-4);
    }
}
@media (min-width: 760px) {
    .dueseweb-modern .dw-res-input {
        min-height: 64px;
    }
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce) {
    .dueseweb-modern .dw-res-shake {
        animation: none;
    }
}

/* ── Booking completion (21f-): header card, locked fields, landing messages ── */
/* [hidden] attribute trap: .dw-res-wizard sets display:flex + min-height:80vh,
   which beats the UA [hidden] default — the "vollständig" state hides it. */
.dueseweb-modern .dw-res-wizard[hidden] { display: none !important; }
.dueseweb-modern .dw-res-booking-card {
  background: linear-gradient(145deg, rgba(3,19,33,0.85), rgba(3,19,33,0.65));
  border: 1px solid rgba(255,220,184,0.22); border-radius: 12px;
  padding: 16px 18px; margin: 0 16px 16px; color: var(--dw-ink, #ffdcb8);
}
.dueseweb-modern .dw-res-booking-card-title { font-family: var(--dw-font-serif); font-size: 1.25rem; line-height: 1.35; margin: 0 0 8px; }
.dueseweb-modern .dw-res-booking-known summary { cursor: pointer; font-weight: 700; }
.dueseweb-modern .dw-res-booking-known ul { margin: 8px 0 0; padding-left: 18px; }
.dueseweb-modern .dw-res-booking-known li { margin: 2px 0; }
.dueseweb-modern .dw-res-booking-hint { margin: 10px 0 0; font-size: 0.95rem; }
.dueseweb-modern .dw-res-booking-hint a { color: var(--dw-ink, #ffdcb8); text-decoration: underline; }
.dueseweb-modern .dw-res-field-locked input,
.dueseweb-modern .dw-res-field-locked select { opacity: 0.85; }
.dueseweb-modern .dw-res-known-tag {
  display: inline-block; margin-left: 8px; padding: 2px 8px; border-radius: 999px;
  font-size: 0.8rem; background: rgba(255,220,184,0.15); color: var(--dw-ink, #ffdcb8);
}
.dueseweb-modern .dw-bcomp-card {
  background: linear-gradient(145deg, rgba(3,19,33,0.85), rgba(3,19,33,0.65));
  border: 1px solid rgba(255,220,184,0.22); border-radius: 12px;
  padding: 24px 20px; margin: 16px; color: var(--dw-ink, #ffdcb8);
}
.dueseweb-modern .dw-bcomp-title { font-family: var(--dw-font-serif); font-size: 1.5rem !important; margin: 0 0 12px; color: var(--dw-ink, #ffdcb8); }
.dueseweb-modern .dw-bcomp-cta {
  display: inline-block; padding: 12px 20px; border-radius: 10px; font-weight: 700; text-decoration: none;
  background: var(--dw-terracotta-cta, #bf501c); color: #fff;
}
.dueseweb-modern .dw-bcomp-cta:hover,
.dueseweb-modern .dw-bcomp-cta:focus-visible { background: var(--dw-terracotta-cta-hover, #a3431a); color: #fff; }
.dueseweb-modern .dw-bcomp-link { color: var(--dw-ink, #ffdcb8); text-decoration: underline; }
@media (min-width: 960px) {
  .dueseweb-modern .dw-res-booking-card { margin: 0 0 16px; }
  .dueseweb-modern .dw-res-booking-known[open] ul { columns: 2; column-gap: 24px; }
}

/* ===== 16. Floating "?" info drawer =============================*/
/* Replaces the static #footer with a floating glass pill
 * (bottom-left, mirrors the presence widget bottom-right).
 * Click → glass card slides up with Impressum, links, language. */
/* ---- Floating staff presence avatars ---- */
/* Each avatar is independently positioned via JS and drifts
   to a new random spot every 8-15 seconds. */
.dueseweb-modern .dw-team-float {
    position: fixed;
    z-index: 1005;
    /* Start off-screen bottom-center, JS moves them in */
    left: 50vw;
    left: 50dvw;
    top: 110vh;
    top: 110dvh;
    transition: left 7s cubic-bezier(0.25, 0.1, 0.25, 1),
                top 7s cubic-bezier(0.25, 0.1, 0.25, 1);
    text-decoration: none;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 6px;
}
body.dueseweb-modern.dw-nav-open .dw-team-float {
    display: none !important;
}
.dueseweb-modern .dw-team-float:hover {
    z-index: 1010;
}
.dueseweb-modern .dw-team-float:hover .dw-team-avatar {
    transform: scale(1.15);
    border-color: rgba(255, 220, 184, 0.5);
    box-shadow: 0 8px 40px rgba(0, 0, 0, 0.55);
}
.dueseweb-modern .dw-team-float-name {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: var(--dw-ink);
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.6);
    white-space: nowrap;
}
.dueseweb-modern .dw-team-float-status {
    font-family: var(--dw-font-sans);
    font-size: 0.65rem;
    white-space: nowrap;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.5);
}
.dueseweb-modern .dw-team-float-status.dw-team-available {
    color: #22c55e;
}
.dueseweb-modern .dw-team-float-status.dw-team-busy {
    color: #fb923c;
}
.dueseweb-modern .dw-team-float-status.dw-team-closed {
    color: var(--dw-muted);
}
.dueseweb-modern .dw-team-avatar {
    width: 240px;
    height: 240px;
    border-radius: 50%;
    border: 3px solid rgba(255, 220, 184, 0.25);
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.45);
    object-fit: cover;
    display: block;
    transition: transform 300ms ease, border-color 300ms ease, box-shadow 300ms ease;
}
/* Availability ring around avatar */
.dueseweb-modern .dw-team-available .dw-team-avatar {
    border-color: rgba(34, 197, 94, 0.5);
    box-shadow: 0 0 0 3px rgba(34, 197, 94, 0.2), 0 6px 30px rgba(0, 0, 0, 0.45);
}
.dueseweb-modern .dw-team-busy .dw-team-avatar {
    border-color: rgba(251, 146, 60, 0.5);
    box-shadow: 0 0 0 3px rgba(251, 146, 60, 0.2), 0 6px 30px rgba(0, 0, 0, 0.45);
}
.dueseweb-modern .dw-team-closed .dw-team-avatar {
    border-color: rgba(255, 220, 184, 0.15);
    opacity: 0.5;
}
.dueseweb-modern .dw-team-avatar-text {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 240px;
    height: 240px;
    border-radius: 50%;
    background: rgba(255, 220, 184, 0.15);
    border: 3px solid rgba(255, 220, 184, 0.25);
    box-shadow: 0 6px 30px rgba(0, 0, 0, 0.45);
    color: var(--dw-ink);
    font-family: var(--dw-font-sans);
    font-size: 2.5rem;
    font-weight: 600;
}

/* Mobile: smaller floating avatars */
@media (max-width: 767px) {
    .dueseweb-modern .dw-team-avatar {
        width: 56px;
        height: 56px;
        border-width: 2px;
    }
    .dueseweb-modern .dw-team-avatar-text {
        width: 56px;
        height: 56px;
        font-size: 1.2rem;
    }
    .dueseweb-modern .dw-team-float-name {
        font-size: 0.65rem;
    }
}

.dueseweb-modern .dw-info-pill {
    position: fixed;
    bottom: 22px;
    left: 22px;
    z-index: 1005;
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
    font-family: var(--dw-font-serif);
    font-size: 1.4rem;
    font-weight: 700;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.72);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 999px;
    cursor: pointer;
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
    transition: background 200ms ease,
                border-color 200ms ease,
                transform 200ms ease;
}
.dueseweb-modern .dw-info-pill:hover,
.dueseweb-modern .dw-info-pill:focus-visible {
    background: rgba(3, 19, 33, 0.88);
    border-color: var(--dw-ink);
    transform: translateY(-1px);
    outline: none;
}
body.dueseweb-modern.dw-nav-open .dw-info-pill {
    display: none !important;
}
.dueseweb-modern .dw-info-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1004;
    background: rgba(3, 19, 33, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease;
}
.dueseweb-modern .dw-info-wrapper.is-open .dw-info-backdrop {
    opacity: 1;
    pointer-events: auto;
}
.dueseweb-modern .dw-info-card {
    position: fixed;
    left: 22px;
    bottom: 80px;
    z-index: 1006;
    width: min(380px, calc(100vw - 44px));
    max-height: 70vh;
    padding: var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.88);
    backdrop-filter: saturate(1.2) blur(18px);
    -webkit-backdrop-filter: saturate(1.2) blur(18px);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-lg);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
    color: var(--dw-ink);
    overflow-y: auto;
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity 220ms ease, transform 220ms ease;
}
.dueseweb-modern .dw-info-wrapper.is-open .dw-info-card {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}
.dueseweb-modern .dw-info-card-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern .dw-info-card-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-lg);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0;
}
.dueseweb-modern .dw-info-card-close {
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--dw-ink);
    font-size: 1.4rem;
    cursor: pointer;
    transition: background 200ms ease, border-color 200ms ease;
}
.dueseweb-modern .dw-info-card-close:hover,
.dueseweb-modern .dw-info-card-close:focus-visible {
    background: rgba(255, 220, 184, 0.12);
    border-color: var(--dw-ink);
    outline: none;
}
.dueseweb-modern .dw-info-card-body h3 {
    font-family: var(--dw-font-sans) !important;
    font-size: var(--dw-fs-xs) !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.08em !important;
    color: var(--dw-muted) !important;
    margin: var(--dw-sp-4) 0 var(--dw-sp-2) !important;
    padding: 0 !important;
    border: none !important;
    background: none !important;
}
.dueseweb-modern .dw-info-card-body a {
    display: block;
    color: var(--dw-ink) !important;
    text-decoration: none;
    padding: var(--dw-sp-3) var(--dw-sp-3);
    margin: 0 calc(-1 * var(--dw-sp-3));
    border-radius: var(--dw-radius-sm);
    /* Force compositing layer on Safari so backdrop-filter
     * doesn't eat tap events on descendant links. */
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    transition: background 150ms ease;
    min-height: 44px;
    display: flex;
    align-items: center;
}
.dueseweb-modern .dw-info-card-body a:hover,
.dueseweb-modern .dw-info-card-body a:active {
    background: rgba(255, 220, 184, 0.10);
    text-decoration: none;
}
.dueseweb-modern .dw-info-card-body ul {
    list-style: none;
    margin: 0;
    padding: 0;
}
.dueseweb-modern .dw-info-card-body li {
    padding: 0;
    border-bottom: 1px solid rgba(255, 220, 184, 0.06);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .dw-info-card-body li:last-child {
    border-bottom: none;
}
.dueseweb-modern .dw-info-brand {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    margin-bottom: var(--dw-sp-1);
}
.dueseweb-modern .dw-info-tagline {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-sm);
    font-style: italic;
    color: var(--dw-terracotta);
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-info-pill {
        display: none !important;
    }
    .dueseweb-modern .dw-info-card {
        left: 14px;
        bottom: 72px;
        width: calc(100vw - 28px);
        max-height: 80vh;
    }
}

/* ===== 15. Anonymous presence widget ===========================*/
/* Floating pill bottom-right with a click-to-expand glass
 * card listing other visitors. See
 * docs/superpowers/specs/2026-04-12-dueseweb-newprod-presence-design.md
 */
.dueseweb-modern .dw-presence {
    position: fixed;
    bottom: 22px;
    right: 22px;
    z-index: 1005;
    font-family: var(--dw-font-sans);
}
/* Hide when the hamburger drawer is open — the drawer's
 * backdrop takes visual precedence. */
body.dueseweb-modern.dw-nav-open .dw-presence {
    display: none !important;
}

.dueseweb-modern .dw-presence-pill {
    display: inline-flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.55rem 1rem;
    background: rgba(3, 19, 33, 0.72);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 999px;
    color: var(--dw-ink);
    font-size: var(--dw-fs-sm);
    font-weight: 500;
    cursor: pointer;
    backdrop-filter: saturate(1.2) blur(10px);
    -webkit-backdrop-filter: saturate(1.2) blur(10px);
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.35);
    transition: background 200ms ease,
                border-color 200ms ease,
                transform 200ms ease;
}
.dueseweb-modern .dw-presence-pill:hover,
.dueseweb-modern .dw-presence-pill:focus-visible {
    background: rgba(3, 19, 33, 0.88);
    border-color: var(--dw-ink);
    transform: translateY(-1px);
    outline: none;
}
.dueseweb-modern .dw-presence-pill-label {
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    text-transform: uppercase;
    letter-spacing: 0.08em;
}
.dueseweb-modern .dw-presence-count {
    font-weight: 700;
    color: var(--dw-ink);
    min-width: 1.5ch;
    text-align: right;
}

/* Pulsing green dot. */
.dueseweb-modern .dw-presence-dot {
    display: inline-block;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #22c55e;
    box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.25);
    animation: dw-presence-pulse 2s ease-in-out infinite;
}
@keyframes dw-presence-pulse {
    0%, 100% { box-shadow: 0 0 0 2px rgba(34, 197, 94, 0.15); }
    50%      { box-shadow: 0 0 0 6px rgba(34, 197, 94, 0.35); }
}

/* Backdrop + card (hidden by default). */
.dueseweb-modern .dw-presence-backdrop {
    position: fixed;
    inset: 0;
    z-index: 1004;     /* below the card, above the page */
    background: rgba(3, 19, 33, 0.6);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 200ms ease;
}
body.dueseweb-modern.dw-nav-open .dw-presence-backdrop { display: none; }
.dueseweb-modern .dw-presence.dw-presence-open .dw-presence-backdrop {
    opacity: 1;
    pointer-events: auto;
}

.dueseweb-modern .dw-presence-card {
    position: fixed;
    right: 22px;
    bottom: 86px;
    z-index: 1006;
    width: min(360px, calc(100vw - 44px));
    max-height: 70vh;
    padding: var(--dw-sp-5) var(--dw-sp-5) var(--dw-sp-5);
    background: rgba(3, 19, 33, 0.84);
    backdrop-filter: saturate(1.2) blur(18px);
    -webkit-backdrop-filter: saturate(1.2) blur(18px);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-lg);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
    color: var(--dw-ink);
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-3);
    opacity: 0;
    transform: translateY(8px);
    pointer-events: none;
    transition: opacity 220ms ease,
                transform 220ms ease;
    overflow: hidden;
}
.dueseweb-modern .dw-presence.dw-presence-open .dw-presence-card {
    opacity: 1;
    transform: translateY(0);
    pointer-events: auto;
}

/* Full-screen visitor map overlay */
.dw-presence-map-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: #0d1b2a;
    display: none;
}
.dw-presence-map-overlay.is-open {
    display: block;
}
.dw-presence-map-close {
    position: absolute;
    top: var(--dw-sp-3);
    right: var(--dw-sp-3);
    z-index: 10001;
    width: 44px;
    height: 44px;
    font-size: 1.5rem;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.7);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 220, 184, 0.2);
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
}
.dw-presence-map-close:hover {
    background: rgba(3, 19, 33, 0.9);
}
/* Map marker dots — pulsing, color-coded by device */
.dw-presence-map-dot {
    pointer-events: auto !important;
}
.dw-presence-dot-inner {
    display: block;
    width: 12px;
    height: 12px;
    margin: 4px;
    border-radius: 50%;
    border: 2px solid #fff;
    animation: dw-presence-pulse 2s ease-in-out infinite;
}
.dw-dot-hh {
    background: #f4a261;
    box-shadow: 0 0 6px 3px rgba(244, 162, 97, 0.5);
}
.dw-dot-pc {
    background: #2ecc71;
    box-shadow: 0 0 6px 3px rgba(46, 204, 113, 0.5);
}
@keyframes dw-presence-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.4); }
}
.dw-presence-map-popup b {
    display: block;
    font-size: 0.95rem;
}

.dueseweb-modern .dw-presence-card-header {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: var(--dw-sp-3);
    flex-shrink: 0;
}
.dueseweb-modern .dw-presence-card-title {
    display: flex;
    align-items: center;
    gap: 0.45rem;
    margin: 0;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--dw-muted);
}
.dueseweb-modern .dw-presence-card-count {
    color: var(--dw-ink);
    font-size: var(--dw-fs-base);
    font-weight: 700;
}
.dueseweb-modern .dw-presence-card-close {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--dw-ink);
    font-size: 1.4rem;
    line-height: 1;
    cursor: pointer;
    transition: background 200ms ease, border-color 200ms ease;
}
.dueseweb-modern .dw-presence-card-close:hover,
.dueseweb-modern .dw-presence-card-close:focus-visible {
    background: rgba(255, 220, 184, 0.12);
    border-color: var(--dw-ink);
    outline: none;
}
.dueseweb-modern .dw-presence-card-list {
    margin: 0;
    padding: 0;
    list-style: none;
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-2);
    overflow-y: auto;
    flex: 1 1 auto;
    min-height: 0;
}
.dueseweb-modern .dw-presence-card-empty {
    margin: 0;
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    text-align: center;
    padding: var(--dw-sp-4) 0;
}

/* Card footer — "Alle Besucher anzeigen" expand button. */
.dueseweb-modern .dw-presence-card-footer {
    flex-shrink: 0;
    padding-top: var(--dw-sp-2);
    border-top: 1px solid rgba(255, 220, 184, 0.12);
    text-align: center;
}
.dueseweb-modern .dw-presence-card-expand {
    background: none;
    border: none;
    color: var(--dw-muted);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    cursor: pointer;
    padding: var(--dw-sp-2) var(--dw-sp-3);
    border-radius: var(--dw-radius-sm);
    transition: color 200ms ease, background 200ms ease;
}
.dueseweb-modern .dw-presence-card-expand:hover,
.dueseweb-modern .dw-presence-card-expand:focus-visible {
    color: var(--dw-ink);
    background: rgba(255, 220, 184, 0.1);
    outline: none;
}

/* ===== Presence fullscreen modal ============================= */
.dueseweb-modern .dw-presence-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: opacity 250ms ease;
}
.dueseweb-modern .dw-presence-modal.is-open {
    opacity: 1;
    pointer-events: auto;
}
.dueseweb-modern .dw-presence-modal-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(3, 19, 33, 0.75);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.dueseweb-modern .dw-presence-modal-container {
    position: relative;
    z-index: 1;
    width: calc(100vw - 48px);
    max-width: 960px;
    max-height: 90vh;
    display: flex;
    flex-direction: column;
    background: rgba(3, 19, 33, 0.88);
    backdrop-filter: saturate(1.2) blur(18px);
    -webkit-backdrop-filter: saturate(1.2) blur(18px);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-lg);
    box-shadow: 0 30px 80px rgba(0, 0, 0, 0.55);
    color: var(--dw-ink);
    transform: translateY(12px);
    transition: transform 250ms ease;
}
.dueseweb-modern .dw-presence-modal.is-open .dw-presence-modal-container {
    transform: translateY(0);
}

/* Modal header */
.dueseweb-modern .dw-presence-modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--dw-sp-3);
    padding: var(--dw-sp-5);
    border-bottom: 1px solid rgba(255, 220, 184, 0.12);
    flex-shrink: 0;
}
.dueseweb-modern .dw-presence-modal-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin: 0;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-lg);
    font-weight: 600;
    color: var(--dw-ink);
}
.dueseweb-modern .dw-presence-modal-count {
    font-weight: 700;
}
.dueseweb-modern .dw-presence-modal-actions {
    display: flex;
    align-items: center;
    gap: var(--dw-sp-2);
    flex-shrink: 0;
}
.dueseweb-modern .dw-presence-modal-map-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    padding: var(--dw-sp-2) var(--dw-sp-4);
    background: rgba(255, 220, 184, 0.08);
    border: 1px solid rgba(255, 220, 184, 0.22);
    border-radius: var(--dw-radius-md);
    color: var(--dw-ink);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    cursor: pointer;
    transition: background 200ms ease, border-color 200ms ease;
}
.dueseweb-modern .dw-presence-modal-map-btn:hover,
.dueseweb-modern .dw-presence-modal-map-btn:focus-visible {
    background: rgba(255, 220, 184, 0.16);
    border-color: var(--dw-ink);
    outline: none;
}
.dueseweb-modern .dw-presence-modal-close {
    flex-shrink: 0;
    width: 44px;
    height: 44px;
    padding: 0;
    background: transparent;
    border: 1px solid transparent;
    border-radius: 999px;
    color: var(--dw-ink);
    font-size: 1.5rem;
    line-height: 1;
    cursor: pointer;
    transition: background 200ms ease, border-color 200ms ease;
}
.dueseweb-modern .dw-presence-modal-close:hover,
.dueseweb-modern .dw-presence-modal-close:focus-visible {
    background: rgba(255, 220, 184, 0.12);
    border-color: var(--dw-ink);
    outline: none;
}

/* Modal body / table */
.dueseweb-modern .dw-presence-modal-body {
    flex: 1 1 auto;
    overflow-y: auto;
    padding: var(--dw-sp-4) var(--dw-sp-5);
    min-height: 0;
}
.dueseweb-modern .dw-presence-table {
    width: 100%;
    border-collapse: collapse;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .dw-presence-table thead th {
    position: sticky;
    top: 0;
    background: rgba(3, 19, 33, 0.95);
    text-align: left;
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.06em;
    color: var(--dw-muted);
    padding: var(--dw-sp-2) var(--dw-sp-3);
    border-bottom: 1px solid rgba(255, 220, 184, 0.18);
    white-space: nowrap;
}
.dueseweb-modern .dw-presence-table thead th:first-child {
    width: 2.5rem;
    text-align: center;
}
.dueseweb-modern .dw-presence-table tbody td {
    padding: var(--dw-sp-2) var(--dw-sp-3);
    border-bottom: 1px solid rgba(255, 220, 184, 0.06);
    vertical-align: middle;
    white-space: nowrap;
}
.dueseweb-modern .dw-presence-table tbody td:first-child {
    text-align: center;
    font-size: var(--dw-fs-base);
}
.dueseweb-modern .dw-presence-table tbody tr:hover {
    background: rgba(255, 220, 184, 0.06);
}
.dueseweb-modern .dw-presence-table .dw-presence-table-page {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 160px;
    display: inline-block;
    vertical-align: middle;
}
.dueseweb-modern .dw-presence-table .dw-presence-table-page a {
    color: var(--dw-ink);
    text-decoration: underline;
    text-decoration-color: rgba(255, 220, 184, 0.35);
    text-underline-offset: 3px;
}
.dueseweb-modern .dw-presence-modal-empty {
    text-align: center;
    color: var(--dw-muted);
    font-size: var(--dw-fs-sm);
    padding: var(--dw-sp-7) 0;
    margin: 0;
}

.dueseweb-modern .dw-presence-row {
    display: flex;
    align-items: flex-start;
    gap: var(--dw-sp-3);
    padding: var(--dw-sp-3) var(--dw-sp-3);
    background: rgba(255, 220, 184, 0.06);
    border: 1px solid rgba(255, 220, 184, 0.12);
    border-radius: var(--dw-radius-md);
}
.dueseweb-modern .dw-presence-avatar {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 700;
    color: var(--dw-ink);
    background: rgba(255, 220, 184, 0.14);
    border: 1px solid rgba(255, 220, 184, 0.25);
    border-radius: 50%;
    letter-spacing: 0.02em;
}
.dueseweb-modern .dw-presence-row-body {
    display: grid;
    grid-template-columns: 1fr auto;
    column-gap: var(--dw-sp-3);
    row-gap: 2px;
    flex: 1 1 auto;
    min-width: 0;
}
.dueseweb-modern .dw-presence-row-alias {
    font-weight: 600;
    color: var(--dw-ink);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .dw-presence-row-flag {
    font-size: var(--dw-fs-base);
    line-height: 1;
    text-align: right;
}
.dueseweb-modern .dw-presence-row-title {
    grid-column: 1 / -1;
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-sm);
    font-style: italic;
    color: var(--dw-ink);
    text-decoration: underline;
    text-decoration-color: rgba(255, 220, 184, 0.35);
    text-underline-offset: 3px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dueseweb-modern .dw-presence-row-detail {
    grid-column: 1 / -1;
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.dueseweb-modern .dw-presence-row-seen {
    grid-column: 1 / -1;
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
}

/* Modal mobile — stacked cards instead of table */
@media (max-width: 639px) {
    .dueseweb-modern .dw-presence-modal-container {
        width: calc(100vw - 24px);
        max-height: 95vh;
        border-radius: var(--dw-radius-md);
    }
    .dueseweb-modern .dw-presence-modal-header {
        padding: var(--dw-sp-4);
        flex-wrap: wrap;
    }
    .dueseweb-modern .dw-presence-modal-title {
        font-size: var(--dw-fs-base);
    }
    .dueseweb-modern .dw-presence-modal-body {
        padding: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-presence-table thead {
        display: none;
    }
    .dueseweb-modern .dw-presence-table,
    .dueseweb-modern .dw-presence-table tbody {
        display: block;
    }
    .dueseweb-modern .dw-presence-table tbody tr {
        display: flex;
        flex-wrap: wrap;
        gap: var(--dw-sp-1) var(--dw-sp-3);
        padding: var(--dw-sp-3);
        background: rgba(255, 220, 184, 0.06);
        border: 1px solid rgba(255, 220, 184, 0.12);
        border-radius: var(--dw-radius-md);
        margin-bottom: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-presence-table tbody td {
        display: inline;
        padding: 0;
        border: none;
        white-space: normal;
        font-size: var(--dw-fs-xs);
    }
    .dueseweb-modern .dw-presence-table tbody td:first-child {
        font-size: var(--dw-fs-base);
    }
    .dueseweb-modern .dw-presence-table tbody td::before {
        content: attr(data-label);
        font-size: 0.7rem;
        text-transform: uppercase;
        letter-spacing: 0.06em;
        color: var(--dw-muted);
        margin-right: 0.3em;
    }
    .dueseweb-modern .dw-presence-table tbody td:first-child::before {
        display: none;
    }
}

/* Mobile — hide the presence pill entirely (too busy on small screens). */
@media (max-width: 767px) {
    .dueseweb-modern .dw-presence {
        display: none !important;
    }
}

/* Respect reduced-motion — drop the pulse. */
@media (prefers-reduced-motion: reduce) {
    .dueseweb-modern .dw-presence-dot {
        animation: none;
    }
    .dueseweb-modern .dw-presence-card {
        transition: opacity 0ms;
    }
}

/* ===== 14. prefers-reduced-motion ==============================*/
@media (prefers-reduced-motion: reduce) {
    .dueseweb-modern *,
    .dueseweb-modern *::before,
    .dueseweb-modern *::after {
        animation-duration: 0.01ms !important;
        transition-duration: 0.01ms !important;
    }
    .dueseweb-modern .ppcolumn:hover,
    .dueseweb-modern .dw-card:hover,
    .dueseweb-modern .dw-cta:hover {
        transform: none;
    }
}

/* ===== 24. Patient dashboard ====================================*/
.dueseweb-modern .dw-dashboard {
    min-height: 90vh;
    max-width: 100%;
    margin: 0 auto;
    padding: var(--dw-sp-5) var(--dw-sp-5) var(--dw-sp-6);
}
.dueseweb-modern .dw-dash-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: var(--dw-sp-4);
    flex-wrap: wrap;
    gap: var(--dw-sp-3);
}
.dueseweb-modern .dw-dash-title {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(1.3rem, 3.5vw, 1.8rem) !important;
    font-weight: 400 !important;
    color: var(--dw-ink) !important;
    margin: 0 !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}
.dueseweb-modern .dw-dash-tabs {
    display: flex;
    gap: var(--dw-sp-2);
    overflow-x: auto;
    margin-bottom: var(--dw-sp-4);
    padding-bottom: var(--dw-sp-2);
    -webkit-overflow-scrolling: touch;
}
.dueseweb-modern .dw-dash-tab {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    background: rgba(3, 19, 33, 0.30);
    border: 1px solid rgba(255, 220, 184, 0.10);
    border-radius: 999px;
    padding: 0.4rem 1rem;
    white-space: nowrap;
    cursor: pointer;
    transition: background var(--dw-dur-fast) var(--dw-ease),
                border-color var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-dash-tab.is-active {
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.55);
    border-color: rgba(255, 220, 184, 0.25);
}
.dueseweb-modern .dw-dash-content {
    background: none;
    border: none;
    padding: var(--dw-sp-4) 0;
    min-height: 400px;
}
.dueseweb-modern .dw-dash-section-title {
    font-family: var(--dw-font-serif) !important;
    font-size: clamp(1.1rem, 2.5vw, 1.3rem) !important;
    font-weight: 400 !important;
    color: var(--dw-ink) !important;
    margin: var(--dw-sp-4) 0 var(--dw-sp-3) !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}
.dueseweb-modern .dw-dash-section-title:first-child {
    margin-top: 0 !important;
}
.dueseweb-modern .dw-dash-booking-card {
    background: rgba(3, 19, 33, 0.30);
    border: 1px solid rgba(255, 220, 184, 0.10);
    border-radius: var(--dw-radius-md);
    padding: var(--dw-sp-3) var(--dw-sp-4);
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern .dw-dash-booking-card h3 {
    font-family: var(--dw-font-serif) !important;
    font-size: var(--dw-fs-base) !important;
    color: var(--dw-ink) !important;
    margin: 0 0 var(--dw-sp-1) !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}
.dueseweb-modern .dw-dash-booking-card p {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    margin: 0;
}
.dueseweb-modern .dw-dash-status {
    display: inline-block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    border-radius: 999px;
    padding: 0.15rem 0.6rem;
    margin-top: var(--dw-sp-2);
}
.dueseweb-modern .dw-dash-status-bestätigt {
    color: #2ecc71; border: 1px solid rgba(46, 204, 113, 0.4);
}
.dueseweb-modern .dw-dash-status-heute {
    color: #f4a261; border: 1px solid rgba(244, 162, 97, 0.4);
}
.dueseweb-modern .dw-dash-status-vergangen {
    color: var(--dw-muted); border: 1px solid rgba(255, 220, 184, 0.15);
}
.dueseweb-modern .dw-dash-profile {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: var(--dw-sp-2) var(--dw-sp-4);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .dw-dash-profile dt {
    color: var(--dw-muted); font-weight: 600;
}
.dueseweb-modern .dw-dash-profile dd {
    color: var(--dw-ink); margin: 0;
}
.dueseweb-modern .dw-dash-total {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    font-weight: 600;
    margin-bottom: var(--dw-sp-3);
}
.dueseweb-modern .dw-dash-year {
    font-family: var(--dw-font-serif) !important;
    font-size: var(--dw-fs-base) !important;
    color: var(--dw-ink) !important;
    margin: var(--dw-sp-3) 0 var(--dw-sp-2) !important;
    padding: 0 !important;
    background: none !important;
    border: none !important;
}
.dueseweb-modern .dw-dash-history-list {
    list-style: none;
    padding: 0;
    margin: 0 0 var(--dw-sp-3);
}
.dueseweb-modern .dw-dash-history-list li {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    padding: var(--dw-sp-1) 0;
}
.dueseweb-modern .dw-dash-empty,
.dueseweb-modern .dw-dash-loading,
.dueseweb-modern .dw-dash-error {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    text-align: center;
    padding: var(--dw-sp-6) 0;
}
.dueseweb-modern .dw-dash-note {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    margin-top: var(--dw-sp-4);
    font-style: italic;
}
.dueseweb-modern .dw-dash-reserve {
    display: block;
    text-align: center;
    margin-top: var(--dw-sp-4);
}
.dueseweb-modern .dw-dash-welcome {
    margin: 0 0 var(--dw-sp-4);
}
.dueseweb-modern .dw-dash-welcome-grid {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: var(--dw-sp-3);
}
.dueseweb-modern .dw-dash-welcome-card {
    display: flex;
    align-items: flex-start;
    gap: var(--dw-sp-3);
    padding: var(--dw-sp-3) var(--dw-sp-3);
    background: rgba(3, 19, 33, 0.30);
    border: 1px solid rgba(255, 220, 184, 0.10);
    border-radius: 14px;
    text-decoration: none;
    color: var(--dw-ink);
    transition: background var(--dw-dur-fast) var(--dw-ease),
                border-color var(--dw-dur-fast) var(--dw-ease),
                transform var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-dash-welcome-card:hover {
    background: rgba(3, 19, 33, 0.55);
    border-color: rgba(255, 220, 184, 0.30);
    transform: translateY(-1px);
}
.dueseweb-modern .dw-dash-welcome-card strong {
    display: block;
    font-family: var(--dw-font-serif);
    font-size: 1rem;
    font-weight: 500;
    margin-bottom: 2px;
    color: var(--dw-ink);
}
.dueseweb-modern .dw-dash-welcome-card span:not(.dw-dash-welcome-icon) {
    display: block;
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: 1.4;
}
.dueseweb-modern .dw-dash-welcome-icon {
    flex: 0 0 auto;
    font-size: 1.6rem;
    line-height: 1;
}
.dueseweb-modern .dw-dash-welcome-card--wa {
    background: linear-gradient(135deg, rgba(37, 211, 102, 0.18), rgba(3, 19, 33, 0.30));
    border-color: rgba(37, 211, 102, 0.35);
}
.dueseweb-modern .dw-dash-welcome-card--wa:hover {
    border-color: rgba(37, 211, 102, 0.55);
}
.dueseweb-modern .dw-dash-welcome-card--cta {
    background: linear-gradient(135deg, rgba(232, 112, 42, 0.20), rgba(3, 19, 33, 0.30));
    border-color: rgba(232, 112, 42, 0.40);
}
.dueseweb-modern .dw-dash-welcome-card--cta:hover {
    border-color: rgba(232, 112, 42, 0.65);
}
.dueseweb-modern .dw-dash-dc-link {
    font-size: var(--dw-fs-sm) !important;
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-dashboard {
        padding: var(--dw-sp-3) var(--dw-sp-3) var(--dw-sp-5);
    }
    .dueseweb-modern .dw-dash-tabs {
        gap: var(--dw-sp-1);
    }
    .dueseweb-modern .dw-dash-tab {
        font-size: var(--dw-fs-xs);
        padding: 0.3rem 0.7rem;
    }
    .dueseweb-modern .dw-dash-title {
        font-size: 1.3rem !important;
    }
}

/* ---- Mobile performance: disable GPU-heavy backdrop-filter ----
 * 90 backdrop-filter instances cause frame drops on mobile GPUs.
 * Keep the glassmorphism on desktop; on mobile replace with solid
 * rgba backgrounds. The hero overlay is exempt. */
@media (max-width: 767px) {
    .dueseweb-modern .dw-breadcrumb,
    .dueseweb-modern .dw-home-carousel-card,
    .dueseweb-modern .dw-finder-card,
    .dueseweb-modern .dw-finder-hero-search,
    .dueseweb-modern .dw-clinic-modal-inner,
    .dueseweb-modern .dw-nav-drawer,
    .dueseweb-modern .dw-info-card,
    .dueseweb-modern .dw-presence-pill,
    .dueseweb-modern .dw-presence-card,
    .dueseweb-modern .dw-office-pill,
    .dueseweb-modern .dw-form-card,
    .dueseweb-modern .dw-rw-screen,
    .dueseweb-modern .dw-auth-card,
    .dueseweb-modern .dw-dash-card {
        backdrop-filter: none !important;
        -webkit-backdrop-filter: none !important;
        background: rgba(3, 19, 33, 0.92) !important;
    }
}

/* Tile badges — seasonal + patient count */
.dueseweb-modern .dw-tile-seasonal {
    position: absolute;
    top: var(--dw-sp-3);
    left: var(--dw-sp-3);
    z-index: 3;
    background: rgba(196, 120, 67, 0.85);
    color: #fff;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    padding: 4px 10px;
    border-radius: 4px;
}
.dueseweb-modern .dw-tile-patients {
    display: none;
    position: absolute;
    bottom: var(--dw-sp-9);
    left: var(--dw-sp-3);
    z-index: 3;
    background: rgba(34, 197, 94, 0.2);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(34, 197, 94, 0.3);
    color: #22c55e;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    font-weight: 600;
    padding: 3px 8px;
    border-radius: 4px;
}

/* ===== Mosaic grid (3x3 cycling tiles) ============================*/

.dueseweb-modern .dw-mosaic {
    position: relative;
    padding: var(--dw-sp-4) var(--dw-sp-4);
    max-width: 1400px;
    margin: 0 auto;
}
/* Mosaic = desktop only, carousel = mobile only */
@media (max-width: 959px) {
    .dueseweb-modern .dw-mosaic { display: none !important; }
}
@media (min-width: 960px) {
    .dueseweb-modern .dw-home-splide { display: none !important; }
    /* Collapse hero height — mosaic sits directly below the banner. */
    .dueseweb-modern .dw-home-carousel-as-hero {
        height: auto !important;
        min-height: auto !important;
        padding-bottom: var(--dw-sp-5) !important;
    }
}

/* ---- Mosaic CSS Grid — magazine layout ---- */
/* 4 columns, 3 rows. Hero cell (top clinic) fills 2×2 top-left. */
.dueseweb-modern .dw-mosaic-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 10px;
    aspect-ratio: 16 / 9;
}
/* Hero tile — 2 cols × 2 rows, top-left */
.dueseweb-modern .dw-mosaic-cell:first-child {
    grid-column: span 2;
    grid-row: span 2;
}

/* ---- Tile cell ---- */
.dueseweb-modern .dw-mosaic-cell {
    position: relative;
    border-radius: var(--dw-radius-lg);
    overflow: hidden;
    background: rgba(3, 19, 33, 0.6);
    border: 1px solid rgba(255, 220, 184, 0.12);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
    transition: transform 0.5s var(--dw-ease), box-shadow 0.5s var(--dw-ease);
}
.dueseweb-modern .dw-mosaic-cell:hover {
    transform: translateY(-3px);
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
    z-index: 2;
}

/* ---- Link fills cell ---- */
.dueseweb-modern .dw-mosaic-link {
    display: block;
    position: absolute;
    inset: 0;
    text-decoration: none !important;
    color: inherit !important;
    transition: opacity 0.8s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.dueseweb-modern .dw-mosaic-link.dw-mosaic-out {
    opacity: 0;
}
.dueseweb-modern .dw-mosaic-link.dw-mosaic-in {
    opacity: 1;
}

/* ---- Weather pill — small, top-right, glassy ---- *
 * Re-added 2026-04-25 (was removed in the April hygiene pass).
 * Position TOP-right so the bottom caption stays uncluttered (the
 * caption gradient + title sit bottom-left, putting the pill there
 * read as "stretched" against the caption — top-right is the same
 * geometry the original 2026 design used). Content tightened to
 * just emoji + temp (flag dropped — caption already names the
 * country); ~30 % narrower than the previous flag+emoji+temp.
 */
.dueseweb-modern .dw-mosaic-weather {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 4;                /* above the link's ::after scrim */
    display: inline-flex;
    align-items: center;
    gap: 4px;
    padding: 3px 9px;
    border-radius: 999px;
    background: rgba(3, 19, 33, 0.62);
    border: 1px solid rgba(255, 220, 184, 0.18);
    backdrop-filter: blur(6px) saturate(125%);
    -webkit-backdrop-filter: blur(6px) saturate(125%);
    color: var(--dw-ink, #ffdcb8);
    font-family: var(--dw-font-sans);
    font-size: 0.78rem;
    font-weight: 600;
    line-height: 1;
    letter-spacing: 0.2px;
    pointer-events: none;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.5);
}
@media (max-width: 720px) {
    .dueseweb-modern .dw-mosaic-weather {
        font-size: 0.72rem;
        padding: 2px 7px;
        top: 6px;
        right: 6px;
    }
}

/* ---- Image — vivid, bright, static ---- */
.dueseweb-modern .dw-mosaic-img {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    filter: brightness(0.88) saturate(1.25) contrast(1.05);
}
/* Crossfade: two stacked img layers, B starts transparent */
.dueseweb-modern .dw-mosaic-img-b {
    opacity: 0;
    transition: opacity 1.8s ease;
}
.dueseweb-modern .dw-mosaic-img-a {
    transition: opacity 1.8s ease;
}
.dueseweb-modern .dw-mosaic-cell:hover .dw-mosaic-img {
    filter: brightness(1) saturate(1.35) contrast(1.05);
}

/* ---- Gradient scrim — lighter for vivid images ---- */
.dueseweb-modern .dw-mosaic-link::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(
        to top,
        rgba(3, 19, 33, 0.78) 0%,
        rgba(3, 19, 33, 0.12) 40%,
        transparent 100%
    );
    pointer-events: none;
    z-index: 1;
}

/* ---- Caption ---- */
.dueseweb-modern .dw-mosaic-caption {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 10px 12px;
    z-index: 2;
}
.dueseweb-modern .dw-mosaic-kicker {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: 0.65rem;
    text-transform: uppercase;
    letter-spacing: 0.08em;
    color: var(--dw-terracotta);
    margin-bottom: 2px;
}
.dueseweb-modern .dw-mosaic-title {
    font-family: var(--dw-font-serif);
    font-size: clamp(1rem, 1.8vw, 1.4rem);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 3px;
    text-shadow: 0 1px 6px rgba(0, 0, 0, 0.5);
}
/* Hero cell (2×2) gets larger type and visible subtitle */
.dueseweb-modern .dw-mosaic-cell:first-child .dw-mosaic-caption {
    padding: 16px 20px;
}
.dueseweb-modern .dw-mosaic-cell:first-child .dw-mosaic-kicker {
    font-size: 0.75rem;
    margin-bottom: 4px;
}
.dueseweb-modern .dw-mosaic-cell:first-child .dw-mosaic-title {
    font-size: clamp(1.4rem, 2.6vw, 2.2rem);
}
.dueseweb-modern .dw-mosaic-cell:first-child .dw-mosaic-sub {
    font-size: 0.8rem;
    margin-top: 4px;
    color: rgba(255, 255, 255, 0.8);
}
.dueseweb-modern .dw-mosaic-sub {
    font-family: var(--dw-font-sans);
    font-size: 0.65rem;
    color: var(--dw-muted);
    margin: 0;
    line-height: 1.4;
}

/* ---- Badges ---- */
.dueseweb-modern .dw-mosaic-weather {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 3;
    background: rgba(3, 19, 33, 0.55);
    border: 1px solid rgba(255, 220, 184, 0.20);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 0.65rem;
    color: var(--dw-ink);
}
/* Rating badge — top-left on tiles (carousel + mosaic) */
.dueseweb-modern .dw-tile-rating {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 3;
    background: rgba(3, 19, 33, 0.65);
    border: 1px solid rgba(251, 191, 36, 0.30);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 999px;
    padding: 3px 8px;
    font-family: var(--dw-font-sans);
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--dw-eucalyptus);
}
.dueseweb-modern .dw-home-carousel-tile .dw-tile-rating {
    font-size: 0.75rem;
    padding: 4px 10px;
}
.dueseweb-modern .dw-mosaic-seasonal {
    position: absolute;
    top: 8px;
    left: 8px;
    z-index: 3;
    background: rgba(196, 120, 67, 0.85);
    padding: 3px 8px;
    border-radius: 4px;
    font-size: 0.6rem;
    font-weight: 700;
    text-transform: uppercase;
    color: #fff;
}
.dueseweb-modern .dw-mosaic-patients {
    display: none;
    position: absolute;
    bottom: 55px;
    left: 8px;
    z-index: 3;
    background: rgba(34, 197, 94, 0.2);
    border: 1px solid rgba(34, 197, 94, 0.3);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border-radius: 999px;
    padding: 3px 8px;
    font-size: 0.65rem;
    color: #22c55e;
}

/* ---- Live counter tile in mosaic ---- */
.dueseweb-modern .dw-mosaic-live {
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: var(--dw-sp-4);
    position: absolute;
    inset: 0;
    background: linear-gradient(135deg, rgba(3, 19, 33, 0.85), rgba(3, 30, 50, 0.9));
}
.dueseweb-modern .dw-mosaic-live h3 {
    font-family: var(--dw-font-serif);
    font-size: clamp(0.9rem, 1.8vw, 1.3rem);
    font-weight: 400;
    color: var(--dw-ink);
    margin: var(--dw-sp-2) 0;
}

/* ---- Responsive: narrower desktop — 3 cols, hero 2×2 flows to 4 rows ---- */
@media (max-width: 1199px) {
    .dueseweb-modern .dw-mosaic-grid {
        grid-template-columns: repeat(3, 1fr);
        grid-auto-rows: 1fr;
        aspect-ratio: 3 / 3.2;
    }
}

/* ---- Responsive: 2x3 mobile ---- */
@media (max-width: 767px) {
    .dueseweb-modern .dw-mosaic {
        padding: var(--dw-sp-3) var(--dw-sp-2);
    }
    .dueseweb-modern .dw-mosaic-grid {
        grid-template-columns: repeat(2, 1fr);
        grid-template-rows: repeat(3, 1fr);
        aspect-ratio: 2 / 3;
        gap: 6px;
    }
}

/* "Reiseziel des Monats" seasonal highlight */
.dueseweb-modern .dw-month-highlight {
    position: relative;
    min-height: 50vh;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    margin: 0;
}
.dueseweb-modern .dw-month-img {
    position: absolute;
    inset: 0;
    background-size: cover;
    background-position: center;
    z-index: 0;
}
.dueseweb-modern .dw-month-body {
    position: relative;
    z-index: 1;
    width: 100%;
    padding: var(--dw-sp-9) var(--dw-sp-6);
    background: linear-gradient(to top, rgba(3, 19, 33, 0.85) 0%, transparent 100%);
    font-family: var(--dw-font-sans);
    color: var(--dw-ink);
}
.dueseweb-modern .dw-month-kicker {
    font-size: var(--dw-fs-xs);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    opacity: 0.7;
}
.dueseweb-modern .dw-month-title {
    font-family: var(--dw-font-display);
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 700;
    margin: var(--dw-sp-2) 0;
}
.dueseweb-modern .dw-month-weather {
    font-size: var(--dw-fs-xl);
    margin: var(--dw-sp-2) 0;
}
.dueseweb-modern .dw-month-tagline {
    font-size: var(--dw-fs-base);
    opacity: 0.85;
    margin: var(--dw-sp-2) 0;
}
.dueseweb-modern .dw-month-live {
    color: #22c55e;
    font-weight: 600;
    font-size: var(--dw-fs-sm);
    margin: var(--dw-sp-2) 0;
}
.dueseweb-modern .dw-month-cta {
    margin-top: var(--dw-sp-4);
    display: inline-block;
}
@media (max-width: 767px) {
    .dueseweb-modern .dw-month-highlight {
        min-height: 60vh;
    }
    .dueseweb-modern .dw-month-body {
        padding: var(--dw-sp-6) var(--dw-sp-4);
    }
}
}

/* Ringing overlay — "Eva wird angerufen..." */
.dw-call-overlay {
    position: fixed;
    inset: 0;
    z-index: 10000;
    background: rgba(3, 19, 33, 0.75);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    display: flex;
    align-items: center;
    justify-content: center;
    animation: dw-call-fade-in 500ms ease;
}
.dw-call-overlay-inner {
    text-align: center;
    color: var(--dw-ink);
    font-family: var(--dw-font-sans);
}
.dw-call-overlay-icon {
    font-size: 4rem;
    animation: dw-call-pulse 2s ease-in-out infinite;
}
.dw-call-overlay-text {
    font-size: var(--dw-fs-xl);
    font-weight: 600;
    margin: var(--dw-sp-4) 0;
}
.dw-call-overlay-cancel {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    background: transparent;
    border: 1px solid rgba(255, 220, 184, 0.2);
    border-radius: var(--dw-radius-md);
    padding: var(--dw-sp-3) var(--dw-sp-5);
    cursor: pointer;
    transition: border-color 200ms ease;
}
.dw-call-overlay-cancel:hover {
    border-color: var(--dw-ink);
}
@keyframes dw-call-fade-in {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes dw-call-pulse {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.15); }
}

/* After-hours card */
.dw-call-closed-card {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 10000;
    background: rgba(3, 19, 33, 0.88);
    backdrop-filter: blur(16px);
    -webkit-backdrop-filter: blur(16px);
    border-top: 1px solid rgba(255, 220, 184, 0.15);
    padding: var(--dw-sp-6) var(--dw-sp-5);
    text-align: center;
    font-family: var(--dw-font-sans);
    color: var(--dw-ink);
    animation: dw-card-slide-up 600ms ease;
}
.dw-call-closed-msg {
    font-size: var(--dw-fs-lg);
    font-weight: 600;
    margin: 0 0 var(--dw-sp-4);
}
.dw-call-closed-btns {
    display: flex;
    justify-content: center;
    gap: var(--dw-sp-3);
    flex-wrap: wrap;
}
.dw-call-closed-close {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    background: transparent;
    border: 1px solid rgba(255, 220, 184, 0.2);
    border-radius: var(--dw-radius-md);
    padding: var(--dw-sp-3) var(--dw-sp-5);
    cursor: pointer;
}
@keyframes dw-card-slide-up {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}

/* ===== 25. Homepage trust hierarchy + content sections ===========*/

/* -- Trust badges (below hero headline) -- */
.dueseweb-modern .dw-trust-badges {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--dw-sp-3);
    margin: var(--dw-sp-3) 0;
}
.dueseweb-modern .dw-trust-badge {
    display: inline-flex;
    align-items: center;
    gap: var(--dw-sp-2);
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    font-weight: 600;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.55);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    border: 1px solid rgba(255, 220, 184, 0.18);
    border-radius: 100px;
    padding: var(--dw-sp-2) var(--dw-sp-4);
    white-space: nowrap;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.dueseweb-modern .dw-trust-badge::before {
    content: '\2713';
    color: var(--dw-eucalyptus);
    font-weight: 700;
}

/* -- Hero CTA group -- */
.dueseweb-modern .dw-hero-ctas {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--dw-sp-3);
    margin: var(--dw-sp-2) 0;
}

/* -- Secondary CTA (outline style) -- */
.dueseweb-modern .dw-cta-secondary {
    background: transparent;
    color: var(--dw-ink);
    border: 2px solid rgba(255, 220, 184, 0.4);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
}
.dueseweb-modern .dw-cta-secondary:hover {
    background: rgba(255, 220, 184, 0.12);
    border-color: rgba(255, 220, 184, 0.6);
    color: var(--dw-ink);
}

/* -- Icon-only CTA (kiosk-mode launcher in the desktop banner) -- */
/* Square, iOS-style rounded-square badge that sits next to the
   "Beratung" CTA. Inherits the secondary outline treatment so it
   reads as chrome, not a primary action. Hidden on mobile since
   kiosk mode is desktop-only anyway (see 38-kiosk-mode.php). */
.dueseweb-modern .dw-cta-icon-only {
    width: 44px;
    height: 44px;
    padding: 0;
    justify-content: center;
    border-radius: 10px;         /* iOS app-icon corner radius feel */
    background: transparent;
    color: var(--dw-ink);
    border: 2px solid rgba(255, 220, 184, 0.35);
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    flex-shrink: 0;
}
.dueseweb-modern .dw-cta-icon-only .dw-cta-icon {
    width: 22px;
    height: 22px;
    margin: 0;
}
.dueseweb-modern .dw-cta-icon-only:hover {
    background: rgba(255, 220, 184, 0.12);
    border-color: rgba(255, 220, 184, 0.6);
    color: var(--dw-ink);
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-desktop-banner-kiosk { display: none !important; }
}

/* -- Outline CTA (phone) -- */
.dueseweb-modern .dw-cta-outline {
    background: transparent;
    color: var(--dw-ink);
    border: 2px solid var(--dw-terracotta);
}
.dueseweb-modern .dw-cta-outline:hover {
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA white-on-orange on hover fill */
    color: #fff;
}

/* -- Hero phone link -- */
.dueseweb-modern .dw-hero-phone {
    display: inline-block;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    font-weight: 500;
    color: var(--dw-ink) !important;
    text-decoration: none !important;
    padding: var(--dw-sp-2) var(--dw-sp-3);
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
    opacity: 0.85;
    transition: opacity var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-hero-phone:hover {
    opacity: 1;
    color: var(--dw-terracotta) !important;
}

/* -- Shared section layout -- */
.dueseweb-modern .dw-section-inner {
    max-width: var(--dw-container);
    margin: 0 auto;
    padding: 0 var(--dw-sp-5);
}
.dueseweb-modern .dw-section-heading {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-3xl);
    font-weight: 400;
    color: var(--dw-ink);
    text-align: center;
    margin: 0 0 var(--dw-sp-3);
    line-height: var(--dw-lh-tight);
}
.dueseweb-modern .dw-section-subheading {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-lg);
    color: var(--dw-muted);
    text-align: center;
    margin: 0 0 var(--dw-sp-7);
    line-height: var(--dw-lh-snug);
    max-width: 56ch;
    margin-left: auto;
    margin-right: auto;
}

/* -- "So funktioniert's" process section -- */
.dueseweb-modern .dw-process {
    position: relative;
    z-index: 2;
    padding: var(--dw-sp-9) 0;
    background: var(--dw-cream);
}
.dueseweb-modern .dw-process-steps {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--dw-sp-5);
}
.dueseweb-modern .dw-process-step {
    text-align: center;
    padding: var(--dw-sp-5) var(--dw-sp-4);
}
.dueseweb-modern .dw-process-num {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--dw-terracotta-cta, #bf501c);
    color: #fff;
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 700;
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern .dw-process-step h3 {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-lg);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-3);
    margin-top: 0;
    line-height: var(--dw-lh-tight);
}
.dueseweb-modern .dw-process-step p {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0;
}
.dueseweb-modern .dw-process-cta {
    text-align: center;
    margin-top: var(--dw-sp-7);
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-process-steps {
        grid-template-columns: 1fr 1fr;
    }
}
@media (max-width: 599px) {
    .dueseweb-modern .dw-process,
    .dueseweb-modern .dw-quality,
    .dueseweb-modern .dw-faq,
    .dueseweb-modern .dw-final-cta {
        padding: var(--dw-sp-7) 0;
    }
    .dueseweb-modern .dw-section-inner {
        padding: 0 var(--dw-sp-4);
    }
    .dueseweb-modern .dw-section-heading {
        font-size: var(--dw-fs-xl);
        margin-bottom: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-section-subheading {
        font-size: var(--dw-fs-sm);
        margin-bottom: var(--dw-sp-5);
    }
    .dueseweb-modern .dw-process-steps {
        grid-template-columns: 1fr;
        gap: 0;
    }
    .dueseweb-modern .dw-process-step {
        display: flex;
        align-items: flex-start;
        text-align: left;
        gap: var(--dw-sp-4);
        padding: var(--dw-sp-4) 0;
        min-width: 0;
    }
    .dueseweb-modern .dw-process-num {
        flex-shrink: 0;
        margin-bottom: 0;
        width: 2.5rem;
        height: 2.5rem;
        font-size: var(--dw-fs-lg);
    }
    .dueseweb-modern .dw-process-step h3 {
        font-size: var(--dw-fs-base) !important;
        margin: 0 0 var(--dw-sp-1) !important;
    }
    .dueseweb-modern .dw-process-step p {
        font-size: var(--dw-fs-xs);
    }
    .dueseweb-modern .dw-process-cta {
        margin-top: var(--dw-sp-5);
    }
}

/* -- Trust & quality cards -- */
.dueseweb-modern .dw-quality {
    position: relative;
    z-index: 2;
    padding: var(--dw-sp-9) 0;
    background: var(--dw-clay);
}
.dueseweb-modern .dw-quality-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: var(--dw-sp-5);
}
.dueseweb-modern .dw-quality-card {
    min-width: 0;
    overflow-wrap: anywhere;
    background: var(--dw-cream);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-radius-lg);
    padding: var(--dw-sp-6);
    transition: transform var(--dw-dur-base) var(--dw-ease),
                box-shadow var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .dw-quality-card:hover {
    transform: translateY(-2px);
    box-shadow: var(--dw-shadow-lg);
}
.dueseweb-modern .dw-quality-icon {
    display: block;
    font-size: 2rem;
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern .dw-quality-card h3 {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-lg);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-3);
    margin-top: 0;
    line-height: var(--dw-lh-tight);
}
.dueseweb-modern .dw-quality-card p {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0;
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-quality-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}
@media (max-width: 599px) {
    .dueseweb-modern .dw-quality-grid {
        grid-template-columns: 1fr;
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-quality-card {
        padding: var(--dw-sp-4);
        display: flex;
        align-items: flex-start;
        gap: var(--dw-sp-4);
    }
    .dueseweb-modern .dw-quality-icon {
        flex-shrink: 0;
        font-size: 1.5rem;
        margin-bottom: 0;
    }
    .dueseweb-modern .dw-quality-card h3 {
        font-size: var(--dw-fs-base) !important;
        margin: 0 0 var(--dw-sp-1) !important;
    }
    .dueseweb-modern .dw-quality-card p {
        font-size: var(--dw-fs-xs);
    }
}
/* merged into block above */

/* Country finder hubs — medical-first lead (25-country-page-lead.php) */
.dueseweb-modern .dw-country-lead {
    position: relative;
    z-index: 2;
    max-width: 48rem;
    margin: 0 auto var(--dw-sp-8);
    padding: var(--dw-sp-6) var(--dw-sp-6);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-radius-md);
    background: var(--dw-clay);
}
.dueseweb-modern .dw-country-lead-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-4);
    line-height: var(--dw-lh-tight);
}
.dueseweb-modern .dw-country-lead-text {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0 0 var(--dw-sp-5);
}
.dueseweb-modern .dw-country-lead-cta {
    margin: 0;
}

/* Destination detail — medical-first lead, same styling as country lead. */
.dueseweb-modern .dw-destination-lead {
    position: relative;
    z-index: 2;
    max-width: 48rem;
    margin: 0 auto var(--dw-sp-8);
    padding: var(--dw-sp-6) var(--dw-sp-6);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-radius-md);
    background: var(--dw-clay);
}
.dueseweb-modern .dw-destination-lead-title {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-4);
    line-height: var(--dw-lh-tight);
}
.dueseweb-modern .dw-destination-lead-text {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0 0 var(--dw-sp-5);
}
.dueseweb-modern .dw-destination-lead-cta {
    margin: 0;
}

/* -- FAQ section -- */
.dueseweb-modern .dw-faq {
    position: relative;
    z-index: 2;
    padding: var(--dw-sp-9) 0;
    background: var(--dw-cream);
}
.dueseweb-modern .dw-faq-item {
    max-width: 48rem;
    margin: 0 auto var(--dw-sp-3);
    border: 1px solid var(--dw-border);
    border-radius: var(--dw-radius-md);
    overflow: hidden;
    background: var(--dw-clay);
}
.dueseweb-modern .dw-faq-question {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-lg);
    font-weight: 400;
    color: var(--dw-ink);
    padding: var(--dw-sp-5) var(--dw-sp-6);
    cursor: pointer;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: var(--dw-sp-4);
    line-height: var(--dw-lh-snug);
    transition: background var(--dw-dur-fast) var(--dw-ease);
}
.dueseweb-modern .dw-faq-question::-webkit-details-marker {
    display: none;
}
.dueseweb-modern .dw-faq-question::after {
    content: '+';
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xl);
    font-weight: 300;
    color: var(--dw-muted);
    flex-shrink: 0;
    transition: transform var(--dw-dur-base) var(--dw-ease);
}
.dueseweb-modern .dw-faq-item[open] .dw-faq-question::after {
    transform: rotate(45deg);
}
.dueseweb-modern .dw-faq-question:hover {
    background: rgba(255, 220, 184, 0.04);
}
.dueseweb-modern .dw-faq-answer {
    padding: 0 var(--dw-sp-6) var(--dw-sp-5);
}
.dueseweb-modern .dw-faq-answer p {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0;
}
@media (max-width: 599px) {
    .dueseweb-modern .dw-faq-question {
        font-size: var(--dw-fs-base);
        padding: var(--dw-sp-4) var(--dw-sp-5);
    }
    .dueseweb-modern .dw-faq-answer {
        padding: 0 var(--dw-sp-5) var(--dw-sp-4);
    }
}

/* -- Final CTA band -- */
.dueseweb-modern .dw-final-cta {
    position: relative;
    z-index: 2;
    padding: var(--dw-sp-9) 0;
    background: var(--dw-clay);
    text-align: center;
}
.dueseweb-modern .dw-final-cta-buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--dw-sp-4);
}
@media (max-width: 599px) {
    .dueseweb-modern .dw-final-cta-buttons {
        flex-direction: column;
        align-items: center;
    }
    .dueseweb-modern .dw-final-cta-buttons .dw-cta {
        width: 100%;
        max-width: 20rem;
    }
}

/* ===== 26. Mobile sticky bottom CTA bar ==========================*/
.dueseweb-modern .dw-sticky-bar {
    display: none;
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-sticky-bar {
        display: flex;
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        z-index: 9999;
        background: rgba(3, 19, 33, 0.92);
        backdrop-filter: saturate(1.4) blur(16px);
        -webkit-backdrop-filter: saturate(1.4) blur(16px);
        border-top: 1px solid rgba(255, 220, 184, 0.12);
        padding: var(--dw-sp-3) var(--dw-sp-4);
        padding-bottom: calc(var(--dw-sp-3) + env(safe-area-inset-bottom, 0px));
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-sticky-bar-btn {
        flex: 1;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: var(--dw-sp-2);
        font-family: var(--dw-font-sans);
        font-size: var(--dw-fs-base);
        font-weight: 600;
        text-decoration: none;
        border-radius: var(--dw-radius-md);
        padding: var(--dw-sp-3) var(--dw-sp-4);
        min-height: 48px;
        transition: background var(--dw-dur-fast) var(--dw-ease);
    }
    .dueseweb-modern .dw-sticky-bar-call {
        background: transparent;
        color: var(--dw-ink);
        border: 1px solid rgba(255, 220, 184, 0.25);
    }
    .dueseweb-modern .dw-sticky-bar-call:hover {
        background: rgba(255, 220, 184, 0.08);
        color: var(--dw-ink);
    }
    .dueseweb-modern .dw-sticky-bar-enquiry {
        /* WCAG 2.2 AA: white-on-terracotta needs the darker CTA-only variant. */
        background: var(--dw-terracotta-cta, #bf501c);
        color: #fff;
        border: none;
    }
    .dueseweb-modern .dw-sticky-bar-enquiry:hover {
        background: var(--dw-terracotta-cta-hover, #a3431a);
        color: #fff;
    }
    /* WhatsApp (2026-09-27): compact icon button + one hours line above the
       buttons. The row wraps so the hours line spans the full width. */
    .dueseweb-modern .dw-sticky-bar { flex-wrap: wrap; row-gap: var(--dw-sp-2); }
    .dueseweb-modern .dw-sticky-bar-wa-hours {
        flex: 0 0 100%;
        margin: 0;
        text-align: center;
        font-family: var(--dw-font-sans);
        font-size: var(--dw-fs-sm);
        font-weight: 600;
        line-height: 1.3;
        color: var(--dw-ink);
    }
    .dueseweb-modern .dw-sticky-bar-call,
    .dueseweb-modern .dw-sticky-bar-enquiry {
        padding-left: var(--dw-sp-2);
        padding-right: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-sticky-bar-wa {
        flex: 0 0 48px;
        padding: 0;
        background: #25d366;
        color: #06301a;
        border: none;
    }
    .dueseweb-modern .dw-sticky-bar-wa:hover { filter: brightness(1.06); color: #06301a; }
    .dueseweb-modern .dw-sticky-bar-btn:focus-visible {
        outline: 3px solid #fff;
        outline-offset: 2px;
    }
    .dueseweb-modern .dw-sticky-bar-btn { text-align: center; }
    /* Give bottom of page space so sticky bar doesn't overlap content */
    .dueseweb-modern #footer {
        padding-bottom: 116px;
    }
}
/* Small phones (≤380 px, e.g. 360 px Android): keep both labels and the
   hours line on one line each — tighter padding/gaps, slightly smaller type. */
@media (max-width: 380px) {
    .dueseweb-modern .dw-sticky-bar {
        padding-left: var(--dw-sp-2);
        padding-right: var(--dw-sp-2);
        gap: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-sticky-bar-call,
    .dueseweb-modern .dw-sticky-bar-enquiry {
        font-size: 0.95rem;
        padding-left: 6px;
        padding-right: 6px;
    }
    .dueseweb-modern .dw-sticky-bar-wa-hours { font-size: 0.8125rem; }
    .dueseweb-modern .dw-sticky-bar-wa-notice { font-size: 0.75rem; }
}
.dueseweb-modern .dw-sticky-bar-wa-notice a { color: inherit; text-decoration: underline; white-space: nowrap; }

/* Info drawer: .dw-info-linklike — legacy; Entdecken is now a normal link */
.dueseweb-modern .dw-info-card .dw-info-linklike {
    background: none;
    border: none;
    padding: 0;
    margin: 0;
    font: inherit;
    color: var(--dw-ink, #ffdcb8);
    text-decoration: underline;
    cursor: pointer;
    text-align: left;
}
.dueseweb-modern .dw-info-card .dw-info-linklike:hover {
    color: #fff;
}

/* ===== 27a. Desktop sticky banner ================================*/
/* Hidden on mobile, fixed top on desktop. Contains logo + headline
   + trust facts + CTAs in a single horizontal bar. */
.dueseweb-modern .dw-desktop-banner {
    display: none;
}
@media (min-width: 960px) {
    .dueseweb-modern .dw-desktop-banner {
        display: block;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
        background: rgba(3, 19, 33, 0.88);
        backdrop-filter: saturate(1.3) blur(16px);
        -webkit-backdrop-filter: saturate(1.3) blur(16px);
        border-bottom: 1px solid rgba(255, 220, 184, 0.10);
    }
    .dueseweb-modern .dw-desktop-banner-inner {
        max-width: 1600px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        gap: var(--dw-sp-5);
        padding: var(--dw-sp-3) var(--dw-sp-5);
        /* Leave space for hamburger + phone icon on the right */
        padding-right: calc(var(--dw-sp-5) + 108px);
    }
    .dueseweb-modern .dw-desktop-banner-logo {
        flex-shrink: 0;
        text-decoration: none !important;
    }
    .dueseweb-modern .dw-desktop-banner-logo img {
        height: 36px;
        width: auto;
        display: block;
    }
    .dueseweb-modern .dw-desktop-banner-content {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: 2px;
    }
    .dueseweb-modern .dw-desktop-banner-headline {
        font-family: var(--dw-font-serif);
        font-size: var(--dw-fs-base);
        font-weight: 400;
        color: var(--dw-ink);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    .dueseweb-modern .dw-desktop-banner-sub {
        font-family: var(--dw-font-sans);
        font-size: var(--dw-fs-xs);
        color: var(--dw-muted);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* 2026-04-25 — team-pill strip replaces the legacy two-line claim
       in the global banner. Four overlapping circular avatars + caption
       link → /dialyseplatzreservierung/ (avatars not inside <a> for SEO). */
    .dueseweb-modern .dw-desktop-banner-team {
        display: flex;
        align-items: center;
        gap: var(--dw-sp-2, 10px);
        color: var(--dw-ink);
    }
    .dueseweb-modern .dw-desktop-banner-team-link {
        text-decoration: none;
        color: inherit;
        transition: opacity 0.18s ease;
    }
    .dueseweb-modern .dw-desktop-banner-team-link:hover,
    .dueseweb-modern .dw-desktop-banner-team-link:focus {
        opacity: 0.85;
    }
    .dueseweb-modern .dw-desktop-banner-team-stack {
        display: inline-flex;
        align-items: center;
        position: relative;
    }
    .dueseweb-modern .dw-desktop-banner-team-pill {
        width: 36px;
        height: 36px;
        border-radius: 50%;
        object-fit: cover;
        object-position: center 22%;
        border: 2px solid var(--dw-cream, #0e3558);
        background: var(--dw-clay, #061a2c);
        margin-left: -10px;
        box-shadow: 0 1px 3px rgba(0,0,0,0.25);
    }
    .dueseweb-modern .dw-desktop-banner-team-pill:first-child { margin-left: 0; }
    .dueseweb-modern .dw-desktop-banner-team-caption {
        font-family: var(--dw-font-sans);
        font-size: var(--dw-fs-sm, 14px);
        color: var(--dw-ink);
        font-weight: 500;
        white-space: nowrap;
    }
    @media (max-width: 720px) {
        .dueseweb-modern .dw-desktop-banner-team-caption { display: none; }
        .dueseweb-modern .dw-desktop-banner-team-pill { width: 30px; height: 30px; margin-left: -8px; }
    }
    .dueseweb-modern .dw-desktop-banner-ctas {
        flex-shrink: 0;
        display: flex;
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-desktop-banner-cta {
        padding: var(--dw-sp-2) var(--dw-sp-4) !important;
        font-size: var(--dw-fs-sm) !important;
        white-space: nowrap;
    }
    /* Subpage variant of the banner — logo + brand label + CTAs only.
       Drops the marketing tagline and count claim that previously
       repeated on every page above the page content. */
    .dueseweb-modern .dw-desktop-banner-brand {
        font-family: var(--dw-font-serif);
        font-size: var(--dw-fs-base);
        font-weight: 400;
        color: var(--dw-ink);
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
    }
    /* Header mini-search — surfaces the /interaktive-karte/ ?q= deep
       link from every page. Desktop only (≥720px). Hardcoded hex
       because --dw-cream / --dw-navy are inverted on this theme. */
    .dueseweb-modern .dw-header-mapsearch {
        display: none; /* enabled at ≥720px below */
        align-items: center;
        gap: 0;
        width: 240px;
        height: 32px;
        padding: 0 4px 0 0;
        margin: 0;
        border: 1.5px solid #ef6c3a;
        border-radius: 999px;
        background: rgba(14, 53, 88, 0.55);
        transition: border-color 120ms ease;
    }
    .dueseweb-modern .dw-header-mapsearch:hover,
    .dueseweb-modern .dw-header-mapsearch:focus-within {
        border-color: #ffdcb8;
    }
    .dueseweb-modern .dw-header-mapsearch-input {
        flex: 1 1 auto;
        min-width: 0;
        height: 28px;
        padding: 0 0 0 12px;
        background: transparent;
        border: none;
        outline: none;
        color: #ffdcb8;
        font-family: var(--dw-font-sans);
        font-size: 0.8rem;
        line-height: 1;
    }
    .dueseweb-modern .dw-header-mapsearch-input::placeholder {
        color: rgba(255, 220, 184, 0.7);
    }
    .dueseweb-modern .dw-header-mapsearch-btn {
        flex: 0 0 auto;
        width: 28px;
        height: 28px;
        padding: 0;
        background: transparent;
        border: none;
        color: #ef6c3a;
        font-size: 1.1rem;
        line-height: 1;
        cursor: pointer;
        transition: color 120ms ease;
    }
    .dueseweb-modern .dw-header-mapsearch-btn:hover,
    .dueseweb-modern .dw-header-mapsearch-btn:focus-visible {
        color: #ffdcb8;
        outline: none;
    }
    @media (min-width: 720px) {
        .dueseweb-modern .dw-header-mapsearch {
            display: inline-flex;
        }
    }
    /* Push main content below the fixed banner */
    .dueseweb-modern .dw-home-carousel-as-hero {
        padding-top: calc(60px + 2vh) !important;
    }
    /* Hide the mobile-only hero elements on desktop */
    .dueseweb-modern .dw-mobile-only {
        display: none !important;
    }
    /* On homepage desktop, tuck hamburger + phone icon into the
       fixed banner row — same height, flush right. */
    body.home.dueseweb-modern #dw-nav-toggle {
        top: 7px;
        right: var(--dw-sp-5);
        z-index: 1001;
        width: 44px;
        height: 44px;
        padding: 10px 9px;
    }
    body.home.dueseweb-modern .dw-header-phone {
        top: 7px;
        right: calc(var(--dw-sp-5) + 52px);
        z-index: 1001;
        width: 44px;
        height: 44px;
        font-size: 1.3rem;
    }
}
/* Mobile: show mobile-only elements, hide desktop banner + desktop-only */
@media (max-width: 959px) {
    .dueseweb-modern .dw-mobile-only {
        display: block;
    }
    .dueseweb-modern .dw-desktop-only {
        display: none !important;
    }
}
@media (min-width: 960px) {
    .dueseweb-modern .dw-desktop-only {
        display: block;
    }
}
/* Desktop intro liner — single calm sentence below the banner */
.dueseweb-modern .dw-hero-intro {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    color: var(--dw-ink);
    text-align: center;
    margin: 0 auto var(--dw-sp-4);
    max-width: 42ch;
    line-height: var(--dw-lh-snug);
    text-shadow: 0 2px 12px rgba(3, 19, 33, 0.6);
    padding: var(--dw-sp-3) var(--dw-sp-4);
    background: rgba(3, 19, 33, 0.35);
    backdrop-filter: saturate(1.2) blur(8px);
    -webkit-backdrop-filter: saturate(1.2) blur(8px);
    border-radius: var(--dw-radius-md);
    border: 1px solid rgba(255, 220, 184, 0.08);
}

/* ===== 27b. Hero sub + support line ==============================*/
.dueseweb-modern .dw-hero-sub {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-base);
    color: var(--dw-muted);
    text-align: center;
    line-height: var(--dw-lh-base);
    margin: 0 0 var(--dw-sp-2);
    max-width: 48ch;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}
.dueseweb-modern .dw-hero-support {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    text-align: center;
    margin: 0;
    opacity: 0.8;
    text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

/* ===== 28. 3 benefit cards (early reassurance) ===================*/
.dueseweb-modern .dw-benefits {
    position: relative;
    z-index: 2;
    padding: var(--dw-sp-7) 0;
    background: var(--dw-clay);
}
.dueseweb-modern .dw-benefits-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--dw-sp-5);
}
.dueseweb-modern .dw-benefit-card {
    background: var(--dw-cream);
    border: 1px solid var(--dw-border);
    border-left: 4px solid var(--dw-terracotta);
    border-radius: var(--dw-radius-md);
    padding: var(--dw-sp-5) var(--dw-sp-6);
}
.dueseweb-modern .dw-benefit-card h3 {
    font-family: var(--dw-font-serif);
    font-size: var(--dw-fs-xl);
    font-weight: 400;
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-3);
    margin-top: 0;
    line-height: var(--dw-lh-tight);
}
.dueseweb-modern .dw-benefit-card p {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0;
}
.dueseweb-modern .dw-benefits-footnote {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-xs);
    color: var(--dw-muted);
    text-align: center;
    margin: var(--dw-sp-4) 0 0;
    opacity: 0.7;
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-benefits-grid {
        grid-template-columns: 1fr;
    }
}
@media (max-width: 599px) {
    .dueseweb-modern .dw-benefits {
        padding: var(--dw-sp-5) 0;
    }
    .dueseweb-modern .dw-benefit-card {
        padding: var(--dw-sp-4) var(--dw-sp-5);
    }
    .dueseweb-modern .dw-benefit-card h3 {
        font-size: var(--dw-fs-lg);
    }
    .dueseweb-modern .dw-hero-sub {
        font-size: var(--dw-fs-sm);
        max-width: none;
        padding: 0 var(--dw-sp-3);
    }
}

/* ===== 29. Process support sentence ==============================*/
.dueseweb-modern .dw-process-support {
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    text-align: center;
    margin: var(--dw-sp-5) auto 0;
    max-width: 48ch;
    font-style: italic;
}

/* ===== 30. Mobile-only reassurance block ==========================*/
.dueseweb-modern .dw-mobile-reassurance {
    display: none;
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-mobile-reassurance {
        display: block;
        position: relative;
        z-index: 2;
        padding: var(--dw-sp-7) 0;
        background: var(--dw-cream);
        text-align: center;
    }
    .dueseweb-modern .dw-mobile-reassurance-text {
        font-family: var(--dw-font-sans);
        font-size: var(--dw-fs-sm);
        color: var(--dw-muted);
        line-height: var(--dw-lh-base);
        margin: 0 0 var(--dw-sp-5);
        max-width: 36ch;
        margin-left: auto;
        margin-right: auto;
    }
    .dueseweb-modern .dw-trust-badges-mobile {
        display: flex !important;
        flex-wrap: wrap;
        justify-content: center;
        gap: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-trust-badges-mobile .dw-trust-badge {
        background: rgba(3, 19, 33, 0.55);
        font-size: var(--dw-fs-xs);
    }
}

/* ===== 31. Hide seasonal "Beste Reisezeit" badge =================*/
.dueseweb-modern .dw-tile-seasonal,
.dueseweb-modern .dw-mosaic-seasonal {
    display: none;
}

/* ===== Medical-first intro block on country/city pages ============*/
.dueseweb-modern .dw-medical-intro {
    background: var(--dw-cream);
    border: 1px solid var(--dw-border);
    border-left: 4px solid var(--dw-terracotta);
    border-radius: var(--dw-radius-md);
    padding: var(--dw-sp-5);
    margin: var(--dw-sp-5) 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: var(--dw-sp-4);
}
.dueseweb-modern .dw-medical-intro-text {
    flex: 1;
    min-width: 200px;
    font-family: var(--dw-font-sans);
    font-size: var(--dw-fs-sm);
    color: var(--dw-muted);
    line-height: var(--dw-lh-base);
    margin: 0;
}
.dueseweb-modern .dw-medical-intro-text strong {
    color: var(--dw-ink);
}
.dueseweb-modern .dw-medical-intro-cta {
    flex-shrink: 0;
    white-space: nowrap;
}


/* ===== Share button (iOS-style single trigger + tile sheet) ===== */
/* Single "Teilen" button — matches how users already share on phones.
 * Desktop: opens a tile sheet modal. Mobile: triggers native Web Share API
 * (OS share sheet with all installed apps like WhatsApp, Mail, Messages). */

.dueseweb-modern .dw-share {
    margin: var(--dw-sp-7) 0 var(--dw-sp-5);
    padding: var(--dw-sp-5) 0;
    border-top: 1px solid rgba(255, 220, 184, 0.12);
    display: flex;
    justify-content: flex-start;
}

/* Trigger button — calm, neutral "Teilen" with iOS share icon */
.dueseweb-modern .dw-share-trigger {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 22px;
    border-radius: 12px;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 220, 184, 0.2);
    color: var(--dw-ink);
    font-family: var(--dw-font-sans);
    font-size: 0.95rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.2s var(--dw-ease), border-color 0.2s var(--dw-ease), transform 0.2s var(--dw-ease);
    min-height: 48px;
}
.dueseweb-modern .dw-share-trigger:hover,
.dueseweb-modern .dw-share-trigger:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    border-color: rgba(255, 220, 184, 0.4);
    transform: translateY(-1px);
}
.dueseweb-modern .dw-share-icon {
    flex-shrink: 0;
}

/* Content-area variant (clinic/info pages have cream bg) */
.dueseweb-modern .entry-content .dw-share,
.dueseweb-modern #content .dw-share,
.dueseweb-modern .hentry .dw-share {
    border-top-color: rgba(3, 19, 33, 0.1) !important;
}
.dueseweb-modern .entry-content .dw-share-trigger,
.dueseweb-modern #content .dw-share-trigger,
.dueseweb-modern .hentry .dw-share-trigger {
    background: rgba(3, 19, 33, 0.04) !important;
    border-color: rgba(3, 19, 33, 0.18) !important;
    color: rgba(3, 19, 33, 0.85) !important;
    text-decoration: none !important;
}
.dueseweb-modern .entry-content .dw-share-trigger:hover,
.dueseweb-modern #content .dw-share-trigger:hover {
    background: rgba(3, 19, 33, 0.08) !important;
    border-color: rgba(3, 19, 33, 0.3) !important;
    color: rgba(3, 19, 33, 0.95) !important;
}

/* ----- Sheet modal (desktop + fallback) ----- */
.dueseweb-modern .dw-share-sheet {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    animation: dwShareFade 0.2s ease;
}
/* .dw-share-sheet[hidden] override lives once, near the share-trigger block (~L8001) */
body.dw-share-open {
    overflow: hidden;
}
@keyframes dwShareFade {
    from { opacity: 0; }
    to   { opacity: 1; }
}
.dueseweb-modern .dw-share-sheet-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(3, 19, 33, 0.5);
    backdrop-filter: blur(4px);
    -webkit-backdrop-filter: blur(4px);
}
.dueseweb-modern .dw-share-sheet-panel {
    position: relative;
    width: 100%;
    max-width: 420px;
    background: #fff;
    border-radius: 18px 18px 0 0;
    padding: 12px 16px calc(24px + env(safe-area-inset-bottom, 0px));
    box-shadow: 0 -8px 32px rgba(0, 0, 0, 0.2);
    animation: dwShareSlideUp 0.28s cubic-bezier(0.2, 0.8, 0.2, 1);
}
@keyframes dwShareSlideUp {
    from { transform: translateY(100%); }
    to   { transform: translateY(0); }
}
@media (min-width: 600px) {
    .dueseweb-modern .dw-share-sheet {
        align-items: center;
    }
    .dueseweb-modern .dw-share-sheet-panel {
        border-radius: 18px;
        animation: dwShareScaleIn 0.22s cubic-bezier(0.2, 0.8, 0.2, 1);
    }
    @keyframes dwShareScaleIn {
        from { opacity: 0; transform: scale(0.95); }
        to   { opacity: 1; transform: scale(1); }
    }
}
.dueseweb-modern .dw-share-sheet-handle {
    width: 40px;
    height: 4px;
    border-radius: 2px;
    background: rgba(3, 19, 33, 0.15);
    margin: 4px auto 14px;
}
@media (min-width: 600px) {
    .dueseweb-modern .dw-share-sheet-handle {
        display: none;
    }
}
.dueseweb-modern .dw-share-sheet-title {
    font-family: var(--dw-font-sans);
    font-size: 1.05rem;
    font-weight: 600;
    color: rgba(3, 19, 33, 0.9);
    text-align: center;
    margin: 0 0 18px;
    padding: 0;
    border: none;
}

/* ----- Tile grid (iOS share sheet style) ----- */
.dueseweb-modern .dw-share-sheet-tiles {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(72px, 1fr));
    gap: 8px;
    padding: 4px 0 18px;
}
.dueseweb-modern .dw-share-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 10px 4px;
    background: transparent;
    border: none;
    border-radius: 12px;
    cursor: pointer;
    text-decoration: none !important;
    color: rgba(3, 19, 33, 0.85) !important;
    font-family: var(--dw-font-sans);
    font-size: 0.8rem;
    font-weight: 500;
    transition: background 0.15s ease, transform 0.15s ease;
}
.dueseweb-modern .dw-share-tile:hover,
.dueseweb-modern .dw-share-tile:focus-visible {
    background: rgba(3, 19, 33, 0.04);
    transform: translateY(-1px);
}
.dueseweb-modern .dw-share-tile-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 52px;
    height: 52px;
    border-radius: 50%;
    color: #fff;
    flex-shrink: 0;
}
.dueseweb-modern .dw-share-tile-whatsapp { background: #25d366; }
.dueseweb-modern .dw-share-tile-email    { background: #f59e0b; }
.dueseweb-modern .dw-share-tile-facebook { background: #1877f2; }
.dueseweb-modern .dw-share-tile-linkedin { background: #0a66c2; }
.dueseweb-modern .dw-share-tile-copy     { background: rgba(3, 19, 33, 0.75); }
.dueseweb-modern .dw-share-tile-label {
    line-height: 1.2;
    text-align: center;
}
.dueseweb-modern .dw-share-tile.is-copied .dw-share-tile-icon {
    background: #22c55e;
}

/* iOS-style cancel button */
.dueseweb-modern .dw-share-sheet-cancel {
    display: block;
    width: 100%;
    margin-top: 8px;
    padding: 14px;
    background: rgba(3, 19, 33, 0.04);
    border: none;
    border-radius: 12px;
    color: var(--dw-terracotta);
    font-family: var(--dw-font-sans);
    font-size: 1rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.15s ease;
}
.dueseweb-modern .dw-share-sheet-cancel:hover,
.dueseweb-modern .dw-share-sheet-cancel:focus-visible {
    background: rgba(3, 19, 33, 0.08);
}

/* Mobile: clear the fixed sticky bar so the share button is reachable */
@media (max-width: 959px) {
    .dueseweb-modern .dw-share {
        margin-bottom: calc(88px + env(safe-area-inset-bottom, 0px)) !important;
    }
}

/* ===== Social follow (footer) — circular brand-colored tiles ===== */
.dueseweb-modern .dw-social-follow {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: var(--dw-sp-3);
    flex-wrap: wrap;
    padding: var(--dw-sp-4) var(--dw-sp-4);
    background: rgba(3, 19, 33, 0.35);
    border-top: 1px solid rgba(255, 220, 184, 0.08);
    font-family: var(--dw-font-sans);
}
.dueseweb-modern .dw-social-follow-label {
    color: var(--dw-muted);
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.7rem;
    font-weight: 500;
}
.dueseweb-modern .dw-social-follow-links {
    display: flex;
    gap: 10px;
}
.dueseweb-modern .dw-social-follow-link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    transition: transform 0.2s var(--dw-ease), box-shadow 0.2s var(--dw-ease), filter 0.2s var(--dw-ease);
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
}
.dueseweb-modern .dw-social-follow-facebook { background: #1877f2; }
.dueseweb-modern .dw-social-follow-linkedin { background: #0a66c2; }
.dueseweb-modern .dw-social-follow-whatsapp { background: #25d366; }
/* WhatsApp contact group in the footer strip (2026-09-27). */
.dueseweb-modern .dw-social-follow-wa {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--dw-ink);
    font-size: 0.85rem;
    line-height: 1.35;
    text-align: left;
}
.dueseweb-modern .dw-social-follow-wa-text .dw-wa-hours-line { display: block; }
.dueseweb-modern a.dw-social-follow-wa-num {
    color: var(--dw-ink);
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 2px;
}
.dueseweb-modern a.dw-social-follow-wa-num:focus-visible,
.dueseweb-modern .dw-social-follow-whatsapp:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 3px;
}

.dueseweb-modern .dw-social-follow-link:hover,
.dueseweb-modern .dw-social-follow-link:focus-visible {
    color: #fff;
    text-decoration: none;
    transform: translateY(-2px) scale(1.08);
    box-shadow: 0 4px 14px rgba(0, 0, 0, 0.25);
    filter: brightness(1.08);
}

/* Mobile: add bottom margin so it clears the sticky bar */
@media (max-width: 959px) {
    .dueseweb-modern .dw-social-follow {
        padding: var(--dw-sp-3) var(--dw-sp-4);
        margin-bottom: calc(116px + env(safe-area-inset-bottom, 0px));
    }
}

/* ===== Share button — iOS-style floating tile (desktop + mobile) ===== */
/* Same visual everywhere: vertically-centered round tile on the right edge.
 * The inline trigger is no longer used. */
.dueseweb-modern .dw-share {
    display: block !important;
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
}
.dueseweb-modern .dw-share-trigger-inline {
    display: none !important;
}
.dueseweb-modern .dw-share-trigger-float {
    display: flex;
    position: fixed;
    right: 18px;
    top: 50%;
    transform: translateY(-50%);
    z-index: 10000;
    width: 56px;
    height: 56px;
    padding: 0;
    border-radius: 50%;
    background: var(--dw-terracotta-cta, #bf501c);
    border: none;
    color: #fff;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 18px rgba(0, 0, 0, 0.28), 0 2px 6px rgba(0, 0, 0, 0.15), inset 0 1px 0 rgba(255,255,255,0.18);
    transition: transform 0.2s var(--dw-ease), background 0.2s var(--dw-ease), box-shadow 0.2s var(--dw-ease);
}
.dueseweb-modern .dw-share-trigger-float:hover,
.dueseweb-modern .dw-share-trigger-float:focus-visible {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    transform: translateY(-50%) scale(1.08);
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.32), 0 3px 10px rgba(0, 0, 0, 0.18), inset 0 1px 0 rgba(255,255,255,0.22);
}
/* Sheet stays accessible even though .dw-share is display:block */
.dueseweb-modern .dw-share-sheet[hidden] {
    display: none !important;
}
@media (max-width: 600px) {
    .dueseweb-modern .dw-share-trigger-float {
        right: 14px;
        width: 52px;
        height: 52px;
    }
}


/* ===== Page feedback (iOS-style floating emoji pill — desktop + mobile) ===== */
/* Same vertical capsule on every viewport, sitting just below the Teilen FAB. */
.dueseweb-modern .dw-feedback {
    position: fixed;
    right: 18px;
    /* Sit below Teilen FAB: viewport-center + half-Teilen (28) + gap (16) */
    top: calc(50% + 44px);
    margin: 0 !important;
    padding: 0 !important;
    border: none !important;
    z-index: 10000;
}
.dueseweb-modern .dw-feedback[hidden] {
    display: none !important;
}
/* Vertical capsule: 👍/count above 👎/count, glassy white on dark theme */
.dueseweb-modern .dw-feedback-row {
    display: inline-flex;
    flex-direction: column;
    gap: 0;
    padding: 4px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(3, 19, 33, 0.12);
    border-radius: 28px;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18), 0 2px 6px rgba(0, 0, 0, 0.1), inset 0 1px 0 rgba(255,255,255,0.5);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    min-width: 56px;
    align-items: stretch;
}
.dueseweb-modern .dw-feedback-btn {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 2px;
    padding: 8px 10px;
    min-height: 48px;
    min-width: 48px;
    border-radius: 22px;
    background: transparent;
    border: none;
    color: rgba(3, 19, 33, 0.85);
    font-family: var(--dw-font-sans);
    font-weight: 500;
    cursor: pointer;
    transition: background 0.18s var(--dw-ease), transform 0.18s var(--dw-ease);
}
/* Subtle divider between 👍 and 👎 rows */
.dueseweb-modern .dw-feedback-up {
    border-bottom: 1px solid rgba(3, 19, 33, 0.08);
    border-radius: 22px 22px 6px 6px;
}
.dueseweb-modern .dw-feedback-down {
    border-radius: 6px 6px 22px 22px;
}
.dueseweb-modern .dw-feedback-btn:hover,
.dueseweb-modern .dw-feedback-btn:focus-visible {
    background: rgba(3, 19, 33, 0.08);
}
.dueseweb-modern .dw-feedback-btn:disabled {
    opacity: 0.5;
    cursor: not-allowed;
}
.dueseweb-modern .dw-feedback-btn.is-active {
    background: rgba(196, 120, 67, 0.12);
    color: var(--dw-terracotta);
    opacity: 1 !important;
    cursor: default;
}
.dueseweb-modern .dw-feedback-emoji {
    font-size: 1.5rem;
    line-height: 1;
    /* Apple color emoji fallback chain */
    font-family: 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
}
/* Vote counts intentionally hidden from users (per product decision:
   the 👍/👎 pill is a gesture, not a popularity contest). The span
   stays in the DOM so the submit-handler JS and analytics can still
   read + update the data-count attribute when a vote lands.
   No .dueseweb-modern ancestor prefix — 31-feedback.php emits the
   widget via wp_footer outside the themed content wrapper. */
.dw-feedback-count,
.dw-sr-only {
    position: absolute !important;
    width: 1px !important;
    height: 1px !important;
    padding: 0 !important;
    margin: -1px !important;
    overflow: hidden !important;
    clip: rect(0, 0, 0, 0) !important;
    white-space: nowrap !important;
    border: 0 !important;
}

/* Comment form — centered modal everywhere (matches the share sheet style) */
.dueseweb-modern .dw-feedback-comment {
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: calc(100% - 28px);
    max-width: 420px;
    z-index: 10001;
    padding: var(--dw-sp-5);
    background: #fff;
    border: 1px solid rgba(3, 19, 33, 0.1);
    border-radius: 18px;
    box-shadow: 0 12px 40px rgba(0, 0, 0, 0.28);
}
.dueseweb-modern .dw-feedback-comment[hidden] { display: none; }
.dueseweb-modern .dw-feedback-comment-label {
    display: block;
    font-family: var(--dw-font-sans);
    font-size: 0.9rem;
    font-weight: 500;
    color: rgba(3, 19, 33, 0.85);
    margin: 0 0 8px;
}
.dueseweb-modern .dw-feedback-comment textarea {
    width: 100%;
    box-sizing: border-box;
    padding: 10px 12px;
    border: 1px solid rgba(3, 19, 33, 0.2);
    border-radius: 10px;
    background: #fff;
    color: rgba(3, 19, 33, 0.9);
    font-family: var(--dw-font-sans);
    font-size: 0.95rem;
    line-height: 1.4;
    resize: vertical;
    min-height: 72px;
}
.dueseweb-modern .dw-feedback-comment textarea:focus {
    outline: none;
    border-color: var(--dw-terracotta);
    box-shadow: 0 0 0 3px rgba(196, 120, 67, 0.15);
}
.dueseweb-modern .dw-feedback-privacy-note {
    margin: 6px 0 10px;
    font-size: 0.75rem;
    color: rgba(3, 19, 33, 0.5);
    font-family: var(--dw-font-sans);
}
.dueseweb-modern .dw-feedback-comment-actions {
    display: flex;
    gap: 8px;
    justify-content: flex-end;
    margin-top: 10px;
}
.dueseweb-modern .dw-feedback-skip,
.dueseweb-modern .dw-feedback-send {
    padding: 9px 18px;
    border-radius: 10px;
    font-family: var(--dw-font-sans);
    font-size: 0.9rem;
    font-weight: 500;
    cursor: pointer;
    transition: background 0.15s var(--dw-ease);
    border: 1px solid transparent;
}
.dueseweb-modern .dw-feedback-skip {
    background: transparent;
    border-color: rgba(3, 19, 33, 0.2);
    color: rgba(3, 19, 33, 0.65);
}
.dueseweb-modern .dw-feedback-skip:hover {
    background: rgba(3, 19, 33, 0.05);
}
.dueseweb-modern .dw-feedback-send {
    background: var(--dw-terracotta-cta, #bf501c); /* WCAG AA white-on-orange (14.4px small text) */
    color: #fff;
    border: none;
}
.dueseweb-modern .dw-feedback-send:hover {
    background: var(--dw-terracotta-cta-hover, #a3431a);
}

/* Thank-you toast — small chip next to the FAB pill */
.dueseweb-modern .dw-feedback-thanks {
    position: fixed;
    right: 18px;
    top: calc(50% + 44px);
    transform: none;
    margin: 0;
    padding: 8px 12px;
    background: rgba(255, 255, 255, 0.95);
    border: 1px solid rgba(34, 197, 94, 0.4);
    border-radius: 999px;
    color: #16a34a;
    font-family: var(--dw-font-sans);
    font-size: 0.8rem;
    font-weight: 600;
    text-align: center;
    max-width: 220px;
    z-index: 10000;
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.18);
    transition: opacity 0.3s var(--dw-ease);
}
.dueseweb-modern .dw-feedback-thanks[hidden] { display: none; }

/* Mobile (<=600px): tighten the floating pill to keep it usable. */
@media (max-width: 600px) {
    .dueseweb-modern .dw-feedback,
    .dueseweb-modern .dw-feedback-thanks {
        right: 14px;
        top: calc(50% + 40px);
    }
    .dueseweb-modern .dw-feedback-row {
        min-width: 52px;
    }
    .dueseweb-modern .dw-feedback-btn {
        min-height: 44px;
        min-width: 44px;
    }
}

/* ===== Inline SVG icons inside CTA buttons + header phone ===== */
.dueseweb-modern .dw-cta .dw-cta-icon,
.dueseweb-modern .dw-cta-outline .dw-cta-icon,
.dueseweb-modern .dw-cta-secondary .dw-cta-icon{
    flex-shrink:0;
    margin-right:2px;
}
.dueseweb-modern #dw-header-phone svg{
    display:block;
}

/* ===== Apple-Weather-style card on clinic leaves =====
   Sits below "Lage" — current conditions + 3-day forecast.
   CI palette: navy/cream/sand glass with peach text and a soft
   accent halo behind the now-glyph that picks up the weather mood. */
.dueseweb-modern .dw-weather-card{
    margin: var(--dw-sp-5) 0;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    border-radius: 18px;
    color: var(--dw-ink);
    /* Glassy navy: two-stop translucent gradient over the page bg
       so the card feels lit-from-within. backdrop-filter blurs +
       saturates whatever sits behind the leaf for the proper Apple
       weather glass texture. */
    background:
        linear-gradient(135deg,
            rgba(12, 74, 120, 0.62) 0%,
            rgba(14, 53, 88, 0.62) 55%,
            rgba(6, 26, 44, 0.62)  100%);
    backdrop-filter: blur(18px) saturate(140%);
    -webkit-backdrop-filter: blur(18px) saturate(140%);
    /* Hairline peach-tinted border + soft shadow */
    border: 1px solid rgba(255, 220, 184, 0.14);
    box-shadow:
        0 16px 36px rgba(3, 19, 33, 0.45),
        0 2px 6px rgba(3, 19, 33, 0.25);
    position: relative;
    overflow: hidden;
    isolation: isolate;
}
/* Top inner highlight — the gloss line of the glass */
.dueseweb-modern .dw-weather-card::before{
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 50%;
    background: linear-gradient(180deg,
        rgba(255, 233, 211, 0.16) 0%,
        rgba(255, 233, 211, 0.04) 60%,
        transparent 100%);
    pointer-events: none;
    z-index: 0;
}
/* Mood accent: a soft radial halo behind the now-glyph picks up
   the current condition without painting the whole card. */
.dueseweb-modern .dw-weather-card::after{
    content: "";
    position: absolute;
    top: -20%;
    left: -10%;
    width: 360px;
    height: 360px;
    border-radius: 50%;
    background: radial-gradient(circle, var(--dw-mood, rgba(239, 108, 58, 0.28)) 0%, transparent 65%);
    filter: blur(14px);
    pointer-events: none;
    z-index: 0;
}
.dueseweb-modern .dw-weather-card--sunny  { --dw-mood: rgba(251, 191, 36, 0.34); }   /* eucalyptus amber */
.dueseweb-modern .dw-weather-card--cloudy { --dw-mood: rgba(253, 186, 116, 0.22); }  /* muted peach */
.dueseweb-modern .dw-weather-card--fog    { --dw-mood: rgba(255, 220, 184, 0.18); }  /* ink peach, dim */
.dueseweb-modern .dw-weather-card--rain   { --dw-mood: rgba(30, 92, 135, 0.42); }    /* deeper border-blue */
.dueseweb-modern .dw-weather-card--snow   { --dw-mood: rgba(255, 233, 211, 0.30); }  /* navy-soft cream */
.dueseweb-modern .dw-weather-card--storm  { --dw-mood: rgba(239, 108, 58, 0.30); }   /* terracotta */
.dueseweb-modern .dw-weather-card__h2{
    color: inherit !important;
    margin: 0 0 var(--dw-sp-2) !important;
    font-size: var(--dw-fs-base) !important;
    line-height: 1.2 !important;
    font-weight: 500;
    letter-spacing: 0.01em;
    opacity: 0.85;
}
.dueseweb-modern .dw-weather-card__inner{
    display: flex;
    flex-wrap: wrap;
    gap: var(--dw-sp-3);
    align-items: center;
    justify-content: space-between;
    position: relative;
    z-index: 1;
}
.dueseweb-modern .dw-weather-now{
    flex: 0 1 auto;
    display: flex;
    align-items: center;
    gap: var(--dw-sp-4);
}
.dueseweb-modern .dw-weather-now{ gap: var(--dw-sp-3); }
.dueseweb-modern .dw-weather-now__glyph{
    font-size: 2.6rem;
    line-height: 1;
    filter: drop-shadow(0 2px 4px rgba(0,0,0,0.18));
}
.dueseweb-modern .dw-weather-now__main{ min-width:0; line-height:1.15; }
.dueseweb-modern .dw-weather-now__temp{
    font-size: 2.8rem;
    font-weight: 200;
    line-height: 1;
    letter-spacing: -0.02em;
    font-feature-settings: "tnum" 1;
}
.dueseweb-modern .dw-weather-now__deg{
    font-weight: 200;
    opacity: 0.7;
    margin-left: 2px;
}
.dueseweb-modern .dw-weather-now__label{
    margin-top: 1px;
    font-size: var(--dw-fs-sm);
    opacity: 0.95;
}
.dueseweb-modern .dw-weather-now__sub{
    margin-top: 2px;
    font-size: 0.78rem;
    opacity: 0.75;
}
.dueseweb-modern .dw-weather-days{
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: var(--dw-sp-2);
}
.dueseweb-modern .dw-weather-day{
    background: rgba(255, 255, 255, 0.14);
    border-radius: 12px;
    padding: var(--dw-sp-2) var(--dw-sp-3);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 2px;
    min-width: 56px;
    backdrop-filter: blur(6px);
    -webkit-backdrop-filter: blur(6px);
    border: 1px solid rgba(255,255,255,0.10);
}
.dueseweb-modern .dw-weather-day--today{
    background: rgba(255, 255, 255, 0.22);
    border-color: rgba(255,255,255,0.28);
}
.dueseweb-modern .dw-weather-day__name{
    font-size: 0.78rem;
    font-weight: 500;
    opacity: 0.92;
}
.dueseweb-modern .dw-weather-day__glyph{
    font-size: 1.25rem;
    line-height: 1;
    filter: drop-shadow(0 1px 2px rgba(0,0,0,0.15));
}
.dueseweb-modern .dw-weather-day__rain{
    font-size: 0.68rem;
    opacity: 0.85;
}
.dueseweb-modern .dw-weather-day__temps{
    display: flex;
    gap: 5px;
    font-feature-settings: "tnum" 1;
    font-size: 0.85rem;
}
.dueseweb-modern .dw-weather-day__hi{ font-weight: 600; }
.dueseweb-modern .dw-weather-day__lo{ opacity: 0.7; }
.dueseweb-modern .dw-weather-card__foot{
    margin-top: var(--dw-sp-2);
    font-size: 0.66rem;
    opacity: 0.55;
    text-align: right;
    position: relative;
    z-index: 1;
}
@media (max-width: 720px){
    .dueseweb-modern .dw-weather-card{
        padding: var(--dw-sp-4);
    }
    .dueseweb-modern .dw-weather-card .dw-weather-card__h2{
        /* Override the section-h2 size on small screens so the
           card title doesn't wrap into a 3-line stack. */
        font-size: var(--dw-fs-lg) !important;
        line-height: var(--dw-lh-snug) !important;
        margin-bottom: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-weather-card__inner{
        flex-direction: column;
        align-items: stretch;
        gap: var(--dw-sp-4);
    }
    .dueseweb-modern .dw-weather-now{
        justify-content: flex-start;
        gap: var(--dw-sp-4);
    }
    .dueseweb-modern .dw-weather-days{
        width: 100%;
        justify-content: space-between;
        flex-wrap: nowrap;
        gap: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-weather-day{
        flex: 1 1 0;
        min-width: 0;
        padding: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-weather-day__name{ font-size: 0.78rem; }
    .dueseweb-modern .dw-weather-day__glyph{ font-size: 1.3rem; }
    .dueseweb-modern .dw-weather-day__temps{ font-size: 0.85rem; gap: 4px; }
    .dueseweb-modern .dw-weather-now__temp{ font-size: 3.6rem; }
    .dueseweb-modern .dw-weather-now__glyph{ font-size: 3.2rem; }
    .dueseweb-modern .dw-weather-card__foot{
        text-align: left;
    }
}

/* ===== "Das Zentrum" + "Dialyse im Überblick" glossy tile grid =====
   Both sections share the .dw-clinic-info-grid markup so they read as
   one design system. CI palette: navy glass tile + peach text +
   terracotta accent on the icon. */
.dueseweb-modern .dw-clinic-info{
    margin: var(--dw-sp-7) 0;
}
.dueseweb-modern .dw-clinic-info .dw-clinic-section-h2{
    color: var(--dw-ink);
    margin: 0 0 var(--dw-sp-4);
    font-weight: 500;
    letter-spacing: 0.005em;
}
.dueseweb-modern .dw-clinic-info-grid{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr));
    gap: var(--dw-sp-3);
    list-style: none;
    margin: 0;
    padding: 0;
}
.dueseweb-modern .dw-clinic-info-item{
    /* Glassy navy tile — translucent so the page bg shows through */
    background:
        linear-gradient(150deg,
            rgba(12, 74, 120, 0.55) 0%,
            rgba(14, 53, 88, 0.55) 60%,
            rgba(6, 26, 44, 0.55)  100%);
    backdrop-filter: blur(14px) saturate(135%);
    -webkit-backdrop-filter: blur(14px) saturate(135%);
    border: 1px solid rgba(255, 220, 184, 0.12);
    border-radius: 16px;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    display: flex;
    align-items: center;
    gap: var(--dw-sp-3);
    color: var(--dw-ink);
    box-shadow:
        0 6px 18px rgba(3, 19, 33, 0.32),
        0 1px 3px rgba(3, 19, 33, 0.18),
        inset 0 1px 0 rgba(255, 233, 211, 0.10); /* gloss highlight */
    position: relative;
    overflow: hidden;
    transition: transform 140ms ease, border-color 140ms ease, box-shadow 140ms ease;
}
.dueseweb-modern .dw-clinic-info-item::before{
    /* Soft peach top-left wash so each tile has the glass sheen */
    content: "";
    position: absolute;
    inset: 0 0 auto 0;
    height: 50%;
    background: linear-gradient(180deg, rgba(255, 233, 211, 0.10), transparent 100%);
    pointer-events: none;
}
.dueseweb-modern .dw-clinic-info-item:hover{
    border-color: rgba(255, 220, 184, 0.25);
    transform: translateY(-1px);
    box-shadow:
        0 10px 24px rgba(3, 19, 33, 0.40),
        0 2px 6px rgba(3, 19, 33, 0.22),
        inset 0 1px 0 rgba(255, 233, 211, 0.16);
}
.dueseweb-modern .dw-clinic-info-icon{
    flex: 0 0 40px;
    width: 40px;
    height: 40px;
    border-radius: 12px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 1.25rem;
    line-height: 1;
    /* Soft terracotta-tinted halo — picks up the brand accent without
       shouting. Stays inside the glass aesthetic. */
    background:
        radial-gradient(circle at 30% 30%,
            rgba(239, 108, 58, 0.32) 0%,
            rgba(239, 108, 58, 0.10) 60%,
            transparent 100%),
        rgba(255, 220, 184, 0.06);
    border: 1px solid rgba(255, 220, 184, 0.10);
    box-shadow: inset 0 1px 0 rgba(255, 233, 211, 0.18);
    position: relative;
    z-index: 1;
}
.dueseweb-modern .dw-clinic-info-body{
    display: flex;
    flex-direction: column;
    min-width: 0;
    line-height: 1.25;
    position: relative;
    z-index: 1;
}
.dueseweb-modern .dw-clinic-info-label{
    font-size: 0.78rem;
    font-weight: 500;
    color: var(--dw-muted);
    text-transform: uppercase;
    letter-spacing: 0.06em;
    margin-bottom: 2px;
}
.dueseweb-modern .dw-clinic-info-value{
    font-size: var(--dw-fs-base);
    color: var(--dw-ink);
    font-weight: 400;
    word-break: break-word;
}
.dueseweb-modern .dw-clinic-info-note{
    margin: var(--dw-sp-4) 0 0;
    padding: var(--dw-sp-3) var(--dw-sp-4);
    background: rgba(239, 108, 58, 0.10);
    border: 1px solid rgba(239, 108, 58, 0.30);
    border-radius: 14px;
    color: var(--dw-ink);
    display: flex;
    gap: var(--dw-sp-3);
    align-items: flex-start;
    font-size: var(--dw-fs-sm);
    line-height: 1.45;
}
.dueseweb-modern .dw-clinic-info-note-icon{
    font-size: 1.1rem;
    line-height: 1.4;
    flex-shrink: 0;
}
.dueseweb-modern .dw-clinic-info-note strong{
    color: var(--dw-muted);
    font-weight: 600;
    margin-right: 4px;
}
@media (max-width: 540px){
    .dueseweb-modern .dw-clinic-info-grid{
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 160px), 1fr));
        gap: var(--dw-sp-2);
    }
    .dueseweb-modern .dw-clinic-info-item{
        padding: var(--dw-sp-3);
        gap: var(--dw-sp-3);
    }
    .dueseweb-modern .dw-clinic-info-icon{
        flex-basis: 36px;
        width: 36px;
        height: 36px;
        font-size: 1.1rem;
    }
    .dueseweb-modern .dw-clinic-info-value{
        font-size: var(--dw-fs-sm);
    }
}

/* ===== "Über <City>" — magazine 2-column layout on desktop =====
   Card decoration (cream surface, terracotta border, quote-mark
   pseudo, drop-cap, orient/lead/p typography) lives in
   wp/mu-plugins/32-clinic-slider.php. This block only adds the
   2-column reflow: the existing rule capped paragraphs at 68ch
   which left the right half of the leaf container empty on desktop. */
.dueseweb-modern .dw-clinic-descriptions-columns{
    column-count: 1;
    column-gap: var(--dw-sp-6);
}
@media (min-width: 900px){
    .dueseweb-modern .dw-clinic-descriptions-columns{
        column-count: 2;
        column-rule: 1px solid rgba(255, 220, 184, 0.10);
    }
    .dueseweb-modern .dw-clinic-descriptions-columns .dw-clinic-descriptions-p{
        max-width: none;        /* override the 68ch cap inside columns */
        break-inside: avoid;    /* don't slice a paragraph mid-column */
        text-align: justify;
        text-justify: inter-word;
        hyphens: auto;
    }
}

/* ===== DACH traveller support pill (48a-traveller-support.php) ===== */
/* Bottom-right capsule: German patients abroad in partner countries.
 * Sits below the mid-edge Teilen/Feedback stack; clears mobile sticky CTA. */
.dueseweb-modern .dw-traveller-pill {
    position: fixed;
    right: max(12px, env(safe-area-inset-right, 0px));
    bottom: calc(16px + env(safe-area-inset-bottom, 0px));
    z-index: 9980;
    max-width: min(calc(100vw - 24px), 360px);
    font-family: var(--dw-font-sans);
}
@media (max-width: 959px) {
    .dueseweb-modern .dw-traveller-pill {
        bottom: calc(64px + env(safe-area-inset-bottom, 0px));
    }
}
.dueseweb-modern .dw-traveller-pill__btn {
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 10px 14px;
    margin: 0;
    border: none;
    border-radius: 14px;
    cursor: pointer;
    text-align: left;
    color: var(--dw-ink);
    background: rgba(3, 19, 33, 0.78);
    backdrop-filter: blur(14px);
    -webkit-backdrop-filter: blur(14px);
    border: 1px solid rgba(255, 220, 184, 0.22);
    box-shadow: 0 6px 22px rgba(0, 0, 0, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.06);
    transition: transform 0.2s var(--dw-ease), box-shadow 0.2s var(--dw-ease), border-color 0.2s var(--dw-ease);
}
.dueseweb-modern .dw-traveller-pill__btn:hover,
.dueseweb-modern .dw-traveller-pill__btn:focus-visible {
    transform: translateY(-1px);
    border-color: rgba(255, 220, 184, 0.38);
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    outline: none;
}
.dueseweb-modern .dw-traveller-pill__flag {
    font-size: 1.35rem;
    line-height: 1;
    flex-shrink: 0;
}
.dueseweb-modern .dw-traveller-pill__copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.dueseweb-modern .dw-traveller-pill__copy strong {
    font-size: clamp(0.88rem, 2.8vw, 0.98rem);
    font-weight: 600;
    line-height: 1.25;
}
.dueseweb-modern .dw-traveller-pill__copy span {
    font-size: 0.78rem;
    color: rgba(255, 220, 184, 0.72);
    font-weight: 500;
}
.dueseweb-modern .dw-traveller-card {
    padding: 0;
    border: none;
    border-radius: 18px;
    max-width: min(420px, calc(100vw - 20px));
    width: min(420px, calc(100vw - 20px));
    background: var(--dw-navy, #031321);
    color: var(--dw-ink, #ffdcb8);
    box-shadow: 0 18px 48px rgba(0, 0, 0, 0.45);
}
.dueseweb-modern .dw-traveller-card::backdrop {
    background: rgba(3, 19, 33, 0.55);
    backdrop-filter: blur(3px);
    -webkit-backdrop-filter: blur(3px);
}
.dueseweb-modern .dw-traveller-card__inner {
    position: relative;
    padding: var(--dw-sp-5) var(--dw-sp-5) calc(var(--dw-sp-5) + env(safe-area-inset-bottom, 0px));
}
.dueseweb-modern .dw-traveller-card__close {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 40px;
    height: 40px;
    border: none;
    border-radius: 10px;
    background: rgba(255, 255, 255, 0.06);
    color: var(--dw-ink);
    font-size: 1.35rem;
    line-height: 1;
    cursor: pointer;
    transition: background 0.15s var(--dw-ease);
}
.dueseweb-modern .dw-traveller-card__close:hover,
.dueseweb-modern .dw-traveller-card__close:focus-visible {
    background: rgba(255, 255, 255, 0.12);
    outline: none;
}
.dueseweb-modern .dw-traveller-card__head {
    padding-right: 44px;
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern .dw-traveller-card__flag {
    font-size: 1.75rem;
    display: block;
    margin-bottom: var(--dw-sp-2);
}
.dueseweb-modern .dw-traveller-card__title {
    font-family: var(--dw-font-display, Fraunces, serif);
    font-size: clamp(1.1rem, 3.5vw, 1.35rem);
    font-weight: 500;
    line-height: 1.35;
    margin: 0 0 var(--dw-sp-2);
    color: var(--dw-ink);
}
.dueseweb-modern .dw-traveller-card__sub {
    margin: 0;
    font-size: var(--dw-fs-sm);
    color: rgba(255, 220, 184, 0.78);
    line-height: 1.45;
}
.dueseweb-modern .dw-traveller-card__actions {
    display: flex;
    flex-direction: column;
    gap: var(--dw-sp-3);
    margin-bottom: var(--dw-sp-4);
}
.dueseweb-modern .dw-traveller-action {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 12px 14px;
    border-radius: 12px;
    text-decoration: none !important;
    color: var(--dw-ink) !important;
    background: rgba(255, 255, 255, 0.06);
    border: 1px solid rgba(255, 220, 184, 0.14);
    transition: background 0.15s var(--dw-ease), border-color 0.15s var(--dw-ease);
}
.dueseweb-modern .dw-traveller-action:hover,
.dueseweb-modern .dw-traveller-action:focus-visible {
    background: rgba(255, 255, 255, 0.1);
    border-color: rgba(255, 220, 184, 0.28);
    outline: none;
}
.dueseweb-modern .dw-traveller-action--primary {
    background: var(--dw-terracotta-cta, #bf501c);
    border-color: rgba(0, 0, 0, 0.12);
    color: #fff !important;
}
.dueseweb-modern .dw-traveller-action--primary:hover,
.dueseweb-modern .dw-traveller-action--primary:focus-visible {
    background: var(--dw-terracotta-cta-hover, #a3431a);
    border-color: rgba(0, 0, 0, 0.18);
}
.dueseweb-modern .dw-traveller-action__icon {
    font-size: 1.25rem;
    flex-shrink: 0;
    width: 2rem;
    text-align: center;
}
.dueseweb-modern .dw-traveller-action__copy {
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-width: 0;
}
.dueseweb-modern .dw-traveller-action__copy strong {
    font-size: 0.95rem;
    font-weight: 600;
}
.dueseweb-modern .dw-traveller-action__copy span {
    font-size: 0.82rem;
    opacity: 0.88;
}
.dueseweb-modern .dw-traveller-action--primary .dw-traveller-action__copy span {
    opacity: 0.95;
}
.dueseweb-modern .dw-traveller-card__foot {
    border-top: 1px solid rgba(255, 220, 184, 0.12);
    padding-top: var(--dw-sp-4);
    font-size: var(--dw-fs-sm);
}
.dueseweb-modern .dw-traveller-card__foot a {
    display: inline-block;
    margin-bottom: var(--dw-sp-2);
    font-weight: 600;
    color: var(--dw-terracotta) !important;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}
.dueseweb-modern .dw-traveller-card__foot small {
    display: block;
    color: rgba(255, 220, 184, 0.62);
    line-height: 1.4;
}
/* WhatsApp hours rule (2026-09-27): must be clearly readable, so full
   text colour instead of the faded footnote tone. */
.dueseweb-modern .dw-traveller-card__foot small.dw-traveller-card__wa-hours {
    color: var(--dw-ink);
    font-weight: 600;
}
@media (prefers-reduced-motion: reduce) {
    .dueseweb-modern .dw-traveller-pill__btn,
    .dueseweb-modern .dw-traveller-action {
        transition: none;
    }
    .dueseweb-modern .dw-traveller-pill__btn:hover {
        transform: none;
    }
}

/* === Patientenstimmen ===================================================
 * Homepage band + leaf section share these. Index page (Task 20) layers
 * its own grid variant on top.
 * Token reminder: --dw-cream is navy (#0e3558), --dw-ink is peach (#ffdcb8).
 */
.dw-pe-band {
  margin: var(--dw-sp-6, 48px) auto;
  padding: var(--dw-sp-5, 32px) var(--dw-sp-4, 24px);
  max-width: 1200px;
  /* I4: complementary translucent navy band — sits on the cream page
     background but tints toward the navy-cream cards inside it. */
  background: linear-gradient(180deg, rgba(14, 53, 88, 0.12),
                              rgba(6, 26, 44, 0.18));
  border: 1px solid rgba(239, 108, 58, 0.18);
  border-radius: 14px;
}
.dw-pe-band__title {
  margin: 0 0 var(--dw-sp-4, 24px);
  font-family: var(--dw-font-serif, Fraunces, Georgia, serif);
  /* !important: production's Customizer CSS forces h1–h7 to 38px. */
  font-size: clamp(1.3rem, 2.4vw, 1.7rem) !important;
  /* `--dw-cream` is navy on this theme — heading on the band's
     translucent navy stays navy = high contrast against the cream
     page bleed visible behind the rgba background. */
  color: var(--dw-cream, #0e3558);
  font-weight: 600;
}
.dw-pe-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--dw-sp-3, 16px);
}
@media (max-width: 720px) {
  .dw-pe-cards { grid-template-columns: 1fr; }
}
.dw-pe-card {
  /* I4: inverted-token-safe — translucent navy gradient card with
     peach text. Mirrors the homepage intro tile and /dokumente
     surfaces (per feedback_inverted_brand_tokens.md). */
  background: linear-gradient(150deg, rgba(12, 74, 120, 0.55),
                              rgba(14, 53, 88, 0.55), rgba(6, 26, 44, 0.55));
  color: var(--dw-ink, #ffdcb8);
  backdrop-filter: blur(14px) saturate(125%);
  -webkit-backdrop-filter: blur(14px) saturate(125%);
  border: 1px solid rgba(255, 220, 184, 0.12);
  border-radius: 10px;
  padding: var(--dw-sp-3, 16px);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.25);
  display: flex;
  flex-direction: column;
}
.dw-pe-card__photo {
  margin: calc(var(--dw-sp-3, 16px) * -1) calc(var(--dw-sp-3, 16px) * -1) var(--dw-sp-3, 16px);
  border-radius: 10px 10px 0 0;
  overflow: hidden;
  aspect-ratio: 4 / 3;
}
.dw-pe-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.dw-pe-card__quote {
  margin: 0 0 var(--dw-sp-2, 12px);
  font-style: italic;
  color: var(--dw-ink, #ffdcb8);
  font-size: 1rem;
  line-height: 1.5;
}
.dw-pe-card__caption {
  margin-top: auto;
  padding-top: var(--dw-sp-2, 12px);
  border-top: 1px solid rgba(255, 220, 184, 0.18);
  font-size: 0.85rem;
  color: rgba(255, 220, 184, 0.7);
  line-height: 1.4;
}
.dw-pe-card__caption-who {
  color: rgba(255, 220, 184, 0.92);
  font-weight: 600;
}
.dw-pe-card__caption-where {
  color: rgba(255, 220, 184, 0.65);
  font-size: 0.8rem;
  margin-top: 2px;
}
.dw-pe-more {
  display: inline-block;
  margin-top: var(--dw-sp-3, 16px);
  color: var(--dw-terracotta, #ef6c3a);
  font-weight: 600;
  text-decoration: none;
}
.dw-pe-more:hover { text-decoration: underline; }

/* === Patientenstimmen — index page ====================================== */
.dw-pe-index {
  max-width: 1200px;
  margin: 0 auto;
  padding: var(--dw-sp-5, 32px) var(--dw-sp-4, 24px);
}
.dw-pe-index__hero {
  text-align: center;
  margin-bottom: var(--dw-sp-5, 32px);
}
.dw-pe-index__hero h1 {
  font-family: var(--dw-font-serif, Fraunces, Georgia, serif);
  font-size: clamp(1.6rem, 4vw, 2.4rem);
  color: var(--dw-cream, #0e3558);
  margin: 0 0 var(--dw-sp-2, 12px);
}
.dw-pe-index__filter {
  text-align: center;
  margin-bottom: var(--dw-sp-4, 24px);
}
.dw-pe-cards--grid {
  grid-template-columns: repeat(3, 1fr);
}
@media (max-width: 980px) {
  .dw-pe-cards--grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 600px) {
  .dw-pe-cards--grid { grid-template-columns: 1fr; }
}
.dw-pe-index__pager {
  display: flex;
  gap: var(--dw-sp-2, 12px);
  justify-content: center;
  margin-top: var(--dw-sp-4, 24px);
  flex-wrap: wrap;
}
.dw-pe-page {
  padding: 6px 12px;
  border: 1px solid rgba(14, 53, 88, 0.15);
  border-radius: 6px;
  text-decoration: none;
  color: var(--dw-cream, #0e3558);
}
.dw-pe-page--current {
  background: var(--dw-cream, #0e3558);
  color: var(--dw-ink, #ffdcb8);
}
.dw-pe-index__empty {
  text-align: center;
  padding: var(--dw-sp-5, 32px);
  color: rgba(14, 53, 88, 0.6);
  font-style: italic;
}

/* === Patientenstimmen — per-centre key messages (2026-10-19) =============
 * Anonymous office-approved summaries; same navy/peach card shell as the
 * testimonials but upright text (not a quote) and a summary caption. */
.dw-pe-card__summary {
  margin: 0 0 var(--dw-sp-2, 12px);
  color: var(--dw-ink, #ffdcb8);
  font-size: 1.05rem;
  line-height: 1.55;
}
.dw-pe-card__caption-who a {
  color: inherit;
  text-decoration: underline;
  text-underline-offset: 2px;
}
.dw-pe-cards--single {
  grid-template-columns: 1fr;
  max-width: 760px;
}
.dw-pe-index__centres {
  margin-bottom: var(--dw-sp-5, 32px);
}
.dw-pe-index__note {
  margin: 0 0 var(--dw-sp-3, 16px);
  max-width: 760px;
  /* The index page body is navy: peach text (inverted tokens). */
  color: rgba(255, 220, 184, 0.82);
  line-height: 1.5;
}

/* === Patientenstimmen — photoviewer / lightbox =========================== */
/* Companion to dueseweb_pe_render_card() multi-photo support. The badge
   sits in the bottom-right of the hero photo when count > 1; click opens
   the fullscreen lightbox built lazily by the wp_footer JS in
   16a-patient-experience.php. */
.dw-pe-card__photo {
  position: relative;
}
.dw-pe-card__photo-more {
  position: absolute;
  bottom: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.65);
  color: #fff;
  border: 0;
  padding: 6px 12px;
  border-radius: 16px;
  font-size: 0.85rem;
  font-weight: 600;
  cursor: pointer;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  transition: background 0.15s;
}
.dw-pe-card__photo-more:hover {
  background: rgba(239, 108, 58, 0.9);
}

.dw-pe-lightbox {
  position: fixed;
  inset: 0;
  background: rgba(6, 26, 44, 0.95);
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s;
}
.dw-pe-lightbox.is-open {
  opacity: 1;
  pointer-events: auto;
}
.dw-pe-lightbox__img {
  max-width: 90vw;
  max-height: 85vh;
  object-fit: contain;
  border-radius: 8px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.5);
}
.dw-pe-lightbox__close,
.dw-pe-lightbox__prev,
.dw-pe-lightbox__next {
  position: absolute;
  background: rgba(255, 255, 255, 0.1);
  color: #fff;
  border: 0;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  font-size: 1.5rem;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.15s;
}
.dw-pe-lightbox__close:hover,
.dw-pe-lightbox__prev:hover,
.dw-pe-lightbox__next:hover {
  background: rgba(255, 255, 255, 0.25);
}
.dw-pe-lightbox__close { top: 16px; right: 16px; }
.dw-pe-lightbox__prev  { left: 16px; top: 50%; transform: translateY(-50%); }
.dw-pe-lightbox__next  { right: 16px; top: 50%; transform: translateY(-50%); }
.dw-pe-lightbox__counter {
  position: absolute;
  bottom: 16px;
  left: 50%;
  transform: translateX(-50%);
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.9rem;
  background: rgba(0, 0, 0, 0.4);
  padding: 4px 12px;
  border-radius: 12px;
}
@media (max-width: 600px) {
  .dw-pe-lightbox__prev, .dw-pe-lightbox__next { width: 40px; height: 40px; font-size: 1.3rem; }
}

/* App promotion footer link (41b-app-promotion.php, directly under .dw-social-follow) */
.dueseweb-modern .dw-footer-apps {
    padding: 0 var(--dw-sp-4) var(--dw-sp-4);
    background: rgba(3, 19, 33, 0.35);
    text-align: center;
    font-family: var(--dw-font-sans);
    font-size: 0.9rem;
}
.dueseweb-modern .dw-footer-apps a {
    color: var(--dw-ink, #ffdcb8);
    text-decoration: underline;
    text-underline-offset: 3px;
    display: inline-block;
    min-height: 24px;
    padding: 4px 2px;
}
.dueseweb-modern .dw-footer-apps a:focus-visible {
    outline: 3px solid #fff;
    outline-offset: 2px;
}

/* Stage 1: retain the established CI across legacy article templates. */
.dueseweb-modern .entry-content :is(h1,h2,h3,h4,h5,h6),
.dueseweb-modern .elementor-heading-title {
    font-family: var(--dw-font-serif) !important;
}
.dueseweb-modern .entry-content :is(p,li,label,input,select,textarea,button) {
    font-family: var(--dw-font-sans) !important;
}
/* Secondary floating controls must not sit above a blocking dialog. */
body.dueseweb-modern:is(.dw-visitor-gate-active,.dw-qr-on,.dw-share-open) .dw-share-trigger-float,
body.dueseweb-modern:is(.dw-visitor-gate-active,.dw-qr-on,.dw-share-open) .dw-feedback,
body.dueseweb-modern:has(.cmplz-cookiebanner:not(.cmplz-hidden):not(.cmplz-dismissed)) .dw-share-trigger-float,
body.dueseweb-modern:has(.cmplz-cookiebanner:not(.cmplz-hidden):not(.cmplz-dismissed)) .dw-feedback {
    visibility: hidden;
}
@media (max-width: 959px) {
    /* These widgets are emitted in wp_footer: keep them in document flow. */
    .dueseweb-modern .dw-share-trigger-float { display: none !important; }
    .dueseweb-modern .dw-share-trigger-inline {
        display: inline-flex !important;
        align-items: center;
        gap: .5rem;
        min-height: 48px;
        margin: 1rem;
        font-family: var(--dw-font-sans);
    }
    .dueseweb-modern .dw-feedback {
        position: static;
        margin: 0 1rem calc(140px + env(safe-area-inset-bottom, 0px)) !important;
    }
    .dueseweb-modern .dw-feedback-row { flex-direction: row; }
    .dueseweb-modern .dw-feedback-btn { border: 0; border-radius: 22px; }
    .dueseweb-modern .dw-seo-intro > nav:first-child {
        padding-top: 3.5rem;
    }
}

/* Approved Stage 2 refinement: existing layouts and CI. */
body.dueseweb-modern .dw-home-intro {
    border: 1px solid rgba(255,220,184,.25);
    background: linear-gradient(125deg,#173f60,#082435 85%);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.10),0 16px 40px rgba(0,0,0,.18);
    border-radius: 24px;
}
body.dueseweb-modern .dw-home-intro__headline { line-height: 1.2; }
body.dueseweb-modern .dw-home-intro p { line-height: 1.6; max-width: 58ch; }
body.dueseweb-modern .dw-mosaic-title { text-shadow: 0 2px 16px rgba(0,0,0,.7); }
body.dueseweb-modern :is(.dw-home-carousel-card,.dw-mosaic-tile) {
    border-radius: 20px;
    box-shadow: 0 10px 28px rgba(0,0,0,.22);
    border: 1px solid rgba(255,220,184,.20);
}
body.dueseweb-modern .dw-seo-intro {
    max-width: 900px;
    margin-inline: auto;
    line-height: 1.7;
}
body.dueseweb-modern .dw-seo-intro > h2 { line-height: 1.15; max-width: 24ch; }
body.dueseweb-modern .dw-seo-intro > p { max-width: 65ch; }
body.dueseweb-modern .dw-seo-photo {
    border-radius: 22px;
    box-shadow: 0 16px 40px rgba(0,0,0,.25);
    margin-block: 1.25rem;
}
body.dueseweb-modern .dw-seo-intro .dw-service-notice {
    background: linear-gradient(120deg,rgba(26,67,96,.75),rgba(10,35,53,.9));
    border: 1px solid rgba(255,220,184,.25);
    border-left: 4px solid #ffdcb8;
    border-radius: 16px;
    padding: 1.25rem;
    margin-block: 1.5rem;
}
body.dueseweb-modern .dw-seo-intro :is(a,button):focus-visible {
    outline: 3px solid #ffdcb8;
    outline-offset: 4px;
}
@media(max-width:600px) {
    body.dueseweb-modern .dw-home-intro { border-radius: 20px; }
    body.dueseweb-modern .dw-seo-intro > h2 { font-size: 2rem; }
    body.dueseweb-modern .dw-seo-intro .dw-service-notice { padding: 1rem; }
}

/* Stage 3: shared treatment for directories, trust pages and form entry. */
body.dueseweb-modern :is(.dw-seo-directory,.ap-hero,.kp-deep-cta,.dw-service-notice) {
    line-height: 1.65;
}
body.dueseweb-modern :is(.kp-channel,.kp-deep-cta,.ap-card,.dw-staff-card) {
    border: 1px solid rgba(255,220,184,.22);
    border-radius: 18px;
    background: linear-gradient(125deg,#173f60,#082435);
    color: var(--dw-ink);
    box-shadow: inset 0 1px 0 rgba(255,255,255,.08),0 8px 24px rgba(0,0,0,.15);
}
body.dueseweb-modern .dw-seo-directory li { padding-block: .5rem; }
body.dueseweb-modern .dw-seo-directory a { text-underline-offset: .2em; }
body.dueseweb-modern :is(.kp-faq-item,.dw-faq details) summary {
    min-height: 44px;
    padding-block: .75rem;
    cursor: pointer;
}
body.dueseweb-modern :is(.entry-content,.kp-form-section) :is(input,select,textarea):not([type=checkbox]):not([type=radio]):not([type=hidden]) {
    min-height: 44px;
    border-radius: 10px;
}
body.dueseweb-modern :is(.entry-content,.kp-form-section,.ap-hero) :is(a,button,input,select,textarea,summary):focus-visible {
    outline: 3px solid var(--dw-ink);
    outline-offset: 3px;
}
@media(prefers-reduced-motion:reduce) {
    body.dueseweb-modern :is(.kp-channel,.ap-card,.dw-staff-card) { transition: none; }
}
body.dueseweb-modern .kp-deep-cta .ap-btn-primary {
    background: var(--dw-terracotta-cta, #bf501c) !important;
    color: #fff !important;
    white-space: normal;
    text-align: center;
}
body.dueseweb-modern .kp-deep-cta .ap-btn-primary:hover {
    background: var(--dw-terracotta-cta-hover, #a3431a) !important;
}
@media(max-width:600px) {
    body.dueseweb-modern #main .kontakt-page-2026 .kp-deep-cta { padding: 16px; }
    body.dueseweb-modern #main .kontakt-page-2026 .kp-deep-cta h2 {
        font-size: 1.65rem !important;
        line-height: 1.25;
    }
}
@media(max-width:959px) {
    /* Trust-page introductions must clear the fixed logo and navigation. */
    body.dueseweb-modern .ap-hero { padding-top: 64px; }
}

/* Responsive delivery stage 1: useful phone width and compact contact access. */
@media(max-width:959px) {
 body.dueseweb-modern .dw-sticky-bar {flex-wrap:nowrap;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom,0px));}
 body.dueseweb-modern .dw-sticky-bar-btn {box-sizing:border-box;min-height:48px;padding:8px;font-size:14px;}
 .dw-sticky-contact {position:relative;flex:0 0 auto;}
 .dw-sticky-contact summary {display:flex;align-items:center;justify-content:center;min-height:48px;padding:0 10px;border:1px solid var(--dw-border);border-radius:12px;cursor:pointer;font-size:14px;}
 .dw-sticky-contact summary:focus-visible {outline:3px solid var(--dw-ink);outline-offset:2px;}
 .dw-sticky-contact-panel {position:absolute;right:0;bottom:calc(100% + 16px);width:min(300px,calc(100vw - 24px));box-sizing:border-box;padding:16px;background:var(--dw-cream);border:1px solid var(--dw-border);border-radius:16px;box-shadow:0 8px 28px #0006;}
 .dw-sticky-contact-panel .dw-sticky-bar-wa {margin-top:12px;}
 body.dueseweb-modern .dw-sticky-contact-panel p {margin:0;}
 body.dueseweb-modern #footer {padding-bottom:calc(80px + env(safe-area-inset-bottom,0px));}
}
@media(max-width:600px) {
 body.dueseweb-modern .dw-seo-directory {padding-inline:0;max-width:100%;}
 body.dueseweb-modern .dw-seo-directory .dw-seo-directory {margin-block:1rem;padding:0;}
 body.dueseweb-modern .dw-seo-directory p {margin-inline:0;max-width:none;}
 body.dueseweb-modern .dw-seo-directory ul {padding-inline:0;}
}

/* Responsive stage 3: centre overview and progressive destination directory. */
body.dueseweb-modern .dw-seo-overview {display:grid;grid-template-columns:minmax(0,1.2fr) minmax(280px,1fr);gap:24px;align-items:start;margin-block:20px;}
body.dueseweb-modern .dw-seo-summary {grid-column:2;grid-row:1;min-width:0;}
body.dueseweb-modern .dw-seo-overview > .dw-seo-photo {grid-column:1;grid-row:1;aspect-ratio:4/3;height:auto;max-height:440px;object-fit:cover;}
body.dueseweb-modern .dw-seo-summary .dw-service-notice {margin:0 0 16px;width:100%;max-width:none;padding:20px;}
body.dueseweb-modern .dw-seo-summary p {max-width:none;margin-inline:0;}
body.dueseweb-modern .dw-seo-description {max-width:72ch;}
body.dueseweb-modern .dw-directory-centres {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;}
body.dueseweb-modern .dw-directory-centres > li {padding:16px;border:1px solid var(--dw-border);border-radius:14px;background:var(--dw-cream);min-width:0;}
body.dueseweb-modern .dw-directory-centres a {display:block;min-height:44px;overflow-wrap:anywhere;}
body.dueseweb-modern .dw-directory-centres small {margin-top:8px;}
body.dueseweb-modern .dw-directory-controls label {display:block;max-width:520px;}
body.dueseweb-modern .dw-directory-search {display:block;width:100%;margin-top:8px;min-height:48px;font-size:16px;}
body.dueseweb-modern .dw-directory-more {min-height:48px;margin-block:16px;}
body.dueseweb-modern .dw-directory-count {margin-block:12px;}
body.dueseweb-modern .dw-directory-centres > [hidden],body.dueseweb-modern .dw-directory-controls[hidden],body.dueseweb-modern .dw-directory-more[hidden] {display:none!important;}
@media(max-width:1100px) {body.dueseweb-modern .dw-directory-centres {grid-template-columns:repeat(2,minmax(0,1fr));}}
@media(max-width:900px) {
 body.dueseweb-modern .dw-seo-overview {display:flex;flex-direction:column;gap:16px;}
 body.dueseweb-modern .dw-seo-summary {width:100%;}
 body.dueseweb-modern .dw-seo-overview > .dw-seo-photo {aspect-ratio:16/9;max-height:320px;}
}
@media(max-width:600px) {
 body.dueseweb-modern .dw-directory-centres {grid-template-columns:1fr;}
 body.dueseweb-modern .dw-seo-intro {padding-inline:0;}
 body.dueseweb-modern .dw-seo-summary .dw-service-notice {padding:16px;}
}
body.dueseweb-modern .dw-directory-search {background:var(--dw-cream);color:var(--dw-ink);border:1px solid var(--dw-border);padding:10px 12px;}
body.dueseweb-modern .dw-seo-button,body.dueseweb-modern .dw-directory-more {background:var(--dw-terracotta-cta);color:#fff!important;border:0;border-radius:12px;padding:12px 16px;}
body.dueseweb-modern .dw-seo-summary .dw-service-notice p {line-height:1.5;}
@media(max-width:600px) {
 body.dueseweb-modern .dw-seo-intro,body.dueseweb-modern section.dw-seo-directory {width:calc(100vw - 32px);max-width:none!important;margin-left:calc(50% - 50vw + 16px)!important;margin-right:0!important;padding-inline:0!important;}
}
body.dueseweb-modern .dw-seo-overview > .dw-seo-photo {margin:0;}
@media(max-width:600px) {
 body.dueseweb-modern .hentry:has(.dw-seo-intro),body.dueseweb-modern .hentry:has(section.dw-seo-directory) {overflow:visible;}
}

/* Responsive stage 4: retain the existing homepage and entry flows. */
body.dueseweb-modern .dw-home-carousel-as-hero {min-height:0!important;height:auto!important;}
body.dueseweb-modern .dw-home-intro__inner {gap:clamp(20px,3vw,40px);}
body.dueseweb-modern .dw-home-intro__copy {min-width:0;}
body.dueseweb-modern #main .dw-orp-card h2 {font-size:clamp(21px,2vw,28px)!important;line-height:1.25!important;overflow-wrap:normal;hyphens:auto;}
body.dueseweb-modern .dw-orp-card {min-width:0;padding:20px;}
body.dueseweb-modern #main .dw-wahl-online-h {font-size:clamp(24px,2.5vw,32px)!important;line-height:1.25!important;}
body.dueseweb-modern .dw-wahl-sub,body.dueseweb-modern .ap-hero-lede {max-width:65ch;}
body.dueseweb-modern .kp-form-card {max-width:760px;}
body.dueseweb-modern .kp-channel {min-width:0;}
body.dueseweb-modern .kp-channel-val {overflow-wrap:anywhere;}
body.dueseweb-modern :is(.dw-res-gate,.dw-orp,.kp-form-card) :is(input,select,textarea) {font-size:16px;}
body.dueseweb-modern .entry-content > p {max-width:72ch;}
@media(min-width:600px) and (max-width:959px) {
 body.dueseweb-modern .dw-home-carousel-as-hero {padding-top:64px!important;gap:16px!important;}
 body.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-header {gap:12px;padding-inline:20px;}
 body.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-tile {aspect-ratio:16/10;max-height:340px;max-width:560px;}
 body.dueseweb-modern .dw-home-carousel-heading-hero {font-size:clamp(28px,4vw,38px)!important;}
}
@media(min-width:960px) and (max-width:1199px) {
 body.dueseweb-modern .dw-mosaic-grid {aspect-ratio:2/1;}
 body.dueseweb-modern .dw-mosaic {padding-block:12px;}
}
@media(min-width:600px) and (max-width:1199px) {
 body.dueseweb-modern .dw-orp-cohort-grid {grid-template-columns:repeat(2,minmax(0,1fr));}
 body.dueseweb-modern .dw-wahl-panel {padding-block:24px;}
 body.dueseweb-modern .dw-wahl-card {padding:20px;}
 body.dueseweb-modern .kp-channel-grid {gap:12px;}
}
@media(max-width:599px) {
 body.dueseweb-modern .dw-home-carousel-as-hero {padding-top:64px!important;gap:12px!important;}
 body.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-tile {aspect-ratio:4/3;max-height:340px;}
 body.dueseweb-modern .dw-home-intro__inner {padding:20px 16px;}
 body.dueseweb-modern #main .about-page-2026 {padding-inline:0;}
 body.dueseweb-modern #main .about-page-2026 :is(.ap-hero,.kp-form-card,.kp-wa,.kp-deep-cta) {padding-inline:16px;}
 body.dueseweb-modern #main .about-page-2026 .ap-hero-lede {font-size:17px;line-height:1.55;}
 body.dueseweb-modern .dw-orp-card {padding:16px;gap:8px;}
 body.dueseweb-modern .dw-wahl-panel {padding-inline:0;}
 body.dueseweb-modern .dw-wahl-card {padding:16px;}
 body.dueseweb-modern .dw-res-gate-inner {padding-inline:16px;}
}
body.dueseweb-modern .dw-orp-app {box-sizing:border-box;min-width:0;}
body.dueseweb-modern .dw-orp-hero {width:100%;max-width:65ch;min-width:0;}
body.dueseweb-modern #main .dw-orp-hero h1 {font-size:clamp(26px,3vw,38px)!important;line-height:1.2!important;margin:0!important;overflow-wrap:anywhere;}
@media(max-width:599px) {
 body.dueseweb-modern .dw-orp-app {padding-inline:0;min-height:0;}
 body.dueseweb-modern .dw-orp-cohort-grid {margin-top:12px;}
}
/* The theme may normalize embedded page headings from h1 to h2. */
body.dueseweb-modern #main .dw-orp-hero :is(h1,h2) {font-size:clamp(26px,3vw,38px)!important;line-height:1.2!important;margin:0!important;overflow-wrap:normal;hyphens:auto;}
@media(max-width:599px) {
 body.dueseweb-modern #main .about-page-2026 .ap-num {font-size:22px!important;line-height:1.3!important;}
 body.dueseweb-modern #main .about-page-2026 .ap-hero-motto {font-size:18px;line-height:1.5;}
}
/* 2026-10-22 (owner): the "Dialyseplatz anfragen" notice (12-map-markers.php),
   the explainer-video teaser, the 1-2-3 steps and the booking-safety note
   (page 839 content) stay on the first enquiry step only. On the contact gate
   and in the wizard they are not needed during the process and pushed the
   steps below the fold on desktop. Phones (<=600px) keep their own handling
   in phone-enquiry.css/.js, which still needs the nodes in the DOM. */
@media(min-width:601px) {
 body.dueseweb-modern:has(.dw-res-gate,#dw-reservation-wizard) :is(.dw-service-notice,.dw-expl-inline,.dw-three-step,.dw-booking-safety) {display:none!important;}
}
/* 2026-10-22 (owner): every desktop wizard step fits the window without
   scrolling (measured at 1920x947, 1440x789, 1366x657 and 1280x632 inner
   sizes). Before: the question started ~330px down and address, hotel,
   destination, insurance, medical and review pushed "Weiter" below the fold.
   Desktop wizard only (JS adds .dw-res-wizard--desktop at >=960px). The
   Customizer's h1-h7 {38px !important} needs the !important headings here. */
@media(min-width:960px) {
 /* Chrome above the step */
 body.dueseweb-modern:has(#dw-reservation-wizard) .dw-resform-hint {margin-bottom:0;padding-top:2px;padding-bottom:2px;}
 body.dueseweb-modern:has(#dw-reservation-wizard) .dw-form-shell {padding-top:10px;}
 /* Name and e-mail already head the sidebar (and the review summary) */
 body.dueseweb-modern:has(#dw-reservation-wizard) .dw-res-verified-banner {display:none;}
 .dueseweb-modern .dw-res-wizard.dw-res-wizard--desktop {min-height:0;padding-top:2px;padding-bottom:12px;}
 /* Help chip shares the progress row instead of taking its own line */
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-main {display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:12px;align-items:center;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-main > * {grid-column:1 / -1;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-main > .dw-res-progress {grid-column:1;grid-row:1;margin-bottom:8px;padding-top:4px;padding-bottom:4px;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-main > .dw-res-topbar {grid-column:2;grid-row:1;margin-bottom:8px;padding-bottom:0;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-progress-label {margin-top:3px;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-main .dw-res-card {padding-top:8px;}
 body.dueseweb-modern #main .dw-res-wizard--desktop .dw-res-question {font-size:clamp(24px,2vw,30px)!important;line-height:1.2!important;margin:0 0 10px!important;}
 body.dueseweb-modern #main .dw-res-wizard--desktop .dw-res-sidebar-title {font-size:20px!important;line-height:1.25!important;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-sidebar {max-height:calc(100dvh - 170px);}
 /* Address: Strasse|Nr, PLZ|Ort, Bundesland|Land instead of six stacked rows */
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));column-gap:16px;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card > * {grid-column:1 / -1;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card > .dw-res-field {margin-bottom:6px;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card > [data-field="strasse"] {grid-column:span 4;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card > :is([data-field="hausnr"],[data-field="plz"]) {grid-column:span 2;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card > [data-field="wohnort"] {grid-column:span 4;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="adresse"] .dw-res-card > :is([data-field="bundesland"],[data-field="land"]) {grid-column:span 3;}
 /* Destination with a carried-over choice: "Weiter mit <Ziel>" plus the search
    field; "Anderes Reiseziel wählen" removes the preset and brings back the
    popular destinations, the directory link and "Mein Reiseziel ist nicht dabei" */
 .dueseweb-modern .dw-res-wizard--desktop [data-field="destination"]:has(> .dw-res-preset) > :is(p,.dw-res-dest-pills,a,details) {display:none;}
 /* Suggestion lists: two columns, capped so the buttons stay in view */
 .dueseweb-modern .dw-res-wizard--desktop:is([data-screen="hotel"],[data-screen="destination"]) .dw-res-results {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;margin-top:8px;max-height:min(34vh,300px);align-content:start;}
 .dueseweb-modern .dw-res-wizard--desktop:is([data-screen="hotel"],[data-screen="destination"]) .dw-res-results > * {flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:2px;}
 .dueseweb-modern .dw-res-wizard--desktop:is([data-screen="hotel"],[data-screen="destination"]) .dw-res-results > * > * {text-align:left;}
 .dueseweb-modern .dw-res-wizard--desktop:is([data-screen="kasse"],[data-screen="zentrum"]) .dw-res-results {max-height:min(30vh,260px);margin-top:8px;gap:8px;}
 /* Review: the sidebar repeats the summary, so the summary takes the full
    width in three columns (label above value); remarks span all columns;
    submit and back share one row */
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-sidebar {display:none;}
 body.dueseweb-modern #main .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-question {margin-bottom:6px!important;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-summary {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:24px;margin-bottom:8px;padding:8px 14px;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-summary-row {display:flex;flex-direction:column;justify-content:flex-start;gap:0;padding-top:2px;padding-bottom:2px;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-summary-row:last-child {grid-column:1 / -1;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-summary-label {font-size:13px;line-height:1.3;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-summary-value {text-align:left;line-height:1.35;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-card > [data-field="datenschutz"] {margin-bottom:6px;}
 /* nothing is typed on the review, so the draft-saved line is not needed there */
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-save-status {display:none;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-card {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-auto-flow:row dense;column-gap:16px;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-card > * {grid-column:1 / -1;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-card > .dw-res-submit {grid-column:2;margin-top:0;min-height:48px;}
 .dueseweb-modern .dw-res-wizard--desktop[data-screen="confirm"] .dw-res-card > .dw-res-back {grid-column:1;align-self:center;margin-top:0;}
}
/* 2026-10-22 (owner): contact gate and wizard fit the desktop window. The
   page ended ~150px below the card (content, post and #forbottom padding)
   and the gate sat in a 616px column with the button at ~1000px. */
@media(min-width:960px) {
 body.dueseweb-modern:has(.dw-res-gate,#dw-reservation-wizard) #forbottom {padding-bottom:0;}
 body.dueseweb-modern:has(.dw-res-gate,#dw-reservation-wizard) .page.type-page {margin-bottom:0;}
 body.dueseweb-modern:has(.dw-res-gate,#dw-reservation-wizard) #main .entry-content {padding-top:24px!important;padding-bottom:0!important;}
 body.dueseweb-modern:has(.dw-res-gate,#dw-reservation-wizard) .dw-form-shell {margin-bottom:0;padding-bottom:8px;}
 .dueseweb-modern .dw-res-wizard.dw-res-wizard--desktop {padding-bottom:0;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-main .dw-res-card {padding-bottom:8px;}
 .dueseweb-modern .dw-res-wizard--desktop .dw-res-save-status {margin:4px 0 0;font-size:13px;line-height:1.3;}
 /* Resume prompt ("Sie haben eine angefangene Anfrage") renders before the
    wizard gets its desktop class */
 .dueseweb-modern .dw-res-wizard:has(> .dw-res-resume) {min-height:0;padding-top:12px;padding-bottom:12px;}
 body.dueseweb-modern #main .dw-res-wizard .dw-res-resume-title {font-size:clamp(24px,2vw,30px)!important;line-height:1.25!important;}
 /* Gate: full card width, intro on top, then two columns
    (Fuer wen / Name / Kanal | Nummer oder E-Mail / Einwilligung / Weiter) */
 body.dueseweb-modern .dw-form-shell .dw-res-gate {max-width:none;margin:0;padding:12px 28px 14px;text-align:left;}
 /* desktop-ergonomics.css keeps a 0.75fr column for the explanations hidden above */
 body.dueseweb-modern #main .dw-form-shell:has(>.dw-res-gate) {grid-template-columns:minmax(0,1fr);}
 body.dueseweb-modern #main .dw-form-shell:has(>.dw-res-gate) > .dw-res-gate {grid-column:1 / -1;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-inner {align-items:stretch;gap:8px;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-sub {max-width:none;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-flow:row dense;column-gap:32px;row-gap:10px;align-items:start;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form > * > *,
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-contact-actions > * {grid-column:2;margin-top:0;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-contact-role > .dw-res-gate-field,
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-contact-details > .dw-res-gate-field:first-child,
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-contact-details > .dw-res-gate-channel-row {grid-column:1;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-res-gate-cta {width:100%;}
 /* The invisible Turnstile slot goes left, so an error message sits beside
    the channel row instead of adding a row above the button */
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-contact-details > .dw-res-gate-contact-ts {grid-column:1;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-form .dw-res-gate-error {margin:0;}
 /* Direct online enquiry: the hint row above carries telephone + WhatsApp,
    so the gate's own "Keine E-Mail-Adresse?" line would repeat it; the
    booking caveat runs on one line */
 body.dueseweb-modern:has(.dw-resform-hint-wa) .dw-form-shell .dw-res-gate-no-email {display:none;}
 body.dueseweb-modern .dw-form-shell .dw-res-gate-caveat {max-width:none;}
 /* Country code and mobile number on one row (as on phones) */
 body.dueseweb-modern .dw-form-shell [data-dw-res-gate-phone-block]:not([hidden]) {display:grid;grid-template-columns:minmax(0,2fr) minmax(0,3fr);column-gap:12px;align-items:start;}
}
/* 2026-10-22: header at 960-1359px (iPad landscape, small laptops). The
   4-second "Menü" flash sat left of the menu button, exactly over the
   Kontakt button, on every page load; it now flashes below the button.
   The destination search pill was 180px and cut its placeholder to
   "Wo möchten S"; the team pill is hidden in this range, so there is room. */
@media(min-width:960px) and (max-width:1359px) {
 #dw-nav-toggle .dw-nav-tooltip {top:calc(100% + 6px);right:0;transform:none;animation-name:dw-nav-tooltip-flash-below;}
 body.dueseweb-modern .dw-desktop-banner-inner .dw-header-mapsearch {width:300px!important;}
}
@media(min-width:1100px) and (max-width:1359px) {
 body.dueseweb-modern .dw-desktop-banner-inner .dw-header-mapsearch {width:320px!important;}
}
@keyframes dw-nav-tooltip-flash-below {
 0%   {opacity:0;transform:translateY(-4px);}
 10%  {opacity:1;transform:none;}
 70%  {opacity:1;transform:none;}
 100% {opacity:0;transform:translateY(-4px);}
}
/* 2026-10-22 (owner: "declutter the desktop homepage"). Desktop only, home
   only, CSS only (nothing leaves the DOM, so phones and SEO text are
   unchanged and this is reverted by deleting the block). Before: 5818px at
   1440x789 (7.4 screens) with the destination search three times, the
   personal-contact promise four times and the explainer video three times. */
@media(min-width:960px) {
 /* Duplicates: the search band (header pill + map card search remain) and
    the intro (team pill, Kontakt, "Lieber persönlich besprechen", mosaic
    tile 1 and "Wir sind für Sie da" remain; the floating Erklärvideo pill
    keeps the video one click away). */
 body.home.dueseweb-modern .dw-desktop-mapsearch,
 body.home.dueseweb-modern .dw-home-intro {display:none!important;}
 /* Mosaic: the large tile plus four destinations; "Ich suche noch Ideen"
    leads to all of them. */
 body.home.dueseweb-modern .dw-mosaic-grid > .dw-mosaic-cell:nth-child(n+6) {display:none!important;}
 body.home.dueseweb-modern .dw-mosaic-grid {aspect-ratio:8 / 3!important;grid-template-rows:repeat(2,minmax(0,1fr))!important;}
 /* Calmer, shorter sections */
 body.home.dueseweb-modern :is(.dw-pe-band,.dw-process,.dw-quality,.dw-faq,.dw-final-cta) {padding-top:40px!important;padding-bottom:40px!important;margin-top:0!important;margin-bottom:0!important;}
 body.home.dueseweb-modern :is(.dw-process,.dw-quality,.dw-faq,.dw-final-cta) .dw-section-inner {padding-top:0!important;padding-bottom:0!important;}
 body.home.dueseweb-modern #main :is(.dw-process,.dw-quality,.dw-faq,.dw-final-cta) .dw-section-heading {font-size:clamp(26px,2.2vw,32px)!important;margin:0 0 20px!important;}
 body.home.dueseweb-modern .dw-process-step {padding-top:12px!important;padding-bottom:12px!important;}
 body.home.dueseweb-modern .dw-process-support {margin:12px auto!important;}
 body.home.dueseweb-modern .dw-quality .dw-section-subheading {max-width:980px!important;margin:0 auto 20px!important;}
 body.home.dueseweb-modern .dw-quality-grid {gap:16px!important;}
 body.home.dueseweb-modern .dw-quality-card {padding:18px 20px!important;}
 body.home.dueseweb-modern #main .dw-quality-card :is(h3,h4) {font-size:20px!important;margin:6px 0 6px!important;}
 /* FAQ: all 15 questions, in two columns; an opened answer stays in its column */
 body.home.dueseweb-modern .dw-faq .dw-section-inner {column-count:2;column-gap:24px;max-width:1160px;}
 body.home.dueseweb-modern .dw-faq .dw-section-heading {column-span:all;}
 body.home.dueseweb-modern .dw-faq-item {break-inside:avoid;width:auto!important;max-width:none!important;margin:0 0 10px!important;}
}
/* 2026-10-22 (owner: optimise the homepage for the elderly patient base).
   Desktop home only. A visible page headline (the existing H1 was
   mobile-only, the strip under the header was empty), the phone number near
   the top (22d-desktop-ergonomics.php), no text under 15px, larger link
   targets. The unsolicited QR overlay is off in 40-mobile-qr-handoff.php. */
@media(min-width:960px) {
 body.home.dueseweb-modern .dw-home-carousel-as-hero .dw-home-carousel-heading-hero.dw-mobile-only {display:block!important;margin:0 auto!important;padding-top:6px!important;padding-bottom:6px!important;font-size:clamp(28px,2.4vw,36px)!important;line-height:1.2!important;color:var(--dw-ink,#ffdcb8)!important;}
 body.home.dueseweb-modern .dw-home-carousel-as-hero {padding-top:72px!important;padding-bottom:4px!important;}
 body.home.dueseweb-modern .dw-desktop-entry {margin-top:8px!important;}
 body.home.dueseweb-modern .dw-desktop-entry__kicker,
 body.home.dueseweb-modern .dw-desktop-map__badge {font-size:15px!important;letter-spacing:.04em;}
 body.home.dueseweb-modern .dw-desktop-entry__phone {margin:0!important;font-size:18px;line-height:1.4;color:var(--dw-ink,#ffdcb8);white-space:nowrap;}
 body.home.dueseweb-modern .dw-desktop-entry__tel {font-size:21px;font-weight:700;color:var(--dw-ink,#ffdcb8)!important;text-decoration:underline;text-underline-offset:4px;padding:6px 2px;}
 body.home.dueseweb-modern .dw-desktop-entry__hours {display:block;font-size:15px;opacity:.9;text-align:right;}
 body.home.dueseweb-modern .dw-mosaic :is(.dw-occupancy-pill,.dw-mosaic-weather,.dw-mosaic-kicker) {font-size:15px!important;}
 body.home.dueseweb-modern .dw-mosaic .dw-mosaic-sub {font-size:15.5px!important;}
 body.home.dueseweb-modern .dw-pe-band .dw-occupancy-pill {font-size:15px!important;}
 body.home.dueseweb-modern .dw-pe-band .dw-pe-card__caption-where {font-size:15px!important;}
 body.home.dueseweb-modern .dw-pe-band .dw-pe-card a {font-size:16px!important;display:inline-block;padding:6px 0;}
 body.home.dueseweb-modern .dw-pe-band .dw-pe-more {font-size:17px!important;padding:8px 0;display:inline-block;}
}

/* [hidden] attribute trap: the theme's normalize sets `aside{display:block}`, which beats the UA
   [hidden] default. The clinic-leaf request card (22e-leaf-aside.php) is printed `hidden` so phones
   and tablets never show it; only desktop-autumn.css (>=960px) shows it, with a stronger selector. */
.dw-leaf-aside[hidden]{display:none}

/* Reisepartner-Zentrum (travel tier): the Taub button is quieter than the copper partner CTA —
   ivory ground, 2px olive border, olive ink, no fill. */
.dueseweb-modern .dw-clinic-btn.dw-clinic-btn--taub,
.dueseweb-modern .dw-clinic-cta-btn.dw-clinic-btn--taub {
    background: #fff4e4;
    border: 2px solid var(--dw-tier-travel);
    color: var(--dw-tier-travel-ink);
    box-shadow: none;
}
.dueseweb-modern .dw-clinic-btn.dw-clinic-btn--taub:is(:hover, :focus-visible),
.dueseweb-modern .dw-clinic-cta-btn.dw-clinic-btn--taub:is(:hover, :focus-visible) {
    background: #fff4e4;
    border-color: var(--dw-tier-travel-ink);
    color: var(--dw-tier-travel-ink);
    box-shadow: none;
}