:root {
  --ink: #1d1714;
  --ink-soft: #50443e;
  --cream: #f4efe8;
  --paper: #fbf8f3;
  --copper: #a56b49;
  --copper-light: #d6af91;
  --line: rgba(29, 23, 20, .16);
  --white: #fff;
  --serif: "Playfair Display", Georgia, serif;
  --sans: "DM Sans", Arial, sans-serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.6; }
body.menu-open { overflow: hidden; }
img { display: block; width: 100%; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }

.header {
  position: fixed; inset: 0 0 auto; z-index: 20; height: 86px; padding: 0 clamp(22px, 5vw, 80px);
  display: flex; align-items: center; justify-content: space-between;
  color: var(--white); border-bottom: 1px solid rgba(255,255,255,.18); transition: .35s ease;
}
.header.scrolled { height: 72px; background: rgba(29,23,20,.96); backdrop-filter: blur(12px); }
.brand { display: flex; align-items: center; gap: 12px; line-height: 1; }
.brand-mark { font-family: var(--serif); font-size: 1.8rem; letter-spacing: -.08em; color: var(--copper-light); }
.brand-copy { text-transform: uppercase; letter-spacing: .12em; font-size: .75rem; }
.brand-copy small { display: block; margin-top: 5px; color: rgba(255,255,255,.6); letter-spacing: .24em; font-size: .55rem; }
.nav { display: flex; align-items: center; gap: clamp(20px, 2.5vw, 42px); font-size: .75rem; text-transform: uppercase; letter-spacing: .12em; }
.nav a:not(.nav-cta) { position: relative; }
.nav a:not(.nav-cta)::after { content:""; position:absolute; left:0; right:100%; bottom:-5px; height:1px; background:var(--copper-light); transition:.25s; }
.nav a:hover::after { right:0; }
.nav-cta { border: 1px solid rgba(255,255,255,.5); padding: 12px 18px; transition: .25s; }
.nav-cta:hover { background: var(--white); color: var(--ink); }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 11px 6px; border: 0; background: transparent; }
.menu-toggle span { display:block; height:1px; margin:6px 0; background:var(--white); transition:.3s; }

.hero { min-height: 100svh; display: grid; grid-template-columns: 48% 52%; background: var(--ink); color: var(--white); position: relative; overflow: hidden; }
.hero-image { min-height: 100svh; }
.hero-image img { height: 100%; object-fit: cover; object-position: center; filter: saturate(.76) contrast(1.04); }
.hero-content { align-self: center; padding: 130px clamp(40px, 7vw, 110px) 80px; position:relative; }
.hero-content::before { content:""; position:absolute; width:360px; height:360px; border:1px solid rgba(214,175,145,.17); border-radius:50%; right:-170px; top:22%; }
.eyebrow { margin: 0 0 24px; color: var(--copper); font-size: .69rem; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; }
.hero .eyebrow { color: var(--copper-light); }
h1,h2 { margin: 0; font-family: var(--serif); font-weight: 500; line-height: 1.02; letter-spacing: -.04em; }
h1 { max-width: 680px; font-size: clamp(3.4rem, 6vw, 6.8rem); }
h1 em,h2 em { color: var(--copper-light); font-weight: 500; }
.hero-lead { max-width: 580px; margin: 32px 0; color: rgba(255,255,255,.68); font-size: clamp(1rem,1.25vw,1.15rem); }
.hero-actions { display:flex; align-items:center; gap:32px; flex-wrap:wrap; }
.button { display:inline-flex; align-items:center; gap:32px; padding:16px 22px; font-size:.75rem; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
.button-primary { background:var(--copper); color:var(--white); transition:.25s; }
.button-primary:hover { background:#bc7d57; transform:translateY(-2px); }
.text-link { display:inline-flex; gap:16px; align-items:center; color:rgba(255,255,255,.72); border-bottom:1px solid currentColor; padding-bottom:4px; font-size:.79rem; }
.text-link.dark { color:var(--ink-soft); }
.hero-signature { display:flex; align-items:center; gap:13px; margin-top:52px; color:var(--copper-light); }
.hero-signature strong { font-family:var(--serif); font-size:2.2rem; font-weight:500; }
.hero-signature span { padding-left:13px; border-left:1px solid rgba(255,255,255,.2); font-size:.65rem; line-height:1.4; text-transform:uppercase; letter-spacing:.12em; }
.hero-side { position:absolute; right:18px; bottom:28px; margin:0; writing-mode:vertical-rl; color:rgba(255,255,255,.38); font-size:.6rem; text-transform:uppercase; letter-spacing:.15em; }

.section { padding: clamp(90px, 11vw, 160px) clamp(22px, 7vw, 110px); }
.section-number { color:var(--copper); font-size:.67rem; letter-spacing:.12em; }
.intro { background:var(--cream); overflow:hidden; }
.intro-top { display:grid; grid-template-columns:60px 1.15fr .85fr; gap:clamp(30px,5vw,90px); align-items:start; }
.intro h2,.section-title h2,.gallery h2 { font-size:clamp(3rem,5vw,6rem); }
.intro-copy { padding-top:48px; max-width:520px; color:var(--ink-soft); }
.large-copy { color:var(--ink); font-family:var(--serif); font-size:1.65rem; line-height:1.35; }
.intro-copy .text-link { margin-top:26px; }
.experience { display:grid; grid-template-columns:minmax(0,1.35fr) minmax(320px,.65fr); gap:clamp(40px,7vw,110px); margin-top:85px; align-items:center; }
.experience-visual { position:relative; min-height:680px; }
.experience-main { position:absolute; inset:0 15% 0 0; margin:0; overflow:hidden; }
.experience-main img { height:100%; object-fit:cover; }
.experience-detail { position:absolute; right:0; bottom:46px; width:32%; max-width:250px; margin:0; border:10px solid var(--cream); box-shadow:0 22px 55px rgba(29,23,20,.2); }
.experience-detail img { aspect-ratio:3/4; object-fit:cover; }
.experience-stamp { position:absolute; right:2%; top:30px; display:grid; place-items:center; width:116px; height:116px; border-radius:50%; background:var(--ink); color:var(--copper-light); font-family:var(--serif); font-size:2rem; line-height:.75; text-align:center; box-shadow:0 14px 35px rgba(29,23,20,.22); }
.experience-stamp small { color:var(--white); font-family:var(--sans); font-size:.48rem; letter-spacing:.25em; text-transform:uppercase; }
.experience-list { border-top:1px solid var(--line); }
.experience-list article { display:grid; grid-template-columns:36px 1fr; gap:16px; padding:23px 0; border-bottom:1px solid var(--line); }
.experience-list span { color:var(--copper); font-size:.62rem; padding-top:7px; }
.experience-list h3 { margin:0 0 5px; font-family:var(--serif); font-size:1.55rem; font-weight:500; }
.experience-list p { margin:0; color:var(--ink-soft); font-size:.84rem; }

.services { background:var(--paper); display:grid; grid-template-columns:60px minmax(260px,.8fr) 1.2fr; column-gap:clamp(30px,6vw,100px); }
.services-list { border-top:1px solid var(--line); }
.service { display:grid; grid-template-columns:42px 1fr 28px; gap:18px; padding:28px 0; border-bottom:1px solid var(--line); cursor:default; }
.service > span { color:var(--copper); font-size:.65rem; }
.service h3 { margin:0 0 8px; font-family:var(--serif); font-size:clamp(1.5rem,2.4vw,2.2rem); font-weight:500; }
.service p { max-width:600px; margin:0; color:var(--ink-soft); font-size:.92rem; }
.service b { color:var(--copper); font-size:1.3rem; font-weight:400; transition:.3s; }
.service:hover b { transform:rotate(45deg); }
.services-note { grid-column:3; margin:28px 0 0; color:var(--ink-soft); font-size:.78rem; }

.gallery { background:var(--cream); }
.gallery-heading { display:grid; grid-template-columns:60px 1fr auto; gap:30px; align-items:end; margin-bottom:70px; }
.gallery-grid { display:grid; grid-template-columns:1.1fr .9fr; gap:18px; max-width:1180px; margin-inline:auto; }
.gallery-item { position:relative; height:420px; margin:0; overflow:hidden; background:#ddd; }
.gallery-item.tall { height:720px; grid-row:span 2; }
.gallery-item.wide { height:520px; grid-column:1/3; }
.gallery-item img { height:100%; object-fit:cover; transition:transform .7s ease; }
.gallery-item:hover img { transform:scale(1.035); }
.gallery-item figcaption { position:absolute; left:18px; bottom:18px; padding:8px 12px; background:rgba(29,23,20,.78); color:white; font-size:.62rem; letter-spacing:.14em; text-transform:uppercase; }
.image-credit { color:var(--ink-soft); font-size:.68rem; text-align:right; }

.contact { text-align:center; color:var(--white); background:var(--ink); }
.eyebrow.light { color:var(--copper-light); }
.contact h2 { font-size:clamp(3.5rem,8vw,8rem); }
.contact-cta { display:flex; justify-content:space-between; align-items:center; max-width:760px; margin:70px auto 100px; padding:18px 0; border-bottom:1px solid rgba(255,255,255,.35); font-family:var(--serif); font-size:clamp(1.5rem,3vw,2.4rem); }
.contact-cta b { color:var(--copper-light); font-weight:400; }
.contact-grid { display:grid; grid-template-columns:repeat(3,1fr); max-width:1000px; margin:auto; text-align:left; border-top:1px solid rgba(255,255,255,.15); padding-top:38px; }
.contact-grid > div { padding:0 38px; border-right:1px solid rgba(255,255,255,.15); }
.contact-grid > div:last-child { border:0; }
.contact-grid small { color:var(--copper-light); text-transform:uppercase; letter-spacing:.16em; }
.contact-grid p { color:rgba(255,255,255,.75); }
.contact-grid > div > a { color:rgba(255,255,255,.55); font-size:.75rem; border-bottom:1px solid currentColor; }

.footer { display:flex; align-items:center; justify-content:space-between; gap:24px; padding:32px clamp(22px,5vw,80px); background:#140f0d; color:rgba(255,255,255,.42); font-size:.68rem; }
.footer-brand { color:var(--white); text-transform:uppercase; letter-spacing:.12em; }
.footer-brand span { color:var(--copper-light); font-family:var(--serif); font-size:1.2rem; }
.footer a { color:var(--copper-light); }
.whatsapp-float { position:fixed; z-index:15; right:20px; bottom:20px; display:none; gap:20px; padding:13px 17px; background:var(--copper); color:white; font-size:.72rem; text-transform:uppercase; letter-spacing:.1em; box-shadow:0 8px 28px rgba(0,0,0,.22); }

[data-reveal] { opacity:0; transform:translateY(26px); transition:opacity .7s ease, transform .7s ease; }
[data-reveal].visible { opacity:1; transform:none; }

@media (max-width: 900px) {
  .header { height:72px; }
  .menu-toggle { display:block; }
  .menu-toggle.active span:first-child { transform:translateY(3.5px) rotate(45deg); }
  .menu-toggle.active span:last-child { transform:translateY(-3.5px) rotate(-45deg); }
  .nav { position:fixed; inset:72px 0 0; display:flex; flex-direction:column; justify-content:center; background:var(--ink); opacity:0; visibility:hidden; transform:translateY(-12px); transition:.3s; font-size:1rem; }
  .nav.open { opacity:1; visibility:visible; transform:none; }
  .hero { grid-template-columns:1fr; }
  .hero-image { position:absolute; inset:0; min-height:0; opacity:.38; }
  .hero-image::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg,rgba(29,23,20,.35),rgba(29,23,20,.88)); }
  .hero-content { z-index:1; max-width:760px; padding-left:clamp(24px,8vw,80px); }
  .intro-top { grid-template-columns:35px 1fr; }
  .intro-copy { grid-column:2; padding-top:0; }
  .experience { grid-template-columns:1fr; }
  .experience-visual { min-height:620px; }
  .experience-list { max-width:680px; margin-left:35px; }
  .services { grid-template-columns:35px 1fr; }
  .services-list { grid-column:2; padding-top:0; }
  .section-title { margin-bottom:50px; }
  .services-note { grid-column:2; }
  .gallery-heading { grid-template-columns:35px 1fr; }
  .gallery-heading .text-link { grid-column:2; margin-top:10px; justify-self:start; }
  .contact-grid { grid-template-columns:1fr; max-width:600px; }
  .contact-grid > div { border:0; border-bottom:1px solid rgba(255,255,255,.15); padding:24px 0; text-align:center; }
  .footer { flex-direction:column; text-align:center; }
  .whatsapp-float { display:flex; }
}

@media (max-width: 600px) {
  .section { padding-top:88px; padding-bottom:88px; }
  .hero-content { padding:120px 24px 70px; }
  h1 { font-size:clamp(3rem,15vw,4.7rem); }
  .hero-side { display:none; }
  .intro-top,.services { display:block; }
  .section-number { margin-bottom:28px; }
  .intro-heading { margin-bottom:40px; }
  .experience { margin-top:55px; }
  .experience-visual { min-height:500px; }
  .experience-main { inset:0 7% 0 0; }
  .experience-detail { width:38%; right:0; bottom:24px; border-width:7px; }
  .experience-stamp { width:84px; height:84px; top:18px; font-size:1.5rem; }
  .experience-list { margin:35px 0 0; }
  .service { grid-template-columns:32px 1fr 20px; }
  .gallery-heading { display:block; margin-bottom:45px; }
  .gallery-heading .text-link { margin-top:30px; }
  .gallery-grid { grid-template-columns:1fr; }
  .gallery-item,.gallery-item.tall,.gallery-item.wide { grid-column:auto; grid-row:auto; height:460px; }
  .contact-cta { margin:50px auto 70px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { transition:none !important; animation:none !important; }
  [data-reveal] { opacity:1; transform:none; }
}