@charset "UTF-8";
:root{--cream:#f6f1e7;--paper:#eee7d9;--ink:#4f4739;--sage:#747d63;--line:rgba(79,71,57,.22);--pointer-x:0px;--pointer-y:0px;--scroll:0}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--cream);color:var(--ink);font-family:Arial,Helvetica,sans-serif;font-size:15px;-webkit-font-smoothing:antialiased}body.locked{overflow:hidden}button,a,input{ -webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid #8b622e;outline-offset:6px}button{border:0}img{display:block;max-width:100%}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:Georgia,'Times New Roman',serif;font-weight:400}em{font-weight:400}::selection{background:#b7bf9f;color:#332c24}.skip{position:fixed;top:-100px;left:20px;z-index:100;background:var(--ink);color:white;padding:15px}.skip:focus{top:10px}.nav{height:102px;position:absolute;top:0;left:0;width:100%;display:flex;align-items:center;justify-content:space-between;padding:0 5.2%;z-index:20;border-bottom:1px solid var(--line)}.wordmark{font:31px Georgia,serif;letter-spacing:4px;display:block;line-height:1}.wordmark span{display:block;font:7px Arial,sans-serif;letter-spacing:2.3px;margin-top:9px}.nav nav{display:flex;gap:38px;padding-left:32px;font-size:12px}.nav nav a{position:relative;padding:15px 0}.nav nav a:after{content:'';position:absolute;bottom:7px;height:1px;background:var(--ink);left:0;width:0;transition:width .3s}.nav nav a:hover:after{width:100%}.motion-button{background:transparent;display:flex;align-items:center;gap:10px;font-size:11px}.motion-icon{border:1px solid var(--line);border-radius:50%;width:32px;height:32px;display:grid;place-items:center;font-size:12px}.hero{height:100svh;min-height:850px;max-height:1200px;position:relative;overflow:hidden;background:#f9f4e9}.hero-copy{position:relative;text-align:center;z-index:4;padding-top:158px;pointer-events:none}.hero-copy a{pointer-events:auto}.eyebrow{font-size:9px;letter-spacing:2.5px;font-weight:500;line-height:1.7}.hero h1{font-size:clamp(68px,7.8vw,118px);line-height:.99;letter-spacing:-5px;margin:23px auto 19px}.hero h1 span{display:inline-block;animation:rise 1.3s cubic-bezier(.2,.7,.2,1) both}.hero h1 em{display:inline-block;color:#7b8068;animation:rise 1.3s .13s cubic-bezier(.2,.7,.2,1) both}.hero-desc{font-size:12px;line-height:1.8;color:#776c59;margin-bottom:22px}.pill{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;border-radius:100px;background:var(--ink);color:var(--cream);font-size:11px;padding:18px 25px;min-width:210px;transition:background .3s,transform .3s;line-height:1.2}.pill span{font-size:18px;font-weight:300}.pill:hover{background:#777e63;transform:translateY(-3px)}.intro{animation:rise 1.2s .3s both}.woodland{position:absolute;inset:11% -1% -3%;z-index:1;pointer-events:none;transform:translate3d(calc(var(--pointer-x) * -.25),calc(var(--pointer-y) * -.25),0)}.landscape{width:100%;height:100%;object-fit:cover;object-position:center 61%;filter:saturate(.78);transform:translateY(calc(var(--scroll) * 55px)) scale(1.025)}.landscape-wash{position:absolute;inset:0;background:linear-gradient(to bottom,#f9f4e9 0%,rgba(249,244,233,.82) 14%,rgba(249,244,233,.12) 50%,transparent 70%)}.roo-position{position:absolute;left:50%;bottom:10%;width:clamp(280px,27vw,420px);transform:translate3d(calc(-50% + var(--pointer-x)),var(--pointer-y),0)}.roo-family{width:100%;transform-origin:50% 90%;animation:breathe 5.5s ease-in-out infinite;filter:drop-shadow(0 8px 8px #64583509)}.ripple{position:absolute;width:65px;height:17px;border:1px solid #faf8e6cc;border-radius:50%;opacity:0;animation:ripple 6s infinite ease-out}.ripple-one{left:28%;bottom:12%}.ripple-two{right:15%;top:39%;animation-delay:2.8s}.seed{position:absolute;width:4px;height:8px;background:#a9a07b;border-radius:80% 10%;opacity:.4;animation:drift 12s infinite ease-in-out}.seed-a{left:17%;top:30%}.seed-b{right:12%;top:47%;animation-delay:-4s}.seed-c{left:76%;top:22%;animation-delay:-7s}.hero-bottom{position:absolute;bottom:31px;left:5.2%;right:5.2%;display:flex;justify-content:space-between;align-items:center;z-index:5;font-size:8px;letter-spacing:1.6px}.scroll-note{display:flex;align-items:center;gap:12px}.scroll-line{height:31px;width:1px;background:#9a977f;position:relative;overflow:hidden}.scroll-line:after{content:'';display:block;width:1px;height:12px;background:var(--ink);animation:scrollline 2.5s infinite}.section-pad{padding:90px 7.5%}.section-marker{display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line);padding-bottom:20px;font-size:8px;letter-spacing:2px;gap:20px}.tiny-star{font-size:29px;font-weight:400}.story{position:relative;overflow:hidden;min-height:660px;padding-bottom:82px}.story-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:11%;padding-top:68px}.story h2{font-size:clamp(40px,4.6vw,68px);line-height:1.13;letter-spacing:-2.6px}.story h2 em{color:var(--sage)}.signature{font:italic 19px Georgia,serif;margin-top:40px;color:#8c806a}.story-copy{padding-top:8px;font-size:14px;line-height:1.95;max-width:380px}.story-copy p+p{margin-top:21px}.text-link{background:none;border-bottom:1px solid var(--line);display:inline-flex;justify-content:space-between;align-items:center;gap:30px;font-size:11px;padding:12px 0;transition:gap .3s}.text-link:hover{gap:43px}.story-copy .text-link{margin-top:28px}.story-ornament{position:absolute;width:150px;left:47%;bottom:-22px;opacity:.6;transform:rotate(-13deg);pointer-events:none}.quiet-caption{font:italic 13px Georgia,serif;text-align:center;margin-top:90px;color:#8a806f}.panorama{height:560px;position:relative;background:#e8dfcd;overflow:hidden}.panorama-track{position:absolute;inset:0 -20%;background:url('assets/pattern.webp') center/680px auto repeat;transform:translateX(calc(var(--progress,0) * -140px));filter:saturate(.65);opacity:.65}.panorama:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#f7f1e651,transparent 40%,#f7f1e651)}.panorama-label{position:absolute;inset:0;z-index:1;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;background:radial-gradient(ellipse at center,#f8f2e9e8 0,#f8f2e9bd 20%,transparent 68%)}.panorama-label>span{font-size:8px;letter-spacing:3px}.panorama-label p{font:52px/1.15 Georgia,serif;letter-spacing:-2px;margin-top:25px}.panorama-label em{color:var(--sage)}.panorama-caption{position:absolute;bottom:28px;left:0;right:0;text-align:center;font:italic 13px Georgia,serif;z-index:2}.collection{background:#757d65;color:#faf5e9;padding-bottom:110px}.collection .section-marker{border-color:#f6f1e73d}.collection-heading{display:flex;justify-content:space-between;align-items:end;margin:62px 0 48px}.collection-heading h2{font-size:clamp(48px,5.6vw,82px);line-height:1.04;letter-spacing:-3px}.collection-heading p{font-size:12px;line-height:1.8;opacity:.75;padding-bottom:10px}.product-grid{display:grid;grid-template-columns:1.2fr 1fr;gap:8%;align-items:center}.product-photo{position:relative;aspect-ratio:.95;background:#e6ddcb;overflow:hidden}.product-photo>img{height:100%;width:100%;object-fit:cover;object-position:62% center;transition:transform 1s}.product-photo:hover>img{transform:scale(1.045)}.photo-label{position:absolute;top:24px;left:24px;font-size:8px;letter-spacing:2px;color:var(--ink)}.concept-caption{position:absolute;bottom:18px;left:24px;font-size:8px;letter-spacing:1px;color:var(--ink);background:#f8f3e7b8;padding:6px 9px}.round-button{display:grid;place-items:center;border:1px solid var(--line);background:var(--cream);color:var(--ink);border-radius:50%;width:45px;height:45px;font:28px Georgia,serif;transition:transform .3s,background .3s}.round-button:hover{transform:rotate(8deg);background:#e5dcc9}.favorite{position:absolute;right:20px;top:20px;font-size:25px}.favorite[aria-pressed=true]{background:var(--ink);color:#f8e9c9}.product-copy .eyebrow{opacity:.7}.product-copy h3{font-size:clamp(44px,4.2vw,62px);line-height:1.06;letter-spacing:-2.4px;margin:25px 0}.product-description{font-size:13px;line-height:1.95;opacity:.88;max-width:350px}.palette{display:flex;align-items:center;gap:10px;margin:28px 0}.palette button{background:var(--swatch);height:20px;width:20px;border-radius:50%;outline:1px solid transparent;outline-offset:4px}.palette button[aria-pressed=true]{outline-color:#f7f1e8}.palette span{font-size:9px;letter-spacing:.5px;margin-left:6px;opacity:.7}.product-spec{display:flex;gap:15px;flex-wrap:wrap;border-top:1px solid #f6f1e73d;border-bottom:1px solid #f6f1e73d;padding:17px 0;font-size:7px;letter-spacing:1px}.pill.light{background:#f6f1e7;color:var(--ink);margin-top:30px;min-width:230px}.pill.light:hover{background:#e7dac2}.small-note{margin-top:15px;font:italic 11px Georgia,serif;opacity:.7}.moments{padding-top:85px;padding-bottom:100px}.moments-grid{display:grid;grid-template-columns:1fr 1fr;align-items:center;gap:13%;padding-top:65px}.moments-art{position:relative;padding:25px}.art-circle{border-radius:50% 50% 46% 46%;aspect-ratio:1;overflow:hidden;outline:1px solid var(--line);outline-offset:18px;transform:rotate(-7deg)}.art-circle img{width:100%;height:100%;object-fit:cover;object-position:48% center;transform:scale(1.08);transition:transform 2s}.art-circle:hover img{transform:scale(1.2) rotate(7deg)}.orbit-text{display:block;font:italic 15px Georgia,serif;text-align:center;margin-top:39px}.moments h2{font-size:clamp(40px,4.4vw,65px);line-height:1.08;letter-spacing:-2px;margin-bottom:36px}.moments h2 em{color:var(--sage)}.moment-tabs{display:flex;gap:23px;border-bottom:1px solid var(--line)}.moment-tabs button{padding:13px 0;background:none;font-size:10px;white-space:nowrap;border-bottom:2px solid transparent;opacity:.6}.moment-tabs button[aria-selected=true]{border-color:var(--sage);opacity:1}.moment-panel{min-height:120px;padding-top:24px;font-size:13px;line-height:1.95;max-width:350px}.care{background:#eae5d8;display:grid;grid-template-columns:1fr 1fr;gap:12%;align-items:center}.care h2{font-size:39px;line-height:1.22;letter-spacing:-1.6px;margin:21px 0}.care-intro>p:last-child{max-width:310px;font-size:11px;line-height:1.9;opacity:.7}.care-accordion details{border-top:1px solid var(--line)}.care-accordion details:last-child{border-bottom:1px solid var(--line)}summary{cursor:pointer;display:flex;align-items:center;list-style:none;gap:20px;padding:24px 0;font-size:12px}summary::-webkit-details-marker{display:none}summary>span{font-size:8px;opacity:.5}summary b{margin-left:auto;font-size:20px;font-weight:400;transition:transform .3s}details[open] summary b{transform:rotate(45deg)}details>p{font-size:12px;line-height:1.9;padding:0 25px 25px 32px;opacity:.8}.closing{position:relative;padding:106px 20px 0;text-align:center;min-height:620px;overflow:hidden}.closing h2{font-size:clamp(44px,5.3vw,78px);line-height:1.1;letter-spacing:-2.5px;margin:25px 0 30px}.closing h2 em{color:var(--sage)}.closing-roo{width:200px;margin:65px auto 0}.closing-roo img{animation:breathe 5.5s ease-in-out infinite;transform-origin:50% 95%}.closing-botanical{position:absolute;width:310px;left:-70px;bottom:-40px;transform:rotate(22deg);opacity:.55;pointer-events:none}footer{border-top:1px solid var(--line);padding:39px 5.2%;display:grid;grid-template-columns:1fr 1.2fr 1fr;align-items:center;gap:30px}footer .wordmark{font-size:26px}footer>p{font:italic 16px Georgia,serif;text-align:center}footer>div{display:flex;gap:25px;justify-content:end;font-size:10px}footer small{grid-column:1/-1;text-align:center;font-size:8px;letter-spacing:1px;opacity:.6;margin-top:10px}.reveal{opacity:0;transform:translateY(25px);transition:opacity .9s,transform .9s}.reveal.visible{opacity:1;transform:none}dialog{width:min(1100px,94vw);max-height:92svh;padding:0;border:0;background:var(--cream);color:var(--ink);box-shadow:0 30px 100px #20180d45}dialog::backdrop{background:#28261ee0;backdrop-filter:blur(8px)}.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:26px 30px;border-bottom:1px solid var(--line)}.dialog-head h2{font-size:30px;letter-spacing:-1px;margin-top:5px}.pattern-viewport{height:58svh;overflow:hidden;cursor:grab;touch-action:none;position:relative;background:#f6efde}.pattern-viewport:active{cursor:grabbing}.pattern-sheet{position:absolute;inset:-1500px;background-image:url('assets/pattern.webp');background-repeat:repeat;background-size:650px auto;will-change:transform}.dialog-controls{display:flex;align-items:center;gap:20px;padding:15px 30px;font-size:10px}.dialog-controls>span{margin-right:auto}.dialog-controls input{width:120px;accent-color:var(--sage)}.dialog-controls .text-link{font-size:10px}.toast{position:fixed;left:50%;bottom:30px;transform:translate(-50%,30px);background:var(--ink);color:var(--cream);padding:15px 24px;border-radius:50px;font-size:11px;z-index:100;opacity:0;pointer-events:none;transition:opacity .3s,transform .3s}.toast.shown{opacity:1;transform:translate(-50%,0)}.motion-paused *, .motion-paused *:before,.motion-paused *:after{animation-play-state:paused!important}.motion-paused{scroll-behavior:auto}.motion-paused .woodland,.motion-paused .landscape,.motion-paused .panorama-track{transform:none}.motion-paused .reveal{opacity:1;transform:none;transition:none}@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}@keyframes breathe{0%,100%{transform:scaleY(1) rotate(-.2deg)}50%{transform:scaleY(1.012) rotate(.2deg)}}@keyframes ripple{0%{transform:scale(.4);opacity:0}30%{opacity:.5}100%{transform:scale(2);opacity:0}}@keyframes drift{0%,100%{transform:translate(0,0) rotate(0)}50%{transform:translate(25px,45px) rotate(130deg)}}@keyframes scrollline{0%{transform:translateY(-15px)}100%{transform:translateY(35px)}}
@media(min-width:1700px){.section-pad{padding-left:max(8%,calc((100% - 1450px)/2));padding-right:max(8%,calc((100% - 1450px)/2))}}@media(max-width:900px){.nav{padding:0 6%;height:86px}.nav nav{gap:22px;padding:0;font-size:10px}.motion-label{display:none}.hero{min-height:830px}.hero-copy{padding-top:145px}.hero h1{font-size:82px}.hero-bottom{left:6%;right:6%}.chapter-tag{font-size:7px}.section-pad{padding:65px 7%}.story-grid{gap:7%;grid-template-columns:1.2fr 1fr}.story h2{font-size:44px}.story-copy{font-size:12px}.panorama{height:460px}.product-grid{gap:6%}.product-copy h3{font-size:47px}.product-description{font-size:12px}.product-spec{gap:10px;font-size:6px}.moments-grid{gap:8%}.moment-tabs{gap:15px}.moment-tabs button{font-size:9px}.care{gap:7%}.care h2{font-size:31px}footer{grid-template-columns:1fr 1fr}footer>p{text-align:right}footer>div{grid-column:1/-1;justify-content:center}footer small{margin:0}}@media(max-width:600px){.nav{height:80px}.wordmark{font-size:26px}.wordmark span{font-size:6px;letter-spacing:1.8px}.nav nav{gap:16px;font-size:10px}.nav nav a:first-child{display:none}.hero{height:94svh;min-height:760px;max-height:950px}.hero-copy{padding-top:132px}.hero-copy .eyebrow{font-size:7px;letter-spacing:1.8px}.hero h1{font-size:65px;letter-spacing:-3.5px;margin-top:22px}.hero-desc{font-size:11px;margin:19px auto}.pill{padding:16px 21px;min-width:190px;font-size:10px}.woodland{inset:32% -50% -3%}.landscape{object-position:center 60%;filter:saturate(.75)}.landscape-wash{background:linear-gradient(to bottom,#f9f4e9 0%,#f9f4e9c7 8%,transparent 46%)}.roo-position{width:260px;bottom:13%}.hero-bottom{bottom:25px}.scroll-note{font-size:6px;letter-spacing:1px;gap:8px}.chapter-tag{font-size:6px;letter-spacing:1px}.section-pad{padding:55px 7%}.section-marker{font-size:7px;letter-spacing:1.5px;align-items:center}.section-marker>span:nth-child(2):not(.tiny-star){max-width:130px;text-align:right;font-size:6px;line-height:1.8}.story-grid{grid-template-columns:1fr;gap:34px;padding-top:38px}.story h2{font-size:44px;letter-spacing:-1.8px}.signature{font-size:16px;margin-top:24px}.story-copy{max-width:100%;font-size:12px;padding-right:28px}.story-copy p+p{margin-top:16px}.story-ornament{left:auto;right:-25px;width:110px;bottom:30px;opacity:.3}.quiet-caption{text-align:left;margin-top:55px;font-size:11px}.panorama{height:420px}.panorama-track{background-size:520px auto;inset:0 -50%}.panorama-label p{font-size:39px}.panorama-label>span{font-size:7px}.panorama-caption{font-size:11px}.collection-heading{margin:40px 0 30px}.collection-heading h2{font-size:49px;letter-spacing:-2px}.collection-heading p{font-size:9px;max-width:110px;line-height:1.7}.product-grid{grid-template-columns:1fr;gap:34px}.product-photo{aspect-ratio:1.1}.product-photo>img{object-position:60% center}.product-copy{padding:0 3px}.product-copy h3{font-size:47px;margin:19px 0}.product-description{max-width:100%;font-size:12px}.product-spec{font-size:7px;gap:20px}.small-note{font-size:11px}.moments-grid{grid-template-columns:1fr;padding-top:40px;gap:50px}.moments-art{max-width:310px;margin:auto;padding:20px}.moments h2{font-size:45px}.moments-content{padding:0 3px}.moment-tabs{gap:27px}.moment-tabs button{font-size:10px}.moment-panel{min-height:110px;max-width:100%;font-size:12px}.care{grid-template-columns:1fr;gap:30px}.care h2{font-size:33px}.care-intro>p:last-child{max-width:100%}.care .eyebrow{font-size:7px}.closing{padding:75px 7% 0;min-height:550px}.closing h2{font-size:43px;letter-spacing:-1.8px;margin-top:24px}.closing>.eyebrow{font-size:7px}.closing-botanical{width:200px;left:-90px;bottom:0}.closing-roo{width:170px;margin-top:55px}footer{padding:30px 7%;gap:25px}footer>p{font-size:11px}.dialog-head{padding:18px}.dialog-head h2{font-size:24px}.dialog-head .eyebrow{font-size:7px}.dialog-head .round-button{width:35px;height:35px}.pattern-viewport{height:58svh}.dialog-controls{padding:10px 18px;gap:12px;flex-wrap:wrap}.dialog-controls>span{width:100%;font-size:9px}.dialog-controls>label{font-size:9px}.dialog-controls input{flex:1}.toast{width:max-content;max-width:90vw;text-align:center;font-size:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}.woodland,.landscape,.panorama-track{transform:none!important}}
.pattern-sheet{background-repeat:no-repeat;background-position:center;background-color:#f6efe1}.panorama-track{background-size:cover;background-repeat:no-repeat}.art-circle img{object-position:20% center}
.story-ornament,.closing-botanical{mix-blend-mode:multiply;mask-image:radial-gradient(ellipse at center,black 30%,transparent 73%)}.ripple{display:none}.roo-position{width:clamp(265px,26vw,380px);bottom:9%}@media(max-width:600px){.roo-position{width:250px;bottom:12%}}

.variant-note{font-size:10px;letter-spacing:1px;margin:-10px 0 24px;opacity:.75}.palette{gap:12px}.palette button{width:22px;height:22px}.product-photo>img{object-position:center}.product-photo{aspect-ratio:.9}
@media(min-width:601px){.hero{min-height:720px}.hero h1{font-size:clamp(68px,7vw,104px)}.hero-copy{padding-top:143px}.roo-position{width:clamp(240px,23vw,340px);bottom:8%}}


/* TLRCO BRAND EXPERIENCES — independent of ERP routes, prices and server scripts. */
.color-theatre{padding:36px 28px 22px;display:flex;flex-direction:column;align-items:center;justify-content:space-between;background:#d9d1c3;min-height:680px;color:var(--ink);position:relative;--variant-index:0}
.color-theatre h4{font:normal 28px/1.2 Georgia,serif;text-align:center;margin:0 0 24px;letter-spacing:-.8px;max-width:280px}
.theatre-swatches{position:relative;display:flex;gap:14px;justify-content:center;margin:0 auto 36px;width:max-content}
.theatre-swatches button{height:26px;width:26px;border-radius:50%;background:var(--swatch);border:1px solid #ffffff40;padding:0;outline-offset:4px}
.theatre-swatches button[aria-pressed=true]{outline:1px solid var(--ink)}
.theatre-cursor{position:absolute;left:9px;top:30px;width:11px;height:17px;background:var(--ink);clip-path:polygon(50% 0,100% 100%,50% 78%,0 100%);transform:translateX(calc(var(--variant-index)*40px));transition:transform .65s cubic-bezier(.2,.8,.2,1);pointer-events:none}
.theatre-cards{width:min(100%,290px);position:relative;margin:auto;perspective:900px}
.theatre-card{margin:0}.theatre-bottom{display:flex;flex-direction:column;align-items:center}
.theatre-card[hidden],.roo-book-page[hidden]{display:none!important}
.theatre-card.is-active{animation:pack-reveal .65s cubic-bezier(.2,.8,.2,1) both}
.packshot-clip{position:relative;width:100%;aspect-ratio:var(--crop-w)/var(--crop-h);overflow:hidden;background:#fafafa;box-shadow:0 18px 27px #4f47392a}
.packshot-clip img{position:absolute;width:calc(100% * var(--source-w)/var(--crop-w));max-width:none;height:auto;left:calc(-100% * var(--crop-left)/var(--crop-w));top:calc(-100% * var(--crop-top)/var(--crop-h));display:block}
.theatre-caption{font:22px/1.2 Georgia,serif;min-height:32px;text-align:center;margin:22px 0 12px}.theatre-seal{width:85px;height:85px;object-fit:contain;opacity:.72;margin:15px auto 0}
.theatre-toggle{font-size:9px;letter-spacing:.5px;background:transparent;padding:10px 12px;border-bottom:1px solid #4f473935;margin-top:10px}.theatre-note{font:italic 9px/1.6 Georgia,serif;text-align:center;opacity:.65;margin-top:8px;max-width:270px}.color-theatre .favorite{z-index:2;right:12px;top:12px;width:33px;height:33px;font-size:19px}
.product-photo.color-theatre{aspect-ratio:auto;overflow:hidden}.brand-footer-logo{display:block;width:142px;max-width:100%;height:145px;object-fit:contain}.official-seal{width:130px;max-width:100%;height:auto}.brand-book-link{margin-top:18px}
.roo-storybook{background:#eae3d6;padding-top:78px;padding-bottom:78px;overflow:hidden}.roo-book-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin:38px 0}.roo-book-heading h2{font-size:clamp(39px,4.6vw,64px);line-height:1.08;letter-spacing:-2px}.roo-book-heading em{color:var(--sage)}.roo-book-heading>p{font-size:12px;line-height:1.8;max-width:230px;opacity:.75}
.roo-book-stage{background:#f8f4eb;box-shadow:0 18px 50px #4f47390b;border:1px solid #4f473914;position:relative;border-radius:3px;overflow:hidden;touch-action:pan-y}
.roo-book-page{display:grid;grid-template-columns:.78fr 1.22fr;min-height:500px}.roo-book-page.is-current{animation:story-reveal .65s ease-out both}.roo-book-copy{padding:55px 32px 55px 42px;display:flex;flex-direction:column;justify-content:center;position:relative;z-index:1}.story-page-number{font-size:8px;letter-spacing:2px;opacity:.65;margin-bottom:26px}.roo-book-copy h3{font-size:clamp(28px,3vw,43px);line-height:1.13;letter-spacing:-1.3px;margin-bottom:25px}.roo-book-copy blockquote{font:18px/1.65 Georgia,serif;margin:0 0 15px}.roo-book-copy p{font-size:12px;line-height:1.95;opacity:.8}.story-whisper{font:italic 14px/1.6 Georgia,serif!important;color:var(--sage);opacity:1!important;margin-top:21px}.roo-book-picture{margin:0;overflow:hidden;background:#f8f4eb;position:relative;align-self:stretch}.roo-book-picture img{width:100%;height:100%;object-fit:cover;object-position:center;animation:storybook-float 14s ease-in-out infinite alternate;transform-origin:center 70%}.roo-book-picture:before{content:'';position:absolute;z-index:1;inset:0 auto 0 0;width:48px;background:linear-gradient(90deg,#f8f4eb,transparent);pointer-events:none}
.roo-book-controls{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:23px;flex-wrap:wrap}.roo-book-pagination{display:flex;align-items:center;gap:13px}.roo-book-pagination [role=tab]{height:9px;width:9px;padding:0;border:1px solid var(--sage);border-radius:50%;background:transparent}.roo-book-pagination [aria-selected=true]{background:var(--sage);transform:scale(1.2)}.roo-book-arrows{display:flex;align-items:center;gap:15px}.roo-book-arrows button{height:34px;width:34px;border-radius:50%;border:1px solid var(--line);background:transparent;font-size:18px}.roo-book-status{font-size:9px;letter-spacing:.8px}.roo-book-play{background:transparent;font-size:10px;border-bottom:1px solid var(--line);padding:9px 0}.roo-book-hint{font-size:9px;line-height:1.7;opacity:.65;text-align:center;margin-top:24px}.roo-book-label{font-size:9px;letter-spacing:1px;text-align:center;opacity:.7}
@keyframes pack-reveal{from{opacity:0;transform:translateY(16px) rotateY(-7deg) scale(.97)}to{opacity:1;transform:none}}@keyframes story-reveal{from{opacity:0;transform:translateX(12px)}to{opacity:1;transform:none}}@keyframes storybook-float{from{transform:scale(1.015) translateY(0)}to{transform:scale(1.04) translateY(-3px)}}
@media(max-width:900px){.color-theatre{padding:30px 18px 18px;min-height:610px}.color-theatre h4{font-size:25px}.roo-book-page{grid-template-columns:.9fr 1.1fr;min-height:450px}.roo-book-copy{padding:35px 25px}.roo-book-copy blockquote{font-size:16px}.roo-book-heading>p{max-width:190px}}
@media(max-width:600px){.product-photo.color-theatre{aspect-ratio:auto;min-height:650px}.color-theatre{padding:36px 22px 20px}.color-theatre h4{font-size:29px;max-width:220px}.theatre-cards{width:240px;max-width:100%}.theatre-caption{font-size:23px}.theatre-seal{width:78px;height:78px}.theatre-note{font-size:8px}.roo-storybook{padding-top:55px;padding-bottom:55px}.roo-book-heading{display:block;margin:32px 0}.roo-book-heading h2{font-size:43px}.roo-book-heading>p{margin-top:20px;max-width:100%;font-size:11px}.roo-book-page{display:flex;flex-direction:column-reverse;min-height:0}.roo-book-picture{aspect-ratio:4/3;width:100%}.roo-book-picture img{height:100%;object-fit:cover}.roo-book-picture:before{inset:auto 0 0;width:100%;height:30px;background:linear-gradient(0deg,#f8f4eb,transparent)}.roo-book-copy{padding:25px 24px 30px;min-height:310px}.story-page-number{margin-bottom:16px;font-size:7px}.roo-book-copy h3{font-size:31px;margin-bottom:18px}.roo-book-copy blockquote{font-size:17px;line-height:1.6}.roo-book-copy p{font-size:11px}.roo-book-controls{gap:15px}.roo-book-label{order:3;width:100%;font-size:8px}.roo-book-status{font-size:8px}.roo-book-pagination{gap:10px}.brand-footer-logo{width:120px;height:125px}}
@media(prefers-reduced-motion:reduce){.theatre-card.is-active,.roo-book-page.is-current,.roo-book-picture img{animation:none!important}.theatre-cursor{transition:none}}
.motion-paused .theatre-card,.motion-paused .roo-book-page,.motion-paused .roo-book-picture img{animation:none!important}.motion-paused .theatre-cursor{transition:none}


/* TLRCO HERO MEADOW MOTION — brand illustration only, 29 October 2026. */
.roo-playground,.meadow-atmosphere{display:none}
.has-meadow-motion .roo-position>.roo-family{display:none}
.has-meadow-motion .roo-playground,.has-meadow-motion .meadow-atmosphere{display:block}
.has-meadow-motion .roo-position{z-index:3}
.roo-playground{position:relative;width:100%;aspect-ratio:1.55;isolation:isolate}
.roo-actor{position:absolute;bottom:0;padding:0;background:none;border:0;pointer-events:auto;transform-origin:50% 95%;-webkit-user-select:none;user-select:none;touch-action:manipulation;cursor:pointer;border-radius:45%}
.roo-actor:focus-visible{outline:1px dashed #7d765c;outline-offset:4px}
.roo-mother{right:-8%;width:78%;z-index:2}.roo-joey{left:-3%;width:43%;z-index:3}
.roo-hop-arc,.roo-hop-body{display:block;width:100%;transform-origin:58% 96%}
.roo-sprite{display:block;width:100%;height:auto;pointer-events:none;filter:drop-shadow(0 3px 2px #4f473908);-webkit-user-drag:none}
.roo-mother .roo-sprite{transform-origin:45% 98%;animation:meadow-mother-breathe 6.2s ease-in-out infinite}
.roo-joey .roo-sprite{transform-origin:65% 98%;animation:meadow-joey-listen 5.4s ease-in-out infinite}
.roo-actor.is-hopping .roo-sprite{animation-play-state:paused}
.roo-ground-shadow{position:absolute;bottom:3%;height:4%;border-radius:50%;background:radial-gradient(ellipse,#79694e80,transparent 72%);opacity:.18;z-index:0;pointer-events:none}
.roo-shadow-mother{left:45%;width:39%}.roo-shadow-joey{left:13%;width:27%}
.roo-dust{position:absolute;left:28%;bottom:5%;width:1px;height:1px;pointer-events:none;z-index:4}
.roo-dust i{position:absolute;inset:0;width:4px;height:3px;background:#af946b;opacity:0;border-radius:50%}
.roo-dust i:nth-child(even){width:3px;height:2px;background:#d1b996}
.roo-hint{position:absolute;bottom:-22px;left:8%;font:italic 10px/1.4 Georgia,serif;letter-spacing:.3px;white-space:nowrap;color:#776d59;opacity:.75;pointer-events:none}
.roo-hint>span{display:inline-block;margin-left:5px;animation:meadow-hint-nudge 3.5s ease-in-out infinite}
.roo-whisper{position:absolute;left:50%;bottom:100%;transform:translate(-50%,0);font:italic 11px/1.5 Georgia,serif;background:#faf6ebed;color:#655c49;padding:8px 15px;border:1px solid #bfb29a45;border-radius:30px;box-shadow:0 3px 10px #67583605;min-width:180px;text-align:center;pointer-events:none;opacity:0;transition:opacity .25s;z-index:6}
.roo-whisper.is-speaking{opacity:1}
.meadow-atmosphere{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.meadow-butterfly{position:absolute;width:54px;height:54px;padding:0;background:none;pointer-events:auto;touch-action:manipulation;cursor:pointer;border-radius:50%;transform-origin:center;will-change:transform}
.butterfly-near{left:26%;top:70%;animation:meadow-butterfly-near 17s ease-in-out infinite}
.butterfly-far{right:20%;top:64%;width:44px;height:44px;opacity:.8;animation:meadow-butterfly-far 21s -7s ease-in-out infinite}
.meadow-butterfly:hover,.meadow-butterfly:focus-visible{animation-play-state:paused}
.meadow-butterfly:focus-visible{outline:1px dashed #958268;outline-offset:4px}
.butterfly-hover{position:absolute;inset:7px;display:block;perspective:180px}
.butterfly-wing,.butterfly-core{position:absolute;inset:0;display:block;transform-origin:50% 50%;pointer-events:none}
.butterfly-wing img,.butterfly-core img{width:100%;height:100%;object-fit:contain;pointer-events:none}
.wing-left{clip-path:inset(0 50% 0 0);animation:meadow-wing-left .62s ease-in-out infinite}
.wing-right{clip-path:inset(0 0 0 50%);animation:meadow-wing-right .62s ease-in-out infinite}
.butterfly-core{clip-path:inset(0 47% 0 47%)}
.butterfly-far .wing-left,.butterfly-far .wing-right{animation-duration:.74s;animation-delay:-.2s}
.meadow-sunlight{position:absolute;width:190px;height:190px;right:15%;bottom:14%;background:radial-gradient(ellipse,#fff4c634,transparent 69%);border-radius:50%;mix-blend-mode:screen;animation:meadow-sunlight 9s ease-in-out infinite}
.grass-tuft{position:absolute;bottom:10%;width:32px;height:24px;transform-origin:50% 100%;animation:meadow-grass-sway 5.5s ease-in-out infinite;opacity:.45}
.grass-a{left:19%}.grass-b{right:23%;bottom:7%;transform:scale(.8);animation-delay:-2.3s}.grass-c{right:8%;bottom:13%;transform:scale(.65);opacity:.3;animation-delay:-3.7s}
.grass-tuft i{position:absolute;bottom:0;left:50%;width:2px;height:21px;border-radius:80% 10% 0 0;background:#7f8568;transform-origin:50% 100%;transform:rotate(-32deg)}
.grass-tuft i:nth-child(2){height:26px;transform:rotate(-16deg);background:#a2a184}.grass-tuft i:nth-child(3){height:30px;transform:rotate(4deg)}.grass-tuft i:nth-child(4){height:23px;transform:rotate(25deg);background:#9d9d7d}.grass-tuft i:nth-child(5){height:16px;transform:rotate(43deg)}
@keyframes meadow-mother-breathe{0%,100%{transform:scaleY(1) rotate(-.15deg)}50%{transform:scaleY(1.009) rotate(.25deg)}}
@keyframes meadow-joey-listen{0%,70%,100%{transform:rotate(0)}35%{transform:rotate(-1deg)}}
@keyframes meadow-hint-nudge{0%,75%,100%{transform:translate(0,0)}85%{transform:translate(2px,-2px)}}
@keyframes meadow-wing-left{0%,100%{transform:rotateY(0deg)}50%{transform:rotateY(68deg)}}
@keyframes meadow-wing-right{0%,100%{transform:rotateY(0deg)}50%{transform:rotateY(-68deg)}}
@keyframes meadow-butterfly-near{0%,100%{transform:translate(0,0) rotate(-12deg)}20%{transform:translate(4vw,-30px) rotate(8deg)}42%{transform:translate(10vw,-13px) rotate(-6deg)}65%{transform:translate(7vw,-58px) rotate(15deg)}82%{transform:translate(1vw,-32px) rotate(-8deg)}}
@keyframes meadow-butterfly-far{0%,100%{transform:translate(0,0) rotate(12deg)}24%{transform:translate(-5vw,-26px) rotate(-9deg)}48%{transform:translate(-8vw,8px) rotate(8deg)}75%{transform:translate(-3vw,25px) rotate(-12deg)}}
@keyframes meadow-grass-sway{0%,100%{rotate:-3deg}50%{rotate:4deg}}
@keyframes meadow-sunlight{0%,100%{opacity:.4;transform:scale(.9)}50%{opacity:.85;transform:scale(1.12)}}
.hero-meadow-resting .roo-playground *,.hero-meadow-resting .meadow-atmosphere *{animation-play-state:paused!important}
.motion-paused .roo-hop-arc,.motion-paused .roo-hop-body,.motion-paused .butterfly-hover{transform:none!important}
@media(max-width:600px){.roo-playground{aspect-ratio:1.55}.roo-hint{font-size:8px;bottom:-17px;left:6%}.roo-whisper{font-size:9px;min-width:165px;padding:7px 10px;bottom:105%}.butterfly-near{left:12%;top:75%;width:46px;height:46px}.butterfly-far{right:11%;top:67%;width:40px;height:40px;opacity:.7}.meadow-sunlight{width:130px;height:130px;right:10%;bottom:15%}.grass-a{left:13%;bottom:8%}.grass-b{right:15%;bottom:10%}.grass-c{display:none}}
@media(prefers-reduced-motion:reduce){.roo-playground *,.meadow-atmosphere *{animation:none!important;transition:none!important}.roo-hop-arc,.roo-hop-body,.butterfly-hover{transform:none!important}.roo-hint>span{transform:none}}

/* HERO — smaller butterflies and distant birds. */

.meadow-butterfly{width:44px;height:44px}.butterfly-hover{inset:13px}.butterfly-far .butterfly-hover{inset:16px}
.meadow-bird-flock{position:absolute;left:14%;top:60%;width:160px;height:43px;opacity:.52;animation:meadow-flock-travel 36s ease-in-out infinite;pointer-events:none}
.meadow-bird{position:absolute;width:14px;height:8px}.meadow-bird svg{display:block;width:100%;height:100%;overflow:visible}
.bird-wing,.bird-breast{fill:none;stroke:#857960;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}
.bird-wing{transform-origin:18px 13px;animation:meadow-bird-wing .95s ease-in-out infinite}
.bird-wing-right{animation-name:meadow-bird-wing-right}.bird-2{left:28px;top:12px;width:10px;opacity:.72}.bird-3{left:61px;top:-5px;width:13px}.bird-4{left:91px;top:14px;width:11px;opacity:.68}.bird-5{left:123px;top:4px;width:9px;opacity:.65}
.bird-2 .bird-wing,.bird-4 .bird-wing{animation-delay:-.35s;animation-duration:1.15s}.bird-3 .bird-wing,.bird-5 .bird-wing{animation-delay:-.7s;animation-duration:1.05s}
@keyframes meadow-bird-wing{0%,100%{transform:rotate(-9deg) scaleY(.5)}50%{transform:rotate(7deg) scaleY(1)}}
@keyframes meadow-bird-wing-right{0%,100%{transform:rotate(9deg) scaleY(.5)}50%{transform:rotate(-7deg) scaleY(1)}}
@keyframes meadow-flock-travel{0%,100%{transform:translate(0,0)}50%{transform:translate(21vw,-18px)}}
@media(max-width:600px){.meadow-butterfly{width:44px;height:44px}.butterfly-hover{inset:14px}.butterfly-far .butterfly-hover{inset:17px}.meadow-bird-flock{left:9%;top:64%;width:130px;opacity:.45}.meadow-bird{width:11px;height:6px}.bird-2{left:22px}.bird-3{left:48px}.bird-4{left:74px}.bird-5{left:98px}}
@media(prefers-reduced-motion:reduce){.meadow-bird-flock,.bird-wing{animation:none!important}}

/* ROO LEG FIX — original intact silhouette, continuous skin deformation. */
.roo-joey .roo-sprite{display:block}.roo-joey-mesh{display:none;width:100%;height:auto;pointer-events:none;filter:drop-shadow(0 2px 2px #4f473907)}.roo-joey.has-joey-skin .roo-sprite{display:none}.roo-joey.has-joey-skin .roo-joey-mesh{display:block}

/* ORIGINAL PACKSHOTS — owner photos, no screenshot enlargement or AI product art. */
.packshot-photo{position:relative;width:100%;aspect-ratio:1;overflow:hidden;background:#d0cec4;border-radius:2px;box-shadow:0 16px 26px #4f473920}.packshot-photo img{display:block;position:static;width:100%;height:100%;max-width:100%;object-fit:contain;transform:none;image-rendering:auto}

/* POLISHED OWNER PHOTOS — neutral packaging reference; original cloth and printing. */
.packshot-photo{background:transparent;border-radius:2px;box-shadow:0 20px 30px -12px #4f47394a,0 2px 5px #4f473912;overflow:hidden}
.packshot-photo img{aspect-ratio:1;object-fit:contain}
/* Reserve the illustration panel even while loading; a failed asset gets a real fallback. */
.roo-book-picture{min-height:0;aspect-ratio:4/3}
.roo-book-picture img{position:absolute;inset:0;width:100%;height:100%}
.roo-book-picture img[hidden],.story-image-status[hidden]{display:none!important}
.story-image-status{position:absolute;inset:0;margin:0;padding:28px;display:grid;place-content:center;text-align:center;font:italic 15px/1.8 Georgia,serif;color:#747d63;background:#f8f4eb}
.roo-book-picture.is-unavailable:before{display:none}

/* HERO CREEK — standalone scoped addition, preserve the server's existing CSS fixes. */
.hero.hero-creek{background:#f8f4eb}
.hero-creek .woodland{inset:0 -1% -2%}
.hero-creek .hero-creek-picture{position:absolute;inset:0;display:block;width:100%;height:100%}
.hero-creek .landscape{width:100%;height:100%;object-fit:cover;object-position:50% 100%;filter:none}
.hero-creek .landscape-wash{background:linear-gradient(180deg,rgba(248,244,235,.85) 0%,rgba(248,244,235,.36) 25%,rgba(248,244,235,.06) 58%,transparent 75%)}
.hero-creek .meadow-sunlight{display:none}
@media(max-width:600px){
 .hero-creek .woodland{inset:0 -1% -2%}
 .hero-creek .landscape{object-position:50% 100%}
 .hero-creek .landscape-wash{background:linear-gradient(180deg,rgba(248,244,235,.6) 0%,rgba(248,244,235,.24) 35%,transparent 65%)}
}
.hero-creek .hero-bottom>.scroll-note,.hero-creek .hero-bottom>.chapter-tag{background:#f8f4ebf2;color:#4f4739;padding:5px 9px;border-radius:20px;font-size:9px}
.hero-creek .roo-hint{background:#f8f4ebf2;color:#4f4739;opacity:1;padding:4px 9px;border-radius:20px}
@media(max-width:600px){.hero-creek .hero-bottom{gap:10px;align-items:flex-start}.hero-creek .scroll-note{max-width:62%;letter-spacing:.3px;line-height:1.5}.hero-creek .chapter-tag{max-width:35%;letter-spacing:.4px;line-height:1.5;text-align:center}}

/* PANORAMA 2560 — this block only; preserve all existing server fixes. */
.panorama.panorama-hd{--panorama-art:url('assets/panorama-meadow-original-2560.webp');--panorama-position:50% 70%;background:#f6f1e7}
.panorama.panorama-golden-horizon{--panorama-art:url('assets/panorama-golden-horizon-2560.webp');--panorama-position:50% 55%}
.panorama.panorama-sage-mist{--panorama-art:url('assets/panorama-sage-mist-2560.webp');--panorama-position:50% 55%}
.panorama-hd .panorama-track{inset:0;background-image:var(--panorama-art);background-position:var(--panorama-position);background-size:cover;background-repeat:no-repeat;transform:none!important;filter:none;opacity:1}
.panorama-hd .panorama-label{background:radial-gradient(ellipse at center,#f8f2e9f2 0,#f8f2e9c4 30%,transparent 74%)}
.panorama-hd .panorama-caption{color:#4f4739;background:#f8f2e9ed;border-radius:24px;left:50%;right:auto;transform:translateX(-50%);width:max-content;max-width:90%;padding:5px 12px;line-height:1.5}
@media(max-width:600px){.panorama-hd .panorama-track{inset:0}.panorama-hd .panorama-label p{font-size:36px}.panorama-hd .panorama-caption{font-size:11px}}

/* Situs merek .co */
.brand-site { --paper: #fffaf0; --sage: #4d5841; --line: #d8cebd; color: #443f32; background: #f6f1e7; }
.brand-site [hidden] { display: none !important; }
.brand-site :focus-visible { outline: 2px solid #806744; outline-offset: 4px; }
.brand-skip { position: absolute; z-index: 100; top: .5rem; left: .5rem; padding: .75rem; background: var(--paper); transform: translateY(-170%); }
.brand-skip:focus { transform: translateY(0); }
.brand-header { position: relative; z-index: 5; padding: .7rem clamp(1rem, 5vw, 4rem) .25rem; border-bottom: 1px solid var(--line); }
.brand-header-top, .brand-header-tools, .brand-header nav, .brand-actions { display: flex; align-items: center; flex-wrap: wrap; gap: .25rem 1rem; }
.brand-header-top { justify-content: space-between; }
.brand-header nav { margin-top: .35rem; }
.brand-header nav a, .brand-footer nav a, .brand-motion, .brand-text-link { display: inline-flex; align-items: center; min-height: 44px; font-size: .875rem; }
.brand-header nav a[aria-current], .brand-footer nav a[aria-current], .brand-text-link { text-decoration: underline; text-underline-offset: .25em; }
.brand-wordmark { display: inline-grid; font: 1.5rem/1 Georgia, serif; letter-spacing: .15em; padding-block: .3rem; }
.brand-wordmark small { font: .58rem/1.5 system-ui, sans-serif; letter-spacing: .12em; text-transform: uppercase; }
.brand-motion { background: transparent; color: inherit; border: 0; padding: 0; cursor: pointer; }
.brand-button { display: inline-flex; align-items: center; gap: .65rem; min-height: 44px; padding: .65rem 1.1rem; border-radius: 999px; background: var(--sage); color: var(--paper); font-size: .9rem; }
.brand-button:hover { background: #3d4732; }
.brand-site .hero { min-height: clamp(36rem, 78svh, 56rem); }
.brand-site .hero-bottom { padding-inline: clamp(1rem, 5vw, 4rem); }
.brand-site .hero h1 em, .brand-site .hero h1 span { opacity: 1; }
.brand-intro { background: #ede5d5; text-align: center; padding: clamp(3rem, 8vw, 7rem) 1.25rem; }
.brand-intro > p:last-child { max-width: 48ch; margin: 1.25rem auto 0; }
.brand-section { max-width: 76rem; margin-inline: auto; padding: clamp(2.8rem, 7vw, 6rem) clamp(1.15rem, 5vw, 4rem); }
.brand-intro h1, .brand-section h2 { font-family: Georgia, serif; font-weight: 400; letter-spacing: -.045em; line-height: 1.04; }
.brand-intro h1 { font-size: clamp(3rem, 8vw, 6.25rem); }
.brand-section h2 { font-size: clamp(2.1rem, 4.5vw, 4.3rem); }
.brand-intro em, .brand-section h2 em { color: var(--sage); }
.brand-kicker { font-size: .72rem; letter-spacing: .19em; text-transform: uppercase; margin: 0 0 .8rem; }
.brand-split { display: grid; align-items: start; gap: 1.5rem clamp(2rem, 7vw, 7rem); }
.brand-section p:not(.brand-kicker), .brand-intro > p:last-child { line-height: 1.7; }
.brand-split p + p { margin-top: .9rem; }
.brand-home-collection { text-align: center; border-block: 1px solid var(--line); }
.brand-home-collection .brand-actions { justify-content: center; }
.brand-color-list { list-style: none; display: flex; justify-content: center; flex-wrap: wrap; gap: .25rem 1.35rem; padding: 0; margin: 1.4rem 0; }
.brand-color-list a { display: flex; align-items: center; gap: .45rem; min-height: 44px; font-size: .9rem; }
.brand-color-list span { width: 1.1rem; height: 1.1rem; border-radius: 50%; background: var(--color); border: 1px solid #0002; }
.brand-card-grid, .brand-partners dl { display: grid; gap: 1rem; }
.brand-card { min-width: 0; border: 1px solid var(--line); background: var(--paper); scroll-margin-top: 1rem; }
.brand-card figure { margin: 0; }
.brand-card figure img { display: block; width: 100%; height: auto; }
.brand-card figcaption { padding: .45rem .85rem; border-bottom: 1px solid var(--line); font-size: .75rem; }
.brand-card-body { padding: 1rem; }
.brand-card-body h2 { font-size: clamp(1.65rem, 3vw, 2.5rem); margin-bottom: .65rem; }
.brand-card-note { display: grid; place-content: center; justify-items: center; aspect-ratio: 1; text-align: center; background: #eae7d8; }
.brand-market-note { margin: 1.5rem 0 0; max-width: 65ch; }
.brand-end { text-align: center; }
.brand-end h2 { margin-bottom: 1rem; }
.brand-site .care { display: block; max-width: 56rem; margin-inline: auto; }
.brand-partners dl { margin: 0 0 1.5rem; }
.brand-partners dl div { border-top: 1px solid var(--line); padding: 1rem 0; }
.brand-partners dt { font: 1.7rem Georgia, serif; margin-bottom: .6rem; }
.brand-partners dd { margin: 0; }
.brand-contact h2 { font-size: clamp(1.75rem, 4vw, 2.6rem); margin-bottom: .75rem; }
.brand-contact .brand-button { margin-top: .75rem; }
.brand-footer { padding: 2rem 1.2rem; background: #484434; color: var(--paper); text-align: center; }
.brand-footer-logo { display: inline-block; }
.brand-footer-logo img { object-fit: contain; }
.brand-footer nav { display: flex; justify-content: center; flex-wrap: wrap; gap: 0 1.2rem; }
@media (min-width: 600px) {
  .brand-card-grid, .brand-partners dl { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (min-width: 800px) {
  .brand-split { grid-template-columns: 1fr 1fr; }
  .brand-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
  .brand-header nav { justify-content: flex-end; margin: 0; }
}
@media (min-width: 960px) {
  .brand-card-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (prefers-reduced-motion: reduce) {
  .brand-site *, .brand-site *::before, .brand-site *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* International brand enquiry forms */
.brand-header-top { gap: .25rem 1.5rem; }
.brand-end .brand-actions { justify-content: center; }
.brand-enquiry { display: grid; gap: 1.5rem clamp(2rem, 6vw, 6rem); align-items: start; }
.brand-enquiry h2 { margin: 0 0 .65rem; }
.brand-enquiry form { min-width: 0; padding: clamp(1rem, 4vw, 2rem); border: 1px solid var(--line); background: var(--paper); }
.brand-enquiry fieldset { min-width: 0; padding: 0; margin: 0; border: 0; }
.brand-fields { display: grid; gap: 1rem; margin-bottom: 1.25rem; }
.brand-fields label { display: block; font-size: .9rem; font-weight: 600; }
.brand-field-hint { font-weight: 400; }
.brand-fields :is(input, select, textarea) {
  display: block;
  width: 100%;
  min-height: 44px;
  margin-top: .3rem;
  padding: .6rem .7rem;
  border: 1px solid #968a76;
  border-radius: .25rem;
  background: #fffdfa;
  color: #443f32;
  font: 1rem/1.35 system-ui, sans-serif;
}
.brand-fields textarea { resize: vertical; }
.brand-enquiry button { border: 0; cursor: pointer; }
.brand-enquiry button:disabled { opacity: .6; cursor: default; }
.brand-enquiry .brand-preview-note { margin: 0 0 1rem; font-size: .85rem; }
.brand-form-result { margin: 1rem 0 0; padding: .8rem; border-left: 3px solid var(--sage); background: #e9eddf; }
.brand-form-result[data-form-result="error"] { border-color: #905241; background: #faeae1; }
.brand-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
@media (min-width: 800px) {
  .brand-enquiry { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
  [data-enquiry="stockist"] .brand-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  [data-enquiry="stockist"] .brand-fields label:last-child { grid-column: 1 / -1; }
}

/* Privacy and missing-page layouts */
.brand-privacy { max-width: 56rem; }
.brand-privacy section + section { margin-top: 2rem; padding-top: 2rem; border-top: 1px solid var(--line); }
.brand-privacy h2 { margin-bottom: .75rem; font-size: clamp(1.55rem, 4vw, 2.3rem); }
.brand-privacy ul { padding-inline-start: 1.25rem; }
.brand-privacy li + li { margin-top: .4rem; }
.brand-privacy p + p { margin-top: .75rem; }
.brand-privacy .brand-text-link { display: inline; font: inherit; }
.brand-not-found h1 { font: 400 clamp(3rem, 8vw, 6rem)/1 Georgia, serif; margin-bottom: .75rem; }
.brand-not-found .brand-actions { margin-top: 1.25rem; }

/* Small woodland scenes occupy reserved space, clear of all readable content. */
.page-motion {
  --page-pollen: #d0a29d;
  position: relative;
  height: 148px;
  overflow: hidden;
  isolation: isolate;
  pointer-events: none;
  background: linear-gradient(#ede5d5, #f6f1e7);
}
.page-motion *, .page-motion *::before, .page-motion *::after { pointer-events: none; }
.page-sprite { position: absolute; display: block; transform-origin: 50% 85%; }
.page-sprite img { width: 100%; height: 100%; object-fit: contain; display: block; }
.page-motion .page-butterfly { width: 72px; height: 72px; left: calc(50% - 36px); top: 18px; animation: page-flutter 8s ease-in-out infinite; }
.page-motion .page-butterfly img { animation: page-wings 1.2s ease-in-out infinite; }
.page-colour-dots { position: absolute; display: flex; gap: 16px; bottom: 30px; left: 50%; transform: translateX(-50%); }
.page-colour-dots i { width: 12px; height: 12px; border-radius: 50%; background: #d0a29d; }
.page-colour-dots i:nth-child(2) { background: #b4aba7; }
.page-colour-dots i:nth-child(3) { background: #989b8a; }
.page-colour-dots i:nth-child(4) { background: #93b9db; }
.page-colour-dots i:nth-child(5) { background: #9e826f; }
.page-pollen { position: absolute; left: calc(50% - 4px); top: 87px; width: 8px; height: 8px; border-radius: 50%; background: var(--page-pollen); animation: page-pollen 8s ease-in-out infinite; }
.page-care-leaf { position: absolute; top: 24px; left: calc(50% - 10px); width: 18px; height: 52px; border-radius: 90% 0 90% 0; background: #989f86; transform: rotate(32deg); animation: page-leaf 9s ease-in-out infinite; }
.page-care-leaf.leaf-two { margin-left: -55px; top: 38px; width: 12px; height: 38px; opacity: .6; animation-delay: -3s; }
.page-care-leaf.leaf-three { margin-left: 50px; top: 20px; width: 13px; height: 38px; opacity: .75; animation-delay: -6s; }
.page-water { position: absolute; left: calc(50% - 54px); bottom: 22px; width: 108px; height: 12px; border: 1px solid #9baaa0; border-radius: 50%; animation: page-rings 9s ease-out infinite; }
.page-perch { position: absolute; left: calc(50% - 60px); bottom: 32px; width: 120px; height: 2px; background: #a89573; transform: rotate(-5deg); }
.page-motion .page-bird { left: calc(50% - 54px); bottom: 22px; width: 108px; height: 80px; animation: page-bird-arrival 16s ease-in-out infinite; }
.page-motion[data-page-motion="privacy"] { height: 84px; }
.page-motion[data-page-motion="privacy"] .page-bird { width: 70px; height: 52px; left: calc(50% - 35px); bottom: 10px; animation: none; }
.page-motion[data-page-motion="privacy"] .page-perch { bottom: 20px; width: 80px; left: calc(50% - 40px); }
.page-motion .page-joey { width: 150px; height: 150px; left: calc(50% - 125px); bottom: 0; animation: page-joey-arrival 3.8s ease-out both; }
.page-motion .page-mother { width: 190px; height: 143px; left: calc(50% - 30px); bottom: 0; animation: page-mother-arrival 4.5s ease-out both; }
.page-mother img { transform: scaleX(-1); }
.page-ground { position: absolute; width: 240px; height: 4px; background: #b8ab8a55; left: calc(50% - 120px); bottom: 18px; border-radius: 50%; z-index: -1; }
.page-motion[data-page-motion="contact"] .page-joey { width: 88px; height: 88px; left: calc(50% - 118px); }
.page-motion[data-page-motion="contact"] .page-butterfly { left: calc(50% - 25px); top: 14px; width: 50px; height: 50px; }
.page-motion[data-page-motion="lost"] { width: 100%; max-width: 500px; margin: 0 auto 1.25rem; height: 180px; background: none; }
.page-motion[data-page-motion="lost"] .page-joey { left: calc(50% - 95px); animation: page-find 12s ease-in-out infinite; }
.page-motion[data-page-motion="lost"] .page-butterfly { left: calc(50% + 25px); top: 30px; width: 50px; height: 50px; }
.page-motion *, .page-motion *::before, .page-motion *::after { animation-play-state: paused !important; }
.page-motion.is-visible *, .page-motion.is-visible *::before, .page-motion.is-visible *::after { animation-play-state: running !important; }
.motion-paused .page-motion *, .motion-paused .page-motion *::before, .motion-paused .page-motion *::after,
.page-motion-background .page-motion *, .page-motion-background .page-motion *::before, .page-motion-background .page-motion *::after { animation-play-state: paused !important; transition: none !important; }
@keyframes page-flutter {
  0%,100% { transform: translate(-45px, 8px) rotate(-8deg); }
  45% { transform: translate(42px, -8px) rotate(8deg); }
  75% { transform: translate(5px, 4px) rotate(-4deg); }
}
@keyframes page-wings { 0%,100% { transform: scaleX(.78) rotate(-5deg); } 50% { transform: scaleX(1) rotate(5deg); } }
@keyframes page-pollen { 0%,100% { opacity: .2; transform: translate(-38px, 0); } 55% { opacity: .65; transform: translate(32px, 8px); } }
@keyframes page-leaf { 0%,100% { transform: translate(-8px, 0) rotate(25deg); } 50% { transform: translate(12px, 12px) rotate(55deg); } }
@keyframes page-rings { 0%,100% { transform: scale(.8); opacity: .25; } 65% { transform: scale(1.2); opacity: .6; } }
@keyframes page-bird-arrival {
  0%,12% { transform: translate(-60px, -10px) rotate(-8deg); opacity: .2; }
  22%,80% { transform: translate(0, 0) rotate(0); opacity: 1; }
  85% { transform: translate(0, -2px) rotate(3deg); opacity: 1; }
  92%,100% { transform: translate(0, 0) rotate(0); opacity: 1; }
}
@keyframes page-joey-arrival { from { transform: translateX(-140px) rotate(-4deg); opacity: 0; } 70% { opacity: 1; } to { transform: translateX(0) rotate(0); opacity: 1; } }
@keyframes page-mother-arrival { from { transform: translateX(150px) rotate(3deg); opacity: 0; } 70% { opacity: 1; } to { transform: translateX(0) rotate(0); opacity: 1; } }
@keyframes page-find { 0%,10% { transform: translateX(-45px) rotate(-3deg); } 32%,85% { transform: translateX(10px) rotate(0); } 100% { transform: translateX(-45px) rotate(-3deg); } }
@media (prefers-reduced-motion: reduce) {
  .page-motion *, .page-motion *::before, .page-motion *::after { animation: none !important; transition: none !important; opacity: 1; }
}

/* A turning paper leaf overlays the selected page without changing server markup. */
[data-roo-book] .roo-book-stage { perspective: 1600px; }
[data-roo-book] .roo-book-page.is-current { animation: none; }
.roo-paper-turn {
  position: absolute;
  inset: 0;
  z-index: 4;
  pointer-events: none;
  transform-style: preserve-3d;
  transform-origin: left center;
  will-change: transform;
  animation: roo-paper-forward 1.5s cubic-bezier(.3,.1,.25,1) both;
}
.roo-paper-turn.is-backward {
  transform-origin: right center;
  animation-name: roo-paper-backward;
}
.roo-paper-front, .roo-paper-back {
  position: absolute;
  inset: 0;
  backface-visibility: hidden;
  -webkit-backface-visibility: hidden;
  overflow: hidden;
  background: #f8f4eb;
  box-shadow: 0 0 18px #4f473925;
}
.roo-paper-front > .roo-book-page { height: 100%; }
.roo-paper-front .roo-book-picture img { animation: none !important; }
.roo-paper-back {
  transform: rotateY(180deg);
  background: linear-gradient(90deg, #e1d7c5, #f8f4eb 14%, #fffaf0 75%, #e8decc);
}
.roo-paper-front::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: linear-gradient(90deg, #4f473914, transparent 12%, transparent 80%, #4f473925);
}
.roo-book-record { background: transparent; border: 0; border-bottom: 1px solid var(--line); color: inherit; padding: 9px 0; font-size: 12px; cursor: pointer; min-height: 44px; }
.is-portrait-view .roo-book-stage { width: min(100%, 432px); aspect-ratio: 9 / 16; margin-inline: auto; }
.is-portrait-view .roo-book-stage > .roo-book-page,
.is-portrait-view .roo-paper-front > .roo-book-page {
  position: absolute;
  inset: 0;
  min-height: 0;
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: 41% 59%;
}
.is-portrait-view .roo-book-picture { grid-row: 1; aspect-ratio: auto; width: 100%; }
.is-portrait-view .roo-book-picture::before { inset: auto 0 0; height: 20px; width: 100%; background: linear-gradient(0deg,#f8f4eb,transparent); }
.is-portrait-view .roo-book-copy { grid-row: 2; min-height: 0; padding: 16px 20px; justify-content: center; }
.is-portrait-view .story-page-number { margin-bottom: 10px; }
.is-portrait-view .roo-book-copy h3 { font-size: clamp(23px,6vw,30px); margin-bottom: 12px; }
.is-portrait-view .roo-book-copy blockquote { font-size: 15px; line-height: 1.4; margin-bottom: 10px; }
.is-portrait-view .roo-book-copy p { font-size: 11px; line-height: 1.65; }
.is-portrait-view .roo-book-copy .story-whisper { font-size: 12px !important; margin-top: 12px; }
.is-portrait-view .roo-book-controls { max-width: 432px; margin-inline: auto; }
@keyframes roo-paper-forward {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(-180deg); }
}
@keyframes roo-paper-backward {
  0% { transform: rotateY(0deg); }
  100% { transform: rotateY(180deg); }
}
.motion-paused .roo-paper-turn { animation-play-state: paused !important; }
@media (prefers-reduced-motion: reduce) { .roo-paper-turn { display: none; } }

/* One height drives the fixed header and anchor offset. The slot never shrinks. */
:root { --header-expanded: 102px; --header-height: var(--header-expanded); --header-safe: env(safe-area-inset-top, 0px); }
:root.header-compact { --header-height: 72px; }
html { scroll-padding-top: calc(var(--header-height) + var(--header-safe) + 12px); }
.brand-header-slot { height: calc(var(--header-expanded) + var(--header-safe)); }
[data-brand-page="home"] .brand-header-slot { height: 0; }
.brand-header {
  position: fixed;
  inset: 0 0 auto;
  width: 100%;
  height: calc(var(--header-height) + var(--header-safe));
  padding: var(--header-safe) clamp(16px, 4vw, 56px) 0;
  z-index: 40;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 24px;
  background: #f6f1e7;
}
[data-brand-page="home"] .brand-header { background: transparent; }
.brand-header.is-solid { background: #f6f1e7f5; box-shadow: 0 2px 14px #443f320d; backdrop-filter: blur(12px); }
.brand-header-top { gap: 24px; flex-wrap: nowrap; }
.brand-header nav.brand-desktop-nav { margin: 0; gap: 18px; flex-wrap: nowrap; }
.brand-header .brand-motion { white-space: nowrap; min-width: 94px; font-size: 12px; }
.header-compact .brand-wordmark { font-size: 20px; }
.header-compact .brand-wordmark small { font-size: 8px; }
.brand-mobile-menu { display: none; }
.brand-card { scroll-margin-top: 0; }
@media (max-width: 999px) {
  :root { --header-expanded: 80px; }
  :root.header-compact { --header-height: 56px; }
  .brand-header { gap: 8px; }
  .brand-header-top { flex: 1; gap: 8px; }
  .brand-header .brand-wordmark { font-size: 23px; letter-spacing: .12em; }
  .brand-header .brand-wordmark small { font-size: 7px; }
  .header-compact .brand-header .brand-wordmark { font-size: 19px; }
  .brand-header nav.brand-desktop-nav { display: none; }
  .brand-mobile-menu { display: block; }
  .brand-mobile-menu > summary { min-height: 44px; padding: 0 8px; font-size: 13px; gap: 0; }
  .brand-mobile-menu > nav {
    position: absolute;
    inset: calc(var(--header-height) + var(--header-safe)) 0 auto;
    margin: 0;
    padding: 12px 24px 18px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 4px 16px;
    background: #f6f1e7;
    border-bottom: 1px solid var(--line);
    box-shadow: 0 10px 16px #443f3212;
  }
  .brand-mobile-menu:not([open]) > nav { display: none; }
}

.scroll-visitor { position: fixed; width: 120px; height: 130px; z-index: 12; pointer-events: none; animation: visitor-peek 5s ease-in-out both; will-change: transform; }
.scroll-visitor[data-side="left"] { left: 12px; --visitor-outside: -152px; }
.scroll-visitor[data-side="right"] { right: 12px; --visitor-outside: 152px; }
.scroll-visitor img { display: block; width: 100%; height: 100%; object-fit: contain; pointer-events: none; }
.scroll-visitor[data-side="right"] img { transform: scaleX(-1); }
@keyframes visitor-peek {
  0%,100% { transform: translateX(var(--visitor-outside)); opacity: 0; }
  22%,74% { transform: translateX(0); opacity: 1; }
}
.motion-paused .scroll-visitor { animation-play-state: paused !important; }
@media (max-width: 1279px), (prefers-reduced-motion: reduce) { .scroll-visitor { display: none; animation: none; } }

/* Approved mobile ideas E and D. */
[data-roo-book] .roo-book-stage > .roo-book-page .roo-book-picture img { animation: none; }
[data-roo-book] .roo-book-stage > .roo-book-page.is-current .roo-book-picture img { animation: storybook-gentle-pan 10s linear both; }
@keyframes storybook-gentle-pan { from { transform: scale(1); } to { transform: scale(1.025) translate(-.2%, -.15%); } }
.motion-paused [data-roo-book] .roo-book-stage > .roo-book-page.is-current .roo-book-picture img { animation: storybook-gentle-pan 10s linear both !important; animation-play-state: paused !important; }
.page-motion[data-page-motion="collection"] { height: 200px; pointer-events: auto; touch-action: pan-y; }
.page-motion[data-page-motion="collection"] .page-colour-dots { bottom: 70px; }
.page-motion .butterfly-greeting { position: absolute; bottom: 8px; left: 50%; transform: translateX(-50%); min-height: 44px; padding: 8px 16px; background: transparent; color: #443f32; border-bottom: 1px solid #a89573; font-size: 12px; white-space: nowrap; pointer-events: auto; }
.page-motion .butterfly-greeting:disabled { opacity: .65; cursor: default; }
.page-motion .page-butterfly.is-greeting { animation: butterfly-greet 1.8s ease-in-out both; }
.page-motion .page-butterfly.is-greeted, .page-motion .page-butterfly.is-greeted img { animation: none; }
@keyframes butterfly-greet {
  from { transform: var(--butterfly-from); }
  to { transform: translate(var(--butterfly-x), var(--butterfly-y)) rotate(0deg); }
}
@media (prefers-reduced-motion: reduce) {
  .motion-paused [data-roo-book] .roo-book-stage > .roo-book-page.is-current .roo-book-picture img,
  [data-roo-book] .roo-book-stage > .roo-book-page.is-current .roo-book-picture img { animation: none !important; transform: none !important; }
  .page-motion .page-butterfly.is-greeting { animation: none !important; }
}

/* Approved inner-page backgrounds, reusing one botanical asset. */
[data-brand-page="story"] .brand-intro,
[data-brand-page="collection"] .brand-intro,
[data-brand-page="care"] .brand-intro,
[data-brand-page="contact"] .brand-intro {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  background: #f6f1e7;
  color: #332c24;
}
[data-brand-page="story"] .brand-intro::before,
[data-brand-page="collection"] .brand-intro::before,
[data-brand-page="care"] .brand-intro::before,
[data-brand-page="contact"] .brand-intro::before {
  content: '';
  position: absolute;
  z-index: -1;
  width: clamp(260px, 35vw, 460px);
  height: 100%;
  top: 0;
  left: -35px;
  background: url('/assets/botanical.webp') left top / cover no-repeat;
  opacity: .4;
  mix-blend-mode: multiply;
  -webkit-mask-image: linear-gradient(90deg, #000 35%, transparent 100%);
  mask-image: linear-gradient(90deg, #000 35%, transparent 100%);
  pointer-events: none;
}
[data-brand-page="story"] .brand-intro::after,
[data-brand-page="contact"] .brand-intro::after {
  content: '';
  position: absolute;
  z-index: -1;
  width: clamp(240px, 30vw, 400px);
  height: 100%;
  right: -55px;
  top: 0;
  background: url('/assets/botanical.webp') left top / cover no-repeat;
  transform: scaleX(-1);
  opacity: .32;
  mix-blend-mode: multiply;
  -webkit-mask-image: linear-gradient(90deg, #000 20%, transparent 100%);
  mask-image: linear-gradient(90deg, #000 20%, transparent 100%);
  pointer-events: none;
}
[data-brand-page="story"] .roo-shelf {
  background: radial-gradient(ellipse at 85% 0%, #ead8b8, transparent 65%), linear-gradient(#f6f1e7, #eee4d2);
}
[data-brand-page="story"] .roo-shelf-head p,
[data-brand-page="story"] .roo-shelf-blurb { opacity: 1; }
[data-brand-page="collection"] .brand-intro::before { left: auto; right: -20px; transform: scaleX(-1); }
[data-brand-page="collection"] .brand-catalog {
  background: radial-gradient(ellipse at 0% 30%, #dce3cf, transparent 45%), radial-gradient(ellipse at 100% 80%, #e4e9d9, transparent 50%);
}
[data-brand-page="collection"] main { background: linear-gradient(#f6f1e7 20%, #eef0e4 65%, #f6f1e7); }
[data-brand-page="care"] .brand-intro::before { left: auto; right: -40px; transform: scaleX(-1); width: clamp(240px, 30vw, 380px); }
[data-brand-page="care"] main {
  background: radial-gradient(ellipse at 0% 85%, #e2e8db, transparent 50%), radial-gradient(ellipse at 100% 60%, #e6eade, transparent 48%), #f6f1e7;
}
[data-brand-page="care"] .care { background: linear-gradient(125deg, #f1eee3, #e5e9dd 50%, #f6f1e7); }
[data-brand-page="care"] .care-accordion details > p { opacity: 1; }
[data-brand-page="wholesale"] .brand-intro {
  background: radial-gradient(ellipse at 100% 0%, #dce3cf, transparent 70%), linear-gradient(120deg, #f6f1e7, #ebe8db);
  border-bottom: 1px solid #b4a488;
}
[data-brand-page="wholesale"] .brand-enquiry,
[data-brand-page="contact"] .brand-enquiry { background: #f6f1e7; }
[data-brand-page="contact"] .brand-intro::before { top: auto; bottom: -65px; height: 120%; transform: rotate(-12deg); }
[data-brand-page="contact"] .brand-intro::after { opacity: .26; }
[data-brand-page="contact"] main { background: radial-gradient(ellipse at 50% 0%, #eee1c9, transparent 45%), #f6f1e7; }
[data-brand-page="privacy"] .brand-intro { border-bottom: 1px solid #c0c6b1; }
[data-brand-page="404"] .brand-not-found { position: relative; isolation: isolate; }
[data-brand-page="404"] .brand-not-found::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: -1;
  background: radial-gradient(ellipse 85% 45% at 0% 110%, #dce3cf 65%, transparent 65.5%), radial-gradient(ellipse 100% 50% at 100% 120%, #e7d8bc 64%, transparent 64.5%);
  pointer-events: none;
}
@media (max-width: 600px) {
  [data-brand-page="story"] .brand-intro::before,
  [data-brand-page="collection"] .brand-intro::before,
  [data-brand-page="care"] .brand-intro::before,
  [data-brand-page="contact"] .brand-intro::before { width: 210px; left: -80px; right: auto; opacity: .32; }
  [data-brand-page="collection"] .brand-intro::before,
  [data-brand-page="care"] .brand-intro::before { left: auto; right: -80px; }
  [data-brand-page="story"] .brand-intro::after,
  [data-brand-page="contact"] .brand-intro::after { display: none; }
}

/* Rounded collection/shelf cards and a quiet scene in the reserved bottom row. */
[data-brand-page="collection"] .brand-card,
[data-brand-page="story"] .roo-shelf .brand-card {
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 6px 20px #443f3207;
}
[data-brand-page="collection"] .brand-card:focus-within,
[data-brand-page="story"] .roo-shelf .brand-card:focus-within {
  outline: 2px solid #747d63;
  outline-offset: 4px;
}
[data-brand-page="story"] .roo-shelf-card a:focus-visible { outline-offset: -4px; }
.brand-catalog > .brand-card-grid,
.roo-shelf > .brand-card-grid { position: relative; }
.brand-catalog > .brand-card-grid::after,
.roo-shelf > .brand-card-grid::after {
  content: '';
  grid-column: 1 / -1;
  height: 168px;
  border-radius: 0 0 24px 24px;
  background: radial-gradient(ellipse at 70% 100%, #e0e5d2, transparent 68%), linear-gradient(transparent 60%, #e8e2cc);
}
.grid-meadow {
  --grid-travel: 0px;
  --grid-stroll-time: 32s;
  position: absolute;
  bottom: 0;
  inset-inline: 0;
  height: 168px;
  overflow: hidden;
  border-radius: 0 0 24px 24px;
  pointer-events: none;
}
.grid-meadow *, .grid-meadow *::before, .grid-meadow *::after { pointer-events: none; }
.grid-meadow-ground { position: absolute; left: 12px; right: 12px; bottom: 24px; height: 1px; background: linear-gradient(90deg, transparent, #a7ad8e88 20%, #a7ad8e88 80%, transparent); }
.grid-roo-pair { position: absolute; left: 12px; bottom: 9px; width: 226px; height: 146px; animation: grid-roo-cross var(--grid-stroll-time) linear infinite; }
.grid-roo-facing { display: block; position: relative; width: 100%; height: 100%; animation: grid-roo-facing var(--grid-stroll-time) steps(1, end) infinite; }
.grid-roo-sprite { --roo-size: 144px; position: absolute; left: 0; bottom: 0; width: var(--roo-size); height: var(--roo-size); background-repeat: no-repeat; background-size: 600% 100%; animation: grid-roo-cycle .95s steps(6, end) infinite; }
.grid-roo-mother { background-image: url('/assets/grid-roo-mother-cycle.webp'); }
.grid-roo-joey { --roo-size: 88px; left: 138px; bottom: 7px; background-image: url('/assets/grid-roo-joey-cycle.webp'); animation-delay: -.12s; }
.grid-meadow-bird { position: absolute; right: 8%; top: 9px; width: 48px; height: 32px; background: url('/assets/page-bird-watercolor.webp') center / contain no-repeat; animation: grid-bird-drift 9s ease-in-out infinite; }
.grid-meadow-seed { position: absolute; bottom: 35px; right: 18%; width: 4px; height: 7px; border-radius: 80% 0; background: #9da380; opacity: .45; animation: grid-seed-drift 12s ease-in-out infinite; }
.grid-meadow-seed.seed-two { right: 30%; bottom: 54px; animation-delay: -5s; }
.grid-meadow *, .grid-meadow *::before, .grid-meadow *::after { animation-play-state: paused !important; }
.grid-meadow.is-visible *, .grid-meadow.is-visible *::before, .grid-meadow.is-visible *::after { animation-play-state: running !important; }
.motion-paused .grid-meadow *, .motion-paused .grid-meadow *::before, .motion-paused .grid-meadow *::after,
.grid-meadow.is-resting *, .grid-meadow.is-resting *::before, .grid-meadow.is-resting *::after { animation-play-state: paused !important; }
@keyframes grid-roo-cycle { from { background-position-x: 0; } to { background-position-x: calc(-6 * var(--roo-size)); } }
@keyframes grid-roo-cross { 0%,8%,100% { transform: translateX(0); } 44%,56% { transform: translateX(var(--grid-travel)); } 92% { transform: translateX(0); } }
@keyframes grid-roo-facing { 0%,49.99% { transform: scaleX(1); } 50%,100% { transform: scaleX(-1); } }
@keyframes grid-bird-drift { 0%,100% { transform: translate(0,0) rotate(-4deg); } 50% { transform: translate(-18px,6px) rotate(4deg); } }
@keyframes grid-seed-drift { 0%,100% { transform: translate(0,0) rotate(0); } 50% { transform: translate(-20px,-10px) rotate(30deg); } }
@media (prefers-reduced-motion: reduce) {
  .grid-meadow *, .grid-meadow *::before, .grid-meadow *::after { animation: none !important; }
  .grid-roo-sprite { background-position: 0 0; }
  .grid-roo-pair, .grid-roo-facing { transform: none; }
}
.motion-paused .roo-shelf-card:hover { transform: none; transition: none; }

/* Closing meadow bands on the other brand pages, with quieter form-page timing. */
.page-meadow-band {
  position: relative;
  width: min(1088px, calc(100% - 36px));
  height: 168px;
  margin: 0 auto 48px;
  border-radius: 24px;
  background: radial-gradient(ellipse at 70% 100%, #e0e5d2, transparent 68%), linear-gradient(transparent 60%, #e8e2cc);
}
.page-meadow-band .grid-meadow { border-radius: inherit; }
[data-brand-page="care"] .page-meadow-band .grid-meadow { --grid-stroll-time: 40s; }
[data-brand-page="contact"] .page-meadow-band .grid-meadow { --grid-stroll-time: 36s; }
[data-brand-page="wholesale"] .page-meadow-band .grid-meadow { --grid-stroll-time: 44s; }
[data-brand-page="404"] .page-meadow-band .grid-meadow { --grid-stroll-time: 28s; }
.brand-enquiry form { border-radius: 18px; }
[data-brand-page="care"] .care-accordion { border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
[data-brand-page="care"] .care-accordion details { padding-inline: 20px; }
[data-brand-page="care"] .care-accordion details:first-child { border-top: 0; }
[data-brand-page="care"] .care-accordion details:last-child { border-bottom: 0; }
[data-brand-page="care"] .care-accordion summary:focus-visible { outline-offset: -4px; }

/* ditambahkan oleh siap-co/pasang.php — jangan sunting di dist/ */
.brand-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
