/* intake pill, bar and panel rules apply on every page with data-chat-mode="start" (two attribute selectors keep the old body.blend.pg-index weight) */
/* Blend hero: splash look on top, melting into the cream page below */
.blend{--b-ink:#0f0e0d;--b-ivory:#f4f0e8;--b-soft:#c9c2b6;--b-mute:#9a9388;--b-acc:#9c6b1e;--b-acc2:#c9a24b;--b-acc3:#e2c27a;--b-line:rgba(244,240,232,.06);--band:clamp(250px,20vw,300px);--peek:120px;--mx:72%;--my:38%}
/* intro overlay matches the dark hero */
.blend .iov{background:var(--b-ink)}
.blend .iov.go{background-color:rgba(15,14,13,0)}
.blend .iov .logo{color:var(--b-ivory)!important}
/* hero frame: dark area fills the screen, then a long fade band */
.blend .hero{position:relative;min-height:calc(100svh + var(--band) - var(--peek));padding-bottom:calc(var(--band) - var(--peek) + 44px);color:var(--b-ivory)}
.blend .hero-bg{position:absolute;inset:0;z-index:0;pointer-events:none;background:linear-gradient(to bottom,#0f0e0d 0,#0f0e0d calc(100% - var(--band)),rgb(16,15,14) calc(100% - var(--band) * 0.9792),rgb(19,17,15) calc(100% - var(--band) * 0.9583),rgb(22,20,17) calc(100% - var(--band) * 0.9375),rgb(26,23,20) calc(100% - var(--band) * 0.9167),rgb(31,26,23) calc(100% - var(--band) * 0.8958),rgb(35,30,25) calc(100% - var(--band) * 0.8750),rgb(41,34,29) calc(100% - var(--band) * 0.8542),rgb(46,39,32) calc(100% - var(--band) * 0.8333),rgb(52,44,36) calc(100% - var(--band) * 0.8125),rgb(58,49,40) calc(100% - var(--band) * 0.7917),rgb(64,54,44) calc(100% - var(--band) * 0.7708),rgb(71,60,49) calc(100% - var(--band) * 0.7500),rgb(78,66,53) calc(100% - var(--band) * 0.7292),rgb(84,72,58) calc(100% - var(--band) * 0.7083),rgb(91,78,63) calc(100% - var(--band) * 0.6875),rgb(98,84,68) calc(100% - var(--band) * 0.6667),rgb(106,91,73) calc(100% - var(--band) * 0.6458),rgb(113,97,77) calc(100% - var(--band) * 0.6250),rgb(121,104,81) calc(100% - var(--band) * 0.6042),rgb(130,110,85) calc(100% - var(--band) * 0.5833),rgb(138,116,87) calc(100% - var(--band) * 0.5625),rgb(147,123,89) calc(100% - var(--band) * 0.5417),rgb(156,129,91) calc(100% - var(--band) * 0.5208),rgb(165,135,92) calc(100% - var(--band) * 0.5000),rgb(174,142,93) calc(100% - var(--band) * 0.4792),rgb(182,148,96) calc(100% - var(--band) * 0.4583),rgb(189,155,100) calc(100% - var(--band) * 0.4375),rgb(195,161,105) calc(100% - var(--band) * 0.4167),rgb(201,168,112) calc(100% - var(--band) * 0.3958),rgb(206,175,121) calc(100% - var(--band) * 0.3750),rgb(210,181,131) calc(100% - var(--band) * 0.3542),rgb(214,188,141) calc(100% - var(--band) * 0.3333),rgb(217,194,152) calc(100% - var(--band) * 0.3125),rgb(220,200,163) calc(100% - var(--band) * 0.2917),rgb(223,206,173) calc(100% - var(--band) * 0.2708),rgb(226,211,182) calc(100% - var(--band) * 0.2500),rgb(229,216,190) calc(100% - var(--band) * 0.2292),rgb(232,221,198) calc(100% - var(--band) * 0.2083),rgb(234,225,205) calc(100% - var(--band) * 0.1875),rgb(237,229,211) calc(100% - var(--band) * 0.1667),rgb(239,232,216) calc(100% - var(--band) * 0.1458),rgb(242,235,221) calc(100% - var(--band) * 0.1250),rgb(244,238,225) calc(100% - var(--band) * 0.1042),rgb(245,240,228) calc(100% - var(--band) * 0.0833),rgb(247,242,231) calc(100% - var(--band) * 0.0625),rgb(248,243,232) calc(100% - var(--band) * 0.0417),rgb(248,244,234) calc(100% - var(--band) * 0.0208),#f8f4eb 100%)}
.blend .hero-glow,.blend .hero-lines,.blend .hero-noise{position:absolute;inset:0}
.blend .hero-glow{-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--band) * 1.15),rgba(0,0,0,0.9949) calc(100% - var(--band) * 1.1125),rgba(0,0,0,0.9803) calc(100% - var(--band) * 1.0750),rgba(0,0,0,0.9570) calc(100% - var(--band) * 1.0375),rgba(0,0,0,0.9259) calc(100% - var(--band) * 1.0000),rgba(0,0,0,0.8879) calc(100% - var(--band) * 0.9625),rgba(0,0,0,0.8438) calc(100% - var(--band) * 0.9250),rgba(0,0,0,0.7944) calc(100% - var(--band) * 0.8875),rgba(0,0,0,0.7407) calc(100% - var(--band) * 0.8500),rgba(0,0,0,0.6836) calc(100% - var(--band) * 0.8125),rgba(0,0,0,0.6238) calc(100% - var(--band) * 0.7750),rgba(0,0,0,0.5624) calc(100% - var(--band) * 0.7375),rgba(0,0,0,0.5000) calc(100% - var(--band) * 0.7000),rgba(0,0,0,0.4376) calc(100% - var(--band) * 0.6625),rgba(0,0,0,0.3762) calc(100% - var(--band) * 0.6250),rgba(0,0,0,0.3164) calc(100% - var(--band) * 0.5875),rgba(0,0,0,0.2593) calc(100% - var(--band) * 0.5500),rgba(0,0,0,0.2056) calc(100% - var(--band) * 0.5125),rgba(0,0,0,0.1562) calc(100% - var(--band) * 0.4750),rgba(0,0,0,0.1121) calc(100% - var(--band) * 0.4375),rgba(0,0,0,0.0741) calc(100% - var(--band) * 0.4000),rgba(0,0,0,0.0430) calc(100% - var(--band) * 0.3625),rgba(0,0,0,0.0197) calc(100% - var(--band) * 0.3250),rgba(0,0,0,0.0051) calc(100% - var(--band) * 0.2875),transparent calc(100% - var(--band) * .25));mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--band) * 1.15),rgba(0,0,0,0.9949) calc(100% - var(--band) * 1.1125),rgba(0,0,0,0.9803) calc(100% - var(--band) * 1.0750),rgba(0,0,0,0.9570) calc(100% - var(--band) * 1.0375),rgba(0,0,0,0.9259) calc(100% - var(--band) * 1.0000),rgba(0,0,0,0.8879) calc(100% - var(--band) * 0.9625),rgba(0,0,0,0.8438) calc(100% - var(--band) * 0.9250),rgba(0,0,0,0.7944) calc(100% - var(--band) * 0.8875),rgba(0,0,0,0.7407) calc(100% - var(--band) * 0.8500),rgba(0,0,0,0.6836) calc(100% - var(--band) * 0.8125),rgba(0,0,0,0.6238) calc(100% - var(--band) * 0.7750),rgba(0,0,0,0.5624) calc(100% - var(--band) * 0.7375),rgba(0,0,0,0.5000) calc(100% - var(--band) * 0.7000),rgba(0,0,0,0.4376) calc(100% - var(--band) * 0.6625),rgba(0,0,0,0.3762) calc(100% - var(--band) * 0.6250),rgba(0,0,0,0.3164) calc(100% - var(--band) * 0.5875),rgba(0,0,0,0.2593) calc(100% - var(--band) * 0.5500),rgba(0,0,0,0.2056) calc(100% - var(--band) * 0.5125),rgba(0,0,0,0.1562) calc(100% - var(--band) * 0.4750),rgba(0,0,0,0.1121) calc(100% - var(--band) * 0.4375),rgba(0,0,0,0.0741) calc(100% - var(--band) * 0.4000),rgba(0,0,0,0.0430) calc(100% - var(--band) * 0.3625),rgba(0,0,0,0.0197) calc(100% - var(--band) * 0.3250),rgba(0,0,0,0.0051) calc(100% - var(--band) * 0.2875),transparent calc(100% - var(--band) * .25));background:radial-gradient(55% 50% at 88% 8%,rgba(156,107,30,.16),transparent 70%),radial-gradient(60% 50% at 0% 70%,rgba(244,240,232,.04),transparent 70%);overflow:hidden}
/* pointer light: same 38% x 34% gold glow on its own GPU layer, moved with transform only. It sits on .hero-bg (no mask) instead of inside the masked .hero-glow, because a moving layer inside a mask plus the blend layers above made the browser recomposite the whole hero every frame (Oct 31, 2026 cursor lag fix) */
.blend .hero-bg{overflow:hidden}
.blend .hero-bg:after{content:"";position:absolute;left:34%;top:4%;width:76%;height:68%;background:radial-gradient(50% 50% at 50% 50%,rgba(201,162,75,.15),rgba(201,162,75,0) 70%);transform:translate3d(var(--sx,0px),var(--sy,0px),0);will-change:transform;pointer-events:none}
.blend .hero-lines{background-image:linear-gradient(to right,var(--b-line) 1px,transparent 1px);background-size:calc((100% - 2 * var(--pad)) / 6) 100%;background-position:var(--pad) 0;-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--band) * 1.15),rgba(0,0,0,0.9949) calc(100% - var(--band) * 1.1125),rgba(0,0,0,0.9803) calc(100% - var(--band) * 1.0750),rgba(0,0,0,0.9570) calc(100% - var(--band) * 1.0375),rgba(0,0,0,0.9259) calc(100% - var(--band) * 1.0000),rgba(0,0,0,0.8879) calc(100% - var(--band) * 0.9625),rgba(0,0,0,0.8438) calc(100% - var(--band) * 0.9250),rgba(0,0,0,0.7944) calc(100% - var(--band) * 0.8875),rgba(0,0,0,0.7407) calc(100% - var(--band) * 0.8500),rgba(0,0,0,0.6836) calc(100% - var(--band) * 0.8125),rgba(0,0,0,0.6238) calc(100% - var(--band) * 0.7750),rgba(0,0,0,0.5624) calc(100% - var(--band) * 0.7375),rgba(0,0,0,0.5000) calc(100% - var(--band) * 0.7000),rgba(0,0,0,0.4376) calc(100% - var(--band) * 0.6625),rgba(0,0,0,0.3762) calc(100% - var(--band) * 0.6250),rgba(0,0,0,0.3164) calc(100% - var(--band) * 0.5875),rgba(0,0,0,0.2593) calc(100% - var(--band) * 0.5500),rgba(0,0,0,0.2056) calc(100% - var(--band) * 0.5125),rgba(0,0,0,0.1562) calc(100% - var(--band) * 0.4750),rgba(0,0,0,0.1121) calc(100% - var(--band) * 0.4375),rgba(0,0,0,0.0741) calc(100% - var(--band) * 0.4000),rgba(0,0,0,0.0430) calc(100% - var(--band) * 0.3625),rgba(0,0,0,0.0197) calc(100% - var(--band) * 0.3250),rgba(0,0,0,0.0051) calc(100% - var(--band) * 0.2875),transparent calc(100% - var(--band) * .25));mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--band) * 1.15),rgba(0,0,0,0.9949) calc(100% - var(--band) * 1.1125),rgba(0,0,0,0.9803) calc(100% - var(--band) * 1.0750),rgba(0,0,0,0.9570) calc(100% - var(--band) * 1.0375),rgba(0,0,0,0.9259) calc(100% - var(--band) * 1.0000),rgba(0,0,0,0.8879) calc(100% - var(--band) * 0.9625),rgba(0,0,0,0.8438) calc(100% - var(--band) * 0.9250),rgba(0,0,0,0.7944) calc(100% - var(--band) * 0.8875),rgba(0,0,0,0.7407) calc(100% - var(--band) * 0.8500),rgba(0,0,0,0.6836) calc(100% - var(--band) * 0.8125),rgba(0,0,0,0.6238) calc(100% - var(--band) * 0.7750),rgba(0,0,0,0.5624) calc(100% - var(--band) * 0.7375),rgba(0,0,0,0.5000) calc(100% - var(--band) * 0.7000),rgba(0,0,0,0.4376) calc(100% - var(--band) * 0.6625),rgba(0,0,0,0.3762) calc(100% - var(--band) * 0.6250),rgba(0,0,0,0.3164) calc(100% - var(--band) * 0.5875),rgba(0,0,0,0.2593) calc(100% - var(--band) * 0.5500),rgba(0,0,0,0.2056) calc(100% - var(--band) * 0.5125),rgba(0,0,0,0.1562) calc(100% - var(--band) * 0.4750),rgba(0,0,0,0.1121) calc(100% - var(--band) * 0.4375),rgba(0,0,0,0.0741) calc(100% - var(--band) * 0.4000),rgba(0,0,0,0.0430) calc(100% - var(--band) * 0.3625),rgba(0,0,0,0.0197) calc(100% - var(--band) * 0.3250),rgba(0,0,0,0.0051) calc(100% - var(--band) * 0.2875),transparent calc(100% - var(--band) * .25));opacity:1;animation:page-in 1.6s .1s var(--ease) backwards}
.blend .hero-noise{-webkit-mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--band)),rgba(0,0,0,0.9949) calc(100% - var(--band) * 0.9583),rgba(0,0,0,0.9803) calc(100% - var(--band) * 0.9167),rgba(0,0,0,0.9570) calc(100% - var(--band) * 0.8750),rgba(0,0,0,0.9259) calc(100% - var(--band) * 0.8333),rgba(0,0,0,0.8879) calc(100% - var(--band) * 0.7917),rgba(0,0,0,0.8438) calc(100% - var(--band) * 0.7500),rgba(0,0,0,0.7944) calc(100% - var(--band) * 0.7083),rgba(0,0,0,0.7407) calc(100% - var(--band) * 0.6667),rgba(0,0,0,0.6836) calc(100% - var(--band) * 0.6250),rgba(0,0,0,0.6238) calc(100% - var(--band) * 0.5833),rgba(0,0,0,0.5624) calc(100% - var(--band) * 0.5417),rgba(0,0,0,0.5000) calc(100% - var(--band) * 0.5000),rgba(0,0,0,0.4376) calc(100% - var(--band) * 0.4583),rgba(0,0,0,0.3762) calc(100% - var(--band) * 0.4167),rgba(0,0,0,0.3164) calc(100% - var(--band) * 0.3750),rgba(0,0,0,0.2593) calc(100% - var(--band) * 0.3333),rgba(0,0,0,0.2056) calc(100% - var(--band) * 0.2917),rgba(0,0,0,0.1562) calc(100% - var(--band) * 0.2500),rgba(0,0,0,0.1121) calc(100% - var(--band) * 0.2083),rgba(0,0,0,0.0741) calc(100% - var(--band) * 0.1667),rgba(0,0,0,0.0430) calc(100% - var(--band) * 0.1250),rgba(0,0,0,0.0197) calc(100% - var(--band) * 0.0833),rgba(0,0,0,0.0051) calc(100% - var(--band) * 0.0417),transparent 100%);mask-image:linear-gradient(to bottom,#000 0,#000 calc(100% - var(--band)),rgba(0,0,0,0.9949) calc(100% - var(--band) * 0.9583),rgba(0,0,0,0.9803) calc(100% - var(--band) * 0.9167),rgba(0,0,0,0.9570) calc(100% - var(--band) * 0.8750),rgba(0,0,0,0.9259) calc(100% - var(--band) * 0.8333),rgba(0,0,0,0.8879) calc(100% - var(--band) * 0.7917),rgba(0,0,0,0.8438) calc(100% - var(--band) * 0.7500),rgba(0,0,0,0.7944) calc(100% - var(--band) * 0.7083),rgba(0,0,0,0.7407) calc(100% - var(--band) * 0.6667),rgba(0,0,0,0.6836) calc(100% - var(--band) * 0.6250),rgba(0,0,0,0.6238) calc(100% - var(--band) * 0.5833),rgba(0,0,0,0.5624) calc(100% - var(--band) * 0.5417),rgba(0,0,0,0.5000) calc(100% - var(--band) * 0.5000),rgba(0,0,0,0.4376) calc(100% - var(--band) * 0.4583),rgba(0,0,0,0.3762) calc(100% - var(--band) * 0.4167),rgba(0,0,0,0.3164) calc(100% - var(--band) * 0.3750),rgba(0,0,0,0.2593) calc(100% - var(--band) * 0.3333),rgba(0,0,0,0.2056) calc(100% - var(--band) * 0.2917),rgba(0,0,0,0.1562) calc(100% - var(--band) * 0.2500),rgba(0,0,0,0.1121) calc(100% - var(--band) * 0.2083),rgba(0,0,0,0.0741) calc(100% - var(--band) * 0.1667),rgba(0,0,0,0.0430) calc(100% - var(--band) * 0.1250),rgba(0,0,0,0.0197) calc(100% - var(--band) * 0.0833),rgba(0,0,0,0.0051) calc(100% - var(--band) * 0.0417),transparent 100%);opacity:.06;mix-blend-mode:overlay;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .9 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
.blend .hero-warm{position:absolute;left:0;right:0;bottom:0;height:var(--band);background:radial-gradient(80% 40% at 50% 64%,rgba(240,196,120,.20),rgba(240,196,120,.07) 50%,rgba(240,196,120,0) 75%),radial-gradient(42% 26% at 80% 58%,rgba(232,196,128,.14),rgba(232,196,128,0) 72%);mix-blend-mode:screen}
@media (max-width:767px){.blend .hero-warm{background:radial-gradient(140% 38% at 50% 64%,rgba(240,196,120,.16),rgba(240,196,120,.06) 50%,rgba(240,196,120,0) 78%)}}\n.blend .hero .wrap{z-index:1}
/* hero type and buttons in the splash style */
.blend .hero h1{color:var(--b-ivory);font-size:clamp(46px,6.9vw,104px)}
.blend .hero h1 em{color:var(--b-acc2)}
.blend .hero h1 em,.blend .hero h1 em .w>span{font-weight:300;background:linear-gradient(100deg,var(--b-acc2) 0%,var(--b-acc3) 45%,var(--b-acc2) 60%,var(--b-acc) 100%);background-size:220% 100%;background-position:100% 0;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.blend .hero h1 em .w>span{animation:bl-sheen 7s 2.6s ease-in-out 3}/* 3 shimmer passes, then it rests (Oct 31, 2026 cursor lag fix) */
.blend .hero .eyebrow{color:#a39b8f}
.blend .hero .eyebrow:before{background:var(--b-acc2)}
.blend .hero .lead{color:var(--b-soft)}
.blend .hero .btn.acc{background:var(--b-acc2);color:var(--b-ink);font-weight:600}
.blend .hero .btn.acc:before{background:var(--b-acc3)}
.blend .hero .btn.acc:hover{color:var(--b-ink)}
.blend .hero .btn.ghost{background:transparent;color:var(--b-ivory);box-shadow:inset 0 0 0 1px rgba(244,240,232,.5)}
.blend .hero .btn.ghost:before{background:var(--b-ivory)}
.blend .hero .btn.ghost:hover{color:var(--b-ink)}
.blend .hero .from{color:var(--b-soft)}
.blend .hero .from a{border-bottom-color:rgba(201,162,75,.5)}
.blend .hero .from b{color:var(--b-acc2)}
.blend .hero .from a:hover{color:var(--b-acc3);border-color:var(--b-acc3)}
.blend .hero .scroll-ind{color:var(--b-mute)}
.blend .hero ::selection{background:var(--b-acc2);color:var(--b-ink);-webkit-text-fill-color:var(--b-ink)}
/* header: dark while over the hero, cream once past it */
.blend .hdr{transition:transform .5s var(--ease),background-color .5s ease,color .5s ease,border-color .5s ease,backdrop-filter .5s}
.blend .hdr.over-hero{color:var(--b-ivory)}
.blend .hdr.over-hero.scrolled{background:rgba(15,14,13,.64);border-bottom-color:rgba(244,240,232,.08)}
.blend .hdr.over-hero .hdr-cta .btn{background:var(--b-acc2);color:var(--b-ink);font-weight:600}
.blend .hdr .hdr-cta .btn{transition:background-color .5s ease,color .5s ease}
.blend .hdr.over-hero .hdr-cta .btn:before{background:var(--b-acc3)}
/* the animated L-square emblem from the splash page */
.hero-art{position:absolute;right:var(--pad);top:50%;width:var(--art-w,min(480px,33vw,calc(100svh - 330px)));aspect-ratio:1/1;transform:translateY(-54%);pointer-events:none}
/* laptop and up: the hero text column stops before the emblem, so the headline, tagline, paragraph and buttons never run into it (Oct 28, 2026) */
@media (min-width:901px){
 /* --art-w0: the emblem size from before the column change. --art-w: the same, except from 901px to about 950px it eases a little smaller so the headline keeps its 900px size (62.1px) beside it */
 .blend .hero .wrap:has(>.hero-art){--art-w0:min(480px,33vw,calc(100svh - 330px));--art-w:min(var(--art-w0),calc((100cqw - 515px) / 1.0334));--art-gap:clamp(40px,4.5vw,72px);--hero-col:calc(100% - var(--art-w) - var(--art-gap));width:100%;container-type:inline-size;position:static!important}
 /* the emblem keeps the exact spot it had before the column change: it is placed from the hero itself, using the height the hero text had then (--hero-text0), so a taller paragraph no longer pushes it down */
 .blend .hero .wrap:has(>.hero-art)>.hero-art{--hero-pt:clamp(112px,14vh,140px);--hero-text0:calc(363.6px + 2.04 * clamp(46px,6.9vw,104px) + 4.8 * clamp(18px,1.6vw,22px) + 1.3 * clamp(20px,1.9vw,28px));top:calc(var(--hero-pt) + max(100svh - var(--hero-pt) - 44px, var(--hero-text0)) / 2 - .54 * var(--art-w0));right:calc(max(0px, (100% - 1360px) / 2) + var(--pad));transform:none}
 .blend .hero .wrap:has(>.hero-art)>.s-tagline,.blend .hero .wrap:has(>.hero-art)>.hero-meta{max-width:var(--hero-col)}
 /* headline: never smaller than at 900px (62.1px), then grows with the screen (6.9vw) as far as the room beside the emblem allows.
    --hl-room: width left of the emblem, less 16px. The three steps below follow how wide the headline font sets at each size (it sets a little narrower as it gets bigger) */
 .blend .hero .wrap:has(>.hero-art)>h1{--hl-room:calc(100cqw - var(--art-w) * 1.0334 - 16px);max-width:calc(100% - var(--art-w) * 1.0334 - 4px);font-size:max(62.1px,min(6.9vw,104px,max(min(calc((var(--hl-room) - 63px) / 7.02),72.39px),min(calc((var(--hl-room) - 354px) / 3),85.88px),min(calc((var(--hl-room) - 62px) / 6.4),calc(85.88px + ((var(--hl-room) - 62px) / 6.4 - 85.88px) * 1000)))))}
 .blend .hero .wrap:has(>.hero-art) .hero-meta .lead{max-width:min(62ch,100%)}
}
.hero-art svg{width:100%;height:100%;overflow:visible;display:block}
.hero-art:not(.play) *{animation-play-state:paused!important}
.hero-art .g{stroke:rgba(244,240,232,.16);stroke-width:1.1;fill:none}
.hero-art .g2{stroke:rgba(201,162,75,.42)}
.hero-art .dash{stroke-dasharray:2 7}
.hero-art .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:bl-draw 1.8s var(--ease) forwards}
.hero-art .d1{animation-delay:.3s}.hero-art .d2{animation-delay:.5s}.hero-art .d3{animation-delay:.7s}.hero-art .d4{animation-delay:.9s}.hero-art .d5{animation-delay:1.1s}.hero-art .d6{animation-delay:1.3s}
.hero-art .mk{fill:none;stroke:var(--b-ivory)}
.hero-art .mk-r{stroke-width:5;stroke-dasharray:1;stroke-dashoffset:1;animation:bl-draw 2.2s .6s cubic-bezier(.65,0,.35,1) forwards}
.hero-art .mk-l{stroke-width:7;stroke-linecap:square;stroke-dasharray:1;stroke-dashoffset:1;animation:bl-draw 1.4s 1.6s cubic-bezier(.65,0,.35,1) forwards}
.hero-art .sq{fill:var(--b-acc2);transform-box:fill-box;transform-origin:center;opacity:0;transform:scale(.2) rotate(-45deg);animation:bl-land .9s 2.7s cubic-bezier(.3,1.5,.5,1) forwards}
.hero-art .glow{fill:url(#hgl);opacity:0;animation:bl-fade 1.4s 2.9s ease forwards,bl-breathe 5s 4.3s ease-in-out infinite}
.hero-art .ring{transform-origin:300px 300px;animation:bl-spin 90s linear infinite}
.hero-art .spark{stroke:var(--b-acc3);stroke-width:3;stroke-linecap:round;fill:none;stroke-dasharray:.018 .982;stroke-dashoffset:0;opacity:0;animation:bl-fade 1s 3s forwards,bl-travel 11s 3s linear infinite}
/* spark glow drawn as two soft wider strokes under the spark instead of a drop-shadow filter, which re-blurred the emblem every frame (Oct 31, 2026 hero lag fix) */
.hero-art .spark.sh1{stroke:rgba(226,194,122,.30);stroke-width:8}
.hero-art .spark.sh2{stroke:rgba(226,194,122,.12);stroke-width:14}
.hero-art .lab{font-family:var(--sans);font-size:11px;letter-spacing:.24em;fill:rgba(244,240,232,.42);text-transform:uppercase;opacity:0;animation:bl-fade 1.2s 2.2s forwards}
.hero-art .lab.g3{fill:rgba(201,162,75,.75)}
.hero-art .tick{stroke:rgba(201,162,75,.6);stroke-width:1.2;opacity:0;animation:bl-fade .8s 1.9s forwards}
.hero-art .node{fill:var(--b-ink);stroke:rgba(201,162,75,.85);stroke-width:1.4;opacity:0;animation:bl-fade .8s 2s forwards}
@keyframes bl-fade{to{opacity:1}}
@keyframes bl-draw{to{stroke-dashoffset:0}}
@keyframes bl-land{to{opacity:1;transform:none}}
@keyframes bl-breathe{0%,100%{opacity:1}50%{opacity:.55}}
@keyframes bl-spin{to{transform:rotate(360deg)}}
@keyframes bl-travel{to{stroke-dashoffset:-1}}
@keyframes bl-sheen{0%,100%{background-position:100% 0}50%{background-position:0 0}}
/* tablet and phone: emblem sits above the copy as the hero picture */
@media (max-width:900px){
 .blend{--band:clamp(240px,60vw,300px);--peek:70px}
 .hero-art{position:relative;right:auto;top:auto;transform:none;width:min(56vw,260px);margin:-24px auto 24px}
 .blend .hero h1{max-width:none}
}
@media (max-width:900px) and (min-width:561px){.hero-art{width:min(46vw,340px)}}
/* tablets and laptops at 200% zoom (601 to 900px): the copy comes first and the emblem follows the buttons, centred, so the headline and main button are on the first screen (Gauntlet r4 add-on 2 Medium, Oct 28, 2026) */
@media (min-width:601px) and (max-width:900px){
 .blend .hero .wrap:has(>.hero-art){display:flex;flex-direction:column}
 .blend .hero .wrap>.hero-art{order:2;width:min(42vw,320px);margin:64px auto 0}
 .blend .hero .wrap:has(>.hero-art)>.scroll-ind{order:3}
}
/* the same widths on a short screen (for example 1280x800 or 1280x1024 at 200%): tighter spacing, and the buttons sit just under the tagline with the paragraph after them */
@media (min-width:601px) and (max-width:900px) and (max-height:680px){
 .blend .hero:has(.hero-art){padding-top:96px}
 .blend .hero .wrap:has(>.hero-art)>h1{margin-top:18px!important}
 .blend .hero .wrap:has(>.hero-art)>.s-tagline{margin-top:16px}
 .blend .hero .wrap:has(>.hero-art)>.hero-meta{margin-top:24px;row-gap:24px}
 .blend .hero .wrap:has(>.hero-art)>.hero-meta>div{order:-1}
 .blend .hero .wrap>.hero-art{margin-top:48px}
}
/* the same widths at 200% zoom with browser toolbars (380px tall or less, for example 640x330 or 683x320): a little tighter again, and the headline eases to 42px */
@media (min-width:601px) and (max-width:900px) and (max-height:380px){
 .blend .hero:has(.hero-art){padding-top:84px}
 .blend .hero .wrap:has(>.hero-art)>h1{margin-top:8px!important;font-size:42px}
 .blend .hero .wrap:has(>.hero-art)>.s-tagline{margin-top:8px;font-size:18px}
 .blend .hero .wrap:has(>.hero-art)>.hero-meta{margin-top:14px}
}
/* phones on a short screen (760px tall or less, 840px on the narrowest phones), for example 375x548 with browser toolbars: tighter spacing, and the buttons sit just under the tagline with the paragraph after them, so the main button is on the first screen (Gauntlet r4 add-on 3 Medium, Oct 28, 2026) */
@media (max-width:600px) and (max-height:760px),(max-width:359px) and (max-height:840px){
 .blend .hero:has(.hero-art){padding-top:92px}
 .blend .hero .wrap:has(>.hero-art)>h1{margin-top:16px!important}
 .blend .hero .wrap:has(>.hero-art)>.s-tagline{margin-top:14px}
 .blend .hero .wrap:has(>.hero-art)>.hero-meta{margin-top:22px;row-gap:24px}
 .blend .hero .wrap:has(>.hero-art)>.hero-meta>div:has(>.btn){order:-1}
}
/* reduced motion: show the finished drawing, no movement */
@media (prefers-reduced-motion:reduce){
 .hero-art *{animation:none!important}
 .hero-art .draw,.hero-art .mk-r,.hero-art .mk-l{stroke-dashoffset:0}
 .hero-art .sq{opacity:1;transform:none}
 .hero-art .glow,.hero-art .lab,.hero-art .tick,.hero-art .node,.blend .hero-lines{opacity:1;animation:none!important}
 .hero-art .spark{display:none}
 .blend .hero h1 em .w>span{animation:none!important;background-position:50% 0}
}
/* hero emblem already formed (after the load-in hands over to it) */
.hero-art.formed{opacity:0;transition:opacity .35s ease}
.hero-art.formed.shown{opacity:1}
.hero-art.formed .draw,.hero-art.formed .mk-r,.hero-art.formed .mk-l{stroke-dashoffset:0;animation:none}
.hero-art.formed .sq{opacity:1;transform:none;animation:none}
.hero-art.formed .lab,.hero-art.formed .tick,.hero-art.formed .node{opacity:1;animation:none}
.hero-art.formed .glow{opacity:1;animation:bl-breathe 5s 1s ease-in-out infinite}
.hero-art.formed .spark{opacity:1;animation:bl-travel 11s linear infinite}
/* load-in: the L-square forms centered on dark, then glides into the hero while the page fades in */
.bl-iov{display:none}
.bl-intro .bl-iov{display:grid;place-items:center;position:fixed;inset:0;z-index:2147483000;background:#0f0e0d;cursor:pointer;transition:background-color .7s cubic-bezier(.45,0,.25,1)}
.bl-intro .bl-iov.out{background-color:rgba(15,14,13,0);pointer-events:none}
.bl-intro body>*:not(.bl-iov){opacity:0}
.bl-intro.bl-reveal body>*:not(.bl-iov){opacity:1;transition:opacity .7s cubic-bezier(.45,0,.25,1)}
.bl-iov-art{width:min(42vmin,380px);aspect-ratio:1/1;transform-origin:0 0;will-change:transform;transition:transform .7s cubic-bezier(.65,0,.35,1),opacity .7s ease}
.bl-iov-art svg{width:100%;height:100%;overflow:visible;display:block}
.bl-iov-art .g{stroke:rgba(244,240,232,.16);stroke-width:1.1;fill:none}
.bl-iov-art .g2{stroke:rgba(201,162,75,.42)}
.bl-iov-art .dash{stroke-dasharray:2 7}
.bl-iov-art .draw{stroke-dasharray:1;stroke-dashoffset:1;animation:bl-draw 2s var(--ease) forwards}
.bl-iov-art .d1{animation-delay:.2s}.bl-iov-art .d2{animation-delay:.4s}.bl-iov-art .d3{animation-delay:.6s}.bl-iov-art .d4{animation-delay:.8s}.bl-iov-art .d5{animation-delay:1s}.bl-iov-art .d6{animation-delay:1.2s}
.bl-iov-art .mk{fill:none;stroke:#f4f0e8}
.bl-iov-art .mk-r{stroke-width:5;stroke-dasharray:1;stroke-dashoffset:1;animation:bl-draw 2.3s .5s cubic-bezier(.65,0,.35,1) forwards}
.bl-iov-art .mk-l{stroke-width:7;stroke-linecap:square;stroke-dasharray:1;stroke-dashoffset:1;animation:bl-draw 1.4s 1.9s cubic-bezier(.65,0,.35,1) forwards}
.bl-iov-art .sq{fill:#c9a24b;transform-box:fill-box;transform-origin:center;opacity:0;transform:scale(.2) rotate(-45deg);animation:bl-land .9s 2.9s cubic-bezier(.3,1.5,.5,1) forwards}
.bl-iov-art .glow{fill:url(#igl);opacity:0;animation:bl-fade 1s 3.1s ease forwards}
.bl-iov-art .ring{transform-origin:300px 300px;animation:bl-spin 90s linear infinite}
.bl-iov-art .spark{display:none}
.bl-iov-art .lab{font-family:var(--sans);font-size:11px;letter-spacing:.24em;fill:rgba(244,240,232,.42);text-transform:uppercase;opacity:0;animation:bl-fade 1.1s 2.3s forwards}
.bl-iov-art .lab.g3{fill:rgba(201,162,75,.75)}
.bl-iov-art .tick{stroke:rgba(201,162,75,.6);stroke-width:1.2;opacity:0;animation:bl-fade .8s 1.9s forwards}
.bl-iov-art .node{fill:#0f0e0d;stroke:rgba(201,162,75,.85);stroke-width:1.4;opacity:0;animation:bl-fade .8s 2.1s forwards}
.bl-iov.skip .bl-iov-art *{animation-duration:.01s!important;animation-delay:0s!important}
@media (prefers-reduced-motion:reduce){.bl-iov{display:none!important}.bl-intro body>*:not(.bl-iov){opacity:1}}
@media (max-width:560px){.bl-iov-art{width:62vw}}
html.bl-intro{background:#0f0e0d}
.bl-intro body{animation:none!important}
/* one floating "Start your project" button for visitors, bottom-right on every width. hidden on the hero, fades in once the hero text has scrolled past, steps aside at the footer's Privacy and Terms row */
body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start{left:auto;right:max(24px,env(safe-area-inset-right));bottom:calc(24px + env(safe-area-inset-bottom));gap:10px;min-height:52px;padding:15px 24px 15px 26px;border:1px solid rgba(232,200,128,.45);background:var(--acc);color:#fff;font:500 15px/1 var(--sans,system-ui,sans-serif);box-shadow:0 20px 40px -12px rgba(0,0,0,.4);transition:opacity .35s ease,transform .45s var(--ease),visibility 0s,background-color .3s ease,box-shadow .3s ease}
body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start .arrow{width:16px;height:16px;transition:transform .3s var(--ease)}
body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start:hover,body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start:focus-visible{background:#8a6524;border-color:rgba(232,200,128,.7);box-shadow:0 22px 44px -12px rgba(0,0,0,.45),0 0 0 4px rgba(201,162,92,.25)}
body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start:hover .arrow{transform:translateX(3px)}
body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start:focus-visible{outline:2px solid #e8c880;outline-offset:3px}
body[data-chat-mode="start"][data-chat-mode].bl-fab-off .cc-fab.cc-fab-start{opacity:0;visibility:hidden;transform:translateY(18px);pointer-events:none;transition:opacity .25s ease,transform .35s var(--ease),visibility 0s .35s}
@media (max-width:767px){body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start{right:max(16px,env(safe-area-inset-right));bottom:calc(18px + env(safe-area-inset-bottom));min-height:50px;padding:14px 20px 14px 22px;font-size:15px}}
@media (prefers-reduced-motion:reduce){body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start,body[data-chat-mode="start"][data-chat-mode].bl-fab-off .cc-fab.cc-fab-start{transform:none}body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start:hover .arrow{transform:none}}
/* Start your project panel header: LISB L-square mark and the title only */
body[data-chat-mode="start"][data-chat-mode] .cc-head.cc-head-start{gap:14px;padding:14px 14px 14px 18px;min-height:68px}
body[data-chat-mode="start"][data-chat-mode] .cc-head-start .cc-mark{flex:none;display:grid;place-items:center;width:40px;height:40px;color:#f7f1e6}
body[data-chat-mode="start"][data-chat-mode] .cc-head-start .cc-mark svg{display:block;width:40px;height:40px;shape-rendering:geometricPrecision}
body[data-chat-mode="start"][data-chat-mode] .cc-head-start h2{font-size:19px;line-height:1.15;letter-spacing:.005em}
/* Start your project panel: small-print links get a quiet gold underline */
body[data-chat-mode="start"][data-chat-mode] .cc-panel:not(.cc-inline) .cc-small a{color:inherit;text-decoration:underline;text-decoration-color:rgba(168,128,60,.55);text-decoration-thickness:1px;text-underline-offset:3px;transition:color .2s ease,text-decoration-color .2s ease}
body[data-chat-mode="start"][data-chat-mode] .cc-panel:not(.cc-inline) .cc-small a:hover,body[data-chat-mode="start"][data-chat-mode] .cc-panel:not(.cc-inline) .cc-small a:focus-visible{color:#8a6524;text-decoration-color:#a8803c}
/* private project form step */
body[data-chat-mode="start"][data-chat-mode] .cc-ff .cc-back{display:inline-flex;align-items:center;gap:6px;margin:0 0 14px;padding:6px 10px 6px 4px;border:0;background:none;color:#6a6156;font:500 13.5px/1 var(--sans,system-ui,sans-serif);cursor:pointer;border-radius:8px}
body[data-chat-mode="start"][data-chat-mode] .cc-ff .cc-back:hover,body[data-chat-mode="start"][data-chat-mode] .cc-ff .cc-back:focus-visible{color:#8a6524;outline:2px solid rgba(201,162,92,.45);outline-offset:1px}
body[data-chat-mode="start"][data-chat-mode] .cc-ff h3:focus{outline:none}
body[data-chat-mode="start"][data-chat-mode] .cc-ff .cc-opt{font-weight:400;color:#6b655e;font-size:12.5px;margin-left:6px}
body[data-chat-mode="start"][data-chat-mode] .cc-ff .cc-hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
/* spam trap (honeypot) in every chat form: off screen for people, still in the form for bots */
.cc-hp{position:absolute!important;left:-9999px!important;top:auto!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;overflow:hidden!important;clip:rect(0 0 0 0)!important;clip-path:inset(50%)!important;white-space:nowrap!important;border:0!important}
body[data-chat-mode="start"][data-chat-mode] .cc-ffdone .cc-ok{display:grid;place-items:center;width:44px;height:44px;margin:4px 0 16px;border-radius:50%;background:#141210;color:#e8c880;box-shadow:0 0 0 4px rgba(201,162,92,.22)}
body[data-chat-mode="start"][data-chat-mode] .cc-ffdone .cc-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px}
/* studio block: brand card in place of a photo (a real photo can replace it; the .founder img style is ready) */
.founder-card{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;justify-content:space-between;gap:22px;width:100%;aspect-ratio:600/760;padding:clamp(28px,3vw,40px);border-radius:22px;color:#f4f0e8;background:radial-gradient(70% 46% at 74% 20%,rgba(201,162,75,.24),rgba(201,162,75,0) 70%),radial-gradient(60% 40% at 0% 100%,rgba(156,107,30,.2),rgba(156,107,30,0) 70%),#121110;box-shadow:0 30px 60px -30px rgba(60,40,10,.45)}
.founder-card:before{content:"";position:absolute;inset:12px;z-index:-1;border:1px solid rgba(201,162,75,.24);border-radius:14px;pointer-events:none}
.founder-card:after{content:"";position:absolute;inset:0;z-index:-2;background-image:linear-gradient(to right,rgba(244,240,232,.05) 1px,transparent 1px);background-size:25% 100%;background-position:12.5% 0;-webkit-mask-image:linear-gradient(#000,transparent 80%);mask-image:linear-gradient(#000,transparent 80%);pointer-events:none}
.fc-mark{display:block;width:clamp(72px,38%,136px);height:auto;filter:drop-shadow(0 0 22px rgba(201,162,75,.18))}
.fc-quote{margin:0}
.fc-quote p{margin:0;font-family:var(--serif);font-weight:300;font-size:clamp(25px,2.25vw,33px);line-height:1.16;letter-spacing:-.01em;color:#f4f0e8}
.fc-quote p:before{content:"\201C";display:block;margin-bottom:12px;font-size:2.1em;line-height:.6;color:#c9a24b}
.fc-quote em{font-style:italic;color:#d9b468}
.fc-foot{display:flex;align-items:center;gap:12px;margin:0;font:600 10.5px/1.3 var(--sans);letter-spacing:.22em;text-transform:uppercase;color:#cfae6a}
.fc-foot:before{content:"";flex:none;width:28px;height:1px;background:currentColor}
@media (max-width:900px){.founder-card{aspect-ratio:auto;min-height:0;gap:16px;padding:26px 26px 24px}.fc-mark{width:58px}.fc-quote p{font-size:clamp(22px,5.6vw,28px)}.fc-quote p:before{display:none}}
/* studio block: photo by itself, rounded corners and a soft shadow */
.founder .founder-photo{display:block;margin:0}
.founder .founder-photo img{display:block;width:100%;height:auto;max-height:none;aspect-ratio:600/760;object-fit:cover;border-radius:22px;border:0;outline:0;box-shadow:0 30px 60px -30px rgba(60,40,10,.35)}
/* phone: headline and button first, smaller emblem after them, short fade, no "Scroll" label */
@media (max-width:600px){
 .blend{--band:clamp(160px,43vw,190px);--peek:36px}
 .blend .hero{min-height:0;padding-top:104px}
 .blend .hero .wrap{display:flex;flex-direction:column}
 .blend .hero .hero-art{order:2;width:min(40vw,156px);margin:34px auto 0}
 .blend .hero .hero-meta{gap:28px;margin-top:32px}
 .blend .hero .scroll-ind{display:none}
}
/* laptop and up: less empty space above the headline */
@media (min-width:901px){.blend .hero{justify-content:center;padding-top:clamp(112px,14vh,140px)}}
/* slim bottom bar, 900px and under (home page): replaces the floating Start your project button */
.bl-bar{display:none}
@media (max-width:900px){
body[data-chat-mode="start"][data-chat-mode] .cc-fab.cc-fab-start{display:none!important}
body.blend.pg-index .ftr{padding-bottom:calc(96px + env(safe-area-inset-bottom))}
.bl-bar{position:fixed;left:0;right:0;bottom:0;z-index:955;display:flex;align-items:center;justify-content:space-between;gap:12px;box-sizing:border-box;height:calc(56px + env(safe-area-inset-bottom));padding:0 max(16px,env(safe-area-inset-right)) env(safe-area-inset-bottom) max(16px,env(safe-area-inset-left));background:#0f0e0d;border-top:1px solid rgba(201,162,75,.5);box-shadow:0 -12px 30px -16px rgba(0,0,0,.55);color:#f4f0e8;transform:translateY(calc(100% + 2px));visibility:hidden;pointer-events:none;transition:transform .4s var(--ease),visibility 0s .4s}
body.bl-bar-on .bl-bar{transform:none;visibility:visible;pointer-events:auto;transition:transform .4s var(--ease),visibility 0s}
.bl-bar a{text-decoration:none;-webkit-tap-highlight-color:transparent}
.bl-bar-from{display:inline-flex;align-items:baseline;gap:6px;min-height:44px;align-items:center;font:400 14px/1.2 var(--sans,system-ui,sans-serif);color:#c9c2b6;white-space:nowrap}
.bl-bar-from b{font:500 18px/1 var(--serif,Georgia,serif);color:#e2c27a;letter-spacing:-.01em}
.bl-bar-go{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:0 16px 0 18px;border-radius:999px;background:#c9a24b;color:#0f0e0d!important;font:600 14.5px/1 var(--sans,system-ui,sans-serif);white-space:nowrap;transition:background-color .25s ease}
.bl-bar-go .arrow{width:15px;height:15px}
.bl-bar-go:hover,.bl-bar-go:active{background:#e2c27a}
.bl-bar a:focus-visible{outline:2px solid #e8c880;outline-offset:3px;border-radius:999px}
}
@media (max-width:900px) and (prefers-reduced-motion:reduce){.bl-bar,body.bl-bar-on .bl-bar{transform:none;transition:none}}

/* client login: once signed in (no start mode) the visitor bar stays away */
body:not([data-chat-mode="start"]) .bl-bar{display:none!important}