/* ==========================================================================
   The Velvet Lady — Design System
   Warm Southern-luxury bakery brand: velvet burgundy, cream, antique gold.
   ========================================================================== */

:root{
  /* Palette */
  --velvet-900:#3C0F17;
  --velvet-800:#4E1420;
  --velvet-700:#5C1A24;   /* primary brand burgundy */
  --velvet-600:#7A2432;
  --velvet-500:#93303F;
  --cream-050:#FEFBF6;
  --cream-100:#FAF5EE;    /* primary background */
  --cream-200:#F3E9DA;
  --cream-300:#EADFC9;
  --gold-300:#E4C68A;
  --gold-400:#D6B274;
  --gold-500:#C9A05C;     /* accent gold */
  --gold-600:#B08A47;
  --choc-900:#2B1A14;     /* body text */
  --choc-700:#4A342A;
  --choc-500:#6B5245;

  /* Type */
  --font-display:'Fraunces', 'Georgia', serif;
  --font-body:'Jost', 'Helvetica Neue', Arial, sans-serif;

  /* Spacing / radius / shadow */
  --space-1:.5rem; --space-2:1rem; --space-3:1.5rem; --space-4:2.5rem;
  --space-5:4rem; --space-6:6rem; --space-7:9rem;
  --radius-sm:6px; --radius-md:14px; --radius-lg:28px;
  --shadow-sm:0 2px 10px rgba(43,26,20,.08);
  --shadow-md:0 12px 32px rgba(43,26,20,.14);
  --shadow-lg:0 24px 60px rgba(43,26,20,.22);
  --container:1200px;
  --ease:cubic-bezier(.22,.61,.36,1);
}

/* ---- Reset ---- */
*,*::before,*::after{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream-100);
  color:var(--choc-900);
  font-family:var(--font-body);
  font-size:17px;
  line-height:1.65;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
img{max-width:100%;display:block;}
a{color:inherit;text-decoration:none;}
ul{list-style:none;margin:0;padding:0;}
h1,h2,h3,h4{font-family:var(--font-display);font-weight:600;line-height:1.12;margin:0 0 .5em;color:var(--velvet-800);}
p{margin:0 0 1em;}
button{font-family:inherit;cursor:pointer;}
input,select,textarea{font-family:inherit;font-size:1rem;}

@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important;}
}

/* ---- Skip link & focus ---- */
.skip-link{
  position:absolute;left:-999px;top:0;background:var(--velvet-700);color:var(--cream-050);
  padding:.75rem 1.25rem;z-index:1000;border-radius:0 0 var(--radius-sm) 0;
}
.skip-link:focus{left:0;}
a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{
  outline:3px solid var(--gold-500);outline-offset:3px;border-radius:4px;
}

/* ---- Layout helpers ---- */
.container{max-width:var(--container);margin-inline:auto;padding-inline:clamp(1.25rem,4vw,3rem);}
.section{padding-block:var(--space-6);}
.section--tight{padding-block:var(--space-5);}
.section--cream{background:var(--cream-100);}
.section--velvet{background:var(--velvet-700);color:var(--cream-100);}
.section--velvet h2,.section--velvet h3{color:var(--cream-050);}
.section--paper{background:var(--cream-050);}
.grid{display:grid;gap:var(--space-4);}
.eyebrow{
  display:inline-flex;align-items:center;gap:.6rem;
  font-family:var(--font-body);font-weight:600;letter-spacing:.18em;text-transform:uppercase;
  font-size:.78rem;color:var(--gold-600);margin-bottom:1rem;
}
.eyebrow::before{content:'';width:28px;height:1px;background:var(--gold-500);}
.section-head{max-width:640px;margin-bottom:var(--space-4);}
.section-head--center{margin-inline:auto;text-align:center;}
.rule-gold{border:none;height:1px;background:linear-gradient(90deg,transparent,var(--gold-500) 20%,var(--gold-500) 80%,transparent);margin:var(--space-4) 0;}

/* ---- Reveal on scroll ---- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s var(--ease),transform .8s var(--ease);}
.reveal.is-visible{opacity:1;transform:none;}
.reveal-stagger > *{transition-delay:calc(var(--i,0) * 90ms);}

/* ---- Buttons ---- */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:.5rem;
  padding:.95rem 2rem;border-radius:999px;font-weight:600;font-size:.95rem;
  letter-spacing:.03em;border:1.5px solid transparent;transition:transform .25s var(--ease),box-shadow .25s var(--ease),background .25s var(--ease),color .25s var(--ease);
  white-space:nowrap;
}
.btn:hover{transform:translateY(-2px);}
.btn-gold{background:var(--gold-500);color:var(--velvet-900);box-shadow:var(--shadow-sm);}
.btn-gold:hover{background:var(--gold-400);box-shadow:var(--shadow-md);}
.btn-outline{border-color:currentColor;color:inherit;background:transparent;}
.btn-outline:hover{background:rgba(255,255,255,.12);}
.btn-outline-dark{border-color:var(--velvet-700);color:var(--velvet-700);}
.btn-outline-dark:hover{background:var(--velvet-700);color:var(--cream-050);}
.btn-block{width:100%;}

/* ---- Header / Nav ---- */
.site-header{
  position:sticky;top:0;z-index:100;
  background:rgba(250,245,238,.7);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  border-bottom:1px solid rgba(92,26,36,.08);
  transition:background .3s var(--ease),box-shadow .3s var(--ease);
}
.site-header.is-scrolled{background:rgba(250,245,238,.96);box-shadow:var(--shadow-sm);}
.nav-row{display:flex;align-items:center;justify-content:space-between;padding-block:1rem;}
.brand{display:flex;align-items:center;gap:.7rem;}
.brand-mark{
  height:46px;width:auto;object-fit:contain;flex:none;
}
.brand-text{font-family:var(--font-display);font-size:1.28rem;color:var(--velvet-800);line-height:1.1;}
.brand-text small{display:block;font-family:var(--font-body);font-size:.62rem;letter-spacing:.16em;text-transform:uppercase;color:var(--gold-600);font-weight:600;margin-top:.2rem;}
.nav-links{display:flex;align-items:center;gap:var(--space-4);}
.nav-links a{font-weight:500;font-size:.95rem;color:var(--choc-700);position:relative;padding:.25rem 0;}
.nav-links a::after{content:'';position:absolute;left:0;bottom:-2px;width:0;height:1.5px;background:var(--gold-500);transition:width .25s var(--ease);}
.nav-links a:hover::after,.nav-links a[aria-current="page"]::after{width:100%;}
.nav-links a[aria-current="page"]{color:var(--velvet-700);}
.nav-cta{display:flex;align-items:center;gap:1rem;}
.nav-toggle{
  display:none;background:none;border:none;padding:.5rem;flex-direction:column;gap:5px;
}
.nav-toggle span{width:24px;height:2px;background:var(--velvet-800);border-radius:2px;transition:transform .25s var(--ease),opacity .25s var(--ease);}

@media (max-width:860px){
  .nav-links{
    position:fixed;inset:0 0 0 auto;width:min(78vw,340px);height:100vh;
    background:var(--cream-050);flex-direction:column;align-items:flex-start;
    padding:6.5rem var(--space-3) var(--space-3);gap:var(--space-3);
    box-shadow:var(--shadow-lg);transform:translateX(100%);transition:transform .35s var(--ease);
  }
  .nav-links.is-open{transform:translateX(0);}
  .nav-links a{font-size:1.1rem;}
  .nav-cta .btn-gold{display:none;}
  .nav-toggle{display:flex;}
  .nav-toggle.is-open span:nth-child(1){transform:translateY(7px) rotate(45deg);}
  .nav-toggle.is-open span:nth-child(2){opacity:0;}
  .nav-toggle.is-open span:nth-child(3){transform:translateY(-7px) rotate(-45deg);}
}
.nav-scrim{position:fixed;inset:0;background:rgba(43,26,20,.4);opacity:0;pointer-events:none;transition:opacity .3s var(--ease);z-index:90;}
.nav-scrim.is-open{opacity:1;pointer-events:auto;}

/* ---- Hero ---- */
.hero{position:relative;min-height:92vh;display:flex;align-items:flex-end;overflow:hidden;color:var(--cream-050);}
.hero-media{position:absolute;inset:0;z-index:0;}
.hero-media img{width:100%;height:100%;object-fit:cover;}
.hero-media::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(43,15,20,.35) 0%,rgba(43,15,20,.55) 55%,rgba(30,10,14,.92) 100%);
}
.hero-inner{position:relative;z-index:1;padding-block:var(--space-6) var(--space-6);width:100%;}
.hero-eyebrow{color:var(--gold-300);}
.hero-eyebrow::before{background:var(--gold-300);}
.hero h1{color:var(--cream-050);font-size:clamp(2.6rem,6vw,5rem);max-width:16ch;}
.hero p{max-width:52ch;font-size:1.15rem;color:var(--cream-200);}
.hero-actions{display:flex;gap:1rem;flex-wrap:wrap;margin-top:var(--space-3);}
.page-hero{
  position:relative;padding:calc(var(--space-6) + 2rem) 0 var(--space-5);
  background:var(--velvet-700);color:var(--cream-100);overflow:hidden;text-align:center;
}
.page-hero::before{
  content:'';position:absolute;inset:0;opacity:.5;
  background:radial-gradient(circle at 15% 20%,rgba(201,160,92,.25),transparent 45%),radial-gradient(circle at 85% 80%,rgba(201,160,92,.18),transparent 45%);
}
.page-hero .container{position:relative;}
.page-hero h1{color:var(--cream-050);font-size:clamp(2.2rem,5vw,3.4rem);}
.page-hero p{max-width:56ch;margin-inline:auto;color:var(--cream-200);font-size:1.08rem;}
.page-hero .eyebrow{color:var(--gold-300);justify-content:center;}
.page-hero .eyebrow::before{background:var(--gold-300);}

/* ---- Cards ---- */
.card{
  background:var(--cream-050);border-radius:var(--radius-md);overflow:hidden;
  box-shadow:var(--shadow-sm);transition:transform .35s var(--ease),box-shadow .35s var(--ease);
  border:1px solid rgba(92,26,36,.06);
}
.card:hover{transform:translateY(-6px);box-shadow:var(--shadow-md);}
.card-photo{aspect-ratio:4/5;overflow:hidden;position:relative;}
.card-photo img{width:100%;height:100%;object-fit:cover;transition:transform .6s var(--ease);}
.card:hover .card-photo img{transform:scale(1.06);}
.card-body{padding:1.4rem 1.5rem 1.6rem;}
.card-body h3{font-size:1.25rem;margin-bottom:.35rem;}
.card-price{color:var(--gold-600);font-weight:600;font-family:var(--font-body);}
.card-tag{
  position:absolute;top:.9rem;left:.9rem;background:rgba(250,245,238,.92);color:var(--velvet-700);
  font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  padding:.35rem .7rem;border-radius:999px;
}

.grid-cards{grid-template-columns:repeat(auto-fit,minmax(255px,1fr));}

/* ---- Stats strip ---- */
.stats{grid-template-columns:repeat(auto-fit,minmax(180px,1fr));text-align:center;}
.stat h3{font-size:clamp(2.2rem,4vw,3rem);color:var(--gold-500);margin-bottom:.15rem;}
.stat p{color:var(--cream-200);margin:0;font-size:.92rem;letter-spacing:.04em;text-transform:uppercase;}

/* ---- Steps ---- */
.steps{grid-template-columns:repeat(auto-fit,minmax(220px,1fr));}
.step{text-align:center;padding:1rem;}
.step-num{
  width:56px;height:56px;border-radius:50%;border:1.5px solid var(--gold-500);color:var(--gold-600);
  display:flex;align-items:center;justify-content:center;font-family:var(--font-display);font-size:1.3rem;
  margin:0 auto 1.1rem;
}

/* ---- Pull quote ---- */
.pull-quote{max-width:820px;margin-inline:auto;text-align:center;}
.pull-quote p{
  font-family:var(--font-display);font-size:clamp(1.5rem,3.4vw,2.3rem);color:var(--cream-050);
  line-height:1.35;margin-bottom:1rem;font-weight:500;font-style:italic;
}
.pull-quote cite{color:var(--gold-300);font-style:normal;letter-spacing:.06em;text-transform:uppercase;font-size:.85rem;}

/* ---- CTA banner ---- */
.cta-banner{
  background:linear-gradient(120deg,var(--velvet-800),var(--velvet-600));
  border-radius:var(--radius-lg);padding:var(--space-5) var(--space-4);text-align:center;color:var(--cream-050);
  position:relative;overflow:hidden;
}
.cta-banner h2{color:var(--cream-050);}
.cta-banner p{color:var(--cream-200);max-width:52ch;margin-inline:auto 1.5rem;}

/* ---- Price table (Menu) ---- */
.menu-category{margin-bottom:var(--space-5);}
.menu-category-head{display:flex;align-items:baseline;justify-content:space-between;gap:1rem;margin-bottom:1.4rem;flex-wrap:wrap;}
.menu-list{display:grid;gap:0;}
.menu-item{
  display:flex;justify-content:space-between;gap:1rem;padding:1.05rem 0;
  border-bottom:1px dashed rgba(92,26,36,.18);
}
.menu-item:last-child{border-bottom:none;}
.menu-item-name{font-weight:600;color:var(--velvet-800);}
.menu-item-note{display:block;font-weight:400;color:var(--choc-500);font-size:.9rem;margin-top:.15rem;}
.menu-item-price{font-family:var(--font-display);color:var(--gold-600);font-weight:600;white-space:nowrap;}
.menu-note-box{
  background:var(--cream-200);border-left:3px solid var(--gold-500);border-radius:0 var(--radius-sm) var(--radius-sm) 0;
  padding:1.1rem 1.4rem;font-size:.95rem;color:var(--choc-700);margin-top:var(--space-3);
}

/* ---- Gallery ---- */
.gallery-grid{
  columns:1;column-gap:1.1rem;
}
@media(min-width:600px){.gallery-grid{columns:2;}}
@media(min-width:960px){.gallery-grid{columns:3;}}
.gallery-item{
  break-inside:avoid;margin-bottom:1.1rem;border-radius:var(--radius-md);overflow:hidden;
  position:relative;box-shadow:var(--shadow-sm);cursor:zoom-in;background:none;border:none;padding:0;display:block;width:100%;
}
.gallery-item img{width:100%;display:block;transition:transform .5s var(--ease);}
.gallery-item:hover img{transform:scale(1.05);}
.gallery-item figcaption{
  position:absolute;inset:auto 0 0 0;padding:1.4rem 1.1rem .9rem;
  background:linear-gradient(0deg,rgba(43,15,20,.85),transparent);
  color:var(--cream-050);font-size:.92rem;font-weight:600;opacity:0;transform:translateY(8px);
  transition:opacity .3s var(--ease),transform .3s var(--ease);
}
.gallery-item:hover figcaption{opacity:1;transform:none;}

.lightbox{
  position:fixed;inset:0;background:rgba(24,10,12,.94);z-index:200;
  display:flex;flex-direction:column;align-items:center;justify-content:center;padding:3rem 1.5rem;
  opacity:0;pointer-events:none;transition:opacity .3s var(--ease);
}
.lightbox.is-open{opacity:1;pointer-events:auto;}
.lightbox img{max-width:min(90vw,1000px);max-height:82vh;object-fit:contain;border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);}
.lightbox-caption{color:var(--cream-200);text-align:center;margin-top:1rem;font-size:.95rem;}
.lightbox-close,.lightbox-prev,.lightbox-next{
  position:absolute;background:rgba(250,245,238,.12);border:1px solid rgba(250,245,238,.3);color:var(--cream-050);
  width:48px;height:48px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;
  transition:background .2s var(--ease);
}
.lightbox-close:hover,.lightbox-prev:hover,.lightbox-next:hover{background:rgba(250,245,238,.24);}
.lightbox-close{top:1.5rem;right:1.5rem;}
.lightbox-prev{left:1.5rem;top:50%;transform:translateY(-50%);}
.lightbox-next{right:1.5rem;top:50%;transform:translateY(-50%);}
@media(max-width:640px){.lightbox-prev,.lightbox-next{width:40px;height:40px;}}

/* ---- Forms ---- */
.form-grid{display:grid;gap:1.1rem;grid-template-columns:1fr 1fr;}
.form-grid .field-full{grid-column:1/-1;}
@media(max-width:640px){.form-grid{grid-template-columns:1fr;}}
.field label{display:block;font-size:.85rem;font-weight:600;color:var(--velvet-800);margin-bottom:.4rem;letter-spacing:.01em;}
.field input,.field select,.field textarea{
  width:100%;padding:.85rem 1rem;border:1.5px solid var(--cream-300);border-radius:var(--radius-sm);
  background:var(--cream-050);color:var(--choc-900);transition:border-color .2s var(--ease),box-shadow .2s var(--ease);
}
.field input:focus,.field select:focus,.field textarea:focus{
  border-color:var(--gold-500);box-shadow:0 0 0 4px rgba(201,160,92,.18);outline:none;
}
.field textarea{resize:vertical;min-height:120px;}
.form-note{font-size:.85rem;color:var(--choc-500);margin-top:.75rem;}
.form-status{margin-top:1rem;font-size:.92rem;font-weight:600;display:none;}
.form-status.is-visible{display:block;}

/* ---- Info panel (Contact) ---- */
.info-panel{background:var(--velvet-700);color:var(--cream-100);border-radius:var(--radius-lg);padding:var(--space-4);}
.info-panel h3{color:var(--cream-050);}
.info-row{display:flex;gap:1rem;padding:1rem 0;border-bottom:1px solid rgba(250,245,238,.14);}
.info-row:last-child{border-bottom:none;}
.info-row-icon{
  flex:none;width:40px;height:40px;border-radius:50%;border:1px solid var(--gold-400);color:var(--gold-300);
  display:flex;align-items:center;justify-content:center;
}
.info-row a:hover{color:var(--gold-300);}
.info-row-label{font-size:.78rem;text-transform:uppercase;letter-spacing:.1em;color:var(--gold-300);margin-bottom:.2rem;}
.map-embed{border-radius:var(--radius-md);overflow:hidden;box-shadow:var(--shadow-sm);border:1px solid rgba(92,26,36,.1);}
.map-embed iframe{width:100%;height:320px;border:0;display:block;}

/* ---- Footer ---- */
.site-footer{background:var(--velvet-900);color:var(--cream-200);padding-block:var(--space-5) var(--space-3);}
.footer-grid{grid-template-columns:1.4fr 1fr 1fr;gap:var(--space-4);}
@media(max-width:760px){.footer-grid{grid-template-columns:1fr;}}
.footer-brand p{color:var(--cream-300);max-width:34ch;}
.footer-heading{color:var(--gold-300);font-size:.82rem;letter-spacing:.1em;text-transform:uppercase;margin-bottom:1rem;font-weight:600;}
.footer-links li{margin-bottom:.6rem;}
.footer-links a{color:var(--cream-200);}
.footer-links a:hover{color:var(--gold-300);}
.footer-bottom{
  margin-top:var(--space-4);padding-top:var(--space-3);border-top:1px solid rgba(250,245,238,.1);
  display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;font-size:.85rem;color:var(--cream-300);
}

/* ---- Utilities ---- */
.text-center{text-align:center;}
.mt-0{margin-top:0;}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}