/* ============ TOKENS ============ */
:root{
  --cream:#EDE6D6;
  --paper:#F5F0E4;
  --ink:#26221C;
  --pine:#414B3C;
  --pine-dark:#2E362B;
  --rust:#8A4632;
  --slate:#5C6B73;
  --gold:#C9A227;
  --line: rgba(38,34,28,0.16);
  --line-light: rgba(245,240,228,0.22);

  --font-display: 'Fraunces', serif;
  --font-body: 'Inter', -apple-system, sans-serif;
  --font-mono: 'JetBrains Mono', monospace;

  --wrap: 1180px;
}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:16px;
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}

.wrap{max-width:var(--wrap); margin:0 auto; padding:0 32px;}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:400;
  margin:0 0 0.4em 0;
  letter-spacing:-0.01em;
  color:var(--ink);
}
h1{font-size:clamp(2.6rem,6vw,5rem); line-height:1.02; font-weight:400;}
h2{font-size:clamp(1.8rem,3.4vw,2.8rem); line-height:1.1;}
h3{font-size:1.35rem; font-weight:500;}
h4{font-size:1.05rem; font-weight:600; font-family:var(--font-body);}
p{margin:0 0 1em 0;}
a{color:inherit; text-decoration:none;}

.mono{font-family:var(--font-mono);}
.small{font-size:0.78rem; letter-spacing:0.06em; text-transform:uppercase;}
.muted{opacity:0.6;}

/* grain overlay for texture */
.grain{
  position:fixed; inset:0; pointer-events:none; z-index:999;
  opacity:0.035; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* ============ HEADER ============ */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(237,230,214,0.88);
  backdrop-filter:blur(8px);
  border-bottom:1px solid var(--line);
}
.header-inner{
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 32px;
}
.brand{display:flex; align-items:center; gap:10px;}
.brand-logo{height:52px; width:auto; display:block;}
.brand-mark{
  width:34px; height:34px; border-radius:50%;
  background:var(--pine); color:var(--cream);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-display); font-size:1.1rem;
}
.brand-text{font-family:var(--font-display); font-size:1.15rem; letter-spacing:0.01em;}

.main-nav{display:flex; gap:30px; align-items:center;}
.main-nav a{font-size:0.92rem; font-weight:500; color:var(--ink); opacity:0.75; transition:opacity .2s;}
.main-nav a:hover{opacity:1;}
.nav-cta{
  background:var(--rust); color:var(--paper) !important; opacity:1 !important;
  padding:9px 18px; border-radius:2px; font-weight:600;
}
.nav-toggle{display:none; flex-direction:column; gap:5px; background:none; border:none; cursor:pointer; padding:8px;}
.nav-toggle span{width:22px; height:2px; background:var(--ink);}

/* ============ HERO ============ */
.hero{
  position:relative; overflow:hidden;
  background:var(--pine-dark); color:var(--paper);
  padding:0;
  min-height:88vh;
  display:flex; align-items:center;
}
.hero-photo{position:absolute; inset:0; z-index:0;}
.hero-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.hero-photo::after{
  content:''; position:absolute; inset:0;
  background:linear-gradient(180deg, rgba(46,54,43,0.55) 0%, rgba(46,54,43,0.78) 65%, rgba(46,54,43,0.92) 100%);
}
.contour-bg{position:absolute; inset:0; width:100%; height:100%; z-index:1;}
.contour{fill:none; stroke:rgba(245,240,228,0.10); stroke-width:1.4;}
.contour.c1{stroke:rgba(245,240,228,0.16);}
.hero-inner{position:relative; z-index:2; padding:120px 32px 100px;}
.hero .eyebrow{color:var(--gold); font-size:0.8rem; letter-spacing:0.08em; margin-bottom:24px;}
.hero h1{color:var(--paper);}
.hero-sub{max-width:520px; color:rgba(245,240,228,0.82); font-size:1.08rem; margin-top:22px;}
.hero-cta{display:flex; gap:18px; margin-top:38px; flex-wrap:wrap;}

.btn{
  display:inline-block; padding:14px 28px; font-weight:600; font-size:0.95rem;
  border-radius:2px; border:1px solid transparent; cursor:pointer; transition:all .2s;
}
.btn-primary{background:var(--rust); color:var(--paper);}
.btn-primary:hover{background:#753a29;}
.btn-ghost{border-color:rgba(245,240,228,0.4); color:var(--paper);}
.btn-ghost:hover{border-color:var(--paper);}
.btn-block{width:100%; text-align:center;}

.hero-sign{
  position:relative; z-index:2;
  display:flex; flex-wrap:wrap; gap:0;
  border-top:1px solid rgba(245,240,228,0.18);
  background:rgba(0,0,0,0.14);
}
.hero-sign span{
  flex:1; min-width:150px;
  padding:16px 24px; font-size:0.78rem; letter-spacing:0.03em;
  color:rgba(245,240,228,0.75);
  border-right:1px solid rgba(245,240,228,0.12);
}
.hero-sign span b{color:var(--gold); display:block; font-size:0.95rem; margin-top:4px;}

/* ============ INTRO ============ */
.intro{padding:90px 0;}
.intro-grid{display:grid; grid-template-columns:180px 1fr; gap:60px;}
.intro-label .rule{width:40px; height:2px; background:var(--rust); margin-top:14px;}
.intro-copy h2{margin-bottom:0.6em;}
.intro-copy p{max-width:640px; font-size:1.05rem;}
.pull-quote{
  font-family:var(--font-display); font-style:italic; font-size:1.35rem;
  color:var(--pine); border-left:2px solid var(--rust); padding-left:24px; margin-top:32px;
}

/* ============ SECTION HEAD ============ */
.section-head{margin-bottom:50px; max-width:680px;}
.section-head.light p, .section-head.light h2{color:var(--paper);}
.section-sub{font-size:1.05rem; opacity:0.85; margin-top:10px;}

/* ============ PROPERTY ============ */
.property{padding:0;}
.property-grid{
  display:grid; grid-template-columns:1.3fr 1fr 1.3fr; grid-template-rows:1fr 1fr;
  gap:2px; height:520px;
}
.property-photo:nth-child(1){grid-column:1; grid-row:1 / 3;}
.property-photo:nth-child(2){grid-column:2; grid-row:1;}
.property-photo:nth-child(3){grid-column:2; grid-row:2;}
.property-photo:nth-child(4){grid-column:3; grid-row:1 / 3;}
.property-photo{overflow:hidden;}
.property-photo img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease;}
.property-photo:hover img{transform:scale(1.04);}

/* ============ ROOM ============ */
.room{padding:80px 0; background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.room-gallery{
  display:grid; grid-template-columns:repeat(6,1fr); grid-template-rows:1fr 1fr;
  gap:8px; margin-bottom:50px; height:420px;
}
.room-gallery img{width:100%; height:100%; object-fit:cover; display:block; border-radius:2px;}
.rg-large{grid-column:1 / 4; grid-row:1 / 3;}
.room-gallery img:nth-child(2){grid-column:4; grid-row:1;}
.room-gallery img:nth-child(3){grid-column:5; grid-row:1;}
.room-gallery img:nth-child(4){grid-column:6; grid-row:1;}
.room-gallery img:nth-child(5){grid-column:4; grid-row:2;}
.room-gallery img:nth-child(6){grid-column:5 / 7; grid-row:2;}
.room-grid{display:grid; grid-template-columns:1fr 340px; gap:70px; align-items:start;}
.feature-list{list-style:none; margin:0; padding:0; display:grid; gap:20px;}
.feature-list li{
  display:flex; flex-direction:column; padding:16px 0; border-bottom:1px solid var(--line);
}
.feature-list li span{font-weight:600; font-size:1.05rem;}
.feature-list li em{font-style:normal; opacity:0.65; font-size:0.9rem; margin-top:2px;}

.room-price-card{
  background:var(--pine-dark); color:var(--paper); padding:36px 30px; border-radius:2px;
}
.room-price-card .price{font-family:var(--font-display); font-size:3rem; margin:12px 0 4px; color:var(--gold);}
.room-price-card .price span{font-family:var(--font-body); font-size:1rem; color:rgba(245,240,228,0.7);}
.price-note{font-size:0.88rem; opacity:0.75; margin-bottom:0;}
.room-price-card .rule{height:1px; background:rgba(245,240,228,0.2); margin:20px 0;}
.room-price-card .btn{margin-top:24px;}

/* ============ TABLE ============ */
.table{padding:80px 0;}
.table-grid{display:grid; grid-template-columns:1.1fr 0.9fr; gap:70px; align-items:start;}
.table-copy p{font-size:1.05rem; max-width:520px;}
.table-photos{margin-top:28px; display:grid; grid-template-columns:1fr 1fr; gap:12px;}
.table-photos img{width:100%; height:190px; object-fit:cover; display:block; border-radius:2px;}
.table-video{position:relative; width:100%; height:190px; border-radius:2px; overflow:hidden; background:var(--ink); cursor:pointer; grid-column:1 / 3;}
.table-video video{width:100%; height:100%; object-fit:cover; display:block;}
.table-side{padding-top:52px;}
.table-menu{background:var(--cream); border:1px solid var(--line); padding:8px;}
.menu-row{
  display:flex; justify-content:space-between; gap:16px;
  padding:18px 20px; border-bottom:1px dashed var(--line); font-size:0.88rem;
}
.menu-row:last-child{border-bottom:none;}
.menu-row span:first-child{color:var(--rust); font-weight:500;}
.menu-row span:last-child{text-align:right; opacity:0.8;}

/* ============ HIKING ============ */
.hiking{background:var(--pine-dark); color:var(--paper); padding:0 0 80px; position:relative;}
.hiking-banner{width:100%; height:340px; overflow:hidden; position:relative;}
.hiking-banner video{width:100%; height:100%; object-fit:cover; display:block; filter:brightness(0.55);}
.hiking .section-head{margin-top:60px; margin-bottom:40px;}
.trail-list{display:grid; grid-template-columns:1fr 1fr; gap:20px;}
.trail{
  background:rgba(245,240,228,0.05); border:1px solid rgba(245,240,228,0.12);
  border-radius:2px; overflow:hidden; display:flex; flex-direction:column;
  transition:border-color .25s ease, transform .25s ease;
}
.trail:hover{border-color:rgba(245,240,228,0.3); transform:translateY(-2px);}
.trail-img{width:100%; height:200px; overflow:hidden;}
.trail-img img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s ease;}
.trail:hover .trail-img img{transform:scale(1.05);}
.trail-meta{
  display:flex; flex-direction:row; align-items:center; justify-content:space-between;
  gap:8px; font-size:0.78rem; padding:16px 22px 0;
  color:rgba(245,240,228,0.65);
}
.trail-diff{
  display:inline-block; padding:4px 10px; border-radius:20px; width:fit-content;
  border:1px solid rgba(245,240,228,0.35); font-size:0.72rem; letter-spacing:0.04em;
}
.trail-diff.easy{border-color:#7FA37A; color:#9FC49B;}
.trail-diff.mid{border-color:var(--gold); color:var(--gold);}
.trail-diff.hard{border-color:var(--rust); color:#D48C77;}
.trail-diff.route{border-color:var(--paper); color:var(--paper);}
.trail h3{color:var(--paper); margin:10px 0 0.3em; font-size:1.2rem; padding:0 22px;}
.trail p{color:rgba(245,240,228,0.78); font-size:0.93rem; margin-bottom:0; padding:0 22px 24px;}

/* ============ ACTIVITIES ============ */
.activities{padding:80px 0;}
.activity-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:24px;}
.activity-card{background:var(--paper); border:1px solid var(--line);}
.activity-img{width:100%; height:170px; overflow:hidden;}
.activity-img img{width:100%; height:100%; object-fit:cover; display:block;}
.activity-card h4{color:var(--rust); margin:20px 22px 0.5em;}
.activity-card p{font-size:0.92rem; opacity:0.8; margin:0 22px 22px;}

/* ============ REGION ============ */
.region{padding:0 0 80px; background:var(--paper); border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.region-photo{width:100%; height:300px; overflow:hidden; margin-bottom:60px;}
.region-photo img{width:100%; height:100%; object-fit:cover; display:block;}
.region-grid{display:grid; grid-template-columns:1fr 1fr; gap:70px;}
.region-grid p{font-size:1rem; max-width:480px;}

/* ============ GUESTS ============ */
.guests{background:var(--ink); color:var(--paper); padding:80px 0;}
.quote-grid{display:grid; grid-template-columns:1fr 1fr; gap:2px; background:rgba(245,240,228,0.14);}
.quote-grid blockquote{background:var(--ink); margin:0; padding:34px 36px;}
.quote-full{grid-column:1 / -1;}
.quote-video{position:relative; background:var(--ink); overflow:hidden; cursor:pointer; min-height:180px;}
.quote-video video{width:100%; height:100%; object-fit:cover; display:block;}
.quote-video-label{
  position:absolute; left:0; right:0; bottom:0; padding:14px 20px;
  background:linear-gradient(0deg, rgba(0,0,0,0.75), transparent);
  color:var(--paper); font-size:0.7rem; letter-spacing:0.04em;
}
.quote-grid p{
  font-family:var(--font-display); font-style:italic; font-size:1.15rem; line-height:1.5;
  color:rgba(245,240,228,0.92); margin:0;
}
.guests-stat{margin-top:40px; opacity:0.6; font-size:0.85rem; letter-spacing:0.03em;}

/* ============ REELS ============ */
.reels{padding:80px 0 70px;}
.reels-track{
  display:flex; gap:16px; overflow-x:auto; padding:0 32px 10px;
  scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch;
}
.reels-track::-webkit-scrollbar{height:6px;}
.reels-track::-webkit-scrollbar-thumb{background:var(--line); border-radius:4px;}
.reel{
  flex:0 0 auto; width:240px; aspect-ratio:4/5; border-radius:2px; overflow:hidden;
  background:var(--ink); scroll-snap-align:start; cursor:pointer; position:relative;
}
.reel video{width:100%; height:100%; object-fit:cover; display:block;}

/* Mute/sound indicator used on all ambient videos */
.reel-icon{
  position:absolute; top:10px; right:10px; z-index:2;
  width:24px; height:24px; border-radius:50%;
  background:rgba(20,18,14,0.45); backdrop-filter:blur(2px);
  display:flex; align-items:center; justify-content:center;
  font-size:0.65rem; color:rgba(245,240,228,0.85); pointer-events:none;
  opacity:0.75; transition:opacity .2s ease, background .2s ease;
}
.reel:hover .reel-icon, .table-video:hover .reel-icon{opacity:1; background:rgba(20,18,14,0.65);}
.table-video, .hiking-banner{position:relative;}

/* ============ BOOK ============ */
.book{padding:90px 0;}
.book-grid{display:grid; grid-template-columns:1fr 1fr; gap:80px; align-items:start;}
.book-copy p{font-size:1.05rem; max-width:460px;}
.book-contact{margin-top:30px; display:grid; gap:0;}
.contact-line{
  display:flex; flex-direction:column; gap:4px; padding:18px 0; border-bottom:1px solid var(--line);
}
.contact-label{color:var(--rust); font-size:0.72rem; letter-spacing:0.05em;}

.book-form{display:grid; gap:18px; background:var(--paper); padding:40px; border:1px solid var(--line);}
.book-form label{display:flex; flex-direction:column; gap:8px; font-size:0.85rem; font-weight:500;}
.book-form input, .book-form textarea{
  font-family:var(--font-body); font-size:0.98rem; padding:12px 14px;
  border:1px solid var(--line); background:var(--cream); border-radius:2px; color:var(--ink);
}
.book-form input:focus, .book-form textarea:focus{outline:2px solid var(--rust); outline-offset:1px;}
.form-row{display:grid; grid-template-columns:1fr 1fr; gap:18px;}
.form-note{text-align:center; opacity:0.55; font-size:0.75rem; margin:0;}

/* ============ FOOTER ============ */
.site-footer{background:var(--pine-dark); color:var(--paper); padding:44px 0;}
.footer-inner{display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px;}
.footer-links{display:flex; gap:24px;}
.footer-links a{opacity:0.75; font-size:0.85rem;}
.footer-links a:hover{opacity:1;}
.footer-credit{margin:0;}

/* ============ RESPONSIVE ============ */
@media (max-width:900px){
  .main-nav{display:none;}
  .nav-toggle{display:flex;}
  .intro-grid, .table-grid, .room-grid, .region-grid, .book-grid, .quote-grid{grid-template-columns:1fr;}
  .activity-grid{grid-template-columns:1fr 1fr;}
  .trail-list{grid-template-columns:1fr;}
  .hero-sign span{min-width:50%;}
  .form-row{grid-template-columns:1fr;}
  .property-grid{grid-template-columns:1fr 1fr; grid-template-rows:220px 220px; height:auto;}
  .property-photo:nth-child(1){grid-column:1; grid-row:1;}
  .property-photo:nth-child(2){grid-column:2; grid-row:1;}
  .property-photo:nth-child(3){grid-column:1; grid-row:2;}
  .property-photo:nth-child(4){grid-column:2; grid-row:2;}
  .room-gallery{grid-template-columns:1fr 1fr; grid-template-rows:repeat(3,140px); height:auto;}
  .rg-large{grid-column:1 / 3; grid-row:1;}
  .room-gallery img:nth-child(2){grid-column:1; grid-row:2;}
  .room-gallery img:nth-child(3){grid-column:2; grid-row:2;}
  .room-gallery img:nth-child(4){grid-column:1; grid-row:3;}
  .room-gallery img:nth-child(5){grid-column:2; grid-row:3;}
  .room-gallery img:nth-child(6){display:none;}
  .table-photos{grid-template-columns:1fr;}
}
@media (max-width:560px){
  .wrap{padding:0 20px;}
  .activity-grid{grid-template-columns:1fr;}
  .hero-sign span{min-width:100%; border-right:none; border-bottom:1px solid rgba(245,240,228,0.12);}
  .hero-inner{padding:100px 20px 60px;}
}

/* ============ LIGHTBOX ============ */
.lightbox{
  position:fixed; inset:0; z-index:1000; background:rgba(20,18,14,0.94);
  display:flex; align-items:center; justify-content:center;
  opacity:0; visibility:hidden; transition:opacity .25s ease;
  padding:40px;
}
.lightbox.open{opacity:1; visibility:visible;}
.lightbox img{max-width:100%; max-height:90vh; object-fit:contain; border-radius:2px;}
.lightbox-close{
  position:absolute; top:24px; right:32px; background:none; border:none;
  color:var(--paper); font-size:2.4rem; line-height:1; cursor:pointer; font-family:var(--font-body);
}

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  html{scroll-behavior:auto;}
}