/* Local Automation - one source for the site's design.

   Extracted verbatim from the landing page, which was the only page carrying the whole
   system. Every page links this file, so the palette, type, buttons, cards, header and
   footer cannot drift apart page by page again.

   Palette verified for contrast, not eyeballed:
     ink #16130F 18.5:1 on white, muted #6B6257 6.0:1, action #C2410C 5.2:1 with white text.
     amber #F59E0B measures 2.15:1, so it is DECORATION ONLY, never text.
*/
/* Palette verified for contrast, not eyeballed:
       ink #16130F 18.5:1 on white, muted #6B6257 6.0:1, action #C2410C 5.2:1 with white text.
       amber #F59E0B measures 2.15:1, so it is DECORATION ONLY (glows, rules, marks), never text. */
  *{margin:0;padding:0;box-sizing:border-box}
  :root{
    --ink:#16130F; --muted:#6B6257; --faint:#8A8073;
    --action:#C2410C; --action-hi:#9A3412;
    --amber:#F59E0B; --line:#E7E2DA; --tint:#FAF8F5;
    --ease:cubic-bezier(.16,1,.3,1);
    --pad:clamp(1.25rem,5vw,4.5rem);
    --mono:'JetBrains Mono',ui-monospace,SFMono-Regular,Menlo,monospace;
  
    /* The design is white. Without this a browser in auto-dark or a dark OS preference
       inverts the page and the measured contrast no longer holds. */
    color-scheme: only light;}
  html{scroll-behavior:smooth}
  body{background:#fff;color:var(--ink);font-family:Inter,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
  a{color:inherit;text-decoration:none}
  img,video{display:block;max-width:100%}
  .wrap{max-width:1180px;margin:0 auto;padding:0 var(--pad)}
  .mono{font-family:var(--mono)}

  /* progressive: visible by default, hidden only once JS opts in */
  .js .rv{opacity:0;transform:translateY(16px);transition:opacity .7s var(--ease),transform .7s var(--ease)}
  .js .rv.in{opacity:1;transform:none}
  @media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}}

  /* ---------- nav ---------- */
  header{position:sticky;top:0;z-index:60;background:rgba(255,255,255,.86);backdrop-filter:blur(12px);border-bottom:1px solid transparent;transition:border-color .25s}
  header.stuck{border-bottom-color:var(--line)}
  .nav{display:flex;align-items:center;justify-content:space-between;gap:1rem;height:4.25rem}
  .brand{display:flex;align-items:center;gap:.6rem;font-weight:600;letter-spacing:-.01em;font-size:1.02rem}
  .brand svg{width:26px;height:26px;flex:none}
  .navlinks{display:none;gap:1.75rem}
  @media(min-width:920px){.navlinks{display:flex}}
  .navlinks a{font-size:.9rem;color:var(--muted);font-weight:500;transition:color .2s}
  .navlinks a:hover{color:var(--ink)}
  .navactions{display:flex;align-items:center;gap:.6rem}
  .ghost{font-size:.9rem;font-weight:500;color:var(--muted);padding:.55rem .5rem}
  .ghost:hover{color:var(--ink)}
  @media(max-width:420px){.ghost{display:none}}
  .btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;background:var(--action);color:#fff;font-weight:600;font-size:.95rem;padding:.78rem 1.15rem;border-radius:10px;border:0;cursor:pointer;transition:background .2s,transform .2s}
  .btn:hover{background:var(--action-hi)}
  .btn:active{transform:translateY(1px)}
  .btn.big{font-size:1.02rem;padding:1rem 1.5rem;border-radius:12px}
  .btn.sec{background:#fff;color:var(--ink);border:1px solid var(--line)}
  .btn.sec:hover{background:var(--tint)}
  .btn[aria-disabled=true]{background:#EFEBE5;color:var(--faint);cursor:default}
  :focus-visible{outline:3px solid #1D4ED8;outline-offset:2px;border-radius:6px}

  /* ---------- hero ---------- */
  .hero{padding:clamp(2.5rem,7vh,5rem) 0 clamp(3rem,8vh,5.5rem);background:linear-gradient(180deg,#fff 0%,var(--tint) 100%)}
  .herogrid{display:grid;grid-template-columns:minmax(0,1fr);gap:2.5rem;align-items:center}
  @media(min-width:980px){.herogrid{grid-template-columns:minmax(0,1.06fr) minmax(0,.94fr);gap:3rem}}
  .eyebrow{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);font-weight:500;margin-bottom:1.1rem;display:flex;align-items:center;gap:.6rem}
  .eyebrow::before{content:"";width:22px;height:2px;background:var(--action);flex:none}
  h1{font-size:clamp(2.1rem,5.4vw,3.6rem);line-height:1.04;letter-spacing:-.035em;font-weight:700}
  .sub{margin-top:1.25rem;font-size:clamp(1.02rem,1.6vw,1.16rem);color:var(--muted);max-width:34rem}
  .herocopy{min-width:0}
  .ctas{display:flex;flex-wrap:wrap;gap:.8rem;margin-top:1.9rem}
  .trustline{display:flex;flex-wrap:wrap;gap:.5rem 1.5rem;margin-top:1.5rem;font-family:var(--mono);font-size:.78rem;color:var(--muted)}
  .trustline span::before{content:"·";color:var(--faint);margin-right:.45rem;font-weight:700}
  .heroart{position:relative;min-width:0;justify-self:center;width:min(80vw,420px)}
  @media(min-width:980px){.heroart{width:100%;max-width:460px}}
  .heroart .tile{border-radius:20%;overflow:hidden;box-shadow:0 24px 60px rgba(22,19,15,.13),0 2px 6px rgba(22,19,15,.06)}
  .heroart .tile video{width:100%;height:auto}
  .buycard{position:absolute;right:-.4rem;bottom:-1.1rem;background:#fff;border:1px solid var(--line);border-radius:12px;padding:.7rem .85rem;box-shadow:0 12px 28px rgba(22,19,15,.10);display:flex;align-items:center;gap:.6rem}
  .buycard b{font-family:var(--mono);font-size:.82rem}
  .buycard span{font-size:.72rem;color:var(--muted);display:block}
  .dot{width:9px;height:9px;border-radius:50%;background:var(--amber);box-shadow:0 0 0 4px rgba(245,158,11,.18);flex:none}

  /* ---------- sections ---------- */
  section{padding:clamp(3.5rem,9vh,6rem) 0}
  .tint{background:var(--tint);border-block:1px solid var(--line)}
  h2{font-size:clamp(1.6rem,3.4vw,2.3rem);line-height:1.1;letter-spacing:-.03em;font-weight:700;max-width:26ch}
  .kick{font-family:var(--mono);font-size:.72rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);font-weight:500;margin-bottom:.9rem;display:flex;align-items:center;gap:.6rem}
  .kick::before{content:"";width:22px;height:2px;background:var(--action);flex:none}
  .lead{margin-top:1rem;color:var(--muted);max-width:40rem}
  .steps{display:grid;gap:2rem;margin-top:3rem}
  @media(min-width:820px){.steps{grid-template-columns:repeat(3,1fr);gap:2.5rem}}
  .step .n{font-family:var(--mono);font-size:.78rem;color:var(--action);font-weight:700;letter-spacing:.1em}
  .step h3{margin:.55rem 0 .5rem;font-size:1.12rem;letter-spacing:-.01em}
  .step p{color:var(--muted);font-size:.95rem}

  /* modules */
  .grid{display:grid;gap:1px;background:var(--line);border:1px solid var(--line);border-radius:14px;overflow:hidden;margin-top:2.5rem}
  @media(min-width:640px){.grid{grid-template-columns:repeat(2,1fr)}}
  @media(min-width:1020px){.grid{grid-template-columns:repeat(3,1fr)}}
  .mod{background:#fff;padding:1.35rem;display:flex;gap:1rem;align-items:flex-start;transition:background .2s}
  .mod:hover{background:var(--tint)}
  .mod img,.mod video{width:128px;height:128px;border-radius:32px;flex:none}
  .mod h3{font-size:1rem;letter-spacing:-.01em;margin-bottom:.3rem}
  .mod p{font-size:.9rem;color:var(--muted)}
  .chip{display:inline-block;margin-top:.6rem;font-family:var(--mono);font-size:.66rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);border:1px solid var(--line);border-radius:6px;padding:.22rem .45rem}

  /* pricing */
  .tiers{display:grid;gap:1.25rem;margin-top:2.75rem}
  @media(min-width:900px){.tiers{grid-template-columns:repeat(3,1fr)}}
  .tier{background:#fff;border:1px solid var(--line);border-radius:16px;padding:1.6rem;display:flex;flex-direction:column}
  .tier.feat{border:2px solid var(--ink);box-shadow:0 18px 44px rgba(22,19,15,.09);position:relative}
  .tier.feat::after{content:"Most popular";position:absolute;top:-.75rem;left:1.6rem;background:var(--ink);color:#fff;font-family:var(--mono);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;padding:.28rem .55rem;border-radius:6px}
  .tier h3{font-size:1.05rem;letter-spacing:-.01em}
  .price{font-family:var(--mono);font-size:2.1rem;font-weight:700;letter-spacing:-.04em;margin:.5rem 0 .1rem}
  .price small{font-family:Inter,sans-serif;font-size:.82rem;font-weight:500;color:var(--muted);letter-spacing:0}
  .tier ul{list-style:none;margin:1.1rem 0 1.4rem;display:grid;gap:.55rem;font-size:.92rem;color:var(--muted)}
  .saving{font-family:var(--mono);font-size:.74rem;color:var(--action);background:#FFF7ED;border-radius:8px;padding:.4rem .55rem;margin-bottom:1.1rem;line-height:1.4}
  .tier li::before{content:"→";color:var(--action);margin-right:.5rem;font-weight:700}
  .tier .btn{margin-top:auto;width:100%}
    .pricenote{margin-top:1.25rem;font-size:.88rem;color:var(--muted);max-width:44rem}
  .guarantee{margin-top:2rem;background:#fff;border:1px solid var(--line);border-left:3px solid var(--action);border-radius:14px;padding:1.35rem clamp(1.1rem,3vw,1.75rem)}
  .gk{font-family:var(--mono);font-size:.7rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink);font-weight:500;margin-bottom:1rem}
  .gin{display:grid;gap:1rem}
  @media(min-width:820px){.gin{grid-template-columns:repeat(3,1fr);gap:1.75rem}}
  .gin span{font-size:.9rem;color:var(--muted);line-height:1.5}
  .gin b{color:var(--ink);display:block;margin-bottom:.1rem}

  /* proof */
  .stats{display:grid;gap:1.5rem;margin-top:2.5rem}
  @media(min-width:760px){.stats{grid-template-columns:repeat(3,1fr)}}
  .stat{background:#fff;border:1px solid var(--line);border-radius:14px;padding:1.4rem}
  .stat b{display:block;font-family:var(--mono);font-size:1.8rem;font-weight:700;letter-spacing:-.04em}
  .stat span{display:block;margin-top:.35rem;font-size:.86rem;color:var(--muted)}

  /* form */
  form{margin-top:2rem;display:grid;gap:1rem;max-width:34rem}
  .fld{display:grid;gap:.4rem}
  label{font-size:.85rem;font-weight:500}
  input,textarea{font:inherit;font-size:.98rem;padding:.75rem .85rem;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--ink);transition:border-color .2s,box-shadow .2s}
  input:focus,textarea:focus{outline:none;border-color:var(--action);box-shadow:0 0 0 3px rgba(194,65,12,.14)}
  .two{display:grid;gap:1rem}
  @media(min-width:560px){.two{grid-template-columns:1fr 1fr}}
  .micro{font-size:.84rem;color:var(--muted)}
  .formcard{background:#fff;border:1px solid var(--line);border-radius:18px;padding:clamp(1.35rem,3vw,2rem);box-shadow:0 16px 40px rgba(22,19,15,.06)}

  footer{border-top:1px solid var(--line);padding:2.25rem 0;background:var(--tint)}
  .foot{display:flex;flex-wrap:wrap;gap:.75rem 1.75rem;justify-content:space-between;align-items:center;font-size:.86rem;color:var(--muted)}
  .foot a:hover{color:var(--ink)}
  .sr{position:absolute;left:0;top:0;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;pointer-events:none}

  /* ---------------------------------------------------------------- client area
     Portal, sign-in and the after-checkout screen all wear the same shell as the
     landing page: same ink, same mono labels, same single action colour. The one
     addition is a status green, used only to say a bot is running. It is not an
     action colour and never appears on a button. */
  :root{ --ok:#15803D; --okbg:#F0FDF4; --okline:#BBF7D0; }
  .app{ min-height:100vh; display:flex; flex-direction:column; }
  .apphead{ position:sticky; top:0; z-index:20; border-bottom:1px solid var(--line);
            background:rgba(255,255,255,.88); backdrop-filter:blur(10px); }
  .apphead .wrap{ display:flex; align-items:center; justify-content:space-between; gap:1rem; height:64px; }
  .appmain{ flex:1; padding:2.2rem 0 3.2rem; }
  .panel{ background:#fff; border:1px solid var(--line); border-radius:14px; padding:1.4rem; }
  .panel.tint{ background:var(--tint); }
  .panelhead{ display:flex; align-items:baseline; justify-content:space-between; gap:1rem; flex-wrap:wrap;
              margin-bottom:.9rem; }
  .panelhead h2{ font-size:1.06rem; }
  .botrow{ display:flex; align-items:center; gap:.95rem; padding:.8rem 0; border-bottom:1px solid var(--line); }
  .botrow:last-child{ border-bottom:0; }
  .botrow .grow{ flex:1; min-width:0; }
  .botrow b{ display:block; font-size:.96rem; }
  .botrow small{ display:block; color:var(--muted); font-size:.84rem; margin-top:.15rem; }
  .botart{ width:52px; height:52px; flex:0 0 52px; border-radius:12px; border:1px solid var(--line);
           background:var(--tint); overflow:hidden; }
  .botart img,.botart video{ width:100%; height:100%; display:block; object-fit:cover; }
  .tilerow{ display:flex; flex-wrap:wrap; gap:.55rem; }
  .tilerow .botart{ width:46px; height:46px; flex-basis:46px; }
  .pill{ display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .68rem; border-radius:999px;
         border:1px solid var(--line); background:var(--tint);
         font:600 .7rem/1 var(--mono); letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
  .pill.ok{ color:var(--ok); background:var(--okbg); border-color:var(--okline); }
  .pill.now{ color:var(--action); border-color:#F3C9AE; background:#FFF4EC; }
  .center{ max-width:600px; margin:0 auto; }
  .center.mid{ text-align:center; }
  .mark{ width:64px; height:64px; margin:0 auto 1.1rem; }
  .mark svg{ width:100%; height:100%; display:block; }
  .field{ margin-top:1.1rem; }
  .stat-line{ display:flex; gap:1.6rem; flex-wrap:wrap; margin-top:1.1rem; }
  .stat-line div{ font:600 .74rem/1.5 var(--mono); letter-spacing:.06em; text-transform:uppercase;
                  color:var(--muted); }
  .stat-line b{ display:block; font:700 1.5rem/1.2 Inter,system-ui,sans-serif; color:var(--ink);
                letter-spacing:-.01em; }
  .emptyart{ width:84px; height:84px; border-radius:16px; border:1px solid var(--line); background:var(--tint);
             overflow:hidden; margin-bottom:1rem; }
  .emptyart img{ width:100%; height:100%; display:block; object-fit:cover; }