/* VELA STUDIO — proyecto conceptual de arquitectura e interiores */
.vela-page { --vela-paper:#f3f0e9; --vela-ink:#303830; --vela-muted:#686a60; --vela-line:rgba(48,56,48,.18); color:var(--vela-ink); background:var(--vela-paper); }
.vela-page *, .vela-page *::before, .vela-page *::after { box-sizing:border-box; }
.vela-page h2 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(34px,4.2vw,60px); line-height:1.13; font-weight:400; letter-spacing:-1.5px; }
.vela-page h2 em, .vela-paper em, .vela-browser-title em { font-weight:400; color:#7b806c; }
.vela-page h3 { font-weight:500; }
.vela-page figure { margin:0; }
.vela-page p { line-height:1.85; }
.vela-page a:focus-visible { outline:2px solid #777c65; outline-offset:6px; }
.vela-page [id] { scroll-margin-top:calc(var(--header-height) + 24px); }
.vela-section { padding:110px 0; }
.vela-kicker { text-transform:uppercase; font-size:10px; letter-spacing:2.2px; margin-bottom:25px; font-weight:500; }
.vela-hero { padding:calc(var(--header-height) + 36px) 0 0; }
.vela-eyebrow { display:flex; justify-content:space-between; gap:16px; padding-bottom:22px; border-bottom:1px solid var(--vela-line); font-size:10px; text-transform:uppercase; letter-spacing:1.6px; }
.vela-hero-heading { display:flex; align-items:flex-end; justify-content:space-between; gap:40px; padding:45px 0; }
.vela-hero h1 { font-family:Georgia,'Times New Roman',serif; font-size:clamp(100px,14vw,192px); font-weight:400; line-height:.84; letter-spacing:-8px; }
.vela-hero h1 span { display:block; font-family:var(--font-main); font-size:13px; letter-spacing:14px; line-height:1; padding:23px 0 0 9px; }
.vela-hero-intro { padding-bottom:4px; max-width:340px; }
.vela-hero-intro p { font-size:17px; line-height:1.6; }
.vela-link { display:inline-flex; align-items:center; gap:30px; padding:12px 0; border-bottom:1px solid var(--vela-line); font-size:12px; margin-top:16px; }
.vela-link:hover { color:#79714f; border-color:currentColor; }
.vela-hero-image { position:relative; }
.vela-hero-image > img { width:100%; height:clamp(380px,47vw,650px); object-fit:cover; }
.vela-hero-image figcaption { display:flex; gap:15px; justify-content:space-between; font-size:10px; color:var(--vela-muted); padding:15px 0; letter-spacing:.6px; }
.vela-image-stamp { position:absolute; left:30px; top:30px; font-family:Georgia,serif; font-style:italic; font-size:28px; line-height:1.1; color:#434a38; }
.vela-concept-layout { display:grid; grid-template-columns:1fr 3fr; gap:50px; }
.vela-concept-text { display:grid; grid-template-columns:1fr 1fr; gap:35px; margin-top:36px; font-size:14px; color:var(--vela-muted); }
.vela-disclaimer { margin-top:25px; font-size:11px; color:var(--vela-muted); border-top:1px solid var(--vela-line); padding-top:18px; }
.vela-identity { background:#e9e5dc; }
.vela-section-heading { display:grid; grid-template-columns:1.3fr 1fr; align-items:end; gap:70px; margin-bottom:55px; }
.vela-section-heading > p { color:var(--vela-muted); font-size:14px; max-width:460px; }
.vela-brand-layout { display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.vela-brand-board { background:#303830; color:#e9e5dc; padding:35px; display:flex; flex-direction:column; min-height:470px; position:relative; overflow:hidden; }
.vela-board-caption { font-size:10px; letter-spacing:1.5px; text-transform:uppercase; }
.vela-wordmark { margin:auto 0; text-align:center; font-family:Georgia,serif; font-size:clamp(70px,9vw,125px); line-height:1; letter-spacing:-5px; }
.vela-wordmark small { display:block; font-family:var(--font-main); font-size:10px; letter-spacing:9px; padding-top:15px; padding-left:9px; }
.vela-brand-bottom { display:flex; align-items:end; justify-content:space-between; font-size:10px; letter-spacing:1px; }
.vela-brand-bottom svg { width:54px; height:68px; fill:none; stroke:#a9af96; stroke-width:1; }
.vela-material-board { display:flex; flex-direction:column; gap:25px; background:#d6cebf; padding:35px; justify-content:space-between; }
.vela-paper { background:#f8f5ec; padding:30px; box-shadow:7px 10px 25px #30383012; transform:rotate(-3deg); display:flex; flex-direction:column; gap:28px; }
.vela-paper > span { font-size:9px; letter-spacing:1px; }
.vela-paper strong { font-family:Georgia,serif; font-weight:400; font-size:clamp(28px,3.2vw,44px); line-height:1.15; }
.vela-palette { display:grid; grid-template-columns:repeat(4,1fr); gap:10px; }
.vela-palette i { display:block; height:49px; background:var(--swatch); border:1px solid #30383010; }
.vela-palette span { display:block; font-size:9px; margin-top:8px; }
.vela-spaces-grid { display:grid; grid-template-columns:1fr 1fr; gap:55px 30px; }
.vela-space-wide { grid-column:1/-1; }
.vela-space img { width:100%; height:auto; aspect-ratio:1; object-fit:cover; }
.vela-space-wide img { aspect-ratio:2.1; }
.vela-space figcaption { display:flex; justify-content:space-between; gap:20px; padding-top:18px; align-items:end; }
.vela-space figcaption span { font-size:9px; letter-spacing:1px; text-transform:uppercase; color:var(--vela-muted); }
.vela-space h3 { font-family:Georgia,serif; font-size:28px; margin-top:6px; }
.vela-space figcaption p { font-size:11px; color:var(--vela-muted); max-width:170px; }
.vela-digital { background:#303830; color:#f1eee5; }
.vela-digital-layout { display:grid; grid-template-columns:1fr 1.2fr; gap:75px; align-items:center; }
.vela-digital h2 em { color:#bcc2a9; }
.vela-digital-layout > div > p:not(.vela-kicker) { font-size:14px; margin-top:30px; color:#c2c6b9; }
.vela-feature-list { list-style:none; margin-top:30px; }
.vela-feature-list li { padding:13px 0; border-top:1px solid #ffffff22; font-size:12px; color:#d3d6cc; }
.vela-browser { background:#f3f0e9; color:#303830; border-radius:9px 9px 0 0; overflow:hidden; box-shadow:0 30px 60px #0002; }
.vela-browser-bar { display:flex; justify-content:space-between; gap:10px; padding:10px 18px; font-size:8px; color:#757a6e; border-bottom:1px solid #30383020; }
.vela-browser-bar > span:first-child { letter-spacing:3px; }
.vela-browser-nav { padding:20px 25px; display:flex; align-items:center; justify-content:space-between; gap:10px; }
.vela-browser-nav strong { font-family:Georgia,serif; font-size:24px; font-weight:400; }
.vela-browser-nav > span { font-size:8px; }
.vela-browser-title { font-family:Georgia,serif; font-size:clamp(30px,4vw,50px); line-height:1.1; padding:12px 25px 25px; }
.vela-browser > img { width:calc(100% - 50px); margin:0 25px; height:auto; }
.vela-browser-foot { display:flex; justify-content:space-between; gap:10px; padding:19px 25px; font-size:9px; }
.vela-applications { display:grid; grid-template-columns:1fr 1fr; gap:35px; }
.vela-application-art { height:340px; position:relative; overflow:hidden; background:#ddd5c7; margin-bottom:25px; }
.vela-letter { position:absolute; top:35px; left:18%; width:52%; height:290px; transform:rotate(-8deg); background:#faf6ec; padding:25px; font-family:Georgia,serif; font-size:26px; box-shadow:8px 12px 24px #30383018; }
.vela-letter > span { display:block; margin-top:35px; font-size:18px; }
.vela-letter small { display:block; font-family:var(--font-main); font-size:6px; margin-top:50px; letter-spacing:1px; }
.vela-business-card { position:absolute; bottom:45px; right:12%; padding:22px 40px; background:#303830; color:#e9e5dc; font-family:Georgia,serif; font-size:34px; transform:rotate(8deg); box-shadow:5px 9px 18px #30383022; }
.vela-business-card small, .vela-wall-sign small { display:block; font-family:var(--font-main); font-size:7px; letter-spacing:5px; text-align:center; }
.vela-signage .vela-application-art { display:grid; place-items:center; background:repeating-linear-gradient(0deg,transparent 0 83px,#74694d0c 84px 85px),linear-gradient(120deg,#c1b8a7,#e9dfcb); }
.vela-wall-sign { font-family:Georgia,serif; font-size:65px; z-index:1; color:#4c5343; text-shadow:4px 5px 3px #30383020; }
.vela-wall-sign small { font-size:9px; letter-spacing:8px; }
.vela-sign-shadow { position:absolute; width:200%; height:110px; top:15px; left:-30%; transform:rotate(-35deg); background:#363e3210; }
.vela-application > .vela-kicker { display:block; margin-bottom:10px; }
.vela-application h3 { font-family:Georgia,serif; font-size:28px; margin-bottom:12px; }
.vela-application > p { font-size:13px; color:var(--vela-muted); max-width:470px; }
.vela-closing { position:relative; overflow:hidden; text-align:center; background:#e4e4d9; }
.vela-closing::before { content:""; position:absolute; width:500px; height:660px; border:1px solid #3038300d; border-radius:250px 250px 0 0; left:calc(50% - 250px); top:35px; pointer-events:none; }
.vela-closing .container { position:relative; }
.vela-closing p:not(.vela-kicker) { max-width:550px; margin:25px auto; font-size:14px; color:var(--vela-muted); }
.vela-button { display:inline-flex; align-items:center; gap:30px; background:#303830; color:#fff; padding:17px 25px; font-size:12px; }
.vela-button:hover { background:#4c5645; }
.vela-closing-sign { display:block; margin-top:38px; font-size:9px; letter-spacing:1.5px; text-transform:uppercase; }
@media(max-width:1000px) {
 .vela-concept-layout { grid-template-columns:1fr; gap:10px; }
 .vela-digital-layout { grid-template-columns:1fr; gap:45px; }
 .vela-digital-layout > div:first-child { max-width:680px; }
 .vela-browser { width:100%; max-width:720px; margin:auto; }
 .vela-section-heading { gap:35px; }
 .vela-space figcaption { display:block; }
 .vela-space figcaption p { max-width:none; margin-top:8px; }
}
@media(max-width:768px) {
 .vela-section { padding:70px 0; }
 .vela-eyebrow { font-size:8px; letter-spacing:1px; flex-wrap:wrap; gap:8px; }
 .vela-hero-heading { display:block; padding:35px 0; }
 .vela-hero h1 { font-size:clamp(100px,24vw,155px); letter-spacing:-5px; }
 .vela-hero h1 span { font-size:10px; letter-spacing:10px; padding-top:18px; }
 .vela-hero-intro { margin-top:30px; max-width:none; }
 .vela-hero-intro p { font-size:16px; }
 .vela-hero-image > img { height:440px; object-position:60% center; }
 .vela-image-stamp { font-size:22px; left:18px; top:20px; }
 .vela-hero-image figcaption { flex-wrap:wrap; font-size:8px; gap:5px; }
 .vela-concept-text, .vela-section-heading, .vela-brand-layout, .vela-applications { grid-template-columns:1fr; gap:28px; }
 .vela-section-heading { margin-bottom:35px; }
 .vela-brand-board { min-height:360px; padding:25px; }
 .vela-material-board { padding:30px; }
 .vela-spaces-grid { grid-template-columns:1fr; gap:35px; }
 .vela-space-wide { grid-column:auto; }
 .vela-space-wide img { aspect-ratio:1.2; }
 .vela-application-art { height:320px; }
 .vela-kicker { margin-bottom:18px; }
 .vela-page h2 { letter-spacing:-.8px; }
}
@media(prefers-reduced-motion:reduce) { .vela-page *, .vela-page *::before, .vela-page *::after { scroll-behavior:auto; transition:none; } }