:root{
  --paper:#fffcf7;
  --ink:#241f1a;
  --muted:#6e665d;
  --gold:#9a7a4a;
  --taupe:#f3ece3;
  --border:#e3d7ca;
  --shadow:0 12px 34px rgba(46,35,20,.08);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#fffdfa 0,#f7f1ea 100%);color:var(--ink);font:400 16px/1.55 Inter,Arial,sans-serif}
a{color:inherit}
h1,h2,h3{font-family:Georgia,"Times New Roman",serif;line-height:1.1;color:#211b16}
h1{font-size:clamp(2.35rem,5vw,4.1rem)}
h2{font-size:clamp(1.9rem,3.2vw,2.75rem)}
h3{font-size:1.28rem}
.container{max-width:1240px;margin-inline:auto;padding-inline:clamp(16px,4vw,42px)}
.site-header{border-bottom:1px solid var(--border);background:#fffdfa;position:sticky;top:0;z-index:5}
.nav{min-height:106px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.brand-block{display:flex;flex-direction:column;gap:6px;align-items:flex-start}
.logo{display:inline-flex;text-decoration:none}
.logo img{display:block;height:92px;width:auto;max-width:min(56vw,320px)}
.brand-scripture{margin:0;font-size:.85rem;letter-spacing:.02em;color:#7b5f36;font-style:italic}
.nav nav{display:flex;align-items:center;gap:clamp(12px,2.3vw,30px);flex-wrap:wrap;justify-content:flex-end}
.nav nav a{text-decoration:none;font-size:.89rem;font-weight:600}
.nav nav a:hover,.footer a:hover{color:#986e3d}
.pill{background:var(--gold);color:#fff;padding:1px 7px;border-radius:999px;font-size:.74rem}
.page-heading{text-align:center;padding:65px 0 48px;max-width:850px;margin:auto}
.page-heading h1{margin:15px 0}
.page-heading p{color:var(--muted);font-size:1.07rem;margin:0}
.eyebrow,.section-title span,.tag{color:#957444;text-transform:uppercase;letter-spacing:.23em;font-size:.7rem;font-weight:700}
.section-title{margin:78px 0 24px}
.section-title h2{margin:9px 0 6px}
.section-title p{color:var(--muted)}
.menu-banner{border:1px solid #e4d8c9;background:var(--taupe);padding:20px 26px;border-radius:8px;display:flex;gap:18px;justify-content:space-between;flex-wrap:wrap;font-size:.95rem}
.menu-banner span{color:#6f6557}
.cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.food-card{background:var(--paper);border:1px solid var(--border);border-radius:7px;overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column}
.image-frame{aspect-ratio:4/3;background:linear-gradient(140deg,#e6dac7,#d0c0ab);overflow:hidden;display:grid;place-items:center}
.image-frame img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s}
.food-card:hover .image-frame img{transform:scale(1.025)}
.image-empty span{text-align:center;font:italic 2rem/1.25 Georgia,serif;color:#78664c;opacity:.75}
.food-body{padding:24px;display:flex;flex-direction:column;flex:1}
.food-body h3{margin:0 0 12px}
.food-body p{color:var(--muted);font-size:.9rem;line-height:1.7;flex:1}
.food-body form{margin-top:18px}
.product-pick{display:flex;gap:9px;margin-bottom:10px}
.product-pick select{flex:1;min-width:0}
.product-pick input{width:70px}
.btn{appearance:none;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;background:#383028;color:#fff;border:1px solid #383028;border-radius:4px;padding:11px 19px;min-height:44px;font-weight:600;font-size:.88rem;line-height:1.3;white-space:normal}
.btn:hover{background:#5b4733;border-color:#5b4733;color:#fff}
.btn.secondary{background:transparent;color:#3c352f;border-color:#9c8d7d}
.btn.secondary:hover{background:#f2e9de}
.btn.block{width:100%}
.btn.small{min-height:34px;padding:6px 10px;font-size:.78rem}
.price-chip{display:inline-block;margin-right:8px;color:#6f5f4b}
.filter-links{display:flex;gap:7px;justify-content:center;flex-wrap:wrap;margin-bottom:35px}
.filter-links a{text-decoration:none;border:1px solid #d7cbbb;padding:7px 16px;border-radius:999px;font-size:.86rem}
.filter-links a.chosen{background:#393129;color:#fff;border-color:#393129}
.cta-strip{display:flex;align-items:center;justify-content:space-between;gap:30px;flex-wrap:wrap;background:var(--taupe);padding:38px;margin:65px 0;border:1px solid var(--border);border-radius:6px}
.cta-strip h2{margin:0}
.footer{margin-top:90px;background:#e8dfd3;border-top:1px solid #dacfbe;padding:35px 0;color:#504840}
.footer-grid{display:flex;justify-content:space-between;gap:25px;flex-wrap:wrap;align-items:flex-start}
.footer-brand img{display:block;height:84px;width:auto;max-width:280px}
.footer p{margin:4px 0;color:#696059}
.footer a{text-decoration:none}
input,select,textarea{background:#fff;border:1px solid #cfc5b8;border-radius:4px;width:100%;min-height:43px;padding:9px 11px;color:#282522}
textarea{resize:vertical}
input:focus,select:focus,textarea:focus{outline:2px solid #ac8653;outline-offset:2px}
label{font-size:.86rem;font-weight:600;display:block;margin:12px 0 17px}
label input,label select,label textarea{margin-top:6px}
select{padding-right:18px}
hr{border:0;border-top:1px solid var(--border);margin:24px 0}
.panel{background:var(--paper);border:1px solid var(--border);border-radius:6px;padding:clamp(20px,3vw,32px);margin-bottom:26px;box-shadow:var(--shadow)}
.panel h2{margin-top:0;font-size:1.8rem}
.panel h3{font-size:1.36rem}
.panel.narrow,.login-wrap{max-width:900px;margin-inline:auto}
.login-wrap{display:grid;grid-template-columns:1fr 1fr;gap:22px}
.muted{color:var(--muted)}
.empty{background:var(--paper);text-align:center;border:1px solid var(--border);padding:60px 20px;border-radius:6px;grid-column:1/-1}
.empty h2{margin-top:0}
.notice{padding:13px 18px;margin:16px 0;background:#efe9db;border:1px solid #d8c5a2;border-radius:4px}
.notice.warning{background:#fff4e3;border-color:#edbf75;color:#694516}
.cart-list{display:grid;gap:14px}
.cart-row{display:grid;grid-template-columns:128px minmax(120px,1fr) 200px 120px;align-items:center;gap:18px;padding:12px;background:var(--paper);border:1px solid var(--border);border-radius:6px}
.cart-row .image-frame{width:128px}
.cart-row h3{margin:2px 0}
.cart-row p{color:var(--muted)}
.cart-row form{display:flex;align-items:end;gap:5px}
.cart-row label{margin:0}
.cart-row input{width:65px}
.cart-foot{text-align:right;padding:26px 0}
.cart-foot strong{font-size:1.4rem}
.cart-foot .text-button{margin-left:12px}
.text-button{border:0;background:transparent;color:#8a603b;text-decoration:underline;padding:10px}
.checkout-grid{display:grid;grid-template-columns:1.3fr 1fr;gap:25px}
.summary-line{display:flex;align-items:flex-start;justify-content:space-between;gap:15px;border-bottom:1px solid var(--border);padding:12px 0}
.summary-line.total{font-size:1.15rem;border:0}
.summary-line span{flex:1}
.order-confirm{max-width:760px;margin-inline:auto}
.table-scroll{overflow:auto;background:var(--paper);border:1px solid var(--border);border-radius:6px;margin:15px 0 30px}
table{width:100%;border-collapse:collapse;min-width:600px}
th,td{padding:11px 13px;border-bottom:1px solid var(--border);text-align:left;vertical-align:top;font-size:.85rem}
th{background:#efe9df;font-weight:700;color:#54493e}
td small{display:block;color:var(--muted)}
.admin-shell{display:grid;grid-template-columns:215px minmax(0,1fr);gap:26px;padding-top:25px}
.admin-nav{display:flex;flex-direction:column;gap:3px;align-self:start;position:sticky;top:120px;padding:12px 10px;background:#efe8dd;border:1px solid var(--border);border-radius:6px}
.admin-nav strong{padding:10px;font-size:.66rem;letter-spacing:.13em;color:#75614d}
.admin-nav a{text-decoration:none;font-size:.86rem;padding:9px 10px;border-radius:4px}
.admin-nav a:hover,.admin-nav a.active{background:#fff;color:#7d5d32;font-weight:700}
.admin-main{min-width:0}
.admin-main h1{font-size:clamp(1.9rem,2.8vw,2.5rem);margin:0 0 12px}
.admin-main h2{font-size:1.7rem;margin:29px 0 14px}
.admin-main .panel h2{margin-top:0}
.stat-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:20px 0 32px}
.stat{padding:20px;border:1px solid var(--border);border-radius:6px;background:var(--paper)}
.stat small{display:block;color:var(--muted);font-size:.75rem}
.stat strong{display:block;margin-top:6px;font:500 1.65rem Georgia,serif}
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 18px}
.checkbox-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 20px}
.check{display:flex;align-items:center;gap:9px;margin:5px 0}
.check input{width:17px;min-height:17px;margin:0;accent-color:#8c734f}
.filter-form{display:flex;align-items:end;gap:10px;flex-wrap:wrap;padding:16px;background:#ece4d9;border-radius:6px}
.filter-form label{margin:0;flex:1;min-width:170px}
.filter-form button{margin-bottom:0}
.search-row{display:flex;gap:8px;margin:20px 0}
.search-row input{flex:1}
.inline-form{display:inline-block;margin:10px}
.tiny-form{display:flex;align-items:end;gap:8px;min-width:330px}
.tiny-form label{margin:0}
.tiny-form input[name=qty]{width:70px}
.tiny-form input[name=reason]{width:170px}
.image-preview{max-width:300px;margin:18px 0}
.prose{background:var(--paper);max-width:850px;margin:auto;padding:32px;border-radius:6px;line-height:1.85}
.sr-only{position:absolute;clip:rect(0,0,0,0);overflow:hidden;width:1px;height:1px;white-space:nowrap}

@media(max-width:1000px){
  .cards{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .admin-shell{grid-template-columns:185px minmax(0,1fr);gap:15px}
  .cart-row{grid-template-columns:100px 1fr 170px}
  .cart-row>.image-frame{width:100px}
  .cart-row>strong{grid-column:2/-1;text-align:right}
}
@media(max-width:700px){
  .nav{padding-block:12px;min-height:0;flex-wrap:wrap;justify-content:center}
  .brand-block{align-items:center;text-align:center;width:100%}
  .logo img{height:76px;max-width:78vw}
  .brand-scripture{font-size:.8rem}
  .nav nav{justify-content:center;gap:8px 20px}
  .nav nav a{font-size:.78rem}
  .page-heading{padding:38px 0 30px}
  .section-title{margin-top:48px}
  .cards{grid-template-columns:1fr;gap:18px}
  .food-body{padding:19px}
  .image-frame{aspect-ratio:16/11}
  .login-wrap,.checkout-grid,.admin-shell{display:block}
  .admin-nav{position:static;flex-direction:row;flex-wrap:nowrap;overflow:auto;white-space:nowrap;margin-bottom:20px;padding:9px}
  .admin-nav strong{display:none}
  .admin-nav a{flex:0 0 auto}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat{padding:15px}
  .stat strong{font-size:1.35rem}
  .form-grid,.checkbox-grid{grid-template-columns:1fr}
  .cart-row{grid-template-columns:80px 1fr;gap:12px}
  .cart-row .image-frame{width:80px}
  .cart-row form,.cart-row>strong{grid-column:2}
  .cart-row form{justify-content:flex-start}
  .cart-foot{text-align:left}
  .footer-grid{display:block}
  .footer-grid>div{margin-bottom:22px}
  .menu-banner{display:block}
  .menu-banner>div{margin-bottom:10px}
  .panel{padding:20px}
  .cta-strip{padding:25px}
  .filter-form label{min-width:135px}
  .tiny-form{min-width:0;flex-wrap:wrap}
}
@media print{
  .site-header,.footer,.admin-nav,.print-button,.filter-form,.btn,.text-button,form{display:none!important}
  .admin-shell{display:block}
  .container{max-width:none}
  .panel,table,.stat{box-shadow:none}
  body{background:#fff;color:#000}
  th{background:#eee!important}
}


/* Sauce and menu card alignment refinement */
.food-card{height:100%;}
.food-body{display:grid;grid-template-rows:auto auto minmax(11.5rem,1fr) auto;align-content:start;gap:0;}
.food-body .tag{display:block;min-height:1em;margin-bottom:10px;}
.food-body h3{min-height:2.5em;display:flex;align-items:flex-start;}
.food-body p{margin:0 0 18px;flex:none;}
.food-body form{margin-top:0;align-self:end;}
@media(max-width:700px){
  .food-body{grid-template-rows:auto auto auto auto;}
  .food-body h3,.food-body p{min-height:0;}
}


/* Christy's Cuisine - sauce card controls aligned by bottom-anchored flex layout.
   Append to END of the existing /assets/site.css; do not overwrite it. */
.cards > .food-card { align-self: stretch; height: 100%; display: flex; flex-direction: column; }
.cards > .food-card > .food-body {
  display: flex !important;
  flex-direction: column !important;
  flex: 1 1 auto;
  height: 100%;
  grid-template-rows: none !important;
}
.cards > .food-card > .food-body > h3 {
  display: block !important;
  min-height: 0 !important;
  flex: 0 0 auto;
}
.cards > .food-card > .food-body > p {
  min-height: 0 !important;
  flex: 1 1 auto !important;
  margin-bottom: 18px;
}
.cards > .food-card > .food-body > form {
  margin-top: auto !important;
  flex: 0 0 auto;
}
/* Keep controls within the card width, including smaller screens. */
.cards > .food-card .product-pick { width: 100%; }
.cards > .food-card .product-pick select { min-width: 0; }

/* Catering images: show complete photographs; overrides older card crop/zoom rules. */
.catering-category .cards .food-card .image-frame {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  aspect-ratio: auto !important;
  height: 295px !important;
  overflow: hidden !important;
  background: #f3ece3 !important;
}
.catering-category .cards .food-card .image-frame > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}
.catering-category .cards .food-card:hover .image-frame > img {
  transform: none !important;
}
@media (max-width: 700px) {
  .catering-category .cards .food-card .image-frame { height: 245px !important; }
}

/* Weekly Menu meal and sauce photography: show the full photo, no cropping. */
.cards .food-card .image-frame {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  aspect-ratio: auto !important;
  height: 295px !important;
  overflow: hidden !important;
  background: #f3ece3 !important;
}
.cards .food-card .image-frame > img {
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  max-width: 100% !important;
  max-height: 100% !important;
  object-fit: contain !important;
  object-position: center center !important;
  transform: none !important;
}
.cards .food-card:hover .image-frame > img { transform: none !important; }
@media (max-width: 700px) {
  .cards .food-card .image-frame { height: 245px !important; }
}


/* CC mobile media: prevent theme/mobile rules from cropping product photos.
   Applies to both Weekly Menu (meals/sauces) and Catering cards. */
@media screen and (max-width: 767px) {
  body .cards > .food-card > .image-frame,
  body .catering-category .cards > .food-card > .image-frame {
    position: relative !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    aspect-ratio: 4 / 3 !important;
    overflow: hidden !important;
    background: #f3ece3 !important;
  }
  body .cards > .food-card > .image-frame > img,
  body .catering-category .cards > .food-card > .image-frame > img {
    position: static !important;
    display: block !important;
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    aspect-ratio: 4 / 3 !important;
    object-fit: contain !important;
    object-position: center center !important;
    transform: none !important;
    clip-path: none !important;
  }
  body .cards > .food-card:hover > .image-frame > img,
  body .catering-category .cards > .food-card:hover > .image-frame > img {
    transform: none !important;
  }
}

/* Mobile menu controls: center the size/quantity row and Add to Cart button.
   Overrides prior desktop card alignment without affecting image fit. */
@media screen and (max-width: 767px) {
  body .cards > .food-card > .food-body > form {
    display: flex !important;
    flex-direction: column !important;
    align-self: stretch !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: auto 0 0 !important;
    box-sizing: border-box;
  }
  body .cards > .food-card .product-pick {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 12px !important;
    box-sizing: border-box;
  }
  body .cards > .food-card .product-pick select {
    flex: 1 1 auto !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body .cards > .food-card .product-pick input[type="number"] {
    flex: 0 0 76px !important;
    width: 76px !important;
    min-width: 0 !important;
    text-align: center;
  }
  body .cards > .food-card > .food-body > form > button.btn,
  body .cards > .food-card > .food-body > form > .btn {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }
}

/* Desktop / tablet: align size, quantity and Add to Cart as on mobile. */
@media screen and (min-width: 768px) {
  body .cards > .food-card > .food-body > form {
    display: flex !important;
    flex-direction: column !important;
    align-self: stretch !important;
    align-items: center !important;
    justify-content: flex-end !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: auto 0 0 !important;
    box-sizing: border-box;
  }
  body .cards > .food-card .product-pick {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 auto 12px !important;
    box-sizing: border-box;
  }
  body .cards > .food-card .product-pick select {
    flex: 1 1 auto !important;
    width: 0 !important;
    min-width: 0 !important;
    max-width: 100% !important;
  }
  body .cards > .food-card .product-pick input[type="number"] {
    flex: 0 0 76px !important;
    width: 76px !important;
    min-width: 0 !important;
    text-align: center;
  }
  body .cards > .food-card > .food-body > form > button.btn,
  body .cards > .food-card > .food-body > form > .btn {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    width: 100% !important;
    max-width: 100% !important;
    margin-inline: auto !important;
    text-align: center !important;
  }
}