/* ===========================================================
   Dr. Sara Bayou — Design Tokens
   =========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Fraunces:ital,opsz,wght@0,9..144,300;0,9..144,400;0,9..144,500;0,9..144,600;1,9..144,400;1,9..144,500&family=Inter:wght@400;500;600;700&family=IBM+Plex+Mono:wght@400;500&family=Cairo:wght@400;500;600;700&family=Aref+Ruqaa:wght@400;700&display=swap');

:root{
  /* color */
  --cream:      #FAF6F0;
  --cream-dim:  #F1EAE0;
  --pine:       #1F3B36;
  --pine-700:   #162B27;
  --blush:      #E893A0;
  --blush-dim:  #F5CBD3;
  --rose-deep:  #C15C74;
  --sage:       #B7C9B4;
  --sage-dim:   #DCE6DA;
  --ink:        #231F1C;
  --ink-soft:   #5B564F;
  --line:       rgba(35,31,28,0.12);

  /* type */
  --font-display: 'Fraunces', Georgia, serif;
  --font-body: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --font-display-ar: 'Aref Ruqaa', 'Cairo', serif;
  --font-body-ar: 'Cairo', -apple-system, sans-serif;

  /* scale */
  --step--1: clamp(0.8rem, 0.78rem + 0.1vw, 0.875rem);
  --step-0:  clamp(1rem, 0.96rem + 0.2vw, 1.125rem);
  --step-1:  clamp(1.25rem, 1.18rem + 0.35vw, 1.5rem);
  --step-2:  clamp(1.6rem, 1.45rem + 0.75vw, 2.1rem);
  --step-3:  clamp(2.1rem, 1.8rem + 1.5vw, 3.2rem);
  --step-4:  clamp(2.8rem, 2.2rem + 3vw, 4.8rem);

  --space-1: 0.5rem;
  --space-2: 1rem;
  --space-3: 1.5rem;
  --space-4: 2.5rem;
  --space-5: 4rem;
  --space-6: 6.5rem;

  --radius: 22px;
  --radius-sm: 12px;

  --rosegold: #D9A6A0;
  --rosegold-dim: #F1D9D3;

  --ease: cubic-bezier(.25,.8,.4,1);
}

/* ---------- Arabic / RTL support ---------- */
html[lang="ar"] body{
  font-family:'Cairo', 'Inter', sans-serif;
}
html[lang="ar"] h1, html[lang="ar"] h2, html[lang="ar"] h3, html[lang="ar"] h4{
  font-family:'Aref Ruqaa', 'Cairo', serif;
  font-weight:700;
}
html[dir="rtl"]{direction:rtl;}
html[dir="rtl"] .list-check li{flex-direction:row-reverse; text-align:right;}
html[dir="rtl"] .timeline{border-left:none; border-right:1px solid var(--line); padding-left:0; padding-right:var(--space-3);}
html[dir="rtl"] .nav-links a.active::after{left:auto; right:0;}
html[dir="rtl"] .footer-bottom{flex-direction:row-reverse;}
html[dir="rtl"] .form-note{text-align:right;}
html[dir="rtl"] .field input, html[dir="rtl"] .field textarea, html[dir="rtl"] .field select{text-align:right;}
html[dir="rtl"] .stat, html[dir="rtl"] .card .num{unicode-bidi:isolate;}

*{box-sizing:border-box;}
html{scroll-behavior:smooth;}
body{
  margin:0;
  background:var(--cream);
  color:var(--ink);
  font-family:var(--font-body);
  font-size:var(--step-0);
  line-height:1.6;
  -webkit-font-smoothing:antialiased;
}
img{max-width:100%;display:block;}
a{color:inherit;}

h1,h2,h3,h4{
  font-family:var(--font-display);
  font-weight:500;
  line-height:1.08;
  margin:0 0 var(--space-2);
  letter-spacing:-0.01em;
}
h1{font-size:var(--step-4); font-weight:400;}
h2{font-size:var(--step-3); font-weight:400;}
h3{font-size:var(--step-2);}
p{margin:0 0 var(--space-2); color:var(--ink-soft); max-width:60ch;}

em{font-style:italic; color:var(--rosegold); font-family:var(--font-display);}

.flourish{
  display:inline-block; width:60px; height:14px;
  margin:0 6px;
}
.flourish path{fill:none; stroke:var(--rosegold); stroke-width:1.6; stroke-linecap:round;}

.eyebrow{
  font-family:var(--font-mono);
  font-size:var(--step--1);
  text-transform:uppercase;
  letter-spacing:0.12em;
  color:var(--pine);
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:var(--space-2);
}
.eyebrow::before{
  content:'';
  width:22px; height:1px;
  background:var(--blush);
}

.wrap{
  max-width:1180px;
  margin:0 auto;
  padding:0 var(--space-3);
}

/* ---------- Header ---------- */
.site-header{
  position:sticky; top:0; z-index:50;
  background:rgba(250,246,240,0.86);
  backdrop-filter:blur(10px);
  border-bottom:1px solid var(--line);
}
.nav{
  display:flex; align-items:center; justify-content:space-between;
  padding:var(--space-2) var(--space-3);
  max-width:1180px; margin:0 auto;
  gap:var(--space-2);
}
.brand{
  display:flex; align-items:center; gap:10px;
  font-family:var(--font-display);
  font-size:var(--step-1);
  text-decoration:none;
  color:var(--ink);
  min-height:44px;
  flex-shrink:0;
}
.brand svg{width:30px; height:30px; flex-shrink:0;}
.brand-icon{
  position:relative; display:inline-flex; align-items:center; justify-content:center;
  width:30px; height:30px; flex-shrink:0;
}
.brand-icon img{
  width:100%; height:100%; object-fit:contain; position:absolute; inset:0;
}
.brand-icon svg{position:relative;}
.nav-links{
  display:flex; gap:var(--space-4);
  list-style:none; margin:0; padding:0;
  font-size:var(--step--1);
  font-weight:500;
}
.nav-links a{
  text-decoration:none;
  position:relative;
  padding-bottom:4px;
  color:var(--ink-soft);
  transition:color .2s var(--ease);
}
.nav-links a:hover, .nav-links a.active{color:var(--pine);}
.nav-links a.active::after{
  content:'';
  position:absolute; left:0; right:0; bottom:-2px;
  height:2px; background:var(--blush); border-radius:2px;
}
.nav-cta{
  display:inline-flex; align-items:center; gap:8px;
  background:var(--pine); color:var(--cream);
  padding:12px 22px; border-radius:100px;
  text-decoration:none; font-size:var(--step--1); font-weight:600;
  transition:transform .25s var(--ease), background .25s var(--ease);
  min-height:44px; box-sizing:border-box;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
  white-space:nowrap;
}
.nav-cta:hover{background:var(--pine-700); transform:translateY(-1px);}
.nav-toggle{display:none;}

@media (max-width:860px){
  .nav-links{
    position:fixed; inset:64px 0 0 0; background:var(--cream);
    flex-direction:column; align-items:flex-start; padding:var(--space-4) var(--space-3);
    gap:var(--space-3); font-size:var(--step-1);
    transform:translateX(100%); transition:transform .35s var(--ease);
    overflow-y:auto; z-index:49;
  }
  html[dir="rtl"] .nav-links{transform:translateX(-100%);}
  .nav-links.open{transform:translateX(0);}
  .nav-links a{
    display:flex; align-items:center; min-height:44px; width:100%;
  }
  .nav-toggle{
    display:flex; flex-direction:column; align-items:center; justify-content:center;
    background:none; border:none; cursor:pointer;
    width:44px; height:44px; padding:0; touch-action:manipulation;
    -webkit-tap-highlight-color:transparent;
  }
  .nav-toggle span{
    display:block; width:22px; height:2px; background:var(--ink); margin:3px 0;
    transition:transform .25s var(--ease), opacity .25s var(--ease);
  }
  .nav-toggle[aria-expanded="true"] span:nth-child(1){transform:translateY(5px) rotate(45deg);}
  .nav-toggle[aria-expanded="true"] span:nth-child(2){opacity:0;}
  .nav-toggle[aria-expanded="true"] span:nth-child(3){transform:translateY(-5px) rotate(-45deg);}
}

@media (min-width:861px){
  .nav-links{display:flex;}
}

/* ---------- Smile arc signature ---------- */
.smile-divider{
  display:block; width:100%; height:auto;
  margin: var(--space-2) 0;
}
.smile-divider path{
  fill:none; stroke:var(--blush); stroke-width:2;
  stroke-linecap:round;
}

/* ---------- Buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:10px;
  padding:14px 28px; border-radius:100px;
  text-decoration:none; font-weight:600; font-size:var(--step--1);
  border:1px solid transparent; cursor:pointer;
  transition:transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
  min-height:48px; box-sizing:border-box;
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.btn-primary{background:var(--pine); color:var(--cream); box-shadow:0 0 0 0 rgba(217,166,160,0.55);}
.btn-primary:hover{background:var(--pine-700); transform:translateY(-3px) scale(1.02); box-shadow:0 10px 26px -10px rgba(31,59,54,0.5);}
.btn-primary:active{transform:translateY(-1px) scale(0.99);}
.btn-outline{border-color:var(--pine); color:var(--pine);}
.btn-outline:hover{background:var(--pine); color:var(--cream); transform:translateY(-3px) scale(1.02); box-shadow:0 10px 26px -10px rgba(31,59,54,0.4);}
.btn-outline:active{transform:translateY(-1px) scale(0.99);}
.nav-cta:hover{transform:translateY(-2px) scale(1.03);}

/* ---------- Lang toggle ---------- */
.lang-toggle{
  font-family:var(--font-mono); font-size:var(--step--1); font-weight:600;
  border:1px solid var(--line); background:transparent; color:var(--ink);
  padding:8px 14px; min-height:40px; border-radius:100px; cursor:pointer; margin-inline-end:10px;
  transition:all .25s var(--ease);
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.lang-toggle:hover{border-color:var(--pine); color:var(--pine); background:var(--sage-dim);}

/* ---------- WhatsApp float button ---------- */
.whatsapp-float{
  position:fixed; bottom:22px; inset-inline-end:22px; z-index:40;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 26px -8px rgba(0,0,0,0.35);
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.whatsapp-float:hover{transform:scale(1.1) translateY(-2px); box-shadow:0 14px 32px -8px rgba(0,0,0,0.4);}
.whatsapp-float:active{transform:scale(0.96);}
.whatsapp-float svg{width:30px; height:30px;}
@media (max-width:600px){
  .whatsapp-float{
    width:52px; height:52px;
    bottom:calc(16px + env(safe-area-inset-bottom, 0px));
    inset-inline-end:16px;
  }
  .whatsapp-float svg{width:26px; height:26px;}
}

/* ---------- Photo / image placeholders ---------- */
.photo-frame{
  border-radius:var(--radius); overflow:hidden; background:var(--sage-dim);
  aspect-ratio:4/5; display:flex; align-items:center; justify-content:center;
  position:relative;
}
.photo-frame img{width:100%; height:100%; object-fit:cover;}
.photo-frame.square{aspect-ratio:1/1;}
.photo-frame.wide{aspect-ratio:16/10;}
.photo-frame .ph-fallback{
  font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft); text-align:center; padding:1rem;
}

/* ---------- Map embed ---------- */
.map-embed{
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  aspect-ratio:4/3;
}
.map-embed iframe{width:100%; height:100%; border:0;}
.btn:focus-visible, a:focus-visible, .nav-toggle:focus-visible{
  outline:2px solid var(--pine); outline-offset:3px;
}

/* ---------- Hero ---------- */
.hero{
  padding:var(--space-6) 0 var(--space-5);
  position:relative; overflow:hidden;
}
.hero-grid{
  display:grid; grid-template-columns:1.1fr 0.9fr; gap:var(--space-5);
  align-items:center;
}
.hero h1{margin-bottom:var(--space-3);}
.hero-actions{display:flex; gap:var(--space-2); align-items:center; flex-wrap:wrap; margin-top:var(--space-3);}
.hero-note{font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft);}
/* ---------- Hero background video ---------- */
.hero-bg{
  position:absolute; inset:0; z-index:0;
  background:linear-gradient(135deg, var(--sage-dim), var(--cream-dim)) center/cover;
  overflow:hidden;
}
.hero-bg video{
  position:absolute; inset:0;
  width:100%; height:100%;
  object-fit:cover;
}
.hero-bg .hero-bg-overlay{
  position:absolute; inset:0;
  background:linear-gradient(100deg, var(--cream) 28%, rgba(250,246,240,0.86) 52%, rgba(250,246,240,0.35) 100%);
}
.hero .wrap.hero-grid{position:relative; z-index:1;}
.hero-art{position:relative;}

@media (max-width:760px){
  .hero-bg video{display:none;}
  .hero-bg .hero-bg-overlay{
    background:linear-gradient(180deg, rgba(250,246,240,0.75), var(--cream) 78%);
  }
}
@media (prefers-reduced-motion:reduce){
  .hero-bg video{display:none;}
}
.hero-art .arc-bg{
  position:absolute; inset:-10%;
  background:radial-gradient(circle at 70% 30%, var(--sage-dim), transparent 60%);
  z-index:0;
}
.hero-photo{
  position:relative; z-index:1;
  border-radius:var(--radius);
  overflow:hidden;
  aspect-ratio:4/5;
  background:var(--sage-dim);
  display:flex; align-items:center; justify-content:center;
}
@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr; }
  .hero-art{order:-1; max-width:340px; margin:0 auto var(--space-3);}
}

/* ---------- Sections ---------- */
section{padding:var(--space-5) 0;}
.section-head{max-width:640px; margin-bottom:var(--space-4);}

/* ---------- Cards ---------- */
.card-grid{
  display:grid; grid-template-columns:repeat(3,1fr); gap:var(--space-3);
}
@media (max-width:900px){ .card-grid{grid-template-columns:1fr;} }
.card{
  background:var(--cream-dim);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:var(--space-3);
  transition:transform .3s var(--ease), box-shadow .3s var(--ease);
}
.card:hover{transform:translateY(-4px); box-shadow:0 18px 40px -24px rgba(31,59,54,0.35);}
.card .num{
  font-family:var(--font-mono); font-size:var(--step--1); color:var(--blush);
  display:block; margin-bottom:var(--space-1);
}
.card h3{font-size:var(--step-1); margin-bottom:8px;}
.card p{margin-bottom:0; font-size:var(--step--1);}

/* ---------- Stats strip ---------- */
.stats{
  display:grid; grid-template-columns:repeat(4,1fr); gap:var(--space-3);
  border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  padding:var(--space-4) 0;
}
@media (max-width:760px){ .stats{grid-template-columns:1fr 1fr;} }
.stat b{
  font-family:var(--font-display); font-size:var(--step-3); font-weight:400;
  display:block; color:var(--pine);
}
.stat span{font-size:var(--step--1); color:var(--ink-soft);}

/* ---------- Testimonial ---------- */
.testimonial{
  background:var(--pine); color:var(--cream);
  border-radius:var(--radius);
  padding:var(--space-5) var(--space-4);
  position:relative;
}
.testimonial blockquote{
  font-family:var(--font-display); font-size:var(--step-2); font-weight:400;
  margin:0 0 var(--space-2); max-width:44ch; font-style:italic;
}
.testimonial cite{font-style:normal; font-family:var(--font-mono); font-size:var(--step--1); opacity:0.75;}

/* ---------- CTA band ---------- */
.cta-band{
  background:var(--sage-dim);
  border-radius:var(--radius);
  padding:var(--space-5);
  display:flex; align-items:center; justify-content:space-between; gap:var(--space-3);
  flex-wrap:wrap;
}
.cta-band h2{margin-bottom:4px;}

/* ---------- Footer ---------- */
.site-footer{
  background:var(--pine-700); color:var(--sage-dim);
  padding:var(--space-5) 0 var(--space-3);
  margin-top:var(--space-5);
}
.footer-grid{
  display:grid; grid-template-columns:1.4fr 1fr 1fr; gap:var(--space-4);
  padding-bottom:var(--space-4); border-bottom:1px solid rgba(255,255,255,0.12);
}
@media (max-width:760px){ .footer-grid{grid-template-columns:1fr;} }
.site-footer h4{color:var(--cream); font-size:var(--step-0); font-family:var(--font-mono); text-transform:uppercase; letter-spacing:0.08em; font-weight:500;}
.site-footer a{color:var(--sage-dim); text-decoration:none; opacity:0.85;}
.site-footer a:hover{opacity:1; color:var(--blush);}
.site-footer ul{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:8px;}
.footer-bottom{
  display:flex; justify-content:space-between; padding-top:var(--space-2);
  font-size:var(--step--1); flex-wrap:wrap; gap:8px; opacity:0.65;
  font-family:var(--font-mono);
}

/* ---------- Page hero (inner pages) ---------- */
.page-hero{
  padding:var(--space-5) 0 var(--space-4);
  border-bottom:1px solid var(--line);
}
.page-hero .eyebrow{margin-bottom:var(--space-2);}

/* ---------- Reveal on scroll ---------- */
.reveal{opacity:0; transform:translateY(16px); transition:opacity .7s var(--ease), transform .7s var(--ease);}
.reveal.in{opacity:1; transform:none;}

@media (prefers-reduced-motion:reduce){
  .reveal{opacity:1; transform:none; transition:none;}
  html{scroll-behavior:auto;}
}

/* ---------- Misc pages: services / about / contact ---------- */
.two-col{display:grid; grid-template-columns:1fr 1fr; gap:var(--space-5); align-items:start;}
@media (max-width:860px){ .two-col{grid-template-columns:1fr;} }

.list-check{list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:12px;}
.list-check li{display:flex; gap:10px; align-items:flex-start; color:var(--ink-soft);}
.list-check svg{flex:none; margin-top:3px;}

.timeline{border-left:1px solid var(--line); padding-left:var(--space-3); display:flex; flex-direction:column; gap:var(--space-3);}
.timeline .item .time{font-family:var(--font-mono); font-size:var(--step--1); color:var(--blush);}

.form-card{
  background:var(--cream-dim); border:1px solid var(--line); border-radius:var(--radius);
  padding:var(--space-4);
}
.field{margin-bottom:var(--space-2);}
.field label{display:block; font-size:var(--step--1); font-weight:600; margin-bottom:6px;}
.field input, .field textarea, .field select{
  width:100%; padding:13px 14px; border-radius:var(--radius-sm);
  border:1px solid var(--line); background:var(--cream); font-family:var(--font-body); font-size:16px;
  color:var(--ink); min-height:48px; box-sizing:border-box;
  touch-action:manipulation;
}
.field textarea{resize:vertical; min-height:110px;}
.field input:focus, .field textarea:focus, .field select:focus{
  outline:2px solid var(--pine); outline-offset:1px; border-color:var(--pine);
}
.form-note{font-size:var(--step--1); color:var(--ink-soft); margin-top:var(--space-2);}

.map-card{
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  aspect-ratio:4/3; background:var(--sage-dim);
  display:flex; align-items:center; justify-content:center;
  font-family:var(--font-mono); font-size:var(--step--1); color:var(--ink-soft);
}

.badge-row{display:flex; gap:var(--space-2); flex-wrap:wrap; margin-top:var(--space-3);}
.badge{
  font-family:var(--font-mono); font-size:var(--step--1);
  border:1px solid var(--line); border-radius:100px; padding:8px 16px;
  color:var(--ink-soft);
}

/* ---------- Social icons ---------- */
.social-row{
  display:flex; gap:10px; margin-top:var(--space-2);
}
.social-icon{
  width:40px; height:40px; border-radius:50%;
  display:flex; align-items:center; justify-content:center;
  background:rgba(255,255,255,0.08);
  border:1px solid rgba(255,255,255,0.18);
  transition:transform .25s var(--ease), background .25s var(--ease), border-color .25s var(--ease);
  touch-action:manipulation; -webkit-tap-highlight-color:transparent;
}
.social-icon svg{width:18px; height:18px; fill:var(--sage-dim); transition:fill .25s var(--ease);}
.social-icon:hover{
  transform:translateY(-3px) scale(1.08);
  background:var(--rosegold);
  border-color:var(--rosegold);
}
.social-icon:hover svg{fill:var(--pine-700);}
.social-icon:active{transform:translateY(-1px) scale(0.98);}

/* ---------- Heading glow (font effect: bigger + color shift) ---------- */
.heading-glow{
  display:inline-block;
  transform-origin:left center;
  animation:heading-glow-anim 5s ease-in-out infinite;
}
html[dir="rtl"] .heading-glow{transform-origin:right center;}
@keyframes heading-glow-anim{
  0%, 100%{ color:var(--pine); transform:scale(1); }
  50%{ color:var(--rosegold); transform:scale(1.035); }
}
@media (prefers-reduced-motion:reduce){
  .heading-glow{animation:none;}
}

/* ---------- Floating 2D tooth animation ---------- */
.floating-tooth{
  position:absolute;
  animation:tooth-float 4.5s ease-in-out infinite;
  filter:drop-shadow(0 10px 18px rgba(31,59,54,0.18));
  pointer-events:none;
}
@keyframes tooth-float{
  0%, 100%{ transform:translateY(0) rotate(-4deg); }
  50%{ transform:translateY(-16px) rotate(4deg); }
}
.sparkle{
  position:absolute;
  animation:sparkle-pulse 2.2s ease-in-out infinite;
  pointer-events:none;
}
.sparkle.delay1{animation-delay:.6s;}
.sparkle.delay2{animation-delay:1.2s;}
@keyframes sparkle-pulse{
  0%, 100%{ opacity:0.2; transform:scale(0.7); }
  50%{ opacity:1; transform:scale(1.15); }
}
@media (prefers-reduced-motion:reduce){
  .floating-tooth, .sparkle{animation:none;}
}

/* ===========================================================
   Responsive rhythm — small mobile (<=480px) & tablet (<=760px)
   =========================================================== */
@media (max-width:400px){
  .brand span{display:none;}
  .nav-cta{padding:11px 16px; font-size:11px;}
}

@media (max-width:480px){
  :root{
    --space-4: 2rem;
    --space-5: 3rem;
    --space-6: 4rem;
  }
  .wrap{padding:0 var(--space-2);}
  .hero{padding:var(--space-4) 0 var(--space-4);}
  .hero-actions{flex-direction:column; align-items:stretch;}
  .hero-actions .btn{width:100%;}
  .stats{grid-template-columns:1fr 1fr; gap:var(--space-2);}
  .card-grid{gap:var(--space-2);}
  .cta-band{flex-direction:column; align-items:flex-start; padding:var(--space-4);}
  .cta-band .btn{width:100%; justify-content:center;}
  .testimonial{padding:var(--space-4) var(--space-3);}
  .testimonial blockquote{font-size:var(--step-1);}
  .site-footer{padding:var(--space-4) 0 var(--space-2);}
  .footer-bottom{flex-direction:column; align-items:flex-start; gap:6px;}
  .nav-cta span, .nav-cta{font-size:12px; padding:11px 14px;}
}

@media (max-width:760px){
  section{padding:var(--space-4) 0;}
  .two-col{gap:var(--space-4);}
}

/* Prevent horizontal scroll on any viewport */
html, body{overflow-x:hidden; max-width:100%;}
img, svg, iframe{max-width:100%;}

/* Larger desktop refinement */
@media (min-width:1400px){
  .wrap{max-width:1320px;}
}

/* ===========================================================
   RTL / Arabic support
   =========================================================== */
html[dir="rtl"] body{font-family:var(--font-body-ar);}
html[dir="rtl"] h1, html[dir="rtl"] h2, html[dir="rtl"] h3, html[dir="rtl"] h4{
  font-family:var(--font-display-ar);
  font-weight:700;
}
html[dir="rtl"] em{font-family:var(--font-display-ar); font-style:normal;}
html[dir="rtl"] .eyebrow::before{order:2;}
html[dir="rtl"] .eyebrow{flex-direction:row-reverse; justify-content:flex-end;}
html[dir="rtl"] .list-check li{flex-direction:row-reverse; text-align:right;}
html[dir="rtl"] .timeline{border-left:none; border-right:1px solid var(--line); padding-left:0; padding-right:var(--space-3);}
html[dir="rtl"] .nav-links a.active::after{left:auto; right:0;}
html[dir="rtl"] .stat, html[dir="rtl"] .card, html[dir="rtl"] .form-card, html[dir="rtl"] p{text-align:right;}
html[dir="rtl"] .field label{text-align:right;}
html[dir="rtl"] .footer-bottom{flex-direction:row-reverse;}
html[dir="rtl"] .nav-cta svg, html[dir="rtl"] .btn svg{transform:scaleX(-1);}
/* numerals & phone numbers always render left-to-right even in rtl */
.ltr-nums{unicode-bidi:isolate; direction:ltr; display:inline-block;}

/* ===========================================================
   Language switcher
   =========================================================== */
.lang-switch{
  display:flex; align-items:center; gap:4px;
  border:1px solid var(--line); border-radius:100px;
  padding:4px; font-family:var(--font-mono); font-size:12px;
}
.lang-switch button{
  border:none; background:none; cursor:pointer;
  padding:6px 12px; border-radius:100px; color:var(--ink-soft);
  font-family:inherit; font-size:inherit; font-weight:600;
  transition:background .25s var(--ease), color .25s var(--ease);
}
.lang-switch button.active{background:var(--pine); color:var(--cream);}

/* ===========================================================
   WhatsApp floating button
   =========================================================== */
.whatsapp-float{
  position:fixed; bottom:24px; right:24px; z-index:60;
  width:58px; height:58px; border-radius:50%;
  background:#25D366; color:#fff;
  display:flex; align-items:center; justify-content:center;
  box-shadow:0 10px 30px -8px rgba(0,0,0,0.4);
  text-decoration:none;
  transition:transform .25s var(--ease), box-shadow .25s var(--ease);
  animation:wa-pulse 2.6s ease-in-out infinite;
}
.whatsapp-float:hover{transform:scale(1.08); box-shadow:0 14px 36px -8px rgba(0,0,0,0.5);}
html[dir="rtl"] .whatsapp-float{right:auto; left:24px;}
@keyframes wa-pulse{
  0%,100%{box-shadow:0 10px 30px -8px rgba(37,211,102,0.55);}
  50%{box-shadow:0 10px 30px -8px rgba(37,211,102,0.15);}
}
@media (prefers-reduced-motion:reduce){ .whatsapp-float{animation:none;} }

/* ===========================================================
   Button ripple interaction
   =========================================================== */
.btn, .nav-cta{position:relative; overflow:hidden;}
.ripple{
  position:absolute; border-radius:50%;
  background:rgba(255,255,255,0.55);
  transform:scale(0);
  animation:ripple-anim .6s var(--ease);
  pointer-events:none;
}
@keyframes ripple-anim{ to{ transform:scale(3); opacity:0; } }
.btn:active, .nav-cta:active{transform:scale(0.97);}

/* ===========================================================
   Feminine decorative touches
   =========================================================== */
.bloom{
  position:absolute; pointer-events:none; opacity:0.55; z-index:0;
}
.hero{position:relative;}
.hero::before{
  content:'';
  position:absolute; top:-40px; left:50%;
  width:1px; height:1px;
}
.card{position:relative;}
.card::after{
  content:'';
  position:absolute; top:16px; right:16px;
  width:8px; height:8px; border-radius:50%;
  background:var(--blush-dim);
}
html[dir="rtl"] .card::after{right:auto; left:16px;}

/* real photo handling: shows image if present, falls back to illustration behind it */
.hero-photo, .about-photo{position:relative;}
.hero-photo img, .about-photo img{
  position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
  border-radius:var(--radius); z-index:2;
}

/* Map embed */
.map-embed{
  border-radius:var(--radius); overflow:hidden; border:1px solid var(--line);
  aspect-ratio:4/3; width:100%;
}
.map-embed iframe{width:100%; height:100%; border:0;}