/* Layout: photo-led single column. Ink is the action colour; rose is a quiet accent (eyebrows, dots, icons). */
:root{
  --bg:#ffffff; --surface:#f7f3f2; --line:#ece4e2; --ink:#211e22; --muted:#6f676a;
  --rose:#b97a8b; --rose-soft:#f4e9ec; --btn:#211e22; --btn-ink:#ffffff; --notice:#fff7e6; --notice-ink:#6b4a00; --logo-filter:none;
  --en:Inter,-apple-system,'Segoe UI',Arial,sans-serif;
  --ar:'Noto Kufi Arabic',Tahoma,'Geeza Pro',sans-serif;
}
@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){
  --bg:#17151a; --surface:#221e22; --line:#352e33; --ink:#f3eef0; --muted:#b5abb0;
  --rose:#dca5b4; --rose-soft:#33262c; --btn:#f3eef0; --btn-ink:#17151a; --notice:#3a2f17; --notice-ink:#f3d99a; --logo-filter:invert(1); color-scheme:dark}}
:root[data-theme="dark"]{
  --bg:#17151a; --surface:#221e22; --line:#352e33; --ink:#f3eef0; --muted:#b5abb0;
  --rose:#dca5b4; --rose-soft:#33262c; --btn:#f3eef0; --btn-ink:#17151a; --notice:#3a2f17; --notice-ink:#f3d99a; --logo-filter:invert(1); color-scheme:dark}
*{box-sizing:border-box}
body{background:var(--bg);color:var(--ink);font-family:var(--en);font-size:16px;line-height:1.65;-webkit-text-size-adjust:100%;
  padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px))}
#site[lang="ar"]{font-family:var(--ar);line-height:1.9}
.wrap{max-width:1080px;margin:0 auto;padding-block:14px 40px;display:flex;flex-direction:column;gap:80px}
h1,h2,h3{text-wrap:balance;margin:0;font-weight:500}
h2{font-size:clamp(26px,3.6vw,34px);line-height:1.2;letter-spacing:-.015em}
h3{font-size:19px;line-height:1.35}
#site[lang="ar"] h2{letter-spacing:0;line-height:1.5}
#site[lang="ar"] h3{line-height:1.6}
p{margin:0}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--rose);outline-offset:3px;border-radius:8px}
.eyebrow{font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--rose);font-weight:600}
#site[lang="ar"] .eyebrow{letter-spacing:0;text-transform:none;font-size:13px}
.muted{color:var(--muted)}
.num{direction:ltr;unicode-bidi:isolate;font-family:var(--en);font-variant-numeric:tabular-nums}
.preview{background:var(--notice);color:var(--notice-ink);border-radius:10px;padding:10px 14px;font-size:13px}

.topbar{display:flex;justify-content:space-between;align-items:center;gap:12px}
.logo{height:26px;width:auto;filter:var(--logo-filter);display:block}
.top-actions{display:flex;align-items:center;gap:10px}
.lang{display:inline-flex;border:1px solid var(--line);border-radius:999px;padding:3px}
.lang button{border:0;background:transparent;color:var(--muted);font:500 13px/1 var(--en);padding:9px 13px;border-radius:999px;cursor:pointer;min-height:36px}
.lang button[lang="ar"]{font-family:var(--ar)}
.lang button[aria-pressed="true"]{background:var(--ink);color:var(--bg)}

.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:12px 24px;border-radius:999px;text-decoration:none;font-weight:500;font-size:16px;border:1px solid transparent;text-align:center}
.btn.primary{background:var(--btn);color:var(--btn-ink)}
.btn.ghost{border-color:var(--line);color:var(--ink)}
.btn.small{min-height:40px;padding:8px 16px;font-size:14px}
.btn .wa{width:18px;height:18px;flex:none}

.hero{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:center}
.hero-text{display:flex;flex-direction:column;gap:20px;min-width:0}
.hero h1{font-size:clamp(36px,5.6vw,60px);line-height:1.06;letter-spacing:-.03em}
#site[lang="ar"] .hero h1{letter-spacing:0;line-height:1.4;font-size:clamp(32px,4.8vw,50px)}
.hero .lead{font-size:18px;color:var(--muted);max-width:46ch}
.actions{display:flex;flex-wrap:wrap;gap:12px;align-items:center}
.trial-note{font-size:14px;color:var(--muted)}
.photo{margin:0;border-radius:20px;overflow:hidden;background:var(--surface);max-width:100%}
.photo img{display:block;width:100%;height:auto}
.hero .photo{aspect-ratio:4/5;position:relative}
.hero .photo img{position:absolute;inset:0;height:100%;object-fit:cover;object-position:50% 62%}
.highlights{display:grid;grid-template-columns:repeat(3,1fr);border-block:1px solid var(--line)}
.highlights div{padding:18px 20px;display:flex;flex-direction:column;gap:2px;min-width:0}
.highlights div+div{border-inline-start:1px solid var(--line)}
.highlights strong{font-weight:500;font-size:16px}
.highlights span{font-size:14px;color:var(--muted)}

.section{display:flex;flex-direction:column;gap:28px}
.section-head{display:flex;flex-direction:column;gap:10px;max-width:640px}
.section-head p{color:var(--muted);font-size:17px}

.why{display:grid;grid-template-columns:.9fr 1.1fr;gap:48px;align-items:center}
.why.no-photo{grid-template-columns:1fr;max-width:760px}
.reasons{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:20px}
.reasons li{display:grid;grid-template-columns:40px 1fr;gap:14px;align-items:start}
.reasons .ic{width:40px;height:40px;border-radius:50%;background:var(--rose-soft);display:grid;place-items:center;color:var(--rose)}
.reasons .ic svg{width:18px;height:18px}
.reasons li>div{min-width:0;display:flex;flex-direction:column;gap:4px}

.services{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.service{background:var(--surface);border-radius:18px;overflow:hidden;display:flex;flex-direction:column;min-width:0}
.service figure{margin:0;aspect-ratio:4/5;background:var(--line);position:relative;overflow:hidden}
.service figure img{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover}
.service .img-pilates{object-position:50% 50%}
.service .img-dance{object-position:50% 40%}
.service .img-pt{object-position:50% 35%}
.service .body{padding:22px 22px 26px;display:flex;flex-direction:column;gap:10px}
.service .tag{font-size:13px;color:var(--muted)}
.service .tag b{font-weight:600;color:var(--ink)}
.band{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;border:1px solid var(--line);border-radius:18px;padding:22px 24px}
.band>div{min-width:0;display:flex;flex-direction:column;gap:4px;max-width:560px}

.packages{display:grid;grid-template-columns:1.1fr .9fr;gap:24px;align-items:stretch}
.pk-main{background:var(--surface);border-radius:20px;padding:32px 28px;display:flex;flex-direction:column;gap:16px;min-width:0}
.pk-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:14px}
.pk-list li{display:flex;gap:12px;align-items:baseline}
.pk-list li::before{content:"";flex:none;width:7px;height:7px;border-radius:50%;background:var(--rose);transform:translateY(-2px)}
.pk-trial{border:1px solid var(--line);border-radius:20px;padding:32px 28px;display:flex;flex-direction:column;gap:14px;justify-content:center;min-width:0}

.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:16px;counter-reset:s}
.steps li{counter-increment:s;border-top:2px solid var(--ink);padding-top:18px;display:flex;flex-direction:column;gap:6px;min-width:0}
.steps li::before{content:counter(s);font:600 14px/1 var(--en);color:var(--rose);margin-bottom:4px}

.visit{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.info{display:flex;flex-direction:column;gap:4px;border-top:1px solid var(--line);padding-top:16px;min-width:0}
.info .big{font-size:20px;font-weight:500}
.info a{color:var(--rose);font-size:15px}

.final{background:var(--surface);border-radius:24px;padding:44px 28px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:16px}
.final p{color:var(--muted);max-width:46ch}

footer{border-top:1px solid var(--line);padding-top:24px;display:flex;justify-content:space-between;align-items:center;gap:16px;flex-wrap:wrap}
.social{display:flex;gap:20px;flex-wrap:wrap;font-size:14px}
.social a{color:var(--muted)}
.symbol{height:20px;width:auto;filter:var(--logo-filter);opacity:.85}
.fine{font-size:12px;color:var(--muted)}

@media (max-width:860px){
  .wrap{gap:60px}
  .hero{grid-template-columns:1fr;gap:28px}
  .why{grid-template-columns:1fr;gap:28px}
  .why .photo{order:2}
  .services{grid-template-columns:1fr 1fr}
  .services .service:last-child{grid-column:1/-1}
  .services .service:last-child figure{aspect-ratio:16/10}
  .packages{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr;gap:22px}
  .visit{grid-template-columns:1fr;gap:18px}
}
@media (max-width:560px){
  .highlights{grid-template-columns:1fr}
  .highlights div+div{border-inline-start:0;border-top:1px solid var(--line)}
  .highlights div{padding:14px 2px}
  .services{grid-template-columns:1fr}
  .service figure,.services .service:last-child figure{aspect-ratio:4/4.2}
  .actions .btn,.band .btn,.pk-main .btn,.pk-trial .btn{width:100%}
  .top-actions .btn{display:none}
  .hero .lead{font-size:17px}
  .hero .photo{aspect-ratio:4/4.6}
  .pk-main,.pk-trial{padding:26px 20px}
  .final{padding:36px 20px}
}
@media (prefers-reduced-motion:no-preference){.btn{transition:transform .15s ease}.btn:hover{transform:translateY(-1px)}}

/* sticky header */
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:30;background:var(--bg)}
.topbar{position:sticky;top:env(safe-area-inset-top,0px);z-index:20;background:var(--bg);padding-block:10px;margin-block:-10px;border-bottom:1px solid transparent}
.topbar.scrolled{border-bottom-color:var(--line)}
/* advantages as small cards */
.reasons{display:grid!important;grid-template-columns:repeat(6,1fr);gap:16px!important}
.reasons li{grid-column:span 2}
.reasons li{display:flex!important;flex-direction:column;gap:8px!important;background:var(--surface);border-radius:16px;padding:22px 20px;min-width:0}
.reasons li:nth-child(4),.reasons li:nth-child(5){grid-column:span 3}
/* FAQ */
.faq{display:flex;flex-direction:column;border-top:1px solid var(--line);max-width:820px}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;padding:18px 36px 18px 0;position:relative;font-weight:500;font-size:17px}
#site[dir="rtl"] .faq summary{padding:18px 0 18px 36px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:"+";position:absolute;inset-inline-end:4px;top:50%;transform:translateY(-50%);font:400 22px/1 var(--en);color:var(--rose)}
.faq details[open] summary::after{content:"−"}
.faq details p{padding:0 0 18px;max-width:68ch}
/* final: CTA + visit */
.final{align-items:stretch!important;text-align:start!important;gap:32px!important}
.final-cta{display:flex;flex-direction:column;align-items:center;text-align:center;gap:14px}
.final .visit{border-top:1px solid var(--line);padding-top:8px}
.final .info{border-top:0}
.service .body p+p{margin-top:-2px}
@media (max-width:860px){.reasons{grid-template-columns:1fr 1fr}.reasons li,.reasons li:nth-child(4){grid-column:span 1}.reasons li:nth-child(5){grid-column:1/-1}}
@media (max-width:560px){
  .reasons{grid-template-columns:1fr}
  .reasons li,.reasons li:nth-child(4),.reasons li:nth-child(5){grid-column:auto}
  .logo{height:20px}
  .top-actions{gap:6px}
  .lang button{padding:8px 10px}
  .top-actions .btn{display:inline-flex!important;min-height:36px;padding:6px 14px}
}