/* ============================================================
   VERA — Luxury Aesthetic Clinic
   RAJ Design DNA · Editorial · Textured · Cinematic
   ============================================================ */

/* ---------- RESET ---------- */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
body{font-family:var(--font-body);background:var(--color-bg);color:var(--color-text);line-height:1.7;overflow-x:hidden}
img,svg{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font-family:inherit;cursor:pointer;border:0;background:transparent;color:inherit}
input,select,textarea{font-family:inherit}
ul{list-style:none}
::selection{background:var(--color-accent);color:#fff}

/* ---------- DESIGN TOKENS ---------- */
:root{
  /* Brand palette — Luxury Aesthetic Clinic */
  --color-bg:       #f6f0e8;   /* warm ivory */
  --color-bg-deep:  #efe5d7;
  --color-surface:  #fbf7f1;
  --color-surface-2:#efe3d1;
  --color-text:     #2a1f18;
  --color-muted:    #7a6859;
  --color-border:   rgba(42,31,24,.08);
  --color-primary:  #8a6a4f;   /* mink taupe */
  --color-primary-dark:#5e4632;
  --color-secondary:#b8906f;   /* warm champagne */
  --color-accent:   #c49890;   /* muted rose */
  --color-gold:     #c9a46c;
  --color-dark:     #1c140f;
  --color-success:  #6b8e6f;
  --color-warning:  #c9915a;

  /* Typography */
  --font-body:    'Vazirmatn', system-ui, sans-serif;
  --font-display: 'Cormorant Garamond', 'Vazirmatn', serif;
  --font-accent:  'DM Sans', 'Vazirmatn', sans-serif;

  /* Spacing */
  --space-1:.4rem; --space-2:.8rem; --space-3:1.2rem;
  --space-4:1.8rem; --space-5:2.4rem; --space-6:3.2rem;
  --space-8:5rem; --space-10:7rem; --space-12:10rem;

  /* Radius */
  --radius-sm:6px; --radius-md:12px; --radius-lg:20px; --radius-pill:999px;

  /* Shadows */
  --shadow-sm:0 1px 2px rgba(42,31,24,.05);
  --shadow-md:0 12px 40px -12px rgba(42,31,24,.15);
  --shadow-lg:0 30px 80px -20px rgba(42,31,24,.25);

  /* Motion */
  --ease-standard:cubic-bezier(.2,.7,.2,1);
  --ease-emphasis:cubic-bezier(.19,1,.22,1);

  /* Container */
  --container:1280px;

  /* Header */
  --nav-h:74px;
}

/* ---------- GLOBAL ---------- */
.container{max-width:var(--container);margin:0 auto;padding:0 clamp(1rem,4vw,2.5rem)}
section{padding:clamp(5rem,10vw,8rem) 0;position:relative}
em{font-family:var(--font-display);font-weight:400;font-style:italic;color:var(--color-primary-dark)}

h1,h2,h3,h4{font-family:var(--font-body);font-weight:600;line-height:1.2;color:var(--color-text);letter-spacing:-.02em}
h3{font-size:1.35rem;font-weight:500}
h4{font-size:1.1rem;font-weight:500}
p{color:var(--color-muted);font-size:.98rem;line-height:1.85}

/* Outline text */
.outline{
  -webkit-text-stroke:1.5px var(--color-text);
  color:transparent;
  font-family:var(--font-display);
  font-weight:600;
}
.outline-light{
  -webkit-text-stroke:1.5px var(--color-primary-dark);
  color:transparent;
  font-family:var(--font-display);
  font-weight:600;
}

/* Display sizes */
.display-xl{
  font-size:clamp(2.8rem,7.5vw,6rem);
  font-weight:600;
  line-height:1.02;
  letter-spacing:-.035em;
}
.display-lg{
  font-size:clamp(2rem,4.5vw,3.8rem);
  font-weight:600;
  line-height:1.1;
  letter-spacing:-.025em;
}

.lead{font-size:clamp(1rem,1.2vw,1.15rem);color:var(--color-muted);max-width:52ch;margin-top:var(--space-4);line-height:2}

/* ---------- GRAIN TEXTURE ---------- */
.grain{
  position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.25;mix-blend-mode:multiply;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='200' height='200'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 0.1  0 0 0 0 0.08  0 0 0 0 0.05  0 0 0 0.12 0'/></filter><rect width='100%25' height='100%25' filter='url(%23n)'/></svg>");
}

/* ---------- BUTTONS ---------- */
.btn-primary,.btn-ghost,.btn-line{
  display:inline-flex;align-items:center;gap:.5rem;justify-content:center;
  padding:.85rem 1.5rem;border-radius:var(--radius-pill);font-size:.92rem;font-weight:500;
  transition:all .35s var(--ease-standard);white-space:nowrap;position:relative;overflow:hidden;
}
.btn-primary{background:var(--color-dark);color:#f6f0e8}
.btn-primary:hover{background:var(--color-primary-dark);transform:translateY(-1px);box-shadow:var(--shadow-md)}
.btn-primary svg{transition:transform .3s var(--ease-standard)}
.btn-primary:hover svg{transform:translateX(-3px)}

.btn-ghost{border:1px solid var(--color-border);color:var(--color-text);background:transparent}
.btn-ghost:hover{border-color:var(--color-text);background:var(--color-text);color:var(--color-bg)}

.btn-line{padding:.6rem 0;color:var(--color-primary-dark);border-bottom:1px solid var(--color-primary-dark);border-radius:0;font-size:.88rem;gap:.35rem}
.btn-line:hover{gap:.7rem;color:var(--color-accent);border-color:var(--color-accent)}
.btn-line::after{content:"→";font-family:var(--font-display);font-size:1.1rem;transition:transform .3s}

.btn-lg{padding:1.05rem 2rem;font-size:.98rem}
.btn-block{width:100%}

/* ---------- SECTION LABELS ---------- */
.section-label{display:inline-flex;align-items:center;gap:.8rem;font-size:.78rem;letter-spacing:.2em;text-transform:uppercase;color:var(--color-muted);margin-bottom:var(--space-5)}
.section-label .num{font-family:var(--font-display);font-style:italic;font-size:1rem;color:var(--color-primary)}
.section-label::after{content:"";width:40px;height:1px;background:var(--color-border)}

.section-head{text-align:center;margin-bottom:clamp(3rem,6vw,5rem)}
.section-head--left{text-align:start}
.section-desc{color:var(--color-muted);max-width:56ch;margin:1.2rem auto 0;font-size:1.02rem}
.section-head--left .section-desc{margin-right:0}

/* ---------- REVEAL ANIMATION ---------- */
.reveal{opacity:0;transform:translateY(24px);transition:opacity .9s var(--ease-standard),transform .9s var(--ease-standard)}
.reveal.in-view{opacity:1;transform:none}

/* ========== NAV ========== */
.nav{position:fixed;top:0;right:0;left:0;z-index:100;height:var(--nav-h);transition:all .4s var(--ease-standard)}
.nav.scrolled{background:rgba(246,240,232,.85);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid var(--color-border)}
.nav__inner{display:flex;align-items:center;justify-content:space-between;height:100%;gap:var(--space-4)}
.logo{display:flex;flex-direction:column;align-items:center;line-height:.9}
.logo__fa{font-size:1.35rem;font-weight:600;letter-spacing:-.02em}
.logo__en{font-family:var(--font-accent);font-size:.6rem;letter-spacing:.4em;color:var(--color-muted);margin-top:2px}
.logo--lg .logo__fa{font-size:2.2rem}.logo--lg .logo__en{font-size:.72rem}
.nav__links{display:flex;gap:2rem;font-size:.92rem}
.nav__links a{position:relative;color:var(--color-text);transition:color .3s}
.nav__links a::after{content:"";position:absolute;bottom:-4px;right:0;width:0;height:1px;background:var(--color-primary-dark);transition:width .4s var(--ease-standard)}
.nav__links a:hover{color:var(--color-primary-dark)}
.nav__links a:hover::after{width:100%;right:auto;left:0}
.nav__actions{display:flex;align-items:center;gap:.75rem}
.nav__actions .btn-ghost{padding:.6rem 1.1rem;font-size:.85rem}
.nav__actions .btn-primary{padding:.6rem 1.1rem;font-size:.85rem}
.nav__burger{display:none;flex-direction:column;gap:4px;width:34px;height:34px;align-items:center;justify-content:center}
.nav__burger span{width:20px;height:1.5px;background:var(--color-text);transition:transform .3s,opacity .3s;border-radius:2px}
.nav__burger.open span:nth-child(1){transform:translateY(5.5px) rotate(45deg)}
.nav__burger.open span:nth-child(2){opacity:0}
.nav__burger.open span:nth-child(3){transform:translateY(-5.5px) rotate(-45deg)}

.mobile-menu{
  position:fixed;top:var(--nav-h);right:0;left:0;
  background:rgba(246,240,232,.97);backdrop-filter:blur(16px);
  padding:1.5rem 1.5rem 2.5rem;display:flex;flex-direction:column;gap:1.3rem;
  transform:translateY(-10px);opacity:0;pointer-events:none;transition:all .35s var(--ease-standard);
  border-bottom:1px solid var(--color-border);
}
.mobile-menu.open{transform:none;opacity:1;pointer-events:auto}
.mobile-menu a{font-size:1.05rem;padding:.5rem 0;border-bottom:1px solid var(--color-border)}
.mobile-cta{margin-top:1rem;text-align:center}

/* ========== HERO ========== */
.hero{min-height:100vh;padding-top:calc(var(--nav-h) + 3rem);padding-bottom:0;position:relative;overflow:hidden}
.hero__art{position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.hero__shape{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4}
.shape-1{width:500px;height:500px;background:radial-gradient(circle,#d6bfa8,transparent 60%);top:-100px;right:-100px}
.shape-2{width:400px;height:400px;background:radial-gradient(circle,#d8c2b8,transparent 60%);bottom:-100px;left:-100px;opacity:.35}
.shape-3{width:300px;height:300px;background:radial-gradient(circle,#c9a46c33,transparent 60%);top:40%;left:40%}
.hero__light{position:absolute;inset:0;background:radial-gradient(ellipse at 70% 30%,rgba(255,245,230,.6),transparent 50%)}

.hero__grid{position:relative;z-index:1;display:grid;grid-template-columns:1.1fr .9fr;gap:clamp(2rem,6vw,5rem);align-items:center;padding-bottom:clamp(3rem,6vw,6rem)}

.eyebrow{display:inline-flex;align-items:center;gap:.6rem;font-size:.8rem;letter-spacing:.15em;color:var(--color-muted);margin-bottom:1.5rem}
.dot{width:7px;height:7px;border-radius:50%;background:var(--color-accent);box-shadow:0 0 0 0 rgba(196,152,144,.6);animation:pulse 2.4s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(196,152,144,.6)}70%{box-shadow:0 0 0 10px rgba(196,152,144,0)}100%{box-shadow:0 0 0 0 rgba(196,152,144,0)}}

.hero__ctas{display:flex;gap:.9rem;margin-top:var(--space-6);flex-wrap:wrap}

.hero__stats{display:flex;gap:clamp(1.5rem,4vw,3rem);margin-top:clamp(3rem,6vw,5rem);padding-top:var(--space-5);border-top:1px solid var(--color-border)}
.hero__stats div{position:relative}
.hero__stats div+div::before{content:"";position:absolute;right:-1.5rem;top:50%;transform:translateY(-50%);width:1px;height:30px;background:var(--color-border)}
.stat__num{font-family:var(--font-display);font-size:clamp(1.6rem,3vw,2.4rem);font-weight:500;color:var(--color-text);display:inline-block}
.stat__plus{font-family:var(--font-display);font-size:1.4rem;color:var(--color-primary);font-weight:500}
.hero__stats p{font-size:.78rem;color:var(--color-muted);margin-top:.2rem}

/* Hero visual */
.hero__visual{position:relative;height:600px}
.hero__card{position:absolute;background:var(--color-surface);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);overflow:hidden;border:1px solid var(--color-border)}
.hero__card--main{right:5%;top:0;width:340px;height:480px;animation:floaty 6s ease-in-out infinite}
.hero__img-wrap{position:relative;width:100%;height:100%}
.hero__portrait{width:100%;height:100%;object-fit:cover}
.hero__img-overlay{position:absolute;inset:0;background:linear-gradient(180deg,transparent 50%,rgba(28,20,15,.25))}
.hero__card-tag{position:absolute;bottom:1rem;right:1rem;left:1rem;display:flex;align-items:center;gap:.5rem;background:rgba(251,247,241,.9);backdrop-filter:blur(8px);padding:.55rem .9rem;border-radius:var(--radius-pill);font-size:.8rem;color:var(--color-text)}
.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--color-success);box-shadow:0 0 0 0 rgba(107,142,111,.5);animation:pulse 2s infinite}
.hero__card--badge{top:40px;left:-10px;width:170px;padding:1.2rem;background:var(--color-dark);color:var(--color-bg);animation:floaty 6s ease-in-out infinite .5s}
.badge__label{display:block;font-size:.65rem;letter-spacing:.15em;text-transform:uppercase;color:var(--color-gold);margin-bottom:.35rem}
.badge__title{font-family:var(--font-display);font-size:.95rem;line-height:1.2;color:var(--color-bg)}
.hero__card--rating{bottom:30px;left:20px;padding:1rem 1.2rem;display:flex;flex-direction:column;gap:.3rem;animation:floaty 6s ease-in-out infinite 1s}
.stars{display:flex;gap:2px;color:var(--color-gold)}
.stars svg{width:14px;height:14px}
.rating__num{font-family:var(--font-display);font-size:1.4rem;font-weight:500;color:var(--color-text);line-height:1}
.rating__txt{font-size:.7rem;color:var(--color-muted)}

@keyframes floaty{0%,100%{transform:translateY(0)}50%{transform:translateY(-12px)}}

/* Marquee */
.marquee{margin-top:2rem;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);padding:1rem 0;overflow:hidden;background:var(--color-bg-deep);position:relative;z-index:1}
.marquee__track{display:flex;gap:2.5rem;white-space:nowrap;animation:scroll 40s linear infinite;font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--color-primary-dark)}
.dot-sep{color:var(--color-accent);opacity:.5}
@keyframes scroll{0%{transform:translateX(50%)}100%{transform:translateX(-50%)}}

/* ========== PHILOSOPHY ========== */
.philosophy{background:linear-gradient(180deg,var(--color-bg),var(--color-bg-deep))}
.philosophy__grid{display:grid;grid-template-columns:1.2fr .9fr;gap:clamp(2rem,6vw,5rem);align-items:center}
.philosophy__text p{margin-top:var(--space-5);max-width:55ch}
.philosophy__pillars{margin-top:var(--space-6);display:grid;grid-template-columns:1fr 1fr 1fr;gap:var(--space-4)}
.pillar__num{font-family:var(--font-display);font-style:italic;font-size:1.1rem;color:var(--color-accent);display:block;margin-bottom:.4rem}
.philosophy__pillars h4{margin-bottom:.3rem;font-size:.98rem}
.philosophy__pillars p{margin-top:0;font-size:.85rem;line-height:1.7}

.philosophy__visual{position:relative;height:520px}
.ph-card{position:absolute;border-radius:var(--radius-lg);padding:1.5rem;background:var(--color-surface);box-shadow:var(--shadow-md);border:1px solid var(--color-border)}
.ph-card--1{top:20px;right:0;width:230px}
.ph-card--2{top:200px;left:0;width:210px}
.ph-card--3{bottom:0;right:40px;width:260px;height:240px;padding:0;overflow:hidden}
.ph-tag{display:block;font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;color:var(--color-muted);margin-bottom:.3rem}
.ph-name{font-family:var(--font-display);font-size:1.4rem;color:var(--color-primary-dark);display:block;margin-bottom:.2rem}
.ph-meta{font-size:.75rem;color:var(--color-muted)}
.ph-chair{width:100%;height:100%;background:linear-gradient(145deg,#e9d8c3 0%,#c4a98b 100%);position:relative}
.ph-chair::before{content:"";position:absolute;inset:20%;border-radius:50% 50% 30% 30%;background:linear-gradient(180deg,#f0e2cf,#b8906f);box-shadow:inset 0 -20px 40px rgba(0,0,0,.1)}
.ph-chair::after{content:"";position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:70%;height:15%;background:linear-gradient(180deg,transparent,rgba(42,31,24,.15));border-radius:0 0 50% 50%/0 0 30% 30%}

/* ========== SERVICES ========== */
.services{background:var(--color-bg-deep)}
.services__tabs{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-bottom:var(--space-6);padding:.4rem;background:var(--color-surface);border-radius:var(--radius-pill);border:1px solid var(--color-border);max-width:fit-content;margin-inline:auto}
.tab{padding:.7rem 1.4rem;border-radius:var(--radius-pill);font-size:.9rem;color:var(--color-muted);transition:all .3s var(--ease-standard)}
.tab.active{background:var(--color-dark);color:var(--color-bg)}
.tab:hover:not(.active){color:var(--color-text)}

.services__panel{display:none}.services__panel.active{display:block;animation:fadeUp .5s var(--ease-standard)}
@keyframes fadeUp{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}

.service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.3rem}
.service-card{background:var(--color-surface);border-radius:var(--radius-lg);padding:2rem;border:1px solid var(--color-border);position:relative;transition:all .4s var(--ease-standard);display:flex;flex-direction:column}
.service-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg);border-color:rgba(138,106,79,.2)}
.service-card__num{font-family:var(--font-display);font-style:italic;font-size:.9rem;color:var(--color-accent);margin-bottom:.7rem}
.service-card h3{font-size:1.35rem;margin-bottom:.6rem;color:var(--color-text)}
.service-card p{font-size:.9rem;margin-bottom:1rem}
.service-card ul{margin-bottom:1.2rem;flex:1}
.service-card ul li{font-size:.82rem;color:var(--color-muted);padding:.25rem 0;border-bottom:1px dashed var(--color-border);position:relative;padding-right:.9rem}
.service-card ul li::before{content:"";position:absolute;right:0;top:50%;width:4px;height:4px;border-radius:50%;background:var(--color-accent);transform:translateY(-50%)}
.service-card__price{font-size:.82rem;color:var(--color-muted);margin-bottom:1.2rem;padding-top:.8rem;border-top:1px solid var(--color-border)}
.service-card__price span{font-family:var(--font-display);font-size:1.2rem;color:var(--color-primary-dark);font-weight:500;margin-right:.3rem}
.service-card .btn-line{align-self:flex-start;margin-top:auto}

.service-card--featured{background:var(--color-dark);color:var(--color-bg);border-color:transparent}
.service-card--featured h3,.service-card--featured .service-card__price span{color:var(--color-bg)}
.service-card--featured p,.service-card--featured ul li,.service-card--featured .service-card__price{color:rgba(246,240,232,.7)}
.service-card--featured ul li{border-color:rgba(246,240,232,.1)}
.service-card--featured ul li::before{background:var(--color-gold)}
.service-card--featured .btn-line{color:var(--color-gold);border-color:var(--color-gold)}
.service-card--featured:hover{background:var(--color-primary-dark)}

.ribbon{position:absolute;top:1.2rem;left:1.2rem;background:var(--color-gold);color:var(--color-dark);font-size:.7rem;font-weight:500;padding:.25rem .7rem;border-radius:var(--radius-pill);letter-spacing:.05em}

/* ========== BEFORE / AFTER GALLERY ========== */
.gallery{background:var(--color-bg)}
.ba-chooser{display:flex;gap:.5rem;justify-content:center;flex-wrap:wrap;margin-bottom:var(--space-6)}
.ba-pill{padding:.55rem 1.2rem;border:1px solid var(--color-border);border-radius:var(--radius-pill);font-size:.85rem;color:var(--color-muted);background:var(--color-surface);transition:all .3s}
.ba-pill:hover{color:var(--color-text);border-color:var(--color-primary)}
.ba-pill.active{background:var(--color-dark);color:var(--color-bg);border-color:var(--color-dark)}

.ba-wrap{
  position:relative;max-width:700px;margin:0 auto;border-radius:var(--radius-lg);overflow:hidden;
  aspect-ratio:4/5;box-shadow:var(--shadow-lg);user-select:none;cursor:ew-resize;background:var(--color-dark);
}
.ba-before,.ba-after{position:absolute;inset:0;height:100%}
.ba-after{overflow:hidden;width:50%;border-right:2px solid var(--color-bg);box-shadow:4px 0 20px rgba(0,0,0,.2)}
.ba-face{width:100%;height:100%;position:relative;overflow:hidden}
.ba-face::after{content:"";position:absolute;inset:0;background:linear-gradient(160deg,transparent 40%,rgba(0,0,0,.1))}
.ba-face--before{background:linear-gradient(145deg,#8a6a4f,#5e4632);background-image:
  radial-gradient(ellipse at 50% 35%,#c9a98f 0%,#a88870 40%,#6e4f3a 100%);
}
.ba-face--before::before{
  content:"";position:absolute;top:18%;left:50%;transform:translateX(-50%);
  width:40%;aspect-ratio:.75;border-radius:50% 50% 45% 45%;
  background:radial-gradient(ellipse at 50% 30%,#d9bda3 0%,#c4a588 50%,#8a6a4f 100%);
  box-shadow:0 30px 60px rgba(0,0,0,.25);
}
/* add under-eye circles / lines */
.ba-face--before::after{
  background:
    radial-gradient(ellipse at 38% 38%,rgba(70,40,20,.35) 0%,transparent 10%),
    radial-gradient(ellipse at 62% 38%,rgba(70,40,20,.35) 0%,transparent 10%),
    radial-gradient(ellipse at 50% 50%,rgba(120,80,60,.2) 0%,transparent 30%),
    linear-gradient(160deg,transparent 40%,rgba(0,0,0,.15));
}

.ba-face--after{background:linear-gradient(145deg,#d6b896,#a88870);background-image:
  radial-gradient(ellipse at 50% 35%,#f0dcc6 0%,#e6cbb0 40%,#c4a588 100%);
}
.ba-face--after::before{
  content:"";position:absolute;top:16%;left:50%;transform:translateX(-50%);
  width:40%;aspect-ratio:.75;border-radius:50% 50% 45% 45%;
  background:radial-gradient(ellipse at 50% 30%,#f9ebe0 0%,#ecd9c4 50%,#d6b896 100%);
  box-shadow:0 20px 50px rgba(0,0,0,.15),inset 0 -10px 20px rgba(255,240,220,.3);
}
.ba-face--after::after{
  background:
    radial-gradient(ellipse at 38% 40%,rgba(200,140,120,.25) 0%,transparent 8%),
    radial-gradient(ellipse at 62% 40%,rgba(200,140,120,.25) 0%,transparent 8%),
    linear-gradient(160deg,transparent 40%,rgba(0,0,0,.08));
}

/* Varying faces via data-face — using hue shift */
.ba-face[data-face="1"]{filter:hue-rotate(-10deg) saturate(.95)}
.ba-face[data-face="2"]{filter:hue-rotate(15deg) saturate(1.05)}
.ba-face[data-face="3"]{filter:saturate(.85) brightness(1.05)}

.ba-label{
  position:absolute;top:1rem;right:1rem;background:rgba(28,20,15,.65);backdrop-filter:blur(6px);
  color:#f6f0e8;padding:.4rem .9rem;border-radius:var(--radius-pill);font-size:.78rem;letter-spacing:.1em;z-index:2
}
.ba-label--after{right:auto;left:1rem;background:rgba(201,164,108,.85);color:var(--color-dark)}
.ba-handle{
  position:absolute;top:0;bottom:0;left:50%;width:44px;transform:translateX(-50%);
  display:flex;align-items:center;justify-content:center;cursor:ew-resize;z-index:3
}
.ba-handle::before{content:"";position:absolute;left:50%;top:0;bottom:0;width:2px;background:var(--color-bg);box-shadow:0 0 10px rgba(0,0,0,.3)}
.ba-handle svg{width:34px;height:34px;background:var(--color-bg);color:var(--color-dark);border-radius:50%;padding:.45rem;box-shadow:var(--shadow-lg);transition:transform .2s}
.ba-handle:hover svg,.ba-handle.dragging svg{transform:scale(1.12)}

.ba-note{text-align:center;font-size:.78rem;color:var(--color-muted);margin-top:1.3rem}

/* ========== EXPERIENCE ========== */
.experience{background:var(--color-bg-deep)}
.experience__grid{display:grid;grid-template-columns:1.3fr .9fr;grid-template-rows:auto auto;gap:1.3rem}
.exp-card{background:var(--color-surface);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border);transition:transform .4s var(--ease-standard),box-shadow .4s}
.exp-card:hover{transform:translateY(-4px);box-shadow:var(--shadow-md)}
.exp-card--lg{grid-row:span 2}
.exp-card--wide{grid-column:2 / -1}
.exp-card__img{width:100%;height:220px;background-size:cover;background-position:center;position:relative;overflow:hidden}
.exp-card--lg .exp-card__img{height:100%;min-height:450px}
.exp-card--wide .exp-card__img{height:180px}
.exp-card__body{padding:1.5rem 1.8rem}
.exp-card__num{font-family:var(--font-display);font-style:italic;font-size:.9rem;color:var(--color-accent);display:block;margin-bottom:.4rem}
.exp-card__body h3{margin-bottom:.4rem}
.exp-card__body p{font-size:.88rem}

.exp-img-lobby{background:linear-gradient(135deg,#c9a98f 0%,#8a6a4f 100%);position:relative}
.exp-img-lobby::before{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(28,20,15,.3) 0%,transparent 40%),
  repeating-linear-gradient(90deg,transparent 0,transparent 80px,rgba(255,255,255,.04) 80px,rgba(255,255,255,.04) 82px),
  radial-gradient(ellipse at 70% 60%,rgba(201,164,108,.4),transparent 60%);
}
.exp-img-lobby::after{content:"";position:absolute;bottom:0;left:10%;width:80%;height:40%;border-radius:50% 50% 0 0;background:linear-gradient(180deg,transparent,rgba(28,20,15,.2));box-shadow:0 -10px 40px rgba(28,20,15,.15)}
.exp-img-consult{background:linear-gradient(135deg,#d4b89a,#a88870);position:relative}
.exp-img-consult::before{content:"";position:absolute;inset:20% 15%;background:radial-gradient(ellipse,rgba(255,245,230,.3),transparent 60%);border-radius:var(--radius-md)}
.exp-img-treatment{background:linear-gradient(135deg,#e8d5c4,#c9a98f);position:relative}
.exp-img-treatment::before{content:"";position:absolute;top:20%;left:30%;width:40%;height:60%;border-radius:var(--radius-lg);background:linear-gradient(180deg,rgba(255,255,255,.3),rgba(201,164,108,.2));box-shadow:0 10px 30px rgba(0,0,0,.08)}
.exp-img-vip{background:linear-gradient(135deg,#8a6a4f,#3a2518);position:relative}
.exp-img-vip::before{content:"";position:absolute;inset:0;background:radial-gradient(ellipse at 30% 50%,rgba(201,164,108,.3),transparent 60%)}

/* ========== TEAM ========== */
.team{background:var(--color-bg)}
.team__grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:1.5rem}
.doctor-card{background:var(--color-surface);border-radius:var(--radius-lg);overflow:hidden;border:1px solid var(--color-border);transition:transform .4s,box-shadow .4s}
.doctor-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-lg)}
.doctor-card__photo{height:320px;background-size:cover;background-position:center;position:relative}
.doctor-card__photo::after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 60%,rgba(42,31,24,.25))}
.doctor-photo-1{background:linear-gradient(160deg,#e8d0c0 0%,#c9a48a 60%,#8a6a4f 100%);position:relative}
.doctor-photo-1::before{content:"";position:absolute;top:20%;left:50%;transform:translateX(-50%);width:55%;aspect-ratio:.8;border-radius:50% 50% 40% 40%;background:radial-gradient(ellipse at 50% 30%,#f5e2d0,#d9bb9f);box-shadow:0 20px 40px rgba(0,0,0,.15)}
.doctor-photo-2{background:linear-gradient(160deg,#b89878 0%,#6e4f3a 100%);position:relative}
.doctor-photo-2::before{content:"";position:absolute;top:20%;left:50%;transform:translateX(-50%);width:55%;aspect-ratio:.8;border-radius:50% 50% 40% 40%;background:radial-gradient(ellipse at 50% 30%,#d9bda3,#a8856b);box-shadow:0 20px 40px rgba(0,0,0,.2)}
.doctor-photo-3{background:linear-gradient(160deg,#f0dcc8 0%,#c4a088 60%,#8a6a4f 100%);position:relative}
.doctor-photo-3::before{content:"";position:absolute;top:20%;left:50%;transform:translateX(-50%);width:55%;aspect-ratio:.8;border-radius:50% 50% 40% 40%;background:radial-gradient(ellipse at 50% 30%,#fae8d7,#e0c0a5);box-shadow:0 20px 40px rgba(0,0,0,.15)}
.doctor-photo-4{background:linear-gradient(160deg,#c9a98f 0%,#6e4f3a 100%);position:relative}
.doctor-photo-4::before{content:"";position:absolute;top:20%;left:50%;transform:translateX(-50%);width:55%;aspect-ratio:.8;border-radius:50% 50% 40% 40%;background:radial-gradient(ellipse at 50% 30%,#e6c9ad,#b8906f);box-shadow:0 20px 40px rgba(0,0,0,.2)}
.doctor-card__body{padding:1.5rem 1.8rem 1.8rem}
.doctor-card__role{font-size:.72rem;letter-spacing:.18em;text-transform:uppercase;color:var(--color-accent);display:block;margin-bottom:.5rem}
.doctor-card h3{margin-bottom:.5rem}
.doctor-card p{font-size:.88rem;margin-bottom:1rem}
.doctor-card__spec{display:flex;flex-wrap:wrap;gap:.4rem}
.doctor-card__spec li{font-size:.75rem;padding:.25rem .65rem;border-radius:var(--radius-pill);background:var(--color-bg-deep);color:var(--color-muted)}

.badges-bar{margin-top:var(--space-8);padding:2rem;border-top:1px solid var(--color-border);border-bottom:1px solid var(--color-border);text-align:center}
.badges-bar__title{font-size:.8rem;letter-spacing:.15em;text-transform:uppercase;color:var(--color-muted);margin-bottom:1.3rem}
.badges-bar__logos{display:flex;flex-wrap:wrap;justify-content:center;gap:clamp(1.5rem,4vw,3rem);align-items:center}
.badges-bar__logos span{font-family:var(--font-display);font-size:1.3rem;font-style:italic;color:var(--color-primary-dark);opacity:.6;transition:opacity .3s}
.badges-bar__logos span:hover{opacity:1}

/* ========== TESTIMONIALS ========== */
.testimonials{background:var(--color-dark);color:var(--color-bg);overflow:hidden}
.testimonials .section-label{color:rgba(246,240,232,.5)}
.testimonials .section-label::after{background:rgba(246,240,232,.2)}
.testimonials h2{color:var(--color-bg)}
.testimonials em{color:var(--color-gold)}
.testimonials .outline-light{-webkit-text-stroke-color:rgba(246,240,232,.8);color:transparent}

.testimonials__slider{position:relative;margin-top:var(--space-6)}
.test-track{display:flex;gap:1.5rem;transition:transform .6s var(--ease-emphasis);padding:.5rem .2rem}
.test-card{flex:0 0 calc(100% / 2.6);min-width:300px;background:rgba(246,240,232,.05);border:1px solid rgba(246,240,232,.08);border-radius:var(--radius-lg);padding:2rem;transition:border-color .3s}
.test-card:hover{border-color:rgba(201,164,108,.3)}
.test-card blockquote{font-family:var(--font-display);font-size:1.15rem;line-height:1.9;color:var(--color-bg);font-style:italic;margin-bottom:1.5rem}
.test-card blockquote::before{content:"\201C";font-size:3rem;color:var(--color-gold);line-height:.5;display:block;margin-bottom:.5rem;font-family:var(--font-display)}
.test-name{display:block;font-size:.95rem;color:var(--color-bg);font-weight:500}
.test-meta{font-size:.78rem;color:rgba(246,240,232,.5);margin-top:.2rem;display:block}

.test-nav{position:absolute;top:50%;width:46px;height:46px;border-radius:50%;background:var(--color-bg);color:var(--color-dark);display:flex;align-items:center;justify-content:center;transform:translateY(-50%);box-shadow:var(--shadow-md);z-index:2;transition:all .3s}
.test-nav:hover{background:var(--color-gold);transform:translateY(-50%) scale(1.08)}
.test-prev{right:-10px}
.test-next{left:-10px}
.test-dots{display:flex;gap:.4rem;justify-content:center;margin-top:2rem}
.test-dots button{width:8px;height:8px;border-radius:50%;background:rgba(246,240,232,.2);transition:all .3s}
.test-dots button.active{background:var(--color-gold);width:22px;border-radius:var(--radius-pill)}

/* ========== JOURNEY ========== */
.journey{background:var(--color-bg)}
.journey__steps{display:grid;grid-template-columns:repeat(4,1fr);gap:1.5rem;position:relative}
.journey__steps::before{
  content:"";position:absolute;top:36px;right:10%;left:10%;height:1px;background:var(--color-border);z-index:0
}
.step{position:relative;z-index:1;text-align:center}
.step__num{
  width:72px;height:72px;border-radius:50%;background:var(--color-surface);border:1px solid var(--color-border);
  display:flex;align-items:center;justify-content:center;margin:0 auto 1.2rem;
  font-family:var(--font-display);font-style:italic;font-size:1.4rem;color:var(--color-primary-dark);
  box-shadow:var(--shadow-sm);transition:all .4s var(--ease-standard)
}
.step:hover .step__num{background:var(--color-dark);color:var(--color-gold);border-color:var(--color-dark);transform:translateY(-4px);box-shadow:var(--shadow-md)}
.step h4{margin-bottom:.5rem}
.step p{font-size:.88rem}

/* ========== FAQ ========== */
.faq{background:var(--color-bg-deep)}
.faq__grid{display:grid;grid-template-columns:1fr 1.4fr;gap:clamp(2rem,6vw,5rem);align-items:start}
.faq__head p{margin:1.2rem 0 2rem;font-size:1rem;max-width:36ch}
.faq__list{display:flex;flex-direction:column;gap:.7rem}
.faq__list details{background:var(--color-surface);border-radius:var(--radius-md);border:1px solid var(--color-border);overflow:hidden;transition:border-color .3s}
.faq__list details[open]{border-color:var(--color-primary)}
.faq__list summary{
  list-style:none;padding:1.3rem 1.5rem;display:flex;align-items:center;justify-content:space-between;
  gap:1rem;cursor:pointer;font-weight:500;font-size:.98rem;user-select:none
}
.faq__list summary::-webkit-details-marker{display:none}
.faq-icon{
  width:28px;height:28px;border-radius:50%;background:var(--color-bg-deep);
  display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;
  font-size:1.1rem;color:var(--color-primary-dark);transition:all .3s;font-family:var(--font-display)
}
.faq__list details[open] .faq-icon{background:var(--color-dark);color:var(--color-gold);transform:rotate(45deg)}
.faq-body{padding:0 1.5rem 1.4rem;font-size:.92rem;color:var(--color-muted);line-height:1.9}

/* ========== BOOKING CTA ========== */
.booking-cta{background:linear-gradient(180deg,var(--color-bg-deep) 0%,var(--color-bg) 100%)}
.booking-cta__inner{display:grid;grid-template-columns:1.4fr 1fr;gap:clamp(2rem,6vw,4rem);align-items:start}
.booking-form{margin-top:var(--space-5);background:var(--color-surface);border-radius:var(--radius-lg);padding:clamp(1.5rem,3vw,2.5rem);border:1px solid var(--color-border);box-shadow:var(--shadow-sm)}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem}
.booking-form label{display:block;margin-bottom:1rem}
.booking-form label span{display:block;font-size:.82rem;letter-spacing:.05em;color:var(--color-muted);margin-bottom:.4rem;font-weight:500}
.booking-form input,.booking-form select,.booking-form textarea{
  width:100%;padding:.9rem 1.1rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);
  background:var(--color-bg);font-size:.95rem;color:var(--color-text);transition:all .25s;
  font-family:inherit
}
.booking-form input:focus,.booking-form select:focus,.booking-form textarea:focus{
  outline:none;border-color:var(--color-primary);box-shadow:0 0 0 3px rgba(138,106,79,.1)
}
.booking-form textarea{resize:vertical;min-height:80px}
.form-note{font-size:.78rem;color:var(--color-muted);margin-top:.9rem;text-align:center}

.booking-cta__side{display:flex;flex-direction:column;gap:1rem;margin-top:calc(var(--space-5) + 4.2rem)}
.side-block{background:var(--color-surface);padding:1.5rem 1.8rem;border-radius:var(--radius-md);border:1px solid var(--color-border)}
.side-block__label{font-size:.72rem;letter-spacing:.2em;text-transform:uppercase;color:var(--color-accent);display:block;margin-bottom:.6rem}
.side-block p{color:var(--color-text);font-size:.92rem;line-height:1.9}
.side-big{font-family:var(--font-display);font-size:1.6rem !important;color:var(--color-primary-dark) !important;direction:ltr;text-align:right;margin-bottom:.2rem}
.side-meta{font-size:.85rem !important}
.side-block--social{display:flex;gap:.6rem}
.social-btn{flex:1;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.9rem;border-radius:var(--radius-sm);border:1px solid var(--color-border);color:var(--color-text);font-size:.88rem;transition:all .3s}
.social-btn:hover{background:var(--color-dark);color:var(--color-bg);border-color:var(--color-dark)}

/* ========== FOOTER ========== */
.footer{background:var(--color-dark);color:rgba(246,240,232,.7);padding:4rem 0 1.5rem}
.footer__top{display:grid;grid-template-columns:1.5fr 1fr 1fr 1fr;gap:2.5rem;padding-bottom:3rem;border-bottom:1px solid rgba(246,240,232,.08)}
.footer__brand p{color:rgba(246,240,232,.5);margin-top:1rem;max-width:30ch;font-size:.9rem}
.footer .logo__fa{color:var(--color-bg)}.footer .logo__en{color:var(--color-gold)}
.footer__col h5{color:var(--color-bg);font-size:.82rem;letter-spacing:.18em;text-transform:uppercase;margin-bottom:1.2rem;font-weight:500}
.footer__col a,.footer__col p{display:block;color:rgba(246,240,232,.55);font-size:.88rem;margin-bottom:.6rem;transition:color .3s}
.footer__col a:hover{color:var(--color-gold)}
.footer__bottom{display:flex;justify-content:space-between;align-items:center;padding-top:1.5rem;font-size:.8rem;color:rgba(246,240,232,.4);flex-wrap:wrap;gap:.5rem}
.heart{color:var(--color-accent)}

/* ========== MODAL ========== */
.modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:1rem}
.modal.open{display:flex;animation:modalIn .35s var(--ease-standard)}
@keyframes modalIn{from{opacity:0}to{opacity:1}}
.modal__backdrop{position:absolute;inset:0;background:rgba(28,20,15,.6);backdrop-filter:blur(6px)}
.modal__panel{position:relative;background:var(--color-surface);border-radius:var(--radius-lg);padding:2.5rem;width:100%;max-width:440px;box-shadow:var(--shadow-lg);border:1px solid var(--color-border);animation:modalSlide .4s var(--ease-emphasis)}
@keyframes modalSlide{from{opacity:0;transform:translateY(20px) scale(.96)}to{opacity:1;transform:none}}
.modal__close{position:absolute;top:1rem;left:1rem;width:36px;height:36px;border-radius:50%;background:var(--color-bg-deep);display:flex;align-items:center;justify-content:center;transition:all .3s}
.modal__close:hover{background:var(--color-dark);color:var(--color-bg)}
.modal h3{font-size:1.5rem;margin-bottom:.4rem}
.modal__sub{font-size:.9rem;color:var(--color-muted);margin-bottom:1.5rem}
.modal-form label{display:block;margin-bottom:.9rem}
.modal-form label span{display:block;font-size:.8rem;color:var(--color-muted);margin-bottom:.4rem}
.modal-form input,.modal-form select{width:100%;padding:.8rem 1rem;border:1px solid var(--color-border);border-radius:var(--radius-sm);background:var(--color-bg);font-size:.92rem}
.modal-form input:focus,.modal-form select:focus{outline:none;border-color:var(--color-primary)}

/* ========== TOAST ========== */
.toast{position:fixed;bottom:2rem;right:2rem;background:var(--color-dark);color:var(--color-bg);padding:.9rem 1.3rem;border-radius:var(--radius-md);display:flex;align-items:center;gap:.7rem;font-size:.9rem;box-shadow:var(--shadow-lg);z-index:300;transform:translateY(100px);opacity:0;transition:all .4s var(--ease-emphasis);border:1px solid rgba(201,164,108,.3)}
.toast.show{transform:none;opacity:1}
.toast svg{color:var(--color-success);flex-shrink:0}

/* ========== RESPONSIVE ========== */
@media (max-width: 1024px){
  .hero__grid{grid-template-columns:1fr;gap:3rem}
  .hero__visual{height:520px;max-width:400px;margin:0 auto;width:100%}
  .philosophy__grid{grid-template-columns:1fr}
  .philosophy__visual{height:400px;max-width:480px}
  .experience__grid{grid-template-columns:1fr 1fr;grid-template-rows:auto}
  .exp-card--lg{grid-row:auto}
  .exp-card--wide{grid-column:auto}
  .journey__steps{grid-template-columns:repeat(2,1fr);gap:2rem}
  .journey__steps::before{display:none}
  .booking-cta__inner{grid-template-columns:1fr}
  .booking-cta__side{margin-top:0}
  .test-card{flex:0 0 calc(100% / 1.6)}
  .footer__top{grid-template-columns:1fr 1fr;gap:2rem}
}

@media (max-width: 640px){
  :root{--nav-h:64px}
  .nav__links{display:none}
  .nav__actions .btn-ghost{display:none}
  .nav__burger{display:flex}
  .hero{padding-top:calc(var(--nav-h) + 1.5rem)}
  .display-xl{font-size:clamp(2.4rem,9vw,3.4rem)}
  .display-lg{font-size:clamp(1.8rem,6vw,2.4rem)}
  .hero__visual{height:440px}
  .hero__card--main{width:260px;height:380px}
  .hero__card--badge{width:140px;padding:1rem}
  .hero__card--rating{padding:.8rem 1rem;bottom:10px}
  .hero__stats{gap:1.5rem}
  .hero__stats div+div::before{display:none}
  .philosophy__pillars{grid-template-columns:1fr}
  .form-row{grid-template-columns:1fr}
  .faq__grid{grid-template-columns:1fr}
  .experience__grid{grid-template-columns:1fr}
  .exp-card--lg .exp-card__img{min-height:280px;height:220px}
  .team__grid{grid-template-columns:1fr}
  .doctor-card__photo{height:380px}
  .journey__steps{grid-template-columns:1fr 1fr}
  .test-card{flex:0 0 85%}
  .test-prev{right:40%}
  .test-next{left:auto;right:calc(40% + 50px)}
  .footer__top{grid-template-columns:1fr;text-align:center}
  .toast{right:1rem;left:1rem;bottom:1rem}
  .philosophy__visual{height:320px}
  .ph-card--1{width:180px;right:0}
  .ph-card--2{width:180px;left:0;top:160px}
  .ph-card--3{width:200px;height:180px;right:10px;bottom:0}
}

/* ========== REDUCED MOTION ========== */
@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{animation-duration:.01ms !important;animation-iteration-count:1 !important;transition-duration:.01ms !important;scroll-behavior:auto !important}
  .reveal{opacity:1;transform:none}
  .marquee__track{animation:none}
  .hero__card{animation:none}
}

/* ========== FOCUS (accessibility) ========== */
:focus-visible{outline:2px solid var(--color-primary);outline-offset:3px;border-radius:var(--radius-sm)}
button:focus-visible,a:focus-visible{border-radius:var(--radius-pill)}
