/* The home page (deepbot.studio/): the presentation the DeepBot Sites app built (2026-10-12),
   in English. Every class is h-* and scoped to .home, so nothing here reaches the catalogue, the
   docs or the admin, which keep site.css. */
.home{
  --cream:#f7f2e8; --cream-2:#efe8d8; --paper:#fffdf8;
  --ink:#14161c; --ink-2:#1d2028; --ink-3:#2a2e38;
  --muted:#6b6557; --line:rgba(20,22,28,.12);
  --yellow:#FFD43B; --yellow-d:#e8b900; --yellow-t:#fff3bf;
  --r:22px;
  --display:"Bricolage Grotesque","Manrope",system-ui,sans-serif;
  --body:"Manrope",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,Consolas,monospace;
}
.home *{box-sizing:border-box;margin:0;padding:0}
.home{scroll-behavior:smooth;scroll-padding-top:90px}
.home{font-family:var(--body);background:var(--cream);color:var(--ink);line-height:1.6;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.home img,.home svg{display:block;max-width:100%}
.home a{color:inherit;text-decoration:none}
.home ul,.home ol{list-style:none}
.home button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}
.home code{font-family:var(--mono);font-size:.88em}
.home :focus-visible{outline:3px solid var(--ink);outline-offset:3px;border-radius:6px}
.home .h-dark :focus-visible{outline-color:var(--yellow)}
.home .h-wrap{width:min(1180px,calc(100% - 48px));margin-inline:auto}

.home .h-btn{display:inline-flex;align-items:center;gap:10px;padding:16px 26px;border-radius:999px;font-weight:700;font-size:1rem;transition:transform .2s,box-shadow .2s,background .2s;white-space:nowrap}
.home .h-btn span{transition:transform .2s}
.home .h-btn:hover span{transform:translateX(4px)}
.home .h-btn-sm{padding:10px 18px;font-size:.9rem}
.home .h-btn-yellow{background:var(--yellow);color:var(--ink);box-shadow:0 2px 0 var(--yellow-d),0 14px 30px -10px rgba(232,185,0,.7)}
.home .h-btn-yellow:hover{transform:translateY(-2px);box-shadow:0 4px 0 var(--yellow-d),0 18px 34px -10px rgba(232,185,0,.8)}
.home .h-btn-ink{background:var(--ink);color:#fff}
.home .h-btn-ink:hover{background:var(--ink-3);transform:translateY(-2px)}
.home .h-btn-ghost{border:1.5px solid var(--ink);}
.home .h-btn-ghost:hover{background:var(--ink);color:#fff}

.home h1,.home h2,.home h3{font-family:var(--display);letter-spacing:-.03em;line-height:1.02}
.home .h-eyebrow{display:inline-flex;align-items:center;gap:10px;font-family:var(--mono);font-size:.78rem;font-weight:500;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.home .h-eyebrow .h-dot{width:9px;height:9px;border-radius:50%;background:var(--yellow);box-shadow:0 0 0 4px rgba(255,212,59,.3)}
.home .h-eyebrow.h-on-dark{color:#b9b4a6}
.home .h-sec{padding:130px 0;position:relative}
.home .h-sec h2{font-size:clamp(2.4rem,5.6vw,4.6rem);font-weight:800;margin:20px 0 22px}
.home .h-sub{font-size:1.15rem;color:var(--muted);max-width:56ch}
.home .h-sec-head{margin-bottom:64px}
.home .h-sec-head.h-center{text-align:center}
.home .h-sec-head.h-center .h-eyebrow{justify-content:center}
.home .h-dark{background:var(--ink);color:#f4efe2}
.home .h-dark .h-sub{color:#aaa595}
.home .h-tint{background:var(--cream-2)}

.home .h-hero{padding:88px 0 90px;position:relative;overflow:hidden}
.home .h-hero::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 1px 1px,rgba(20,22,28,.14) 1.2px,transparent 0) 0 0/28px 28px;-webkit-mask-image:radial-gradient(ellipse 70% 70% at 70% 40%,#000,transparent 75%);mask-image:radial-gradient(ellipse 70% 70% at 70% 40%,#000,transparent 75%)}
.home .h-hero-grid{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:40px;align-items:center}
.home .h-hero h1{font-size:clamp(2.8rem,5.6vw,5rem);font-weight:800;margin:26px 0 28px;line-height:.96}
.home .h-hl{position:relative;display:inline;background:linear-gradient(transparent 62%,var(--yellow) 62%,var(--yellow) 92%,transparent 92%);padding:0 .08em;-webkit-box-decoration-break:clone;box-decoration-break:clone}
.home .h-lead{font-size:1.28rem;max-width:50ch;color:#3b3a35}
.home .h-cta-row{display:flex;flex-wrap:wrap;gap:14px;margin-top:38px}
.home .h-cta-row.h-center{justify-content:center}
.home .h-hero-facts{display:flex;flex-wrap:wrap;gap:12px 34px;margin-top:54px;padding-top:26px;border-top:1px solid var(--line);font-size:.92rem;color:var(--muted)}
.home .h-hero-facts b{font-family:var(--display);font-size:1.7rem;color:var(--ink);margin-right:6px;letter-spacing:-.03em}

.home .h-stage{position:relative;aspect-ratio:1/1.05;display:grid;place-items:center}
.home .h-glow{position:absolute;width:86%;aspect-ratio:1;border-radius:50%;background:radial-gradient(circle,rgba(255,212,59,.7),rgba(255,212,59,0) 68%);filter:blur(6px);animation:h-pulse 5s ease-in-out infinite}
@keyframes h-pulse{50%{transform:scale(1.08);opacity:.85}}
.home .h-mascot{position:relative;width:min(62%,300px);aspect-ratio:52/56;animation:h-float 5s ease-in-out infinite;filter:drop-shadow(0 30px 30px rgba(120,90,0,.25))}
.home .h-mascot .h-egg{width:100%;height:100%;fill:var(--yellow)}
.home .h-eye{position:absolute;top:44%;width:13.8%;height:21%;background:var(--ink);border-radius:999px;transition:transform .15s ease-out;animation:h-blink 6s infinite}
.home .h-eye-l{left:27%;transform:rotate(3deg)}
.home .h-eye-r{right:27%;transform:rotate(-3deg)}
.home .h-cheek{position:absolute;left:50%;top:70%;width:22%;height:4%;transform:translateX(-50%);border-bottom:4px solid var(--ink);border-radius:0 0 40px 40px;opacity:.0}
@keyframes h-float{50%{transform:translateY(-16px) rotate(-1.5deg)}}
@keyframes h-blink{0%,94%,100%{height:21%;top:44%}96.5%{height:3%;top:53%}}
.home .h-shadow{position:absolute;bottom:9%;width:36%;height:22px;border-radius:50%;background:rgba(20,22,28,.18);filter:blur(10px);animation:h-sh 5s ease-in-out infinite}
@keyframes h-sh{50%{transform:scale(.8);opacity:.6}}
.home .h-chip{position:absolute;display:flex;gap:12px;align-items:center;padding:12px 18px 12px 12px;background:var(--paper);border:1px solid var(--line);border-radius:18px;box-shadow:0 18px 40px -18px rgba(20,22,28,.35);font-size:.82rem;line-height:1.3;animation:h-bob 6s ease-in-out infinite}
.home .h-chip b{display:block;font-weight:700;font-size:.86rem}
.home .h-chip span{color:var(--muted)}
.home .h-chip-a{top:9%;left:-6%;animation-delay:-1s}
.home .h-chip-b{top:42%;right:-8%;animation-delay:-3s}
.home .h-chip-c{bottom:8%;left:2%;animation-delay:-4.5s}
@keyframes h-bob{50%{transform:translateY(-9px)}}
.home .h-ico{flex:none;width:34px;height:34px;border-radius:11px;background:var(--yellow);position:relative}
.home .h-ico::after{content:"";position:absolute;inset:0;background:var(--ink);-webkit-mask:center/18px no-repeat;mask:center/18px no-repeat}
.home .h-ico.h-ok::after{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M5 12l5 5L20 7'/%3E%3C/svg%3E")}
.home .h-ico.h-clock::after{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}
.home .h-ico.h-mem::after{-webkit-mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v14H4z'/%3E%3Cpath d='M8 10h8M8 14h5'/%3E%3C/svg%3E");mask-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 5h16v14H4z'/%3E%3Cpath d='M8 10h8M8 14h5'/%3E%3C/svg%3E")}

.home .h-ticker{background:var(--yellow);border-block:2px solid var(--ink);overflow:hidden;transform:rotate(-1deg) scale(1.02);margin:0 -10px;position:relative;z-index:2}
.home .h-ticker-track{display:flex;align-items:center;gap:28px;width:max-content;padding:16px 0;animation:h-tick 40s linear infinite;font-family:var(--display);font-weight:800;font-size:1.5rem;letter-spacing:-.02em;text-transform:uppercase}
.home .h-ticker-track i{width:12px;height:12px;border-radius:50%;background:var(--ink);flex:none}
@keyframes h-tick{to{transform:translateX(-50%)}}

.home .h-team{display:grid;grid-template-columns:1.1fr .9fr;gap:34px;align-items:start}
.home .h-roster{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.home .h-bot{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:26px;transition:transform .3s,box-shadow .3s}
.home .h-bot:hover{transform:translateY(-6px) rotate(-.6deg);box-shadow:0 26px 44px -22px rgba(20,22,28,.35)}
.home .h-bot h3{font-size:1.5rem;margin:18px 0 2px;font-weight:700}
.home .h-bot code{color:var(--muted);font-size:.8rem}
.home .h-bot p{margin-top:12px;color:#4a483f;font-size:.96rem}
.home .h-thread{background:var(--ink);color:#f4efe2;border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:20px;position:sticky;top:100px}
.home .h-thread-h{font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.1em;color:#8d8a80}
.home .h-msg{display:flex;gap:12px;align-items:flex-start}
.home .h-msg b{font-size:.9rem}
.home .h-msg p{font-size:.94rem;color:#cfcabb;margin-top:2px}
.home .h-msg code{background:rgba(255,255,255,.08);padding:1px 6px;border-radius:5px}
.home mark{background:var(--yellow);color:var(--ink);padding:0 6px;border-radius:6px;font-weight:700}
.home .h-msg.h-done{padding-top:18px;border-top:1px dashed rgba(255,255,255,.18);align-items:center}
.home .h-msg.h-done p{margin:0;color:var(--yellow);font-weight:600}
.home .h-tick{width:30px;height:30px;border-radius:50%;background:var(--yellow);flex:none;position:relative}
.home .h-tick::after{content:"";position:absolute;left:10px;top:6px;width:7px;height:13px;border:solid var(--ink);border-width:0 3px 3px 0;transform:rotate(45deg)}

.home .h-bento{display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.home .h-app{position:relative;background:var(--c);color:var(--t);border:1px solid var(--line);border-radius:var(--r);padding:28px;display:flex;flex-direction:column;gap:12px;min-height:250px;overflow:hidden;transition:transform .3s,box-shadow .3s}
.home .h-app:hover{transform:translateY(-6px);box-shadow:0 30px 50px -26px rgba(20,22,28,.45)}
.home .h-app-xl{grid-column:span 2;grid-row:span 2}
.home .h-app-wide{grid-column:span 2}
.home .h-app h3{font-size:1.55rem;font-weight:700;margin-top:auto}
.home .h-app p{font-size:.95rem;opacity:.82}
.home .h-app-ico{width:52px;height:52px;border-radius:16px;background:var(--a);color:var(--c);display:grid;place-items:center}
.home .h-app-ico svg{width:28px;height:28px}
.home .h-app-xl .h-app-ico{color:var(--c)}
.home .h-app:not(.h-app-xl):not([style*="#FFD43B;--t"]) .h-app-ico{color:var(--ink)}
.home .h-app[style*="--c:#FFD43B"] .h-app-ico{background:var(--ink);color:var(--yellow)}
.home .h-pro{position:absolute;top:22px;right:22px;font-family:var(--mono);font-size:.7rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;padding:5px 10px;border-radius:999px;border:1.5px solid currentColor;opacity:.75}
.home .h-app-xl h3{font-size:2.4rem;margin-top:22px}
.home .h-app-xl p{font-size:1.05rem;max-width:36ch}
.home .h-mini-site{margin-top:auto;position:relative;height:150px;border-radius:14px;background:#22262f;padding:16px;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:auto 1fr auto;gap:8px}
.home .h-mini-site i{height:8px;border-radius:4px;background:#3a3f4b}
.home .h-mini-site b{grid-column:1/-1;border-radius:10px;background:linear-gradient(110deg,var(--yellow) 0 38%,#2c313c 38%);animation:h-scan 4s ease-in-out infinite alternate}
.home .h-mini-site em{grid-column:span 1;height:12px;border-radius:5px;background:#3a3f4b}
@keyframes h-scan{to{background:linear-gradient(110deg,var(--yellow) 0 72%,#2c313c 72%)}}

.home .h-mem{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.home .h-card{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:30px;display:flex;flex-direction:column;gap:14px;transition:transform .3s,box-shadow .3s}
.home .h-card:hover{transform:translateY(-6px);box-shadow:0 30px 50px -28px rgba(20,22,28,.4)}
.home .h-tag{display:inline-block;font-family:var(--mono);font-size:.74rem;text-transform:uppercase;letter-spacing:.08em;background:var(--yellow-t);color:#6b5400;padding:5px 12px;border-radius:999px;font-weight:500}
.home .h-card h3{font-size:1.7rem;font-weight:700;line-height:1.06}
.home .h-card p{color:#4a483f}
.home .h-rooms{display:flex;flex-wrap:wrap;gap:8px;margin-top:auto}
.home .h-rooms span{font-family:var(--mono);font-size:.8rem;padding:6px 12px;border-radius:10px;background:var(--cream);border:1px solid var(--line)}
.home .h-cron{margin-top:auto;display:flex;flex-direction:column;gap:6px;background:var(--ink);color:#fff;padding:16px 18px;border-radius:14px}
.home .h-cron code{color:var(--yellow);font-size:1.2rem;font-weight:700}
.home .h-cron span{color:#aaa595;font-size:.88rem}
.home .h-steps{margin-top:auto;display:flex;align-items:center;gap:7px}
.home .h-steps i{width:30px;height:30px;border-radius:9px;background:var(--cream-2);border:1px solid var(--line)}
.home .h-steps b{margin-left:8px;font-family:var(--mono);font-size:.88rem;background:var(--yellow);padding:7px 12px;border-radius:10px}

.home .h-priv-grid{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center}
.home .h-huge{font-size:clamp(2.4rem,5vw,4.4rem)!important}
.home .h-yl{color:var(--yellow)}
.home .h-checks{display:flex;flex-direction:column;gap:30px}
.home .h-checks li{display:flex;gap:18px}
.home .h-checks i{flex:none;width:30px;height:30px;border-radius:50%;background:var(--yellow);position:relative;margin-top:3px}
.home .h-checks i::after{content:"";position:absolute;left:10px;top:6px;width:7px;height:13px;border:solid var(--ink);border-width:0 3px 3px 0;transform:rotate(45deg)}
.home .h-checks b{font-family:var(--display);font-size:1.35rem;font-weight:700;letter-spacing:-.02em;color:#fff}
.home .h-checks p{color:#aaa595;margin-top:4px}

.home .h-how{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;counter-reset:s}
.home .h-how li{position:relative;padding:34px 30px 30px;background:var(--paper);border:1px solid var(--line);border-radius:var(--r)}
.home .h-n{display:grid;place-items:center;width:54px;height:54px;border-radius:50%;background:var(--ink);color:var(--yellow);font-family:var(--display);font-weight:800;font-size:1.6rem;margin-bottom:22px}
.home .h-how h3{font-size:1.6rem;margin-bottom:10px;font-weight:700}
.home .h-how p{color:#4a483f}

.home .h-final{background:var(--yellow);padding:120px 0 110px;text-align:center;position:relative;overflow:hidden;border-top:2px solid var(--ink)}
.home .h-final::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 1px 1px,rgba(20,22,28,.18) 1.4px,transparent 0) 0 0/26px 26px;opacity:.5}
.home .h-final-in{position:relative}
.home .h-final h2{font-size:clamp(2.6rem,6.4vw,5.6rem);font-weight:800;max-width:14ch;margin:26px auto 16px}
.home .h-final p{font-size:1.2rem;color:#3b3200}
.home .h-final small{display:block;margin-top:20px;color:#5c4d00;font-family:var(--mono);font-size:.78rem}
.home .h-mascot.h-small{width:112px;margin:0 auto;animation-duration:4s;filter:drop-shadow(0 16px 16px rgba(120,90,0,.3))}
.home .h-mascot.h-small .h-egg{fill:var(--ink)}
.home .h-mascot.h-small .h-eye{background:var(--yellow)}

.home .h-reveal{opacity:0;transform:translateY(28px);transition:opacity .8s cubic-bezier(.2,.7,.2,1),transform .8s cubic-bezier(.2,.7,.2,1)}
.home .h-reveal.in{opacity:1;transform:none}
.home .h-d1{transition-delay:.1s}.home .h-d2{transition-delay:.2s}.home .h-d3{transition-delay:.3s}.home .h-d4{transition-delay:.4s}
.home.h-no-js .h-reveal{opacity:1;transform:none}

@media (max-width:980px){
  
  .home .h-hero{padding-top:64px}
  .home .h-hero-grid,.home .h-team,.home .h-priv-grid{grid-template-columns:1fr}
  .home .h-stage{max-width:440px;margin-inline:auto;width:100%}
  .home .h-chip-a{left:0}.home .h-chip-b{right:0}
  .home .h-bento{grid-template-columns:1fr 1fr}
  .home .h-app-xl{grid-column:span 2;grid-row:auto}
  .home .h-mem,.home .h-how,.home .h-trio{grid-template-columns:1fr}
  .home .h-thread{position:static}
  .home .h-sec{padding:90px 0}
  .home .h-m-body{grid-template-columns:1fr}
  .home .h-m-side{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid rgba(255,255,255,.07)}
  .home .h-m-side p{display:none}
  .home .h-side-item{white-space:nowrap}
}
@media (max-width:560px){
  .home .h-wrap{width:calc(100% - 32px)}
  
  .home .h-roster{grid-template-columns:1fr}
  .home .h-bento{grid-template-columns:1fr}
  .home .h-app-xl,.home .h-app-wide{grid-column:auto}
  .home .h-chip{transform:scale(.88)}
  .home .h-chip-b{top:46%}
  .home .h-ticker-track{font-size:1.1rem}
  .home .h-btn{padding:14px 22px}
}
@media (prefers-reduced-motion:reduce){
  .home *,.home *::before,.home *::after{animation:none!important;transition:none!important}
  .home .h-reveal{opacity:1;transform:none}
  .home{scroll-behavior:auto}
}


.home .h-stage .h-chip-b{top:auto;bottom:6%;right:-9%}
@media (max-width:980px){.home .h-stage .h-chip-b{right:0}}
@media (max-width:560px){.home .h-stage .h-chip-b{top:auto;bottom:2%}}
.home code{background:none;padding:0;border:0;border-radius:0}
.home pre{background:none;padding:0;border:0;margin:0;border-radius:0;overflow:visible}
.home .h-from-catalogue{margin-top:56px}
.home .h-from-catalogue h3{font-size:1.4rem;font-weight:700;margin-bottom:18px}
.home .h-tools-cta{display:flex;margin-top:34px}
.home .h-build{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:30px;align-items:center}
.home .h-build h2{font-size:clamp(2rem,4vw,3.2rem);margin:16px 0 14px}
@media (max-width:720px){.home .h-build{grid-template-columns:1fr}}