@import url(type/type.css);
@font-face{font-family:Archivo;src:url(samples/archivo-latin.woff2);font-display:swap;font-weight:100 900}
@font-face{font-family:Quicksand;src:url("quicksand-500.woff2") format("woff2"), url("quicksand-500.ttf") format("truetype");font-display:swap;font-weight:500}
*{box-sizing:border-box}
html,body{margin:0;font-family:Archivo,Arial,sans-serif;color:#172e30}
a{color:inherit;text-decoration:none}
a:hover{text-decoration:underline;text-underline-offset:4px}
:focus-visible{outline:3px solid #e4b75b;outline-offset:3px}
.skip{position:absolute;transform:translateY(-140%);background:white;color:#123f40;padding:12px;z-index:20}
.skip:focus{transform:none}
.sr-only{position:absolute;width:1px;height:1px;margin:-1px;clip-path:inset(50%);overflow:hidden}
.measure{container-type:inline-size;width:100%;overflow:clip}
.measure.small{display:none}
.scene{position:relative}
.scene .paint,.scene .photo,.scene .words,.scene .anchor,.sign,.menu-key,.control{position:absolute;margin:0;box-sizing:border-box}
.paint{pointer-events:none}
.photo{display:block;object-fit:cover}
.photo.curve{clip-path:ellipse(157% 106% at 50% -6%)}
.words{font-size:max(12px,var(--size));overflow-wrap:break-word;hyphens:auto;pointer-events:none}
a.words{pointer-events:auto}
.sign{display:grid;place-items:center;text-align:center;line-height:1.05;letter-spacing:-.035em;color:#103e40;isolation:isolate;z-index:6}
.sign b{font-size:clamp(15px,2.3cqw,40px);font-weight:650}
.sign b{padding:3px 0;max-width:100%;line-height:1.03;letter-spacing:-.045em}
.sign:has(i){display:flex;align-items:center;gap:4%;text-align:left}
.sign i{background:currentColor;width:25%;height:75%;flex:none;mask-size:contain;mask-repeat:no-repeat;mask-position:center}
.sign:has(i) b{font-size:clamp(13px,1.8cqw,32px);min-width:0}
body:is([data-form="8"],[data-form="15"]) .large .sign b{text-shadow:0 2px 9px #0a222ad6}
.sign.fallback{left:5%;top:15px;padding:8px 14px;background:#fffffff2;color:#103e40;font-size:20px}
.menu-key,.control{cursor:pointer;border:0;background:#ffffffd9;color:#183e40;border-radius:2px;min-width:26px;min-height:26px;display:grid;place-items:center;padding:0;font-size:clamp(18px,2.3vw,34px);line-height:1;z-index:7}
.control{background:#152d32b3;color:white;border-radius:50%}
.control.dot{min-width:10px;min-height:10px;font-size:14px}
.fallback-key{right:4%;top:18px;width:42px;height:42px}
.demo-return{position:fixed;right:clamp(14px,3.3vw,56px);bottom:clamp(14px,2.6vw,40px);width:82px;height:82px;z-index:9;display:flex;flex-direction:column;align-items:center;justify-content:center;isolation:isolate;color:#103e40;font:650 15px/1.35 Archivo,Arial,sans-serif}
.demo-return::before,.demo-return::after{content:"";position:absolute;z-index:-1;inset:2px;background:#103e40;border-radius:10px}
.demo-return::after{transform:rotate(45deg);background:white;box-shadow:0 7px 18px #0026272b}
.demo-return small{font-size:11px;font-weight:500}
.drawer{border:0;background:#f6f6ef;color:#173d3e;box-shadow:0 8px 40px #0004;padding:34px;width:min(410px,90%);max-height:85dvh}
.drawer::backdrop{background:#001e2299}
.drawer strong{font-size:24px;display:block;padding-right:28px}
.drawer nav,.drawer nav a{display:block}
.drawer nav{margin:22px 0}
.drawer a{padding:9px 0}
.close{position:absolute;top:10px;right:12px;border:none;background:transparent;font-size:28px;cursor:pointer}
footer{display:flex;justify-content:space-between;gap:32px;background:var(--accent);color:white;padding:62px 12% 62px 7.5%;font-size:16px;line-height:1.6}
footer strong{font-size:26px}
footer a{display:block;text-decoration:underline;text-underline-offset:4px}
.demo-index {max-width:450px}
.demo-index summary {cursor:pointer;font-weight:650}
.demo-index ul{padding-left:18px;margin:10px 0}
.sample-hours{padding:32px 7.5%;background:#f4f4ee;color:#173d3e}
.sample-hours p{font-size:20px}
.reading-page{margin:0 auto;padding:clamp(42px,6vw,100px) max(6vw,calc((100% - 840px)/2));background:#f8f8f4;color:#203735;line-height:1.65}
.reading-page h1{font:600 clamp(32px,4vw,60px)/1.12 Archivo,sans-serif;margin:28px 0 18px;color:var(--accent)}
.reading-page h2{font-size:22px;margin:26px 0 10px}
.reading-page p{font-size:18px}
.reading-page a{text-decoration:underline;text-underline-offset:4px}
.reading-page{background:var(--article-paper,#f8f8f4);color:var(--article-ink,#203735)}
.reading-page h1{color:inherit}
.reading-page section{padding:12px 0}
.post-reel{position:relative!important;min-height:150px}
.reveal,.reveal-panel{position:absolute}
.reveal{font:600 clamp(15px,1.35vw,21px)/1.35 Archivo,Arial,sans-serif;display:flex;align-items:center;justify-content:space-between;text-align:start;gap:12px;padding:8px 12px;border:0;border-bottom:1px solid #b9c6c2;background:#f5f6f2;color:#193d3f;cursor:pointer;z-index:3}
.reveal b{font-size:1.3em}.reveal[aria-expanded=true] b{transform:rotate(45deg)}
.reveal-panel{z-index:3;padding:14px 16px;background:#f5f6f2;color:#213b3d;font:16px/1.5 Archivo,sans-serif}
.design-reel{position:absolute;background:#f4f6f1;color:#123b3e;display:grid;align-content:center;gap:6px;padding:5px 7%}
.design-reel h2{font:600 clamp(14px,1.4vw,20px)/1.15 Archivo,sans-serif;margin:0}
.design-reel>div{display:flex;align-items:center;gap:12px;min-width:0}
.reel-items{display:flex;gap:12px;min-width:0;width:100%;overflow:auto;scroll-snap-type:x mandatory;scrollbar-width:none}
.reel-items a{display:grid;align-items:center;grid-template-columns:auto 1fr;gap:8px;flex:0 0 clamp(125px,15vw,225px);font-size:14px;scroll-snap-align:start}
.reel-items img{width:clamp(35px,5vw,70px);height:clamp(35px,5vw,70px);object-fit:cover}
.design-reel button{cursor:pointer;border:0;border-radius:50%;font-size:22px;background:#fff;color:#15393c;width:32px;height:32px;flex:none}
.enquiry{padding:45px 8%;background:#f5f4ef}.demo-enquiry{display:grid;gap:16px;max-width:480px}.demo-enquiry input,.demo-enquiry select,.demo-enquiry button{font:inherit;padding:10px;width:100%}.demo-enquiry label{display:grid;gap:6px}.demo-enquiry button{background:#103e40;color:white;border:0;cursor:pointer}
@media(max-width:760px){.measure.large{display:none}.measure.small{display:block}.sign b{font-size:clamp(14px,4.6cqw,30px)}.demo-return{width:58px;height:58px;font-size:12px}.demo-return small{font-size:9px}footer{flex-direction:column;padding:32px 80px 32px 20px}.words{font-size:max(13px,var(--size))}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}