/* Crooked Creek shared site styles — used by reservation, success, privacy, terms, 404 */
:root{
  --forest:#3F5844; --forest-deep:#2E3D30; --sage:#5F825A;
  --gold:#8B6914; --gold-light:#C49B1A;
  --cream:#F8F5EF; --warm-white:#FDFCF9;
  --text:#2E3D30; --text-2:#5E6F60; --text-3:#8A978B;
  --border:#D4DDD5; --border-light:#E8EDE9;
  --danger:#9C3D2A; --danger-light:#C76A4F;
  --serif:"Lora",Georgia,serif;
  --sans:"Inter",-apple-system,BlinkMacSystemFont,"Helvetica Neue",sans-serif;
  --mono:"JetBrains Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --container:1280px;
  --gutter:clamp(20px,4vw,56px);
}
*{box-sizing:border-box}html,body{margin:0;padding:0}html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;scroll-behavior:smooth}
body{font-family:var(--sans);color:var(--text);background:var(--warm-white);font-size:16px;line-height:1.6}
img,svg{display:block;max-width:100%}a{color:inherit;text-decoration:none}
button,input,textarea,select{font:inherit}
.container{max-width:var(--container);margin:0 auto;padding-inline:var(--gutter)}
.mono{font-family:var(--mono);font-feature-settings:"tnum" 1;letter-spacing:0.02em}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:0.18em;text-transform:uppercase;color:var(--text-3);font-weight:500}
.eyebrow .dot{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--sage);margin-right:8px;transform:translateY(-2px)}

/* Ticker */
.ticker{background:var(--forest-deep);color:#E8EDE9;border-bottom:1px solid rgba(255,255,255,0.06);font-family:var(--mono);font-size:12px;position:relative;overflow:hidden}
.ticker-inner{display:flex;align-items:center;gap:28px;padding:10px var(--gutter);max-width:var(--container);margin:0 auto;white-space:nowrap;overflow:hidden}
.ticker-label{display:inline-flex;align-items:center;gap:8px;color:var(--gold-light);font-weight:500;letter-spacing:0.12em;text-transform:uppercase;font-size:10.5px;flex-shrink:0}
.ticker-label .pulse{width:7px;height:7px;border-radius:50%;background:var(--gold-light);box-shadow:0 0 0 0 rgba(196,155,26,0.7);animation:pulse 2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(196,155,26,0.7)}70%{box-shadow:0 0 0 8px rgba(196,155,26,0)}100%{box-shadow:0 0 0 0 rgba(196,155,26,0)}}
.ticker-track{flex:1;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent)}
.ticker-scroll{display:inline-flex;gap:36px;animation:scroll 60s linear infinite;padding-left:36px}
.ticker-scroll:hover{animation-play-state:paused}
@keyframes scroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.t-item{display:inline-flex;align-items:baseline;gap:8px}
.t-key{color:rgba(232,237,233,0.55);text-transform:uppercase;letter-spacing:0.1em;font-size:10.5px}
.t-val{color:#F8F5EF;font-weight:500}.t-delta-up{color:#9DBE7C}.t-delta-down{color:#D89A6E}.t-sep{color:rgba(232,237,233,0.2)}
.ticker-time{flex-shrink:0;font-size:10.5px;color:rgba(232,237,233,0.45);letter-spacing:0.08em}

/* Nav */
.nav{position:sticky;top:0;z-index:50;backdrop-filter:saturate(140%) blur(8px);background:rgba(253,252,249,0.92);border-bottom:1px solid var(--border-light)}
.nav-inner{display:flex;align-items:center;justify-content:space-between;padding:18px var(--gutter);max-width:var(--container);margin:0 auto}
.brand{display:flex;align-items:center;gap:12px}
.brand-logo{height:56px;width:auto;display:block}
.nav-links{display:flex;gap:32px;align-items:center}
.nav-links a{font-size:14px;color:var(--text-2);font-weight:500;position:relative;transition:color .2s}
.nav-links a:hover{color:var(--forest)}
.nav-cta{background:var(--gold);color:var(--warm-white);padding:11px 20px;font-size:13px;font-weight:600;letter-spacing:0.02em;border-radius:2px;transition:background .2s;white-space:nowrap}
.nav-cta:hover{background:var(--gold-light)}
.nav-mobile{display:none}

/* Compact hero (no image) */
.hero-compact{padding:clamp(48px,6vw,80px) 0 clamp(28px,3.5vw,48px);background:var(--cream);border-bottom:1px solid var(--border)}
.crumbs{font-family:var(--mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-3);margin-bottom:24px;display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.crumbs a{color:var(--text-2)}.crumbs a:hover{color:var(--forest)}
.crumbs .here{color:var(--forest-deep);font-weight:500}
.hero-compact h1{font-family:var(--serif);font-weight:500;font-size:clamp(40px,5.4vw,68px);line-height:1.02;letter-spacing:-0.025em;color:var(--forest-deep);margin:6px 0 16px;max-width:18ch}
.hero-compact h1 em{font-style:italic;color:var(--sage);font-weight:400}
.hero-compact .sub{font-size:18px;color:var(--text-2);max-width:60ch;margin:0;line-height:1.55}

/* Buttons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:13px 22px;font-size:14px;font-weight:600;border-radius:2px;transition:all .2s;letter-spacing:0.02em;font-family:var(--sans);cursor:pointer;border:1px solid transparent}
.btn-forest{background:var(--forest);color:var(--warm-white)}
.btn-forest:hover{background:var(--forest-deep);transform:translateY(-1px)}
.btn-gold{background:var(--gold);color:var(--warm-white)}
.btn-gold:hover{background:var(--gold-light);transform:translateY(-1px)}
.btn-outline{border:1px solid var(--forest);color:var(--forest);background:transparent}
.btn-outline:hover{background:var(--forest);color:var(--warm-white)}
.btn-outline-danger{border:1px solid var(--danger);color:var(--danger);background:transparent}
.btn-outline-danger:hover{background:var(--danger);color:var(--warm-white)}
.btn-link{color:var(--forest);background:transparent;text-decoration:underline;text-decoration-color:var(--border);text-underline-offset:4px;padding:13px 12px}
.btn-link:hover{text-decoration-color:var(--gold)}
.btn .arrow{transition:transform .2s}.btn:hover .arrow{transform:translateX(3px)}

/* Footer */
.foot{background:var(--forest-deep);color:rgba(232,237,233,0.7);padding:72px 0 28px;font-size:14px}
.foot-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:48px;margin-bottom:56px}
.foot h4{font-family:var(--mono);font-size:11px;letter-spacing:0.16em;text-transform:uppercase;color:var(--gold-light);font-weight:500;margin:0 0 18px}
.foot ul{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:10px}
.foot a:hover{color:#F8F5EF}
.foot-logo{height:76px;width:auto;display:block;margin-bottom:18px}
.foot p{margin:0 0 12px;max-width:36ch;line-height:1.6}
.foot-bottom{border-top:1px solid rgba(255,255,255,0.08);padding-top:24px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;font-family:var(--mono);font-size:11px;letter-spacing:0.08em;color:rgba(232,237,233,0.45);text-transform:uppercase}

/* Forms */
.field{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.field label{font-family:var(--mono);font-size:10.5px;letter-spacing:0.16em;text-transform:uppercase;color:var(--text-2);font-weight:600}
.field input,.field textarea,.field select{padding:14px 16px;border:1px solid var(--border);background:var(--warm-white);color:var(--text);font-family:var(--sans);font-size:15px;border-radius:2px;transition:border-color .15s}
.field input:focus,.field textarea:focus,.field select:focus{outline:0;border-color:var(--forest)}
.field input::placeholder{color:var(--text-3)}
.field-hint{font-size:12.5px;color:var(--text-3);margin-top:-2px}

@media (max-width:980px){
  .nav-links{display:none}.nav-mobile{display:inline-flex}
  .foot-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:600px){
  .foot-grid{grid-template-columns:1fr}
}

/* ============ NAV (rebuilt) ============ */
.nav {
  background: rgba(253,252,249,0.92);
  border-bottom: 1px solid var(--border-light);
  position: sticky;
  top: 0;
  z-index: 40;
  -webkit-backdrop-filter: saturate(140%) blur(8px);
  backdrop-filter: saturate(140%) blur(8px);
}
.nav-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px var(--gutter);
  max-width: var(--container);
  margin: 0 auto;
  gap: 16px;
}
.brand { display: flex; align-items: center; gap: 12px; }
.brand-logo { height: 56px; width: auto; display: block; }
.nav-links { display: flex; gap: 32px; align-items: center; }
.nav-links a {
  font-size: 14px;
  color: var(--text-2);
  font-weight: 500;
  position: relative;
  transition: color .2s;
  text-decoration: none;
}
.nav-links a:hover { color: var(--forest); }
.nav-links a.active { color: var(--forest-deep); }
.nav-links a.active::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -22px;
  height: 2px; background: var(--gold);
}
.nav-actions { display: flex; align-items: center; gap: 10px; }
.nav-cta {
  background: var(--gold);
  color: var(--warm-white);
  padding: 11px 20px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: 2px;
  transition: background .2s;
  white-space: nowrap;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.nav-cta:hover { background: var(--gold-light); color: var(--warm-white); }

/* Hamburger button (icon-only, hidden on desktop) */
.nav-burger {
  display: none;
  width: 44px; height: 44px;
  background: transparent;
  border: 0;
  padding: 12px 10px;
  cursor: pointer;
  flex-direction: column;
  justify-content: space-between;
  -webkit-tap-highlight-color: transparent;
}
.nav-burger:focus-visible { outline: 2px solid var(--forest); outline-offset: 2px; border-radius: 2px; }
.nav-burger-bar {
  display: block;
  width: 100%;
  height: 2px;
  background: var(--forest-deep);
  border-radius: 1px;
  transition: transform .25s ease, opacity .15s ease;
  transform-origin: center;
}
.nav-burger.open .nav-burger-bar:nth-child(1) { transform: translateY(9px) rotate(45deg); }
.nav-burger.open .nav-burger-bar:nth-child(2) { opacity: 0; }
.nav-burger.open .nav-burger-bar:nth-child(3) { transform: translateY(-9px) rotate(-45deg); }

/* Fullscreen overlay menu */
.mobile-menu {
  position: fixed;
  inset: 0;
  z-index: 100;
  background: rgba(46,61,48,0.97);
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  padding: 96px 24px 48px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  opacity: 0;
  pointer-events: none;
  transition: opacity .25s ease;
  overflow-y: auto;
}
.mobile-menu.open { opacity: 1; pointer-events: auto; }
.mobile-nav-links {
  display: flex; flex-direction: column;
  gap: 4px;
  width: 100%;
  max-width: 360px;
  text-align: center;
}
.mobile-nav-links a {
  display: block;
  font-family: var(--serif);
  font-size: 26px;
  color: #F8F5EF;
  font-weight: 500;
  padding: 14px 0;
  text-decoration: none;
  transition: color .2s;
}
.mobile-nav-links a:hover, .mobile-nav-links a.active { color: var(--gold-light); }
.mobile-nav-links a.active { color: var(--gold-light); }
.mobile-nav-links .mobile-book-cta {
  margin-top: 24px;
  background: var(--gold);
  color: var(--warm-white);
  padding: 16px 24px;
  font-family: var(--sans);
  font-size: 15px;
  font-weight: 600;
  letter-spacing: 0.02em;
  border-radius: 2px;
}
.mobile-nav-links .mobile-book-cta:hover { background: var(--gold-light); color: var(--warm-white); }
.mobile-nav-links .mobile-secondary-cta {
  margin-top: 14px;
  font-family: var(--mono);
  font-size: 12px;
  color: rgba(248,245,239,0.72);
  letter-spacing: 0.1em;
  text-transform: uppercase;
  font-weight: 500;
}
.mobile-nav-links .mobile-secondary-cta:hover { color: var(--gold-light); }

@media (max-width: 980px) {
  .nav-links { display: none; }
  .nav-burger { display: flex; }
  .nav-cta { padding: 9px 14px; font-size: 12px; }
  .nav-inner { padding: 12px var(--gutter); gap: 8px; }
}
@media (max-width: 380px) {
  .nav-cta { display: none; }
}
@media (max-width: 540px) {
  .brand-logo { height: 46px; }
}
/* ============ END NAV ============ */
