/* HeyLoopy — navigable multi-page site prototype. Field / Amber.
     Pages: Home, Product, How it works, Solutions, About, Pricing.
     Amber corpus, indigo demoted to cool AI spark, subtle motion. */
  :root{ color-scheme: light; --font:'Inter',system-ui,-apple-system,sans-serif; --mono:'JetBrains Mono',ui-monospace,monospace; }
  *{box-sizing:border-box;}
  body{margin:0;font-family:var(--font);-webkit-font-smoothing:antialiased;
    --bg:#FAF6F0; --fg:#1B1714; --muted:#6C6358; --surf:#FFFFFF; --bd:#E8E1D6; --bd2:#DAD1C3;
    --accent:#C2611F; --accent-ink:#fff; --accent-text:#AB531A; --accent-soft:#FBEADD;
    --glow:0 12px 26px -12px rgba(194,97,31,.42); --cool:#8E86FF;
    --ok:#2FA37A; --ok-soft:#E2F2EB; --warn:#C8912F; --bad:#C5523E;
    background:var(--bg);color:var(--fg);}
  img{max-width:100%;display:block;} a{color:inherit;text-decoration:none;}
  .dark{ --bg:#0B0B11; --fg:#F2F3F5; --muted:#9BA0AB; --surf:#14141D; --bd:#262631; --bd2:#343443;
    --accent:#E08A3C; --accent-ink:#1a1206; --accent-text:#F0A45C; --accent-soft:rgba(224,138,60,.14);
    --glow:0 14px 30px -12px rgba(224,138,60,.4); background:var(--bg);color:var(--fg);}

  .wrap{width:calc(100% - 48px);max-width:1100px;margin-inline:auto;}
  /* nav */
  .nav{position:sticky;top:env(safe-area-inset-top,0px);z-index:60;background:rgba(250,246,240,.86);backdrop-filter:saturate(1.2) blur(10px);border-bottom:1px solid var(--bd);}
  .nav .in{display:flex;align-items:center;gap:8px;height:64px;}
  .logo{display:flex;align-items:center;gap:9px;font-weight:600;font-size:17px;letter-spacing:-.3px;cursor:pointer;}
  .logo .g{width:24px;height:24px;border-radius:7px;background:var(--accent);display:grid;place-items:center;color:#fff;font-size:13px;}
  .nav .lk{display:flex;gap:2px;margin-left:12px;}
  .nav .lk button{font:inherit;font-size:14px;font-weight:500;color:var(--muted);background:none;border:0;cursor:pointer;padding:7px 11px;border-radius:6px;}
  .nav .lk button:hover{color:var(--fg);background:rgba(27,23,20,.04);}
  .nav .lk button[aria-current="true"]{color:var(--accent-text);}
  .nav .sp{flex:1;}
  .btn{font:inherit;font-size:14px;font-weight:600;cursor:pointer;padding:9px 16px;border-radius:8px;border:1px solid transparent;display:inline-flex;align-items:center;gap:7px;transition:.16s;}
  .btn--p{background:var(--accent);color:#fff;} .btn--p:hover{filter:brightness(1.06);transform:translateY(-1px);box-shadow:var(--glow);}
  .btn--o{background:transparent;color:var(--fg);border-color:var(--bd2);} .btn--o:hover{border-color:var(--fg);}
  .btn--lg{padding:12px 22px;font-size:15px;}

  /* shared type */
  .eyebrow{font-family:var(--mono);font-size:12px;font-weight:500;letter-spacing:.15em;text-transform:uppercase;color:var(--accent-text);margin:0 0 14px;}
  .h1{font-size:clamp(34px,5vw,54px);font-weight:400;line-height:1.03;letter-spacing:-.03em;margin:0;text-wrap:balance;}
  .lead{font-size:18px;line-height:1.5;color:var(--muted);margin:20px 0 0;max-width:42ch;} .lead b{color:var(--fg);font-weight:600;}
  .acts{display:flex;gap:11px;margin-top:28px;flex-wrap:wrap;}
  .sec{padding-block:72px;border-top:1px solid var(--bd);} .sec--surf{background:var(--surf);}
  .sechead{font-size:clamp(26px,3.4vw,36px);font-weight:500;line-height:1.09;letter-spacing:-.02em;margin:0;max-width:22ch;text-wrap:balance;}
  .sublead{font-size:17px;line-height:1.5;color:var(--muted);max-width:60ch;margin:16px 0 0;}
  .state{font-family:var(--mono);font-size:10px;letter-spacing:.07em;text-transform:uppercase;padding:4px 8px;border-radius:5px;font-weight:500;white-space:nowrap;}
  .state--live{background:var(--ok-soft);color:var(--ok);} .state--soon{background:var(--accent-soft);color:var(--accent-text);} .state--bet{background:transparent;border:1px solid var(--bd2);color:var(--muted);}

  

  /* hero (home/generic) */
  .hero{position:relative;overflow:hidden;border-bottom:1px solid var(--bd);}
  .hero .in{display:grid;grid-template-columns:.9fr 1.1fr;gap:40px;align-items:center;padding-block:64px;}
  .hero--solo .in{grid-template-columns:1fr;max-width:760px;padding-block:72px;}
  .hsub{font-size:19px;line-height:1.45;color:var(--muted);margin:22px 0 0;max-width:34ch;} .hsub b{color:var(--fg);font-weight:600;}
  .hero .shot{position:relative;border-radius:20px;overflow:hidden;min-height:470px;border:1px solid var(--bd);box-shadow:0 40px 80px -42px rgba(120,70,25,.3);}
  .hero .shot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;animation:kb 32s ease-in-out infinite alternate;}
  .hero .shot::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,12,.22),transparent 45%);}
  .hero .shotcap{position:absolute;z-index:3;left:18px;bottom:16px;font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase;color:#fff;background:rgba(10,10,12,.42);padding:5px 10px;border-radius:6px;}
  @keyframes kb{from{transform:scale(1.02)}to{transform:scale(1.1) translate(-1.2%,-1.2%)}}

  /* mesh panel */
  .mesh{position:relative;border-radius:20px;overflow:hidden;border:1px solid var(--bd);
    background:radial-gradient(120% 115% at 50% 42%,#fff,#F6EFE6 72%,#F0E6D8);box-shadow:0 40px 80px -42px rgba(120,70,25,.3);}
  .mesh::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:linear-gradient(rgba(27,23,20,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(27,23,20,.05) 1px,transparent 1px);background-size:30px 30px;-webkit-mask:radial-gradient(90% 90% at 50% 45%,#000 55%,transparent 92%);mask:radial-gradient(90% 90% at 50% 45%,#000 55%,transparent 92%);}
  .mesh svg{display:block;width:100%;height:auto;position:relative;z-index:1;}
  .mcap{position:absolute;left:18px;right:18px;bottom:15px;z-index:2;display:flex;gap:9px;align-items:center;font-size:13px;color:var(--muted);}
  .mcap .d{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);flex:none;}
  .connector{stroke:rgba(27,23,20,.2);stroke-width:1.4;stroke-dasharray:3 6;fill:none;}
  .pulse{fill:var(--accent);} .lit{fill:none;stroke:var(--accent);stroke-width:2;stroke-opacity:0;}
  .chip{fill:#fff;stroke:rgba(27,23,20,.26);stroke-width:1.5;} .nicon{fill:none;stroke:rgba(27,23,20,.78);stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
  .nlabel{font-family:var(--mono);font-size:9px;letter-spacing:.06em;fill:rgba(27,23,20,.5);text-transform:uppercase;text-anchor:middle;}
  .spoke{stroke:var(--accent);stroke-width:1.6;} .cdot{fill:var(--accent);}
  .cring{fill:rgba(194,97,31,.08);stroke:rgba(194,97,31,.3);stroke-width:1.2;} .cglow{fill:rgba(194,97,31,.08);}
  .corelbl{font-family:var(--mono);font-size:9px;letter-spacing:.1em;fill:var(--accent-text);text-transform:uppercase;text-anchor:middle;}
  .rrng{fill:none;stroke:var(--accent);stroke-opacity:.4;}
  @keyframes travel{0%{transform:translate(0,0);opacity:0}8%{opacity:1}92%{opacity:1}100%{transform:translate(calc(var(--dx)*1px),calc(var(--dy)*1px));opacity:0}}
  @keyframes litflash{0%,78%{stroke-opacity:0}90%{stroke-opacity:.95}100%{stroke-opacity:0}}
  @keyframes spin{to{transform:rotate(360deg)}} @keyframes breathe{0%,100%{opacity:.5}50%{opacity:1}} @keyframes rring{0%{r:14px;stroke-opacity:.45}100%{r:150px;stroke-opacity:0}}
  .pulse{animation:travel var(--dur) linear infinite;animation-delay:var(--dly);} .lit{animation:litflash var(--dur) linear infinite;animation-delay:var(--dly);}
  .spin-g{animation:spin 64s linear infinite;} .cglow{animation:breathe 4.2s ease-in-out infinite;} .rrng{animation:rring 3.6s ease-out infinite;}

  /* cards / grids */
  .grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:38px;}
  .grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:38px;}
  .card{background:var(--surf);border:1px solid var(--bd);border-radius:16px;padding:24px;}
  .card .k{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--accent-text);}
  .card .t{font-size:18px;font-weight:600;margin:12px 0 7px;letter-spacing:-.01em;}
  .card p{font-size:14.5px;line-height:1.55;color:var(--muted);margin:0;}
  .card__top{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:4px;}
  .move{display:grid;grid-template-columns:120px 1fr;gap:20px;align-items:center;padding:22px 0;border-top:1px solid var(--bd);}
  .move:first-child{border-top:0;} .move__t{font-size:19px;font-weight:600;letter-spacing:-.01em;} .move__s{font-size:14.5px;color:var(--muted);margin:5px 0 0;line-height:1.5;max-width:60ch;}
  .mov(viz){}
  .steps{display:grid;gap:12px;margin-top:26px;}
  .loop{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:30px;}
  .lnode{background:var(--surf);border:1px solid var(--bd);border-radius:12px;padding:16px;position:relative;overflow:hidden;}
  .lnode::before{content:"";position:absolute;left:0;top:0;height:3px;width:100%;background:var(--accent);transform:scaleX(0);transform-origin:left;animation:sweep 6s ease-in-out infinite;}
  .lnode:nth-child(1)::before{animation-delay:0s}.lnode:nth-child(2)::before{animation-delay:1.5s}.lnode:nth-child(3)::before{animation-delay:3s}.lnode:nth-child(4)::before{animation-delay:4.5s}
  @keyframes sweep{0%,100%{transform:scaleX(0)}8%{transform:scaleX(1)}22%{transform:scaleX(1)}30%{transform:scaleX(0)}}
  .lnode .lk{font-family:var(--mono);font-size:10px;letter-spacing:.09em;text-transform:uppercase;color:var(--accent-text);}
  .lnode .lv{font-size:16px;font-weight:600;margin-top:5px;} .lnode .ls{font-size:12.5px;color:var(--muted);margin-top:5px;line-height:1.45;}
  .rp{background:var(--surf);border:1px solid var(--bd);border-radius:14px;padding:18px;}
  .rp__h{display:flex;justify-content:space-between;font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);}
  .rp__row{display:grid;grid-template-columns:1fr auto;gap:12px;align-items:center;padding:12px 0;border-top:1px solid var(--bd);} .rp__row:first-of-type{margin-top:10px;}
  .rp__nm{font-size:14px;font-weight:600;} .rp__nm span{display:block;font-size:12px;font-weight:400;color:var(--muted);margin-top:1px;}
  .rp__m{width:120px;height:8px;border-radius:99px;background:var(--bd);overflow:hidden;} .rp__m i{display:block;height:100%;border-radius:99px;background:var(--accent);width:0;transition:width 1.1s cubic-bezier(.22,.9,.3,1);} .rp__m i.warn{background:var(--warn);}
  .split{display:grid;grid-template-columns:1.05fr .95fr;gap:40px;align-items:center;}

  /* roles / solution tiles */
  .roles{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:36px;}
  .rtile{position:relative;border-radius:14px;overflow:hidden;border:1px solid var(--bd);aspect-ratio:1/1;transition:.18s;}
  .rtile img{width:100%;height:100%;object-fit:cover;transition:transform .5s ease;} .rtile:hover{transform:translateY(-3px);box-shadow:0 22px 44px -26px rgba(20,16,12,.45);} .rtile:hover img{transform:scale(1.06);}
  .rtile::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,12,.82) 2%,rgba(10,10,12,.28) 44%,transparent 68%);}
  .rtile .cap{position:absolute;z-index:2;left:14px;bottom:12px;right:12px;font-size:14px;font-weight:600;line-height:1.2;color:#fff;text-shadow:0 1px 10px rgba(0,0,0,.5);}
  .rtile .cap .ce{display:block;font-family:var(--mono);font-size:9px;font-weight:500;letter-spacing:.09em;text-transform:uppercase;color:rgba(255,255,255,.82);margin-bottom:3px;}
  .solgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:38px;}
  .solcard{border:1px solid var(--bd);border-radius:16px;overflow:hidden;background:var(--surf);transition:.18s;cursor:pointer;}
  .solcard:hover{transform:translateY(-3px);box-shadow:0 22px 44px -26px rgba(20,16,12,.4);}
  .solcard .ph{aspect-ratio:16/10;position:relative;overflow:hidden;background:var(--accent-soft);}
  .solcard .ph img{width:100%;height:100%;object-fit:cover;} .solcard .ph.noimg{display:grid;place-items:center;}
  .solcard .ph.noimg svg{width:40px;height:40px;color:var(--accent);}
  .solcard .bd{padding:18px 20px 22px;} .solcard .t{font-size:17px;font-weight:600;} .solcard .s{font-size:13.5px;color:var(--muted);margin:6px 0 0;line-height:1.5;}

  /* pricing */
  .prices{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin-top:42px;}
  .price{border:1px solid var(--bd);border-radius:16px;padding:24px 19px;background:var(--surf);display:flex;flex-direction:column;}
  .price--feat{border-color:var(--accent);box-shadow:0 20px 44px -26px rgba(194,97,31,.4);position:relative;}
  .price--feat .tag{position:absolute;top:-11px;left:22px;background:var(--accent);color:#fff;font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;padding:4px 9px;border-radius:5px;}
  .price .pn{font-size:16px;font-weight:600;} .price .pp{font-size:30px;font-weight:600;letter-spacing:-.02em;margin:12px 0 2px;} .price .pp small{font-size:14px;font-weight:400;color:var(--muted);}
  .price .pd{font-size:13px;color:var(--muted);min-height:34px;margin-bottom:14px;}
  .price ul{list-style:none;padding:0;margin:0 0 20px;display:grid;gap:9px;} .price li{font-size:13.5px;color:var(--fg);display:flex;gap:8px;align-items:flex-start;} .price li::before{content:"";width:6px;height:6px;border-radius:50%;background:var(--accent);margin-top:7px;flex:none;}
  .price .btn{margin-top:auto;justify-content:center;}

  /* about dark prose */
  .prose{max-width:64ch;} .prose p{font-size:18px;line-height:1.62;color:var(--muted);margin:0 0 20px;} .prose p b{color:var(--fg);font-weight:600;}
  .founder{margin-top:30px;background:var(--surf);border:1px solid var(--bd);border-radius:16px;padding:22px;max-width:64ch;}
  .founder .av{width:56px;height:56px;border-radius:99px;object-fit:cover;display:block;margin-bottom:14px;border:1px solid var(--bd);}
  .logoimg{height:31px;width:auto;display:block;}
  .nav .logo{align-self:center;}
  .wlist{list-style:none;padding:0;margin:24px 0 0;display:grid;gap:11px;}
  .wlist li{font-size:15px;color:var(--fg);display:flex;gap:10px;align-items:flex-start;} .wlist li::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent);margin-top:8px;flex:none;}
  .host{display:flex;align-items:center;gap:12px;margin-top:30px;}
  .host img{width:48px;height:48px;border-radius:99px;object-fit:cover;border:1px solid var(--bd);}
  .host .hn{font-weight:600;font-size:15px;} .host .hr{font-size:13px;color:var(--muted);}
  .sched{background:var(--surf);border:1px solid var(--bd);border-radius:18px;padding:22px;box-shadow:0 34px 74px -42px rgba(20,16,12,.4);}
  .sched__h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding-bottom:16px;border-bottom:1px solid var(--bd);}
  .sched__h .st{font-weight:600;font-size:16px;} .sched__h .ss{font-size:13px;color:var(--muted);margin-top:2px;}
  .sched__h .sb{width:30px;height:30px;border-radius:8px;background:var(--accent);color:#fff;display:grid;place-items:center;font-size:14px;}
  .cal{margin-top:16px;} .cal__mh{display:flex;align-items:center;justify-content:space-between;font-size:13px;font-weight:600;margin-bottom:10px;}
  .cal__grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
  .cal__dow{font-family:var(--mono);font-size:10px;color:var(--muted);text-align:center;padding-bottom:4px;}
  .cal__d{aspect-ratio:1;border:0;background:none;font:inherit;font-size:13px;border-radius:8px;cursor:pointer;color:var(--fg);display:grid;place-items:center;}
  .cal__d:hover:not(:disabled){background:var(--accent-soft);}
  .cal__d:disabled{color:var(--bd2);cursor:default;} .cal__d.blank{cursor:default;}
  .cal__d[aria-pressed="true"]{background:var(--accent);color:#fff;}
  .slots{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;}
  .slot{font:inherit;font-size:13px;font-weight:500;padding:9px 6px;border:1px solid var(--bd2);border-radius:8px;background:var(--surf);cursor:pointer;color:var(--fg);}
  .slot:hover{border-color:var(--accent);} .slot[aria-pressed="true"]{background:var(--accent);color:#fff;border-color:var(--accent);}
  .sched__cta{width:100%;justify-content:center;margin-top:16px;} .sched__cta:disabled{opacity:.5;cursor:default;}
  .sched__note{font-family:var(--mono);font-size:10.5px;letter-spacing:.04em;color:var(--muted);text-align:center;margin-top:12px;}
  .founder p{margin:0;font-size:14.5px;line-height:1.6;color:var(--muted);} .founder b{color:var(--fg);}

  /* dark teaser band */
  .darkband{position:relative;overflow:hidden;border-top:1px solid var(--bd);}
  .darkband canvas{position:absolute;inset:0;width:100%;height:100%;z-index:0;}
  .darkband .in{position:relative;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-block:50px;}
  .darkband .deye{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent-text);margin:0 0 10px;}
  .darkband h2{font-size:clamp(23px,3vw,31px);font-weight:500;letter-spacing:-.02em;margin:0;max-width:22ch;}
  .darkband .dl{display:inline-flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);cursor:pointer;} .darkband .dl .ar{color:var(--cool);}

  /* CTA + footer */
  .ctaband{background:var(--accent);color:#fff;}
  .ctaband .in{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap;padding-block:52px;}
  .ctaband h2{font-size:clamp(23px,2.9vw,31px);font-weight:500;letter-spacing:-.02em;margin:0;max-width:22ch;}
  .ctaband .btn--w{background:#fff;color:var(--accent-text);} .ctaband .btn--go{background:rgba(255,255,255,.15);color:#fff;border:1px solid rgba(255,255,255,.4);}
  .ctaband .ctatext{max-width:44ch;} .ctaband .ctatext p{color:rgba(255,255,255,.88);font-size:15.5px;line-height:1.5;margin:11px 0 0;}
  footer{background:var(--surf);border-top:1px solid var(--bd);}
  footer .in{display:flex;justify-content:space-between;align-items:center;gap:20px;flex-wrap:wrap;padding-block:26px;color:var(--muted);font-size:13px;}
  footer .fstat{display:inline-flex;align-items:center;gap:8px;} footer .fstat .d{width:7px;height:7px;border-radius:50%;background:#2FA37A;}

  @media (max-width:900px){
    .hero .in{grid-template-columns:1fr;gap:28px;padding-block:46px;}
    .grid3,.grid2,.roles,.solgrid,.prices,.split,.loop{grid-template-columns:1fr;}
    .roles,.solgrid{grid-template-columns:1fr 1fr;} .prices{grid-template-columns:1fr 1fr;} .loop{grid-template-columns:1fr 1fr;}
    .move{grid-template-columns:1fr;gap:10px;} .move .state{justify-self:start;}
    .sec{padding-block:52px;}
    /* hero media is right-column furniture on desktop; shrink it so it does not
       dominate the stacked mobile hero */
    .hero .shot{min-height:300px;}
    .corpuspanel{min-height:340px;}
    /* let the stacked hero cells shrink to the gutter (grid min-width:auto else
       lets the dash push past the viewport on narrow phones) */
    .hero .in>*{min-width:0;}
    .devices,.devices .dash{max-width:100%;}
    /* how-it-works hero: the shorter mobile mesh left no clear band, so the
       absolute caption landed on the graphic. Reserve a band below it. */
    .mesh{padding-bottom:58px;}
  }
  @media (max-width:560px){
    .wrap{width:calc(100% - 32px);} .nav .lk{display:none;} .prices,.loop{grid-template-columns:1fr;}
    /* hero dash: let the inner panel shrink so the fixed sidebar can't push past the viewport */
    .dash__body{grid-template-columns:92px 1fr;} .dash__main{min-width:0;padding:14px;}
  }
  @media (prefers-reduced-motion:reduce){ *{animation:none!important;} .rp__m i{transition:none!important;} }
  :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:6px;}

/* nav links as anchors (Hugo multi-page) */
.nav .lk a{font:inherit;font-size:14px;font-weight:500;color:var(--muted);padding:7px 11px;border-radius:6px;text-decoration:none;}
.nav .lk a:hover{color:var(--fg);background:rgba(27,23,20,.04);}
.nav .lk a[aria-current="true"]{color:var(--accent-text);}
a.btn{text-decoration:none;}
a.logo{text-decoration:none;color:inherit;}

/* ===== sticky footer ===== */
body{min-height:100vh;display:flex;flex-direction:column;}
.site-main{flex:1 0 auto;}
footer{flex-shrink:0;}

/* ===== richer footer ===== */
footer .foot{display:grid;grid-template-columns:1.4fr 2fr;gap:40px;padding-block:46px;}
.foot__brand img{margin-bottom:12px;} .foot__brand p{font-size:14px;color:var(--muted);max-width:30ch;margin:0;line-height:1.5;}
.foot__cols{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;}
.foot__col h4{font-family:var(--mono);font-size:11px;letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin:0 0 14px;}
.foot__col a{display:block;font-size:14px;color:var(--fg);margin-bottom:10px;text-decoration:none;} .foot__col a:hover{color:var(--accent-text);}
/* mobile footer: stack brand above the link columns (the 2-col base never collapsed, overflowing narrow phones) */
@media(max-width:560px){footer .foot{grid-template-columns:1fr;gap:30px;}}
.foot__bar{border-top:1px solid var(--bd);} .foot__bar-in{display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap;padding-block:18px;font-size:12.5px;color:var(--muted);}
.foot__bar-in a{color:var(--muted);text-decoration:none;} .foot__bar-in a:hover{color:var(--fg);}

/* ===== product: device mockups ===== */
.devices{position:relative;}
.dash{background:var(--surf);border:1px solid var(--bd);border-radius:14px;overflow:hidden;box-shadow:0 40px 80px -42px rgba(120,70,25,.3);}
.dash__bar{display:flex;gap:6px;align-items:center;padding:11px 14px;border-bottom:1px solid var(--bd);background:var(--bg);}
.dash__bar span.wd{width:9px;height:9px;border-radius:50%;background:var(--bd2);}
.dash__bar .url{display:inline-flex;align-items:center;gap:6px;margin-left:16px;background:var(--surf);border:1px solid var(--bd);border-radius:7px;padding:4px 12px;font-family:var(--mono);font-size:10px;color:var(--muted);letter-spacing:.02em;}
.dash__bar .url .lock{width:10px;height:10px;fill:none;stroke:var(--muted);stroke-width:1.9;flex:none;}
.dash__body{display:grid;grid-template-columns:120px 1fr;min-height:300px;}
.dash__side{border-right:1px solid var(--bd);padding:14px 12px;display:flex;flex-direction:column;gap:4px;background:var(--bg);}
.dash__side i{display:block;height:9px;border-radius:4px;background:var(--bd);} .dash__side i.on{background:var(--accent-soft);} .dash__side i:nth-child(1){width:70%} .dash__side i:nth-child(2){width:90%} .dash__side i:nth-child(3){width:60%} .dash__side i:nth-child(4){width:80%} .dash__side i:nth-child(5){width:50%}
.dash__main{padding:18px;}
.dash__h{font-size:13px;font-weight:600;margin-bottom:12px;}
.dash__row{display:grid;grid-template-columns:1fr 92px 30px;gap:10px;align-items:center;padding:7px 0;border-top:1px solid var(--bd);} .dash__row:first-of-type{border-top:0;}
.dash__row .r{font-size:11.5px;color:var(--fg);} .dash__m{height:7px;border-radius:99px;background:var(--bd);overflow:hidden;} .dash__m i{display:block;height:100%;border-radius:99px;background:var(--accent);} .dash__m i.warn{background:var(--warn);}
.dash__row .p{font-family:var(--mono);font-size:10px;color:var(--muted);text-align:right;}
.dash__chart{display:flex;align-items:flex-end;gap:8px;height:70px;margin-top:16px;padding-top:12px;border-top:1px solid var(--bd);}
.dash__chart i{flex:1;background:var(--accent-soft);border-radius:4px 4px 0 0;position:relative;} .dash__chart i::after{content:"";position:absolute;left:0;right:0;bottom:0;height:40%;background:var(--accent);border-radius:0 0 4px 4px;opacity:.0;}
.phone{position:absolute;right:-6px;bottom:-22px;width:150px;background:var(--fg);border-radius:22px;padding:8px;box-shadow:0 30px 60px -28px rgba(20,16,12,.6);border:1px solid #000;}
.phone__scr{background:var(--surf);border-radius:16px;padding:14px 13px;min-height:250px;}
.phone__top{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text);}
.phone__q{font-size:12.5px;font-weight:600;line-height:1.35;margin:10px 0 12px;color:var(--fg);}
.phone__opt{font-size:11.5px;border:1px solid var(--bd);border-radius:8px;padding:8px 10px;margin-bottom:7px;color:var(--fg);}
.phone__opt.sel{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text);font-weight:600;}
@media(max-width:900px){.phone{position:static;width:150px;margin:18px auto 0;}}

/* ===== solutions: comparison ===== */
.vs{display:grid;grid-template-columns:1fr 1fr 1fr;gap:16px;margin-top:38px;}
.vscard{border:1px solid var(--bd);border-radius:16px;padding:22px;background:var(--surf);}
.vscard.me{border-color:var(--accent);box-shadow:0 20px 44px -28px rgba(194,97,31,.4);}
.vscard .vt{font-size:15px;font-weight:600;} .vscard .vk{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.vscard.me .vk{color:var(--accent-text);}
.vscard ul{list-style:none;padding:0;margin:14px 0 0;display:grid;gap:9px;} .vscard li{font-size:13px;color:var(--muted);display:flex;gap:8px;line-height:1.45;}
.vscard li::before{content:"–";color:var(--bd2);} .vscard.me li::before{content:"✓";color:var(--ok);font-weight:700;}
@media(max-width:760px){.vs{grid-template-columns:1fr;}}

/* ===== guard / inquiry kit graphics ===== */
.gpanel{position:relative;border-radius:18px;border:1px solid var(--bd);overflow:hidden;background:radial-gradient(120% 115% at 50% 40%,#fff,#F6EFE6 72%,#F0E6D8);box-shadow:0 30px 70px -42px rgba(120,70,25,.28);}
.gpanel::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:linear-gradient(rgba(27,23,20,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(27,23,20,.05) 1px,transparent 1px);background-size:30px 30px;-webkit-mask:radial-gradient(90% 90% at 50% 45%,#000 55%,transparent 93%);mask:radial-gradient(90% 90% at 50% 45%,#000 55%,transparent 93%);}
.gpanel svg{display:block;width:100%;height:auto;position:relative;z-index:1;}
.conn{stroke:rgba(27,23,20,.2);stroke-width:1.4;stroke-dasharray:3 6;fill:none;}
.pulse-bad{fill:var(--bad);animation:travel var(--dur,2.2s) linear infinite;animation-delay:var(--dly,0s);}
.badge-ok{fill:var(--ok);} .badge-bad{fill:var(--bad);} .badge-ring-ok{fill:var(--ok-soft);} .badge-ring-bad{fill:#F7E4E0;}
.bmark{stroke:#fff;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;fill:none;}
@keyframes alertpulse{0%,100%{transform:scale(1);opacity:1}50%{transform:scale(1.14);opacity:.78}}
@keyframes popin{0%,55%{opacity:0;transform:scale(.4)}70%{opacity:1;transform:scale(1.12)}80%,100%{opacity:1;transform:scale(1)}}
.alert{animation:alertpulse 1.6s ease-in-out infinite;transform-box:fill-box;transform-origin:center;}
.badge{animation:popin var(--loop,3s) ease-out infinite;animation-delay:var(--bdly,0s);transform-box:fill-box;transform-origin:center;}
.ask{fill:#fff;stroke:var(--accent);stroke-width:1.6;} .asktxt{fill:var(--accent-text);font-family:var(--font);font-weight:700;font-size:13px;text-anchor:middle;}
.askb{animation:alertpulse 2.4s ease-in-out infinite;transform-box:fill-box;transform-origin:center;}
.pulse-soft{fill:var(--accent);opacity:.45;animation:travel var(--dur,2.4s) linear infinite;animation-delay:var(--dly,0s);}

/* capability grid 3x2 */
.grid3.two-rows{grid-template-columns:repeat(3,1fr);}
@media(max-width:760px){.grid3.two-rows{grid-template-columns:1fr;}}

/* ===== agentic shield graphic ===== */
.shieldbar{fill:var(--accent-soft);stroke:var(--accent);stroke-width:1.5;}
.shieldshim{animation:shimmer 2.8s ease-in-out infinite;}
@keyframes shimmer{0%,100%{opacity:0}50%{opacity:.4}}
.shieldlbl{font-family:var(--mono);font-size:10px;letter-spacing:.14em;text-transform:uppercase;fill:var(--accent-text);}
.srclbl{font-family:var(--mono);font-size:8.5px;letter-spacing:.05em;text-transform:uppercase;fill:rgba(27,23,20,.5);text-anchor:middle;}
.reason{font-family:var(--mono);font-size:8.5px;fill:var(--bad);text-anchor:middle;}

/* rule pills */
.rules{display:flex;flex-wrap:wrap;gap:9px;margin-top:22px;}
.rule{font-family:var(--mono);font-size:11px;letter-spacing:.03em;padding:7px 12px;border-radius:99px;border:1px solid var(--bd);background:var(--surf);color:var(--fg);display:inline-flex;gap:8px;align-items:center;}
.rule .rd{width:6px;height:6px;border-radius:50%;background:var(--accent);flex:none;}
.rule b{color:var(--accent-text);font-weight:600;}

/* interview chat mock */
.chat{background:var(--surf);border:1px solid var(--bd);border-radius:16px;overflow:hidden;box-shadow:0 30px 70px -40px rgba(20,16,12,.35);}
.chat__h{display:flex;align-items:center;gap:9px;padding:13px 16px;border-bottom:1px solid var(--bd);font-size:13px;font-weight:600;}
.chat__h .cdot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--accent-soft);flex:none;}
.chat__b{padding:16px;display:flex;flex-direction:column;gap:10px;background:var(--bg);}
.bub{font-size:13.5px;line-height:1.45;padding:9px 13px;border-radius:14px;max-width:82%;}
.bub--agent{align-self:flex-start;background:var(--surf);border:1px solid var(--bd);border-bottom-left-radius:5px;color:var(--fg);}
.bub--you{align-self:flex-end;background:var(--accent);color:#fff;border-bottom-right-radius:5px;}
.bub--type{align-self:flex-start;background:var(--surf);border:1px solid var(--bd);display:inline-flex;gap:4px;align-items:center;padding:11px 14px;}
.bub--type i{width:6px;height:6px;border-radius:50%;background:var(--muted);animation:typ 1.2s infinite;}
.bub--type i:nth-child(2){animation-delay:.2s}.bub--type i:nth-child(3){animation-delay:.4s}
@keyframes typ{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-3px)}}
.chat__out{padding:13px 16px;border-top:1px solid var(--bd);font-size:13px;color:var(--accent-text);font-weight:600;display:flex;gap:9px;align-items:center;}
.chat__out .ar{color:var(--accent);}

/* refined phone */
.phone{position:absolute;right:-10px;bottom:-6px;width:158px;background:linear-gradient(150deg,#3a3a44,#131318);border-radius:30px;padding:5px;box-shadow:0 38px 70px -24px rgba(20,16,12,.5);border:1px solid #0b0b0e;}
.phone::before{content:"";position:absolute;inset:0;border-radius:30px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.09);pointer-events:none;z-index:6;}
.phone::after{content:"";position:absolute;right:-2px;top:98px;width:2.5px;height:40px;border-radius:2px;background:#45454d;}
.phone__scr{background:var(--surf);border-radius:26px;padding:30px 15px 18px;min-height:322px;position:relative;overflow:hidden;}
.phone__scr::before{content:"";position:absolute;top:9px;left:50%;transform:translateX(-50%);width:50px;height:14px;border-radius:99px;background:#0a0a0d;z-index:4;}
.phone__prog{display:flex;gap:4px;margin:6px 0 14px;}
.phone__prog i{flex:1;height:3px;border-radius:99px;background:var(--bd);} .phone__prog i.on{background:var(--accent);}
.phone__top{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.phone__q{font-size:13px;font-weight:600;line-height:1.35;margin:8px 0 14px;color:var(--fg);}
.phone__opt{font-size:12px;border:1px solid var(--bd);border-radius:10px;padding:10px 12px;margin-bottom:8px;color:var(--fg);display:flex;justify-content:space-between;align-items:center;}
.phone__opt.sel{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text);font-weight:600;}
.phone__opt.sel::after{content:"✓";color:var(--accent);font-weight:700;}
@media(max-width:900px){.phone{position:static;width:172px;margin:22px auto 0;}}

/* dashboard mini knowledge-graph */
.kgraph{margin-top:14px;padding-top:12px;border-top:1px solid var(--bd);}
.kgraph .kh{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);margin-bottom:6px;}
.kgraph svg{width:100%;height:78px;display:block;}

/* MCP ground agents */
.gpanel--mcp svg{height:auto;}

/* capability cards with icon */
.capviz{width:42px;height:42px;border-radius:11px;background:var(--accent-soft);display:grid;place-items:center;margin-bottom:14px;}
.capviz svg{width:22px;height:22px;stroke:var(--accent-text);fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;}
.card.cap .t{margin-top:0;}

/* solutions: varied image blocks */
.sblocks{display:grid;grid-template-columns:1.5fr 1fr 1fr;grid-auto-rows:190px;gap:14px;margin-top:38px;}
.sblock{position:relative;border-radius:16px;overflow:hidden;border:1px solid var(--bd);display:flex;align-items:flex-end;transition:.18s;}
.sblock:hover{transform:translateY(-3px);box-shadow:0 24px 46px -28px rgba(20,16,12,.45);}
.sblock img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;transition:transform .5s ease;} .sblock:hover img{transform:scale(1.05);}
.sblock::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(10,10,12,.82) 2%,rgba(10,10,12,.3) 42%,transparent 66%);}
.sblock .sb{position:relative;z-index:2;padding:18px 20px;color:#fff;}
.sblock .sb .k{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;opacity:.85;margin-bottom:5px;}
.sblock .sb .t{font-size:17px;font-weight:600;line-height:1.15;} .sblock .sb .s{font-size:13px;opacity:.9;margin-top:4px;line-height:1.35;}
.sblock--wide{grid-column:span 1;grid-row:span 2;}
.sblock--tall{grid-row:span 2;}
@media(max-width:760px){.sblocks{grid-template-columns:1fr 1fr;grid-auto-rows:170px;}.sblock--wide,.sblock--tall{grid-row:span 1;}}

/* ingest -> corpus source chips */
.ingest{display:grid;grid-template-columns:minmax(220px,auto) auto 1fr;gap:28px;align-items:center;margin-top:38px;}
.srcs{display:grid;gap:10px;} .src{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:500;border:1px solid var(--bd);background:var(--surf);border-radius:11px;padding:11px 14px;}
.src .si{width:26px;height:26px;border-radius:7px;background:var(--accent-soft);display:grid;place-items:center;color:var(--accent-text);font-family:var(--mono);font-size:10px;font-weight:600;}
.ingest__to{border:1px solid var(--bd);border-radius:16px;background:var(--surf);padding:26px 30px;}
.ingest__to .t{font-size:19px;font-weight:600;line-height:1.2;} .ingest__to p{font-size:14px;color:var(--muted);margin:10px 0 0;line-height:1.55;}
.ingest__to .shieldnote{display:inline-flex;align-items:center;gap:8px;margin-top:16px;font-size:12.5px;font-weight:500;color:var(--accent-text);}
.ingest__to .shieldnote .d{width:7px;height:7px;border-radius:50%;background:var(--accent);}
.ingest .arrow{align-self:center;color:var(--bd2);font-size:22px;}
@media(max-width:760px){.ingest{grid-template-columns:1fr;gap:18px;}.ingest .arrow{transform:rotate(90deg);justify-self:center;}}

/* solutions: the real situations (transcript-grounded), before -> after */
.situ{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:38px;}
.sit{border:1px solid var(--bd);border-radius:16px;background:var(--surf);padding:24px 26px;}
.sit .k{font-family:var(--mono);font-size:10px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text);}
.sit .t{font-size:18px;font-weight:600;margin:7px 0 0;line-height:1.22;}
.sit .s{font-size:13.5px;color:var(--muted);margin:8px 0 0;line-height:1.5;}
.flow{display:flex;flex-wrap:wrap;align-items:center;gap:7px;margin-top:17px;}
.flow .fs{font-size:12px;font-weight:500;border:1px solid var(--bd);background:var(--bg);border-radius:999px;padding:6px 11px;color:var(--fg);}
.flow .fs.hi{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-text);font-weight:600;}
.flow .fa{color:var(--bd2);font-size:13px;line-height:1;}
@media(max-width:760px){.situ{grid-template-columns:1fr;}}

/* ===== product: device trio (desktop / tablet / phone) ===== */
.trio{display:flex;align-items:flex-end;justify-content:center;margin-top:50px;}
/* laptop (canonical 16:10 lid + hinge base) — the large anchor */
.laptop{width:600px;max-width:100%;position:relative;z-index:1;}
.laptop__lid{position:relative;background:linear-gradient(150deg,#30303a,#15151a);border-radius:16px 16px 6px 6px;padding:11px 11px 12px;box-shadow:0 30px 60px -34px rgba(20,16,12,.42);}
.laptop__lid::after{content:"";position:absolute;top:4.5px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:#50505a;}
.laptop__screen{aspect-ratio:16/10;border-radius:5px;overflow:hidden;background:var(--surf);}
.laptop__screen .dash{height:100%;border:0;border-radius:0;box-shadow:none;display:flex;flex-direction:column;}
.laptop__screen .dash__body{flex:1;min-height:0;}
.laptop__screen .miniui__row{padding:6px 0;}
.laptop__screen .kgraph{margin-top:9px;padding-top:8px;} .laptop__screen .kgraph svg{height:44px;}
.laptop__base{position:relative;width:118%;margin-left:-9%;height:14px;background:linear-gradient(#e7e0d3,#c3b8a5);border-radius:0 0 12px 12px;box-shadow:0 12px 22px -12px rgba(20,16,12,.32);}
.laptop__base::before{content:"";position:absolute;top:0;left:50%;transform:translateX(-50%);width:104px;height:7px;background:#b2a794;border-radius:0 0 9px 9px;}
/* tablet — in front of the laptop, overlapping */
.tab{position:relative;z-index:2;margin-left:-74px;width:250px;background:linear-gradient(145deg,#3a3a44,#141419);border-radius:28px;padding:10px;box-shadow:-18px 30px 60px -28px rgba(20,16,12,.5);border:1px solid #0b0b0e;}
.tab::before{content:"";position:absolute;inset:0;border-radius:28px;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.08);pointer-events:none;z-index:6;}
.tab::after{content:"";position:absolute;top:5px;left:50%;transform:translateX(-50%);width:5px;height:5px;border-radius:50%;background:#50505a;z-index:7;}
.tab__scr{background:var(--surf);border-radius:20px;padding:22px 18px;min-height:326px;}
.tab__top{font-family:var(--mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text);margin-bottom:12px;}
/* phone — in front of the tablet, overlapping */
.trio .phone{position:relative;z-index:3;margin-left:-58px;right:auto;bottom:auto;width:182px;box-shadow:-18px 30px 60px -28px rgba(20,16,12,.5);}
.trio .phone::after{display:none;}
.trio .phone .phone__scr{min-height:300px;}
.miniui__h{font-size:12.5px;font-weight:600;margin-bottom:12px;}
.miniui__row{display:grid;grid-template-columns:1fr 60px;gap:9px;align-items:center;padding:8px 0;border-top:1px solid var(--bd);font-size:11px;color:var(--fg);}
.miniui__row:first-of-type{border-top:0;}
.miniui__row .mb{height:6px;border-radius:99px;background:var(--bd);overflow:hidden;}
.miniui__row .mb i{display:block;height:100%;background:var(--accent);border-radius:99px;} .miniui__row .mb i.warn{background:var(--warn);}
.trioframe{display:flex;justify-content:center;}
/* mobile: keep the laptop+tablet+phone as ONE composition, scaled down with
   transform:scale (renders identically on every browser, unlike `zoom`). The
   trio keeps its real 900x400 size; flex-centering centers the overflow, the
   frame clips it, and a measured negative margin-bottom reclaims the empty
   space the transform leaves behind (400px natural height x (1 - scale)). */
@media(max-width:980px){
  .trioframe{overflow:hidden;}
  .trio{width:900px;flex:none;margin-top:30px;transform:scale(var(--f,.58));transform-origin:top center;margin-bottom:calc(-400px * (1 - var(--f,.58)));}
  .laptop,.tab,.trio .phone{flex-shrink:0;}
}
@media(max-width:620px){.trio{--f:.42;}}
@media(max-width:430px){.trio{--f:.34;}}
@media(max-width:360px){.trio{--f:.30;}}

/* ===== egress shield: rule pills + targets ===== */
.rulepill{fill:var(--surf);stroke:var(--accent);stroke-width:1.2;}
.ruletxt{font-family:var(--mono);font-size:9px;fill:var(--accent-text);text-anchor:middle;dominant-baseline:middle;}
.tgtlbl{font-family:var(--mono);font-size:9px;letter-spacing:.05em;text-transform:uppercase;fill:rgba(27,23,20,.55);text-anchor:middle;}
.outbadge-txt{font-family:var(--mono);font-size:8px;fill:var(--ok);text-anchor:middle;}

/* ===== spectrum of knowing ===== */
.spectrum{margin-top:40px;}
.spectrum__rail{position:relative;height:10px;border-radius:99px;background:linear-gradient(90deg,var(--accent-soft),#E7944B 55%,var(--accent));overflow:hidden;}
.spectrum__rail::after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent,transparent 22px,rgba(255,255,255,.4) 22px,rgba(255,255,255,.4) 24px);}
.spectrum__ends{display:flex;justify-content:space-between;font-family:var(--mono);font-size:10px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted);margin-top:9px;}
.spectrum__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:22px;}
.spstop{border:1px solid var(--bd);border-radius:14px;background:var(--surf);padding:20px 18px;position:relative;}
.spstop .spk{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--accent-text);}
.spstop .spt{font-size:15.5px;font-weight:600;margin:7px 0 0;line-height:1.2;}
.spstop p{font-size:12.5px;color:var(--muted);margin:7px 0 0;line-height:1.5;}
.spdots{display:flex;gap:4px;margin-top:14px;}
.spdots i{width:17px;height:5px;border-radius:99px;background:var(--bd);}
.spdots i.on{background:var(--accent);}
@media(max-width:900px){.spectrum__grid{grid-template-columns:1fr 1fr;}}
@media(max-width:560px){.spectrum__grid{grid-template-columns:1fr;}}

/* ===== about: spinning corpus panel ===== */
.corpuspanel{position:relative;border-radius:20px;border:1px solid rgba(255,255,255,.1);overflow:hidden;background:radial-gradient(120% 115% at 50% 42%,#15151d,#0b0b11 78%);min-height:470px;display:grid;place-items:center;box-shadow:0 40px 80px -42px rgba(0,0,0,.6);}
.corpuspanel::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:34px 34px;-webkit-mask:radial-gradient(80% 80% at 50% 48%,#000 55%,transparent 92%);mask:radial-gradient(80% 80% at 50% 48%,#000 55%,transparent 92%);}
.corpuspanel svg{position:relative;z-index:1;width:88%;height:auto;}

/* "see more" funnel links + clickable cards (home) */
.morelink{display:inline-flex;align-items:center;gap:8px;margin-top:28px;font-weight:600;font-size:15px;color:var(--accent-text);cursor:pointer;}
.morelink .ar{transition:transform .18s;} .morelink:hover .ar{transform:translateX(4px);}
.card[data-go]{cursor:pointer;transition:.18s;} .card[data-go]:hover{transform:translateY(-3px);border-color:var(--bd2);box-shadow:0 22px 44px -28px rgba(20,16,12,.3);}
.rtile[data-go]{cursor:pointer;}
.card .cmore{margin-top:14px;font-size:13px;font-weight:600;color:var(--accent-text);display:inline-flex;align-items:center;gap:6px;}

/* tablet activity feed (differentiates from the desktop dashboard) */
.feed{display:flex;flex-direction:column;}
.feed__item{display:grid;grid-template-columns:auto 1fr;gap:11px;padding:12px 0;border-top:1px solid var(--bd);}
.feed__item:first-of-type{border-top:0;}
.feed__dot{width:9px;height:9px;border-radius:50%;background:var(--accent);margin-top:4px;}
.feed__dot.warn{background:var(--warn);} .feed__dot.ok{background:var(--ok);}
.feed__item .ft{font-size:12.5px;font-weight:600;color:var(--fg);line-height:1.25;}
.feed__item .fs{font-size:11px;color:var(--muted);margin-top:2px;}

/* hero flowing-lines ribbon */
.hero-rib{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.hero .in{position:relative;z-index:1;}

/* knowledge inquiry: attribute the agent as Loopy */
.msg{display:flex;gap:9px;align-items:flex-start;max-width:90%;}
.msg--agent{align-self:flex-start;}
.msg--you{align-self:flex-end;}
.av--loopy{width:27px;height:27px;border-radius:50%;background:var(--accent-soft);border:1px solid var(--accent);display:grid;place-items:center;flex:none;margin-top:2px;color:var(--accent-text);}
.av--loopy svg{width:15px;height:15px;}
.chat__h .av--loopy{width:22px;height:22px;margin-top:0;}
.chat__h .av--loopy svg{width:13px;height:13px;}
.msg__col{display:flex;flex-direction:column;gap:4px;min-width:0;}
.who{font-family:var(--mono);font-size:9px;letter-spacing:.07em;text-transform:uppercase;color:var(--accent-text);}

/* pricing: per-card note + plan comparison table */
.price .pnote{font-size:11.5px;color:var(--accent-text);margin:-6px 0 14px;line-height:1.4;}
.cmp-wrap{overflow-x:auto;margin-top:38px;border:1px solid var(--bd);border-radius:16px;background:var(--surf);}
.cmp{width:100%;border-collapse:collapse;font-size:13.5px;min-width:620px;}
.cmp th,.cmp td{padding:12px 16px;text-align:center;border-bottom:1px solid var(--bd);}
.cmp tr:last-child td{border-bottom:0;}
.cmp th:first-child,.cmp td:first-child{text-align:left;color:var(--fg);font-weight:500;width:36%;}
.cmp thead th{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent-text);border-bottom:1px solid var(--bd2);background:var(--bg);}
.cmp thead th:first-child{color:var(--muted);}
.cmp tbody td{color:var(--muted);}
.cmp .yes{color:var(--ok);font-weight:700;}
.cmp .no{color:var(--bd2);}
.cmp tbody tr:hover td{background:var(--bg);}
@media(max-width:700px){.cmp th,.cmp td{padding:10px 10px;}}
/* mobile: fit all four plan columns instead of horizontal-scrolling the table */
@media(max-width:560px){
  .cmp-wrap{overflow-x:visible;}
  .cmp{min-width:0;font-size:11.5px;}
  .cmp th,.cmp td{padding:9px 3px;}
  .cmp th:first-child,.cmp td:first-child{width:42%;padding-left:11px;line-height:1.25;}
  .cmp thead th{font-size:8.5px;letter-spacing:.01em;padding-left:2px;padding-right:2px;}
}

/* mobile nav (hamburger + slide-down menu) */
.navtog{display:none;flex-direction:column;justify-content:center;gap:5px;width:42px;height:38px;border:1px solid var(--bd2);border-radius:9px;background:transparent;cursor:pointer;padding:0 10px;margin-left:auto;}
.navtog span{display:block;height:2px;width:100%;background:var(--fg);border-radius:2px;transition:transform .2s,opacity .2s;}
.navtog[aria-expanded="true"] span:nth-child(1){transform:translateY(7px) rotate(45deg);}
.navtog[aria-expanded="true"] span:nth-child(2){opacity:0;}
.navtog[aria-expanded="true"] span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
.navmenu{display:none;}
@media(max-width:760px){
  .nav .lk{display:none;}
  .navcta{display:none;}
  .nav .sp{display:none;}
  .navtog{display:flex;}
  .nav .in{justify-content:space-between;gap:0;}
  .navmenu{display:block;position:fixed;left:0;right:0;top:calc(64px + env(safe-area-inset-top,0px));background:var(--bg);border-bottom:1px solid var(--bd);box-shadow:0 22px 40px -22px rgba(20,16,12,.3);padding:10px 24px 24px;transform:translateY(-10px);opacity:0;pointer-events:none;transition:transform .2s,opacity .2s;z-index:55;}
  .navmenu.open{transform:translateY(0);opacity:1;pointer-events:auto;}
  .navmenu a{display:block;padding:13px 2px;font-size:16px;font-weight:500;color:var(--fg);border-bottom:1px solid var(--bd);}
  .navmenu a[aria-current="true"]{color:var(--accent-text);}
  .navmenu__cta{display:flex;flex-direction:column;gap:10px;margin-top:16px;}
  .navmenu__cta .btn{justify-content:center;padding:13px;font-size:15px;}
}

/* ===== promos: exit-intent modal + scroll CTA (signup-focused) ===== */
.promo-modal{position:fixed;inset:0;z-index:200;display:grid;place-items:center;padding:20px;background:rgba(20,16,12,.5);opacity:0;transition:opacity .2s;}
.promo-modal.in{opacity:1;}
.promo-modal__card{position:relative;background:var(--bg);border:1px solid var(--bd);border-radius:20px;max-width:460px;width:100%;padding:38px 36px 34px;box-shadow:0 50px 100px -40px rgba(20,16,12,.6);transform:translateY(10px) scale(.98);transition:transform .22s;overflow:hidden;}
.promo-modal.in .promo-modal__card{transform:none;}
.promo-modal__card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--accent);}
.promo-modal__x{position:absolute;top:14px;right:16px;width:30px;height:30px;border:0;background:transparent;font-size:24px;line-height:1;color:var(--muted);cursor:pointer;border-radius:8px;}
.promo-modal__x:hover{background:rgba(27,23,20,.06);color:var(--fg);}
.promo-modal__card h2{font-size:26px;font-weight:500;letter-spacing:-.02em;line-height:1.12;margin:8px 0 0;text-wrap:balance;}
.promo-sub{font-size:15px;color:var(--muted);line-height:1.55;margin:12px 0 0;}
.promo-modal__card .acts{margin-top:24px;}
.promo-coupon{margin-top:18px;padding-top:16px;border-top:1px solid var(--bd);font-size:13px;color:var(--accent-text);font-weight:600;display:flex;align-items:center;gap:8px;}
.promo-coupon .d{width:7px;height:7px;border-radius:50%;background:var(--accent);flex:none;}
.promo-scroll{position:fixed;right:20px;bottom:20px;z-index:150;width:322px;max-width:calc(100% - 40px);background:#15151d;border:1px solid #2c2c38;border-radius:16px;box-shadow:0 34px 64px -22px rgba(0,0,0,.65);padding:18px 20px 20px;transform:translateY(16px);opacity:0;transition:transform .25s,opacity .25s;}
.promo-scroll.in{transform:none;opacity:1;}
.promo-scroll::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:0 3px 3px 0;background:var(--accent);}
.promo-scroll__x{position:absolute;top:10px;right:12px;width:26px;height:26px;border:0;background:transparent;font-size:20px;line-height:1;color:rgba(255,255,255,.55);cursor:pointer;border-radius:7px;}
.promo-scroll__x:hover{background:rgba(255,255,255,.1);color:#fff;}
.promo-scroll__t{font-size:15px;font-weight:600;line-height:1.2;padding-right:18px;color:#F2F3F5;}
.promo-scroll p{font-size:13px;color:#AEB2BC;line-height:1.45;margin:6px 0 14px;}
.promo-scroll .btn{width:100%;justify-content:center;}
@media(max-width:560px){.promo-scroll{right:16px;left:16px;bottom:16px;width:auto;}}

/* ensure the hidden attribute always wins (promo-modal sets display:grid, which otherwise defeats [hidden]) */
[hidden]{display:none!important;}

/* promo animated backgrounds + CTA motion */
.promo-scroll{overflow:hidden;}
.promo-bg{position:absolute;inset:0;width:100%;height:100%;z-index:0;pointer-events:none;}
.promo-scroll__t,.promo-scroll p,.promo-scroll .btn{position:relative;z-index:1;}
.promo-scroll__x{z-index:2;}
.promo-scroll::before{z-index:1;}
.promo-modal__card > .eyebrow,.promo-modal__card h2,.promo-modal__card .promo-sub,.promo-modal__card .acts{position:relative;z-index:1;}
.promo-modal__x{z-index:2;}
.promo-modal__card::before{z-index:1;}
@keyframes nudge{0%,100%{transform:translateX(0)}50%{transform:translateX(4px)}}
.promo-modal__card .btn--p .ar{display:inline-block;animation:nudge 1.4s ease-in-out infinite;}
@media (prefers-reduced-motion:reduce){.promo-modal__card .btn--p .ar{animation:none;}}

/* exit-intent: dark framing variant (matches the scroll-CTA) */
.promo-modal--dark .promo-modal__card{background:#15151d;border-color:#2c2c38;box-shadow:0 50px 100px -40px rgba(0,0,0,.72);}
.promo-modal--dark .promo-modal__card h2{color:#F2F3F5;}
.promo-modal--dark .promo-sub{color:#AEB2BC;}
.promo-modal--dark .promo-modal__card .eyebrow{color:#E0944A;}
.promo-modal--dark .promo-modal__x{color:rgba(255,255,255,.55);}
.promo-modal--dark .promo-modal__x:hover{background:rgba(255,255,255,.1);color:#fff;}
.promo-modal--dark .btn--o{color:#F2F3F5;border-color:rgba(255,255,255,.28);}
.promo-modal--dark .btn--o:hover{border-color:#fff;background:rgba(255,255,255,.06);}

/* product hero: smaller, correctly-proportioned phone tucked at the dash's bottom-right */
.devices .phone{width:122px;right:-2px;bottom:-12px;}
.devices .phone .phone__scr{min-height:0;height:244px;padding:22px 10px 10px;}
.devices .phone .phone__scr::before{width:40px;height:12px;top:8px;}
.devices .phone::after{top:62px;height:26px;}
.devices .phone__prog{margin:5px 0 9px;}
.devices .phone__top{font-size:7.5px;}
.devices .phone__q{font-size:10px;line-height:1.3;margin:7px 0 9px;}
.devices .phone__opt{font-size:9px;padding:6px 8px;margin-bottom:5px;border-radius:7px;}
/* mobile: keep the small phone tucked against the dash (overlap), not stacked below it.
   Keep its desktop size/aspect (do not resize width alone, which distorts it). */
@media(max-width:900px){.devices{position:relative;} .devices .phone{position:absolute;margin:0;right:2px;}}
