
.header{position:sticky;top:0;z-index:50;min-height:var(--header);background:rgba(255,255,255,.82);backdrop-filter:blur(20px);border-bottom:1px solid rgba(228,228,231,.75);transition:.25s var(--ease)}
.header.is-scrolled{min-height:68px;background:rgba(255,255,255,.96);box-shadow:0 10px 30px rgba(19,15,51,.08)}
.header__inner{min-height:inherit;display:flex;align-items:center;justify-content:space-between;gap:var(--s5)}
.brand{display:flex;align-items:center;gap:var(--s3);text-decoration:none;font-weight:700}.brand img{width:56px;height:56px;object-fit:contain}
.brand small{display:block;font-weight:400;color:var(--panda-gray)}.nav{display:flex;align-items:center;gap:var(--s5)}.nav a{text-decoration:none;font-weight:700}.menu-toggle{display:none!important}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.65rem;min-height:52px;padding:.92rem 1.35rem;border:1px solid transparent;border-radius:var(--rmd);text-decoration:none;font-weight:700;cursor:pointer;transition:.18s var(--ease)}
.btn:hover{transform:translateY(-2px);box-shadow:var(--sh2)}.btn span{transition:.18s}.btn:hover span{transform:translateX(5px)}
.btn--primary{background:var(--panda-navy);color:#fff}.btn--accent{background:var(--panda-yellow);color:var(--panda-navy)}.btn--outline{background:#fff;color:var(--panda-navy);border-color:var(--n300)}
.hero{position:relative;min-height:calc(94vh - var(--header));display:grid;align-items:center;overflow:hidden;background:radial-gradient(circle at 85% 18%,rgba(197,210,3,.18),transparent 26%),radial-gradient(circle at 100% 75%,rgba(0,168,143,.15),transparent 30%),linear-gradient(180deg,#fff,#fafafa)}
.hero__grid{display:grid;grid-template-columns:1fr .95fr;gap:var(--s8);align-items:center}.hero h1{max-width:10.5ch;margin-bottom:var(--s5)}
.hero__visual{position:relative;min-height:560px;border-radius:var(--rxl);background:var(--panda-navy);overflow:hidden;box-shadow:var(--sh3)}
.hero__visual::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 72% 22%,rgba(197,210,3,.55),transparent 23%),radial-gradient(circle at 18% 85%,rgba(241,136,35,.52),transparent 27%),linear-gradient(135deg,rgba(0,168,143,.24),transparent 58%)}
.mock{position:absolute;border-radius:var(--rlg);overflow:hidden;box-shadow:0 24px 55px rgba(0,0,0,.3);transition:.55s var(--ease);background:#fff}.mock img{width:100%;height:100%;object-fit:cover}
.mock--main{left:7%;top:10%;width:58%;height:70%;transform:rotate(-2deg)}.mock--top{right:7%;top:11%;width:29%;height:34%;transform:rotate(3deg)}.mock--bottom{right:6%;bottom:7%;width:37%;height:39%;transform:rotate(-3deg)}
.hero__visual:hover .mock--main{transform:translateY(-8px) rotate(-2.5deg)}.hero__visual:hover .mock--top{transform:translate(3px,-12px) rotate(4deg)}.hero__visual:hover .mock--bottom{transform:translate(4px,-5px) rotate(-2deg)}
.card,.feature-card,.service-card,.case-card,.testimonial,.stat,.faq-item,.process-card,.logo-card,.contact-card,.product-card,.blog-card{height:100%;padding:var(--s5);border:1px solid var(--n200);border-radius:var(--rlg);background:#fff;box-shadow:var(--sh1);transition:.2s var(--ease)}
.card:hover,.feature-card:hover,.service-card:hover,.case-card:hover,.testimonial:hover,.logo-card:hover,.product-card:hover,.blog-card:hover{transform:translateY(-5px);box-shadow:var(--sh2);border-color:rgba(0,168,143,.25)}
.icon{width:52px;height:52px;border-radius:var(--rmd);display:grid;place-items:center;background:var(--green);color:var(--panda-navy);font-weight:700;margin-bottom:var(--s5)}
.card-link{display:inline-flex;gap:.5rem;align-items:center;text-decoration:none;font-weight:700;margin-top:var(--s4)}
.gallery{display:grid;grid-template-columns:1.1fr .9fr .9fr;gap:var(--s4)}.gallery img{width:100%;height:260px;object-fit:cover;border-radius:var(--rlg)}.gallery img:first-child{grid-row:span 2;height:536px}
.logo-strip{display:flex;flex-wrap:wrap;gap:var(--s5);align-items:center}.logo-strip .logo-card{min-width:150px;text-align:center}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4)}.stat strong{display:block;font-size:2.2rem;color:var(--panda-navy)}
.timeline{display:grid;grid-template-columns:repeat(4,1fr);gap:var(--s4)}.timeline .card{border-top:4px solid var(--panda-yellow)}
.cta{position:relative;overflow:hidden;border-radius:var(--rxl);padding:clamp(2rem,5vw,5rem);background:var(--panda-navy);color:#fff;box-shadow:var(--sh3)}.cta::before{content:"";position:absolute;width:420px;height:420px;border-radius:50%;right:-120px;top:-180px;background:radial-gradient(circle,rgba(197,210,3,.6),transparent 65%)}.cta__content{position:relative;z-index:1;max-width:800px}
.form-card{padding:var(--s6);border:1px solid var(--n200);border-radius:var(--rxl);background:#fff;box-shadow:var(--sh2)}.field{display:grid;gap:var(--s2)}.field label{font-weight:700}.input,.select,.textarea{width:100%;padding:.9rem 1rem;border:1px solid var(--n300);border-radius:var(--rmd)}.textarea{min-height:140px;resize:vertical}
.tabs{display:flex;gap:var(--s2);flex-wrap:wrap}.tab{padding:.7rem 1rem;border:1px solid var(--n300);border-radius:var(--rfull);background:#fff;cursor:pointer}.tab.is-active{background:var(--panda-navy);color:#fff}
.accordion-button{width:100%;display:flex;justify-content:space-between;background:none;border:0;padding:0;font-weight:700;text-align:left;cursor:pointer}.accordion-panel{display:none;padding-top:var(--s4)}.faq-item.is-open .accordion-panel{display:block}
.badge{display:inline-flex;padding:.35rem .7rem;border-radius:var(--rfull);background:var(--n100);font-size:var(--xs);font-weight:700}.badge--yellow{background:#fff4cf}.badge--teal{background:#ddf7f2}
.footer{padding-block:var(--s8);background:var(--panda-navy);color:#fff}.whatsapp{position:fixed;right:20px;bottom:20px;width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:var(--panda-green);color:#fff;text-decoration:none;box-shadow:var(--sh2);z-index:45}
@media(max-width:980px){.hero__grid{grid-template-columns:1fr}.hero{padding-block:var(--s10)}.hero__visual{min-height:440px}.timeline,.stats{grid-template-columns:1fr 1fr}}
@media(max-width:850px){.menu-toggle{display:inline-flex!important}.nav{display:none;position:fixed;inset:var(--header) 0 auto 0;background:#fff;padding:var(--s5);flex-direction:column;align-items:stretch;border-bottom:1px solid var(--n200)}.nav.is-open{display:flex}}
@media(max-width:700px){.gallery{grid-template-columns:1fr}.gallery img,.gallery img:first-child{height:260px;grid-row:auto}.timeline,.stats{grid-template-columns:1fr}.hero h1{max-width:none}.hero__visual{min-height:430px}}
