/* V1 shared shell and component dimensions. */
@font-face{font-family:Inter;src:url('assets/fonts/inter-regular.ttf');font-weight:400;font-display:swap}
:root{--card-radius:24px;--control-radius:8px;--action-blue:#2563eb}
body{font-family:Inter,Arial,sans-serif}
a:focus-visible,summary:focus-visible{outline:2px solid #8a65ed;outline-offset:5px}
.hero-nav{gap:24px}.hero-nav .nav-menu{display:flex;align-items:center;gap:28px}.hero-nav .nav-links{position:static;transform:none;gap:24px;width:auto}.hero-nav .brand{flex-shrink:0}.hero-nav .demo-link{flex-shrink:0}.nav-dropdown{position:relative;font-size:16px}.nav-dropdown summary{display:flex;align-items:center;gap:6px;cursor:pointer;list-style:none;white-space:nowrap;padding:12px 0}.nav-dropdown summary::-webkit-details-marker{display:none}.nav-dropdown summary span{transition:transform .2s}.nav-dropdown[open] summary span{transform:rotate(180deg)}.nav-dropdown-panel{position:absolute;top:calc(100% + 8px);left:-16px;min-width:210px;padding:8px;background:#111;color:white;border:1px solid #404040;border-radius:24px;box-shadow:0 12px 32px #0003}.hero-nav .nav-dropdown-panel a{display:block;padding:12px 16px;border-radius:8px;color:#fff;line-height:1.4}.hero-nav .nav-dropdown-panel a:hover,.hero-nav .nav-dropdown-panel a[aria-current=page]{background:#272727}.hero-nav:has(.nav-dropdown[open]){transform:translateY(0);pointer-events:auto}.book-demo-button{width:max-content;text-decoration:none;text-align:center}
.reading-symbol{background:none;border:0;transform:none;mask:none;-webkit-mask:none;vertical-align:-.12em}.reading-symbol:after{display:none}.reading-symbol svg{display:block;width:100%;height:100%}
.context-board,.decision-card,.setup-card,.support-window,.journey-window,.campaign-store,.customer-story,.chat-chart{border-radius:var(--card-radius)}
.customer-story{overflow:hidden}.chat-bubble,.campaign-bubble{border-radius:8px 24px 24px 24px}.campaign-row.follow-on .campaign-bubble{border-radius:24px}.approval-bubble,.support-messages .support-question{border-radius:24px 8px 24px 24px}.support-messages p{border-radius:8px 24px 24px 24px}.migration-messages p{border-radius:24px}.migration-messages p:first-of-type{border-top-left-radius:8px}.chat-compose{border-radius:8px}
.customer-tabs button{min-width:0}.founder-portrait{aspect-ratio:470/549}.customer-quote{min-width:0}.customer-quote blockquote{font-size:clamp(22px,2.25vw,29px)}.draft-label{display:block;font-size:12px;line-height:1.5;color:#c7b9ef;margin:0 0 20px;max-width:340px}.metric-pending{display:block;margin-top:4px;font-size:12px;color:#a3a3a3}.customer-metrics>div{min-width:0;justify-content:flex-end}.customer-metrics dt{color:#a3a3a3}.customer-metrics dd{font-size:clamp(24px,3vw,40px)}
.campaign-loading{box-sizing:border-box;width:max-content;max-width:calc(100% - 32px);padding:12px 16px;gap:8px;justify-content:center;background:rgb(17 17 17 / 92%);border-color:#ffffff24;border-radius:16px;box-shadow:0 8px 24px #0003;transition:background .2s;z-index:4}.campaign-loading>.campaign-status-label{font-size:16px;line-height:1.4}.campaign-loading.is-done{width:max-content;background:#111e}.campaign-loading>.campaign-status-icon{display:inline-grid;place-items:center;flex:0 0 20px;width:20px;height:20px;text-align:center;font-size:20px;line-height:1;border-radius:50%;transition:background .2s,color .2s}.campaign-loading.is-done>.campaign-status-icon{background:#21834a;color:#fff;font-size:14px;font-weight:600}
/* Keep a short readable hold after Store ready, without a redundant terminal
   viewport once the campaign reveal has completed. */
.store-story{height:2050vh;height:2050svh}
.trusted-section{padding:72px 7%;background:#fff;color:#111;overflow:hidden}.trusted-heading{display:flex;justify-content:space-between;align-items:center;gap:32px;max-width:1080px;margin:0 auto 40px}.trusted-eyebrow{font-size:12px;color:#737373;margin:0 0 12px}.trusted-heading h2{font:400 48px/1.05 'Awesome Serif',Georgia,serif;margin:0}.gmv-note strong{font-size:24px;font-weight:400}.gmv-note .draft-label{margin:8px 0 0;color:#737373}.client-marquee{max-width:1220px;margin:auto;overflow:hidden;mask-image:linear-gradient(to right,transparent,#000 8%,#000 92%,transparent)}.client-track{display:flex;width:max-content;animation:client-scroll 24s linear infinite}.client-group{display:flex;align-items:center;gap:72px;padding:24px 36px;flex-shrink:0}.client-wordmark{display:block;min-width:160px;text-align:center;font-size:30px;white-space:nowrap}.client-do-amore{font-family:Georgia,serif;letter-spacing:-1px}.client-gruum{font-weight:600;letter-spacing:-1.5px}.client-valentte{font-family:Georgia,serif;text-transform:uppercase;letter-spacing:2px;font-size:25px}.client-comic-concepts{font-weight:600;font-size:24px}.client-marquee:hover .client-track,.client-marquee.is-paused .client-track{animation-play-state:paused}.marquee-toggle{display:block;margin:20px auto 0;padding:8px 12px;border:1px solid #d4d4d4;border-radius:8px;background:none;color:#737373;font-size:12px}@keyframes client-scroll{to{transform:translateX(-50%)}}
.footer-socials{gap:12px}.footer-socials :is(a,span){width:48px;height:48px}.footer-socials svg{width:28px;height:28px}.footer-copyright{font-size:14px;color:#a3a3a3;padding:24px 4%;margin:0;border-top:1px solid #272727}.footer-links{grid-template-columns:repeat(3,minmax(0,1fr));max-width:800px}.footer-brand{flex-shrink:0}.footer-links a{line-height:1.5}
.placeholder-page{background:#fff;color:#111}.placeholder-page .hero-nav{color:#fff}.placeholder-page .hero-nav.nav-on-light{color:#111}.placeholder-main{max-width:1160px;min-height:76vh;min-height:76svh;margin:auto;padding:190px 48px 96px}.placeholder-eyebrow{color:#737373;font-size:12px;text-transform:uppercase;letter-spacing:.1em}.placeholder-main h1{font:400 clamp(48px,6vw,80px)/1.05 'Awesome Serif',Georgia,serif;margin:24px 0}.placeholder-note{font-size:16px;color:#737373;margin:16px 0;line-height:1.5}.page-demo{display:inline-block;background:black;color:white;border-radius:8px;padding:14px 24px;margin-top:24px;font-size:16px;text-decoration:none}.about-placeholder-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin:48px 0 16px}.about-placeholder-grid section{border:1px solid #d4d4d4;border-radius:24px;padding:32px;scroll-margin-top:140px}.about-placeholder-grid h2{font-size:24px;margin:0 0 16px}.about-placeholder-grid p{font-size:16px;line-height:1.5;color:#737373}.placeholder-page .report-intro{padding:80px 24px 32px}
@media(max-width:1100px){.hero-nav{display:grid;grid-template-columns:1fr auto;left:5%;width:90%;gap:0;padding:16px}.menu-toggle{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;width:38px;height:38px;padding:8px;border:0;background:none;color:inherit}.menu-toggle span{width:22px;height:2px;background:currentColor}.hero-nav .nav-menu{display:none;grid-column:1/-1;padding-top:16px;max-height:calc(100vh - 140px);max-height:calc(100svh - 140px);overflow-y:auto}.hero-nav.menu-open .nav-menu{display:flex;flex-direction:column;align-items:stretch;gap:16px}.hero-nav.menu-open{background:#111f;color:white}.placeholder-page .hero-nav.menu-open,.hero-nav.nav-on-light.menu-open{background:#fffffff5;color:#111}.hero-nav .nav-links{display:flex;flex-direction:column;align-items:stretch;gap:0;width:100%}.hero-nav .nav-links>a,.nav-dropdown summary{padding:12px 4px;font-size:16px}.hero-nav .demo-link{text-align:center;align-self:stretch}.nav-dropdown-panel{position:static;box-shadow:none;background:#111;border-radius:24px;min-width:0;margin:4px 0 12px}.footer-content{flex-direction:column}.footer-links{max-width:none;width:100%}}
@media(max-width:760px){.customer-tabs{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;overflow:visible;padding:4px 2px 8px}.customer-tabs button{flex:0 0 auto;width:auto;min-width:0;min-height:38px;padding:8px 16px;font-size:13px;white-space:nowrap}.customer-section .customer-metrics{display:none}.customer-story{grid-template-columns:1fr}.customer-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.customer-metrics>div{padding:24px 16px}.customer-metrics dd{font-size:26px;white-space:normal}.customer-quote{padding:28px 24px;min-height:340px;gap:32px}.customer-quote blockquote{font-size:24px}.trusted-section{padding:56px 6%}.trusted-heading{align-items:flex-start;flex-direction:column;gap:24px;margin-bottom:24px}.trusted-heading h2{font-size:40px}.client-group{gap:32px;padding:24px 16px}.client-wordmark{min-width:140px}.footer-links{grid-template-columns:repeat(2,minmax(0,1fr));gap:32px 24px}.footer-copyright{padding:24px 6% 120px;font-size:12px}.placeholder-main{padding:150px 24px 72px;min-height:70vh;min-height:70svh}.about-placeholder-grid{grid-template-columns:1fr}.about-placeholder-grid section{padding:24px}.campaign-loading>.campaign-status-label{font-size:16px}}
@media(prefers-reduced-motion:reduce){.client-track{animation:none}.client-marquee{overflow-x:auto;mask-image:none}.client-group[aria-hidden]{display:none}.marquee-toggle{display:none}.campaign-loading{transition:none}}

.gmv-caption{display:block;margin-top:8px;font-size:16px;color:#737373}
/* Social proof belongs to the opening composition, before the story begins. */
.opening .hero-trust{position:absolute;z-index:3;left:8%;right:calc(8% + 200px);bottom:24px;padding:16px 0 0;color:#fff;background:linear-gradient(transparent,#000b 25%,#000e);overflow:visible}
.hero-trust .trusted-heading{justify-content:flex-start;align-items:baseline;gap:24px;margin:0 0 10px;padding:0 16px}
.hero-trust .trusted-heading h2{font:400 12px/1.5 Inter,Arial,sans-serif;color:#a3a3a3;white-space:nowrap}
.hero-trust .gmv-note{font-size:12px;line-height:1.5}.hero-trust .gmv-note strong{font:inherit;color:#fff}.hero-trust .gmv-caption{display:inline;font-size:inherit;color:#a3a3a3;margin:0}
.hero-trust .client-group{padding:10px 24px;gap:40px}.hero-trust .client-wordmark{min-width:140px;font-size:24px}.hero-trust .client-valentte{font-size:20px}.hero-trust .client-comic-concepts{font-size:20px}
.hero-trust .marquee-toggle{position:absolute;width:24px;height:24px;right:-24px;bottom:12px;overflow:hidden;font-size:0;border:0;padding:0;margin:0;color:#a3a3a3}.hero-trust .marquee-toggle:before{content:'Ⅱ';font-size:14px}.hero-trust .marquee-toggle[aria-pressed=true]:before{content:'▷'}
@media(max-width:760px){.opening .hero-trust{left:7%;right:7%;bottom:130px;padding-top:16px}.hero-trust .trusted-heading{flex-direction:row;gap:12px;padding:0;margin-bottom:6px;flex-wrap:wrap}.hero-trust .gmv-note{font-size:12px}.hero-trust .client-group{gap:24px;padding:8px 12px}.hero-trust .client-wordmark{min-width:120px;font-size:22px}.hero-trust .client-valentte,.hero-trust .client-comic-concepts{font-size:18px}.hero-trust .marquee-toggle{right:-18px;bottom:8px}}
@media(max-height:600px) and (min-width:761px){.opening .hero-trust{bottom:16px}.hero-trust .trusted-heading{margin-bottom:0}.hero-trust .client-group{padding-block:6px}}
/* Compact, centred proof strip; the GMV note accompanies the hero headline. */
.hero-title .hero-gmv{display:block;margin-top:18px;color:#b0b0b0;font:400 12px/1.5 Inter,Arial,sans-serif;letter-spacing:0;text-align:center;white-space:normal;max-width:260px}
.opening .hero-trust{left:50%;right:auto;transform:translateX(-50%);width:min(420px,calc(100% - 64px));bottom:72px;padding:12px 0 0;background:linear-gradient(transparent,#000b 35%,#000d)}
.hero-trust .trusted-heading{justify-content:center;gap:0;padding:0;margin:0 0 6px}.hero-trust .trusted-heading h2{text-align:center;font-size:11px}
.hero-trust .client-group{gap:32px;padding:8px 16px}.hero-trust .client-wordmark{width:124px;min-width:124px;font-size:19px}.hero-trust .client-valentte{font-size:16px;letter-spacing:1px}.hero-trust .client-comic-concepts{font-size:16px}.hero-trust .client-track{animation-duration:24s}
.hero-trust .marquee-toggle{right:-24px;bottom:8px}
@media(max-width:760px){.opening .hero-trust{width:min(300px,calc(100% - 64px));bottom:110px}.hero-trust .client-group{gap:24px;padding:8px 12px}.hero-trust .client-wordmark{width:112px;min-width:112px;font-size:18px}.hero-trust .client-valentte,.hero-trust .client-comic-concepts{font-size:15px}.hero-title .hero-gmv{margin-top:14px;font-size:11px;max-width:185px}.hero-trust .marquee-toggle{right:-20px}}

/* Original customer artwork from urumi.ai; fixed slots preserve the seamless loop. */
.hero-trust .client-wordmark{display:flex;align-items:center;justify-content:center;height:32px;flex-shrink:0}
.hero-trust .client-wordmark img{display:block;width:100%;height:32px;object-fit:contain;filter:brightness(0) invert(1);opacity:.88}
.hero-trust .client-gruum img{width:88px;height:26px}
@media(max-width:760px){.hero-trust .client-wordmark,.hero-trust .client-wordmark img{height:28px}.hero-trust .client-gruum img{width:80px;height:24px}}

/* Story copy stays in the document, independent of either video crop. */
.story-copy{position:absolute;inset:0;z-index:2;pointer-events:none;color:#fff}
.story-caption{position:absolute;margin:0;opacity:0;font:400 clamp(32px,3.5vw,64px)/1.05 'Awesome Serif',Baskerville,serif;letter-spacing:-.025em;text-align:center;text-shadow:0 2px 18px #000a;will-change:opacity,transform}
.story-caption--opening-left{left:8%;top:32%;width:26%}
.story-caption--opening-right{right:8%;top:54%;width:26%}
.story-caption--want{left:10%;top:28%;width:22%}
.story-caption--create{right:9%;top:64%;width:22%;font-size:clamp(48px,6vw,96px)}
.story-caption--good-product{left:75%;top:64%;width:18%;font-size:clamp(48px,5vw,80px);text-align:left}
.story-caption--good-product em{font-style:italic}
.story-caption--sell{left:39%;top:34%;width:22%;font-size:clamp(48px,4.55vw,76px);text-align:center}
.story-caption--rent{left:15%;right:15%;top:66.5%}
.story-caption--tools{left:15%;right:15%;top:83%}
@media(max-width:900px){
 .story-caption{font-size:clamp(30px,7vw,48px);text-shadow:0 2px 12px #000,0 0 32px #0009}
 .story-caption--opening-left{left:8%;top:12%;width:70%;text-align:left}
 .story-caption--opening-right{right:8%;top:auto;bottom:17%;width:72%;text-align:right}
 .story-caption--want{left:8%;top:13%;width:65%;text-align:left}
 .story-caption--create{right:8%;top:auto;bottom:17%;width:65%;text-align:right;font-size:clamp(48px,12vw,80px)}
 .story-caption--good-product{left:54%;right:auto;top:22%;width:38%;text-align:left;font-size:clamp(44px,11vw,72px)}
 .story-caption--sell{left:28.5%;top:25%;width:43%;text-align:center}
 .story-caption--rent{left:8%;right:8%;top:65%;font-size:clamp(34px,8vw,52px)}
 .story-caption--tools{left:8%;right:8%;top:70%;font-size:clamp(34px,8vw,52px)}
}
@media(max-height:550px) and (max-width:900px){
 .story-caption{font-size:28px}.story-caption--create,.story-caption--good-product{font-size:42px}
}

/* Open navigation: left-aligned identity and a persistent, adaptive backdrop. */
.hero-nav{
 --nav-panel:rgb(48 48 48 / 92%);--nav-hover:rgb(255 255 255 / 9%);--nav-current:rgb(255 255 255 / 15%);--nav-edge:rgb(255 255 255 / 10%);
 --nav-inset:calc(7.1vw + 16px);display:grid;grid-template-columns:1fr auto;align-items:center;gap:32px;
 top:16px;left:var(--nav-inset);right:calc(8.3vw + 16px);width:auto;height:auto;min-height:64px;padding:8px 0;
 border:0;border-radius:0;background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;
}
.hero-nav.nav-on-light{--nav-panel:rgb(246 246 246 / 96%);--nav-hover:rgb(0 0 0 / 5%);--nav-current:rgb(0 0 0 / 10%);--nav-edge:rgb(0 0 0 / 8%)}
.hero-nav .brand{grid-column:1;grid-row:1;justify-self:start;font-size:20px;font-weight:500;gap:9px}
.hero-nav .brand-logo{width:34px;height:34px;border-radius:var(--control-radius);overflow:hidden}
.hero-nav .nav-menu{display:flex;grid-column:2;grid-row:1;align-items:center;gap:24px}
.hero-nav .nav-links{display:flex;flex-direction:row;justify-content:flex-start;align-items:center;gap:8px;width:auto;position:static;transform:none}
.hero-nav .nav-links>a,.hero-nav .nav-dropdown summary{padding:10px 12px;font-size:16px;line-height:1.5;border-radius:8px;transition:background .18s}
.hero-nav .nav-links>a:hover,.hero-nav .nav-dropdown summary:hover,.hero-nav .nav-dropdown[open] summary{background:var(--nav-hover)}
.hero-nav .nav-dropdown summary{gap:8px}
.hero-nav .nav-dropdown summary span{display:grid;place-items:center;width:14px;height:14px;flex:0 0 14px;line-height:1}.hero-nav .nav-dropdown summary span svg{display:block;width:14px;height:14px}
.hero-nav .demo-link{background:#fff;color:#111;border:1px solid transparent;border-radius:8px;min-height:42px;padding:10px 22px;font-size:16px;line-height:1.3;transition:background .18s,opacity .18s}
.hero-nav.nav-on-light .demo-link{background:#111;color:#fff}
.hero-nav .demo-link:hover{opacity:.85}
.hero-nav .nav-dropdown-panel{top:calc(100% + 8px);left:0;min-width:256px;padding:8px;border:1px solid var(--nav-edge);border-radius:16px;background:var(--nav-panel);color:inherit;box-shadow:0 16px 40px #0002;backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px)}
.hero-nav .nav-dropdown-panel a{display:flex;align-items:center;gap:14px;padding:10px;border-radius:8px;color:inherit;font-size:16px;line-height:1.5}
.hero-nav .nav-dropdown-panel a:hover{background:var(--nav-hover)}
/* Keep route, pointer, and keyboard states visually distinct. In particular,
   a retained keyboard focus must not look like a second selected destination
   when the pointer moves to another item. */
.hero-nav .nav-dropdown-panel a[aria-current=page]{background:var(--nav-current);box-shadow:none}
.hero-nav .nav-dropdown-panel a:focus-visible{outline:2px solid var(--action-blue);outline-offset:-2px}
.woo-page .hero-nav{--nav-current:rgb(0 0 0 / 10%)}
.woo-page .hero-nav.nav-on-dark{--nav-current:rgb(255 255 255 / 15%)}
.nav-item-mark{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:6px;background:var(--nav-hover);font:400 20px/1 Georgia,serif;letter-spacing:-1px}
@media(min-width:1101px) and (max-width:1250px){.hero-nav{gap:16px}.hero-nav .nav-links{gap:0}.hero-nav .nav-links>a,.hero-nav .nav-dropdown summary{padding:10px 9px}}
@media(max-width:1100px){
 .hero-nav{grid-template-columns:1fr auto;gap:0;top:16px;--nav-inset:calc(7.1vw + 8px);left:var(--nav-inset);right:calc(8.3vw + 8px);width:auto;padding:8px 0;min-height:56px;border-radius:16px}
 .hero-nav .brand{grid-column:1;justify-self:start;font-size:20px}
 .hero-nav .menu-toggle{grid-column:2;grid-row:1}
 .hero-nav .nav-menu{display:none;grid-column:1/-1;grid-row:2;padding:16px 0 8px;max-height:calc(100vh - 120px);max-height:calc(100svh - 120px);overflow-y:auto}
 .hero-nav.menu-open{background:var(--nav-panel);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);box-shadow:0 16px 40px #0002}
 .hero-nav.menu-open .nav-menu{display:flex;gap:16px;flex-direction:column;align-items:stretch}
 .hero-nav .nav-links{display:flex;flex-direction:column;align-items:stretch;gap:4px}
 .hero-nav .nav-links>a,.hero-nav .nav-dropdown summary{padding:12px}
 .hero-nav .nav-dropdown-panel{position:static;min-width:0;margin:4px 0 8px;padding:4px;border:0;background:var(--nav-hover);box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none;border-radius:8px}
 .hero-nav .demo-link{align-self:stretch;text-align:center}
}
@media(prefers-reduced-motion:reduce){.hero-nav .nav-links>a,.hero-nav .nav-dropdown summary,.hero-nav .demo-link{transition:none}}

/* A bounded glass panel keeps the fixed navigation legible after the opening. */
.hero-nav,.hero-nav.nav-hidden{position:fixed;transform:none;pointer-events:auto}
.hero-nav::before{content:'';position:absolute;inset:0 -16px;z-index:-1;pointer-events:none;border:1px solid rgb(255 255 255 / 18%);border-radius:16px;background:rgb(20 20 20 / 80%);backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);opacity:0;transition:opacity .2s,background .2s,border-color .2s}
.hero-nav.nav-on-light::before{background:rgb(255 255 255 / 86%);border-color:rgb(0 0 0 / 12%)}
.hero-nav.nav-with-blur::before{opacity:1}
@media(max-width:1100px){.hero-nav::before{inset:0 -8px}.hero-nav.menu-open{background:none;box-shadow:none;backdrop-filter:none;-webkit-backdrop-filter:none}.hero-nav.menu-open::before{opacity:1}}
.story-tools-detail{display:block;margin:12px auto 0;max-width:540px;font:400 16px/1.5 Inter,Arial,sans-serif;letter-spacing:0;color:#c6c6c6;text-wrap:balance}
.story-caption--tools{top:83%}
@media(max-width:900px){.story-caption--tools{top:70%}.story-tools-detail{max-width:300px;margin-top:14px;line-height:1.65}}
@media(max-height:550px){.story-caption--tools{top:72%}.story-tools-detail{margin-top:6px;font-size:14px}}
@media(prefers-reduced-motion:reduce){.hero-nav::before{transition:none}}

/* One compact context tag for page and section headings. */
.section-tag{display:inline-flex;align-items:center;justify-content:center;gap:8px;width:max-content;max-width:100%;min-height:32px;box-sizing:border-box;padding:6px 10px;border:1px solid #d4d4d4;border-radius:8px;background:#f7f7f7;color:#111;font:400 12px/18px Inter,Arial,sans-serif;letter-spacing:0;text-transform:none;margin:0 0 20px;vertical-align:middle}
.section-tag::before{content:'';width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--action-blue)}
.section-tag--dark{background:#1c1c1c;border-color:#404040;color:#fff}
.section-tag-wrap,.section-heading{text-align:center}

/* Closing beat stays visible as the final video frame scrolls away. */
.story-caption--collapse{left:8%;right:8%;top:20%;font-size:clamp(44px,8vw,128px);line-height:1.08}
@media(max-width:900px){.story-caption--collapse{top:23%;font-size:clamp(34px,8.5vw,72px)}}
@media(max-height:550px) and (min-width:901px){.story-caption--collapse{top:22%;font-size:clamp(44px,7vw,86px)}}

/* One closing section across the homepage, articles, demos and case studies. */
.footer-demo-intro{padding:140px 24px 24px;text-align:center}
.footer-demo-intro .section-title{margin:0 auto 36px;color:#fff}
.footer-demo-button{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:12px 24px;border:1px solid #fff;border-radius:var(--control-radius,8px);background:#fff;color:#111;text-decoration:none;font:400 16px/1.25 Inter,Arial,sans-serif;transition:background .15s ease}
.footer-demo-button:hover{background:#e6e6e6}
.footer-demo-button:focus-visible{outline:2px solid #4384fa;outline-offset:5px}
@media(max-width:760px){.footer-demo-intro{padding:88px 24px 20px}.footer-demo-intro .section-title{font-size:40px;margin-bottom:28px}.footer-demo-button{min-height:48px}}

/* Comparison cards follow the reference's balanced type and undistorted artwork. */
.context-board .decision-cards{gap:clamp(36px,5vw,76px);align-items:stretch}
.context-board .decision-card{flex:0 1 340px;width:340px;min-width:0;min-height:408px;padding:36px 28px 28px;border:0;border-radius:36px;display:flex;flex-direction:column;align-items:center;box-shadow:0 8px 0 #53584b55,0 16px 24px #0000000d}
.context-board .card-kicker{font-size:16px;line-height:1.4;margin:0 0 12px;color:#777}
.context-board .decision-card h3{font-size:24px;line-height:1.18;font-weight:700;letter-spacing:-.025em;min-height:108px;width:100%;margin:0;text-wrap:balance}
.context-board .decision-card img{width:250px;max-width:100%;height:auto;aspect-ratio:auto;object-fit:contain;margin:20px auto 0;flex:none}
.context-board .regular-decision{transform:rotate(-4deg)}
.context-board .urumi-decision{transform:rotate(3deg)}
/* Keep the desktop comparison composition intact at phone widths. */
@media(max-width:760px){
 .context-board{container-type:inline-size;padding:36px 14px 26px}
 .context-board .decision-cards{flex-direction:row;gap:6cqw;align-items:stretch}
 .context-board .decision-card{flex:1 1 0;width:0;min-width:0;min-height:0;padding:4.5cqw 3.5cqw 3.5cqw;border-radius:5cqw;box-shadow:0 3px 0 #53584b55,0 8px 12px #0000000d}
 .context-board .card-kicker{font-size:clamp(8px,2.8cqw,16px);line-height:1.4;margin-bottom:2cqw;white-space:nowrap}
 .context-board .decision-card h3{font-size:clamp(11px,4cqw,22px);line-height:1.18;min-height:19cqw;letter-spacing:-.025em}
 .context-board .decision-card img{width:32cqw;max-width:100%;height:auto;margin-top:3cqw}
 .context-board .memory-context{margin-top:8cqw;font-size:clamp(10px,3.5cqw,16px)}
 .context-board .memory-context p{margin-bottom:3cqw}
 .context-board .memory-context ul{flex-wrap:nowrap;gap:1.5cqw}
 .context-board .memory-context li{font-size:clamp(8px,2.8cqw,13px);padding:2cqw 2cqw;white-space:nowrap;border-radius:30px}
}

/* A compact closing scene, with navigation restored when the footer leaves view. */
.hero-nav{transition:transform .28s ease,color .2s ease,opacity .2s ease,visibility .2s}
.hero-nav.nav-at-footer{opacity:0;visibility:hidden;pointer-events:none;transform:translateY(-12px)}
.footer-art{aspect-ratio:1920/580}
.campaign-scan{position:absolute;inset:0;z-index:2;pointer-events:none;overflow:hidden}
.campaign-scan canvas{display:block;width:100%;height:100%}
@media(prefers-reduced-motion:reduce){.hero-nav{transition:none}.campaign-scan{display:none}}

/* Keep the outgoing native document visible until the next one can paint in
   browsers with cross-document view-transition support. Unsupported browsers
   retain ordinary link navigation. */
@view-transition{navigation:auto}
::view-transition-group(root){animation-duration:.18s;animation-timing-function:ease-out}
@media(prefers-reduced-motion:reduce){::view-transition-group(root){animation:none}}

/* Shared header lock-up: keep the mark subordinate to the name without
   changing the header's hit-area or the footer/card brand treatments. */
.hero-nav .brand{display:inline-flex;align-items:center;gap:8px;min-height:42px;font-family:Inter,Arial,sans-serif;font-size:20px;font-weight:700;line-height:1;letter-spacing:-.025em;text-decoration:none;font-synthesis:weight;color:#fff;background:linear-gradient(180deg,#fff 0 58%,#b8c0ca 100%)}
.hero-nav .brand-logo{width:48px;height:48px;align-self:center;flex:0 0 48px;filter:drop-shadow(0 1px 0 rgb(198 214 235 / 34%))}
.hero-nav .brand-mark-sheen{position:relative;display:grid;place-items:center;width:48px;height:48px;flex:0 0 48px;overflow:hidden;border-radius:0}
.hero-nav .brand-mark-sheen>.brand-logo{width:100%;height:100%;flex:0 0 auto}
.hero-nav.nav-on-light .brand-logo{filter:drop-shadow(0 1px 0 rgb(255 255 255 / 72%))}
.hero-nav.nav-on-light .brand{color:#121416;background-image:linear-gradient(180deg,#121416 0 58%,#69707a 100%)}
@supports ((-webkit-background-clip:text) or (background-clip:text)){.hero-nav .brand{-webkit-background-clip:text;background-clip:text;color:transparent}}
.hero-nav .brand-mark-sheen::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;opacity:0;background:linear-gradient(108deg,transparent 37%,rgb(219 229 241 / 8%) 43%,rgb(255 255 255 / 88%) 49%,rgb(219 229 241 / 18%) 55%,transparent 61%);mix-blend-mode:screen;transform:translateX(-120%);animation:brand-mark-sheen 6s cubic-bezier(.3,.05,.25,1) infinite}
@keyframes brand-mark-sheen{0%,68%{opacity:0;transform:translateX(-120%)}70%{opacity:.9}90%{opacity:.9;transform:translateX(120%)}92%,100%{opacity:0;transform:translateX(120%)}}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){.hero-nav .brand-mark-sheen{transition:transform .18s ease-out}.hero-nav .brand-mark-sheen:hover{transform:translateY(-2px)}}
@media(max-width:1100px){.hero-nav .brand-mark-sheen{width:44px;height:44px;flex-basis:44px}.hero-nav .brand-logo{width:44px;height:44px;flex-basis:44px}}
@media(max-width:760px){.hero-nav .brand{gap:8px;font-size:19px}}
@media(prefers-reduced-motion:reduce){.hero-nav .brand-mark-sheen::after{animation:none;opacity:0}}

/* Give the complete wordmark room around its curved letter bottoms. */
.site-footer .footer-wordmark{padding:0 24px 28px}
.site-footer .footer-brand>p{max-width:340px;font-size:20px;line-height:1.5;color:#d4d4d4;margin:20px 0 24px;text-wrap:pretty}
@media(max-width:760px){.site-footer .footer-wordmark{padding:0 12px 20px}.site-footer .footer-brand>p{font-size:18px;max-width:320px}}

/* Responsive video scenes read as one centred thought, not opposite corners. */
.hero-title .hero-title-mobile,.story-caption--mobile{display:none}
@media(max-width:900px){
 .hero-title .welcome,.hero-title .future{display:none}
 .hero-title .hero-title-mobile{display:block;left:6%;right:6%;top:17%;width:auto;white-space:normal;text-align:center;font-size:clamp(36px,8.4vw,64px);line-height:1.02;letter-spacing:-.035em;text-wrap:balance}
 .hero-title-mobile em{line-height:1.02}
 .hero-title .hero-title-mobile .hero-gmv{font-size:clamp(10px,2.7vw,13px);line-height:1.5;max-width:none;margin:16px auto 0}
 .opening .flame-media{position:absolute;left:50%;top:28%;width:min(190vw,90vh);width:min(190vw,90svh);height:auto;aspect-ratio:16/9;object-fit:contain;object-position:center;transform:translateX(-50%);translate:none}
 /* Clear the fixed AI report button and its mascot so the strip and the CTA
    never stack into what reads as a second, inline CTA. */
 .opening .hero-trust{bottom:max(12%,calc(160px + env(safe-area-inset-bottom,0px)));width:min(420px,calc(100% - 64px))}
 .story-caption--opening-left,.story-caption--opening-right,.story-caption--want,.story-caption--create,.story-caption--good-product{display:none}
 .story-caption--mobile{display:block;left:8%;right:8%;width:auto;top:auto;bottom:17%;text-align:center;font-size:clamp(30px,7.8vw,52px);line-height:1.08;text-wrap:balance;letter-spacing:-.025em}
 .story-caption--mobile-products{bottom:19%;font-size:clamp(36px,9vw,60px)}
 .story-caption--collapse{left:8%;right:8%;top:50%;bottom:auto;width:auto;translate:0 -50%;font-size:clamp(36px,8.5vw,64px);line-height:1.08;text-align:center;text-wrap:balance}
}
@media(max-width:900px) and (max-height:550px){
 .hero-title .hero-title-mobile{top:20%;font-size:clamp(30px,7vh,40px);font-size:clamp(30px,7svh,40px)}
 .hero-title .hero-title-mobile .hero-gmv{font-size:10px;margin-top:8px}
 .opening .flame-media{top:34%;width:85vh;width:85svh}
 .opening .hero-trust{bottom:8%;width:min(300px,calc(100% - 64px))}
 .hero-trust .trusted-heading{margin-bottom:0}.hero-trust .client-group{padding-block:4px}
 .story-caption--mobile{font-size:28px}.story-caption--mobile-products,.story-caption--collapse{font-size:36px}
}

/* The mobile footer goes directly from the film to useful navigation. */
.footer-socials-mobile{display:none}
@media(max-width:760px){
 .site-footer .footer-brand{display:none}
 .site-footer .footer-content{padding:28px 6% 24px;gap:0}
 .site-footer .footer-socials-mobile{display:flex;gap:10px;margin:18px 0 0;align-items:center}
 .site-footer .footer-socials-mobile :is(a,span){display:grid;place-items:center;width:24px;height:24px;margin:0}
 .site-footer .footer-socials-mobile svg{width:18px;height:18px}
 .site-footer .footer-copyright{padding:20px 6% calc(20px + env(safe-area-inset-bottom,0px));font-size:12px;line-height:1.5}
 .floating-report.floating-report.report-above-copyright{bottom:calc(80px + env(safe-area-inset-bottom,0px))}
}

/* Keep capped portrait heights from shrinking the image column on mobile. */
@media(max-width:760px){
 .customer-story .founder-portrait{width:100%;justify-self:stretch}
 .customer-story .founder-portrait>img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;object-position:center 24%}
}

/* Mobile menu: lock the page behind it while it is open. Scrolling over the open menu used to
   scroll the page underneath (and run the homepage scroll story behind it). The lock goes on
   body, not html: body's overflow then still propagates to the viewport, so body never becomes
   its own scroll container and position:sticky elements (the homepage stage) stay pinned.
   Primary touch pointers only (pointer:coarse), where scrollbars overlay the page, so locking
   cannot shift the layout; touch laptops driven by a mouse keep the old behaviour. The menu
   keeps its own scroll and no longer hands overscroll to the page. */
@media (pointer:coarse){body:has(.hero-nav.menu-open){overflow:hidden}}
.hero-nav .nav-menu{overscroll-behavior:contain}
