/* Bosque & Co — base styles (bold + luxurious) */
:root {
  /* Palette — warm ivory + warm black + brass */
  --ivory:        #F0E9DA;
  --ivory-2:      #E5DCC7;
  --noir:         #0F0D0A;
  --noir-2:       #1A1612;
  --brass:        #B89968;
  --brass-deep:   #8E6E3E;
  --terracotta:   #9C5D3F;
  --muted:        #8A8275;
  --line:         #D9CDB3;
  --line-2:       #2A2520;
}

* { -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
html { scroll-behavior: smooth; }
html, body { background: var(--ivory); color: var(--noir); }
body { font-family: 'Inter', system-ui, -apple-system, sans-serif; font-size: 16px; line-height: 1.6; overflow-x: hidden; }

.font-display { font-family: 'Cormorant Garamond', 'Times New Roman', serif; font-weight: 300; letter-spacing: -0.012em; }
.font-italic-display { font-family: 'Cormorant Garamond', serif; font-style: italic; font-weight: 400; }
.font-mono { font-family: 'JetBrains Mono', ui-monospace, monospace; }
.font-ar { font-family: 'IBM Plex Sans Arabic', system-ui, sans-serif; }

.eyebrow { letter-spacing: 0.32em; text-transform: uppercase; font-size: 10px; color: var(--muted); font-weight: 500; }
.eyebrow-brass { color: var(--brass); }
.rule { height: 1px; background: var(--line); }

.btn { display: inline-flex; align-items: center; gap: .65rem; padding: .95rem 1.6rem; border: 1px solid var(--noir); color: var(--noir); text-decoration: none; font-size: 12px; letter-spacing: .2em; text-transform: uppercase; font-weight: 500; transition: all .35s cubic-bezier(.2,.7,.2,1); position: relative; overflow: hidden; }
.btn::after { content:""; position:absolute; inset:0; background:var(--noir); transform: translateY(101%); transition: transform .4s cubic-bezier(.2,.7,.2,1); z-index:-1; }
.btn:hover { color: var(--ivory); border-color: var(--noir); }
.btn:hover::after { transform: translateY(0); }
.btn-light { border-color: var(--ivory); color: var(--ivory); }
.btn-light::after { background: var(--ivory); }
.btn-light:hover { color: var(--noir); }
.btn-brass { border-color: var(--brass); color: var(--brass); }
.btn-brass::after { background: var(--brass); }
.btn-brass:hover { color: var(--noir); }

.link-underline { background-image: linear-gradient(currentColor,currentColor); background-size: 0% 1px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .4s ease; }
.link-underline:hover { background-size: 100% 1px; }

/* Nav */
.nav-blur { backdrop-filter: saturate(140%) blur(16px); -webkit-backdrop-filter: saturate(140%) blur(16px); background: rgba(240,233,218,.82); border-bottom: 1px solid rgba(0,0,0,0.06); }
.nav-on-hero { background: transparent; border-color: transparent; color: var(--ivory); }
.nav-on-hero a, .nav-on-hero span { color: var(--ivory); }
.nav-on-hero .btn { border-color: var(--ivory); color: var(--ivory); }
.nav-on-hero .btn::after { background: var(--ivory); }
.nav-on-hero .btn:hover { color: var(--noir); }

/* Hero */
.hero { min-height: 100vh; }
.hero-canvas { position: absolute; inset: 0; pointer-events: none; opacity: .55; }
.hero-mask { position: absolute; inset: 0; background:
  radial-gradient(ellipse at 30% 30%, rgba(184,153,104,.08), transparent 60%),
  linear-gradient(to bottom, rgba(15,13,10,.45) 0%, rgba(15,13,10,.55) 50%, rgba(15,13,10,.85) 100%); }
.hero-headline { font-size: clamp(3.2rem, 13vw, 14rem); line-height: .85; letter-spacing: -0.025em; }
.hero-headline .ital { font-style: italic; font-weight: 400; color: var(--brass); }
.hero-rule { width: 64px; height: 1px; background: var(--brass); display: inline-block; vertical-align: middle; margin: 0 1rem; }

/* Marquee */
.marquee { overflow: hidden; white-space: nowrap; position: relative; border-top: 1px solid var(--line-2); border-bottom: 1px solid var(--line-2); padding: 1.4rem 0; background: var(--noir); color: var(--ivory); }
.marquee-track { display: inline-block; animation: marquee 38s linear infinite; }
.marquee span { display:inline-block; padding: 0 2.5rem; font-family:'Cormorant Garamond', serif; font-style: italic; font-size: clamp(2rem, 4vw, 3.5rem); font-weight: 300; }
.marquee i { color: var(--brass); display:inline-block; padding: 0 .6rem; font-style: normal; }
@keyframes marquee { from { transform: translateX(0); } to { transform: translateX(-50%); } }

/* Project card */
.proj-card { position: relative; overflow: hidden; background: var(--ivory-2); display: block; }
.proj-card img { transition: transform 1.4s cubic-bezier(.2,.7,.2,1), filter .6s ease; width: 100%; height: 100%; object-fit: cover; }
.proj-card:hover img { transform: scale(1.06); filter: brightness(.85); }
.proj-meta { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.4rem 1.6rem; color: var(--ivory); background: linear-gradient(to top, rgba(15,13,10,.92), rgba(15,13,10,0)); }
.proj-card .number { position: absolute; top: 1.1rem; left: 1.3rem; font-family: 'JetBrains Mono', monospace; font-size: 11px; color: var(--ivory); letter-spacing: .2em; mix-blend-mode: difference; }

/* Gallery (project page) */
.gallery { column-count: 1; column-gap: 16px; }
@media (min-width: 720px) { .gallery { column-count: 2; } }
@media (min-width: 1100px) { .gallery { column-count: 3; } }
.gallery img { width: 100%; display: block; margin-bottom: 16px; break-inside: avoid; cursor: zoom-in; background: var(--ivory-2); }

/* Lightbox */
.lb-mask { background: rgba(8,6,4,.95); }
.lb-img { max-width: 92vw; max-height: 88vh; object-fit: contain; box-shadow: 0 30px 80px rgba(0,0,0,.6); }

/* Form */
.field label { display:block; font-size: 10px; letter-spacing: .26em; text-transform: uppercase; color: var(--muted); margin-bottom: .55rem; font-weight: 500; }
.field input, .field textarea, .field select { width: 100%; background: transparent; border: none; border-bottom: 1px solid rgba(240,233,218,.22); padding: .85rem 0; font-size: 16px; font-family: inherit; color: var(--ivory); outline: none; transition: border-color .25s ease; }
.field input::placeholder, .field textarea::placeholder { color: rgba(240,233,218,.45); }
.field input:focus, .field textarea:focus, .field select:focus { border-bottom-color: var(--brass); }
.field textarea { resize: vertical; min-height: 120px; }
.field select option { background: var(--noir); color: var(--ivory); }

/* Reveal */
.fade-up { opacity: 0; transform: translateY(28px); transition: opacity 1s cubic-bezier(.2,.7,.2,1), transform 1s cubic-bezier(.2,.7,.2,1); }
.fade-up.in { opacity: 1; transform: none; }
.fade-up.delay-1 { transition-delay: .12s; }
.fade-up.delay-2 { transition-delay: .24s; }
.fade-up.delay-3 { transition-delay: .36s; }

/* Wordmark image */
.wordmark { height: 38px; width: auto; display: block; }
.wordmark-lg { height: 100px; width: auto; }
.wordmark-light { filter: invert(1) brightness(1.1); }

/* Numbers */
.metric .num { font-family: 'Cormorant Garamond', serif; font-size: clamp(3rem, 5vw, 4.5rem); line-height: 1; letter-spacing: -0.02em; }

/* RTL */
[dir="rtl"] .hero-headline { letter-spacing: 0; }