:root{
  --ink:#181614;--paper:#EFE3C8;--paper-2:#E6D6B0;
  --red:#D62839;--orange:#F0932B;--teal:#1E7D75;--blue:#274690;--white:#FAF6EC;
}
*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:radial-gradient(circle, rgba(24,22,20,0.09) 1px, transparent 1.3px) 0 0/16px 16px, var(--paper);
  color:var(--ink);
  font-family:'Space Grotesk', sans-serif;
  overflow-x:hidden;
}
@media (prefers-reduced-motion: reduce){*{animation:none !important; transition:none !important;}}
a{color:inherit;}
.wrap{max-width:1100px; margin:0 auto; padding:0 24px;}
.wrap.narrow{max-width:820px;}

/* panels */
.panel{background:var(--white); border:3.5px solid var(--ink); box-shadow:8px 8px 0 var(--ink); position:relative;}
.panel-tag{
  position:absolute; top:-16px; left:22px; background:var(--ink); color:var(--paper);
  font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.12em;
  padding:5px 10px; transform:rotate(-2deg);
}
.eyebrow-mono{
  font-family:'JetBrains Mono', monospace; font-size:13px; font-weight:700; color:var(--teal);
  letter-spacing:0.1em; text-transform:uppercase; margin:0 0 14px;
}

/* nav */
header{position:sticky; top:0; z-index:50; background:var(--paper); border-bottom:3.5px solid var(--ink);}
.nav{display:flex; align-items:center; justify-content:space-between; gap:16px; padding:16px 24px; max-width:1100px; margin:0 auto;}
.logo{font-family:'Bangers', cursive; font-size:28px; letter-spacing:0.03em; color:var(--ink); text-decoration:none;}
.logo span{color:var(--red);}
.nav-links{display:flex; gap:22px; font-size:14px; font-weight:600;}
.nav-links a, .nav a.back{text-decoration:none; border-bottom:2px solid transparent; font-size:14px; font-weight:600;}
.nav-links a:hover, .nav a.back:hover{border-color:var(--red);}
.nav-cta{background:var(--ink); color:var(--paper); padding:9px 16px; text-decoration:none; font-weight:700; font-size:14px; border:2px solid var(--ink);}
.nav-cta:hover{background:var(--red); border-color:var(--red); color:var(--white);}
@media (max-width:700px){.nav-links{display:none;}}

/* hero */
.hero{padding:70px 24px 60px;}
.hero-grid{display:grid; grid-template-columns:1.15fr 0.85fr; gap:36px; align-items:stretch;}
@media (max-width:860px){.hero-grid{grid-template-columns:1fr;}}
.hero-panel{padding:44px 40px 40px; transform:rotate(-0.6deg);}
.headline{
  font-family:'Bangers', cursive; font-size:clamp(40px, 6vw, 64px); line-height:0.98;
  margin:0 0 18px; letter-spacing:0.01em; -webkit-text-stroke:1.5px var(--ink); color:var(--paper);
}
.headline em{font-style:normal; color:var(--red); -webkit-text-stroke:1.5px var(--ink);}
.sub{font-size:17px; line-height:1.55; max-width:46ch; margin:0 0 26px; color:#2a2a28;}
.cta-row{display:flex; gap:14px; flex-wrap:wrap;}
.btn{display:inline-block; padding:13px 22px; font-weight:700; font-size:15px; text-decoration:none; border:3px solid var(--ink); transition:transform .12s ease, box-shadow .12s ease;}
.btn-primary{background:var(--red); color:var(--white); box-shadow:5px 5px 0 var(--ink);}
.btn-ghost{background:transparent; color:var(--ink); box-shadow:5px 5px 0 var(--ink);}
.btn-primary:hover,.btn-ghost:hover{transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--ink);}

.burst-wrap{position:relative; display:flex; align-items:center; justify-content:center;}
.burst{width:100%; max-width:300px; aspect-ratio:1; animation:spin 26s linear infinite;}
@keyframes spin{to{transform:rotate(360deg);}}
.burst-center{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; font-family:'Bangers', cursive; color:var(--white);}
.burst-center .big{font-size:30px; line-height:1;}
.burst-center .small{font-family:'JetBrains Mono',monospace; font-size:12px; letter-spacing:0.08em; margin-top:6px;}

/* origin */
.origin{padding:20px 24px 70px;}
.origin-panel{padding:34px 36px; font-family:'JetBrains Mono', monospace; font-size:14.5px; line-height:1.8; transform:rotate(0.4deg); background:var(--paper-2);}
.origin-panel strong{color:var(--red);}
.origin-panel .caret{color:var(--teal);}

/* sections */
.brands,.method,.audience{padding:10px 24px 80px;}
.section-head{text-align:center; margin-bottom:40px;}
.section-head h2{font-family:'Bangers', cursive; font-size:38px; margin:6px 0 0; letter-spacing:0.02em;}
.brand-grid{display:grid; grid-template-columns:1fr 1fr; gap:32px;}
@media (max-width:800px){.brand-grid{grid-template-columns:1fr;}}
.brand-panel{padding:32px 30px 30px;}
.brand-panel.tsf{transform:rotate(-0.7deg);}
.brand-panel.hlx{transform:rotate(0.7deg);}
.brand-title{font-family:'Bangers', cursive; font-size:30px; margin:10px 0 12px;}
.tsf-c{color:var(--blue);} .hlx-c{color:var(--red);}
.brand-panel p{font-size:15px; line-height:1.6; margin:0 0 14px;}
.tag-row{display:flex; gap:8px; flex-wrap:wrap; margin-top:16px;}
.pill{font-family:'JetBrains Mono', monospace; font-size:12px; font-weight:700; border:2px solid var(--ink); padding:4px 10px; background:var(--paper);}

.method-strip{display:grid; grid-template-columns:1fr auto 1fr; align-items:stretch;}
@media (max-width:760px){.method-strip{grid-template-columns:1fr;}}
.method-panel{padding:30px 26px; text-align:center;}
.method-panel.break{transform:rotate(-1deg); background:#F6DCC9;}
.method-panel.fix{transform:rotate(1deg); background:#D8ECE7;}
.method-num{font-family:'Bangers', cursive; font-size:15px; background:var(--orange); display:inline-block; padding:2px 10px; margin-bottom:14px; border:2px solid var(--ink);}
.method-panel.fix .method-num{background:var(--teal); color:var(--white);}
.method-title{font-family:'Bangers', cursive; font-size:26px; margin:0 0 10px;}
.method-panel p{font-size:14.5px; line-height:1.55; margin:0;}
.arrow-mid{display:flex; align-items:center; justify-content:center; padding:0 14px; font-family:'Bangers', cursive; font-size:34px; color:var(--red);}
@media (max-width:760px){.arrow-mid{transform:rotate(90deg); padding:6px 0;}}

.aud-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:760px){.aud-grid{grid-template-columns:1fr;}}
.aud-panel{padding:24px 22px;}
.aud-panel:nth-child(1){transform:rotate(-0.5deg);} .aud-panel:nth-child(2){transform:rotate(0.5deg);} .aud-panel:nth-child(3){transform:rotate(-0.4deg);}
.aud-panel h3{font-family:'Bangers', cursive; font-size:22px; margin:6px 0 8px; color:var(--blue);}
.aud-panel p{font-size:14px; line-height:1.55; margin:0;}

/* contact / final */
.final{padding:10px 24px 90px;}
.final-panel{padding:52px 40px; text-align:center; background:var(--ink); color:var(--paper); border:3.5px solid var(--ink); box-shadow:8px 8px 0 var(--red);}
.final-panel .eyebrow-mono{color:var(--orange);}
.final-panel h2{font-family:'Bangers', cursive; font-size:clamp(30px,5vw,46px); margin:8px 0 16px; color:var(--white);}
.final-panel p{font-size:15.5px; max-width:52ch; margin:0 auto 26px; opacity:0.92;}
.final .cta-row{justify-content:center;}
.final .btn-ghost{color:var(--paper); box-shadow:5px 5px 0 var(--paper);}

/* forms */
.form-box{display:grid; gap:16px;}
.form-row{display:grid; gap:16px; grid-template-columns:1fr 1fr;}
@media (max-width:600px){.form-row{grid-template-columns:1fr;}}
label{display:block; font-family:'JetBrains Mono', monospace; font-size:12px; letter-spacing:0.06em; text-transform:uppercase; color:var(--orange); margin-bottom:6px;}
input, textarea, select{width:100%; padding:11px 12px; font-family:'Space Grotesk', sans-serif; font-size:14.5px; border:3px solid var(--paper); background:var(--white); color:var(--ink);}
.apply input,.apply textarea,.apply select{background:var(--paper);}
input:focus, textarea:focus, select:focus{outline:3px solid var(--red); outline-offset:1px;}
textarea{min-height:100px; resize:vertical;}
.contact-form{margin:26px auto 0; text-align:left; max-width:480px;}
.file-hint{font-family:'JetBrains Mono', monospace; font-size:11.5px; opacity:0.65; margin-top:6px;}
.hp{position:absolute; left:-9999px; height:0; width:0; overflow:hidden;}
button.submit{justify-self:start; margin-top:4px; background:var(--red); color:var(--white); border:3px solid var(--ink); box-shadow:5px 5px 0 var(--ink); font-weight:700; font-size:15px; padding:13px 26px; cursor:pointer; transition:transform .12s ease, box-shadow .12s ease; font-family:inherit;}
button.submit:hover{transform:translate(-2px,-2px); box-shadow:7px 7px 0 var(--ink);}
.contact-form button.submit{justify-self:center; border-color:var(--paper); box-shadow:5px 5px 0 var(--paper);}
.contact-form button.submit:hover{box-shadow:7px 7px 0 var(--paper);}

/* inner pages */
.page-hero{padding:60px 24px 30px;}
.page-hero .panel{padding:40px 38px; transform:rotate(-0.5deg);}
.page-hero h1{font-family:'Bangers', cursive; font-size:clamp(34px,6vw,52px); line-height:1; margin:0 0 14px; -webkit-text-stroke:1.5px var(--ink); color:var(--paper);}
.page-hero h1 em{font-style:normal; color:var(--red);}
.page-hero p.sub{max-width:60ch; margin:0;}
.updated{font-family:'JetBrains Mono', monospace; font-size:12.5px; opacity:0.7; margin:0;}
.roles{padding:10px 24px 40px;}
.roles .panel{padding:30px 34px; transform:rotate(0.4deg); background:var(--paper-2);}
.roles h2{font-family:'Bangers', cursive; font-size:26px; margin:6px 0 14px;}
.roles ul{margin:0; padding-left:20px; line-height:1.8; font-size:15px;}
.apply{padding:10px 24px 90px;}
.apply .panel{padding:36px 38px; transform:rotate(-0.3deg);}
.apply h2{font-family:'Bangers', cursive; font-size:28px; margin:6px 0 6px;}
.apply .lead{font-size:14.5px; margin:0 0 24px; opacity:0.85;}

.legal{padding:20px 24px 90px;}
.legal .panel{padding:40px 42px 44px;}
.legal h2{font-weight:700; font-size:19px; margin:32px 0 10px; color:var(--blue); border-bottom:2px solid var(--paper-2); padding-bottom:6px;}
.legal h2:first-of-type{margin-top:0;}
.legal p,.legal li{font-size:14.5px; line-height:1.7; margin:0 0 12px;}
.legal ul{padding-left:22px; margin:0 0 12px;}
.legal strong{color:var(--red);}
.legal a{color:var(--blue);}
@media (max-width:600px){.legal .panel,.apply .panel,.page-hero .panel{padding:28px 22px;}}

footer{padding:22px 24px 40px; text-align:center; font-family:'JetBrains Mono', monospace; font-size:12.5px; color:#5c564a;}
footer a{text-decoration:underline;}
a:focus-visible,button:focus-visible{outline:3px solid var(--red); outline-offset:2px;}