/* ============================================================
   قو فايو · GoVayo — نظام التصميم
   خطوط مستضافة ذاتيًا من الجذر (../fonts) — صفر طلبات خارجية
   ============================================================ */
@font-face{font-family:'Reem Kufi';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('../fonts/reem-kufi-ar.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-FEFF,U+102E0-102FB,U+10E60-10E7E,U+10EFD-10EFF,U+1EE00-1EEFF}
@font-face{font-family:'Reem Kufi';font-style:normal;font-weight:400 700;font-display:swap;
  src:url('../fonts/reem-kufi-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:400;font-display:swap;
  src:url('../fonts/plex-ar-400.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-FEFF,U+102E0-102FB,U+10E60-10E7E,U+10EFD-10EFF,U+1EE00-1EEFF}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:600;font-display:swap;
  src:url('../fonts/plex-ar-600.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-FEFF,U+102E0-102FB,U+10E60-10E7E,U+10EFD-10EFF,U+1EE00-1EEFF}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:700;font-display:swap;
  src:url('../fonts/plex-ar-700.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-FEFF,U+102E0-102FB,U+10E60-10E7E,U+10EFD-10EFF,U+1EE00-1EEFF}
@font-face{font-family:'IBM Plex Sans Arabic';font-style:normal;font-weight:100 700;font-display:swap;
  src:url('../fonts/plex-sans-latin.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:'IBM Plex Mono';font-style:normal;font-weight:500;font-display:swap;
  src:url('../fonts/plex-mono-500.woff2') format('woff2');
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

:root{
  --ink:#160A22; --ink2:#2A1140; --paper:#FFFFFF; --wash:#FBF7FD;
  --violet:#7B23C9; --magenta:#E8256B; --coral:#F5453C; --amber:#FD9203;
  --muted:#6E5A80;
  --line:rgba(22,10,34,.12);
  --grad:linear-gradient(120deg,#3E0DAE 0%,#B3199B 38%,#F5453C 70%,#FD9203 100%);
  --shadow:0 2px 5px rgba(60,10,80,.07),0 16px 38px -16px rgba(60,10,80,.34);
  --shadow-lg:0 6px 14px rgba(60,10,80,.1),0 44px 84px -32px rgba(60,10,80,.5);
  --radius:20px; --maxw:1120px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--wash);color:var(--ink);
  font-family:'IBM Plex Sans Arabic',system-ui,'Segoe UI',sans-serif;font-size:16px;line-height:1.85;
  overflow-x:hidden}
img{max-width:100%;display:block}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
:focus-visible{outline:3px solid var(--violet);outline-offset:3px;border-radius:8px}
::selection{background:var(--magenta);color:#fff}
h1,h2,h3{font-family:'Reem Kufi',system-ui,sans-serif;font-weight:600;line-height:1.3;margin:0}
.mono{font-family:'IBM Plex Mono',ui-monospace,monospace;font-size:.72rem;letter-spacing:.1em}
.wrap{max-width:var(--maxw);margin-inline:auto;padding-inline:clamp(18px,4vw,30px)}
.section{padding-block:clamp(50px,7vw,90px)}
.grad-text{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}

#progress{position:fixed;top:0;inset-inline:0;height:4px;z-index:120;pointer-events:none;
  background:var(--grad);transform:scaleX(0);transform-origin:right}

/* ---------- الترويسة ---------- */
header.top{position:sticky;top:0;z-index:60;backdrop-filter:blur(16px) saturate(1.4);
  background:rgba(251,247,253,.85);border-bottom:1px solid transparent;transition:border-color .3s}
header.top.stuck{border-bottom-color:var(--line)}
.top__in{display:flex;align-items:center;gap:14px;height:64px}
.brand{display:flex;align-items:center;gap:11px;font-family:'Reem Kufi',sans-serif;font-weight:600}
.brand img{width:36px;height:36px;border-radius:12px;transition:transform .35s cubic-bezier(.2,1.4,.4,1)}
.brand:hover img{transform:rotate(-8deg) scale(1.08)}
.brand small{display:block;font-family:'IBM Plex Mono',monospace;font-size:.56rem;letter-spacing:.13em;
  color:var(--muted);font-weight:400}
.top__links{display:flex;gap:2px;margin-inline-start:auto;align-items:center}
.top__links a{padding:8px 13px;border-radius:999px;font-size:.89rem;color:var(--muted);transition:.2s}
.top__links a:hover{color:var(--ink);background:rgba(123,35,201,.1)}

/* ---------- الأزرار ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 26px;
  border-radius:999px;font-weight:700;font-size:.98rem;border:2px solid transparent;position:relative;overflow:hidden;
  transition:transform .18s cubic-bezier(.2,.7,.3,1),box-shadow .2s,background .2s,color .2s,border-color .2s}
.btn svg{width:19px;height:19px;flex:none}
.btn--grad{background:var(--grad);color:#fff;box-shadow:0 14px 32px -12px rgba(184,25,155,.85)}
.btn--grad:hover{transform:translateY(-3px) scale(1.02);color:#fff}
.btn--grad::after{content:"";position:absolute;top:0;bottom:0;width:38%;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.5),transparent);
  transform:translateX(-160%) skewX(-18deg);animation:shine 4s ease-in-out infinite}
@keyframes shine{0%,72%{transform:translateX(-160%) skewX(-18deg)}92%,100%{transform:translateX(320%) skewX(-18deg)}}
.btn--ghost{border-color:var(--line);background:var(--paper);color:var(--ink)}
.btn--ghost:hover{border-color:var(--violet);color:var(--violet);transform:translateY(-3px)}
.btn--light{background:rgba(255,255,255,.16);color:#fff;border-color:rgba(255,255,255,.34);backdrop-filter:blur(8px)}
.btn--light:hover{background:rgba(255,255,255,.26);transform:translateY(-3px);color:#fff}
.btn--sm{padding:9px 17px;font-size:.86rem}

.eyebrow{display:inline-flex;align-items:center;gap:9px;font-family:'IBM Plex Mono',monospace;
  font-size:.7rem;letter-spacing:.15em;text-transform:uppercase;color:var(--magenta);font-weight:500}
.eyebrow::before{content:"";width:24px;height:2px;background:var(--grad);border-radius:2px}
.h-sec{font-size:clamp(1.6rem,3.9vw,2.6rem);margin:.5rem 0 .7rem}
.lead{color:var(--muted);max-width:62ch;margin:0;font-size:clamp(.98rem,1.4vw,1.08rem)}

/* ============================================================
   البطل — تدرّج حيّ
   ============================================================ */
.hero{position:relative;overflow:hidden;color:#fff;padding-block:clamp(42px,6vw,74px) 0;
  background:var(--grad);background-size:200% 200%;animation:flow 18s ease infinite}
@keyframes flow{0%,100%{background-position:0% 50%}50%{background-position:100% 50%}}
.hero::after{content:"";position:absolute;inset:0;opacity:.14;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.85) 1.2px,transparent 1.2px);background-size:28px 28px}
.blob{position:absolute;border-radius:50%;filter:blur(60px);opacity:.42;pointer-events:none}
.b1{width:44vw;height:44vw;max-width:460px;max-height:460px;background:#FFD166;top:-14%;inset-inline-end:-8%;
  animation:float1 15s ease-in-out infinite}
.b2{width:38vw;height:38vw;max-width:400px;max-height:400px;background:#5B2BE0;bottom:-18%;inset-inline-start:-6%;
  animation:float2 19s ease-in-out infinite}
@keyframes float1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-22px,26px) scale(1.1)}}
@keyframes float2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(26px,-20px) scale(1.08)}}

.hero__grid{position:relative;z-index:3;display:grid;grid-template-columns:1.05fr .95fr;
  gap:clamp(24px,4vw,50px);align-items:center;padding-bottom:clamp(40px,6vw,72px)}
.hero__badge{display:inline-flex;align-items:center;gap:8px;padding:6px 15px;border-radius:999px;
  background:rgba(255,255,255,.18);border:1px solid rgba(255,255,255,.36);font-size:.83rem;font-weight:700;
  margin-bottom:14px;backdrop-filter:blur(6px)}
.hero__badge i{width:8px;height:8px;border-radius:50%;background:#FFE08A;animation:blink 1.9s infinite}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.28}}
.hero__icon{width:clamp(76px,9.5vw,104px);border-radius:26px;margin-bottom:16px;
  box-shadow:0 22px 46px -16px rgba(30,0,50,.7);animation:bob 4.6s ease-in-out infinite}
@keyframes bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-10px) rotate(2deg)}}
.hero h1{color:#fff;font-size:clamp(2rem,5.2vw,3.4rem);line-height:1.16;letter-spacing:-.01em}
.hero .tag{font-family:'Reem Kufi',sans-serif;font-size:clamp(1.02rem,2.2vw,1.5rem);color:#FFE6C2;margin:10px 0 12px}
.hero p.sub{color:rgba(255,255,255,.92);max-width:46ch;margin:0 0 24px;font-weight:500}
.hero__cta{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:20px}
.hero__meta{display:flex;flex-wrap:wrap;gap:8px 20px;color:rgba(255,255,255,.9);font-size:.87rem;font-weight:600}
.hero__meta b{color:#fff}

/* الهاتف + الساعة */
.stage{position:relative;display:flex;justify-content:center;align-items:flex-end}
.phone{position:relative;width:min(258px,66vw);aspect-ratio:9/19.4;border-radius:40px;flex:none;
  background:linear-gradient(160deg,#2C1140,#120620);padding:10px;
  box-shadow:0 40px 84px -26px rgba(20,0,40,.8),0 0 0 1.5px rgba(255,255,255,.24) inset;
  animation:bob 6.4s ease-in-out infinite .3s}
.phone::before{content:"";position:absolute;top:15px;left:50%;transform:translateX(-50%);
  width:78px;height:20px;background:#120620;border-radius:999px;z-index:5}
.phone .screen{height:100%;border-radius:31px;overflow:hidden;background:#0F0518;position:relative;
  display:grid;place-items:center;padding:22px}
.phone .screen img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0;opacity:0;transition:opacity .6s}
.phone .screen img.on{opacity:1}
.phone .ph-mark{position:relative;z-index:2;text-align:center;color:#fff}
.phone .ph-mark img{position:static;width:96px;opacity:1;margin:0 auto 14px;border-radius:24px}
.phone .ph-mark b{font-family:'Reem Kufi',sans-serif;font-size:1.2rem;display:block}
.phone .ph-mark span{color:#C9A9E0;font-size:.8rem}

/* ---------- شريط الأرقام ---------- */
.facts{background:var(--paper);border-block:1px solid var(--line)}
.facts__grid{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--line)}
.facts__grid>div{background:var(--paper);padding:clamp(20px,3vw,32px) 14px;text-align:center;transition:background .25s}
.facts__grid>div:hover{background:#FDF6FF}
.facts b{display:block;font-family:'Reem Kufi',sans-serif;font-size:clamp(1.4rem,3.4vw,2.2rem);line-height:1.1}
.facts span{display:block;margin-top:6px;color:var(--muted);font-size:.85rem}

/* ---------- المقارنة ---------- */
.versus{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:36px}
.vs{border-radius:var(--radius);padding:26px;border:1px solid var(--line);background:var(--paper)}
.vs h3{font-size:1.1rem;margin-bottom:12px;display:flex;align-items:center;gap:9px}
.vs ul{list-style:none;margin:0;padding:0;font-size:.94rem}
.vs li{padding:7px 0;display:flex;gap:9px;align-items:flex-start;color:var(--muted)}
.vs li b{flex:none;font-size:1rem;line-height:1.5}
.vs--bad{background:#FFF6F5;border-color:rgba(245,69,60,.28)}
.vs--bad h3{color:#C0332B}
.vs--bad li b{color:#E0574B}
.vs--good{background:linear-gradient(160deg,rgba(123,35,201,.08),rgba(232,37,107,.06));
  border-color:rgba(123,35,201,.32)}
.vs--good h3{color:var(--violet)}
.vs--good li b{color:#159E62}

/* ---------- المزايا ---------- */
.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(248px,1fr));gap:16px;margin-top:36px}
.card{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:24px;
  transition:transform .27s cubic-bezier(.2,.8,.3,1),border-color .27s,box-shadow .27s}
.card:hover{transform:translateY(-6px);border-color:rgba(232,37,107,.45);box-shadow:var(--shadow)}
.card:hover .ic{transform:scale(1.18) rotate(-8deg)}
.card .ic{font-size:30px;line-height:1;margin-bottom:12px;display:inline-block;
  transition:transform .35s cubic-bezier(.2,1.5,.4,1)}
.card h3{font-size:1.05rem;margin-bottom:6px}
.card p{margin:0;color:var(--muted);font-size:.93rem}

/* ---------- الأقسام (شرائح) ---------- */
.chips{display:flex;flex-wrap:wrap;gap:9px;margin-top:30px}
.chips span{padding:9px 17px;border-radius:999px;font-size:.9rem;font-weight:600;
  border:1px solid var(--line);background:var(--paper);transition:.25s;cursor:default}
.chips span:hover{transform:translateY(-3px);border-color:transparent;color:#fff;background:var(--grad)}

/* ============================================================
   قسم Apple Watch
   ============================================================ */
.watchsec{background:linear-gradient(165deg,#160A22,#2A1140 55%,#3E0DAE);color:#EFE6F7;
  position:relative;overflow:hidden}
.watchsec::after{content:"";position:absolute;inset:0;opacity:.1;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.7) 1.1px,transparent 1.1px);background-size:26px 26px}
.watchsec .wrap{position:relative;z-index:2}
.watchsec .eyebrow{color:#FFB86B}
.watchsec h2{color:#fff}
.watchsec .lead{color:#C4AEDA}
.wgrid{display:grid;grid-template-columns:340px minmax(0,1fr);gap:clamp(26px,4vw,52px);
  align-items:center;margin-top:40px}

/* الساعة */
.watch{position:relative;width:280px;margin-inline:auto;filter:drop-shadow(0 32px 46px rgba(0,0,0,.6))}
.watch__band{position:absolute;inset-inline:76px;top:-46px;bottom:-46px;border-radius:26px;
  background:linear-gradient(180deg,#3A2A48,#241633);z-index:1}
.watch__case{position:relative;z-index:2;border-radius:58px;padding:12px;
  background:linear-gradient(150deg,#6E6478,#2A2231 60%,#4A4155);
  box-shadow:0 0 0 1px rgba(255,255,255,.16) inset}
.watch__crown{position:absolute;inset-inline-end:-9px;top:76px;width:11px;height:44px;border-radius:5px;
  background:linear-gradient(180deg,#8C8397,#4A4155);z-index:3;
  box-shadow:0 0 0 1px rgba(0,0,0,.35)}
.watch__crown::after{content:"";position:absolute;inset-inline-end:-4px;top:96px;width:9px;height:34px;
  border-radius:4px;background:linear-gradient(180deg,#7A7186,#3E3648)}
.watch__screen{border-radius:48px;background:#000;aspect-ratio:41/50;overflow:hidden;position:relative;
  display:flex;flex-direction:column;color:#fff;padding:18px 16px}
.watch__screen img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .5s}
.watch__screen img.on{opacity:1}
.wface{position:relative;z-index:2;display:flex;flex-direction:column;height:100%}
.wtime{font-family:'IBM Plex Mono',monospace;font-size:.72rem;color:#FF9F45;text-align:end;letter-spacing:.06em}
.wnow{margin-top:auto;text-align:center}
.wnow .wicon{width:44px;height:44px;border-radius:14px;margin:0 auto 8px;background:var(--grad);
  display:grid;place-items:center;font-size:20px}
.wnow b{display:block;font-family:'Reem Kufi',sans-serif;font-size:.86rem;line-height:1.4}
.wnow span{display:block;color:#B79ACB;font-size:.68rem;margin-top:2px}
.wbar{margin-top:12px;height:4px;border-radius:99px;background:rgba(255,255,255,.18);overflow:hidden}
.wbar i{display:block;height:100%;width:38%;border-radius:99px;background:var(--grad);
  animation:wprog 9s linear infinite}
@keyframes wprog{0%{width:6%}100%{width:96%}}
.wctrl{display:flex;justify-content:center;gap:16px;margin-top:12px;font-size:15px;color:#D9C7E6}
.wctrl b{color:#fff;font-size:19px}

.wlist{display:flex;flex-direction:column;gap:10px}
.witem{display:flex;align-items:center;gap:13px;padding:14px 17px;border-radius:16px;text-align:start;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.14);width:100%;
  transition:transform .22s,background .22s,border-color .22s}
.witem:hover{transform:translateX(-4px);background:rgba(255,255,255,.11)}
html[dir="ltr"] .witem:hover{transform:translateX(4px)}
.witem[aria-current="true"]{background:rgba(232,37,107,.18);border-color:rgba(232,37,107,.55)}
.witem .em{font-size:22px;flex:none}
.witem .tx b{display:block;font-family:'Reem Kufi',sans-serif;font-size:1rem;color:#fff}
.witem .tx span{display:block;color:#B79ACB;font-size:.84rem}
.whint{color:#9E85B4;font-size:.82rem;margin:16px 0 0;text-align:center}

/* ---------- وضع الأطفال ---------- */
.kids{background:linear-gradient(150deg,#FFF3E0,#FFE7F2);border:1px solid rgba(232,37,107,.24);
  border-radius:var(--radius);padding:clamp(24px,3.6vw,40px);margin-top:36px;
  display:flex;gap:22px;align-items:center;flex-wrap:wrap}
.kids .em{font-size:52px;flex:none;animation:bob 5s ease-in-out infinite}
.kids div{flex:1;min-width:250px}
.kids h3{font-size:1.2rem;margin-bottom:6px}
.kids p{margin:0;color:#7A5A4E;font-size:.95rem}

/* ---------- شريط الدعوة ---------- */
.cta-band{background:var(--grad);background-size:180% 180%;animation:flow 16s ease infinite;
  color:#fff;border-radius:var(--radius);padding:clamp(30px,4.4vw,52px);
  margin-block:clamp(30px,5vw,52px);text-align:center;position:relative;overflow:hidden}
.cta-band::after{content:"";position:absolute;inset:0;opacity:.16;pointer-events:none;
  background-image:radial-gradient(rgba(255,255,255,.9) 1.3px,transparent 1.3px);background-size:24px 24px}
.cta-band>*{position:relative;z-index:2}
.cta-band h2{color:#fff;font-size:clamp(1.35rem,3vw,2.1rem)}
.cta-band p{margin:10px auto 22px;color:rgba(255,255,255,.9);max-width:50ch}
.cta-band .btns{display:flex;flex-wrap:wrap;gap:12px;justify-content:center;align-items:center}
.qrbox{display:inline-flex;flex-direction:column;align-items:center;gap:7px;padding:11px;
  border-radius:15px;background:#fff}
.qrbox img{width:96px;height:96px;border-radius:6px}
.qrbox span{color:#5A3A6B;font-size:.72rem;font-weight:600}

/* ---------- صفحات النصوص ---------- */
.doc{max-width:780px;margin-inline:auto}
.doc-head{text-align:center;padding-block:clamp(32px,5vw,54px) 6px}
.doc-head img{width:74px;border-radius:22px;margin:0 auto 14px;box-shadow:var(--shadow)}
.doc-head h1{font-size:clamp(1.55rem,4vw,2.2rem)}
.doc-head .sub{color:var(--muted);font-size:.88rem;margin-top:6px}
.sheet{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);
  padding:clamp(22px,3.5vw,34px);margin-block:20px;box-shadow:var(--shadow)}
.sheet h2{font-size:1.16rem;margin:26px 0 8px;color:var(--violet)}
.sheet h2:first-child{margin-top:0}
.sheet p{margin:0 0 12px;color:var(--muted)}
.sheet ul{padding-inline-start:20px;margin:0 0 12px;color:var(--muted)}
.sheet li{margin-bottom:6px}
.sheet strong{color:var(--ink);font-weight:600}
.sheet a{color:var(--magenta);font-weight:600;text-decoration:underline;text-underline-offset:3px}
.sheet .note{border-inline-start:3px solid var(--magenta);padding-inline-start:14px;color:var(--ink)}
.en{direction:ltr;text-align:left}
.lang-note{display:flex;align-items:center;gap:10px;justify-content:center;color:var(--muted);font-size:.8rem;margin:32px 0 0}
.lang-note::before,.lang-note::after{content:"";flex:1;height:1px;background:var(--line);max-width:110px}
.faq{margin-top:28px;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;background:var(--paper)}
details{border-bottom:1px solid var(--line)}
details:last-child{border-bottom:0}
summary{cursor:pointer;font-weight:600;list-style:none;display:flex;align-items:center;gap:12px;
  padding:16px 22px;transition:background .2s}
summary:hover{background:#FDF6FF}
summary::-webkit-details-marker{display:none}
summary::before{content:"+";width:22px;height:22px;border-radius:7px;background:rgba(123,35,201,.14);
  color:var(--violet);display:grid;place-items:center;font-weight:700;flex:none;font-size:.94rem}
details[open] summary::before{content:"−"}
details .body{padding:0 22px 20px;color:var(--muted);font-size:.93rem}
details .body p{margin:0 0 10px}
details .body ul{margin:0 0 10px;padding-inline-start:20px}

/* ---------- التذييل ---------- */
footer{background:var(--ink);color:#B79ACB;padding-block:34px 30px;font-size:.87rem;margin-top:20px}
footer .cols{display:flex;flex-wrap:wrap;gap:16px 28px;justify-content:space-between;align-items:center}
footer b{color:#fff}
footer a{color:#E6D6F2}
footer a:hover{color:#FF9F45}
footer nav{display:flex;flex-wrap:wrap;gap:8px 18px}

/* ---------- الظهور ---------- */
.rise{opacity:0;transform:translateY(26px);transition:opacity .7s cubic-bezier(.2,.7,.3,1),transform .7s cubic-bezier(.2,.7,.3,1)}
.rise.in{opacity:1;transform:none}

/* ---------- الاستجابة ---------- */
@media (max-width:940px){
  .wgrid{grid-template-columns:1fr}
  .watch{margin-block:10px 42px}
}
@media (max-width:900px){
  .hero__grid{grid-template-columns:1fr;text-align:center}
  .hero__cta,.hero__meta{justify-content:center}
  .facts__grid{grid-template-columns:1fr 1fr}
  .versus{grid-template-columns:1fr}
  .top__links a:not(.btn){display:none}
}
@media (max-width:520px){
  .brand small{display:none}
  footer .cols{flex-direction:column;text-align:center}
  footer nav{justify-content:center}
  .btn{white-space:normal;text-align:center}
  .kids{text-align:center;justify-content:center}
}
@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
  .rise{opacity:1;transform:none}
  .blob{display:none}
}

/* ============================================================
   إضافات اللقطات الحقيقية — البطل، الجولة، الأطفال، السعودية، التكبير
   ============================================================ */

/* نقاط جوّال البطل */
.dots{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:18px}
.dots [role=tab]{padding:7px 13px;border-radius:999px;font-size:.78rem;font-weight:700;
  color:rgba(255,255,255,.85);background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);
  transition:transform .2s,background .2s,border-color .2s}
.dots [role=tab]:hover{transform:translateY(-2px);background:rgba(255,255,255,.2)}
.dots [role=tab][aria-selected="true"]{background:#fff;color:var(--ink2);border-color:#fff}

/* شريط الجولة */
.toursec .strip{display:flex;gap:clamp(14px,2.4vw,24px);overflow-x:auto;padding:26px clamp(18px,6vw,72px) 14px;
  scroll-snap-type:x mandatory;scrollbar-width:thin;scrollbar-color:var(--violet) transparent;
  -webkit-overflow-scrolling:touch}
.shotcard{flex:none;width:min(226px,62vw);scroll-snap-align:center;margin:0;text-align:center}
.shotcard .zoom{display:block;width:100%;border-radius:30px;overflow:hidden;padding:0;
  background:linear-gradient(160deg,#2C1140,#120620);box-shadow:var(--shadow);
  border:5px solid #1A0B2B;position:relative;
  transition:transform .3s cubic-bezier(.2,.9,.3,1.2),box-shadow .3s}
.shotcard .zoom::after{content:"⤢";position:absolute;top:10px;inset-inline-start:10px;width:30px;height:30px;
  display:grid;place-items:center;border-radius:10px;background:rgba(22,10,34,.55);color:#fff;
  font-size:.95rem;opacity:0;transition:opacity .25s;backdrop-filter:blur(4px)}
.shotcard .zoom:hover{transform:translateY(-8px) rotate(-1deg);box-shadow:var(--shadow-lg)}
.shotcard .zoom:hover::after,.shotcard .zoom:focus-visible::after{opacity:1}
.shotcard img{width:100%;height:auto;border-radius:24px}
.shotcard figcaption{margin-top:12px;font-size:.85rem;font-weight:600;color:var(--muted)}
.shotcard:nth-child(even) .zoom:hover{transform:translateY(-8px) rotate(1deg)}

/* شبكة وضع الأطفال + الهاتفان المصغّران */
.kidgrid{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:clamp(24px,4vw,52px);align-items:center;margin-top:28px}
.cards--kids{margin-top:22px}
.duo{position:relative;display:flex;justify-content:center;min-height:420px}
.mini{position:relative;width:180px;border-radius:26px;padding:0;overflow:hidden;flex:none;
  background:linear-gradient(160deg,#2C1140,#120620);border:5px solid #1A0B2B;
  box-shadow:var(--shadow-lg);transform:rotate(-4deg);z-index:2;
  transition:transform .3s cubic-bezier(.2,.9,.3,1.2)}
.mini--b{position:absolute;inset-inline-end:0;top:52px;transform:rotate(5deg);z-index:1}
.mini:hover{transform:rotate(0) scale(1.05);z-index:3}
.mini img{width:100%;height:auto;border-radius:20px}

/* لوحة صُنع في السعودية */
.saudi{display:flex;gap:20px;align-items:center;text-align:start}
.saudi__flag{font-size:44px;flex:none;filter:drop-shadow(0 6px 14px rgba(60,10,80,.25));
  animation:bob 5s ease-in-out infinite}
.saudi h3{font-size:1.15rem;margin-bottom:6px}
.saudi h3::after{content:"";display:block;width:56px;height:4px;border-radius:99px;background:var(--grad);margin-top:8px}
.saudi p{margin:0;color:var(--muted)}

/* التكبير */
.lb[hidden]{display:none}
.lb{position:fixed;inset:0;z-index:300;display:flex;align-items:center;justify-content:center;gap:14px;
  background:rgba(12,4,20,.9);backdrop-filter:blur(10px);opacity:0;transition:opacity .22s;padding:20px}
.lb.on{opacity:1}
.lb figure{margin:0;text-align:center;max-width:min(400px,82vw)}
.lb img{max-height:78vh;width:auto;max-width:100%;border-radius:26px;border:5px solid #1A0B2B;
  box-shadow:0 40px 90px -20px rgba(0,0,0,.9);margin-inline:auto}
.lb figcaption{color:#E6D6F2;font-size:.9rem;margin-top:14px;font-weight:600}
.lb__x{position:absolute;top:18px;inset-inline-start:18px;width:44px;height:44px;border-radius:14px;
  background:rgba(255,255,255,.12);color:#fff;font-size:1.1rem;transition:background .2s}
.lb__x:hover{background:rgba(232,37,107,.5)}
.lb__nav{width:48px;height:48px;border-radius:50%;background:rgba(255,255,255,.1);color:#fff;
  font-size:1.6rem;flex:none;transition:background .2s,transform .2s;line-height:1}
.lb__nav:hover{background:rgba(255,255,255,.22);transform:scale(1.08)}
.lb :focus-visible{outline-color:#FF9F45}

@media (max-width:940px){
  .kidgrid{grid-template-columns:1fr}
  .duo{min-height:400px;margin-top:8px}
}
@media (max-width:520px){
  .mini{width:150px}
  .mini--b{top:44px}
  .duo{min-height:350px}
  .lb__nav{display:none}
  .saudi{flex-direction:column;text-align:center}
  .saudi h3::after{margin-inline:auto}
}
