/* Cakap / Connected landscapes — original editorial visual system. */
:root{--paper:#f5f2e8;--ink:#193f34;--muted:#65796e;--line:#d9ded0;--lime:#e0ecc3;--accent:#bb623c}
body{background-color:var(--paper);background-image:url("/assets/grain.png")}
h1,h2{font-family:Georgia,'Times New Roman',serif;font-weight:400;letter-spacing:-.055em;line-height:1.06}
h2 em{font-weight:400;color:#7d926c}
.site-nav{border-bottom:1px solid #c7d2c0;background:var(--paper)}
.site-nav .nav-contact{border-radius:3px}
.hero{padding-block:90px 95px;gap:35px}
.hero h1{font-size:clamp(56px,5.6vw,86px);font-weight:400}
.hero h1 em{color:var(--accent)}
.hero .lead{font-size:16px;max-width:470px}
.hero-visual{isolation:isolate;padding-block:60px;--drift:0px}
.hero-visual::before{content:"";position:absolute;inset:-45px -55px;background:url('/assets/network-orbit.webp') center/contain no-repeat;transform:translateY(calc(var(--drift) * -.5)) rotate(var(--orbit-turn,0deg));z-index:-1;pointer-events:none}
.hero-visual .orb{inset:4% 7%;border:1px solid #99ac884a;background:radial-gradient(ellipse,#e5eace 0,#e5eace66 55%,transparent 72%);border-radius:50%;transform:translateY(calc(var(--drift) * .3))}
.hero-visual .mini-chat{transform:translateY(calc(var(--drift) * -.35)) rotate(-3deg);box-shadow:10px 30px 65px #173e3524}
.hero-visual .float-card{transform:translateY(calc(var(--drift) * .45));border-radius:3px;border-color:#9cac8766}
.hero-visual .visual-label{letter-spacing:2px}
.eyebrow{font-size:10px;letter-spacing:2.1px}
.button{border-radius:3px;transition:transform .25s,background .25s,box-shadow .25s}
.button:hover{box-shadow:0 6px 16px #163e351c}
.context{border-block-color:#cad3c0}
.section{padding-block:100px}
.section h2,.demo-section h2{font-size:clamp(36px,4vw,56px)}
.features article,.card-box,.pricing article{border-radius:4px;background:#fcfbf5}
.features article{transition:transform .35s,border-color .35s,box-shadow .35s}
.features article:hover{transform:translateY(-7px);border-color:#8da27a;box-shadow:0 20px 30px #193f340a}
.features h3{font-family:Georgia,serif;font-weight:400;font-size:28px}
.demo-section{background:#e7ecdd;border-block:1px solid #ced8c3;padding-block:100px}
.demo-preview{box-shadow:0 30px 70px #193f3414}
.pricing .featured{background:#e8efdc;border-color:#879d6f}
.pricing h3{font-family:Georgia,serif;font-size:26px;font-weight:400}
.pricing .price{letter-spacing:-.05em}
.integration-tags span{border-radius:3px}
.cta{border-radius:4px;background:#e5ebd8;border:1px solid #cdd8bb;margin-bottom:100px}
.sub-hero h1{font-size:clamp(36px,4.8vw,64px)}
.prose h2{font-size:30px}.prose h3{font-family:Georgia,serif;font-weight:400;font-size:25px}
.network-story{position:relative;isolation:isolate;overflow:hidden;min-height:840px;border-block:1px solid #cad3c0;background:#e9eede;margin-block:40px 0}
.story-content{position:relative;z-index:4;text-align:center;padding-top:90px;max-width:900px}
.story-content .eyebrow{justify-content:center}
.story-content h2{font-size:clamp(38px,4.7vw,68px)}
.story-content h2 em{color:#758967}
.story-content p{font-size:15px;color:var(--muted);max-width:540px;margin:24px auto;line-height:1.8}
.story-content .text-link{font-size:13px;border-bottom:1px solid #a1b58b;padding-bottom:8px}
.landscape{position:absolute;inset:auto -3% 0;height:620px;pointer-events:none;overflow:hidden;z-index:1}
.landscape-layer{position:absolute;width:106%;height:calc(100% + 180px);left:-3%;bottom:-210px;object-fit:cover;object-position:bottom center;max-width:none}
.landscape-sun{position:absolute;width:130px;height:130px;top:80px;left:67%;border-radius:50%;background:#e2c28b;box-shadow:0 0 0 18px #e2c28b18,0 0 0 36px #e2c28b0d;transform:none}
.story-label{position:absolute;z-index:5;bottom:30px;left:8%;right:8%;display:flex;justify-content:space-between;font-size:9px;letter-spacing:2px;color:#e6ecd5}
.footer-scene{position:relative;isolation:isolate;overflow:hidden;background:#143c30;color:#eeeedd;padding-top:72px;min-height:980px}
.footer-invitation{display:flex;justify-content:space-between;align-items:center;gap:32px;border-bottom:1px solid #f3f3dd26;padding-bottom:52px;position:relative;z-index:5}
.footer-invitation h2{font-size:clamp(36px,4vw,58px)}
.footer-invitation h2 em{color:#abc49d}
.footer-invitation .eyebrow{color:#b1c2a8}
.footer-invitation .button{color:#f2eedf;border-color:#97b190;white-space:nowrap}
.footer-invitation .button:hover{background:#2e5744}
.site-footer{position:relative;z-index:5;padding-block:55px 45px;border:0;grid-template-columns:1.65fr 1fr 1fr 1fr}
.site-footer .brand img{filter:brightness(0) invert(1);opacity:.94;width:145px}
.site-footer h2{font-family:DM,Arial,sans-serif;font-size:10px;font-weight:400;text-transform:uppercase;letter-spacing:1.9px;color:#a9bf9e;margin-bottom:10px}
.site-footer a:not(.brand){font-size:13px;color:#edeee0}
.site-footer p,.site-footer span{color:#b2c4a9;font-size:12px;max-width:230px}
.site-footer .footer-brand{gap:18px}
.site-footer a:hover{color:#d9eca4}
.footer-colophon{position:relative;z-index:5;display:flex;justify-content:space-between;gap:20px;border-top:1px solid #edf1dd26;padding-top:24px;color:#b4c7a9;font-size:10px}
.footer-scene .landscape{height:480px;opacity:.85}
.footer-scene .landscape-sun{display:none}
.landscape-wordmark{position:absolute;z-index:3;bottom:-36px;left:0;right:0;text-align:center;font-family:Georgia,serif;font-size:clamp(145px,25vw,380px);line-height:1;letter-spacing:-.085em;color:#e8ecce;opacity:.9;pointer-events:none}
[data-reveal]{transition:opacity .8s ease,translate .8s cubic-bezier(.2,.7,.2,1)}
[data-reveal].reveal-pending{opacity:0;translate:0 28px}
.scroll-progress{position:fixed;left:0;top:0;height:3px;width:100%;transform:scaleX(0);transform-origin:left;background:var(--accent);z-index:100;pointer-events:none}
@media(min-width:1600px){.network-story .landscape{height:720px}.network-story{min-height:950px}}
@media(max-width:980px){.hero{padding-block:55px 70px}.hero h1{font-size:clamp(52px,7.5vw,76px)}.hero-visual::before{inset:-20px -5px}.section{padding-block:70px}.footer-invitation{align-items:start;flex-direction:column}.site-footer{grid-template-columns:repeat(3,1fr)}.site-footer .footer-brand{grid-column:1/-1}.network-story{min-height:790px}.story-content{padding-top:70px}.footer-scene{min-height:1160px}.footer-scene .landscape{height:450px}}
@media(max-width:600px){.hero h1{font-size:57px}.hero{gap:25px;padding-block:50px}.hero-visual{padding-block:35px;overflow:clip}.hero-visual::before{inset:-10px -20px}.network-story{min-height:750px;margin-top:30px}.story-content{padding-top:60px}.story-content h2{font-size:39px}.story-content p{font-size:13px}.landscape{height:420px;inset-inline:-40%}.landscape-sun{width:85px;height:85px;top:32px;left:66%}.story-label{font-size:7px;letter-spacing:1px;left:6%;right:6%}.footer-scene{padding-top:50px;min-height:1220px}.footer-invitation h2{font-size:38px}.site-footer{grid-template-columns:1fr 1fr;gap:35px 24px;padding-block:40px}.footer-colophon{flex-direction:column;gap:8px;font-size:9px}.footer-scene .landscape{height:350px}.landscape-wordmark{bottom:0;font-size:31vw}.cta{margin-bottom:60px}.prose h2{font-size:25px}.hero-visual .mini-chat{transform:rotate(-2deg)}.hero-visual .orb,.hero-visual .float-card,.hero-visual::before{transform:none}}
@media(prefers-reduced-motion:reduce){[data-reveal]{opacity:1!important;translate:none!important;transition:none!important}.landscape-layer,.landscape-sun,.hero-visual::before,.hero-visual .orb,.hero-visual .mini-chat,.hero-visual .float-card{transform:none!important}.scroll-progress{display:none}.features article:hover{transform:none}}
/* Keep the etched landscape below the copy, including smaller viewports. */
.network-story{min-height:900px}.network-story .landscape{height:500px}
.footer-scene{min-height:1060px}.footer-scene .landscape{height:400px}
.site-footer .brand img{filter:none}
@media(min-width:1600px){.network-story{min-height:970px}.network-story .landscape{height:560px}}
@media(max-width:980px){.network-story{min-height:860px}.network-story .landscape{height:430px}.footer-scene{min-height:1200px}.footer-scene .landscape{height:360px}}
@media(max-width:600px){.network-story{min-height:840px}.network-story .landscape{height:360px}.footer-scene{min-height:1280px}.footer-scene .landscape{height:300px}}
.landscape-layer{object-fit:fill}

/* Raster art is composited only while visible. No SVG filters on scroll. */
.network-story,.footer-scene{background-image:url("/assets/grain.png")}
.landscape-layer{object-fit:fill;transform:translate3d(0,0,0)}
html:not(.scene-motion) .landscape-layer{transform:none!important;will-change:auto!important}
@media(prefers-reduced-motion:reduce){.landscape-layer{transform:none!important;will-change:auto!important}}
/* GSAP owns reveal transforms; avoid running a CSS transition on top of a tween. */
html.gsap-motion [data-reveal]{transition:none;translate:none}
/* Switzer obtained from Fontshare and self-hosted for Cakap; see assets/fonts/switzer/FFL.txt. */
@font-face{font-family:Switzer;src:url('/assets/fonts/switzer/Switzer-Variable.woff2') format('woff2');font-weight:100 900;font-style:normal;font-display:swap}
body{font-family:Switzer,DM,Arial,sans-serif}
.site-footer h2{font-family:Switzer,DM,Arial,sans-serif}
/* Floating sales contact: a small compositor pulse, no perpetual page effects. */
.cakap-whatsapp{position:fixed;right:max(24px,calc(env(safe-area-inset-right) + 16px));bottom:max(24px,calc(env(safe-area-inset-bottom) + 16px));z-index:60;display:flex;align-items:center;gap:12px;background:#fcfcf4;color:#193f34;border:1px solid #d6dfcc;border-radius:40px;padding:7px 19px 7px 7px;box-shadow:0 5px 25px #123b342b;text-decoration:none;animation:wa-arrive .6s ease-out both}
.cakap-whatsapp-icon{position:relative;display:grid;place-items:center;background:#276449;color:#fff;width:46px;height:46px;border-radius:50%;flex-shrink:0}
.cakap-whatsapp-icon::before{content:"";position:absolute;inset:-3px;border:1px solid #4d9467;border-radius:50%;animation:wa-pulse 2.8s ease-out 4;pointer-events:none}
.cakap-whatsapp-copy{display:flex;flex-direction:column;gap:3px}.cakap-whatsapp-copy small{font-size:7px;letter-spacing:1.4px;color:#687d63}.cakap-whatsapp-copy strong{font-size:11px;font-weight:600}.cakap-whatsapp-copy strong span{margin-left:8px}
.cakap-whatsapp:hover .cakap-whatsapp-icon{background:#1b533b}.cakap-whatsapp:hover .cakap-whatsapp-icon::before{animation:wa-pulse 1.8s ease-out infinite}
.cakap-whatsapp:focus-visible{outline:3px solid #b56b3f;outline-offset:4px}
.cakap-whatsapp.is-suspended,.cakap-whatsapp.is-suspended .cakap-whatsapp-icon::before{animation-play-state:paused}
@keyframes wa-pulse{0%{transform:scale(1);opacity:.65}65%,100%{transform:scale(1.45);opacity:0}}
@keyframes wa-arrive{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:700px){.cakap-whatsapp{right:max(18px,calc(env(safe-area-inset-right) + 12px));bottom:max(18px,calc(env(safe-area-inset-bottom) + 12px));padding:4px;border-radius:50%}.cakap-whatsapp-icon{width:48px;height:48px}.cakap-whatsapp-copy{display:none}}
@media(prefers-reduced-motion:reduce){.cakap-whatsapp,.cakap-whatsapp .cakap-whatsapp-icon::before{animation:none!important}}
/* Soft navigation panels and drawn icons. Native scrolling remains intact. */
.menu-toggle{background:#fafaf0;border-color:#cdd8c3;border-radius:12px;padding:12px 15px;font-size:13px;min-height:46px;transition:background .2s,border-color .2s}
.menu-toggle:hover{background:#eaf0df;border-color:#a9bf99}
.menu-toggle-icon{display:block;position:relative;width:20px;height:16px}
.menu-toggle-icon i{position:absolute;left:1px;width:18px;height:1.5px;border-radius:2px;background:currentColor;transition:transform .26s cubic-bezier(.22,.75,.2,1);top:4px}
.menu-toggle-icon i:last-child{top:11px;width:13px;left:6px}
.menu-open .menu-toggle-icon i:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-open .menu-toggle-icon i:last-child{width:18px;left:1px;transform:translateY(-3.5px) rotate(-45deg)}
.solutions-menu summary{gap:7px}.solutions-chevron{transition:transform .26s cubic-bezier(.22,.75,.2,1);transform-origin:center;flex-shrink:0}
.solutions-menu[open] summary span{transform:none}
.solutions-menu.is-expanded .solutions-chevron,.solutions-menu:not(.solutions-ready)[open] .solutions-chevron{transform:rotate(180deg)}
.solutions-panel{position:absolute;top:calc(100% + 7px);left:-20px;width:310px;transform-origin:top left}
.solutions-panel .solutions-links{position:static;display:grid;width:100%;padding:8px;background:#fcfcf5;border:1px solid #d3ddc9;border-radius:15px;box-shadow:0 18px 40px #173e351a;margin:0}
.solutions-links a{display:flex;gap:12px;align-items:center;padding:13px 12px;border-radius:10px;transition:background .2s,color .2s}
.solutions-links a:hover,.solutions-links a:focus-visible{background:#eaf0df;color:#214c39}
.solution-icon{display:grid;place-items:center;flex-shrink:0;width:39px;height:39px;border-radius:10px;background:#e7eddc;color:#4b6d43}
.solution-icon svg{stroke:currentColor;stroke-width:1.4;stroke-linecap:round;stroke-linejoin:round}
.solution-copy{display:flex;flex-direction:column;gap:5px}.solution-copy strong{font-size:12px;font-weight:600}.solution-copy small{font-size:9px;color:#5b7052;line-height:1.4}
html{scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:#718b62 #ecefe4}
*{scrollbar-width:thin;scrollbar-color:#718b62 #ecefe4}
@supports selector(::-webkit-scrollbar){html,*{scrollbar-width:auto;scrollbar-color:auto}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:#ecefe4}::-webkit-scrollbar-thumb{background:#718b62;border:2px solid #ecefe4;border-radius:12px}::-webkit-scrollbar-thumb:hover{background:#466741}::-webkit-scrollbar-corner{background:#ecefe4}.site-nav nav::-webkit-scrollbar{width:7px}}
@media(max-width:980px){
 .site-nav{flex-wrap:nowrap}
 .site-nav nav{position:absolute;top:calc(100% - 1px);left:0;right:0;width:100%;margin:0;padding:12px;max-height:calc(100svh - 110px);overflow:auto;overscroll-behavior:contain;background:#fcfcf7;border:1px solid #d0dcc5;border-radius:16px;box-shadow:0 20px 45px #183e3521;transform-origin:top center}
 .site-nav.menu-ready nav[data-state]:not([data-state="closed"]){display:flex}
 .site-nav.menu-ready nav[data-state="closed"]{display:none}
 .site-nav nav>a:not(.button),.solutions-menu summary{padding:13px 12px;border-radius:9px;min-height:45px}
 .site-nav nav>a:not(.button):hover,.solutions-menu summary:hover{background:#edf2e5}
 .site-nav nav>a[aria-current]{background:#e8eedc;box-shadow:none}
 .solutions-menu summary{justify-content:space-between}
 .solutions-panel{position:static;width:100%;overflow:hidden;transform-origin:top center}
 .solutions-panel .solutions-links{box-shadow:none;background:#f2f5eb;border-radius:12px;margin:0}
 .site-nav .nav-contact{margin:10px 0 0;border-radius:10px;min-height:47px}
 .site-nav:not(.menu-ready){flex-wrap:wrap}.site-nav:not(.menu-ready) nav{position:static;max-height:none;box-shadow:none;border:0}
}
@media(prefers-reduced-motion:reduce){.menu-toggle,.menu-toggle-icon i,.solutions-chevron,.solutions-links a{transition:none}}
@media(forced-colors:active){html,*{scrollbar-color:auto}.solution-icon{border:1px solid ButtonText}}
/* Contact panel uses dark ink on sage; all copy meets normal-text contrast. */
.cta{color:#193f34}
.cta h2{color:#193f34}
.cta .eyebrow{color:#47643a}
.cta>p,.cta p.contact-note{color:#435b46}
.cta .button{background:#193f34;color:#fffdf3;border:1px solid #193f34}
.cta .button:hover{background:#28533e;color:#fffdf3;border-color:#28533e}
