:root { --black:#111; --ink:#202020; --gray-900:#414141; --gray-700:#6e6e6e; --gray-500:#a7a7a7; --gray-300:#d9d9d9; --gray-200:#ececec; --gray-100:#f6f6f6; --white:#fff; }
.product-open { background:transparent; border:0; color:inherit; display:block; padding:0; text-align:left; width:100%; }
.product-photo::before { display:none; }.product-photo-image { height:100%; object-fit:contain; position:relative; width:100%; z-index:1; }.product-photo .product-code,.product-photo .demo-badge { z-index:2; }
.color-Rojo { background:#c32026; }.color-Amarillo { background:#f4dc00; }
.color-Verde { background:#16a044; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { background:var(--white); color:var(--black); font-family:Arial, Helvetica, sans-serif; margin:0; }
a { color:inherit; text-decoration:none; }
button,input,select { font:inherit; }
button { cursor:pointer; }
.announcement { background:var(--black); color:var(--white); font-size:10px; letter-spacing:.12em; padding:10px 5vw; text-align:center; text-transform:uppercase; }.announcement span { color:var(--gray-500); margin:0 10px; }
.site-header { align-items:center; display:flex; justify-content:space-between; margin:auto; max-width:1440px; padding:25px 5vw; }.brand { align-items:center; display:inline-flex; gap:10px; }.brand-mark { align-items:center; background:var(--black); color:var(--white); display:inline-flex; font-size:21px; font-weight:900; height:35px; justify-content:center; letter-spacing:-2px; width:35px; }.brand-name { font-size:17px; font-weight:800; letter-spacing:.16em; }.site-header nav { display:flex; gap:34px; margin-left:10%; }.site-header nav a,.header-contact { font-size:11px; }.site-header nav a { color:var(--gray-700); }.site-header nav a:hover { color:var(--black); }.header-contact { border-bottom:1px solid var(--black); padding-bottom:5px; }.header-contact span,.button span,.underlined-link span { font-size:16px; margin-left:7px; }
.hero { display:grid; grid-template-columns:1fr .88fr; margin:auto; max-width:1440px; min-height:680px; padding:60px 5vw 90px; }.hero-content { padding:30px 6vw 0 0; }.eyebrow,.section-number { color:var(--gray-700); font-size:10px; font-weight:700; letter-spacing:.15em; text-transform:uppercase; }.eyebrow { align-items:center; color:var(--black); display:flex; gap:10px; }.eyebrow-line { background:var(--black); display:inline-block; height:1px; width:28px; }.hero h1 { font-size:clamp(65px,8vw,116px); font-weight:500; letter-spacing:-.09em; line-height:.83; margin:34px 0; }.hero h1 span,h2 em { font-family:Georgia, 'Times New Roman', serif; font-style:italic; font-weight:400; }.hero-intro { color:var(--gray-700); font-size:15px; line-height:1.7; max-width:450px; }.hero-actions { align-items:center; display:flex; gap:26px; margin:36px 0 70px; }.button { align-items:center; border:0; display:inline-flex; font-size:11px; font-weight:700; justify-content:center; letter-spacing:.03em; padding:15px 20px; transition:background .2s,transform .2s; }.button:hover { transform:translateY(-2px); }.button-black { background:var(--black); color:var(--white); }.button-black:hover { background:#3b3b3b; }.button-white { background:var(--white); color:var(--black); }.button-ghost { border:1px solid rgba(17,17,17,.5); color:var(--black); }.button-outline { background:transparent; border:1px solid var(--black); color:var(--black); }.underlined-link { border-bottom:1px solid var(--black); font-size:11px; padding-bottom:6px; }.hero-numbers { display:flex; gap:43px; }.hero-numbers div { align-items:center; display:flex; gap:11px; }.hero-numbers strong { font-size:26px; letter-spacing:-.08em; }.hero-numbers span { color:var(--gray-700); font-size:10px; line-height:1.3; }
.hero-visual { background:var(--gray-100); min-height:530px; overflow:hidden; position:relative; }.hero-grid-lines { background-image:linear-gradient(var(--gray-200) 1px,transparent 1px),linear-gradient(90deg,var(--gray-200) 1px,transparent 1px); background-size:45px 45px; inset:0; opacity:.7; position:absolute; }.hero-label { display:grid; gap:6px; position:absolute; text-transform:uppercase; z-index:3; }.hero-label small { color:var(--gray-500); font-size:9px; letter-spacing:.14em; }.hero-label strong { font-size:12px; line-height:1.25; }.hero-label-top { left:8%; top:8%; }.hero-label-bottom { bottom:8%; right:8%; text-align:right; }.hero-locker { align-items:stretch; display:grid; gap:4px; left:20%; position:absolute; width:60%; }.hero-locker span { background:linear-gradient(100deg,rgba(255,255,255,.25),transparent 30%),#cfcfcf; border:1px solid #8c8c8c; position:relative; }.hero-locker span i { color:#707070; font-size:10px; font-style:normal; left:12%; position:absolute; top:8%; }.hero-locker span b { background:#333; height:20px; position:absolute; right:13%; top:48%; width:3px; }.hero-locker-back { filter:brightness(.8); gap:3px; height:275px; left:26%; opacity:.55; top:19%; transform:translate(-20px,-26px) skewY(-2deg); }.hero-locker-front { bottom:15%; grid-template-columns:repeat(3,1fr); height:325px; transform:skewY(1deg); z-index:2; }.hero-locker-front span:nth-child(2) { background:#b8b8b8; }.hero-locker-front span:nth-child(3) { background:#dadada; }
.value-strip { border-bottom:1px solid var(--gray-300); border-top:1px solid var(--gray-300); display:grid; gap:5%; grid-template-columns:1.35fr repeat(3,1fr); margin:auto; max-width:1440px; padding:65px 5vw; }.value-intro h2,.section-heading h2,.contact-banner h2 { font-size:clamp(42px,4vw,63px); font-weight:500; letter-spacing:-.08em; line-height:.9; margin:17px 0 0; }.value-item { border-left:1px solid var(--gray-300); padding-left:18px; }.value-item>span { color:var(--gray-500); font-size:10px; }.value-item h3 { font-size:15px; font-weight:500; letter-spacing:-.03em; margin:23px 0 10px; }.value-item p { color:var(--gray-700); font-size:12px; line-height:1.5; margin:0; max-width:145px; }
.catalog { margin:auto; max-width:1440px; padding:130px 5vw 130px; }.section-heading { align-items:end; display:flex; justify-content:space-between; margin-bottom:62px; }.section-heading>p { color:var(--gray-700); font-size:13px; line-height:1.6; margin:0 0 3px; max-width:300px; }.catalog-tools { align-items:center; border-bottom:1px solid var(--gray-300); border-top:1px solid var(--gray-300); display:flex; gap:16px; padding:14px 0; }.search-field { align-items:center; border:1px solid var(--gray-300); display:flex; gap:10px; max-width:285px; padding:10px 12px; width:100%; }.search-field:focus-within { border-color:var(--black); }.search-field span { font-size:20px; line-height:1; }.search-field input { border:0; font-size:11px; outline:0; width:100%; }.search-field input::placeholder { color:var(--gray-500); }.type-filters { display:flex; flex:1; flex-wrap:wrap; gap:4px; }.type-filters button { background:transparent; border:0; color:var(--gray-700); font-size:11px; padding:10px; }.type-filters button.is-active { background:var(--black); color:var(--white); }.select-field { align-items:center; border-left:1px solid var(--gray-300); display:flex; gap:9px; padding-left:15px; }.select-field span { color:var(--gray-700); font-size:10px; }.select-field select { background:var(--white); border:0; font-size:11px; outline:0; }.catalog-status { color:var(--gray-700); display:flex; font-size:10px; justify-content:space-between; padding:18px 0; }.catalog-status strong { color:var(--black); }.product-grid { display:grid; gap:22px; grid-template-columns:repeat(3,1fr); }.product-card { border:1px solid var(--gray-300); min-width:0; transition:border-color .2s,transform .2s; }.product-card:hover { border-color:var(--black); transform:translateY(-3px); }.product-art { align-items:end; background:var(--gray-100); display:flex; height:260px; justify-content:center; overflow:hidden; position:relative; }.product-art::before { border:1px solid var(--gray-300); border-radius:50%; content:''; height:210px; position:absolute; top:28px; width:210px; }.art-shell { background:#bdbdbd; bottom:23px; box-shadow:12px 13px 13px rgba(0,0,0,.12); display:grid; gap:3px; height:190px; padding:3px; position:relative; width:42%; z-index:1; }.art-door { background:linear-gradient(100deg,rgba(255,255,255,.35),transparent 32%),#d0d0d0; border:1px solid #979797; min-width:0; position:relative; }.tone-dark .art-door { background:#8f8f8f; }.tone-light .art-door { background:#e5e5e5; }.tone-mid .art-door { background:#b5b5b5; }.art-door i { color:#707070; font-size:8px; font-style:normal; left:10%; position:absolute; top:7%; }.art-door b { background:#444; height:16px; position:absolute; right:11%; top:49%; width:3px; }.art-foot { background:#777; bottom:19px; height:11px; position:absolute; transform:skewX(-12deg); width:46%; z-index:2; }.product-code { color:var(--gray-700); font-size:9px; left:14px; letter-spacing:.12em; position:absolute; top:14px; z-index:3; }.demo-badge { background:var(--black); color:var(--white); font-size:9px; padding:6px 8px; position:absolute; right:13px; text-transform:uppercase; top:12px; z-index:3; }.product-info { padding:19px 17px 15px; }.product-title-row { align-items:start; display:flex; justify-content:space-between; }.product-type { color:var(--gray-700); display:block; font-size:9px; letter-spacing:.14em; text-transform:uppercase; }.product-info h3 { font-size:18px; font-weight:500; letter-spacing:-.04em; margin:8px 0 0; }.detail-button { align-items:center; background:transparent; border:1px solid var(--gray-300); border-radius:50%; display:flex; font-size:16px; height:31px; justify-content:center; width:31px; }.detail-button:hover { background:var(--black); color:var(--white); }.product-summary { color:var(--gray-700); font-size:11px; margin:17px 0; }.product-footer { align-items:center; border-top:1px solid var(--gray-300); color:var(--gray-700); display:flex; font-size:10px; gap:8px; padding-top:13px; }.product-footer button { background:transparent; border:0; border-bottom:1px solid var(--black); font-size:10px; margin-left:auto; padding:0 0 3px; }.color-dot { background:var(--gray-700); border:1px solid var(--black); border-radius:50%; display:inline-block; height:10px; width:10px; }.color-Negro { background:#111; }.color-Gris { background:#999; }.color-Blanco { background:#fff; }.color-Grafito { background:#555; }.color-Arena { background:#c6c1b6; }.color-Azul { background:#66717f; }.pagination { align-items:center; display:flex; gap:5px; justify-content:center; margin-top:52px; }.pagination button { background:transparent; border:0; color:var(--gray-700); font-size:11px; height:31px; min-width:31px; }.pagination button.active { background:var(--black); color:var(--white); }.pagination button:disabled { cursor:not-allowed; opacity:.3; }.empty-state { border:1px dashed var(--gray-300); padding:65px 20px; text-align:center; }.empty-state>span { color:var(--gray-700); font-size:28px; }.empty-state h3 { font-size:22px; font-weight:500; margin:8px 0; }.empty-state p { color:var(--gray-700); font-size:12px; }
.contact-banner { align-items:center; background:var(--black); color:var(--white); display:grid; gap:8%; grid-template-columns:.3fr 1fr 1fr; margin:auto; max-width:1440px; padding:85px 5vw; }.contact-banner .section-number { color:var(--gray-500); }.contact-banner h2 { margin-top:17px; }.contact-banner h2 em { color:var(--white); }.contact-copy>p { color:var(--gray-300); font-size:13px; line-height:1.6; margin:0 0 24px; max-width:310px; }.contact-actions { display:flex; flex-wrap:wrap; gap:10px; }.contact-data { color:var(--gray-500); display:block; font-size:10px; line-height:1.6; margin-top:20px; }.contact-mark { align-items:center; border:1px solid var(--gray-700); border-radius:50%; display:flex; flex-direction:column; font-size:24px; font-weight:900; height:125px; justify-content:center; letter-spacing:-.1em; transform:rotate(-12deg); width:125px; }.contact-mark span { font-size:13px; letter-spacing:.05em; }.site-footer { align-items:center; color:var(--gray-700); display:flex; font-size:10px; justify-content:space-between; margin:auto; max-width:1440px; padding:30px 5vw 42px; }.site-footer .brand { color:var(--black); transform:scale(.8); transform-origin:left center; }.site-footer>a:last-child { border-bottom:1px solid var(--black); color:var(--black); padding-bottom:4px; }
.modal-backdrop { align-items:center; background:rgba(0,0,0,.68); display:flex; inset:0; justify-content:center; padding:20px; position:fixed; z-index:10; }.modal-backdrop[hidden] { display:none; }.product-modal { background:var(--white); display:grid; grid-template-columns:.9fr 1.1fr; max-height:90vh; max-width:840px; overflow:auto; position:relative; width:100%; }.modal-close { background:var(--white); border:0; font-size:25px; height:35px; position:absolute; right:14px; top:14px; width:35px; z-index:2; }.modal-product-art { background:var(--gray-100); min-height:490px; position:relative; }.modal-product-art .product-art { height:100%; }.modal-product-art .art-shell { height:65%; width:55%; }.modal-copy { padding:57px 43px 43px; }.modal-copy h2 { font-size:48px; font-weight:500; letter-spacing:-.08em; line-height:.9; margin:13px 0 17px; }.modal-copy>p { color:var(--gray-700); font-size:13px; line-height:1.6; }.spec-list { border-bottom:1px solid var(--gray-300); border-top:1px solid var(--gray-300); margin:28px 0 16px; }.spec-list div { border-bottom:1px solid var(--gray-300); display:flex; justify-content:space-between; padding:11px 0; }.spec-list div:last-child { border-bottom:0; }.spec-list dt { color:var(--gray-700); font-size:10px; }.spec-list dd { font-size:10px; margin:0; }.modal-color { align-items:center; display:flex; font-size:11px; gap:7px; margin-bottom:26px; }
@media (max-width:950px) { .site-header nav { gap:18px; margin-left:0; }.header-contact { display:none; }.hero { grid-template-columns:1fr; }.hero-content { padding-right:0; }.hero-visual { margin-top:35px; }.value-strip { gap:20px; grid-template-columns:1fr 1fr; }.value-item:last-child { border-left:0; padding-left:0; }.product-grid { grid-template-columns:repeat(2,1fr); }.contact-banner { grid-template-columns:.3fr 1fr; }.contact-copy { grid-column:2; } }
@media (max-width:620px) { .announcement { font-size:8px; padding:9px 14px; }.announcement span { margin:0 5px; }.site-header { padding:20px; }.site-header nav { display:none; }.hero { padding:35px 20px 70px; }.hero-content { padding-top:0; }.hero h1 { font-size:72px; }.hero-actions { align-items:start; flex-direction:column; gap:18px; margin-bottom:45px; }.hero-numbers { flex-wrap:wrap; gap:20px; }.hero-visual { margin:20px -20px 0; min-height:410px; }.hero-locker-front { bottom:14%; height:260px; left:18%; width:64%; }.hero-locker-back { height:225px; left:23%; }.value-strip { display:block; padding:58px 20px; }.value-item { border-left:0; border-top:1px solid var(--gray-300); margin-top:25px; padding:23px 0 0; }.value-item h3 { margin-top:12px; }.catalog { padding:80px 20px; }.section-heading { align-items:start; display:block; margin-bottom:38px; }.section-heading>p { margin-top:22px; }.catalog-tools { align-items:stretch; flex-direction:column; }.search-field { max-width:none; }.type-filters { border-bottom:1px solid var(--gray-300); padding-bottom:13px; }.select-field { border-left:0; border-top:1px solid var(--gray-300); justify-content:space-between; padding:13px 0 0; }.product-grid { grid-template-columns:1fr; }.product-art { height:280px; }.catalog-status { line-height:1.4; }.contact-banner { display:block; padding:62px 20px; }.contact-mark { height:90px; margin-bottom:42px; width:90px; }.contact-copy { margin-top:32px; }.site-footer { align-items:start; flex-direction:column; gap:18px; padding:28px 20px 40px; }.product-modal { display:block; max-height:92vh; }.modal-product-art { min-height:290px; }.modal-copy { padding:30px 24px; }.modal-copy h2 { font-size:42px; } }