/* ===== Licensed font files (replace src: urls with your files) ===== */
@font-face{
  font-family: "SaaSeriesCDOT";
  src: url("SaaSeriesCDOT.otf") format("opentype");
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face{
  font-family: "Quincy CF Medium";
  src: url("QuincyCF-Medium.otf") format("opentype");
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face{
  font-family: "Knockout 32";
  src: url("Knockout-HTF32-JuniorLiteweight.woff") format("woff");
  font-weight: 400; font-style: normal; font-display: swap;
}

/* ===== Brand tokens ===== */
:root{
  --gb-green:#1D3C34;
  --gb-ochre:#C67D30;
  --gb-cream:#E7CEB5;
  --gb-paper:#F8F4EC;
  --gb-white:#ffffff;

  --font-eyebrow:"SaaSeriesCDOT","SAA FDOT","Arial Narrow",Arial,sans-serif;
  --font-heading:"Quincy CF Medium","Quincy Medium",Georgia,serif;
  --font-body:"Knockout 32","Knockout HTF32 Junior","Impact","Arial Black",Arial,sans-serif;
}

/* (keep your @font-face blocks as previously set up) */

/* ===== Base ===== */
*{margin:0;padding:0;box-sizing:border-box}
html,body{height:100%}
body{
  background: var(--gb-cream);   /* <- cream background */
  color: var(--gb-green);
  font-family: var(--font-body);
  letter-spacing: .015em;
}

/* ===== Splash (no photo tint; simple cream card) ===== */
.splash{
  min-height:100vh;
  display:grid;
  place-items:center;
  padding: 40px 16px;
}
.content{
  text-align:center;
  max-width: 720px;
}

/* ===== Images ===== */
.chicken-illustration{
  display:block;
  width:160px; height:auto;
  margin: 0 auto 14px;
}
.footer-mark{
  width:140px; height:auto;
  margin:18px auto 8px;
  opacity:.92;
}

/* ===== Live-type logo ===== */
.brand-name{
  font-family: var(--font-heading);
  font-weight:500;
  letter-spacing:0;
  line-height:1.1;
  font-size: clamp(2.2rem, 5.2vw, 3.6rem);
  color: var(--gb-green);
  margin-bottom:.35rem;
}
.brand-tag{
  font-family: var(--font-eyebrow);
  text-transform: uppercase;
  letter-spacing:.18em;
  font-size: .95rem;
  color: var(--gb-green);
  margin-bottom: 1.2rem;
}

/* dotted flourish */
.divider{
  width:100px; height:1px;
  margin: 0.5rem auto 1.2rem;
  border-bottom: 1px dotted var(--gb-green);
  opacity:.6;
}

/* body copy (optional) */
.body-copy{
  color: var(--gb-green);
  max-width: 48ch;
  margin: 0 auto 18px;
  line-height:1.55;
}

/* ===== Buttons — brand compliant, squared corners ===== */
.nav{
  display:flex; flex-direction:column; align-items:center;
  gap:12px; margin-bottom:22px;
}
.btn{
  font-family: var(--font-body);
  text-transform: uppercase;
  letter-spacing:.04em;
  text-decoration:none;
  color: var(--gb-white);
  background: var(--gb-ochre);
  border: 2px solid var(--gb-ochre);
  padding: 12px 30px;
  border-radius: 0px;                  /* rectangular with subtle radius */
  font-weight: 600;                    /* use 600/700 only if you have that Knockout weight */
  font-size: .95rem;
  display:inline-block;
  transition: all .2s ease;
}
.btn:hover{ background:#A86426; border-color:#A86426 }
.btn:active{ transform: translateY(1px) }

.btn.btn-outline{
  background: transparent;
  color: var(--gb-green);
  border-color: var(--gb-ochre);
}
.btn.btn-outline:hover{
  background: var(--gb-ochre);
  color: var(--gb-white);
}

/* ===== Caption ===== */
.caption{
  font-family: var(--font-body);
  letter-spacing:.015em;
  font-size:.85rem;
  color: var(--gb-green);
  opacity:.9;
}

/* ===== Mobile tweaks ===== */
@media (max-width:600px){
  .chicken-illustration{width:140px}
  .brand-name{font-size: clamp(2rem, 7vw, 3rem)}
  .brand-tag{font-size:.85rem}
  .btn{font-size:.92rem; padding:10px 22px}
}

/* ===== Social Icons Row ===== */
/* ===== Social Icons Row ===== */
.social-row {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 22px;
  margin-top: 18px;
  margin-bottom: 26px;
}

.social-row a {
  color: var(--gb-green);
  font-size: 1.5rem;
  text-decoration: none;
  transition: color 0.25s ease, transform 0.2s ease;
}

.social-row a:hover {
  color: var(--gb-ochre);
  transform: scale(1.1);
}
