/* R49 — natural Arabic voice, editorial typography and the approved 3D mark. */

.brand-mark{overflow:visible}
.brand-mark .approved-brand-symbol{transform:scale(1.14);transform-origin:center}
.footer-approved-logo{transform:scale(1.08)}

html[dir="rtl"] body{
  font-family:'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif;
  font-size:17px;
  line-height:1.8;
}

html[dir="rtl"] :where(h1,h2,h3,h4,blockquote,.signature,.doctor-signature){
  font-family:'Noto Naskh Arabic','Times New Roman',serif;
  font-weight:600;
  letter-spacing:0!important;
  text-wrap:balance;
}

html[dir="rtl"] :where(p,li,.card-copy,.service-dialog-copy){
  text-wrap:pretty;
}

html[dir="rtl"] :where(.eyebrow,.button,button,.nav-cta,.site-header nav a,.footer-grid strong,.language-switch button){
  font-family:'IBM Plex Sans Arabic',Tahoma,Arial,sans-serif;
  letter-spacing:0!important;
  text-transform:none!important;
}

html[dir="rtl"] .eyebrow{
  font-size:13px;
  font-weight:700;
  line-height:1.6;
}

html[dir="rtl"] .hero-copy h1{
  max-width:790px;
  font-size:clamp(68px,5.8vw,106px);
  line-height:1.03;
}

html[dir="rtl"] .hero-intro{
  max-width:660px;
  font-size:clamp(18px,1.22vw,23px);
  line-height:1.95;
}

html[dir="rtl"] .hero-actions .button,
html[dir="rtl"] .nav-cta,
html[dir="rtl"] .contact-action{
  font-size:15px;
  font-weight:700;
}

html[dir="rtl"] .meta-grid strong{font-size:14px;line-height:1.55}
html[dir="rtl"] .meta-grid small{font-size:12px;line-height:1.65}

html[dir="rtl"] :where(.manifesto h2,.section-top h2,.journey-heading h2,.doctor-content h2,.practice-head h2,.visit-heading h2,.contact-copy h2){
  line-height:1.08;
}

html[dir="rtl"] :where(.manifesto-copy,.section-top>p,.journey-heading>p,.doctor-lead,.practice-head>p,.visit-heading>p,.contact-copy>p){
  font-size:17px;
  line-height:1.95;
}

html[dir="rtl"] .service-card .card-copy h3{
  font-size:clamp(25px,1.75vw,34px);
  line-height:1.2;
}

html[dir="rtl"] .service-card .card-copy p{
  font-size:14px;
  line-height:1.85;
}

html[dir="rtl"] .service-card .card-copy button{
  font-size:13px;
  font-weight:700;
}

html[dir="rtl"] .journey-step h3{font-size:27px;line-height:1.3}
html[dir="rtl"] .journey-step p{font-size:14px;line-height:1.85}
html[dir="rtl"] .doctor-quote{font-size:clamp(24px,2vw,34px);line-height:1.6}
html[dir="rtl"] .doctor-content>p{line-height:1.9}
html[dir="rtl"] .doctor-stats strong{font-size:29px}
html[dir="rtl"] .doctor-stats small{font-size:12px;line-height:1.55}
html[dir="rtl"] .quote p{font-size:clamp(27px,2.4vw,44px);line-height:1.55}
html[dir="rtl"] .hours-title h3{font-size:31px}
html[dir="rtl"] .hours-list>div{font-size:14px;line-height:1.6}
html[dir="rtl"] .hours-list strong{font-size:15px}
html[dir="rtl"] .map-details strong{font-size:14px}
html[dir="rtl"] .map-details p{font-size:13px;line-height:1.75}

html[dir="rtl"] .page-hero h1,
html[dir="rtl"] .doctor-page-copy h1,
html[dir="rtl"] .contact-page-hero h1{
  font-size:clamp(56px,5.2vw,88px);
  line-height:1.08;
}

html[dir="rtl"] .page-hero p,
html[dir="rtl"] .doctor-page-copy>p,
html[dir="rtl"] .contact-page-hero p,
html[dir="rtl"] .service-detail-copy p{
  font-size:17px;
  line-height:1.95;
}

html[dir="rtl"] .inner-service-card h2,
html[dir="rtl"] .service-detail-copy h2{font-size:clamp(31px,3vw,48px);line-height:1.18}
html[dir="rtl"] .inner-service-card p{font-size:14px;line-height:1.85}
html[dir="rtl"] .booking-form h2{font-size:clamp(35px,3.5vw,54px);line-height:1.25}
html[dir="rtl"] .booking-form label,
html[dir="rtl"] .booking-form input,
html[dir="rtl"] .booking-form textarea{font-size:15px}

html[dir="rtl"] footer .footer-grid strong,
html[dir="rtl"] .site-footer .footer-grid>div>strong{font-size:14px!important}
html[dir="rtl"] footer .footer-grid a,
html[dir="rtl"] .site-footer .footer-links a{font-size:14px!important;line-height:1.9}
html[dir="rtl"] footer .footer-brand span,
html[dir="rtl"] .site-footer .brand-copy strong{font-size:21px!important}
html[dir="rtl"] footer .legal,
html[dir="rtl"] .site-footer .footer-bottom{font-size:12px!important}

@media(min-width:721px){
  html[dir="rtl"] .site-header .brand-mark{width:62px;height:62px;flex-basis:62px}
  html[dir="rtl"] .site-header .brand-copy b,
  html[dir="rtl"] .site-header .brand-copy strong{font-size:15px}
  html[dir="rtl"] .site-header .brand-copy small,
  html[dir="rtl"] .site-header .brand-copy em{font-size:8px}
  html[dir="rtl"] .manifesto-copy{max-width:640px}
  html[dir="rtl"] .journey-heading>p{max-width:620px}
  html[dir="rtl"] .visit-heading>p{max-width:640px}
}

@media(max-width:720px){
  html[dir="rtl"] body{font-size:16px}
  html[dir="rtl"] .site-header .brand{max-width:196px}
  html[dir="rtl"] .site-header .brand-mark{width:50px;height:50px;flex:0 0 50px}
  html[dir="rtl"] .site-header .brand-copy b,
  html[dir="rtl"] .site-header .brand-copy strong{font-size:10px;line-height:1.2}
  html[dir="rtl"] .site-header .brand-copy small,
  html[dir="rtl"] .site-header .brand-copy em{font-size:6px}
  html[dir="rtl"] .hero h1{font-size:clamp(47px,13.5vw,61px);line-height:1.08}
  html[dir="rtl"] .hero-intro{font-size:16px;line-height:1.9}
  html[dir="rtl"] .eyebrow{font-size:11px}
  html[dir="rtl"] :where(.manifesto-copy,.section-top>p,.journey-heading>p,.doctor-lead,.practice-head>p,.visit-heading>p,.contact-copy>p){font-size:15px;line-height:1.9}
  html[dir="rtl"] .service-card .card-copy h3{font-size:28px}
  html[dir="rtl"] .journey-step h3{font-size:24px}
  html[dir="rtl"] .doctor-quote{font-size:24px}
  html[dir="rtl"] .quote p{font-size:27px;line-height:1.55}
  html[dir="rtl"] .page-hero h1,
  html[dir="rtl"] .doctor-page-copy h1,
  html[dir="rtl"] .contact-page-hero h1{font-size:48px;line-height:1.12}
  html[dir="rtl"] .page-hero p,
  html[dir="rtl"] .doctor-page-copy>p,
  html[dir="rtl"] .contact-page-hero p,
  html[dir="rtl"] .service-detail-copy p{font-size:15px;line-height:1.9}
  html[dir="rtl"] footer .footer-grid a,
  html[dir="rtl"] .site-footer .footer-links a{font-size:14px!important}
  html[dir="rtl"] footer .legal,
  html[dir="rtl"] .site-footer .footer-bottom{font-size:11px!important}
}

@media(max-width:370px){
  html[dir="rtl"] .site-header .brand{max-width:58px}
  html[dir="rtl"] .site-header .brand-mark{width:52px;height:52px;flex-basis:52px}
}

@media(prefers-reduced-motion:no-preference){
  .brand-mark .approved-brand-symbol{transition:transform .45s cubic-bezier(.2,.8,.2,1),filter .45s ease}
  .brand:hover .approved-brand-symbol{transform:scale(1.2) rotate(-2deg);filter:drop-shadow(0 10px 16px rgba(0,19,39,.26))}
}
