:root{--ink:#423b32;--paper:#f8f4ec;--sage:#798673;--line:#d9d1c4;--serif:Georgia,'Times New Roman',serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased}a{color:inherit}button{font:inherit}a,button{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible{outline:3px solid #70583f;outline-offset:6px}h1,h2,h3,p{margin:0;font-weight:400}p{line-height:1.5}h2{font-size:clamp(30px,3.2vw,48px);line-height:1.15}h3{font-size:25px;line-height:1.2}.hero-wrap{background:#e9e5df url('/assets/coast.webp') center top/cover no-repeat}.header{max-width:1600px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:30px 5%;gap:30px}.identity{text-decoration:none;flex-shrink:0}.identity span{font-size:clamp(32px,3.5vw,52px);letter-spacing:-1.8px}.identity small{display:block;font:9px/1.6 Arial,sans-serif;letter-spacing:2.7px;text-transform:uppercase;margin-top:8px}nav{display:flex;gap:clamp(20px,2.8vw,44px)}nav a{text-decoration:none;font-size:19px;padding:12px 0}nav a:hover{color:#667259}.menu-toggle{display:none}.hero{min-height:560px;height: min(43vw,710px);position:relative;max-width:1600px;margin:auto;padding:56px 8% 220px 12%}.hero-copy{max-width:950px}h1{font-size:clamp(46px,4.5vw,72px);line-height:1.02;letter-spacing:-2px}.hero-copy>p{font-size:clamp(20px,2vw,30px);margin:20px 0 24px;max-width:800px}.button{display:inline-flex;gap:35px;align-items:center;padding:17px 30px;background:var(--sage);color:#fffaf3;text-decoration:none;border-radius:40px;font-size:20px;min-height:52px;transition:background .2s,transform .2s}.button:hover{background:#626f5b;transform:translateY(-2px)}.hero-note,.location{position:absolute;bottom:36px;font:10px/2 Arial,sans-serif;letter-spacing:3px;text-transform:uppercase;color:#fff8e9;text-shadow:0 1px 4px #434c3a}.hero-note{left:5%}.location{right:5%;text-align:right}.section{padding:70px 5%;max-width:1600px;margin:auto}.support{padding-top:32px;padding-bottom:35px}.section-heading{text-align:center}.section-heading p{font-size:21px;margin-top:12px}.rule{display:block;width:44px;height:1px;background:#9c927d;margin:20px auto}.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px;margin-top:28px}.card{position:relative;overflow:hidden;display:flex;align-items:center;min-height:210px;border:1px solid #eee7dd;border-radius:20px;background:linear-gradient(165deg,#fffcf7,#f6f1e8);box-shadow:0 9px 30px #63563a08;text-decoration:none;padding:30px 24px 30px 35%;transition:box-shadow .2s,transform .2s}.card:after{content:'';position:absolute;width:150%;height:70px;left:-10%;bottom:-38px;border-radius:50% 50% 0 0;background:#ddd7bd70;transform:rotate(-7deg)}.card img{position:absolute;left:2%;bottom:-8px;width:33%;height:190px;opacity:.75}.sage img{filter:hue-rotate(52deg) saturate(.45)}.lavender img{filter:hue-rotate(315deg) saturate(.6)}.card>div{position:relative;z-index:1}.card p{font-size:18px;margin:12px 0 24px}.more{font:10px Arial,sans-serif;letter-spacing:2px;text-transform:uppercase;color:#76593f;border-bottom:1px solid #bb9b7e;padding-bottom:5px}.more i{font-size:20px;font-style:normal;margin-left:12px}.card:hover{box-shadow:0 12px 35px #63563a18;transform:translateY(-4px)}.closing-line{text-align:center;font:10px/1.6 Arial,sans-serif;letter-spacing:3px;text-transform:uppercase;color:#8d7d69;margin-top:38px}.closing-line span{padding:0 20px}.about{border-top:1px solid var(--line);padding-top:80px;padding-bottom:85px}.eyebrow{font:10px/1.8 Arial,sans-serif;letter-spacing:2.5px;text-transform:uppercase;color:#73694f}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;margin-top:22px}.split p{font-size:21px;margin-bottom:18px}.text-link{display:inline-block;font:11px/1.8 Arial,sans-serif;letter-spacing:1.4px;text-transform:uppercase;text-decoration:none;border-bottom:1px solid #ab9275;padding:10px 0}.offerings{display:grid;grid-template-columns:1fr 1fr;gap:30px;padding-top:0}.offerings article{padding:38px;background:linear-gradient(145deg,#e9e9df,#f0e9df);border-radius:18px;scroll-margin-top:25px}.offerings article:nth-child(3),.offerings article:nth-child(4){background:linear-gradient(145deg,#e9dfe7,#f1e8da)}.offerings h2{font-size:34px;margin:18px 0}.offerings p{font-size:20px;max-width:520px}.contact{position:relative;text-align:center;padding:70px 10%;background:#e4e6db;border-radius:30px;overflow:hidden;max-width:1440px;width:90%;margin:15px auto 60px}.contact h2{margin:18px 0}.contact p{font-size:21px;max-width:600px;margin:0 auto 28px}.contact img{position:absolute;left:-30px;bottom:-70px;width:210px;opacity:.3;pointer-events:none}.phone{display:block;margin:20px auto 0;width:max-content;font-size:19px;text-underline-offset:5px}footer{text-align:center;padding:35px 20px 40px;border-top:1px solid var(--line)}.footer-name{font-size:30px;text-decoration:none}footer p{font-size:16px;margin:14px 0}footer small{font:10px/1.8 Arial,sans-serif;color:#746d61}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip{position:absolute;top:-100px;left:20px;z-index:10;background:var(--paper);padding:12px}.skip:focus{top:10px}
@media(min-width:1600px){.hero-wrap{background-size:100% auto}.hero{height:710px;padding-left:192px;padding-right:128px}.hero-note,.location{color:var(--ink);text-shadow:none}}
@media(max-width:1100px){.header{flex-wrap:wrap;justify-content:center;padding:22px 5%}.identity{text-align:center}nav{gap:28px}.hero{padding:42px 9% 230px;height:620px}.cards{gap:15px}.card{padding:28px 20px 28px 29%;min-height:240px}.card img{width:30%;opacity:.5}.card h3{font-size:23px}.card p{font-size:17px}}
@media(max-width:760px){.header{justify-content:space-between;position:relative;padding:24px 6%;gap:16px}.identity{text-align:left}.identity span{font-size:35px;letter-spacing:-1px}.identity small{font-size:8px;letter-spacing:1.4px;max-width:260px}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;border:0;background:transparent;padding:8px;cursor:pointer}.menu-toggle>span{height:1px;width:28px;background:var(--ink)}nav{display:none;width:100%;flex-direction:column;gap:0;background:#faf6eeeF;padding:12px 20px;border-radius:14px}nav.open{display:flex}nav a{font-size:20px;padding:12px}.hero-wrap{background-size:auto 730px;background-position:58% top;background-color:#eee5e5}.hero{height:640px;min-height:0;padding:38px 7% 280px}.hero-copy{max-width:520px}.desktop-break{display:none}h1{font-size:clamp(39px,7.7vw,58px);letter-spacing:-1px;line-height:1.06}.hero-copy>p{font-size:22px;line-height:1.3;max-width:390px;margin:19px 0 24px}.button{font-size:18px;padding:15px 26px;gap:24px}.hero-note{display:block;left:7%;bottom:24px;font-size:9px;letter-spacing:2px}.location{bottom:24px;font-size:9px;letter-spacing:2px}.section{padding:48px 6%}.support{padding-top:34px;padding-bottom:32px}.section-heading h2{font-size:34px}.section-heading p{font-size:19px}.cards{grid-template-columns:1fr;gap:16px;margin-top:24px}.card{min-height:185px;padding:28px 24px 28px 36%}.card img{width:32%;height:180px;opacity:.75}.card h3{font-size:26px}.card p{font-size:19px;margin:10px 0 20px}.closing-line{font-size:8px;letter-spacing:1.8px}.closing-line span{padding:0 8px}.split{grid-template-columns:1fr;gap:26px}.split h2{font-size:36px}.split p{font-size:20px}.offerings{grid-template-columns:1fr;padding-top:0;gap:18px}.offerings article{padding:28px}.offerings h2{font-size:31px}.contact{width:88%;padding:45px 7%;margin-bottom:35px;border-radius:20px}.contact h2{font-size:35px}.contact p{font-size:20px}.contact img{width:130px;opacity:.18}footer p{font-size:14px}}
@media(max-width:370px){.identity span{font-size:30px}.identity small{font-size:7px;letter-spacing:1px}.header{gap:8px}.hero{padding-top:28px;height:630px}h1{font-size:38px}.hero-copy>p{font-size:20px}.card{padding-left:29%;padding-right:17px}.card img{width:25%;opacity:.5}.card h3{font-size:24px}.card p{font-size:17px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}}
.portrait-layout{grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:90px}.portrait{margin:0;position:relative;max-width:480px;width:100%;justify-self:center;padding:12px}.portrait:before{content:'';position:absolute;inset:0 0 66px;border:1px solid #b9bca5;border-radius:48% 48% 22px 22px;transform:rotate(-5deg);pointer-events:none}.portrait-photo{display:block;width:100%;height:auto;aspect-ratio:1/1.08;object-fit:cover;object-position:50% 35%;border-radius:48% 48% 18px 18px;box-shadow:0 15px 40px #645a3c14}.portrait-leaves{position:absolute;bottom:55px;left:-45px;width:110px;height:185px;transform:rotate(-12deg);pointer-events:none}.portrait figcaption{text-align:center;font-size:24px;margin-top:24px}.portrait figcaption span{display:block;font:9px/1.8 Arial,sans-serif;letter-spacing:2px;text-transform:uppercase;color:#756950;margin-top:8px}.about-copy h2{margin-bottom:28px}.about-copy p{max-width:650px}@media(max-width:1100px){.portrait-layout{gap:45px}.portrait-leaves{left:-20px;width:80px}}@media(max-width:760px){.portrait-layout{grid-template-columns:1fr;gap:35px}.portrait{max-width:380px;width:92%}.portrait-leaves{left:-22px;width:85px}.about-copy h2{margin-bottom:22px}.portrait figcaption{font-size:23px}.portrait figcaption span{font-size:8px}}
/* A small sprout unfolds into a fuller plant when a card is explored. */
.growth-plant{position:absolute;left:0;bottom:-5px;width:35%;height:215px;overflow:visible;pointer-events:none;--leaf-colour:#c49b7c;--stem-colour:#a88466}.sage .growth-plant{--leaf-colour:#a2ad94;--stem-colour:#7e8e72}.lavender .growth-plant{--leaf-colour:#c6a4b0;--stem-colour:#ab8796}.growing-stem{transform-box:view-box;transform-origin:57px 237px;transform:scale(.48,.43) rotate(12deg);transition:transform 1350ms cubic-bezier(.22,.68,.22,1)}.plant-stem{fill:none;stroke:var(--stem-colour);stroke-width:1.2;stroke-linecap:round;transition:stroke-width 1200ms}.growth-leaf{fill:var(--leaf-colour);opacity:0;transform:scale(.05);transform-origin:0 0;transition:transform 750ms cubic-bezier(.2,.65,.3,1),opacity 450ms;transition-delay:0ms}.leaf-vein{fill:none;stroke:var(--stem-colour);stroke-width:.5;opacity:0;transform:scale(.05);transform-origin:0 0;transition:transform 750ms,opacity 450ms;transition-delay:0ms}.growth-plant .leaf-7,.growth-plant .leaf-8,.growth-plant .leaf-9{opacity:.8;transform:scale(.8)}.card:is(:hover,:focus-visible,.plant-grown) .growing-stem{transform:scale(1) rotate(0deg)}.card:is(:hover,:focus-visible,.plant-grown) .plant-stem{stroke-width:2}.card:is(:hover,:focus-visible,.plant-grown) .growth-leaf{opacity:.85;transform:scale(1);transition-delay:var(--leaf-delay)}.card:is(:hover,:focus-visible,.plant-grown) .leaf-vein{opacity:.35;transform:scale(1);transition-delay:var(--leaf-delay)}
@media(max-width:1100px){.growth-plant{width:30%;height:205px}}
@media(max-width:760px){.growth-plant{width:33%;height:185px;left:1%}}
@media(max-width:370px){.growth-plant{width:27%;height:175px;left:0}}
@media(prefers-reduced-motion:reduce){.growing-stem{transform:scale(1) rotate(0deg)}.growth-leaf{opacity:.85;transform:scale(1)}.leaf-vein{opacity:.35;transform:scale(1)}}
/* Reuse the holding page mandala as a quiet background to the therapy panel. */
.offerings article{position:relative;overflow:hidden;isolation:isolate}.offerings article>:not(.card-mandala){position:relative;z-index:1}.card-mandala{position:absolute;right:0;top:60%;height:170%;aspect-ratio:1;transform:translate(40%,-50%);opacity:.1;filter:saturate(.4);mix-blend-mode:multiply;pointer-events:none;z-index:0}.mandala-layer{position:absolute;left:50%;top:50%;width:var(--size);height:var(--size);translate:-50% -50%;object-fit:contain;animation:mandala-turn var(--duration) linear infinite;animation-play-state:paused}.mandala-layer-1{--size:100%;--duration:240s}.mandala-layer-2{--size:94.31%;--duration:210s;animation-direction:reverse}.mandala-layer-3{--size:80.41%;--duration:180s}.mandala-layer-4{--size:42.05%;--duration:155s;animation-direction:reverse}.mandala-layer-5{--size:16.36%;--duration:140s}.mandala-visible .mandala-layer{animation-play-state:running}@keyframes mandala-turn{to{transform:rotate(360deg)}}@media(prefers-reduced-motion:reduce){.mandala-visible .mandala-layer{animation:none}}
@media(max-width:760px){.card-mandala{height:102%}}
.contact{isolation:isolate}.contact>:not(.contact-garden){position:relative;z-index:1}.contact-garden{position:absolute;bottom:-15px;width:230px;height:310px;pointer-events:none;z-index:0;fill:#bca784;opacity:.4;overflow:visible}.garden-left{left:-15px}.garden-right{right:-15px;fill:#9ca88b}.garden-stalk{transform:scale(.02);transform-origin:0 0;opacity:0;transition:transform 1500ms cubic-bezier(.22,.68,.22,1),opacity 500ms;transition-delay:0ms}.first-stalk{transform:scale(.42);opacity:1}.garden-stem{fill:none;stroke:#899579;stroke-width:1.7;stroke-linecap:round}.garden-flower{fill:#bd8c89;transform:scale(.01) rotate(-35deg);opacity:0;transition:transform 1500ms cubic-bezier(.22,.68,.22,1),opacity 900ms;transition-delay:0ms}.garden-right .garden-flower{fill:#a69aae}.flower-centre{fill:#cfb074}.contact.garden-grown .garden-stalk{transform:scale(1);opacity:1;transition-delay:var(--stagger)}.contact.garden-grown .garden-flower{transform:scale(1) rotate(0deg);opacity:1;transition-delay:var(--stagger)}
@media(max-width:1100px){.contact-garden{width:180px;height:250px;opacity:.3}}
@media(max-width:760px){.contact-garden{width:105px;height:190px;opacity:.27}.garden-left{left:-30px}.garden-right{right:-30px}}
@media(prefers-reduced-motion:reduce){.garden-stalk{transform:scale(1);opacity:1}.garden-flower{transform:scale(1);opacity:1}}
/* Fuller planting and oversized blooms, retaining the quiet background tone. */
.contact-garden{width:460px;height:620px;bottom:-30px}.garden-left{left:-30px}.garden-right{right:-30px}.contact.garden-grown .garden-flower{transform:scale(1.65) rotate(0deg)}
.contact-garden{transition:opacity 450ms ease-in-out}.contact.garden-fading .contact-garden{opacity:0}
@media(prefers-reduced-motion:reduce){.contact-garden{transition:none}}
@media(max-width:1100px){.contact-garden{width:360px;height:500px}}
@media(max-width:760px){.contact-garden{width:210px;height:380px}.garden-left{left:-60px}.garden-right{right:-60px}}
@media(prefers-reduced-motion:reduce){.garden-flower{transform:scale(1.65)}}
@media(max-width:760px){.contact-garden{bottom:-65px}}
/* Quiet stories: connection, renewal and a breath settling into calm. */
.panel-art{transition:opacity 450ms ease-in-out}#supervision.art-fading .panel-art{opacity:0!important}#retreats.art-fading .rising-sun{opacity:0!important;transition:opacity 450ms ease-in-out!important}
.panel-art{position:absolute!important;z-index:0!important;pointer-events:none;right:-70px;top:55%;width:370px;height:370px;transform:translateY(-50%);opacity:.15;overflow:visible}.weave-line{fill:none;stroke-width:9;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;transition:stroke-dashoffset 2800ms cubic-bezier(.2,.6,.25,1)}.weave-one{stroke:#829679}.weave-two{stroke:#b2967c;transition-delay:250ms}.art-grown .weave-line{stroke-dashoffset:0}.sunrise-art{width:470px;height:350px;right:-80px;top:auto;bottom:-30px;transform:none;opacity:.23}.rising-sun{transform:translateY(125px);opacity:0;transition:transform 2800ms cubic-bezier(.2,.6,.25,1),opacity 1800ms}.art-grown .rising-sun{transform:translateY(0);opacity:1}.sun-halo{fill:#dfba7d;opacity:.3}.sun-disc{fill:#d2a66c}.distant-hill{fill:#a1ad9a}.near-hill{fill:#829783}.coastal-line{fill:none;stroke:#e9dcc3;stroke-width:3}.ripple-art{right:-80px;opacity:.17}.calm-ring{fill:none;stroke:#9387a1;stroke-width:2;transform-origin:150px 150px;transform:scale(.15);opacity:0;transition:transform 2800ms cubic-bezier(.16,.75,.2,1),opacity 1500ms;transition-delay:0ms}.art-grown .calm-ring{transform:scale(1);opacity:1;transition-delay:var(--ring-delay)}.ring-0{fill:#b2a4ba;fill-opacity:.15}.ring-1,.ring-3{stroke:#8da198}
@media(max-width:760px){.panel-art{width:280px;height:280px;right:-85px;opacity:.12}.sunrise-art{width:350px;height:265px;right:-90px;bottom:-25px;opacity:.2}}
@media(prefers-reduced-motion:reduce){.weave-line{stroke-dashoffset:0}.rising-sun{transform:none;opacity:1}.calm-ring{transform:scale(1);opacity:1}}
/* Full-width soft coastal contours with a slower, spreading sunrise. */
.sunrise-art{inset:0!important;width:100%!important;height:100%!important;transform:none;opacity:.2}.rising-sun{transform:translateY(190px);transition:transform 4800ms cubic-bezier(.2,.6,.25,1),opacity 3000ms}.sun-ray{fill:none;stroke:#cba369;stroke-width:3;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:.55;transition:stroke-dashoffset 5000ms cubic-bezier(.2,.6,.25,1)}.art-grown .sun-ray{stroke-dashoffset:0}.sunrise-art .coastal-line{stroke-width:2}
@media(prefers-reduced-motion:reduce){.sun-ray{stroke-dashoffset:0}}
/* Broad, feathered warmth spreads from the centre instead of sharp spokes. */
.sun-rays{fill:url(#sun-ray-warmth);filter:url(#sun-ray-soften);transform-origin:720px 235px;transform:scale(.015);opacity:0;transition:transform 5200ms cubic-bezier(.2,.6,.25,1),opacity 2800ms}.art-grown .sun-rays{transform:scale(1);opacity:.8}
@media(prefers-reduced-motion:reduce){.sun-rays{transform:scale(1);opacity:.8}}
/* Self-compassion takes the shape of the site's gentle coastal landscape. */
.breath-art{inset:0!important;width:100%!important;height:100%!important;transform:none;opacity:.27}.breath-landscape{transform-origin:75% 100%;transform:translateY(55px) scale(.93,.86);opacity:.35}.band-lavender{fill:#b7a7bd}.band-sand{fill:#d8c5a3}.band-sage{fill:#93a58e}.breath-contour{fill:none;stroke:#f7edda;stroke-width:2.5}.art-grown .breath-landscape{animation:coastal-breath 6500ms cubic-bezier(.3,.05,.3,1) both}@keyframes coastal-breath{0%{transform:translateY(55px) scale(.93,.86);opacity:.35}55%{transform:translateY(-10px) scale(1.035,1.08);opacity:1}100%{transform:translateY(0) scale(1);opacity:.85}}
@media(prefers-reduced-motion:reduce){.breath-landscape,.art-grown .breath-landscape{animation:none;transform:none;opacity:.85}}
/* Four coastal colours breathe in a slow, staggered series of waves. */
.breath-art{opacity:.4}.band-lavender{fill:#b29bbb;--wave-delay:0s}.band-sand{fill:#dfc397;--wave-delay:-2s}.band-sage{fill:#95ad87;--wave-delay:-4s}.band-sea{fill:#79a7a5;--wave-delay:-6s}.breath-landscape{transform:none;opacity:1}.art-grown .breath-landscape{animation:none}.breath-band,.breath-contour{transform-origin:75% 100%}.art-grown .breath-band{animation:gentle-coastal-wave 12000ms ease-in-out infinite;animation-delay:var(--wave-delay)}.art-grown .breath-contour{animation:gentle-coastal-wave 12000ms ease-in-out -3s infinite}@keyframes gentle-coastal-wave{0%,100%{transform:translateY(8px) scaleY(.97)}50%{transform:translateY(-9px) scaleY(1.035)}}
@media(prefers-reduced-motion:reduce){.art-grown .breath-band,.art-grown .breath-contour{animation:none;transform:none}}
/* Soft clouds drift through lavender light and a pale yellow glow. */
.cloud-art{inset:0!important;width:100%!important;height:100%!important;transform:none;opacity:.45}.cloud-lilac{fill:#b4a1c4;--cloud-duration:26000ms;--cloud-delay:-7s}.cloud-plum{fill:#a593b6;--cloud-duration:32000ms;--cloud-delay:-15s}.cloud-yellow{fill:#ead4a6;--cloud-duration:29000ms;--cloud-delay:-3s}.cloud{transform-origin:center}.art-grown .cloud{animation:soft-cloud-drift var(--cloud-duration) ease-in-out var(--cloud-delay) infinite alternate}.art-grown .cloud-light{animation:cloud-light-breathe 22000ms ease-in-out infinite}@keyframes soft-cloud-drift{from{transform:translate(-28px,7px)}to{transform:translate(28px,-7px)}}@keyframes cloud-light-breathe{0%,100%{opacity:.55}50%{opacity:.9}}
@media(prefers-reduced-motion:reduce){.art-grown .cloud,.art-grown .cloud-light{animation:none}}
/* Give the quiet motion enough time and travel to be noticed. */
.weave-line{transition-duration:7500ms}.weave-two{transition-delay:700ms}.cloud-lilac{--cloud-duration:16000ms}.cloud-plum{--cloud-duration:20000ms}.cloud-yellow{--cloud-duration:18000ms}@keyframes soft-cloud-drift{from{transform:translate(-65px,12px)}to{transform:translate(65px,-12px)}}
/* Reset the woven paths immediately off screen so every reveal starts cleanly. */
#supervision:not(.art-grown) .weave-line{transition:none;stroke-dashoffset:1}
/* Reset the sunrise immediately off screen for a consistent replay. */
#retreats:not(.art-grown) .rising-sun,#retreats:not(.art-grown) .sun-rays{transition:none}
/* Keep the 1000:400 artwork proportional inside taller mobile cards. */
@media(max-width:760px){.sunrise-art,.cloud-art{inset:auto!important;left:auto!important;right:0!important;top:auto!important;bottom:0!important;width:180%!important;height:auto!important;aspect-ratio:5/2}}
@media(min-width:761px){.sunrise-art{inset:auto!important;left:0!important;right:0!important;top:auto!important;bottom:0!important;width:100%!important;height:auto!important;aspect-ratio:5/2}}
/* Test a warmer, more visible ray colour independently of the faded landscape. */
.sunrise-art{opacity:.5}.sunrise-art .distant-hill,.sunrise-art .near-hill,.sunrise-art .coastal-line,.sunrise-art .sun-disc,.sunrise-art .sun-halo{opacity:.4}.art-grown .sun-rays{opacity:1}
@media(prefers-reduced-motion:reduce){.sun-rays{opacity:1}}
.art-grown .sun-rays{opacity:.6}
@media(prefers-reduced-motion:reduce){.sun-rays{opacity:.6}}
/* Bring the mandala and woven lines forward by 40%. */
.card-mandala{opacity:.14}.weave-art{opacity:.21}
@media(max-width:760px){.weave-art{opacity:.168}}

/* New Brighton dunes hero artwork. */
.hero-wrap{background-image:url('/assets/new-brighton-dunes-landscape-illustration-v2.png')}

/* Broader cloud banks keep the gentle colours visible across the card. */
.cloud-art{opacity:.58}

/* Preview 2: the name becomes the hero logo, then settles into navigation. */
:root{
  --logo-shift:0px;
  --logo-scale:1;
  --hero-logo-opacity:1;
  --nav-logo-opacity:0;
  --nav-bg-alpha:0;
  --nav-line-alpha:0;
  --nav-blur:0px;
  --logo-shadow-alpha:.38;
}
.hero-wrap{overflow:visible;isolation:auto}
.header{
  position:fixed;
  z-index:20;
  top:0;
  left:0;
  width:100%;
  max-width:none;
  margin:0;
  color:#fff9ee;
  background:rgba(190,76,28,var(--nav-bg-alpha));
  box-shadow:0 1px 0 rgba(255,255,255,var(--nav-line-alpha));
  backdrop-filter:blur(var(--nav-blur));
}
.header nav{margin-left:auto}
.scroll-identity{
  display:flex;
  flex-direction:column;
  align-items:center;
  flex-shrink:0;
  width:160px;
  aspect-ratio:598.51 / 170.17;
  color:#fff9ee;
  text-decoration:none;
  opacity:var(--nav-logo-opacity);
  transform:translateY(calc((1 - var(--nav-logo-opacity)) * -14px));
  pointer-events:none;
  transition:opacity .12s linear;
}
.scroll-identity span,
.hero-logo h1{
  font-family:"Oooh Baby","Segoe Script","Brush Script MT",cursive;
  font-weight:400;
  letter-spacing:.005em;
  -webkit-text-stroke:.35px currentColor;
}
.scroll-identity span{font-size:clamp(29px,2.5vw,42px);line-height:.9}
.scroll-identity small,
.hero-logo p{
  font-family:Arial,sans-serif;
  text-transform:uppercase;
  letter-spacing:.28em;
}
.scroll-identity small{margin-top:7px;font-size:7px;line-height:1.3}
body.logo-docked .scroll-identity{pointer-events:auto}
.hero{display:grid;place-items:center;padding:130px 8% 150px}
.hero-brand{
  max-width:none;
  text-align:center;
  transform:translateY(-3vh);
}
.hero-logo{
  opacity:var(--hero-logo-opacity);
  transform:translateY(var(--logo-shift)) scale(var(--logo-scale));
  transform-origin:center top;
  will-change:transform,opacity;
}
.hero-logo h1{
  color:#fff;
  font-size:clamp(78px,9vw,148px);
  line-height:.9;
  letter-spacing:.005em;
  text-shadow:0 3px 24px rgba(5,9,28,.44);
}
.hero-logo h1 img{
  display:block;
  width:clamp(360px,43vw,720px);
  height:auto;
  filter:drop-shadow(0 4px 10px rgba(7,12,30,var(--logo-shadow-alpha)));
}
.hero-logo p{
  margin:25px auto 0;
  color:#fff9ee;
  font-size:clamp(10px,1vw,14px);
  line-height:1.5;
  text-shadow:0 2px 12px rgba(5,9,28,.6);
}
.hero-brand .button{margin-top:52px}

@media(max-width:1100px){
  .header{justify-content:flex-end}
  .scroll-identity{position:absolute;left:5%;width:clamp(110px,15vw,160px)}
  .hero{height:auto;padding:125px 7% 150px}
}
@media(max-width:760px){
  .header{justify-content:space-between}
  .scroll-identity{position:static;align-items:flex-start}
  .scroll-identity span{font-size:29px}
  .scroll-identity small{max-width:230px;font-size:6px;letter-spacing:.2em}
  .hero{height:auto;padding:120px 6% 145px}
  .hero-brand{transform:translateY(-1vh)}
  .hero-logo h1{font-size:clamp(62px,18vw,94px)}
  .hero-logo p{max-width:330px;margin-top:20px;font-size:9px;letter-spacing:.2em}
  .hero-brand .button{margin-top:42px}
}
@media(prefers-reduced-motion:reduce){
  .hero-logo{transform:none}
}

/* Keep the hero logo as the single visible mark while it docks into the header. */
.scroll-identity{
  visibility:hidden;
  opacity:1;
  transform:none;
  transition:none;
}
.hero-logo{
  position:fixed;
  z-index:30;
  top:34vh;
  left:50%;
  width:max-content;
  max-width:90vw;
  opacity:1;
  pointer-events:none;
  transform:translateX(-50%) scale(1);
  transform-origin:center top;
  will-change:top,left,transform;
}
.hero-brand{transform:none}
.hero-brand .button{margin-top:230px}
@media(max-width:760px){
  .hero-brand .button{margin-top:190px}
}
@media(prefers-reduced-motion:reduce){
  .hero-logo{transform:translateX(-50%) scale(1)}
}

/* New Brighton: Anna's coastal home ground fills the opening viewport. */
.hero-wrap{
  position:relative;
  isolation:isolate;
  display:flex;
  min-height:100vh;
  min-height:100svh;
  flex-direction:column;
  overflow:hidden;
  background-color:#18234d;
  background-image:url('/assets/new-brighton-dunes-landscape-illustration-v2.png');
  background-position:center center;
  background-size:cover;
}
.hero-wrap:before{
  content:'';
  position:absolute;
  z-index:0;
  inset:0;
  background:none;
  pointer-events:none;
}
.header,.hero{position:relative;z-index:1;color:#fff9ee;text-shadow:0 2px 18px rgba(4,8,27,.38)}
.header nav a:hover{color:#ffe0ad}
.menu-toggle>span{background:#fff9ee}
.hero{
  flex:1;
  width:100%;
  height:auto;
  min-height:0;
  padding-top:clamp(48px,7vh,92px);
  padding-bottom:clamp(150px,20vh,230px);
}
.hero-copy>p{max-width:620px}
.hero-note,.location{color:#fff9ee;text-shadow:0 2px 12px rgba(4,8,27,.7)}

@media(min-width:1600px){
  .hero-wrap{background-size:cover}
  .hero{height:auto;min-height:0}
  .hero-note,.location{color:#fff9ee;text-shadow:0 2px 12px rgba(4,8,27,.7)}
}
@media(max-width:760px){
  .hero-wrap{min-height:100svh;background-size:cover;background-position:54% center}
  .hero-wrap:before{background:none}
  .header{color:#fff9ee;text-shadow:0 2px 14px rgba(4,8,27,.55)}
  .header nav{background:rgba(20,25,57,.9);backdrop-filter:blur(12px)}
  .hero{height:auto;min-height:0;padding-top:clamp(30px,5vh,54px);padding-bottom:180px}
}

/* Preview 2 overrides must follow the shared hero rules above. */
.hero-wrap{overflow:visible;isolation:auto}
.header{position:fixed;z-index:20;top:0;left:0;width:100%;max-width:none;margin:0}
.hero{z-index:auto;display:grid;place-items:center;padding:130px 8% 150px}
@media(max-width:1100px){.hero{height:auto;padding:125px 7% 150px}}
@media(max-width:760px){.hero{height:auto;min-height:0;padding:120px 6% 145px}}

.hero-logo h1{margin:0}
@media(max-width:760px){
  body.logo-in-header .hero-logo{z-index:42}
}
@media(max-width:1100px){
  .header.menu-open{
    z-index:40;
    background:rgba(190,76,28,.92);
    box-shadow:0 1px 0 rgba(255,255,255,.12);
    backdrop-filter:blur(16px);
  }
  .header{
    min-height:48px;
    height:48px;
    padding:4px 5%;
    gap:10px;
  }
  .scroll-identity{
    width:140px;
    height:40px;
  }
  .scroll-identity span,
  .scroll-identity small{display:none}
  .menu-toggle{
    position:relative;
    z-index:2;
    width:36px;
    height:36px;
    padding:4px;
  }
  .header nav{position:relative;z-index:1}
  .hero-logo h1 img{
    width:88vw;
    max-width:88vw;
  }
}

/* Keep the mobile navigation outside the fixed header and animate it as a pop-up. */
@media(max-width:1100px){
  .header nav{
    position:absolute;
    z-index:41;
    top:calc(100% + 10px);
    left:5%;
    right:5%;
    display:flex;
    width:auto;
    max-height:0;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    overflow:hidden;
    padding:0 20px;
    border:1px solid rgba(255,255,255,.12);
    border-radius:14px;
    background:#321946;
    box-shadow:0 14px 32px rgba(12,5,22,.3);
    backdrop-filter:blur(16px);
    opacity:0;
    pointer-events:none;
    transform:translateY(-8px) scale(.98);
    transform-origin:top center;
    visibility:hidden;
    transition:opacity .2s ease,transform .24s cubic-bezier(.2,.75,.25,1),max-height .28s ease,padding .28s ease,visibility 0s linear .28s;
  }
  .header nav.open{
    max-height:min(430px,calc(100vh - 72px));
    overflow-y:auto;
    padding:12px 20px;
    opacity:1;
    pointer-events:auto;
    transform:translateY(0) scale(1);
    visibility:visible;
    transition:opacity .2s ease,transform .24s cubic-bezier(.2,.75,.25,1),max-height .28s ease,padding .28s ease,visibility 0s;
  }
  .header nav a{
    width:100%;
    padding:12px;
    color:#fff9ee;
    font-size:20px;
  }
  .header nav a:hover{color:#f1d8ff}
}
@media(prefers-reduced-motion:reduce){
  .header nav,
  .header nav.open{transition:none}
}

@media(max-width:760px){
  .hero-brand .button{
    scale:.5;
    transform-origin:center center;
  }
}

/* Keep the desktop brand and navigation on one compact, centered row. */
@media(min-width:1101px){
  .header{height:108px;padding:0 5%;align-items:center}
}

/* Keep homepage navigation labels crisp like the child page navigation. */
.header nav a{text-shadow:none}

/* Match the child-page navigation's underline interaction. */
.header nav a:hover,
.header nav a:focus-visible,
.header nav a[aria-current="page"]{
  color:#fff9ee;
  text-decoration:underline;
  text-decoration-color:rgba(255,255,255,.72);
  text-underline-offset:7px;
}

/* Match the broad, shallow arch in the portrait reference while keeping long sides. */
.portrait-photo{aspect-ratio:2/3;object-position:center;border-radius:50% 50% 18px 18px / 18% 18% 18px 18px}
.portrait:before{border-radius:50% 50% 22px 22px / 18% 18% 22px 22px}
.footer-credit-link,.footer-credit-link:hover,.footer-credit-link:focus-visible{color:inherit;text-decoration:none}

/* Compact navigation also serves tablet portrait and landscape. */
@media(max-width:1100px){.header{flex-wrap:nowrap;justify-content:space-between}.scroll-identity{position:static;flex-shrink:0}.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;border:0;background:transparent;cursor:pointer}.menu-toggle>span{height:1px;width:28px;background:#fff9ee}}
