:root{--ink:#202a22;--forest:#26392d;--forest-deep:#17251f;--ivory:#f7f5ee;--paper:#fffdf7;--orange:#f4a340;--terra:#d96c4f;--sage:#a8b58a;--muted:#686e63;--line:rgba(32,42,34,.16);--serif:Georgia,"Times New Roman",serif;--sans:"DM Sans",Arial,sans-serif;--display:"Manrope","DM Sans",Arial,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--ivory);color:var(--ink);font-family:var(--sans);-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button,input,select,textarea{font:inherit}.site-header{height:82px;padding:0 6.2%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid rgba(32,42,34,.09);background:rgba(247,245,238,.94);position:sticky;top:0;z-index:20;backdrop-filter:blur(18px)}.wordmark{font:800 30px/1 var(--display);letter-spacing:-2px;display:inline-flex;align-items:center}.mark{display:inline-grid;place-items:center;background:var(--orange);color:var(--forest-deep);border-radius:50% 50% 48% 12%;width:28px;height:28px;font-size:21px;letter-spacing:-2px;margin-right:3px;transform:rotate(-7deg)}.wordmark-dot{color:var(--terra)}.desktop-nav{display:flex;gap:35px;font-size:13px;color:#4e574e}.desktop-nav a,.footer-links a{transition:opacity .2s}.desktop-nav a:hover,.footer-links a:hover{opacity:.6}.nav-cta{font-size:13px;font-weight:700;display:flex;align-items:center;gap:15px}.nav-cta span,.text-link span{font-size:18px}.menu-toggle{display:none;background:none;border:0;font-size:23px}.hero{min-height:660px;padding:85px 8.2% 70px;display:grid;grid-template-columns:1.03fr .97fr;align-items:center;gap:3%;overflow:hidden}.hero-copy{max-width:650px;position:relative;z-index:2}.eyebrow{font-size:11px;letter-spacing:1.6px;text-transform:uppercase;font-weight:700;color:#68735f;margin:0 0 25px;display:flex;align-items:center;gap:10px}.eyebrow-dot{width:8px;height:8px;border-radius:50%;background:var(--terra);display:inline-block}.hero h1,.section-heading h2,.manifesto-copy h2,.cbse-copy h2,.school-ready h2,.enquiry-intro h2{font:600 clamp(43px,5.25vw,76px)/1.06 var(--display);letter-spacing:-4.5px;margin:0;color:var(--forest-deep)}h1 em,h2 em{font-family:var(--serif);font-weight:400;color:var(--terra);letter-spacing:-3.4px}.hero-description{font-size:17px;line-height:1.75;max-width:500px;color:#60675e;margin:27px 0 30px}.hero-actions{display:flex;align-items:center;gap:27px;flex-wrap:wrap}.button{min-height:52px;padding:0 22px;display:inline-flex;justify-content:center;align-items:center;gap:20px;font-size:13px;font-weight:700;border:0;cursor:pointer;transition:transform .2s,background .2s}.button:hover{transform:translateY(-2px)}.button-dark{background:var(--forest-deep);color:#fffdf7;border-radius:4px}.button-dark:hover{background:#344c3a}.text-link{font-size:13px;font-weight:700;display:inline-flex;gap:14px;align-items:center;border-bottom:1px solid #a5a99e;padding-bottom:7px}.hero-note{display:flex;align-items:center;gap:13px;margin-top:52px;font-size:11px;line-height:1.65;color:#72776d}.hero-note strong{color:var(--forest)}.note-icon{font-size:24px;color:var(--terra)}.hero-art{height:495px;position:relative;max-width:620px;width:100%;margin:auto}.art-sun{position:absolute;width:245px;height:245px;border-radius:50%;background:var(--orange);top:30px;right:13%;opacity:.94}.art-ring{position:absolute;border:1px solid rgba(38,57,45,.2);border-radius:50%;z-index:1}.ring-one{width:440px;height:440px;top:10px;right:2%}.ring-two{width:350px;height:350px;top:55px;right:11%}.art-stage{position:absolute;inset:80px 7% 20px 5%;background:#dce0cf;border-radius:48% 48% 8px 8px;overflow:hidden}.stage-grid{position:absolute;inset:0;background-image:linear-gradient(rgba(38,57,45,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(38,57,45,.08) 1px,transparent 1px);background-size:30px 30px;mask-image:linear-gradient(to bottom,black,transparent 90%)}.robot{position:absolute;z-index:3;left:50%;top:48%;transform:translate(-50%,-40%);width:190px;height:255px}.robot-head{position:absolute;width:122px;height:98px;left:34px;top:23px;background:var(--paper);border:3px solid var(--forest);border-radius:27px 27px 35px 35px;display:flex;justify-content:center;align-items:center;gap:24px;box-shadow:8px 9px 0 rgba(38,57,45,.13)}.robot-head span{height:12px;width:12px;background:var(--forest);border-radius:50%}.robot-head i{position:absolute;width:27px;height:4px;background:var(--terra);bottom:19px;border-radius:8px}.robot-antenna{position:absolute;width:4px;height:27px;background:var(--forest);left:94px;top:0}.robot-antenna:after{content:"";position:absolute;width:12px;height:12px;top:-7px;left:-4px;border-radius:50%;background:var(--terra)}.robot-neck{position:absolute;width:32px;height:19px;left:78px;top:119px;background:var(--terra)}.robot-body{position:absolute;left:47px;top:137px;width:96px;height:72px;border-radius:17px;background:var(--forest);display:flex;align-items:center;justify-content:center;gap:8px}.robot-body b{width:9px;height:9px;background:var(--sage);border-radius:50%}.robot-arm{position:absolute;top:146px;width:19px;height:63px;background:var(--terra);border:3px solid var(--forest);border-radius:12px}.arm-left{left:27px;transform:rotate(22deg)}.arm-right{right:23px;transform:rotate(-25deg)}.robot-leg{position:absolute;top:203px;width:24px;height:39px;background:var(--forest);border-radius:5px}.leg-left{left:65px}.leg-right{right:62px}.orb{position:absolute;border:2px solid var(--forest);z-index:4}.orb-orange{width:36px;height:36px;background:var(--terra);border-radius:50%;left:13%;top:48%}.orb-green{width:22px;height:22px;background:var(--sage);right:14%;top:29%;border-radius:50%}.orb-cream{width:15px;height:15px;background:var(--orange);right:17%;bottom:20%;border-radius:50%}.circuit{position:absolute;z-index:2;border:2px solid var(--forest);opacity:.7}.circuit-one{width:75px;height:45px;left:8%;bottom:21%;border-right:0;border-top:0}.circuit-two{width:65px;height:45px;right:7%;top:53%;border-left:0;border-bottom:0}.art-card{position:absolute;z-index:5;background:var(--paper);box-shadow:0 10px 30px rgba(32,42,34,.08);display:flex;align-items:center;gap:11px;font-size:9px;letter-spacing:1px;font-weight:700}.card-top{right:0;top:68px;padding:15px 17px}.mini-icon{font-size:23px;color:var(--terra)}.card-bottom{left:0;bottom:43px;padding:15px 18px;font-size:8px;line-height:1.7;letter-spacing:.7px}.card-spark{font-size:27px;color:var(--terra)}.art-caption{position:absolute;right:3%;bottom:3px;font:italic 12px var(--serif);color:#74796f}.trust-strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:27px 8.2%;display:flex;justify-content:space-between;align-items:center;gap:20px}.trust-strip p{font-size:9px;letter-spacing:1.6px;color:#72776d;font-weight:700}.trust-strip div{display:flex;gap:clamp(18px,4vw,62px);font:italic 20px var(--serif);color:var(--forest)}.section{padding:125px 8.2%}.labs-section{padding-bottom:115px}.section-heading{display:grid;grid-template-columns:1fr 1fr;column-gap:7%;align-items:end;margin-bottom:55px}.section-heading .eyebrow{grid-column:1/-1;margin-bottom:23px}.section-heading h2{font-size:clamp(42px,5vw,66px)}.section-heading>p:last-child{max-width:400px;justify-self:end;line-height:1.8;color:var(--muted);font-size:15px;margin-bottom:5px}.lab-grid{display:grid;grid-template-columns:1.13fr 1fr 1fr;gap:18px}.lab-card{background:var(--paper);border:1px solid rgba(32,42,34,.08);min-width:0}.lab-visual{height:230px;position:relative;overflow:hidden;display:grid;place-items:center}.visual-robotics{background:#e5e6d8}.visual-circle{width:185px;height:185px;border:1px solid rgba(38,57,45,.4);border-radius:50%;position:absolute}.visual-circle:before,.visual-circle:after{content:"";position:absolute;border:1px solid rgba(38,57,45,.3);border-radius:50%;inset:19px}.visual-circle:after{inset:40px}.chip{position:absolute;top:19px;left:20px;font-size:10px;font-weight:700;color:#68735f}.line-art{position:absolute;width:140px;height:100px;border:2px solid var(--forest);border-left:0;border-bottom:0;transform:rotate(20deg);opacity:.5}.mini-robot{position:relative;width:76px;height:100px;background:var(--terra);border:3px solid var(--forest);border-radius:15px 15px 22px 22px;transform:rotate(-7deg);box-shadow:8px 8px 0 rgba(38,57,45,.12)}.mini-robot:before{content:"";position:absolute;left:15px;right:15px;top:25px;height:4px;background:var(--forest)}.mini-robot span{position:absolute;top:14px;left:15px;width:8px;height:8px;background:var(--paper);border-radius:50%}.mini-robot b{position:absolute;top:14px;right:15px;width:8px;height:8px;background:var(--paper);border-radius:50%}.mini-robot i{position:absolute;left:18px;right:18px;bottom:19px;height:18px;border:2px solid var(--forest);border-radius:5px}.visual-circuit{background:#d8dfcb}.circuit-board{width:185px;height:125px;background:var(--forest);border:8px solid #465d48;border-radius:8px;position:relative;transform:rotate(-8deg);box-shadow:12px 12px 0 rgba(38,57,45,.1)}.circuit-board:before,.circuit-board:after{content:"";position:absolute;background:var(--orange)}.circuit-board:before{height:2px;width:100px;top:35px;left:20px}.circuit-board:after{width:2px;height:60px;top:35px;left:50px}.circuit-board i{position:absolute;width:19px;height:19px;border-radius:50%;border:3px solid var(--sage);background:var(--forest);z-index:2}.circuit-board i:nth-child(1){left:20px;top:22px}.circuit-board i:nth-child(2){left:88px;top:27px}.circuit-board i:nth-child(3){left:42px;bottom:14px}.circuit-board b{position:absolute;right:16px;bottom:13px;width:30px;height:30px;border:3px solid var(--terra);border-radius:4px}.circuit-board span{position:absolute;right:22px;top:16px;width:15px;height:15px;border-radius:50%;background:var(--orange)}.floating-tag{position:absolute;bottom:20px;left:20px;font-size:8px;letter-spacing:1.4px;font-weight:700}.visual-code{background:#ead7c7}.code-window{width:76%;padding:25px 20px;background:var(--forest-deep);color:#e9e9d7;border-radius:6px;font:11px/2 monospace;box-shadow:10px 12px 0 rgba(38,57,45,.1);position:relative}.window-dots{font-size:8px;letter-spacing:3px;color:var(--terra);margin-bottom:14px}.code-window>span:nth-of-type(1){color:var(--orange)}.code-window .indent{display:block;padding-left:14px;color:var(--sage)}.code-spark{position:absolute;right:16px;bottom:12px;font-size:25px;color:var(--terra)}.lab-card-copy{padding:26px 25px 30px}.card-kicker{font-size:9px;letter-spacing:1.4px;color:#7b806f;font-weight:700;margin:0 0 15px}.lab-card h3{font:700 22px/1.25 var(--display);letter-spacing:-.8px;margin:0 0 13px;color:var(--forest-deep)}.lab-card-copy>p:not(.card-kicker){font-size:13px;line-height:1.75;color:var(--muted);min-height:92px;margin:0 0 23px}.lab-card-copy>a{font-size:12px;font-weight:700;display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:17px}.lab-card-copy>a span{font-size:16px}.scope-note{font-size:11px;line-height:1.7;color:#777d72;margin:25px 0 0}.manifesto{display:grid;grid-template-columns:1fr 1fr;background:#e6e6d9;min-height:620px}.manifesto-visual{position:relative;overflow:hidden;min-height:570px;background:#d2d9c3}.manifesto-shape{position:absolute;border-radius:50%}.shape-a{width:390px;height:390px;top:70px;left:14%;background:var(--orange)}.shape-b{width:290px;height:290px;top:140px;left:28%;background:var(--terra);mix-blend-mode:multiply}.shape-c{width:175px;height:175px;top:198px;left:42%;background:var(--sage);border:2px solid var(--forest)}.manifesto-word{position:absolute;top:42%;left:13%;font:italic 66px/.88 var(--serif);letter-spacing:-3px;color:var(--forest-deep);transform:rotate(-9deg)}.manifesto-star{position:absolute;right:12%;bottom:15%;font-size:48px;color:var(--forest)}.manifesto-copy{padding:95px 12% 80px 11%;align-self:center}.manifesto-copy h2,.cbse-copy h2,.enquiry-intro h2{font-size:clamp(40px,4.6vw,62px)}.manifesto-copy>p:not(.eyebrow){font-size:14px;line-height:1.85;color:var(--muted);margin:25px 0 34px}.principles{border-top:1px solid rgba(32,42,34,.2)}.principles>div{display:grid;grid-template-columns:35px 1fr;gap:12px;padding:16px 0;border-bottom:1px solid rgba(32,42,34,.2)}.principles>div>span{font-size:10px;color:var(--terra);font-weight:700;padding-top:4px}.principles p{margin:0;font-size:12px;line-height:1.8;color:var(--muted)}.principles strong{font-size:13px;color:var(--forest)}.cbse-section{padding:115px 8.2%;display:grid;grid-template-columns:1fr .85fr;gap:12%;align-items:center;background:var(--paper)}.cbse-copy>p:not(.eyebrow){font-size:14px;line-height:1.9;color:var(--muted);max-width:520px;margin:26px 0}.cbse-copy .text-link{margin-top:3px}.small-print{font-size:10px!important;line-height:1.7!important;max-width:450px;margin-top:30px!important;color:#85897f!important}.cbse-facts{background:#e8e8dc;padding:35px 38px}.fact{display:grid;grid-template-columns:auto auto;justify-content:start;align-items:baseline;gap:8px}.fact-number{font:600 55px/.95 var(--display);letter-spacing:-3px;color:var(--forest)}.fact-unit{font:italic 17px var(--serif);color:var(--terra)}.fact p{grid-column:1/-1;margin:10px 0 0;color:var(--muted);font-size:12px}.fact-divider{height:1px;background:var(--line);margin:29px 0}.fact-footnote{border-top:1px solid var(--line);padding-top:18px;margin-top:26px;font-size:10px;line-height:1.7;color:#73796e}.school-ready{padding:78px 8.2%;background:var(--forest);color:var(--paper);display:grid;grid-template-columns:1.15fr .85fr;gap:9%;align-items:center}.school-ready .eyebrow{color:var(--sage)}.school-ready h2{font-size:clamp(35px,4vw,53px);color:var(--paper);letter-spacing:-2.5px}.school-ready h2 em{color:var(--orange)}.ready-details p{font-size:13px;line-height:1.85;color:#d2d8cc;margin:0 0 25px}.button-light{background:var(--orange);color:var(--forest-deep);border-radius:4px}.button-light:hover{background:#ffc067}.enquiry-section{padding:125px 8.2%;display:grid;grid-template-columns:.85fr 1fr;gap:12%;align-items:start}.enquiry-intro>p:not(.eyebrow){font-size:14px;line-height:1.85;color:var(--muted);max-width:370px;margin:25px 0}.enquiry-aside{display:flex;gap:14px;align-items:start;margin-top:60px}.enquiry-aside>span{font-size:29px;color:var(--terra)}.enquiry-aside p{font-size:11px;line-height:1.8;color:#777d72;margin:0}.enquiry-aside strong{color:var(--forest)}.form-panel{background:var(--paper);padding:36px;border:1px solid rgba(32,42,34,.1)}.form-row{margin-bottom:20px}.form-row label{display:block;font-size:11px;font-weight:700;margin-bottom:9px;color:var(--forest)}.form-row input,.form-row select,.form-row textarea{display:block;width:100%;background:#fbfaf5;border:1px solid #dcded3;border-radius:3px;min-height:47px;padding:12px 13px;color:var(--ink);font-size:12px;outline:none;transition:border .2s}.form-row textarea{resize:vertical;min-height:85px}.form-row input:focus,.form-row select:focus,.form-row textarea:focus{border-color:var(--forest)}.form-row input::placeholder,.form-row textarea::placeholder{color:#a1a499}.form-row-split{display:grid;grid-template-columns:1fr 1fr;gap:15px}.submit-button{width:100%;justify-content:space-between;margin-top:4px}.form-privacy{font-size:10px;line-height:1.6;color:#85897f;margin:14px 0 0}.form-status{font-size:12px;line-height:1.6;margin:12px 0 0;color:var(--forest)}.site-footer{padding:35px 8.2% 30px;background:#e9e8dd;display:grid;grid-template-columns:1fr 1fr 1fr;align-items:center;gap:15px}.footer-wordmark{font-size:25px}.footer-wordmark .mark{width:24px;height:24px;font-size:18px}.site-footer>p{font:italic 15px var(--serif);color:#777d72;text-align:center}.footer-links{display:flex;justify-content:flex-end;gap:22px;font-size:11px}.site-footer small{grid-column:1/-1;border-top:1px solid var(--line);padding-top:19px;margin-top:10px;font-size:10px;color:#7c8177}
@media(min-width:1450px){.hero,.section,.cbse-section,.enquiry-section{padding-left:max(8.2%,calc((100vw - 1320px)/2));padding-right:max(8.2%,calc((100vw - 1320px)/2))}.hero{min-height:740px}.hero-art{transform:scale(1.05)}}@media(max-width:1050px){.hero{padding-left:6%;padding-right:6%;gap:0}.hero h1{font-size:clamp(42px,5.4vw,62px);letter-spacing:-3.5px}.hero-art{transform:scale(.9);transform-origin:center}.lab-grid{grid-template-columns:1fr 1fr}.lab-feature{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr}.lab-feature .lab-visual{height:100%;min-height:300px}.lab-card-copy>p:not(.card-kicker){min-height:unset}.manifesto-copy{padding-left:8%;padding-right:8%}.shape-a{left:2%}.shape-b{left:17%}.shape-c{left:33%}.cbse-section{gap:7%}.enquiry-section{gap:7%}}@media(max-width:720px){.site-header{height:68px;padding:0 5%}.wordmark{font-size:27px}.desktop-nav{display:none;position:absolute;top:68px;left:0;right:0;padding:22px 5%;background:var(--ivory);border-bottom:1px solid var(--line);flex-direction:column;gap:20px}.desktop-nav.open{display:flex}.nav-cta{margin-left:auto;margin-right:17px;font-size:11px;gap:6px}.menu-toggle{display:block;color:var(--forest)}.hero{padding:68px 6% 50px;grid-template-columns:1fr;gap:10px}.hero h1{font-size:clamp(43px,11vw,64px);letter-spacing:-3.3px}.hero h1 em{letter-spacing:-2px}.hero-description{font-size:15px;max-width:480px}.hero-note{margin-top:32px}.hero-art{height:400px;max-width:500px;transform:scale(.85);transform-origin:top center;margin-bottom:-45px}.trust-strip{padding:23px 6%;display:block}.trust-strip p{text-align:center;margin:0 0 20px}.trust-strip div{justify-content:center;gap:19px;flex-wrap:wrap;font-size:17px}.section{padding:82px 6%}.section-heading{display:block;margin-bottom:35px}.section-heading h2{font-size:47px;letter-spacing:-3px}.section-heading>p:last-child{margin-top:22px;max-width:500px}.lab-grid{grid-template-columns:1fr;gap:15px}.lab-feature{grid-column:auto;display:block}.lab-feature .lab-visual{height:220px;min-height:0}.lab-visual{height:220px}.lab-card-copy{padding:23px}.lab-card-copy>p:not(.card-kicker){margin-bottom:22px}.manifesto{grid-template-columns:1fr}.manifesto-visual{min-height:370px}.shape-a{width:290px;height:290px;left:9%;top:37px}.shape-b{width:220px;height:220px;left:25%;top:75px}.shape-c{width:135px;height:135px;left:42%;top:117px}.manifesto-word{font-size:54px;top:41%;left:9%}.manifesto-star{right:10%;bottom:10%}.manifesto-copy{padding:70px 7%}.manifesto-copy h2,.cbse-copy h2,.enquiry-intro h2{font-size:47px;letter-spacing:-3px}.cbse-section{padding:80px 6%;grid-template-columns:1fr;gap:40px}.cbse-facts{padding:28px}.school-ready{padding:65px 6%;grid-template-columns:1fr;gap:25px}.school-ready h2{font-size:39px}.enquiry-section{padding:82px 6%;grid-template-columns:1fr;gap:36px}.enquiry-intro h2{font-size:48px}.enquiry-aside{margin-top:32px}.form-panel{padding:24px 20px}.site-footer{padding:30px 6%;grid-template-columns:1fr 1fr}.site-footer>p{text-align:right}.footer-links{grid-column:1/-1;justify-content:flex-start;order:3}.site-footer small{order:4}.form-row-split{gap:10px}}@media(max-width:390px){.nav-cta{font-size:10px}.hero-art{margin-left:-5%;width:110%;transform:scale(.78);margin-bottom:-80px}.hero-actions{gap:18px}.button{padding:0 15px}.form-row-split{grid-template-columns:1fr;gap:18px}.manifesto-visual{min-height:320px}.shape-a{width:245px;height:245px}.shape-b{width:185px;height:185px}.shape-c{width:115px;height:115px}.manifesto-word{font-size:46px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}
/* HAPLE Composite Skill Lab hero refresh */
.hero-composite{display:flex;flex-direction:column;gap:0;min-height:0;padding-top:48px;padding-bottom:72px;overflow:hidden;background:var(--paper)}
.hero-brand{width:100%;display:flex;justify-content:center;align-items:center;margin:0 auto 24px}
.hero-logo{display:block;width:min(280px,58vw);height:auto;object-fit:contain}
.hero-copy-centered{max-width:900px;text-align:center;margin:0 auto}
.hero-copy-centered .eyebrow{justify-content:center;margin-bottom:20px}
.hero-copy-centered h1{font-size:clamp(44px,6vw,78px);line-height:1.04;letter-spacing:-4.8px}
.hero-copy-centered h1 em{color:var(--forest);font-weight:500}
.hero-copy-centered .hero-description{max-width:650px;margin:23px auto 26px;font-size:16px}
.hero-copy-centered .hero-actions{justify-content:center}
.topic-showcase{width:100%;max-width:1180px;margin:64px auto 0;overflow:hidden}
.topic-track{display:grid;grid-auto-columns:calc((100% - 32px)/3);grid-auto-flow:column;gap:16px;transition:transform .65s cubic-bezier(.22,.7,.25,1);will-change:transform}
.topic-panel{min-width:0;position:relative;overflow:hidden;background:#f0efe7;border:1px solid rgba(32,42,34,.09);border-radius:5px;min-height:300px;display:flex;flex-direction:column;justify-content:space-between}
.topic-number{position:absolute;z-index:2;top:18px;left:19px;font-size:10px;letter-spacing:1.4px;font-weight:700;color:#657064}
.topic-art{height:180px;position:relative;overflow:hidden;display:grid;place-items:center}
.topic-label{position:relative;padding:18px 20px 22px;background:rgba(255,253,247,.8);min-height:112px}
.topic-label>span{font-size:9px;letter-spacing:1.4px;color:#7d8476;font-weight:700}
.topic-label h2{font:650 clamp(17px,1.6vw,22px)/1.2 var(--display);letter-spacing:-.7px;color:var(--forest-deep);margin:8px 0 7px}
.topic-label p{font-size:11px;line-height:1.5;color:#686e63;margin:0}
.topic-agriculture{background:#e4eadb}.topic-agriculture .sun{position:absolute;width:66px;height:66px;border-radius:50%;background:#efb66b;right:20%;top:24px}
.plant{position:absolute;bottom:21px;width:5px;height:90px;background:#526e4e;border-radius:5px;transform-origin:bottom}
.plant:before,.plant:after{content:"";position:absolute;width:28px;height:15px;background:#89a47a;border-radius:100% 0 100% 0}
.plant:before{top:20px;left:-24px;transform:rotate(15deg)}.plant:after{top:44px;left:2px;transform:rotate(65deg)}
.plant-a{left:43%;transform:rotate(-7deg)}.plant-b{left:57%;height:70px;transform:rotate(8deg)}
.soil{position:absolute;bottom:13px;width:72%;height:20px;background:#9b7758;border-radius:50%}
.topic-food{background:#f1dfcf}.food-plate{position:absolute;width:150px;height:150px;border-radius:50%;background:#fffaf0;border:8px solid #d4b8a0;box-shadow:0 8px 0 #c5a58b}
.food-shape{position:absolute;z-index:1;width:45px;height:45px;border-radius:50%;background:#dc7657}.food-one{transform:translate(-23px,-15px)}.food-two{transform:translate(23px,15px);background:#d8a84f}.food-three{width:27px;height:27px;transform:translate(20px,-30px);background:#78926c}
.topic-electronics{background:#dfe5d7}.circuit-chip{position:absolute;width:82px;height:82px;background:#334b3a;border:7px solid #78916d;border-radius:9px;box-shadow:0 0 0 12px rgba(51,75,58,.08)}
.circuit-chip:before,.circuit-chip:after{content:"";position:absolute;background:#e8b45e}.circuit-chip:before{width:32px;height:4px;left:18px;top:31px}.circuit-chip:after{height:30px;width:4px;left:32px;top:18px}
.circuit-line{position:absolute;background:#6e8d6a;height:3px;width:72px}.line-a{transform:rotate(28deg);left:14%;top:42px}.line-b{transform:rotate(-35deg);right:10%;top:63px}.line-c{transform:rotate(90deg);right:23%;bottom:20px}
.topic-it{background:#e2e2f0}.code-window{position:relative;width:150px;height:100px;border-radius:8px;background:#283a31;box-shadow:9px 9px 0 rgba(40,58,49,.12);display:flex;gap:5px;padding:13px;align-items:flex-start}
.topic-it .code-window i{width:6px;height:6px;border-radius:50%;background:#e2a85d}.topic-it .code-window i:nth-child(2){background:#d77d61}.topic-it .code-window i:nth-child(3){background:#a9c09b}
.topic-it .code-window b{position:absolute;left:25px;top:42px;font:700 31px var(--sans);color:#d8e1c9}.code-orbit{position:absolute;width:190px;height:105px;border:1px solid #9b9bc3;border-radius:50%;transform:rotate(-25deg)}
.topic-health{background:#f1dfda}.health-cross{position:relative;z-index:1;width:80px;height:80px;display:grid;place-items:center;border-radius:50%;background:#fff8f1;color:#c96d5c;font:300 70px/1 var(--sans);box-shadow:0 0 0 12px rgba(201,109,92,.12)}
.health-ring{position:absolute;width:150px;height:150px;border:1px solid #d9a49b;border-radius:50%}.health-dot{position:absolute;width:13px;height:13px;border-radius:50%;background:#8ba083;right:27%;top:34%}
.topic-retail{background:#e9e3d4}.retail-bag{position:absolute;width:93px;height:95px;background:#d8a14e;border:2px solid #70583a;border-radius:5px 5px 12px 12px;top:54px}
.retail-handle{position:absolute;width:42px;height:35px;border:4px solid #70583a;border-bottom:0;border-radius:24px 24px 0 0;top:28px}
.retail-star{position:absolute;right:25%;top:40px;color:#d16e51;font-size:28px}
.topic-controls{display:flex;align-items:center;gap:22px;margin-top:22px}
.topic-pagination{display:flex;align-items:center;gap:8px}
.topic-dot{width:7px;height:7px;padding:0;border:0;border-radius:10px;background:#c5c9bc;cursor:pointer;transition:width .25s,background .25s}
.topic-dot.active{width:24px;background:var(--forest)}
.topic-arrows{display:flex;gap:7px;margin-left:auto}
.topic-arrows button{width:37px;height:37px;border:1px solid var(--line);background:transparent;border-radius:50%;font-size:19px;cursor:pointer;color:var(--forest);transition:background .2s,color .2s}
.topic-arrows button:hover{background:var(--forest);color:white}
.topic-counter{font-size:10px;letter-spacing:1px;color:#7d8476}
.topic-counter strong{color:var(--forest);font-size:12px}
@media(max-width:720px){.hero-composite{padding:36px 5% 55px}.hero-brand{margin-bottom:20px}.hero-logo{width:min(235px,65vw)}.hero-copy-centered h1{font-size:clamp(39px,10vw,59px);letter-spacing:-3px}.hero-copy-centered .hero-description{font-size:14px}.topic-showcase{margin-top:42px}.topic-track{grid-auto-columns:calc((100% - 13px)/1.15);gap:13px}.topic-panel{min-height:285px}.topic-art{height:170px}.topic-label h2{font-size:21px}.topic-controls{gap:14px}}
@media(prefers-reduced-motion:reduce){.topic-track,.topic-dot{transition:none!important}}

/* Exact hero layout refinement based on the approved HAPLE design */
.site-header .wordmark{visibility:hidden}
.site-header{display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.site-header .desktop-nav{grid-column:2;gap:clamp(24px,4vw,58px)}
.site-header .nav-cta{grid-column:3;justify-self:end}
.hero-composite{padding-top:24px;padding-bottom:0;min-height:0;background:radial-gradient(ellipse at 50% 78%,rgba(224,232,248,.45),transparent 42%),radial-gradient(ellipse at 8% 88%,rgba(215,235,244,.42),transparent 28%),radial-gradient(ellipse at 93% 86%,rgba(244,226,239,.36),transparent 26%),#fffefa}
.hero-brand{margin-bottom:18px}
.hero-logo{width:min(285px,45vw)}
.hero-copy-centered .eyebrow{display:none}
.hero-copy-centered h1{font-size:clamp(44px,4.7vw,70px);line-height:1.03;letter-spacing:-3.5px;margin:0 auto}
.hero-copy-centered h1 em{font-style:normal;background:linear-gradient(90deg,#167ce5 0%,#10a7bd 23%,#27a45b 42%,#f0a51b 62%,#f27c45 76%,#7334d6 100%);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:800}
.hero-copy-centered .hero-description{font-size:clamp(14px,1.3vw,19px);line-height:1.55;max-width:700px;margin:17px auto 16px;color:#747b86}
.hero-copy-centered .hero-actions{margin-top:0}
.hero-copy-centered .hero-actions .text-link{display:none}
.hero-copy-centered .button{border-radius:999px;padding:13px 25px;min-height:46px}
.topic-showcase{max-width:none;width:100%;margin:28px auto 0;overflow:hidden;padding:0 clamp(44px,5.5vw,90px) 0}
.topic-track{display:grid;grid-auto-columns:calc((100% - 50px)/6);grid-auto-flow:column;gap:10px;align-items:end;transition:transform .6s cubic-bezier(.22,.7,.25,1)}
.topic-panel{position:relative;overflow:visible;min-height:0;height:clamp(215px,20vw,320px);border:0;border-radius:0;background:transparent;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}
.topic-number{display:none}
.topic-art{height:72%;flex:1;position:relative;overflow:hidden;display:grid;place-items:center;border:4px solid #17191a;border-bottom-width:8px;border-radius:7px 7px 2px 2px;background:#f5f5f1;box-shadow:0 2px 4px #0002,inset 0 0 0 2px #777}
.topic-art:after{content:"";position:absolute;left:0;right:0;bottom:-8px;height:8px;background:#181a1c}
.topic-art:before{content:"";position:absolute;left:42%;bottom:-29px;width:16%;height:25px;background:linear-gradient(90deg,#999,#f7f7f7 48%,#9b9b9b);z-index:2;clip-path:polygon(30% 0,70% 0,100% 100%,0 100%)}
.topic-label{background:transparent;padding:13px 2px 0;min-height:0;text-align:left}
.topic-label>span{display:none}
.topic-label h2{font:700 clamp(10px,.95vw,15px)/1.15 var(--display);letter-spacing:-.25px;color:#222;margin:0 0 5px}
.topic-label p{font-size:clamp(8px,.68vw,11px);line-height:1.3;color:#747b86;margin:0}
.topic-controls{justify-content:center;gap:25px;margin:24px auto 0;padding-bottom:20px;position:relative}
.topic-pagination{gap:12px}
.topic-dot{width:9px;height:9px;background:#c5c5c5}
.topic-dot.active{width:9px;height:9px;background:#111}
.topic-arrows{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);justify-content:space-between;pointer-events:none;margin:0}
.topic-arrows button{pointer-events:auto;width:48px;height:48px;background:#fff;border:0;box-shadow:0 3px 12px #0001;color:#555;border-radius:50%;font-size:22px}
.topic-counter{display:none}
/* Make the six screens feel like one continuous, gently shifting monitor carousel. */
.topic-agriculture .topic-art{background:linear-gradient(180deg,#fbfff2,#e5f3d8)}
.topic-food .topic-art{background:linear-gradient(180deg,#fff8ef,#f5e1cb)}
.topic-electronics .topic-art{background:linear-gradient(180deg,#f8f7ff,#e7e4fa)}
.topic-it .topic-art{background:linear-gradient(180deg,#f1fbff,#d9edf8)}
.topic-health .topic-art{background:linear-gradient(180deg,#fffafa,#f8e7e5)}
.topic-retail .topic-art{background:linear-gradient(180deg,#fbf7ff,#e9e0fa)}
.topic-agriculture .topic-art .sun{width:30px;height:30px;top:17%;right:16%}
.topic-agriculture .plant{height:52px;bottom:18px}
.topic-agriculture .soil{bottom:10px;height:13px}
.topic-food .food-plate{width:90px;height:90px;border-width:5px}
.topic-food .food-shape{width:28px;height:28px}
.topic-food .food-three{width:18px;height:18px}
.topic-electronics .circuit-chip{width:55px;height:55px;border-width:5px}
.topic-electronics .circuit-chip:before{left:10px;top:20px;width:25px}
.topic-electronics .circuit-chip:after{left:20px;top:10px;height:25px}
.topic-it .code-window{width:100px;height:70px;padding:9px}
.topic-it .code-window b{left:17px;top:31px;font-size:23px}
.topic-it .code-orbit{width:120px;height:70px}
.topic-health .health-cross{width:58px;height:58px;font-size:49px}
.topic-health .health-ring{width:100px;height:100px}
.topic-retail .retail-bag{width:60px;height:63px;top:38px}
.topic-retail .retail-handle{width:29px;height:22px;top:20px;border-width:3px}
.topic-retail .retail-star{font-size:18px}
@media(max-width:900px){.topic-track{grid-auto-columns:calc((100% - 20px)/3)}.topic-panel{height:260px}.topic-label h2{font-size:14px}.topic-label p{font-size:10px}.topic-showcase{padding-left:50px;padding-right:50px}.topic-arrows button{width:38px;height:38px}}
@media(max-width:600px){.site-header{grid-template-columns:1fr auto}.site-header .desktop-nav{display:none}.site-header .nav-cta{grid-column:2}.hero-composite{padding-top:24px}.hero-logo{width:min(235px,65vw)}.hero-copy-centered h1{font-size:clamp(38px,9vw,52px);letter-spacing:-2.5px}.hero-copy-centered .hero-description{font-size:13px;padding:0 10px}.topic-showcase{padding-left:40px;padding-right:40px;margin-top:24px}.topic-track{grid-auto-columns:calc((100% - 12px)/2)}.topic-panel{height:235px}.topic-label h2{font-size:13px}.topic-label p{font-size:9px}.topic-controls{margin-top:18px}}


/* HAPLE monitor showcase refinement */
.hero-composite{display:flex;flex-direction:column;align-items:center;text-align:center;padding:22px 0 0;min-height:0;gap:0}
.hero-brand{width:100%;display:flex;justify-content:center;margin:0 0 14px}
.hero-logo{display:block;width:min(285px,42vw);height:auto}
.hero-copy-centered{width:min(900px,90%);max-width:900px}
.hero-copy-centered h1{font-size:clamp(42px,4.7vw,70px);line-height:1.02}
.hero-copy-centered .hero-description{max-width:720px}
.hero-copy-centered .hero-actions{justify-content:center}
.topic-showcase{width:100%;max-width:1600px;margin:30px auto 0;padding:0 clamp(58px,6vw,100px);overflow:hidden}
.topic-track{display:grid;grid-auto-columns:calc((100% - 44px)/3);grid-auto-flow:column;gap:22px;align-items:end;transition:transform .65s cubic-bezier(.22,.7,.25,1);will-change:transform}
.topic-panel{height:clamp(290px,25vw,390px);min-width:0;display:flex;flex-direction:column;justify-content:flex-start;align-items:stretch}
.topic-art{height:calc(100% - 66px);flex:none;position:relative;overflow:hidden;border:0;border-radius:0;background:#f8f8f6;box-shadow:none;isolation:isolate}
.topic-art:after{content:"";position:absolute;left:0;right:0;bottom:0;height:9px;background:linear-gradient(180deg,#e4e5e6,#777b7d 50%,#343638);border-radius:0 0 5px 5px;z-index:5}
.topic-art:before{content:"";position:absolute;left:42%;bottom:-39px;width:16%;height:39px;background:linear-gradient(90deg,#8b8e90,#f5f6f6 45%,#a6a8aa);clip-path:polygon(30% 0,70% 0,100% 100%,0 100%);z-index:6}
.topic-art{outline:3px solid #222526;outline-offset:-3px;border:5px solid #bfc2c4;box-shadow:0 2px 0 #777,0 5px 7px #0002,inset 0 0 0 2px #fff}
.topic-label{padding:15px 2px 0;text-align:left;min-height:66px}
.topic-label h2{font-size:clamp(14px,1.2vw,18px);line-height:1.18;letter-spacing:-.35px;margin:0 0 6px;color:#17191b}
.topic-label p{font-size:clamp(10px,.8vw,12px);line-height:1.35;color:#747b86;margin:0}
.topic-agriculture .topic-art{background:linear-gradient(180deg,#fbfff5,#e3f1d7)}
.topic-food .topic-art{background:linear-gradient(180deg,#fff9f0,#f3dfc8)}
.topic-electronics .topic-art{background:linear-gradient(180deg,#faf8ff,#e5e2f8)}
.topic-it .topic-art{background:linear-gradient(180deg,#f0fbff,#d8edf7)}
.topic-health .topic-art{background:linear-gradient(180deg,#fffafa,#f6e5e3)}
.topic-retail .topic-art{background:linear-gradient(180deg,#fcf8ff,#e8def8)}
/* Metallic monitor chin and stand */
.topic-art .sun,.topic-art .plant,.topic-art .soil,.topic-art .food-shape,.topic-art .food-plate,.topic-art .circuit-chip,.topic-art .circuit-line,.topic-art .code-window,.topic-art .code-orbit,.topic-art .health-cross,.topic-art .health-ring,.topic-art .health-dot,.topic-art .retail-bag,.topic-art .retail-handle,.topic-art .retail-star{z-index:2}
.topic-art .sun{width:32px;height:32px}
.topic-art .plant{height:75px}
.topic-art .soil{bottom:22px}
.topic-food .food-plate{width:116px;height:116px}
.topic-food .food-shape{width:32px;height:32px}
.topic-electronics .circuit-chip{width:72px;height:72px}
.topic-it .code-window{width:150px;height:100px;padding:14px}
.topic-it .code-window b{font-size:32px}
.topic-health .health-cross{width:75px;height:75px;font-size:60px}
.topic-health .health-ring{width:135px;height:135px}
.topic-retail .retail-bag{width:75px;height:80px;top:42px}
.topic-retail .retail-handle{width:38px;height:28px;top:20px}
.topic-controls{margin:25px auto 0;padding-bottom:25px;justify-content:center}
.topic-arrows{left:0;right:0}
@media(max-width:900px){
 .topic-showcase{padding-left:48px;padding-right:48px}
 .topic-track{grid-auto-columns:calc((100% - 22px)/2);gap:22px}
 .topic-panel{height:300px}
 .topic-label h2{font-size:15px}.topic-label p{font-size:10px}
}
@media(max-width:600px){
 .hero-composite{padding-top:18px}
 .hero-logo{width:min(230px,68vw)}
 .hero-copy-centered h1{font-size:clamp(36px,9vw,50px)}
 .topic-showcase{padding-left:40px;padding-right:40px;margin-top:22px}
 .topic-track{grid-auto-columns:100%;gap:16px}
 .topic-panel{height:310px}
 .topic-label h2{font-size:15px}.topic-label p{font-size:11px}
 .topic-arrows button{width:34px;height:34px}
}


/* Real desktop-monitor presentation for the HAPLE topic carousel */
.topic-showcase{max-width:1320px;padding:0 28px 34px;overflow:hidden}
.topic-track{grid-auto-columns:calc((100% - 52px)/3);gap:26px;align-items:start;padding:0 2px 4px}
.topic-panel{isolation:isolate;overflow:visible;min-height:0;height:340px;border:0;border-radius:0;background:transparent;display:flex;flex-direction:column;justify-content:flex-start;padding:0 0 31px;position:relative;filter:drop-shadow(0 3px 2px rgba(20,28,23,.18))}
.topic-panel:before{content:"";position:absolute;z-index:-1;left:calc(50% - 5px);bottom:0;width:10px;height:29px;background:linear-gradient(90deg,#555b57,#c4c7c3 42%,#555b57);border-radius:0 0 2px 2px}
.topic-panel:after{content:"";position:absolute;z-index:-1;left:calc(50% - 37px);bottom:-1px;width:74px;height:7px;border-radius:5px 5px 2px 2px;background:linear-gradient(#d7d9d6,#777d79);box-shadow:0 1px 1px rgba(0,0,0,.2)}
.topic-art{height:210px;flex:1;min-height:0;margin:0;background:var(--screen-bg,#e9eee7);border:7px solid #252a27;border-bottom-width:9px;border-radius:7px 7px 3px 3px;box-shadow:inset 0 0 0 2px #aeb3af,inset 0 0 0 4px #f5f6f2,0 0 0 1px #8a8f8b;position:relative;overflow:hidden}
.topic-art:after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,rgba(255,255,255,.17),transparent 35%,transparent 72%,rgba(255,255,255,.08))}
.topic-label{margin:0 7px;background:var(--screen-bg,#e9eee7);padding:12px 15px 14px;min-height:88px;flex:0 0 auto;border-left:7px solid #252a27;border-right:7px solid #252a27;border-bottom:7px solid #252a27;border-radius:0 0 4px 4px;box-shadow:inset 0 -2px 0 rgba(255,255,255,.45)}
.topic-label h2{font-size:clamp(14px,1.2vw,19px);margin:2px 0 5px}
.topic-label p{font-size:10px}
.topic-agriculture{--screen-bg:#e4eadb}.topic-food{--screen-bg:#f1dfcf}.topic-electronics{--screen-bg:#e4e8dc}.topic-it{--screen-bg:#dcecf0}.topic-health{--screen-bg:#e7e4f1}.topic-retail{--screen-bg:#f1e5e3}
.topic-agriculture .topic-art,.topic-food .topic-art,.topic-electronics .topic-art,.topic-it .topic-art,.topic-health .topic-art,.topic-retail .topic-art{background:var(--screen-bg)}
.topic-controls{max-width:1320px;margin:12px auto 0;padding:0 28px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center}
.topic-pagination{justify-content:center}
.topic-arrows{justify-self:end}
@media(max-width:900px){.topic-showcase{padding-left:20px;padding-right:20px}.topic-track{grid-auto-columns:calc((100% - 22px)/2);gap:22px}.topic-panel{height:320px}.topic-art{height:190px}.topic-controls{padding-left:20px;padding-right:20px}}
@media(max-width:600px){.topic-showcase{padding-left:24px;padding-right:24px;margin-top:42px}.topic-track{grid-auto-columns:100%;gap:20px}.topic-panel{height:330px}.topic-art{height:205px}.topic-label{min-height:90px}.topic-controls{padding-left:24px;padding-right:24px;grid-template-columns:1fr auto}.topic-counter{display:none}}


/* Three angled smart displays inspired by the supplied product reference */
.topic-showcase{max-width:1160px;padding:0 18px 30px;overflow:hidden}
.topic-track{grid-auto-columns:calc((100% - 64px)/3);gap:32px;align-items:end;padding:10px 0 0}
.topic-panel{height:330px;padding:0 0 36px;filter:none;transform-origin:50% 75%;transition:transform .55s ease}
.topic-panel:nth-child(3n+1){transform:perspective(850px) rotateY(13deg) rotateZ(-1deg) scale(.91);transform-origin:right bottom}
.topic-panel:nth-child(3n+2){transform:translateY(-5px) scale(1.02);z-index:2}
.topic-panel:nth-child(3n){transform:perspective(850px) rotateY(-13deg) rotateZ(1deg) scale(.91);transform-origin:left bottom}
.topic-panel:before{left:calc(50% - 5px);bottom:21px;width:10px;height:27px;background:linear-gradient(90deg,#c6c8c6,#f1f2ef 45%,#9da29e);border-radius:0 0 3px 3px;z-index:-1}
.topic-panel:after{left:calc(50% - 52px);bottom:0;width:104px;height:34px;border-radius:18px 18px 10px 10px;background:linear-gradient(180deg,#f6f6f3 0%,#d9dcd8 55%,#bfc3bf 100%);box-shadow:inset 0 2px 2px #fff,0 2px 4px rgba(0,0,0,.12);z-index:-2}
.topic-art{height:245px;flex:1;margin:0;border:8px solid #161a19;border-bottom-width:10px;border-radius:23px 23px 19px 19px;background:var(--screen-bg,#e9eee7);box-shadow:inset 0 0 0 1px rgba(255,255,255,.62),0 2px 2px rgba(0,0,0,.2);overflow:hidden}
.topic-art:before{content:"";position:absolute;z-index:4;top:5px;left:50%;width:28px;height:4px;transform:translateX(-50%);border-radius:4px;background:#313633;opacity:.65}
.topic-art:after{background:linear-gradient(125deg,rgba(255,255,255,.22),transparent 30%,transparent 70%,rgba(255,255,255,.06))}
.topic-label{position:absolute;z-index:5;left:8px;right:8px;bottom:46px;margin:0;padding:10px 12px 12px;min-height:0;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(255,255,255,.92) 18%,rgba(255,255,255,.94));border:0;border-radius:0 0 12px 12px;box-shadow:none;text-align:center}
.topic-label h2{font-size:clamp(12px,1.1vw,16px);line-height:1.15;margin:10px 0 4px;letter-spacing:-.3px}
.topic-label p{font-size:9px;line-height:1.3;color:#4e554f}
.topic-agriculture .topic-art,.topic-food .topic-art,.topic-electronics .topic-art,.topic-it .topic-art,.topic-health .topic-art,.topic-retail .topic-art{background:var(--screen-bg)}
.topic-controls{max-width:1160px;margin:5px auto 0}
@media(max-width:900px){.topic-track{grid-auto-columns:calc((100% - 28px)/2);gap:28px}.topic-panel{height:315px}.topic-panel:nth-child(3n+1),.topic-panel:nth-child(3n+2),.topic-panel:nth-child(3n){transform:none}.topic-panel:nth-child(odd){transform:perspective(850px) rotateY(8deg) scale(.96)}.topic-panel:nth-child(even){transform:perspective(850px) rotateY(-8deg) scale(.96)}.topic-art{height:230px}}
@media(max-width:600px){.topic-track{grid-auto-columns:100%;gap:20px}.topic-panel{height:340px;max-width:330px;width:100%;margin:0 auto;transform:none!important}.topic-art{height:250px}.topic-label h2{font-size:16px}.topic-label p{font-size:10px}}


/* Final monitor carousel: photographic screens with a fixed three-display composition */
.topic-showcase{max-width:1420px;padding:0 56px 28px;margin-top:24px}
.topic-track{grid-auto-columns:calc((100% - 52px)/3);gap:26px;align-items:end}
.topic-panel{height:clamp(285px,25vw,360px);padding-bottom:35px;transition:transform .55s cubic-bezier(.2,.7,.25,1),filter .55s ease}
.topic-panel.monitor-left{transform:perspective(1000px) rotateY(15deg) rotateZ(-1deg) scale(.92);transform-origin:right bottom;z-index:1}
.topic-panel.monitor-center{transform:translateY(-7px) scale(1.02);z-index:3}
.topic-panel.monitor-right{transform:perspective(1000px) rotateY(-15deg) rotateZ(1deg) scale(.92);transform-origin:left bottom;z-index:1}
.topic-panel:before{bottom:20px;height:26px;z-index:-1}
.topic-panel:after{bottom:0;width:104px;left:calc(50% - 52px);height:34px;border-radius:18px 18px 10px 10px;background:linear-gradient(180deg,#fafbf9,#d5d8d5 60%,#aeb3b0);box-shadow:inset 0 2px 2px #fff,0 2px 4px #0002;z-index:-2}
.topic-art{position:relative;height:calc(100% - 2px);flex:1;border:8px solid #171b19;border-bottom-width:10px;border-radius:22px 22px 17px 17px;overflow:hidden;background:#e9e9e4;box-shadow:inset 0 0 0 1px #ffffffa8,0 2px 2px #0003}
.topic-art:before{content:"";position:absolute;z-index:5;top:5px;left:50%;width:25px;height:4px;transform:translateX(-50%);border-radius:4px;background:#222824;opacity:.72;clip-path:none}
.topic-art:after{content:"";position:absolute;z-index:2;inset:0;border-radius:13px;background:linear-gradient(120deg,#ffffff20,transparent 30%,transparent 75%,#ffffff12);pointer-events:none}
.topic-photo{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center;display:block;z-index:0}
.topic-art .sun,.topic-art .plant,.topic-art .soil,.topic-art .food-shape,.topic-art .food-plate,.topic-art .circuit-chip,.topic-art .circuit-line,.topic-art .code-window,.topic-art .code-orbit,.topic-art .health-cross,.topic-art .health-ring,.topic-art .health-dot,.topic-art .retail-bag,.topic-art .retail-handle,.topic-art .retail-star{display:none!important}
.topic-label{position:absolute;z-index:6;left:8px;right:8px;bottom:46px;margin:0;padding:36px 12px 12px;min-height:0;text-align:left;background:linear-gradient(180deg,transparent 0%,rgba(0,0,0,.08) 12%,rgba(0,0,0,.78) 100%);border:0;border-radius:0 0 11px 11px;box-shadow:none}
.topic-label h2{font-size:clamp(14px,1.15vw,18px);line-height:1.2;color:#fff;text-shadow:0 1px 5px #0007;margin:0 0 5px;letter-spacing:-.3px}
.topic-label p{font-size:clamp(9px,.72vw,11px);line-height:1.35;color:#fff;text-shadow:0 1px 4px #0008;margin:0}
.topic-controls{max-width:1300px;margin:5px auto 0;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 56px 22px}
.topic-pagination{justify-content:center;gap:11px}
.topic-dot{width:9px;height:9px;border:0;border-radius:50%;padding:0;background:#c6c8c4;cursor:pointer}
.topic-dot.active{background:#17251f;transform:scale(1.12)}
.topic-arrows{position:static;transform:none;justify-self:end;display:flex;gap:10px}
.topic-arrows button{width:46px;height:46px;border-radius:50%;border:1px solid #e5e5df;background:#fff;color:#28352d;box-shadow:0 4px 14px #0000000d;font-size:23px;cursor:pointer;transition:background .2s,color .2s}
.topic-arrows button:hover{background:#17251f;color:#fff}
.topic-counter{display:none}
@media(max-width:900px){.topic-showcase{padding-left:42px;padding-right:42px}.topic-track{grid-auto-columns:calc((100% - 24px)/2);gap:24px}.topic-panel.monitor-left,.topic-panel.monitor-center,.topic-panel.monitor-right{transform:none}.topic-panel.monitor-left{transform:perspective(900px) rotateY(8deg) scale(.97)}.topic-panel.monitor-center{transform:translateY(-4px)}.topic-panel.monitor-right{transform:perspective(900px) rotateY(-8deg) scale(.97)}.topic-controls{padding-left:42px;padding-right:42px}.topic-label h2{font-size:15px}}
@media(max-width:600px){.topic-showcase{padding-left:36px;padding-right:36px}.topic-track{grid-auto-columns:100%;gap:16px}.topic-panel{max-width:340px;width:100%;margin:0 auto;height:320px}.topic-panel.monitor-left,.topic-panel.monitor-center,.topic-panel.monitor-right{transform:none}.topic-controls{grid-template-columns:1fr auto;padding-left:36px;padding-right:36px;gap:16px}.topic-pagination{justify-content:start}.topic-arrows button{width:38px;height:38px}.topic-label h2{font-size:16px}.topic-label p{font-size:11px}}
@media(prefers-reduced-motion:reduce){.topic-panel,.topic-track,.topic-arrows button{transition:none!important}}


/* Carousel fit refinement: keep exactly three monitor windows inside the stage */
.topic-showcase{width:100%;box-sizing:border-box;overflow:hidden;clip-path:inset(0)}
.topic-track{width:100%;min-width:0;box-sizing:border-box;grid-template-columns:none;grid-auto-flow:column;grid-auto-columns:calc((100% - 52px)/3);overflow:visible;will-change:transform}
.topic-panel{min-width:0;box-sizing:border-box}
.topic-controls{position:relative;z-index:4}
@media(max-width:900px){.topic-track{grid-auto-columns:calc((100% - 24px)/2)}}
@media(max-width:600px){.topic-track{grid-auto-columns:100%}}


/* Fixed-frame carousel: topic content changes positions; the monitor track never slides. */
.topic-track{
  transform:none!important;
  transition:none!important;
  will-change:auto;
}
.topic-panel{
  flex-shrink:0;
}
.topic-panel.monitor-left{
  transform:perspective(1000px) rotateY(13deg) rotateZ(-1deg) scale(.92);
  transform-origin:right center;
}
.topic-panel.monitor-center{
  transform:translateY(-8px) scale(1.02);
  transform-origin:center center;
}
.topic-panel.monitor-right{
  transform:perspective(1000px) rotateY(-13deg) rotateZ(1deg) scale(.92);
  transform-origin:left center;
}
@media(max-width:900px){
  .topic-panel.monitor-left{transform:perspective(900px) rotateY(8deg) scale(.96)}
  .topic-panel.monitor-center{transform:translateY(-5px) scale(1.01)}
  .topic-panel.monitor-right{transform:perspective(900px) rotateY(-8deg) scale(.96)}
}
@media(max-width:600px){
  .topic-panel.monitor-left,.topic-panel.monitor-center,.topic-panel.monitor-right{transform:none}
}


/* Fix: clip the carousel track to exactly three desktop monitor slots. */
@media(min-width:901px){
  .topic-showcase{overflow:hidden!important;clip-path:inset(0);}
  .topic-track{display:grid!important;width:100%!important;max-width:100%!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;grid-auto-columns:unset!important;gap:26px!important;overflow:hidden!important;padding-left:0!important;padding-right:0!important;}
  .topic-panel{width:auto!important;min-width:0!important;max-width:100%!important;}
}


/* Correct carousel: only the three assigned monitor positions are rendered. */
.topic-track > .topic-panel:not(.monitor-left):not(.monitor-center):not(.monitor-right){display:none!important;}
.topic-track > .topic-panel.monitor-left,
.topic-track > .topic-panel.monitor-center,
.topic-track > .topic-panel.monitor-right{display:flex!important;}
@media(max-width:900px){
  .topic-track > .topic-panel:not(.monitor-left):not(.monitor-center):not(.monitor-right){display:none!important;}
}


/* Cretile partnership — spacious, minimal treatment */
.cretile-partner{padding:100px 24px 108px;background:#f7f7f4;text-align:center;border-top:1px solid rgba(23,36,30,.06);border-bottom:1px solid rgba(23,36,30,.06)}
.cretile-partner-inner{max-width:760px;margin:0 auto}
.cretile-partner .eyebrow{margin:0 0 28px;color:#68746d;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.cretile-wordmark{display:inline-flex;align-items:center;justify-content:center;padding:7px 12px 8px;border:2px solid #3b73b9;border-radius:10px;color:#fff;background:#3b73b9;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(28px,4vw,42px);font-weight:700;letter-spacing:.035em;line-height:1}
.cretile-wordmark span:last-child{color:#3b73b9;background:#fff;margin:-7px -10px -8px 3px;padding:7px 9px 8px;border-radius:0 7px 7px 0}
.cretile-partner h2{margin:28px 0 14px;color:var(--ink,#202a22);font-size:clamp(30px,4vw,48px);font-weight:550;letter-spacing:-.045em;line-height:1.08}
.cretile-partner-inner>p:not(.eyebrow){max-width:570px;margin:0 auto 22px;color:#68746d;font-size:17px;line-height:1.75}
.cretile-partner .text-link{display:inline-flex;gap:10px;align-items:center;color:var(--ink,#202a22);font-weight:650;text-decoration:none}
.cretile-partner .text-link span{transition:transform .2s ease}
.cretile-partner .text-link:hover span{transform:translate(3px,-3px)}
@media(max-width:640px){.cretile-partner{padding:72px 22px 78px}.cretile-partner-inner>p:not(.eyebrow){font-size:15px}}


/* Cretile section below the HAPLE hero */
.cretile-page{padding:112px clamp(24px,6vw,96px) 100px;background:#f7f7f4;color:#202a22;border-top:1px solid rgba(23,36,30,.07)}
.cretile-intro{max-width:850px;margin:0 auto 72px;text-align:center}
.cretile-intro>.eyebrow{margin:0 0 24px;color:#68746d;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.cretile-logo-wordmark{display:inline-flex;align-items:center;margin-bottom:28px;padding:7px 11px;border:2px solid #3b73b9;border-radius:10px;background:#3b73b9;color:#fff;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:clamp(27px,3.4vw,39px);font-weight:700;letter-spacing:.035em;line-height:1}
.cretile-logo-wordmark span:last-child{margin:-7px -9px -7px 3px;padding:7px 8px;border-radius:0 6px 6px 0;background:#fff;color:#3b73b9}
.cretile-intro h2{margin:0 0 22px;font-size:clamp(38px,5.2vw,68px);font-weight:550;letter-spacing:-.055em;line-height:1.04}
.cretile-intro h2 em,.cretile-skills h3 em{color:#3b73b9;font-style:normal}
.cretile-lead{max-width:660px;margin:0 auto;color:#68746d;font-size:18px;line-height:1.8}
.cretile-offerings{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;max-width:1240px;margin:0 auto 100px}
.cretile-offering{position:relative;min-height:270px;padding:30px 28px;background:#fff;border:1px solid rgba(23,36,30,.08);border-radius:18px}
.cretile-offering-number{color:#8a958e;font-size:11px;font-weight:700;letter-spacing:.12em}
.cretile-offering-symbol{display:grid;place-items:center;width:48px;height:48px;margin:25px 0 20px;border-radius:14px;background:#eaf1fa;color:#326bb0;font-size:25px}
.cretile-offering h3{margin:0 0 12px;font-size:22px;letter-spacing:-.035em}
.cretile-offering p{margin:0;color:#68746d;font-size:15px;line-height:1.75}
.cretile-skills{display:grid;grid-template-columns:1fr 1.15fr;align-items:center;gap:56px;max-width:1120px;margin:0 auto 88px;padding:52px 0;border-top:1px solid rgba(23,36,30,.12);border-bottom:1px solid rgba(23,36,30,.12)}
.cretile-skills .eyebrow{margin:0 0 18px;color:#68746d;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.cretile-skills h3{margin:0;font-size:clamp(32px,4vw,48px);font-weight:550;letter-spacing:-.05em;line-height:1.08}
.cretile-skill-list{display:flex;flex-wrap:wrap;gap:10px}
.cretile-skill-list span{padding:12px 16px;border:1px solid rgba(23,36,30,.12);border-radius:999px;background:rgba(255,255,255,.7);font-size:14px;color:#344239}
.cretile-stats{display:grid;grid-template-columns:repeat(3,1fr);max-width:900px;margin:0 auto;text-align:center}
.cretile-stats>div{display:flex;flex-direction:column;gap:8px;padding:10px 18px;border-right:1px solid rgba(23,36,30,.12)}
.cretile-stats>div:last-child{border-right:0}
.cretile-stats strong{color:#326bb0;font-size:clamp(32px,4vw,48px);font-weight:600;letter-spacing:-.05em}
.cretile-stats span{color:#68746d;font-size:13px}
@media(max-width:800px){.cretile-page{padding:78px 22px}.cretile-intro{margin-bottom:48px}.cretile-lead{font-size:16px}.cretile-offerings{grid-template-columns:1fr;margin-bottom:64px}.cretile-offering{min-height:0}.cretile-skills{grid-template-columns:1fr;gap:28px;margin-bottom:58px;padding:36px 0}.cretile-stats strong{font-size:30px}.cretile-stats span{font-size:12px}}
@media(max-width:480px){.cretile-stats{grid-template-columns:1fr;gap:12px}.cretile-stats>div{border-right:0;border-bottom:1px solid rgba(23,36,30,.12);padding:16px}.cretile-stats>div:last-child{border-bottom:0}}


/* Six divisions section follows the Cretile introduction */
.divisions-section{padding:88px 0 74px;background:#f2f2f4;color:#1d2923;overflow:hidden}
.divisions-heading{max-width:850px;margin:0 auto 48px;padding:0 24px;text-align:center}
.divisions-heading .eyebrow{margin:0 0 14px;color:#68746d;font-size:11px;font-weight:700;letter-spacing:.16em;text-transform:uppercase}
.divisions-heading h2{margin:0;font-size:clamp(38px,5vw,64px);font-weight:550;letter-spacing:-.055em;line-height:1.04}
.divisions-heading h2 em{color:#3b73b9;font-style:normal}
.divisions-heading>p:last-child{margin:18px 0 0;color:#68746d;font-size:17px;line-height:1.6}
.divisions-section .topic-showcase{width:min(100%,1440px);max-width:none;margin:0 auto;overflow:hidden}
.divisions-section .topic-track{padding:0 24px 12px}
@media(max-width:700px){.divisions-section{padding:64px 0 52px}.divisions-heading{margin-bottom:32px}.divisions-heading>p:last-child{font-size:15px}}


/* HAPLE six-division ecosystem — distinct from the hero monitor carousel */
.division-ecosystem{position:relative;isolation:isolate;max-width:1120px;min-height:650px;margin:0 auto;padding:24px 22px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-template-rows:repeat(2,minmax(230px,auto));gap:24px}
.ecosystem-orbit{position:absolute;z-index:-1;left:50%;top:50%;border:1px solid rgba(59,115,185,.18);border-radius:50%;transform:translate(-50%,-50%);pointer-events:none}
.orbit-one{width:400px;height:400px}.orbit-two{width:540px;height:540px;border-style:dashed;opacity:.75}
.ecosystem-hub{position:absolute;z-index:2;left:50%;top:50%;width:142px;height:142px;transform:translate(-50%,-50%);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;border-radius:50%;background:#1d3529;color:#fff;box-shadow:0 0 0 12px #f2f2f4,0 0 0 13px rgba(59,115,185,.22),0 15px 38px rgba(23,36,30,.16)}
.hub-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:12px 12px 12px 3px;background:#f4a340;color:#17251f;font:800 22px var(--display)}
.ecosystem-hub strong{font:800 16px var(--display);letter-spacing:.08em}.ecosystem-hub small{font-size:9px;color:#d7e4d9}
.division-node{position:relative;display:grid;grid-template-columns:92px 1fr;align-items:center;gap:15px;min-width:0;padding:18px;background:#fff;border:1px solid rgba(29,41,35,.08);border-radius:18px;box-shadow:0 10px 28px rgba(29,41,35,.055);transition:transform .25s ease,box-shadow .25s ease}
.division-node:hover{transform:translateY(-5px);box-shadow:0 16px 34px rgba(29,41,35,.11)}
.division-node img{width:92px;height:112px;object-fit:cover;border-radius:12px}
.division-node h3{margin:0 0 8px;font-size:17px;line-height:1.2;letter-spacing:-.035em;color:#1d2923}
.division-node p{margin:0;font-size:12px;line-height:1.55;color:#68746d}
.division-number{position:absolute;top:10px;right:13px;font-size:10px;font-weight:800;letter-spacing:.1em;color:#89968c}
.node-agriculture{border-top:3px solid #6d9b55}.node-food{border-top:3px solid #e49b52}.node-electronics{border-top:3px solid #3b73b9}.node-it{border-top:3px solid #6c9cbd}.node-health{border-top:3px solid #9b8ac7}.node-retail{border-top:3px solid #d96c4f}
@media(min-width:901px){.node-agriculture{grid-column:1;grid-row:1}.node-food{grid-column:2;grid-row:1}.node-electronics{grid-column:3;grid-row:1}.node-it{grid-column:1;grid-row:2}.node-health{grid-column:2;grid-row:2}.node-retail{grid-column:3;grid-row:2}.division-ecosystem{padding-top:22px;padding-bottom:22px}}
@media(max-width:900px){.division-ecosystem{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:auto;min-height:0;gap:16px}.ecosystem-hub{position:relative;left:auto;top:auto;transform:none;grid-column:1/-1;grid-row:1;margin:0 auto 10px;width:120px;height:120px}.ecosystem-orbit{display:none}.division-node{grid-template-columns:76px 1fr;padding:15px;gap:12px}.division-node img{width:76px;height:96px}.division-node h3{font-size:15px}}
@media(max-width:560px){.division-ecosystem{grid-template-columns:1fr;padding:8px 20px}.ecosystem-hub{grid-column:1}.division-node{grid-template-columns:88px 1fr;padding:16px}.division-node img{width:88px;height:100px}.division-node h3{font-size:16px}.division-node p{font-size:13px}}

/* Add colour and sector context to the six division ecosystem */
.division-groups{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:22px auto 0}
.division-groups span{padding:9px 13px;border-radius:999px;background:#fff;border:1px solid rgba(29,41,35,.09);color:#435348;font-size:11px;font-weight:700;letter-spacing:.015em}
.division-groups span:nth-child(1){background:#eaf2e4;color:#4c773d;border-color:#d5e5ca}
.division-groups span:nth-child(2){background:#e8f0fa;color:#326bb0;border-color:#d2e0f2}
.division-groups span:nth-child(3){background:#fae9e4;color:#b95740;border-color:#f1d2c9}
.division-node{background:linear-gradient(135deg,#fff 0%,var(--division-tint,#fff) 150%);border-radius:20px}
.node-agriculture{--division-tint:#eef6e8}.node-food{--division-tint:#fff0df}.node-electronics{--division-tint:#eaf1fb}.node-it{--division-tint:#e7f5fa}.node-health{--division-tint:#f1edfb}.node-retail{--division-tint:#fff0ec}
.division-number{top:12px;right:13px;padding:5px 7px;border-radius:7px;background:var(--division-number-bg,#edf0eb);color:var(--division-number-ink,#526156)}
.node-agriculture .division-number{--division-number-bg:#dceccd;--division-number-ink:#4c773d}
.node-food .division-number{--division-number-bg:#fbe4c8;--division-number-ink:#a45d1c}
.node-electronics .division-number{--division-number-bg:#dbe8fb;--division-number-ink:#326bb0}
.node-it .division-number{--division-number-bg:#d9eef6;--division-number-ink:#34738e}
.node-health .division-number{--division-number-bg:#e8e0fa;--division-number-ink:#765ca8}
.node-retail .division-number{--division-number-bg:#f9ddd5;--division-number-ink:#b95740}
.division-node h3{max-width:95%;font-size:16px}
.division-node p{font-size:12.5px}
@media(max-width:700px){.division-groups{gap:7px}.division-groups span{font-size:10px;padding:8px 10px}}


}


/* Layout correction: keep enquiry content readable on desktop and smaller screens */
.enquiry-section{display:block!important;width:100%;padding:72px clamp(18px,4vw,64px)!important}
.enquiry-layout{width:100%;max-width:1450px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:stretch;gap:0}
.enquiry-story,.enquiry-card{min-width:0;width:100%}
.enquiry-story{border-radius:30px 0 0 30px}
.enquiry-card{border-radius:0 30px 30px 0}
.enquiry-story h2{font-size:clamp(34px,3.5vw,54px);overflow-wrap:normal;word-break:normal}
.enquiry-description{font-size:15px}
.enquiry-card-heading{display:block}
.required-note{display:inline-block;margin-top:12px}
.enquiry-field{grid-template-columns:46px minmax(0,1fr);gap:12px}
.field-icon{width:46px;height:48px;font-size:23px}
.field-content input,.field-content select{width:100%;min-width:0}
@media(max-width:1000px){
 .enquiry-layout{grid-template-columns:minmax(0,1fr)}
 .enquiry-story{border-radius:26px 26px 0 0}
 .enquiry-card{border-radius:0 0 26px 26px}
 .enquiry-story h2{font-size:clamp(36px,7vw,54px)}
}
@media(max-width:600px){
 .enquiry-section{padding:28px 12px!important}
 .enquiry-story{padding:25px 20px 18px}
 .enquiry-card{padding:24px 18px}
 .enquiry-field{grid-template-columns:40px minmax(0,1fr);gap:10px}
 .field-icon{width:40px;height:44px;font-size:21px}
}

/* HAPLE school enquiry — split-screen design using the original brand logo */
.enquiry-section{padding:72px clamp(18px,4vw,64px);background:radial-gradient(circle at 12% 10%,#e8f5e8 0,transparent 30%),radial-gradient(circle at 88% 92%,#fff0d5 0,transparent 30%),#edf4ff}
.enquiry-layout{max-width:1450px;margin:0 auto;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.04fr);gap:0;align-items:stretch}
.enquiry-story{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;padding:34px clamp(22px,4vw,58px) 24px;background:rgba(255,255,255,.56);border-radius:30px 0 0 30px}
.enquiry-logo{display:block;width:min(255px,72%);height:auto;max-height:130px;object-fit:contain;object-position:left center;margin:0 0 20px}
.enquiry-eyebrow,.enquiry-kicker{display:inline-flex;align-items:center;margin:0 0 16px;padding:8px 13px;border-radius:999px;background:#e2f8e4;color:#176344;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.enquiry-story h2{max-width:610px;margin:0;color:#111b36;font:800 clamp(36px,4.3vw,64px)/1.02 var(--display);letter-spacing:-.055em}
.enquiry-story h2 span{color:#087c62}
.enquiry-description{max-width:590px;margin:19px 0 23px;color:#435675;font-size:16px;line-height:1.65}
.enquiry-benefits{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;width:100%;max-width:560px;margin:2px 0 20px;text-align:center}
.enquiry-benefits>div{display:flex;align-items:center;flex-direction:column;gap:9px;color:#122444;font-size:12px;line-height:1.35}
.benefit-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:50%;color:white;font-size:29px;font-weight:600}
.benefit-green{background:#16a36a}.benefit-orange{background:#ffb326}.benefit-blue{background:#2587ec}.benefit-purple{background:#7840d7}
.enquiry-student-image{width:calc(100% + 40px);min-height:230px;flex:1;margin:0 -20px;background-image:linear-gradient(0deg,rgba(236,244,255,.06),rgba(236,244,255,.06)),url('https://images.unsplash.com/photo-1581092921461-eab62e97a780?auto=format&fit=crop&w=1200&q=85');background-size:cover;background-position:center 45%;border-radius:22px 22px 0 0}
.enquiry-tagline{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:18px 0 0;color:#405675;font-size:10px}
.enquiry-tagline strong{color:#101b33;font-size:12px}.enquiry-tagline i{width:40px;height:2px;background:linear-gradient(90deg,#16a36a,#ffb326,#2587ec,#7840d7)}
.enquiry-card{position:relative;z-index:1;padding:clamp(25px,3.2vw,48px);background:rgba(255,255,255,.96);border-radius:30px;box-shadow:0 20px 65px rgba(33,66,100,.1)}
.enquiry-card-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:24px}
.enquiry-kicker{margin-bottom:13px;background:#eef8e9}
.enquiry-card-heading h3{margin:0 0 8px;color:#111b36;font:800 clamp(28px,3vw,42px)/1.08 var(--display);letter-spacing:-.045em}
.enquiry-card-heading p{max-width:460px;margin:0;color:#526687;font-size:14px;line-height:1.55}
.required-note{flex-shrink:0;padding:12px 14px;border-radius:18px;background:#f1f9e5;color:#244c3c;font-size:12px;line-height:1.5}
.required-note b,.field-content b{color:#ed542d}
.school-enquiry-form{display:grid;gap:15px}
.enquiry-field{display:grid;grid-template-columns:58px minmax(0,1fr);align-items:center;gap:14px;cursor:text}
.field-icon{display:grid;place-items:center;width:58px;height:58px;border-radius:15px;font-size:29px;font-weight:500}
.field-person{background:#e9f4ff;color:#1a5688}.field-school{background:#fff2dc;color:#c36b05}.field-role{background:#f0eaff;color:#6331c5}.field-mail{background:#ffeaf0;color:#d72e61}.field-phone{background:#e8f8ed;color:#16774e}.field-location{background:#e8f1ff;color:#235d9b}
.field-content{display:grid;gap:7px;min-width:0;color:#14223d;font-size:13px;font-weight:800}
.field-content input,.field-content select{width:100%;min-width:0;height:47px;padding:0 15px;border:1px solid #cbd6e5;border-radius:12px;background:#fff;color:#172943;font-size:14px;font-weight:400;outline:none;transition:border-color .2s,box-shadow .2s}
.field-content input::placeholder,.field-content select:invalid{color:#8796ae}
.field-content input:focus,.field-content select:focus{border-color:#168365;box-shadow:0 0 0 3px rgba(22,131,101,.12)}
.enquiry-submit{display:flex;align-items:center;justify-content:center;gap:18px;min-height:62px;margin-top:4px;padding:12px 20px;border:0;border-radius:15px;background:linear-gradient(100deg,#07583f,#116b53);color:#fff;font-size:16px;font-weight:800;cursor:pointer;transition:transform .2s,box-shadow .2s}
.enquiry-submit:hover{transform:translateY(-2px);box-shadow:0 10px 25px rgba(7,88,63,.2)}
.enquiry-submit span{font-size:25px;line-height:1}
.enquiry-privacy{margin:0;text-align:center;color:#667995;font-size:11px;line-height:1.5}
.form-status{margin:0;color:#a23e2d;font-size:12px;line-height:1.5}
@media(max-width:1000px){.enquiry-layout{grid-template-columns:1fr}.enquiry-story{border-radius:26px 26px 0 0;padding:32px}.enquiry-student-image{min-height:270px}.enquiry-card{border-radius:0 0 26px 26px;padding:32px}.enquiry-story h2{max-width:720px}}
@media(max-width:600px){.enquiry-section{padding:30px 12px}.enquiry-story{padding:25px 20px 18px}.enquiry-logo{width:210px;max-height:105px}.enquiry-story h2{font-size:39px;letter-spacing:-.045em}.enquiry-description{font-size:14px}.enquiry-benefits{gap:5px}.benefit-icon{width:46px;height:46px;font-size:23px}.enquiry-benefits>div{font-size:10px}.enquiry-student-image{min-height:190px;width:calc(100% + 16px);margin:0 -8px}.enquiry-tagline{gap:8px;font-size:9px}.enquiry-card{padding:24px 18px}.enquiry-card-heading{display:block}.required-note{display:inline-block;margin-top:14px}.enquiry-field{grid-template-columns:43px minmax(0,1fr);gap:10px}.field-icon{width:43px;height:48px;border-radius:12px;font-size:24px}.field-content input,.field-content select{height:45px;padding:0 11px;font-size:13px}.school-enquiry-form{gap:13px}.enquiry-submit{min-height:56px;font-size:15px}}



/* FINAL ENQUIRY LAYOUT OVERRIDES — desktop two-column, responsive mobile */
body .enquiry-section{
  display:block !important;
  box-sizing:border-box !important;
  width:100% !important;
  max-width:none !important;
  margin:0 !important;
  padding:64px clamp(20px,4.5vw,72px) !important;
  background:radial-gradient(circle at 12% 10%,#e8f5e8 0,transparent 30%),radial-gradient(circle at 88% 92%,#fff0d5 0,transparent 30%),#edf4ff !important;
}
body .enquiry-layout{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr) !important;
  width:100% !important;
  max-width:1380px !important;
  margin:0 auto !important;
  gap:0 !important;
  align-items:stretch !important;
}
body .enquiry-story, body .enquiry-card{
  box-sizing:border-box !important;
  width:100% !important;
  min-width:0 !important;
  max-width:none !important;
}
body .enquiry-story{
  padding:clamp(28px,3.5vw,52px) !important;
  border-radius:28px 0 0 28px !important;
  overflow:hidden !important;
}
body .enquiry-card{
  padding:clamp(24px,3vw,44px) !important;
  border-radius:0 28px 28px 0 !important;
}
body .enquiry-logo{width:min(230px,80%) !important;max-height:115px !important}
body .enquiry-story h2{
  font-size:clamp(36px,3.5vw,56px) !important;
  line-height:1.06 !important;
  letter-spacing:-.045em !important;
  max-width:100% !important;
  overflow-wrap:normal !important;
  word-break:normal !important;
}
body .enquiry-description{max-width:100% !important;font-size:15px !important}
body .enquiry-card-heading{display:block !important;margin-bottom:22px !important}
body .required-note{display:inline-block !important;margin-top:10px !important}
body .enquiry-field{
  display:grid !important;
  grid-template-columns:46px minmax(0,1fr) !important;
  gap:12px !important;
  width:100% !important;
}
body .field-icon{width:46px !important;height:46px !important;font-size:23px !important}
body .field-content{min-width:0 !important;width:100% !important}
body .field-content input,body .field-content select{display:block !important;width:100% !important;min-width:0 !important;max-width:100% !important}
body .school-enquiry-form{width:100% !important;min-width:0 !important}
@media(max-width:900px){
 body .enquiry-section{padding:34px 18px !important}
 body .enquiry-layout{grid-template-columns:minmax(0,1fr) !important;max-width:720px !important}
 body .enquiry-story{border-radius:24px 24px 0 0 !important;padding:30px !important}
 body .enquiry-card{border-radius:0 0 24px 24px !important;padding:30px !important}
 body .enquiry-story h2{font-size:clamp(36px,7vw,52px) !important}
}
@media(max-width:520px){
 body .enquiry-section{padding:20px 10px !important}
 body .enquiry-story,body .enquiry-card{padding:22px 18px !important}
 body .enquiry-logo{width:190px !important;max-height:95px !important}
 body .enquiry-field{grid-template-columns:38px minmax(0,1fr) !important;gap:10px !important}
 body .field-icon{width:38px !important;height:42px !important;font-size:20px !important}
 body .field-content input,body .field-content select{height:44px !important;padding:0 10px !important;font-size:13px !important}
 body .enquiry-benefits{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
}



/* Header brand: show the original HAPLE logo with Happy Learning at top-left */
.site-header .wordmark{
  visibility:visible !important;
  grid-column:1 !important;
  justify-self:start !important;
  display:flex !important;
  align-items:center !important;
  min-width:0;
}
.site-header .wordmark img{
  display:block;
  width:150px !important;
  height:auto !important;
  max-height:58px;
  object-fit:contain;
}
.site-header{
  grid-template-columns:minmax(180px,1fr) auto minmax(180px,1fr) !important;
}
.site-header .desktop-nav{grid-column:2 !important}
.site-header .nav-cta{grid-column:3 !important}
@media(max-width:720px){
 .site-header{grid-template-columns:minmax(120px,1fr) auto !important}
 .site-header .wordmark{grid-column:1 !important}
 .site-header .desktop-nav{display:none !important}
 .site-header .nav-cta{grid-column:2 !important}
 .site-header .wordmark img{width:125px !important;max-height:48px}
}



/* Give each hero monitor a clear, centered desktop stand beneath the screen */
.topic-panel{
  position:relative;
  overflow:visible!important;
  padding-bottom:34px!important;
}
.topic-panel::after{
  content:"";
  position:absolute;
  z-index:0;
  left:50%;
  bottom:4px;
  width:22%;
  height:27px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,#c9ceca 0%,#f5f6f3 24%,#e2e5e1 72%,#b8bfba 100%);
  border:1px solid #aeb4af;
  border-radius:3px 3px 9px 9px;
  box-shadow:0 5px 7px rgba(22,30,26,.16);
}
.topic-panel::before{
  content:"";
  position:absolute;
  z-index:0;
  left:50%;
  bottom:26px;
  width:9px;
  height:27px;
  transform:translateX(-50%);
  background:linear-gradient(90deg,#aeb4af,#f5f6f3 45%,#c5cbc6);
  border-radius:2px;
  box-shadow:0 1px 2px rgba(22,30,26,.18);
}
.topic-art,.topic-label{z-index:1}
@media(max-width:600px){
 .topic-panel{padding-bottom:30px!important}
 .topic-panel::after{height:22px;bottom:4px}
 .topic-panel::before{height:22px;bottom:21px}
}



/* Smart-display monitor style inspired by the user's reference image */
.topic-panel{
  height:390px!important;
  padding-bottom:58px!important;
  overflow:visible!important;
  position:relative!important;
  isolation:isolate;
}
.topic-art{
  position:absolute!important;
  left:0;right:0;top:0;
  height:calc(100% - 66px)!important;
  flex:none!important;
  border:8px solid #171a19!important;
  border-radius:34px 34px 28px 28px!important;
  overflow:hidden!important;
  box-shadow:0 4px 7px rgba(0,0,0,.16),inset 0 0 0 1px #ffffff90!important;
}
.topic-art:before{
  top:7px!important;
  width:30px!important;
  height:4px!important;
  border-radius:5px!important;
}
.topic-label{
  position:absolute!important;
  z-index:4!important;
  left:8px!important;right:8px!important;
  top:auto!important;
  bottom:67px!important;
  width:auto!important;height:auto!important;
  transform:none!important;
  margin:0!important;
  padding:36px 13px 13px!important;
  min-height:0!important;
  border:0!important;
  border-radius:0 0 21px 21px!important;
  background:linear-gradient(180deg,transparent,rgba(0,0,0,.78))!important;
  box-shadow:none!important;
}
.topic-panel:before{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  left:50%!important;
  bottom:31px!important;
  width:18px!important;height:25px!important;
  transform:translateX(-50%)!important;
  background:linear-gradient(90deg,#c1c5c2,#f8f8f6 45%,#c0c4c1)!important;
  border-radius:2px!important;
}
.topic-panel:after{
  content:""!important;
  position:absolute!important;
  z-index:0!important;
  left:50%!important;
  bottom:0!important;
  width:43%!important;height:36px!important;
  transform:translateX(-50%)!important;
  border:1px solid #c5c8c5!important;
  border-radius:15px 15px 13px 13px!important;
  background:repeating-linear-gradient(0deg,#d4d7d4 0 1px,#eef0ed 1px 3px)!important;
  box-shadow:inset 0 3px 4px #fff,0 4px 6px #0002!important;
}
.topic-photo{border-radius:24px!important}
@media(max-width:900px){
 .topic-panel{height:350px!important;padding-bottom:52px!important}
 .topic-art{height:calc(100% - 60px)!important}
 .topic-label{bottom:61px!important}
 .topic-panel:before{bottom:27px!important;height:23px!important}
 .topic-panel:after{height:31px!important}
}
@media(max-width:600px){
 .topic-panel{height:320px!important;padding-bottom:48px!important}
 .topic-art{height:calc(100% - 55px)!important;border-radius:29px 29px 24px 24px!important}
 .topic-label{bottom:56px!important}
 .topic-panel:before{bottom:24px!important;height:21px!important}
 .topic-panel:after{height:28px!important}
}



/* Smooth horizontal movement when the hero monitor carousel advances */
.topic-track.topic-sliding > .topic-panel.monitor-left{
  animation: hapleMonitorSlideLeft .58s cubic-bezier(.22,.7,.25,1) both;
}
.topic-track.topic-sliding > .topic-panel.monitor-center{
  animation: hapleMonitorSlideCenter .58s cubic-bezier(.22,.7,.25,1) both;
}
.topic-track.topic-sliding > .topic-panel.monitor-right{
  animation: hapleMonitorSlideRight .58s cubic-bezier(.22,.7,.25,1) both;
}
@keyframes hapleMonitorSlideLeft{
  from{opacity:.65;transform:translateX(34px) scale(.985)}
  to{opacity:1;transform:translateX(0) scale(1)}
}
@keyframes hapleMonitorSlideCenter{
  from{opacity:.7;transform:translateX(26px) scale(.97)}
  to{opacity:1;transform:translateX(0) scale(1)}
}
@keyframes hapleMonitorSlideRight{
  from{opacity:.65;transform:translateX(18px) scale(.985)}
  to{opacity:1;transform:translateX(0) scale(1)}
}
@media(prefers-reduced-motion:reduce){
 .topic-track.topic-sliding > .topic-panel{animation:none!important}
}


/* Five-display hero composition inspired by the supplied Apple HomeView reference */
@media(min-width:901px){
  .topic-showcase{max-width:1540px;padding-left:34px;padding-right:34px;margin-top:34px;overflow:hidden}
  .topic-track{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr))!important;grid-auto-columns:unset!important;gap:16px!important;align-items:center!important;overflow:visible!important}
  .topic-track>.topic-panel:not(.monitor-far-left):not(.monitor-left):not(.monitor-center):not(.monitor-right):not(.monitor-far-right){display:none!important}
  .topic-track>.topic-panel.monitor-far-left,
  .topic-track>.topic-panel.monitor-left,
  .topic-track>.topic-panel.monitor-center,
  .topic-track>.topic-panel.monitor-right,
  .topic-track>.topic-panel.monitor-far-right{display:flex!important}
  .topic-panel{height:clamp(230px,23vw,335px)!important;padding-bottom:42px!important;transition:transform .55s ease!important}
  .topic-panel.monitor-far-left{transform:perspective(1000px) rotateY(22deg) scale(.78)!important;transform-origin:right center;z-index:0}
  .topic-panel.monitor-left{transform:perspective(1000px) rotateY(14deg) scale(.9)!important;transform-origin:right center;z-index:1}
  .topic-panel.monitor-center{transform:translateY(-12px) scale(1.12)!important;z-index:3}
  .topic-panel.monitor-right{transform:perspective(1000px) rotateY(-14deg) scale(.9)!important;transform-origin:left center;z-index:1}
  .topic-panel.monitor-far-right{transform:perspective(1000px) rotateY(-22deg) scale(.78)!important;transform-origin:left center;z-index:0}
  .topic-panel:before{bottom:24px!important;height:20px!important}
  .topic-panel:after{bottom:0!important;width:48%!important;height:27px!important;left:26%!important}
  .topic-art{border-radius:24px 24px 19px 19px!important}
}
@media(max-width:900px){
  .topic-track{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .topic-track>.topic-panel:not(.monitor-left):not(.monitor-right):not(.monitor-center){display:none!important}
}


/* Restore the original three-monitor carousel layout */
@media(min-width:901px){
  .topic-showcase{max-width:1540px!important;padding-left:34px!important;padding-right:34px!important;overflow:hidden!important}
  .topic-track{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;gap:22px!important;align-items:center!important;overflow:visible!important}
  .topic-track>.topic-panel{display:flex!important;min-width:0!important}
  .topic-panel.monitor-left{transform:perspective(1000px) rotateY(8deg) scale(.91)!important;transform-origin:right center!important;z-index:1!important}
  .topic-panel.monitor-center{transform:translateY(-8px) scale(1.04)!important;z-index:3!important}
  .topic-panel.monitor-right{transform:perspective(1000px) rotateY(-8deg) scale(.91)!important;transform-origin:left center!important;z-index:1!important}
  .topic-panel.monitor-far-left,.topic-panel.monitor-far-right{display:none!important}
}
@media(max-width:900px){
  .topic-track{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:14px!important}
  .topic-track>.topic-panel:not(.monitor-left):not(.monitor-right):not(.monitor-center){display:none!important}
}


/* Align monitor stands directly beneath each screen */
@media(min-width:901px){
  .topic-panel{padding-bottom:34px!important}
  .topic-panel:before{
    left:calc(50% - 5px)!important;
    bottom:15px!important;
    width:10px!important;
    height:25px!important;
    z-index:0!important;
  }
  .topic-panel:after{
    left:26%!important;
    bottom:0!important;
    width:48%!important;
    height:18px!important;
    z-index:0!important;
  }
  .topic-art,.topic-label{position:relative;z-index:1}
}


/* Final monitor stand alignment: centre both the stem and base on each monitor */
@media(min-width:901px){
  .topic-panel:before{
    left:50%!important;
    transform:translateX(-50%)!important;
    bottom:15px!important;
    width:10px!important;
    height:25px!important;
  }
  .topic-panel:after{
    left:50%!important;
    transform:translateX(-50%)!important;
    bottom:0!important;
    width:104px!important;
    height:18px!important;
  }
}


/* Correct stand-to-screen spacing on desktop monitors */
@media(min-width:901px){
  .topic-panel{padding-bottom:12px!important}
  .topic-panel:before{
    left:50%!important;transform:translateX(-50%)!important;
    bottom:13px!important;width:10px!important;height:24px!important;
    z-index:2!important;
  }
  .topic-panel:after{
    left:50%!important;transform:translateX(-50%)!important;
    bottom:0!important;width:110px!important;height:16px!important;
    z-index:1!important;
  }
}
