/*
Theme Name: SUPER BEARING Thailand
Theme URI: https://superbearingthailand.com/
Author: SUPER BEARING
Description: ธีม WordPress สำหรับเว็บไซต์ลูกปืนตุ๊กตา SUPER BEARING รองรับมือถือ SEO ปุ่มโทร LINE และวิดีโอสินค้า
Version: 1.0.0
Requires at least: 6.4
Requires PHP: 7.4
Text Domain: super-bearing-thailand
*/

:root{--amber:#f5b800;--amber-dark:#dda600;--ink:#20242a;--muted:#66717e;--line:#dde2e7;--soft:#f5f6f7;--green:#249a55;--white:#fff}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:#fff;color:var(--ink);font-family:"Noto Sans Thai","IBM Plex Sans Thai",Arial,sans-serif}a{color:inherit;text-decoration:none}.topbar{height:38px;background:var(--ink);color:#fff;display:flex;align-items:center;justify-content:center;gap:48px;font-size:12px;letter-spacing:.03em}.topbar span::first-letter{color:var(--amber)}.header{height:88px;padding:0 max(28px,calc((100vw - 1240px)/2));display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);background:rgba(255,255,255,.97);position:sticky;top:0;z-index:20}.logo{display:flex;align-items:center;gap:11px;font:800 18px/1 Arial,sans-serif;letter-spacing:.03em}.logo small{display:block;font-size:10px;letter-spacing:.27em;margin-top:5px;color:#69727c}.logoMark{width:43px;height:43px;background:var(--amber);display:grid;place-items:center;color:var(--ink);font-weight:900;border-radius:7px;box-shadow:6px 6px 0 var(--ink)}.nav{display:flex;gap:34px;font-size:14px;font-weight:600}.nav a{padding:34px 0 30px;border-bottom:3px solid transparent}.nav a:hover{border-color:var(--amber)}.headerCta{background:var(--amber);padding:13px 18px;border-radius:7px;font-size:14px;font-weight:700}.headerCta:hover,.primary:hover{background:var(--amber-dark)}.headerCta span,.button span{margin-left:12px}.menu{display:none;border:0;background:none;font-size:28px}.hero{max-width:1440px;margin:auto;min-height:650px;display:grid;grid-template-columns:48% 52%;overflow:hidden}.heroCopy{padding:76px 48px 48px max(28px,calc((100vw - 1240px)/2))}.eyebrow{display:inline-block;font:700 12px/1.3 Arial,sans-serif;letter-spacing:.13em;text-transform:uppercase;color:#7a6500;margin-bottom:20px}.eyebrow::before{content:"";display:inline-block;width:26px;height:3px;background:var(--amber);margin:0 10px 3px 0}.hero h1{font-size:clamp(46px,5.3vw,76px);line-height:1.05;letter-spacing:-.045em;margin:0 0 24px;font-weight:800}.hero h1 em{font-style:normal;color:#9b7600}.heroCopy>p{max-width:600px;color:var(--muted);font-size:18px;line-height:1.8;margin:0}.heroButtons{display:flex;gap:13px;margin:34px 0}.button{height:56px;padding:0 24px;display:inline-flex;align-items:center;justify-content:center;border-radius:7px;font-size:15px;font-weight:700;border:0;cursor:pointer}.primary{background:var(--amber);color:var(--ink)}.secondary{border:1px solid #a9b0b7;background:#fff}.secondary:hover{border-color:var(--ink)}.heroTrust{display:flex;gap:0;border-top:1px solid var(--line);padding-top:23px}.heroTrust div{padding-right:30px;margin-right:30px;border-right:1px solid var(--line)}.heroTrust div:last-child{border:0}.heroTrust b{font-size:22px;display:block}.heroTrust span{font-size:12px;color:var(--muted)}.heroVisual{position:relative;background:linear-gradient(145deg,#f9d756 0%,var(--amber) 64%,#dd9f00 100%);display:flex;align-items:center;justify-content:center;min-height:650px;overflow:hidden}.heroVisual::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(32,36,42,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(32,36,42,.08) 1px,transparent 1px);background-size:44px 44px}.heroVisual img{width:min(88%,700px);position:relative;z-index:2;filter:drop-shadow(0 35px 24px rgba(32,36,42,.3));animation:rise .65s ease-out}.halo{position:absolute;width:470px;height:470px;border:1px solid rgba(32,36,42,.25);border-radius:50%;box-shadow:0 0 0 70px rgba(255,255,255,.1),0 0 0 140px rgba(255,255,255,.07)}.visualTag{position:absolute;top:34px;right:40px;text-align:right;font:12px/1.5 Arial;letter-spacing:.15em;z-index:3}.visualTag b{font-size:20px}.stock{position:absolute;bottom:28px;right:30px;background:#fff;padding:13px 18px;border-radius:6px;font-size:12px;z-index:4;box-shadow:0 12px 30px rgba(0,0,0,.12)}.stock::first-letter{color:var(--green)}.stock strong{margin-left:18px}.spec{position:absolute;z-index:4;background:rgba(255,255,255,.92);padding:8px 12px;font-size:11px;font-weight:600;border-radius:5px}.spec span{background:var(--ink);color:var(--amber);padding:3px 5px;margin-right:6px}.specOne{left:35px;top:120px}.specTwo{right:30px;top:230px}.section{max-width:1240px;margin:auto;padding:100px 28px}.sectionHead{display:flex;justify-content:space-between;align-items:end;margin-bottom:40px}.sectionHead h2,.guide h2,.contact h2{font-size:clamp(34px,4vw,52px);line-height:1.18;margin:0;letter-spacing:-.035em}.sectionHead>p{max-width:470px;color:var(--muted);line-height:1.7}.productGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.productCard{border:1px solid var(--line);border-radius:10px;overflow:hidden;transition:.2s;background:#fff}.productCard:hover{transform:translateY(-5px);border-color:var(--amber);box-shadow:0 18px 40px rgba(32,36,42,.1)}.productImage{height:290px;background:var(--soft);position:relative;display:grid;place-items:center}.productImage img{width:90%;height:90%;object-fit:contain;transition:.2s}.productCard:hover img{transform:scale(1.03)}.badge{position:absolute;top:16px;left:16px;background:var(--amber);padding:6px 10px;border-radius:4px;font-size:11px;font-weight:700}.productInfo{padding:24px}.code{font:800 12px Arial;letter-spacing:.12em;color:#9b7600}.productInfo h3{font-size:21px;margin:8px 0}.productInfo p{color:var(--muted);font-size:14px;line-height:1.65;min-height:70px}.productMeta{display:flex;justify-content:space-between;border-top:1px solid var(--line);padding-top:17px;font-size:12px}.productMeta a{font-weight:800}.guide{background:var(--ink);color:#fff;padding:90px max(28px,calc((100vw - 1184px)/2));display:grid;grid-template-columns:42% 58%;gap:70px}.eyebrow.light{color:#ebcc57}.guideIntro>p{color:#b8c0c8;line-height:1.8;max-width:470px;margin:24px 0 30px}.steps{border-left:1px solid #4a4f55}.step{display:grid;grid-template-columns:72px 1fr;position:relative;padding:18px 0 30px 32px;border-bottom:1px solid #4a4f55}.step b{font:800 30px Arial;color:var(--amber);grid-row:1/3}.step span{font-size:21px;font-weight:700}.step p{color:#aeb7c0;margin:6px 0 0}.applications{padding-bottom:110px}.appGrid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.appGrid div{background:var(--soft);padding:30px 22px;min-height:170px;border-bottom:4px solid transparent;font-size:27px}.appGrid div:hover{border-color:var(--amber)}.appGrid b,.appGrid span{display:block}.appGrid b{font-size:17px;margin:24px 0 7px}.appGrid span{font-size:13px;color:var(--muted);line-height:1.5}.contact{background:#f3c62a;padding:90px max(28px,calc((100vw - 1184px)/2));display:grid;grid-template-columns:1fr 1fr;gap:80px}.contactCopy>p{line-height:1.8;max-width:520px}.contactNote{background:rgba(255,255,255,.45);padding:20px;margin-top:28px}.contactNote b,.contactNote span{display:block}.contactNote span{font-size:13px;margin-top:9px}.quoteForm{background:#fff;padding:32px;border-radius:10px;box-shadow:12px 12px 0 var(--ink)}.quoteForm label{display:block;font-size:13px;font-weight:700;margin-bottom:15px}.quoteForm input,.quoteForm textarea{display:block;width:100%;border:1px solid #cfd5db;padding:13px;margin-top:7px;border-radius:5px;font:inherit}.quoteForm textarea{min-height:90px;resize:vertical}.quoteForm .button{width:100%}.success{color:var(--green);font-weight:700;text-align:center;margin:14px 0 0}footer{background:#15181c;color:#aeb5bd;padding:48px max(28px,calc((100vw - 1184px)/2));display:flex;align-items:center;justify-content:space-between;font-size:12px}.footerLogo{color:#fff}.floating{display:none}.attribution{display:none}@keyframes rise{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:none}}

@media(max-width:900px){.topbar{gap:14px}.topbar span:nth-child(3){display:none}.header{height:72px;padding:0 20px}.headerCta{display:none}.menu{display:block}.nav{display:none;position:absolute;left:0;right:0;top:72px;background:#fff;flex-direction:column;padding:16px 24px;gap:0;border-bottom:1px solid var(--line);box-shadow:0 10px 20px rgba(0,0,0,.08)}.nav.open{display:flex}.nav a{padding:14px 0}.hero{grid-template-columns:1fr}.heroCopy{padding:58px 24px 45px}.heroVisual{min-height:500px}.productGrid{grid-template-columns:1fr 1fr}.guide{grid-template-columns:1fr;padding:70px 28px;gap:45px}.appGrid{grid-template-columns:1fr 1fr}.contact{grid-template-columns:1fr;padding:70px 28px}.sectionHead{align-items:start;gap:30px}.floating{display:flex;position:fixed;bottom:16px;right:16px;background:var(--amber);border:2px solid var(--ink);box-shadow:5px 5px 0 var(--ink);padding:12px 16px;font-weight:800;z-index:30}}
@media(max-width:600px){.topbar{height:34px;font-size:10px}.topbar span:nth-child(2){display:none}.logo{font-size:15px}.logoMark{width:38px;height:38px;box-shadow:4px 4px 0 var(--ink)}.hero h1{font-size:46px}.heroCopy>p{font-size:16px}.heroButtons{flex-direction:column}.button{width:100%}.heroTrust{justify-content:space-between}.heroTrust div{padding-right:10px;margin-right:10px}.heroTrust b{font-size:17px}.heroVisual{min-height:420px}.spec{display:none}.halo{width:280px;height:280px}.productGrid{grid-template-columns:1fr}.section{padding:72px 20px}.sectionHead{display:block}.sectionHead>p{margin-top:20px}.guide{padding:65px 20px}.step{grid-template-columns:52px 1fr;padding-left:18px}.appGrid{grid-template-columns:1fr}.contact{padding:65px 20px;gap:40px}.quoteForm{padding:22px;box-shadow:7px 7px 0 var(--ink)}footer{padding:45px 20px;align-items:flex-start;gap:22px;flex-direction:column}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{animation:none!important;transition:none!important}}

/* Complete Bearing — real-product content */
.realHero .heroCopy{background:linear-gradient(115deg,#fff 72%,#f7f7f7)}
.photoHero{background:linear-gradient(145deg,#ffd652 0%,var(--amber) 100%)}
.photoHero img{width:100%;height:100%;object-fit:cover;filter:none;z-index:1}
.photoHero::after{background:linear-gradient(90deg,rgba(245,184,0,.08),rgba(32,36,42,.1))}
.photoHero .visualTag,.photoHero .spec,.photoHero .stock{z-index:4}
.fourCols{grid-template-columns:repeat(4,1fr)}
.fourCols .productImage{height:245px}
.fourCols .productInfo{padding:22px}
.fourCols .productInfo h3{font-size:19px;min-height:54px}
.fourCols .productInfo p{min-height:92px}
.productImage.real img{width:100%;height:100%;object-fit:cover}
.modelLine{background:#f6f7f8;border-left:3px solid var(--amber);padding:11px 12px;margin:14px 0;font:700 11px/1.6 Arial,sans-serif;color:#444b53;min-height:58px}
.modelSection{background:var(--ink);color:#fff;padding:90px 28px}
.modelWrap{max-width:1184px;margin:auto;display:grid;grid-template-columns:36% 64%;gap:72px}
.modelIntro p{color:#b7bec6;line-height:1.8}
.modelIntro h2{font-size:46px;line-height:1.15;margin:0 0 20px}
.modelGroups{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.modelGroups>div{border:1px solid #4a4f55;padding:24px;background:#272b31;min-height:145px}
.modelGroups b{display:block;color:var(--amber);font:800 31px Arial;margin-bottom:16px}
.modelGroups span{display:block;color:#e1e5e9;font:600 12px/1.8 Arial;letter-spacing:.03em}
.galleryGrid{display:grid;grid-template-columns:repeat(4,1fr);grid-auto-rows:270px;gap:14px}
.galleryGrid figure{margin:0;position:relative;overflow:hidden;background:#eee;border-radius:8px}
.galleryGrid figure.wide{grid-column:span 2;grid-row:span 2}
.galleryGrid img{width:100%;height:100%;object-fit:cover;transition:.25s}
.galleryGrid figure:hover img{transform:scale(1.035)}
.galleryGrid figcaption{position:absolute;left:0;right:0;bottom:0;padding:30px 15px 13px;background:linear-gradient(transparent,rgba(0,0,0,.75));color:#fff;font-size:12px}
.address{font-size:18px;font-weight:600;line-height:1.7!important}
.phoneBig{display:inline-block;font:800 34px Arial;color:var(--ink);margin:8px 0 18px;border-bottom:4px solid var(--ink)}
.quoteForm h3{font-size:25px;margin:0 0 6px}
.formHint{font-size:13px;line-height:1.6;color:var(--muted);margin:0 0 20px}
.success a{display:inline-block;margin-top:8px;color:var(--ink);text-decoration:underline}
footer>p{line-height:1.7}footer>p b{color:#fff}footer>p a{color:var(--amber);font-weight:700}
.lineHeader,.lineButton,.lineFormButton,.lineBig,.lineFloat{background:#06c755!important;color:#fff!important}
.lineHeader:hover,.lineButton:hover,.lineFormButton:hover,.lineBig:hover,.lineFloat:hover{background:#05aa49!important}
.videoSection{background:#f3f4f5;padding:90px max(28px,calc((100vw - 1184px)/2));display:grid;grid-template-columns:1fr 440px;gap:90px;align-items:center}
.videoCopy h2{font-size:clamp(38px,4vw,58px);line-height:1.12;margin:0 0 24px;letter-spacing:-.04em}
.videoCopy>p{color:var(--muted);font-size:17px;line-height:1.8;max-width:560px}
.videoActions{display:flex;gap:12px;margin-top:30px}
.videoFrame{width:100%;max-width:380px;justify-self:center;aspect-ratio:9/16;background:var(--ink);padding:8px;border-radius:18px;box-shadow:18px 18px 0 var(--amber)}
.videoFrame iframe{width:100%;height:100%;border:0;border-radius:12px;background:#000}
.lineBig{display:inline-block;padding:13px 18px;border-radius:7px;font-weight:800;margin:0 0 18px 18px;vertical-align:top}
.lineFormButton{width:100%;margin-top:12px}
.floatingActions{display:none}
.brandLogo{height:76px;display:flex;align-items:center;flex-shrink:0}
.brandLogo img{display:block;width:auto;height:72px;object-fit:contain}
.footerLogo{height:auto}.footerLogo img{height:118px;filter:drop-shadow(0 5px 12px rgba(0,0,0,.35))}
.directContact{background:#fff;padding:30px;border-radius:10px;box-shadow:12px 12px 0 var(--ink);display:flex;flex-direction:column;align-items:flex-start}
.directContact>img{width:150px;height:118px;object-fit:contain;align-self:center;margin-bottom:10px}
.directContact>span{font-size:12px;font-weight:800;letter-spacing:.12em;color:#8b6b00}
.directContact h3{font-size:28px;line-height:1.3;margin:10px 0}
.directContact p{font-size:14px;line-height:1.7;color:var(--muted)}
.directContact .button{width:100%;margin-top:10px}
.callFormButton{border:1px solid var(--ink);background:#fff}
.companyName{font-size:clamp(22px,2.35vw,31px)!important;line-height:1.35!important;max-width:560px;letter-spacing:-.015em!important}
.footerCompany{font-size:13px;font-weight:700;letter-spacing:.01em}
.faqSection{background:#fff;padding:95px max(28px,calc((100vw - 1184px)/2));display:grid;grid-template-columns:38% 62%;gap:80px}
.faqHead h2{font-size:clamp(38px,4vw,54px);line-height:1.15;margin:0 0 22px;letter-spacing:-.04em}
.faqHead p{color:var(--muted);line-height:1.75;max-width:420px}
.faqList{border-top:1px solid var(--line)}
.faqList details{border-bottom:1px solid var(--line);padding:0}
.faqList summary{list-style:none;cursor:pointer;padding:22px 0;display:flex;justify-content:space-between;gap:20px;font-size:17px;font-weight:700}
.faqList summary::-webkit-details-marker{display:none}.faqList summary span{font:400 24px Arial;color:#9b7600}
.faqList details[open] summary span{transform:rotate(45deg)}
.faqList details p{color:var(--muted);line-height:1.75;margin:-5px 45px 22px 0;font-size:14px}

@media(max-width:1100px){.fourCols{grid-template-columns:1fr 1fr}.modelWrap{grid-template-columns:1fr;gap:38px}.modelIntro{max-width:700px}.galleryGrid{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){.videoSection{grid-template-columns:1fr;padding:70px 28px;gap:45px}.videoFrame{max-width:340px}.faqSection{grid-template-columns:1fr;padding:75px 28px;gap:35px}.floatingActions{display:flex;position:fixed;bottom:16px;right:16px;gap:10px;z-index:31}.floatingActions .floating{display:flex;position:static;box-shadow:5px 5px 0 var(--ink)}.phoneFloat{background:var(--amber)}.lineFloat{border-color:#064d24}}
@media(max-width:700px){.fourCols{grid-template-columns:1fr}.fourCols .productInfo h3,.fourCols .productInfo p{min-height:0}.modelSection{padding:65px 20px}.modelIntro h2{font-size:38px}.modelGroups{grid-template-columns:1fr}.galleryGrid{grid-template-columns:1fr 1fr;grid-auto-rows:210px}.galleryGrid figure.wide{grid-column:span 2;grid-row:span 1}.phoneBig{font-size:27px}.photoHero img{min-height:420px}.realHero .heroCopy{background:#fff}}
@media(max-width:600px){.videoSection{padding:65px 20px}.videoActions{flex-direction:column}.faqSection{padding:65px 20px}.faqList summary{font-size:15px}.lineBig{display:block;margin:0 0 18px;width:max-content}.floatingActions{left:16px;right:16px}.floatingActions .floating{flex:1;justify-content:center}.brandLogo{height:62px}.brandLogo img{height:58px}.footerLogo img{height:110px}.directContact{padding:24px;box-shadow:7px 7px 0 var(--ink)}}
