/* Concept 02: optical refinement, real product imagery, editorial highlights. */
:root{--muted:#747478;--ease:cubic-bezier(.22,1,.36,1)}
.version-link{display:flex;gap:8px;align-items:center;color:#737378}.version-link span{font-size:9px;background:#eeeef0;border-radius:12px;padding:4px 7px}.version-link:hover{color:#151515}
.hero h1 span{background:none;-webkit-text-fill-color:currentColor;color:#7b7d77}.hero h1{font-weight:630;letter-spacing:-4.8px}.hero .eyebrow{font-size:20px;font-weight:550}.hero-copy{color:#747478;font-weight:400}.button{background:#213b14}.nav-cta{background:#213b14}.hero-scene{margin-top:44px}.laptop{transform:perspective(1800px) rotateX(1deg);box-shadow:0 0 0 1px #b7b8b9,0 14px 32px #00000008;background:linear-gradient(130deg,#c4c5c6,#e2e3e4 40%,#c1c2c3);padding:8px 8px 20px;border-radius:20px 20px 6px 6px}.laptop-display{border-width:6px}.hero-phone{transform:rotate(-4deg);box-shadow:0 0 0 1px #a4a7a1,1px 1px 0 2px #5a5c55,8px 24px 35px #00000012}.hero-tag{transform:rotate(-10deg);filter:drop-shadow(8px 26px 20px #23311618)}.hero-ground{background:#00000010}.hero-footnote{letter-spacing:-.1px}.section-heading>p{font-weight:450}.team-heading h2 span,.tag-intro h2 span{color:#969790}.workflow-stage{background:#f5f5f7}.privacy-section h2 span{color:#70766b}.privacy-symbol{color:#52614a}.closing-mark svg{fill:#3c552d}.team-section{background:#f6f6f8}.dashboard-shell{box-shadow:0 26px 60px #00000005;border-color:#e3e3e5}.tag-chapter{background:#0d0f0e}.tag-halo{display:none}.tag-interactive{filter:drop-shadow(14px 26px 20px #0009)}
.editorial-highlights{padding:106px 0 70px;background:#f5f5f7;overflow:hidden}.gallery-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:52px}.chapter-eyebrow{font-size:11px;letter-spacing:.105em;color:#777b73;font-weight:600;margin-bottom:23px}.gallery-heading h2{font-size:64px;line-height:1.07;letter-spacing:-2.8px;font-weight:620}.gallery-heading h2 span{color:#86868b}.editorial-link{display:flex;align-items:center;gap:18px;color:#33492a;font-size:16px;white-space:nowrap;padding-bottom:7px}.editorial-link span{font-size:23px;font-weight:300}.editorial-link:hover{text-decoration:underline;text-underline-offset:5px}.editorial-gallery{display:flex;gap:26px;overflow-x:auto;scrollbar-width:none;scroll-snap-type:x mandatory;scroll-padding-left:max(48px,calc((100vw - 1180px)/2));padding:0 max(48px,calc((100vw - 1180px)/2)) 14px;overscroll-behavior-x:contain}.editorial-gallery::-webkit-scrollbar{display:none}.editorial-gallery:focus-visible{outline-offset:-5px}.editorial-card{flex:0 0 600px;background:#fff;border-radius:28px;overflow:hidden;scroll-snap-align:start;box-shadow:0 3px 10px #00000002;display:flex;flex-direction:column;min-height:0;transition:box-shadow .4s}.editorial-card-heading{padding:36px 40px 31px;min-height:179px}.editorial-card-heading>p{font-size:11px;font-weight:600;letter-spacing:.04em;color:#777b72;margin-bottom:13px}.editorial-card h3{font-size:35px;line-height:1.08;letter-spacing:-1.15px;font-weight:620}.editorial-card>img{display:block;width:100%;height:380px;object-fit:cover;object-position:center;background:#f6f6f7}.macro-card>img{object-fit:cover;object-position:center 58%;background:#f7f7f9}.editorial-card-footer{padding:23px 35px 25px 40px;display:flex;justify-content:space-between;gap:20px;align-items:center;background:#fff;min-height:94px}.editorial-card-footer p{font-size:14px;line-height:1.5;color:#7a7d75;letter-spacing:-.15px}.editorial-card-footer a,.editorial-card-footer button{width:38px;height:38px;min-width:38px;border-radius:50%;background:#f0f1ed;color:#3f4a36;display:grid;place-items:center;font-size:22px;transition:background .25s,transform .4s var(--ease)}.editorial-card-footer a:hover,.editorial-card-footer button:hover{background:#e4e8df;transform:rotate(5deg)}.gallery-bottom{display:flex;justify-content:space-between;align-items:center;gap:25px;margin-top:31px}.gallery-bottom>p{font-size:13px;color:#82847d}.gallery-controls{display:flex;align-items:center;gap:10px}.gallery-index{font-size:11px;color:#7e8278;font-variant-numeric:tabular-nums;letter-spacing:1px;margin-right:15px}.gallery-controls button{height:40px;width:40px;background:#e6e6e9;border-radius:50%;font-size:21px;line-height:1;color:#414145;transition:background .25s,opacity .25s}.gallery-controls button:hover:not(:disabled){background:#d8d8dc}.gallery-controls button:disabled{opacity:.33}.payroll-editorial{height:380px;background:linear-gradient(120deg,#edf0ef,#e6ebe6);padding:24px 73px;overflow:hidden}.payroll-doc{background:#fff;border-radius:9px;padding:22px 27px 20px;box-shadow:0 10px 24px #3a4b3420;height:345px}.payroll-doc-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:27px}.payroll-doc-top b{font-size:14px;color:#2f4125;letter-spacing:-.5px}.payroll-doc-top>span{font-size:8px;color:#868c80}.payroll-doc>p{font-size:8px;letter-spacing:1.1px;color:#7e8774}.payroll-number{font-size:43px;letter-spacing:-1.8px;font-weight:550;margin-top:7px;color:#25371b}.payroll-number span{font-size:25px;font-weight:400;color:#8b9383}.payroll-date{font-size:8px;color:#959b8c;margin:8px 0 19px}.payroll-line{display:flex;justify-content:space-between;padding:9px 0;border-top:1px solid #e9ece6;font-size:10px;color:#6c7763}.payroll-line span:last-child{color:#314324;font-variant-numeric:tabular-nums}.payroll-doc-bottom{display:flex;justify-content:space-between;font-size:8px;color:#668252;border-top:1px solid #e9ece6;padding-top:12px;margin-top:3px}.workflow-copy h3{font-weight:610}.tag-intro h2,.team-heading h2{font-weight:620}.tag-showcase{margin-top:24px}.privacy-points h3{font-weight:600}.faqs summary{font-weight:520}.closing h2{font-weight:620}
@media(min-width:761px) and (max-width:1050px){.editorial-card{flex-basis:560px}.gallery-heading h2{font-size:54px}.editorial-gallery{padding-left:32px;padding-right:32px;scroll-padding-left:32px}.editorial-link{font-size:14px}}
@media(max-width:760px){.hero h1{font-size:55px;letter-spacing:-2.7px;font-weight:640}.hero .eyebrow{font-size:17px}.hero-scene{margin-top:35px}.editorial-highlights{padding:68px 0 43px}.gallery-heading{display:block;margin-bottom:28px}.chapter-eyebrow{font-size:9px;margin-bottom:17px}.gallery-heading h2{font-size:41px;letter-spacing:-1.8px}.editorial-link{font-size:13px;gap:10px;margin-top:22px;width:max-content}.editorial-link span{font-size:18px}.editorial-gallery{padding:0 24px 10px;gap:15px;scroll-padding-left:24px}.editorial-card{flex-basis:calc(100vw - 60px);border-radius:23px}.editorial-card-heading{padding:26px 26px 24px;min-height:155px}.editorial-card-heading>p{font-size:9px;margin-bottom:12px}.editorial-card h3{font-size:29px;letter-spacing:-1px}.editorial-card>img{height:260px;object-position:57% center}.macro-card>img{height:260px;object-position:51% center}.editorial-card-footer{padding:20px 23px 22px 26px;gap:15px;min-height:105px}.editorial-card-footer p{font-size:12px;line-height:1.45}.editorial-card-footer a,.editorial-card-footer button{min-width:40px;width:40px;height:40px}.gallery-bottom{margin-top:21px;align-items:flex-start}.gallery-bottom>p{font-size:11px;line-height:1.4;max-width:150px;padding-top:7px}.gallery-controls{gap:7px}.gallery-index{display:none}.gallery-controls button{width:40px;height:40px}.payroll-editorial{height:260px;padding:17px 23px 0}.payroll-doc{padding:19px 21px;transform:scale(.84);transform-origin:top center;width:119%;margin-left:-9.5%;height:330px}.payroll-doc-top{margin-bottom:20px}.payroll-number{font-size:40px}.team-section{padding-top:75px}.version-link{display:none}.hero-phone{transform:rotate(-4deg)}.tag-intro h2{font-size:43px}.nav-links.open .version-mobile{font-size:13px;color:#858580}}
@media(max-width:370px){.hero h1{font-size:47px;letter-spacing:-2.4px}.gallery-heading h2{font-size:35px}.editorial-card h3{font-size:27px}.editorial-card-heading{padding-left:22px}.editorial-card>img{height:230px}.payroll-editorial{height:230px;padding:12px 17px 0}.payroll-doc{transform:scale(.75);width:133%;margin-left:-16.5%}.editorial-card-footer{padding-left:22px}.editorial-card-footer p{font-size:11px}.gallery-bottom>p{max-width:130px}}
/* A true responsive document, with all four rows and footer visible. */
@media(max-width:760px){.payroll-editorial{height:260px;padding:15px 23px}.payroll-doc{width:100%;height:230px;margin:0;padding:14px 18px;transform:none}.payroll-doc-top{margin-bottom:12px}.payroll-doc-top b{font-size:12px}.payroll-doc-top>span{font-size:7px}.payroll-number{font-size:36px;line-height:1.05;margin-top:5px}.payroll-date{font-size:7px;margin:5px 0 9px}.payroll-line{font-size:9px;line-height:11px;padding:4px 0}.payroll-doc-bottom{font-size:7px;line-height:9px;padding-top:7px;margin-top:3px}}
@media(max-width:370px){.editorial-card>img{height:260px}.payroll-editorial{height:260px;padding:15px 18px}.payroll-doc{width:100%;height:230px;margin:0;transform:none}}

/* Studio device composition: preserve complete hardware and tag on every viewport. */
.photo-card>img{object-fit:cover;object-position:center;background:#fff}

/* Main hero, original application screens in a studio device composition. */
.hero-device-art{width:min(1180px,94%);margin:42px auto 0}.hero-device-art img{display:block;width:100%;height:auto}.hero-device-art+.hero-footnote{margin-top:20px}
@media(max-width:760px){.hero-device-art{width:100%;margin:34px auto 0}.hero-device-art+.hero-footnote{margin-top:16px}}

/* Screenshot layers are original app renders; never regenerated UI text. */
.hero-composite{position:relative;isolation:isolate}
.hero-composite .hero-desktop-screen{position:absolute;left:27.0645%;top:8.6498%;width:64.316%;height:67.72%;object-fit:fill}
.hero-composite .hero-mobile-screen{position:absolute;left:5.244%;top:27.532%;width:16.154%;height:60.76%;object-fit:fill;border-radius:16.4% / 7.6%}
.hero-original-tag{position:absolute;left:3.5%;bottom:1.5%;width:12%;aspect-ratio:1;border-radius:50%;overflow:hidden;transform:perspective(600px) rotateX(57deg) rotateZ(-15deg);border:1px solid #e0e0d7;box-shadow:0 2px 0 #ddd,0 7px 12px #00000020}
.hero-original-tag img{width:103%;height:103%;max-width:none;margin:-1.5%;object-fit:cover;border-radius:50%}
