/*
Theme Name: Valena Studio
Theme URI: https://lovable.dev/
Author: Valena Studio
Description: A minimal, editorial one-page theme for Valena Studio — crafted interiors for visionary spaces. Includes hero, services, selected projects, CTA, interest list form, and footer.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: valena-studio
Tags: one-page, custom-logo, custom-colors, custom-menu, featured-images, translation-ready
*/

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:wght@300;400;500&family=Inter:wght@300;400;500&display=swap');

:root{
  --vs-bg:#0f0c0d;
  --vs-fg:#e3ddd5;
  --vs-muted:#888581;
  --vs-border:#d9d4cb66;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--vs-bg);
  color:var(--vs-fg);
  font-family:'Inter',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;
  font-size:14px;
  line-height:1.6;
  font-weight:300;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto;display:block}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;background:none;border:none;color:inherit}

.vs-display{font-family:'Cormorant Garamond',Georgia,serif;font-weight:300;line-height:1.15}
.vs-muted{color:var(--vs-muted)}
.vs-eyebrow{font-size:10px;letter-spacing:.4em;color:var(--vs-muted);text-transform:uppercase}
.vs-label{font-size:11px;letter-spacing:.35em;text-transform:uppercase}

.vs-btn{
  display:inline-block;
  border:1px solid rgba(26,26,26,.4);
  padding:14px 40px;
  font-size:11px;letter-spacing:.35em;text-transform:uppercase;
  color:var(--vs-fg);background:transparent;
  transition:background .25s ease,color .25s ease;
}
.vs-btn:hover{background:var(--vs-fg);color:var(--vs-bg)}
.vs-btn.is-light{border-color:rgba(255,255,255,.6);color:#fff}
.vs-btn.is-light:hover{background:#fff;color:var(--vs-bg)}

.screen-reader-text{position:absolute;width:1px;height:1px;margin:-1px;padding:0;border:0;clip:rect(0 0 0 0);overflow:hidden}

/* ---------- HERO ---------- */
.vs-hero{position:relative;height:100vh;width:100%;overflow:hidden;color:var(--vs-fg)}
.vs-hero__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vs-hero__overlay{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(20,20,20,.4),rgba(20,20,20,.2),var(--vs-bg))}
.vs-header{position:relative;z-index:10;display:flex;align-items:center;justify-content:space-between;padding:28px 32px}
@media(min-width:768px){.vs-header{padding:28px 64px}}
.vs-brand{font-family:'Cormorant Garamond',serif;line-height:1}
.vs-brand__main{letter-spacing:.25em;font-size:16px}
.vs-brand__sub{margin-top:4px;font-size:10px;letter-spacing:.4em;color:rgba(255,255,255,.7);font-family:'Inter',sans-serif;font-weight:300}
.vs-hero__inner{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:calc(100% - 112px);padding:0 24px}
.vs-hero__title{font-size:clamp(2.5rem,7vw,6rem);letter-spacing:.2em;font-weight:300;margin:0}
.vs-hero__tag{margin-top:16px;font-size:11px;letter-spacing:.35em;text-transform:uppercase}
.vs-hero__lead{margin-top:16px;max-width:420px;font-size:13px;color:rgba(255,255,255,.75)}
.vs-hero__cta{margin-top:24px}
.vs-scroll{position:absolute;left:50%;bottom:32px;transform:translateX(-50%);z-index:10;display:flex;flex-direction:column;align-items:center;gap:12px;color:rgba(255,255,255,.7)}
.vs-scroll__line{display:block;width:1px;height:40px;background:rgba(255,255,255,.4)}

/* ---------- Sections ---------- */
.vs-section{padding:112px 32px}
@media(min-width:768px){.vs-section{padding:160px 64px}}
.vs-container{max-width:1100px;margin:0 auto}

.vs-about{display:grid;gap:64px}
@media(min-width:768px){.vs-about{grid-template-columns:1fr 1fr}}
.vs-about__title{font-size:clamp(2rem,3.5vw,3rem);letter-spacing:.02em;margin:24px 0 0}
.vs-services{list-style:none;margin:48px 0 0;padding:0;max-width:440px}
.vs-services li{display:flex;align-items:center;justify-content:space-between;padding:20px 0;border-top:1px solid var(--vs-border)}
.vs-services li:last-child{border-bottom:1px solid var(--vs-border)}
.vs-services .num{font-size:11px;letter-spacing:.3em;color:var(--vs-muted)}
.vs-services .name{flex:1;padding-left:40px;font-size:11px;letter-spacing:.35em}

/* Projects */
.vs-projects{padding:0 32px 112px}
@media(min-width:768px){.vs-projects{padding:0 64px 160px}}
.vs-projects__grid{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}
@media(min-width:768px){.vs-projects__grid{grid-template-columns:repeat(4,1fr);gap:20px}}
.vs-project{cursor:pointer}
.vs-project__img{position:relative;aspect-ratio:3/4;overflow:hidden}
.vs-project__img img{width:100%;height:100%;object-fit:cover;transition:transform .7s ease}
.vs-project:hover .vs-project__img img{transform:scale(1.05)}
.vs-project__cap{margin-top:20px;border-top:1px solid var(--vs-border);padding-top:16px}
.vs-project__name{font-size:11px;letter-spacing:.3em}
.vs-project__cat{margin-top:8px;font-size:10px;letter-spacing:.35em;color:var(--vs-muted)}
.vs-projects__more{margin-top:64px;display:flex;justify-content:center}

/* CTA */
.vs-cta{position:relative;height:80vh;width:100%;overflow:hidden;color:#fff}
.vs-cta__img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.vs-cta__overlay{position:absolute;inset:0;background:rgba(20,20,20,.3)}
.vs-cta__inner{position:relative;z-index:10;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;height:100%;padding:0 64px}
.vs-cta__title{font-size:clamp(2rem, 3.5vw, 3rem);letter-spacing:.02em;margin:0}

/* Form */
.vs-form-section{padding:112px 32px}
@media(min-width:768px){.vs-form-section{padding:160px 64px}}
.vs-form-wrap{max-width:520px;margin:0 auto;text-align:center}
.vs-form-title{font-size:clamp(1.75rem,3vw,2.5rem);letter-spacing:.02em;margin:16px 0 0}
.vs-form{margin-top:48px;text-align:left;display:flex;flex-direction:column;gap:24px}
.vs-field label{display:block;margin-bottom:8px;font-size:10px;letter-spacing:.35em;text-transform:uppercase;color:var(--vs-muted)}
.vs-field input{
  width:100%;background:transparent;border:none;border-bottom:1px solid var(--vs-border);
  padding:12px 0;font-size:14px;color:var(--vs-fg);font-family:inherit;outline:none;
  transition:border-color .2s ease;
}
.vs-field input:focus{border-color:var(--vs-fg)}
.vs-form__actions{padding-top:16px;text-align:center}
.vs-form__error{color:#b00020;font-size:12px;margin:0}
.vs-success{display:flex;flex-direction:column;align-items:center;gap:24px}
.vs-success__check{width:48px;height:48px;border:1px solid rgba(26,26,26,.3);border-radius:999px;display:flex;align-items:center;justify-content:center}
.vs-success__title{font-size:clamp(1.5rem,2.5vw,2rem);margin:0}

/* Footer */
.vs-footer{border-top:1px solid var(--vs-border);padding:48px 32px}
@media(min-width:768px){.vs-footer{padding:48px 64px}}
.vs-footer__grid{display:grid;gap:40px}
@media(min-width:768px){.vs-footer__grid{grid-template-columns:repeat(4,1fr);align-items:start}}
.vs-footer__brand{font-family:'Cormorant Garamond',serif}
.vs-footer__brand .vs-brand__sub{color:var(--vs-muted)}
.vs-footer__meta,.vs-footer__social,.vs-footer__copy{font-size:12px;color:var(--vs-muted)}
.vs-footer__social div{cursor:pointer}
.vs-footer__social div:hover{color:var(--vs-fg)}
@media(min-width:768px){.vs-footer__copy{text-align:right}}