@import url('https://fonts.googleapis.com/css2?family=Kanit:wght@300;400;500;600;700&display=swap');
:root{--ink:#111316;--ink2:#1b1f24;--paper:#fff;--soft:#f5f6f7;--soft2:#eceff2;--line:#dfe3e7;--muted:#69717d;--red:#ed1c24;--red2:#bd1319;--green:#18b36b;--max:1420px;--r:8px;--header:82px;--shadow:none}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Kanit',Arial,sans-serif;font-weight:300;line-height:1.55;overflow-x:hidden}body.dark{--paper:#101215;--soft:#171a1f;--soft2:#22262c;--line:#2d323a;--muted:#9aa2ad;color:#f5f6f7}.wrap{width:min(var(--max),calc(100% - 48px));margin:auto}img{display:block;max-width:100%}a{text-decoration:none;color:inherit}button,input,select,textarea{font:inherit}button{cursor:pointer}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* loading */
.loading{position:fixed;inset:0;z-index:9999;background:var(--paper);display:grid;place-items:center;transition:opacity .35s,visibility .35s}.loading.hide{opacity:0;visibility:hidden}.loader-mark{font-size:42px;font-weight:700;letter-spacing:.02em}.loader-mark span{color:var(--red)}
/* utility/header */
.utility{height:34px;background:#0d0f12;color:#e3e6ea;font-size:12px}.utility .wrap{height:100%;display:flex;align-items:center;justify-content:space-between;gap:20px}.utility-right{display:flex;align-items:center;gap:20px}.utility button{border:0;background:none;color:inherit;padding:0}.header{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--paper) 96%,transparent);backdrop-filter:blur(12px);border-bottom:1px solid var(--line)}.nav{height:var(--header);display:grid;grid-template-columns:230px 1fr auto;align-items:center;gap:24px}.brand{display:flex;align-items:center;gap:9px}.brand-word{font-size:37px;font-weight:700;line-height:.8;letter-spacing:-.05em}.brand-word .a{position:relative}.brand-word .a:after{content:'';position:absolute;height:5px;width:23px;background:var(--red);left:1px;top:18px;transform:skewY(-4deg)}.brand-sub{font-size:11px;line-height:1.05;letter-spacing:.16em;color:#747c87;text-transform:uppercase}.desktop-nav{display:flex;justify-content:center;gap:30px;font-size:15px;font-weight:500}.desktop-nav a,.desktop-nav button{border:0;background:none;color:inherit;padding:29px 0}.desktop-nav a:hover,.desktop-nav button:hover{color:var(--red)}.nav-actions{display:flex;align-items:center;gap:8px}.btn,.icon-btn{border:1px solid var(--line);background:var(--paper);color:inherit;border-radius:var(--r);min-height:44px;padding:0 16px;font-weight:500;display:inline-flex;align-items:center;justify-content:center;gap:8px;transition:.2s}.btn:hover,.icon-btn:hover{border-color:#9ba2aa;transform:translateY(-1px)}.btn.dark{background:var(--ink);border-color:var(--ink);color:#fff}.btn.red{background:var(--red);border-color:var(--red);color:#fff}.btn.red:hover{background:var(--red2)}.icon-btn{width:44px;padding:0}.quote-count{background:var(--red);color:#fff;min-width:22px;height:22px;border-radius:999px;display:inline-grid;place-items:center;font-size:11px}.hamb{display:none}
/* mega */
.mega{position:absolute;left:0;right:0;top:var(--header);background:var(--paper);border-top:1px solid var(--line);border-bottom:1px solid var(--line);opacity:0;visibility:hidden;transform:translateY(-8px);transition:.22s}.mega.open{opacity:1;visibility:visible;transform:none}.mega-grid{display:grid;grid-template-columns:1.2fr .8fr 1.2fr;gap:36px;padding:28px 0 34px}.mega-title{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:14px}.mega-preview{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mega-card{border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.mega-card img{height:110px;width:100%;object-fit:contain;background:#f4f5f6;padding:8px}.mega-card span{display:block;padding:9px 10px;font-size:12px;font-weight:500}.mega-links{display:grid;grid-template-columns:repeat(2,1fr);gap:8px 20px;font-size:13px;color:var(--muted)}.mega-links.three{grid-template-columns:repeat(3,1fr)}.mega-links a:hover{color:var(--red)}
/* mobile drawer */
.drawer{position:fixed;inset:0;z-index:140;pointer-events:none}.drawer.open{pointer-events:auto}.drawer-back{position:absolute;inset:0;background:rgba(0,0,0,.55);opacity:0;transition:.25s}.drawer.open .drawer-back{opacity:1}.drawer-panel{position:absolute;right:0;top:0;bottom:0;width:min(390px,90vw);background:var(--paper);transform:translateX(100%);transition:.25s;padding:26px;display:flex;flex-direction:column;gap:22px}.drawer.open .drawer-panel{transform:none}.drawer-links{display:grid;gap:4px}.drawer-links a{padding:13px 0;border-bottom:1px solid var(--line);font-size:17px;font-weight:500}
/* common */
.section{padding:72px 0}.section.tight{padding:54px 0}.eyebrow{font-size:11px;font-weight:600;letter-spacing:.13em;text-transform:uppercase;color:var(--red);margin-bottom:10px}.section-head{display:grid;grid-template-columns:1fr 1fr;gap:32px;align-items:end;margin-bottom:28px}.section-head h2{font-size:clamp(32px,3.4vw,52px);line-height:1.02;letter-spacing:-.035em;margin:0;font-weight:600}.section-head p{margin:0;color:var(--muted);max-width:600px;justify-self:end;font-size:17px}.muted{color:var(--muted)}.red{color:var(--red)}
/* hero */
.hero{position:relative;min-height:calc(86vh - 34px);overflow:hidden;background:#111;color:#fff}.hero img,.inner-hero img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}.hero:after,.inner-hero:after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,7,9,.92) 0%,rgba(5,7,9,.76) 29%,rgba(5,7,9,.33) 59%,rgba(5,7,9,.08) 100%)}.hero-content{position:relative;z-index:2;min-height:calc(86vh - 34px);display:flex;align-items:center;padding:68px 0 105px}.hero-copy{max-width:760px}.hero h1{font-size:clamp(52px,6vw,92px);line-height:.94;letter-spacing:-.055em;margin:16px 0 22px;font-weight:600}.hero p{max-width:640px;font-size:18px;color:#d6dbe1;margin:0}.hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:28px}.hero .btn.ghost{border-color:rgba(255,255,255,.55);background:transparent;color:#fff}.hero .btn.white{background:#fff;color:#111;border-color:#fff}.hero-proof{position:absolute;left:0;right:0;bottom:0;z-index:3;background:rgba(9,11,13,.52);border-top:1px solid rgba(255,255,255,.18);backdrop-filter:blur(7px)}.proof-grid{display:grid;grid-template-columns:repeat(4,1fr)}.proof{padding:18px 20px;border-right:1px solid rgba(255,255,255,.14)}.proof:last-child{border-right:0}.proof strong{display:block;font-size:28px;font-weight:600}.proof span{font-size:12px;color:#c5cad0}.inner-hero{position:relative;height:430px;overflow:hidden;color:#fff;background:#111}.inner-hero-content{position:relative;z-index:2;height:100%;display:flex;align-items:center}.inner-hero-copy{max-width:680px}.inner-hero h1{font-size:clamp(42px,4.8vw,72px);line-height:.96;letter-spacing:-.045em;margin:12px 0 15px;font-weight:600}.inner-hero p{margin:0;color:#d6dbe1;font-size:17px;max-width:590px}
/* cards/image rules */
.image-clean{border-radius:var(--r);overflow:hidden;background:transparent}.image-clean img{width:100%;height:100%;object-fit:cover;border-radius:var(--r)}.product-image{border-radius:var(--r);overflow:hidden;background:#f3f4f5}.product-image img{width:100%;height:100%;object-fit:contain;padding:6px;border-radius:var(--r)}
.solution-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.solution-card{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper);transition:.18s}.solution-card:hover{border-color:#aeb4bb;transform:translateY(-2px)}.solution-card .media{height:210px}.solution-card .media img{width:100%;height:100%;object-fit:cover}.solution-card .body{padding:18px}.solution-card h3{margin:5px 0 7px;font-size:22px;font-weight:500}.solution-card p{margin:0;color:var(--muted);font-size:14px}.solution-card a{display:inline-flex;margin-top:13px;color:var(--red);font-weight:500;font-size:13px}
/* feature split */
.split{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center}.split.reverse .split-media{order:-1}.split h2{font-size:clamp(36px,4vw,58px);line-height:1;letter-spacing:-.04em;margin:10px 0 18px;font-weight:600}.split p{color:var(--muted);font-size:17px;max-width:640px}.split-media{height:430px}.split-media img{width:100%;height:100%;object-fit:cover;border-radius:var(--r)}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:26px}.metric{border:1px solid var(--line);border-radius:var(--r);padding:18px}.metric strong{font-size:30px;font-weight:600;display:block}.metric span{font-size:12px;color:var(--muted)}
/* product strip */
.product-strip{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.p-card{border:1px solid var(--line);border-radius:var(--r);background:var(--paper);overflow:hidden;min-width:0;display:flex;flex-direction:column;transition:.18s}.p-card:hover{border-color:#aeb4bb;transform:translateY(-2px)}.p-media{height:260px;position:relative;background:#f4f5f6;display:flex;align-items:center;justify-content:center;overflow:hidden}.p-media img{width:100%;height:100%;object-fit:contain;padding:10px}.p-badge{position:absolute;top:10px;left:10px;background:var(--red);color:#fff;border-radius:999px;padding:5px 9px;font-size:10px;font-weight:600;text-transform:uppercase}.fav-btn{position:absolute;top:10px;right:10px;width:34px;height:34px;border-radius:50%;border:1px solid var(--line);background:var(--paper);color:inherit}.fav-btn.active{color:var(--red)}.p-body{padding:16px;display:flex;flex-direction:column;flex:1}.p-type{font-size:10px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}.p-card h3{font-size:21px;line-height:1.15;margin:5px 0 8px;font-weight:500}.p-card p{font-size:13px;color:var(--muted);margin:0 0 14px}.p-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:auto}.p-actions .btn{min-width:0;padding:0 10px;font-size:12px}
/* shop */
.shop-shell{display:grid;grid-template-columns:260px minmax(0,1fr);gap:22px;align-items:start}.filters-panel{position:sticky;top:calc(var(--header) + 14px);border:1px solid var(--line);border-radius:var(--r);padding:18px;background:var(--paper)}.filter-group{padding:13px 0;border-bottom:1px solid var(--line)}.filter-group:last-child{border-bottom:0}.filter-group h4{font-size:14px;margin:0 0 9px;font-weight:500}.check{display:flex;align-items:center;gap:8px;padding:5px 0;color:var(--muted);font-size:13px}.check input{accent-color:var(--red)}.colors{display:flex;gap:8px;flex-wrap:wrap}.color-dot{width:28px;height:28px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #bcc2c9}.shop-main{min-width:0}.shop-toolbar{display:flex;justify-content:space-between;align-items:center;gap:14px;margin-bottom:16px}.shop-toolbar .left{display:flex;align-items:center;gap:8px}.shop-search{height:44px;border:1px solid var(--line);border-radius:var(--r);padding:0 12px;background:var(--paper);color:inherit;width:280px}.shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.shop-grid .p-card{width:100%;min-width:0}.filter-mobile{display:none}
/* product page */
.product-detail{display:grid;grid-template-columns:1.05fr .95fr;gap:44px;align-items:start}.gallery-main{height:540px;background:#f3f4f5;border-radius:var(--r);overflow:hidden}.gallery-main img{width:100%;height:100%;object-fit:contain;padding:12px}.thumbs{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:8px}.thumb{height:100px;border:1px solid var(--line);background:#f4f5f6;border-radius:var(--r);overflow:hidden}.thumb img{width:100%;height:100%;object-fit:contain;padding:5px}.prod-info h1{font-size:clamp(40px,4vw,62px);line-height:.98;letter-spacing:-.04em;margin:8px 0 14px;font-weight:600}.prod-info .lead{font-size:17px;color:var(--muted)}.spec-grid{display:grid;grid-template-columns:1fr 1fr;gap:0;border-top:1px solid var(--line);margin-top:24px}.spec{padding:12px 0;border-bottom:1px solid var(--line);font-size:13px}.spec span{color:var(--muted);display:block;font-size:11px}.variant-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin:18px 0}.qty{display:flex;border:1px solid var(--line);border-radius:var(--r);overflow:hidden;width:max-content}.qty button,.qty input{width:42px;height:44px;border:0;background:var(--paper);text-align:center;color:inherit}.qty input{width:48px}.product-cta{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}
/* quote */
.quote-layout{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:start}.quote-list{display:grid;gap:10px}.quote-item{display:grid;grid-template-columns:110px 1fr auto;gap:15px;align-items:center;border:1px solid var(--line);border-radius:var(--r);padding:10px;min-width:0}.quote-item img{width:110px;height:90px;object-fit:contain;background:#f4f5f6;border-radius:var(--r)}.quote-item h3{margin:0 0 4px;font-size:18px}.quote-summary,.form-card{border:1px solid var(--line);border-radius:var(--r);padding:20px;background:var(--paper)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.field{display:grid;gap:5px}.field.full{grid-column:1/-1}.field label{font-size:12px;font-weight:500}.field input,.field select,.field textarea{width:100%;border:1px solid var(--line);border-radius:var(--r);background:var(--paper);color:inherit;padding:11px 12px;outline:none}.field input:focus,.field textarea:focus,.field select:focus{border-color:var(--red)}.field textarea{min-height:110px;resize:vertical}.error{font-size:11px;color:var(--red);display:none}.field.invalid .error{display:block}.field.invalid input,.field.invalid textarea,.field.invalid select{border-color:var(--red)}
/* projects */
.project-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.project-card{border:1px solid var(--line);border-radius:var(--r);overflow:hidden;background:var(--paper)}.project-card img{width:100%;height:280px;object-fit:cover}.project-card .body{padding:18px}.project-card h3{font-size:26px;margin:5px 0 7px;font-weight:500}.project-meta{font-size:12px;color:var(--muted);display:flex;gap:12px;flex-wrap:wrap}.project-card p{font-size:14px;color:var(--muted)}.project-gallery{display:grid;grid-template-columns:1.3fr .7fr .7fr;grid-template-rows:220px 220px;gap:10px}.project-gallery img{width:100%;height:100%;object-fit:cover;border-radius:var(--r)}.project-gallery img:first-child{grid-row:1/3}.project-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin:20px 0}.fact{border:1px solid var(--line);border-radius:var(--r);padding:15px}.fact span{display:block;font-size:11px;color:var(--muted)}.fact strong{font-size:15px;font-weight:500}
/* clients/testimonials */
.logo-wall{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}.logo-slot{height:96px;display:grid;place-items:center;border-right:1px solid var(--line);border-bottom:1px solid var(--line);color:#9aa1aa;font-size:12px;font-weight:500}.logo-slot:nth-child(5n){border-right:0}.logo-slot:nth-last-child(-n+5){border-bottom:0}.testimonials{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.testimonial{border:1px solid var(--line);border-radius:var(--r);padding:18px}.testimonial p{color:var(--muted);font-size:14px}.testimonial strong{font-weight:500}.stars{color:#f5a623;letter-spacing:2px}
/* contact */
.contact-grid{display:grid;grid-template-columns:.75fr 1.25fr;gap:16px;align-items:stretch}.contact-info{background:#111316;color:#fff;border-radius:var(--r);padding:28px}.contact-info h2{font-size:36px;line-height:1;margin:8px 0 14px}.contact-lines{display:grid;gap:9px;margin-top:18px}.contact-lines a{color:#fff}.map{margin-top:16px;height:340px;border-radius:var(--r);overflow:hidden}.map iframe{width:100%;height:100%;border:0}
/* footer/cta */
.cta-box{background:var(--red);color:#fff;border-radius:var(--r);padding:36px 40px;display:grid;grid-template-columns:1fr auto;gap:22px;align-items:center}.cta-box h2{margin:0 0 5px;font-size:36px;line-height:1;font-weight:600}.cta-box p{margin:0;opacity:.9}.footer{background:#0d0f12;color:#fff;padding:48px 0 18px}.foot-grid{display:grid;grid-template-columns:1.4fr repeat(3,1fr);gap:34px;padding-bottom:28px;border-bottom:1px solid #2a2e35}.foot-grid h4{font-size:12px;text-transform:uppercase;letter-spacing:.1em;margin:0 0 10px}.foot-grid p,.foot-grid a{color:#aeb4bc;font-size:13px}.foot-links{display:grid;gap:6px}.socials{display:flex;gap:8px;margin-top:14px}.socials a{width:34px;height:34px;border:1px solid #333842;border-radius:50%;display:grid;place-items:center}.copyright{display:flex;justify-content:space-between;padding-top:16px;font-size:11px;color:#747c86}
/* fixed */
.guarantee{position:fixed;right:0;top:49%;z-index:90;background:var(--red);color:#fff;border-radius:8px 0 0 8px;padding:14px 8px;writing-mode:vertical-rl;transform:translateY(-50%) rotate(180deg);font-size:11px;font-weight:500;letter-spacing:.05em}.wa{position:fixed;right:20px;bottom:20px;width:56px;height:56px;border-radius:50%;background:#20c86a;color:#fff;display:grid;place-items:center;font-weight:600;z-index:95}.backtop{position:fixed;right:20px;bottom:84px;width:44px;height:44px;border:0;border-radius:50%;background:var(--red);color:#fff;display:grid;place-items:center;opacity:0;pointer-events:none;transition:.2s;z-index:94}.backtop.show{opacity:1;pointer-events:auto}
/* modals/search */
.modal{position:fixed;inset:0;z-index:200;background:rgba(0,0,0,.72);display:none;place-items:center;padding:20px}.modal.open{display:grid}.modal-card{width:min(720px,100%);background:var(--paper);border-radius:var(--r);padding:20px;position:relative}.modal-close{position:absolute;right:12px;top:12px;width:34px;height:34px;border:1px solid var(--line);background:var(--paper);color:inherit;border-radius:50%}.search-input{width:100%;height:54px;border:1px solid var(--line);border-radius:var(--r);padding:0 14px;background:var(--paper);color:inherit;font-size:17px}.search-results{display:grid;gap:8px;margin-top:12px;max-height:420px;overflow:auto}.search-result{display:grid;grid-template-columns:70px 1fr auto;gap:12px;align-items:center;border:1px solid var(--line);border-radius:var(--r);padding:8px}.search-result img{width:70px;height:60px;object-fit:contain;background:#f4f5f6;border-radius:6px}.exit-card{text-align:center;max-width:520px}.exit-card h3{font-size:34px;margin:6px 0}.exit-card p{color:var(--muted)}
/* reveal/skeleton */
.reveal{opacity:0;transform:translateY(14px);transition:.55s ease}.reveal.visible{opacity:1;transform:none}.skeleton{background:linear-gradient(90deg,#eee 25%,#f7f7f7 37%,#eee 63%);background-size:400% 100%;animation:sk 1.2s infinite}@keyframes sk{0%{background-position:100% 0}100%{background-position:0 0}}@keyframes heroIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.hero-copy,.inner-hero-copy{animation:heroIn .7s ease both}
/* responsive */
@media(max-width:1150px){.desktop-nav{display:none}.nav{grid-template-columns:1fr auto}.hamb{display:inline-flex}.solution-grid,.product-strip{grid-template-columns:repeat(2,1fr)}.shop-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.project-facts{grid-template-columns:repeat(2,1fr)}}
@media(max-width:900px){.utility{display:none}.wrap{width:min(var(--max),calc(100% - 30px))}.nav-actions .desktop-only{display:none}.hero{min-height:720px}.hero-content{min-height:720px}.proof-grid{grid-template-columns:repeat(2,1fr)}.proof:nth-child(2){border-right:0}.inner-hero{height:390px}.section-head,.split,.product-detail,.quote-layout,.contact-grid{grid-template-columns:1fr}.split.reverse .split-media{order:0}.split-media{height:340px}.shop-shell{grid-template-columns:1fr}.filters-panel{display:none;position:static}.filters-panel.open{display:block}.filter-mobile{display:inline-flex}.project-grid{grid-template-columns:1fr}.project-gallery{grid-template-columns:1fr 1fr;grid-template-rows:260px 180px 180px}.project-gallery img:first-child{grid-column:1/-1;grid-row:auto}.logo-wall{grid-template-columns:repeat(2,1fr)}.logo-slot:nth-child(5n){border-right:1px solid var(--line)}.logo-slot:nth-child(2n){border-right:0}.logo-slot:nth-last-child(-n+5){border-bottom:1px solid var(--line)}.logo-slot:nth-last-child(-n+2){border-bottom:0}.testimonials{grid-template-columns:1fr}.foot-grid{grid-template-columns:1fr 1fr}.section-head p{justify-self:start}}
@media(max-width:640px){:root{--header:72px}.wrap{width:calc(100% - 24px)}.brand-word{font-size:31px}.brand-sub{font-size:9px}.nav{height:72px}.nav-actions .btn{display:none}.hero{min-height:740px}.hero-content{min-height:740px;padding:54px 0 160px}.hero h1{font-size:48px}.hero p{font-size:16px}.proof-grid{grid-template-columns:1fr 1fr}.proof{padding:14px}.proof strong{font-size:23px}.inner-hero{height:350px}.inner-hero h1{font-size:44px}.section{padding:56px 0}.section-head{grid-template-columns:1fr}.solution-grid,.product-strip,.shop-grid{grid-template-columns:1fr}.solution-card .media{height:220px}.p-media{height:250px}.p-actions{grid-template-columns:1fr}.shop-toolbar{align-items:stretch;flex-direction:column}.shop-search{width:100%}.gallery-main{height:390px}.thumb{height:76px}.spec-grid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr}.quote-item{grid-template-columns:80px 1fr}.quote-item img{width:80px;height:74px}.quote-item>div:last-child{grid-column:2}.form-grid{grid-template-columns:1fr}.field.full{grid-column:auto}.project-gallery{grid-template-columns:1fr;grid-template-rows:none}.project-gallery img,.project-gallery img:first-child{height:220px;grid-column:auto}.project-facts{grid-template-columns:1fr 1fr}.cta-box{grid-template-columns:1fr;padding:28px 22px}.foot-grid{grid-template-columns:1fr}.copyright{flex-direction:column;gap:6px}.guarantee{display:none}.contact-info{padding:22px}.map{height:300px}}


/* ===== v3 visual hardening / deployment-safe overrides ===== */
.loading{display:none!important}
.header{position:sticky;top:0;z-index:100;background:#fff}
body.dark .header{background:#101215}
.nav{height:82px;display:grid;grid-template-columns:220px minmax(0,1fr) auto;align-items:center;gap:20px}
.brand{min-width:0;white-space:nowrap}.brand-word{font-size:36px}.brand-sub{font-size:10px}
.desktop-nav{display:flex;align-items:center;justify-content:center;gap:28px;min-width:0}
.desktop-nav a,.desktop-nav button{appearance:none;-webkit-appearance:none;border:0!important;outline:0;background:transparent!important;padding:30px 0!important;margin:0;color:inherit;font:500 14px/1 'Kanit',Arial,sans-serif;white-space:nowrap;border-radius:0!important;box-shadow:none!important}
.nav-actions{display:flex;align-items:center;justify-content:flex-end;gap:10px;white-space:nowrap}.quote-nav{min-width:145px}
.icon-btn{appearance:none;-webkit-appearance:none}
.hero{min-height:700px}.hero-content{min-height:700px;padding:76px 0 112px}.hero-copy{max-width:700px}.hero h1{max-width:760px}
.inner-hero{height:390px;min-height:390px}.inner-hero-content{height:100%;padding:42px 0;align-items:center}.inner-hero-copy{max-width:650px}
.inner-hero:after{background:linear-gradient(90deg,rgba(5,7,9,.94) 0%,rgba(5,7,9,.78) 30%,rgba(5,7,9,.38) 58%,rgba(5,7,9,.10) 100%)}
.inner-hero-copy .eyebrow{color:#ff2b32}.inner-hero-copy h1{color:#fff}.inner-hero-copy p{color:#e3e7eb}
.section{padding:64px 0}.section.tight{padding:48px 0}
.solution-grid{gap:16px}.solution-card .media{height:190px}.solution-card .media img{border-radius:8px 8px 0 0}
.product-strip{gap:16px}.p-media{height:240px}.p-card{min-width:0}.p-actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}.p-actions .btn{min-width:0;width:100%;padding:0 10px;font-size:13px}
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.project-card{min-width:0}.project-card img{height:230px;object-fit:cover}.project-card .body{padding:16px 18px 18px}.project-card h3{font-size:24px}.project-card p{margin:0 0 14px}
.split-media{height:360px}.split-media img{border-radius:8px}
.logo-wall{grid-template-columns:repeat(5,minmax(0,1fr))}.logo-slot{height:92px}
.contact-grid{grid-template-columns:.72fr 1.28fr}.map{height:320px}
.guarantee{right:0}.wa{right:18px;bottom:18px}
@media(max-width:1150px){.desktop-nav{display:none}.nav{grid-template-columns:1fr auto}.hamb{display:inline-flex}.quote-nav{display:none!important}}
@media(max-width:900px){.hero{min-height:660px}.hero-content{min-height:660px;padding:60px 0 145px}.inner-hero{height:360px;min-height:360px}.project-grid{grid-template-columns:1fr}.logo-wall{grid-template-columns:repeat(2,1fr)}.split-media{height:320px}}
@media(max-width:640px){.nav{height:72px}.brand-word{font-size:30px}.hero{min-height:690px}.hero-content{min-height:690px}.inner-hero{height:330px;min-height:330px}.solution-card .media{height:200px}.project-card img{height:210px}.contact-grid{grid-template-columns:1fr}.map{height:280px}}

/* ===== v4 mobile polish ===== */
.guarantee{display:none!important}
@media(max-width:640px){
  :root{--header:68px}
  body{font-size:16px;line-height:1.45}
  .wrap{width:calc(100% - 24px)}
  .nav{height:68px;grid-template-columns:1fr auto;gap:10px}
  .brand{gap:7px}.brand-word{font-size:28px}.brand-sub{font-size:8px;letter-spacing:.12em}
  .hamb{width:44px;height:44px}
  .hero{min-height:620px}
  .hero-content{min-height:620px;padding:46px 0 140px}
  .hero h1{font-size:44px;line-height:.96;margin:12px 0 16px}
  .hero p{font-size:15px;max-width:92%}
  .hero-actions{margin-top:20px;gap:8px}
  .proof{padding:12px}.proof strong{font-size:21px}.proof span{font-size:10px}
  .inner-hero{height:300px;min-height:300px}
  .inner-hero-content{padding:28px 0}
  .inner-hero h1{font-size:38px;margin:8px 0 10px}
  .inner-hero p{font-size:14px;max-width:90%}
  .section,.section.tight{padding:42px 0}
  .section-head{gap:12px;margin-bottom:22px}
  .section-head h2{font-size:34px;line-height:1.02}
  .section-head p{font-size:15px;line-height:1.5}
  .eyebrow{font-size:10px;margin-bottom:7px}

  /* Product cards: use the complete image edge-to-edge, no artificial side gaps */
  .product-strip,.shop-grid{gap:14px}
  .p-card{border-radius:8px;overflow:hidden}
  .p-media{height:auto!important;aspect-ratio:1/1;width:100%;background:#f1f2f3;padding:0!important}
  .p-media img{display:block;width:100%!important;height:100%!important;object-fit:contain!important;padding:0!important;margin:0!important}
  .p-body{padding:16px 18px 18px}
  .p-type{font-size:10px}.p-card h3{font-size:23px;margin:5px 0 8px}.p-card p{font-size:14px;line-height:1.45;margin-bottom:14px}
  .p-actions{grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;gap:10px}
  .p-actions .btn{min-height:48px;font-size:15px;padding:0 10px}
  .p-badge{top:12px;left:12px;padding:6px 10px}.fav-btn{top:12px;right:12px;width:42px;height:42px}

  /* Shop and filters */
  .shop-toolbar{gap:10px;margin-bottom:14px}.shop-toolbar .left{width:100%;justify-content:space-between}.shop-search{height:46px}
  .filters-panel{padding:14px}.filter-group{padding:10px 0}.check{font-size:14px}

  /* Product page */
  .gallery-main{height:auto!important;aspect-ratio:1/1;background:#f1f2f3}
  .gallery-main img{width:100%;height:100%;object-fit:contain;padding:0}
  .thumb{height:68px}.product-info h1{font-size:34px;line-height:1.05}
  .product-cta{display:grid;grid-template-columns:1fr;gap:8px}.product-cta .btn{width:100%}

  /* Projects / linked products */
  .project-grid{gap:14px}
  .project-card img{height:auto!important;aspect-ratio:16/10;object-fit:cover}
  .project-card .body{padding:15px 16px 17px}.project-card h3{font-size:22px}
  .project-gallery{gap:8px}.project-gallery img,.project-gallery img:first-child{height:auto!important;aspect-ratio:4/3;object-fit:cover}
  .project-facts{gap:8px;margin:14px 0}.fact{padding:12px}

  /* About / solutions / metrics */
  .solution-grid{gap:12px}.solution-card .media{height:auto!important;aspect-ratio:16/10}.solution-card .body{padding:16px}
  .solution-card h3{font-size:21px}.solution-card p{font-size:14px}
  .split{gap:24px}.split-media{height:auto!important;aspect-ratio:4/3}.metrics{gap:8px}.metric{padding:14px}.metric strong{font-size:26px}
  .logo-wall{grid-template-columns:repeat(2,minmax(0,1fr))}.logo-slot{height:82px;font-size:11px}
  .testimonials{gap:10px}.testimonial{padding:16px}

  /* Quote/checkout */
  .quote-layout{gap:18px}
  .quote-item{grid-template-columns:78px minmax(0,1fr);gap:12px;padding:10px}
  .quote-item img{width:78px;height:78px;object-fit:contain;padding:0}
  .quote-item h3{font-size:17px;line-height:1.2}
  .quote-item>button{grid-column:1/-1;width:100%}
  .quote-summary,.form-card{padding:16px}
  .field input,.field select,.field textarea{padding:11px 12px}

  /* Contact */
  .contact-grid{gap:12px}.contact-info{padding:20px}.contact-info h2{font-size:30px}.map{height:260px}

  /* Fixed controls should not collide with content */
  .wa{width:50px;height:50px;right:12px;bottom:12px;font-size:13px}
  .backtop{width:40px;height:40px;right:12px;bottom:70px}
  .cta-box{padding:24px 18px}.cta-box h2{font-size:30px}
  .footer{padding-top:38px}.foot-grid{gap:22px}
}
@media(max-width:380px){
  .p-actions{grid-template-columns:1fr!important}
  .hero h1{font-size:40px}.inner-hero h1{font-size:34px}
  .proof-grid{grid-template-columns:1fr 1fr}
}


/* ===== v5 premium refinement ===== */
.desktop-nav a.active{color:var(--red);position:relative}.desktop-nav a.active:after{content:'';position:absolute;left:0;right:0;bottom:20px;height:2px;border-radius:3px;background:var(--red)}

/* Product images: the photo itself is the visual block, no nested gray frame */
.p-card{background:var(--paper);border-color:color-mix(in srgb,var(--line) 86%,transparent);transition:border-color .28s ease,transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease}
.p-card:hover{transform:translateY(-4px);border-color:color-mix(in srgb,var(--ink) 20%,var(--line));box-shadow:0 16px 38px rgba(17,19,22,.07)}
.p-media{height:auto!important;aspect-ratio:auto!important;display:block;position:relative;background:transparent!important;padding:0!important;overflow:hidden}
.p-media img{display:block;width:100%!important;height:auto!important;aspect-ratio:auto!important;object-fit:contain!important;padding:0!important;margin:0!important;background:transparent!important;transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.p-card:hover .p-media img{transform:scale(1.018)}
.p-badge,.fav-btn{z-index:2}

/* Refined process cards with dimensional icon tiles */
.process-grid{gap:18px}.process-card{border:1px solid rgba(17,19,22,.10);background:linear-gradient(180deg,#fff 0%,#fdfdfd 100%);overflow:visible;box-shadow:0 1px 0 rgba(255,255,255,.85) inset;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,border-color .35s ease}
.process-card:hover{transform:translateY(-7px);border-color:rgba(237,28,36,.22);box-shadow:0 22px 50px rgba(17,19,22,.09)}
.process-card .body{padding:22px}.process-top{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.process-top .eyebrow{margin:5px 0 0}.process-icon{width:58px;height:58px;border-radius:17px;display:grid;place-items:center;color:#111;background:linear-gradient(145deg,#fff 12%,#f4f5f7 56%,#e6e8eb 100%);border:1px solid rgba(17,19,22,.08);box-shadow:0 12px 26px rgba(17,19,22,.10),inset 0 1px 0 #fff;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease,color .35s ease}.process-icon svg{width:32px;height:32px}.process-card:hover .process-icon{transform:translateY(-3px) rotate(-2deg) scale(1.04);color:var(--red);box-shadow:0 18px 32px rgba(17,19,22,.13),inset 0 1px 0 #fff}.process-card h3{font-size:24px;margin:0 0 8px}.process-card p{line-height:1.55}
body.dark .process-card{background:linear-gradient(180deg,#1a1d22,#15181c);border-color:#30353d}.dark .process-icon{background:linear-gradient(145deg,#2b3037,#1a1e23);border-color:#363c45;color:#fff}

/* Product page gallery becomes a clean carousel, not a box + thumbnails */
.product-detail{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:54px;align-items:stretch}
.product-carousel{min-width:0;display:flex;align-items:flex-start}.gallery-main{position:relative;width:100%;height:auto!important;min-height:0!important;background:transparent!important;border-radius:0!important;overflow:hidden;display:flex;align-items:center;justify-content:center}
.gallery-main>img{display:block;width:100%!important;height:auto!important;max-height:680px;object-fit:contain!important;padding:0!important;margin:0!important;border-radius:0!important;transition:opacity .18s ease,transform .42s cubic-bezier(.2,.8,.2,1)}
.gallery-main>img.context-photo{aspect-ratio:1/1;object-fit:cover!important;border-radius:8px!important}.gallery-main>img.switching{opacity:.15;transform:scale(.992)}
.gallery-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:4;width:46px;height:46px;border-radius:50%;border:1px solid rgba(17,19,22,.14);background:rgba(255,255,255,.92);backdrop-filter:blur(8px);color:#111;font-size:30px;line-height:1;display:grid;place-items:center;box-shadow:0 10px 28px rgba(17,19,22,.08);transition:.22s}.gallery-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.05);border-color:rgba(17,19,22,.25)}.gallery-prev{left:14px}.gallery-next{right:14px}.gallery-count{position:absolute;right:14px;bottom:14px;background:rgba(17,19,22,.72);color:#fff;border-radius:999px;padding:6px 10px;font-size:11px;letter-spacing:.04em;backdrop-filter:blur(8px)}
.prod-info{align-self:center;padding:10px 0}.thumbs{display:none!important}

/* Home warranty welcome */
.warranty-pop{position:fixed;inset:0;z-index:500;display:grid;place-items:center;padding:22px;opacity:0;visibility:hidden;pointer-events:none;transition:opacity .28s ease,visibility .28s ease}.warranty-pop.open{opacity:1;visibility:visible;pointer-events:auto}.warranty-pop-back{position:absolute;inset:0;background:rgba(7,8,10,.58);backdrop-filter:blur(6px)}.warranty-pop-card{position:relative;z-index:1;width:min(520px,100%);background:linear-gradient(145deg,#f31f28 0%,#d9141c 100%);color:#fff;border-radius:20px;padding:42px 42px 38px;text-align:center;box-shadow:0 30px 90px rgba(0,0,0,.25);transform:translateY(18px) scale(.985);transition:transform .38s cubic-bezier(.2,.8,.2,1)}.warranty-pop.open .warranty-pop-card{transform:none}.warranty-pop-close{position:absolute;right:16px;top:16px;width:38px;height:38px;border-radius:50%;border:1px solid rgba(255,255,255,.34);background:rgba(255,255,255,.10);color:#fff;font-size:24px;display:grid;place-items:center;line-height:1}.warranty-pop-icon{width:72px;height:72px;border-radius:22px;margin:0 auto 18px;display:grid;place-items:center;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.28);box-shadow:inset 0 1px 0 rgba(255,255,255,.3)}.warranty-pop-icon svg{width:42px;height:42px}.warranty-pop-eyebrow{color:#fff;opacity:.86}.warranty-pop-card h2{font-size:46px;line-height:.95;margin:6px 0 14px;letter-spacing:-.035em}.warranty-pop-card p{font-size:16px;line-height:1.55;max-width:390px;margin:0 auto 24px;color:rgba(255,255,255,.88)}.warranty-pop-cta{background:#fff!important;color:#111!important;border-color:#fff!important;min-height:50px}

/* Delicate global motion */
.solution-card,.metric,.testimonial,.logo-slot,.project-card{transition:transform .32s cubic-bezier(.2,.8,.2,1),border-color .32s ease,box-shadow .32s ease}.metric:hover,.testimonial:hover,.logo-slot:hover{transform:translateY(-3px);box-shadow:0 14px 32px rgba(17,19,22,.055)}

@media(max-width:900px){
  .product-detail{gap:28px}.prod-info{padding:0}.gallery-main>img{max-height:none}.gallery-main>img.context-photo{aspect-ratio:4/3}
}
@media(max-width:640px){
  .p-media img{width:100%!important;height:auto!important;object-fit:contain!important}
  .p-body{padding:15px 16px 17px}
  .product-detail{gap:22px}
  .gallery-main{width:100%;margin:0}.gallery-main>img{width:100%!important;height:auto!important;max-height:none;object-fit:contain!important}.gallery-main>img.context-photo{aspect-ratio:4/3;object-fit:cover!important}
  .gallery-arrow{width:42px;height:42px;font-size:27px}.gallery-prev{left:8px}.gallery-next{right:8px}.gallery-count{right:9px;bottom:9px}
  .process-grid{gap:12px}.process-card .body{padding:18px}.process-icon{width:54px;height:54px;border-radius:16px}.process-icon svg{width:29px;height:29px}
  .warranty-pop-card{padding:36px 22px 28px;border-radius:18px}.warranty-pop-card h2{font-size:38px}.warranty-pop-icon{width:64px;height:64px;border-radius:19px}
  .desktop-nav a.active:after{display:none}
}

/* ===== v6 editorial image refinement ===== */
@media(min-width:901px){
  .solution-card .media{height:auto!important;aspect-ratio:4/3;overflow:hidden;background:transparent}
  .solution-card .media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .55s cubic-bezier(.2,.8,.2,1)}
  .solution-card:hover .media img{transform:scale(1.025)}
  .history-section .split{grid-template-columns:.96fr 1.04fr;align-items:stretch}
  .history-section h2{font-size:clamp(38px,3.15vw,52px);line-height:1.04;max-width:760px}
  .history-section .history-media{height:auto;min-height:560px;align-self:stretch}
  .history-section .history-media img{height:100%;min-height:560px;object-fit:cover;object-position:center;border-radius:8px}
}
@media(max-width:900px){
  .solution-card .media{height:auto!important;aspect-ratio:4/3}
  .solution-card .media img{width:100%;height:100%;object-fit:cover}
  .history-section h2{font-size:clamp(34px,8vw,48px)}
  .history-section .history-media{aspect-ratio:4/3!important;height:auto!important}
  .history-section .history-media img{width:100%;height:100%;object-fit:cover}
}
@media(max-width:640px){
  .solution-card .media{aspect-ratio:4/3!important}
  .solution-card .body{padding:17px}
  .history-section .history-media{aspect-ratio:4/5!important}
}

/* v7 · catálogo conectado al CMS */
.product-price{display:flex;align-items:baseline;gap:10px;margin:14px 0 2px;min-height:28px}.product-price strong{font-size:21px;line-height:1;color:var(--ink)}.product-price .old-price{text-decoration:line-through;color:var(--muted);font-size:13px}.product-price-muted{font-size:13px;color:var(--muted)}.product-price-detail{margin:22px 0 2px}.product-price-detail strong{font-size:32px}.quote-price{font-size:13px;margin-top:7px}.api-status{font-size:12px;color:var(--muted)}

/* =========================================================
   IDEAS v7.10 — CABECERAS DE SECCIÓN CENTRADAS
   Regla editorial global: solo section-head, no heroes.
   ========================================================= */
.section-head {
    display: block !important;
    width: 100% !important;
    max-width: 980px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    margin-bottom: 42px !important;
    text-align: center !important;
}

.section-head > div {
    width: 100% !important;
}

.section-head .eyebrow,
.section-head h2,
.section-head p {
    text-align: center !important;
}

.section-head h2 {
    margin-left: auto !important;
    margin-right: auto !important;
    max-width: 920px !important;
}

.section-head p {
    max-width: 760px !important;
    margin: 16px auto 0 !important;
}

@media (max-width: 768px) {
    .section-head {
        max-width: 100% !important;
        margin-bottom: 28px !important;
        padding-left: 6px !important;
        padding-right: 6px !important;
    }

    .section-head p {
        margin-top: 12px !important;
        max-width: 620px !important;
    }
}

/* =========================================================
   IDEAS v7.11 — Tienda: imágenes 1:1 y cards uniformes
   ========================================================= */
/* El catálogo siempre reserva un cuadrado idéntico por producto.
   La fotografía se adapta dentro del cuadrado sin recortarse ni deformarse. */
.shop-grid{
  align-items:stretch;
}
.shop-grid .p-card{
  height:100%;
}
.shop-grid .p-media{
  width:100%;
  height:auto;
  aspect-ratio:1 / 1;
  min-height:0;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.shop-grid .p-media img{
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  object-position:center;
  padding:14px;
  display:block;
}
.shop-grid .p-body{
  flex:1;
}
.shop-grid .p-actions{
  margin-top:auto;
}

/* Mantener la misma regla en listados de producto reutilizables sin tocar
   la galería de la ficha individual. */
.related-products .p-media,
.product-related .p-media,
.products-grid .p-media{
  width:100%;
  height:auto;
  aspect-ratio:1 / 1;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  overflow:hidden;
}
.related-products .p-media img,
.product-related .p-media img,
.products-grid .p-media img{
  width:100%;
  height:100%;
  object-fit:contain;
  object-position:center;
  padding:14px;
  display:block;
}

@media (max-width: 767px){
  .shop-grid .p-media img,
  .related-products .p-media img,
  .product-related .p-media img,
  .products-grid .p-media img{
    padding:10px;
  }
}

/* =========================================================
   IDEAS v7.12 — Tienda uniforme + paginación de 18 productos
   ========================================================= */
/* Todas las tarjetas reservan exactamente un área 1:1 para la fotografía. */
.shop-grid{
  align-items:stretch;
  grid-auto-rows:1fr;
}
.shop-grid .p-card{
  display:flex;
  flex-direction:column;
  height:100%;
  min-height:0;
}
.shop-grid .p-media{
  width:100%!important;
  height:auto!important;
  aspect-ratio:1 / 1!important;
  flex:0 0 auto;
  display:flex!important;
  align-items:center;
  justify-content:center;
  overflow:hidden;
  background:#fff!important;
}
.shop-grid .p-media img{
  width:100%!important;
  height:100%!important;
  max-width:100%!important;
  max-height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:14px!important;
  margin:0!important;
  background:#fff!important;
  transform:none!important;
}
.shop-grid .p-card:hover .p-media img{transform:none!important}

/* El contenido también conserva una retícula uniforme. */
.shop-grid .p-body{
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;
}
.shop-grid .p-type{
  min-height:16px;
}
.shop-grid .p-card h3{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  min-height:2.3em;
}
.shop-grid .p-card p{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:4;
  overflow:hidden;
  min-height:5.8em;
}
.shop-grid .colors{
  min-height:30px;
  align-items:center;
}
.shop-grid .product-price{
  min-height:34px;
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
}
.shop-grid .p-actions{
  margin-top:auto;
}

/* Paginación del catálogo */
.catalog-load-more-wrap.catalog-pagination-wrap{
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:10px;
  margin-top:34px;
  padding:4px 0 8px;
}
.catalog-pagination{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:7px;
  flex-wrap:wrap;
}
.catalog-page-btn,
.catalog-page-arrow{
  min-width:42px;
  height:42px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  border-radius:10px;
  background:var(--paper);
  color:var(--ink);
  font:inherit;
  font-weight:600;
  cursor:pointer;
  transition:background .2s ease,color .2s ease,border-color .2s ease,transform .2s ease;
}
.catalog-page-btn:hover,
.catalog-page-arrow:hover:not(:disabled){
  border-color:var(--ink);
  transform:translateY(-1px);
}
.catalog-page-btn.active{
  background:var(--ink);
  color:var(--paper);
  border-color:var(--ink);
}
.catalog-page-arrow:disabled{
  opacity:.35;
  cursor:not-allowed;
}
.catalog-page-ellipsis{
  min-width:24px;
  text-align:center;
  color:var(--muted);
}
.catalog-pagination-info{
  color:var(--muted);
  font-size:13px;
}

@media (max-width:640px){
  .shop-grid .p-media img{padding:10px!important}
  .shop-grid .p-card h3{min-height:auto}
  .shop-grid .p-card p{min-height:auto;-webkit-line-clamp:4}
  .catalog-load-more-wrap.catalog-pagination-wrap{margin-top:24px}
  .catalog-pagination{gap:5px;flex-wrap:nowrap;max-width:100%;overflow-x:auto;padding:2px 3px 6px;justify-content:flex-start}
  .catalog-page-btn,.catalog-page-arrow{min-width:40px;height:40px;padding:0 10px;flex:0 0 auto}
}


/* =========================================================
   v8.0 HOME · últimos productos
   Desktop: 8 productos en 4 x 2
   Tablet: 2 columnas
   Mobile: solo 4 productos
========================================================= */
#featuredProducts.product-strip{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:18px!important;
  align-items:stretch;
}

#featuredProducts .p-card{
  width:100%!important;
  min-width:0!important;
  height:100%;
}

#featuredProducts .p-media{
  width:100%!important;
  height:auto!important;
  aspect-ratio:1/1!important;
  background:#f4f5f6!important;
  overflow:hidden!important;
}

#featuredProducts .p-media img{
  width:100%!important;
  height:100%!important;
  object-fit:contain!important;
  object-position:center!important;
  padding:10px!important;
  margin:0!important;
}

#featuredProducts .p-body{
  display:flex;
  flex-direction:column;
  min-height:290px;
  padding:17px 18px 18px;
}

#featuredProducts .p-card h3{
  font-size:21px;
  line-height:1.15;
  margin:6px 0 8px;
}

#featuredProducts .p-card p{
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
  line-height:1.48;
  margin-bottom:14px;
}

#featuredProducts .product-price{
  margin-top:auto;
  margin-bottom:14px;
}

#featuredProducts .home-price-stack{
  display:flex;
  align-items:baseline;
  gap:8px;
  flex-wrap:wrap;
}

#featuredProducts .old-price{
  color:var(--muted);
  text-decoration:line-through;
  font-size:12px;
}

#featuredProducts .p-actions{
  grid-template-columns:minmax(0,1fr) minmax(0,1fr)!important;
  gap:10px!important;
}

#featuredProducts .p-actions .btn{
  width:100%;
  min-width:0;
  min-height:48px;
}

.home-products-store-cta{
  display:flex;
  justify-content:center;
  margin-top:34px;
}

.home-products-store-cta[hidden]{
  display:none!important;
}

.home-products-store-cta .btn{
  min-height:52px;
  padding-inline:28px;
}

@media(max-width:1150px){
  #featuredProducts.product-strip{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
  }
}

@media(max-width:640px){
  #featuredProducts.product-strip{
    grid-template-columns:1fr!important;
    gap:16px!important;
  }

  /* Mobile: mantener solo los 4 productos más recientes */
  #featuredProducts .home-latest-card:nth-child(n+5){
    display:none!important;
  }

  #featuredProducts .p-media{
    aspect-ratio:1/1!important;
  }

  #featuredProducts .p-body{
    min-height:0;
  }

  #featuredProducts .p-actions{
    grid-template-columns:1fr 1fr!important;
  }

  #featuredProducts .p-actions .btn{
    min-height:46px;
    font-size:14px;
  }

  .home-products-store-cta{
    margin-top:26px;
  }

  .home-products-store-cta .btn{
    width:100%;
  }
}


/* =========================================================
   v8.2 HERO ALIGNMENT · desktop
   Desplaza el contenido textual de todos los heroes
   ligeramente hacia la derecha sin alterar mobile/tablet.
========================================================= */
@media (min-width: 901px){
  .hero-copy,
  .inner-hero-copy{
    margin-left:clamp(42px,5vw,96px);
  }
}


/* =========================================================
   v8.3 HERO PROOF ALIGNMENT · desktop
   Alinea el bloque 12+ / 5 años / B2B / 360° con el H1
   desplazándolo exactamente la misma distancia hacia la derecha.
========================================================= */
@media (min-width: 901px){
  .hero-proof .proof-grid{
    padding-left:clamp(42px,5vw,96px);
  }
}


/* =========================================================
   FINAL · Firma de desarrollo
========================================================= */
.copyright .site-credit a{
  color:inherit;
  text-decoration:none;
  font-weight:600;
  transition:color .18s ease;
}
.copyright .site-credit a:hover{
  color:var(--red);
}


/* =========================================================
   v9.0 · MEGA MENU DINÁMICO DE CATEGORÍAS
   Se alimenta del catálogo/API real del CMS.
========================================================= */

.mega.mega-modern{
  padding:0;
  border-top:1px solid var(--line);
  background:rgba(255,255,255,.985);
  box-shadow:0 26px 60px rgba(10,14,20,.13);
  backdrop-filter:blur(18px);
}

.mega-modern-inner{
  padding:28px 0 30px;
}

.mega-modern-top{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:28px;
  margin-bottom:22px;
}

.mega-modern .mega-title{
  margin-bottom:7px;
}

.mega-heading{
  margin:0;
  font-size:clamp(20px,1.65vw,28px);
  line-height:1.12;
  letter-spacing:-.025em;
}

.mega-all-link{
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:0 14px;
  border:1px solid var(--line);
  border-radius:10px;
  font-weight:700;
  font-size:13px;
  white-space:nowrap;
  transition:.18s ease;
}

.mega-all-link:hover{
  border-color:var(--ink);
  background:var(--ink);
  color:#fff;
}

.mega-category-previews{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:14px;
}

.mega-cat-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease;
}

.mega-cat-card:hover{
  transform:translateY(-3px);
  border-color:#cbd0d6;
  box-shadow:0 14px 34px rgba(10,14,20,.10);
}

.mega-cat-image{
  position:relative;
  height:150px;
  overflow:hidden;
  background:#f3f4f5;
}

.mega-cat-image img{
  width:100%;
  height:100%;
  object-fit:contain;
  padding:10px;
  transition:transform .28s ease;
}

.mega-cat-card:hover .mega-cat-image img{
  transform:scale(1.035);
}

.mega-cat-count{
  position:absolute;
  top:10px;
  right:10px;
  padding:6px 8px;
  border-radius:999px;
  background:rgba(17,19,22,.88);
  color:#fff;
  font-size:10px;
  font-weight:700;
  backdrop-filter:blur(6px);
}

.mega-cat-copy{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:14px 15px 15px;
}

.mega-cat-copy strong{
  font-size:14px;
  line-height:1.2;
}

.mega-cat-copy>span{
  color:var(--muted);
  font-size:11px;
  white-space:nowrap;
}

.mega-cat-copy b{
  color:var(--red);
}

.mega-modern-bottom{
  display:grid;
  grid-template-columns:minmax(0,1fr) 330px;
  gap:24px;
  margin-top:22px;
  padding-top:20px;
  border-top:1px solid var(--line);
}

.mega-category-links{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:5px 22px;
}

.mega-category-links a{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  min-height:34px;
  padding:5px 0;
  color:var(--muted);
  font-size:13px;
  transition:color .16s ease,transform .16s ease;
}

.mega-category-links a:hover{
  color:var(--ink);
  transform:translateX(3px);
}

.mega-category-links small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:25px;
  height:21px;
  padding:0 7px;
  border-radius:999px;
  background:var(--soft);
  color:#8b929c;
  font-size:10px;
  font-weight:700;
}

.mega-quick-box{
  display:grid;
  grid-template-columns:42px 1fr;
  gap:12px;
  align-items:center;
  padding:16px;
  border-radius:14px;
  background:#111316;
  color:#fff;
}

.mega-quick-icon{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border-radius:12px;
  background:var(--red);
  font-size:20px;
  font-weight:700;
}

.mega-quick-box strong{
  display:block;
  margin-bottom:3px;
  font-size:13px;
}

.mega-quick-box span{
  display:block;
  color:#aeb4bd;
  font-size:11px;
  line-height:1.45;
}

.mega-quick-box>a{
  grid-column:2;
  width:max-content;
  color:#fff;
  font-size:11px;
  font-weight:700;
  text-decoration:underline;
  text-underline-offset:3px;
}

.mega-loading{
  height:205px;
  border-radius:14px;
}

/* Modo oscuro */
body.dark .mega.mega-modern{
  background:rgba(20,22,25,.985);
  border-color:#2d3035;
}

body.dark .mega-cat-card{
  background:#191b1f;
  border-color:#30333a;
}

body.dark .mega-cat-image{
  background:#22252a;
}

body.dark .mega-category-links a:hover{
  color:#fff;
}

body.dark .mega-category-links small{
  background:#26292e;
}

body.dark .mega-all-link:hover{
  background:#fff;
  color:#111;
}

/* El mega menú es experiencia desktop. En tablet/mobile se usa drawer. */
@media(max-width:1100px){
  .mega-category-previews{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .mega-modern-bottom{
    grid-template-columns:1fr;
  }
  .mega-category-links{
    grid-template-columns:repeat(3,minmax(0,1fr));
  }
}


/* =========================================================
   v10 · MENÚ CLÁSICO DINÁMICO + AJUSTES TIENDA MOBILE
========================================================= */
.mega-classic-dynamic .mega-grid{
  grid-template-columns:1.1fr .9fr 1.2fr;
  gap:34px;
  padding:28px 0 34px;
}
.mega-classic-dynamic .mega-preview{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}
.mega-classic-dynamic .mega-card img{
  height:110px;
  width:100%;
  object-fit:contain;
  background:#f4f5f6;
  padding:8px;
}
.mega-classic-dynamic .mega-card span{
  display:block;
  padding:9px 10px;
  font-size:12px;
  font-weight:600;
}
.mega-classic-dynamic .mega-links{
  align-content:start;
}
.mega-classic-dynamic .mega-links a{
  line-height:1.35;
}
body.dark .mega-classic-dynamic .mega-card img{background:#202328}

@media(max-width:900px){
  .shop-shell{display:block!important}
  .shop-main{width:100%!important}
  .section:has(.shop-shell){padding-top:34px}
}


/* =========================================================
   v11 DEFINITIVE · menú compacto + mobile hardening
========================================================= */

/* Evita desplazamientos laterales accidentales en pantallas pequeñas. */
html,body{
  max-width:100%;
  overflow-x:hidden;
}

/* ---------- Mega menú desktop: más compacto ---------- */
.mega-v11 .mega-grid{
  display:grid;
  grid-template-columns:minmax(520px,1.08fr) minmax(430px,.92fr);
  gap:42px;
  align-items:start;
  padding:24px 0 28px;
}

.mega-v11 .mega-preview{
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.mega-v11 .mega-card{
  min-width:0;
}

.mega-v11 .mega-card img{
  height:105px;
}

.mega-v11-categories-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
}

.mega-v11-categories-head .mega-title{
  margin-bottom:12px;
}

.mega-v11-all{
  margin-top:-6px;
  font-size:11px;
  font-weight:700;
  color:var(--red);
  white-space:nowrap;
}

.mega-v11-category-links{
  display:grid!important;
  grid-template-columns:repeat(2,minmax(0,1fr))!important;
  gap:8px 26px!important;
  font-size:13px!important;
}

.mega-v11-category-links a{
  line-height:1.35;
  min-width:0;
}

/* ---------- Drawer mobile: SIEMPRE completo dentro del viewport ---------- */
@media(max-width:900px){
  .drawer{
    width:100vw!important;
    max-width:100vw!important;
    overflow:hidden!important;
  }

  .drawer-panel{
    left:auto!important;
    right:0!important;
    width:86vw!important;
    max-width:360px!important;
    min-width:0!important;
    height:100dvh!important;
    max-height:100dvh!important;
    padding:22px 20px 28px!important;
    box-sizing:border-box!important;
    overflow-y:auto!important;
    overflow-x:hidden!important;
    overscroll-behavior:contain;
  }

  .drawer-panel .brand{
    min-width:0!important;
  }

  .drawer-panel .brand-word{
    font-size:30px!important;
  }

  .drawer-links{
    width:100%!important;
    min-width:0!important;
  }

  .drawer-links a{
    width:100%!important;
    box-sizing:border-box!important;
    overflow-wrap:anywhere;
  }

  .drawer-panel>.btn{
    width:100%!important;
    max-width:100%!important;
    box-sizing:border-box!important;
    justify-content:center!important;
    flex:0 0 auto!important;
  }

  /* ---------- Garantía: tarjeta realmente centrada y contenida ---------- */
  .warranty-pop{
    width:100vw!important;
    max-width:100vw!important;
    padding:14px!important;
    place-items:center!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  .warranty-pop-card{
    width:calc(100vw - 28px)!important;
    max-width:460px!important;
    min-width:0!important;
    margin:0 auto!important;
    padding:30px 20px 26px!important;
    border-radius:18px!important;
    box-sizing:border-box!important;
    overflow:hidden!important;
  }

  .warranty-pop-card h2{
    width:100%!important;
    max-width:100%!important;
    margin:8px auto 12px!important;
    font-size:clamp(30px,9vw,38px)!important;
    line-height:1.02!important;
    letter-spacing:-.03em!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }

  .warranty-pop-card p{
    width:100%!important;
    max-width:330px!important;
    margin-left:auto!important;
    margin-right:auto!important;
    font-size:15px!important;
  }

  .warranty-pop-cta{
    width:100%!important;
    max-width:300px!important;
    justify-content:center!important;
    box-sizing:border-box!important;
  }
}

/* Pantallas angostas reales */
@media(max-width:390px){
  .drawer-panel{
    width:88vw!important;
    padding-left:17px!important;
    padding-right:17px!important;
  }

  .warranty-pop{
    padding:10px!important;
  }

  .warranty-pop-card{
    width:calc(100vw - 20px)!important;
    padding:26px 16px 22px!important;
  }
}


/* =========================================================
   IDEAS v12.1 — Tienda más compacta
   - Cards aprox. 20% más compactas en altura
   - Descripción limitada a 3 líneas con puntos suspensivos
   ========================================================= */
.shop-grid .p-media{
  aspect-ratio:5 / 4 !important;
}
.shop-grid .p-body{
  padding:14px 14px 15px !important;
}
.shop-grid .p-type{
  font-size:10px;
  line-height:1.3;
  min-height:14px;
}
.shop-grid .p-card h3{
  font-size:18px !important;
  line-height:1.18 !important;
  margin:4px 0 7px !important;
  min-height:2.15em !important;
}
.shop-grid .p-card p{
  font-size:13px !important;
  line-height:1.5 !important;
  margin:0 0 10px !important;
  display:-webkit-box !important;
  -webkit-box-orient:vertical !important;
  -webkit-line-clamp:3 !important;
  line-clamp:3;
  overflow:hidden !important;
  min-height:4.5em !important;
}
.shop-grid .colors{
  min-height:24px !important;
  gap:7px !important;
  margin-bottom:8px;
}
.shop-grid .color-dot{
  width:24px;
  height:24px;
}
.shop-grid .product-price{
  min-height:28px !important;
  margin-bottom:10px;
}
.shop-grid .p-actions{
  gap:8px;
}
.shop-grid .p-actions .btn{
  min-height:52px;
}
@media (max-width: 640px){
  .shop-grid .p-media{
    aspect-ratio:1 / 1 !important;
  }
  .shop-grid .p-body{
    padding:14px 14px 15px !important;
  }
  .shop-grid .p-card h3{
    font-size:19px !important;
  }
  .shop-grid .p-card p{
    -webkit-line-clamp:3 !important;
    min-height:auto !important;
  }
}