/* Requested updates; the original page styling remains in style.css. */
.real-screen { position:relative; overflow:hidden; background:#f1f2f4; isolation:isolate; }
.real-screen img { display:block; width:100%; height:auto; }
.real-window { overflow:hidden; transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)); transition:transform .35s ease; }
.real-hero .real-window { animation:screen-arrive .85s cubic-bezier(.2,.8,.2,1) both; }
.real-hero .float-card { z-index:3; }
.real-hero .fc-attend { animation:pop .6s 1.2s both,screen-float 5s 1.8s ease-in-out infinite; }
.real-hero .fc-approve { animation:pop .6s .6s both,screen-float 5s 1.2s ease-in-out infinite reverse; }
@keyframes screen-arrive { from { opacity:0; transform:translateY(24px) scale(.98); } }
@keyframes screen-float { 50% { translate:0 -6px; } }
.operations-screen { container-type:inline-size; }
.screen-number { position:absolute; display:flex; justify-content:flex-end; align-items:center; background:#f2f2f2; color:#111827; font:bold 1.6cqw Arial,sans-serif; width:5.4%; height:3.1%; line-height:1; direction:ltr; font-variant-numeric:tabular-nums; padding-right:.1%; }
.number-present { left:71.5%; top:21.6%; }
.number-absent { left:33%; top:21.6%; width:6%; padding-right:.25%; }
.number-total { left:71.5%; top:34.8%; }
.clients { flex-wrap:nowrap; gap:24px; }
.clients > p { flex:0 0 auto; }
.logo-marquee { min-width:0; flex:1; overflow:hidden; direction:ltr; mask-image:linear-gradient(to right,transparent,#000 6%,#000 94%,transparent); }
.logo-track { display:flex; width:max-content; animation:logo-ticker 28s linear infinite; }
.logo-track .client-logos { display:flex; flex-wrap:nowrap; gap:20px; padding:0 10px; flex:none; }
.logo-track .client-logos li { width:144px; height:88px; flex:none; filter:none; opacity:1; }
.logo-track img { width:100%; height:100%; object-fit:contain; }
.logo-marquee:hover .logo-track,.logo-marquee.is-paused .logo-track { animation-play-state:paused; }
.marquee-toggle { width:32px; height:32px; flex:none; border:1px solid var(--line); border-radius:50%; display:grid; place-items:center; color:var(--muted); }
@keyframes logo-ticker { to { transform:translateX(-50%); } }
.real-scene { display:flex; flex-direction:column; gap:18px; padding:28px; }
.scene-title { font-family:var(--f-display); font-size:1rem; font-weight:600; }
.real-scene .real-screen { border-radius:16px; border:1px solid var(--line); box-shadow:var(--shadow-2); flex:1; min-height:0; transition:transform .6s; }
.real-scene .real-screen img { height:100%; object-fit:cover; object-position:top; }
.real-scene:not(.is-active) .real-screen { transform:translateY(20px) scale(.98); }
.screen-stats { display:flex; gap:12px; }
.screen-stats > div { flex:1; background:#fff; border:1px solid var(--line); border-radius:15px; padding:12px 16px; box-shadow:var(--shadow-1); display:flex; align-items:center; gap:12px; }
.screen-stats b { font-family:var(--f-display); font-size:1.65rem; line-height:1.4; color:var(--navy); font-variant-numeric:tabular-nums; }
.screen-stats small { font-size:.8rem; color:var(--muted); }
.ss-grid { grid-template-columns:1fr minmax(360px,1.8fr) 1fr; gap:28px; }
.real-service { width:100%; min-width:0; }
.service-screens { width:100%; }
.service-panel { animation:screen-arrive .4s both; }
.service-panel .real-screen { border:1px solid var(--line); border-radius:18px; box-shadow:var(--shadow-2); aspect-ratio:1.25; }
.service-panel .real-screen img { width:100%; height:100%; object-fit:cover; object-position:50% 30%; }
.service-panel .operations-screen { aspect-ratio:5824/4000; }
.service-panel .operations-screen img { height:auto; }
.service-panel .screen-stats { margin-top:16px; }
.real-screen.leave-screen { background:#fff url('assets/leave.png') 49.5% 50.4% / 224% 198% no-repeat; }
.real-screen.leave-screen img { opacity:0; }
.real-dash { padding:24px; }
.report-toolbar { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:20px; flex-wrap:wrap; }
.report-tabs { display:flex; padding:5px; border-radius:99px; background:var(--paper); gap:4px; }
.report-tabs button { font-size:.9rem; padding:8px 18px; border-radius:99px; white-space:nowrap; }
.report-tabs button[aria-selected="true"] { background:var(--navy); color:white; }
.report-panel .screen-stats { margin-bottom:18px; }
.report-panel .real-screen { border:1px solid var(--line); border-radius:18px; animation:screen-arrive .45s both; max-height:720px; overflow:auto; }
.report-panel .operations-screen { max-height:none; }
.source-apps { grid-template-columns:repeat(6,minmax(0,1fr)); padding:22px 14px; gap:20px 10px; }
.source-apps .app { font-size:.66rem; overflow-wrap:anywhere; gap:6px; }
.source-apps .app .source-icon { --icon:54px; width:var(--icon); height:var(--icon); background-color:white; background-image:url('assets/apps.png'); background-size:calc(var(--icon) * 1888 / 94) calc(var(--icon) * 1336 / 94); background-position:calc(var(--icon) * var(--sx) / -94) calc(var(--icon) * var(--sy) / -94); background-repeat:no-repeat; border-radius:9px; box-shadow:0 4px 10px #161b4e12; }
.source-apps .app.hr i::after { display:none; }
.apps-scene.is-playing .source-apps .app { animation-delay:calc(var(--i) * 35ms); }
.drawer-head,.drawer-home { display:none!important; }
.nav-backdrop { position:fixed; inset:0; background:#10153480; z-index:99; backdrop-filter:blur(3px); }
.floating-contact { position:fixed; z-index:90; left:22px; bottom:calc(92px + env(safe-area-inset-bottom,0px)); display:grid; gap:12px; }
.contact-float { width:58px; height:58px; border-radius:50%; display:grid; place-items:center; background:var(--navy); color:white; box-shadow:0 8px 20px #161b4e35; transition:transform .2s; }
.contact-float .ic { width:26px; height:26px; }
.mail-float { background:white; color:var(--navy); border:1px solid var(--line); }
.contact-float:hover { transform:scale(1.06); }
.form-trap { position:absolute; width:1px; height:1px; padding:0; overflow:hidden; clip-path:inset(50%); }
.form-status { color:var(--muted); font-size:.88rem; margin-top:14px; }
.mail-fallback { display:inline-block; color:var(--navy); margin-top:8px; text-decoration:underline; font-weight:600; }
.cta-form button:disabled { opacity:.6; cursor:wait; }
@media(max-width:1100px) { .ss-grid { grid-template-columns:1fr 1fr; } .real-service { grid-column:1/-1; max-width:700px; margin:auto; } }
@media(max-width:960px) {
  .header-actions { margin-inline-start:auto; }
  .site-header { backdrop-filter:none; -webkit-backdrop-filter:none; background:#fffffffa; }
  .main-nav { position:fixed; top:0; right:auto; left:0; width:min(360px,86vw); height:100vh; height:100dvh; padding:24px; overflow-y:auto; background:#fff; border:0; z-index:101; transform:translateX(-100%); opacity:1; visibility:hidden; box-shadow:10px 0 45px #161b4e22; gap:8px; }
  .main-nav.is-open { transform:translateX(0); visibility:visible; }
  .drawer-head { display:flex!important; align-items:center; justify-content:space-between; gap:8px; margin-bottom:18px; }
  .drawer-head .brand { padding:0; gap:8px; }
  .drawer-head .brand-text b { font-size:.86rem; }
  .drawer-head .brand-text small { font-size:.65rem; }
  .drawer-head .brand-mark { width:34px; height:34px; }
  .nav-close { display:grid; place-items:center; width:36px; height:36px; flex:none; border-radius:10px; background:var(--paper); }
  .drawer-home { display:block!important; }
  .nav-mobile-cta { display:grid; gap:12px; margin-top:20px; }
  .main-nav .nav-mobile-cta .btn-primary { color:white; }
  .nav-open { overflow:hidden; }
  .nav-open .floating-contact,.nav-open .wa-float,.nav-open .mobile-cta { visibility:hidden; }
  .source-apps { gap:24px 12px; }
  .source-apps .app { font-size:.78rem; }
  .source-apps .app .source-icon { --icon:62px; }
}
@media(max-width:600px) {
  .clients { flex-wrap:wrap; gap:10px; }
  .clients > p { width:100%; text-align:center; }
  .logo-marquee { flex-basis:calc(100% - 44px); }
  .logo-track .client-logos li { width:118px; height:78px; }
  .real-hero { padding-top:40px; padding-bottom:60px; }
  .real-hero .float-card { max-width:90%; }
  .real-scene { padding:16px; gap:12px; }
  .acc-item .stage { height:390px; }
  .screen-stats > div { padding:10px; gap:8px; }
  .screen-stats b { font-size:1.35rem; }
  .screen-stats small { font-size:.7rem; }
  .ss-grid { gap:24px 16px; }
  .ss-side .ticks { font-size:.9rem; }
  .ss-who h3 { font-size:1.15rem; }
  .real-dash { padding:14px; }
  .report-toolbar { gap:8px; }
  .report-tabs { width:100%; justify-content:space-between; }
  .report-tabs button { font-size:.78rem; padding:8px 10px; }
  .report-panel .screen-stats { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .source-apps { grid-template-columns:repeat(3,minmax(0,1fr)); padding:22px 12px; gap:20px 10px; }
  .source-apps .app { font-size:.74rem; }
  .source-apps .app .source-icon { --icon:58px; }
  .floating-contact { left:14px; bottom:calc(148px + env(safe-area-inset-bottom,0px)); gap:9px; }
  .contact-float { width:46px; height:46px; }
  .contact-float .ic { width:23px; height:23px; }
  .wa-float { left:14px; bottom:calc(92px + env(safe-area-inset-bottom,0px)); width:46px; height:46px; }
}
@media(prefers-reduced-motion:reduce) {
  .logo-track,.real-hero .float-card,.real-hero .real-window,.service-panel,.report-panel .real-screen { animation:none!important; }
  .logo-marquee { overflow-x:auto; }
  .logo-track .client-logos[aria-hidden] { display:none; }
  .marquee-toggle { display:none; }
  .real-window { transform:none!important; }
}