*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
:root{
  --gold:#F5A623;--gold-light:#FFB93E;--gold-dim:rgba(245,166,35,0.15);
  --dark:#0F0D0A;--dark-mid:#181410;--dark-card:#1E1A14;
  --cream:#FFFFFF;--cream-dim:rgba(255,255,255,0.82);--cream-faint:rgba(255,255,255,0.08);
  --red:#B03A2E;--green:#2A6645;
  --border:rgba(200,149,42,0.14);
}
body{font-family:'DM Sans',sans-serif;background:var(--dark);color:var(--cream);overflow-x:hidden;min-height:100vh}

nav{
  position:fixed;top:0;width:100%;z-index:200;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 3.5rem;height:64px;
  background:rgba(15,13,10,0.95);
  backdrop-filter:blur(14px);
  border-bottom:1px solid var(--border);
}
.logo{font-family:'Bebas Neue',sans-serif;font-size:1.75rem;letter-spacing:0.06em;color:var(--gold);cursor:pointer;text-decoration:none}
.logo span{color:var(--cream)}
.nav-links{display:flex;align-items:center;gap:0.2rem;list-style:none}
.nav-links li a,.nav-links li button{
  background:none;border:none;color:rgba(255,255,255,0.82);font-family:'DM Sans',sans-serif;
  font-size:0.82rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;cursor:pointer;
  padding:0.5rem 0.9rem;border-radius:3px;text-decoration:none;transition:color 0.2s,background 0.2s;
}
.nav-links li a:hover,.nav-links li button:hover{color:var(--cream);background:var(--cream-faint)}
.nav-links li a.active,.nav-links li button.active{color:var(--gold)}
.nav-cta{background:var(--gold)!important;color:var(--dark)!important;padding:0.5rem 1.2rem!important;font-weight:600!important;border-radius:2px!important}
.nav-cta:hover{background:var(--gold-light)!important;color:var(--dark)!important}
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:0.4rem;background:none;border:none}
.hamburger span{width:22px;height:2px;background:var(--cream);transition:0.3s;display:block}

.page{display:none;padding-top:64px;animation:fadeIn 0.35s ease}
.page.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}

.section{padding:5.5rem 3.5rem}
.container{max-width:1220px;margin:0 auto}
.eyebrow{display:inline-block;font-size:0.7rem;letter-spacing:0.22em;text-transform:uppercase;color:var(--gold);border:1px solid rgba(245,166,35,0.3);padding:0.28rem 0.85rem;border-radius:2px;margin-bottom:1.2rem}
.h1{font-family:'Bebas Neue',sans-serif;font-size:clamp(3.8rem,8vw,7.5rem);line-height:0.9;letter-spacing:0.02em;color:var(--cream)}
.h2{font-family:'Bebas Neue',sans-serif;font-size:clamp(2.4rem,4.5vw,3.8rem);line-height:0.95;letter-spacing:0.03em;color:var(--cream)}
.h3{font-family:'Bebas Neue',sans-serif;font-size:1.4rem;letter-spacing:0.06em;color:var(--cream)}
.lead{font-size:1rem;color:rgba(255,255,255,0.82);line-height:1.7;font-weight:300}
.gold{color:var(--gold)}
.divider{height:1px;background:var(--border);margin:0}

.btn{display:inline-block;font-size:0.84rem;font-weight:600;letter-spacing:0.07em;text-transform:uppercase;padding:0.85rem 2rem;border-radius:2px;border:none;cursor:pointer;text-decoration:none;transition:transform 0.15s,background 0.2s}
.btn:hover{transform:translateY(-2px)}
.btn-gold{background:var(--gold);color:var(--dark)}
.btn-gold:hover{background:var(--gold-light)}
.btn-outline{background:transparent;color:var(--cream);border:1px solid rgba(255,255,255,0.28)}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}

.card{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;transition:border-color 0.22s,transform 0.22s}
.card:hover{border-color:rgba(245,166,35,0.38);transform:translateY(-3px)}
.tag{display:inline-block;font-size:0.65rem;font-weight:600;letter-spacing:0.12em;text-transform:uppercase;padding:0.18rem 0.65rem;border-radius:2px}
.tag-bad{background:rgba(176,58,46,0.18);color:#e87c6e;border:1px solid rgba(176,58,46,0.3)}
.tag-good{background:rgba(42,102,69,0.22);color:#6ecf96;border:1px solid rgba(42,102,69,0.3)}
.tag-freq{background:var(--gold-dim);color:var(--gold);border:1px solid rgba(245,166,35,0.28)}

.form-group{display:flex;flex-direction:column;gap:0.38rem;margin-bottom:1rem}
label.fl{font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:rgba(255,255,255,0.82);font-weight:500}
input,textarea,select{background:var(--dark);border:1px solid rgba(245,166,35,0.2);border-radius:2px;color:var(--cream);padding:0.72rem 0.9rem;font-family:'DM Sans',sans-serif;font-size:0.88rem;outline:none;width:100%;transition:border-color 0.2s}
input:focus,textarea:focus,select:focus{border-color:var(--gold)}
select option{background:var(--dark-card)}
textarea{resize:vertical;min-height:110px}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.grid-2{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem}
.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}

.toast{position:fixed;bottom:2rem;left:50%;transform:translateX(-50%) translateY(8px);background:var(--green);color:#fff;padding:1rem 2rem;border-radius:3px;font-size:0.86rem;font-weight:500;opacity:0;transition:0.3s;z-index:999;pointer-events:none;text-align:center;white-space:nowrap}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0)}

/* HERO */
.hero{min-height:calc(100vh - 64px);display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;background:url('../images/hero-bg.jpg') center center / cover no-repeat}
.hero-bg{position:absolute;inset:0;background:linear-gradient(to bottom,rgba(10,8,5,0.55) 0%,rgba(10,8,5,0.45) 50%,rgba(10,8,5,0.7) 100%),radial-gradient(ellipse 70% 60% at 50% 40%,rgba(245,166,35,0.18),transparent 70%)}
.hero-mesh{position:absolute;inset:0;background-image:linear-gradient(rgba(245,166,35,0.025) 1px,transparent 1px),linear-gradient(90deg,rgba(245,166,35,0.025) 1px,transparent 1px);background-size:55px 55px;mask-image:radial-gradient(ellipse 80% 80% at 50% 50%,black 20%,transparent 100%)}
.hero-content{position:relative;z-index:2;text-align:center;max-width:860px;padding:2rem;animation:heroIn 0.9s cubic-bezier(0.22,1,0.36,1) both}
@keyframes heroIn{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}
.hero-title{margin-bottom:1.5rem}
.hero-title em{font-style:normal;color:var(--gold)}
.hero-sub{max-width:500px;margin:0 auto 2.6rem;font-size:1.05rem}
.hero-btns{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}

/* PROBLEMS BAR */
.problems-bar{background:var(--dark-mid);border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:2.8rem 3.5rem}
.problems-inner{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:repeat(5,1fr)}
.prob-item{padding:1.4rem 1.6rem;border-right:1px solid var(--border);display:flex;flex-direction:column;gap:0.4rem}
.prob-item:last-child{border-right:none}
.prob-icon{font-size:1.7rem}
.prob-name{font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:0.05em}
.prob-desc{font-size:0.831rem;color:rgba(255,255,255,0.82);line-height:1.5;font-weight:300}

/* HOME PAGE CARDS */
.page-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem;max-width:1220px;margin:0 auto}
.page-card{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;padding:2rem 1.8rem;cursor:pointer;transition:border-color 0.22s,transform 0.22s;position:relative;overflow:hidden}
.page-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold);transform:scaleX(0);transition:transform 0.3s;transform-origin:left}
.page-card:hover{border-color:rgba(245,166,35,0.4);transform:translateY(-4px)}
.page-card:hover::after{transform:scaleX(1)}
.pc-icon{font-size:2rem;margin-bottom:1rem;display:block}
.pc-title{font-family:'Bebas Neue',sans-serif;font-size:1.3rem;letter-spacing:0.06em;margin-bottom:0.4rem}
.pc-desc{font-size:0.8rem;color:rgba(255,255,255,0.82);line-height:1.55;font-weight:300}
.pc-link{display:inline-flex;align-items:center;gap:0.3rem;font-size:0.75rem;color:var(--gold);font-weight:600;letter-spacing:0.08em;text-transform:uppercase;margin-top:1rem}

/* CONTACT INFO */
.cinfo-item{display:flex;align-items:center;gap:0.8rem;margin-bottom:0.9rem;font-size:0.87rem;color:rgba(255,255,255,0.82)}
.cinfo-icon{width:34px;height:34px;background:var(--gold-dim);border:1px solid rgba(245,166,35,0.25);border-radius:2px;display:flex;align-items:center;justify-content:center;font-size:0.95rem;flex-shrink:0}

/* BEFORE/AFTER */
.ba-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.4rem}
.ba-card{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;overflow:hidden;transition:border-color 0.22s,transform 0.22s}
.ba-card:hover{border-color:rgba(245,166,35,0.38);transform:translateY(-4px)}
.ba-visual{display:grid;grid-template-columns:1fr 1fr;height:160px;position:relative}
.ba-half{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.5rem;position:relative;overflow:hidden}
.ba-half.before{background:linear-gradient(135deg,#241414,#180d0d)}
.ba-half.after{background:linear-gradient(135deg,#142414,#0d180d)}
.ba-half-tag{position:absolute;top:0.5rem;left:0.5rem;font-size:0.6rem;font-weight:700;letter-spacing:0.14em;text-transform:uppercase;padding:0.18rem 0.55rem;border-radius:1px}
.ba-half.before .ba-half-tag{background:var(--red);color:#fff}
.ba-half.after .ba-half-tag{background:var(--green);color:#fff}
.ba-half .emoji{font-size:2.8rem}
.ba-half .caption{font-size:0.68rem;color:rgba(255,255,255,0.82);text-align:center;padding:0 0.5rem;line-height:1.4}
.ba-divider{position:absolute;left:50%;top:8%;height:84%;width:2px;background:linear-gradient(to bottom,transparent,var(--gold),transparent);transform:translateX(-50%);z-index:2}
.ba-info{padding:1.2rem 1.4rem;border-top:1px solid var(--border)}
.ba-info h3{font-family:'Bebas Neue',sans-serif;font-size:1.15rem;letter-spacing:0.05em;margin-bottom:0.3rem}
.ba-info p{font-size:0.831rem;color:rgba(255,255,255,0.82);line-height:1.55;font-weight:300}

/* PINT CARDS */
.pint-grid{display:grid;grid-template-columns:repeat(6,1fr);gap:1rem}
.pint-card{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;padding:1.6rem 1rem;text-align:center;transition:border-color 0.22s,transform 0.22s}
.pint-card:hover{border-color:rgba(245,166,35,0.4);transform:translateY(-3px)}
.pint-card .glass{font-size:3.2rem;display:block;margin-bottom:0.7rem}
.pint-card .pint-name{font-family:'Bebas Neue',sans-serif;font-size:1rem;letter-spacing:0.05em;margin:0.5rem 0 0.3rem}
.pint-card .pint-note{font-size:0.7625rem;color:rgba(255,255,255,0.82);line-height:1.45;font-weight:300}

/* VIDEO */
.vid-placeholder{background:var(--dark-card);border:1px solid var(--border);border-radius:5px;aspect-ratio:16/9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0.9rem;cursor:pointer;position:relative;overflow:hidden;transition:border-color 0.22s}
.vid-placeholder:hover{border-color:var(--gold)}
.vid-placeholder::before{content:'';position:absolute;inset:0;background:linear-gradient(135deg,rgba(245,166,35,0.04),transparent 60%)}
.play-btn{width:56px;height:56px;background:var(--gold);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.3rem;color:var(--dark);position:relative;transition:transform 0.2s,background 0.2s}
.vid-placeholder:hover .play-btn{transform:scale(1.1);background:var(--gold-light)}
.vid-lbl{font-size:0.78rem;color:rgba(255,255,255,0.82);letter-spacing:0.07em;position:relative}
.vid-row{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;align-items:start}
.vid-card{display:flex;flex-direction:column;align-items:center;gap:0.9rem}
.vid-el{max-width:100%;max-height:520px;width:auto;height:auto;background:var(--dark-card);border:1px solid var(--border);border-radius:5px;display:block;transition:border-color 0.22s}
.vid-el:hover{border-color:var(--gold)}
.vid-card .vid-lbl{text-align:center}
/* Remove the audio/volume control entirely (videos are permanently muted) */
.vid-el::-webkit-media-controls-mute-button,
.vid-el::-webkit-media-controls-volume-slider,
.vid-el::-webkit-media-controls-volume-control-container{display:none !important}

/* SERVICES */
.svc-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem}
.svc-card{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;padding:2.2rem 2rem;position:relative;overflow:hidden;transition:border-color 0.22s,transform 0.22s}
.svc-card:hover{border-color:rgba(245,166,35,0.4);transform:translateY(-3px)}
.svc-card::after{content:'';position:absolute;bottom:0;left:0;right:0;height:2px;background:var(--gold);transform:scaleX(0);transition:transform 0.3s;transform-origin:left}
.svc-card:hover::after{transform:scaleX(1)}
.svc-icon{font-size:2rem;margin-bottom:1rem;display:block}
.svc-name{font-family:'Bebas Neue',sans-serif;font-size:1.45rem;letter-spacing:0.05em;margin-bottom:0.5rem}
.svc-desc{font-size:0.82rem;color:rgba(255,255,255,0.82);line-height:1.6;font-weight:300}

/* FAQ */
.faq-wrap{max-width:760px}
.faq-item{border-bottom:1px solid var(--border)}
.faq-btn{width:100%;background:none;border:none;color:var(--cream);text-align:left;padding:1.2rem 0;font-size:0.92rem;font-weight:500;cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:1rem;font-family:'DM Sans',sans-serif;transition:color 0.2s}
.faq-btn:hover{color:var(--gold)}
.faq-chevron{color:var(--gold);font-size:0.9rem;transition:transform 0.3s;flex-shrink:0}
.faq-ans{font-size:0.83rem;color:rgba(255,255,255,0.82);line-height:1.65;font-weight:300;max-height:0;overflow:hidden;transition:max-height 0.35s ease,padding 0.3s}
.faq-item.open .faq-ans{max-height:200px;padding-bottom:1.2rem}
.faq-item.open .faq-chevron{transform:rotate(180deg)}

/* WHY CHOOSE US ICONS */
.why-icon{display:block;width:26px;height:26px;color:var(--gold);margin-bottom:1rem}
.why-icon svg{width:100%;height:100%}

/* ABOUT STATS */
.stat-num{font-family:'Bebas Neue',sans-serif;font-size:3rem;color:var(--gold);line-height:1}
.stat-lbl{font-size:0.78rem;color:rgba(255,255,255,0.82);margin-top:0.3rem;font-weight:300}

/* TESTIMONIALS */
.testimonial-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.2rem}
.tcard{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;padding:1.8rem}
.tcard .stars{color:var(--gold);font-size:0.88rem;margin-bottom:0.8rem;letter-spacing:0.06em}
.tcard .quote{font-family:'DM Serif Display',serif;font-style:italic;font-size:0.94rem;color:var(--cream);line-height:1.65;margin-bottom:1.2rem}
.tcard .author{font-size:0.78rem;color:rgba(255,255,255,0.82);font-weight:500}
.tcard .author span{display:block;font-weight:300;color:rgba(255,255,255,0.82);margin-top:0.1rem;font-size:0.72rem}

/* CLIENT PILLS */
.client-pill{background:var(--dark-card);border:1px solid var(--border);border-radius:3px;padding:1rem 1.8rem;font-size:0.88rem;font-weight:500;color:rgba(255,255,255,0.82);letter-spacing:0.04em;transition:border-color 0.2s,color 0.2s}
.client-pill:hover{border-color:var(--gold);color:var(--cream)}

/* INLINE GRID CLASSES — used to override formerly-inline styles so media queries can target them */
.grid-svc-home{display:grid;grid-template-columns:repeat(4,1fr);gap:1.2rem;max-width:1220px;margin:0 auto}
.grid-contact{display:grid;grid-template-columns:1fr 1.5fr;gap:5rem;align-items:start}
.grid-about-bio{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:center}
.grid-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:2.5rem}
.grid-faq{display:grid;grid-template-columns:1fr 1.6fr;gap:5rem;align-items:start}

/* BOOK PAGE */
.book-cards{display:grid;grid-template-columns:1fr 1fr;gap:1.4rem;margin-bottom:3.5rem}
.book-card{background:var(--dark-card);border:1px solid var(--border);border-radius:5px;padding:2.6rem 2.4rem;position:relative;overflow:hidden;transition:border-color 0.22s,transform 0.22s}
.book-card:hover{border-color:rgba(245,166,35,0.4);transform:translateY(-4px)}
.book-card.featured{background:linear-gradient(135deg,rgba(245,166,35,0.1),rgba(245,166,35,0.03));border-color:rgba(245,166,35,0.3)}
.book-badge{position:absolute;top:0;right:0;background:var(--gold);color:var(--dark);font-size:0.65rem;font-weight:700;letter-spacing:0.1em;text-transform:uppercase;padding:0.28rem 0.9rem;border-radius:0 5px 0 3px}
.book-icon{font-size:2.4rem;display:block;margin-bottom:1rem}
.book-title{font-family:'Bebas Neue',sans-serif;font-size:2rem;letter-spacing:0.04em;margin-bottom:0.6rem}
.book-desc{font-size:0.84rem;color:rgba(255,255,255,0.82);line-height:1.65;font-weight:300;margin-bottom:1.8rem}
.book-phone{margin-top:1rem;font-size:0.8rem;color:rgba(255,255,255,0.82)}
.book-phone strong{color:var(--gold)}
.contact-grid{display:grid;grid-template-columns:1fr 1.5fr;gap:4rem;align-items:start}
.contact-info h2{margin-bottom:0.8rem}
.contact-info p{font-size:0.88rem;color:rgba(255,255,255,0.82);line-height:1.65;font-weight:300;margin-bottom:2rem}
.request-form-box{background:var(--dark-card);border:1px solid var(--border);border-radius:4px;padding:2.2rem}
.rform-title{font-family:'Bebas Neue',sans-serif;font-size:1.6rem;letter-spacing:0.05em;margin-bottom:1.5rem}

/* FOOTER */
footer{background:var(--dark-mid);border-top:1px solid var(--border);padding:3.5rem}
.footer-grid{max-width:1220px;margin:0 auto;display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem}
.footer-logo{font-family:'Bebas Neue',sans-serif;font-size:1.6rem;color:var(--gold);letter-spacing:0.06em;margin-bottom:0.7rem;display:block}
.footer-logo span{color:var(--cream)}
.footer-tagline{font-size:0.8rem;color:rgba(255,255,255,0.82);line-height:1.65;font-weight:300}
.footer-col h5{font-size:0.68rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;font-weight:600}
.footer-col a{display:block;font-size:0.81rem;color:rgba(255,255,255,0.82);text-decoration:none;margin-bottom:0.5rem;transition:color 0.2s;cursor:pointer}
.footer-col a:hover{color:var(--cream)}
.footer-bottom{max-width:1220px;margin:0 auto;padding-top:2rem;border-top:1px solid rgba(245,166,35,0.08);display:flex;justify-content:space-between;align-items:center;font-size:0.74rem;color:rgba(255,255,255,0.82)}

@media(max-width:900px){
  nav{padding:0 1.5rem}
  .nav-links{display:none;position:fixed;top:64px;left:0;right:0;flex-direction:column;background:rgba(15,13,10,0.98);padding:1.5rem;gap:0.4rem;border-bottom:1px solid var(--border)}
  .nav-links.open{display:flex}
  .hamburger{display:flex}
  .section{padding:3.5rem 1.5rem}
  .problems-bar{padding:2rem 1.5rem}
  .problems-inner{grid-template-columns:1fr 1fr}
  .prob-item{border-right:none;border-bottom:1px solid var(--border)}
  .prob-item:last-child{border-bottom:none}
  .ba-grid,.svc-grid,.grid-2,.grid-3,.page-cards,.book-cards,.contact-grid,.footer-grid,.testimonial-grid,
  .grid-contact,.grid-about-bio,.grid-faq{grid-template-columns:1fr}
  .vid-row{grid-template-columns:repeat(2,1fr)}
  .grid-contact,.grid-faq{gap:2.5rem}
  .grid-about-bio{gap:2rem}
  .grid-svc-home{grid-template-columns:repeat(2,1fr)}
  .grid-stats{grid-template-columns:repeat(2,1fr)}
  .pint-grid{grid-template-columns:repeat(3,1fr)}
  .form-row{grid-template-columns:1fr}
  .footer-grid{grid-template-columns:1fr 1fr}
}

@media(max-width:600px){
  .section{padding:2.5rem 1.1rem}
  .problems-inner{grid-template-columns:1fr}
  .grid-svc-home{grid-template-columns:1fr}
  .grid-stats{grid-template-columns:repeat(2,1fr)}
  .pint-grid{grid-template-columns:repeat(2,1fr)}
  .footer-grid{grid-template-columns:1fr}
  .footer-bottom{flex-direction:column;gap:0.5rem;text-align:center}
  .book-cards{grid-template-columns:1fr}
  .request-form-box{padding:1.4rem}
  .hero-sub{font-size:0.95rem}
  .btn{padding:0.85rem 1.4rem}
  .hero-btns{flex-direction:column;align-items:center}
  .hero-btns .btn{width:100%;max-width:320px;text-align:center}
}