:root{ --bg:#ffffff;--surface:#f8f9fb;--surface-2:#f3f4f7;--text:#252a33;--muted:#69707d; --line:#e4e7ec;--dark:#090b0f;--accent:#ff6a37;--accent-2:#ff315f;--accent-3:#ffb522; --gradient:linear-gradient(135deg,var(--accent-3) 0%,var(--accent) 45%,var(--accent-2) 100%); --radius:22px;--radius-sm:14px;--container:1240px;--shadow:0 24px 70px rgba(22,26,35,.10); --space-section-y:clamp(84px,7.5vw,112px);--space-page-x:clamp(20px,3.2vw,48px); --space-hero-y:clamp(72px,6.5vw,104px);--space-grid:clamp(18px,2.1vw,28px); } *{box-sizing:border-box} html{scroll-behavior:smooth} body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--text);background:var(--bg);line-height:1.6;-webkit-font-smoothing:antialiased} img{max-width:100%;height:auto;display:block} a{color:inherit;text-decoration:none} button{font:inherit} .container{width:min(var(--container),calc(100% - (var(--space-page-x) * 2)));margin-inline:auto} .section{padding:var(--space-section-y) 0} .section-grid-bg{position:relative;overflow:hidden;background-image:linear-gradient(rgba(37,42,51,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(37,42,51,.055) 1px,transparent 1px);background-size:82px 82px} .section-grid-bg:after{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.3),rgba(255,255,255,.92) 66%,#fff 100%)} .site-header{height:84px;display:flex;align-items:center;position:sticky;top:0;background:rgba(255,255,255,.90);backdrop-filter:blur(16px);z-index:80;border-bottom:1px solid rgba(228,231,236,.8)} .nav-shell{height:100%;display:flex;align-items:center;justify-content:space-between;gap:26px} .brand img{width:142px;height:auto} .desktop-nav{display:flex;align-items:center;gap:28px;font-size:14px;font-weight:650} .desktop-nav>a,.nav-item>button{transition:.25s} .desktop-nav>a:hover,.nav-item>button:hover{color:var(--accent)} .nav-item{position:relative} .nav-item>button{border:0;background:none;color:var(--text);font-weight:650;cursor:pointer;padding:30px 0} .mega-menu{display:grid;grid-template-columns:repeat(5,minmax(145px,1fr));gap:24px;position:absolute;top:68px;left:50%;transform:translate(-42%,12px);width:min(920px,80vw);padding:26px;background:#fff;border:1px solid var(--line);border-radius:20px;box-shadow:var(--shadow);opacity:0;visibility:hidden;transition:.22s;pointer-events:none} .mega-menu.compact{grid-template-columns:repeat(2,minmax(210px,1fr));width:520px} .has-mega:hover .mega-menu,.has-mega:focus-within .mega-menu{opacity:1;visibility:visible;transform:translate(-42%,0);pointer-events:auto} .mega-col{display:flex;flex-direction:column;gap:9px}.mega-col>span{font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.12em;color:var(--muted);margin-bottom:4px}.mega-col a{font-size:13px;color:#3f4651}.mega-col a:hover{color:var(--accent)} .nav-actions{display:flex;align-items:center;gap:8px} .btn{display:inline-flex;align-items:center;justify-content:center;gap:9px;min-height:44px;padding:0 20px;border-radius:999px;font-weight:750;font-size:14px;transition:transform .25s ease,box-shadow .25s ease,background .25s ease;border:1px solid transparent} .btn:hover{transform:translateY(-2px)} .btn-primary{background:var(--gradient);color:#16181d;box-shadow:0 12px 30px rgba(255,91,55,.22)} .btn-secondary{background:#fff;border-color:var(--line);color:var(--text)} .btn-secondary:hover{box-shadow:0 12px 28px rgba(32,36,44,.08)} .btn-ghost{padding-inline:14px}.btn-light{background:#fff;color:#111}.btn-large{min-height:54px;padding:0 27px;font-size:15px} .menu-toggle{display:none;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:#fff;padding:11px;cursor:pointer}.menu-toggle span{display:block;height:2px;background:#222;margin:4px 0} .mobile-menu{display:none} .hero{min-height:800px;display:flex;align-items:center;padding:70px 0 95px} .hero-inner{position:relative;z-index:2;display:grid;grid-template-columns:.93fr 1.07fr;align-items:center;gap:58px} .hero-glow{position:absolute;border-radius:50%;filter:blur(0);opacity:.20;z-index:1}.glow-one{width:520px;height:520px;background:radial-gradient(circle,var(--accent-3),transparent 68%);left:-220px;bottom:-260px}.glow-two{width:460px;height:460px;background:radial-gradient(circle,var(--accent-2),transparent 70%);right:-210px;top:-180px} .eyebrow{display:inline-flex;align-items:center;gap:8px;border:1px solid var(--line);background:rgba(255,255,255,.84);border-radius:999px;padding:8px 13px;font-size:12px;font-weight:750;letter-spacing:.02em;box-shadow:0 8px 24px rgba(0,0,0,.04)}.eyebrow.muted{background:var(--surface);box-shadow:none}.eyebrow.tiny{font-size:10px;padding:6px 9px}.pulse-dot{width:8px;height:8px;border-radius:50%;background:var(--gradient);box-shadow:0 0 0 5px rgba(255,91,55,.10)} .hero h1,.inner-hero h1{font-size:clamp(52px,6.3vw,90px);line-height:.99;letter-spacing:-.055em;margin:24px 0 24px;max-width:820px}.gradient-text{background:var(--gradient);-webkit-background-clip:text;background-clip:text;color:transparent} .hero-copy>p{font-size:18px;color:var(--muted);max-width:630px;margin:0}.hero-actions{display:flex;gap:12px;margin-top:30px;flex-wrap:wrap}.trust-row{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.trust-row span{font-size:12px;color:var(--muted);padding-right:10px}.trust-row span:not(:last-child){border-right:1px solid var(--line)} .product-stage{position:relative;background:#0c0f14;border:1px solid #1c222c;border-radius:28px;box-shadow:0 34px 90px rgba(16,20,28,.20);padding:12px;transform:perspective(1200px) rotateY(-4deg) rotateX(2deg);transition:.4s}.product-stage:hover{transform:perspective(1200px) rotateY(-1deg) rotateX(0)} .stage-topbar{height:34px;display:flex;align-items:center;gap:6px;color:#9299a5;font-size:10px;padding:0 8px}.stage-topbar span{width:8px;height:8px;border-radius:50%;background:#323945}.stage-topbar strong{margin-left:8px;font-weight:600}.dashboard-shell{display:grid;grid-template-columns:58px 1fr;min-height:455px;background:#11151b;border:1px solid #242b35;border-radius:20px;overflow:hidden;color:#f2f4f7}.dash-side{padding:12px 10px;background:#0b0e13;display:flex;flex-direction:column;align-items:center;gap:16px}.mini-logo{width:30px;height:30px;border-radius:10px;background:var(--gradient);display:grid;place-items:center;color:#15171b;font-weight:900}.dash-side i{width:22px;height:22px;border-radius:7px;background:#202630}.dash-main{padding:22px}.dash-head{display:flex;justify-content:space-between;align-items:center}.dash-head small{display:block;color:#7f8794}.dash-head b{display:block;font-size:18px}.dash-head button{background:#1a2029;border:1px solid #2a323d;color:#d9dde3;border-radius:9px;padding:7px 10px}.metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}.metric-grid>div{background:#171c24;border:1px solid #262e39;border-radius:14px;padding:15px}.metric-grid small{display:block;color:#8d95a3}.metric-grid b{font-size:22px}.trend{float:right;color:#ff9a52;font-size:10px;margin-top:9px}.dash-columns{display:grid;grid-template-columns:1.25fr .75fr;gap:12px}.chart-card,.people-card{background:#171c24;border:1px solid #262e39;border-radius:14px;padding:15px}.chart-head{display:flex;justify-content:space-between;color:#d9dde3;font-size:12px}.chart-head span{color:#7f8794}.bars{height:160px;display:flex;align-items:flex-end;gap:7px;padding-top:18px}.bars i{flex:1;min-width:6px;border-radius:5px 5px 2px 2px;background:linear-gradient(180deg,#ffb522,#ff315f)}.people-card>b{font-size:12px}.people-card>div{display:flex;align-items:center;gap:8px;padding:10px 0;border-bottom:1px solid #262e39}.people-card>div:last-child{border:0}.avatar{width:28px;height:28px;border-radius:50%;background:var(--gradient);color:#16181d;font-size:9px;font-weight:900;display:grid;place-items:center;flex:0 0 auto}.people-card p{margin:0;flex:1}.people-card strong,.people-card small{display:block;font-size:10px}.people-card small{color:#7d8591}.people-card em{font-style:normal;font-size:10px;color:#ff9b57}.floating-card{position:absolute;background:#fff;border:1px solid var(--line);border-radius:14px;padding:12px 16px;box-shadow:0 16px 40px rgba(16,20,28,.14);display:flex;flex-direction:column}.floating-card small{color:var(--muted);font-size:10px}.floating-card b{font-size:14px}.floating-a{left:-34px;top:110px}.floating-b{right:-36px;bottom:55px} .intro-row{display:grid;grid-template-columns:1.1fr .9fr;gap:80px;align-items:end;margin-bottom:42px}.intro-row h2,.section-copy h2,.section-heading h2,.final-cta h2{font-size:clamp(36px,4.1vw,58px);line-height:1.05;letter-spacing:-.045em;margin:14px 0 0}.intro-row p,.section-heading p,.section-copy>p{color:var(--muted);font-size:17px}.feature-grid{display:grid;gap:18px}.feature-grid.four{grid-template-columns:repeat(4,1fr)}.feature-grid.three{grid-template-columns:repeat(3,1fr)}.feature-card{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:28px;min-height:255px;display:flex;flex-direction:column;transition:.3s;position:relative;overflow:hidden}.feature-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.feature-card.featured{background:linear-gradient(145deg,#fff7ed,#fff1f5);border-color:#ffd8c6}.feature-card .icon,.bento .icon,.visual-board>.icon{width:32px;height:32px;color:var(--accent);margin-bottom:34px}.feature-card h3{font-size:20px;margin:0 0 10px}.feature-card p{color:var(--muted);font-size:14px;margin:0}.feature-card>span{margin-top:auto;padding-top:22px;font-size:12px;font-weight:750} .soft-section{background:var(--surface)}.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}.section-copy{max-width:560px}.check-list{list-style:none;padding:0;margin:25px 0}.check-list li{padding:9px 0 9px 28px;position:relative;color:#454c57}.check-list li:before{content:"✓";position:absolute;left:0;color:var(--accent);font-weight:900}.text-link{font-weight:800;font-size:14px}.visual-board{background:#fff;border:1px solid var(--line);border-radius:28px;padding:30px;box-shadow:var(--shadow);min-height:350px}.visual-title{display:flex;justify-content:space-between;margin-bottom:28px}.visual-title span{font-size:11px;padding:4px 8px;background:#fff2e8;border-radius:999px;color:#e75d2e}.timeline-row{display:grid;grid-template-columns:52px 1fr 120px;gap:16px;align-items:center;margin:17px 0}.timeline-row span,.timeline-row strong{font-size:11px}.timeline-row i{height:11px;border-radius:999px;background:var(--gradient)}.timeline-row i.mid{width:65%}.timeline-row i.short{width:35%;background:#dfe3e8}.timeline-row i.alt{background:linear-gradient(90deg,#ff315f,#ff9a52)} .section-heading{margin-bottom:42px}.section-heading.centered{text-align:center;max-width:780px;margin-left:auto;margin-right:auto}.section-heading.centered p{max-width:650px;margin:16px auto 0}.bento-grid{display:grid;grid-template-columns:1.1fr 1fr 1fr;grid-template-rows:auto auto;gap:18px}.bento{background:#fff;border:1px solid var(--line);border-radius:var(--radius);padding:26px;min-height:210px}.bento.tall{grid-row:span 2}.bento.wide{grid-column:span 2;display:flex;justify-content:space-between;align-items:center}.bento .icon{margin-bottom:20px}.bento h3{margin:0 0 10px}.bento p{color:var(--muted);font-size:14px}.status-list{display:flex;flex-direction:column;gap:13px;margin-top:28px}.status-list span{display:grid;grid-template-columns:12px 1fr auto;align-items:center;gap:8px;font-size:13px}.status-list i{width:8px;height:8px;border-radius:50%}.online{background:#31c775}.warn{background:#ffb522}.break{background:#ff6a37}.off{background:#b8bdc7}.accent-stat{background:var(--dark);color:#fff;display:flex;flex-direction:column;justify-content:flex-end}.accent-stat strong{font-size:48px;line-height:1}.accent-stat span,.accent-stat small{color:#a9b0bb} .dark-band{background:#080a0e;color:#fff} .analytics-visual{display:flex;align-items:center;justify-content:center;gap:34px;background:#101318;border-radius:28px;padding:48px;color:#fff;min-height:350px}.ring{width:170px;height:170px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;background:conic-gradient(#ff6a37 0 72%,#ff315f 72% 81%,#272d35 81%);position:relative}.ring:after{content:"";position:absolute;inset:17px;background:#101318;border-radius:50%}.ring span,.ring small{position:relative;z-index:2}.ring span{font-size:36px;font-weight:850}.ring small{color:#939aa5}.analytics-stack{display:flex;flex-direction:column;gap:12px}.analytics-stack span{background:#1b2028;border:1px solid #2d343e;border-radius:12px;padding:12px 18px}.analytics-stack b,.analytics-stack small{display:block}.analytics-stack small{font-size:10px;color:#88919e}.note{border-left:3px solid var(--accent);padding-left:14px;font-size:14px!important}.final-cta-section{padding:100px 0}.final-cta{position:relative;z-index:2;text-align:center;max-width:820px}.final-cta p{color:var(--muted);font-size:17px;max-width:650px;margin:18px auto 26px}.final-cta>div{display:flex;justify-content:center;gap:12px;flex-wrap:wrap} .inner-hero{padding:115px 0 105px}.inner-hero-content{position:relative;z-index:2;text-align:center;max-width:940px}.inner-hero h1{margin-inline:auto}.inner-hero p{max-width:720px;margin:0 auto;color:var(--muted);font-size:18px}.inner-hero .hero-actions{justify-content:center}.mini-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:40px}.mini-stat-grid span{padding:17px;background:var(--surface);border-radius:14px}.mini-stat-grid b,.mini-stat-grid small{display:block}.mini-stat-grid small{color:var(--muted);font-size:10px} .site-footer{background:#f6f7f9;border-top:1px solid var(--line);padding:70px 0 24px}.footer-grid{display:grid;grid-template-columns:1.5fr repeat(4,1fr);gap:42px}.footer-grid>div{display:flex;flex-direction:column;gap:10px}.footer-grid h3{font-size:12px;text-transform:uppercase;letter-spacing:.08em;margin:0 0 6px}.footer-grid a,.footer-grid p{font-size:13px;color:var(--muted);margin:0}.footer-brand img{width:145px;margin-bottom:8px}.footer-bottom{border-top:1px solid var(--line);margin-top:50px;padding-top:22px;display:flex;justify-content:space-between;color:#8a919d;font-size:12px} @media(max-width:1080px){.desktop-nav{gap:16px}.hero-inner{grid-template-columns:1fr}.hero-copy{text-align:center}.hero-copy>p{margin-inline:auto}.hero-actions,.trust-row{justify-content:center}.product-stage{max-width:780px;margin:0 auto}.feature-grid.four{grid-template-columns:repeat(2,1fr)}.footer-grid{grid-template-columns:1.2fr repeat(2,1fr)}} @media(max-width:820px){.desktop-nav,.login-link{display:none}.menu-toggle{display:block}.nav-actions{margin-left:auto}.mobile-menu{position:absolute;top:84px;left:0;right:0;background:#fff;border-bottom:1px solid var(--line);padding:16px 24px 24px;flex-direction:column;gap:2px}.mobile-menu.open{display:flex}.mobile-menu a{padding:12px 4px;border-bottom:1px solid var(--line);font-weight:650}.section{padding:var(--space-section-y) 0}.hero{min-height:auto;padding-top:72px}.split,.intro-row{grid-template-columns:1fr;gap:38px}.feature-grid.three,.bento-grid{grid-template-columns:1fr 1fr}.bento.tall{grid-row:auto}.bento.wide{grid-column:span 2}.chat-ui{grid-template-columns:105px 1fr}.footer-grid{grid-template-columns:1fr 1fr}.footer-brand{grid-column:span 2}} @media(max-width:620px){.container{width:min(var(--container),calc(100% - (var(--space-page-x) * 2)))}.site-header{height:74px}.mobile-menu{top:74px}.brand img{width:124px}.nav-actions>.btn-primary{display:none}.hero h1,.inner-hero h1{font-size:clamp(42px,13.5vw,64px)}.hero-inner{gap:42px}.product-stage{transform:none;padding:8px;border-radius:20px}.floating-card{display:none}.dashboard-shell{grid-template-columns:42px 1fr;min-height:380px}.dash-side{padding-inline:6px}.dash-main{padding:12px}.metric-grid{grid-template-columns:1fr 1fr}.metric-grid>div:nth-child(3){display:none}.dash-columns{grid-template-columns:1fr}.people-card{display:none}.bars{height:130px}.feature-grid.four,.feature-grid.three,.bento-grid{grid-template-columns:1fr}.bento.wide{grid-column:auto;display:block}.bento.wide .btn{margin-top:16px}.intro-row h2,.section-copy h2,.section-heading h2,.final-cta h2{font-size:36px}.communication-split{min-height:auto}.chat-ui{grid-template-columns:1fr}.chat-sidebar{display:none}.analytics-visual{flex-direction:column;padding:32px}.footer-grid{grid-template-columns:1fr}.footer-brand{grid-column:auto}.footer-bottom{flex-direction:column;gap:8px}.hero-actions .btn{width:100%}.final-cta>div .btn{width:100%}} @media(prefers-reduced-motion:reduce){*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}} /* Worklix refined header, mega menu and Hubstaff-style banners */ :root{--accent:#ffb800;--accent-2:#ff8a1f;--accent-3:#ffe071;--gradient:linear-gradient(90deg,#ffd84d 0%,#ffb800 30%,#ff8a1f 70%,#ff5b52 100%)} body{background:#fff} .top-announcement{height:42px;background:linear-gradient(90deg,#ffc928 0%,#ffb800 42%,#ff8f4a 100%);color:#23262d;position:relative;z-index:100} .top-announcement-inner{height:42px;display:flex;align-items:center;justify-content:space-between;gap:20px;font-size:13px;font-weight:700} .top-announcement p{margin:0;display:flex;align-items:center;gap:9px}.top-announcement p span{padding:4px 8px;border-radius:999px;background:rgba(255,255,255,.35);font-size:10px;text-transform:uppercase;letter-spacing:.08em}.top-announcement a{font-size:12px;border-bottom:1px solid currentColor} .site-header{height:82px;top:0;position:sticky;background:rgba(255,255,255,.97);border-bottom:1px solid #eceef2;z-index:95;backdrop-filter:blur(14px)} .nav-shell{height:100%;display:flex;align-items:center;gap:34px}.brand{flex:0 0 auto}.brand img{width:145px;height:auto}.desktop-nav{display:flex;align-items:center;gap:29px;flex:1;margin-left:26px}.desktop-nav>a,.nav-item>button{font-size:14px;font-weight:700;color:#252a33;background:none;border:0;padding:29px 0;display:inline-flex;align-items:center;gap:6px;cursor:pointer}.nav-chevron{font-size:12px;line-height:1;transition:transform .2s}.has-mega:hover>.nav-chevron,.has-mega:focus-within>.nav-chevron{transform:rotate(180deg)}.nav-actions{display:flex;align-items:center;gap:18px}.login-link{font-size:14px;font-weight:700}.nav-start{min-width:112px} .nav-item{position:static}.mega-dropdown{position:absolute;left:0;right:0;top:82px;background:#fff;border-top:1px solid #eceef2;border-bottom:1px solid #e7eaf0;box-shadow:0 22px 55px rgba(23,28,38,.12);opacity:0;visibility:hidden;transform:translateY(7px);pointer-events:none;transition:.18s ease}.has-mega:hover .mega-dropdown,.has-mega:focus-within .mega-dropdown{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto}.mega-menu-inner{width:min(1340px,calc(100% - 64px));margin:0 auto;display:grid;grid-template-columns:250px minmax(0,1fr) 310px;min-height:510px}.mega-tabs{padding:28px 24px 28px 0;border-right:1px solid #eceef2;display:flex;flex-direction:column;gap:7px}.mega-tab{width:100%;min-height:56px;border:0;background:transparent;border-radius:11px;padding:0 16px;display:flex;align-items:center;justify-content:space-between;gap:10px;font-weight:750;font-size:14px;color:#232a36;cursor:pointer;text-align:left}.mega-tab:hover,.mega-tab.is-active{background:#fff7db;color:#b96f00}.mega-panels{padding:34px 38px}.mega-panel{display:none}.mega-panel.is-active{display:block}.mega-panel:first-child{display:block}.mega-panel-title{font-size:18px;font-weight:800;display:flex;align-items:center;gap:8px;padding-bottom:22px;border-bottom:1px solid #eceef2;margin-bottom:22px}.mega-feature-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px 28px}.mega-feature-link{min-height:96px;display:grid;grid-template-columns:40px minmax(0,1fr) 18px;gap:12px;align-items:start;padding:13px 0;color:#252a33}.mega-feature-link:hover strong{color:#c47a00}.mega-icon{width:38px;height:38px;border:1px solid #d9dde5;border-radius:10px;display:grid;place-items:center;color:#5a6271;background:#fff}.mega-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.mega-link-copy{min-width:0;display:block}.mega-link-copy strong{display:block;font-size:14px;line-height:1.3;margin:2px 0 5px}.mega-link-copy small{display:block;font-size:13px;line-height:1.45;color:#697180;font-weight:500}.mega-arrow{color:#ff9f00;font-size:20px;line-height:38px}.mega-cta{padding:38px 30px;background:#fff9e8;border-left:1px solid #f0e1b6}.mega-cta-kicker{font-size:12px;text-transform:uppercase;letter-spacing:.08em;font-weight:800;color:#9d6a00}.mega-cta h3{font-size:25px;line-height:1.1;margin:13px 0}.mega-cta p{color:#68707e;font-size:14px}.mega-cta>a{font-weight:800;font-size:14px;color:#aa6900;display:inline-flex;align-items:center;gap:8px;margin-top:12px}.mega-cta-card{margin-top:34px;border-radius:18px;background:linear-gradient(145deg,#ffd44c,#ff8c2f 65%,#ff5b52);padding:26px;color:#1f2329;min-height:170px;display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 18px 36px rgba(255,152,35,.23)}.mega-cta-card span{font-size:12px;font-weight:800}.mega-cta-card strong{font-size:24px;line-height:1.1;max-width:220px;margin:6px 0}.mega-cta-card small{font-size:12px} .hubstaff-hero,.hubstaff-inner-hero{background:linear-gradient(180deg,#fff 0%,#fff 65%,#fff8ec 100%);padding:var(--space-hero-y) 0;overflow:hidden}.hubstaff-hero-grid{display:grid;grid-template-columns:minmax(0,.94fr) minmax(520px,1.06fr);gap:64px;align-items:center}.hubstaff-hero-copy{position:relative;z-index:3}.hero-promo{display:inline-flex;align-items:center;gap:9px;padding:7px 11px 7px 8px;background:#f8f6f1;border-radius:999px;font-size:13px;font-weight:600;color:#3d4450}.hero-promo span{background:#fff;border:1px solid #ece7dd;padding:4px 8px;border-radius:999px;font-size:11px;font-weight:800}.hero-promo strong{font-size:16px;color:#c97900}.hubstaff-hero-copy h1{font-size:clamp(50px,5.7vw,82px);line-height:.985;letter-spacing:-.055em;margin:23px 0 19px;max-width:760px;color:#242a34}.hubstaff-hero-copy>p{font-size:18px;line-height:1.6;color:#4d5664;max-width:690px;margin:0}.hero-actions{display:flex;gap:12px;margin-top:28px}.hero-trust-points{display:flex;flex-wrap:wrap;gap:20px;margin-top:18px;font-size:13px;color:#59616d}.hero-trust-points span::first-letter{color:#ffad00}.typewriter-wrap{white-space:nowrap;color:#ff9f00;background:linear-gradient(90deg,#ffcb31,#ff9c12,#ff6a48);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.typewriter-word{display:inline}.typewriter-cursor{display:inline-block;width:3px;height:.86em;margin-left:4px;background:#ffb400;vertical-align:-.04em;animation:cursorBlink .75s steps(1) infinite}.hubstaff-hero-visual{position:relative;min-height:570px;display:flex;align-items:center;justify-content:flex-end;justify-self:end;width:100%;max-width:720px}.hero-pattern{position:absolute;inset:5% 0 2% 6%;border-radius:44% 56% 48% 52%/44% 46% 54% 56%;background:radial-gradient(circle at 60% 44%,rgba(255,217,79,.45),rgba(255,168,46,.19) 40%,rgba(255,255,255,0) 71%);transform:rotate(-7deg)}.hubstaff-hero-visual>img{position:relative;z-index:1;width:100%;max-width:780px;height:auto;object-fit:contain;filter:drop-shadow(0 20px 30px rgba(29,34,41,.08))}.float-icon{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#fff5db;color:#f59b00;flex:0 0 auto}.float-icon svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.float-users{background:#ebf9f2;color:#19a967}.float-chart{background:#f1ebff;color:#7e45e5}.float-check{background:#eaf9f1;color:#19aa67;font-weight:900;font-size:18px}.hubstaff-inner-hero{padding:var(--space-hero-y) 0}.hubstaff-inner-hero .hubstaff-hero-copy h1{font-size:clamp(45px,4.8vw,70px)} @keyframes cursorBlink{0%,48%{opacity:1}49%,100%{opacity:0}}@keyframes cardFloat{0%,100%{transform:translate3d(0,0,0) rotate(0)}50%{transform:translate3d(0,-9px,0) rotate(.4deg)}} @media(max-width:1120px){.desktop-nav{gap:19px;margin-left:10px}.mega-menu-inner{grid-template-columns:220px minmax(0,1fr) 270px;width:min(1180px,calc(100% - 36px))}.mega-panels{padding:28px}.hubstaff-hero-grid{grid-template-columns:1fr;gap:30px}.hubstaff-hero-copy{text-align:center}.hubstaff-hero-copy>p{margin-inline:auto}.hero-actions,.hero-trust-points{justify-content:center}.hubstaff-hero-visual{min-height:530px;max-width:820px;margin-inline:auto;width:100%}} @media(max-width:820px){.top-announcement{height:auto}.top-announcement-inner{min-height:46px;height:auto;padding:7px 0;font-size:12px}.desktop-nav,.login-link{display:none}.menu-toggle{display:block}.nav-shell{gap:14px}.mobile-menu{top:82px}.hubstaff-hero,.hubstaff-inner-hero{padding:var(--space-hero-y) 0}.hubstaff-hero-copy h1{font-size:clamp(42px,11vw,62px)}.hubstaff-hero-copy>p{font-size:17px}.hubstaff-hero-visual{min-height:450px}} @media(max-width:620px){.top-announcement-inner{justify-content:center;text-align:center}.top-announcement a{display:none}.nav-start{display:none}.brand img{width:128px}.hubstaff-hero-grid{gap:20px}.hero-promo{font-size:11px}.hero-promo span{font-size:10px}.hubstaff-hero-copy{text-align:left}.hero-actions{display:grid;grid-template-columns:1fr 1fr}.hero-actions .btn{width:100%}.hero-trust-points{justify-content:flex-start;gap:10px 15px}.hubstaff-hero-visual{min-height:350px}.hubstaff-hero-visual>img{width:112%;max-width:none}.typewriter-cursor{width:2px}.hubstaff-inner-hero .hubstaff-hero-copy h1{font-size:clamp(38px,10vw,52px)}} @media(prefers-reduced-motion:reduce){.typewriter-cursor,} /* ===== Worklix V1.3 hero + mega menu refinement ===== */ @import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@500;600;700;800&display=swap'); body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:#fff} h1,h2,h3,.desktop-nav,.nav-item>button,.hero-promo,.btn,.mega-tab,.mega-panel-title,.mega-link-copy strong{font-family:"Plus Jakarta Sans",Inter,ui-sans-serif,system-ui,sans-serif} .desktop-nav>a,.nav-item>button{display:inline-flex;align-items:center;gap:7px;line-height:1.1} .nav-chevron{font-size:12px;line-height:1;display:inline-flex;align-items:center;justify-content:center;transform:translateY(1px)} .nav-item.has-mega:hover>.nav-chevron,.nav-item.has-mega:focus-within>.nav-chevron{transform:translateY(1px) rotate(180deg)} .site-header{background:rgba(255,255,255,.96);backdrop-filter:blur(20px)} .mega-dropdown{top:82px;padding:18px 0;background:transparent;border:0;box-shadow:none} .mega-menu-inner{width:min(1340px,calc(100% - 56px));min-height:460px;background:#fff;border:1px solid #e9edf3;border-radius:28px;box-shadow:0 28px 70px rgba(20,24,35,.12);overflow:hidden} .mega-tabs{padding:18px;background:linear-gradient(180deg,#fffdf6,#fff8e6);border-right:1px solid #eceff5;gap:10px} .mega-tab{min-height:60px;padding:14px 16px;border:1px solid transparent;border-radius:16px;align-items:center} .mega-tab span:first-child{display:block;flex:1;padding-right:10px} .mega-tab span:last-child{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;border-radius:50%;background:#fff;color:#b97a00;font-size:16px;line-height:1;flex:0 0 auto} .mega-tab:hover,.mega-tab.is-active{background:#fff;border-color:#f2dba4;color:#a86a00;box-shadow:0 12px 26px rgba(255,185,17,.14)} .mega-panels{padding:26px 28px 22px;display:flex;align-items:stretch} .mega-panel{height:100%;width:100%} .mega-panel-title{font-size:20px;font-weight:800;padding-bottom:18px;margin-bottom:20px;display:flex;align-items:center;justify-content:space-between} .mega-feature-grid{gap:14px 14px} .mega-feature-link{min-height:110px;align-items:center;padding:16px 14px;border:1px solid transparent;border-radius:18px;background:#fff} .mega-feature-link:hover{background:#fffaf0;border-color:#f2ddb0;box-shadow:0 14px 34px rgba(255,178,30,.12)} .mega-icon{width:44px;height:44px;border-radius:14px;border-color:#e7ebf2;background:#fff7e3;color:#9f6800;display:inline-flex;align-items:center;justify-content:center;align-self:center} .mega-icon svg{width:22px;height:22px} .mega-link-copy strong{font-size:15px;line-height:1.2;margin:0 0 6px} .mega-link-copy small{font-size:13px;line-height:1.45;color:#66707f} .mega-arrow{font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center;align-self:center;padding-top:0} .mega-cta{padding:30px 28px;background:linear-gradient(180deg,#fffaf0,#fff3d5);border-left:1px solid #eceff5;display:flex;flex-direction:column;justify-content:space-between} .mega-cta h3{font-size:28px;letter-spacing:-.03em;margin:10px 0 12px} .mega-cta p{font-size:14px;line-height:1.55} .mega-cta-card{border-radius:22px;min-height:180px;box-shadow:0 22px 46px rgba(255,173,24,.18)} .hubstaff-hero,.hubstaff-inner-hero{background:linear-gradient(180deg,#fff 0%,#fff 66%,#fff9ef 100%)} .hubstaff-hero-copy h1,.inner-hero-title{font-family:"Plus Jakarta Sans",Inter,ui-sans-serif,system-ui,sans-serif;font-weight:800;letter-spacing:-.062em;color:#212735} .hubstaff-hero-copy h1{font-size:clamp(58px,6.05vw,88px);line-height:.94;max-width:760px;margin:23px 0 18px} .hero-line{display:block} .typewriter-wrap{display:inline-flex;align-items:flex-end;min-width:7.2ch;white-space:nowrap;color:#ff9f00;background:linear-gradient(90deg,#ffcb31,#ff9c12,#ff6a48);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent} .typewriter-wrap.single{min-width:auto} .typewriter-word{display:inline-block;min-width:1ch} .typewriter-cursor{display:inline-block;width:3px;height:.9em;margin-left:4px;background:#ffb400;border-radius:2px;vertical-align:.03em;animation:cursorBlink .75s steps(1) infinite} .hubstaff-hero-copy>p{font-size:18px;line-height:1.58;max-width:640px} .hubstaff-hero-visual{min-height:620px} .hubstaff-hero-visual>img{max-width:760px;filter:drop-shadow(0 18px 26px rgba(29,34,41,.04))} .hero-pattern{inset:8% 4% 3% 12%;background:radial-gradient(circle at 52% 45%,rgba(255,218,87,.42),rgba(255,178,43,.18) 44%,rgba(255,255,255,0) 70%)} .users-badge{background:#e9f8f0;color:#19a967}.clock-badge{background:#fff4dd;color:#f59a00}.chart-badge{background:#f2ecff;color:#7d49ea}.check-badge{background:#e8f8ef;color:#18a566} .hero-avatar-row span:nth-child(1){background:#ff9d5c}.hero-avatar-row span:nth-child(2){background:#4d7cff}.hero-avatar-row span:nth-child(3){background:#8a64ff}.hero-avatar-row span:nth-child(4){background:#5ac88f}.hero-avatar-row b{background:#f1f3f8;color:#687385;font-weight:700} .hero-mini-bars i:nth-child(1),.hero-mini-bars i:nth-child(2),.hero-mini-bars i:nth-child(3){background:linear-gradient(180deg,#ffda58,#ffc53d)} .hero-mini-line span{display:block;width:100%;height:100%;background:no-repeat center/contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 240 64'%3E%3Cpath d='M8 46 C28 54, 40 18, 64 32 S101 55, 128 30 S168 17, 188 26 S217 28, 232 16' fill='none' stroke='%238449f0' stroke-width='6' stroke-linecap='round'/%3E%3Ccircle cx='232' cy='16' r='8' fill='%238449f0'/%3E%3C/svg%3E")} @media(max-width:1200px){.mega-menu-inner{grid-template-columns:240px minmax(0,1fr) 280px}.hubstaff-hero-grid{grid-template-columns:minmax(0,.95fr) minmax(460px,1.05fr)}.hubstaff-hero-copy h1{font-size:clamp(54px,6vw,80px)}} @media(max-width:1120px){.hubstaff-hero-grid{grid-template-columns:1fr;gap:34px}.hubstaff-hero-copy h1{max-width:none;text-align:center}.hubstaff-hero-copy>p{margin-inline:auto;text-align:center}.hero-promo{margin-inline:auto}.hero-actions,.hero-trust-points{justify-content:center}.hubstaff-hero-visual{min-height:560px}} @media(max-width:820px){.mega-dropdown{display:none!important}.hubstaff-hero-copy h1{font-size:clamp(46px,10vw,64px);line-height:.96}.hero-line{display:block}.typewriter-wrap{min-width:6.8ch}.hubstaff-hero-visual{min-height:470px}} @media(max-width:620px){.hubstaff-hero-copy h1{font-size:clamp(40px,10.8vw,54px)}.hero-actions{grid-template-columns:1fr}.hubstaff-hero-visual>img{width:100%;max-width:100%}.typewriter-wrap{min-width:6.5ch}.hubstaff-inner-hero .hubstaff-hero-copy h1,.inner-hero-title{font-size:clamp(38px,10vw,50px)}} /* ===== Worklix V1.4 final header / banner refinement ===== */ .desktop-nav{gap:31px;font-size:14px;font-weight:700} .desktop-nav>a,.nav-item>button{height:82px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0;color:#242a34;font-weight:700;line-height:1;border:0;background:transparent;cursor:pointer} .nav-chevron{width:16px;height:16px;display:inline-flex;align-items:center;justify-content:center;transition:transform .2s ease} .nav-chevron svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block} .has-mega:hover .nav-chevron,.has-mega:focus-within .nav-chevron{transform:rotate(180deg)} .nav-item{position:static} .mega-dropdown{position:absolute;left:0;right:0;top:82px;padding:14px 0 24px;background:transparent;border:0;box-shadow:none;opacity:0;visibility:hidden;transform:translateY(8px);pointer-events:none;transition:opacity .18s ease,transform .18s ease,visibility .18s ease} .has-mega:hover>.mega-dropdown,.has-mega:focus-within>.mega-dropdown{opacity:1;visibility:visible;transform:translateY(0);pointer-events:auto} .mega-card{width:min(1370px,calc(100% - 54px));height:438px;margin:0 auto;display:grid;grid-template-columns:285px minmax(0,1fr);background:#fff;border:1px solid #e7ebf1;border-radius:26px;box-shadow:0 26px 70px rgba(18,24,34,.13);overflow:hidden} .mega-overview{background:linear-gradient(160deg,#fff9e8 0%,#fff4d8 50%,#fffdf8 100%);border-right:1px solid #ebeef3;padding:30px 28px;display:flex;flex-direction:column;align-items:flex-start} .mega-overview-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:linear-gradient(135deg,#ffd849,#ff9a2c);color:#252a33;margin-bottom:23px;box-shadow:0 12px 25px rgba(255,172,35,.2)} .mega-overview-icon svg,.mega-link-icon svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;display:block} .mega-overview-icon svg{width:25px;height:25px} .mega-kicker{display:block;font-size:11px;line-height:1;text-transform:uppercase;letter-spacing:.11em;font-weight:800;color:#9a6c0a;margin-bottom:12px} .mega-overview h3{font-size:26px;line-height:1.08;letter-spacing:-.035em;margin:0 0 14px;color:#222832} .mega-overview p{font-size:13.5px;line-height:1.58;color:#66707d;margin:0 0 24px} .mega-overview>a{margin-top:auto;display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#9e6800} .mega-columns{padding:28px 30px 26px;display:grid;height:100%;gap:26px;overflow:hidden} .mega-columns-4{grid-template-columns:repeat(4,minmax(0,1fr))}.mega-columns-3{grid-template-columns:repeat(3,minmax(0,1fr))} .mega-column{min-width:0;display:flex;flex-direction:column;gap:8px} .mega-column>.mega-kicker{padding:0 8px 9px;margin-bottom:1px;color:#8e96a4;border-bottom:1px solid #edf0f4} .mega-link{display:grid;grid-template-columns:42px minmax(0,1fr);align-items:center;column-gap:12px;min-height:77px;padding:9px 9px;border-radius:14px;transition:background .2s ease,transform .2s ease} .mega-link:hover{background:#fff8e9;transform:translateY(-1px)} .mega-link-icon{width:40px;height:40px;border:1px solid #e4e8ee;border-radius:12px;background:#fff;display:flex;align-items:center;justify-content:center;color:#a36f09;flex:0 0 auto;align-self:center} .mega-link-icon svg{width:20px;height:20px} .mega-link-text{display:flex;flex-direction:column;justify-content:center;min-width:0;line-height:1.25} .mega-link-text strong{font-size:13.5px;font-weight:800;color:#29303a;margin:0 0 4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis} .mega-link-text small{font-size:11.5px;line-height:1.38;color:#747d89;font-weight:500;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .hubstaff-hero-copy h1{font-family:"Plus Jakarta Sans",Inter,ui-sans-serif,system-ui,sans-serif;font-size:clamp(50px,4.15vw,64px);line-height:1.045;letter-spacing:-.048em;font-weight:700;max-width:670px;margin:22px 0 18px} .hubstaff-inner-hero .hubstaff-hero-copy h1,.inner-hero-title{font-size:clamp(46px,3.9vw,60px);line-height:1.05;letter-spacing:-.047em;font-weight:700} .hero-line{display:block} .typewriter-wrap{min-width:6.8ch;vertical-align:baseline} .hubstaff-hero-grid{grid-template-columns:minmax(0,.93fr) minmax(520px,1.07fr);gap:50px} .hubstaff-hero-visual{min-height:590px} .hubstaff-hero-visual>img{max-width:735px} .hero-pattern{inset:10% 5% 1% 13%;background:radial-gradient(circle at 52% 45%,rgba(255,218,87,.46),rgba(255,176,40,.18) 45%,rgba(255,255,255,0) 72%)} @media(max-width:1250px){.desktop-nav{gap:20px}.mega-card{width:min(1200px,calc(100% - 34px));grid-template-columns:250px minmax(0,1fr)}.mega-columns{gap:16px;padding-inline:22px}.mega-link{grid-template-columns:38px minmax(0,1fr);column-gap:10px;padding-inline:6px}.mega-link-icon{width:36px;height:36px}.mega-link-text strong{font-size:12.8px}.mega-link-text small{font-size:11px}} @media(max-width:1120px){.mega-dropdown{display:none}.hubstaff-hero-grid{grid-template-columns:1fr}.hubstaff-hero-copy h1{max-width:720px;margin-inline:auto}.hubstaff-hero-visual{max-width:800px}} @media(max-width:820px){.desktop-nav{display:none}.hubstaff-hero-copy h1{font-size:clamp(44px,10vw,60px)}} @media(max-width:620px){.hubstaff-hero-copy h1{font-size:clamp(40px,10.4vw,52px);line-height:1.02}.hubstaff-inner-hero .hubstaff-hero-copy h1,.inner-hero-title{font-size:clamp(38px,9.8vw,48px)}} /* ===== Worklix V1.5 strict title + floating card refinement ===== */ /* Banner titles: desktop strictly 2–3 designed lines. Section H2: 1–2 concise lines. */ .hubstaff-hero-copy h1{ font-size:clamp(46px,3.75vw,58px); line-height:1.04; letter-spacing:-.047em; font-weight:700; max-width:650px; text-wrap:balance; } .hubstaff-inner-hero .hubstaff-hero-copy h1, .inner-hero-title{ font-size:clamp(42px,3.45vw,54px); line-height:1.045; letter-spacing:-.045em; max-width:660px; } .hero-line{display:block;white-space:nowrap} .typewriter-wrap{min-width:6.35ch;display:inline-flex;align-items:baseline} .typewriter-wrap.single{min-width:auto} .typewriter-cursor{height:.84em;transform:translateY(.03em)} .intro-row h2, .section-copy h2, .section-heading h2, .final-cta h2, .section h2{ font-size:clamp(31px,3vw,44px); line-height:1.08; letter-spacing:-.038em; text-wrap:balance; } .section-heading h2,.final-cta h2{max-width:760px;margin-left:auto;margin-right:auto} .section-copy h2,.intro-row h2{max-width:610px} .hubstaff-hero-visual{min-height:570px;overflow:visible} .hubstaff-hero-visual>img{width:min(100%,690px);max-width:690px;margin-left:auto} @media(max-width:1250px){ .hubstaff-hero-copy h1{font-size:clamp(45px,4.3vw,56px)} .hubstaff-hero-visual>img{max-width:680px} } @media(max-width:1120px){ .hubstaff-hero-copy h1{max-width:690px} .hero-line{white-space:normal} .hubstaff-hero-visual{max-width:760px;min-height:540px} } @media(max-width:820px){ .hubstaff-hero-copy h1,.hubstaff-inner-hero .hubstaff-hero-copy h1,.inner-hero-title{font-size:clamp(38px,8.5vw,50px)} .intro-row h2,.section-copy h2,.section-heading h2,.final-cta h2,.section h2{font-size:clamp(29px,6vw,38px)} } @media(max-width:620px){ .hubstaff-hero-copy h1,.hubstaff-inner-hero .hubstaff-hero-copy h1,.inner-hero-title{font-size:clamp(34px,9.2vw,44px);line-height:1.04} .hero-line{white-space:normal} .intro-row h2,.section-copy h2,.section-heading h2,.final-cta h2,.section h2{font-size:clamp(28px,7.5vw,34px)} } /* ========================================================= V1.7 GLOBAL MOTION SYSTEM Scope intentionally limited to buttons + subtitles. V1.5 H1/H2 typography and heading wrapping remain untouched. ========================================================= */ /* Arrow Fill Button — global, inline by default */ .btn { --btn-fill: #252b35; --btn-hover-text: #ffffff; position: relative; isolation: isolate; overflow: hidden; width: max-content; max-width: 100%; gap: 12px; padding-left: 21px; padding-right: 8px; transform: none; transition: border-color .34s cubic-bezier(.16,1,.3,1), box-shadow .34s cubic-bezier(.16,1,.3,1), color .34s cubic-bezier(.16,1,.3,1); } .btn:hover, .btn:focus-visible { transform: none; } .btn-label { position: relative; z-index: 3; display: inline-flex; align-items: center; white-space: nowrap; transition: color .38s cubic-bezier(.16,1,.3,1); } .btn-arrow { position: relative; z-index: 2; flex: 0 0 auto; width: 34px; height: 34px; display: inline-grid; place-items: center; border-radius: 999px; color: #ffffff; } .btn-arrow::before { content: ""; position: absolute; inset: 0; z-index: -1; border-radius: inherit; background: var(--btn-fill); transform: scale(1); transform-origin: center; transition: transform .64s cubic-bezier(.16,1,.3,1); will-change: transform; } .btn-arrow svg { width: 16px; height: 16px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; transition: transform .42s cubic-bezier(.16,1,.3,1), color .34s ease; } .btn:hover .btn-arrow::before, .btn:focus-visible .btn-arrow::before { transform: scale(14); } .btn:hover .btn-arrow svg, .btn:focus-visible .btn-arrow svg { transform: translateX(2.5px); } .btn:hover .btn-label, .btn:focus-visible .btn-label { color: var(--btn-hover-text); } .btn-primary { --btn-fill: #252b35; --btn-hover-text: #ffffff; } .btn-primary .btn-arrow { color: #ffd24a; } .btn-primary:hover, .btn-primary:focus-visible { border-color: #252b35; box-shadow: 0 15px 34px rgba(31,36,45,.18); } .btn-secondary, .btn-ghost, .btn-light { --btn-fill: #ffbf1f; --btn-hover-text: #242a34; } .btn-secondary .btn-arrow, .btn-ghost .btn-arrow, .btn-light .btn-arrow { color: #242a34; } .btn-secondary:hover, .btn-secondary:focus-visible, .btn-ghost:hover, .btn-ghost:focus-visible, .btn-light:hover, .btn-light:focus-visible { border-color: #efbd39; box-shadow: 0 15px 32px rgba(255,178,30,.18); } .btn-large .btn-arrow { width: 38px; height: 38px; } .btn-large { padding-left: 25px; padding-right: 8px; } /* Only pricing-table/card actions are allowed to be full-width. */ .pricing-card .btn, .price-card .btn, .pricing-table .btn, .pricing-grid .btn, .plan-card .btn { width: 100%; } /* Global subtitle component: static fill, animation restricted to the 1px border. */ .hero-promo,.eyebrow{ --subtitle-angle:0deg;position:relative;isolation:isolate;overflow:hidden;width:max-content;max-width:100%; display:inline-flex;align-items:center;gap:8px;border:1px solid transparent;border-radius:999px; background:#fffdf8;color:#3d4450;box-shadow:0 8px 22px rgba(29,34,43,.045); } .hero-promo{padding:8px 13px}.eyebrow{padding:8px 13px}.eyebrow.tiny{padding:6px 9px} .eyebrow.muted{background:#fffdf8}.dark-eye{color:#fff;background:#13161c;box-shadow:0 8px 26px rgba(0,0,0,.16)} .hero-promo::before,.eyebrow::before{ content:"";position:absolute;inset:0;z-index:0;border-radius:inherit;padding:1px;pointer-events:none; background:conic-gradient(from var(--subtitle-angle),#e6e8ec 0 58%,#ffd84d 68%,#ffad28 76%,#ff6a4a 84%,#ff315f 90%,#e6e8ec 100%); -webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0); -webkit-mask-composite:xor;mask-composite:exclude;animation:subtitleBorderOrbit 3.2s linear infinite; } .hero-promo>*,.eyebrow>*{position:relative;z-index:1} @property --subtitle-angle{syntax:"";initial-value:0deg;inherits:false} @keyframes subtitleBorderOrbit{to{--subtitle-angle:360deg}} @media (max-width: 620px) { .btn { width: max-content; max-width: 100%; } .hero-actions .btn { width: max-content; } .pricing-card .btn, .price-card .btn, .pricing-table .btn, .pricing-grid .btn, .plan-card .btn { width: 100%; } } /* Hero floating metric cards — canonical component. */ .hubstaff-hero-visual{min-height:570px;overflow:visible} .hubstaff-hero-visual>img{width:min(100%,690px);max-width:690px;margin-left:auto} .hero-float-card{position:absolute;z-index:5;width:190px;min-width:0;display:flex;align-items:center;gap:10px;padding:11px 12px;border:1px solid #e8ebf0;border-radius:16px;background:rgba(255,255,255,.97);box-shadow:0 14px 34px rgba(27,32,41,.11);backdrop-filter:blur(8px);pointer-events:none;animation:cardFloat 5.6s ease-in-out infinite} .hero-card-icon{width:36px;height:36px;flex:0 0 36px;border-radius:11px;display:grid;place-items:center} .hero-card-icon svg{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .hero-card-copy{min-width:0;display:flex;flex:1;flex-direction:column;gap:5px} .hero-card-copy small{font-size:10px;line-height:1.2;color:#6c7480;font-weight:700;white-space:nowrap} .hero-card-metric{display:flex;align-items:baseline;gap:6px;white-space:nowrap} .hero-card-metric strong{font-size:20px;line-height:1;font-weight:800;color:#252a33} .hero-card-metric em{font-size:9px;line-height:1;font-style:normal;font-weight:800;color:#20a765} .hero-avatar-row{display:flex;align-items:center;gap:4px} .hero-avatar-row span,.hero-avatar-row b{width:21px;height:21px;border-radius:50%;display:grid;place-items:center;font-size:7px;font-weight:800;background:#f4f6f8;border:1px solid #fff;color:#4d5664} .hero-mini-bars{height:29px;display:flex;align-items:flex-end;gap:4px} .hero-mini-bars i{width:9px;border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#ffc433,#ff6a37)} .hero-mini-line{height:24px;position:relative;overflow:hidden} .hero-mini-line:before{content:"";position:absolute;inset:8px 0 4px;background:linear-gradient(135deg,transparent 5%,#ffb522 6% 18%,transparent 19% 27%,#ff6a37 28% 42%,transparent 43% 52%,#ff315f 53% 70%,transparent 71%);opacity:.8} .hero-progress{height:7px;border-radius:99px;background:#edf0f3;overflow:hidden}.hero-progress span{display:block;width:80%;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffb522,#ff6a37)} .hero-float-active{left:0;top:16%;animation-delay:-.5s}.hero-float-time{right:0;top:17%;animation-delay:-2s}.hero-float-productivity{left:-1%;bottom:17%;animation-delay:-3s}.hero-float-project{right:-1%;bottom:18%;animation-delay:-1.4s} .inner-visual .hero-float-card{transform:scale(.88)} @media(max-width:1250px){.hero-float-card{width:178px}.hero-float-active,.hero-float-productivity{left:0}.hero-float-time,.hero-float-project{right:0}} @media(max-width:820px){.hero-float-card{width:166px;padding:10px}.hero-card-metric strong{font-size:18px}} @media(max-width:620px){.hero-float-card{display:none}} /* Reference-inspired dark feature grid used by the Time + Attendance homepage section. */ @media (prefers-reduced-motion: reduce) { .btn, .btn-label, .btn-arrow::before, .btn-arrow svg { transition: none !important; } .btn:hover .btn-arrow::before, .btn:focus-visible .btn-arrow::before { transform: scale(1) !important; } .btn:hover .btn-label, .btn:focus-visible .btn-label { color: inherit !important; } .hero-promo::before, .eyebrow::before, .hero-promo::after, .eyebrow::after { animation: none !important; } } /* Banner alignment follows the global container gutter. */ @media(max-width:1120px){.hubstaff-hero-visual{justify-self:center;justify-content:center;max-width:800px}.hubstaff-hero-visual>img{margin-inline:auto}} /* --- V1.9 cleanup overrides: border-only subtitle motion, hero alignment, clean floating cards, global spacing, rebuilt dark time section --- */ :root{ --global-inline-space: clamp(16px, 2.8vw, 24px); --global-section-space: clamp(78px, 8vw, 110px); --global-card-radius: 22px; } .container{width:min(var(--container), calc(100% - (var(--global-inline-space) * 2)))} .section{padding-block:var(--global-section-space)} .hubstaff-hero,.hubstaff-inner-hero{padding-block:clamp(64px, 8vw, 102px)} .section-heading{margin-bottom:40px}.section-heading.centered{max-width:760px} .section-copy,.section-heading p,.intro-row p,.access-card p{line-height:1.62} /* Subtitle pills: animation only on border ring */ .hero-promo,.eyebrow{ position:relative; isolation:isolate; overflow:hidden; background:rgba(255,255,255,.96) !important; border:1px solid rgba(228, 214, 176, .78) !important; box-shadow:0 10px 24px rgba(11,13,17,.05); } .dark-eye{background:rgba(18,22,28,.92) !important;border-color:rgba(255,210,96,.28) !important;color:#f4f7fa !important;box-shadow:0 10px 26px rgba(0,0,0,.18)} .hero-promo::before,.eyebrow::before{content:none !important} .hero-promo::after,.eyebrow::after{ content:""; position:absolute; inset:-1px; border-radius:inherit; padding:1.5px; background:linear-gradient(90deg, transparent 0%, transparent 14%, rgba(255,216,77,.96) 28%, rgba(255,155,44,.98) 42%, rgba(255,98,83,.96) 54%, transparent 68%, transparent 100%); background-size:220% 100%; -webkit-mask:linear-gradient(#000 0 0) content-box, linear-gradient(#000 0 0); -webkit-mask-composite:xor; mask-composite:exclude; pointer-events:none; animation:borderBeam 3.1s linear infinite; } @keyframes borderBeam{0%{background-position:200% 0}100%{background-position:-140% 0}} .hero-promo>span,.eyebrow>span{background:rgba(255,249,233,.98)} .dark-eye>span{background:rgba(255,195,22,.12)} /* Hero alignment and clean floating items */ .hubstaff-hero-grid{align-items:center;column-gap:56px} .hubstaff-hero-visual{justify-self:end;align-self:center;max-width:730px;min-height:560px;margin-left:auto;padding-right:8px} .hubstaff-hero-visual>img{max-width:710px} .hero-pattern{inset:8% 6% 8% 12%;background: radial-gradient(circle at 48% 44%, rgba(255,216,77,.52), rgba(255,177,32,.20) 36%, rgba(255,98,83,.10) 56%, rgba(255,255,255,0) 74%), radial-gradient(circle at 32% 72%, rgba(255,196,57,.18), rgba(255,255,255,0) 48%), radial-gradient(circle at 74% 68%, rgba(255,98,83,.12), rgba(255,255,255,0) 42%)} .hero-float-card{ width:196px; gap:11px; align-items:flex-start; padding:12px 13px; border:1px solid rgba(230,233,239,.96); border-radius:18px; background:rgba(255,255,255,.98); box-shadow:0 18px 38px rgba(20,26,34,.12); } .hero-card-copy small{font-size:10px;font-weight:700;color:#697282} .hero-card-metric{gap:7px}.hero-card-metric strong{font-size:22px;line-height:1}.hero-card-metric em{font-size:10px;font-weight:800;font-style:normal;color:#19ad67} .hero-avatar-row span,.hero-avatar-row b{width:24px;height:24px;font-size:7px} .hero-mini-bars{height:44px;gap:5px}.hero-mini-bars i{width:11px;border-radius:4px 4px 3px 3px} .hero-progress{height:9px} .hero-float-active{left:3%;top:12%}.hero-float-time{right:1%;top:13%}.hero-float-productivity{left:2%;bottom:18%}.hero-float-project{right:0;bottom:16%} @media(max-width:1120px){.hubstaff-hero-visual{max-width:760px;justify-self:center;padding-right:0}} @media(max-width:820px){.hubstaff-hero-visual{min-height:470px}.hero-float-card{width:178px;padding:10px 11px}.hero-card-metric strong{font-size:19px}} @media(max-width:620px){.hubstaff-hero-visual{min-height:330px}.hero-float-card{display:none}} /* Rebuilt dark access section closer to reference */ /* ===== Connected platform cards: global full-width buttons ===== */ .connected-platform-card{ height:100%; } .connected-platform-card .connected-card-btn{ width:100%; margin-top:24px; } .connected-platform-card .btn-label{ flex:1; text-align:left; } .connected-platform-card .btn-arrow{ flex:0 0 auto; } /* ===== Worklix V1.23 canonical home refinements ===== */ .connected-platform-card .connected-card-btn{width:100%;margin-top:24px} /* Turn clock-ins: reference-matched clean geometry */ .future-work-section{position:relative;overflow:hidden;background:#07090d;color:#fff} .future-work-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% -12%,rgba(255,190,31,.10),transparent 34%),linear-gradient(rgba(255,255,255,.014) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.014) 1px,transparent 1px);background-size:auto,72px 72px,72px 72px} .future-work-heading{position:relative;z-index:1;max-width:760px;margin:0 auto 42px;text-align:center}.future-work-heading .eyebrow{margin-inline:auto}.future-work-heading h2{margin:14px auto 12px;color:#fff;font-size:clamp(34px,3.4vw,50px);line-height:1.04}.future-work-heading p{max-width:620px;margin:0 auto;color:#a5adb8;font-size:14px} .future-work-layout{position:relative;z-index:1;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:320px 252px;gap:18px;align-items:stretch} .future-card{position:relative;min-width:0;overflow:hidden;border:1px solid #303640;border-radius:22px;background:#171b21;color:#fff;transition:transform .38s cubic-bezier(.2,.74,.2,1),border-color .3s ease,box-shadow .38s ease}.future-card:hover{transform:translateY(-5px);border-color:#474f5b;box-shadow:0 26px 58px rgba(0,0,0,.32)} .future-feature-card{grid-column:1/span 5;grid-row:1;padding:26px;display:flex;align-items:flex-end;background:linear-gradient(135deg,#a84d05,#d76e13 62%,#ef8b25)} .future-pattern,.future-insight-pattern{position:absolute;inset:0;pointer-events:none;background:linear-gradient(rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.055) 1px,transparent 1px),linear-gradient(135deg,rgba(255,255,255,.03) 25%,transparent 25%) 0 0/88px 88px,linear-gradient(315deg,rgba(255,255,255,.03) 25%,transparent 25%) 44px 44px/88px 88px;background-size:44px 44px,44px 44px,88px 88px,88px 88px;opacity:.55;transition:transform .45s ease,opacity .35s ease}.future-feature-card:hover .future-pattern,.future-insight-card:hover .future-insight-pattern{transform:translate3d(8px,-6px,0) scale(1.04);opacity:.78} .future-chip{position:absolute;top:16px;left:16px;z-index:2;padding:7px 10px;border-radius:999px;background:rgba(83,37,5,.34);font-size:10px;font-weight:800}.future-feature-copy{position:relative;z-index:2}.future-feature-copy h3{margin:0 0 12px;max-width:430px;font-size:clamp(31px,3vw,43px);line-height:1.02}.future-feature-copy p{max-width:420px;margin:0;color:rgba(255,255,255,.78);font-size:13px;line-height:1.55} .future-media-card{grid-column:6/-1;grid-row:1}.future-media-card img{width:100%;height:100%;object-fit:cover;object-position:center 45%;transition:transform .55s ease}.future-media-card:hover img{transform:scale(1.035)} .future-attendance-card{grid-column:1/span 4;grid-row:2;padding:24px;display:flex;flex-direction:column;justify-content:space-between;background:linear-gradient(180deg,#191d23,#161a20)}.future-attendance-glow{position:absolute;inset:0;background:radial-gradient(circle at 22% 18%,rgba(255,183,31,.10),transparent 30%),linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:auto,30px 30px,30px 30px;transition:transform .4s ease}.future-attendance-card:hover .future-attendance-glow{transform:scale(1.03) translate3d(6px,-4px,0)} .future-success-pill{position:relative;z-index:2;width:max-content;display:flex;align-items:center;gap:10px;padding:11px 15px;border-radius:999px;background:#393d44;box-shadow:0 12px 28px rgba(0,0,0,.18)}.future-success-icon{width:32px;height:32px;display:grid;place-items:center;border-radius:50%;background:linear-gradient(135deg,#ffca39,#ff8b25);color:#171b21;font-weight:900}.future-success-pill span:last-child{display:flex;flex-direction:column}.future-success-pill strong{font-size:12px}.future-success-pill small{margin-top:2px;color:#9ea6b0;font-size:9px}.future-lower-copy{position:relative;z-index:2}.future-lower-copy h3{margin:0 0 9px;font-size:21px}.future-lower-copy p{margin:0;max-width:300px;color:#b4bcc6;font-size:12px;line-height:1.55} .future-accuracy-card{grid-column:5/span 4;grid-row:2;padding:18px;display:flex;flex-direction:column;justify-content:space-between}.future-chart-shell{padding:6px;border-radius:16px;background:rgba(255,255,255,.025)}.future-chart{height:112px;padding:18px 18px 10px;display:flex;align-items:flex-end;justify-content:space-between;gap:7px;border-radius:12px;background:#15191e}.future-chart i{width:3px;min-height:18px;border-radius:999px;background:linear-gradient(180deg,#ffd84d,#ff952c);transform-origin:bottom;transition:transform .32s ease}.future-accuracy-card:hover .future-chart i:nth-child(odd){transform:scaleY(1.09)}.future-score strong{display:block;font-size:clamp(58px,5vw,72px);line-height:.82;letter-spacing:-.07em}.future-score span{display:block;margin-top:7px;color:#c1c7cf;font-size:11px} .future-right-stack{grid-column:9/-1;grid-row:2;display:grid;grid-template-rows:106px 1fr;gap:14px;height:100%}.future-team-card,.future-insight-card{height:100%;padding:18px 20px}.future-avatar-stack{display:flex;align-items:center}.future-avatar-stack span{width:27px;height:27px;margin-left:-7px;display:grid;place-items:center;border:2px solid #181c22;border-radius:50%;font-size:7px;font-weight:800}.future-avatar-stack span:first-child{margin-left:0;background:#ff9a57}.future-avatar-stack span:nth-child(2){background:#557bea}.future-avatar-stack span:nth-child(3){background:#8e63e9}.future-avatar-stack span:nth-child(4){background:#54b980}.future-team-card p{margin:12px 0 0;color:#d2d7de;font-size:11px;line-height:1.45}.future-insight-card{display:flex;align-items:flex-end;background:linear-gradient(145deg,#9c4b08,#d56d14)}.future-insight-copy{position:relative;z-index:2}.future-insight-copy h3{margin:0 0 7px;font-size:20px}.future-insight-copy p{margin:0;color:rgba(255,255,255,.82);font-size:10px;line-height:1.45} /* Monitoring: one white visual surface; Drive scroll-expansion behavior adapted to static HTML */ .workspace-monitor-section{position:relative;overflow:hidden;background:#fff}.workspace-monitor-heading{margin-bottom:46px}.workspace-monitor-heading h2{max-width:760px}.workspace-monitor-heading p{max-width:720px}.workspace-monitor-grid{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:50px;align-items:stretch}.workspace-dashboard,.workspace-monitor-features{height:590px;min-height:590px}.workspace-dashboard{position:relative;overflow:hidden;padding:0;border:1px solid #e6eaf0;border-radius:26px;background:#fff;box-shadow:0 24px 56px rgba(17,24,39,.09);transform:scale(var(--expand-scale,.96));opacity:var(--expand-opacity,.82);transition:box-shadow .3s ease}.workspace-preview-panel{position:absolute;inset:0;margin:0;opacity:0;visibility:hidden;transform:translateY(12px);transition:opacity .38s ease,transform .38s ease,visibility .38s step-end}.workspace-preview-panel.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .38s ease,transform .38s ease,visibility 0s linear}.workspace-preview-panel img{width:100%;height:100%;display:block;object-fit:contain;object-position:center;background:#fff}.workspace-preview-label{position:absolute;left:16px;top:16px;z-index:3;padding:8px 11px;border:1px solid #e6eaf0;border-radius:999px;background:rgba(255,255,255,.94);box-shadow:0 8px 20px rgba(17,24,39,.08);color:#805800;font-size:10px;font-weight:800}.workspace-monitor-features{display:grid;grid-template-rows:repeat(3,1fr);gap:14px}.workspace-monitor-item{width:100%;height:100%;display:grid;grid-template-columns:38px minmax(0,1fr);gap:14px;align-items:start;padding:22px;border:1px solid transparent;border-radius:18px;background:#fff;color:inherit;text-align:left;cursor:pointer;transition:transform .28s ease,border-color .28s ease,background .28s ease,box-shadow .28s ease}.workspace-monitor-item:hover,.workspace-monitor-item:focus-visible,.workspace-monitor-item.is-active{border-color:rgba(255,176,31,.42);background:linear-gradient(135deg,#fffaf0,#fff);box-shadow:0 14px 34px rgba(255,174,31,.09)}.workspace-monitor-item:hover{transform:translateX(3px)}.workspace-monitor-icon{width:34px;height:34px;display:grid;place-items:center;border-radius:10px;background:#fff4d7;color:#d98700}.workspace-monitor-icon svg{width:18px;height:18px}.workspace-monitor-item h3{margin:1px 0 8px;font-size:18px;line-height:1.2}.workspace-monitor-item p{margin:0;color:#636c79;font-size:13px;line-height:1.66} /* FAQ before pricing */ .worklix-faq-section{position:relative;overflow:hidden;background:#07090d;color:#fff}.worklix-faq-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 50% 108%,rgba(255,176,31,.20),transparent 34%),linear-gradient(rgba(255,255,255,.016) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.016) 1px,transparent 1px);background-size:auto,70px 70px,70px 70px}.faq-shell{position:relative;z-index:1}.faq-heading h2{color:#fff}.faq-heading p{color:#aab1bc}.faq-list{width:min(860px,100%);margin:0 auto;display:flex;flex-direction:column;gap:10px}.faq-list details{overflow:hidden;border:1px solid #282e37;border-radius:14px;background:#161a20}.faq-list details[open]{border-color:rgba(255,191,31,.28);background:#191e25}.faq-list summary{position:relative;padding:18px 52px 18px 20px;cursor:pointer;color:#f2f4f7;font:700 14px/1.35 var(--title-font);list-style:none}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary::after{content:"+";position:absolute;right:20px;top:50%;transform:translateY(-50%);color:#ffbf1f;font-size:22px}.faq-list details[open] summary::after{content:"×"}.faq-list details p{margin:0;padding:0 20px 18px;color:#a8b0ba;font-size:13px;line-height:1.65} /* Pricing with explicit month/year totals */ .worklix-pricing-showcase{background:#fff}.pricing-reference-heading{margin-bottom:40px}.pricing-toggle{width:max-content;margin:24px auto 0;padding:4px;display:flex;gap:4px;border:1px solid var(--line);border-radius:999px;background:#f7f8fa}.pricing-toggle button{min-width:92px;min-height:38px;padding:0 16px;border:0;border-radius:999px;background:transparent;color:#6d7582;font:800 12px/1 var(--title-font);cursor:pointer}.pricing-toggle button.is-active{background:var(--gradient);color:#1d232c;box-shadow:0 8px 20px rgba(255,174,31,.18)}.pricing-reference-grid{display:grid;grid-template-columns:1fr 1fr 1.08fr;gap:18px;align-items:stretch}.pricing-reference-card,.pricing-reference-media{min-height:478px;border-radius:24px;overflow:hidden}.pricing-reference-card{position:relative;padding:28px;display:flex;flex-direction:column;background:#15191f;border:1px solid #282e37;color:#fff;box-shadow:0 20px 44px rgba(17,22,29,.13)}.pricing-reference-card.featured{border-color:rgba(255,191,31,.45);box-shadow:0 22px 50px rgba(255,174,31,.14)}.pricing-reference-badge{position:absolute;right:18px;top:18px;padding:7px 10px;border-radius:999px;background:#ffbf1f;color:#1b2028;font-size:9px;font-weight:900;text-transform:uppercase}.pricing-reference-name{color:#c7cdd5;font-size:12px;font-weight:800}.pricing-reference-price{margin:18px 0 16px;display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px}.pricing-reference-price strong{font:800 46px/.95 var(--title-font);letter-spacing:-.05em}.pricing-reference-price small{padding-bottom:5px;color:#aeb6c0;font:700 12px/1.2 var(--body-font)}.pricing-reference-card>p{margin:0;min-height:72px;color:#a8b0ba;font-size:13px;line-height:1.58}.pricing-reference-card ul{margin:22px 0 28px;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}.pricing-reference-card li{position:relative;padding-left:20px;color:#d7dbe1;font-size:12px}.pricing-reference-card li::before{content:"✓";position:absolute;left:0;color:#ffbf1f;font-weight:900}.pricing-reference-card .btn{width:100%;margin-top:auto}.pricing-reference-media{position:relative;background:#11151b;border:1px solid #282e37}.pricing-reference-media img{width:100%;height:100%;object-fit:cover;opacity:.62}.pricing-reference-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(7,9,13,.04),rgba(7,9,13,.90))}.pricing-reference-overlay{position:absolute;z-index:2;left:26px;right:26px;bottom:26px;color:#fff}.pricing-reference-overlay>span{color:#ffbf1f;font-size:10px;font-weight:800;text-transform:uppercase}.pricing-reference-overlay h3{margin:7px 0 10px;max-width:340px;color:#fff;font-size:25px;line-height:1.12}.pricing-reference-overlay p{margin:0 0 20px;color:#bcc3cc;font-size:12px;line-height:1.55}.pricing-billing-note{grid-column:1/-1;margin:2px 0 0;color:#7c8591;font-size:11px;text-align:center} /* Premium testimonial slider: portrait + large quote, same stage switches rather than scrolling cards */ .worklix-testimonials-section{position:relative;overflow:hidden;background:#fff}.worklix-testimonials-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 20% 20%,rgba(255,191,31,.08),transparent 28%),radial-gradient(circle at 82% 74%,rgba(255,92,79,.05),transparent 28%)}.testimonial-showcase{position:relative;z-index:1}.testimonial-stage{position:relative;min-height:520px;overflow:hidden;border:1px solid #e8ebf0;border-radius:28px;background:#fbfcfe;box-shadow:0 24px 58px rgba(17,24,39,.08)}.testimonial-slide{position:absolute;inset:0;display:grid;grid-template-columns:.82fr 1.18fr;opacity:0;visibility:hidden;transform:translateX(26px);transition:opacity .5s ease,transform .5s cubic-bezier(.2,.74,.2,1),visibility .5s step-end}.testimonial-slide.is-active{opacity:1;visibility:visible;transform:none;transition:opacity .5s ease,transform .5s cubic-bezier(.2,.74,.2,1),visibility 0s linear}.testimonial-portrait{height:100%;overflow:hidden;background:#eef1f5}.testimonial-portrait img{width:100%;height:100%;object-fit:cover;object-position:center}.testimonial-quote{display:flex;flex-direction:column;justify-content:center;padding:56px}.testimonial-kicker{width:max-content;padding:7px 10px;border-radius:999px;background:#fff4cf;color:#946300;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.05em}.testimonial-quote blockquote{margin:24px 0 30px;max-width:640px;color:#222a35;font:800 clamp(28px,3vw,44px)/1.14 var(--title-font);letter-spacing:-.035em}.testimonial-person-text{display:flex;flex-direction:column}.testimonial-person-text strong{font-size:14px}.testimonial-person-text small{margin-top:4px;color:#808895;font-size:11px}.testimonial-rail{margin-top:18px;display:grid;grid-template-columns:46px 1fr 46px;gap:12px;align-items:center}.testimonial-prev,.testimonial-next{width:46px;height:46px;border:1px solid var(--line);border-radius:50%;background:#fff;color:#242b35;font-size:18px;cursor:pointer}.testimonial-thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}.testimonial-thumbs button{min-width:0;padding:8px;display:flex;align-items:center;gap:9px;border:1px solid #e7eaf0;border-radius:14px;background:#fff;color:#6f7783;cursor:pointer;transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease}.testimonial-thumbs button.is-active{border-color:rgba(255,176,31,.45);box-shadow:0 10px 24px rgba(255,174,31,.10);color:#252c36}.testimonial-thumbs button:hover{transform:translateY(-2px)}.testimonial-thumbs img{width:36px;height:36px;border-radius:50%;object-fit:cover}.testimonial-thumbs span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px;font-weight:800} /* CTA connected directly to premium footer */ .worklix-dark-cta{position:relative;overflow:hidden;margin-bottom:0;background:#07090d;color:#fff}.worklix-dark-cta::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 50% 115%,rgba(255,176,31,.30),transparent 38%),radial-gradient(circle at 50% 108%,rgba(255,97,82,.13),transparent 26%);pointer-events:none}.dark-cta-inner{position:relative;z-index:1;max-width:820px;margin:0 auto;text-align:center}.dark-cta-inner .eyebrow{margin-inline:auto}.dark-cta-inner h2{margin:16px auto 14px;max-width:760px;color:#fff;font-size:clamp(34px,3.6vw,52px);line-height:1.04}.dark-cta-inner p{max-width:650px;margin:0 auto;color:#aab1bc;font-size:15px;line-height:1.65}.dark-cta-actions{margin-top:28px;display:flex;justify-content:center;gap:12px;flex-wrap:wrap} /* Premium footer */ .premium-footer{margin-top:0;padding:0 0 24px;background:#07090d;color:#fff;border-top:1px solid rgba(255,255,255,.08)}.footer-topline{display:grid;grid-template-columns:1.35fr .65fr;gap:28px;align-items:end;padding:54px 0 38px;border-bottom:1px solid rgba(255,255,255,.10)}.footer-brand-lockup{display:flex;align-items:center;gap:24px}.footer-logo-wrap{display:inline-flex;padding:12px 16px;border-radius:16px;background:#fff;box-shadow:0 12px 30px rgba(0,0,0,.18)}.footer-logo-wrap img{width:136px;height:auto}.footer-brand-lockup p{max-width:520px;margin:0;color:#9da5b1;font-size:14px;line-height:1.6}.footer-contact-card{justify-self:end;display:flex;flex-direction:column;align-items:flex-end;gap:4px}.footer-contact-card span{color:#7f8793;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.footer-contact-card a{color:#fff;font-size:14px;font-weight:800}.premium-footer-grid{grid-template-columns:repeat(5,1fr);gap:34px;padding:42px 0}.premium-footer-grid>div{display:flex;flex-direction:column;gap:10px}.premium-footer-grid h3{margin:0 0 7px;color:#fff;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.premium-footer-grid a{color:#9da5b1;font-size:12px;transition:color .2s ease,transform .2s ease}.premium-footer-grid a:hover{color:#fff;transform:translateX(2px)}.premium-footer-bottom{margin-top:0;padding-top:22px;border-top:1px solid rgba(255,255,255,.10);display:grid;grid-template-columns:1fr auto 1fr;gap:18px;align-items:center;color:#747d89;font-size:11px}.premium-footer-bottom>span:last-child{text-align:right}.premium-footer-bottom div{display:flex;gap:14px}.premium-footer-bottom a{color:#8f97a3} @media(max-width:980px){.future-work-layout{grid-template-columns:1fr 1fr;grid-template-rows:300px auto auto}.future-feature-card{grid-column:1;grid-row:1}.future-media-card{grid-column:2;grid-row:1}.future-attendance-card{grid-column:1;grid-row:2;min-height:250px}.future-accuracy-card{grid-column:2;grid-row:2;min-height:250px}.future-right-stack{grid-column:1/-1;grid-row:3;grid-template-columns:1fr 1fr;grid-template-rows:none;height:auto}.future-team-card,.future-insight-card{min-height:170px}.workspace-monitor-grid{grid-template-columns:1fr}.workspace-dashboard,.workspace-monitor-features{height:auto;min-height:0}.workspace-dashboard{min-height:540px}.workspace-monitor-features{grid-template-rows:none}.workspace-monitor-item{min-height:180px}.pricing-reference-grid{grid-template-columns:1fr 1fr}.pricing-reference-media{grid-column:1/-1;min-height:420px}.testimonial-stage{min-height:470px}.testimonial-quote{padding:38px}.footer-topline{grid-template-columns:1fr}.footer-contact-card{justify-self:start;align-items:flex-start}.premium-footer-grid{grid-template-columns:repeat(3,1fr)}.premium-footer-bottom{grid-template-columns:1fr}.premium-footer-bottom>span:last-child{text-align:left}} @media(max-width:680px){.future-work-heading{text-align:left}.future-work-heading .eyebrow{margin-inline:0}.future-work-layout{grid-template-columns:1fr;grid-template-rows:auto}.future-feature-card,.future-media-card,.future-attendance-card,.future-accuracy-card,.future-right-stack{grid-column:1;grid-row:auto}.future-feature-card,.future-media-card{min-height:280px}.future-right-stack{grid-template-columns:1fr}.workspace-dashboard{min-height:390px}.workspace-monitor-item{min-height:0;padding:17px}.pricing-reference-grid{grid-template-columns:1fr}.pricing-reference-card,.pricing-reference-media{min-height:420px}.pricing-reference-media{grid-column:auto}.testimonial-stage{min-height:650px}.testimonial-slide{grid-template-columns:1fr;grid-template-rows:300px 1fr}.testimonial-quote{padding:28px}.testimonial-quote blockquote{font-size:28px}.testimonial-thumbs{grid-template-columns:repeat(4,56px);overflow-x:auto}.testimonial-thumbs button{justify-content:center}.testimonial-thumbs span{display:none}.premium-footer-grid{grid-template-columns:1fr 1fr}.footer-brand-lockup{align-items:flex-start;flex-direction:column}.dark-cta-actions{flex-direction:column}.dark-cta-actions .btn{width:100%}} @media(prefers-reduced-motion:reduce){.future-card,.future-pattern,.future-chart i,.workspace-dashboard,.workspace-preview-panel,.workspace-monitor-item,.testimonial-slide,.testimonial-thumbs button,.premium-footer-grid a{transition:none!important}.future-card:hover,.workspace-monitor-item:hover,.testimonial-thumbs button:hover,.premium-footer-grid a:hover{transform:none!important}} /* ===== V1.24 exact V1.22 team visibility restore ===== */ .team-visibility-section{position:relative;overflow:hidden;background:#fff;color:var(--ink)} .team-visibility-section::before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 16% 18%,rgba(255,181,31,.09),transparent 28%),radial-gradient(circle at 84% 82%,rgba(255,97,71,.05),transparent 26%),linear-gradient(rgba(19,29,48,.032) 1px,transparent 1px),linear-gradient(90deg,rgba(19,29,48,.032) 1px,transparent 1px);background-size:auto,auto,72px 72px,72px 72px} .team-visibility-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:48px;min-height:660px;align-items:stretch}.team-visibility-copy,.team-visibility-media{height:660px;min-height:660px}.team-visibility-copy{display:flex;flex-direction:column;justify-content:center;padding:8px 0}.team-visibility-eye{width:max-content;margin-bottom:18px;color:var(--ink);background:rgba(255,255,255,.96);border-color:rgba(17,24,39,.12);box-shadow:0 14px 34px rgba(18,24,40,.08)} .team-visibility-copy h2{max-width:610px;margin:0 0 18px;color:var(--ink);font-family:"Plus Jakarta Sans",Inter,ui-sans-serif,system-ui,sans-serif;font-size:clamp(38px,3.25vw,46px);line-height:1.06;letter-spacing:-.045em}.team-visibility-copy>p{max-width:555px;margin:0;color:var(--muted);font-size:15px;line-height:1.72}.team-feature-list{margin-top:34px;display:flex;flex-direction:column;max-width:575px}.team-feature{position:relative;min-height:128px;padding:17px 16px 17px 34px;border-bottom:1px solid rgba(17,24,39,.08);color:var(--ink);transition:transform .3s ease,opacity .3s ease,background .3s ease}.team-feature-primary{opacity:1;background:linear-gradient(90deg,rgba(255,181,31,.07),rgba(255,255,255,0) 72%)}.team-feature-secondary{opacity:.47}.team-feature-secondary:hover,.team-feature-secondary:focus-visible{opacity:1;transform:translateX(2px);background:linear-gradient(90deg,rgba(17,24,39,.025),rgba(255,255,255,0) 72%)}.team-feature-line{position:absolute;left:0;top:17px;bottom:17px;width:3px;border-radius:999px;background:linear-gradient(180deg,#ffd84d,#ff9c2f,#ff6253);box-shadow:0 0 18px rgba(255,174,31,.20)}.team-feature h3{margin:0 0 9px;color:var(--ink);font-family:"Plus Jakarta Sans",Inter,sans-serif;font-size:22px;line-height:1.16;letter-spacing:-.025em}.team-feature p{max-width:475px;margin:0;color:var(--muted);font-size:13px;line-height:1.66}.team-read-more{display:inline-flex;align-items:center;gap:8px;margin-top:13px;color:#ed8b14;font-size:12px;font-weight:800}.team-read-more b{font-size:16px;line-height:1;transition:transform .28s ease}.team-feature-primary:hover .team-read-more b{transform:translateX(5px)} .team-visibility-media{position:relative;overflow:hidden;border:1px solid rgba(17,24,39,.08);border-radius:28px;background:#f7f8fa;box-shadow:0 30px 70px rgba(17,24,39,.10)}.team-visibility-media::before{content:"";position:absolute;inset:14px;z-index:1;pointer-events:none;border:1px solid rgba(17,24,39,.05);border-radius:22px}.team-visibility-media::after{content:"";position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,0),rgba(17,24,39,.035))}.team-visibility-media img{width:100%;height:100%;object-fit:cover;object-position:center;filter:saturate(.96) contrast(1.01) brightness(.995);transition:transform .62s cubic-bezier(.2,.74,.2,1),filter .4s ease}.team-visibility-media:hover img{transform:scale(1.03);filter:saturate(1) contrast(1.03) brightness(1.01)} @media(max-width:980px){.team-visibility-grid{grid-template-columns:1fr;gap:34px;min-height:0}.team-visibility-copy,.team-visibility-media{height:auto;min-height:0}.team-visibility-copy{justify-content:flex-start}.team-visibility-media{height:520px}.team-feature-list{max-width:none}} @media(max-width:620px){.team-visibility-copy h2{font-size:clamp(34px,9vw,42px)}.team-visibility-media{height:420px}.team-feature{min-height:122px;padding-left:28px;padding-right:0}} @media(prefers-reduced-motion:reduce){.team-feature,.team-read-more b,.team-visibility-media img{transition:none!important}.team-feature:hover,.team-visibility-media:hover img{transform:none!important}} /* ===== V1.24 pricing typography ===== */ .pricing-reference-price{ margin:20px 0 18px; gap:10px; } .pricing-reference-price strong{ font:900 58px/.9 var(--title-font) !important; letter-spacing:-.06em; } .pricing-reference-price small{ padding-bottom:6px !important; color:#c0c6cf !important; font:800 16px/1.1 var(--body-font) !important; } .pricing-reference-media img{ opacity:.70 !important; filter:saturate(.94) contrast(1.02); } /* ===== V1.24 testimonial centered carousel ===== */ .worklix-testimonials-section{ position:relative; overflow:hidden; background:#fff; } .worklix-testimonials-section::before{ content:""; position:absolute; inset:0; pointer-events:none; background: radial-gradient(circle at 16% 30%,rgba(255,191,31,.09),transparent 28%), radial-gradient(circle at 84% 70%,rgba(255,97,82,.06),transparent 28%); } .testimonials-reference-heading{ position:relative; z-index:2; } .testimonial-carousel{ position:relative; z-index:2; margin-top:8px; } .testimonial-carousel-viewport{ overflow:hidden; padding:22px 0 26px; } .testimonial-carousel-track{ display:flex; gap:22px; align-items:stretch; will-change:transform; transition:transform .72s cubic-bezier(.2,.72,.2,1); } .testimonial-carousel-card{ flex:0 0 min(860px,72vw); min-height:440px; display:grid; grid-template-columns:.88fr 1.12fr; overflow:hidden; border:1px solid #e6e9ef; border-radius:28px; background:#fff; box-shadow:0 24px 58px rgba(17,24,39,.08); opacity:.42; transform:scale(.94); transition: transform .6s cubic-bezier(.2,.72,.2,1), opacity .45s ease, box-shadow .45s ease, border-color .45s ease; } .testimonial-carousel-card.is-active{ opacity:1; transform:scale(1); border-color:rgba(255,176,31,.28); box-shadow:0 32px 72px rgba(17,24,39,.12); } .testimonial-carousel-photo{ min-height:440px; overflow:hidden; background:#eef1f5; } .testimonial-carousel-photo img{ width:100%; height:100%; object-fit:cover; object-position:center; } .testimonial-carousel-copy{ display:flex; flex-direction:column; justify-content:center; padding:48px; } .testimonial-carousel-copy>span{ width:max-content; padding:7px 11px; border-radius:999px; background:#fff4cf; color:#8f6100; font-size:10px; font-weight:900; letter-spacing:.05em; text-transform:uppercase; } .testimonial-carousel-copy blockquote{ margin:24px 0 26px; color:#222a35; font:800 clamp(25px,2.3vw,38px)/1.18 var(--title-font); letter-spacing:-.035em; } .testimonial-carousel-copy strong{ color:#252c36; font-size:14px; } .testimonial-carousel-controls{ display:flex; align-items:center; justify-content:center; gap:16px; margin-top:8px; } .testimonial-carousel-arrow{ width:46px; height:46px; border:1px solid var(--line); border-radius:50%; background:#fff; color:#242b35; font-size:18px; cursor:pointer; box-shadow:0 8px 20px rgba(17,24,39,.07); transition:transform .25s ease,border-color .25s ease,background .25s ease; } .testimonial-carousel-arrow:hover{ transform:translateY(-2px); border-color:rgba(255,176,31,.35); background:#fffaf0; } .testimonial-carousel-dots{ display:flex; gap:7px; } .testimonial-carousel-dots button{ width:8px; height:8px; padding:0; border:0; border-radius:999px; background:#d7dce4; cursor:pointer; transition:width .25s ease,background .25s ease; } .testimonial-carousel-dots button.is-active{ width:26px; background:linear-gradient(90deg,#ffd84d,#ff9a2f); } /* ===== V1.24 footer credit ===== */ .footer-credit{ color:#8f97a3; font-size:11px; } .footer-credit a{ color:#ffbf1f !important; font-weight:800; } .footer-credit a:hover{ color:#fff !important; } @media(max-width:760px){ .pricing-reference-price strong{ font-size:50px !important; } .pricing-reference-price small{ font-size:14px !important; } .testimonial-carousel-card{ flex-basis:88vw; min-height:600px; grid-template-columns:1fr; grid-template-rows:300px 1fr; } .testimonial-carousel-photo{ min-height:300px; } .testimonial-carousel-copy{ padding:28px; } } @media(prefers-reduced-motion:reduce){ .testimonial-carousel-track, .testimonial-carousel-card, .testimonial-carousel-arrow{ transition:none!important; } } /* ===== V1.25 linked Product menu label ===== */ .nav-item-linked{ display:flex; align-items:center; gap:2px; } .nav-main-link{ display:inline-flex; align-items:center; min-height:42px; padding:0 2px 0 10px; color:var(--ink); font-size:13px; font-weight:700; } .nav-main-link:hover{color:#d98700} .nav-mega-toggle{ min-width:28px !important; width:28px; height:42px; padding:0 !important; display:grid !important; place-items:center; } /* ========================================================= V1.32 GLOBAL INNER-PAGE SYSTEM — EXACT HOME CLONE Home is untouched. Inner pages reuse Home's actual values. ========================================================= */ :root{ --inner-section-title-size:clamp(31px,3vw,44px); --inner-section-title-line:1.08; --inner-section-title-track:-.038em; --inner-section-copy-size:17px; --inner-section-copy-line:1.62; --inner-card-title-size:20px; --inner-card-copy-size:14px; --inner-heading-gap:40px; --inner-cta-title-size:clamp(34px,3.6vw,52px); --inner-cta-title-line:1.04; } /* Exact Home section-title values, scoped away from Home */ body:not(.home) .section h2, body:not(.home) .section-heading h2, body:not(.home) .intro-row h2, body:not(.home) .section-copy h2{ font-size:var(--inner-section-title-size); line-height:var(--inner-section-title-line); letter-spacing:var(--inner-section-title-track); text-wrap:balance; } /* Exact Home title margins */ body:not(.home) .section-heading h2, body:not(.home) .intro-row h2, body:not(.home) .section-copy h2{ margin:14px 0 0; } /* Exact Home centered title width/alignment */ body:not(.home) .section-heading h2{ max-width:760px; margin-left:auto; margin-right:auto; } /* Exact Home section copy */ body:not(.home) .intro-row p, body:not(.home) .section-heading p, body:not(.home) .section-copy>p{ color:var(--muted); font-size:var(--inner-section-copy-size); line-height:var(--inner-section-copy-line); } /* Exact Home card typography */ body:not(.home) .feature-card h3{ font-size:var(--inner-card-title-size); margin:0 0 10px; } body:not(.home) .feature-card p{ color:var(--muted); font-size:var(--inner-card-copy-size); margin:0; } /* Exact Home section rhythm */ body:not(.home) .section{ padding-block:var(--global-section-space); } body:not(.home) .section-heading{ margin-bottom:var(--inner-heading-gap); } /* Exact Home CTA typography */ body:not(.home) .worklix-dark-cta .dark-cta-inner h2{ margin:16px auto 14px; max-width:760px; color:#fff; font-size:var(--inner-cta-title-size); line-height:var(--inner-cta-title-line); } body:not(.home) .worklix-dark-cta .dark-cta-inner p{ max-width:650px; margin:0 auto; color:#aab1bc; font-size:15px; line-height:1.65; } /* Two-line helper for inner pages */ body:not(.home) h2 .title-line{ display:block; } @media(min-width:1121px){ body:not(.home) h2 .title-line{white-space:nowrap} } /* ========================================================= PRODUCT PAGE — CLEAN, HOME-MATCHED ========================================================= */ .product-main-hero .product-main-hero-grid{ display:grid; grid-template-columns:minmax(0,75%) minmax(0,25%); align-items:center; } .product-main-hero .hubstaff-hero-copy{ grid-column:1; width:100%; max-width:none; } .product-main-hero .product-hero-dashboard{display:none!important} /* Product headings explicitly inherit the exact Home title rules */ .product-pillars-section h2, .product-motion-title, .product-premium-copy h2, .product-capability-heading h2{ font-size:var(--inner-section-title-size)!important; line-height:var(--inner-section-title-line)!important; letter-spacing:var(--inner-section-title-track)!important; margin:14px 0 0!important; text-wrap:balance; } .product-motion-heading h2, .product-capability-heading h2, .product-pillars-section .section-heading h2{ max-width:760px; margin-left:auto!important; margin-right:auto!important; } /* Product section copy = exact Home section copy */ .product-motion-heading p, .product-premium-copy>p, .product-capability-heading p{ color:var(--muted); font-size:var(--inner-section-copy-size)!important; line-height:var(--inner-section-copy-line)!important; } /* Product card titles/copy = exact Home feature-card values */ .product-pillar-card h3, .product-motion-card h3, .product-structure-grid strong, .product-decision-grid strong, .product-capability-premium-grid strong{ font-size:var(--inner-card-title-size)!important; line-height:1.2; margin:0 0 10px; } .product-pillar-card p, .product-motion-card p, .product-structure-grid small, .product-decision-grid span, .product-capability-premium-grid p{ color:var(--muted); font-size:var(--inner-card-copy-size)!important; line-height:1.6; } /* Product section spacing follows Home exactly */ .product-pillars-section .section-heading, .product-motion-heading, .product-capability-heading{ margin-bottom:var(--inner-heading-gap); } /* Pillars */ .product-pillar-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; } .product-pillar-card{ min-height:255px; height:100%; padding:28px; } .product-pillar-icon{ width:46px;height:46px;display:grid;place-items:center; border-radius:14px;background:#fff4d7;color:#d98700; } .product-pillar-icon svg{ width:23px;height:23px;fill:none;stroke:currentColor;stroke-width:1.8; stroke-linecap:round;stroke-linejoin:round; } .product-pillar-kicker{ margin-top:24px;color:#a36a00;font-size:10px;font-weight:900; letter-spacing:.06em;text-transform:uppercase; } .product-pillar-card h3{margin-top:7px} .product-pillar-card .product-pillar-btn{width:100%;margin-top:auto} .product-pillar-card .btn-label{flex:1;text-align:left} /* Drive scroll-expansion section */ .product-scroll-expansion{ position:relative; min-height:1500px; overflow:clip; background:#fff; } .product-scroll-bg{ position:absolute;inset:0;pointer-events:none; background: radial-gradient(circle at 50% 34%,rgba(255,191,31,.12),transparent 30%), linear-gradient(rgba(17,24,39,.024) 1px,transparent 1px), linear-gradient(90deg,rgba(17,24,39,.024) 1px,transparent 1px); background-size:auto,72px 72px,72px 72px; } .product-scroll-sticky{ position:sticky; top:96px; min-height:calc(100vh - 96px); display:flex; align-items:center; padding:var(--global-section-space) 0; } .product-scroll-shell{position:relative;width:100%} .product-motion-heading{ position:relative;z-index:3;max-width:940px;margin-left:auto;margin-right:auto;text-align:center; } .product-motion-heading .eyebrow{margin-inline:auto} .product-motion-title span{display:block;will-change:transform,opacity} .product-motion-heading p{max-width:760px;margin:16px auto 0} .product-scroll-media{ position:relative;z-index:2;width:min(860px,68%);margin:0 auto;overflow:hidden; border:1px solid rgba(17,24,39,.08);border-radius:28px;background:#fff; box-shadow:0 30px 72px rgba(17,24,39,.13); transform:scale(.76);transform-origin:center;opacity:.82;will-change:transform,opacity; } .product-scroll-media img{width:100%;aspect-ratio:4/3;display:block;object-fit:cover;object-position:center} .product-motion-content{ position:relative;z-index:3;max-width:980px;margin:30px auto 0; display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px; opacity:0;transform:translateY(26px);will-change:transform,opacity; } .product-motion-card{ min-height:255px; padding:28px; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .product-motion-card::before{ content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--gradient); transform:scaleX(0);transform-origin:left;transition:transform .3s ease; } .product-motion-card:hover{ transform:translateY(-5px); border-color:rgba(255,176,31,.30); box-shadow:var(--shadow); } .product-motion-card:hover::before{transform:scaleX(1)} .product-motion-card>span{ display:inline-block;margin-bottom:18px;color:#a36a00;font-size:10px;font-weight:900; letter-spacing:.06em;transition:transform .3s ease; } .product-motion-card:hover>span{transform:translateY(-2px) rotate(-4deg)} /* Premium split sections */ .product-premium-section{position:relative;overflow:hidden;background:#fff} .product-premium-section::before{ content:"";position:absolute;inset:0;pointer-events:none; background: radial-gradient(circle at 14% 12%,rgba(255,191,31,.07),transparent 28%), radial-gradient(circle at 86% 88%,rgba(255,97,82,.045),transparent 28%); } .product-premium-split{ position:relative;z-index:1;display:grid;grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px;align-items:stretch; } .product-premium-media,.product-premium-copy{height:600px;min-height:600px} .product-premium-media{ position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden; border:1px solid var(--line);border-radius:28px;background:linear-gradient(145deg,#fffaf0,#f7faff); box-shadow:0 22px 54px rgba(17,24,39,.08); } .product-premium-copy{display:flex;flex-direction:column;justify-content:center;padding-block:24px} .product-premium-copy h2{max-width:610px!important} .product-premium-copy>p{max-width:610px;margin:16px 0 0} .product-media-frame{ width:88%;overflow:hidden;border:1px solid rgba(17,24,39,.08);border-radius:20px; background:#fff;box-shadow:0 20px 48px rgba(17,24,39,.11); transition:transform .3s ease,box-shadow .3s ease; } .product-media-frame img{width:100%;display:block} .product-premium-media:hover .product-media-frame{ transform:translateY(-5px) scale(1.012);box-shadow:0 30px 62px rgba(17,24,39,.15); } .product-media-badge{ position:absolute;min-width:126px;padding:13px 15px;border:1px solid rgba(17,24,39,.08); border-radius:15px;background:rgba(255,255,255,.94);box-shadow:0 16px 34px rgba(17,24,39,.11); } .product-media-badge strong{display:block;font-size:21px} .product-media-badge span{display:block;margin-top:5px;color:#7a8390;font-size:9px;font-weight:700} .product-media-badge-one{left:18px;top:18px} .product-media-badge-two{right:18px;bottom:18px} /* Structure blocks */ .product-structure-grid{ margin-top:24px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px; } .product-structure-grid a{ min-height:130px;display:grid;grid-template-columns:36px minmax(0,1fr) auto; gap:12px;align-items:center;padding:17px;border:1px solid var(--line);border-radius:17px; background:#fff;color:var(--ink);box-shadow:0 8px 20px rgba(17,24,39,.035); transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .product-structure-grid a:hover{ transform:translateY(-5px);border-color:rgba(255,176,31,.34);box-shadow:0 20px 40px rgba(17,24,39,.09); } .product-mini-icon{ width:36px;height:36px;display:grid;place-items:center;border-radius:10px; background:#fff3cc;color:#9c6800;font-size:9px;font-weight:900;transition:transform .3s ease; } .product-structure-grid a:hover .product-mini-icon{transform:rotate(-6deg) scale(1.06)} .product-structure-grid div{display:flex;flex-direction:column} .product-structure-grid strong{margin:0 0 6px} .product-structure-grid b{font-size:16px;transition:transform .25s ease} .product-structure-grid a:hover b{transform:translateX(4px)} /* Analytics */ .product-analytics-premium{background:#fffdf8} .product-analytics-copy{order:1} .product-analytics-media{order:2;padding:24px} .product-analytics-dashboard{ width:100%;height:100%;overflow:hidden;border-radius:21px;background:#fff; box-shadow:0 18px 44px rgba(17,24,39,.10); } .product-analytics-dashboard img{ width:100%;height:100%;object-fit:contain;object-position:center;background:#fff;transition:transform .3s ease; } .product-analytics-media:hover .product-analytics-dashboard img{transform:scale(1.02)} .product-analytics-float{ position:absolute;left:18px;bottom:18px;min-width:136px;padding:13px 15px; border:1px solid rgba(17,24,39,.08);border-radius:15px;background:rgba(255,255,255,.95); box-shadow:0 15px 32px rgba(17,24,39,.11); } .product-analytics-float-two{left:auto;right:18px;top:18px;bottom:auto} .product-analytics-float span,.product-analytics-float small{display:block;color:#7a8390;font-size:9px;font-weight:700} .product-analytics-float strong{display:block;margin:5px 0 3px;font-size:20px} .product-decision-grid{ margin-top:24px;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;align-items:stretch; } .product-decision-grid div{ min-height:124px;height:100%;display:flex;flex-direction:column;justify-content:center;padding:17px; border:1px solid var(--line);border-radius:16px;background:#fff; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .product-decision-grid div:hover{ transform:translateY(-5px);border-color:rgba(255,176,31,.34);box-shadow:0 18px 38px rgba(17,24,39,.08); } .product-decision-grid strong{margin:0 0 6px} .product-analytics-btn{width:100%;margin-top:22px} .product-analytics-btn .btn-label{flex:1;text-align:left} /* Capability cards */ .product-capability-heading h2,.product-capability-heading p{max-width:720px} .product-capability-heading p{margin:16px auto 0} .product-capability-premium-grid{ display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px; } .product-capability-premium-grid a{ position:relative;min-height:255px;height:100%;padding:28px;display:flex;flex-direction:column; justify-content:space-between;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius); background:#fff;color:var(--ink);box-shadow:0 12px 28px rgba(17,24,39,.05); opacity:0;transform:translateY(20px); transition:opacity .45s ease var(--card-delay),transform .45s ease var(--card-delay),border-color .3s ease,box-shadow .3s ease; } .product-capability-section.is-visible .product-capability-premium-grid a{opacity:1;transform:none} .product-capability-premium-grid a::before{ content:"";position:absolute;left:0;top:0;width:100%;height:3px;background:var(--gradient); transform:scaleX(0);transform-origin:left;transition:transform .3s ease; } .product-capability-premium-grid a:hover{ transform:translateY(-5px)!important;border-color:rgba(255,176,31,.34);box-shadow:var(--shadow); } .product-capability-premium-grid a:hover::before{transform:scaleX(1)} .capability-number{ width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#fff4d7; color:#9c6800;font-size:9px;font-weight:900;transition:transform .3s ease; } .product-capability-premium-grid a:hover .capability-number{transform:rotate(-6deg) scale(1.06)} .product-capability-premium-grid strong{display:block;margin:20px 0 10px} .product-capability-premium-grid p{margin:0} .capability-arrow{align-self:flex-end;color:#986600;font-size:18px;font-weight:900;transition:transform .28s ease} .product-capability-premium-grid a:hover .capability-arrow{transform:translateX(5px)} /* Reveal */ [data-product-reveal] .product-premium-media, [data-product-reveal] .product-premium-copy{ opacity:0;transform:translateY(24px);transition:opacity .62s ease,transform .62s ease; } [data-product-reveal] .product-premium-copy{transition-delay:.08s} [data-product-reveal].is-visible .product-premium-media, [data-product-reveal].is-visible .product-premium-copy{opacity:1;transform:none} /* Product CTA exact Home CTA sizing */ .product-final-cta .dark-cta-inner h2{ font-size:var(--inner-cta-title-size)!important; line-height:var(--inner-cta-title-line)!important; margin:16px auto 14px!important; max-width:760px!important; } .product-final-cta .dark-cta-inner p{ max-width:650px!important; margin:0 auto!important; font-size:15px!important; line-height:1.65!important; } /* Footer one-line desktop behavior retained */ .footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:18px;flex-wrap:nowrap} .footer-bottom>span{white-space:nowrap} .footer-credit{margin-left:auto} .premium-footer-bottom{ display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:18px!important; } .premium-footer-bottom>div{ min-width:0;display:flex!important;align-items:center!important;justify-content:center!important; gap:14px!important;flex-wrap:nowrap!important;white-space:nowrap; } .premium-footer-bottom .footer-credit{display:inline-flex!important;align-items:center;white-space:nowrap} /* Responsive values copied from Home */ @media(max-width:1120px){ .product-pillar-grid,.product-capability-premium-grid{grid-template-columns:repeat(2,minmax(0,1fr))} .product-scroll-expansion{min-height:1280px} .product-scroll-media{width:76%} body:not(.home) h2 .title-line,.product-motion-title span{white-space:normal} } @media(max-width:980px){ .product-main-hero .product-main-hero-grid{grid-template-columns:1fr} .product-premium-split{grid-template-columns:1fr;gap:30px} .product-premium-media,.product-premium-copy{height:auto;min-height:0} .product-premium-media{min-height:500px} .product-scroll-expansion{min-height:0} .product-scroll-sticky{position:relative;top:auto;min-height:0} .product-scroll-media{width:100%;transform:none!important;opacity:1!important} .product-motion-title span{transform:none!important;opacity:1!important} .product-motion-content{opacity:1!important;transform:none!important} } @media(max-width:820px){ body:not(.home) .section h2, body:not(.home) .section-heading h2, body:not(.home) .intro-row h2, body:not(.home) .section-copy h2, .product-pillars-section h2, .product-motion-title, .product-premium-copy h2, .product-capability-heading h2{ font-size:clamp(29px,6vw,38px)!important; } } @media(max-width:620px){ body:not(.home) .section h2, body:not(.home) .section-heading h2, body:not(.home) .intro-row h2, body:not(.home) .section-copy h2, .product-pillars-section h2, .product-motion-title, .product-premium-copy h2, .product-capability-heading h2{ font-size:clamp(28px,7.5vw,34px)!important; } .product-pillar-grid,.product-capability-premium-grid,.product-motion-content, .product-structure-grid,.product-decision-grid{grid-template-columns:1fr} .product-premium-media{min-height:390px} .product-pillar-card,.product-capability-premium-grid a,.product-motion-card{min-height:auto} body:not(.home) h2 .title-line{white-space:normal} } @media(prefers-reduced-motion:reduce){ .product-scroll-media,.product-motion-title span,.product-motion-content, [data-product-reveal] .product-premium-media,[data-product-reveal] .product-premium-copy, .product-motion-card,.product-structure-grid a,.product-decision-grid div, .product-capability-premium-grid a,.capability-number,.capability-arrow{ transition:none!important;transform:none!important;opacity:1!important; } } /* ========================================================= V1.34 REFERENCE TESTIMONIAL + PRODUCT FLOW FIXES ========================================================= */ /* Home testimonial background is deliberately inherited/unchanged. */ .home-reference-testimonials{ position:relative; overflow:hidden; } .home-reference-testimonials .testimonials-reference-heading{ position:relative; z-index:3; margin-bottom:34px; } .reference-testimonial-window{ position:relative; height:560px; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:18px; overflow:hidden; max-width:860px; } .reference-testimonial-lane{ position:relative; height:100%; overflow:hidden; } .reference-testimonial-lane-right{padding-top:34px} .reference-testimonial-track{ display:flex; flex-direction:column; gap:18px; will-change:transform; } .reference-testimonial-track-down{ animation:testimonial-down 9s linear infinite; } .reference-testimonial-track-up{ animation:testimonial-up 9s linear infinite; } .reference-testimonial-window:hover .reference-testimonial-track{ animation-play-state:paused; } .reference-testimonial-card{ flex:0 0 208px; min-height:208px; padding:26px; display:flex; flex-direction:column; justify-content:space-between; border:1px solid var(--line); border-radius:20px; background:rgba(255,255,255,.94); box-shadow:0 12px 32px rgba(17,24,39,.05); transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .reference-testimonial-card:hover{ transform:translateY(-4px); border-color:rgba(255,176,31,.30); box-shadow:0 22px 44px rgba(17,24,39,.09); } .reference-testimonial-card>p{ margin:0; color:#333b47; font-size:14px; line-height:1.65; } .reference-testimonial-person{ margin-top:22px; display:flex; align-items:center; gap:12px; } .reference-testimonial-person img{ width:42px; height:42px; flex:0 0 42px; object-fit:cover; border-radius:50%; } .reference-testimonial-person div{display:flex;flex-direction:column} .reference-testimonial-person strong{color:var(--ink);font-size:13px;line-height:1.2} .reference-testimonial-person span{margin-top:4px;color:var(--muted);font-size:11px} .reference-testimonial-fade{ position:absolute; left:0; right:0; height:76px; z-index:2; pointer-events:none; } .reference-testimonial-fade-top{ top:0; background:linear-gradient(to bottom,var(--surface,#fff),transparent); } .reference-testimonial-fade-bottom{ bottom:0; background:linear-gradient(to top,var(--surface,#fff),transparent); } @keyframes testimonial-up{ from{transform:translateY(0)} to{transform:translateY(calc(-50% - 9px))} } @keyframes testimonial-down{ from{transform:translateY(calc(-50% - 9px))} to{transform:translateY(0)} } /* Product in motion: remove oversized dead space above heading. */ .product-scroll-expansion{ min-height:1180px!important; } .product-scroll-sticky{ top:80px!important; min-height:calc(100vh - 80px)!important; padding-top:24px!important; padding-bottom:44px!important; align-items:flex-start!important; } .product-motion-heading{ margin-top:0!important; margin-bottom:28px!important; } .product-motion-content{ margin-top:24px!important; } .product-motion-card{ min-height:270px!important; height:270px; } .product-motion-card p{ min-height:90px; } /* Workforce diagram: compact Home-like top/bottom spacing. */ .workforce-flow-section{ overflow:hidden; background:#fff; padding-top:72px!important; padding-bottom:72px!important; } .workforce-flow-heading{ max-width:900px; margin-left:auto; margin-right:auto; margin-bottom:30px!important; } .workforce-flow-heading p{ max-width:720px; margin:16px auto 0; } .workforce-flow-board{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.82fr) minmax(0,1fr); gap:78px; align-items:center; min-height:430px; padding:20px 24px 12px; } .workforce-flow-column{ position:relative; display:flex; flex-direction:column; gap:14px; } .workforce-flow-label{ margin-bottom:4px; color:#4d5561; font-size:10px; font-weight:900; letter-spacing:.14em; text-transform:uppercase; text-align:center; } .workforce-flow-node{ min-height:82px; display:grid; grid-template-columns:44px minmax(0,1fr); gap:14px; align-items:center; padding:14px 16px; border:1px solid var(--line); border-radius:15px; background:#fff; color:var(--ink); box-shadow:0 10px 24px rgba(17,24,39,.05); transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .workforce-flow-node:hover{ transform:translateY(-4px); border-color:rgba(255,176,31,.34); box-shadow:0 18px 38px rgba(17,24,39,.09); } .workforce-node-icon{ width:44px; height:44px; display:grid; place-items:center; border-radius:11px; background:#fff1c3; color:#d68b00; transition:transform .3s ease; } .workforce-node-icon-output{background:#daf9f4;color:#00a993} .workforce-node-icon svg{ width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.8; stroke-linecap:round;stroke-linejoin:round; } .workforce-flow-node:hover .workforce-node-icon{transform:scale(1.08) rotate(-4deg)} .workforce-flow-node strong{ display:block;margin:0 0 5px;font-family:var(--title-font); font-size:20px;line-height:1.2;letter-spacing:-.025em; } .workforce-flow-node span:not(.workforce-node-icon){ display:block;color:var(--muted);font-size:14px;line-height:1.5; } .workforce-flow-center{ position:relative; min-height:330px; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; } .workforce-flow-center .workforce-flow-label{ position:absolute; top:0;left:0;right:0; } .workforce-flow-orbit{ position:relative; width:190px; height:190px; display:grid; place-items:center; } .workforce-orbit-ring{ position:absolute; border-radius:50%; } .workforce-orbit-ring-one{ inset:7px; border:1px dashed #c6cce0; animation:workforce-spin 7s linear infinite; } .workforce-orbit-ring-two{ inset:25px; border:1px solid #e6e8f4; animation:workforce-spin-reverse 5s linear infinite; } .workforce-orbit-ring-three{ inset:42px; border:1px dashed rgba(103,89,255,.24); animation:workforce-pulse-ring 2.2s ease-in-out infinite; } .workforce-flow-core{ position:relative; z-index:3; width:110px; height:110px; display:grid; place-items:center; padding:19px; border:9px solid #f1ecff; border-radius:50%; background:#fff; box-shadow:0 18px 44px rgba(90,76,185,.16); animation:workforce-core-breathe 2.4s ease-in-out infinite; } .workforce-flow-core img{ width:100%; height:auto; display:block; object-fit:contain; } .workforce-orbit-dot{ position:absolute; z-index:4; width:8px; height:8px; border-radius:50%; background:#6759ff; box-shadow:0 0 0 5px rgba(103,89,255,.10); } .workforce-orbit-dot-one{top:5px;left:91px;animation:workforce-dot-pulse 1.4s ease-in-out infinite} .workforce-orbit-dot-two{right:14px;bottom:45px;animation:workforce-dot-pulse 1.4s .45s ease-in-out infinite} .workforce-orbit-dot-three{left:14px;bottom:45px;animation:workforce-dot-pulse 1.4s .9s ease-in-out infinite} .workforce-flow-center p{ max-width:270px; margin:16px 0 0; color:var(--muted); font-size:14px; line-height:1.6; } /* animated data streams, matching the reference's moving direction */ .workforce-flow-stream{ position:absolute; top:51%; width:82px; height:30px; transform:translateY(-50%); overflow:visible; pointer-events:none; } .workforce-flow-stream-in{left:calc(33.333% - 24px)} .workforce-flow-stream-out{right:calc(33.333% - 24px)} .stream-line{ position:absolute; left:0;right:12px;top:14px; height:2px; background:linear-gradient(90deg,rgba(103,89,255,.2),#6759ff); } .workforce-flow-stream b{ position:absolute; right:0; top:-4px; color:#6759ff; font-size:36px; line-height:1; } .stream-dot{ position:absolute; top:10px; left:0; width:9px; height:9px; border-radius:50%; background:#6759ff; box-shadow:0 0 0 4px rgba(103,89,255,.11); animation:workforce-travel 2s linear infinite; } .stream-dot-b{animation-delay:-1s} .workforce-flow-stream-out .stream-dot{ background:#08bbaa; box-shadow:0 0 0 4px rgba(8,187,170,.10); } .workforce-flow-stream-out .stream-line{ background:linear-gradient(90deg,rgba(8,187,170,.2),#08bbaa); } .workforce-flow-stream-out b{color:#08bbaa} @keyframes workforce-travel{ 0%{transform:translateX(0) scale(.7);opacity:0} 15%{opacity:1} 85%{opacity:1} 100%{transform:translateX(62px) scale(1);opacity:0} } @keyframes workforce-spin{to{transform:rotate(360deg)}} @keyframes workforce-spin-reverse{to{transform:rotate(-360deg)}} @keyframes workforce-pulse-ring{ 0%,100%{transform:scale(.92);opacity:.55} 50%{transform:scale(1.07);opacity:1} } @keyframes workforce-core-breathe{ 0%,100%{transform:scale(.98)} 50%{transform:scale(1.035)} } @keyframes workforce-dot-pulse{ 0%,100%{transform:scale(.8);opacity:.55} 50%{transform:scale(1.25);opacity:1} } /* Scroll entrance similar to reference: columns and core arrive together. */ .workforce-flow-section .workforce-flow-inputs, .workforce-flow-section .workforce-flow-center, .workforce-flow-section .workforce-flow-outcomes{ opacity:0; transform:translateY(22px); } .workforce-flow-section.is-visible .workforce-flow-inputs, .workforce-flow-section.is-visible .workforce-flow-center, .workforce-flow-section.is-visible .workforce-flow-outcomes{ opacity:1; transform:none; transition:opacity .55s ease,transform .55s ease; } .workforce-flow-section.is-visible .workforce-flow-center{transition-delay:.08s} .workforce-flow-section.is-visible .workforce-flow-outcomes{transition-delay:.16s} @media(max-width:980px){ .product-scroll-expansion{min-height:0!important} .product-scroll-sticky{ position:relative!important; top:auto!important; min-height:0!important; padding-top:48px!important; padding-bottom:48px!important; } .product-motion-card{height:auto} .workforce-flow-section{ padding-top:56px!important; padding-bottom:56px!important; } .workforce-flow-board{ grid-template-columns:1fr; gap:26px; padding-inline:0; } .workforce-flow-center{order:2;min-height:300px} .workforce-flow-inputs{order:1} .workforce-flow-outcomes{order:3} .workforce-flow-stream{display:none} } @media(max-width:680px){ .reference-testimonial-window{ height:510px; grid-template-columns:1fr; max-width:100%; } .reference-testimonial-lane-right{display:none} .reference-testimonial-card{ flex-basis:198px; min-height:198px; padding:22px; } } @media(prefers-reduced-motion:reduce){ .reference-testimonial-track, .workforce-orbit-ring, .workforce-flow-core, .workforce-orbit-dot, .stream-dot{ animation:none!important; } .workforce-flow-section .workforce-flow-inputs, .workforce-flow-section .workforce-flow-center, .workforce-flow-section .workforce-flow-outcomes{ opacity:1!important; transform:none!important; transition:none!important; } } /* V1.35 Pricing price typography = global section H2 scale */ .pricing-reference-price strong, .pricing-reference-price{ font-family:var(--title-font)!important; } .pricing-reference-price strong{ font-size:clamp(31px,3vw,44px)!important; line-height:1.08!important; letter-spacing:-.038em!important; font-weight:800!important; } /* V1.35 Analytics CTA inline */ .product-analytics-btn{ width:max-content!important; min-width:0!important; } .product-analytics-btn .btn-label{ flex:0 0 auto!important; text-align:center!important; } /* ========================================================= V1.38 PRODUCT POLISH Global Home-matched typography, spacing and clean flip cards. ========================================================= */ /* Workforce: arrows/connectors removed completely */ .workforce-flow-connector, .workforce-flow-stream{ display:none!important; } /* Keep only the animated circular processing visual */ .workforce-orbit-runner{ position:absolute; inset:0; z-index:5; border-radius:50%; pointer-events:none; animation:workforce-orbit-run 5.4s linear infinite; } .workforce-orbit-runner-two{ inset:18px; animation-duration:4.6s; animation-direction:reverse; } .workforce-orbit-runner-three{ inset:34px; animation-duration:3.8s; } .workforce-orbit-runner i{ position:absolute; top:-4px; left:50%; width:8px; height:8px; margin-left:-4px; border-radius:50%; background:#6759ff; box-shadow:0 0 0 5px rgba(103,89,255,.10); } .workforce-orbit-runner-two i{ background:#ffad21; box-shadow:0 0 0 5px rgba(255,173,33,.10); } .workforce-orbit-runner-three i{ background:#08bbaa; box-shadow:0 0 0 5px rgba(8,187,170,.10); } @keyframes workforce-orbit-run{ to{transform:rotate(360deg)} } /* Everything managers... icons perfectly centered inside background */ .product-pillar-icon{ display:flex!important; align-items:center!important; justify-content:center!important; line-height:0!important; padding:0!important; } .product-pillar-icon svg{ display:block!important; margin:auto!important; transform:none!important; } /* Product page uses the same global section rhythm as Home */ .product-pillars-section, .workforce-flow-section, .product-analytics-section, .capability-flip-section{ padding-top:var(--global-section-space)!important; padding-bottom:var(--global-section-space)!important; } .product-pillars-section .section-heading, .workforce-flow-heading, .product-capability-heading{ margin-bottom:40px!important; } .product-premium-copy h2{ margin-top:14px!important; } .product-premium-copy>p{ margin-top:16px!important; } /* Workforce section balanced spacing */ .workforce-flow-section{ overflow:hidden; background:#fff; } .workforce-flow-heading{ max-width:900px; margin-left:auto; margin-right:auto; } .workforce-flow-heading p{ max-width:720px; margin:16px auto 0; } .workforce-flow-board{ position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,.82fr) minmax(0,1fr); column-gap:78px; align-items:center; min-height:430px; padding:8px 24px 0; } /* Capability section: all 8 cards, static 4x2 grid, true flip */ .capability-flip-section{ overflow:hidden; background:#fff; } .capability-flip-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:18px; align-items:stretch; perspective:1400px; } .capability-flip-card{ position:relative; min-height:360px; text-decoration:none; color:inherit; perspective:1200px; } .capability-flip-inner{ position:relative; display:block; width:100%; min-height:360px; height:100%; transform-style:preserve-3d; transition:transform .72s cubic-bezier(.2,.74,.2,1); } .capability-flip-card:hover .capability-flip-inner, .capability-flip-card:focus-visible .capability-flip-inner{ transform:rotateY(180deg); } .capability-flip-face{ position:absolute; inset:0; display:flex; flex-direction:column; padding:26px; border:1px solid var(--line); border-radius:18px; overflow:hidden; backface-visibility:hidden; -webkit-backface-visibility:hidden; box-shadow:0 12px 28px rgba(17,24,39,.06); } .capability-flip-front{ background:#fff; color:#252a33; } .capability-flip-back{ transform:rotateY(180deg); background:#252a33; color:#fff; border-color:#252a33; } /* Worklix palette */ .capability-flip-dark .capability-flip-front{ background:#252a33; color:#fff; border-color:#252a33; } .capability-flip-dark .capability-flip-back{ background:#ffd85a; color:#252a33; border-color:#ffd85a; } .capability-flip-yellow .capability-flip-front{ background:#ffd85a; color:#252a33; border-color:#ffd85a; } .capability-flip-yellow .capability-flip-back{ background:#fff; color:#252a33; } .capability-flip-light .capability-flip-back{ background:linear-gradient(145deg,#ffb52a,#ff7f50); color:#252a33; border-color:#ff9e39; } .capability-flip-icon{ width:48px; height:48px; flex:0 0 48px; display:flex; align-items:center; justify-content:center; padding:0; border-radius:14px; background:rgba(255,184,31,.16); color:#d98d00; line-height:0; } .capability-flip-dark .capability-flip-icon{ background:rgba(255,255,255,.12); color:#ffd85a; } .capability-flip-yellow .capability-flip-icon{ background:rgba(255,255,255,.55); color:#252a33; } .capability-flip-icon-back{ background:rgba(255,255,255,.14)!important; color:currentColor!important; } .capability-flip-icon svg{ width:23px; height:23px; display:block; margin:auto; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } /* Card titles: exact global Home card title settings */ .capability-flip-face>strong{ display:block; margin:10px 0 12px; font-family:var(--title-font)!important; font-size:20px!important; line-height:1.2!important; letter-spacing:-.025em!important; font-weight:800!important; } .capability-flip-number{ margin-top:24px; font-size:10px; font-weight:900; letter-spacing:.09em; opacity:.62; } /* Front paragraph visually ~3 lines */ .capability-flip-front .capability-flip-copy{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:3; overflow:hidden; min-height:67px; font-size:14px!important; line-height:1.6!important; } /* Back paragraph visually ~5 lines */ .capability-flip-back .capability-flip-copy{ display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:5; overflow:hidden; min-height:112px; font-size:14px!important; line-height:1.6!important; } .capability-flip-hint{ margin-top:auto; padding-top:22px; border-top:1px solid currentColor; border-top-color:color-mix(in srgb,currentColor 18%,transparent); font-size:11px; font-weight:800; opacity:.68; } .capability-flip-back{ justify-content:flex-start; } .capability-flip-back .capability-flip-icon{ margin-bottom:18px; } .capability-flip-button-wrap{ margin-top:auto; padding-top:18px; display:block; } .capability-flip-btn{ width:100%; } .capability-flip-btn .btn-label{ flex:1; text-align:left; } /* Existing Home-style card hover depth */ .capability-flip-card:hover .capability-flip-face{ box-shadow:0 22px 46px rgba(17,24,39,.11); } /* Responsive */ @media(max-width:1100px){ .capability-flip-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:980px){ .workforce-flow-board{ grid-template-columns:1fr; gap:26px; padding-inline:0; } .workforce-flow-center{ order:2; min-height:300px; } .workforce-flow-inputs{order:1} .workforce-flow-outcomes{order:3} } @media(max-width:620px){ .capability-flip-grid{ grid-template-columns:1fr; } .capability-flip-card, .capability-flip-inner{ min-height:350px; } } @media(hover:none){ .capability-flip-card:hover .capability-flip-inner{ transform:none; } .capability-flip-card:focus .capability-flip-inner{ transform:rotateY(180deg); } } @media(prefers-reduced-motion:reduce){ .workforce-orbit-runner{ animation:none!important; } .capability-flip-inner{ transition:none!important; } } /* ========================================================= V1.41 SOLUTIONS MAIN PAGE IMPORTANT: typography comes from the GLOBAL Home-matched system. No Solutions-specific H2/H3/paragraph font-size or weight overrides. ========================================================= */ .solutions-main-hero .hubstaff-hero-copy{ max-width:none; } .solutions-main-hero h1{ max-width:1040px; } /* --------------------------------- Team model section --------------------------------- */ .solutions-models-section{ background:#fff; } .solutions-models-grid{ display:grid; grid-template-columns:1.16fr .84fr; grid-template-rows:repeat(2,310px); gap:18px; } .solutions-model-card{ position:relative; overflow:hidden; border:1px solid var(--line); border-radius:var(--radius); background:#fff; box-shadow:0 14px 34px rgba(17,24,39,.06); transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .solutions-model-large{ grid-row:1/3; } .solutions-model-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform .55s ease; } .solutions-model-overlay{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(17,24,39,.04),rgba(17,24,39,.83)); } .solutions-model-copy{ position:absolute; left:0; right:0; bottom:0; z-index:2; padding:28px; color:#fff; } .solutions-model-kicker{ display:block; margin-bottom:8px; font-size:10px; font-weight:900; letter-spacing:.1em; text-transform:uppercase; } .solutions-model-copy h3{ margin:0 0 10px; } .solutions-model-copy p{ margin:0; max-width:560px; color:rgba(255,255,255,.82); } .solutions-model-card:hover{ transform:translateY(-5px); border-color:rgba(255,176,31,.34); box-shadow:var(--shadow); } .solutions-model-card:hover img{ transform:scale(1.04); } .solutions-model-static-card{ display:flex; flex-direction:column; padding:28px; } .solutions-model-static-card .solutions-model-kicker{ margin-top:20px; color:#9c6800; } .solutions-model-static-card h3{ margin:0 0 10px; } .solutions-model-static-card p{ margin:0; } .solutions-model-icon{ width:52px; height:52px; display:flex; align-items:center; justify-content:center; border-radius:14px; background:#fff1bf; color:#d98900; } .solutions-model-icon svg{ width:24px; height:24px; display:block; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; } .solutions-card-btn{ width:100%; margin-top:18px; } .solutions-card-btn .btn-label{ flex:1; text-align:left; } .solutions-model-static-card .solutions-card-btn{ margin-top:auto; } /* On photo cards, global white button shell */ .solutions-model-copy .solutions-card-btn{ background:#fff; color:var(--ink); border-color:#fff; } /* --------------------------------- Specialized teams — unique split composition --------------------------------- */ .solutions-industries-section{ background:#fff; } .solutions-industries-layout{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:stretch; } .solutions-industries-visual{ position:relative; min-height:610px; overflow:hidden; border-radius:28px; } .solutions-industries-visual img{ width:100%; height:100%; object-fit:cover; transition:transform .55s ease; } .solutions-industries-visual:hover img{ transform:scale(1.035); } .solutions-industry-stamp{ position:absolute; left:22px; right:22px; bottom:22px; padding:18px; display:flex; justify-content:space-between; gap:20px; border-radius:16px; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); } .solutions-industry-stamp span{ max-width:220px; color:var(--muted); } .solutions-industries-copy{ min-height:610px; display:flex; flex-direction:column; justify-content:center; } .solutions-industries-copy>p{ margin-top:16px; } .solutions-industry-links{ margin-top:28px; display:grid; grid-template-columns:1fr 1fr; gap:12px; } .solutions-industry-links a{ min-height:145px; padding:20px; display:grid; grid-template-columns:1fr auto; align-content:center; border:1px solid var(--line); border-radius:16px; color:var(--ink); transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .solutions-industry-links span{ grid-column:1/3; margin-top:8px; color:var(--muted); } .solutions-industry-links b{ grid-column:2; grid-row:1; transition:transform .28s ease; } .solutions-industry-links a:hover{ transform:translateY(-4px); border-color:rgba(255,176,31,.34); box-shadow:0 18px 36px rgba(17,24,39,.08); } .solutions-industry-links a:hover b{ transform:translateX(4px); } /* --------------------------------- Growth path --------------------------------- */ .solutions-fit-section{ background:#fffdf8; } .solutions-fit-track{ display:grid; grid-template-columns:1fr 54px 1fr 54px 1fr 54px 1fr; align-items:center; } .solutions-fit-step{ min-height:190px; padding:28px; border:1px solid var(--line); border-radius:var(--radius); background:#fff; transition:transform .3s ease,box-shadow .3s ease; } .solutions-fit-step:hover{ transform:translateY(-5px); box-shadow:0 18px 38px rgba(17,24,39,.08); } .solutions-fit-step>span{ width:36px; height:36px; display:grid; place-items:center; border-radius:12px; background:#fff1bf; color:#9b6800; font-size:10px; font-weight:900; } .solutions-fit-step strong{ display:block; margin-top:22px; } .solutions-fit-step p{ margin:8px 0 0; color:var(--muted); } .solutions-fit-line{ height:1px; background:linear-gradient(90deg,#ffd23b,#ff914d); transform-origin:left; animation:solutions-line-breathe 2.6s ease-in-out infinite; } @keyframes solutions-line-breathe{ 0%,100%{transform:scaleX(.55);opacity:.45} 50%{transform:scaleX(1);opacity:1} } /* --------------------------------- Reveal — transform/opacity only --------------------------------- */ [data-solution-reveal] .solutions-model-card, [data-solution-reveal].is-visible .solutions-model-card, /* Desktop spacing uses the global section system only */ .solutions-models-section, @media(max-width:980px){ .solutions-models-grid{ grid-template-columns:1fr; grid-template-rows:auto; } .solutions-model-large{ grid-row:auto; min-height:440px; } .solutions-model-photo, .solutions-model-static-card{ min-height:330px; } .solutions-industries-layout{ grid-template-columns:1fr; gap:30px; } .solutions-industries-visual{ min-height:500px; } .solutions-industries-copy{ min-height:0; } .solutions-fit-track{ grid-template-columns:1fr 1fr; gap:16px; } .solutions-fit-line{ display:none; } } @media(max-width:680px){ .solutions-model-large{ min-height:400px; } .solutions-model-photo, .solutions-model-static-card{ min-height:320px; } .solutions-industries-visual{ min-height:400px; } } @media(prefers-reduced-motion:reduce){ .solutions-model-card, .solutions-model-card img, } /* ========================================================= V1.50 SOLUTIONS — CLEAN CANONICAL FIX Global Home typography, buttons, container gutters stay untouched. ========================================================= */ /* Team-model buttons remain inline and readable. */ .solutions-model-card .solutions-card-btn{ width:max-content!important; min-width:0!important; max-width:100%; margin-top:18px; } .solutions-model-card .solutions-card-btn .btn-label{ flex:0 1 auto!important; white-space:nowrap; } .solutions-model-copy .solutions-card-btn{ background:#fff!important; border-color:#fff!important; color:#252a33!important; } .solutions-model-copy .solutions-card-btn .btn-label, .solutions-model-copy .solutions-card-btn .btn-arrow{ color:#252a33!important; } .solutions-model-static-card .solutions-card-btn{ align-self:flex-start; margin-top:auto; } /* --------------------------------------------------------- START WITH THE WORKFORCE PROBLEM --------------------------------------------------------- */ .solutions-reference-workflow{ position:relative; overflow:clip; background:#fffdf8; padding-top:var(--global-section-space); padding-bottom:0; } /* The container is full global width; the copy is simply inside it. */ .solutions-flow-intro-wrap{ position:relative; } .solutions-flow-intro{ max-width:760px; margin:0; text-align:left; } .solutions-flow-intro h2{ max-width:760px; margin:0; } .solutions-flow-intro>p{ max-width:650px; margin:18px 0 0; } .solutions-flow-track{ position:relative; height:3150px; margin-top:30px; } .solutions-flow-sticky{ position:sticky; top:86px; height:calc(100vh - 86px); min-height:680px; overflow:hidden; } .solutions-flow-grid{ height:100%; display:grid; grid-template-columns:minmax(0,40%) minmax(0,60%); gap:44px; align-items:center; } /* Equal visual height between left active content and right image. */ .solutions-flow-left, .solutions-flow-media{ position:relative; height:560px; } .solutions-flow-left{ align-self:center; } .solutions-flow-rail{ position:absolute; left:0; top:26px; width:14px; height:430px; pointer-events:none; } .solutions-flow-rail-base, .solutions-flow-rail-fill{ position:absolute; left:5px; top:0; width:1px; height:390px; transform-origin:top; } .solutions-flow-rail-base{ background:#d9dde4; } .solutions-flow-rail-fill{ background:#252a33; transform:scaleY(var(--flow-progress,0)); } .solutions-flow-rail-dot{ position:absolute; left:2px; top:0; width:7px; height:7px; border-radius:50%; background:#252a33; transform:translateY(calc(var(--flow-progress,0) * 386px)); } .solutions-flow-copy-stage{ position:relative; height:560px; margin-left:38px; } .solutions-flow-state{ position:absolute; inset:0; width:min(100%,440px); min-height:560px; display:flex; flex-direction:column; justify-content:center; opacity:0; transform:translateY(42px); filter:blur(6px); pointer-events:none; will-change:opacity,transform,filter; } .solutions-flow-state.is-active{ pointer-events:auto; } .solutions-flow-number{ position:relative; width:60px; height:60px; display:grid; place-items:center; margin-bottom:28px; } .solutions-flow-number svg{ position:absolute; inset:0; width:60px; height:60px; transform:rotate(-90deg); } .reference-ring-base, .reference-ring-progress{ fill:none; stroke-width:1.7; } .reference-ring-base{stroke:#e1e4e9} .reference-ring-progress{ stroke:#252a33; stroke-linecap:round; stroke-dasharray:169.65; stroke-dashoffset:169.65; } .solutions-flow-number span{ position:relative; z-index:1; color:#737c88; font-size:11px; font-weight:700; } .solutions-flow-state h3{ margin:0 0 12px; } .solutions-flow-state p{ max-width:430px; margin:0; } .solutions-flow-state .btn{ width:max-content; margin-top:18px; } .solutions-flow-media{ align-self:center; } .solutions-flow-media-card{ position:absolute; inset:0; overflow:hidden; border-radius:28px; background:#fff; box-shadow:0 28px 72px rgba(17,24,39,.12); } .solutions-flow-media-card img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; object-position:center; background:#fff; opacity:0; transform:translateY(28px) scale(.988); filter:blur(7px); will-change:opacity,transform,filter; } /* --------------------------------------------------------- V1.51 SEE THE TEAM MODEL — HOVER POPUP REFERENCE Six equal photo cards. No dashboard. No moving carousel. The colored content panel appears on hover/focus. --------------------------------------------------------- */ .solutions-industry-mosaic{ overflow:hidden; background:#fff; } .solutions-industry-mosaic .section-heading{ margin-bottom:40px; } .solutions-hover-grid{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; align-items:stretch; } .solutions-hover-card{ position:relative; min-height:360px; overflow:hidden; border-radius:18px; background:#eef0f3; color:#fff; isolation:isolate; box-shadow:0 12px 30px rgba(17,24,39,.06); } .solutions-hover-card>img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transform:scale(1.001); transition:transform .55s cubic-bezier(.2,.72,.2,1); } .solutions-hover-card-shade{ position:absolute; inset:0; z-index:1; background:linear-gradient( 180deg, rgba(17,24,39,.04) 25%, rgba(17,24,39,.72) 100% ); transition:opacity .35s ease; } .solutions-hover-card-label{ position:absolute; left:20px; right:20px; bottom:18px; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:16px; transition:opacity .22s ease,transform .32s ease; } .solutions-hover-card-label strong{ font-family:var(--title-font); font-size:20px; line-height:1.2; letter-spacing:-.025em; font-weight:800; } .solutions-hover-card-label b{ font-size:20px; line-height:1; } /* Colored popup is inside the card and expands upward like the reference. */ .solutions-hover-card-popup{ position:absolute; left:12px; right:12px; bottom:12px; z-index:4; min-height:calc(100% - 24px); padding:26px; display:flex; flex-direction:column; justify-content:flex-end; border-radius:14px; background:linear-gradient(145deg,#ffbd20 0%,#ff9848 55%,#ff7059 100%); color:#252a33; opacity:0; transform:translateY(calc(100% - 92px)) scale(.97); transform-origin:bottom center; transition: transform .48s cubic-bezier(.2,.78,.18,1), opacity .22s ease; pointer-events:none; } .solutions-hover-card-kicker{ display:block; margin-bottom:10px; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .solutions-hover-card-popup>strong{ display:block; font-family:var(--title-font); font-size:20px; line-height:1.2; letter-spacing:-.025em; font-weight:800; } .solutions-hover-card-copy{ display:block; margin-top:12px; color:#343943; font-size:14px; line-height:1.6; } .solutions-hover-card-action{ margin-top:20px; display:flex; align-items:center; justify-content:space-between; gap:14px; padding-top:15px; border-top:1px solid rgba(37,42,51,.18); font-size:12px; font-weight:900; } .solutions-hover-card-action b{ font-size:18px; } /* Exact interaction: image remains in place while colored panel pops over it. */ .solutions-hover-card:hover>img, .solutions-hover-card:focus-visible>img{ transform:scale(1.045); } .solutions-hover-card:hover .solutions-hover-card-shade, .solutions-hover-card:focus-visible .solutions-hover-card-shade{ opacity:.22; } .solutions-hover-card:hover .solutions-hover-card-label, .solutions-hover-card:focus-visible .solutions-hover-card-label{ opacity:0; transform:translateY(12px); } .solutions-hover-card:hover .solutions-hover-card-popup, .solutions-hover-card:focus-visible .solutions-hover-card-popup{ opacity:1; transform:translateY(0) scale(1); } /* --------------------------------------------------------- Responsive rules for retained problem flow + hover grid --------------------------------------------------------- */ @media(max-width:980px){ .solutions-reference-workflow{ padding-bottom:var(--global-section-space); } .solutions-flow-track{ height:auto; margin-top:36px; } .solutions-flow-sticky{ position:relative; top:auto; height:auto; min-height:0; overflow:visible; } .solutions-flow-grid{ display:block; } .solutions-flow-left, .solutions-flow-media{ height:auto; } .solutions-flow-rail{ display:none; } .solutions-flow-copy-stage{ height:auto; margin-left:0; } .solutions-flow-state{ position:relative; inset:auto; width:100%; max-width:none; min-height:auto; margin-bottom:38px; opacity:1!important; transform:none!important; filter:none!important; pointer-events:auto; } .solutions-flow-media{ margin-top:8px; } .solutions-flow-media-card{ position:relative; inset:auto; height:auto; aspect-ratio:4/3; } .solutions-flow-media-card img:not(:first-child){ opacity:0!important; } .solutions-flow-media-card img:first-child{ opacity:1!important; transform:none!important; filter:none!important; } .solutions-hover-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); } } @media(max-width:620px){ .solutions-hover-grid{ grid-template-columns:1fr; } .solutions-hover-card{ min-height:330px; } /* On touch, popup remains discoverable via tap/focus. */ .solutions-hover-card:focus .solutions-hover-card-popup{ opacity:1; transform:translateY(0) scale(1); } } @media(prefers-reduced-motion:reduce){ .solutions-flow-state, .solutions-flow-media-card img, .solutions-flow-rail-fill, .solutions-flow-rail-dot, .solutions-hover-card>img, .solutions-hover-card-label, .solutions-hover-card-popup{ transition:none!important; filter:none!important; } } /* ========================================================= V1.52 SOLUTIONS GROWTH REFERENCE + PRICING MAIN PAGE ========================================================= */ .solutions-growth-section{overflow:hidden;background:#fff} .solutions-growth-board{display:grid;grid-template-columns:1fr 1fr 1fr;grid-template-rows:repeat(2,280px);gap:18px;align-items:stretch} .solutions-growth-card{position:relative;padding:28px 30px;display:flex;flex-direction:column;justify-content:space-between;border:1px solid var(--line);border-radius:22px;background:#f6f3ef;transition:transform .35s ease,box-shadow .35s ease,border-color .35s ease} .solutions-growth-card:hover{transform:translateY(-6px);border-color:rgba(255,176,31,.35);box-shadow:0 22px 46px rgba(17,24,39,.09)} .solutions-growth-icon{width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:12px;background:#252a33;color:#fff;transition:transform .35s cubic-bezier(.2,.72,.2,1),background .3s ease} .solutions-growth-icon svg{width:28px;height:28px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round} .solutions-growth-card:hover .solutions-growth-icon{transform:rotate(-7deg) scale(1.08);background:#ffae20;color:#252a33} .solutions-growth-card h3{margin:0 0 10px}.solutions-growth-card p{margin:0;color:var(--muted)} .solutions-growth-media{position:relative;grid-column:2;grid-row:1/3;overflow:hidden;border-radius:22px;background:#eef2f5} .solutions-growth-media img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .7s cubic-bezier(.2,.72,.2,1)} .solutions-growth-media:hover img{transform:scale(1.045)} .solutions-growth-media-badge{position:absolute;left:20px;right:20px;bottom:20px;padding:16px 18px;display:flex;flex-direction:column;gap:4px;border-radius:14px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px);transform:translateY(8px);transition:transform .35s ease} .solutions-growth-media:hover .solutions-growth-media-badge{transform:none} .solutions-growth-media-badge strong{font-size:14px}.solutions-growth-media-badge span{font-size:12px;color:var(--muted)} .solutions-growth-card-a{grid-column:1;grid-row:1}.solutions-growth-card-b{grid-column:1;grid-row:2}.solutions-growth-card-c{grid-column:3;grid-row:1}.solutions-growth-card-d{grid-column:3;grid-row:2} [data-growth-board] .solutions-growth-card,[data-growth-board] .solutions-growth-media{opacity:0;transform:translateY(20px)} [data-growth-board].is-visible .solutions-growth-card,[data-growth-board].is-visible .solutions-growth-media{opacity:1;transform:none;transition:opacity .55s ease,transform .55s ease,box-shadow .35s ease,border-color .35s ease} [data-growth-board].is-visible .solutions-growth-card-b{transition-delay:.06s}[data-growth-board].is-visible .solutions-growth-media{transition-delay:.10s}[data-growth-board].is-visible .solutions-growth-card-c{transition-delay:.14s}[data-growth-board].is-visible .solutions-growth-card-d{transition-delay:.20s} .pricing-plans-section{background:#fff} .pricing-billing-row{margin-top:-8px;margin-bottom:26px;display:flex;align-items:center;justify-content:center;gap:14px} .pricing-page-switcher{display:inline-flex;padding:4px;border:1px solid var(--line);border-radius:999px;background:#fff} .pricing-page-switcher button{min-width:96px;padding:10px 18px;border:0;border-radius:999px;background:transparent;color:var(--muted);font:inherit;font-weight:800;cursor:pointer} .pricing-page-switcher button.is-active{background:#252a33;color:#fff} .pricing-billing-row>p{margin:0;color:var(--muted);font-size:12px} .pricing-page-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px} .pricing-page-card{position:relative;min-height:590px;padding:30px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:22px;background:#fff;box-shadow:0 12px 30px rgba(17,24,39,.05);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease} .pricing-page-card:hover{transform:translateY(-6px);border-color:rgba(255,176,31,.38);box-shadow:0 24px 48px rgba(17,24,39,.10)} .pricing-page-card-featured{border-color:#ffb51f;box-shadow:0 18px 42px rgba(255,181,31,.13)} .pricing-page-popular{position:absolute;top:18px;right:18px;padding:7px 10px;border-radius:999px;background:#fff1bf;color:#946100;font-size:10px;font-weight:900} .pricing-page-plan{font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#8a6200} .pricing-page-price{margin:24px 0 18px;display:flex;align-items:flex-end;gap:9px} .pricing-page-price strong{font-family:var(--title-font);font-size:clamp(31px,3vw,44px);line-height:1;letter-spacing:-.038em;font-weight:800} .pricing-page-price span{padding-bottom:5px;color:var(--muted);font-size:13px} .pricing-page-card>p{margin:0;color:var(--muted)} .pricing-page-card ul{margin:26px 0 28px;padding:0;list-style:none;display:grid;gap:12px} .pricing-page-card li{position:relative;padding-left:22px;color:#4e5662}.pricing-page-card li::before{content:"✓";position:absolute;left:0;color:#e58c00;font-weight:900} .pricing-page-card>.btn{width:100%;margin-top:auto}.pricing-page-card>.btn .btn-label{flex:1;text-align:left} .pricing-value-section{background:#fffdf8}.pricing-value-layout{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:stretch} .pricing-value-media{position:relative;min-height:610px;overflow:hidden;border-radius:26px}.pricing-value-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.pricing-value-media:hover img{transform:scale(1.035)} .pricing-value-float{position:absolute;left:20px;right:20px;bottom:20px;padding:17px 18px;display:flex;flex-direction:column;gap:4px;border-radius:14px;background:rgba(255,255,255,.94);backdrop-filter:blur(9px)}.pricing-value-float span{color:var(--muted);font-size:12px} .pricing-value-copy{min-height:610px;display:flex;flex-direction:column;justify-content:center}.pricing-value-copy>p{margin-top:16px} .pricing-value-points{margin-top:28px;display:flex;flex-direction:column;border-top:1px solid var(--line)} .pricing-value-points article{display:grid;grid-template-columns:44px 1fr;gap:15px;padding:18px 0;border-bottom:1px solid var(--line)} .pricing-value-points article>span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#fff0ba;color:#9a6600;font-size:10px;font-weight:900} .pricing-value-points h3{margin:0 0 6px}.pricing-value-points p{margin:0;color:var(--muted)} .pricing-compare-section{background:#fff}.pricing-compare-table-wrap{overflow:auto;border:1px solid var(--line);border-radius:20px} .pricing-compare-table{width:100%;min-width:760px;border-collapse:collapse;background:#fff} .pricing-compare-table th,.pricing-compare-table td{padding:17px 20px;border-bottom:1px solid var(--line);text-align:left} .pricing-compare-table th{background:#fffaf0;color:#252a33} .pricing-compare-table th:not(:first-child),.pricing-compare-table td:not(:first-child){text-align:center} .pricing-compare-table tbody tr:hover{background:#fffdf8} .pricing-support-section{background:#fffdf8}.pricing-support-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:stretch} .pricing-support-copy{min-height:520px;display:flex;flex-direction:column;justify-content:center}.pricing-support-copy>p{margin-top:16px}.pricing-support-actions{margin-top:24px} .pricing-support-media{min-height:520px;overflow:hidden;border-radius:26px}.pricing-support-media img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease}.pricing-support-media:hover img{transform:scale(1.035)} @media(max-width:980px){ .solutions-growth-board{grid-template-columns:1fr 1fr;grid-template-rows:auto} .solutions-growth-card,.solutions-growth-media{grid-column:auto;grid-row:auto;min-height:280px}.solutions-growth-media{min-height:480px} .pricing-page-grid{grid-template-columns:1fr}.pricing-page-card{min-height:auto} .pricing-value-layout,.pricing-support-layout, .pricing-value-media{min-height:480px}.pricing-value-copy,.pricing-support-copy{min-height:0}.pricing-support-media{min-height:440px} } @media(max-width:680px){ .solutions-growth-board{grid-template-columns:1fr}.solutions-growth-media{min-height:420px} .pricing-billing-row{flex-direction:column}.pricing-support-media{min-height:340px} } @media(prefers-reduced-motion:reduce){ .solutions-growth-card,.solutions-growth-media,.solutions-growth-icon,.solutions-growth-media img,.pricing-page-card,.pricing-value-media img,.pricing-scroll-media,.pricing-scroll-heading h2 span,.pricing-scroll-cards,.pricing-support-media img{animation:none!important;transition:none!important;transform:none!important;opacity:1!important} } /* ========================================================= V1.57 PRICING ORBIT SPACING + ENTERPRISE POLISH Clean canonical block. Global Home/Product typography, buttons, section spacing, header/footer and CTA stay untouched. ========================================================= */ /* ---------------- Pricing: buttons/table ---------------- */ .pricing-page-card > .btn{ width:max-content!important; min-width:0!important; margin-top:auto; align-self:flex-start; } .pricing-page-card > .btn .btn-label{ flex:0 1 auto!important; text-align:left!important; } .pricing-compare-table tbody tr{ position:relative; opacity:0; transform:translateY(12px); } .pricing-compare-table-wrap.is-visible tbody tr{ opacity:1; transform:none; transition:opacity .45s ease,transform .45s ease,background .28s ease,box-shadow .28s ease; } .pricing-compare-table-wrap.is-visible tbody tr:nth-child(2){transition-delay:.04s} .pricing-compare-table-wrap.is-visible tbody tr:nth-child(3){transition-delay:.08s} .pricing-compare-table-wrap.is-visible tbody tr:nth-child(4){transition-delay:.12s} .pricing-compare-table-wrap.is-visible tbody tr:nth-child(5){transition-delay:.16s} .pricing-compare-table-wrap.is-visible tbody tr:nth-child(6){transition-delay:.20s} .pricing-compare-table-wrap.is-visible tbody tr:nth-child(7){transition-delay:.24s} .pricing-compare-table-wrap.is-visible tbody tr:nth-child(8){transition-delay:.28s} .pricing-compare-table tbody tr:hover{ background:#fff9ec; box-shadow:inset 4px 0 0 #ffb51f; } .pricing-compare-table tbody td{ transition:color .25s ease,transform .25s ease; } .pricing-compare-table tbody tr:hover td:not(:first-child){ color:#252a33; transform:translateX(2px); } /* ---------------- Pricing: Orbit Rail ---------------- */ .pricing-orbit-section{ position:relative; overflow:hidden; background:#fff; padding-block:var(--global-section-space); } .pricing-orbit-shell{position:relative} .pricing-orbit-heading{margin-bottom:22px!important} .pricing-orbit-heading>p{ max-width:700px; margin:14px auto 0; } .pricing-orbit-stage{ position:relative; height:640px; margin-top:6px; border:1px solid rgba(17,24,39,.06); border-radius:30px; background: radial-gradient(circle at 50% 42%,rgba(255,181,31,.12),transparent 28%), linear-gradient(rgba(17,24,39,.022) 1px,transparent 1px), linear-gradient(90deg,rgba(17,24,39,.022) 1px,transparent 1px), #fffdf8; background-size:auto,58px 58px,58px 58px,auto; overflow:hidden; } .pricing-orbit-core{ position:absolute; left:50%; top:40%; width:228px; height:228px; transform:translate(-50%,-50%) scale(.9); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border-radius:50%; background:#252a33; color:#fff; box-shadow:0 24px 60px rgba(17,24,39,.16); z-index:5; will-change:transform; } .pricing-orbit-brand{ color:#ffd45a; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .pricing-orbit-core strong{ max-width:150px; margin-top:10px; font-family:var(--title-font); font-size:23px; line-height:1.12; } .pricing-orbit-core small{ max-width:150px; margin-top:9px; color:rgba(255,255,255,.62); line-height:1.45; } .pricing-orbit-pulse{ position:absolute; inset:-18px; border:1px solid rgba(255,181,31,.34); border-radius:50%; animation:pricing-orbit-pulse 3.2s ease-out infinite; } .pricing-orbit-pulse-two{animation-delay:1.6s} @keyframes pricing-orbit-pulse{ 0%{transform:scale(.92);opacity:.58} 72%,100%{transform:scale(1.22);opacity:0} } .pricing-orbit-card{ position:absolute; width:300px; min-height:165px; padding:22px; border:1px solid var(--line); border-radius:18px; background:rgba(255,255,255,.97); box-shadow:0 18px 44px rgba(17,24,39,.07); opacity:0; z-index:4; will-change:transform,opacity; transition:box-shadow .32s ease,border-color .32s ease,background .32s ease; } .pricing-orbit-card:hover{ border-color:rgba(255,176,31,.42); background:#fff; box-shadow:0 24px 52px rgba(17,24,39,.11); } .pricing-orbit-card>span{ display:block; color:#9f6900; font-size:10px; font-weight:900; } .pricing-orbit-card h3{margin:11px 0 8px} .pricing-orbit-card p{margin:0;color:var(--muted)} .pricing-orbit-card-a{left:5%;top:10%} .pricing-orbit-card-b{right:5%;top:10%} /* FIX: lower card now has a real visual gap under the center circle */ .pricing-orbit-card-c{ left:50%; bottom:4%; transform:translateX(-50%); } .pricing-orbit-lines{ position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none; } .pricing-orbit-lines path{ fill:none; stroke:#ffb51f; stroke-width:1.8; stroke-linecap:round; stroke-dasharray:7 11; opacity:.24; animation:pricing-orbit-dash 4.5s linear infinite; } @keyframes pricing-orbit-dash{ to{stroke-dashoffset:-72} } .pricing-orbit-dot{ position:absolute; width:8px; height:8px; border-radius:50%; background:#ff9a45; box-shadow:0 0 0 5px rgba(255,154,69,.10); z-index:3; opacity:0; } .pricing-orbit-dot-a{animation:pricing-dot-a 3.2s linear infinite} .pricing-orbit-dot-b{animation:pricing-dot-b 3.2s linear infinite .8s} .pricing-orbit-dot-c{animation:pricing-dot-c 3.2s linear infinite 1.6s} @keyframes pricing-dot-a{ 0%,18%{left:50%;top:40%;opacity:0} 24%{opacity:1} 76%{left:26%;top:24%;opacity:1} 84%,100%{left:26%;top:24%;opacity:0} } @keyframes pricing-dot-b{ 0%,18%{left:50%;top:40%;opacity:0} 24%{opacity:1} 76%{left:74%;top:24%;opacity:1} 84%,100%{left:74%;top:24%;opacity:0} } @keyframes pricing-dot-c{ 0%,18%{left:50%;top:40%;opacity:0} 24%{opacity:1} 76%{left:50%;top:76%;opacity:1} 84%,100%{left:50%;top:76%;opacity:0} } /* ---------------- Enterprise hero/form ---------------- */ .enterprise-main-hero .hubstaff-hero-copy{max-width:none} .enterprise-main-hero h1{max-width:1050px} .enterprise-lead-section{background:#fff} .enterprise-lead-layout{ display:grid; grid-template-columns:.92fr 1.08fr; gap:36px; align-items:stretch; } .enterprise-lead-media{ position:relative; min-height:690px; overflow:hidden; border-radius:28px; } .enterprise-lead-media img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s cubic-bezier(.2,.72,.2,1); } .enterprise-lead-media:hover img{transform:scale(1.035)} .enterprise-lead-note{ position:absolute; left:22px; right:22px; bottom:22px; padding:18px; display:flex; flex-direction:column; gap:5px; border-radius:16px; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); } .enterprise-lead-note span{color:var(--muted);font-size:12px} .enterprise-form-card{ min-height:690px; padding:34px; border:1px solid var(--line); border-radius:28px; background:#fffdf8; box-shadow:0 18px 45px rgba(17,24,39,.06); } .enterprise-form-card h2{margin:14px 0 0} .enterprise-form-card>p{margin:16px 0 0;color:var(--muted)} .enterprise-lead-form{margin-top:26px} .enterprise-form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .enterprise-lead-form label{ display:flex; flex-direction:column; gap:7px; } .enterprise-lead-form label>span{ color:#4f5864; font-size:12px; font-weight:800; } .enterprise-lead-form input, .enterprise-lead-form select, .enterprise-lead-form textarea{ width:100%; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); font:inherit; outline:none; transition:border-color .25s ease,box-shadow .25s ease; } .enterprise-lead-form input, .enterprise-lead-form select{ min-height:48px; padding:0 13px; } .enterprise-lead-form textarea{padding:13px;resize:vertical} .enterprise-lead-form input:focus, .enterprise-lead-form select:focus, .enterprise-lead-form textarea:focus{ border-color:#ffb51f; box-shadow:0 0 0 4px rgba(255,181,31,.12); } .enterprise-form-message{margin-top:14px} .enterprise-lead-form .btn{margin-top:18px} .enterprise-form-note{ display:block; margin-top:12px; color:var(--muted); line-height:1.5; } .enterprise-form-note a{text-decoration:underline} .enterprise-form-honey{ position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; opacity:0!important; } /* ---------------- Enterprise outcomes ---------------- */ .enterprise-outcomes-section{background:#fffdf8} .enterprise-outcomes-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; } .enterprise-outcome-card{ min-height:300px; padding:26px; border:1px solid var(--line); border-radius:20px; background:#fff; transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease; } .enterprise-outcome-card:hover{ transform:translateY(-7px); border-color:rgba(255,176,31,.38); box-shadow:0 22px 46px rgba(17,24,39,.09); } .enterprise-outcome-icon{ width:56px; height:56px; display:grid; place-items:center; border-radius:14px; background:#fff1bf; color:#d98900; transition:transform .35s ease,background .35s ease; } .enterprise-outcome-icon svg{ width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } .enterprise-outcome-card:hover .enterprise-outcome-icon{ transform:rotate(-5deg) scale(1.07); background:#ffd65a; } .enterprise-outcome-card h3{margin:26px 0 10px} .enterprise-outcome-card p{margin:0;color:var(--muted)} /* ---------------- Enterprise dark tabs ---------------- */ .enterprise-video-tabs{ position:relative; overflow:hidden; background:#08090d; color:#fff; } .enterprise-video-glow{ position:absolute; left:50%; top:-80px; width:78%; height:260px; transform:translateX(-50%); background:radial-gradient(ellipse,rgba(255,181,31,.20),rgba(255,181,31,0) 68%); filter:blur(12px); pointer-events:none; } .enterprise-tabs-heading{ position:relative; z-index:3; margin-bottom:34px!important; } .enterprise-tabs-heading h2{ color:#fff; } .enterprise-tabs-heading>p{ max-width:760px; margin:16px auto 0; color:rgba(255,255,255,.70); } .enterprise-tabs-nav{ position:relative; z-index:3; width:max-content; max-width:100%; margin:0 auto 44px; padding:6px; display:flex; gap:4px; border:1px solid rgba(255,255,255,.08); border-radius:999px; background:#1a1b20; } .enterprise-tabs-nav button{ padding:11px 18px; border:0; border-radius:999px; background:transparent; color:rgba(255,255,255,.72); font:inherit; font-size:12px; font-weight:800; cursor:pointer; transition:background .28s ease,color .28s ease,transform .28s ease; } .enterprise-tabs-nav button:hover{ color:#fff; transform:translateY(-1px); } .enterprise-tabs-nav button.is-active{ background:linear-gradient(90deg,#ffbd20,#ff914d); color:#252a33; } .enterprise-tab-stage{ display:grid; grid-template-columns:.92fr 1.08fr; gap:58px; align-items:stretch; min-height:520px; } .enterprise-tab-copy{ min-height:520px; display:flex; flex-direction:column; justify-content:center; max-width:560px; } .enterprise-tab-kicker{ display:block; color:#ffd45a; font-size:11px; font-weight:900; letter-spacing:.09em; text-transform:uppercase; } .enterprise-tab-copy h2{ margin:14px 0 0; color:#fff; max-width:560px; } .enterprise-tab-copy h2 .title-line{ display:block; white-space:nowrap; } .enterprise-tab-copy p{ max-width:540px; margin:20px 0 0; color:rgba(255,255,255,.72); line-height:1.72; } .enterprise-tab-copy .btn{margin-top:26px} .enterprise-tab-media{ position:relative; min-height:520px; overflow:hidden; border-radius:28px; background:#15161b; } .enterprise-tab-media::after{ content:""; position:absolute; inset:0; border-radius:inherit; box-shadow:inset 0 0 0 1px rgba(255,255,255,.08); pointer-events:none; } .enterprise-tab-media img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:0; transform:scale(1.035) translateY(12px); transition:opacity .45s ease,transform .55s cubic-bezier(.2,.72,.2,1); } .enterprise-tab-media img.is-active{ opacity:1; transform:none; } /* ---------------- Governance ---------------- */ .enterprise-governance-section{background:#fff} .enterprise-governance-layout{ display:grid; grid-template-columns:1fr 1fr; gap:54px; align-items:stretch; } .enterprise-governance-media{ position:relative; min-height:610px; overflow:hidden; border-radius:28px; } .enterprise-governance-media img{ width:100%; height:100%; object-fit:cover; transition:transform .6s ease; } .enterprise-governance-media:hover img{transform:scale(1.035)} .enterprise-governance-note{ position:absolute; left:22px; right:22px; bottom:22px; padding:18px; border-radius:16px; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); display:flex; flex-direction:column; gap:4px; } .enterprise-governance-note span{color:var(--muted);font-size:12px} .enterprise-governance-copy{ min-height:610px; display:flex; flex-direction:column; justify-content:center; } .enterprise-governance-copy>p{margin-top:16px} .enterprise-governance-list{margin-top:28px;border-top:1px solid var(--line)} .enterprise-governance-list article{ display:grid; grid-template-columns:44px 1fr; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); } .enterprise-governance-list article>span{ width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:#fff0ba; color:#9a6600; font-size:10px; font-weight:900; } .enterprise-governance-list h3{margin:0 0 6px} .enterprise-governance-list p{margin:0;color:var(--muted)} /* ---------------- Control plane enhanced ---------------- */ .enterprise-control-section{ position:relative; overflow:hidden; background: radial-gradient(circle at 50% 50%,rgba(255,181,31,.08),transparent 28%), linear-gradient(rgba(17,24,39,.022) 1px,transparent 1px), linear-gradient(90deg,rgba(17,24,39,.022) 1px,transparent 1px), #fffdf8; background-size:auto,70px 70px,70px 70px,auto; } .enterprise-control-stage{ position:relative; height:680px; margin-top:22px; } .enterprise-control-core{ position:absolute; left:50%; top:50%; width:240px; height:240px; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; border-radius:50%; background:#252a33; color:#fff; z-index:5; box-shadow:0 30px 72px rgba(17,24,39,.20); } .enterprise-control-core::before, .enterprise-control-core::after{ content:""; position:absolute; inset:-22px; border:1px solid rgba(255,181,31,.28); border-radius:50%; animation:enterprise-core-pulse 3.4s ease-out infinite; } .enterprise-control-core::after{ inset:-44px; animation-delay:1.4s; } @keyframes enterprise-core-pulse{ 0%{transform:scale(.92);opacity:.55} 72%,100%{transform:scale(1.12);opacity:0} } .enterprise-control-brand{ color:#ffd35a; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .enterprise-control-core strong{ margin-top:10px; font-family:var(--title-font); font-size:24px; } .enterprise-control-core small{ margin-top:7px; color:rgba(255,255,255,.62); } .enterprise-control-node{ position:absolute; width:235px; min-height:138px; padding:19px; border:1px solid rgba(17,24,39,.08); border-radius:18px; background:rgba(255,255,255,.96); box-shadow:0 18px 38px rgba(17,24,39,.07); z-index:3; opacity:0; transform:translateY(20px) scale(.97); transition:transform .34s ease,box-shadow .34s ease,border-color .34s ease; } .enterprise-control-node:hover{ border-color:rgba(255,176,31,.40); box-shadow:0 24px 48px rgba(17,24,39,.11); transform:translateY(-5px) scale(1.01)!important; } .enterprise-control-node>span{ display:block; font-weight:900; color:#252a33; } .enterprise-control-node>small{ display:block; margin-top:5px; color:#a26a00; font-size:11px; font-weight:800; } .enterprise-control-node p{ margin:10px 0 0; color:var(--muted); font-size:12px; line-height:1.55; } .enterprise-node-a{left:3%;top:5%} .enterprise-node-b{left:0;top:39%} .enterprise-node-c{left:6%;bottom:3%} .enterprise-node-d{right:3%;top:5%} .enterprise-node-e{right:0;top:39%} .enterprise-node-f{right:6%;bottom:3%} .enterprise-control-lines{ position:absolute; inset:0; width:100%; height:100%; z-index:1; overflow:visible; } .enterprise-control-lines path{ fill:none; stroke:#ffb51f; stroke-width:2; stroke-linecap:round; stroke-dasharray:8 12; stroke-dashoffset:120; opacity:.30; } .enterprise-flow-dot{ fill:#ff914d; filter:drop-shadow(0 0 5px rgba(255,145,77,.55)); } .enterprise-control-section.is-visible .enterprise-control-node{ opacity:1; transform:none; } .enterprise-control-section.is-visible .enterprise-node-b, .enterprise-control-section.is-visible .enterprise-node-e{transition-delay:.08s} .enterprise-control-section.is-visible .enterprise-node-c, .enterprise-control-section.is-visible .enterprise-node-f{transition-delay:.16s} .enterprise-control-section.is-visible .enterprise-control-lines path{ animation:enterprise-dash 2.8s linear infinite; } @keyframes enterprise-dash{to{stroke-dashoffset:0}} /* ---------------- Shared enterprise reveals ---------------- */ [data-enterprise-reveal] .enterprise-outcome-card, [data-enterprise-reveal] .enterprise-lead-media, [data-enterprise-reveal] .enterprise-form-card, [data-enterprise-reveal] .enterprise-governance-media, [data-enterprise-reveal] .enterprise-governance-copy, [data-enterprise-reveal] .enterprise-tabs-heading, [data-enterprise-reveal] .enterprise-tabs-nav, [data-enterprise-reveal] .enterprise-tab-copy, [data-enterprise-reveal] .enterprise-tab-media{ opacity:0; transform:translateY(22px); } [data-enterprise-reveal].is-visible .enterprise-outcome-card, [data-enterprise-reveal].is-visible .enterprise-lead-media, [data-enterprise-reveal].is-visible .enterprise-form-card, [data-enterprise-reveal].is-visible .enterprise-governance-media, [data-enterprise-reveal].is-visible .enterprise-governance-copy, [data-enterprise-reveal].is-visible .enterprise-tabs-heading, [data-enterprise-reveal].is-visible .enterprise-tabs-nav, [data-enterprise-reveal].is-visible .enterprise-tab-copy, [data-enterprise-reveal].is-visible .enterprise-tab-media{ opacity:1; transform:none; transition:opacity .62s ease,transform .62s cubic-bezier(.2,.72,.2,1); } [data-enterprise-reveal].is-visible .enterprise-form-card{transition-delay:.08s} [data-enterprise-reveal].is-visible .enterprise-outcome-card:nth-child(2){transition-delay:.05s} [data-enterprise-reveal].is-visible .enterprise-outcome-card:nth-child(3){transition-delay:.10s} [data-enterprise-reveal].is-visible .enterprise-outcome-card:nth-child(4){transition-delay:.15s} [data-enterprise-reveal].is-visible .enterprise-tabs-nav{transition-delay:.06s} [data-enterprise-reveal].is-visible .enterprise-tab-copy{transition-delay:.12s} [data-enterprise-reveal].is-visible .enterprise-tab-media{transition-delay:.18s} [data-enterprise-reveal].is-visible .enterprise-governance-copy{transition-delay:.08s} /* Enterprise FAQ = Home/Pricing white component */ .worklix-faq-section.enterprise-faq-white{ background:#fff!important; color:#252a33!important; } .worklix-faq-section.enterprise-faq-white::before{ background: radial-gradient(circle at 50% 108%,rgba(255,176,31,.10),transparent 34%), linear-gradient(rgba(17,24,39,.018) 1px,transparent 1px), linear-gradient(90deg,rgba(17,24,39,.018) 1px,transparent 1px)!important; background-size:auto,70px 70px,70px 70px!important; } .enterprise-faq-white .faq-heading h2{color:#252a33!important} .enterprise-faq-white .faq-heading p{color:var(--muted)!important} .enterprise-faq-white .faq-list details{ border-color:#e1e4e9!important; background:#fff!important; box-shadow:0 10px 26px rgba(17,24,39,.035); } .enterprise-faq-white .faq-list details[open]{ border-color:rgba(255,181,31,.42)!important; background:#fffaf0!important; } .enterprise-faq-white .faq-list summary{color:#252a33!important} .enterprise-faq-white .faq-list details p{color:var(--muted)!important} /* ---------------- Responsive ---------------- */ @media(max-width:980px){ .pricing-orbit-stage{ height:auto; padding:28px; display:grid; grid-template-columns:1fr 1fr; gap:16px; } .pricing-orbit-core{ position:relative; left:auto; top:auto; transform:none!important; grid-column:1/3; margin:12px auto 18px; } .pricing-orbit-card{ position:relative; left:auto!important; right:auto!important; top:auto!important; bottom:auto!important; width:auto; opacity:1!important; transform:none!important; } .pricing-orbit-lines, .pricing-orbit-dot{display:none} .enterprise-lead-layout, .enterprise-governance-layout, .enterprise-tab-stage{ grid-template-columns:1fr; } .enterprise-lead-media{min-height:480px} .enterprise-form-card{min-height:0} .enterprise-outcomes-grid{grid-template-columns:1fr 1fr} .enterprise-tab-stage{gap:30px} .enterprise-tab-copy{ min-height:0; max-width:none; } .enterprise-tab-copy h2 .title-line{ white-space:normal; } .enterprise-tab-media{min-height:430px} .enterprise-governance-media{min-height:480px} .enterprise-governance-copy{min-height:0} .enterprise-control-stage{ height:auto; display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-top:30px; } .enterprise-control-core{ position:relative; left:auto; top:auto; transform:none; grid-column:1/3; margin:0 auto 22px; } .enterprise-control-node{ position:relative; left:auto!important; right:auto!important; top:auto!important; bottom:auto!important; width:auto; min-height:0; opacity:1; transform:none; } .enterprise-control-lines{display:none} } @media(max-width:680px){ .pricing-orbit-stage{grid-template-columns:1fr} .pricing-orbit-core{grid-column:auto} .enterprise-form-grid{grid-template-columns:1fr} .enterprise-outcomes-grid{grid-template-columns:1fr} .enterprise-tabs-nav{ width:100%; overflow-x:auto; justify-content:flex-start; scrollbar-width:none; } .enterprise-tabs-nav::-webkit-scrollbar{display:none} .enterprise-tabs-nav button{white-space:nowrap} .enterprise-tab-media{min-height:330px} .enterprise-control-stage{grid-template-columns:1fr} .enterprise-control-core{grid-column:auto} } @media(prefers-reduced-motion:reduce){ .pricing-orbit-pulse, .pricing-orbit-dot, .pricing-orbit-lines path, .pricing-orbit-core, .pricing-orbit-card, .enterprise-outcome-card, .enterprise-outcome-icon, .enterprise-lead-media img, .enterprise-tab-media img, .enterprise-control-node, .enterprise-control-lines path, .enterprise-control-core::before, .enterprise-control-core::after, [data-enterprise-reveal] *{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.60 ABOUT REFERENCE-MATCH REBUILD ========================================================= */ /* Keep pricing FAQ white exactly as requested. */ section.worklix-faq-section.pricing-faq-white{ background:#fff!important; background-color:#fff!important; color:#252a33!important; } section.worklix-faq-section.pricing-faq-white::before, section.worklix-faq-section.pricing-faq-white::after{ background: radial-gradient(circle at 50% 108%,rgba(255,176,31,.08),transparent 34%), linear-gradient(rgba(17,24,39,.016) 1px,transparent 1px), linear-gradient(90deg,rgba(17,24,39,.016) 1px,transparent 1px)!important; background-size:auto,70px 70px,70px 70px!important; opacity:1!important; } .pricing-faq-white .faq-shell, .pricing-faq-white .faq-heading, .pricing-faq-white .faq-list{position:relative;z-index:2} .pricing-faq-white .faq-heading h2, .pricing-faq-white .faq-list summary{color:#252a33!important} .pricing-faq-white .faq-heading p, .pricing-faq-white .faq-list details p{color:#657080!important;opacity:1!important} .pricing-faq-white .faq-list details{background:#fff!important;color:#252a33!important;border-color:#e1e4e9!important} .pricing-faq-white .faq-list details[open]{background:#fffaf0!important;border-color:rgba(255,181,31,.42)!important} /* Pricing support copy expansion retained. */ .pricing-support-copy{ min-height:520px; display:flex; flex-direction:column; justify-content:center; } .pricing-support-copy>p{margin-top:16px} .pricing-support-points{margin-top:22px;display:grid;gap:10px} .pricing-support-points span{ position:relative; padding:11px 14px 11px 38px; border:1px solid var(--line); border-radius:12px; background:#fff; color:#4f5864; font-size:13px; line-height:1.5; } .pricing-support-points span::before{ content:"✓"; position:absolute; left:14px; top:11px; color:#d88b00; font-weight:900; } /* Enterprise section retained. */ .enterprise-tab-stage{min-height:500px!important;align-items:stretch!important} .enterprise-tab-copy{min-height:500px!important;max-width:575px!important;padding-block:20px!important} .enterprise-tab-copy h2 .title-line{display:block!important;white-space:nowrap} .enterprise-tab-copy p{max-width:555px!important;min-height:194px!important;margin-top:22px!important;color:#fff!important;opacity:1!important;line-height:1.78!important} .enterprise-tab-media{min-height:500px!important;height:500px!important} .enterprise-control-stage{height:720px!important} .enterprise-control-core{width:320px!important;height:320px!important} .enterprise-control-core strong{max-width:190px!important;font-size:23px!important;line-height:1.12!important} .enterprise-control-node{width:242px!important;min-height:154px!important;padding:20px!important} .enterprise-control-node p{margin:10px 0 0;color:var(--muted);font-size:12px;line-height:1.58} .enterprise-flow-dot{fill:#ff914d;filter:drop-shadow(0 0 5px rgba(255,145,77,.55))} /* ABOUT PAGE — aligned much closer to the reference design. */ .about-main-hero .hubstaff-hero-copy{max-width:none} .about-main-hero h1{max-width:1040px} .about-welcome-layout{ display:grid; grid-template-columns:.95fr 1.05fr; gap:68px; align-items:center; } .about-welcome-media{ position:relative; min-height:520px; } .about-welcome-photo{ position:absolute; margin:0; overflow:hidden; border-radius:24px; box-shadow:0 20px 42px rgba(17,24,39,.09); opacity:0; transform:translateY(28px); } .about-welcome-photo img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.2,.72,.2,1); } .about-welcome-photo:hover img{transform:scale(1.04)} .about-welcome-photo-wide{left:0;top:34px;width:48%;height:170px} .about-welcome-photo-tall{left:33%;top:12px;width:33%;height:255px} .about-welcome-photo-small{left:0;top:230px;width:42%;height:155px} .about-welcome-shape{ position:absolute; opacity:0; transform:translateY(12px) scale(.8); } .about-welcome-shape-top{ left:-8px; top:-8px; width:32px; height:50px; background:linear-gradient(180deg,#ff8b45,#f75d3b); border-radius:22px 22px 6px 22px; } .about-welcome-shape-bottom{ left:34%; top:286px; width:28px; height:28px; color:#26b8eb; } .about-welcome-shape-bottom::before, .about-welcome-shape-bottom::after{ content:""; position:absolute; inset:12px 0 auto 0; height:4px; border-radius:999px; background:#26b8eb; } .about-welcome-shape-bottom::before{transform:rotate(45deg)} .about-welcome-shape-bottom::after{transform:rotate(-45deg)} .about-welcome-mark{ position:absolute; left:39%; top:264px; color:#f5c12f; font-size:44px; line-height:1; font-weight:300; opacity:0; transform:translateY(12px); } .about-welcome-copy h2{margin-top:14px} .about-welcome-copy>p{margin-top:16px;color:var(--muted);max-width:640px} .about-welcome-copy .btn{margin-top:18px} .about-welcome-stats{margin-top:28px;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;max-width:620px} .about-welcome-stats article{padding-top:16px;border-top:1px solid var(--line)} .about-welcome-stats strong{display:block;font-family:var(--title-font);font-size:clamp(32px,3vw,42px);line-height:1;color:#252a33} .about-welcome-stats article:nth-child(2) strong{color:#8bbd34} .about-welcome-stats article:nth-child(3) strong{color:#f3704b} .about-welcome-stats span{display:block;margin-top:8px;font-size:12px;line-height:1.45;color:var(--muted)} .about-welcome-section.is-visible .about-welcome-photo, .about-welcome-section.is-visible .about-welcome-shape, .about-welcome-section.is-visible .about-welcome-mark{ opacity:1; transform:none; transition:opacity .55s ease,transform .65s cubic-bezier(.2,.72,.2,1); } .about-welcome-section.is-visible .about-welcome-photo-tall{transition-delay:.08s} .about-welcome-section.is-visible .about-welcome-photo-small{transition-delay:.16s} .about-welcome-section.is-visible .about-welcome-shape-top{transition-delay:.18s} .about-welcome-section.is-visible .about-welcome-shape-bottom{transition-delay:.24s} .about-welcome-section.is-visible .about-welcome-mark{transition-delay:.3s} .about-story-section{background:#fff} .about-story-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:64px;align-items:start} .about-story-intro h2{margin-top:14px} .about-story-intro>p{margin-top:16px;color:var(--muted);max-width:560px} .about-story-list{display:grid;gap:0;border-top:1px solid var(--line)} .about-story-list article{display:grid;grid-template-columns:72px 1fr;gap:18px;padding:24px 0;border-bottom:1px solid var(--line);transition:padding-left .28s ease,background .28s ease} .about-story-list article:hover{padding-left:10px;background:linear-gradient(90deg,rgba(255,181,31,.07),transparent 70%)} .about-story-number{width:48px;height:48px;border-radius:50%;border:1px solid var(--line);display:grid;place-items:center;font-size:11px;font-weight:900;color:#a56b00} .about-story-list h3{margin:0 0 8px} .about-story-list p{margin:0;color:var(--muted)} .about-how-section{overflow:hidden;background:#fff} .about-how-heading{max-width:880px} .about-how-heading h2{margin-top:14px} .about-how-heading>p{max-width:720px;margin:16px auto 0} .about-how-shell{position:relative;padding-top:14px;padding-bottom:110px} .about-how-cards{display:grid;grid-template-columns:repeat(4,1fr);gap:0;position:relative;z-index:2} .about-how-card{padding:0 20px 122px;opacity:0;transform:translateY(26px)} .about-how-card:not(:last-child){border-right:1px solid var(--line)} .about-how-card h3{margin:0 0 12px;font-size:28px;line-height:1.1} .about-how-card p{max-width:210px;margin:0;color:var(--muted)} .about-how-ribbon{position:absolute;left:0;right:0;bottom:0;height:190px;z-index:1;pointer-events:none} .about-how-ribbon svg{width:100%;height:100%;display:block} .about-how-ribbon-path{fill:none;stroke:url(#aboutRibbon);stroke-width:16;stroke-linecap:round;stroke-linejoin:round;filter:drop-shadow(0 10px 18px rgba(242,100,66,.16));stroke-dasharray:1800;stroke-dashoffset:1800} .about-how-ribbon-path-back{stroke:rgba(17,24,39,.06);stroke-width:22;filter:none} .about-how-section.is-visible .about-how-card{opacity:1;transform:none;transition:opacity .55s ease,transform .55s cubic-bezier(.2,.72,.2,1)} .about-how-section.is-visible .about-how-card-2{transition-delay:.08s} .about-how-section.is-visible .about-how-card-3{transition-delay:.16s} .about-how-section.is-visible .about-how-card-4{transition-delay:.24s} .about-how-section.is-visible .about-how-ribbon-path{animation:aboutRibbonDraw 1.7s cubic-bezier(.2,.72,.2,1) forwards, aboutRibbonWave 8s ease-in-out 1.8s infinite} @keyframes aboutRibbonDraw{to{stroke-dashoffset:0}} @keyframes aboutRibbonWave{0%,100%{transform:translateX(0)}50%{transform:translateX(10px)}} .about-models-section{background:#fffdf8} .about-models-layout{display:grid;grid-template-columns:.96fr 1.04fr;gap:64px;align-items:center} .about-models-copy h2{margin-top:14px} .about-models-copy>p{margin-top:16px;color:var(--muted)} .about-model-points{margin-top:24px;display:grid;gap:14px} .about-model-points article{padding:18px 18px;border:1px solid var(--line);border-radius:18px;background:#fff;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease} .about-model-points article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.3);box-shadow:0 18px 35px rgba(17,24,39,.07)} .about-model-points strong{display:block;font-size:18px;line-height:1.2;color:#252a33} .about-model-points p{margin:8px 0 0;color:var(--muted)} .about-models-media{position:relative;min-height:540px} .about-models-main-photo{position:absolute;inset:0;margin:0;overflow:hidden;border-radius:28px;box-shadow:0 28px 56px rgba(17,24,39,.09)} .about-models-main-photo img{width:100%;height:100%;object-fit:cover;display:block} .about-models-floating-card{position:absolute;max-width:220px;padding:16px 18px;border-radius:16px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 30px rgba(17,24,39,.08)} .about-models-floating-card span{display:block;font-size:12px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#d88b00} .about-models-floating-card p{margin:8px 0 0;color:#4f5864;font-size:14px;line-height:1.55} .about-models-card-a{left:-18px;bottom:64px} .about-models-card-b{right:-16px;top:42px} .about-models-orbit{position:absolute;right:34px;bottom:34px;width:92px;height:92px;border-radius:50%;border:1px solid rgba(255,181,31,.38)} .about-models-orbit::before,.about-models-orbit::after{content:"";position:absolute;border-radius:50%;background:#ffb51f} .about-models-orbit::before{width:12px;height:12px;left:10px;top:40px;box-shadow:0 0 0 4px rgba(255,181,31,.16)} .about-models-orbit::after{width:10px;height:10px;right:12px;top:14px;box-shadow:0 0 0 4px rgba(255,181,31,.14)} .about-models-section.is-visible .about-models-orbit{animation:aboutOrbit 10s linear infinite} @keyframes aboutOrbit{to{transform:rotate(360deg)}} .about-team-photo-section{background:#fff} .about-team-photo-shell{display:grid;grid-template-columns:1.03fr .97fr;gap:58px;align-items:center} .about-team-photo-image{min-height:440px;overflow:hidden;border-radius:28px;box-shadow:0 24px 48px rgba(17,24,39,.08)} .about-team-photo-image img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s ease} .about-team-photo-image:hover img{transform:scale(1.04)} .about-team-photo-copy h2{margin-top:14px} .about-team-photo-copy>p{margin-top:16px;color:var(--muted)} .about-team-photo-list{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:12px} .about-team-photo-list li{position:relative;padding-left:28px;color:#4f5864;line-height:1.6} .about-team-photo-list li::before{content:"";position:absolute;left:0;top:8px;width:10px;height:10px;border-radius:50%;background:#ffb51f;box-shadow:0 0 0 5px rgba(255,181,31,.14)} .about-team-photo-copy .btn{margin-top:22px} @media(max-width:980px){ .enterprise-tab-copy{min-height:0!important;max-width:none!important} .enterprise-tab-copy h2 .title-line{white-space:normal} .enterprise-tab-copy p{min-height:0!important} .enterprise-tab-media{height:auto!important;min-height:420px!important} .enterprise-control-stage{height:auto!important} .enterprise-control-core{width:270px!important;height:270px!important} .enterprise-control-node{width:auto!important;min-height:0!important} .about-welcome-layout, .about-story-grid, .about-models-layout, .about-team-photo-shell{grid-template-columns:1fr} .about-welcome-media{min-height:460px} .about-how-cards{grid-template-columns:1fr 1fr;gap:18px} .about-how-card{padding:0 0 44px;border-right:none!important} .about-how-card p{max-width:none} .about-how-ribbon{height:150px} .about-models-media{min-height:460px} .about-models-card-a{left:18px;bottom:18px} .about-models-card-b{right:18px;top:18px} } @media(max-width:680px){ .about-welcome-media{min-height:360px} .about-welcome-photo-wide{width:52%;height:120px} .about-welcome-photo-tall{left:36%;width:34%;height:180px} .about-welcome-photo-small{top:172px;width:46%;height:120px} .about-welcome-mark{left:42%;top:208px;font-size:32px} .about-welcome-shape-bottom{top:224px;left:35%} .about-welcome-stats{grid-template-columns:1fr} .about-story-list article{grid-template-columns:54px 1fr} .about-how-cards{grid-template-columns:1fr} .about-how-card{padding-bottom:22px} .about-how-ribbon{height:110px} .about-models-media{min-height:340px} .about-team-photo-image{min-height:320px} } @media(prefers-reduced-motion:reduce){ .about-welcome-photo, .about-welcome-shape, .about-welcome-mark, .about-how-card, .about-how-ribbon-path, .about-models-orbit, .about-team-photo-image img{ transition:none!important; animation:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.63 ABOUT TARGETED POLISH + CONTACT MAIN PAGE ========================================================= */ body:not(.home) .about-welcome-section, body:not(.home) .about-story-section, body:not(.home) .about-how-section, body:not(.home) .about-models-section, body:not(.home) .about-team-photo-section{ padding-block:var(--global-section-space); } /* About story: new connected-workday board */ .about-story-connected{background:#fffdf8} .about-story-heading{max-width:880px} .about-story-heading>p{max-width:700px;margin:16px auto 0} .about-story-board{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;align-items:stretch} .about-story-board-main{position:relative;min-height:500px;padding:42px;overflow:hidden;border-radius:26px;background:#252a33;color:#fff;display:flex;flex-direction:column;justify-content:flex-end} .about-story-board-main::before{content:"";position:absolute;right:-80px;top:-100px;width:360px;height:360px;border-radius:50%;border:1px solid rgba(255,181,31,.28);box-shadow:0 0 0 34px rgba(255,181,31,.035),0 0 0 70px rgba(255,145,77,.025)} .about-story-board-main::after{content:"";position:absolute;right:70px;top:78px;width:11px;height:11px;border-radius:50%;background:#ffb51f;box-shadow:0 0 0 8px rgba(255,181,31,.12);animation:aboutStoryPulse 2.8s ease-in-out infinite} @keyframes aboutStoryPulse{50%{transform:scale(1.35);box-shadow:0 0 0 14px rgba(255,181,31,.04)}} .about-story-board-kicker{position:relative;z-index:2;color:#ffd45a;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase} .about-story-board-main h3{position:relative;z-index:2;max-width:620px;margin:16px 0 0;color:#fff;font-size:clamp(32px,3.2vw,46px);line-height:1.06;letter-spacing:-.04em} .about-story-board-main>p{position:relative;z-index:2;max-width:620px;margin:18px 0 0;color:rgba(255,255,255,.72)} .about-story-flow{position:relative;z-index:2;margin-top:34px;display:flex;align-items:center;gap:12px;flex-wrap:wrap} .about-story-flow span{padding:10px 14px;border:1px solid rgba(255,255,255,.12);border-radius:999px;background:rgba(255,255,255,.07);font-size:12px;font-weight:800} .about-story-flow i{width:34px;height:2px;background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59);transform-origin:left;animation:aboutStoryFlow 2.4s ease-in-out infinite} @keyframes aboutStoryFlow{50%{transform:scaleX(.45);opacity:.48}} .about-story-board-side{display:grid;grid-template-rows:repeat(3,1fr);gap:16px} .about-story-board-side article{padding:24px;border:1px solid var(--line);border-radius:20px;background:#fff;transition:transform .32s ease,border-color .32s ease,box-shadow .32s ease} .about-story-board-side article:hover{transform:translateX(6px);border-color:rgba(255,181,31,.38);box-shadow:0 18px 36px rgba(17,24,39,.07)} .about-story-board-side article>span{color:#a16a00;font-size:10px;font-weight:900} .about-story-board-side h3{margin:14px 0 8px} .about-story-board-side p{margin:0;color:var(--muted)} /* About welcome collage retained from current approved direction */ .about-welcome-layout{grid-template-columns:.92fr 1.08fr;gap:72px;align-items:center} .about-welcome-media{position:relative;min-height:470px;padding-left:12px} .about-welcome-photo{position:absolute;margin:0;overflow:hidden;border-radius:26px;box-shadow:0 24px 44px rgba(17,24,39,.08);opacity:0;transform:translateY(22px)} .about-welcome-photo img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .6s cubic-bezier(.2,.72,.2,1)} .about-welcome-photo:hover img{transform:scale(1.035)} .about-welcome-photo-wide{left:18px;top:38px;width:42%;height:190px;z-index:2} .about-welcome-photo-tall{left:43%;top:12px;width:36%;height:260px;z-index:3} .about-welcome-photo-small{left:20px;top:250px;width:50%;height:160px;z-index:2} .about-welcome-shape{position:absolute;opacity:0;transform:translateY(12px) scale(.8)} .about-welcome-shape-top{left:0;top:22px;width:34px;height:64px;border-radius:18px;background:linear-gradient(180deg,#ff8b45,#ff6936)} .about-welcome-shape-bottom{left:49%;top:300px;width:42px;height:42px} .about-welcome-shape-bottom::before,.about-welcome-shape-bottom::after{content:"";position:absolute;inset:19px 0 auto 0;height:4px;border-radius:999px;background:#f0b221} .about-welcome-shape-bottom::before{transform:rotate(45deg)} .about-welcome-shape-bottom::after{transform:rotate(-45deg)} .about-welcome-mark{position:absolute;left:49%;top:292px;color:#f0b221;font-size:48px;line-height:1;font-weight:300;opacity:0;transform:translateY(12px)} .about-welcome-copy{padding-bottom:10px}.about-welcome-copy h2{margin-top:14px}.about-welcome-copy>p{margin-top:16px;color:var(--muted);max-width:640px}.about-welcome-copy .btn{margin-top:28px} .about-welcome-section.is-visible .about-welcome-photo,.about-welcome-section.is-visible .about-welcome-shape,.about-welcome-section.is-visible .about-welcome-mark{opacity:1;transform:none;transition:opacity .55s ease,transform .65s cubic-bezier(.2,.72,.2,1)} .about-welcome-section.is-visible .about-welcome-photo-tall{transition-delay:.08s}.about-welcome-section.is-visible .about-welcome-photo-small{transition-delay:.16s} /* How We Work: reference animation preserved, left side now filled */ .about-how-section{position:relative;overflow:hidden;background:#fff} .about-how-heading{max-width:820px;margin-bottom:34px!important}.about-how-heading h2{margin-top:14px}.about-how-heading>p{max-width:620px;margin:14px auto 0;color:var(--muted)} .about-how-reference-shell{position:relative;max-width:1080px;min-height:930px;margin:0 auto;padding:10px 0 36px} .about-how-context-panel{position:absolute;left:0;top:38px;width:39%;padding:26px;border:1px solid var(--line);border-radius:22px;background:#fffdf8;box-shadow:0 18px 40px rgba(17,24,39,.055)} .about-how-context-kicker{display:block;color:#a16a00;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase} .about-how-context-panel>h3{margin:12px 0 0;font-size:26px;line-height:1.12}.about-how-context-panel>p{margin:12px 0 0;color:var(--muted)} .about-how-context-stack{margin-top:22px;display:grid;gap:10px} .about-how-context-stack article{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:center;padding:12px;border:1px solid var(--line);border-radius:14px;background:#fff;transition:transform .28s ease,border-color .28s ease} .about-how-context-stack article:hover{transform:translateX(4px);border-color:rgba(255,181,31,.36)} .about-how-context-icon{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:#fff2bf;color:#d78800} .about-how-context-icon svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round} .about-how-context-stack strong{display:block;font-size:13px}.about-how-context-stack small{display:block;margin-top:3px;color:var(--muted);font-size:11px;line-height:1.45} .about-how-context-result{margin-top:16px;padding:15px;border-radius:14px;background:#252a33;color:#fff} .about-how-context-result span{display:block;color:#ffd45a;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.about-how-context-result strong{display:block;margin-top:7px;font-size:13px;line-height:1.5} .about-how-line{position:absolute;left:45.8%;top:26px;bottom:64px;width:34px;display:flex;justify-content:center;z-index:1;pointer-events:none} .about-how-line-base,.about-how-line-fill{position:absolute;top:0;width:2px;border-radius:999px} .about-how-line-base{height:100%;background:repeating-linear-gradient(to bottom,rgba(37,42,51,.12) 0 8px,transparent 8px 16px)} .about-how-line-fill{height:0;background:linear-gradient(180deg,#ffbd20 0%,#ff9a45 52%,#ff6f59 100%);box-shadow:0 0 14px rgba(255,145,77,.18);will-change:height} .about-how-line-tip{position:absolute;left:50%;top:0;width:10px;height:10px;border-radius:50%;background:#ff914d;box-shadow:0 0 0 5px rgba(255,145,77,.11);transform:translate(-50%,-50%);opacity:0;will-change:top,opacity} .about-how-steps{position:relative;z-index:2;margin-left:45.8%} .about-how-step{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:18px;align-items:start;min-height:210px} .about-how-step-index{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:#fff;border:1px solid rgba(37,42,51,.14);color:#7d8792;font-size:12px;font-weight:800;box-shadow:0 6px 18px rgba(17,24,39,.04);transform:scale(.88);opacity:.65;transition:background .3s ease,border-color .3s ease,color .3s ease,box-shadow .3s ease,transform .3s ease,opacity .3s ease} .about-how-step-card{max-width:410px;margin-top:-2px;padding:18px 20px;border:1px solid rgba(37,42,51,.07);border-radius:12px;background:#fff;box-shadow:0 10px 24px rgba(17,24,39,.035);opacity:.42;transform:translateY(14px);transition:opacity .34s ease,transform .34s ease,box-shadow .34s ease,border-color .34s ease} .about-how-step-card h3{margin:0 0 8px;font-size:18px;line-height:1.22;color:#252a33}.about-how-step-card p{margin:0;color:#687381;font-size:12px;line-height:1.65} .about-how-step.is-active .about-how-step-index{background:linear-gradient(135deg,#ffbd20,#ff914d);border-color:#ffad20;color:#252a33;box-shadow:0 0 0 7px rgba(255,181,31,.12),0 9px 22px rgba(255,145,77,.14);transform:scale(1);opacity:1} .about-how-step.is-active .about-how-step-card{opacity:1;transform:none;border-color:rgba(255,181,31,.16);box-shadow:0 12px 28px rgba(17,24,39,.06)} /* Contact hero + form */ .contact-main-hero .hubstaff-hero-copy{max-width:none}.contact-main-hero h1{max-width:1080px} .contact-form-layout{display:grid;grid-template-columns:.82fr 1.18fr;gap:54px;align-items:stretch} .contact-form-copy{min-height:640px;display:flex;flex-direction:column;justify-content:center}.contact-form-copy>p{margin:16px 0 0;color:var(--muted)} .contact-direct-list{margin-top:28px;display:grid;gap:12px} .contact-direct-list>a{display:grid;grid-template-columns:48px 1fr;gap:13px;align-items:center;padding:16px;border:1px solid var(--line);border-radius:16px;background:#fffdf8;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease} .contact-direct-list>a:hover{transform:translateX(5px);border-color:rgba(255,181,31,.38);box-shadow:0 15px 32px rgba(17,24,39,.06)} .contact-direct-icon{width:46px;height:46px;display:grid;place-items:center;border-radius:13px;background:#252a33;color:#fff} .contact-direct-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round} .contact-direct-list strong,.contact-direct-list small{display:block}.contact-direct-list small{margin-top:4px;color:var(--muted)} .contact-form-card{min-height:640px;padding:32px;border:1px solid var(--line);border-radius:26px;background:#fffdf8;box-shadow:0 18px 46px rgba(17,24,39,.055)} .contact-field-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.contact-form-card label{display:flex;flex-direction:column;gap:7px}.contact-form-card label>span{color:#4f5864;font-size:12px;font-weight:800} .contact-form-card input,.contact-form-card select,.contact-form-card textarea{width:100%;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--ink);font:inherit;outline:none;transition:border-color .25s ease,box-shadow .25s ease} .contact-form-card input,.contact-form-card select{min-height:48px;padding:0 13px}.contact-form-card textarea{padding:13px;resize:vertical} .contact-form-card input:focus,.contact-form-card select:focus,.contact-form-card textarea:focus{border-color:#ffb51f;box-shadow:0 0 0 4px rgba(255,181,31,.12)} .contact-message-field{margin-top:14px}.contact-form-card .btn{margin-top:18px}.contact-form-note{display:block;margin-top:12px;color:var(--muted);line-height:1.5}.contact-form-note a{text-decoration:underline} .contact-honeypot{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;opacity:0!important} /* Contact route cards */ .contact-paths-section{background:#fffdf8}.contact-paths-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px} .contact-path-card{min-height:330px;padding:26px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;background:#fff;transition:transform .32s ease,border-color .32s ease,box-shadow .32s ease} .contact-path-card:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.38);box-shadow:0 22px 44px rgba(17,24,39,.08)} .contact-path-index{color:#a16a00;font-size:10px;font-weight:900}.contact-path-card h3{margin:32px 0 10px}.contact-path-card p{margin:0 0 22px;color:var(--muted)}.contact-path-card .btn{margin-top:auto;align-self:flex-start} /* Contact support split */ .contact-support-layout{display:grid;grid-template-columns:1fr 1fr;gap:54px;align-items:stretch} .contact-support-media{position:relative;min-height:610px;overflow:hidden;border-radius:28px}.contact-support-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .65s ease}.contact-support-media:hover img{transform:scale(1.035)} .contact-support-badge{position:absolute;left:22px;right:22px;bottom:22px;padding:18px;border-radius:16px;background:rgba(255,255,255,.94);backdrop-filter:blur(10px)} .contact-support-badge strong,.contact-support-badge span{display:block}.contact-support-badge span{margin-top:5px;color:var(--muted);font-size:12px} .contact-support-copy{min-height:610px;display:flex;flex-direction:column;justify-content:center}.contact-support-copy>p{margin:16px 0 0;color:var(--muted)} .contact-support-checks{margin-top:26px;border-top:1px solid var(--line)}.contact-support-checks article{display:grid;grid-template-columns:44px 1fr;gap:16px;padding:18px 0;border-bottom:1px solid var(--line)} .contact-support-checks article>span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#fff0ba;color:#9a6600;font-size:10px;font-weight:900} .contact-support-checks h3{margin:0 0 6px}.contact-support-checks p{margin:0;color:var(--muted)} /* Drive Zoom Parallax adaptation */ .contact-parallax-section{position:relative;background:#fffdf8;padding-top:var(--global-section-space);overflow:clip} .contact-parallax-heading{margin-bottom:36px!important}.contact-parallax-heading>p{max-width:720px;margin:16px auto 0} .contact-parallax-track{position:relative;height:210vh} .contact-parallax-sticky{position:sticky;top:82px;height:calc(100vh - 82px);min-height:640px;overflow:hidden;background:#252a33;border-radius:30px 30px 0 0;perspective:1000px} .contact-parallax-tile{position:absolute;margin:0;overflow:hidden;border-radius:18px;box-shadow:0 24px 50px rgba(0,0,0,.22);will-change:transform} .contact-parallax-tile img{width:100%;height:100%;object-fit:cover;display:block} .contact-parallax-tile-main{left:50%;top:50%;width:34vw;max-width:500px;height:40vh;transform:translate(-50%,-50%);z-index:3} .contact-parallax-tile-a{left:5vw;top:8vh;width:25vw;height:25vh}.contact-parallax-tile-b{right:4vw;top:12vh;width:24vw;height:30vh}.contact-parallax-tile-c{right:9vw;bottom:7vh;width:27vw;height:24vh} .contact-parallax-center-copy{position:absolute;left:50%;bottom:7%;z-index:5;transform:translateX(-50%);min-width:290px;padding:16px 20px;text-align:center;border:1px solid rgba(255,255,255,.10);border-radius:16px;background:rgba(11,12,16,.76);backdrop-filter:blur(12px);color:#fff} .contact-parallax-center-copy>span{display:block;color:#ffd45a;font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.contact-parallax-center-copy strong,.contact-parallax-center-copy small{display:block}.contact-parallax-center-copy strong{margin-top:7px}.contact-parallax-center-copy small{margin-top:5px;color:rgba(255,255,255,.62)} /* Contact expectation */ .contact-expect-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:64px;align-items:start}.contact-expect-intro{position:sticky;top:120px}.contact-expect-intro>p{margin:16px 0 0;color:var(--muted)} .contact-expect-steps{border-top:1px solid var(--line)}.contact-expect-steps article{display:grid;grid-template-columns:54px .8fr 1.2fr;gap:18px;align-items:start;padding:24px 0;border-bottom:1px solid var(--line);transition:padding-left .3s ease,background .3s ease} .contact-expect-steps article:hover{padding-left:10px;background:linear-gradient(90deg,rgba(255,181,31,.07),transparent 72%)} .contact-expect-steps article>span{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#252a33;color:#fff;font-size:10px;font-weight:900} .contact-expect-steps h3{margin:7px 0 0}.contact-expect-steps p{margin:5px 0 0;color:var(--muted)} /* Contact FAQ */ section.worklix-faq-section.contact-faq-white{background:#fff!important;background-color:#fff!important;color:#252a33!important} .contact-faq-white .faq-heading h2,.contact-faq-white .faq-list summary{color:#252a33!important}.contact-faq-white .faq-heading p,.contact-faq-white .faq-list details p{color:#657080!important;opacity:1!important} .contact-faq-white .faq-list details{background:#fff!important;color:#252a33!important;border-color:#e1e4e9!important}.contact-faq-white .faq-list details[open]{background:#fffaf0!important;border-color:rgba(255,181,31,.42)!important} /* Contact reveals */ [data-contact-reveal] .contact-form-copy,[data-contact-reveal] .contact-form-card,[data-contact-reveal] .contact-path-card,[data-contact-reveal] .contact-support-media,[data-contact-reveal] .contact-support-copy,[data-contact-reveal] .contact-expect-intro,[data-contact-reveal] .contact-expect-steps{opacity:0;transform:translateY(20px)} [data-contact-reveal].is-visible .contact-form-copy,[data-contact-reveal].is-visible .contact-form-card,[data-contact-reveal].is-visible .contact-path-card,[data-contact-reveal].is-visible .contact-support-media,[data-contact-reveal].is-visible .contact-support-copy,[data-contact-reveal].is-visible .contact-expect-intro,[data-contact-reveal].is-visible .contact-expect-steps{opacity:1;transform:none;transition:opacity .58s ease,transform .58s cubic-bezier(.2,.72,.2,1)} [data-contact-reveal].is-visible .contact-form-card,[data-contact-reveal].is-visible .contact-support-copy,[data-contact-reveal].is-visible .contact-expect-steps{transition-delay:.08s} [data-contact-reveal].is-visible .contact-path-card:nth-child(2){transition-delay:.05s}[data-contact-reveal].is-visible .contact-path-card:nth-child(3){transition-delay:.10s}[data-contact-reveal].is-visible .contact-path-card:nth-child(4){transition-delay:.15s} @media(max-width:980px){ .about-welcome-layout,.about-story-board,.contact-form-layout,.contact-support-layout,.contact-expect-layout{grid-template-columns:1fr} .about-welcome-media{min-height:400px;max-width:640px;margin:0 auto}.about-story-board-main{min-height:440px} .about-how-reference-shell{min-height:0;padding:4px 0 20px}.about-how-context-panel{position:relative;left:auto;top:auto;width:100%;margin-bottom:32px}.about-how-line{left:0;top:18px;bottom:32px;width:34px}.about-how-steps{margin-left:0}.about-how-step{grid-template-columns:44px minmax(0,1fr);gap:16px;min-height:0}.about-how-step+.about-how-step{margin-top:28px}.about-how-step-card{max-width:none} .contact-form-copy,.contact-form-card,.contact-support-copy{min-height:0}.contact-paths-grid{grid-template-columns:1fr 1fr}.contact-support-media{min-height:480px} .contact-parallax-track{height:auto}.contact-parallax-sticky{position:relative;top:auto;height:auto;min-height:760px;border-radius:26px}.contact-parallax-tile-main{width:54vw;max-width:none}.contact-parallax-tile-a{left:5%;width:32vw}.contact-parallax-tile-b{right:5%;width:31vw}.contact-parallax-tile-c{right:7%;width:35vw} .contact-expect-intro{position:static} } @media(max-width:680px){ .about-welcome-media{min-height:318px;padding-left:0}.about-welcome-photo-wide{left:12px;top:28px;width:48%;height:120px}.about-welcome-photo-tall{left:42%;top:6px;width:40%;height:168px}.about-welcome-photo-small{left:12px;top:170px;width:56%;height:112px} .about-story-board-main{min-height:400px;padding:28px}.about-story-flow{gap:8px}.about-story-flow i{width:18px} .about-how-heading{margin-bottom:26px!important}.about-how-line{left:-1px;top:17px;bottom:28px}.about-how-step{grid-template-columns:36px minmax(0,1fr);gap:13px}.about-how-step-index{width:30px;height:30px;font-size:11px}.about-how-step-card{padding:17px;border-radius:11px}.about-how-context-panel{padding:20px} .contact-field-grid,.contact-paths-grid{grid-template-columns:1fr}.contact-form-card{padding:22px}.contact-support-media{min-height:360px} .contact-parallax-sticky{min-height:620px}.contact-parallax-tile-main{width:72vw;height:30vh}.contact-parallax-tile-a{left:4%;top:6%;width:38vw;height:18vh}.contact-parallax-tile-b{right:4%;top:9%;width:36vw;height:20vh}.contact-parallax-tile-c{right:5%;bottom:8%;width:45vw;height:18vh}.contact-parallax-center-copy{min-width:0;width:calc(100% - 32px)} .contact-expect-steps article{grid-template-columns:44px 1fr;gap:12px}.contact-expect-steps h3,.contact-expect-steps p{grid-column:2} } @media(prefers-reduced-motion:reduce){ .about-story-board-main::after,.about-story-flow i,.about-welcome-photo,.about-welcome-shape,.about-welcome-mark,.about-how-step-index,.about-how-step-card,.contact-support-media img,.contact-parallax-tile,[data-contact-reveal] *{animation:none!important;transition:none!important;transform:none!important;opacity:1!important} .about-how-line-fill{height:100%!important}.about-how-line-tip{top:100%!important;opacity:1!important} } /* ========================================================= V1.66 ABOUT IMAGE MOSAIC + STORY PANEL CLEANUP ========================================================= */ /* About Welcome: clean 3-image mosaic only — no text/shapes over media */ .about-welcome-layout{ display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:stretch; } .about-welcome-media{ min-height:520px; display:grid; grid-template-columns:1.15fr .85fr; grid-template-rows:1fr 1fr; gap:16px; } .about-welcome-photo{ position:relative; margin:0; overflow:hidden; border-radius:24px; background:#f2f3f5; box-shadow:0 18px 42px rgba(17,24,39,.08); opacity:0; transform:translateY(18px); } .about-welcome-photo-wide{ grid-column:1; grid-row:1 / 3; } .about-welcome-photo-tall{ grid-column:2; grid-row:1; } .about-welcome-photo-small{ grid-column:2; grid-row:2; } .about-welcome-photo img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .55s cubic-bezier(.2,.72,.2,1); } .about-welcome-photo:hover img{ transform:scale(1.035); } .about-welcome-copy{ min-height:520px; display:flex; flex-direction:column; justify-content:center; } .about-welcome-copy h2{ margin-top:14px; } .about-welcome-copy>p{ max-width:640px; margin-top:16px; color:var(--muted); } .about-welcome-copy .btn{ margin-top:26px; align-self:flex-start; } .about-welcome-section.is-visible .about-welcome-photo{ opacity:1; transform:none; transition: opacity .55s ease, transform .62s cubic-bezier(.2,.72,.2,1); } .about-welcome-section.is-visible .about-welcome-photo-tall{ transition-delay:.08s; } .about-welcome-section.is-visible .about-welcome-photo-small{ transition-delay:.16s; } /* About Story: premium dark left panel with a different visual language */ .about-story-connected{ background:#fffdf8; } .about-story-heading{ max-width:880px; } .about-story-heading>p{ max-width:700px; margin:16px auto 0; } .about-story-board{ display:grid; grid-template-columns:1.12fr .88fr; gap:18px; align-items:stretch; } .about-story-board-main{ min-height:540px; padding:42px; display:flex; flex-direction:column; justify-content:space-between; border-radius:28px; background: radial-gradient(circle at 84% 18%,rgba(255,181,31,.16),transparent 27%), linear-gradient(160deg,#292e37 0%,#1d222a 100%); color:#fff; border:1px solid rgba(255,181,31,.12); box-shadow:0 26px 60px rgba(17,24,39,.14); } .about-story-board-copy{ position:relative; z-index:2; } .about-story-board-kicker{ display:block; color:#ffd45a; font-size:11px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .about-story-board-main h3{ max-width:610px; margin:16px 0 0; color:#fff; font-size:clamp(32px,3.15vw,46px); line-height:1.06; letter-spacing:-.04em; } .about-story-board-main p{ max-width:620px; margin:18px 0 0; color:rgba(255,255,255,.72); } .about-story-signal-grid{ display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:34px; } .about-story-signal-grid article{ min-height:112px; padding:16px; display:grid; grid-template-columns:44px 1fr; gap:13px; align-items:center; border:1px solid rgba(255,255,255,.09); border-radius:16px; background:rgba(255,255,255,.055); backdrop-filter:blur(8px); transition: transform .3s ease, border-color .3s ease, background .3s ease; } .about-story-signal-grid article:hover{ transform:translateY(-4px); border-color:rgba(255,181,31,.28); background:rgba(255,181,31,.08); } .about-story-signal-wide{ grid-column:1 / 3; } .about-story-signal-icon{ width:42px; height:42px; display:grid; place-items:center; border-radius:13px; background:linear-gradient(135deg,#ffbd20,#ff914d); color:#252a33; box-shadow:0 0 0 6px rgba(255,181,31,.08); } .about-story-signal-icon svg{ width:21px; height:21px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } .about-story-signal-grid strong{ display:block; color:#fff; font-size:13px; } .about-story-signal-grid small{ display:block; margin-top:4px; color:rgba(255,255,255,.62); font-size:11px; line-height:1.5; } .about-story-board-side{ display:grid; grid-template-rows:repeat(3,1fr); gap:16px; } .about-story-board-side article{ padding:25px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 10px 26px rgba(17,24,39,.03); transition: transform .32s ease, border-color .32s ease, box-shadow .32s ease; } .about-story-board-side article:hover{ transform:translateX(7px); border-color:rgba(255,181,31,.36); box-shadow:0 18px 36px rgba(17,24,39,.07); } .about-story-board-side article>span{ color:#a16a00; font-size:10px; font-weight:900; } .about-story-board-side h3{ margin:14px 0 8px; } .about-story-board-side p{ margin:0; color:var(--muted); } /* Keep How We Work exactly as V1.65 — no extra left-side line */ .about-how-context-stack{ padding-left:0!important; } .about-how-context-stack::before, .about-how-context-stack::after, .about-how-context-stack article::before{ display:none!important; } .about-how-context-stack article{ opacity:1!important; transform:none!important; background:#fff; } .about-how-context-stack article.is-active{ background:#fffaf0; } .about-how-line{ bottom:auto!important; } /* Contact redesign from V1.65 retained */ .contact-conversation-section{ background:#fffdf8; } .contact-conversation-layout{ display:grid; grid-template-columns:.78fr 1.22fr; gap:56px; align-items:center; } .contact-conversation-copy h2{ margin-top:14px; } .contact-conversation-copy>p{ max-width:520px; margin:16px 0 0; color:var(--muted); } .contact-conversation-actions{ margin-top:24px; } .contact-conversation-board{ display:grid; grid-template-columns:1.12fr .88fr; grid-template-rows:repeat(2,minmax(210px,auto)); gap:16px; } .contact-conversation-card{ padding:24px; border:1px solid var(--line); border-radius:22px; background:#fff; transition: transform .32s ease, border-color .32s ease, box-shadow .32s ease; } .contact-conversation-card:hover{ transform:translateY(-6px); border-color:rgba(255,181,31,.34); box-shadow:0 20px 42px rgba(17,24,39,.08); } .contact-conversation-card-main{ grid-row:1 / 3; display:flex; flex-direction:column; justify-content:flex-end; background: radial-gradient(circle at 75% 18%,rgba(255,181,31,.18),transparent 28%), #252a33; color:#fff; } .contact-conversation-card>span{ display:block; color:#a16a00; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .contact-conversation-card-main>span{ color:#ffd45a; } .contact-conversation-card h3{ margin:16px 0 9px; } .contact-conversation-card-main h3{ color:#fff; font-size:clamp(30px,3vw,42px); } .contact-conversation-card p{ margin:0; color:var(--muted); } .contact-conversation-card-main p{ color:rgba(255,255,255,.70); } .contact-handoff-section{ background:#fff; } .contact-handoff-heading{ max-width:820px; } .contact-handoff-heading>p{ max-width:620px; margin:14px auto 0; } .contact-handoff-flow{ display:grid; grid-template-columns:repeat(3,1fr); gap:0; margin-top:34px; border:1px solid var(--line); border-radius:24px; overflow:hidden; background:#fff; } .contact-handoff-flow article{ position:relative; min-height:320px; padding:30px; transition:background .3s ease; } .contact-handoff-flow article+article{ border-left:1px solid var(--line); } .contact-handoff-flow article:hover{ background:#fffaf0; } .contact-handoff-number{ width:46px; height:46px; display:grid; place-items:center; border-radius:50%; background:#252a33; color:#fff; font-size:11px; font-weight:900; } .contact-handoff-line{ position:absolute; left:76px; right:-1px; top:52px; height:2px; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); transform-origin:left; transform:scaleX(.18); opacity:.45; transition:transform .45s ease,opacity .45s ease; } .contact-handoff-flow article:hover .contact-handoff-line{ transform:scaleX(1); opacity:1; } .contact-handoff-flow h3{ margin:72px 0 12px; } .contact-handoff-flow p{ margin:0; color:var(--muted); } /* Information/legal pages from V1.65 retained */ .doc-main-hero .hubstaff-hero-copy{ max-width:none; } .doc-main-hero h1{ max-width:1080px; } .doc-content-section{ background:#fff; padding-block:var(--global-section-space); } .doc-content-shell{ max-width:940px; margin:0 auto; } .doc-content-intro{ padding:0 0 30px; border-bottom:1px solid var(--line); } .doc-content-intro>p{ max-width:820px; margin:14px 0 0; color:#4f5966; font-size:18px; line-height:1.8; } .doc-content-body{ display:grid; } .doc-copy-block{ padding:34px 0; border-bottom:1px solid var(--line); } .doc-copy-block h2{ margin:0; font-size:clamp(26px,2.4vw,34px); line-height:1.18; letter-spacing:-.035em; } .doc-copy-block p{ max-width:840px; margin:14px 0 0; color:#657080; font-size:16px; line-height:1.85; } .doc-final-cta{ margin-top:0!important; } @media(max-width:980px){ .about-welcome-layout, .about-story-board{ grid-template-columns:1fr; } .about-welcome-media, .about-welcome-copy{ min-height:0; } .about-welcome-media{ height:520px; } .about-story-board-main{ min-height:500px; } .contact-conversation-layout{ grid-template-columns:1fr; } .contact-conversation-board{ grid-template-columns:1fr 1fr; } .contact-conversation-card-main{ grid-row:auto; grid-column:1 / 3; min-height:300px; } .contact-handoff-flow{ grid-template-columns:1fr; } .contact-handoff-flow article{ min-height:0; } .contact-handoff-flow article+article{ border-left:0; border-top:1px solid var(--line); } .contact-handoff-line{ display:none; } .contact-handoff-flow h3{ margin-top:34px; } } @media(max-width:680px){ .about-welcome-media{ height:410px; gap:12px; } .about-welcome-photo{ border-radius:18px; } .about-story-board-main{ min-height:440px; padding:28px; } .about-story-signal-grid{ grid-template-columns:1fr; } .about-story-signal-wide{ grid-column:auto; } .contact-conversation-board{ grid-template-columns:1fr; } .contact-conversation-card-main{ grid-column:auto; min-height:260px; } .contact-handoff-flow article{ padding:24px; } .doc-content-intro>p{ font-size:16px; } .doc-copy-block{ padding:28px 0; } .doc-copy-block p{ font-size:15px; } } @media(prefers-reduced-motion:reduce){ .about-welcome-photo, .about-story-signal-grid article, .about-story-board-side article{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.68 CONTACT ROUTE LEDGER + GLOBAL SPACING AUDIT ========================================================= */ /* About gallery from V1.67 retained cleanly */ .about-welcome-layout{ display:grid; grid-template-columns:1fr 1fr; gap:72px; align-items:stretch; } .about-v67-gallery{ min-height:540px; display:grid; grid-template-columns:1.25fr .75fr; grid-template-rows:1fr 1fr; gap:16px; } .about-v67-gallery figure{ margin:0; overflow:hidden; border-radius:24px; background:#f3f4f6; box-shadow:0 18px 42px rgba(17,24,39,.08); opacity:0; transform:translateY(16px); } .about-v67-gallery-main{ grid-column:1; grid-row:1 / 3; } .about-v67-gallery-top{ grid-column:2; grid-row:1; } .about-v67-gallery-bottom{ grid-column:2; grid-row:2; } .about-v67-gallery img{ width:100%; height:100%; display:block; object-fit:cover; object-position:center; transition:transform .55s cubic-bezier(.2,.72,.2,1); } .about-v67-gallery figure:hover img{ transform:scale(1.035); } .about-welcome-copy{ min-height:540px; display:flex; flex-direction:column; justify-content:center; } .about-welcome-section.is-visible .about-v67-gallery figure{ opacity:1; transform:none; transition:opacity .52s ease,transform .58s cubic-bezier(.2,.72,.2,1); } .about-welcome-section.is-visible .about-v67-gallery-top{ transition-delay:.07s; } .about-welcome-section.is-visible .about-v67-gallery-bottom{ transition-delay:.14s; } /* Contact page: all normal sections use the global vertical rhythm */ .contact-form-section, .contact-paths-section, .contact-support-section, .contact-conversation-section, .contact-handoff-section, .contact-faq-white{ padding-block:var(--global-section-space)!important; } /* Contact form: remove helper rows, keep equal height via layout only */ .contact-form-layout{ display:grid; grid-template-columns:.82fr 1.18fr; gap:54px; align-items:stretch; } .contact-form-copy, .contact-form-card{ min-height:640px; } .contact-form-copy{ display:flex; flex-direction:column; justify-content:center; } .contact-form-copy>p{ max-width:510px; margin-top:18px; color:var(--muted); line-height:1.72; } .contact-direct-list{ margin-top:28px; } .contact-form-card{ display:flex; align-items:center; } .contact-form-card form{ width:100%; } /* Completely unique conversation route ledger */ .contact-route-ledger-section{ position:relative; overflow:hidden; background:#fffdf8; } .contact-route-ledger-heading{ max-width:850px; } .contact-route-ledger-heading>p{ max-width:650px; margin:14px auto 0; } .contact-route-ledger{ position:relative; margin-top:36px; padding:22px; border-radius:28px; background:#252a33; box-shadow:0 28px 64px rgba(17,24,39,.12); overflow:hidden; } .contact-route-ledger::before{ content:""; position:absolute; right:-110px; top:-170px; width:420px; height:420px; border-radius:50%; border:1px solid rgba(255,181,31,.18); box-shadow: 0 0 0 42px rgba(255,181,31,.025), 0 0 0 84px rgba(255,145,77,.018); pointer-events:none; } .contact-route-ledger-row{ position:relative; display:grid; grid-template-columns:78px minmax(190px,.72fr) minmax(260px,1.2fr) auto; gap:22px; align-items:center; min-height:128px; padding:22px 24px; border:1px solid rgba(255,255,255,.08); border-radius:18px; background:rgba(255,255,255,.045); transition: transform .32s cubic-bezier(.2,.72,.2,1), background .32s ease, border-color .32s ease, box-shadow .32s ease; } .contact-route-ledger-row+ .contact-route-ledger-row{ margin-top:12px; } .contact-route-ledger-row:nth-child(2){ margin-left:20px; } .contact-route-ledger-row:nth-child(3){ margin-left:40px; } .contact-route-ledger-row:nth-child(4){ margin-left:60px; } .contact-route-ledger-row:hover{ transform:translateX(8px); background:rgba(255,181,31,.08); border-color:rgba(255,181,31,.30); box-shadow:0 16px 34px rgba(0,0,0,.12); } .contact-route-ledger-number{ width:56px; height:56px; display:grid; place-items:center; border-radius:16px; background:linear-gradient(135deg,#ffbd20,#ff914d); color:#252a33; font-size:12px; font-weight:900; box-shadow:0 0 0 6px rgba(255,181,31,.06); } .contact-route-ledger-title>span{ display:block; color:#ffd45a; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .contact-route-ledger-title h3{ margin:6px 0 0; color:#fff; } .contact-route-ledger-row>p{ margin:0; color:rgba(255,255,255,.68); } .contact-route-ledger-row>a{ display:inline-flex; align-items:center; gap:8px; white-space:nowrap; color:#fff; font-size:12px; font-weight:900; } .contact-route-ledger-row>a span{ width:32px; height:32px; display:grid; place-items:center; border-radius:50%; background:#ffb51f; color:#252a33; transition:transform .25s ease; } .contact-route-ledger-row:hover>a span{ transform:translateX(3px); } /* Existing Contact handoff section keeps global spacing only */ .contact-handoff-section{ background:#fff; } /* Remove obsolete V1.67 routing-canvas selectors from the cascade */ .contact-route-canvas, .contact-route-center, .contact-route-node, .contact-route-connectors{ display:none!important; } @media(max-width:980px){ .about-welcome-layout, .contact-form-layout{ grid-template-columns:1fr; } .about-v67-gallery, .about-welcome-copy{ min-height:0; } .about-v67-gallery{ height:520px; } .contact-form-copy, .contact-form-card{ min-height:0; } .contact-form-copy{ justify-content:flex-start; } .contact-form-copy>p{ max-width:650px; } .contact-route-ledger-row, .contact-route-ledger-row:nth-child(2), .contact-route-ledger-row:nth-child(3), .contact-route-ledger-row:nth-child(4){ margin-left:0; grid-template-columns:64px 1fr auto; } .contact-route-ledger-row>p{ grid-column:2 / 4; } } @media(max-width:680px){ .about-v67-gallery{ height:430px; gap:12px; grid-template-columns:1.15fr .85fr; } .about-v67-gallery figure{ border-radius:18px; } .contact-route-ledger{ padding:14px; border-radius:22px; } .contact-route-ledger-row{ grid-template-columns:50px 1fr; gap:14px; padding:18px; min-height:0; } .contact-route-ledger-number{ width:46px; height:46px; border-radius:14px; } .contact-route-ledger-title{ align-self:center; } .contact-route-ledger-row>p, .contact-route-ledger-row>a{ grid-column:1 / 3; } .contact-route-ledger-row>a{ margin-top:4px; } } @media(prefers-reduced-motion:reduce){ .about-v67-gallery figure, .about-v67-gallery img, .contact-route-ledger-row, .contact-route-ledger-row>a span{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.69 SECURITY MAIN PAGE Global Worklix heading, paragraph, button, gutter and CTA systems remain the source of truth. ========================================================= */ .security-main-hero .hubstaff-hero-copy{ max-width:none; } .security-main-hero h1{ max-width:1060px; } /* Foundation split */ .security-foundation-layout{ display:grid; grid-template-columns:.94fr 1.06fr; gap:56px; align-items:stretch; } .security-foundation-copy, .security-foundation-media{ min-height:590px; } .security-foundation-copy{ display:flex; flex-direction:column; justify-content:center; } .security-foundation-copy>p{ max-width:590px; margin:16px 0 0; color:var(--muted); } .security-foundation-points{ margin-top:28px; border-top:1px solid var(--line); } .security-foundation-points article{ display:grid; grid-template-columns:46px 1fr; gap:16px; padding:18px 0; border-bottom:1px solid var(--line); transition:padding-left .3s ease; } .security-foundation-points article:hover{ padding-left:8px; } .security-foundation-points article>span{ width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:#fff1bd; color:#9b6700; font-size:10px; font-weight:900; } .security-foundation-points h3{ margin:0 0 6px; } .security-foundation-points p{ margin:0; color:var(--muted); } .security-foundation-media{ position:relative; overflow:hidden; border-radius:28px; background:#eef0f2; box-shadow:0 24px 52px rgba(17,24,39,.08); } .security-foundation-media img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s ease; } .security-foundation-media:hover img{ transform:scale(1.035); } .security-foundation-overlay{ position:absolute; left:22px; right:22px; bottom:22px; padding:18px; border-radius:16px; background:rgba(255,255,255,.94); backdrop-filter:blur(12px); } .security-overlay-kicker{ display:block; color:#9b6700; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-access-map{ margin-top:12px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; } .security-access-map span{ padding:9px 12px; border:1px solid var(--line); border-radius:999px; background:#fff; font-size:11px; font-weight:800; } .security-access-map i{ width:30px; height:2px; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); animation:securityAccessFlow 2.4s ease-in-out infinite; } @keyframes securityAccessFlow{ 50%{transform:scaleX(.42);opacity:.45} } /* Four security layers */ .security-layers-section{ background:#fffdf8; } .security-layers-heading{ max-width:850px; } .security-layers-heading>p{ max-width:690px; margin:14px auto 0; } .security-layers-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; } .security-layer-card{ position:relative; min-height:340px; padding:26px; overflow:hidden; border:1px solid var(--line); border-radius:20px; background:#fff; transition: transform .34s ease, border-color .34s ease, box-shadow .34s ease; } .security-layer-card::after{ content:""; position:absolute; right:-38px; bottom:-38px; width:110px; height:110px; border-radius:50%; background:radial-gradient(circle,rgba(255,181,31,.18),rgba(255,181,31,0) 70%); transform:scale(.7); opacity:0; transition:transform .34s ease,opacity .34s ease; } .security-layer-card:hover{ transform:translateY(-7px); border-color:rgba(255,181,31,.38); box-shadow:0 22px 46px rgba(17,24,39,.09); } .security-layer-card:hover::after{ transform:scale(1); opacity:1; } .security-layer-number{ color:#9b6700; font-size:10px; font-weight:900; } .security-layer-icon{ width:54px; height:54px; display:grid; place-items:center; margin-top:44px; border-radius:15px; background:#252a33; color:#fff; transition:transform .32s ease,background .32s ease,color .32s ease; } .security-layer-card:hover .security-layer-icon{ transform:rotate(-5deg) scale(1.06); background:#ffb51f; color:#252a33; } .security-layer-icon svg{ width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } .security-layer-card h3{ margin:28px 0 10px; } .security-layer-card p{ margin:0; color:var(--muted); } /* Drive-inspired Scroll Expansion Media adapted to vanilla HTML/CSS/JS */ .security-expansion-section{ position:relative; height:210vh; overflow:clip; background:#090a0d; } .security-expansion-track{ height:210vh; } .security-expansion-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; display:flex; align-items:center; justify-content:center; background:#090a0d; } .security-expansion-grid{ position:absolute; inset:0; background: radial-gradient(circle at 50% 58%,rgba(255,181,31,.10),transparent 30%), linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px), linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px); background-size:auto,72px 72px,72px 72px; } .security-expansion-heading{ position:absolute; top:16%; left:50%; transform:translateX(-50%); z-index:3; text-align:center; color:#fff; } .security-expansion-heading h2{ margin:14px 0 0; color:#fff; } .security-expansion-heading h2 span{ display:block; will-change:transform,opacity; } .security-expansion-media{ position:absolute; left:50%; top:52%; width:min(500px,40vw); aspect-ratio:16/10; transform:translate(-50%,-50%) scale(.78); overflow:hidden; border-radius:26px; box-shadow:0 30px 80px rgba(0,0,0,.38); z-index:2; will-change:width,transform,border-radius; } .security-expansion-media img{ width:100%; height:100%; object-fit:cover; display:block; } .security-expansion-copy{ position:absolute; left:50%; bottom:7%; max-width:760px; transform:translate(-50%,24px); text-align:center; opacity:0; color:#fff; z-index:4; will-change:opacity,transform; } .security-expansion-copy-kicker{ display:block; color:#ffd45a; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-expansion-copy h3{ margin:10px 0 0; color:#fff; } .security-expansion-copy p{ max-width:690px; margin:12px auto 0; color:rgba(255,255,255,.70); } /* Permission matrix */ .security-permissions-section{ background:#fff; } .security-permissions-layout{ display:grid; grid-template-columns:1.08fr .92fr; gap:56px; align-items:center; } .security-permissions-board{ padding:24px; border:1px solid var(--line); border-radius:24px; background:#fffdf8; box-shadow:0 20px 44px rgba(17,24,39,.055); } .security-permissions-head{ display:flex; align-items:flex-end; justify-content:space-between; padding:0 4px 18px; } .security-permissions-head span{ color:#9b6700; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-permissions-head strong{ font-family:var(--title-font); font-size:20px; } .security-permission-row{ display:grid; grid-template-columns:1.5fr repeat(3,.65fr); gap:10px; align-items:center; min-height:64px; padding:0 14px; border-top:1px solid var(--line); transition:background .28s ease,transform .28s ease; } .security-permission-row:not(.security-permission-row-head):hover{ background:#fff6df; transform:translateX(4px); } .security-permission-row span, .security-permission-row b{ font-size:12px; } .security-permission-row b{ display:inline-flex; justify-content:center; color:#4f5864; } .security-permission-row-head{ background:#252a33; border:0; border-radius:14px; color:#fff; } .security-permission-row-head span{ color:#fff; font-weight:800; } .security-permissions-copy>p{ margin:16px 0 0; color:var(--muted); } .security-permissions-notes{ margin-top:24px; display:grid; gap:10px; } .security-permissions-notes article{ padding:16px 18px; border:1px solid var(--line); border-radius:15px; background:#fff; transition:transform .28s ease,border-color .28s ease; } .security-permissions-notes article:hover{ transform:translateX(5px); border-color:rgba(255,181,31,.36); } .security-permissions-notes strong, .security-permissions-notes span{ display:block; } .security-permissions-notes span{ margin-top:5px; color:var(--muted); font-size:12px; } /* Responsible monitoring split */ .security-monitoring-section{ background:#fffdf8; } .security-monitoring-layout{ display:grid; grid-template-columns:.94fr 1.06fr; gap:56px; align-items:stretch; } .security-monitoring-copy, .security-monitoring-media{ min-height:590px; } .security-monitoring-copy{ display:flex; flex-direction:column; justify-content:center; } .security-monitoring-copy>p{ margin:16px 0 0; color:var(--muted); } .security-monitoring-cards{ margin-top:26px; display:grid; gap:12px; } .security-monitoring-cards article{ display:grid; grid-template-columns:44px 1fr; gap:14px; padding:17px; border:1px solid var(--line); border-radius:16px; background:#fff; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .security-monitoring-cards article:hover{ transform:translateX(5px); border-color:rgba(255,181,31,.36); box-shadow:0 14px 30px rgba(17,24,39,.05); } .security-monitoring-cards article>span{ width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:#252a33; color:#fff; font-size:10px; font-weight:900; } .security-monitoring-cards h3{ margin:0 0 6px; } .security-monitoring-cards p{ margin:0; color:var(--muted); } .security-monitoring-media{ position:relative; overflow:hidden; border-radius:28px; background:#eef0f2; box-shadow:0 24px 52px rgba(17,24,39,.08); } .security-monitoring-media img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s ease; } .security-monitoring-media:hover img{ transform:scale(1.035); } .security-monitoring-label{ position:absolute; left:22px; bottom:22px; padding:16px 18px; border-radius:15px; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); } .security-monitoring-label span, .security-monitoring-label strong{ display:block; } .security-monitoring-label span{ color:#9b6700; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-monitoring-label strong{ margin-top:5px; } /* Deployment review */ .security-review-section{ background:#fff; } .security-review-heading{ max-width:850px; } .security-review-heading>p{ max-width:690px; margin:14px auto 0; } .security-review-flow{ display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-top:34px; border:1px solid var(--line); border-radius:24px; overflow:hidden; } .security-review-flow article{ position:relative; min-height:310px; padding:28px; background:#fff; transition:background .3s ease,transform .3s ease; } .security-review-flow article+article{ border-left:1px solid var(--line); } .security-review-flow article:hover{ background:#fffaf0; } .security-review-step{ width:44px; height:44px; display:grid; place-items:center; border-radius:50%; background:#252a33; color:#fff; font-size:10px; font-weight:900; transition:background .3s ease,color .3s ease,transform .3s ease; } .security-review-flow article:hover .security-review-step{ background:#ffb51f; color:#252a33; transform:rotate(-7deg); } .security-review-flow h3{ margin:62px 0 12px; } .security-review-flow p{ margin:0; color:var(--muted); } /* White FAQ */ section.worklix-faq-section.security-faq-white{ background:#fff!important; background-color:#fff!important; color:#252a33!important; } .security-faq-white .faq-heading h2, .security-faq-white .faq-list summary{ color:#252a33!important; } .security-faq-white .faq-heading p, .security-faq-white .faq-list details p{ color:#657080!important; opacity:1!important; } .security-faq-white .faq-list details{ background:#fff!important; color:#252a33!important; border-color:#e1e4e9!important; } .security-faq-white .faq-list details[open]{ background:#fffaf0!important; border-color:rgba(255,181,31,.42)!important; } /* Reveals */ [data-security-reveal] .security-foundation-copy, [data-security-reveal] .security-foundation-media, [data-security-reveal] .security-layer-card, [data-security-reveal] .security-permissions-board, [data-security-reveal] .security-permissions-copy, [data-security-reveal] .security-monitoring-copy, [data-security-reveal] .security-monitoring-media, [data-security-reveal] .security-review-flow{ opacity:0; transform:translateY(20px); } [data-security-reveal].is-visible .security-foundation-copy, [data-security-reveal].is-visible .security-foundation-media, [data-security-reveal].is-visible .security-layer-card, [data-security-reveal].is-visible .security-permissions-board, [data-security-reveal].is-visible .security-permissions-copy, [data-security-reveal].is-visible .security-monitoring-copy, [data-security-reveal].is-visible .security-monitoring-media, [data-security-reveal].is-visible .security-review-flow{ opacity:1; transform:none; transition:opacity .58s ease,transform .58s cubic-bezier(.2,.72,.2,1); } [data-security-reveal].is-visible .security-foundation-media, [data-security-reveal].is-visible .security-permissions-copy, [data-security-reveal].is-visible .security-monitoring-media{ transition-delay:.08s; } [data-security-reveal].is-visible .security-layer-card:nth-child(2){transition-delay:.05s} [data-security-reveal].is-visible .security-layer-card:nth-child(3){transition-delay:.10s} [data-security-reveal].is-visible .security-layer-card:nth-child(4){transition-delay:.15s} /* Global spacing */ .security-foundation-section, .security-layers-section, .security-permissions-section, .security-monitoring-section, .security-review-section, .security-faq-white{ padding-block:var(--global-section-space)!important; } @media(max-width:980px){ .security-foundation-layout, .security-permissions-layout, .security-monitoring-layout{ grid-template-columns:1fr; } .security-foundation-copy, .security-foundation-media, .security-monitoring-copy, .security-monitoring-media{ min-height:0; } .security-foundation-media, .security-monitoring-media{ min-height:470px; } .security-layers-grid, .security-review-flow{ grid-template-columns:1fr 1fr; } .security-review-flow{ gap:0; } .security-review-flow article:nth-child(3){ border-left:0; border-top:1px solid var(--line); } .security-review-flow article:nth-child(4){ border-top:1px solid var(--line); } .security-expansion-section, .security-expansion-track{ height:auto; } .security-expansion-sticky{ position:relative; height:auto; min-height:760px; padding:var(--global-section-space) 0; flex-direction:column; } .security-expansion-heading, .security-expansion-media, .security-expansion-copy{ position:relative; left:auto; top:auto; bottom:auto; transform:none!important; } .security-expansion-heading{ width:100%; padding-inline:var(--global-inline-space); } .security-expansion-heading h2 span{ transform:none!important; opacity:1!important; } .security-expansion-media{ width:min(calc(100% - 32px),760px)!important; margin-top:32px; } .security-expansion-copy{ width:100%; margin-top:30px; padding-inline:var(--global-inline-space); opacity:1!important; } } @media(max-width:680px){ .security-foundation-media, .security-monitoring-media{ min-height:350px; } .security-layers-grid, .security-review-flow{ grid-template-columns:1fr; } .security-review-flow article+article{ border-left:0; border-top:1px solid var(--line); } .security-review-flow article{ min-height:0; } .security-permission-row{ grid-template-columns:1.35fr repeat(3,.55fr); gap:6px; padding-inline:8px; } .security-permission-row span, .security-permission-row b{ font-size:10px; } } @media(prefers-reduced-motion:reduce){ .security-access-map i, .security-layer-card, .security-layer-icon, .security-expansion-heading h2 span, .security-expansion-media, .security-expansion-copy, .security-foundation-media img, .security-monitoring-media img, .security-review-step, [data-security-reveal] *{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.70 SECURITY REDESIGN + PRIVACY/TERMS RICH LEGAL PAGES ========================================================= */ /* Security control section: global white section instead of dark expansion */ .security-control-section{ background:#fff; padding-block:var(--global-section-space)!important; } .security-control-heading{ max-width:860px; } .security-control-heading>p{ max-width:690px; margin:14px auto 0; } .security-control-stage{ display:grid; grid-template-columns:1.08fr .92fr; gap:18px; align-items:stretch; } .security-control-media, .security-control-rail{ min-height:590px; } .security-control-media{ position:relative; overflow:hidden; border-radius:28px; background:#eef1f3; box-shadow:0 22px 50px rgba(17,24,39,.08); } .security-control-media img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s ease; } .security-control-media:hover img{ transform:scale(1.035); } .security-control-scan{ position:absolute; left:0; right:0; top:-16%; height:18%; background:linear-gradient(180deg,transparent,rgba(255,181,31,.30),transparent); mix-blend-mode:screen; animation:securityScan 5.4s ease-in-out infinite; pointer-events:none; } @keyframes securityScan{ 50%{top:98%} 100%{top:-16%} } .security-control-badge{ position:absolute; left:22px; bottom:22px; padding:16px 18px; border-radius:15px; background:rgba(255,255,255,.94); backdrop-filter:blur(10px); } .security-control-badge span, .security-control-badge strong{ display:block; } .security-control-badge span{ color:#9b6700; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-control-badge strong{ margin-top:5px; } .security-control-rail{ display:grid; grid-template-rows:repeat(4,1fr); gap:12px; } .security-control-item{ display:grid; grid-template-columns:52px 1fr; gap:16px; align-items:center; padding:22px; border:1px solid var(--line); border-radius:20px; background:#fffdf8; transition: transform .32s ease, background .32s ease, border-color .32s ease, box-shadow .32s ease; } .security-control-item:hover{ transform:translateX(7px); background:#fff7e7; border-color:rgba(255,181,31,.34); box-shadow:0 16px 34px rgba(17,24,39,.06); } .security-control-item>span{ width:46px; height:46px; display:grid; place-items:center; border-radius:14px; background:#252a33; color:#fff; font-size:11px; font-weight:900; } .security-control-item h3{ margin:0 0 6px; } .security-control-item p{ margin:0; color:var(--muted); } /* Security roles: equal-height three-card flow */ .security-role-flow-section{ background:#fffdf8; padding-block:var(--global-section-space)!important; } .security-role-heading{ max-width:850px; } .security-role-heading>p{ max-width:680px; margin:14px auto 0; } .security-role-flow{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; } .security-role-card{ min-height:500px; padding:28px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:0 16px 36px rgba(17,24,39,.045); transition: transform .34s ease, border-color .34s ease, box-shadow .34s ease; } .security-role-card:hover{ transform:translateY(-7px); border-color:rgba(255,181,31,.38); box-shadow:0 24px 48px rgba(17,24,39,.08); } .security-role-card-head{ padding-bottom:18px; border-bottom:1px solid var(--line); } .security-role-card-head span{ display:block; color:#9b6700; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-role-card-head strong{ display:block; margin-top:8px; font-family:var(--title-font); font-size:25px; line-height:1.12; } .security-role-card>p{ min-height:105px; margin:18px 0 0; color:var(--muted); } .security-role-bars{ margin-top:26px; display:grid; gap:9px; } .security-role-bars i{ display:block; width:var(--w); height:9px; border-radius:999px; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); transform-origin:left; transform:scaleX(.25); opacity:.45; transition:transform .5s ease,opacity .5s ease; } .security-role-card:hover .security-role-bars i{ transform:scaleX(1); opacity:1; } .security-role-card ul{ margin:28px 0 0; padding:0; list-style:none; display:grid; gap:12px; } .security-role-card li{ position:relative; padding-left:24px; color:#4f5864; } .security-role-card li::before{ content:""; position:absolute; left:0; top:8px; width:9px; height:9px; border-radius:50%; background:#ffb51f; box-shadow:0 0 0 5px rgba(255,181,31,.10); } .security-role-note{ margin-top:18px; padding:18px 22px; display:flex; align-items:center; gap:18px; border-radius:16px; background:#252a33; color:#fff; } .security-role-note span{ color:#ffd45a; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-role-note p{ margin:0; color:rgba(255,255,255,.74); } /* Hide obsolete old security expansion/permission rules if any remain */ .security-expansion-section, .security-expansion-track, .security-expansion-sticky, .security-permissions-board, .security-permissions-copy{ display:none!important; } /* Rich privacy/terms layout */ .legal-main-hero .hubstaff-hero-copy{ max-width:none; } .legal-main-hero h1{ max-width:1080px; } .legal-rich-section{ background:#fff; padding-block:var(--global-section-space)!important; } .legal-rich-layout{ display:grid; grid-template-columns:290px minmax(0,1fr); gap:58px; align-items:start; } .legal-rich-sidebar{ position:relative; } .legal-rich-sidebar-card{ position:sticky; top:112px; padding:20px; border:1px solid var(--line); border-radius:20px; background:#fffdf8; box-shadow:0 16px 36px rgba(17,24,39,.045); } .legal-rich-sidebar-card nav{ margin-top:18px; display:grid; } .legal-rich-sidebar-card nav a{ display:grid; grid-template-columns:30px 1fr; gap:9px; padding:10px 0; border-bottom:1px solid rgba(37,42,51,.07); color:#4f5966; font-size:12px; line-height:1.4; transition:color .25s ease,padding-left .25s ease; } .legal-rich-sidebar-card nav a:hover{ color:#252a33; padding-left:4px; } .legal-rich-sidebar-card nav a span{ color:#9b6700; font-size:10px; font-weight:900; } .legal-rich-updated{ margin-top:18px; padding:13px 14px; border-radius:13px; background:#252a33; color:#fff; } .legal-rich-updated strong, .legal-rich-updated span{ display:block; } .legal-rich-updated strong{ color:#ffd45a; font-size:10px; letter-spacing:.08em; text-transform:uppercase; } .legal-rich-updated span{ margin-top:5px; font-size:12px; } .legal-rich-content{ max-width:900px; } .legal-rich-intro{ padding:0 0 30px; border-bottom:1px solid var(--line); } .legal-rich-intro p{ margin:0; color:#4f5966; font-size:18px; line-height:1.82; } .legal-rich-block{ position:relative; padding:34px 0; border-bottom:1px solid var(--line); } .legal-rich-block::before{ content:""; position:absolute; left:0; bottom:-1px; width:0; height:2px; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); transition:width .45s ease; } .legal-rich-block:hover::before{ width:100%; } .legal-rich-block h2{ margin:0; font-size:clamp(27px,2.5vw,36px); line-height:1.16; letter-spacing:-.035em; } .legal-rich-block p{ max-width:860px; margin:14px 0 0; color:#626d7a; font-size:16px; line-height:1.88; } .legal-rich-block p+p{ margin-top:14px; } .legal-final-cta{ margin-top:0!important; } /* Reveal */ [data-legal-reveal] .legal-rich-sidebar-card, [data-legal-reveal] .legal-rich-intro, [data-legal-reveal] .legal-rich-block{ opacity:0; transform:translateY(18px); } [data-legal-reveal].is-visible .legal-rich-sidebar-card, [data-legal-reveal].is-visible .legal-rich-intro, [data-legal-reveal].is-visible .legal-rich-block{ opacity:1; transform:none; transition:opacity .55s ease,transform .55s cubic-bezier(.2,.72,.2,1); } [data-legal-reveal].is-visible .legal-rich-block:nth-child(3){transition-delay:.03s} [data-legal-reveal].is-visible .legal-rich-block:nth-child(4){transition-delay:.06s} @media(max-width:980px){ .security-control-stage{ grid-template-columns:1fr; } .security-control-media, .security-control-rail{ min-height:0; } .security-control-media{ min-height:480px; } .security-role-flow{ grid-template-columns:1fr; } .security-role-card{ min-height:0; } .security-role-card>p{ min-height:0; } .legal-rich-layout{ grid-template-columns:1fr; gap:32px; } .legal-rich-sidebar-card{ position:relative; top:auto; } .legal-rich-sidebar-card nav{ grid-template-columns:1fr 1fr; column-gap:20px; } } @media(max-width:680px){ .security-control-media{ min-height:350px; } .security-control-item{ grid-template-columns:44px 1fr; padding:18px; } .security-role-note{ align-items:flex-start; flex-direction:column; gap:8px; } .legal-rich-sidebar-card nav{ grid-template-columns:1fr; } .legal-rich-intro p{ font-size:16px; } .legal-rich-block{ padding:28px 0; } .legal-rich-block p{ font-size:15px; } } @media(prefers-reduced-motion:reduce){ .security-control-scan, .security-control-media img, .security-control-item, .security-role-card, .security-role-bars i, .legal-rich-sidebar-card nav a, .legal-rich-block::before, [data-legal-reveal] *{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.71 SECURITY ACCESS LOGIC + LEGAL INDEX + PARTNERS PAGE ========================================================= */ /* ---------- Security: logical access-scope meters ---------- */ .security-role-card>p{ min-height:116px!important; } .security-scope-meter{ margin-top:24px; padding:15px; border:1px solid var(--line); border-radius:15px; background:#fffdf8; } .security-scope-label{ display:block; color:#727c89; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .security-scope-track{ margin-top:12px; display:grid; grid-template-columns:repeat(3,1fr); gap:8px; } .security-scope-segment{ display:grid; gap:7px; text-align:center; } .security-scope-segment i{ display:block; height:12px; border-radius:999px; background:#eceff2; overflow:hidden; position:relative; } .security-scope-segment i::after{ content:""; position:absolute; inset:0; border-radius:inherit; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); transform:scaleX(0); transform-origin:left; } .security-role-flow-section.is-visible .security-scope-segment.is-active i::after{ animation:securityScopeFill .55s cubic-bezier(.2,.72,.2,1) forwards; } .security-scope-segment:nth-child(2) i::after{animation-delay:.08s!important} .security-scope-segment:nth-child(3) i::after{animation-delay:.16s!important} @keyframes securityScopeFill{ to{transform:scaleX(1)} } .security-scope-segment small{ color:#858e99; font-size:10px; font-weight:800; } .security-scope-segment.is-active small{ color:#252a33; } .security-role-card ul{ margin-top:24px!important; } /* Old arbitrary bars are removed from markup; neutralize any stale rules. */ .security-role-bars{ display:none!important; } /* ---------- Privacy / Terms: replace boxed sidebar with horizontal index ---------- */ .legal-rich-layout{ display:block!important; max-width:1020px; margin:0 auto; } .legal-rich-sidebar, .legal-rich-sidebar-card{ display:none!important; } .legal-section-index{ margin-bottom:42px; padding:22px 0 18px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); } .legal-section-index-top{ display:flex; justify-content:space-between; align-items:flex-end; gap:24px; } .legal-section-index-top p{ margin:7px 0 0; color:var(--muted); font-size:13px; } .legal-section-updated{ flex:0 0 auto; text-align:right; } .legal-section-updated span, .legal-section-updated strong{ display:block; } .legal-section-updated span{ color:#8b6570; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .legal-section-updated strong{ margin-top:5px; color:#252a33; font-size:12px; } .legal-section-index-links{ margin-top:18px; display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; scrollbar-width:thin; } .legal-section-index-links a{ flex:0 0 auto; display:inline-flex; align-items:center; gap:8px; min-height:38px; padding:0 12px; border:1px solid var(--line); border-radius:999px; background:#fff; color:#59636f; font-size:11px; white-space:nowrap; transition: background .25s ease, color .25s ease, border-color .25s ease, transform .25s ease; } .legal-section-index-links a span{ color:#a16a00; font-size:9px; font-weight:900; } .legal-section-index-links a:hover, .legal-section-index-links a.is-active{ transform:translateY(-2px); border-color:rgba(255,181,31,.38); background:#fff7e7; color:#252a33; } .legal-rich-content{ max-width:900px!important; margin:0 auto; } /* ---------- Partners hero ---------- */ .partners-main-hero .hubstaff-hero-copy{ max-width:none; } .partners-main-hero h1{ max-width:1080px; } /* ---------- Partner form ---------- */ .partner-form-section{ background:#fff; } .partner-form-layout{ display:grid; grid-template-columns:.86fr 1.14fr; gap:54px; align-items:stretch; } .partner-form-copy, .partner-form-card{ min-height:680px; } .partner-form-copy{ display:flex; flex-direction:column; justify-content:center; } .partner-form-copy>p{ margin:16px 0 0; color:var(--muted); } .partner-form-copy-points{ margin-top:26px; border-top:1px solid var(--line); } .partner-form-copy-points article{ display:grid; grid-template-columns:42px 1fr; gap:14px; padding:17px 0; border-bottom:1px solid var(--line); } .partner-form-copy-points article>span{ width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:#fff1bd; color:#9b6700; font-size:10px; font-weight:900; } .partner-form-copy-points strong{ display:block; } .partner-form-copy-points p{ margin:5px 0 0; color:var(--muted); font-size:12px; } .partner-form-card{ padding:32px; display:flex; align-items:center; border:1px solid var(--line); border-radius:26px; background:#fffdf8; box-shadow:0 18px 46px rgba(17,24,39,.055); } .partner-form-card form{ width:100%; } .partner-field-grid{ display:grid; grid-template-columns:1fr 1fr; gap:14px; } .partner-form-card label{ display:flex; flex-direction:column; gap:7px; } .partner-form-card label>span{ color:#4f5864; font-size:12px; font-weight:800; } .partner-form-card input, .partner-form-card select, .partner-form-card textarea{ width:100%; border:1px solid var(--line); border-radius:12px; background:#fff; color:var(--ink); font:inherit; outline:none; transition:border-color .25s ease,box-shadow .25s ease; } .partner-form-card input, .partner-form-card select{ min-height:48px; padding:0 13px; } .partner-form-card textarea{ padding:13px; resize:vertical; } .partner-form-card input:focus, .partner-form-card select:focus, .partner-form-card textarea:focus{ border-color:#ffb51f; box-shadow:0 0 0 4px rgba(255,181,31,.12); } .partner-message-field{ margin-top:14px; } .partner-form-card .btn{ margin-top:18px; } .partner-form-note{ display:block; margin-top:12px; color:var(--muted); line-height:1.5; } .partner-form-honeypot{ position:absolute!important; left:-9999px!important; width:1px!important; height:1px!important; opacity:0!important; } /* ---------- Partner paths: asymmetric three-column ---------- */ .partner-paths-section{ background:#fffdf8; } .partner-paths-heading{ max-width:850px; } .partner-paths-heading>p{ max-width:690px; margin:14px auto 0; } .partner-paths-layout{ display:grid; grid-template-columns:.9fr 1.2fr .9fr; gap:16px; align-items:stretch; } .partner-path{ min-height:410px; padding:28px; display:flex; flex-direction:column; border:1px solid var(--line); border-radius:22px; background:#fff; transition: transform .32s ease, border-color .32s ease, box-shadow .32s ease; } .partner-path-service{ transform:translateY(-18px); background:#252a33; color:#fff; border-color:#252a33; } .partner-path:hover{ transform:translateY(-7px); border-color:rgba(255,181,31,.38); box-shadow:0 22px 46px rgba(17,24,39,.08); } .partner-path-service:hover{ transform:translateY(-25px); } .partner-path-number{ color:#a16a00; font-size:10px; font-weight:900; } .partner-path-service .partner-path-number{ color:#ffd45a; } .partner-path h3{ margin:58px 0 12px; } .partner-path-service h3{ color:#fff; } .partner-path>p{ margin:0; color:var(--muted); } .partner-path-service>p{ color:rgba(255,255,255,.70); } .partner-path-bottom{ margin-top:auto; padding-top:24px; border-top:1px solid var(--line); } .partner-path-service .partner-path-bottom{ border-top-color:rgba(255,255,255,.10); } .partner-path-bottom span, .partner-path-bottom strong{ display:block; } .partner-path-bottom span{ color:#9b6700; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-path-service .partner-path-bottom span{ color:#ffd45a; } .partner-path-bottom strong{ margin-top:7px; line-height:1.45; } /* ---------- Drive: inversion-circle scroll animation adapted for Worklix ---------- */ .partner-inversion-section{ background:#fff; } .partner-inversion-track{ position:relative; height:210vh; } .partner-inversion-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; background:#fff; } .partner-inversion-ball{ position:absolute; left:50%; top:50%; width:380px; height:380px; border-radius:50%; background:#252a33; transform:translate(-50%,calc(-50% + 72vh)); z-index:1; will-change:width,height,transform; } .partner-inversion-layer{ position:absolute; inset:0; z-index:2; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding-inline:var(--global-inline-space); pointer-events:none; } .partner-inversion-layer>span{ color:#9b6700; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-inversion-layer h2{ max-width:920px; margin:14px 0 0; } .partner-inversion-layer p{ max-width:650px; margin:16px 0 0; color:var(--muted); } .partner-inversion-light{ color:#fff; clip-path:circle(190px at 50% 122%); will-change:clip-path; } .partner-inversion-light>span{ color:#ffd45a; } .partner-inversion-light h2{ color:#fff; } .partner-inversion-light p{ color:rgba(255,255,255,.72); } .partner-inversion-after{ background:#252a33; color:#fff; } .partner-inversion-after-inner{ max-width:850px; text-align:center; } .partner-inversion-after h2{ margin-top:14px; color:#fff; } .partner-inversion-after p{ max-width:670px; margin:16px auto 0; color:rgba(255,255,255,.70); } /* ---------- Partner value split ---------- */ .partner-value-section{ background:#fff; } .partner-value-layout{ display:grid; grid-template-columns:1.04fr .96fr; gap:56px; align-items:stretch; } .partner-value-media, .partner-value-copy{ min-height:600px; } .partner-value-media{ overflow:hidden; border-radius:28px; box-shadow:0 24px 52px rgba(17,24,39,.08); } .partner-value-media img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s ease; } .partner-value-media:hover img{ transform:scale(1.035); } .partner-value-copy{ display:flex; flex-direction:column; justify-content:center; } .partner-value-copy>p{ margin:16px 0 0; color:var(--muted); } .partner-value-stack{ margin-top:26px; display:grid; gap:11px; } .partner-value-stack article{ display:grid; grid-template-columns:42px 1fr; gap:14px; padding:16px; border:1px solid var(--line); border-radius:16px; background:#fffdf8; transition:transform .3s ease,border-color .3s ease; } .partner-value-stack article:hover{ transform:translateX(5px); border-color:rgba(255,181,31,.36); } .partner-value-stack article>span{ width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:#252a33; color:#fff; font-size:10px; font-weight:900; } .partner-value-stack h3{ margin:0 0 5px; } .partner-value-stack p{ margin:0; color:var(--muted); } /* ---------- Partner enablement: image + editorial rows ---------- */ .partner-enablement-section{ background:#fffdf8; } .partner-enablement-heading{ max-width:860px; } .partner-enablement-heading>p{ max-width:710px; margin:14px auto 0; } .partner-enablement-board{ display:grid; grid-template-columns:.82fr 1.18fr; gap:18px; align-items:stretch; } .partner-enablement-image{ min-height:540px; overflow:hidden; border-radius:24px; } .partner-enablement-image img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s ease; } .partner-enablement-image:hover img{ transform:scale(1.035); } .partner-enablement-steps{ display:grid; grid-template-rows:repeat(3,1fr); gap:12px; } .partner-enablement-steps article{ padding:24px; border:1px solid var(--line); border-radius:20px; background:#fff; transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease; } .partner-enablement-steps article:hover{ transform:translateX(6px); border-color:rgba(255,181,31,.36); box-shadow:0 16px 34px rgba(17,24,39,.06); } .partner-enablement-steps span{ color:#a16a00; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-enablement-steps h3{ margin:10px 0 7px; } .partner-enablement-steps p{ margin:0; color:var(--muted); } /* ---------- Partner opportunity: copy + two-image offset gallery ---------- */ .partner-opportunity-section{ background:#fff; } .partner-opportunity-layout{ display:grid; grid-template-columns:.9fr 1.1fr; gap:58px; align-items:center; } .partner-opportunity-copy>p{ margin:16px 0 0; color:var(--muted); } .partner-opportunity-copy .btn{ margin-top:24px; } .partner-opportunity-gallery{ position:relative; min-height:560px; } .partner-opportunity-gallery figure{ position:absolute; margin:0; overflow:hidden; border-radius:24px; box-shadow:0 22px 48px rgba(17,24,39,.09); } .partner-opportunity-main{ left:0; top:0; width:72%; height:72%; } .partner-opportunity-secondary{ right:0; bottom:0; width:52%; height:52%; border:10px solid #fff; } .partner-opportunity-gallery img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .6s ease; } .partner-opportunity-gallery figure:hover img{ transform:scale(1.04); } /* ---------- Partner FAQ ---------- */ section.worklix-faq-section.partner-faq-white{ background:#fff!important; color:#252a33!important; } .partner-faq-white .faq-heading h2, .partner-faq-white .faq-list summary{ color:#252a33!important; } .partner-faq-white .faq-heading p, .partner-faq-white .faq-list details p{ color:#657080!important; opacity:1!important; } .partner-faq-white .faq-list details{ background:#fff!important; border-color:#e1e4e9!important; } .partner-faq-white .faq-list details[open]{ background:#fffaf0!important; border-color:rgba(255,181,31,.42)!important; } /* ---------- Partner reveals ---------- */ [data-partner-reveal] .partner-form-copy, [data-partner-reveal] .partner-form-card, [data-partner-reveal] .partner-path, [data-partner-reveal] .partner-value-media, [data-partner-reveal] .partner-value-copy, [data-partner-reveal] .partner-enablement-image, [data-partner-reveal] .partner-enablement-steps, [data-partner-reveal] .partner-opportunity-copy, [data-partner-reveal] .partner-opportunity-gallery{ opacity:0; transform:translateY(20px); } [data-partner-reveal].is-visible .partner-form-copy, [data-partner-reveal].is-visible .partner-form-card, [data-partner-reveal].is-visible .partner-path, [data-partner-reveal].is-visible .partner-value-media, [data-partner-reveal].is-visible .partner-value-copy, [data-partner-reveal].is-visible .partner-enablement-image, [data-partner-reveal].is-visible .partner-enablement-steps, [data-partner-reveal].is-visible .partner-opportunity-copy, [data-partner-reveal].is-visible .partner-opportunity-gallery{ opacity:1; transform:none; transition:opacity .58s ease,transform .58s cubic-bezier(.2,.72,.2,1); } [data-partner-reveal].is-visible .partner-form-card, [data-partner-reveal].is-visible .partner-value-copy, [data-partner-reveal].is-visible .partner-enablement-steps, [data-partner-reveal].is-visible .partner-opportunity-gallery{ transition-delay:.08s; } /* Global spacing for normal Partner sections */ .partner-form-section, .partner-paths-section, .partner-value-section, .partner-enablement-section, .partner-opportunity-section, .partner-faq-white{ padding-block:var(--global-section-space)!important; } @media(max-width:980px){ .legal-section-index-top{ align-items:flex-start; } .partner-form-layout, .partner-value-layout, .partner-enablement-board, .partner-opportunity-layout{ grid-template-columns:1fr; } .partner-form-copy, .partner-form-card, .partner-value-media, .partner-value-copy{ min-height:0; } .partner-value-media, .partner-enablement-image{ min-height:470px; } .partner-paths-layout{ grid-template-columns:1fr; } .partner-path-service, .partner-path-service:hover{ transform:none; } .partner-inversion-track{ height:auto; } .partner-inversion-sticky{ position:relative; height:auto; min-height:620px; background:#252a33; } .partner-inversion-ball{ display:none; } .partner-inversion-dark{ display:none; } .partner-inversion-light{ clip-path:none!important; } .partner-opportunity-gallery{ min-height:500px; } } @media(max-width:680px){ .legal-section-index-top{ flex-direction:column; align-items:flex-start; } .legal-section-updated{ text-align:left; } .partner-field-grid{ grid-template-columns:1fr; } .partner-form-card{ padding:22px; } .partner-path{ min-height:0; } .partner-value-media, .partner-enablement-image{ min-height:350px; } .partner-opportunity-gallery{ min-height:400px; } .partner-opportunity-main{ width:78%; height:68%; } .partner-opportunity-secondary{ width:58%; height:48%; } } @media(prefers-reduced-motion:reduce){ .security-scope-segment i::after, .partner-path, .partner-value-media img, .partner-value-stack article, .partner-enablement-image img, .partner-enablement-steps article, .partner-opportunity-gallery img, .partner-inversion-ball, [data-partner-reveal] *{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } .security-scope-segment.is-active i::after{ transform:scaleX(1)!important; } .partner-inversion-light{ clip-path:none!important; } } /* ========================================================= V1.72 PARTNERS — GLOBAL INVERSION + UNIQUE FIT/ENABLEMENT ========================================================= */ .partner-inversion-layer{ padding-inline:var(--global-inline-space); } .partner-inversion-heading{ max-width:860px!important; margin:0 auto!important; } .partner-inversion-heading .eyebrow{ margin-inline:auto; } .partner-inversion-heading h2{ font-size:clamp(36px,4.1vw,58px)!important; line-height:1.05!important; letter-spacing:-.045em!important; margin:14px 0 0!important; } .partner-inversion-heading p{ max-width:690px!important; margin:16px auto 0!important; font-size:17px!important; line-height:1.62!important; } .partner-inversion-light .partner-inversion-heading p{ color:rgba(255,255,255,.72)!important; } .partner-inversion-light .partner-inversion-heading h2{ color:#fff!important; } /* Replaces the unclear "Add Worklix..." statement with a clear partner-fit matrix */ .partner-fit-section{ padding-block:var(--global-section-space)!important; background:#252a33; color:#fff; } .partner-fit-layout{ display:grid; grid-template-columns:.78fr 1.22fr; gap:64px; align-items:start; } .partner-fit-intro{ position:sticky; top:120px; } .partner-fit-intro h2{ color:#fff; margin-top:14px; } .partner-fit-intro p{ margin:16px 0 0; color:rgba(255,255,255,.68); } .partner-fit-matrix{ border-top:1px solid rgba(255,255,255,.12); } .partner-fit-matrix article{ display:grid; grid-template-columns:110px .9fr 1.15fr; gap:22px; align-items:start; padding:25px 0; border-bottom:1px solid rgba(255,255,255,.12); transition:padding-left .32s ease,background .32s ease; } .partner-fit-matrix article:hover{ padding-left:12px; background:linear-gradient(90deg,rgba(255,181,31,.08),transparent 78%); } .partner-fit-matrix article>span{ color:#ffd45a; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-fit-matrix h3{ margin:0; color:#fff; } .partner-fit-matrix p{ margin:0; color:rgba(255,255,255,.64); } /* Enablement redesigned so it no longer repeats the prior split-image layout */ .partner-enablement-process-section{ background:#fffdf8; padding-block:var(--global-section-space)!important; } .partner-enablement-process-head{ display:grid; grid-template-columns:1fr .82fr; gap:56px; align-items:end; margin-bottom:40px; } .partner-enablement-process-copy h2{ margin-top:14px; } .partner-enablement-process-head>p{ margin:0; color:var(--muted); font-size:17px; line-height:1.62; } .partner-enablement-process{ display:grid; grid-template-columns:repeat(3,1fr); gap:16px; } .partner-process-card{ position:relative; min-height:430px; padding:28px; display:flex; flex-direction:column; overflow:hidden; border:1px solid var(--line); border-radius:22px; background:#fff; transition:transform .34s cubic-bezier(.2,.72,.2,1),border-color .34s ease,box-shadow .34s ease; } .partner-process-card::before{ content:""; position:absolute; left:0; top:0; width:100%; height:4px; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); transform:scaleX(.18); transform-origin:left; transition:transform .4s cubic-bezier(.2,.72,.2,1); } .partner-process-card::after{ content:""; position:absolute; right:-58px; top:-58px; width:150px; height:150px; border-radius:50%; border:1px solid rgba(255,181,31,.16); transform:scale(.72); opacity:.35; transition:transform .4s ease,opacity .4s ease; } .partner-process-card:hover{ transform:translateY(-8px); border-color:rgba(255,181,31,.36); box-shadow:0 24px 48px rgba(17,24,39,.08); } .partner-process-card:hover::before{ transform:scaleX(1); } .partner-process-card:hover::after{ transform:scale(1); opacity:1; } .partner-process-top{ display:flex; align-items:center; justify-content:space-between; gap:14px; } .partner-process-number{ width:48px; height:48px; display:grid; place-items:center; border-radius:15px; background:#252a33; color:#fff; font-size:10px; font-weight:900; transition:background .3s ease,color .3s ease,transform .3s ease; } .partner-process-card:hover .partner-process-number{ background:#ffb51f; color:#252a33; transform:rotate(-6deg); } .partner-process-label{ color:#a16a00; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-process-card h3{ margin:52px 0 12px; } .partner-process-card>p{ margin:0; color:var(--muted); } .partner-process-meta{ margin-top:auto; padding-top:22px; border-top:1px solid var(--line); } .partner-process-meta span, .partner-process-meta strong{ display:block; } .partner-process-meta span{ color:#8b6570; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-process-meta strong{ margin-top:7px; line-height:1.4; } /* Opportunity columns balanced through content */ .partner-opportunity-layout{ align-items:stretch!important; } .partner-opportunity-copy, .partner-opportunity-gallery{ min-height:560px; } .partner-opportunity-copy{ display:flex; flex-direction:column; justify-content:center; } .partner-opportunity-copy>p{ max-width:560px; margin:18px 0 0; line-height:1.72; } .partner-opportunity-copy .btn{ align-self:flex-start; } .partner-opportunity-gallery{ height:560px; } /* Smooth block interactions across the page */ .partner-path, .partner-value-stack article, .partner-process-card, .partner-opportunity-gallery figure{ will-change:transform; } @media(max-width:980px){ .partner-fit-layout, .partner-enablement-process-head{ grid-template-columns:1fr; } .partner-fit-intro{ position:static; } .partner-enablement-process{ grid-template-columns:1fr; } .partner-process-card{ min-height:0; } .partner-opportunity-copy, .partner-opportunity-gallery{ min-height:0; } .partner-opportunity-gallery{ height:500px; } } @media(max-width:680px){ .partner-fit-matrix article{ grid-template-columns:1fr; gap:9px; } .partner-fit-matrix article:hover{ padding-left:0; } .partner-inversion-heading p{ font-size:16px!important; } .partner-opportunity-gallery{ height:400px; } } @media(prefers-reduced-motion:reduce){ .partner-fit-matrix article, .partner-process-card, .partner-process-card::before, .partner-process-card::after, .partner-process-number{ animation:none!important; transition:none!important; transform:none!important; } } /* ========================================================= V1.73 PARTNER JOURNEY + INTEGRATIONS MAIN PAGE ========================================================= */ /* Partners: new customer-journey design */ .partner-journey-section{ background:#252a33; color:#fff; padding-block:var(--global-section-space)!important; } .partner-journey-layout{ display:grid; grid-template-columns:.82fr 1.18fr; gap:64px; align-items:center; } .partner-journey-copy h2{ margin-top:14px; color:#fff; } .partner-journey-copy>p{ max-width:500px; margin:16px 0 0; color:rgba(255,255,255,.68); } .partner-journey-copy .btn{ margin-top:24px; } .partner-journey-map{ position:relative; display:grid; gap:14px; padding-left:64px; } .partner-journey-track{ position:absolute; left:19px; top:30px; bottom:30px; width:2px; background:rgba(255,255,255,.10); overflow:hidden; } .partner-journey-track span{ display:block; width:100%; height:100%; background:linear-gradient(180deg,#ffbd20,#ff914d,#ff6f59); transform:scaleY(.18); transform-origin:top; transition:transform .7s cubic-bezier(.2,.72,.2,1); } .partner-journey-section.is-visible .partner-journey-track span{ transform:scaleY(1); } .partner-journey-step{ position:relative; min-height:160px; padding:22px; border:1px solid rgba(255,255,255,.10); border-radius:18px; background:rgba(255,255,255,.045); transition:transform .32s ease,background .32s ease,border-color .32s ease; } .partner-journey-step:hover{ transform:translateX(8px); background:rgba(255,181,31,.08); border-color:rgba(255,181,31,.28); } .partner-journey-index{ position:absolute; left:-64px; top:22px; width:38px; height:38px; display:grid; place-items:center; border-radius:50%; background:#ffb51f; color:#252a33; font-size:10px; font-weight:900; box-shadow:0 0 0 7px rgba(255,181,31,.08); transition:transform .3s ease; } .partner-journey-step:hover .partner-journey-index{ transform:scale(1.08); } .partner-journey-step small{ color:#ffd45a; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .partner-journey-step h3{ margin:8px 0 7px; color:#fff; } .partner-journey-step p{ margin:0; color:rgba(255,255,255,.66); } /* Partners: stronger hover animation for "Choose the relationship..." */ .partner-path{ position:relative; overflow:hidden; } .partner-path::before{ content:""; position:absolute; inset:0; background:linear-gradient(120deg,transparent 15%,rgba(255,181,31,.10) 48%,transparent 82%); transform:translateX(-120%); transition:transform .65s cubic-bezier(.2,.72,.2,1); pointer-events:none; } .partner-path::after{ content:""; position:absolute; right:24px; top:24px; width:10px; height:10px; border-radius:50%; background:#ffb51f; box-shadow:0 0 0 0 rgba(255,181,31,.18); transition:box-shadow .35s ease,transform .35s ease; } .partner-path:hover::before{ transform:translateX(120%); } .partner-path:hover::after{ transform:scale(1.15); box-shadow:0 0 0 9px rgba(255,181,31,.10); } .partner-path:hover .partner-path-number{ transform:translateY(-3px); } .partner-path-number{ display:inline-block; transition:transform .3s ease; } .partner-path-bottom{ position:relative; z-index:1; } /* Integrations hero */ .integrations-main-hero .hubstaff-hero-copy{ max-width:none; } .integrations-main-hero h1{ max-width:1100px; } /* Integrations: use cases */ .integrations-usecases-section{ background:#fff; } .integrations-usecases-heading{ max-width:860px; } .integrations-usecases-heading>p{ max-width:710px; margin:14px auto 0; } .integrations-usecases-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; } .integration-usecase-card{ min-height:350px; padding:26px; border:1px solid var(--line); border-radius:20px; background:#fffdf8; transition:transform .34s ease,border-color .34s ease,box-shadow .34s ease; } .integration-usecase-card:hover{ transform:translateY(-7px); border-color:rgba(255,181,31,.38); box-shadow:0 22px 44px rgba(17,24,39,.08); } .integration-usecase-icon{ width:54px; height:54px; display:grid; place-items:center; border-radius:15px; background:#252a33; color:#fff; transition:background .3s ease,color .3s ease,transform .3s ease; } .integration-usecase-card:hover .integration-usecase-icon{ background:#ffb51f; color:#252a33; transform:translateY(-3px); } .integration-usecase-icon svg{ width:25px; height:25px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } .integration-usecase-card small{ display:block; margin-top:40px; color:#a16a00; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integration-usecase-card h3{ margin:10px 0 9px; } .integration-usecase-card p{ margin:0; color:var(--muted); } /* Drive Scroll Expansion Media */ .integrations-expansion-section{ position:relative; height:205vh; background:#090a0d; overflow:clip; } .integrations-expansion-track{ height:205vh; } .integrations-expansion-sticky{ position:sticky; top:0; height:100vh; overflow:hidden; display:flex; align-items:center; justify-content:center; } .integrations-expansion-heading{ position:absolute; top:13%; left:50%; transform:translateX(-50%); z-index:3; color:#fff; } .integrations-expansion-heading h2{ color:#fff; margin-top:14px; } .integrations-expansion-heading h2 span{ display:block; will-change:transform,opacity; } .integrations-expansion-media{ position:absolute; left:50%; top:52%; width:min(500px,38vw); aspect-ratio:16/10; transform:translate(-50%,-50%) scale(.80); overflow:hidden; border-radius:24px; box-shadow:0 30px 80px rgba(0,0,0,.38); will-change:width,transform,border-radius; } .integrations-expansion-media>img{ width:100%; height:100%; display:block; object-fit:cover; } .integrations-data-chip{ position:absolute; padding:10px 12px; border-radius:12px; background:rgba(255,255,255,.94); color:#252a33; font-size:11px; font-weight:900; box-shadow:0 12px 28px rgba(0,0,0,.18); } .integrations-data-chip-a{left:5%;top:9%} .integrations-data-chip-b{right:5%;top:20%} .integrations-data-chip-c{right:8%;bottom:9%} .integrations-expansion-copy{ position:absolute; left:50%; bottom:7%; max-width:760px; transform:translate(-50%,24px); text-align:center; opacity:0; color:#fff; will-change:opacity,transform; } .integrations-expansion-copy>span{ color:#ffd45a; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-expansion-copy h3{ margin:9px 0 0; color:#fff; } .integrations-expansion-copy p{ max-width:690px; margin:12px auto 0; color:rgba(255,255,255,.70); } /* Integration paths */ .integrations-paths-section{ background:#fffdf8; } .integrations-paths-layout{ display:grid; grid-template-columns:.78fr 1.22fr; gap:64px; align-items:start; } .integrations-paths-copy{ position:sticky; top:120px; } .integrations-paths-copy h2{ margin-top:14px; } .integrations-paths-copy>p{ margin:16px 0 0; color:var(--muted); } .integrations-paths-board{ border-top:1px solid var(--line); } .integrations-paths-board article{ display:grid; grid-template-columns:54px .8fr 1.2fr; gap:18px; padding:26px 0; border-bottom:1px solid var(--line); transition:padding-left .3s ease,background .3s ease; } .integrations-paths-board article:hover{ padding-left:10px; background:linear-gradient(90deg,rgba(255,181,31,.07),transparent 75%); } .integrations-paths-board article>span{ width:40px; height:40px; display:grid; place-items:center; border-radius:50%; background:#252a33; color:#fff; font-size:10px; font-weight:900; } .integrations-paths-board h3{ margin:7px 0 0; } .integrations-paths-board p{ margin:5px 0 0; color:var(--muted); } /* Operations split */ .integrations-operations-section{ background:#fff; } .integrations-operations-layout{ display:grid; grid-template-columns:1.02fr .98fr; gap:56px; align-items:stretch; } .integrations-operations-media, .integrations-operations-copy{ min-height:590px; } .integrations-operations-media{ overflow:hidden; border-radius:28px; box-shadow:0 24px 52px rgba(17,24,39,.08); } .integrations-operations-media img{ width:100%; height:100%; display:block; object-fit:cover; transition:transform .65s ease; } .integrations-operations-media:hover img{ transform:scale(1.035); } .integrations-operations-copy{ display:flex; flex-direction:column; justify-content:center; } .integrations-operations-copy>p{ margin:16px 0 0; color:var(--muted); } .integrations-operations-list{ margin-top:24px; display:grid; gap:10px; } .integrations-operations-list article{ display:grid; grid-template-columns:42px 1fr; gap:14px; padding:15px; border:1px solid var(--line); border-radius:15px; background:#fffdf8; transition:transform .28s ease,border-color .28s ease; } .integrations-operations-list article:hover{ transform:translateX(5px); border-color:rgba(255,181,31,.34); } .integrations-operations-list article>span{ width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:#fff0b6; color:#9a6600; font-size:10px; font-weight:900; } .integrations-operations-list h3{ margin:0 0 5px; } .integrations-operations-list p{ margin:0; color:var(--muted); } /* Category rows */ .integrations-categories-section{ background:#fffdf8; } .integrations-categories-heading{ max-width:860px; } .integrations-categories-heading>p{ max-width:730px; margin:14px auto 0; } .integrations-category-list{ display:grid; grid-template-columns:1fr 1fr; gap:12px; } .integrations-category-list article{ display:grid; grid-template-columns:.8fr 1.2fr 38px; gap:18px; align-items:center; min-height:96px; padding:18px 20px; border:1px solid var(--line); border-radius:17px; background:#fff; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease; } .integrations-category-list article:hover{ transform:translateY(-4px); border-color:rgba(255,181,31,.36); box-shadow:0 16px 32px rgba(17,24,39,.055); } .integrations-category-list article>span{ font-weight:900; color:#252a33; } .integrations-category-list article>p{ margin:0; color:var(--muted); } .integrations-category-list article>b{ width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:#ffb51f; color:#252a33; transition:transform .28s ease; } .integrations-category-list article:hover>b{ transform:translateX(3px); } /* Developer section */ .integrations-developer-section{ background:#fff; } .integrations-developer-shell{ display:grid; grid-template-columns:.9fr 1.1fr; gap:58px; align-items:center; } .integrations-developer-copy>p{ margin:16px 0 0; color:var(--muted); } .integrations-developer-copy .btn{ margin-top:24px; } .integrations-developer-visual{ position:relative; min-height:520px; overflow:hidden; border-radius:28px; box-shadow:0 22px 48px rgba(17,24,39,.08); } .integrations-developer-visual>img{ width:100%; height:100%; display:block; object-fit:cover; } .integrations-code-panel{ position:absolute; left:24px; right:24px; bottom:24px; padding:18px; border-radius:16px; background:rgba(20,24,30,.90); color:#fff; backdrop-filter:blur(10px); } .integrations-code-panel span{ display:block; color:#ffd45a; font-size:10px; font-weight:900; } .integrations-code-panel code{ display:block; margin-top:8px; color:rgba(255,255,255,.78); font-size:12px; } .integrations-code-panel i{ display:block; width:0; height:2px; margin-top:10px; background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59); transition:width .6s ease; } .integrations-developer-visual:hover .integrations-code-panel i{ width:100%; } /* FAQ */ section.worklix-faq-section.integrations-faq-white{ background:#fff!important; color:#252a33!important; } .integrations-faq-white .faq-heading h2, .integrations-faq-white .faq-list summary{ color:#252a33!important; } .integrations-faq-white .faq-heading p, .integrations-faq-white .faq-list details p{ color:#657080!important; opacity:1!important; } .integrations-faq-white .faq-list details{ background:#fff!important; border-color:#e1e4e9!important; } .integrations-faq-white .faq-list details[open]{ background:#fffaf0!important; border-color:rgba(255,181,31,.42)!important; } /* Reveal */ [data-integrations-reveal] .integration-usecase-card, [data-integrations-reveal] .integrations-paths-copy, [data-integrations-reveal] .integrations-paths-board, [data-integrations-reveal] .integrations-operations-media, [data-integrations-reveal] .integrations-operations-copy, [data-integrations-reveal] .integrations-category-list, [data-integrations-reveal] .integrations-developer-copy, [data-integrations-reveal] .integrations-developer-visual{ opacity:0; transform:translateY(20px); } [data-integrations-reveal].is-visible .integration-usecase-card, [data-integrations-reveal].is-visible .integrations-paths-copy, [data-integrations-reveal].is-visible .integrations-paths-board, [data-integrations-reveal].is-visible .integrations-operations-media, [data-integrations-reveal].is-visible .integrations-operations-copy, [data-integrations-reveal].is-visible .integrations-category-list, [data-integrations-reveal].is-visible .integrations-developer-copy, [data-integrations-reveal].is-visible .integrations-developer-visual{ opacity:1; transform:none; transition:opacity .58s ease,transform .58s cubic-bezier(.2,.72,.2,1); } [data-integrations-reveal].is-visible .integration-usecase-card:nth-child(2){transition-delay:.05s} [data-integrations-reveal].is-visible .integration-usecase-card:nth-child(3){transition-delay:.10s} [data-integrations-reveal].is-visible .integration-usecase-card:nth-child(4){transition-delay:.15s} /* Global spacing */ .integrations-usecases-section, .integrations-paths-section, .integrations-operations-section, .integrations-categories-section, .integrations-developer-section, .integrations-faq-white{ padding-block:var(--global-section-space)!important; } @media(max-width:980px){ .partner-journey-layout, .integrations-paths-layout, .integrations-operations-layout, .integrations-developer-shell{ grid-template-columns:1fr; } .partner-journey-map{ padding-left:56px; } .integrations-usecases-grid{ grid-template-columns:1fr 1fr; } .integrations-paths-copy{ position:static; } .integrations-operations-media, .integrations-operations-copy{ min-height:0; } .integrations-operations-media{ min-height:470px; } .integrations-expansion-section, .integrations-expansion-track{ height:auto; } .integrations-expansion-sticky{ position:relative; height:auto; min-height:760px; padding:var(--global-section-space) 0; flex-direction:column; } .integrations-expansion-heading, .integrations-expansion-media, .integrations-expansion-copy{ position:relative; left:auto; top:auto; bottom:auto; transform:none!important; } .integrations-expansion-heading{ width:100%; } .integrations-expansion-heading h2 span{ transform:none!important; opacity:1!important; } .integrations-expansion-media{ width:min(calc(100% - 32px),760px)!important; margin-top:32px; } .integrations-expansion-copy{ width:100%; margin-top:30px; padding-inline:var(--global-inline-space); opacity:1!important; } } @media(max-width:680px){ .partner-journey-map{ padding-left:48px; } .partner-journey-index{ left:-48px; } .integrations-usecases-grid, .integrations-category-list{ grid-template-columns:1fr; } .integrations-paths-board article{ grid-template-columns:44px 1fr; } .integrations-paths-board p{ grid-column:2; } .integrations-operations-media{ min-height:350px; } .integrations-category-list article{ grid-template-columns:1fr 34px; } .integrations-category-list article>p{ grid-column:1 / 3; } .integrations-developer-visual{ min-height:380px; } } @media(prefers-reduced-motion:reduce){ .partner-journey-track span, .partner-path::before, .partner-path::after, .partner-path-number, .integration-usecase-card, .integration-usecase-icon, .integrations-expansion-heading h2 span, .integrations-expansion-media, .integrations-expansion-copy, .integrations-operations-media img, .integrations-code-panel i, [data-integrations-reveal] *{ animation:none!important; transition:none!important; transform:none!important; opacity:1!important; } } /* ========================================================= V1.74 PARTNER HEIGHT/SPACING + UNIQUE INTEGRATION SECTIONS ========================================================= */ /* Partner journey: equal-height columns through real content */ .partner-journey-layout{ align-items:stretch!important; } .partner-journey-copy, .partner-journey-map{ min-height:560px; } .partner-journey-copy{ display:flex; flex-direction:column; justify-content:center; } .partner-journey-copy>p{ max-width:540px!important; line-height:1.72; } .partner-journey-map{ align-content:center; } /* Partner page spacing audit — standard sections use the global vertical rhythm */ .partner-form-section, .partner-paths-section, .partner-journey-section, .partner-value-section, .partner-enablement-process-section, .partner-opportunity-section, .partner-faq-white{ padding-block:var(--global-section-space)!important; } /* Integrations spacing audit */ .integrations-usecases-section, .integrations-signal-section, .integrations-paths-section, .integrations-operations-section, .integrations-categories-section, .integrations-developer-section, .integrations-faq-white{ padding-block:var(--global-section-space)!important; } /* --------------------------------------------------------- Connect the signal. Keep the context. Unique data-stream canvas — no repeated image split / bento. --------------------------------------------------------- */ .integrations-signal-section{ background:#252a33; color:#fff; } .integrations-signal-head{ display:grid; grid-template-columns:1fr .9fr; gap:56px; align-items:end; margin-bottom:42px; } .integrations-signal-title h2{ margin-top:14px; color:#fff; } .integrations-signal-head>p{ margin:0; color:rgba(255,255,255,.68); font-size:17px; line-height:1.65; } .integrations-signal-canvas{ position:relative; display:grid; grid-template-columns:.82fr 140px 1.18fr; gap:18px; align-items:center; min-height:520px; padding:30px; border:1px solid rgba(255,255,255,.08); border-radius:28px; background: radial-gradient(circle at 38% 50%,rgba(255,181,31,.10),transparent 26%), rgba(255,255,255,.025); overflow:hidden; } .integrations-signal-source{ min-height:300px; padding:30px; display:flex; flex-direction:column; justify-content:center; border-radius:22px; background:#fff; color:#252a33; box-shadow:0 22px 48px rgba(0,0,0,.14); } .integrations-signal-kicker{ color:#a16a00; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-signal-source strong{ margin-top:14px; font-family:var(--title-font); font-size:28px; line-height:1.12; } .integrations-signal-source small{ margin-top:12px; color:#66707d; line-height:1.55; } .integrations-signal-stream{ position:relative; height:260px; } .integrations-signal-stream::before{ content:""; position:absolute; left:50%; top:0; bottom:0; width:2px; transform:translateX(-50%); background:rgba(255,255,255,.10); } .integrations-signal-stream span, .integrations-signal-stream i, .integrations-signal-stream b{ position:absolute; left:50%; width:16px; height:16px; margin-left:-8px; border-radius:50%; background:#ffb51f; box-shadow:0 0 0 7px rgba(255,181,31,.10); animation:integrationSignalDrop 3.6s linear infinite; } .integrations-signal-stream i{animation-delay:1.2s} .integrations-signal-stream b{animation-delay:2.4s} @keyframes integrationSignalDrop{ from{top:0;opacity:0;transform:scale(.75)} 12%{opacity:1} 82%{opacity:1} to{top:244px;opacity:0;transform:scale(1)} } .integrations-signal-destinations{ display:grid; gap:12px; } .integrations-signal-destinations article{ min-height:136px; padding:20px; border:1px solid rgba(255,255,255,.09); border-radius:18px; background:rgba(255,255,255,.045); transition:transform .3s ease,border-color .3s ease,background .3s ease; } .integrations-signal-destinations article:hover{ transform:translateX(7px); border-color:rgba(255,181,31,.30); background:rgba(255,181,31,.07); } .integrations-signal-destinations article>span{ color:#ffd45a; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-signal-destinations strong{ display:block; margin-top:6px; color:#fff; } .integrations-signal-destinations p{ margin:7px 0 0; color:rgba(255,255,255,.64); font-size:13px; line-height:1.55; } /* --------------------------------------------------------- Choose the connection based... Unique orbit/card composition. --------------------------------------------------------- */ .integrations-paths-orbit-section{ background:#fffdf8; } .integrations-paths-heading-v74{ max-width:860px; } .integrations-paths-heading-v74>p{ max-width:700px; margin:14px auto 0; } .integrations-path-orbit{ position:relative; min-height:620px; margin-top:38px; } .integrations-path-orbit::before{ content:""; position:absolute; left:50%; top:50%; width:430px; height:430px; transform:translate(-50%,-50%); border:1px dashed rgba(37,42,51,.12); border-radius:50%; } .integrations-path-orbit-center{ position:absolute; left:50%; top:50%; width:240px; min-height:240px; transform:translate(-50%,-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:26px; border-radius:50%; background:#252a33; color:#fff; box-shadow:0 24px 56px rgba(17,24,39,.15); z-index:2; } .integrations-path-orbit-center>span{ color:#ffd45a; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; } .integrations-path-orbit-center strong{ max-width:150px; margin-top:10px; font-family:var(--title-font); font-size:23px; line-height:1.12; } .integrations-path-orbit-center small{ max-width:150px; margin-top:8px; color:rgba(255,255,255,.58); } .integrations-path-orbit-card{ position:absolute; width:330px; min-height:215px; padding:24px; border:1px solid var(--line); border-radius:20px; background:#fff; box-shadow:0 16px 34px rgba(17,24,39,.05); transition:transform .34s ease,border-color .34s ease,box-shadow .34s ease; } .integrations-path-orbit-card-a{left:2%;top:5%} .integrations-path-orbit-card-b{right:2%;top:18%} .integrations-path-orbit-card-c{left:10%;bottom:2%} .integrations-path-orbit-card:hover{ transform:translateY(-7px) rotate(-1deg); border-color:rgba(255,181,31,.38); box-shadow:0 24px 46px rgba(17,24,39,.09); } .integrations-path-orbit-number{ width:38px; height:38px; display:grid; place-items:center; border-radius:12px; background:#ffb51f; color:#252a33; font-size:10px; font-weight:900; } .integrations-path-orbit-card>small{ display:block; margin-top:20px; color:#a16a00; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-path-orbit-card h3{ margin:7px 0 8px; } .integrations-path-orbit-card p{ margin:0; color:var(--muted); } /* --------------------------------------------------------- Developers/API section Unique terminal/logic board — no image split. --------------------------------------------------------- */ .integrations-developer-terminal-section{ background:#fff; } .integrations-developer-terminal{ padding:0; } .integrations-developer-terminal-head{ max-width:850px; margin:0 auto 36px; text-align:center; } .integrations-developer-terminal-head h2{ margin-top:14px; } .integrations-developer-terminal-head>p{ max-width:700px; margin:14px auto 0; color:var(--muted); } .integrations-developer-console{ overflow:hidden; border:1px solid rgba(37,42,51,.10); border-radius:26px; background:#20252d; box-shadow:0 26px 60px rgba(17,24,39,.12); } .integrations-console-topbar{ min-height:56px; padding:0 20px; display:flex; align-items:center; gap:8px; border-bottom:1px solid rgba(255,255,255,.08); background:#181c22; } .integrations-console-topbar>span{ width:10px; height:10px; border-radius:50%; background:#ffb51f; } .integrations-console-topbar>span:nth-child(2){opacity:.62} .integrations-console-topbar>span:nth-child(3){opacity:.34} .integrations-console-topbar strong{ margin-left:10px; color:rgba(255,255,255,.72); font-size:12px; } .integrations-console-grid{ display:grid; grid-template-columns:.82fr 1.18fr; min-height:440px; } .integrations-console-code{ padding:34px 26px; border-right:1px solid rgba(255,255,255,.08); display:grid; align-content:center; gap:14px; background: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px), #1b2027; background-size:100% 44px; } .integrations-code-line{ display:grid; grid-template-columns:32px 1fr; gap:10px; align-items:center; min-height:44px; color:#fff; } .integrations-code-line b{ color:rgba(255,255,255,.32); font-size:11px; } .integrations-code-line code{ color:#ffd45a; font-size:13px; } .integrations-console-logic{ padding:24px; display:grid; grid-template-columns:repeat(3,1fr); gap:12px; align-items:stretch; } .integrations-console-logic article{ padding:20px; border:1px solid rgba(255,255,255,.08); border-radius:16px; background:rgba(255,255,255,.045); transition:transform .3s ease,background .3s ease,border-color .3s ease; } .integrations-console-logic article:hover{ transform:translateY(-6px); background:rgba(255,181,31,.08); border-color:rgba(255,181,31,.28); } .integrations-console-logic article>span{ color:#ffd45a; font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.08em; } .integrations-console-logic strong{ display:block; margin-top:10px; color:#fff; line-height:1.35; } .integrations-console-logic p{ margin:9px 0 0; color:rgba(255,255,255,.62); font-size:12px; line-height:1.55; } .integrations-developer-terminal-footer{ display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:20px; padding:18px 20px; border:1px solid var(--line); border-radius:16px; background:#fffdf8; } .integrations-developer-terminal-footer p{ margin:0; color:var(--muted); } /* Hide obsolete requested-section layouts from cascade */ .integrations-expansion-section, .integrations-paths-layout, .integrations-developer-shell{ display:none!important; } @media(max-width:980px){ .partner-journey-copy, .partner-journey-map{ min-height:0; } .integrations-signal-head{ grid-template-columns:1fr; align-items:start; } .integrations-signal-canvas{ grid-template-columns:1fr; } .integrations-signal-stream{ height:90px; } .integrations-signal-stream::before{ left:0; right:0; top:50%; bottom:auto; width:100%; height:2px; transform:none; } .integrations-signal-stream span, .integrations-signal-stream i, .integrations-signal-stream b{ top:50%; left:0; margin:-8px 0 0; animation:integrationSignalAcross 3.6s linear infinite; } @keyframes integrationSignalAcross{ from{left:0;opacity:0} 12%{opacity:1} 82%{opacity:1} to{left:calc(100% - 16px);opacity:0} } .integrations-path-orbit{ min-height:0; display:grid; grid-template-columns:1fr; gap:14px; } .integrations-path-orbit::before, .integrations-path-orbit-center{ display:none; } .integrations-path-orbit-card, .integrations-path-orbit-card-a, .integrations-path-orbit-card-b, .integrations-path-orbit-card-c{ position:relative; left:auto; right:auto; top:auto; bottom:auto; width:auto; min-height:0; } .integrations-console-grid{ grid-template-columns:1fr; } .integrations-console-code{ border-right:0; border-bottom:1px solid rgba(255,255,255,.08); } .integrations-console-logic{ grid-template-columns:1fr; } } @media(max-width:680px){ .integrations-signal-canvas{ padding:20px; } .integrations-signal-source{ min-height:220px; } .integrations-developer-terminal-footer{ align-items:flex-start; flex-direction:column; } } @media(prefers-reduced-motion:reduce){ .integrations-signal-stream span, .integrations-signal-stream i, .integrations-signal-stream b, .integrations-signal-destinations article, .integrations-path-orbit-card, .integrations-console-logic article, .partner-journey-track span{ animation:none!important; transition:none!important; transform:none!important; } } /* ========================================================= V1.75 INTEGRATIONS — COMPETITOR-STYLE CLEAN REDESIGN ========================================================= */ /* Global spacing */ .integrations-catalog-section, .integrations-methods-section, .integrations-api-section{ padding-block:var(--global-section-space)!important; } /* 1. Compact integration catalog inspired by mature SaaS integration directories */ .integrations-catalog-section{ background:#fff; } .integrations-catalog-head{ display:grid; grid-template-columns:1fr .9fr; gap:56px; align-items:end; margin-bottom:34px; } .integrations-catalog-head h2{ margin-top:14px; } .integrations-catalog-head>p{ margin:0; color:var(--muted); font-size:17px; line-height:1.65; } .integrations-catalog-shell{ padding:20px; border:1px solid var(--line); border-radius:24px; background:#fffdf8; } .integrations-catalog-tabs{ display:flex; gap:8px; flex-wrap:wrap; padding-bottom:18px; border-bottom:1px solid var(--line); } .integrations-catalog-tabs button{ min-height:38px; padding:0 14px; border:1px solid var(--line); border-radius:999px; background:#fff; color:#59636f; font:inherit; font-size:12px; font-weight:800; cursor:pointer; transition:background .25s ease,color .25s ease,border-color .25s ease,transform .25s ease; } .integrations-catalog-tabs button:hover, .integrations-catalog-tabs button.is-active{ transform:translateY(-2px); background:#252a33; color:#fff; border-color:#252a33; } .integrations-catalog-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:12px; margin-top:18px; } .integration-catalog-card{ position:relative; min-height:220px; padding:20px; display:grid; grid-template-columns:48px 1fr; gap:14px; border:1px solid var(--line); border-radius:17px; background:#fff; transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease,opacity .28s ease; } .integration-catalog-card:hover{ transform:translateY(-5px); border-color:rgba(255,181,31,.38); box-shadow:0 18px 36px rgba(17,24,39,.07); } .integration-catalog-card.is-hidden{ display:none; } .integration-catalog-icon{ width:46px; height:46px; display:grid; place-items:center; border-radius:13px; background:#252a33; color:#fff; transition:background .28s ease,color .28s ease; } .integration-catalog-card:hover .integration-catalog-icon{ background:#ffb51f; color:#252a33; } .integration-catalog-icon svg{ width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round; } .integration-catalog-card small{ color:#a16a00; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integration-catalog-card h3{ margin:7px 0 8px; } .integration-catalog-card p{ margin:0; color:var(--muted); font-size:13px; line-height:1.58; } .integration-catalog-card>b{ position:absolute; right:16px; bottom:14px; color:#c7ccd2; font-size:11px; } .integrations-catalog-footer{ display:flex; align-items:center; justify-content:space-between; gap:24px; margin-top:18px; padding:18px 2px 0; border-top:1px solid var(--line); } .integrations-catalog-footer p{ margin:0; color:var(--muted); } /* 2. Method comparison — simple, decision-oriented, competitor-like */ .integrations-methods-section{ background:#fffdf8; } .integrations-methods-heading{ max-width:860px; } .integrations-methods-heading>p{ max-width:700px; margin:14px auto 0; } .integrations-methods-table{ overflow:hidden; border:1px solid var(--line); border-radius:24px; background:#fff; box-shadow:0 18px 40px rgba(17,24,39,.045); } .integrations-methods-header{ display:grid; grid-template-columns:.7fr repeat(3,1fr); border-bottom:1px solid var(--line); } .integrations-methods-label{ padding:24px; display:flex; align-items:flex-end; color:#8b6570; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-methods-header article{ min-height:220px; padding:24px; border-left:1px solid var(--line); transition:background .3s ease; } .integrations-methods-header article:hover{ background:#fff7e6; } .integrations-methods-header article>span{ color:#a16a00; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-methods-header h3{ margin:20px 0 10px; } .integrations-methods-header p{ margin:0; color:var(--muted); } .integrations-methods-row{ display:grid; grid-template-columns:.7fr repeat(3,1fr); min-height:72px; border-bottom:1px solid var(--line); } .integrations-methods-row>*{ padding:18px 24px; display:flex; align-items:center; } .integrations-methods-row strong{ color:#252a33; } .integrations-methods-row span{ border-left:1px solid var(--line); color:#66707d; } .integrations-methods-row:hover{ background:#fffaf0; } .integrations-methods-bottom{ display:flex; align-items:center; justify-content:space-between; gap:20px; padding:20px 24px; background:#252a33; color:#fff; } .integrations-methods-bottom>span{ color:rgba(255,255,255,.70); } .integrations-methods-bottom>a{ display:inline-flex; align-items:center; gap:10px; color:#fff; font-weight:900; } .integrations-methods-bottom b{ width:34px; height:34px; display:grid; place-items:center; border-radius:50%; background:#ffb51f; color:#252a33; transition:transform .25s ease; } .integrations-methods-bottom a:hover b{ transform:translateX(3px); } /* 3. Developer/API — clean product-docs split */ .integrations-api-section{ background:#fff; } .integrations-api-layout{ display:grid; grid-template-columns:.88fr 1.12fr; gap:58px; align-items:stretch; } .integrations-api-copy, .integrations-api-preview{ min-height:570px; } .integrations-api-copy{ display:flex; flex-direction:column; justify-content:center; } .integrations-api-copy h2{ margin-top:14px; } .integrations-api-copy>p{ max-width:540px; margin:16px 0 0; color:var(--muted); } .integrations-api-points{ margin-top:24px; border-top:1px solid var(--line); } .integrations-api-points article{ display:grid; grid-template-columns:42px 1fr; gap:14px; padding:16px 0; border-bottom:1px solid var(--line); } .integrations-api-points article>span{ width:34px; height:34px; display:grid; place-items:center; border-radius:11px; background:#fff0b8; color:#9a6600; font-size:10px; font-weight:900; } .integrations-api-points h3{ margin:0 0 5px; } .integrations-api-points p{ margin:0; color:var(--muted); font-size:13px; } .integrations-api-copy .btn{ margin-top:24px; align-self:flex-start; } .integrations-api-preview{ overflow:hidden; border-radius:26px; background:#20252d; color:#fff; box-shadow:0 26px 60px rgba(17,24,39,.13); } .integrations-api-preview-top{ min-height:86px; padding:20px 24px; display:flex; flex-direction:column; justify-content:center; border-bottom:1px solid rgba(255,255,255,.08); background:#181c22; } .integrations-api-preview-top span{ color:#ffd45a; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-api-preview-top strong{ margin-top:6px; } .integrations-api-preview-code{ padding:32px 24px; display:grid; gap:14px; background: linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px), #20252d; background-size:100% 48px; } .integrations-api-code-line{ min-height:48px; display:grid; grid-template-columns:58px 1fr; gap:12px; align-items:center; border-bottom:1px solid rgba(255,255,255,.06); } .integrations-api-code-line b{ color:#ffb51f; font-size:10px; } .integrations-api-code-line code{ color:rgba(255,255,255,.80); font-size:13px; } .integrations-api-preview-foot{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(255,255,255,.08); } .integrations-api-preview-foot article{ min-height:130px; padding:20px; background:#252a33; transition:background .3s ease; } .integrations-api-preview-foot article:hover{ background:#2d333d; } .integrations-api-preview-foot span, .integrations-api-preview-foot strong{ display:block; } .integrations-api-preview-foot span{ color:#ffd45a; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-api-preview-foot strong{ margin-top:10px; line-height:1.35; } /* Old V1.74 designs should not affect the new markup */ .integrations-signal-section, .integrations-path-orbit, .integrations-developer-terminal-section{ display:none!important; } @media(max-width:980px){ .integrations-catalog-head, .integrations-api-layout{ grid-template-columns:1fr; } .integrations-catalog-grid{ grid-template-columns:1fr 1fr; } .integrations-methods-table{ overflow-x:auto; } .integrations-methods-header, .integrations-methods-row{ min-width:900px; } .integrations-api-copy, .integrations-api-preview{ min-height:0; } } @media(max-width:680px){ .integrations-catalog-grid{ grid-template-columns:1fr; } .integrations-catalog-footer{ align-items:flex-start; flex-direction:column; } .integrations-api-preview-foot{ grid-template-columns:1fr; } } @media(prefers-reduced-motion:reduce){ .integrations-catalog-tabs button, .integration-catalog-card, .integration-catalog-icon, .integrations-methods-header article, .integrations-methods-bottom b, .integrations-api-preview-foot article{ animation:none!important; transition:none!important; transform:none!important; } } /* ========================================================= V1.76 INTEGRATIONS TEASER REDESIGN + DEVELOPERS/API PAGE ========================================================= */ .integrations-usecases-section, .integrations-catalog-section, .integrations-methods-section, .integrations-operations-section, .integrations-categories-section, .integrations-build-section, .integrations-faq-white, .developers-resources-section, .developers-start-section, .developers-access-section, .developers-events-section, .developers-reliability-section, .developers-architecture-section, .developers-faq-white{ padding-block:var(--global-section-space)!important; } /* Integrations teaser */ .integrations-build-section{background:#fff} .integrations-build-head{display:grid;grid-template-columns:1fr .9fr;gap:56px;align-items:end;margin-bottom:36px} .integrations-build-head h2{margin-top:14px} .integrations-build-head>p{margin:0;color:var(--muted);font-size:17px;line-height:1.65} .integrations-build-frame{display:grid;grid-template-columns:1.08fr .92fr;gap:18px;align-items:stretch} .integrations-build-image,.integrations-build-checklist{min-height:560px} .integrations-build-image{margin:0;overflow:hidden;border-radius:26px;box-shadow:0 22px 50px rgba(17,24,39,.08)} .integrations-build-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .65s ease} .integrations-build-image:hover img{transform:scale(1.035)} .integrations-build-checklist{display:flex;flex-direction:column;border-top:1px solid var(--line)} .integrations-build-checklist article{display:grid;grid-template-columns:48px 1fr;gap:16px;padding:21px 0;border-bottom:1px solid var(--line);transition:padding-left .3s ease,background .3s ease} .integrations-build-checklist article:hover{padding-left:10px;background:linear-gradient(90deg,rgba(255,181,31,.07),transparent 82%)} .integrations-build-checklist article>span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#252a33;color:#fff;font-size:10px;font-weight:900} .integrations-build-checklist small{color:#a16a00;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase} .integrations-build-checklist h3{margin:6px 0} .integrations-build-checklist p{margin:0;color:var(--muted)} .integrations-build-checklist .btn{margin-top:auto;align-self:flex-start} /* Developers hero */ .developers-main-hero .hubstaff-hero-copy{max-width:none} .developers-main-hero h1{max-width:1080px} /* Resource cards */ .developers-resources-section{background:#fff} .developers-resources-heading{max-width:870px} .developers-resources-heading>p{max-width:720px;margin:14px auto 0} .developers-resource-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px} .developers-resource-grid article{min-height:330px;padding:26px;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:20px;background:#fffdf8;transition:transform .34s ease,border-color .34s ease,box-shadow .34s ease} .developers-resource-grid article:hover{transform:translateY(-7px);border-color:rgba(255,181,31,.38);box-shadow:0 22px 44px rgba(17,24,39,.08)} .developers-resource-code{width:52px;height:52px;display:grid;place-items:center;border-radius:15px;background:#252a33;color:#fff;font-size:11px;font-weight:900;letter-spacing:.06em;transition:background .3s ease,color .3s ease,transform .3s ease} .developers-resource-grid article:hover .developers-resource-code{background:#ffb51f;color:#252a33;transform:rotate(-5deg)} .developers-resource-grid h3{margin:38px 0 10px} .developers-resource-grid p{margin:0;color:var(--muted)} .developers-resource-grid small{margin-top:auto;padding-top:22px;color:#9b6700;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase} /* Getting started */ .developers-start-section{background:#fffdf8} .developers-start-layout{display:grid;grid-template-columns:.94fr 1.06fr;gap:56px;align-items:stretch} .developers-start-copy,.developers-start-image{min-height:600px} .developers-start-copy{display:flex;flex-direction:column;justify-content:center} .developers-start-copy>p{margin:16px 0 0;color:var(--muted)} .developers-start-steps{margin-top:25px;border-top:1px solid var(--line)} .developers-start-steps article{display:grid;grid-template-columns:44px 1fr;gap:15px;padding:17px 0;border-bottom:1px solid var(--line)} .developers-start-steps article>span{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#fff0b8;color:#9a6600;font-size:10px;font-weight:900} .developers-start-steps h3{margin:0 0 5px} .developers-start-steps p{margin:0;color:var(--muted)} .developers-start-image{margin:0;overflow:hidden;border-radius:28px;box-shadow:0 24px 52px rgba(17,24,39,.08)} .developers-start-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .65s ease} .developers-start-image:hover img{transform:scale(1.035)} /* Drive scroll expansion media */ .developers-scroll-section{position:relative;height:205vh;background:#090a0d;overflow:clip} .developers-scroll-track{height:205vh} .developers-scroll-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:flex;align-items:center;justify-content:center} .developers-scroll-heading{position:absolute;top:13%;left:50%;transform:translateX(-50%);z-index:3;color:#fff} .developers-scroll-heading h2{margin-top:14px;color:#fff} .developers-scroll-heading h2 span{display:block;will-change:transform,opacity} .developers-scroll-media{position:absolute;left:50%;top:52%;width:min(500px,38vw);aspect-ratio:16/10;transform:translate(-50%,-50%) scale(.80);overflow:hidden;border-radius:24px;box-shadow:0 30px 80px rgba(0,0,0,.38);will-change:width,transform,border-radius} .developers-scroll-media img{width:100%;height:100%;object-fit:cover;display:block} .developers-scroll-overlay{position:absolute;left:18px;right:18px;bottom:18px;display:flex;align-items:center;justify-content:center;gap:10px;padding:12px;border-radius:14px;background:rgba(20,24,30,.84);backdrop-filter:blur(10px);color:#fff} .developers-scroll-overlay span{font-size:10px;font-weight:900} .developers-scroll-overlay strong{color:#ffb51f} .developers-scroll-copy{position:absolute;left:50%;bottom:7%;max-width:760px;transform:translate(-50%,24px);text-align:center;opacity:0;color:#fff;will-change:opacity,transform} .developers-scroll-copy>span{color:#ffd45a;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase} .developers-scroll-copy h3{margin:9px 0 0;color:#fff} .developers-scroll-copy p{max-width:700px;margin:12px auto 0;color:rgba(255,255,255,.70)} /* Access */ .developers-access-section{background:#fff} .developers-access-head{display:grid;grid-template-columns:1fr .9fr;gap:56px;align-items:end;margin-bottom:36px} .developers-access-head h2{margin-top:14px} .developers-access-head>p{margin:0;color:var(--muted);font-size:17px;line-height:1.65} .developers-access-board{display:grid;grid-template-columns:repeat(4,1fr);gap:0;overflow:hidden;border:1px solid var(--line);border-radius:24px} .developers-access-board article{min-height:290px;padding:26px;background:#fffdf8;transition:background .3s ease} .developers-access-board article+article{border-left:1px solid var(--line)} .developers-access-board article:hover{background:#fff5d8} .developers-access-board article>span{display:block;color:#a16a00;font-size:10px;font-weight:900} .developers-access-board strong{display:block;margin-top:55px;font-family:var(--title-font);font-size:20px} .developers-access-board p{margin:10px 0 0;color:var(--muted)} /* Events */ .developers-events-section{background:#252a33;color:#fff} .developers-events-layout{display:grid;grid-template-columns:.84fr 1.16fr;gap:64px;align-items:center} .developers-events-copy h2{margin-top:14px;color:#fff} .developers-events-copy>p{margin:16px 0 0;color:rgba(255,255,255,.68)} .developers-events-copy .btn{margin-top:24px} .developers-events-stream{display:grid;grid-template-columns:1fr 54px 1fr 54px 1fr;gap:0;align-items:center} .developers-events-stream article{min-height:260px;padding:24px;display:flex;flex-direction:column;justify-content:center;border:1px solid rgba(255,255,255,.10);border-radius:20px;background:rgba(255,255,255,.045);transition:transform .3s ease,background .3s ease,border-color .3s ease} .developers-events-stream article:hover{transform:translateY(-6px);background:rgba(255,181,31,.08);border-color:rgba(255,181,31,.28)} .developers-events-stream article>span{color:#ffd45a;font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase} .developers-events-stream strong{margin-top:12px;color:#fff} .developers-events-stream small{margin-top:9px;color:rgba(255,255,255,.60);line-height:1.5} .developers-events-stream>i{position:relative;display:block;height:2px;background:rgba(255,255,255,.12);overflow:hidden} .developers-events-stream>i::after{content:"";position:absolute;left:-40%;top:0;width:40%;height:100%;background:linear-gradient(90deg,#ffbd20,#ff914d,#ff6f59);animation:developersEventFlow 1.8s linear infinite} @keyframes developersEventFlow{to{left:100%}} /* Reliability */ .developers-reliability-section{background:#fffdf8} .developers-reliability-heading{max-width:880px} .developers-reliability-heading>p{max-width:730px;margin:14px auto 0} .developers-reliability-list{display:grid;grid-template-columns:1fr 1fr;gap:12px} .developers-reliability-list article{position:relative;min-height:126px;padding:22px 58px 22px 22px;border:1px solid var(--line);border-radius:17px;background:#fff;transition:transform .3s ease,border-color .3s ease,box-shadow .3s ease} .developers-reliability-list article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.36);box-shadow:0 16px 32px rgba(17,24,39,.055)} .developers-reliability-list article>span{font-weight:900;color:#252a33} .developers-reliability-list p{margin:7px 0 0;color:var(--muted)} .developers-reliability-list b{position:absolute;right:20px;top:20px;color:#d1d5da;font-size:11px} /* Architecture */ .developers-architecture-section{background:#fff} .developers-architecture-layout{display:grid;grid-template-columns:1.06fr .94fr;gap:56px;align-items:stretch} .developers-architecture-image,.developers-architecture-copy{min-height:570px} .developers-architecture-image{margin:0;overflow:hidden;border-radius:28px;box-shadow:0 24px 52px rgba(17,24,39,.08)} .developers-architecture-image img{width:100%;height:100%;display:block;object-fit:cover;transition:transform .65s ease} .developers-architecture-image:hover img{transform:scale(1.035)} .developers-architecture-copy{display:flex;flex-direction:column;justify-content:center} .developers-architecture-copy>p{margin:16px 0 0;color:var(--muted)} .developers-architecture-notes{margin-top:25px;display:grid;gap:10px} .developers-architecture-notes article{padding:15px 17px;border:1px solid var(--line);border-radius:15px;background:#fffdf8;transition:transform .28s ease,border-color .28s ease} .developers-architecture-notes article:hover{transform:translateX(5px);border-color:rgba(255,181,31,.36)} .developers-architecture-notes strong,.developers-architecture-notes span{display:block} .developers-architecture-notes span{margin-top:5px;color:var(--muted);font-size:12px} /* FAQ */ section.worklix-faq-section.developers-faq-white{background:#fff!important;color:#252a33!important} .developers-faq-white .faq-heading h2,.developers-faq-white .faq-list summary{color:#252a33!important} .developers-faq-white .faq-heading p,.developers-faq-white .faq-list details p{color:#657080!important;opacity:1!important} .developers-faq-white .faq-list details{background:#fff!important;border-color:#e1e4e9!important} .developers-faq-white .faq-list details[open]{background:#fffaf0!important;border-color:rgba(255,181,31,.42)!important} /* Reveals */ [data-developers-reveal] .developers-resource-grid article, [data-developers-reveal] .developers-start-copy, [data-developers-reveal] .developers-start-image, [data-developers-reveal] .developers-access-board, [data-developers-reveal] .developers-events-copy, [data-developers-reveal] .developers-events-stream, [data-developers-reveal] .developers-reliability-list, [data-developers-reveal] .developers-architecture-image, [data-developers-reveal] .developers-architecture-copy{opacity:0;transform:translateY(20px)} [data-developers-reveal].is-visible .developers-resource-grid article, [data-developers-reveal].is-visible .developers-start-copy, [data-developers-reveal].is-visible .developers-start-image, [data-developers-reveal].is-visible .developers-access-board, [data-developers-reveal].is-visible .developers-events-copy, [data-developers-reveal].is-visible .developers-events-stream, [data-developers-reveal].is-visible .developers-reliability-list, [data-developers-reveal].is-visible .developers-architecture-image, [data-developers-reveal].is-visible .developers-architecture-copy{opacity:1;transform:none;transition:opacity .58s ease,transform .58s cubic-bezier(.2,.72,.2,1)} [data-developers-reveal].is-visible .developers-resource-grid article:nth-child(2){transition-delay:.05s} [data-developers-reveal].is-visible .developers-resource-grid article:nth-child(3){transition-delay:.10s} [data-developers-reveal].is-visible .developers-resource-grid article:nth-child(4){transition-delay:.15s} @media(max-width:980px){ .integrations-build-head,.integrations-build-frame,.developers-start-layout,.developers-access-head,.developers-events-layout,.developers-architecture-layout{grid-template-columns:1fr} .integrations-build-image,.integrations-build-checklist,.developers-start-copy,.developers-start-image,.developers-architecture-image,.developers-architecture-copy{min-height:0} .integrations-build-image,.developers-start-image,.developers-architecture-image{min-height:460px} .developers-resource-grid,.developers-access-board{grid-template-columns:1fr 1fr} .developers-access-board article:nth-child(3){border-left:0;border-top:1px solid var(--line)} .developers-access-board article:nth-child(4){border-top:1px solid var(--line)} .developers-events-stream{grid-template-columns:1fr;gap:12px} .developers-events-stream>i{width:2px;height:38px;margin:0 auto} .developers-events-stream>i::after{left:0;top:-40%;width:100%;height:40%;animation:developersEventFlowVertical 1.8s linear infinite} @keyframes developersEventFlowVertical{to{top:100%}} .developers-scroll-section,.developers-scroll-track{height:auto} .developers-scroll-sticky{position:relative;height:auto;min-height:760px;padding:var(--global-section-space) 0;flex-direction:column} .developers-scroll-heading,.developers-scroll-media,.developers-scroll-copy{position:relative;left:auto;top:auto;bottom:auto;transform:none!important} .developers-scroll-heading{width:100%} .developers-scroll-heading h2 span{transform:none!important;opacity:1!important} .developers-scroll-media{width:min(calc(100% - 32px),760px)!important;margin-top:32px} .developers-scroll-copy{width:100%;margin-top:30px;padding-inline:var(--global-inline-space);opacity:1!important} } @media(max-width:680px){ .developers-resource-grid,.developers-access-board,.developers-reliability-list{grid-template-columns:1fr} .developers-access-board article+article{border-left:0;border-top:1px solid var(--line)} .integrations-build-image,.developers-start-image,.developers-architecture-image{min-height:340px} } @media(prefers-reduced-motion:reduce){ .integrations-build-image img,.integrations-build-checklist article,.developers-resource-grid article,.developers-resource-code,.developers-start-image img,.developers-scroll-heading h2 span,.developers-scroll-media,.developers-scroll-copy,.developers-events-stream>i::after,.developers-reliability-list article,.developers-architecture-image img,[data-developers-reveal] *{animation:none!important;transition:none!important;transform:none!important;opacity:1!important} } /* ========================================================= V1.77 INTEGRATIONS DEV HANDOFF + DEVELOPERS RESOURCE ICONS ========================================================= */ /* Integrations: global spacing remains consistent */ .integrations-usecases-section, .integrations-catalog-section, .integrations-methods-section, .integrations-operations-section, .integrations-categories-section, .integrations-devhandoff-section, .integrations-faq-white{ padding-block:var(--global-section-space)!important; } /* Remove obsolete previous teaser from active cascade */ .integrations-build-section{ display:none!important; } /* Clean developer handoff section */ .integrations-devhandoff-section{ background:#fff; } .integrations-devhandoff-head{ display:grid; grid-template-columns:1fr .9fr; gap:56px; align-items:end; margin-bottom:36px; } .integrations-devhandoff-head h2{ margin-top:14px; } .integrations-devhandoff-head>p{ margin:0; color:var(--muted); font-size:17px; line-height:1.65; } .integrations-devhandoff-panel{ display:grid; grid-template-columns:1.18fr .82fr; gap:0; overflow:hidden; border:1px solid var(--line); border-radius:26px; box-shadow:0 24px 56px rgba(17,24,39,.07); } .integrations-devhandoff-doc{ min-height:520px; padding:0 30px 30px; background:#252a33; color:#fff; } .integrations-devhandoff-docbar{ min-height:74px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid rgba(255,255,255,.10); } .integrations-devhandoff-docbar>span{ color:#ffd45a; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-devhandoff-docbar>strong{ color:rgba(255,255,255,.56); font-size:12px; } .integrations-devhandoff-lines{ display:grid; } .integrations-devhandoff-lines article{ position:relative; min-height:138px; padding:24px 8px 24px 0; display:grid; grid-template-columns:118px 1fr; column-gap:24px; align-items:start; border-bottom:1px solid rgba(255,255,255,.10); transition:padding-left .3s ease,background .3s ease; } .integrations-devhandoff-lines article::before{ content:""; position:absolute; left:-30px; top:0; bottom:0; width:3px; background:linear-gradient(180deg,#ffbd20,#ff914d,#ff6f59); transform:scaleY(0); transform-origin:top; transition:transform .38s ease; } .integrations-devhandoff-lines article:hover{ padding-left:12px; background:rgba(255,181,31,.045); } .integrations-devhandoff-lines article:hover::before{ transform:scaleY(1); } .integrations-devhandoff-lines small{ color:#ffd45a; font-size:9px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; } .integrations-devhandoff-lines strong{ display:block; color:#fff; font-size:18px; line-height:1.35; } .integrations-devhandoff-lines p{ grid-column:2; margin:8px 0 0; color:rgba(255,255,255,.62); font-size:13px; line-height:1.55; } .integrations-devhandoff-side{ min-height:520px; padding:34px; display:flex; flex-direction:column; background:#fffdf8; } .integrations-devhandoff-sidecopy h3{ margin:16px 0 10px; } .integrations-devhandoff-sidecopy p{ margin:0; color:var(--muted); } .integrations-devhandoff-checks{ margin-top:32px; display:grid; gap:10px; } .integrations-devhandoff-checks span{ position:relative; padding:15px 16px 15px 44px; border:1px solid var(--line); border-radius:14px; background:#fff; color:#4f5966; font-weight:800; transition:transform .28s ease,border-color .28s ease,background .28s ease; } .integrations-devhandoff-checks span::before{ content:"✓"; position:absolute; left:14px; top:50%; width:20px; height:20px; transform:translateY(-50%); display:grid; place-items:center; border-radius:50%; background:#ffb51f; color:#252a33; font-size:11px; font-weight:900; } .integrations-devhandoff-checks span:hover{ transform:translateX(5px); border-color:rgba(255,181,31,.38); background:#fff8e8; } .integrations-devhandoff-side .btn{ margin-top:auto; align-self:flex-start; } /* Developers resource icons */ .developers-resource-code{ display:none!important; } .developers-resource-icon{ width:54px; height:54px; display:grid; place-items:center; border-radius:15px; background:#252a33; color:#fff; transition: transform .3s ease, background .3s ease, color .3s ease, box-shadow .3s ease; } .developers-resource-icon svg{ width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.75; stroke-linecap:round; stroke-linejoin:round; } .developers-resource-grid article:hover .developers-resource-icon{ transform:translateY(-4px) rotate(-3deg); background:#ffb51f; color:#252a33; box-shadow:0 10px 24px rgba(255,181,31,.20); } @media(max-width:980px){ .integrations-devhandoff-head, .integrations-devhandoff-panel{ grid-template-columns:1fr; } .integrations-devhandoff-doc, .integrations-devhandoff-side{ min-height:0; } .integrations-devhandoff-side{ padding:28px; } } @media(max-width:680px){ .integrations-devhandoff-lines article{ grid-template-columns:1fr; row-gap:7px; } .integrations-devhandoff-lines p{ grid-column:1; } .integrations-devhandoff-doc{ padding-inline:22px; } } @media(prefers-reduced-motion:reduce){ .integrations-devhandoff-lines article, .integrations-devhandoff-lines article::before, .integrations-devhandoff-checks span, .developers-resource-icon{ transition:none!important; transform:none!important; } } /* ========================================================= V1.78 REAL PLATFORM COPY PASS Security / Integrations / Developers are production product pages. ========================================================= */ .developers-resources-section{ scroll-margin-top:120px; } .developers-main-hero .hubstaff-topline span, .integrations-main-hero .hubstaff-topline span, .security-main-hero .hubstaff-topline span{ opacity:.82; } /* Keep normal page sections on the global vertical rhythm. */ .security-foundation-section, .security-layers-section, .security-control-section, .security-role-flow-section, .security-monitoring-section, .security-review-section, .security-faq-white, .integrations-usecases-section, .integrations-catalog-section, .integrations-methods-section, .integrations-operations-section, .integrations-categories-section, .integrations-devhandoff-section, .integrations-faq-white, .developers-resources-section, .developers-start-section, .developers-access-section, .developers-events-section, .developers-reliability-section, .developers-architecture-section, .developers-faq-white{ padding-block:var(--global-section-space)!important; } /* ========================================================= V1.94 EMPLOYEE MANAGEMENT — FULL ANIMATED GRADIENT HERO Full-cover animated motion background for the Employee page banner. Uses brand colors, keeps hero content visible, and preserves the existing hero image + floating cards. ========================================================= */ .employee-management-motion-hero{ position:relative!important; overflow:hidden!important; isolation:isolate!important; background:#fbfaf7!important; } .employee-management-motion-hero .employee-banner-motion{ position:absolute!important; inset:0!important; z-index:0!important; overflow:hidden!important; pointer-events:none!important; background: linear-gradient(120deg, rgba(255,246,231,0.96) 0%, rgba(255,236,196,0.94) 14%, rgba(255,209,102,0.88) 28%, rgba(255,170,75,0.78) 44%, rgba(255,117,79,0.72) 62%, rgba(255,188,71,0.82) 78%, rgba(255,244,224,0.96) 100%)!important; background-size:240% 240%!important; animation:employeeGradientField 18s ease-in-out infinite alternate!important; } .employee-management-motion-hero .employee-banner-motion::before, .employee-management-motion-hero .employee-banner-motion::after{ content:""; position:absolute; inset:-18%; z-index:1; filter:blur(48px); will-change:transform,opacity; } .employee-management-motion-hero .employee-banner-motion::before{ background: radial-gradient(circle at 18% 24%, rgba(255,214,92,.72) 0%, rgba(255,214,92,.28) 16%, rgba(255,214,92,0) 34%), radial-gradient(circle at 82% 28%, rgba(255,128,78,.58) 0%, rgba(255,128,78,.22) 18%, rgba(255,128,78,0) 38%), radial-gradient(circle at 58% 82%, rgba(255,99,88,.38) 0%, rgba(255,99,88,.16) 16%, rgba(255,99,88,0) 34%); animation:employeeBlobFlowA 22s ease-in-out infinite alternate; opacity:.95; } .employee-management-motion-hero .employee-banner-motion::after{ background: radial-gradient(circle at 74% 16%, rgba(255,223,133,.52) 0%, rgba(255,223,133,.18) 14%, rgba(255,223,133,0) 34%), radial-gradient(circle at 42% 58%, rgba(255,162,72,.46) 0%, rgba(255,162,72,.18) 18%, rgba(255,162,72,0) 36%), radial-gradient(circle at 20% 80%, rgba(255,119,92,.32) 0%, rgba(255,119,92,.10) 16%, rgba(255,119,92,0) 30%); animation:employeeBlobFlowB 26s ease-in-out infinite alternate; opacity:.82; } .employee-management-motion-hero .employee-motion-glow{ position:absolute; inset:-12% -8%; z-index:2; background: linear-gradient(104deg, rgba(255,255,255,.34) 12%, rgba(255,255,255,.10) 34%, rgba(255,255,255,0) 48%), radial-gradient(circle at 18% 58%, rgba(255,255,255,.30) 0%, rgba(255,255,255,0) 28%), radial-gradient(circle at 78% 52%, rgba(255,255,255,.22) 0%, rgba(255,255,255,0) 24%); mix-blend-mode:screen; animation:employeeGlowDrift 20s ease-in-out infinite alternate; } .employee-management-motion-hero .employee-motion-ribbons{ position:absolute; inset:auto; width:135%; height:190px; right:-26%; border-radius:999px; z-index:2; filter:blur(14px); opacity:.8; will-change:transform,opacity; mix-blend-mode:screen; } .employee-management-motion-hero .employee-motion-ribbons::before{ content:""; position:absolute; inset:0; border-radius:inherit; background: linear-gradient(90deg, rgba(255,255,255,0) 0%, rgba(255,245,214,.10) 8%, rgba(255,221,125,.28) 22%, rgba(255,178,76,.62) 40%, rgba(255,112,84,.68) 58%, rgba(255,184,93,.42) 76%, rgba(255,255,255,0) 100%); box-shadow:0 0 42px rgba(255,162,72,.18); } .employee-management-motion-hero .employee-motion-ribbons.layer-a{ top:8%; transform:rotate(-18deg); animation:employeeRibbonDriftA 12s cubic-bezier(.4,0,.2,1) infinite alternate; } .employee-management-motion-hero .employee-motion-ribbons.layer-b{ top:34%; height:220px; opacity:.54; transform:rotate(-12deg) scale(1.06); animation:employeeRibbonDriftB 16s cubic-bezier(.4,0,.2,1) infinite alternate; } .employee-management-motion-hero .employee-motion-ribbons.layer-c{ top:60%; height:180px; opacity:.34; transform:rotate(-8deg) scale(1.12); animation:employeeRibbonDriftC 19s cubic-bezier(.4,0,.2,1) infinite alternate; } @keyframes employeeGradientField{ 0%{background-position:0% 50%} 50%{background-position:55% 35%} 100%{background-position:100% 50%} } @keyframes employeeBlobFlowA{ 0%{transform:translate3d(-1%,0,0) scale(1)} 50%{transform:translate3d(3%,-2%,0) scale(1.05)} 100%{transform:translate3d(7%,3%,0) scale(1.1)} } @keyframes employeeBlobFlowB{ 0%{transform:translate3d(2%,-2%,0) scale(1.02)} 50%{transform:translate3d(-3%,3%,0) scale(1.08)} 100%{transform:translate3d(-7%,5%,0) scale(1.12)} } @keyframes employeeGlowDrift{ 0%{transform:translate3d(0,0,0) scale(1)} 100%{transform:translate3d(-3%,2%,0) scale(1.04)} } @keyframes employeeRibbonDriftA{ 0%{transform:translate3d(0,0,0) rotate(-18deg) scale(1)} 50%{transform:translate3d(-10%,2%,0) rotate(-14deg) scale(1.03)} 100%{transform:translate3d(-18%,4%,0) rotate(-10deg) scale(1.06)} } @keyframes employeeRibbonDriftB{ 0%{transform:translate3d(0,0,0) rotate(-12deg) scale(1.06)} 50%{transform:translate3d(-12%,1%,0) rotate(-8deg) scale(1.09)} 100%{transform:translate3d(-20%,3%,0) rotate(-5deg) scale(1.12)} } @keyframes employeeRibbonDriftC{ 0%{transform:translate3d(0,0,0) rotate(-8deg) scale(1.12)} 50%{transform:translate3d(-10%,1%,0) rotate(-5deg) scale(1.16)} 100%{transform:translate3d(-18%,2%,0) rotate(-2deg) scale(1.2)} } .employee-management-motion-hero .hubstaff-hero-grid{ position:relative!important; z-index:3!important; grid-template-columns:minmax(0,.92fr) minmax(560px,1.08fr)!important; column-gap:60px!important; align-items:center!important; min-height:600px!important; } .employee-management-motion-hero .hubstaff-hero-copy{ position:relative!important; z-index:5!important; max-width:700px!important; } .employee-management-motion-hero .hubstaff-hero-copy h1, .employee-management-motion-hero .hubstaff-hero-copy p, .employee-management-motion-hero .hero-promo, .employee-management-motion-hero .hero-actions, .employee-management-motion-hero .hero-trust-points{ position:relative!important; z-index:5!important; } .employee-management-motion-hero .hubstaff-hero-copy::before{ content:""; position:absolute; inset:-24px -24px -24px -28px; z-index:0; border-radius:28px; background:linear-gradient(135deg,rgba(251,250,247,.88),rgba(251,250,247,.52)); backdrop-filter:blur(4px); } .employee-management-motion-hero .hubstaff-hero-visual, .employee-management-motion-hero .inner-visual{ visibility:visible!important; pointer-events:none!important; position:relative!important; z-index:4!important; max-width:740px!important; min-height:575px!important; align-self:center!important; } .employee-management-motion-hero .hero-pattern{ inset:4% 3% 7% 8%!important; background: radial-gradient(circle at 54% 42%,rgba(255,255,255,.44),rgba(255,255,255,.08) 28%,rgba(255,255,255,0) 50%), radial-gradient(circle at 74% 74%,rgba(255,215,86,.20),rgba(255,215,86,0) 32%), radial-gradient(circle at 18% 72%,rgba(255,140,81,.18),rgba(255,140,81,0) 34%)!important; filter:none!important; } .employee-management-motion-hero .hubstaff-hero-visual>img{ position:relative!important; z-index:2!important; width:min(100%,700px)!important; max-width:700px!important; margin-left:auto!important; filter:drop-shadow(0 24px 42px rgba(18,24,32,.16))!important; } .employee-management-motion-hero .hero-float-card{ z-index:5!important; backdrop-filter:blur(16px)!important; background:rgba(255,255,255,.92)!important; border:1px solid rgba(224,228,235,.96)!important; box-shadow:0 20px 42px rgba(17,22,29,.12)!important; } .employee-management-motion-hero .hero-float-active{left:0!important;top:12%!important} .employee-management-motion-hero .hero-float-time{right:0!important;top:12%!important} .employee-management-motion-hero .hero-float-productivity{left:1%!important;bottom:16%!important} .employee-management-motion-hero .hero-float-project{right:0!important;bottom:16%!important} .employee-management-motion-hero .hubstaff-hero-visual::before, .employee-management-motion-hero .hubstaff-hero-visual::after, .employee-management-motion-hero .inner-visual::before, .employee-management-motion-hero .inner-visual::after{ content:none!important; display:none!important; } @media(max-width:1120px){ .employee-management-motion-hero .hubstaff-hero-grid{ grid-template-columns:1fr!important; min-height:unset!important; row-gap:32px!important; } .employee-management-motion-hero .hubstaff-hero-copy{ max-width:760px!important; margin-inline:auto!important; text-align:center!important; } .employee-management-motion-hero .hubstaff-hero-copy::before{ inset:-18px -18px -18px -18px; } .employee-management-motion-hero .hubstaff-hero-copy>p, .employee-management-motion-hero .hero-actions, .employee-management-motion-hero .hero-trust-points, .employee-management-motion-hero .hero-promo{ margin-inline:auto!important; justify-content:center!important; } .employee-management-motion-hero .hubstaff-hero-visual{ max-width:760px!important; min-height:560px!important; margin-inline:auto!important; } .employee-management-motion-hero .employee-motion-ribbons{ right:-34%; width:160%; } } @media(max-width:820px){ .employee-management-motion-hero .hubstaff-hero-visual{min-height:480px!important} .employee-management-motion-hero .hubstaff-hero-visual>img{width:min(100%,620px)!important} .employee-management-motion-hero .employee-motion-ribbons{width:175%;right:-56%;filter:blur(12px)} } @media(max-width:620px){ .employee-management-motion-hero .hubstaff-hero-copy{ text-align:left!important; margin-inline:0!important; } .employee-management-motion-hero .hubstaff-hero-copy::before{ inset:-12px -10px -12px -10px; } .employee-management-motion-hero .hero-actions, .employee-management-motion-hero .hero-trust-points, .employee-management-motion-hero .hero-promo{ margin-inline:0!important; justify-content:flex-start!important; } .employee-management-motion-hero .hubstaff-hero-visual{min-height:350px!important} .employee-management-motion-hero .hubstaff-hero-visual>img{width:100%!important;max-width:100%!important} .employee-management-motion-hero .employee-motion-ribbons{width:205%;right:-88%;opacity:.86} .employee-management-motion-hero .employee-motion-ribbons.layer-a{top:12%} .employee-management-motion-hero .employee-motion-ribbons.layer-b{top:38%} .employee-management-motion-hero .employee-motion-ribbons.layer-c{top:66%} } @media(prefers-reduced-motion:reduce){ .employee-management-motion-hero .employee-banner-motion, .employee-management-motion-hero .employee-banner-motion::before, .employee-management-motion-hero .employee-banner-motion::after, .employee-management-motion-hero .employee-motion-glow, .employee-management-motion-hero .employee-motion-ribbons{ animation:none!important; } } /* END V1.94 EMPLOYEE MANAGEMENT HERO ANIMATED GRADIENT */ /* ========================================================= V1.97 INNER BANNER TITLE + COLORED TEXT MOTION - inner banner headings are authored as two deliberate lines - colored/gradient words animate instead of remaining static ========================================================= */ @keyframes worklixHeroGradientFlow{ 0%{background-position:0% 50%} 50%{background-position:100% 50%} 100%{background-position:0% 50%} } .hubstaff-inner-hero .gradient-text, .inner-hero .gradient-text, .hubstaff-inner-hero .typewriter-wrap, .inner-hero .typewriter-wrap{ background-size:220% 220%!important; animation:worklixHeroGradientFlow 4.8s ease-in-out infinite!important; } @media(min-width:821px){ .hubstaff-inner-hero h1 .hero-line, .inner-hero h1 .hero-line{display:block;white-space:nowrap} } @media(prefers-reduced-motion:reduce){ .hubstaff-inner-hero .gradient-text, .inner-hero .gradient-text, .hubstaff-inner-hero .typewriter-wrap, .inner-hero .typewriter-wrap{animation:none!important;background-position:50% 50%!important} } /* END V1.97 INNER BANNER POLISH */ /* ========================================================= V1.98 — UNIFIED INNER-PAGE BANNER SYSTEM Product-page banner is the source of truth. Converted inner pages use the same single-column shell, 2-line title and animated text. ========================================================= */ .global-unified-banner{ position:relative!important; overflow:hidden!important; background:linear-gradient(180deg,#fff 0%,#fff 66%,#fff9ef 100%)!important; padding:var(--space-hero-y) 0!important; } .global-unified-banner .product-main-hero-grid{ display:grid!important; grid-template-columns:minmax(0,1fr)!important; gap:0!important; align-items:center!important; } .global-unified-banner .hubstaff-hero-copy{ max-width:850px!important; text-align:left!important; margin:0!important; } .global-unified-banner .hubstaff-topline{ display:flex!important; align-items:center!important; gap:10px!important; color:var(--muted)!important; font-size:12px!important; margin-bottom:18px!important; } .global-unified-banner .hubstaff-topline span{ color:var(--text)!important; } .global-unified-banner .global-banner-title{ margin:0!important; max-width:900px!important; font-size:clamp(46px,4.4vw,64px)!important; line-height:1.02!important; letter-spacing:-.052em!important; font-weight:700!important; } .global-unified-banner .global-banner-line{ display:block!important; white-space:nowrap!important; } .global-unified-banner .gradient-text, .global-unified-banner .typewriter-wrap{ background:linear-gradient(90deg,#ffcb31 0%,#ff9c12 42%,#ff6a48 72%,#ffb800 100%)!important; background-size:220% 100%!important; -webkit-background-clip:text!important; background-clip:text!important; -webkit-text-fill-color:transparent!important; animation:globalBannerGradientFlow 3.2s linear infinite!important; } @keyframes globalBannerGradientFlow{ 0%{background-position:0% 50%} 100%{background-position:220% 50%} } .global-unified-banner .hubstaff-hero-copy>p{ max-width:760px!important; margin:20px 0 0!important; font-size:17px!important; line-height:1.62!important; color:var(--muted)!important; } .global-unified-banner .hero-actions{justify-content:flex-start!important;margin-top:28px!important} .global-unified-banner .hero-trust-points{justify-content:flex-start!important;margin-top:18px!important} @media(max-width:900px){ .global-unified-banner .global-banner-title{font-size:clamp(40px,6.8vw,56px)!important} } @media(max-width:620px){ .global-unified-banner .global-banner-title{font-size:clamp(31px,8.4vw,42px)!important;letter-spacing:-.045em!important} .global-unified-banner .global-banner-line{white-space:normal!important} .global-unified-banner .hero-actions{display:grid!important;grid-template-columns:1fr!important} .global-unified-banner .hero-actions .btn{width:100%!important} } @media(prefers-reduced-motion:reduce){ .global-unified-banner .gradient-text, .global-unified-banner .typewriter-wrap{animation:none!important} } /* END V1.98 UNIFIED INNER-PAGE BANNER SYSTEM */ /* v110 targeted redesigns: screen sharing, roles boundary, productivity analytics */ .ss110-expand-section,.ss110-modes-section,.rp110-boundary-section,.pa110-section{padding:clamp(78px,8vw,128px) 0;position:relative;overflow:hidden} .ss110-expand-section{background:linear-gradient(180deg,#fff 0%,#f5f7ff 100%)} .ss110-expand-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(42px,6vw,96px);align-items:center} .ss110-expand-copy p,.ss110-modes-head>p,.rp110-boundary-copy>p,.pa110-section p{color:var(--muted);line-height:1.75} .ss110-expand-points{display:grid;gap:14px;margin-top:28px}.ss110-expand-points article{display:flex;gap:14px;padding:14px 0;border-top:1px solid rgba(19,23,34,.09)} .ss110-expand-points article>span{width:32px;height:32px;border-radius:50%;display:grid;place-items:center;background:#edf0ff;color:#635bff;font-size:11px;font-weight:800;flex:0 0 auto}.ss110-expand-points b,.ss110-expand-points small{display:block}.ss110-expand-points small{margin-top:4px;color:var(--muted);line-height:1.5} .ss110-expand-visual{min-height:590px;position:relative;display:grid;place-items:center;isolation:isolate}.ss110-expand-visual:before{content:"";position:absolute;width:430px;height:430px;border-radius:50%;background:radial-gradient(circle,rgba(99,91,255,.18),rgba(99,91,255,0) 70%);z-index:-2;animation:ss110Pulse 5s ease-in-out infinite} .ss110-orbit{position:absolute;border:1px solid rgba(99,91,255,.16);border-radius:50%;z-index:-1}.ss110-orbit.one{width:500px;height:500px}.ss110-orbit.two{width:590px;height:590px;animation:ss110Spin 28s linear infinite}.ss110-orbit.two:after{content:"";position:absolute;top:35px;left:92px;width:10px;height:10px;border-radius:50%;background:#635bff;box-shadow:0 0 0 8px rgba(99,91,255,.1)} .ss110-screen-frame{width:min(100%,650px);background:#0d1120;border:1px solid rgba(255,255,255,.12);border-radius:28px;padding:12px;box-shadow:0 30px 80px rgba(20,24,50,.22);transform:perspective(1100px) rotateY(-3deg) rotateX(2deg);transition:.5s cubic-bezier(.2,.8,.2,1)}.ss110-expand-visual:hover .ss110-screen-frame{transform:perspective(1100px) rotateY(0) rotateX(0) translateY(-8px)} .ss110-frame-top{display:grid;grid-template-columns:1fr auto auto;gap:16px;align-items:center;color:#fff;padding:10px 10px 14px;font-size:12px}.ss110-frame-top span{display:flex;align-items:center;gap:7px}.ss110-frame-top i,.rp110-map-head i,.rp110-map-foot i{width:8px;height:8px;background:#62d99b;border-radius:50%;box-shadow:0 0 0 6px rgba(98,217,155,.12)}.ss110-frame-top small{color:#9ea6c0}.ss110-screen-frame img{display:block;width:100%;height:auto;border-radius:18px}.ss110-frame-dock{display:flex;flex-wrap:wrap;gap:8px;padding:12px 6px 3px}.ss110-frame-dock span{font-size:11px;color:#cbd1e4;background:rgba(255,255,255,.06);padding:7px 10px;border-radius:999px} .ss110-float-card{position:absolute;max-width:190px;padding:14px 16px;background:rgba(255,255,255,.88);backdrop-filter:blur(16px);border:1px solid rgba(99,91,255,.12);box-shadow:0 18px 50px rgba(30,35,70,.13);border-radius:16px;animation:ss110Float 4.5s ease-in-out infinite}.ss110-float-card b,.ss110-float-card small{display:block}.ss110-float-card small{color:var(--muted);font-size:11px;line-height:1.45;margin-top:3px}.ss110-float-a{left:-18px;top:92px}.ss110-float-b{right:-10px;bottom:70px;animation-delay:-2s} .ss110-modes-section{background:#f7f8fb}.ss110-modes-head{display:grid;grid-template-columns:1fr .76fr;gap:60px;align-items:end;margin-bottom:36px}.ss110-mode-grid{display:grid;grid-template-columns:1.35fr .825fr .825fr;gap:18px;align-items:stretch}.ss110-mode-card{position:relative;min-height:390px;padding:30px;border-radius:26px;background:#fff;border:1px solid rgba(19,23,34,.08);box-shadow:0 16px 48px rgba(28,31,54,.06);display:flex;flex-direction:column;transition:.45s cubic-bezier(.2,.8,.2,1);overflow:hidden}.ss110-mode-card:before{content:"";position:absolute;inset:auto -70px -90px auto;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(99,91,255,.12),transparent 70%);transition:.45s}.ss110-mode-card:hover{transform:translateY(-9px);box-shadow:0 28px 70px rgba(28,31,54,.12);border-color:rgba(99,91,255,.25)}.ss110-mode-card:hover:before{transform:scale(1.25)}.ss110-mode-featured{background:linear-gradient(145deg,#665fff,#4d44dd);color:#fff}.ss110-mode-card.dark{background:#111522;color:#fff}.ss110-mode-card.dark p,.ss110-mode-featured p,.ss110-mode-card.dark small,.ss110-mode-featured small{color:rgba(255,255,255,.72)}.ss110-mode-no{position:absolute;right:24px;top:20px;font-weight:800;font-size:12px;opacity:.45}.ss110-mode-icon{width:52px;height:52px;border-radius:16px;background:#f0f1ff;color:#635bff;display:grid;place-items:center;margin-bottom:44px}.ss110-mode-featured .ss110-mode-icon,.ss110-mode-card.dark .ss110-mode-icon{background:rgba(255,255,255,.1);color:#fff}.ss110-mode-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8}.ss110-mode-card>small{text-transform:uppercase;letter-spacing:.12em;font-weight:800;font-size:10px;color:#6f7486}.ss110-mode-card h3{font-size:clamp(22px,2vw,30px);margin:10px 0 12px;line-height:1.14}.ss110-mode-card p{margin:0;color:var(--muted);line-height:1.65}.ss110-card-foot{margin-top:auto;padding-top:26px;display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(19,23,34,.08);font-size:12px;font-weight:700}.ss110-mode-featured .ss110-card-foot,.ss110-mode-card.dark .ss110-card-foot{border-color:rgba(255,255,255,.14)}.ss110-card-foot i{font-style:normal;font-size:18px;transition:.3s}.ss110-mode-card:hover .ss110-card-foot i{transform:translateX(5px)} @keyframes ss110Pulse{50%{transform:scale(1.08);opacity:.72}}@keyframes ss110Spin{to{transform:rotate(360deg)}}@keyframes ss110Float{50%{transform:translateY(-10px)}} .rp110-boundary-section{background:linear-gradient(180deg,#f7f8fb,#fff)}.rp110-boundary-grid{display:grid;grid-template-columns:.86fr 1.14fr;gap:clamp(48px,7vw,110px);align-items:center}.rp110-boundary-list{display:grid;gap:12px;margin-top:28px}.rp110-boundary-list article{display:flex;gap:14px;padding:16px 0;border-top:1px solid rgba(18,22,34,.09)}.rp110-boundary-list>article>span{color:#635bff;font-size:12px;font-weight:800}.rp110-boundary-list b,.rp110-boundary-list small{display:block}.rp110-boundary-list small{color:var(--muted);margin-top:4px;line-height:1.5}.rp110-permission-map{background:#111522;color:#fff;border-radius:30px;padding:20px;box-shadow:0 34px 90px rgba(15,18,35,.18)}.rp110-map-head,.rp110-map-foot{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:8px 6px 18px}.rp110-map-head span,.rp110-map-foot span{display:flex;align-items:center;gap:9px;font-size:12px;color:#cbd2e7}.rp110-map-stage{height:470px;position:relative;border-radius:22px;overflow:hidden;background:radial-gradient(circle at center,rgba(99,91,255,.22),transparent 42%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:auto,34px 34px,34px 34px;display:grid;place-items:center}.rp110-map-center{width:150px;height:150px;border-radius:50%;background:linear-gradient(145deg,#6f67ff,#4b43d8);display:flex;flex-direction:column;align-items:center;justify-content:center;box-shadow:0 0 0 14px rgba(99,91,255,.1),0 20px 50px rgba(0,0,0,.25);position:relative;z-index:4}.rp110-map-center>span{width:40px;height:40px;border-radius:12px;background:rgba(255,255,255,.12);display:grid;place-items:center;font-weight:900;font-size:11px}.rp110-map-center b{margin-top:8px}.rp110-map-center small{color:#d5d8ff}.rp110-ring{position:absolute;border:1px solid rgba(151,145,255,.2);border-radius:50%}.rp110-ring.r1{width:270px;height:270px}.rp110-ring.r2{width:410px;height:410px;animation:ss110Spin 34s linear infinite}.rp110-node{position:absolute;width:145px;padding:13px 14px;border-radius:15px;background:#1c2234;border:1px solid rgba(255,255,255,.08);box-shadow:0 12px 30px rgba(0,0,0,.18);transition:.35s}.rp110-node:hover{transform:translateY(-5px) scale(1.02)}.rp110-node small,.rp110-node b,.rp110-node span{display:block}.rp110-node small{font-size:9px;text-transform:uppercase;letter-spacing:.12em;color:#9ca7c6}.rp110-node b{font-size:13px;margin:4px 0}.rp110-node span{font-size:10px;color:#b9c1da}.rp110-node.allowed{border-color:rgba(98,217,155,.24)}.rp110-node.allowed:before{content:"";position:absolute;right:12px;top:12px;width:7px;height:7px;background:#62d99b;border-radius:50%}.rp110-node.blocked{opacity:.68}.rp110-node.blocked:before{content:"";position:absolute;right:12px;top:12px;width:7px;height:7px;background:#ff7a8b;border-radius:50%}.rp110-node.n1{left:7%;top:14%}.rp110-node.n2{right:7%;top:16%}.rp110-node.n3{right:10%;bottom:12%}.rp110-node.n4{left:7%;bottom:14%}.rp110-node.n5{left:50%;top:7%;transform:translateX(-50%)}.rp110-node.n5:hover{transform:translateX(-50%) translateY(-5px) scale(1.02)}.rp110-map-foot{padding:18px 6px 7px}.rp110-map-foot b{font-size:12px;color:#eef0f8} .pa110-page{background:#fff}.pa110-section{background:#fff}.pa110-section:nth-of-type(odd){background:#f7f8fb}.pa110-overview-grid,.pa110-trends-grid,.pa110-compare-grid,.pa110-human-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(44px,7vw,110px);align-items:center}.pa110-chip-row{display:flex;flex-wrap:wrap;gap:9px;margin-top:25px}.pa110-chip-row span{padding:9px 12px;border-radius:999px;background:#eef0ff;color:#5148d8;font-size:11px;font-weight:800}.pa110-dashboard{background:#111522;border:1px solid rgba(255,255,255,.08);border-radius:28px;padding:22px;color:#fff;box-shadow:0 30px 80px rgba(20,24,50,.16);transition:.45s}.pa110-dashboard:hover{transform:translateY(-8px)}.pa110-db-top,.pa110-db-foot{display:flex;justify-content:space-between;align-items:center}.pa110-db-top span{font-size:11px;color:#aab2ca;background:#1d2334;padding:8px 10px;border-radius:10px}.pa110-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.pa110-kpis article{background:#1a2030;padding:15px;border-radius:15px;position:relative}.pa110-kpis small,.pa110-kpis strong{display:block}.pa110-kpis small{font-size:9px;color:#919bb8;text-transform:uppercase;letter-spacing:.08em}.pa110-kpis strong{margin-top:6px;font-size:14px}.pa110-kpis i{position:absolute;right:12px;bottom:12px;font-style:normal;color:#b7c0d9}.pa110-kpis i.up{color:#62d99b}.pa110-kpis i.down{color:#ff9a77}.pa110-chart{height:220px;background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(255,255,255,0));border-radius:18px;display:flex;gap:12px;align-items:end;padding:25px;position:relative;overflow:hidden}.pa110-chart:before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:100% 44px}.pa110-chart>span{flex:1;height:var(--h);background:linear-gradient(180deg,#7d76ff,#5e56e9);border-radius:8px 8px 3px 3px;position:relative;z-index:2;transform-origin:bottom;animation:pa110Bars 1.2s cubic-bezier(.2,.8,.2,1) both}.pa110-chart i{position:absolute;left:18px;right:18px;bottom:72px;height:2px;background:linear-gradient(90deg,#62d99b,transparent);transform:rotate(-4deg);z-index:3}.pa110-db-foot{justify-content:flex-start;gap:18px;margin-top:14px}.pa110-db-foot span{display:flex;align-items:center;gap:6px;font-size:10px;color:#aab2ca}.pa110-db-foot i{width:7px;height:7px;border-radius:50%;background:#6f67ff}.pa110-db-foot span:nth-child(2) i{background:#a6aec7}.pa110-db-foot span:nth-child(3) i{background:#ff9a77} .pa110-photo{margin:0;position:relative;border-radius:28px;overflow:hidden;box-shadow:0 24px 70px rgba(25,30,55,.12)}.pa110-photo img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}.pa110-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;background:rgba(13,17,32,.82);backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:18px;color:#fff;padding:16px}.pa110-photo figcaption span,.pa110-photo figcaption b{display:block}.pa110-photo figcaption span{font-size:9px;text-transform:uppercase;letter-spacing:.13em;color:#b8c0dc}.pa110-photo figcaption b{margin-top:5px}.pa110-trend-list{display:grid;gap:12px;margin-top:28px}.pa110-trend-list article{display:flex;gap:14px;border-top:1px solid rgba(19,23,34,.09);padding-top:14px}.pa110-trend-list>article>span{font-size:11px;font-weight:900;color:#635bff}.pa110-trend-list b,.pa110-trend-list small{display:block}.pa110-trend-list small{color:var(--muted);margin-top:3px;line-height:1.45} .pa110-section-head,.pa110-modes-head{display:grid;grid-template-columns:1fr .75fr;gap:60px;align-items:end;margin-bottom:38px}.pa110-bento{display:grid;grid-template-columns:1.2fr .8fr .8fr;grid-template-rows:auto auto;gap:18px}.pa110-bento article{background:#fff;border:1px solid rgba(19,23,34,.08);border-radius:25px;padding:28px;min-height:260px;display:flex;flex-direction:column;transition:.4s}.pa110-bento article:hover{transform:translateY(-8px);box-shadow:0 25px 60px rgba(26,31,53,.1);border-color:rgba(99,91,255,.24)}.pa110-bento-main{grid-row:span 2;min-height:540px!important;background:linear-gradient(145deg,#665fff,#4e46d8)!important;color:#fff}.pa110-bento article.dark{background:#111522;color:#fff}.pa110-bento article.wide{grid-column:span 2;min-height:240px;display:grid;grid-template-columns:auto 1fr auto;gap:22px;align-items:center}.pa110-bento article>small,.pa110-bento article div>small{font-size:10px;text-transform:uppercase;letter-spacing:.12em;font-weight:800;color:#757b8d}.pa110-bento-main>small,.pa110-bento .dark>small{color:rgba(255,255,255,.65)!important}.pa110-bento h3{font-size:clamp(22px,2vw,30px);line-height:1.15;margin:10px 0}.pa110-bento-main p,.pa110-bento .dark p{color:rgba(255,255,255,.72)}.pa110-icon{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:#eef0ff;color:#635bff;margin-bottom:34px}.pa110-bento-main .pa110-icon,.pa110-bento .dark .pa110-icon{background:rgba(255,255,255,.1);color:#fff}.pa110-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8}.pa110-mini-line{margin-top:auto;height:120px;position:relative;background:linear-gradient(rgba(255,255,255,.07) 1px,transparent 1px);background-size:100% 30px;border-radius:15px;overflow:hidden}.pa110-mini-line i{position:absolute;left:-5%;right:-5%;bottom:35px;height:3px;background:#9ff0c6;transform:rotate(-8deg);box-shadow:120px -25px 0 -1px rgba(159,240,198,.45),240px -10px 0 -1px rgba(159,240,198,.3)} .pa110-compare-board{background:#f7f8fb;border:1px solid rgba(19,23,34,.08);border-radius:28px;padding:22px}.pa110-compare-head{display:flex;justify-content:space-between;padding-bottom:18px;border-bottom:1px solid rgba(19,23,34,.08)}.pa110-compare-head span{color:var(--muted);font-size:11px}.pa110-compare-board>article{display:grid;grid-template-columns:120px 1fr 68px;gap:14px;align-items:center;padding:17px 0;border-bottom:1px solid rgba(19,23,34,.07)}.pa110-compare-board b,.pa110-compare-board small{display:block}.pa110-compare-board small{color:var(--muted);font-size:10px}.pa110-bar{height:8px;background:#e5e7ef;border-radius:999px;overflow:hidden}.pa110-bar i{display:block;height:100%;background:linear-gradient(90deg,#6c64ff,#8d87ff);border-radius:inherit;transform-origin:left;animation:pa110Grow 1.3s both}.pa110-compare-board strong{font-size:11px;text-align:right}.pa110-compare-note{margin-top:18px;padding:14px 15px;border-radius:16px;background:#fff;border:1px solid rgba(19,23,34,.06)}.pa110-compare-note span{display:flex;gap:8px;align-items:center;font-size:11px;font-weight:800}.pa110-compare-note i{width:7px;height:7px;background:#62d99b;border-radius:50%}.pa110-compare-note small{margin-top:5px;line-height:1.45} .pa110-flow{background:#111522!important;color:#fff}.pa110-flow .eyebrow,.pa110-flow p{color:#aeb8d7}.pa110-flow-head{max-width:820px;text-align:center;margin:0 auto 46px}.pa110-flow-track{display:grid;grid-template-columns:1fr 50px 1fr 50px 1fr 50px 1fr;align-items:center}.pa110-flow-track article{background:#181f31;border:1px solid rgba(255,255,255,.08);border-radius:22px;padding:25px;min-height:190px;transition:.4s}.pa110-flow-track article:hover{transform:translateY(-7px);border-color:rgba(124,116,255,.5)}.pa110-flow-track article span{width:36px;height:36px;border-radius:12px;background:#665fff;display:grid;place-items:center;font-size:11px;font-weight:900;margin-bottom:24px}.pa110-flow-track b,.pa110-flow-track small{display:block}.pa110-flow-track small{color:#9ca7c4;line-height:1.5;margin-top:6px}.pa110-flow-track>i{height:1px;background:linear-gradient(90deg,#665fff,rgba(102,95,255,.1));position:relative;overflow:visible}.pa110-flow-track>i:after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:#817aff;top:-3.5px;left:0;animation:pa110Flow 2.3s linear infinite} .pa110-human-card{position:relative;border-radius:28px;overflow:hidden;min-height:520px}.pa110-human-card img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block}.pa110-human-overlay{position:absolute;left:20px;right:20px;bottom:20px;padding:18px;background:rgba(13,17,32,.82);color:#fff;backdrop-filter:blur(16px);border:1px solid rgba(255,255,255,.1);border-radius:18px}.pa110-human-overlay small,.pa110-human-overlay b{display:block}.pa110-human-overlay small{text-transform:uppercase;letter-spacing:.12em;color:#bbc3dc;font-size:9px}.pa110-human-overlay b{margin-top:5px}.pa110-human-links{display:grid;gap:8px;margin-top:26px}.pa110-human-links a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(19,23,34,.09);font-weight:750;color:inherit}.pa110-human-links a span{transition:.3s}.pa110-human-links a:hover span{transform:translateX(5px)} [data-pa110-reveal],[data-ss110-reveal],[data-rp110-reveal]{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1)}[data-pa110-reveal].is-visible,[data-ss110-reveal].is-visible,[data-rp110-reveal].is-visible{opacity:1;transform:none} @keyframes pa110Bars{from{transform:scaleY(.15);opacity:.3}}@keyframes pa110Grow{from{transform:scaleX(.1)}}@keyframes pa110Flow{to{left:100%}} @media(max-width:990px){.ss110-expand-grid,.rp110-boundary-grid,.pa110-overview-grid,.pa110-trends-grid,.pa110-compare-grid,.pa110-human-grid{grid-template-columns:1fr}.ss110-modes-head,.pa110-section-head{grid-template-columns:1fr;gap:18px}.ss110-mode-grid{grid-template-columns:1fr 1fr}.ss110-mode-featured{grid-column:1/-1}.pa110-bento{grid-template-columns:1fr 1fr}.pa110-bento-main{grid-row:auto;grid-column:1/-1;min-height:420px!important}.pa110-bento article.wide{grid-column:1/-1}.pa110-flow-track{grid-template-columns:1fr;gap:12px}.pa110-flow-track>i{width:1px;height:25px;margin:auto;background:linear-gradient(#665fff,rgba(102,95,255,.1))}.pa110-flow-track>i:after{left:-3.5px;top:0;animation:pa110FlowY 2.3s linear infinite}.ss110-float-a{left:10px}.ss110-float-b{right:10px}} @keyframes pa110FlowY{to{top:100%}} @media(max-width:680px){.ss110-expand-section,.ss110-modes-section,.rp110-boundary-section,.pa110-section{padding:68px 0}.ss110-expand-visual{min-height:440px}.ss110-orbit.one{width:340px;height:340px}.ss110-orbit.two{width:410px;height:410px}.ss110-float-card{display:none}.ss110-screen-frame{border-radius:20px;transform:none}.ss110-mode-grid,.pa110-bento{grid-template-columns:1fr}.ss110-mode-featured{grid-column:auto}.ss110-mode-card{min-height:340px;padding:24px}.rp110-map-stage{height:430px}.rp110-node{width:118px;padding:10px}.rp110-node.n1{left:3%;top:15%}.rp110-node.n2{right:3%;top:17%}.rp110-node.n3{right:5%;bottom:12%}.rp110-node.n4{left:3%;bottom:14%}.rp110-node.n5{top:4%}.pa110-kpis{grid-template-columns:1fr}.pa110-chart{height:180px;padding:18px;gap:8px}.pa110-bento article.wide{grid-template-columns:1fr}.pa110-compare-board>article{grid-template-columns:90px 1fr}.pa110-compare-board>article strong{grid-column:2;text-align:left}.pa110-human-card,.pa110-human-card img{min-height:410px}} @media(prefers-reduced-motion:reduce){.ss110-orbit.two,.ss110-float-card,.ss110-expand-visual:before,.pa110-chart>span,.pa110-bar i,.pa110-flow-track>i:after{animation:none!important}[data-pa110-reveal],[data-ss110-reveal],[data-rp110-reveal]{opacity:1!important;transform:none!important;transition:none!important}} /* v111 refinement: global title consistency + screen/roles/productivity polish */ body:not(.home) .ss110-expand-section h2, body:not(.home) .ss110-modes-section h2, body:not(.home) .rp110-boundary-section h2, body:not(.home) .pa110-section h2{ font-size:var(--inner-section-title-size)!important; line-height:var(--inner-section-title-line)!important; letter-spacing:var(--inner-section-title-track)!important; margin:14px 0 0!important; text-wrap:balance; } body:not(.home) .ss110-expand-section h3, body:not(.home) .ss110-modes-section h3, body:not(.home) .rp110-boundary-section h3, body:not(.home) .pa110-section h3{ font-size:var(--inner-card-title-size)!important; line-height:1.32!important; letter-spacing:-.01em!important; } body:not(.home) .ss110-expand-section h2 .title-line, body:not(.home) .ss110-modes-section h2 .title-line, body:not(.home) .rp110-boundary-section h2 .title-line, body:not(.home) .pa110-section h2 .title-line{ display:block; } .ss110-expand-section{background:linear-gradient(180deg,#fff 0%,#f6f8ff 100%)} .ss111-focus-layout{min-height:590px;position:relative;display:grid;place-items:center;isolation:isolate} .ss111-glow{position:absolute;border-radius:50%;filter:blur(10px);z-index:-2;opacity:.85} .ss111-glow-a{width:420px;height:420px;background:radial-gradient(circle,rgba(99,91,255,.17),rgba(99,91,255,0) 68%);top:50%;left:44%;transform:translate(-50%,-50%)} .ss111-glow-b{width:220px;height:220px;background:radial-gradient(circle,rgba(98,217,155,.14),rgba(98,217,155,0) 70%);right:10%;top:18%} .ss111-window-card{position:relative;width:min(100%,690px);padding:16px;background:linear-gradient(180deg,#101526,#0d1120);border:1px solid rgba(255,255,255,.09);border-radius:30px;box-shadow:0 34px 90px rgba(20,24,50,.2)} .ss111-window-head{display:grid;grid-template-columns:1fr auto auto;gap:14px;align-items:center;color:#fff;padding:6px 6px 16px;font-size:12px} .ss111-window-head span{display:flex;align-items:center;gap:8px;color:#cfd5eb} .ss111-window-head span i{width:8px;height:8px;border-radius:50%;background:#62d99b;box-shadow:0 0 0 6px rgba(98,217,155,.12)} .ss111-window-head small{color:#98a1bd} .ss111-window-body{display:grid;grid-template-columns:minmax(0,1fr) 172px;gap:14px;align-items:stretch} .ss111-stage-main{background:#13192c;border:1px solid rgba(255,255,255,.06);border-radius:22px;padding:10px;min-height:390px;display:flex} .ss111-stage-main img{display:block;width:100%;height:auto;border-radius:16px;object-fit:cover} .ss111-meeting-rail{display:grid;grid-template-rows:1fr auto 1fr 1fr;gap:12px} .ss111-meeting-rail article{padding:14px 14px 15px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:18px;display:flex;flex-direction:column;justify-content:space-between;transition:.35s} .ss111-meeting-rail article:hover{transform:translateY(-4px);border-color:rgba(124,116,255,.32)} .ss111-meeting-rail small,.ss111-meeting-rail b,.ss111-meeting-rail span{display:block} .ss111-meeting-rail small{text-transform:uppercase;letter-spacing:.12em;font-size:9px;color:#8f99b8} .ss111-meeting-rail b{font-size:14px;color:#fff;margin:5px 0 8px} .ss111-meeting-rail span{font-size:11px;line-height:1.5;color:#b7c0d9} .ss111-avatar-stack{display:flex;align-items:center;justify-content:center;gap:0;padding:6px 0} .ss111-avatar-stack span{width:38px;height:38px;margin-left:-8px;border-radius:14px;border:2px solid #101526;display:grid;place-items:center;font-size:10px;font-weight:800;color:#fff;box-shadow:0 10px 24px rgba(0,0,0,.18)} .ss111-avatar-stack span:first-child{margin-left:0;background:#ff9752} .ss111-avatar-stack span:nth-child(2){background:#635bff} .ss111-avatar-stack span:nth-child(3){background:#4ab985} .ss111-avatar-stack span:nth-child(4){background:#1f9bd0} .ss111-window-foot{display:flex;flex-wrap:wrap;gap:10px;padding:14px 4px 2px} .ss111-window-foot span,.ss111-tag{font-size:11px;font-weight:700;color:#d8dded;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.09);padding:8px 11px;border-radius:999px} .ss111-tag{position:absolute;background:rgba(255,255,255,.94);color:#252b39;border:1px solid rgba(99,91,255,.12);box-shadow:0 16px 40px rgba(30,35,70,.12)} .ss111-tag-a{left:-12px;top:92px} .ss111-tag-b{right:-8px;bottom:72px} .rp110-map-stage{background:radial-gradient(circle at center,rgba(99,91,255,.22),transparent 42%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:auto,34px 34px,34px 34px} .rp110-ring{position:absolute;border:1px solid rgba(151,145,255,.2);border-radius:50%} .rp110-ring.r1{width:270px;height:270px;animation:rp110OrbitOne 18s linear infinite} .rp110-ring.r2{width:410px;height:410px;animation:rp110OrbitTwo 29s linear infinite} .rp110-dot{position:absolute;width:10px;height:10px;border-radius:50%;box-shadow:0 0 0 6px rgba(99,91,255,.08)} .rp110-ring.r1 .rp110-dot.d1{top:-5px;left:50%;transform:translateX(-50%);background:#62d99b} .rp110-ring.r1 .rp110-dot.d2{right:24px;bottom:20px;background:#8f89ff} .rp110-ring.r2 .rp110-dot.d1{top:28px;right:80px;background:#8f89ff} .rp110-ring.r2 .rp110-dot.d2{left:-5px;top:52%;transform:translateY(-50%);background:#62d99b} .rp110-ring.r2 .rp110-dot.d3{right:36px;bottom:34px;background:#ff7a8b;box-shadow:0 0 0 6px rgba(255,122,139,.08)} .rp110-node{width:148px;padding:14px 15px;background:rgba(28,34,52,.88);backdrop-filter:blur(14px)} .rp110-node.n1{left:2%;top:14%} .rp110-node.n2{right:2%;top:16%} .rp110-node.n3{right:4%;bottom:12%} .rp110-node.n4{left:2%;bottom:14%} .rp110-node.n5{left:50%;top:6%;transform:translateX(-50%)} .rp110-node.n5:hover{transform:translateX(-50%) translateY(-5px) scale(1.02)} @keyframes rp110OrbitOne{to{transform:rotate(360deg)}} @keyframes rp110OrbitTwo{to{transform:rotate(-360deg)}} .pa110-section-head h2,.pa110-overview-copy h2,.pa110-trends-copy h2,.pa110-compare-copy h2,.pa110-flow-head h2,.pa110-human-copy h2{max-width:640px} .pa110-bento h3,.ss110-mode-card h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important} .pa110-dashboard b,.pa110-compare-head b{font-size:15px} .pa110-human-overlay b,.pa110-photo figcaption b{font-size:18px;line-height:1.3} @media(max-width:990px){ .ss111-focus-layout{min-height:auto} .ss111-window-body{grid-template-columns:1fr} .ss111-meeting-rail{grid-template-columns:repeat(3,1fr);grid-template-rows:auto auto} .ss111-avatar-stack{grid-column:1/-1;padding:2px 0 4px} .ss111-tag-a{left:10px;top:18px} .ss111-tag-b{right:10px;bottom:18px} } @media(max-width:680px){ .ss111-window-card{padding:14px;border-radius:24px} .ss111-window-head{grid-template-columns:1fr;gap:6px} .ss111-stage-main{min-height:260px} .ss111-meeting-rail{grid-template-columns:1fr;grid-template-rows:none} .ss111-tag{display:none} .rp110-node{width:120px;padding:11px} .rp110-node.n1{left:3%;top:15%} .rp110-node.n2{right:3%;top:17%} .rp110-node.n3{right:4%;bottom:12%} .rp110-node.n4{left:3%;bottom:14%} .rp110-node.n5{top:4%} } @media(prefers-reduced-motion:reduce){ .ss111-glow,.rp110-ring,.rp110-dot{animation:none!important} } /* v112 requested refinements: distinct screen-share expansion + Worklix productivity palette */ body:not(.home) .ss112-expand-section h2{ font-size:var(--inner-section-title-size)!important; line-height:var(--inner-section-title-line)!important; letter-spacing:var(--inner-section-title-track)!important; margin:14px 0 0!important; text-wrap:balance; } .ss112-expand-section{padding:clamp(78px,8vw,128px) 0;background:#fff8ec;position:relative;overflow:hidden} .ss112-expand-head{max-width:860px;text-align:center;margin:0 auto 42px} .ss112-expand-head .eyebrow{margin-inline:auto} .ss112-expand-head p{max-width:720px;margin:18px auto 0;color:var(--muted);font-size:16px;line-height:1.72} .ss112-expand-stage{background:#20252d;border:1px solid #303641;border-radius:32px;padding:18px;color:#fff;box-shadow:0 30px 72px rgba(22,28,36,.14);position:relative} .ss112-stage-bar{min-height:62px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;padding:0 6px 14px} .ss112-stage-bar>div{display:flex;align-items:center;gap:9px}.ss112-stage-bar>div:first-child small{color:#aeb7c2;margin-left:5px}.ss112-live-dot{width:9px;height:9px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.11)} .ss112-people{justify-content:center}.ss112-people>span{width:32px;height:32px;margin-left:-5px;border-radius:10px;display:grid;place-items:center;background:#303640;border:1px solid #454c57;font-size:8px;font-weight:900}.ss112-people>span:first-child{margin-left:0}.ss112-people small{color:#aeb7c2;margin-left:6px} .ss112-controls{justify-content:flex-end}.ss112-controls span{padding:7px 10px;border-radius:999px;background:#2b313b;border:1px solid #3a424e;font-size:10px;color:#d7dce3}.ss112-controls span:last-child{background:#fff2d1;color:#8f5900;border-color:#f3ca68} .ss112-stage-screen{position:relative;overflow:hidden;border-radius:24px;background:#fff;min-height:520px}.ss112-stage-screen img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block}.ss112-screen-label{position:absolute;left:20px;bottom:20px;max-width:310px;padding:14px 16px;border-radius:16px;background:rgba(32,37,45,.9);backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.13)}.ss112-screen-label span,.ss112-screen-label b{display:block}.ss112-screen-label span{font-size:9px;color:#f2be4b;text-transform:uppercase;letter-spacing:.1em}.ss112-screen-label b{font-size:14px;margin-top:4px} .ss112-stage-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;padding-top:16px}.ss112-stage-notes article{display:grid;grid-template-columns:38px 1fr;gap:12px;padding:14px;border-radius:18px;background:#282e37;border:1px solid #363e49;transition:.3s}.ss112-stage-notes article:hover{transform:translateY(-4px);border-color:#e2aa31}.ss112-stage-notes article>span{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:linear-gradient(135deg,#ffd45a,#ff914d);color:#292b30;font-size:10px;font-weight:900}.ss112-stage-notes b,.ss112-stage-notes small{display:block}.ss112-stage-notes b{font-size:13px}.ss112-stage-notes small{margin-top:4px;color:#adb6c2;font-size:10px;line-height:1.45} .ss109-human-points{display:grid;gap:9px;margin-top:18px}.ss109-human-points span{position:relative;padding-left:22px;color:#4f5864;font-size:13px;line-height:1.5}.ss109-human-points span:before{content:"✓";position:absolute;left:0;top:0;color:#d98700;font-weight:900} /* Restore the v110 "Show only what helps" card typography/design */ .ss110-mode-card h3{font-size:clamp(22px,2vw,30px)!important;line-height:1.14!important;margin:10px 0 12px!important;letter-spacing:normal!important} .ss110-mode-featured{background:linear-gradient(145deg,#665fff,#4d44dd)!important;color:#fff} .ss110-mode-card.dark{background:#111522!important;color:#fff} /* Productivity Analytics: use the Worklix brand palette instead of purple */ .pa110-page .pa110-chip-row span{background:#fff4d7!important;color:#9b6700!important} .pa110-page .pa110-dashboard{background:#20252d!important;border-color:#303641!important;box-shadow:0 30px 80px rgba(22,28,36,.16)!important} .pa110-page .pa110-db-top span{background:#2b313b!important;color:#c7cdd5!important} .pa110-page .pa110-kpis article{background:#282e37!important} .pa110-page .pa110-kpis small{color:#aeb7c2!important} .pa110-page .pa110-chart{background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,0))!important} .pa110-page .pa110-chart>span{background:linear-gradient(180deg,#ffd45a,#ff914d 55%,#ff6f59)!important} .pa110-page .pa110-chart i{background:linear-gradient(90deg,#53d587,rgba(83,213,135,0))!important} .pa110-page .pa110-db-foot i{background:#ffb51f!important}.pa110-page .pa110-db-foot span:nth-child(2) i{background:#aeb7c2!important}.pa110-page .pa110-db-foot span:nth-child(3) i{background:#ff6f59!important} .pa110-page .pa110-trend-list>article>span{color:#d98700!important} .pa110-page .pa110-bento article:hover{border-color:rgba(255,177,52,.38)!important;box-shadow:0 25px 60px rgba(22,28,36,.1)!important} .pa110-page .pa110-bento-main{background:linear-gradient(145deg,#ffd45a 0%,#ff914d 58%,#ff6f59 100%)!important;color:#252a33!important} .pa110-page .pa110-bento-main p{color:#4f5864!important}.pa110-page .pa110-bento-main>small{color:#7b5200!important}.pa110-page .pa110-bento-main .pa110-icon{background:rgba(255,255,255,.55)!important;color:#9b6700!important} .pa110-page .pa110-icon{background:#fff4d7!important;color:#d98700!important} .pa110-page .pa110-mini-line{background:linear-gradient(rgba(37,42,51,.08) 1px,transparent 1px)!important;background-size:100% 30px!important}.pa110-page .pa110-mini-line i{background:#53d587!important;box-shadow:120px -25px 0 -1px rgba(83,213,135,.45),240px -10px 0 -1px rgba(83,213,135,.3)!important} .pa110-page .pa110-bar i{background:linear-gradient(90deg,#ffb51f,#ff914d,#ff6f59)!important} .pa110-page .pa110-compare-note i{background:#53d587!important} .pa110-page .pa110-flow{background:#20252d!important}.pa110-page .pa110-flow .eyebrow,.pa110-page .pa110-flow p{color:#b8c0ca!important}.pa110-page .pa110-flow-track article{background:#282e37!important;border-color:#363e49!important}.pa110-page .pa110-flow-track article:hover{border-color:rgba(255,177,52,.55)!important}.pa110-page .pa110-flow-track article span{background:linear-gradient(135deg,#ffd45a,#ff914d)!important;color:#252a33!important}.pa110-page .pa110-flow-track small{color:#b8c0ca!important}.pa110-page .pa110-flow-track>i{background:linear-gradient(90deg,#ffb51f,rgba(255,181,31,.12))!important}.pa110-page .pa110-flow-track>i:after{background:#ff914d!important} .pa110-page .pa110-human-links a:hover{color:#d98700} /* Equal-height productivity trend columns */ .pa110-page .pa110-trends-grid{align-items:stretch!important} .pa110-page .pa110-trends-copy{height:100%;display:flex;flex-direction:column;justify-content:center} .pa110-page .pa110-photo{height:100%;min-height:520px} .pa110-page .pa110-photo img{height:100%;min-height:520px;aspect-ratio:auto!important;object-fit:cover} /* Center this title exactly as requested */ .pa110-page .pa110-flow-head h2{margin-left:auto!important;margin-right:auto!important;text-align:center!important;max-width:760px!important} @media(max-width:990px){ .ss112-stage-bar{grid-template-columns:1fr auto}.ss112-controls{grid-column:1/-1;justify-content:flex-start}.ss112-stage-notes{grid-template-columns:1fr} .pa110-page .pa110-photo{min-height:430px}.pa110-page .pa110-photo img{min-height:430px} } @media(max-width:680px){ .ss112-expand-section{padding:68px 0}.ss112-expand-head{text-align:left;margin-bottom:28px}.ss112-expand-head .eyebrow{margin-inline:0}.ss112-expand-head p{margin-left:0}.ss112-expand-stage{padding:12px;border-radius:24px}.ss112-stage-bar{grid-template-columns:1fr}.ss112-people{justify-content:flex-start}.ss112-controls{display:none}.ss112-stage-screen,.ss112-stage-screen img{min-height:340px}.ss112-screen-label{left:12px;right:12px;bottom:12px;max-width:none} } @media(prefers-reduced-motion:reduce){.ss112-stage-notes article{transition:none!important}} /* v113 targeted fixes + Work Schedules main page */ .ss110-mode-featured{background:linear-gradient(135deg,var(--accent-3) 0%,var(--accent) 52%,var(--accent-2) 100%)!important;color:#252a33!important;box-shadow:0 18px 44px rgba(255,106,55,.18)!important} .ss110-mode-featured small,.ss110-mode-featured p{color:rgba(37,42,51,.84)!important} .ss110-mode-featured .ss110-mode-no,.ss110-mode-featured .ss110-mode-icon{background:rgba(255,255,255,.52)!important;color:#8f5900!important} .ss110-mode-featured .ss110-card-foot{border-top:1px solid rgba(37,42,51,.12)!important} .ss110-mode-featured .ss110-card-foot span,.ss110-mode-featured .ss110-card-foot i{color:#252a33!important} .ss110-mode-card p{opacity:1!important;visibility:visible!important} .pa110-page .pa110-bento-main{display:flex;flex-direction:column;justify-content:flex-start} .pa110-page .pa110-main-points{display:grid;gap:8px;margin-top:14px} .pa110-page .pa110-main-points span{position:relative;padding-left:22px;font-size:13px;line-height:1.55;color:#4f5864} .pa110-page .pa110-main-points span:before{content:"✓";position:absolute;left:0;top:0;color:#9b6700;font-weight:900} .pa110-page .pa110-main-points+.pa110-mini-line{margin-top:auto} .pa110-page .pa110-compare-board .pa110-bar{background:rgba(255,181,31,.16)!important;overflow:hidden} .pa110-page .pa110-compare-board .pa110-bar i{width:var(--target)!important;transform-origin:left center;transform:scaleX(0);transition:transform 1.3s cubic-bezier(.2,.75,.2,1)} .pa110-page .pa110-compare.is-visible .pa110-bar i{transform:scaleX(1)} .pa110-page .pa110-flow-head{text-align:center!important} .rp110-boundary-section .rp110-permission-map{background:#20252d!important;border-color:#303641!important;box-shadow:0 28px 72px rgba(22,28,36,.16)!important} .rp110-boundary-section .rp110-map-stage{background:radial-gradient(circle at center,rgba(255,181,31,.16),transparent 42%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px)!important;background-size:auto,34px 34px,34px 34px!important} .rp110-boundary-section .rp110-map-center{background:linear-gradient(135deg,var(--accent-3),var(--accent),var(--accent-2))!important;color:#252a33!important;box-shadow:0 0 0 16px rgba(255,181,31,.10)!important} .rp110-boundary-section .rp110-map-center span{background:rgba(255,255,255,.4)!important;color:#8f5900!important} .rp110-boundary-section .rp110-map-center small{color:rgba(37,42,51,.78)!important} .rp110-boundary-section .rp110-ring{border-color:rgba(255,181,31,.22)!important} .rp110-boundary-section .rp110-ring.r1 .rp110-dot.d1,.rp110-boundary-section .rp110-ring.r2 .rp110-dot.d2{background:#53d587!important} .rp110-boundary-section .rp110-ring.r1 .rp110-dot.d2,.rp110-boundary-section .rp110-ring.r2 .rp110-dot.d1{background:#ffb51f!important;box-shadow:0 0 0 6px rgba(255,181,31,.10)!important} .rp110-boundary-section .rp110-ring.r2 .rp110-dot.d3{background:#ff6a37!important;box-shadow:0 0 0 6px rgba(255,106,55,.10)!important} .rp110-boundary-section .rp110-node.allowed{border-color:rgba(255,181,31,.18)!important} .rp110-boundary-section .rp110-node.allowed:before{background:#53d587!important} .rp110-boundary-section .rp110-map-head span i,.rp110-boundary-section .rp110-map-foot span i{background:#53d587!important} body:not(.home) .ws113-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance} body:not(.home) .ws113-page h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .ws113-page [data-ws113-reveal]{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1)} .ws113-page [data-ws113-reveal].is-visible{opacity:1;transform:none} .ws113-section{padding:var(--global-section-space) 0} .ws113-overview-grid,.ws113-visual-grid,.ws113-exceptions-grid,.ws113-compare-grid,.ws113-human-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,48px);align-items:center} .ws113-overview-copy p,.ws113-visual-copy p,.ws113-exceptions-copy p,.ws113-compare-copy p,.ws113-human-copy p,.ws113-system-head p,.ws113-flow-head p{color:var(--muted);font-size:17px;line-height:1.62} .ws113-chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.ws113-chip-row span{padding:9px 14px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800;border:1px solid rgba(255,181,31,.25)} .ws113-schedule-board{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;box-shadow:0 30px 80px rgba(22,28,36,.16);color:#fff} .ws113-board-head,.ws113-compare-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.ws113-board-head span,.ws113-compare-head span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px} .ws113-week-grid{margin-top:18px;display:grid;gap:12px}.ws113-week-grid .day{position:relative;padding-left:56px;min-height:44px;display:flex;align-items:center;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:16px;overflow:hidden}.ws113-week-grid small{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:12px;color:#d8dce8;font-weight:700}.ws113-week-grid .day span{position:absolute;left:var(--s);right:calc(100% - var(--e));height:20px;border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));box-shadow:0 10px 20px rgba(255,106,55,.22)} .ws113-board-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.ws113-board-foot article{padding:14px 14px 15px;border-radius:18px;background:#282e37;border:1px solid #363e49}.ws113-board-foot small,.ws113-board-foot b{display:block}.ws113-board-foot small{font-size:11px;color:#aeb7c2}.ws113-board-foot b{margin-top:4px;font-size:14px} .ws113-system{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)} .ws113-system-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.ws113-system-card{padding:26px;border-radius:26px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 45px rgba(22,28,36,.06);min-height:260px;transition:transform .32s ease,border-color .32s ease,box-shadow .32s ease}.ws113-system-card:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.32);box-shadow:0 26px 65px rgba(22,28,36,.09)}.ws113-system-card small{display:block;color:#7b5200;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin:12px 0 8px}.ws113-card-icon{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:900}.ws113-system-card p{color:#4f5864;font-size:14px;line-height:1.65}.ws113-system-card.featured{background:linear-gradient(135deg,var(--accent-3),var(--accent),var(--accent-2));color:#252a33}.ws113-system-card.featured p,.ws113-system-card.featured small{color:rgba(37,42,51,.8)}.ws113-system-card.featured .ws113-card-icon{background:rgba(255,255,255,.48)} .ws113-photo-card,.ws113-human-card{margin:0;position:relative;border-radius:30px;overflow:hidden;box-shadow:0 24px 70px rgba(25,30,55,.12)}.ws113-photo-card img,.ws113-human-card img{display:block;width:100%;height:100%;min-height:520px;object-fit:cover}.ws113-photo-card figcaption,.ws113-human-card figcaption{position:absolute;left:18px;right:18px;bottom:18px;background:rgba(13,17,32,.84);backdrop-filter:blur(12px);padding:16px 18px;border-radius:18px;color:#fff}.ws113-photo-card figcaption span,.ws113-human-card figcaption small{display:block;color:#ffcf68;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.ws113-photo-card figcaption b,.ws113-human-card figcaption b{font-size:18px;line-height:1.3} .ws113-inline-list{display:grid;gap:14px;margin-top:24px}.ws113-inline-list article{display:grid;grid-template-columns:140px 1fr;gap:16px;padding:16px 0;border-top:1px solid rgba(37,42,51,.10)}.ws113-inline-list b{font-size:15px}.ws113-inline-list small{font-size:14px;color:#4f5864;line-height:1.6} .ws113-exceptions{background:#20252d;color:#fff}.ws113-exceptions .eyebrow{background:#282e37;border-color:#363e49;color:#d8dde7}.ws113-exceptions p{color:#b8c0ca}.ws113-exception-stack{display:grid;gap:14px}.ws113-exception-stack article{padding:22px;border-radius:24px;background:#282e37;border:1px solid #363e49;transition:.32s}.ws113-exception-stack article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.35)}.ws113-exception-stack small{display:block;color:#ffcf68;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:8px}.ws113-exception-stack b{display:block;font-size:18px;line-height:1.3;margin-bottom:8px}.ws113-exception-stack p{margin:0;font-size:14px;line-height:1.65;color:#b8c0ca} .ws113-compare-board{padding:22px;border-radius:28px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 22px 55px rgba(25,30,55,.08)}.ws113-compare-board>article{display:grid;grid-template-columns:138px 1fr auto;gap:14px;align-items:center;padding:14px 0;border-top:1px solid rgba(37,42,51,.09)}.ws113-compare-board>article div{display:flex;flex-direction:column}.ws113-compare-board small{color:#7b828f}.ws113-bar{height:10px;border-radius:999px;background:#fff4d7;overflow:hidden}.ws113-bar i{display:block;height:100%;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform-origin:left center;transform:scaleX(0);transition:transform 1.25s cubic-bezier(.2,.75,.2,1)}.ws113-compare.is-visible .ws113-bar i{transform:scaleX(1)}.ws113-compare-note{display:flex;justify-content:space-between;align-items:center;gap:18px;padding-top:16px;border-top:1px solid rgba(37,42,51,.09);margin-top:14px}.ws113-compare-note span{display:flex;align-items:center;gap:10px;font-weight:700}.ws113-compare-note span i{width:10px;height:10px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.12)}.ws113-compare-note small{max-width:300px;line-height:1.55;color:#69707d} .ws113-flow-head{text-align:center;max-width:830px;margin:0 auto 40px}.ws113-flow-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:12px}.ws113-flow-track article{padding:24px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 46px rgba(22,28,36,.06);min-height:210px;display:flex;flex-direction:column}.ws113-flow-track article span{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33;font-weight:900;margin-bottom:18px}.ws113-flow-track article small{color:#5d6572;font-size:14px;line-height:1.6;margin-top:10px}.ws113-flow-track>i{height:2px;background:linear-gradient(90deg,var(--accent-3),rgba(255,181,31,.08));position:relative}.ws113-flow-track>i:after{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;background:var(--accent);animation:ws113Flow 2.1s linear infinite} .ws113-link-list{display:grid;gap:0;margin-top:20px}.ws113-link-list a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(19,23,34,.09);font-weight:750;color:inherit}.ws113-link-list a span{transition:.3s}.ws113-link-list a:hover{color:#d98700}.ws113-link-list a:hover span{transform:translateX(5px)} @keyframes ws113Flow{to{left:100%}} @media(max-width:990px){.ws113-overview-grid,.ws113-visual-grid,.ws113-exceptions-grid,.ws113-compare-grid,.ws113-human-grid{grid-template-columns:1fr}.ws113-system-grid{grid-template-columns:1fr 1fr}.ws113-flow-track{grid-template-columns:1fr;gap:12px}.ws113-flow-track>i{width:1px;height:24px;margin:auto;background:linear-gradient(var(--accent-3),rgba(255,181,31,.1))}.ws113-flow-track>i:after{left:-3px;top:0;transform:none;animation:ws113FlowY 2.1s linear infinite}.ws113-board-foot{grid-template-columns:1fr}.ws113-inline-list article{grid-template-columns:1fr}} @keyframes ws113FlowY{to{top:100%}} @media(max-width:680px){.ws113-system-grid{grid-template-columns:1fr}.ws113-week-grid .day{padding-left:48px}.ws113-compare-board>article{grid-template-columns:1fr}.ws113-compare-board>article strong{justify-self:start}.ws113-compare-note{flex-direction:column;align-items:flex-start}.ws113-photo-card img,.ws113-human-card img{min-height:400px}} @media(prefers-reduced-motion:reduce){.ws113-page [data-ws113-reveal]{opacity:1!important;transform:none!important;transition:none!important}.ws113-flow-track>i:after,.ws113-bar i{animation:none!important;transition:none!important}} /* v114 final targeted polish */ .pa110-page .pa110-bento-main, .pa110-page .pa110-bento article.dark{color:#fff!important;background:#20252d!important;border-color:#303641!important} .pa110-page .pa110-bento-main h3, .pa110-page .pa110-bento-main p, .pa110-page .pa110-bento-main .pa110-main-points span, .pa110-page .pa110-bento article.dark h3, .pa110-page .pa110-bento article.dark p{color:#fff!important} .pa110-page .pa110-bento-main>small, .pa110-page .pa110-bento article.dark>small{color:#ffcf68!important} .pa110-page .pa110-bento-main .pa110-icon, .pa110-page .pa110-bento article.dark .pa110-icon{background:linear-gradient(135deg,var(--accent-3),var(--accent))!important;color:#252a33!important} .pa110-page .pa110-main-points span:before{color:#ffcf68!important}.pa110-page .pa110-mini-line{background:linear-gradient(rgba(255,255,255,.08) 1px,transparent 1px)!important;background-size:100% 30px!important} .ws113-system.section-grid-bg:after{display:none!important}.ws113-system>.container{position:relative;z-index:2}.ws113-system-card{filter:none!important;backdrop-filter:none!important}.ws113-system-card *{filter:none!important} .ws114-real-dashboard{background:#20252d;border:1px solid #303641;border-radius:30px;padding:18px;color:#fff;box-shadow:0 30px 80px rgba(22,28,36,.16)} .ws114-dash-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:2px 4px 16px}.ws114-dash-top b,.ws114-dash-top small{display:block}.ws114-dash-top small{color:#aeb7c2;font-size:12px}.ws114-dash-top>span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800} .ws114-dash-body{display:grid;grid-template-columns:126px 1fr;gap:14px}.ws114-team-list{display:grid;gap:10px}.ws114-team-list span{min-height:48px;border-radius:14px;background:#282e37;border:1px solid #363e49;padding:10px;display:flex;align-items:center;gap:8px;font-size:11px;font-weight:900;color:#ffcf68}.ws114-team-list b{font-size:12px;color:#fff}.ws114-team-list .active{background:#fff4d7;color:#9b6700;border-color:#ffd45a}.ws114-team-list .active b{color:#252a33} .ws114-calendar-grid{background:#f8f9fb;color:#252a33;border-radius:22px;padding:14px;border:1px solid rgba(255,255,255,.08);overflow:hidden}.ws114-cal-head{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-bottom:12px}.ws114-cal-head span{text-align:center;font-size:11px;color:#69707d;font-weight:800}.ws114-cal-row{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;margin-top:8px}.ws114-cal-row>span{position:relative;min-height:76px;border-radius:14px;background:#fff;border:1px solid #e4e7ec;overflow:hidden}.ws114-cal-row .shift:before{content:attr(class);display:none}.ws114-cal-row .shift{font-size:0}.ws114-cal-row .shift:after{content:"";position:absolute;left:var(--start);width:var(--wide);top:18px;height:40px;border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent));box-shadow:0 8px 18px rgba(255,106,55,.18)}.ws114-cal-row .shift.alt:after{background:linear-gradient(90deg,#ff8f52,var(--accent-2))}.ws114-cal-row .shift.short:after{background:#fff0c1;border:1px solid #f2bd43}.ws114-cal-row.muted>span{min-height:54px;background:#fbfcfe}.ws114-dash-bottom{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.ws114-dash-bottom article{padding:13px 14px;border-radius:16px;background:#282e37;border:1px solid #363e49}.ws114-dash-bottom small,.ws114-dash-bottom b{display:block}.ws114-dash-bottom small{font-size:11px;color:#aeb7c2}.ws114-dash-bottom b{font-size:18px;margin-top:2px} .ws114-exceptions-section{padding:var(--global-section-space) 0;background:#20252d;color:#fff;overflow:hidden}.ws114-exceptions-head{text-align:center;max-width:850px;margin:0 auto 38px}.ws114-exceptions-head .eyebrow{background:#282e37;border-color:#363e49;color:#d8dde7}.ws114-exceptions-head p{color:#b8c0ca;font-size:17px;line-height:1.62;max-width:680px;margin:16px auto 0}.ws114-exception-layout{display:grid;grid-template-columns:1fr 1.15fr;gap:18px;align-items:stretch}.ws114-exception-main{border-radius:28px;padding:30px;background:linear-gradient(135deg,var(--accent-3),var(--accent),var(--accent-2));color:#252a33;min-height:390px;display:flex;flex-direction:column}.ws114-exception-main>span{width:46px;height:46px;border-radius:16px;background:rgba(255,255,255,.48);display:grid;place-items:center;font-weight:900}.ws114-exception-main small{display:block;margin-top:auto;text-transform:uppercase;letter-spacing:.09em;font-weight:900;color:#7b5200}.ws114-exception-main h3{margin:8px 0 10px}.ws114-exception-main p{color:rgba(37,42,51,.82);line-height:1.65}.ws114-exception-timeline{position:relative;border-radius:28px;background:#282e37;border:1px solid #363e49;padding:24px;display:grid;grid-template-columns:1fr 54px 1fr 54px 1fr;align-items:center}.ws114-exception-timeline article{padding:18px;border-radius:20px;background:#20252d;border:1px solid #363e49;min-height:150px}.ws114-exception-timeline b,.ws114-exception-timeline small{display:block}.ws114-exception-timeline small{margin-top:8px;color:#b8c0ca}.ws114-exception-timeline i{height:2px;background:linear-gradient(90deg,var(--accent-3),rgba(255,181,31,.1));position:relative}.ws114-exception-timeline i:after{content:"";position:absolute;width:8px;height:8px;border-radius:50%;background:var(--accent);top:-3px;left:0;animation:ws113Flow 2.2s linear infinite}.ws114-exception-notes{grid-column:1/-1;display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.ws114-exception-notes article{padding:18px;border-radius:20px;background:#282e37;border:1px solid #363e49}.ws114-exception-notes b,.ws114-exception-notes small{display:block}.ws114-exception-notes small{color:#b8c0ca;line-height:1.55;margin-top:5px} .ws114-compare-points{display:grid;gap:10px;margin-top:24px}.ws114-compare-points article{padding:14px 0;border-top:1px solid rgba(37,42,51,.10)}.ws114-compare-points b,.ws114-compare-points small{display:block}.ws114-compare-points small{margin-top:3px;color:#69707d;line-height:1.52}.ws113-compare-grid{align-items:stretch!important}.ws113-compare-copy{height:100%;display:flex;flex-direction:column;justify-content:center}.ws113-compare-board{height:100%;display:flex;flex-direction:column;justify-content:center} .ws114-flow-grid{position:relative;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:56px 18px}.ws114-flow-grid:before{content:"";position:absolute;left:8%;right:8%;top:105px;height:2px;background:linear-gradient(90deg,rgba(255,181,31,.14),var(--accent-3),rgba(255,106,55,.25));z-index:0}.ws114-flow-grid:after{content:"";position:absolute;left:8%;right:8%;bottom:105px;height:2px;background:linear-gradient(90deg,rgba(255,106,55,.25),var(--accent),rgba(255,181,31,.14));z-index:0}.ws114-flow-grid article{position:relative;z-index:2;padding:24px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 46px rgba(22,28,36,.06);min-height:210px;display:flex;flex-direction:column;transition:.32s}.ws114-flow-grid article:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.32)}.ws114-flow-grid article span{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33;font-weight:900;margin-bottom:18px}.ws114-flow-grid article small{color:#5d6572;font-size:14px;line-height:1.6;margin-top:10px} @media(max-width:990px){.ws114-dash-body,.ws114-exception-layout{grid-template-columns:1fr}.ws114-exception-timeline{grid-template-columns:1fr;gap:12px}.ws114-exception-timeline i{width:2px;height:26px;margin:auto}.ws114-exception-timeline i:after{left:-3px;top:0;animation:ws113FlowY 2.2s linear infinite}.ws114-exception-notes,.ws114-flow-grid{grid-template-columns:1fr}.ws114-flow-grid:before,.ws114-flow-grid:after{display:none}} @media(max-width:680px){.ws114-cal-head,.ws114-cal-row,.ws114-dash-bottom{grid-template-columns:1fr}.ws114-cal-row>span{min-height:58px}.ws114-exceptions-head{text-align:left}.ws114-exceptions-head p{margin-left:0}.ws114-exception-main{min-height:auto}.ws114-exception-notes{grid-template-columns:1fr}} @media(prefers-reduced-motion:reduce){.ws114-exception-timeline i:after{animation:none!important}.ws114-flow-grid article,.ws114-real-dashboard *{transition:none!important}} /* v115 targeted schedule fixes + Devices main page */ .ws115-schedule-studio{background:#20252d;border:1px solid #303641;border-radius:30px;padding:18px;color:#fff;box-shadow:0 30px 80px rgba(22,28,36,.16)} .ws115-studio-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:2px 4px 16px}.ws115-studio-head b,.ws115-studio-head small{display:block}.ws115-studio-head small{color:#aeb7c2;font-size:12px}.ws115-studio-head>span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800} .ws115-studio-grid{display:grid;grid-template-columns:160px 1fr;gap:14px}.ws115-studio-sidebar{display:grid;gap:10px}.ws115-studio-sidebar article{padding:14px;border-radius:16px;background:#282e37;border:1px solid #363e49}.ws115-studio-sidebar article.active{background:#fff4d7;border-color:#ffd45a}.ws115-studio-sidebar small,.ws115-studio-sidebar b,.ws115-studio-sidebar span{display:block}.ws115-studio-sidebar small{font-size:10px;color:#aeb7c2;text-transform:uppercase;letter-spacing:.08em}.ws115-studio-sidebar article.active small{color:#9b6700}.ws115-studio-sidebar b{margin:4px 0 5px;font-size:15px;color:#fff}.ws115-studio-sidebar article.active b{color:#252a33}.ws115-studio-sidebar span{font-size:11px;color:#c7cdd5}.ws115-studio-sidebar article.active span{color:#655100} .ws115-studio-main{background:#f8f9fb;border-radius:22px;padding:14px;color:#252a33}.ws115-main-top{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.ws115-main-top span{padding:8px 11px;border-radius:999px;background:#fff;border:1px solid #e5e8ef;font-size:11px;font-weight:800;color:#626b78}.ws115-main-top .live{background:#fff4d7;border-color:#f1c45a;color:#9b6700}.ws115-time-head{display:grid;grid-template-columns:110px repeat(5,1fr);gap:8px;margin-bottom:10px}.ws115-time-head span{text-align:center;font-size:11px;color:#6b7380;font-weight:800}.ws115-time-head span:first-child{text-align:left} .ws115-shift-rows{display:grid;gap:8px}.ws115-shift-rows article{display:grid;grid-template-columns:110px 1fr;gap:8px;align-items:center}.ws115-shift-rows b{font-size:12px;color:#252a33}.ws115-shift-rows div{position:relative;height:54px;border-radius:14px;background:#fff;border:1px solid #e3e7ee;overflow:hidden}.ws115-shift-rows i{position:absolute;left:var(--left);width:var(--width);top:14px;height:26px;border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent));box-shadow:0 8px 18px rgba(255,106,55,.16)}.ws115-shift-rows i.alt{background:linear-gradient(90deg,#ff8f52,var(--accent-2))} .ws115-studio-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.ws115-studio-foot article{padding:13px 14px;border-radius:16px;background:#fff;border:1px solid #e3e7ee}.ws115-studio-foot small,.ws115-studio-foot b{display:block}.ws115-studio-foot small{font-size:11px;color:#69707d}.ws115-studio-foot b{margin-top:3px;font-size:18px} .ws115-exceptions-section{padding:var(--global-section-space) 0;background:#20252d;color:#fff}.ws115-exceptions-head{text-align:center;max-width:860px;margin:0 auto 38px}.ws115-exceptions-head .eyebrow{background:#282e37;border-color:#363e49;color:#fff!important;opacity:1!important}.ws115-exceptions-head p{max-width:720px;margin:16px auto 0;color:#c9d0d9;font-size:17px;line-height:1.62} .ws115-exception-grid{display:grid;grid-template-columns:1.05fr 1fr;gap:18px;align-items:stretch}.ws115-exception-feature{padding:28px;border-radius:30px;background:linear-gradient(135deg,var(--accent-3),var(--accent),var(--accent-2));color:#252a33;display:flex;flex-direction:column;min-height:420px}.ws115-exception-feature>span{width:48px;height:48px;border-radius:16px;background:rgba(255,255,255,.48);display:grid;place-items:center;font-weight:900}.ws115-exception-feature small{display:block;text-transform:uppercase;letter-spacing:.09em;font-size:11px;font-weight:900;color:#7b5200;margin:16px 0 8px}.ws115-exception-feature p{color:rgba(37,42,51,.83)!important;line-height:1.65}.ws115-ex-feature-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}.ws115-ex-feature-points em{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.42);font-style:normal;font-size:12px;font-weight:800} .ws115-exception-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px}.ws115-exception-stack article{padding:22px;border-radius:24px;background:#282e37;border:1px solid #363e49;transition:.32s}.ws115-exception-stack article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.35)}.ws115-exception-stack b,.ws115-exception-stack small{display:block}.ws115-exception-stack b{font-size:18px;line-height:1.3;margin-bottom:8px}.ws115-exception-stack small{color:#c9d0d9;font-size:14px;line-height:1.6} .ws115-compare-board-fill{justify-content:flex-start!important} .ws115-compare-board-fill .ws115-compare-metrics{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding:16px 0 4px}.ws115-compare-metrics article{padding:14px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,181,31,.18)}.ws115-compare-metrics small,.ws115-compare-metrics b{display:block}.ws115-compare-metrics small{font-size:11px;color:#9b6700}.ws115-compare-metrics b{font-size:16px;margin-top:4px;color:#252a33}.ws115-compare-summary{margin-top:14px;padding:16px 18px;border-radius:20px;background:#20252d;color:#fff}.ws115-compare-summary b,.ws115-compare-summary small{display:block}.ws115-compare-summary b{font-size:15px}.ws115-compare-summary small{margin-top:5px;color:#c1c9d1;line-height:1.6} body:not(.home) .dm115-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance} body:not(.home) .dm115-page h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .dm115-page [data-dm115-reveal]{opacity:0;transform:translateY(26px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1)} .dm115-page [data-dm115-reveal].is-visible{opacity:1;transform:none} .dm115-section{padding:var(--global-section-space) 0} .dm115-overview-grid,.dm115-visual-grid,.dm115-status-grid,.dm115-human-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,48px);align-items:center} .dm115-overview-copy p,.dm115-visual-copy p,.dm115-status-copy p,.dm115-human-copy p,.dm115-lifecycle-head p,.dm115-cards-head p{color:var(--muted);font-size:17px;line-height:1.62} .dm115-chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.dm115-chip-row span{padding:9px 14px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800;border:1px solid rgba(255,181,31,.25)} .dm115-fleet-board{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;box-shadow:0 30px 80px rgba(22,28,36,.16);color:#fff}.dm115-board-top{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:2px 4px 16px}.dm115-board-top b,.dm115-board-top small{display:block}.dm115-board-top small{color:#aeb7c2;font-size:12px}.dm115-board-top>span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800} .dm115-fleet-grid{display:grid;grid-template-columns:180px 1fr;gap:14px}.dm115-device-list{display:grid;gap:10px}.dm115-device-list article{padding:14px;border-radius:16px;background:#282e37;border:1px solid #363e49}.dm115-device-list article.active{background:#fff4d7;border-color:#ffd45a}.dm115-device-list b,.dm115-device-list small{display:block}.dm115-device-list b{font-size:13px;color:#fff}.dm115-device-list article.active b{color:#252a33}.dm115-device-list small{margin-top:5px;color:#c5cbd6;font-size:11px}.dm115-device-list article.active small{color:#655100} .dm115-device-panel{background:#f8f9fb;color:#252a33;border-radius:22px;padding:14px}.dm115-panel-head{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px}.dm115-panel-head span{padding:8px 11px;border-radius:999px;background:#fff;border:1px solid #e5e8ef;font-size:11px;font-weight:800;color:#626b78}.dm115-panel-head .good{background:#effaf3;border-color:#bde5ca;color:#258954}.dm115-spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.dm115-spec-grid article{padding:14px;border-radius:16px;background:#fff;border:1px solid #e3e7ee}.dm115-spec-grid small,.dm115-spec-grid b{display:block}.dm115-spec-grid small{font-size:11px;color:#69707d}.dm115-spec-grid b{font-size:16px;margin-top:4px} .dm115-mini-chart{display:grid;grid-template-columns:repeat(6,1fr);gap:10px;align-items:end;height:140px;margin-top:14px;padding:14px;border-radius:18px;background:#fff;border:1px solid #e3e7ee;position:relative}.dm115-mini-chart i{display:block;height:var(--h);border-radius:999px 999px 8px 8px;background:linear-gradient(180deg,var(--accent-3),var(--accent),var(--accent-2));align-self:end}.dm115-mini-chart span{position:absolute;left:14px;bottom:10px;font-size:11px;color:#69707d;font-weight:700} .dm115-board-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.dm115-board-foot article{padding:13px 14px;border-radius:16px;background:#282e37;border:1px solid #363e49}.dm115-board-foot small,.dm115-board-foot b{display:block}.dm115-board-foot small{font-size:11px;color:#aeb7c2}.dm115-board-foot b{margin-top:3px;font-size:18px} .dm115-cards{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.dm115-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.dm115-card{padding:26px;border-radius:26px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 45px rgba(22,28,36,.06);min-height:260px;transition:transform .32s ease,border-color .32s ease,box-shadow .32s ease}.dm115-card:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.32);box-shadow:0 26px 65px rgba(22,28,36,.09)}.dm115-card span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:900}.dm115-card small{display:block;color:#7b5200;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin:12px 0 8px}.dm115-card p{color:#4f5864;font-size:14px;line-height:1.65}.dm115-card.featured{background:linear-gradient(135deg,var(--accent-3),var(--accent),var(--accent-2));color:#252a33}.dm115-card.featured p,.dm115-card.featured small{color:rgba(37,42,51,.8)}.dm115-card.featured span{background:rgba(255,255,255,.48)} .dm115-photo-card,.dm115-human-card{margin:0;position:relative;border-radius:30px;overflow:hidden;box-shadow:0 24px 70px rgba(25,30,55,.12)}.dm115-photo-card img,.dm115-human-card img{display:block;width:100%;height:100%;min-height:520px;object-fit:cover}.dm115-photo-card figcaption,.dm115-human-card figcaption{position:absolute;left:18px;right:18px;bottom:18px;background:rgba(13,17,32,.84);backdrop-filter:blur(12px);padding:16px 18px;border-radius:18px;color:#fff}.dm115-photo-card figcaption small,.dm115-human-card figcaption small{display:block;color:#ffcf68;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.dm115-photo-card figcaption b,.dm115-human-card figcaption b{font-size:18px;line-height:1.3} .dm115-inline-list{display:grid;gap:14px;margin-top:24px}.dm115-inline-list article{display:grid;grid-template-columns:160px 1fr;gap:16px;padding:16px 0;border-top:1px solid rgba(37,42,51,.10)}.dm115-inline-list b{font-size:15px}.dm115-inline-list small{font-size:14px;color:#4f5864;line-height:1.6} .dm115-status{background:#20252d;color:#fff}.dm115-status .eyebrow{background:#282e37;border-color:#363e49;color:#d8dde7}.dm115-status p{color:#b8c0ca}.dm115-status-board{padding:22px;border-radius:28px;background:#282e37;border:1px solid #363e49}.dm115-status-board article{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.08)}.dm115-status-board article:first-of-type{border-top:0}.dm115-status-board b,.dm115-status-board small{display:block}.dm115-status-board small{color:#b8c0ca}.dm115-bar{height:10px;border-radius:999px;background:rgba(255,181,31,.16);overflow:hidden}.dm115-bar i{display:block;height:100%;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform-origin:left center;transform:scaleX(0);transition:transform 1.25s cubic-bezier(.2,.75,.2,1)}.dm115-status.is-visible .dm115-bar i{transform:scaleX(1)}.dm115-status-note{display:flex;justify-content:space-between;gap:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);margin-top:14px}.dm115-status-note span{display:flex;align-items:center;gap:10px;font-weight:700}.dm115-status-note span i{width:10px;height:10px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.12)}.dm115-status-note small{max-width:320px;line-height:1.55;color:#c1c9d1} .dm115-lifecycle-head{text-align:center;max-width:830px;margin:0 auto 40px}.dm115-lifecycle-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));align-items:center;gap:12px}.dm115-lifecycle-track article{padding:24px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 46px rgba(22,28,36,.06);min-height:210px;display:flex;flex-direction:column;transition:.32s}.dm115-lifecycle-track article:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.32)}.dm115-lifecycle-track article span{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33;font-weight:900;margin-bottom:18px}.dm115-lifecycle-track article small{color:#5d6572;font-size:14px;line-height:1.6;margin-top:10px}.dm115-lifecycle-track>i{height:2px;background:linear-gradient(90deg,var(--accent-3),rgba(255,181,31,.12));position:relative}.dm115-lifecycle-track>i:after{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;background:var(--accent);animation:ws113Flow 2.1s linear infinite} .dm115-link-list{display:grid;gap:0;margin-top:20px}.dm115-link-list a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(19,23,34,.09);font-weight:750;color:inherit}.dm115-link-list a span{transition:.3s}.dm115-link-list a:hover{color:#d98700}.dm115-link-list a:hover span{transform:translateX(5px)} @media(max-width:990px){.ws115-studio-grid,.ws115-exception-grid,.dm115-overview-grid,.dm115-visual-grid,.dm115-status-grid,.dm115-human-grid{grid-template-columns:1fr}.ws115-exception-stack,.dm115-card-grid{grid-template-columns:1fr 1fr}.ws115-compare-metrics,.dm115-spec-grid,.dm115-board-foot,.dm115-lifecycle-track{grid-template-columns:1fr 1fr}.dm115-fleet-grid{grid-template-columns:1fr}.dm115-lifecycle-track>i{display:none}.dm115-inline-list article{grid-template-columns:1fr}} @media(max-width:680px){.ws115-studio-foot,.ws115-compare-metrics,.ws115-exception-stack,.dm115-card-grid,.dm115-spec-grid,.dm115-board-foot,.dm115-lifecycle-track{grid-template-columns:1fr}.ws115-time-head{grid-template-columns:80px repeat(5,1fr)}.ws115-shift-rows article{grid-template-columns:80px 1fr}.dm115-photo-card img,.dm115-human-card img{min-height:400px}.dm115-status-board article{grid-template-columns:1fr}.dm115-status-note{flex-direction:column;align-items:flex-start}} @media(prefers-reduced-motion:reduce){.dm115-page [data-dm115-reveal]{opacity:1!important;transform:none!important;transition:none!important}.dm115-lifecycle-track>i:after,.dm115-bar i,.ws115-exception-stack article,.ws115-studio-sidebar article,.ws115-schedule-studio *{animation:none!important;transition:none!important}} /* v116 schedule interactivity + complete Devices section redesign */ .ws113-page > .ws113-section,.ws113-page > .ws116-exceptions-section{padding-top:var(--global-section-space)!important;padding-bottom:var(--global-section-space)!important} .ws113-overview-grid{align-items:stretch!important}.ws113-overview-copy{display:flex;flex-direction:column;height:100%}.ws116-overview-points{display:grid;gap:10px;margin:24px 0}.ws116-overview-points article{padding:13px 0;border-top:1px solid rgba(37,42,51,.1);display:grid;grid-template-columns:150px 1fr;gap:16px}.ws116-overview-points b{font-size:14px}.ws116-overview-points small{font-size:13px;line-height:1.55;color:var(--muted)}.ws113-chip-row{margin-top:auto!important} .ws116-schedule-studio{height:100%;min-height:560px;background:#20252d;border:1px solid #303641;border-radius:30px;padding:18px;color:#fff;box-shadow:0 30px 80px rgba(22,28,36,.16);display:flex;flex-direction:column}.ws116-studio-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.ws116-studio-head b,.ws116-studio-head small{display:block}.ws116-studio-head small{color:#aeb7c2;font-size:12px}.ws116-studio-head>span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800} .ws116-studio-tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0}.ws116-studio-tabs button{border:1px solid #363e49;background:#282e37;color:#c5ccd7;border-radius:14px;padding:10px 12px;font-size:12px;font-weight:800;cursor:pointer;transition:.25s}.ws116-studio-tabs button:hover,.ws116-studio-tabs button.active{background:#fff4d7;border-color:#ffd45a;color:#8c5d00;transform:translateY(-2px)} .ws116-tab-panel{display:none;flex:1;min-height:360px}.ws116-tab-panel.active{display:grid;animation:ws116Panel .35s ease both}@keyframes ws116Panel{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}} .ws116-tab-panel[data-ws-panel="shifts"]{grid-template-columns:118px 1fr;gap:12px}.ws116-team-rail{display:grid;gap:9px}.ws116-team-rail span{padding:10px;border-radius:14px;background:#282e37;border:1px solid #363e49;font-size:11px;color:#c5ccd7;display:flex;align-items:center;gap:8px}.ws116-team-rail b{width:30px;height:30px;border-radius:10px;background:#353d48;display:grid;place-items:center;font-size:9px;color:#fff}.ws116-team-rail .active{background:#fff4d7;color:#7b5200;border-color:#ffd45a}.ws116-team-rail .active b{background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33} .ws116-shift-canvas{background:#f8f9fb;border-radius:18px;padding:12px;color:#252a33}.ws116-days{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:0 0 8px 90px}.ws116-days span{text-align:center;font-size:10px;color:#747c88;font-weight:800}.ws116-shift-row{position:relative;height:62px;border-top:1px solid #e5e8ef;padding-left:90px}.ws116-shift-row:first-of-type{border-top:0}.ws116-shift-row b{position:absolute;left:6px;top:22px;font-size:11px}.ws116-shift-row i,.ws116-shift-row em{position:absolute;left:calc(90px + var(--left));width:var(--width);top:17px;height:28px;border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent));box-shadow:0 7px 16px rgba(255,106,55,.15)}.ws116-shift-row em{background:linear-gradient(90deg,#ff8a56,var(--accent-2))} .ws116-template-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#f8f9fb;border-radius:18px;padding:14px}.ws116-template-grid article{padding:18px;border-radius:18px;background:#fff;border:1px solid #e4e7ec;color:#252a33;transition:.25s}.ws116-template-grid article:hover{transform:translateY(-4px);border-color:#f0c24f}.ws116-template-grid span,.ws116-template-grid b,.ws116-template-grid small{display:block}.ws116-template-grid span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#9b6700;font-weight:900}.ws116-template-grid b{font-size:18px;margin:7px 0 4px}.ws116-template-grid small{color:#747c88} .ws116-attendance-list{display:grid;gap:10px;background:#f8f9fb;border-radius:18px;padding:14px}.ws116-attendance-list article{display:grid;grid-template-columns:12px 1fr auto;gap:12px;align-items:center;padding:15px;border-radius:16px;background:#fff;border:1px solid #e4e7ec;color:#252a33}.ws116-attendance-list>article>span{width:10px;height:10px;border-radius:50%;background:#53d587;box-shadow:0 0 0 5px rgba(83,213,135,.12)}.ws116-attendance-list>article>span.warn{background:#ffb522;box-shadow:0 0 0 5px rgba(255,181,34,.12)}.ws116-attendance-list>article>span.off{background:#aeb7c2;box-shadow:0 0 0 5px rgba(174,183,194,.12)}.ws116-attendance-list b,.ws116-attendance-list small{display:block}.ws116-attendance-list small{color:#747c88;font-size:11px}.ws116-attendance-list strong{font-size:12px} .ws116-studio-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.ws116-studio-foot article{padding:11px 13px;border-radius:14px;background:#282e37;border:1px solid #363e49}.ws116-studio-foot small,.ws116-studio-foot b{display:block}.ws116-studio-foot small{color:#aeb7c2;font-size:10px}.ws116-studio-foot b{font-size:16px;margin-top:2px} .ws116-exceptions-section{background:#20252d;color:#fff}.ws116-exceptions-head{text-align:center;max-width:870px;margin:0 auto 38px}.ws116-exceptions-head .eyebrow.muted{background:#282e37!important;color:#fff!important;-webkit-text-fill-color:#fff!important;border-color:#46505d!important;opacity:1!important}.ws116-exceptions-head p{max-width:720px;margin:16px auto 0;color:#c9d0d9!important;font-size:17px;line-height:1.62}.ws116-exception-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:18px;align-items:stretch}.ws116-exception-feature{padding:30px;border-radius:30px;background:linear-gradient(135deg,#ff8a3d 0%,#ff6a37 45%,#ff315f 100%);color:#fff!important;display:flex;flex-direction:column;min-height:440px;box-shadow:0 28px 65px rgba(255,49,95,.14)}.ws116-exception-feature *{color:#fff!important}.ws116-ex-icon{width:54px;height:54px;border-radius:17px;background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.3);display:grid;place-items:center}.ws116-ex-icon svg,.ws116-small-icon svg{width:25px;height:25px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.ws116-exception-feature>small{text-transform:uppercase;letter-spacing:.1em;font-size:11px;font-weight:900;margin:18px 0 8px}.ws116-exception-feature h3{margin:0 0 12px!important}.ws116-exception-feature p{max-width:520px;line-height:1.72!important;font-size:15px!important}.ws116-ex-feature-points{display:flex;flex-wrap:wrap;gap:9px;margin-top:auto}.ws116-ex-feature-points em{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.17);border:1px solid rgba(255,255,255,.24);font-style:normal;font-size:11px;font-weight:800} .ws116-exception-stack{display:grid;grid-template-columns:1fr 1fr;gap:14px}.ws116-exception-stack article{padding:20px;border-radius:24px;background:#282e37;border:1px solid #39424f;display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:start;transition:.3s}.ws116-exception-stack article:hover{transform:translateY(-5px) rotate(-.3deg);border-color:rgba(255,181,31,.45);background:#2c333d}.ws116-small-icon{width:46px;height:46px;border-radius:15px;background:#353e49;color:#ffcf68;display:grid;place-items:center}.ws116-exception-stack b,.ws116-exception-stack small{display:block}.ws116-exception-stack b{font-size:17px;line-height:1.28}.ws116-exception-stack small{margin-top:7px;color:#c9d0d9;font-size:13px;line-height:1.58} /* Devices redesigned sections */ .dm115-page > .dm116-section{padding-top:var(--global-section-space)!important;padding-bottom:var(--global-section-space)!important}.dm116-section [data-dm116-reveal]{}body:not(.home) .dm115-page .dm116-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance}.dm115-page [data-dm116-reveal]{opacity:0;transform:translateY(28px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1)}.dm115-page [data-dm116-reveal].is-visible{opacity:1;transform:none} .dm116-command{background:#fff}.dm116-command-shell{display:grid;grid-template-columns:.8fr 1.2fr;gap:46px;align-items:center}.dm116-command-copy p{color:var(--muted);font-size:17px;line-height:1.65}.dm116-command-actions{display:flex;flex-direction:column;gap:10px;margin-top:24px}.dm116-command-actions span{font-size:12px;color:#7b828f}.dm116-command-stage{padding:18px;border-radius:28px;background:#20252d;color:#fff;box-shadow:0 30px 80px rgba(22,28,36,.16)}.dm116-stage-toolbar{display:flex;justify-content:space-between;align-items:center;padding:2px 4px 14px}.dm116-stage-toolbar span{font-size:11px;padding:7px 10px;border-radius:999px;background:#2b313b;color:#c7cdd5}.dm116-stage-table{background:#f7f8fa;border-radius:18px;padding:10px;color:#252a33}.dm116-stage-table .head,.dm116-stage-table article{display:grid;grid-template-columns:1.6fr .7fr .6fr .6fr;gap:10px;align-items:center}.dm116-stage-table .head{padding:8px 10px;font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#8b929d}.dm116-stage-table article{padding:11px 10px;border-top:1px solid #e5e8ec;font-size:11px}.dm116-stage-table article>span:first-child{display:grid;grid-template-columns:12px 1fr;column-gap:8px}.dm116-stage-table article>span:first-child small{grid-column:2;color:#848b96}.dm116-stage-table i{width:10px;height:10px;border-radius:3px;background:var(--accent-3);margin-top:3px}.dm116-stage-table i.win{background:var(--accent)}.dm116-stage-table i.linux{background:#53d587}.dm116-stage-table .ok,.dm116-stage-table .review,.dm116-stage-table .off{justify-self:start;padding:5px 8px;border-radius:999px;background:#eef9f2;color:#2f8c58;font-weight:800}.dm116-stage-table .review{background:#fff4d7;color:#9b6700}.dm116-stage-table .off{background:#f0f2f5;color:#69707d}.dm116-stage-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.dm116-stage-stats span{padding:12px;border-radius:14px;background:#282e37;border:1px solid #363e49}.dm116-stage-stats b,.dm116-stage-stats small{display:block}.dm116-stage-stats b{font-size:18px}.dm116-stage-stats small{color:#aeb7c2;font-size:10px} .dm116-orbit{background:linear-gradient(180deg,#fff8ec,#fff)}.dm116-orbit-head{text-align:center;max-width:820px;margin:0 auto 34px}.dm116-orbit-head p{max-width:670px;margin:16px auto 0;color:var(--muted)}.dm116-orbit-board{position:relative;min-height:560px;border-radius:34px;background:#20252d;overflow:hidden;border:1px solid #303641}.dm116-orbit-board:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:38px 38px}.dm116-orbit-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:180px;height:180px;border-radius:50%;background:linear-gradient(135deg,var(--accent-3),var(--accent),var(--accent-2));display:flex;flex-direction:column;align-items:center;justify-content:center;color:#252a33;z-index:3;box-shadow:0 0 0 18px rgba(255,181,31,.09)}.dm116-orbit-center span{width:48px;height:48px;border-radius:15px;background:rgba(255,255,255,.45);display:grid;place-items:center;font-weight:900}.dm116-orbit-center b{margin-top:9px}.dm116-orbit-center small{font-size:11px}.dm116-orbit-ring{position:absolute;left:50%;top:50%;border-radius:50%;border:1px solid rgba(255,181,31,.2);transform:translate(-50%,-50%)}.dm116-orbit-ring.one{width:330px;height:330px;animation:dmOrbit 22s linear infinite}.dm116-orbit-ring.two{width:470px;height:470px;animation:dmOrbit 34s linear infinite reverse}@keyframes dmOrbit{to{transform:translate(-50%,-50%) rotate(360deg)}}.dm116-orbit-node{position:absolute;width:180px;padding:16px;border-radius:20px;background:#282e37;border:1px solid #3b4450;color:#fff;z-index:4;transition:.3s}.dm116-orbit-node:hover{transform:translateY(-6px) scale(1.02);border-color:#f0bd43}.dm116-orbit-node .icon{width:36px;height:36px;border-radius:12px;background:#343d48;color:#ffcf68;display:grid;place-items:center;font-size:10px;font-weight:900}.dm116-orbit-node b,.dm116-orbit-node small{display:block}.dm116-orbit-node b{margin-top:10px;font-size:15px}.dm116-orbit-node small{margin-top:4px;color:#b7c0cb;font-size:11px}.dm116-orbit-node.n1{left:7%;top:15%}.dm116-orbit-node.n2{right:7%;top:16%}.dm116-orbit-node.n3{right:9%;bottom:14%}.dm116-orbit-node.n4{left:9%;bottom:14%} .dm116-photo-flow-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:stretch}.dm116-photo{margin:0;position:relative;border-radius:34px;overflow:hidden;min-height:570px}.dm116-photo img{width:100%;height:100%;object-fit:cover}.dm116-photo figcaption{position:absolute;left:20px;right:20px;bottom:20px;padding:18px 20px;border-radius:20px;background:rgba(13,17,32,.86);backdrop-filter:blur(12px);color:#fff}.dm116-photo figcaption b,.dm116-photo figcaption small{display:block}.dm116-photo figcaption small{margin-top:5px;color:#c7ced8}.dm116-photo-copy{display:flex;flex-direction:column;justify-content:center}.dm116-photo-copy>p{color:var(--muted);font-size:17px;line-height:1.65}.dm116-photo-steps{display:grid;gap:0;margin-top:22px}.dm116-photo-steps article{display:grid;grid-template-columns:46px 1fr;gap:14px;padding:16px 0;border-top:1px solid rgba(37,42,51,.1)}.dm116-photo-steps>article>span{width:42px;height:42px;border-radius:13px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-size:10px;font-weight:900}.dm116-photo-steps b,.dm116-photo-steps small{display:block}.dm116-photo-steps small{margin-top:4px;color:#69707d} .dm116-pulse{background:#20252d;color:#fff}.dm116-pulse-grid{display:grid;grid-template-columns:.85fr 1.15fr;gap:50px;align-items:center}.dm116-pulse-copy .eyebrow{background:#282e37;border-color:#3a434f;color:#fff}.dm116-pulse-copy p{color:#b8c0ca;font-size:17px;line-height:1.65}.dm116-pulse-visual{display:grid;grid-template-columns:230px 1fr;gap:24px;align-items:center}.dm116-pulse-ring{width:220px;height:220px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(var(--accent-3) 0 72%,var(--accent) 72% 90%,#3a424d 90% 100%);position:relative}.dm116-pulse-ring:after{content:"";position:absolute;inset:18px;border-radius:50%;background:#20252d}.dm116-pulse-ring span{position:relative;z-index:2;text-align:center}.dm116-pulse-ring b,.dm116-pulse-ring small{display:block}.dm116-pulse-ring b{font-size:46px;line-height:1}.dm116-pulse-ring small{color:#aeb7c2}.dm116-pulse-bars{display:grid;gap:14px}.dm116-pulse-bars article{display:grid;grid-template-columns:140px 1fr auto;gap:14px;align-items:center}.dm116-pulse-bars b,.dm116-pulse-bars small{display:block}.dm116-pulse-bars small{color:#aeb7c2;font-size:11px}.dm116-pulse-bars i{height:10px;border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));width:var(--target);transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)}.dm116-pulse.is-visible .dm116-pulse-bars i{transform:scaleX(1)} .dm116-timeline{background:#fff8ec}.dm116-timeline-head{text-align:center;max-width:820px;margin:0 auto 42px}.dm116-timeline-wrap{position:relative;display:grid;grid-template-columns:repeat(5,1fr);gap:18px}.dm116-line{position:absolute;left:5%;right:5%;top:31px;height:2px;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2))}.dm116-timeline-wrap article{position:relative;z-index:2;padding-top:0}.dm116-timeline-wrap>article>span{width:62px;height:62px;border-radius:20px;background:#fff;border:1px solid #f0c45a;box-shadow:0 12px 26px rgba(255,181,31,.13);display:grid;place-items:center;font-size:11px;font-weight:900;color:#9b6700}.dm116-timeline-wrap article div{margin-top:18px;padding:18px;border-radius:22px;background:#fff;border:1px solid rgba(37,42,51,.08);min-height:190px;transition:.3s}.dm116-timeline-wrap article:hover div{transform:translateY(-6px);box-shadow:0 20px 45px rgba(22,28,36,.08)}.dm116-timeline-wrap small,.dm116-timeline-wrap b,.dm116-timeline-wrap p{display:block}.dm116-timeline-wrap small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#9b6700;font-weight:900}.dm116-timeline-wrap b{margin-top:7px;font-size:16px}.dm116-timeline-wrap p{margin:8px 0 0;color:#69707d;font-size:13px;line-height:1.6} .dm116-access-shell{display:grid;grid-template-columns:1.1fr .9fr;gap:52px;align-items:center}.dm116-access-visual{position:relative;min-height:480px;border-radius:32px;background:#f7f8fa;border:1px solid #e4e7ec;overflow:hidden}.dm116-access-card{position:absolute;padding:18px;border-radius:20px;background:#fff;border:1px solid #e0e4e9;box-shadow:0 18px 42px rgba(22,28,36,.08);min-width:180px;z-index:3;transition:.3s}.dm116-access-card:hover{transform:translateY(-5px)}.dm116-access-card span{width:42px;height:42px;border-radius:13px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-size:10px;font-weight:900}.dm116-access-card b,.dm116-access-card small{display:block}.dm116-access-card b{margin-top:8px}.dm116-access-card small{color:#69707d;font-size:11px}.dm116-access-card.admin{left:50%;top:34px;transform:translateX(-50%);background:#20252d;color:#fff;border-color:#303641}.dm116-access-card.admin:hover{transform:translateX(-50%) translateY(-5px)}.dm116-access-card.admin small{color:#b8c0ca}.dm116-access-card.t1{left:6%;bottom:50px}.dm116-access-card.t2{left:50%;bottom:24px;transform:translateX(-50%)}.dm116-access-card.t2:hover{transform:translateX(-50%) translateY(-5px)}.dm116-access-card.t3{right:6%;bottom:50px}.dm116-access-link{position:absolute;height:2px;background:linear-gradient(90deg,var(--accent-3),var(--accent));transform-origin:left;top:190px;left:50%;width:180px;z-index:1}.dm116-access-link.l1{transform:rotate(145deg)}.dm116-access-link.l2{transform:rotate(90deg);width:150px}.dm116-access-link.l3{transform:rotate(35deg)}.dm116-access-copy p{color:var(--muted);font-size:17px;line-height:1.65}.dm116-access-links{display:grid;margin-top:22px}.dm116-access-links a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(37,42,51,.1);font-weight:750}.dm116-access-links a:hover{color:#d98700} @media(max-width:990px){.ws116-exception-grid,.dm116-command-shell,.dm116-photo-flow-grid,.dm116-pulse-grid,.dm116-access-shell{grid-template-columns:1fr}.ws116-exception-stack{grid-template-columns:1fr 1fr}.dm116-orbit-board{min-height:620px}.dm116-pulse-visual{grid-template-columns:1fr;justify-items:center}.dm116-timeline-wrap{grid-template-columns:1fr 1fr}.dm116-line{display:none}.dm116-access-visual{min-height:520px}.ws116-schedule-studio{min-height:620px}} @media(max-width:680px){.ws116-overview-points article{grid-template-columns:1fr}.ws116-studio-tabs{grid-template-columns:1fr}.ws116-tab-panel[data-ws-panel="shifts"]{grid-template-columns:1fr}.ws116-team-rail{grid-template-columns:repeat(2,1fr)}.ws116-template-grid,.ws116-exception-stack{grid-template-columns:1fr}.ws116-exception-feature{min-height:auto}.dm116-stage-table .head{display:none}.dm116-stage-table article{grid-template-columns:1fr 1fr}.dm116-stage-stats{grid-template-columns:1fr}.dm116-orbit-node{width:150px}.dm116-orbit-node.n1{left:3%;top:12%}.dm116-orbit-node.n2{right:3%;top:13%}.dm116-orbit-node.n3{right:3%;bottom:12%}.dm116-orbit-node.n4{left:3%;bottom:12%}.dm116-orbit-ring.two{width:380px;height:380px}.dm116-orbit-ring.one{width:270px;height:270px}.dm116-photo{min-height:420px}.dm116-pulse-bars article{grid-template-columns:1fr}.dm116-timeline-wrap{grid-template-columns:1fr}.dm116-access-card{min-width:150px;padding:14px}.dm116-access-card.t1{left:3%}.dm116-access-card.t3{right:3%}.dm116-access-link{display:none}} @media(prefers-reduced-motion:reduce){.ws116-tab-panel.active{animation:none}.dm116-orbit-ring{animation:none!important}.dm115-page [data-dm116-reveal]{opacity:1!important;transform:none!important;transition:none!important}.dm116-pulse-bars i,.dm116-timeline-wrap article div,.dm116-access-card,.ws116-exception-stack article{transition:none!important}} /* v117 targeted schedule + devices + file sharing redesign */ .ws117-overview-note{margin-top:18px;padding:16px 18px;border-radius:20px;background:rgba(255,181,31,.08);border:1px solid rgba(255,181,31,.16)} .ws117-overview-note b,.ws117-overview-note small{display:block}.ws117-overview-note b{font-size:15px}.ws117-overview-note small{margin-top:6px;color:var(--muted);line-height:1.6} .ws117-panel-intro{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.ws117-panel-intro article{padding:12px 14px;border-radius:16px;background:#fff7e2;border:1px solid rgba(255,181,31,.22)}.ws117-panel-intro small,.ws117-panel-intro b{display:block}.ws117-panel-intro small{font-size:11px;color:#a86d00}.ws117-panel-intro b{font-size:14px;color:#252a33;margin-top:4px} .ws117-exceptions-section{padding:var(--global-section-space) 0;background:#20252d;color:#fff}.ws117-exceptions-head{text-align:center;max-width:860px;margin:0 auto 28px}.ws117-exceptions-head .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.35);color:#9b6700!important;opacity:1!important}.ws117-exceptions-head p{max-width:720px;margin:16px auto 0;color:#d3d8e0;font-size:17px;line-height:1.62} .ws117-exception-grid{display:grid;grid-template-columns:1.08fr 1fr;gap:14px;align-items:stretch}.ws117-exception-feature{padding:28px;border-radius:28px;background:#29303a;border:1px solid rgba(255,181,31,.22);box-shadow:inset 0 1px 0 rgba(255,255,255,.04);display:flex;flex-direction:column;min-height:390px;position:relative;overflow:hidden}.ws117-exception-feature:before{content:"";position:absolute;inset:auto -20% -45% auto;width:280px;height:280px;border-radius:50%;background:radial-gradient(circle, rgba(255,181,31,.20), rgba(255,181,31,0));pointer-events:none}.ws117-feature-icon{width:56px;height:56px;border-radius:18px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;border:1px solid rgba(255,181,31,.24)}.ws117-feature-icon svg,.ws117-small-icon svg{width:24px;height:24px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.ws117-exception-feature small{display:block;font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#ffcf68;margin:16px 0 8px}.ws117-exception-feature h3,.ws117-exception-feature p{color:#fff!important}.ws117-exception-feature p{margin-top:18px;line-height:1.75;max-width:560px}.ws117-ex-feature-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:auto}.ws117-ex-feature-points em{padding:9px 12px;border-radius:999px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);font-style:normal;font-size:12px;font-weight:800;color:#fff} .ws117-exception-stack{display:grid;grid-template-columns:1fr 1fr;gap:12px}.ws117-exception-stack article{padding:22px 20px;border-radius:24px;background:#252c36;border:1px solid rgba(255,255,255,.07);display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start;transition:.32s}.ws117-exception-stack article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.3)}.ws117-small-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:rgba(255,181,31,.12);color:#ffbf39}.ws117-exception-stack b{display:block;font-size:17px;line-height:1.35;color:#fff}.ws117-exception-stack small{display:block;margin-top:6px;color:#d3d8e0;line-height:1.7} .pa110-bento-main h3,.pa110-bento article h3{font-size:clamp(1.1rem,1.65vw,1.3rem);white-space:nowrap} .pa110-bento-main .pa110-mini-line{display:none!important} .pa110-bento-main .pa110-main-points span,.pa110-bento .dark p,.pa110-bento-main p{color:#fff} .pa110-bento-main{background:#20252d;color:#fff} .pa110-bento article.dark{background:#252c36} .dm117-section{padding:var(--global-section-space) 0} .dm117-section[data-dm117-reveal]{opacity:0;transform:translateY(26px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)} .dm117-section[data-dm117-reveal].is-visible{opacity:1;transform:none} .dm117-command-shell,.dm117-ownership-grid,.dm117-health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,46px);align-items:center} .dm117-command-copy p,.dm117-ownership-copy p,.dm117-health-copy p,.dm117-handoff-head p,.dm117-access-copy p,.fs117-overview-copy p,.fs117-proof-copy p,.fs117-head p,.fs117-security-copy p{font-size:17px;line-height:1.62;color:var(--muted)} .dm117-command-points{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.dm117-command-points span{padding:9px 13px;border-radius:999px;background:#fff4d7;border:1px solid rgba(255,181,31,.2);font-size:12px;font-weight:800;color:#9b6700}.dm117-command-actions{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:22px}.dm117-command-actions small{color:var(--muted);font-weight:700} .dm117-command-stage{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;color:#fff;box-shadow:0 26px 70px rgba(22,28,36,.16)}.dm117-stage-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.dm117-stage-top span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800}.dm117-stage-table{background:#282f39;border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.07)}.dm117-stage-table .head,.dm117-stage-table article{display:grid;grid-template-columns:1.6fr .8fr .8fr .7fr;gap:12px;align-items:center;padding:14px 18px}.dm117-stage-table .head{font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#aeb7c2;background:#232933}.dm117-stage-table article{border-top:1px solid rgba(255,255,255,.06)}.dm117-stage-table article span:first-child{display:grid;grid-template-columns:20px 1fr;gap:10px;align-items:center}.dm117-stage-table article span:first-child b,.dm117-stage-table article span:first-child small{grid-column:2}.dm117-stage-table article small{color:#aeb7c2}.dm117-stage-table i{display:inline-block;width:12px;height:12px;border-radius:50%}.dm117-stage-table i.mac{background:#53d587}.dm117-stage-table i.win{background:#ffbf39}.dm117-stage-table i.linux{background:#8f79ff}.dm117-stage-table .ok,.dm117-stage-table .review,.dm117-stage-table .off{padding:7px 10px;border-radius:999px;font-size:12px;font-weight:800;justify-self:start}.dm117-stage-table .ok{background:#effaf3;color:#258954}.dm117-stage-table .review{background:#fff4d7;color:#9b6700}.dm117-stage-table .off{background:#f2f3f5;color:#586271}.dm117-stage-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.dm117-stage-stats span{padding:14px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.dm117-stage-stats b,.dm117-stage-stats small{display:block}.dm117-stage-stats b{font-size:18px}.dm117-stage-stats small{margin-top:4px;color:#b8c0ca} .dm117-ownership{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.dm117-owner-cards{display:grid;gap:12px;margin-top:22px}.dm117-owner-cards article{padding:16px 18px;border-radius:20px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 40px rgba(22,28,36,.05)}.dm117-owner-cards b,.dm117-owner-cards small{display:block}.dm117-owner-cards small{margin-top:6px;color:#5a6472;line-height:1.6}.dm117-dashboard-figure{margin:0;position:relative;padding:18px;border-radius:30px;background:#20252d;box-shadow:0 26px 70px rgba(22,28,36,.12)}.dm117-dashboard-figure img{display:block;width:100%;height:auto;max-width:430px;margin:0 auto}.dm117-dashboard-figure figcaption{margin-top:16px;padding:16px 18px;border-radius:18px;background:#282f39;color:#fff}.dm117-dashboard-figure figcaption small{display:block;color:#ffcf68;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.dm117-dashboard-figure figcaption b{font-size:18px;line-height:1.35} .dm117-health{background:#20252d;color:#fff}.dm117-health .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.35);color:#9b6700!important;opacity:1!important}.dm117-health-copy p{color:#d1d8e2}.dm117-health-board{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:center;padding:24px;border-radius:30px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.dm117-health-ring{width:200px;height:200px;border-radius:50%;display:grid;place-items:center;margin:0 auto;background:conic-gradient(var(--accent) 0deg, rgba(255,255,255,.08) 0);position:relative}.dm117-health-ring:before{content:"";width:152px;height:152px;border-radius:50%;background:#20252d;display:block;position:absolute}.dm117-health-ring span{position:relative;z-index:1;text-align:center}.dm117-health-ring b,.dm117-health-ring small{display:block}.dm117-health-ring b{font-size:32px}.dm117-health-ring small{margin-top:6px;color:#b8c0ca}.dm117-health.is-visible .dm117-health-ring{animation:dm117RingFill 1.35s ease forwards} .dm117-health-bars{display:grid;gap:16px}.dm117-health-bars article{display:grid;grid-template-columns:1fr 1fr auto;gap:14px;align-items:center}.dm117-health-bars small{color:#b8c0ca}.dm117-health-bars i{display:block;height:10px;border-radius:999px;background:rgba(255,181,31,.18);overflow:hidden;position:relative}.dm117-health-bars i:before{content:"";position:absolute;inset:0 auto 0 0;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left center;transition:transform 1.2s cubic-bezier(.2,.75,.2,1)}.dm117-health.is-visible .dm117-health-bars i:before{transform:scaleX(1)} .dm117-handoff-head{text-align:center;max-width:830px;margin:0 auto 36px}.dm117-handoff-track{position:relative;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px;align-items:start}.dm117-track-line{position:absolute;left:5%;right:5%;top:34px;height:2px;background:linear-gradient(90deg,rgba(255,181,31,.14),rgba(255,181,31,.5),rgba(255,181,31,.14));overflow:hidden}.dm117-track-line:after{content:"";position:absolute;top:50%;left:-10%;transform:translateY(-50%);width:68px;height:8px;border-radius:999px;background:linear-gradient(90deg,rgba(255,181,31,0),rgba(255,181,31,.88),rgba(255,181,31,0));animation:dm117Line 2.2s linear infinite}.dm117-handoff-track article{position:relative;padding:74px 22px 24px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 40px rgba(22,28,36,.05);min-height:200px;transition:.32s}.dm117-handoff-track article:hover{transform:translateY(-5px)}.dm117-handoff-track article span{position:absolute;top:12px;left:22px;width:44px;height:44px;border-radius:14px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-weight:900}.dm117-handoff-track b,.dm117-handoff-track small{display:block}.dm117-handoff-track small{margin-top:8px;color:#5a6472;line-height:1.65} .dm117-access-grid{display:grid;grid-template-columns:1.05fr 1fr .9fr;gap:24px;align-items:stretch}.dm117-access-photo{margin:0;position:relative;border-radius:28px;overflow:hidden;box-shadow:0 24px 62px rgba(22,28,36,.09)}.dm117-access-photo img{display:block;width:100%;height:100%;min-height:420px;object-fit:cover}.dm117-access-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;border-radius:18px;background:rgba(16,20,33,.84);backdrop-filter:blur(10px);color:#fff}.dm117-access-photo figcaption small{display:block;color:#ffcf68;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.dm117-access-photo figcaption b{font-size:18px;line-height:1.35}.dm117-access-copy{padding:8px 0}.dm117-access-links{display:grid;gap:0;margin-top:20px}.dm117-access-links a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(19,23,34,.09);font-weight:750;color:inherit}.dm117-access-links a span{transition:.3s}.dm117-access-links a:hover{color:#d98700}.dm117-access-links a:hover span{transform:translateX(5px)}.dm117-access-cards{padding:20px;border-radius:28px;background:#20252d;border:1px solid #303641;display:grid;gap:12px}.dm117-access-cards article{padding:16px 18px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.32s}.dm117-access-cards article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.32)}.dm117-access-cards article.admin{background:linear-gradient(135deg,#fff4d7,#ffd978)}.dm117-access-cards article.admin b,.dm117-access-cards article.admin small,.dm117-access-cards article.admin span{color:#252a33}.dm117-access-cards span,.dm117-access-cards b,.dm117-access-cards small{display:block}.dm117-access-cards span{font-size:11px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#ffcf68}.dm117-access-cards b{margin:6px 0 4px;color:#fff}.dm117-access-cards small{color:#c3cad3;line-height:1.55} .fs117-section{padding:var(--global-section-space) 0}.fs117-section[data-fs117-reveal]{opacity:0;transform:translateY(26px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)}.fs117-section[data-fs117-reveal].is-visible{opacity:1;transform:none} .fs117-overview-grid,.fs117-proof-grid,.fs117-security-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,46px);align-items:center}.fs117-chip-row{display:flex;flex-wrap:wrap;gap:10px;margin-top:22px}.fs117-chip-row span{padding:9px 13px;border-radius:999px;background:#fff4d7;border:1px solid rgba(255,181,31,.2);font-size:12px;font-weight:800;color:#9b6700} .fs117-board{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;color:#fff;box-shadow:0 26px 70px rgba(22,28,36,.16)}.fs117-board-top{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px}.fs117-board-top span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800}.fs117-board-list{display:grid;gap:12px}.fs117-board-list article{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 18px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.3s}.fs117-board-list article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.28)}.fs117-board-list b,.fs117-board-list small{display:block}.fs117-board-list small{margin-top:5px;color:#b8c0ca}.fs117-board-list span:last-child{padding:8px 10px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800}.fs117-board-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:14px}.fs117-board-meta article{padding:14px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.fs117-board-meta b,.fs117-board-meta small{display:block}.fs117-board-meta small{color:#b8c0ca}.fs117-board-meta b{margin-top:4px;font-size:18px} .fs117-dashboard{margin:0;position:relative;padding:18px;border-radius:30px;background:#20252d;box-shadow:0 26px 70px rgba(22,28,36,.12)}.fs117-dashboard img{display:block;width:100%;height:auto;max-width:540px;margin:0 auto}.fs117-dashboard figcaption{margin-top:16px;padding:16px 18px;border-radius:18px;background:#282f39;color:#fff}.fs117-dashboard small{display:block;color:#ffcf68;font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px}.fs117-dashboard b{font-size:18px;line-height:1.35}.fs117-proof-list{display:grid;gap:12px;margin-top:24px}.fs117-proof-list article{padding:16px 18px;border-radius:20px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 16px 36px rgba(22,28,36,.05)}.fs117-proof-list b,.fs117-proof-list small{display:block}.fs117-proof-list small{margin-top:6px;color:#5a6472;line-height:1.6} .fs117-capabilities{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.fs117-card-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.fs117-card{padding:26px;border-radius:26px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 45px rgba(22,28,36,.05);min-height:250px;transition:.32s}.fs117-card:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.28)}.fs117-card span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:900}.fs117-card h3{margin:14px 0 10px}.fs117-card p{color:#55606d;line-height:1.65}.fs117-card.featured{background:#20252d;color:#fff}.fs117-card.featured p{color:#cbd2dc}.fs117-card.featured span{background:rgba(255,181,31,.18);color:#ffcf68} .fs117-flow-head{text-align:center;max-width:830px;margin:0 auto 36px}.fs117-flow-track{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:12px}.fs117-flow-track article{padding:24px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 45px rgba(22,28,36,.05);min-height:220px;transition:.32s}.fs117-flow-track article:hover{transform:translateY(-6px)}.fs117-flow-track article span{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33;font-weight:900;margin-bottom:16px}.fs117-flow-track article b,.fs117-flow-track article small{display:block}.fs117-flow-track article small{margin-top:8px;color:#5a6472;line-height:1.6}.fs117-flow-track>i{height:2px;background:linear-gradient(90deg,var(--accent-3),rgba(255,181,31,.12));position:relative}.fs117-flow-track>i:after{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;background:var(--accent);animation:ws113Flow 2.1s linear infinite} .fs117-security{background:#20252d;color:#fff}.fs117-security .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.35);color:#9b6700!important;opacity:1!important}.fs117-security-copy p{color:#d1d8e2}.fs117-security-visual{padding:22px;border-radius:30px;background:#282f39;border:1px solid rgba(255,255,255,.08);display:grid;gap:12px}.fs117-orb{width:180px;height:180px;border-radius:50%;margin:0 auto 6px;background:radial-gradient(circle at 35% 35%, rgba(255,255,255,.12), rgba(255,181,31,.16) 34%, rgba(255,181,31,.05) 60%, rgba(255,255,255,.06) 62%);border:1px solid rgba(255,181,31,.2);display:grid;place-items:center;text-align:center}.fs117-orb b,.fs117-orb small{display:block}.fs117-orb small{margin-top:6px;color:#b8c0ca}.fs117-security-visual article{padding:14px 16px;border-radius:18px;background:#20252d;border:1px solid rgba(255,255,255,.06);transition:.32s}.fs117-security-visual article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.32)}.fs117-security-visual b,.fs117-security-visual small{display:block}.fs117-security-visual small{margin-top:5px;color:#c3cad3;line-height:1.55} @keyframes dm117Line{0%{left:-10%}100%{left:100%}} @keyframes dm117RingFill{0%{background:conic-gradient(var(--accent) 0deg, rgba(255,255,255,.08) 0)}100%{background:conic-gradient(var(--accent) 331deg, rgba(255,255,255,.08) 0)}} @media(max-width:1180px){.dm117-access-grid{grid-template-columns:1fr 1fr}.dm117-access-copy{grid-column:span 2}} @media(max-width:990px){.ws117-panel-intro,.ws117-exception-grid,.dm117-command-shell,.dm117-ownership-grid,.dm117-health-grid,.fs117-overview-grid,.fs117-proof-grid,.fs117-security-grid{grid-template-columns:1fr}.ws117-exception-stack,.fs117-card-grid,.dm117-handoff-track{grid-template-columns:1fr 1fr}.fs117-flow-track{grid-template-columns:1fr}.dm117-health-board{grid-template-columns:1fr}.dm117-access-grid{grid-template-columns:1fr}.dm117-access-copy{grid-column:auto}.fs117-flow-track>i{display:none}} @media(max-width:680px){.ws117-panel-intro,.ws117-exception-stack,.dm117-stage-stats,.dm117-handoff-track,.fs117-card-grid,.fs117-board-meta{grid-template-columns:1fr}.dm117-stage-table .head{display:none}.dm117-stage-table article{grid-template-columns:1fr;gap:8px}.dm117-stage-table article span:first-child{grid-template-columns:20px 1fr}.dm117-health-board{padding:18px}.dm117-health-bars article{grid-template-columns:1fr}.dm117-track-line{display:none}.fs117-board-list article{flex-direction:column;align-items:flex-start}.fs117-security-visual{padding:18px}} @media(prefers-reduced-motion:reduce){.dm117-section[data-dm117-reveal],.fs117-section[data-fs117-reveal]{opacity:1!important;transform:none!important;transition:none!important}.dm117-track-line:after,.fs117-flow-track>i:after{animation:none!important}.dm117-health-bars i:before,.dm117-health-ring,.dm117-access-cards article,.fs117-card,.fs117-board-list article,.fs117-security-visual article{transition:none!important}} /* v118 targeted refinements */ .pa118-flow-eyebrow{color:#9b6700!important;background:#fff4d7!important;border-color:rgba(255,181,31,.28)!important;opacity:1!important} .ws118-shift-panel{display:none!important}.ws118-shift-panel.active{display:block!important}.ws118-shift-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:12px}.ws118-shift-summary article{padding:12px 14px;border-radius:16px;background:#fff;border:1px solid #e7eaf0}.ws118-shift-summary small,.ws118-shift-summary b,.ws118-shift-summary span{display:block}.ws118-shift-summary small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#8c6670}.ws118-shift-summary b{font-size:19px;margin:3px 0;color:#252a33}.ws118-shift-summary span{font-size:10px;color:#707986}.ws118-schedule-grid{background:#fff;border:1px solid #e6e9ef;border-radius:18px;overflow:hidden}.ws118-grid-head,.ws118-schedule-grid article{display:grid;grid-template-columns:1.35fr repeat(5,1fr);gap:0;align-items:center}.ws118-grid-head{background:#f7f8fa;color:#707986;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em}.ws118-grid-head span,.ws118-schedule-grid article>*{padding:10px 8px;border-left:1px solid #eceef2;text-align:center}.ws118-grid-head span:first-child,.ws118-schedule-grid article>b{border-left:0;text-align:left}.ws118-schedule-grid article{border-top:1px solid #eceef2}.ws118-schedule-grid article>b{display:flex;align-items:center;gap:8px;font-size:11px;color:#252a33}.ws118-schedule-grid article>b i{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:#252c36;color:#fff;font-style:normal;font-size:9px}.ws118-schedule-grid article>span{margin:6px 5px;padding:8px 4px;border:0;border-radius:10px;font-size:10px;font-weight:800}.ws118-schedule-grid .core{background:#fff3c9;color:#8f6200}.ws118-schedule-grid .late{background:#ffe1c4;color:#9a4c00}.ws118-schedule-grid .warn{background:#ffe1df;color:#ae3f37}.ws118-schedule-grid .off{background:#eef0f3;color:#737b86}.ws118-schedule-grid .half{background:#e9f7ef;color:#377956}.ws118-grid-legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px}.ws118-grid-legend span{font-size:10px;color:#9aa3b0;display:flex;align-items:center;gap:6px}.ws118-grid-legend i{width:8px;height:8px;border-radius:50%}.ws118-grid-legend i.core{background:#ffbf22}.ws118-grid-legend i.late{background:#ff8a1f}.ws118-grid-legend i.warn{background:#ff5b52}.ws118-grid-legend i.off{background:#8c95a3} .dm117-ownership-grid{align-items:stretch!important}.dm117-ownership-copy{display:flex;flex-direction:column;justify-content:center}.dm117-dashboard-figure{height:100%;min-height:560px;display:flex;flex-direction:column}.dm117-dashboard-figure img{flex:1;min-height:0;max-width:none!important;height:100%!important;object-fit:cover;border-radius:20px}.dm117-dashboard-figure figcaption{flex:0 0 auto} .dm118-section{padding:var(--global-section-space) 0}.dm118-access-head{text-align:center;max-width:850px;margin:0 auto 34px}.dm118-access-head>p{font-size:17px;line-height:1.62;color:var(--muted);max-width:760px;margin:16px auto 0}.dm118-access-layout{display:grid;grid-template-columns:.9fr 1.1fr;gap:24px;align-items:stretch}.dm118-access-photo{margin:0;position:relative;border-radius:30px;overflow:hidden;min-height:520px;box-shadow:0 24px 66px rgba(20,25,40,.1)}.dm118-access-photo img{width:100%;height:100%;object-fit:cover;display:block}.dm118-access-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;background:rgba(20,24,35,.84);backdrop-filter:blur(10px);border-radius:18px;color:#fff}.dm118-access-photo figcaption small{display:block;color:#ffcf68;font-size:11px;text-transform:uppercase;letter-spacing:.08em;margin-bottom:5px}.dm118-permission-map{position:relative;min-height:520px;border-radius:30px;background:#20252d;border:1px solid #303641;overflow:hidden}.dm118-permission-map:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.03) 1px,transparent 1px);background-size:32px 32px}.dm118-map-center,.dm118-role,.dm118-scope-note{position:absolute;z-index:2}.dm118-map-center{left:50%;top:46%;transform:translate(-50%,-50%);width:170px;height:170px;border-radius:50%;background:linear-gradient(135deg,var(--accent-3),var(--accent));display:grid;place-items:center;align-content:center;text-align:center;color:#252a33;box-shadow:0 0 0 16px rgba(255,181,31,.08)}.dm118-map-center span{width:42px;height:42px;border-radius:14px;background:rgba(255,255,255,.42);display:grid;place-items:center;font-weight:900}.dm118-map-center b,.dm118-map-center small{display:block;margin-top:5px}.dm118-map-center small{font-size:11px}.dm118-role{display:flex;align-items:center;gap:11px;padding:13px 15px;border-radius:17px;background:#29313c;border:1px solid rgba(255,255,255,.08);color:#fff;min-width:190px;transition:.3s}.dm118-role:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.32)}.dm118-role>span{width:38px;height:38px;border-radius:12px;background:rgba(255,181,31,.12);color:#ffcb58;display:grid;place-items:center;font-size:10px;font-weight:900}.dm118-role b,.dm118-role small{display:block}.dm118-role small{font-size:11px;color:#b9c1cc;margin-top:3px}.dm118-role.r1{left:6%;top:13%}.dm118-role.r2{right:6%;top:16%}.dm118-role.r3{right:8%;bottom:19%}.dm118-map-line{position:absolute;z-index:1;height:1px;background:linear-gradient(90deg,rgba(255,181,31,.05),rgba(255,181,31,.5),rgba(255,181,31,.05));transform-origin:left center}.dm118-map-line:after{content:"";position:absolute;top:-3px;left:0;width:7px;height:7px;border-radius:50%;background:#ffb800;animation:dm118Dot 2.5s linear infinite}.dm118-map-line.l1{width:30%;left:27%;top:34%;transform:rotate(26deg)}.dm118-map-line.l2{width:27%;left:52%;top:34%;transform:rotate(-28deg)}.dm118-map-line.l3{width:27%;left:54%;top:58%;transform:rotate(30deg)}.dm118-scope-note{left:6%;right:6%;bottom:7%;padding:14px 16px;border-radius:17px;background:#171c24;border:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;gap:16px;align-items:center;color:#fff}.dm118-scope-note a{color:#ffcb58;font-size:12px;font-weight:800} @keyframes dm118Dot{to{left:100%}} body:not(.home) .fs118-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance}body:not(.home) .fs118-section h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important}.fs118-section{padding:var(--global-section-space) 0}.fs118-section[data-fs118-reveal]{opacity:0;transform:translateY(28px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)}.fs118-section[data-fs118-reveal].is-visible{opacity:1;transform:none} .fs118-stream-grid,.fs118-routing-grid,.fs118-library-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,50px);align-items:center}.fs118-stream-copy>p,.fs118-preview-head>p,.fs118-routing-copy>p,.fs118-progress-head>p,.fs118-library-copy>p{font-size:17px;line-height:1.62;color:var(--muted)}.fs118-context-list{display:grid;gap:12px;margin-top:22px}.fs118-context-list article{padding:14px 0;border-top:1px solid rgba(37,42,51,.1);display:grid;grid-template-columns:150px 1fr;gap:14px}.fs118-context-list small{color:#5d6672;line-height:1.55}.fs118-stream-board{padding:22px;border-radius:30px;background:#20252d;color:#fff;box-shadow:0 28px 70px rgba(20,25,40,.14)}.fs118-stream-top{display:flex;justify-content:space-between;margin-bottom:18px}.fs118-stream-top span{padding:7px 10px;border-radius:999px;background:#2c3440;color:#ccd2db;font-size:11px}.fs118-message{display:grid;grid-template-columns:42px 1fr;gap:12px}.fs118-message>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33;font-weight:900}.fs118-message small{display:block;color:#c4cbd5;margin-top:4px}.fs118-message article{margin-top:14px;padding:14px;border-radius:18px;background:#2a313b;border:1px solid rgba(255,255,255,.08);display:grid;grid-template-columns:46px 1fr auto;gap:12px;align-items:center}.fs118-message article i{width:42px;height:42px;border-radius:12px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:900}.fs118-message article strong,.fs118-message article em{display:block}.fs118-message article em{font-size:11px;color:#adb6c2;font-style:normal;margin-top:4px}.fs118-message article button{border:0;border-radius:12px;padding:9px 12px;background:#fff;color:#252a33;font-weight:800}.fs118-replies{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.fs118-replies span{padding:8px 10px;border-radius:999px;background:#29313c;border:1px solid rgba(255,255,255,.07);font-size:10px;color:#cbd2db} .fs118-preview{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.fs118-preview-head{text-align:center;max-width:840px;margin:0 auto 34px}.fs118-preview-stage{display:grid;grid-template-columns:1.45fr .55fr;gap:18px;padding:18px;border-radius:32px;background:#20252d;box-shadow:0 28px 72px rgba(20,25,40,.12)}.fs118-preview-stage figure{margin:0;border-radius:22px;background:#111722;overflow:hidden}.fs118-preview-stage figure img{width:100%;height:100%;object-fit:cover;display:block}.fs118-preview-stage aside{display:grid;gap:12px}.fs118-preview-stage aside article{padding:18px;border-radius:20px;background:#29313c;border:1px solid rgba(255,255,255,.07);color:#fff;transition:.3s}.fs118-preview-stage aside article:hover,.fs118-preview-stage aside article.active{transform:translateX(-5px);border-color:rgba(255,181,31,.32)}.fs118-preview-stage aside span{width:38px;height:38px;border-radius:12px;background:rgba(255,181,31,.12);color:#ffcb58;display:grid;place-items:center;font-weight:900;margin-bottom:10px}.fs118-preview-stage aside small{display:block;color:#bfc7d1;margin-top:5px;line-height:1.5} .fs118-routing-visual{position:relative;min-height:520px;border-radius:32px;background:#20252d;overflow:hidden}.fs118-routing-visual:before{content:"";position:absolute;inset:0;background-image:radial-gradient(rgba(255,255,255,.05) 1px,transparent 1px);background-size:28px 28px}.fs118-file-node,.fs118-route{position:absolute;z-index:2}.fs118-file-node{left:50%;top:45%;transform:translate(-50%,-50%);width:190px;padding:20px;border-radius:24px;background:linear-gradient(135deg,#fff4d7,#ffd875);color:#252a33;text-align:center}.fs118-file-node span{display:inline-grid;place-items:center;width:44px;height:44px;border-radius:13px;background:rgba(255,255,255,.5);font-size:10px;font-weight:900}.fs118-file-node b,.fs118-file-node small{display:block;margin-top:5px}.fs118-route{padding:14px 16px;border-radius:18px;background:#29313c;border:1px solid rgba(255,255,255,.08);color:#fff;min-width:180px}.fs118-route span{display:inline-grid;place-items:center;width:36px;height:36px;border-radius:11px;background:rgba(255,181,31,.12);color:#ffcb58;font-size:9px;font-weight:900}.fs118-route b,.fs118-route small{display:block;margin-top:5px}.fs118-route small{color:#bfc7d1}.fs118-route.r1{left:5%;top:11%}.fs118-route.r2{right:5%;top:13%}.fs118-route.r3{right:7%;bottom:10%}.fs118-route-line{position:absolute;z-index:1;height:1px;background:linear-gradient(90deg,rgba(255,181,31,.05),rgba(255,181,31,.5),rgba(255,181,31,.05))}.fs118-route-line:after{content:"";position:absolute;top:-3px;left:0;width:7px;height:7px;border-radius:50%;background:#ffb800;animation:dm118Dot 2.4s linear infinite}.fs118-route-line.a{width:31%;left:24%;top:34%;transform:rotate(28deg)}.fs118-route-line.b{width:27%;left:53%;top:34%;transform:rotate(-28deg)}.fs118-route-line.c{width:27%;left:55%;top:59%;transform:rotate(30deg)}.fs118-routing-points{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.fs118-routing-points span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:800} .fs118-progress{background:#20252d;color:#fff}.fs118-progress .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.35);color:#9b6700!important;opacity:1!important}.fs118-progress-head{text-align:center;max-width:850px;margin:0 auto 34px}.fs118-progress-head>p{color:#cbd2dc}.fs118-progress-board{display:grid;gap:12px}.fs118-progress-board article{display:grid;grid-template-columns:1.4fr 1fr 70px;gap:18px;align-items:center;padding:18px 20px;border-radius:20px;background:#29313c;border:1px solid rgba(255,255,255,.07)}.fs118-progress-board article>div:first-child{display:flex;align-items:center;gap:12px}.fs118-progress-board .type{width:42px;height:42px;border-radius:12px;background:rgba(255,181,31,.12);color:#ffcb58;display:grid;place-items:center;font-size:9px;font-weight:900}.fs118-progress-board b,.fs118-progress-board small{display:block}.fs118-progress-board small{color:#bfc7d1;margin-top:4px}.fs118-progress-bar{height:9px;border-radius:999px;background:rgba(255,181,31,.12);overflow:hidden}.fs118-progress-bar i{display:block;height:100%;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left center;transition:transform 1.2s ease}.fs118-progress.is-visible .fs118-progress-bar i{transform:scaleX(1)} .fs118-library-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:22px}.fs118-library-stats article{padding:15px;border-radius:18px;background:#fff4d7;border:1px solid rgba(255,181,31,.2)}.fs118-library-stats b,.fs118-library-stats small{display:block}.fs118-library-stats b{font-size:22px;color:#8f6200}.fs118-library-stats small{font-size:11px;color:#6b5a35}.fs118-library-table{border:1px solid #e5e8ed;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 20px 52px rgba(20,25,40,.06)}.fs118-library-table .head,.fs118-library-table article{display:grid;grid-template-columns:1.5fr 1fr .8fr .7fr;gap:12px;align-items:center;padding:14px 16px}.fs118-library-table .head{background:#f7f8fa;color:#727b87;font-size:10px;text-transform:uppercase;letter-spacing:.06em;font-weight:800}.fs118-library-table article{border-top:1px solid #eceef2;font-size:12px}.fs118-library-table article span:first-child{display:flex;align-items:center;gap:8px;font-weight:700}.fs118-library-table i{width:32px;height:32px;border-radius:10px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-style:normal;font-size:8px;font-weight:900} @media(max-width:990px){.ws118-shift-summary,.dm118-access-layout,.fs118-stream-grid,.fs118-routing-grid,.fs118-library-grid{grid-template-columns:1fr}.dm117-dashboard-figure{min-height:480px}.fs118-preview-stage{grid-template-columns:1fr}.fs118-preview-stage aside{grid-template-columns:repeat(3,1fr)}.fs118-routing-visual{min-height:480px}} @media(max-width:680px){.ws118-grid-head{display:none}.ws118-schedule-grid article{grid-template-columns:1fr 1fr 1fr}.ws118-schedule-grid article>b{grid-column:1/-1}.dm118-permission-map{min-height:620px}.dm118-role{min-width:150px}.dm118-role.r1{left:4%;top:9%}.dm118-role.r2{right:4%;top:22%}.dm118-role.r3{right:5%;bottom:21%}.dm118-scope-note{flex-direction:column;align-items:flex-start}.fs118-context-list article{grid-template-columns:1fr}.fs118-preview-stage aside{grid-template-columns:1fr}.fs118-progress-board article{grid-template-columns:1fr}.fs118-library-stats{grid-template-columns:1fr}.fs118-library-table .head{display:none}.fs118-library-table article{grid-template-columns:1fr 1fr}.fs118-library-table article span:first-child{grid-column:1/-1}.fs118-routing-visual{min-height:580px}} @media(prefers-reduced-motion:reduce){.dm118-map-line:after,.fs118-route-line:after{animation:none!important}.fs118-section[data-fs118-reveal]{opacity:1!important;transform:none!important;transition:none!important}.fs118-progress-bar i,.dm118-role,.fs118-preview-stage aside article{transition:none!important}} /* v119 targeted device + file sharing refinements */ .dm119-command-detail{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:18px}.dm119-command-detail article{padding:15px 16px;border-radius:18px;background:#fff8e8;border:1px solid rgba(255,181,31,.18);transition:transform .3s ease,border-color .3s ease}.dm119-command-detail article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.36)}.dm119-command-detail b,.dm119-command-detail small{display:block}.dm119-command-detail small{margin-top:6px;color:#596472;line-height:1.55} .dm119-section{padding:var(--global-section-space) 0}.dm119-section[data-dm119-reveal]{opacity:0;transform:translateY(26px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)}.dm119-section[data-dm119-reveal].is-visible{opacity:1;transform:none} body:not(.home) .dm119-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance}.dm119-owner-header{display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:end;margin-bottom:34px}.dm119-owner-header>p{font-size:17px;line-height:1.62;color:var(--muted);margin:0}.dm119-owner-workspace{display:grid;grid-template-columns:.78fr 1.22fr;gap:18px;align-items:stretch}.dm119-person-panel{padding:24px;border-radius:30px;background:#20252d;color:#fff;display:flex;flex-direction:column}.dm119-person-id{display:flex;align-items:center;gap:14px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.08)}.dm119-person-id>span{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;background:linear-gradient(135deg,var(--accent-3),var(--accent));color:#252a33;font-weight:900}.dm119-person-id b,.dm119-person-id small{display:block}.dm119-person-id small{margin-top:3px;color:#b9c2cc}.dm119-person-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.dm119-person-meta article{padding:14px;border-radius:16px;background:#29313c;border:1px solid rgba(255,255,255,.07);transition:.3s}.dm119-person-meta article:hover{transform:translateY(-3px);border-color:rgba(255,181,31,.3)}.dm119-person-meta small,.dm119-person-meta b{display:block}.dm119-person-meta small{font-size:11px;color:#aeb7c2}.dm119-person-meta b{margin-top:5px;font-size:14px}.dm119-person-meta .good{color:#79dea3}.dm119-person-note{margin-top:auto;padding:16px;border-radius:18px;background:#fff4d7;color:#252a33}.dm119-person-note b,.dm119-person-note small{display:block}.dm119-person-note small{margin-top:5px;color:#64593d;line-height:1.55}.dm119-owner-dashboard{padding:18px;border-radius:30px;background:#f7f8fa;border:1px solid #e3e6eb;display:flex;flex-direction:column;min-height:100%}.dm119-dash-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:14px}.dm119-dash-head span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:800}.dm119-owner-dashboard img{width:100%;height:100%;min-height:360px;object-fit:cover;object-position:center;border-radius:22px;display:block;flex:1}.dm119-dash-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.dm119-dash-strip span{padding:12px 13px;border-radius:16px;background:#fff;border:1px solid #e3e6eb}.dm119-dash-strip b,.dm119-dash-strip small{display:block}.dm119-dash-strip small{margin-top:3px;color:#6b7480;font-size:11px} .dm119-access{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.dm119-access-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,4vw,50px);align-items:center}.dm119-access-copy>p{font-size:17px;line-height:1.62;color:var(--muted)}.dm119-access-list{display:grid;gap:10px;margin:22px 0}.dm119-access-list article{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:start;padding:14px 0;border-top:1px solid rgba(37,42,51,.1)}.dm119-access-list article>span{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-weight:900;font-size:10px}.dm119-access-list b,.dm119-access-list small{display:block}.dm119-access-list small{margin-top:4px;color:#5f6975;line-height:1.55}.dm119-access-canvas{padding:16px;border-radius:32px;background:#20252d;color:#fff;box-shadow:0 28px 72px rgba(20,25,40,.13)}.dm119-access-photo{margin:0;border-radius:22px;overflow:hidden}.dm119-access-photo img{display:block;width:100%;height:250px;object-fit:cover}.dm119-scope-rail{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.dm119-scope-rail article{padding:14px;border-radius:18px;background:#29313c;border:1px solid rgba(255,255,255,.07);transition:.3s}.dm119-scope-rail article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.3)}.dm119-scope-rail article.active{background:#fff4d7;color:#252a33}.dm119-scope-rail span{display:inline-grid;place-items:center;width:34px;height:34px;border-radius:11px;background:rgba(255,181,31,.12);color:#ffcb58;font-size:9px;font-weight:900}.dm119-scope-rail .active span{background:#fff;color:#9b6700}.dm119-scope-rail b,.dm119-scope-rail small,.dm119-scope-rail strong{display:block}.dm119-scope-rail b{margin-top:8px}.dm119-scope-rail small{margin-top:3px;color:#bac3cd;line-height:1.45}.dm119-scope-rail .active small{color:#6a6045}.dm119-scope-rail strong{margin-top:10px;font-size:11px;color:#ffcf68}.dm119-scope-rail .active strong{color:#9b6700}.dm119-access-foot{display:flex;justify-content:space-between;gap:18px;align-items:center;margin-top:12px;padding:14px 16px;border-radius:18px;background:#29313c}.dm119-access-foot span{display:flex;align-items:center;gap:9px;font-weight:700}.dm119-access-foot i{width:9px;height:9px;border-radius:50%;background:#53d587;box-shadow:0 0 0 5px rgba(83,213,135,.12)}.dm119-access-foot small{color:#b9c2cc;max-width:300px;line-height:1.5} .fs119-stream-detail{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.fs119-stream-detail article{padding:12px;border-radius:15px;background:#29313c;border:1px solid rgba(255,255,255,.07);transition:.3s}.fs119-stream-detail article:hover{transform:translateY(-3px);border-color:rgba(255,181,31,.3)}.fs119-stream-detail small,.fs119-stream-detail b{display:block}.fs119-stream-detail small{font-size:10px;color:#aeb7c2}.fs119-stream-detail b{margin-top:4px;font-size:12px}.fs119-stream-note{margin-top:10px;padding:14px 16px;border-radius:16px;background:#fff4d7;color:#252a33}.fs119-stream-note b,.fs119-stream-note small{display:block}.fs119-stream-note small{margin-top:5px;color:#655a3f;line-height:1.55}.fs118-preview-stage aside article{display:flex;flex-direction:column;justify-content:flex-start}.fs118-preview-stage aside small{line-height:1.65}.fs118-preview-stage aside b{display:block;line-height:1.35} .fs119-section{padding:var(--global-section-space) 0}.fs119-section[data-fs119-reveal]{opacity:0;transform:translateY(26px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)}.fs119-section[data-fs119-reveal].is-visible{opacity:1;transform:none}body:not(.home) .fs119-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance}.fs119-routing-head{text-align:center;max-width:860px;margin:0 auto 34px}.fs119-routing-head>p{font-size:17px;line-height:1.62;color:var(--muted);max-width:720px;margin:16px auto 0}.fs119-routing-workspace{display:grid;grid-template-columns:.9fr 1.1fr;gap:18px;align-items:stretch}.fs119-file-ticket{padding:24px;border-radius:30px;background:#fff;border:1px solid #e4e7ec;box-shadow:0 22px 58px rgba(20,25,40,.07);display:flex;flex-direction:column}.fs119-file-top{display:flex;gap:14px;align-items:center;padding-bottom:18px;border-bottom:1px solid #eceef2}.fs119-file-top>span{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:10px;font-weight:900}.fs119-file-top b,.fs119-file-top small{display:block}.fs119-file-top small{margin-top:4px;color:#69727f}.fs119-file-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.fs119-file-meta article{padding:13px;border-radius:16px;background:#f8f9fb}.fs119-file-meta small,.fs119-file-meta b{display:block}.fs119-file-meta small{font-size:10px;color:#78818d}.fs119-file-meta b{margin-top:4px;font-size:13px}.fs119-file-note{margin-top:auto;padding:16px;border-radius:18px;background:#20252d;color:#fff}.fs119-file-note b,.fs119-file-note small{display:block}.fs119-file-note small{margin-top:6px;color:#c1c9d2;line-height:1.6}.fs119-access-lanes{padding:20px;border-radius:30px;background:#20252d;border:1px solid #303641;display:grid;gap:12px}.fs119-access-lanes>article{display:grid;grid-template-columns:46px 1fr auto;gap:12px;align-items:center;padding:16px;border-radius:18px;background:#29313c;border:1px solid rgba(255,255,255,.07);transition:.3s}.fs119-access-lanes>article:hover{transform:translateX(5px);border-color:rgba(255,181,31,.3)}.fs119-access-lanes>article>span{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(255,181,31,.12);color:#ffcb58;font-size:9px;font-weight:900}.fs119-access-lanes b,.fs119-access-lanes small{display:block}.fs119-access-lanes small{margin-top:3px;color:#b9c2cc}.fs119-access-lanes strong{padding:7px 10px;border-radius:999px;font-size:10px;background:#effaf3;color:#258954}.fs119-access-lanes .edit strong{background:#fff4d7;color:#9b6700}.fs119-access-lanes .blocked{opacity:.74}.fs119-access-lanes .blocked strong{background:#f3f4f6;color:#596472}.fs119-boundary{position:relative;padding:16px 16px 16px 42px;border-radius:18px;background:#252c36;border:1px dashed rgba(255,181,31,.28)}.fs119-boundary i{position:absolute;left:18px;top:16px;width:2px;height:calc(100% - 32px);background:linear-gradient(var(--accent-3),var(--accent-2));overflow:hidden}.fs119-boundary i:after{content:"";position:absolute;top:-8px;left:-3px;width:8px;height:8px;border-radius:50%;background:#ffb800;animation:fs119Boundary 2s linear infinite}.fs119-boundary span,.fs119-boundary small{display:block}.fs119-boundary span{font-weight:800}.fs119-boundary small{margin-top:4px;color:#b9c2cc;line-height:1.5}.fs119-routing-footer{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-top:18px}.fs119-routing-footer>div{display:flex;gap:10px;flex-wrap:wrap}.fs119-routing-footer>div span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:800}@keyframes fs119Boundary{to{top:100%}} @media(max-width:990px){.dm119-owner-header,.dm119-owner-workspace,.dm119-access-grid,.fs119-routing-workspace{grid-template-columns:1fr}.dm119-owner-header{gap:16px}.dm119-scope-rail{grid-template-columns:1fr 1fr 1fr}.fs119-routing-footer{align-items:flex-start;flex-direction:column}} @media(max-width:680px){.dm119-command-detail,.dm119-person-meta,.dm119-dash-strip,.dm119-scope-rail,.fs119-stream-detail,.fs119-file-meta{grid-template-columns:1fr}.dm119-access-foot{flex-direction:column;align-items:flex-start}.fs119-access-lanes>article{grid-template-columns:42px 1fr}.fs119-access-lanes strong{grid-column:2;justify-self:start}} @media(prefers-reduced-motion:reduce){.dm119-section[data-dm119-reveal],.fs119-section[data-fs119-reveal]{opacity:1!important;transform:none!important;transition:none!important}.fs119-boundary i:after{animation:none!important}.dm119-command-detail article,.dm119-person-meta article,.dm119-scope-rail article,.fs119-stream-detail article,.fs119-access-lanes>article{transition:none!important}} /* v120 device + schedule fill and Remote Teams main page */ .dm120-assignment-trail{display:grid;gap:10px;margin:18px 0}.dm120-assignment-trail article{display:grid;grid-template-columns:34px 1fr;gap:12px;align-items:start;padding:12px 0;border-top:1px solid rgba(255,255,255,.08)}.dm120-assignment-trail article>span{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;background:rgba(255,181,31,.14);color:#ffcf68;font-size:9px;font-weight:900}.dm120-assignment-trail b,.dm120-assignment-trail small{display:block}.dm120-assignment-trail b{font-size:14px}.dm120-assignment-trail small{margin-top:4px;color:#b9c2cc;line-height:1.55}.dm120-assignment-trail article{transition:.3s}.dm120-assignment-trail article:hover{transform:translateX(4px)} .ws120-shift-insight{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:12px}.ws120-shift-insight article{display:grid;grid-template-columns:14px 1fr;gap:9px;padding:12px 13px;border-radius:15px;background:#2a313b;border:1px solid #363e49}.ws120-shift-insight .dot{width:8px;height:8px;border-radius:50%;margin-top:5px}.ws120-shift-insight .dot.good{background:#53d587}.ws120-shift-insight .dot.warn{background:#ff5b52}.ws120-shift-insight .dot.late{background:#ffb522}.ws120-shift-insight b,.ws120-shift-insight small{display:block}.ws120-shift-insight b{font-size:11px;color:#fff}.ws120-shift-insight small{font-size:10px;line-height:1.45;color:#aeb7c2;margin-top:3px}.ws120-shift-insight article{transition:.3s}.ws120-shift-insight article:hover{transform:translateY(-3px);border-color:rgba(255,181,31,.28)} .rt120-section{padding:var(--global-section-space) 0}.rt120-page [data-rt120-reveal]{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.rt120-page [data-rt120-reveal].is-visible{opacity:1;transform:none} body:not(.home) .rt120-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance}body:not(.home) .rt120-page h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .rt120-control-grid,.rt120-handoff-grid,.rt120-balance-grid,.rt120-trust-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,50px);align-items:center}.rt120-control-copy>p,.rt120-handoff-copy>p,.rt120-balance-copy>p,.rt120-policy-copy>p,.rt120-trust-copy>p,.rt120-metrics-head>p,.rt120-expand-head>p{font-size:17px;line-height:1.65;color:var(--muted)} .rt120-control-points{display:grid;gap:0;margin-top:24px}.rt120-control-points article{display:grid;grid-template-columns:40px 1fr;gap:14px;padding:15px 0;border-top:1px solid rgba(37,42,51,.1);transition:.3s}.rt120-control-points article:hover{transform:translateX(5px)}.rt120-control-points article>span{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:10px;font-weight:900}.rt120-control-points b,.rt120-control-points small{display:block}.rt120-control-points small{margin-top:4px;color:#5f6975;line-height:1.55} .rt120-control-board{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;color:#fff;box-shadow:0 30px 80px rgba(22,28,36,.15)}.rt120-board-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.rt120-board-head b,.rt120-board-head small{display:block}.rt120-board-head small{color:#aeb7c2;margin-top:3px}.rt120-board-head>span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#d0d6de;font-size:12px;font-weight:800}.rt120-timezones{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.rt120-timezones article{padding:14px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.3s}.rt120-timezones article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.28)}.rt120-timezones span,.rt120-timezones b,.rt120-timezones small{display:block}.rt120-timezones span{font-size:18px;font-weight:800;color:#ffcf68}.rt120-timezones b{margin-top:5px}.rt120-timezones small{margin-top:3px;color:#b8c0ca}.rt120-people-list{display:grid;gap:10px;margin-top:12px}.rt120-people-list article{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.06)}.rt120-people-list .avatar{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:#353e4a;font-size:9px;font-weight:900}.rt120-people-list b,.rt120-people-list small{display:block}.rt120-people-list small{margin-top:3px;color:#b8c0ca}.rt120-people-list strong{font-size:11px;color:#ffcf68}.rt120-people-list strong.good{color:#79dea3}.rt120-people-list strong.pause{color:#aeb7c2}.rt120-board-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.rt120-board-foot article{padding:13px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.06)}.rt120-board-foot small,.rt120-board-foot b{display:block}.rt120-board-foot small{color:#aeb7c2;font-size:11px}.rt120-board-foot b{margin-top:4px} .rt120-metrics{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.rt120-metrics-head,.rt120-expand-head,.rt120-handoff-head,.rt120-policy-copy{max-width:820px}.rt120-metrics-head{margin:0 auto 38px;text-align:center}.rt120-metric-lanes{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.rt120-metric-lanes article{padding:24px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 18px 44px rgba(22,28,36,.05);transition:.32s}.rt120-metric-lanes article:hover{transform:translateY(-6px)}.rt120-metric-lanes span,.rt120-metric-lanes b,.rt120-metric-lanes small{display:block}.rt120-metric-lanes span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#9b6700;font-weight:900}.rt120-metric-lanes b{font-size:28px;margin:10px 0 5px}.rt120-metric-lanes small{color:#66707d;line-height:1.55}.rt120-metric-lanes i{display:block;height:8px;margin-top:22px;border-radius:999px;background:#fff4d7;overflow:hidden;position:relative}.rt120-metric-lanes i:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)}.rt120-metrics.is-visible .rt120-metric-lanes i:after{transform:scaleX(1)} .rt120-expansion{--rt-expand:0;background:#20252d;color:#fff;overflow:hidden}.rt120-expand-head{text-align:center;margin:0 auto 34px}.rt120-expansion .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.35);color:#9b6700!important}.rt120-expand-head>p{color:#c6ced8}.rt120-expand-stage{width:100%;display:grid;gap:18px}.rt120-expand-media{width:calc(74% + (26% * var(--rt-expand)));margin:auto;position:relative;border-radius:calc(34px - (10px * var(--rt-expand)));overflow:hidden;transform:scale(calc(.94 + (.06 * var(--rt-expand))));box-shadow:0 36px 90px rgba(0,0,0,.28)}.rt120-expand-media img{display:block;width:100%;height:clamp(420px,55vw,690px);object-fit:cover}.rt120-expand-overlay{position:absolute;left:20px;right:20px;bottom:20px;padding:18px 20px;border-radius:20px;background:rgba(16,20,32,.82);backdrop-filter:blur(12px)}.rt120-expand-overlay span,.rt120-expand-overlay b{display:block}.rt120-expand-overlay span{font-size:11px;text-transform:uppercase;letter-spacing:.08em;color:#ffcf68;font-weight:900}.rt120-expand-overlay b{margin-top:6px;font-size:20px}.rt120-expand-context{width:min(1100px,calc(100% - 40px));margin:auto;display:grid;grid-template-columns:repeat(3,1fr);gap:14px;opacity:calc(.15 + (.85 * var(--rt-expand)));transform:translateY(calc(24px - (24px * var(--rt-expand))))}.rt120-expand-context article{padding:20px;border-radius:22px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.3s}.rt120-expand-context article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.28)}.rt120-expand-context b,.rt120-expand-context small{display:block}.rt120-expand-context small{margin-top:6px;color:#c2cad4;line-height:1.6} .rt120-handoff-board{position:relative;display:grid;gap:12px;padding:24px;border-radius:30px;background:#f8f9fb;border:1px solid #e4e7ec}.rt120-handoff-line{position:absolute;left:44px;top:42px;bottom:42px;width:2px;background:linear-gradient(#ffb522,#ff6a37,#ff315f);overflow:hidden}.rt120-handoff-line:after{content:"";position:absolute;left:-3px;top:-12%;width:8px;height:54px;border-radius:999px;background:linear-gradient(180deg,rgba(255,255,255,0),#fff,rgba(255,255,255,0));animation:rt120FlowDown 2.3s linear infinite}.rt120-handoff-board article{position:relative;display:grid;grid-template-columns:54px 1fr;gap:14px;padding:16px;border-radius:20px;background:#fff;border:1px solid #e6e9ee;transition:.3s}.rt120-handoff-board article:hover{transform:translateX(5px)}.rt120-handoff-board article>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#20252d;color:#ffcf68;font-size:9px;font-weight:900;z-index:1}.rt120-handoff-board small,.rt120-handoff-board b,.rt120-handoff-board p{display:block}.rt120-handoff-board small{color:#9b6700;font-weight:800}.rt120-handoff-board b{margin-top:4px}.rt120-handoff-board p{margin:6px 0 0;color:#616b78;line-height:1.55;font-size:14px} .rt120-balance-photo{margin:0;position:relative;border-radius:30px;overflow:hidden;box-shadow:0 24px 70px rgba(22,28,36,.1)}.rt120-balance-photo img{display:block;width:100%;height:100%;min-height:520px;object-fit:cover}.rt120-balance-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;border-radius:18px;background:rgba(16,20,32,.84);backdrop-filter:blur(10px);color:#fff}.rt120-balance-photo figcaption small{display:block;color:#ffcf68;text-transform:uppercase;letter-spacing:.08em;font-size:11px;font-weight:900}.rt120-balance-photo figcaption b{display:block;margin-top:6px;line-height:1.35}.rt120-balance-bars{display:grid;gap:14px;margin-top:24px}.rt120-balance-bars article{display:grid;grid-template-columns:150px 1fr auto;gap:14px;align-items:center}.rt120-balance-bars b,.rt120-balance-bars small{display:block}.rt120-balance-bars small{color:#6a7380;margin-top:3px}.rt120-balance-bars i{display:block;height:10px;border-radius:999px;background:#fff4d7;overflow:hidden;position:relative}.rt120-balance-bars i:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)}.rt120-balance.is-visible .rt120-balance-bars i:after{transform:scaleX(1)}.rt120-balance-bars strong{font-size:12px;color:#9b6700} .rt120-policy{background:#20252d;color:#fff}.rt120-policy-shell{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(28px,5vw,64px);align-items:center}.rt120-policy .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.3);color:#9b6700!important}.rt120-policy-copy>p{color:#c6ced8}.rt120-policy-matrix{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rt120-policy-matrix article{padding:22px;border-radius:22px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.3s}.rt120-policy-matrix article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.28)}.rt120-policy-matrix span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(255,181,31,.14);color:#ffcf68;font-size:10px;font-weight:900}.rt120-policy-matrix b,.rt120-policy-matrix small{display:block}.rt120-policy-matrix b{margin-top:12px}.rt120-policy-matrix small{margin-top:6px;color:#c4ccd5;line-height:1.6} .rt120-trust-links{display:grid;margin-top:20px}.rt120-trust-links a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(37,42,51,.1);font-weight:750;color:inherit}.rt120-trust-links a span{transition:.3s}.rt120-trust-links a:hover{color:#d98700}.rt120-trust-links a:hover span{transform:translateX(5px)}.rt120-trust-map{position:relative;min-height:500px;border-radius:32px;background:radial-gradient(circle at center,rgba(255,181,31,.16),transparent 42%),linear-gradient(rgba(37,42,51,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(37,42,51,.05) 1px,transparent 1px);background-size:auto,34px 34px,34px 34px;border:1px solid rgba(37,42,51,.08);overflow:hidden}.rt120-trust-core,.rt120-trust-map article{position:absolute;padding:16px;border-radius:20px;background:#fff;border:1px solid rgba(37,42,51,.1);box-shadow:0 18px 40px rgba(22,28,36,.07);z-index:2}.rt120-trust-core{left:50%;top:50%;transform:translate(-50%,-50%);text-align:center;background:#20252d;color:#fff;min-width:180px}.rt120-trust-map article{min-width:160px}.rt120-trust-map article.a{left:6%;top:12%}.rt120-trust-map article.b{right:6%;top:20%}.rt120-trust-map article.c{right:16%;bottom:10%}.rt120-trust-core span,.rt120-trust-map article span{display:inline-grid;place-items:center;width:38px;height:38px;border-radius:12px;background:#fff4d7;color:#9b6700;font-size:9px;font-weight:900}.rt120-trust-core span{background:rgba(255,181,31,.16);color:#ffcf68}.rt120-trust-core b,.rt120-trust-core small,.rt120-trust-map article b,.rt120-trust-map article small{display:block}.rt120-trust-core b,.rt120-trust-map article b{margin-top:8px}.rt120-trust-core small{color:#b8c0ca}.rt120-trust-map article small{color:#66707d;margin-top:4px}.rt120-trust-map>i{position:absolute;height:2px;background:linear-gradient(90deg,rgba(255,181,31,.12),rgba(255,181,31,.65));transform-origin:left;z-index:1}.rt120-trust-map>i:after{content:"";position:absolute;top:50%;left:0;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;background:#ffb522;animation:rt120FlowLine 2s linear infinite}.rt120-trust-map .l1{left:26%;top:34%;width:27%;transform:rotate(22deg)}.rt120-trust-map .l2{left:50%;top:47%;width:30%;transform:rotate(-22deg)}.rt120-trust-map .l3{left:51%;top:57%;width:27%;transform:rotate(29deg)} @keyframes rt120FlowDown{to{top:110%}}@keyframes rt120FlowLine{to{left:100%}} @media(max-width:990px){.dm120-assignment-trail{margin-bottom:18px}.ws120-shift-insight,.rt120-control-grid,.rt120-handoff-grid,.rt120-balance-grid,.rt120-policy-shell,.rt120-trust-grid{grid-template-columns:1fr}.rt120-metric-lanes,.rt120-expand-context{grid-template-columns:1fr 1fr}.rt120-trust-map{min-height:480px}.rt120-expand-media{width:calc(88% + (12% * var(--rt-expand)))}} @media(max-width:680px){.ws120-shift-insight,.rt120-timezones,.rt120-board-foot,.rt120-metric-lanes,.rt120-expand-context,.rt120-policy-matrix{grid-template-columns:1fr}.rt120-people-list article{grid-template-columns:42px 1fr}.rt120-people-list strong{grid-column:2}.rt120-balance-bars article{grid-template-columns:1fr}.rt120-expand-media{width:calc(94% + (6% * var(--rt-expand)))}.rt120-expand-media img{height:420px}.rt120-trust-map{min-height:620px}.rt120-trust-map article.a{left:4%;top:10%}.rt120-trust-map article.b{right:4%;top:28%}.rt120-trust-map article.c{right:6%;bottom:11%}.rt120-trust-map>i{display:none}} @media(prefers-reduced-motion:reduce){.rt120-page [data-rt120-reveal]{opacity:1!important;transform:none!important;transition:none!important}.rt120-expansion{--rt-expand:1!important}.rt120-handoff-line:after,.rt120-trust-map>i:after{animation:none!important}.rt120-metric-lanes i:after,.rt120-balance-bars i:after,.rt120-control-points article,.rt120-timezones article,.rt120-policy-matrix article{transition:none!important}} /* v121 remote teams targeted refinements */ .rt120-control-copy{display:flex;flex-direction:column;justify-content:center} .rt120-control-points article:last-child{padding-bottom:0} .rt121-progress{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:22px} .rt121-progress i{margin-top:0!important} .rt121-progress span{font-size:12px!important;letter-spacing:0!important;text-transform:none!important;color:#9b6700!important;font-weight:900!important;min-width:34px;text-align:right} .rt120-metric-lanes .rt121-progress i{display:block;height:8px;border-radius:999px;background:#fff4d7;overflow:hidden;position:relative} .rt120-metric-lanes .rt121-progress i:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)} .rt120-metrics.is-visible .rt121-progress i:after{transform:scaleX(1)} .rt120-expansion .rt120-expand-stage{padding-inline:clamp(18px,3.5vw,56px);box-sizing:border-box} .rt120-expansion .rt120-expand-media{max-width:1320px} .rt120-expansion .rt120-expand-context{width:min(1160px,100%);padding-inline:0} .rt121-handoff-notes{display:grid;gap:10px;margin:22px 0} .rt121-handoff-notes article{padding:15px 17px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,181,31,.16);transition:transform .3s ease,border-color .3s ease} .rt121-handoff-notes article:hover{transform:translateX(5px);border-color:rgba(255,181,31,.34)} .rt121-handoff-notes b,.rt121-handoff-notes small{display:block} .rt121-handoff-notes b{font-size:14px} .rt121-handoff-notes small{margin-top:5px;color:#626c79;line-height:1.55} .rt121-balance-progress{display:grid;grid-template-columns:1fr 42px;gap:10px;align-items:center} .rt121-balance-progress i{margin:0!important} .rt121-balance-progress span{font-size:12px;font-weight:900;color:#9b6700;text-align:right} .rt120-balance-bars .rt121-balance-progress i{display:block;height:10px;border-radius:999px;background:#fff4d7;overflow:hidden;position:relative} .rt120-balance-bars .rt121-balance-progress i:after{content:"";position:absolute;inset:0 auto 0 0;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)} .rt120-balance.is-visible .rt121-balance-progress i:after{transform:scaleX(1)} .rt121-section{padding:var(--global-section-space) 0} .rt121-access{background:linear-gradient(180deg,#fff 0%,#fff9ee 100%)} .rt121-access-head{max-width:900px;margin:0 auto 38px;text-align:center} .rt121-access-head>p{max-width:760px;margin:16px auto 0;color:var(--muted);font-size:17px;line-height:1.65} .rt121-access-layout{display:grid;grid-template-columns:.9fr 1.35fr .8fr;gap:18px;align-items:stretch} .rt121-access-rail{display:grid;gap:12px;align-content:center} .rt121-access-rail article{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:18px;border-radius:22px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 16px 38px rgba(22,28,36,.05);transition:.32s} .rt121-access-rail article:hover,.rt121-access-rail article.active{transform:translateY(-4px);border-color:rgba(255,181,31,.3)} .rt121-access-rail article>span{width:38px;height:38px;border-radius:13px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:10px;font-weight:900} .rt121-access-rail b,.rt121-access-rail small{display:block} .rt121-access-rail small{margin-top:5px;color:#66707d;line-height:1.55} .rt121-access-canvas{padding:20px;border-radius:30px;background:#20252d;border:1px solid #303641;color:#fff;box-shadow:0 26px 68px rgba(22,28,36,.13);display:flex;flex-direction:column} .rt121-access-top,.rt121-access-foot{display:flex;justify-content:space-between;align-items:center;gap:14px} .rt121-access-top span,.rt121-access-foot span{display:flex;align-items:center;gap:8px;color:#c7ced7;font-size:12px} .rt121-access-top i,.rt121-access-foot i{width:9px;height:9px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.1)} .rt121-scope-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin:18px 0;flex:1} .rt121-scope-grid article{padding:16px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.32s} .rt121-scope-grid article:hover{transform:translateY(-4px)} .rt121-scope-grid article.allowed:hover{border-color:rgba(83,213,135,.34)} .rt121-scope-grid article.locked:hover{border-color:rgba(255,106,55,.3)} .rt121-scope-grid small,.rt121-scope-grid b,.rt121-scope-grid span{display:block} .rt121-scope-grid small{font-size:9px;letter-spacing:.09em;color:#96a1b1} .rt121-scope-grid b{margin:7px 0 5px;font-size:16px} .rt121-scope-grid span{font-size:12px;color:#c3cad3} .rt121-scope-grid .allowed:before,.rt121-scope-grid .locked:before{content:"";display:block;width:8px;height:8px;border-radius:50%;float:right;margin-top:2px} .rt121-scope-grid .allowed:before{background:#53d587} .rt121-scope-grid .locked:before{background:#ff6a37} .rt121-access-side{display:flex;flex-direction:column;gap:12px;justify-content:center} .rt121-access-side>article{padding:20px;border-radius:22px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 16px 38px rgba(22,28,36,.05);transition:.32s} .rt121-access-side>article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.3)} .rt121-access-side small,.rt121-access-side b,.rt121-access-side p{display:block} .rt121-access-side small{font-size:11px;color:#9b6700;font-weight:800;text-transform:uppercase;letter-spacing:.07em} .rt121-access-side b{font-size:21px;margin:7px 0} .rt121-access-side p{margin:0;color:#626c79;font-size:14px;line-height:1.55} .rt121-access-side .btn{margin-top:4px;width:100%;justify-content:space-between} @media(max-width:1100px){.rt121-access-layout{grid-template-columns:1fr 1fr}.rt121-access-side{grid-column:1/-1;display:grid;grid-template-columns:1fr 1fr auto;align-items:stretch}.rt121-access-side .btn{width:auto;align-self:center}} @media(max-width:990px){.rt121-access-layout{grid-template-columns:1fr}.rt121-access-side{grid-column:auto;grid-template-columns:1fr 1fr}.rt121-access-side .btn{grid-column:1/-1;width:100%}.rt120-expansion .rt120-expand-stage{padding-inline:18px}} @media(max-width:680px){.rt121-access-side,.rt121-scope-grid{grid-template-columns:1fr}.rt121-balance-progress{grid-template-columns:1fr 38px}.rt121-progress{grid-template-columns:1fr 34px}} @media(prefers-reduced-motion:reduce){.rt121-handoff-notes article,.rt121-access-rail article,.rt121-scope-grid article,.rt121-access-side>article{transition:none!important}.rt120-metric-lanes .rt121-progress i:after,.rt120-balance-bars .rt121-balance-progress i:after{transition:none!important;transform:scaleX(1)!important}} /* v122 Remote handoff balance + BPO & Call Centers main page */ .rt121-handoff-notes{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.rt121-handoff-notes article{min-width:0}.rt120-handoff-copy{align-self:stretch;display:flex;flex-direction:column}.rt120-handoff-copy>.btn{align-self:flex-start}.rt120-handoff-board{align-self:stretch} body:not(.home) .bpo122-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance} body:not(.home) .bpo122-page h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .bpo122-section{padding:var(--global-section-space) 0}.bpo122-section[data-bpo122-reveal]{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s cubic-bezier(.2,.8,.2,1)}.bpo122-section[data-bpo122-reveal].is-visible{opacity:1;transform:none} .bpo122-ops-grid,.bpo122-between-grid,.bpo122-capacity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,52px);align-items:center}.bpo122-ops-copy>p,.bpo122-between-copy>p,.bpo122-capacity-copy>p,.bpo122-sla-head>p,.bpo122-expand-head>p,.bpo122-clients-head>p{font-size:17px;line-height:1.65;color:var(--muted)} .bpo122-ops-points{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.bpo122-ops-points article{padding:16px 17px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,181,31,.18);transition:.3s}.bpo122-ops-points article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.36)}.bpo122-ops-points b,.bpo122-ops-points small{display:block}.bpo122-ops-points small{margin-top:6px;color:#626c79;line-height:1.55} .bpo122-liveboard{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;color:#fff;box-shadow:0 28px 78px rgba(22,28,36,.16)}.bpo122-live-head,.bpo122-live-foot{display:flex;justify-content:space-between;align-items:center;gap:16px}.bpo122-live-head b,.bpo122-live-head small{display:block}.bpo122-live-head small{color:#aeb7c2;margin-top:3px}.bpo122-live-head>span{padding:8px 11px;border-radius:999px;background:#28303a;color:#c9d0d9;font-size:12px;font-weight:800}.bpo122-live-head>span i,.bpo122-live-foot>span i{display:inline-block;width:9px;height:9px;border-radius:50%;background:#53d587;margin-right:7px;box-shadow:0 0 0 6px rgba(83,213,135,.1)}.bpo122-live-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.bpo122-live-metrics article{padding:14px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.bpo122-live-metrics small,.bpo122-live-metrics b,.bpo122-live-metrics em{display:block}.bpo122-live-metrics small{color:#aeb7c2}.bpo122-live-metrics b{font-size:19px;margin:5px 0}.bpo122-live-metrics em{font-size:11px;font-style:normal;color:#ffcf68}.bpo122-queue-table{overflow:hidden;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.bpo122-queue-table .head,.bpo122-queue-table article{display:grid;grid-template-columns:1.2fr .7fr 1fr .7fr;gap:12px;align-items:center;padding:13px 16px}.bpo122-queue-table .head{background:#242a33;color:#9fa8b5;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.bpo122-queue-table article{border-top:1px solid rgba(255,255,255,.06);font-size:13px}.bpo122-queue-table article>span:nth-child(3){height:9px;border-radius:999px;background:rgba(255,181,31,.12);overflow:hidden}.bpo122-queue-table article>span:nth-child(3) i{display:block;height:100%;width:var(--target);border-radius:inherit;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.15s cubic-bezier(.2,.75,.2,1)}.bpo122-ops.is-visible .bpo122-queue-table i{transform:scaleX(1)}.bpo122-queue-table strong{font-size:11px;color:#7de0a7}.bpo122-queue-table strong.watch{color:#ffcf68}.bpo122-live-foot{padding-top:14px;color:#bdc5cf;font-size:12px} .bpo122-sla{background:#20252d;color:#fff}.bpo122-sla .eyebrow,.bpo122-expand .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.32);color:#9b6700!important}.bpo122-sla-head,.bpo122-expand-head,.bpo122-clients-head{max-width:860px;margin:0 auto 36px;text-align:center}.bpo122-sla-head>p,.bpo122-expand-head>p{color:#c5cdd7}.bpo122-sla-layout{display:grid;grid-template-columns:1.05fr .95fr;gap:26px;align-items:stretch}.bpo122-sla-radar{min-height:440px;position:relative;border-radius:32px;background:radial-gradient(circle at center,rgba(255,181,31,.14),transparent 38%),linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:auto,32px 32px,32px 32px;border:1px solid rgba(255,255,255,.08);display:grid;place-items:center;overflow:hidden}.bpo122-radar-ring{width:220px;height:220px;border-radius:50%;display:grid;place-items:center;border:1px solid rgba(255,181,31,.35);box-shadow:0 0 0 42px rgba(255,181,31,.04),0 0 0 84px rgba(255,181,31,.025);position:relative}.bpo122-radar-ring:after{content:"";position:absolute;width:12px;height:12px;border-radius:50%;background:#ffb522;top:-6px;left:50%;animation:bpo122Orbit 5.4s linear infinite;transform-origin:0 116px}.bpo122-radar-ring span{text-align:center}.bpo122-radar-ring b,.bpo122-radar-ring small{display:block}.bpo122-radar-ring b{font-size:34px}.bpo122-radar-ring small{color:#c7cfd9}.bpo122-sla-radar>article{position:absolute;padding:14px 16px;border-radius:18px;background:rgba(40,47,57,.94);border:1px solid rgba(255,255,255,.08);min-width:150px;transition:.3s}.bpo122-sla-radar>article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.28)}.bpo122-sla-radar article.a{left:22px;top:22px}.bpo122-sla-radar article.b{right:22px;top:58px}.bpo122-sla-radar article.c{left:32px;bottom:28px}.bpo122-sla-radar small,.bpo122-sla-radar b,.bpo122-sla-radar span{display:block}.bpo122-sla-radar small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.08em}.bpo122-sla-radar b{margin:4px 0}.bpo122-sla-radar span{font-size:11px;color:#c1c9d3}.bpo122-alert-stack{display:grid;gap:12px}.bpo122-alert-stack article{padding:20px;border-radius:24px;background:#282f39;border:1px solid rgba(255,255,255,.07);display:grid;grid-template-columns:50px 1fr;gap:14px;align-items:start;transition:.3s}.bpo122-alert-stack article:hover{transform:translateX(6px);border-color:rgba(255,181,31,.3)}.bpo122-alert-stack article>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:rgba(255,181,31,.14);color:#ffcf68;font-weight:900}.bpo122-alert-stack b,.bpo122-alert-stack small{display:block}.bpo122-alert-stack small{margin-top:6px;color:#c5cdd7;line-height:1.6} .bpo122-between-photo{margin:0;position:relative;border-radius:30px;overflow:hidden;box-shadow:0 26px 70px rgba(22,28,36,.1)}.bpo122-between-photo img{display:block;width:100%;height:560px;object-fit:cover}.bpo122-between-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;border-radius:18px;background:rgba(16,20,32,.84);backdrop-filter:blur(10px);color:#fff}.bpo122-between-photo small{display:block;color:#ffcf68;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;margin-bottom:6px}.bpo122-between-photo b{font-size:18px;line-height:1.35}.bpo122-between-flow{display:grid;gap:12px;margin-top:22px}.bpo122-between-flow article{display:grid;grid-template-columns:64px 1fr;gap:14px;padding:16px 0;border-top:1px solid rgba(37,42,51,.1)}.bpo122-between-flow article>span{width:54px;height:54px;border-radius:17px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:10px;font-weight:900;text-transform:uppercase}.bpo122-between-flow b,.bpo122-between-flow small{display:block}.bpo122-between-flow small{margin-top:5px;color:#626c79;line-height:1.55} .bpo122-expand{--bpo-expand:0;background:#20252d;color:#fff;overflow:hidden}.bpo122-expand-stage{padding-inline:clamp(18px,4vw,60px)}.bpo122-expand-media{width:calc(72% + (28% * var(--bpo-expand)));margin:auto;position:relative;border-radius:calc(34px - (12px * var(--bpo-expand)));overflow:hidden;transform:scale(calc(.94 + (.06 * var(--bpo-expand))));box-shadow:0 36px 90px rgba(0,0,0,.28)}.bpo122-expand-media img{display:block;width:100%;height:clamp(430px,55vw,700px);object-fit:cover}.bpo122-expand-media figcaption{position:absolute;left:20px;right:20px;bottom:20px;padding:18px 20px;border-radius:20px;background:rgba(16,20,32,.82);backdrop-filter:blur(12px)}.bpo122-expand-media small,.bpo122-expand-media b{display:block}.bpo122-expand-media small{color:#ffcf68;font-size:11px;text-transform:uppercase;letter-spacing:.08em;font-weight:900}.bpo122-expand-media b{margin-top:6px;font-size:20px}.bpo122-proof-row{width:min(1180px,100%);margin:18px auto 0;display:grid;grid-template-columns:repeat(4,1fr);gap:12px;opacity:calc(.18 + (.82 * var(--bpo-expand)));transform:translateY(calc(22px - (22px * var(--bpo-expand))))}.bpo122-proof-row article{padding:18px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.3s}.bpo122-proof-row article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.28)}.bpo122-proof-row b,.bpo122-proof-row small{display:block}.bpo122-proof-row small{margin-top:6px;color:#c2cad4;line-height:1.55} .bpo122-capacity-notes{display:grid;gap:10px;margin-top:22px}.bpo122-capacity-notes article{padding:15px 17px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,181,31,.16)}.bpo122-capacity-notes b,.bpo122-capacity-notes small{display:block}.bpo122-capacity-notes small{margin-top:5px;color:#626c79;line-height:1.55}.bpo122-capacity-board{padding:22px;border-radius:30px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 24px 64px rgba(22,28,36,.08)}.bpo122-capacity-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.bpo122-capacity-title span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800}.bpo122-capacity-board>article{display:grid;grid-template-columns:135px 1fr auto;gap:14px;align-items:center;padding:16px 0;border-top:1px solid rgba(37,42,51,.09)}.bpo122-capacity-board small{color:#747d89}.bpo122-capacity-bar{display:grid;grid-template-columns:1fr 44px;gap:8px;align-items:center}.bpo122-capacity-bar:before{content:"";grid-column:1;height:10px;border-radius:999px;background:#fff4d7}.bpo122-capacity-bar i{grid-column:1;grid-row:1;height:10px;width:var(--target);border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)}.bpo122-capacity.is-visible .bpo122-capacity-bar i{transform:scaleX(1)}.bpo122-capacity-bar span{grid-column:2;grid-row:1;font-size:12px;font-weight:900;color:#9b6700}.bpo122-capacity-board strong{font-size:12px;color:#258954}.bpo122-capacity-board strong.warn{color:#d98700} .bpo122-clients{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.bpo122-client-shell{padding:20px;border-radius:32px;background:#20252d;border:1px solid #303641}.bpo122-client-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}.bpo122-client-tabs span{padding:9px 13px;border-radius:999px;background:#282f39;color:#c3cad3;font-size:12px;font-weight:800}.bpo122-client-tabs span.active{background:#fff4d7;color:#9b6700}.bpo122-client-grid{display:grid;grid-template-columns:1.4fr repeat(2,1fr);gap:12px}.bpo122-client-grid article{padding:20px;border-radius:22px;background:#282f39;border:1px solid rgba(255,255,255,.07);color:#fff;transition:.3s}.bpo122-client-grid article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.3)}.bpo122-client-grid article.hero{grid-row:span 2;background:linear-gradient(145deg,#fff4d7,#ffd56c);color:#252a33}.bpo122-client-grid small,.bpo122-client-grid b,.bpo122-client-grid p,.bpo122-client-grid span{display:block}.bpo122-client-grid small{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#ffcf68}.bpo122-client-grid article.hero small{color:#9b6700}.bpo122-client-grid b{margin:7px 0}.bpo122-client-grid p{color:#5d5646;line-height:1.6}.bpo122-client-grid article.hero>div{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.bpo122-client-grid article.hero>div span{padding:8px 10px;border-radius:999px;background:rgba(255,255,255,.42);font-size:11px;font-weight:800}.bpo122-client-grid article:not(.hero)>span{font-size:11px;color:#c3cad3}.bpo122-client-grid article.locked{opacity:.78} @keyframes bpo122Orbit{to{transform:rotate(360deg)}} @media(max-width:990px){.rt121-handoff-notes{grid-template-columns:1fr}.bpo122-ops-grid,.bpo122-between-grid,.bpo122-capacity-grid,.bpo122-sla-layout{grid-template-columns:1fr}.bpo122-proof-row{grid-template-columns:1fr 1fr}.bpo122-client-grid{grid-template-columns:1fr 1fr}.bpo122-client-grid article.hero{grid-column:1/-1;grid-row:auto}.bpo122-expand-media{width:calc(88% + (12% * var(--bpo-expand)))}.bpo122-between-photo img{height:480px}} @media(max-width:680px){.bpo122-ops-points,.bpo122-live-metrics,.bpo122-proof-row,.bpo122-client-grid{grid-template-columns:1fr}.bpo122-queue-table .head{display:none}.bpo122-queue-table article{grid-template-columns:1fr;gap:8px}.bpo122-live-foot{align-items:flex-start;flex-direction:column}.bpo122-sla-radar{min-height:560px}.bpo122-sla-radar article.a{left:12px;top:14px}.bpo122-sla-radar article.b{right:12px;top:100px}.bpo122-sla-radar article.c{left:18px;bottom:18px}.bpo122-expand-media{width:calc(94% + (6% * var(--bpo-expand)))}.bpo122-expand-media img{height:420px}.bpo122-capacity-board>article{grid-template-columns:1fr}.bpo122-between-photo img{height:420px}} @media(prefers-reduced-motion:reduce){.bpo122-section[data-bpo122-reveal]{opacity:1!important;transform:none!important;transition:none!important}.bpo122-expand{--bpo-expand:1!important}.bpo122-radar-ring:after{animation:none!important}.bpo122-queue-table i,.bpo122-capacity-bar i{transform:scaleX(1)!important;transition:none!important}.bpo122-alert-stack article,.bpo122-client-grid article,.bpo122-proof-row article{transition:none!important}} /* v123 BPO refinements */ .bpo122-sla-radar article.d{right:28px;bottom:26px} .bpo122-sla-radar article.e{left:50%;top:24px;transform:translateX(-50%)} .bpo122-sla-radar article.e:hover{transform:translateX(-50%) translateY(-4px)} .bpo123-section{padding:var(--global-section-space) 0} .bpo123-section[data-bpo122-reveal]{opacity:0;transform:translateY(24px);transition:opacity .72s ease,transform .72s cubic-bezier(.2,.8,.2,1)} .bpo123-section[data-bpo122-reveal].is-visible{opacity:1;transform:none} body:not(.home) .bpo123-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance} body:not(.home) .bpo123-section h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .bpo123-workflow-grid,.bpo123-supervisor-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(30px,4vw,54px);align-items:center} .bpo123-workflow-copy>p,.bpo123-evidence-head>p,.bpo123-capacity-head>p,.bpo123-supervisor-copy>p{font-size:17px;line-height:1.65;color:var(--muted)} .bpo123-workflow{background:linear-gradient(180deg,#fff 0%,#fff9ef 100%)} .bpo123-workflow-facts{display:grid;gap:10px;margin-top:24px} .bpo123-workflow-facts article{display:grid;grid-template-columns:48px 1fr;gap:14px;align-items:start;padding:15px 0;border-top:1px solid rgba(37,42,51,.1)} .bpo123-workflow-facts article>span{width:42px;height:42px;border-radius:13px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-size:11px;font-weight:900} .bpo123-workflow-facts b,.bpo123-workflow-facts small{display:block}.bpo123-workflow-facts small{margin-top:5px;color:#65707c;line-height:1.58} .bpo123-workflow-board{padding:22px;border-radius:30px;background:#20252d;border:1px solid #303641;color:#fff;box-shadow:0 26px 70px rgba(22,28,36,.14)} .bpo123-board-head,.bpo123-board-foot{display:flex;justify-content:space-between;align-items:center;gap:16px} .bpo123-board-head b,.bpo123-board-head small{display:block}.bpo123-board-head small{color:#aeb7c2;font-size:12px;margin-top:3px}.bpo123-board-head>span{padding:8px 11px;border-radius:999px;background:#2b313b;color:#c7cdd5;font-size:12px;font-weight:800} .bpo123-call-stage{display:grid;grid-template-columns:1fr 120px;gap:12px;margin-top:16px} .bpo123-call-main,.bpo123-call-clock{padding:18px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.07)} .bpo123-call-main small,.bpo123-call-main b,.bpo123-call-main span,.bpo123-call-clock b,.bpo123-call-clock small{display:block}.bpo123-call-main small{color:#ffcf68;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.bpo123-call-main b{margin:6px 0}.bpo123-call-main span{font-size:12px;color:#c2cad4}.bpo123-call-clock{text-align:center;display:grid;place-items:center}.bpo123-call-clock b{font-size:24px}.bpo123-call-clock small{color:#aeb7c2} .bpo123-app-trail{display:grid;gap:10px;margin-top:12px}.bpo123-app-trail article{display:grid;grid-template-columns:14px 1fr auto;gap:12px;align-items:center;padding:14px 16px;border-radius:17px;background:#282f39;border:1px solid rgba(255,255,255,.06);transition:.3s}.bpo123-app-trail article:hover{transform:translateX(5px);border-color:rgba(255,181,31,.28)}.bpo123-app-trail .dot{width:10px;height:10px;border-radius:50%}.bpo123-app-trail .crm{background:#53d587}.bpo123-app-trail .kb{background:#ffb522}.bpo123-app-trail .mail{background:#ff8a1f}.bpo123-app-trail .wrap{background:#ff5b52}.bpo123-app-trail b,.bpo123-app-trail small{display:block}.bpo123-app-trail small{margin-top:3px;color:#b9c1cb}.bpo123-app-trail em{font-style:normal;font-size:12px;color:#ffcf68;font-weight:800}.bpo123-board-foot{margin-top:14px;padding-top:14px;border-top:1px solid rgba(255,255,255,.07)}.bpo123-board-foot span{display:flex;align-items:center;gap:8px;font-weight:800}.bpo123-board-foot span i{width:9px;height:9px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.1)}.bpo123-board-foot small{color:#b9c1cb} .bpo123-evidence{background:#20252d;color:#fff}.bpo123-evidence .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.32);color:#9b6700!important}.bpo123-evidence-head{max-width:860px;margin:0 auto 34px;text-align:center}.bpo123-evidence-head>p{color:#c5cdd7}.bpo123-evidence-shell{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;align-items:stretch}.bpo123-report-preview{padding:22px;border-radius:30px;background:#fff;color:#252a33;border:1px solid rgba(255,255,255,.08)}.bpo123-report-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.bpo123-report-top small,.bpo123-report-top b{display:block}.bpo123-report-top small{color:#9b6700;font-size:10px;letter-spacing:.08em;font-weight:900}.bpo123-report-top b{margin-top:4px}.bpo123-report-top>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800}.bpo123-report-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.bpo123-report-metrics article{padding:16px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,181,31,.18)}.bpo123-report-metrics small,.bpo123-report-metrics b,.bpo123-report-metrics em{display:block}.bpo123-report-metrics small{color:#7b828f}.bpo123-report-metrics b{font-size:22px;margin:3px 0}.bpo123-report-metrics em{font-style:normal;color:#258954;font-size:11px;font-weight:800}.bpo123-report-chart{height:220px;margin-top:18px;padding:18px 18px 28px;border-radius:20px;background:#f7f8fa;border:1px solid #e8ebef;display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end;position:relative}.bpo123-report-chart span{height:var(--h);border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,var(--accent-3),var(--accent),var(--accent-2));transform-origin:bottom;transform:scaleY(0);transition:transform 1.1s cubic-bezier(.2,.75,.2,1)}.bpo123-evidence.is-visible .bpo123-report-chart span{transform:scaleY(1)}.bpo123-report-chart i{font-style:normal;font-size:10px;color:#808895;text-align:center}.bpo123-report-note{margin-top:16px;padding:16px 18px;border-radius:18px;background:#20252d;color:#fff}.bpo123-report-note b,.bpo123-report-note small{display:block}.bpo123-report-note small{margin-top:5px;color:#c4ccd6;line-height:1.6}.bpo123-evidence-rail{display:grid;gap:12px}.bpo123-evidence-rail article{padding:18px;border-radius:22px;background:#282f39;border:1px solid rgba(255,255,255,.07);display:grid;grid-template-columns:44px 1fr;gap:12px;align-items:start;transition:.3s}.bpo123-evidence-rail article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.28)}.bpo123-evidence-rail article>span{width:38px;height:38px;border-radius:12px;background:rgba(255,181,31,.13);color:#ffcf68;display:grid;place-items:center;font-size:11px;font-weight:900}.bpo123-evidence-rail b,.bpo123-evidence-rail small{display:block}.bpo123-evidence-rail small{margin-top:5px;color:#c4ccd6;line-height:1.55} .bpo123-capacity{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.bpo123-capacity-head{max-width:860px;margin:0 auto 34px;text-align:center}.bpo123-capacity-stage{display:grid;grid-template-columns:1.15fr .85fr;gap:18px;align-items:stretch}.bpo123-demand-panel,.bpo123-capacity-actions{padding:22px;border-radius:30px;background:#fff;border:1px solid rgba(37,42,51,.09);box-shadow:0 22px 60px rgba(22,28,36,.07)}.bpo123-demand-head{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:10px}.bpo123-demand-head b,.bpo123-demand-head small{display:block}.bpo123-demand-head small{color:#7b828f}.bpo123-demand-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800}.bpo123-demand-grid{display:grid;gap:4px}.bpo123-demand-grid article{display:grid;grid-template-columns:180px 1fr 48px;gap:14px;align-items:center;padding:16px 0;border-top:1px solid rgba(37,42,51,.08)}.bpo123-demand-grid b,.bpo123-demand-grid small{display:block}.bpo123-demand-grid small{margin-top:4px;color:#747d89}.bpo123-demand-track{height:11px;border-radius:999px;background:#fff4d7;overflow:hidden}.bpo123-demand-track i{display:block;height:100%;width:var(--target);border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:1.2s cubic-bezier(.2,.75,.2,1)}.bpo123-capacity.is-visible .bpo123-demand-track i{transform:scaleX(1)}.bpo123-demand-grid strong{font-size:13px;color:#9b6700}.bpo123-demand-grid article.hot{background:#fffaf1;margin-inline:-10px;padding-inline:10px;border-radius:16px}.bpo123-capacity-actions{display:grid;gap:12px}.bpo123-capacity-actions article{padding:18px;border-radius:20px;background:#f8f9fb;border:1px solid #eaedf1;transition:.3s}.bpo123-capacity-actions article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.28)}.bpo123-capacity-actions article.recommend{background:#20252d;color:#fff;border-color:#303641}.bpo123-capacity-actions small,.bpo123-capacity-actions b,.bpo123-capacity-actions p{display:block}.bpo123-capacity-actions small{font-size:10px;letter-spacing:.08em;color:#9b6700;font-weight:900}.bpo123-capacity-actions .recommend small{color:#ffcf68}.bpo123-capacity-actions b{margin:6px 0}.bpo123-capacity-actions p{margin:0;color:#68717d;line-height:1.58}.bpo123-capacity-actions .recommend p{color:#c4ccd6}.bpo123-capacity-actions .recommend div{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}.bpo123-capacity-actions .recommend div span{padding:8px 10px;border-radius:999px;background:rgba(255,181,31,.12);color:#ffcf68;font-size:11px;font-weight:800} .bpo123-supervisor{background:#fff}.bpo123-supervisor-points{display:grid;gap:10px;margin-top:22px}.bpo123-supervisor-points article{padding:15px 17px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,181,31,.16)}.bpo123-supervisor-points b,.bpo123-supervisor-points small{display:block}.bpo123-supervisor-points small{margin-top:5px;color:#626c79;line-height:1.58}.bpo123-supervisor-console{padding:22px;border-radius:30px;background:#20252d;color:#fff;border:1px solid #303641;box-shadow:0 26px 70px rgba(22,28,36,.13)}.bpo123-console-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.bpo123-console-top>div{display:flex;align-items:center;gap:12px}.bpo123-console-top>div>span{width:44px;height:44px;border-radius:14px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-weight:900}.bpo123-console-top small,.bpo123-console-top b{display:block}.bpo123-console-top small{font-size:9px;letter-spacing:.08em;color:#aeb7c2}.bpo123-console-top em{font-style:normal;padding:8px 11px;border-radius:999px;background:#282f39;color:#c4ccd6;font-size:11px;font-weight:800}.bpo123-console-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.bpo123-console-kpis article{padding:14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.bpo123-console-kpis small,.bpo123-console-kpis b{display:block}.bpo123-console-kpis small{color:#aeb7c2}.bpo123-console-kpis b{font-size:18px;margin-top:3px}.bpo123-console-permissions{display:grid;gap:8px;margin-top:16px}.bpo123-console-permissions>div{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.06)}.bpo123-console-permissions>div>span{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-weight:900}.bpo123-console-permissions .visible>span{background:rgba(83,213,135,.12);color:#53d587}.bpo123-console-permissions .locked>span{background:rgba(255,91,82,.1);color:#ff7c73}.bpo123-console-permissions b,.bpo123-console-permissions small{display:block}.bpo123-console-permissions small{margin-top:3px;color:#aeb7c2}.bpo123-console-foot{display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:14px;margin-top:14px;border-top:1px solid rgba(255,255,255,.07)}.bpo123-console-foot span{display:flex;align-items:center;gap:8px;font-weight:800}.bpo123-console-foot span i{width:9px;height:9px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.1)}.bpo123-console-foot small{color:#aeb7c2} @media(max-width:990px){.bpo123-workflow-grid,.bpo123-supervisor-grid,.bpo123-evidence-shell,.bpo123-capacity-stage{grid-template-columns:1fr}.bpo123-report-metrics,.bpo123-console-kpis{grid-template-columns:1fr 1fr 1fr}.bpo122-sla-radar article.d{right:14px;bottom:16px}.bpo122-sla-radar article.e{left:50%;top:14px}} @media(max-width:680px){.bpo123-call-stage,.bpo123-report-metrics,.bpo123-console-kpis{grid-template-columns:1fr}.bpo123-demand-grid article{grid-template-columns:1fr}.bpo123-evidence-rail article{grid-template-columns:40px 1fr}.bpo122-sla-radar article.d{right:10px;bottom:12px}.bpo122-sla-radar article.e{left:12px;top:170px;transform:none}.bpo122-sla-radar article.e:hover{transform:translateY(-4px)}} @media(prefers-reduced-motion:reduce){.bpo123-section[data-bpo122-reveal]{opacity:1!important;transform:none!important;transition:none!important}.bpo123-report-chart span,.bpo123-demand-track i{transform:scale(1)!important;transition:none!important}.bpo123-app-trail article,.bpo123-evidence-rail article,.bpo123-capacity-actions article{transition:none!important}} /* v124 BPO refinements + Remote Employee Monitoring main page */ .bpo122-sla-radar article.e{display:none!important} .bpo124-evidence-shell{display:grid;grid-template-columns:1.35fr .65fr;gap:18px;align-items:stretch} .bpo124-report-image{margin:0;position:relative;padding:18px;border-radius:30px;background:#fff;color:#252a33;overflow:hidden;min-height:520px;display:flex;flex-direction:column;border:1px solid rgba(255,255,255,.08)} .bpo124-report-image img{display:block;width:100%;height:390px;object-fit:cover;object-position:center top;border-radius:20px;border:1px solid #e8ebef} .bpo124-report-overlay{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.bpo124-report-overlay span{padding:13px 14px;border-radius:16px;background:#fff8ec;border:1px solid rgba(255,181,31,.18)}.bpo124-report-overlay small,.bpo124-report-overlay b{display:block}.bpo124-report-overlay small{font-size:10px;color:#7b828f}.bpo124-report-overlay b{margin-top:3px;font-size:18px}.bpo124-report-image figcaption{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;padding-top:14px;border-top:1px solid #eceef2}.bpo124-report-image figcaption small{font-size:10px;letter-spacing:.08em;color:#9b6700;font-weight:900}.bpo124-report-image figcaption b{flex:1}.bpo124-report-image figcaption span{font-size:11px;color:#69717e} .bpo123-supervisor-copy h2{font-size:clamp(2rem,3.35vw,3.15rem)!important;line-height:1.06!important} .bpo123-supervisor-points{grid-template-columns:1fr 1fr} @media(max-width:990px){.bpo124-evidence-shell{grid-template-columns:1fr}.bpo123-supervisor-points{grid-template-columns:1fr}} @media(max-width:680px){.bpo124-report-overlay{grid-template-columns:1fr}.bpo124-report-image img{height:300px}.bpo124-report-image figcaption{align-items:flex-start;flex-direction:column}} body:not(.home) .rem124-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;text-wrap:balance;margin:14px 0 0!important} body:not(.home) .rem124-page h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .rem124-section{padding:var(--global-section-space) 0} .rem124-section[data-rem124-reveal]{opacity:0;transform:translateY(26px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)}.rem124-section[data-rem124-reveal].is-visible{opacity:1;transform:none} .rem124-pulse-grid,.rem124-appweb-grid,.rem124-privacy-grid,.rem124-manager-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,52px);align-items:center} .rem124-pulse-copy>p,.rem124-appweb-copy>p,.rem124-privacy-copy>p,.rem124-manager-copy>p,.rem124-screen-head>p,.rem124-expand-head>p,.rem124-alerts-head>p{color:var(--muted);font-size:17px;line-height:1.64} .rem124-pulse-list{display:grid;gap:10px;margin-top:22px}.rem124-pulse-list article{display:grid;grid-template-columns:44px 1fr;gap:14px;align-items:start;padding:15px 0;border-top:1px solid rgba(37,42,51,.09)}.rem124-pulse-list article>span{width:38px;height:38px;border-radius:12px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-weight:900;font-size:11px}.rem124-pulse-list b,.rem124-pulse-list small{display:block}.rem124-pulse-list small{margin-top:5px;color:#626b78;line-height:1.55} .rem124-pulse-board{padding:22px;border-radius:30px;background:#20252d;color:#fff;border:1px solid #303641;box-shadow:0 28px 75px rgba(22,28,36,.14)}.rem124-pulse-head{display:flex;justify-content:space-between;align-items:center;gap:14px}.rem124-pulse-head b,.rem124-pulse-head small{display:block}.rem124-pulse-head small{margin-top:4px;color:#aeb7c2}.rem124-pulse-head>span{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:800;color:#d4dae2}.rem124-pulse-head>span i{width:9px;height:9px;border-radius:50%;background:#53d587;box-shadow:0 0 0 6px rgba(83,213,135,.1)}.rem124-pulse-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.rem124-pulse-metrics article{padding:15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.rem124-pulse-metrics small,.rem124-pulse-metrics b,.rem124-pulse-metrics em{display:block}.rem124-pulse-metrics small{color:#aeb7c2}.rem124-pulse-metrics b{font-size:21px;margin:3px 0}.rem124-pulse-metrics em{font-style:normal;font-size:11px;color:#ffcf68;font-weight:800}.rem124-timeline{height:95px;margin-top:16px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.07);position:relative;overflow:hidden}.rem124-timeline>span{position:absolute;top:24px;left:var(--l);width:var(--w);height:24px;border-radius:999px}.rem124-timeline .work{background:linear-gradient(90deg,var(--accent-3),var(--accent))}.rem124-timeline .break{background:#4b5563}.rem124-timeline .meeting{background:#ff8f52}.rem124-timeline>div{position:absolute;left:16px;right:16px;bottom:13px;display:flex;justify-content:space-between}.rem124-timeline>div i{font-style:normal;font-size:10px;color:#aeb7c2}.rem124-apps{display:grid;gap:8px;margin-top:14px}.rem124-apps article{display:grid;grid-template-columns:90px 1fr 58px;gap:10px;align-items:center}.rem124-apps b,.rem124-apps small{font-size:12px}.rem124-apps small{text-align:right;color:#aeb7c2}.rem124-apps article>span{height:8px;border-radius:999px;background:#353c47;overflow:hidden}.rem124-apps article>span i{display:block;width:var(--target);height:100%;background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:transform 1.1s cubic-bezier(.2,.75,.2,1)}.rem124-pulse.is-visible .rem124-apps article>span i{transform:scaleX(1)} .rem124-screen{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.rem124-screen-head,.rem124-expand-head,.rem124-alerts-head{max-width:860px;margin:0 auto 36px;text-align:center}.rem124-screen-stage{display:grid;grid-template-columns:1.25fr .75fr;gap:20px;align-items:stretch}.rem124-screen-image{margin:0;padding:18px;border-radius:30px;background:#20252d;display:flex;flex-direction:column}.rem124-screen-image img{display:block;width:100%;height:460px;object-fit:cover;object-position:center top;border-radius:20px}.rem124-screen-image figcaption{padding:16px 4px 0;color:#fff}.rem124-screen-image figcaption small,.rem124-screen-image figcaption b{display:block}.rem124-screen-image figcaption small{color:#ffcf68;font-size:10px;letter-spacing:.08em;font-weight:900}.rem124-screen-image figcaption b{margin-top:5px;font-size:18px}.rem124-screen-notes{display:grid;gap:12px}.rem124-screen-notes article{padding:22px;border-radius:24px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 42px rgba(22,28,36,.05);transition:.3s}.rem124-screen-notes article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.28)}.rem124-screen-notes span{display:inline-flex;padding:7px 10px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.rem124-screen-notes b,.rem124-screen-notes small{display:block}.rem124-screen-notes b{margin:10px 0 6px;font-size:17px}.rem124-screen-notes small{color:#626b78;line-height:1.6} .rem124-appweb-visual{padding:22px;border-radius:30px;background:#20252d;color:#fff}.rem124-appweb-head{display:flex;justify-content:space-between;gap:14px;align-items:center}.rem124-appweb-head span{padding:8px 11px;border-radius:999px;background:#282f39;color:#c4ccd6;font-size:11px;font-weight:800}.rem124-appweb-list{display:grid;gap:10px;margin-top:18px}.rem124-appweb-list article{display:grid;grid-template-columns:14px 1fr auto;gap:12px;align-items:center;padding:14px 15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.rem124-appdot{width:10px;height:10px;border-radius:50%}.rem124-appdot.productive{background:#53d587}.rem124-appdot.neutral{background:#ffbf39}.rem124-appdot.review{background:#ff7c73}.rem124-appweb-list b,.rem124-appweb-list small{display:block}.rem124-appweb-list small{margin-top:3px;color:#aeb7c2}.rem124-appweb-list em{font-style:normal;font-size:12px;color:#ffcf68}.rem124-appweb-chart{height:150px;margin-top:16px;padding:16px;border-radius:20px;background:#282f39;display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end}.rem124-appweb-chart i{display:block;height:var(--h);border-radius:10px 10px 4px 4px;background:linear-gradient(180deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleY(0);transform-origin:bottom;transition:transform 1.1s cubic-bezier(.2,.75,.2,1)}.rem124-appweb.is-visible .rem124-appweb-chart i{transform:scaleY(1)}.rem124-inline-points{display:flex;flex-wrap:wrap;gap:9px;margin:20px 0}.rem124-inline-points span{padding:9px 12px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:12px;font-weight:800} .rem124-expand{background:#20252d;color:#fff;overflow:hidden}.rem124-expand .eyebrow{background:#fff4d7;border-color:rgba(255,181,31,.3);color:#9b6700!important}.rem124-expand-head>p{color:#c6ced8}.rem124-expand-wrap{height:620px;display:grid;place-items:center;position:relative}.rem124-expand-media{--rem-expand:0;width:calc(72% + (24% * var(--rem-expand)));transform:scale(calc(.88 + (.12 * var(--rem-expand))));transition:width .08s linear,transform .08s linear;position:relative;padding:14px;border-radius:32px;background:#282f39;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 80px rgba(0,0,0,.18)}.rem124-expand-media img{display:block;width:100%;height:430px;object-fit:cover;border-radius:22px}.rem124-expand-caption{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:16px 6px 2px}.rem124-expand-caption small{color:#ffcf68;font-size:10px;letter-spacing:.08em;font-weight:900}.rem124-expand-caption b{font-size:17px;text-align:right;max-width:540px} .rem124-privacy-photo{margin:0;position:relative;border-radius:30px;overflow:hidden;min-height:540px;box-shadow:0 24px 68px rgba(22,28,36,.1)}.rem124-privacy-photo img{display:block;width:100%;height:100%;min-height:540px;object-fit:cover}.rem124-privacy-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;border-radius:18px;background:rgba(16,20,33,.84);backdrop-filter:blur(10px);color:#fff}.rem124-privacy-photo figcaption small,.rem124-privacy-photo figcaption b{display:block}.rem124-privacy-photo figcaption small{color:#ffcf68;font-size:10px;letter-spacing:.08em;font-weight:900}.rem124-privacy-photo figcaption b{margin-top:5px;font-size:18px;line-height:1.35}.rem124-privacy-rules{display:grid;gap:10px;margin-top:22px}.rem124-privacy-rules article{padding:16px 18px;border-radius:20px;background:#fff8ec;border:1px solid rgba(255,181,31,.16);transition:.3s}.rem124-privacy-rules article:hover{transform:translateX(5px)}.rem124-privacy-rules b,.rem124-privacy-rules small{display:block}.rem124-privacy-rules small{margin-top:5px;color:#626b78;line-height:1.58} .rem124-alerts{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.rem124-alerts-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.rem124-alerts-grid article{padding:24px;border-radius:26px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 45px rgba(22,28,36,.05);transition:.3s;display:grid;grid-template-columns:48px 1fr;gap:14px;position:relative}.rem124-alerts-grid article:hover{transform:translateY(-6px);border-color:rgba(255,181,31,.28)}.rem124-alerts-grid .icon{width:42px;height:42px;border-radius:14px;background:#fff4d7;color:#9b6700;display:grid;place-items:center}.rem124-alerts-grid .icon svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.rem124-alerts-grid small,.rem124-alerts-grid b,.rem124-alerts-grid p{display:block}.rem124-alerts-grid small{font-size:10px;letter-spacing:.08em;color:#9b6700;font-weight:900}.rem124-alerts-grid b{margin:5px 0}.rem124-alerts-grid p{margin:0;color:#626b78;line-height:1.6}.rem124-alerts-grid em{position:absolute;right:16px;top:16px;font-style:normal;padding:7px 9px;border-radius:999px;background:#20252d;color:#fff;font-size:10px;font-weight:800} .rem124-manager{background:#fff}.rem124-manager-links{display:grid;margin-top:22px}.rem124-manager-links a{display:flex;justify-content:space-between;padding:14px 0;border-top:1px solid rgba(37,42,51,.09);font-weight:750;color:inherit}.rem124-manager-links a span{transition:.3s}.rem124-manager-links a:hover{color:#d98700}.rem124-manager-links a:hover span{transform:translateX(5px)}.rem124-manager-console{padding:22px;border-radius:30px;background:#20252d;color:#fff;border:1px solid #303641}.rem124-manager-top{display:flex;justify-content:space-between;align-items:center;gap:14px}.rem124-manager-top>div{display:flex;align-items:center;gap:12px}.rem124-manager-top>div>span{width:44px;height:44px;border-radius:14px;background:#fff4d7;color:#9b6700;display:grid;place-items:center;font-weight:900}.rem124-manager-top small,.rem124-manager-top b{display:block}.rem124-manager-top small{font-size:9px;letter-spacing:.08em;color:#aeb7c2}.rem124-manager-top em{font-style:normal;padding:8px 11px;border-radius:999px;background:#282f39;color:#c4ccd6;font-size:11px;font-weight:800}.rem124-manager-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.rem124-manager-kpis article{padding:14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.rem124-manager-kpis small,.rem124-manager-kpis b{display:block}.rem124-manager-kpis small{color:#aeb7c2}.rem124-manager-kpis b{font-size:18px;margin-top:3px}.rem124-manager-access{display:grid;gap:8px;margin-top:16px}.rem124-manager-access article{display:grid;grid-template-columns:36px 1fr;gap:12px;align-items:center;padding:12px 14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.06);transition:.3s}.rem124-manager-access article:hover{transform:translateX(4px)}.rem124-manager-access article>span{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-weight:900}.rem124-manager-access .visible>span{background:rgba(83,213,135,.12);color:#53d587}.rem124-manager-access .locked>span{background:rgba(255,91,82,.1);color:#ff7c73}.rem124-manager-access b,.rem124-manager-access small{display:block}.rem124-manager-access small{margin-top:3px;color:#aeb7c2} @media(max-width:990px){.rem124-pulse-grid,.rem124-appweb-grid,.rem124-privacy-grid,.rem124-manager-grid,.rem124-screen-stage{grid-template-columns:1fr}.rem124-alerts-grid{grid-template-columns:1fr 1fr}.rem124-expand-wrap{height:auto}.rem124-expand-media{width:100%;transform:none}.rem124-privacy-photo,.rem124-privacy-photo img{min-height:440px}} @media(max-width:680px){.rem124-pulse-metrics,.rem124-manager-kpis,.rem124-alerts-grid{grid-template-columns:1fr}.rem124-pulse-board,.rem124-appweb-visual,.rem124-manager-console{padding:18px}.rem124-screen-image img{height:340px}.rem124-expand-media img{height:340px}.rem124-expand-caption{align-items:flex-start;flex-direction:column}.rem124-expand-caption b{text-align:left}.rem124-apps article{grid-template-columns:72px 1fr 48px}.rem124-privacy-photo,.rem124-privacy-photo img{min-height:380px}} @media(prefers-reduced-motion:reduce){.rem124-section[data-rem124-reveal]{opacity:1!important;transform:none!important;transition:none!important}.rem124-apps article>span i,.rem124-appweb-chart i{transform:scale(1)!important;transition:none!important}.rem124-expand-media{width:100%!important;transform:none!important;transition:none!important}.rem124-screen-notes article,.rem124-alerts-grid article,.rem124-manager-access article,.rem124-privacy-rules article{transition:none!important}} /* v125 targeted BPO + remote employee monitoring refinements */ .bpo123-supervisor-copy h2{font-size:clamp(2rem,3.2vw,3.35rem)!important;line-height:1.05!important;max-width:610px} .bpo123-console-permissions{grid-template-columns:1fr 1fr!important} .bpo123-console-permissions>div:last-child:nth-child(odd){grid-column:1/-1} .rem125-section{padding:var(--global-section-space) 0} .rem125-section[data-rem125-reveal]{opacity:0;transform:translateY(24px);transition:opacity .75s ease,transform .75s cubic-bezier(.2,.8,.2,1)} .rem125-section[data-rem125-reveal].is-visible{opacity:1;transform:none} body:not(.home) .rem125-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance} .rem125-pulse-grid,.rem125-tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,48px);align-items:stretch} .rem125-pulse-copy,.rem125-tools-copy{display:flex;flex-direction:column;justify-content:center}.rem125-pulse-copy>p,.rem125-tools-copy>p{font-size:17px;line-height:1.65;color:var(--muted)} .rem125-pulse-points{display:grid;gap:12px;margin-top:24px}.rem125-pulse-points article{display:grid;grid-template-columns:48px 1fr;gap:14px;padding:16px 0;border-top:1px solid rgba(37,42,51,.09)}.rem125-pulse-points article>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:900}.rem125-pulse-points b,.rem125-pulse-points small{display:block}.rem125-pulse-points small{margin-top:5px;color:#616a77;line-height:1.6} .rem125-day-console{padding:22px;border-radius:30px;background:#20252d;color:#fff;border:1px solid #303641;box-shadow:0 28px 72px rgba(22,28,36,.15)}.rem125-console-top{display:flex;justify-content:space-between;align-items:center;gap:16px}.rem125-console-top>div{display:flex;align-items:center;gap:12px}.rem125-console-top>div>span{width:46px;height:46px;border-radius:15px;display:grid;place-items:center;background:#fff4d7;color:#9b6700;font-weight:900}.rem125-console-top small,.rem125-console-top b{display:block}.rem125-console-top small{font-size:9px;letter-spacing:.08em;color:#aeb7c2}.rem125-console-top em{font-style:normal;padding:8px 11px;border-radius:999px;background:#282f39;color:#d0d7df;font-size:11px;font-weight:800}.rem125-console-top em i{display:inline-block;width:8px;height:8px;border-radius:50%;background:#53d587;margin-right:7px}.rem125-console-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.rem125-console-summary article{padding:14px;border-radius:17px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.rem125-console-summary small,.rem125-console-summary b,.rem125-console-summary span{display:block}.rem125-console-summary small{color:#aeb7c2}.rem125-console-summary b{font-size:18px;margin:4px 0}.rem125-console-summary span{font-size:11px;color:#c9d0d8}.rem125-day-map{margin-top:18px;padding:16px;border-radius:20px;background:#282f39}.rem125-day-map .labels{display:flex;justify-content:space-between;color:#aeb7c2;font-size:10px}.rem125-day-map .track{height:34px;margin-top:10px;border-radius:999px;background:#20252d;position:relative;overflow:hidden}.rem125-day-map .track i{position:absolute;left:var(--l);width:var(--w);top:7px;height:20px;border-radius:999px}.rem125-day-map .focus{background:linear-gradient(90deg,var(--accent-3),var(--accent))}.rem125-day-map .meeting{background:#53d587}.rem125-day-map .break{background:#8993a1}.rem125-console-feed{display:grid;gap:9px;margin-top:16px}.rem125-console-feed article{display:grid;grid-template-columns:58px 1fr;gap:12px;padding:12px 14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.06);transition:.3s}.rem125-console-feed article:hover{transform:translateX(4px);border-color:rgba(255,181,31,.28)}.rem125-console-feed>article>span{color:#ffcf68;font-size:11px;font-weight:800}.rem125-console-feed b,.rem125-console-feed small{display:block}.rem125-console-feed small{margin-top:3px;color:#aeb7c2} .rem125-tools{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.rem125-tool-legend{display:flex;flex-wrap:wrap;gap:10px;margin:20px 0}.rem125-tool-legend span{display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:999px;background:#fff;border:1px solid rgba(37,42,51,.08);font-size:12px;font-weight:800}.rem125-tool-legend i{width:9px;height:9px;border-radius:50%}.rem125-tool-legend .core{background:#53d587}.rem125-tool-legend .comms{background:#ffbf39}.rem125-tool-legend .review{background:#ff7c73}.rem125-tools-board{padding:22px;border-radius:30px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 24px 64px rgba(22,28,36,.08)}.rem125-tools-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.rem125-tools-head b,.rem125-tools-head small{display:block}.rem125-tools-head small{color:#76808c}.rem125-tools-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#9b6700;font-size:11px;font-weight:800}.rem125-tool-rows{display:grid;gap:10px;margin-top:18px}.rem125-tool-rows article{display:grid;grid-template-columns:1fr auto auto;gap:12px;align-items:center;padding:14px 15px;border-radius:18px;background:#f7f8fa;border:1px solid #e7e9ee;transition:.3s}.rem125-tool-rows article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.3)}.rem125-tool-rows article>div:first-child{display:flex;align-items:center;gap:12px}.rem125-tool-rows .app{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;font-size:10px;font-weight:900;color:#fff}.rem125-tool-rows .app.core{background:#53b984}.rem125-tool-rows .app.comms{background:#d99800}.rem125-tool-rows .app.review{background:#e86e66}.rem125-tool-rows b,.rem125-tool-rows small{display:block}.rem125-tool-rows small{margin-top:3px;color:#737c88}.rem125-tool-rows strong{font-size:13px}.rem125-tool-rows em{font-style:normal;padding:7px 9px;border-radius:999px;background:#fff;color:#6d7580;border:1px solid #e5e8ed;font-size:10px;font-weight:800}.rem125-tools-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.rem125-tools-foot article{padding:13px 14px;border-radius:16px;background:#fff8ec;border:1px solid rgba(255,181,31,.16)}.rem125-tools-foot small,.rem125-tools-foot b{display:block}.rem125-tools-foot small{color:#9b6700}.rem125-tools-foot b{font-size:18px;margin-top:3px} .rem124-expand-wrap{height:auto!important;min-height:620px}.rem124-expand-media{width:100%!important;transform:none!important}.rem124-expand-media img{height:auto!important;max-height:none!important;object-fit:contain!important;object-position:center center!important} .rem124-privacy{overflow:hidden}.rem124-privacy-copy h2{max-width:600px}.rem124-manager-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,48px);align-items:stretch}.rem124-manager-copy,.rem124-manager-console{height:100%}.rem124-manager-copy{display:flex;flex-direction:column;justify-content:flex-start}.rem124-manager-copy h2{max-width:590px}.rem125-manager-context{display:grid;gap:10px;margin-top:22px}.rem125-manager-context article{padding:16px 18px;border-radius:20px;background:#fff8ec;border:1px solid rgba(255,181,31,.16)}.rem125-manager-context b,.rem125-manager-context small{display:block}.rem125-manager-context small{margin-top:5px;color:#626b78;line-height:1.6}.rem124-manager-links{margin-top:auto} @media(max-width:990px){.rem125-pulse-grid,.rem125-tools-grid,.rem124-manager-grid{grid-template-columns:1fr}.rem124-manager-links{margin-top:22px}.rem124-expand-wrap{min-height:auto}.rem124-expand-media img{width:100%}} @media(max-width:680px){.rem125-console-summary,.rem125-tools-foot{grid-template-columns:1fr}.rem125-tool-rows article{grid-template-columns:1fr}.rem125-tool-rows article>div:first-child{align-items:flex-start}.rem124-expand-media{padding:10px}} @media(prefers-reduced-motion:reduce){.rem125-section[data-rem125-reveal]{opacity:1!important;transform:none!important;transition:none!important}.rem125-console-feed article,.rem125-tool-rows article{transition:none!important}} /* v126 real app logos + Hybrid Teams redesign */ .rem125-tool-list .app-logo{overflow:hidden;background:#fff!important;padding:5px!important;border:1px solid rgba(37,42,51,.08)!important}.rem125-tool-list .app-logo img{width:100%;height:100%;object-fit:contain;display:block;border-radius:7px} body:not(.home) .hy126-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 0!important;text-wrap:balance} body:not(.home) .hy126-page h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important;letter-spacing:-.01em!important} .hy126-section{padding:var(--global-section-space) 0;overflow:hidden}.hy126-section[data-hy126-reveal]{opacity:0;transform:translateY(26px);transition:opacity .78s ease,transform .78s cubic-bezier(.2,.8,.2,1)}.hy126-section[data-hy126-reveal].is-visible{opacity:1;transform:none} .hy126-operating-grid,.hy126-handoff-grid,.hy126-planner-grid,.hy126-boundaries-grid,.hy126-health-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(26px,4vw,48px);align-items:stretch}.hy126-operating-copy,.hy126-handoff-copy,.hy126-planner-copy,.hy126-boundaries-copy,.hy126-health-copy{display:flex;flex-direction:column;justify-content:center}.hy126-operating-copy p,.hy126-patterns-head p,.hy126-handoff-copy p,.hy126-planner-copy p,.hy126-boundaries-copy p,.hy126-health-copy p,.hy126-expand-intro p{color:var(--muted);font-size:17px;line-height:1.65} .hy126-operating-points{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.hy126-operating-points article{padding:16px;border-radius:20px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 15px 34px rgba(22,28,36,.04);transition:.32s}.hy126-operating-points article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.3)}.hy126-operating-points b,.hy126-operating-points small{display:block}.hy126-operating-points small{margin-top:6px;color:#5d6673;line-height:1.55} .hy126-week-board{padding:22px;border-radius:30px;background:#20252d;color:#fff;border:1px solid #303641;box-shadow:0 28px 75px rgba(22,28,36,.15)}.hy126-board-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.hy126-board-head b,.hy126-board-head small{display:block}.hy126-board-head small{color:#adb6c2;margin-top:4px}.hy126-board-head>span{padding:8px 12px;border-radius:999px;background:#2b313b;color:#d9dfe7;font-size:12px;font-weight:800}.hy126-board-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0}.hy126-board-summary article{padding:13px 14px;border-radius:16px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.hy126-board-summary small,.hy126-board-summary b{display:block}.hy126-board-summary small{font-size:11px;color:#aeb7c2}.hy126-board-summary b{margin-top:4px;font-size:18px}.hy126-week-table{background:#f8f9fb;color:#252a33;border-radius:20px;overflow:hidden}.hy126-week-table .head,.hy126-week-table article{display:grid;grid-template-columns:1.45fr repeat(5,.8fr);gap:8px;align-items:center;padding:12px 14px}.hy126-week-table .head{background:#f0f2f6;color:#727b88;text-transform:uppercase;font-size:10px;font-weight:900;letter-spacing:.06em}.hy126-week-table article{border-top:1px solid #e4e7ed}.hy126-week-table article>span{display:flex;align-items:center;gap:9px}.hy126-week-table article i{width:30px;height:30px;border-radius:10px;background:#20252d;color:#fff;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:900}.hy126-week-table em{font-style:normal;padding:8px 6px;border-radius:12px;text-align:center;font-size:11px;font-weight:800}.hy126-week-table em.office{background:#fff0c7;color:#8c5d00}.hy126-week-table em.remote{background:#eaf7f0;color:#267854}.hy126-board-foot{display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:14px;color:#bac3cd;font-size:11px}.hy126-board-foot span{display:flex;align-items:center;gap:6px}.hy126-board-foot i{width:8px;height:8px;border-radius:50%}.hy126-board-foot i.office{background:#ffbf39}.hy126-board-foot i.remote{background:#53d587}.hy126-board-foot small{margin-left:auto;color:#8f9aaa} .hy126-patterns{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.hy126-patterns-head{text-align:center;max-width:850px;margin:0 auto 38px}.hy126-patterns-grid{display:grid;grid-template-columns:1.3fr 1fr 1fr 1.25fr;gap:16px;align-items:stretch}.hy126-pattern-card{padding:24px;border-radius:26px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 44px rgba(22,28,36,.05);transition:.32s;min-height:280px;display:flex;flex-direction:column}.hy126-pattern-card:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.3)}.hy126-pattern-card small{color:#9a6900;font-weight:800;text-transform:uppercase;letter-spacing:.07em;font-size:10px}.hy126-pattern-card p{color:#5d6673;line-height:1.6;font-size:14px}.hy126-pattern-card.focus{background:#20252d;color:#fff}.hy126-pattern-card.focus small,.hy126-pattern-card.focus span{color:#c6ced8}.hy126-pattern-card.focus b{font-size:34px;display:block;margin:6px 0}.hy126-pattern-chart{display:flex;align-items:flex-end;gap:8px;flex:1;margin-top:18px}.hy126-pattern-chart i{flex:1;height:var(--h);border-radius:999px 999px 6px 6px;background:linear-gradient(180deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleY(0);transform-origin:bottom;transition:transform 1s ease}.hy126-patterns.is-visible .hy126-pattern-chart i{transform:scaleY(1)}.hy126-meter{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:auto}.hy126-meter:before{content:"";height:10px;border-radius:999px;background:#fff0c7;grid-column:1}.hy126-meter span{position:absolute;height:10px;border-radius:999px;background:linear-gradient(90deg,var(--accent-3),var(--accent));width:var(--target);transform:scaleX(0);transform-origin:left;transition:transform 1.15s ease}.hy126-patterns.is-visible .hy126-meter span{transform:scaleX(1)}.hy126-meter{position:relative}.hy126-meter b{font-size:14px}.hy126-pattern-card.image-card{padding:0;overflow:hidden;position:relative}.hy126-pattern-card.image-card img{width:100%;height:100%;object-fit:cover;min-height:280px}.hy126-pattern-card.image-card div{position:absolute;left:14px;right:14px;bottom:14px;padding:14px;border-radius:16px;background:rgba(20,24,34,.82);backdrop-filter:blur(10px);color:#fff}.hy126-pattern-card.image-card small{color:#ffcf68}.hy126-pattern-card.image-card b{display:block;margin-top:5px;line-height:1.35} .hy126-expand-intro{text-align:center;max-width:850px;margin:0 auto 34px}.hy126-expand-shell{width:min(1180px,calc(100% - 32px));margin:0 auto;position:relative;min-height:540px;display:grid;place-items:center}.hy126-expand-media{width:66%;border-radius:30px;overflow:hidden;box-shadow:0 30px 85px rgba(22,28,36,.14);transition:width .9s cubic-bezier(.2,.8,.2,1),border-radius .9s ease}.hy126-expand-media img{display:block;width:100%;height:540px;object-fit:cover}.hy126-expand.is-expanded .hy126-expand-media{width:100%;border-radius:20px}.hy126-expand-label{position:absolute;top:50%;transform:translateY(-50%);font-size:clamp(34px,6vw,82px);font-weight:900;letter-spacing:-.05em;color:#20252d;transition:transform .9s cubic-bezier(.2,.8,.2,1),opacity .5s ease;pointer-events:none}.hy126-expand-label.left{left:2%;transform:translate(-10%,-50%)}.hy126-expand-label.right{right:2%;transform:translate(10%,-50%)}.hy126-expand.is-expanded .hy126-expand-label.left{transform:translate(-125%,-50%);opacity:0}.hy126-expand.is-expanded .hy126-expand-label.right{transform:translate(125%,-50%);opacity:0}.hy126-expand-notes{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}.hy126-expand-notes article{padding:18px;border-radius:22px;background:#fff;border:1px solid rgba(37,42,51,.08)}.hy126-expand-notes b,.hy126-expand-notes small{display:block}.hy126-expand-notes small{margin-top:6px;color:#5d6673;line-height:1.6} .hy126-handoff-board{position:relative;padding:24px 24px 24px 64px;border-radius:30px;background:#f7f8fb;border:1px solid #e3e7ee;display:grid;gap:14px}.hy126-handoff-line{position:absolute;top:45px;bottom:45px;left:38px;width:2px;background:linear-gradient(#ffbf39,#ff6a37,#53d587);overflow:hidden}.hy126-handoff-line:after{content:"";position:absolute;left:-3px;top:-12%;width:8px;height:60px;border-radius:999px;background:linear-gradient(rgba(255,181,31,0),#ffbf39,rgba(255,181,31,0));animation:hy126Line 2.3s linear infinite}.hy126-handoff-board article{padding:18px;border-radius:20px;background:#fff;border:1px solid #e1e5ec;transition:.32s}.hy126-handoff-board article:hover{transform:translateX(5px);border-color:rgba(255,181,31,.35)}.hy126-handoff-board span{display:block;color:#a66e00;font-size:11px;font-weight:900}.hy126-handoff-board b{display:block;margin:5px 0;font-size:17px}.hy126-handoff-board small{color:#5d6673;line-height:1.6}.hy126-handoff-list{display:grid;gap:10px;margin-top:20px}.hy126-handoff-list article{padding:14px 0;border-top:1px solid rgba(37,42,51,.1);display:grid;grid-template-columns:140px 1fr;gap:14px}.hy126-handoff-list small{color:#5d6673;line-height:1.55} .hy126-planner{background:#20252d;color:#fff}.hy126-planner .eyebrow{background:#fff4d7;border-color:#f3cf72;color:#956200}.hy126-planner-copy p{color:#c9d1da}.hy126-planner-board{padding:22px;border-radius:30px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.hy126-planner-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.hy126-planner-top span{padding:8px 12px;border-radius:999px;background:#20252d;color:#cbd3dd;font-size:12px}.hy126-planner-lanes{display:grid;gap:10px}.hy126-planner-lanes article{display:grid;grid-template-columns:58px 1fr auto;gap:12px;align-items:center;padding:14px;border-radius:18px;background:#20252d;border:1px solid rgba(255,255,255,.07)}.hy126-planner-lanes article small{color:#ffcf68}.hy126-planner-lanes article b,.hy126-planner-lanes article span{display:block}.hy126-planner-lanes article span{color:#b8c0ca;font-size:12px;margin-top:4px}.hy126-planner-lanes em{font-style:normal;padding:7px 10px;border-radius:999px;background:#fff4d7;color:#956200;font-size:11px;font-weight:800}.hy126-planner-lanes em.remote{background:#eaf7f0;color:#267854}.hy126-planner-foot{margin-top:14px;padding:14px 16px;border-radius:18px;background:rgba(255,181,31,.09);border:1px solid rgba(255,181,31,.15)}.hy126-planner-foot b,.hy126-planner-foot span{display:block}.hy126-planner-foot span{margin-top:4px;color:#cbd3dd;font-size:13px}.hy126-planner-points{display:grid;gap:12px;margin-top:22px}.hy126-planner-points article{display:grid;grid-template-columns:42px 1fr;gap:12px}.hy126-planner-points article span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(255,181,31,.15);color:#ffcf68;font-size:11px;font-weight:900}.hy126-planner-points b,.hy126-planner-points small{display:block}.hy126-planner-points small{margin-top:4px;color:#c9d1da;line-height:1.5} .hy126-boundaries-grid{align-items:center}.hy126-boundary-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.hy126-boundary-tags span{padding:9px 13px;border-radius:999px;background:#fff4d7;border:1px solid rgba(255,181,31,.2);font-size:12px;font-weight:800;color:#966300}.hy126-boundary-console{padding:22px;border-radius:30px;background:#f7f8fb;border:1px solid #e1e5ec}.hy126-console-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.hy126-console-head span{padding:8px 11px;border-radius:999px;background:#20252d;color:#fff;font-size:11px;font-weight:800}.hy126-boundary-console article{display:grid;grid-template-columns:1fr auto;gap:16px;align-items:center;padding:14px 0;border-top:1px solid #e1e5ec}.hy126-boundary-console b,.hy126-boundary-console small{display:block}.hy126-boundary-console small{margin-top:4px;color:#67717d}.hy126-boundary-console em{font-style:normal;padding:7px 10px;border-radius:999px;font-size:11px;font-weight:800}.hy126-boundary-console em.on{background:#eaf7f0;color:#267854}.hy126-boundary-console em.off{background:#f0f1f3;color:#626b77} .hy126-health-photo{margin:0;position:relative;border-radius:30px;overflow:hidden;min-height:500px}.hy126-health-photo img{width:100%;height:100%;min-height:500px;object-fit:cover;display:block}.hy126-health-photo figcaption{position:absolute;left:18px;right:18px;bottom:18px;padding:16px 18px;border-radius:18px;background:rgba(20,24,34,.84);backdrop-filter:blur(10px);color:#fff}.hy126-health-photo small{display:block;color:#ffcf68;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:900}.hy126-health-photo b{display:block;margin-top:5px;line-height:1.35}.hy126-health-bars{display:grid;gap:16px;margin-top:24px}.hy126-health-bars article{display:grid;grid-template-columns:150px 1fr auto;gap:14px;align-items:center}.hy126-health-bars b,.hy126-health-bars small{display:block}.hy126-health-bars small{margin-top:3px;color:#75808d}.hy126-health-bars span{height:10px;border-radius:999px;background:#fff0c7;overflow:hidden}.hy126-health-bars i{display:block;height:100%;width:var(--target);background:linear-gradient(90deg,var(--accent-3),var(--accent),var(--accent-2));transform:scaleX(0);transform-origin:left;transition:transform 1.2s ease}.hy126-health.is-visible .hy126-health-bars i{transform:scaleX(1)} @keyframes hy126Line{to{top:110%}} @media(max-width:1120px){.hy126-patterns-grid{grid-template-columns:1fr 1fr}.hy126-operating-grid,.hy126-handoff-grid,.hy126-planner-grid,.hy126-boundaries-grid,.hy126-health-grid{grid-template-columns:1fr}.hy126-operating-points{grid-template-columns:1fr 1fr}.hy126-week-board{order:2}.hy126-expand-media{width:82%}} @media(max-width:760px){.hy126-operating-points,.hy126-patterns-grid,.hy126-expand-notes,.hy126-board-summary{grid-template-columns:1fr}.hy126-week-table{overflow-x:auto}.hy126-week-table .head,.hy126-week-table article{min-width:720px}.hy126-board-foot small{width:100%;margin-left:0}.hy126-expand-shell{min-height:auto}.hy126-expand-media,.hy126-expand.is-expanded .hy126-expand-media{width:100%;border-radius:20px}.hy126-expand-media img{height:380px}.hy126-expand-label{display:none}.hy126-handoff-list article{grid-template-columns:1fr}.hy126-health-bars article{grid-template-columns:1fr}.hy126-planner-lanes article{grid-template-columns:50px 1fr}.hy126-planner-lanes em{grid-column:2;justify-self:start}} @media(prefers-reduced-motion:reduce){.hy126-section[data-hy126-reveal]{opacity:1!important;transform:none!important;transition:none!important}.hy126-expand-media,.hy126-expand-label,.hy126-pattern-chart i,.hy126-meter span,.hy126-health-bars i{transition:none!important}.hy126-handoff-line:after{animation:none!important}} /* v127 app-logo cleanup */ .rem125-tool-rows .app-logo{background:transparent!important;border:0!important;padding:0!important;box-shadow:none!important;overflow:visible!important}.rem125-tool-rows .app-logo img{width:30px!important;height:30px!important;object-fit:contain!important;display:block!important;border-radius:0!important;background:transparent!important} /* v127 Hybrid Teams refinements */ .hy127-real-dashboard-card{grid-column:span 1;padding:0;border-radius:26px;background:#20252d;border:1px solid #303641;box-shadow:0 18px 44px rgba(22,28,36,.08);overflow:hidden;min-height:280px;display:flex;flex-direction:column;transition:.32s}.hy127-real-dashboard-card:hover{transform:translateY(-5px)}.hy127-real-top{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 16px;color:#fff}.hy127-real-top span{display:flex;align-items:center;gap:8px;font-size:11px;color:#c7cfd9}.hy127-real-top i{width:8px;height:8px;border-radius:50%;background:#53d587;box-shadow:0 0 0 5px rgba(83,213,135,.12)}.hy127-real-top b{font-size:12px}.hy127-real-dashboard-card img{display:block;width:100%;height:172px;object-fit:cover;object-position:top center;background:#11161e}.hy127-real-meta{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:14px}.hy127-real-meta article{padding:11px 12px;border-radius:14px;background:#282f39;border:1px solid rgba(255,255,255,.06)}.hy127-real-meta small,.hy127-real-meta b{display:block}.hy127-real-meta small{color:#aeb7c2;font-size:10px}.hy127-real-meta b{color:#fff;margin-top:3px;font-size:15px} .hy127-collab-section{padding:var(--global-section-space) 0;background:#fff}.hy127-collab-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,4vw,52px);align-items:stretch}.hy127-collab-copy{display:flex;flex-direction:column;justify-content:center}.hy127-collab-copy p{font-size:17px;line-height:1.65;color:var(--muted)}.hy127-collab-points{display:grid;gap:10px;margin-top:22px}.hy127-collab-points article{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:15px 0;border-top:1px solid rgba(37,42,51,.1)}.hy127-collab-points article>span{width:38px;height:38px;border-radius:12px;background:#fff4d7;color:#956200;display:grid;place-items:center;font-size:11px;font-weight:900}.hy127-collab-points b,.hy127-collab-points small{display:block}.hy127-collab-points small{margin-top:4px;color:#5d6673;line-height:1.55}.hy127-collab-stage{position:relative;min-height:520px}.hy127-collab-stage figure{margin:0;height:100%;border-radius:30px;overflow:hidden;box-shadow:0 28px 75px rgba(22,28,36,.12)}.hy127-collab-stage figure img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block}.hy127-collab-agenda{position:absolute;left:24px;right:24px;bottom:24px;padding:16px;border-radius:22px;background:rgba(24,29,38,.92);backdrop-filter:blur(12px);color:#fff;border:1px solid rgba(255,255,255,.08)}.hy127-agenda-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.hy127-agenda-head span{font-size:11px;color:#ffcf68}.hy127-collab-agenda article{display:grid;grid-template-columns:54px 1fr auto;gap:10px;align-items:center;padding:10px 0;border-top:1px solid rgba(255,255,255,.08)}.hy127-collab-agenda article small{color:#ffcf68}.hy127-collab-agenda article b,.hy127-collab-agenda article span{display:block}.hy127-collab-agenda article span{margin-top:2px;color:#c6ced8;font-size:11px}.hy127-collab-agenda em{font-style:normal;padding:6px 9px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:800}.hy127-collab-agenda em.soft{background:#eaf7f0;color:#267854} .hy126-handoff-line{width:3px!important;background:linear-gradient(180deg,rgba(255,181,31,.12),#ffbf39 18%,#ff6a37 52%,#53d587 84%,rgba(83,213,135,.12))!important;box-shadow:0 0 0 5px rgba(255,181,31,.06),0 0 22px rgba(255,181,31,.18)}.hy126-handoff-line:before{content:"";position:absolute;left:50%;top:0;bottom:0;width:1px;transform:translateX(-50%);background:repeating-linear-gradient(to bottom,rgba(255,255,255,.8) 0 3px,transparent 3px 10px);opacity:.28}.hy126-handoff-line:after{width:11px!important;height:72px!important;left:-4px!important;box-shadow:0 0 16px rgba(255,181,31,.42)}.hy126-handoff-board article{position:relative}.hy126-handoff-board article:before{content:"";position:absolute;left:-34px;top:50%;width:12px;height:12px;border-radius:50%;transform:translateY(-50%);background:#fff;border:3px solid #ffbf39;box-shadow:0 0 0 5px #f7f8fb} .hy126-planner-grid{align-items:stretch!important}.hy126-planner-board,.hy127-planner-copy{height:100%;box-sizing:border-box}.hy127-planner-copy{display:flex;flex-direction:column;justify-content:center;padding:8px 0}.hy127-planner-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:20px 0 2px}.hy127-planner-summary article{padding:14px 15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.hy127-planner-summary small,.hy127-planner-summary b{display:block}.hy127-planner-summary small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.07em}.hy127-planner-summary b{margin-top:5px;font-size:14px;color:#fff} .hy127-boundary-note{margin-top:20px;padding:16px 18px;border-radius:20px;background:#fff8ec;border:1px solid rgba(255,181,31,.18)}.hy127-boundary-note b,.hy127-boundary-note small{display:block}.hy127-boundary-note small{margin-top:6px;color:#5d6673;line-height:1.6} @media(max-width:1120px){.hy127-collab-grid{grid-template-columns:1fr}.hy127-collab-stage{min-height:460px}.hy127-planner-summary{grid-template-columns:1fr 1fr}} @media(max-width:760px){.hy127-real-dashboard-card img{height:210px}.hy127-collab-stage{min-height:420px}.hy127-collab-stage figure img{min-height:420px}.hy127-collab-agenda{left:12px;right:12px;bottom:12px}.hy127-collab-agenda article{grid-template-columns:48px 1fr}.hy127-collab-agenda em{grid-column:2;justify-self:start}.hy127-planner-summary{grid-template-columns:1fr}} /* Worklix v128 targeted refinements */ .hy126-planner-points{display:grid;gap:12px;margin-top:22px} .hy126-planner-points article{display:grid;grid-template-columns:42px 1fr;gap:12px;align-items:flex-start;padding:16px 18px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08);transition:.3s} .hy126-planner-points article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.3);box-shadow:0 18px 36px rgba(0,0,0,.16)} .hy126-planner-points article span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:rgba(255,181,31,.15);color:#ffcf68;font-size:11px;font-weight:900;box-shadow:inset 0 0 0 1px rgba(255,255,255,.05)} .hy126-planner-points article b,.hy126-planner-points article small{grid-column:2} .hy126-planner-points article b{font-size:18px;line-height:1.25} .hy126-planner-points article small{margin-top:4px;color:#c9d1da;line-height:1.62} .dt128-section{padding:var(--global-section-space) 0}.dt128-section[data-dt128-reveal]{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s ease}.dt128-section[data-dt128-reveal].is-visible{opacity:1;transform:none} .dt128-command{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)}.dt128-command-grid,.dt128-zones-grid,.dt128-presence-grid,.dt128-load-grid,.dt128-evidence-grid,.dt128-boundaries-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(28px,4vw,52px);align-items:stretch} .dt128-command-copy,.dt128-zones-copy,.dt128-presence-copy,.dt128-load-copy,.dt128-evidence-copy,.dt128-boundaries-copy{display:flex;flex-direction:column;justify-content:center}.dt128-command-copy>p,.dt128-zones-copy>p,.dt128-presence-copy>p,.dt128-load-copy>p,.dt128-evidence-copy>p,.dt128-boundaries-copy>p{font-size:17px;line-height:1.66;color:var(--muted)} .dt128-command-points{display:grid;gap:12px;margin-top:24px}.dt128-command-points article{padding:16px 18px;border-radius:18px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 42px rgba(22,28,36,.05);transition:.32s}.dt128-command-points article:hover{transform:translateY(-4px);box-shadow:0 26px 55px rgba(22,28,36,.1)}.dt128-command-points b,.dt128-command-points small{display:block}.dt128-command-points small{margin-top:6px;color:#5d6673;line-height:1.58} .dt128-command-board{position:relative;padding:18px;border-radius:32px;background:#1f252e;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 76px rgba(22,28,36,.16);overflow:hidden}.dt128-command-board img{display:block;width:100%;height:auto;min-height:440px;object-fit:cover;border-radius:24px;border:1px solid rgba(255,255,255,.08)}.dt128-board-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:16px;color:#fff}.dt128-board-head b,.dt128-board-head small{display:block}.dt128-board-head small{color:#aeb8c3}.dt128-board-head>span{padding:8px 12px;border-radius:999px;background:#fff4d7;color:#956200;font-size:11px;font-weight:800}.dt128-floating{position:absolute;padding:11px 13px;border-radius:18px;background:rgba(24,29,38,.92);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.1);color:#fff;box-shadow:0 20px 45px rgba(0,0,0,.22);animation:dt128Float 4.5s ease-in-out infinite}.dt128-floating strong,.dt128-floating span{display:block}.dt128-floating span{font-size:11px;color:#cbd3dd;margin-top:3px}.dt128-floating-a{left:36px;top:86px}.dt128-floating-b{right:38px;top:190px;animation-delay:.8s}.dt128-floating-c{left:55px;bottom:34px;animation-delay:1.6s} .dt128-zones{background:#fff}.dt128-zones-list{display:grid;gap:10px;margin-top:24px}.dt128-zones-list article{display:grid;grid-template-columns:160px 1fr;gap:18px;padding:14px 0;border-top:1px solid rgba(37,42,51,.1)}.dt128-zones-list small{color:#5d6673;line-height:1.58}.dt128-zone-board{position:relative;padding:24px 24px 24px 68px;border-radius:30px;background:#f7f8fb;border:1px solid #e3e7ee;display:grid;gap:16px}.dt128-zone-board:before{content:"";position:absolute;left:40px;top:32px;bottom:32px;width:3px;border-radius:999px;background:linear-gradient(180deg,#ffbf39,#ff6a37,#53d587);box-shadow:0 0 0 5px rgba(255,181,31,.06),0 0 18px rgba(255,181,31,.14)}.dt128-zone-board:after{content:"";position:absolute;left:36px;top:12%;width:11px;height:72px;border-radius:999px;background:linear-gradient(rgba(255,181,31,0),#ffbf39,rgba(83,213,135,0));animation:dt128Line 2.5s linear infinite}.dt128-zone-board article{position:relative;padding:18px 18px 18px 18px;border-radius:20px;background:#fff;border:1px solid #e1e5ec;box-shadow:0 18px 36px rgba(22,28,36,.05);transition:.3s}.dt128-zone-board article:before{content:"";position:absolute;left:-35px;top:50%;width:12px;height:12px;border-radius:50%;transform:translateY(-50%);background:#fff;border:3px solid #ffbf39;box-shadow:0 0 0 5px #f7f8fb}.dt128-zone-board article:hover{transform:translateX(4px)}.dt128-zone-board span,.dt128-zone-board b,.dt128-zone-board small{display:block}.dt128-zone-board span{color:#9c6800;font-size:11px;font-weight:900}.dt128-zone-board b{margin:5px 0 6px;font-size:18px}.dt128-zone-board small{line-height:1.58;color:#5d6673}.dt128-zone-board em{position:absolute;right:18px;top:18px;font-style:normal;padding:7px 10px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:800} .dt128-presence{background:#20252d;color:#fff}.dt128-presence .eyebrow{background:#fff4d7;border-color:#f3cf72;color:#956200}.dt128-presence-copy p{color:#c9d1da}.dt128-presence-media{position:relative;min-height:520px}.dt128-presence-media figure{height:100%;margin:0;border-radius:32px;overflow:hidden;box-shadow:0 28px 74px rgba(0,0,0,.18)}.dt128-presence-media img{width:100%;height:100%;min-height:520px;object-fit:cover;display:block}.dt128-presence-overlay{position:absolute;left:24px;right:24px;bottom:24px;padding:16px 18px;border-radius:22px;background:rgba(24,29,38,.92);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08)}.dt128-presence-overlay b,.dt128-presence-overlay small{display:block}.dt128-presence-overlay small{margin-top:4px;color:#d0d7df;line-height:1.58}.dt128-presence-cards{display:grid;gap:12px;margin-top:22px}.dt128-presence-cards article{padding:16px 18px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08);transition:.3s}.dt128-presence-cards article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.28)}.dt128-presence-cards strong,.dt128-presence-cards span{display:block}.dt128-presence-cards span{margin-top:5px;color:#c9d1da;line-height:1.58} .dt128-load{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.dt128-load-note{margin-top:22px;padding:16px 18px;border-radius:20px;background:#fff;border:1px solid rgba(255,181,31,.18)}.dt128-load-note b,.dt128-load-note small{display:block}.dt128-load-note small{margin-top:4px;line-height:1.58;color:#5d6673}.dt128-load-board{padding:24px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 26px 62px rgba(22,28,36,.16)}.dt128-load-head{margin-bottom:10px}.dt128-load-head b,.dt128-load-head small{display:block}.dt128-load-head small{color:#bdc6d1}.dt128-load-board article{display:grid;grid-template-columns:1fr minmax(140px,220px) auto;gap:16px;align-items:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.08)}.dt128-load-board article:first-of-type{border-top:0}.dt128-load-board article b,.dt128-load-board article small{display:block}.dt128-load-board article small{margin-top:4px;color:#c9d1da}.dt128-load-board article span{height:12px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.dt128-load-board article span i{display:block;height:100%;width:var(--target);border-radius:inherit;background:linear-gradient(90deg,#ffbf39,#ff6a37,#53d587);transform-origin:left center;animation:dt128Grow 1.4s ease}.dt128-load-board article strong{font-size:13px;color:#ffcf68}.dt128-load-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.dt128-load-summary article{padding:14px 15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.dt128-load-summary small,.dt128-load-summary b{display:block}.dt128-load-summary small{color:#ffcf68;font-size:10px;text-transform:uppercase;letter-spacing:.06em}.dt128-load-summary b{margin-top:5px;font-size:14px} .dt128-evidence{background:#fff}.dt128-evidence-list{display:grid;gap:12px;margin-top:22px}.dt128-evidence-list article{padding:16px 18px;border-radius:18px;background:#f7f8fb;border:1px solid #e7ebf1;transition:.3s}.dt128-evidence-list article:hover{transform:translateY(-4px);box-shadow:0 20px 42px rgba(22,28,36,.08)}.dt128-evidence-list b,.dt128-evidence-list small{display:block}.dt128-evidence-list small{margin-top:5px;color:#5d6673;line-height:1.58}.dt128-evidence-stack{display:grid;gap:16px}.dt128-evidence-photo{margin:0;border-radius:30px;overflow:hidden;border:1px solid #e5e9ef;box-shadow:0 28px 70px rgba(22,28,36,.08)}.dt128-evidence-photo img{display:block;width:100%;height:auto}.dt128-evidence-mini{display:grid;grid-template-columns:1fr 1fr;gap:12px}.dt128-evidence-mini article{padding:16px 18px;border-radius:20px;background:#fff8ec;border:1px solid rgba(255,181,31,.16)}.dt128-evidence-mini small,.dt128-evidence-mini b,.dt128-evidence-mini span{display:block}.dt128-evidence-mini small{color:#9c6800;font-size:10px;text-transform:uppercase;letter-spacing:.06em}.dt128-evidence-mini b{margin-top:5px}.dt128-evidence-mini span{margin-top:5px;color:#5d6673;font-size:13px;line-height:1.5} .dt128-boundaries{background:#f7f8fb}.dt128-boundary-tags{display:flex;flex-wrap:wrap;gap:10px;margin-top:20px}.dt128-boundary-tags span{padding:9px 13px;border-radius:999px;background:#fff;border:1px solid rgba(37,42,51,.08);font-size:12px;font-weight:800;color:#48515e}.dt128-boundaries-board{padding:24px;border-radius:32px;background:#fff;border:1px solid #e5e8ef;box-shadow:0 24px 64px rgba(22,28,36,.08)}.dt128-boundaries-board article{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:15px 0;border-top:1px solid rgba(37,42,51,.08)}.dt128-boundaries-board article:first-child{border-top:0}.dt128-boundaries-board b,.dt128-boundaries-board small{display:block}.dt128-boundaries-board small{margin-top:4px;color:#5d6673;line-height:1.5}.dt128-boundaries-board em{font-style:normal;padding:8px 11px;border-radius:999px;font-size:11px;font-weight:800}.dt128-boundaries-board em.on{background:#eaf7f0;color:#267854}.dt128-boundaries-board em.off{background:#f4f5f7;color:#69727d} @keyframes dt128Float{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}@keyframes dt128Line{0%{top:10%}100%{top:78%}}@keyframes dt128Grow{from{transform:scaleX(.25);opacity:.55}to{transform:scaleX(1);opacity:1}} @media(max-width:1100px){.dt128-command-grid,.dt128-zones-grid,.dt128-presence-grid,.dt128-load-grid,.dt128-evidence-grid,.dt128-boundaries-grid{grid-template-columns:1fr}.dt128-command-board img,.dt128-presence-media img{min-height:420px}} @media(max-width:760px){.dt128-zones-list article{grid-template-columns:1fr}.dt128-zone-board{padding:22px 18px 22px 52px}.dt128-zone-board:before{left:26px}.dt128-zone-board:after{left:22px}.dt128-zone-board article:before{left:-26px}.dt128-zone-board em{position:static;justify-self:start;margin-top:10px;display:inline-flex}.dt128-load-board article{grid-template-columns:1fr}.dt128-load-summary,.dt128-evidence-mini{grid-template-columns:1fr}.dt128-command-board img,.dt128-presence-media img{min-height:320px}.dt128-floating{position:static;margin-top:12px;display:block}.dt128-command-board{display:flex;flex-direction:column}.dt128-presence-media{min-height:auto}.dt128-presence-media img{min-height:320px}.dt128-boundaries-board article{flex-direction:column;align-items:flex-start}.hy126-planner-points article{grid-template-columns:42px 1fr}} @media(prefers-reduced-motion:reduce){.dt128-section[data-dt128-reveal]{opacity:1!important;transform:none!important;transition:none!important}.dt128-command-points article,.dt128-zone-board article,.dt128-presence-cards article,.dt128-evidence-list article,.hy126-planner-points article{transition:none!important}.dt128-floating,.dt128-zone-board:after,.dt128-load-board article span i{animation:none!important}} /* Worklix v129 — Hybrid fill + fresh Distributed Teams */ .hy129-planner-insight{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.hy129-planner-insight article{padding:14px 15px;border-radius:18px;background:#20252d;border:1px solid rgba(255,255,255,.07);transition:.3s}.hy129-planner-insight article:hover{transform:translateY(-3px);border-color:rgba(255,181,31,.28)}.hy129-planner-insight small,.hy129-planner-insight b,.hy129-planner-insight span{display:block}.hy129-planner-insight small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.06em}.hy129-planner-insight b{margin-top:5px;color:#fff;font-size:15px}.hy129-planner-insight span{margin-top:5px;color:#bfc7d1;font-size:12px;line-height:1.5} .dt129-section{padding:var(--global-section-space) 0;overflow:hidden}.dt129-section[data-dt129-reveal]{opacity:0;transform:translateY(28px);transition:opacity .72s ease,transform .72s ease}.dt129-section[data-dt129-reveal].is-visible{opacity:1;transform:none} body:not(.home) .dt129-section h2,.dt129-expand h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important}body:not(.home) .dt129-section h3,.dt129-expand h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important}.dt129-section p,.dt129-expand p{font-size:17px;line-height:1.66;color:var(--muted)} .dt129-network{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)}.dt129-network-head{display:grid;grid-template-columns:1fr .72fr;gap:40px;align-items:end;margin-bottom:34px}.dt129-network-head p{margin:0}.dt129-network-stage{display:grid;grid-template-columns:1fr 220px;gap:18px;min-height:500px}.dt129-network-map{position:relative;min-height:500px;border-radius:34px;background:#20252d;border:1px solid rgba(255,255,255,.08);overflow:hidden;box-shadow:0 30px 72px rgba(22,28,36,.14)}.dt129-network-map:before{content:"";position:absolute;inset:0;background-image:radial-gradient(circle at 20% 30%,rgba(255,191,57,.16),transparent 24%),radial-gradient(circle at 75% 25%,rgba(83,213,135,.11),transparent 22%),linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:auto,auto,38px 38px,38px 38px}.dt129-map-center{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:170px;height:170px;border-radius:50%;display:grid;place-content:center;text-align:center;background:#fff4d7;color:#20252d;border:12px solid rgba(255,191,57,.08);box-shadow:0 0 0 1px rgba(255,191,57,.25),0 22px 60px rgba(0,0,0,.2)}.dt129-map-center span{font-size:11px;font-weight:900;color:#956200;text-transform:uppercase;letter-spacing:.08em}.dt129-map-center b{font-size:19px;margin-top:5px}.dt129-map-center small{margin-top:4px;color:#5f6874}.dt129-node{position:absolute;display:flex;align-items:center;gap:11px;padding:12px 14px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08);color:#fff;box-shadow:0 18px 45px rgba(0,0,0,.18);transition:.3s;z-index:2}.dt129-node:hover{transform:translateY(-5px);border-color:rgba(255,191,57,.35)}.dt129-node i{width:40px;height:40px;border-radius:13px;background:#fff4d7;color:#956200;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:900}.dt129-node b,.dt129-node small{display:block}.dt129-node small{margin-top:3px;color:#c2cad4;font-size:11px}.dt129-node.n1{left:6%;top:12%}.dt129-node.n2{right:7%;top:16%}.dt129-node.n3{right:8%;bottom:13%}.dt129-node.n4{left:8%;bottom:14%}.dt129-route{position:absolute;height:2px;background:linear-gradient(90deg,rgba(255,191,57,.12),#ffbf39,rgba(83,213,135,.2));transform-origin:left center;z-index:1}.dt129-route:after{content:"";position:absolute;right:-2px;top:-4px;width:10px;height:10px;border-radius:50%;background:#ffbf39;box-shadow:0 0 18px rgba(255,191,57,.5);animation:dt129Pulse 1.8s ease-in-out infinite}.dt129-route.r1{width:41%;left:22%;top:28%;transform:rotate(18deg)}.dt129-route.r2{width:38%;left:42%;top:58%;transform:rotate(18deg)}.dt129-route.r3{width:35%;left:20%;top:65%;transform:rotate(-22deg)}.dt129-network-rail{display:grid;gap:12px}.dt129-network-rail article{padding:18px;border-radius:22px;background:#fff;border:1px solid rgba(37,42,51,.08);box-shadow:0 18px 42px rgba(22,28,36,.06);display:flex;flex-direction:column;justify-content:center;transition:.3s}.dt129-network-rail article:hover{transform:translateX(-5px)}.dt129-network-rail small,.dt129-network-rail b,.dt129-network-rail span{display:block}.dt129-network-rail small{color:#9b6700;text-transform:uppercase;letter-spacing:.06em;font-size:10px}.dt129-network-rail b{font-size:28px;margin-top:4px}.dt129-network-rail span{margin-top:4px;color:#68717d;font-size:12px;line-height:1.5} .dt129-overlap{background:#fff}.dt129-overlap-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:clamp(30px,4vw,56px);align-items:stretch}.dt129-overlap-copy{display:flex;flex-direction:column;justify-content:center}.dt129-overlap-points{display:grid;gap:12px;margin-top:22px}.dt129-overlap-points article{display:grid;grid-template-columns:44px 1fr;gap:12px;padding:14px 0;border-top:1px solid rgba(37,42,51,.1)}.dt129-overlap-points article>span{width:38px;height:38px;border-radius:12px;background:#fff4d7;color:#956200;display:grid;place-items:center;font-size:11px;font-weight:900}.dt129-overlap-points b,.dt129-overlap-points small{display:block}.dt129-overlap-points small{margin-top:4px;color:#5d6673;line-height:1.55}.dt129-clock-board{padding:26px;border-radius:34px;background:#f7f8fb;border:1px solid #e4e8ee;box-shadow:0 26px 64px rgba(22,28,36,.08);display:grid;grid-template-columns:200px 1fr;gap:24px;align-items:center}.dt129-clock-ring{width:190px;height:190px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#ffbf39 0 72deg,#ff6a37 72deg 150deg,#53d587 150deg 230deg,#e7ebf0 230deg 360deg);padding:14px;animation:dt129Rotate 14s linear infinite}.dt129-clock-ring>div{width:100%;height:100%;border-radius:50%;background:#fff;display:grid;place-content:center;text-align:center;box-shadow:inset 0 0 0 1px #edf0f4}.dt129-clock-ring span,.dt129-clock-ring b,.dt129-clock-ring small{display:block}.dt129-clock-ring span{font-size:32px;font-weight:900}.dt129-clock-ring b{margin-top:4px}.dt129-clock-ring small{margin-top:3px;color:#727b87}.dt129-clock-lanes{display:grid;gap:14px}.dt129-clock-lanes article{display:grid;grid-template-columns:130px 1fr auto;gap:14px;align-items:center}.dt129-clock-lanes b,.dt129-clock-lanes small{display:block}.dt129-clock-lanes small{margin-top:3px;color:#737c88;font-size:11px}.dt129-clock-lanes article>span{position:relative;height:12px;border-radius:999px;background:#e7eaf0;overflow:hidden}.dt129-clock-lanes article>span i{position:absolute;left:var(--start);width:var(--size);height:100%;border-radius:999px;background:linear-gradient(90deg,#ffbf39,#ff8a1f)}.dt129-clock-lanes em{font-style:normal;padding:7px 9px;border-radius:999px;background:#fff;color:#66717d;border:1px solid #e4e7ec;font-size:10px;font-weight:800}.dt129-clock-note{grid-column:1/-1;padding:14px 16px;border-radius:18px;background:#20252d;color:#fff}.dt129-clock-note b,.dt129-clock-note span{display:block}.dt129-clock-note span{margin-top:4px;color:#c6ced8;font-size:12px;line-height:1.55} .dt129-expand{position:relative;padding:var(--global-section-space) 0;background:#20252d;color:#fff;overflow:hidden}.dt129-expand-bg{position:absolute;inset:0;background:linear-gradient(rgba(24,29,38,.86),rgba(24,29,38,.9)),var(--dt129-bg) center/cover no-repeat;transform:scale(1.08);filter:saturate(.7)}.dt129-expand-head,.dt129-expand-frame,.dt129-expand-after{position:relative;z-index:1}.dt129-expand-head{text-align:center;max-width:900px}.dt129-expand-head .eyebrow{background:#fff4d7;border-color:#f3cf72;color:#956200}.dt129-expand-head p{color:#c9d1da;max-width:760px;margin-left:auto;margin-right:auto}.dt129-expand-frame{margin-top:30px}.dt129-expand-media{position:relative;width:min(72%,920px);margin:0 auto;border-radius:30px;overflow:hidden;border:1px solid rgba(255,255,255,.1);box-shadow:0 34px 90px rgba(0,0,0,.34);transform:scale(.82);transition:transform 1s cubic-bezier(.2,.8,.2,1),width 1s cubic-bezier(.2,.8,.2,1)}.dt129-expand.is-expanded .dt129-expand-media{width:min(100%,1180px);transform:scale(1)}.dt129-expand-media img{display:block;width:100%;height:auto}.dt129-expand-badge{position:absolute;left:22px;bottom:22px;padding:13px 15px;border-radius:18px;background:rgba(24,29,38,.9);backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.08)}.dt129-expand-badge small,.dt129-expand-badge b{display:block}.dt129-expand-badge small{color:#ffcf68;font-size:10px;letter-spacing:.08em}.dt129-expand-badge b{margin-top:4px}.dt129-expand-after{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:20px;opacity:.35;transform:translateY(18px);transition:.65s .3s}.dt129-expand.is-expanded .dt129-expand-after{opacity:1;transform:none}.dt129-expand-after article{padding:16px 18px;border-radius:20px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}.dt129-expand-after span{display:inline-grid;width:34px;height:34px;place-items:center;border-radius:11px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900}.dt129-expand-after b,.dt129-expand-after small{display:block}.dt129-expand-after b{margin-top:12px}.dt129-expand-after small{margin-top:5px;color:#c9d1da;line-height:1.55} .dt129-workflow{background:#fff}.dt129-workflow-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:clamp(28px,4vw,54px);align-items:stretch}.dt129-workflow-photo{position:relative;min-height:520px;border-radius:34px;overflow:hidden;box-shadow:0 28px 72px rgba(22,28,36,.12)}.dt129-workflow-photo img{display:block;width:100%;height:100%;min-height:520px;object-fit:cover}.dt129-photo-caption{position:absolute;left:22px;right:22px;bottom:22px;padding:16px 18px;border-radius:20px;background:rgba(24,29,38,.92);backdrop-filter:blur(12px);color:#fff;border:1px solid rgba(255,255,255,.08)}.dt129-photo-caption b,.dt129-photo-caption span{display:block}.dt129-photo-caption span{margin-top:4px;color:#c9d1da;font-size:12px}.dt129-workflow-copy{display:flex;flex-direction:column;justify-content:center}.dt129-workflow-switch{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.dt129-workflow-switch article{padding:18px;border-radius:22px;background:#f7f8fb;border:1px solid #e6e9ef;transition:.3s}.dt129-workflow-switch article:hover{transform:translateY(-5px);border-color:rgba(255,181,31,.3)}.dt129-workflow-switch small,.dt129-workflow-switch b,.dt129-workflow-switch span{display:block}.dt129-workflow-switch small{font-size:10px;color:#9c6800;text-transform:uppercase;letter-spacing:.07em}.dt129-workflow-switch b{margin-top:6px;font-size:17px}.dt129-workflow-switch span{margin-top:5px;color:#606a76;font-size:13px;line-height:1.55} .dt129-capacity{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.dt129-capacity-head{text-align:center;max-width:880px;margin:0 auto 34px}.dt129-capacity-board{display:grid;grid-template-columns:320px 1fr;gap:18px;padding:20px;border-radius:34px;background:#20252d;color:#fff;box-shadow:0 30px 72px rgba(22,28,36,.16)}.dt129-capacity-side{display:grid;gap:10px}.dt129-capacity-side>article,.dt129-capacity-action{padding:16px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.dt129-capacity-side small,.dt129-capacity-side b,.dt129-capacity-side span,.dt129-capacity-action b,.dt129-capacity-action span{display:block}.dt129-capacity-side small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.06em}.dt129-capacity-side b{margin-top:5px}.dt129-capacity-side span,.dt129-capacity-action span{margin-top:5px;color:#c9d1da;font-size:12px;line-height:1.5}.dt129-capacity-action{background:rgba(255,191,57,.08);border-color:rgba(255,191,57,.18)}.dt129-capacity-bars{display:grid;gap:2px}.dt129-capacity-bars article{display:grid;grid-template-columns:180px 1fr 48px;gap:16px;align-items:center;padding:17px 14px;border-bottom:1px solid rgba(255,255,255,.07)}.dt129-capacity-bars article:last-child{border-bottom:0}.dt129-capacity-bars b,.dt129-capacity-bars small{display:block}.dt129-capacity-bars small{margin-top:3px;color:#bfc8d1}.dt129-capacity-bars article>span{height:13px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.dt129-capacity-bars article>span i{display:block;width:var(--target);height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffbf39,#ff8a1f,#53d587);transform-origin:left center;transform:scaleX(.08);transition:transform 1.1s ease .15s}.dt129-capacity.is-visible .dt129-capacity-bars article>span i{transform:scaleX(1)}.dt129-capacity-bars strong{color:#ffcf68;font-size:13px} .dt129-proof{background:#fff}.dt129-proof-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:clamp(28px,4vw,54px);align-items:stretch}.dt129-proof-copy{display:flex;flex-direction:column;justify-content:center}.dt129-proof-tickets{display:grid;gap:10px;margin-top:22px}.dt129-proof-tickets article{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:15px 0;border-top:1px solid rgba(37,42,51,.1)}.dt129-proof-tickets i{width:36px;height:36px;border-radius:11px;background:#fff4d7;color:#956200;display:grid;place-items:center;font-style:normal;font-size:10px;font-weight:900}.dt129-proof-tickets b,.dt129-proof-tickets small{display:block}.dt129-proof-tickets small{margin-top:4px;color:#5d6673;line-height:1.55}.dt129-proof-visual{position:relative;padding:20px;border-radius:34px;background:#f7f8fb;border:1px solid #e5e9ef;display:flex;align-items:center}.dt129-proof-visual img{display:block;width:100%;height:auto;border-radius:24px}.dt129-proof-stamp{position:absolute;right:36px;bottom:36px;padding:14px 16px;border-radius:20px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 18px 42px rgba(22,28,36,.22)}.dt129-proof-stamp span,.dt129-proof-stamp b,.dt129-proof-stamp small{display:block}.dt129-proof-stamp span{color:#ffcf68;font-size:10px;text-transform:uppercase;letter-spacing:.06em}.dt129-proof-stamp b{margin-top:5px}.dt129-proof-stamp small{margin-top:3px;color:#cbd3dc} .dt129-boundary{background:#f7f8fb}.dt129-boundary-shell{display:grid;grid-template-columns:.78fr 1.22fr;gap:34px;align-items:stretch}.dt129-boundary-title{display:flex;flex-direction:column;justify-content:center}.dt129-boundary-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.dt129-boundary-grid article{padding:18px;border-radius:22px;background:#fff;border:1px solid #e4e8ee;transition:.3s}.dt129-boundary-grid article:hover{transform:translateY(-4px)}.dt129-boundary-grid article.allow{box-shadow:inset 4px 0 0 #53d587}.dt129-boundary-grid article.protect{box-shadow:inset 4px 0 0 #ffbf39}.dt129-boundary-grid small,.dt129-boundary-grid b,.dt129-boundary-grid span{display:block}.dt129-boundary-grid small{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#72808b}.dt129-boundary-grid b{margin-top:6px;font-size:16px}.dt129-boundary-grid span{margin-top:5px;color:#606a76;font-size:12px;line-height:1.55} @keyframes dt129Pulse{0%,100%{transform:scale(.75);opacity:.55}50%{transform:scale(1.15);opacity:1}}@keyframes dt129Rotate{to{transform:rotate(360deg)}} @media(max-width:1100px){.dt129-network-head,.dt129-overlap-grid,.dt129-workflow-grid,.dt129-proof-grid,.dt129-boundary-shell{grid-template-columns:1fr}.dt129-network-stage{grid-template-columns:1fr}.dt129-network-rail{grid-template-columns:repeat(3,1fr)}.dt129-capacity-board{grid-template-columns:1fr}.dt129-capacity-side{grid-template-columns:repeat(3,1fr)}.dt129-capacity-action{grid-column:1/-1}} @media(max-width:760px){.hy129-planner-insight,.dt129-network-rail,.dt129-expand-after,.dt129-workflow-switch,.dt129-boundary-grid,.dt129-capacity-side{grid-template-columns:1fr}.dt129-network-map{min-height:650px}.dt129-map-center{width:145px;height:145px}.dt129-node{max-width:180px}.dt129-node.n1{left:5%;top:8%}.dt129-node.n2{right:5%;top:28%}.dt129-node.n3{right:5%;bottom:8%}.dt129-node.n4{left:5%;bottom:29%}.dt129-route{display:none}.dt129-clock-board{grid-template-columns:1fr}.dt129-clock-ring{margin:0 auto}.dt129-clock-lanes article{grid-template-columns:1fr}.dt129-expand-media,.dt129-expand.is-expanded .dt129-expand-media{width:100%;transform:none}.dt129-workflow-photo,.dt129-workflow-photo img{min-height:420px}.dt129-capacity-bars article{grid-template-columns:1fr}.dt129-capacity-bars article>span{width:100%}.dt129-proof-stamp{position:static;margin-top:12px}.dt129-proof-visual{display:block}} @media(prefers-reduced-motion:reduce){.hy129-planner-insight article,.dt129-section[data-dt129-reveal],.dt129-node,.dt129-network-rail article,.dt129-expand-media,.dt129-expand-after,.dt129-workflow-switch article,.dt129-capacity-bars article>span i,.dt129-boundary-grid article{transition:none!important}.dt129-section[data-dt129-reveal]{opacity:1!important;transform:none!important}.dt129-clock-ring,.dt129-route:after{animation:none!important}.dt129-expand-media,.dt129-expand.is-expanded .dt129-expand-media{width:min(100%,1180px)!important;transform:none!important}.dt129-expand-after{opacity:1!important;transform:none!important}} /* Worklix v130 distributed targeted refinements */ .dt130-section{padding:var(--global-section-space) 0}.dt130-ops{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)}.dt130-ops-grid{display:grid;grid-template-columns:.88fr 1.12fr;gap:clamp(30px,4vw,58px);align-items:stretch}.dt130-ops-copy{display:flex;flex-direction:column;justify-content:center}.dt130-ops-copy>p{font-size:17px;line-height:1.66;color:var(--muted)}.dt130-ops-points{display:grid;gap:10px;margin-top:24px}.dt130-ops-points article{display:grid;grid-template-columns:44px 1fr;gap:13px;padding:15px 0;border-top:1px solid rgba(37,42,51,.1)}.dt130-ops-points article>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff4d7;color:#956200;font-size:11px;font-weight:900}.dt130-ops-points b,.dt130-ops-points small{display:block}.dt130-ops-points small{margin-top:4px;color:#5d6673;line-height:1.58}.dt130-ops-console{padding:22px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 74px rgba(22,28,36,.16)}.dt130-console-top{display:flex;justify-content:space-between;align-items:center;gap:14px}.dt130-console-top b,.dt130-console-top small{display:block}.dt130-console-top small{margin-top:3px;color:#b8c0ca}.dt130-console-top>span{padding:8px 11px;border-radius:999px;background:#eaf7f0;color:#267854;font-size:10px;font-weight:900}.dt130-console-kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.dt130-console-kpis article{padding:14px 15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.dt130-console-kpis small,.dt130-console-kpis b,.dt130-console-kpis em{display:block}.dt130-console-kpis small{color:#b8c0ca}.dt130-console-kpis b{font-size:24px;margin:3px 0}.dt130-console-kpis em{font-style:normal;color:#ffcf68;font-size:10px}.dt130-region-table{display:grid;gap:9px}.dt130-region-table article{display:grid;grid-template-columns:42px 1fr auto auto;gap:12px;align-items:center;padding:13px 14px;border-radius:17px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.3s}.dt130-region-table article:hover{transform:translateX(4px);border-color:rgba(255,181,31,.28)}.dt130-region-table i{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff4d7;color:#956200;font-style:normal;font-size:10px;font-weight:900}.dt130-region-table b,.dt130-region-table small{display:block}.dt130-region-table small{margin-top:3px;color:#b9c2cc}.dt130-region-table strong{font-size:13px;color:#ffcf68}.dt130-region-table span{padding:7px 9px;border-radius:999px;font-size:10px;font-weight:800}.dt130-region-table span.good{background:#eaf7f0;color:#267854}.dt130-region-table span.watch{background:#fff4d7;color:#956200}.dt130-console-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}.dt130-console-foot article{padding:13px 14px;border-radius:16px;background:#171c23;border:1px solid rgba(255,255,255,.07)}.dt130-console-foot small,.dt130-console-foot b{display:block}.dt130-console-foot small{color:#aeb7c1}.dt130-console-foot b{margin-top:4px;font-size:13px}.dt129-clock-board{grid-template-columns:220px 1fr!important;align-items:start!important}.dt129-clock-left{display:flex;flex-direction:column;align-items:center;gap:16px}.dt129-clock-ring{animation:none!important}.dt130-overlap-context{width:100%;padding:14px 15px;border-radius:18px;background:#fff;border:1px solid #e5e8ee}.dt130-overlap-context small,.dt130-overlap-context b,.dt130-overlap-context span{display:block}.dt130-overlap-context small{font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:#9b6700}.dt130-overlap-context b{margin-top:5px;font-size:14px}.dt130-overlap-context span{margin-top:5px;font-size:12px;line-height:1.55;color:#66717d}.dt129-clock-lanes article>span i{transform:scaleX(0);transform-origin:left center;transition:transform 1.15s cubic-bezier(.2,.7,.2,1)}.dt129-overlap.is-visible .dt129-clock-lanes article>span i{transform:scaleX(1)}.dt129-boundary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.dt129-boundary-grid article:last-child{grid-column:auto}.dt129-boundary-grid article.allow:nth-child(4){box-shadow:inset 4px 0 0 #53d587}.dt129-boundary-grid article{min-height:122px} @media(max-width:1100px){.dt130-ops-grid{grid-template-columns:1fr}.dt130-ops-console{max-width:none}.dt129-clock-board{grid-template-columns:1fr!important}.dt129-clock-left{max-width:420px;margin:0 auto}.dt129-boundary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}} @media(max-width:760px){.dt130-console-kpis,.dt130-console-foot,.dt129-boundary-grid{grid-template-columns:1fr}.dt130-region-table article{grid-template-columns:42px 1fr}.dt130-region-table strong,.dt130-region-table span{grid-column:2;justify-self:start}.dt130-overlap-context{box-sizing:border-box}.dt129-clock-left{max-width:none;width:100%}} @media(prefers-reduced-motion:reduce){.dt130-region-table article{transition:none!important}.dt129-clock-lanes article>span i{transform:scaleX(1)!important;transition:none!important}} /* ===== Worklix V1.31 Improve Productivity page ===== */ .ip131-section{position:relative;overflow:hidden} .ip131-section .title-line{display:block} [data-ip131-reveal] .ip131-rise{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease} [data-ip131-reveal].is-visible .ip131-rise{opacity:1;transform:none} .ip131-overview{background:linear-gradient(180deg,#fff 0%,#fff9ef 100%)} .ip131-overview-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:48px;align-items:center} .ip131-copy h2,.ip131-signals-copy h2,.ip131-tabs-nav h2,.ip131-photo-copy h2,.ip131-guard-copy h2{font-size:clamp(34px,4vw,56px);line-height:1.04;letter-spacing:-.045em;margin:14px 0 16px} .ip131-copy>p,.ip131-signals-copy>p,.ip131-tabs-nav>p,.ip131-photo-copy>p,.ip131-guard-copy>p{margin:0 0 20px;color:var(--muted);font-size:16px;line-height:1.7} .ip131-check-list{display:grid;gap:14px;margin-top:26px} .ip131-check-list article,.ip131-signal-points article,.ip131-guard-list article{padding:18px 18px 18px 20px;border:1px solid #ebedf2;border-radius:18px;background:#fff;box-shadow:0 12px 26px rgba(22,26,35,.04);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease} .ip131-check-list article:hover,.ip131-signal-points article:hover,.ip131-guard-list article:hover,.ip131-compare-cards article:hover,.ip131-tab-button:hover,.ip131-guard-card:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(22,26,35,.10);border-color:#f4ce77} .ip131-check-list strong,.ip131-signal-points strong,.ip131-guard-list strong{display:block;font-size:16px;line-height:1.35;margin-bottom:6px} .ip131-check-list p,.ip131-signal-points p,.ip131-guard-list p{margin:0;color:var(--muted);font-size:14px;line-height:1.65} .ip131-note-card{margin-top:18px;padding:18px 20px;border-radius:20px;background:#11161f;color:#eef2f7;box-shadow:0 20px 44px rgba(11,16,22,.18)} .ip131-note-card small,.ip131-dashboard-float span,.ip131-mini-insight-grid small,.ip131-tab-panel-head small,.ip131-guard-card small{display:block;font-size:11px;font-weight:800;letter-spacing:.11em;text-transform:uppercase;color:#ffbf3f} .ip131-note-card p{margin:8px 0 0;color:#c3cad4;font-size:14px;line-height:1.7} .ip131-dashboard-stage{position:relative;padding:18px 18px 22px;border-radius:30px;background:linear-gradient(145deg,#0d1118,#1a2330);border:1px solid #1f2937;box-shadow:0 26px 70px rgba(16,22,32,.20)} .ip131-dashboard-stage::before{content:"";position:absolute;inset:20px;border-radius:24px;border:1px solid rgba(255,255,255,.06);pointer-events:none} .ip131-dashboard-frame{border-radius:22px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 55px rgba(0,0,0,.18)} .ip131-dashboard-frame img{width:100%;height:auto;display:block} .ip131-dashboard-float{position:absolute;max-width:220px;padding:15px 16px;border-radius:18px;background:rgba(255,255,255,.96);border:1px solid rgba(223,228,236,.9);backdrop-filter:blur(12px);box-shadow:0 18px 42px rgba(12,16,22,.16)} .ip131-dashboard-float strong{display:block;margin:7px 0 4px;font-size:17px;line-height:1.2;color:#1f2530} .ip131-dashboard-float small{display:block;color:#66707d;font-size:12px;line-height:1.55} .ip131-dashboard-float-top{top:30px;left:-16px} .ip131-dashboard-float-bottom{right:10px;bottom:24px} .ip131-signals{background:#081018;color:#fff} .ip131-signals::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 18% 18%,rgba(255,176,31,.16),transparent 34%),radial-gradient(circle at 88% 68%,rgba(255,106,55,.12),transparent 30%);pointer-events:none} .ip131-signals-grid{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);gap:46px;align-items:center} .ip131-signals-copy .eyebrow{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12);color:#edf2f7} .ip131-signals-copy>p{color:#b5bec9} .ip131-signal-points{display:grid;gap:14px;margin-top:22px} .ip131-signal-points article{background:rgba(255,255,255,.05);border-color:rgba(255,255,255,.08)} .ip131-signal-points p{color:#aab3bf} .ip131-signal-board{display:grid;grid-template-columns:220px 1fr;gap:22px;padding:28px;border-radius:28px;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,.03));border:1px solid rgba(255,255,255,.1);box-shadow:0 28px 64px rgba(0,0,0,.20)} .ip131-signal-ring{position:relative;display:grid;place-items:center;min-height:220px;border-radius:24px;background:radial-gradient(circle at 50% 50%,rgba(255,255,255,.06),rgba(255,255,255,.02));overflow:hidden} .ip131-signal-ring::before{content:"";position:absolute;inset:18px;border-radius:50%;background:conic-gradient(#ffbf1f 0 68%,rgba(255,255,255,.14) 68% 100%)} .ip131-signal-ring::after{content:"";position:absolute;inset:42px;border-radius:50%;background:#09111a;box-shadow:inset 0 0 0 1px rgba(255,255,255,.06)} .ip131-ring-core{position:relative;z-index:1;text-align:center} .ip131-ring-core b{display:block;font-size:44px;line-height:1;color:#fff} .ip131-ring-core small{display:block;margin-top:8px;font-size:12px;color:#aeb7c2;text-transform:uppercase;letter-spacing:.08em} .ip131-signal-mix{display:grid;gap:14px;align-content:start} .ip131-progress-row{display:grid;grid-template-columns:84px 1fr auto;gap:12px;align-items:center;font-size:13px;color:#dbe1ea} .ip131-progress-row span{color:#dbe1ea} .ip131-progress-track{height:9px;border-radius:999px;background:rgba(255,255,255,.12);overflow:hidden} .ip131-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffcf46,#ff7b43);transition:width .9s cubic-bezier(.2,.7,.2,1)} [data-ip131-reveal].is-visible .ip131-progress-track i{width:var(--fill)} .ip131-progress-row b{font-size:12px;color:#ffcf5b} .ip131-mini-insight-grid{grid-column:1/-1;display:grid;grid-template-columns:repeat(2,1fr);gap:14px;margin-top:4px} .ip131-mini-insight-grid article{padding:16px 18px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)} .ip131-mini-insight-grid strong{display:block;margin:6px 0 4px;font-size:22px;color:#fff} .ip131-mini-insight-grid p{margin:0;color:#aab3bf;font-size:13px;line-height:1.6} .ip131-tabs-grid{display:grid;grid-template-columns:minmax(0,.84fr) minmax(0,1.16fr);gap:32px;align-items:start} .ip131-tabs-nav{position:sticky;top:116px;padding:30px;border-radius:28px;background:linear-gradient(180deg,#fffaf2,#fff);border:1px solid #ece8df;box-shadow:0 18px 42px rgba(22,26,35,.06)} .ip131-tab-buttons{display:grid;gap:12px;margin-top:22px} .ip131-tab-button{appearance:none;border:1px solid #e8e2d7;background:#fff;border-radius:16px;padding:16px 18px;text-align:left;font-weight:800;font-size:15px;color:#2a313b;cursor:pointer;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease,background .28s ease} .ip131-tab-button.is-active{background:linear-gradient(180deg,#fff6df,#fff);border-color:#f4cd72;box-shadow:0 16px 34px rgba(255,181,31,.15);color:#9b6200} .ip131-tab-panel{padding:30px;border-radius:30px;background:#0f141c;color:#fff;border:1px solid #1f2934;box-shadow:0 28px 70px rgba(9,13,18,.18)} .ip131-tab-panel-head h3{font-size:34px;line-height:1.1;letter-spacing:-.04em;margin:10px 0 12px;max-width:12ch} .ip131-tab-panel-head p{margin:0;color:#aab3bf;font-size:15px;line-height:1.75;max-width:58ch} .ip131-tab-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:24px 0} .ip131-tab-stats article{padding:18px;border-radius:20px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08)} .ip131-tab-stats small{display:block;color:#98a2af;font-size:11px;text-transform:uppercase;letter-spacing:.1em} .ip131-tab-stats strong{display:block;margin-top:8px;font-size:18px;line-height:1.35;color:#fff} .ip131-tab-notes{display:grid;gap:14px} .ip131-tab-notes article{display:grid;grid-template-columns:52px 1fr;gap:14px;align-items:start;padding:18px;border-radius:20px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.08)} .ip131-tab-notes span{display:grid;place-items:center;width:52px;height:52px;border-radius:16px;background:linear-gradient(135deg,#ffbf1f,#ff7b43);color:#15181d;font-weight:900} .ip131-tab-notes b{display:block;margin-bottom:5px;font-size:17px;color:#fff} .ip131-tab-notes p{margin:0;color:#aeb7c2;font-size:14px;line-height:1.65} .ip131-photo-section{background:var(--surface)} .ip131-photo-grid{display:grid;grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);gap:36px;align-items:center} .ip131-photo-card{position:relative;margin:0;border-radius:28px;overflow:hidden;box-shadow:0 24px 60px rgba(22,26,35,.12)} .ip131-photo-card img{width:100%;min-height:560px;object-fit:cover} .ip131-photo-card figcaption{position:absolute;left:22px;right:22px;bottom:22px;padding:18px 20px;border-radius:20px;background:rgba(15,20,28,.82);backdrop-filter:blur(10px);color:#fff;border:1px solid rgba(255,255,255,.08)} .ip131-photo-card small{display:block;font-size:11px;text-transform:uppercase;letter-spacing:.1em;color:#ffcf66} .ip131-photo-card strong{display:block;margin-top:8px;font-size:18px;line-height:1.45} .ip131-compare-cards{display:grid;gap:14px;margin-top:22px} .ip131-compare-cards article{padding:18px 20px;border-radius:20px;background:#fff;border:1px solid #e6e9ef;box-shadow:0 12px 26px rgba(22,26,35,.04);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease} .ip131-compare-cards b{display:block;margin-bottom:6px;font-size:16px;line-height:1.35} .ip131-compare-cards p{margin:0;color:var(--muted);font-size:14px;line-height:1.65} .ip131-guardrails{background:linear-gradient(180deg,#fff,#fff9ef)} .ip131-guard-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:38px;align-items:start} .ip131-guard-list{display:grid;gap:14px;margin-top:22px} .ip131-guard-cards{display:grid;gap:16px} .ip131-guard-card{padding:24px;border-radius:26px;background:#fff;border:1px solid #e8ebf0;box-shadow:0 18px 40px rgba(22,26,35,.08);transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease} .ip131-guard-card-dark{background:#0f141c;color:#fff;border-color:#222b39} .ip131-guard-card strong{display:block;margin:10px 0 12px;font-size:26px;line-height:1.15;letter-spacing:-.04em} .ip131-guard-card p{margin:0;color:var(--muted);font-size:14px;line-height:1.7} .ip131-guard-card-dark p{color:#aab3bf} .ip131-access-stack{display:grid;gap:12px;margin-top:18px} .ip131-access-stack div{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 16px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)} .ip131-access-stack span{font-size:13px;color:#b0b8c3} .ip131-access-stack b{font-size:15px;color:#fff;letter-spacing:0;margin:0} .ip131-guard-card a{display:inline-flex;align-items:center;gap:8px;margin-top:18px;font-size:14px;font-weight:800;color:#a96c00} @media(max-width:1180px){ .ip131-overview-grid,.ip131-signals-grid,.ip131-tabs-grid,.ip131-photo-grid,.ip131-guard-grid{grid-template-columns:1fr} .ip131-tabs-nav{position:relative;top:auto} .ip131-dashboard-float-top{left:12px} .ip131-dashboard-float-bottom{right:12px} } @media(max-width:820px){ .ip131-section{overflow:visible} .ip131-dashboard-stage,.ip131-tab-panel,.ip131-tabs-nav,.ip131-photo-card,.ip131-guard-card{border-radius:24px} .ip131-dashboard-float{position:relative;inset:auto!important;max-width:none;margin-top:14px} .ip131-signal-board{grid-template-columns:1fr;padding:22px} .ip131-tab-panel-head h3{font-size:28px;max-width:none} .ip131-tab-stats,.ip131-mini-insight-grid{grid-template-columns:1fr} .ip131-photo-card img{min-height:420px} } @media(max-width:620px){ .ip131-copy h2,.ip131-signals-copy h2,.ip131-tabs-nav h2,.ip131-photo-copy h2,.ip131-guard-copy h2{font-size:clamp(30px,10vw,42px)} .ip131-dashboard-stage{padding:14px} .ip131-tab-panel,.ip131-tabs-nav{padding:22px} .ip131-tab-notes article{grid-template-columns:1fr} .ip131-tab-notes span{width:46px;height:46px} .ip131-photo-card figcaption{left:16px;right:16px;bottom:16px} .ip131-check-list article,.ip131-signal-points article,.ip131-compare-cards article,.ip131-guard-list article{padding:16px} } /* ===== Worklix V1.32 Improve Productivity balance + Agencies ===== */ /* Improve Productivity: balance the first three requested two-column sections with content, not filler spacing. */ .ip132-dashboard-context{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px} .ip132-dashboard-context article{padding:14px 15px;border-radius:17px;background:#171e28;border:1px solid rgba(255,255,255,.08);color:#fff} .ip132-dashboard-context small,.ip132-signal-next small,.ip132-tabs-context small{display:block;font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#ffbf3f} .ip132-dashboard-context strong{display:block;margin:6px 0 4px;font-size:15px;line-height:1.35} .ip132-dashboard-context p{margin:0;color:#aeb8c4;font-size:12px;line-height:1.55} .ip132-signal-next{grid-column:1/-1;display:grid;grid-template-columns:160px 1fr;gap:18px;align-items:center;padding:17px 18px;border-radius:18px;background:rgba(255,191,31,.08);border:1px solid rgba(255,191,31,.18)} .ip132-signal-next strong{display:block;margin-top:4px;font-size:15px;color:#fff}.ip132-signal-next p{margin:0;color:#aeb7c2;font-size:13px;line-height:1.6} .ip132-tabs-context{display:grid;gap:10px;margin-top:18px} .ip132-tabs-context article{padding:15px 16px;border-radius:16px;background:#fff;border:1px solid #e8e2d7} .ip132-tabs-context strong{display:block;margin:5px 0;font-size:14px;line-height:1.4}.ip132-tabs-context p{margin:0;color:var(--muted);font-size:12px;line-height:1.55} @media(max-width:720px){.ip132-dashboard-context{grid-template-columns:1fr}.ip132-signal-next{grid-template-columns:1fr}} /* Agencies page */ .ag132-section{position:relative;padding:var(--global-section-space) 0;overflow:hidden} .ag132-section .title-line{display:block} .ag132-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important} .ag132-section h3,.ag132-section article>b,.ag132-section article strong{font-size:var(--inner-card-title-size)} [data-ag132-reveal] .ag132-rise{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease} [data-ag132-reveal].is-visible .ag132-rise{opacity:1;transform:none} .ag132-margin{background:linear-gradient(180deg,#fff 0%,#fff9ef 100%)} .ag132-margin-grid,.ag132-scope-grid,.ag132-capacity-grid,.ag132-permissions-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4vw,56px);align-items:stretch} .ag132-margin-copy,.ag132-scope-copy,.ag132-capacity-copy,.ag132-permissions-copy{display:flex;flex-direction:column;justify-content:center} .ag132-margin-copy>p,.ag132-scope-copy>p,.ag132-capacity-copy>p,.ag132-permissions-copy>p,.ag132-time-head>p,.ag132-proof-head>p{font-size:17px;line-height:1.68;color:var(--muted)} .ag132-margin-points{display:grid;gap:11px;margin-top:22px} .ag132-margin-points article{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:15px 0;border-top:1px solid rgba(37,42,51,.1)} .ag132-margin-points article>span{width:38px;height:38px;border-radius:12px;background:#fff4d7;color:#956200;display:grid;place-items:center;font-size:11px;font-weight:900} .ag132-margin-points b,.ag132-margin-points small{display:block}.ag132-margin-points small{margin-top:4px;color:#5d6673;line-height:1.6} .ag132-margin-board{height:100%;padding:24px;border-radius:30px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 70px rgba(22,28,36,.18)} .ag132-board-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.ag132-board-head b,.ag132-board-head small{display:block}.ag132-board-head small{color:#b9c2cd}.ag132-board-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:11px;font-weight:800} .ag132-margin-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0 8px}.ag132-margin-summary article{padding:14px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.ag132-margin-summary small,.ag132-margin-summary b,.ag132-margin-summary em{display:block}.ag132-margin-summary small{font-size:10px;color:#aeb7c2}.ag132-margin-summary b{margin:5px 0 2px;font-size:22px}.ag132-margin-summary em{font-style:normal;color:#ffcf68;font-size:10px} .ag132-client-ledger{display:grid}.ag132-client-ledger article{display:grid;grid-template-columns:minmax(145px,1fr) minmax(110px,.8fr) 44px 82px;gap:12px;align-items:center;padding:14px 0;border-top:1px solid rgba(255,255,255,.08)}.ag132-client-ledger b,.ag132-client-ledger small{display:block}.ag132-client-ledger small{margin-top:3px;color:#b8c1cb;font-size:11px}.ag132-client-ledger article>span{height:9px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.ag132-client-ledger article>span i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffbf39,#ff783e);transition:width .95s cubic-bezier(.2,.7,.2,1)}[data-ag132-reveal].is-visible .ag132-client-ledger article>span i{width:var(--target)}.ag132-client-ledger strong{font-size:12px!important;color:#ffcf68}.ag132-client-ledger em{font-style:normal;text-align:center;padding:7px 8px;border-radius:999px;font-size:9px;font-weight:800}.ag132-client-ledger em.healthy{background:#eaf7f0;color:#267854}.ag132-client-ledger em.watch{background:#fff1dc;color:#a86000}.ag132-margin-foot{margin-top:8px;padding:15px 16px;border-radius:18px;background:rgba(255,191,31,.08);border:1px solid rgba(255,191,31,.14)}.ag132-margin-foot b,.ag132-margin-foot span{display:block}.ag132-margin-foot span{margin-top:4px;color:#c8d0da;font-size:12px;line-height:1.55} .ag132-time{background:#fff}.ag132-time-shell{display:grid;gap:30px}.ag132-time-head{max-width:780px}.ag132-time-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(260px,.75fr);gap:18px;padding:24px;border-radius:30px;background:#f7f8fb;border:1px solid #e4e8ef} .ag132-time-canvas{padding:20px;border-radius:22px;background:#fff;border:1px solid #e4e8ef;overflow:hidden}.ag132-time-scale{display:grid;grid-template-columns:repeat(6,1fr);padding:0 0 12px 118px;color:#8a94a0;font-size:10px}.ag132-time-lane{position:relative;min-height:74px;padding-left:118px;border-top:1px solid #edf0f4}.ag132-time-lane>b{position:absolute;left:0;top:22px;font-size:13px!important;color:#37404c}.ag132-time-lane::after{content:"";position:absolute;left:118px;right:0;top:0;bottom:0;background:repeating-linear-gradient(90deg,transparent 0 calc(16.666% - 1px),#edf0f4 calc(16.666% - 1px) 16.666%);pointer-events:none}.ag132-time-lane .block{position:absolute;left:calc(118px + (100% - 118px) * var(--start));top:17px;width:calc((100% - 118px) * var(--size));z-index:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;padding:9px 10px;border-radius:11px;font-style:normal;font-size:10px;font-weight:800}.ag132-time-lane .strategy{background:#fff0bf;color:#845500}.ag132-time-lane .creative{background:#ffe1d6;color:#8d3c20}.ag132-time-lane .growth{background:#e6f6ef;color:#236a4a}.ag132-time-lane .internal{background:#e9edf4;color:#55606d} .ag132-time-aside{display:grid;gap:10px}.ag132-time-aside article{padding:17px;border-radius:18px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);transition:.3s}.ag132-time-aside article:hover{transform:translateY(-4px)}.ag132-time-aside small,.ag132-time-aside b,.ag132-time-aside span{display:block}.ag132-time-aside small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.06em}.ag132-time-aside b{margin:5px 0 2px;font-size:22px!important}.ag132-time-aside span{font-size:11px;color:#b7c0cb}.ag132-time-aside>a{display:flex;justify-content:space-between;align-items:center;padding:15px 16px;border-radius:18px;background:#fff4d7;border:1px solid #f2d383;color:#8f5c00;font-size:12px;font-weight:800} .ag132-scope{background:#20252d;color:#fff}.ag132-scope .eyebrow{background:#fff4d7;border-color:#f2d27d;color:#956200}.ag132-scope-copy>p{color:#c7d0da}.ag132-scope-stage{position:relative;padding:26px 24px 26px 70px;border-radius:30px;background:#282f39;border:1px solid rgba(255,255,255,.08);display:grid;gap:12px}.ag132-scope-line{position:absolute;left:39px;top:35px;bottom:35px;width:3px;border-radius:999px;background:linear-gradient(180deg,#ffbf39,#ff6a37,#53d587);overflow:hidden}.ag132-scope-line i{position:absolute;left:-4px;top:-12%;width:11px;height:70px;border-radius:999px;background:linear-gradient(rgba(255,191,31,0),#ffbf39,rgba(83,213,135,0));animation:ag132Line 2.5s linear infinite}.ag132-scope-stage article{position:relative;display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;padding:16px;border-radius:18px;background:#20252d;border:1px solid rgba(255,255,255,.08);transition:.3s}.ag132-scope-stage article:hover{transform:translateX(5px);border-color:rgba(255,191,31,.26)}.ag132-scope-stage article:before{content:"";position:absolute;left:-38px;top:50%;width:11px;height:11px;border-radius:50%;transform:translateY(-50%);background:#fff;border:3px solid #ffbf39;box-shadow:0 0 0 5px #282f39}.ag132-scope-stage article>span{font-size:10px;font-weight:900;color:#ffcf68}.ag132-scope-stage b,.ag132-scope-stage small{display:block}.ag132-scope-stage small{margin-top:4px;color:#b9c2cc;line-height:1.45}.ag132-scope-stage em{font-style:normal;padding:7px 9px;border-radius:999px;background:#eef4f0;color:#267854;font-size:9px;font-weight:800}.ag132-scope-stage em.warn{background:#fff0dc;color:#a96000}.ag132-scope-stage em.good{background:#eaf7f0;color:#267854}.ag132-scope-callout{margin:20px 0;padding:18px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.ag132-scope-callout small,.ag132-scope-callout strong{display:block}.ag132-scope-callout small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.08em}.ag132-scope-callout strong{margin-top:6px;font-size:18px!important}.ag132-scope-callout p{margin:7px 0 0;color:#bdc6d1;font-size:13px;line-height:1.62}.ag132-scope .btn-secondary{align-self:flex-start;background:#fff;color:#20252d;border-color:#fff} .ag132-capacity{background:linear-gradient(180deg,#fff8ec,#fff)}.ag132-capacity-bars{display:grid;gap:10px;margin-top:22px}.ag132-capacity-bars article{display:grid;grid-template-columns:1fr minmax(130px,190px) 42px;gap:12px;align-items:center;padding:13px 0;border-top:1px solid rgba(37,42,51,.1)}.ag132-capacity-bars b,.ag132-capacity-bars small{display:block}.ag132-capacity-bars small{margin-top:3px;color:#697380;font-size:11px}.ag132-capacity-bars article>span{height:10px;border-radius:999px;background:#eceff3;overflow:hidden}.ag132-capacity-bars article>span i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffbf39,#ff6a37);transition:width .95s cubic-bezier(.2,.7,.2,1)}[data-ag132-reveal].is-visible .ag132-capacity-bars article>span i{width:var(--target)}.ag132-capacity-bars strong{font-size:12px!important;color:#8f5c00}.ag132-capacity-note{margin-top:16px;padding:15px 17px;border-radius:18px;background:#fff;border:1px solid rgba(255,191,31,.22)}.ag132-capacity-note b,.ag132-capacity-note span{display:block}.ag132-capacity-note span{margin-top:4px;color:#5d6673;font-size:12px;line-height:1.55}.ag132-capacity-photo{position:relative;margin:0;height:100%;min-height:560px;border-radius:30px;overflow:hidden;box-shadow:0 26px 66px rgba(22,28,36,.12)}.ag132-capacity-photo img{width:100%;height:100%;object-fit:cover}.ag132-capacity-photo figcaption{position:absolute;left:22px;right:22px;bottom:22px;padding:17px 18px;border-radius:20px;background:rgba(24,29,38,.9);color:#fff;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08)}.ag132-capacity-photo small,.ag132-capacity-photo strong{display:block}.ag132-capacity-photo small{color:#ffcf68;font-size:10px;text-transform:uppercase;letter-spacing:.07em}.ag132-capacity-photo strong{margin-top:5px;font-size:16px!important;line-height:1.45} .ag132-proof{background:#fff}.ag132-proof-head{max-width:860px;margin:0 auto 32px;text-align:center}.ag132-proof-head .eyebrow{margin-inline:auto}.ag132-proof-expand{position:relative;min-height:640px;border-radius:34px;overflow:hidden;transform:scale(var(--expand-scale,.94));opacity:var(--expand-opacity,.72);transition:transform .18s linear,opacity .18s linear;box-shadow:0 30px 80px rgba(22,28,36,.16)}.ag132-proof-expand figure{margin:0;position:absolute;inset:0}.ag132-proof-expand img{width:100%;height:100%;object-fit:cover}.ag132-proof-expand:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(10,14,20,.02),rgba(10,14,20,.68));pointer-events:none}.ag132-proof-overlay{position:absolute;z-index:2;left:24px;right:24px;bottom:24px;display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:end;padding:20px;border-radius:24px;background:rgba(16,21,29,.9);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.08);color:#fff}.ag132-proof-overlay small,.ag132-proof-overlay strong{display:block}.ag132-proof-overlay small{font-size:10px;color:#ffcf68;letter-spacing:.08em}.ag132-proof-overlay strong{margin-top:5px;font-size:18px}.ag132-proof-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.ag132-proof-metrics span{padding:12px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}.ag132-proof-metrics b{display:block;font-size:18px}.ag132-proof-metrics small{margin-top:2px;color:#c4ccd6}.ag132-proof-overlay>p{grid-column:1/-1;margin:0;color:#c9d1da;font-size:13px;line-height:1.6} .ag132-permissions{background:#f7f8fb}.ag132-permission-tags{display:flex;flex-wrap:wrap;gap:9px;margin-top:20px}.ag132-permission-tags span{padding:9px 12px;border-radius:999px;background:#fff;border:1px solid #e5e8ee;font-size:11px;font-weight:800;color:#4d5663}.ag132-portfolio-board{height:100%;padding:24px;border-radius:30px;background:#fff;border:1px solid #e4e8ee;box-shadow:0 24px 64px rgba(22,28,36,.08)}.ag132-portfolio-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:14px}.ag132-portfolio-head b,.ag132-portfolio-head small{display:block}.ag132-portfolio-head small{color:#737d89}.ag132-portfolio-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:800}.ag132-portfolio-board>article{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:14px 0;border-top:1px solid rgba(37,42,51,.08)}.ag132-portfolio-board b,.ag132-portfolio-board small{display:block}.ag132-portfolio-board small{margin-top:3px;color:#6d7682;font-size:11px}.ag132-portfolio-board em{font-style:normal;padding:7px 10px;border-radius:999px;font-size:9px;font-weight:800}.ag132-portfolio-board em.on{background:#eaf7f0;color:#267854}.ag132-portfolio-board em.review{background:#fff4d7;color:#956200}.ag132-portfolio-board em.off{background:#f0f2f5;color:#68727e}.ag132-portfolio-foot{margin-top:14px;padding:15px 16px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,191,31,.18)}.ag132-portfolio-foot b,.ag132-portfolio-foot span{display:block}.ag132-portfolio-foot span{margin-top:4px;color:#5d6673;font-size:12px;line-height:1.55} @keyframes ag132Line{0%{top:-12%}100%{top:90%}} @media(max-width:1100px){.ag132-margin-grid,.ag132-scope-grid,.ag132-capacity-grid,.ag132-permissions-grid{grid-template-columns:1fr}.ag132-time-layout{grid-template-columns:1fr}.ag132-capacity-photo{min-height:480px}.ag132-proof-expand{min-height:560px}} @media(max-width:760px){.ag132-margin-summary{grid-template-columns:1fr}.ag132-client-ledger article{grid-template-columns:1fr}.ag132-time-scale{display:none}.ag132-time-lane{padding-left:0;padding-top:38px;min-height:112px}.ag132-time-lane>b{top:10px}.ag132-time-lane::after{left:0}.ag132-time-lane .block{left:calc(100% * var(--start));width:calc(100% * var(--size));top:46px}.ag132-scope-stage{padding:22px 16px 22px 54px}.ag132-scope-line{left:27px}.ag132-scope-stage article{grid-template-columns:42px 1fr}.ag132-scope-stage article em{grid-column:2;justify-self:start}.ag132-scope-stage article:before{left:-33px}.ag132-capacity-bars article{grid-template-columns:1fr}.ag132-proof-expand{min-height:520px}.ag132-proof-overlay{left:14px;right:14px;bottom:14px;grid-template-columns:1fr}.ag132-proof-metrics{grid-template-columns:repeat(3,1fr)}.ag132-portfolio-board>article{flex-direction:column;align-items:flex-start}} @media(max-width:560px){.ag132-proof-metrics{grid-template-columns:1fr}.ag132-capacity-photo{min-height:420px}.ag132-proof-expand{min-height:500px}} @media(prefers-reduced-motion:reduce){[data-ag132-reveal] .ag132-rise{opacity:1!important;transform:none!important;transition:none!important}.ag132-client-ledger article>span i,.ag132-capacity-bars article>span i{width:var(--target)!important;transition:none!important}.ag132-scope-line i{animation:none!important}.ag132-time-aside article,.ag132-scope-stage article{transition:none!important}} /* ===== Worklix V1.33 targeted productivity + agencies + in-office teams ===== */ /* Improve Productivity: fresh signal-to-action flow */ .ip133-action-section{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)} .ip133-action-shell{display:grid;grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);gap:clamp(30px,4vw,56px);align-items:stretch} .ip133-action-intro{display:flex;flex-direction:column;justify-content:center} .ip133-action-intro h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:16px 0} .ip133-action-intro>p{margin:0;color:var(--muted);font-size:17px;line-height:1.68} .ip133-action-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:24px} .ip133-action-summary article{padding:18px;border-radius:20px;background:#fff;border:1px solid #e9e5dc;box-shadow:0 16px 34px rgba(22,28,36,.06);transition:.28s} .ip133-action-summary article:hover{transform:translateY(-4px);border-color:#f2cd77;box-shadow:0 22px 42px rgba(22,28,36,.1)} .ip133-action-summary small,.ip133-action-summary strong,.ip133-action-summary span{display:block}.ip133-action-summary small{font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:#9a6400;font-weight:800}.ip133-action-summary strong{margin-top:7px;font-size:17px}.ip133-action-summary span{margin-top:4px;font-size:12px;color:#6a7480} .ip133-action-path{position:relative;padding:26px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 70px rgba(22,28,36,.17);overflow:hidden} .ip133-action-path::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 90% 0%,rgba(255,191,31,.13),transparent 28%),linear-gradient(rgba(255,255,255,.02) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.02) 1px,transparent 1px);background-size:auto,52px 52px,52px 52px;pointer-events:none} .ip133-action-step,.ip133-action-footer{position:relative;z-index:1}.ip133-action-step{display:grid;grid-template-columns:52px 1fr auto;gap:14px;align-items:start;padding:18px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.08);transition:.3s} .ip133-action-step:hover{transform:translateX(5px);border-color:rgba(255,191,31,.28)} .ip133-action-step>span{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:#313945;color:#ffcf68;font-weight:900}.ip133-action-step.is-hot>span{background:linear-gradient(135deg,#ffd34e,#ff8a36);color:#20252d} .ip133-action-step small,.ip133-action-step b,.ip133-action-step p{display:block}.ip133-action-step small{font-size:10px;color:#ffcf68;letter-spacing:.08em}.ip133-action-step b{margin:5px 0 4px;font-size:17px}.ip133-action-step p{margin:0;color:#bdc6d1;font-size:13px;line-height:1.6}.ip133-action-step em{font-style:normal;padding:7px 10px;border-radius:999px;background:rgba(255,255,255,.07);color:#d6dce4;font-size:10px;font-weight:800} .ip133-action-connector{position:relative;height:28px;margin-left:25px}.ip133-action-connector::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;border-radius:999px;background:rgba(255,255,255,.1)}.ip133-action-connector i{position:absolute;left:-1px;top:-7px;width:5px;height:13px;border-radius:999px;background:#ffbf39;box-shadow:0 0 18px rgba(255,191,57,.55);animation:ip133Connector 1.8s ease-in-out infinite} .ip133-action-footer{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;margin-top:18px;padding:17px 18px;border-radius:20px;background:#fff4d7;color:#252a33}.ip133-action-footer small,.ip133-action-footer strong{display:block}.ip133-action-footer small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#9a6400}.ip133-action-footer strong{margin-top:4px}.ip133-action-footer p{margin:0;color:#5f6874;font-size:12px;line-height:1.55} @keyframes ip133Connector{0%,100%{transform:translateY(0);opacity:.55}50%{transform:translateY(19px);opacity:1}} /* Agencies refinements */ .ag133-permission-context{display:grid;gap:10px;margin-top:18px}.ag133-permission-context article{padding:15px 17px;border-radius:18px;background:#fff;border:1px solid #e5e8ee;box-shadow:0 12px 26px rgba(22,28,36,.04);transition:.28s}.ag133-permission-context article:hover{transform:translateY(-3px);border-color:rgba(255,191,31,.32);box-shadow:0 18px 36px rgba(22,28,36,.08)}.ag133-permission-context small,.ag133-permission-context strong{display:block}.ag133-permission-context small{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#9a6400}.ag133-permission-context strong{margin-top:5px;font-size:15px}.ag133-permission-context p{margin:5px 0 0;color:#66707d;font-size:12px;line-height:1.6} .ag132-capacity-bars article>span i{width:var(--target)!important;transform:scaleX(0);transform-origin:left center;transition:none!important} [data-ag132-reveal].is-visible .ag132-capacity-bars article>span i{animation:ag133BarGrow .95s cubic-bezier(.2,.7,.2,1) forwards} [data-ag132-reveal].is-visible .ag132-capacity-bars article:nth-child(2)>span i{animation-delay:.12s}[data-ag132-reveal].is-visible .ag132-capacity-bars article:nth-child(3)>span i{animation-delay:.24s}[data-ag132-reveal].is-visible .ag132-capacity-bars article:nth-child(4)>span i{animation-delay:.36s} @keyframes ag133BarGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}} /* In-office teams */ .io133-section{position:relative;padding:var(--global-section-space) 0;overflow:hidden} .io133-section .title-line{display:block} body:not(.home) .io133-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:16px 0} body:not(.home) .io133-section h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important} [data-io133-reveal] .io133-rise{opacity:0;transform:translateY(26px);transition:opacity .68s ease,transform .68s ease}[data-io133-reveal].is-visible .io133-rise{opacity:1;transform:none} .io133-pulse{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)}.io133-pulse-grid,.io133-arrivals-grid,.io133-floor-grid,.io133-friction-grid,.io133-access-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4vw,56px);align-items:stretch}.io133-pulse-copy,.io133-arrivals-copy,.io133-floor-copy,.io133-friction-copy,.io133-access-copy{display:flex;flex-direction:column;justify-content:center}.io133-pulse-copy>p,.io133-arrivals-copy>p,.io133-floor-copy>p,.io133-friction-copy>p,.io133-access-copy>p{font-size:17px;line-height:1.68;color:var(--muted);margin:0} .io133-pulse-points{display:grid;gap:11px;margin-top:24px}.io133-pulse-points article{display:grid;grid-template-columns:42px 1fr;gap:13px;padding:15px 0;border-top:1px solid rgba(37,42,51,.1)}.io133-pulse-points article>span{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#fff4d7;color:#956200;font-size:10px;font-weight:900}.io133-pulse-points b,.io133-pulse-points small{display:block}.io133-pulse-points small{margin-top:4px;color:#68717d;line-height:1.52} .io133-pulse-board{padding:24px;border-radius:30px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 68px rgba(22,28,36,.18)}.io133-pulse-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.io133-pulse-head b,.io133-pulse-head small{display:block}.io133-pulse-head small{color:#aeb7c2}.io133-pulse-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:800}.io133-pulse-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:18px 0}.io133-pulse-metrics article{padding:14px;border-radius:17px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.io133-pulse-metrics small,.io133-pulse-metrics b,.io133-pulse-metrics span{display:block}.io133-pulse-metrics small{font-size:10px;text-transform:uppercase;color:#aeb7c2;letter-spacing:.06em}.io133-pulse-metrics b{font-size:24px;margin:5px 0 2px}.io133-pulse-metrics span{font-size:10px;color:#ffcf68}.io133-floor-list{display:grid;gap:8px}.io133-floor-list article{display:grid;grid-template-columns:42px 1fr auto;gap:12px;align-items:center;padding:13px 14px;border-radius:17px;background:#282f39;border:1px solid rgba(255,255,255,.08);transition:.28s}.io133-floor-list article:hover{transform:translateX(4px);border-color:rgba(255,191,31,.25)}.io133-avatar{width:40px;height:40px;border-radius:13px;display:grid;place-items:center;background:#343c48;color:#ffcf68;font-size:10px;font-weight:900}.io133-floor-list b,.io133-floor-list small{display:block}.io133-floor-list small{color:#aeb7c2;font-size:11px}.io133-floor-list em{font-style:normal;padding:7px 9px;border-radius:999px;font-size:9px;font-weight:800}.io133-floor-list em.ok{background:#eaf7f0;color:#267854}.io133-floor-list em.warn{background:#fff0dc;color:#a96000}.io133-floor-list em.away{background:#eef1f5;color:#5d6673}.io133-pulse-foot{display:flex;gap:11px;align-items:flex-start;margin-top:16px;padding:14px 15px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}.io133-pulse-foot>span{width:9px;height:9px;border-radius:50%;background:#ffbf39;box-shadow:0 0 0 5px rgba(255,191,57,.1);margin-top:5px}.io133-pulse-foot p{margin:0;color:#c0c8d2;font-size:12px;line-height:1.58} .io133-arrivals{background:#fff}.io133-clock-stage{padding:25px;border-radius:30px;background:#f7f8fb;border:1px solid #e2e6ec;box-shadow:0 24px 60px rgba(22,28,36,.07)}.io133-clock-top{display:flex;justify-content:space-between;align-items:center;gap:14px}.io133-clock-top small,.io133-clock-top b{display:block}.io133-clock-top small{font-size:10px;letter-spacing:.08em;color:#9a6400}.io133-clock-top b{margin-top:4px;font-size:18px}.io133-clock-top>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:800}.io133-clock-ruler{display:grid;grid-template-columns:repeat(5,1fr);margin:24px 0 8px;color:#89929d;font-size:9px}.io133-clock-ruler span{text-align:center}.io133-clock-rows{display:grid;gap:12px}.io133-clock-rows article{display:grid;grid-template-columns:82px 1fr 40px;gap:12px;align-items:center}.io133-clock-rows article>b{font-size:12px}.io133-clock-track{position:relative;height:36px;border-radius:12px;background:repeating-linear-gradient(90deg,#fff 0,#fff calc(25% - 1px),#e7eaf0 calc(25% - 1px),#e7eaf0 25%);border:1px solid #e3e6eb;overflow:visible}.io133-clock-track>i{position:absolute;left:var(--start);top:8px;width:var(--size);height:18px;border-radius:999px;background:linear-gradient(90deg,#ffcf50,#ff8b3d);transform-origin:left center;transform:scaleX(0);transition:transform 1s cubic-bezier(.2,.7,.2,1)}[data-io133-reveal].is-visible .io133-clock-track>i{transform:scaleX(1)}.io133-clock-track>em{position:absolute;left:var(--pos);top:50%;transform:translate(-50%,-50%);font-style:normal;font-size:8px;font-weight:900;color:#20252d;white-space:nowrap}.io133-clock-rows article>strong{font-size:11px;color:#8e5c00}.io133-clock-note{margin-top:20px;padding:16px 17px;border-radius:18px;background:#20252d;color:#fff}.io133-clock-note b,.io133-clock-note span{display:block}.io133-clock-note span{margin-top:5px;color:#bdc6d1;font-size:12px;line-height:1.58}.io133-arrival-notes{display:grid;gap:11px;margin-top:22px}.io133-arrival-notes article{padding:15px 17px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,191,31,.18);transition:.28s}.io133-arrival-notes article:hover{transform:translateY(-3px);box-shadow:0 18px 34px rgba(22,28,36,.08)}.io133-arrival-notes b{display:block}.io133-arrival-notes p{margin:4px 0 0;color:#64707d;font-size:13px;line-height:1.58} .io133-floor{background:#f7f8fb}.io133-floor-photo{position:relative;margin:0;min-height:560px;border-radius:32px;overflow:hidden;box-shadow:0 28px 70px rgba(22,28,36,.12)}.io133-floor-photo img{width:100%;height:100%;object-fit:cover}.io133-floor-photo-overlay{position:absolute;left:20px;right:20px;bottom:20px;padding:17px 18px;border-radius:20px;background:rgba(24,29,38,.9);color:#fff;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08)}.io133-floor-photo-overlay small,.io133-floor-photo-overlay strong{display:block}.io133-floor-photo-overlay small{font-size:10px;letter-spacing:.08em;color:#ffcf68;text-transform:uppercase}.io133-floor-photo-overlay strong{margin-top:5px;font-size:16px;line-height:1.45}.io133-photo-badge{position:absolute;padding:10px 12px;border-radius:15px;background:rgba(255,255,255,.95);box-shadow:0 15px 34px rgba(15,20,28,.15);border:1px solid #e7e9ee}.io133-photo-badge b,.io133-photo-badge span{display:block}.io133-photo-badge b{font-size:12px}.io133-photo-badge span{font-size:10px;color:#6c7581}.io133-photo-badge-a{top:22px;left:22px}.io133-photo-badge-b{top:82px;right:22px}.io133-dept-list{display:grid;gap:12px;margin-top:24px}.io133-dept-list article{display:grid;grid-template-columns:1fr minmax(130px,190px) 42px;gap:12px;align-items:center;padding:13px 0;border-top:1px solid rgba(37,42,51,.1)}.io133-dept-list b,.io133-dept-list small{display:block}.io133-dept-list small{margin-top:3px;color:#697380;font-size:11px}.io133-dept-list article>span{height:10px;border-radius:999px;background:#e5e8ed;overflow:hidden}.io133-dept-list article>span i{display:block;width:var(--target);height:100%;border-radius:inherit;background:linear-gradient(90deg,#ffbf39,#ff6a37);transform:scaleX(0);transform-origin:left center}.io133-dept-list strong{font-size:12px;color:#8f5c00}[data-io133-reveal].is-visible .io133-dept-list article>span i{animation:io133Grow .95s cubic-bezier(.2,.7,.2,1) forwards}.io133-dept-list article:nth-child(2)>span i{animation-delay:.12s}.io133-dept-list article:nth-child(3)>span i{animation-delay:.24s}.io133-dept-list article:nth-child(4)>span i{animation-delay:.36s} .io133-friction{background:#20252d;color:#fff}.io133-friction .eyebrow{background:#fff4d7;border-color:#f2d383;color:#956200}.io133-friction-copy>p{color:#c3ccd6}.io133-friction-callout{margin-top:22px;padding:18px 20px;border-radius:21px;background:#282f39;border:1px solid rgba(255,255,255,.08)}.io133-friction-callout small,.io133-friction-callout strong{display:block}.io133-friction-callout small{font-size:10px;color:#ffcf68;text-transform:uppercase;letter-spacing:.08em}.io133-friction-callout strong{margin-top:6px;font-size:18px}.io133-friction-callout p{margin:6px 0 0;color:#bdc6d1;font-size:13px;line-height:1.62}.io133-friction-board{padding:25px;border-radius:30px;background:#282f39;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 68px rgba(0,0,0,.18)}.io133-friction-head{display:flex;justify-content:space-between;align-items:center;gap:16px}.io133-friction-head b,.io133-friction-head small{display:block}.io133-friction-head small{color:#aeb7c2}.io133-friction-head>span{padding:7px 10px;border-radius:999px;background:#eaf7f0;color:#267854;font-size:9px;font-weight:800}.io133-wave-row{display:grid;grid-template-columns:94px 1fr 42px;gap:12px;align-items:end;margin-top:22px}.io133-wave-row>b{font-size:12px}.io133-wave{height:82px;display:flex;align-items:flex-end;gap:7px;padding:8px 10px;border-radius:17px;background:#20252d;border:1px solid rgba(255,255,255,.07)}.io133-wave i{flex:1;height:0;border-radius:6px 6px 3px 3px;background:linear-gradient(180deg,#ffcf50,#ff7444);transition:height .9s cubic-bezier(.2,.7,.2,1)}[data-io133-reveal].is-visible .io133-wave i{height:var(--h)}.io133-wave-row>strong{font-size:11px;color:#ffcf68}.io133-friction-foot{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}.io133-friction-foot article{padding:14px 15px;border-radius:18px;background:#20252d;border:1px solid rgba(255,255,255,.07)}.io133-friction-foot small,.io133-friction-foot b{display:block}.io133-friction-foot small{font-size:9px;color:#aeb7c2;text-transform:uppercase;letter-spacing:.08em}.io133-friction-foot b{margin-top:4px;font-size:14px} .io133-expand{background:#fff}.io133-expand-head{max-width:850px;text-align:center;margin:0 auto 30px}.io133-expand-head .eyebrow{margin-inline:auto}.io133-expand-head h2{margin-inline:auto}.io133-expand-head>p{color:var(--muted);font-size:16px;line-height:1.65}.io133-expand-media{position:relative;min-height:650px;border-radius:34px;overflow:hidden;transform:scale(var(--expand-scale,.94));opacity:var(--expand-opacity,.72);transition:transform .18s linear,opacity .18s linear;box-shadow:0 30px 80px rgba(22,28,36,.16)}.io133-expand-media figure{position:absolute;inset:0;margin:0}.io133-expand-media img{width:100%;height:100%;object-fit:cover}.io133-expand-media::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgba(12,16,22,.04),rgba(12,16,22,.68));pointer-events:none}.io133-expand-overlay{position:absolute;z-index:2;left:24px;right:24px;bottom:24px;display:grid;grid-template-columns:.8fr 1.2fr;gap:18px;align-items:end;padding:20px;border-radius:24px;background:rgba(16,21,29,.9);backdrop-filter:blur(14px);border:1px solid rgba(255,255,255,.08);color:#fff}.io133-expand-overlay small,.io133-expand-overlay strong{display:block}.io133-expand-overlay small{font-size:10px;color:#ffcf68;letter-spacing:.08em}.io133-expand-overlay strong{margin-top:5px;font-size:18px}.io133-expand-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.io133-expand-metrics span{padding:12px;border-radius:16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)}.io133-expand-metrics b{display:block;font-size:18px}.io133-expand-metrics small{margin-top:2px;color:#c4ccd6}.io133-expand-overlay>p{grid-column:1/-1;margin:0;color:#c9d1da;font-size:13px;line-height:1.6} .io133-access{background:linear-gradient(180deg,#f7f8fb,#fff)}.io133-access-notes{display:grid;gap:11px;margin-top:22px}.io133-access-notes article{padding:15px 17px;border-radius:18px;background:#fff;border:1px solid #e4e8ee;transition:.28s}.io133-access-notes article:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(22,28,36,.08);border-color:rgba(255,191,31,.28)}.io133-access-notes b{display:block}.io133-access-notes p{margin:4px 0 0;color:#65707c;font-size:13px;line-height:1.58}.io133-access-console{height:100%;padding:24px;border-radius:30px;background:#fff;border:1px solid #e4e8ee;box-shadow:0 24px 64px rgba(22,28,36,.08)}.io133-access-head{display:flex;justify-content:space-between;align-items:center;gap:16px;padding-bottom:14px}.io133-access-head b,.io133-access-head small{display:block}.io133-access-head small{color:#737d89}.io133-access-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:800}.io133-access-console>article{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:14px 0;border-top:1px solid rgba(37,42,51,.08)}.io133-access-console b,.io133-access-console small{display:block}.io133-access-console small{margin-top:3px;color:#6d7682;font-size:11px}.io133-access-console em{font-style:normal;padding:7px 10px;border-radius:999px;font-size:9px;font-weight:800}.io133-access-console em.on{background:#eaf7f0;color:#267854}.io133-access-console em.off{background:#f0f2f5;color:#68727e}.io133-access-rule{display:flex;gap:12px;align-items:flex-start;margin-top:14px;padding:15px 16px;border-radius:18px;background:#fff8ec;border:1px solid rgba(255,191,31,.18)}.io133-access-rule>span{width:9px;height:9px;border-radius:50%;background:#ffbf39;box-shadow:0 0 0 5px rgba(255,191,57,.12);margin-top:6px}.io133-access-rule b,.io133-access-rule p{display:block}.io133-access-rule p{margin:4px 0 0;color:#5d6673;font-size:12px;line-height:1.55} @keyframes io133Grow{from{transform:scaleX(0)}to{transform:scaleX(1)}} @media(max-width:1100px){.ip133-action-shell,.io133-pulse-grid,.io133-arrivals-grid,.io133-floor-grid,.io133-friction-grid,.io133-access-grid{grid-template-columns:1fr}.io133-floor-photo{min-height:500px}.io133-expand-media{min-height:560px}} @media(max-width:760px){.ip133-action-summary{grid-template-columns:1fr}.ip133-action-path{padding:18px}.ip133-action-step{grid-template-columns:46px 1fr}.ip133-action-step>span{width:46px;height:46px}.ip133-action-step em{grid-column:2;justify-self:start}.ip133-action-footer{grid-template-columns:1fr}.io133-pulse-metrics{grid-template-columns:1fr}.io133-floor-list article{grid-template-columns:42px 1fr}.io133-floor-list article em{grid-column:2;justify-self:start}.io133-clock-ruler{display:none}.io133-clock-rows article{grid-template-columns:1fr}.io133-clock-track{min-height:40px}.io133-dept-list article,.io133-wave-row{grid-template-columns:1fr}.io133-friction-foot{grid-template-columns:1fr}.io133-expand-media{min-height:520px}.io133-expand-overlay{left:14px;right:14px;bottom:14px;grid-template-columns:1fr}.io133-expand-metrics{grid-template-columns:repeat(3,1fr)}.io133-access-console>article{flex-direction:column;align-items:flex-start}.io133-photo-badge{position:static;margin:10px 12px 0;display:inline-block}.io133-floor-photo{display:flex;flex-direction:column;background:#fff}.io133-floor-photo img{min-height:360px}.io133-floor-photo-overlay{position:relative;inset:auto;margin:12px}} @media(max-width:560px){.io133-expand-metrics{grid-template-columns:1fr}.io133-expand-media{min-height:500px}.io133-floor-photo{min-height:430px}.ip133-action-path{border-radius:24px}} @media(prefers-reduced-motion:reduce){[data-io133-reveal] .io133-rise{opacity:1!important;transform:none!important;transition:none!important}.io133-clock-track>i,.io133-dept-list article>span i{transform:scaleX(1)!important;animation:none!important}.io133-wave i{height:var(--h)!important;transition:none!important}.ip133-action-connector i,.ag132-capacity-bars article>span i{animation:none!important;transform:scaleX(1)!important}.ip133-action-summary article,.ip133-action-step,.io133-floor-list article,.io133-arrival-notes article,.io133-access-notes article{transition:none!important}} /* ===== Worklix V1.34 Track Work Hours + In-Office balance ===== */ .twh134-section{padding:var(--global-section-space) 0;position:relative;overflow:hidden} body:not(.home) .twh134-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important} body:not(.home) .twh134-section h3{font-size:var(--inner-card-title-size)!important;line-height:1.32!important} [data-twh134-reveal] .twh134-rise{opacity:0;transform:translateY(24px);transition:opacity .68s ease,transform .68s ease} [data-twh134-reveal].is-visible .twh134-rise{opacity:1;transform:none} .twh134-ledger{background:linear-gradient(180deg,#fff 0%,#fff8ec 100%)} .twh134-ledger-grid,.twh134-breaks-grid,.twh134-exceptions-grid,.twh134-approval-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(32px,4vw,56px);align-items:stretch} .twh134-ledger-copy,.twh134-break-copy,.twh134-exceptions-copy,.twh134-approval-rail{display:flex;flex-direction:column;justify-content:center} .twh134-ledger-copy>p,.twh134-break-copy>p,.twh134-exceptions-copy>p,.twh134-approval-rail>p{font-size:17px;line-height:1.68;color:var(--muted);margin:0} .twh134-ledger-points{display:grid;gap:11px;margin-top:22px}.twh134-ledger-points article{display:grid;grid-template-columns:38px 1fr;gap:13px;align-items:start;padding:15px 17px;border-radius:18px;background:#fff;border:1px solid #ece5d8;transition:.28s;box-shadow:0 12px 28px rgba(22,28,36,.04)}.twh134-ledger-points article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.34);box-shadow:0 20px 38px rgba(22,28,36,.08)}.twh134-ledger-points article>span{width:36px;height:36px;display:grid;place-items:center;border-radius:12px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900}.twh134-ledger-points b,.twh134-ledger-points small{display:block}.twh134-ledger-points small{margin-top:4px;color:#68717e;line-height:1.58}.twh134-ledger-note{margin-top:14px;padding:16px 18px;border-radius:18px;background:#20252d;color:#fff}.twh134-ledger-note b,.twh134-ledger-note p{display:block}.twh134-ledger-note p{margin:5px 0 0;color:#c4ccd6;font-size:13px;line-height:1.58} .twh134-ledger-board{padding:24px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 70px rgba(18,24,32,.17)}.twh134-ledger-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.twh134-ledger-head small,.twh134-ledger-head b{display:block}.twh134-ledger-head small{color:#ffcf68;font-size:10px;letter-spacing:.08em}.twh134-ledger-head b{margin-top:4px;font-size:18px}.twh134-ledger-head>span{padding:8px 12px;border-radius:999px;background:#fff4d7;color:#956200;font-size:11px;font-weight:900}.twh134-day-axis{display:grid;grid-template-columns:repeat(6,1fr);margin:26px 0 7px;color:#aeb8c4;font-size:9px}.twh134-day-axis span{text-align:center}.twh134-session-track{position:relative;height:64px;border-radius:18px;background:repeating-linear-gradient(90deg,#272e38 0,#272e38 calc(20% - 1px),#343c48 calc(20% - 1px),#343c48 20%);border:1px solid rgba(255,255,255,.08);overflow:hidden}.twh134-session-track i{position:absolute;top:16px;height:30px;border-radius:999px}.twh134-session-track .work{background:linear-gradient(90deg,#ffcf50,#ff8b3d)}.twh134-session-track .one{left:3%;width:35%}.twh134-session-track .break{left:39%;width:8%;background:#858f9c}.twh134-session-track .two{left:48%;width:29%}.twh134-session-track .three{left:79%;width:16%}.twh134-session-key{display:flex;gap:18px;flex-wrap:wrap;margin:12px 0 22px;color:#bac3ce;font-size:11px}.twh134-session-key span{display:flex;align-items:center;gap:6px}.twh134-session-key i{width:8px;height:8px;border-radius:50%}.twh134-session-key .key-work{background:#ffb91f}.twh134-session-key .key-break{background:#858f9c}.twh134-ledger-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.twh134-ledger-stats article{padding:15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07)}.twh134-ledger-stats small,.twh134-ledger-stats b,.twh134-ledger-stats span{display:block}.twh134-ledger-stats small{color:#aeb7c2;font-size:10px}.twh134-ledger-stats b{margin:6px 0 4px;font-size:20px}.twh134-ledger-stats span{color:#d6dde6;font-size:10px;line-height:1.45}.twh134-ledger-callout{margin-top:12px;padding:16px 18px;border-radius:20px;background:linear-gradient(145deg,#fff8df,#fff1c3);color:#252a33}.twh134-ledger-callout small,.twh134-ledger-callout b{display:block}.twh134-ledger-callout small{font-size:10px;letter-spacing:.08em;color:#9a6400}.twh134-ledger-callout b{margin-top:4px}.twh134-ledger-callout p{margin:5px 0 0;color:#636b77;font-size:12px;line-height:1.55} .twh134-capture{background:#fff}.twh134-capture-shell{padding:clamp(28px,4vw,50px);border-radius:36px;background:linear-gradient(135deg,#fff9ef,#fff);border:1px solid #eee6d8;box-shadow:0 26px 70px rgba(22,28,36,.07)}.twh134-capture-heading{text-align:center;max-width:820px;margin:0 auto 32px}.twh134-capture-heading>p{color:var(--muted);font-size:17px;line-height:1.67;margin:0}.twh134-capture-flow{display:grid;grid-template-columns:1fr 58px 1fr 58px 1fr 58px 1fr;align-items:stretch}.twh134-capture-flow article{position:relative;padding:19px;border-radius:22px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);transition:.3s}.twh134-capture-flow article:hover{transform:translateY(-5px);box-shadow:0 22px 40px rgba(22,28,36,.18)}.twh134-capture-flow span,.twh134-capture-flow b,.twh134-capture-flow small,.twh134-capture-flow em{display:block}.twh134-capture-flow span{color:#ffcf68;font-size:11px;font-weight:900}.twh134-capture-flow b{margin:6px 0 4px}.twh134-capture-flow small{color:#c2cad4;line-height:1.55}.twh134-capture-flow em{margin-top:18px;font-style:normal;font-size:10px;font-weight:900;color:#252a33;background:#fff4d7;border-radius:999px;padding:7px 9px;width:max-content}.twh134-flow-line{align-self:center;height:3px;background:#e3e7ed;border-radius:999px;position:relative;overflow:hidden}.twh134-flow-line:after{content:"";position:absolute;inset:0;width:46%;border-radius:inherit;background:linear-gradient(90deg,transparent,#ffb91f,#ff713f,transparent);animation:twh134Line 2.6s linear infinite}.twh134-capture-footer{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin-top:18px}.twh134-capture-footer article{padding:16px 18px;border-radius:18px;background:#fff;border:1px solid #e7e9ee}.twh134-capture-footer b{display:block}.twh134-capture-footer p{margin:5px 0 0;color:#69727e;font-size:12px;line-height:1.55} .twh134-breaks{background:#20252d;color:#fff}.twh134-breaks .eyebrow{background:#fff4d7;border-color:#efcf7b;color:#956200}.twh134-break-copy>p{color:#bdc6d1}.twh134-break-photo{position:relative;margin:0;min-height:590px;border-radius:32px;overflow:hidden;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 70px rgba(0,0,0,.2)}.twh134-break-photo img{width:100%;height:100%;min-height:590px;object-fit:cover}.twh134-break-photo:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(9,12,17,.72) 100%)}.twh134-break-photo figcaption{position:absolute;z-index:2;left:22px;right:22px;bottom:22px}.twh134-break-photo figcaption small,.twh134-break-photo figcaption b{display:block}.twh134-break-photo figcaption small{color:#ffcf68;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.twh134-break-photo figcaption b{margin-top:4px;font-size:18px;line-height:1.4}.twh134-break-badge{position:absolute;z-index:3;padding:11px 13px;border-radius:16px;background:rgba(255,255,255,.94);color:#252a33;box-shadow:0 18px 42px rgba(0,0,0,.2)}.twh134-break-badge b,.twh134-break-badge span{display:block}.twh134-break-badge b{font-size:14px}.twh134-break-badge span{font-size:10px;color:#68717e}.twh134-break-badge.one{top:22px;left:22px}.twh134-break-badge.two{top:130px;right:22px}.twh134-break-list{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.twh134-break-list article{position:relative;padding:18px;border-radius:20px;background:#282f39;border:1px solid rgba(255,255,255,.08);transition:.3s}.twh134-break-list article:hover{transform:translateY(-4px);border-color:rgba(255,181,31,.28)}.twh134-break-list b{display:block}.twh134-break-list p{margin:5px 0 16px;color:#bdc6d1;font-size:13px;line-height:1.58}.twh134-break-list span{display:inline-flex;padding:6px 9px;border-radius:999px;background:rgba(255,191,31,.13);color:#ffcf68;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.06em} .twh134-expand{position:relative;height:210vh;background:#0c1118}.twh134-expand-sticky{position:sticky;top:0;height:100vh;overflow:hidden;display:grid;place-items:center}.twh134-expand-bg{position:absolute;inset:-8%;background-image:linear-gradient(rgba(7,10,14,.62),rgba(7,10,14,.78)),var(--twh134-bg);background-size:cover;background-position:center;transform:scale(calc(1.06 - var(--twh134-progress,0)*.06));filter:saturate(.7);will-change:transform}.twh134-expand-title{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(26px,7vw,110px);pointer-events:none;color:#fff;font-family:var(--title-font);font-weight:800;font-size:clamp(42px,7vw,110px);line-height:.9;letter-spacing:-.06em}.twh134-expand-title span:first-child{transform:translateX(calc(var(--twh134-progress,0)*-10vw))}.twh134-expand-title span:last-child{transform:translateX(calc(var(--twh134-progress,0)*10vw));text-align:right}.twh134-expand-media{position:relative;z-index:3;width:calc(38vw + var(--twh134-progress,0)*38vw);max-width:1180px;margin:0;border-radius:calc(30px - var(--twh134-progress,0)*14px);overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:0 32px 90px rgba(0,0,0,.32);will-change:width,border-radius}.twh134-expand-media img{width:100%;height:auto;display:block}.twh134-expand-copy{position:absolute;z-index:4;left:50%;bottom:clamp(24px,5vh,58px);width:min(780px,calc(100% - 40px));transform:translate(-50%,calc((1 - var(--twh134-copy,0))*28px));opacity:var(--twh134-copy,0);text-align:center;color:#fff;pointer-events:none}.twh134-expand-copy .eyebrow{background:rgba(255,255,255,.9);color:#252a33}.twh134-expand-copy h2{font-size:clamp(34px,4.7vw,62px);line-height:1.02;letter-spacing:-.045em;margin:12px 0}.twh134-expand-copy p{margin:0;color:#d0d6de;line-height:1.65}.twh134-expand-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.twh134-expand-metrics span{padding:11px 13px;border-radius:16px;background:rgba(10,14,19,.66);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(8px)}.twh134-expand-metrics b,.twh134-expand-metrics small{display:block}.twh134-expand-metrics b{font-size:18px}.twh134-expand-metrics small{color:#c5cbd4;font-size:10px} .twh134-exceptions{background:linear-gradient(180deg,#fff8ec 0%,#fff 100%)}.twh134-exception-notes{display:grid;gap:11px;margin-top:22px}.twh134-exception-notes article{padding:16px 18px;border-radius:18px;background:#fff;border:1px solid #ece9e2;transition:.28s}.twh134-exception-notes article:hover{transform:translateX(4px);border-color:#f0d18a}.twh134-exception-notes b{display:block}.twh134-exception-notes p{margin:4px 0 0;color:#68717e;font-size:13px;line-height:1.58}.twh134-week-board{padding:24px;border-radius:32px;background:#fff;border:1px solid #e6e9ef;box-shadow:0 26px 64px rgba(22,28,36,.09)}.twh134-week-head{display:flex;justify-content:space-between;align-items:center;gap:18px}.twh134-week-head small,.twh134-week-head b{display:block}.twh134-week-head small{font-size:10px;letter-spacing:.08em;color:#9a6400}.twh134-week-head b{margin-top:4px}.twh134-week-head>span{padding:8px 11px;border-radius:999px;background:#f4f5f7;color:#68717e;font-size:10px;font-weight:800}.twh134-week-bars{display:grid;gap:13px;margin-top:20px}.twh134-week-bars article{display:grid;grid-template-columns:128px 1fr 76px;gap:14px;align-items:center;padding:13px 0;border-top:1px solid #eef0f3}.twh134-week-bars article:first-child{border-top:0}.twh134-week-bars b,.twh134-week-bars small{display:block}.twh134-week-bars small{color:#7a8490;font-size:10px}.twh134-week-bars article>span{height:11px;border-radius:999px;background:#eef0f3;overflow:hidden}.twh134-week-bars article>span i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#ffcf50,#ff8b3d);transition:width 1s cubic-bezier(.2,.7,.2,1)}[data-twh134-reveal].is-visible .twh134-week-bars article>span i{width:var(--fill)}.twh134-week-bars em{font-style:normal;font-size:10px;font-weight:800;color:#9a6400;text-align:right}.twh134-week-summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:20px}.twh134-week-summary article{padding:14px;border-radius:17px;background:#20252d;color:#fff}.twh134-week-summary small,.twh134-week-summary b{display:block}.twh134-week-summary small{color:#b9c2cd;font-size:9px}.twh134-week-summary b{margin-top:5px;font-size:14px} .twh134-approval{background:#f7f8fb}.twh134-approval-points{display:grid;grid-template-columns:1fr 1fr;gap:11px;margin-top:22px}.twh134-approval-points article{padding:15px 16px;border-radius:18px;background:#fff;border:1px solid #e4e8ee;transition:.28s}.twh134-approval-points article:hover{transform:translateY(-3px);box-shadow:0 18px 34px rgba(22,28,36,.07)}.twh134-approval-points b,.twh134-approval-points small{display:block}.twh134-approval-points small{margin-top:4px;color:#68717e;line-height:1.55}.twh134-approval-board{padding:24px;border-radius:32px;background:#fff;border:1px solid #e2e6ec;box-shadow:0 26px 64px rgba(22,28,36,.08)}.twh134-approval-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:10px}.twh134-approval-head small,.twh134-approval-head b{display:block}.twh134-approval-head small{font-size:10px;letter-spacing:.08em;color:#9a6400}.twh134-approval-head b{margin-top:4px}.twh134-approval-head>span{padding:8px 10px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900}.twh134-approval-board>article{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:14px 0;border-top:1px solid #edf0f3}.twh134-approval-board>article>div{display:flex;align-items:center;gap:12px}.twh134-avatar{width:38px;height:38px;border-radius:12px;display:grid;place-items:center;background:#20252d;color:#fff;font-size:10px;font-weight:900}.twh134-approval-board p{margin:0}.twh134-approval-board p b,.twh134-approval-board p small{display:block}.twh134-approval-board p small{margin-top:2px;color:#7a8490;font-size:11px}.twh134-approval-board em{font-style:normal;padding:7px 10px;border-radius:999px;font-size:9px;font-weight:900}.twh134-approval-board em.review{background:#fff4d7;color:#956200}.twh134-approval-board em.ready{background:#eaf8f1;color:#267854}.twh134-approval-footer{margin-top:16px;padding:18px;border-radius:20px;background:#20252d;color:#fff}.twh134-approval-footer b{display:block}.twh134-approval-footer p{margin:5px 0 14px;color:#bdc6d1;font-size:12px;line-height:1.58}.twh134-approval-footer .btn{width:100%} @keyframes twh134Line{0%{transform:translateX(-120%)}100%{transform:translateX(260%)}} @media(max-width:1100px){.twh134-ledger-grid,.twh134-breaks-grid,.twh134-exceptions-grid,.twh134-approval-grid{grid-template-columns:1fr}.twh134-capture-flow{grid-template-columns:1fr}.twh134-flow-line{height:36px;width:3px;justify-self:center}.twh134-flow-line:after{width:100%;height:46%;animation:twh134LineY 2.6s linear infinite}.twh134-capture-footer{grid-template-columns:1fr}.twh134-break-photo{min-height:520px}.twh134-break-photo img{min-height:520px}.twh134-expand-media{width:calc(60vw + var(--twh134-progress,0)*28vw)}.twh134-expand-title{font-size:clamp(36px,8vw,72px)}} @keyframes twh134LineY{0%{transform:translateY(-120%)}100%{transform:translateY(260%)}} @media(max-width:760px){.twh134-ledger-stats,.twh134-week-summary,.twh134-expand-metrics,.twh134-approval-points,.twh134-break-list{grid-template-columns:1fr}.twh134-week-bars article{grid-template-columns:1fr}.twh134-week-bars em{text-align:left}.twh134-expand{height:auto;background:#0c1118;padding:var(--global-section-space) 0}.twh134-expand-sticky{position:relative;height:auto;min-height:auto;display:block;padding:0 var(--space-page-x)}.twh134-expand-bg{inset:0;transform:none;opacity:.35}.twh134-expand-title{display:none}.twh134-expand-media{width:100%;max-width:none;border-radius:24px}.twh134-expand-copy{position:relative;left:auto;bottom:auto;width:100%;transform:none;opacity:1;text-align:left;margin:22px auto 0}.twh134-break-photo,.twh134-break-photo img{min-height:430px}.twh134-ledger-head,.twh134-week-head,.twh134-approval-head{align-items:flex-start;flex-direction:column}} @media(prefers-reduced-motion:reduce){[data-twh134-reveal] .twh134-rise{opacity:1!important;transform:none!important;transition:none!important}.twh134-flow-line:after,.twh134-week-bars article>span i{animation:none!important;transition:none!important}.twh134-week-bars article>span i{width:var(--fill)!important}.twh134-expand-bg,.twh134-expand-title span,.twh134-expand-media,.twh134-expand-copy{transform:none!important;transition:none!important}.twh134-expand-copy{opacity:1!important}.twh134-ledger-points article,.twh134-capture-flow article,.twh134-break-list article,.twh134-exception-notes article,.twh134-approval-points article{transition:none!important}} /* ===== Worklix V1.35 targeted track-hour fixes + Software Teams ===== */ /* In-office arrival balance */ .io133-arrival-notes{align-content:start} /* Track Work Hours targeted refinements */ .twh135-ledger-events{display:grid;gap:10px;margin:18px 0 16px} .twh135-ledger-events article{display:grid;grid-template-columns:58px 1fr auto;gap:14px;align-items:center;padding:13px 14px;border-radius:17px;background:#f7f8fb;border:1px solid #e7eaf0;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease} .twh135-ledger-events article:hover{transform:translateX(4px);border-color:#f0cf7f;box-shadow:0 14px 30px rgba(22,28,36,.06)} .twh135-ledger-events>article>span{font-size:12px;font-weight:900;color:#9a6400} .twh135-ledger-events b,.twh135-ledger-events small{display:block}.twh135-ledger-events small{margin-top:3px;color:#707a87;line-height:1.5}.twh135-ledger-events em{font-style:normal;padding:6px 9px;border-radius:999px;background:#fff4d7;color:#956200;font-size:9px;font-weight:900;white-space:nowrap} .twh135-ledger-context{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px} .twh135-ledger-context article{padding:14px 15px;border-radius:17px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.07)} .twh135-ledger-context small,.twh135-ledger-context b,.twh135-ledger-context span{display:block}.twh135-ledger-context small{color:#ffcf68;font-size:9px;text-transform:uppercase;letter-spacing:.07em}.twh135-ledger-context b{margin:5px 0 3px;font-size:14px}.twh135-ledger-context span{color:#bdc6d1;font-size:10px;line-height:1.48} .twh134-session-track,.twh134-session-key,.twh134-day-axis{display:none!important} .twh134-break-list{grid-template-columns:1fr 1fr} .twh135-week-context{display:grid;gap:10px;margin-top:16px} .twh135-week-context>div{display:grid;grid-template-columns:140px 1fr;gap:14px;align-items:center;padding:12px 14px;border-radius:16px;background:#f7f8fb;border:1px solid #e8ebf0} .twh135-week-context small{color:#9a6400;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.06em}.twh135-week-context b{font-size:12px;line-height:1.5;color:#333a45} .twh134-approval-footer .btn{border-color:#f3bd43;background:#fff;color:#252a33;overflow:hidden;position:relative;isolation:isolate} .twh134-approval-footer .btn::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(135deg,#ffcf47,#ff9c29,#ff6b43);transform:scaleX(0);transform-origin:left center;transition:transform .3s ease;z-index:-1} .twh134-approval-footer .btn:hover{color:#15181d;border-color:transparent;box-shadow:0 14px 30px rgba(255,156,41,.25)} .twh134-approval-footer .btn:hover::before{transform:scaleX(1)} /* Software Teams v135 */ .st135-section{position:relative;overflow:hidden;padding:var(--global-section-space) 0} .st135-section .title-line{display:block} [data-st135-reveal] .st135-rise{opacity:0;transform:translateY(24px);transition:opacity .68s ease,transform .68s ease} [data-st135-reveal].is-visible .st135-rise{opacity:1;transform:none} .st135-engine-grid,.st135-focus-grid,.st135-risk-grid,.st135-access-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(30px,4vw,54px);align-items:stretch} .st135-engine-copy,.st135-focus-copy,.st135-risk-copy,.st135-access-copy{display:flex;flex-direction:column;justify-content:center} .st135-engine-copy h2,.st135-focus-copy h2,.st135-projects-head h2,.st135-risk-copy h2,.st135-access-copy h2{font-size:var(--inner-section-title-size);line-height:var(--inner-section-title-line);letter-spacing:var(--inner-section-title-track);margin:14px 0 16px} .st135-engine-copy>p,.st135-focus-copy>p,.st135-projects-head>p,.st135-risk-copy>p,.st135-access-copy>p{margin:0;color:var(--muted);font-size:16px;line-height:1.7} .st135-engine{background:linear-gradient(180deg,#fff,#fff9ef)} .st135-engine-notes{display:grid;gap:11px;margin-top:22px}.st135-engine-notes article,.st135-risk-notes article,.st135-access-notes article{padding:16px 18px;border-radius:18px;background:#fff;border:1px solid #e8ebf0;transition:.28s}.st135-engine-notes article:hover,.st135-risk-notes article:hover,.st135-access-notes article:hover{transform:translateY(-4px);border-color:#f2cf7c;box-shadow:0 18px 36px rgba(22,28,36,.07)}.st135-engine-notes b,.st135-engine-notes p,.st135-risk-notes b,.st135-risk-notes p,.st135-access-notes b,.st135-access-notes p{display:block;margin:0}.st135-engine-notes p,.st135-risk-notes p,.st135-access-notes p{margin-top:4px;color:#68717e;font-size:13px;line-height:1.58} .st135-pipeline{padding:24px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 70px rgba(22,28,36,.18)} .st135-pipeline-head{display:flex;justify-content:space-between;gap:18px;align-items:center}.st135-pipeline-head small,.st135-pipeline-head b{display:block}.st135-pipeline-head small{color:#ffcf68;font-size:10px;letter-spacing:.08em}.st135-pipeline-head b{margin-top:4px}.st135-pipeline-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900} .st135-pipeline-lane{display:grid;grid-template-columns:1fr 38px 1fr 38px 1fr 38px 1fr;gap:8px;align-items:center;margin:24px 0}.st135-pipeline-lane>i{height:2px;background:rgba(255,255,255,.09);position:relative;overflow:hidden}.st135-pipeline-lane>i:after{content:"";position:absolute;top:0;left:0;width:42%;height:100%;background:linear-gradient(90deg,transparent,#ffbf1f,transparent);animation:st135Flow 2.4s linear infinite}.st135-pipeline-lane article{min-height:142px;padding:15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.08);transition:.28s}.st135-pipeline-lane article:hover{transform:translateY(-4px);border-color:rgba(255,191,31,.26)}.st135-pipeline-lane article>span{width:32px;height:32px;border-radius:10px;display:grid;place-items:center;background:rgba(255,191,31,.12);color:#ffcf68;font-size:10px;font-weight:900}.st135-pipeline-lane b,.st135-pipeline-lane small,.st135-pipeline-lane em{display:block}.st135-pipeline-lane b{margin-top:10px}.st135-pipeline-lane small{color:#b9c2cd;margin-top:3px}.st135-pipeline-lane em{margin-top:14px;font-style:normal;color:#ffcf68;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.06em} .st135-pipeline-foot{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.st135-pipeline-foot article{padding:14px 15px;border-radius:17px;background:#161b22;border:1px solid rgba(255,255,255,.07)}.st135-pipeline-foot small,.st135-pipeline-foot b,.st135-pipeline-foot span{display:block}.st135-pipeline-foot small{color:#aab4bf;font-size:9px}.st135-pipeline-foot b{margin:5px 0;font-size:17px}.st135-pipeline-foot span{color:#8f99a5;font-size:10px} .st135-focus{background:#fff}.st135-focus-photo{position:relative;min-height:590px;margin:0;border-radius:32px;overflow:hidden;box-shadow:0 28px 70px rgba(22,28,36,.12)}.st135-focus-photo img{width:100%;height:100%;min-height:590px;object-fit:cover}.st135-focus-photo figcaption{position:absolute;left:22px;right:22px;bottom:22px;padding:17px 19px;border-radius:20px;background:rgba(17,22,30,.88);color:#fff;backdrop-filter:blur(10px);border:1px solid rgba(255,255,255,.08)}.st135-focus-photo figcaption small,.st135-focus-photo figcaption strong{display:block}.st135-focus-photo figcaption small{color:#ffcf68;font-size:10px;text-transform:uppercase;letter-spacing:.07em}.st135-focus-photo figcaption strong{margin-top:6px;line-height:1.45}.st135-photo-tag{position:absolute;padding:11px 13px;border-radius:16px;background:rgba(255,255,255,.95);box-shadow:0 18px 40px rgba(0,0,0,.16)}.st135-photo-tag b,.st135-photo-tag span{display:block}.st135-photo-tag b{font-size:13px}.st135-photo-tag span{color:#68717e;font-size:10px}.st135-photo-tag.one{top:22px;left:22px}.st135-photo-tag.two{top:118px;right:22px} .st135-interruption-stack{display:grid;gap:10px;margin-top:22px}.st135-interruption-stack article{display:flex;justify-content:space-between;gap:16px;align-items:center;padding:15px 17px;border-radius:18px;background:#f7f8fb;border:1px solid #e8ebf0;transition:.28s}.st135-interruption-stack article:hover{transform:translateX(4px);border-color:#f0cf7f}.st135-interruption-stack b,.st135-interruption-stack small{display:block}.st135-interruption-stack small{color:#68717e;margin-top:3px}.st135-interruption-stack span{font-weight:900;color:#9a6400}.st135-focus-action{margin-top:16px;padding:17px 18px;border-radius:19px;background:#fff8e9;border:1px solid #f1d18c}.st135-focus-action small,.st135-focus-action b{display:block}.st135-focus-action small{color:#9a6400;font-size:9px;text-transform:uppercase;letter-spacing:.07em}.st135-focus-action b{margin-top:5px;line-height:1.5} .st135-projects{background:#f7f8fb}.st135-projects-shell{display:grid;gap:26px}.st135-projects-head{max-width:850px}.st135-project-rail{display:grid;grid-template-columns:1.05fr .95fr 1fr;gap:16px}.st135-project-card{position:relative;min-height:320px;padding:24px;border-radius:26px;background:#fff;border:1px solid #e4e8ee;box-shadow:0 20px 46px rgba(22,28,36,.06);overflow:hidden;transition:.3s}.st135-project-card:hover{transform:translateY(-6px);box-shadow:0 26px 54px rgba(22,28,36,.1)}.st135-code-icon{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;background:#20252d;color:#ffcf68;font-family:monospace;font-weight:900}.st135-project-card>small{display:block;margin-top:52px;color:#9a6400;font-size:9px;letter-spacing:.08em}.st135-project-card>b{display:block;margin-top:7px;font-size:21px;line-height:1.25}.st135-project-card>p{color:#68717e;font-size:13px;line-height:1.65}.st135-project-card>div:last-child{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:20px;padding-top:14px;border-top:1px solid #eceff3}.st135-project-card>div:last-child span{font-size:11px;color:#68717e}.st135-project-card>div:last-child em{font-style:normal;font-size:10px;font-weight:900;color:#9a6400}.st135-project-card.review{background:#20252d;color:#fff;border-color:#282f39}.st135-project-card.review>p,.st135-project-card.review>div:last-child span{color:#bdc6d1}.st135-project-card.review>div:last-child{border-color:rgba(255,255,255,.08)}.st135-project-card.review .st135-code-icon{background:#fff4d7;color:#956200}.st135-project-foot{display:flex;flex-wrap:wrap;gap:10px}.st135-project-foot span{padding:9px 13px;border-radius:999px;background:#fff;border:1px solid #e5e8ee;font-size:11px;font-weight:800;color:#525b68} .st135-expand{position:relative;height:215vh;background:#090d13}.st135-expand-sticky{position:sticky;top:0;height:100vh;display:grid;place-items:center;overflow:hidden}.st135-expand-bg{position:absolute;inset:-8%;background-image:linear-gradient(rgba(6,9,13,.58),rgba(6,9,13,.82)),var(--st135-bg);background-size:cover;background-position:center;filter:saturate(.45);transform:scale(calc(1.08 - var(--st135-progress,0)*.08));will-change:transform}.st135-expand-title{position:absolute;z-index:2;inset:0;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(28px,7vw,110px);color:#fff;font-family:var(--title-font);font-size:clamp(44px,7vw,108px);font-weight:800;line-height:.9;letter-spacing:-.06em;pointer-events:none}.st135-expand-title span:first-child{transform:translateX(calc(var(--st135-progress,0)*-10vw))}.st135-expand-title span:last-child{transform:translateX(calc(var(--st135-progress,0)*10vw));text-align:right}.st135-expand-media{position:relative;z-index:3;width:calc(38vw + var(--st135-progress,0)*40vw);max-width:1180px;margin:0;border-radius:calc(30px - var(--st135-progress,0)*14px);overflow:hidden;border:1px solid rgba(255,255,255,.12);box-shadow:0 34px 90px rgba(0,0,0,.36)}.st135-expand-media img{display:block;width:100%;height:auto}.st135-expand-copy{position:absolute;z-index:4;left:50%;bottom:clamp(24px,5vh,58px);width:min(780px,calc(100% - 40px));transform:translate(-50%,calc((1 - var(--st135-copy,0))*28px));opacity:var(--st135-copy,0);text-align:center;color:#fff;pointer-events:none}.st135-expand-copy .eyebrow{background:rgba(255,255,255,.92);color:#252a33}.st135-expand-copy h2{font-size:clamp(34px,4.6vw,60px);line-height:1.02;letter-spacing:-.045em;margin:12px 0}.st135-expand-copy p{margin:0;color:#d0d6de;line-height:1.65}.st135-expand-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px}.st135-expand-metrics span{padding:11px 13px;border-radius:16px;background:rgba(10,14,19,.68);border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(8px)}.st135-expand-metrics b,.st135-expand-metrics small{display:block}.st135-expand-metrics b{font-size:18px}.st135-expand-metrics small{color:#c5cbd4;font-size:10px} .st135-risk{background:linear-gradient(180deg,#fff9ef,#fff)}.st135-risk-notes,.st135-access-notes{display:grid;gap:11px;margin-top:22px}.st135-risk-board{padding:24px;border-radius:32px;background:#fff;border:1px solid #e5e8ee;box-shadow:0 26px 64px rgba(22,28,36,.09)}.st135-risk-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:12px}.st135-risk-head small,.st135-risk-head b{display:block}.st135-risk-head small{color:#9a6400;font-size:9px;letter-spacing:.08em}.st135-risk-head b{margin-top:4px}.st135-risk-head>span{padding:8px 10px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900}.st135-risk-row{display:grid;grid-template-columns:150px 1fr 48px;gap:14px;align-items:center;padding:14px 0;border-top:1px solid #edf0f3}.st135-risk-row b,.st135-risk-row small{display:block}.st135-risk-row small{color:#7a8490;font-size:10px}.st135-risk-row>span{height:10px;border-radius:999px;background:#edf0f3;overflow:hidden}.st135-risk-row>span i{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#ffcf50,#ff8b3d);transition:width 1s cubic-bezier(.2,.7,.2,1)}[data-st135-reveal].is-visible .st135-risk-row>span i{width:var(--fill)}.st135-risk-row>strong{font-size:11px;color:#9a6400;text-align:right}.st135-risk-callout{margin-top:18px;padding:18px;border-radius:20px;background:#20252d;color:#fff}.st135-risk-callout small,.st135-risk-callout b{display:block}.st135-risk-callout small{color:#ffcf68;font-size:9px;text-transform:uppercase;letter-spacing:.07em}.st135-risk-callout b{margin:5px 0}.st135-risk-callout p{margin:0;color:#bdc6d1;font-size:12px;line-height:1.58} .st135-access{background:#fff}.st135-access-console{padding:24px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 68px rgba(22,28,36,.16)}.st135-access-head{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:10px}.st135-access-head small,.st135-access-head b{display:block}.st135-access-head small{color:#ffcf68;font-size:9px;letter-spacing:.08em}.st135-access-head b{margin-top:4px}.st135-access-head>span{padding:8px 10px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900}.st135-access-console>article{display:flex;justify-content:space-between;gap:18px;align-items:center;padding:15px 0;border-top:1px solid rgba(255,255,255,.08)}.st135-access-console b,.st135-access-console small{display:block}.st135-access-console small{margin-top:3px;color:#aab4bf}.st135-access-console em{font-style:normal;padding:7px 10px;border-radius:999px;font-size:9px;font-weight:900;white-space:nowrap}.st135-access-console em.on{background:#eaf8f1;color:#267854}.st135-access-console em.off{background:#303842;color:#c1c8d1} @keyframes st135Flow{0%{transform:translateX(-120%)}100%{transform:translateX(280%)}} @media(max-width:1100px){.st135-engine-grid,.st135-focus-grid,.st135-risk-grid,.st135-access-grid{grid-template-columns:1fr}.st135-project-rail{grid-template-columns:1fr}.st135-pipeline-lane{grid-template-columns:1fr}.st135-pipeline-lane>i{width:2px;height:28px;justify-self:center}.st135-pipeline-foot{grid-template-columns:1fr}.st135-focus-photo,.st135-focus-photo img{min-height:520px}.st135-expand-media{width:calc(60vw + var(--st135-progress,0)*28vw)}} @media(max-width:760px){.twh135-ledger-events article{grid-template-columns:1fr}.twh135-ledger-context{grid-template-columns:1fr}.twh135-week-context>div{grid-template-columns:1fr}.st135-pipeline-head,.st135-risk-head,.st135-access-head{align-items:flex-start;flex-direction:column}.st135-focus-photo,.st135-focus-photo img{min-height:430px}.st135-expand{height:auto;padding:var(--global-section-space) 0;background:#090d13}.st135-expand-sticky{position:relative;height:auto;display:block;padding:0 var(--space-page-x)}.st135-expand-bg{inset:0;opacity:.36;transform:none}.st135-expand-title{display:none}.st135-expand-media{width:100%;border-radius:24px}.st135-expand-copy{position:relative;left:auto;bottom:auto;width:100%;transform:none;opacity:1;text-align:left;margin:22px auto 0}.st135-expand-metrics{grid-template-columns:1fr}.st135-risk-row{grid-template-columns:1fr}.st135-risk-row>strong{text-align:left}.st135-access-console>article{align-items:flex-start;flex-direction:column}.st135-project-card{min-height:auto}} @media(prefers-reduced-motion:reduce){[data-st135-reveal] .st135-rise{opacity:1!important;transform:none!important;transition:none!important}.st135-pipeline-lane>i:after,.st135-risk-row>span i{animation:none!important;transition:none!important}.st135-risk-row>span i{width:var(--fill)!important}.st135-expand-bg,.st135-expand-title span,.st135-expand-media,.st135-expand-copy{transform:none!important;transition:none!important}.st135-expand-copy{opacity:1!important}.twh134-approval-footer .btn::before{transition:none!important}} /* ===== Worklix V1.36 targeted refinements ===== */ .st136-system-board{padding:24px;border-radius:32px;background:#20252d;color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 70px rgba(22,28,36,.18);display:flex;flex-direction:column;height:100%} .st136-system-head{display:flex;justify-content:space-between;gap:18px;align-items:center}.st136-system-head small,.st136-system-head b{display:block}.st136-system-head small{color:#ffcf68;font-size:10px;letter-spacing:.08em}.st136-system-head b{margin-top:4px}.st136-system-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900} .st136-system-grid{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(190px,.65fr);gap:14px;margin:22px 0;flex:1} .st136-system-main{padding:18px;border-radius:22px;background:#161b22;border:1px solid rgba(255,255,255,.08);display:flex;flex-direction:column} .st136-main-top{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.st136-main-top small,.st136-main-top b{display:block}.st136-main-top small{color:#9aa5b1;font-size:10px;text-transform:uppercase;letter-spacing:.08em}.st136-main-top b{margin-top:5px;font-size:18px;line-height:1.35}.st136-main-top em{font-style:normal;padding:7px 10px;border-radius:999px;background:rgba(255,191,31,.12);color:#ffcf68;font-size:9px;font-weight:900;text-transform:uppercase;white-space:nowrap} .st136-flow-map{display:grid;grid-template-columns:1fr 22px 1fr 22px 1fr 22px 1fr;gap:7px;align-items:center;margin:22px 0}.st136-flow-map>i{height:2px;background:rgba(255,255,255,.09);position:relative;overflow:hidden}.st136-flow-map>i:after{content:"";position:absolute;inset:0 auto 0 -35%;width:35%;background:linear-gradient(90deg,transparent,#ffbf1f,transparent);animation:st136Flow 2.3s linear infinite}.st136-flow-map>div{padding:14px 12px;border-radius:16px;background:#252c36;border:1px solid rgba(255,255,255,.07);min-height:112px}.st136-flow-map>div.watch{border-color:rgba(255,191,31,.28);background:linear-gradient(180deg,#2c302b,#252c36)}.st136-flow-map span,.st136-flow-map b,.st136-flow-map small{display:block}.st136-flow-map span{font-size:9px;text-transform:uppercase;letter-spacing:.07em;color:#9da7b3}.st136-flow-map b{margin:8px 0 4px;font-size:15px}.st136-flow-map small{color:#b8c1cc;font-size:10px;line-height:1.45} .st136-main-context{margin-top:auto;padding:15px 16px;border-radius:17px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07)}.st136-main-context small{display:block;color:#ffcf68;font-size:9px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.st136-main-context p{margin:7px 0 0;color:#b8c1cc;font-size:12px;line-height:1.6} .st136-system-side{display:grid;gap:10px}.st136-system-side article{padding:15px;border-radius:18px;background:#282f39;border:1px solid rgba(255,255,255,.07);transition:.28s}.st136-system-side article:hover{transform:translateY(-3px);border-color:rgba(255,191,31,.24)}.st136-system-side small,.st136-system-side b,.st136-system-side p{display:block}.st136-system-side small{color:#9aa5b1;font-size:9px;text-transform:uppercase;letter-spacing:.08em}.st136-system-side b{margin:5px 0;font-size:17px}.st136-system-side p{margin:0;color:#b7c0ca;font-size:11px;line-height:1.55} .st136-system-footer{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.st136-system-footer article{display:grid;grid-template-columns:34px 1fr;gap:10px;align-items:start;padding:13px 14px;border-radius:17px;background:#161b22;border:1px solid rgba(255,255,255,.07)}.st136-system-footer article>span{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:rgba(255,191,31,.12);color:#ffcf68;font-size:9px;font-weight:900}.st136-system-footer b,.st136-system-footer small{display:block}.st136-system-footer b{font-size:12px}.st136-system-footer small{margin-top:3px;color:#8f99a5;font-size:9px;line-height:1.45} .st136-black-review{background:#090d13;color:#fff;position:relative;overflow:hidden}.st136-black-review:before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,191,31,.11),transparent 28%),radial-gradient(circle at 82% 72%,rgba(255,106,55,.08),transparent 30%),linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:auto,auto,70px 70px,70px 70px;pointer-events:none}.st136-black-shell{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:clamp(32px,4vw,56px);align-items:stretch}.st136-black-copy{display:flex;flex-direction:column;justify-content:center}.st136-black-copy .eyebrow{align-self:flex-start;background:rgba(255,255,255,.07);border-color:rgba(255,255,255,.12);color:#fff}.st136-black-copy h2{font-size:var(--inner-section-title-size);line-height:var(--inner-section-title-line);letter-spacing:var(--inner-section-title-track);margin:14px 0 16px}.st136-black-copy>p{margin:0;color:#b7c0cb;font-size:16px;line-height:1.7}.st136-black-points{display:grid;gap:11px;margin-top:22px}.st136-black-points article{display:grid;grid-template-columns:42px 1fr;gap:12px;padding:15px 16px;border-radius:18px;background:#141a22;border:1px solid rgba(255,255,255,.07);transition:.28s}.st136-black-points article:hover{transform:translateY(-4px);border-color:rgba(255,191,31,.25);box-shadow:0 18px 36px rgba(0,0,0,.18)}.st136-black-points article>span{width:42px;height:42px;border-radius:13px;display:grid;place-items:center;background:rgba(255,191,31,.12);color:#ffcf68;font-size:10px;font-weight:900}.st136-black-points b,.st136-black-points small{display:block}.st136-black-points b{font-size:15px}.st136-black-points small{margin-top:4px;color:#aab3bf;font-size:12px;line-height:1.55} .st136-black-console{padding:24px;border-radius:30px;background:linear-gradient(180deg,#141a22,#0f141b);border:1px solid rgba(255,255,255,.08);box-shadow:0 30px 80px rgba(0,0,0,.28);display:flex;flex-direction:column}.st136-black-head{display:flex;justify-content:space-between;gap:18px;align-items:center}.st136-black-head small,.st136-black-head b{display:block}.st136-black-head small{color:#ffcf68;font-size:10px;letter-spacing:.08em}.st136-black-head b{margin-top:4px}.st136-black-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900} .st136-release-path{display:grid;grid-template-columns:1fr 22px 1fr 22px 1fr 22px 1fr;gap:8px;align-items:center;margin:24px 0}.st136-release-path>i{height:2px;background:rgba(255,255,255,.08);position:relative;overflow:hidden}.st136-release-path>i:after{content:"";position:absolute;inset:0 auto 0 -40%;width:40%;background:linear-gradient(90deg,transparent,#ffbf1f,transparent);animation:st136Flow 2.2s linear infinite}.st136-release-path article{padding:15px;border-radius:18px;background:#202731;border:1px solid rgba(255,255,255,.07);min-height:118px}.st136-release-path article.done{border-color:rgba(83,213,135,.2)}.st136-release-path article.watch{border-color:rgba(255,191,31,.28);background:linear-gradient(180deg,#292b25,#202731)}.st136-release-path span,.st136-release-path b,.st136-release-path small{display:block}.st136-release-path span{color:#a1abb6;font-size:9px;text-transform:uppercase;letter-spacing:.08em}.st136-release-path b{margin:8px 0 4px;font-size:15px}.st136-release-path small{color:#b7c0ca;font-size:10px;line-height:1.45} .st136-black-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.st136-black-metrics article{padding:16px;border-radius:18px;background:#181f28;border:1px solid rgba(255,255,255,.07);transition:.28s}.st136-black-metrics article:hover{transform:translateY(-4px);border-color:rgba(255,191,31,.22)}.st136-black-metrics small,.st136-black-metrics b,.st136-black-metrics p{display:block}.st136-black-metrics small{color:#9ba5b1;font-size:9px;text-transform:uppercase;letter-spacing:.08em}.st136-black-metrics b{margin:6px 0;font-size:18px}.st136-black-metrics p{margin:0;color:#aab3bf;font-size:11px;line-height:1.55} .st136-black-action{margin-top:12px;padding:15px 16px;border-radius:18px;background:linear-gradient(135deg,rgba(255,191,31,.12),rgba(255,106,55,.07));border:1px solid rgba(255,191,31,.16)}.st136-black-action span,.st136-black-action b,.st136-black-action small{display:block}.st136-black-action span{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#ffcf68}.st136-black-action b{margin:5px 0;font-size:16px}.st136-black-action small{color:#b9c2cc;line-height:1.5} @keyframes st136Flow{0%{left:-40%}100%{left:100%}} @media(max-width:1100px){.st136-system-grid,.st136-black-shell{grid-template-columns:1fr}.st136-system-footer,.st136-black-metrics{grid-template-columns:1fr}} @media(max-width:760px){.st136-system-head,.st136-main-top,.st136-black-head{align-items:flex-start;flex-direction:column}.st136-flow-map,.st136-release-path{grid-template-columns:1fr}.st136-flow-map>i,.st136-release-path>i{width:2px;height:24px;justify-self:center}.st136-system-footer article{grid-template-columns:34px 1fr}} @media(prefers-reduced-motion:reduce){.st136-flow-map>i:after,.st136-release-path>i:after{animation:none!important}.st136-system-side article,.st136-black-points article,.st136-black-metrics article{transition:none!important}} /* ===== Worklix V1.37 Software delivery board + Blog redesign ===== */ .st137-delivery-board{height:100%;display:flex;flex-direction:column;padding:24px;border-radius:32px;background:linear-gradient(155deg,#10151d,#232a35);color:#fff;border:1px solid rgba(255,255,255,.08);box-shadow:0 28px 72px rgba(20,26,34,.18);overflow:hidden;position:relative} .st137-delivery-board:before{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-100px;top:-120px;background:radial-gradient(circle,rgba(255,191,31,.14),transparent 66%);pointer-events:none} .st137-delivery-head{display:flex;align-items:center;justify-content:space-between;gap:16px;position:relative;z-index:1}.st137-delivery-head small,.st137-delivery-head b{display:block}.st137-delivery-head small{font-size:9px;letter-spacing:.1em;color:#ffcf68}.st137-delivery-head b{margin-top:4px;font-size:16px}.st137-delivery-head>span{padding:8px 11px;border-radius:999px;background:#fff4d7;color:#956200;font-size:10px;font-weight:900} .st137-delivery-hero{display:grid;grid-template-columns:1.1fr .9fr;gap:12px;margin:22px 0 14px}.st137-delivery-score,.st137-delivery-signal{padding:18px;border-radius:20px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045)}.st137-delivery-score span,.st137-delivery-signal span{display:block;font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#9ba6b3}.st137-delivery-score strong{display:block;font-size:38px;line-height:1;margin:8px 0;color:#ffcf68}.st137-delivery-score small,.st137-delivery-signal small{display:block;color:#b8c0ca;font-size:11px;line-height:1.55}.st137-delivery-signal b{display:block;margin:8px 0 6px;font-size:19px} .st137-lane-map{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;gap:8px;padding:15px;border-radius:22px;background:#0b1016;border:1px solid rgba(255,255,255,.07)}.st137-lane-map article{min-width:0;padding:12px;border-radius:16px;background:#171d26;border:1px solid rgba(255,255,255,.07);transition:.28s}.st137-lane-map article:hover{transform:translateY(-3px);border-color:rgba(255,191,31,.24)}.st137-lane-map article>span{width:28px;height:28px;border-radius:9px;display:grid;place-items:center;background:rgba(255,255,255,.06);font-size:9px;color:#aab3be;margin-bottom:8px}.st137-lane-map small,.st137-lane-map b,.st137-lane-map em{display:block}.st137-lane-map small{font-size:9px;color:#8f99a6;text-transform:uppercase;letter-spacing:.06em}.st137-lane-map b{font-size:12px;margin:4px 0}.st137-lane-map em{font-size:9px;font-style:normal;color:#73d7a6}.st137-lane-map .watch{border-color:rgba(255,191,31,.32);background:linear-gradient(180deg,rgba(255,191,31,.10),rgba(255,255,255,.03))}.st137-lane-map .watch em{color:#ffcf68}.st137-lane-map>i{height:2px;border-radius:999px;background:linear-gradient(90deg,rgba(255,191,31,.24),rgba(255,106,55,.45));position:relative;overflow:hidden}.st137-lane-map>i:after{content:"";position:absolute;inset:0;width:40%;background:linear-gradient(90deg,transparent,#ffcf68,transparent);animation:st137Lane 2.4s linear infinite} .st137-delivery-context{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}.st137-delivery-context article{padding:14px 15px;border-radius:18px;background:#1b222c;border:1px solid rgba(255,255,255,.07);transition:.28s}.st137-delivery-context article:hover{transform:translateY(-3px);border-color:rgba(255,191,31,.22)}.st137-delivery-context small,.st137-delivery-context b,.st137-delivery-context p{display:block}.st137-delivery-context small{font-size:9px;text-transform:uppercase;letter-spacing:.08em;color:#929ca9}.st137-delivery-context b{font-size:17px;margin:5px 0}.st137-delivery-context p{margin:0;color:#b7c0ca;font-size:10px;line-height:1.55} .st137-delivery-action{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:15px 16px;border-radius:19px;background:linear-gradient(135deg,rgba(255,191,31,.12),rgba(255,106,55,.07));border:1px solid rgba(255,191,31,.17)}.st137-delivery-action small,.st137-delivery-action b{display:block}.st137-delivery-action small{font-size:9px;text-transform:uppercase;letter-spacing:.09em;color:#ffcf68}.st137-delivery-action b{margin-top:4px;font-size:13px;line-height:1.45}.st137-delivery-action>span{flex:0 0 auto;font-size:10px;font-weight:900;color:#ffcf68} @keyframes st137Lane{from{transform:translateX(-150%)}to{transform:translateX(350%)}} /* Blog V1.37 */ .bl137-feature,.bl137-latest,.bl137-research{background:#fff}.bl137-categories{background:linear-gradient(180deg,#fff9ef,#fff)}.bl137-newsletter{background:#f7f8fb} [data-bl137-reveal] .bl137-rise{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease}[data-bl137-reveal].is-visible .bl137-rise{opacity:1;transform:none} .bl137-feature-grid{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(320px,.82fr);gap:24px;align-items:stretch}.bl137-feature-story{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);border:1px solid #e5e8ee;border-radius:30px;overflow:hidden;background:#fff;box-shadow:0 24px 60px rgba(22,28,36,.08)}.bl137-feature-story figure{margin:0;min-height:520px;overflow:hidden}.bl137-feature-story img{width:100%;height:100%;object-fit:cover}.bl137-feature-copy{padding:32px;display:flex;flex-direction:column;justify-content:center}.bl137-topic{align-self:flex-start;padding:8px 11px;border-radius:999px;background:#fff4d7;color:#976400;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.bl137-feature-copy h2,.bl137-heading h2,.bl137-latest-head h2,.bl137-research-copy h2,.bl137-newsletter-shell h2,.bl137-expand-copy h2{font-size:var(--inner-section-title-size);line-height:var(--inner-section-title-line);letter-spacing:var(--inner-section-title-track);margin:14px 0 16px}.bl137-feature-copy p{color:var(--muted);font-size:15px;line-height:1.7;margin:0}.bl137-story-meta{display:flex;gap:14px;margin-top:22px;color:#8b94a1;font-size:11px}.bl137-feature-rail{padding:26px;border-radius:30px;background:#141a22;color:#fff;display:flex;flex-direction:column}.bl137-feature-rail .eyebrow{align-self:flex-start;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.1);color:#fff}.bl137-feature-rail h3{font-size:26px;line-height:1.16;letter-spacing:-.03em;margin:16px 0 18px}.bl137-feature-rail>a{display:grid;grid-template-columns:1fr auto;gap:4px 14px;padding:15px 0;border-top:1px solid rgba(255,255,255,.09);transition:.28s}.bl137-feature-rail>a:hover{padding-left:8px;color:#ffcf68}.bl137-feature-rail>a b{font-size:14px}.bl137-feature-rail>a small{grid-column:1;color:#aeb7c2;line-height:1.5}.bl137-feature-rail>a span{grid-column:2;grid-row:1/3;align-self:center} .bl137-heading,.bl137-latest-head{display:grid;grid-template-columns:1fr .8fr;gap:44px;align-items:end;margin-bottom:32px}.bl137-heading p{margin:0;color:var(--muted);font-size:16px;line-height:1.7}.bl137-category-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.bl137-category-grid article{min-height:260px;padding:24px;border-radius:24px;border:1px solid #eee3ce;background:#fff;display:flex;flex-direction:column;transition:.3s;position:relative;overflow:hidden}.bl137-category-grid article:before{content:"";position:absolute;inset:auto -35px -50px auto;width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,rgba(255,191,31,.17),transparent 68%)}.bl137-category-grid article:hover{transform:translateY(-6px);border-color:#f2cb70;box-shadow:0 22px 46px rgba(22,28,36,.08)}.bl137-category-grid article>span{font-size:11px;font-weight:900;color:#a36c00}.bl137-category-grid b{font-size:20px;margin:36px 0 10px}.bl137-category-grid p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}.bl137-category-grid a{margin-top:auto;padding-top:18px;font-size:12px;font-weight:850;color:#9c6800} .bl137-latest-head{align-items:center}.bl137-filter{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}.bl137-filter button{border:1px solid #e1e5eb;background:#fff;border-radius:999px;padding:9px 13px;font-size:11px;font-weight:800;color:#596270;cursor:pointer}.bl137-filter button.is-active,.bl137-filter button:hover{background:#222832;color:#fff;border-color:#222832}.bl137-article-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.bl137-article-card{padding:22px;border-radius:24px;background:#f7f8fb;border:1px solid #e6e9ef;min-height:280px;display:flex;flex-direction:column;transition:.3s}.bl137-article-card:hover{transform:translateY(-5px);box-shadow:0 22px 50px rgba(22,28,36,.09);background:#fff}.bl137-article-card.large{grid-column:span 2;display:grid;grid-template-columns:1.05fr .95fr;padding:0;overflow:hidden;min-height:340px}.bl137-article-card figure{margin:0;min-height:340px}.bl137-article-card figure img{width:100%;height:100%;object-fit:cover}.bl137-article-card.large>div{padding:26px;display:flex;flex-direction:column}.bl137-article-card span{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:#9c6800}.bl137-article-card h3{font-size:20px;line-height:1.3;letter-spacing:-.02em;margin:12px 0 9px}.bl137-article-card p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}.bl137-article-card small{margin-top:auto;padding-top:20px;color:#89929e;font-size:10px}.bl137-article-icon{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#fff4d7;color:#986400;font-weight:900;font-size:18px;margin-bottom:30px} .bl137-expand{height:180vh;background:#090d13;color:#fff;padding:0;position:relative}.bl137-expand-sticky{position:sticky;top:84px;height:calc(100vh - 84px);display:grid;place-items:center;overflow:hidden}.bl137-expand-bg{position:absolute;inset:0;background:radial-gradient(circle at 20% 20%,rgba(255,191,31,.13),transparent 30%),linear-gradient(rgba(255,255,255,.015) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.015) 1px,transparent 1px);background-size:auto,70px 70px,70px 70px}.bl137-expand-media{position:absolute;margin:0;width:calc(62% + var(--bl137-progress,0)*38%);height:calc(60% + var(--bl137-progress,0)*40%);border-radius:calc(30px - var(--bl137-progress,0)*28px);overflow:hidden;box-shadow:0 30px 90px rgba(0,0,0,.34)}.bl137-expand-media img{width:100%;height:100%;object-fit:cover;filter:brightness(calc(.72 + var(--bl137-progress,0)*.04))}.bl137-expand-title{position:absolute;z-index:2;font:800 clamp(50px,8vw,118px)/.9 var(--title-font);letter-spacing:-.06em;color:#fff;mix-blend-mode:difference;transition:none;pointer-events:none}.bl137-expand-title.left{left:calc(10% - var(--bl137-progress,0)*20%)}.bl137-expand-title.right{right:calc(10% - var(--bl137-progress,0)*20%)}.bl137-expand-copy{position:absolute;z-index:3;left:50%;bottom:8%;transform:translate(-50%,calc(28px*(1 - var(--bl137-copy,0))));width:min(760px,calc(100% - 44px));text-align:center;opacity:var(--bl137-copy,0);pointer-events:calc(var(--bl137-copy,0));}.bl137-expand-copy .eyebrow{background:rgba(255,255,255,.10);border-color:rgba(255,255,255,.14);color:#fff}.bl137-expand-copy h2{color:#fff}.bl137-expand-copy p{color:#d2d8df;max-width:650px;margin:0 auto 20px;line-height:1.68} .bl137-research-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:44px;align-items:stretch}.bl137-research-copy{display:flex;flex-direction:column;justify-content:center}.bl137-research-copy>p{color:var(--muted);font-size:16px;line-height:1.7}.bl137-research-list{display:grid;gap:10px;margin-top:18px}.bl137-research-list article{padding:16px 18px;border-radius:18px;background:#fff9ef;border:1px solid #f0dfbc}.bl137-research-list b,.bl137-research-list small{display:block}.bl137-research-list small{margin-top:4px;color:#6a7380;line-height:1.55}.bl137-research-panel{padding:26px;border-radius:30px;background:#1d242d;color:#fff;box-shadow:0 26px 66px rgba(22,28,36,.16)}.bl137-panel-head small,.bl137-panel-head b{display:block}.bl137-panel-head small{color:#ffcf68;font-size:10px;letter-spacing:.09em}.bl137-panel-head b{margin-top:6px;font-size:24px}.bl137-note-stack{display:grid;gap:12px;margin-top:22px}.bl137-note-stack article{display:grid;grid-template-columns:46px 1fr;gap:13px;padding:17px;border-radius:19px;background:#29313c;border:1px solid rgba(255,255,255,.07);transition:.28s}.bl137-note-stack article:hover{transform:translateX(5px);border-color:rgba(255,191,31,.22)}.bl137-note-stack span{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:rgba(255,191,31,.12);color:#ffcf68;font-size:10px;font-weight:900}.bl137-note-stack b{font-size:15px}.bl137-note-stack p{margin:5px 0 0;color:#b6c0ca;font-size:12px;line-height:1.55} .bl137-newsletter-shell{display:grid;grid-template-columns:1fr .8fr;gap:44px;align-items:center;padding:34px;border-radius:30px;background:#fff;border:1px solid #e4e8ee;box-shadow:0 24px 58px rgba(22,28,36,.07)}.bl137-newsletter-shell p{color:var(--muted);margin:0;max-width:600px}.bl137-newsletter-form label{display:block;font-size:11px;font-weight:850;margin-bottom:8px}.bl137-newsletter-form>div{display:flex;gap:8px}.bl137-newsletter-form input{width:100%;min-width:0;border:1px solid #dde2e9;border-radius:999px;padding:0 18px;font:inherit;min-height:50px}.bl137-newsletter-form small{display:block;margin-top:8px;color:#929aa5;font-size:10px} @media(max-width:1100px){.st137-delivery-hero,.bl137-feature-grid,.bl137-feature-story,.bl137-heading,.bl137-latest-head,.bl137-research-grid,.bl137-newsletter-shell{grid-template-columns:1fr}.st137-delivery-context,.bl137-category-grid{grid-template-columns:repeat(2,1fr)}.st137-lane-map{grid-template-columns:1fr}.st137-lane-map>i{width:2px;height:22px;justify-self:center}.bl137-article-grid{grid-template-columns:1fr 1fr}.bl137-article-card.large{grid-column:span 2}.bl137-filter{justify-content:flex-start}.bl137-feature-story figure{min-height:420px}} @media(max-width:760px){.st137-delivery-head,.st137-delivery-action{align-items:flex-start;flex-direction:column}.st137-delivery-context{grid-template-columns:1fr}.bl137-category-grid,.bl137-article-grid{grid-template-columns:1fr}.bl137-article-card.large{grid-column:auto;grid-template-columns:1fr}.bl137-feature-story figure,.bl137-article-card figure{min-height:300px}.bl137-expand{height:auto;padding:var(--global-section-space) 0}.bl137-expand-sticky{position:relative;top:auto;height:auto;display:block;padding:0 20px}.bl137-expand-media{position:relative;width:100%;height:420px;border-radius:24px}.bl137-expand-title{display:none}.bl137-expand-copy{position:relative;left:auto;bottom:auto;transform:none;width:100%;opacity:1;text-align:left;margin-top:24px}.bl137-newsletter-form>div{flex-direction:column}.bl137-newsletter-form .btn{width:100%}} @media(prefers-reduced-motion:reduce){.st137-lane-map>i:after{animation:none!important}[data-bl137-reveal] .bl137-rise{opacity:1!important;transform:none!important;transition:none!important}.bl137-category-grid article,.bl137-article-card,.bl137-note-stack article{transition:none!important}.bl137-expand-media{width:100%!important;height:100%!important}.bl137-expand-title{display:none!important}.bl137-expand-copy{opacity:1!important;transform:translate(-50%,0)!important}} /* ===== Worklix V1.38 Blog system ===== */ .blog138-feature{background:linear-gradient(180deg,#fff,#fff9ef)}.blog138-feature-grid{display:grid;grid-template-columns:1.06fr .94fr;gap:34px;align-items:stretch}.blog138-feature-image{min-height:500px;border-radius:30px;overflow:hidden;box-shadow:0 26px 70px rgba(22,28,36,.12)}.blog138-feature-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.blog138-feature-image:hover img{transform:scale(1.025)}.blog138-feature-copy{display:flex;flex-direction:column;justify-content:center;padding:34px;border-radius:30px;background:#fff;border:1px solid #e6e9ef;box-shadow:0 20px 52px rgba(22,28,36,.07)}.blog138-feature-meta{display:flex;gap:10px;align-items:center;margin:20px 0 12px;font-size:11px}.blog138-feature-meta span{font-weight:900;color:#9d6800;text-transform:uppercase;letter-spacing:.08em}.blog138-feature-meta small{color:#8c95a1}.blog138-feature-copy h2{font-size:clamp(34px,4vw,56px);line-height:1.04;letter-spacing:-.045em;margin:0 0 16px}.blog138-feature-copy p{color:var(--muted);font-size:16px;line-height:1.72;margin:0 0 24px}.blog138-feature-copy .btn{align-self:flex-start}.blog138-index-head{display:grid;grid-template-columns:1fr .82fr;gap:42px;align-items:end;margin-bottom:28px}.blog138-index-head p{margin:0;color:var(--muted);font-size:16px;line-height:1.7}.blog138-tools{display:flex;justify-content:space-between;gap:18px;align-items:flex-end;margin-bottom:24px}.blog138-filter{display:flex;flex-wrap:wrap;gap:8px}.blog138-filter button{border:1px solid #e2e6ec;background:#fff;border-radius:999px;padding:9px 13px;font-size:11px;font-weight:800;cursor:pointer;transition:.25s}.blog138-filter button:hover,.blog138-filter button.is-active{background:#232a34;color:#fff;border-color:#232a34}.blog138-search{display:grid;gap:6px;min-width:230px;font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.blog138-search input{min-height:42px;border:1px solid #dfe4eb;border-radius:999px;padding:0 15px;font:inherit;text-transform:none;letter-spacing:0;background:#fff}.blog138-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.blog138-card{border:1px solid #e5e9ef;border-radius:24px;overflow:hidden;background:#fff;box-shadow:0 12px 32px rgba(22,28,36,.04);transition:transform .3s ease,box-shadow .3s ease,border-color .3s ease}.blog138-card:hover{transform:translateY(-6px);box-shadow:0 24px 50px rgba(22,28,36,.10);border-color:#f0ca73}.blog138-card-image{display:block;height:230px;overflow:hidden}.blog138-card-image img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.blog138-card:hover .blog138-card-image img{transform:scale(1.035)}.blog138-card-body{padding:21px;display:flex;flex-direction:column;min-height:330px}.blog138-card-meta,.blog138-card-foot{display:flex;align-items:center;justify-content:space-between;gap:12px}.blog138-card-meta span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#9d6800;font-weight:900}.blog138-card-meta small,.blog138-card-foot time{font-size:10px;color:#8b94a1}.blog138-card h3{font-size:19px;line-height:1.33;letter-spacing:-.02em;margin:14px 0 10px}.blog138-card p{color:var(--muted);font-size:13px;line-height:1.65;margin:0}.blog138-card-foot{margin-top:auto;padding-top:18px;border-top:1px solid #edf0f4}.blog138-card-foot a{font-size:11px;font-weight:850;color:#9b6500}.blog138-empty{text-align:center;padding:30px;color:var(--muted)}.blog138-newsletter{background:#f7f8fb}.blog138-newsletter-shell{display:grid;grid-template-columns:1fr .8fr;gap:42px;align-items:center;padding:34px;border-radius:30px;background:#fff;border:1px solid #e4e8ee;box-shadow:0 20px 54px rgba(22,28,36,.07)}.blog138-newsletter-shell h2{margin:14px 0 12px}.blog138-newsletter-shell p{margin:0;color:var(--muted)}.blog138-newsletter form{display:flex;align-items:end;gap:10px}.blog138-newsletter label{display:grid;gap:7px;flex:1;font-size:11px;font-weight:800}.blog138-newsletter input{min-height:50px;border:1px solid #dde2e9;border-radius:999px;padding:0 17px;font:inherit} .post138-page{background:#fff}.post138-hero{padding:72px 0 48px;background:linear-gradient(180deg,#fff,#fff8eb);border-bottom:1px solid #efe8da}.post138-hero-inner{max-width:980px}.post138-back{display:inline-block;margin-bottom:24px;color:#8f6207;font-size:12px;font-weight:850}.post138-hero-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin-bottom:18px}.post138-hero-meta span{padding:7px 10px;border-radius:999px;background:#fff0c7;color:#8d5e00;font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.post138-hero-meta time,.post138-hero-meta small{font-size:11px;color:#7b8490}.post138-hero h1{font-size:clamp(42px,5.6vw,76px);line-height:1;letter-spacing:-.055em;margin:0;max-width:16ch}.post138-hero p{font-size:18px;line-height:1.68;color:#596270;max-width:780px;margin:22px 0 0}.post138-main{padding:54px 0 var(--global-section-space)}.post138-layout{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:50px;align-items:start}.post138-article{min-width:0}.post138-hero-image{margin:0 0 22px;border-radius:28px;overflow:hidden;box-shadow:0 22px 58px rgba(22,28,36,.10)}.post138-hero-image img{width:100%;height:auto;max-height:600px;object-fit:cover}.post138-byline{display:flex;align-items:center;gap:12px;padding:14px 0 26px;border-bottom:1px solid #e8ecf1}.post138-author-mark{width:42px;height:42px;border-radius:14px;background:var(--gradient);display:grid;place-items:center;font-weight:900;color:#191c20}.post138-byline b,.post138-byline small{display:block}.post138-byline small{font-size:11px;color:#8a939f}.post138-byline>span{margin-left:auto;font-size:10px;color:#929aa5}.post138-lede{font-size:20px;line-height:1.72;color:#3f4854;margin:30px 0}.post138-keybox{padding:24px;border-radius:24px;background:#111721;color:#fff;margin:0 0 34px}.post138-keybox>span{display:block;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:#ffcb55;margin-bottom:13px}.post138-keybox ul{margin:0;padding-left:20px;display:grid;gap:8px}.post138-keybox li{color:#d1d8e1;line-height:1.6}.post138-copy-section{scroll-margin-top:120px;margin:0 0 34px}.post138-copy-section h2{font-size:clamp(28px,3.2vw,42px);line-height:1.12;letter-spacing:-.035em;margin:0 0 16px}.post138-copy-section p{font-size:16px;line-height:1.82;color:#515b68;margin:0 0 16px}.post138-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:40px 0}.post138-tags b{margin-right:4px}.post138-tags span{padding:8px 11px;border-radius:999px;background:#f5f6f8;border:1px solid #e4e8ee;font-size:11px;color:#596270}.post138-sidebar{position:sticky;top:108px;display:grid;gap:16px}.post138-side-card{padding:20px;border-radius:22px;background:#f7f8fb;border:1px solid #e5e8ee}.post138-side-card>span{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:#9b6500;margin-bottom:12px}.post138-side-card>a{display:block;padding:9px 0;border-top:1px solid #e4e8ee;font-size:12px;line-height:1.45;color:#515b68}.post138-side-card>a:hover{color:#9b6500}.post138-side-card>a:first-of-type{border-top:0}.post138-recent{display:grid!important;grid-template-columns:72px 1fr;gap:10px;align-items:center}.post138-recent img{width:72px;height:54px;border-radius:10px;object-fit:cover}.post138-recent b{display:block;font-size:11px;line-height:1.35}.post138-recent small{display:block;margin-top:4px;font-size:9px;color:#929aa5}.post138-side-cta{padding:22px;border-radius:24px;background:#141a22;color:#fff;box-shadow:0 18px 40px rgba(12,17,24,.18)}.post138-side-cta small{display:block;color:#ffcb55;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.post138-side-cta b{display:block;font-size:20px;line-height:1.25;margin:10px 0}.post138-side-cta p{font-size:12px;line-height:1.6;color:#adb7c2}.post138-side-cta .btn{margin-top:8px;width:100%}.post138-related{margin:50px 0 38px;padding-top:34px;border-top:1px solid #e5e9ef}.post138-related-head{display:flex;justify-content:space-between;gap:20px;align-items:end;margin-bottom:18px}.post138-related-head span{font-size:10px;text-transform:uppercase;letter-spacing:.1em;font-weight:900;color:#9b6500}.post138-related-head h2{font-size:28px;margin:7px 0 0}.post138-related-head>div:last-child{display:flex;gap:8px}.post138-related-head button{width:42px;height:42px;border-radius:50%;border:1px solid #dfe4eb;background:#fff;cursor:pointer;font-size:18px}.post138-related-track{display:flex;gap:14px;overflow:auto;scroll-snap-type:x mandatory;scrollbar-width:none}.post138-related-track::-webkit-scrollbar{display:none}.post138-related-card{flex:0 0 46%;min-width:280px;scroll-snap-align:start;border:1px solid #e5e9ef;border-radius:20px;overflow:hidden;background:#fff}.post138-related-card img{width:100%;height:170px;object-fit:cover}.post138-related-card span,.post138-related-card h3,.post138-related-card small{display:block;margin-left:17px;margin-right:17px}.post138-related-card span{margin-top:15px;font-size:9px;text-transform:uppercase;letter-spacing:.1em;color:#9c6800;font-weight:900}.post138-related-card h3{font-size:15px;line-height:1.4;margin-top:7px;margin-bottom:10px}.post138-related-card small{margin-bottom:17px;color:#929aa5}.post138-comment{padding:30px;border-radius:26px;background:#fff9ef;border:1px solid #efdfbd}.post138-comment h2{font-size:34px;margin:14px 0 8px}.post138-comment>p{color:#606a77;line-height:1.7;margin:0 0 22px}.post138-comment form{display:grid;gap:15px}.post138-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px}.post138-comment label{display:grid;gap:7px;font-size:12px;font-weight:800}.post138-comment label span{font-weight:500;color:#8b94a0}.post138-comment input,.post138-comment textarea{width:100%;border:1px solid #d9dee6;border-radius:14px;padding:12px 14px;background:#fff;font:inherit}.post138-comment textarea{resize:vertical;min-height:150px}.post138-consent{grid-template-columns:18px 1fr!important;align-items:start}.post138-consent input{width:16px;height:16px;margin-top:3px}.post138-comment .btn{justify-self:start} @media(max-width:1050px){.blog138-feature-grid,.blog138-index-head,.blog138-newsletter-shell,.post138-layout{grid-template-columns:1fr}.blog138-grid{grid-template-columns:repeat(2,1fr)}.blog138-feature-image{min-height:420px}.post138-sidebar{position:relative;top:auto;grid-template-columns:repeat(2,1fr)}.post138-side-cta{grid-column:span 2}}@media(max-width:720px){.blog138-tools{align-items:stretch;flex-direction:column}.blog138-search{min-width:0}.blog138-grid{grid-template-columns:1fr}.blog138-card-body{min-height:0}.blog138-newsletter form{flex-direction:column;align-items:stretch}.blog138-feature-copy{padding:24px}.blog138-feature-image{min-height:320px}.post138-hero{padding:50px 0 34px}.post138-hero h1{font-size:clamp(38px,11vw,56px)}.post138-hero p{font-size:16px}.post138-main{padding-top:30px}.post138-byline{align-items:flex-start;flex-wrap:wrap}.post138-byline>span{width:100%;margin-left:54px}.post138-sidebar{grid-template-columns:1fr}.post138-side-cta{grid-column:auto}.post138-form-grid{grid-template-columns:1fr}.post138-related-card{flex-basis:82%}.post138-comment{padding:22px}.post138-lede{font-size:18px}}@media(prefers-reduced-motion:reduce){.blog138-feature-image img,.blog138-card,.blog138-card-image img{transition:none!important}.blog138-card:hover,.blog138-feature-image:hover img,.blog138-card:hover .blog138-card-image img{transform:none!important}} /* ===== Worklix V1.39 blog color alignment + article banner system ===== */ .blog138-index{ background:linear-gradient(180deg,#fffdf8 0%,#fff 46%,#fff8eb 100%); position:relative; overflow:hidden; } .blog138-index::before{ content:""; position:absolute; width:420px; height:420px; border-radius:50%; right:-190px; top:110px; background:radial-gradient(circle,rgba(255,181,34,.16),rgba(255,138,31,.05) 48%,transparent 72%); pointer-events:none; } .blog138-index .container{position:relative;z-index:1} .blog138-index-head .eyebrow{background:#fff6db;border-color:#f3deb1;color:#9f6900} .blog138-filter button{border-color:#eadfca;background:#fffdf8;color:var(--text)} .blog138-filter button:hover,.blog138-filter button.is-active{ color:#20242b; border-color:transparent; background:var(--gradient); box-shadow:0 10px 24px rgba(255,138,31,.16); } .blog138-search input{border-color:#e8ddc9;background:#fff} .blog138-search input:focus{outline:0;border-color:#ffb522;box-shadow:0 0 0 4px rgba(255,181,34,.12)} .blog138-card{border-color:#eee3d1;background:#fff} .blog138-card:hover{border-color:#f3bd4b;box-shadow:0 24px 50px rgba(255,138,31,.12)} .blog138-card-meta span,.blog138-card-foot a{color:#b36f00} .blog138-card-foot{border-color:#f0e7d7} .post139-banner .hubstaff-hero-copy{max-width:1040px!important} .post139-banner-title{ max-width:1000px!important; font-size:clamp(40px,4vw,58px)!important; line-height:1.04!important; letter-spacing:-.048em!important; } .post139-banner-meta{gap:10px 18px!important;margin-top:18px!important} .post139-banner-meta span{ position:relative; padding-right:18px; color:#666f7b!important; } .post139-banner-meta span:not(:last-child)::after{ content:""; position:absolute; right:0; top:50%; width:4px; height:4px; border-radius:50%; background:#ffb522; transform:translateY(-50%); } .post139-back{ display:inline-flex; align-items:center; margin-top:20px; font-size:12px; font-weight:800; color:#a86600; transition:color .25s ease,transform .25s ease; } .post139-back:hover{color:#ff6a37;transform:translateX(-3px)} .post138-page{background:#fffdf9} .post138-main{background:linear-gradient(180deg,#fffdf9 0%,#fff 34%,#fffaf1 100%)} .post138-hero-image{border:1px solid #eee1cd;box-shadow:0 22px 58px rgba(72,49,15,.09)} .post138-byline{border-color:#efe3d0} .post138-author-mark{background:var(--gradient);color:#20242b} .post138-keybox{background:linear-gradient(145deg,#151a21,#242b35);border:1px solid #303845} .post138-keybox>span{color:#ffca55} .post138-copy-section h2{color:var(--text)} .post138-copy-section p{color:#59616d} .post138-tags span{background:#fff7e6;border-color:#efdfbf;color:#765f3e} .post138-side-card{background:#fff8e9;border-color:#efdfc1} .post138-side-card>span{color:#a86800} .post138-side-card>a{border-color:#eadabc;color:#555e69} .post138-side-card>a:hover{color:#e27620} .post138-side-cta{background:linear-gradient(145deg,#11161d,#232b35);border:1px solid #2e3742} .post138-side-cta small{color:#ffca55} .post138-related{border-color:#eadfce} .post138-related-head span,.post138-related-card span{color:#ae6d00} .post138-related-head button{border-color:#eadcc1;background:#fffaf0;color:#7f5a18;transition:.25s} .post138-related-head button:hover{background:var(--gradient);color:#20242b;border-color:transparent} .post138-related-card{border-color:#eee1cd;background:#fff} .post138-comment{background:linear-gradient(180deg,#fff8e7,#fffdf9);border-color:#efd7a4} .post138-comment input,.post138-comment textarea{border-color:#e5d7be;background:#fff} .post138-comment input:focus,.post138-comment textarea:focus{outline:0;border-color:#ffb522;box-shadow:0 0 0 4px rgba(255,181,34,.12)} @media(max-width:620px){ .post139-banner-title{font-size:clamp(32px,9vw,44px)!important} .post139-banner-meta span{padding-right:0} .post139-banner-meta span::after{display:none} } /* ===== Worklix V1.40 Workforce Compliance ===== */ .wc140-section{position:relative;padding:var(--global-section-space) 0;overflow:hidden} .wc140-section .title-line{display:block} body:not(.home) .wc140-section h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:14px 0 16px!important;text-wrap:balance} body:not(.home) .wc140-section h3{font-size:var(--inner-card-title-size)!important;line-height:1.3!important} [data-wc140-reveal] .wc140-rise{opacity:0;transform:translateY(24px);transition:opacity .65s ease,transform .65s ease} [data-wc140-reveal].is-visible .wc140-rise{opacity:1;transform:none} .wc140-copy>p{margin:0 0 22px;color:var(--muted);font-size:16px;line-height:1.72} .wc140-records{background:linear-gradient(180deg,#fff,#fffaf0)} .wc140-records-grid,.wc140-rules-layout,.wc140-access-grid,.wc140-retention-grid,.wc140-reporting-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:42px;align-items:center} .wc140-record-list{display:grid;gap:12px;margin-top:24px} .wc140-record-list article{display:grid;grid-template-columns:44px 1fr;gap:14px;padding:16px 18px;border:1px solid #e8ebef;border-radius:18px;background:#fff;box-shadow:0 12px 30px rgba(19,24,33,.05);transition:.28s} .wc140-record-list article:hover{transform:translateY(-4px);border-color:#f2c45f;box-shadow:0 18px 38px rgba(19,24,33,.09)} .wc140-record-list span{display:grid;place-items:center;width:44px;height:44px;border-radius:14px;background:#fff2cc;color:#9d6500;font-weight:900;font-size:12px}.wc140-record-list b{display:block;margin-bottom:4px}.wc140-record-list p{margin:0;color:var(--muted);font-size:14px;line-height:1.62} .wc140-evidence-console{padding:26px;border-radius:28px;background:#10161f;color:#fff;border:1px solid #232c38;box-shadow:0 28px 70px rgba(11,16,23,.18)} .wc140-console-head,.wc140-console-foot{display:flex;align-items:center;justify-content:space-between;gap:18px}.wc140-console-head small,.wc140-console-grid small{display:block;color:#9da8b6;font-size:10px;text-transform:uppercase;letter-spacing:.1em}.wc140-console-head strong{display:block;margin-top:5px;font-size:18px}.wc140-console-head>span{padding:8px 10px;border-radius:999px;background:rgba(255,190,31,.12);color:#ffcf62;font-size:11px;font-weight:900;letter-spacing:.08em}.wc140-console-track{height:5px;margin:18px 0 20px;border-radius:999px;background:rgba(255,255,255,.08);overflow:hidden}.wc140-console-track i{display:block;width:0;height:100%;background:linear-gradient(90deg,#ffbe1f,#ff7b43);transition:width 1s ease}.wc140-records.is-visible .wc140-console-track i{width:100%}.wc140-console-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.wc140-console-grid article{padding:16px;border-radius:18px;background:#181f2a;border:1px solid rgba(255,255,255,.07)}.wc140-console-grid b{display:block;margin:6px 0 3px;font-size:17px}.wc140-console-grid span{color:#aeb7c2;font-size:12px}.wc140-console-foot{margin-top:18px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);font-size:12px;color:#aeb7c2}.wc140-console-foot b{color:#ffcf62} .wc140-rules{background:#0b1118;color:#fff}.wc140-rules-layout{align-items:stretch}.wc140-rules .wc140-copy{align-self:center}.wc140-rules .wc140-copy>p{color:#b3bdc8}.wc140-rules .eyebrow{background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.11);color:#f0f3f7}.wc140-rules-board{padding:24px;border-radius:28px;background:linear-gradient(180deg,#151c26,#10161f);border:1px solid rgba(255,255,255,.09);box-shadow:0 24px 60px rgba(0,0,0,.22)}.wc140-rule-header small{display:block;color:#ffcb58;text-transform:uppercase;letter-spacing:.1em;font-size:10px;font-weight:900}.wc140-rule-header strong{display:block;margin-top:7px;font-size:22px}.wc140-rule-lines{display:grid;gap:11px;margin-top:20px}.wc140-rule-lines article{display:grid;grid-template-columns:12px 1fr auto;gap:12px;align-items:center;padding:15px 16px;border-radius:17px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);transition:.28s}.wc140-rule-lines article:hover{transform:translateX(5px);border-color:rgba(255,190,31,.28)}.wc140-dot{width:10px;height:10px;border-radius:50%;background:#ff8a50;box-shadow:0 0 0 5px rgba(255,138,80,.1)}.wc140-dot.ok{background:#68d391;box-shadow:0 0 0 5px rgba(104,211,145,.1)}.wc140-rule-lines b{display:block;font-size:15px}.wc140-rule-lines small{display:block;margin-top:3px;color:#98a3b1;font-size:12px;line-height:1.5}.wc140-rule-lines em{font-style:normal;font-size:11px;color:#ffd06a;font-weight:800}.wc140-rule-notes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.wc140-rule-notes article{padding:17px;border-radius:18px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08)}.wc140-rule-notes p{margin:5px 0 0;color:#aeb7c2;font-size:13px;line-height:1.6} .wc140-expand{background:linear-gradient(180deg,#fff,#f7f8fa)}.wc140-expand-head{text-align:center;max-width:900px}.wc140-expand-head p{max-width:680px;margin:0 auto;color:var(--muted);line-height:1.7}.wc140-expand-media{position:relative;margin-top:34px;max-width:940px;transition:max-width .9s cubic-bezier(.2,.75,.2,1)}.wc140-expand.is-expanded .wc140-expand-media{max-width:1320px}.wc140-expand-media figure{margin:0;overflow:hidden;border-radius:28px;box-shadow:0 28px 70px rgba(18,24,32,.16);transition:border-radius .8s ease}.wc140-expand.is-expanded .wc140-expand-media figure{border-radius:20px}.wc140-expand-media img{display:block;width:100%;height:520px;object-fit:cover;transform:scale(1.04);transition:transform 1s ease}.wc140-expand.is-expanded .wc140-expand-media img{transform:scale(1)}.wc140-expand-overlay{position:absolute;left:36px;bottom:30px;max-width:420px;padding:18px 20px;border-radius:18px;background:rgba(14,19,27,.82);backdrop-filter:blur(12px);color:#fff;border:1px solid rgba(255,255,255,.08)}.wc140-expand-overlay small{color:#ffcf62;font-weight:900;letter-spacing:.1em;font-size:10px}.wc140-expand-overlay strong,.wc140-expand-overlay span{display:block}.wc140-expand-overlay strong{margin:7px 0 5px;font-size:18px}.wc140-expand-overlay span{color:#c3cad4;font-size:13px}.wc140-expand-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:18px;opacity:0;transform:translateY(18px);transition:.65s .25s}.wc140-expand.is-expanded .wc140-expand-cards{opacity:1;transform:none}.wc140-expand-cards article{padding:18px 20px;border-radius:18px;background:#fff;border:1px solid #e5e8ed;box-shadow:0 10px 25px rgba(18,24,32,.05)}.wc140-expand-cards small{color:#a96b00;font-size:10px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}.wc140-expand-cards b{display:block;margin:6px 0}.wc140-expand-cards p{margin:0;color:var(--muted);font-size:13px;line-height:1.6} .wc140-access{background:#fffaf0}.wc140-access-summary{display:grid;gap:11px;margin-top:22px}.wc140-access-summary article{display:grid;grid-template-columns:120px 1fr;gap:4px 14px;padding:14px 16px;border-radius:16px;background:#fff;border:1px solid #ece8df}.wc140-access-summary small{grid-row:1/3;color:#a66b00;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:900;align-self:center}.wc140-access-summary b{font-size:15px}.wc140-access-summary span{font-size:12px;color:var(--muted)}.wc140-access-matrix{padding:24px;border-radius:28px;background:#fff;border:1px solid #e3e6eb;box-shadow:0 22px 55px rgba(20,25,34,.08)}.wc140-matrix-head,.wc140-matrix-row{display:grid;grid-template-columns:1.6fr repeat(3,.55fr);gap:8px;align-items:center}.wc140-matrix-head{padding:0 10px 12px;color:#8b95a2;font-size:10px;text-transform:uppercase;letter-spacing:.09em;font-weight:900}.wc140-matrix-row{padding:14px 10px;border-top:1px solid #edf0f3}.wc140-matrix-row b{font-size:14px}.wc140-matrix-row i{text-align:center;font-style:normal;color:#b77a00;font-weight:900}.wc140-matrix-foot{display:flex;justify-content:space-between;gap:16px;margin-top:14px;padding:14px 16px;border-radius:16px;background:#111720;color:#aeb7c2;font-size:12px}.wc140-matrix-foot b{color:#ffcf62} .wc140-retention{background:#f5f6f8}.wc140-retention-photo{position:relative;margin:0;border-radius:28px;overflow:hidden;box-shadow:0 24px 58px rgba(20,25,34,.12)}.wc140-retention-photo img{display:block;width:100%;height:560px;object-fit:cover}.wc140-retention-photo figcaption{position:absolute;left:20px;right:20px;bottom:20px;padding:18px 20px;border-radius:18px;background:rgba(15,20,28,.84);color:#fff;backdrop-filter:blur(10px)}.wc140-retention-photo small{display:block;color:#ffcf62;text-transform:uppercase;letter-spacing:.1em;font-size:10px;font-weight:900}.wc140-retention-photo strong{display:block;margin-top:7px;font-size:17px;line-height:1.45}.wc140-lifecycle{display:grid;gap:12px;margin-top:20px}.wc140-lifecycle article{display:grid;grid-template-columns:40px 1fr;gap:13px;padding:15px 17px;border-radius:18px;background:#fff;border:1px solid #e3e7ec}.wc140-lifecycle>article>span{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:#fff0c6;color:#a76c00;font-weight:900}.wc140-lifecycle b{display:block;margin-bottom:4px}.wc140-lifecycle p{margin:0;color:var(--muted);font-size:13px;line-height:1.6} .wc140-reporting{background:#fff}.wc140-report-panel{position:relative;padding:20px;border-radius:28px;background:#10161f;box-shadow:0 26px 64px rgba(12,17,24,.16)}.wc140-report-label{color:#ffcf62;font-size:11px;font-weight:900;letter-spacing:.09em;text-transform:uppercase;margin-bottom:14px}.wc140-report-panel img{display:block;width:100%;height:auto;border-radius:18px}.wc140-report-stamp{position:absolute;right:32px;bottom:32px;max-width:220px;padding:15px 16px;border-radius:17px;background:rgba(255,255,255,.96);box-shadow:0 16px 38px rgba(0,0,0,.16)}.wc140-report-stamp small,.wc140-report-stamp b,.wc140-report-stamp span{display:block}.wc140-report-stamp small{color:#a76c00;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:900}.wc140-report-stamp b{margin:6px 0 3px}.wc140-report-stamp span{color:#68727e;font-size:12px}.wc140-report-points{display:grid;gap:11px;margin-top:20px}.wc140-report-points article{padding:14px 16px;border-radius:16px;background:#fffaf0;border-left:4px solid #ffbd22}.wc140-report-points b{display:block;margin-bottom:3px}.wc140-report-points p{margin:0;color:var(--muted);font-size:13px;line-height:1.6}.wc140-legal-note{margin-top:18px!important;padding:14px 16px;border-radius:14px;background:#f4f6f8;font-size:12px!important;line-height:1.6!important;color:#68727e!important} @media(max-width:1050px){.wc140-records-grid,.wc140-rules-layout,.wc140-access-grid,.wc140-retention-grid,.wc140-reporting-grid{grid-template-columns:1fr}.wc140-retention-photo img{height:480px}} @media(max-width:760px){.wc140-console-grid,.wc140-rule-notes,.wc140-expand-cards{grid-template-columns:1fr}.wc140-expand-media img{height:380px}.wc140-expand-overlay{position:relative;left:auto;bottom:auto;margin:12px 0 0;max-width:none;background:#111720}.wc140-access-summary article{grid-template-columns:1fr}.wc140-access-summary small{grid-row:auto}.wc140-matrix-head,.wc140-matrix-row{grid-template-columns:1.5fr repeat(3,.5fr);font-size:12px}.wc140-retention-photo img{height:400px}.wc140-report-stamp{position:relative;right:auto;bottom:auto;margin-top:12px;max-width:none}} @media(prefers-reduced-motion:reduce){[data-wc140-reveal] .wc140-rise,.wc140-expand-media,.wc140-expand-media img,.wc140-expand-cards,.wc140-console-track i{transition:none!important;opacity:1!important;transform:none!important}.wc140-expand-media{max-width:1320px!important}.wc140-expand-cards{opacity:1!important}.wc140-console-track i{width:100%!important}} /* ===== Worklix V1.41 Workforce Compliance balance + interaction polish ===== */ .wc140-records-grid,.wc140-rules-layout,.wc140-access-grid,.wc140-retention-grid,.wc140-reporting-grid{align-items:stretch} .wc140-records-grid>.wc140-copy,.wc140-rules-layout>.wc140-copy,.wc140-access-grid>.wc140-copy,.wc140-retention-grid>.wc140-retention-copy,.wc140-reporting-grid>.wc140-copy{display:flex;flex-direction:column;justify-content:flex-start} .wc140-evidence-console,.wc140-rules-board,.wc140-access-matrix,.wc140-retention-photo,.wc140-report-panel{height:100%} .wc140-evidence-console,.wc140-rules-board,.wc140-access-matrix,.wc140-report-panel{display:flex;flex-direction:column} .wc140-console-foot,.wc140-matrix-foot{margin-top:auto} .wc140-rule-lines{flex:1} .wc140-report-panel img{flex:1;object-fit:cover;min-height:0} .wc141-balance-note,.wc141-access-note{margin-top:14px;padding:17px 18px;border-radius:18px;background:#111720;color:#fff;border:1px solid #232c38;box-shadow:0 14px 32px rgba(17,23,32,.10)} .wc141-balance-note small,.wc141-access-note small,.wc141-report-summary>small{display:block;color:#ffca55;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase} .wc141-balance-note b,.wc141-access-note b{display:block;margin:7px 0 5px;font-size:15px;line-height:1.4} .wc141-balance-note p,.wc141-access-note p{margin:0;color:#b8c0ca;font-size:12.5px;line-height:1.62} .wc141-access-note{background:#fff;border-color:#eadfca;color:#222831;box-shadow:0 12px 30px rgba(20,25,34,.05)} .wc141-access-note small{color:#a66b00}.wc141-access-note p{color:var(--muted)} .wc141-rule-wide{grid-column:1/-1} .wc141-report-summary{display:grid;grid-template-columns:auto repeat(3,1fr);gap:10px;align-items:center;margin-top:14px;padding:13px 14px;border-radius:16px;background:#111720;color:#fff;border:1px solid #252e3a} .wc141-report-summary>small{padding-right:4px} .wc141-report-summary div{padding-left:12px;border-left:1px solid rgba(255,255,255,.09)} .wc141-report-summary b,.wc141-report-summary span{display:block}.wc141-report-summary b{font-size:11px;color:#9ea8b5}.wc141-report-summary span{margin-top:3px;font-size:12px;font-weight:800;color:#fff} /* Reveal motion for blocks and points */ [data-wc140-reveal] .wc140-record-list article, [data-wc140-reveal] .wc140-console-grid article, [data-wc140-reveal] .wc140-rule-lines article, [data-wc140-reveal] .wc140-rule-notes article, [data-wc140-reveal] .wc140-access-summary article, [data-wc140-reveal] .wc140-matrix-row, [data-wc140-reveal] .wc140-lifecycle article, [data-wc140-reveal] .wc140-report-points article, [data-wc140-reveal] .wc141-balance-note, [data-wc140-reveal] .wc141-access-note, [data-wc140-reveal] .wc141-report-summary{opacity:0;transform:translateY(14px) scale(.985);transition:opacity .48s ease,transform .48s cubic-bezier(.2,.7,.2,1),border-color .28s ease,box-shadow .28s ease,background .28s ease} [data-wc140-reveal].is-visible .wc140-record-list article, [data-wc140-reveal].is-visible .wc140-console-grid article, [data-wc140-reveal].is-visible .wc140-rule-lines article, [data-wc140-reveal].is-visible .wc140-rule-notes article, [data-wc140-reveal].is-visible .wc140-access-summary article, [data-wc140-reveal].is-visible .wc140-matrix-row, [data-wc140-reveal].is-visible .wc140-lifecycle article, [data-wc140-reveal].is-visible .wc140-report-points article, [data-wc140-reveal].is-visible .wc141-balance-note, [data-wc140-reveal].is-visible .wc141-access-note, [data-wc140-reveal].is-visible .wc141-report-summary{opacity:1;transform:none} [data-wc140-reveal].is-visible article:nth-child(2){transition-delay:.07s} [data-wc140-reveal].is-visible article:nth-child(3){transition-delay:.14s} [data-wc140-reveal].is-visible article:nth-child(4){transition-delay:.21s} [data-wc140-reveal].is-visible article:nth-child(5){transition-delay:.28s} /* Hover motion */ .wc140-console-grid article,.wc140-rule-notes article,.wc140-access-summary article,.wc140-matrix-row,.wc140-lifecycle article,.wc140-report-points article,.wc140-expand-cards article,.wc141-balance-note,.wc141-access-note,.wc141-report-summary{will-change:transform} .wc140-console-grid article:hover{transform:translateY(-4px);border-color:rgba(255,201,85,.28);background:#1d2633} .wc140-rule-notes article:hover{transform:translateY(-4px);border-color:rgba(255,201,85,.28);background:rgba(255,255,255,.075)} .wc140-access-summary article:hover{transform:translateX(5px);border-color:#f0c76c;box-shadow:0 12px 26px rgba(20,25,34,.07)} .wc140-matrix-row:hover{transform:translateX(4px);background:#fff8e7;border-color:#f0c76c} .wc140-lifecycle article:hover{transform:translateX(5px);border-color:#f0c76c;box-shadow:0 14px 30px rgba(20,25,34,.07)} .wc140-lifecycle article:hover>span{transform:rotate(-6deg) scale(1.06);background:#ffdf8e} .wc140-lifecycle>article>span{transition:transform .28s ease,background .28s ease} .wc140-report-points article:hover{transform:translateX(5px);background:#fff3cf;box-shadow:0 12px 26px rgba(20,25,34,.06)} .wc140-expand-cards article{transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease} .wc140-expand-cards article:hover{transform:translateY(-5px);border-color:#f0c76c;box-shadow:0 18px 38px rgba(18,24,32,.10)} .wc141-balance-note:hover,.wc141-access-note:hover,.wc141-report-summary:hover{transform:translateY(-4px);box-shadow:0 18px 38px rgba(17,23,32,.12)} .wc140-rule-lines article:hover .wc140-dot{transform:scale(1.18)} .wc140-dot{transition:transform .28s ease,box-shadow .28s ease} @media(max-width:1050px){.wc140-evidence-console,.wc140-rules-board,.wc140-access-matrix,.wc140-retention-photo,.wc140-report-panel{height:auto}.wc140-report-panel img{flex:none}} @media(max-width:760px){.wc141-report-summary{grid-template-columns:1fr 1fr}.wc141-report-summary>small{grid-column:1/-1}.wc141-report-summary div{padding:0;border-left:0}.wc141-rule-wide{grid-column:auto}} @media(prefers-reduced-motion:reduce){[data-wc140-reveal] .wc140-record-list article,[data-wc140-reveal] .wc140-console-grid article,[data-wc140-reveal] .wc140-rule-lines article,[data-wc140-reveal] .wc140-rule-notes article,[data-wc140-reveal] .wc140-access-summary article,[data-wc140-reveal] .wc140-matrix-row,[data-wc140-reveal] .wc140-lifecycle article,[data-wc140-reveal] .wc140-report-points article,[data-wc140-reveal] .wc141-balance-note,[data-wc140-reveal] .wc141-access-note,[data-wc140-reveal] .wc141-report-summary{opacity:1!important;transform:none!important;transition:none!important}.wc140-lifecycle>article>span,.wc140-dot{transition:none!important}} /* ===== Worklix V1.42 compliance fills + blog/post refinements ===== */ /* Compliance: use the existing open column area for real review context without adding artificial spacing. */ .wc142-console-context,.wc142-matrix-context{margin-top:auto;display:grid;gap:9px;padding-top:14px} .wc142-console-context>div,.wc142-matrix-context>div{display:grid;grid-template-columns:110px 155px minmax(0,1fr);gap:10px;align-items:center;padding:10px 12px;border-radius:14px;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.035);transition:transform .28s ease,border-color .28s ease,background .28s ease} .wc142-console-context small,.wc142-matrix-context small{font-size:9px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#ffca55} .wc142-console-context b,.wc142-matrix-context b{font-size:11px;color:#fff} .wc142-console-context span,.wc142-matrix-context span{font-size:10px;line-height:1.45;color:#aeb8c5} .wc142-console-context>div:hover,.wc142-matrix-context>div:hover{transform:translateX(4px);border-color:rgba(255,202,85,.34);background:rgba(255,255,255,.065)} .wc140-console-foot,.wc140-matrix-foot{margin-top:12px!important} .wc142-matrix-context>div{border-color:#e7dbc5;background:#fffaf0} .wc142-matrix-context small{color:#a86a00}.wc142-matrix-context b{color:var(--text)}.wc142-matrix-context span{color:var(--muted)} .wc142-matrix-context>div:hover{border-color:#efc76d;background:#fff4d6} [data-wc140-reveal] .wc142-console-context>div,[data-wc140-reveal] .wc142-matrix-context>div{opacity:0;transform:translateY(12px);transition:opacity .45s ease,transform .45s cubic-bezier(.2,.7,.2,1),border-color .28s ease,background .28s ease} [data-wc140-reveal].is-visible .wc142-console-context>div,[data-wc140-reveal].is-visible .wc142-matrix-context>div{opacity:1;transform:none} [data-wc140-reveal].is-visible .wc142-console-context>div:nth-child(2),[data-wc140-reveal].is-visible .wc142-matrix-context>div:nth-child(2){transition-delay:.07s} [data-wc140-reveal].is-visible .wc142-console-context>div:nth-child(3),[data-wc140-reveal].is-visible .wc142-matrix-context>div:nth-child(3){transition-delay:.14s} /* Blog index: predictable two-line titles, three-line summaries and the site's global inline button. */ .blog138-card-body{min-height:338px} .blog138-card h3{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:50.5px;max-height:50.5px;margin:14px 0 10px} .blog138-card p{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;min-height:64.4px;max-height:64.4px} .blog138-card-foot{margin-top:18px!important;padding-top:16px;align-items:center} .blog142-read-btn{min-height:40px!important;padding:0 15px!important;font-size:12px!important;flex:0 0 auto} .blog142-read-btn .btn-arrow{width:28px;height:28px} /* Post pages now use the same global banner treatment as the Blog page. */ .post138-page>.global-unified-banner .hubstaff-hero-copy{max-width:1000px!important} .post138-page>.global-unified-banner .global-banner-title{max-width:980px!important} .post138-page>.global-unified-banner .hero-trust-points{margin-top:18px!important} /* Global Worklix surface/color language across article content, sidebar, comments and related posts. */ .post138-keybox,.post138-side-cta{background:var(--dark)!important} .post138-keybox>span,.post138-side-cta small{color:var(--accent-3)!important} .post138-side-card{background:var(--surface)!important;border-color:var(--line)!important} .post138-side-card>span{color:#a86a00!important} .post138-side-card>a:hover{color:var(--accent)!important} .post138-tags span{background:#fff8e8!important;border-color:#f1dcae!important;color:#6a5528!important} .post138-comment{background:linear-gradient(180deg,#fff9e9,#fff)!important;border-color:#f0d9a7!important} .post138-comment input:focus,.post138-comment textarea:focus{border-color:var(--accent-3)!important;box-shadow:0 0 0 4px rgba(255,181,34,.12)!important} .post138-related-card{border-color:var(--line)!important;transition:transform .28s ease,box-shadow .28s ease,border-color .28s ease} .post138-related-card:hover{transform:translateY(-5px);border-color:#efc76d!important;box-shadow:0 18px 38px rgba(22,28,36,.09)} /* Full-width autoplay related slider sits after the article/sidebar area and directly before the footer. */ .post142-related-section{padding-top:0!important;background:#fff} .post142-related-full{margin:0!important;padding-top:34px;border-top:1px solid var(--line)!important} .post142-related-full .post138-related-track{gap:18px} .post142-related-full .post138-related-card{flex:0 0 calc((100% - 36px)/3);min-width:300px} .post142-related-full .post138-related-card img{height:190px} .post142-related-full .post138-related-head h2{font-size:var(--inner-section-title-size,38px);line-height:var(--inner-section-title-line,1.08);letter-spacing:var(--inner-section-title-track,-.035em)} @media(max-width:1050px){.wc142-console-context>div,.wc142-matrix-context>div{grid-template-columns:110px 150px minmax(0,1fr)}.post142-related-full .post138-related-card{flex-basis:46%}} @media(max-width:720px){.wc142-console-context>div,.wc142-matrix-context>div{grid-template-columns:1fr;gap:4px}.blog138-card-body{min-height:0}.blog138-card h3{min-height:50.5px;max-height:50.5px}.blog138-card p{min-height:64.4px;max-height:64.4px}.blog138-card-foot{gap:10px}.post142-related-full .post138-related-card{flex-basis:82%}.post138-page>.global-unified-banner .global-banner-title{font-size:clamp(31px,8.4vw,42px)!important}} @media(prefers-reduced-motion:reduce){[data-wc140-reveal] .wc142-console-context>div,[data-wc140-reveal] .wc142-matrix-context>div{opacity:1!important;transform:none!important;transition:none!important}.wc142-console-context>div:hover,.wc142-matrix-context>div:hover,.post138-related-card:hover{transform:none!important}} /* ===== Worklix V1.43 Blog banner/button fixes + Cookies redesign ===== */ /* Blog cards use the exact global button typography/shape instead of a local miniature variant. */ .blog138-card-foot .btn{width:auto!important;min-width:0;flex:0 0 auto} .blog138-card-foot .btn .btn-label{font:inherit;letter-spacing:inherit;text-transform:none} .blog138-card-foot .btn-arrow{flex:0 0 auto} /* Post banners deliberately inherit the same global banner measurements as Blog/product pages. */ .post138-page>.global-unified-banner .hubstaff-hero-copy, .post138-page>.global-unified-banner .global-banner-title{max-width:none!important} .post143-global-banner .global-banner-line{display:block} .post143-global-banner .gradient-text{display:inline} .ck143-page .section{padding:var(--global-section-space) 0} .ck143-page h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important} .ck143-page h3{font-size:var(--inner-card-title-size)} .ck143-head,.ck143-thirdparty-head{display:grid;grid-template-columns:1fr .76fr;gap:46px;align-items:end;margin-bottom:30px} .ck143-head p,.ck143-thirdparty-head p,.ck143-expand-head>p{margin:0;color:var(--muted);font-size:16px;line-height:1.72} .ck143-type-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px} .ck143-type-card{position:relative;min-height:330px;padding:24px;border:1px solid #eadfcb;border-radius:26px;background:linear-gradient(180deg,#fff,#fffaf0);box-shadow:0 16px 42px rgba(28,31,36,.05);display:flex;flex-direction:column;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease} .ck143-type-card:hover{transform:translateY(-7px);border-color:#efbd52;box-shadow:0 24px 52px rgba(34,31,24,.10)} .ck143-type-no{width:42px;height:42px;border-radius:14px;background:var(--dark);color:#fff;display:grid;place-items:center;font-size:12px;font-weight:900;margin-bottom:28px;transition:transform .28s ease,background .28s ease} .ck143-type-card:hover .ck143-type-no{transform:rotate(-7deg) scale(1.05);background:linear-gradient(135deg,var(--accent),var(--accent-2))} .ck143-type-card small{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:#a96c00} .ck143-type-card h3{margin:8px 0 12px;line-height:1.2} .ck143-type-card p{color:var(--muted);line-height:1.68;margin:0 0 18px} .ck143-type-card b{font-size:12px;line-height:1.55;margin-top:auto;color:#4f5661} .ck143-purpose{background:#10151d;color:#fff;overflow:hidden} .ck143-purpose-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:50px;align-items:stretch} .ck143-purpose-copy{display:flex;flex-direction:column;justify-content:center}.ck143-purpose-copy h2{color:#fff}.ck143-purpose-copy>p{color:#b8c0cb;line-height:1.72;font-size:16px} .ck143-purpose-points{display:grid;gap:12px;margin-top:24px}.ck143-purpose-points article{display:grid;grid-template-columns:95px 1fr;gap:15px;padding:14px 0;border-top:1px solid rgba(255,255,255,.12)}.ck143-purpose-points span{color:var(--accent-3);font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.ck143-purpose-points p{margin:0;color:#c3cbd5;font-size:13px;line-height:1.55} .ck143-purpose-panel{padding:24px;border-radius:30px;background:linear-gradient(180deg,#1b222d,#151b24);border:1px solid rgba(255,255,255,.1);box-shadow:0 30px 70px rgba(0,0,0,.24)} .ck143-panel-top{display:flex;justify-content:space-between;gap:20px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.1);font-size:11px;color:#b4beca}.ck143-panel-top b{color:#fff} .ck143-purpose-row{display:grid;grid-template-columns:100px 1fr;gap:8px 18px;padding:20px 0;border-bottom:1px solid rgba(255,255,255,.09);transition:transform .25s ease,background .25s ease}.ck143-purpose-row:hover{transform:translateX(6px)}.ck143-purpose-row small{grid-row:span 2;color:var(--accent-3);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}.ck143-purpose-row b{font-size:15px}.ck143-purpose-row span{font-size:12px;color:#aeb7c2}.ck143-purpose-foot{padding-top:20px;display:flex;justify-content:space-between;gap:20px}.ck143-purpose-foot strong{color:var(--accent-3);font-size:11px;text-transform:uppercase;letter-spacing:.08em}.ck143-purpose-foot p{margin:0;color:#b8c0ca;font-size:12px} .ck143-expand-section{background:#fff9ef;overflow:hidden}.ck143-expand-head{max-width:900px;margin:0 auto 30px;text-align:center}.ck143-expand-head .eyebrow{justify-content:center}.ck143-expand{position:relative;min-height:620px;border-radius:34px;overflow:hidden;box-shadow:0 28px 70px rgba(40,30,12,.16);transform:scale(var(--expand-scale,.94));opacity:var(--expand-opacity,.74);will-change:transform,opacity}.ck143-expand>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.ck143-expand:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(9,13,18,.86),rgba(9,13,18,.45) 55%,rgba(9,13,18,.18))}.ck143-expand-overlay{position:absolute;z-index:2;left:clamp(24px,6vw,78px);bottom:clamp(24px,6vw,72px);max-width:760px;color:#fff}.ck143-expand-overlay>span{font-size:10px;font-weight:900;letter-spacing:.12em;color:var(--accent-3)}.ck143-expand-overlay h3{font-size:clamp(30px,4vw,54px);line-height:1.04;letter-spacing:-.04em;margin:10px 0 22px;max-width:13ch}.ck143-expand-overlay>div{display:inline-flex;flex-direction:column;margin-right:30px;padding-left:13px;border-left:2px solid rgba(255,197,57,.7)}.ck143-expand-overlay b{font-size:12px}.ck143-expand-overlay small{font-size:10px;color:#c9d0d8;margin-top:4px} .ck143-browser-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:46px;align-items:stretch}.ck143-browser-board{border:1px solid var(--line);border-radius:30px;overflow:hidden;background:#fff;box-shadow:0 22px 56px rgba(22,28,36,.07)}.ck143-browser-title{padding:22px 24px;background:var(--dark);color:#fff}.ck143-browser-title span{display:block;color:var(--accent-3);font-size:10px;text-transform:uppercase;letter-spacing:.1em}.ck143-browser-title b{display:block;margin-top:7px;font-size:18px}.ck143-browser-board>a{display:grid;grid-template-columns:92px 1fr auto;gap:16px;align-items:center;padding:18px 24px;border-top:1px solid var(--line);transition:background .25s ease,transform .25s ease}.ck143-browser-board>a:hover{background:#fff7e2;transform:translateX(5px)}.ck143-browser-board>a span{font-size:11px;font-weight:900;color:#a86800}.ck143-browser-board>a b{font-size:14px}.ck143-browser-board>a small{font-size:10px;color:var(--muted)}.ck143-browser-copy{display:flex;flex-direction:column;justify-content:center}.ck143-browser-copy>p{color:var(--muted);font-size:16px;line-height:1.72}.ck143-browser-notes{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px}.ck143-browser-notes article{padding:18px;border-radius:20px;background:#fff9ec;border:1px solid #f0dfb9;transition:transform .25s ease,border-color .25s ease}.ck143-browser-notes article:hover{transform:translateY(-4px);border-color:#efbd52}.ck143-browser-notes b{font-size:13px;line-height:1.45}.ck143-browser-notes p{font-size:11px;line-height:1.6;color:var(--muted);margin:8px 0 0} .ck143-thirdparty{background:#f7f8fa}.ck143-provider-flow{display:grid;grid-template-columns:1fr 72px 1fr 72px 1fr;align-items:center}.ck143-provider-flow article{min-height:220px;padding:24px;border-radius:26px;background:#fff;border:1px solid var(--line);box-shadow:0 16px 40px rgba(22,28,36,.05);transition:transform .28s ease,border-color .28s ease}.ck143-provider-flow article:hover{transform:translateY(-6px);border-color:#efc35c}.ck143-provider-flow article span{width:38px;height:38px;display:grid;place-items:center;border-radius:12px;background:#fff4d1;color:#9c6200;font-weight:900;font-size:11px}.ck143-provider-flow article b{display:block;font-size:18px;margin:24px 0 9px}.ck143-provider-flow article p{color:var(--muted);font-size:13px;line-height:1.65;margin:0}.ck143-provider-flow>i{height:2px;background:linear-gradient(90deg,#f2cc6b,#ff8b2b);position:relative;overflow:hidden}.ck143-provider-flow>i:after{content:"";position:absolute;top:0;left:-45%;width:42%;height:100%;background:#fff;box-shadow:0 0 12px #fff;animation:ck143Flow 2.7s linear infinite}@keyframes ck143Flow{to{left:115%}} .ck143-impact-grid{display:grid;grid-template-columns:.95fr 1.05fr;gap:48px;align-items:stretch}.ck143-impact-photo{position:relative;min-height:520px;border-radius:30px;overflow:hidden;box-shadow:0 24px 62px rgba(22,28,36,.10)}.ck143-impact-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.ck143-impact-photo:hover img{transform:scale(1.025)}.ck143-impact-photo:after{content:"";position:absolute;inset:40% 0 0;background:linear-gradient(transparent,rgba(8,11,15,.8))}.ck143-impact-photo>div{position:absolute;z-index:2;left:24px;right:24px;bottom:24px;color:#fff}.ck143-impact-photo span{display:block;color:var(--accent-3);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.1em}.ck143-impact-photo b{display:block;font-size:24px;line-height:1.2;margin-top:8px;max-width:16ch}.ck143-impact-copy{display:flex;flex-direction:column;justify-content:center}.ck143-impact-list{display:grid;gap:10px;margin-top:20px}.ck143-impact-list article{display:grid;grid-template-columns:160px 1fr;gap:18px;padding:15px 0;border-top:1px solid var(--line);transition:padding-left .25s ease}.ck143-impact-list article:hover{padding-left:7px}.ck143-impact-list span{font-size:10px;font-weight:900;color:#a96b00;text-transform:uppercase;letter-spacing:.08em}.ck143-impact-list b{font-size:13px;line-height:1.5} [data-ck143-reveal] .ck143-rise{opacity:0;transform:translateY(20px);transition:opacity .58s ease,transform .58s cubic-bezier(.2,.7,.2,1)}[data-ck143-reveal].is-visible .ck143-rise{opacity:1;transform:none}[data-ck143-reveal].is-visible .ck143-rise:nth-child(2){transition-delay:.07s}[data-ck143-reveal].is-visible .ck143-rise:nth-child(3){transition-delay:.14s}[data-ck143-reveal].is-visible .ck143-rise:nth-child(4){transition-delay:.21s} @media(max-width:1100px){.ck143-type-grid{grid-template-columns:repeat(2,1fr)}.ck143-purpose-grid,.ck143-browser-grid,.ck143-impact-grid,.ck143-head,.ck143-thirdparty-head{grid-template-columns:1fr}.ck143-provider-flow{grid-template-columns:1fr;gap:12px}.ck143-provider-flow>i{width:2px;height:42px;justify-self:center;background:linear-gradient(180deg,#f2cc6b,#ff8b2b)}.ck143-expand{min-height:540px}} @media(max-width:720px){.blog138-card-foot{align-items:center;gap:10px}.blog138-card-foot .btn{min-height:44px!important;padding-left:17px!important;padding-right:8px!important}.post143-global-banner .global-banner-title{font-size:clamp(31px,8.4vw,42px)!important}.ck143-type-grid,.ck143-browser-notes{grid-template-columns:1fr}.ck143-type-card{min-height:0}.ck143-browser-board>a{grid-template-columns:80px 1fr}.ck143-browser-board>a small{grid-column:2}.ck143-purpose-row{grid-template-columns:1fr}.ck143-purpose-row small{grid-row:auto}.ck143-impact-list article{grid-template-columns:1fr;gap:4px}.ck143-expand{min-height:500px}.ck143-expand-overlay>div{margin:10px 18px 0 0}.ck143-impact-photo{min-height:420px}} @media(prefers-reduced-motion:reduce){[data-ck143-reveal] .ck143-rise{opacity:1!important;transform:none!important;transition:none!important}.ck143-type-card:hover,.ck143-type-card:hover .ck143-type-no,.ck143-purpose-row:hover,.ck143-browser-board>a:hover,.ck143-browser-notes article:hover,.ck143-provider-flow article:hover,.ck143-impact-photo:hover img,.ck143-impact-list article:hover{transform:none!important}.ck143-provider-flow>i:after{animation:none!important}.ck143-expand{transform:none!important;opacity:1!important}} /* V1.43 final blog button correction: exact global button type, weight and foreground. */ .blog138-card-foot a.btn{font-size:14px!important;font-weight:750!important;color:#16181d!important;min-height:44px!important;padding-left:21px!important;padding-right:8px!important} .blog138-card-foot a.btn .btn-label{font-size:inherit!important;font-weight:inherit!important;color:inherit} .blog138-card-foot a.btn .btn-arrow{width:34px!important;height:34px!important} /* ===== Worklix V1.45 exact global blog buttons + animated post banners + Cookies policy ===== */ /* Blog card CTAs intentionally inherit the global .btn / .btn-primary system without local typography or hover colors. */ .blog138-card-foot a.btn{ font-size:14px!important; font-weight:750!important; color:#16181d!important; min-height:44px!important; padding-left:21px!important; padding-right:8px!important; } .blog138-card-foot a.btn .btn-label{ font-size:14px!important; font-weight:750!important; color:currentColor!important; } .blog138-card-foot a.btn:hover .btn-label, .blog138-card-foot a.btn:focus-visible .btn-label{ color:#fff!important; } .blog138-card-foot a.btn .btn-arrow{width:34px!important;height:34px!important} /* Post banners mirror the site-wide animated inner-page banner treatment. */ .post145-global-banner .global-banner-line{display:block!important} .post145-global-banner .typewriter-wrap{ display:inline-flex!important; align-items:flex-end!important; min-width:0!important; background:linear-gradient(90deg,#ffcb31 0%,#ff9c12 42%,#ff6a48 72%,#ffb800 100%)!important; background-size:220% 100%!important; -webkit-background-clip:text!important; background-clip:text!important; -webkit-text-fill-color:transparent!important; animation:globalBannerGradientFlow 3.2s linear infinite!important; } .post145-global-banner .typewriter-word{display:inline-block!important;min-width:1ch} .post145-global-banner .typewriter-cursor{-webkit-text-fill-color:initial!important} /* Cookies policy uses the same global Worklix spacing, typography, surfaces and CTA language. */ .ck145-overview,.ck145-categories,.ck145-controls,.ck145-browser,.ck145-thirdparty,.ck145-details{padding:var(--global-section-space) 0} .ck145-overview h2,.ck145-categories h2,.ck145-controls h2,.ck145-browser h2,.ck145-thirdparty h2{ font-size:var(--inner-section-title-size)!important; line-height:var(--inner-section-title-line)!important; letter-spacing:var(--inner-section-title-track)!important; } .ck145-overview-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:56px;align-items:stretch} .ck145-copy{display:flex;flex-direction:column;justify-content:center} .ck145-copy>p,.ck145-controls-copy>p,.ck145-thirdparty-copy>p{font-size:16px;line-height:1.75;color:var(--muted)} .ck145-policy-meta{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:22px} .ck145-policy-meta>div{padding:16px 18px;border:1px solid var(--line);border-radius:18px;background:var(--surface)} .ck145-policy-meta span,.ck145-policy-meta strong{display:block}.ck145-policy-meta span{font-size:10px;font-weight:900;letter-spacing:.08em;text-transform:uppercase;color:#a96c00}.ck145-policy-meta strong{font-size:13px;margin-top:6px} .ck145-atglance{display:grid;align-content:center;padding:26px;border-radius:28px;background:var(--dark);color:#fff;box-shadow:0 24px 60px rgba(21,25,32,.16)} .ck145-panel-kicker{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:var(--accent-3);margin-bottom:8px} .ck145-atglance>div{padding:18px 0;border-top:1px solid rgba(255,255,255,.12);transition:transform .25s ease} .ck145-atglance>div:hover{transform:translateX(6px)} .ck145-atglance b{display:block;font-size:15px}.ck145-atglance p{margin:6px 0 0;color:#b9c2ce;font-size:12px;line-height:1.6} .ck145-categories{background:#fffaf0} .ck145-section-head{display:grid;grid-template-columns:1fr .78fr;gap:48px;align-items:end;margin-bottom:28px}.ck145-section-head p{margin:0;color:var(--muted);font-size:16px;line-height:1.72} .ck145-table-wrap{overflow:auto;border:1px solid #eadfc9;border-radius:28px;background:#fff;box-shadow:0 18px 48px rgba(29,31,36,.06)} .ck145-policy-table{width:100%;border-collapse:collapse;min-width:760px}.ck145-policy-table th{padding:16px 20px;text-align:left;background:#202630;color:#fff;font-size:10px;text-transform:uppercase;letter-spacing:.09em}.ck145-policy-table td{padding:21px 20px;border-top:1px solid #ece7df;vertical-align:top;color:#5d6672;font-size:13px;line-height:1.62}.ck145-policy-table td:first-child{width:27%}.ck145-policy-table td:last-child{width:15%}.ck145-policy-table strong,.ck145-policy-table td span{display:block}.ck145-policy-table strong{color:var(--text);font-size:14px}.ck145-policy-table td span{font-size:10px;color:#929aa5;margin-top:5px}.ck145-policy-table tbody tr{transition:background .24s ease}.ck145-policy-table tbody tr:hover{background:#fff8e8}.ck145-badge{display:inline-flex!important;width:max-content;padding:7px 10px;border-radius:999px;background:#fff1c7;color:#9a6200!important;font-weight:900!important;text-transform:uppercase;letter-spacing:.07em}.ck145-badge.is-required{background:#edf8f1;color:#218357!important} .ck145-controls{background:#111720;color:#fff;overflow:hidden}.ck145-controls-grid{display:grid;grid-template-columns:.92fr 1.08fr;gap:54px;align-items:stretch}.ck145-controls-copy{display:flex;flex-direction:column;justify-content:center}.ck145-controls-copy h2{color:#fff}.ck145-controls-copy>p{color:#bdc5d0}.ck145-control-list{display:grid;gap:10px;margin-top:24px}.ck145-control-list article{display:grid;grid-template-columns:42px 1fr;gap:14px;padding:14px 0;border-top:1px solid rgba(255,255,255,.12);transition:padding-left .25s ease}.ck145-control-list article:hover{padding-left:7px}.ck145-control-list article>span{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:rgba(255,201,46,.12);color:var(--accent-3);font-size:10px;font-weight:900}.ck145-control-list b{font-size:14px}.ck145-control-list p{margin:5px 0 0;color:#aeb8c5;font-size:12px;line-height:1.55}.ck145-controls-photo{position:relative;min-height:540px;border-radius:30px;overflow:hidden;margin:0;box-shadow:0 28px 70px rgba(0,0,0,.25)}.ck145-controls-photo img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease}.ck145-controls-photo:hover img{transform:scale(1.025)}.ck145-controls-photo:after{content:"";position:absolute;inset:35% 0 0;background:linear-gradient(transparent,rgba(5,8,12,.86))}.ck145-controls-photo figcaption{position:absolute;z-index:2;left:24px;right:24px;bottom:24px}.ck145-controls-photo small{display:block;color:var(--accent-3);font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.09em}.ck145-controls-photo strong{display:block;color:#fff;font-size:22px;line-height:1.28;max-width:22ch;margin-top:8px} .ck145-browser-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.ck145-browser-grid a{min-height:180px;padding:22px;border:1px solid var(--line);border-radius:24px;background:#fff;box-shadow:0 14px 36px rgba(22,28,36,.05);display:flex;flex-direction:column;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease}.ck145-browser-grid a:hover{transform:translateY(-6px);border-color:#efbd52;box-shadow:0 20px 45px rgba(22,28,36,.09)}.ck145-browser-grid span{font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#a76a00}.ck145-browser-grid b{font-size:18px;line-height:1.25;margin:22px 0 0}.ck145-browser-grid small{margin-top:auto;color:var(--muted);font-size:11px} .ck145-thirdparty{background:#f7f8fa}.ck145-thirdparty-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:56px;align-items:center}.ck145-thirdparty-copy .btn{margin-top:12px}.ck145-provider-map{display:grid;grid-template-columns:1fr 48px 1fr 48px 1fr;align-items:center}.ck145-provider-node{min-height:210px;padding:22px;border-radius:24px;background:#fff;border:1px solid var(--line);display:flex;flex-direction:column;justify-content:flex-end;box-shadow:0 14px 38px rgba(22,28,36,.05);transition:transform .28s ease,border-color .28s ease}.ck145-provider-node:hover{transform:translateY(-5px);border-color:#edc35d}.ck145-provider-node.primary{background:linear-gradient(145deg,#fff7da,#fff)}.ck145-provider-node span{font-size:10px;font-weight:900;color:#a76b00}.ck145-provider-node b{font-size:17px;margin-top:auto}.ck145-provider-node small{margin-top:7px;color:var(--muted);font-size:11px;line-height:1.45}.ck145-provider-map>i{height:2px;background:linear-gradient(90deg,#f2ca64,#ff8b2a);position:relative;overflow:hidden}.ck145-provider-map>i:after{content:"";position:absolute;left:-45%;top:0;width:40%;height:100%;background:#fff;box-shadow:0 0 12px #fff;animation:ck145Flow 2.8s linear infinite}@keyframes ck145Flow{to{left:115%}} .ck145-details-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.ck145-details-card{padding:24px;border-radius:24px;border:1px solid #eadfca;background:#fffaf0;transition:transform .28s ease,border-color .28s ease}.ck145-details-card:hover{transform:translateY(-5px);border-color:#efc45f}.ck145-details-card>span{font-size:10px;font-weight:900;text-transform:uppercase;letter-spacing:.1em;color:#a96b00}.ck145-details-card h3{font-size:var(--inner-card-title-size);line-height:1.25;margin:14px 0 10px}.ck145-details-card p{font-size:13px;line-height:1.65;color:var(--muted);margin:0}.ck145-details-card a{display:inline-block;margin-top:15px;font-size:12px;font-weight:850;color:#9c6400} [data-ck145-reveal] .ck145-rise{opacity:0;transform:translateY(20px);transition:opacity .58s ease,transform .58s cubic-bezier(.2,.7,.2,1)}[data-ck145-reveal].is-visible .ck145-rise{opacity:1;transform:none}[data-ck145-reveal].is-visible .ck145-rise:nth-child(2){transition-delay:.08s} @media(max-width:1100px){.ck145-overview-grid,.ck145-controls-grid,.ck145-thirdparty-grid,.ck145-section-head{grid-template-columns:1fr}.ck145-browser-grid{grid-template-columns:repeat(2,1fr)}.ck145-provider-map{grid-template-columns:1fr;gap:12px}.ck145-provider-map>i{width:2px;height:38px;justify-self:center;background:linear-gradient(180deg,#f2ca64,#ff8b2a)}.ck145-controls-photo{min-height:480px}} @media(max-width:720px){.post145-global-banner .global-banner-title{font-size:clamp(31px,8.4vw,42px)!important}.post145-global-banner .global-banner-line{white-space:normal!important}.ck145-policy-meta,.ck145-browser-grid,.ck145-details-grid{grid-template-columns:1fr}.ck145-controls-photo{min-height:410px}.ck145-policy-table{min-width:680px}} @media(prefers-reduced-motion:reduce){.post145-global-banner .typewriter-wrap{animation:none!important}[data-ck145-reveal] .ck145-rise{opacity:1!important;transform:none!important;transition:none!important}.ck145-atglance>div:hover,.ck145-policy-table tbody tr:hover,.ck145-control-list article:hover,.ck145-controls-photo:hover img,.ck145-browser-grid a:hover,.ck145-provider-node:hover,.ck145-details-card:hover{transform:none!important}.ck145-provider-map>i:after{animation:none!important}} /* ===== Worklix V1.46 Cookies — single-policy layout ===== */ .ck146-policy{padding:var(--global-section-space) 0;background:#fff} .ck146-policy-shell{display:grid;grid-template-columns:260px minmax(0,1fr);gap:72px;align-items:start} .ck146-toc{position:sticky;top:112px;padding:24px 22px;border:1px solid var(--line);border-radius:24px;background:#fffaf0;box-shadow:0 14px 38px rgba(28,32,39,.05)} .ck146-toc-kicker{display:block;font-size:10px;font-weight:900;letter-spacing:.1em;text-transform:uppercase;color:#a56a00;margin-bottom:6px}.ck146-toc>strong{font-size:18px}.ck146-toc nav{display:grid;gap:2px;margin-top:18px}.ck146-toc nav a{padding:10px 0;border-bottom:1px solid #eadfca;color:var(--muted);font-size:12px;line-height:1.4;transition:color .2s ease,padding-left .2s ease}.ck146-toc nav a:hover{color:var(--text);padding-left:5px}.ck146-toc-note{margin-top:20px;padding-top:16px;border-top:1px solid #e5d7bd}.ck146-toc-note span,.ck146-toc-note b{display:block}.ck146-toc-note span{font-size:10px;text-transform:uppercase;letter-spacing:.08em;color:#a56a00;font-weight:900}.ck146-toc-note b{font-size:12px;margin-top:5px} .ck146-document{max-width:860px}.ck146-doc-intro{padding-bottom:34px;border-bottom:1px solid var(--line)}.ck146-doc-intro h2{font-size:var(--inner-section-title-size)!important;line-height:var(--inner-section-title-line)!important;letter-spacing:var(--inner-section-title-track)!important;margin:10px 0 18px}.ck146-doc-intro>p,.ck146-doc-block>p{font-size:16px;line-height:1.78;color:var(--muted);max-width:78ch}.ck146-category-list{display:flex;flex-wrap:wrap;gap:10px;margin:24px 0}.ck146-category-list span{padding:9px 12px;border-radius:999px;background:#fff3cf;border:1px solid #efd38c;color:#8e5b00;font-size:11px;font-weight:850}.ck146-note{padding:18px 20px;border-left:3px solid var(--accent);background:#fffaf0;border-radius:0 16px 16px 0} .ck146-doc-block{padding:38px 0;border-bottom:1px solid var(--line)}.ck146-doc-block:last-child{border-bottom:0}.ck146-doc-block h3{font-size:clamp(24px,2.5vw,34px);line-height:1.22;margin:0 0 16px;color:var(--text)}.ck146-doc-block p+p{margin-top:15px} .ck146-cookie-table-wrap{overflow:auto;margin-top:24px;border:1px solid var(--line);border-radius:20px}.ck146-cookie-table{width:100%;border-collapse:collapse;min-width:720px}.ck146-cookie-table th{background:var(--dark);color:#fff;text-align:left;padding:15px 18px;font-size:10px;letter-spacing:.08em;text-transform:uppercase}.ck146-cookie-table td{padding:19px 18px;border-top:1px solid var(--line);font-size:13px;line-height:1.65;color:var(--muted);vertical-align:top}.ck146-cookie-table td:first-child{width:25%}.ck146-cookie-table strong{display:block;color:var(--text);font-size:14px}.ck146-cookie-table small{display:inline-block;margin-top:5px;padding:5px 8px;border-radius:999px;background:#fff3cf;color:#926000;font-weight:800}.ck146-cookie-table tbody tr{transition:background .2s ease}.ck146-cookie-table tbody tr:hover{background:#fffaf0} .ck146-browser-links{margin:20px 0 0;padding:0;list-style:none;display:grid;gap:8px}.ck146-browser-links a{display:inline-flex;align-items:center;gap:8px;font-size:13px;font-weight:800;color:#9a6200}.ck146-browser-links a:after{content:'↗';transition:transform .2s ease}.ck146-browser-links a:hover:after{transform:translate(2px,-2px)}.ck146-callout{margin-top:24px;padding:20px 22px;border-radius:18px;background:var(--dark);color:#fff}.ck146-callout b{color:var(--accent-3)}.ck146-callout p{margin:6px 0 0;color:#c3cbd5;font-size:13px;line-height:1.65}.ck146-contact-block .btn{margin-top:10px} @media(max-width:960px){.ck146-policy-shell{grid-template-columns:1fr;gap:34px}.ck146-toc{position:static}.ck146-toc nav{grid-template-columns:repeat(2,minmax(0,1fr));column-gap:18px}} @media(max-width:620px){.ck146-toc nav{grid-template-columns:1fr}.ck146-doc-block{padding:30px 0}.ck146-doc-intro>p,.ck146-doc-block>p{font-size:15px}.ck146-cookie-table{min-width:660px}} @media(prefers-reduced-motion:reduce){.ck146-toc nav a,.ck146-browser-links a:after,.ck146-cookie-table tbody tr{transition:none!important}} /* ===== Worklix V1.51 Developer Help Center ===== */ .dev151-help{background:#fff;padding:clamp(64px,7vw,96px) 0;} .dev151-help-shell{max-width:1060px;margin:0 auto;} .dev151-help-topbar{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:28px;border-bottom:1px solid rgba(20,20,20,.09);} .dev151-help-brand{font-size:18px;font-weight:800;color:var(--text,#161616);text-decoration:none;letter-spacing:-.02em;} .dev151-home-link{display:inline-flex;align-items:center;gap:7px;font-size:14px;font-weight:700;color:var(--text,#161616);text-decoration:none;transition:transform .25s ease,color .25s ease;} .dev151-home-link:hover{color:var(--accent-2,#ff8a1f);transform:translateY(-1px);} .dev151-search-wrap{position:relative;margin:34px 0 28px;} .dev151-search-wrap input{width:100%;height:64px;padding:0 24px 0 56px;border:1px solid rgba(20,20,20,.14);border-radius:14px;background:#fff;color:#181818;font:inherit;font-size:16px;outline:none;box-shadow:0 12px 36px rgba(20,20,20,.04);transition:border-color .25s ease,box-shadow .25s ease,transform .25s ease;} .dev151-search-wrap input:focus{border-color:var(--accent,#ffb800);box-shadow:0 0 0 4px rgba(255,184,0,.13),0 16px 40px rgba(20,20,20,.06);} .dev151-search-icon{position:absolute;left:20px;top:50%;width:22px;height:22px;transform:translateY(-50%);color:#676767;pointer-events:none;} .dev151-search-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;} .dev151-breadcrumbs{display:flex;align-items:center;gap:9px;flex-wrap:wrap;color:#777;font-size:13px;margin:0 0 24px;} .dev151-breadcrumbs a{color:#555;text-decoration:none;transition:color .2s ease;} .dev151-breadcrumbs a:hover{color:var(--accent-2,#ff8a1f);} .dev151-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:28px;margin-bottom:18px;} .dev151-section-head h2{margin:0;font-size:clamp(32px,4vw,48px);line-height:1;letter-spacing:-.04em;color:#161616;} .dev151-section-head p{max-width:560px;margin:0;color:#666;font-size:15px;line-height:1.7;} .dev151-article-list{border-top:1px solid rgba(20,20,20,.11);} .dev151-article-row{display:flex;align-items:center;justify-content:space-between;gap:28px;padding:21px 2px;border-bottom:1px solid rgba(20,20,20,.11);text-decoration:none;color:#171717;transition:padding .25s ease,background .25s ease,color .25s ease;} .dev151-article-row:hover{padding-left:14px;padding-right:10px;background:linear-gradient(90deg,rgba(255,184,0,.08),rgba(255,138,31,.03));color:#111;} .dev151-row-copy{display:grid;gap:7px;} .dev151-row-copy strong{font-size:17px;line-height:1.3;font-weight:760;letter-spacing:-.015em;} .dev151-row-copy small{font-size:14px;line-height:1.55;color:#707070;max-width:760px;} .dev151-row-arrow{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;flex:0 0 auto;border:1px solid rgba(20,20,20,.12);font-size:18px;transition:transform .25s ease,background .25s ease,color .25s ease,border-color .25s ease;} .dev151-article-row:hover .dev151-row-arrow{transform:translateX(4px);background:var(--accent,#ffb800);border-color:var(--accent,#ffb800);color:#111;} .dev151-empty{margin:28px 0 0;padding:18px 20px;border-radius:12px;background:#f7f7f5;color:#666;} .dev151-docs-masthead{background:#fff;border-bottom:1px solid rgba(20,20,20,.08);padding-top:18px;} .dev151-inner-shell{max-width:1180px;} .dev151-inner-search{max-width:760px;margin:28px 0 30px;} .dev151-doc-content{background:#fff;padding:56px 0 clamp(78px,8vw,110px);} .dev151-doc-grid{display:grid;grid-template-columns:260px minmax(0,760px);gap:72px;align-items:start;max-width:1180px;} .dev151-doc-sidebar{position:sticky;top:110px;display:grid;gap:20px;} .dev151-back{font-size:13px;font-weight:750;text-decoration:none;color:#555;transition:color .2s ease;} .dev151-back:hover{color:var(--accent-2,#ff8a1f);} .dev151-side-title{font-size:12px;text-transform:uppercase;letter-spacing:.13em;font-weight:800;color:#8b8b8b;} .dev151-doc-sidebar nav{display:grid;border-top:1px solid rgba(20,20,20,.09);} .dev151-doc-sidebar nav a{padding:12px 0;border-bottom:1px solid rgba(20,20,20,.08);font-size:13px;line-height:1.45;color:#5e5e5e;text-decoration:none;transition:color .2s ease,padding-left .2s ease;} .dev151-doc-sidebar nav a:hover,.dev151-doc-sidebar nav a.is-active{color:#111;padding-left:8px;} .dev151-doc-sidebar nav a.is-active{font-weight:750;box-shadow:inset 3px 0 0 var(--accent,#ffb800);padding-left:10px;} .dev151-doc-article{min-width:0;} .dev151-doc-article>.dev151-breadcrumbs{margin-bottom:24px;} .dev151-doc-article h1{font-size:clamp(38px,5vw,60px);line-height:1.03;letter-spacing:-.045em;margin:0 0 20px;color:#171717;max-width:820px;} .dev151-doc-lede{font-size:18px;line-height:1.72;color:#565656;margin:0 0 28px;max-width:760px;} .dev151-note{padding:20px 22px;border:1px solid rgba(255,138,31,.24);background:linear-gradient(135deg,rgba(255,184,0,.08),rgba(255,138,31,.05));border-radius:14px;margin:0 0 42px;} .dev151-note strong{display:block;font-size:15px;margin-bottom:5px;color:#181818;} .dev151-note p{margin:0!important;font-size:14px!important;color:#656565!important;} .dev151-doc-section{padding:34px 0;border-top:1px solid rgba(20,20,20,.1);} .dev151-doc-section h2{font-size:clamp(26px,3vw,36px);line-height:1.1;letter-spacing:-.035em;margin:0 0 14px;color:#171717;} .dev151-doc-section p{font-size:16px;line-height:1.75;color:#555;margin:0 0 18px;} .dev151-doc-section ul{margin:16px 0 0;padding-left:22px;color:#555;display:grid;gap:9px;} .dev151-doc-section li{line-height:1.65;} .dev151-doc-section pre{position:relative;margin:20px 0 0;padding:22px 24px;border-radius:14px;background:#171717;color:#f8f8f8;overflow:auto;box-shadow:0 20px 50px rgba(0,0,0,.08);} .dev151-doc-section code{font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:13px;line-height:1.7;white-space:pre;} .dev151-helpful{margin-top:18px;padding-top:30px;border-top:1px solid rgba(20,20,20,.1);display:grid;justify-items:start;gap:13px;} .dev151-helpful strong{font-size:15px;} .dev151-helpful>div{display:flex;gap:10px;} .dev151-helpful button{min-width:76px;height:40px;border-radius:999px;border:1px solid rgba(20,20,20,.16);background:#fff;color:#222;font:inherit;font-weight:700;cursor:pointer;transition:background .2s ease,border-color .2s ease,transform .2s ease;} .dev151-helpful button:hover,.dev151-helpful button.is-selected{background:var(--accent,#ffb800);border-color:var(--accent,#ffb800);transform:translateY(-1px);} .dev151-helpful small{color:#777;min-height:20px;} @media (max-width:900px){ .dev151-section-head{align-items:flex-start;flex-direction:column;gap:10px;} .dev151-doc-grid{grid-template-columns:1fr;gap:36px;} .dev151-doc-sidebar{position:relative;top:auto;border:1px solid rgba(20,20,20,.09);border-radius:14px;padding:18px 20px;} .dev151-doc-sidebar nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;} } @media (max-width:640px){ .dev151-help{padding:52px 0 64px;} .dev151-help-topbar{align-items:flex-start;flex-direction:column;gap:12px;padding-bottom:20px;} .dev151-search-wrap input{height:58px;padding-left:50px;font-size:15px;} .dev151-search-icon{left:17px;} .dev151-article-row{padding:18px 0;gap:16px;} .dev151-row-copy strong{font-size:16px;} .dev151-row-copy small{font-size:13px;} .dev151-doc-content{padding-top:38px;} .dev151-doc-sidebar nav{grid-template-columns:1fr;} .dev151-doc-article h1{font-size:clamp(34px,11vw,48px);} .dev151-doc-lede{font-size:16px;} .dev151-doc-section pre{padding:18px;font-size:12px;} } @media (prefers-reduced-motion:reduce){ .dev151-home-link,.dev151-article-row,.dev151-row-arrow,.dev151-doc-sidebar nav a,.dev151-helpful button,.dev151-search-wrap input{transition:none!important;} } /* ===== Worklix V1.52 Help Center ===== */ .hc152-hub{padding:68px 0 86px;background:#fff;} .hc152-hub-inner,.hc152-doc-container{max-width:1060px;} .hc152-local-head,.hc152-bar-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:26px;} .hc152-brand{font-size:20px;font-weight:800;color:#171717;text-decoration:none;letter-spacing:-.02em;} .hc152-home{font-size:14px;font-weight:700;color:#555;text-decoration:none;transition:color .2s ease;} .hc152-home:hover{color:var(--accent,#ffb800);} .hc152-hero-search{padding:28px 0 48px;border-bottom:1px solid rgba(20,20,20,.1);} .hc152-hero-search h2{font-size:var(--inner-section-title-size);line-height:var(--inner-section-title-line);letter-spacing:var(--inner-section-title-track);margin:0 0 12px;} .hc152-hero-search>p{margin:0 0 26px;color:#666;font-size:17px;line-height:1.7;} .hc152-search{position:relative;display:block;} .hc152-search input{width:100%;height:58px;border:1px solid rgba(20,20,20,.15);border-radius:10px;background:#fff;padding:0 104px 0 52px;font:inherit;font-size:15px;outline:none;box-shadow:0 8px 30px rgba(0,0,0,.03);transition:border-color .2s ease,box-shadow .2s ease;} .hc152-search-large input{height:68px;font-size:17px;border-radius:12px;} .hc152-search input:focus{border-color:var(--accent,#ffb800);box-shadow:0 0 0 4px rgba(255,184,0,.12),0 16px 34px rgba(0,0,0,.05);} .hc152-search-icon{position:absolute;left:18px;top:50%;transform:translateY(-50%);width:22px;height:22px;z-index:2;color:#666;} .hc152-search-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;} .hc152-search-key{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:12px;font-weight:800;color:#7a7a7a;border:1px solid rgba(20,20,20,.12);border-radius:6px;padding:5px 8px;background:#f7f7f7;} .hc152-search-results{position:absolute;z-index:25;top:calc(100% + 8px);left:0;right:0;max-height:390px;overflow:auto;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:12px;box-shadow:0 22px 56px rgba(0,0,0,.13);padding:8px;} .hc152-result{display:block;padding:13px 14px;border-radius:8px;text-decoration:none;color:#222;} .hc152-result:hover,.hc152-result.is-active{background:#fff7dd;} .hc152-result strong{display:block;font-size:14px;margin-bottom:3px;} .hc152-result small{display:block;color:#777;font-size:12px;line-height:1.45;} .hc152-result em{display:block;color:#a26600;font-style:normal;font-size:11px;font-weight:800;margin-top:5px;} .hc152-section-head{padding:42px 0 22px;} .hc152-section-head h2{margin:0;font-size:30px;letter-spacing:-.03em;} .hc152-categories{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:54px;border-top:1px solid rgba(20,20,20,.1);} .hc152-cat{display:grid;grid-template-columns:44px 1fr auto;gap:18px;align-items:start;padding:24px 0;border-bottom:1px solid rgba(20,20,20,.1);text-decoration:none;color:#1b1b1b;transition:transform .2s ease,color .2s ease;} .hc152-cat:hover{transform:translateX(5px);color:#a26600;} .hc152-cat-icon{width:42px;height:42px;border-radius:10px;background:linear-gradient(135deg,#fff3b8,#ffd15d);display:grid;place-items:center;font-weight:900;color:#6f4b00;} .hc152-cat h3{font-size:19px;margin:0 0 6px;letter-spacing:-.02em;} .hc152-cat p{margin:0;color:#6b6b6b;font-size:14px;line-height:1.55;} .hc152-cat-arrow{font-size:20px;transition:transform .2s ease;} .hc152-cat:hover .hc152-cat-arrow{transform:translateX(4px);} .hc152-promoted-block{padding-top:10px;} .hc152-promoted-list{border-top:1px solid rgba(20,20,20,.1);} .hc152-promoted{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0;border-bottom:1px solid rgba(20,20,20,.1);text-decoration:none;color:#222;font-weight:700;} .hc152-promoted:hover{color:#a26600;} .hc152-bar{padding:30px 0 34px;background:#fff;border-bottom:1px solid rgba(20,20,20,.1);} .hc152-bar-search{max-width:1060px;} .hc152-category-page,.hc152-article-page{padding:50px 0 78px;background:#fff;} .hc152-breadcrumb{display:flex;flex-wrap:wrap;align-items:center;gap:9px;font-size:13px;color:#8a8a8a;margin-bottom:32px;} .hc152-breadcrumb a{color:#656565;text-decoration:none;} .hc152-breadcrumb a:hover{color:#a26600;} .hc152-category-head{max-width:760px;margin-bottom:42px;} .hc152-category-head h1,.hc152-article h1{font-size:clamp(38px,5vw,58px);line-height:1.04;letter-spacing:-.055em;margin:0 0 16px;color:#171717;} .hc152-category-head p{font-size:18px;line-height:1.7;color:#666;margin:0;} .hc152-section-panel{max-width:820px;} .hc152-section-panel h2{font-size:24px;margin:0 0 8px;} .hc152-article-links{border-top:1px solid rgba(20,20,20,.1);} .hc152-article-link{display:flex;justify-content:space-between;gap:24px;padding:21px 0;border-bottom:1px solid rgba(20,20,20,.1);text-decoration:none;color:#222;} .hc152-article-link strong{display:block;font-size:16px;margin-bottom:5px;} .hc152-article-link small{display:block;color:#757575;line-height:1.55;font-size:13px;} .hc152-article-link:hover{color:#a26600;} .hc152-article-link b{transition:transform .2s ease;} .hc152-article-link:hover b{transform:translateX(4px);} .hc152-article-grid{max-width:1060px;display:grid;grid-template-columns:minmax(0,720px) 250px;gap:72px;align-items:start;} .hc152-article-lede{font-size:18px;line-height:1.75;color:#5f5f5f;margin:0 0 28px;} .hc152-article-note{background:#fff8df;border:1px solid rgba(255,184,0,.34);border-radius:12px;padding:20px 22px;margin:0 0 28px;} .hc152-article-note strong{display:block;margin-bottom:6px;} .hc152-article-note p{margin:0;color:#604f25;line-height:1.6;} .hc152-article-section{padding:30px 0;border-top:1px solid rgba(20,20,20,.1);scroll-margin-top:120px;} .hc152-article-section h2{font-size:30px;line-height:1.14;letter-spacing:-.035em;margin:0 0 13px;} .hc152-article-section p,.hc152-article-section li{color:#5e5e5e;font-size:16px;line-height:1.75;} .hc152-article-section ul{padding-left:22px;display:grid;gap:7px;} .hc152-article-side{position:sticky;top:112px;display:grid;gap:22px;} .hc152-article-side>div{border-left:2px solid rgba(20,20,20,.1);padding-left:18px;display:grid;gap:10px;} .hc152-article-side span{font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:900;color:#8a8a8a;margin-bottom:5px;} .hc152-article-side a{text-decoration:none;color:#5d5d5d;font-size:13px;line-height:1.4;} .hc152-article-side a:hover{color:#a26600;} .hc152-side-category{border:1px solid rgba(20,20,20,.1);border-radius:10px;padding:14px 15px!important;display:flex;justify-content:space-between;gap:10px;background:#fafafa;} .hc152-helpful{padding-top:28px;border-top:1px solid rgba(20,20,20,.1);display:grid;gap:12px;} .hc152-helpful>div{display:flex;gap:9px;} .hc152-helpful button{min-width:70px;height:38px;border-radius:999px;border:1px solid rgba(20,20,20,.14);background:#fff;font:inherit;font-weight:800;cursor:pointer;} .hc152-helpful button:hover,.hc152-helpful button.is-selected{background:var(--accent,#ffb800);border-color:var(--accent,#ffb800);} .hc152-helpful small{min-height:18px;color:#777;} @media(max-width:900px){.hc152-categories{grid-template-columns:1fr;column-gap:0}.hc152-article-grid{grid-template-columns:1fr;gap:32px}.hc152-article-side{position:relative;top:auto;order:-1}.hc152-article-side>div{grid-template-columns:repeat(2,minmax(0,1fr));border-left:0;border:1px solid rgba(20,20,20,.1);border-radius:10px;padding:18px}.hc152-article-side span{grid-column:1/-1}} @media(max-width:640px){.hc152-hub{padding:44px 0 64px}.hc152-local-head,.hc152-bar-inner{align-items:flex-start}.hc152-search-key{display:none}.hc152-search input{padding-right:18px}.hc152-cat{grid-template-columns:38px 1fr auto;gap:14px}.hc152-cat-icon{width:38px;height:38px}.hc152-article-side>div{grid-template-columns:1fr}.hc152-category-head h1,.hc152-article h1{font-size:clamp(34px,12vw,46px)}.hc152-article-grid{gap:24px}} @media(prefers-reduced-motion:reduce){.hc152-home,.hc152-search input,.hc152-cat,.hc152-cat-arrow,.hc152-article-link b{transition:none!important}} /* ===== Worklix V1.53 Guides / Usage & Deployment center ===== */ .gd153-hub{background:#fff;padding:clamp(58px,7vw,92px) 0 clamp(78px,8vw,110px)} .gd153-shell{max-width:1040px}.gd153-topbar,.gd153-docbar-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;padding-bottom:24px;border-bottom:1px solid rgba(20,20,20,.1)} .gd153-brand{font-size:18px;font-weight:800;letter-spacing:-.02em;color:#171717;text-decoration:none}.gd153-home{font-size:14px;font-weight:700;color:#333;text-decoration:none;transition:color .22s ease,transform .22s ease}.gd153-home:hover{color:var(--accent-2,#ff8a1f);transform:translateY(-1px)} .gd153-search-block{padding:34px 0 18px}.gd153-breadcrumb{display:flex;gap:8px;flex-wrap:wrap;align-items:center;font-size:13px;color:#777;margin-bottom:22px}.gd153-breadcrumb a{color:#555;text-decoration:none}.gd153-breadcrumb a:hover{color:var(--accent-2,#ff8a1f)} .gd153-search-block h2{font-size:clamp(34px,5vw,54px);line-height:1.03;letter-spacing:-.045em;margin:0 0 12px;color:#171717}.gd153-search-block>p{font-size:16px;line-height:1.7;color:#656565;margin:0 0 28px;max-width:680px} .gd153-search{position:relative;display:block}.gd153-search input{width:100%;height:62px;padding:0 84px 0 54px;border:1px solid rgba(20,20,20,.15);border-radius:14px;background:#fff;color:#171717;font:inherit;font-size:16px;outline:none;box-shadow:0 12px 34px rgba(20,20,20,.04);transition:border-color .22s ease,box-shadow .22s ease}.gd153-search input:focus{border-color:var(--accent,#ffb800);box-shadow:0 0 0 4px rgba(255,184,0,.12),0 15px 36px rgba(20,20,20,.05)} .gd153-search-icon{position:absolute;left:18px;top:50%;width:22px;height:22px;transform:translateY(-50%);color:#666;z-index:2}.gd153-search-icon svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.gd153-search-key{position:absolute;right:16px;top:50%;transform:translateY(-50%);font-size:11px;font-weight:800;color:#888;border:1px solid rgba(20,20,20,.11);border-radius:7px;padding:5px 7px;background:#fafafa}.gd153-search-results{position:absolute;left:0;right:0;top:calc(100% + 8px);z-index:40;background:#fff;border:1px solid rgba(20,20,20,.12);border-radius:14px;box-shadow:0 22px 60px rgba(20,20,20,.12);max-height:390px;overflow:auto;padding:8px}.gd153-result{display:block;padding:12px 14px;border-radius:10px;text-decoration:none;color:#171717}.gd153-result:hover{background:rgba(255,184,0,.09)}.gd153-result strong{display:block;font-size:14px}.gd153-result small{display:block;margin-top:4px;color:#777;font-size:12px;line-height:1.45} .gd153-count{font-size:13px;color:#777;margin:12px 0 24px}.gd153-group{border:1px solid rgba(20,20,20,.1);border-radius:18px;padding:0 28px;margin-top:24px;background:#fff;box-shadow:0 16px 44px rgba(20,20,20,.035)}.gd153-group-head{display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0 20px;border-bottom:1px solid rgba(20,20,20,.1)}.gd153-group-head>div{display:flex;align-items:center;gap:13px}.gd153-group-head span{width:36px;height:36px;border-radius:50%;display:grid;place-items:center;background:rgba(255,184,0,.14);font-size:11px;font-weight:850}.gd153-group-head h2{margin:0;font-size:22px;line-height:1.2;letter-spacing:-.02em}.gd153-group-head small{font-size:12px;color:#888}.gd153-article-list{display:grid}.gd153-article-link{display:flex;align-items:center;justify-content:space-between;gap:22px;padding:18px 2px;border-bottom:1px solid rgba(20,20,20,.085);text-decoration:none;color:#171717;transition:padding .22s ease,background .22s ease}.gd153-article-link:last-child{border-bottom:0}.gd153-article-link:hover{padding-left:12px;padding-right:8px;background:linear-gradient(90deg,rgba(255,184,0,.075),transparent)}.gd153-article-link span{display:grid;gap:5px}.gd153-article-link strong{font-size:16px;line-height:1.35}.gd153-article-link small{font-size:13px;line-height:1.5;color:#777}.gd153-article-link b{font-size:18px;transition:transform .22s ease}.gd153-article-link:hover b{transform:translateX(4px)}.gd153-empty{margin-top:24px;padding:18px;border-radius:12px;background:#f7f7f4;color:#666} .gd153-docbar{background:#fff;border-bottom:1px solid rgba(20,20,20,.08);padding-top:18px}.gd153-docbar-inner,.gd153-docbar-search{max-width:1160px}.gd153-docbar-search{padding-top:22px;padding-bottom:24px}.gd153-docbar-search .gd153-search{max-width:760px}.gd153-doc-wrap{background:#fff;padding:54px 0 clamp(78px,8vw,110px)}.gd153-doc-grid{max-width:1160px;display:grid;grid-template-columns:250px minmax(0,760px);gap:72px;align-items:start}.gd153-doc-side{position:sticky;top:106px}.gd153-back{display:block;font-size:13px;font-weight:750;color:#555;text-decoration:none;margin-bottom:24px}.gd153-back:hover{color:var(--accent-2,#ff8a1f)}.gd153-side-label{font-size:11px;font-weight:850;letter-spacing:.12em;text-transform:uppercase;color:#8b8b8b;margin-bottom:10px}.gd153-doc-side nav{border-top:1px solid rgba(20,20,20,.09)}.gd153-doc-side nav a{display:block;padding:11px 0;border-bottom:1px solid rgba(20,20,20,.08);font-size:13px;line-height:1.45;color:#666;text-decoration:none;transition:color .2s ease,padding-left .2s ease}.gd153-doc-side nav a:hover{color:#171717;padding-left:7px}.gd153-doc-article h1{font-size:clamp(38px,5vw,58px);line-height:1.04;letter-spacing:-.045em;margin:0 0 18px;color:#171717}.gd153-doc-lede{font-size:18px;line-height:1.72;color:#565656;margin:0 0 12px}.gd153-updated{font-size:12px;color:#8a8a8a;margin-bottom:34px}.gd153-doc-section{padding:32px 0;border-top:1px solid rgba(20,20,20,.1)}.gd153-doc-section h2{font-size:clamp(25px,3vw,34px);line-height:1.12;letter-spacing:-.03em;margin:0 0 13px;color:#171717}.gd153-doc-section p{font-size:16px;line-height:1.78;color:#555;margin:0}.gd153-doc-section ul{margin:17px 0 0;padding-left:22px;display:grid;gap:8px;color:#555}.gd153-doc-section li{line-height:1.6}.gd153-related{display:grid;gap:10px;padding:26px 0;border-top:1px solid rgba(20,20,20,.1)}.gd153-related a{display:flex;justify-content:space-between;gap:16px;color:#171717;text-decoration:none;padding:14px 16px;border-radius:12px;background:rgba(255,184,0,.08);font-weight:700}.gd153-related a:hover{background:rgba(255,184,0,.14)}.gd153-helpful{padding-top:26px;border-top:1px solid rgba(20,20,20,.1);display:grid;gap:12px;justify-items:start}.gd153-helpful>div{display:flex;gap:9px}.gd153-helpful button{height:40px;min-width:74px;border-radius:999px;border:1px solid rgba(20,20,20,.15);background:#fff;font:inherit;font-weight:750;cursor:pointer}.gd153-helpful button:hover,.gd153-helpful button.is-selected{background:var(--accent,#ffb800);border-color:var(--accent,#ffb800)}.gd153-helpful small{color:#777;min-height:18px} @media(max-width:900px){.gd153-doc-grid{grid-template-columns:1fr;gap:34px}.gd153-doc-side{position:relative;top:auto;padding:18px;border:1px solid rgba(20,20,20,.1);border-radius:14px}.gd153-doc-side nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}} @media(max-width:640px){.gd153-topbar,.gd153-docbar-inner{align-items:flex-start;flex-direction:column;gap:10px}.gd153-group{padding:0 18px}.gd153-group-head{align-items:flex-start}.gd153-group-head small{white-space:nowrap}.gd153-search input{height:58px;padding-right:18px}.gd153-search-key{display:none}.gd153-doc-wrap{padding-top:38px}.gd153-doc-side nav{grid-template-columns:1fr}.gd153-doc-article h1{font-size:clamp(34px,10vw,46px)}} @media(prefers-reduced-motion:reduce){.gd153-home,.gd153-search input,.gd153-article-link,.gd153-article-link b,.gd153-doc-side nav a,.gd153-helpful button{transition:none!important}} /* ===== Worklix V1.54 Product Updates system ===== */ .pu154-updates{background:#fff}.pu154-section-head{max-width:760px;margin:0 0 42px}.pu154-section-head h2{font-size:var(--inner-section-title-size);line-height:var(--inner-section-title-line);letter-spacing:var(--inner-section-title-track);margin:10px 0 14px}.pu154-section-head p{max-width:680px;margin:0;color:#60646d;line-height:1.75}.pu154-center{text-align:center;margin-left:auto;margin-right:auto}.pu154-center p{margin-left:auto;margin-right:auto}.pu154-feed{border-top:1px solid #ece7de}.pu154-update{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.8fr);gap:56px;align-items:center;padding:48px 0;border-bottom:1px solid #ece7de}.pu154-update.is-hidden{display:none}.pu154-meta{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;font-size:13px}.pu154-meta time{font-weight:700;color:#4d5058}.pu154-pill,.pu154-category,.pu154-hot{display:inline-flex;align-items:center;min-height:28px;padding:5px 10px;border-radius:999px;font-weight:800}.pu154-pill{background:#fff4cf;color:#7a4c00}.pu154-category{background:#f3f1ec;color:#4f4c46}.pu154-hot{background:#171717;color:#fff}.pu154-copy h3{font-size:clamp(28px,3vw,42px);line-height:1.06;letter-spacing:-.035em;margin:0 0 16px;max-width:680px}.pu154-copy>p{font-size:17px;line-height:1.75;color:#5d6069;max-width:680px;margin:0 0 18px}.pu154-more{display:inline-flex;align-items:center;gap:8px;font-weight:800;color:#171717;text-decoration:none}.pu154-more span{transition:transform .25s ease}.pu154-more:hover span{transform:translateX(5px)}.pu154-media{display:block;border-radius:28px;overflow:hidden;background:linear-gradient(135deg,#fff6dc,#ffe7bf);box-shadow:0 18px 46px rgba(36,30,20,.10);min-height:300px}.pu154-media img{display:block;width:100%;height:100%;min-height:300px;object-fit:cover;transition:transform .5s cubic-bezier(.2,.8,.2,1)}.pu154-update:hover .pu154-media img{transform:scale(1.025)}.pu154-load{margin:34px auto 0}.pu154-roadmap{background:#fff8e8}.pu154-roadmap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.pu154-roadmap-grid article{background:#fff;border:1px solid #f0dfbd;border-radius:24px;padding:28px;min-height:230px;transition:transform .3s ease,box-shadow .3s ease}.pu154-roadmap-grid article:hover{transform:translateY(-6px);box-shadow:0 18px 40px rgba(89,56,0,.10)}.pu154-roadmap-grid article>span,.pu154-connect-grid article>span{font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.12em;color:#a66300}.pu154-roadmap-grid h3,.pu154-connect-grid h3{font-size:24px;line-height:1.15;margin:14px 0 12px}.pu154-roadmap-grid p,.pu154-connect-grid p{color:#64615b;line-height:1.7;margin:0}.pu154-connect{background:#fff}.pu154-connect-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}.pu154-connect-grid article{border:1px solid #e9e3d8;border-radius:24px;padding:28px;min-height:260px;display:flex;flex-direction:column;transition:transform .3s ease,border-color .3s ease}.pu154-connect-grid article:hover{transform:translateY(-5px);border-color:#ffb800}.pu154-connect-grid article a{margin-top:auto;padding-top:22px;font-weight:850;color:#111;text-decoration:none}.pu154-detail{background:#fff}.pu154-detail-grid{display:grid;grid-template-columns:minmax(0,1fr) 290px;gap:64px;align-items:start}.pu154-article{min-width:0}.pu154-article-intro{padding-bottom:26px;border-bottom:1px solid #ece7de}.pu154-article-intro h2,.pu154-copy-section h2{font-size:clamp(28px,3vw,42px);line-height:1.12;letter-spacing:-.03em;margin:10px 0 14px}.pu154-article-intro p,.pu154-copy-section p,.pu154-copy-section li{font-size:17px;line-height:1.78;color:#5b5f67}.pu154-detail-media{margin:34px 0 0}.pu154-detail-media img{width:100%;height:auto;border-radius:28px;display:block}.pu154-detail-media figcaption{font-size:13px;color:#777;margin-top:10px}.pu154-copy-section{padding:38px 0;border-bottom:1px solid #ece7de;scroll-margin-top:110px}.pu154-copy-section ul{margin:18px 0 0;padding-left:22px}.pu154-copy-section li+li{margin-top:9px}.pu154-side{position:sticky;top:110px;display:grid;gap:18px}.pu154-side-card{border:1px solid #e7e2d8;border-radius:20px;padding:22px;background:#fff}.pu154-side-card h3{font-size:17px;margin:0 0 14px}.pu154-side-card a{display:block;padding:10px 0;border-top:1px solid #f0ece4;color:#343434;text-decoration:none;font-size:14px;line-height:1.45}.pu154-side-card a:hover{color:#a66300}.pu154-side-card a:first-of-type{border-top:0}.pu154-related-link{font-weight:750}.pu154-detail-banner .hero-trust-points span{background:rgba(255,255,255,.72);border:1px solid rgba(79,58,14,.08);border-radius:999px;padding:7px 11px}.pu154-detail-banner .global-banner-title{max-width:980px}.pu154-detail-page .product-final-cta{margin-top:0} @media(max-width:960px){.pu154-update{grid-template-columns:1fr;gap:24px}.pu154-media{order:-1;min-height:260px}.pu154-roadmap-grid,.pu154-connect-grid{grid-template-columns:1fr}.pu154-detail-grid{grid-template-columns:1fr}.pu154-side{position:relative;top:auto;grid-template-columns:repeat(2,1fr)}} @media(max-width:640px){.pu154-update{padding:34px 0}.pu154-media,.pu154-media img{min-height:220px}.pu154-copy h3{font-size:30px}.pu154-side{grid-template-columns:1fr}.pu154-roadmap-grid article,.pu154-connect-grid article{min-height:0}} @media(prefers-reduced-motion:reduce){.pu154-update *,.pu154-roadmap-grid article,.pu154-connect-grid article{transition:none!important}} /* V155 Product Updates polish */ .pu155-feed{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:28px; border-top:0; } .pu155-update-card{ display:grid; grid-template-columns:1fr; grid-template-rows:220px 1fr; gap:0; padding:0; overflow:hidden; border:1px solid #e9e3d8; border-radius:26px; background:#fff; min-width:0; height:100%; transition:border-color .28s ease,box-shadow .28s ease,transform .28s ease; } .pu155-update-card:hover{ transform:translateY(-4px); border-color:#f0c15a; box-shadow:0 18px 42px rgba(45,35,18,.08); } .pu155-update-card.is-hidden{display:none} .pu155-update-card .pu154-media{ order:0; min-height:0; height:220px; border-radius:0; box-shadow:none; background:#f7f4ed; padding:12px; } .pu155-update-card .pu154-media img{ width:100%; height:100%; min-height:0; object-fit:cover; object-position:center; border-radius:16px; } .pu155-update-card .pu154-copy{ display:flex; flex-direction:column; min-width:0; padding:28px; } .pu155-update-card .pu154-meta{margin-bottom:14px} .pu155-update-card .pu154-copy h3{ font-size:clamp(25px,2.4vw,34px); line-height:1.08; min-height:2.16em; margin-bottom:14px; } .pu155-update-card .pu154-copy>p{ font-size:16px; line-height:1.65; margin-bottom:24px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; } .pu155-card-btn{ margin-top:auto; align-self:flex-start; } .pu155-card-btn .btn-label{color:inherit} .pu154-load{display:flex;margin:38px auto 0} .pu154-detail-page .global-unified-banner .global-banner-title{max-width:980px} .pu154-detail-page .global-unified-banner .hero-actions{margin-top:26px} .pu154-detail-page .global-unified-banner .hero-trust-points span{ background:transparent; border:0; border-radius:0; padding:0; } .pu154-detail-page .pu154-detail-media img{ max-height:520px; object-fit:cover; } @media(max-width:900px){ .pu155-feed{grid-template-columns:1fr} .pu155-update-card{grid-template-rows:210px 1fr} .pu155-update-card .pu154-media{height:210px} } @media(max-width:640px){ .pu155-feed{gap:20px} .pu155-update-card{grid-template-rows:190px 1fr} .pu155-update-card .pu154-media{height:190px;padding:9px} .pu155-update-card .pu154-copy{padding:22px} .pu155-update-card .pu154-copy h3{font-size:27px;min-height:0} .pu155-card-btn{width:100%} } @media(prefers-reduced-motion:reduce){ .pu155-update-card{transition:none!important} } /* V156 responsive hardening + global button alignment */ .pu154-connect-grid article > .btn{margin-top:auto;padding-top:0;align-self:flex-start} @media(max-width:640px){.pu154-connect-grid article > .btn{width:100%;justify-content:space-between}} img,video,svg,canvas,iframe{max-width:100%} pre,code{overflow-wrap:anywhere} @media(max-width:767px){.container{max-width:100%}.btn,.btn-large{max-width:100%}table{max-width:100%}} /* V156 true overflow fixes */ .ck146-policy-shell > *{min-width:0} @media(max-width:1100px){ .premium-footer-bottom{grid-template-columns:1fr!important;gap:10px!important;align-items:start!important} .premium-footer-bottom>div{justify-content:flex-start!important;flex-wrap:wrap!important;white-space:normal!important} .premium-footer-bottom>span,.premium-footer-bottom .footer-credit{white-space:normal!important;margin-left:0} .premium-footer-bottom>span:last-child{text-align:left!important} } @media(max-width:620px){ .footer-bottom{align-items:flex-start!important;flex-wrap:wrap!important} .footer-bottom>span{white-space:normal!important} .premium-footer-bottom>div{gap:8px 12px!important} } @media(max-width:1100px){ .contact-paths-grid{grid-template-columns:repeat(2,minmax(0,1fr))} } @media(max-width:680px){ .contact-paths-grid{grid-template-columns:1fr} } /* V156 targeted mobile overflow repairs discovered during full-site QA */ @media(max-width:760px){ .dm119-owner-workspace,.dm119-owner-workspace>*,.dm119-person-panel,.dm119-person-id,.dm119-person-meta,.dm120-assignment-trail,.dm120-assignment-trail article, .fs118-stream-grid,.fs118-stream-grid>*,.fs118-stream-copy,.fs118-context-list,.fs118-context-list article,.fs118-stream-board, .hy126-operating-grid,.hy126-operating-grid>*,.hy126-operating-copy,.hy126-operating-points,.hy126-operating-points article, .rem124-screen-stage,.rem124-screen-stage>*,.rem124-screen-image,.rem124-screen-notes,.rem124-screen-notes article, .em-use-layout,.em-use-layout>*,.em-use-copy,.em-use-photo,.em-use-rows,.em-use-row{ min-width:0!important;max-width:100%!important;width:100%!important; } .dm119-person-meta{grid-template-columns:1fr!important} .em-use-row{grid-template-columns:1fr auto!important} .em-use-row small{grid-column:1/-1!important} .em-use-photo{margin-left:0!important;margin-right:0!important} .rem124-screen-image img{width:100%!important;height:auto!important;min-width:0!important} } @media(max-width:760px){ .dm119-access-grid,.dm119-access-grid>*,.dm119-access-copy,.dm119-access-list,.dm119-access-canvas,.dm119-access-photo{min-width:0!important;max-width:100%!important;width:100%!important} .hy126-week-board,.hy126-week-table{min-width:0!important;max-width:100%!important;width:100%!important} .hy126-week-table{overflow-x:auto!important;-webkit-overflow-scrolling:touch} } @media(max-width:760px){ .hy126-week-table{contain:inline-size;overflow-x:auto!important} } @media(max-width:760px){ .hy127-collab-grid,.hy127-collab-grid>*,.hy127-collab-copy,.hy127-collab-points,.hy127-collab-points article,.hy127-collab-stage,.hy127-collab-agenda,.hy127-collab-agenda article{min-width:0!important;max-width:100%!important} .hy127-collab-copy,.hy127-collab-stage{width:100%!important} } @media(max-width:1120px){ .dm119-owner-workspace,.dm119-owner-workspace>*,.dm119-person-panel,.dm119-owner-dashboard,.dm119-person-id,.dm119-person-meta,.dm120-assignment-trail,.dm120-assignment-trail article, .dm119-access-grid,.dm119-access-grid>*,.dm119-access-copy,.dm119-access-list,.dm119-access-canvas,.dm119-access-photo, .hy127-collab-grid,.hy127-collab-grid>*,.hy127-collab-copy,.hy127-collab-points,.hy127-collab-points article,.hy127-collab-stage,.hy127-collab-agenda,.hy127-collab-agenda article{ min-width:0!important;max-width:100%!important; } .dm119-owner-workspace,.dm119-access-grid{grid-template-columns:1fr!important} .dm119-person-panel,.dm119-owner-dashboard,.dm119-access-copy,.dm119-access-canvas,.hy127-collab-copy,.hy127-collab-stage{width:100%!important} } .hy127-collab-grid{grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr)} .hy127-collab-grid>*{min-width:0} @media(max-width:1120px){.hy127-collab-grid{grid-template-columns:1fr}} /* ===== V162 responsive pass: small-screen only unless explicitly noted ===== */ .rp162-page .rp162-overview-grid,.rp162-page .rp162-compare-grid,.rp162-page .rp162-export-grid{display:grid;grid-template-columns:minmax(0,.92fr) minmax(0,1.08fr);gap:56px;align-items:center} .rp162-dashboard{position:relative;padding:18px;border:1px solid var(--line);border-radius:28px;background:#fff;box-shadow:0 24px 60px rgba(18,24,32,.08)} .rp162-dashboard img{display:block;width:100%;height:auto;border-radius:18px} .rp162-float-stat{position:absolute;padding:12px 14px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 12px 26px rgba(18,24,32,.09)} .rp162-float-stat b,.rp162-float-stat span{display:block}.rp162-float-stat b{font-size:20px}.rp162-float-stat span{font-size:10px;color:var(--muted);margin-top:3px}.rp162-float-stat.stat-a{left:-22px;top:18%}.rp162-float-stat.stat-b{right:-18px;bottom:14%} .rp162-signal-list{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:24px}.rp162-signal-list span{padding:12px 14px;border-radius:14px;background:#fff7e2;border:1px solid rgba(255,184,0,.22);font-weight:800;font-size:13px} .rp162-type-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}.rp162-type-grid article{display:flex;flex-direction:column;min-height:280px;padding:26px;border:1px solid var(--line);border-radius:24px;background:#fff;transition:.28s ease}.rp162-type-grid article:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(18,24,32,.08);border-color:rgba(255,184,0,.3)}.rp162-type-grid article>span{width:42px;height:42px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#ffcf43,#ff914d);font-weight:900}.rp162-type-grid h3{margin:22px 0 10px}.rp162-type-grid p{color:var(--muted);flex:1}.rp162-type-grid a{font-weight:900;color:var(--dark)} .rp162-compare-board{padding:28px;border-radius:28px;background:var(--dark);color:#fff;box-shadow:0 24px 58px rgba(18,24,32,.14)}.rp162-board-head{display:flex;justify-content:space-between;gap:16px;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.12)}.rp162-board-head span{font-weight:900}.rp162-board-head b{font-size:12px;color:#ffcf43}.rp162-bars{display:grid;gap:18px;margin:24px 0}.rp162-bars>div{display:grid;grid-template-columns:90px minmax(0,1fr) 42px;gap:12px;align-items:center;font-size:12px}.rp162-bars i{height:10px;border-radius:999px;background:linear-gradient(90deg,#ffcf43,#ff914d,#ff6f59);width:var(--w);max-width:100%;display:block}.rp162-bars b{text-align:right}.rp162-board-note{padding:18px;border-radius:18px;background:rgba(255,255,255,.07)}.rp162-board-note strong,.rp162-board-note span{display:block}.rp162-board-note span{margin-top:6px;color:#cbd0d8;font-size:12px} .rp162-flow-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:0;margin-top:28px;border:1px solid var(--line);border-radius:26px;overflow:hidden}.rp162-flow-grid article{padding:28px;background:#fff;border-right:1px solid var(--line)}.rp162-flow-grid article:last-child{border-right:0}.rp162-flow-grid b{color:var(--accent);font-size:12px}.rp162-flow-grid h3{margin:12px 0 10px}.rp162-flow-grid p{color:var(--muted);margin:0} .rp162-export{background:#fffaf1}.rp162-export-points{display:grid;gap:12px;margin-top:24px}.rp162-export-points span{display:grid;grid-template-columns:120px 1fr;gap:14px;padding:14px 0;border-bottom:1px solid rgba(20,26,34,.08)}.rp162-export-points small{color:var(--muted)}.rp162-export-card{padding:28px;border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 44px rgba(18,24,32,.07)}.rp162-export-top,.rp162-export-row{display:flex;justify-content:space-between;gap:18px;align-items:center}.rp162-export-top{padding-bottom:18px;border-bottom:1px solid var(--line);font-weight:900}.rp162-export-top b{color:#0a9f67}.rp162-export-row{padding:16px 0;border-bottom:1px solid var(--line)}.rp162-export-row span{color:var(--muted)}.rp162-export-card .btn{margin-top:22px} /* normalize shrinking behavior globally */ .split>* , [class*="-grid"]>* , [class*="-layout"]>*{min-width:0} img,video,svg{max-width:100%} @media (max-width: 1024px){ .container{width:min(100% - 40px,var(--container,1200px))} .rp162-page .rp162-overview-grid,.rp162-page .rp162-compare-grid,.rp162-page .rp162-export-grid{grid-template-columns:1fr;gap:30px} .rp162-type-grid,.rp162-flow-grid{grid-template-columns:1fr 1fr} .rp162-flow-grid article:nth-child(2){border-right:0}.rp162-flow-grid article:nth-child(-n+2){border-bottom:1px solid var(--line)} .rp162-float-stat.stat-a{left:12px}.rp162-float-stat.stat-b{right:12px} } @media (max-width: 760px){ :root{--global-section-space:clamp(58px,14vw,78px)} .container{width:min(100% - 28px,var(--container,1200px))!important} body{overflow-x:hidden} section,.section{min-width:0} h1,h2,h3,p,a,span,strong{overflow-wrap:break-word} body:not(.home) h2{font-size:clamp(30px,9vw,42px)!important;line-height:1.08!important} body:not(.home) .global-banner-title{font-size:clamp(38px,11vw,54px)!important;line-height:1.02!important} .title-line{display:block;max-width:100%} .section-copy,.section-heading,.faq-copy{max-width:100%!important} .btn,.btn-large{max-width:100%;white-space:normal} .hero-actions,.dark-cta-actions{gap:10px;flex-wrap:wrap} .split,.feature-grid.three,.feature-grid.four{grid-template-columns:1fr!important} /* Common two/three-column components must become one clean stack. */ .solutions-industries-layout,.solutions-models-grid,.solutions-usecase-grid,.tc96-context-grid,.tc96-modes-grid,.pa110-bento,.ss99-intro-grid,.ss100-decision-layout{grid-template-columns:1fr!important} .solutions-industries-visual{min-height:0!important;height:auto!important}.solutions-industries-visual img{width:100%!important;height:auto!important;aspect-ratio:4/3;object-fit:cover;border-radius:22px!important} .solutions-industry-links{grid-template-columns:1fr!important}.solutions-industry-links a{min-height:0!important;padding:18px!important} .solutions-industries-copy{padding:0!important}.solutions-industries-copy h2{margin-top:12px!important} .pa110-bento{gap:14px!important}.pa110-bento>*{grid-column:auto!important;grid-row:auto!important;min-height:0!important}.pa110-bento article{padding:24px!important}.pa110-bento-main p{font-size:15px!important;line-height:1.6!important}.pa110-main-points{margin-top:18px!important} .tc96-context-steps article{grid-template-columns:38px minmax(0,1fr)!important;gap:12px!important}.tc96-context-steps article>div{min-width:0}.tc96-modes-grid>*{min-width:0!important} .product-scroll-media img{width:100%!important;height:auto!important;transform:none!important} /* tables become vertical cards rather than horizontal scrollers */ table{display:block!important;width:100%!important;border:0!important} table thead{display:none!important} table tbody{display:grid!important;gap:12px!important} table tr{display:block!important;border:1px solid var(--line)!important;border-radius:18px!important;padding:14px!important;background:#fff!important} table td{display:grid!important;grid-template-columns:minmax(92px,34%) minmax(0,1fr)!important;gap:10px!important;width:100%!important;padding:8px 0!important;border:0!important;text-align:left!important;white-space:normal!important} table td::before{content:attr(data-label);font-size:10px;line-height:1.35;font-weight:900;text-transform:uppercase;letter-spacing:.06em;color:var(--muted)} .table-wrap,.comparison-table-wrap,.pricing-table-wrap{overflow:visible!important;max-width:100%!important} .rp162-type-grid,.rp162-flow-grid{grid-template-columns:1fr!important}.rp162-type-grid article{min-height:0}.rp162-flow-grid article{border-right:0!important;border-bottom:1px solid var(--line)!important}.rp162-flow-grid article:last-child{border-bottom:0!important} .rp162-signal-list{grid-template-columns:1fr}.rp162-float-stat{position:static!important;margin-top:10px}.rp162-dashboard{display:grid;gap:10px}.rp162-bars>div{grid-template-columns:74px minmax(0,1fr) 36px}.rp162-export-points span{grid-template-columns:1fr;gap:4px}.rp162-export-top,.rp162-export-row{align-items:flex-start}.rp162-export-row{flex-direction:column;gap:4px} } @media(max-width:480px){ .container{width:min(100% - 24px,var(--container,1200px))!important} body:not(.home) h2{font-size:clamp(28px,8.6vw,36px)!important} .eyebrow{max-width:100%;white-space:normal;text-align:center} .hero-actions .btn,.dark-cta-actions .btn{width:100%;justify-content:space-between} table td{grid-template-columns:1fr!important;gap:3px!important} } /* ========================================================= V163 TARGETED REPORTS + MOBILE NAV + RESPONSIVE POLISH ========================================================= */ /* ========================================================= V161 FULL RESPONSIVE QA — MOBILE/TABLET STRUCTURE REPAIR ========================================================= */ *{min-width:0} html,body{max-width:100%;overflow-x:clip} img,video,canvas,svg,iframe{max-width:100%;height:auto} /* Mobile navigation now mirrors the full desktop information architecture. */ @media(max-width:820px){ .site-header{position:relative;z-index:1000} .mobile-menu{ position:absolute!important; left:0!important;right:0!important; top:82px!important; width:100%!important; max-height:calc(100dvh - 82px)!important; overflow-y:auto!important; overscroll-behavior:contain; padding:14px var(--global-inline-space) 28px!important; background:#fff!important; border-top:1px solid var(--line); box-shadow:0 24px 50px rgba(18,24,32,.12); gap:0!important; } .mobile-menu.open{display:flex!important} .mobile-menu>a,.mobile-nav-group>summary{ min-height:50px; display:flex; align-items:center; justify-content:space-between; width:100%; padding:12px 0!important; border-bottom:1px solid var(--line)!important; color:var(--text); font-size:15px; font-weight:800; cursor:pointer; list-style:none; } .mobile-nav-group>summary::-webkit-details-marker{display:none} .mobile-nav-group>summary span{font-size:22px;font-weight:500;transition:transform .2s ease} .mobile-nav-group[open]>summary span{transform:rotate(45deg)} .mobile-nav-links{display:grid;grid-template-columns:1fr 1fr;gap:0 18px;padding:4px 0 12px;border-bottom:1px solid var(--line)} .mobile-nav-links a{display:block!important;padding:10px 0!important;border:0!important;color:var(--muted)!important;font-size:13px!important;font-weight:650!important;line-height:1.35!important} } @media(max-width:560px){ .mobile-menu{top:74px!important;max-height:calc(100dvh - 74px)!important} .mobile-nav-links{grid-template-columns:1fr} } /* Reports flow: align heading to the same container edge as the cards. */ .rp162-flow .rp162-flow-heading{max-width:none!important;margin:0 0 34px!important;text-align:left!important} .rp162-flow .rp162-flow-heading h2{max-width:760px!important;margin:14px 0 0!important;text-align:left!important} .rp162-flow-grid{margin-top:0!important} .rp162-flow-grid article{position:relative;isolation:isolate;transition:transform .28s ease,box-shadow .28s ease,background .28s ease} .rp162-flow-grid article::after{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,184,0,.07),rgba(255,122,0,.03));opacity:0;z-index:-1;transition:opacity .28s ease} .rp162-flow-grid article:hover{transform:translateY(-7px);box-shadow:0 20px 42px rgba(18,24,32,.08);z-index:2} .rp162-flow-grid article:hover::after{opacity:1} .rp162-flow-icon{width:48px;height:48px;border-radius:15px;display:grid;place-items:center;margin:16px 0 18px;background:linear-gradient(135deg,rgba(255,184,0,.18),rgba(255,122,0,.12));color:var(--accent);transition:transform .28s ease,background .28s ease} .rp162-flow-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .rp162-flow-grid article:hover .rp162-flow-icon{transform:translateY(-3px) rotate(-4deg) scale(1.06);background:linear-gradient(135deg,#ffcf43,#ff914d);color:#111} .rp162-flow[data-rp162-reveal].is-visible .rp162-flow-grid article{animation:rp163FlowIn .58s cubic-bezier(.2,.72,.2,1) both;animation-delay:calc(var(--step) * 90ms)} @keyframes rp163FlowIn{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}} /* Reports FAQ uses the same white FAQ treatment already used by the site. */ .rp162-faq .faq-heading{max-width:760px;margin:0 auto 38px;text-align:center} .rp162-faq .faq-heading h2{margin-left:auto!important;margin-right:auto!important} /* Conservative small-screen spacing: no desktop geometry changes. */ @media(max-width:760px){ .rp162-flow .rp162-flow-heading{margin-bottom:24px!important} .rp162-flow .rp162-flow-heading h2{font-size:clamp(30px,8.8vw,38px)!important} .rp162-flow-grid article{padding:22px!important} .rp162-flow-icon{margin:14px 0 16px} .ss99-intro-points article,.ss99-policy-list article{grid-template-columns:48px minmax(0,1fr)!important;gap:14px!important;align-items:start!important} .ss99-intro-points .ss99-icon,.ss99-policy-icon{width:46px!important;height:46px!important} .ss99-timeline-board{overflow:visible!important} .ss99-timeline-row,.ss99-timeline-toolbar{min-width:0!important;width:100%!important} .ss99-timeline-row{grid-template-columns:52px minmax(0,1fr)!important;gap:10px 14px!important;align-items:start!important;padding:18px!important} .ss99-timeline-row>*{min-width:0!important} .ss99-timeline-row .ss99-timeline-status{grid-column:2;justify-self:start} .ss99-timeline-toolbar{padding:16px 18px!important;flex-wrap:wrap!important} } @media(max-width:480px){ .mobile-menu{padding-left:18px!important;padding-right:18px!important} .rp162-flow-grid{border-radius:20px!important} } @media(prefers-reduced-motion:reduce){.rp162-flow[data-rp162-reveal].is-visible .rp162-flow-grid article{animation:none!important}.rp162-flow-grid article,.rp162-flow-icon{transition:none!important}} /* ========================================================= V164 RESPONSIVE BANNER + MEGA MENU + ATTENDANCE/WORKSPACE ========================================================= */ /* Desktop mega menus remain fully visible even on shorter laptop viewports. */ @media(min-width:821px){ .mega-dropdown{max-height:calc(100vh - 88px);overflow-y:auto;overscroll-behavior:contain} .mega-menu-inner{min-height:0!important;max-height:none!important} .mega-panels,.mega-tabs,.mega-cta{align-self:stretch} } @media(min-width:821px) and (max-height:760px){ .mega-dropdown{top:72px!important} .mega-menu-inner{width:min(1280px,calc(100% - 48px));border-radius:22px} .mega-tabs{padding-top:20px;padding-bottom:20px}.mega-panels{padding-top:22px!important;padding-bottom:22px!important}.mega-cta{padding-top:24px!important;padding-bottom:24px!important} .mega-feature-link{min-height:78px!important;padding-top:9px!important;padding-bottom:9px!important}.mega-cta-card{margin-top:20px!important;min-height:140px!important} } /* Inner-page banner text can wrap safely on mobile without touching viewport edges. */ @media(max-width:760px){ .global-unified-banner .product-main-hero-grid{width:min(100% - 28px,var(--container,1200px))!important} .global-unified-banner .hubstaff-hero-copy{width:100%!important;max-width:100%!important;min-width:0!important;text-align:left!important} .global-unified-banner .hubstaff-topline{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:5px!important;width:100%!important;max-width:100%!important;white-space:normal!important} .global-unified-banner .hubstaff-topline>span{display:block!important;max-width:100%!important;line-height:1.45!important} body:not(.home) .global-unified-banner .global-banner-title{width:100%!important;max-width:100%!important;margin-left:0!important;margin-right:0!important;overflow:visible!important;word-break:normal!important;overflow-wrap:normal!important} .global-unified-banner .global-banner-line{display:block!important;width:100%!important;max-width:100%!important;white-space:normal!important} .global-unified-banner .typewriter-wrap{display:inline!important;white-space:normal!important;max-width:100%!important} .global-unified-banner .typewriter-word{white-space:normal!important;overflow-wrap:break-word!important} .global-unified-banner .hero-actions,.global-unified-banner .hero-trust-points{justify-content:flex-start!important} } @media(max-width:480px){ .global-unified-banner .product-main-hero-grid{width:calc(100% - 24px)!important} body:not(.home) .global-unified-banner .global-banner-title{font-size:clamp(34px,10.2vw,42px)!important;line-height:1.04!important;letter-spacing:-.04em!important} } /* Reports flow icons are centered consistently at desktop and mobile. */ .rp162-flow-icon{place-items:center!important;align-items:center!important;justify-items:center!important} .rp162-flow-icon svg{display:block;margin:auto} /* Manage Attendance V164 */ .ma164-live-grid,.ma164-exception-grid,.ma164-roles-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.9fr);gap:64px;align-items:center} .ma164-live-points{display:grid;gap:12px;margin-top:26px}.ma164-live-points>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}.ma164-live-points span,.ma164-role-matrix span{color:var(--muted);line-height:1.55} .ma164-status-board{padding:26px;border-radius:28px;background:#20252d;color:#fff;box-shadow:0 24px 56px rgba(18,24,32,.16)}.ma164-board-head,.ma164-status-row{display:flex;align-items:center;gap:14px}.ma164-board-head{justify-content:space-between;padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.12)}.ma164-board-head b{color:#ffcf43}.ma164-status-row{padding:18px 0;border-bottom:1px solid rgba(255,255,255,.1)}.ma164-status-row>div{min-width:0;flex:1}.ma164-status-row strong,.ma164-status-row small{display:block}.ma164-status-row small{color:#b9c0ca;margin-top:4px}.ma164-status-row em{font-style:normal;font-size:11px;font-weight:900;padding:7px 10px;border-radius:999px;background:#353b45}.ma164-status-row em.is-good{background:#103b2d;color:#7ef0bc}.ma164-status-row em.is-warn{background:#4a3815;color:#ffd269}.ma164-avatar{width:44px;height:44px;border-radius:50%;display:grid;place-items:center;background:linear-gradient(135deg,#ffcf43,#ff914d);color:#111;font-weight:900}.ma164-coverage{display:grid;grid-template-columns:1fr 1fr;gap:12px;padding-top:18px}.ma164-coverage span{padding:15px;border-radius:16px;background:rgba(255,255,255,.06)}.ma164-coverage b,.ma164-coverage small{display:block}.ma164-coverage small{color:#b9c0ca;margin-top:3px} .ma164-adherence-board{border:1px solid var(--line);border-radius:26px;overflow:hidden;background:#fff}.ma164-adherence-head,.ma164-adherence-row{display:grid;grid-template-columns:1.2fr 1fr 1fr .9fr;gap:18px;align-items:center;padding:17px 22px}.ma164-adherence-head{background:#fff8e8;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:#756b5d}.ma164-adherence-row{border-top:1px solid var(--line)}.ma164-adherence-row b{justify-self:start;padding:6px 9px;border-radius:999px;font-size:11px}.ma164-adherence-row .is-good{background:#e9f8ef;color:#087a49}.ma164-adherence-row .is-warn{background:#fff1d7;color:#9b5e00} .ma164-exception-rail{position:relative;display:grid;gap:14px}.ma164-exception-rail:before{content:"";position:absolute;left:23px;top:34px;bottom:34px;width:2px;background:linear-gradient(#ffcf43,#ff914d)}.ma164-rail-node{position:relative;display:grid;grid-template-columns:48px minmax(0,1fr);gap:18px;padding:22px;border:1px solid var(--line);border-radius:22px;background:#fff;transition:.28s ease}.ma164-rail-node:hover{transform:translateX(6px);border-color:rgba(255,184,0,.45);box-shadow:0 16px 34px rgba(18,24,32,.07)}.ma164-rail-node>span{z-index:1;width:48px;height:48px;border-radius:50%;display:grid;place-items:center;background:#fff4d4;border:1px solid #ffe09a;color:#9b5e00;font-weight:900}.ma164-rail-node p{margin:5px 0 0;color:var(--muted)} .ma164-pattern-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:30px}.ma164-pattern-grid article{padding:26px;border-radius:24px;background:#fff;border:1px solid var(--line);transition:.28s ease}.ma164-pattern-grid article:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(18,24,32,.08)}.ma164-pattern-grid strong,.ma164-pattern-grid b,.ma164-pattern-grid p{display:block}.ma164-pattern-grid b{font-size:34px;margin:16px 0 8px}.ma164-pattern-grid p{margin:0;color:var(--muted)}.ma164-icon{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;background:linear-gradient(135deg,#ffcf43,#ff914d);font-weight:900} .ma164-role-matrix{display:grid;gap:12px}.ma164-role-matrix>div{display:grid;grid-template-columns:120px minmax(0,1fr);gap:16px;padding:20px;border-radius:20px;background:#fff;border:1px solid var(--line);transition:.25s ease}.ma164-role-matrix>div:hover{border-color:rgba(255,184,0,.5);transform:translateY(-3px)} /* Workspace Management V164 */ .ws164-map-grid,.ws164-boundary-grid,.ws164-life-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.9fr);gap:64px;align-items:center}.ws164-map-points{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:26px}.ws164-map-points span{padding:16px;border:1px solid var(--line);border-radius:18px;background:#fff}.ws164-map-points b,.ws164-map-points small{display:block}.ws164-map-points small{color:var(--muted);margin-top:4px}.ws164-org-map{position:relative;min-height:430px;border-radius:34px;background:radial-gradient(circle at 50% 45%,#fff7d7 0 24%,#fff 25% 100%);border:1px solid var(--line);display:grid;place-items:center;overflow:hidden}.ws164-org-map:before,.ws164-org-map:after{content:"";position:absolute;border:1px dashed rgba(255,153,0,.35);border-radius:50%}.ws164-org-map:before{width:270px;height:270px}.ws164-org-map:after{width:380px;height:380px}.ws164-org-core{z-index:2;width:160px;height:160px;border-radius:50%;display:grid;place-content:center;text-align:center;background:#20252d;color:#fff;font-size:24px;font-weight:900;box-shadow:0 18px 40px rgba(18,24,32,.18)}.ws164-org-core span{display:block;font-size:11px;color:#ffcf43;margin-top:5px}.ws164-org-ring{position:absolute;inset:0;z-index:2}.ws164-org-ring span{position:absolute;padding:9px 12px;border-radius:999px;background:#fff;border:1px solid #f0d9a8;font-size:12px;font-weight:850;box-shadow:0 10px 24px rgba(18,24,32,.08)}.ws164-org-ring span:nth-child(1){top:14%;left:9%}.ws164-org-ring span:nth-child(2){top:16%;right:10%}.ws164-org-ring span:nth-child(3){bottom:15%;left:10%}.ws164-org-ring span:nth-child(4){bottom:13%;right:8%} .ws164-step-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.ws164-step-grid article{position:relative;padding:26px;border:1px solid var(--line);border-radius:24px;background:#fff;transition:.28s ease}.ws164-step-grid article:hover{transform:translateY(-6px);box-shadow:0 18px 38px rgba(18,24,32,.08)}.ws164-step-grid article>span{font-size:11px;font-weight:900;color:#b36d00}.ws164-step-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;margin:18px 0;background:linear-gradient(135deg,#ffcf43,#ff914d);font-weight:900}.ws164-step-grid p{color:var(--muted)} .ws164-access-board{padding:24px;border-radius:28px;background:#20252d;color:#fff}.ws164-access-head,.ws164-access-board>div:not(.ws164-access-head){display:grid;grid-template-columns:150px minmax(0,1fr) 60px;gap:16px;align-items:center}.ws164-access-head{padding-bottom:18px;border-bottom:1px solid rgba(255,255,255,.12)}.ws164-access-head b{justify-self:end;color:#ffcf43}.ws164-access-board>div:not(.ws164-access-head){padding:18px 0;border-bottom:1px solid rgba(255,255,255,.1)}.ws164-access-board>div:last-child{border-bottom:0}.ws164-access-board span{color:#b9c0ca;font-size:13px}.ws164-access-board em{font-style:normal;font-size:11px;font-weight:900;color:#ffcf43;text-align:right} .ws164-dept-flow{margin-top:30px;padding:28px;border:1px solid var(--line);border-radius:28px;background:#fff}.ws164-dept-main{width:max-content;max-width:100%;padding:16px 20px;border-radius:18px;background:#20252d;color:#fff}.ws164-dept-main strong,.ws164-dept-main span{display:block}.ws164-dept-main span{margin-top:4px;color:#c8ced8;font-size:12px}.ws164-dept-branches{position:relative;display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:38px}.ws164-dept-branches:before{content:"";position:absolute;left:8%;right:8%;top:-20px;height:1px;background:#ffc338}.ws164-dept-branches article{padding:22px;border-radius:20px;border:1px solid var(--line);background:#fffaf1;transition:.25s ease}.ws164-dept-branches article:hover{transform:translateY(-4px)}.ws164-dept-branches b,.ws164-dept-branches span,.ws164-dept-branches small{display:block}.ws164-dept-branches span{font-size:28px;font-weight:900;margin:10px 0}.ws164-dept-branches small{color:var(--muted)} .ws164-life-list{display:grid;gap:12px}.ws164-life-list>div{display:grid;grid-template-columns:72px 150px minmax(0,1fr);gap:14px;align-items:center;padding:18px;border:1px solid var(--line);border-radius:20px;background:#fff}.ws164-life-list>div>span{font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.08em;color:#a66300}.ws164-life-list small{color:var(--muted)} [data-v164-reveal] .ma164-status-board,[data-v164-reveal] .ma164-rail-node,[data-v164-reveal] .ma164-pattern-grid article,[data-v164-reveal] .ws164-step-grid article,[data-v164-reveal] .ws164-org-map{transition:transform .45s ease,opacity .45s ease,box-shadow .28s ease} @media(max-width:1024px){ .ma164-live-grid,.ma164-exception-grid,.ma164-roles-grid,.ws164-map-grid,.ws164-boundary-grid,.ws164-life-grid{grid-template-columns:1fr;gap:36px} .ma164-pattern-grid,.ws164-step-grid{grid-template-columns:1fr 1fr} } @media(max-width:760px){ .ma164-live-points>div,.ma164-role-matrix>div{grid-template-columns:1fr;gap:5px} .ma164-status-board{padding:18px;border-radius:22px}.ma164-status-row{align-items:flex-start;flex-wrap:wrap}.ma164-status-row em{margin-left:58px}.ma164-coverage{grid-template-columns:1fr} .ma164-adherence-board{border:0;background:transparent;display:grid;gap:12px;overflow:visible}.ma164-adherence-head{display:none}.ma164-adherence-row{display:grid;grid-template-columns:1fr 1fr!important;gap:8px 14px!important;padding:18px!important;border:1px solid var(--line)!important;border-radius:18px;background:#fff}.ma164-adherence-row strong{grid-column:1/-1}.ma164-adherence-row span:before{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:900;margin-bottom:3px}.ma164-adherence-row span:nth-child(2):before{content:"Scheduled"}.ma164-adherence-row span:nth-child(3):before{content:"Tracked"}.ma164-adherence-row b{grid-column:1/-1} .ma164-exception-rail:before{left:21px}.ma164-rail-node{padding:18px;grid-template-columns:44px minmax(0,1fr)}.ma164-rail-node>span{width:44px;height:44px} .ma164-pattern-grid,.ws164-step-grid{grid-template-columns:1fr} .ws164-map-points{grid-template-columns:1fr}.ws164-org-map{min-height:360px}.ws164-org-map:after{width:320px;height:320px}.ws164-org-map:before{width:230px;height:230px}.ws164-org-core{width:138px;height:138px;font-size:20px} .ws164-access-head,.ws164-access-board>div:not(.ws164-access-head){grid-template-columns:1fr!important;gap:6px!important}.ws164-access-head b,.ws164-access-board em{justify-self:start;text-align:left} .ws164-dept-branches{grid-template-columns:1fr}.ws164-dept-branches:before{display:none}.ws164-life-list>div{grid-template-columns:1fr;gap:5px} } @media(max-width:480px){ .ma164-adherence-row{grid-template-columns:1fr!important}.ma164-adherence-row strong,.ma164-adherence-row b{grid-column:auto} .ws164-org-ring span{font-size:10px;padding:7px 9px}.ws164-org-ring span:nth-child(1){left:4%}.ws164-org-ring span:nth-child(2){right:4%}.ws164-org-ring span:nth-child(3){left:4%}.ws164-org-ring span:nth-child(4){right:4%} } @media(prefers-reduced-motion:reduce){.ma164-rail-node,.ma164-pattern-grid article,.ws164-step-grid article,.ws164-dept-branches article{transition:none!important}.ma164-rail-node:hover,.ma164-pattern-grid article:hover,.ws164-step-grid article:hover,.ws164-dept-branches article:hover{transform:none!important}} /* V164 mobile table cards: no horizontal or side-by-side compression. */ @media(max-width:760px){table td{grid-template-columns:1fr!important;gap:3px!important} table td::before{margin-bottom:2px}} /* ===== Worklix V165 Product mega menu completion + height fix ===== */ @media (min-width: 1121px){ .desktop-nav .mega-product{ height:auto; min-height:500px; max-height:calc(100vh - 102px); overflow:hidden; } .desktop-nav .mega-product .mega-columns{ padding:22px 24px 20px; gap:18px; overflow:visible; } .desktop-nav .mega-product .mega-column{ gap:4px; } .desktop-nav .mega-product .mega-column>.mega-kicker{ padding-bottom:7px; margin-bottom:0; } .desktop-nav .mega-product .mega-link{ min-height:62px; padding:6px 7px; column-gap:10px; } .desktop-nav .mega-product .mega-link-icon{ width:36px; height:36px; border-radius:11px; } .desktop-nav .mega-product .mega-link-text strong{ font-size:13px; line-height:1.18; margin-bottom:3px; } .desktop-nav .mega-product .mega-link-text small{ font-size:11.5px; line-height:1.3; } } @media (min-width:1121px) and (max-height:680px){ .desktop-nav .mega-dropdown{top:74px;padding-top:10px;padding-bottom:10px;} .desktop-nav .mega-product{ min-height:0; max-height:calc(100vh - 90px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; } .desktop-nav .mega-product .mega-overview{padding-top:22px;padding-bottom:22px;} .desktop-nav .mega-product .mega-link{min-height:56px;padding-block:4px;} .desktop-nav .mega-product .mega-link-text small{font-size:10.8px;} } /* V166 targeted desktop polish: Reports + Attendance + Workspace */ @media (min-width: 981px){ .rp166-flow-shell{width:min(var(--container),calc(100% - (var(--global-inline-space) * 2)));margin-inline:auto} .rp166-flow-shell .rp162-flow-heading{width:100%;max-width:none!important;margin:0 0 34px!important;padding:0!important;text-align:left!important} .rp166-flow-shell .rp162-flow-heading h2{margin:14px 0 0!important;max-width:760px!important;text-align:left!important} .rp166-flow-shell .rp162-flow-grid{width:100%;margin:0!important} .ws166-record-image{position:relative;margin:0;min-height:430px;border-radius:34px;overflow:hidden;border:1px solid var(--line);background:#f6f7f8;box-shadow:0 22px 52px rgba(18,24,32,.08)} .ws166-record-image img{width:100%;height:430px;display:block;object-fit:cover;object-position:center} .ws166-record-image:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 45%,rgba(20,25,32,.72) 100%);pointer-events:none} .ws166-record-image figcaption{position:absolute;left:24px;right:24px;bottom:22px;z-index:2;color:#fff} .ws166-record-image figcaption span{display:block;color:#ffd44b;font-size:11px;font-weight:900;text-transform:uppercase;letter-spacing:.09em;margin-bottom:5px} .ws166-record-image figcaption strong{display:block;max-width:420px;font-size:20px;line-height:1.25} .ws166-team-structure .section-heading{max-width:760px;margin-bottom:38px} .ws166-team-layout{display:grid;grid-template-columns:minmax(330px,.82fr) minmax(0,1.18fr);gap:22px;align-items:stretch} .ws166-team-hub{position:relative;padding:34px;border-radius:28px;background:#20252d;color:#fff;overflow:hidden;display:flex;flex-direction:column;min-height:360px;transition:transform .28s ease,box-shadow .28s ease} .ws166-team-hub:before{content:"";position:absolute;width:230px;height:230px;border-radius:50%;right:-70px;bottom:-90px;background:radial-gradient(circle,rgba(255,184,0,.26),transparent 68%)} .ws166-team-hub:hover{transform:translateY(-6px);box-shadow:0 22px 48px rgba(18,24,32,.14)} .ws166-team-icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;background:linear-gradient(135deg,#ffcf43,#ff914d);color:#111;margin-bottom:38px} .ws166-team-icon svg,.ws166-row-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .ws166-team-hub small{color:#ffcf43;text-transform:uppercase;letter-spacing:.08em;font-weight:900} .ws166-team-hub>strong{font-size:28px;line-height:1.08;max-width:330px;margin:8px 0 12px} .ws166-team-hub>p{color:#c8ced6;max-width:420px;margin:0} .ws166-team-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:auto;padding-top:28px} .ws166-team-metrics span{padding:12px;border:1px solid rgba(255,255,255,.1);border-radius:14px;color:#dfe3e8;font-size:12px} .ws166-team-metrics b{display:block;color:#fff;font-size:20px;margin-bottom:2px} .ws166-team-rows{display:grid;gap:14px} .ws166-team-rows article{display:grid;grid-template-columns:54px minmax(0,1fr) auto;gap:18px;align-items:center;padding:24px 26px;border:1px solid var(--line);border-radius:24px;background:#fff;transition:transform .28s ease,border-color .28s ease,box-shadow .28s ease} .ws166-team-rows article:hover{transform:translateX(7px);border-color:rgba(255,184,0,.48);box-shadow:0 16px 36px rgba(18,24,32,.07)} .ws166-row-icon{width:52px;height:52px;border-radius:15px;display:grid;place-items:center;background:#fff4d8;color:#db8d00;transition:transform .28s ease,background .28s ease} .ws166-team-rows article:hover .ws166-row-icon{transform:rotate(-5deg) scale(1.05);background:linear-gradient(135deg,#ffcf43,#ff914d);color:#111} .ws166-team-rows small{display:block;color:#7b8491;text-transform:uppercase;letter-spacing:.08em;font-size:10px;font-weight:900} .ws166-team-rows strong{display:block;font-size:18px;margin:3px 0 4px} .ws166-team-rows p{margin:0;color:var(--muted);font-size:13px} .ws166-team-rows em{font-style:normal;font-size:11px;font-weight:900;color:#8c5b00;background:#fff3d4;padding:7px 10px;border-radius:999px;white-space:nowrap} /* Keep FAQ headings/content aligned with the global centered FAQ treatment. */ .ws164-lifecycle + .worklix-faq-section .faq-heading, .ma164-roles + .worklix-faq-section .faq-heading{max-width:760px!important;margin-inline:auto!important;text-align:center!important} .ws164-lifecycle + .worklix-faq-section .faq-heading h2, .ma164-roles + .worklix-faq-section .faq-heading h2{margin-inline:auto!important;text-align:center!important} .ws164-lifecycle + .worklix-faq-section .faq-heading p, .ma164-roles + .worklix-faq-section .faq-heading p{max-width:650px!important;margin:16px auto 0!important;text-align:center!important} /* Confirm global section rhythm on the four recently edited pages/components without changing mobile layouts. */ .rp162-flow,.rp162-export,.rp162-faq, .ma164-live,.ma164-adherence,.ma164-exceptions,.ma164-patterns,.ma164-roles, .ws164-map,.ws164-onboard,.ws164-boundaries,.ws164-departments,.ws164-lifecycle, .ss99-section.ss100-decision-section,.ss99-faq{padding-top:var(--global-section-space)!important;padding-bottom:var(--global-section-space)!important} } @media (max-width:980px){ .ws166-record-image{margin:0;border-radius:24px;overflow:hidden;border:1px solid var(--line)} .ws166-record-image img{display:block;width:100%;height:auto;aspect-ratio:16/10;object-fit:cover} .ws166-record-image figcaption{display:none} .ws166-team-layout{display:grid;grid-template-columns:1fr;gap:16px} .ws166-team-hub{padding:24px;border-radius:24px;background:#20252d;color:#fff} .ws166-team-icon,.ws166-row-icon{width:48px;height:48px;border-radius:14px;display:grid;place-items:center;background:#fff1cf;color:#c97800} .ws166-team-icon svg,.ws166-row-icon svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round} .ws166-team-hub small{color:#ffcf43;text-transform:uppercase;font-weight:900;font-size:10px;letter-spacing:.08em} .ws166-team-hub>strong{display:block;color:#fff;font-size:24px;line-height:1.12;margin:8px 0 10px} .ws166-team-hub>p{color:#c8ced6;margin:0} .ws166-team-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:20px} .ws166-team-metrics span{border:1px solid rgba(255,255,255,.1);border-radius:12px;padding:10px;color:#ddd;font-size:11px}.ws166-team-metrics b{display:block;color:#fff;font-size:18px} .ws166-team-rows{display:grid;gap:12px} .ws166-team-rows article{display:grid;grid-template-columns:48px minmax(0,1fr);gap:14px;padding:18px;border:1px solid var(--line);border-radius:20px;background:#fff} .ws166-team-rows article>em{grid-column:2;font-style:normal;font-size:10px;font-weight:900;color:#8c5b00;background:#fff3d4;padding:6px 9px;border-radius:999px;justify-self:start} .ws166-team-rows small,.ws166-team-rows strong{display:block}.ws166-team-rows p{margin:4px 0 0;color:var(--muted)} } @media(prefers-reduced-motion:reduce){ .ws166-team-hub,.ws166-team-rows article,.ws166-row-icon{transition:none!important;transform:none!important} }