@font-face{font-family:Cairo;font-weight:400;font-display:swap;src:url(assets/fonts/cairo-arabic-400-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Cairo;font-weight:700;font-display:swap;src:url(assets/fonts/cairo-arabic-700-normal.woff2) format("woff2");unicode-range:U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0898-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC}
@font-face{font-family:Cairo;font-weight:400;font-display:swap;src:url(assets/fonts/cairo-latin-400-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:Cairo;font-weight:700;font-display:swap;src:url(assets/fonts/cairo-latin-700-normal.woff2) format("woff2");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --blush:#fff4f8; --blush-2:#ffe3ee; --lilac:#ffccff;
  --rose:#cc0066; --rose-deep:#a30052; --magenta:#ff0099; --ink:#4a1030;
  --blue:#0f78a8; --card:#fff; --line:#f6c3d8;
  --shadow:0 10px 30px -10px rgba(204,0,102,.35);
  --font:Cairo,system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;
}
*{box-sizing:border-box;margin:0}
html{-webkit-text-size-adjust:100%}
body{font-family:var(--font);color:var(--ink);line-height:1.6;min-height:100svh;overflow-x:hidden;
  background:radial-gradient(120% 60% at 50% 0,var(--blush-2),transparent 70%),linear-gradient(180deg,var(--blush),#fff 90%) fixed;
  display:flex;flex-direction:column}
a{color:inherit;text-decoration:none}
:focus-visible{outline:3px solid var(--blue);outline-offset:3px;border-radius:12px}

.topbar{display:flex;justify-content:flex-end;padding:14px 16px 0;position:relative;z-index:3}
.lang{font:inherit;font-weight:700;font-size:.95rem;color:var(--rose-deep);background:#fff;border:1.5px solid var(--line);
  border-radius:999px;padding:.35rem 1rem;min-height:44px;min-width:44px;cursor:pointer;transition:background .2s,transform .2s}
.lang:hover{background:var(--blush-2)}

main{flex:1;width:100%;max-width:30rem;margin-inline:auto;padding:1rem 1.25rem 2rem;text-align:center;position:relative;z-index:2}
.hero{padding-block:.5rem 1.5rem}
.logo{width:min(46vw,190px);height:auto;aspect-ratio:1/1;border-radius:50%;background:#fff;box-shadow:var(--shadow),0 0 0 6px rgba(255,255,255,.7);
  object-fit:contain;padding:6px;display:block;margin:0 auto 1.25rem}
h1{font-size:clamp(1.35rem,5.5vw,1.75rem);line-height:1.4;color:var(--rose-deep);font-weight:700;text-wrap:balance}
.sub{margin-top:.5rem;color:var(--ink);font-size:1.02rem;opacity:.85}

.social{display:grid;gap:.85rem;margin-top:1.25rem}
.btn{display:flex;align-items:center;gap:.9rem;min-height:64px;padding:.6rem 1.1rem;background:var(--card);border:1.5px solid var(--line);
  border-radius:20px;box-shadow:0 6px 18px -12px rgba(204,0,102,.5);font-weight:700;font-size:1.1rem;color:var(--ink);
  transition:transform .2s,box-shadow .2s,border-color .2s}
.btn:hover{transform:translateY(-2px);border-color:var(--magenta);box-shadow:var(--shadow)}
.btn:active{transform:scale(.98)}
.ico{flex:none;width:44px;height:44px;border-radius:50%;display:grid;place-items:center;color:#fff}
.ico svg{width:24px;height:24px;fill:currentColor}
.fb{background:#1877f2}.ig{background:linear-gradient(45deg,#f9a03f,#e1306c 50%,#833ab4)}.th{background:#101010}.wa{background:#1a7f43}.tel{background:var(--blue)}
.btn .go{margin-inline-start:auto;color:var(--rose);font-size:1.3rem;line-height:1}
[dir=rtl] .go{transform:scaleX(-1)}

.loc{position:relative;margin-top:1.75rem;display:flex;flex-direction:column;align-items:center}
.pinbtn{display:inline-flex;align-items:center;gap:.7rem;min-height:64px;padding:.5rem 1.4rem .5rem .6rem;padding-inline:.6rem 1.4rem;border-radius:999px;
  background:linear-gradient(135deg,var(--rose),var(--rose-deep));color:#fff;font-weight:700;font-size:1.1rem;box-shadow:var(--shadow);transition:transform .2s}
.pinbtn:hover{transform:translateY(-2px)}
.pinbtn .ico{background:#fff;color:var(--rose)}
.card{display:block;width:min(100%,300px);background:#fff;border-radius:22px;overflow:hidden;border:1px solid var(--line);
  box-shadow:0 18px 40px -12px rgba(163,0,82,.45);text-align:start}
.mapwrap{display:block;position:relative;aspect-ratio:720/461;background:var(--blush-2)}
.mapwrap img{width:100%;height:100%;display:block;object-fit:cover}
.mappin{position:absolute;left:50%;top:53%;width:30px;height:38px;transform:translate(-50%,-100%);filter:drop-shadow(0 3px 3px rgba(0,0,0,.3))}
.attr{position:absolute;inset-inline-end:6px;bottom:4px;font-size:.62rem;background:rgba(255,255,255,.8);padding:0 .35rem;border-radius:4px;color:#444}
.cap{display:block;padding:.6rem .9rem;font-weight:700;font-size:.95rem;color:var(--rose-deep)}
.cap:hover{background:var(--blush)}

/* touch / no-hover: card is a normal visible block under the icon */
@media (hover:none){.card{margin-top:1rem}}
/* hover-capable: floating card above the icon on hover and keyboard focus */
@media (hover:hover){
  .loc::before{content:"";position:absolute;bottom:100%;height:18px;width:100%}
  .card{position:absolute;bottom:calc(100% + 14px);inset-inline:auto;left:50%;transform:translate(-50%,8px) scale(.97);opacity:0;visibility:hidden;
    transition:opacity .22s,transform .22s,visibility 0s .22s;z-index:5}
  .loc:hover .card,.loc:focus-within .card{opacity:1;visibility:visible;transform:translate(-50%,0) scale(1);transition:opacity .22s,transform .22s}
}

.extra{display:grid;grid-template-columns:1fr 1fr;gap:.75rem;margin-top:1.5rem}
.extra .btn{min-height:52px;font-size:.98rem;gap:.55rem;padding-inline:.7rem}
.extra .ico{width:34px;height:34px}.extra .ico svg{width:18px;height:18px}

footer{text-align:center;padding:1.25rem 1rem 1.75rem;font-size:.9rem;color:var(--rose-deep);position:relative;z-index:2}

/* floating hearts */
.fx{position:fixed;inset:0;pointer-events:none;z-index:1;overflow:hidden}
.fx i{position:absolute;bottom:-40px;width:var(--s);height:var(--s);opacity:0;color:var(--c);animation:float var(--d) linear var(--w) infinite}
.fx svg{width:100%;height:100%;fill:currentColor}
@keyframes float{0%{transform:translateY(0) rotate(0);opacity:0}10%{opacity:.55}90%{opacity:.4}100%{transform:translateY(-110vh) rotate(25deg);opacity:0}}

.rise{animation:rise .7s cubic-bezier(.2,.7,.2,1) both;animation-delay:var(--i,0s)}
@keyframes rise{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition-duration:.01ms!important}
  .fx{display:none}
}
.fx i:nth-child(1){left:8%;--s:18px;--c:#ff0099;--d:11s;--w:0s}
.fx i:nth-child(2){left:22%;--s:12px;--c:#ff99dd;--d:14s;--w:3s}
.fx i:nth-child(3){left:38%;--s:22px;--c:#ff80c0;--d:16s;--w:6s}
.fx i:nth-child(4){left:55%;--s:14px;--c:#ff0099;--d:12s;--w:1.5s}
.fx i:nth-child(5){left:70%;--s:20px;--c:#ffb3d9;--d:15s;--w:8s}
.fx i:nth-child(6){left:86%;--s:13px;--c:#cc0066;--d:13s;--w:4s}
.r1{--i:.05s}.r2{--i:.15s}.r3{--i:.25s}.r4{--i:.35s}.r5{--i:.45s}.r6{--i:.55s}.r7{--i:.65s}