/*
Theme Name: Archvision
Theme URI: https://archvision.ing
Author: Archvision
Author URI: https://archvision.ing
Description: Custom one-page WordPress theme for Archvision — architectural visualization studio. Built from a bespoke static design (portfolio, services, contact form with AJAX email delivery).
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: archvision
*/

@import url('https://fonts.googleapis.com/css2?family=Fraunces:opsz,wght@9..144,300;9..144,400;9..144,500&family=Inter:wght@300;400;500;600&family=JetBrains+Mono:wght@400;500&display=swap');

*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{background:#0B0B0A;color:#EAE6DC;font-family:'Inter',sans-serif;font-weight:300;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
::selection{background:#9C5A3C;color:#EAE6DC;}

/* NAV */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;justify-content:space-between;align-items:center;
  padding:24px 5vw;
  transition:background 0.4s, padding 0.4s;
}
nav.scrolled{background:rgba(11,11,10,0.92);backdrop-filter:blur(12px);padding:16px 5vw;}
.nav-logo img{height:108px;transition:height 0.4s;}
nav.scrolled .nav-logo img{height:64px;}
.nav-links{display:flex;gap:36px;list-style:none;}
.nav-links a{color:#EAE6DC;text-decoration:none;font-size:12px;letter-spacing:0.08em;text-transform:uppercase;font-family:'JetBrains Mono',monospace;opacity:0.7;transition:opacity 0.2s;}
.nav-links a:hover{opacity:1;}
@media(max-width:760px){.nav-links{display:none;}}

/* HERO */
.hero{
  height:100vh;position:relative;display:flex;align-items:flex-end;overflow:hidden;
}
.hero-img{
  position:absolute;inset:0;
  background:url('assets/images/hero-bg.jpg') center center/cover no-repeat;
  transform:scale(1.04);
  animation:heroZoom 8s ease forwards;
}
@keyframes heroZoom{to{transform:scale(1);}}
.hero-grad{
  position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(11,11,10,0.2) 0%,rgba(11,11,10,0.05) 40%,rgba(11,11,10,0.88) 100%);
}
.hero-content{position:relative;padding:0 5vw 80px;width:100%;}
.hero-eyebrow{
  font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:0.2em;
  text-transform:uppercase;color:#C99B85;margin-bottom:20px;
  opacity:0;animation:fadeUp 1s ease 0.3s forwards;
}
.hero-title{
  font-family:'Fraunces',serif;font-weight:300;
  font-size:clamp(48px,9vw,124px);line-height:0.96;letter-spacing:-0.01em;
  max-width:1000px;
  opacity:0;animation:fadeUp 1.1s ease 0.5s forwards;
}
.hero-title em{font-style:italic;font-weight:400;color:#C99B85;}
.hero-sub{
  margin-top:28px;max-width:460px;font-size:16px;line-height:1.7;color:#A8A299;
  opacity:0;animation:fadeUp 1s ease 0.75s forwards;
}
.hero-scroll{
  position:absolute;bottom:38px;right:5vw;
  font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.15em;
  color:#A8A299;text-transform:uppercase;
  display:flex;align-items:center;gap:10px;
  opacity:0;animation:fadeUp 1s ease 1s forwards;
}
.scroll-line{width:1px;height:44px;background:linear-gradient(180deg,#C99B85,transparent);}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}

/* SERVICES */
.services{
  display:grid;grid-template-columns:repeat(4,1fr);
  border-top:1px solid rgba(234,230,220,0.1);
  border-bottom:1px solid rgba(234,230,220,0.1);
}
@media(max-width:900px){.services{grid-template-columns:repeat(2,1fr);}}
@media(max-width:760px){.services{grid-template-columns:1fr;}}
.service{padding:52px 5vw;border-right:1px solid rgba(234,230,220,0.1);}
.service:last-child{border-right:none;}
.service-num{font-family:'JetBrains Mono',monospace;font-size:11px;color:#9C5A3C;margin-bottom:16px;letter-spacing:0.1em;}
.service h3{font-family:'Fraunces',serif;font-weight:400;font-size:22px;margin-bottom:10px;}
.service p{font-size:14px;line-height:1.75;color:#A8A299;}

/* PORTFOLIO */
.section-label{
  padding:64px 5vw 32px;
  font-family:'JetBrains Mono',monospace;font-size:11px;
  letter-spacing:0.15em;text-transform:uppercase;color:#9C5A3C;
  border-top:1px solid rgba(234,230,220,0.08);
}

.project{position:relative;overflow:hidden;}
.project-img{
  width:100%;display:block;
  aspect-ratio:16/8;object-fit:cover;
  transition:transform 1.2s cubic-bezier(0.16,1,0.3,1);
}
.project:hover .project-img{transform:scale(1.04);}
.project-info{
  position:absolute;bottom:0;left:0;right:0;
  padding:40px 5vw;
  background:linear-gradient(180deg,transparent,rgba(11,11,10,0.88));
  display:flex;justify-content:space-between;align-items:flex-end;
}
.project-meta{font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:0.1em;color:#C99B85;text-transform:uppercase;margin-bottom:10px;}
.project-title{font-family:'Fraunces',serif;font-weight:400;font-size:clamp(28px,4vw,52px);line-height:1;}
.project-tag{font-family:'JetBrains Mono',monospace;font-size:11px;color:#A8A299;text-align:right;line-height:1.9;}

/* GRID - smaller projects */
.project-grid{display:grid;grid-template-columns:1fr 1fr;}
@media(max-width:760px){.project-grid{grid-template-columns:1fr;}}
.project-grid .project-img{aspect-ratio:4/3;}

/* WHY */
.why{padding:120px 5vw;max-width:1200px;margin:0 auto;}
.why-head{
  font-family:'Fraunces',serif;font-weight:300;
  font-size:clamp(28px,4vw,50px);max-width:660px;line-height:1.18;margin-bottom:80px;
}
.why-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;}
@media(max-width:760px){.why-grid{grid-template-columns:1fr;}}
.why-stat{font-family:'Fraunces',serif;font-size:52px;font-weight:300;color:#C99B85;margin-bottom:12px;}
.why-item h4{font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:0.06em;margin-bottom:10px;}
.why-item p{color:#A8A299;font-size:14px;line-height:1.75;}

/* CONTACT */
.contact{
  border-top:1px solid rgba(234,230,220,0.1);
  padding:120px 5vw 90px;
  display:grid;grid-template-columns:1.1fr 0.9fr;gap:60px;
}
@media(max-width:760px){.contact{grid-template-columns:1fr;}}
.contact-title{font-family:'Fraunces',serif;font-weight:300;font-size:clamp(34px,5.5vw,68px);line-height:1.05;margin-bottom:40px;}
.contact-title em{font-style:italic;color:#C99B85;}
.contact-details{display:flex;flex-direction:column;gap:0;}
.contact-row{padding:18px 0;border-bottom:1px solid rgba(234,230,220,0.1);}
.contact-label{font-family:'JetBrains Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:#7a756b;margin-bottom:4px;}
.contact-value{font-size:17px;}
.contact-value a{color:#EAE6DC;text-decoration:none;transition:color 0.2s;}
.contact-value a:hover{color:#C99B85;}
form{display:flex;flex-direction:column;gap:24px;}
.field{display:flex;flex-direction:column;gap:8px;}
.field label{font-family:'JetBrains Mono',monospace;font-size:10px;text-transform:uppercase;letter-spacing:0.12em;color:#7a756b;}
.field input,.field textarea{
  background:transparent;border:none;border-bottom:1px solid rgba(234,230,220,0.18);
  color:#EAE6DC;font-family:'Inter',sans-serif;font-size:15px;
  padding:10px 0;outline:none;transition:border-color 0.3s;
  width:100%;
}
.field input:focus,.field textarea:focus{border-color:#C99B85;}
.field textarea{resize:none;height:80px;}
.submit-btn{
  margin-top:8px;align-self:flex-start;
  background:none;border:1px solid rgba(234,230,220,0.5);color:#EAE6DC;
  font-family:'JetBrains Mono',monospace;font-size:12px;
  letter-spacing:0.1em;text-transform:uppercase;
  padding:14px 32px;cursor:pointer;transition:all 0.3s;
}
.submit-btn:hover{background:#EAE6DC;color:#0B0B0A;border-color:#EAE6DC;}
.submit-btn:disabled{opacity:0.5;cursor:default;}
.form-response{font-size:13px;line-height:1.6;min-height:1.6em;}
.form-response.success{color:#8fbf8f;}
.form-response.error{color:#e08a7d;}

footer{
  border-top:1px solid rgba(234,230,220,0.08);
  padding:28px 5vw;
  display:flex;justify-content:space-between;align-items:center;
  font-family:'JetBrains Mono',monospace;font-size:11px;color:#5a5550;
}
footer img{height:22px;filter:invert(1);opacity:0.4;}