/* ============================================================
   POCKET HUNTERS — The Lodge
   A hunting-lodge aesthetic: leather, brass, parchment, gunsmoke
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Playfair+Display:ital,wght@0,400;0,600;0,700;0,800;0,900;1,400;1,600&family=Cinzel:wght@400;500;600;700&family=Source+Sans+3:ital,wght@0,300;0,400;0,600;0,700;1,300;1,400&display=swap');

/* ---------- CSS Custom Properties ---------- */
:root {
  --forest-deep:    #1a2f1a;
  --forest:         #2d4a2d;
  --forest-light:   #3d6b3d;
  --burnt-orange:   #c4652a;
  --orange-light:   #d4783a;
  --orange-glow:    #e8944d;
  --leather-dark:   #3d2b1f;
  --leather:        #6b4226;
  --leather-light:  #8b5e3c;
  --brass:          #b8860b;
  --brass-light:    #d4a843;
  --gold:           #c9a84c;
  --parchment:      #f5f0e8;
  --parchment-dark: #ede6d6;
  --cream:          #faf7f2;
  --charcoal:       #1a1714;
  --charcoal-warm:  #2a2420;
  --smoke:          #4a433d;
  --text-dark:      #1a1714;
  --text-body:      #3a3530;
  --text-light:     #f5f0e8;
  --text-muted:     #8a8078;

  --font-display: 'Playfair Display', Georgia, serif;
  --font-nav:     'Cinzel', 'Times New Roman', serif;
  --font-body:    'Source Sans 3', 'Segoe UI', sans-serif;

  --shadow-sm:   0 1px 3px rgba(0,0,0,.12), 0 1px 2px rgba(0,0,0,.18);
  --shadow-md:   0 4px 12px rgba(0,0,0,.15), 0 2px 4px rgba(0,0,0,.12);
  --shadow-lg:   0 10px 40px rgba(0,0,0,.25), 0 4px 12px rgba(0,0,0,.15);
  --shadow-brass: 0 2px 8px rgba(184,134,11,.3);

  --transition: .3s cubic-bezier(.4,0,.2,1);
  --transition-slow: .6s cubic-bezier(.4,0,.2,1);
}

/* ---------- Reset & Base ---------- */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }

html {
  scroll-behavior: smooth;
  font-size: 16px;
  overflow-x: hidden;
}

body {
  font-family: var(--font-body);
  color: var(--text-body);
  background: var(--parchment);
  line-height: 1.7;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
}

/* Parchment texture overlay on body */
body::before {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
  background-image:
    url("data:image/svg+xml,%3Csvg width='200' height='200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.65' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.03'/%3E%3C/svg%3E");
  opacity: .5;
}

img { max-width: 100%; display: block; }
a { color: inherit; text-decoration: none; }
ul, ol { list-style: none; }
button { font-family: inherit; cursor: pointer; border: none; background: none; }

/* ---------- Typography ---------- */
h1, h2, h3, h4 {
  font-family: var(--font-display);
  font-weight: 700;
  line-height: 1.2;
  color: var(--text-dark);
}

h1 { font-size: clamp(2.2rem, 5vw, 3.8rem); }
h2 { font-size: clamp(1.6rem, 3.5vw, 2.6rem); }
h3 { font-size: clamp(1.2rem, 2.5vw, 1.6rem); }

.section-subtitle {
  font-family: var(--font-nav);
  font-size: .75rem;
  letter-spacing: .25em;
  text-transform: uppercase;
  color: var(--burnt-orange);
  margin-bottom: .5rem;
}

/* ---------- Decorative SVG Elements ---------- */

/* Shotgun shell SVG — used as decorative element */
.decor-shell {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 40 40'%3E%3Ccircle cx='20' cy='20' r='18' fill='none' stroke='%23b8860b' stroke-width='2'/%3E%3Ccircle cx='20' cy='20' r='12' fill='none' stroke='%23b8860b' stroke-width='1.5'/%3E%3Ccircle cx='20' cy='20' r='4' fill='%23b8860b'/%3E%3C/svg%3E") center/contain no-repeat;
}

.decor-shell-lg {
  width: 48px;
  height: 48px;
}

/* Feather decorative divider */
.feather-divider {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin: 2rem 0;
  opacity: .6;
}

.feather-divider::before,
.feather-divider::after {
  content: '';
  height: 1px;
  flex: 1;
  max-width: 200px;
  background: linear-gradient(90deg, transparent, var(--brass), transparent);
}

.feather-divider .feather-icon {
  width: 60px;
  height: 40px;
  background: url("../feather.svg") center/contain no-repeat;
}

/* Crossed shotguns decorative element */
.crossed-guns {
  width: 80px;
  height: 50px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 60'%3E%3Cline x1='10' y1='55' x2='90' y2='5' stroke='%23b8860b' stroke-width='3' stroke-linecap='round'/%3E%3Cline x1='90' y1='55' x2='10' y2='5' stroke='%23b8860b' stroke-width='3' stroke-linecap='round'/%3E%3Ccircle cx='50' cy='30' r='5' fill='none' stroke='%23b8860b' stroke-width='1.5'/%3E%3Crect x='5' y='50' width='12' height='8' rx='2' fill='%23b8860b' opacity='.5' transform='rotate(-30 11 54)'/%3E%3Crect x='83' y='50' width='12' height='8' rx='2' fill='%23b8860b' opacity='.5' transform='rotate(30 89 54)'/%3E%3C/svg%3E") center/contain no-repeat;
  margin: 0 auto;
}

/* English Pointer silhouette */
.pointer-silhouette {
  width: 120px;
  height: 70px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 120'%3E%3Cpath d='M20 85 C20 75 25 65 35 60 L50 55 C55 50 58 42 65 38 L80 35 C85 32 95 30 105 32 L115 35 C120 37 125 40 130 38 L145 32 C150 30 158 28 165 30 L175 35 C180 38 182 42 180 48 L178 55 C176 60 172 62 170 60 L168 55 C167 52 165 50 163 52 L160 58 L158 70 L162 82 L165 90 C166 93 164 95 161 95 L155 95 C153 95 151 93 151 90 L150 80 L145 72 L135 72 L130 80 L129 90 C129 93 127 95 124 95 L118 95 C115 95 113 93 114 90 L118 80 L115 72 L80 70 L70 75 L65 82 L68 90 C69 93 67 95 64 95 L58 95 C55 95 53 93 53 90 L55 80 L50 72 L42 72 L38 80 L37 90 C37 93 35 95 32 95 L26 95 C23 95 21 93 22 90 L25 80 Z' fill='%23b8860b' opacity='.3'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Pheasant in flight */
.pheasant-flight {
  width: 60px;
  height: 40px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 50'%3E%3Cpath d='M10 30 C15 25 22 18 30 15 C35 20 38 12 45 8 C48 6 52 5 55 8 C58 11 56 15 52 18 L48 22 C50 24 55 28 60 30 C65 32 72 35 78 38' fill='none' stroke='%23b8860b' stroke-width='1.5' stroke-linecap='round'/%3E%3Cpath d='M30 15 C28 18 25 22 22 25' fill='none' stroke='%23b8860b' stroke-width='1'/%3E%3Ccircle cx='53' cy='10' r='1.5' fill='%23b8860b'/%3E%3C/svg%3E") center/contain no-repeat;
}

/* Wheat grass pattern (bottom border) */
.grass-border {
  height: 40px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 200 40' preserveAspectRatio='none'%3E%3Cpath d='M0 40 L5 25 L10 40 L15 20 L20 40 L25 28 L30 40 L35 18 L40 40 L45 22 L50 40 L55 26 L60 40 L65 15 L70 40 L75 24 L80 40 L85 20 L90 40 L95 28 L100 40 L105 22 L110 40 L115 18 L120 40 L125 25 L130 40 L135 20 L140 40 L145 28 L150 40 L155 18 L160 40 L165 24 L170 40 L175 20 L180 40 L185 26 L190 40 L195 22 L200 40Z' fill='%232d4a2d' opacity='.15'/%3E%3C/svg%3E") repeat-x bottom/200px 40px;
}

/* ---------- Page Transition ---------- */
.page-wrapper {
  position: relative;
  z-index: 1;
  animation: pageIn .6s ease-out;
}

@keyframes pageIn {
  from { opacity: 0; transform: translateY(12px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* ---------- Navigation ---------- */
.main-nav {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  width: 100%;
  z-index: 1000;
  background: linear-gradient(180deg, var(--charcoal) 0%, var(--charcoal-warm) 100%);
  border-bottom: 2px solid var(--brass);
  box-shadow: 0 2px 20px rgba(0,0,0,.4);
  transition: var(--transition);
}

.main-nav::after {
  content: '';
  position: absolute;
  bottom: -4px;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg,
    transparent,
    rgba(184,134,11,.3) 20%,
    rgba(184,134,11,.6) 50%,
    rgba(184,134,11,.3) 80%,
    transparent
  );
}

.nav-inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 2rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 72px;
}

.nav-logo {
  display: flex;
  align-items: center;
  gap: .75rem;
  flex-shrink: 0;
  margin-right: 1.5rem;
}

.nav-logo img {
  height: 32px;
  width: auto;
  filter: drop-shadow(0 1px 3px rgba(184,134,11,.3));
}

.nav-logo-text {
  font-family: var(--font-display);
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: .04em;
  color: var(--brass-light);
  font-variant: small-caps;
  line-height: 1;
}

.nav-links {
  display: flex;
  align-items: center;
  gap: .25rem;
}

.nav-links a {
  font-family: var(--font-nav);
  font-size: .72rem;
  font-weight: 500;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--parchment-dark);
  padding: .5rem .9rem;
  border-radius: 2px;
  transition: var(--transition);
  position: relative;
  white-space: nowrap;
}

.nav-links a::after {
  content: '';
  position: absolute;
  bottom: 2px;
  left: 50%;
  width: 0;
  height: 1px;
  background: var(--brass);
  transition: var(--transition);
  transform: translateX(-50%);
}

.nav-links a:hover {
  color: var(--brass-light);
}

.nav-links a:hover::after {
  width: 60%;
}

.nav-links a.active {
  color: var(--brass-light);
}

.nav-links a.active::after {
  width: 60%;
}

/* Nav separator dots */
.nav-links .nav-dot {
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: var(--smoke);
  display: inline-block;
}

/* Mobile hamburger */
.nav-toggle {
  display: none;
  flex-direction: column;
  gap: 5px;
  padding: .5rem;
  cursor: pointer;
}

.nav-toggle span {
  width: 24px;
  height: 2px;
  background: var(--brass-light);
  transition: var(--transition);
  border-radius: 1px;
}

.nav-toggle.active span:nth-child(1) { transform: rotate(45deg) translate(5px, 5px); }
.nav-toggle.active span:nth-child(2) { opacity: 0; }
.nav-toggle.active span:nth-child(3) { transform: rotate(-45deg) translate(5px, -5px); }

/* ---------- Auth Modal ---------- */
.auth-overlay {
  position: fixed;
  inset: 0;
  z-index: 9999;
  background: rgba(26,23,20,.92);
  display: flex;
  align-items: center;
  justify-content: center;
  backdrop-filter: blur(8px);
  animation: fadeIn .3s ease;
}

@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.auth-modal {
  background: linear-gradient(145deg, var(--charcoal-warm), var(--charcoal));
  border: 1px solid var(--brass);
  border-radius: 8px;
  padding: 3rem 2.5rem;
  max-width: 420px;
  width: 90%;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0,0,0,.5), 0 0 30px rgba(184,134,11,.1);
  position: relative;
  overflow: hidden;
}

.auth-modal::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--burnt-orange), var(--brass), var(--burnt-orange));
}

.auth-modal .auth-logo {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  border: 2px solid var(--brass);
  margin: 0 auto 1.5rem;
  box-shadow: var(--shadow-brass);
  object-fit: cover;
}

.auth-modal h2 {
  font-family: var(--font-nav);
  font-size: 1rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  color: var(--brass-light);
  margin-bottom: .5rem;
}

.auth-modal p {
  color: var(--text-muted);
  font-size: .9rem;
  margin-bottom: 1.5rem;
}

.auth-input-wrap {
  position: relative;
  margin-bottom: 1rem;
}

.auth-input-wrap input {
  width: 100%;
  padding: .85rem 1.2rem;
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(184,134,11,.3);
  border-radius: 4px;
  color: var(--parchment);
  font-family: var(--font-body);
  font-size: 1rem;
  outline: none;
  transition: var(--transition);
}

.auth-input-wrap input::placeholder {
  color: var(--text-muted);
}

.auth-input-wrap input:focus {
  border-color: var(--brass);
  box-shadow: 0 0 0 3px rgba(184,134,11,.15);
}

.auth-btn {
  width: 100%;
  padding: .85rem;
  background: linear-gradient(135deg, var(--burnt-orange), var(--leather));
  color: var(--parchment);
  font-family: var(--font-nav);
  font-size: .8rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  transition: var(--transition);
  box-shadow: var(--shadow-md);
}

.auth-btn:hover {
  background: linear-gradient(135deg, var(--orange-light), var(--burnt-orange));
  transform: translateY(-1px);
  box-shadow: var(--shadow-lg);
}

.auth-error {
  color: #c0392b;
  font-size: .85rem;
  margin-top: .75rem;
  display: none;
}

.auth-error.visible {
  display: block;
}

/* ---------- Hero Section (Home) ---------- */
.hero {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  overflow: hidden;
  background: var(--charcoal);
}

.hero-bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(ellipse at 30% 50%, rgba(45,74,45,.4) 0%, transparent 60%),
    radial-gradient(ellipse at 70% 30%, rgba(196,101,42,.15) 0%, transparent 50%),
    linear-gradient(180deg, var(--charcoal) 0%, var(--leather-dark) 50%, var(--forest-deep) 100%);
}

/* Animated grain overlay */
.hero-grain {
  position: absolute;
  inset: 0;
  background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noise'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.8' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noise)' opacity='.04'/%3E%3C/svg%3E");
  pointer-events: none;
}

/* Grass silhouette at bottom of hero */
.hero-grass {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 120px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 120' preserveAspectRatio='none'%3E%3Cpath d='M0 120 L0 80 L8 50 L12 80 L18 35 L22 75 L28 45 L32 80 L38 30 L42 70 L48 40 L52 80 L58 55 L62 75 L68 25 L72 65 L78 40 L82 80 L88 50 L92 75 L98 35 L102 70 L108 45 L112 80 L118 30 L122 65 L128 40 L132 80 L138 55 L142 75 L148 20 L152 60 L158 40 L162 80 L168 50 L172 75 L178 35 L182 70 L188 45 L192 80 L198 30 L202 65 L208 40 L212 80 L218 55 L222 75 L228 25 L232 65 L238 40 L242 80 L248 50 L252 75 L258 35 L262 70 L268 45 L272 80 L278 30 L282 65 L288 40 L292 80 L298 55 L302 75 L308 20 L312 60 L318 40 L322 80 L328 50 L332 75 L338 35 L342 70 L348 45 L352 80 L358 30 L362 65 L368 40 L372 80 L378 55 L382 75 L388 25 L392 65 L398 40 L402 80 L408 50 L412 75 L418 35 L422 70 L428 45 L432 80 L438 30 L442 65 L448 40 L452 80 L458 55 L462 75 L468 20 L472 60 L478 40 L482 80 L488 50 L492 75 L498 35 L502 70 L508 45 L512 80 L518 30 L522 65 L528 40 L532 80 L538 55 L542 75 L548 25 L552 65 L558 40 L562 80 L568 50 L572 75 L578 35 L582 70 L588 45 L592 80 L598 30 L602 65 L608 40 L612 80 L618 55 L622 75 L628 20 L632 60 L638 40 L642 80 L648 50 L652 75 L658 35 L662 70 L668 45 L672 80 L678 30 L682 65 L688 40 L692 80 L698 55 L702 75 L708 25 L712 65 L718 40 L722 80 L728 50 L732 75 L738 35 L742 70 L748 45 L752 80 L758 30 L762 65 L768 40 L772 80 L778 55 L782 75 L788 20 L792 60 L798 40 L802 80 L808 50 L812 75 L818 35 L822 70 L828 45 L832 80 L838 30 L842 65 L848 40 L852 80 L858 55 L862 75 L868 25 L872 65 L878 40 L882 80 L888 50 L892 75 L898 35 L902 70 L908 45 L912 80 L918 30 L922 65 L928 40 L932 80 L938 55 L942 75 L948 20 L952 60 L958 40 L962 80 L968 50 L972 75 L978 35 L982 70 L988 45 L992 80 L998 30 L1002 65 L1008 40 L1012 80 L1018 55 L1022 75 L1028 25 L1032 65 L1038 40 L1042 80 L1048 50 L1052 75 L1058 35 L1062 70 L1068 45 L1072 80 L1078 30 L1082 65 L1088 40 L1092 80 L1098 55 L1102 75 L1108 20 L1112 60 L1118 40 L1122 80 L1128 50 L1132 75 L1138 35 L1142 70 L1148 45 L1152 80 L1158 30 L1162 65 L1168 40 L1172 80 L1178 55 L1182 75 L1188 25 L1192 65 L1198 40 L1202 80 L1208 50 L1212 75 L1218 35 L1222 70 L1228 45 L1232 80 L1238 30 L1242 65 L1248 40 L1252 80 L1258 55 L1262 75 L1268 20 L1272 60 L1278 40 L1282 80 L1288 50 L1292 75 L1298 35 L1302 70 L1308 45 L1312 80 L1318 30 L1322 65 L1328 40 L1332 80 L1338 55 L1342 75 L1348 25 L1352 65 L1358 40 L1362 80 L1368 50 L1372 75 L1378 35 L1382 70 L1388 45 L1392 80 L1398 30 L1402 65 L1408 40 L1412 80 L1418 55 L1422 75 L1428 25 L1432 65 L1438 40 L1440 50 L1440 120Z' fill='%231a1714'/%3E%3C/svg%3E") repeat-x bottom/1440px 120px;
  pointer-events: none;
}

.hero-content {
  position: relative;
  z-index: 2;
  text-align: center;
  padding: 2rem;
  max-width: 800px;
}

.hero-logo {
  width: 180px;
  height: 180px;
  border-radius: 50%;
  border: 3px solid var(--brass);
  box-shadow:
    0 0 40px rgba(184,134,11,.2),
    0 0 80px rgba(184,134,11,.1),
    var(--shadow-lg);
  margin: 0 auto 2rem;
  animation: logoReveal 1s ease-out;
  object-fit: cover;
}

@keyframes logoReveal {
  from { opacity: 0; transform: scale(.8); }
  to   { opacity: 1; transform: scale(1); }
}

.hero h1 {
  font-family: var(--font-nav);
  letter-spacing: .15em;
  color: var(--parchment);
  margin-bottom: .75rem;
  animation: fadeUp .8s ease-out .2s both;
}

.hero-tagline {
  font-family: var(--font-display);
  font-style: italic;
  font-size: clamp(1rem, 2.5vw, 1.4rem);
  color: var(--brass-light);
  margin-bottom: 2rem;
  animation: fadeUp .8s ease-out .4s both;
}

@keyframes fadeUp {
  from { opacity: 0; transform: translateY(20px); }
  to   { opacity: 1; transform: translateY(0); }
}

.hero-cta {
  display: inline-flex;
  align-items: center;
  gap: .75rem;
  padding: 1rem 2.5rem;
  background: linear-gradient(135deg, var(--burnt-orange), var(--leather));
  color: var(--parchment);
  font-family: var(--font-nav);
  font-size: .8rem;
  letter-spacing: .2em;
  text-transform: uppercase;
  border-radius: 4px;
  box-shadow: var(--shadow-lg);
  transition: var(--transition);
  animation: fadeUp .8s ease-out .6s both;
}

.hero-cta:hover {
  background: linear-gradient(135deg, var(--orange-light), var(--burnt-orange));
  transform: translateY(-2px);
  box-shadow: 0 12px 40px rgba(196,101,42,.3);
}

/* Floating decorative elements on hero */
.hero-decor {
  position: absolute;
  pointer-events: none;
  opacity: .08;
}

.hero-decor-1 {
  top: 15%;
  left: 8%;
  width: 200px;
  height: 120px;
  animation: float 8s ease-in-out infinite;
}

.hero-decor-2 {
  bottom: 20%;
  right: 10%;
  width: 160px;
  height: 100px;
  animation: float 10s ease-in-out 2s infinite;
}

.hero-decor-3 {
  top: 25%;
  right: 15%;
  width: 100px;
  height: 65px;
  animation: float 7s ease-in-out 4s infinite;
}

@keyframes float {
  0%, 100% { transform: translateY(0) rotate(0deg); }
  50%      { transform: translateY(-15px) rotate(3deg); }
}

/* ---------- Home Feature Cards ---------- */
.home-features {
  padding: 5rem 2rem;
  background: var(--parchment);
  position: relative;
}

.home-features::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100px;
  background: linear-gradient(180deg, var(--charcoal), transparent);
  pointer-events: none;
}

.features-grid {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
  padding-top: 3rem;
}

.feature-card {
  background: var(--cream);
  border: 1px solid rgba(184,134,11,.2);
  border-radius: 6px;
  padding: 2rem;
  text-align: center;
  transition: var(--transition);
  position: relative;
  overflow: hidden;
}

.feature-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: linear-gradient(90deg, var(--forest), var(--brass), var(--forest));
  opacity: 0;
  transition: var(--transition);
}

.feature-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  border-color: var(--brass);
}

.feature-card:hover::before {
  opacity: 1;
}

.feature-card .card-icon {
  width: 48px;
  height: 48px;
  margin: 0 auto 1rem;
  opacity: .7;
}

.feature-card h3 {
  font-family: var(--font-nav);
  font-size: .85rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  margin-bottom: .5rem;
  color: var(--forest-deep);
}

.feature-card p {
  font-size: .9rem;
  color: var(--text-muted);
}

/* ---------- Page Header (interior pages) ---------- */
.page-header {
  padding: 8rem 2rem 3rem;
  background: linear-gradient(135deg, var(--charcoal) 0%, var(--leather-dark) 50%, var(--forest-deep) 100%);
  text-align: center;
  position: relative;
  overflow: hidden;
}

.page-header::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 60px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1440 60' preserveAspectRatio='none'%3E%3Cpath d='M0 60 L0 30 Q360 0 720 30 Q1080 60 1440 30 L1440 60Z' fill='%23f5f0e8'/%3E%3C/svg%3E") no-repeat bottom/cover;
}

.page-header h1 {
  font-family: var(--font-nav);
  letter-spacing: .15em;
  color: var(--parchment);
  margin-bottom: .5rem;
  overflow-wrap: break-word;
  word-break: break-word;
}

.page-header .section-subtitle {
  color: var(--brass-light);
}

/* ---------- Content Sections ---------- */
.content-section {
  max-width: 1200px;
  margin: 0 auto;
  padding: 3rem 2rem;
}

.content-section.wide {
  max-width: 1400px;
}

/* ---------- Packing List ---------- */
.packing-categories {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
  gap: 2rem;
}

.pack-category {
  background: var(--cream);
  border: 1px solid rgba(184,134,11,.15);
  border-radius: 8px;
  overflow: hidden;
  transition: var(--transition);
}

.pack-category:hover {
  box-shadow: var(--shadow-md);
}

.pack-category-header {
  background: linear-gradient(135deg, var(--forest-deep), var(--forest));
  padding: 1rem 1.5rem;
  display: flex;
  align-items: center;
  gap: .75rem;
}

.pack-category-header h3 {
  font-family: var(--font-nav);
  font-size: .8rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--brass-light);
  margin: 0;
}

.pack-category-header .cat-icon {
  width: 28px;
  height: 28px;
  opacity: .7;
}

.pack-items {
  padding: 1rem 1.5rem;
}

.pack-item {
  display: flex;
  align-items: center;
  gap: .75rem;
  padding: .5rem 0;
  border-bottom: 1px solid rgba(184,134,11,.08);
  font-size: .95rem;
}

.pack-item:last-child {
  border-bottom: none;
}

.pack-item input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  width: 20px;
  height: 20px;
  border: 2px solid var(--brass);
  border-radius: 3px;
  cursor: pointer;
  transition: var(--transition);
  flex-shrink: 0;
  position: relative;
}

.pack-item input[type="checkbox"]:checked {
  background: var(--forest);
  border-color: var(--forest);
}

.pack-item input[type="checkbox"]:checked::after {
  content: '✓';
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  font-size: .75rem;
  font-weight: 700;
}

.pack-item label {
  cursor: pointer;
  transition: var(--transition);
}

.pack-item input[type="checkbox"]:checked + label {
  text-decoration: line-through;
  color: var(--text-muted);
}

/* ---------- Photo Gallery ---------- */
.album-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: .5rem;
  justify-content: center;
  margin-bottom: 2rem;
}

.album-tab {
  padding: .6rem 1.5rem;
  font-family: var(--font-nav);
  font-size: .7rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--text-muted);
  border: 1px solid rgba(184,134,11,.3);
  border-radius: 4px;
  cursor: pointer;
  transition: var(--transition);
  background: var(--cream);
}

.album-tab:hover {
  border-color: var(--brass);
  color: var(--burnt-orange);
}

.album-tab.active {
  background: var(--forest-deep);
  color: var(--brass-light);
  border-color: var(--forest-deep);
}

.gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 1rem;
}

.gallery-item {
  aspect-ratio: 4/3;
  border-radius: 6px;
  overflow: hidden;
  cursor: pointer;
  position: relative;
  background: var(--leather-dark);
  box-shadow: var(--shadow-sm);
  transition: var(--transition);
}

.gallery-item:hover {
  transform: scale(1.02);
  box-shadow: var(--shadow-lg);
}

.gallery-item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: var(--transition-slow);
}

.gallery-item:hover img {
  transform: scale(1.05);
}

.gallery-item .gallery-caption {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 2rem 1rem .75rem;
  background: linear-gradient(transparent, rgba(0,0,0,.7));
  color: var(--parchment);
  font-size: .85rem;
  opacity: 0;
  transition: var(--transition);
}

.gallery-item:hover .gallery-caption {
  opacity: 1;
}

/* Lightbox */
.lightbox {
  position: fixed;
  inset: 0;
  z-index: 10000;
  background: rgba(0,0,0,.95);
  display: none;
  align-items: center;
  justify-content: center;
  padding: 2rem;
  cursor: zoom-out;
}

.lightbox.active {
  display: flex;
  animation: fadeIn .3s ease;
}

.lightbox img {
  max-width: 90vw;
  max-height: 90vh;
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 0 60px rgba(0,0,0,.5);
  cursor: default;
}

.lightbox-close {
  position: absolute;
  top: 1.5rem;
  right: 1.5rem;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--parchment);
  font-size: 1.5rem;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,.2);
  border-radius: 50%;
  transition: var(--transition);
}

.lightbox-close:hover {
  background: rgba(255,255,255,.1);
}

.lightbox-nav {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--parchment);
  font-size: 1.5rem;
  cursor: pointer;
  border: 1px solid rgba(255,255,255,.15);
  border-radius: 50%;
  transition: var(--transition);
}

.lightbox-nav:hover {
  background: rgba(255,255,255,.1);
}

.lightbox-prev { left: 1.5rem; }
.lightbox-next { right: 1.5rem; }

.lightbox-caption {
  position: absolute;
  bottom: 1.5rem;
  left: 50%;
  transform: translateX(-50%);
  color: var(--parchment);
  font-family: var(--font-display);
  font-style: italic;
  font-size: 1rem;
  text-align: center;
  max-width: 80%;
}

/* ---------- Maps & Satellite ---------- */
.map-container {
  border-radius: 8px;
  overflow: hidden;
  border: 2px solid var(--brass);
  box-shadow: var(--shadow-lg);
  background: var(--leather-dark);
  aspect-ratio: 16/9;
  width: 100%;
  max-width: 100%;
  position: relative;
}

.content-section.wide {
  overflow: hidden;
}

.map-container iframe {
  width: 100%;
  height: 100%;
  max-width: 100%;
  border: none;
  position: absolute;
  inset: 0;
}

.map-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--text-muted);
  gap: 1rem;
  position: absolute;
  inset: 0;
}

.map-placeholder svg {
  width: 64px;
  height: 64px;
  opacity: .3;
}

.map-locations {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 1.5rem;
  margin-top: 2rem;
}

.map-location-card {
  background: var(--cream);
  border: 1px solid rgba(184,134,11,.15);
  border-radius: 6px;
  padding: 1.5rem;
  transition: var(--transition);
  cursor: pointer;
}

.map-location-card:hover {
  border-color: var(--brass);
  box-shadow: var(--shadow-md);
}

.map-location-card h4 {
  font-family: var(--font-nav);
  font-size: .75rem;
  letter-spacing: .12em;
  text-transform: uppercase;
  color: var(--forest-deep);
  margin-bottom: .25rem;
}

.map-location-card p {
  font-size: .9rem;
  color: var(--text-muted);
}

.map-location-card .location-coords {
  font-family: monospace;
  font-size: .75rem;
  color: var(--brass);
  margin-top: .5rem;
}

/* ---------- Address Book ---------- */
.address-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(340px, 1fr));
  gap: 1.5rem;
}

.address-card {
  background: var(--cream);
  border: 1px solid rgba(184,134,11,.15);
  border-radius: 8px;
  padding: 1.5rem;
  transition: var(--transition);
  position: relative;
  overflow: hidden;
}

.address-card::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: var(--forest);
  transition: var(--transition);
}

.address-card:hover {
  box-shadow: var(--shadow-md);
  border-color: var(--brass);
}

.address-card:hover::before {
  background: var(--burnt-orange);
}

.address-card .card-type {
  font-family: var(--font-nav);
  font-size: .65rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--burnt-orange);
  margin-bottom: .25rem;
}

.address-card h3 {
  font-family: var(--font-display);
  font-size: 1.15rem;
  margin-bottom: .75rem;
  color: var(--forest-deep);
}

.address-card .card-detail {
  display: flex;
  align-items: flex-start;
  gap: .5rem;
  font-size: .9rem;
  color: var(--text-body);
  margin-bottom: .4rem;
}

.address-card .card-detail .detail-icon {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin-top: 2px;
  opacity: .5;
}

.address-card .card-notes {
  margin-top: .75rem;
  padding-top: .75rem;
  border-top: 1px solid rgba(184,134,11,.1);
  font-size: .85rem;
  font-style: italic;
  color: var(--text-muted);
}

/* ---------- Team ---------- */
.team-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 2rem;
}

.team-card {
  background: var(--cream);
  border: 1px solid rgba(184,134,11,.15);
  border-radius: 8px;
  overflow: hidden;
  transition: var(--transition);
}

.team-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-lg);
  border-color: var(--brass);
}

.team-photo {
  aspect-ratio: 1;
  background: linear-gradient(135deg, var(--forest-deep), var(--leather-dark));
  position: relative;
  overflow: hidden;
}

.team-photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.team-photo .photo-placeholder {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.team-photo .photo-placeholder svg {
  width: 80px;
  height: 80px;
  opacity: .2;
}

.team-info {
  padding: 1.5rem;
}

.team-info h3 {
  font-family: var(--font-display);
  font-size: 1.3rem;
  margin-bottom: .25rem;
}

.team-info .team-role {
  font-family: var(--font-nav);
  font-size: .65rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--burnt-orange);
  margin-bottom: 1rem;
}

.team-info .team-bio {
  font-size: .9rem;
  color: var(--text-body);
  margin-bottom: 1rem;
  line-height: 1.6;
}

.team-stats {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: .5rem;
  padding-top: 1rem;
  border-top: 1px solid rgba(184,134,11,.1);
}

.team-stat {
  text-align: center;
}

.team-stat .stat-label {
  font-size: .65rem;
  text-transform: uppercase;
  letter-spacing: .1em;
  color: var(--text-muted);
  display: block;
}

.team-stat .stat-value {
  font-family: var(--font-display);
  font-size: .95rem;
  font-weight: 600;
  color: var(--forest-deep);
}

/* ---------- Footer ---------- */
.site-footer {
  background: linear-gradient(180deg, var(--charcoal-warm), var(--charcoal));
  border-top: 2px solid var(--brass);
  padding: 3rem 2rem 1.5rem;
  text-align: center;
  position: relative;
}

.site-footer::before {
  content: '';
  position: absolute;
  top: -2px;
  left: 0;
  right: 0;
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--brass), transparent);
}

.footer-logo {
  height: 40px;
  width: auto;
  margin: 0 auto 1rem;
  opacity: .5;
}

.footer-text {
  font-family: var(--font-nav);
  font-size: .7rem;
  letter-spacing: .15em;
  text-transform: uppercase;
  color: var(--smoke);
  margin-bottom: .5rem;
}

.footer-sub {
  font-size: .8rem;
  color: rgba(255,255,255,.15);
  font-style: italic;
}

/* ---------- Scrollbar ---------- */
::-webkit-scrollbar { width: 10px; }
::-webkit-scrollbar-track { background: var(--charcoal); }
::-webkit-scrollbar-thumb {
  background: var(--leather);
  border-radius: 5px;
  border: 2px solid var(--charcoal);
}
::-webkit-scrollbar-thumb:hover { background: var(--leather-light); }

/* ---------- Utility ---------- */
.text-center { text-align: center; }
.mb-1 { margin-bottom: .5rem; }
.mb-2 { margin-bottom: 1rem; }
.mb-3 { margin-bottom: 1.5rem; }
.mb-4 { margin-bottom: 2rem; }
.mt-4 { margin-top: 2rem; }

.stagger-1 { animation-delay: .1s; }
.stagger-2 { animation-delay: .2s; }
.stagger-3 { animation-delay: .3s; }
.stagger-4 { animation-delay: .4s; }
.stagger-5 { animation-delay: .5s; }
.stagger-6 { animation-delay: .6s; }

.fade-in-up {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity .6s ease, transform .6s ease;
}

.fade-in-up.visible {
  opacity: 1;
  transform: translateY(0);
}

/* ---------- Responsive ---------- */
@media (max-width: 768px) {
  .nav-links { display: none; }
  .nav-links.open {
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 72px;
    left: 0;
    right: 0;
    background: var(--charcoal);
    border-bottom: 2px solid var(--brass);
    padding: 1rem;
    gap: 0;
    box-shadow: var(--shadow-lg);
  }

  .nav-links.open a {
    padding: .75rem 1rem;
    display: block;
    text-align: center;
  }

  .nav-links .nav-dot { display: none; }

  .nav-toggle { display: flex; }

  .hero-logo {
    width: 130px;
    height: 130px;
  }

  .packing-categories {
    grid-template-columns: 1fr;
  }

  .gallery-grid {
    grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
  }

  .team-grid {
    grid-template-columns: 1fr;
    max-width: 400px;
    margin-left: auto;
    margin-right: auto;
  }

  .address-grid {
    grid-template-columns: 1fr;
  }

  .map-container {
    aspect-ratio: 4/3;
  }

  .album-tabs {
    gap: .4rem;
    margin-bottom: 1.5rem;
  }

  .album-tab {
    padding: .5rem 1rem;
    font-size: .6rem;
  }
}

@media (max-width: 480px) {
  .nav-inner { padding: 0 1rem; }
  .content-section { padding: 2rem 1rem; }
  .page-header { padding: 7rem 1rem 2.5rem; }
  .page-header h1 {
    font-size: 1.5rem;
    letter-spacing: .08em;
  }

  .map-container {
    aspect-ratio: 1/1;
    max-width: calc(100vw - 2rem);
  }

  .album-tab {
    padding: .4rem .75rem;
    font-size: .55rem;
  }
}

/* ---------- Print (packing list) ---------- */
@media print {
  .main-nav, .site-footer, .auth-overlay, .feather-divider { display: none !important; }
  .page-header { display: none !important; }
  .print-header { display: block !important; }
  body { font-size: 10pt !important; }
  .page-wrapper { padding: 0 !important;
  }
  .page-header .decor-shell { display: none !important; }
  .content-section { padding: 0.5rem 0 !important; }
  .content-section > div:first-child { display: none !important; }
  .packing-categories {
    display: grid !important;
    grid-template-columns: 1fr 1fr !important;
    gap: 0.4rem !important;
  }
  .pack-category {
    break-inside: avoid;
    border: 1px solid #ccc !important;
    border-radius: 4px !important;
    overflow: hidden;
    box-shadow: none !important;
  }
  .pack-category-header {
    background: #eee !important;
    color: black !important;
    padding: 0.3rem 0.5rem !important;
  }
  .pack-category-header h3 {
    color: black !important;
    font-size: 8pt !important;
    letter-spacing: 0.1em !important;
  }
  .pack-category-header .cat-icon { display: none !important; }
  .pack-items { padding: 0.25rem 0.5rem !important; }
  .pack-item {
    padding: 0.1rem 0 !important;
    font-size: 8.5pt !important;
    gap: 0.4rem !important;
    border-bottom: none !important;
  }
  .pack-item input[type="checkbox"] {
    width: 10px !important;
    height: 10px !important;
    min-width: 10px !important;
    border: 1px solid #999 !important;
    border-radius: 1px !important;
    background: white !important;
  }
  .pack-item input[type="checkbox"]:checked {
    background: #333 !important;
    border-color: #333 !important;
  }
  .pack-item label {
    text-decoration: none !important;
    color: black !important;
  }
  .fade-in-up {
    opacity: 1 !important;
    transform: none !important;
  }
}