.pw-service { color:#191b1a; background:#f5f3ed; }
.pw-service h1,.pw-service h2 { margin:0; font-weight:800; line-height:1.03; letter-spacing:0; }
.pw-service h2 { font-size:62px; }
.pw-service h2 em { font-weight:500; font-style:normal; color:#686761; }
.pw-hero { position:relative; overflow:clip; isolation:isolate; color:#fff9f0; background:#282723; }
.pw-hero-image { position:absolute; inset:0; z-index:-2; }
.pw-hero-image img { height:100%; object-position:65% 46%; }
.pw-hero::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(90deg,#1a1917f5 2%,#23201ddb 30%,#231f1c33 65%,transparent 90%); }
.pw-hero-inner { min-height:min(650px,75svh); display:grid; grid-template-rows:auto 1fr; align-items:center; padding-block:28px 48px; }
.pw-hero .exp-back { color:#fff9f0; justify-self:start; margin:0; }
.pw-hero .exp-kicker,.pw-showcase .exp-kicker { color:#ecb097; }
.pw-hero h1 { max-width:650px; font-size:81px; overflow-wrap:anywhere; }
.pw-hero-lead { max-width:39ch; margin:20px 0; color:#f1eae1; font-size:19px; }
.pw-hero-jump { display:inline-flex; gap:14px; padding-block:9px; border-bottom:1px solid #c98569; color:#fff9f0; text-decoration:none; }
.pw-hero-jump span { color:#f0ad8f; }
.pw-challenge { display:grid; grid-template-columns:minmax(0,1.25fr) minmax(0,.8fr); align-items:end; gap:44px; padding-block:108px; }
.pw-challenge article p { margin:0; font-size:17px; }
.pw-challenge article > p + p { margin-block-start:16px; }
.pw-challenge article > p + p:last-child { margin-block-start:20px; }
.pw-showcase { color:#f9f4eb; background:#141617; }
.pw-stage { position:relative; display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.38fr); align-items:center; min-height:640px; }
.pw-stage-copy { position:relative; z-index:1; grid-column:1; grid-row:1; width:min(100% - 4rem,470px); margin-inline:auto 0; padding-block:48px; }
.pw-stage h2 em { color:#c8a999; }
.pw-chapters { padding:0; margin:34px 0 0; list-style:none; }
.pw-chapters li { padding:15px 0; border-top:1px solid #ffffff30; }
.pw-chapters li span { color:#edb096; font:600 12px/1.35 ui-monospace,Consolas,monospace; text-transform:uppercase; }
.pw-chapters li p { max-width:33ch; margin:9px 0 0; color:#ded8d0; font-size:16px; }
.pw-showcase[data-ready] .pw-chapters { min-height:116px; }
.pw-device-stage { position:relative; isolation:isolate; grid-column:2; grid-row:1; height:100%; min-height:640px; overflow:clip; background:radial-gradient(ellipse at 47% 48%,#494742 0,#292b2b 39%,#141617 74%); }
.pw-phone-model { position:absolute; inset:0; pointer-events:none; }
.pw-phone-model canvas { display:block; width:100%; height:100%; }
.pw-screen { --pw-static-scale:.77; position:absolute; top:50%; left:50%; width:360px; height:706px; transform:translate(-50%,-50%) scale(var(--pw-static-scale)); border-radius:29px; overflow:hidden; background:#f4f2e9; color:#203029; box-shadow:0 0 0 7px #373a39,0 0 0 9px #737571,0 30px 64px #000b; }
.pw-showcase[data-ready] .pw-screen { top:0; left:0; transform-origin:0 0; }
.pw-showcase[data-render="webgl"] .pw-screen { box-shadow:none; }
.pw-phone-ui { position:relative; display:flex; flex-direction:column; height:100%; color:#203029; background:#f2f0e7; font:14px/1.35 Manrope,system-ui,sans-serif; }
.pw-phone-ui [hidden],.pw-chapters [hidden] { display:none; }
.pw-status { position:relative; z-index:3; display:flex; justify-content:space-between; align-items:center; min-height:44px; flex:none; padding:4px 19px 0; font-size:12px; font-weight:800; background:#f2f0e7; }
.pw-phone-ui[data-launcher] .pw-status { color:#faf5ec; background:transparent; }
.pw-camera { position:absolute; left:50%; top:14px; width:47px; height:13px; transform:translateX(-50%); border-radius:9px; background:#161918; }
.pw-camera::after { content:""; position:absolute; right:5px; top:4px; width:5px; height:5px; border-radius:50%; background:#41515d; }
.pw-signal { display:flex; align-items:center; gap:5px; }
.pw-signal i,.pw-app-message > span { width:7px; height:7px; border-radius:50%; background:#4d805f; }
.pw-phone-ui[data-phase="offline"] .pw-signal i,.pw-phone-ui[data-phase="pending"] .pw-signal i { background:#bb6335; }
.pw-browser { display:flex; align-items:center; gap:8px; flex:none; height:52px; padding:6px 11px 9px; background:#e6e4db; overflow:hidden; opacity:var(--pw-browser,1); height:calc(52px * var(--pw-browser,1)); padding-block:calc(6px * var(--pw-browser,1)) calc(9px * var(--pw-browser,1)); }
.pw-address { flex:1; min-width:0; white-space:nowrap; padding:7px 9px; border-radius:6px; color:#353e38; background:#faf8f1; font-size:12px; }
.pw-address span { color:#486858; margin-right:4px; }
.pw-browser-tools { display:flex; align-items:center; gap:8px; color:#414842; font-size:16px; }
.pw-workspace { display:flex; flex-direction:column; min-height:0; flex:1; }
.pw-app-top { display:flex; flex:none; align-items:center; gap:8px; min-height:48px; padding:0 17px; border-bottom:1px solid #d6d8ca; background:#f2f0e7; }
.pw-app-top strong { font-size:15px; }
.pw-app-top > span:last-child { margin-left:auto; color:#586760; font-size:10px; font-weight:800; }
.pw-trace-mark { display:inline-block; position:relative; flex:none; width:26px; height:26px; background:#c7dfac; border-radius:5px; }
.pw-trace-mark::before,.pw-trace-mark::after { content:""; position:absolute; width:12px; height:5px; transform:skewX(-26deg); background:#243e32; }
.pw-trace-mark::before { top:7px; left:8px; }
.pw-trace-mark::after { top:14px; left:6px; }
.pw-app-content { min-height:0; flex:1; padding:13px 17px; overflow:auto; scrollbar-width:none; }
.pw-job { position:relative; display:grid; align-items:end; height:118px; border-radius:7px; overflow:hidden; isolation:isolate; color:#fffdf3; background:#303a32; }
.pw-job img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; z-index:-2; }
.pw-job::after { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(0deg,#1b2b24ed,#1c2b2480 55%,transparent); }
.pw-job div { padding:12px; }
.pw-job div span { display:block; margin-bottom:3px; color:#e1eabf; font-size:10px; font-weight:800; }
.pw-job div strong { display:block; font-size:21px; }
.pw-task-heading { display:flex; align-items:baseline; justify-content:space-between; gap:10px; margin:14px 0 5px; }
.pw-task-heading h3 { margin:0; font-size:16px; }
.pw-task-heading > span { color:#58675b; font-size:11px; font-weight:800; white-space:nowrap; }
.pw-tasks { list-style:none; padding:0; margin:0; }
.pw-tasks li { min-height:54px; display:grid; grid-template-columns:17px minmax(0,1fr) auto; align-items:center; gap:8px; padding:3px 0; border-bottom:1px solid #d4d8c9; }
.pw-tasks strong,.pw-tasks small,.pw-app-message strong,.pw-app-message small { display:block; }
.pw-tasks strong { font-size:12px; }
.pw-tasks small,.pw-tasks li > span:last-child,.pw-app-message small { color:#52635a; font-size:11px; }
.pw-check { position:relative; width:14px; height:14px; border:1px solid #768278; border-radius:4px; }
.pw-done,.pw-phone-ui[data-complete] .pw-featured-task .pw-check { border-color:#41624f; background:#41624f; }
.pw-done::after,.pw-phone-ui[data-complete] .pw-featured-task .pw-check::after { content:""; position:absolute; top:2px; left:4px; width:4px; height:7px; transform:rotate(40deg); border:solid white; border-width:0 1.5px 1.5px 0; }
.pw-featured-task button,.pw-install button { border:0; background:#254738; color:#f6f8ed; border-radius:5px; min-height:44px; padding:0 10px; cursor:pointer; font:800 11px/1.3 Manrope,system-ui,sans-serif; }
.pw-featured-task button:hover,.pw-install button:hover { background:#38634d; }
.pw-app-message { position:relative; overflow:hidden; display:flex; align-items:center; gap:8px; padding:8px; margin-top:12px; border-radius:6px; background:#e2ead7; font-size:12px; }
.pw-app-message > span { flex:none; }
.pw-phone-ui[data-phase="pending"] .pw-app-message,.pw-phone-ui[data-phase="offline"] .pw-app-message { background:#f2e5cf; }
.pw-phone-ui[data-phase="pending"] .pw-app-message > span,.pw-phone-ui[data-phase="offline"] .pw-app-message > span { background:#b26d41; }
.pw-phone-ui[data-phase="syncing"] .pw-app-message > span { outline:4px solid #4d805f55; }
.pw-phone-ui[data-phase="syncing"] .pw-app-message::after { content:""; position:absolute; inset:auto 0 0; height:2px; background:#4d805f; transform:scaleX(var(--pw-transfer,0)); transform-origin:left; }
.pw-app-foot { min-height:46px; flex:none; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:0 17px 8px; border-top:1px solid #d4d8c9; background:#e9ecdf; font-size:11px; }
.pw-app-foot strong { color:#2f6247; }
.pw-gesture { position:absolute; z-index:4; width:88px; height:4px; left:50%; bottom:6px; transform:translateX(-50%); background:#26342d; border-radius:4px; pointer-events:none; }
.pw-phone-ui[data-launcher] .pw-gesture { background:#e9eee2; }
.pw-install,.pw-launcher { position:absolute; z-index:2; inset:44px 0 0; }
.pw-install { display:grid; align-items:end; background:#172c2480; opacity:var(--pw-sheet,1); }
.pw-install-sheet { margin:0 12px 15px; padding:16px; border-radius:8px; background:#faf7ed; box-shadow:0 0 25px #10211945; transform:translateY(calc((1 - var(--pw-sheet,1)) * 36px)); }
.pw-install-sheet > strong { display:block; margin-top:6px; font-size:18px; }
.pw-install-sheet p { margin:5px 0 11px; }
.pw-install button { width:100%; font-size:13px; }
.pw-launcher { inset:0; display:grid; grid-template-rows:auto auto 1fr auto; gap:24px; padding:72px 19px 25px; color:#fbf8ef; opacity:var(--pw-home,1); transform:scale(calc(.98 + .02 * var(--pw-home,1))); background:#26362f; }
.pw-launcher::before { content:""; position:absolute; inset:0; z-index:-1; background:linear-gradient(157deg,#142921df,#244338ab 56%,#121b18ec),url("hero-landscape.webp") 58% 54% / cover; }
.pw-launcher-date { display:grid; gap:2px; padding-inline:7px; }
.pw-launcher-date span { color:#e1e8db; font-size:13px; font-weight:750; }
.pw-launcher-date strong { font-size:26px; line-height:1.18; }
.pw-launcher-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:19px 4px; list-style:none; margin:0; padding:0; }
.pw-launcher-grid li,.pw-launcher button { display:grid; justify-items:center; align-content:start; gap:6px; min-width:0; font-size:11px; font-weight:750; line-height:1.3; }
.pw-launcher button { width:100%; padding:0; background:none; color:inherit; border:0; font-family:inherit; cursor:pointer; border-radius:8px; }
.pw-launcher button:focus-visible { outline:2px solid #f2f4d9; outline-offset:4px; }
.pw-launcher-icon,.pw-launcher .pw-trace-mark { width:53px; height:53px; border-radius:13px; box-shadow:inset 0 1px 0 #ffffff5e,0 3px 9px #0b171f55; }
.pw-launcher-icon { display:grid; place-items:center; color:#283a30; background:#e4e6dc; }
.pw-launcher-icon svg { width:26px; height:26px; fill:none; stroke:currentColor; stroke-width:1.55; stroke-linecap:round; stroke-linejoin:round; }
.pw-icon-calendar { color:#813e32; background:#f1ded7; }
.pw-icon-photos { color:#394751; background:#b7c9d6; }
.pw-icon-maps { color:#314e43; background:#d3e3d6; }
.pw-icon-notes { color:#5f4a2b; background:#ead4a5; }
.pw-icon-clock { color:#e9e4dc; background:#3b4850; }
.pw-icon-files { color:#334d67; background:#d9e4ed; }
.pw-icon-phone { color:#294a39; background:#c8dfc1; }
.pw-icon-messages { color:#2a4c4a; background:#bcd8d4; }
.pw-icon-camera { color:#443f45; background:#d9d2d8; }
.pw-launcher .pw-trace-mark::before,.pw-launcher .pw-trace-mark::after { width:23px; height:9px; }
.pw-launcher .pw-trace-mark::before { left:17px; top:15px; }
.pw-launcher .pw-trace-mark::after { left:13px; top:28px; }
.pw-launcher button .pw-trace-mark { outline:1px solid #e3efc8; outline-offset:2px; }
.pw-launcher button:hover .pw-trace-mark { box-shadow:inset 0 1px 0 #ffffff5e,0 0 13px #d5eca866; }
.pw-launcher-dock { grid-row:4; display:flex; justify-content:space-evenly; gap:10px; padding:10px 12px; border:1px solid #e8ebdc3d; border-radius:18px; background:#d5e2d72e; }
.pw-launcher-dock .pw-launcher-icon { width:47px; height:47px; border-radius:11px; }
.pw-launcher-dock svg { width:24px; height:24px; }
.pw-controls:not([hidden]) { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); padding:0 0 28px; border:0; }
.pw-controls label { position:relative; min-height:52px; padding:12px 8px; border-top:1px solid #72706d; color:#ddd6ce; cursor:pointer; font-size:14px; }
.pw-controls label > span:first-of-type { color:#dda88f; margin-right:7px; font-size:11px; }
.pw-controls label:has(:checked) { color:white; border-color:#eca486; background:#ffffff0a; }
.pw-controls label:has(:focus-visible) { outline:2px solid #eca486; outline-offset:-2px; }
.pw-controls input { position:absolute; inset:0; width:100%; height:100%; margin:0; opacity:0; cursor:pointer; }
.pw-build { padding-block:104px; }
.pw-capabilities { margin-top:34px; border-bottom:1px solid #cecac0; }
.pw-capabilities details { border-top:1px solid #cecac0; }
.pw-capabilities summary { display:grid; grid-template-columns:55px 1fr auto; align-items:center; gap:12px; padding-block:16px; cursor:pointer; font-size:23px; font-weight:750; }
.pw-capabilities summary::-webkit-details-marker { display:none; }
.pw-capabilities summary span { color:#8f4b36; font-size:13px; }
.pw-capabilities summary::after { content:"+"; color:#8f4b36; }
.pw-capabilities details[open] summary::after { content:"-"; }
.pw-capabilities details p { margin:0 0 20px 67px; max-width:55ch; color:#4d4c47; }
.pw-contact { position:relative; isolation:isolate; overflow:clip; background:#272923; color:#f8f4ea; }
.pw-contact img,.pw-contact::after { position:absolute; inset:0; width:100%; height:100%; z-index:-2; object-fit:cover; object-position:50% 66%; }
.pw-contact::after { content:""; z-index:-1; background:linear-gradient(270deg,#161916fa,#191a17dd 45%,#1f211d40); }
.pw-contact h2 em { color:#e6b7a3; }
.pw-contact .exp-kicker { color:#ecc1ae; }
.pw-contact-inner { padding-block:100px; }
.pw-contact .pw-contact-cta { margin-top:26px; min-height:48px; color:#29231f; background:#f2e6d7; border-color:#f2e6d7; }
.pw-contact .pw-contact-cta:hover { background:#efc7af; border-color:#efc7af; }
.pw-contact-cta span { color:#873f2b; }
.pw-related { padding-block:62px; }
@media (min-width:701px) {
  .pw-contact-inner { padding-inline-start:min(36%,460px); }
}
@media (min-width:980px) and (min-height:700px) and (prefers-reduced-motion:no-preference) {
  .pw-showcase[data-ready] .pw-track { height:275svh; }
  .pw-showcase[data-ready] .pw-frame { display:grid; grid-template-rows:minmax(0,1fr) auto; position:sticky; top:0; height:100svh; }
  .pw-showcase[data-ready] .pw-stage,.pw-showcase[data-ready] .pw-device-stage { min-height:0; }
}
@media (max-width:1000px) {
  .pw-hero h1 { font-size:70px; }
  .pw-service h2 { font-size:52px; }
}
@media (max-width:700px) {
  .pw-hero-inner { min-height:min(590px,75svh); padding-block:24px 40px; align-items:end; }
  .pw-hero-inner > a { align-self:start; }
  .pw-hero::after { background:linear-gradient(0deg,#1c1b18f5 10%,#201d19c9 45%,#211c1929 90%); }
  .pw-hero h1 { font-size:49px; }
  .pw-hero-lead { font-size:16px; }
  .pw-service h2 { font-size:38px; }
  .pw-challenge { grid-template-columns:minmax(0,1fr); gap:20px; }
  .pw-challenge,.pw-build,.pw-contact-inner { padding-block:62px; }
  .pw-contact::after { background:linear-gradient(90deg,#161916f5,#191a17c9 52%,#1f211d40); }
  .pw-stage { grid-template-columns:minmax(0,1fr); }
  .pw-stage-copy { grid-row:1; grid-column:1; margin-inline:auto; width:calc(100% - 2rem); padding:47px 0 0; }
  .pw-chapters { margin-top:23px; }
  .pw-showcase[data-ready] .pw-chapters { min-height:105px; }
  .pw-device-stage { grid-column:1; grid-row:2; height:520px; min-height:0; }
  .pw-screen { --pw-static-scale:.65; }
  .pw-controls:not([hidden]) { padding:0 0 22px; }
  .pw-controls label { font-size:11px; padding-inline:1px; text-align:center; }
  .pw-controls label > span:first-of-type { display:block; margin:0 0 3px; }
  .pw-capabilities summary { grid-template-columns:28px 1fr auto; gap:8px; font-size:17px; }
  .pw-capabilities details p { margin-left:36px; }
}
@media (max-width:359px) {
  .pw-hero h1 { font-size:41px; }
  .pw-screen { --pw-static-scale:.61; }
  .pw-controls label { font-size:10px; }
}
@media (prefers-reduced-motion:no-preference) {
  .pw-hero-image img { transform:scale(1.05) translateY(var(--pw-hero-shift,0px)); }
}
