/* Layout grids */
.container{max-width:1200px;margin:0 auto;padding:0 32px}
.hero-grid{display:grid;grid-template-columns:1.05fr 0.95fr;gap:64px;align-items:center}
.journey-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.resp-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.usecase-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.assist-grid{display:grid;grid-template-columns:1fr 0.85fr;gap:64px;align-items:center}
.activity-row{display:flex;gap:64px;align-items:center;flex-wrap:wrap}
@media(max-width:900px){
  .hero-grid{grid-template-columns:1fr;gap:48px}
  .journey-grid{grid-template-columns:repeat(2,1fr)}
  .resp-grid{grid-template-columns:1fr}
  .usecase-grid{grid-template-columns:1fr}
  .assist-grid{grid-template-columns:1fr;gap:40px}
  .container{padding:0 20px}
}
@media(max-width:560px){
  .journey-grid{grid-template-columns:1fr}
}

/* Animations */
@keyframes fadeUp{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}
@keyframes pulseGlow{0%,100%{opacity:.55;transform:scale(1)}50%{opacity:.9;transform:scale(1.08)}}
@keyframes growBarA{from{width:0}to{width:60%}}
@keyframes growBarB{from{width:0}to{width:63%}}
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease-out),transform .7s var(--ease-out)}
.reveal.in{opacity:1;transform:translateY(0)}
.reveal.delay-1{transition-delay:.08s}
.reveal.delay-2{transition-delay:.16s}
.reveal.delay-3{transition-delay:.24s}
.hero-in{animation:fadeUp .8s var(--ease-out) both}
.hero-in.hero-delay-1{animation-delay:.1s}
.hero-in.hero-delay-2{animation-delay:.2s}
.hero-in.hero-delay-3{animation-delay:.3s}
.lift{transition:transform var(--dur-base) var(--ease-standard),box-shadow var(--dur-base) var(--ease-standard)}
.lift:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}

/* Base */
body{margin:0;background:var(--surface-page);font-family:var(--font-body);color:var(--fg-1);overflow-x:hidden}

/* Header */
.site-header{display:flex;align-items:center;justify-content:space-between;padding-top:28px;padding-bottom:28px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{width:28px;height:28px}
.brand span{font:600 20px var(--font-display);letter-spacing:var(--letter-tight)}
.btn-outline-pill{font:600 14px var(--font-body);color:var(--fg-1);text-decoration:none;padding:9px 18px;border:1.5px solid var(--border-default);border-radius:var(--radius-pill)}

/* Hero */
.hero-section{position:relative;overflow:hidden}
.hero-blob-a{position:absolute;top:-160px;right:-120px;width:520px;height:520px;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--teal-500) 30%,transparent) 0%,transparent 70%);pointer-events:none;animation:pulseGlow 7s ease-in-out infinite}
.hero-blob-b{position:absolute;bottom:-200px;left:-160px;width:480px;height:480px;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--blue-500) 22%,transparent) 0%,transparent 70%);pointer-events:none;animation:pulseGlow 8s ease-in-out infinite 1.5s}
.hero-inner{position:relative;padding-top:40px;padding-bottom:120px}
.hero-headline{font:600 58px/1.08 var(--font-display);letter-spacing:var(--letter-tight);margin:0 0 24px}
.hero-subhead{font:var(--text-body-lg);color:var(--fg-2);max-width:480px;margin:0 0 36px;text-wrap:pretty}
.hero-caption{font:var(--text-caption);color:var(--fg-3);margin:14px 0 0}
.hero-visual{display:flex;justify-content:center}

/* Phone mock */
.phone-mock{width:300px;background:var(--surface-sunken);border-radius:36px;padding:10px;box-shadow:var(--shadow-lg)}
.phone-mock-inner{background:var(--surface-page);border-radius:28px;padding:22px;display:flex;flex-direction:column;gap:16px;border:1px solid var(--border-subtle)}
.phone-card-title{font:var(--text-title);color:var(--fg-1)}
.phone-card-sub{font:var(--text-caption);color:var(--fg-3);margin-top:2px}
.avatar-row{display:flex}
.avatar{width:28px;height:28px;border-radius:50%;border:2px solid var(--surface-page);display:flex;align-items:center;justify-content:center;font:600 11px var(--font-display);color:#fff;margin-left:-8px}
.avatar:first-child{margin-left:0}
.avatar-teal{background:var(--teal-500)}
.avatar-blue{background:var(--blue-500)}
.avatar-coral{background:var(--coral-500)}
.avatar-amber{background:var(--amber-500)}
.avatar-blue-light{background:var(--blue-300);color:var(--navy-700)}
.progress-row{display:flex;justify-content:space-between;font:var(--text-caption);color:var(--fg-3);margin-bottom:6px}
.progress-track{height:5px;border-radius:var(--radius-pill);background:var(--surface-sunken)}
.progress-fill{height:100%;width:0;border-radius:var(--radius-pill)}
.progress-fill-primary{background:var(--brand-primary);animation:growBarA 1.1s var(--ease-out) .6s forwards}
.progress-fill-secondary{background:var(--blue-500);animation:growBarB 1.1s var(--ease-out) .8s forwards}
.phone-block{display:flex;flex-direction:column;gap:10px;padding-top:6px;border-top:1px solid var(--border-subtle)}
.phone-block-label{font:var(--text-caption);color:var(--fg-3);letter-spacing:var(--letter-wide);text-transform:uppercase}
.next-item{display:flex;align-items:center;gap:10px}
.next-item-label{font:var(--text-body-sm);color:var(--fg-1);flex:1}
.next-item-label.done{color:var(--fg-3);text-decoration:line-through}
.next-item-owner{font:var(--text-caption);color:var(--fg-3)}
.phone-collected{padding-top:12px;border-top:1px solid var(--border-subtle)}
.phone-collected-note{font:var(--text-caption);color:var(--fg-3);margin-top:8px}

/* Problem / solution */
.problem-section{background:var(--surface-sunken);padding:120px 0}
.problem-copy{text-align:center;max-width:680px;margin:0 auto 64px}
.problem-heading{font:var(--text-display-md);letter-spacing:var(--letter-tight);margin:0 0 20px}
.problem-body{font:var(--text-body-lg);color:var(--fg-2);margin:0;text-wrap:pretty}
.solution-row{display:flex;align-items:center;gap:40px;flex-wrap:wrap;justify-content:center}
.sticky-stack{position:relative;width:320px;height:220px}
.sticky-note{position:absolute;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-md);padding:12px 16px;font:var(--text-body-sm);color:var(--fg-2);box-shadow:var(--shadow-sm)}
.sticky-note-1{top:0;left:10px;transform:rotate(-6deg)}
.sticky-note-2{top:52px;right:0;transform:rotate(5deg);display:flex;align-items:center;gap:8px}
.sticky-note-3{top:118px;left:0;transform:rotate(4deg);display:flex;align-items:center;gap:8px}
.sticky-note-4{bottom:0;right:30px;transform:rotate(-4deg)}
.solution-arrow{font-size:26px;color:var(--fg-3)}
.solution-card{width:280px;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:22px;box-shadow:var(--shadow-md)}
.solution-card-title{font:var(--text-title);margin-bottom:12px}
.solution-card-row{display:flex;align-items:center;gap:10px;margin-bottom:10px}
.solution-card-row:last-child{margin-bottom:0}
.solution-card-row span{font:var(--text-body-sm);color:var(--fg-1)}

/* Shared section headings */
.section-heading-wrap{text-align:center;max-width:640px;margin:0 auto 56px}
.section-heading-wrap-narrow{text-align:center;max-width:560px;margin:0 auto 56px}
.section-heading{font:var(--text-display-md);letter-spacing:var(--letter-tight);margin:0}

/* Journey */
.journey-section{padding:120px 0}
.journey-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:28px}
.icon-badge{width:44px;height:44px;border-radius:var(--radius-md);display:flex;align-items:center;justify-content:center;margin-bottom:20px}
.icon-badge-primary{background:var(--brand-primary-tint)}
.icon-badge-secondary{background:var(--brand-secondary-tint)}
.icon-badge-warning{background:var(--warning-tint)}
.journey-card-title{font:var(--text-title);margin-bottom:8px}
.journey-card-body{font:var(--text-body-sm);color:var(--fg-2)}

/* Responsibility cards */
.resp-section{background:var(--surface-sunken);padding:120px 0}
.resp-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:22px}
.resp-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.resp-person{display:flex;align-items:center;gap:8px}
.resp-avatar{width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font:600 10px var(--font-display);color:#fff}
.resp-name{font:var(--text-caption);color:var(--fg-3)}
.resp-status{font:var(--text-caption);padding:3px 10px;border-radius:var(--radius-pill)}
.status-pending{color:var(--amber-500);background:var(--warning-tint)}
.status-done{color:var(--brand-primary);background:var(--success-tint)}
.resp-title{font:var(--text-title);margin-bottom:4px}
.resp-due{font:var(--text-caption);color:var(--fg-3)}

/* Activity feed */
.activity-section{padding:120px 0}
.activity-copy{flex:1;min-width:280px}
.activity-heading{font:var(--text-display-md);letter-spacing:var(--letter-tight);margin:0 0 20px}
.activity-body{font:var(--text-body-lg);color:var(--fg-2);margin:0;max-width:440px;text-wrap:pretty}
.activity-card{flex:1;min-width:320px;background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:28px}
.activity-list{display:flex;flex-direction:column;gap:0}
.activity-item{display:flex;gap:14px;padding-bottom:18px;border-left:2px solid var(--border-subtle);margin-left:9px;padding-left:20px;position:relative}
.activity-item:last-child{padding-bottom:0;border-left:none}
.activity-dot{position:absolute;left:-6px;top:0;width:10px;height:10px;border-radius:50%}
.activity-dot-primary{background:var(--brand-primary)}
.activity-dot-secondary{background:var(--brand-secondary)}
.activity-dot-warning{background:var(--amber-500)}
.activity-dot-neutral{background:var(--fg-3)}
.activity-text{font:var(--text-body-sm);color:var(--fg-1)}
.activity-text.muted{color:var(--fg-2)}

/* Use cases */
.usecase-section{background:var(--surface-sunken);padding:120px 0}
.usecase-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:26px}
.usecase-icon{font-size:24px;color:var(--brand-primary);margin-bottom:14px;display:block}
.usecase-title{font:var(--text-title);margin-bottom:8px}
.usecase-body{font:var(--text-body-sm);color:var(--fg-2)}

/* Assist */
.assist-section{padding:120px 0}
.assist-heading{font:var(--text-display-md);letter-spacing:var(--letter-tight);margin:0 0 20px}
.assist-body{font:var(--text-body-lg);color:var(--fg-2);margin:0;max-width:440px;text-wrap:pretty}
.assist-card{background:var(--surface-card);border:1px solid var(--border-subtle);border-radius:var(--radius-lg);padding:26px;display:flex;flex-direction:column;gap:14px}
.assist-label{display:flex;align-items:center;gap:10px;font:var(--text-caption);color:var(--fg-3);letter-spacing:var(--letter-wide);text-transform:uppercase}
.assist-receipt{background:var(--surface-sunken);border-radius:var(--radius-md);padding:16px;display:flex;flex-direction:column;gap:4px;font:var(--text-body-sm);color:var(--fg-1)}
.assist-receipt .muted{color:var(--fg-3)}
.assist-row{display:flex;align-items:center;gap:8px;font:var(--text-body-sm);color:var(--fg-2)}
.assist-row strong{color:var(--fg-1)}
.assist-row-highlight{color:var(--amber-500);border-top:1px solid var(--border-subtle);padding-top:12px}

/* Closing CTA */
.closing-section{background:var(--surface-sunken);padding:130px 0;position:relative;overflow:hidden}
.closing-blob{position:absolute;top:-140px;left:50%;transform:translateX(-50%);width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,color-mix(in oklab,var(--teal-500) 20%,transparent) 0%,transparent 70%);pointer-events:none}
.closing-inner{position:relative;text-align:center;max-width:560px;margin:0 auto}
.closing-heading{font:var(--text-display-md);letter-spacing:var(--letter-tight);margin:0 0 20px}
.closing-subhead{font:var(--text-body-lg);color:var(--fg-2);margin:0 0 32px}

/* Footer */
.site-footer{padding:48px 0}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;border-top:1px solid var(--border-subtle);padding-top:32px}
.footer-brand{display:flex;align-items:center;gap:10px}
.footer-brand img{width:22px;height:22px}
.footer-brand span{font:600 16px var(--font-display)}
.footer-links{display:flex;gap:24px;font:var(--text-body-sm)}
.footer-links a{color:var(--fg-2);text-decoration:none}
.footer-note{font:var(--text-caption);color:var(--fg-3)}

/* Forms */
.hp-field{position:absolute;left:-5000px;top:auto;width:1px;height:1px;overflow:hidden}
.ds-input-wrap{display:flex;align-items:center;height:44px;padding:0 14px;border-radius:var(--radius-sm);background:var(--surface-card);border:1.5px solid var(--border-default);transition:border var(--dur-fast) var(--ease-standard),box-shadow var(--dur-fast) var(--ease-standard)}
.ds-input-wrap:focus-within{border-color:var(--brand-secondary);box-shadow:var(--shadow-focus)}
.ds-input{flex:1;border:none;outline:none;background:transparent;font:var(--text-body);color:var(--fg-1);width:100%}
.btn-primary{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:none;border-radius:var(--radius-md);background:var(--brand-primary);color:var(--white);cursor:pointer;transition:background var(--dur-fast) var(--ease-standard),transform var(--dur-fast) var(--ease-standard);letter-spacing:var(--letter-tight)}
.btn-primary:hover{background:var(--brand-primary-hover);transform:translateY(-1px)}
.btn-primary:disabled{background:var(--gray-200);color:var(--gray-500);cursor:not-allowed;transform:none}
.btn-lg{padding:14px 26px;font:600 16px/1.2 var(--font-body)}
.signup-form-row{display:flex;gap:12px;flex-wrap:wrap;max-width:460px}
.signup-form-row.centered{justify-content:center;margin:0 auto}
.signup-field{flex:1;min-width:220px}
.form-error{font:var(--text-caption);color:var(--danger);margin:8px 0 0;min-height:16px}
.form-error.centered{text-align:center}
.turnstile-wrap{margin-top:12px}
.turnstile-wrap.centered{margin:12px auto 0;display:flex;justify-content:center}
.signup-success{display:flex;align-items:center;gap:10px;font:600 16px var(--font-body);color:var(--brand-primary)}
.signup-success[hidden]{display:none}
.signup-success.centered{justify-content:center}