/*
Theme Name: Marco Marrone — Studio V2
Author: Marco Marrone
Description: Sophisticated editorial portfolio theme with full-screen media, reveal animations and project archive.
Version: 2.0.0
License: GPL-2.0-or-later
Text Domain: marco-marrone
*/
:root{--bg:#eeeae2;--ink:#0d0d0d;--soft:#77736b;--line:#cfc9be;--max:1440px;--ease:cubic-bezier(.2,.7,.1,1)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif;line-height:1.4}body.is-loading{overflow:hidden}a{color:inherit;text-decoration:none}img{display:block;max-width:100%}.container{width:min(calc(100% - 64px),var(--max));margin:auto}
.preloader{position:fixed;inset:0;background:var(--ink);color:var(--bg);z-index:999;display:grid;place-items:center;transition:opacity .8s var(--ease),visibility .8s}.preloader.is-done{opacity:0;visibility:hidden;pointer-events:none}.loader-name{font-size:clamp(28px,5vw,70px);letter-spacing:-.05em}
.site-header{position:fixed;inset:0 0 auto;z-index:50;padding:24px 0;mix-blend-mode:difference;color:white}.header-inner{display:flex;justify-content:space-between;align-items:center}.logo{font-size:13px;font-weight:700;text-transform:uppercase;letter-spacing:.08em}.nav{display:flex;gap:28px;font-size:11px;text-transform:uppercase;letter-spacing:.12em}.nav a{position:relative}.nav a:after{content:"";position:absolute;left:0;right:100%;bottom:-5px;height:1px;background:currentColor;transition:right .35s var(--ease)}.nav a:hover:after{right:0}.menu-toggle{display:none;background:none;color:inherit;border:0;text-transform:uppercase;font-size:11px}
.hero{min-height:100svh;padding:140px 0 38px;display:flex;align-items:flex-end;position:relative}.hero-grid{width:100%}.hero-kicker{font-size:11px;letter-spacing:.15em;text-transform:uppercase;margin:0 0 30px}.hero-title{font-size:clamp(78px,14vw,215px);font-weight:500;line-height:.76;letter-spacing:-.085em;margin:0;overflow:hidden}.hero-title span{display:block;transform:translateY(110%);animation:rise 1.3s .25s var(--ease) forwards}.hero-title span:nth-child(2){animation-delay:.36s}.hero-bottom{display:grid;grid-template-columns:1fr 1fr 1fr;border-top:1px solid var(--line);margin-top:65px;padding-top:14px;font-size:12px}.hero-bottom div:last-child{text-align:right}
.marquee{overflow:hidden;border-block:1px solid var(--line);padding:18px 0;white-space:nowrap}.marquee-track{display:inline-flex;animation:marquee 25s linear infinite}.marquee span{font-size:12px;text-transform:uppercase;letter-spacing:.18em;margin-right:55px}
.section{padding:150px 0;border-bottom:1px solid var(--line)}.section-label{font-size:11px;text-transform:uppercase;letter-spacing:.15em;color:var(--soft);margin-bottom:55px}.section-title{font-size:clamp(50px,8vw,125px);font-weight:500;line-height:.86;letter-spacing:-.075em;margin:0}.intro{display:grid;grid-template-columns:1fr 2fr;gap:50px}.intro-copy{font-size:clamp(25px,3.2vw,49px);line-height:1.02;letter-spacing:-.045em;margin:0;max-width:950px}.intro-copy p{margin:0}.intro-meta{margin-top:70px;font-size:12px;text-transform:uppercase;letter-spacing:.12em;color:var(--soft)}
.projects-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:75px}.projects-head .section-label{margin:0}.projects-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:90px 24px}.project-card{grid-column:span 7}.project-card:nth-child(2n){grid-column:7 / span 6;margin-top:170px}.project-card:nth-child(3n){grid-column:2 / span 6}.project-media{position:relative;overflow:hidden;background:#d8d2c7;aspect-ratio:4/3}.project-media img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}.project-card:hover .project-media img{transform:scale(1.045)}.project-placeholder{height:100%;min-height:300px;display:grid;place-items:center;color:#777;font-size:11px;text-transform:uppercase;letter-spacing:.12em}.project-number{position:absolute;top:16px;left:16px;z-index:2;background:var(--bg);padding:7px 9px;font-size:10px}.project-info{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--ink);padding-top:13px;margin-top:12px;font-size:12px;text-transform:uppercase;letter-spacing:.08em}.project-info span:last-child{color:var(--soft)}
.image-break{padding:0;border-bottom:1px solid var(--line)}.image-break-inner{height:78svh;background:#d8d2c7;overflow:hidden;position:relative}.image-break-inner img{width:100%;height:100%;object-fit:cover;transition:transform 1.8s var(--ease)}.image-break-inner:hover img{transform:scale(1.025)}.image-break-caption{position:absolute;left:25px;bottom:20px;background:var(--bg);padding:8px 11px;font-size:10px;text-transform:uppercase;letter-spacing:.12em}
.services{display:grid;grid-template-columns:1fr 2fr;gap:50px}.service-list{border-top:1px solid var(--ink)}.service{display:grid;grid-template-columns:70px 1fr 1fr;gap:20px;padding:23px 0;border-bottom:1px solid var(--line);font-size:14px}.service small{color:var(--soft)}.service strong{font-size:clamp(22px,2.5vw,38px);font-weight:500;letter-spacing:-.04em}
.contact{min-height:95svh;display:flex;flex-direction:column;justify-content:space-between}.contact-title{font-size:clamp(72px,13vw,190px);font-weight:500;line-height:.76;letter-spacing:-.09em;margin:0}.contact-bottom{display:flex;justify-content:space-between;align-items:end;gap:30px}.email{font-size:clamp(25px,4vw,58px);letter-spacing:-.05em;border-bottom:2px solid var(--ink);line-height:1.1}.socials{display:flex;gap:22px;font-size:11px;text-transform:uppercase;letter-spacing:.12em}
.site-footer{padding:24px 0;font-size:10px;text-transform:uppercase;letter-spacing:.12em}.footer-inner{display:flex;justify-content:space-between}
.reveal{opacity:0;transform:translateY(35px);transition:opacity 1s var(--ease),transform 1s var(--ease)}.reveal.visible{opacity:1;transform:none}
@keyframes rise{to{transform:translateY(0)}}@keyframes marquee{to{transform:translateX(-50%)}}
@media(max-width:850px){.container{width:min(calc(100% - 32px),var(--max))}.site-header{padding:17px 0}.nav{display:none;position:absolute;top:52px;left:16px;right:16px;padding:18px;background:var(--bg);color:var(--ink);mix-blend-mode:normal;flex-direction:column;border:1px solid var(--line)}.nav.open{display:flex}.menu-toggle{display:block}.hero{padding-top:120px}.hero-title{font-size:clamp(66px,19vw,130px)}.hero-bottom{grid-template-columns:1fr;gap:9px}.hero-bottom div:last-child{text-align:left}.section{padding:90px 0}.intro,.services{grid-template-columns:1fr;gap:35px}.projects-head{display:block;margin-bottom:45px}.projects-grid{display:block}.project-card,.project-card:nth-child(2n),.project-card:nth-child(3n){margin:0 0 65px}.image-break-inner{height:60svh}.service{grid-template-columns:40px 1fr}.service small{display:none}.contact{min-height:80svh}.contact-bottom{display:block}.email{display:inline-block;margin-bottom:30px}.socials{margin-top:15px}.footer-inner{display:block}.footer-inner span{display:block;margin-bottom:7px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.marquee-track{animation:none}.reveal,.hero-title span{opacity:1;transform:none;animation:none}.project-media img,.image-break-inner img{transition:none}}
