:root{
  --bg: #10190F;
  --surface: #1A261A;
  --surface-2: #22301F;
  --wood: #8FBF72;
  --wood-light: #A3D186;
  --moss: #8FBF72;
  --moss-light: #A3D186;
  --ivory: #EDE7DD;
  --muted: #A9B3A2;
  --hair: rgba(237,231,221,0.14);
  --on-dark: #EDE7DD;
  --on-dark-muted: rgba(237,231,221,0.78);
  --serif: 'Fraunces', serif;
  --sans: 'Work Sans', sans-serif;
}
*{margin:0;padding:0;box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  background-color:var(--bg);
  background-image:
    radial-gradient(ellipse 90% 60% at 50% 0%, rgba(143,191,114,0.08), transparent 65%),
    linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0) 55%, rgba(0,0,0,0.55) 100%),
    url('images/leaf-veins-bg.jpg');
  background-repeat:no-repeat, no-repeat, repeat;
  background-size:100% 100%, 100% 100%, 900px 900px;
  background-blend-mode:normal, normal, screen;
  background-attachment:fixed, fixed, fixed;
  color:var(--ivory);
  font-family:var(--sans);
  font-weight:300;
  overflow-x:hidden;
}
::selection{background:var(--wood-light); color:var(--bg);}
:root{caret-color:var(--wood); color-scheme:dark;}
::-webkit-scrollbar{width:10px; height:10px;}
::-webkit-scrollbar-track{background:var(--bg);}
::-webkit-scrollbar-thumb{background:var(--surface-2); border-radius:5px;}
::-webkit-scrollbar-thumb:hover{background:var(--wood);}
:focus-visible{outline:2px solid var(--ivory); outline-offset:2px; border-radius:2px;}
nav :focus-visible, .hero :focus-visible, .page-header :focus-visible, .category-card:focus-visible{outline-color:var(--wood-light);}
a{text-underline-offset:3px; text-decoration-thickness:1px;}
img{display:block; max-width:100%;}

.eyebrow{
  font-family:var(--sans);
  text-transform:uppercase;
  letter-spacing:0.22em;
  font-size:0.72rem;
  color:var(--wood);
  font-weight:500;
}
.hero-content .eyebrow, .page-header .eyebrow, .category-label .eyebrow{color:var(--wood-light);}
h1,h2,h3{font-family:var(--serif); font-weight:400; line-height:1.05;}
a{color:inherit;}

/* ---------- NAV ---------- */
nav{
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; align-items:center; justify-content:space-between;
  padding:1.4rem clamp(1.2rem,4vw,3.5rem);
  background:linear-gradient(to bottom, rgba(16,25,15,0.92), rgba(16,25,15,0));
  transition:background 0.4s ease;
}
nav.scrolled{background:rgba(16,25,15,0.92); backdrop-filter:blur(10px); border-bottom:1px solid var(--hair);}
.nav-logo{display:flex; align-items:center; gap:0.7rem; text-decoration:none;}
.nav-logo img{width:34px; height:34px; object-fit:contain;}
.nav-logo span{font-family:var(--serif); font-size:1.05rem; letter-spacing:0.03em; color:var(--on-dark);}
.nav-links{display:flex; gap:2.2rem; font-size:0.82rem; letter-spacing:0.04em;}
.nav-links a{text-decoration:none; color:var(--on-dark-muted); transition:color 0.3s ease;}
.nav-links a:hover, .nav-links a.active{color:var(--on-dark);}
.nav-links a:active{color:var(--wood-light);}
.nav-toggle{display:none; flex-direction:column; gap:5px; cursor:pointer; background:none; border:none; padding:10px;}
.nav-toggle span{width:22px; height:1.5px; background:var(--on-dark);}

/* ---------- HERO ---------- */
.hero{
  position:relative; min-height:100vh;
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  text-align:center; padding:6rem 1.5rem 4rem; overflow:hidden;
}
.hero-bg{position:absolute; inset:0; z-index:0;}
.hero-bg img, .hero-bg video{width:100%; height:100%; object-fit:cover;}
.hero-video-mobile{display:none;}
.hero-scrim{
  position:absolute; inset:0; z-index:1;
  background:
    linear-gradient(180deg, rgba(10,15,9,0.55) 0%, rgba(10,15,9,0.72) 55%, rgba(10,15,9,0.94) 100%),
    radial-gradient(ellipse 70% 50% at 50% 30%, rgba(10,15,9,0.1), rgba(10,15,9,0.55) 100%);
}
.hero-content{position:relative; z-index:2; display:flex; flex-direction:column; align-items:center;}
.hero-logo{width:76px; height:76px; object-fit:contain; margin-bottom:2rem; opacity:0; animation:fadeUp 1.1s ease forwards 0.15s;}
.hero h1{font-size:clamp(2.6rem, 7vw, 5.6rem); letter-spacing:-0.01em; max-width:16ch; color:var(--on-dark); opacity:0; animation:fadeUp 1.1s ease forwards 0.35s;}
.hero h1 em{font-style:italic; color:var(--on-dark); font-weight:400;}
.hero p{margin-top:1.6rem; max-width:46ch; font-size:1.05rem; color:var(--on-dark-muted); line-height:1.7; opacity:0; animation:fadeUp 1.1s ease forwards 0.55s;}
.hero p.hero-headline{
  margin-top:1rem; font-family:var(--serif); font-size:1.35rem; font-weight:400;
  color:var(--on-dark); max-width:34ch; line-height:1.4;
}
.hero p.hero-headline + p{margin-top:0.9rem;}
.btn{
  font-family:var(--sans); font-size:0.85rem; letter-spacing:0.03em; text-decoration:none;
  padding:0.85rem 1.8rem; border-radius:2px; transition:all 0.35s ease; border:1px solid transparent; display:inline-block;
}
.btn-primary{background:var(--wood); color:var(--bg); font-weight:500;}
.btn-primary:hover{background:var(--wood-light); color:var(--bg); transform:translateY(-2px);}
.btn:active{transform:scale(0.97); transition:transform 100ms ease-out;}
.btn-ghost{border-color:var(--hair); color:var(--ivory);}
.btn-ghost:hover{border-color:var(--wood-light); color:var(--wood-light);}

/* ---------- HERO CATEGORY CARDS (Home) ---------- */
.category-grid{
  margin-top:3.2rem; display:grid; grid-template-columns:repeat(3, minmax(180px, 260px));
  gap:1.4rem; justify-content:center; width:100%; max-width:920px;
  opacity:0; animation:fadeUp 1.1s ease forwards 0.75s;
}
.category-card{
  position:relative; display:block; border-radius:4px; overflow:hidden;
  aspect-ratio:3/4; text-decoration:none; background:var(--surface);
  box-shadow:0 10px 30px rgba(0,0,0,0.35); transition:transform 0.4s ease, box-shadow 0.4s ease;
  border:1px solid var(--hair);
}
.category-card:hover{transform:translateY(-6px); box-shadow:0 16px 40px rgba(0,0,0,0.45); border-color:var(--wood-light);}
.category-card:active{transform:translateY(-2px) scale(0.98); transition:transform 100ms ease-out;}
.category-card img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:transform 1s cubic-bezier(.2,.7,.3,1);}
.category-card:hover img{transform:scale(1.08);}
.category-card-cta{
  display:inline-flex; align-items:center; gap:0.35rem; margin-top:0.6rem;
  font-size:0.72rem; letter-spacing:0.06em; text-transform:uppercase; color:var(--wood-light);
  opacity:0.9;
}
.category-card-cta svg{width:13px; height:13px; transition:transform 0.3s ease;}
.category-card:hover .category-card-cta svg{transform:translateX(4px);}
.category-card.shift-up img{object-position:center 22%;}
.category-card::after{
  content:""; position:absolute; inset:0;
  background:linear-gradient(to top, rgba(16,25,15,0.92) 20%, rgba(16,25,15,0.35) 55%, rgba(16,25,15,0.15) 100%);
}
.category-label{position:relative; z-index:2; height:100%; display:flex; flex-direction:column; justify-content:flex-end; padding:1.5rem;}
.category-label h2{font-size:1.6rem; color:var(--on-dark); margin-bottom:0.4rem;}
.category-label p{font-size:0.85rem; color:var(--on-dark-muted); line-height:1.4;}

@keyframes fadeUp{from{opacity:0; transform:translateY(22px);} to{opacity:1; transform:translateY(0);}}

.scroll-cue{position:absolute; bottom:2.4rem; left:50%; transform:translateX(-50%); display:flex; flex-direction:column; align-items:center; gap:0.5rem; opacity:0; animation:fadeUp 1s ease forwards 1.1s; z-index:2;}
.scroll-cue .line{width:1px; height:38px; background:linear-gradient(var(--wood-light), transparent); animation:pulse 2s ease-in-out infinite;}
@keyframes pulse{0%,100%{opacity:0.3;} 50%{opacity:1;}}

/* ---------- PAGE HEADER (sub-pages) ---------- */
.page-header{
  position:relative; min-height:52vh; display:flex; flex-direction:column;
  align-items:center; justify-content:center; text-align:center; padding:8rem 1.5rem 3rem; overflow:hidden;
}
.page-header .hero-bg, .page-header .hero-scrim{position:absolute; inset:0;}
.page-header .hero-content{position:relative; z-index:2;}
.page-header h1{font-size:clamp(2.4rem,6vw,4.4rem); color:var(--on-dark); opacity:0; animation:fadeUp 1s ease forwards 0.2s;}
.page-header p{margin-top:1.2rem; max-width:50ch; color:var(--on-dark-muted); font-size:1rem; line-height:1.7; opacity:0; animation:fadeUp 1s ease forwards 0.4s;}

/* ---------- SIGNATURE DIVIDER ---------- */
.divider{display:flex; align-items:center; justify-content:center; gap:1rem; padding:2.5rem 1.5rem;}
.divider .stem{width:60px; height:1px; background:linear-gradient(90deg, transparent, var(--hair));}
.divider .stem.right{background:linear-gradient(90deg, var(--hair), transparent);}
.divider svg{width:22px; height:22px; stroke:var(--wood); fill:none; stroke-width:1.4; opacity:0.8;}

/* ---------- SECTION SHARED ---------- */
section{position:relative; padding:7rem clamp(1.2rem,5vw,4rem);}
.section-head{max-width:640px; margin-bottom:3.5rem;}
.section-head h2{font-size:clamp(2rem,4vw,3rem); margin-top:0.7rem;}
.section-head p{color:var(--muted); margin-top:1rem; font-size:1rem; line-height:1.7; max-width:52ch;}
.center{text-align:center; margin-left:auto; margin-right:auto;}

.reveal{opacity:0; transform:translateY(28px); transition:opacity 0.9s ease, transform 0.9s ease;}
.reveal.in-view{opacity:1; transform:translateY(0);}

/* ---------- FILTERS ---------- */
.filters{padding:0 clamp(1.2rem,5vw,4rem) 2.5rem;}
.filter-bar{display:flex; flex-wrap:wrap; justify-content:center; gap:0.8rem; max-width:900px; margin:0 auto;}
.filter-btn{
  font-family:var(--sans); font-size:0.82rem; letter-spacing:0.03em; color:var(--muted);
  background:none; border:1px solid var(--hair); border-radius:20px; padding:0.55rem 1.3rem;
  cursor:pointer; transition:all 0.3s ease;
}
.filter-btn:hover{border-color:var(--wood); color:var(--wood);}
.filter-btn.active{background:var(--wood); border-color:var(--wood); color:var(--bg);}

/* ---------- FEATURES STRIP ---------- */
.features{padding:3.5rem clamp(1.2rem,5vw,4rem) 1rem;}
.features-grid{display:grid; grid-template-columns:repeat(3, 1fr); gap:2rem; max-width:980px; margin:0 auto; text-align:center;}
.feature-item{padding:1.8rem 1.2rem; border-top:1px solid var(--hair);}
.feature-item h2{font-family:var(--serif); font-size:1.25rem; color:var(--wood); margin-bottom:0.6rem;}
.feature-item p{color:var(--muted); font-size:0.9rem; line-height:1.6;}

/* ---------- PROJECTS (Allestimenti) ---------- */
.project{display:grid; grid-template-columns:1.15fr 0.85fr; gap:clamp(1.5rem,4vw,4rem); align-items:center; padding:4.5rem 0; border-top:1px solid var(--hair);}
.project:first-of-type{border-top:none;}
.project.reverse{grid-template-columns:0.85fr 1.15fr;}
.project.reverse .project-media{order:2;}
.project.reverse .project-text{order:1;}
.project-media{position:relative; border-radius:3px; overflow:hidden; background:var(--surface);}
.project-media img{width:100%; height:auto; display:block; transition:transform 1.4s cubic-bezier(.2,.7,.3,1);}
.project-media:hover img{transform:scale(1.03);}
.project-tag{position:absolute; top:1rem; left:1rem; background:rgba(16,25,15,0.72); backdrop-filter:blur(6px); padding:0.4rem 0.8rem; font-size:0.68rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--wood-light); border-radius:2px;}
.project-text .eyebrow{margin-bottom:0.9rem; display:block;}
.project-text h2{font-size:clamp(1.6rem,3vw,2.3rem); margin-bottom:1.1rem;}
.project-text .quote{font-family:var(--serif); font-style:italic; font-size:1.2rem; color:var(--wood); line-height:1.5; margin-bottom:1.1rem;}
.project-text p{color:var(--muted); line-height:1.75; font-size:0.97rem; margin-bottom:1.3rem;}
.project-tags{display:flex; flex-wrap:wrap; gap:0.6rem; margin-top:1.3rem;}
.tag-pill{
  font-size:0.72rem; letter-spacing:0.03em; color:var(--wood);
  border:1px solid var(--hair); border-radius:20px; padding:0.4rem 0.9rem;
}
.project-meta{display:flex; flex-wrap:wrap; gap:1.6rem; margin-top:1.5rem; padding-top:1.5rem; border-top:1px solid var(--hair);}
.meta-item{display:flex; flex-direction:column; gap:0.25rem;}
.meta-item .label{font-size:0.66rem; letter-spacing:0.12em; text-transform:uppercase; color:var(--muted);}
.meta-item .value{font-size:0.92rem; color:var(--ivory);}

/* ---------- EQUI-LIBRO / DESIGN ---------- */
.equilibro-gallery{display:grid; grid-template-columns:1fr 1fr; gap:1.6rem; align-items:start;}
.equilibro-text{max-width:700px; margin:3rem auto 0;}
.equilibro-text .eyebrow{display:block; margin-bottom:0.7rem;}
.equilibro-text h3{font-size:clamp(1.5rem,3vw,2rem); margin-bottom:1rem;}
.equilibro-text p{color:var(--muted); line-height:1.8; font-size:1rem;}

/* ---------- SLIDER ---------- */
.slider{position:relative; max-width:900px; margin:0 auto;}
.slider-track{display:flex; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; -ms-overflow-style:none; border-radius:4px; cursor:grab; user-select:none;}
.slider-track::-webkit-scrollbar{display:none;}
.slider-track.dragging{cursor:grabbing; scroll-snap-type:none;}
.slide{flex:0 0 100%; scroll-snap-align:center; display:flex; align-items:center; justify-content:center; background:var(--surface);}
.slide img{width:100%; height:auto; max-height:70vh; object-fit:contain; pointer-events:none;}
.slider-arrow{position:absolute; top:50%; transform:translateY(-50%); z-index:3; width:42px; height:42px; border-radius:50%; border:1px solid var(--hair); background:rgba(16,25,15,0.75); backdrop-filter:blur(6px); color:var(--ivory); font-size:1.4rem; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; transition:all 0.3s ease;}
.slider-arrow:hover{background:var(--wood); color:var(--bg); border-color:var(--wood);}
.slider-arrow:active{transform:translateY(-50%) scale(0.92); transition:transform 100ms ease-out;}
.slider-arrow.prev{left:-8px;}
.slider-arrow.next{right:-8px;}
.slider-dots{display:flex; justify-content:center; gap:0.5rem; margin-top:1.4rem;}
.slider-dots button{
  width:8px; height:8px; border-radius:50%; border:none; background:var(--hair);
  cursor:pointer; padding:0; transition:background 0.3s ease, transform 0.3s ease;
  position:relative;
}
.slider-dots button::before{
  content:""; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
  width:24px; height:24px;
}
.slider-dots button.active{background:var(--wood-light); transform:scale(1.3);}

/* ---------- ABOUT (Chi sono) ---------- */
.about{display:grid; grid-template-columns:0.9fr 1.1fr; gap:clamp(2rem,5vw,5rem); align-items:center;}
.about-media{position:relative;}
.about-frame{aspect-ratio:4/5; border-radius:3px; overflow:hidden; position:relative;}
.about-frame img{width:100%; height:100%; object-fit:cover;}
.about-badge{position:absolute; bottom:-1.6rem; left:-1.6rem; background:var(--wood); color:var(--bg); padding:1.4rem 1.7rem; border-radius:3px; max-width:220px; box-shadow:0 12px 30px rgba(0,0,0,0.35);}
.about-badge .num{font-family:var(--serif); font-size:2.1rem; line-height:1; color:var(--bg);}
.about-badge .cap{font-size:0.74rem; letter-spacing:0.04em; margin-top:0.3rem; line-height:1.4; color:rgba(16,25,15,0.72);}
.about-text h2{font-size:clamp(2rem,4vw,2.9rem); margin-bottom:1.4rem;}
.about-text p{color:var(--muted); line-height:1.85; margin-bottom:1.2rem; font-size:1rem;}
.about-text p strong{color:var(--wood); font-weight:500; font-style:italic; font-family:var(--serif);}
.credential-list{margin-top:2rem; display:flex; flex-direction:column; gap:0.9rem;}
.credential{display:flex; gap:1rem; align-items:baseline; padding-top:0.9rem; border-top:1px solid var(--hair);}
.credential:first-child{border-top:none; padding-top:0;}
.credential .yr{font-family:var(--serif); font-style:italic; color:var(--wood); font-size:0.95rem; min-width:3.4rem;}
.credential .desc{color:var(--ivory); font-size:0.94rem; line-height:1.5;}

/* ---------- FORMAZIONE ---------- */
.formazione{background:var(--surface); border-radius:4px; margin:0 clamp(1.2rem,5vw,4rem); overflow:hidden;}
.formazione-media{position:relative; aspect-ratio:21/9; overflow:hidden;}
.formazione-media img{width:100%; height:100%; object-fit:cover;}
.formazione-media-tag{position:absolute; bottom:1.2rem; left:1.2rem; background:rgba(16,25,15,0.72); backdrop-filter:blur(6px); padding:0.4rem 0.8rem; font-size:0.68rem; letter-spacing:0.14em; text-transform:uppercase; color:var(--wood-light); border-radius:2px;}
.formazione-inner{padding:5.5rem clamp(1.2rem,5vw,3.5rem); display:grid; grid-template-columns:1fr 1fr; gap:3rem;}
.formazione-col h2{font-size:1.5rem; margin-bottom:1rem;}
.formazione-col p{color:var(--muted); line-height:1.8; font-size:0.98rem;}
.formazione-list{margin-top:1.6rem; display:flex; flex-direction:column; gap:0.8rem;}
.formazione-list li{list-style:none; display:flex; gap:0.8rem; font-size:0.94rem; color:var(--ivory); align-items:flex-start;}
.formazione-list li::before{content:"—"; color:var(--wood); flex-shrink:0;}

/* ---------- CONTATTI ---------- */
.contact{text-align:center;}
.contact-head{margin-bottom:3.5rem;}
.contact h2{font-size:clamp(2.2rem,5vw,4rem); max-width:20ch; margin:0 auto 2rem;}
.contact-links{display:flex; flex-wrap:wrap; justify-content:center; gap:2.4rem; margin-top:2.6rem;}
.contact-links a{text-decoration:none; font-size:1rem; color:var(--ivory); border-bottom:1px solid var(--hair); padding-bottom:0.3rem; transition:all 0.3s ease;}
.contact-links a:hover{color:var(--wood); border-color:var(--wood);}
.contact-sub{color:var(--muted); margin-top:1rem; font-size:0.92rem;}
.contact-form{max-width:640px; margin:0 auto; text-align:left; background:var(--surface); border:1px solid var(--hair); border-radius:4px; padding:clamp(1.5rem,4vw,2.6rem);}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:1.2rem;}
.field{margin-bottom:1.2rem; display:flex; flex-direction:column;}
.field label{font-size:0.72rem; letter-spacing:0.08em; text-transform:uppercase; color:var(--muted); margin-bottom:0.5rem;}
.field input, .field select, .field textarea{background:var(--bg); border:1px solid var(--hair); border-radius:2px; padding:0.75rem 0.9rem; color:var(--ivory); font-family:var(--sans); font-size:16px; outline:none; transition:border-color 0.3s ease;}
.field input:focus, .field select:focus, .field textarea:focus{border-color:var(--wood);}
.field textarea{resize:vertical; min-height:110px;}
.form-submit{border:none; cursor:pointer; width:100%; margin-top:0.4rem;}
.form-submit:disabled{background:var(--surface-2); color:var(--muted); cursor:not-allowed; transform:none;}
.form-note{margin-top:0.9rem; font-size:0.78rem; color:var(--muted); text-align:center;}

footer{padding:2.6rem clamp(1.2rem,5vw,4rem); display:flex; justify-content:space-between; align-items:center; border-top:1px solid var(--hair); flex-wrap:wrap; gap:1rem;}
footer .fmark{display:flex; align-items:center; gap:0.6rem;}
footer .fmark-text{display:flex; flex-direction:column; gap:0.15rem;}
footer .fmark-slogan{font-size:0.72rem; color:var(--muted);}
footer .fmark img{width:24px; height:24px; object-fit:contain;}
footer span{font-size:0.8rem; color:var(--muted);}

/* ---------- PLACEHOLDER (content in arrivo) ---------- */
.coming-soon{
  border:1px dashed var(--hair); border-radius:4px; padding:3.5rem 2rem; text-align:center;
  color:var(--muted); font-size:0.94rem; max-width:520px; margin:0 auto;
}

@media (max-width: 860px){
  .nav-links{display:none;}
  .nav-toggle{display:flex;}
  .category-grid{grid-template-columns:repeat(2, 1fr); gap:0.8rem;}
  .category-card-formazione{display:none;}
  .category-label h2{font-size:1rem;}
  .category-label p{display:none;}
  .category-card-cta{display:none;}
  .project, .project.reverse{grid-template-columns:1fr; gap:1.8rem;}
  .project.reverse .project-media{order:1;}
  .project.reverse .project-text{order:2;}
  .equilibro-gallery{grid-template-columns:1fr;}
  .about{grid-template-columns:1fr;}
  .about-badge{position:static; margin-top:1.2rem; max-width:none;}
  .formazione-inner{grid-template-columns:1fr;}
  .form-row{grid-template-columns:1fr;}
  .features-grid{grid-template-columns:1fr; gap:0;}
  .formazione-media{aspect-ratio:4/3;}
  .hero-video-desktop{display:none;}
  .hero-video-mobile{display:block;}
}
@media (max-width: 620px){
  .slider-arrow{width:34px; height:34px; font-size:1.1rem;}
  .slider-arrow.prev{left:2px;}
  .slider-arrow.next{right:2px;}
}

.footer-legal{display:flex; align-items:center; gap:1.6rem;}
.footer-legal a{color:var(--muted); font-size:0.8rem; text-decoration:none; transition:color 0.3s ease;}
.footer-legal a:hover{color:var(--wood);}

/* ---------- SKIP LINK ---------- */
.skip-link{
  position:absolute; top:-100px; left:1rem; z-index:1000;
  background:var(--ivory); color:var(--bg); padding:0.8rem 1.4rem;
  border-radius:2px; text-decoration:none; font-size:0.85rem; font-weight:500;
  transition:top 0.2s ease;
}
.skip-link:focus{top:1rem;}