/* Levv-Up palette: purple, orange, pink and green, with white for breathing room.
   Lighter surfaces are transparent brand colours over white. Warmth in images
   comes from the photograph, not an extra beige, clay or brown palette. */
:root{--surface-soft:color-mix(in srgb,var(--pink) 10%,white);--surface-pink:color-mix(in srgb,var(--pink) 28%,white);--line-brand:color-mix(in srgb,var(--purple) 18%,white)}
body :is(.about-v3,.contact-v3){background:radial-gradient(ellipse at 90% 45%,#E7A6B557,transparent 70%),white}
body .personal-v3{background:linear-gradient(110deg,white 0%,#E7A6B51F 48%,#E7A6B54D 100%)}
body .ai-v3-opening{background:radial-gradient(ellipse at 90% 45%,#E7A6B545,transparent 70%),white}
body .journal-v6-opening{background:radial-gradient(ellipse at 91% 45%,#C4E88966,transparent 68%),white}
body :is(.method-opening,.method-photo-note){background:linear-gradient(115deg,white,var(--surface-soft))}
body .work-opening-v4{background:linear-gradient(90deg,#302039F5 0%,#302039E8 35%,#30203955 70%,#30203915 100%),url('/assets/atelier-mac-zilver-v7.webp') 70% center/cover no-repeat}
body .builds-opening{background:linear-gradient(90deg,#302039F5 0%,#302039E8 35%,#30203955 70%,#30203915 100%),url('/assets/atelier-mac-zilver-v7.webp') 70% center/cover no-repeat}
/* The photograph uses the same legibility overlay as the approved homepage. */
body .work-opening-v4 .work-map{text-shadow:0 1px 8px #29233080}
@media(max-width:760px){body :is(.work-opening-v4,.builds-opening){background-image:linear-gradient(90deg,#302039ED,#302039D9),url('/assets/atelier-mac-zilver-v7.webp')}}
body .assistant-section{background:white}
body .assistant-intro{padding:clamp(28px,3.8vw,54px);border-radius:20px;background:linear-gradient(110deg,#43235BEB,#43235BB3),url('/assets/atelier-mac-zilver-v7.webp') right center/cover no-repeat}
body .about-v3 h1 .about-introduction em,body .personal-v3 h2 .brand-energy{color:var(--purple)}
body .journal-v6-opening h1 em{color:var(--purple)}
body .assistant-intro h2,body .assistant-intro p:not(.eyebrow),body .assistant-intro a{color:white}
body .assistant-intro h2 em{color:var(--pink)}
body .assistant-intro .eyebrow{color:var(--green)}
body .assistant-intro a:is(:hover,:focus-visible){color:var(--green)}
@media(max-width:760px){body .social-proof{padding:26px}body .assistant-intro{padding:28px 24px}}

body .social-office{margin:0;min-width:0}body .social-office img{display:block;width:100%;height:auto;aspect-ratio:3/2;object-fit:cover;object-position:center;border-radius:20px}body .social-office figcaption{font-size:14px;line-height:1.6;color:var(--muted);margin-top:16px}@media(max-width:760px){body .social-office img{aspect-ratio:3/2}}

/* Open offer columns alternate with contained examples, with room between chapters. */
body .offerings{padding-block:80px 90px;column-gap:70px}
body .offering-panel{background:white;border-radius:0;padding:0;row-gap:24px}
body .offering-kind,body .offering-website .offering-kind{display:block;background:none;padding:0 0 0 14px;border-left:3px solid var(--orange);line-height:1.6;margin-bottom:22px}
body .offering-ai .offering-kind{border-color:var(--pink)}
body .offering-copy h2{color:var(--purple);max-width:24ch}
body .offering-scope{padding-top:24px;border-top:1px solid var(--line)}
body .offering-cost-note{min-height:3.2em;max-width:none}
body .offering-details .offering-included{margin:14px 0 18px;font-size:16px}
body .build-teaser{padding-bottom:92px}
body .visitor-questions{padding-block:80px;background:linear-gradient(120deg,#E7A6B524,#FFFFFF 76%)}

/* A separate invitation, surrounded by white rather than another full-width stripe. */
body .collab-v3{background:white;border:0;padding-block:88px}
body .collab-v3>.collab-card{display:block;padding:clamp(30px,4.2vw,62px);border:1px solid var(--line-brand);border-radius:24px;background:linear-gradient(115deg,white 28%,#E7A6B52B 100%)}
.collab-card>.eyebrow{color:var(--purple);margin:0 0 26px}
.collab-body{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(30px,5vw,72px);align-items:start}
body .collab-body h2{margin:0;font-size:clamp(34px,3.4vw,50px);line-height:1.15}
body .collab-body h2 em{color:var(--purple)}
.collab-body>div>p:first-child{margin-top:0}
.collab-body .text-link{margin-top:10px}

/* Social domain has the same warmth, with colour marking decisions and experience. */
body .social-opening{background:radial-gradient(ellipse at 90% 45%,#E7A6B557,transparent 70%),white;gap:clamp(34px,5vw,80px)}
body .social-opening figure{padding-top:0}
body .social-situations{background:white}
body .social-situations .choice-panels{border:1px solid #43235B2B;overflow:hidden;background:white}
body .social-situations .choice-panels article{background:linear-gradient(135deg,var(--surface-soft),white 76%);padding:40px}
body .social-situations .choice-menu button{border-radius:14px;padding:23px 18px;box-shadow:none}
body .social-situations .choice-menu button[aria-pressed=true]{background:var(--purple);color:white}
body .social-situations .choice-menu button[aria-pressed=true]>span{color:var(--green)}
body .social-situations .deliverable{background:#C4E88940;border-left:3px solid var(--green);border-radius:0 14px 14px 0}
body .experience-ribbon{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:28px clamp(28px,4vw,60px);align-items:start;width:auto;margin-inline:var(--gutter);padding:clamp(28px,3.5vw,48px);background:radial-gradient(ellipse at 100% 0%,#E7A6B524,transparent 65%),var(--purple);border:1px solid #FFFFFF26;border-radius:24px;color:white}
body .experience-ribbon>div{min-width:0}
body .experience-ribbon h2{font-size:clamp(32px,3vw,46px);line-height:1.16;max-width:20ch;margin:0;color:white}
body .experience-ribbon h2 em{color:var(--pink)}
body .experience-ribbon a{color:white}
body .experience-ribbon .eyebrow{color:var(--green);margin:0 0 20px}
body .experience-ribbon .ribbon-bottom{display:flex;flex-direction:column;align-items:flex-start;gap:20px;min-width:0}
body .experience-ribbon .ribbon-bottom p{flex:0 1 auto;margin:0;max-width:58ch}
body .experience-ribbon .ribbon-bottom a{white-space:normal;max-width:100%;font-size:16px;line-height:1.5}
body .experience-ribbon .experience-keywords{grid-column:1/-1;display:flex;flex-direction:row;flex-wrap:wrap;gap:10px;max-width:100%;align-items:flex-start;margin:0;padding-top:24px;border-top:1px solid #FFFFFF29}
body .experience-keyword-row{display:flex;flex-wrap:wrap;gap:10px;max-width:100%}
body .experience-ribbon .experience-keywords span{display:inline-block;color:var(--pink);border:1px solid #E7A6B54D;border-radius:999px;padding:7px 14px;font-size:14px;line-height:1.5;max-width:100%}
@media(max-width:900px){body .experience-ribbon{grid-template-columns:minmax(0,1fr);gap:24px}body .experience-ribbon h2{max-width:25ch}body .experience-ribbon .experience-keywords{grid-column:auto}}
@media(max-width:600px){body .experience-ribbon .experience-keywords span{font-size:14px;padding:7px 12px}}
body .experience-ribbon .ribbon-bottom p{color:white}
body .experience-ribbon .text-link:is(:hover,:focus-visible){color:var(--green)}
@media(min-width:901px){body .social-situations{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:0 64px;align-items:start}.social-situations .section-lead{grid-column:1;grid-row:1;margin:0 0 28px}.social-situations .section-lead h2{font-size:44px}.social-situations .choice-experience{display:contents}.social-situations .choice-menu{grid-column:1;grid-row:2}.social-situations .choice-panels{grid-column:2;grid-row:1/span 2}}

/* Reviews belong together as a clear, calm feature. */
body .testimonials{background:white;padding-block:80px}
.testimonials-shell{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:32px 70px;padding:clamp(30px,4vw,60px);border-radius:24px;background:radial-gradient(ellipse at 100% 0%,#E7A6B524,transparent 65%),var(--purple);color:white}
body .testimonials .testimonials-intro{margin:0}
body .testimonials .testimonials-intro .eyebrow{color:var(--green);font-size:11px;line-height:1.7}
body .testimonials .testimonials-intro h2{font-size:clamp(25px,2.6vw,35px);line-height:1.2;color:white}
body .testimonials .testimonial-figure{border:0;padding:0}
body .testimonials .testimonial-context{color:var(--pink);margin-bottom:18px}
body .testimonials .testimonial-quote p{font-size:clamp(29px,3.1vw,44px);line-height:1.25;color:white;font-family:var(--heading)}
body .testimonials .testimonial-attribution{color:white}
body .testimonials .testimonials-controls{grid-column:1/-1;max-width:none;margin:8px 0 0;border-color:#FFFFFF40}
body .testimonials-controls button{border-color:#FFFFFF66;border-radius:12px;background:transparent;color:white}
body .testimonials-controls button[aria-pressed=true]{background:var(--pink);color:var(--purple);border-color:var(--pink)}
body .testimonials-controls button:hover{border-color:var(--green)}
body .testimonials-controls button:focus-visible{outline-color:var(--green)}
@media(max-width:900px){body .offerings{gap:54px;padding-block:54px 68px}body .offering-copy h2{font-size:32px}body .offering-cost-note{min-height:0}body .build-teaser{padding-bottom:64px}.testimonials-shell{gap:30px;grid-template-columns:1fr}}
@media(max-width:760px){body .visitor-questions{padding-block:54px}body .collab-v3{padding-block:58px}.collab-body{grid-template-columns:1fr;gap:28px}body .collab-v3>.collab-card{padding:28px 24px}body .social-situations .choice-panels article{padding:28px 24px}body .social-situations .choice-menu button{padding:20px 16px}body .testimonials{padding-block:58px}.testimonials-shell{padding:30px 24px}body .testimonials .testimonials-intro h2{font-size:27px}}

/* One recognisable offer surface, two explicit choices. Both remain readable without JS. */
body .offerings{display:block;padding-block:76px 90px}
.offering-frame{border:1px solid var(--line-brand);border-radius:24px;overflow:hidden;background:linear-gradient(125deg,var(--surface-soft),#FFFFFF 76%)}
.offering-tabs{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:12px;background:#FFFFFF80;border-bottom:1px solid #43235B24}
.offering-tabs .story-choice{display:flex;align-items:center;justify-content:center;gap:16px;padding:20px 24px;border:1px solid transparent;border-radius:16px;color:var(--purple);text-decoration:none;line-height:1.4}
.offering-tabs strong{font-family:var(--heading);font-size:25px;font-weight:600}
.offering-tabs .story-choice>span{font-size:15px}
.offering-tabs .story-choice[aria-selected=true]{background:var(--purple);color:white}
.offering-tabs .story-choice[aria-selected=true]>span{color:var(--pink)}
body .offerings .offering-panel{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,.8fr);grid-template-rows:none;grid-row:auto;gap:clamp(32px,6vw,90px);padding:clamp(28px,4vw,58px);background:transparent;min-height:420px}
.offerings.story-ready .offering-panel[data-active=false]{display:none}
body .offerings .offering-copy h2{font-size:clamp(30px,3vw,42px);min-height:0;max-width:24ch}
body .offerings .offering-scope{border-top:0;border-left:1px solid #43235B24;padding:0 0 0 40px}
body .offerings .offering-cost-note{min-height:0;margin-bottom:24px}
.offering-tabs .story-choice:focus-visible{outline:3px solid var(--orange);outline-offset:2px}
.offerings .story-page:focus-visible{outline:3px solid var(--purple);outline-offset:-7px}
@media(max-width:760px){body .offerings{padding-block:48px 60px}.offering-tabs{padding:8px;gap:6px}.offering-tabs .story-choice{display:block;text-align:center;padding:14px 8px}.offering-tabs strong{display:block;font-size:21px}.offering-tabs .story-choice>span{display:block;font-size:12px;margin-top:5px}body .offerings .offering-panel{grid-template-columns:1fr;padding:28px 24px;gap:28px;min-height:0}body .offerings .offering-scope{border-left:0;border-top:1px solid #43235B24;padding:25px 0 0}body .offerings .offering-copy h2{font-size:30px}}
@media print{.offerings.story-ready .offering-panel[data-active=false]{display:grid}.offerings .offering-tabs{display:none}}

/* Light follows intent: only controls and linked panels react. */
body :is(.story-choice,.choice-menu button,.testimonials-controls button,.journal-card,.contact-topics a){transition:background-color 180ms ease,border-color 180ms ease,box-shadow 180ms ease,transform 180ms ease}
.build-links>article,.current-assignments>article:has(a){transition:box-shadow 200ms ease,border-color 200ms ease,transform 200ms ease}
@media(hover:hover) and (pointer:fine){
 body :is(.story-choice,.choice-menu button):hover{box-shadow:0 5px 18px #43235B14;transform:translateY(-2px)}
 body :is(.story-choice,.choice-menu button):not([aria-selected=true]):not([aria-pressed=true]):hover{background:#E7A6B529;border-color:#E7A6B5}
 .build-links>article:hover,.current-assignments>article:has(a):hover{border-color:var(--pink);box-shadow:0 12px 30px #43235B1A;transform:translateY(-3px)}
 .build-links>.build-eef:hover{box-shadow:0 12px 32px #43235B30,inset 0 0 70px #E7A6B51C}
 body .journal-card:hover{box-shadow:0 10px 26px #43235B12;transform:translateY(-3px)}
}
.build-links>article:focus-within,.current-assignments>article:focus-within{box-shadow:0 0 0 2px var(--pink),0 10px 28px #43235B1A}
@media(prefers-reduced-motion:reduce){body :is(.story-choice,.choice-menu button,.testimonials-controls button,.journal-card,.contact-topics a),.build-links>article,.current-assignments>article:has(a){transition:none;transform:none!important}}

.proposal-mail{display:block;width:fit-content;font-size:15px;line-height:1.6;min-height:44px;padding-top:14px;color:var(--purple);text-underline-offset:5px}
body .offerings .offering-scope .button{white-space:normal;text-align:left;max-width:100%}
body .social-opening{grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
body .social-opening h1{font-size:clamp(42px,4.1vw,62px)}
@media(max-width:760px){body .social-opening{grid-template-columns:1fr}body .social-opening h1{font-size:clamp(35px,9vw,49px)}}

/* The guide is an invitation between chapters, with breathing room before the footer. */
body .guide-teaser{width:auto;margin:52px var(--gutter) 76px;padding:clamp(30px,4vw,56px);border:1px solid #C4E88999;border-radius:26px;background:linear-gradient(115deg,#FFFFFF 5%,#C4E88945 58%,#C4E889E0 100%);gap:clamp(30px,5vw,72px);align-items:center}
body .guide-teaser h2{font-size:clamp(34px,3.4vw,48px)}
body .visitor-questions{background:linear-gradient(155deg,var(--surface-soft) 0%,#FFFFFF 85%)}
@media(max-width:760px){body .guide-teaser{margin-block:34px 52px;padding:30px 24px;gap:28px}body .guide-teaser h2{font-size:34px}}

/* Small connections make each field tangible without adding another paragraph. */
body .experience-overview>article>div:first-child{display:flex;flex-direction:column}
.work-connections{display:flex;flex-wrap:wrap;gap:12px 22px;position:relative;margin-top:auto;padding-top:50px;color:white}
.work-connections span{position:relative;padding-top:17px;font-size:14px;line-height:1.5;border-top:1px solid #FFFFFF60}
.work-connections span:before{content:"";position:absolute;top:-4px;left:0;width:7px;height:7px;border-radius:50%;background:var(--pink)}
.experience-overview>article:nth-child(n+2) .work-connections{color:var(--purple)}
.experience-overview>article:nth-child(n+2) .work-connections span{border-color:#43235B45}
.experience-overview>article:nth-child(n+2) .work-connections span:before{background:var(--purple)}
body .contact-followup{padding-bottom:90px}




@media(max-width:760px){.work-connections{padding-top:32px;gap:12px 18px}.work-connections span{font-size:13px}}

/* The Werkhuis explanation and preview form one shared surface. */
body .build-links>.build-workhouse{padding:32px;border:1px solid var(--line-brand);border-radius:24px;background:linear-gradient(130deg,var(--surface-soft),#FFFFFF 78%);gap:28px}
@media(max-width:760px){body .build-links>.build-workhouse{padding:28px 24px}}

/* Quiet response across content cards: no pointer cursor or suggestion of a hidden link. */
body :is(.experience-overview>article,.current-assignments>article,.offering-frame,.guide-teaser,.collab-card,.wt-benefits,.testimonials-shell,.assistant-intro,.choice-panels,.story-page){transition:box-shadow 240ms ease,border-color 240ms ease,transform 240ms ease}
body .experience-overview>article>div:first-child{transition:filter 240ms ease}
body :is(.about-v3,.social-office,.personal-v3,.contact-v3) img{transition:filter 300ms ease,box-shadow 300ms ease}
@media(hover:hover) and (pointer:fine){
 body :is(.experience-overview>article,.current-assignments>article,.offering-frame,.guide-teaser,.collab-card,.wt-benefits,.choice-panels,.story-page):hover{border-color:#E7A6B5A6;box-shadow:0 10px 32px #43235B12,inset 0 0 90px #E7A6B512;transform:translateY(-2px)}
 body .experience-overview>article:hover>div:first-child{filter:brightness(1.055)}
 body :is(.testimonials-shell,.assistant-intro):hover{box-shadow:0 12px 30px #43235B24,inset 0 0 120px #E7A6B51C;transform:translateY(-2px)}
 body :is(.about-v3,.social-office,.personal-v3,.contact-v3) img:hover{filter:brightness(1.035);box-shadow:0 12px 32px #43235B20}
}
@media(prefers-reduced-motion:reduce){body :is(.experience-overview>article,.current-assignments>article,.offering-frame,.guide-teaser,.collab-card,.wt-benefits,.testimonials-shell,.assistant-intro,.choice-panels,.story-page){transition:none;transform:none!important}body .experience-overview>article>div:first-child,body :is(.about-v3,.social-office,.personal-v3,.contact-v3) img{transition:none}}

/* Inset ribbon owns its inner spacing; the shared full-width section rule does not. */
body > main > section.experience-ribbon{padding-inline:clamp(28px,3.5vw,48px)!important}

/* Availability controls must stay hidden when display styles are applied. */
#vraagruimte [hidden], [data-assistant-panel] [hidden]{display:none!important}

/* Shared light and brand colour; contextual scenes give each opening its own setting. */
body .work-opening-v4{background-image:linear-gradient(90deg,#43235bef,#43235bcc 46%,#43235b8a),url('/assets/overleg-en-onderzoek-v4.webp');background-position:center,center 43%}
body .builds-opening{background-image:linear-gradient(90deg,#43235bf5,#43235bde 45%,#43235b6e),url('/assets/digitaal-werkatelier-mac-zilver-v7.webp');background-position:center,center 53%}
body .assistant-intro{background-image:linear-gradient(110deg,#43235bf0,#43235bba),url('/assets/digitaal-werkatelier-mac-zilver-v7.webp')}
body .guide-invitation{display:flex;align-items:center;justify-content:center;gap:32px;background:#c4e88938;border-block:1px solid #c4e88970;padding:8px var(--gutter);color:var(--purple)}
body .guide-invitation p{font-size:14px;line-height:1.4;margin:0}
body .guide-invitation a{display:inline-flex;align-items:center;gap:16px;min-height:36px;font-size:14px;font-weight:600;border-bottom:1px solid #43235b70;white-space:nowrap}
body .guide-invitation a:hover{border-color:var(--orange)}
@media(max-width:760px){body .guide-invitation{justify-content:space-between;gap:16px;padding-block:9px}body .guide-invitation p span{display:none}body .guide-invitation p{font-size:12px;max-width:130px}body .guide-invitation a{font-size:13px;white-space:normal;line-height:1.35;gap:10px}}

/* Distinct photographs per location, with a shared light and brand palette. */
body .work-opening-v4{background-image:linear-gradient(90deg,#43235bf5,#43235bdd 47%,#43235b66),url('/assets/overleg-shantie-v5.jpg');background-position:center,center 45%}
body .builds-opening{background-image:linear-gradient(90deg,#43235bf5,#43235bd9 47%,#43235b66),url('/assets/bouwstudio-prototype-v1.jpg')}
body .page-home .assistant-intro{background-image:linear-gradient(110deg,#43235bf0,#43235bba),url('/assets/assistent-gesprek-hoek-v1.jpg')}
body.page-home .assistant-intro{background-image:linear-gradient(110deg,#43235bf0,#43235bba),url('/assets/assistent-gesprek-hoek-v1.jpg')}
body.page-over-shantie .assistant-intro{background-image:linear-gradient(110deg,#43235bf0,#43235bba),url('/assets/assistent-perspectief-raam-v1.jpg')}
.profile-nav{display:flex;gap:8px;padding:18px var(--gutter);border-bottom:1px solid var(--line);background:white;flex-wrap:wrap}
.profile-nav a{padding:10px 17px;border:1px solid var(--line);border-radius:50px;text-decoration:none;color:var(--purple);font-size:14px}
.profile-nav a[aria-current=page]{background:var(--purple);color:white;border-color:var(--purple)}
.ai-opening-visual{align-self:center;border:1px solid var(--line);border-radius:24px;padding:clamp(28px,3.5vw,48px);background:linear-gradient(145deg,#43235B,#603E6D);color:white;box-shadow:0 20px 50px #43235b1a}
.ai-opening-visual>.eyebrow{color:var(--green);font-size:12px;margin-bottom:25px}.ai-opening-visual>div{display:flex;gap:20px;border-top:1px solid #ffffff40;padding:23px 0}.ai-opening-visual .aov-number{width:40px;height:40px;flex:none;border-radius:50%;border:1px solid #E7A6B5;color:var(--pink);display:grid;place-items:center;font-size:13px}.ai-opening-visual>div>p{margin:0;display:grid;gap:9px}.ai-opening-visual strong{font-size:25px;line-height:1.2;font-family:var(--heading);letter-spacing:-.02em}.ai-opening-visual p>span{font-size:17px;line-height:1.6;color:#ffffffdc}.ai-opening-visual .text-link{color:white;font-size:15px;margin-top:12px}
@media(max-width:560px){.profile-nav{padding-block:13px;gap:7px}.profile-nav a{font-size:13px;padding:9px 13px}.ai-opening-visual strong{font-size:22px}}
/* The profile links stay in the document flow on small screens too. */
body .profile-nav{position:static;box-shadow:none;margin:0;width:auto}

/* Orange remains the accent; dark purple keeps text readable on light brand surfaces. */
body .ai-v3-opening h1 em{color:var(--purple)}

/* Local preparation notice; remove only after the privacy inventory is approved. */
.legal-preparation{max-width:72rem;margin:0 auto 2rem;padding:1.5rem 2rem;border-left:4px solid var(--purple,#432359);background:#f7f1f8;border-radius:0 16px 16px 0}.legal-preparation p{margin:.5rem 0 0;max-width:65ch}