/*
Theme Name: ARCHITSTUDIO2
Theme URI: https://www.architstudio2.com
Author: ARCHIT Studio
Description: Tema custom per ARCHIT Studio - architettura e interior design.
Version: 1.0
License: GPL v2 or later
Text Domain: architstudio2
*/

/* ===== DA QUI INCOLLA TUTTO IL TUO CSS ESISTENTE ===== */
* { margin:0; padding:0; box-sizing:border-box; }
:root{
  --bg:#f6f4ef; --ink:#2a2622; --muted:#9a938a; --line:#e3ded4;
  --accent:#c1694f; --accent-2:#7d8471;
  --font-display:'Space Grotesk', sans-serif;
  --font-body:'Inter', sans-serif;
}
html{ scroll-behavior:smooth; }
body{ font-family:var(--font-body); background:var(--bg); color:var(--ink);
  overflow-x:hidden; line-height:1.6; cursor:none; }
.container{ max-width:1240px; margin:0 auto; padding:0 6vw; }

/* CURSOR */
.cursor,.cursor-follow{ position:fixed; top:0; left:0; border-radius:50%;
  pointer-events:none; z-index:10000; transform:translate(-50%,-50%); }
.cursor{ width:5px; height:5px; background:var(--accent); transition:background .3s; }
.cursor-follow{ width:34px; height:34px; border:1.5px solid var(--ink); opacity:.5;
  transition:width .35s cubic-bezier(.2,.8,.2,1), height .35s cubic-bezier(.2,.8,.2,1),
  opacity .3s, border-color .3s; }
.cursor-follow.grow{ width:64px; height:64px; opacity:1; border-color:var(--accent); }
@media(max-width:768px){ .cursor,.cursor-follow{ display:none; } body{ cursor:auto; } }

/* PROGRESS */
.progress{ position:fixed; top:0; left:0; height:2px; width:0; background:var(--accent); z-index:9998; }

/* LOADER */
.loader{ position:fixed; inset:0; background:var(--ink); z-index:9999;
  display:flex; align-items:center; justify-content:center; }
.loader-inner{ text-align:center; color:var(--bg); }
.loader-text{ font-family:var(--font-display); font-weight:500; font-size:2rem;
  letter-spacing:.3em; opacity:0; }
.loader-count{ font-size:.8rem; letter-spacing:.2em; margin-top:1rem; opacity:.5; }

/* NAV */
.nav{ position:fixed; top:0; left:0; width:100%; z-index:1000;
  display:flex; justify-content:space-between; align-items:center;
  padding:1.6rem 6vw; transition:.4s; color:#fff; }
.nav.scrolled{ background:var(--bg); color:var(--ink);
  box-shadow:0 1px 24px rgba(0,0,0,.04); padding:1rem 6vw; }
.nav-logo{ display:block; text-decoration:none; }
.nav-logo img{ height:56px; width:auto; display:block; filter:invert(1); transition:filter .4s; }
.nav.scrolled .nav-logo img{ filter:invert(0); }
.nav-menu{ display:flex; gap:2.5rem; list-style:none; }
.nav-menu a{ color:inherit; text-decoration:none; font-size:.82rem;
  letter-spacing:.04em; position:relative; }
.nav-menu a::after{ content:''; position:absolute; bottom:-4px; left:0; width:0;
  height:1.5px; background:var(--accent); transition:.35s; }
.nav-menu a:hover::after{ width:100%; }
.nav-toggle{ display:none; flex-direction:column; gap:5px; cursor:pointer; }
.nav-toggle span{ width:26px; height:1.5px; background:currentColor; transition:.3s; }
.nav-toggle.open span:first-child{ transform:translateY(6.5px) rotate(45deg); }
.nav-toggle.open span:last-child{ transform:translateY(-.5px) rotate(-45deg); }

/* HERO */
.hero{ height:100vh; position:relative; display:flex; align-items:center; overflow:hidden; }
.hero-slides{ position:absolute; inset:0; z-index:-2; }
.hero-slide{ position:absolute; inset:0; background-size:cover; background-position:center;
  opacity:0; transition:opacity 1.4s ease; transform:scale(1.05); }
.hero-slide.active{ opacity:1; }
.hero-overlay{ position:absolute; inset:0; z-index:-1;
  background:linear-gradient(120deg, rgba(42,38,34,.65), rgba(42,38,34,.25)); }
.hero-content{ padding:0 6vw; }
.hero-title{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(2.8rem,8.5vw,7.5rem); line-height:1; color:#fff; letter-spacing:-.02em; }
.hero-title .line{ display:block; overflow:hidden; }
.hero-title em{ font-style:normal; color:var(--accent); }
.hero-sub{ color:rgba(255,255,255,.82); margin-top:1.5rem; font-size:.9rem; letter-spacing:.06em; }
.hero-scroll{ position:absolute; bottom:2rem; left:6vw; color:#fff; font-size:.72rem;
  letter-spacing:.15em; display:flex; align-items:center; gap:.6rem; }
.hero-scroll i{ width:1px; height:34px; background:#fff; display:block; transform-origin:top;
  animation:scrollLine 2s infinite; }
@keyframes scrollLine{ 0%{transform:scaleY(0);}50%{transform:scaleY(1);}100%{transform:scaleY(0);} }
.hero-year{ position:absolute; bottom:2rem; right:6vw; color:rgba(255,255,255,.7);
  font-size:.72rem; letter-spacing:.15em; }

/* SECTIONS */
section{ padding:9rem 0; }
.label{ position:relative; display:inline-block; font-size:.72rem; letter-spacing:.22em;
  color:var(--accent); text-transform:uppercase; margin-bottom:2.5rem; font-weight:500; }
.label::before{ content:attr(data-num); position:absolute; left:-.2rem; top:-2.8rem;
  font-family:var(--font-display); font-size:3.5rem; font-weight:600;
  color:var(--line); letter-spacing:0; z-index:0; opacity:.8; }
/* numero filigrana sulla sezione scura (contact) */
.contact .label{ color:var(--accent); }
.contact .label::before{ color:rgba(246,244,239,.12); }

.section-title{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(2rem,4.5vw,3.4rem); line-height:1.08; margin-bottom:2rem; letter-spacing:-.02em; }
.section-title.big{ font-size:clamp(2.6rem,7vw,5.5rem); }
.section-text{ max-width:640px; color:#5a544c; font-size:1.05rem; }

/* STATS */
.stats{ display:flex; gap:4rem; margin-top:4rem; flex-wrap:wrap; }
.stat .num{ font-family:var(--font-display); font-weight:500; font-size:3.4rem; display:block; }
.stat small{ color:var(--muted); letter-spacing:.05em; }

/* PROJECTS */
.filters{ display:flex; gap:1rem; margin-top:1rem; flex-wrap:wrap; }
.filter{ background:none; border:1px solid var(--line); padding:.5rem 1.2rem; border-radius:40px;
  font-family:inherit; font-size:.8rem; letter-spacing:.03em; cursor:none; transition:.3s; color:var(--ink); }
.filter:hover{ border-color:var(--accent); color:var(--accent); }
.filter.active{ background:var(--accent); color:#fff; border-color:var(--accent); }
.project-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2.5rem; padding:4rem 6vw 0; }
.project{ cursor:none; text-decoration:none; color:inherit; }
.project.hide{ display:none; }
.project-img{ position:relative; aspect-ratio:4/3; border-radius:2px; overflow:hidden;
  transition:transform .7s cubic-bezier(.2,.8,.2,1); }
.project-photo{ background-size:cover; background-position:center; }
.project:hover .project-img{ transform:scale(1.03); }
.project-num{ position:absolute; top:1rem; left:1.2rem; color:#fff;
  font-family:var(--font-display); font-size:1.05rem; text-shadow:0 1px 8px rgba(0,0,0,.3); }
.project-info{ display:flex; justify-content:space-between; align-items:baseline; margin-top:1rem; }
.project-info h3{ font-family:var(--font-display); font-weight:500; font-size:1.5rem; }
.project-info span{ color:var(--muted); font-size:.8rem; letter-spacing:.05em; }

/* VIEW ALL BUTTON */
.view-all{ display:inline-flex; align-items:center; gap:.7rem;
  font-family:var(--font-display); font-weight:500; font-size:.95rem;
  color:var(--ink); text-decoration:none; letter-spacing:.02em;
  border:1px solid var(--line); padding:.9rem 1.8rem; border-radius:40px;
  transition:background .35s, border-color .35s, color .35s; cursor:none; }
.view-all .arrow{ display:inline-block; transition:transform .35s cubic-bezier(.2,.8,.2,1); }
.view-all:hover{ background:var(--accent); border-color:var(--accent); color:#fff; }
.view-all:hover .arrow{ transform:translateX(6px); }

/* SERVICES */
.services-list{ margin-top:2rem; border-top:1px solid var(--line); }
.service{ padding:2.5rem 0; border-bottom:1px solid var(--line);
  display:grid; grid-template-columns:auto 1.4fr 2fr; gap:2rem; align-items:baseline;
  transition:padding-left .4s; }
.service:hover{ padding-left:1.5rem; }
.service:hover h3{ color:var(--accent); }
.service-idx{ color:var(--muted); font-size:.85rem; }
.service h3{ font-family:var(--font-display); font-weight:500; font-size:1.6rem; transition:color .3s; }
.service p{ color:#5a544c; }

/* CONTACT */
.contact{ background:var(--ink); color:var(--bg); }
.contact .section-title{ color:var(--bg); }
.contact-wrap{ display:grid; grid-template-columns:1.3fr 1fr; gap:5rem; margin-top:3rem; }
.contact-form .field{ position:relative; margin-bottom:2rem; }
.contact-form input,.contact-form textarea{ width:100%; background:none; border:none;
  border-bottom:1px solid rgba(246,244,239,.25); padding:.8rem 0; color:var(--bg);
  font-family:inherit; font-size:1rem; resize:none; }
.contact-form input:focus,.contact-form textarea:focus{ outline:none; border-color:var(--accent); }
.contact-form label{ position:absolute; left:0; top:.8rem; color:rgba(246,244,239,.5);
  pointer-events:none; transition:.3s; }
.contact-form input:focus+label,.contact-form input:valid+label,
.contact-form textarea:focus+label,.contact-form textarea:valid+label{
  top:-.9rem; font-size:.72rem; letter-spacing:.1em; color:var(--accent); }
.btn{ background:var(--accent); color:#fff; border:none; padding:1rem 2.4rem; border-radius:40px;
  font-family:inherit; font-size:.9rem; cursor:none; transition:.3s; letter-spacing:.03em; }
.btn:hover{ transform:translateY(-2px); box-shadow:0 10px 30px rgba(193,105,79,.35); }
.form-note{ margin-top:1rem; font-size:.85rem; color:var(--accent-2); min-height:1.2em; }
.contact-info{ display:flex; flex-direction:column; gap:.6rem; }
.contact-info a,.contact-info span{ color:rgba(246,244,239,.85); text-decoration:none;
  font-size:1.1rem; width:fit-content; }
.contact-info a:hover{ color:var(--accent); }
.social{ display:flex; gap:1.5rem; margin-top:1.5rem; }
.social a{ font-size:.85rem; letter-spacing:.05em; }
.footer{ display:flex; justify-content:space-between; padding:3rem 6vw 0;
  color:rgba(246,244,239,.5); font-size:.8rem; }
.to-top{ cursor:none; }

/* REVEAL */
.reveal{ opacity:0; transform:translateY(40px);
  transition:opacity .9s ease, transform .9s cubic-bezier(.2,.8,.2,1); }
.reveal.in{ opacity:1; transform:none; }

/* ===== PROJECT DETAIL PAGE ===== */
.project-page{ background:var(--bg); }
.proj-hero{ position:relative; height:100vh; overflow:hidden; }
.proj-hero-media{ position:absolute; inset:-10%; z-index:0; background-size:cover; background-position:center; }
.proj-hero-overlay{ position:absolute; inset:0; z-index:1; display:flex; align-items:flex-end;
  padding-bottom:8vh; background:linear-gradient(to top,rgba(0,0,0,.55),transparent 55%); }
.proj-cat{ color:var(--accent); font-size:.8rem; letter-spacing:.2em; text-transform:uppercase;
  display:block; margin-bottom:1rem; }
.proj-title{ font-family:var(--font-display); font-weight:500; color:#fff;
  font-size:clamp(3rem,11vw,9rem); line-height:.92; letter-spacing:-.02em; }
.proj-title .line{ display:block; overflow:hidden; }
.proj-title em{ font-style:normal; color:var(--accent); }
.proj-meta{ padding:4rem 0; border-bottom:1px solid var(--line); }
.meta-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:2rem; }
.meta-grid small{ color:var(--muted); font-size:.7rem; letter-spacing:.18em;
  text-transform:uppercase; display:block; margin-bottom:.6rem; }
.meta-grid p{ font-family:var(--font-display); font-weight:500; font-size:1.25rem; }
.proj-intro{ padding:8rem 0 5rem; }
.proj-lead{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(1.8rem,4vw,3rem); line-height:1.15; margin:1.5rem 0 2rem; letter-spacing:-.01em; }
.proj-fullimg{ height:80vh; margin:0 6vw; border-radius:2px; background-size:cover; background-position:center; }
.proj-split{ padding:8rem 0; }
.split-grid{ display:grid; grid-template-columns:1fr 1fr; gap:5rem; align-items:center; }
.split-text h3{ font-family:var(--font-display); font-weight:500; font-size:2.2rem; margin:1rem 0 1.5rem; }
.split-text p{ color:#5a544c; font-size:1.05rem; }
.split-img{ aspect-ratio:3/4; border-radius:2px; background-size:cover; background-position:center; }
.proj-gallery{ padding:4rem 0 8rem; }
.gallery-grid{ display:grid; grid-template-columns:1fr 1fr; gap:2rem; padding:2rem 6vw 0; grid-auto-flow:dense; }
.gal-item{ aspect-ratio:4/3; border-radius:2px; background-size:cover; background-position:center; }
.gal-item.tall{ grid-row:span 2; aspect-ratio:3/5; }
.gal-item.wide{ grid-column:span 2; aspect-ratio:16/6; }
.next-project{ display:block; background:var(--ink); color:var(--bg); padding:7rem 0;
  text-decoration:none; transition:padding .4s; }
.next-project:hover{ padding:8rem 0; }
.next-project span{ font-size:.75rem; letter-spacing:.2em; text-transform:uppercase;
  color:var(--accent); display:block; margin-bottom:1rem; }
.next-title{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(2.5rem,7vw,6rem); transition:transform .4s; }
.next-project:hover .next-title{ transform:translateX(1.5rem); }
.footer-dark{ background:var(--ink); color:rgba(246,244,239,.5); padding:3rem 0; }
.footer-inner{ display:flex; justify-content:space-between; }

/* ===== PROJECTS PAGE (MASONRY) ===== */
.projects-page{ background:var(--bg); }
.page-head{ padding:14rem 0 4rem; }
.page-title{ font-family:var(--font-display); font-weight:500;
  font-size:clamp(2.6rem,7vw,5.5rem); line-height:1; letter-spacing:-.02em; margin:1rem 0 1.5rem; }
.page-sub{ max-width:520px; color:#5a544c; font-size:1.05rem; }
.masonry-section{ padding:2rem 0 8rem; }
.masonry{ column-count:2; column-gap:2rem; padding:2rem 6vw 0; }
.m-item{ display:inline-block; width:100%; margin-bottom:2rem; break-inside:avoid;
  text-decoration:none; color:inherit; cursor:none; }
.m-item.hide{ display:none; }
.m-img{ width:100%; border-radius:2px; overflow:hidden; background-size:cover;
  background-position:center; transition:transform .7s cubic-bezier(.2,.8,.2,1); }
.m-item:nth-child(3n+1) .m-img{ aspect-ratio:3/4; }
.m-item:nth-child(3n+2) .m-img{ aspect-ratio:4/3; }
.m-item:nth-child(3n+3) .m-img{ aspect-ratio:1/1; }
.m-item:hover .m-img{ transform:scale(1.03); }
.m-info{ display:flex; justify-content:space-between; align-items:baseline; margin-top:.9rem; }
.m-info h3{ font-family:var(--font-display); font-weight:500; font-size:1.3rem; }
.m-info span{ color:var(--muted); font-size:.78rem; letter-spacing:.05em; }

/* ===== RESPONSIVE ===== */
/* tablet: masonry a 2 colonne */
@media(min-width:769px) and (max-width:1100px){
  .masonry{ column-count:3; }
}

/* mobile */
@media(max-width:768px){
  .nav-menu{ position:fixed; inset:0; background:var(--ink); color:#fff; flex-direction:column;
    align-items:center; justify-content:center; transform:translateX(100%); transition:.5s; gap:1.8rem; }
  .nav-menu.open{ transform:none; }
  .nav-toggle{ display:flex; z-index:1001; }
  .project-grid{ grid-template-columns:1fr; }
  .service{ grid-template-columns:auto 1fr; }
  .service p{ grid-column:2; }
  .contact-wrap{ grid-template-columns:1fr; gap:3rem; }
  .stats{ gap:2.5rem; }
  .meta-grid{ grid-template-columns:1fr 1fr; }
  .split-grid{ grid-template-columns:1fr; gap:2.5rem; }
  .gallery-grid{ grid-template-columns:1fr; }
  .gal-item.wide,.gal-item.tall{ grid-column:auto; grid-row:auto; aspect-ratio:4/3; }
  .proj-fullimg{ height:50vh; }
  .footer-inner{ flex-direction:column; gap:1rem; }
  .page-head{ padding:11rem 0 3rem; }
  .masonry{ column-count:1; }
}
