/* Founder-approved centered connected-tools hero; fixed presentation canvases only. */
#hero.connected-hero{padding-top:36px;background:#FFF;overflow:hidden}#hero .hero-intro{text-align:center;max-width:none;margin:0 0 32px}#hero .hero-intro>div{width:100%}#hero .hero-intro h1{max-width:1100px;margin:0 auto;font-size:clamp(46px,4.7vw,68px);line-height:1.05;letter-spacing:-2.8px;font-weight:550}#hero .hero-intro h1 span{color:#58677F}#hero .hero-intro>div>p[data-copy]{max-width:790px;margin:22px auto 0;font-size:18px;line-height:1.6}#hero .hero-actions{justify-content:center;margin-top:23px;gap:24px}#hero .hero-actions .hero-cta{margin:0}#hero .hero-stage::after{display:none}
:is(#hero,#sources,#change) .native-stage-viewport{--canvas-height:640px;width:100%;max-width:1200px;height:var(--canvas-height);min-height:var(--canvas-height);max-height:var(--canvas-height);margin:0 auto;position:relative;overflow:hidden;overflow-anchor:none;border:1px solid #DCE5F1;border-radius:13px;background:linear-gradient(132deg,#F5F9FF 0%,#F0F4FD 55%,#F7F2FA 100%);box-shadow:inset 0 1px #FFF,0 18px 40px -22px #44618E35;isolation:isolate}
:is(#hero,#sources,#change) .native-stage-viewport::before{content:none;display:none}
:is(#hero,#sources,#change) .native-stage-viewport>.native-composition,:is(#hero,#sources,#change) .native-stage-viewport>.native-composition[data-secondary=false]{position:absolute;inset:24px;display:grid;grid-template-columns:minmax(0,1fr) minmax(290px,33%);gap:20px;min-height:0;height:calc(100% - 48px);width:auto;align-items:stretch;overflow:visible;margin:0}
:is(#hero,#sources,#change) .native-stage-viewport>.native-outgoing{z-index:3;pointer-events:none}
:is(#hero,#sources,#change) .native-primary,:is(#hero,#sources,#change) .native-composition[data-secondary=false]>.native-primary{position:relative;width:100%;height:100%;max-width:none;min-height:0;margin:0;padding:0;overflow:hidden;border-radius:7px}
:is(#hero,#sources,#change) .native-secondary{min-width:0;min-height:0;padding:22px 0 0;height:100%;max-height:100%;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#BAC9DF transparent}
:is(#hero,#sources,#change) .native-primary>.browser-window{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden;box-shadow:0 1px 3px #20334D14,0 10px 20px -9px #20334D30;border-radius:7px}
:is(#hero,#sources,#change) .native-primary>.browser-window>.chrome-tabs,:is(#hero,#sources,#change) .native-primary>.browser-window>.chrome-address{flex:none}
:is(#hero,#sources,#change) .native-primary :is(.gemini-layout,.gemini-main,.gmail-layout,.gmail-thread,.monday-layout,.hubspot-layout){display:flex;flex-direction:column;flex:1;min-height:0;box-sizing:border-box}
:is(#hero,#sources,#change) .native-primary :is(.gemini-conversation,.monday-main,.gmail-thread-content,.hubspot-activity,.record-main){min-height:0;flex:1;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#BAC9DF transparent}
:is(#hero,#sources,#change) .native-primary :is(.gemini-header,.gemini-thread-title,.gemini-composer-zone,.gmail-header,.gmail-toolbar,.gmail-subject,.gmail-thread>.native-context,.monday-top,.hubspot-top){flex:none}
:is(#hero,#sources,#change) .native-primary .gemini-conversation{min-height:0!important}
:is(#hero,#sources,#change) .native-primary .hubspot-content{flex:1;min-height:0;overflow:hidden}
:is(#hero,#sources,#change) .native-primary .hubspot-contact{min-height:0;overflow:auto;scrollbar-width:thin}
:is(#hero,#sources,#change) .native-primary>.record-shell{height:100%;min-height:0;display:flex;flex-direction:column;overflow:hidden}
:is(#hero,#sources,#change) .native-secondary>.browser-window,:is(#hero,#sources,#change) .native-secondary>.native-outcome{max-height:100%;overflow:auto;scrollbar-width:thin;overscroll-behavior:contain;box-shadow:0 2px 4px #20334D0D,0 12px 22px -9px #5C477536}
:is(#hero,#sources,#change) .native-secondary .native-device{--phone-width:240px;width:240px;max-width:100%;margin:0 auto}
:is(#hero,#sources,#change) .native-secondary .phone-scene{height:100%;overflow:hidden}
:is(#hero,#sources,#change) .native-primary :focus-visible,:is(#hero,#sources,#change) .native-secondary:focus-visible{outline:2px solid #245BE8;outline-offset:-3px}
/* Hero has one centered primary throughout all four existing-tool chapters. */
#hero .native-stage-viewport{--canvas-height:550px;max-width:1160px;background:radial-gradient(ellipse at 17% 20%,#E2EDFFB0,transparent 55%),linear-gradient(120deg,#F8FBFF,#F3EEFA)}#hero .native-stage-viewport>.native-composition,#hero .native-stage-viewport>.native-composition[data-secondary=false]{inset:24px 92px;height:calc(100% - 48px);grid-template-columns:minmax(0,1fr);gap:0}#hero .native-secondary{display:none}#hero .hero-story-controls{max-width:1160px;margin:10px auto 0;display:flex;align-items:center;justify-content:space-between;gap:18px}#hero .native-phases{gap:18px;margin:0}#hero .native-phases button{font-size:12px;min-height:44px;padding:10px 0;color:#617187}#hero .native-phases button[aria-selected=true]{color:#245BE8}#hero .native-playback{padding:10px 0;min-width:44px}#hero .native-primary .chrome-address{min-height:29px;padding-top:3px;padding-bottom:3px}#hero .native-primary .gemini-header{padding:10px 18px;min-height:42px}#hero .native-primary .gemini-thread-title{padding:7px 18px 0}#hero .native-primary .gemini-conversation{padding:12px 18px 4px}#hero .native-primary .gemini-composer-zone{padding:3px 18px 13px}#hero .native-primary .native-message{margin-bottom:14px}#hero .native-primary .native-message p{font-size:15px;line-height:1.6}#hero .native-primary .gmail-email p{font-size:15px;line-height:1.6;margin-top:10px;margin-bottom:17px}#hero .native-primary .gmail-subject{padding-top:10px;padding-bottom:13px}#hero .native-primary .gmail-toolbar{padding-top:7px;padding-bottom:7px}#hero .native-primary .monday-main{padding-top:15px}#hero[data-phase=hero-current] .monday-row [data-field=time]{background:#EAF2FD;color:#294B82;font-weight:550}
.hero-tool-tokens{position:absolute;inset:0;pointer-events:none}.hero-tool-token{position:absolute;width:43px;height:43px;display:flex;align-items:center;justify-content:center;border-radius:10px;background:#FFFFFFD9;border:1px solid #D9E4F1;box-shadow:0 5px 12px #39588914;opacity:.55;transition:opacity 320ms,border-color 320ms}.hero-tool-token img{width:24px;height:24px;object-fit:contain}.hero-tool-token[data-channel=gemini]{left:18px;top:42px}.hero-tool-token[data-channel=gmail]{right:17px;top:113px}.hero-tool-token[data-channel=sms]{right:17px;bottom:45px;border-bottom:2px solid #D78267}.hero-tool-token[data-channel=monday]{left:15px;bottom:88px;width:60px}.hero-tool-token[data-channel=monday] img{width:61px;height:auto;clip-path:inset(29% 6% 20% 6%)}#hero[data-channel=gemini] [data-channel=gemini],#hero[data-channel=gmail] [data-channel=gmail],#hero[data-channel=sms] [data-channel=sms],#hero[data-channel=monday] [data-channel=monday]{opacity:1;border-color:#AABFE7}
/* Shared Messages content remains native-sized, in a focused conversation pane. */
#hero .phone-scene{height:100%;max-width:none;width:100%;margin:0}#hero .hero-sms-surface{height:100%;border:1px solid #D5DEE9;border-radius:7px;background:#FFF;overflow:hidden;box-shadow:0 2px 4px #20334D0D,0 10px 24px -10px #20334D36}#hero .hero-sms-surface .sms-thread{height:100%;min-height:0;display:flex;flex-direction:column}#hero .hero-sms-surface .sms-contact{position:relative;min-height:62px;display:flex;align-items:center;justify-content:center;flex:none;border-bottom:1px solid #E3E7ED;background:#FAFAFC;padding:8px 16px}#hero .hero-sms-surface .sms-contact-person{display:flex;align-items:center;gap:8px}#hero .hero-sms-surface .contact-k{display:grid;place-items:center;width:29px;height:29px;background:#858E99;color:#FFF;border-radius:50%;font-size:16px}#hero .hero-sms-surface .sms-contact strong{font-size:14px;font-weight:500;color:#202938}#hero .hero-sms-surface .sms-back{position:absolute;left:16px;color:#1671D9}#hero .hero-sms-surface .sms-video{position:absolute;right:16px;color:#1671D9}#hero .hero-sms-surface .sms-video svg{width:22px;height:22px}#hero .hero-sms-surface .sms-chat{flex:1;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-width:thin;padding:14px 22px;background:#FFF}#hero .hero-sms-surface .sms-stamp{font-size:12px;text-align:center;color:#617187;margin-bottom:14px}#hero .hero-sms-surface .ios-line{max-width:100%;margin-bottom:13px}#hero .hero-sms-surface .sms-sender{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}#hero .hero-sms-surface :is(.sms-bubble,.sms-reply){font-size:15px;line-height:1.55;padding:10px 13px;max-width:78%;width:fit-content;border-radius:17px 17px 17px 5px;background:#E9E9EB;color:#202938;animation:none;box-shadow:none;margin:0}#hero .hero-sms-surface .sms-reply{margin-left:auto;background:#207D38;color:#FFF;border-radius:17px 17px 5px 17px}#hero .hero-sms-surface .sms-compose{min-height:44px;padding:6px 16px 12px;display:flex;align-items:center;gap:9px;color:#838D9C;background:#FFF;flex:none;border:0;border-radius:0;margin:0}#hero .hero-sms-surface .sms-compose>div{display:flex;align-items:center;justify-content:space-between;border:1px solid #D3DCE8;border-radius:20px;min-height:30px;padding:4px 12px;flex:1;font-size:14px}#hero .hero-sms-surface .sms-plus{font-size:22px}#hero .hero-sms-surface .sms-compose svg{width:17px;height:17px}
@media(min-width:741px) and (max-width:1100px){:is(#sources,#change) .native-stage-viewport>.native-composition,:is(#sources,#change) .native-stage-viewport>.native-composition[data-secondary=false]{grid-template-columns:minmax(0,1fr) 290px;gap:16px;inset:20px;height:calc(100% - 40px)}}
@media(min-width:741px) and (max-height:780px){#hero.connected-hero{padding-top:25px}#hero .hero-intro{margin-bottom:25px}#hero .hero-intro h1{font-size:clamp(46px,4.55vw,64px)}#hero .hero-intro>div>p[data-copy]{margin-top:17px;font-size:17px;line-height:1.5}#hero .hero-actions{margin-top:18px}#hero .native-stage-viewport{--canvas-height:510px}:is(#sources,#change) .native-stage-viewport{--canvas-height:590px}}
@media(max-width:740px){#hero.connected-hero{padding-top:30px}#hero .hero-intro{margin-bottom:25px}#hero .hero-intro h1{font-size:38px;line-height:1.08;letter-spacing:-1.65px}#hero .hero-intro>div>p[data-copy]{font-size:16px;line-height:1.6;margin-top:20px}#hero .hero-actions{gap:8px 22px;margin-top:20px}#hero .hero-actions .hero-cta{font-size:13px!important}#hero .hero-story-controls{display:block;margin-top:8px}#hero .native-phases{gap:16px;justify-content:center}#hero .native-playback{display:block;margin:0 auto}#hero .native-stage-viewport{--canvas-height:505px}#hero .native-stage-viewport>.native-composition,#hero .native-stage-viewport>.native-composition[data-secondary=false]{inset:14px;height:calc(100% - 28px)}.hero-tool-tokens{display:none}#hero .native-primary .native-message p,#hero .native-primary .gmail-email p{font-size:14px;line-height:1.55}#hero .native-primary .gemini-conversation{padding:12px 13px 4px}#hero .native-primary .gemini-composer-zone{padding-inline:13px}#hero .hero-sms-surface .sms-chat{padding:13px}#hero .hero-sms-surface :is(.sms-bubble,.sms-reply){font-size:14px;max-width:94%}
:is(#sources,#change) .native-stage-viewport{--canvas-height:690px;border-radius:9px}:is(#sources,#change) .native-stage-viewport>.native-composition,:is(#sources,#change) .native-stage-viewport>.native-composition[data-secondary=false]{inset:14px;display:block;height:calc(100% - 28px);min-height:0}:is(#sources,#change) .native-primary{height:100%;width:100%}:is(#sources,#change) .native-secondary{position:absolute;left:12px;right:0;bottom:12px;width:calc(100% - 12px);height:220px;padding:0;max-height:220px;overflow:auto;z-index:2;border-radius:6px;box-shadow:0 0 0 5px #F1F5FC,0 10px 20px #394E7526;background:#FFF}:is(#sources,#change) .native-composition[data-secondary=true] .native-primary :is(.gemini-layout,.gmail-layout,.monday-layout,.hubspot-layout){padding-bottom:244px}:is(#sources,#change) .native-primary .hubspot-content{display:flex;flex-direction:column}:is(#sources,#change) .native-primary .hubspot-contact{flex:none;padding:10px 13px;overflow:hidden}:is(#sources,#change) .native-primary .hubspot-contact dl{margin:0}:is(#sources,#change) .native-secondary>.native-outcome{box-shadow:none;max-height:none}:is(#sources,#change) .native-secondary .phone-scene{height:100%;max-width:none}:is(#sources,#change) .native-secondary kambra-device.smsFragment{height:100%;max-height:100%;margin:0;width:100%;border:0;box-shadow:none}:is(#sources,#change) .native-secondary .phoneFrame__screen{height:100%}:is(#sources,#change) .native-secondary .phoneFrame__content{flex:1;min-height:0}:is(#sources,#change) .native-secondary .sms-chat{overflow:auto;min-height:0;flex:1}:is(#sources,#change) .native-secondary .sms-contact{min-height:52px;padding-block:5px}:is(#sources,#change) .native-secondary .sms-compose{min-height:30px;height:30px;margin-bottom:7px}:is(#sources,#change) .native-secondary .sms-stamp{margin-bottom:8px}:is(#sources,#change) .native-secondary .monday-outcome>header{padding:8px 12px}:is(#sources,#change) .native-secondary .monday-outcome>.native-context{padding:8px 12px 0;margin-bottom:5px}:is(#sources,#change) .native-secondary .monday-crop-title{padding:3px 12px 8px}:is(#sources,#change) .native-secondary .monday-crop-title h3{font-size:16px}:is(#sources,#change) .native-secondary .monday-crop-row,:is(#sources,#change) .native-secondary .monday-crop-fields{padding:8px 12px;grid-template-columns:1fr 1fr;gap:9px}:is(#sources,#change) .native-secondary .monday-outcome .native-open{display:none}}
@media(max-width:360px){#hero .hero-intro h1{font-size:35px}#hero .hero-intro>div>p[data-copy]{font-size:16px}#hero .native-phases{gap:7px 15px}#hero .native-phases button{font-size:12px}#hero .native-stage-viewport{--canvas-height:530px}:is(#sources,#change) .native-secondary{left:6px;width:calc(100% - 6px)}}
@media(max-width:740px){:is(#hero,#sources,#change) .monday-row [data-field=time]{white-space:nowrap;padding-inline:4px}:is(#hero,#sources,#change) .monday-row{grid-template-columns:minmax(72px,1.1fr) minmax(74px,1fr) minmax(60px,.7fr)}}
/* A full native shell stays anchored; supporting evidence uses its right interior. */
@media(min-width:741px){
 :is(#sources,#change) .native-stage-viewport>.native-composition,:is(#sources,#change) .native-stage-viewport>.native-composition[data-secondary=false]{display:block}
 :is(#sources,#change) .native-secondary{position:absolute;right:0;top:0;bottom:0;width:33%;z-index:2}
 :is(#sources,#change) .native-composition[data-secondary=true] .native-primary :is(.gemini-layout,.gmail-layout,.monday-layout,.hubspot-layout){padding-right:calc(33% + 20px)}
}
/* Reuse the same channel references in safe desktop intro gutters. */
#hero.connected-hero{position:relative;background:radial-gradient(ellipse 240px 230px at 2% 12%,#E9F1FF9E,transparent),radial-gradient(ellipse 250px 240px at 98% 18%,#EFE7FA94,transparent),radial-gradient(ellipse 140px 140px at 96% 31%,#F9E6DD66,transparent),#FFF}
#hero>.hero-tool-tokens .hero-tool-token[data-channel=gemini]{left:max(24px,calc(50% - 654px));top:64px}
#hero>.hero-tool-tokens .hero-tool-token[data-channel=gmail]{right:max(24px,calc(50% - 654px));top:72px}
#hero>.hero-tool-tokens .hero-tool-token[data-channel=sms]{right:max(24px,calc(50% - 654px));top:205px;bottom:auto}
#hero>.hero-tool-tokens .hero-tool-token[data-channel=monday]{left:max(18px,calc(50% - 660px));top:192px;bottom:auto}
@media(max-width:1199px){#hero>.hero-tool-tokens{display:none}}
/* Final founder direction: no decorative backing plane at any breakpoint. */
:is(#hero,#sources,#change) .native-stage-viewport{border-color:transparent;background:radial-gradient(ellipse at 50% 55%,#EDF3FC66,transparent 70%);box-shadow:none}
:is(#hero,#sources,#change) .native-stage-viewport::before{content:none;display:none;border:0;background:none;transform:none}
/* Final founder spacing: preserve type and fixed internal canvas geometry. */
#hero.connected-hero{padding-top:42px}
#hero .hero-intro{margin-bottom:60px}
#hero .hero-intro>div>p[data-copy]{margin-top:28px}
#hero .hero-actions{margin-top:32px}
@media(min-width:741px) and (max-height:780px){#hero.connected-hero{padding-top:32px}#hero .hero-intro>div>p[data-copy]{margin-top:25px}#hero .hero-actions{margin-top:28px}}
@media(max-width:740px){#hero.connected-hero{padding-top:36px}#hero .hero-intro{margin-bottom:38px}#hero .hero-intro>div>p[data-copy]{margin-top:24px}#hero .hero-actions{margin-top:26px}}
@media(prefers-reduced-motion:reduce){.hero-tool-token{transition:none!important}}
