/* Ants of AI — site styles */
:root{
  --soil:#1C1612;--soil-2:#2A211B;--soil-3:#3A2D24;--line-dark:#4A3C31;
  --sand:#FBF6EE;--card:#FFFDF9;--line:#E8DCCB;--sand-2:#F3ECE2;
  --ink:#1C1612;--muted:#5B5048;--muted-dark:#C9BBAA;--cream:#F5EDE3;
  --amber:#F2A93B;--amber-soft:#F2C77A;--cta:#C2410C;--cta-dark:#9A3412;
  --leaf:#1F3D2B;--leaf-text:#CFE3D3;
  --display:'Bricolage Grotesque',system-ui,sans-serif;--body:Inter,system-ui,-apple-system,'Segoe UI',sans-serif;
  --radius:24px;--max:1200px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--sand);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.55;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{max-width:100%;display:block}
a{color:var(--cta)}a:hover{color:var(--cta-dark)}
h1,h2,h3{font-family:var(--display);letter-spacing:-.03em;line-height:1.02;margin:0}
p{margin:0}
.wrap{max-width:var(--max);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-999px}.skip:focus{left:16px;top:16px;z-index:99;background:#fff;padding:10px 14px;border-radius:8px}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--cta)}
.eyebrow.on-dark{color:var(--amber)}
.lead{font-size:18px;color:var(--muted);max-width:720px}
.dots{background-color:var(--soil);background-image:radial-gradient(rgba(242,169,59,.08) 1px,transparent 1.3px);background-size:20px 20px;color:var(--cream)}
.section{padding:88px 0}
.section-head{display:flex;flex-direction:column;gap:10px;margin-bottom:32px;max-width:760px}
.section-head h2{font-size:clamp(36px,5vw,56px)}

/* buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 24px;border-radius:999px;font:inherit;font-weight:700;font-size:16px;text-decoration:none;border:0;cursor:pointer;transition:transform .15s ease}
.btn:hover{transform:translateY(-2px)}
.btn-cta{background:var(--cta);color:#fff}.btn-cta:hover{color:#fff}
.btn-amber{background:var(--amber);color:var(--ink)}.btn-amber:hover{color:var(--ink)}
.btn-ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
.btn-ghost-light{background:transparent;color:var(--cream);border:1px solid #8C7B6B}.btn-ghost-light:hover{color:#fff}

/* header */
.site-header{background:var(--soil);color:var(--cream);border-bottom:1px solid #2E251E;position:sticky;top:0;z-index:50}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:68px;flex-wrap:wrap}
.logo{display:flex;align-items:center;gap:10px;color:var(--cream);text-decoration:none}
.logo:hover{color:#fff}
.logo-word{font-family:var(--display);font-weight:800;font-size:22px;letter-spacing:-.02em}
.logo-word b{color:var(--amber)}
.nav{display:flex;gap:22px;flex-wrap:wrap;align-items:center}
.nav a{color:#E7DCCD;text-decoration:none;font-size:15px}.nav a:hover{color:#fff}
.nav .btn{min-height:42px;padding:0 18px;font-size:14px}
.nav a[href='/become-an-antrepreneur/']{color:#F2C77A;font-weight:600}

/* hero */
.hero{position:relative;overflow:hidden;color:var(--cream);background:var(--soil)}
.hero-photo{position:absolute;inset:-2%;background:url(../img/ants-marching.jpg) center 62%/cover no-repeat;animation:kb 26s ease-in-out infinite alternate}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(28,22,18,.95) 0%,rgba(28,22,18,.82) 42%,rgba(28,22,18,.35) 72%,rgba(28,22,18,.15) 100%)}
.hero .wrap{position:relative;z-index:2;padding-top:92px;padding-bottom:300px;display:flex;flex-direction:column;gap:24px}
.pill{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;background:var(--soil-2);border:1px solid var(--line-dark);color:var(--amber-soft);font-size:13px;font-weight:600;padding:7px 14px;border-radius:999px}
.pulse{width:8px;height:8px;border-radius:999px;background:var(--amber);animation:pulse 2s ease-out infinite}
.hero h1{font-size:clamp(44px,7vw,78px);font-weight:800;max-width:920px;letter-spacing:-.035em;line-height:.98}
.hero h1 span{color:var(--amber)}
.hero-line{font-size:22px;line-height:1.45;color:#E7DCCD;max-width:780px}
.hero-line strong{color:#fff}
.hero-line small{display:block;font-size:17px;color:var(--muted-dark);margin-top:4px}
.caret{display:inline-block;width:3px;height:.9em;background:var(--amber);margin-left:4px;vertical-align:-.08em;animation:blink 1s steps(1) infinite}
.hero-ctas{display:flex;gap:12px;flex-wrap:wrap}

/* marquee */
.marquee{background:var(--amber);overflow:hidden;border-top:1px solid #D98E1E;border-bottom:1px solid #D98E1E}
.marquee-track{display:flex;width:max-content;padding:16px 0;font-family:var(--display);font-size:20px;font-weight:800;color:var(--ink);animation:scroll 40s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
.marquee-track span{display:flex;align-items:center;gap:28px;padding-right:28px;white-space:nowrap}
.marquee-track i{width:8px;height:8px;border-radius:999px;background:var(--ink);display:inline-block}

/* USP tiles */
.tiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.tile{background:var(--card);border:1px solid var(--line);border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:10px;min-height:200px;transition:transform .2s ease,box-shadow .2s ease}
.tile:hover,.card:hover{transform:translateY(-4px);box-shadow:0 16px 32px rgba(28,22,18,.12)}
.tile b{font-family:var(--display);font-weight:800;font-size:clamp(44px,4.4vw,60px);white-space:nowrap;line-height:.95;letter-spacing:-.04em;color:var(--cta)}
.tile strong{font-size:19px;margin-top:auto}
.tile span{color:var(--muted);font-size:15px}
.tile.dark{background:var(--soil);border-color:var(--soil);color:var(--cream)}
.tile.dark b{color:var(--amber)}.tile.dark span{color:var(--muted-dark)}

/* comparison */
.compare{overflow-x:auto;border:1px solid var(--line);border-radius:24px;background:var(--card);margin-top:36px}
.compare table{width:100%;min-width:620px;border-collapse:collapse;font-size:15px}
.compare th,.compare td{padding:16px 18px;text-align:left;border-top:1px solid var(--line);vertical-align:top}
.compare thead th{border-top:0;font-family:var(--display);font-size:20px}
.compare .us{background:#FFF4E2;font-weight:600}
.compare thead .us{background:var(--amber)}
.compare .yes::before{content:"✓ ";color:#1F6B3A;font-weight:800}
.compare .no{color:var(--muted)}.compare .no::before{content:"✕ ";color:#B42318;font-weight:800}

/* race */
.race{border-radius:36px;padding:40px;display:flex;flex-direction:column;gap:24px}
.race h2{font-size:clamp(34px,4.6vw,48px)}
.race-tasks{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.race-tasks li{font-size:14px;font-weight:600;padding:10px 18px;border-radius:999px;border:1px solid var(--line-dark);color:#8C7B6B}
.race-tasks li.on{background:var(--amber);border-color:var(--amber);color:var(--ink);font-weight:800}
.lane{display:flex;flex-direction:column;gap:8px}
.lane-head{display:flex;justify-content:space-between;gap:12px;font-size:15px}
.track{position:relative;height:52px;border-radius:999px;background:var(--soil-2);border:1px solid var(--soil-3);overflow:hidden}
.fill{position:absolute;left:0;top:0;bottom:0;border-radius:999px;background:var(--amber);width:0}
.fill.human{background:#8C735C}
.runner{position:absolute;top:12px;left:0;color:var(--ink)}
.race-note{font-size:12px;color:#8C7B6B}
.race-msg{font-weight:600;color:var(--amber-soft);min-height:1.5em}

/* colony */
.hill{position:relative;border-radius:36px;overflow:hidden;background-color:var(--soil-2);background-image:radial-gradient(rgba(242,169,59,.07) 1px,transparent 1.3px),radial-gradient(rgba(0,0,0,.18) 2px,transparent 2.5px);background-size:18px 18px,46px 46px;background-position:0 0,9px 13px}
.surface{position:relative;height:128px}
.surface svg{position:absolute;inset:0;width:100%;height:128px}
.surface-label{position:absolute;left:24px;top:20px;font-size:12px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.chambers{position:relative;padding:36px 28px 40px 48px;display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:44px 28px;list-style:none;margin:0}
.chambers::before{content:"";position:absolute;left:24px;top:0;bottom:40px;width:12px;border-radius:6px;background:var(--soil-3)}
.room{position:relative}
.room::before{content:"";position:absolute;top:50%;left:-30px;width:32px;height:12px;margin-top:-6px;background:var(--soil-3);border-radius:6px}
.room::after{content:"";position:absolute;left:50%;top:-46px;width:12px;height:48px;margin-left:-6px;background:var(--soil-3);border-radius:6px}
.room a{position:relative;z-index:1;min-height:156px;padding:18px 16px 44px;border:2px solid var(--line-dark);border-radius:48% 52% 46% 54%/62% 58% 42% 38%;background:#34281F;box-shadow:inset 0 -16px 0 #2B2119;color:var(--cream);display:flex;flex-direction:column;align-items:center;text-align:center;gap:6px;overflow:hidden;text-decoration:none;transition:transform .2s ease,border-color .2s ease,background-color .2s ease}
.room a:hover{transform:translateY(-3px) scale(1.02);border-color:var(--amber);background:#4A3426;color:#fff}
.room .ic{width:40px;height:40px;border-radius:999px;background:var(--soil);border:1px solid #5A4838;display:flex;align-items:center;justify-content:center}
.room a:hover .ic{background:var(--amber)}
.room strong{font-size:15px;line-height:1.2}
.room small{font-size:12px;color:var(--muted-dark)}
.room .resting{position:absolute;bottom:14px;left:0;right:0;display:flex;justify-content:center;gap:6px;color:#8C735C}
.room a:hover .resting{color:var(--amber)}

/* ant cards */
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:20px;list-style:none;margin:0;padding:0}
.card{position:relative;border:1px solid var(--line);border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:14px;background:var(--card);transition:transform .2s ease,box-shadow .2s ease;height:100%}
.card-top{display:flex;justify-content:space-between;align-items:center;gap:8px}
.cat-badge{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:var(--cta-dark)}
.cat-badge .ic{width:34px;height:34px;border-radius:999px;background:#FCE7D6;display:flex;align-items:center;justify-content:center;color:var(--cta)}
.type{font-size:12px;font-weight:600;padding:4px 10px;border-radius:999px;background:var(--sand-2);color:var(--muted)}
.card h3{font-size:21px;letter-spacing:-.01em}
.card h3 a{color:var(--ink);text-decoration:none}
.card h3 a::after{content:"";position:absolute;inset:0;border-radius:24px}
.card p{font-size:14px;color:var(--muted)}
.brings{font-size:13px;color:#3D332B;background:#F7F0E6;border-radius:12px;padding:10px 12px}
.card-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:flex-end;gap:10px;border-top:1px solid #F0E6D8;padding-top:14px}
.fast{display:flex;flex-direction:column;gap:2px}
.fast strong{font-size:14px;color:var(--cta)}
.fast span{font-size:12px;color:var(--muted)}
.price{font-size:15px;color:var(--muted);text-align:right}
.price b{font-family:var(--display);font-size:24px;color:var(--ink)}

.antrepreneur{font-size:12px;font-weight:700;color:#1F6B3A}

/* spotlight */
.spot{background:var(--leaf);color:#F1F7EF;border-radius:32px;padding:44px;display:flex;flex-wrap:wrap;gap:36px;align-items:center}
.spot-text{flex:1 1 380px;display:flex;flex-direction:column;gap:16px}
.spot h2{font-size:clamp(32px,4vw,44px)}
.spot p{color:var(--leaf-text);font-size:17px}
.spot-photo{flex:1 1 320px;display:flex;justify-content:center}
.spot-photo img{width:100%;max-width:440px;aspect-ratio:1/1;object-fit:cover;border-radius:28px;box-shadow:0 24px 48px rgba(0,0,0,.35);transition:transform .5s ease}
.spot-photo img:hover{transform:scale(1.02) rotate(-.5deg)}
.tag{align-self:flex-start;font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;padding:5px 12px;border-radius:999px;background:var(--amber);color:var(--ink)}

/* steps */
.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.steps li{background:var(--card);border:1px solid var(--line);border-radius:24px;padding:26px;display:flex;flex-direction:column;gap:10px}
.steps b{font-family:var(--display);font-weight:800;font-size:40px;line-height:1;color:var(--amber)}
.steps h3{font-size:19px;font-family:var(--body);letter-spacing:0}
.steps p{font-size:15px;color:var(--muted)}
.trail{display:block;width:100%;height:40px;margin-bottom:12px}

/* trust */
.trust-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:28px}
.trust-grid div{border-top:2px solid var(--amber);padding-top:18px;display:flex;flex-direction:column;gap:8px}
.trust-grid strong{font-family:var(--display);font-size:21px}
.trust-grid span{font-size:15px;color:var(--muted-dark)}

/* FAQ */
.faq{display:flex;flex-direction:column;gap:12px;max-width:880px}
.faq details{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:0 22px}
.faq summary{cursor:pointer;list-style:none;padding:20px 0;font-weight:700;font-size:17px;display:flex;justify-content:space-between;gap:16px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";font-family:var(--display);font-size:24px;line-height:1;color:var(--cta)}
.faq details[open] summary::after{content:"–"}
.faq details p{padding:0 0 20px;color:var(--muted)}

/* page hero (inner pages) */
.page-hero{padding:56px 0 40px}
.page-hero .wrap{display:flex;flex-wrap:wrap;gap:32px;align-items:center}
.page-hero h1{font-size:clamp(38px,5vw,60px)}
.crumbs{font-size:14px;color:var(--muted);display:flex;gap:8px;flex-wrap:wrap;list-style:none;margin:0;padding:0}
.crumbs li+li::before{content:"/";margin-right:8px}
.crumbs a{color:var(--muted)}
.chips{display:flex;gap:8px;flex-wrap:wrap}
.chips span{font-size:12px;font-weight:600;padding:5px 12px;border-radius:999px;background:var(--sand-2);color:var(--muted)}
.chips span.hot{background:#FCE7D6;color:var(--cta-dark);font-weight:700}
.portrait{flex:1 1 260px;display:flex;justify-content:center}
.portrait div{position:relative;width:240px;height:240px;border-radius:999px;display:flex;align-items:center;justify-content:center;overflow:hidden}
.two-col{display:flex;flex-wrap:wrap;gap:28px;align-items:flex-start}
.two-col>.main{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:24px}
.two-col>aside{flex:1 1 340px;min-width:0}
.panel{background:var(--card);border:1px solid var(--line);border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:14px}
.panel h2{font-size:26px}
.ticks{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.ticks li{display:flex;gap:10px;align-items:flex-start}
.ticks li::before{content:"✓";flex:none;width:22px;height:22px;border-radius:999px;background:var(--amber);color:var(--ink);font-weight:800;font-size:12px;display:flex;align-items:center;justify-content:center;margin-top:1px}
.rings{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.rings li{display:flex;gap:10px}
.rings li::before{content:"";flex:none;width:18px;height:18px;border-radius:999px;border:2px solid var(--cta);margin-top:3px}
.summary{border-radius:28px;padding:28px;display:flex;flex-direction:column;gap:16px;box-shadow:0 24px 48px rgba(28,22,18,.22);position:sticky;top:92px}
.summary .big{font-family:var(--display);font-size:52px;font-weight:800;letter-spacing:-.03em;color:var(--amber);line-height:1}
.summary .row{display:flex;justify-content:space-between;gap:12px;font-size:14px;border-top:1px solid var(--soil-3);padding-top:12px}
.summary .row span:first-child{color:var(--muted-dark)}

/* forms */
.form{display:flex;flex-direction:column;gap:14px}
.form label{font-size:14px;font-weight:600}
.form input,.form textarea,.form select{width:100%;font:inherit;font-size:15px;padding:13px 16px;border:1px solid #D9C7B0;border-radius:14px;background:var(--sand);color:var(--ink)}
.form .field{display:flex;flex-direction:column;gap:6px}
.form .hp{position:absolute;left:-9999px}
.form .small{font-size:12px;color:var(--muted)}
.dark-form label{color:var(--cream)}
.dark-form .small{color:var(--muted-dark)}
.dark-form input,.dark-form textarea,.dark-form select{background:var(--soil-2);border-color:var(--line-dark);color:#fff}
.dark-form input::placeholder,.dark-form textarea::placeholder{color:#9C8B7A}
.cta-band{background:var(--amber);border-radius:32px;padding:48px 44px;display:flex;flex-wrap:wrap;gap:32px;align-items:flex-start}
.cta-band h2{font-size:clamp(34px,4.4vw,48px);color:var(--ink)}
.cta-band p{color:#3D2A12}
.cta-band .form{flex:1 1 360px;background:var(--card);border-radius:24px;padding:24px}
.cta-band>div:first-child{flex:1 1 320px;display:flex;flex-direction:column;gap:12px}

/* prose pages */
.prose{max-width:780px;display:flex;flex-direction:column;gap:16px}
.prose h2{font-size:28px;margin-top:20px}
.prose p,.prose li{color:#3D332B}

/* footer */
.site-footer{background:var(--soil);color:var(--muted-dark);font-size:14px}
.site-footer .wrap{padding-top:48px;padding-bottom:48px;display:flex;flex-wrap:wrap;justify-content:space-between;gap:28px}
.site-footer nav{display:flex;flex-direction:column;gap:8px}
.site-footer strong{color:var(--cream)}
.site-footer a{color:var(--muted-dark);text-decoration:none}.site-footer a:hover{color:#fff}
.copy{border-top:1px solid #2E251E;padding:18px 24px;text-align:center;font-size:13px;color:#8C7B6B}

/* ants: realistic tripod gait */
.ant{display:inline-block;vertical-align:middle}
.gait .l{transform-box:view-box;animation:swing .3s ease-in-out infinite}
.gait .lr{transform-box:view-box;animation:swingr .3s ease-in-out infinite}
.gait .b{animation-delay:-.15s}
.gait .bd{transform-box:view-box;transform-origin:34px 22px;animation:sway .3s ease-in-out infinite}
.ant .an{transform-box:view-box;animation:feel 1.1s ease-in-out infinite}
.ant .an2{transform-box:view-box;animation:feel 1.1s ease-in-out infinite reverse}
.march{position:absolute;animation:march linear infinite}
.bob{animation:bob .45s ease-in-out infinite alternate}

@keyframes swing{0%,100%{transform:rotate(16deg)}50%{transform:rotate(-16deg)}}
@keyframes swingr{0%,100%{transform:rotate(-16deg)}50%{transform:rotate(16deg)}}
@keyframes feel{0%,100%{transform:rotate(-8deg)}50%{transform:rotate(9deg)}}
@keyframes sway{0%,100%{transform:rotate(-1.6deg)}50%{transform:rotate(1.6deg)}}
@keyframes march{from{left:-10%}to{left:106%}}
@keyframes bob{from{transform:translateY(-1.5px)}to{transform:translateY(1.5px)}}
@keyframes kb{from{transform:scale(1.04) translateX(0)}to{transform:scale(1.12) translateX(-2.5%)}}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(242,169,59,.55)}50%{box-shadow:0 0 0 10px rgba(242,169,59,0)}}
@keyframes blink{50%{opacity:0}}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes dash{to{stroke-dashoffset:-28}}
.dash{stroke-dasharray:6 8;animation:dash 1.2s linear infinite}

@media (max-width:720px){
  .nav{gap:14px}.nav a.hide-sm{display:none}
  .hero .wrap{padding-top:64px;padding-bottom:220px}
  .race,.spot,.cta-band{padding:28px}
  .summary{position:static}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important}
  .march{display:none}
}
/* fixes */
.panel.dots{background-color:var(--soil);color:var(--cream)}
.panel.dots h2{color:var(--cream)}
.tile b{font-size:clamp(38px,3.6vw,54px)}
.tiles.three{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){.tiles.three{grid-template-columns:1fr 1fr}}
@media(max-width:560px){.tiles.three{grid-template-columns:1fr}}
