/*
Theme Name: ThaiStation Heritage (Astra Child)
Template: astra
Version: 1.0.0
Description: Heritage Pantry design system for ThaiStation Graz - Jade and Gold, Fraunces serif display, elegant retail presentation.
Author: Jeng
*/
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(woff2/fraunces-w400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(woff2/fraunces-w500.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(woff2/fraunces-w600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(woff2/fraunces-w700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(woff2/inter-w400.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url(woff2/inter-w500.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url(woff2/inter-w600.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url(woff2/inter-w700.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

/* ============ HERITAGE PANTRY - DESIGN TOKENS ============ */
:root{
  --tp-bg:        #F6F1E7;
  --tp-jade:      #123F2E;
  --tp-jade-dark: #0D2C21;
  --tp-gold:      #C99A3C;
  --tp-terra:     #B5532A;
  --tp-ink:       #2A2E2A;
  --tp-line:      #E3DCCB;
  --tp-white:     #FFFFFF;
  --tp-serif: 'Fraunces', Georgia, serif;
  --tp-sans: 'Inter', -apple-system, sans-serif;
}

/* ============ BASIS ============ */
body{ background:var(--tp-bg); color:var(--tp-ink); font-family:var(--tp-sans); font-size:16px; line-height:1.65; }
h1,h2,h3,h4,.entry-title{ font-family:var(--tp-serif); color:var(--tp-jade); font-weight:600; line-height:1.15; letter-spacing:-.01em; }
h1{ font-size:clamp(2.2rem,5vw,3.4rem); }
h2{ font-size:clamp(1.7rem,3.4vw,2.4rem); }
h3{ font-size:1.35rem; }
a{ color:var(--tp-jade); }
a:hover{ color:var(--tp-gold); }
p{ max-width:70ch; }

.section-label, .tp-label{
  text-transform:uppercase; letter-spacing:.22em; font-size:.72rem;
  font-family:var(--tp-sans); font-weight:600; color:var(--tp-gold);
  display:block; margin-bottom:.9rem;
}

/* ============ HEADER ============ */
.site-header, .site-header .main-header-bar{ background:var(--tp-jade) !important; }
.site-title, .site-title a{ color:var(--tp-bg) !important; font-family:var(--tp-serif) !important; font-size:1.5rem !important; letter-spacing:.02em; }
.main-navigation ul li a{ color:#EDE7D8 !important; font-family:var(--tp-sans); font-size:.95rem; font-weight:500; padding:1.4rem 1.1rem; text-transform:uppercase; letter-spacing:.12em; }
.main-navigation ul li a:hover{ color:var(--tp-gold) !important; }
.main-navigation ul li.current-menu-item > a{ color:var(--tp-gold) !important; }
.site-header .ast-above-header, .site-header .ast-below-header{ background:var(--tp-jade-dark) !important; color:#D8CFBA !important; }
.site-header .ast-above-header a{ color:#D8CFBA !important; }

/* ============ BUTTONS ============ */
a.button, .btn, .wp-block-button__link, .elementor-button, input[type=submit], button{
  background:var(--tp-gold) !important; color:var(--tp-white) !important;
  border:none !important; border-radius:2px !important;
  font-family:var(--tp-sans) !important; font-weight:600 !important;
  letter-spacing:.08em; text-transform:uppercase; font-size:.85rem !important;
  padding:.95rem 2rem !important; display:inline-block; cursor:pointer;
  transition:background .18s ease;
}
a.button:hover, .btn:hover, input[type=submit]:hover, button:hover{ background:var(--tp-jade) !important; color:var(--tp-gold) !important; }

/* ============ SECTIONS ============ */
.ast-container, .elementor-section, .tp-section{ padding-top:clamp(3rem,7vw,5.5rem); padding-bottom:clamp(3rem,7vw,5.5rem); }
.tp-divider{ border:none; border-top:1px solid var(--tp-line); max-width:120px; margin:2.5rem auto; }

.tp-hero{ background:var(--tp-jade); color:var(--tp-bg); position:relative; }
.tp-hero h1{ color:var(--tp-bg); }
.tp-hero .section-label{ color:var(--tp-gold); }
.tp-hero p{ color:#D9D2C0; margin:1.2rem auto 2rem; }

/* ============ CATEGORY GRID ============ */
.tp-cat-grid{ display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:1.6rem; margin:2.6rem 0; }
.tp-cat{ position:relative; overflow:hidden; border-radius:3px; background:var(--tp-white); box-shadow:0 6px 24px rgba(18,63,46,.08); transition:transform .25s ease, box-shadow .25s ease; }
.tp-cat:hover{ transform:translateY(-4px); box-shadow:0 14px 34px rgba(18,63,46,.16); }
.tp-cat img{ width:100%; aspect-ratio:4/3; object-fit:cover; display:block; }
.tp-cat-body{ padding:1.1rem 1.2rem 1.3rem; }
.tp-cat h3{ font-size:1.15rem; margin:0 0 .2rem; }
.tp-cat span{ font-size:.82rem; color:#6E6A5E; }

/* ============ PRODUCT CARDS ============ */
.tp-grid{ display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:1.8rem; margin:2.4rem 0; }
.tp-card{ position:relative; background:var(--tp-white); border-radius:3px; overflow:hidden; box-shadow:0 4px 18px rgba(42,46,42,.07); transition:transform .25s ease, box-shadow .25s ease; display:flex; flex-direction:column; }
.tp-card:hover{ transform:translateY(-4px); box-shadow:0 16px 36px rgba(18,63,46,.15); }
.tp-card figure{ margin:0; }
.tp-card img{ width:100%; aspect-ratio:1/1; object-fit:cover; display:block; }
.tp-card-body{ padding:1.1rem 1.2rem 1.3rem; flex:1; display:flex; flex-direction:column; gap:.35rem; }
.tp-card .tp-brand{ font-size:.7rem; text-transform:uppercase; letter-spacing:.18em; color:var(--tp-terra); }
.tp-card h3{ font-size:1.12rem; margin:0; line-height:1.3; }
.tp-card .tp-desc{ font-size:.88rem; color:#5C5A50; flex:1; }
.tp-card .tp-price{ font-family:var(--tp-serif); font-size:1.25rem; color:var(--tp-jade); font-weight:600; }
.tp-card .tp-badge{ position:absolute; top:.9rem; left:.9rem; background:var(--tp-terra); color:#fff; font-size:.68rem; font-weight:600; letter-spacing:.14em; text-transform:uppercase; padding:.35rem .7rem; border-radius:2px; }

/* ============ ABOUT ============ */
.tp-about{ background:var(--tp-white); }
.tp-about .inner{ display:grid; grid-template-columns:1.1fr .9fr; gap:3.5rem; align-items:center; }
@media (max-width:782px){ .tp-about .inner{ grid-template-columns:1fr; gap:2rem; } }
.tp-quote{ font-family:var(--tp-serif); font-size:1.35rem; color:var(--tp-jade); font-style:italic; border-left:3px solid var(--tp-gold); padding-left:1.4rem; margin:1.8rem 0; }

/* ============ TRUST ROW ============ */
.tp-trust{ display:grid; grid-template-columns:repeat(auto-fit,minmax(180px,1fr)); gap:1.4rem; margin:2.5rem 0; text-align:center; }
.tp-trust div{ padding:1.4rem 1rem; border:1px solid var(--tp-line); border-radius:3px; background:var(--tp-white); }
.tp-trust b{ display:block; font-family:var(--tp-serif); color:var(--tp-jade); font-size:1.05rem; margin-bottom:.3rem; }
.tp-trust span{ font-size:.85rem; color:#5C5A50; }

/* ============ FOOTER ============ */
.site-footer{ background:var(--tp-jade-dark) !important; color:#C9C2AE !important; }
.site-footer a{ color:#E4DDC9 !important; }
.site-footer a:hover{ color:var(--tp-gold) !important; }
.site-footer .widget-title{ color:var(--tp-gold) !important; font-family:var(--tp-sans) !important; font-size:.78rem !important; text-transform:uppercase; letter-spacing:.2em; }

/* ============ WP BLOCKS ============ */
.wp-block-quote{ border-left:3px solid var(--tp-gold); font-family:var(--tp-serif); }
.wp-block-separator{ max-width:120px; border-color:var(--tp-line); }

/* ============ MOBILE BREAKPOINTS (<=820px) ============ */
/* All multi-column grids collapse to a single column, trust + about stack. */
@media (max-width:820px){
  .tp-cat-grid{ grid-template-columns:1fr; gap:1.2rem; margin:2rem 0; }
  .tp-grid{ grid-template-columns:1fr; gap:1.3rem; margin:2rem 0; }
  .tp-trust{ grid-template-columns:1fr; gap:1rem; }
  .tp-about .inner{ grid-template-columns:1fr; gap:2rem; }
  .tp-about .inner img{ order:-1; }
  .tp-hero h1{ font-size:2rem; }
  .tp-section h2{ font-size:1.7rem; }
  .tp-card img, .tp-cat img{ aspect-ratio:16/10; }
  .tp-quote{ margin:1.4rem 0; font-size:1.2rem; }
  .container, .entry-content{ padding-left:1.25rem; padding-right:1.25rem; }
  .site-header .main-navigation ul li a{ padding:0.6rem 0.8rem; font-size:.85rem; }
  a.button, .btn, .wp-block-button__link, .elementor-button{ width:100%; text-align:center; }
}