/* ScreenSoft corporate identity 1.0 - integrated website theme, v175. */
@font-face{font-family:Rubik;src:url('../fonts/Rubik-Variable.woff') format('woff');font-weight:300 900;font-style:normal;font-display:swap}
@font-face{font-family:'IBM Plex Sans';src:url('../fonts/IBMPlexSans-Variable.woff') format('woff');font-weight:100 700;font-style:normal;font-display:swap}
:root,:root[data-theme='light']{
 --canvas:#FBFCFE;--surface:#FFFFFF;--sunk:#F1F6FA;--ink:#011E4C;--body:#3A4256;--muted:#596B80;--rule:#DCE5EE;
 --deep:#08152A;--deep2:#11243E;--deep3:#011E4C;--navy:#011E4C;--blue:#0073B8;--blue-br:#0099F5;--glow:#6BCFFF;--tint:#EDF6FC;
 --on-deep:#FFFFFF;--on-deep-mut:#C5D3E4;--action:#0073B8;--action-hover:#005D95;--on-action:#FFFFFF;
 --lt-solid:0;--dk-solid:1;--mk:url('../media/brand/SVG/ScreenSoft-Symbol-Flat.svg');--markmask:none;--oct:none;
 --doorA:linear-gradient(150deg,#FFFFFF,#EDF6FC);--doorA-bd:#DCE5EE;color-scheme:light;
}
:root[data-theme='dark']{
 --canvas:#08152A;--surface:#11243E;--sunk:#0C1C32;--ink:#FFFFFF;--body:#C5D3E4;--muted:#A8BCD4;--rule:#2C405C;
 --navy:#FFFFFF;--blue:#6BCFFF;--tint:#11243E;--lt-solid:1;--dk-solid:0;--doorA:linear-gradient(150deg,#11243E,#0C1C32);--doorA-bd:#2C405C;color-scheme:dark;
}
/* Dark editorial sections retain their contrast in either page theme. */
.hero,.phero,.dark,footer.site,.lead,.order-home-section{
 --ink:#FFFFFF;--body:#C5D3E4;--blue:#6BCFFF;--navy:#FFFFFF;--muted:#C5D3E4;
 --surface:#11243E;--tint:#11243E;--rule:#2C405C;--on-deep:#FFFFFF;--on-deep-mut:#C5D3E4;
}
body{background:var(--canvas);color:var(--body)}
button,input,select,textarea{font-family:'IBM Plex Sans',system-ui,sans-serif}
code,pre{font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
h1,h2,h3,h4{font-family:Rubik,'IBM Plex Sans',sans-serif}
.btn:not(.ghost):not(.outline),.hero-cinema-copy .hero-cta .ss-try-cta,.ss-fs-btn-primary,.flow-result,.ss-fs-end a,.ss-fs-promo a{
 background:var(--action);color:var(--on-action);border-color:var(--action);box-shadow:0 7px 20px -12px rgba(0,115,184,.4);animation:none;
}
.btn:not(.ghost):not(.outline):hover,.hero-cinema-copy .hero-cta .ss-try-cta:hover{background:var(--action-hover);filter:none}
.btn.outline{background:transparent;color:var(--blue);border-color:var(--blue)}
.btn::before{content:'→';width:auto;height:auto;background:none;mask:none;-webkit-mask:none;font:500 17px/1 'IBM Plex Sans',sans-serif}
.heromark{filter:none;animation:none}
.markwrap::after{display:none}
.markwrap{animation:none;opacity:1;transform:none}
.hold{clip-path:none;border-radius:12px}
.sc .play{clip-path:none;border-radius:14px}
.shead .oct,.tile .oct{width:36px;height:36px}
.crumb .oct{mask:none;-webkit-mask:none;width:6px;height:6px;border-radius:50%}
.checks .oct{mask:none;-webkit-mask:none;background:none;width:18px;height:22px}
.checks .oct::before{content:'✓';font-size:18px;line-height:1}
footer.site{background:#08152A;color:#C5D3E4}
.fbrand img{width:240px;height:auto;max-width:100%}
/* The full logo retains at least 200 px of visible artwork. Small headers use the symbol. */
header.site .brand{display:block;width:238px;height:56px;flex:none}
header.site .brand img{width:238px;height:auto;max-width:none;max-height:none}
header.site .brand .brand-symbol{display:none}
header.site .hrow{padding:8px 0;gap:12px}
.hero{padding-top:126px}
.phero{padding-top:126px}
@media(min-width:1151px){header.site .brand img{width:238px;max-width:none;max-height:none}header.site nav.main{gap:clamp(6px,.9vw,15px);font-size:clamp(11px,.82vw,13px)}}
@media(max-width:600px){header.site .brand{width:60px;height:60px}header.site .brand .lt,header.site .brand .dk{display:none!important}header.site .brand .brand-symbol{display:block!important;width:60px;height:60px;opacity:1}header.site .hdrtools{margin-left:auto}.hero,.phero{padding-top:110px}}
/* First-setup has an intentional solid header, including at scroll position zero. */
body.ss-first-setup-page #hdr{background:var(--canvas)!important;box-shadow:0 1px 0 var(--rule)!important}
body.ss-first-setup-page #hdr .main,body.ss-first-setup-page #hdr .main button,body.ss-first-setup-page #hdr .main a,body.ss-first-setup-page #hdr .hrow{color:var(--body)!important}
body.ss-first-setup-page #hdr .brand .lt{display:block!important;opacity:var(--lt-solid)}
body.ss-first-setup-page #hdr .brand .dk{display:block!important;opacity:var(--dk-solid)}
body.ss-first-setup-page #hdr .hdrtools>*{color:var(--blue);border-color:var(--rule);background:var(--tint)}
@media(max-width:600px){body.ss-first-setup-page #hdr .brand .lt,body.ss-first-setup-page #hdr .brand .dk{display:none!important}}
.ss-fs{background:var(--canvas);color:var(--body)}
.ss-fs-demo,.ss-fs-promo{background:var(--surface);border-color:var(--rule)}
.ss-fs-image{background:var(--tint)}
.ss-fs-copy h2,.ss-fs-end h2{color:var(--ink)}
.ss-fs-copy p,.ss-fs-head p,.ss-fs-caption{color:var(--body)}
.ss-fs-head .ss-fs-eyebrow,.ss-fs-count{color:var(--blue)}
.ss-fs-btn:not(.ss-fs-btn-primary){background:var(--surface);color:var(--ink);border-color:var(--rule)}
.home-benefits-v107-panel,.hero.hero-cinema-layout>.home-benefits-v107-panel{background:var(--surface);border-color:var(--rule)}
.home-benefits-v107-item,.home-benefits-v107-item h2{color:var(--ink)}
.home-benefits-v107-item p{color:var(--body)}
.home-benefits-v107-icon{color:var(--blue)}
.home-benefits-v107-item+.home-benefits-v107-item{border-color:var(--rule)}
/* The benefits panels sit over a dark hero but are light in the default page theme. */
:root:not([data-theme='dark']) .home-benefits-v107{--surface:#FFFFFF;--ink:#011E4C;--body:#3A4256;--blue:#0073B8;--rule:#DCE5EE}
:focus-visible{outline:3px solid var(--blue);outline-offset:4px}
.brand-page{padding-top:115px}
.brand-intro{padding:40px 0 56px}
.brand-intro h1{max-width:900px}
.brand-intro .sub{max-width:72ch}
.brand-section{padding:42px 0;border-top:1px solid var(--rule)}
.brand-section h2{font-size:clamp(24px,3vw,36px);margin-bottom:22px}
.brand-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px}
.brand-card{border:1px solid var(--rule);border-radius:16px;overflow:hidden;background:var(--surface)}
.brand-preview{min-height:210px;display:flex;align-items:center;justify-content:center;padding:32px;background:#FFFFFF}
.brand-preview.is-dark{background:#08152A}
.brand-preview img{width:min(100%,390px);height:auto}
.brand-preview.is-vertical img{width:230px}
.brand-preview.is-symbol img{width:132px}
.brand-caption{padding:20px 24px}
.brand-caption h3{font-size:18px;margin-bottom:10px}
.brand-downloads{display:flex;flex-wrap:wrap;gap:10px 20px}
.brand-downloads a,.brand-rules a{color:var(--blue);text-decoration:underline;text-underline-offset:4px}
.brand-palette{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.brand-swatch{border:1px solid var(--rule);border-radius:12px;overflow:hidden;background:var(--surface)}
.brand-swatch-color{height:90px}.brand-swatch p{padding:13px 16px;display:grid;gap:3px}.brand-swatch code{font-size:13px}
.brand-rules{max-width:880px}.brand-rules li{margin:12px 0}
.brand-bundles{display:flex;gap:14px;flex-wrap:wrap;margin-top:25px}
.brand-version{margin-top:22px;color:var(--muted);font-size:14px}
@media(max-width:700px){.brand-grid{grid-template-columns:1fr}.brand-palette{grid-template-columns:repeat(2,minmax(0,1fr))}.brand-preview{min-height:175px;padding:22px}.brand-intro{padding-top:25px}}
@media(prefers-reduced-motion:reduce){.markwrap,.heromark{animation:none}}
/* Clean controls: preserve explicit arrows in the existing content. */
.btn::before{display:none}
.ss-brand-page header.site{background:var(--canvas);border-bottom:1px solid var(--rule)}
.ss-brand-page header.site .brand .lt{opacity:var(--lt-solid)}
.ss-brand-page header.site .brand .dk{opacity:var(--dk-solid)}
.ss-brand-page header.site nav.main,.ss-brand-page header.site .drop{color:var(--body)}
.ss-brand-page header.site .themetog,.ss-brand-page header.site .lgcur,.ss-brand-page header.site .burger{background:var(--tint);border-color:var(--rule);color:var(--blue)}
.brand-swatch code{overflow-wrap:anywhere}
/* Page-specific panels share the same light/dark roles. */
.ss-fs-promo h2{color:var(--ink)}
.ss-fs-promo p,.partner-focus p,.partner-focus .partner-engagement-caption{color:var(--body)}
.v101-service,.retail100-features{background:var(--sunk)}
.retail100-features .feat{background:var(--surface);border-color:var(--rule)}
.partner-focus .partner-focus-grid>div:first-child>p{color:var(--body)}
.partner-focus .partner-mobile-benefit{background:var(--surface);color:var(--ink);border-color:var(--rule)}
.v101-service-lead,.v101-service-point b{color:var(--ink)}
.v101-service-desc,.v101-service-point span{color:var(--body)}
.v101-service-point{background:var(--surface);border-color:var(--rule)}
.retail100-navigation,.retail100-benefits{background:var(--sunk);border-color:var(--rule)}
.retail100-subtitle,.retail100-navigation p,.retail100-benefits p{color:var(--body)}
/* Override the first-setup page's old fixed light-only header rules. */
body.ss-first-setup-page #hdr .brand{width:238px;height:56px}
body.ss-first-setup-page #hdr .brand img{width:238px;height:auto;max-width:none;max-height:none}
body.ss-first-setup-page #hdr .brand .lt{opacity:var(--lt-solid)!important}
body.ss-first-setup-page #hdr .brand .dk{opacity:var(--dk-solid)!important}
body.ss-first-setup-page #hdr .lgcur,body.ss-first-setup-page #hdr .themetog,body.ss-first-setup-page #hdr .burger{color:var(--blue)!important;background:var(--tint)!important;border-color:var(--rule)!important}
@media(max-width:600px){body.ss-first-setup-page #hdr .brand{width:60px;height:60px}body.ss-first-setup-page #hdr .brand .brand-symbol{width:60px;height:60px}body.ss-first-setup-page #hdr .brand .lt,body.ss-first-setup-page #hdr .brand .dk{display:none!important}}
body.ss-first-setup-page #hdr .hdrtools>.btn{background:var(--action);color:var(--on-action);border-color:var(--action)}
