/* ===== Krusty Quinn — one system, applied everywhere =====
   Spacing scale: 8 / 16 / 24 / 40 / 64 / 128
   Type scale: display / h2 / h3 / body / label                */
:root{
  --ivory:#f4efe6;--paper:#faf7f1;--line:rgba(29,24,20,.14);
  --terra:#a9471f;--terra-2:#8c3a18;--ink:#1d1814;--ink-2:#3b3029;--muted:#857767;
  --s1:8px;--s2:16px;--s3:24px;--s4:40px;--s5:64px;--s6:128px;
  --margin:80px;--max:1280px
}
*,*::before,*::after{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--ivory);color:var(--ink);font-family:'Cormorant Garamond',Georgia,serif;font-size:19px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;width:100%;height:100%;object-fit:cover}
a{color:inherit}

/* type */
.display{font-size:clamp(56px,6.4vw,96px);font-weight:300;line-height:.95;letter-spacing:-.015em}
.display em{font-style:italic;color:var(--terra)}
h2{font-size:clamp(36px,3.6vw,52px);font-weight:300;line-height:1.08;letter-spacing:-.01em}
h3{font-size:28px;font-weight:400;line-height:1.2}
p{color:var(--ink-2);max-width:44ch}
.label{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--terra);display:block;margin-bottom:var(--s2)}
.num{font-family:'Josefin Sans',sans-serif;font-weight:400;font-size:14px;color:var(--terra);display:block;margin-bottom:var(--s2)}
.stack>*+*{margin-top:var(--s3)}
.stack .label+*{margin-top:0}

/* buttons */
.btn{display:inline-block;font-family:'Josefin Sans',sans-serif;font-weight:300;font-size:13px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;padding:18px 36px;background:var(--ink);color:var(--paper);border:1px solid var(--ink);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.btn:hover{background:var(--terra);border-color:var(--terra)}
.btn.line{background:transparent;color:var(--ink)}
.btn.line:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.link{font-family:'Josefin Sans',sans-serif;font-weight:300;font-size:13px;letter-spacing:.18em;text-transform:uppercase;text-decoration:none;border-bottom:1px solid var(--terra);padding-bottom:4px}
.link:hover{color:var(--terra)}
.acts{display:flex;gap:var(--s2);flex-wrap:wrap;align-items:center}

/* layout */
.wrap{max-width:var(--max);margin:0 auto;padding:0 var(--margin)}
.sec{padding:var(--s6) 0}
.rule{border-top:1px solid var(--line)}
.center{text-align:center}.center p{margin-left:auto;margin-right:auto}
.head{max-width:720px;margin-bottom:var(--s5)}
.center .head{margin-left:auto;margin-right:auto}

/* pattern A: split */
.split{display:grid;grid-template-columns:1fr 1fr;min-height:640px}
.split .txt{display:flex;flex-direction:column;justify-content:center;padding:var(--s6) var(--margin)}
.split .pic{min-height:560px}
.split.hero{min-height:calc(100vh - 74px);margin-top:74px}
.split.flip .pic{order:-1}

/* pattern B: columns */
.cols{display:grid;gap:var(--s5)}
.cols.c3{grid-template-columns:repeat(3,1fr)}
.cols.c4{grid-template-columns:repeat(4,1fr);gap:var(--s4)}
.cols>div{border-top:1px solid var(--ink);padding-top:var(--s3)}
.cols h3{margin-bottom:var(--s1)}
.cols p{font-size:18px}
.cols .link{display:inline-block;margin-top:var(--s3)}

/* pattern C: photo band */
.band{position:relative;height:88vh;min-height:520px}
.band img{position:absolute;inset:0;filter:brightness(.62)}
.band .over{position:absolute;left:0;right:0;bottom:var(--s5)}
.band .over *{color:var(--paper)}
.band .over .label{color:#e8a27e}
.band .over p{color:rgba(250,247,241,.85);font-size:22px;margin-top:var(--s2)}

/* pattern D: closing CTA */
.cta{background:var(--ink);padding:var(--s6) 0;text-align:center}
.cta h2{color:var(--paper)}
.cta p{color:rgba(250,247,241,.7);margin:var(--s3) auto var(--s4)}
.cta .acts{justify-content:center}
.cta .btn{background:var(--terra);border-color:var(--terra)}
.cta .btn:hover{background:var(--terra-2);border-color:var(--terra-2)}
.cta .btn.line{background:transparent;color:var(--paper);border-color:rgba(250,247,241,.45)}
.cta .btn.line:hover{background:var(--paper);color:var(--ink)}

/* dough label + instruction card */
.spec{border:1px solid var(--ink);padding:var(--s3);background:var(--paper);max-width:440px}
.spec dl{display:grid;grid-template-columns:120px 1fr}
.spec dt,.spec dd{padding:12px 0;border-bottom:1px solid var(--line);font-size:18px}
.spec dt{font-family:'Josefin Sans',sans-serif;font-size:11px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);padding-top:16px}
.spec dl>*:nth-last-child(-n+2){border-bottom:0}

/* forms */
.signup{max-width:560px;margin:0 auto}
.signup form{display:flex}
.signup input{flex:1;min-width:0;font-family:'Cormorant Garamond',serif;font-size:20px;padding:16px 20px;border:1px solid var(--ink);border-right:0;background:var(--paper);outline:none;color:var(--ink)}
.signup input::placeholder{color:var(--muted)}
.note{font-size:16px;color:var(--muted);margin-top:var(--s2)}
.form-success{display:none;font-size:22px}
.form-error{display:none;color:var(--terra);margin-top:var(--s2)}
.fields{display:grid;grid-template-columns:1fr 1fr;gap:var(--s3)}
.f{display:flex;flex-direction:column;gap:var(--s1)}
.f.full{grid-column:1/-1}
.f label{font-family:'Josefin Sans',sans-serif;font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.f input,.f select,.f textarea{font-family:'Cormorant Garamond',serif;font-size:20px;padding:12px 14px;background:var(--paper);border:1px solid #d8cfc0;color:var(--ink);outline:none;border-radius:0;-webkit-appearance:none;appearance:none}
.f input:focus,.f select:focus,.f textarea:focus{border-color:var(--terra)}
.f textarea{min-height:140px;resize:vertical}

/* faq */
.faq-grid{display:grid;grid-template-columns:1fr 2fr;gap:var(--s5)}
details{border-top:1px solid var(--line);padding:var(--s3) 0}
details:last-child{border-bottom:1px solid var(--line)}
summary{font-size:22px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:var(--s3)}
summary::-webkit-details-marker{display:none}
summary::after{content:'+';color:var(--terra)}
details[open] summary::after{content:'–'}
details p{margin-top:var(--s1)}

/* nav */
nav{position:fixed;top:0;left:0;right:0;z-index:500;height:74px;background:rgba(244,239,230,.95);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
nav .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;max-width:none}
.brand{display:flex;align-items:center;gap:12px;text-decoration:none}
.brand img{width:30px;height:30px}
.brand span{font-size:18px;letter-spacing:.24em;text-transform:uppercase}
.nav-links{display:flex;align-items:center;gap:var(--s4);list-style:none}
.nav-links a{font-family:'Josefin Sans',sans-serif;font-weight:300;font-size:13px;letter-spacing:.16em;text-transform:uppercase;text-decoration:none}
.nav-links a:hover,.nav-links a.on{color:var(--terra)}
.nav-links .btn{padding:12px 22px;color:var(--paper)}
.nav-links .btn:hover{color:var(--paper)}
.ig-i svg{width:19px;height:19px;display:block}
.burger{display:none;background:none;border:0;padding:8px;cursor:pointer}
.burger span{display:block;width:24px;height:1px;background:var(--ink);margin:6px 0}

/* footer */
footer{background:var(--ink);color:var(--paper);padding:var(--s5) 0 var(--s4);border-top:1px solid rgba(250,247,241,.08)}
.foot{display:grid;grid-template-columns:2fr 1fr 1fr;gap:var(--s5);padding-bottom:var(--s5);border-bottom:1px solid rgba(250,247,241,.12)}
.foot p{color:rgba(250,247,241,.55);margin-top:var(--s2);max-width:30ch}
.foot ul{list-style:none}
.foot li+li{margin-top:var(--s1)}
.foot a{text-decoration:none;color:rgba(250,247,241,.7)}
.foot a:hover{color:var(--paper)}
.foot .label{color:#e8a27e}
.fine{display:flex;justify-content:space-between;padding-top:var(--s3);font-family:'Josefin Sans',sans-serif;font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(250,247,241,.4)}

@media(max-width:960px){
  :root{--margin:24px;--s5:40px;--s6:80px}
  nav{height:66px}.brand span{font-size:15px}
  .burger{display:block}
  .nav-links{position:fixed;top:66px;left:0;right:0;flex-direction:column;align-items:stretch;gap:0;background:var(--ivory);border-bottom:1px solid var(--line);padding:var(--s1) var(--margin) var(--s3);display:none}
  .nav-links.open{display:flex}
  .nav-links a{display:block;padding:14px 0;font-size:15px}
  .nav-links .btn{text-align:center;margin-top:var(--s1)}
  .split,.split.hero{grid-template-columns:1fr;min-height:0}
  .split.hero{margin-top:66px}
  .split .pic{min-height:0;aspect-ratio:4/3}
  .split .txt{padding:var(--s6) var(--margin)}
  .split .pic{order:-1}
  .cols.c3,.cols.c4,.faq-grid,.foot{grid-template-columns:1fr}
  .cols.c4{gap:var(--s4)}
  .fields{grid-template-columns:1fr}
  .band{height:70vh}
  .signup form{flex-direction:column}
  .signup input{border-right:1px solid var(--ink)}
  .fine{flex-direction:column;gap:var(--s1)}
}