/* ══════════════════════════════════════════════
   NEST HOSPITALITY SOLUTIONS — GLOBAL STYLES
   Shared/reusable styles extracted from index.html
   ══════════════════════════════════════════════ */

/* ── RESET & VARIABLES ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
:root{
  --black:#0A0A0A;
  --black2:#111111;
  --gold:#B87333;
  --gold-light:#D4956B;
  --cream:#F5F0E8;
  --cream2:#EDE8DC;
  --linen:#EDE8DC;
  --warm-white:#FAF8F4;
  --text:#FAF8F4;
  --text-muted:rgba(245,240,232,0.55);
  --text-dim:rgba(245,240,232,0.28);
  --text-dk:#1A1714;
  --text-dk-mid:#4A4540;
  --text-dk-light:#9A9490;
  --serif:'Cormorant Garamond',Georgia,serif;
  --sans:'Barlow',sans-serif;
  --gold-line:rgba(184,115,51,0.22);
  --gold-line-dk:rgba(184,115,51,0.25);
}
html{font-size:16px;scroll-behavior:smooth}
body{font-family:var(--sans);background:var(--black);color:var(--text);line-height:1.7;-webkit-font-smoothing:antialiased}

/* ── LOGO ── */
.logo{display:inline-flex;align-items:center;text-decoration:none;line-height:1}
.logo .L{font-family:var(--serif);font-weight:400;font-size:var(--ls,1.5rem);color:var(--cream);letter-spacing:0.02em;line-height:1;padding:0 0.18em}
.logo .D{display:inline-block;width:1px;height:1.22em;background:var(--cream);opacity:0.32;flex-shrink:0;align-self:center}

/* ── NAV ── */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  height:68px;display:flex;align-items:center;justify-content:space-between;
  padding:0 3rem;
  background:rgba(10,10,10,0.97);
}
.nav-links{display:flex;gap:2rem;list-style:none;align-items:center}
.nav-links a{font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;color:rgba(245,240,232,0.5);text-decoration:none;transition:color 0.2s;white-space:nowrap}
.nav-links a:hover{color:var(--gold)}
.nav-cta{font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(184,115,51,0.4);padding:0.4rem 1.1rem;text-decoration:none;transition:all 0.2s;white-space:nowrap}
.nav-cta:hover{background:var(--gold);color:var(--black)}

/* ── SHARED LAYOUT ── */
.container{max-width:1200px;margin:0 auto;padding:0 3rem}
.lbl{font-size:0.58rem;letter-spacing:0.24em;text-transform:uppercase;color:var(--gold);display:flex;align-items:center;gap:0.65rem;margin-bottom:0.8rem;opacity:0.85}
.lbl::before{content:'';display:block;width:18px;height:1px;background:var(--gold)}
.lbl.center{justify-content:center}
.lbl.center::before,.lbl.center::after{content:'';display:block;width:18px;height:1px;background:var(--gold)}
h2.title{font-family:var(--serif);font-weight:300;font-size:clamp(1.8rem,3vw,2.6rem);line-height:1.15;color:var(--text);margin-bottom:1.3rem}
h2.title em{font-style:italic;color:var(--gold)}
p.body{font-size:0.88rem;font-weight:300;color:var(--text-muted);line-height:1.95;margin-bottom:1rem}
/* light section overrides */
.light-section .lbl{color:var(--gold)}
.light-section h2.title{color:var(--text-dk)}
.light-section h2.title em{color:var(--gold)}
.light-section p.body{color:var(--text-dk-mid)}
.light-section .btn-outline{border-color:rgba(26,23,20,0.25);color:var(--text-dk-mid)}
.light-section .btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.btn-gold{display:inline-block;background:var(--gold);color:var(--black);font-size:0.7rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;padding:0.82rem 1.9rem;text-decoration:none;transition:background 0.2s;border:none;cursor:pointer}
.btn-gold:hover{background:var(--gold-light)}
.btn-outline{display:inline-block;border:1px solid rgba(245,240,232,0.2);color:var(--text-muted);font-size:0.7rem;font-weight:400;letter-spacing:0.1em;text-transform:uppercase;padding:0.82rem 1.9rem;text-decoration:none;transition:all 0.2s}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.divider{height:1px;background:var(--gold-line);margin:0}
section{padding:6rem 0}

/* ── SENTRIX CHROME X LOGO ── */
/* Default inline X — used in headings and prominent brand mentions (focal point) */
/* Negative left margin tucks the X tight against "Sentri" so the lockup reads as one word */
.sx-x{display:inline-block;width:1.35em;height:1.35em;vertical-align:-0.38em;object-fit:contain;flex-shrink:0;margin-left:-0.22em;margin-right:0.02em}
/* Hero-scale X — hero headlines only */
.sx-x-lg{width:1.7em!important;height:1.7em!important;vertical-align:-0.55em!important;margin-left:-0.28em!important;margin-right:0.04em!important}
/* Compact X — nav links, footer links, small inline contexts */
.sx-x-sm{width:1.05em!important;height:1.05em!important;vertical-align:-0.2em!important;margin-left:-0.18em!important;margin-right:0!important}
/* Product suffix — IQ, ST, VP, Platform, Suite — Cormorant 500 regular (not italic), gold, tight */
.sx-suffix{font-family:var(--serif)!important;font-weight:500!important;font-style:normal!important;color:var(--gold)!important;margin-left:-0.1em;display:inline-block}

/* ── PHOTO PLACEHOLDER ── */
.photo{background:#0a0a0a;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;border:none}
.photo::after{content:'';}
.photo img{width:100%;height:100%;object-fit:cover;display:block}

/* ── FORM STYLES ── */
form{display:flex;flex-direction:column;gap:1rem}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
input,textarea,select{
  background:rgba(245,240,232,0.04);
  border:1px solid rgba(245,240,232,0.12);
  color:var(--text);
  font-family:var(--sans);font-size:0.82rem;font-weight:300;
  padding:0.85rem 1rem;
  width:100%;
  outline:none;
  transition:border-color 0.2s;
}
input::placeholder,textarea::placeholder{color:var(--text-dim)}
input:focus,textarea:focus,select:focus{border-color:rgba(184,115,51,0.5)}
textarea{min-height:130px;resize:vertical}
select option{background:var(--black2);color:var(--text)}
.form-note{font-size:0.7rem;color:var(--text-dim);line-height:1.6}

/* ── FOOTER ── */
footer{background:#050505;padding:3.5rem 0 1.8rem;border-top:1px solid var(--gold-line)}
.footer-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:2.5rem;margin-bottom:2.5rem}
.footer-tagline{font-size:0.75rem;color:var(--text-dim);line-height:1.75;max-width:210px;margin-top:0.7rem}
.footer-head{font-size:0.56rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;opacity:0.65}
.footer-links{list-style:none;display:flex;flex-direction:column;gap:0.48rem}
.footer-links a{font-size:0.76rem;color:rgba(245,240,232,0.28);text-decoration:none;transition:color 0.2s}
.footer-links a:hover{color:var(--gold)}
.footer-contact p{font-size:0.76rem;color:rgba(245,240,232,0.28);margin-bottom:0.3rem}
.footer-contact a{color:rgba(245,240,232,0.28);text-decoration:none;transition:color 0.2s}
.footer-contact a:hover{color:var(--gold)}
.footer-bottom{border-top:1px solid rgba(245,240,232,0.05);padding-top:1.4rem;display:flex;justify-content:space-between;align-items:center}
.footer-bottom p{font-size:0.62rem;color:rgba(245,240,232,0.18)}
.footer-bottom a{color:rgba(245,240,232,0.18);text-decoration:none}

/* ── MOBILE NAV / HAMBURGER ── */
.hamburger{display:none;flex-direction:column;justify-content:center;gap:5px;cursor:pointer;padding:6px 0;background:none;border:none;outline:none}
.hamburger span{display:block;width:22px;height:1px;background:var(--cream);opacity:0.75;transition:all 0.25s ease}
.hamburger.open span:nth-child(1){transform:translateY(6px) rotate(45deg);opacity:1}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:translateY(-6px) rotate(-45deg);opacity:1}
@media(max-width:800px){
  .hamburger{display:flex}
  .nav-links{display:none;position:absolute;top:68px;left:0;right:0;background:rgba(10,10,10,0.98);flex-direction:column;padding:1.2rem 1.5rem 1.5rem;gap:0;border-bottom:1px solid var(--gold-line);z-index:99}
  .nav-links.open{display:flex}
  .nav-links li{border-bottom:1px solid rgba(245,240,232,0.06)}
  .nav-links li:last-child{border-bottom:none}
  .nav-links a{display:block;padding:0.85rem 0;font-size:0.72rem}
  .nav-cta{display:none}
  nav{padding:0 1.5rem;position:relative}
}

/* ── SENTRIX HERO S MARK ── */
.sentrix-hero-mark{position:absolute;right:3rem;top:50%;transform:translateY(-50%);width:380px;height:auto;opacity:0.35;pointer-events:none;mix-blend-mode:lighten}
@media(max-width:800px){
  .sentrix-hero-mark{right:1rem;width:220px;opacity:0.25}
}

/* ── SR-ONLY ── */
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}

/* ── SHARED RESPONSIVE ── */
@media(max-width:800px){
  .container{padding:0 1.4rem!important}
  nav{padding:0 1.4rem!important}
  section{padding:3.5rem 0!important}
  .footer-grid{grid-template-columns:1fr 1fr!important;gap:1.8rem!important}
  .footer-head{font-size:0.6rem!important}
  .footer-bottom-inner,.footer-bottom>div{flex-direction:column!important;gap:0.4rem!important;text-align:center!important}
  .footer-bottom{text-align:center!important}
  .form-row{grid-template-columns:1fr!important}
}


/* ══════════════════════════════════════════════
   ANIMATIONS & ENHANCEMENTS
   ══════════════════════════════════════════════ */

/* ── ANIMATIONS ── */
@keyframes heroFadeIn {
  from { opacity: 0; transform: translateY(16px); }
  to { opacity: 1; transform: translateY(0); }
}
.hero-eyebrow { animation: heroFadeIn 0.8s ease 0.2s both; }
.hero h1 { animation: heroFadeIn 0.8s ease 0.4s both; }
.hero-sub { animation: heroFadeIn 0.8s ease 0.6s both; }
.hero-actions { animation: heroFadeIn 0.8s ease 0.8s both; }

/* Scroll reveal */
.reveal {
  opacity: 0;
  transform: translateY(24px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.reveal.visible {
  opacity: 1;
  transform: translateY(0);
}

/* Gold shimmer on CTA */
.btn-gold { position: relative; overflow: hidden; }
.btn-gold::after {
  content: '';
  position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.15), transparent);
  transition: left 0.5s ease;
  pointer-events: none;
}
.btn-gold:hover::after { left: 100%; }

/* Scroll-to-top button */
.scroll-top {
  position: fixed; bottom: 2rem; right: 2rem; z-index: 90;
  width: 40px; height: 40px;
  background: var(--gold); color: var(--black);
  border: none; cursor: pointer;
  font-size: 1.1rem; line-height: 40px; text-align: center;
  opacity: 0; pointer-events: none;
  transition: opacity 0.3s, background 0.2s;
}
.scroll-top.visible { opacity: 1; pointer-events: auto; }
.scroll-top:hover { background: var(--gold-light); }

/* Sticky mobile CTA bar */
.mobile-cta-bar {
  display: none;
  position: fixed; bottom: 0; left: 0; right: 0; z-index: 99;
  padding: 0.8rem 1.5rem;
  background: rgba(10,10,10,0.95);
  border-top: 1px solid var(--gold-line);
  text-align: center;
}

/* Form validation errors */
.field-error { border-color: #c0392b !important; }
.error-msg { color: #c0392b; font-size: 0.7rem; margin-top: 0.3rem; display: block; }

/* Enhanced service card hover */
.svc { transition: background 0.25s, transform 0.25s; }
.svc:hover { transform: translateY(-3px); }

/* Responsive animations */
@media(max-width:800px) {
  .mobile-cta-bar.visible { display: block; }
}

/* Reduced motion */
@media(prefers-reduced-motion: reduce) {
  .reveal { transition: none; opacity: 1; transform: none; }
  .hero-eyebrow, .hero h1, .hero-sub, .hero-actions { animation: none; }
  .btn-gold::after { display: none; }
  .svc { transition: background 0.25s; }
  .svc:hover { transform: none; }
}