:root { --ink:#17140f; --ink2:#28231c; --paper:#faf7ef; --cream:#f1eadf; --wood:#78462b; --woodDark:#382218; --brass:#c7a464; --line:rgba(23,20,15,.13); --serif:Georgia,'Times New Roman',serif; --sans:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0;color:var(--ink);background:var(--paper);font-family:var(--sans);overflow-x:hidden; }
a { color:inherit; }
img { display:block;max-width:100%; }
.topbar { height:88px;position:sticky;top:0;z-index:40;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(1.2rem,4vw,4.5rem);border-bottom:1px solid var(--line);background:rgba(250,247,239,.88);backdrop-filter:blur(18px); }
.skipLink{position:fixed;z-index:100;left:1rem;top:-4rem;padding:.7rem 1rem;border-radius:99px;background:#fff}.skipLink:focus{top:1rem}.brand { display:flex;align-items:center;gap:.75rem;text-decoration:none; }.logoShell { width:48px;height:48px;display:grid;place-items:center;flex:0 0 auto; }.logoShell img { width:100%;height:100%;object-fit:contain; }.brandText { display:grid;line-height:1; }.brandText strong { font:600 1rem var(--serif); }.brandText small { margin-top:.35rem;color:#82796e;font-size:.6rem;font-weight:700;letter-spacing:.13em;text-transform:uppercase; }
nav { display:flex;align-items:center;gap:clamp(1rem,2.7vw,2.5rem); } nav a { text-decoration:none;font-size:.79rem;font-weight:750; }.navCta { padding:.7rem 1.05rem;border:1px solid var(--ink);border-radius:99px; }
.hero { min-height:calc(100svh - 88px);display:grid;grid-template-columns:minmax(0,.88fr) minmax(420px,1.12fr);align-items:center;gap:clamp(2rem,5vw,6rem);padding:clamp(3.8rem,7vh,6rem) clamp(1.2rem,4vw,4.5rem); }
.eyebrow { margin:0 0 1rem;color:var(--wood);font-size:.68rem;font-weight:850;letter-spacing:.18em;text-transform:uppercase; }
h1,h2 { margin:0;font-family:var(--serif);font-weight:500;line-height:.97;letter-spacing:-.05em; } h1 { max-width:760px;font-size:clamp(3.2rem,5.9vw,7.2rem); } h1 em,h2 em { color:var(--wood);font-weight:400; }
.lead { max-width:620px;margin:1.6rem 0 0;color:#6b6257;line-height:1.75;font-size:clamp(.95rem,1.25vw,1.12rem); }.heroActions { display:flex;align-items:center;gap:1.35rem;flex-wrap:wrap;margin-top:2rem; }.button { min-height:53px;display:inline-flex;align-items:center;justify-content:center;gap:1rem;padding:.8rem 1.35rem;border-radius:99px;text-decoration:none;font-size:.78rem;font-weight:800;transition:.25s; }.button:hover { transform:translateY(-3px); }.dark { color:var(--cream);background:var(--ink);box-shadow:0 12px 28px rgba(23,20,15,.18); }.textLink { padding-bottom:.25rem;border-bottom:1px solid var(--line);text-decoration:none;font-size:.78rem;font-weight:750; }
.stats { display:flex;gap:clamp(1.5rem,4vw,3.2rem);margin:clamp(2.7rem,6vh,5rem) 0 0; }.stats div { display:grid;gap:.25rem; }.stats dt { order:2;color:#8e8478;font-size:.61rem;font-weight:700;letter-spacing:.11em;text-transform:uppercase; }.stats dd { margin:0;font:600 1.35rem var(--serif); }
.visualWrap { position:relative;perspective:1200px; }.archScene { position:relative;min-height:min(74vh,760px);overflow:hidden;isolation:isolate;border-radius:220px 220px 16px 16px;box-shadow:0 38px 80px rgba(53,35,23,.24);transform:rotateY(-2.5deg) rotateX(1deg);transform-style:preserve-3d; }.archScene:after { content:'';position:absolute;z-index:6;inset:15px;border:1px solid rgba(255,255,255,.52);border-radius:inherit;pointer-events:none; }.archScene img { position:absolute;width:100%;height:100%;object-fit:cover; }.sceneGlow { position:absolute;z-index:2;inset:0;background:linear-gradient(110deg,rgba(19,15,11,.04),rgba(57,35,22,.16)),radial-gradient(circle at 75% 20%,rgba(255,255,255,.2),transparent 32%); }.sceneBadge { position:absolute;z-index:8;left:2rem;bottom:2rem;display:flex;align-items:center;gap:.55rem;padding:.6rem .8rem;border-radius:99px;color:white;background:rgba(20,17,13,.62);backdrop-filter:blur(12px);font-size:.6rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase; }.sceneBadge b { width:6px;height:6px;border-radius:50%;background:#8ee0ae;box-shadow:0 0 0 5px rgba(142,224,174,.16); }
.wireCube { position:absolute;z-index:7;width:70px;height:70px;border:1px solid rgba(255,255,255,.45);transform:rotateX(62deg) rotateZ(38deg) translateZ(15px);animation:float 5s ease-in-out infinite; }.wireCube i { position:absolute;inset:0;border:1px solid rgba(199,164,100,.35);transform:translateZ(20px); }.wireCube i:nth-child(2){transform:translateZ(40px)}.wireCube i:nth-child(3){transform:rotateX(90deg) translateZ(35px)}.cubeOne { right:12%;top:14%; }.cubeTwo { left:13%;bottom:16%;width:42px;height:42px;animation-delay:-2s; }.orbitStamp { position:absolute;z-index:10;right:-20px;bottom:-28px;width:108px;height:108px;display:grid;place-items:center;border-radius:50%;color:var(--cream);background:var(--woodDark);box-shadow:0 18px 38px rgba(35,22,15,.28); }.orbitStamp img { width:58px;height:58px;object-fit:contain;filter:drop-shadow(0 4px 10px rgba(0,0,0,.15)); }.orbitStamp small { position:absolute;width:100%;height:100%;display:grid;place-items:center;color:var(--brass);font-size:.39rem;font-weight:800;letter-spacing:.11em;transform:rotate(24deg); }
@keyframes float { 50% { transform:rotateX(56deg) rotateZ(48deg) translate3d(0,-12px,30px); } }
.ticker { overflow:hidden;padding:1rem 0;color:var(--cream);background:var(--ink); }.ticker>div { width:max-content;display:flex;align-items:center;gap:1.6rem;animation:scroll 20s linear infinite; }.ticker span { font:italic 1rem var(--serif); }.ticker i { width:5px;height:5px;border-radius:50%;background:var(--brass); }@keyframes scroll { to { transform:translateX(-40%); } }
.section { padding:clamp(5rem,10vw,10rem) clamp(1.2rem,4vw,4.5rem); }.sectionHead { display:grid;grid-template-columns:minmax(0,1.35fr) minmax(260px,.65fr);align-items:end;gap:clamp(2rem,7vw,8rem); }.sectionHead h2,.process h2,.contactBand h2 { font-size:clamp(2.7rem,4.8vw,5.4rem); }.sectionHead>p { max-width:510px;margin:0 0 .3rem;color:#70675c;line-height:1.8;font-size:.88rem; }
.serviceGrid { display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin-top:5rem;border:1px solid var(--line);background:var(--line); }.serviceGrid article { min-height:340px;padding:2.1rem;background:var(--paper);transition:.3s; }.serviceGrid article:hover { color:var(--cream);background:var(--ink2); }.serviceGrid article>span { color:var(--wood);font:italic .95rem var(--serif); }.isoShape { width:78px;height:60px;margin:2.3rem auto 2.5rem;border:2px solid var(--brass);background:rgba(199,164,100,.08);transform:rotateX(58deg) rotateZ(-28deg);box-shadow:18px 18px 0 -2px transparent,18px 18px 0 0 var(--brass);transition:.4s; }.serviceGrid article:hover .isoShape { transform:rotateX(54deg) rotateZ(-18deg) translateY(-8px); }.isoShape.tall { height:82px;width:60px; }.isoShape.low { height:48px;width:92px; }.serviceGrid h3 { margin:0 0 .7rem;font:500 1.45rem var(--serif); }.serviceGrid p { margin:0;color:#81786d;line-height:1.7;font-size:.79rem; }.serviceGrid article:hover p { color:#aea496; }
.gallery { color:var(--cream);background:var(--ink); }.gallery .eyebrow { color:var(--brass); }.galleryHead>p { color:#a79d8f; }.galleryGrid { display:grid;grid-template-columns:1fr 1fr;gap:clamp(1.2rem,3vw,3rem);margin-top:4.5rem; }.productCard.second { margin-top:7rem; }.imageFrame { position:relative;overflow:hidden;aspect-ratio:4/3;background:#302a23; }.imageFrame img { width:100%;height:100%;object-fit:cover;transition:.7s; }.productCard:hover img { transform:scale(1.04); }.imageFrame span { position:absolute;right:1rem;bottom:1rem;padding:.55rem .7rem;border-radius:99px;color:var(--ink);background:rgba(250,247,239,.88);backdrop-filter:blur(10px);font-size:.61rem;font-weight:800; }.productMeta { padding-top:1.1rem; }.productMeta small { color:var(--brass);font-size:.6rem;font-weight:850;letter-spacing:.15em;text-transform:uppercase; }.productMeta h3 { margin:.5rem 0 .5rem;font:500 clamp(1.5rem,2.4vw,2.2rem) var(--serif); }.productMeta p { max-width:420px;margin:0;color:#a79d8f;line-height:1.6;font-size:.78rem; }
.process { display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);align-items:center;gap:clamp(3rem,8vw,9rem); }.processVisual { position:relative; }.processVisual img { width:100%;aspect-ratio:4/5;object-fit:cover;border-radius:180px 180px 8px 8px; }.processVisual>span { position:absolute;right:-1.5rem;bottom:2rem;display:flex;align-items:center;gap:.6rem;padding:.75rem .9rem;border-radius:99px;background:var(--paper);box-shadow:0 18px 42px rgba(40,28,19,.18);font-size:.65rem;font-weight:750; }.processVisual i { width:17px;height:17px;border-radius:50%;background:linear-gradient(90deg,var(--woodDark) 33%,var(--cream) 33% 66%,var(--brass) 66%); }.process ol { list-style:none;padding:0;margin:3rem 0 0; }.process li { display:grid;grid-template-columns:45px 1fr;gap:1rem;padding:1.25rem 0;border-top:1px solid var(--line); }.process li:last-child { border-bottom:1px solid var(--line); }.process li>span { color:var(--wood);font:italic .95rem var(--serif); }.process h3 { margin:0 0 .35rem;font:500 1.2rem var(--serif); }.process li p { margin:0;color:#776e63;line-height:1.65;font-size:.8rem; }
.contactBand { min-height:470px;display:grid;grid-template-columns:1fr auto;align-items:center;gap:3rem;padding:clamp(4rem,8vw,8rem) clamp(1.2rem,6vw,7rem);color:var(--cream);background:radial-gradient(circle at 85% 10%,rgba(199,164,100,.13),transparent 28%),var(--woodDark); }.contactBand .eyebrow { color:var(--brass); }.contactBand h2 em { color:var(--brass); }.contactActions { display:grid;justify-items:center;gap:1rem; }.button.light { color:var(--ink);background:var(--cream); }.contactActions>a:last-child { color:#d3c7b5;text-decoration:none;font:500 1.15rem var(--serif); }
footer { display:grid;grid-template-columns:1fr 1.3fr .7fr;gap:2rem;padding:4rem clamp(1.2rem,4vw,4.5rem) 2rem;color:#a99f91;background:var(--ink); }.footerBrand { display:flex;gap:.9rem;color:var(--cream); }.footerBrand strong { font:500 1.2rem var(--serif); }.footerBrand p { margin:.35rem 0;color:#81786d;font-size:.7rem; }footer address { display:grid;gap:.5rem;font-style:normal; }footer address small { color:var(--brass);font-size:.58rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase; }footer address a { max-width:430px;text-decoration:none;line-height:1.6;font-size:.75rem; }.footerRight { display:grid;align-content:start;justify-content:end;gap:1rem;font-size:.69rem; }.footerRight a { text-decoration:none;color:var(--cream); }
.whatsapp { position:fixed;z-index:50;right:clamp(1rem,2.5vw,2rem);bottom:clamp(1rem,2.5vw,2rem);width:60px;height:60px;display:grid;place-items:center;border-radius:50%;background:var(--whatsapp,#1fa162);box-shadow:0 15px 35px rgba(24,119,73,.35);animation:breathe 2.7s ease-in-out infinite; }.whatsapp svg { width:30px;fill:#fff; }.whatsapp>span { position:absolute;inset:0;border:1px solid rgba(31,161,98,.5);border-radius:50%;animation:ring 2.7s ease-out infinite; }@keyframes breathe { 50% { transform:scale(1.09); } }@keyframes ring { 80%,100% { transform:scale(1.7);opacity:0; } }
@media(max-width:980px){ .hero { grid-template-columns:1fr; }.archScene { min-height:650px; }.sectionHead,.process { grid-template-columns:1fr; }.contactBand { grid-template-columns:1fr; }.contactActions { justify-items:start; }footer { grid-template-columns:1fr 1fr; }.serviceGrid { grid-template-columns:1fr; }.serviceGrid article { min-height:250px; } }
@media(max-width:720px){ .topbar { height:auto;min-height:72px;align-items:flex-start;padding-top:.8rem;padding-bottom:.8rem; }.brandText small { display:none; }nav { max-width:54%;flex-wrap:wrap;justify-content:flex-end;gap:.55rem 1rem; }nav a { font-size:.65rem; }nav a:nth-child(2),nav a:nth-child(3){display:none}.navCta { padding:.45rem .7rem; }.hero { min-height:auto;padding-top:3rem; }h1 { font-size:clamp(3rem,15vw,5rem); }.archScene { min-height:520px;border-radius:140px 140px 12px 12px; }.orbitStamp { right:2px; }.stats { justify-content:space-between; }.galleryGrid { grid-template-columns:1fr; }.productCard.second { margin-top:2rem; }.processVisual img { border-radius:120px 120px 8px 8px; }.processVisual>span { right:.6rem; }footer { grid-template-columns:1fr; }.footerRight { justify-content:start; }.contactBand h2 br,.gallery h2 br { display:none; } }
@media(prefers-reduced-motion:reduce){ * { scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important; } }