/* ═══════════════════════════════════════════════
   WILDERNESS NOIR — Tony In The Wild
   Shared stylesheet · tonythompsonphotos.com
   Deep forest green-black · Gold accents · Sans headlines
   "The forest at 5 AM, not a studio"
   ═══════════════════════════════════════════════ */

@import url('https://fonts.googleapis.com/css2?family=Cormorant+Garamond:ital,wght@0,300;0,400;0,500;0,600;1,300;1,400&family=Outfit:wght@200;300;400;500;600;700&display=swap');

:root {
  --bg: #0C1210;
  --bg-card: #101816;
  --bg-elevated: #16201d;
  --bg-surface: #1a2622;
  --text: #F0EDE6;
  --text-dim: #9a9590;
  --text-muted: #5a5550;
  --gold: #C9A84C;
  --gold-light: #d4ba6a;
  --gold-dim: rgba(201,168,76,0.1);
  --forest: #1a2e28;
  --forest-light: #243d35;
  --border: rgba(255,255,255,0.05);
  --border-light: rgba(255,255,255,0.09);
  --serif: 'Cormorant Garamond', Georgia, serif;
  --sans: 'Outfit', system-ui, sans-serif;
  --ease: cubic-bezier(0.25, 0.46, 0.45, 0.94);
  --ease-out: cubic-bezier(0.19, 1, 0.22, 1);
}

*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body {
  font-family: var(--sans);
  background: var(--bg);
  color: var(--text);
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
img { display:block; max-width:100%; }
a { color:inherit; text-decoration:none; }

/* Grain texture */
body::after {
  content:''; position:fixed; inset:0; pointer-events:none; z-index:9999; opacity:0.018;
  background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size:256px;
}

/* ═══ NAVIGATION ═══ */
.nav {
  position:fixed; top:0; left:0; right:0; z-index:100;
  display:flex; justify-content:space-between; align-items:center;
  padding:1.6rem 5vw;
  transition:all 0.5s var(--ease);
}
.nav.scrolled {
  background:rgba(12,18,16,0.95);
  backdrop-filter:blur(24px); -webkit-backdrop-filter:blur(24px);
  padding:0.9rem 5vw;
  border-bottom:1px solid var(--border);
}
.nav-logo { display:flex; flex-direction:column; gap:1px; }
.nav-name {
  font-family:var(--sans); font-size:1.1rem; font-weight:600;
  letter-spacing:0.18em; text-transform:uppercase; color:var(--text); line-height:1;
}
.nav-tagline {
  font-family:var(--sans); font-size:0.48rem; font-weight:300;
  letter-spacing:0.35em; text-transform:uppercase; color:var(--gold);
}
.nav-links { display:flex; gap:2rem; list-style:none; align-items:center; }
.nav-links a {
  font-size:0.65rem; font-weight:400; letter-spacing:0.18em;
  text-transform:uppercase; color:var(--text-dim);
  position:relative; transition:color 0.3s;
}
.nav-links a::after {
  content:''; position:absolute; bottom:-4px; left:0;
  width:0; height:1px; background:var(--gold);
  transition:width 0.4s var(--ease);
}
.nav-links a:hover { color:var(--text); }
.nav-links a:hover::after { width:100%; }
.nav-links a.active { color:var(--gold); }
.nav-links a.active::after { width:100%; }
.nav-cta {
  padding:0.5rem 1.3rem !important;
  border:1px solid var(--gold) !important;
  color:var(--gold) !important;
  transition:all 0.3s !important;
}
.nav-cta::after { display:none !important; }
.nav-cta:hover { background:var(--gold) !important; color:var(--bg) !important; }

.nav-toggle { display:none; background:none; border:none; cursor:pointer; padding:6px; }
.nav-toggle span { display:block; width:22px; height:1.5px; background:var(--text); margin:5px 0; transition:0.3s; }

/* ═══ HERO ═══ */
.hero {
  position:relative; height:100vh; min-height:650px;
  display:flex; align-items:flex-end; overflow:hidden;
}
.hero-media { position:absolute; inset:0; z-index:0; }
.hero-media img, .hero-media .ph {
  width:100%; height:100%; object-fit:cover;
  animation:slowZoom 25s var(--ease) forwards;
}
@keyframes slowZoom { from{transform:scale(1.06)} to{transform:scale(1)} }
.hero-grad {
  position:absolute; inset:0; z-index:1;
  background:linear-gradient(to top,
    var(--bg) 0%,
    rgba(12,18,16,0.55) 30%,
    rgba(12,18,16,0.02) 60%,
    rgba(12,18,16,0.25) 100%
  );
}
.hero-content {
  position:relative; z-index:2;
  padding:0 5vw 10vh; max-width:780px;
  animation:fadeUp 1s var(--ease-out) 0.3s both;
}
@keyframes fadeUp { from{opacity:0;transform:translateY(30px)} to{opacity:1;transform:translateY(0)} }

.hero-eyebrow {
  font-size:0.6rem; font-weight:400; letter-spacing:0.4em;
  text-transform:uppercase; color:var(--gold); margin-bottom:1.2rem;
  display:flex; align-items:center; gap:0.8rem;
}
.hero-eyebrow::before { content:''; width:30px; height:1px; background:var(--gold); }

.hero-title {
  font-family:var(--sans); font-size:clamp(2.6rem,5vw,4.2rem);
  font-weight:300; line-height:1.1; margin-bottom:1.2rem;
  letter-spacing:-0.01em;
}
.hero-title em { font-family:var(--serif); font-style:italic; color:var(--gold-light); font-weight:300; }

.hero-sub {
  font-size:0.9rem; font-weight:200; line-height:1.75;
  color:var(--text-dim); max-width:460px; margin-bottom:2.2rem;
}

/* Buttons */
.btn {
  display:inline-flex; align-items:center; gap:0.65rem;
  padding:0.85rem 1.8rem; font-family:var(--sans);
  font-size:0.65rem; font-weight:500; letter-spacing:0.18em;
  text-transform:uppercase; border:none; cursor:pointer;
  transition:all 0.4s var(--ease);
}
.btn-gold { background:var(--gold); color:var(--bg); }
.btn-gold:hover { background:var(--gold-light); transform:translateY(-2px); box-shadow:0 8px 25px rgba(201,168,76,0.2); }
.btn-outline { background:transparent; border:1px solid var(--border-light); color:var(--text-dim); }
.btn-outline:hover { border-color:var(--gold); color:var(--gold); }
.btn-ghost { background:transparent; color:var(--text-dim); padding:0.85rem 0; margin-left:1.2rem; }
.btn-ghost:hover { color:var(--gold); }
.btn svg { width:13px; height:13px; }

.hero-scroll {
  position:absolute; bottom:2.5rem; right:5vw; z-index:2;
  display:flex; flex-direction:column; align-items:center; gap:0.6rem;
  animation:fadeUp 1s var(--ease-out) 0.8s both;
}
.hero-scroll span { font-size:0.5rem; letter-spacing:0.3em; text-transform:uppercase; color:var(--text-muted); writing-mode:vertical-rl; }
.scroll-bar { width:1px; height:40px; background:var(--text-muted); position:relative; overflow:hidden; }
.scroll-bar::after { content:''; position:absolute; top:-100%; left:0; width:100%; height:100%; background:var(--gold); animation:scrollD 2s ease-in-out infinite; }
@keyframes scrollD { 0%{top:-100%} 50%{top:100%} 100%{top:100%} }

/* ═══ PAGE HEADERS (inner pages) ═══ */
.page-header {
  padding:10rem 5vw 4rem;
  position:relative;
}
.page-header-eyebrow {
  font-size:0.6rem; font-weight:400; letter-spacing:0.4em;
  text-transform:uppercase; color:var(--gold); margin-bottom:1rem;
  display:flex; align-items:center; gap:0.8rem;
}
.page-header-eyebrow::before { content:''; width:30px; height:1px; background:var(--gold); }
.page-header h1 {
  font-family:var(--sans); font-size:clamp(2.2rem,4vw,3.5rem);
  font-weight:300; line-height:1.12; margin-bottom:1rem;
  letter-spacing:-0.01em;
}
.page-header h1 em { font-family:var(--serif); font-style:italic; color:var(--gold-light); }
.page-header p {
  font-size:0.92rem; font-weight:200; line-height:1.8;
  color:var(--text-dim); max-width:560px;
}

/* ═══ SECTIONS ═══ */
.section { padding:5rem 5vw; }
.section-lg { padding:6rem 5vw 7rem; }
.section-dark { background:var(--bg-card); }

/* ═══ MEET / INTRO ═══ */
.meet { padding:7rem 5vw 5rem; text-align:center; }
.meet p {
  font-family:var(--serif); font-size:clamp(1.15rem,2vw,1.55rem);
  font-weight:300; font-style:italic; line-height:1.7;
  color:var(--text-dim); max-width:650px; margin:0 auto;
}
.meet p strong { color:var(--text); font-weight:400; font-style:normal; }
.meet-line { width:45px; height:1.5px; background:var(--gold); margin:1.8rem auto 0; border-radius:1px; }

/* ═══ GALLERY GRID ═══ */
.galleries-grid {
  display:grid; grid-template-columns:1fr 1fr; gap:0.5rem;
}
.galleries-3 {
  grid-template-columns:repeat(3,1fr);
}
.gallery-card {
  position:relative; overflow:hidden; cursor:pointer;
  aspect-ratio:16/10; display:block;
}
.gallery-card img, .gallery-card .ph {
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.8s var(--ease);
}
.gallery-card:hover img, .gallery-card:hover .ph { transform:scale(1.05); }
.gallery-card-overlay {
  position:absolute; inset:0;
  background:linear-gradient(to top, rgba(12,18,16,0.85) 0%, transparent 45%);
  display:flex; flex-direction:column; justify-content:flex-end;
  padding:1.8rem; opacity:0; transition:opacity 0.5s var(--ease);
}
.gallery-card:hover .gallery-card-overlay { opacity:1; }
.gallery-card-title { font-family:var(--sans); font-size:1.3rem; font-weight:500; letter-spacing:0.02em; }
.gallery-card-sub { font-size:0.6rem; font-weight:300; letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-top:0.25rem; }

/* ═══ PRINTS GRID ═══ */
.prints-grid {
  display:grid; grid-template-columns:repeat(2,1fr); gap:0.5rem;
}
.print-card {
  position:relative; overflow:hidden; cursor:pointer;
  aspect-ratio:4/3; display:block;
}
.print-card img, .print-card .ph {
  width:100%; height:100%; object-fit:cover;
  transition:transform 0.7s var(--ease);
}
.print-card:hover img, .print-card:hover .ph { transform:scale(1.04); }
.print-card-info {
  position:absolute; bottom:0; left:0; right:0; padding:1.3rem;
  background:linear-gradient(to top, rgba(12,18,16,0.92) 0%, transparent 100%);
  transform:translateY(100%); transition:transform 0.5s var(--ease);
}
.print-card:hover .print-card-info { transform:translateY(0); }
.print-card-name { font-family:var(--sans); font-size:0.95rem; font-weight:400; }
.print-card-price { font-size:0.85rem; color:var(--gold); margin-top:0.2rem; }

/* ═══ TWO-COLUMN LAYOUT ═══ */
.two-col {
  display:grid; grid-template-columns:1fr 1.1fr;
  gap:5rem; align-items:center;
}
.two-col-reverse { grid-template-columns:1.1fr 1fr; }
.two-col img, .two-col .ph {
  width:100%; aspect-ratio:3/4; object-fit:cover; border-radius:2px;
}

/* ═══ SPECIES GRID (Mission page) ═══ */
.species-grid {
  display:grid; grid-template-columns:repeat(4,1fr); gap:1rem;
}
.species-card {
  background:var(--bg-card); border:1px solid var(--border);
  padding:1.6rem; border-radius:2px;
  transition:border-color 0.3s, transform 0.4s var(--ease);
}
.species-card:hover { border-color:var(--border-light); transform:translateY(-3px); }
.species-num {
  font-family:var(--sans); font-size:0.55rem; font-weight:600;
  letter-spacing:0.2em; text-transform:uppercase; color:var(--gold); margin-bottom:0.8rem;
}
.species-name {
  font-family:var(--sans); font-size:1.1rem; font-weight:500; margin-bottom:0.3rem;
}
.species-range {
  font-size:0.7rem; font-weight:300; color:var(--text-dim); margin-bottom:0.8rem;
}
.species-status {
  display:inline-block; font-size:0.5rem; font-weight:400;
  letter-spacing:0.15em; text-transform:uppercase;
  padding:0.2rem 0.6rem; border-radius:1px;
}
.status-done { background:rgba(201,168,76,0.15); color:var(--gold); }
.status-planned { background:rgba(100,180,140,0.12); color:#6ab48c; }
.status-future { background:rgba(255,255,255,0.05); color:var(--text-muted); }

/* ═══ WORKSHOP CARDS ═══ */
.ws-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.ws-card {
  background:var(--bg-card); border:1px solid var(--border);
  padding:1.8rem; border-radius:2px;
  transition:border-color 0.3s, transform 0.4s var(--ease);
}
.ws-card:hover { border-color:var(--border-light); transform:translateY(-3px); }
.ws-tag {
  display:inline-block; font-size:0.48rem; font-weight:500;
  letter-spacing:0.2em; text-transform:uppercase;
  color:var(--gold); padding:0.2rem 0.6rem;
  border:1px solid var(--gold); margin-bottom:1rem;
}
.ws-title { font-family:var(--sans); font-size:1.2rem; font-weight:500; margin-bottom:0.4rem; }
.ws-desc { font-size:0.78rem; font-weight:200; line-height:1.65; color:var(--text-dim); margin-bottom:1.3rem; }
.ws-footer {
  display:flex; justify-content:space-between; align-items:center;
  padding-top:0.9rem; border-top:1px solid var(--border);
}
.ws-price { font-size:1rem; font-weight:400; color:var(--gold); }
.ws-link { font-size:0.6rem; font-weight:400; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-dim); transition:color 0.3s; }
.ws-link:hover { color:var(--gold); }

/* ═══ PARTNER CARDS ═══ */
.partner-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
.partner-card {
  background:var(--bg-card); border:1px solid var(--border);
  padding:2rem; border-radius:2px;
}
.partner-name { font-family:var(--sans); font-size:1.1rem; font-weight:500; margin-bottom:0.3rem; }
.partner-region { font-size:0.6rem; font-weight:300; letter-spacing:0.15em; text-transform:uppercase; color:var(--gold); margin-bottom:0.8rem; }
.partner-desc { font-size:0.8rem; font-weight:200; line-height:1.7; color:var(--text-dim); }

/* ═══ QUOTE ═══ */
.quote { padding:5rem 5vw; text-align:center; }
.quote blockquote {
  font-family:var(--serif); font-size:clamp(1.2rem,2.3vw,1.9rem);
  font-weight:300; font-style:italic; line-height:1.55;
  color:var(--text); max-width:680px; margin:0 auto;
  position:relative;
}
.quote blockquote::before {
  content:'\201C'; font-family:var(--serif); font-size:4.5rem;
  color:var(--gold); opacity:0.2; position:absolute;
  top:-1.5rem; left:-1.2rem; line-height:1;
}

/* ═══ SECTION HEADERS ═══ */
.sh { text-align:center; margin-bottom:3.5rem; }
.sh h2 {
  font-family:var(--sans); font-size:clamp(1.8rem,3vw,2.6rem);
  font-weight:300; margin-bottom:0.7rem; letter-spacing:-0.01em;
}
.sh p {
  font-size:0.88rem; font-weight:200; line-height:1.7;
  color:var(--text-dim); max-width:480px; margin:0 auto;
}

/* ═══ NEWSLETTER ═══ */
.newsletter { padding:5rem 5vw 6rem; text-align:center; border-top:1px solid var(--border); }
.newsletter h2 {
  font-family:var(--sans); font-size:clamp(1.6rem,2.5vw,2.2rem);
  font-weight:300; margin-bottom:0.5rem;
}
.newsletter p { font-size:0.85rem; font-weight:200; line-height:1.7; color:var(--text-dim); max-width:420px; margin:0 auto 1.8rem; }
.nl-form { display:flex; gap:0; max-width:400px; margin:0 auto; }
.nl-form input {
  flex:1; padding:0.8rem 1.2rem; background:var(--bg-elevated);
  border:1px solid var(--border-light); border-right:none;
  color:var(--text); font-family:var(--sans); font-size:0.78rem;
  font-weight:300; outline:none; transition:border-color 0.3s;
}
.nl-form input::placeholder { color:var(--text-muted); }
.nl-form input:focus { border-color:var(--gold); }
.nl-form button {
  padding:0.8rem 1.4rem; background:var(--gold); color:var(--bg);
  border:1px solid var(--gold); font-family:var(--sans);
  font-size:0.6rem; font-weight:500; letter-spacing:0.15em;
  text-transform:uppercase; cursor:pointer; transition:0.3s; white-space:nowrap;
}
.nl-form button:hover { background:var(--gold-light); }
.social-links { display:flex; justify-content:center; gap:2rem; margin-top:2rem; }
.social-links a {
  font-size:0.6rem; font-weight:300; letter-spacing:0.2em;
  text-transform:uppercase; color:var(--text-muted); transition:color 0.3s;
}
.social-links a:hover { color:var(--gold); }

/* ═══ CONTACT FORM ═══ */
.contact-form { max-width:520px; }
.form-group { margin-bottom:1.2rem; }
.form-label {
  display:block; font-size:0.6rem; font-weight:400;
  letter-spacing:0.15em; text-transform:uppercase;
  color:var(--text-dim); margin-bottom:0.4rem;
}
.form-input, .form-textarea {
  width:100%; padding:0.85rem 1rem; background:var(--bg-elevated);
  border:1px solid var(--border-light); color:var(--text);
  font-family:var(--sans); font-size:0.85rem; font-weight:300;
  outline:none; transition:border-color 0.3s;
}
.form-input:focus, .form-textarea:focus { border-color:var(--gold); }
.form-textarea { min-height:140px; resize:vertical; }
.form-input::placeholder, .form-textarea::placeholder { color:var(--text-muted); }

/* ═══ STATS ROW ═══ */
.stats { display:flex; gap:2.5rem; }
.stat-num { font-family:var(--sans); font-size:2rem; font-weight:300; color:var(--gold); }
.stat-label { font-size:0.55rem; font-weight:400; letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted); margin-top:0.1rem; }

/* ═══ FOOTER ═══ */
.footer {
  padding:2.5rem 5vw; border-top:1px solid var(--border);
  display:flex; justify-content:space-between; align-items:center;
}
.footer-copy { font-size:0.6rem; font-weight:300; color:var(--text-muted); }
.footer-links { display:flex; gap:1.5rem; }
.footer-links a {
  font-size:0.55rem; font-weight:300; letter-spacing:0.15em;
  text-transform:uppercase; color:var(--text-muted); transition:color 0.3s;
}
.footer-links a:hover { color:var(--gold); }

/* ═══ UTILITIES ═══ */
.reveal { opacity:0; transform:translateY(25px); transition:opacity 0.7s var(--ease),transform 0.7s var(--ease); }
.reveal.visible { opacity:1; transform:translateY(0); }
.reveal-d1{transition-delay:.1s}.reveal-d2{transition-delay:.2s}.reveal-d3{transition-delay:.3s}.reveal-d4{transition-delay:.4s}
.text-gold { color:var(--gold); }
.text-dim { color:var(--text-dim); }
.text-center { text-align:center; }
.mt-1{margin-top:0.5rem}.mt-2{margin-top:1rem}.mt-3{margin-top:1.5rem}.mt-4{margin-top:2.5rem}.mt-5{margin-top:3.5rem}
.mb-1{margin-bottom:0.5rem}.mb-2{margin-bottom:1rem}.mb-3{margin-bottom:1.5rem}
.max-w-sm{max-width:480px}.max-w-md{max-width:600px}.max-w-lg{max-width:720px}

.ph {
  background:var(--bg-elevated); display:flex; align-items:center; justify-content:center;
  color:var(--text-muted); font-size:0.6rem; letter-spacing:0.1em;
  text-transform:uppercase; font-family:var(--sans); text-align:center; padding:1rem;
}

/* ═══ RESPONSIVE ═══ */
@media(max-width:1024px){
  .galleries-grid{grid-template-columns:1fr 1fr}
  .galleries-3{grid-template-columns:1fr 1fr}
  .prints-grid{grid-template-columns:repeat(2,1fr)}
  .two-col,.two-col-reverse{grid-template-columns:1fr;gap:3rem}
  .species-grid{grid-template-columns:repeat(2,1fr)}
  .ws-grid{grid-template-columns:1fr 1fr}
  .partner-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:768px){
  .nav{padding:1.1rem 1.5rem}
  .nav-links{display:none}
  .nav-toggle{display:block}
  .nav-links.open{display:flex;flex-direction:column;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(12,18,16,0.97);backdrop-filter:blur(20px);justify-content:center;align-items:center;gap:2rem;z-index:999}
  .nav-links.open a{font-size:0.85rem;color:var(--text)}
  .hero-content{padding:0 1.5rem 8vh}
  .hero-scroll{display:none}
  .page-header{padding:8rem 1.5rem 3rem}
  .section,.section-lg{padding:3.5rem 1.5rem}
  .galleries-grid{grid-template-columns:1fr}
  .galleries-3{grid-template-columns:1fr}
  .prints-grid{grid-template-columns:1fr}
  .species-grid{grid-template-columns:1fr}
  .ws-grid{grid-template-columns:1fr}
  .partner-grid{grid-template-columns:1fr}
  .stats{gap:1.5rem}
  .nl-form{flex-direction:column}
  .nl-form input{border-right:1px solid var(--border-light)}
  .footer{flex-direction:column;gap:1rem;text-align:center}
}

/* ═══ IMAGE PROTECTION ═══ */
img {
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  pointer-events: none;
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  -webkit-touch-callout: none;
}
.gallery-card, .print-card, .about-portrait, .two-col > div:first-child {
  position: relative;
}
.gallery-card::after, .print-card::after, .about-portrait::after {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 2;
  background: transparent;
  pointer-events: auto;
}
.gallery-card-overlay, .print-card-info {
  z-index: 3;
  position: relative;
}
/* Hero image force-fill */
.hero-media img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  pointer-events: none;
}
