/* ─────────────────────────────────────────
   ORM FLOORING & SERVICES LLC
   Global Stylesheet
   ───────────────────────────────────────── */

/* ─── RESET & VARIABLES ─── */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --black:#0a0a0a;
  --white:#fafaf8;
  --cream:#f2ede6;
  --gold:#c9a84c;
  --gold-light:#e8d5a3;
  --gray:#8a8880;
  --dark:#1a1a18;
  --green:#27ae60;
  --red:#c0392b;
}
body{font-family:"DM Sans",sans-serif;background:var(--white);color:var(--black);overflow-x:hidden}

/* ─── ANIMATIONS ─── */
@keyframes fadeUp{from{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
@keyframes logoSlide{to{opacity:1;transform:translateX(0)}}
@keyframes spin{to{transform:rotate(360deg)}}
@keyframes menuSlide{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}

/* ─── LOGO ─── */
.nav-logo-img{height:65px;width:auto;display:block;opacity:0;transform:translateX(-32px);animation:logoSlide 0.7s cubic-bezier(0.22,1,0.36,1) 0.1s forwards}

/* ─── NAV ─── */
nav{position:fixed;top:0;width:100%;z-index:100;padding:1.2rem 3rem;display:flex;justify-content:space-between;align-items:center;background:rgba(250,250,248,0.95);backdrop-filter:blur(12px);border-bottom:1px solid rgba(0,0,0,0.06)}
.nav-links{display:flex;gap:2.5rem;list-style:none}
.nav-links a{font-size:0.82rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;color:var(--black);text-decoration:none;opacity:0.7;transition:opacity 0.2s}
.nav-links a:hover{opacity:1}
.nav-links a.active{opacity:1;border-bottom:2px solid var(--gold);padding-bottom:2px}
.nav-cta{background:var(--black);color:var(--white);padding:0.6rem 1.4rem;font-size:0.8rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;transition:background 0.2s}
.nav-cta:hover{background:var(--gold)}
.nav-right{display:flex;align-items:center;gap:1.5rem}

/* ─── HAMBURGER MENU ─── */
.hamburger{display:none;flex-direction:column;gap:5px;cursor:pointer;padding:4px;background:none;border:none;z-index:200}
.hamburger span{display:block;width:24px;height:2px;background:var(--black);transition:all 0.3s}
.hamburger.open span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}
.hamburger.open span:nth-child(2){opacity:0}
.hamburger.open span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}

/* ─── MOBILE MENU ─── */
.mobile-menu{display:none;position:fixed;top:0;left:0;width:100%;height:100vh;background:var(--dark);z-index:99;flex-direction:column;justify-content:center;align-items:center;gap:2rem;animation:menuSlide 0.3s forwards}
.mobile-menu.open{display:flex}
.mobile-menu a{font-family:"Cormorant Garamond",serif;font-size:2rem;font-weight:300;color:var(--white);text-decoration:none;letter-spacing:0.05em;transition:color 0.2s}
.mobile-menu a:hover{color:var(--gold)}
.mobile-menu .mobile-cta{background:var(--gold);color:var(--black);padding:0.8rem 2rem;font-family:"DM Sans",sans-serif;font-size:0.85rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;margin-top:1rem}

/* ─── PAGE HEADER (shared) ─── */
.page-header{padding:9rem 3rem 4rem;background:var(--dark);display:grid;grid-template-columns:1fr 1fr;align-items:end;gap:3rem}
.page-header-left{opacity:0;animation:fadeUp 0.7s 0.1s forwards}
.page-header-right{opacity:0;animation:fadeUp 0.7s 0.3s forwards}
.page-eyebrow{font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.page-title{font-family:"Cormorant Garamond",serif;font-size:clamp(2.5rem,4vw,3.8rem);font-weight:300;color:var(--white);line-height:1.1}
.page-title em{font-style:italic;color:var(--gold-light)}
.page-desc{font-size:0.9rem;line-height:1.8;color:rgba(255,255,255,0.45);max-width:400px}

/* ─── SECTION ─── */
.section{padding:6rem 3rem}
.section-header{text-align:center;margin-bottom:4rem}
.section-eyebrow{font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem}
.section-title{font-family:"Cormorant Garamond",serif;font-size:clamp(2rem,3vw,2.8rem);font-weight:300;line-height:1.2}

/* ─── BUTTONS ─── */
.btn-primary{background:var(--gold);color:var(--black);padding:0.85rem 2rem;font-size:0.82rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;transition:all 0.2s;display:inline-block}
.btn-primary:hover{background:var(--gold-light)}
.btn-outline{border:1px solid rgba(255,255,255,0.2);color:var(--white);padding:0.85rem 2rem;font-size:0.82rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;transition:all 0.2s;display:inline-block}
.btn-outline:hover{border-color:var(--gold);color:var(--gold)}
.btn-dark{background:var(--black);color:var(--white);padding:0.9rem 2.5rem;font-size:0.82rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;text-decoration:none;display:inline-block;transition:background 0.2s;margin:0 0.5rem}
.btn-dark:hover{background:var(--dark)}
.btn-ghost{border:2px solid var(--black);color:var(--black);padding:0.9rem 2.5rem;font-size:0.82rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;text-decoration:none;display:inline-block;transition:all 0.2s;margin:0 0.5rem}
.btn-ghost:hover{background:var(--black);color:var(--white)}

/* ─── FOOTER ─── */
footer{background:var(--black);padding:3rem;display:grid;grid-template-columns:1fr 1fr 1fr;gap:3rem;align-items:start}
.footer-brand p{font-size:0.78rem;color:rgba(255,255,255,0.35);margin-top:0.8rem;line-height:1.7;max-width:220px}
.footer-col h4{font-size:0.72rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold);margin-bottom:1.2rem}
.footer-col ul{list-style:none;display:flex;flex-direction:column;gap:0.6rem}
.footer-col ul li a{font-size:0.8rem;color:rgba(255,255,255,0.4);text-decoration:none;transition:color 0.2s}
.footer-col ul li a:hover{color:var(--white)}
.footer-col address{font-style:normal;font-size:0.8rem;color:rgba(255,255,255,0.4);line-height:1.8}
.footer-col address a{color:rgba(255,255,255,0.4);text-decoration:none}
.footer-bottom{grid-column:1/-1;border-top:1px solid rgba(255,255,255,0.06);padding-top:1.5rem;display:flex;justify-content:space-between;align-items:center}
.footer-bottom p{font-size:0.72rem;color:rgba(255,255,255,0.25);letter-spacing:0.04em}
.footer-mini{background:var(--black);padding:2rem 3rem;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:1rem}
.footer-mini p{font-size:0.72rem;color:rgba(255,255,255,0.25)}

/* ─── WHATSAPP BUTTON ─── */
.wa-btn{position:fixed;bottom:2rem;right:2rem;width:52px;height:52px;background:#25D366;border-radius:50%;display:flex;align-items:center;justify-content:center;text-decoration:none;box-shadow:0 4px 20px rgba(37,211,102,0.4);z-index:99;transition:transform 0.2s}
.wa-btn:hover{transform:scale(1.1)}
.wa-btn svg{width:28px;height:28px;fill:white}

/* ─── HOME — HERO ─── */
.hero{min-height:100vh;display:grid;grid-template-columns:1fr 1fr;padding-top:5rem}
.hero-left{background:var(--dark);display:flex;flex-direction:column;justify-content:center;padding:5rem 4rem;position:relative;overflow:hidden}
.hero-left::before{content:"";position:absolute;top:-20%;left:-10%;width:70%;height:70%;background:radial-gradient(circle,rgba(201,168,76,0.12) 0%,transparent 70%);pointer-events:none}
.hero-eyebrow{font-size:0.72rem;letter-spacing:0.2em;text-transform:uppercase;color:var(--gold);margin-bottom:1.5rem;opacity:0;animation:fadeUp 0.8s 0.2s forwards}
.hero-title{font-family:"Cormorant Garamond",serif;font-size:clamp(2.8rem,4vw,4.2rem);font-weight:300;line-height:1.1;color:var(--white);margin-bottom:1.5rem;opacity:0;animation:fadeUp 0.8s 0.4s forwards}
.hero-title em{font-style:italic;color:var(--gold-light)}
.hero-desc{font-size:0.9rem;line-height:1.8;color:rgba(255,255,255,0.55);max-width:380px;margin-bottom:2.5rem;opacity:0;animation:fadeUp 0.8s 0.6s forwards}
.hero-actions{display:flex;gap:1rem;opacity:0;animation:fadeUp 0.8s 0.8s forwards}
.hero-badge{position:absolute;bottom:3rem;left:4rem;display:flex;align-items:center;gap:0.8rem;opacity:0;animation:fadeUp 0.8s 1s forwards}
.badge-icon{width:36px;height:36px;border:1px solid rgba(201,168,76,0.4);display:flex;align-items:center;justify-content:center;color:var(--gold)}
.badge-text{font-size:0.75rem;color:rgba(255,255,255,0.5);letter-spacing:0.04em}
.badge-text strong{display:block;color:var(--white);font-weight:500}
.hero-right{background:var(--cream);display:grid;grid-template-rows:2fr 1fr;overflow:hidden;opacity:0;animation:fadeIn 1s 0.3s forwards}
.hero-img-main{position:relative;overflow:hidden}
.floor-pattern{width:100%;height:100%;background:repeating-linear-gradient(90deg,rgba(0,0,0,0.03) 0px,rgba(0,0,0,0.03) 1px,transparent 1px,transparent 80px),repeating-linear-gradient(0deg,rgba(0,0,0,0.02) 0px,rgba(0,0,0,0.02) 1px,transparent 1px,transparent 120px),linear-gradient(160deg,#d4bc9e 0%,#b89070 40%,#96704e 100%)}
.hero-img-main::after{content:"Hardwood Installation — Utah";position:absolute;bottom:1.2rem;left:1.5rem;font-size:0.7rem;letter-spacing:0.08em;color:rgba(255,255,255,0.7);text-transform:uppercase}
.hero-stats{display:grid;grid-template-columns:1fr 1fr;border-top:1px solid rgba(0,0,0,0.08)}
.stat{padding:1.5rem 2rem;border-right:1px solid rgba(0,0,0,0.08)}
.stat:last-child{border-right:none}
.stat-num{font-family:"Cormorant Garamond",serif;font-size:2.2rem;font-weight:600;color:var(--black);line-height:1}
.stat-label{font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--gray);margin-top:0.3rem}

/* ─── HOME — SERVICES ─── */
.services-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:rgba(0,0,0,0.08)}
.service-card{background:var(--white);padding:2.5rem 2rem;transition:background 0.3s;cursor:default}
.service-card:hover{background:var(--dark)}
.service-card:hover .service-name,.service-card:hover .service-desc{color:rgba(255,255,255,0.5)}
.service-card:hover .service-name{color:var(--white)}
.service-card:hover .service-icon{color:var(--gold)}
.service-icon{font-size:1.8rem;margin-bottom:1.2rem;transition:color 0.3s}
.service-name{font-family:"Cormorant Garamond",serif;font-size:1.3rem;font-weight:400;margin-bottom:0.8rem;transition:color 0.3s}
.service-desc{font-size:0.82rem;line-height:1.7;color:var(--gray);transition:color 0.3s}

/* ─── HOME — WHY ─── */
.why-section{background:var(--dark);padding:6rem 3rem}
.why-grid{display:grid;grid-template-columns:1fr 1fr;gap:6rem;align-items:center;max-width:1100px;margin:0 auto}
.why-content p{color:rgba(255,255,255,0.5);line-height:1.8;font-size:0.9rem;margin-bottom:2rem}
.why-features{display:flex;flex-direction:column;gap:1rem}
.feature{display:flex;align-items:flex-start;gap:1rem}
.feature-dot{width:6px;height:6px;background:var(--gold);border-radius:50%;margin-top:0.4rem;flex-shrink:0}
.feature-text{font-size:0.85rem;color:rgba(255,255,255,0.7);line-height:1.6}
.feature-text strong{color:var(--white);font-weight:500}
.why-visual{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,0.05)}
.why-tile{padding:2.5rem 2rem;background:rgba(255,255,255,0.02)}
.why-tile-num{font-family:"Cormorant Garamond",serif;font-size:3rem;font-weight:300;color:var(--gold);opacity:0.6;line-height:1}
.why-tile-label{font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase;color:rgba(255,255,255,0.4);margin-top:0.5rem}

/* ─── HOME — TESTIMONIALS ─── */
.testimonials{background:var(--cream);padding:6rem 3rem}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:2rem;margin-top:3rem}
.testimonial{background:var(--white);padding:2rem 2rem 1.5rem;position:relative}
.testimonial::before{content:"\201C";font-family:"Cormorant Garamond",serif;font-size:5rem;color:var(--gold);opacity:0.3;position:absolute;top:-0.5rem;left:1.5rem;line-height:1}
.testimonial-text{font-size:0.88rem;line-height:1.8;color:var(--black);opacity:0.75;margin-bottom:1.5rem;padding-top:2rem}
.testimonial-author{display:flex;align-items:center;gap:0.8rem}
.author-avatar{width:36px;height:36px;background:var(--gold);opacity:0.3;border-radius:50%}
.author-info strong{display:block;font-size:0.82rem;font-weight:500}
.author-info span{font-size:0.72rem;color:var(--gray);letter-spacing:0.04em}
.stars{color:var(--gold);font-size:0.8rem;letter-spacing:0.1em;margin-bottom:0.5rem}

/* ─── CTA BANNER ─── */
.cta-banner{background:var(--gold);padding:5rem 3rem;text-align:center}
.cta-banner h2{font-family:"Cormorant Garamond",serif;font-size:clamp(2rem,3.5vw,3rem);font-weight:300;color:var(--black);margin-bottom:0.8rem}
.cta-banner p{font-size:0.9rem;color:rgba(0,0,0,0.6);margin-bottom:2rem}

/* ─── GALLERY ─── */
.filter-bar{padding:2rem 3rem;display:flex;gap:0.6rem;align-items:center;border-bottom:1px solid rgba(0,0,0,0.06);flex-wrap:wrap}
.filter-label{font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gray);margin-right:0.5rem}
.filter-btn{padding:0.5rem 1.2rem;font-size:0.75rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;border:1px solid rgba(0,0,0,0.15);background:transparent;color:var(--black);cursor:pointer;transition:all 0.2s;font-family:"DM Sans",sans-serif}
.filter-btn:hover{border-color:var(--gold);color:var(--gold)}
.filter-btn.active{background:var(--black);color:var(--white);border-color:var(--black)}
.gallery-section{padding:3rem}
.gallery-count{font-size:0.75rem;letter-spacing:0.08em;text-transform:uppercase;color:var(--gray);margin-bottom:2rem}
.gallery-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1.5rem}
.gallery-item{position:relative;overflow:hidden;cursor:pointer;background:var(--cream)}
.gallery-item img{width:100%;height:280px;object-fit:cover;display:block;transition:transform 0.5s ease}
.gallery-item:hover img{transform:scale(1.04)}
.gallery-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(10,10,10,0.75) 0%,transparent 55%);opacity:0;transition:opacity 0.3s;display:flex;align-items:flex-end;padding:1.2rem}
.gallery-item:hover .gallery-overlay{opacity:1}
.gallery-label{font-size:0.78rem;color:var(--white);letter-spacing:0.06em;line-height:1.4}
.gallery-cat-tag{display:inline-block;font-size:0.65rem;letter-spacing:0.1em;text-transform:uppercase;background:var(--gold);color:var(--black);padding:0.2rem 0.5rem;margin-bottom:0.4rem}
.lightbox{position:fixed;inset:0;background:rgba(10,10,10,0.96);z-index:999;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;transition:opacity 0.3s}
.lightbox.open{opacity:1;pointer-events:all}
.lightbox img{max-width:88vw;max-height:82vh;object-fit:contain;display:block}
.lightbox-close{position:absolute;top:1.5rem;right:2rem;font-size:1.8rem;color:var(--white);cursor:pointer;background:none;border:none;opacity:0.7;transition:opacity 0.2s;line-height:1}
.lightbox-close:hover{opacity:1}
.lightbox-caption{position:absolute;bottom:1.8rem;left:50%;transform:translateX(-50%);font-size:0.78rem;color:rgba(255,255,255,0.55);letter-spacing:0.06em;white-space:nowrap}
.lightbox-prev,.lightbox-next{position:absolute;top:50%;transform:translateY(-50%);background:none;border:1px solid rgba(255,255,255,0.2);color:var(--white);font-size:1.2rem;width:44px;height:44px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all 0.2s}
.lightbox-prev{left:1.5rem}.lightbox-next{right:1.5rem}
.lightbox-prev:hover,.lightbox-next:hover{background:var(--gold);border-color:var(--gold);color:var(--black)}
.cta-strip{background:var(--dark);padding:4rem 3rem;text-align:center}
.cta-strip h2{font-family:"Cormorant Garamond",serif;font-size:2.2rem;font-weight:300;color:var(--white);margin-bottom:0.6rem}
.cta-strip p{font-size:0.85rem;color:rgba(255,255,255,0.4);margin-bottom:1.8rem}
.cta-strip a{background:var(--gold);color:var(--black);padding:0.85rem 2rem;font-size:0.82rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none;display:inline-block;margin:0 0.4rem;transition:background 0.2s}
.cta-strip a:hover{background:var(--gold-light)}
.cta-strip a.outline{background:transparent;border:1px solid rgba(255,255,255,0.2);color:var(--white)}
.cta-strip a.outline:hover{border-color:var(--gold);color:var(--gold)}

/* ─── CONTACT ─── */
.contact-section{display:grid;grid-template-columns:1fr 1.6fr;min-height:70vh}
.contact-info{background:var(--cream);padding:4rem 3rem;display:flex;flex-direction:column;gap:3rem}
.info-block h3{font-family:"Cormorant Garamond",serif;font-size:1.1rem;font-weight:400;margin-bottom:1rem}
.info-item{display:flex;align-items:flex-start;gap:1rem;margin-bottom:1.2rem}
.info-icon{width:38px;height:38px;background:var(--white);border:1px solid rgba(0,0,0,0.08);display:flex;align-items:center;justify-content:center;font-size:0.9rem;flex-shrink:0}
.info-text strong{display:block;font-size:0.82rem;font-weight:500;margin-bottom:0.15rem}
.info-text a,.info-text span{font-size:0.82rem;color:var(--gray);text-decoration:none;line-height:1.6}
.info-text a:hover{color:var(--gold)}
.divider{height:1px;background:rgba(0,0,0,0.08)}
.quick-actions{display:flex;flex-direction:column;gap:0.8rem}
.quick-btn{display:flex;align-items:center;gap:0.8rem;padding:0.9rem 1.2rem;text-decoration:none;font-size:0.82rem;font-weight:500;letter-spacing:0.04em;transition:all 0.2s}
.quick-btn.call{background:var(--black);color:var(--white)}
.quick-btn.call:hover{background:var(--dark)}
.quick-btn.whatsapp{background:#25D366;color:var(--white)}
.quick-btn.whatsapp:hover{background:#20b958}
.quick-btn.email{background:var(--white);color:var(--black);border:1px solid rgba(0,0,0,0.1)}
.quick-btn.email:hover{border-color:var(--gold);color:var(--gold)}
.hours-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.4rem}
.hours-row{display:contents}
.hours-row span{font-size:0.78rem;padding:0.4rem 0;border-bottom:1px solid rgba(0,0,0,0.05);color:var(--gray)}
.hours-row span:first-child{color:var(--black);font-weight:500}
.contact-form-wrap{background:var(--white);padding:4rem 3.5rem;display:flex;flex-direction:column;justify-content:center}
.form-title{font-family:"Cormorant Garamond",serif;font-size:1.8rem;font-weight:300;margin-bottom:0.5rem}
.form-subtitle{font-size:0.82rem;color:var(--gray);margin-bottom:2.5rem;line-height:1.6}
.map-strip{background:var(--dark);padding:3rem;display:flex;align-items:center;justify-content:space-between;gap:2rem;flex-wrap:wrap}
.map-strip-text h3{font-family:"Cormorant Garamond",serif;font-size:1.4rem;font-weight:300;color:var(--white);margin-bottom:0.4rem}
.map-strip-text p{font-size:0.82rem;color:rgba(255,255,255,0.4)}
.service-areas{display:flex;flex-wrap:wrap;gap:0.5rem}
.area-tag{font-size:0.72rem;letter-spacing:0.06em;padding:0.35rem 0.8rem;border:1px solid rgba(201,168,76,0.25);color:rgba(255,255,255,0.5)}

/* ─── FORMS (shared) ─── */
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1.2rem;margin-bottom:1.2rem}
.form-group{display:flex;flex-direction:column;margin-bottom:1.2rem}
.form-group label{font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gray);margin-bottom:0.5rem;font-weight:500}
.form-group input,.form-group select,.form-group textarea{font-family:"DM Sans",sans-serif;font-size:0.88rem;padding:0.85rem 1rem;border:1px solid rgba(0,0,0,0.12);background:var(--white);color:var(--black);outline:none;transition:border-color 0.2s;-webkit-appearance:none;border-radius:0}
.form-group input:focus,.form-group select:focus,.form-group textarea:focus{border-color:var(--gold)}
.form-group textarea{resize:vertical;min-height:120px;line-height:1.6}
.form-group select{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%238a8880' stroke-width='1.5' fill='none'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 1rem center;padding-right:2.5rem}
.service-checkboxes{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem;margin-top:0.5rem}
.checkbox-label{display:flex;align-items:center;gap:0.6rem;cursor:pointer;font-size:0.82rem;padding:0.6rem 0.8rem;border:1px solid rgba(0,0,0,0.1);transition:all 0.2s}
.checkbox-label:hover{border-color:var(--gold)}
.checkbox-label input[type="checkbox"]{width:14px;height:14px;accent-color:var(--gold);cursor:pointer}
.checkbox-label.checked{border-color:var(--gold);background:rgba(201,168,76,0.05)}
.submit-btn{width:100%;padding:1rem;background:var(--black);color:var(--white);font-family:"DM Sans",sans-serif;font-size:0.85rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;border:none;cursor:pointer;transition:background 0.2s;margin-top:0.5rem}
.submit-btn:hover{background:var(--gold);color:var(--black)}
.submit-btn:disabled{opacity:0.5;cursor:not-allowed}
.form-note{font-size:0.72rem;color:var(--gray);margin-top:1rem;text-align:center;line-height:1.6}
.alert{padding:1rem 1.2rem;font-size:0.85rem;margin-bottom:1.5rem;display:none;align-items:center;gap:0.8rem}
.alert.success{background:rgba(39,174,96,0.08);border:1px solid rgba(39,174,96,0.25);color:var(--green);display:flex}
.alert.error{background:rgba(192,57,43,0.08);border:1px solid rgba(192,57,43,0.2);color:var(--red);display:flex}

/* ─── ESTIMATE ─── */
.steps-bar{background:var(--cream);padding:2rem 3rem;display:flex;align-items:center;justify-content:center;gap:0;overflow-x:auto}
.step{display:flex;align-items:center;gap:0.6rem;padding:0 1.5rem;flex-shrink:0}
.step-num{width:28px;height:28px;background:var(--black);color:var(--white);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:0.72rem;font-weight:500;flex-shrink:0}
.step-num.active{background:var(--gold);color:var(--black)}
.step-num.done{background:var(--green);color:var(--white)}
.step-label{font-size:0.75rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--gray);white-space:nowrap}
.step-label.active{color:var(--black);font-weight:500}
.step-arrow{color:rgba(0,0,0,0.2);font-size:0.8rem;padding:0 0.5rem}
.estimate-wrap{max-width:780px;margin:0 auto;padding:4rem 2rem 6rem}
.step-panel{display:none}
.step-panel.active{display:block;animation:fadeUp 0.4s forwards}
.step-header{margin-bottom:2rem}
.step-number{font-size:0.72rem;letter-spacing:0.15em;text-transform:uppercase;color:var(--gold);margin-bottom:0.5rem}
.step-title{font-family:"Cormorant Garamond",serif;font-size:2rem;font-weight:300;margin-bottom:0.4rem}
.step-subtitle{font-size:0.82rem;color:var(--gray);line-height:1.6}
.form-row-3{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}
.service-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:0.8rem;margin-top:0.5rem}
.service-option{border:1px solid rgba(0,0,0,0.12);padding:1.2rem;cursor:pointer;transition:all 0.2s;position:relative}
.service-option:hover{border-color:var(--gold)}
.service-option.selected{border-color:var(--gold);background:rgba(201,168,76,0.05)}
.service-option.selected::after{content:"✓";position:absolute;top:0.6rem;right:0.8rem;color:var(--gold);font-size:0.85rem;font-weight:600}
.service-option input[type="checkbox"]{display:none}
.service-icon-lg{font-size:1.5rem;margin-bottom:0.6rem}
.service-name-opt{font-size:0.85rem;font-weight:500;margin-bottom:0.2rem}
.service-hint{font-size:0.72rem;color:var(--gray)}
.room-builder{margin-top:0.5rem}
.room-entry{display:grid;grid-template-columns:1fr 1fr;gap:0.6rem}
.room-entry .form-group:first-child{grid-column:1/-1}
.room-entry .form-group{margin-bottom:0}
.room-entry label{font-size:0.65rem}
.remove-room{background:none;border:1px solid rgba(0,0,0,0.12);color:var(--gray);width:36px;height:36px;cursor:pointer;font-size:1rem;display:flex;align-items:center;justify-content:center;align-self:end;transition:all 0.2s;flex-shrink:0}
.remove-room:hover{border-color:var(--red);color:var(--red)}
.add-room-btn{display:flex;align-items:center;gap:0.5rem;background:none;border:1px dashed rgba(0,0,0,0.2);color:var(--gray);padding:0.7rem 1.2rem;cursor:pointer;font-family:"DM Sans",sans-serif;font-size:0.78rem;letter-spacing:0.06em;text-transform:uppercase;transition:all 0.2s;margin-top:0.4rem}
.add-room-btn:hover{border-color:var(--gold);color:var(--gold)}
.sqft-total{background:var(--dark);color:var(--white);padding:1rem 1.2rem;display:flex;justify-content:space-between;align-items:center;margin-top:0.8rem}
.sqft-total span{font-size:0.75rem;letter-spacing:0.08em;text-transform:uppercase;color:rgba(255,255,255,0.5)}
.sqft-total strong{font-family:"Cormorant Garamond",serif;font-size:1.6rem;color:var(--gold)}
.upload-zone{border:2px dashed rgba(0,0,0,0.15);padding:2.5rem;text-align:center;cursor:pointer;transition:all 0.2s;position:relative;background:var(--cream)}
.upload-zone:hover,.upload-zone.dragover{border-color:var(--gold);background:rgba(201,168,76,0.04)}
.upload-zone input{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.upload-icon{font-size:2rem;margin-bottom:0.8rem}
.upload-title{font-size:0.85rem;font-weight:500;margin-bottom:0.3rem}
.upload-hint{font-size:0.75rem;color:var(--gray)}
.photo-previews{display:grid;grid-template-columns:repeat(4,1fr);gap:0.6rem;margin-top:1rem}
.photo-thumb{position:relative;aspect-ratio:1;overflow:hidden;background:var(--cream)}
.photo-thumb img{width:100%;height:100%;object-fit:cover}
.photo-thumb button{position:absolute;top:0.2rem;right:0.2rem;background:rgba(0,0,0,0.6);color:white;border:none;width:20px;height:20px;cursor:pointer;font-size:0.7rem;display:flex;align-items:center;justify-content:center}
.step-nav{display:flex;justify-content:space-between;align-items:center;margin-top:2.5rem;padding-top:2rem;border-top:1px solid rgba(0,0,0,0.08)}
.btn-back{background:none;border:1px solid rgba(0,0,0,0.15);color:var(--black);padding:0.8rem 1.8rem;font-family:"DM Sans",sans-serif;font-size:0.8rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;cursor:pointer;transition:all 0.2s}
.btn-back:hover{border-color:var(--black)}
.btn-next{background:var(--black);color:var(--white);padding:0.85rem 2rem;font-family:"DM Sans",sans-serif;font-size:0.82rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;border:none;cursor:pointer;transition:background 0.2s;display:flex;align-items:center;gap:0.5rem}
.btn-next:hover{background:var(--gold);color:var(--black)}
.btn-submit{background:var(--gold);color:var(--black);padding:0.9rem 2.2rem;font-family:"DM Sans",sans-serif;font-size:0.85rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;border:none;cursor:pointer;transition:all 0.2s;display:flex;align-items:center;gap:0.6rem}
.btn-submit:hover{background:var(--gold-light)}
.summary-box{background:var(--cream);padding:1.5rem;margin-bottom:2rem}
.summary-title{font-size:0.72rem;letter-spacing:0.12em;text-transform:uppercase;color:var(--gold);margin-bottom:1rem;font-weight:500}
.summary-grid{display:grid;grid-template-columns:1fr 1fr;gap:0.8rem}
.summary-item strong{display:block;font-size:0.72rem;color:var(--gray);letter-spacing:0.06em;text-transform:uppercase;margin-bottom:0.2rem}
.summary-item span{font-size:0.88rem;color:var(--black)}
.success-screen{display:none;text-align:center;padding:4rem 2rem}
.success-screen.visible{display:block;animation:fadeUp 0.5s forwards}
.success-circle{width:80px;height:80px;background:rgba(39,174,96,0.1);border:2px solid rgba(39,174,96,0.3);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto 1.5rem;font-size:2rem}
.success-screen h2{font-family:"Cormorant Garamond",serif;font-size:2.5rem;font-weight:300;margin-bottom:0.6rem}
.success-screen p{font-size:0.88rem;color:var(--gray);line-height:1.8;max-width:440px;margin:0 auto 2rem}
.success-actions{display:flex;gap:1rem;justify-content:center;flex-wrap:wrap}
.success-actions a{padding:0.8rem 1.8rem;font-size:0.8rem;font-weight:500;letter-spacing:0.06em;text-transform:uppercase;text-decoration:none}
.btn-call{background:var(--black);color:var(--white)}
.btn-wa-success{background:#25D366;color:var(--white)}
.field-error{font-size:0.72rem;color:var(--red);margin-top:0.3rem}
.form-group input.error,.form-group select.error,.form-group textarea.error{border-color:var(--red)}
.promise-list{list-style:none;display:flex;flex-direction:column;gap:1rem}
.promise-item{display:flex;align-items:center;gap:1rem;padding:1rem 1.2rem;background:rgba(255,255,255,0.03);border:1px solid rgba(255,255,255,0.06)}
.promise-icon{font-size:1.2rem;width:32px;text-align:center;flex-shrink:0}
.promise-text strong{display:block;font-size:0.82rem;color:var(--white);font-weight:500;margin-bottom:0.1rem}
.promise-text span{font-size:0.75rem;color:rgba(255,255,255,0.4)}

/* ─── PAYMENTS ─── */
.trust-bar{background:var(--cream);padding:1.2rem 3rem;display:flex;justify-content:center;gap:3rem;flex-wrap:wrap;border-bottom:1px solid rgba(0,0,0,0.06)}
.trust-item{display:flex;align-items:center;gap:0.5rem;font-size:0.75rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--gray)}
.payment-wrap{max-width:640px;margin:0 auto;padding:4rem 2rem 6rem}
.tabs{display:grid;grid-template-columns:1fr 1fr;margin-bottom:2.5rem;border:1px solid rgba(0,0,0,0.1)}
.tab-btn{padding:1rem;font-family:"DM Sans",sans-serif;font-size:0.8rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;background:transparent;border:none;cursor:pointer;color:var(--gray);transition:all 0.2s;border-right:1px solid rgba(0,0,0,0.1)}
.tab-btn:last-child{border-right:none}
.tab-btn.active{background:var(--black);color:var(--white)}
.tab-btn .tab-icon{display:block;font-size:1.2rem;margin-bottom:0.3rem}
.panel{display:none}
.panel.active{display:block}
.panel-title{font-family:"Cormorant Garamond",serif;font-size:1.6rem;font-weight:300;margin-bottom:0.4rem}
.panel-desc{font-size:0.82rem;color:var(--gray);margin-bottom:2rem;line-height:1.6}
.amount-breakdown{background:var(--cream);padding:1.5rem;margin-bottom:1.5rem;display:none}
.amount-breakdown.visible{display:block}
.breakdown-row{display:flex;justify-content:space-between;align-items:center;padding:0.4rem 0;font-size:0.85rem}
.breakdown-row:not(:last-child){border-bottom:1px solid rgba(0,0,0,0.06)}
.breakdown-row.total{font-weight:500;padding-top:0.8rem;margin-top:0.4rem;border-top:2px solid rgba(0,0,0,0.1)!important;font-size:1rem}
.breakdown-label{color:var(--gray)}
.breakdown-val{color:var(--black);font-weight:500}
.breakdown-val.highlight{color:var(--gold);font-size:1.1rem}
.deposit-badge{display:inline-block;background:var(--gold);color:var(--black);font-size:0.65rem;letter-spacing:0.1em;text-transform:uppercase;padding:0.2rem 0.6rem;margin-left:0.5rem;font-weight:600}
.card-section{margin-bottom:1.5rem}
.card-section label{display:block;font-size:0.72rem;letter-spacing:0.1em;text-transform:uppercase;color:var(--gray);margin-bottom:0.5rem;font-weight:500}
#card-element,#card-element-balance{padding:0.9rem 1rem;border:1px solid rgba(0,0,0,0.12);background:var(--white);transition:border-color 0.2s}
.pay-btn{width:100%;padding:1.1rem;background:var(--black);color:var(--white);font-family:"DM Sans",sans-serif;font-size:0.85rem;font-weight:500;letter-spacing:0.1em;text-transform:uppercase;border:none;cursor:pointer;transition:background 0.2s;margin-top:0.5rem;display:flex;align-items:center;justify-content:center;gap:0.6rem}
.pay-btn:hover{background:var(--gold);color:var(--black)}
.pay-btn:disabled{opacity:0.5;cursor:not-allowed}
.spinner{width:16px;height:16px;border:2px solid rgba(255,255,255,0.3);border-top-color:#fff;border-radius:50%;animation:spin 0.7s linear infinite;display:none}
.success-box{text-align:center;padding:3rem 2rem;background:rgba(39,174,96,0.05);border:1px solid rgba(39,174,96,0.2);display:none}
.success-box.visible{display:block}
.success-icon{font-size:3rem;margin-bottom:1rem}
.success-box h3{font-family:"Cormorant Garamond",serif;font-size:1.8rem;font-weight:300;margin-bottom:0.6rem;color:var(--green)}
.success-box p{font-size:0.85rem;color:var(--gray);line-height:1.7}
.success-box .success-amount{font-size:2rem;font-weight:600;color:var(--black);margin:1rem 0}
.pay-note{font-size:0.72rem;color:var(--gray);text-align:center;margin-top:1rem;line-height:1.6}
.pay-note a{color:var(--gold);text-decoration:none}
.section-divider{height:1px;background:rgba(0,0,0,0.08);margin:2rem 0}
.square-divider{text-align:center;margin:1.5rem 0;position:relative}
.square-divider::before{content:"";position:absolute;top:50%;left:0;right:0;height:1px;background:rgba(0,0,0,0.1)}
.square-divider span{background:var(--white);padding:0 1rem;font-size:0.72rem;color:var(--gray);letter-spacing:0.08em;text-transform:uppercase;position:relative}
.square-btn{width:100%;padding:1rem;background:#006aff;color:var(--white);font-family:"DM Sans",sans-serif;font-size:0.85rem;font-weight:500;letter-spacing:0.08em;text-transform:uppercase;border:none;cursor:pointer;text-decoration:none;display:flex;align-items:center;justify-content:center;gap:0.6rem;transition:background 0.2s}
.square-btn:hover{background:#0052cc}

/* ─── RESPONSIVE ─── */
@media(max-width:900px){
  nav{padding:1rem 1.5rem}
  .nav-links{display:none}
  .nav-cta{display:none}
  .nav-logo-img{height:119px}
  .hamburger{display:flex}
  .hero{grid-template-columns:1fr}
  .hero-right{display:none}
  .hero-left{padding:4rem 1.5rem}
  .services-grid{grid-template-columns:1fr 1fr}
  .why-grid{grid-template-columns:1fr}
  .testimonials-grid{grid-template-columns:1fr}
  .page-header{grid-template-columns:1fr;padding:10rem 1.5rem 3rem}
  .contact-section{grid-template-columns:1fr}
  .contact-info{padding:3rem 1.5rem}
  .contact-form-wrap{padding:3rem 1.5rem}
  .gallery-grid{grid-template-columns:1fr 1fr;gap:1rem}
  .filter-bar,.gallery-section,.cta-strip{padding:1.5rem}
  .filter-bar{flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:1rem}
.filter-bar::-webkit-scrollbar{display:none}
  .form-row,.form-row-3{grid-template-columns:1fr}
  .photo-previews{grid-template-columns:repeat(3,1fr)}
  .summary-grid{grid-template-columns:1fr}
  .steps-bar{justify-content:flex-start;padding:1.2rem 1.5rem}
  .estimate-wrap{padding:2.5rem 1.2rem 4rem}
  .map-strip{flex-direction:column;align-items:flex-start;padding:2rem 1.5rem}
  .section{padding:4rem 1.5rem}
  footer{grid-template-columns:1fr;padding:2rem 1.5rem}
  .footer-mini{padding:1.5rem;flex-direction:column;text-align:center}
  .lightbox-prev{left:0.5rem}.lightbox-next{right:0.5rem}
  .trust-bar{gap:1.5rem;padding:1rem 1.5rem}
  .payment-wrap{padding:2.5rem 1.2rem 4rem}
}
@media(max-width:600px){
  .gallery-grid{grid-template-columns:1fr}
  .service-grid{grid-template-columns:1fr}
  .photo-previews{grid-template-columns:repeat(2,1fr)}
  .step-nav{flex-direction:column;gap:0.8rem}
  .btn-next,.btn-back,.btn-submit{width:100%;justify-content:center}
  .hero-actions{flex-direction:column}
}