@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@300;400;500;600&family=Italiana&display=swap');

:root {
  --ink: #171512;
  --ink-soft: #5e5952;
  --paper: #f5f0e8;
  --paper-deep: #e9dfd1;
  --white: #fffdf9;
  --gold: #a77a43;
  --gold-light: #d8b88f;
  --line: rgba(23, 21, 18, .16);
  --serif: 'Italiana', 'Times New Roman', serif;
  --sans: 'DM Sans', Arial, sans-serif;
  --container: min(1240px, calc(100vw - 80px));
  --ease: cubic-bezier(.22, 1, .36, 1);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--paper); font: 16px/1.7 var(--sans); -webkit-font-smoothing: antialiased; }
body.menu-open { overflow: hidden; }
::selection { color: var(--white); background: var(--gold); }
img { display: block; max-width: 100%; }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { color: inherit; font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
.container { width: var(--container); margin-inline: auto; }

.eyebrow { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 22px; color: var(--gold); font-size: .72rem; font-weight: 600; letter-spacing: .2em; line-height: 1.4; text-transform: uppercase; }
.eyebrow::before { width: 32px; height: 1px; background: currentColor; content: ''; }
.display-title, .section-title { margin: 0; font-family: var(--serif); font-weight: 400; letter-spacing: -.035em; line-height: .98; }
.display-title { font-size: clamp(4rem, 8.5vw, 8.5rem); }
.section-title { max-width: 820px; font-size: clamp(2.8rem, 5.8vw, 5.8rem); }
.display-title em, .section-title em { color: var(--gold-light); font-weight: 400; }
.lead { max-width: 610px; margin: 26px 0 0; color: var(--ink-soft); font-size: clamp(1rem, 1.4vw, 1.18rem); }

.button { position: relative; z-index: 1; display: inline-flex; min-height: 52px; padding: 0 26px; overflow: hidden; border: 1px solid var(--ink); border-radius: 100px; align-items: center; justify-content: center; gap: 14px; background: var(--ink); color: var(--white); cursor: pointer; font-size: .73rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; transition: color .45s var(--ease), border-color .45s var(--ease), transform .45s var(--ease); }
.button::before { position: absolute; z-index: -1; inset: 0; background: var(--gold); content: ''; transform: translateY(105%); transition: transform .45s var(--ease); }
.button:hover { border-color: var(--gold); transform: translateY(-2px); }
.button:hover::before { transform: translateY(0); }
.button--light { border-color: rgba(255,255,255,.6); background: transparent; }
.text-link { display: inline-flex; padding-bottom: 5px; border-bottom: 1px solid currentColor; align-items: center; gap: 14px; font-size: .74rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; transition: gap .35s var(--ease), color .35s ease; }
.text-link:hover { gap: 22px; color: var(--gold); }
.arrow { width: 17px; height: 17px; transition: transform .35s var(--ease); }
.button:hover .arrow { transform: translateX(4px); }

.site-header { position: fixed; z-index: 1000; top: 0; left: 0; width: 100%; border-bottom: 1px solid transparent; color: var(--white); transition: background .4s ease, color .4s ease, border-color .4s ease, transform .4s var(--ease); }
.site-header.scrolled, .site-header.header--solid { border-color: var(--line); background: rgba(245,240,232,.9); color: var(--ink); backdrop-filter: blur(18px); }
.site-header.is-hidden { transform: translateY(-105%); }
.nav-wrap { display: flex; min-height: 92px; align-items: center; justify-content: space-between; transition: min-height .35s ease; }
.site-header.scrolled .nav-wrap { min-height: 72px; }
.brand { position: relative; z-index: 3; display: inline-flex; align-items: center; gap: 13px; }
.brand-logo { width: 48px; height: 48px; flex: 0 0 48px; object-fit: contain; filter: drop-shadow(0 4px 12px rgba(0,0,0,.16)); }
.brand-mark { position: relative; display: grid; width: 37px; height: 37px; border: 1px solid currentColor; border-radius: 50%; place-items: center; font-family: var(--serif); font-size: 1rem; }
.brand-mark::after { position: absolute; width: 5px; height: 5px; border-radius: 50%; background: var(--gold-light); content: ''; transform: translate(13px,-13px); }
.brand-copy { display: flex; flex-direction: column; font-size: .8rem; font-weight: 500; letter-spacing: .18em; line-height: 1.35; text-transform: uppercase; }
.brand-copy small { color: var(--gold-light); font-size: .55rem; letter-spacing: .34em; }
.site-nav { display: flex; align-items: center; gap: clamp(20px,2.5vw,42px); }
.nav-link { position: relative; padding: 8px 0; font-size: .7rem; font-weight: 500; letter-spacing: .15em; text-transform: uppercase; }
.nav-link::after { position: absolute; right: 0; bottom: 1px; left: 0; height: 1px; background: var(--gold-light); content: ''; transform: scaleX(0); transform-origin: right; transition: transform .35s var(--ease); }
.nav-link:hover::after, .nav-link.active::after { transform: scaleX(1); transform-origin: left; }
.nav-cta { display: inline-flex; min-height: 42px; padding: 0 19px; border: 1px solid currentColor; border-radius: 100px; align-items: center; font-size: .67rem; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; transition: background .3s ease, color .3s ease; }
.nav-cta:hover { background: var(--white); color: var(--ink); }
.site-header.scrolled .nav-cta:hover, .site-header.header--solid .nav-cta:hover { background: var(--ink); color: var(--white); }
.menu-toggle { position: relative; z-index: 3; display: none; width: 46px; height: 46px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.menu-toggle span { position: absolute; left: 10px; width: 26px; height: 1px; background: currentColor; transition: transform .35s var(--ease), top .35s var(--ease); }
.menu-toggle span:first-child { top: 18px; }
.menu-toggle span:last-child { top: 27px; }
.menu-open .menu-toggle span:first-child { top: 23px; transform: rotate(45deg); }
.menu-open .menu-toggle span:last-child { top: 23px; transform: rotate(-45deg); }

.hero { position: relative; min-height: 100svh; overflow: hidden; background: #161511; color: var(--white); }
.hero-slides, .hero-slide, .hero-slide::after { position: absolute; inset: 0; }
.hero-slide { opacity: 0; background-position: center; background-size: cover; transform: scale(1.06); transition: opacity 1.2s ease, transform 8s linear; }
.hero-slide::after { background: linear-gradient(90deg,rgba(10,9,7,.8) 0%,rgba(10,9,7,.42) 47%,rgba(10,9,7,.17) 100%), linear-gradient(0deg,rgba(10,9,7,.55) 0%,transparent 42%); content: ''; }
.hero-slide.active { opacity: 1; transform: scale(1); }
.hero__content { position: relative; z-index: 2; display: flex; min-height: 100svh; padding-top: 130px; padding-bottom: 90px; flex-direction: column; align-items: flex-start; justify-content: center; }
.hero .display-title { max-width: 930px; }
.hero .lead { max-width: 490px; color: rgba(255,255,255,.72); }
.hero__actions { display: flex; margin-top: 38px; align-items: center; gap: 28px; }
.hero__meta { position: absolute; z-index: 3; right: max(40px,calc((100vw - 1240px)/2)); bottom: 54px; display: flex; align-items: center; gap: 15px; color: rgba(255,255,255,.75); font-size: .68rem; letter-spacing: .15em; }
.hero-progress { width: 90px; height: 1px; overflow: hidden; background: rgba(255,255,255,.35); }
.hero-progress span { display: block; width: 100%; height: 100%; background: var(--white); transform: scaleX(0); transform-origin: left; }
.hero-progress span.running { animation: progress 6s linear forwards; }
@keyframes progress { to { transform: scaleX(1); } }
.scroll-cue { position: absolute; z-index: 3; bottom: 32px; left: max(40px,calc((100vw - 1240px)/2)); display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.7); font-size: .62rem; letter-spacing: .18em; text-transform: uppercase; transform: rotate(-90deg) translateX(100%); transform-origin: left bottom; }
.scroll-cue::before { width: 48px; height: 1px; background: rgba(255,255,255,.6); content: ''; animation: breathe 1.8s ease-in-out infinite; }
@keyframes breathe { 50% { opacity: .3; transform: scaleX(.65); } }

.intro { padding: 150px 0 130px; }
.intro-grid { display: grid; grid-template-columns: .7fr 1.3fr; gap: 8vw; align-items: start; }
.intro-copy .section-title { max-width: 890px; }
.intro-copy .lead { margin-left: auto; }
.numbers { display: grid; margin-top: 90px; padding-top: 26px; border-top: 1px solid var(--line); grid-template-columns: repeat(3,1fr); gap: 24px; }
.number-item strong { display: block; margin-bottom: 4px; color: var(--gold); font-family: var(--serif); font-size: clamp(2.2rem,4vw,4rem); font-weight: 400; line-height: 1; }
.number-item span { color: var(--ink-soft); font-size: .72rem; letter-spacing: .12em; text-transform: uppercase; }
.featured-story { padding: 80px 0 160px; overflow: hidden; }
.story-grid { display: grid; grid-template-columns: minmax(0,1.18fr) minmax(300px,.82fr); align-items: center; gap: clamp(40px,8vw,120px); }
.image-reveal { position: relative; overflow: hidden; }
.image-reveal::after { position: absolute; z-index: 2; inset: 0; background: var(--paper-deep); content: ''; transform: scaleX(0); transform-origin: right; transition: transform 1.2s var(--ease); }
.js .image-reveal::after { transform: scaleX(1); }
.image-reveal.revealed::after { transform: scaleX(0); }
.image-reveal img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.5s var(--ease); }
.js .image-reveal img { transform: scale(1.08); }
.image-reveal.revealed img { transform: scale(1); }
.story-image { height: min(720px,72vw); }
.story-copy { position: relative; }
.story-copy::before { position: absolute; top: -70px; right: 0; color: rgba(167,122,67,.14); content: '01'; font-family: var(--serif); font-size: 10rem; line-height: 1; }
.story-copy p:not(.eyebrow) { max-width: 470px; margin: 30px 0; color: var(--ink-soft); }

.gallery-preview { padding: 140px 0; background: var(--ink); color: var(--white); }
.section-head { display: flex; margin-bottom: 60px; align-items: flex-end; justify-content: space-between; gap: 30px; }
.section-head .section-title { max-width: 760px; }
.preview-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; align-items: center; }
.preview-card { position: relative; display: block; overflow: hidden; }
.preview-card:nth-child(1) { height: 620px; }
.preview-card:nth-child(2) { height: 450px; }
.preview-card:nth-child(3) { height: 540px; }
.preview-card::after { position: absolute; inset: 0; background: linear-gradient(0deg,rgba(12,11,9,.8),transparent 55%); content: ''; opacity: .8; transition: opacity .5s ease; }
.preview-card img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease), filter .8s ease; }
.preview-card:hover img { filter: saturate(.7); transform: scale(1.045); }
.preview-card:hover::after { opacity: 1; }
.preview-card__caption { position: absolute; z-index: 2; right: 30px; bottom: 26px; left: 30px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; }
.preview-card__caption h3 { margin: 4px 0 0; font-family: var(--serif); font-size: clamp(1.8rem,3vw,3rem); font-weight: 400; line-height: 1; }
.preview-card__caption span { font-size: .64rem; letter-spacing: .15em; text-transform: uppercase; }
.preview-grid.is-dynamic { align-items: center; }
.preview-grid.is-dynamic .preview-card:nth-child(n) { height: auto; aspect-ratio: var(--photo-ratio); }
.preview-card .photo-phrase { padding-bottom: 100px; justify-content: center; }

.experience { padding: 150px 0; }
.experience-list { margin-top: 70px; border-top: 1px solid var(--line); }
.experience-item { display: grid; min-height: 170px; padding: 32px 0; border-bottom: 1px solid var(--line); grid-template-columns: 80px 1fr 1.1fr 45px; align-items: center; gap: 30px; transition: padding .45s var(--ease), color .3s ease; }
.experience-item:hover { padding-right: 18px; padding-left: 18px; color: var(--gold); }
.experience-item__number { font-size: .68rem; letter-spacing: .12em; }
.experience-item h3 { margin: 0; font-family: var(--serif); font-size: clamp(2rem,3.4vw,3.8rem); font-weight: 400; line-height: 1; }
.experience-item p { max-width: 470px; margin: 0; color: var(--ink-soft); font-size: .92rem; }
.experience-item .arrow { justify-self: end; }
.quote-section { position: relative; display: grid; min-height: 82vh; padding: 100px 0; overflow: hidden; background-color: #171512; background-position: center 38%; background-size: cover; background-attachment: fixed; color: var(--white); place-items: center; text-align: center; }
.quote-section::before { position: absolute; inset: 0; background: rgba(15,13,10,.57); content: ''; }
.quote-section blockquote { position: relative; z-index: 1; max-width: 1020px; margin: 0 auto; font-family: var(--serif); font-size: clamp(3rem,6vw,6.5rem); line-height: 1.04; }
.quote-section span { color: var(--gold-light); }
.cta-section { padding: 150px 0; text-align: center; }
.cta-section .section-title, .cta-section .lead { margin-inline: auto; }
.cta-section .button { margin-top: 38px; }

.site-footer { padding: 90px 0 30px; background: #11100e; color: var(--white); }
.footer-grid { display: grid; padding-bottom: 70px; grid-template-columns: 1.2fr .45fr .85fr .55fr; gap: clamp(35px,5vw,70px); }
.footer-brand .brand { margin-bottom: 30px; }
.footer-brand p { max-width: 390px; color: rgba(255,255,255,.55); }
.footer-column h3 { margin: 5px 0 24px; color: var(--gold-light); font-size: .66rem; font-weight: 500; letter-spacing: .18em; text-transform: uppercase; }
.footer-column a, .footer-column span { display: block; margin: 11px 0; color: rgba(255,255,255,.7); font-size: .88rem; transition: color .25s ease; }
.footer-column a:hover { color: var(--gold-light); }
.footer-bottom { display: flex; padding-top: 26px; border-top: 1px solid rgba(255,255,255,.12); align-items: center; justify-content: space-between; color: rgba(255,255,255,.42); font-size: .7rem; letter-spacing: .06em; }
.footer-bottom a { color: rgba(255,255,255,.72); transition: color .25s ease; }
.footer-bottom a:hover { color: var(--gold-light); }

/* Internal pages */
.page-hero { position: relative; display: flex; min-height: 72svh; padding: 160px 0 90px; align-items: flex-end; overflow: hidden; background: #171512; color: var(--white); }
.page-hero__image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .58; animation: heroIn 1.8s var(--ease) both; }
@keyframes heroIn { from { opacity: 0; transform: scale(1.07); } to { opacity: .58; transform: scale(1); } }
.page-hero::after { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(12,11,9,.78),rgba(12,11,9,.12)),linear-gradient(0deg,rgba(12,11,9,.65),transparent 60%); content: ''; }
.page-hero__content { position: relative; z-index: 1; width: var(--container); }
.page-hero .display-title { max-width: 920px; }
.page-hero__footer { display: flex; margin-top: 38px; align-items: flex-end; justify-content: space-between; gap: 30px; }
.page-hero__footer p { max-width: 510px; margin: 0; color: rgba(255,255,255,.72); }

/* Portfolio */
.portfolio-section { padding: 110px 0 150px; }
.filter-bar { display: flex; margin-bottom: 54px; flex-wrap: wrap; gap: 10px; }
.filter-button { padding: 10px 18px; border: 1px solid var(--line); border-radius: 100px; background: transparent; cursor: pointer; font-size: .68rem; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; transition: background .3s ease,color .3s ease,border-color .3s ease; }
.filter-button:hover, .filter-button.active { border-color: var(--ink); background: var(--ink); color: var(--white); }
.filter-button span { margin-left: 5px; opacity: .58; font-size: .58rem; letter-spacing: .04em; }
.portfolio-grid { display: grid; grid-template-columns: repeat(12,1fr); gap: 48px 22px; }
.portfolio-card { grid-column: span 4; opacity: 1; transform: scale(1); transition: opacity .35s ease,transform .4s var(--ease); }
.portfolio-card:nth-child(7n + 1), .portfolio-card:nth-child(7n + 5) { grid-column: span 5; }
.portfolio-card:nth-child(7n + 2), .portfolio-card:nth-child(7n + 4) { grid-column: span 7; }
.portfolio-card.is-hidden { display: none; }
.portfolio-card__image { position: relative; width: 100%; height: clamp(320px,42vw,570px); padding: 0; overflow: hidden; border: 0; background: var(--paper-deep); cursor: zoom-in; }
.portfolio-card:nth-child(3n) .portfolio-card__image { height: clamp(380px,48vw,660px); }
.portfolio-card--landscape .portfolio-card__image { height: auto; aspect-ratio: 1.45; }
.portfolio-grid.is-dynamic .portfolio-card__image { height: auto; aspect-ratio: var(--photo-ratio); }
.portfolio-card__image img { width: 100%; height: 100%; object-fit: cover; transition: transform .8s var(--ease),filter .6s ease; }
.portfolio-card__image::after { position: absolute; inset: 18px; border: 1px solid rgba(255,255,255,.65); content: ''; opacity: 0; transform: scale(.96); transition: opacity .4s ease,transform .4s var(--ease); }
.portfolio-card__image:hover img { filter: brightness(.82); transform: scale(1.035); }
.portfolio-card__image:hover::after { opacity: 1; transform: scale(1); }
.portfolio-card__caption { display: flex; padding-top: 15px; align-items: baseline; justify-content: space-between; gap: 20px; }
.portfolio-card__caption h2 { margin: 0; font-family: var(--serif); font-size: clamp(1.55rem,2.2vw,2.4rem); font-weight: 400; line-height: 1.1; }
.portfolio-card__caption span { color: var(--ink-soft); font-size: .62rem; letter-spacing: .12em; text-transform: uppercase; }
.photo-phrase { position: absolute; z-index: 2; inset: 0; display: flex; padding: clamp(24px,3vw,42px); flex-direction: column; justify-content: flex-end; background: linear-gradient(180deg,rgba(10,9,7,.02) 18%,rgba(10,9,7,.82) 100%); color: var(--white); opacity: 0; pointer-events: none; text-align: left; transform: translateY(14px); transition: opacity .45s ease,transform .55s var(--ease); }
.photo-phrase small { margin-bottom: 11px; color: var(--gold-light); font-size: .59rem; font-weight: 600; letter-spacing: .2em; line-height: 1.3; text-transform: uppercase; }
.photo-phrase strong { max-width: 480px; font-family: var(--serif); font-size: clamp(1.65rem,2.7vw,3.25rem); font-weight: 400; letter-spacing: -.02em; line-height: 1.04; }
.portfolio-card__image:hover .photo-phrase, .portfolio-card__image:focus-visible .photo-phrase, .preview-card:hover .photo-phrase, .preview-card:focus-visible .photo-phrase { opacity: 1; transform: translateY(0); }
.gallery-empty { grid-column: 1/-1; margin: 0; padding: 70px 25px; border: 1px solid var(--line); color: var(--ink-soft); text-align: center; }
.lightbox { position: fixed; z-index: 2000; inset: 0; display: grid; padding: 30px; border: 0; background: rgba(12,11,9,.96); color: var(--white); opacity: 0; place-items: center; pointer-events: none; transition: opacity .35s ease; }
.lightbox[open] { opacity: 1; pointer-events: auto; }
.lightbox img { max-width: min(1200px,92vw); max-height: 84vh; object-fit: contain; transform: scale(.94); transition: transform .55s var(--ease); }
.lightbox[open] img { transform: scale(1); }
.lightbox-close { position: absolute; top: 24px; right: 30px; display: grid; width: 48px; height: 48px; border: 1px solid rgba(255,255,255,.4); border-radius: 50%; background: transparent; color: var(--white); cursor: pointer; font-size: 1.5rem; place-items: center; }
.lightbox-caption { position: absolute; bottom: 22px; left: 50%; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; transform: translateX(-50%); }

/* About */
.about-intro { padding: 150px 0; }
.about-grid { display: grid; grid-template-columns: .86fr 1.14fr; gap: clamp(50px,10vw,150px); align-items: start; }
.about-image { height: 720px; }
.about-copy { padding-top: 65px; }
.about-copy .section-title { font-size: clamp(3rem,5vw,5.2rem); }
.about-copy p:not(.eyebrow) { max-width: 550px; color: var(--ink-soft); }
.signature { display: block; margin-top: 28px; color: var(--gold); font-family: var(--serif); font-size: 2.3rem; font-style: italic; }
.values-section { padding: 130px 0; background: var(--paper-deep); }
.values-grid { display: grid; margin-top: 70px; grid-template-columns: repeat(3,1fr); gap: 45px; }
.value-card { padding-top: 25px; border-top: 1px solid var(--line); }
.value-card span { color: var(--gold); font-family: var(--serif); font-size: 1.1rem; }
.value-card h3 { margin: 38px 0 18px; font-family: var(--serif); font-size: 2.4rem; font-weight: 400; line-height: 1; }
.value-card p { margin: 0; color: var(--ink-soft); font-size: .92rem; }
.process-section { padding: 150px 0; }
.process-grid { display: grid; margin-top: 70px; border: 1px solid var(--line); background: var(--line); grid-template-columns: repeat(4,1fr); gap: 1px; }
.process-card { min-height: 310px; padding: 32px; background: var(--paper); transition: background .35s ease,color .35s ease; }
.process-card:hover { background: var(--ink); color: var(--white); }
.process-card span { color: var(--gold); font-size: .68rem; letter-spacing: .14em; }
.process-card h3 { margin: 75px 0 18px; font-family: var(--serif); font-size: 2rem; font-weight: 400; }
.process-card p { margin: 0; color: var(--ink-soft); font-size: .86rem; transition: color .35s ease; }
.process-card:hover p { color: rgba(255,255,255,.62); }

/* Contact */
.contact-hero { min-height: 64svh; }
.contact-section { padding: 120px 0 150px; }
.contact-grid { display: grid; grid-template-columns: .68fr 1.32fr; gap: clamp(55px,9vw,130px); }
.contact-aside { position: sticky; top: 120px; align-self: start; }
.contact-aside h2 { margin: 0 0 26px; font-family: var(--serif); font-size: clamp(2.7rem,4vw,4.2rem); font-weight: 400; line-height: 1; }
.contact-aside > p { color: var(--ink-soft); }
.contact-detail { margin-top: 45px; padding-top: 22px; border-top: 1px solid var(--line); }
.contact-detail small { display: block; margin-bottom: 7px; color: var(--gold); font-size: .64rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.contact-detail > a, .contact-detail > span { color: var(--ink-soft); transition: color .25s ease; }
.contact-detail > a:hover, .contact-socials a:hover { color: var(--gold); }
.contact-socials { display: flex; flex-wrap: wrap; gap: 8px 24px; }
.contact-socials a { color: var(--ink-soft); transition: color .25s ease; }
.contact-direct { position: relative; isolation: isolate; display: flex; min-height: 570px; padding: clamp(42px,6vw,78px); overflow: hidden; align-items: flex-start; justify-content: center; flex-direction: column; background: var(--ink); color: var(--white); }
.contact-direct::before { position: absolute; z-index: -2; top: -35%; right: -18%; width: 430px; height: 430px; border-radius: 50%; background: radial-gradient(circle,rgba(216,184,143,.23),transparent 68%); content: ''; }
.contact-direct::after { position: absolute; z-index: -1; inset: 18px; border: 1px solid rgba(255,255,255,.12); content: ''; pointer-events: none; }
.contact-direct__label { margin-bottom: 46px; color: var(--gold-light); font-size: .65rem; font-weight: 600; letter-spacing: .18em; text-transform: uppercase; }
.contact-direct__icon { width: 68px; height: 68px; margin-bottom: 30px; color: var(--gold-light); }
.contact-direct h3 { max-width: 560px; margin: 0; font-family: var(--serif); font-size: clamp(2.7rem,4.4vw,4.8rem); font-weight: 400; line-height: 1.02; }
.contact-direct p { max-width: 540px; margin: 24px 0 0; color: rgba(255,255,255,.68); }
.contact-phone { display: block; margin: 24px 0 30px; color: var(--gold-light); font-size: .85rem; font-weight: 500; letter-spacing: .12em; }
.contact-direct > small { margin-top: 17px; color: rgba(255,255,255,.42); font-size: .68rem; }
.button--whatsapp { border-color: #226447; background: #226447; }
.button--whatsapp::before { background: #2c7b59; }
.button--whatsapp:hover { border-color: #2c7b59; }

.js [data-reveal] { opacity: 0; transform: translateY(35px); transition: opacity .85s var(--ease),transform .85s var(--ease); }
.js [data-reveal='left'] { transform: translateX(-35px); }
.js [data-reveal='right'] { transform: translateX(35px); }
.js [data-reveal].revealed { opacity: 1; transform: translate(0); }

@media (max-width: 960px) {
  :root { --container: min(calc(100% - 44px),760px); }
  .menu-toggle { display: block; }
  .site-nav { position: fixed; z-index: 2; inset: 0; display: flex; padding: 130px 22px 60px; background: var(--ink); color: var(--white); flex-direction: column; align-items: center; justify-content: center; gap: 22px; opacity: 0; pointer-events: none; transform: translateY(-20px); transition: opacity .4s ease,transform .4s var(--ease); }
  .menu-open .site-nav { opacity: 1; pointer-events: auto; transform: translateY(0); }
  .menu-open .site-header { color: var(--white); }
  .nav-link { font-family: var(--serif); font-size: 2.2rem; letter-spacing: 0; text-transform: none; }
  .nav-cta { margin-top: 12px; }
  .intro-grid, .story-grid, .about-grid, .contact-grid { grid-template-columns: 1fr; }
  .intro-grid { gap: 35px; }
  .story-grid { gap: 55px; }
  .story-image, .about-image { height: min(720px,110vw); }
  .about-copy { padding-top: 0; }
  .preview-grid { grid-template-columns: 1fr 1fr; }
  .preview-card:nth-child(1) { grid-column: 1/-1; }
  .preview-card:nth-child(2), .preview-card:nth-child(3) { height: 470px; }
  .preview-grid.is-dynamic .preview-card:nth-child(1) { grid-column: auto; }
  .preview-grid.is-dynamic .preview-card:nth-child(3) { width: calc(50% - 10px); grid-column: 1/-1; justify-self: center; }
  .experience-item { grid-template-columns: 55px 1fr 40px; }
  .experience-item p { display: none; }
  .footer-grid { grid-template-columns: 1fr 1fr; }
  .footer-brand { grid-column: 1/-1; }
  .portfolio-card, .portfolio-card:nth-child(7n + 1), .portfolio-card:nth-child(7n + 2), .portfolio-card:nth-child(7n + 4), .portfolio-card:nth-child(7n + 5) { grid-column: span 6; }
  .portfolio-card__image, .portfolio-card:nth-child(3n) .portfolio-card__image { height: 52vw; }
  .portfolio-grid.is-dynamic .portfolio-card__image { height: auto; }
  .values-grid { grid-template-columns: 1fr; }
  .process-grid { grid-template-columns: 1fr 1fr; }
  .contact-aside { position: static; }
}

@media (max-width: 620px) {
  :root { --container: calc(100vw - 36px); }
  body { font-size: 15px; }
  .nav-wrap, .site-header.scrolled .nav-wrap { min-height: 72px; }
  .brand-copy { font-size: .7rem; }
  .brand-mark { width: 34px; height: 34px; }
  .brand-logo { width: 42px; height: 42px; flex-basis: 42px; }
  .hero__content { padding-top: 110px; padding-bottom: 110px; justify-content: flex-end; }
  .hero .display-title { font-size: clamp(3.65rem,18vw,5rem); }
  .hero__actions { align-items: flex-start; flex-direction: column; gap: 20px; }
  .hero__meta { right: 18px; bottom: 30px; }
  .scroll-cue { display: none; }
  .intro, .experience, .about-intro, .process-section { padding: 100px 0; }
  .featured-story, .gallery-preview, .values-section, .contact-section { padding: 90px 0; }
  .numbers { margin-top: 55px; grid-template-columns: 1fr; gap: 24px; }
  .number-item { padding-bottom: 20px; border-bottom: 1px solid var(--line); }
  .section-head { margin-bottom: 40px; align-items: flex-start; flex-direction: column; }
  .preview-grid { display: block; }
  .preview-card:nth-child(n) { height: 115vw; margin-bottom: 16px; }
  .preview-grid.is-dynamic .preview-card:nth-child(n) { width: 100%; height: auto; }
  .experience-list { margin-top: 45px; }
  .experience-item { min-height: 130px; grid-template-columns: 35px 1fr 25px; gap: 10px; }
  .quote-section { min-height: 70vh; background-attachment: scroll; }
  .cta-section { padding: 110px 0; }
  .footer-grid { grid-template-columns: 1fr; gap: 35px; }
  .footer-brand { grid-column: auto; }
  .footer-bottom { align-items: flex-start; flex-direction: column; gap: 7px; }
  .page-hero { min-height: 76svh; padding-bottom: 65px; }
  .page-hero .display-title { font-size: clamp(3.6rem,17vw,5rem); }
  .page-hero__footer { align-items: flex-start; flex-direction: column; }
  .portfolio-section { padding: 80px 0 100px; }
  .portfolio-grid { display: block; }
  .portfolio-card { margin-bottom: 45px; }
  .portfolio-card__image, .portfolio-card:nth-child(3n) .portfolio-card__image { height: 120vw; max-height: 620px; }
  .portfolio-card--landscape .portfolio-card__image { height: auto; max-height: none; }
  .portfolio-grid.is-dynamic .portfolio-card__image { height: auto; max-height: none; }
  .filter-bar { gap: 7px; }
  .filter-button { padding: 9px 13px; font-size: .61rem; }
  .about-image { height: 125vw; }
  .process-grid { grid-template-columns: 1fr; }
  .process-card { min-height: 250px; }
  .process-card h3 { margin-top: 45px; }
  .contact-direct { min-height: 520px; padding: 44px 36px; }
  .contact-direct::after { inset: 12px; }
  .button--whatsapp { width: 100%; padding-inline: 18px; }
}

@media (hover: none) {
  .photo-phrase { opacity: 1; transform: none; }
  .preview-card .photo-phrase { padding-bottom: 104px; justify-content: flex-end; background: linear-gradient(180deg,transparent 38%,rgba(10,9,7,.88) 100%); }
  .preview-card .photo-phrase strong { font-size: clamp(1.35rem,6vw,2rem); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
  .quote-section { background-attachment: scroll; }
}