/* ========== Design system & reset (mobile-first) ========== */
:root{
  --bg:#f7f7f7; --text:#16302B; --muted:#6b7280; --card:#ffffff;
  --line:#e5e7eb; --brand:#5b0f1b; 
  --radius:16px; --radius-lg:24px; --maxw:1120px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
html,body{margin:0;padding:0;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;color:var(--text);background:var(--bg);}
img{max-width:100%;height:auto;display:block;border-radius:12px}
h1{font-size:clamp(28px,4vw,44px);line-height:1.1;margin:0 0 .5rem;font-family: Cinzel, serif}
h2{font-size:clamp(22px,3vw,32px);margin:0}
h3{font-size:clamp(16px,2.2vw,20px);margin:.25rem 0}
p{margin:.5rem 0}
ul{margin:0;padding-left:1rem}
a{color:var(--text)}
.nowrap{white-space:nowrap}
.container{max-width:var(--maxw);margin-inline:auto;padding:0 16px}
.muted{color:var(--muted)}
.underline{ text-decoration:underline; text-underline-offset:3px }
.small{font-size:.9rem}

/* Header */
.site-header{position:sticky;top:0;z-index:40;background:rgba(255,255,255,.92);backdrop-filter:saturate(120%) blur(6px);border-bottom:1px solid var(--line)}
.header-inner{display:flex;align-items:center;gap:12px;padding:12px 0;margin:0}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.logo-img{height:100%;width:auto;position:absolute}
.brand-title{font-weight:700;letter-spacing:.02em}
.brand-text{position: absolute;left: 14%;font-family: 'Cinzel Decorative';font-size: 15px;}
.header-right{margin-left:auto;display:flex;align-items:center;gap:14px}
.nav{display:none;position:fixed;inset:60px 0 auto 0;background:#fff;border-bottom:1px solid var(--line);padding:10px 16px;gap:8px}
.nav a{text-decoration:none;color:var(--text)}
.nav .nav-btn{display:inline-flex;align-items:center;justify-content:center;height:40px;padding:0 12px;border-radius:12px}
.nav .nav-btn:hover{background:#f3f4f6}

/* Buttons */
.cta{display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;border-radius:16px;background:var(--brand);text-decoration:none;border:1px solid var(--brand);box-shadow:0 1px 0 rgba(0,0,0,.1)}
.cta-link{background:transparent;color:var(--brand);border:1px solid var(--brand)}

/* Hero & Sections */
.hero{position:relative;overflow:hidden;background:radial-gradient(1000px 400px at 85% -10%, rgba(0,0,0,.06), transparent), linear-gradient(#fff,#fafafa)}
.hero-grid{display:grid;grid-template-columns:1fr;gap:24px;padding:48px 0}
.lead{color:var(--muted);margin:12px 0 0;max-width:65ch}
.hero-actions{display:flex;gap:12px;margin:18px 0 0;flex-wrap:wrap}
.stats{display:flex;gap:30%;margin-top:16px;color:var(--muted);padding-left:0;list-style:none}
.stat-title{font-weight:600;color:var(--text)}
.hero-media .img-note{font-size:.8rem;color:var(--muted);margin-top:8px}
.section{padding:48px 0}
.section-alt{background:#fff;border-block:1px solid var(--line)}
.section-muted{background:#f0f2f5;border-top:1px solid var(--line)}
.section-head{display:flex;flex-direction:column;gap:10px;align-items:flex-start}

/* Cards & Gallery */
.card-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:16px}
.card{background:var(--card);border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;box-shadow:0 2px 8px rgba(0,0,0,.02)}
.card-media{aspect-ratio:16/9;background:#e5e7eb;border-radius:12px;margin-bottom:12px;display:grid;place-items:center;color:#6b7280}
.gallery{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-top:16px}
.gal{aspect-ratio:4/3;object-fit:cover;border-radius:12px;cursor:zoom-in}
.kitchen{background-image: url(./assets/kitchen1.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;}
.bathroom{background-image: url(./assets/bathroom.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;}
.dressing{background-image: url(./assets/dressing.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;}
/* Steps/Testimonials/Contact/Footer */
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:16px}
.step{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px;box-shadow:0 2px 8px rgba(0,0,0,.02)}
.step-num{font-size:.75rem;color:var(--muted)}
.testimonials{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:16px;margin-top:16px}
.quote{background:#fafafa;border:1px solid var(--line);border-radius:var(--radius-lg);padding:18px}
.quote blockquote{margin:0 0 6px}
.contact-grid{display:grid;grid-template-columns:1fr;gap:22px}
.form{background:#fff;border:1px solid var(--line);border-radius:var(--radius-lg);padding:16px;display:grid;gap:12px;box-shadow:0 2px 8px rgba(0,0,0,.02)}
.form .two{display:grid;grid-template-columns:1fr;gap:12px}
.site-footer{background:#fff;border-top:1px solid var(--line)}
.footer-grid{display:grid;grid-template-columns:1fr;gap:20px;padding:24px 0}
.brand-footer{display:flex;align-items:center;gap:10px}
.foot-title{font-weight:600}
.foot-list{list-style:none;margin:8px 0 0;padding:0;color:var(--muted);display:grid;gap:6px}
.foot-bottom{display:flex;flex-wrap:wrap;gap:8px;justify-content:space-between;align-items:center;padding:12px 0;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem}

/* Lightbox */
.lightbox[aria-hidden="false"]{display:grid;place-items: center;}
.lightbox{position:fixed;inset:0;display:none;z-index:100}
.lb-viewport { display: grid; place-items: center; overflow: hidden; }
.lb-backdrop{position:absolute;inset:0;background:rgba(0,0,0,.7)}
.lb-dialog{position:absolute;background:#111;display:flex;flex-direction:column;border-radius:16px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.4)}
#lb-img {
  width: 1200px;
  height: 800px;
  max-width: 100%;
  max-height: 90vh;
  object-fit: contain;
}

@media (max-width: 1024px) {
  #lb-img {
    width: 960px;
    height: 640px;
  }
}

@media (max-width: 768px) {
 #lb-img {
    width: 720px;
    height: 540px;
  }
}

@media (max-width: 480px) {
  #lb-img {
    width: 100%;
    height: 100%;
  }
}

.lb-controls{display:flex;gap:10px;align-items:center;justify-content:center;padding:10px;background:#111;color:#fff;border-top:1px solid rgba(255,255,255,.1)}
.lb-btn{width:40px;height:40px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:transparent;color:#fff;font-size:20px;display:grid;place-items:center;cursor:pointer}
.lb-close{position:absolute;top:10px;right:10px;width:40px;height:40px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:26px;cursor:pointer}
.lb-close:hover{background:rgba(255,255,255,.25)}
.lb-zoom{min-width:60px;text-align:center;color:#fff}

/* Nav arrows in lightbox */
.lb-nav{position:absolute;top:50%;transform:translateY(-50%);width:48px;height:48px;border-radius:50%;border:none;background:rgba(255,255,255,.15);color:#fff;font-size:28px;display:grid;place-items:center;cursor:pointer;z-index:2}
.lb-nav:hover{background:rgba(255,255,255,.28)}
.lb-nav.prev{left:12px}
.lb-nav.next{right:12px}

/* Breakpoints */
@media (min-width:768px){
  .nav{position:static;display:flex;background:transparent;border:none;padding:0;gap:8px;align-items:center}
  .nav .nav-btn{height:42px;padding:0 14px}
  .header-cta{display:inline-flex}
  .hero-grid{grid-template-columns:1.05fr .95fr;gap:36px;padding:64px 0}
  .section-head{flex-direction:row;align-items:end;justify-content:space-between}
  .contact-grid{grid-template-columns:1fr 1fr}
  .form .two{grid-template-columns:1fr 1fr}
  .footer-grid{grid-template-columns:2fr 1fr 1fr 1.2fr}
}
@media (min-width:1024px){
  :root{ --maxw:1200px }
  .hero-grid{gap:44px;padding:80px 0}
}

.container-first {  position: relative; line-height: 3em;height:200px}

.container-first:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 1;
    background-image: url('./assets/cuisine-first.png');
	background-position: center;
   opacity: 0.5;
}

.content-first {
    position: relative; 
    z-index: 2;
	text-align: center;
    top: 30%;
}
/* ===== Contact section fixes ===== */
.contact-grid{ align-items: start; }

/* Use grid rows to avoid wrapping issues on small screens */
.contact-card dl{ margin:0; display:grid; gap:0; }
.contact-card .row{
  display:grid;
  grid-template-columns: minmax(100px, 160px) 1fr;
  align-items:center;
  gap:12px;
  padding:12px 0;
  border-bottom:1px solid var(--line);
}
.contact-card .row:last-child{ border-bottom:none }
.contact-card dt{ color:#374151; font-weight:600; }
.contact-card dd{ margin:0; text-align:right; color:#111; overflow-wrap:anywhere; }

/* Stack on very small screens */
@media (max-width: 479px){
  .contact-card .row{ grid-template-columns: 1fr; }
  .contact-card dd{ text-align:left; }
}

/* Form polish */
.form{ background:#fff; border:1px solid var(--line); border-radius:var(--radius-lg); padding:18px; display:grid; gap:14px; }
.form label{ display:grid; gap:6px; font-size:.95rem; color:#374151; }
.form input,.form select,.form textarea{
  width:100%;
  padding:12px 12px;
  border:1px solid var(--line);
  border-radius:12px;
  font:inherit;
  background:#fff;
}
.form input:focus,.form select:focus,.form textarea:focus{
  outline: none;
  border-color: var(--brand);
  box-shadow: 0 0 0 3px rgba(91,15,27,.12);
}
.form .two{ display:grid; grid-template-columns:1fr; gap:12px; }
@media (min-width:768px){
  .form .two{ grid-template-columns:1fr 1fr; }
}

/* Ensure section spacing remains consistent */
.section.section-muted{ padding-top:56px; padding-bottom:56px; }


/* --- Luxe enhancements & accessibility --- */
:root{
  --bg:#faf8f5; --ink:#0f1d1c; --muted:#6d7471;
  --brand:#4b4036; --accent:#390517; --surface:#ffffff; --ring:rgba(57, 5, 23, .35);
}
html, body{background:var(--bg); color:var(--ink)}
.container{max-width:1200px;margin:0 auto;padding:0 24px}
.section{padding:80px 0}
h2{font-family:Cinzel,serif;font-weight:700;letter-spacing:.3px;font-size:clamp(28px,3.2vw,40px);margin:0 0 24px}
.muted{color:var(--muted)}
.focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.skip-link{position:absolute;left:-9999px;top:auto}
.skip-link:focus{left:16px;top:16px;background:#fff;padding:8px 12px;border-radius:8px;box-shadow:0 4px 20px rgba(0,0,0,.12);z-index:1000}
@media (prefers-reduced-motion: reduce){ *{scroll-behavior:auto!important;animation:none!important;transition:none!important} }

/* Header & socials */
header{backdrop-filter:saturate(180%) blur(8px); background:rgba(255,255,255,.75); border-bottom:1px solid rgba(0,0,0,.06)}
.header-right{display:flex;align-items:center;gap:16px}
.social-inline{display:flex;align-items:center;gap:14px}
.social-inline .social{display:inline-flex;align-items:center;gap:8px;font-weight:600;text-decoration:none}
.social-inline .social.tel{color:var(--ink)}
.social-inline .social.wa::before{content:"";width:18px;height:18px;background:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 32 32"><circle cx="16" cy="16" r="14" fill="%2306a65b"/></svg>') center/contain no-repeat}
.social-inline .social.ig::before{content:"";width:18px;height:18px;background:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><rect x="3" y="3" width="18" height="18" rx="5" fill="%230f1d1c"/></svg>') center/contain no-repeat}
.social-inline .social.fb::before{content:"";width:18px;height:18px;background:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><circle cx="12" cy="12" r="10" fill="%230f1d1c"/></svg>') center/contain no-repeat}
.social-inline .social:hover{color:var(--brand)}

/* Buttons */
.cta{background:linear-gradient(180deg,var(--accent), #2b0412);border:none;border-radius:14px;padding:14px 20px;font-weight:700;letter-spacing:.3px;box-shadow:0 10px 30px rgba(176,141,87,.25)}
.cta:hover{transform:translateY(-1px);box-shadow:0 14px 36px rgba(176,141,87,.35)}
.cta:active{transform:translateY(0)}

/* Cards & inputs */
.card{background:var(--surface);border:1px solid rgba(0,0,0,.06);border-radius:18px;box-shadow:0 10px 30px rgba(0,0,0,.06)}
input,select,textarea{border:1px solid rgba(0,0,0,.12);border-radius:12px;padding:12px 14px;background:#fff;width:100%}
input:focus,select:focus,textarea:focus{outline:2px solid var(--ring);border-color:var(--accent)}

/* Cookie banner */
#cookie-banner{position:fixed;inset:auto 16px 16px 16px;background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:14px;box-shadow:0 8px 30px rgba(0,0,0,.12);padding:16px;z-index:999}
#cookie-banner .cookie-actions{display:flex;gap:8px;margin-top:8px}
.btn{padding:10px 14px;border-radius:10px;border:none;background:var(--brand);color:#fff;cursor:pointer}
.btn-ghost{background:transparent;color:var(--brand);border:1px solid var(--brand)}

/* Hero overlay */
.hero{position:relative;overflow:hidden}

/* Footer */
.foot-address{margin-top:12px;color:var(--muted)}

/* Materials grid */
.materials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:28px}
@media (max-width: 1024px){.materials-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width: 640px){.materials-grid{grid-template-columns:1fr}}
.mat-card{background:var(--surface);border:1px solid rgba(0,0,0,.06);border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(0,0,0,.06);transition:transform .2s ease, box-shadow .2s ease}
.mat-card:hover{transform:translateY(-2px);box-shadow:0 14px 36px rgba(0,0,0,.10)}
.mat-figure{position:relative;aspect-ratio:16/10;overflow:hidden}
.mat-figure img{width:100%;height:100%;object-fit:cover;display:block;filter:saturate(1.02) contrast(1.02)}
.mat-card h3{font-family:Cinzel,serif;margin:14px 16px 6px}
.mat-card p{margin:0 16px 18px;color:var(--muted)}
.materials-note{margin-top:28px;padding:18px 20px}

/* --- Sober Luxury Refresh (v3) --- */
:root{
  --bg:#fcfbf9;
  --ink:#0d1514;
  --muted:#68706d;
  --brand:#3f362d;
  --accent:#390517;
  --surface:#ffffff;
  --ring: rgba(57, 5, 23, .35);
}
.card{box-shadow:0 8px 26px rgba(0,0,0,.06)}
.section{padding:88px 0}
h1,h2,h3{letter-spacing:.2px}
.cta{background:linear-gradient(180deg,var(--accent), #2b0412);box-shadow:0 10px 28px rgba(174,142,92,.22)}
.cta:hover{box-shadow:0 14px 34px rgba(174,142,92,.30)}
#cookie-banner{inset:auto 24px 24px auto; max-width:420px}
#cookie-banner .cookie-inner p{margin:0}
.form .small{display:flex; align-items:flex-start; gap:10px; font-size:.95rem; color:var(--muted)}
.form .small input[type="checkbox"]{margin-top:3px; flex:0 0 auto}
.form .small a{ text-decoration:underline}
.form label{display:block; margin-bottom:14px}
.form .two{display:grid; gap:12px; grid-template-columns:1fr 1fr}
@media (max-width:720px){ .form .two{grid-template-columns:1fr} }
header{background:rgba(255,255,255,.82)}
.social-inline .social:hover{color:var(--accent)}
.mat-card:hover{transform:translateY(-1px); box-shadow:0 12px 28px rgba(0,0,0,.08)}

/* === Social icons visibility base === */
.social-inline .social::before{
  content:"";
  display:inline-block;
  width:18px;
  height:18px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
.social-inline .social.wa::before{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="%2306a65b" d="M16 3C9.4 3 4 8.4 4 15c0 2.5.8 4.8 2.1 6.7L4 29l7.5-2c1.8 1 3.8 1.5 5.9 1.5 6.6 0 12-5.4 12-12S22.6 3 16 3z"/></svg>'); }
.social-inline .social.ig::before{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%230f1d1c" d="M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm5 5.5A6.5 6.5 0 1 0 18.5 14 6.5 6.5 0 0 0 12 7.5zm6-1a1 1 0 1 0 1 1 1 1 0 0 0-1-1z"/></svg>'); }
.social-inline .social.fb::before{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%230f1d1c" d="M22 12a10 10 0 1 0-11.6 9.9v-7H8.3V12h2.1V9.8c0-2 1.2-3.2 3-3.2.9 0 1.8.1 2.7.3v2h-1.5c-1 0-1.4.6-1.4 1.3V12h2.5l-.4 2.9h-2.1v7A10 10 0 0 0 22 12z"/></svg>'); }

.form .small input{ width:10%; }
#consent{width:3%;}

/* === Header Deluxe Rework === */
.site-header{
  position:sticky; top:0; z-index:100;
  background:rgba(255,255,255,.72);
  backdrop-filter:saturate(180%) blur(12px);
  border-bottom:1px solid rgba(0,0,0,.06);
  transition:all .25s ease;
}
.site-header::after{
  content:""; position:absolute; left:0; right:0; bottom:-1px; height:1px;
  background:linear-gradient(90deg, transparent, var(--accent), transparent);
  opacity:.45; pointer-events:none;
}
.site-header.scrolled{
  background:rgba(255,255,255,.9);
  box-shadow:0 10px 40px rgba(0,0,0,.06);
}
.header-inner{min-height:82px}
.site-nav a{
  position:relative; padding:10px 8px; border-radius:10px; font-weight:600; letter-spacing:.02em;
}
.site-nav a::after{
  content:""; position:absolute; left:50%; transform:translateX(-50%) scaleX(0);
  bottom:6px; width:60%; height:2px; background:linear-gradient(90deg, transparent, var(--accent), transparent);
  transition:transform .25s ease;
}
.site-nav a:hover::after{ transform:translateX(-50%) scaleX(1) }

.header-actions{display:flex; align-items:center; gap:14px}
.icon-link{
  width:36px; height:36px; display:inline-flex !important; align-items:center; justify-content:center;
  border-radius:12px; background:rgba(0,0,0,.04);
  box-shadow:inset 0 0 0 1px rgba(0,0,0,.05);
  transition:transform .15s ease, box-shadow .2s ease, background .2s ease;
}
.icon-link:hover{ transform:translateY(-1px); background:rgba(0,0,0,.06); box-shadow:inset 0 0 0 1px rgba(0,0,0,.08) }
.icon-link::before{
  content:""; display:block; width:18px; height:18px; background-size:contain; background-repeat:no-repeat; background-position:center;
}
.icon-link.tel::before{
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%230f1d1c" d="M6.6 10.8c1.6 3.1 4.5 5.7 7.6 7.6l2.6-2.6c.3-.3.7-.4 1.1-.3 1 .3 2 .5 3.1.5.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C10.4 22 2 13.6 2 3c0-.6.4-1 1-1h3.1c.6 0 1 .4 1 1 0 1 .2 2 .5 3.1.1.4 0 .8-.3 1.1L6.6 10.8z"/></svg>');
}
.icon-link.wa::before{
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="%2306a65b" d="M16 3C9.4 3 4 8.4 4 15c0 2.5.8 4.8 2.1 6.7L4 29l7.5-2c1.8 1 3.8 1.5 5.9 1.5 6.6 0 12-5.4 12-12S22.6 3 16 3z"/></svg>');
}
.icon-link.ig::before{
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%230f1d1c" d="M7 2h10a5 5 0 0 1 5 5v10a5 5 0 0 1-5 5H7a5 5 0 0 1-5-5V7a5 5 0 0 1 5-5zm5 5.5A6.5 6.5 0 1 0 18.5 14 6.5 6.5 0 0 0 12 7.5zm6-1a1 1 0 1 0 1 1 1 1 0 0 0-1-1z"/></svg>');
}
.icon-link.fb::before{
  background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%230f1d1c" d="M22 12a10 10 0 1 0-11.6 9.9v-7H8.3V12h2.1V9.8c0-2 1.2-3.2 3-3.2.9 0 1.8.1 2.7.3v2h-1.5c-1 0-1.4.6-1.4 1.3V12h2.5l-.4 2.9h-2.1v7A10 10 0 0 0 22 12z"/></svg>');
}
.cta-primary{
  padding:12px 16px; border-radius:14px; background:linear-gradient(180deg,var(--accent), #2b0412);
  color:#fff; font-weight:700; letter-spacing:.3px; box-shadow:0 10px 28px rgba(174,142,92,.22);
}
.cta-primary:hover{ transform:translateY(-1px); box-shadow:0 14px 34px rgba(174,142,92,.30) }
.sr-only{ position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0 }
.social-foot{display:flex; gap:10px; margin-top:10px}

/* === UX pass === */
:root{ --header-h: 86px; }
.site-header{ min-height: var(--header-h); }
header + main .hero{ padding-top: var(--header-h); }
section{ scroll-margin-top: calc(var(--header-h) + 10px); }

.hero .hero-text{ position:absolute; left:0; right:0; bottom:12vh; padding:0 24px; }
@media (max-width: 900px){
  .hero .hero-text{ bottom:8vh; }
}

.header-actions{ gap: 16px }
.header-actions .cta-primary{ white-space:nowrap }

.alt-contacts{ display:flex; gap:12px; margin-top:14px }
.alt-contacts .alt{ display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border-radius:12px; border:1px solid rgba(0,0,0,.08) }
.alt-contacts .alt:hover{ background:rgba(0,0,0,.03) }
.alt-contacts .alt::before{ content:""; display:inline-block; width:16px; height:16px; background-size:contain; background-repeat:no-repeat; background-position:center }
.alt-contacts .alt.tel::before{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 24 24"><path fill="%230f1d1c" d="M6.6 10.8c1.6 3.1 4.5 5.7 7.6 7.6l2.6-2.6c.3-.3.7-.4 1.1-.3 1 .3 2 .5 3.1.5.6 0 1 .4 1 1V21c0 .6-.4 1-1 1C10.4 22 2 13.6 2 3c0-.6.4-1 1-1h3.1c.6 0 1 .4 1 1 0 1 .2 2 .5 3.1.1.4 0 .8-.3 1.1L6.6 10.8z"/></svg>'); }
.alt-contacts .alt.wa::before{ background-image:url('data:image/svg+xml;utf8,<svg xmlns="https://www.w3.org/2000/svg" viewBox="0 0 32 32"><path fill="%2306a65b" d="M16 3C9.4 3 4 8.4 4 15c0 2.5.8 4.8 2.1 6.7L4 29l7.5-2c1.8 1 3.8 1.5 5.9 1.5 6.6 0 12-5.4 12-12S22.6 3 16 3z"/></svg>'); }

/* Final UX pass */
.logo{ margin:0; display:block; height:100%; object-fit:contain; position:absolute }
.header-inner{ display:flex; align-items:center; justify-content:space-between; gap:18px; margin:0 }
.site-nav{ display:flex; gap:18px; align-items:center; margin:0; left:25%; position:absolute;} 
.header-actions{ display:flex; align-items:center; gap:14px }
.header-actions .cta-primary{ white-space:nowrap }
.alt-contacts .alt.tel{ display:none!important }
.alt-contacts .alt.wa{ border-color: rgba(6,166,91,.25) }
.brand{ display:none }

:root{ --header-h: 88px; }
.site-header{ position:sticky; top:0; z-index:100; background:rgba(255,255,255,.8);
  backdrop-filter:saturate(180%) blur(10px); border-bottom:1px solid rgba(0,0,0,.06) }
.header-inner{
  display:grid; grid-template-columns:auto 1fr auto; align-items:center; column-gap:24px;
  min-height:var(--header-h); 
}
.brand-logo{ display:inline-flex; align-items:center; text-decoration:none }
.logo{ height:100%; width:auto; display:block; margin:0; position:absolute }
.site-nav{ display:flex; gap:28px; align-items:center; justify-content:center; flex-wrap:nowrap; margin:0 }
.site-nav a{ padding:10px 6px; font-weight:600; border-radius:10px; text-decoration:none }
.site-nav a:hover{ background:rgba(0,0,0,.04) }
.header-actions a:hover{ background:var(--brand) }
.header-actions a.cta-wa:hover{ background:rgba(0,0,0,.04) }
.header-actions{ display:flex; align-items:center; gap:12px }
.header-actions .cta-primary{ white-space:nowrap }

/* ====== MOBILE NAV DROPDOWN ====== */
@media (max-width: 980px){
  .site-nav{ display:none; }
  .site-nav.open{
    display:flex; position:absolute; left:16px; top:calc(var(--header-h) - 10px);
    flex-direction:column; gap:8px; padding:12px; background:#fff; border:1px solid rgba(0,0,0,.06);
    border-radius:12px; box-shadow:0 10px 30px rgba(0,0,0,.08); z-index:1000;
    min-width: min(82vw, 340px);
  }
  .nav-group{ width:100% }
  .nav-group .nav-sub{ position:static; display:none; box-shadow:none; border:none; padding:6px 0 }
  .nav-group.open .nav-sub{ display:block }
}
section{ scroll-margin-top: calc(var(--header-h) + 10px); }

/* WhatsApp CTA */
.cta-wa{
  background:#25D366; 
  border:none; border-radius:14px; padding:12px 14px; font-weight:700; letter-spacing:.2px;
  box-shadow:0 6px 22px rgba(37,211,102,.28);
}
.cta-wa:hover{ transform:translateY(-1px); box-shadow:0 10px 28px rgba(37,211,102,.36) }

.footer-actions{ margin-top:12px }
.footer-actions .cta{ margin-right:8px }

/* === Services & Dropdown === */
.nav-group{ position:relative }
.nav-group > a{ display:inline-flex; align-items:center; gap:6px }
.nav-group.has-sub > a::after{ content:"▾"; font-size:.8em; opacity:.7 }
.nav-sub{
  position:absolute; top:100%; left:0; display:none; min-width:280px;
  background:#fff; border:1px solid rgba(0,0,0,.06); border-radius:12px; padding:10px;
  box-shadow:0 12px 30px rgba(0,0,0,.08); z-index:20;
}
.nav-group:hover .nav-sub{ display:block }
.nav-sub a{ display:block; padding:8px 10px; border-radius:8px; white-space:nowrap }
.nav-sub a:hover{ background:rgba(0,0,0,.04) }

@media(max-width:980px){ .svc-grid{ grid-template-columns:repeat(2,1fr) } }
@media(max-width:640px){ .svc-grid{ grid-template-columns:1fr } }
.svc-card{ display:block; padding:18px; border:1px solid rgba(0,0,0,.06); border-radius:16px;
  background:#fff; box-shadow:0 8px 22px rgba(0,0,0,.06); text-decoration:none }
.svc-card h3{ margin:0 0 6px; font-size:1.06rem }
.svc-card p{ margin:0; color:var(--muted) }
.svc-card:hover{ transform:translateY(-1px); box-shadow:0 12px 28px rgba(0,0,0,.08) }

/* Service page */
.svc-content-inner{ display:grid; gap:24px; grid-template-columns:2fr 1fr }
@media(max-width:980px){ .svc-content-inner{ grid-template-columns:1fr } }
.svc-copy .check{ padding-left:18px }
.svc-copy .check li{ margin-bottom:6px }
.svc-side{ padding:16px }
.svc-side .bullets{ padding-left:18px }
.svc-cta{ display:flex; gap:10px; margin-top:10px }

/* Gallery Services */
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:80px}
.service-card{background:var(--card-bg,#fff);border:1px solid #eee;border-radius:16px;overflow:hidden;cursor:pointer;transition:transform .2s ease, box-shadow .2s ease}
.service-card:hover{transform:translateY(-2px);box-shadow:0 6px 24px rgba(0,0,0,.08)}
.service-thumb{aspect-ratio:4/3;overflow:hidden}
.service-thumb img{width:100%;height:100%;object-fit:cover}
.service-info{padding:12px 14px}
.service-info h3{margin:.2rem 0}
.service-info p{margin:.2rem 0;color:var(--muted)}

/* Modal */
.service-modal{position:fixed;inset:0;display:none}
.service-modal.is-open{display:block;z-index:999}
.service-modal__overlay{position:absolute;inset:0;background:rgba(0,0,0,.5)}
.service-modal__dialog{position:relative;max-width:min(980px,92vw);max-height:88vh;margin:6vh auto;background:#fff;border-radius:16px;overflow:hidden;padding:16px}
.service-modal__content{display:grid;grid-template-columns:1.1fr .9fr;gap:16px;align-items:start}
.service-modal__content img{width:100%;height:60vh;object-fit:cover;border-radius:12px}
.service-modal__text h3{margin:.2rem 0}
.service-modal__text p{color:#444}
.service-modal__close{position:absolute;top:8px;right:12px;font-size:28px;background:transparent;border:0;cursor:pointer;line-height:1}
.service-modal__nav{position:absolute;top:50%;transform:translateY(-50%);background:#fff;border:1px solid #eee;border-radius:999px;width:44px;height:44px;cursor:pointer}
.service-modal__nav.prev{left:-10px}
.service-modal__nav.next{right:-10px}
@media (max-width: 800px){
  .service-modal__content{grid-template-columns:1fr}
  .service-modal__content img{height:42vh}
}

/* ---- Inline notifications (bottom) ---- */
#notif-container {
  position: fixed;
  inset: auto 0 20px 0;
  display: flex;
  justify-content: center;
  pointer-events: none;
  z-index: 9999;
}
.notif {
  pointer-events: auto;
  padding: 12px 18px;
  border-radius: 8px;
  color: #fff;
  font-weight: 600;
  box-shadow: 0 10px 20px rgba(0,0,0,.15);
  transform: translateY(0);
  opacity: 1;
  transition: opacity .3s, transform .3s;
}
.notif + .notif { margin-left: 8px; }
.notif-ok { background: #28a745; }
.notif-ko { background: #dc3545; }
.notif-hide { opacity: 0; transform: translateY(10px); }

/* ====== BOUTON BURGER ====== */
.burger{
  display:none;
  width:40px; height:40px; border-radius:12px;
  background:#fff; border:1px solid rgba(0,0,0,.06);
  align-items:center; justify-content:center; cursor:pointer;
  box-shadow:0 4px 14px rgba(0,0,0,.06);
}
.burger:focus{ outline:2px solid var(--ring, rgba(57,5,23,.35)); outline-offset:2px; }
.burger-box{ position:relative; width:22px; height:16px; }
.burger-inner,
.burger-inner::before,
.burger-inner::after{
  position:absolute; left:0; width:100%; height:2px; background:var(--ink, #0f1d1c);
  content:""; transition:transform .2s ease, top .2s ease, opacity .2s ease;
}
.burger-inner{ top:50%; transform:translateY(-50%); }
.burger-inner::before{ top:-6px; }
.burger-inner::after{ top:6px; }
.burger.is-active .burger-inner{ background:transparent; }
.burger.is-active .burger-inner::before{ top:0; transform:rotate(45deg); }
.burger.is-active .burger-inner::after{ top:0; transform:rotate(-45deg); }

@media (max-width:980px){
  .burger{ display:inline-flex; }
}