/* cogfight.css — the "junkyard scrap-rooster" app skin */
:root{
  --pit:#14110d; --pit2:#1b1712; --plate:#26211b; --plate2:#2f2921;
  --edge:#3a3129; --edge2:#4a3f33;
  --ember:#ff7a29; --ember-soft:#ffb066; --brass:#caa04a;
  --verd:#4fb7a4; --comb:#e8452c;
  --bone:#f0e8da; --ash:#a99e8c; --ash2:#9a9082;
  --disp:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,"SF Mono","Menlo","Consolas",monospace;
  --body:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --maxw:1120px;
}
body{background:var(--pit);color:var(--bone);font-family:var(--body);line-height:1.6;
  -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(1200px 600px at 78% -8%,rgba(255,122,41,.10),transparent 60%),
    radial-gradient(900px 500px at 0% 12%,rgba(79,183,164,.06),transparent 55%);}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 22px;}
h1,h2,h3{margin:0;font-family:var(--disp);font-weight:900;letter-spacing:-.01em;
  text-transform:uppercase;text-wrap:balance;line-height:.98;}
:focus-visible{outline:2px solid var(--ember);outline-offset:3px;}
.mono{font-family:var(--mono);}
.lede{font-size:clamp(16px,2vw,18.5px);}

/* subtle grit overlay */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:1;opacity:.05;mix-blend-mode:overlay;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='140' height='140'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.8' numOctaves='2'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");}

/* nav */
header.cf-nav{position:sticky;top:0;z-index:30;
  background:linear-gradient(180deg,rgba(20,17,13,.94),rgba(20,17,13,.72));
  border-top:3px solid var(--comb);border-bottom:1px solid var(--edge);
  -webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  box-shadow:0 2px 14px rgba(232,69,44,.18);}
.cf-nav .wrap{display:flex;align-items:center;justify-content:space-between;height:64px;}
.cf-word{font-family:var(--disp);font-weight:900;font-size:22px;letter-spacing:.02em;text-transform:uppercase;
  text-decoration:none;color:var(--bone);display:inline-flex;align-items:center;gap:9px;}
.cf-word-sm{font-size:18px;}
.cf-word .spark{width:11px;height:11px;background:var(--ember);border-radius:2px;transform:rotate(45deg);
  box-shadow:0 0 12px var(--ember);}
.cf-nav .right{display:flex;align-items:center;gap:20px;}
.cf-nav .sub{font-family:var(--mono);font-size:12px;color:var(--ash2);letter-spacing:.02em;}
@media(max-width:600px){.cf-nav .sub{display:none;}}
.cf-btn{font-family:var(--disp);font-weight:800;text-transform:uppercase;letter-spacing:.04em;font-size:14px;
  text-decoration:none;padding:10px 18px;border-radius:7px;cursor:pointer;border:0;display:inline-block;
  transition:transform .14s ease,box-shadow .14s ease,filter .14s ease;}
.cf-btn.solid{background:linear-gradient(180deg,#ff8a3d,#ef6a17);color:#1a0f06;
  box-shadow:0 6px 18px rgba(255,122,41,.34),inset 0 1px 0 rgba(255,255,255,.35);}
.cf-btn.solid:hover{transform:translateY(-2px);filter:brightness(1.06);}
.cf-btn.ghost{background:rgba(255,255,255,.04);color:var(--bone);border:1px solid var(--edge2);}
.cf-btn.ghost:hover{border-color:var(--ember);transform:translateY(-2px);}

/* hero */
.cf-hero{position:relative;overflow:hidden;padding:56px 0 40px;}
.cf-hero .wrap{position:relative;z-index:3;display:grid;grid-template-columns:1.05fr .95fr;gap:24px;align-items:center;}
@media(max-width:840px){.cf-hero .wrap{grid-template-columns:1fr;text-align:left;}}
.cf-eyebrow{font-family:var(--mono);font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--verd);margin-bottom:20px;display:flex;align-items:center;gap:10px;}
.cf-eyebrow::before{content:"";width:26px;height:1px;background:var(--verd);}
.cf-hero h1{font-size:clamp(44px,8.4vw,86px);}
.cf-hero h1 .a{color:var(--ember);}.cf-hero h1 .b{color:var(--comb);text-shadow:0 0 26px rgba(232,69,44,.35);}
.cf-hero .lede{color:var(--ash);font-size:clamp(16px,2vw,18.5px);max-width:46ch;margin:22px 0 24px;}
.rating{display:inline-flex;align-items:center;gap:9px;font-family:var(--mono);font-size:12px;
  color:var(--ash);border:1px solid var(--edge2);border-radius:100px;padding:6px 13px;margin-bottom:26px;}
.rating b{background:var(--comb);color:#1a0f06;font-family:var(--disp);font-weight:900;font-size:12px;
  padding:2px 7px;border-radius:4px;letter-spacing:.02em;}
.waitlist{display:flex;gap:9px;flex-wrap:wrap;max-width:440px;}
.waitlist label{position:absolute;left:-9999px;}
.waitlist input{flex:1;min-width:190px;background:#0e0b08;border:1px solid var(--edge2);color:var(--bone);
  font-family:var(--body);font-size:15px;padding:12px 15px;border-radius:8px;}
.waitlist input::placeholder{color:var(--ash2);}
.waitlist input:focus{outline:none;border-color:var(--ember);box-shadow:0 0 0 3px rgba(255,122,41,.18);}
.note{font-family:var(--mono);font-size:12px;color:var(--ash2);margin-top:16px;max-width:44ch;line-height:1.5;}

/* hero art */
.cf-art{position:relative;display:grid;place-items:center;min-height:420px;}
.cf-art .glow{position:absolute;width:78%;aspect-ratio:1;border-radius:50%;bottom:6%;
  background:
    radial-gradient(circle,rgba(232,69,44,.42),transparent 40%),
    radial-gradient(circle,rgba(255,122,41,.40),rgba(255,122,41,.06)56%,transparent 72%);
  filter:blur(6px);z-index:1;}
.cf-art canvas{position:absolute;inset:0;z-index:2;width:100%;height:100%;}
.cf-art img{position:relative;z-index:3;max-width:100%;max-height:560px;width:auto;
  filter:drop-shadow(0 30px 40px rgba(0,0,0,.65)) drop-shadow(0 0 30px rgba(255,122,41,.18));}
.cf-art .pedestal{position:absolute;bottom:2%;width:64%;height:26px;z-index:2;border-radius:50%;
  background:radial-gradient(ellipse,rgba(0,0,0,.6),transparent 70%);}

/* the loop */
.band{border-top:1px solid var(--edge);border-bottom:1px solid var(--edge);padding:60px 0;
  background:linear-gradient(180deg,rgba(255,255,255,.015),transparent);}
.kick{font-family:var(--mono);font-size:12.5px;letter-spacing:.18em;text-transform:uppercase;color:var(--ash2);margin-bottom:12px;}
.kick::before{content:"";display:inline-block;width:7px;height:7px;background:var(--comb);
  transform:rotate(45deg);margin-right:10px;vertical-align:middle;box-shadow:0 0 9px rgba(232,69,44,.7);}
.band :is(h1,h2),.section :is(h1,h2){font-size:clamp(26px,4.4vw,40px);}
.loop{display:grid;grid-template-columns:repeat(5,1fr);gap:14px;margin-top:34px;}
@media(max-width:900px){.loop{grid-template-columns:repeat(2,1fr);}}
@media(max-width:520px){.loop{grid-template-columns:1fr;}}

/* spec plate — the signature riveted steel panel */
.plate{position:relative;background:linear-gradient(160deg,var(--plate2),var(--plate));
  border:1px solid var(--edge2);border-radius:10px;padding:22px 18px;overflow:hidden;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 10px 24px rgba(0,0,0,.35);}
.plate::before,.plate::after{content:"";position:absolute;width:5px;height:5px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#6b5c49,#241d16);box-shadow:0 1px 1px rgba(0,0,0,.6);}
.plate::before{top:8px;left:8px;}.plate::after{top:8px;right:8px;}
.plate .rivet-b{position:absolute;bottom:8px;left:8px;width:5px;height:5px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#6b5c49,#241d16);}
.plate .rivet-c{position:absolute;bottom:8px;right:8px;width:5px;height:5px;border-radius:50%;
  background:radial-gradient(circle at 35% 35%,#6b5c49,#241d16);}
.plate .step{font-family:var(--mono);font-size:12px;color:var(--ember);letter-spacing:.1em;}
.plate :is(h2,h3){font-size:20px;margin:9px 0 8px;color:var(--bone);}
.plate p{margin:0;color:var(--ash);font-size:14px;line-height:1.5;}
.plate a{color:var(--ember);}

/* features */
.section{padding:64px 0;}
.feat{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;margin-top:34px;}
@media(max-width:820px){.feat{grid-template-columns:1fr;}}
.feat .plate :is(h2,h3){color:var(--verd);}
.feat .tagrow{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px;}
.chip{font-family:var(--mono);font-size:11.5px;color:var(--ash);border:1px solid var(--edge2);
  border-radius:5px;padding:4px 9px;}
.chip b{color:var(--brass);font-weight:400;}

/* gallery */
.gal{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:30px;}
@media(max-width:700px){.gal{grid-template-columns:1fr;}}
.frame{border:1px solid var(--edge2);border-radius:12px;overflow:hidden;background:#0d0a07;
  box-shadow:0 14px 30px rgba(0,0,0,.4);}
.frame img{display:block;width:100%;height:auto;}
.frame .cap{font-family:var(--mono);font-size:11.5px;color:var(--ash2);padding:9px 13px;
  border-top:1px solid var(--edge);letter-spacing:.04em;}

/* waitlist band */
.cta-band{margin:20px 0 0;padding:64px 0;text-align:center;position:relative;overflow:hidden;
  background:linear-gradient(180deg,#1f1a14,#140f0a);border-top:1px solid var(--edge);}
.cta-band h2{font-size:clamp(30px,5vw,52px);}
.cta-band h2 .a{color:var(--comb);text-shadow:0 0 30px rgba(232,69,44,.4);}
.cta-band p{color:var(--ash);margin:16px auto 26px;max-width:40ch;}
.cta-band .waitlist{margin:0 auto;justify-content:center;}
.cta-band .kick{text-align:center;}

/* footer */
.cf-foot{padding:44px 0 64px;border-top:1px solid var(--edge);color:var(--ash2);}
.cf-foot .wrap{display:flex;justify-content:space-between;gap:22px;flex-wrap:wrap;align-items:flex-start;}
.cf-foot nav{display:flex;gap:20px;flex-wrap:wrap;}
.cf-foot a{color:var(--ash);text-decoration:none;font-family:var(--mono);font-size:13px;}
.cf-foot nav a{padding:6px 2px;display:inline-block;}
.cf-foot a:hover{color:var(--ember);}
.cf-foot .lore{font-family:var(--mono);font-size:12px;max-width:38ch;line-height:1.6;color:var(--ash2);}

/* shared content helpers for support/privacy pages */
.section .lede{color:var(--ash);max-width:60ch;margin-top:14px;}
.cf-gallery{padding-top:0;}
.cf-contact{margin-top:22px;}
.cf-doc{max-width:44rem;}
.cf-doc :is(h2,h3){margin-top:28px;color:var(--verd);}
.cf-doc p{color:var(--ash);margin:10px 0 0;}
.cf-doc strong{color:var(--bone);}
.cf-updated{color:var(--ash2);margin:6px 0 22px;}