/* Sandy Wind Projects — brand styles.
   Colours and type from the Creative Bible. Cozy rustic homestead:
   warm, textured, layered. Not minimalist, not corporate. */

:root{
  --teal:#2E7D82;      /* Prairie Sky Teal   */
  --purple:#5E2D56;    /* Berry Patch Purple */
  --sage:#7EA185;      /* Sagebrush Green    */
  --gold:#C8822A;      /* Dunn Bull Gold     */
  --sand:#F5EFE6;      /* Oklahoma Sand      */
  --cream:#FDFBF7;     /* Linen Cream        */
  --ink:#2A2018;
  --ink-soft:#6B5B4B;
  --rule:#E0D5C4;
}

*{box-sizing:border-box;}

body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:"Lexend",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:17px;
  line-height:1.6;
  letter-spacing:.02em;
  text-align:left;
  -webkit-font-smoothing:antialiased;
}

/* windswept sand grain — texture, per the brand pillars */
body::before{
  content:"";position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.04;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='180' height='180' filter='url(%23n)'/%3E%3C/svg%3E");
}

.wrap{max-width:820px;margin:0 auto;padding:0 22px;position:relative;z-index:1;}

/* ---------- header ---------- */
header{padding:64px 0 8px;}
.eyebrow{
  font-size:.76rem;letter-spacing:.14em;text-transform:uppercase;
  color:var(--gold);font-weight:600;margin:0 0 18px;
}
h1{
  font-family:"Fraunces",Georgia,serif;font-weight:500;
  font-size:clamp(2.3rem,7vw,3.6rem);line-height:1.05;
  letter-spacing:-.015em;margin:0 0 18px;text-wrap:balance;
}
.tagline{
  font-family:"Fraunces",Georgia,serif;font-size:1.15rem;color:var(--teal);
  margin:0 0 28px;font-style:italic;
}
.lede{font-size:1.1rem;color:var(--ink-soft);max-width:56ch;margin:0 0 14px;}

/* ---------- nav ---------- */
nav{
  display:flex;flex-wrap:wrap;gap:22px;
  padding:20px 0;margin:34px 0 0;
  border-top:1px solid var(--rule);border-bottom:1px solid var(--rule);
}
nav a{
  color:var(--ink);text-decoration:none;font-weight:500;font-size:.95rem;
  border-bottom:2px solid transparent;padding-bottom:3px;
}
nav a:hover,nav a:focus-visible{border-bottom-color:var(--teal);color:var(--teal);}

/* ---------- sections ---------- */
section{padding:48px 0;border-bottom:1px solid var(--rule);}
section:last-of-type{border-bottom:none;}
h2{
  font-family:"Fraunces",Georgia,serif;font-weight:500;font-size:1.9rem;
  line-height:1.15;margin:0 0 10px;text-wrap:balance;
}
h3{
  font-family:"Lexend",sans-serif;font-weight:600;font-size:.8rem;
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);
  margin:32px 0 10px;
}
p{margin:0 0 16px;max-width:64ch;}
a{color:var(--teal);text-underline-offset:3px;}
a:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:2px;}

/* ---------- the DBA cards ---------- */
.dbas{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin:26px 0 0;}
.dba{
  background:var(--sand);border:1px solid var(--rule);border-radius:5px;
  padding:22px 22px 24px;
}
.dba strong{
  font-family:"Fraunces",Georgia,serif;font-size:1.15rem;font-weight:600;
  display:block;margin-bottom:6px;
}
.dba span{font-size:.94rem;color:var(--ink-soft);}
.dba.livestock strong{color:var(--purple);}
.dba.produce strong{color:var(--sage);}
.dba.wind strong{color:var(--teal);}

/* ---------- video embeds ---------- */
.player{
  position:relative;width:100%;aspect-ratio:16/9;
  border:1px solid var(--rule);border-radius:5px;overflow:hidden;
  background:var(--sand);margin:0 0 14px;
}
.player iframe{position:absolute;inset:0;width:100%;height:100%;border:0;}
.note{font-size:.9rem;color:var(--ink-soft);}

/* ---------- coming soon ---------- */
.soon{
  background:var(--sand);border:1px solid var(--rule);
  border-left:4px solid var(--gold);border-radius:5px;
  padding:22px 24px;margin:22px 0 0;
}
.soon strong{font-family:"Fraunces",Georgia,serif;font-size:1.1rem;}

/* ---------- footer ---------- */
footer{
  margin-top:20px;padding:34px 0 70px;
  border-top:1px solid var(--rule);
  font-size:.92rem;color:var(--ink-soft);line-height:1.7;
}
footer .handle{color:var(--teal);font-weight:500;}

@media (max-width:520px){
  body{font-size:16px;}
  header{padding:44px 0 4px;}
  section{padding:36px 0;}
}