.elementor-49 .elementor-element.elementor-element-c1a4901{--display:flex;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}/* Start custom CSS for container, class: .elementor-element-c1a4901 *//* Archive template – meshop.live */ body.archive .site-header,body.archive .site-footer,body.search .site-header,body.search .site-footer{display:none} body{margin:0;background:#F2F3F5} .ar{--ink:#101319;--steel:#171B22;--steel2:#222731;--line:rgba(255,255,255,.1);--lined:rgba(16,19,25,.1);--amber:#FFB000;--amber2:#FF7A1A;--paper:#F2F3F5;--muted:#5A616C;--display:'Chakra Petch',system-ui,sans-serif;--body:'IBM Plex Sans Thai',system-ui,sans-serif;font-family:var(--body);color:var(--ink);background:var(--paper);line-height:1.65;overflow-x:hidden;width:100%} .ar *{box-sizing:border-box;margin:0;padding:0} .ar img{display:block;max-width:100%} .ar a{color:inherit;text-decoration:none} .ar .wrap{width:100%;max-width:1180px;margin-inline:auto;padding-inline:20px} .ar h1,.ar h2,.ar h3,.ar h4{font-family:var(--display);font-weight:700;line-height:1.2;color:inherit} .ar .eyebrow{font-family:var(--display);font-weight:600;font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--amber);display:flex;align-items:center;gap:10px} .ar .eyebrow::before{content:'';width:22px;height:2px;background:currentColor} .ar .hd{position:sticky;top:0;z-index:80;background:rgba(16,19,25,.92);backdrop-filter:blur(14px);border-bottom:1px solid var(--line);color:#fff} .ar .hd-in{display:flex;align-items:center;gap:18px;height:64px} .ar .brand{display:flex;align-items:center;gap:10px;flex:none} .ar .brand-mark{width:36px;height:36px;border-radius:10px;display:grid;place-content:center;background:linear-gradient(135deg,var(--amber),var(--amber2));color:#101319;font-family:var(--display);font-weight:700;font-size:20px} .ar .brand-name{font-family:var(--display);font-weight:700;font-size:20px} .ar .brand-name b{color:var(--amber)} .ar .nav{display:flex;gap:4px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0} .ar .nav::-webkit-scrollbar{display:none} .ar .nav a{white-space:nowrap;font-size:15px;padding:8px 14px;border-radius:8px;color:rgba(255,255,255,.72);transition:.15s} .ar .nav a:hover{color:#fff;background:rgba(255,255,255,.06)} .ar .nav a.on{color:#101319;background:var(--amber);font-weight:600} .ar a:focus-visible,.ar button:focus-visible,.ar input:focus-visible,.ar select:focus-visible{outline:3px solid var(--amber);outline-offset:2px} .ar .hero{position:relative;color:#fff;padding:34px 0 40px;background:radial-gradient(700px 360px at 82% 0%,rgba(255,176,0,.16),transparent 62%),linear-gradient(180deg,var(--ink),var(--steel))} .ar .hero::before{content:'';position:absolute;inset:0;pointer-events:none;background-image:linear-gradient(var(--line) 1px,transparent 1px),linear-gradient(90deg,var(--line) 1px,transparent 1px);background-size:56px 56px;mask-image:linear-gradient(180deg,rgba(0,0,0,.45),transparent 75%)} .ar .crumb{position:relative;display:flex;gap:8px;align-items:center;font-size:13px;color:rgba(255,255,255,.55);margin-bottom:18px;flex-wrap:wrap} .ar .crumb a:hover{color:var(--amber)} .ar .crumb span{opacity:.5} .ar .hero-grid{position:relative;display:grid;gap:26px;grid-template-columns:1fr;align-items:end} @media(min-width:900px){.ar .hero-grid{grid-template-columns:1.2fr .8fr}} .ar .hero h1{font-size:clamp(30px,5.4vw,50px);letter-spacing:-.01em} .ar .hero h1 em{font-style:normal;color:var(--amber)} .ar .hero p{margin-top:12px;font-size:16.5px;color:rgba(255,255,255,.7);max-width:56ch} .ar .meta-pills{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px} .ar .meta-pills span{font-size:13px;color:rgba(255,255,255,.78);border:1px solid var(--line);border-radius:100px;padding:6px 14px} .ar .meta-pills b{font-family:var(--display);color:var(--amber);margin-right:5px} .ar .hero-search{display:flex;align-items:center;gap:8px;background:#fff;border-radius:12px;padding:5px 5px 5px 14px;box-shadow:0 16px 36px rgba(0,0,0,.25)} .ar .hero-search svg{width:19px;height:19px;color:#8A9099;flex:none} .ar .hero-search input{flex:1;min-width:0;border:none;outline:none;font:inherit;font-size:15.5px;color:var(--ink);background:transparent;height:40px} .ar .hero-search button{height:40px;padding:0 18px;border:none;border-radius:9px;background:var(--ink);color:#fff;font-family:var(--display);font-weight:600;font-size:15px;cursor:pointer} .ar .toolbar{position:sticky;top:64px;z-index:60;background:rgba(242,243,245,.94);backdrop-filter:blur(10px);border-bottom:1px solid var(--lined)} .ar .tb-in{display:flex;align-items:center;gap:12px;padding:12px 0;flex-wrap:wrap} .ar .chips{display:flex;gap:8px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding-bottom:2px} .ar .chips::-webkit-scrollbar{display:none} .ar .chip{white-space:nowrap;font-family:var(--display);font-weight:600;font-size:14px;padding:9px 16px;border-radius:100px;border:1.5px solid var(--lined);background:#fff;color:var(--ink);cursor:pointer;transition:.15s} .ar .chip:hover{border-color:var(--ink)} .ar .chip[aria-current='true']{background:var(--ink);color:#fff;border-color:var(--ink)} .ar .chip i{font-style:normal;opacity:.6;margin-left:6px} .ar .sortbox{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--muted);flex:none} .ar select{font:inherit;font-size:14.5px;padding:9px 12px;border-radius:10px;border:1.5px solid var(--lined);background:#fff;color:var(--ink);cursor:pointer} .ar .main{padding:34px 0 60px} .ar .count{font-size:14.5px;color:var(--muted);margin-bottom:18px} .ar .count b{font-family:var(--display);color:var(--ink)} .ar .grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(262px,1fr))} .ar .card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--lined);border-radius:16px;overflow:hidden;transition:transform .2s,box-shadow .2s} .ar .card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(16,19,25,.12)} .ar .card-img{position:relative;display:block;aspect-ratio:4/3;background:#fff;border-bottom:1px solid var(--lined)} .ar .card-img img{width:100%;height:100%;object-fit:contain;padding:6%;transition:transform .35s} .ar .card:hover .card-img img{transform:scale(1.05)} .ar .noimg{position:absolute;inset:0;display:grid;place-content:center;color:#9AA0A8;font-size:14px;background:repeating-linear-gradient(45deg,#F0F1F3 0 12px,#E8EAED 12px 24px)} .ar .badge{position:absolute;top:12px;left:12px;background:var(--ink);color:#fff;font-size:12px;font-weight:600;padding:4px 10px;border-radius:6px} .ar .card-body{display:flex;flex-direction:column;flex:1;padding:18px 18px 16px} .ar .card-body h2{font-size:17px;line-height:1.35;margin-bottom:8px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden} .ar .card-body h2 a:hover{color:#B37A00} .ar .card-body p{font-size:14px;color:var(--muted);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:14px} .ar .card-foot{margin-top:auto;display:flex;justify-content:space-between;align-items:center;font-size:13px;color:var(--muted);padding-top:12px;border-top:1px dashed var(--lined)} .ar .more{font-family:var(--display);font-weight:600;color:var(--ink)} .ar .more:hover{color:#B37A00} .ar .more-wrap{text-align:center;margin-top:30px} .ar .btn-ghost{font-family:var(--display);font-weight:600;font-size:16px;padding:13px 28px;border-radius:10px;border:1.5px solid var(--ink);background:transparent;color:var(--ink);cursor:pointer} .ar .btn-ghost:hover{background:var(--ink);color:#fff} .ar .empty{grid-column:1/-1;text-align:center;padding:52px 22px;color:var(--muted);background:#fff;border:1px dashed var(--lined);border-radius:16px} .ar .empty b{display:block;font-family:var(--display);font-size:19px;color:var(--ink);margin-bottom:8px} .ar .empty a{font-family:var(--display);font-weight:600;color:#B37A00} .ar .sk{border-radius:16px;height:360px;background:linear-gradient(90deg,#E6E8EB 25%,#F2F3F5 50%,#E6E8EB 75%);background-size:200% 100%;animation:arsk 1.2s linear infinite} @keyframes arsk{to{background-position:-200% 0}} .ar .other{background:#fff;border-top:1px solid var(--lined);padding:56px 0} .ar .other h2{font-size:clamp(22px,3.4vw,30px);margin:10px 0 22px} .ar .tiles{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(230px,1fr))} .ar .tile{position:relative;display:flex;flex-direction:column;justify-content:space-between;min-height:150px;border-radius:16px;overflow:hidden;background:var(--ink);color:#fff;padding:20px;isolation:isolate;transition:transform .2s} .ar .tile:hover{transform:translateY(-4px)} .ar .tile img{position:absolute;right:-8%;bottom:-10%;width:60%;z-index:-1;background:#fff;border-radius:14px;padding:4%;transform:rotate(-6deg)} .ar .tile::after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,var(--ink) 38%,rgba(16,19,25,.25))} .ar .tile h3{font-size:20px} .ar .tile span{font-size:13.5px;color:rgba(255,255,255,.7)} .ar .tile .go{font-family:var(--display);font-weight:600;font-size:14px;color:var(--amber);margin-top:16px} .ar .ft{background:#0B0D11;color:rgba(255,255,255,.62);padding:44px 0;font-size:14px} .ar .ft-in{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;align-items:center} .ar .ft .brand{color:#fff} .ar .ft .disc{border:1px dashed var(--line);border-radius:10px;padding:13px 16px;max-width:60ch;font-size:13px} .ar .up{position:fixed;right:18px;bottom:18px;z-index:70;width:46px;height:46px;border-radius:50%;border:none;background:var(--ink);color:#fff;cursor:pointer;display:grid;place-content:center;opacity:0;pointer-events:none;transition:opacity .25s} .ar .up.show{opacity:1;pointer-events:auto} .ar .up svg{width:20px;height:20px} .ar .rise{opacity:0;transform:translateY(18px);transition:opacity .55s ease,transform .55s ease} .ar .rise.in{opacity:1;transform:none} @media(prefers-reduced-motion:reduce){.ar *{animation:none!important;transition:none!important}.ar .rise{opacity:1;transform:none}}/* End custom CSS */