/*
Theme Name: Joy CostSheet Pro
Theme URI: https://joyauracart.shop
Author: Developer Joy (+8801611-688611)
Author URI: https://joyauracart.shop
Description: জয় কস্টশীট প্রো — গার্মেন্টস কস্টিং ও মার্চেন্ডাইজিং WordPress থিম। লাইভ ফেব্রিক মার্কেট উইজেট, কুইক কস্টিং ক্যালকুলেটর, অ্যাপ এমবেড শর্টকোড, লাইট/ডার্ক/গ্রে থিম, গ্লাস UI, Anek Bangla ফন্ট। Powered by joyauracart.shop & joybeautycart.shop
Version: 2.0.1
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: joy-costsheet-pro
Tags: business, one-column, custom-menu, custom-logo, translation-ready, dark-mode
*/

:root{--brand:#1da596;--brand2:#0f8478;--gold:#f8b93a;--ink:#13284a;--text:#0f1f36;--muted:#5b6b82;--bg:#eef4f8;--surface:rgba(255,255,255,.62);--surface2:rgba(255,255,255,.85);--border:rgba(255,255,255,.8);--field:rgba(255,255,255,.8);--fieldb:rgba(148,170,196,.45);--shadow:rgba(19,40,74,.25);--veil:linear-gradient(180deg,rgba(240,247,251,.82),rgba(236,244,249,.88));--imgf:saturate(1.05)}
html[data-theme=dark]{--ink:#eaf0f8;--text:#e8eef6;--muted:#9fb0c8;--bg:#0b1322;--surface:rgba(22,34,54,.65);--surface2:rgba(18,28,46,.9);--border:rgba(120,150,190,.2);--field:rgba(12,20,34,.75);--fieldb:rgba(120,150,190,.3);--shadow:rgba(0,0,0,.55);--veil:linear-gradient(180deg,rgba(8,14,26,.86),rgba(8,14,26,.92));--imgf:saturate(.8) brightness(.7)}
html[data-theme=gray]{--ink:#1c2128;--text:#1d232b;--muted:#5b636e;--bg:#d9dde2;--surface:rgba(240,242,245,.68);--surface2:rgba(236,239,242,.9);--border:rgba(255,255,255,.6);--field:rgba(250,251,252,.85);--fieldb:rgba(120,130,145,.35);--veil:linear-gradient(180deg,rgba(214,218,224,.85),rgba(208,212,218,.9));--imgf:grayscale(.9)}
*{box-sizing:border-box}
body{margin:0;font-family:"Anek Bangla",system-ui,sans-serif;color:var(--text);background:var(--bg);line-height:1.6;transition:background .3s,color .3s}
a{color:var(--brand2)}
img{max-width:100%;height:auto}
.jcp-bg{position:fixed;inset:0;z-index:-2;overflow:hidden}
.jcp-bg i{position:absolute;inset:-4%;background-size:cover;background-position:center;opacity:0;animation:jcpKen 30s infinite;filter:var(--imgf)}
.jcp-bg i:nth-child(2){animation-delay:10s}.jcp-bg i:nth-child(3){animation-delay:20s}
.jcp-bg:after{content:"";position:absolute;inset:0;background:var(--veil)}
@keyframes jcpKen{0%{opacity:0;transform:scale(1.08)}8%{opacity:1}33%{opacity:1}41%{opacity:0;transform:scale(1.2) translate(-2%,-1%)}100%{opacity:0}}
.wrap{max-width:1200px;margin:0 auto;padding:0 20px}
.glass{background:var(--surface);backdrop-filter:blur(18px) saturate(1.5);-webkit-backdrop-filter:blur(18px) saturate(1.5);border:1px solid var(--border);border-radius:20px;box-shadow:0 14px 36px -20px var(--shadow)}
.site-header{position:sticky;top:0;z-index:50;background:var(--surface2);backdrop-filter:blur(18px);border-bottom:1px solid var(--border)}
.site-header .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-top:12px;padding-bottom:12px}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:var(--ink)}
.brand b{display:block;font-size:20px;font-weight:800;line-height:1.1}
.brand small{display:block;font-size:10px;letter-spacing:.18em;text-transform:uppercase;color:var(--brand);font-weight:700}
.logo-mark{width:40px;height:40px;border-radius:12px;background:linear-gradient(135deg,#3bbfae,#0f6a62);display:grid;place-items:center;color:#fff;font-weight:800}
.menu{display:flex;gap:18px;list-style:none;margin:0;padding:0}
.menu a{color:var(--muted);text-decoration:none;font-weight:600}
.menu a:hover{color:var(--brand)}
.switch{display:flex;gap:4px;padding:3px;border-radius:12px}
.switch button{border:0;background:transparent;border-radius:9px;padding:5px 9px;cursor:pointer;font-size:13px}
.switch button.on{background:var(--brand);color:#fff}
.btn{display:inline-flex;align-items:center;gap:8px;border:0;border-radius:12px;padding:12px 22px;font-weight:700;font-family:inherit;font-size:15px;cursor:pointer;text-decoration:none;transition:transform .15s,box-shadow .2s}
.btn:hover{transform:translateY(-2px)}
.btn-primary{background:linear-gradient(135deg,#0f8478,#3bbfae);color:#fff;box-shadow:0 10px 24px -10px rgba(15,132,120,.8)}
.btn-gold{background:linear-gradient(135deg,#f8b93a,#fbd06b);color:#13284a}
.btn-ghost{background:var(--field);color:var(--text);border:1px solid var(--fieldb)}
.hero{padding:70px 0 40px}
.hero h1{font-size:clamp(34px,5vw,60px);line-height:1.2;margin:16px 0;color:var(--ink);font-weight:800}
.grad{background:linear-gradient(100deg,#0f8478,#2b4c7e,#f0a014,#1da596);background-size:220%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:jcpGrad 8s ease infinite}
@keyframes jcpGrad{50%{background-position:100% 50%}}
.pill{display:inline-flex;align-items:center;gap:8px;padding:6px 14px;font-size:13px;font-weight:700;color:var(--brand2);border-radius:999px}
.dot{width:8px;height:8px;border-radius:50%;background:#10b981;box-shadow:0 0 0 0 rgba(16,185,129,.6);animation:jcpPing 1.6s infinite}
@keyframes jcpPing{to{box-shadow:0 0 0 10px rgba(16,185,129,0)}}
.grid{display:grid;gap:20px}
.g2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr))}
.g4{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}
.card{padding:22px;transition:transform .25s,box-shadow .25s}
.card:hover{transform:translateY(-6px) perspective(800px) rotateX(2deg);box-shadow:0 24px 50px -24px var(--shadow)}
.icon{width:52px;height:52px;border-radius:16px;display:grid;place-items:center;font-size:26px;background:linear-gradient(135deg,#3bbfae,#0f8478);color:#fff;margin-bottom:12px}
h2.sec{font-size:clamp(26px,3.5vw,40px);text-align:center;color:var(--ink);margin:0 0 30px}
section{padding:50px 0}
.muted{color:var(--muted)}
.field{width:100%;padding:10px 12px;border-radius:10px;border:1px solid var(--fieldb);background:var(--field);color:var(--text);font-family:inherit;font-size:14px}
label span{display:block;font-size:12px;font-weight:700;color:var(--muted);margin-bottom:4px}
.fob{border-radius:18px;padding:22px;text-align:center;background:linear-gradient(135deg,#1da596,#0f6a62);color:#fff}
.fob b{display:block;font-size:46px;line-height:1.1}
table.jcp{width:100%;border-collapse:collapse;font-size:14px}
table.jcp td,table.jcp th{padding:8px 10px;border-bottom:1px solid var(--fieldb);text-align:left}
table.jcp td.r,table.jcp th.r{text-align:right}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px}
.gallery figure{margin:0;border-radius:20px;overflow:hidden;position:relative;height:220px;box-shadow:0 20px 40px -20px var(--shadow);border:4px solid var(--border)}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.gallery figure:hover img{transform:scale(1.1)}
.gallery figcaption{position:absolute;left:12px;bottom:12px;background:var(--surface2);padding:4px 12px;border-radius:10px;font-weight:700;color:var(--ink)}
.app-frame{width:100%;border:0;border-radius:20px;min-height:900px;background:var(--surface)}
.reveal{opacity:0;transform:translateY(30px);transition:all .8s cubic-bezier(.16,1,.3,1)}
.reveal.in{opacity:1;transform:none}
.site-footer{margin:40px auto 24px;padding:24px;display:flex;flex-wrap:wrap;gap:16px;align-items:center;justify-content:space-between}
.site-footer p{margin:2px 0;font-size:14px}
.site-footer .pw a{display:inline-block;margin:2px;padding:3px 12px;border-radius:999px;background:var(--field);font-weight:700;text-decoration:none}
.entry{padding:28px;margin:24px 0}
.ticker{overflow:hidden;white-space:nowrap;padding:10px 14px;margin-bottom:22px}
.ticker div{display:inline-block;animation:jcpMarq 35s linear infinite}
.ticker span{margin-right:28px;font-size:13px}
@keyframes jcpMarq{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(max-width:800px){.menu{display:none}}