/*
Theme Name: Fon Prikgangtai Company V8.9.1
Theme URI: https://fonprikgangtai.com
Author: ฝนพริกแกงใต้
Description: ธีม WordPress ฝนพริกแกงใต้ Version 8.9.1 พร้อมรายการสินค้า 19 รายการ ลายน้ำ ปุ่ม LINE OA ลิงก์ Facebook และ TikTok
Version: 8.9.1
Requires at least: 6.0
Tested up to: 6.8
Requires PHP: 7.4
Text Domain: fon-company
*/
:root{--red:#9d171c;--red2:#c51b21;--ink:#251b18;--muted:#6f625d;--cream:#fff9f1;--line:#eadfd3;--green:#16a34a;--gold:#c99435;--white:#fff;--shadow:0 20px 60px rgba(45,25,13,.12)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans Thai",Tahoma,sans-serif;background:#fff;line-height:1.65}img{max-width:100%;height:auto}a{color:inherit;text-decoration:none}.container{width:min(1180px,calc(100% - 36px));margin:auto}.screen-reader-text{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link:focus{clip:auto!important;width:auto;height:auto;left:12px;top:12px;background:#fff;padding:10px;z-index:9999}
.site-header{position:sticky;top:0;z-index:100;background:rgba(255,255,255,.96);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.header-inner{min-height:76px;display:flex;align-items:center;gap:26px}.brand{display:flex;align-items:center;margin-right:auto}.custom-logo,.brand-logo-image{width:auto;height:58px;max-width:300px;object-fit:contain}.main-nav ul{display:flex;gap:24px;align-items:center;list-style:none;margin:0;padding:0}.main-nav a{font-weight:700}.main-nav a:hover{color:var(--red)}.header-actions{display:flex;gap:10px}.menu-toggle{display:none;border:0;background:none;font-size:25px}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:999px;padding:12px 20px;font-weight:800;line-height:1.2;transition:.2s;border:1px solid transparent}.btn:hover{transform:translateY(-2px)}.btn-primary{background:linear-gradient(135deg,var(--red),var(--red2));color:#fff}.btn-line{background:var(--green);color:#fff}.btn-outline{border-color:var(--line);background:#fff}
.hero-banner{width:100%;background:#160f0c;overflow:hidden}.hero-banner img{display:block;width:100%;height:auto;max-height:none;object-fit:contain}.section-compact{padding:28px 0}.seo-intro{background:linear-gradient(180deg,#fff,#fff9f2);border-bottom:1px solid var(--line)}.seo-intro-inner{display:flex;align-items:center;justify-content:space-between;gap:34px}.seo-intro h1{font-size:clamp(26px,3vw,44px);line-height:1.2;margin:0 0 9px;color:var(--red)}.seo-intro p{margin:0;color:var(--muted);max-width:780px}.seo-actions{display:flex;gap:10px;flex-shrink:0}.page-builder-content{padding:35px 0}
.stats{background:#fff;border-bottom:1px solid var(--line)}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr)}.stat{text-align:center;padding:25px 14px;border-right:1px solid var(--line);color:var(--muted)}.stat:last-child{border:0}.stat strong{display:block;color:var(--red);font-size:25px}.section{padding:78px 0}.section-alt{background:var(--cream)}.section-head{display:flex;align-items:end;justify-content:space-between;gap:30px;margin-bottom:32px}.section-kicker{color:var(--red);font-weight:900;letter-spacing:.03em}.section h2{font-size:clamp(28px,3.2vw,46px);line-height:1.25;margin:4px 0 0}.section-desc{max-width:520px;color:var(--muted)}.product-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.product-card{border:1px solid var(--line);border-radius:22px;background:#fff;overflow:hidden;box-shadow:0 8px 26px rgba(40,20,8,.06);transition:.25s}.product-card:hover{transform:translateY(-5px);box-shadow:var(--shadow)}.product-thumb{display:grid;place-items:center;aspect-ratio:4/3;background:#f7eee4;overflow:hidden}.product-thumb img{width:100%;height:100%;object-fit:cover}.product-placeholder{font-size:62px}.product-body{padding:21px}.product-tag{display:inline-block;background:#fff0e8;color:var(--red);font-weight:800;border-radius:999px;padding:4px 10px;font-size:13px}.product-card h3{font-size:21px;margin:10px 0 8px}.product-summary{color:var(--muted);min-height:52px}.product-bottom{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-top:18px}.price{font-weight:900;color:var(--red)}.product-bottom .btn{padding:9px 13px;font-size:14px}.features{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.feature{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px}.feature-icon{font-size:35px}.feature h3{margin:10px 0 5px}.feature p{color:var(--muted);margin:0}.story-grid{display:grid;grid-template-columns:.9fr 1.1fr;gap:52px;align-items:center}.story-visual{min-height:420px;border-radius:28px;padding:45px;color:#fff;display:flex;flex-direction:column;justify-content:flex-end;background:linear-gradient(180deg,transparent,rgba(0,0,0,.75)),url('assets/images/default-hero-v8.webp') center/cover}.story-points{display:grid;gap:13px;margin:25px 0}.story-point{display:flex;gap:14px;align-items:center}.story-point b{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#f6e6d7;color:var(--red)}.order-box{display:flex;align-items:center;justify-content:space-between;gap:30px;padding:38px;border-radius:26px;background:linear-gradient(135deg,#3c1f18,#7c1d20);color:#fff}.order-box h2{margin:0 0 5px}.order-box p{margin:0;color:#f0ddd3}.site-footer{background:#211512;color:#eee0d8;padding:58px 0 22px}.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr;gap:40px}.site-footer h2,.site-footer h3{color:#fff}.site-footer ul{list-style:none;padding:0;margin:0}.copyright{border-top:1px solid rgba(255,255,255,.15);margin-top:35px;padding-top:18px;color:#bca9a0}.floating-line{position:fixed;right:18px;bottom:18px;z-index:120;background:var(--green);color:#fff;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;font-weight:900;box-shadow:0 10px 28px rgba(0,0,0,.25)}.page-main{padding:60px 0}.content-container{max-width:940px}.entry-title{font-size:clamp(30px,4vw,52px);line-height:1.2}.entry-content>*{max-width:100%}
@media(max-width:980px){.header-actions{display:none}.menu-toggle{display:block}.main-nav{display:none;position:absolute;left:18px;right:18px;top:74px;background:#fff;border:1px solid var(--line);border-radius:16px;padding:18px;box-shadow:var(--shadow)}.main-nav.is-open{display:block}.main-nav ul{display:grid;gap:12px}.seo-intro-inner,.section-head,.order-box{align-items:flex-start;flex-direction:column}.stats-grid,.features{grid-template-columns:repeat(2,1fr)}.product-grid{grid-template-columns:repeat(2,1fr)}.story-grid{grid-template-columns:1fr}.footer-grid{grid-template-columns:1fr 1fr}.seo-actions{flex-wrap:wrap}}
@media(max-width:600px){.container{width:min(100% - 24px,1180px)}.header-inner{min-height:64px}.custom-logo,.brand-logo-image{height:46px;max-width:230px}.hero-banner img{width:100%;height:auto}.section{padding:52px 0}.seo-intro h1{font-size:27px}.seo-actions{width:100%}.seo-actions .btn{flex:1}.stats-grid,.features,.product-grid,.footer-grid{grid-template-columns:1fr}.stat{border-right:0;border-bottom:1px solid var(--line)}.section-head{margin-bottom:22px}.story-visual{min-height:330px;padding:25px}.order-box{padding:27px}.order-box .btn{width:100%}}
/* Version 8.1 product media and contact */
.product-thumb img{width:100%;height:100%;object-fit:cover;display:block}.product-video-section{background:#fff8ef}.video-frame{max-width:900px;margin:auto;border-radius:24px;overflow:hidden;box-shadow:0 20px 55px rgba(52,27,10,.14);background:#111}.video-frame video{display:block;width:100%;max-height:680px}.contact-grid{display:grid;grid-template-columns:1.25fr .75fr;gap:24px}.contact-card{background:#fff;border-radius:22px;padding:28px;box-shadow:0 14px 36px rgba(52,27,10,.09)}.contact-card h3{margin-top:0}.contact-card p{line-height:1.75}.contact-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}.small-note{font-size:.9rem;color:#6d625b}.guarantee{border-top:5px solid #b8251b}@media(max-width:760px){.contact-grid{grid-template-columns:1fr}.video-frame{border-radius:15px}.contact-card{padding:21px}}


/* Version 8.2 — product catalog image and order improvements */
.product-grid{align-items:stretch}
.product-card{display:flex;flex-direction:column;height:100%}
.product-thumb{display:flex;align-items:center;justify-content:center;aspect-ratio:4/5;background:#fff8ef;padding:10px;overflow:hidden}
.product-thumb img{width:100%;height:100%;object-fit:contain;object-position:center;display:block;border-radius:14px}
.product-body{display:flex;flex-direction:column;flex:1}
.product-summary{min-height:52px}
.product-bottom{margin-top:auto;padding-top:18px}
@media(max-width:600px){.product-thumb{aspect-ratio:4/5;padding:8px}.product-card h3{font-size:20px}}


/* Version 8.3 — full system refinements */
.product-thumb{min-height:320px;background:linear-gradient(180deg,#fffdf9,#f8eee2)}
.product-thumb img{max-width:100%;max-height:100%;object-fit:contain!important;object-position:center!important}
.order-status{display:inline-flex;align-items:center;gap:8px;margin-top:9px;font-size:13px;color:#356a45;background:#ebf8ef;padding:6px 10px;border-radius:999px}
.system-note{background:#fff;border:1px solid var(--line);border-left:5px solid var(--green);border-radius:16px;padding:16px 18px;margin:0 0 26px;color:var(--muted)}
.system-note strong{color:var(--ink)}
.product-card.is-unavailable{opacity:.72}.product-card.is-unavailable .btn{pointer-events:none;background:#777}
@media(max-width:600px){.product-thumb{min-height:280px}.product-grid{gap:16px}.product-body{padding:18px}}

/* Version 8.3.2 — show the complete story image without cropping */
.story-visual{
  min-height:0;
  aspect-ratio:auto;
  margin:0;
  padding:0;
  border-radius:28px;
  overflow:hidden;
  display:block;
  background:#211512;
  box-shadow:0 18px 46px rgba(45,25,13,.15);
  color:#fff;
}
.story-visual img{
  display:block;
  width:100%;
  height:auto;
  aspect-ratio:3/2;
  object-fit:contain;
  object-position:center;
  background:#211512;
}
.story-visual figcaption{
  display:flex;
  flex-direction:column;
  gap:4px;
  padding:18px 22px 20px;
  background:linear-gradient(135deg,#351d17,#6d1c20);
}
.story-visual figcaption strong{font-size:22px;line-height:1.25}
.story-visual figcaption span{color:#f1ddd4;font-size:15px}
@media(max-width:600px){
  .story-visual{border-radius:20px}
  .story-visual img{aspect-ratio:3/2}
  .story-visual figcaption{padding:15px 17px 17px}
  .story-visual figcaption strong{font-size:19px}
}

/* V8.3.3 catalogue: clear placeholder for products awaiting photos */
.product-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;color:#8a604f;padding:18px;font-size:16px}
.product-placeholder strong{font-size:17px;color:#7c1d20}.product-placeholder small{font-size:13px;color:#8d7d74}


/* Version 8.8: product search and category filters */
.product-tools{grid-column:1/-1;display:grid;grid-template-columns:minmax(260px,1fr) auto;gap:14px;align-items:center;margin:0 0 8px}
.product-search input{width:100%;min-height:48px;border:1px solid var(--line);border-radius:999px;padding:0 18px;background:#fff;font:inherit;color:var(--ink);box-shadow:0 5px 18px rgba(40,20,8,.04)}
.product-search input:focus{outline:3px solid rgba(33,150,83,.18);border-color:var(--green)}
.product-filters{display:flex;flex-wrap:wrap;gap:8px}
.filter-btn{border:1px solid var(--line);border-radius:999px;background:#fff;color:var(--ink);padding:10px 15px;font:inherit;font-weight:800;cursor:pointer}
.filter-btn:hover,.filter-btn.is-active{background:var(--green);border-color:var(--green);color:#fff}
.product-count{grid-column:1/-1;margin:0;color:var(--muted);font-size:14px}
.product-card[hidden]{display:none!important}
.no-products{grid-column:1/-1;text-align:center;background:#fff;border:1px dashed var(--line);border-radius:18px;padding:28px;color:var(--muted)}
@media(max-width:760px){.product-tools{grid-template-columns:1fr}.product-filters{overflow-x:auto;flex-wrap:nowrap;padding-bottom:4px}.filter-btn{white-space:nowrap}}

/* Version 8.8 TikTok link */
.btn-tiktok{background:#111;color:#fff;border-color:#111}.social-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:18px}
