:root{
  --ink:#15181A;
  --porcelain:#EEE9E1;
  --brass:#AD8853;
  --brass-soft:#C7A87A;
  --clay:#BD7A64;
  --deep:#1C2622;
  --stone:#D9D2C5;
  --text-on-light:#211F1B;
  --text-muted:#6B675F;
  --text-on-dark:#EEE9E1;
}

*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  background:var(--porcelain); color:var(--text-on-light);
  font-family:'Vazirmatn', sans-serif; line-height:1.7; overflow-x:hidden;
}
body.lang-en{ font-family:'Inter', sans-serif; }
body.lang-en .display{ font-family:'Fraunces', serif; }
body.lang-fa .display{ font-family:'Vazirmatn', sans-serif; font-weight:600; }

[data-fa]{ display:inline; }
[data-en]{ display:none; }
body.lang-en [data-fa]{ display:none; }
body.lang-en [data-en]{ display:inline; }
body.lang-en [data-en].block, body.lang-fa [data-fa].block{ display:block; }
body.lang-en [data-fa].block{ display:none; }
body.lang-fa [data-en].block{ display:none; }

html[dir="rtl"]{ direction:rtl; }
html[dir="ltr"]{ direction:ltr; }

.wrap{ max-width:1180px; margin:0 auto; padding:0 32px; }
a{ color:inherit; text-decoration:none; }

.grain{
  position:fixed; inset:0; pointer-events:none; z-index:999; opacity:0.035; mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='120' height='120'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
}

/* logo */
.logo-mark{ width:38px; height:38px; color:var(--brass); flex-shrink:0; }
.logo-mark.lg{ width:64px; height:64px; }
.brand-row{ display:flex; align-items:center; gap:12px; }

/* nav */
header{
  position:fixed; top:0; left:0; right:0; z-index:100;
  background:rgba(238,233,225,0.9); backdrop-filter:blur(10px);
  border-bottom:1px solid var(--stone);
}
.nav-inner{ display:flex; align-items:center; justify-content:space-between; padding:16px 0; }
.brand{ font-family:'Fraunces','Vazirmatn',serif; font-weight:500; font-size:18px; letter-spacing:0.02em; }
body.lang-fa .brand{ font-family:'Vazirmatn', sans-serif; font-weight:600; }
nav.links{ display:flex; align-items:center; gap:8px; }
nav.links > a, nav.links .mega-trigger{
  font-size:14.5px; letter-spacing:0.02em; text-transform:none; color:var(--text-muted);
  position:relative; padding:9px 14px; border-radius:20px; white-space:nowrap;
  font-weight:500; display:flex; align-items:center; gap:7px; transition:color .2s, background .25s;
}
body.lang-en nav.links > a, body.lang-en nav.links .mega-trigger{ font-size:12.5px; letter-spacing:0.08em; text-transform:uppercase; font-weight:500; }
nav.links > a svg, nav.links .mega-trigger svg{ width:15px; height:15px; opacity:0.55; flex-shrink:0; transition:opacity .2s; }
nav.links > a:hover, nav.links .mega-trigger:hover{ color:var(--ink); background:rgba(173,136,83,0.12); }
nav.links > a:hover svg, nav.links .mega-trigger:hover svg{ opacity:0.9; }
.nav-item{ position:relative; }
.nav-item .chev{ width:10px; height:10px; opacity:0.6; transition:transform .25s; margin-inline-start:-2px; }
.nav-item:hover .chev, .nav-item:focus-within .chev{ transform:rotate(180deg); }

/* mega menu */
.nav-mega{
  position:absolute; top:calc(100% + 10px); inset-inline-start:0; min-width:420px; max-width:min(460px, 90vw);
  background:var(--porcelain); border:1px solid var(--stone); border-radius:16px;
  box-shadow:0 20px 44px -18px rgba(21,24,26,0.28); padding:22px;
  display:grid; grid-template-columns:repeat(2,1fr); gap:22px;
  opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .22s ease, transform .22s ease, visibility .22s;
  z-index:120;
}
.nav-item:hover .nav-mega, .nav-item:focus-within .nav-mega{ opacity:1; visibility:visible; transform:none; }
.mega-heading{ display:block; font-size:11px; letter-spacing:0.1em; text-transform:uppercase; color:var(--brass); margin-bottom:10px; }
body.lang-fa .mega-heading{ letter-spacing:0; text-transform:none; font-size:12.5px; font-weight:600; }
.mega-col{ display:flex; flex-direction:column; gap:8px; }
.mega-col a{ font-size:13.5px; color:var(--text-on-light); padding:4px 0; border-radius:6px; }
.mega-col a:hover{ color:var(--brass); padding-inline-start:4px; }

/* credential line (hero) */
.credential-line{
  display:inline-flex; align-items:center; gap:10px; font-size:13.5px; color:var(--brass-soft);
  border:1px solid rgba(199,168,122,0.4); border-radius:20px; padding:8px 16px; margin-bottom:22px;
}
.credential-line svg{ width:15px; height:15px; flex-shrink:0; }

/* pillar accordion (details) */
.pillar-card{ padding:0; }
.pillar-card > details{ padding:38px 34px; }
.pillar-card summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:14px;
}
.pillar-card summary::-webkit-details-marker{ display:none; }
.pillar-card summary .acc-icon{
  width:26px; height:26px; border-radius:50%; border:1px solid var(--brass-soft); flex-shrink:0;
  display:flex; align-items:center; justify-content:center; font-size:15px; color:var(--brass-soft); transition:transform .3s;
}
.pillar-card details[open] summary .acc-icon{ transform:rotate(45deg); }
.pillar-card .summary-head{ display:flex; flex-direction:column; align-items:flex-start; gap:0; }
.pillar-card .summary-head .svc-num{ margin-bottom:20px; }
.pillar-card .summary-head h3{ margin-bottom:0; }
.pillar-card .pillar-body{ margin-top:18px; }
.nav-actions{ display:flex; align-items:center; gap:16px; }
.lang-toggle{ display:flex; border:1px solid var(--stone); border-radius:20px; overflow:hidden; }
.lang-toggle button{ background:none; border:none; padding:7px 14px; cursor:pointer; color:var(--text-muted); font-family:inherit; font-size:12px; }
.lang-toggle button.active{ background:var(--ink); color:var(--porcelain); }

.btn{ display:inline-flex; align-items:center; gap:8px; padding:12px 26px; font-size:13px; letter-spacing:0.03em; border-radius:22px; border:1px solid var(--ink); cursor:pointer; transition:all .25s; font-family:inherit; }
.btn-primary{ background:var(--ink); color:var(--porcelain); }
.btn-primary:hover{ background:var(--brass); border-color:var(--brass); }
.btn-ghost{ background:transparent; color:var(--ink); }
.btn-ghost:hover{ background:var(--ink); color:var(--porcelain); }
.btn-on-dark{ border-color:var(--brass-soft); color:var(--porcelain); }
.btn-on-dark:hover{ background:var(--brass); border-color:var(--brass); }

section{ padding:110px 0; }
.section-head{ max-width:620px; margin-bottom:60px; }
.section-head.center{ margin-left:auto; margin-right:auto; text-align:center; }
.eyebrow{ font-size:12px; letter-spacing:0.18em; text-transform:uppercase; color:var(--clay); display:flex; align-items:center; gap:12px; margin-bottom:22px; }
body.lang-fa .eyebrow{ letter-spacing:0.03em; text-transform:none; font-size:13px; }
.eyebrow::before{ content:''; width:28px; height:1px; background:var(--clay); }
.section-head h2{ font-size:38px; font-weight:500; margin-top:14px; color:var(--text-on-light); }
body.lang-fa .section-head h2{ font-size:32px; }
.section-head p{ color:var(--text-muted); margin-top:16px; font-size:16px; max-width:520px; }
.section-head.center p{ margin-left:auto; margin-right:auto; }

/* hero (home) */
.hero{ background:var(--ink); color:var(--text-on-dark); padding:170px 0 100px; position:relative; overflow:hidden; }
.hero::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 82% 18%, rgba(173,136,83,0.16), transparent 45%); }
.hero-grid{ display:grid; grid-template-columns:1.05fr 0.95fr; gap:70px; align-items:center; position:relative; z-index:2; }
.hero .eyebrow{ color:var(--brass-soft); }
.hero .eyebrow::before{ background:var(--brass-soft); }
.hero h1{ font-size:52px; line-height:1.18; font-weight:500; max-width:560px; margin-bottom:26px; }
body.lang-fa .hero h1{ font-size:44px; line-height:1.5; }
.hero p.lead{ font-size:17px; color:#BEB9AF; max-width:460px; margin-bottom:38px; }
.hero-actions{ display:flex; gap:16px; flex-wrap:wrap; }

/* framed before/after */
.frame{ position:relative; border:1px solid var(--brass-soft); padding:14px; }
.frame-inner{ position:relative; aspect-ratio:4/5; overflow:hidden; border-radius:1px; }
.frame-inner img{ width:100%; height:100%; object-fit:cover; display:block; }
.ba-layer{ position:absolute; inset:0; display:flex; align-items:flex-end; padding:22px; font-size:11px; letter-spacing:0.14em; text-transform:uppercase; color:#fff; }
.ba-before{ background:linear-gradient(155deg,#8a7f74,#4d453d 55%,#2a2622); }
.ba-after{ background:linear-gradient(155deg,#efe3cf,#d8c19a 55%,#b6935f); color:#2c2318; clip-path:inset(0 45% 0 0); }
html[dir="rtl"] .ba-after{ clip-path:inset(0 0 0 45%); }
.ba-handle{ position:absolute; top:0; bottom:0; inset-inline-start:55%; width:2px; background:var(--brass); transform:translateX(-50%); }
html[dir="rtl"] .ba-handle{ transform:translateX(50%); }
.ba-handle::after{ content:'↔'; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); width:34px; height:34px; background:var(--brass); color:#fff; border-radius:50%; display:flex; align-items:center; justify-content:center; font-size:15px; box-shadow:0 4px 14px rgba(0,0,0,0.35); }
.frame input[type=range]{ width:100%; margin-top:12px; -webkit-appearance:none; appearance:none; height:1px; background:var(--stone); outline:none; }
.frame input[type=range]::-webkit-slider-thumb{ -webkit-appearance:none; width:14px; height:14px; border-radius:50%; background:var(--brass); cursor:pointer; border:2px solid var(--ink); }
.plate{ display:flex; justify-content:space-between; align-items:center; margin-top:12px; font-size:11px; letter-spacing:0.06em; color:var(--brass-soft); gap:10px; }

/* about */
.about-grid{ display:grid; grid-template-columns:0.85fr 1.15fr; gap:64px; align-items:center; }
.portrait{ aspect-ratio:3/4; background:linear-gradient(160deg,#DAD2C0,#B7A98D 60%,#8f7f60); position:relative; border:1px solid var(--stone); overflow:hidden; }
.portrait img{ width:100%; height:100%; object-fit:cover; display:block; }
.portrait .cap{ position:absolute; bottom:0; inset-inline-start:0; background:var(--ink); color:var(--porcelain); font-size:11px; letter-spacing:0.08em; padding:9px 16px; }
.cred-list{ margin-top:32px; display:grid; gap:14px; }
.cred-list li{ display:flex; gap:12px; align-items:flex-start; list-style:none; font-size:15px; color:var(--text-on-light); }
.cred-list li::before{ content:'—'; color:var(--brass); flex-shrink:0; margin-top:1px; }

/* services / pillars */
.services{ background:var(--deep); color:var(--porcelain); }
.services .eyebrow{ color:var(--brass-soft); }
.services .eyebrow::before{ background:var(--brass-soft); }
.services .section-head h2{ color:var(--porcelain); }
.services .section-head p{ color:#A8A499; }

.pillar-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(238,233,225,0.14); margin-bottom:1px; }
.pillar-card{ background:var(--deep); padding:38px 34px; transition:background .25s; }
.pillar-card:hover{ background:#233530; }
.pillar-card .svc-num{ font-size:12px; color:var(--brass-soft); letter-spacing:0.08em; margin-bottom:20px; }
.pillar-card h3{ font-size:21px; font-weight:500; margin-bottom:10px; }
.pillar-card p{ font-size:14px; color:#A8A499; line-height:1.75; margin-bottom:18px; }
.chip-row{ display:flex; flex-wrap:wrap; gap:8px; margin-bottom:20px; }
.chip{ font-size:11.5px; padding:6px 12px; border:1px solid var(--brass-soft); border-radius:14px; color:var(--brass-soft); transition:all .2s; }
.chip:hover{ background:var(--brass); color:var(--ink); border-color:var(--brass); }
.pillar-card .btn{ font-size:12px; padding:9px 20px; }

.svc-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:rgba(238,233,225,0.14); }
.svc-card{ background:var(--deep); padding:30px 26px; transition:background .25s; }
.svc-card:hover{ background:#243530; }
.svc-card .svc-num{ font-size:12px; color:var(--brass-soft); letter-spacing:0.08em; margin-bottom:16px; }
.svc-card h3{ font-size:16px; font-weight:500; margin-bottom:10px; }
.svc-card p{ font-size:13px; color:#A8A499; line-height:1.7; }

/* gallery */
.g-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:24px; }
.g-item .frame{ padding:10px; }
.g-item .frame-inner{ aspect-ratio:3/4; }
.g-note{ margin-top:36px; font-size:13px; color:var(--text-muted); text-align:center; }

/* instagram */
.instagram{ background:var(--ink); color:var(--porcelain); text-align:center; }
.instagram .section-head{ margin-left:auto; margin-right:auto; }
.ig-grid{ display:grid; grid-template-columns:repeat(6,1fr); gap:10px; margin:50px 0 44px; }
.ig-tile{ aspect-ratio:1; position:relative; overflow:hidden; background:linear-gradient(145deg,#2b3733,#171c1a); }
.ig-tile:nth-child(odd){ background:linear-gradient(145deg,#4b3f2f,#1d1712); }
.ig-tile::after{ content:''; position:absolute; inset:0; opacity:0; transition:opacity .25s; background:rgba(173,136,83,0.35); }
.ig-tile:hover::after{ opacity:1; }

/* booking */
.booking-grid{ display:grid; grid-template-columns:0.9fr 1.1fr; gap:70px; }
form{ display:grid; gap:20px; }
.field{ display:grid; gap:8px; }
.field label{ font-size:12px; letter-spacing:0.05em; color:var(--text-muted); text-transform:uppercase; }
body.lang-fa .field label{ text-transform:none; }
.field input, .field select, .field textarea{ border:none; border-bottom:1px solid var(--stone); background:transparent; padding:11px 2px; font-size:15px; font-family:inherit; color:var(--text-on-light); outline:none; transition:border-color .2s; }
.field input:focus, .field select:focus, .field textarea:focus{ border-color:var(--brass); }
.two-col{ display:grid; grid-template-columns:1fr 1fr; gap:20px; }
.form-note{ font-size:12.5px; color:var(--text-muted); margin-top:6px; }

/* contact */
.contact{ background:var(--deep); color:var(--porcelain); }
.contact .section-head h2{ color:var(--porcelain); }
.contact-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.contact-card h4{ font-size:12px; letter-spacing:0.08em; text-transform:uppercase; color:var(--brass-soft); margin-bottom:12px; }
body.lang-fa .contact-card h4{ text-transform:none; }
.contact-card p{ font-size:15px; color:#CFCBC0; }

/* footer */
footer{ background:var(--ink); color:#949087; padding:50px 0; font-size:13px; }
.foot-grid{ display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:20px; }
.foot-links{ display:flex; gap:22px; flex-wrap:wrap; }
.foot-links a:hover{ color:var(--porcelain); }

/* blog / SEO landing pages */
.breadcrumb{ font-size:12px; color:#BEB9AF; margin-bottom:22px; display:flex; gap:8px; flex-wrap:wrap; }
.breadcrumb a{ color:#BEB9AF; }
.breadcrumb a:hover{ color:var(--brass-soft); }
.blog-hero{ background:var(--ink); color:var(--porcelain); padding:150px 0 70px; position:relative; overflow:hidden; }
.blog-hero::before{ content:''; position:absolute; inset:0; background:radial-gradient(circle at 85% 10%, rgba(173,136,83,0.14), transparent 45%); }
.blog-hero .wrap{ position:relative; z-index:2; }
.blog-hero h1{ font-size:40px; font-weight:500; max-width:680px; }
body.lang-fa .blog-hero h1{ font-size:33px; line-height:1.5; }
.blog-hero p.lead{ margin-top:18px; color:#BEB9AF; max-width:600px; font-size:16px; }
.blog-body{ max-width:760px; margin:0 auto; padding:90px 32px; }
.blog-body h2{ font-size:24px; margin:40px 0 16px; font-family:'Fraunces',serif; font-weight:500; }
body.lang-fa .blog-body h2{ font-family:'Vazirmatn',sans-serif; font-weight:600; font-size:21px; }
.blog-body p{ margin-bottom:16px; color:var(--text-on-light); }
.blog-body ul{ margin:0 0 20px; padding-inline-start:22px; }
.blog-body li{ margin-bottom:8px; }
.faq-item{ border-top:1px solid var(--stone); padding:20px 0; }
.faq-item h4{ font-size:16px; margin-bottom:8px; font-weight:600; }
.cta-banner{ background:var(--deep); color:var(--porcelain); padding:56px 32px; text-align:center; margin-top:20px; }
.cta-banner h3{ font-size:24px; margin-bottom:14px; font-weight:500; }
body.lang-fa .cta-banner h3{ font-size:21px; }
.related-grid{ display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--stone); margin-top:60px; }
.related-card{ background:var(--porcelain); padding:22px 18px; font-size:13.5px; transition:background .2s; }
.related-card:hover{ background:#fff; }
.related-card .k{ font-size:11px; color:var(--brass); letter-spacing:0.06em; margin-bottom:8px; display:block; }
body.lang-fa .related-card .k{ letter-spacing:0; }

/* ===== accessibility: skip link + focus ===== */
.skip-link{
  position:fixed; top:-60px; inset-inline-start:16px; z-index:1000;
  background:var(--ink); color:var(--porcelain); padding:12px 20px; border-radius:8px;
  font-size:13px; transition:top .2s;
}
.skip-link:focus{ top:16px; }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible{
  outline:2px solid var(--brass); outline-offset:3px; border-radius:2px;
}

/* ===== mobile nav drawer ===== */
.hamburger{
  display:none; flex-direction:column; justify-content:center; gap:5px;
  width:38px; height:38px; border:1px solid var(--stone); border-radius:10px;
  background:transparent; cursor:pointer; padding:0;
}
.hamburger span{ display:block; width:16px; height:1px; background:var(--ink); margin:0 auto; transition:transform .25s, opacity .25s; }
.hamburger[aria-expanded="true"] span:nth-child(1){ transform:translateY(6px) rotate(45deg); }
.hamburger[aria-expanded="true"] span:nth-child(2){ opacity:0; }
.hamburger[aria-expanded="true"] span:nth-child(3){ transform:translateY(-6px) rotate(-45deg); }

.nav-drawer{ position:fixed; inset:0; z-index:200; visibility:hidden; pointer-events:none; }
.nav-drawer.open{ visibility:visible; pointer-events:auto; }
.nav-drawer-backdrop{ position:absolute; inset:0; background:rgba(21,24,26,0.5); opacity:0; transition:opacity .3s; }
.nav-drawer.open .nav-drawer-backdrop{ opacity:1; }
.nav-drawer-panel{
  position:absolute; top:0; inset-inline-end:0; height:100%; width:min(320px,84vw);
  background:var(--porcelain); padding:100px 30px 40px; display:flex; flex-direction:column; gap:26px;
  transform:translateX(100%); transition:transform .32s cubic-bezier(.22,.9,.32,1);
  box-shadow:-8px 0 30px rgba(0,0,0,0.18);
}
html[dir="rtl"] .nav-drawer-panel{ transform:translateX(-100%); }
.nav-drawer.open .nav-drawer-panel{ transform:translateX(0); }
.nav-drawer-panel a{ font-size:17px; color:var(--text-on-light); padding-bottom:10px; border-bottom:1px solid var(--stone); }
.nav-drawer-panel .btn{ margin-top:6px; justify-content:center; }
.nav-drawer-close{
  position:absolute; top:24px; inset-inline-end:26px; width:38px; height:38px; border-radius:50%;
  border:1px solid var(--stone); background:transparent; cursor:pointer; font-size:16px; color:var(--ink);
}

/* ===== scroll reveal ===== */
.reveal{ opacity:0; transform:translateY(22px); transition:opacity .7s ease, transform .7s ease; }
.reveal.in-view{ opacity:1; transform:none; }
@media(prefers-reduced-motion:reduce){
  .reveal{ opacity:1; transform:none; transition:none; }
}

/* ===== stats strip ===== */
.stats-strip{ background:var(--porcelain); border-top:1px solid var(--stone); border-bottom:1px solid var(--stone); }
.stats-grid{ display:grid; grid-template-columns:repeat(4,1fr); }
.stat-item{ padding:34px 20px; text-align:center; border-inline-start:1px solid var(--stone); }
.stat-item:first-child{ border-inline-start:none; }
.stat-num{ font-family:'Fraunces',serif; font-size:34px; font-weight:500; color:var(--brass); letter-spacing:0.01em; }
body.lang-fa .stat-num{ font-family:'Vazirmatn',sans-serif; }
.stat-label{ font-size:12.5px; color:var(--text-muted); margin-top:6px; letter-spacing:0.04em; text-transform:uppercase; }
body.lang-fa .stat-label{ text-transform:none; letter-spacing:0; font-size:13px; }

/* ===== draggable before/after slider ===== */
.g-item .frame{ cursor:ew-resize; user-select:none; -webkit-user-select:none; }
.frame-inner{ position:relative; }
.ba-after{ transition:clip-path .05s linear; }
.frame .ba-handle{ cursor:ew-resize; }
.frame input[type=range]{ position:relative; z-index:3; cursor:ew-resize; }

/* ===== testimonials ===== */
.testimonials{ background:var(--deep); color:var(--porcelain); }
.testimonials .eyebrow{ color:var(--brass-soft); }
.testimonials .eyebrow::before{ background:var(--brass-soft); }
.testimonials .section-head h2{ color:var(--porcelain); }
.testimonials .section-head p{ color:#A8A499; }
.testi-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:rgba(238,233,225,0.14); }
.testi-card{ background:var(--deep); padding:32px 28px; }
.testi-quote{ font-family:'Fraunces',serif; font-style:italic; font-size:17px; line-height:1.6; color:#EAE6DC; }
body.lang-fa .testi-quote{ font-family:'Vazirmatn',sans-serif; font-style:normal; font-size:15.5px; }
.testi-stars{ color:var(--brass-soft); font-size:13px; letter-spacing:2px; margin-bottom:14px; }
.testi-name{ margin-top:18px; font-size:12.5px; color:#A8A499; letter-spacing:0.04em; }
.testi-name b{ color:var(--brass-soft); font-weight:500; }

/* ===== sticky mobile CTA ===== */
.mobile-cta-bar{ display:none; }
@media(max-width:760px){
  .mobile-cta-bar{
    display:flex; position:fixed; bottom:0; left:0; right:0; z-index:150;
    background:var(--ink); border-top:1px solid rgba(238,233,225,0.14);
    padding:10px 14px calc(10px + env(safe-area-inset-bottom)); gap:10px;
  }
  .mobile-cta-bar a{ flex:1; text-align:center; padding:12px 10px; border-radius:12px; font-size:13.5px; }
  body{ padding-bottom:66px; }
}

/* ===== instagram tile icon ===== */
.ig-tile{ display:flex; align-items:center; justify-content:center; }
.ig-tile svg{ width:22px; height:22px; opacity:0.32; }

/* drawer services accordion (mobile) */
.nav-drawer-panel details{ border-bottom:1px solid var(--stone); padding-bottom:10px; }
.nav-drawer-panel details summary{
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between;
  font-size:17px; color:var(--text-on-light); padding-bottom:10px;
}
.nav-drawer-panel details summary::-webkit-details-marker{ display:none; }
.nav-drawer-panel details summary .acc-icon{ font-size:18px; color:var(--brass); transition:transform .3s; }
.nav-drawer-panel details[open] summary .acc-icon{ transform:rotate(45deg); }
.nav-drawer-panel .drawer-submenu{ display:flex; flex-direction:column; gap:2px; padding-bottom:12px; }
.nav-drawer-panel .drawer-submenu-group{ font-size:11px; letter-spacing:0.05em; color:var(--brass); margin-top:10px; }
.nav-drawer-panel .drawer-submenu a{ font-size:14.5px; border-bottom:none; padding:6px 0 6px 14px; color:var(--text-muted); }

@media(max-width:900px){
  .hero-grid, .about-grid, .booking-grid{ grid-template-columns:1fr; }
  .pillar-grid{ grid-template-columns:1fr; }
  .svc-grid{ grid-template-columns:repeat(2,1fr); }
  .g-grid{ grid-template-columns:repeat(2,1fr); }
  .ig-grid{ grid-template-columns:repeat(3,1fr); }
  .contact-grid{ grid-template-columns:1fr; }
  .related-grid{ grid-template-columns:repeat(2,1fr); }
  .stats-grid{ grid-template-columns:repeat(2,1fr); }
  .stat-item:nth-child(3){ border-inline-start:none; }
  .testi-grid{ grid-template-columns:1fr; }
  nav.links{ display:none; }
  .hamburger{ display:flex; }
  .hero h1{ font-size:36px; }
  .blog-hero h1{ font-size:28px; }
  .section-head h2{ font-size:28px !important; }
}

/* ================= ADMIN DASHBOARD ================= */
.admin-body{ background:var(--porcelain); min-height:100vh; }
.admin-login-wrap{
  min-height:100vh; display:flex; align-items:center; justify-content:center; padding:24px;
}
.admin-login-card{
  width:100%; max-width:380px; background:#fff; border:1px solid var(--stone); border-radius:18px;
  padding:40px 34px; box-shadow:0 24px 60px -28px rgba(21,24,26,0.25);
}
.admin-login-card .logo-mark{ width:44px; height:44px; color:var(--brass); margin-bottom:18px; }
.admin-login-card h1{ font-family:'Fraunces',serif; font-size:22px; font-weight:500; margin-bottom:6px; }
.admin-login-card p.sub{ color:var(--text-muted); font-size:13.5px; margin-bottom:26px; }
.admin-field{ margin-bottom:16px; }
.admin-field label{ display:block; font-size:12.5px; color:var(--text-muted); margin-bottom:6px; }
.admin-field input, .admin-field textarea, .admin-field select{
  width:100%; padding:11px 14px; border:1px solid var(--stone); border-radius:10px; font-size:14px;
  font-family:inherit; background:#fff; color:var(--ink);
}
.admin-field input:focus, .admin-field textarea:focus, .admin-field select:focus{ outline:2px solid var(--brass); outline-offset:1px; border-color:var(--brass); }
.admin-error{ background:#FCEBEA; color:#B3261E; border:1px solid #F3C6C3; padding:10px 14px; border-radius:10px; font-size:13px; margin-bottom:16px; display:none; }
.admin-btn{
  width:100%; padding:12px; border-radius:10px; border:none; background:var(--ink); color:var(--porcelain);
  font-size:14.5px; font-weight:500; cursor:pointer; transition:opacity .2s;
}
.admin-btn:hover{ opacity:0.88; }
.admin-btn:disabled{ opacity:0.5; cursor:not-allowed; }

.admin-shell{ display:flex; min-height:100vh; }
.admin-sidebar{
  width:230px; flex-shrink:0; background:var(--deep); color:var(--porcelain); padding:26px 18px;
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh;
}
.admin-sidebar .brand-row{ padding:0 8px 26px; border-bottom:1px solid rgba(238,233,225,0.14); margin-bottom:20px; }
.admin-sidebar .logo-mark{ width:30px; height:30px; }
.admin-sidebar .brand{ font-size:13.5px; }
.admin-nav{ display:flex; flex-direction:column; gap:4px; flex:1; }
.admin-nav button{
  display:flex; align-items:center; gap:10px; padding:11px 12px; border-radius:10px; border:none;
  background:transparent; color:#C9C4B8; font-size:14px; text-align:right; cursor:pointer; width:100%;
  font-family:inherit; transition:background .2s, color .2s;
}
.admin-nav button svg{ width:17px; height:17px; opacity:0.7; flex-shrink:0; }
.admin-nav button:hover{ background:rgba(238,233,225,0.08); color:#fff; }
.admin-nav button.active{ background:rgba(199,168,122,0.16); color:var(--brass-soft); }
.admin-signout{ margin-top:auto; padding-top:16px; border-top:1px solid rgba(238,233,225,0.14); }
.admin-signout button{
  width:100%; padding:10px 12px; border-radius:10px; border:1px solid rgba(238,233,225,0.2);
  background:transparent; color:#C9C4B8; font-size:13px; cursor:pointer; font-family:inherit;
}
.admin-signout button:hover{ color:#fff; border-color:rgba(238,233,225,0.4); }

.admin-main{ flex:1; padding:36px 40px; max-width:1100px; }
.admin-topbar{ display:flex; align-items:center; justify-content:space-between; margin-bottom:28px; }
.admin-topbar h2{ font-family:'Fraunces',serif; font-size:24px; font-weight:500; }
.admin-panel{ display:none; }
.admin-panel.active{ display:block; }

.admin-stat-row{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; margin-bottom:30px; }
.admin-stat-card{ background:#fff; border:1px solid var(--stone); border-radius:14px; padding:20px; }
.admin-stat-card .num{ font-family:'Fraunces',serif; font-size:28px; color:var(--brass); font-weight:500; }
.admin-stat-card .label{ font-size:12.5px; color:var(--text-muted); margin-top:4px; }

.admin-table-wrap{ background:#fff; border:1px solid var(--stone); border-radius:14px; overflow:hidden; }
table.admin-table{ width:100%; border-collapse:collapse; font-size:13.5px; }
table.admin-table th{ text-align:right; padding:12px 16px; background:var(--porcelain); border-bottom:1px solid var(--stone); font-weight:500; color:var(--text-muted); font-size:12px; }
table.admin-table td{ padding:12px 16px; border-bottom:1px solid var(--stone); vertical-align:top; }
table.admin-table tr:last-child td{ border-bottom:none; }
.status-badge{ display:inline-block; padding:3px 10px; border-radius:12px; font-size:11.5px; font-weight:500; }
.status-new{ background:#FDF1DC; color:#9A6B12; }
.status-contacted{ background:#E4EEF9; color:#2A5C9A; }
.status-confirmed{ background:#E4F3E8; color:#256B3D; }
.status-cancelled{ background:#F5E5E4; color:#A13B32; }
.admin-table select.status-select{ font-size:12.5px; padding:5px 8px; border-radius:8px; border:1px solid var(--stone); background:#fff; }
.admin-empty{ padding:40px; text-align:center; color:var(--text-muted); font-size:14px; }

.admin-card{ background:#fff; border:1px solid var(--stone); border-radius:14px; padding:24px; margin-bottom:20px; }
.admin-card h3{ font-family:'Fraunces',serif; font-size:16px; font-weight:500; margin-bottom:16px; }
.admin-testi-item{ border:1px solid var(--stone); border-radius:10px; padding:16px; margin-bottom:12px; position:relative; }
.admin-testi-item .remove-btn{ position:absolute; top:12px; left:12px; background:none; border:none; color:#A13B32; cursor:pointer; font-size:13px; }
.page-row{
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:13px 4px; border-bottom:1px solid var(--stone);
}
.page-row:last-child{ border-bottom:none; }
.page-row .page-row-title{ font-size:14px; font-weight:500; }
.page-row .page-row-sub{ font-size:12px; color:var(--text-muted); margin-top:2px; }
.page-row .page-row-actions{ display:flex; gap:8px; flex-shrink:0; }
.page-row-actions button, .page-row-actions a{
  font-size:12.5px; padding:6px 14px; border-radius:8px; border:1px solid var(--stone);
  background:transparent; color:var(--ink); cursor:pointer; text-decoration:none; font-family:inherit;
}
.page-row-actions button:hover, .page-row-actions a:hover{ background:var(--porcelain); }
.pill-badge{ display:inline-block; font-size:10.5px; padding:2px 8px; border-radius:10px; background:var(--porcelain); color:var(--text-muted); margin-inline-start:8px; }
.admin-toast{
  position:fixed; bottom:24px; left:50%; transform:translateX(-50%) translateY(20px); opacity:0;
  background:var(--ink); color:var(--porcelain); padding:12px 22px; border-radius:30px; font-size:13.5px;
  transition:opacity .3s, transform .3s; z-index:500; pointer-events:none;
}
.admin-toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }

@media(max-width:820px){
  .admin-shell{ flex-direction:column; }
  .admin-sidebar{ position:static; height:auto; width:100%; flex-direction:row; overflow-x:auto; padding:14px; }
  .admin-sidebar .brand-row{ display:none; }
  .admin-nav{ flex-direction:row; }
  .admin-signout{ margin-top:0; padding-top:0; border-top:none; margin-inline-start:auto; }
  .admin-main{ padding:22px 18px; }
  .admin-stat-row{ grid-template-columns:repeat(2,1fr); }
  table.admin-table{ font-size:12.5px; }
}