/* ========================================
   Home for the Holidays — Global Styles
   ======================================== */
:root {
  --green: #1B4332; --green-light: #2D6A4F; --green-dark: #0B2920;
  --gold: #B8952F; --gold-light: #D4BC72;
  --cranberry: #8B1A1A; --cranberry-light: #A52A2A;
  --cream: #FDF8F0; --cream-dark: #F5EDE0;
  --charcoal: #2D2D2D; --gray: #6B6B6B; --gray-light: #757575;
  --white: #FFFFFF;
  --shadow: 0 4px 20px rgba(0,0,0,.08);
  --shadow-lg: 0 8px 40px rgba(0,0,0,.12);
  --radius: 8px;
  --transition: all .3s ease;
}
* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Lato',sans-serif; color:var(--charcoal); background:var(--cream); line-height:1.7; }
img { max-width:100%; height:auto; display:block; }
a { color:var(--green); text-decoration:none; transition:var(--transition); }
a:hover { color:var(--gold); }
.container { max-width:1200px; margin:0 auto; padding:0 1.5rem; }

/* ---- Typography ---- */
h1,h2,h3,h4 { font-family:'Playfair Display',serif; color:var(--green); line-height:1.3; }
h1 { font-size:clamp(2rem,5vw,3.5rem); }
h2 { font-size:clamp(1.6rem,3.5vw,2.5rem); margin-bottom:1rem; }
h3 { font-size:clamp(1.2rem,2.5vw,1.6rem); margin-bottom:.5rem; }
p { margin-bottom:1rem; }
.text-gold { color:var(--gold); }
.text-center { text-align:center; }
.subtitle { font-size:1.1rem; color:var(--gray); max-width:600px; margin:0 auto 2rem; }

/* ---- Buttons ---- */
.btn { display:inline-block; padding:.85rem 2.25rem; border-radius:var(--radius); font-weight:600; font-size:.95rem; cursor:pointer; transition:var(--transition); border:none; text-decoration:none; letter-spacing:.3px; }
.btn-gold { background:var(--gold); color:var(--white); }
.btn-gold:hover { background:var(--gold-light); color:var(--white); transform:translateY(-2px); box-shadow:var(--shadow); }
.btn-outline { background:transparent; color:var(--white); border:2px solid var(--white); }
.btn-outline:hover { background:var(--white); color:var(--green); }
.btn-green { background:var(--green); color:var(--white); }
.btn-green:hover { background:var(--green-light); color:var(--white); transform:translateY(-2px); }

/* ---- Header / Nav ---- */
header { position:fixed; top:0; left:0; right:0; z-index:1000; background:rgba(27,67,50,.95); backdrop-filter:blur(10px); border-bottom:1px solid rgba(255,255,255,.1); transition:var(--transition); }
header.scrolled { background:rgba(27,67,50,.98); box-shadow:0 2px 20px rgba(0,0,0,.15); }
nav { display:flex; align-items:center; justify-content:space-between; padding:.75rem 0; }
.nav-logo { font-family:'Playfair Display',serif; color:var(--white); font-size:1.3rem; font-weight:700; display:flex; align-items:center; gap:.5rem; }
.nav-logo span { color:var(--gold); }
.nav-links { display:flex; align-items:center; gap:2rem; list-style:none; }
.nav-links a { color:rgba(255,255,255,.85); font-size:.9rem; font-weight:400; letter-spacing:.3px; }
.nav-links a:hover, .nav-links a.active { color:var(--gold); }
.nav-cta { background:var(--gold); color:var(--white) !important; padding:.5rem 1.25rem; border-radius:var(--radius); font-weight:600 !important; }
.nav-cta:hover { background:var(--gold-light); color:var(--white) !important; }
.hamburger { display:none; flex-direction:column; gap:5px; cursor:pointer; padding:.5rem; }
.hamburger span { width:24px; height:2px; background:var(--white); transition:var(--transition); }

/* ---- Hero ---- */
.hero { min-height:100vh; display:flex; align-items:center; justify-content:center; text-align:center; color:var(--white); position:relative; overflow:hidden; padding:6rem 1.5rem 4rem; }
.hero-bg { position:absolute; inset:0; background:linear-gradient(135deg, rgba(11,41,32,.85), rgba(27,67,50,.8)), url("https://images.unsplash.com/photo-1545048702-79362596cdc9?w=1600") center/cover; z-index:0; }
.hero-bg::after { content:''; position:absolute; inset:0; background:url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.03'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E"); }
.hero-content { position:relative; z-index:1; max-width:800px; }
.hero h1 { margin-bottom:1rem; font-weight:700; }
.hero h1 em { color:var(--gold); font-style:normal; }
.hero .lead { font-size:clamp(1rem,2vw,1.25rem); opacity:.85; margin-bottom:2.5rem; font-weight:300; }
.hero-buttons { display:flex; gap:1rem; justify-content:center; flex-wrap:wrap; }
.hero-badge { margin-top:3rem; font-size:.8rem; letter-spacing:2px; text-transform:uppercase; opacity:.5; }

/* ---- Section Styles ---- */
section { padding:5rem 0; }
section:nth-child(even) { background:var(--white); }
.section-header { text-align:center; margin-bottom:3rem; }

/* ---- Service Highlights (Home) ---- */
.highlights { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:2rem; margin-top:2rem; }
.highlight-card { background:var(--white); border-radius:var(--radius); padding:2.5rem 2rem; text-align:center; box-shadow:var(--shadow); transition:var(--transition); }
.highlight-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.highlight-icon { font-size:2.5rem; margin-bottom:1rem; }
.highlight-card h3 { color:var(--green); }
.highlight-card p { color:var(--gray); font-size:.9rem; }

/* ---- Testimonials ---- */
.testimonials-section { background:var(--green) !important; color:var(--white); padding:5rem 0; }
.testimonials-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(300px,1fr)); gap:2rem; }
.testimonial { background:rgba(255,255,255,.08); border:1px solid rgba(255,255,255,.1); border-radius:var(--radius); padding:2rem; }
.testimonial-text { font-style:italic; font-size:1.05rem; line-height:1.8; margin-bottom:1rem; opacity:.9; }
.testimonial-author { font-weight:600; color:var(--gold); }
.testimonial-location { font-size:.8rem; opacity:.6; }

/* ---- Urgency Banner ---- */
.urgency { background:var(--cranberry); color:var(--white); text-align:center; padding:3rem 1.5rem; }
.urgency h2 { color:var(--white); margin-bottom:.5rem; }
.urgency p { opacity:.85; margin-bottom:1.5rem; }

/* ---- Services Page ---- */
.services-hero { background:var(--green); color:var(--white); text-align:center; padding:8rem 1.5rem 4rem; }
.services-hero h1 { color:var(--white); }
.tier-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:2rem; margin-top:2rem; }
.tier-card { background:var(--white); border-radius:var(--radius); overflow:hidden; box-shadow:var(--shadow); transition:var(--transition); display:flex; flex-direction:column; }
.tier-card:hover { transform:translateY(-4px); box-shadow:var(--shadow-lg); }
.tier-card.featured { border:2px solid var(--gold); position:relative; }
.tier-card.featured::before { content:'Most Popular'; position:absolute; top:1rem; right:-2rem; background:var(--gold); color:#fff; font-size:.7rem; font-weight:700; padding:.3rem 2.5rem; transform:rotate(45deg); letter-spacing:1px; text-transform:uppercase; }
.tier-header { background:var(--green); color:var(--white); padding:2rem; text-align:center; }
.tier-header h3 { color:var(--gold); font-size:1.4rem; }
.tier-price { font-size:1.8rem; font-weight:700; margin:.5rem 0; }
.tier-price span { font-size:.85rem; font-weight:400; opacity:.7; }
.tier-body { padding:2rem; flex:1; display:flex; flex-direction:column; }
.tier-body ul { list-style:none; margin:0 0 1.5rem; flex:1; }
.tier-body li { padding:.5rem 0; border-bottom:1px solid var(--cream-dark); font-size:.9rem; display:flex; align-items:start; gap:.5rem; }
.tier-body li::before { content:'✓'; color:var(--green); font-weight:700; flex-shrink:0; }
.tier-body .btn { text-align:center; margin-top:auto; }

/* FAQ */
.faq-list { max-width:700px; margin:0 auto; }
.faq-item { border-bottom:1px solid var(--cream-dark); }
.faq-q { padding:1.25rem 0; font-weight:600; cursor:pointer; display:flex; justify-content:space-between; align-items:center; font-size:1rem; }
.faq-q::after { content:'+'; font-size:1.5rem; color:var(--gold); transition:var(--transition); }
.faq-item.open .faq-q::after { content:'−'; }
.faq-a { max-height:0; overflow:hidden; transition:max-height .3s ease; }
.faq-item.open .faq-a { max-height:300px; }
.faq-a p { padding:0 0 1.25rem; color:var(--gray); font-size:.9rem; }

/* ---- Gallery ---- */
.gallery-hero { background:var(--green); color:var(--white); text-align:center; padding:8rem 1.5rem 4rem; }
.gallery-hero h1 { color:var(--white); }
.gallery-filters { display:flex; justify-content:center; gap:.75rem; flex-wrap:wrap; margin-bottom:2rem; }
.gallery-filter { background:var(--white); border:1px solid var(--cream-dark); color:var(--gray); padding:.5rem 1.25rem; border-radius:20px; font-size:.85rem; cursor:pointer; transition:var(--transition); }
.gallery-filter:hover, .gallery-filter.active { background:var(--green); color:var(--white); border-color:var(--green); }
.gallery-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(280px,1fr)); gap:1.25rem; }
.gallery-item { aspect-ratio:4/3; border-radius:var(--radius); overflow:hidden; position:relative; cursor:pointer; background:var(--green-light); display:flex; align-items:center; justify-content:center; text-align:center; color:var(--white); transition:var(--transition); }
.gallery-item:hover { transform:scale(1.02); box-shadow:var(--shadow-lg); }
.gallery-item img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.gallery-placeholder { padding:2rem; }
.gallery-placeholder .ph-icon { font-size:2.5rem; margin-bottom:.5rem; opacity:.5; }
.gallery-placeholder .ph-text { font-size:.85rem; opacity:.6; }
.gallery-placeholder .ph-cat { font-size:.75rem; background:rgba(255,255,255,.15); padding:.25rem .75rem; border-radius:10px; display:inline-block; margin-top:.5rem; }

/* Lightbox */
.lightbox { position:fixed; inset:0; background:rgba(0,0,0,.9); z-index:2000; display:none; align-items:center; justify-content:center; padding:2rem; }
.lightbox.active { display:flex; }
.lightbox img { max-width:90vw; max-height:85vh; border-radius:var(--radius); }
.lightbox-close { position:absolute; top:1.5rem; right:1.5rem; color:#fff; font-size:2rem; cursor:pointer; width:44px; height:44px; display:flex; align-items:center; justify-content:center; background:rgba(255,255,255,.1); border-radius:50%; border:none; }

/* ---- About ---- */
.about-hero { background:var(--green); color:var(--white); text-align:center; padding:8rem 1.5rem 4rem; }
.about-hero h1 { color:var(--white); }
.about-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; align-items:center; }
.about-photo { aspect-ratio:3/4; background:var(--green-light); border-radius:var(--radius); display:flex; align-items:center; justify-content:center; color:var(--white); font-size:1rem; opacity:.6; }
.about-text h2 { margin-bottom:1.5rem; }
.about-text p { color:var(--gray); }
.values-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:2rem; margin-top:2rem; }
.value-card { text-align:center; padding:2rem; }
.value-icon { font-size:2rem; margin-bottom:.75rem; }
.areas-section { background:var(--green) !important; color:var(--white); }
.areas-grid { display:grid; grid-template-columns:1fr 1fr; gap:3rem; text-align:center; }
.area-card h3 { color:var(--gold); font-size:1.4rem; margin-bottom:.5rem; }
.area-card p { opacity:.8; font-size:.9rem; }

/* ---- Contact ---- */
.contact-hero { background:var(--green); color:var(--white); text-align:center; padding:8rem 1.5rem 4rem; }
.contact-hero h1 { color:var(--white); }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:4rem; }
.contact-form label { display:block; font-size:.85rem; font-weight:600; margin-bottom:.35rem; color:var(--charcoal); }
.contact-form input, .contact-form select, .contact-form textarea { width:100%; padding:.75rem 1rem; border:1px solid var(--cream-dark); border-radius:var(--radius); font-size:.9rem; font-family:'Lato',sans-serif; background:var(--white); transition:var(--transition); margin-bottom:1.25rem; }
.contact-form input:focus, .contact-form select:focus, .contact-form textarea:focus { outline:none; border-color:var(--gold); box-shadow:0 0 0 3px rgba(201,168,76,.15); }
.contact-form textarea { min-height:120px; resize:vertical; }
.contact-info { display:flex; flex-direction:column; gap:2rem; }
.contact-card { background:var(--white); border-radius:var(--radius); padding:2rem; box-shadow:var(--shadow); }
.contact-card h3 { margin-bottom:.5rem; }
.contact-card p { color:var(--gray); font-size:.9rem; }
.calendly-placeholder { background:var(--white); border:2px dashed var(--gold); border-radius:var(--radius); padding:3rem 2rem; text-align:center; }
.calendly-placeholder h3 { color:var(--gold); }

/* ---- Footer ---- */
footer { background:var(--green-dark); color:var(--white); padding:3rem 0 1.5rem; }
.footer-grid { display:grid; grid-template-columns:2fr 1fr 1fr; gap:3rem; margin-bottom:2rem; }
.footer-brand { font-family:'Playfair Display',serif; font-size:1.3rem; margin-bottom:.75rem; }
.footer-brand span { color:var(--gold); }
footer p { font-size:.85rem; opacity:.7; line-height:1.6; }
footer h4 { font-size:.85rem; text-transform:uppercase; letter-spacing:1px; color:var(--gold); margin-bottom:1rem; }
footer ul { list-style:none; }
footer li { margin-bottom:.5rem; }
footer li a { color:rgba(255,255,255,.7); font-size:.85rem; }
footer li a:hover { color:var(--gold); }
.footer-bottom { border-top:1px solid rgba(255,255,255,.1); padding-top:1.5rem; text-align:center; font-size:.8rem; opacity:.5; }

/* ---- Animations ---- */
.fade-in { opacity:0; transform:translateY(20px); transition:opacity .6s ease, transform .6s ease; }
.fade-in.visible { opacity:1; transform:translateY(0); }

/* ---- Responsive ---- */
@media(max-width:768px) {
  .nav-links { position:fixed; top:0; right:-100%; width:75%; height:100vh; background:var(--green-dark); flex-direction:column; padding:5rem 2rem; transition:var(--transition); box-shadow:var(--shadow-lg); }
  .nav-links.open { right:0; }
  .hamburger { display:flex; }
  .about-grid, .contact-grid, .footer-grid, .areas-grid { grid-template-columns:1fr; }
  .about-grid { gap:2rem; }
  section { padding:3.5rem 0; }
  .hero { min-height:90vh; }
}
