/*
Theme Name: Larder
Theme URI: https://example.com/larder
Author: Larder
Author URI: https://example.com
Description: A warm, ticket-rail styled block theme for Larder — stock, prep and supplier orders for independent kitchens.
Requires at least: 6.4
Tested up to: 6.6
Requires PHP: 7.4
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: larder
Tags: e-commerce, block-patterns, full-site-editing, custom-colors, custom-menu, custom-logo
*/

:root{
  --stone:      #EDEAE0;
  --stone-2:    #E2DECF;
  --card:       #FBFAF6;
  --ink:        #1B1F1D;
  --ink-soft:   #5B615A;
  --line:       rgba(27,31,29,.12);
  --mustard:    #E8A33D;
  --mustard-2:  #C9812A;
  --forest:     #2F4A3E;
  --forest-2:   #223A30;
  --rust:       #B5482F;
  --white:      #FFFFFF;
  --radius:     14px;
}

/* ---------- Base ---------- */
body{
  font-family:'Inter',sans-serif;
  background:var(--stone);
  color:var(--ink);
  line-height:1.55;
}
.larder-site img{max-width:100%;display:block;}
.larder-site a{text-decoration:none;color:inherit;}
.larder-site ul{list-style:none;margin:0;padding:0;}
.larder-site button{font-family:inherit;}
.wrap{max-width:1180px;margin:0 auto;padding:0 32px;}
.larder-site h1,.larder-site h2,.larder-site h3{font-family:'Fraunces',serif;font-weight:600;color:var(--ink);letter-spacing:-0.01em;line-height:1.08;}
.larder-site h1{font-size:58px;}
.larder-site h2{font-size:38px;}
.larder-site h3{font-size:22px;}
.larder-site em{font-style:italic;color:var(--forest);}
.larder-site p{color:var(--ink-soft);font-size:17px;}
.mono{font-family:'IBM Plex Mono',monospace;}
.eyebrow{
  display:flex;align-items:center;gap:10px;
  font-family:'IBM Plex Mono',monospace;font-weight:500;font-size:12.5px;
  letter-spacing:.12em;text-transform:uppercase;color:var(--mustard-2);
  margin-bottom:18px;
}
.eyebrow::before{content:"";width:20px;height:1px;background:var(--mustard-2);}

.btn{
  display:inline-flex;align-items:center;gap:8px;
  font-family:'Inter',sans-serif;font-weight:600;font-size:15.5px;
  padding:14px 26px;border-radius:9px;border:1px solid transparent;cursor:pointer;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.btn:hover{transform:translateY(-2px);}
.btn-primary{background:var(--forest);color:#fff;}
.btn-primary:hover{box-shadow:0 12px 26px rgba(47,74,62,.28);}
.btn-ghost{background:transparent;border-color:var(--line);color:var(--ink);}
.btn-ghost:hover{border-color:var(--ink);}
.btn-light{background:var(--stone);color:var(--ink);}

.larder-section{padding:120px 0;}
.larder-section.tight{padding:90px 0;}

/* ---------- Header ---------- */
.site-header{
  position:sticky;top:0;z-index:60;background:rgba(237,234,224,.86);
  backdrop-filter:blur(10px);border-bottom:1px solid var(--line);
}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;padding-top:18px;padding-bottom:18px;}
.logo{display:flex;align-items:center;gap:10px;font-family:'Fraunces',serif;font-weight:600;font-size:22px;color:var(--ink);}
.logo-mark{width:30px;height:30px;flex-shrink:0;}
nav.main-nav ul{display:flex;gap:34px;}
nav.main-nav a{font-size:15px;font-weight:500;color:var(--ink-soft);}
nav.main-nav a:hover{color:var(--ink);}
.header-actions{display:flex;align-items:center;gap:22px;}
.header-actions .login{font-size:15px;font-weight:500;color:var(--ink-soft);}
.header-actions .btn{padding:11px 22px;font-size:14.5px;}
.menu-toggle{display:none;flex-direction:column;gap:5px;background:none;border:none;cursor:pointer;padding:6px;}
.menu-toggle span{width:24px;height:2px;background:var(--ink);}

/* ---------- Hero ---------- */
.hero{padding:96px 0 40px;position:relative;}
.hero .wrap{display:grid;grid-template-columns:1fr 1fr;gap:60px;align-items:center;}
.hero-media{position:relative;}
.hero h1{margin-bottom:22px;}
.hero .lead{font-size:19px;max-width:460px;margin-bottom:36px;}
.hero-ctas{display:flex;gap:14px;align-items:center;margin-bottom:44px;flex-wrap:wrap;}
.hero-meta{
  display:flex;gap:22px;flex-wrap:wrap;font-family:'IBM Plex Mono',monospace;
  font-size:12.5px;letter-spacing:.06em;color:var(--ink-soft);text-transform:uppercase;
}
.hero-meta span::before{content:"—— ";color:var(--mustard-2);}

/* ---------- Ticket visual ---------- */
.ticket{
  background:var(--card);border-radius:var(--radius);border:1px solid var(--line);
  box-shadow:0 30px 60px rgba(27,31,29,.12);position:relative;padding:26px 26px 22px;
  transform:rotate(1.2deg);
}
.ticket::before,.ticket::after{
  content:"";position:absolute;top:0;bottom:0;width:16px;
  background:radial-gradient(circle,var(--stone) 5px,transparent 5.5px);
  background-size:16px 20px;
}
.ticket::before{left:-8px;}
.ticket::after{right:-8px;}
.ticket-head{display:flex;justify-content:space-between;align-items:flex-start;border-bottom:1px dashed var(--line);padding-bottom:14px;margin-bottom:16px;}
.ticket-head .t-num{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--ink-soft);letter-spacing:.06em;}
.ticket-head .t-station{font-family:'Fraunces',serif;font-weight:600;font-size:17px;}
.ticket-badge{background:var(--rust);color:#fff;font-family:'IBM Plex Mono',monospace;font-size:11px;padding:4px 9px;border-radius:5px;letter-spacing:.05em;}
.stock-row{display:flex;align-items:center;gap:12px;margin-bottom:14px;}
.stock-row:last-child{margin-bottom:0;}
.stock-name{width:108px;flex-shrink:0;font-size:14px;font-weight:500;color:var(--ink);}
.stock-bar{flex:1;height:8px;background:var(--stone-2);border-radius:5px;overflow:hidden;}
.stock-bar i{display:block;height:100%;border-radius:5px;background:var(--forest);}
.stock-bar.low i{background:var(--rust);}
.stock-bar.mid i{background:var(--mustard);}
.stock-qty{width:52px;text-align:right;flex-shrink:0;font-family:'IBM Plex Mono',monospace;font-size:12.5px;color:var(--ink-soft);}
.ticket-foot{display:flex;justify-content:space-between;align-items:center;margin-top:20px;padding-top:16px;border-top:1px dashed var(--line);}
.ticket-foot .btn{padding:9px 16px;font-size:13px;}
.float-tag{
  position:absolute;background:var(--white);border:1px solid var(--line);border-radius:10px;
  padding:10px 14px;box-shadow:0 14px 30px rgba(27,31,29,.14);font-size:13px;font-weight:600;
  display:flex;align-items:center;gap:8px;
}
.float-tag .dot{width:8px;height:8px;border-radius:50%;background:var(--mustard);}
.float-tag.a{top:-18px;right:20px;transform:rotate(-3deg);}
.float-tag.b{bottom:-22px;left:-24px;transform:rotate(2deg);}
.float-tag.b .dot{background:var(--rust);}

/* ---------- Logo strip ---------- */
.strip{border-top:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--stone-2);}
.strip .wrap{display:flex;align-items:center;gap:46px;flex-wrap:wrap;justify-content:space-between;padding:34px 32px;}
.strip-label{font-family:'IBM Plex Mono',monospace;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:var(--ink-soft);flex-shrink:0;}
.strip-names{display:flex;gap:38px;flex-wrap:wrap;}
.strip-names span{font-family:'Fraunces',serif;font-weight:500;font-size:17px;color:var(--ink-soft);opacity:.75;}

/* ---------- Feature split ---------- */
.split{display:grid;grid-template-columns:1fr 1fr;gap:76px;align-items:center;}
.split.reverse .split-media{order:2;}
.split-copy h2{margin-bottom:18px;}
.split-copy p{margin-bottom:28px;max-width:440px;}
.split-list{display:flex;flex-direction:column;gap:14px;margin-bottom:30px;}
.split-list li{display:flex;gap:12px;align-items:flex-start;font-size:15.5px;color:var(--ink);}
.split-list li svg{flex-shrink:0;margin-top:3px;}

.order-ticket{background:var(--forest);color:#fff;border-radius:var(--radius);padding:28px;box-shadow:0 24px 50px rgba(34,58,48,.28);}
.order-ticket .oh{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px;}
.order-ticket .oh .mono{font-size:12px;letter-spacing:.06em;color:rgba(255,255,255,.6);}
.order-ticket .oh h3{color:#fff;}
.order-line{display:flex;justify-content:space-between;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.14);font-size:14.5px;}
.order-line span:last-child{font-family:'IBM Plex Mono',monospace;color:rgba(255,255,255,.75);}
.order-total{display:flex;justify-content:space-between;padding-top:16px;font-weight:600;font-size:16px;}
.order-ticket .btn{width:100%;justify-content:center;margin-top:20px;background:var(--mustard);color:var(--forest-2);}

/* ---------- Three-card grid ---------- */
.grid-head{text-align:center;max-width:600px;margin:0 auto 60px;}
.grid-head .eyebrow{justify-content:center;}
.cards3{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;}
.fcard{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:34px 28px;}
.fcard .ficon{width:46px;height:46px;border-radius:11px;background:var(--stone-2);display:flex;align-items:center;justify-content:center;margin-bottom:20px;}
.fcard h3{margin-bottom:10px;font-size:19px;}
.fcard p{font-size:15px;}

/* ---------- Testimonial rail (carousel) ---------- */
.rail-section{background:var(--forest);color:#fff;overflow:hidden;}
.rail-section .eyebrow{color:var(--mustard);}
.rail-section .eyebrow::before{background:var(--mustard);}
.rail-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:56px;flex-wrap:wrap;gap:20px;}
.rail-head h2{color:#fff;max-width:520px;}
.rail-controls{display:flex;align-items:center;gap:16px;}
.rail-btn{
  width:46px;height:46px;border-radius:50%;border:1px solid rgba(255,255,255,.28);background:transparent;
  color:#fff;display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s;flex-shrink:0;
}
.rail-btn:hover{background:rgba(255,255,255,.1);}
.rail-count{font-family:'IBM Plex Mono',monospace;font-size:13px;color:rgba(255,255,255,.6);letter-spacing:.05em;min-width:54px;}

.rail-viewport{overflow:hidden;}
.rail-track{display:flex;transition:transform .55s cubic-bezier(.65,0,.35,1);}
.rail-slide{flex:0 0 100%;padding:2px;}
@media (min-width:860px){ .rail-slide{flex:0 0 50%;} }
@media (min-width:1220px){ .rail-slide{flex:0 0 33.3333%;} }

.t-ticket{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.14);border-radius:var(--radius);
  padding:30px 26px;margin:0 12px;position:relative;height:100%;
}
.t-ticket .punches{position:absolute;top:-9px;left:24px;display:flex;gap:14px;}
.t-ticket .punches i{width:14px;height:14px;border-radius:50%;background:var(--forest);border:1px solid rgba(255,255,255,.14);display:block;}
.t-quote{font-family:'Fraunces',serif;font-style:italic;font-size:19px;line-height:1.45;color:#fff;margin-bottom:26px;}
.t-person{display:flex;align-items:center;gap:12px;padding-top:18px;border-top:1px dashed rgba(255,255,255,.2);}
.t-avatar{width:42px;height:42px;border-radius:50%;background:var(--mustard);color:var(--forest-2);display:flex;align-items:center;justify-content:center;font-family:'Fraunces',serif;font-weight:600;font-size:16px;flex-shrink:0;}
.t-name{font-weight:600;font-size:14.5px;color:#fff;}
.t-role{font-size:13px;color:rgba(255,255,255,.55);font-family:'IBM Plex Mono',monospace;}

.rail-dots{display:flex;gap:8px;justify-content:center;margin-top:44px;}
.rail-dots button{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.3);border:none;cursor:pointer;padding:0;transition:background .15s,width .15s;}
.rail-dots button.active{background:var(--mustard);width:22px;border-radius:4px;}

/* ---------- Pricing ---------- */
.price-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;align-items:stretch;}
.price-card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius);padding:36px 32px;display:flex;flex-direction:column;}
.price-card.featured{background:var(--ink);color:#fff;border-color:var(--ink);position:relative;}
.price-card.featured h3,.price-card.featured .price-amt{color:#fff;}
.price-card.featured p,.price-card.featured .price-desc{color:rgba(255,255,255,.65);}
.price-card.featured li{color:rgba(255,255,255,.9);}
.price-badge{position:absolute;top:-14px;right:32px;background:var(--mustard);color:var(--forest-2);font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:600;padding:6px 14px;border-radius:999px;letter-spacing:.05em;}
.price-card h3{margin-bottom:6px;}
.price-desc{font-size:14.5px;margin-bottom:22px;}
.price-amt{font-family:'Fraunces',serif;font-size:40px;font-weight:600;margin-bottom:24px;}
.price-amt span{font-family:'Inter',sans-serif;font-size:15px;font-weight:500;color:var(--ink-soft);}
.price-card ul{display:flex;flex-direction:column;gap:13px;margin-bottom:30px;flex:1;}
.price-card li{display:flex;gap:10px;align-items:flex-start;font-size:14.5px;color:var(--ink);}
.price-card li svg{flex-shrink:0;margin-top:3px;}
.price-card .btn{justify-content:center;width:100%;}
.price-card:not(.featured) .btn-primary{background:var(--ink);}
.price-card.featured .btn-primary{background:var(--mustard);color:var(--forest-2);}

/* ---------- CTA band ---------- */
.cta-band{background:var(--mustard);text-align:center;}
.cta-band h2{max-width:640px;margin:0 auto 18px;}
.cta-band p{max-width:480px;margin:0 auto 34px;color:rgba(27,31,29,.68);font-size:17.5px;}
.cta-band .btn-primary{background:var(--forest);}

/* ---------- Footer ---------- */
.site-footer{background:var(--ink);color:rgba(255,255,255,.65);padding:80px 0 32px;}
.footer-top{display:flex;justify-content:space-between;gap:40px;margin-bottom:64px;flex-wrap:wrap;}
.footer-brand{max-width:270px;}
.footer-brand .logo{color:#fff;margin-bottom:16px;}
.footer-brand p{font-size:14px;color:rgba(255,255,255,.5);}
.footer-cols{display:flex;gap:60px;flex-wrap:wrap;}
.footer-col h4{font-size:13px;letter-spacing:.06em;text-transform:uppercase;color:rgba(255,255,255,.85);margin-bottom:18px;font-weight:600;font-family:'IBM Plex Mono',monospace;}
.footer-col li{margin-bottom:12px;font-size:14.5px;}
.footer-col a:hover{color:#fff;}
.footer-bottom{border-top:1px solid rgba(255,255,255,.12);padding-top:28px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:14px;font-size:13.5px;}
.social-icons{display:flex;gap:12px;}
.social-icons a{width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.08);display:flex;align-items:center;justify-content:center;font-size:12px;}

/* ---------- Responsive ---------- */
@media (max-width:980px){
  .larder-site h1{font-size:44px;}
  .larder-site h2{font-size:32px;}
  .hero .wrap{grid-template-columns:1fr;}
  .hero-ctas{margin-bottom:60px;}
  nav.main-nav{display:none;}
  .split{grid-template-columns:1fr;}
  .split.reverse .split-media{order:0;}
  .cards3{grid-template-columns:1fr;}
  .price-grid{grid-template-columns:1fr;max-width:440px;margin:0 auto;}
  .footer-top{flex-direction:column;}
}
@media (max-width:600px){
  .larder-section{padding:76px 0;}
  .larder-site h1{font-size:34px;}
  .larder-site h2{font-size:27px;}
  .header-actions .btn-primary{display:none;}
  .menu-toggle{display:flex;}
  .wrap{padding:0 20px;}
  .float-tag{display:none;}
  .rail-head{flex-direction:column;align-items:flex-start;}
}
