.hero-pwa{padding: 88px 0 56px; position: relative; overflow: hidden;}
  .hero-pwa::before{content:""; position:absolute; right:-180px; top:-140px; width: 540px; height: 540px; background: radial-gradient(circle, color-mix(in oklab, var(--accent) 16%, transparent), transparent 60%); filter: blur(40px); pointer-events: none;}
  .hero-pwa > *{position: relative; z-index: 1;}
  .hero-grid{display:grid; grid-template-columns: 1fr 1fr; gap: 64px; align-items: center;}

  .homescreen{
    width: 280px; height: 540px; margin: 0 auto;
    background: var(--ink); border-radius: 38px; padding: 14px;
    box-shadow: 0 40px 80px -40px oklch(0.17 0.04 330 / 0.4);
    position: relative;
  }
  .homescreen::before{content:""; position:absolute; top: 18px; left: 50%; transform: translateX(-50%); width: 96px; height: 24px; background: var(--ink); border-radius: 14px; z-index: 2;}
  .home-screen{width: 100%; height: 100%; background: linear-gradient(180deg, oklch(0.55 0.10 220), oklch(0.30 0.08 250)); border-radius: 28px; padding: 50px 16px 16px; position: relative; overflow: hidden;}
  .time{text-align: center; color: #fff; font-size: 64px; font-family: 'Instrument Serif', serif; font-weight: 400; letter-spacing: -0.02em; margin-top: 16px;}
  .date{text-align: center; color: rgba(255,255,255,0.85); font-size: 12px; margin-bottom: 32px; font-family:'JetBrains Mono', monospace; letter-spacing: 0.1em; text-transform: uppercase;}
  .icons{display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;}
  .app-icon{aspect-ratio: 1; border-radius: 14px; display: flex; align-items: center; justify-content: center; font-family: 'Instrument Serif', serif; font-size: 22px; font-style: italic; color: #fff; font-weight: 400;}
  .app-icon.Pardits{background: radial-gradient(circle at 35% 30%, oklch(0.55 0.18 352), oklch(0.520 0.190 352) 65%, oklch(0.20 0.11 350)); box-shadow: 0 8px 24px -8px oklch(0.17 0.04 330 / 0.6); position: relative;}
  .app-icon.Pardits::after{content: ""; position: absolute; top: -4px; right: -4px; width: 14px; height: 14px; border-radius: 50%; background: var(--ok); border: 2px solid #fff;}
  .app-icon.placeholder{background: rgba(255,255,255,0.15); color: rgba(255,255,255,0.4); font-size: 16px;}

  .why{display: grid; grid-template-columns: repeat(2, 1fr); gap: 22px; margin-top: 56px;}
  .why-card{background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 32px;}
  html[data-theme="dark"] .why-card{background: var(--bg-warm);}
  .why-card .ic{font-family:'Instrument Serif', serif; font-size: 36px; color: var(--accent); line-height: 1;}
  .why-card h4{font-family:'Instrument Serif', serif; font-weight: 400; font-size: 24px; margin: 14px 0 10px;}
  .why-card p{font-size: 14px; color: var(--ink-2); margin: 0;}

  .compare{width: 100%; border-collapse: collapse; margin-top: 40px; background: #fff; border: 1px solid var(--line); border-radius: 18px; overflow: hidden;}
  html[data-theme="dark"] .compare{background: var(--bg-warm);}
  .compare th, .compare td{padding: 16px 22px; text-align: left; font-size: 14px; border-bottom: 1px solid var(--line);}
  .compare thead th{background: var(--bg-warm); font-family:'JetBrains Mono', monospace; font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--ink-2); font-weight: 400;}
  html[data-theme="dark"] .compare thead th{background: var(--bg-deep);}
  .compare tbody tr:last-child td{border-bottom: none;}
  .compare td:first-child{font-weight: 400;}

  .steps{display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-top: 40px;}
  .step{background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 24px;}
  html[data-theme="dark"] .step{background: var(--bg-warm);}
  .step .n{font-family:'Instrument Serif', serif; font-size: 36px; color: var(--accent); line-height: 1;}
  .step h5{font-family:'Instrument Serif', serif; font-weight: 400; font-size: 20px; margin: 12px 0 6px;}
  .step p{font-size: 13px; color: var(--ink-2); margin: 0;}

  @media(max-width:960px){.hero-grid, .why{grid-template-columns:1fr;}}
  @media(max-width:760px){.steps{grid-template-columns: 1fr 1fr;}}