html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:100px}body{min-width:0}*,*:before,*:after{box-sizing:border-box}img,video,iframe{max-width:100%}button,input,select,textarea{font:inherit}button,a,summary,select{-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,select{min-height:44px}a,button,p,h1,h2,h3,li{overflow-wrap:break-word}select{font-size:16px} [data-site-shell="header"]{position:sticky;top:0;z-index:30}.language-control{display:flex;align-items:center;gap:7px;flex:none}.language-control select{max-width:116px;border:1px solid var(--line);border-radius:6px;background:#fff;color:var(--ink);padding:8px 24px 8px 9px}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.languages button{border:0;background:transparent;color:var(--muted);font-size:.88rem;padding:8px 5px;cursor:pointer}.languages button[aria-pressed="true"]{color:var(--copper);text-decoration:underline;text-underline-offset:5px;font-weight:600}.languages{gap:12px}.menu-demo{display:none}.locale-notice{font:14px/1.5 "Avenir Next",sans-serif;padding:12px 24px;background:#fafafa;color:#45413e;border-bottom:1px solid #ddd}.locale-notice[hidden]{display:none}.nav{gap:22px}.navlinks{gap:22px}.navlinks a,.menu{min-height:44px}.wrap{max-width:1240px}.product-panel>*{min-width:0}.tabs{min-width:0}.tab{min-width:0}.tab span{display:block}.record-row>*{min-width:0}.button{white-space:normal;text-align:center}.cta .actions{flex-shrink:0}table{max-width:100%}
@media(max-width:1100px){.nav{gap:14px}.navlinks{gap:14px}.navlinks a{font-size:.88rem}.language-control select{max-width:102px}}
@media(max-width:900px){.nav{height:72px}.navlinks{top:72px;padding:12px 24px 20px;max-height:calc(100dvh - 72px);overflow-y:auto;overscroll-behavior:contain;box-shadow:0 5px 8px #00000012}.navlinks a{font-size:1rem;display:flex;align-items:center}.menu-demo{display:flex!important}.nav>.button{display:none}.language-control{margin-left:auto}.menu{min-width:60px}.nav .brand{margin-right:0}.wrap{width:calc(100% - 40px)}.hero{padding-top:36px;gap:28px}.hero .intro{margin:20px 0 24px}.section{padding:56px 0}.footer-grid{gap:28px}.cta{padding:30px;gap:26px}.hero-film{padding:18px}.product-panel{gap:30px}.pricing-grid{grid-template-columns:1fr}.price-card{display:flex;flex-direction:column}.price-card .purpose{min-height:0}.price span{display:inline}.footer-bottom{flex-wrap:wrap}.languages{flex-wrap:wrap}}
@media(max-width:600px){.wrap{width:calc(100% - 32px)}.hero h1{font-size:clamp(2rem,8.8vw,2.7rem);line-height:1.14}.hero h1 br{display:none}.hero h1 span{display:block}.hero h1 span br{display:block}.hero .intro{font-size:1rem;line-height:1.65}.hero .actions{display:grid;grid-template-columns:1fr;width:100%}.hero .actions .button{width:100%}.fine{margin-top:14px}.tabs{gap:12px}.tab strong{font-size:1rem}.tab span{font-size:.8rem;line-height:1.45}.tab{padding:14px 0}.product-panel{grid-template-columns:1fr}.record{padding:18px}.record-row{gap:12px;flex-wrap:wrap}.record-row span{flex:1 1 100px}.record-row b{flex:1 1 140px}.color-visual{padding:16px;min-height:0}.color-visual img{height:auto;max-height:440px;max-width:100%;object-fit:contain}.workspace,.conversation{padding:18px}.section h2{font-size:clamp(1.7rem,7.5vw,2.2rem)}.product-copy h3{font-size:1.8rem}.story .wrap{gap:28px}.steps li{gap:14px}.bundle{padding:22px}.cta{padding:24px;margin-bottom:45px}.cta .actions{flex-direction:column;min-width:0;width:100%}.cta .button{width:100%;white-space:normal}.footer-grid{column-gap:22px}.footer-col a{min-height:44px;display:flex;align-items:center}.footer-brand p{max-width:100%}.footer-bottom{gap:12px}.languages{gap:7px 13px}.film-heading{line-height:1.5}.film-fallback{line-height:1.5}.review,.local-review-note{font-size:.73rem;line-height:1.5}.faq details p{padding-right:10px}}
@media(max-width:360px){.nav{gap:8px}.language-control select{max-width:103px}.menu{padding:8px 10px}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.tabs{gap:8px}.tab strong{font-size:.92rem}.tab span{font-size:.75rem}}
@media(orientation:landscape) and (max-height:520px){.nav{height:60px}.brand img{width:38px;height:38px}.navlinks{top:60px;max-height:calc(100dvh - 60px)}.hero{padding:28px 0;grid-template-columns:1fr 1fr;gap:28px;align-items:center}.hero h1{font-size:2rem}.hero .intro{font-size:.95rem}.hero .actions{gap:8px}.hero .button{font-size:.84rem;padding:10px 12px}.hero-film{padding:14px}.film-heading{display:block}.film-label{display:block}.hero-film figcaption{font-size:.8rem}.section{padding:42px 0}.product-panel{grid-template-columns:1fr 1fr;gap:24px}.product-copy h3{font-size:1.8rem}.color-visual{padding:16px;min-height:0}.color-visual img{max-height:320px;width:auto}.cta{padding:28px}.footer-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.footer-brand{grid-column:1/-1}.footer-bottom{flex-direction:row;flex-wrap:wrap}}
/* Contain legacy content within small screens instead of hiding overflow. */
@media(max-width:900px){body>.pgw,body>.tr-wrap,body>.wrap,body>main{max-width:100%;min-width:0} .pgw,.tr-wrap{width:calc(100% - 32px)!important;margin-left:auto!important;margin-right:auto!important;padding-left:0!important;padding-right:0!important}.tr-card{width:100%!important;max-width:100%!important}input,textarea,select{max-width:100%}pre{white-space:pre-wrap;overflow-wrap:anywhere}.tr-hero h1{font-size:clamp(2rem,6vw,3rem)!important}.tr-form{min-width:0}.tr-row{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}
.language-control select{width:128px;max-width:128px}
@media(max-width:900px){.hero-grid{grid-template-columns:minmax(0,1fr)!important}.hero-grid>*{min-width:0;max-width:100%}.hero>.wrap{padding-left:0;padding-right:0}.hero .btn{white-space:normal;text-align:center;max-width:100%}.pv-table{table-layout:fixed;width:100%}.pv-table th,.pv-table td{overflow-wrap:anywhere;white-space:normal!important}.grid2,.grid3{min-width:0}.tr-row>*{min-width:0}}
@media(max-width:360px){.language-control select{width:120px;max-width:120px}}
@media(max-width:900px){html:not([data-page="index"]) .wrap{padding-left:0!important;padding-right:0!important}.dv-sys,.dv-nd{min-width:0!important;max-width:100%!important}}

/* Header refinement and copper palette taken from the supplied logo. */
:root,:host{--copper:#B5502E;--copper-dark:#9E482B;--button-copper:#D9874B;--button-ink:#2D2019}
.button{background:var(--button-copper);color:var(--button-ink)}
.button:hover{background:#CE7944;color:var(--button-ink)}
.button.secondary{background:transparent;color:var(--ink)}
.button.secondary:hover{background:var(--soft)}
.nav{display:flex;align-items:center;gap:24px;flex-wrap:nowrap}
.nav .brand{flex:none;margin-right:auto;display:flex;align-items:center}
.nav .brand img{display:block;width:180px;height:auto}
.navlinks{align-items:center;gap:24px;white-space:nowrap}
.navlinks a{display:flex;align-items:center;line-height:1.25;white-space:nowrap}
.nav>.button{white-space:nowrap;line-height:1.25;flex:none}
.menu{margin-left:auto;flex:none}
/* Legacy page buttons use the same copper treatment. */
.btn-g{background:#D9874B!important;color:#2D2019!important}
.btn-g:hover{background:#CE7944!important;color:#2D2019!important}
@media(min-width:901px) and (max-width:1100px){.nav{gap:18px}.navlinks{gap:16px}.nav .brand img{width:152px}.navlinks a{font-size:.84rem}.nav>.button{padding:12px 16px;font-size:.84rem}}
@media(max-width:900px){.nav .brand img{width:46px;height:46px}.nav .brand{margin-right:auto}.navlinks{align-items:stretch;white-space:normal}.navlinks a{white-space:normal}.menu{margin-left:auto}}
@media(max-width:600px){.nav .brand img{width:44px;height:44px}}
@media(orientation:landscape) and (max-height:520px) and (max-width:900px){.nav .brand img{width:38px;height:38px}}

@media(min-width:901px){.navlinks .menu-demo{display:none!important}}

/* A larger, film-first hero with one clear title. */
html[data-page="index"] .hero{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:42px}
html[data-page="index"] .hero h1{font-size:clamp(2.4rem,4.4vw,4.1rem)}
.hero-film{background:transparent;padding:0;max-width:none;width:100%;animation:none}
.film-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 14px;font-size:1.05rem;line-height:1.4;font-weight:600}
.film-duration{font-size:.85rem;color:var(--muted);font-weight:400;flex:none}
.film-frame{position:relative;border-radius:12px;overflow:hidden;background:#222}
.film-frame video{display:block;width:100%;aspect-ratio:16/9;object-fit:contain}
.film-play{position:absolute;inset:0;width:100%;height:100%;border:0;border-radius:0;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:13px;color:white;background:linear-gradient(0deg,rgba(0,0,0,.38),rgba(0,0,0,.08));font-weight:600;font-size:1rem;text-shadow:0 1px 3px #000;transition:background .2s}
.film-play[hidden],.film-error[hidden]{display:none}
.play-circle{display:grid;place-items:center;width:74px;height:74px;border-radius:50%;background:white;color:#B5502E;font-size:27px;padding-left:4px;text-shadow:none;transition:transform .2s}
.film-play:hover .play-circle{transform:scale(1.07)}.film-play:focus-visible{outline:3px solid white;outline-offset:-7px}
.film-error{display:block;margin-top:12px;font-size:.9rem;text-decoration:underline}
@media(max-width:900px){html[data-page="index"] .hero{grid-template-columns:1fr;gap:30px}.hero-film{max-width:720px}.film-heading{font-size:1rem}.hero-film{padding:0}}
@media(max-width:600px){html[data-page="index"] .hero h1{font-size:clamp(2rem,8.8vw,2.7rem)}.film-heading{font-size:.95rem;gap:12px}.play-circle{width:58px;height:58px;font-size:22px}.film-play{font-size:.9rem;gap:10px}}
@media(orientation:landscape) and (max-height:520px) and (max-width:900px){html[data-page="index"] .hero{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:26px}html[data-page="index"] .hero h1{font-size:2rem}.film-heading{font-size:.9rem}.hero-film{padding:0}}

/* Approved film: right-hand column on desktop and wide phones. */
html[data-page="index"] .hero>*{min-width:0}
.film-heading{display:flex!important}.hero-film{min-width:0}.film-frame video:fullscreen{object-fit:contain;background:#000;width:100%;height:100%}
@media(min-width:901px){html[data-page="index"] .hero-film{grid-column:2;grid-row:1;align-self:center}}
@media(max-width:600px){html[data-page="index"] .hero{grid-template-columns:minmax(0,1fr);gap:24px}.hero-film{margin:0;max-width:100%}.film-frame{border-radius:10px}.film-heading{align-items:center}.hero .actions .button{min-height:48px}}
@media(orientation:landscape) and (min-width:640px) and (max-width:900px) and (max-height:520px){html[data-page="index"] .hero{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr)}.hero-film{grid-column:2;grid-row:1}}

.cl-viz .cl-scrim,.cl-viz .cl-readout{pointer-events:none}.cl-viz .cl-readout{bottom:64px}

/* Readable mobile page introductions and consistent side gutters. */
.page-intro{padding-top:8px;padding-bottom:32px}.page-intro h1{font-size:clamp(2rem,5vw,3rem);line-height:1.15;margin:0 0 14px;letter-spacing:-.025em}.page-intro p{color:#69625d;line-height:1.6;margin:0}
@media(max-width:900px){.dm-wrap,.pv-wrap{width:calc(100% - 40px)!important;max-width:760px;padding-left:0!important;padding-right:0!important;margin-inline:auto!important}.crumb{padding-top:28px!important;margin-top:0!important;padding-bottom:20px!important}.page-intro{padding-bottom:28px}.hero h1 .sw{display:inline}.dm-hero p,.pv-hero p{line-height:1.65}.dm-hero{padding-top:12px!important}.pv-body{padding-top:12px!important}}

.software-hub{padding-block:64px}.software-hub h1{font-size:clamp(2.2rem,4.5vw,3.6rem);line-height:1.12;margin:16px 0 24px}.hub-intro{max-width:620px;color:#69625d}.hub-cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin:40px 0}.hub-cards article{padding:28px;border:1px solid #e5ddd7;border-radius:12px}.hub-cards h2,.hub-help h2{font-size:1.4rem;line-height:1.3}.hub-cards p{color:#69625d;font-size:1rem;line-height:1.7}.hub-cards .text-link{font-size:.95rem}.hub-help{padding:28px;background:#faf3ee;border-radius:12px}.hub-help .button{margin-top:12px}@media(max-width:700px){.software-hub{padding-block:32px}.hub-cards{grid-template-columns:1fr;gap:16px;margin:28px 0}.hub-cards article{padding:24px}}

/* ── One page measure (2026-09-21) ─────────────────────────────────────────
   The home page sits on a 1240px column; the inner pages kept the old site's
   1080px column with up to 80px of side padding, so the header and content
   jumped ~85px inwards when moving between pages. Inner pages now use the home
   page's column. Deliberately narrow blocks (forms, article text) keep their
   own max-width inside it. */
html:not([data-page="index"]){--container:1240px;--gutter:0px}
html:not([data-page="index"]) body .wrap,
html:not([data-page="index"]) body .pgw{width:min(1240px,calc(100% - 96px));max-width:1240px;margin-inline:auto;padding-left:0;padding-right:0;box-sizing:border-box}
@media(max-width:900px){html:not([data-page="index"]) body .wrap,html:not([data-page="index"]) body .pgw{width:calc(100% - 40px)}}
@media(max-width:600px){html:not([data-page="index"]) body .wrap,html:not([data-page="index"]) body .pgw{width:calc(100% - 32px)}}

/* Journal posts: the 720px article column only needs side padding once the screen is narrower than the column. */
@media(max-width:720px){html:not([data-page="index"]) article.art{--gutter:20px}}
@media(max-width:600px){html:not([data-page="index"]) article.art{--gutter:16px}}
