:root {
    --header-height: 90px;
    --shadow-lg: 0 20px 40px rgba(0,0,0,.1);
    --shadow-md: 0 8px 30px rgba(212,165,116,.15);
    --shadow-sm: 0 4px 20px rgba(0,0,0,.03);
    --shadow-xl: 0 30px 60px rgba(0,0,0,.15);
    --transition-base: all .3s cubic-bezier(.23,1,.32,1);
    --transition-sharp: all .2s cubic-bezier(.4,0,.2,1);
    --transition-smooth: all .4s cubic-bezier(.23,1,.32,1);
}

@supports (font-variation-settings: normal) {
    body { font-variation-settings: 'wght' 500; }
    h1,h2,h3,h4,h5,h6 { font-variation-settings: 'wght' 800; }
}

body {
    line-height: 1.6;
    letter-spacing: -.01em;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 800;
    line-height: 1.1;
    letter-spacing: -.03em;
}

button {
  font-family: inherit;
  font-size: inherit;
  line-height: inherit;
  cursor: pointer;
}

/* ===== HERO ===== */
.faq-hero{
    min-height: 100vh;
    background: radial-gradient(ellipse at top, rgba(212, 175, 55, .12) 0%, transparent 50%), linear-gradient(180deg, var(--espresso) 0%, #1a100a 100%);
    position:relative; display:flex; align-items:center; justify-content:center; overflow:visible;  /* allow descenders */
    padding-top: -var(--header-height);
}
.hero-grid{ position:absolute; inset:0; background-image:linear-gradient(rgba(212,175,55,.03) 1px, transparent 1px), linear-gradient(90deg, rgba(212,175,55,.03) 1px, transparent 1px); background-size:50px 50px; opacity:.5; animation:gridMove 30s linear infinite; }
@keyframes gridMove{ 0%{ transform:translate(0,0);} 100%{ transform:translate(50px,50px);} }
.hero-noise{ position:absolute; inset:0; opacity:.02; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 400 400' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='noiseFilter'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23noiseFilter)'/%3E%3C/svg%3E"); z-index:1; mix-blend-mode:overlay; }
.hero-content{ position:relative; z-index:2; text-align:center; padding:2rem; max-width:1100px; width:100%; animation:fadeInUp 1s ease-out; overflow:visible; }
@keyframes fadeInUp{ from{ opacity:0; transform:translateY(30px);} to{ opacity:1; transform:translateY(0);} }

.hero-badge{ display:inline-flex; align-items:center; gap:.75rem; font-size:.6875rem; letter-spacing:.3em; text-transform:uppercase; color:#EDE8DD; font-weight:700; margin-bottom:2.5rem; position:relative; padding:.625rem 1.5rem; background:linear-gradient(135deg, rgba(212,175,55,.08) 0%, transparent 100%); border:1px solid rgba(212,175,55,.2); border-radius:50px; backdrop-filter: blur(10px); }
.hero-title{ font-family:'Bebas Neue', sans-serif; font-size: clamp(5rem, 12vw, 10rem); line-height:1.03; color: var(--pure-white); margin-bottom:2rem; letter-spacing:-.04em; text-shadow:0 2px 10px rgba(0,0,0,.3); padding-bottom:.22em; }
.hero-title .accent{ position:relative; -webkit-text-fill-color:#fff; }
/* accent: clean white (no mustard) */
.hero-title .accent.clean{ -webkit-text-fill-color:#fff; text-shadow:0 2px 10px rgba(0,0,0,.25); }
/* Optional alternates (not used by default) */
.hero-title .accent.pearl{ background: linear-gradient(135deg, #ffffff 0%, #f5efe4 45%, #e8decd 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; filter: drop-shadow(0 2px 8px rgba(0,0,0,.25)); }
.hero-title .accent.taupe{ background: linear-gradient(135deg, #d2c3ab, #b59c7a); -webkit-background-clip: text; -webkit-text-fill-color: transparent; }

.hero-subtitle{ font-size:1.375rem; font-weight:300; color:var(--sand); line-height:1.5; max-width:700px; margin:0 auto 3.5rem; opacity:.9; letter-spacing:.01em; }

.hero-stats{ display:flex; justify-content:center; gap:5rem; padding:2.5rem 0; border-top:1px solid rgba(212,175,55,.15); border-bottom:1px solid rgba(212,175,55,.15); background:linear-gradient(90deg, transparent, rgba(212,175,55,.05), transparent); }
.stat-item{ text-align:center; animation:fadeIn 1s ease-out forwards; opacity:0; }
.stat-item:nth-child(1){ animation-delay:.2s;} .stat-item:nth-child(2){ animation-delay:.4s;} .stat-item:nth-child(3){ animation-delay:.6s;}
@keyframes fadeIn{ to{ opacity:1; } }
.stat-number{ font-family:'Bebas Neue', sans-serif; font-size:3rem; color:transparent; background:linear-gradient(135deg, var(--warm-beige) 0%, var(--light-beige) 100%); background-clip:text; -webkit-background-clip:text; display:block; line-height:1; filter: drop-shadow(0 2px 4px rgba(0,0,0,.2)); }
.stat-label{ font-size:.6875rem; color:#EDE8DD; text-transform:uppercase; letter-spacing:.15em; margin-top:.625rem; opacity:.8; font-weight:600; }
.scroll-indicator{ position:absolute; bottom:3rem; left:50%; transform:translateX(-50%); color:#EDE8DD; opacity:.4; animation:pulse 2s infinite; }
@keyframes pulse{ 0%,100%{ opacity:.4; transform:translateX(-50%) translateY(0);} 50%{ opacity:.8; transform:translateX(-50%) translateY(5px);} }

/* ===== FILTER SECTION ===== */
.filter-section{
    background: linear-gradient(180deg, var(--pure-white) 0%, var(--gray-50) 100%);
    padding: 3rem 0 2.5rem;
    position: sticky;
    top: var(--header-height);
    z-index: var(--z-dropdown);
    border-bottom: 1px solid rgba(0,0,0,0.08);
    box-shadow: 0 4px 6px -1px rgba(0,0,0,0.1), 0 2px 4px -1px rgba(0,0,0,0.06), inset 0 1px 0 rgba(255,255,255,1);
    backdrop-filter: blur(10px);
}
.filter-container{ max-width:1000px; margin:0 auto; padding:0 2rem; }
.filter-pills{ display:flex; justify-content:center; gap:1.25rem; flex-wrap:wrap; }
.filter-pill{
    padding:.875rem 2.25rem; background:linear-gradient(135deg, var(--cream) 0%, var(--pure-white) 100%); border:2px solid transparent;
    border-radius:500px; font-size:.875rem; font-weight:700; color:var(--gray-700); cursor:pointer; transition:var(--transition-sharp);
    position:relative; overflow:hidden; letter-spacing:.02em; text-transform:uppercase; box-shadow:0 1px 3px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.8);
}
.filter-pill::before{ content:''; position:absolute; inset:0; background:linear-gradient(135deg, var(--warm-beige) 0%, var(--warm-beige-dark) 100%); opacity:0; transition: opacity .3s ease; }
.filter-pill::after{ content:''; position:absolute; inset:0; background:linear-gradient(135deg, transparent 30%, rgba(255,255,255,.5) 50%, transparent 70%); transform:translateX(-100%) skewX(-20deg); transition: transform .6s ease; }
.filter-pill span{ position:relative; z-index:2; }
.filter-pill:hover{ transform:translateY(-2px); box-shadow:0 4px 8px rgba(212,165,116,.2), 0 2px 4px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.9); }
.filter-pill:hover::after{ transform:translateX(100%) skewX(-20deg); }
.filter-pill.active{ background:linear-gradient(135deg, var(--warm-beige) 0%, var(--warm-beige-dark) 100%); border-color:rgba(212,175,55,.3); color:var(--pure-white); text-shadow:0 1px 2px rgba(0,0,0,.2); box-shadow:0 4px 12px rgba(212,165,116,.3), 0 1px 3px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(0,0,0,.1); }
.filter-pill.active::before{ opacity:1; }

/* ===== FAQ SECTIONS ===== */
.faq-content{ background:linear-gradient(180deg, var(--cream) 0%, var(--pure-white) 50%, var(--cream) 100%); padding:6rem 0 2rem; min-height:100vh; position:relative; }
.faq-content::before{ content:''; position:absolute; inset:0; background-image:url("data:image/svg+xml,%3Csvg width='60' height='60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23D4A574' fill-opacity='0.02'%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"); opacity:.5; }
.faq-section{ padding:0; background:var(--pure-white); margin-bottom:5rem; border-radius:32px; overflow:hidden; box-shadow:0 20px 25px -5px rgba(0,0,0,.1), 0 10px 10px -5px rgba(0,0,0,.04), 0 0 0 1px rgba(0,0,0,.05); scroll-margin-top: calc(var(--header-height) + 120px); position:relative; z-index:1; transition:transform .3s ease; }
.faq-section:hover{ transform:translateY(-2px); box-shadow:0 25px 35px -5px rgba(0,0,0,.12), 0 15px 15px -5px rgba(0,0,0,.06), 0 0 0 1px rgba(0,0,0,.08); }
.section-header{ background: linear-gradient(135deg, var(--espresso) 0%, var(--rich-brown) 100%); padding:3.5rem; position:relative; overflow:hidden; }
.section-header::before{ content:''; position:absolute; top:-100%; right:-20%; width:60%; height:300%; background: radial-gradient(circle, rgba(212,175,55,.08) 0%, transparent 60%); animation: rotate 20s linear infinite; }
@keyframes rotate{ from{ transform:rotate(0);} to{ transform:rotate(360deg);} }
.section-header::after{ content:''; position:absolute; inset:0; background:linear-gradient(90deg, transparent, rgba(212,175,55,.05), transparent); animation:shine 3s ease-in-out infinite; }
@keyframes shine{ 0%,100%{ transform:translateX(-100%);} 50%{ transform:translateX(100%);} }
.section-title{ font-family:'Bebas Neue', sans-serif; font-size:3rem; color:var(--pure-white); margin-bottom:.625rem; position:relative; z-index:2; letter-spacing:-.02em; text-shadow:0 2px 8px rgba(0,0,0,.2); }
.section-description{ font-size:1.125rem; color:#EDE8DD; opacity:.95; position:relative; z-index:2; font-weight:300; letter-spacing:.02em; }

.faq-accordion{ padding:2.5rem; }
.faq-item{ padding: 0; border-bottom:1px solid rgba(0,0,0,.06); transition:all .3s cubic-bezier(.4,0,.2,1); position:relative; }
.faq-item:last-child{ border-bottom:none; }
.faq-item::after{ content:''; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg, transparent, var(--warm-beige), transparent); opacity:0; transition:opacity .3s ease; }
.faq-item:hover::after{ opacity:.3; }
.faq-item:hover{ background: linear-gradient(to right, rgba(212,165,116,.03) 0%, transparent 100%); }

.faq-question{ width:100%; padding:2.25rem 3.5rem 2.25rem 1.25rem; background:transparent; border:none; text-align:left; cursor:pointer; display:flex; justify-content:space-between; align-items:center; gap:2rem; transition:all .2s cubic-bezier(.4,0,.2,1); position:relative; }
.faq-question::before{ content:''; position:absolute; left:0; top:50%; transform:translateY(-50%); width:4px; height:0; background:linear-gradient(180deg, var(--warm-beige) 0%, var(--warm-beige-dark) 100%); transition:height .3s cubic-bezier(.4,0,.2,1); border-radius:4px; }
.faq-item.active .faq-question::before{ height:70%; }
.faq-question:hover{ color:revert; padding-left:1.75rem; }
button.faq-question:focus { outline:0 }
.faq-question-text{ font-size:1.3125rem; font-weight:700; color:var(--espresso); line-height:1.35; flex:1; letter-spacing:-.02em; }

.faq-icon{ width:36px; height:36px; flex-shrink:0; display:flex; align-items:center; justify-content:center; border-radius:50%; background:linear-gradient(135deg, var(--cream) 0%, var(--sand) 100%); color:var(--warm-beige); transition:all .3s cubic-bezier(.4,0,.2,1); box-shadow:0 2px 4px rgba(0,0,0,.06), inset 0 1px 0 rgba(255,255,255,.8); }
.faq-item.active .faq-icon{ background:linear-gradient(135deg, var(--warm-beige) 0%, var(--warm-beige-dark) 100%); color:var(--pure-white); transform:rotate(45deg); box-shadow:0 4px 8px rgba(212,165,116,.3), inset 0 1px 0 rgba(255,255,255,.2); }

.faq-answer{ max-height:0; overflow:hidden; transition:max-height .4s cubic-bezier(.4,0,.2,1); }
.faq-item.active .faq-answer{ max-height:2000px; padding-top: 0}
.faq-answer-inner{ padding:0 3.5rem 2.75rem 1.25rem; color:var(--gray-700); font-size:1.125rem; line-height:1.8; letter-spacing:-.01em; }
.faq-answer-inner p{ 
    margin-bottom:1.375rem; 
    font-size:1.125rem; 
}
.faq-answer-inner p:last-child{ margin-bottom:0; }
.faq-answer-inner strong{ color:var(--espresso); font-weight:700; background:linear-gradient(to bottom, transparent 60%, rgba(212,165,116,.2) 60%); padding:0 2px; }
.faq-answer-inner ul, .faq-answer-inner ol{ margin:1.75rem 0 1.75rem 1.5rem; line-height:2; }
.faq-answer-inner li{ margin-bottom:.875rem; position:relative; padding-left:.625rem; }
.faq-answer-inner ul li::before{ content:'◆'; position:absolute; left:-1.375rem; color:var(--warm-beige); font-weight:700; font-size:.75rem; }

.faq-note{ background:linear-gradient(135deg, rgba(212,175,55,.08) 0%, rgba(212,175,55,.03) 100%); border-left:4px solid #C2A064; padding:1.375rem 1.625rem; margin:1.75rem 0; border-radius:0 16px 16px 0; font-size:1rem; color:var(--gray-700); position:relative; box-shadow:0 1px 3px rgba(0,0,0,.04), inset 0 1px 0 rgba(255,255,255,.5); }
.faq-note::before{ content:'✦'; position:absolute; left:-2px; top:1.375rem; width:28px; height:28px; background:linear-gradient(135deg, #C2A064 0%, #9B7A4F 100%); color:var(--pure-white); border-radius:50%; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:14px; box-shadow:0 2px 4px rgba(0,0,0,.1); }

/* ===== CTA ===== */
.faq-cta{ background: radial-gradient(ellipse at bottom, rgba(212,175,55,.2) 0%, transparent 60%), linear-gradient(135deg, var(--espresso) 0%, #1a100a 100%); padding:10rem 0; position:relative; overflow:hidden; }
.faq-cta::before{ content:''; position:absolute; inset:0; background-image:repeating-linear-gradient(45deg, transparent, transparent 35px, rgba(212,175,55,.03) 35px, rgba(212,175,55,.03) 70px); animation:slide 20s linear infinite; }
@keyframes slide{ from{ transform:translate(0,0);} to{ transform:translate(70px,70px);} }
.cta-container{ max-width:1000px; margin:0 auto; padding:0 2rem; position:relative; z-index:2; }
.cta-content{ background: linear-gradient(135deg, rgba(212,175,55,.08) 0%, rgba(212,175,55,.02) 100%); border:1px solid rgba(212,175,55,.2); border-radius:32px; padding:6rem 4rem; text-align:center; backdrop-filter:blur(20px) saturate(150%); box-shadow:0 25px 50px -12px rgba(0,0,0,.5), inset 0 1px 0 rgba(255,255,255,.1), inset 0 -1px 0 rgba(0,0,0,.1); position:relative; overflow:hidden; }
.cta-content::before{ content:''; position:absolute; inset:0; background: radial-gradient(circle at 50% 0%, rgba(212,175,55,.1), transparent 60%); opacity:.5; }
.cta-badge{ display:inline-block; background:linear-gradient(135deg, #C2A064 0%, #9B7A4F 100%); color:var(--espresso); padding:.625rem 2rem; border-radius:500px; font-size:.8125rem; font-weight:800; text-transform:uppercase; letter-spacing:.15em; margin-bottom:2.5rem; box-shadow:0 4px 14px rgba(212,175,55,.4), inset 0 1px 0 rgba(255,255,255,.4), inset 0 -1px 0 rgba(0,0,0,.1); position:relative; z-index:2; }
.cta-title{ font-family:'Bebas Neue', sans-serif; font-size: clamp(3.5rem, 7vw, 5.5rem); color:var(--pure-white); margin-bottom:1.75rem; line-height:.9; letter-spacing:-.03em; text-shadow:0 2px 10px rgba(0,0,0,.3); position:relative; z-index:2; }
.cta-subtitle{ font-size:1.5rem; color:#EDE8DD; margin-bottom:3.5rem; opacity:.95; font-weight:300; letter-spacing:.01em; position:relative; z-index:2; }
.cta-buttons{ display:flex; justify-content:center; align-items:center; gap:2.5rem; flex-wrap:wrap; position:relative; z-index:2; }
.btn-primary{ display:inline-block; background:linear-gradient(135deg, var(--warm-beige) 0%, var(--warm-beige-dark) 100%); color:var(--pure-white); padding:1.375rem 3.5rem; border-radius:500px; font-weight:800; letter-spacing:.05em; text-transform:uppercase; font-size:.9375rem; transition:all .3s cubic-bezier(.4,0,.2,1); box-shadow:0 10px 30px rgba(212,165,116,.3), 0 1px 3px rgba(0,0,0,.08), inset 0 1px 0 rgba(255,255,255,.2), inset 0 -1px 0 rgba(0,0,0,.1); text-shadow:0 1px 2px rgba(0,0,0,.2); border:1px solid rgba(212,175,55,.2); }
.btn-primary:hover{ transform:translateY(-3px); box-shadow:0 15px 40px rgba(212,165,116,.4), 0 3px 6px rgba(0,0,0,.12), inset 0 1px 0 rgba(255,255,255,.3), inset 0 -1px 0 rgba(0,0,0,.15); }
.btn-secondary{ display:inline-flex; align-items:center; gap:.875rem; color:#EDE8DD; font-size:1.25rem; font-weight:600; transition:all .3s ease; border-bottom:2px solid transparent; padding-bottom:.25rem; }
.btn-secondary:hover{ color:var(--warm-beige); border-color:var(--warm-beige); transform:translateX(3px); }
.phone-number{ font-family:'Bebas Neue', sans-serif; font-size:2.25rem; letter-spacing:.05em; text-shadow:0 2px 4px rgba(0,0,0,.2); }

/* ===== RESPONSIVE ===== */

@media (max-width:768px){
    
    .nav-inner{ padding:1rem 1.5rem; }
    .faq-hero{ min-height:80vh; }
    .hero-title{ font-size:4rem; }
    .hero-stats{ flex-direction:column; gap:1.5rem; }
    .filter-pills{ gap:.625rem; }
    .filter-pill{ padding:.75rem 1.5rem; font-size:.75rem; }
    .section-header{ padding:2.5rem; }
    .section-title{ font-size:2.25rem; }
    .faq-accordion{ padding:1.5rem; }
    .faq-question{ padding:1.75rem 2.5rem 1.75rem .75rem; }
    .faq-question-text{ font-size:1.125rem; }
    .faq-answer-inner{ padding:0 2.5rem 2rem .75rem; font-size:1rem; }
    .cta-content{ padding:4rem 2.5rem; }
    .cta-buttons{ flex-direction:column; }
    .phone-number{ font-size:1.75rem; }
    .footer-wrap{ grid-template-columns:1fr; }


    .faq-answer-inner p{ 
        font-size: 16px;
    }
}
@media (max-width:640px){
    .filter-section {
        position: relative;
        top: 0;
    }
    .container{ padding:0 1rem; }
}

/* ===== REDUCED MOTION ===== */
@media (prefers-reduced-motion: reduce){
    .hero-grid,.scroll-indicator{ animation:none !important; }
}

/* ===== PRINT ===== */
@media print{
    .filter-section, .faq-cta, .hero-stats, .scroll-indicator{ display:none !important; }
    .faq-item .faq-answer{ max-height:none !important; }
    .faq-item{ page-break-inside:avoid; }
}