/* KitchenStack marketing site — shared styles (v4 redesign)
   Brand: #245042 forest deep · #326F59 forest · #499A79 forest mid ·
          #81C6A7 sage · #E8A020 amber · linen #EDE9E1 · page #F5F4F0 */

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#F5F4F0;color:#4A4A4A;font-family:'DM Sans','Helvetica Neue',Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}
::selection{background:#81C6A7;color:#1A1A1A}
input,textarea,select{font-family:inherit}
img{max-width:100%}

@keyframes ksFade{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
.ks-page{animation:ksFade .5s ease both}

/* ---------- Nav ---------- */
.ks-nav{background:#fff}
.ks-nav-inner{max-width:1200px;margin:0 auto;padding:0 32px;height:68px;display:flex;align-items:center;justify-content:space-between}
.ks-nav-logo{display:flex;align-items:center;text-decoration:none}
.ks-nav-logo img{height:42px;width:auto;display:block}
.ks-navlinks{display:flex;align-items:center;gap:36px}
.nav-link{font-size:15px;font-weight:500;color:#4A4A4A;text-decoration:none;transition:color .15s}
.nav-link:hover{color:#245042}
.nav-link[aria-current="page"]{color:#245042;font-weight:600}
.ks-demobtn{display:none;align-items:center;padding:10px 18px;background:#326F59;color:#fff;border-radius:6px;font-size:14px;font-weight:600;text-decoration:none}

/* ---------- Buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;border-radius:6px;font-weight:600;cursor:pointer;text-decoration:none;transition:background .15s,border-color .15s;border:none}
.btn-green{background:#326F59;color:#fff}
.btn-green:hover{background:#245042}
.btn-amber{background:#E8A020;color:#1A1A1A;border:1.5px solid #E8A020}
.btn-amber:hover{background:#D18E12;border-color:#D18E12}
.btn-forest{background:#245042;color:#fff;border:1.5px solid #245042}
.btn-forest:hover{background:#1C4235;border-color:#1C4235}
.btn-white{background:#fff}
.btn-white:hover{background:#F5F4F0}
.btn-sage{background:#499A79;color:#fff}
.btn-sage:hover{background:#245042}

.ks-link{color:#326F59;font-weight:600;text-decoration:none}
.ks-link:hover{color:#245042}

/* ---------- Cards ---------- */
.ks-card-hover{transition:transform .2s ease,box-shadow .2s ease}
.ks-card-hover:hover{transform:translateY(-4px);box-shadow:0 14px 30px rgba(50,111,89,0.12)}
.ks-blogcard{transition:transform .2s ease,box-shadow .2s ease}
.ks-blogcard:hover{transform:translateY(-6px);box-shadow:0 22px 46px rgba(36,80,66,0.14)}

/* ---------- Forms ---------- */
.ks-input{width:100%;padding:12px 14px;border:1px solid #D6D3CB;border-radius:4px;font-size:15px;color:#1A1A1A;background:#fff;outline:none}
.ks-input:focus{border-color:#499A79;box-shadow:0 0 0 3px rgba(73,154,121,0.18)}
textarea.ks-input{resize:vertical}

/* ---------- Footer ---------- */
.ks-footer{background:#1A1A1A;padding:50px 0 34px}
.ks-foot-link{font-size:15px;color:rgba(255,255,255,0.82);text-decoration:none;transition:color .15s}
.ks-foot-link:hover{color:#81C6A7}
.ks-foot-legal{font-size:13px;color:rgba(255,255,255,0.6);text-decoration:none;transition:color .15s}
.ks-foot-legal:hover{color:#81C6A7}
.ks-foot-social{color:rgba(255,255,255,0.82);display:inline-flex;transition:color .15s}
.ks-foot-social:hover{color:#81C6A7}

/* ---------- Home: problem — old way vs. new way ---------- */
@media (max-width:1100px){
  .ks-oldnew{grid-template-columns:1fr !important;gap:18px !important}
  .ks-oldgrid{grid-template-columns:1fr 1fr !important}
  .ks-arrow > div{rotate:90deg}
}

/* ---------- Hero bands ---------- */
.ks-heroband{position:relative;height:560px;display:flex;align-items:center;background:#EDE9E1;overflow:hidden}

/* ---------- Responsive ---------- */
@media (max-width:920px){
  .ks-grid2{grid-template-columns:1fr !important}
  .ks-grid3{grid-template-columns:1fr !important}
  .ks-grid4{grid-template-columns:1fr 1fr !important}
  .ks-step-line{display:none !important}
  .ks-frow{grid-template-columns:1fr !important}
  .ks-frow-rev>div:first-child{order:2 !important}
  .ks-hero{grid-template-columns:1fr !important}
  .ks-contact{grid-template-columns:1fr !important}
  .ks-bloggrid{grid-template-columns:1fr !important}
  .ks-navlinks{display:none !important}
  .ks-demobtn{display:inline-flex !important}
  .ks-h1{font-size:42px !important}
  .ks-h2{font-size:30px !important}
  .ks-pad{padding-top:54px !important;padding-bottom:54px !important}
  .ks-heroband{height:auto !important;padding:54px 0 !important}
  .ks-home-heroimg{opacity:.22}
}
