/* ============================================================
   FILLR GLOBAL CSS - START
   Shared styling for all secondary pages begins below.
============================================================ */

:root {
  color-scheme: dark;
  --ink:#050706;
  --ink-2:#0a0c09;
  --panel:#11140f;
  --panel-2:#171a14;
  --panel-3:#1c2018;
  --paper:#0d100c;
  --paper-2:#151811;
  --paper-ink:#f3f4ed;
  --bone:#f4f5ef;
  --muted:#999d94;
  --paper-muted:#94988f;
  --line:rgba(237,239,224,.12);
  --line-strong:rgba(237,239,224,.22);
  --amber:#d5b15f;
  --mint:#b6cc6b;
  --coral:#c77859;
  --blue:#7694c5;
  --accent:var(--amber);
  --accent-rgb:213,177,95;
  --accent-2:var(--mint);
  --accent-2-rgb:182,204,107;
  --shadow:0 34px 100px -44px rgba(0,0,0,.82);
  --r-xl:30px;
  --r-lg:22px;
  --r-md:15px;
  --r-sm:10px;
  --max:1180px;
  --ease:cubic-bezier(.2,.85,.25,1);
}

body.page-consumer { --accent:var(--mint); --accent-rgb:182,204,107; --accent-2:var(--amber); --accent-2-rgb:213,177,95; }
body.page-business { --accent:var(--amber); --accent-rgb:213,177,95; --accent-2:var(--coral); --accent-2-rgb:255,112,91; }
body.page-marketplace { --accent:var(--coral); --accent-rgb:199,120,89; --accent-2:var(--amber); --accent-2-rgb:213,177,95; }
body.page-insurance { --accent:var(--blue); --accent-rgb:113,167,255; --accent-2:var(--mint); --accent-2-rgb:182,204,107; }
body.page-scheduling { --accent:var(--amber); --accent-rgb:213,177,95; --accent-2:var(--mint); --accent-2-rgb:182,204,107; }
body.page-company { --accent:#95a985; --accent-rgb:149,169,133; --accent-2:var(--amber); --accent-2-rgb:213,177,95; }

*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:120px}
body{
  margin:0;
  min-width:320px;
  overflow-x:hidden;
  background:var(--ink);
  color:var(--bone);
  font-family:"DM Sans",system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
}
body::before{
  content:"";
  position:fixed;
  inset:0;
  z-index:-3;
  pointer-events:none;
  background:
    radial-gradient(circle at 9% 7%,rgba(var(--accent-rgb),.14),transparent 31%),
    radial-gradient(circle at 93% 42%,rgba(var(--accent-2-rgb),.09),transparent 29%),
    radial-gradient(circle at 38% 100%,rgba(199,120,89,.08),transparent 27%),
    var(--ink);
}
body::after{
  content:"";
  position:fixed;
  inset:0;
  z-index:-2;
  pointer-events:none;
  opacity:.035;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 140 140' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.52'/%3E%3C/svg%3E");
}
a{color:inherit;text-decoration:none}
button,input{font:inherit}
button{color:inherit}
img,svg{display:block;max-width:100%}
h1,h2,h3,h4,h5,p{margin:0}
h1,h2,h3,h4{font-family:"Bricolage Grotesque",system-ui,sans-serif}
ul{list-style:none;padding:0;margin:0}
::selection{background:var(--accent);color:#201506}
.wrap{width:min(calc(100% - 48px),var(--max));margin-inline:auto}
.mono{font-family:"JetBrains Mono",ui-monospace,monospace}

.bg{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden}
.blob{position:absolute;border-radius:50%;filter:blur(108px);will-change:transform,opacity}
.blob.a{width:580px;height:580px;left:-180px;top:-160px;background:var(--accent);opacity:.13;animation:blobA 38s ease-in-out infinite}
.blob.b{width:620px;height:620px;right:-230px;top:35%;background:var(--accent-2);opacity:.08;animation:blobB 44s ease-in-out infinite}
.blob.c{width:470px;height:470px;left:34%;bottom:-210px;background:var(--coral);opacity:.08;animation:blobC 40s ease-in-out infinite}
.bg-glow{position:absolute;width:560px;height:560px;border-radius:50%;filter:blur(130px);opacity:0;background:var(--accent);will-change:transform,opacity,background-color;transition:opacity .6s ease}
@keyframes blobA{50%{transform:translate(70px,45px) scale(1.08)}}
@keyframes blobB{50%{transform:translate(-54px,50px) scale(.94)}}
@keyframes blobC{50%{transform:translate(40px,-58px) scale(1.06)}}

/* The default system cursor remains visible; only the ambient background glow tracks pointer movement. */

.promo{position:relative;z-index:80;padding:10px 20px;background:var(--amber);color:#291c06;text-align:center;font-size:.85rem;font-weight:700}
.promo a{text-decoration:underline;text-underline-offset:3px}
.pulse-dot{display:inline-block;width:6px;height:6px;margin:0 8px;border-radius:50%;background:currentColor;vertical-align:middle;animation:pulse 1.5s infinite}
@keyframes pulse{50%{opacity:.26}}

.nav{position:sticky;top:0;z-index:70;border-bottom:1px solid transparent;background:rgba(5,7,6,.76);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);transition:background .25s,border-color .25s,box-shadow .25s}
.nav.scrolled{border-color:var(--line);background:rgba(5,7,6,.94);box-shadow:0 16px 40px -34px rgba(0,0,0,.75)}
.nav-inner{min-height:74px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.logo{display:inline-flex;align-items:center;gap:10px;font:800 1.45rem/1 "Bricolage Grotesque",sans-serif;letter-spacing:-.03em}
.brand-logo{display:block;width:auto;height:36px;flex:0 0 auto;object-fit:contain;filter:drop-shadow(0 8px 14px rgba(0,0,0,.28))}
.footer .brand-logo{height:42px}
.nav-links{display:flex;align-items:center;gap:28px;color:var(--muted);font-size:.91rem;font-weight:600}
.nav-links a{position:relative;padding:28px 0;transition:color .2s}
.nav-links a::after{content:"";position:absolute;left:0;right:0;bottom:18px;height:2px;border-radius:2px;background:var(--accent);transform:scaleX(0);transform-origin:center;transition:transform .25s var(--ease)}
.nav-links a:hover,.nav-links a.active{color:var(--bone)}
.nav-links a.active::after,.nav-links a:hover::after{transform:scaleX(1)}
.nav-actions{display:flex;align-items:center;gap:14px}
.signin{color:var(--muted);font-size:.91rem;font-weight:700;transition:color .2s}
.signin:hover{color:var(--bone)}
.menu-toggle{display:none;width:42px;height:42px;border:1px solid var(--line);border-radius:50%;background:rgba(247,241,233,.02);font-size:0}
.menu-toggle::before,.menu-toggle::after{content:"";display:block;width:17px;height:2px;margin:5px auto;border-radius:2px;background:var(--bone);transition:transform .25s var(--ease)}
.nav.open .menu-toggle::before{transform:translateY(3.5px) rotate(45deg)}
.nav.open .menu-toggle::after{transform:translateY(-3.5px) rotate(-45deg)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:48px;padding:12px 22px;border:1px solid transparent;border-radius:999px;font-weight:700;white-space:nowrap;transition:transform .25s var(--ease),background .25s,border-color .25s,color .25s,box-shadow .25s}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0) scale(.98)}
.btn:focus-visible,.menu-toggle:focus-visible,.tab:focus-visible{outline:3px solid rgba(var(--accent-rgb),.45);outline-offset:3px}
.btn--primary{background:var(--amber);color:#281a04;box-shadow:0 16px 34px -24px rgba(240,168,48,.9)}
.btn--primary:hover{background:#f8bb54;box-shadow:0 18px 38px -22px rgba(240,168,48,.85)}
.btn--ghost{border-color:rgba(247,241,233,.24);background:rgba(247,241,233,.02)}
.btn--ghost:hover{border-color:rgba(247,241,233,.64);background:rgba(247,241,233,.07)}
.btn--dark{background:var(--ink);color:var(--bone);border-color:rgba(237,239,224,.16)}
.btn--small{min-height:38px;padding:8px 15px;font-size:.85rem}
.actions{display:flex;align-items:center;flex-wrap:wrap;gap:13px;margin-top:30px}

.subhero{position:relative;overflow:clip;padding:78px 0 68px}
.subhero::before,.subhero::after{content:"";position:absolute;border-radius:50%;pointer-events:none}
.subhero::before{width:660px;height:660px;top:-350px;right:-180px;background:radial-gradient(circle,rgba(var(--accent-rgb),.26),transparent 67%)}
.subhero::after{width:530px;height:530px;bottom:-340px;left:-210px;background:radial-gradient(circle,rgba(var(--accent-2-rgb),.14),transparent 67%)}
.subhero-grid{position:relative;display:grid;grid-template-columns:minmax(0,1.04fr) minmax(400px,.96fr);gap:62px;align-items:center}
.breadcrumbs{display:flex;align-items:center;gap:8px;color:var(--muted);font-size:.82rem}
.breadcrumbs a:hover{color:var(--bone)}
.hero-tag{display:inline-flex;align-items:center;gap:6px;padding:7px 13px;border:1px solid rgba(var(--accent-rgb),.38);border-radius:999px;background:rgba(var(--accent-rgb),.09);color:var(--accent);font:700 11px/1 "JetBrains Mono",monospace;letter-spacing:.11em;text-transform:uppercase}
.hero-tag .pulse-dot{margin:0 2px 0 0}
.subhero h1{max-width:700px;margin-top:23px;font-size:clamp(2.7rem,5vw,4.15rem);line-height:1.01;letter-spacing:-.045em}
.subhero h1 em{color:var(--accent)!important}
.subhero .reveal>p{max-width:590px;margin-top:23px;color:var(--muted);font-size:1.12rem;line-height:1.67}

.panel,.phone,.dashboard,.calendar{position:relative;border:1px solid var(--line);background:linear-gradient(145deg,rgba(24,28,21,.98),rgba(11,13,10,.98));box-shadow:var(--shadow)}
.panel::before,.phone::before,.dashboard::before,.calendar::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;background:linear-gradient(120deg,transparent 18%,rgba(255,255,255,.035),transparent 62%)}
.panel{overflow:hidden;padding:20px;border-radius:var(--r-xl)}
.panel-head{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:5px 7px 16px;border-bottom:1px solid var(--line)}
.panel-title{color:var(--muted);font:700 11px/1.2 "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.live{display:flex;align-items:center;gap:7px;color:var(--mint);font:700 11px/1 "JetBrains Mono",monospace}
.live i{width:6px;height:6px;border-radius:50%;background:var(--mint);box-shadow:0 0 0 5px rgba(70,216,160,.1);animation:pulse 1.3s infinite}
.activity{position:relative;z-index:1;display:grid;grid-template-columns:42px minmax(0,1fr) auto;align-items:center;gap:13px;padding:15px 6px;border-bottom:1px dashed var(--line)}
.activity:last-child{border-bottom:0}
.activity-icon{width:38px;height:38px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.28);border-radius:11px;background:rgba(var(--accent-rgb),.09);color:var(--accent);font:700 14px/1 "JetBrains Mono",monospace}
.activity h4{font-size:.92rem;letter-spacing:-.01em}
.activity p{margin-top:4px!important;color:var(--muted)!important;font-size:.75rem!important;line-height:1.4!important}
.tag{display:inline-flex;align-items:center;justify-content:center;padding:5px 9px;border:1px solid currentColor;border-radius:999px;font:700 10px/1 "JetBrains Mono",monospace;letter-spacing:.03em;white-space:nowrap}
.tag.green{color:var(--mint);background:rgba(70,216,160,.09)}
.tag.amber{color:var(--amber);background:rgba(240,168,48,.09)}
.tag.coral{color:var(--coral);background:rgba(199,120,89,.09)}
.tag.blue{color:var(--blue);background:rgba(113,167,255,.09)}

.ticker{overflow:hidden;border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:rgba(10,12,9,.84);padding:14px 0}
.ticker-track{display:flex;width:max-content;animation:ticker 34s linear infinite}
.ticker:hover .ticker-track{animation-play-state:paused}
.ticker-item{padding:0 28px;border-right:1px solid var(--line);color:var(--muted);font-size:.84rem;white-space:nowrap}
.ticker-item b{color:var(--bone)}
@keyframes ticker{to{transform:translateX(-50%)}}


.section{position:relative;padding:108px 0}
.section::before{content:"";position:absolute;top:0;left:50%;width:min(calc(100% - 48px),var(--max));height:1px;transform:translateX(-50%);background:linear-gradient(90deg,transparent,var(--line),transparent);opacity:.65}
.section:first-of-type::before{display:none}
.paper{color:var(--paper-ink);background:
  radial-gradient(circle at 15% 12%,rgba(var(--accent-rgb),.08),transparent 28%),
  radial-gradient(circle at 88% 82%,rgba(var(--accent-2-rgb),.07),transparent 28%),
  radial-gradient(rgba(34,26,41,.065) 1px,transparent 1.5px),
  var(--paper);background-size:auto,auto,24px 24px}
.paper::before{background:linear-gradient(90deg,transparent,rgba(34,26,41,.12),transparent)}
.section-head{max-width:690px;margin-bottom:56px}
.kicker{display:block;margin-bottom:14px;color:var(--accent);font:700 12px/1.2 "JetBrains Mono",monospace;letter-spacing:.14em;text-transform:uppercase}
.section-head h2,.copy h2,.cta h2{font-size:clamp(2rem,4vw,2.8rem);line-height:1.08;letter-spacing:-.03em}
.section-head p,.copy>p,.cta p{margin-top:16px;color:var(--muted);font-size:1.03rem;line-height:1.68}
.paper .section-head p,.paper .copy>p,.paper .card p,.paper .cta p{color:var(--paper-muted)}
.paper .kicker{color:#a96720}

.grid-2,.grid-3,.grid-4{display:grid;gap:22px}
.grid-2{grid-template-columns:repeat(2,minmax(0,1fr))}
.grid-3{grid-template-columns:repeat(3,minmax(0,1fr))}
.grid-4{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{position:relative;overflow:hidden;min-height:100%;padding:29px 26px;border:1px solid var(--line);border-radius:var(--r-lg);background:linear-gradient(145deg,rgba(24,28,21,.94),rgba(13,15,11,.94));box-shadow:0 22px 54px -42px rgba(0,0,0,.7);transition:transform .35s var(--ease),border-color .35s,box-shadow .35s}
.card::before{content:"";position:absolute;right:-72px;top:-72px;width:190px;height:190px;border-radius:50%;background:radial-gradient(circle,rgba(var(--accent-rgb),.23),transparent 68%);opacity:.45;transition:opacity .35s,transform .35s}
.card::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(125deg,transparent 25%,rgba(255,255,255,.025),transparent 65%)}
.card>*{position:relative;z-index:1}
.card:hover{transform:translateY(-7px);border-color:rgba(var(--accent-rgb),.42);box-shadow:0 30px 70px -42px rgba(0,0,0,.75)}
.card:hover::before{opacity:.8;transform:scale(1.1)}
.card h3{font-size:1.17rem;line-height:1.2;letter-spacing:-.015em}
.card p{margin-top:10px;color:var(--muted);font-size:.9rem;line-height:1.62}
.card-icon{width:48px;height:48px;display:grid;place-items:center;margin-bottom:19px;border:1px solid rgba(var(--accent-rgb),.32);border-radius:13px;background:rgba(var(--accent-rgb),.1);color:var(--accent);font:700 1.15rem/1 "JetBrains Mono",monospace;box-shadow:0 14px 28px -22px rgba(var(--accent-rgb),.9)}
.card-link{display:inline-flex;margin-top:22px;color:var(--accent);font-size:.84rem;font-weight:800}
.paper .card{border-color:rgba(34,26,41,.11);background:rgba(255,255,255,.62);box-shadow:0 22px 52px -42px rgba(34,26,41,.33)}
.paper .card h3{color:var(--paper-ink)}
.paper .card:hover{border-color:rgba(var(--accent-rgb),.42)}

.split{display:grid;grid-template-columns:minmax(0,1fr) minmax(390px,.95fr);gap:62px;align-items:center}
.split:nth-child(even){}
.copy{max-width:560px}
.feature-list{display:flex;flex-direction:column;gap:12px;margin-top:23px}
.feature-list li{position:relative;padding-left:27px;color:var(--muted);font-size:.92rem;line-height:1.55}
.feature-list li::before{content:"✓";position:absolute;left:0;top:.05em;width:17px;height:17px;display:grid;place-items:center;border:1px solid rgba(var(--accent-rgb),.35);border-radius:50%;color:var(--accent);font-size:10px;font-weight:800}
.paper .feature-list li{color:var(--paper-muted)}

.phone{width:min(100%,340px);margin-inline:auto;padding:17px;border-radius:34px;transition:transform .45s var(--ease)}
.phone:hover{transform:translateY(-6px) rotate(-.35deg)}
.phone-notch{width:82px;height:6px;margin:0 auto 15px;border-radius:5px;background:rgba(247,241,233,.16)}
.screen{position:relative;min-height:360px;padding:16px;border:1px solid rgba(247,241,233,.055);border-radius:21px;background:
  radial-gradient(circle at 90% 8%,rgba(var(--accent-rgb),.13),transparent 30%),
  var(--ink-2)}
.screen-title{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:15px}
.screen-title h4{font-size:.92rem}
.screen-title span{color:var(--accent);font:700 9px/1 "JetBrains Mono",monospace;letter-spacing:.08em}
.mini-card{position:relative;padding:13px;margin-top:10px;border:1px solid var(--line);border-radius:13px;background:rgba(24,28,21,.86)}
.mini-card-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.mini-card h5{font-size:.78rem;line-height:1.3}
.mini-card p{margin-top:5px;color:var(--muted);font-size:.69rem;line-height:1.45}
.mini-card b{color:var(--bone)}
.bar{height:6px;margin-top:10px;overflow:hidden;border-radius:6px;background:rgba(247,241,233,.08)}
.bar i{display:block;height:100%;border-radius:inherit;background:var(--accent);transform-origin:left}

.dashboard{overflow:hidden;border-radius:var(--r-xl)}
.dash-top{position:relative;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 21px;border-bottom:1px solid var(--line)}
.dash-top h4{font-size:1rem}
.status{display:flex;align-items:center;gap:7px;color:var(--mint);font:700 9px/1 "JetBrains Mono",monospace;letter-spacing:.05em;text-transform:uppercase}
.status i{width:6px;height:6px;border-radius:50%;background:var(--mint);animation:pulse 1.4s infinite}
.dash-body{position:relative;z-index:1;display:grid;grid-template-columns:126px 1fr;min-height:285px}
.dash-side{display:flex;flex-direction:column;gap:7px;padding:17px 12px;border-right:1px solid var(--line);background:rgba(28,22,34,.38)}
.dash-side span{padding:9px 10px;border-radius:8px;color:var(--muted);font-size:.7rem;font-weight:700}
.dash-side span.active{color:var(--bone);background:rgba(var(--accent-rgb),.13)}
.dash-main{padding:18px}
.dash-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.dash-kpi{padding:13px;border:1px solid var(--line);border-radius:12px;background:rgba(28,22,34,.35)}
.dash-kpi span{display:block;color:var(--muted);font:700 8px/1.3 "JetBrains Mono",monospace;letter-spacing:.05em}
.dash-kpi strong{display:block;margin-top:8px;font:700 1.3rem/1 "Bricolage Grotesque",sans-serif}
.chart{height:130px;display:flex;align-items:flex-end;gap:10px;margin-top:18px;padding:14px 15px 0;border:1px solid var(--line);border-radius:13px;background:linear-gradient(180deg,rgba(var(--accent-rgb),.05),transparent)}
.chart i{flex:1;min-width:12px;border-radius:5px 5px 0 0;background:linear-gradient(180deg,var(--accent),rgba(var(--accent-rgb),.25));transform-origin:bottom;box-shadow:0 0 16px rgba(var(--accent-rgb),.12)}

.flow{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:0;padding:28px 20px;border:1px solid var(--line);border-radius:var(--r-xl);background:linear-gradient(145deg,rgba(52,40,64,.88),rgba(39,29,49,.9));box-shadow:var(--shadow)}
.flow::before{content:"";position:absolute;left:10%;right:10%;top:50%;height:1px;background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.55),rgba(var(--accent-2-rgb),.38),transparent)}
.flow::after{content:"";position:absolute;top:calc(50% - 3px);left:10%;width:7px;height:7px;border-radius:50%;background:var(--accent);box-shadow:0 0 18px rgba(var(--accent-rgb),.8);animation:flowPulse 6s linear infinite}
@keyframes flowPulse{to{left:89%}}
.flow-step{position:relative;z-index:1;min-width:0;padding:0 14px;text-align:center}
.flow-step::before{content:"";width:46px;height:46px;display:block;margin:0 auto 18px;border:1px solid rgba(var(--accent-rgb),.38);border-radius:50%;background:var(--panel);box-shadow:0 0 0 8px rgba(43,33,54,.92),0 0 24px rgba(var(--accent-rgb),.12)}
.flow-step::after{content:counter(flow-step,decimal-leading-zero);counter-increment:flow-step;position:absolute;top:15px;left:50%;transform:translateX(-50%);color:var(--accent);font:700 10px/1 "JetBrains Mono",monospace}
.flow{counter-reset:flow-step}
.flow-step b{display:block;font-size:.88rem}
.flow-step span{display:block;margin-top:5px;color:var(--muted);font-size:.72rem;line-height:1.45}
.paper .flow{border-color:rgba(34,26,41,.11);background:rgba(255,255,255,.62);box-shadow:0 24px 58px -44px rgba(34,26,41,.32)}
.paper .flow-step::before{background:var(--paper);box-shadow:0 0 0 8px rgba(243,238,230,.95),0 0 24px rgba(var(--accent-rgb),.1)}
.paper .flow-step b{color:var(--paper-ink)}
.paper .flow-step span{color:var(--paper-muted)}

.calendar{display:grid;grid-template-columns:62px repeat(5,minmax(58px,1fr));overflow:hidden;border-radius:var(--r-xl)}
.cal-cell{position:relative;z-index:1;min-height:72px;padding:9px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:var(--muted);font-size:.65rem}
.cal-cell:nth-child(6n){border-right:0}
.cal-head{min-height:auto;padding:11px 9px;background:rgba(28,22,34,.35);color:var(--bone);font:700 9px/1 "JetBrains Mono",monospace;text-align:center;text-transform:uppercase}
.appt{padding:8px 7px;border:1px solid rgba(70,216,160,.25);border-radius:8px;background:rgba(70,216,160,.11);color:var(--mint);font-size:.58rem;font-weight:800;line-height:1.25}
.appt.cancel{border-color:rgba(255,112,91,.3);background:rgba(255,112,91,.11);color:var(--coral)}
.appt.deal{border-color:rgba(240,168,48,.32);background:rgba(240,168,48,.12);color:var(--amber);animation:dealGlow 2.4s ease-in-out infinite}
@keyframes dealGlow{50%{box-shadow:0 0 18px rgba(240,168,48,.22)}}

.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:16px}
.metric{padding:14px;border:1px solid var(--line);border-radius:12px;background:rgba(28,22,34,.32)}
.metric span{display:block;color:var(--muted);font:700 8px/1.3 "JetBrains Mono",monospace;letter-spacing:.05em;text-transform:uppercase}
.metric strong{display:block;margin-top:7px;font:700 1.28rem/1 "Bricolage Grotesque",sans-serif}

.tabs{display:inline-flex;gap:6px;margin-bottom:26px;padding:5px;border:1px solid var(--line);border-radius:999px;background:rgba(247,241,233,.04)}
.tab{padding:10px 18px;border:0;border-radius:999px;background:transparent;color:var(--muted);font-size:.83rem;font-weight:800;cursor:pointer;transition:background .25s,color .25s}
.tab.active{background:var(--accent);color:#201b25}
.tab-panel{display:none}
.tab-panel.active{display:block;animation:tabIn .35s var(--ease)}
@keyframes tabIn{from{opacity:0;transform:translateY(8px)}}
.paper .tabs{border-color:rgba(34,26,41,.12);background:rgba(34,26,41,.045)}
.paper .tab{color:var(--paper-muted)}
.paper .tab.active{color:#1f1a24}

.quote{position:relative;overflow:hidden;padding:48px;border:1px solid var(--line);border-radius:var(--r-xl);background:linear-gradient(145deg,rgba(52,40,64,.92),rgba(38,29,48,.96));box-shadow:var(--shadow)}
.quote::before{content:"“";position:absolute;right:34px;top:2px;color:rgba(var(--accent-rgb),.14);font:800 9rem/1 "Bricolage Grotesque",sans-serif}
.quote p{max-width:850px;font:600 clamp(1.65rem,3.5vw,2.6rem)/1.25 "Bricolage Grotesque",sans-serif;letter-spacing:-.025em}
.quote>span:last-child{display:block;max-width:760px;margin-top:24px;color:var(--muted);font-size:1rem;line-height:1.65}

.cta{display:flex;align-items:center;justify-content:space-between;gap:36px;padding:44px 46px;border:1px solid var(--line);border-radius:var(--r-xl);background:
  radial-gradient(circle at 85% 20%,rgba(var(--accent-rgb),.19),transparent 28%),
  linear-gradient(145deg,rgba(52,40,64,.94),rgba(38,29,48,.96));box-shadow:var(--shadow)}
.cta>div{max-width:690px}
.cta .actions{margin-top:0;flex:0 0 auto}
.paper .cta{border-color:rgba(34,26,41,.12);background:rgba(255,255,255,.65);box-shadow:0 28px 70px -48px rgba(34,26,41,.35)}
.paper .cta h2{color:var(--paper-ink)}

.footer{padding:72px 0 34px;border-top:1px solid var(--line);background:rgba(10,12,9,.84)}
.footer-grid{display:grid;grid-template-columns:1.45fr repeat(3,1fr);gap:42px;padding-bottom:48px;border-bottom:1px solid var(--line)}
.footer-brand p{max-width:320px;margin-top:15px;color:var(--muted);font-size:.86rem;line-height:1.65}
.footer h4{margin-bottom:17px;color:var(--muted);font:700 11px/1 "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.footer ul{display:flex;flex-direction:column;gap:12px}
.footer li a{color:var(--muted);font-size:.87rem;transition:color .2s}
.footer li a:hover{color:var(--bone)}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:20px;padding-top:28px;color:var(--muted);font-size:.79rem}
.footer-legal{display:flex;gap:22px}
.footer-legal a:hover{color:var(--bone)}

.reveal{opacity:0;transform:translateY(24px);transition:opacity .72s var(--ease),transform .72s var(--ease)}
.reveal.visible{opacity:1;transform:translateY(0)}
.grid-2>.reveal:nth-child(2),.grid-3>.reveal:nth-child(2),.grid-4>.reveal:nth-child(2){transition-delay:.07s}
.grid-3>.reveal:nth-child(3),.grid-4>.reveal:nth-child(3){transition-delay:.14s}
.grid-4>.reveal:nth-child(4){transition-delay:.21s}

@media (max-width:1060px){
  .nav-links{gap:18px;font-size:.84rem}
  .subhero-grid{grid-template-columns:minmax(0,1fr) minmax(360px,.9fr);gap:42px}
  .grid-4{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:900px){
  .promo{font-size:.78rem}
  .nav-inner{min-height:68px}
  .nav-links{position:absolute;top:68px;left:0;right:0;display:none;flex-direction:column;align-items:stretch;gap:0;padding:14px 24px 22px;border-bottom:1px solid var(--line);background:rgba(28,22,34,.98)}
  .nav.open .nav-links{display:flex}
  .nav-links a{padding:13px 0}
  .nav-links a::after{bottom:7px;transform-origin:left}
  .signin{display:none}
  .menu-toggle{display:block}
  .subhero{padding-top:58px}
  .subhero-grid,.split{grid-template-columns:1fr}
  .subhero-grid{gap:48px}
  .subhero .panel,.subhero .phone,.subhero .dashboard,.subhero .calendar{width:min(100%,650px);margin-inline:auto}
  .split .copy{max-width:680px}
  .grid-3{grid-template-columns:1fr 1fr}
  .flow{grid-template-columns:1fr;gap:22px;padding:28px}
  .flow::before{top:10%;bottom:10%;left:51px;width:1px;height:auto;background:linear-gradient(180deg,transparent,rgba(var(--accent-rgb),.55),rgba(var(--accent-2-rgb),.38),transparent)}
  .flow::after{top:10%;left:48px;animation:flowPulseMobile 6s linear infinite}
  @keyframes flowPulseMobile{to{top:89%}}
  .flow-step{padding-left:72px;text-align:left;min-height:58px}
  .flow-step::before{position:absolute;left:0;top:0;margin:0}
  .flow-step::after{left:23px;transform:none}
  .cta{align-items:flex-start;flex-direction:column}
  .cta .actions{margin-top:0}
  .footer-grid{grid-template-columns:1.5fr 1fr 1fr}
  .footer-grid>div:last-child{grid-column:2/4}
}
@media (max-width:680px){
  .wrap{width:min(calc(100% - 32px),var(--max))}
  .promo{padding-inline:12px}
  .nav-actions .btn{display:none}
  .subhero{padding:48px 0 50px}
  .subhero h1{font-size:clamp(2.45rem,12vw,3.2rem)}
  .subhero .reveal>p{font-size:1rem}
  .section{padding:82px 0}
  .section-head{margin-bottom:38px}
  .grid-2,.grid-3,.grid-4{grid-template-columns:1fr}
  .panel{padding:16px}
  .activity{grid-template-columns:38px minmax(0,1fr)}
  .activity>.tag{grid-column:2;justify-self:start}
  .dashboard{border-radius:22px}
  .dash-body{grid-template-columns:1fr}
  .dash-side{display:none}
  .dash-kpis{grid-template-columns:1fr 1fr}
  .dash-kpi:last-child{grid-column:1/-1}
  .calendar{grid-template-columns:46px repeat(5,minmax(50px,1fr));overflow-x:auto}
  .cal-cell{min-height:64px;padding:6px}
  .appt{padding:6px 4px;font-size:.5rem}
  .metric-row{grid-template-columns:1fr}
  .quote{padding:34px 28px}
  .cta{padding:34px 28px}
  .footer-grid{grid-template-columns:1fr 1fr;gap:34px 26px}
  .footer-brand{grid-column:1/-1}
  .footer-grid>div:last-child{grid-column:auto}
  .footer-bottom{align-items:flex-start;flex-direction:column}
}
@media (hover:none),(pointer:coarse){
  .cursor{display:none}
  body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:auto}
  .card:hover,.phone:hover{transform:none}
}
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important}
  .cursor,.bg-glow{display:none!important}
  .reveal{opacity:1;transform:none;transition:none}
  body.has-cursor,body.has-cursor a,body.has-cursor button{cursor:auto}
}


/* Simplified global navigation and app access */
.apple-mark{width:16px;height:16px;flex:0 0 auto}
.app-download-btn{gap:8px}
.nav-mobile-auth,.nav-mobile-app{display:none}

/* Authentication gateway */
body.page-signin{--accent:var(--mint);--accent-rgb:70,216,160;--accent-2:var(--amber);--accent-2-rgb:240,168,48}
.auth-shell{min-height:calc(100vh - 108px);display:grid;place-items:center;padding:70px 0 94px}
.auth-wrap{width:min(calc(100% - 40px),1040px)}
.auth-head{max-width:720px;margin:0 auto 42px;text-align:center}
.auth-head h1{margin-top:18px;font-size:clamp(2.65rem,6vw,4.6rem);line-height:1;letter-spacing:-.045em}
.auth-head p{max-width:620px;margin:18px auto 0;color:var(--muted);font-size:1.05rem;line-height:1.65}
.auth-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.auth-card{position:relative;overflow:hidden;min-height:310px;padding:28px;border:1px solid var(--line);border-radius:var(--r-xl);background:linear-gradient(145deg,rgba(52,40,64,.96),rgba(39,29,49,.96));box-shadow:var(--shadow);transition:transform .3s var(--ease),border-color .3s var(--ease)}
.auth-card::before{content:"";position:absolute;width:190px;height:190px;right:-80px;top:-90px;border-radius:50%;background:radial-gradient(circle,rgba(var(--accent-rgb),.2),transparent 70%)}
.auth-card:hover{transform:translateY(-6px);border-color:rgba(var(--accent-rgb),.42)}
.auth-icon{display:grid;place-items:center;width:52px;aspect-ratio:1;margin-bottom:24px;border:1px solid rgba(var(--accent-rgb),.38);border-radius:15px;background:rgba(var(--accent-rgb),.1);color:var(--accent);font:700 1.1rem/1 "JetBrains Mono",monospace}
.auth-card h2{font-size:1.45rem}
.auth-card p{margin-top:11px;color:var(--muted);font-size:.93rem;line-height:1.6}
.auth-card .btn{margin-top:28px;width:100%}
.auth-note{margin-top:22px;padding:17px 20px;border:1px solid var(--line);border-radius:16px;background:rgba(247,241,233,.035);color:var(--muted);text-align:center;font-size:.88rem;line-height:1.55}
.auth-note a{color:var(--bone);font-weight:700}

@media (max-width:900px){
  .nav-mobile-auth,.nav-mobile-app{display:flex;align-items:center;gap:9px}
  .nav-mobile-app{margin-top:8px;padding:12px 15px!important;border-radius:999px;background:var(--amber);color:#281a04!important;justify-content:center}
  .auth-grid{grid-template-columns:1fr}
  .auth-card{min-height:0}
}


/* Dedicated download destination */
body.page-download{--accent:var(--mint);--accent-rgb:70,216,160;--accent-2:var(--amber);--accent-2-rgb:240,168,48}
.download-hero{position:relative;overflow:hidden;padding:96px 0 104px}
.download-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(350px,.78fr);gap:74px;align-items:center}
.download-copy h1{margin-top:21px;font-size:clamp(3rem,6.6vw,5.7rem);line-height:.94;letter-spacing:-.052em}
.download-copy h1 em{font-style:normal;color:var(--amber)}
.download-copy>p{max-width:650px;margin-top:23px;color:var(--muted);font-size:1.08rem;line-height:1.68}
.store-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:32px}
.store-button{display:inline-flex;align-items:center;gap:12px;min-width:190px;padding:11px 17px;border:1px solid var(--line-strong);border-radius:14px;background:rgba(247,241,233,.045);transition:transform .25s var(--ease),border-color .25s var(--ease),background .25s var(--ease)}
.store-button:hover{transform:translateY(-3px);border-color:rgba(var(--accent-rgb),.5);background:rgba(var(--accent-rgb),.08)}
.store-button--primary{background:var(--bone);color:#17111c;border-color:var(--bone)}
.store-button--primary:hover{background:#fff;border-color:#fff}
.store-button .apple-mark,.store-button .play-mark{width:28px;height:28px;font-size:1.3rem;display:grid;place-items:center}
.store-button span:last-child{display:flex;flex-direction:column;align-items:flex-start;line-height:1.05}
.store-button small{font-size:.61rem;letter-spacing:.06em}
.store-button strong{margin-top:3px;font-size:1.05rem}
.availability-note{margin-top:14px!important;font-size:.8rem!important;color:var(--muted)!important}
.download-visual{position:relative;min-height:610px;display:grid;place-items:center}
.phone--download{position:relative;z-index:2;max-width:350px;width:100%;transform:rotate(2deg);box-shadow:0 45px 110px -36px rgba(0,0,0,.92)}
.download-orbit{position:absolute;z-index:3;padding:9px 13px;border:1px solid rgba(var(--accent-rgb),.38);border-radius:999px;background:rgba(28,22,34,.88);box-shadow:0 18px 45px rgba(0,0,0,.35);color:var(--accent);font:700 .66rem/1 "JetBrains Mono",monospace;letter-spacing:.08em;backdrop-filter:blur(12px);animation:orbitFloat 4.6s ease-in-out infinite}
.orbit-a{left:1%;top:22%}.orbit-b{right:-1%;top:43%;animation-delay:-1.4s}.orbit-c{left:8%;bottom:16%;animation-delay:-2.6s}
@keyframes orbitFloat{50%{transform:translateY(-9px)}}
.app-download-btn.current{box-shadow:0 0 0 2px rgba(240,168,48,.23),0 14px 38px -18px rgba(240,168,48,.8)}
@media(max-width:900px){.download-grid{grid-template-columns:1fr;gap:40px}.download-copy{text-align:center}.download-copy>p{margin-inline:auto}.store-actions{justify-content:center}.download-visual{min-height:560px}.phone--download{max-width:330px}.orbit-a{left:10%}.orbit-b{right:8%}.orbit-c{left:15%}}
@media(max-width:620px){.download-hero{padding:70px 0 78px}.download-grid{gap:24px}.download-copy{text-align:left}.store-actions{display:grid;justify-content:stretch}.store-button{width:100%;justify-content:center}.download-visual{min-height:490px}.phone--download{max-width:290px}.download-orbit{display:none}}

/* ============================================================
   FILLR GLOBAL CSS - END
   Shared styling for all secondary pages ends above.
============================================================ */


/* ============================================================
   FILLR APP-ALIGNED PREMIUM SYSTEM - START
============================================================ */
body{background:#050706}
body::before{background:
  radial-gradient(circle at 12% 5%,rgba(var(--accent-rgb),.10),transparent 32%),
  radial-gradient(circle at 88% 30%,rgba(var(--accent-2-rgb),.06),transparent 30%),
  #050706}
.nav{background:rgba(5,7,6,.74);border-bottom-color:rgba(237,239,224,.05)}
.nav.scrolled{background:rgba(5,7,6,.94)}
.btn--primary{
  background:linear-gradient(180deg,#ead18b 0%,#d0a94f 52%,#b38635 100%);
  color:#17170f;
  border-color:rgba(255,240,186,.52);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.52),inset 0 -1px 0 rgba(82,57,13,.45),0 16px 34px -23px rgba(213,177,95,.9)
}
.btn--primary:hover{background:linear-gradient(180deg,#f0dda3 0%,#d9b65e 52%,#bb903a 100%)}
.btn--ghost{border-color:rgba(220,224,205,.20);background:rgba(220,224,205,.025)}
.btn--ghost:hover{border-color:rgba(213,177,95,.48);background:rgba(213,177,95,.07)}
.panel,.phone,.dashboard,.calendar,.card{background:linear-gradient(145deg,rgba(23,27,20,.96),rgba(8,10,7,.98))}
.paper{color:var(--bone);background:
  radial-gradient(circle at 15% 12%,rgba(var(--accent-rgb),.06),transparent 28%),
  radial-gradient(circle at 88% 82%,rgba(var(--accent-2-rgb),.05),transparent 28%),
  #0b0d0a}
.paper .section-head p,.paper .copy>p,.paper .card p,.paper .cta p,.paper .feature-list li{color:var(--muted)}
.paper .card{border-color:var(--line);background:linear-gradient(145deg,rgba(23,27,20,.96),rgba(8,10,7,.98));box-shadow:0 22px 52px -42px rgba(0,0,0,.75)}
.paper .card h3{color:var(--bone)}
.paper .kicker{color:var(--accent)}
/* Keep connected workflow containers consistent with the premium dark system. */
.paper .flow{
  border-color:var(--line);
  background:linear-gradient(145deg,rgba(23,27,20,.96),rgba(8,10,7,.98));
  box-shadow:0 24px 58px -44px rgba(0,0,0,.78);
}
.paper .flow::before{
  background:linear-gradient(90deg,transparent,rgba(var(--accent-rgb),.55),rgba(var(--accent-2-rgb),.38),transparent);
}
.paper .flow-step::before{
  border-color:rgba(var(--accent-rgb),.38);
  background:var(--panel);
  box-shadow:0 0 0 8px rgba(12,15,10,.96),0 0 24px rgba(var(--accent-rgb),.14);
}
.paper .flow-step b{color:var(--bone)}
.paper .flow-step span{color:var(--muted)}

/* Global marketing header actions */
.nav-actions .business-link{color:var(--muted);font-size:.91rem;font-weight:700;transition:color .2s}
.nav-actions .business-link:hover{color:var(--bone)}
.nav-mobile-business,.nav-mobile-app{display:none}

/* Premium homepage */
body.page-home{--accent:#d5b15f;--accent-rgb:213,177,95;--accent-2:#aeb873;--accent-2-rgb:174,184,115}
.home-hero{position:relative;min-height:calc(100svh - 74px);display:flex;align-items:center;overflow:hidden;padding:48px 0 70px;background:
  radial-gradient(circle at 72% 28%,rgba(174,184,115,.11),transparent 29%),
  radial-gradient(circle at 84% 62%,rgba(213,177,95,.08),transparent 23%),
  linear-gradient(180deg,#050706 0%,#070906 72%,#050706 100%)}
.home-hero::after{content:"";position:absolute;inset:0;pointer-events:none;opacity:.26;background:linear-gradient(90deg,rgba(5,7,6,.04),rgba(5,7,6,.36) 49%,rgba(5,7,6,.04)),radial-gradient(circle at center,transparent 45%,#050706 100%)}
.home-hero-grid{position:relative;z-index:2;display:grid;grid-template-columns:minmax(0,.86fr) minmax(620px,1.14fr);gap:34px;align-items:center}
.hero-copy-premium{position:relative;z-index:4;max-width:650px;padding:40px 0}
.hero-overline{display:inline-flex;align-items:center;gap:10px;color:#c7ccaa;font:700 11px/1 "JetBrains Mono",monospace;letter-spacing:.16em;text-transform:uppercase}
.hero-overline::before{content:"";width:42px;height:1px;background:linear-gradient(90deg,var(--amber),transparent)}
.hero-copy-premium h1{margin-top:24px;font-size:clamp(3.7rem,6.4vw,6.5rem);line-height:.92;letter-spacing:-.065em;font-weight:650}
.hero-copy-premium h1 em{display:block;color:var(--amber);font-style:normal;font-weight:720}
.hero-copy-premium>p{max-width:580px;margin-top:28px;color:#a8aca1;font-size:1.12rem;line-height:1.72}
.hero-actions-premium{display:flex;flex-wrap:wrap;gap:14px;margin-top:34px}
.hero-note{display:flex;align-items:center;gap:12px;margin-top:34px;color:#757a70;font-size:.8rem}
.hero-note i{width:32px;height:1px;background:rgba(213,177,95,.5)}
.tree-stage{position:relative;min-height:720px;display:grid;place-items:center;isolation:isolate}
.tree-stage::before{content:"";position:absolute;width:72%;height:72%;border-radius:50%;background:radial-gradient(circle,rgba(181,196,110,.11),rgba(213,177,95,.045) 34%,transparent 68%);filter:blur(14px)}
.tree-stage::after{content:"";position:absolute;left:9%;right:4%;bottom:5%;height:16%;border-radius:50%;background:radial-gradient(ellipse,rgba(156,168,93,.18),transparent 66%);filter:blur(30px)}
.tree-svg{position:relative;z-index:2;width:min(100%,780px);height:auto;overflow:visible;filter:drop-shadow(0 28px 40px rgba(0,0,0,.68))}
.tree-svg .wood-outer{fill:none;stroke:#20261a;stroke-linecap:round;stroke-linejoin:round}
.tree-svg .wood-inner{fill:none;stroke:url(#woodGradient);stroke-linecap:round;stroke-linejoin:round}
.tree-svg .energy{fill:none;stroke:url(#energyGradient);stroke-linecap:round;stroke-dasharray:2 20;animation:energyFlow 8s linear infinite;opacity:.72}
.tree-svg .leaf{fill:url(#leafGradient);stroke:rgba(231,223,161,.22);stroke-width:1;transform-box:fill-box;transform-origin:center;animation:leafBreath 7s ease-in-out infinite}
.tree-svg .leaf:nth-of-type(3n){animation-delay:-2s}.tree-svg .leaf:nth-of-type(4n){animation-delay:-4s}
.tree-svg .node-orbit{fill:rgba(8,10,7,.82);stroke:rgba(213,177,95,.32);stroke-width:1.2;transition:fill .35s,stroke .35s,transform .35s;transform-box:fill-box;transform-origin:center}
.tree-svg .node-dot{fill:#d5b15f;filter:url(#softGlow)}
.tree-svg .node-label{fill:#eef0e7;font:700 13px/1 "DM Sans",sans-serif;letter-spacing:.02em}
.tree-svg .node-group{cursor:pointer}
.tree-svg .node-group:hover .node-orbit,.tree-svg .node-group.active .node-orbit{fill:rgba(213,177,95,.14);stroke:rgba(238,211,137,.82);transform:scale(1.07)}
.tree-svg .node-group:hover .node-label,.tree-svg .node-group.active .node-label{fill:#f3d995}
.tree-svg .dim{opacity:.25;transition:opacity .35s}
@keyframes energyFlow{to{stroke-dashoffset:-220}}
@keyframes leafBreath{50%{transform:translateY(-2px) scale(1.015)}}
.tree-caption{position:absolute;z-index:4;right:4%;bottom:7%;max-width:300px;padding:15px 17px;border:1px solid rgba(237,239,224,.10);border-radius:16px;background:rgba(9,11,8,.64);backdrop-filter:blur(14px);box-shadow:0 24px 60px -38px #000}
.tree-caption strong{display:block;color:#e4c978;font-size:.86rem}
.tree-caption p{margin-top:6px;color:#8e9388;font-size:.76rem;line-height:1.5}
.scroll-cue{position:absolute;z-index:4;left:50%;bottom:20px;display:flex;align-items:center;gap:10px;color:#666b63;font:700 10px/1 "JetBrains Mono",monospace;letter-spacing:.14em;text-transform:uppercase;transform:translateX(-50%)}
.scroll-cue::before{content:"";width:1px;height:28px;background:linear-gradient(var(--amber),transparent);animation:scrollCue 2.4s ease-in-out infinite}
@keyframes scrollCue{50%{transform:translateY(7px);opacity:.35}}

.premium-section{padding:124px 0}
.editorial-head{max-width:820px;margin-bottom:58px}
.editorial-head .kicker{margin-bottom:18px}
.editorial-head h2{font-size:clamp(2.7rem,5vw,4.6rem);line-height:.98;letter-spacing:-.055em;font-weight:620}
.editorial-head p{max-width:650px;margin-top:22px;color:var(--muted);font-size:1.06rem;line-height:1.72}

.live-strip{position:relative;overflow:hidden;border-block:1px solid var(--line);background:#090b08}
.live-strip-track{display:flex;width:max-content;padding:17px 0;animation:ticker 42s linear infinite}
.live-event{display:flex;align-items:center;gap:12px;padding:0 34px;border-right:1px solid var(--line);color:#898e84;font-size:.83rem;white-space:nowrap}
.live-event i{width:7px;height:7px;border-radius:50%;background:var(--event-color,var(--mint));box-shadow:0 0 0 6px color-mix(in srgb,var(--event-color,var(--mint)) 13%,transparent)}
.live-event b{color:#e8eae3}
.live-event span{color:var(--event-color,var(--mint));font:700 10px/1 "JetBrains Mono",monospace}

.perspective-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.perspective-card{position:relative;min-height:330px;overflow:hidden;padding:30px 27px;border:1px solid var(--line);border-radius:26px;background:linear-gradient(155deg,rgba(24,28,21,.96),rgba(7,9,6,.98));transition:transform .45s var(--ease),border-color .35s,box-shadow .35s}
.perspective-card::before{content:"";position:absolute;width:270px;height:270px;right:-105px;top:-115px;border-radius:50%;background:radial-gradient(circle,var(--card-accent),transparent 68%);opacity:.17;transition:opacity .35s,transform .45s}
.perspective-card:hover{transform:translateY(-9px);border-color:color-mix(in srgb,var(--card-accent) 45%,transparent);box-shadow:0 34px 80px -46px var(--card-accent)}
.perspective-card:hover::before{opacity:.28;transform:scale(1.12)}
.perspective-number{color:var(--card-accent);font:700 11px/1 "JetBrains Mono",monospace;letter-spacing:.12em}
.perspective-icon{display:grid;place-items:center;width:58px;height:58px;margin-top:54px;border:1px solid color-mix(in srgb,var(--card-accent) 35%,transparent);border-radius:18px;background:color-mix(in srgb,var(--card-accent) 10%,transparent);color:var(--card-accent);font-size:1.35rem}
.perspective-card h3{margin-top:24px;font-size:1.35rem}
.perspective-card p{margin-top:11px;color:#8f948a;font-size:.88rem;line-height:1.65}
.perspective-card a{position:absolute;left:27px;bottom:27px;color:var(--card-accent);font-size:.82rem;font-weight:800}

.product-story{display:grid;grid-template-columns:minmax(0,.85fr) minmax(520px,1.15fr);gap:86px;align-items:center}
.product-story.reverse{grid-template-columns:minmax(520px,1.15fr) minmax(0,.85fr)}
.product-story.reverse .story-visual{order:-1}
.story-copy h2{font-size:clamp(2.6rem,4.7vw,4.35rem);line-height:.98;letter-spacing:-.055em;font-weight:620}
.story-copy p{max-width:560px;margin-top:21px;color:var(--muted);font-size:1.02rem;line-height:1.72}
.story-points{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin-top:30px}
.story-point{padding-top:16px;border-top:1px solid var(--line)}
.story-point b{display:block;color:#e6e8df;font-size:.88rem}
.story-point span{display:block;margin-top:5px;color:#7f847a;font-size:.78rem;line-height:1.5}
.story-visual{position:relative;min-height:610px;display:grid;place-items:center}
.story-visual::before{content:"";position:absolute;width:72%;height:72%;border-radius:50%;background:radial-gradient(circle,rgba(var(--story-rgb),.13),transparent 68%);filter:blur(26px)}
.app-phone-premium{position:relative;width:330px;padding:9px;border:1px solid rgba(228,222,193,.18);border-radius:50px;background:linear-gradient(145deg,#25291f,#080a07);box-shadow:0 54px 100px -50px #000,0 0 0 1px rgba(213,177,95,.05);transform:rotate(-4deg);transition:transform .7s var(--ease)}
.app-phone-premium:hover{transform:rotate(-1deg) translateY(-8px)}
.app-phone-premium img{width:100%;border-radius:42px}
.floating-chip{position:absolute;z-index:3;display:flex;align-items:center;gap:10px;padding:13px 15px;border:1px solid rgba(237,239,224,.13);border-radius:15px;background:rgba(12,15,10,.82);backdrop-filter:blur(16px);box-shadow:0 22px 54px -34px #000;color:#dfe1da;font-size:.8rem}
.floating-chip i{width:8px;height:8px;border-radius:50%;background:var(--chip);box-shadow:0 0 0 6px color-mix(in srgb,var(--chip) 12%,transparent)}
.floating-chip.one{left:2%;top:19%}.floating-chip.two{right:0;top:46%}.floating-chip.three{left:5%;bottom:12%}

.business-console{position:relative;width:min(100%,700px);overflow:hidden;border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,#171b14,#080a07);box-shadow:0 48px 100px -52px #000;transform:perspective(1200px) rotateY(-6deg) rotateX(2deg);transition:transform .7s var(--ease)}
.business-console:hover{transform:perspective(1200px) rotateY(-2deg) rotateX(0) translateY(-7px)}
.console-bar{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;border-bottom:1px solid var(--line)}
.console-brand{display:flex;align-items:center;gap:10px;font-size:.86rem;font-weight:800}.console-brand img{height:25px}
.console-live{color:var(--mint);font:700 10px/1 "JetBrains Mono",monospace}
.console-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:15px;padding:18px}
.console-card{padding:18px;border:1px solid var(--line);border-radius:18px;background:rgba(21,25,18,.82)}
.console-card h4{color:#8d9288;font:700 10px/1 "JetBrains Mono",monospace;letter-spacing:.08em;text-transform:uppercase}
.console-metric{margin-top:13px;font:700 2rem/1 "Bricolage Grotesque",sans-serif}.console-metric.gold{color:var(--amber)}.console-metric.lime{color:var(--mint)}
.console-chart{display:flex;align-items:end;gap:8px;height:125px;margin-top:21px}.console-chart i{flex:1;border-radius:6px 6px 2px 2px;background:linear-gradient(180deg,#d8bd6f,#7e6530);opacity:.88}
.console-list{display:grid;gap:11px;margin-top:17px}.console-row{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid rgba(237,239,224,.08);font-size:.76rem}.console-row:last-child{border:0}.console-row span{color:#858b80}.console-row b{color:#e8e9e3}

.insurance-panel-premium{position:relative;width:min(100%,700px);padding:22px;border:1px solid rgba(118,148,197,.22);border-radius:28px;background:linear-gradient(145deg,#151a19,#080a08);box-shadow:0 48px 100px -52px #000;transform:perspective(1200px) rotateY(6deg);transition:transform .7s var(--ease)}
.insurance-panel-premium:hover{transform:perspective(1200px) rotateY(2deg) translateY(-7px)}
.ins-top{display:flex;align-items:center;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid var(--line)}
.ins-top h4{font-size:1rem}.region-pill{display:flex;gap:5px;padding:4px;border:1px solid var(--line);border-radius:999px;background:#080a08}.region-pill span{padding:7px 11px;border-radius:999px;color:#70766d;font:700 9px/1 "JetBrains Mono",monospace}.region-pill .active{background:rgba(118,148,197,.15);color:#a7bce0}
.ins-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.ins-card{padding:16px;border:1px solid var(--line);border-radius:16px;background:rgba(20,24,20,.82)}.ins-card small{color:#747a72;font-size:.68rem}.ins-card strong{display:block;margin-top:8px;font-size:1.32rem}.ins-card strong.blue{color:#8ea8d2}.ins-progress{height:7px;margin-top:13px;border-radius:99px;background:#0b0d0b;overflow:hidden}.ins-progress i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#718ebb,#b8c56c)}
.claim-flow{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:17px}.claim-step{padding:11px 8px;border:1px solid var(--line);border-radius:12px;color:#747a71;text-align:center;font-size:.65rem}.claim-step.done{border-color:rgba(182,204,107,.27);background:rgba(182,204,107,.07);color:#becd83}

.foundation-grid-premium{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.foundation-item{display:flex;align-items:center;gap:13px;min-height:86px;padding:16px;border:1px solid var(--line);border-radius:17px;background:linear-gradient(145deg,rgba(22,26,19,.9),rgba(8,10,7,.95));transition:transform .35s,border-color .35s}
.foundation-item:hover{transform:translateY(-4px);border-color:rgba(213,177,95,.35)}
.foundation-item i{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border:1px solid rgba(213,177,95,.24);border-radius:13px;background:rgba(213,177,95,.07);color:#d5b15f;font:700 .9rem/1 "JetBrains Mono",monospace}.foundation-item b{display:block;font-size:.88rem}.foundation-item span{display:block;margin-top:4px;color:#73786f;font-size:.7rem}

.outcome-band{position:relative;overflow:hidden;padding:120px 0;background:linear-gradient(180deg,#0b0e09,#050706)}
.outcome-band::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 100%,rgba(174,184,115,.14),transparent 45%)}
.outcome-grid{position:relative;display:grid;grid-template-columns:1.2fr repeat(3,.8fr);gap:18px;align-items:stretch}
.outcome-lead{padding-right:45px}.outcome-lead h2{font-size:clamp(2.8rem,5vw,4.6rem);line-height:.97;letter-spacing:-.055em}.outcome-lead p{margin-top:21px;color:#92978e;line-height:1.7}
.outcome-card{padding:27px 23px;border:1px solid var(--line);border-radius:21px;background:rgba(16,19,14,.7)}.outcome-card strong{display:block;color:var(--amber);font:700 11px/1 "JetBrains Mono",monospace}.outcome-card h3{margin-top:42px;font-size:1.2rem}.outcome-card p{margin-top:9px;color:#7d8279;font-size:.82rem;line-height:1.6}

.final-cta-premium{position:relative;overflow:hidden;padding:120px 0;text-align:center;background:#070906}.final-cta-premium::before{content:"";position:absolute;left:50%;top:20%;width:720px;height:420px;border-radius:50%;background:radial-gradient(circle,rgba(213,177,95,.13),transparent 68%);filter:blur(28px);transform:translateX(-50%)}.final-cta-inner{position:relative;max-width:850px;margin:auto}.final-cta-inner h2{font-size:clamp(3rem,5.5vw,5.3rem);line-height:.96;letter-spacing:-.06em}.final-cta-inner p{max-width:620px;margin:22px auto 0;color:#92978d;line-height:1.7}.final-cta-actions{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;margin-top:32px}

.portal-status{display:inline-flex;align-items:center;gap:8px;margin-left:8px;padding:5px 9px;border:1px solid rgba(213,177,95,.24);border-radius:999px;color:#b89e62;font:700 9px/1 "JetBrains Mono",monospace;text-transform:uppercase;letter-spacing:.07em}

@media(max-width:1100px){
 .home-hero-grid{grid-template-columns:1fr;gap:0}.home-hero{padding-top:20px}.hero-copy-premium{max-width:760px;padding-bottom:0}.tree-stage{min-height:650px;margin-top:-15px}.perspective-grid{grid-template-columns:repeat(2,1fr)}.product-story,.product-story.reverse{grid-template-columns:1fr;gap:54px}.product-story.reverse .story-visual{order:0}.story-copy{max-width:720px}.outcome-grid{grid-template-columns:1fr repeat(3,1fr)}.outcome-lead{grid-column:1/-1;padding:0 0 20px}.foundation-grid-premium{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:760px){
 .home-hero{min-height:auto;padding:50px 0 35px}.hero-copy-premium h1{font-size:clamp(3.05rem,14vw,4.8rem)}.hero-copy-premium>p{font-size:1rem}.tree-stage{min-height:520px}.tree-caption{right:2%;bottom:3%;max-width:240px}.tree-svg .node-label{font-size:11px}.scroll-cue{display:none}.premium-section{padding:90px 0}.editorial-head h2,.story-copy h2{font-size:clamp(2.45rem,11vw,3.6rem)}.perspective-grid{grid-template-columns:1fr}.perspective-card{min-height:270px}.perspective-icon{margin-top:30px}.product-story,.product-story.reverse{gap:38px}.story-points{grid-template-columns:1fr}.story-visual{min-height:520px}.app-phone-premium{width:275px}.floating-chip{font-size:.7rem}.floating-chip.one{left:0}.floating-chip.two{right:0}.business-console,.insurance-panel-premium{transform:none}.console-grid{grid-template-columns:1fr}.ins-grid{grid-template-columns:1fr}.claim-flow{grid-template-columns:1fr}.foundation-grid-premium{grid-template-columns:repeat(2,1fr)}.outcome-grid{grid-template-columns:1fr}.outcome-lead{grid-column:auto}.final-cta-premium{padding:90px 0}.final-cta-inner h2{font-size:clamp(2.8rem,13vw,4rem)}
}
@media(max-width:520px){.foundation-grid-premium{grid-template-columns:1fr}.tree-stage{min-height:460px}.tree-caption{display:none}.hero-actions-premium .btn{width:100%}}

/* ============================================================
   FILLR APP-ALIGNED PREMIUM SYSTEM - END
============================================================ */

/* Marketing navigation mobile override */
@media (max-width:900px){
  .nav-links{background:rgba(5,7,6,.98)}
  .nav-actions .business-link,.nav-actions .btn{display:none}
  .nav-mobile-business,.nav-mobile-app{display:flex!important;align-items:center}
  .nav-mobile-app{justify-content:center;margin-top:8px;padding:12px 15px!important;border:1px solid rgba(255,240,186,.45);border-radius:999px;background:linear-gradient(180deg,#ead18b,#b38635);color:#17170f!important}
}

/* ============================================================
   PHOTOREALISTIC TREE HERO - START
   Cinematic image, animated pathways, nodes and hero effects.
============================================================ */
.photo-tree-hero{
  min-height:calc(100svh - 74px);
  padding:38px 0 54px;
  background:
    radial-gradient(circle at 71% 45%,rgba(213,177,95,.085),transparent 33%),
    linear-gradient(180deg,#030403 0%,#050706 72%,#080a07 100%);
}
.photo-tree-hero::after{
  opacity:.58;
  background:
    linear-gradient(90deg,rgba(3,4,3,.06) 0%,rgba(3,4,3,.04) 34%,rgba(3,4,3,.22) 72%,rgba(3,4,3,.45) 100%),
    radial-gradient(ellipse at 68% 52%,transparent 38%,rgba(3,4,3,.66) 97%);
}
.photo-tree-hero .home-hero-grid{
  width:min(calc(100% - 48px),1440px);
  grid-template-columns:minmax(430px,.78fr) minmax(720px,1.22fr);
  gap:14px;
}
.hero-atmosphere{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.hero-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.12;animation:heroOrb 12s ease-in-out infinite alternate}
.hero-orb--one{width:460px;height:460px;right:13%;top:7%;background:#d5b15f}
.hero-orb--two{width:380px;height:380px;right:37%;bottom:-16%;background:#8da05a;animation-delay:-5s}
.hero-vignette{position:absolute;inset:0;background:radial-gradient(ellipse at center,transparent 42%,rgba(0,0,0,.54) 100%)}
@keyframes heroOrb{to{transform:translate3d(28px,-18px,0) scale(1.08);opacity:.19}}

.photo-tree-hero .hero-copy-premium{max-width:630px;padding:34px 0 86px}
.photo-tree-hero .hero-copy-premium h1{font-size:clamp(4rem,5.7vw,6.85rem)}
.photo-tree-hero .hero-copy-premium>p{max-width:560px}
.photo-tree-hero .hero-note{max-width:500px}

.photo-tree-stage{
  --tree-x:0px;
  --tree-y:0px;
  position:relative;
  min-height:760px;
  isolation:isolate;
  perspective:1300px;
}
.photo-tree-stage::before{
  content:"";
  position:absolute;
  z-index:0;
  left:8%;right:0;bottom:4%;height:18%;
  border-radius:50%;
  background:radial-gradient(ellipse,rgba(213,177,95,.18),rgba(182,204,107,.06) 38%,transparent 71%);
  filter:blur(28px);
}
.tree-photo-wrap{
  position:absolute;
  z-index:1;
  inset:0;
  overflow:hidden;
  border-radius:34px;
  transform:translate3d(var(--tree-x),var(--tree-y),0) scale(1.018);
  transform-origin:56% 62%;
  transition:transform .18s linear;
  -webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 4%,#000 91%,transparent 100%);
  mask-image:linear-gradient(to bottom,transparent 0,#000 4%,#000 91%,transparent 100%);
}
.tree-photo-wrap::before{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg,#050706 0%,rgba(5,7,6,.28) 11%,transparent 28%,transparent 82%,rgba(5,7,6,.45) 100%),
    linear-gradient(180deg,rgba(5,7,6,.14),transparent 20%,transparent 76%,rgba(5,7,6,.52));
}
.tree-photo{
  width:100%;height:100%;object-fit:cover;object-position:54% 50%;
  filter:saturate(.9) contrast(1.08) brightness(.94) drop-shadow(0 34px 70px rgba(0,0,0,.78));
  animation:treeBreathe 10s var(--ease) infinite alternate;
}
@keyframes treeBreathe{to{transform:scale(1.012);filter:saturate(.96) contrast(1.1) brightness(1.01) drop-shadow(0 38px 75px rgba(0,0,0,.82))}}
.tree-core-glow{
  position:absolute;z-index:3;left:47%;bottom:12%;width:210px;height:210px;border-radius:50%;
  background:radial-gradient(circle,rgba(244,222,148,.32),rgba(213,177,95,.13) 32%,transparent 70%);
  filter:blur(12px);transform:translate(-50%,50%);animation:coreBreathe 4.8s ease-in-out infinite;
}
@keyframes coreBreathe{50%{opacity:.58;transform:translate(-50%,50%) scale(1.15)}}
.tree-light-sweep{
  position:absolute;z-index:3;inset:-30% -40%;pointer-events:none;
  background:linear-gradient(115deg,transparent 39%,rgba(255,235,171,.07) 48%,rgba(255,244,201,.16) 50%,rgba(255,235,171,.05) 52%,transparent 61%);
  transform:translateX(-48%);animation:treeSweep 10s ease-in-out infinite;
  mix-blend-mode:screen;
}
@keyframes treeSweep{0%,24%{transform:translateX(-48%)}65%,100%{transform:translateX(48%)}}

.ecosystem-overlay{
  position:absolute;z-index:3;inset:0;width:100%;height:100%;overflow:visible;
  transform:translate3d(calc(var(--tree-x) * .45),calc(var(--tree-y) * .45),0);
  pointer-events:none;
}
.network-base path{
  fill:none;stroke:rgba(229,207,130,.18);stroke-width:2;stroke-linecap:round;
  filter:url(#pathSoftGlow);
}
.ecosystem-path{
  fill:none;stroke:url(#pathGold);stroke-width:3.2;stroke-linecap:round;
  stroke-dasharray:3 18;stroke-dashoffset:0;opacity:.22;
  filter:url(#pathSoftGlow);transition:opacity .4s,stroke-width .4s;
  animation:pathIdle 9s linear infinite;
}
.ecosystem-path.active{opacity:1;stroke-width:4.2;animation:pathTravel 1.65s linear infinite}
@keyframes pathIdle{to{stroke-dashoffset:-84}}
@keyframes pathTravel{to{stroke-dashoffset:-84}}
.ecosystem-core{opacity:.5;animation:svgCore 4.8s ease-in-out infinite}
.ecosystem-core-dot{fill:#f0d989;filter:url(#pathSoftGlow);animation:nodePulse 2.4s ease-in-out infinite}
@keyframes svgCore{50%{opacity:.95;transform:scale(1.12);transform-origin:558px 590px}}

.ecosystem-node{
  position:absolute;z-index:7;display:grid;place-items:center;width:92px;height:92px;padding:0;
  border:0;background:transparent;color:#f1f2eb;cursor:pointer;transform:translate(-50%,-50%);
  transition:transform .4s var(--ease),opacity .35s;
}
.ecosystem-node--consumer{left:32.6%;top:51.4%}
.ecosystem-node--business{left:77%;top:51.4%}
.ecosystem-node--marketplace{left:46.8%;top:26.4%}
.ecosystem-node--platform{left:62.6%;top:29.1%}
.node-halo{
  position:absolute;inset:7px;border:1px solid color-mix(in srgb,var(--node) 55%,transparent);border-radius:50%;
  background:radial-gradient(circle,rgba(5,7,6,.88) 43%,color-mix(in srgb,var(--node) 13%,transparent) 44%,transparent 70%);
  box-shadow:0 0 0 7px color-mix(in srgb,var(--node) 5%,transparent),0 0 36px color-mix(in srgb,var(--node) 24%,transparent);
  animation:nodeOrbit 5s ease-in-out infinite;
}
.node-core{
  position:relative;z-index:2;display:grid;place-items:center;width:31px;height:31px;border-radius:50%;
  border:1px solid color-mix(in srgb,var(--node) 65%,#fff 10%);background:rgba(7,9,6,.82);color:var(--node);
  font:700 .72rem/1 "JetBrains Mono",monospace;box-shadow:0 0 20px color-mix(in srgb,var(--node) 24%,transparent);
}
.ecosystem-node strong{
  position:absolute;top:82px;left:50%;transform:translateX(-50%);padding:6px 10px;border:1px solid rgba(237,239,224,.1);
  border-radius:999px;background:rgba(6,8,5,.72);backdrop-filter:blur(12px);color:#dcded5;font-size:.72rem;white-space:nowrap;
  transition:color .3s,border-color .3s,background .3s;
}
@keyframes nodeOrbit{50%{transform:scale(1.08);box-shadow:0 0 0 10px color-mix(in srgb,var(--node) 3%,transparent),0 0 48px color-mix(in srgb,var(--node) 34%,transparent)}}
.ecosystem-node:hover,.ecosystem-node:focus-visible,.ecosystem-node.active{transform:translate(-50%,-50%) scale(1.12)}
.ecosystem-node:hover strong,.ecosystem-node:focus-visible strong,.ecosystem-node.active strong{color:var(--node);border-color:color-mix(in srgb,var(--node) 35%,transparent);background:rgba(7,9,6,.9)}
.ecosystem-node:focus-visible{outline:2px solid var(--node);outline-offset:6px;border-radius:50%}
.ecosystem-node.dim{opacity:.35}

.tree-particles{position:absolute;z-index:5;inset:4% 3% 8%;pointer-events:none;overflow:hidden;border-radius:34px}
.tree-particle{position:absolute;width:3px;height:3px;border-radius:50%;background:#edd883;box-shadow:0 0 10px #d5b15f;opacity:0;animation:particleRise var(--duration) linear infinite;animation-delay:var(--delay)}
@keyframes particleRise{0%{opacity:0;transform:translate3d(0,35px,0) scale(.6)}15%{opacity:.58}72%{opacity:.26}100%{opacity:0;transform:translate3d(var(--drift),-170px,0) scale(1.25)}}

.photo-tree-panel{
  position:absolute;z-index:8;right:2.5%;bottom:4%;width:min(330px,38%);padding:18px 19px 17px;
  border:1px solid rgba(237,239,224,.13);border-radius:18px;
  background:linear-gradient(145deg,rgba(17,20,15,.91),rgba(6,8,5,.88));backdrop-filter:blur(18px);
  box-shadow:0 30px 70px -42px #000,inset 0 1px rgba(255,255,255,.035);
  transition:transform .38s var(--ease),border-color .38s,background .38s;
}
.photo-tree-panel.updated{animation:panelUpdate .46s var(--ease)}
@keyframes panelUpdate{0%{opacity:.45;transform:translateY(10px)}100%{opacity:1;transform:translateY(0)}}
.panel-index{display:block;color:#a99157;font:700 9px/1 "JetBrains Mono",monospace;letter-spacing:.12em}
.photo-tree-panel strong{display:block;margin-top:10px;font:650 1.05rem/1.25 "Bricolage Grotesque",sans-serif;color:#eceee6}
.photo-tree-panel p{margin-top:8px;color:#858a80;font-size:.75rem;line-height:1.55}
.photo-tree-panel a{display:inline-flex;align-items:center;gap:8px;margin-top:13px;color:#d8bd70;font-size:.73rem;font-weight:700}
.photo-tree-panel a span{transition:transform .25s}.photo-tree-panel a:hover span{transform:translate(2px,-2px)}

@media(max-width:1180px){
  .photo-tree-hero .home-hero-grid{grid-template-columns:1fr;gap:0;width:min(calc(100% - 48px),960px)}
  .photo-tree-hero .hero-copy-premium{max-width:760px;padding-bottom:0}
  .photo-tree-stage{min-height:730px;margin-top:-14px}
}
@media(max-width:760px){
  .photo-tree-hero{padding-top:34px}
  .photo-tree-hero .home-hero-grid{width:min(calc(100% - 30px),680px)}
  .photo-tree-stage{min-height:590px;margin-top:4px}
  .tree-photo-wrap{border-radius:22px;transform:scale(1.04)}
  .tree-photo{object-position:54% 50%}
  .ecosystem-node{width:72px;height:72px}
  .ecosystem-node strong{top:66px;font-size:.62rem;padding:5px 8px}
  .node-core{width:27px;height:27px}
  .ecosystem-node--consumer{left:29%;top:52%}.ecosystem-node--business{left:80%;top:52%}.ecosystem-node--marketplace{left:44%;top:27%}.ecosystem-node--platform{left:65%;top:29%}
  .photo-tree-panel{left:4%;right:4%;bottom:2%;width:auto;padding:15px 16px}
  .photo-tree-panel p{display:none}
}
@media(max-width:520px){
  .photo-tree-stage{min-height:520px}
  .photo-tree-panel{bottom:1%}
  .ecosystem-node strong{display:none}
  .ecosystem-node--consumer{left:25%}.ecosystem-node--business{left:81%}.ecosystem-node--marketplace{left:42%}.ecosystem-node--platform{left:67%}
}
@media(prefers-reduced-motion:reduce){
  .tree-photo,.tree-light-sweep,.tree-core-glow,.ecosystem-path,.node-halo,.tree-particle,.ecosystem-core,.ecosystem-core-dot{animation:none!important}
  .tree-photo-wrap,.ecosystem-overlay{transform:none!important}
}
/* ============================================================
   PHOTOREALISTIC TREE HERO - END
============================================================ */

/* ============================================================
   FULL-WIDTH PHOTOREALISTIC TREE HERO REVISION - START
   Removes left copy and makes the tree the cinematic full-width focus.
============================================================ */
.photo-tree-hero--fullbleed{
  min-height:calc(100svh - 74px);
  padding:16px 0 42px;
}
.photo-tree-hero--fullbleed::after{
  opacity:.44;
  background:
    linear-gradient(180deg,rgba(3,4,3,.05) 0%,rgba(3,4,3,.02) 24%,rgba(3,4,3,.25) 72%,rgba(3,4,3,.42) 100%),
    radial-gradient(ellipse at center,transparent 34%,rgba(3,4,3,.36) 88%);
}
.hero-full-stage-wrap{
  position:relative;
  z-index:2;
  width:min(calc(100% - 24px),1720px);
  margin:0 auto;
}
.photo-tree-stage--full{
  min-height:calc(100svh - 116px);
  border-radius:36px;
  overflow:hidden;
}
.photo-tree-stage--full::before{
  left:6%;right:6%;bottom:2%;height:24%;
  background:radial-gradient(ellipse,rgba(213,177,95,.24),rgba(182,204,107,.07) 40%,transparent 76%);
  filter:blur(38px);
}
.photo-tree-stage--full .tree-photo-wrap{
  border-radius:36px;
  transform:translate3d(calc(var(--tree-x) + 60px),var(--tree-y),0) scale(1.025);
  transform-origin:54% 62%;
}
.photo-tree-stage--full .tree-photo-wrap::before{
  background:
    linear-gradient(180deg,rgba(5,7,6,.08),transparent 20%,transparent 68%,rgba(5,7,6,.45)),
    radial-gradient(circle at 50% 48%,transparent 30%,rgba(4,5,4,.34) 84%,rgba(4,5,4,.72) 100%);
}
.photo-tree-stage--full .tree-photo{
  object-position:50% 51%;
  filter:saturate(.94) contrast(1.12) brightness(.95) drop-shadow(0 40px 90px rgba(0,0,0,.78));
}
.photo-tree-stage--full .tree-core-glow{
  left:54%;bottom:15%;width:260px;height:260px;
}
.photo-tree-stage--full .tree-light-sweep{display:none}
.photo-tree-stage--full .ecosystem-overlay{z-index:4}
.hero-tree-intro{
  position:absolute;left:32px;top:30px;z-index:8;display:flex;flex-direction:column;gap:10px;
  padding:14px 16px;border:1px solid rgba(237,239,224,.12);border-radius:16px;
  background:linear-gradient(145deg,rgba(12,15,11,.78),rgba(6,8,5,.58));backdrop-filter:blur(16px);
  box-shadow:0 24px 60px -42px #000;
}
.hero-tree-intro .intro-kicker{
  display:inline-flex;align-items:center;gap:8px;color:#bca462;
  font:700 10px/1 "JetBrains Mono",monospace;letter-spacing:.18em;text-transform:uppercase;
}
.hero-tree-intro strong{font:600 .95rem/1.35 "Bricolage Grotesque",sans-serif;color:#f1f3ea}
.photo-tree-stage--full .ecosystem-node{width:88px;height:88px;z-index:7}
.photo-tree-stage--full .ecosystem-node strong{top:79px}
.photo-tree-stage--full .ecosystem-node--consumer{left:29%;top:42%}
.photo-tree-stage--full .ecosystem-node--business{left:76%;top:42%}
.photo-tree-stage--full .ecosystem-node--marketplace{left:57%;top:18%}
.photo-tree-stage--full .ecosystem-node--platform{left:54%;top:46%}
.photo-tree-stage--full .ecosystem-node--scheduling{left:17%;top:78%}
.photo-tree-stage--full .ecosystem-node--payments{left:31%;top:80%}
.photo-tree-stage--full .ecosystem-node--insurance{left:45%;top:82%}
.photo-tree-stage--full .ecosystem-node--ai{left:59%;top:81%}
.photo-tree-stage--full .ecosystem-node--analytics{left:73%;top:79%}
.photo-tree-stage--full .ecosystem-node--integrations{left:87%;top:77%}
.photo-tree-stage--full .node-root{width:78px;height:78px}
.photo-tree-stage--full .node-root .node-halo{inset:8px}
.photo-tree-stage--full .node-root .node-core{width:28px;height:28px;font-size:.68rem}
.photo-tree-stage--full .node-root strong{top:70px;font-size:.66rem}
.photo-tree-stage--full .node-branch .node-core{width:33px;height:33px}
.tree-node-modal{
  width:min(295px,90vw);
  padding:16px 16px 16px;
  border-radius:18px;
  border-color:rgba(239,214,135,.18);
  box-shadow:0 40px 90px -56px #000,inset 0 1px rgba(255,255,255,.035);
}
.tree-node-modal[hidden]{display:none}
.tree-node-modal-close{
  position:absolute;top:10px;right:10px;width:26px;height:26px;border-radius:50%;border:1px solid rgba(237,239,224,.12);
  background:rgba(255,255,255,.03);color:#d4d8cd;cursor:pointer;font-size:1rem;line-height:1;
}
.tree-node-modal-close:hover{border-color:rgba(237,239,224,.26);background:rgba(255,255,255,.05)}
.tree-node-modal .panel-index{padding-right:26px}
@media(max-width:1180px){
  .hero-full-stage-wrap{width:min(calc(100% - 20px),1280px)}
  .photo-tree-stage--full{min-height:800px}
}
@media(max-width:900px){
  .photo-tree-hero--fullbleed{padding-top:18px}
  .photo-tree-stage--full{min-height:700px;border-radius:24px}
  .photo-tree-stage--full .tree-photo-wrap{border-radius:24px;transform:translateX(34px) scale(1.045)}
  .hero-tree-intro{left:18px;top:16px;right:18px;max-width:360px}
  .photo-tree-stage--full .ecosystem-node--consumer{left:26%;top:42%}
  .photo-tree-stage--full .ecosystem-node--business{left:79%;top:42%}
  .photo-tree-stage--full .ecosystem-node--marketplace{left:55%;top:20%}
  .photo-tree-stage--full .ecosystem-node--platform{left:55%;top:47%}
  .photo-tree-stage--full .ecosystem-node--scheduling{left:13%;top:79%}
  .photo-tree-stage--full .ecosystem-node--payments{left:28%;top:81%}
  .photo-tree-stage--full .ecosystem-node--insurance{left:43%;top:83%}
  .photo-tree-stage--full .ecosystem-node--ai{left:59%;top:82%}
  .photo-tree-stage--full .ecosystem-node--analytics{left:74%;top:80%}
  .photo-tree-stage--full .ecosystem-node--integrations{left:88%;top:78%}
}
@media(max-width:760px){
  .hero-full-stage-wrap{width:min(calc(100% - 12px),860px)}
  .photo-tree-stage--full{min-height:620px}
  .photo-tree-stage--full .ecosystem-node{width:66px;height:66px}
  .photo-tree-stage--full .node-core{width:25px;height:25px;font-size:.62rem}
  .photo-tree-stage--full .ecosystem-node strong{display:none}
  .hero-tree-intro strong{font-size:.84rem}
  .tree-node-modal{left:4%!important;right:4%!important;top:auto!important;bottom:16px!important;width:auto}
}
@media(max-width:520px){
  .photo-tree-stage--full{min-height:540px}
  .photo-tree-stage--full .tree-photo-wrap{transform:translateX(18px) scale(1.075)}
  .hero-tree-intro{padding:12px 14px}
}
/* ============================================================
   FULL-WIDTH PHOTOREALISTIC TREE HERO REVISION - END
============================================================ */

/* ============================================================
   FULL FILLR WORDMARK - START
   Full brand lockup used consistently in navbar and footer.
============================================================ */
.logo--full{
  flex:0 0 auto;
  gap:0;
  font-size:0;
  line-height:0;
}
.brand-logo--full{
  width:178px;
  height:auto;
  max-height:68px;
  object-fit:contain;
  object-position:left center;
  filter:drop-shadow(0 8px 16px rgba(0,0,0,.32));
}
.footer .brand-logo--full{
  width:250px;
  height:auto;
  max-height:none;
}
.footer-logo-full{margin-bottom:16px}
@media(max-width:1180px){
  .brand-logo--full{width:158px}
}
@media(max-width:900px){
  .brand-logo--full{width:148px;max-height:58px}
  .footer .brand-logo--full{width:225px}
}
@media(max-width:520px){
  .brand-logo--full{width:140px;max-height:55px}
  .footer .brand-logo--full{width:205px}
}
/* ============================================================
   FULL FILLR WORDMARK - END
============================================================ */

/* ============================================================
   LAYERED TREE NAVIGATION REVISION - START
   Adds the left-side tree hierarchy and expanded interactive nodes.
============================================================ */
.photo-tree-stage--full{
  min-height:clamp(780px,calc(100svh - 96px),940px);
}
.photo-tree-stage--full .tree-photo-wrap{
  transform:translate3d(calc(var(--tree-x) + 60px),var(--tree-y),0) scale(1.035);
}
.photo-tree-stage--full .tree-core-glow{
  left:56%;bottom:20%;width:230px;height:230px;
}

.tree-layer-nav{
  position:absolute;
  z-index:11;
  left:clamp(18px,2.2vw,38px);
  top:50%;
  width:min(270px,21vw);
  transform:translateY(-50%);
  padding:20px;
  border:1px solid rgba(237,239,224,.13);
  border-radius:22px;
  background:linear-gradient(145deg,rgba(12,15,11,.9),rgba(6,8,5,.72));
  backdrop-filter:blur(22px);
  box-shadow:0 34px 84px -48px #000,inset 0 1px rgba(255,255,255,.045);
}
.tree-layer-eyebrow{
  display:block;
  color:#bca462;
  font:700 9px/1 "JetBrains Mono",monospace;
  letter-spacing:.17em;
  text-transform:uppercase;
}
.tree-layer-heading{
  display:block;
  max-width:215px;
  margin-top:10px;
  color:#f2f3ec;
  font:650 1rem/1.35 "Bricolage Grotesque",sans-serif;
}
.tree-layer-menu{display:grid;gap:7px;margin-top:17px}
.tree-layer-button{
  --layer-color:#d9c77a;
  position:relative;
  display:grid;
  grid-template-columns:29px 1fr;
  gap:10px;
  align-items:center;
  width:100%;
  min-height:54px;
  padding:9px 11px;
  border:1px solid rgba(237,239,224,.08);
  border-radius:14px;
  background:rgba(255,255,255,.018);
  color:#a7aba1;
  text-align:left;
  cursor:pointer;
  transition:border-color .28s,background .28s,color .28s,transform .28s;
}
.tree-layer-button::after{
  content:"";
  position:absolute;
  left:-1px;
  top:12px;
  bottom:12px;
  width:2px;
  border-radius:2px;
  background:var(--layer-color);
  opacity:0;
  box-shadow:0 0 18px var(--layer-color);
  transition:opacity .28s;
}
.tree-layer-button:hover,
.tree-layer-button:focus-visible{
  border-color:color-mix(in srgb,var(--layer-color) 32%,transparent);
  background:color-mix(in srgb,var(--layer-color) 7%,rgba(255,255,255,.018));
  color:#eceee7;
  transform:translateX(2px);
}
.tree-layer-button.active{
  border-color:color-mix(in srgb,var(--layer-color) 38%,transparent);
  background:linear-gradient(90deg,color-mix(in srgb,var(--layer-color) 11%,transparent),rgba(255,255,255,.018));
  color:#f1f2eb;
}
.tree-layer-button.active::after{opacity:1}
.tree-layer-button:focus-visible{outline:2px solid var(--layer-color);outline-offset:2px}
.tree-layer-index{
  display:grid;
  place-items:center;
  width:28px;
  height:28px;
  border:1px solid color-mix(in srgb,var(--layer-color) 28%,transparent);
  border-radius:50%;
  color:var(--layer-color);
  font:700 8px/1 "JetBrains Mono",monospace;
}
.tree-layer-button b{display:block;font-size:.77rem;line-height:1.2}
.tree-layer-button small{display:block;margin-top:3px;color:#777d72;font-size:.64rem;line-height:1.2}
.tree-layer-button.active small{color:color-mix(in srgb,var(--layer-color) 68%,#fff 20%)}

.photo-tree-stage--full .ecosystem-overlay{
  inset:0;
  width:100%;
  height:100%;
}
.network-base path{
  stroke:rgba(229,207,130,.11);
  stroke-width:1.35;
  transition:opacity .35s,stroke .35s;
}
.network-base path.layer-muted{opacity:.18}
.ecosystem-path{
  opacity:.05;
  stroke-width:2.4;
  stroke-dasharray:2 16;
  transition:opacity .38s,stroke-width .38s,filter .38s;
}
.ecosystem-path.active{
  opacity:.88;
  stroke-width:3.15;
  animation:pathTravel 2.15s linear infinite;
}
.ecosystem-path.hover-active{
  opacity:1;
  stroke-width:4.2;
  animation:pathTravel 1.35s linear infinite;
}

.photo-tree-stage--full .tree-node-v2{
  left:var(--x);
  top:var(--y);
  width:62px;
  height:62px;
  z-index:8;
  opacity:.2;
  filter:saturate(.72);
  transition:transform .34s var(--ease),opacity .34s,filter .34s;
}
.photo-tree-stage--full .tree-node-v2 .node-halo{inset:7px}
.photo-tree-stage--full .tree-node-v2 .node-core{
  width:25px;
  height:25px;
  font-size:.56rem;
}
.photo-tree-stage--full .tree-node-v2 strong{
  top:56px;
  max-width:145px;
  padding:5px 8px;
  opacity:0;
  transform:translate(-50%,4px);
  font-size:.58rem;
  pointer-events:none;
  transition:opacity .25s,transform .25s,color .25s,border-color .25s,background .25s;
}
.photo-tree-stage--full .tree-node-v2.layer-active{
  opacity:1;
  filter:none;
}
.photo-tree-stage--full .tree-node-v2.layer-active strong,
.photo-tree-stage--full .tree-node-v2:hover strong,
.photo-tree-stage--full .tree-node-v2:focus-visible strong,
.photo-tree-stage--full .tree-node-v2.hover-active strong{
  opacity:1;
  transform:translate(-50%,0);
}
.photo-tree-stage--full .tree-node-v2:hover,
.photo-tree-stage--full .tree-node-v2:focus-visible,
.photo-tree-stage--full .tree-node-v2.hover-active{
  opacity:1;
  filter:none;
  transform:translate(-50%,-50%) scale(1.16);
}
.photo-tree-stage--full .tree-node-v2.dim{opacity:.16}

.photo-tree-stage--full .node-canopy{width:60px;height:60px}
.photo-tree-stage--full .node-secondary{width:58px;height:58px}
.photo-tree-stage--full .node-primary{width:70px;height:70px}
.photo-tree-stage--full .node-primary .node-halo{inset:6px}
.photo-tree-stage--full .node-primary .node-core{width:29px;height:29px;font-size:.64rem}
.photo-tree-stage--full .node-primary strong{top:64px;font-size:.62rem}
.photo-tree-stage--full .node-root{width:56px;height:56px}
.photo-tree-stage--full .node-root .node-halo{inset:7px}
.photo-tree-stage--full .node-root .node-core{width:23px;height:23px;font-size:.52rem}
.photo-tree-stage--full .node-root strong{top:51px;font-size:.56rem}
.photo-tree-stage--full .node-trunk{
  width:94px;
  height:94px;
  opacity:1;
}
.photo-tree-stage--full .node-trunk .node-halo{
  inset:4px;
  border-color:rgba(239,215,134,.7);
  background:radial-gradient(circle,rgba(5,7,6,.94) 37%,rgba(213,177,95,.19) 39%,transparent 72%);
  box-shadow:0 0 0 8px rgba(213,177,95,.055),0 0 52px rgba(213,177,95,.32);
}
.photo-tree-stage--full .node-trunk .node-core--logo{
  width:48px;
  height:48px;
  padding:8px;
  border-color:rgba(239,215,134,.55);
  background:rgba(7,9,6,.88);
}
.node-core--logo img{display:block;width:100%;height:100%;object-fit:contain}
.photo-tree-stage--full .node-trunk strong{display:none}
.photo-tree-stage--full .node-trunk.layer-active{transform:translate(-50%,-50%) scale(1.08)}

.tree-node-tooltip{
  z-index:12;
  width:min(270px,88vw);
  min-height:0;
  padding:14px 15px 15px;
  pointer-events:none;
  border-color:rgba(239,214,135,.22);
  background:linear-gradient(145deg,rgba(17,20,15,.96),rgba(6,8,5,.94));
  box-shadow:0 30px 72px -42px #000,inset 0 1px rgba(255,255,255,.04);
}
.tree-node-tooltip .panel-index{padding:0;color:#bca462;font-size:8px}
.tree-node-tooltip strong{margin-top:8px;font-size:.98rem}
.tree-node-tooltip p{margin-top:6px;font-size:.7rem;line-height:1.5}
.tree-node-tooltip.updated{animation:tooltipIn .24s var(--ease)}
@keyframes tooltipIn{from{opacity:0;transform:translateY(6px) scale(.98)}to{opacity:1;transform:translateY(0) scale(1)}}

@media(max-width:1180px){
  .photo-tree-stage--full{min-height:820px}
  .tree-layer-nav{width:235px;padding:16px}
  .tree-layer-heading{font-size:.9rem}
  .tree-layer-button{min-height:48px;padding:7px 9px}
  .tree-layer-button b{font-size:.7rem}
  .tree-layer-button small{font-size:.58rem}
}
@media(max-width:900px){
  .photo-tree-stage--full{min-height:780px;padding-top:142px}
  .photo-tree-stage--full .tree-photo-wrap{transform:translateX(32px) scale(1.05)}
  .tree-layer-nav{
    left:14px;
    right:14px;
    top:14px;
    width:auto;
    transform:none;
    padding:13px;
    border-radius:18px;
  }
  .tree-layer-eyebrow,.tree-layer-heading{display:none}
  .tree-layer-menu{
    display:flex;
    gap:7px;
    margin-top:0;
    overflow-x:auto;
    scrollbar-width:none;
  }
  .tree-layer-menu::-webkit-scrollbar{display:none}
  .tree-layer-button{
    flex:0 0 auto;
    width:auto;
    min-width:148px;
    min-height:48px;
    grid-template-columns:25px 1fr;
  }
  .tree-layer-index{width:24px;height:24px}
  .photo-tree-stage--full .tree-node-v2{transform:translate(-50%,-50%) scale(.9)}
  .photo-tree-stage--full .tree-node-v2:hover,
  .photo-tree-stage--full .tree-node-v2:focus-visible,
  .photo-tree-stage--full .tree-node-v2.hover-active{transform:translate(-50%,-50%) scale(1.02)}
}
@media(max-width:760px){
  .photo-tree-stage--full{min-height:710px;padding-top:126px}
  .photo-tree-stage--full .tree-node-v2{width:46px;height:46px}
  .photo-tree-stage--full .tree-node-v2 .node-halo{inset:5px}
  .photo-tree-stage--full .tree-node-v2 .node-core{width:19px;height:19px;font-size:.42rem}
  .photo-tree-stage--full .tree-node-v2 strong{display:none}
  .photo-tree-stage--full .node-primary{width:52px;height:52px}
  .photo-tree-stage--full .node-trunk{width:72px;height:72px}
  .photo-tree-stage--full .node-trunk .node-core--logo{width:38px;height:38px;padding:6px}
  .tree-node-tooltip{left:4%!important;right:4%!important;top:auto!important;bottom:12px!important;width:auto}
}
@media(max-width:520px){
  .photo-tree-stage--full{min-height:650px;padding-top:116px}
  .photo-tree-stage--full .tree-photo-wrap{transform:translateX(18px) scale(1.085)}
  .tree-layer-nav{left:8px;right:8px;top:8px;padding:9px}
  .tree-layer-button{min-width:132px;min-height:44px;padding:6px 8px}
  .tree-layer-button b{font-size:.64rem}
  .tree-layer-button small{font-size:.54rem}
  .photo-tree-stage--full .tree-node-v2{width:39px;height:39px}
  .photo-tree-stage--full .tree-node-v2 .node-core{width:17px;height:17px;font-size:.38rem}
  .photo-tree-stage--full .node-trunk{width:62px;height:62px}
  .photo-tree-stage--full .node-trunk .node-core--logo{width:33px;height:33px}
}
/* ============================================================
   LAYERED TREE NAVIGATION REVISION - END
============================================================ */

/* Keep the core pulse centered on the updated trunk intersection. */
.photo-tree-stage--full .ecosystem-core{animation:svgCoreLayered 4.8s ease-in-out infinite}
@keyframes svgCoreLayered{50%{opacity:.95;transform:scale(1.12);transform-origin:560px 475px}}

/* ============================================================
   ABOVE-THE-FOLD TREE HERO REVISION - START
   Fits the complete interactive tree experience inside the desktop
   viewport while keeping the layer navigation vertically centered.
============================================================ */
@media (min-width:901px){
  .photo-tree-hero--fullbleed{
    box-sizing:border-box;
    height:calc(100svh - 74px);
    min-height:620px;
    padding:10px 0 12px;
    align-items:stretch;
  }
  .hero-full-stage-wrap{
    height:100%;
  }
  .photo-tree-stage--full{
    height:100%;
    min-height:0;
  }
  .tree-layer-nav{
    top:0;
    bottom:0;
    height:max-content;
    margin-block:auto;
    transform:none;
  }
}
/* ============================================================
   ABOVE-THE-FOLD TREE HERO REVISION - END
============================================================ */

/* ============================================================
   HERO ROOT-NODE CLEARANCE REVISION - START
   Adds breathing room beneath the lowest technology nodes while
   preserving the complete above-the-fold desktop composition.
============================================================ */
@media (min-width:901px){
  .photo-tree-hero--fullbleed{
    padding-bottom:54px;
  }
  .photo-tree-hero--fullbleed .scroll-cue{
    bottom:8px;
  }
  .photo-tree-hero--fullbleed .scroll-cue::before{
    height:18px;
  }
}
@media (max-width:900px){
  .photo-tree-hero--fullbleed{
    padding-bottom:34px;
  }
}
/* ============================================================
   HERO ROOT-NODE CLEARANCE REVISION - END
============================================================ */

/* ============================================================
   HERO ROOT-NODE CLIPPING FIX - START
   Allows node halos and labels to extend into the hero's reserved
   bottom clearance instead of being cropped by the tree stage.
============================================================ */
.photo-tree-stage--full{
  overflow:visible;
}
@media (min-width:901px){
  .photo-tree-hero--fullbleed{
    padding-bottom:76px;
  }
  .photo-tree-stage--full .node-root strong{
    top:49px;
  }
  .photo-tree-hero--fullbleed .scroll-cue{
    bottom:7px;
  }
}
@media (max-width:900px){
  .photo-tree-hero--fullbleed{
    padding-bottom:52px;
  }
}
/* ============================================================
   HERO ROOT-NODE CLIPPING FIX - END
============================================================ */

/* ============================================================
   VALUE CREATED EQUAL-HEIGHT CARDS - START
   Keeps the three outcome cards equal in height and vertically
   centers the card group alongside the editorial introduction.
============================================================ */
.outcome-grid{
  grid-template-columns:minmax(0,1.2fr) minmax(0,2.4fr);
  align-items:center;
  gap:42px;
}
.outcome-lead{
  padding-right:12px;
}
.outcome-cards{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:stretch;
  gap:18px;
}
.outcome-card{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:224px;
  padding:30px 24px 32px;
}
.outcome-card h3{
  margin-top:34px;
}
.outcome-card p{
  margin-top:10px;
}
@media (max-width:1100px){
  .outcome-grid{
    grid-template-columns:1fr;
    gap:34px;
  }
  .outcome-lead{
    padding-right:0;
  }
}
@media (max-width:760px){
  .outcome-cards{
    grid-template-columns:1fr;
  }
  .outcome-card{
    min-height:190px;
  }
}
/* ============================================================
   VALUE CREATED EQUAL-HEIGHT CARDS - END
============================================================ */

/* ============================================================
   HOMEPAGE PROMO BAR RESTORATION - START
   Restores the gold announcement strip while keeping the complete
   desktop tree composition within the initial viewport.
============================================================ */
.page-home > .promo{
  min-height:38px;
  padding-block:0;
  display:flex;
  align-items:center;
  justify-content:center;
}
@media (min-width:901px){
  .page-home .photo-tree-hero--fullbleed{
    height:calc(100svh - 112px);
  }
}
@media (max-width:520px){
  .page-home > .promo{
    min-height:42px;
    padding:6px 12px;
    line-height:1.25;
    flex-wrap:wrap;
  }
}
/* ============================================================
   HOMEPAGE PROMO BAR RESTORATION - END
============================================================ */


/* ============================================================
   FILLR APP GOLD + EXPANDABLE TREE MODALS - START
   Gold treatment follows the dimensional app CTA palette.
============================================================ */
.promo{
  color:#241906;
  background:
    linear-gradient(180deg,#c6a15b 0%,#d9b978 48%,#edd09a 100%);
  border-bottom:1px solid rgba(255,239,190,.48);
  box-shadow:
    inset 0 1px 0 rgba(255,248,218,.5),
    inset 0 -1px 0 rgba(104,73,20,.2),
    0 10px 28px -22px rgba(213,177,95,.9);
}
.promo a{color:#241906}

.tree-layer-heading{
  max-width:220px;
  font-size:.76rem;
  line-height:1.48;
  letter-spacing:-.01em;
}
.tree-layer-eyebrow{
  line-height:1.35;
}

.tree-node-tooltip{
  pointer-events:auto;
  width:min(280px,88vw);
  min-height:128px;
  padding:16px 48px 17px 17px;
  transition:width .26s var(--ease),min-height .26s var(--ease),padding .26s var(--ease),box-shadow .26s ease;
}
.tree-node-tooltip.is-expanded{
  width:min(380px,90vw);
  min-height:176px;
  padding:20px 54px 22px 21px;
  box-shadow:0 38px 90px -38px #000,inset 0 1px rgba(255,255,255,.055),0 0 0 1px rgba(239,214,135,.08);
}
.tree-node-tooltip.is-expanded strong{font-size:1.12rem}
.tree-node-tooltip.is-expanded p{font-size:.79rem;line-height:1.62;max-width:31rem}
.tree-tooltip-expand{
  position:absolute;
  top:12px;
  right:12px;
  width:29px;
  height:29px;
  display:grid;
  place-items:center;
  border:1px solid rgba(239,214,135,.22);
  border-radius:9px;
  background:rgba(255,255,255,.035);
  color:#ead18b;
  font-size:.9rem;
  line-height:1;
  transition:transform .2s var(--ease),background .2s,border-color .2s,color .2s;
}
.tree-tooltip-expand:hover,
.tree-tooltip-expand:focus-visible{
  transform:translateY(-1px);
  border-color:rgba(239,214,135,.48);
  background:rgba(213,177,95,.12);
  color:#fff0ba;
  outline:none;
}
.tree-node-tooltip.is-expanded .tree-tooltip-expand{
  background:rgba(213,177,95,.16);
  border-color:rgba(239,214,135,.42);
}
@media(max-width:760px){
  .tree-node-tooltip,
  .tree-node-tooltip.is-expanded{
    width:auto;
    min-height:0;
    padding:16px 50px 17px 17px;
  }
  .tree-node-tooltip.is-expanded{padding-bottom:22px}
}
/* ============================================================
   FILLR APP GOLD + EXPANDABLE TREE MODALS - END
============================================================ */


/* ============================================================
   PREMIUM SPLASH SCREEN - START
   A dedicated brand reveal that stays separate from the live tree.
   Append ?intro=1 to replay during client demonstrations.
============================================================ */
.premium-splash{display:none}
.fillr-intro-pending{background:#020302}
.fillr-intro-pending body{overflow:hidden}
.fillr-intro-pending .premium-splash{
  position:fixed;
  z-index:9999;
  inset:0;
  display:grid;
  place-items:center;
  overflow:hidden;
  isolation:isolate;
  color:#f8f5eb;
}
.premium-splash__curtain{
  position:absolute;
  z-index:-3;
  top:0;
  bottom:0;
  width:50.15%;
  background:
    radial-gradient(circle at 50% 50%,rgba(165,130,57,.08),transparent 40%),
    linear-gradient(180deg,#070907 0%,#020302 100%);
  transition:transform .95s cubic-bezier(.76,0,.18,1);
}
.premium-splash__curtain--left{left:0;border-right:1px solid rgba(226,198,121,.055)}
.premium-splash__curtain--right{right:0;border-left:1px solid rgba(226,198,121,.055)}
.premium-splash.is-leaving .premium-splash__curtain--left{transform:translateX(-101%)}
.premium-splash.is-leaving .premium-splash__curtain--right{transform:translateX(101%)}
.premium-splash__visual{position:absolute;inset:0;overflow:hidden;transition:opacity .42s ease .12s}
.premium-splash.is-leaving .premium-splash__visual{opacity:0}
.premium-splash__grid{
  position:absolute;inset:-25%;opacity:0;
  background-image:
    linear-gradient(rgba(231,209,148,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(231,209,148,.035) 1px,transparent 1px);
  background-size:72px 72px;
  transform:perspective(750px) rotateX(66deg) translateY(23%);
  transform-origin:center 66%;
  -webkit-mask-image:radial-gradient(ellipse at 50% 56%,#000 0%,transparent 68%);
  mask-image:radial-gradient(ellipse at 50% 56%,#000 0%,transparent 68%);
  animation:splashGridIn 1.4s ease .2s forwards;
}
.premium-splash__aurora{position:absolute;border-radius:50%;filter:blur(95px);mix-blend-mode:screen;opacity:0}
.premium-splash__aurora--gold{width:44vw;height:44vw;left:28%;top:24%;background:rgba(211,171,82,.18);animation:splashAurora 2.7s ease .15s forwards}
.premium-splash__aurora--sage{width:30vw;height:30vw;left:47%;top:17%;background:rgba(154,177,105,.12);animation:splashAurora 2.8s ease .7s forwards}
.premium-splash__beam{
  position:absolute;left:-35%;top:50%;width:170%;height:1px;
  background:linear-gradient(90deg,transparent 0%,rgba(189,151,64,.15) 35%,#ffe9a9 50%,rgba(189,151,64,.15) 65%,transparent 100%);
  box-shadow:0 0 18px rgba(241,205,115,.55),0 0 60px rgba(187,144,51,.24);
  opacity:0;transform:rotate(-7deg) translateX(-18%);
  animation:splashBeam 1.35s cubic-bezier(.22,.75,.2,1) .45s forwards;
}
.premium-splash__flare{
  position:absolute;left:50%;top:50%;width:8px;height:8px;border-radius:50%;
  background:#fff4c8;box-shadow:0 0 16px 6px rgba(255,225,143,.55),0 0 90px 28px rgba(193,148,54,.18);
  opacity:0;transform:translate(-50%,-50%) scale(.2);animation:splashFlare 1.15s ease .82s forwards;
}
.premium-splash__orbits{position:absolute;left:50%;top:50%;width:min(58vw,740px);aspect-ratio:1;transform:translate(-50%,-50%)}
.premium-splash__orbit{
  position:absolute;inset:0;border-radius:50%;opacity:0;
  border:1px solid transparent;
  background:linear-gradient(#050605,#050605) padding-box,
             conic-gradient(from 15deg,transparent 0 21%,rgba(238,212,143,.56) 27%,transparent 36% 70%,rgba(151,175,99,.28) 78%,transparent 88%) border-box;
  animation:splashOrbitIn 1.3s cubic-bezier(.2,.78,.2,1) .45s forwards,splashOrbitSpin 12s linear 1.2s infinite;
}
.premium-splash__orbit--two{inset:12%;animation-delay:.62s,1.35s;animation-duration:1.3s,15s;animation-direction:normal,reverse}
.premium-splash__orbit--three{inset:24%;animation-delay:.78s,1.5s;animation-duration:1.3s,10s}
.premium-splash__particles span{
  position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);border-radius:50%;
  background:#f4dda0;box-shadow:0 0 12px rgba(240,207,119,.75);opacity:0;
  animation:splashParticle 1.7s ease var(--d) infinite;
}
.premium-splash__content{
  position:relative;z-index:3;width:min(760px,88vw);display:flex;flex-direction:column;align-items:center;text-align:center;
  transition:opacity .28s ease,transform .48s cubic-bezier(.4,0,.2,1),filter .42s ease;
}
.premium-splash.is-leaving .premium-splash__content{opacity:0;transform:scale(.96);filter:blur(8px)}
.premium-splash__emblem{
  position:relative;width:132px;height:132px;display:grid;place-items:center;border-radius:50%;
  opacity:0;transform:scale(.55);animation:splashEmblemIn .9s cubic-bezier(.16,.86,.2,1) .48s forwards;
}
.premium-splash__emblem img{position:relative;z-index:3;width:68px;height:68px;object-fit:contain;filter:drop-shadow(0 10px 28px rgba(0,0,0,.45)) drop-shadow(0 0 15px rgba(245,216,137,.35))}
.premium-splash__emblem-halo{position:absolute;inset:-36%;border-radius:50%;background:radial-gradient(circle,rgba(237,204,115,.2),rgba(175,135,47,.06) 42%,transparent 69%);animation:splashHalo 2.1s ease .6s both}
.premium-splash__emblem-ring{position:absolute;inset:8px;border-radius:50%;border:1px solid rgba(255,232,167,.42);box-shadow:inset 0 0 18px rgba(245,217,138,.08),0 0 30px rgba(190,144,44,.12);animation:splashRingPulse 1.45s ease .7s both}
.premium-splash__emblem-ring--outer{inset:-10px;border-color:rgba(179,198,113,.18);animation-delay:.9s}
.premium-splash__emblem-shine{position:absolute;z-index:4;inset:7px;border-radius:50%;overflow:hidden}
.premium-splash__emblem-shine::after{content:"";position:absolute;top:-30%;bottom:-30%;width:28%;left:-42%;background:linear-gradient(90deg,transparent,rgba(255,248,220,.6),transparent);transform:skewX(-18deg);animation:splashShine 1.1s ease 1.05s forwards}
.premium-splash__wordmark{
  display:block;width:min(264px,39.6vw);height:auto;margin-top:28px;object-fit:contain;
  opacity:0;transform:translateY(15px) scale(.98);
  filter:drop-shadow(0 12px 34px rgba(0,0,0,.56));
  animation:splashWordmark 1s cubic-bezier(.2,.76,.18,1) .92s forwards;
}
.premium-splash__eyebrow{
  max-width:620px;margin:18px 0 0;color:rgba(246,242,229,.78);
  font:600 clamp(.72rem,1.35vw,.92rem)/1.45 'DM Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;
  opacity:0;transform:translateY(10px);animation:splashCopyIn .72s ease 1.45s forwards;
}
.premium-splash__signals{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px;margin-top:26px;opacity:0;animation:splashCopyIn .65s ease 1.75s forwards}
.premium-splash__signals span{color:#cfbc85;font:700 .62rem/1 'JetBrains Mono',monospace;letter-spacing:.14em;text-transform:uppercase}
.premium-splash__signals i{width:3px;height:3px;border-radius:50%;background:#e6c56f;box-shadow:0 0 8px rgba(230,197,111,.65)}
.premium-splash__progress{position:relative;width:min(340px,62vw);height:1px;margin-top:30px;background:rgba(255,255,255,.1);overflow:hidden;opacity:0;animation:splashCopyIn .4s ease 1.65s forwards}
.premium-splash__progress span{display:block;width:100%;height:100%;transform:translateX(-100%);background:linear-gradient(90deg,#775019,#c99e46 40%,#fff0b2 70%,#a4b766);box-shadow:0 0 16px rgba(229,194,100,.45);animation:splashProgress 1.55s cubic-bezier(.2,.7,.2,1) 1.72s forwards}
.premium-splash__skip{
  position:absolute;z-index:5;right:clamp(18px,3vw,46px);top:clamp(18px,3vw,38px);
  padding:10px 14px;border:1px solid rgba(237,239,224,.16);border-radius:999px;
  color:rgba(244,244,236,.66);background:rgba(8,10,7,.38);backdrop-filter:blur(14px);
  font:600 .72rem/1 'DM Sans',sans-serif;letter-spacing:.02em;cursor:pointer;
  opacity:0;animation:splashSkipIn .45s ease .6s forwards;transition:border-color .2s,color .2s,background .2s;
}
.premium-splash__skip:hover,.premium-splash__skip:focus-visible{color:#fff;border-color:rgba(232,205,124,.48);background:rgba(14,17,12,.76)}
.fillr-intro-pending .photo-tree-hero .tree-photo,
.fillr-intro-pending .photo-tree-hero .tree-core-glow,
.fillr-intro-pending .photo-tree-hero .ecosystem-path,
.fillr-intro-pending .photo-tree-hero .ecosystem-core,
.fillr-intro-pending .photo-tree-hero .ecosystem-node{animation-play-state:paused!important}
@keyframes splashGridIn{to{opacity:.78;transform:perspective(750px) rotateX(66deg) translateY(15%)}}
@keyframes splashAurora{0%{opacity:0;transform:scale(.72)}45%{opacity:1}100%{opacity:.68;transform:scale(1.08)}}
@keyframes splashBeam{0%{opacity:0;transform:rotate(-7deg) translateX(-18%)}35%{opacity:1}100%{opacity:0;transform:rotate(-7deg) translateX(18%)}}
@keyframes splashFlare{0%{opacity:0;transform:translate(-50%,-50%) scale(.2)}42%{opacity:1}100%{opacity:.55;transform:translate(-50%,-50%) scale(1)}}
@keyframes splashOrbitIn{0%{opacity:0;transform:scale(.72) rotate(-22deg)}100%{opacity:.6;transform:scale(1) rotate(0)}}
@keyframes splashOrbitSpin{to{transform:rotate(360deg)}}
@keyframes splashParticle{0%,100%{opacity:0;transform:translateY(8px) scale(.5)}42%{opacity:.72}72%{opacity:.18;transform:translateY(-12px) scale(1)}}
@keyframes splashEmblemIn{to{opacity:1;transform:scale(1)}}
@keyframes splashHalo{0%{opacity:0;transform:scale(.55)}50%{opacity:1}100%{opacity:.7;transform:scale(1.08)}}
@keyframes splashRingPulse{0%{opacity:0;transform:scale(.62)}52%{opacity:1}100%{opacity:.48;transform:scale(1.16)}}
@keyframes splashShine{to{left:118%}}
@keyframes splashWordmark{to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes splashCopyIn{to{opacity:1;transform:translateY(0)}}
@keyframes splashProgress{to{transform:translateX(0)}}
@keyframes splashSkipIn{to{opacity:1}}
@media(max-width:700px){
  .premium-splash__orbits{width:min(92vw,580px)}
  .premium-splash__emblem{width:108px;height:108px}
  .premium-splash__emblem img{width:56px;height:56px}
  .premium-splash__wordmark{width:min(47vw,216px);margin-top:22px}
  .premium-splash__eyebrow{max-width:86vw;font-size:.66rem;letter-spacing:.13em}
  .premium-splash__signals{max-width:88vw;gap:8px}
  .premium-splash__signals span{font-size:.55rem}
}
@media(max-width:460px){
  .premium-splash__signals i:nth-of-type(2),.premium-splash__signals span:nth-of-type(3){display:none}
  .premium-splash__skip{top:16px;right:16px}
}
@media(prefers-reduced-motion:reduce){.premium-splash{display:none!important}}
/* ============================================================
   PREMIUM SPLASH SCREEN - END
============================================================ */

/* ============================================================
   GLOSSY SAGE-GREEN ANNOUNCEMENT BAR - START
   Smooth, reflective olive-sage treatment inspired by the app.
============================================================ */
.promo{
  overflow:hidden;
  isolation:isolate;
  color:#f5f4ec;
  text-shadow:0 1px 1px rgba(8,12,8,.42);
  border-bottom:1px solid rgba(189,205,160,.26);
  background:
    linear-gradient(
      108deg,
      transparent 0%,
      transparent 40%,
      rgba(242,247,226,.03) 45%,
      rgba(236,244,211,.28) 50%,
      rgba(234,242,214,.07) 55%,
      transparent 61%,
      transparent 100%
    ) 155% 0 / 250% 100% no-repeat,
    linear-gradient(
      180deg,
      #354232 0%,
      #59694d 38%,
      #748260 54%,
      #44523d 100%
    );
  box-shadow:
    inset 0 1px 0 rgba(225,235,201,.22),
    inset 0 -1px 0 rgba(15,23,15,.38),
    0 8px 22px -20px rgba(105,128,82,.46);
  animation:promoGreenSheen 7.5s ease-in-out infinite;
}
.promo::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(225,236,203,.09),transparent 48%);
}
.promo::after{content:none}
.promo a{
  color:#f7f5ed;
  font-weight:800;
  text-decoration-color:rgba(222,231,200,.45);
}
.promo .pulse-dot{
  background:#d4e2ad;
  box-shadow:0 0 0 3px rgba(210,225,171,.12),0 0 12px rgba(205,224,159,.28);
}
@keyframes promoGreenSheen{
  0%,24%{background-position:155% 0,0 0}
  62%,100%{background-position:-80% 0,0 0}
}
@media (prefers-reduced-motion:reduce){
  .promo{animation:none;background-position:50% 0,0 0}
}
/* ============================================================
   GLOSSY SAGE-GREEN ANNOUNCEMENT BAR - END
============================================================ */

/* ============================================================
   SECONDARY-BRANCH ANNOUNCEMENT BAR - START
   Adapts the green-and-gold Secondary Branches navigation style
   into a full-width announcement bar while retaining the sheen.
============================================================ */
.promo{
  overflow:hidden;
  isolation:isolate;
  color:#f2f1e9;
  text-shadow:0 1px 1px rgba(3,7,4,.55);
  border-top:1px solid rgba(213,177,95,.28);
  border-bottom:1px solid rgba(213,177,95,.58);
  background:
    linear-gradient(
      108deg,
      transparent 0%,
      transparent 40%,
      rgba(244,229,178,0) 44%,
      rgba(244,229,178,.22) 50%,
      rgba(244,229,178,.055) 56%,
      transparent 62%,
      transparent 100%
    ) 155% 0 / 250% 100% no-repeat,
    radial-gradient(circle at 48% -95%,rgba(112,139,86,.24),transparent 58%),
    linear-gradient(100deg,#09110b 0%,#111b12 18%,#21301e 48%,#162318 78%,#0a120c 100%);
  box-shadow:
    inset 0 1px 0 rgba(239,214,135,.11),
    inset 0 -1px 0 rgba(213,177,95,.13),
    0 8px 22px -20px rgba(213,177,95,.32);
  animation:promoBranchSheen 7.5s ease-in-out infinite;
}
.promo::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(157,184,128,.055),transparent 52%);
}
.promo::after{content:none}
.promo a{
  color:#dfc475;
  font-weight:800;
  text-decoration-color:rgba(213,177,95,.4);
  text-underline-offset:3px;
}
.promo .pulse-dot{
  background:#d5b15f;
  box-shadow:0 0 0 3px rgba(213,177,95,.1),0 0 12px rgba(213,177,95,.3);
}
@keyframes promoBranchSheen{
  0%,24%{background-position:155% 0,center,center}
  62%,100%{background-position:-80% 0,center,center}
}
@media (prefers-reduced-motion:reduce){
  .promo{animation:none;background-position:50% 0,center,center}
}
/* ============================================================
   SECONDARY-BRANCH ANNOUNCEMENT BAR - END
============================================================ */




/* ============================================================
   GLASSMORPHISM NAVIGATION ACCENTS - START
   Smoked green glass announcement bar and restrained
   champagne-gold glass Download App CTA.
============================================================ */
.promo{
  overflow:hidden;
  isolation:isolate;
  color:#f3f2ea;
  border-top:1px solid rgba(221,190,119,.18);
  border-bottom:1px solid rgba(221,190,119,.40);
  background:
    linear-gradient(
      108deg,
      transparent 0%,
      transparent 40%,
      rgba(247,232,184,0) 44%,
      rgba(247,232,184,.18) 50%,
      rgba(247,232,184,.045) 56%,
      transparent 62%,
      transparent 100%
    ) 155% 0 / 250% 100% no-repeat,
    radial-gradient(circle at 50% -120%,rgba(134,161,105,.18),transparent 62%),
    linear-gradient(100deg,rgba(8,16,10,.88),rgba(23,38,25,.80) 48%,rgba(10,20,13,.88));
  -webkit-backdrop-filter:blur(18px) saturate(118%);
  backdrop-filter:blur(18px) saturate(118%);
  box-shadow:
    inset 0 1px 0 rgba(255,245,215,.10),
    inset 0 -1px 0 rgba(211,177,95,.09),
    0 10px 28px -24px rgba(173,198,142,.22);
  text-shadow:0 1px 1px rgba(0,0,0,.46);
  animation:promoGlassSheen 7.5s ease-in-out infinite;
}
.promo::before{
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:linear-gradient(180deg,rgba(255,255,255,.055),transparent 48%);
}
.promo::after{content:none}
.promo a{
  color:#dec27a;
  font-weight:800;
  text-decoration-color:rgba(222,194,122,.34);
  text-underline-offset:3px;
}
.promo .pulse-dot{
  background:#d5b767;
  box-shadow:0 0 0 3px rgba(213,183,103,.08),0 0 10px rgba(213,183,103,.22);
}
@keyframes promoGlassSheen{
  0%,24%{background-position:155% 0,center,center}
  62%,100%{background-position:-80% 0,center,center}
}

.nav-actions .btn--primary[href="download.html"]{
  color:#211b11;
  border-color:rgba(255,232,179,.38);
  background:
    linear-gradient(135deg,rgba(229,207,157,.90),rgba(200,170,110,.86) 52%,rgba(173,139,82,.88));
  -webkit-backdrop-filter:blur(12px) saturate(112%);
  backdrop-filter:blur(12px) saturate(112%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.26),
    inset 0 -1px 0 rgba(91,61,22,.18),
    0 8px 24px rgba(0,0,0,.20);
  text-shadow:0 1px 0 rgba(255,247,225,.20);
}
.nav-actions .btn--primary[href="download.html"]:hover{
  color:#18130b;
  border-color:rgba(255,239,199,.54);
  background:
    linear-gradient(135deg,rgba(237,218,173,.94),rgba(211,183,124,.90) 52%,rgba(186,151,91,.92));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.32),
    inset 0 -1px 0 rgba(91,61,22,.16),
    0 10px 26px rgba(0,0,0,.23);
}
.nav-actions .btn--primary[href="download.html"]::before,
.nav-actions .btn--primary[href="download.html"]::after{
  content:none!important;
  animation:none!important;
}

@media(max-width:900px){
  .nav-mobile-app{
    width:fit-content;
    margin-top:8px;
    padding:11px 18px!important;
    border:1px solid rgba(255,232,179,.32);
    border-radius:999px;
    color:#211b11!important;
    background:linear-gradient(135deg,rgba(229,207,157,.90),rgba(200,170,110,.86) 52%,rgba(173,139,82,.88));
    box-shadow:inset 0 1px 0 rgba(255,255,255,.24),0 8px 20px rgba(0,0,0,.18);
  }
  .nav-mobile-app::after{display:none!important}
}

@media(prefers-reduced-motion:reduce){
  .promo{animation:none;background-position:50% 0,center,center}
}
/* ============================================================
   GLASSMORPHISM NAVIGATION ACCENTS - END
============================================================ */

/* ============================================================
   LIQUID GLASS DOWNLOAD CTA - START
   Neutral, colorless glass treatment inspired by refractive UI.
============================================================ */
.nav-actions .btn--primary[href="download.html"]{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#f7f8f4;
  border:1px solid rgba(255,255,255,.28);
  background:
    radial-gradient(circle at 28% 8%,rgba(255,255,255,.24),transparent 36%),
    linear-gradient(135deg,rgba(255,255,255,.17),rgba(255,255,255,.075) 48%,rgba(255,255,255,.12));
  -webkit-backdrop-filter:blur(18px) saturate(145%);
  backdrop-filter:blur(18px) saturate(145%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(255,255,255,.07),
    0 8px 22px rgba(0,0,0,.20),
    0 0 0 1px rgba(255,255,255,.025);
  text-shadow:0 1px 1px rgba(0,0,0,.34);
}
.nav-actions .btn--primary[href="download.html"]::before{
  content:""!important;
  position:absolute;
  z-index:-1;
  inset:1px;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.10),transparent 48%),
    radial-gradient(circle at 76% 112%,rgba(208,220,210,.11),transparent 45%);
  opacity:1;
  animation:none!important;
  transform:none!important;
}
.nav-actions .btn--primary[href="download.html"]::after{
  content:""!important;
  position:absolute;
  z-index:-1;
  top:-45%;
  left:14%;
  width:72%;
  height:76%;
  border-radius:50%;
  pointer-events:none;
  background:rgba(255,255,255,.08);
  filter:blur(12px);
  animation:none!important;
  transform:none!important;
}
.nav-actions .btn--primary[href="download.html"]:hover{
  color:#fff;
  border-color:rgba(255,255,255,.40);
  background:
    radial-gradient(circle at 28% 8%,rgba(255,255,255,.30),transparent 38%),
    linear-gradient(135deg,rgba(255,255,255,.22),rgba(255,255,255,.10) 48%,rgba(255,255,255,.16));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -1px 0 rgba(255,255,255,.09),
    0 10px 26px rgba(0,0,0,.24),
    0 0 0 1px rgba(255,255,255,.04);
}

@media(max-width:900px){
  .nav-mobile-app{
    color:#f7f8f4!important;
    border:1px solid rgba(255,255,255,.26)!important;
    background:
      radial-gradient(circle at 28% 8%,rgba(255,255,255,.22),transparent 38%),
      linear-gradient(135deg,rgba(255,255,255,.16),rgba(255,255,255,.07) 48%,rgba(255,255,255,.11))!important;
    -webkit-backdrop-filter:blur(18px) saturate(145%);
    backdrop-filter:blur(18px) saturate(145%);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.30),
      inset 0 -1px 0 rgba(255,255,255,.06),
      0 8px 20px rgba(0,0,0,.20)!important;
    text-shadow:0 1px 1px rgba(0,0,0,.34);
  }
}
/* ============================================================
   LIQUID GLASS DOWNLOAD CTA - END
============================================================ */

/* ============================================================
   LIQUID GLASS NAV REFINEMENT - START
   Gold-lit outline, stronger frost, translucent CTA, and an
   approximately 80% opaque navbar surface.
============================================================ */
.nav,
.nav.scrolled{
  background:rgba(5,7,6,.80);
  -webkit-backdrop-filter:blur(22px) saturate(128%);
  backdrop-filter:blur(22px) saturate(128%);
}
.nav.scrolled{
  border-bottom-color:rgba(237,239,224,.08);
  box-shadow:0 16px 42px -34px rgba(0,0,0,.72);
}

.nav-actions .btn--primary[href="download.html"]{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#f7f6f0;
  border:1px solid transparent;
  background:
    radial-gradient(circle at 26% 5%,rgba(255,255,255,.27),transparent 38%) padding-box,
    linear-gradient(135deg,rgba(255,255,255,.145),rgba(255,255,255,.055) 48%,rgba(255,255,255,.105)) padding-box,
    linear-gradient(120deg,rgba(177,139,67,.72),rgba(239,211,145,.94) 46%,rgba(157,118,52,.70) 100%) border-box;
  -webkit-backdrop-filter:blur(28px) saturate(150%);
  backdrop-filter:blur(28px) saturate(150%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.36),
    inset 0 -1px 0 rgba(255,255,255,.055),
    0 9px 24px rgba(0,0,0,.22),
    0 0 18px rgba(209,174,101,.075);
  text-shadow:0 1px 1px rgba(0,0,0,.38);
}
.nav-actions .btn--primary[href="download.html"]::before{
  content:""!important;
  position:absolute;
  z-index:-1;
  inset:1px;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.13),transparent 46%),
    radial-gradient(circle at 72% 118%,rgba(211,224,213,.12),transparent 48%);
  opacity:1;
  animation:none!important;
  transform:none!important;
}
.nav-actions .btn--primary[href="download.html"]::after{
  content:""!important;
  position:absolute;
  z-index:2;
  inset:-1px;
  padding:1px;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(110deg,transparent 30%,rgba(255,244,208,0) 39%,rgba(255,244,208,.92) 49%,rgba(229,192,112,.72) 54%,rgba(255,244,208,0) 64%,transparent 74%) 165% 0 / 240% 100% no-repeat;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:downloadGlassBorderShine 6.8s ease-in-out infinite!important;
  transform:none!important;
}
.nav-actions .btn--primary[href="download.html"]:hover{
  color:#fff;
  background:
    radial-gradient(circle at 26% 5%,rgba(255,255,255,.32),transparent 40%) padding-box,
    linear-gradient(135deg,rgba(255,255,255,.19),rgba(255,255,255,.075) 48%,rgba(255,255,255,.13)) padding-box,
    linear-gradient(120deg,rgba(190,149,72,.82),rgba(248,222,159,.98) 46%,rgba(173,130,57,.80) 100%) border-box;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -1px 0 rgba(255,255,255,.07),
    0 11px 28px rgba(0,0,0,.25),
    0 0 22px rgba(209,174,101,.11);
}
@keyframes downloadGlassBorderShine{
  0%,28%{background-position:165% 0}
  58%,100%{background-position:-78% 0}
}

@media(max-width:900px){
  .nav-mobile-app{
    position:relative;
    isolation:isolate;
    overflow:hidden;
    color:#f7f6f0!important;
    border:1px solid rgba(220,184,108,.72)!important;
    background:
      radial-gradient(circle at 26% 5%,rgba(255,255,255,.24),transparent 38%),
      linear-gradient(135deg,rgba(255,255,255,.14),rgba(255,255,255,.05) 48%,rgba(255,255,255,.10))!important;
    -webkit-backdrop-filter:blur(28px) saturate(150%);
    backdrop-filter:blur(28px) saturate(150%);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.34),
      0 9px 22px rgba(0,0,0,.22),
      0 0 16px rgba(209,174,101,.07)!important;
  }
  .nav-mobile-app::after{
    display:block!important;
    content:""!important;
    position:absolute;
    inset:-1px;
    padding:1px;
    border-radius:inherit;
    pointer-events:none;
    background:linear-gradient(110deg,transparent 30%,rgba(255,244,208,0) 39%,rgba(255,244,208,.86) 49%,rgba(229,192,112,.65) 54%,rgba(255,244,208,0) 64%,transparent 74%) 165% 0 / 240% 100% no-repeat;
    -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
    -webkit-mask-composite:xor;
    mask-composite:exclude;
    animation:downloadGlassBorderShine 6.8s ease-in-out infinite!important;
  }
}

@media(prefers-reduced-motion:reduce){
  .nav-actions .btn--primary[href="download.html"]::after,
  .nav-mobile-app::after{
    animation:none!important;
    background-position:50% 0;
  }
}
/* ============================================================
   LIQUID GLASS NAV REFINEMENT - END
============================================================ */

/* ============================================================
   NEUTRAL FROSTED DOWNLOAD CTA - START
   Keeps the gold accent on the outline only. The button fill is
   fully neutral, translucent glass with stronger background frost.
============================================================ */
.nav-actions .btn--primary[href="download.html"]{
  color:#f7f8f5;
  border:1px solid rgba(218,181,104,.72);
  background:
    radial-gradient(circle at 26% 0%,rgba(255,255,255,.18),transparent 42%),
    linear-gradient(145deg,rgba(255,255,255,.12),rgba(255,255,255,.035) 52%,rgba(255,255,255,.075));
  -webkit-backdrop-filter:blur(32px) saturate(132%);
  backdrop-filter:blur(32px) saturate(132%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(255,255,255,.045),
    0 9px 24px rgba(0,0,0,.22),
    0 0 0 1px rgba(255,255,255,.025);
  text-shadow:0 1px 1px rgba(0,0,0,.42);
}
.nav-actions .btn--primary[href="download.html"]::before{
  background:
    linear-gradient(180deg,rgba(255,255,255,.11),transparent 45%),
    radial-gradient(circle at 72% 118%,rgba(204,219,207,.10),transparent 48%);
}
.nav-actions .btn--primary[href="download.html"]:hover{
  color:#fff;
  border-color:rgba(235,204,137,.88);
  background:
    radial-gradient(circle at 26% 0%,rgba(255,255,255,.23),transparent 43%),
    linear-gradient(145deg,rgba(255,255,255,.16),rgba(255,255,255,.055) 52%,rgba(255,255,255,.10));
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 11px 28px rgba(0,0,0,.25),
    0 0 14px rgba(209,174,101,.06);
}

@media(max-width:900px){
  .nav-mobile-app{
    color:#f7f8f5!important;
    border:1px solid rgba(218,181,104,.68)!important;
    background:
      radial-gradient(circle at 26% 0%,rgba(255,255,255,.17),transparent 42%),
      linear-gradient(145deg,rgba(255,255,255,.115),rgba(255,255,255,.035) 52%,rgba(255,255,255,.07))!important;
    -webkit-backdrop-filter:blur(32px) saturate(132%);
    backdrop-filter:blur(32px) saturate(132%);
    box-shadow:
      inset 0 1px 0 rgba(255,255,255,.32),
      inset 0 -1px 0 rgba(255,255,255,.04),
      0 9px 22px rgba(0,0,0,.22)!important;
  }
}
/* ============================================================
   NEUTRAL FROSTED DOWNLOAD CTA - END
============================================================ */

/* ============================================================
   SUBTLE CHAMPAGNE LIQUID GLASS CTA - START
   Adds a restrained gold warmth to the neutral frosted glass fill
   while preserving translucency, blur, and the illuminated outline.
============================================================ */
.nav-actions .btn--primary[href="download.html"]{
  background:
    radial-gradient(circle at 24% 0%,rgba(255,255,255,.20),transparent 42%),
    radial-gradient(circle at 82% 118%,rgba(218,181,104,.10),transparent 50%),
    linear-gradient(145deg,
      rgba(226,205,161,.13),
      rgba(255,255,255,.055) 48%,
      rgba(197,159,88,.09)
    );
  -webkit-backdrop-filter:blur(32px) saturate(128%);
  backdrop-filter:blur(32px) saturate(128%);
}
.nav-actions .btn--primary[href="download.html"]::before{
  background:
    linear-gradient(180deg,rgba(255,255,255,.13),transparent 46%),
    radial-gradient(circle at 72% 118%,rgba(221,190,127,.12),transparent 50%);
}
.nav-actions .btn--primary[href="download.html"]:hover{
  background:
    radial-gradient(circle at 24% 0%,rgba(255,255,255,.25),transparent 42%),
    radial-gradient(circle at 82% 118%,rgba(218,181,104,.14),transparent 50%),
    linear-gradient(145deg,
      rgba(231,211,171,.17),
      rgba(255,255,255,.075) 48%,
      rgba(201,163,92,.12)
    );
}

@media(max-width:900px){
  .nav-mobile-app{
    background:
      radial-gradient(circle at 24% 0%,rgba(255,255,255,.19),transparent 42%),
      radial-gradient(circle at 82% 118%,rgba(218,181,104,.09),transparent 50%),
      linear-gradient(145deg,
        rgba(226,205,161,.12),
        rgba(255,255,255,.05) 48%,
        rgba(197,159,88,.08)
      )!important;
  }
}
/* ============================================================
   SUBTLE CHAMPAGNE LIQUID GLASS CTA - END
============================================================ */


/* ============================================================
   OPAQUE GOLD DOWNLOAD LABEL WITH SHIMMER OVERLAY - START
   The base label stays fully opaque and readable. A separate,
   lower-opacity overlay carries the reflective gold movement.
============================================================ */
.nav-download-label{
  position:relative;
  display:inline-block;
  color:#ffe4a3;
  -webkit-text-fill-color:#ffe4a3;
  font-weight:750;
  letter-spacing:.005em;
  text-shadow:
    0 1px 1px rgba(0,0,0,.55),
    0 0 7px rgba(226,187,96,.22);
  filter:none;
}
.nav-download-label::after{
  content:"Download App";
  position:absolute;
  inset:0;
  pointer-events:none;
  color:transparent;
  background:linear-gradient(
    105deg,
    transparent 0%,
    transparent 34%,
    rgba(255,249,220,.35) 42%,
    rgba(255,255,246,.92) 49%,
    rgba(255,232,158,.46) 56%,
    transparent 66%,
    transparent 100%
  ) 145% 50% / 245% 100% no-repeat;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  opacity:.72;
  animation:downloadLabelShine 6.8s ease-in-out infinite;
}
.nav-actions .btn--primary[href="download.html"]:hover .nav-download-label,
.nav-mobile-app:hover .nav-download-label{
  color:#fff0bd;
  -webkit-text-fill-color:#fff0bd;
  text-shadow:
    0 1px 1px rgba(0,0,0,.48),
    0 0 9px rgba(235,199,113,.30);
}
@keyframes downloadLabelShine{
  0%,28%{background-position:145% 50%}
  58%,100%{background-position:-72% 50%}
}
@media(prefers-reduced-motion:reduce){
  .nav-download-label::after{
    animation:none;
    background-position:50% 50%;
    opacity:.38;
  }
}
/* ============================================================
   OPAQUE GOLD DOWNLOAD LABEL WITH SHIMMER OVERLAY - END
============================================================ */

/* ============================================================
   70% LIQUID GLASS NAVBAR - START
   Lowers the navbar surface opacity while retaining blur,
   saturation, border definition, and readable foreground content.
============================================================ */
.nav,
.nav.scrolled{
  background:rgba(5,7,6,.70);
  -webkit-backdrop-filter:blur(24px) saturate(132%);
  backdrop-filter:blur(24px) saturate(132%);
}
.nav.scrolled{
  border-bottom-color:rgba(237,239,224,.075);
  box-shadow:0 16px 42px -34px rgba(0,0,0,.68);
}
@media(max-width:900px){
  .nav-links{
    background:rgba(5,7,6,.72);
    -webkit-backdrop-filter:blur(24px) saturate(132%);
    backdrop-filter:blur(24px) saturate(132%);
  }
}
/* ============================================================
   70% LIQUID GLASS NAVBAR - END
============================================================ */


/* ============================================================
   GLOBAL LIQUID GLASS PRIMARY CTA - START
   Extends the navbar Download App treatment to every CTA that
   previously used a solid gold fill. The glass remains translucent,
   with a champagne tint, illuminated gold outline, and readable label.
============================================================ */
.btn.btn--primary{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  color:#ffe4a3;
  -webkit-text-fill-color:#ffe4a3;
  border:1px solid rgba(218,181,104,.72);
  background:
    radial-gradient(circle at 24% 0%,rgba(255,255,255,.20),transparent 42%),
    radial-gradient(circle at 82% 118%,rgba(218,181,104,.10),transparent 50%),
    linear-gradient(145deg,
      rgba(226,205,161,.13),
      rgba(255,255,255,.055) 48%,
      rgba(197,159,88,.09)
    );
  -webkit-backdrop-filter:blur(32px) saturate(128%);
  backdrop-filter:blur(32px) saturate(128%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.34),
    inset 0 -1px 0 rgba(255,255,255,.045),
    0 10px 25px rgba(0,0,0,.22),
    0 0 0 1px rgba(255,255,255,.025),
    0 0 16px rgba(209,174,101,.05);
  text-shadow:0 1px 1px rgba(0,0,0,.48);
}
.btn.btn--primary > *{
  position:relative;
  z-index:2;
}
.btn.btn--primary::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  pointer-events:none;
  background:
    linear-gradient(180deg,rgba(255,255,255,.13),transparent 46%),
    radial-gradient(circle at 72% 118%,rgba(221,190,127,.12),transparent 50%);
}
.btn.btn--primary::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:1;
  padding:1px;
  border-radius:inherit;
  pointer-events:none;
  background:linear-gradient(
    110deg,
    transparent 30%,
    rgba(255,244,208,0) 39%,
    rgba(255,244,208,.82) 49%,
    rgba(229,192,112,.60) 54%,
    rgba(255,244,208,0) 64%,
    transparent 74%
  ) 165% 0 / 240% 100% no-repeat;
  -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);
  -webkit-mask-composite:xor;
  mask-composite:exclude;
  animation:downloadGlassBorderShine 6.8s ease-in-out infinite;
}
.btn.btn--primary:hover{
  color:#fff0bd;
  -webkit-text-fill-color:#fff0bd;
  border-color:rgba(235,204,137,.88);
  background:
    radial-gradient(circle at 24% 0%,rgba(255,255,255,.25),transparent 42%),
    radial-gradient(circle at 82% 118%,rgba(218,181,104,.14),transparent 50%),
    linear-gradient(145deg,
      rgba(231,211,171,.17),
      rgba(255,255,255,.075) 48%,
      rgba(201,163,92,.12)
    );
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.42),
    inset 0 -1px 0 rgba(255,255,255,.06),
    0 12px 30px rgba(0,0,0,.25),
    0 0 16px rgba(209,174,101,.08);
}
.glass-cta-label{
  position:relative;
  display:inline-block;
  color:#ffe4a3;
  -webkit-text-fill-color:#ffe4a3;
  font-weight:750;
  letter-spacing:.005em;
  text-shadow:
    0 1px 1px rgba(0,0,0,.55),
    0 0 7px rgba(226,187,96,.20);
}
.glass-cta-label::after{
  content:attr(data-label);
  position:absolute;
  inset:0;
  pointer-events:none;
  color:transparent;
  background:linear-gradient(
    105deg,
    transparent 0%,
    transparent 34%,
    rgba(255,249,220,.28) 42%,
    rgba(255,255,246,.76) 49%,
    rgba(255,232,158,.38) 56%,
    transparent 66%,
    transparent 100%
  ) 145% 50% / 245% 100% no-repeat;
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  opacity:.62;
  animation:downloadLabelShine 6.8s ease-in-out infinite;
}
.btn.btn--primary:hover .glass-cta-label{
  color:#fff0bd;
  -webkit-text-fill-color:#fff0bd;
}
@media(prefers-reduced-motion:reduce){
  .btn.btn--primary::after,
  .glass-cta-label::after{
    animation:none;
    background-position:50% 50%;
  }
  .glass-cta-label::after{opacity:.30}
}
/* ============================================================
   GLOBAL LIQUID GLASS PRIMARY CTA - END
============================================================ */

/* ============================================================
   TRANSLUCENT GLASS MEDIA SURFACES - START
   Gives the large visual mockups and photographic media a softer,
   lower-opacity glass treatment so the cursor-following ambient
   color can remain visible through them. Brand logos are excluded.
============================================================ */
.subhero .panel,
.subhero .phone,
.subhero .dashboard,
.subhero .calendar,
.section .split > .panel,
.section .split > .phone,
.section .split > .dashboard,
.section .split > .calendar,
.story-visual .business-console,
.story-visual .insurance-panel-premium,
.story-visual .app-phone-premium,
.download-visual .app-phone-premium{
  border-color:rgba(237,239,224,.16);
  background:
    linear-gradient(180deg,rgba(255,255,255,.055),transparent 28%),
    radial-gradient(circle at 18% 0%,rgba(var(--accent-rgb),.075),transparent 42%),
    linear-gradient(145deg,rgba(22,27,21,.64),rgba(7,10,8,.44));
  -webkit-backdrop-filter:blur(24px) saturate(126%);
  backdrop-filter:blur(24px) saturate(126%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.09),
    inset 0 -1px 0 rgba(255,255,255,.025),
    0 34px 78px -48px rgba(0,0,0,.72),
    0 0 0 1px rgba(255,255,255,.018);
}

/* Inner interface layers remain legible but no longer fully block the glow. */
.phone .screen,
.dashboard .dash-side,
.dashboard .dash-kpi,
.panel .activity,
.calendar .cal-cell,
.business-console .console-card,
.insurance-panel-premium .ins-card,
.insurance-panel-premium .region-pill,
.app-phone-premium{
  background-color:rgba(11,15,12,.50);
  -webkit-backdrop-filter:blur(14px) saturate(118%);
  backdrop-filter:blur(14px) saturate(118%);
}
.phone .screen{
  background:
    radial-gradient(circle at 90% 8%,rgba(var(--accent-rgb),.11),transparent 32%),
    rgba(8,12,9,.54);
}
.mini-card,
.console-card,
.ins-card,
.dash-kpi{
  background:rgba(18,23,18,.56);
}

/* Actual app artwork stays crisp while allowing a measured amount of
   ambient color to pass through the device glass. */
.app-phone-premium img{
  opacity:.88;
  transition:opacity .45s var(--ease),filter .45s var(--ease);
  filter:saturate(.96) contrast(1.01);
}
.app-phone-premium:hover img{
  opacity:.94;
  filter:saturate(1) contrast(1.02);
}

/* The tree remains cinematic, but its darker areas now pick up the
   cursor-tracking glow from the page background. */
.tree-photo-wrap{
  border:1px solid rgba(237,239,224,.10);
  background:rgba(6,9,7,.30);
  -webkit-backdrop-filter:blur(13px) saturate(116%);
  backdrop-filter:blur(13px) saturate(116%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.055),
    0 36px 88px -58px rgba(0,0,0,.78);
}
.tree-photo{
  opacity:.87;
  transition:opacity .5s var(--ease),filter .5s var(--ease);
}
.photo-tree-stage:hover .tree-photo{
  opacity:.91;
}

@media(max-width:700px){
  .subhero .panel,
  .subhero .phone,
  .subhero .dashboard,
  .subhero .calendar,
  .section .split > .panel,
  .section .split > .phone,
  .section .split > .dashboard,
  .section .split > .calendar,
  .story-visual .business-console,
  .story-visual .insurance-panel-premium,
  .story-visual .app-phone-premium,
  .download-visual .app-phone-premium{
    -webkit-backdrop-filter:blur(18px) saturate(120%);
    backdrop-filter:blur(18px) saturate(120%);
  }
}

@media(prefers-reduced-transparency:reduce){
  .subhero .panel,
  .subhero .phone,
  .subhero .dashboard,
  .subhero .calendar,
  .section .split > .panel,
  .section .split > .phone,
  .section .split > .dashboard,
  .section .split > .calendar,
  .story-visual .business-console,
  .story-visual .insurance-panel-premium,
  .story-visual .app-phone-premium,
  .download-visual .app-phone-premium{
    background:linear-gradient(145deg,rgba(22,27,21,.94),rgba(7,10,8,.96));
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
  .tree-photo{opacity:.96}
  .app-phone-premium img{opacity:.97}
}
/* ============================================================
   TRANSLUCENT GLASS MEDIA SURFACES - END
============================================================ */


/* ============================================================
   HOMEPAGE PREMIUM PASS - START
   Applies the premium refinement pass discussed for the homepage:
   glass hierarchy, stronger visual frames, restrained staggered
   reveals, calmer supporting cards, and tighter typography.
============================================================ */
.page-home .premium-section,
.page-home .outcome-band,
.page-home .final-cta-premium{
  position:relative;
  isolation:isolate;
}
.page-home .premium-section::after,
.page-home .outcome-band::after,
.page-home .final-cta-premium::after{
  content:"";
  position:absolute;
  left:50%;
  top:0;
  width:min(920px,72vw);
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(213,177,95,.18),rgba(182,204,107,.16),transparent);
  transform:translateX(-50%);
  opacity:.55;
  pointer-events:none;
}
.page-home .premium-section:first-of-type::after{display:none}

/* Typography refinement */
.page-home .editorial-head,
.page-home .story-copy,
.page-home .outcome-lead,
.page-home .final-cta-inner{
  max-width:680px;
}
.page-home .editorial-head h2,
.page-home .story-copy h2{
  letter-spacing:-.058em;
  line-height:.95;
}
.page-home .editorial-head p,
.page-home .story-copy p,
.page-home .outcome-lead p,
.page-home .final-cta-inner p{
  max-width:56ch;
  color:#9ca297;
  line-height:1.78;
}
.page-home .kicker{
  letter-spacing:.15em;
}

/* Three-level glass hierarchy */
/* Level 2: feature display surfaces */
.page-home .story-visual .app-phone-premium,
.page-home .story-visual .business-console,
.page-home .story-visual .insurance-panel-premium{
  position:relative;
  overflow:visible;
  border:1px solid rgba(237,239,224,.16);
  background:
    linear-gradient(180deg,rgba(255,255,255,.07),transparent 26%),
    radial-gradient(circle at 18% 4%,rgba(var(--story-rgb),.11),transparent 34%),
    linear-gradient(145deg,rgba(19,24,19,.70),rgba(8,11,8,.55));
  -webkit-backdrop-filter:blur(18px) saturate(120%);
  backdrop-filter:blur(18px) saturate(120%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.08),
    inset 0 -1px 0 rgba(255,255,255,.03),
    0 38px 82px -50px rgba(0,0,0,.74),
    0 0 0 1px rgba(255,255,255,.02);
}
.page-home .story-visual .app-phone-premium::before,
.page-home .story-visual .business-console::before,
.page-home .story-visual .insurance-panel-premium::before{
  content:"";
  position:absolute;
  inset:10px 12px auto 12px;
  height:20%;
  border-radius:inherit;
  background:linear-gradient(180deg,rgba(255,255,255,.12),rgba(255,255,255,0));
  opacity:.56;
  pointer-events:none;
}
.page-home .story-visual .app-phone-premium::after,
.page-home .story-visual .business-console::after,
.page-home .story-visual .insurance-panel-premium::after{
  content:"";
  position:absolute;
  right:16px;
  top:16px;
  width:44px;
  height:44px;
  border-top:1px solid rgba(213,177,95,.45);
  border-right:1px solid rgba(213,177,95,.45);
  border-radius:0 18px 0 0;
  opacity:.75;
  pointer-events:none;
}
.page-home .story-visual .app-phone-premium img{
  opacity:.94;
  filter:saturate(1) contrast(1.02);
}
.page-home .story-visual:hover .app-phone-premium img{
  opacity:.97;
}

/* Level 3: support cards become more solid and cleaner */
.page-home .perspective-card,
.page-home .foundation-item,
.page-home .outcome-card,
.page-home .story-point{
  background:
    linear-gradient(180deg,rgba(255,255,255,.03),rgba(255,255,255,0) 22%),
    linear-gradient(145deg,rgba(18,22,17,.90),rgba(8,10,8,.96));
  -webkit-backdrop-filter:blur(8px) saturate(108%);
  backdrop-filter:blur(8px) saturate(108%);
  box-shadow:0 20px 42px -32px rgba(0,0,0,.58);
}
.page-home .story-point{
  padding:18px 18px 16px;
  border:1px solid rgba(237,239,224,.08);
  border-top-color:rgba(213,177,95,.18);
  border-radius:18px;
}
.page-home .story-point b{font-size:.92rem}
.page-home .story-point span{font-size:.79rem;line-height:1.58;color:#8a9086}
.page-home .foundation-item{
  min-height:94px;
  border-color:rgba(237,239,224,.08);
}
.page-home .outcome-card{
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
  min-height:220px;
  border-color:rgba(237,239,224,.08);
}
.page-home .outcome-card h3{margin-top:28px}
.page-home .perspective-card{
  border-color:rgba(237,239,224,.08);
}

/* Subtle hover depth */
.page-home .perspective-card,
.page-home .foundation-item,
.page-home .outcome-card,
.page-home .story-point,
.page-home .story-visual .app-phone-premium,
.page-home .story-visual .business-console,
.page-home .story-visual .insurance-panel-premium{
  transition:
    transform .45s var(--ease),
    border-color .35s ease,
    box-shadow .35s ease,
    background-color .35s ease;
}
.page-home .perspective-card:hover,
.page-home .foundation-item:hover,
.page-home .outcome-card:hover,
.page-home .story-point:hover{
  transform:translateY(-4px);
  border-color:rgba(213,177,95,.24);
  box-shadow:0 28px 56px -38px rgba(0,0,0,.72);
}
.page-home .story-point:hover{background:linear-gradient(145deg,rgba(20,24,19,.92),rgba(9,11,8,.97))}

/* Staggered section-entry animations powered by existing .reveal observer */
.page-home .perspective-grid.reveal .perspective-card,
.page-home .story-points .story-point,
.page-home .foundation-grid-premium.reveal .foundation-item,
.page-home .outcome-cards .outcome-card,
.page-home .final-cta-actions .btn{
  opacity:0;
  transform:translateY(18px) scale(.985);
  transition:opacity .6s var(--ease),transform .6s var(--ease),border-color .35s ease,box-shadow .35s ease;
}
.page-home .perspective-grid.reveal.visible .perspective-card,
.page-home .product-story.reveal.visible .story-point,
.page-home .foundation-grid-premium.reveal.visible .foundation-item,
.page-home .outcome-grid.reveal.visible .outcome-card,
.page-home .final-cta-inner.reveal.visible .btn{
  opacity:1;
  transform:translateY(0) scale(1);
}
.page-home .perspective-grid.reveal.visible .perspective-card:nth-child(1),
.page-home .product-story.reveal.visible .story-point:nth-child(1),
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(1),
.page-home .outcome-grid.reveal.visible .outcome-card:nth-child(1),
.page-home .final-cta-inner.reveal.visible .btn:nth-child(1){transition-delay:.04s}
.page-home .perspective-grid.reveal.visible .perspective-card:nth-child(2),
.page-home .product-story.reveal.visible .story-point:nth-child(2),
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(2),
.page-home .outcome-grid.reveal.visible .outcome-card:nth-child(2),
.page-home .final-cta-inner.reveal.visible .btn:nth-child(2){transition-delay:.1s}
.page-home .perspective-grid.reveal.visible .perspective-card:nth-child(3),
.page-home .product-story.reveal.visible .story-point:nth-child(3),
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(3),
.page-home .outcome-grid.reveal.visible .outcome-card:nth-child(3){transition-delay:.16s}
.page-home .perspective-grid.reveal.visible .perspective-card:nth-child(4),
.page-home .product-story.reveal.visible .story-point:nth-child(4),
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(4){transition-delay:.22s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(5){transition-delay:.28s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(6){transition-delay:.34s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(7){transition-delay:.40s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(8){transition-delay:.46s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(9){transition-delay:.52s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(10){transition-delay:.58s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(11){transition-delay:.64s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(12){transition-delay:.70s}
.page-home .foundation-grid-premium.reveal.visible .foundation-item:nth-child(13){transition-delay:.76s}

/* Cleaner perspective icons and outcome presentation */
.page-home .perspective-icon,
.page-home .foundation-item i{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.10),0 12px 26px -18px rgba(0,0,0,.6);
}
.page-home .outcome-lead{align-self:center}
.page-home .outcome-cards{align-self:center}

/* Respect reduced motion */
@media(prefers-reduced-motion:reduce){
  .page-home .perspective-grid.reveal .perspective-card,
  .page-home .story-points .story-point,
  .page-home .foundation-grid-premium.reveal .foundation-item,
  .page-home .outcome-cards .outcome-card,
  .page-home .final-cta-actions .btn{
    opacity:1;
    transform:none;
    transition:none;
  }
}

@media(max-width:900px){
  .page-home .story-point{padding:16px}
  .page-home .story-visual .app-phone-premium::after,
  .page-home .story-visual .business-console::after,
  .page-home .story-visual .insurance-panel-premium::after{
    width:34px;height:34px;right:12px;top:12px;
  }
  .page-home .premium-section::after,
  .page-home .outcome-band::after,
  .page-home .final-cta-premium::after{width:min(640px,82vw)}
}
/* ============================================================
   HOMEPAGE PREMIUM PASS - END
============================================================ */

/* ============================================================
   HOMEPAGE PERSISTENT PREMIUM MOTION - START
   Low-cost persistent motion using transform/opacity only.
============================================================ */

/* 1) Explore by Perspective: a slow ambient light drifts behind the cards. */
.page-home #perspectives{
  position:relative;
  overflow:hidden;
}
.page-home #perspectives::before{
  content:"";
  position:absolute;
  left:50%;
  top:46%;
  width:min(760px,54vw);
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,
    rgba(182,204,107,.09) 0%,
    rgba(213,177,95,.055) 32%,
    rgba(118,148,197,.025) 54%,
    transparent 72%);
  filter:blur(18px);
  opacity:.72;
  transform:translate3d(-66%,-50%,0) scale(.90);
  animation:fillrPerspectiveDrift 16s ease-in-out infinite alternate;
  pointer-events:none;
  will-change:transform,opacity;
}
.page-home #perspectives > .wrap{position:relative;z-index:1}
@keyframes fillrPerspectiveDrift{
  0%{transform:translate3d(-66%,-50%,0) scale(.90);opacity:.54}
  50%{opacity:.78}
  100%{transform:translate3d(-34%,-42%,0) scale(1.08);opacity:.62}
}

/* 2) Consumer / Business / Insurance visuals: slow breathing light and reflection. */
.page-home .story-visual{isolation:isolate}
.page-home .story-visual::after{
  content:"";
  position:absolute;
  z-index:-1;
  width:72%;
  height:72%;
  border-radius:50%;
  background:radial-gradient(circle,
    rgba(var(--story-rgb),.15) 0%,
    rgba(var(--story-rgb),.065) 34%,
    transparent 70%);
  opacity:.48;
  transform:translate3d(-4%,3%,0) scale(.92);
  animation:fillrFeatureBreathe 9s ease-in-out infinite alternate;
  pointer-events:none;
  will-change:transform,opacity;
}
.page-home .story-visual .app-phone-premium::before,
.page-home .story-visual .business-console::before,
.page-home .story-visual .insurance-panel-premium::before{
  animation:fillrGlassReflection 12s cubic-bezier(.45,0,.25,1) infinite;
  will-change:transform,opacity;
}
.page-home .product-story:nth-child(even) .story-visual::after{animation-delay:-3s}
@keyframes fillrFeatureBreathe{
  0%{transform:translate3d(-4%,3%,0) scale(.92);opacity:.38}
  100%{transform:translate3d(5%,-2%,0) scale(1.06);opacity:.62}
}
@keyframes fillrGlassReflection{
  0%,18%{transform:translate3d(-34%,-4%,0);opacity:.16}
  46%{opacity:.50}
  72%,100%{transform:translate3d(34%,3%,0);opacity:.20}
}

/* 3) Connected Foundations: one subtle signal sweep across the system. */
.page-home .foundation-grid-premium{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border-radius:20px;
}
.page-home .foundation-grid-premium::before{
  content:"";
  position:absolute;
  z-index:2;
  left:-24%;
  top:-8%;
  width:20%;
  height:116%;
  background:linear-gradient(90deg,
    transparent,
    rgba(213,177,95,.03) 24%,
    rgba(213,177,95,.13) 48%,
    rgba(182,204,107,.075) 58%,
    transparent);
  filter:blur(3px);
  opacity:0;
  transform:translate3d(0,0,0) skewX(-12deg);
  animation:fillrFoundationSignal 11s cubic-bezier(.4,0,.2,1) infinite;
  pointer-events:none;
  will-change:transform,opacity;
}
.page-home .foundation-item{position:relative;z-index:1}
@keyframes fillrFoundationSignal{
  0%,12%{transform:translate3d(0,0,0) skewX(-12deg);opacity:0}
  22%{opacity:.66}
  76%{opacity:.52}
  88%,100%{transform:translate3d(690%,0,0) skewX(-12deg);opacity:0}
}

/* 4) Value Created: almost imperceptible ambient breathing, no card movement. */
.page-home .outcome-band::before{
  animation:fillrOutcomeGlow 10s ease-in-out infinite alternate;
  will-change:transform,opacity;
}
@keyframes fillrOutcomeGlow{
  0%{transform:translate3d(0,5%,0) scale(.96);opacity:.64}
  100%{transform:translate3d(0,-2%,0) scale(1.05);opacity:.90}
}

@media(hover:none){
  .page-home #perspectives::before{opacity:.46}
  .page-home .story-visual::after{opacity:.38}
}

@media(prefers-reduced-motion:reduce){
  .page-home #perspectives::before,
  .page-home .story-visual::after,
  .page-home .story-visual .app-phone-premium::before,
  .page-home .story-visual .business-console::before,
  .page-home .story-visual .insurance-panel-premium::before,
  .page-home .foundation-grid-premium::before,
  .page-home .outcome-band::before{
    animation:none !important;
  }
}
/* ============================================================
   HOMEPAGE PERSISTENT PREMIUM MOTION - END
============================================================ */


/* ============================================================
   HOMEPAGE SECTION AMBIENT LOOP - START
   Keeps cursor-tracking light intact and adds a separate looping
   background ambient layer per homepage section.
============================================================ */
.page-home .premium-section,
.page-home .outcome-band,
.page-home .final-cta-premium{
  position:relative;
  overflow:hidden;
}
.page-home .premium-section > .wrap,
.page-home .outcome-band > .wrap,
.page-home .final-cta-premium > .wrap{
  position:relative;
  z-index:1;
}
.page-home .section-ambient{
  position:absolute;
  inset:-6% -4%;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}
.page-home .section-ambient::before,
.page-home .section-ambient::after{
  content:"";
  position:absolute;
  border-radius:50%;
  filter:blur(70px);
  opacity:.28;
  will-change:transform,opacity,filter,background;
  transition:opacity .4s ease;
}
.page-home .section-ambient::before{
  width:min(36vw,560px);
  height:min(36vw,560px);
  left:8%;
  top:18%;
  background:radial-gradient(circle, rgba(182,204,107,.17) 0%, rgba(118,148,197,.08) 36%, rgba(213,177,95,.05) 58%, transparent 72%);
  animation:homepageAmbientFloatA 22s ease-in-out infinite alternate;
}
.page-home .section-ambient::after{
  width:min(30vw,460px);
  height:min(30vw,460px);
  right:10%;
  bottom:8%;
  background:radial-gradient(circle, rgba(213,177,95,.12) 0%, rgba(199,120,89,.08) 30%, rgba(118,148,197,.07) 56%, transparent 72%);
  animation:homepageAmbientFloatB 27s ease-in-out infinite alternate;
}
/* Slightly stronger ambient for the first content section */
.page-home #perspectives .section-ambient::before{opacity:.34}
.page-home #perspectives .section-ambient::after{opacity:.22}
.page-home .product-story .section-ambient::before,
.page-home .product-story .section-ambient::after{filter:blur(76px)}
.page-home .outcome-band .section-ambient::before{opacity:.22}
.page-home .final-cta-premium .section-ambient::after{opacity:.18}

@keyframes homepageAmbientFloatA{
  0%{
    transform:translate3d(-6%,-4%,0) scale(.92);
    opacity:.18;
    filter:blur(68px) hue-rotate(0deg);
  }
  18%{
    opacity:.34;
    filter:blur(74px) hue-rotate(-8deg);
  }
  42%{
    transform:translate3d(18%,8%,0) scale(1.05);
    opacity:.24;
    filter:blur(82px) hue-rotate(14deg);
  }
  67%{
    transform:translate3d(4%,18%,0) scale(.98);
    opacity:.31;
    filter:blur(76px) hue-rotate(28deg);
  }
  100%{
    transform:translate3d(22%,-10%,0) scale(1.08);
    opacity:.20;
    filter:blur(72px) hue-rotate(8deg);
  }
}
@keyframes homepageAmbientFloatB{
  0%{
    transform:translate3d(0,0,0) scale(.9);
    opacity:.14;
    filter:blur(64px) hue-rotate(0deg);
  }
  24%{
    transform:translate3d(-12%,-10%,0) scale(1.04);
    opacity:.24;
    filter:blur(74px) hue-rotate(10deg);
  }
  48%{
    transform:translate3d(-2%,12%,0) scale(1.08);
    opacity:.18;
    filter:blur(82px) hue-rotate(24deg);
  }
  72%{
    transform:translate3d(10%,-4%,0) scale(.96);
    opacity:.27;
    filter:blur(76px) hue-rotate(-10deg);
  }
  100%{
    transform:translate3d(-18%,8%,0) scale(1.02);
    opacity:.16;
    filter:blur(68px) hue-rotate(6deg);
  }
}
@media (max-width:900px){
  .page-home .section-ambient::before,
  .page-home .section-ambient::after{filter:blur(56px)}
}
@media (prefers-reduced-motion:reduce){
  .page-home .section-ambient::before,
  .page-home .section-ambient::after{
    animation:none !important;
    opacity:.18;
    filter:blur(64px);
  }
}
/* ============================================================
   HOMEPAGE SECTION AMBIENT LOOP - END
============================================================ */


/* ============================================================
   HOMEPAGE AMBIENT SIMPLIFICATION - START
   Uses the Value Created section as the motion reference:
   broad, slow ambient breathing only. Removes persistent local
   animations/reflections behind cards and feature mockups.
============================================================ */

/* Remove the earlier localized / cornered persistent motion. */
.page-home #perspectives::before{
  animation:none !important;
  opacity:0 !important;
}
.page-home .story-visual::after{
  animation:none !important;
  opacity:0 !important;
}
.page-home .story-visual .app-phone-premium::before,
.page-home .story-visual .business-console::before,
.page-home .story-visual .insurance-panel-premium::before{
  animation:none !important;
  opacity:0 !important;
}
.page-home .story-visual .app-phone-premium::after,
.page-home .story-visual .business-console::after,
.page-home .story-visual .insurance-panel-premium::after{
  display:none !important;
}
.page-home .foundation-grid-premium::before{
  animation:none !important;
  opacity:0 !important;
}

/* Broad section ambience, modeled after the Value Created glow. */
.page-home .section-ambient{
  position:absolute;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
}
.page-home .section-ambient::before,
.page-home .section-ambient::after{
  content:"";
  position:absolute;
  inset:auto;
  border-radius:50%;
  filter:blur(46px);
  pointer-events:none;
  will-change:transform,opacity;
}

/* Main breathing glow */
.page-home .section-ambient::before{
  left:50%;
  bottom:-34%;
  width:min(1050px,78vw);
  height:min(620px,48vw);
  background:radial-gradient(circle,
    rgba(174,184,115,.13) 0%,
    rgba(118,148,197,.055) 38%,
    rgba(213,177,95,.035) 57%,
    transparent 72%);
  transform:translate3d(-50%,4%,0) scale(.96);
  opacity:.62;
  animation:fillrSectionAmbientBreathe 11s ease-in-out infinite alternate;
}

/* Secondary, very faint color drift to stop the ambience feeling static. */
.page-home .section-ambient::after{
  left:8%;
  top:-26%;
  width:min(720px,54vw);
  height:min(520px,40vw);
  background:radial-gradient(circle,
    rgba(118,148,197,.06) 0%,
    rgba(182,204,107,.045) 42%,
    transparent 72%);
  transform:translate3d(0,0,0) scale(.94);
  opacity:.22;
  animation:fillrSectionAmbientDrift 17s ease-in-out infinite alternate;
}

/* Slight section-by-section tuning, still the same visual language. */
.page-home #perspectives .section-ambient::before{
  background:radial-gradient(circle,
    rgba(182,204,107,.14) 0%,
    rgba(213,177,95,.05) 40%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(4) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(182,204,107,.12) 0%,
    rgba(118,148,197,.045) 45%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(5) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(213,177,95,.10) 0%,
    rgba(182,204,107,.04) 44%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(6) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(118,148,197,.11) 0%,
    rgba(182,204,107,.035) 44%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(7) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(174,184,115,.11) 0%,
    rgba(213,177,95,.035) 44%,
    transparent 72%);
}
.page-home .final-cta-premium .section-ambient::before{
  opacity:.54;
}

@keyframes fillrSectionAmbientBreathe{
  0%{
    transform:translate3d(-50%,8%,0) scale(.94);
    opacity:.46;
  }
  45%{
    opacity:.72;
  }
  100%{
    transform:translate3d(-48%,-2%,0) scale(1.06);
    opacity:.58;
  }
}
@keyframes fillrSectionAmbientDrift{
  0%{
    transform:translate3d(-6%,2%,0) scale(.92);
    opacity:.14;
  }
  50%{
    opacity:.28;
  }
  100%{
    transform:translate3d(22%,12%,0) scale(1.08);
    opacity:.18;
  }
}

/* Keep Value Created's existing ambience, but stop duplicate ambient layers. */
.page-home .outcome-band .section-ambient{
  display:none;
}
.page-home .outcome-band::before{
  animation:fillrOutcomeGlow 10s ease-in-out infinite alternate;
}

/* No persistent animation attached to cards or product mockups. */
.page-home .perspective-card,
.page-home .foundation-item,
.page-home .outcome-card,
.page-home .story-point,
.page-home .app-phone-premium,
.page-home .business-console,
.page-home .insurance-panel-premium{
  animation:none !important;
}

@media(prefers-reduced-motion:reduce){
  .page-home .section-ambient::before,
  .page-home .section-ambient::after{
    animation:none !important;
    opacity:.20;
  }
}
/* ============================================================
   HOMEPAGE AMBIENT SIMPLIFICATION - END
============================================================ */


/* ============================================================
   HOMEPAGE AMBIENT INTENSITY TUNING - START
   Faster, slightly stronger, and more randomly drifting ambient
   section lighting while keeping the cursor ambient separate.
============================================================ */
.page-home .section-ambient::before,
.page-home .section-ambient::after{
  filter:blur(52px);
}
.page-home .section-ambient::before{
  left:42%;
  bottom:-28%;
  width:min(1120px,82vw);
  height:min(680px,52vw);
  background:radial-gradient(circle,
    rgba(182,204,107,.19) 0%,
    rgba(118,148,197,.10) 26%,
    rgba(213,177,95,.08) 48%,
    transparent 72%);
  opacity:.74;
  animation:fillrSectionAmbientRandomA 11.5s ease-in-out infinite;
}
.page-home .section-ambient::after{
  left:6%;
  top:-18%;
  width:min(780px,58vw);
  height:min(560px,42vw);
  background:radial-gradient(circle,
    rgba(118,148,197,.12) 0%,
    rgba(182,204,107,.09) 30%,
    rgba(213,177,95,.05) 52%,
    transparent 72%);
  opacity:.30;
  animation:fillrSectionAmbientRandomB 15.5s ease-in-out infinite;
}
.page-home #perspectives .section-ambient::before{
  background:radial-gradient(circle,
    rgba(182,204,107,.22) 0%,
    rgba(213,177,95,.10) 34%,
    rgba(118,148,197,.07) 56%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(4) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(182,204,107,.18) 0%,
    rgba(118,148,197,.10) 36%,
    rgba(213,177,95,.06) 58%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(5) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(213,177,95,.16) 0%,
    rgba(182,204,107,.08) 34%,
    rgba(118,148,197,.05) 58%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(6) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(118,148,197,.17) 0%,
    rgba(182,204,107,.08) 38%,
    rgba(213,177,95,.05) 58%,
    transparent 72%);
}
.page-home .premium-section:nth-of-type(7) .section-ambient::before{
  background:radial-gradient(circle,
    rgba(174,184,115,.18) 0%,
    rgba(213,177,95,.08) 36%,
    rgba(118,148,197,.05) 58%,
    transparent 72%);
}
.page-home .final-cta-premium .section-ambient::before{opacity:.66}

@keyframes fillrSectionAmbientRandomA{
  0%{
    transform:translate3d(-28%,-2%,0) scale(.94);
    opacity:.56;
    filter:blur(48px) hue-rotate(0deg);
  }
  18%{
    transform:translate3d(-10%,8%,0) scale(1.04);
    opacity:.84;
    filter:blur(58px) hue-rotate(8deg);
  }
  37%{
    transform:translate3d(5%,-9%,0) scale(1.01);
    opacity:.63;
    filter:blur(54px) hue-rotate(-8deg);
  }
  55%{
    transform:translate3d(17%,5%,0) scale(1.08);
    opacity:.78;
    filter:blur(62px) hue-rotate(18deg);
  }
  74%{
    transform:translate3d(2%,14%,0) scale(.99);
    opacity:.68;
    filter:blur(56px) hue-rotate(-14deg);
  }
  100%{
    transform:translate3d(-16%,-8%,0) scale(1.06);
    opacity:.60;
    filter:blur(52px) hue-rotate(10deg);
  }
}
@keyframes fillrSectionAmbientRandomB{
  0%{
    transform:translate3d(-8%,4%,0) scale(.90);
    opacity:.18;
    filter:blur(48px) hue-rotate(0deg);
  }
  20%{
    transform:translate3d(14%,-5%,0) scale(1.04);
    opacity:.36;
    filter:blur(56px) hue-rotate(16deg);
  }
  42%{
    transform:translate3d(5%,12%,0) scale(.99);
    opacity:.28;
    filter:blur(54px) hue-rotate(-10deg);
  }
  63%{
    transform:translate3d(-11%,7%,0) scale(1.07);
    opacity:.34;
    filter:blur(60px) hue-rotate(20deg);
  }
  82%{
    transform:translate3d(9%,-10%,0) scale(.97);
    opacity:.24;
    filter:blur(52px) hue-rotate(-6deg);
  }
  100%{
    transform:translate3d(-4%,10%,0) scale(1.02);
    opacity:.20;
    filter:blur(50px) hue-rotate(12deg);
  }
}
@media (max-width:900px){
  .page-home .section-ambient::before,
  .page-home .section-ambient::after{
    filter:blur(46px);
  }
}
@media(prefers-reduced-motion:reduce){
  .page-home .section-ambient::before,
  .page-home .section-ambient::after{
    animation:none !important;
    opacity:.24;
    filter:blur(52px);
  }
}
/* ============================================================
   HOMEPAGE AMBIENT INTENSITY TUNING - END
============================================================ */


/* ============================================================
   MULTIPAGE SECTION AMBIENT LOOP - START
   Applies the softer homepage-style ambient motion to the other
   pages, keeping cursor tracking separate and avoiding local card
   or image animations.
============================================================ */
body:not(.page-home) .subhero,
body:not(.page-home) .download-hero,
body:not(.page-home) .section,
body.page-signin .auth-shell{
  position:relative;
  overflow:hidden;
}
body:not(.page-home) .subhero > .wrap,
body:not(.page-home) .download-hero > .wrap,
body:not(.page-home) .section > .wrap,
body.page-signin .auth-shell > .auth-wrap{
  position:relative;
  z-index:1;
}
body:not(.page-home) .section-ambient,
body.page-signin .section-ambient{
  position:absolute;
  inset:-8% -5%;
  z-index:0;
  pointer-events:none;
  overflow:hidden;
}
body:not(.page-home) .section-ambient::before,
body:not(.page-home) .section-ambient::after,
body.page-signin .section-ambient::before,
body.page-signin .section-ambient::after{
  content:"";
  position:absolute;
  border-radius:50%;
  will-change:transform,opacity,filter;
}
body:not(.page-home) .section-ambient::before,
body.page-signin .section-ambient::before{
  left:42%;
  bottom:-28%;
  width:min(1120px,82vw);
  height:min(680px,52vw);
  background:radial-gradient(circle,
    rgba(182,204,107,.18) 0%,
    rgba(118,148,197,.09) 28%,
    rgba(213,177,95,.07) 48%,
    transparent 72%);
  opacity:.54;
  filter:blur(54px);
  animation:fillrSectionAmbientRandomA 11.5s ease-in-out infinite;
}
body:not(.page-home) .section-ambient::after,
body.page-signin .section-ambient::after{
  left:6%;
  top:-18%;
  width:min(780px,58vw);
  height:min(560px,42vw);
  background:radial-gradient(circle,
    rgba(118,148,197,.11) 0%,
    rgba(182,204,107,.08) 30%,
    rgba(213,177,95,.05) 52%,
    transparent 72%);
  opacity:.22;
  filter:blur(50px);
  animation:fillrSectionAmbientRandomB 15.5s ease-in-out infinite;
}
/* Page color bias */
.page-consumer .section-ambient::before{background:radial-gradient(circle,rgba(118,148,197,.15) 0%,rgba(182,204,107,.08) 34%,rgba(213,177,95,.05) 56%,transparent 72%)}
.page-business .section-ambient::before{background:radial-gradient(circle,rgba(213,177,95,.14) 0%,rgba(182,204,107,.08) 34%,rgba(118,148,197,.05) 58%,transparent 72%)}
.page-marketplace .section-ambient::before{background:radial-gradient(circle,rgba(202,131,96,.12) 0%,rgba(213,177,95,.09) 28%,rgba(182,204,107,.05) 54%,transparent 72%)}
.page-insurance .section-ambient::before{background:radial-gradient(circle,rgba(118,148,197,.15) 0%,rgba(213,177,95,.08) 34%,rgba(182,204,107,.05) 58%,transparent 72%)}
.page-scheduling .section-ambient::before{background:radial-gradient(circle,rgba(182,204,107,.17) 0%,rgba(118,148,197,.08) 34%,rgba(213,177,95,.05) 58%,transparent 72%)}
.page-company .section-ambient::before,
.page-platform .section-ambient::before,
.page-download .section-ambient::before,
.page-signin .section-ambient::before{background:radial-gradient(circle,rgba(174,184,115,.16) 0%,rgba(213,177,95,.08) 36%,rgba(118,148,197,.05) 58%,transparent 72%)}
/* Slight intensity adjustments for section headers and closing CTAs */
body:not(.page-home) .subhero .section-ambient::before,
body:not(.page-home) .download-hero .section-ambient::before{opacity:.62}
body:not(.page-home) .cta .section-ambient::before{opacity:.46}

@media (max-width:900px){
  body:not(.page-home) .section-ambient::before,
  body:not(.page-home) .section-ambient::after,
  body.page-signin .section-ambient::before,
  body.page-signin .section-ambient::after{
    filter:blur(46px);
  }
}
@media (prefers-reduced-motion:reduce){
  body:not(.page-home) .section-ambient::before,
  body:not(.page-home) .section-ambient::after,
  body.page-signin .section-ambient::before,
  body.page-signin .section-ambient::after{
    animation:none !important;
    opacity:.22;
    filter:blur(52px);
  }
}
/* ============================================================
   MULTIPAGE SECTION AMBIENT LOOP - END
============================================================ */


/* ============================================================
   MULTIPAGE AMBIENT VISIBILITY FIX - START
   Forces the ambient light to sit visibly above each section's
   background while remaining behind all section content.
============================================================ */
body:not(.page-home) .subhero,
body:not(.page-home) .download-hero,
body:not(.page-home) .section,
body.page-signin .auth-shell{
  isolation:isolate;
}
body:not(.page-home) .section-ambient,
body.page-signin .section-ambient{
  display:block !important;
  visibility:visible !important;
  opacity:1 !important;
  z-index:0 !important;
}
body:not(.page-home) .subhero > :not(.section-ambient),
body:not(.page-home) .download-hero > :not(.section-ambient),
body:not(.page-home) .section > :not(.section-ambient),
body.page-signin .auth-shell > :not(.section-ambient){
  position:relative;
  z-index:2;
}
/* Make the movement clearly visible without becoming louder than homepage. */
body:not(.page-home) .section-ambient::before,
body.page-signin .section-ambient::before{
  opacity:.68;
  filter:blur(50px);
}
body:not(.page-home) .section-ambient::after,
body.page-signin .section-ambient::after{
  opacity:.30;
  filter:blur(48px);
}
/* Paper sections stay dark enough to preserve the moving light. */
body:not(.page-home) .section.paper{
  background:
    linear-gradient(rgba(11,13,10,.76),rgba(11,13,10,.76)),
    radial-gradient(circle at 15% 12%,rgba(var(--accent-rgb),.055),transparent 30%),
    radial-gradient(circle at 88% 82%,rgba(var(--accent-2-rgb),.05),transparent 30%),
    #0b0d0a;
}
@media(prefers-reduced-motion:reduce){
  body:not(.page-home) .section-ambient::before,
  body:not(.page-home) .section-ambient::after,
  body.page-signin .section-ambient::before,
  body.page-signin .section-ambient::after{
    opacity:.20;
  }
}
/* ============================================================
   MULTIPAGE AMBIENT VISIBILITY FIX - END
============================================================ */


/* ============================================================
   HOMEPAGE OPTICAL REFRACTION GLASS - START
   Cursor-reactive specular light inside selected glass surfaces.
   No tilt, no persistent card animation, and no WebGL.
============================================================ */
.page-home .optical-surface{
  --lens-x:50%;
  --lens-y:50%;
  --lens-opacity:0;
  --lens-scale:.94;
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

.page-home .optical-surface::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:4;
  border-radius:inherit;
  pointer-events:none;
  opacity:var(--lens-opacity);
  transform:scale(var(--lens-scale));
  transform-origin:var(--lens-x) var(--lens-y);
  background:
    radial-gradient(circle 190px at var(--lens-x) var(--lens-y),
      rgba(255,255,255,.13) 0%,
      rgba(255,228,163,.075) 17%,
      rgba(182,204,107,.050) 31%,
      rgba(118,148,197,.030) 43%,
      transparent 64%),
    radial-gradient(circle 250px at var(--lens-x) var(--lens-y),
      transparent 41%,
      rgba(255,255,255,.035) 47%,
      rgba(213,177,95,.045) 51%,
      rgba(182,204,107,.025) 55%,
      transparent 61%);
  mix-blend-mode:screen;
  transition:opacity .34s ease,transform .5s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}

/* Refined edge response when the optical lens is active. */
.page-home .optical-surface.is-optical-active{
  border-color:rgba(226,205,161,.20);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 0 0 1px rgba(213,177,95,.035),
    0 22px 48px -38px rgba(0,0,0,.64);
}

/* Perspective cards retain their branded aura beneath the lens. */
.page-home .perspective-card.optical-surface::after{
  background:
    radial-gradient(circle 210px at var(--lens-x) var(--lens-y),
      rgba(255,255,255,.14) 0%,
      color-mix(in srgb,var(--card-accent) 11%,transparent) 21%,
      rgba(213,177,95,.045) 38%,
      transparent 65%),
    radial-gradient(circle 260px at var(--lens-x) var(--lens-y),
      transparent 43%,
      color-mix(in srgb,var(--card-accent) 7%,transparent) 50%,
      transparent 60%);
}

/* Foundation tiles get a smaller, tighter lens to keep dense grids calm. */
.page-home .foundation-item.optical-surface::after{
  background:
    radial-gradient(circle 120px at var(--lens-x) var(--lens-y),
      rgba(255,255,255,.11) 0%,
      rgba(213,177,95,.055) 24%,
      rgba(182,204,107,.028) 39%,
      transparent 67%);
}

/* Outcome cards lean warmer to reinforce the premium value section. */
.page-home .outcome-card.optical-surface::after{
  background:
    radial-gradient(circle 180px at var(--lens-x) var(--lens-y),
      rgba(255,255,255,.12) 0%,
      rgba(213,177,95,.07) 23%,
      rgba(182,204,107,.035) 41%,
      transparent 68%);
}

@media(hover:none),(pointer:coarse){
  .page-home .optical-surface::after{display:none}
}

@media(prefers-reduced-motion:reduce){
  .page-home .optical-surface::after{
    transition:none;
    transform:none;
  }
}

@media(prefers-reduced-transparency:reduce){
  .page-home .optical-surface::after{display:none}
}
/* ============================================================
   HOMEPAGE OPTICAL REFRACTION GLASS - END
============================================================ */


/* ============================================================
   MULTIPAGE OPTICAL REFRACTION GLASS - START
   Extends the homepage optical-lens treatment to standard content
   cards across secondary pages. Dense product UI remains untouched.
============================================================ */
body:not(.page-home) .optical-surface{
  --lens-x:50%;
  --lens-y:50%;
  --lens-opacity:0;
  --lens-scale:.94;
  position:relative;
  isolation:isolate;
  overflow:hidden;
}

body:not(.page-home) .optical-surface::after{
  content:"";
  position:absolute;
  inset:-1px;
  z-index:4;
  border-radius:inherit;
  pointer-events:none;
  opacity:var(--lens-opacity);
  transform:scale(var(--lens-scale));
  transform-origin:var(--lens-x) var(--lens-y);
  background:
    radial-gradient(circle 190px at var(--lens-x) var(--lens-y),
      rgba(255,255,255,.13) 0%,
      rgba(255,228,163,.072) 17%,
      rgba(182,204,107,.046) 31%,
      rgba(118,148,197,.028) 43%,
      transparent 64%),
    radial-gradient(circle 250px at var(--lens-x) var(--lens-y),
      transparent 41%,
      rgba(255,255,255,.032) 47%,
      rgba(213,177,95,.042) 51%,
      rgba(182,204,107,.022) 55%,
      transparent 61%);
  mix-blend-mode:screen;
  transition:opacity .34s ease,transform .5s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}

body:not(.page-home) .optical-surface.is-optical-active{
  border-color:rgba(226,205,161,.20);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    inset 0 0 0 1px rgba(213,177,95,.035),
    0 22px 48px -38px rgba(0,0,0,.64);
}

/* Slight page-specific spectral bias while retaining one visual system. */
.page-consumer .card.optical-surface::after{
  background:radial-gradient(circle 190px at var(--lens-x) var(--lens-y),rgba(255,255,255,.13) 0%,rgba(118,148,197,.075) 22%,rgba(182,204,107,.045) 39%,transparent 66%);
}
.page-business .card.optical-surface::after{
  background:radial-gradient(circle 190px at var(--lens-x) var(--lens-y),rgba(255,255,255,.13) 0%,rgba(213,177,95,.078) 22%,rgba(182,204,107,.04) 40%,transparent 66%);
}
.page-marketplace .card.optical-surface::after{
  background:radial-gradient(circle 190px at var(--lens-x) var(--lens-y),rgba(255,255,255,.13) 0%,rgba(199,120,89,.068) 22%,rgba(213,177,95,.045) 39%,transparent 66%);
}
.page-insurance .card.optical-surface::after{
  background:radial-gradient(circle 190px at var(--lens-x) var(--lens-y),rgba(255,255,255,.13) 0%,rgba(118,148,197,.085) 22%,rgba(213,177,95,.04) 40%,transparent 66%);
}
.page-scheduling .card.optical-surface::after{
  background:radial-gradient(circle 190px at var(--lens-x) var(--lens-y),rgba(255,255,255,.13) 0%,rgba(182,204,107,.075) 22%,rgba(118,148,197,.035) 40%,transparent 66%);
}

/* Portal cards use a tighter lens because they contain more copy/actions. */
.page-signin .auth-card.optical-surface::after{
  background:
    radial-gradient(circle 165px at var(--lens-x) var(--lens-y),
      rgba(255,255,255,.12) 0%,
      rgba(213,177,95,.065) 24%,
      rgba(182,204,107,.035) 42%,
      transparent 68%);
}

@media(hover:none),(pointer:coarse){
  body:not(.page-home) .optical-surface::after{display:none}
}
@media(prefers-reduced-motion:reduce){
  body:not(.page-home) .optical-surface::after{
    transition:none;
    transform:none;
  }
}
@media(prefers-reduced-transparency:reduce){
  body:not(.page-home) .optical-surface::after{display:none}
}
/* ============================================================
   MULTIPAGE OPTICAL REFRACTION GLASS - END
============================================================ */


/* ============================================================
   MULTIPAGE OPTICAL REFRACTION FIX - START
   Dedicated lens layer for secondary-page cards. This preserves the
   original .card::after material highlight and makes refraction visible
   and consistent with the homepage treatment.
============================================================ */
body:not(.page-home) .optical-surface::after{
  /* Restore the card's original static surface sheen instead of using
     this pseudo-element as the refraction lens. */
  content:"";
  position:absolute;
  inset:0;
  z-index:0;
  border-radius:inherit;
  pointer-events:none;
  opacity:1;
  transform:none;
  background:linear-gradient(125deg,transparent 25%,rgba(255,255,255,.025),transparent 65%);
  mix-blend-mode:normal;
  transition:none;
}

body:not(.page-home) .optical-refraction-lens{
  position:absolute !important;
  inset:-1px !important;
  z-index:6 !important;
  display:block;
  border-radius:inherit;
  pointer-events:none;
  opacity:var(--lens-opacity,0);
  transform:scale(var(--lens-scale,.94));
  transform-origin:var(--lens-x,50%) var(--lens-y,50%);
  background:
    radial-gradient(circle 210px at var(--lens-x,50%) var(--lens-y,50%),
      rgba(255,255,255,.17) 0%,
      rgba(var(--optical-primary,213,177,95),.10) 18%,
      rgba(var(--optical-secondary,182,204,107),.062) 34%,
      rgba(118,148,197,.035) 46%,
      transparent 65%),
    radial-gradient(circle 275px at var(--lens-x,50%) var(--lens-y,50%),
      transparent 40%,
      rgba(255,255,255,.042) 47%,
      rgba(var(--optical-primary,213,177,95),.055) 51%,
      rgba(var(--optical-secondary,182,204,107),.028) 56%,
      transparent 62%);
  mix-blend-mode:screen;
  transition:opacity .28s ease,transform .46s cubic-bezier(.2,.8,.2,1);
  will-change:opacity,transform;
}

/* Keep card content clearly above its base material, with the optical
   layer acting only as light passing across the glass. */
body:not(.page-home) .card.optical-surface > *:not(.optical-refraction-lens),
body:not(.page-home) .auth-card.optical-surface > *:not(.optical-refraction-lens){
  position:relative;
  z-index:2;
}

body:not(.page-home) .optical-surface.is-optical-active{
  border-color:rgba(226,205,161,.27);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.095),
    inset 0 0 0 1px rgba(213,177,95,.045),
    0 24px 54px -38px rgba(0,0,0,.68);
}

/* Page-specific spectral tuning */
.page-platform{--optical-primary:174,184,115;--optical-secondary:213,177,95}
.page-consumer{--optical-primary:118,148,197;--optical-secondary:182,204,107}
.page-business{--optical-primary:213,177,95;--optical-secondary:182,204,107}
.page-marketplace{--optical-primary:199,120,89;--optical-secondary:213,177,95}
.page-insurance{--optical-primary:118,148,197;--optical-secondary:213,177,95}
.page-scheduling{--optical-primary:182,204,107;--optical-secondary:118,148,197}
.page-company{--optical-primary:174,184,115;--optical-secondary:213,177,95}
.page-download{--optical-primary:182,204,107;--optical-secondary:213,177,95}
.page-signin{--optical-primary:213,177,95;--optical-secondary:182,204,107}

/* Portal cards are larger and copy-heavy, so use a wider softer lens. */
.page-signin .auth-card .optical-refraction-lens{
  background:
    radial-gradient(circle 240px at var(--lens-x,50%) var(--lens-y,50%),
      rgba(255,255,255,.15) 0%,
      rgba(var(--optical-primary),.085) 21%,
      rgba(var(--optical-secondary),.05) 38%,
      transparent 67%);
}

@media(hover:none),(pointer:coarse){
  body:not(.page-home) .optical-refraction-lens{display:none!important}
}
@media(prefers-reduced-motion:reduce){
  body:not(.page-home) .optical-refraction-lens{
    transition:none;
    transform:none;
  }
}
@media(prefers-reduced-transparency:reduce){
  body:not(.page-home) .optical-refraction-lens{display:none!important}
}
/* ============================================================
   MULTIPAGE OPTICAL REFRACTION FIX - END
============================================================ */


/* ============================================================
   PREMIUM BOTANICAL GLASS CONTAINERS - START
   Replaces the remaining legacy purple marketing surfaces with
   smoked FillR green glass, champagne-gold edge material, and the
   shared optical refraction interaction on large feature containers.
============================================================ */
:root{
  --fillr-glass-green:17,27,18;
  --fillr-glass-green-deep:6,10,7;
  --fillr-champagne:218,181,104;
}

/* Main editorial / conversion containers */
body:not(.page-home) .flow,
body:not(.page-home) .quote,
body:not(.page-home) .cta,
body.page-signin .auth-card{
  border:1px solid rgba(var(--fillr-champagne),.38);
  background:
    radial-gradient(circle at 18% 0%,rgba(255,255,255,.075),transparent 34%),
    radial-gradient(circle at 88% 18%,rgba(var(--fillr-champagne),.075),transparent 32%),
    radial-gradient(circle at 20% 110%,rgba(182,204,107,.055),transparent 38%),
    linear-gradient(145deg,rgba(var(--fillr-glass-green),.74),rgba(var(--fillr-glass-green-deep),.68));
  -webkit-backdrop-filter:blur(22px) saturate(126%);
  backdrop-filter:blur(22px) saturate(126%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.085),
    inset 0 0 0 1px rgba(var(--fillr-champagne),.025),
    0 30px 72px -46px rgba(0,0,0,.76);
}

/* Paper sections use the same material instead of reverting to a light panel. */
body:not(.page-home) .paper .flow,
body:not(.page-home) .paper .cta{
  border-color:rgba(var(--fillr-champagne),.34);
  background:
    linear-gradient(180deg,rgba(255,255,255,.04),transparent 24%),
    radial-gradient(circle at 86% 16%,rgba(var(--fillr-champagne),.065),transparent 30%),
    linear-gradient(145deg,rgba(18,29,19,.72),rgba(6,10,7,.70));
  -webkit-backdrop-filter:blur(22px) saturate(124%);
  backdrop-filter:blur(22px) saturate(124%);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.075),
    0 30px 70px -48px rgba(0,0,0,.74);
}
body:not(.page-home) .paper .cta h2,
body:not(.page-home) .paper .flow-step b{color:var(--bone)}
body:not(.page-home) .paper .flow-step span,
body:not(.page-home) .paper .cta p{color:var(--muted)}

/* Flow nodes lose their purple halo and pick up the green/gold material. */
body:not(.page-home) .flow-step::before,
body:not(.page-home) .paper .flow-step::before{
  border-color:rgba(var(--fillr-champagne),.34);
  background:linear-gradient(145deg,rgba(21,31,21,.94),rgba(8,12,8,.96));
  box-shadow:
    0 0 0 8px rgba(7,11,8,.88),
    inset 0 1px 0 rgba(255,255,255,.06),
    0 0 24px rgba(var(--accent-rgb),.12);
}

/* Quote punctuation becomes a restrained champagne watermark. */
body:not(.page-home) .quote::before{color:rgba(var(--fillr-champagne),.13)}

/* Smaller legacy purple utility surfaces become quieter green glass.
   They intentionally do not receive a separate optical lens so dense
   functional UI remains readable and inexpensive to render. */
body:not(.page-home) .dash-side,
body:not(.page-home) .dash-kpi,
body:not(.page-home) .metric,
body:not(.page-home) .cal-head,
body.page-download .download-orbit{
  background:linear-gradient(145deg,rgba(17,27,18,.58),rgba(7,11,8,.50));
  border-color:rgba(var(--fillr-champagne),.16);
  -webkit-backdrop-filter:blur(14px) saturate(116%);
  backdrop-filter:blur(14px) saturate(116%);
}
body:not(.page-home) .dash-side{border-right-color:rgba(var(--fillr-champagne),.14)}
body.page-download .download-orbit{
  border-color:rgba(var(--fillr-champagne),.30);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.065),0 18px 45px rgba(0,0,0,.34);
}

/* Mobile navigation no longer falls back to the old purple surface. */
@media(max-width:900px){
  body:not(.page-home) .nav-links{
    background:rgba(5,9,6,.88);
    -webkit-backdrop-filter:blur(22px) saturate(122%);
    backdrop-filter:blur(22px) saturate(122%);
    border-bottom-color:rgba(var(--fillr-champagne),.15);
  }
}

/* Dedicated optical lens tuning for the larger green/gold containers. */
body:not(.page-home) .flow.optical-surface .optical-refraction-lens,
body:not(.page-home) .quote.optical-surface .optical-refraction-lens,
body:not(.page-home) .cta.optical-surface .optical-refraction-lens,
body.page-signin .auth-card.optical-surface .optical-refraction-lens{
  background:
    radial-gradient(circle 245px at var(--lens-x,50%) var(--lens-y,50%),
      rgba(255,255,255,.16) 0%,
      rgba(var(--fillr-champagne),.105) 20%,
      rgba(182,204,107,.058) 36%,
      rgba(118,148,197,.026) 48%,
      transparent 67%),
    radial-gradient(circle 315px at var(--lens-x,50%) var(--lens-y,50%),
      transparent 41%,
      rgba(255,255,255,.035) 48%,
      rgba(var(--fillr-champagne),.050) 52%,
      transparent 62%);
}
body:not(.page-home) .flow.optical-surface.is-optical-active,
body:not(.page-home) .quote.optical-surface.is-optical-active,
body:not(.page-home) .cta.optical-surface.is-optical-active,
body.page-signin .auth-card.optical-surface.is-optical-active{
  border-color:rgba(var(--fillr-champagne),.58);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.11),
    inset 0 0 0 1px rgba(var(--fillr-champagne),.06),
    0 28px 62px -42px rgba(0,0,0,.72);
}

/* Preserve internal layering beneath the optical surface. */
body:not(.page-home) .flow.optical-surface::before,
body:not(.page-home) .flow.optical-surface::after{z-index:1}
body:not(.page-home) .flow.optical-surface .flow-step{z-index:3}
body:not(.page-home) .quote.optical-surface > *:not(.optical-refraction-lens),
body:not(.page-home) .cta.optical-surface > *:not(.optical-refraction-lens),
body.page-signin .auth-card.optical-surface > *:not(.optical-refraction-lens){
  position:relative;
  z-index:3;
}

@media(prefers-reduced-transparency:reduce){
  body:not(.page-home) .flow,
  body:not(.page-home) .quote,
  body:not(.page-home) .cta,
  body.page-signin .auth-card{
    background:linear-gradient(145deg,rgb(17,27,18),rgb(6,10,7));
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
  }
}
/* ============================================================
   PREMIUM BOTANICAL GLASS CONTAINERS - END
============================================================ */

/* ============================================================
   STATIC FULL-TREE HERO — v63
   The lighting and root visibility are baked into the artwork.
   The tree itself remains completely still while node interactions
   continue to explain the ecosystem layers.
============================================================ */
.page-home .photo-tree-stage--full .tree-photo-wrap{
  transform:none!important;
  transition:none!important;
  -webkit-mask-image:none;
  mask-image:none;
  background:#030403;
}
.page-home .photo-tree-stage--full .tree-photo-wrap::before,
.page-home .photo-tree-stage--full .tree-core-glow,
.page-home .photo-tree-stage--full .tree-light-sweep,
.page-home .photo-tree-stage--full .tree-particles{
  display:none!important;
}
.page-home .photo-tree-stage--full .tree-photo-wrap picture{
  display:block;
  width:100%;
  height:100%;
}
.page-home .photo-tree-stage--full .tree-photo{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:56% 50%;
  animation:none!important;
  transform:none!important;
  transition:none!important;
  filter:none;
}
@media(min-width:901px){
  .page-home .photo-tree-hero--fullbleed{
    height:calc(100svh - 74px);
    min-height:620px;
    padding:8px 0 66px;
  }
  .page-home .photo-tree-stage--full{
    height:100%;
    min-height:0;
  }
}
@media(max-width:900px){
  .page-home .photo-tree-stage--full .tree-photo{
    object-fit:cover;
    object-position:50% 50%;
  }
}
/* ============================================================
   STATIC FULL-TREE HERO — END
============================================================ */

/* ============================================================
   SEAMLESS TREE + PRECISION NODE MAP — v64
============================================================ */
.page-home .hero-full-stage-wrap{
  width:100%;
  max-width:none;
}
.page-home .photo-tree-stage--full,
.page-home .photo-tree-stage--full .tree-photo-wrap{
  border:0!important;
  border-radius:0!important;
  box-shadow:none!important;
  outline:0!important;
}
.page-home .photo-tree-stage--full::before{
  display:none!important;
}
.page-home .photo-tree-stage--full .tree-photo-wrap{
  background:transparent;
  -webkit-mask-image:radial-gradient(ellipse 91% 96% at 54% 50%,#000 0 80%,rgba(0,0,0,.96) 87%,transparent 100%);
  mask-image:radial-gradient(ellipse 91% 96% at 54% 50%,#000 0 80%,rgba(0,0,0,.96) 87%,transparent 100%);
}
.page-home .photo-tree-stage--full .tree-photo{
  transform:translateX(4.2%) scale(.985)!important;
  transform-origin:center center;
  mix-blend-mode:screen;
}
.page-home .photo-tree-stage--full [data-node="fillr-ecosystem"]{
  --x:56%!important;
  --y:62%!important;
}
@media(max-width:900px){
  .page-home .photo-tree-stage--full .tree-photo-wrap{
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 5%,#000 95%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,#000 5%,#000 95%,transparent 100%);
  }
  .page-home .photo-tree-stage--full .tree-photo{
    transform:translateX(3%) scale(1.01)!important;
  }
  .page-home .photo-tree-stage--full [data-node="fillr-ecosystem"]{
    --x:54%!important;
    --y:61%!important;
  }
}
/* ============================================================
   SEAMLESS TREE + PRECISION NODE MAP — END
============================================================ */

/* ============================================================
   RIGHT-SIDE FULL HERO TREE CANVAS — v65
   The side navigation owns the left rail. The tree image and its
   coordinate plane fill the remaining hero width and full height.
============================================================ */
.page-home .photo-tree-stage--full{
  --tree-canvas-left:clamp(310px,23vw,370px);
  overflow:hidden;
}
.page-home .photo-tree-stage--full .tree-photo-wrap{
  top:0;
  right:0;
  bottom:0;
  left:var(--tree-canvas-left)!important;
  width:auto;
  height:auto;
  overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 100%);
}
.page-home .photo-tree-stage--full .tree-photo{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center center;
  transform:none!important;
}
.page-home .tree-coordinate-plane{
  position:absolute;
  z-index:4;
  top:50%;
  left:calc(50% + clamp(155px,11.5vw,185px));
  width:auto;
  height:100%;
  aspect-ratio:1672/941;
  transform:translate(-50%,-50%);
  pointer-events:none;
}
.page-home .tree-coordinate-plane .ecosystem-overlay{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
}
.page-home .tree-coordinate-plane .tree-node-v2,
.page-home .tree-coordinate-plane .tree-node-tooltip{
  pointer-events:auto;
}
@media(max-width:900px){
  .page-home .photo-tree-stage--full{
    --tree-canvas-left:0px;
  }
  .page-home .tree-coordinate-plane{left:50%}
  .page-home .photo-tree-stage--full .tree-photo-wrap{
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 4%,#000 96%,transparent 100%);
    mask-image:linear-gradient(180deg,transparent 0,#000 4%,#000 96%,transparent 100%);
  }
}
/* ============================================================
   RIGHT-SIDE FULL HERO TREE CANVAS — END
============================================================ */

/* ============================================================
   VISIBLE NODE SAFE AREA — v66
   Keep the complete interaction map inside the same visible canvas
   as the tree background so edge nodes cannot be cropped.
============================================================ */
.page-home .tree-coordinate-plane{
  top:0;
  right:0;
  bottom:0;
  left:var(--tree-canvas-left)!important;
  width:auto;
  height:auto;
  aspect-ratio:auto;
  transform:none;
}

@media(max-width:900px){
  .page-home .tree-coordinate-plane{
    left:0!important;
  }
}
/* ============================================================
   VISIBLE NODE SAFE AREA — END
============================================================ */

/* ============================================================
   CONTAINED NODE DETAIL PANELS — v67
============================================================ */
.page-home .tree-coordinate-plane .tree-node-tooltip{
  box-sizing:border-box;
  max-width:calc(100% - 36px);
  max-height:calc(100% - 36px);
  overflow:auto;
  overscroll-behavior:contain;
}

@media(max-width:760px){
  .page-home .tree-coordinate-plane .tree-node-tooltip{
    max-width:none;
    max-height:calc(100% - 24px);
  }
}
/* ============================================================
   CONTAINED NODE DETAIL PANELS — END
============================================================ */

/* ============================================================
   LEFT-ALIGNED TREE NODE MAP — v68
   Shift nodes and their connection paths as one coordinated layer.
============================================================ */
.page-home .tree-coordinate-plane .ecosystem-overlay{
  transform:translateX(-7%);
  transform-origin:center center;
}
.page-home .tree-coordinate-plane .tree-node-v2{
  left:calc(var(--x) - 7%)!important;
}

@media(max-width:900px){
  .page-home .tree-coordinate-plane .ecosystem-overlay{
    transform:translateX(-3.5%);
  }
  .page-home .tree-coordinate-plane .tree-node-v2{
    left:calc(var(--x) - 3.5%)!important;
  }
}
/* ============================================================
   LEFT-ALIGNED TREE NODE MAP — END
============================================================ */

/* ============================================================
   FULL-HEIGHT TREE HERO — v69
   Reclaim the former story-cue footer so the tree stage reaches
   the hero's lower edge at every responsive size.
============================================================ */
.page-home .photo-tree-hero--fullbleed{
  align-items:stretch;
  padding-bottom:0!important;
}
.page-home .hero-full-stage-wrap{
  flex:1 1 auto;
  min-height:0;
}
.page-home .photo-tree-stage--full{
  width:100%;
  height:100%;
  margin:0!important;
}

@media(min-width:901px){
  .page-home .photo-tree-hero--fullbleed{
    height:calc(100svh - 114px);
    padding-top:8px;
  }
}
/* ============================================================
   FULL-HEIGHT TREE HERO — END
============================================================ */

/* ============================================================
   CLIENT NODE HIERARCHY — v70
   Secondary products fan out from their parent platform anchors.
============================================================ */
.page-home .photo-tree-stage--full .tree-node-v2 strong{
  width:max-content;
  white-space:normal;
  text-align:center;
  line-height:1.18;
}
.page-home .photo-tree-stage--full .node-secondary strong{
  width:118px;
  max-width:118px;
  font-size:.54rem;
}
.page-home .photo-tree-stage--full .node-primary strong{
  width:132px;
  max-width:132px;
  font-size:.58rem;
}
.page-home .photo-tree-stage--full .node-root strong{
  width:112px;
  max-width:112px;
  font-size:.52rem;
}
.page-home .photo-tree-stage--full .tree-node-v2.parent-context{
  opacity:.74;
  filter:none;
  transform:translate(-50%,-50%) scale(.82);
}
.page-home .photo-tree-stage--full .tree-node-v2.parent-context strong{
  opacity:.9;
  transform:translate(-50%,0);
  border-color:color-mix(in srgb,var(--node) 28%,transparent);
  color:color-mix(in srgb,var(--node) 80%,#fff 20%);
}
.page-home .photo-tree-stage--full .node-secondary[data-parent="consumer-platform"] .node-halo{
  box-shadow:0 0 0 7px rgba(182,204,107,.05),0 0 38px rgba(182,204,107,.25);
}
.page-home .photo-tree-stage--full .node-secondary[data-parent="business-platform"] .node-halo{
  box-shadow:0 0 0 7px rgba(213,177,95,.05),0 0 38px rgba(213,177,95,.25);
}
.page-home .photo-tree-stage--full .node-secondary[data-parent="marketplace-platform"] .node-halo{
  box-shadow:0 0 0 7px rgba(199,120,89,.05),0 0 38px rgba(199,120,89,.25);
}
.page-home .photo-tree-stage--full .node-secondary[data-parent="platform-operations"] .node-halo{
  box-shadow:0 0 0 7px rgba(118,148,197,.05),0 0 38px rgba(118,148,197,.25);
}

@media(max-width:900px){
  .page-home .photo-tree-stage--full .tree-node-v2.parent-context{
    transform:translate(-50%,-50%) scale(.74);
  }
}
/* ============================================================
   CLIENT NODE HIERARCHY — END
============================================================ */

/* ============================================================
   CANOPY OUTCOME FAMILIES — v71
   Four outcome anchors each fan out to three connected outcomes.
============================================================ */
.page-home .photo-tree-stage--full .node-canopy-main{
  width:76px;
  height:76px;
}
.page-home .photo-tree-stage--full .node-canopy-main .node-halo{
  inset:5px;
  box-shadow:0 0 0 8px color-mix(in srgb,var(--node) 6%,transparent),0 0 46px color-mix(in srgb,var(--node) 32%,transparent);
}
.page-home .photo-tree-stage--full .node-canopy-main .node-core{
  width:31px;
  height:31px;
  font-size:.62rem;
}
.page-home .photo-tree-stage--full .node-canopy-main strong{
  top:69px;
  width:132px;
  max-width:132px;
  font-size:.59rem;
  border-color:color-mix(in srgb,var(--node) 30%,transparent);
  color:color-mix(in srgb,var(--node) 75%,#fff 25%);
}
.page-home .photo-tree-stage--full .node-canopy-sub{
  width:52px;
  height:52px;
}
.page-home .photo-tree-stage--full .node-canopy-sub .node-halo{inset:6px}
.page-home .photo-tree-stage--full .node-canopy-sub .node-core{
  width:22px;
  height:22px;
  font-size:.48rem;
}
.page-home .photo-tree-stage--full .node-canopy-sub strong{
  top:48px;
  width:112px;
  max-width:112px;
  font-size:.51rem;
}

@media(max-width:900px){
  .page-home .photo-tree-stage--full .node-canopy-main{
    width:58px;
    height:58px;
  }
  .page-home .photo-tree-stage--full .node-canopy-sub{
    width:42px;
    height:42px;
  }
}
/* ============================================================
   CANOPY OUTCOME FAMILIES — END
============================================================ */

/* ============================================================
   SEAMLESS MOODY HERO SIDE LIGHTING — v74 / v71 BASELINE
   Static champagne-and-sage illumination spans the full hero so
   the outer light blends naturally through the tree canvas seam.
============================================================ */
.page-home .photo-tree-stage--full::after{
  content:"";
  position:absolute;
  z-index:2;
  inset:0;
  pointer-events:none;
  background:
    radial-gradient(ellipse 48% 100% at -1% 50%,rgba(222,229,158,.29) 0%,rgba(208,192,123,.17) 30%,rgba(119,143,99,.075) 54%,transparent 78%),
    radial-gradient(ellipse 46% 98% at 101% 50%,rgba(242,216,139,.30) 0%,rgba(202,188,119,.18) 31%,rgba(111,139,100,.085) 55%,transparent 78%);
  mix-blend-mode:screen;
  opacity:.88;
  animation:none!important;
  transition:none!important;
}
@media(max-width:900px){
  .page-home .photo-tree-stage--full::after{
    opacity:.68;
    background:
      radial-gradient(ellipse 58% 92% at -3% 53%,rgba(222,229,158,.21) 0%,rgba(208,192,123,.12) 32%,rgba(119,143,99,.052) 57%,transparent 80%),
      radial-gradient(ellipse 56% 92% at 103% 53%,rgba(242,216,139,.23) 0%,rgba(202,188,119,.14) 33%,rgba(111,139,100,.065) 58%,transparent 80%);
  }
}
/* ============================================================
   SEAMLESS MOODY HERO SIDE LIGHTING — END
============================================================ */

/* ============================================================
   ENTERPRISE SCHEDULING EXPANDED DOCK — v76
   Preserves the approved tree canvas, extends the root-ground
   atmosphere beneath it, and docks one expanded prototype panel.
============================================================ */
.page-home .hero-full-stage-wrap{
  --tree-canvas-left:clamp(310px,23vw,370px);
  --tree-dock-space:188px;
}
.page-home .photo-tree-stage--full{grid-row:1}
.tree-expanded-dock-shell{
  position:relative;
  z-index:6;
  grid-row:2;
  min-width:0;
  display:flex;
  align-items:center;
  padding:18px 28px 18px calc(var(--tree-canvas-left) + 28px);
  overflow:hidden;
  isolation:isolate;
  background:
    radial-gradient(ellipse 38% 150% at 24% 0%,rgba(182,204,107,.08),transparent 72%),
    radial-gradient(ellipse 42% 150% at 88% 0%,rgba(213,177,95,.10),transparent 74%),
    linear-gradient(180deg,rgba(5,7,5,.78),#050706 74%);
}
.tree-expanded-dock-shell::before{
  content:"";
  position:absolute;
  z-index:-2;
  top:-34px;
  right:-18px;
  bottom:-26px;
  left:var(--tree-canvas-left);
  background:linear-gradient(180deg,rgba(4,6,4,.42),rgba(4,6,4,.78) 42%,rgba(3,4,3,.96));
  filter:blur(12px) saturate(.74) brightness(.58);
  transform:scale(1.045);
  opacity:.62;
}
.tree-expanded-dock-shell::after{
  content:"";
  position:absolute;
  z-index:-1;
  top:0;
  right:0;
  left:var(--tree-canvas-left);
  height:1px;
  background:linear-gradient(90deg,transparent,rgba(239,215,134,.28) 22%,rgba(182,204,107,.18) 58%,transparent);
  box-shadow:0 -22px 54px rgba(213,177,95,.055);
}
.tree-expanded-dock{
  position:relative;
  width:100%;
  min-width:0;
  min-height:150px;
  display:grid;
  grid-template-columns:minmax(190px,.95fr) minmax(300px,1.65fr) minmax(250px,1.25fr) auto;
  align-items:center;
  gap:clamp(18px,2vw,32px);
  padding:18px 20px 18px 24px;
  border:1px solid rgba(239,215,134,.18);
  border-radius:22px;
  background:
    linear-gradient(135deg,rgba(18,22,15,.91),rgba(7,9,6,.88)),
    radial-gradient(circle at 0 0,rgba(182,204,107,.08),transparent 42%);
  -webkit-backdrop-filter:blur(18px) saturate(118%);
  backdrop-filter:blur(18px) saturate(118%);
  box-shadow:0 28px 72px -46px #000,inset 0 1px rgba(255,255,255,.045);
  overflow:hidden;
  animation:enterpriseDockIn .34s cubic-bezier(.2,.8,.2,1) both;
}
.tree-expanded-dock::before{
  content:"";
  position:absolute;
  inset:0 auto 0 0;
  width:3px;
  background:linear-gradient(180deg,rgba(239,215,134,.22),#d5b15f 48%,rgba(182,204,107,.28));
  box-shadow:0 0 28px rgba(213,177,95,.28);
}
.tree-expanded-dock[hidden]{display:none}
.tree-expanded-dock__identity,
.tree-expanded-dock__description,
.tree-expanded-dock__highlights{min-width:0}
.tree-expanded-dock__eyebrow,
.tree-expanded-dock__description > span,
.tree-expanded-dock__highlights > span{
  display:block;
  color:#bca462;
  font:700 8px/1.2 "JetBrains Mono",monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.tree-expanded-dock__identity h2{
  margin:8px 0 0;
  color:#f2f3eb;
  font:600 clamp(1.15rem,1.6vw,1.55rem)/1.02 "Bricolage Grotesque",sans-serif;
  letter-spacing:-.025em;
}
.tree-expanded-dock__identity p{
  margin:8px 0 0;
  color:#d6c88d;
  font-size:.7rem;
  line-height:1.45;
}
.tree-expanded-dock__description p{
  margin:8px 0 0;
  color:#c7cbc0;
  font-size:.7rem;
  line-height:1.58;
}
.tree-expanded-dock__highlights ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px 12px;
  margin:9px 0 0;
  padding:0;
  list-style:none;
}
.tree-expanded-dock__highlights li{
  position:relative;
  padding-left:12px;
  color:#d9dcd2;
  font-size:.64rem;
  line-height:1.35;
}
.tree-expanded-dock__highlights li::before{
  content:"";
  position:absolute;
  top:.42em;
  left:0;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#d5b15f;
  box-shadow:0 0 10px rgba(213,177,95,.5);
}
.tree-expanded-dock__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  min-height:46px;
  padding:0 18px;
  border:1px solid rgba(239,215,134,.34);
  border-radius:999px;
  color:#f1e5b5;
  background:linear-gradient(135deg,rgba(213,177,95,.16),rgba(182,204,107,.055));
  box-shadow:inset 0 1px rgba(255,255,255,.045),0 18px 38px -30px rgba(213,177,95,.7);
  font-size:.7rem;
  font-weight:700;
  white-space:nowrap;
  transition:border-color .25s,background .25s,transform .25s;
}
.tree-expanded-dock__cta:hover,
.tree-expanded-dock__cta:focus-visible{
  border-color:rgba(239,215,134,.62);
  background:linear-gradient(135deg,rgba(213,177,95,.25),rgba(182,204,107,.09));
  transform:translateY(-2px);
}
@keyframes enterpriseDockIn{
  from{opacity:0;transform:translateY(10px)}
  to{opacity:1;transform:translateY(0)}
}
@media(min-width:901px){
  .page-home .photo-tree-hero--fullbleed{
    height:calc(100svh - 114px + var(--tree-dock-space,188px));
    min-height:calc(620px + var(--tree-dock-space,188px));
  }
  .page-home .hero-full-stage-wrap{
    height:100%;
    display:grid;
    grid-template-rows:minmax(620px,1fr) var(--tree-dock-space);
  }
  .page-home .photo-tree-stage--full{height:100%}
}
@media(max-width:1180px) and (min-width:901px){
  .tree-expanded-dock{
    grid-template-columns:minmax(165px,.9fr) minmax(260px,1.5fr) minmax(210px,1.1fr) auto;
    gap:16px;
    padding-inline:20px;
  }
}
@media(max-width:900px){
  .page-home .hero-full-stage-wrap{
    --tree-canvas-left:0px;
    --tree-dock-space:340px;
    height:auto;
    display:grid;
    grid-template-rows:auto var(--tree-dock-space);
  }
  .page-home .photo-tree-hero--fullbleed{
    height:auto!important;
    min-height:0;
  }
  .tree-expanded-dock-shell{
    padding:14px;
  }
  .tree-expanded-dock-shell::before,
  .tree-expanded-dock-shell::after{left:0}
  .tree-expanded-dock{
    min-height:310px;
    grid-template-columns:1fr;
    align-content:center;
    gap:13px;
    padding:20px;
    border-radius:18px;
  }
  .tree-expanded-dock__identity h2{font-size:1.18rem}
  .tree-expanded-dock__identity p{margin-top:5px}
  .tree-expanded-dock__description p{font-size:.68rem;line-height:1.5}
  .tree-expanded-dock__highlights ul{gap:6px 10px}
  .tree-expanded-dock__cta{justify-self:start;min-height:42px}
}
@media(max-width:420px){
  .page-home .hero-full-stage-wrap{--tree-dock-space:370px}
  .tree-expanded-dock-shell{padding:10px}
  .tree-expanded-dock{min-height:344px;padding:18px}
  .tree-expanded-dock__highlights ul{grid-template-columns:1fr;gap:5px}
}
@media(prefers-reduced-motion:reduce){
  .tree-expanded-dock{animation:none!important}
}
/* ============================================================
   ENTERPRISE SCHEDULING EXPANDED DOCK — END
============================================================ */

/* ============================================================
   CONTINUOUS EXTENDED-ROOT ARTWORK — v77
   One uninterrupted image now spans the approved tree canvas and
   the expanded information dock, eliminating the former cut line.
============================================================ */
.page-home .hero-full-stage-wrap{
  isolation:isolate;
  background:#030403;
}
.tree-extended-artwork{
  position:absolute;
  z-index:0;
  top:0;
  right:0;
  bottom:0;
  left:var(--tree-canvas-left);
  overflow:hidden;
  pointer-events:none;
  -webkit-mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0,#000 4%,#000 100%);
}
.tree-extended-artwork img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:52% 48%;
  mix-blend-mode:screen;
  filter:saturate(.96) contrast(1.02) brightness(.98);
}
.page-home .photo-tree-stage--full{
  z-index:1;
  background:transparent;
}
.page-home .photo-tree-stage--full .tree-photo-wrap{
  display:none!important;
}
.page-home .tree-coordinate-plane{
  transform:translateY(-4.5%);
}
.tree-expanded-dock-shell{
  background:
    linear-gradient(180deg,rgba(3,4,3,.08),rgba(3,4,3,.30) 44%,rgba(3,4,3,.62)),
    radial-gradient(ellipse 42% 150% at 88% 0%,rgba(213,177,95,.075),transparent 74%);
}
.tree-expanded-dock-shell::before{display:none}
.tree-expanded-dock-shell::after{
  background:linear-gradient(90deg,transparent,rgba(239,215,134,.16) 28%,rgba(182,204,107,.10) 62%,transparent);
  box-shadow:0 -26px 64px rgba(213,177,95,.035);
}
@media(max-width:900px){
  .tree-extended-artwork{
    left:0;
    -webkit-mask-image:linear-gradient(180deg,transparent 0,#000 3%,#000 100%);
    mask-image:linear-gradient(180deg,transparent 0,#000 3%,#000 100%);
  }
  .tree-extended-artwork img{
    object-position:50% 46%;
  }
  .page-home .tree-coordinate-plane{
    transform:translateY(-2.5%);
  }
}
/* ============================================================
   CONTINUOUS EXTENDED-ROOT ARTWORK — END
============================================================ */

/* ============================================================
   ABOVE-THE-FOLD EXPANDED DOCK — v78
   On desktop, the dock occupies a reserved lower band inside the
   initial hero viewport while the extended roots remain behind it.
============================================================ */
@media(min-width:901px){
  .page-home .photo-tree-hero--fullbleed{
    height:calc(100svh - 114px)!important;
    min-height:620px;
  }
  .page-home .hero-full-stage-wrap{
    height:100%;
    display:block;
  }
  .page-home .photo-tree-stage--full{
    position:relative;
    width:100%;
    height:100%;
  }
  .page-home .tree-layer-nav{
    top:0;
    bottom:var(--tree-dock-space);
    margin-block:auto;
  }
  .tree-expanded-dock-shell{
    position:absolute;
    z-index:14;
    left:0;
    right:0;
    bottom:0;
    height:var(--tree-dock-space);
  }
}
/* ============================================================
   ABOVE-THE-FOLD EXPANDED DOCK — END
============================================================ */

/* The extended roots are one continuous artwork; avoid a decorative
   hairline that could be mistaken for an image or compositing seam. */
.tree-expanded-dock-shell::after{
  display:none!important;
}

/* ============================================================
   REFINED SIDE-NAVIGATION HALO — v81
   The navigation-side light is localized behind the rail and a
   restrained continuation fades through the reserved dock band.
============================================================ */
@media(min-width:901px){
  .page-home .photo-tree-stage--full::after{
    background:
      radial-gradient(ellipse 34% 72% at 7% 48%,rgba(222,229,158,.18) 0%,rgba(208,192,123,.10) 35%,rgba(119,143,99,.04) 58%,transparent 78%),
      radial-gradient(ellipse 46% 98% at 101% 50%,rgba(242,216,139,.30) 0%,rgba(202,188,119,.18) 31%,rgba(111,139,100,.085) 55%,transparent 78%);
    opacity:.88;
  }
  .page-home .tree-layer-nav{
    box-shadow:
      0 34px 84px -48px #000,
      0 0 72px -38px rgba(182,204,107,.27),
      inset 0 1px rgba(255,255,255,.045);
  }
  .page-home .tree-expanded-dock-shell{
    background:
      radial-gradient(ellipse 34% 150% at 7% -28%,rgba(222,229,158,.09) 0%,rgba(208,192,123,.045) 35%,rgba(119,143,99,.018) 56%,transparent 72%),
      linear-gradient(180deg,rgba(3,4,3,.08),rgba(3,4,3,.30) 44%,rgba(3,4,3,.62)),
      radial-gradient(ellipse 42% 150% at 88% 0%,rgba(213,177,95,.075),transparent 74%);
  }
}
/* ============================================================
   REFINED SIDE-NAVIGATION HALO — END
============================================================ */

/* ============================================================
   CONTINUOUS NAVIGATION-SIDE LIGHT — v82
   The extended-root dock treatment begins at the tree canvas,
   leaving the navigation column transparent to the single hero
   light field behind it. This removes the horizontal cutoff.
============================================================ */
@media(min-width:901px){
  .page-home .tree-expanded-dock-shell{
    background:
      linear-gradient(180deg,rgba(3,4,3,.08),rgba(3,4,3,.30) 44%,rgba(3,4,3,.62)) right top / calc(100% - var(--tree-canvas-left)) 100% no-repeat,
      radial-gradient(ellipse 42% 150% at 88% 0%,rgba(213,177,95,.075),transparent 74%) right top / calc(100% - var(--tree-canvas-left)) 100% no-repeat;
  }
}
/* ============================================================
   CONTINUOUS NAVIGATION-SIDE LIGHT — END
============================================================ */

/* ============================================================
   TREE NODE ICONOGRAPHY — v83
   Semantic, restrained symbols replace the former abbreviations
   while the approved node geometry and interaction remain intact.
============================================================ */
.page-home .tree-node-v2 .node-core--icon{
  font-family:"Segoe UI Symbol","Noto Sans Symbols 2",sans-serif;
  font-size:clamp(.7rem,.9vw,.86rem);
  font-weight:400;
  line-height:1;
  letter-spacing:0;
  text-shadow:0 0 12px color-mix(in srgb,var(--node) 58%,transparent);
}
.page-home .tree-node-v2.node-root .node-core--icon{
  font-size:.72rem;
}
@media(max-width:900px){
  .page-home .tree-node-v2 .node-core--icon{
    font-size:.64rem!important;
  }
}
@media(max-width:520px){
  .page-home .tree-node-v2 .node-core--icon{
    font-size:.55rem!important;
  }
}
/* ============================================================
   TREE NODE ICONOGRAPHY — END
============================================================ */

/* ============================================================
   LARGER NODE ICONS AND LABELS — v84
   Desktop symbols and captions gain presence without changing
   the approved node coordinates or interaction geometry.
============================================================ */
@media(min-width:901px){
  .page-home .tree-node-v2 .node-core:not(.node-core--logo){
    width:30px;
    height:30px;
  }
  .page-home .tree-node-v2 .node-core--icon{
    font-size:clamp(.9rem,1.05vw,1.08rem);
  }
  .page-home .tree-node-v2 strong{
    top:59px;
    max-width:170px;
    padding:6px 9px;
    font-size:.67rem;
    line-height:1.2;
  }
  .page-home .tree-node-v2.node-primary .node-core--icon{
    width:34px;
    height:34px;
    font-size:1.08rem;
  }
  .page-home .tree-node-v2.node-primary strong{
    top:66px;
    font-size:.71rem;
  }
  .page-home .photo-tree-stage--full .node-canopy-main .node-core--icon{
    width:35px;
    height:35px;
    font-size:1.1rem;
  }
  .page-home .photo-tree-stage--full .node-canopy-main strong{
    top:72px;
    width:154px;
    max-width:154px;
    font-size:.7rem;
  }
  .page-home .photo-tree-stage--full .node-canopy-sub .node-core--icon{
    width:28px;
    height:28px;
    font-size:.88rem;
  }
  .page-home .photo-tree-stage--full .node-canopy-sub strong{
    top:51px;
    width:128px;
    max-width:128px;
    font-size:.62rem;
  }
  .page-home .tree-node-v2.node-root .node-core--icon{
    width:28px;
    height:28px;
    font-size:.92rem;
  }
  .page-home .tree-node-v2.node-root strong{
    top:54px;
    font-size:.64rem;
  }
}
@media(max-width:900px){
  .page-home .tree-node-v2 .node-core--icon{
    font-size:.7rem!important;
  }
}
@media(max-width:520px){
  .page-home .tree-node-v2 .node-core--icon{
    font-size:.61rem!important;
  }
}
/* ============================================================
   LARGER NODE ICONS AND LABELS — END
============================================================ */

/* ============================================================
   NODE-ATTACHED ROOT DETAIL MODALS — v86
   Rich root content uses the same floating modal language as the
   Consumer Platform node, positioned beside its respective node.
============================================================ */
.page-home .tree-node-modal.has-rich-content{
  width:min(410px,90vw);
  max-height:calc(100% - 36px);
  padding:19px 20px 18px;
  overflow:auto;
  border-color:rgba(239,214,135,.24);
  background:
    linear-gradient(145deg,rgba(18,22,15,.96),rgba(6,8,5,.94)),
    radial-gradient(circle at 0 0,rgba(182,204,107,.08),transparent 44%);
  box-shadow:0 42px 96px -48px #000,inset 0 1px rgba(255,255,255,.05),0 0 0 1px rgba(213,177,95,.035);
}
.page-home .tree-node-modal__tagline{
  display:block;
  margin-top:6px;
  color:#d6c88d;
  font-size:.7rem;
  line-height:1.4;
}
.page-home .tree-node-modal.has-rich-content > p{
  margin-top:11px;
  color:#b7bcb1;
  font-size:.73rem;
  line-height:1.55;
}
.page-home .tree-node-modal__highlights{
  margin-top:13px;
  padding-top:12px;
  border-top:1px solid rgba(237,239,224,.09);
}
.page-home .tree-node-modal__highlights > span{
  display:block;
  color:#bca462;
  font:700 8px/1.2 "JetBrains Mono",monospace;
  letter-spacing:.16em;
  text-transform:uppercase;
}
.page-home .tree-node-modal__highlights ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:7px 12px;
  margin:9px 0 0;
  padding:0;
  list-style:none;
}
.page-home .tree-node-modal__highlights li{
  position:relative;
  padding-left:12px;
  color:#d9dcd2;
  font-size:.65rem;
  line-height:1.35;
}
.page-home .tree-node-modal__highlights li::before{
  content:"";
  position:absolute;
  top:.42em;
  left:0;
  width:4px;
  height:4px;
  border-radius:50%;
  background:#d5b15f;
  box-shadow:0 0 9px rgba(213,177,95,.48);
}
.page-home .photo-tree-panel .tree-node-modal__cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  min-height:38px;
  margin-top:14px;
  padding:0 15px;
  border:1px solid rgba(239,215,134,.3);
  border-radius:999px;
  color:#f1e5b5;
  background:linear-gradient(135deg,rgba(213,177,95,.15),rgba(182,204,107,.05));
}
.page-home .photo-tree-panel .tree-node-modal__cta:hover,
.page-home .photo-tree-panel .tree-node-modal__cta:focus-visible{
  border-color:rgba(239,215,134,.56);
  background:linear-gradient(135deg,rgba(213,177,95,.23),rgba(182,204,107,.08));
}
@media(max-width:760px){
  .page-home .tree-node-modal.has-rich-content{
    max-height:calc(100% - 24px);
    padding:17px;
  }
}
@media(max-width:520px){
  .page-home .tree-node-modal__highlights ul{
    grid-template-columns:1fr;
    gap:5px;
  }
}
/* ============================================================
   NODE-ATTACHED ROOT DETAIL MODALS — END
============================================================ */

/* ============================================================
   INSURANCE LONG-FORM READING OVERLAY — v87
   The node modal remains concise; its CTA opens this focused,
   scrollable editorial surface for the full Insurance narrative.
============================================================ */
body.reading-overlay-open{overflow:hidden}
.page-home .photo-tree-panel button.tree-node-modal__cta{
  appearance:none;
  font:inherit;
  cursor:pointer;
}
.insurance-reading-overlay{
  position:fixed;
  z-index:9000;
  inset:0;
  display:grid;
  place-items:center;
  padding:clamp(14px,2.5vw,34px);
  opacity:0;
  transition:opacity .22s ease;
}
.insurance-reading-overlay[hidden]{display:none}
.insurance-reading-overlay.is-open{opacity:1}
.insurance-reading-overlay__backdrop{
  position:absolute;
  inset:0;
  background:
    radial-gradient(circle at 72% 18%,rgba(118,148,197,.13),transparent 34%),
    radial-gradient(circle at 20% 78%,rgba(182,204,107,.08),transparent 32%),
    rgba(1,3,2,.88);
  -webkit-backdrop-filter:blur(18px) saturate(82%);
  backdrop-filter:blur(18px) saturate(82%);
}
.insurance-reading-panel{
  position:relative;
  width:min(1120px,100%);
  max-height:calc(100svh - clamp(28px,5vw,68px));
  overflow:auto;
  overscroll-behavior:contain;
  border:1px solid rgba(158,175,208,.22);
  border-radius:26px;
  color:#e6e9e2;
  background:
    linear-gradient(145deg,rgba(16,20,15,.985),rgba(4,7,5,.985)),
    radial-gradient(circle at 90% 0,rgba(118,148,197,.1),transparent 38%);
  box-shadow:0 56px 140px -50px #000,inset 0 1px rgba(255,255,255,.055),0 0 80px -50px rgba(118,148,197,.48);
  transform:translateY(18px) scale(.985);
  transition:transform .28s cubic-bezier(.2,.8,.2,1);
  scrollbar-color:rgba(158,175,208,.38) transparent;
}
.insurance-reading-overlay.is-open .insurance-reading-panel{transform:translateY(0) scale(1)}
.insurance-reading-panel__close{
  position:sticky;
  z-index:4;
  top:14px;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  margin:14px 14px -52px auto;
  border:1px solid rgba(225,230,219,.18);
  border-radius:50%;
  color:#e7eadf;
  background:rgba(8,11,8,.84);
  -webkit-backdrop-filter:blur(12px);
  backdrop-filter:blur(12px);
  box-shadow:0 14px 30px -18px #000;
  font-size:1.25rem;
  cursor:pointer;
  transition:border-color .2s,background .2s,transform .2s;
}
.insurance-reading-panel__close:hover,
.insurance-reading-panel__close:focus-visible{
  border-color:rgba(158,175,208,.5);
  background:rgba(118,148,197,.14);
  transform:rotate(4deg);
  outline:none;
}
.insurance-reading-panel__header{
  position:relative;
  padding:clamp(34px,5vw,68px) clamp(24px,5vw,68px) clamp(30px,4vw,52px);
  border-bottom:1px solid rgba(225,230,219,.09);
  overflow:hidden;
}
.insurance-reading-panel__header::after{
  content:"";
  position:absolute;
  right:-8%;
  bottom:-62%;
  width:54%;
  aspect-ratio:1;
  border-radius:50%;
  background:radial-gradient(circle,rgba(118,148,197,.18),transparent 68%);
  pointer-events:none;
}
.insurance-reading-panel__eyebrow,
.insurance-reading-panel__closing > span{
  display:block;
  color:#9eafd0;
  font:700 9px/1.2 "JetBrains Mono",monospace;
  letter-spacing:.18em;
  text-transform:uppercase;
}
.insurance-reading-panel__header h2{
  position:relative;
  z-index:1;
  max-width:880px;
  margin:16px 0 0;
  color:#f2f3ed;
  font:600 clamp(2rem,4.4vw,4.2rem)/.98 "Bricolage Grotesque",sans-serif;
  letter-spacing:-.045em;
}
.insurance-reading-panel__header h2 span{color:#b9c98b}
.insurance-reading-panel__header > p{
  position:relative;
  z-index:1;
  max-width:720px;
  margin:22px 0 0;
  color:#afb7aa;
  font-size:clamp(.82rem,1.25vw,1rem);
  line-height:1.68;
}
.insurance-reading-panel__body{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1px;
  background:rgba(225,230,219,.075);
}
.insurance-reading-section{
  position:relative;
  min-width:0;
  padding:clamp(25px,3.5vw,46px) clamp(23px,4vw,52px);
  background:linear-gradient(145deg,rgba(12,16,12,.985),rgba(6,9,7,.985));
}
.insurance-reading-section--wide{grid-column:1/-1}
.insurance-reading-section__number{
  color:#7694c5;
  font:700 9px/1 "JetBrains Mono",monospace;
  letter-spacing:.16em;
}
.insurance-reading-section h3{
  margin:10px 0 0;
  color:#edf0e8;
  font:600 clamp(1.2rem,2vw,1.7rem)/1.08 "Bricolage Grotesque",sans-serif;
  letter-spacing:-.025em;
}
.insurance-reading-section p{
  margin:14px 0 0;
  color:#aeb5aa;
  font-size:.78rem;
  line-height:1.72;
}
.insurance-reading-section__lead{
  color:#d8c984!important;
  font:600 1rem/1.4 "Bricolage Grotesque",sans-serif!important;
}
.insurance-reading-section ul{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:9px 18px;
  margin:18px 0 0;
  padding:0;
  list-style:none;
}
.insurance-reading-section li{
  position:relative;
  padding-left:15px;
  color:#cbd0c6;
  font-size:.72rem;
  line-height:1.45;
}
.insurance-reading-section li::before{
  content:"";
  position:absolute;
  top:.52em;
  left:0;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#9eafd0;
  box-shadow:0 0 10px rgba(118,148,197,.45);
}
.insurance-reading-tags{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}
.insurance-reading-tags span{
  padding:7px 10px;
  border:1px solid rgba(158,175,208,.16);
  border-radius:999px;
  color:#c9d1c4;
  background:rgba(118,148,197,.055);
  font-size:.64rem;
}
.insurance-reading-panel__closing{
  padding:clamp(28px,4vw,48px) clamp(24px,5vw,68px);
  background:
    linear-gradient(120deg,rgba(118,148,197,.1),transparent 48%),
    rgba(5,8,6,.98);
}
.insurance-reading-panel__closing p{
  max-width:820px;
  margin:14px 0 0;
  color:#eff1e9;
  font:500 clamp(1.2rem,2.5vw,2rem)/1.25 "Bricolage Grotesque",sans-serif;
  letter-spacing:-.025em;
}
@media(max-width:760px){
  .insurance-reading-overlay{padding:8px}
  .insurance-reading-panel{max-height:calc(100svh - 16px);border-radius:20px}
  .insurance-reading-panel__body{grid-template-columns:1fr}
  .insurance-reading-section--wide{grid-column:auto}
  .insurance-reading-section ul{grid-template-columns:1fr}
  .insurance-reading-panel__header h2 br{display:none}
}
@media(prefers-reduced-motion:reduce){
  .insurance-reading-overlay,
  .insurance-reading-panel{transition:none!important}
}
/* ============================================================
   LONG-FORM READING OVERLAY — END
============================================================ */

/* ============================================================
   OVERLAY-ONLY DETAIL FLOW — v88
   Long-form details now live exclusively in the reading overlay.
   Reclaim the previously reserved dock band so the tree fills the hero.
============================================================ */
.page-home .hero-full-stage-wrap{
  --tree-dock-space:0px;
  display:block;
}
.page-home .photo-tree-stage--full{
  grid-row:auto;
  height:100%;
}
.page-home .tree-coordinate-plane{
  transform:none;
}
.page-home .tree-tooltip-expand,
.page-home .tree-expanded-dock-shell{
  display:none!important;
}
@media(min-width:901px){
  .page-home .tree-layer-nav{
    top:0;
    bottom:0;
  }
}
@media(max-width:900px){
  .page-home .hero-full-stage-wrap{
    --tree-canvas-left:0px;
    height:auto;
    display:block;
  }
  .page-home .photo-tree-hero--fullbleed{
    height:auto!important;
    min-height:0;
  }
}
/* ============================================================
   OVERLAY-ONLY DETAIL FLOW — END
============================================================ */

/* ============================================================
   LIVING EMERALD TREE GRADE — v97
   A static, non-destructive botanical color grade enriches the
   approved tree artwork without changing its geometry or node map.
============================================================ */
.page-home .tree-extended-artwork{
  isolation:isolate;
}
.page-home .tree-extended-artwork img{
  position:relative;
  z-index:0;
  filter:saturate(1.18) contrast(1.045) brightness(1.035) hue-rotate(4deg);
}
.page-home .tree-extended-artwork::before,
.page-home .tree-extended-artwork::after{
  content:"";
  position:absolute;
  z-index:1;
  inset:0;
  pointer-events:none;
  animation:none!important;
  transition:none!important;
}
.page-home .tree-extended-artwork::before{
  background:
    radial-gradient(ellipse 66% 55% at 52% 27%,rgba(68,125,55,.48) 0%,rgba(77,132,58,.31) 35%,rgba(96,139,67,.14) 58%,transparent 78%),
    radial-gradient(ellipse 30% 35% at 25% 38%,rgba(83,142,65,.25),transparent 72%),
    radial-gradient(ellipse 31% 36% at 79% 38%,rgba(91,146,69,.27),transparent 72%);
  mix-blend-mode:color;
  opacity:.94;
}
.page-home .tree-extended-artwork::after{
  background:
    radial-gradient(ellipse 54% 34% at 52% 19%,rgba(169,200,103,.13),transparent 70%),
    radial-gradient(ellipse 31% 42% at 22% 42%,rgba(132,174,82,.095),transparent 73%),
    radial-gradient(ellipse 31% 43% at 81% 42%,rgba(146,185,88,.11),transparent 74%),
    radial-gradient(ellipse 32% 24% at 52% 59%,rgba(213,177,95,.08),transparent 72%);
  mix-blend-mode:screen;
  opacity:.78;
}
@media(min-width:901px){
  .page-home .photo-tree-stage--full::after{
    background:
      radial-gradient(ellipse 34% 72% at 7% 48%,rgba(192,211,127,.15) 0%,rgba(132,164,92,.085) 36%,rgba(86,125,72,.032) 59%,transparent 78%),
      radial-gradient(ellipse 46% 98% at 101% 50%,rgba(207,218,139,.24) 0%,rgba(145,173,100,.14) 32%,rgba(94,134,78,.065) 56%,transparent 78%),
      radial-gradient(ellipse 58% 54% at 55% 28%,rgba(111,156,76,.07),transparent 73%);
    opacity:.9;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork::before{
    background:
      radial-gradient(ellipse 82% 54% at 50% 28%,rgba(68,125,55,.42) 0%,rgba(79,133,59,.27) 39%,rgba(95,139,66,.11) 60%,transparent 80%);
  }
  .page-home .tree-extended-artwork::after{
    background:
      radial-gradient(ellipse 72% 33% at 50% 19%,rgba(169,200,103,.11),transparent 72%),
      radial-gradient(ellipse 46% 23% at 50% 60%,rgba(213,177,95,.07),transparent 74%);
  }
}
@media(prefers-reduced-transparency:reduce){
  .page-home .tree-extended-artwork::before{opacity:.72}
  .page-home .tree-extended-artwork::after{opacity:.5}
}
/* ============================================================
   LIVING EMERALD TREE GRADE — END
============================================================ */

/* ============================================================
   LARGER, TIGHTER TREE COMPOSITION — v98
   Scale the artwork, paths, and nodes from one shared visual origin
   while centering the side navigation independently in the hero.
============================================================ */
.page-home .tree-extended-artwork img{
  transform:scale(1.08);
  transform-origin:52% 48%;
}
.page-home .tree-coordinate-plane .ecosystem-overlay{
  transform:translateX(-7%) scale(1.08);
  transform-origin:52% 48%;
}
@media(min-width:901px){
  .page-home .tree-layer-nav{
    top:50%!important;
    bottom:auto!important;
    margin-block:0!important;
    transform:translateY(-50%);
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    transform:scale(1.055);
    transform-origin:50% 46%;
  }
  .page-home .tree-coordinate-plane .ecosystem-overlay{
    transform:translateX(-3.5%) scale(1.055);
    transform-origin:50% 46%;
  }
}
/* ============================================================
   LARGER, TIGHTER TREE COMPOSITION — END
============================================================ */

/* ============================================================
   LOWERED TREE / TRUNK ALIGNMENT — v99
   Move only the overscanned artwork lower beneath the approved
   node map, reducing the root field while aligning the trunk node.
============================================================ */
.page-home .tree-extended-artwork img{
  transform:translateY(3.25%) scale(1.08);
}
.page-home .tree-extended-artwork::before,
.page-home .tree-extended-artwork::after{
  transform:translateY(3.25%);
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    transform:translateY(2%) scale(1.055);
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    transform:translateY(2%);
  }
}
/* ============================================================
   LOWERED TREE / TRUNK ALIGNMENT — END
============================================================ */

/* ============================================================
   TIGHTER ROOT CROP — v100
   Increase the shared tree composition scale and use its overscan
   to remove more of the lower root field without exposing an edge.
============================================================ */
.page-home .tree-extended-artwork img{
  transform:translateY(4%) scale(1.14);
}
.page-home .tree-extended-artwork::before,
.page-home .tree-extended-artwork::after{
  transform:translateY(4%);
}
.page-home .tree-coordinate-plane .ecosystem-overlay{
  transform:translateX(-7%) scale(1.1,1.14);
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    transform:translateY(3.1%) scale(1.08);
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    transform:translateY(3.1%);
  }
  .page-home .tree-coordinate-plane .ecosystem-overlay{
    transform:translateX(-3.5%) scale(1.06,1.08);
  }
}
/* ============================================================
   TIGHTER ROOT CROP — END
============================================================ */

/* ============================================================
   BALANCED LEFT-CORNER LIGHT — v101
   Soft static illumination lifts the upper-left and lower-left
   edges of the tree canvas without flattening the central contrast.
============================================================ */
.page-home .tree-extended-artwork::after{
  background:
    radial-gradient(ellipse 48% 46% at 2% 2%,rgba(211,222,154,.19) 0%,rgba(154,182,105,.105) 35%,rgba(95,134,77,.035) 58%,transparent 76%),
    radial-gradient(ellipse 52% 48% at 2% 98%,rgba(198,209,139,.17) 0%,rgba(148,171,99,.09) 36%,rgba(92,126,73,.03) 60%,transparent 78%),
    radial-gradient(ellipse 54% 34% at 52% 19%,rgba(169,200,103,.13),transparent 70%),
    radial-gradient(ellipse 31% 42% at 22% 42%,rgba(132,174,82,.095),transparent 73%),
    radial-gradient(ellipse 31% 43% at 81% 42%,rgba(146,185,88,.11),transparent 74%),
    radial-gradient(ellipse 32% 24% at 52% 59%,rgba(213,177,95,.08),transparent 72%);
  opacity:.86;
}
@media(max-width:900px){
  .page-home .tree-extended-artwork::after{
    background:
      radial-gradient(ellipse 62% 42% at 0 3%,rgba(205,217,148,.14),rgba(139,168,96,.07) 40%,transparent 76%),
      radial-gradient(ellipse 64% 44% at 0 97%,rgba(193,204,135,.12),rgba(135,158,91,.06) 40%,transparent 78%),
      radial-gradient(ellipse 72% 33% at 50% 19%,rgba(169,200,103,.11),transparent 72%),
      radial-gradient(ellipse 46% 23% at 50% 60%,rgba(213,177,95,.07),transparent 74%);
    opacity:.76;
  }
}
/* ============================================================
   BALANCED LEFT-CORNER LIGHT — END
============================================================ */

/* ============================================================
   TRANSPARENT NAV / CONTINUOUS TREE FIELD — v102
   Extend the hero's tree atmosphere beneath the left navigation
   while preserving the approved tree image box and coordinates.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork{
    left:0;
    background:
      radial-gradient(ellipse 145% 64% at 100% 4%,rgba(199,215,137,.13) 0%,rgba(126,158,91,.065) 42%,transparent 72%) left top / var(--tree-canvas-left) 52% no-repeat,
      radial-gradient(ellipse 155% 68% at 100% 98%,rgba(188,201,128,.115) 0%,rgba(119,146,87,.055) 44%,transparent 74%) left bottom / var(--tree-canvas-left) 54% no-repeat,
      linear-gradient(90deg,#030504 0%,#061008 70%,rgba(7,12,8,.94) 100%) left top / var(--tree-canvas-left) 100% no-repeat;
  }
  .page-home .tree-extended-artwork img{
    position:absolute;
    top:0;
    right:0;
    left:var(--tree-canvas-left);
    width:calc(100% - var(--tree-canvas-left));
    height:100%;
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    left:var(--tree-canvas-left);
    right:0;
  }
  .page-home .tree-layer-nav{
    border-color:transparent;
    background:transparent;
    -webkit-backdrop-filter:none;
    backdrop-filter:none;
    box-shadow:none;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork{
    left:0;
    background:none;
  }
  .page-home .tree-extended-artwork img{
    position:relative;
    inset:auto;
    width:100%;
    height:100%;
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    left:0;
    right:0;
  }
}
/* ============================================================
   TRANSPARENT NAV / CONTINUOUS TREE FIELD — END
============================================================ */

/* ============================================================
   SIDE NAVIGATION DIRECTLY OVER TREE ARTWORK — v103
   Replace the synthetic left-side atmosphere with a softly blended
   continuation of the real tree image. The approved main image box,
   tree scale, pathways, and node coordinates remain unchanged.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork{
    background:none;
  }
  .page-home .tree-artwork-left-extension{
    position:absolute;
    z-index:0;
    inset:0 auto 0 0;
    display:block;
    width:calc(var(--tree-canvas-left) + 120px);
    pointer-events:none;
    background:none;
    filter:saturate(1.18) contrast(1.045) brightness(1.035) hue-rotate(4deg);
    opacity:.96;
    -webkit-mask-image:linear-gradient(90deg,#000 0%,#000 72%,rgba(0,0,0,.72) 84%,transparent 100%);
    mask-image:linear-gradient(90deg,#000 0%,#000 72%,rgba(0,0,0,.72) 84%,transparent 100%);
  }
  .page-home .tree-layer-nav{
    z-index:20;
    border:0!important;
    background:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
  }
}
@media(max-width:900px){
  .page-home .tree-artwork-left-extension{
    display:none;
  }
}
/* ============================================================
   SIDE NAVIGATION DIRECTLY OVER TREE ARTWORK — END
============================================================ */

/* ============================================================
   SINGLE FULL-HERO TREE BACKGROUND — v104
   Use one continuous tree image across the complete hero. A modest
   focal-point compensation keeps the trunk aligned with the approved
   node map while removing the former left-side stitch entirely.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork{
    left:0;
    background:#030403;
    -webkit-mask-image:none;
    mask-image:none;
  }
  .page-home .tree-extended-artwork img{
    position:absolute;
    inset:0;
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:52% 48%;
    transform:translateX(clamp(96px,8vw,124px)) translateY(4%) scale(1.14);
    transform-origin:52% 48%;
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    left:0;
    right:0;
  }
  .page-home .tree-artwork-left-extension{
    display:none!important;
  }
  .page-home .tree-layer-nav{
    z-index:20;
    border:0!important;
    background:none!important;
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important;
    box-shadow:none!important;
  }
}
/* ============================================================
   SINGLE FULL-HERO TREE BACKGROUND — END
============================================================ */

/* ============================================================
   SMALLER LIVING-GREEN TREE ARTWORK — v106
   The purpose-built wide artwork carries its own left-side negative
   space and trunk alignment, so it fills the hero without enlargement.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork img{
    object-position:50% 50%;
    transform:none;
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    transform:none;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    object-position:60% 50%;
    transform:translateY(1.5%) scale(1.02);
  }
  .page-home .tree-extended-artwork::before,
  .page-home .tree-extended-artwork::after{
    transform:none;
  }
}
/* ============================================================
   SMALLER LIVING-GREEN TREE ARTWORK — END
============================================================ */

/* ============================================================
   v98 TREE / COMPLETE HERO CANVAS — v111
   Restore the dramatic v98 artwork and color treatment while
   extending one continuous image behind the complete hero and nav.
============================================================ */
.page-home .tree-extended-artwork{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  background:#030403;
  -webkit-mask-image:none;
  mask-image:none;
}
.page-home .tree-extended-artwork img{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:50% 50%;
  transform:none;
}
.page-home .tree-extended-artwork::before,
.page-home .tree-extended-artwork::after{
  inset:0;
  transform:none;
}
.page-home .tree-extended-artwork::before{
  background:
    radial-gradient(ellipse 66% 55% at 52% 27%,rgba(68,125,55,.48) 0%,rgba(77,132,58,.31) 35%,rgba(96,139,67,.14) 58%,transparent 78%),
    radial-gradient(ellipse 30% 35% at 25% 38%,rgba(83,142,65,.25),transparent 72%),
    radial-gradient(ellipse 31% 36% at 79% 38%,rgba(91,146,69,.27),transparent 72%);
  mix-blend-mode:color;
  opacity:.94;
}
.page-home .tree-extended-artwork::after{
  background:
    radial-gradient(ellipse 54% 34% at 52% 19%,rgba(169,200,103,.13),transparent 70%),
    radial-gradient(ellipse 31% 42% at 22% 42%,rgba(132,174,82,.095),transparent 73%),
    radial-gradient(ellipse 31% 43% at 81% 42%,rgba(146,185,88,.11),transparent 74%),
    radial-gradient(ellipse 32% 24% at 52% 59%,rgba(213,177,95,.08),transparent 72%);
  mix-blend-mode:screen;
  opacity:.78;
}
.page-home .tree-artwork-left-extension{
  display:none!important;
}
.page-home .tree-layer-nav{
  z-index:20;
  border:0!important;
  background:none!important;
  -webkit-backdrop-filter:none!important;
  backdrop-filter:none!important;
  box-shadow:none!important;
}
@media(min-width:901px){
  .page-home .photo-tree-stage--full::after{
    background:
      radial-gradient(ellipse 34% 72% at 7% 48%,rgba(192,211,127,.15) 0%,rgba(132,164,92,.085) 36%,rgba(86,125,72,.032) 59%,transparent 78%),
      radial-gradient(ellipse 46% 98% at 101% 50%,rgba(207,218,139,.24) 0%,rgba(145,173,100,.14) 32%,rgba(94,134,78,.065) 56%,transparent 78%),
      radial-gradient(ellipse 58% 54% at 55% 28%,rgba(111,156,76,.07),transparent 73%);
    opacity:.9;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    object-position:52% 50%;
    transform:none;
  }
}
/* ============================================================
   v98 TREE / COMPLETE HERO CANVAS — END
============================================================ */

/* ============================================================
   TRUNK-ALIGNED FULL-HERO ARTWORK — v112
   Reposition only the background artwork so the visual trunk sits
   directly beneath the fixed FillR Ecosystem node without seams.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork img{
    object-position:50% 50%;
    transform:translateX(clamp(118px,10.5vw,168px)) translateY(3.25%) scale(1.2);
    transform-origin:50% 50%;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    object-position:50% 50%;
    transform:translateX(4%) translateY(1.5%) scale(1.09);
    transform-origin:50% 50%;
  }
}
/* ============================================================
   TRUNK-ALIGNED FULL-HERO ARTWORK — END
============================================================ */

/* ============================================================
   SHARP PULLED-BACK TREE ARTWORK — v113
   The new high-detail composition carries its own trunk alignment
   and negative space, so no enlargement or positional stretch is needed.
============================================================ */
.page-home .tree-extended-artwork img{
  object-position:50% 50%;
  transform:none;
  transform-origin:50% 50%;
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    object-position:50% 50%;
    transform:none;
  }
}
/* ============================================================
   SHARP PULLED-BACK TREE ARTWORK — END
============================================================ */

/* ============================================================
   STATIC NODE LIGHTING — v114
   Resting nodes keep a premium static glow. Motion begins only
   while a node is hovered, keyboard-focused, or actively selected.
============================================================ */
.page-home .tree-node-v2 .node-halo,
.page-home .tree-node-v2 .node-core{
  animation:none!important;
}
.page-home .tree-node-v2 .node-halo{
  transform:scale(1);
  transition:transform .3s var(--ease),box-shadow .3s var(--ease),border-color .3s var(--ease),opacity .3s var(--ease);
}
.page-home .tree-node-v2:hover .node-halo,
.page-home .tree-node-v2:focus-visible .node-halo,
.page-home .tree-node-v2.hover-active .node-halo,
.page-home .tree-node-v2[aria-pressed="true"] .node-halo{
  animation:nodeOrbit 3.2s ease-in-out infinite!important;
}
@media(prefers-reduced-motion:reduce){
  .page-home .tree-node-v2:hover .node-halo,
  .page-home .tree-node-v2:focus-visible .node-halo,
  .page-home .tree-node-v2.hover-active .node-halo,
  .page-home .tree-node-v2[aria-pressed="true"] .node-halo{
    animation:none!important;
  }
}
/* ============================================================
   STATIC NODE LIGHTING — END
============================================================ */

/* ============================================================
   LARGER TREE SIDE NAVIGATION — v117
   Increase desktop hierarchy, reading size, and menu touch targets
   while retaining the approved centered placement over the tree.
============================================================ */
@media(min-width:901px){
  .page-home .tree-layer-nav{
    left:clamp(24px,2.8vw,46px);
    top:50%;
    width:clamp(300px,23vw,350px);
    padding:clamp(20px,1.7vw,25px);
    transform:translateY(-50%);
  }
  .page-home .tree-layer-eyebrow{
    font-size:10.5px;
    line-height:1.25;
    letter-spacing:.18em;
  }
  .page-home .tree-layer-heading{
    max-width:300px;
    margin-top:12px;
    font-size:1.1rem;
    line-height:1.4;
  }
  .page-home .tree-layer-menu{
    gap:8px;
    margin-top:20px;
  }
  .page-home .tree-layer-button{
    grid-template-columns:34px 1fr;
    gap:12px;
    min-height:62px;
    padding:10px 14px;
    border-radius:16px;
  }
  .page-home .tree-layer-index{
    width:34px;
    height:34px;
    font-size:9px;
  }
  .page-home .tree-layer-button b{
    font-size:.88rem;
    line-height:1.2;
  }
  .page-home .tree-layer-button small{
    margin-top:4px;
    font-size:.71rem;
    line-height:1.2;
  }
}
/* ============================================================
   LARGER TREE SIDE NAVIGATION — END
============================================================ */

/* ============================================================
   ATTACHED NATURAL TREE — POSITIONING EXPERIMENT
   Pull the supplied full-frame photograph back within the hero while
   retaining the approved node coordinate system and full-width canvas.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork img{
    object-position:50% 50%;
    transform:translateX(-1%) translateY(-1.5%) scale(.86);
    transform-origin:50% 50%;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    object-position:52% 50%;
    transform:translateX(1.5%) translateY(-1%) scale(.92);
    transform-origin:50% 50%;
  }
}
/* ============================================================
   ATTACHED NATURAL TREE — END
============================================================ */

/* ============================================================
   FULL-HEIGHT NATURAL TREE + ROOT LANDMARK ALIGNMENT
   Show the complete photograph at its natural aspect ratio and hero height.
   Its optical trunk center is aligned to the existing node coordinate plane,
   while the ambient hero background extends seamlessly beyond the image.
============================================================ */
.page-home .tree-extended-artwork img{
  top:0;
  right:auto;
  bottom:auto;
  left:calc(50% + clamp(155px,11.5vw,185px));
  width:auto;
  height:100%;
  max-width:none;
  aspect-ratio:1672/941;
  object-fit:contain;
  object-position:50% 50%;
  transform:translateX(-62.6%);
  transform-origin:50% 50%;
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    left:50%;
    object-fit:contain;
    object-position:50% 50%;
    transform:translateX(-62.6%);
  }
}
/* ============================================================
   FULL-HEIGHT NATURAL TREE + ROOT LANDMARK ALIGNMENT — END
============================================================ */

/* ============================================================
   v135 NODE MAP / TREE POSITION ONLY — v136
   Preserve the approved v135 node and connector coordinates. Move only
   the full-height tree photograph so its trunk and roots sit beneath them.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork img{
    transform:translateX(-50.8%);
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    transform:translateX(-49.6%);
  }
}
/* ============================================================
   v135 NODE MAP / TREE POSITION ONLY — END
============================================================ */

/* ============================================================
   LARGER TOP-ANCHORED TREE — v139
   Enlarge only the tree artwork from its top edge. The canopy remains
   visible, the trunk stays beneath the fixed Trunk node, and any crop is
   taken from the lowest root area. All node coordinates remain unchanged.
============================================================ */
@media(min-width:901px){
  .page-home .tree-extended-artwork img{
    transform:translateX(-50.8%) scale(1.15);
    transform-origin:50% 0;
  }
}
@media(max-width:900px){
  .page-home .tree-extended-artwork img{
    transform:translateX(-49.6%) scale(1.1);
    transform-origin:50% 0;
  }
}
/* ============================================================
   LARGER TOP-ANCHORED TREE — END
============================================================ */

/* ============================================================
   STRICT LAYER ISOLATION — v143
   Only the nodes and connector paths belonging to the selected tree layer
   remain visible or interactive. This lets each layer use the full tree
   composition independently without exposing overlapping node groups.
============================================================ */
.page-home .photo-tree-stage--full .tree-node-v2.layer-hidden,
.page-home .photo-tree-stage--full .tree-node-v2[hidden]{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
.page-home .photo-tree-stage--full .ecosystem-path.layer-hidden,
.page-home .photo-tree-stage--full .network-base path.layer-hidden{
  display:none!important;
  visibility:hidden!important;
  opacity:0!important;
  pointer-events:none!important;
}
/* ============================================================
   STRICT LAYER ISOLATION — END
============================================================ */

/* ============================================================
   SECONDARY BRANCH PARENT CONTEXT — v144
   Primary Branch nodes remain visible as quiet, non-interactive anchors when
   Secondary Branches is selected. Their paths complete the visual hierarchy
   without switching away from the Secondary Branch view.
============================================================ */
.page-home .photo-tree-stage--full .tree-node-v2.parent-context{
  pointer-events:none;
  cursor:default;
}
.page-home .photo-tree-stage--full .ecosystem-path.parent-context{
  opacity:.68;
  stroke-width:2.7;
  animation:pathTravel 2.6s linear infinite;
}
/* ============================================================
   SECONDARY BRANCH PARENT CONTEXT — END
============================================================ */

/* ============================================================
   CENTERED TREE + FIXED DETAIL RAIL — v145
   A slimmer, taller navigation rail opens the center of the hero for the
   tree and its coordinated node map. Desktop hover cards now occupy one
   stable editorial position at the right edge instead of chasing nodes.
============================================================ */
@media(min-width:901px){
  .page-home .photo-tree-stage--full{
    --tree-map-gutter:clamp(180px,13vw,240px);
  }

  .page-home .tree-layer-nav{
    left:clamp(18px,2vw,32px);
    top:clamp(18px,2.6vh,30px);
    bottom:clamp(18px,2.6vh,30px);
    width:clamp(216px,16.5vw,248px);
    height:auto;
    padding:clamp(17px,1.45vw,22px);
    transform:none;
    display:flex;
    flex-direction:column;
  }
  .page-home .tree-layer-eyebrow{
    font-size:9.5px;
    line-height:1.35;
  }
  .page-home .tree-layer-heading{
    max-width:210px;
    margin-top:11px;
    font-size:clamp(.9rem,1.05vw,1rem);
    line-height:1.42;
  }
  .page-home .tree-layer-menu{
    flex:1 1 auto;
    min-height:0;
    display:grid;
    grid-template-rows:repeat(5,minmax(52px,1fr));
    gap:clamp(7px,1vh,10px);
    margin-top:clamp(16px,2.4vh,24px);
  }
  .page-home .tree-layer-button{
    min-height:0;
    height:100%;
    grid-template-columns:31px 1fr;
    gap:10px;
    padding:8px 11px;
    border-radius:14px;
  }
  .page-home .tree-layer-index{
    width:31px;
    height:31px;
  }
  .page-home .tree-layer-button b{font-size:.78rem}
  .page-home .tree-layer-button small{font-size:.64rem}

  .page-home .tree-extended-artwork img{
    left:50%;
    right:auto;
    transform:translateX(-50%) scale(1.15);
    transform-origin:50% 0;
  }
  .page-home .tree-coordinate-plane{
    left:var(--tree-map-gutter)!important;
    right:var(--tree-map-gutter);
    transform:translateY(-4.5%);
  }

  .page-home .tree-coordinate-plane .tree-node-tooltip{
    width:clamp(320px,27vw,400px);
    min-height:clamp(220px,34vh,290px);
    max-height:calc(100% - 40px);
    padding:clamp(20px,2vw,28px);
    display:flex;
    flex-direction:column;
    justify-content:center;
    border-color:rgba(239,214,135,.26);
    background:
      linear-gradient(145deg,rgba(17,21,14,.975),rgba(5,7,5,.965)),
      radial-gradient(circle at 0 0,rgba(182,204,107,.09),transparent 48%);
    box-shadow:0 38px 90px -42px #000,inset 0 1px rgba(255,255,255,.055),0 0 0 1px rgba(213,177,95,.035);
  }
  .page-home .tree-node-modal.has-rich-content{
    width:clamp(340px,28vw,400px);
    min-height:min(470px,calc(100% - 44px));
    padding:clamp(24px,2.15vw,30px);
    justify-content:flex-start;
  }
  .page-home .tree-node-modal.has-rich-content > p{
    font-size:.76rem;
    line-height:1.62;
  }
  .page-home .tree-node-modal__highlights{
    margin-top:17px;
    padding-top:15px;
  }
  .page-home .photo-tree-panel .tree-node-modal__cta{
    align-self:flex-start;
    margin-top:auto;
  }
}

@media(min-width:901px) and (max-height:700px){
  .page-home .tree-layer-nav{
    top:14px;
    bottom:14px;
    padding:15px;
  }
  .page-home .tree-layer-eyebrow{font-size:8.5px}
  .page-home .tree-layer-heading{
    margin-top:8px;
    font-size:.84rem;
    line-height:1.34;
  }
  .page-home .tree-layer-menu{
    gap:6px;
    margin-top:12px;
  }
  .page-home .tree-layer-button{padding-block:6px}
  .page-home .tree-coordinate-plane .tree-node-tooltip{
    min-height:200px;
    padding:20px 22px;
  }
  .page-home .tree-node-modal.has-rich-content{
    min-height:min(410px,calc(100% - 32px));
    padding:21px 23px;
  }
}
/* ============================================================
   CENTERED TREE + FIXED DETAIL RAIL — END
============================================================ */

/* ============================================================
   VERTICALLY CENTERED SIDE RAILS — v146
   Keep both the layer navigation and fixed hover-card rail aligned to the
   hero's true vertical midpoint while retaining their expanded proportions.
============================================================ */
@media(min-width:901px){
  .page-home .tree-layer-nav{
    top:50%;
    bottom:auto;
    height:calc(100% - clamp(36px,5.2vh,60px));
    max-height:calc(100% - 28px);
    transform:translateY(-50%);
  }
}
@media(min-width:901px) and (max-height:700px){
  .page-home .tree-layer-nav{
    top:50%;
    bottom:auto;
    height:calc(100% - 28px);
    transform:translateY(-50%);
  }
}
/* ============================================================
   VERTICALLY CENTERED SIDE RAILS — END
============================================================ */

/* ============================================================
   COMPACT NAV + SLIM EDITORIAL CARDS — v147
   Reduce the navigation rail's vertical footprint while keeping it centered.
   Narrower detail cards gain height and more generous supporting type.
============================================================ */
@media(min-width:901px){
  .page-home .tree-layer-nav{
    top:50%;
    bottom:auto;
    height:min(calc(100% - 56px),520px);
    max-height:calc(100% - 28px);
    padding:17px;
    transform:translateY(-50%);
  }
  .page-home .tree-layer-heading{
    margin-top:9px;
    font-size:.88rem;
    line-height:1.38;
  }
  .page-home .tree-layer-menu{
    grid-template-rows:repeat(5,minmax(46px,1fr));
    gap:6px;
    margin-top:13px;
  }
  .page-home .tree-layer-button{
    padding:7px 10px;
  }

  .page-home .tree-coordinate-plane .tree-node-tooltip{
    width:clamp(260px,19.5vw,290px);
    min-height:clamp(260px,42vh,350px);
    padding:clamp(22px,1.8vw,27px);
  }
  .page-home .tree-node-modal.has-rich-content{
    width:clamp(280px,20.5vw,315px);
    min-height:min(520px,calc(100% - 40px));
    padding:clamp(25px,2vw,29px);
  }
  .page-home .tree-node-tooltip .panel-index{
    font-size:9px;
    letter-spacing:.14em;
  }
  .page-home .tree-node-tooltip > strong{
    margin-top:10px;
    font-size:1.08rem;
    line-height:1.25;
  }
  .page-home .tree-node-tooltip > p{
    margin-top:10px;
    font-size:.78rem;
    line-height:1.62;
  }
  .page-home .tree-node-modal__tagline{
    margin-top:8px;
    font-size:.78rem;
    line-height:1.48;
  }
  .page-home .tree-node-modal.has-rich-content > p{
    margin-top:14px;
    font-size:.82rem;
    line-height:1.66;
  }
  .page-home .tree-node-modal__highlights > span{
    font-size:9px;
  }
  .page-home .tree-node-modal__highlights ul{
    grid-template-columns:1fr;
    gap:7px;
    margin-top:11px;
  }
  .page-home .tree-node-modal__highlights li{
    font-size:.72rem;
    line-height:1.42;
  }
  .page-home .photo-tree-panel .tree-node-modal__cta{
    min-height:41px;
    font-size:.74rem;
  }
}

@media(min-width:901px) and (max-height:700px){
  .page-home .tree-layer-nav{
    height:min(calc(100% - 28px),490px);
    padding:14px;
  }
  .page-home .tree-layer-heading{
    font-size:.8rem;
    line-height:1.32;
  }
  .page-home .tree-layer-menu{
    margin-top:10px;
    gap:5px;
  }
  .page-home .tree-node-modal.has-rich-content{
    min-height:min(470px,calc(100% - 28px));
    padding:21px 23px;
  }
  .page-home .tree-node-modal.has-rich-content > p{
    font-size:.76rem;
    line-height:1.55;
  }
}
/* ============================================================
   COMPACT NAV + SLIM EDITORIAL CARDS — END
============================================================ */
