/* ============================================================
   THE RED TAIL RANCH — high-desert Airbnb, Pioneertown CA
   Display: Amatica SC · Body: Karla · warm desert earth tones
   ============================================================ */
@import url('https://fonts.googleapis.com/css2?family=Amatica+SC:wght@400;700&family=Karla:wght@300;400;500;600;700&display=swap');

:root{
  --cream:#f4efe4;
  --sand:#e8ddc8;
  --tan:#c8b79a;
  --clay:#b06a44;
  --clay-2:#9a5734;
  --brown:#5b4636;
  --ink:#2c2620;
  --soft:#6f6357;
  --white:#fffdf8;
  --dark:#241f1a;
  --line:rgba(91,70,54,.18);
  --line-on-dark:rgba(255,255,255,.22);

  --display:'Amatica SC', 'Amatic SC', cursive;
  --body:'Karla', -apple-system, BlinkMacSystemFont, sans-serif;
  --container:1180px;
  --t:.25s cubic-bezier(.4,0,.2,1);
}
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:smooth;}
body{font-family:var(--body);background:var(--cream);color:var(--ink);font-size:17px;line-height:1.7;-webkit-font-smoothing:antialiased;overflow-x:hidden;}
a{color:inherit;text-decoration:none;}
img{max-width:100%;display:block;}
ul{list-style:none;}

.container{max-width:var(--container);margin:0 auto;padding:0 30px;}
.section{padding:104px 0;}
#welcome,#gallery,#area,#contact{scroll-margin-top:88px;}
.center{text-align:center;}
.narrow{max-width:720px;margin-left:auto;margin-right:auto;}

/* ── type ── */
.eyebrow{font-family:var(--display);font-size:24px;font-weight:700;letter-spacing:.26em;text-transform:uppercase;color:var(--clay);margin-bottom:6px;}
h1,h2,h3{font-family:var(--display);font-weight:700;line-height:.95;letter-spacing:.01em;}
.title{font-size:clamp(44px,6vw,78px);text-transform:uppercase;color:var(--brown);margin-bottom:18px;}
.subtitle{font-size:clamp(30px,4vw,44px);text-transform:uppercase;color:var(--brown);}
.lead{font-size:19px;color:var(--soft);line-height:1.75;}
p{color:var(--soft);}
p+p{margin-top:16px;}
.script-accent{color:var(--clay);}

/* ── buttons ── */
.btn{display:inline-flex;align-items:center;gap:10px;font-family:var(--body);font-size:13px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;padding:15px 34px;border:1.5px solid var(--brown);color:var(--brown);background:transparent;border-radius:2px;cursor:pointer;transition:all var(--t);white-space:nowrap;}
.btn:hover{background:var(--brown);color:var(--cream);}
.btn--solid{background:var(--clay);border-color:var(--clay);color:var(--white);}
.btn--solid:hover{background:var(--clay-2);border-color:var(--clay-2);color:var(--white);}
.btn--light{border-color:rgba(255,255,255,.7);color:#fff;}
.btn--light:hover{background:#fff;color:var(--ink);}

/* ── header / nav (transparent over hero) ── */
.header{position:absolute;top:0;left:0;right:0;z-index:50;}
.nav{display:flex;align-items:center;justify-content:space-between;height:92px;}
.nav__logo img{height:50px;width:auto;}
.nav__menu{display:flex;align-items:center;gap:34px;}
.nav__menu a{font-size:13px;font-weight:500;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.9);transition:color var(--t);}
.nav__menu a:hover{color:#fff;}
.nav__book{border:1.5px solid rgba(255,255,255,.8);padding:11px 24px;border-radius:2px;color:#fff !important;font-weight:700;}
.nav__book:hover{background:#fff;color:var(--ink) !important;}
.nav__burger{display:none;background:none;border:none;cursor:pointer;padding:6px;}
.nav__burger span{display:block;width:26px;height:2px;background:#fff;margin:6px 0;}

/* sticky condensed header after scroll */
.header--solid{position:fixed;background:var(--cream);box-shadow:0 2px 20px rgba(0,0,0,.08);animation:dropIn .3s ease;}
@keyframes dropIn{from{transform:translateY(-100%);}to{transform:translateY(0);}}
.header--solid .nav{height:72px;}
.header--solid .nav__menu a{color:var(--brown);}
.header--solid .nav__book{border-color:var(--brown);color:var(--brown) !important;}
.header--solid .nav__book:hover{background:var(--brown);color:var(--cream) !important;}
.header--solid .nav__burger span{background:var(--brown);}
.header--solid .nav__logo img{content:url('../images/logo-brown.png');}

/* mobile */
.mobile{position:fixed;inset:0 0 0 auto;width:min(84vw,330px);background:var(--cream);z-index:300;padding:30px 28px;transform:translateX(100%);transition:transform .3s ease;box-shadow:-10px 0 40px rgba(0,0,0,.2);overflow-y:auto;}
.mobile.open{transform:translateX(0);}
.mobile a{display:block;font-size:14px;letter-spacing:.12em;text-transform:uppercase;color:var(--brown);padding:14px 0;border-bottom:1px solid var(--line);}
.mobile__close{position:absolute;top:20px;right:24px;font-size:30px;background:none;border:none;color:var(--brown);cursor:pointer;}
.scrim{display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);z-index:250;}
.scrim.open{display:block;}

/* ── hero ── */
.hero{position:relative;min-height:100vh;display:flex;align-items:center;justify-content:center;text-align:center;background:#000 center/cover no-repeat;color:#fff;padding:120px 24px;}
.hero::after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(36,31,26,.36),rgba(36,31,26,.5));}
.hero__inner{position:relative;z-index:2;max-width:900px;}
.hero__eyebrow{font-family:var(--display);font-size:30px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:rgba(255,255,255,.92);margin-bottom:4px;}
.hero h1{font-size:clamp(38px,6vw,78px);text-transform:uppercase;color:#fff;line-height:.92;text-shadow:0 2px 30px rgba(0,0,0,.4);}
.hero__cta{margin-top:36px;}

/* ── split ── */
.split{display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;}
.split--reverse .split__media{order:-1;}
.split__media img{width:100%;border-radius:3px;box-shadow:0 24px 60px rgba(44,38,32,.18);}

/* ── stat row ── */
.facts{display:flex;flex-wrap:wrap;justify-content:center;gap:48px;margin-top:36px;}
.fact{text-align:center;}
.fact__num{font-family:var(--display);font-size:54px;font-weight:700;color:var(--clay);line-height:1;}
.fact__label{font-size:13px;letter-spacing:.16em;text-transform:uppercase;color:var(--soft);margin-top:4px;}

/* ── gallery ── */
.gallery{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.gallery a{display:block;overflow:hidden;border-radius:3px;aspect-ratio:4/3;}
.gallery img{width:100%;height:100%;object-fit:cover;transition:transform .6s ease;}
.gallery a:hover img{transform:scale(1.06);}
.gallery__more{text-align:center;margin-top:32px;}

/* lightbox */
.lightbox{display:none;position:fixed;inset:0;background:rgba(20,17,14,.94);z-index:400;align-items:center;justify-content:center;padding:30px;}
.lightbox.open{display:flex;}
.lightbox img{max-width:92vw;max-height:88vh;border-radius:3px;}
.lightbox__close,.lightbox__nav{position:absolute;color:#fff;background:none;border:none;cursor:pointer;font-size:40px;opacity:.8;transition:opacity var(--t);}
.lightbox__close{top:24px;right:30px;}
.lightbox__nav{top:50%;transform:translateY(-50%);font-size:54px;padding:0 22px;}
.lightbox__nav--prev{left:10px;} .lightbox__nav--next{right:10px;}
.lightbox button:hover{opacity:1;}

/* ── feature band (dark image) ── */
.band{position:relative;padding:130px 0;text-align:center;color:#fff;background:#000 center/cover no-repeat;}
.band::after{content:'';position:absolute;inset:0;background:rgba(36,31,26,.58);}
.band .container{position:relative;z-index:2;}
.band .title{color:#fff;}
.band p{color:rgba(255,255,255,.85);}

/* ── area cards ── */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:22px;margin-top:42px;text-align:left;}
.card{background:var(--white);border:1px solid var(--line);border-radius:4px;padding:30px 26px;transition:all var(--t);}
.card:hover{transform:translateY(-4px);box-shadow:0 18px 40px rgba(44,38,32,.12);}
.card h3{font-size:30px;text-transform:uppercase;color:var(--brown);margin-bottom:8px;}
.card p{font-size:15px;}

/* ── press ── */
.press{display:flex;align-items:center;justify-content:center;gap:30px;flex-wrap:wrap;}
.press img{height:42px;width:auto;opacity:.8;transition:opacity var(--t);filter:saturate(.2);}
.press a:hover img{opacity:1;filter:none;}

/* ── panels ── */
.panel--sand{background:var(--sand);}
.panel--cream{background:var(--cream);}

/* ── forms ── */
.form{max-width:620px;margin:0 auto;text-align:left;}
.form__row{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.form__group{margin-bottom:16px;}
.form__group label{display:block;font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--soft);margin-bottom:7px;}
.form input,.form textarea{width:100%;padding:13px 15px;background:var(--white);border:1px solid var(--line);border-radius:3px;font-family:var(--body);font-size:15px;color:var(--ink);outline:none;transition:border-color var(--t);}
.form input:focus,.form textarea:focus{border-color:var(--clay);}
.form textarea{min-height:140px;resize:vertical;}
.form__success{display:none;text-align:center;padding:34px;border:1px solid var(--clay);border-radius:4px;}
.form__success.show{display:block;}

/* ── footer ── */
.footer{background:var(--dark);color:rgba(255,255,255,.7);padding:60px 0 34px;text-align:center;}
.footer__logo{height:60px;margin:0 auto 22px;}
.footer__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px 26px;margin-bottom:22px;}
.footer__nav a{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:rgba(255,255,255,.7);}
.footer__nav a:hover{color:#fff;}
.footer__meta{font-size:13px;color:rgba(255,255,255,.45);}

/* ── reveal ── */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .7s ease,transform .7s ease;}
.reveal.in{opacity:1;transform:none;}

/* ── responsive ── */
@media (max-width:920px){
  .nav__menu{display:none;}
  .nav__burger{display:block;}
  .split{grid-template-columns:1fr;gap:36px;}
  .split--reverse .split__media{order:0;}
  .gallery{grid-template-columns:repeat(2,1fr);}
  .section{padding:78px 0;}
}
@media (max-width:560px){
  .container{padding:0 20px;}
  .form__row{grid-template-columns:1fr;}
  .gallery{grid-template-columns:1fr 1fr;gap:10px;}
  .facts{gap:30px;}
}
@media (prefers-reduced-motion:reduce){.reveal{opacity:1;transform:none;transition:none;}html{scroll-behavior:auto;}}