:root {
    --ink: #162f4d;
    --graphite: #303a43;
    --muted: #63758b;
    --paper: #f7f8f5;
    --white: #ffffff;
    --line: rgba(33, 69, 100, .14);
    --gold: #c3944a;
    --shadow: 0 24px 70px rgba(36, 72, 101, .13);
    --serif: Georgia, "Times New Roman", serif;
    --sans: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font-family: var(--sans); line-height: 1.6; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.site-header { position: absolute; z-index: 10; top: 0; left: 0; right: 0; display: flex; align-items: center; justify-content: flex-start; padding: 20px clamp(24px, 5vw, 72px); }
.brand { display: inline-flex; align-items: center; gap: 15px; font-size: 18px; letter-spacing: .04em; font-weight: 700; white-space: nowrap; }
.brand-logo { width: 108px; height: 108px; display: block; object-fit: contain; filter: drop-shadow(0 7px 13px rgba(37,61,72,.16)); }
.brand-wordmark { width: 360px; height: 240px; display: block; object-fit: contain; filter: drop-shadow(0 7px 13px rgba(37,61,72,.16)); }
.primary-nav { display: flex; align-items: center; gap: clamp(16px, 2.4vw, 34px); margin-left: clamp(40px, 6vw, 96px); }
.primary-nav a { padding: 10px 14px; border-radius: 999px; color: #557185; font-size: 16.5px; letter-spacing: .1em; text-transform: uppercase; transition: color .25s ease, background .25s ease; }
.primary-nav a:hover, .primary-nav a:focus-visible { color: #225e70; background: rgba(56,126,146,.14); }
.section-anchor { height: 1px; scroll-margin-top: 24px; }
.brand-mark { position: relative; display: inline-block; width: 27px; height: 27px; border: 1px solid rgba(195,148,74,.7); border-radius: 50%; }
.brand-mark span { position: absolute; width: 4px; height: 4px; border-radius: 50%; background: var(--gold); }
.brand-mark span:nth-child(1) { left: 5px; top: 11px; }.brand-mark span:nth-child(2) { left: 12px; top: 5px; }.brand-mark span:nth-child(3) { left: 17px; top: 15px; }
.header-actions { display: flex; align-items: center; gap: 16px; }
.header-upload-link { padding: 10px 14px; border-radius: 999px; color: #387e92; font-size: 16px; letter-spacing: .08em; text-transform: uppercase; transition: color .25s ease, background .25s ease; }
.header-upload-link:hover, .header-upload-link:focus-visible { color: #225e70; background: rgba(56,126,146,.14); }
.header-cta, .outline-cta, .solid-cta { display: inline-flex; align-items: center; gap: 14px; border-radius: 999px; font-size: 12px; letter-spacing: .09em; text-transform: uppercase; transition: .3s ease; }
.header-cta { padding: 12px 18px; color: #fff; background: #387e92; box-shadow: 0 8px 24px rgba(56,126,146,.2); font-size: 18px; }.header-cta:hover, .header-cta:focus-visible { transform: translateY(-2px); background: #286a7e; }

.hero { position: relative; min-height: 790px; display: grid; grid-template-columns: minmax(290px, .75fr) minmax(560px, 1.25fr); align-items: center; gap: 0; overflow: hidden; padding: 108px clamp(24px, 5vw, 72px) 56px; background-image: linear-gradient(105deg, rgba(250,250,246,.98) 0%, rgba(247,249,246,.82) 36%, rgba(233,245,248,.47) 100%), url('../media/frequency-field-background.png'); background-size: cover; background-position: center; }
.hero::before, .hero::after { content: ""; position: absolute; pointer-events: none; width: 80%; height: 30%; left: -15%; bottom: 3%; border-top: 1px solid rgba(103,173,192,.13); border-radius: 50%; transform: rotate(-7deg); box-shadow: 0 -18px 0 rgba(103,173,192,.08), 0 -36px 0 rgba(103,173,192,.05); }
.hero::after { left: 52%; bottom: 4%; transform: rotate(9deg); opacity: .7; }
.hero-copy { position: relative; z-index: 3; max-width: 480px; padding-bottom: 18px; }
.eyebrow, .section-kicker, .segment-label { margin: 0 0 18px; color: var(--gold); font-size: 11px; letter-spacing: .18em; text-transform: uppercase; font-weight: 700; }
h1, h2, h3, p { margin-top: 0; }.hero h1 { max-width: 680px; margin-bottom: 24px; font-family: var(--serif); font-size: clamp(53px, 6.5vw, 96px); line-height: .98; font-weight: 400; letter-spacing: -.045em; }.hero-intro { max-width: 500px; margin-bottom: 18px; color: var(--muted); font-size: 18px; }.hero-support { max-width: 500px; margin-bottom: 34px; color: #456f7b; font-size: 11px; letter-spacing: .12em; text-transform: uppercase; font-weight: 700; }
.outline-cta { padding: 13px 20px; border: 1px solid rgba(195,148,74,.75); color: #a2742f; }.outline-cta:hover { color: #fff; background: var(--gold); transform: translateY(-2px); }

.network-stage { position: relative; z-index: 2; width: min(100%, 760px); aspect-ratio: 1 / .92; justify-self: end; }
.network-aura { position: absolute; inset: 8%; border-radius: 50%; background: radial-gradient(circle, rgba(255,255,255,.92) 0%, rgba(202,236,239,.3) 42%, transparent 70%); filter: blur(5px); animation: aura 8s ease-in-out infinite; }
.network-lines { position: absolute; inset: 0; width: 100%; height: 100%; overflow: visible; }.network-lines line { stroke: rgba(100,156,174,.37); stroke-width: 1.1; stroke-dasharray: 2 7; animation: dash 12s linear infinite; }.network-lines line.secondary { opacity: .45; stroke-dasharray: 1 9; }
.network-core { position: absolute; left: 50%; top: 50%; width: 190px; height: 190px; transform: translate(-50%, -50%); display: grid; place-items: center; border-radius: 50%; background: radial-gradient(circle at 35% 24%, rgba(255,255,255,.98) 0 7%, rgba(255,249,220,.92) 28%, rgba(236,196,106,.86) 72%, rgba(81,92,96,.48) 100%); border: 1px solid rgba(128,100,50,.55); box-shadow: inset 0 0 0 8px rgba(255,255,255,.24), inset -18px -20px 30px rgba(54,64,70,.16), 0 0 0 12px rgba(255,255,255,.46), 0 0 0 14px rgba(48,58,67,.12), 0 18px 60px rgba(69,79,83,.24); }
.network-core::before { content: ""; position: absolute; inset: 16px; border: 1px solid rgba(255,255,255,.72); border-radius: 50%; box-shadow: inset 0 0 22px rgba(255,255,255,.62); }
.network-core::after { content: ""; position: absolute; inset: -22px; border: 1px solid rgba(48,58,67,.38); border-right-color: transparent; border-bottom-color: rgba(195,148,74,.62); border-radius: 50%; transform: rotate(-28deg) scaleX(.78); animation: spin 24s linear infinite; }
.core-orbit { position: absolute; inset: 11px; border: 1px solid rgba(202,150,61,.42); border-radius: 50%; }.core-orbit-two { inset: -9px; border-color: rgba(48,58,67,.24); transform: rotate(55deg) scaleX(.72); }.core-label { position: relative; z-index: 1; color: #765526; font-family: var(--serif); font-size: 27px; text-transform: uppercase; letter-spacing: .02em; text-shadow: 0 1px 1px rgba(255,255,255,.7); }
.network-node { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); transition: left .75s cubic-bezier(.2,.8,.2,1), top .75s cubic-bezier(.2,.8,.2,1), transform .35s ease, z-index .1s; z-index: 3; }.network-node:hover, .network-node.is-active { z-index: 5; transform: translate(-50%, -50%) scale(1.08) translateY(-7px); }
.node-button { position: relative; isolation: isolate; overflow: hidden; width: 142px; height: 142px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; padding: 14px; border: 1px solid color-mix(in srgb, var(--node-color) 62%, var(--graphite)); border-radius: 50%; color: var(--ink); background: radial-gradient(circle at 28% 18%, rgba(255,255,255,.98) 0 7%, rgba(255,255,255,.55) 17%, transparent 31%), radial-gradient(circle at 67% 75%, color-mix(in srgb, var(--node-color) 65%, var(--graphite)) 0%, color-mix(in srgb, var(--node-color) 38%, white) 56%, rgba(255,255,255,.86) 100%); box-shadow: inset 10px 9px 18px rgba(255,255,255,.68), inset -16px -16px 24px rgba(48,58,67,.17), 0 0 0 4px rgba(255,255,255,.52), 0 0 0 5px rgba(48,58,67,.14), 0 15px 32px rgba(40,72,89,.18); cursor: pointer; transition: .35s ease; animation: float 7s ease-in-out infinite; animation-delay: var(--delay, 0s); }
.node-button::before { content: ""; position: absolute; inset: 9px; border: 1px solid rgba(255,255,255,.75); border-right-color: rgba(48,58,67,.24); border-radius: 50%; transform: rotate(28deg); pointer-events: none; }
.node-button::after { content: ""; position: absolute; top: 13%; left: 21%; width: 25%; height: 13%; border-radius: 50%; background: rgba(255,255,255,.74); filter: blur(3px); transform: rotate(-28deg); pointer-events: none; }
.node-button:hover, .node-button:focus-visible { outline: 2px solid color-mix(in srgb, var(--node-color) 70%, white); outline-offset: 6px; box-shadow: inset 10px 9px 18px rgba(255,255,255,.76), inset -16px -16px 24px rgba(48,58,67,.2), 0 0 0 5px rgba(255,255,255,.7), 0 0 0 7px color-mix(in srgb, var(--node-color) 65%, transparent), 0 20px 40px rgba(40,72,89,.25); }
.node-icon, .segment-icon, .method-icon { display: grid; place-items: center; }.node-icon { width: 35px; height: 35px; color: color-mix(in srgb, var(--node-color) 72%, #234966); }.node-icon svg, .segment-icon svg, .method-icon svg { width: 100%; height: 100%; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.node-title { max-width: 112px; text-align: center; font-size: 12px; line-height: 1.15; font-weight: 700; letter-spacing: .055em; text-transform: uppercase; }.method-node .node-button { width: 92px; height: 92px; gap: 4px; }.method-node .node-icon { width: 22px; height: 22px; }.method-node .node-title { font-size: 9px; max-width: 75px; }.tone-teal { --node-color: #6db9b0; }.tone-blue { --node-color: #72a9d3; }.tone-violet { --node-color: #a696d1; }.tone-coral { --node-color: #dda092; }.tone-lilac { --node-color: #9a9bd1; }.tone-aqua { --node-color: #79bfca; }.tone-indigo { --node-color: #8f86c9; }.tone-mint { --node-color: #91c5a9; }.tone-sky { --node-color: #83b8d2; }.tone-rose { --node-color: #d4a0b6; }.tone-graphite { --node-color: #697b80; }

.section-shell { width: min(1180px, calc(100% - 48px)); margin: 0 auto; }.philosophy { display: grid; grid-template-columns: .55fr 1.45fr; gap: 40px; padding-top: 135px; padding-bottom: 105px; }.philosophy h2, .section-heading h2, .contact h2 { max-width: 750px; margin-bottom: 22px; font-family: var(--serif); font-size: clamp(36px, 4.2vw, 59px); line-height: 1.05; font-weight: 400; letter-spacing: -.035em; }.philosophy p { max-width: 650px; color: var(--muted); font-size: 18px; }
.concept { padding-bottom: 135px; }.concept-heading { display: grid; grid-template-columns: .55fr 1.45fr; gap: 40px; align-items: end; }.concept-heading p { max-width: 720px; color: var(--muted); font-size: 18px; }.concept-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 52px; }.concept-card { min-height: 340px; padding: 30px; border: 1px solid color-mix(in srgb, var(--node-color) 42%, #526b78); border-radius: 28px; background: linear-gradient(145deg, color-mix(in srgb, var(--node-color) 20%, #eef1ef), color-mix(in srgb, var(--node-color) 34%, #c5d1d2)); box-shadow: 0 17px 44px rgba(30,58,75,.14); transition: transform .35s ease, box-shadow .35s ease; }.concept-card:hover { transform: translateY(-7px); box-shadow: 0 26px 58px rgba(30,58,75,.22); }.concept-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 62px; }.concept-icon { width: 54px; height: 54px; display: grid; place-items: center; border: 1px solid color-mix(in srgb, var(--node-color) 52%, #536a75); border-radius: 50%; color: color-mix(in srgb, var(--node-color) 82%, #173f55); background: rgba(255,255,255,.34); transition: transform .35s ease; }.concept-card:hover .concept-icon { transform: translateY(-4px) rotate(-5deg); }.concept-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.3; }.concept-number { color: color-mix(in srgb, var(--node-color) 72%, #3f5c6b); font-family: var(--serif); font-size: 25px; }.concept-card h3 { max-width: 320px; margin-bottom: 15px; color: #1b354b; font-family: var(--serif); font-size: clamp(27px, 2.3vw, 36px); line-height: 1.03; font-weight: 400; }.concept-card p { color: #405d70; font-size: 15px; line-height: 1.6; }
.environment { display: grid; grid-template-columns: .82fr 1.18fr; gap: 56px; margin-bottom: 135px; padding: 56px clamp(26px, 5vw, 70px); overflow: hidden; position: relative; border-radius: 34px; color: #f5f6f2; background: linear-gradient(115deg, #303a43 0%, #465b63 58%, #718b86 100%); box-shadow: 0 28px 80px rgba(38,54,61,.22); }.environment::after { content: ""; position: absolute; width: 430px; height: 430px; right: -150px; top: -210px; border: 1px solid rgba(255,255,255,.18); border-radius: 50%; box-shadow: 0 0 0 28px rgba(255,255,255,.06), 0 0 0 58px rgba(255,255,255,.035); pointer-events: none; }.environment-intro, .environment-detail { position: relative; z-index: 1; }.environment .section-kicker { color: #d9bb78; }.environment-heading-row { display: flex; align-items: center; gap: 20px; margin-bottom: 23px; }.environment h2 { max-width: 470px; margin: 0; font-family: var(--serif); font-size: clamp(37px, 4vw, 60px); line-height: .98; font-weight: 400; letter-spacing: -.04em; }.environment-icon { flex: 0 0 62px; width: 62px; height: 62px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; color: #e3c983; background: rgba(255,255,255,.08); }.environment-icon svg { width: 34px; height: 34px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.25; }.environment-teaser { max-width: 430px; color: rgba(255,255,255,.76); font-size: 17px; }.environment-content { max-width: 570px; color: rgba(255,255,255,.83); font-size: 16px; }.environment-content p { margin-bottom: 17px; }.environment-topics { margin-top: 28px; }.environment-topics li { color: rgba(255,255,255,.84); border-color: rgba(255,255,255,.26); }.light-cta { display: inline-flex; align-items: center; gap: 12px; margin-top: 22px; padding: 12px 17px; border: 1px solid rgba(227,201,131,.8); border-radius: 999px; color: #f4dfaa; font-size: 11px; letter-spacing: .1em; text-transform: uppercase; transition: .3s ease; }.light-cta:hover { color: var(--graphite); background: #f4dfaa; transform: translateY(-2px); }
.therapy-plan { padding-bottom: 135px; }.plan-heading { display: grid; grid-template-columns: .8fr 1.2fr; column-gap: 50px; align-items: end; }.plan-heading .section-kicker { grid-column: 1; align-self: start; }.plan-heading h2 { grid-column: 2; margin-bottom: 12px; }.plan-heading p { grid-column: 2; max-width: 660px; color: var(--muted); font-size: 17px; }.plan-steps { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 52px; }.plan-step { min-height: 235px; padding: 30px 26px; border: 1px solid color-mix(in srgb, var(--step-color) 28%, white); border-radius: 24px; background: linear-gradient(145deg, color-mix(in srgb, var(--step-color) 12%, white), color-mix(in srgb, var(--step-color) 28%, #eef2f0)); box-shadow: 0 14px 34px color-mix(in srgb, var(--step-color) 15%, transparent); transition: transform .3s ease, box-shadow .3s ease; }.plan-step:hover { transform: translateY(-6px); box-shadow: 0 22px 42px color-mix(in srgb, var(--step-color) 23%, transparent); }.plan-step-1 { --step-color: #6db9b0; }.plan-step-2 { --step-color: #72a9d3; }.plan-step-3 { --step-color: #a696d1; }.plan-step-4 { --step-color: #dda092; }.plan-step-icon { display: grid; place-items: center; width: 52px; height: 52px; margin-bottom: 42px; border: 1px solid color-mix(in srgb, var(--step-color) 48%, #496675); border-radius: 50%; color: color-mix(in srgb, var(--step-color) 80%, #234966); background: rgba(255,255,255,.48); }.plan-step-icon svg { width: 27px; height: 27px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.plan-step h3 { margin-bottom: 10px; color: #1b354b; font-family: var(--serif); font-size: 25px; line-height: 1.04; font-weight: 400; }.plan-step p { margin: 0; color: var(--muted); font-size: 14px; line-height: 1.5; }
.segments { padding-bottom: 130px; }.section-heading { margin-bottom: 50px; }.segment-list { display: grid; gap: 28px; }.segment-card { display: grid; grid-template-columns: 80px 74px minmax(0, 1fr); gap: 26px; padding: 46px clamp(24px, 5vw, 70px); border: 1px solid color-mix(in srgb, var(--node-color) 28%, white); border-radius: 30px; background: linear-gradient(135deg, rgba(255,255,255,.93), color-mix(in srgb, var(--node-color) 10%, white)); box-shadow: 0 15px 45px rgba(40,75,98,.07); scroll-margin-top: 35px; transition: transform .4s ease, box-shadow .4s ease; }.segment-card.is-active { transform: translateY(-4px); box-shadow: var(--shadow); }.segment-number { color: color-mix(in srgb, var(--node-color) 70%, #628092); font-family: var(--serif); font-size: 25px; }.segment-icon { width: 62px; height: 62px; color: color-mix(in srgb, var(--node-color) 80%, #2b5871); border: 1px solid color-mix(in srgb, var(--node-color) 45%, white); border-radius: 50%; background: rgba(255,255,255,.54); }.segment-label { margin-bottom: 8px; }.segment-card h3, .method-card h3 { margin-bottom: 8px; font-family: var(--serif); font-size: clamp(29px, 3vw, 43px); line-height: 1.05; font-weight: 400; }.segment-teaser { margin-bottom: 22px; color: #48647c; font-size: 17px; }.segment-content { max-width: 700px; color: var(--muted); }.segment-content p { margin-bottom: 14px; }.topic-list { display: flex; flex-wrap: wrap; gap: 8px; margin: 22px 0 0; padding: 0; list-style: none; }.topic-list li { padding: 6px 11px; border: 1px solid color-mix(in srgb, var(--node-color) 35%, white); border-radius: 999px; color: #557185; font-size: 11px; letter-spacing: .05em; }
.approach-groups { padding-bottom: 140px; }.approach-group + .approach-group { margin-top: 92px; }.approach-heading { margin-bottom: 30px; }.approach-heading .section-kicker { font-size: 22px; letter-spacing: .14em; line-height: 1; }.approach-card-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.approach-card { min-height: 265px; padding: 30px; border: 1px solid color-mix(in srgb, var(--node-color) 30%, white); border-radius: 26px; background: linear-gradient(145deg, color-mix(in srgb, var(--node-color) 10%, white), color-mix(in srgb, var(--node-color) 24%, #edf1ef)); box-shadow: 0 14px 38px color-mix(in srgb, var(--node-color) 13%, transparent); transition: transform .3s ease, box-shadow .3s ease; }.approach-card:hover { transform: translateY(-6px); box-shadow: 0 23px 48px color-mix(in srgb, var(--node-color) 22%, transparent); }.approach-card-icon { display: grid; place-items: center; width: 50px; height: 50px; margin-bottom: 34px; border: 1px solid color-mix(in srgb, var(--node-color) 46%, #506b78); border-radius: 50%; color: color-mix(in srgb, var(--node-color) 82%, #234966); background: rgba(255,255,255,.48); }.approach-card-icon svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.approach-card h3 { margin-bottom: 10px; color: #1b354b; font-family: var(--serif); font-size: 27px; line-height: 1.05; font-weight: 400; }.approach-card p { margin-bottom: 0; color: var(--muted); font-size: 14px; line-height: 1.55; }.approach-card-teaser { margin-bottom: 12px !important; color: #48647c !important; font-weight: 650; }.methods { padding-bottom: 140px; }.method-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; }.method-card { min-height: 250px; padding: 30px; border: 1px solid color-mix(in srgb, var(--node-color) 28%, white); border-radius: 24px; background: color-mix(in srgb, var(--node-color) 9%, white); scroll-margin-top: 35px; }.method-icon { width: 42px; height: 42px; margin-bottom: 30px; color: color-mix(in srgb, var(--node-color) 80%, #2b5871); }.method-card h3 { font-size: 30px; }.method-card p { color: var(--muted); }.text-link { margin-top: 12px; padding: 0; border: 0; color: #9c722e; background: none; font-size: 12px; letter-spacing: .1em; text-transform: uppercase; cursor: pointer; }
.drip-spa { padding-bottom: 135px; }.drip-heading { display: grid; grid-template-columns: .75fr 1.25fr; column-gap: 50px; align-items: end; }.drip-heading .section-kicker { grid-column: 1; align-self: start; }.drip-heading h2 { grid-column: 2; margin-bottom: 12px; }.drip-heading p { grid-column: 2; max-width: 650px; color: var(--muted); font-size: 17px; }.infusion-track { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(300px, 390px); gap: 18px; overflow-x: auto; margin-top: 52px; padding: 4px 4px 25px; scroll-snap-type: x mandatory; scrollbar-color: #6c9da2 transparent; }.infusion-card { min-height: 360px; padding: 30px; border: 1px solid color-mix(in srgb, var(--node-color) 32%, white); border-radius: 28px; background: linear-gradient(140deg, rgba(255,255,255,.94), color-mix(in srgb, var(--node-color) 13%, white)); box-shadow: 0 12px 35px rgba(40,75,98,.07); scroll-snap-align: start; }.infusion-card-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 48px; }.infusion-icon { width: 45px; height: 45px; display: grid; place-items: center; color: color-mix(in srgb, var(--node-color) 82%, #2b5871); border: 1px solid color-mix(in srgb, var(--node-color) 35%, white); border-radius: 50%; }.infusion-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.infusion-index { color: #6a8290; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; }.infusion-card h3, .package-card h3 { margin-bottom: 12px; font-family: var(--serif); font-size: 33px; line-height: 1; font-weight: 400; }.infusion-teaser { min-height: 52px; color: #48647c; font-size: 16px; }.ingredient-list, .package-list { display: flex; flex-wrap: wrap; gap: 7px; margin: 24px 0 20px; padding: 0; list-style: none; }.ingredient-list li { padding: 5px 9px; border-radius: 999px; color: #557185; background: rgba(255,255,255,.64); font-size: 10px; letter-spacing: .05em; }.infusion-content { color: var(--muted); font-size: 13px; }.packages { padding-bottom: 140px; }.packages-heading { display: grid; grid-template-columns: .75fr 1.25fr; column-gap: 50px; align-items: end; }.packages-heading .section-kicker { grid-column: 1; align-self: start; }.packages-heading h2 { grid-column: 2; margin-bottom: 12px; }.packages-heading p { grid-column: 2; max-width: 650px; color: var(--muted); font-size: 17px; }.package-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px; margin-top: 52px; }.package-card { min-height: 310px; padding: 25px; border-top: 3px solid var(--node-color); border-radius: 4px 4px 22px 22px; background: rgba(255,255,255,.8); box-shadow: 0 12px 35px rgba(40,75,98,.06); }.package-meta { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 52px; color: #6a8290; font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }.package-meta strong { color: #9b7537; white-space: nowrap; }.package-card h3 { font-size: 28px; }.package-card p { min-height: 69px; color: var(--muted); font-size: 14px; }.package-list { display: grid; gap: 8px; margin-top: 22px; }.package-list li { display: flex; gap: 7px; color: #557185; font-size: 12px; }.package-list li span { color: #9b7537; font-weight: 700; }
.contact { display: grid; grid-template-columns: 1.1fr .9fr; gap: 60px; align-items: end; padding: 100px 0 125px; border-top: 1px solid var(--line); }.contact-panel { padding: 30px; border-radius: 24px; background: rgba(224,240,241,.65); }.contact-portrait { display: block; width: 100%; height: 260px; margin: -30px -30px 28px; width: calc(100% + 60px); object-fit: cover; object-position: center 24%; border-radius: 24px 24px 0 0; }.contact-panel p { color: var(--muted); }.solid-cta { padding: 14px 21px; color: #fff; background: #347e91; }.solid-cta:hover { background: #225e70; transform: translateY(-2px); }
.site-footer { display: flex; justify-content: space-between; gap: 20px; padding: 30px clamp(24px, 5vw, 72px); border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }.site-footer strong { display: block; margin-bottom: 5px; color: var(--ink); }.footer-links { display: flex; gap: 20px; }.footer-links a:hover { color: var(--ink); }

.segment-card { grid-template-columns: 74px minmax(0, 1fr); }
@keyframes float { 0%,100% { translate: 0 0; } 50% { translate: 0 -5px; } } @keyframes aura { 0%,100% { transform: scale(.96); opacity: .8; } 50% { transform: scale(1.03); opacity: 1; } } @keyframes dash { to { stroke-dashoffset: -60; } } @keyframes spin { to { rotate: 360deg; } }
@media (max-width: 1050px) { .hero { grid-template-columns: .8fr 1.2fr; }.network-stage { transform: scale(.9); transform-origin: right center; width: 110%; margin-left: -8%; } }
@media (max-width: 800px) { .site-header { padding: 15px 20px; }.brand { font-size: 12px; }.brand-logo { width: 44px; height: 44px; }.header-actions { gap: 10px; }.header-upload-link { font-size: 9px; }.header-cta { padding: 10px 13px; font-size: 10px; }.hero { display: block; min-height: auto; padding: 128px 20px 25px; }.hero-copy { max-width: 560px; margin: 0 auto; }.hero h1 { font-size: clamp(48px, 12vw, 76px); }.network-stage { width: min(100%, 650px); margin: 16px auto 0; transform: none; }.philosophy { display: block; padding-top: 90px; padding-bottom: 80px; }.philosophy .section-kicker, .concept-heading .section-kicker { margin-bottom: 20px; }.concept { padding-bottom: 95px; }.concept-heading { display: block; }.concept-grid { grid-template-columns: repeat(2, 1fr); margin-top: 35px; }.concept-card { min-height: 300px; padding: 25px; }.concept-card-top { margin-bottom: 40px; }.environment { display: block; margin-bottom: 95px; padding: 38px 25px; }.environment-detail { margin-top: 40px; }.therapy-plan { padding-bottom: 95px; }.plan-heading, .drip-heading, .packages-heading { display: block; }.plan-heading p, .drip-heading p, .packages-heading p { margin-top: 20px; }.plan-steps { grid-template-columns: repeat(2, 1fr); margin-top: 35px; }.drip-spa, .packages { padding-bottom: 95px; }.infusion-track { margin-top: 35px; grid-auto-columns: minmax(280px, 82vw); }.package-grid { grid-template-columns: repeat(2, 1fr); margin-top: 35px; }.segment-card { grid-template-columns: 58px minmax(0, 1fr); gap: 16px; padding: 30px 22px; }.segment-icon { width: 52px; }.method-grid { grid-template-columns: 1fr; }.contact { display: block; padding: 75px 0 90px; }.contact-panel { margin-top: 30px; }.site-footer { flex-direction: column; }.footer-links { flex-wrap: wrap; } }
@media (max-width: 520px) { .brand { max-width: 190px; }.brand-logo { width: 38px; height: 38px; }.hero { padding-top: 112px; }.hero h1 { font-size: clamp(46px, 14vw, 70px); }.hero-support { font-size: 10px; line-height: 1.6; }.network-stage { aspect-ratio: 1 / 1.02; }.network-core { width: 132px; height: 132px; }.core-label { font-size: 19px; }.node-button { width: 104px; height: 104px; }.node-icon { width: 28px; height: 28px; }.node-title { font-size: 9px; max-width: 82px; }.method-node .node-button { width: 70px; height: 70px; }.method-node .node-title { font-size: 7px; max-width: 55px; }.concept-grid { grid-template-columns: 1fr; }.concept-card { min-height: auto; }.plan-steps, .package-grid { grid-template-columns: 1fr; }.plan-step { min-height: auto; }.package-card { min-height: auto; }.package-meta { margin-bottom: 34px; }.segment-card { grid-template-columns: 1fr; }.segment-icon { margin-bottom: 8px; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }

@media (max-width: 800px) {
    .approach-card-grid { grid-template-columns: 1fr; }
    .approach-group + .approach-group { margin-top: 70px; }
}

/* Keep the larger navigation legible by giving it room to breathe across two rows. */
.site-header > .primary-nav { flex-wrap: wrap; max-width: 590px; row-gap: 2px; column-gap: 10px; }
.site-header > .primary-nav a { padding: 8px 10px; white-space: nowrap; }
.site-header > .header-actions { flex-shrink: 0; }
@media (max-width: 800px) {
    .site-header > .primary-nav { flex: 0 1 300px; max-width: 300px; row-gap: 0; column-gap: 4px; }
    .site-header > .primary-nav a { padding: 6px 7px; }
    .site-header > .header-actions { flex-wrap: wrap; max-width: 180px; }
}

/* Give the contact image enough room to be seen as part of the invitation. */
.contact { grid-template-columns: .9fr 1.1fr; }
.contact-portrait { height: 585px; object-position: center 22%; }
@media (max-width: 800px) {
    .contact-portrait { height: 540px; }
}

@media (min-width: 801px) {
    /* Bring the oversized graph in from the right so it sits closer to the hero center. */
    .network-stage { right: clamp(34px, 7vw, 110px); }
}

.approach-card-preview { display: -webkit-box; max-height: 3.1em; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.approach-details { display: inline-flex; align-items: center; gap: 8px; margin-top: 18px; }
.approach-dialog { z-index: 1000; width: min(650px, calc(100% - 32px)); margin: auto; padding: 52px clamp(28px, 5vw, 58px) 44px; border: 1px solid rgba(65,119,134,.3); border-radius: 30px; color: var(--ink); background: linear-gradient(145deg, #f7faf6, #e1eff0); box-shadow: 0 30px 90px rgba(26,53,70,.3); }
.approach-dialog[open] { display: block; }.approach-dialog::backdrop { background: rgba(19,39,54,.58); backdrop-filter: blur(4px); }.approach-dialog-close { position: absolute; top: 14px; right: 18px; width: 36px; height: 36px; border: 0; border-radius: 50%; color: var(--ink); background: rgba(56,126,146,.12); font-size: 26px; line-height: 1; cursor: pointer; }.approach-dialog h2 { margin-bottom: 8px; font-family: var(--serif); font-size: clamp(34px, 5vw, 56px); line-height: 1; font-weight: 400; }.approach-dialog-teaser { margin-bottom: 20px; color: #9b7537; font-family: var(--serif); font-size: 22px; }.approach-dialog-content { color: #405d70; white-space: pre-line; }
.approach-dialog { background-image: linear-gradient(105deg, rgba(247,250,246,.96) 0%, rgba(247,250,246,.84) 52%, rgba(247,250,246,.55) 100%), var(--approach-dialog-image, none); background-position: center; background-size: cover; }
.section-divider { width: min(1180px, calc(100% - 48px)); display: flex; align-items: center; gap: 18px; margin: 42px auto; color: #387e92; }
.section-divider > span { height: 1px; flex: 1; background: linear-gradient(90deg, transparent, rgba(56,126,146,.22), transparent); }
.back-to-top { width: 34px; height: 34px; display: grid; place-items: center; padding: 0 0 2px; border: 1px solid rgba(56,126,146,.28); border-radius: 50%; color: #387e92; background: rgba(255,255,255,.42); font-size: 19px; line-height: 1; cursor: pointer; transition: color .25s ease, background .25s ease, transform .25s ease; }
.back-to-top:hover, .back-to-top:focus-visible { color: #fff; background: #387e92; transform: translateY(-2px); }
.back-to-top:focus-visible { outline: 2px solid #387e92; outline-offset: 3px; }
@media (max-width: 520px) { .section-divider { width: calc(100% - 32px); gap: 12px; }.back-to-top { width: 30px; height: 30px; font-size: 17px; } }
.contact { border-top: 0; }

@media (max-width: 800px) {
    .site-header { flex-wrap: wrap; }
    .brand-logo { width: 76px; height: 76px; }
    .brand-wordmark { width: 280px; height: 188px; }
    .brand { font-size: 14px; }
    .primary-nav { order: 3; width: 100%; justify-content: center; gap: 16px; margin: 10px 0 0; }
    .primary-nav a { font-size: 9px; }
    .header-actions { margin-left: auto; }
}

.functional-spectrum { padding: 20px 0 140px; }
.functional-spectrum-heading { max-width: 900px; margin: 0 auto 52px; text-align: center; }
.functional-spectrum-heading h2 { margin: 0; font-family: var(--serif); font-size: clamp(38px, 4.6vw, 64px); line-height: 1.02; font-weight: 400; letter-spacing: -.035em; }
.functional-spectrum-layout { display: grid; grid-template-columns: minmax(240px, .75fr) minmax(0, 1.7fr); gap: clamp(38px, 6vw, 88px); align-items: start; }
.functional-spectrum-intro { padding-top: 12px; color: var(--muted); font-size: 17px; }
.functional-spectrum-intro p { margin-bottom: 30px; }
.functional-accordion { display: grid; gap: 10px; }
.functional-accordion-item { overflow: hidden; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.62); box-shadow: 0 9px 26px rgba(40,75,98,.045); }
.functional-accordion-trigger { width: 100%; display: flex; align-items: center; gap: 16px; padding: 20px 22px; border: 0; color: var(--ink); background: transparent; text-align: left; font-size: 17px; font-weight: 750; cursor: pointer; }
.functional-accordion-trigger:hover, .functional-accordion-trigger:focus-visible { background: rgba(56,126,146,.09); }
.functional-accordion-trigger:focus-visible { outline: 2px solid #387e92; outline-offset: -3px; }
.functional-accordion-symbol { flex: 0 0 25px; color: #387e92; font-size: 27px; font-weight: 400; line-height: 1; text-align: center; }
.functional-accordion-panel { display: grid; grid-template-rows: 0fr; transition: grid-template-rows .4s ease; }
.functional-accordion-panel-inner { min-height: 0; overflow: hidden; padding: 0 22px 0 63px; color: var(--muted); font-size: 15px; line-height: 1.65; white-space: pre-line; }
.functional-accordion-item.is-open .functional-accordion-panel { grid-template-rows: 1fr; }
.functional-accordion-item.is-open .functional-accordion-panel-inner { padding-bottom: 22px; }
@media (max-width: 800px) {
    .functional-spectrum { padding-bottom: 95px; }
    .functional-spectrum-heading { margin-bottom: 34px; text-align: left; }
    .functional-spectrum-layout { grid-template-columns: 1fr; gap: 34px; }
    .functional-spectrum-intro { padding-top: 0; }
}
@media (prefers-reduced-motion: reduce) {
    .functional-accordion-panel { transition: none; }
}

@media (max-width: 520px) {
    .brand-logo { width: 58px; height: 58px; }
    .brand-wordmark { width: 224px; height: 150px; }
    .brand { font-size: 12px; }
    .primary-nav { gap: 9px; }
    .primary-nav a { font-size: 8px; letter-spacing: .06em; }
}

@media (min-width: 801px) {
    .site-header { align-items: flex-start; padding: 0; }
    .site-header .brand { order: 1; margin-left: 0; transform: translate(0, 0); }
    .primary-nav { order: 2; align-self: flex-start; margin-top: 12px; margin-left: auto; }
    .header-actions { order: 3; align-self: flex-start; margin-top: 8px; margin-left: clamp(20px, 3vw, 48px); }
    .hero { padding-top: 270px; }
}

@media (max-width: 800px) {
    .site-header { align-items: flex-start; }
    .primary-nav { order: 1; align-self: flex-start; width: auto; margin: 8px 0 0 12px; }
    .header-actions { order: 2; align-self: flex-start; margin-top: 4px; }
    .header-upload-link { font-size: 13.5px; }
    .header-cta { font-size: 15px; }
    .primary-nav a { font-size: 13.5px; }
    .site-header .brand { order: 3; margin-left: auto; }
    .hero { padding-top: 220px; }
}

@media (max-width: 520px) {
    .hero { padding-top: 190px; }
    .header-upload-link { font-size: 12px; }
    .header-cta { font-size: 13.5px; }
    .primary-nav a { font-size: 12px; }
}

/* The hero headline is intentionally half its former display size. */
.hero h1 { font-size: clamp(26.5px, 3.25vw, 48px); }
@media (max-width: 800px) { .hero h1 { font-size: clamp(24px, 6vw, 38px); } }
@media (max-width: 520px) { .hero h1 { font-size: clamp(23px, 7vw, 35px); } }

.philosophy { width: 100%; max-width: none; padding-left: max(24px, calc((100% - 1180px) / 2)); padding-right: max(24px, calc((100% - 1180px) / 2)); color: #f1f4f0; background: linear-gradient(118deg, #263b4d 0%, #354f60 54%, #405f68 100%); }
.philosophy .section-kicker { color: #d9bb78; }
.philosophy .section-kicker { font-size: 22px; letter-spacing: .14em; line-height: 1; }
.philosophy h2 { color: #f4f5ef; }
.philosophy h2 { font-size: clamp(28px, 2.6vw, 38px); }
.philosophy p { color: rgba(241,244,240,.78); }
.plan-heading .section-kicker { font-size: 22px; letter-spacing: .14em; line-height: 1; }
.plan-heading h2 { font-size: clamp(28px, 2.6vw, 38px); }
.segments .section-kicker { font-size: 22px; letter-spacing: .14em; line-height: 1; }
.contact .section-kicker { font-size: 22px; letter-spacing: .14em; line-height: 1; }
.topic-list li { cursor: default; transition: color .2s ease, background-color .2s ease, border-color .2s ease, transform .2s ease; }
.topic-list li:hover { color: #fff; border-color: color-mix(in srgb, var(--node-color) 76%, #183b50); background: color-mix(in srgb, var(--node-color) 72%, #183b50); font-weight: 700; transform: translateY(-2px); }
.environment-offer-card .topic-list li:hover { color: #fff; border-color: #d9bb78; background: #d9bb78; }
@media (max-width: 800px) { .philosophy { padding-left: 24px; padding-right: 24px; } }
@media (max-width: 520px) { .philosophy { padding-left: 20px; padding-right: 20px; } }

.core-logo { position: relative; z-index: 1; width: 148px; height: 148px; object-fit: contain; filter: drop-shadow(0 5px 8px rgba(38,58,65,.2)); }
.network-core { cursor: grab; touch-action: none; }
.network-core.is-dragging { cursor: grabbing; }
.network-lines line.network-link { stroke: rgba(78,130,148,.3); stroke-width: 1; stroke-dasharray: 3 8; opacity: .75; }
.network-lines line.cross-link { stroke: rgba(195,148,74,.28); stroke-width: 1.2; stroke-dasharray: 2 9; opacity: .8; }
.node-button { animation-duration: 5.5s; }
.network-node.is-dragging { z-index: 8; transition: none; }
.network-node.is-dragging .node-button { cursor: grabbing; animation: none; }
.node-button { touch-action: none; }
@keyframes float { 0%, 100% { translate: 0 0; rotate: -1deg; } 35% { translate: 1px -5px; rotate: 1deg; } 68% { translate: -1px -8px; rotate: -.5deg; } }

.network-stage { width: min(100%, 860px); aspect-ratio: 1 / .98; }
.network-core { z-index: 2; }
.network-lines { z-index: 1; }
.network-lines line { stroke: rgba(55,112,134,.66); stroke-width: 1.7; stroke-dasharray: 4 6; }
.network-lines line.network-link { stroke: rgba(55,112,134,.58); stroke-width: 1.55; opacity: .9; }
.network-lines line.cross-link { stroke: rgba(172,126,48,.62); stroke-width: 1.8; opacity: .95; }
.network-lines line.molecule-link { stroke: rgba(137,87,157,.82); stroke-width: 2.4; stroke-dasharray: 5 4; opacity: 1; }
.network-node, .node-button { pointer-events: auto; }
.chemical-node { z-index: 6; }
.chemical-node .node-button { width: 70px; height: 70px; gap: 2px; padding: 6px; border-color: rgba(81,94,112,.72); background: radial-gradient(circle at 30% 20%, rgba(255,255,255,.95), rgba(199,216,227,.9) 42%, rgba(103,129,145,.92)); box-shadow: inset 0 0 0 4px rgba(255,255,255,.24), 0 8px 20px rgba(39,62,76,.25); }
.chemical-node .node-icon { width: 21px; height: 21px; color: #284c62; }
.chemical-node .node-title { max-width: 58px; color: #183b50; font-size: 8px; line-height: 1.05; }
.atomic-field { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.atomic-orbit { position: absolute; left: 50%; top: 50%; display: block; border: 1px solid rgba(83,139,151,.44); border-radius: 50%; transform: translate(-50%, -50%) rotate(-18deg); box-shadow: 0 0 0 1px rgba(195,148,74,.1); animation: orbit-spin 24s linear infinite; }
.orbit-one { width: 40%; height: 28%; animation-duration: 18s; }
.orbit-two { width: 59%; height: 40%; border-color: rgba(195,148,74,.42); transform: translate(-50%, -50%) rotate(42deg); animation-duration: 29s; animation-direction: reverse; }
.orbit-three { width: 79%; height: 53%; border-color: rgba(83,139,151,.34); transform: translate(-50%, -50%) rotate(-52deg); animation-duration: 38s; }
.particle { position: absolute; display: block; width: 13px; height: 13px; border-radius: 50%; box-shadow: 0 2px 8px rgba(38,58,65,.28); }
.electron { left: 50%; top: -7px; background: #4d9cad; box-shadow: 0 0 0 3px rgba(77,156,173,.14), 0 2px 8px rgba(38,58,65,.3); }
.proton { right: 14%; bottom: 10%; width: 16px; height: 16px; background: #c3944a; }
.neutron { left: 13%; bottom: 22%; width: 15px; height: 15px; background: #52616a; }
.proton::after, .electron::after { position: absolute; inset: 0; display: grid; place-items: center; color: #fff; font-family: var(--sans); font-size: 10px; font-style: normal; font-weight: 800; line-height: 1; }
.proton::after { content: '+'; }
.electron::after { content: '−'; }
@keyframes orbit-spin { from { transform: translate(-50%, -50%) rotate(-18deg); } to { transform: translate(-50%, -50%) rotate(342deg); } }

@media (min-width: 801px) {
    .hero { overflow: visible; }
    .network-stage { position: absolute; top: 145px; right: clamp(0px, 2vw, 28px); width: min(68vw, 900px); z-index: 4; }
}
@media (max-width: 520px) { .chemical-node .node-button { width: 54px; height: 54px; }.chemical-node .node-icon { width: 16px; height: 16px; }.chemical-node .node-title { font-size: 6px; max-width: 45px; } }

.infusion-subtitle { min-height: 28px; margin: -4px 0 9px; color: #9b7537; font-family: var(--serif); font-size: 19px; line-height: 1.15; }
.infusion-content { min-height: 63px; }
.infusion-details { margin-top: 12px; cursor: pointer; }
.infusion-dialog { z-index: 1000; width: min(620px, calc(100% - 32px)); margin: auto; padding: 44px clamp(26px, 5vw, 54px) 40px; border: 1px solid rgba(65,119,134,.3); border-radius: 28px; color: var(--ink); background: #f5f8f5; box-shadow: 0 30px 90px rgba(26,53,70,.3); }
.infusion-dialog[open] { display: block; }
.infusion-dialog::backdrop { background: rgba(19,39,54,.56); backdrop-filter: blur(3px); }
.infusion-dialog-close { position: absolute; top: 12px; right: 18px; width: 34px; height: 34px; border: 0; border-radius: 50%; color: var(--ink); background: rgba(56,126,146,.12); font-size: 25px; line-height: 1; cursor: pointer; }
.infusion-dialog h2 { margin-bottom: 8px; font-family: var(--serif); font-size: clamp(32px, 5vw, 52px); line-height: 1; font-weight: 400; }
.infusion-dialog-subtitle { color: #9b7537; font-family: var(--serif); font-size: 22px; }
.infusion-dialog-content { color: #405d70; white-space: pre-line; }
.infusion-dialog-note { margin: 25px 0 0; padding-top: 18px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.infusion-carousel { position: relative; display: grid; grid-template-columns: 46px minmax(0, 1fr) 46px; align-items: center; gap: 10px; margin-top: 52px; }
.infusion-track { min-width: 0; margin-top: 0; padding-left: 4px; padding-right: 4px; scrollbar-width: thin; }
.infusion-scroll { width: 42px; height: 58px; display: grid; place-items: center; padding: 0; border: 0; color: #287d68; background: transparent; font-family: Arial, sans-serif; font-size: 42px; font-weight: 900; line-height: .8; cursor: pointer; transition: color .25s ease, transform .25s ease; }
.infusion-scroll:hover, .infusion-scroll:focus-visible { color: #145b4c; background: transparent; transform: scale(1.12); }
.drip-kicker { display: inline-flex; align-items: center; gap: 13px; align-self: start; color: #9b7537; font-size: 22px; font-weight: 800; letter-spacing: .14em; line-height: 1; text-transform: uppercase; }
.drip-kicker-icon { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(195,148,74,.58); border-radius: 14px; color: #9b7537; background: rgba(255,248,222,.64); }
.drip-kicker-icon svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }
.package-kicker { display: inline-flex; align-items: center; gap: 13px; align-self: start; color: #9b7537; font-size: 22px; font-weight: 800; letter-spacing: .14em; line-height: 1; text-transform: uppercase; }.package-kicker-icon { width: 46px; height: 46px; display: grid; place-items: center; border: 1px solid rgba(195,148,74,.58); border-radius: 14px; color: #9b7537; background: rgba(255,248,222,.64); }.package-kicker-icon svg { width: 29px; height: 29px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }
.drip-heading h2 { font-size: clamp(28px, 2.6vw, 38px); white-space: nowrap; }
.infusion-index { padding: 6px 10px; border: 1px solid rgba(195,148,74,.55); border-radius: 999px; color: #8d662c; background: rgba(255,248,222,.72); font-size: 13px; font-weight: 800; letter-spacing: .14em; }
.infusion-card { background: linear-gradient(140deg, rgba(231,241,239,.96), color-mix(in srgb, var(--node-color) 22%, #d9e5e5)); box-shadow: 0 15px 38px rgba(40,75,98,.13); }
.drip-spa { padding-top: 54px; padding-left: clamp(18px, 3vw, 42px); padding-right: clamp(18px, 3vw, 42px); border-radius: 34px; background: linear-gradient(135deg, rgba(220,234,233,.64), rgba(198,218,220,.42)); }
@media (max-width: 800px) { .infusion-carousel { grid-template-columns: 34px minmax(0, 1fr) 34px; gap: 5px; margin-top: 35px; }.infusion-scroll { width: 32px; height: 48px; font-size: 34px; }.drip-spa { padding-left: 14px; padding-right: 14px; }.drip-kicker { margin-bottom: 20px; font-size: 18px; }.drip-kicker-icon { width: 40px; height: 40px; }.drip-heading h2 { white-space: normal; } }
@media (max-width: 800px) { .package-kicker { margin-bottom: 20px; font-size: 18px; }.package-kicker-icon { width: 40px; height: 40px; } }

.environment-card { display: grid; grid-template-columns: 54px minmax(0, 1fr); gap: 18px; margin-top: 34px; padding: 25px; border: 1px solid rgba(255,255,255,.22); border-radius: 22px; background: rgba(19,42,55,.25); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 15px 35px rgba(22,35,42,.12); }
.environment-card-icon { width: 50px; height: 50px; display: grid; place-items: center; border: 1px solid rgba(227,201,131,.55); border-radius: 50%; color: #e3c983; background: rgba(255,255,255,.08); }
.environment-card-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.25; }
.environment-card-label { margin: 0 0 5px; color: #d9bb78; font-size: 10px; letter-spacing: .15em; text-transform: uppercase; }
.environment-card h3 { margin: 0 0 12px; color: #f5f6f2; font-family: var(--serif); font-size: clamp(27px, 3vw, 40px); line-height: 1; font-weight: 400; }
.environment-card-content { color: rgba(255,255,255,.78); font-size: 14px; }.environment-card-content p { margin-bottom: 11px; }.environment-card-topics { margin-top: 18px; }.environment-card-topics li { color: rgba(255,255,255,.8); border-color: rgba(255,255,255,.25); }
@media (max-width: 520px) { .environment-card { grid-template-columns: 1fr; gap: 13px; padding: 20px; }.environment-card-icon { width: 44px; height: 44px; }.environment-card-icon svg { width: 24px; height: 24px; } }
.environment-carousel { position: relative; display: grid; grid-template-columns: 38px minmax(0, 1fr) 38px; align-items: center; gap: 10px; min-width: 0; }
.environment-card-track { display: grid; grid-auto-flow: column; grid-auto-columns: 100%; gap: 18px; min-width: 0; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.5) transparent; }
.environment-offer-card { min-width: 0; min-height: 100%; padding: 30px; border: 1px solid rgba(255,255,255,.22); border-radius: 24px; background: rgba(19,42,55,.25); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 15px 35px rgba(22,35,42,.12); scroll-snap-align: start; }
.environment-offer-card.environment-detail { margin: 0; }.environment-offer-card .environment-content { max-width: none; }.environment-offer-card .environment-card-icon { margin-bottom: 18px; }
.environment-scroll { width: 34px; height: 52px; padding: 0 0 3px; border: 0; color: #d9bb78; background: transparent; font-family: Arial, sans-serif; font-size: 34px; font-weight: 900; line-height: .8; cursor: pointer; transition: color .25s ease, transform .25s ease; }.environment-scroll:hover, .environment-scroll:focus-visible { color: #fff1bf; background: transparent; transform: scale(1.12); }
@media (max-width: 800px) { .environment-carousel { grid-template-columns: 28px minmax(0, 1fr) 28px; gap: 5px; }.environment-offer-card { padding: 24px 20px; }.environment-scroll { width: 26px; font-size: 28px; } }
.environment { overflow: visible; background: transparent; box-shadow: none; }
.environment-intro { padding: 56px clamp(26px, 5vw, 70px); border-radius: 34px; background: linear-gradient(115deg, #303a43 0%, #465b63 58%, #718b86 100%); box-shadow: 0 28px 80px rgba(38,54,61,.22); }
.environment-offer-card { background: linear-gradient(140deg, #334d58 0%, #415f66 100%); box-shadow: 0 20px 48px rgba(28,47,56,.25); }
.environment-offer-heading { display: flex; align-items: center; gap: 18px; margin-bottom: 28px; }
.environment-offer-heading .environment-icon { flex: 0 0 54px; width: 54px; height: 54px; }
.environment-offer-heading h3 { margin: 0; color: #f5f6f2; font-family: var(--serif); font-size: clamp(28px, 3vw, 43px); line-height: 1; font-weight: 400; }
@media (max-width: 800px) { .environment-intro { padding: 38px 25px; }.environment-offer-heading h3 { font-size: 31px; } }
.environment { display: block; width: 100%; max-width: none; padding-left: clamp(16px, 3vw, 48px); padding-right: clamp(16px, 3vw, 48px); overflow: visible; background: transparent; box-shadow: none; }
.environment-carousel { grid-template-columns: 38px minmax(0, 1fr) 38px; margin-top: 0; }
.environment-card-track { grid-auto-columns: calc(45% - 9px); }
.environment-offer-card { min-height: 0; aspect-ratio: 5 / 3; display: flex; flex-direction: column; padding: 38px; overflow: hidden; }
.environment-offer-card h2 { margin: 0; color: #f5f6f2; font-family: var(--serif); font-size: clamp(31px, 3.2vw, 48px); line-height: .98; font-weight: 400; }
.environment-offer-teaser { display: -webkit-box; flex: 1 1 auto; min-height: 0; margin-bottom: 0; overflow: hidden; color: rgba(255,255,255,.82); font-size: 16px; line-height: 1.65; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.environment-offer-card .environment-topics, .environment-offer-card .environment-card-topics { flex: 0 0 82px; height: 82px; align-content: flex-start; overflow: hidden; margin-top: 18px; }
.environment-offer-card .environment-details { flex: 0 0 auto; align-self: flex-start; margin-top: 18px; }
.environment-offer-card .topic-list li { color: #d9bb78; border-color: rgba(217,187,120,.58); background: rgba(20,39,48,.16); }
.environment-offer-card .environment-details.light-cta { color: #111b20; background: #d9bb78; border-color: #d9bb78; font-weight: 800; }
.environment-offer-card .environment-details.light-cta:hover, .environment-offer-card .environment-details.light-cta:focus-visible { color: #111b20; background: #f0d795; }
.environment-dialog { z-index: 1000; width: min(650px, calc(100% - 32px)); margin: auto; padding: 44px clamp(26px, 5vw, 54px) 40px; border: 1px solid rgba(65,119,134,.3); border-radius: 28px; color: var(--ink); background: #f5f8f5; box-shadow: 0 30px 90px rgba(26,53,70,.3); }
.environment-dialog[open] { display: block; }.environment-dialog::backdrop { background: rgba(19,39,54,.56); backdrop-filter: blur(3px); }.environment-dialog-close { position: absolute; top: 12px; right: 18px; width: 34px; height: 34px; border: 0; border-radius: 50%; color: var(--ink); background: rgba(56,126,146,.12); font-size: 25px; cursor: pointer; }.environment-dialog h2 { margin-bottom: 18px; font-family: var(--serif); font-size: clamp(32px, 5vw, 52px); line-height: 1; font-weight: 400; }.environment-dialog-content { color: #405d70; white-space: pre-line; }
@media (max-width: 800px) { .environment-card-track { grid-auto-columns: 100%; }.environment-offer-card { aspect-ratio: 3 / 2; padding: 28px 22px; }.environment-offer-card h2 { font-size: 34px; } }

.contact-dialog { z-index: 1000; width: min(640px, calc(100% - 32px)); margin: auto; padding: 52px clamp(28px, 5vw, 58px) 46px; border: 1px solid rgba(65,119,134,.3); border-radius: 30px; color: var(--ink); background: linear-gradient(145deg, #f7faf6, #e1eff0); box-shadow: 0 30px 90px rgba(26,53,70,.3); }
.contact-dialog[open] { display: block; }.contact-dialog::backdrop { background: rgba(19,39,54,.58); backdrop-filter: blur(4px); }.contact-dialog-close { position: absolute; top: 14px; right: 18px; width: 36px; height: 36px; border: 0; border-radius: 50%; color: var(--ink); background: rgba(56,126,146,.12); font-size: 26px; line-height: 1; cursor: pointer; }.contact-dialog .section-kicker { margin-bottom: 18px; color: #9b7537; }.contact-dialog h2 { max-width: 520px; margin-bottom: 18px; font-family: var(--serif); font-size: clamp(34px, 5vw, 56px); line-height: 1; font-weight: 400; }.contact-dialog > p { max-width: 500px; margin-bottom: 30px; color: var(--muted); font-size: 16px; }.contact-dialog-links { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; }.contact-dialog-links a { display: flex; flex-direction: column; gap: 5px; padding: 18px 20px; border: 1px solid rgba(56,126,146,.24); border-radius: 18px; color: var(--ink); background: rgba(255,255,255,.62); transition: transform .25s ease, background .25s ease, border-color .25s ease; }.contact-dialog-links a:hover, .contact-dialog-links a:focus-visible { transform: translateY(-3px); border-color: #387e92; background: #fff; }.contact-dialog-label { color: #9b7537; font-size: 11px; letter-spacing: .14em; text-transform: uppercase; }.contact-dialog-links strong { font-size: 16px; font-weight: 650; }
@media (max-width: 520px) { .contact-dialog-links { grid-template-columns: 1fr; } }

.package-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }.package-card { position: relative; min-height: 0; aspect-ratio: 1 / 1; justify-content: space-between; overflow: visible; padding: 28px; border: 1px solid color-mix(in srgb, var(--node-color) 38%, white); border-top: 4px solid var(--node-color); border-radius: 0; background: linear-gradient(145deg, color-mix(in srgb, var(--node-color) 16%, white), color-mix(in srgb, var(--node-color) 34%, #e8efed)); box-shadow: none; filter: drop-shadow(0 14px 17px color-mix(in srgb, var(--node-color) 17%, transparent)); transition: transform .3s ease, filter .3s ease; }.package-card:hover { filter: drop-shadow(0 22px 22px color-mix(in srgb, var(--node-color) 25%, transparent)); }.package-card:nth-child(1) { clip-path: polygon(0 0, 42% 0, 46% -3%, 54% -3%, 58% 0, 100% 0, 100% 40%, 103% 45%, 103% 55%, 100% 60%, 100% 100%, 58% 100%, 54% 103%, 46% 103%, 42% 100%, 0 100%, 0 58%, -3% 54%, -3% 46%, 0 42%); transform: rotate(-.35deg); }.package-card:nth-child(2) { clip-path: polygon(0 0, 40% 0, 45% 3%, 55% 3%, 60% 0, 100% 0, 100% 44%, 103% 48%, 103% 58%, 100% 62%, 100% 100%, 60% 100%, 55% 97%, 45% 97%, 40% 100%, 0 100%, 0 60%, 3% 55%, 3% 45%, 0 40%); transform: translateY(10px) rotate(.45deg); }.package-card:nth-child(3) { clip-path: polygon(0 0, 100% 0, 100% 40%, 97% 45%, 97% 55%, 100% 60%, 100% 100%, 58% 100%, 53% 97%, 43% 97%, 38% 100%, 0 100%, 0 58%, 3% 53%, 3% 43%, 0 38%); transform: rotate(-.25deg); }.package-card:nth-child(4) { clip-path: polygon(0 0, 42% 0, 47% 3%, 57% 3%, 62% 0, 100% 0, 100% 42%, 97% 47%, 97% 57%, 100% 62%, 100% 100%, 60% 100%, 55% 103%, 45% 103%, 40% 100%, 0 100%, 0 60%, 3% 55%, 3% 45%, 0 40%); transform: translateY(9px) rotate(.3deg); }.package-card:nth-child(5) { clip-path: polygon(0 0, 100% 0, 100% 42%, 103% 47%, 103% 57%, 100% 62%, 100% 100%, 62% 100%, 57% 97%, 47% 97%, 42% 100%, 0 100%, 0 60%, 3% 55%, 3% 45%, 0 40%); transform: rotate(.4deg); }.package-card:nth-child(6) { clip-path: polygon(0 0, 38% 0, 43% -3%, 53% -3%, 58% 0, 100% 0, 100% 60%, 97% 65%, 97% 75%, 100% 80%, 100% 100%, 58% 100%, 53% 97%, 43% 97%, 38% 100%, 0 100%, 0 42%, 3% 37%, 3% 27%, 0 22%); transform: translateY(8px) rotate(-.3deg); }.package-card::before, .package-card::after { display: none; }.package-card > * { position: relative; z-index: 1; }.package-card-icon { display: grid; place-items: center; width: 52px; height: 52px; border: 1px solid color-mix(in srgb, var(--node-color) 52%, #496675); border-radius: 50%; color: color-mix(in srgb, var(--node-color) 82%, #234966); background: rgba(255,255,255,.5); }.package-card-icon svg { width: 28px; height: 28px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.package-card h3 { max-width: 240px; margin: auto 0; color: #1b354b; font-family: var(--serif); font-size: clamp(25px, 2.6vw, 36px); line-height: 1.02; font-weight: 400; }.package-details { align-self: flex-start; margin-top: 18px; }.package-dialog { max-height: min(84vh, 760px); overflow-y: auto; }
@media (max-width: 800px) { .package-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .package-card:nth-child(3n + 2) { transform: none; } }
@media (max-width: 520px) { .package-grid { grid-template-columns: 1fr; } .package-card { aspect-ratio: 1 / .82; } }

.package-puzzle-wrap { width: min(980px, 100%); margin: 48px auto 0; overflow-x: auto; overflow-y: hidden; padding: 18px; scrollbar-width: thin; scrollbar-color: rgba(56,126,146,.5) transparent; }.package-puzzle { display: block; width: 100%; min-width: 720px; height: auto; overflow: visible; }.package-piece { cursor: pointer; outline: none; }.package-piece-shape { stroke: rgba(247,248,245,.95); stroke-width: 4; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: filter .28s ease, stroke .28s ease, opacity .28s ease; }.package-piece:hover .package-piece-shape { filter: url(#piece-shadow) brightness(1.07) saturate(1.08); }.package-piece:focus-visible .package-piece-shape { stroke: #c3944a; stroke-width: 7; }.package-piece-content { height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 10px 8px; color: #19364b; font-family: var(--sans); }.package-piece-icon { width: 46px; height: 46px; display: grid; place-items: center; margin-bottom: 17px; border: 1px solid rgba(30,70,89,.28); border-radius: 50%; color: #285d70; background: rgba(255,255,255,.5); }.package-piece-icon svg { width: 25px; height: 25px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.package-piece-content h3 { max-width: 220px; margin: 0 0 18px; font-family: var(--serif); font-size: 28px; line-height: 1.02; font-weight: 400; letter-spacing: -.02em; }.package-piece-content span { color: #6f5124; font-size: 11px; font-weight: 800; letter-spacing: .11em; text-transform: uppercase; }.package-piece-content b { margin-left: 5px; font-size: 14px; }.package-piece:hover .package-piece-content span, .package-piece:focus-visible .package-piece-content span { color: #254f60; }
@media (max-width: 800px) { .package-puzzle-wrap { margin-top: 32px; padding: 10px 0 16px; } }

.plan-puzzle-wrap { width: 100%; margin-top: 52px; overflow-x: auto; overflow-y: hidden; padding: 16px 10px 22px; scrollbar-width: thin; scrollbar-color: rgba(56,126,146,.5) transparent; }.plan-puzzle { display: block; width: 100%; min-width: 900px; height: auto; overflow: visible; }.plan-piece-shape { stroke: rgba(247,248,245,.96); stroke-width: 4; stroke-linejoin: round; vector-effect: non-scaling-stroke; transition: filter .28s ease, opacity .28s ease; }.plan-piece:hover .plan-piece-shape { filter: url(#plan-piece-shadow) brightness(1.06) saturate(1.08); }.plan-piece-content { height: 100%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding: 6px; color: #19364b; font-family: var(--sans); }.plan-piece-icon { width: 48px; height: 48px; display: grid; place-items: center; margin-bottom: 20px; border: 1px solid rgba(30,70,89,.3); border-radius: 50%; color: #285d70; background: rgba(255,255,255,.5); }.plan-piece-icon svg { width: 26px; height: 26px; fill: none; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.35; }.plan-piece-content h3 { max-width: 220px; margin: 0 0 10px; font-family: var(--serif); font-size: 25px; line-height: 1.04; font-weight: 400; }.plan-piece-content p { max-width: 218px; margin: 0; color: #496477; font-size: 13px; line-height: 1.45; }
@media (max-width: 800px) { .plan-puzzle-wrap { margin-top: 35px; padding-left: 0; padding-right: 0; } }

/*
 * Isolierter Darm-Node-Versuch. Der ursprüngliche Stil bleibt unverändert in
 * .node-button und .node-icon erhalten; zum Zurücksetzen nur diesen Block und
 * die gut-detailed-Auswahl in index.php entfernen.
 */
.network-node[data-slug="darm-mikrobiom"] .node-button { width: 158px; height: 148px; gap: 7px; border: 1px solid rgba(40,112,108,.72); border-radius: 46% 54% 43% 57% / 42% 45% 55% 58%; color: #173e49; background: radial-gradient(ellipse at 31% 20%, rgba(255,255,255,.95) 0 8%, rgba(255,255,255,.45) 20%, transparent 34%), radial-gradient(ellipse at 68% 76%, #6fb8ad 0%, #a6d0c8 48%, #e6f1ed 100%); box-shadow: inset 11px 10px 19px rgba(255,255,255,.66), inset -17px -14px 24px rgba(29,89,87,.18), 0 0 0 5px rgba(255,255,255,.58), 0 0 0 7px rgba(69,139,134,.18), 0 18px 38px rgba(32,88,91,.24); animation: gut-float 5.8s ease-in-out infinite; }.network-node[data-slug="darm-mikrobiom"] .node-button::before { inset: 10px; border-color: rgba(255,255,255,.78) rgba(32,95,94,.28) rgba(32,95,94,.22) rgba(255,255,255,.62); border-radius: 49% 51% 46% 54% / 44% 48% 52% 56%; transform: rotate(-7deg); }.network-node[data-slug="darm-mikrobiom"] .node-icon { width: 58px; height: 58px; color: #205f63; filter: drop-shadow(0 3px 4px rgba(255,255,255,.5)); }.network-node[data-slug="darm-mikrobiom"] .node-icon svg { stroke-width: 1.55; }.network-node[data-slug="darm-mikrobiom"] .node-title { max-width: 122px; color: #174850; font-size: 13px; letter-spacing: .07em; }.network-node[data-slug="darm-mikrobiom"]:hover .node-button, .network-node[data-slug="darm-mikrobiom"].is-active .node-button { border-radius: 52% 48% 55% 45% / 48% 54% 46% 52%; box-shadow: inset 11px 10px 19px rgba(255,255,255,.72), inset -17px -14px 24px rgba(29,89,87,.2), 0 0 0 6px rgba(255,255,255,.68), 0 0 0 9px rgba(69,139,134,.24), 0 23px 44px rgba(32,88,91,.3); }
@keyframes gut-float { 0%, 100% { translate: 0 0; rotate: -1.2deg; border-radius: 46% 54% 43% 57% / 42% 45% 55% 58%; } 50% { translate: 1px -9px; rotate: 1.2deg; border-radius: 52% 48% 55% 45% / 48% 54% 46% 52%; } }
@media (max-width: 520px) { .network-node[data-slug="darm-mikrobiom"] .node-button { width: 116px; height: 110px; }.network-node[data-slug="darm-mikrobiom"] .node-icon { width: 41px; height: 41px; }.network-node[data-slug="darm-mikrobiom"] .node-title { font-size: 9px; } }

/* Isolierter Immunsystem-Node-Versuch; die ursprüngliche Kreisform bleibt im allgemeinen Node-Stil erhalten. */
.network-node[data-slug="immunsystem"] .node-button { width: 170px; height: 148px; gap: 6px; border: 1px solid rgba(57,111,157,.72); border-radius: 48% 52% 45% 55% / 43% 47% 53% 57%; color: #183c55; background: radial-gradient(ellipse at 30% 19%, rgba(255,255,255,.96) 0 8%, rgba(255,255,255,.48) 20%, transparent 34%), radial-gradient(ellipse at 70% 77%, #78a9d0 0%, #a7c8df 49%, #e8f1f5 100%); box-shadow: inset 11px 10px 19px rgba(255,255,255,.68), inset -17px -14px 24px rgba(32,76,112,.18), 0 0 0 5px rgba(255,255,255,.58), 0 0 0 7px rgba(69,125,173,.18), 0 18px 38px rgba(39,82,117,.24); animation: immune-float 6.2s ease-in-out infinite; }.network-node[data-slug="immunsystem"] .node-button::before { inset: 10px; border-color: rgba(255,255,255,.78) rgba(41,91,130,.25) rgba(41,91,130,.2) rgba(255,255,255,.64); border-radius: 51% 49% 47% 53% / 45% 51% 49% 55%; transform: rotate(6deg); }.network-node[data-slug="immunsystem"] .node-icon { width: 57px; height: 57px; color: #285f86; filter: drop-shadow(0 3px 4px rgba(255,255,255,.52)); }.network-node[data-slug="immunsystem"] .node-icon svg { stroke-width: 1.5; }.network-node[data-slug="immunsystem"] .node-title { max-width: 145px; color: #194864; font-size: 12px; line-height: 1.1; letter-spacing: .055em; }.network-node[data-slug="immunsystem"]:hover .node-button, .network-node[data-slug="immunsystem"].is-active .node-button { border-radius: 53% 47% 54% 46% / 49% 55% 45% 51%; box-shadow: inset 11px 10px 19px rgba(255,255,255,.74), inset -17px -14px 24px rgba(32,76,112,.21), 0 0 0 6px rgba(255,255,255,.68), 0 0 0 9px rgba(69,125,173,.24), 0 23px 44px rgba(39,82,117,.3); }
@keyframes immune-float { 0%, 100% { translate: 0 0; rotate: .8deg; border-radius: 48% 52% 45% 55% / 43% 47% 53% 57%; } 50% { translate: -1px -8px; rotate: -.8deg; border-radius: 53% 47% 54% 46% / 49% 55% 45% 51%; } }
@media (max-width: 520px) { .network-node[data-slug="immunsystem"] .node-button { width: 124px; height: 108px; }.network-node[data-slug="immunsystem"] .node-icon { width: 40px; height: 40px; }.network-node[data-slug="immunsystem"] .node-title { max-width: 106px; font-size: 9px; } }

/* Isolierter Metabolic-Tuning-Node-Versuch; die ursprüngliche Kreisform bleibt im allgemeinen Node-Stil erhalten. */
.network-node[data-slug="orthomolekulare-medizin"] .node-button { width: 170px; height: 148px; gap: 6px; border: 1px solid rgba(111,88,157,.72); border-radius: 51% 49% 44% 56% / 45% 42% 58% 55%; color: #3d315c; background: radial-gradient(ellipse at 29% 18%, rgba(255,255,255,.96) 0 8%, rgba(255,255,255,.48) 20%, transparent 34%), radial-gradient(ellipse at 72% 77%, #a699d1 0%, #c6bee5 48%, #f0edf7 100%); box-shadow: inset 11px 10px 19px rgba(255,255,255,.68), inset -17px -14px 24px rgba(74,53,116,.17), 0 0 0 5px rgba(255,255,255,.58), 0 0 0 7px rgba(123,103,173,.18), 0 18px 38px rgba(74,53,116,.23); animation: metabolic-float 6.5s ease-in-out infinite; }.network-node[data-slug="orthomolekulare-medizin"] .node-button::before { inset: 10px; border-color: rgba(255,255,255,.78) rgba(87,65,134,.24) rgba(87,65,134,.2) rgba(255,255,255,.64); border-radius: 47% 53% 55% 45% / 49% 55% 45% 51%; transform: rotate(-8deg); }.network-node[data-slug="orthomolekulare-medizin"] .node-icon { width: 57px; height: 57px; color: #664c91; filter: drop-shadow(0 3px 4px rgba(255,255,255,.52)); }.network-node[data-slug="orthomolekulare-medizin"] .node-icon svg { stroke-width: 1.5; }.network-node[data-slug="orthomolekulare-medizin"] .node-title { max-width: 145px; color: #49376d; font-size: 12px; line-height: 1.1; letter-spacing: .045em; }.network-node[data-slug="orthomolekulare-medizin"]:hover .node-button, .network-node[data-slug="orthomolekulare-medizin"].is-active .node-button { border-radius: 46% 54% 54% 46% / 53% 47% 50% 50%; box-shadow: inset 11px 10px 19px rgba(255,255,255,.74), inset -17px -14px 24px rgba(74,53,116,.2), 0 0 0 6px rgba(255,255,255,.68), 0 0 0 9px rgba(123,103,173,.24), 0 23px 44px rgba(74,53,116,.3); }.network-node[data-slug="orthomolekulare-medizin"] .node-title::first-line { font-weight: 700; }
@keyframes metabolic-float { 0%, 100% { translate: 0 0; rotate: -0.7deg; border-radius: 51% 49% 44% 56% / 45% 42% 58% 55%; } 50% { translate: 1px -8px; rotate: .8deg; border-radius: 46% 54% 54% 46% / 53% 47% 50% 50%; } }
@media (max-width: 520px) { .network-node[data-slug="orthomolekulare-medizin"] .node-button { width: 124px; height: 108px; }.network-node[data-slug="orthomolekulare-medizin"] .node-icon { width: 40px; height: 40px; }.network-node[data-slug="orthomolekulare-medizin"] .node-title { max-width: 106px; font-size: 9px; } }

/* Cluster styling for the four connected core pillars. */
.network-node[data-slug="hormone-stoffwechsel"] .node-button, .network-node[data-slug="mitochondrien-energie"] .node-button { width: 166px; height: 148px; gap: 6px; border: 1px solid color-mix(in srgb, var(--node-color) 72%, #52616a); border-radius: 48% 52% 44% 56% / 45% 42% 58% 55%; box-shadow: inset 11px 10px 19px rgba(255,255,255,.68), inset -17px -14px 24px rgba(48,58,67,.16), 0 0 0 5px rgba(255,255,255,.58), 0 0 0 7px color-mix(in srgb, var(--node-color) 26%, transparent), 0 18px 38px rgba(40,72,89,.23); }.network-node[data-slug="hormone-stoffwechsel"] .node-button { background: radial-gradient(ellipse at 30% 18%, rgba(255,255,255,.96) 0 8%, rgba(255,255,255,.48) 20%, transparent 34%), radial-gradient(ellipse at 70% 77%, #d89d8d 0%, #e5b9ae 48%, #f7ece7 100%); animation: hormone-float 6.3s ease-in-out infinite; }.network-node[data-slug="mitochondrien-energie"] .node-button { background: radial-gradient(ellipse at 30% 18%, rgba(255,255,255,.96) 0 8%, rgba(255,255,255,.48) 20%, transparent 34%), radial-gradient(ellipse at 70% 77%, #a394cd 0%, #c1b9e0 48%, #efecf6 100%); animation: energy-float 6.8s ease-in-out infinite; }.network-node[data-slug="hormone-stoffwechsel"] .node-button::before, .network-node[data-slug="mitochondrien-energie"] .node-button::before { inset: 10px; border-color: rgba(255,255,255,.78) rgba(48,58,67,.24) rgba(48,58,67,.2) rgba(255,255,255,.64); border-radius: 52% 48% 55% 45% / 48% 54% 46% 52%; transform: rotate(7deg); }.network-node[data-slug="mitochondrien-energie"] .node-button::before { transform: rotate(-8deg); }.network-node[data-slug="hormone-stoffwechsel"] .node-icon, .network-node[data-slug="mitochondrien-energie"] .node-icon { width: 55px; height: 55px; filter: drop-shadow(0 3px 4px rgba(255,255,255,.52)); }.network-node[data-slug="hormone-stoffwechsel"] .node-icon { color: #9d594d; }.network-node[data-slug="mitochondrien-energie"] .node-icon { color: #665493; }.network-node[data-slug="hormone-stoffwechsel"] .node-icon svg, .network-node[data-slug="mitochondrien-energie"] .node-icon svg { stroke-width: 1.5; }.network-node[data-slug="hormone-stoffwechsel"] .node-title, .network-node[data-slug="mitochondrien-energie"] .node-title { max-width: 143px; font-size: 11px; line-height: 1.08; letter-spacing: .035em; text-wrap: balance; }.network-node[data-slug="hormone-stoffwechsel"] .node-title { color: #70413b; }.network-node[data-slug="mitochondrien-energie"] .node-title { color: #49376d; }.network-node[data-slug="hormone-stoffwechsel"]:hover .node-button, .network-node[data-slug="hormone-stoffwechsel"].is-active .node-button, .network-node[data-slug="mitochondrien-energie"]:hover .node-button, .network-node[data-slug="mitochondrien-energie"].is-active .node-button { border-radius: 46% 54% 54% 46% / 53% 47% 50% 50%; box-shadow: inset 11px 10px 19px rgba(255,255,255,.74), inset -17px -14px 24px rgba(48,58,67,.2), 0 0 0 6px rgba(255,255,255,.68), 0 0 0 9px color-mix(in srgb, var(--node-color) 32%, transparent), 0 23px 44px rgba(40,72,89,.3); }
@keyframes hormone-float { 0%, 100% { translate: 0 0; rotate: -.8deg; border-radius: 48% 52% 44% 56% / 45% 42% 58% 55%; } 50% { translate: -1px -7px; rotate: .8deg; border-radius: 53% 47% 54% 46% / 49% 55% 45% 51%; } }
@keyframes energy-float { 0%, 100% { translate: 0 0; rotate: .7deg; border-radius: 48% 52% 44% 56% / 45% 42% 58% 55%; } 50% { translate: 1px -8px; rotate: -.7deg; border-radius: 46% 54% 54% 46% / 53% 47% 50% 50%; } }
@media (max-width: 520px) { .network-node[data-slug="hormone-stoffwechsel"] .node-button, .network-node[data-slug="mitochondrien-energie"] .node-button { width: 124px; height: 108px; }.network-node[data-slug="hormone-stoffwechsel"] .node-icon, .network-node[data-slug="mitochondrien-energie"] .node-icon { width: 40px; height: 40px; }.network-node[data-slug="hormone-stoffwechsel"] .node-title, .network-node[data-slug="mitochondrien-energie"] .node-title { max-width: 106px; font-size: 8px; } }

/* The HRV graph node links directly to the HRV and Biofeedback accordion item. */
.network-node[data-slug="hrv-biofeedback"] .node-button { width: 142px; height: 128px; gap: 7px; }
.network-node[data-slug="hrv-biofeedback"] .node-icon { width: 42px; height: 42px; }
.network-node[data-slug="hrv-biofeedback"] .node-title { max-width: 122px; font-size: 11px; line-height: 1.08; letter-spacing: .035em; text-wrap: balance; }

@media (max-width: 520px) {
    .network-node[data-slug="hrv-biofeedback"] .node-button { width: 112px; height: 98px; }
    .network-node[data-slug="hrv-biofeedback"] .node-icon { width: 34px; height: 34px; }
    .network-node[data-slug="hrv-biofeedback"] .node-title { max-width: 94px; font-size: 8px; }
}

.package-card { display: flex; flex-direction: column; }.package-card .package-list { flex: 1 1 auto; }.package-details { align-self: flex-start; margin-top: 18px; font-weight: 700; cursor: pointer; }.package-dialog { z-index: 1000; width: min(650px, calc(100% - 32px)); margin: auto; padding: 52px clamp(28px, 5vw, 58px) 44px; border: 1px solid rgba(65,119,134,.3); border-radius: 30px; color: var(--ink); background: linear-gradient(145deg, #f7faf6, #e1eff0); box-shadow: 0 30px 90px rgba(26,53,70,.3); }.package-dialog[open] { display: block; }.package-dialog::backdrop { background: rgba(19,39,54,.58); backdrop-filter: blur(4px); }.package-dialog-close { position: absolute; top: 14px; right: 18px; width: 36px; height: 36px; border: 0; border-radius: 50%; color: var(--ink); background: rgba(56,126,146,.12); font-size: 26px; line-height: 1; cursor: pointer; }.package-dialog h2 { margin-bottom: 8px; font-family: var(--serif); font-size: clamp(34px, 5vw, 56px); line-height: 1; font-weight: 400; }.package-dialog-subtitle { margin-bottom: 20px; color: #9b7537; font-family: var(--serif); font-size: 22px; }.package-dialog-description { color: var(--muted); }.package-dialog-price { display: block; margin: 22px 0 18px; color: #9b7537; font-family: var(--serif); font-size: 28px; font-weight: 400; }.package-dialog-list { display: grid; gap: 9px; margin: 0; padding: 18px 0 0; border-top: 1px solid var(--line); list-style: none; color: #48647c; }.package-dialog-list li::before { content: '✓'; display: inline-block; width: 24px; color: #9b7537; font-weight: 800; }

/* The VitaminDok logo and header controls form one aligned group in the upper-left. */
.site-header { align-items: flex-start; padding: 4px 12px 0 4px; }
.brand-doctor-logo { position: absolute; top: 4px; left: 4px; z-index: 20; display: block; width: 192px; height: 192px; margin: 0; }
.brand-doctor-logo img { display: block; width: 100%; height: 100%; object-fit: contain; border-radius: 8px; filter: drop-shadow(0 8px 16px rgba(20,46,48,.18)); }
.site-header > .primary-nav { margin-left: 214px; }
.site-header > .header-actions { margin-left: 24px; }
@media (max-width: 800px) {
    .site-header { flex-wrap: nowrap; padding: 4px 8px 0 4px; overflow: visible; }
    .brand-doctor-logo { top: 4px; left: 4px; width: 120px; height: 120px; }
    .site-header > .primary-nav { flex-wrap: wrap; width: auto; margin: 8px 0 0 136px; gap: 5px; justify-content: flex-start; }
    .site-header > .header-actions { flex-shrink: 0; margin: 4px 0 0 12px; gap: 7px; }
}