@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,600;6..96,800&family=Inter:wght@400;500;600;700&display=swap');

/* ========== BASE ========== */
*{margin:0;padding:0;box-sizing:border-box}
:root{--y:#FFD500;--yd:#B89700;--ink:#101317;--ink2:#1b2027;--paper:#FAF8F2;--line:#e7e3d6;--mut:#5d6470;--w:#fff;--ease:cubic-bezier(.2,.8,.2,1)}
html{scroll-behavior:smooth;scroll-padding-top:80px;width:100%;overflow-x:hidden}
body{font-family:Inter,sans-serif;color:var(--ink);background:var(--paper);line-height:1.65;overflow-x:hidden;width:100%}
h1,h2,h3,h4{font-family:'Bodoni Moda',serif;line-height:1.1;font-weight:800}
img,video,iframe{max-width:100%}
img{display:block}
a{color:inherit}
.c{max-width:1200px;margin:0 auto;padding:0 22px}
section{padding:96px 0}
.sh{max-width:640px;margin-bottom:3rem}
.sh h2{font-size:2.7rem;margin-bottom:.9rem}
.sh p{color:var(--mut)}
.stitch{display:block;width:120px;height:6px;margin-top:1rem}
.stitch line{stroke:var(--y);stroke-width:4;stroke-dasharray:10 8;stroke-dashoffset:140;transition:stroke-dashoffset 1.6s ease}
.in .stitch line,.stitch.in line{stroke-dashoffset:0}
:focus-visible{outline:3px solid var(--y);outline-offset:3px}
.adv-label{display:inline-block;color:var(--y);font-size:.8rem;font-weight:700;letter-spacing:3px;margin-bottom:1.2rem}
#about .adv-label,#products .adv-label,#capabilities .adv-label,#faq .adv-label{color:var(--yd)}
#ceo .adv-label{color:var(--ink)}
.about-h{font-size:2.7rem;margin-bottom:1rem}

/* scroll progress bar */
.progress{position:fixed;top:0;left:0;width:100%;height:3px;background:var(--y);transform:scaleX(0);transform-origin:left;z-index:2500}

/* ========== INTRO ========== */
#intro{position:fixed;inset:0;background:var(--y);z-index:3000;display:flex;align-items:center;justify-content:center;transition:transform .9s cubic-bezier(.77,0,.18,1)}
#intro img{width:200px;max-width:70%;height:auto;border-radius:14px;animation:pop 1s ease both}
#intro.done{transform:translateY(-100%);pointer-events:none}
@keyframes pop{from{opacity:0;transform:scale(.6)}to{opacity:1;transform:none}}

/* ========== HEADER ========== */
.hd{position:fixed;top:0;width:100%;z-index:1000;background:rgba(250,248,242,.92);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);transition:.3s}
.hd.s{box-shadow:0 8px 28px rgba(0,0,0,.08)}
.nav{display:flex;justify-content:space-between;align-items:center;height:78px;transition:.3s}
.hd.s .nav{height:64px}
.brand img{height:58px;width:auto;mix-blend-mode:multiply;transition:.3s}
.hd.s .brand img{height:48px}
.links{display:flex;gap:2rem;list-style:none}
.links a{color:var(--ink);text-decoration:none;font-weight:600;font-size:.92rem;position:relative}
.links a::after{content:"";position:absolute;left:0;bottom:-4px;height:2px;width:0;background:var(--y);transition:.3s}
.links a:hover::after,.links a.on::after{width:100%}
.mt{display:none;background:none;border:0;font-size:1.8rem;cursor:pointer;color:var(--ink)}

/* ========== BUTTONS ========== */
.btn{display:inline-flex;align-items:center;justify-content:center;padding:14px 30px;border-radius:6px;font:700 .95rem Inter,sans-serif;text-decoration:none;cursor:pointer;border:2px solid transparent;transition:.3s;position:relative;overflow:hidden}
.btn.full{width:100%}
.btn::after{content:"";position:absolute;inset:0;transform:translateX(-120%);transition:transform .7s ease;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.4) 50%,transparent 70%);pointer-events:none}
.btn:hover::after{transform:translateX(120%)}
.by{background:var(--y);color:var(--ink)}
.by:hover{background:var(--ink);color:var(--y);transform:translateY(-2px)}
.bd{background:var(--ink);color:var(--y)}
.bd:hover{background:var(--y);color:var(--ink);transform:translateY(-2px)}
.bo{border-color:#4a505a;color:#fff}
.bo:hover{border-color:var(--y);color:var(--y)}

/* ========== HERO ========== */
.hero{background:var(--ink);padding:160px 0 90px;position:relative;overflow:hidden}
.hero::before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(135deg,rgba(255,213,0,.05) 0 2px,transparent 2px 16px)}
.hg{position:relative;display:grid;grid-template-columns:1.15fr .85fr;gap:4rem;align-items:center}
.tag{display:inline-block;color:var(--y);border:1px solid rgba(255,213,0,.4);padding:7px 16px;border-radius:50px;font-weight:600;font-size:.85rem;margin-bottom:1.5rem}
.hero h1{font-size:4.3rem;color:#fff;margin-bottom:1.4rem}
.hero h1 em{font-style:normal;color:var(--y)}
.hero p{color:#b9bec7;font-size:1.1rem;max-width:520px;margin-bottom:2.2rem}
.acts{display:flex;gap:1rem;flex-wrap:wrap}
/* hero text cascade (starts after intro) */
.hero .tag,.hero h1,.hero p,.hero .acts,.hero-art{animation:rise .9s var(--ease) both}
.hero .tag{animation-delay:1s}
.hero h1{animation-delay:1.15s}
.hero p{animation-delay:1.3s}
.hero .acts{animation-delay:1.45s}
.hero-art{position:relative;animation-delay:1.3s}
@keyframes rise{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
.card{position:relative;background:var(--y);border-radius:18px;padding:2.2rem;animation:float 6s ease-in-out infinite}
.card::before{content:"";position:absolute;inset:10px;border:2px dashed rgba(16,19,23,.55);border-radius:12px;pointer-events:none}
.card .lg{background:#fff;border-radius:12px;padding:1rem}
@keyframes float{50%{transform:translateY(-12px)}}
.chip{position:absolute;background:var(--ink);color:#fff;border:2px solid var(--y);padding:10px 16px;border-radius:10px;font-size:.82rem;font-weight:600;box-shadow:0 10px 24px rgba(0,0,0,.3)}
.chip b{color:var(--y);display:block;font:800 1.4rem 'Bodoni Moda',serif}
.c1{left:-28px;bottom:36px;animation:bob 5s ease-in-out infinite}
.c2{right:-18px;top:30px;animation:bob 6s ease-in-out -2s infinite}
@keyframes bob{50%{transform:translateY(-10px)}}

/* ========== STATS + MARQUEE ========== */
.stats{background:var(--y);padding:44px 0}
.sg{display:grid;grid-template-columns:repeat(4,1fr);gap:2rem;text-align:center}
.sg b{font:800 3rem 'Bodoni Moda',serif;display:block}
.sg span{font-weight:600}
.mq{background:var(--ink);overflow:hidden;white-space:nowrap;padding:16px 0}
.mq div{display:inline-block;animation:sc 30s linear infinite;color:var(--y);font:600 1.15rem 'Bodoni Moda',serif}
.mq:hover div{animation-play-state:paused}
.mq span{margin:0 1.8rem}
@keyframes sc{to{transform:translateX(-50%)}}

/* ========== ABOUT ========== */
.ab{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.ab p{color:var(--mut);margin-bottom:1rem}
.ticks{list-style:none;margin-top:1.5rem;display:grid;grid-template-columns:1fr 1fr;gap:.7rem}
.ticks li::before{content:"✓";background:var(--y);width:22px;height:22px;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;margin-right:.6rem;font-size:.8rem;font-weight:800}
.panel{background:var(--ink);color:#fff;border-radius:16px;padding:2.4rem}
.panel h3{color:var(--y);margin-bottom:1rem;font-size:1.6rem}
.panel p{color:#b9bec7;margin:0}

/* ========== PRODUCTS ========== */
.products{padding:96px 0 110px;background:#fff;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.fl{display:flex;gap:.7rem;flex-wrap:wrap;margin-bottom:2.5rem}
.f{padding:9px 22px;border:1px solid var(--line);border-radius:50px;background:#fff;font:600 .9rem Inter,sans-serif;cursor:pointer;transition:.25s;color:var(--ink)}
.f:hover,.f.on{background:var(--ink);color:var(--y);border-color:var(--ink)}
.g4{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:1.75rem}
.pr{background:var(--paper);border:1px solid var(--line);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}
.pr:hover{box-shadow:0 18px 36px rgba(0,0,0,.1);border-color:var(--y)}
.pr.h{display:none}
.pr.show{animation:pop2 .5s ease both}
@keyframes pop2{from{opacity:0;transform:scale(.94)}to{opacity:1;transform:none}}
.ph{height:210px;padding:1.4rem;overflow:hidden;background:var(--ink) repeating-linear-gradient(45deg,rgba(255,213,0,.08) 0 2px,transparent 2px 12px);display:flex;align-items:center;justify-content:center}
.ph img{width:100%;height:100%;object-fit:contain;transition:transform .5s ease}
.pr:hover .ph img{transform:scale(1.08) rotate(-2deg)}
.pr div+div{display:flex;flex-direction:column;flex:1;padding:1.5rem}
.pr h4{font-size:1.3rem}
.pr p{flex:1;font-size:.9rem;color:var(--mut);margin:.5rem 0 1.2rem;line-height:1.6}
.pr a{align-self:flex-start;font-weight:700;color:var(--ink);text-decoration:none;border-bottom:2px solid var(--y)}

/* ========== PROCESS ========== */
.pc{background:var(--ink);color:#fff}
.pc .sh p{color:#b9bec7}
.pc h2{color:#fff}
.st{display:grid;grid-template-columns:repeat(5,1fr);gap:1.2rem;counter-reset:s}
.sp{border:2px dashed rgba(255,213,0,.5);border-radius:14px;padding:1.6rem 1.2rem;counter-increment:s}
.sp::before{content:counter(s);display:flex;width:38px;height:38px;border-radius:50%;background:var(--y);color:var(--ink);align-items:center;justify-content:center;font:800 1rem 'Bodoni Moda',serif;margin-bottom:1rem}
.sp h4{color:var(--y);margin-bottom:.4rem}
.sp p{font-size:.88rem;color:#b9bec7}

/* ========== CAPABILITIES ========== */
.cp{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.cb{background:#fff;border:1px solid var(--line);border-top:5px solid var(--y);border-radius:12px;padding:1.8rem}
.cb:hover{box-shadow:0 14px 30px rgba(0,0,0,.08)}
.cb h4{margin-bottom:.5rem;font-size:1.25rem}
.cb p{color:var(--mut);font-size:.93rem}

/* ========== CEO ========== */
.ceo{background:var(--y)}
.cg{display:grid;grid-template-columns:.8fr 1.2fr;gap:4rem;align-items:center}
.pt{position:relative;width:100%;min-height:400px;aspect-ratio:4/4.6;overflow:hidden;border-radius:18px;background:var(--ink)}
.pt::before{content:"";position:absolute;inset:12px;border:2px dashed rgba(255,213,0,.6);border-radius:12px;z-index:2;pointer-events:none}
.ceo-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:center 25%;border-radius:18px;transition:transform .8s ease}
.pt:hover .ceo-img{transform:scale(1.05)}
.ceo h2{font-size:2.6rem;margin-bottom:1.2rem}
.ceo blockquote{font:600 1.3rem/1.5 'Bodoni Moda',serif;margin-bottom:1.2rem}
.ceo p{margin-bottom:1rem}
.sig{font:800 1.3rem 'Bodoni Moda',serif}
.sig small{display:block;font:600 .9rem Inter,sans-serif}

/* ========== WHY US ========== */
.wy{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.wb{background:var(--ink);color:#b9bec7;border-radius:14px;padding:2rem}
.wb:hover{box-shadow:0 14px 30px rgba(0,0,0,.12)}
.wb h3{color:var(--y);margin-bottom:.6rem;font-size:1.35rem}

/* ========== ADVANTAGE ========== */
.advantage{background:var(--ink);color:var(--w);position:relative;overflow:hidden}
.advantage::before{content:"Z";position:absolute;right:-30px;top:30px;font:800 30rem 'Bodoni Moda',serif;color:rgba(255,213,0,.035);pointer-events:none}
.advantage .c{position:relative;z-index:1}
.advantage-heading{max-width:700px;margin-bottom:3rem}
.advantage-heading h2{color:var(--w);font-size:3.2rem;margin-bottom:1.2rem}
.advantage-heading h2 em{color:var(--y);font-style:normal}
.advantage-heading p{color:#aeb4bd;max-width:550px}
.adv-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}

.adv-card{
    min-height:340px;
    padding:2rem 1.5rem;
    border:1px solid #343a42;
    border-radius:14px;
    background:#171c22;
    position:relative;
    overflow:hidden;
    display:flex;
    flex-direction:column;
    transition: transform 0.3s ease, border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
}
.adv-card:hover{border-color:var(--y);background:#20262e;box-shadow:0 18px 40px rgba(0,0,0,.25)}
.adv-card.adv-main{background:var(--y);color:var(--ink);border-color:var(--y)}
.adv-card.adv-main:hover{background:#ffe044}

.adv-number{font-size:.8rem;font-weight:700;opacity:.65;letter-spacing:2px}

.adv-icon{width:60px;height:60px;display:flex;align-items:center;justify-content:center;margin:2rem 0 1.4rem;color:var(--y);border:1px solid rgba(255,213,0,.3);border-radius:12px;background:rgba(255,213,0,.05);position:relative}
.adv-main .adv-icon{color:var(--ink);border-color:rgba(16,19,23,.3);background:rgba(16,19,23,.05)}

.icon-custom{width:25px;height:25px;border:1.8px solid currentColor;transform:rotate(45deg);position:relative}
.icon-custom::before,.icon-custom::after{content:"";position:absolute}
.icon-custom::before{width:1.8px;height:34px;left:11px;top:-6px;background:currentColor}
.icon-custom::after{width:8px;height:8px;border:1.8px solid currentColor;border-radius:50%;left:7px;top:7px}

.icon-quality{width:27px;height:32px;border:1.8px solid currentColor;border-radius:12px 12px 14px 14px;position:relative;clip-path:polygon(50% 0,100% 20%,90% 75%,50% 100%,10% 75%,0 20%)}
.icon-quality::after{content:"";position:absolute;width:8px;height:4px;border-left:1.8px solid currentColor;border-bottom:1.8px solid currentColor;transform:rotate(-45deg);left:8px;top:11px}

.icon-production{width:30px;height:23px;border:1.8px solid currentColor;position:relative}
.icon-production::before{content:"";position:absolute;left:5px;top:-10px;width:17px;height:10px;border:1.8px solid currentColor;border-bottom:0;transform:skewY(-28deg)}
.icon-production::after{content:"";position:absolute;left:5px;bottom:4px;width:4px;height:7px;background:currentColor;box-shadow:9px 0 0 currentColor,18px 0 0 currentColor}

.icon-label{width:25px;height:25px;border:1.8px solid currentColor;transform:rotate(45deg);border-radius:3px;position:relative}
.icon-label::before{content:"";position:absolute;width:5px;height:5px;border:1.5px solid currentColor;border-radius:50%;top:3px;left:3px}

.adv-card h3{font-size:1.4rem;margin-bottom:.8rem}
.adv-card p{color:#aeb4bd;font-size:.9rem;line-height:1.8;margin:0}
.adv-main p{color:#333}

.adv-bottom{
    margin-top: auto;
    padding-top: 1.5rem;
    font-size:.68rem;
    font-weight:700;
    letter-spacing:1.5px;
    color:var(--y);
    display: block;
}
.adv-main .adv-bottom{color:var(--ink)}

.adv-footer{display:flex;justify-content:space-between;align-items:center;gap:1.5rem;border-top:1px solid #343a42;margin-top:3.5rem;padding-top:2rem}
.adv-footer p{color:#b9bec7;font-size:.85rem;font-weight:700;letter-spacing:1.5px}
.adv-footer h3{color:#fff;margin-top:.4rem}

/* ========== FAQ ========== */
.fq{max-width:780px}
details{border-bottom:1px solid var(--line);padding:1.1rem 0}
summary{font-weight:700;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:1rem}
summary::-webkit-details-marker{display:none}
summary::after{content:"+";font-size:1.5rem;line-height:1;flex:none;transition:transform .3s}
details[open] summary::after{content:"–"}
details p{margin-top:.7rem;color:var(--mut);animation:rise .4s ease both}

/* ========== CONTACT ========== */
.ct{background:var(--ink)}
.ctg{display:grid;grid-template-columns:1fr 1.4fr;gap:3.5rem}
.ct h2{color:#fff;font-size:2.6rem;margin-bottom:1rem}
.ct .adv-label{color:var(--y)}
.ct .in-p{color:#b9bec7;margin-bottom:2rem}
.ic{display:flex;gap:1.1rem;padding:1.2rem;border:1px solid #2d343d;border-radius:12px;margin-bottom:1rem;color:#fff;transition:transform .3s ease, border-color .3s ease}
.ic:hover{border-color:var(--y);transform:translateX(6px)}
.ic i{font-style:normal;background:var(--y);width:46px;height:46px;flex:none;border-radius:10px;display:flex;align-items:center;justify-content:center}
.ic i img{width:22px;height:22px;object-fit:contain}
.ic b{display:block;margin-bottom:.15rem}
.ic p{color:#b9bec7;font-size:.92rem;word-break:break-word}
.ic a{color:#b9bec7;text-decoration:none}
.ic a:hover{color:var(--y)}
.fm{background:#fff;border-radius:16px;padding:2.4rem}
.fm h3{font-size:1.8rem;margin-bottom:1.4rem}
.fr{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem}
.fg{margin-bottom:1.2rem}
label{display:block;font-weight:600;font-size:.88rem;margin-bottom:.4rem}
input,select,textarea{width:100%;padding:13px 15px;border:1px solid var(--line);border-radius:8px;font:inherit;background:var(--paper)}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--yd);box-shadow:0 0 0 3px rgba(255,213,0,.35);background:#fff}
.bad{border-color:#dc2626!important}
textarea{min-height:110px;resize:vertical}
#ok{display:none;margin-top:1rem;padding:1rem;border-radius:8px;background:#ecfdf5;color:#065f46;font-weight:600}
.note{font-size:12px;margin-top:12px;text-align:center;color:var(--mut)}

/* ========== FOOTER ========== */
.ft{background:#20262e;color:#e5e7eb;padding:65px 0 28px}
.fgd{display:grid;grid-template-columns:2fr 1fr 1fr;gap:3rem;margin-bottom:2.5rem}
.ft>.c>.fgd img{height:70px;width:auto;margin-bottom:1rem;filter:brightness(0) invert(1)}
.ft h4{color:var(--y);font-size:1.25rem;margin-bottom:1.2rem}
.ft p,.ft li,.ft li a{color:#d1d5db}
.ft ul{list-style:none}
.ft li{margin-bottom:.6rem}
.ft a{text-decoration:none}
.ft li a:hover{color:var(--y)}
.cr{border-top:1px solid #46505c;color:#cbd5e1;padding-top:22px;text-align:center;font-size:.88rem}

/* ========== FOOTER SOCIALS ========== */
.socials {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-top: 1.5rem;
}

.socials a {
    width: 44px;
    height: 44px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #4a505a;
    border-radius: 50%;
    color: #fff;
    font-size: 1.2rem;
    text-decoration: none;
    transition: all 0.3s ease;
    background: transparent;
}

.socials a:hover {
    background: var(--y);
    border-color: var(--y);
    color: var(--ink);
    transform: translateY(-3px);
    box-shadow: 0 8px 16px rgba(255, 213, 0, 0.2);
}

/* ========== FLOATING BUTTONS ========== */
.wa{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:#25D366;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 8px 20px rgba(0,0,0,.3);z-index:900;transition:.3s}
.wa::before{content:"";position:absolute;inset:0;border-radius:50%;background:#25D366;z-index:-1;animation:pulse 2.2s ease-out infinite}
.wa:hover{transform:scale(1.1)}
.wa img{width:30px;height:30px;object-fit:contain}
@keyframes pulse{to{transform:scale(1.7);opacity:0}}
.up{position:fixed;right:24px;bottom:90px;width:44px;height:44px;border:0;border-radius:50%;background:var(--y);color:var(--ink);font-weight:800;cursor:pointer;opacity:0;pointer-events:none;transition:.3s;z-index:900}
.up.on{opacity:1;pointer-events:auto}

/* ========== SCROLL REVEAL + HOVER LIFT ========== */
.rv0{opacity:0;transform:translateY(30px);transition:opacity .8s ease,transform .6s var(--ease),box-shadow .3s ease,border-color .3s ease,background .3s ease}
.rv0.in{opacity:1;transform:none}
.pr.rv0.in:hover{transform:translateY(-8px)}
.cb.rv0.in:hover{transform:translateY(-5px)}
.wb.rv0.in:hover{transform:translateY(-6px)}
.sp.rv0.in:hover{transform:translateY(-6px);background:rgba(255,213,0,.06)}
.adv-card.rv0.in:hover{transform:translateY(-9px)}

/* ========== RESPONSIVE ========== */
@media(max-width:1200px){
  .c{padding:0 28px}
  .links{gap:1.1rem}
  .links a{font-size:.82rem}
}
@media(max-width:992px){
  section{padding:75px 0}
  .nav{height:70px}
  .brand img{height:50px}
  .mt{display:block;font-size:1.7rem;padding:5px;position:relative;z-index:1002}
  .nav>.btn{display:none}
  .links{position:absolute;top:100%;left:0;right:0;width:100%;background:var(--paper);flex-direction:column;gap:0;padding:0 25px;max-height:0;overflow:hidden;opacity:0;visibility:hidden;z-index:1001;box-shadow:0 12px 20px rgba(0,0,0,.08);transition:max-height .35s ease,opacity .3s ease,padding .3s ease,visibility .3s ease}
  .links.on{max-height:80vh;overflow-y:auto;opacity:1;visibility:visible;padding:15px 25px 22px;border-bottom:3px solid var(--y)}
  .links li{width:100%;border-bottom:1px solid var(--line)}
  .links li:last-child{border-bottom:0}
  .links a{display:block;padding:13px 0;font-size:.95rem}
  .hg{grid-template-columns:1fr 1fr;gap:2rem}
  .hero h1{font-size:clamp(2.5rem,5vw,3.5rem)}
  .ab,.cg,.ctg{grid-template-columns:1fr 1fr;gap:2rem}
  .st{grid-template-columns:repeat(3,1fr)}
  .cp,.wy{grid-template-columns:repeat(2,1fr)}
  .sg{grid-template-columns:repeat(2,1fr);row-gap:2rem}
  .adv-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .adv-card{min-height:320px}
  .pt{min-height:350px}
  .c1{left:8px}.c2{right:8px}
}
@media(max-width:768px){
  section{padding:65px 0}
  .c{padding:0 22px}
  .hg,.ab,.cg,.ctg{grid-template-columns:1fr}
  .hg{gap:4rem}
  .hero{padding:130px 0 75px}
  .hero h1{font-size:clamp(2.5rem,8vw,3.5rem)}
  .hero p{font-size:1rem}
  .hero .card{max-width:480px;margin:0 auto}
  .c1{left:0}.c2{right:0}
  .sh h2,.about-h{font-size:2.2rem}
  .ct h2,.ceo h2{font-size:2rem}
  .st{grid-template-columns:repeat(2,1fr)}
  .advantage-heading h2{font-size:2.5rem}
  .adv-footer{align-items:flex-start;flex-direction:column}
  .ceo .pt{max-width:480px;margin:0 auto}
  .fgd{grid-template-columns:repeat(2,1fr)}
  .fgd>div:first-child{grid-column:1/-1}
  .fr{grid-template-columns:1fr}
  .fm{padding:1.6rem}
  .ticks{grid-template-columns:1fr}
}
@media(max-width:576px){
  section{padding:55px 0}
  .products{padding:60px 0 70px}
  .c{padding:0 18px}
  .nav{height:65px}
  .brand img{height:45px}
  .hero{padding-top:115px}
  .hero h1{font-size:clamp(2.15rem,10vw,2.8rem)}
  .hero p{line-height:1.8}
  .acts{flex-direction:column;width:100%}
  .acts .btn{width:100%}
  .hero .card{padding:1.5rem}
  .chip{padding:8px 12px;font-size:.72rem}
  .chip b{font-size:1.15rem}
  .c1{left:-5px;bottom:15px}.c2{right:-5px;top:15px}
  .sg{gap:1.5rem .8rem}
  .sg b{font-size:2rem}
  .sg span{font-size:.8rem}
  .sh{margin-bottom:2rem}
  .sh h2{font-size:2rem}
  .g4,.cp,.wy,.st,.adv-grid,.fgd{grid-template-columns:1fr}
  .fgd{gap:2rem}
  .fgd>div:first-child{grid-column:auto}
  .pr .ph{height:190px}
  .advantage-heading h2{font-size:2rem}
  .adv-card{min-height:280px;padding:1.6rem}
  .adv-icon{margin:1.5rem 0 1.1rem}
  .adv-footer .btn{width:100%}
  .fm{padding:1.3rem}
  .fm h3{font-size:1.5rem}
  .pt{min-height:300px}
  .wa{width:48px;height:48px;right:15px;bottom:15px}
  .up{right:17px;bottom:75px}
}
@media(max-width:360px){
  .c{padding:0 14px}
  .hero h1{font-size:2rem}
  .tag{font-size:.72rem}
  .sg b{font-size:1.7rem}
  .advantage-heading h2{font-size:1.8rem}
  .adv-card{padding:1.3rem}
}

/* ========== REDUCED MOTION ========== */
@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;animation-delay:0s!important}
  .rv0{opacity:1;transform:none}
  #intro{display:none}
}