/* One recognizable place to think, meet Shantie and make direct contact. */
#vraagruimte{width:min(1080px,calc(100vw - 40px));max-width:none;max-height:calc(100dvh - 40px);padding:0;border:1px solid var(--line);border-radius:24px;background:white;color:var(--ink);overflow:auto;box-shadow:0 24px 100px #20112c4d;scrollbar-width:thin}
#vraagruimte::backdrop{background:#24132fd9;backdrop-filter:blur(5px)}
#vraagruimte .question-shell{padding:0}
#vraagruimte .question-top{position:sticky;top:0;z-index:2;padding:18px 30px;gap:20px;background:white;border-bottom:1px solid var(--line);letter-spacing:0;font-size:16px}
.question-brand{display:flex;align-items:center;gap:12px;font-weight:650;color:var(--purple)}
.question-mark{width:36px;height:36px;display:grid;place-items:center;background:var(--orange);color:var(--purple);border-radius:12px;font-size:26px}
#vraagruimte .question-top button{padding:8px 12px;min-height:44px;color:var(--purple);border:1px solid var(--line);border-radius:999px;font-size:15px;white-space:nowrap}
.question-layout{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:36px;padding:30px}
.question-main,.question-aside{min-width:0}
#vraagruimte .question-heading{padding:0}
#vraagruimte .question-heading .eyebrow{font-size:12px;letter-spacing:.1em;color:var(--purple);margin:0 0 16px}
#vraagruimte .question-heading h2{font-size:clamp(34px,3.8vw,48px);line-height:1.08;letter-spacing:-.04em;margin:0}
#vraagruimte .question-heading h2 em{font-style:normal;color:var(--purple)}
#vraagruimte .question-heading>p:last-child{font-size:17px;line-height:1.65;margin:20px 0 26px;max-width:55ch}
#question-form label,body [data-assistant-form]>label{display:block;font-size:16px;font-weight:600;margin-bottom:10px}
body :is(.question-input,.assistant-input){display:flex;flex-wrap:wrap;justify-content:flex-end;align-items:end;gap:0;background:white;border:1px solid color-mix(in srgb,var(--purple) 40%,white);border-radius:16px;margin:0;overflow:hidden;transition:box-shadow 180ms ease,border-color 180ms ease}
body :is(.question-input,.assistant-input):focus-within{border-color:var(--purple);box-shadow:0 0 0 3px color-mix(in srgb,var(--pink) 55%,white)}
body :is(.question-input,.assistant-input) textarea{display:block;flex:1 0 100%;width:100%;min-height:96px;max-height:220px;padding:16px 18px;border:0;outline:0;background:transparent;box-shadow:none;border-radius:0;font-size:17px;line-height:1.6;resize:vertical;color:var(--ink)}
body :is(.question-input,.assistant-input) textarea:focus-visible{outline:0}
body :is(.question-input,.assistant-input) button{display:inline-flex;align-items:center;justify-content:center;gap:22px;width:auto;height:auto;min-height:46px;margin:0 10px 10px;padding:10px 16px;border:0;border-radius:10px;background:var(--purple);color:white;font-size:15px;font-weight:600;cursor:pointer}
body :is(.question-input,.assistant-input) button span:last-child{font-size:22px;line-height:1}
body :is(.question-input,.assistant-input) button:disabled{opacity:.5;cursor:wait}
#vraagruimte #ai-status{font-size:13px;line-height:1.6;color:var(--muted);margin:12px 0 22px}
#vraagruimte .question-suggestions{display:flex;flex-direction:column;gap:8px;margin:0}
#vraagruimte .question-suggestions button{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;min-height:48px;border:1px solid var(--line);border-radius:12px;padding:12px 14px;background:white;color:var(--purple);font-size:15px;line-height:1.4;text-align:left;cursor:pointer}
#vraagruimte .question-suggestions button span{flex:none;color:var(--purple)}
.question-aside{display:flex;flex-direction:column;gap:18px}
#vraagruimte .assistant-fit{padding:24px;border-radius:18px;background:linear-gradient(140deg,color-mix(in srgb,var(--pink) 34%,white),color-mix(in srgb,var(--pink) 12%,white));border:1px solid color-mix(in srgb,var(--pink) 55%,white)}
#vraagruimte .assistant-fit .eyebrow{font-size:11px;letter-spacing:.09em;color:var(--purple);margin:0 0 14px}
#vraagruimte .assistant-fit h3{font-size:25px;line-height:1.2;letter-spacing:-.025em;color:var(--purple);margin:0 0 16px}
#vraagruimte .assistant-fit>p:not(.eyebrow){font-size:15px;line-height:1.65;margin:0 0 18px}
#vraagruimte .assistant-fit-actions button{background:transparent;border-color:color-mix(in srgb,var(--purple) 26%,transparent);font-weight:600;padding:12px;font-size:14px}
body .assistant-contact-card{padding:26px 24px;border:0;border-radius:18px;background:linear-gradient(115deg,#43235BF5,#43235BD9),url('/assets/atelier-mac-zilver-v7.webp') right center/cover;color:white}
body .assistant-contact-card .eyebrow{font-size:11px;line-height:1.5;letter-spacing:.09em;color:var(--green);margin:0 0 14px}
body .assistant-contact-card h3{font-size:27px;line-height:1.16;letter-spacing:-.025em;margin:0 0 14px;color:white}
body .assistant-contact-card>p:not(.eyebrow){font-size:15px;line-height:1.65;margin:0 0 20px;color:white}
body .assistant-contact-primary{display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;min-height:50px;background:var(--orange);color:var(--purple);border:1px solid transparent;border-radius:11px;padding:12px 16px;font-size:17px;font-weight:650;text-decoration:none}
body .assistant-contact-primary span{font-size:23px}
.assistant-contact-other{display:flex;flex-wrap:wrap;gap:10px 20px;margin-top:12px}
body .assistant-contact-other a{display:inline-flex;align-items:center;min-height:44px;font-size:15px;line-height:1.4;color:white;text-decoration:underline;text-decoration-color:#ffffff66;text-underline-offset:6px}
#vraagruimte .privacy-note{padding:18px 30px;margin:0;border-top:1px solid var(--line);font-size:13px;line-height:1.6;background:color-mix(in srgb,var(--pink) 8%,white);color:var(--muted)}
#vraagruimte .privacy-note a{color:var(--purple);text-underline-offset:3px}
#vraagruimte #conversation{max-height:380px;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scroll-margin-block:100px 20px}
#vraagruimte #conversation:empty{display:none}
body :is(#conversation,.inline-conversation) .chat-entry{font-size:16px;line-height:1.75;padding:18px 20px;border:1px solid var(--line);border-radius:16px;background:color-mix(in srgb,var(--purple) 4%,white);margin:12px 0;overflow-wrap:anywhere}
body :is(#conversation,.inline-conversation) .chat-entry.user{background:color-mix(in srgb,var(--pink) 22%,white);margin-left:24px;border-color:transparent}
body :is(#conversation,.inline-conversation) .chat-entry.assistant{background:white}
body :is(#conversation,.inline-conversation) .chat-entry .source-links{font-size:14px;line-height:1.5;display:flex;flex-wrap:wrap;gap:10px 16px}
body .assistant-section .assistant-panel{background:linear-gradient(145deg,color-mix(in srgb,var(--pink) 15%,white),white 70%);border:1px solid var(--line);border-radius:24px;box-shadow:0 12px 40px #43235b0d}
body .assistant-ident{padding-bottom:20px;border-color:var(--line)}
body .assistant-mark{border-radius:12px;width:36px;height:36px;background:var(--orange);color:var(--purple)}
body .assistant-welcome{color:var(--ink);font-size:17px;line-height:1.65}
body .assistant-starters{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-block:16px}
body .assistant-starters button{padding:12px;border:1px solid var(--line);border-radius:12px;background:white;color:var(--purple);text-align:left;font-size:14px;line-height:1.4;cursor:pointer}
body .assistant-contact-inline{margin-top:24px}
body .assistant-contact-inline h3{font-size:25px}
body .assistant-contact-inline .assistant-contact-primary{max-width:320px}
body .assistant-status,body .assistant-privacy{font-size:13px;line-height:1.6}
@media(hover:hover) and (pointer:fine){
 #vraagruimte .question-suggestions button:hover,body .assistant-starters button:hover{background:color-mix(in srgb,var(--pink) 20%,white);border-color:color-mix(in srgb,var(--purple) 45%,white);box-shadow:0 4px 14px #43235b12;transform:translateY(-1px)}
 body .assistant-contact-primary:hover{box-shadow:0 5px 20px #f477354d;transform:translateY(-1px)}
 #vraagruimte .question-top button:hover{background:color-mix(in srgb,var(--pink) 18%,white)}
}
#vraagruimte :is(button,a):focus-visible,body .assistant-panel :is(button,a):focus-visible{outline:3px solid var(--orange);outline-offset:3px}
body .assistant-contact-card :is(button,a):focus-visible{outline-color:var(--green)}
#vraagruimte button,body .assistant-starters button,body .assistant-contact-primary{transition:background-color 180ms ease,box-shadow 180ms ease,transform 180ms ease}
@media(max-width:800px){
 #vraagruimte{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:20px}
 #vraagruimte .question-top{padding:14px 20px;font-size:15px}
 .question-layout{grid-template-columns:1fr;gap:26px;padding:24px}
 .question-aside{display:grid;grid-template-columns:1fr 1fr;gap:16px}
 #vraagruimte .question-heading h2{font-size:40px}
 #vraagruimte .question-heading h2 br{display:none}
 #vraagruimte .privacy-note{padding:18px 24px}
}
@media(max-width:540px){
 #vraagruimte .question-top{padding:12px 16px;gap:10px}
 .question-brand{gap:8px;font-size:14px}
 .question-mark{width:28px;height:28px;font-size:22px;border-radius:9px}
 #vraagruimte .question-top button{font-size:14px;padding:7px 9px}
 .question-layout{padding:22px 18px;gap:24px}
 #vraagruimte .question-heading h2{font-size:35px}
 #vraagruimte .question-heading>p:last-child{font-size:16px;margin-bottom:22px}
 .question-aside{grid-template-columns:1fr}
 #vraagruimte .assistant-fit,body .assistant-contact-card{padding:22px}
 #vraagruimte .privacy-note{padding:16px 18px}
 body .assistant-starters{grid-template-columns:1fr}
 body :is(.question-input,.assistant-input) textarea{font-size:16px;padding:14px}
}
@media(prefers-reduced-motion:reduce){#vraagruimte button,body .assistant-starters button,body .assistant-contact-primary,body :is(.question-input,.assistant-input){transition:none;transform:none!important}}
/* Pair the introduction and writing surface along the same top edge. */
body .assistant-section{align-items:start;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(28px,4vw,64px)}
body .assistant-section .assistant-panel{max-width:none;justify-self:stretch;align-self:start}
body .assistant-section .assistant-intro{align-self:start;min-width:0}
body .assistant-intro h2{font-size:clamp(38px,4.1vw,62px);line-height:1.1}
@media(max-width:800px){body .assistant-section{grid-template-columns:1fr;gap:28px}}

/* The contact route belongs to the whole section, below two equal panels. */
body .assistant-section{align-items:stretch;row-gap:26px}
body .assistant-section :is(.assistant-panel,.assistant-intro){align-self:stretch}
body .assistant-section .assistant-intro{display:flex;flex-direction:column;justify-content:center}
body .assistant-contact-wide{grid-column:1/-1;display:grid;grid-template-columns:minmax(0,1fr) auto auto;column-gap:34px;align-items:center;padding:28px 34px;margin:0;background:var(--purple);border-radius:18px}
body .assistant-contact-wide>.eyebrow{grid-column:1;grid-row:1;font-size:11px;margin:0 0 8px}
body .assistant-contact-wide>h3{grid-column:1;grid-row:2;margin:0 0 8px;font-size:27px}
body .assistant-contact-wide>p:not(.eyebrow){grid-column:1;grid-row:3;margin:0;font-size:16px}
body .assistant-contact-wide>.assistant-contact-primary{grid-column:2;grid-row:1/4;min-width:210px;margin:0}
body .assistant-contact-wide>.assistant-contact-other{grid-column:3;grid-row:1/4;display:flex;flex-direction:column;gap:12px;margin:0}
@media(max-width:760px){body .assistant-contact-wide{grid-template-columns:1fr auto;gap:10px 22px;padding:27px}body .assistant-contact-wide>.assistant-contact-primary{grid-column:1;grid-row:4;margin-top:10px}body .assistant-contact-wide>.assistant-contact-other{grid-column:2;grid-row:4}}
@media(max-width:460px){body .assistant-contact-wide{display:flex;flex-direction:column;align-items:stretch;gap:10px}body .assistant-contact-wide>.assistant-contact-other{flex-direction:row;gap:24px;margin-top:10px}}

body .assistant-contact-wide{grid-template-columns:minmax(0,1fr) auto;gap:28px}
body .assistant-contact-wide .assistant-contact-copy .eyebrow{margin:0 0 9px}
body .assistant-contact-wide .assistant-contact-copy h3{font-size:27px;margin:0 0 10px}
body .assistant-contact-wide .assistant-contact-copy>p:last-child{margin:0;font-size:16px}
body .assistant-contact-wide .assistant-contact-actions{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
body .assistant-contact-wide .assistant-contact-actions a{margin:0;min-height:50px;display:inline-flex;align-items:center;justify-content:center;gap:24px;white-space:nowrap;font-size:15px;border-radius:10px;padding:12px 20px}
body .assistant-contact-wide .assistant-contact-secondary{border:1px solid #ffffff66;color:white}
body .assistant-contact-wide .assistant-contact-primary{min-width:170px}
@media(max-width:1050px){body .assistant-contact-wide{grid-template-columns:1fr;gap:22px}}
@media(max-width:460px){body .assistant-contact-wide .assistant-contact-actions{display:grid;grid-template-columns:1fr 1fr}body .assistant-contact-wide .assistant-contact-primary{grid-column:1/-1}}

/* One compact group for contact, rather than isolated actions across the bar. */
body .assistant-contact-card{background:linear-gradient(120deg,#43235B,#563465)}
body .assistant-contact-wide .assistant-contact-actions :is(a,button){margin:0;width:auto;min-width:0;min-height:48px;display:inline-flex;align-items:center;justify-content:center;gap:12px;white-space:nowrap;font-family:inherit;font-size:15px;font-weight:550;border-radius:10px;padding:12px 16px;text-decoration:none;cursor:pointer}
body .assistant-contact-wide .assistant-contact-primary{border:1px solid transparent}
body .assistant-whatsapp{display:inline-flex;margin-top:14px;color:white;font-size:15px;text-underline-offset:5px}
.handoff-dialog{width:min(700px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 28px);border:1px solid var(--line);border-radius:24px;padding:0;background:white;color:var(--ink);overflow:auto;box-shadow:0 25px 100px #24132f66;scrollbar-width:thin}
.handoff-dialog::backdrop{background:#24132fd9;backdrop-filter:blur(4px)}
.handoff-top{position:sticky;top:0;background:var(--purple);color:white;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:17px 26px;z-index:1}
.handoff-top>span{font-size:12px;letter-spacing:.07em;font-weight:600}.handoff-top button{background:transparent;color:white;border:1px solid #ffffff66;border-radius:50px;min-height:42px;padding:9px 15px;font:inherit;font-size:14px;cursor:pointer}
.handoff-body{padding:30px}.handoff-body .eyebrow{font-size:11px;color:var(--purple);margin:0 0 14px}.handoff-body h2{font-size:36px;line-height:1.15;color:var(--purple);margin:0 0 20px}.handoff-body>p:not(.eyebrow){font-size:17px;line-height:1.6;margin:0 0 25px}
.handoff-body label{font-size:15px;font-weight:600;display:block;margin:0 0 8px}.handoff-body :is(textarea,input:not([type=hidden])){width:100%;min-width:0;border:1px solid #b9a8c6;border-radius:12px;background:white;color:var(--ink);padding:13px;font:inherit;font-size:16px;line-height:1.5}.handoff-body textarea{resize:vertical;min-height:130px;max-height:260px}.handoff-fields{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}.handoff-fields>div{min-width:0}
.handoff-privacy{font-size:13px;line-height:1.65;color:var(--muted);margin:20px 0}.handoff-body .button{font-size:16px;white-space:normal}.handoff-body .button:disabled{opacity:.55;cursor:wait}.handoff-status{font-size:15px;line-height:1.6;color:var(--purple);margin:18px 0 0}.handoff-status:empty{display:none}.handoff-status:not(:empty){padding:15px 18px;border-radius:12px;background:#C4E8893D}
.handoff-dialog :is(input,textarea,button,a):focus-visible{outline:3px solid var(--orange);outline-offset:3px}
@media(max-width:560px){.handoff-body{padding:24px 20px}.handoff-body h2{font-size:30px}.handoff-top{padding:13px 20px}.handoff-fields{grid-template-columns:1fr;gap:16px}.handoff-body .button{width:100%;justify-content:space-between}.handoff-body .button>span{flex:none}}
@media(max-width:460px){body .assistant-contact-wide .assistant-contact-actions{grid-template-columns:1fr 1fr 1fr;gap:8px}body .assistant-contact-wide .assistant-contact-actions a{font-size:13px;white-space:normal;text-align:center;padding:10px 7px}body .assistant-contact-wide .assistant-contact-primary{grid-column:1/-1}}

.security-check{margin:1rem 0;max-width:100%;min-height:1px}.security-check iframe{max-width:100%}

/* Mobile: one quiet contact entry, only after the opening section. */
.dock-mobile-label,.mobile-guide-invitation{display:none}
@media(max-width:760px){
 body>.guide-invitation,body>.guide-ribbon{display:none}
 body .contact-dock{display:none;left:auto;right:16px;bottom:calc(12px + env(safe-area-inset-bottom));width:auto}
 body .contact-dock.dock-after-opening{display:flex}
 body .contact-dock>a,.dock-desktop-label{display:none}
 .dock-mobile-label{display:inline}
 body .contact-dock button{font-size:14px;padding:12px 18px;min-height:44px}
 .mobile-guide-invitation{display:block}
 body main :is(h1){font-size:clamp(32px,8.8vw,42px);line-height:1.12}
 body main :is(h2){font-size:clamp(27px,7.2vw,34px);line-height:1.18}
 body main :is(h3){font-size:23px;line-height:1.25}
 body .about-v3 h1 .about-introduction{font-size:26px}
 body .guide-teaser{padding-block:30px}
 body .ai-disclosure{font-size:13px;line-height:1.5}
 body main nav.story-chapters{position:static;inset:auto;box-shadow:none}
}

/* A bounded contact card keeps copy and actions in one visual group. */
body .assistant-contact-wide{display:grid;grid-template-columns:minmax(0,1fr) 200px;width:100%;max-width:880px;justify-self:center;align-items:center;gap:36px;padding:30px 36px;margin:8px auto 0}
body .assistant-contact-wide .assistant-contact-copy h3{font-size:27px;line-height:1.2}
body .assistant-contact-wide .assistant-contact-copy>p:last-child{max-width:34ch;line-height:1.5}
body .assistant-contact-wide .assistant-contact-actions{display:flex;flex-direction:column;align-items:stretch;gap:6px}
body .assistant-contact-wide .assistant-contact-actions .assistant-contact-primary{width:100%;justify-content:center}
body .assistant-contact-wide .assistant-contact-actions .assistant-contact-secondary{border:0;border-radius:0;padding:8px 0;min-height:44px;font-size:15px;gap:8px;text-decoration:none}
body .assistant-contact-wide .assistant-contact-secondary:hover{text-decoration:underline;text-underline-offset:5px}
@media(max-width:680px){body .assistant-contact-wide{grid-template-columns:1fr;gap:20px;padding:26px 24px}body .assistant-contact-wide .assistant-contact-actions{width:100%;max-width:320px}body .assistant-contact-wide .assistant-contact-copy h3{font-size:25px}}