/* Kew Website · refinement layer. One-page architecture preserved. */
:root {
  --cream: #f8f6f0;
  --paper: #fffefb;
  --evergreen: #0e4034;
  --ink: #19352d;
  --mint: #b8ebd2;
  --orange: #f27b46;
  --line: #dce5dc;
  --shadow: 0 28px 80px rgba(12,46,35,.10);
  --ease-out: cubic-bezier(.16,1,.3,1);
}
::selection { background: #cde8ca; color:#133b2d; }
:focus-visible { outline:3px solid #ec9f5b;outline-offset:4px; }
body { background:var(--cream);letter-spacing:-.007em; }
button, input, select, textarea { font:inherit; }
button:not(:disabled), a, summary { -webkit-tap-highlight-color:transparent; }
button:disabled { cursor:not-allowed; }
html { scroll-padding-top:90px; }
.reading-progress { position:fixed;top:0;left:0;right:0;height:3px;z-index:200;pointer-events:none;background:transparent; }
.reading-progress span { display:block;width:100%;height:100%;background:linear-gradient(90deg,#b2eabf 0%,#f7b071 74%,#ee7042);transform:scaleX(0);transform-origin:left;will-change:transform; }
.site-header { background:rgba(13,49,40,.965);backdrop-filter:blur(24px) saturate(140%);-webkit-backdrop-filter:blur(24px) saturate(140%);border-bottom:1px solid rgba(225,250,221,.14);box-shadow:0 10px 30px rgba(7,30,25,.12); }
.header-inner { height:78px; }
.brand { font-size:27px;letter-spacing:-1.4px; }
.brand-symbol { border-radius:12px;border-color:#c3e9c4;background:linear-gradient(140deg,#eaf6d3,#afe8d4);box-shadow:inset 0 1px 0 #fff8; }
.desktop-nav { gap:7px; }
.desktop-nav a { padding:13px 13px;border-radius:10px;transition:color .2s,background .2s;position:relative; }
.desktop-nav a::after { content:'';position:absolute;bottom:5px;left:14px;right:14px;height:2px;border-radius:4px;background:#aee6c4;transform:scaleX(0);transition:transform .3s var(--ease-out); }
.desktop-nav a:hover,.desktop-nav a[aria-current="location"] { background:#ffffff0d;color:#fff; }
.desktop-nav a[aria-current="location"]::after { transform:scaleX(1); }
.header-actions .button { box-shadow:0 5px 18px rgba(255,125,60,.15); }
.button { border-radius:11px;transition:transform .3s var(--ease-out),box-shadow .3s,background .3s; }
.button-orange { background:linear-gradient(135deg,#ff8748,#f46a39);box-shadow:0 9px 22px rgba(231,94,50,.18); }
.button:hover,.hands-btn:hover { transform:translateY(-2px);box-shadow:0 12px 25px rgba(31,61,45,.18); }
.button:active,.hands-btn:active,.cinema-icon-button:active { transform:translateY(1px) scale(.985); }
.hero { background:radial-gradient(ellipse 55% 80% at 85% 40%,#2c6151 0%,#194a3c 43%,transparent 78%),radial-gradient(ellipse 65% 65% at 6% 95%,#103629 0%,transparent 85%),#0b3128; }
.hero::before { content:'';position:absolute;top:0;right:0;width:54%;height:100%;background:radial-gradient(circle at 56% 35%,#d8e9b109,transparent 48%);pointer-events:none; }
.hero::after {content:'';position:absolute;inset:0;opacity:.13;pointer-events:none;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.63' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)' opacity='.15'/%3E%3C/svg%3E");mix-blend-mode:screen;}
.hero-layout { gap:23px;min-height:610px; }
.hero-copy { padding-bottom:15px; }
.hero h1 { max-width:760px;font-size:clamp(65px,6.3vw,103px);letter-spacing:-2.7px;line-height:1.015;margin:24px 0 30px;text-wrap:balance; }
.hero h1 em { color:#d6eab5; }
.hero-subline {font-size:clamp(19px,1.6vw,24px);line-height:1.42;max-width:565px;letter-spacing:-.025em; }
.hero-body { font-size:15px;line-height:1.85;color:#d0ded4;max-width:530px; }
.hero-proof { color:#c1d4c7;font-size:12px;line-height:1.7; }
.hero-actions { margin-top:30px; }
.hero-orbit-one { animation:slow-orbit 35s linear infinite; }
.hero-orbit-two { animation:slow-orbit 30s linear infinite reverse; }
@keyframes slow-orbit { to {transform:rotate(18deg)} }
.hero-preview { isolation:isolate; }
.hero-window { border-color:#d5e7d09a;box-shadow:0 32px 98px #041e195e,0 0 0 12px #d3efd20b;transform:perspective(1400px) rotateY(-6deg) rotateX(2deg);transition:transform .9s var(--ease-out),box-shadow .9s var(--ease-out); }
.hero-preview:hover .hero-window { transform:perspective(1400px) rotateY(-2.5deg) rotateX(.5deg) translateY(-7px);box-shadow:0 44px 105px #001a1379,0 0 0 12px #d3efd20b; }
.hero-float-card { animation:float-card 7s ease-in-out infinite; }
.hero-float-bottom { animation-delay:-3.5s; }
@keyframes float-card { 50% {transform:translateY(-8px)} }
.hero-open-demo { position:absolute;bottom:14px;left:26%;z-index:4;transform:translateX(-10%);display:flex;align-items:center;gap:13px;padding:12px 14px;border:1px solid #b9dfcf88;border-radius:16px;background:rgba(249,253,245,.96);color:#164635;box-shadow:0 16px 32px #001f175c;min-width:255px;max-width:320px;font-size:12px;font-weight:800;transition:box-shadow .2s,transform .3s var(--ease-out); }
.hero-open-demo:hover { transform:translate(-10%,-5px);box-shadow:0 24px 40px #001f176b; }
.hero-open-demo small { display:block;color:#799085;font-weight:500;font-size:10px;line-height:1.4;margin-top:3px; }
.hero-open-demo>span:last-child { margin-left:auto;color:#5b997c; }
.hero-open-icon { display:grid;place-items:center;width:36px;height:36px;flex-shrink:0;border-radius:12px;background:#17694e;color:#fff;font-size:12px;box-shadow:0 5px 14px #156b4b48; }
.hero-bottom { position:relative;z-index:2; }
.section { padding-block:112px; }
.editorial { letter-spacing:-1.9px;text-wrap:balance; }
.section-lead-grid { gap:5vw; }
.eyebrow { letter-spacing:1.6px; }
.why-kew { background:linear-gradient(180deg,#faf8f2,#f5f4ed); }
.contrast-grid { gap:18px; }
.contrast-card { background:#fffefa;border:1px solid #e0e5dd;border-radius:19px;padding:33px;min-height:342px;box-shadow:0 10px 28px #1b3d2110;transition:transform .5s var(--ease-out),box-shadow .5s var(--ease-out); }
.contrast-card:hover { transform:translateY(-6px);box-shadow:0 25px 46px #0d31211c; }
.contrast-card-kew { border-color:#66a58b;box-shadow:0 12px 40px #1d76592d; }
.contrast-card h3 { letter-spacing:-.8px; }
.demo-section { background:linear-gradient(160deg,#f2f1e9 0%,#eaf1e9 60%,#f5f2eb); }
.demo-intro { margin-bottom:38px; }
.demo-intro-side { background:#fffaf2dd;border:1px solid #e1e3d8;border-radius:18px;padding:24px;box-shadow:0 10px 27px rgba(14,50,34,.05); }
.demo-velocity { background:#f8faf3;border-radius:12px;padding:17px 13px;margin:17px 0; }
.cinema { border:1px solid #d8e4d6;border-radius:22px;box-shadow:0 33px 84px rgba(12,48,35,.18),0 3px 8px rgba(12,48,35,.05);overflow:hidden; }
.cinema-header { padding:16px 23px;min-height:74px;background:linear-gradient(112deg,#102f26,#1b5140); }
.cinema-heading { gap:15px; }
.cinema-brand { background:linear-gradient(140deg,#e6f2d5,#b0e4c7);width:41px;height:41px;border-radius:12px;box-shadow:0 3px 12px #001e125c; }
.cinema-heading b { font-size:12px;letter-spacing:1.5px; }
.cinema-heading small { margin-top:4px;display:block;font-size:11px;color:#c5ded0; }
.cinema-controls { gap:8px; }
.cinema-running {font-size:9px;font-weight:800;letter-spacing:1.15px;color:#c9e6d0;display:flex;align-items:center;gap:7px;margin-right:10px;white-space:nowrap;}
.cinema-running .pulse-dot { background:#b9e89c;box-shadow:0 0 0 4px #c9f2c319; }
.cinema-speed { border:1px solid #aec8b34b;background:#ffffff0a;color:#d4eedf;border-radius:9px;height:35px;min-width:42px;padding:0 8px;font-size:11px;font-weight:800;cursor:pointer;transition:background .2s; }
.cinema-speed:hover { background:#fff2; }
.cinema-icon-button,.cinema-play { border-radius:10px; }
.cinema-context {background:#1b4638;color:#d5e8db;border-top:1px solid #fff1;display:flex;justify-content:space-between;gap:12px;align-items:center;padding:9px 22px;min-height:36px;}
.context-path {display:flex;align-items:center;gap:9px;font-size:9px;letter-spacing:1.1px;font-weight:800;color:#9cbdae;}
.context-path b {color:#edf7e5;font-size:10px;font-weight:700;letter-spacing:0;}
.context-pip {width:7px;height:7px;flex-shrink:0;border-radius:50%;background:#f8a15e;box-shadow:0 0 0 4px #f8a15e22;}
.cinema-help {color:#9bbcaf;font-size:10px;white-space:nowrap;}
.scene-progress { scrollbar-width:none;background:#fafaf7; }
.scene-progress::-webkit-scrollbar { display:none; }
.scene-step {padding:15px 12px 16px;min-width:85px;border-color:#e9ece4;transition:background .3s,color .3s;}
.scene-step:hover { background:#eef5eb; }
.scene-step.is-active { background:linear-gradient(180deg,#e5f3e9,#f1f8ef); }
.scene-step .step-index { font-size:10px; }
.scene-step i { transition:background .3s; }
.cinema-viewport {height:550px;background:#f8faf7;}
.cinema-track {transition:transform 1100ms cubic-bezier(.22,1,.33,1);will-change:transform;}
.tour-scene {background:#fafbf8;}
.demo-app-sidebar {background:linear-gradient(180deg,#163e31,#0e3429);}
.demo-app-sidebar-navy {background:linear-gradient(180deg,#30465a,#253849);}
.demo-app-content {background:#fbfcf9;}
.demo-app-top {background:#fffffdf2;}
.scene-page { padding:29px 34px; }
.scene-page h3 { letter-spacing:-.95px; }
.scene-panel { border-radius:14px;box-shadow:0 4px 13px #184f2606; }
.cinema-caption { padding:22px 26px;min-height:114px;background:#fffefa; }
.cinema-caption h3 {font-size:27px;line-height:1.12;letter-spacing:-.65px;}
.cinema-caption p {font-size:12px;line-height:1.65;}
.cinema-evidence {background:#f5f9f2;display:flex;align-items:center;gap:20px;padding:12px 23px;border-top:1px solid #e1e9de;border-bottom:1px solid #e1e9de;}
.evidence-label {color:#7f9484;flex:0 0 auto;font-size:9px;font-weight:900;letter-spacing:1.5px;}
.evidence-events { display:flex;flex:1;gap:8px;flex-wrap:wrap;align-items:center; }
.evidence-event {font-size:10px;color:#859589;border:1px solid #dce5db;background:#f9faf6;border-radius:50px;padding:7px 10px;line-height:1.1;transition:all .45s var(--ease-out);white-space:nowrap;}
.evidence-event.is-on {background:#dff3e4;color:#14664b;border-color:#abd7b7;box-shadow:0 0 0 2px #e3f3e8;}
.evidence-event.is-complete:not(.is-on) {background:#f6faf4;color:#45836b;border-color:#cde6d1;}
.demo-cursor {filter:drop-shadow(0 5px 6px #10291c4d);}
.demo-cta,.hands-btn {transition:transform .23s var(--ease-out),background .2s,box-shadow .2s;}
.inline-success:not(.is-hidden),.hands-alert {animation:appear-from-below .45s var(--ease-out) both;}
@keyframes appear-from-below {from {opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
.interactive-section {background:linear-gradient(180deg,#fffefa,#f4f8f1);}
.hands-on-app {border:1px solid #d5e2d4;border-radius:22px;box-shadow:0 25px 78px rgba(15,59,43,.11);background:#fbfcf9;}
.hands-journey {padding:23px 25px 21px;background:#f1f6ee;border-bottom:1px solid #d9e6d8;display:flex;justify-content:space-between;gap:35px;align-items:center;}
.journey-copy {max-width:260px;flex:0 0 235px;}
.journey-copy span {font-size:9px;letter-spacing:1.25px;font-weight:900;color:#648775;display:block;margin-bottom:7px;}
.journey-copy b {font:400 19px/1.18 var(--serif);color:#194433;display:block;}
.journey-track {display:flex;gap:5px;flex:1;align-items:center;justify-content:flex-end;}
.journey-track>span {border:1px solid transparent;padding:10px 12px;color:#8ca198;background:#e7efe6;border-radius:10px;font-weight:800;font-size:9px;display:inline-flex;flex-direction:column;gap:4px;white-space:nowrap;min-width:78px;transition:all .25s;}
.journey-track>span b {font-size:10px;font-weight:800;}
.journey-track>span.is-complete {background:#e0f3e3;color:#26785a;}
.journey-track>span.is-complete:before {content:'✓';position:absolute;transform:translate(53px,-7px);font-size:12px;}
.journey-track>span.is-on {border-color:#a6cdb5;color:#165941;background:#ffffff;box-shadow:0 3px 12px #155a3119;}
.hands-top {background:linear-gradient(110deg,#143a2e,#215640);min-height:74px;height:auto;flex-wrap:wrap;padding-block:14px;}
.hands-actions {gap:8px;}
.hands-example-button {color:#193e2e;background:#cfebd9;border-color:#cfebd9;}
.hands-example-button:hover {background:#f0f8e9;}
.hands-sidebar {background:#f0f5ef;}
.hands-tab {border-radius:11px;margin-bottom:4px;min-height:43px;transition:background .2s,transform .2s;}
.hands-tab.is-active {background:linear-gradient(110deg,#116c51,#198365);box-shadow:0 6px 13px #1259392e;}
.hands-tab:hover:not(.is-active) {transform:translateX(3px);}
.hands-content {background:radial-gradient(circle at 100% 0%,#e5f1e819,transparent 45%),#fbfcf9;}
.hands-content h3 {letter-spacing:-.7px;}
.hands-card {border-radius:15px;box-shadow:0 8px 20px #113b2409;border-color:#dce8db;background:#fff;}
.hands-card h4 {letter-spacing:-.4px;}
.hands-field input,.hands-field select,.hands-field textarea,.hands-ask input {border-radius:10px;min-height:43px;transition:border-color .2s,box-shadow .2s;}
.hands-field input:focus,.hands-field select:focus,.hands-field textarea:focus,.hands-ask input:focus,.contact-form input:focus,.contact-form textarea:focus {border-color:#5aaf8f;box-shadow:0 0 0 4px #38a5791e;outline:none;}
.hands-btn,.hands-btn-secondary {border-radius:9px;min-height:40px;}
.hands-bottom {min-height:64px;background:#fffdfa;}
.core-section {background:#f4f1e9;}
.core-grid {gap:16px;}
.core-card {border-radius:18px;box-shadow:0 8px 24px #113e2b0d;min-height:279px;padding:25px;transition:transform .4s var(--ease-out),box-shadow .4s,border-color .4s;}
.core-card:hover {transform:translateY(-7px);box-shadow:0 22px 42px #113f2529;}
.core-card[aria-expanded="true"] {border-color:#398c6b;background:#f3faf2;box-shadow:0 14px 32px #115c2a21;}
.core-card img {width:65px;height:65px;margin-bottom:18px;}
.core-card h3 {font-size:29px;}
.core-detail {border-radius:17px;animation:appear-from-below .35s var(--ease-out) both;box-shadow:0 8px 24px #17442c16;}
.core-detail[hidden] {display:none;}
.platform-section {background:radial-gradient(circle at 92% 15%,#255d48,#154135 49%,#0c332a 100%);}
.platform-diagram {border-radius:19px;box-shadow:0 25px 65px #03281e4d;}
.solutions-section {background:#fffefb;}
.solution-grid {gap:18px;}
.solution-card {border-radius:19px;overflow:hidden;box-shadow:0 12px 32px #21402713;transition:transform .45s var(--ease-out),box-shadow .3s;}
.solution-card:hover {transform:translateY(-7px);box-shadow:0 22px 42px #21402722;}
.solution-art {overflow:hidden;}
.solution-art::after {content:'';position:absolute;width:200px;height:200px;border:1px solid #ffffff38;border-radius:50%;right:-60px;top:-66px;pointer-events:none;}
.outcomes-section {background:#e9f1e8;}
.outcome-grid>div {padding:20px 12px 20px 0;transition:transform .3s var(--ease-out);}
.outcome-grid>div:hover {transform:translateY(-5px);}
.faq-section {background:#fffefa;}
.faq-items details {padding:22px 0;}
.faq-items summary {font-size:16px;line-height:1.45;}
.faq-items summary:after {display:grid;place-items:center;min-width:30px;height:30px;border-radius:50%;background:#ecf4ed;font-size:19px;transition:transform .3s,background .3s;}
.faq-items details[open] summary:after {transform:rotate(180deg);background:#d9eddf;}
.faq-items details p {animation:appear-from-below .3s both;}
.contact-section {background:radial-gradient(circle at 10% 90%,#1c5941 0%,transparent 46%),#103b30;}
.contact-form {background:#194b3b;border-radius:19px;border-color:#b8e3c341;box-shadow:0 20px 50px #082c2155;padding:33px;}
.contact-form-heading {font-size:28px;}
.contact-form input,.contact-form textarea {border:1px solid #d3e7d3;min-height:44px;border-radius:10px;transition:box-shadow .25s,border-color .25s;}
.contact-form textarea {min-height:110px;}
.site-footer {background:#0b2e25;}
/* Gentle scroll staging: only enabled after JS attaches observer. */
.js-motion .motion-reveal {opacity:0;transform:translateY(24px);transition:opacity .85s var(--ease-out),transform .85s var(--ease-out);}
.js-motion .motion-reveal.is-revealed {opacity:1;transform:translateY(0);}
@media(max-width:1160px){
  .cinema-running {display:none;}
  .cinema-context {padding:8px 14px;}
  .journey-copy {flex-basis:190px;}
  .journey-track>span {min-width:65px;padding:9px;}
  .hero-open-demo {left:22%;}
}
@media(max-width:990px){
  .hero {padding-bottom:10px;}
  .hero h1 {font-size:clamp(58px,7.5vw,90px);}
  .hero-open-demo {left:34%;bottom:10px;}
  .hands-journey {display:block;}
  .journey-copy {max-width:100%;margin-bottom:18px;}
  .journey-track {justify-content:space-between;}
  .journey-track>span {flex:1;min-width:0;}
  .cinema-help {font-size:9px;}
}
@media(max-width:700px){
  html { scroll-padding-top:70px;}
  .header-inner {height:68px;}
  .hero {padding-top:48px;}
  .hero h1 {font-size:clamp(52px,11vw,72px);letter-spacing:-1.7px;}
  .hero-copy {padding-bottom:0;}
  .hero-actions {gap:10px;}
  .hero .button {font-size:12px;white-space:normal;text-align:center;min-height:54px;}
  .hero-preview {margin-top:0;padding-bottom:66px;}
  .hero-open-demo {left:50%;bottom:7px;transform:translateX(-50%);min-width:min(290px,90%);}
  .hero-open-demo:hover {transform:translate(-50%,-3px);}
  .hero-float-card {display:none;}
  .hero-bottom {row-gap:11px;}
  .section {padding-block:76px;}
  .contrast-card {padding:27px;min-height:unset;}
  .demo-section {padding-block:77px;}
  .demo-intro-side {padding:18px;}
  .cinema {border-radius:15px;}
  .cinema-header {padding:12px 13px;min-height:65px;}
  .cinema-brand {width:34px;height:34px;font-size:20px;}
  .cinema-heading b {font-size:10px;letter-spacing:.8px;}
  .cinema-heading small {font-size:9px;}
  .cinema-controls {gap:4px;}
  .cinema-speed {font-size:10px;min-width:34px;height:32px;}
  .cinema-icon-button {width:33px;height:33px;}
  .cinema-play {min-width:62px;padding:0 8px;font-size:10px;}
  .cinema-context {padding:9px 13px;}
  .context-path {font-size:8px;gap:6px;}
  .context-path b {font-size:9px;}
  .cinema-help {display:none;}
  .scene-step {min-width:77px;padding:12px 9px;}
  .cinema-viewport {height:490px;}
  .scene-page {padding:20px 17px;}
  .cinema-evidence {padding:12px 13px;display:block;}
  .evidence-label {margin-bottom:8px;display:block;}
  .evidence-events {gap:6px;}
  .evidence-event {font-size:9px;padding:6px 9px;}
  .cinema-caption {padding:19px 16px;}
  .cinema-caption h3 {font-size:22px;}
  .hands-journey {padding:19px 15px;}
  .journey-track {gap:4px;overflow-x:auto;padding-bottom:3px;}
  .journey-track>span {flex:0 0 81px;font-size:9px;}
  .hands-top {padding:13px 14px;gap:10px;}
  .hands-actions {width:100%;justify-content:space-between;}
  .hands-status {font-size:8px;}
  .hands-actions .text-button {padding:8px;font-size:10px;}
  .hands-content {padding:23px 16px;}
  .hands-content h3 {font-size:32px;}
  .hands-card {padding:18px;}
  .core-card {min-height:208px;padding:20px;}
  .core-card img {width:55px;height:55px;margin-bottom:12px;}
  .core-card h3 {font-size:25px;}
  .core-detail {padding:25px 36px 22px 20px;}
  .contact-form {padding:22px;}
  .faq-items summary {font-size:15px;}
}
@media(max-width:400px){
  .cinema-heading small {display:none;}
  .cinema-controls .cinema-icon-button:first-of-type {display:none;}
  .hero-open-demo {font-size:11px;}
  .journey-track>span {flex-basis:75px;}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after {scroll-behavior:auto!important;animation:none!important;transition-duration:.01ms!important;}
  .js-motion .motion-reveal {opacity:1!important;transform:none!important;}
}

/* Final alignment of hero micro-cards and the demo play invitation. */
@media(min-width:701px){.hero-float-bottom{left:-30px;bottom:89px;}.hero-open-demo{bottom:7px;}}
/* The cinematic slide track intentionally extends beyond its viewport; clip page-level
   overflow while preserving touch scrolling inside the carousel and workspace tabs. */
html,body {max-width:100%;overflow-x:clip;}
/* Anchor completion checks inside each step rather than the page viewport. */
.journey-track>span{position:relative;}
.journey-track>span.is-complete::before{right:7px;top:6px;transform:none;}