/* Komeback: shared styles for every page.
   Plain CSS, no build. Colours and type follow the Komeback brand book
   (gold CMYK 25 40 65 0, sand PMS 467 U, 90% and 100% black, handmade paper).
   Sections are themed with .t-shell (paper) / .t-sand (soft sand) / .t-dusk (gold sand) / .t-deep (charcoal);
   components read their colours from --fg / --fg-2 / --line / --kick / --card / --btn-* variables. */

/* ============ fonts (self-hosted) ============
   Cormorant Garamond (chosen by Rocco, October 2026) stands in for Quiche Flare and WindSong for Amalina (the brand fonts are commercial).
   The Cormorant face is declared at weight 500 only, so every title renders at 500, and size-adjust keeps it a touch smaller than Prata was.
   With a webfont licence for the originals: add their @font-face rules here and put the names
   first in --font-display and --font-script. */
@font-face{font-family:'Cormorant Garamond';font-style:normal;font-weight:500;font-display:swap;size-adjust:115%;src:url(/fonts/cormorant-garamond-latin-c47ff1.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'WindSong';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/windsong-latin-90fb64.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'WindSong';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/windsong-latin-ext-6e9c5b.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Jost';font-style:normal;font-weight:300 600;font-display:swap;src:url(/fonts/jost-latin-0428ef.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'Jost';font-style:normal;font-weight:300 600;font-display:swap;src:url(/fonts/jost-latin-ext-920dcb.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-mono-latin-d77319.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:400;font-display:swap;src:url(/fonts/ibm-plex-mono-latin-ext-9994c1.woff2) format('woff2');unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

/* ============ tokens ============ */
:root{
  /* brand colours (merkboek) */
  --gold:#bf935b;          /* CMYK 25 40 65 0 */
  --gold-2:#cbad7f;        /* PMS 467 U, the O in the logo */
  --gold-3:#d7bf9a;        /* the sand "variation" background */
  --gold-ink:#7e5a2c;      /* gold that stays readable as small text on paper */
  --charcoal:#393536;      /* 90% black */
  --black:#231f20;         /* 100% black */
  --paper:#f4f1ec;         /* handmade paper */
  --paper-2:#faf8f4;       /* cards on paper */
  --sand-soft:#ece2d3;     /* soft sand for alternating sections */
  --taupe:#787067;         /* handwriting */
  --ink:#393536;
  --ink-2:#6b625b;
  --on-dark:#f4f1ec;
  --on-dark-2:#cdc5bb;
  --line-light:rgba(57,53,54,.14);
  --line-strong:rgba(57,53,54,.32);
  --line-dark:rgba(244,241,236,.16);
  --tshadow:0 1px 2px rgba(20,16,17,.9),0 3px 12px rgba(20,16,17,.7),0 10px 44px rgba(20,16,17,.7);
  --tshadow-soft:0 1px 10px rgba(20,16,17,.45);
  --shadow:0 30px 60px -32px rgba(74,56,38,.42);
  /* type */
  --font-display:'Cormorant Garamond',Georgia,'Times New Roman',serif;
  --font-script:'WindSong','Brush Script MT',cursive;
  --font-body:'Jost',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-mono:'IBM Plex Mono',ui-monospace,monospace;
  /* buttons on light grounds */
  --btn-bg:var(--charcoal);--btn-fg:var(--paper);--btn-hover-bg:var(--gold);--btn-hover-fg:var(--black);
  /* motion and layout */
  --ease:cubic-bezier(.22,.8,.24,1);
  --ease-soft:cubic-bezier(.4,.14,.3,1);
  --gutter:clamp(20px,5.5vw,72px);
  --maxw:1180px;
  --radius:18px;
  --nav-h:72px;
  --paper-tex:url(/brand/paper.webp);
}

/* ============ base ============ */
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html,body{overflow-x:hidden;overflow-x:clip}
html{scroll-behavior:smooth;scroll-padding-top:calc(var(--nav-h) + 20px);-webkit-text-size-adjust:100%}
body{
  background:var(--paper) var(--paper-tex);background-size:640px;background-blend-mode:multiply;
  color:var(--ink);
  font-family:var(--font-body);
  font-size:17.5px;line-height:1.7;letter-spacing:.012em;font-weight:400;
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;
}
img,svg,video{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
ul,ol{list-style:none}
::selection{background:rgba(203,173,127,.4);color:inherit}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px}
.sr-only{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap}
.skip{position:absolute;left:-999px;top:10px;z-index:300;background:var(--charcoal);color:var(--paper);padding:.6em 1em;border-radius:8px;font-weight:500;text-decoration:none}
.skip:focus{left:10px}

/* ============ themes ============ */
.t-shell,.t-sand,.t-dusk{--fg:var(--ink);--fg-2:var(--ink-2);--line:var(--line-light);--kick:var(--gold-ink);--card:var(--paper-2);--card-line:rgba(57,53,54,.08);--link:var(--gold-ink);--dot:var(--gold);color:var(--fg);background-image:var(--paper-tex);background-size:640px;background-blend-mode:multiply}
.t-shell{background-color:var(--paper)}
.t-sand{background-color:var(--sand-soft)}
.t-dusk{background-color:var(--gold-3);--kick:#5e3f1b;--fg-2:#4f4843;--link:#5e3f1b;--card:rgba(250,248,244,.55);--card-line:rgba(57,53,54,.1);--line:rgba(57,53,54,.2);--dot:#7e5a2c}
.t-deep{--fg:var(--on-dark);--fg-2:var(--on-dark-2);--line:var(--line-dark);--kick:var(--gold-2);--card:rgba(244,241,236,.05);--card-line:rgba(244,241,236,.12);--link:var(--gold-2);--dot:var(--gold-2);color:var(--fg)}
.sec.t-deep{background-color:var(--charcoal)}
.t-deep,.hero,.page-hero,.quote-band,.list-card,.price-card,.place,.site-footer,.static-hero{--btn-bg:var(--gold-2);--btn-fg:var(--black);--btn-hover-bg:#e0c9a3;--btn-hover-fg:var(--black)}

/* ============ layout ============ */
.sec{position:relative;padding:clamp(84px,11vw,150px) var(--gutter)}
.sec.tight{padding-top:clamp(56px,7vw,90px);padding-bottom:clamp(56px,7vw,90px)}
.wrap{max-width:var(--maxw);margin:0 auto;position:relative;z-index:1}
.wrap.narrow{max-width:760px}
.split{display:grid;grid-template-columns:1fr 1fr;gap:clamp(34px,6vw,88px);align-items:center}
.split.wide-l{grid-template-columns:1.1fr .9fr}
.split.wide-r{grid-template-columns:.9fr 1.1fr}
@media(max-width:900px){.split,.split.wide-l,.split.wide-r{grid-template-columns:1fr}}
.center{text-align:center}
.center .lede,.center h2{margin-left:auto;margin-right:auto}

/* ============ type ============ */
h1,h2,h3,.display{font-family:var(--font-display);font-weight:400;line-height:1.14;letter-spacing:0}
h2{font-size:clamp(2rem,4.1vw,3.2rem);max-width:20ch}
h3{font-size:clamp(1.3rem,2vw,1.6rem);line-height:1.25}
h2 em,h1 em{font-style:normal;color:var(--kick)}
.kicker{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-body);font-weight:500;font-size:.72rem;line-height:1.2;letter-spacing:.3em;text-transform:uppercase;color:var(--kick);margin-bottom:1.5em}
.kicker::before{content:"";width:28px;height:1px;background:currentColor;opacity:.55}
.center .kicker{justify-content:center}
.script{font-family:var(--font-script);font-weight:400;font-size:clamp(1.9rem,3.4vw,2.7rem);line-height:1.1;letter-spacing:0;color:var(--script,var(--taupe));display:block}
.t-deep .script,.page-hero .script,.quote-band .script{--script:var(--gold-2)}
.t-dusk .script{--script:#5e4d3d}
.lede{margin-top:1.15em;color:var(--fg-2);font-size:1.1rem;max-width:54ch}
.lede.big{font-size:clamp(1.1rem,1.55vw,1.26rem);line-height:1.65}
.body-copy{margin-top:1.3em}
.body-copy p+p{margin-top:1.05em}
.body-copy p{color:var(--fg-2);max-width:58ch}
.body-copy strong{color:var(--fg);font-weight:500}
.mono{font-family:var(--font-mono);font-size:.8rem;letter-spacing:.08em}
.text-link{color:var(--link);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.25em;transition:color .3s var(--ease-soft)}
.text-link:hover{color:var(--fg)}
.arrow-link{display:inline-flex;align-items:center;gap:.55em;font-weight:500;text-decoration:none;color:var(--link);border-bottom:1px solid currentColor;padding-bottom:2px}
.arrow-link svg{width:16px;height:16px;transition:transform .35s var(--ease)}
.arrow-link:hover svg{transform:translateX(4px)}

/* ============ logo ============ */
.logo{display:inline-flex;align-items:center;color:inherit;text-decoration:none;line-height:0}
.logo svg{height:var(--logo-h,20px);width:auto;overflow:visible}
.logo .o,.hero-logo .o{fill:var(--gold-2)}
.logo-tagline{display:block;width:var(--tw,220px);max-width:100%;aspect-ratio:8.68;background:currentColor;-webkit-mask:url(/brand/tagline.svg) center/contain no-repeat;mask:url(/brand/tagline.svg) center/contain no-repeat}

/* ============ buttons ============ */
.btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.6em;min-height:48px;background:var(--btn-bg);color:var(--btn-fg);font-weight:500;font-size:.98rem;letter-spacing:.04em;padding:.8em 1.75em;border-radius:999px;text-decoration:none;border:1px solid transparent;cursor:pointer;transition:background .35s var(--ease-soft),transform .35s var(--ease-soft),box-shadow .35s var(--ease-soft),border-color .3s,color .3s}
.btn:hover{background:var(--btn-hover-bg);color:var(--btn-hover-fg);transform:translateY(-2px);box-shadow:0 14px 30px -12px rgba(74,56,38,.45)}
.btn svg{width:19px;height:19px;flex:none}
.btn.gold{--btn-bg:var(--gold);--btn-fg:var(--black);--btn-hover-bg:var(--charcoal);--btn-hover-fg:var(--paper)}
.btn.dark{--btn-bg:var(--charcoal);--btn-fg:var(--paper);--btn-hover-bg:var(--gold);--btn-hover-fg:var(--black)}
.btn.ghost{background:transparent;color:var(--fg,var(--ink));border-color:var(--line-strong)}
.t-deep .btn.ghost,.page-hero .btn.ghost,.static-hero .btn.ghost,.list-card .btn.ghost{color:var(--on-dark);border-color:rgba(244,241,236,.42)}
/* over video and photos: light text on a soft dark glass, so the button stays readable on every frame */
.hero .btn.ghost,.page-hero .btn.ghost{color:#fff;border-color:rgba(255,255,255,.72);background:rgba(20,16,17,.34);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);text-shadow:0 1px 2px rgba(20,16,17,.5)}
.hero .btn.ghost:hover,.page-hero .btn.ghost:hover{color:#fff;border-color:var(--gold-2);background:rgba(20,16,17,.5)}
.btn.ghost:hover{background:transparent;border-color:var(--gold);color:var(--fg,var(--ink));box-shadow:none}
.t-deep .btn.ghost:hover,.page-hero .btn.ghost:hover,.static-hero .btn.ghost:hover,.list-card .btn.ghost:hover{color:var(--on-dark);border-color:var(--gold-2)}
.btn.sm{min-height:40px;padding:.5em 1.2em;font-size:.9rem}
/* a slow breathing ring on the main call to action */
.btn.breathe::after{content:"";position:absolute;inset:-5px;border-radius:inherit;border:1px solid var(--gold);opacity:0;pointer-events:none;animation:btnbreathe 7s var(--ease-soft) infinite}
@keyframes btnbreathe{0%,55%,100%{opacity:0;transform:scale(.97)}25%{opacity:.6;transform:scale(1.05)}}
.cta-row{display:flex;flex-wrap:wrap;gap:12px;align-items:center;margin-top:2.2em}
.center .cta-row{justify-content:center}

/* ============ badges and facts ============ */
.badge{display:inline-flex;align-items:center;gap:.45em;font-family:var(--font-body);font-size:.68rem;font-weight:600;letter-spacing:.16em;text-transform:uppercase;padding:.5em .95em;border-radius:999px;background:var(--paper-2);color:var(--ink);box-shadow:0 6px 18px rgba(35,31,32,.14)}
.badge.gratis,.badge.actie{background:var(--gold);color:var(--black)}
.badge.nieuw{background:var(--gold-3);color:var(--black)}
.badge.binnenkort{background:var(--charcoal);color:var(--paper)}
.badge.volzet{background:#7d7672;color:#fff}
.badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor;opacity:.8;animation:dotpulse 2.4s var(--ease-soft) infinite}
@keyframes dotpulse{50%{opacity:.25}}
.facts{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.8em}
.facts li{display:inline-flex;align-items:center;gap:.6em;padding:.5em 1.05em;border:1px solid var(--line);border-radius:999px;font-size:.92rem;color:var(--fg-2);background:color-mix(in srgb,var(--card) 70%,transparent)}
.facts li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--dot,var(--gold))}

/* ============ navigation ============ */
.site-nav{position:fixed;inset:0 0 auto 0;z-index:100;color:var(--paper);--btn-bg:var(--gold-2);--btn-fg:var(--black);--btn-hover-bg:var(--paper);--btn-hover-fg:var(--black);transition:background .5s var(--ease-soft),box-shadow .5s var(--ease-soft),color .5s var(--ease-soft)}
.nav-row{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:20px;height:var(--nav-h);padding:0 clamp(18px,4vw,48px)}
.nav-cta{white-space:nowrap}
.site-nav .logo{--logo-h:clamp(16px,1.6vw,20px);filter:drop-shadow(0 1px 10px rgba(20,16,17,.35))}
.site-nav.solid,.menu-open .site-nav{background:rgba(244,241,236,.92);backdrop-filter:blur(16px) saturate(1.1);-webkit-backdrop-filter:blur(16px) saturate(1.1);color:var(--ink);box-shadow:0 1px 0 var(--line-light);--btn-bg:var(--charcoal);--btn-fg:var(--paper);--btn-hover-bg:var(--gold);--btn-hover-fg:var(--black)}
.site-nav.solid .logo,.menu-open .site-nav .logo{filter:none}
.nav-links{display:flex;gap:clamp(16px,2.4vw,34px);align-items:center}
.nav-links a{position:relative;text-decoration:none;font-size:.92rem;letter-spacing:.03em;color:inherit;opacity:.9;text-shadow:var(--tshadow-soft);transition:opacity .3s var(--ease-soft)}
.site-nav.solid .nav-links a{text-shadow:none;opacity:.85}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:-6px;height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .45s var(--ease)}
.nav-links a:hover,.nav-links a[aria-current="page"]{opacity:1}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{transform:scaleX(1)}
.nav-end{display:flex;align-items:center;gap:12px}
.menu-btn{display:none;align-items:center;gap:10px;min-height:44px;padding:0 4px;color:inherit;font-size:.92rem;letter-spacing:.06em;text-shadow:var(--tshadow-soft)}
.site-nav.solid .menu-btn,.menu-open .menu-btn{text-shadow:none}
.menu-btn i{position:relative;width:22px;height:12px}
.menu-btn i::before,.menu-btn i::after{content:"";position:absolute;left:0;right:0;height:1.5px;background:currentColor;border-radius:2px;transition:transform .4s var(--ease),top .4s var(--ease)}
.menu-btn i::before{top:2px}.menu-btn i::after{top:9px}
.menu-open .menu-btn i::before{top:5.5px;transform:rotate(45deg)}
.menu-open .menu-btn i::after{top:5.5px;transform:rotate(-45deg)}
.nav-links a.in{opacity:1}
.has-sub{position:relative;display:flex;align-items:center;gap:2px}
.sub-btn{width:26px;height:30px;display:grid;place-items:center;color:inherit;opacity:.8;border-radius:6px}
.sub-btn svg{width:12px;height:12px;transition:transform .35s var(--ease)}
.has-sub.open .sub-btn svg,.has-sub:hover .sub-btn svg{transform:rotate(180deg)}
.nav-sub{position:absolute;top:calc(100% + 14px);left:-22px;min-width:230px;padding:10px;border-radius:16px;background:rgba(250,248,244,.98);color:var(--ink);box-shadow:0 24px 50px -18px rgba(35,31,32,.35),0 0 0 1px var(--line-light);opacity:0;visibility:hidden;transform:translateY(6px);transition:opacity .3s var(--ease-soft),transform .3s var(--ease-soft),visibility 0s .3s}
.nav-sub::before{content:"";position:absolute;left:0;right:0;top:-16px;height:16px}
.has-sub:hover .nav-sub,.has-sub:focus-within .nav-sub,.has-sub.open .nav-sub{opacity:1;visibility:visible;transform:none;transition:opacity .3s var(--ease-soft),transform .3s var(--ease-soft)}
.nav-links .nav-sub a{display:block;padding:.6em .9em;border-radius:10px;text-shadow:none;opacity:1;color:var(--ink);font-size:.95rem}
.nav-links .nav-sub a::after{display:none}
.nav-links .nav-sub a:hover,.nav-links .nav-sub a[aria-current="page"]{background:var(--sand-soft);color:var(--gold-ink)}
.lang-switch{display:inline-flex;align-items:center;gap:6px;min-height:40px;padding:0 6px;font-size:.82rem;letter-spacing:.08em;text-decoration:none;color:inherit;text-shadow:var(--tshadow-soft);opacity:.85}
.lang-switch b{font-weight:600;opacity:1;border-bottom:1px solid var(--gold)}
.lang-switch i{font-style:normal;opacity:.5}
.lang-switch:hover{opacity:1}
.site-nav.solid .lang-switch,.menu-open .lang-switch{text-shadow:none}
@media(max-width:1120px){.nav-links{gap:18px}.nav-links a{font-size:.88rem}}
@media(max-width:980px){.nav-links{display:none}.menu-btn{display:inline-flex}}
@media(max-width:560px){.nav-end{gap:8px}.nav-end .btn.sm{padding:.45em .95em;font-size:.84rem;min-height:38px}.lang-switch{display:none}}
@media(max-width:360px){.nav-end .btn.sm{display:none}}
.menu{position:fixed;inset:0;z-index:99;background:var(--paper) var(--paper-tex);background-size:640px;background-blend-mode:multiply;color:var(--ink);display:flex;flex-direction:column;justify-content:safe center;padding:calc(var(--nav-h) + 20px) var(--gutter) 40px;opacity:0;visibility:hidden;overflow-x:hidden;overflow-y:auto;transition:opacity .45s var(--ease-soft),visibility 0s .45s}
.menu-open .menu{opacity:1;visibility:visible;transition:opacity .45s var(--ease-soft)}
.menu ul{display:grid;gap:4px;position:relative;z-index:1}
.menu ul a{display:block;font-family:var(--font-display);font-size:clamp(1.7rem,7vw,2.4rem);line-height:1.3;text-decoration:none;color:var(--ink);opacity:0;transform:translateY(16px);transition:opacity .5s var(--ease),transform .5s var(--ease),color .3s}
.menu ul a:hover,.menu ul a[aria-current="page"]{color:var(--gold-ink)}
.menu-open .menu ul a{opacity:1;transform:none}
.menu-open .menu li:nth-child(2) a{transition-delay:.05s}.menu-open .menu li:nth-child(3) a{transition-delay:.1s}.menu-open .menu li:nth-child(4) a{transition-delay:.15s}.menu-open .menu li:nth-child(5) a{transition-delay:.2s}
.menu .menu-contact{margin-top:2.4em;display:flex;flex-wrap:wrap;gap:12px;position:relative;z-index:1}
.menu .script{margin-top:1.2em;position:relative;z-index:1}
.menu .menu-group>span{display:block;margin:.5em 0 .1em;font-size:.72rem;font-weight:500;letter-spacing:.3em;text-transform:uppercase;color:var(--gold-ink)}
.menu .menu-group ul{gap:0;padding-left:1em;border-left:1px solid var(--line-strong);margin:.2em 0 .5em}
.menu .menu-group ul a{font-size:clamp(1.3rem,5.4vw,1.7rem)}
.menu-lang{margin-top:1.4em;position:relative;z-index:1}
.menu-lang a{font-size:.95rem;letter-spacing:.08em;color:var(--ink);text-underline-offset:.3em;text-decoration-color:var(--gold)}
.menu-open{overflow:hidden}

/* announcement bar (filled from ACTUEEL in site.js) */
.announce{display:none;align-items:center;justify-content:center;gap:12px;padding:8px 48px 8px 16px;background:var(--gold-3) var(--paper-tex);background-size:640px;background-blend-mode:multiply;font-size:.88rem;color:var(--black);position:relative}
.site-nav.solid .announce.on,.site-nav.always .announce.on{display:flex}
.announce a{text-decoration:none;display:inline-flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:center}
.announce a span:last-child{text-decoration:underline;text-underline-offset:.25em;text-decoration-color:rgba(35,31,32,.45)}
.announce .badge{box-shadow:none;padding:.35em .75em;font-size:.6rem;background:var(--charcoal);color:var(--paper)}
.announce button{position:absolute;right:10px;top:50%;transform:translateY(-50%);width:34px;height:34px;border-radius:50%;display:grid;place-items:center;color:var(--black);font-size:1.2rem;line-height:1}
.announce button:hover{background:rgba(255,255,255,.3)}

/* ============ botanical line drawings (like the brand banner) ============ */
.leaf{position:absolute;pointer-events:none;z-index:0;width:var(--lw,220px);height:auto;opacity:var(--lo,.8);transform-origin:50% 100%;animation:sway var(--ld,12s) var(--ease-soft) infinite alternate}
.leaf.flip{scale:-1 1}
.leaf.hang{transform-origin:50% 50%;scale:-1 -1}
.leaf.hang.flip{scale:1 -1}
@keyframes sway{from{rotate:var(--lr0,-2deg)}to{rotate:var(--lr1,2.5deg)}}
.t-deep .leaf,.page-hero .leaf{--lo:.28}
.has-leaves{overflow:hidden}
@media(max-width:760px){.leaf{--lw:150px}}

/* ============ rotator: one spot, a new photo every few seconds ============ */
.rot{position:relative;overflow:hidden;border-radius:var(--radius);aspect-ratio:var(--ar,4/5);background:var(--sand-soft);isolation:isolate;box-shadow:var(--shadow)}
.t-deep .rot{background:#2b2728;box-shadow:0 30px 60px -28px rgba(10,8,8,.6)}
.rot>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transform:scale(1.03);transition:opacity var(--fade,2.2s) var(--ease-soft)}
.rot>img.on{opacity:1;transform:scale(1.085);transition:opacity var(--fade,2.2s) var(--ease-soft),transform var(--kb,12s) linear}
.rot>img.on.first{transform:scale(1.03)}
/* the outgoing photo stays underneath until the new one is fully in (no dip in the crossfade)
   and keeps drifting at the same pace, so nothing jumps while the next one fades in */
.rot>img.out{opacity:1;transform:scale(1.085);z-index:0;transition:transform var(--kb,12s) linear}
.rot>img.on{z-index:1}
.rot.bare{border-radius:0;box-shadow:none}
/* reveal on entry: the frame opens from the bottom */
.js .reveal{clip-path:inset(14% 0 0 0 round var(--radius));opacity:.001;transform:translateY(34px);transition:clip-path 1.25s var(--ease),opacity 1s var(--ease-soft),transform 1.25s var(--ease)}
.js .reveal.in{clip-path:inset(0 0 0 0 round var(--radius));opacity:1;transform:none}

/* mosaics */
.mosaic{display:grid;gap:clamp(10px,1.4vw,16px)}
.mosaic .rot{--ar:auto;aspect-ratio:auto;height:100%;min-height:160px}
.mosaic-intro{grid-template-columns:1.15fr 1fr;grid-template-rows:1fr 1fr;aspect-ratio:1.04}
.mosaic-intro .m-big{grid-row:span 2}
.mosaic-six{grid-template-columns:repeat(3,1fr)}
.mosaic-six .rot,.mosaic-four .rot,.mosaic-food .rot{min-height:0}
.mosaic-six .rot{aspect-ratio:4/5;height:auto}
.mosaic-four{grid-template-columns:1fr 1fr;align-items:end}
.mosaic-four .rot{aspect-ratio:4/5;height:auto}
.mosaic-four .rot.land{aspect-ratio:4/3}
.mosaic-food{grid-template-columns:1fr 1fr 1fr;align-items:start}
.mosaic-food .rot{aspect-ratio:3/4;height:auto}
.mosaic-food .rot:nth-child(2){margin-top:clamp(20px,5vw,70px)}
@media(max-width:760px){
  .mosaic-intro{aspect-ratio:auto;grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .mosaic-intro .m-big{grid-column:span 2;grid-row:auto;aspect-ratio:4/5}
  .mosaic-intro .rot:not(.m-big){aspect-ratio:1}
  .mosaic-six{grid-template-columns:1fr 1fr}
  .mosaic-food{grid-template-columns:1fr 1fr}
  .mosaic-food .rot:nth-child(2){margin-top:0}
  .mosaic-food .rot:nth-child(3){grid-column:span 2;aspect-ratio:4/3}
}

/* marquee: a slow drifting film strip (JS clones the track once for the loop) */
.marquee{position:relative;z-index:1;overflow:hidden;--h:clamp(190px,25vw,330px);padding:6px 0 30px;mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.marquee-track{display:flex;width:max-content}
.marquee.run .marquee-track{animation:mq var(--dur,110s) linear infinite}
.marquee:hover .marquee-track,.marquee:focus-within .marquee-track{animation-play-state:paused}
.marquee-track figure{flex:none;margin-right:clamp(10px,1.4vw,16px);height:var(--h);border-radius:14px;overflow:hidden;background:var(--sand-soft)}
.t-deep .marquee-track figure{background:#2b2728}
.marquee-track figure:nth-child(even){transform:translateY(clamp(10px,2vw,26px))}
.marquee-track img{height:100%;width:auto;object-fit:cover;transition:transform 1.2s var(--ease)}
.marquee-track figure:hover img{transform:scale(1.05)}
@keyframes mq{to{transform:translateX(-50%)}}

/* waves between two sections */
.waves{position:absolute;left:0;right:0;bottom:-1px;height:clamp(46px,6vw,84px);pointer-events:none;z-index:2}
.waves i{position:absolute;inset:0;background-repeat:repeat-x;background-position:0 100%;background-size:1440px 100%}
.waves .w1{animation:wavex 38s linear infinite;transform:translateY(-10px)}
.waves .w2{animation:wavex 26s linear infinite reverse;background-position:-420px 100%;transform:translateY(8px)}
.waves.to-shell .w2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 180 18 360 18 540 46 S 900 74 1080 46 S 1260 18 1440 46 V80 H0Z' fill='%23f4f1ec'/%3E%3C/svg%3E")}
.waves.to-sand .w2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 180 18 360 18 540 46 S 900 74 1080 46 S 1260 18 1440 46 V80 H0Z' fill='%23ece2d3'/%3E%3C/svg%3E")}
.waves.to-deep .w2{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 180 18 360 18 540 46 S 900 74 1080 46 S 1260 18 1440 46 V80 H0Z' fill='%23393536'/%3E%3C/svg%3E")}
.waves.to-shell .w1,.waves.to-sand .w1{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 180 18 360 18 540 46 S 900 74 1080 46 S 1260 18 1440 46 V80 H0Z' fill='%23cbad7f' fill-opacity='0.45'/%3E%3C/svg%3E")}
.waves.to-deep .w1{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 80' preserveAspectRatio='none'%3E%3Cpath d='M0 46 C 180 18 360 18 540 46 S 900 74 1080 46 S 1260 18 1440 46 V80 H0Z' fill='%23bf935b' fill-opacity='0.55'/%3E%3C/svg%3E")}
@keyframes wavex{to{background-position-x:1440px}}

/* ============ scroll-driven fx (reversible, scrubbed by --sk) ============ */
[data-sfx]{--sk:0}
.sh .w{display:inline-block;--kc:clamp(0,(var(--sk,0) - var(--th,0))*3,1);opacity:var(--kc);transform:translateY(calc((1 - var(--kc))*26px))}
[data-parallax]>.rot,[data-parallax].rot{translate:0 var(--py,0px)}
@media(max-width:900px){[data-parallax]>.rot,[data-parallax].rot{translate:none}}
/* entrances */
.js .fx .part{opacity:0;transform:translateY(26px);transition:opacity .9s var(--ease-soft),transform .9s var(--ease-soft)}
.js .fx.in .part{opacity:1;transform:none}
.js .fx.in .part.d1{transition-delay:.12s}.js .fx.in .part.d2{transition-delay:.24s}.js .fx.in .part.d3{transition-delay:.36s}.js .fx.in .part.d4{transition-delay:.48s}.js .fx.in .part.d5{transition-delay:.6s}
.js .fx.done .part{transition-delay:0s}

/* ============ offers ============ */
.offers{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2vw,26px);margin-top:clamp(40px,6vw,70px);align-items:stretch}
.offer{position:relative;display:flex;flex-direction:column;background:var(--paper-2);border:1px solid var(--card-line);border-radius:22px;overflow:hidden;box-shadow:0 30px 60px -40px rgba(74,56,38,.5);transition:transform .5s var(--ease),box-shadow .5s var(--ease)}
.offer:hover{transform:translateY(-6px);box-shadow:0 40px 70px -40px rgba(74,56,38,.6)}
.offer.featured{border-color:rgba(191,147,91,.6);box-shadow:0 34px 70px -38px rgba(126,90,44,.55)}
.offer .rot{border-radius:0;box-shadow:none;aspect-ratio:4/3.4}
.offer .badge{position:absolute;top:16px;left:16px;z-index:3}
.offer-body{display:flex;flex-direction:column;gap:14px;padding:26px 26px 28px;flex:1}
.offer-kicker{font-size:.7rem;letter-spacing:.24em;text-transform:uppercase;color:var(--kick);font-weight:500}
.offer h3{font-size:clamp(1.55rem,2.1vw,1.85rem)}
.offer p{color:var(--fg-2);font-size:.98rem}
.offer .meta{display:grid;gap:7px;font-size:.93rem;color:var(--fg)}
.offer .meta li{display:flex;gap:10px;align-items:baseline}
.offer .meta li::before{content:"";flex:none;width:14px;height:1px;background:var(--gold);transform:translateY(-4px)}
.price-row{margin-top:auto;padding-top:16px;border-top:1px solid var(--line);display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.price-row .label{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-2)}
.price-row .amount{font-family:var(--font-display);font-size:1.35rem;color:var(--fg)}
.price-row .amount s{font-size:1rem;color:var(--fg-2);margin-right:.35em}
.offer .btn{width:100%}
.offers-note{margin-top:clamp(28px,4vw,44px);text-align:center;color:var(--fg-2)}
@media(max-width:980px){.offers{grid-template-columns:1fr;max-width:560px;margin-left:auto;margin-right:auto}.offer .rot{aspect-ratio:16/10}}

/* tiles (outcomes, principles) */
.tiles{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:clamp(36px,5vw,60px)}
.tiles.three{grid-template-columns:repeat(3,1fr)}
.tile{padding:28px 24px;border-radius:var(--radius);background:var(--card);border:1px solid var(--card-line);transition:transform .45s var(--ease),border-color .45s}
.tile:hover{transform:translateY(-4px);border-color:rgba(191,147,91,.45)}
.tile svg{width:42px;height:42px;margin-bottom:1.1em;overflow:visible}
.tile svg *{fill:none;stroke:var(--gold);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:220;stroke-dashoffset:220;transition:stroke-dashoffset 1.6s var(--ease-soft) .25s}
.t-deep .tile svg *{stroke:var(--gold-2)}
.fx.in .tile svg *{stroke-dashoffset:0}
.tile h3{font-size:1.25rem;margin-bottom:.45em}
.tile p{color:var(--fg-2);font-size:.95rem}
@media(max-width:980px){.tiles,.tiles.three{grid-template-columns:1fr 1fr}}
@media(max-width:520px){.tiles,.tiles.three{grid-template-columns:1fr}}

/* practical facts table */
.practical{display:grid;border-top:1px solid var(--line)}
.practical>div{display:grid;grid-template-columns:minmax(120px,.42fr) 1fr;gap:18px;padding:15px 0;border-bottom:1px solid var(--line)}
.practical dt{font-size:.76rem;letter-spacing:.16em;text-transform:uppercase;color:var(--fg-2);padding-top:.25em}
.practical dd{color:var(--fg)}
.price-card{position:relative;border-radius:24px;padding:clamp(26px,3.4vw,40px);background:var(--charcoal);color:var(--on-dark);box-shadow:0 40px 80px -40px rgba(35,31,32,.6);overflow:hidden}
.price-card::before{content:"";position:absolute;width:340px;height:340px;right:-120px;top:-140px;border-radius:50%;background:radial-gradient(circle,rgba(203,173,127,.28),transparent 70%)}
.price-card .label{font-size:.72rem;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2)}
.price-card .amount{display:block;font-family:var(--font-display);font-size:clamp(2rem,3.6vw,2.6rem);margin:.3em 0 .15em;line-height:1.15}
.price-card .per{color:var(--on-dark-2)}
.price-card p{color:var(--on-dark-2);margin-top:1em;font-size:.96rem}
.price-card .btn{margin-top:1.6em;width:100%}
.price-card .small{display:block;text-align:center;margin-top:1em;font-size:.86rem;color:var(--on-dark-2)}
.price-card .small a{color:var(--on-dark)}

/* FAQ */
.faq{margin-top:clamp(30px,4vw,48px);max-width:780px}
.center .faq{margin-left:auto;margin-right:auto;text-align:left}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:1em;padding:1.25em 0;font-family:var(--font-display);font-size:clamp(1.08rem,1.6vw,1.22rem);line-height:1.35;transition:color .3s var(--ease-soft)}
.faq summary::-webkit-details-marker{display:none}
.faq summary:hover{color:var(--link)}
.faq summary::after{content:"";flex:none;width:30px;height:30px;border-radius:50%;border:1px solid var(--line-strong);background:linear-gradient(currentColor,currentColor) center/11px 1.5px no-repeat,linear-gradient(currentColor,currentColor) center/1.5px 11px no-repeat;transition:transform .45s var(--ease),background-size .45s var(--ease),border-color .3s}
.faq details[open] summary::after{transform:rotate(180deg);background-size:11px 1.5px,1.5px 0;border-color:var(--gold)}
.faq .answer{overflow:hidden}
.faq .answer p{padding:0 0 1.4em;color:var(--fg-2);max-width:62ch}

/* steps (how it works) */
.how{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:2.4em;counter-reset:how}
.how li{counter-increment:how;padding:20px 22px;border-radius:16px;background:var(--card);border:1px solid var(--card-line);text-align:left}
.how li::before{content:"0" counter(how);display:block;font-family:var(--font-mono);font-size:.75rem;letter-spacing:.14em;color:var(--kick);margin-bottom:.7em}
.how b{display:block;font-family:var(--font-display);font-size:1.15rem;font-weight:400;margin-bottom:.25em}
.how span{color:var(--fg-2);font-size:.93rem}
@media(max-width:760px){.how{grid-template-columns:1fr}}

/* quote */
.quote{font-family:var(--font-display);font-size:clamp(1.6rem,3.6vw,2.7rem);line-height:1.3;max-width:24ch}
.quote-by{display:block;margin-top:.6em}

/* ============ page hero (subpages) ============ */
.page-hero{position:relative;min-height:max(560px,88svh);display:flex;align-items:flex-end;padding:calc(var(--nav-h) + 60px) var(--gutter) clamp(54px,8vw,96px);color:var(--on-dark);overflow:hidden;isolation:isolate}
.page-hero>.rot{position:absolute;inset:0;border-radius:0;aspect-ratio:auto;z-index:-2;box-shadow:none;background:#2b2728}
.page-hero::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(180deg,rgba(20,16,17,.5) 0%,rgba(20,16,17,.08) 32%,rgba(20,16,17,.18) 55%,rgba(20,16,17,.8) 100%),linear-gradient(90deg,rgba(20,16,17,.5),rgba(20,16,17,0) 62%)}
.page-hero .wrap{width:100%}
.page-hero h1{font-size:clamp(2.9rem,8vw,6rem);line-height:1.02;text-shadow:0 2px 30px rgba(20,16,17,.45)}
.page-hero .script{margin-top:.15em;text-shadow:0 1px 14px rgba(20,16,17,.55)}
.split-hero .script{font-size:clamp(1.7rem,2.6vw,2.3rem)}
.page-hero .lede{color:#efe9e1;font-size:clamp(1.06rem,1.55vw,1.25rem);max-width:46ch;text-shadow:0 1px 14px rgba(20,16,17,.6)}
.page-hero .kicker{color:var(--gold-2);text-shadow:0 1px 8px rgba(20,16,17,.7)}
.page-hero .facts li{color:#f1ece5;border-color:rgba(244,241,236,.32);background:rgba(20,16,17,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.page-hero .facts li::before{background:var(--gold-2)}
.page-hero .status{margin-top:1.4em}
.crumbs{display:flex;gap:.6em;font-size:.8rem;letter-spacing:.06em;color:#ddd5cb;margin-bottom:1.6em}
.crumbs a{color:#ddd5cb;text-decoration:none}
.crumbs a:hover{color:#fff}
.page-hero.split-hero{align-items:center;min-height:max(620px,92svh);background:radial-gradient(ellipse 70% 60% at 82% 30%,rgba(203,173,127,.16),transparent 60%),radial-gradient(ellipse 60% 60% at 8% 92%,rgba(191,147,91,.12),transparent 60%),var(--charcoal)}
.page-hero.split-hero .lede{text-shadow:none;color:var(--on-dark-2)}
.page-hero.split-hero::before{display:none}
.page-hero.split-hero .split{width:100%}
.scroll-hint{position:absolute;left:50%;bottom:22px;transform:translateX(-50%);width:22px;height:22px;color:rgba(255,255,255,.75);animation:cue 2.6s var(--ease-soft) -1.2s infinite}
@keyframes cue{0%,100%{transform:translateX(-50%) translateY(0)}50%{transform:translateX(-50%) translateY(8px)}}
/* the hero type settles from a soft blur */
.js .settle{opacity:0;filter:blur(10px);transform:translateY(14px);animation:settle 1.3s var(--ease) .15s forwards}
.js .settle.s2{animation-delay:.35s}.js .settle.s3{animation-delay:.55s}.js .settle.s4{animation-delay:.75s}.js .settle.s5{animation-delay:.95s}
@keyframes settle{to{opacity:1;filter:blur(0);transform:none}}

/* ============ session steps (zigzag) ============ */
.steps-list{display:grid;gap:clamp(70px,10vw,130px);margin-top:clamp(50px,7vw,90px)}
.step-row{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,6vw,90px);align-items:center}
.step-row:nth-child(even) .step-media{order:2}
.step-num{display:block;font-family:var(--font-display);font-size:clamp(4rem,8vw,6.6rem);line-height:.85;color:transparent;-webkit-text-stroke:1px rgba(203,173,127,.65);margin-bottom:.2em}
.step-row h3{font-size:clamp(1.7rem,2.8vw,2.3rem);margin-bottom:.45em}
.step-row p{color:var(--fg-2);max-width:46ch}
.step-media{display:grid;gap:14px;grid-template-columns:1fr}
.step-media.pair{grid-template-columns:1.25fr 1fr;align-items:end}
.step-media.pair .rot:last-child{margin-bottom:clamp(-30px,-3vw,-10px)}
.step-row .rot.land{--ar:4/3}
@media(max-width:860px){.step-row{grid-template-columns:1fr}.step-row:nth-child(even) .step-media{order:0}}

/* toolbox chips */
.chips{display:flex;flex-wrap:wrap;gap:10px;margin-top:1.8em}
.chips li{padding:.55em 1.1em;border-radius:999px;background:var(--card);border:1px solid var(--card-line);font-size:.95rem}

/* place card (no photo: drawn icons) */
.place{position:relative;border-radius:28px;overflow:hidden;padding:clamp(34px,5vw,64px);background:radial-gradient(ellipse 80% 70% at 85% 10%,rgba(203,173,127,.22),transparent 60%),linear-gradient(160deg,#47413f,#2b2728 72%);color:var(--on-dark);--kick:var(--gold-2)}
.place .lede{color:var(--on-dark-2)}
.place-icons{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:2.4em}
.place-icons li{display:flex;flex-direction:column;align-items:flex-start;gap:12px;padding:20px;border-radius:16px;background:rgba(244,241,236,.05);border:1px solid rgba(244,241,236,.14)}
.place-icons svg{width:40px;height:40px}
.place-icons svg *{fill:none;stroke:var(--gold-2);stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.place-icons .bubbles circle{animation:bubbleup 3.2s var(--ease-soft) infinite}
.place-icons .bubbles circle:nth-child(2){animation-delay:.9s}.place-icons .bubbles circle:nth-child(3){animation-delay:1.7s}
@keyframes bubbleup{0%{transform:translateY(4px);opacity:0}30%{opacity:1}100%{transform:translateY(-8px);opacity:0}}
.place-icons .flame{transform-origin:50% 100%;animation:flicker 2.8s var(--ease-soft) infinite}
@keyframes flicker{0%,100%{transform:scaleY(1)}40%{transform:scaleY(1.08) skewX(2deg)}70%{transform:scaleY(.95) skewX(-2deg)}}
@media(max-width:760px){.place-icons{grid-template-columns:1fr 1fr}}

/* teaser (cross-sell) */
.teaser{display:grid;grid-template-columns:1fr 1.1fr;gap:0;border-radius:28px;overflow:hidden;background:var(--paper-2);border:1px solid var(--card-line);box-shadow:0 34px 70px -44px rgba(74,56,38,.5)}
.teaser .rot{border-radius:0;box-shadow:none;aspect-ratio:auto;min-height:360px}
.teaser-body{padding:clamp(28px,4vw,56px);display:flex;flex-direction:column;justify-content:center}
@media(max-width:860px){.teaser{grid-template-columns:1fr}.teaser .rot{min-height:0;aspect-ratio:16/10}}

/* ============ retreat day timeline ============ */
.day{position:relative}
.day-item{position:relative;padding:clamp(70px,9vw,120px) var(--gutter);background-image:var(--paper-tex),linear-gradient(180deg,var(--from),var(--to));background-size:640px,100% 100%;background-blend-mode:multiply}
.day-item>.wrap{display:grid;grid-template-columns:.85fr 1.15fr;gap:clamp(30px,6vw,90px);align-items:center}
.day-item:nth-child(even)>.wrap{grid-template-columns:1.15fr .85fr}
.day-item:nth-child(even) .day-text{order:2}
.day-time{display:inline-flex;align-items:center;gap:12px;font-family:var(--font-mono);font-size:.84rem;letter-spacing:.12em;color:var(--kick);margin-bottom:1.2em}
.day-time::before{content:"";width:9px;height:9px;border-radius:50%;background:currentColor;box-shadow:0 0 0 5px color-mix(in srgb,currentColor 18%,transparent)}
.day-item h3{font-size:clamp(1.7rem,3vw,2.4rem);margin-bottom:.45em}
.day-item p{color:var(--fg-2);max-width:44ch}
.day-media{display:grid;gap:14px}
.day-media.pair{grid-template-columns:1.3fr 1fr;align-items:end}
.day-media.pair>.rot:last-child{margin-bottom:-26px}
.day-media .rot.land{--ar:4/3}
/* sunset into evening: a long, warm dusk (gold, amber, brown, charcoal) instead of a short grey fade; the paper texture runs on so there is no seam */
.day-item.night{--dl:clamp(300px,30vw,440px);padding-top:clamp(240px,24vw,340px);background-image:var(--paper-tex),linear-gradient(180deg,#d7bf9a 0,#ccaa84 calc(var(--dl)*.22),#aa8266 calc(var(--dl)*.45),#6e564a calc(var(--dl)*.68),#463d3c calc(var(--dl)*.86),var(--to) var(--dl),var(--to) 100%);background-size:640px,100% 100%}
.day-item.warm{--kick:#5e3f1b;--fg-2:#4f4843}
.day-head>.wrap{display:block!important}
.day-head{padding-bottom:0}
.day-note{padding:30px var(--gutter) clamp(70px,9vw,110px);text-align:center;color:var(--on-dark-2);background:var(--charcoal);font-size:.95rem}
@media(max-width:860px){
  .day-item>.wrap,.day-item:nth-child(even)>.wrap{grid-template-columns:1fr}
  .day-item:nth-child(even) .day-text{order:0}
  .day-media.pair>.rot:last-child{margin-bottom:0}
}

/* ============ contact ============ */
#contact{padding-top:clamp(60px,7vw,100px)}
.contact-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:clamp(34px,6vw,80px);align-items:center}
.contact-lines{margin-top:1.8em;display:grid;gap:8px;color:var(--fg-2);font-size:.98rem}
.contact-lines a{color:var(--fg);text-decoration-color:var(--gold-ink);text-underline-offset:.25em}
.contact-grid .how{grid-template-columns:1fr;gap:10px;max-width:520px}
.contact-grid .how li{display:grid;grid-template-columns:auto 1fr;column-gap:16px;align-items:baseline;padding:14px 18px}
.contact-grid .how li::before{grid-row:span 2;margin:0}
.contact-solo{text-align:center}
.contact-solo .lede,.contact-solo h2{margin-left:auto;margin-right:auto}
.contact-solo .how{max-width:900px;margin-left:auto;margin-right:auto}
.contact-solo .cta-row,.contact-solo .kicker{justify-content:center}
@media(max-width:900px){.contact-grid{grid-template-columns:1fr}}

/* ============ footer ============ */
.site-footer{position:relative;padding:clamp(70px,9vw,110px) var(--gutter) 34px;background:var(--charcoal);color:var(--on-dark-2);font-size:.95rem}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1.2fr;gap:clamp(26px,4vw,56px)}
.foot-brand .logo{--logo-h:clamp(20px,2vw,26px);color:var(--paper)}
.foot-brand .logo-tagline{--tw:190px;margin-top:12px;color:var(--gold-2)}
.foot-grid p{margin-top:1.2em;max-width:30ch}
.foot-h{font-size:.72rem;font-weight:500;letter-spacing:.24em;text-transform:uppercase;color:var(--gold-2);margin-bottom:1.1em}
.foot-grid ul{display:grid;gap:.55em}
.foot-grid a{color:var(--on-dark-2);text-decoration:none;transition:color .3s}
.foot-grid a:hover{color:var(--paper)}
.foot-bottom{margin-top:clamp(50px,7vw,80px);padding-top:22px;border-top:1px solid var(--line-dark);display:flex;flex-wrap:wrap;gap:12px 28px;justify-content:space-between;align-items:center;font-size:.84rem}
.foot-bottom a{color:var(--on-dark-2)}
.motion-toggle{display:inline-flex;align-items:center;gap:8px;padding:.45em .95em;border-radius:999px;border:1px solid var(--line-dark);font-size:.82rem;color:var(--on-dark-2)}
.motion-toggle:hover{color:var(--paper);border-color:rgba(244,241,236,.4)}
.motion-toggle i{width:8px;height:8px;border-radius:50%;background:var(--gold-2)}
.still .motion-toggle i{background:transparent;border:1px solid var(--on-dark-2)}
@media(max-width:860px){.foot-grid{grid-template-columns:1fr 1fr}.foot-grid>div:first-child{grid-column:span 2}}

/* ============ home: hero scrub (the dive) ============ */
.hero{height:1000vh;position:relative}
.stage{position:sticky;top:0;height:100vh;overflow:hidden;background:var(--black)}
.poster,.stage video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.poster{background-size:cover;background-position:center}
.stage video{opacity:0;transition:opacity .9s var(--ease-soft);will-change:transform;transform:translateZ(0)}
.stage.video-ready video{opacity:1}
.stage.video-failed video{display:none}
.scrim{position:absolute;inset:0;pointer-events:none;background:radial-gradient(ellipse 120% 90% at 50% 45%,rgba(20,16,17,0) 35%,rgba(20,16,17,.58) 100%)}
.ring{position:absolute;right:26px;bottom:26px;width:34px;height:34px;color:var(--gold-2);transform:rotate(-90deg);opacity:.85}
.cue{position:absolute;left:50%;bottom:26px;transform:translateX(-50%);color:#ddd5cb;opacity:.8;animation:cue 2.6s var(--ease-soft) -1.2s infinite}
.band{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:0 6vw;opacity:0;pointer-events:none;color:#fff;text-shadow:var(--tshadow)}
.band::before{content:"";position:absolute;inset:-4%;pointer-events:none;opacity:calc(.25 + .75*var(--k,1));background:radial-gradient(ellipse 74% 62% at 50% 50%,rgba(20,16,17,.55) 0%,rgba(20,16,17,.36) 46%,rgba(20,16,17,0) 76%)}
.band.hook::before{background:radial-gradient(ellipse 74% 62% at 50% 44%,rgba(20,16,17,.62) 0%,rgba(20,16,17,.42) 46%,rgba(20,16,17,0) 76%)}
.band>*{position:relative}
.band .b1-title,.band .line{font-family:var(--font-display);font-weight:400;font-size:clamp(1.9rem,4.1vw,3.4rem);line-height:1.15;max-width:22ch;text-wrap:balance}
.band .b1-title{display:flex;flex-direction:column;align-items:center;max-width:none;font-size:1rem;line-height:1.3}
.band .sub{margin-top:1.1em;font-family:var(--font-body);font-size:clamp(1rem,1.6vw,1.2rem);line-height:1.6;color:#e8e1d7;max-width:44ch}
.band .em{color:var(--gold-2)}
.b3,.b4{justify-content:flex-start;padding-top:30vh}
.b2 .line{max-width:19ch}
/* band 1: the logo sharpens out of the blur, like the first breath */
.hero-logo{display:block;color:#fff;width:min(640px,78vw);filter:drop-shadow(0 2px 18px rgba(20,16,17,.5)) blur(calc((1 - var(--k,0))*12px));opacity:calc(.1 + .9*var(--k,0))}
.hero-logo svg{width:100%;height:auto;overflow:visible}
.b1.sharp .hero-logo{filter:drop-shadow(0 2px 18px rgba(20,16,17,.5));opacity:1}
.b1 .logo-tagline{--tw:min(340px,44vw);margin:1.2em auto 0;color:#efe6d8;opacity:var(--k,0)}
.b1 .sub{opacity:var(--k,0)}
.dd .w{display:inline-block;opacity:var(--kc);transform:translateY(calc((1 - var(--kc,0))*-24px))}
.wp .w{display:inline-block;opacity:var(--kc);transform:scale(calc(0.6 + (0.4 + var(--ov,.12))*var(--kc,0) - var(--ov,.12)*var(--ks,0)))}
.wp .w.em{--ov:0.24}
.sc .w{display:inline-block;white-space:nowrap}
.sc .c{display:inline-block;opacity:var(--kc);transform:translate(calc((1 - var(--kc,0))*var(--jx,0px)),calc((1 - var(--kc,0))*var(--jy,0px))) rotate(calc((1 - var(--kc,0))*var(--jr,0deg)))}
.bts{position:relative;display:inline-block}
.bts .soft{position:absolute;inset:0;filter:blur(10px);opacity:calc(1 - var(--k,0))}
.bts .sharp{opacity:var(--k,0)}
.b6 .w{display:inline-block;opacity:var(--kc);transform:translateY(calc((1 - var(--kc,0))*18px))}
.b6 .sub{opacity:var(--ks,0);transform:translateY(calc((1 - var(--ks,0))*14px))}
.b6 .cta-row{opacity:var(--kb,0);transform:translateY(calc((1 - var(--kb,0))*14px));margin-top:1.6em;pointer-events:auto;justify-content:center}
.band .btn{text-shadow:none}
.static-hero{display:none;position:absolute;inset:0;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:calc(var(--nav-h) + 10px) 7vw 9vh;color:#fff;background:linear-gradient(rgba(20,16,17,.42),rgba(20,16,17,.3) 40%,rgba(20,16,17,.66)),url('/assets/hero-poster.jpg') 52% 50%/cover no-repeat}
.static-hero .hero-logo{width:min(330px,80vw);filter:drop-shadow(0 2px 14px rgba(20,16,17,.45));opacity:1}
.static-hero .logo-tagline{--tw:min(200px,52vw);margin:.9em auto 0;color:#efe6d8}
.static-hero .static-title{margin-top:1.4em;font-family:var(--font-display);font-weight:400;font-size:clamp(1.9rem,8vw,2.8rem);line-height:1.15;text-shadow:var(--tshadow)}
.static-hero p{margin-top:.8em;color:#e8e1d7;max-width:34ch;text-shadow:var(--tshadow)}
.static-hero .cta-row{justify-content:center;margin-top:1.6em}

/* the content sheet slides over the last frames of the dive (no dead scroll after the video) */
.home main{position:relative;z-index:2;margin-top:-100vh}
.home main>.sheet{border-radius:clamp(26px,3.4vw,44px) clamp(26px,3.4vw,44px) 0 0;box-shadow:0 -40px 90px rgba(10,8,8,.5)}
/* phones and portrait screens get the same dive: a portrait cut of the video and a slightly shorter scroll */
@media(max-aspect-ratio:1/1){
  .hero{height:760vh}
  .stage{height:100vh;height:100lvh}
  .static-hero{background-image:linear-gradient(rgba(20,16,17,.42),rgba(20,16,17,.3) 40%,rgba(20,16,17,.66)),url('/assets/hero-poster-m.jpg');background-position:50% 50%}
  .b1 .logo-tagline{--tw:min(340px,62vw)}
  .band .sub{font-size:1.05rem}
  /* the stage is as tall as the largest viewport (100lvh): lift the scroll cue and the loading ring
     above the browser bar, so they stay visible on phones */
  .cue{bottom:calc(100lvh - 100svh + 34px);width:26px;height:26px;filter:drop-shadow(0 1px 6px rgba(20,16,17,.6))}
  .ring{bottom:calc(100lvh - 100svh + 26px)}
}
/* still version: reduced motion, data saver or no JavaScript (the content stays reachable) */
.no-scrub .hero,html:not(.js) .hero{height:100vh;height:100svh}
.no-scrub .stage,html:not(.js) .stage{height:100vh;height:100svh}
.no-scrub .stage video,.no-scrub .poster,.no-scrub .ring,.no-scrub .cue,.no-scrub .band,.no-scrub .scrim,
html:not(.js) .stage video,html:not(.js) .poster,html:not(.js) .ring,html:not(.js) .cue,html:not(.js) .band,html:not(.js) .scrim{display:none}
.no-scrub .static-hero,html:not(.js) .static-hero{display:flex}
.no-scrub .home main,html:not(.js) .home main{margin-top:-7svh}
@media(prefers-reduced-motion:reduce){
  .hero{height:100vh;height:100svh}
  .stage{height:100vh;height:100svh}
  .stage video,.poster,.ring,.cue,.band,.scrim{display:none}
  .static-hero{display:flex}
  .home main{margin-top:-7svh}
}
@media(max-height:560px){.cue{display:none}}

/* home: intro sheet */
.intro{padding-top:clamp(70px,9vw,120px)}
.intro .script{margin:.2em 0 -.1em}

/* home: recognition chips */
.recog{margin-top:clamp(34px,5vw,56px);display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
@media(max-width:760px){.recog{grid-template-columns:1fr}}
.recog button{position:relative;display:inline-flex;align-items:center;gap:14px;text-align:left;padding:.95em 1.25em .95em 1em;border-radius:16px;border:1px solid var(--card-line);background:var(--paper-2);font-family:var(--font-display);font-size:clamp(1rem,1.45vw,1.14rem);line-height:1.4;color:var(--fg);box-shadow:0 14px 30px -26px rgba(74,56,38,.5);transition:background .4s var(--ease-soft),border-color .4s,transform .4s var(--ease)}
.recog button:hover{border-color:rgba(191,147,91,.6);transform:translateY(-2px)}
.recog button .tick{flex:none;width:24px;height:24px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;transition:background .35s,border-color .35s}
.recog button .tick svg{width:14px;height:14px}
.recog button .tick path{fill:none;stroke:#fff;stroke-width:2.4;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:24;stroke-dashoffset:24;transition:stroke-dashoffset .45s var(--ease) .05s}
.recog button[aria-pressed="true"]{background:#fbf5ea;border-color:var(--gold)}
.recog button[aria-pressed="true"] .tick{background:var(--gold);border-color:var(--gold)}
.recog button[aria-pressed="true"] .tick path{stroke-dashoffset:0}
.recog-out{margin-top:clamp(28px,4vw,40px)}
.recog-msg{font-family:var(--font-display);font-size:clamp(1.3rem,2.2vw,1.75rem);line-height:1.3;color:var(--fg);transition:opacity .45s var(--ease-soft)}
.recog-cta{max-height:0;overflow:hidden;padding:0 4px;margin:0 -4px;opacity:0;transform:translateY(10px);pointer-events:none;transition:max-height .6s var(--ease-soft),padding .6s var(--ease-soft),opacity .6s var(--ease-soft),transform .6s var(--ease-soft)}
/* the button only takes room once something is tapped, so the section has no empty space below the message */
.recog-cta.on{max-height:7em;padding:1.2em 4px 4px;opacity:1;transform:none;pointer-events:auto}
#herken{padding-bottom:clamp(60px,7vw,100px)}

/* home: dark photo band (Instagram) */
.breath-sec{position:relative;overflow:hidden;isolation:isolate;text-align:center}
.sec.breath-sec{background-color:var(--black)}
.breath-sec>.rot{position:absolute;inset:0;border-radius:0;aspect-ratio:auto;z-index:-2;box-shadow:none;--fade:2.8s;--kb:18s;background:transparent}
.breath-sec::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 60% 55% at 50% 52%,rgba(20,16,17,.5),rgba(20,16,17,.84) 72%)}
.breath-sec .wrap{display:flex;flex-direction:column;align-items:center}

/* home: moments strip section */
.surface .marquee{margin-top:clamp(40px,5vw,64px)}

/* home: rocco */
.rocco-quote{margin-top:2em;padding-left:1.2em;border-left:2px solid var(--gold);font-family:var(--font-display);font-size:clamp(1.15rem,1.9vw,1.42rem);line-height:1.45;color:var(--fg)}
.sig{margin-top:.25em;padding-left:calc(1.2*clamp(1.15rem,1.9vw,1.42rem) + 2px);--script:var(--taupe)}

/* ============ subpage specifics ============ */
.status{display:inline-flex;align-items:center;gap:10px;padding:.5em 1em .5em .6em;border-radius:999px;background:rgba(20,16,17,.42);border:1px solid rgba(244,241,236,.24);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);font-size:.92rem;color:#f1ece5}
.status .badge{background:var(--gold-2);color:var(--black)}
.list-card{border-radius:28px;padding:clamp(30px,4.6vw,56px);background:var(--charcoal);color:var(--on-dark);position:relative;overflow:hidden}
.list-card::after{content:"";position:absolute;inset:auto -10% -60% 40%;height:120%;background:radial-gradient(closest-side,rgba(203,173,127,.22),transparent);pointer-events:none}
.list-card .lede{color:var(--on-dark-2)}
.story{position:relative;display:grid;gap:clamp(60px,9vw,110px);margin-top:clamp(50px,7vw,90px)}
.story::before{content:"";position:absolute;left:calc(50% - .5px);top:0;bottom:0;width:1px;background:var(--line-strong);transform-origin:top;transform:scaleY(var(--pg,0))}
.story-item{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,8vw,120px);align-items:center;position:relative}
.story-item::before{content:"";position:absolute;left:50%;top:50%;width:13px;height:13px;margin:-6.5px 0 0 -6.5px;border-radius:50%;background:var(--paper);border:1px solid var(--gold);box-shadow:0 0 0 6px var(--paper)}
.story-item:nth-child(even) .story-text{order:2}
.story-year{font-family:var(--font-mono);font-size:.85rem;letter-spacing:.14em;color:var(--gold-ink);display:block;margin-bottom:.8em}
.story-item h3{font-size:clamp(1.6rem,2.7vw,2.1rem);margin-bottom:.45em}
.story-item p{color:var(--fg-2);max-width:44ch}
.story-item p+p{margin-top:.8em}
.story-media{display:flex}
.story-media .rot{width:min(100%,400px)}
.story-item:nth-child(odd) .story-media{justify-content:flex-start}
.story-item:nth-child(even) .story-media{justify-content:flex-end}
@media(max-width:860px){.story::before,.story-item::before{display:none}.story-item{grid-template-columns:1fr}.story-item:nth-child(even) .story-text{order:0}}
.quote-band{position:relative;min-height:min(80svh,760px);display:flex;align-items:center;justify-content:center;text-align:center;padding:120px var(--gutter);overflow:hidden;isolation:isolate;color:var(--on-dark);background:var(--black)}
.quote-band>.rot{position:absolute;inset:0;border-radius:0;aspect-ratio:auto;z-index:-2;box-shadow:none;--fade:2.6s;--kb:16s;background:transparent}
.quote-band::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(ellipse 70% 60% at 50% 50%,rgba(20,16,17,.55),rgba(20,16,17,.8))}
.quote-band .quote{margin:0 auto;text-shadow:0 2px 24px rgba(20,16,17,.6)}
.notfound{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;text-align:center;padding:140px var(--gutter) 110px}
.notfound .script{margin-top:.2em}
.note{margin-top:1.6em;font-size:.9rem;color:var(--fg-2)}
.cta-col{display:flex;flex-direction:column;gap:12px;align-items:stretch;justify-self:end;width:min(100%,360px)}
.list-card .split{align-items:center}
@media(max-width:900px){.cta-col{justify-self:start}}
.duo-links{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:clamp(30px,4vw,48px)}
.duo-links a{display:block;padding:clamp(24px,3vw,36px);border-radius:22px;background:var(--card);border:1px solid var(--card-line);text-decoration:none;transition:transform .45s var(--ease),border-color .45s}
.duo-links a:hover{transform:translateY(-4px);border-color:rgba(191,147,91,.5)}
.duo-links b{display:block;font-family:var(--font-display);font-size:1.6rem;font-weight:400;margin:.25em 0 .3em}
.duo-links span{color:var(--fg-2)}
.duo-links .arrow-link{margin-top:1.2em}
@media(max-width:760px){.duo-links{grid-template-columns:1fr}}

/* ============ briefing v2: aanbod, Journey, Moln, contact ============ */
.price-row .price-note{flex-basis:100%;font-size:.84rem;color:var(--fg-2);line-height:1.45}
.price-list{display:grid;gap:8px;margin-top:1.1em;padding-top:1em;border-top:1px solid var(--line-dark)}
.price-list li{display:flex;justify-content:space-between;gap:12px;color:var(--on-dark-2)}
.price-list b{font-weight:500;color:var(--on-dark)}
.photo-note{margin-top:clamp(50px,7vw,80px);color:var(--fg-2);text-align:center}
.place-link{margin-top:2em}
.place .arrow-link{color:var(--gold-2)}
.compare{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:clamp(36px,5vw,56px)}
.compare>div{padding:clamp(24px,3vw,36px);border-radius:22px;background:var(--card);border:1px solid var(--card-line)}
.compare>div.on{border-color:rgba(203,173,127,.55);background:rgba(203,173,127,.1)}
.compare b{display:block;font-family:var(--font-display);font-size:clamp(1.4rem,2.2vw,1.75rem);font-weight:400;margin:.3em 0 .4em;color:var(--fg)}
.compare p{color:var(--fg-2)}
@media(max-width:760px){.compare{grid-template-columns:1fr}}
.page-over .split-hero h1,.page-stay .split-hero h1{font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.12;max-width:18ch}
.hero-copy{margin-top:1.2em;max-width:52ch}
.hero-copy p{color:var(--on-dark-2)}
.hero-copy p+p{margin-top:.8em}
.hero-copy .lede{margin-top:0;color:var(--on-dark);font-size:clamp(1.08rem,1.5vw,1.2rem)}
.place-note{margin-top:2em;padding:clamp(22px,3vw,30px);border-radius:20px;background:var(--card);border:1px solid var(--card-line)}
.place-note h3{font-size:1.3rem;margin-bottom:.5em}
.place-note p{color:var(--fg-2);font-size:.97rem;margin-bottom:1em}
.testimonial{text-align:center}
.testimonial blockquote{font-family:var(--font-display);font-size:clamp(1.3rem,2.4vw,1.8rem);line-height:1.4;max-width:34ch;margin:0 auto}
.testimonial figcaption{margin-top:1.2em;color:var(--fg-2);font-size:.92rem}
#ervaringen .note{margin-top:1.5em}
/* home: Wie je begeleidt, Ervaringen and the Google reviews read as one run, with less air between them */
.home #rocco{padding-bottom:clamp(52px,6vw,90px)}
.home #ervaringen{padding-top:clamp(40px,5vw,72px);padding-bottom:clamp(30px,4vw,56px)}
.home #reviews{padding-top:clamp(44px,5.5vw,80px);padding-bottom:clamp(48px,5.5vw,84px)}
.home #reviews+#vragen{padding-top:clamp(48px,5.5vw,84px)}
/* WhatsApp community (every page except Retreats and Contact): less air when it follows another paper section */
.sec.community{padding-top:clamp(56px,7vw,100px);padding-bottom:clamp(56px,7vw,100px)}
.sec.t-shell+.sec.community{padding-top:0}
/* forms */
.hp{position:absolute!important;left:-9999px}
.field{display:grid;gap:6px;font-size:.9rem;color:var(--fg-2)}
.field em{font-style:normal;opacity:.75}
.field input,.field select,.field textarea{font:inherit;font-size:1rem;color:var(--ink);background:var(--paper-2);border:1px solid var(--line-strong);border-radius:12px;padding:.75em .9em;min-height:48px;width:100%;transition:border-color .3s,box-shadow .3s}
.field textarea{resize:vertical;min-height:110px}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px rgba(191,147,91,.25)}
.check{display:flex;gap:12px;align-items:flex-start;font-size:.9rem;color:var(--fg-2);line-height:1.5}
.check input{width:20px;height:20px;margin-top:.15em;accent-color:var(--gold-ink);flex:none}
.form-note{font-size:.84rem;color:var(--fg-2)}
.contact-page{padding-top:calc(var(--nav-h) + clamp(70px,9vw,120px))}
.contact-page .crumbs{color:var(--fg-2)}
.contact-page .crumbs a{color:var(--fg-2)}
.contact-page h1{font-size:clamp(2.4rem,5vw,3.8rem);max-width:14ch}
.contact-page .script{margin-top:.2em}
.contact-form{display:grid;gap:16px;padding:clamp(24px,3.4vw,40px);border-radius:26px;background:var(--paper-2);border:1px solid var(--card-line);box-shadow:var(--shadow)}
.contact-form .btn{justify-self:start}
.contact-direct{display:grid;gap:10px;margin-top:2em;max-width:420px}
.contact-direct a{display:flex;align-items:center;gap:14px;padding:12px 16px;border-radius:16px;background:var(--card);border:1px solid var(--card-line);text-decoration:none;transition:border-color .3s,transform .4s var(--ease)}
.contact-direct a:hover{border-color:rgba(191,147,91,.55);transform:translateY(-2px)}
.contact-direct svg{width:22px;height:22px;flex:none;color:var(--gold-ink)}
.contact-direct span{display:grid;font-size:.92rem;color:var(--fg-2)}
.contact-direct b{font-weight:500;color:var(--fg)}
.mini-form{display:grid;gap:12px;justify-self:end;width:min(100%,380px)}
.mini-form .field{color:var(--on-dark-2)}
.mini-form .field input{background:rgba(244,241,236,.96)}
.mini-form .form-note{color:var(--on-dark-2)}
@media(max-width:900px){.mini-form{justify-self:start}}
/* availability calendar (Moln) */
.avail{max-width:980px;margin:clamp(30px,4vw,50px) auto 0;padding:clamp(20px,3vw,36px);border-radius:26px;background:var(--paper-2);border:1px solid var(--card-line);box-shadow:var(--shadow)}
.avail-head{display:flex;align-items:center;justify-content:space-between;gap:12px}
.avail-status{font-family:var(--font-display);font-size:1.15rem;text-align:center}
.avail-nav{width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);font-size:1.1rem;display:grid;place-items:center}
.avail-nav:hover{border-color:var(--gold)}
.avail-nav:disabled{opacity:.35;cursor:default}
.avail-months{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3vw,40px);margin-top:1.2em}
.avail-month h3{font-size:1.15rem;margin-bottom:.6em;text-transform:capitalize}
.avail-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;text-align:center}
.avail-grid .dow{font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--fg-2);padding-bottom:4px}
.avail-grid .d{aspect-ratio:1;display:grid;place-items:center;border-radius:10px;font-size:.88rem;background:rgba(191,147,91,.12);color:var(--ink)}
.avail-grid .d.busy{background:repeating-linear-gradient(135deg,rgba(57,53,54,.12) 0 4px,rgba(57,53,54,.05) 4px 8px);color:rgba(57,53,54,.45);text-decoration:line-through}
.avail-grid .d.past{background:transparent;color:rgba(57,53,54,.3)}
.avail-grid .d.today{box-shadow:inset 0 0 0 1px var(--gold-ink)}
.avail-legend{display:flex;gap:20px;justify-content:center;margin-top:1.4em;font-size:.88rem;color:var(--fg-2)}
.avail-legend li{display:flex;align-items:center;gap:8px}
.avail-legend i{width:16px;height:16px;border-radius:5px;background:rgba(191,147,91,.25)}
.avail-legend i.busy{background:repeating-linear-gradient(135deg,rgba(57,53,54,.2) 0 3px,rgba(57,53,54,.06) 3px 6px)}
.avail-note{margin:1.2em auto 0;max-width:62ch;text-align:center;font-size:.92rem;color:var(--fg-2)}
.avail .cta-row{justify-content:center}
.avail.empty .avail-months,.avail.empty .avail-legend,.avail.empty .avail-nav{display:none}
@media(max-width:700px){.avail-months{grid-template-columns:1fr}}

/* ============ oplevering: reviews, Instagram, juridische pagina's ============ */
/* home: Google reviews, a soft bridge from paper (Ervaringen) to sand (Vragen); only the Google G keeps its own colours */
.sec.reviews-sec{background-color:var(--sand-soft);background-image:var(--paper-tex),linear-gradient(180deg,var(--paper) 0%,var(--paper) 12%,var(--sand-soft) 100%);background-size:640px,100% 100%;background-blend-mode:multiply,normal}
.reviews-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px 56px;align-items:end}
.reviews-intro .lede{max-width:44ch}
.g-card{display:flex;align-items:center;gap:18px;min-width:min(330px,100%);padding:22px 28px;border-radius:var(--radius);background:var(--paper-2);border:1px solid var(--card-line);box-shadow:var(--shadow)}
.g-card .g-logo{flex:none;box-sizing:border-box;width:56px;height:56px;padding:14px;border-radius:50%;background:#fff;box-shadow:0 6px 18px -6px rgba(57,53,54,.28)}
.g-card-text p{margin:0}
.g-score{display:flex;align-items:center;gap:12px;margin-bottom:.15em!important}
.g-score[hidden]{display:none}
.g-score b{font-family:var(--font-display);font-weight:500;font-size:2.3rem;line-height:1;color:var(--fg)}
.g-score .stars{font-size:1.05rem}
.g-label{font-family:var(--font-display);font-size:1.35rem;line-height:1.2;color:var(--fg)}
.g-count{margin-top:.25em!important;font-size:.9rem;color:var(--fg-2)}
.g-score:not([hidden])+.g-label{display:none}
.stars{color:var(--gold);letter-spacing:.08em}
.stars i{font-style:normal;color:var(--line-strong)}
.reviews-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px;margin-top:clamp(36px,5vw,56px)}
.reviews-list[hidden]{display:none}
.review{margin:0;padding:24px 24px 22px;border-radius:var(--radius);background:var(--paper-2);border:1px solid var(--card-line);box-shadow:0 22px 44px -34px rgba(74,56,38,.5);display:grid;gap:12px;align-content:start}
.review-top{display:flex;align-items:center;justify-content:space-between;gap:12px}
.review-top .g-logo{width:18px;height:18px}
.review blockquote{font-family:var(--font-display);font-size:1.12rem;line-height:1.5;color:var(--fg)}
.review figcaption{font-size:.86rem;color:var(--fg-2)}
.review figcaption b{color:var(--fg);font-weight:500}
.reviews-cta{margin-top:clamp(28px,4vw,44px)}
.btn .g-logo{box-sizing:border-box;width:22px;height:22px;padding:3px;border-radius:50%;background:#fff;flex:none}
@media(max-width:860px){.reviews-top{grid-template-columns:1fr;align-items:start}}
.insta-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(8px,1.4vw,16px);width:min(820px,100%);margin:2.4em auto 0}
.insta-grid[hidden]{display:none}
.insta-sec .lede{color:var(--on-dark-2);margin:1em auto 0;max-width:46ch}
.insta-sec .cta-row{justify-content:center;margin-top:2.2em}
.insta-sec .btn svg{width:18px;height:18px}
.insta-post{box-shadow:0 18px 40px -22px rgba(0,0,0,.7)}
/* navigation: Instagram and YouTube icons */
.nav-social,.menu-social{display:flex;align-items:center;gap:2px}
.nav-social a,.menu-social a{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;color:inherit;opacity:.82;transition:opacity .3s var(--ease-soft),background-color .3s var(--ease-soft)}
.nav-social a:hover,.menu-social a:hover{opacity:1;background:rgba(191,147,91,.16)}
.nav-social svg,.menu-social svg{width:20px;height:20px}
.menu-social{margin-top:1em;gap:8px;position:relative;z-index:1;color:var(--ink)}
@media(max-width:980px){.nav-social{display:none}}
.insta-post{position:relative;display:block;aspect-ratio:1;border-radius:14px;overflow:hidden;background:var(--sand-soft);text-decoration:none;color:#fff}
.insta-post img{width:100%;height:100%;object-fit:cover;transition:transform .8s var(--ease)}
.insta-post:hover img{transform:scale(1.04)}
.insta-post::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,16,17,0) 52%,rgba(20,16,17,.72));transition:opacity .4s var(--ease-soft);pointer-events:none}
.insta-view{position:absolute;left:12px;right:12px;bottom:11px;z-index:1;display:flex;align-items:center;gap:.5em;font-size:.86rem;font-weight:500;letter-spacing:.04em;text-shadow:0 1px 6px rgba(20,16,17,.5)}
.insta-view svg{width:17px;height:17px;flex:none}
.insta-view .insta-arrow{width:14px;height:14px;margin-left:auto;transition:transform .35s var(--ease-soft)}
.insta-post:hover .insta-view .insta-arrow{transform:translateX(3px)}
.insta-post:hover .insta-view{color:var(--gold-2)}
.insta-play{position:absolute;top:10px;right:10px;z-index:1;display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:rgba(20,16,17,.42);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.insta-play svg{width:14px;height:14px;margin-left:2px}
@media(max-width:560px){.insta-view{left:8px;right:8px;bottom:7px;font-size:.72rem;gap:.35em}.insta-view svg{width:14px;height:14px}.insta-view .insta-arrow{display:none}.insta-play{width:24px;height:24px;top:6px;right:6px}.insta-play svg{width:11px;height:11px}}
/* the Instagram band flows straight into the offers: less air than two full section paddings */
.sec.insta-sec{padding-bottom:clamp(56px,6.5vw,96px)}
.insta-sec+.sec{padding-top:clamp(56px,6.5vw,96px)}
.foot-h2{margin-top:1.6em}
.foot-legal a{color:var(--on-dark-2)}
.legal-page{padding-top:calc(var(--nav-h) + clamp(60px,8vw,100px))}
.legal-page h1{font-size:clamp(2.2rem,4.6vw,3.2rem);margin-top:.4em}
.legal-page .crumbs,.legal-page .crumbs a{color:var(--fg-2)}
.legal-sub{margin-top:.6em;color:var(--fg-2);font-size:.92rem}
.legal-note{margin-top:1.4em;padding:14px 18px;border-radius:14px;background:var(--card);border:1px solid var(--card-line);color:var(--fg-2);font-size:.95rem}
.legal{margin-top:2em;display:grid;gap:1.8em}
.legal h2{font-size:clamp(1.25rem,2vw,1.5rem);max-width:none;margin-bottom:.5em}
.legal p{color:var(--fg-2);max-width:68ch}
.legal p+p{margin-top:.7em}
.legal strong{color:var(--fg);font-weight:500}
.legal a{color:var(--link)}
.calendly-row{margin-top:1.4em}

/* ============ floating WhatsApp button (bottom right, every page) ============ */
.wa-float{position:fixed;right:max(18px,env(safe-area-inset-right));bottom:max(18px,env(safe-area-inset-bottom));z-index:90;display:block;text-decoration:none;color:var(--ink);transition:opacity .4s var(--ease-soft),visibility 0s}
.wa-icon{position:relative;display:grid;place-items:center;width:60px;height:60px;border-radius:50%;background:var(--gold-2);color:var(--black);box-shadow:0 14px 30px -10px rgba(35,31,32,.55),0 0 0 1px rgba(35,31,32,.06);transition:background .35s var(--ease-soft),transform .35s var(--ease-soft),box-shadow .35s var(--ease-soft)}
.wa-icon svg{width:28px;height:28px}
.wa-icon::after{content:"";position:absolute;inset:-6px;border-radius:50%;border:1px solid var(--gold);opacity:0;pointer-events:none;animation:btnbreathe 7s var(--ease-soft) infinite}
.wa-float:hover .wa-icon{background:var(--gold);transform:translateY(-2px);box-shadow:0 18px 34px -12px rgba(35,31,32,.6)}
.wa-float:focus-visible{outline:none}
.wa-float:focus-visible .wa-icon{outline:2px solid var(--gold);outline-offset:3px}
.menu-open .wa-float{opacity:0;visibility:hidden;transition:opacity .3s var(--ease-soft),visibility 0s .3s}
@media(max-width:620px){.wa-icon{width:54px;height:54px}.wa-icon svg{width:26px;height:26px}}
.still .wa-icon::after{animation-play-state:paused!important}

/* ============ reduced motion and paused motion ============ */
.still .rot>img{transition:opacity .01s linear!important;transform:none!important}
.still .marquee-track,.still .waves i,.still .btn.breathe::after,.still .place-icons *,.still .badge .dot,.still .scroll-hint,.still .cue,.still .leaf{animation-play-state:paused!important}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;transition-delay:0s!important;scroll-behavior:auto!important}
  .js .fx .part,.js .reveal,.js .settle{opacity:1!important;transform:none!important;clip-path:none!important;filter:none!important}
  .sh .w{opacity:1!important;transform:none!important}
  .tile svg *{stroke-dashoffset:0!important}
  .rot>img{transform:none!important}
  .marquee{overflow-x:auto;mask-image:none;-webkit-mask-image:none}
  .story::before{transform:none}
}
@media(pointer:coarse){.btn{min-height:48px}}
@media(max-width:620px){
  .announce{font-size:.8rem;line-height:1.35;padding:7px 42px 7px 12px;justify-content:flex-start}
  .announce a{flex-wrap:nowrap;justify-content:flex-start;align-items:center;text-align:left}
  .announce .badge{flex:none}
}
