/* Visual layer shared by the homepage and medicine guide. */
:root{--navy:#102f3a;--ink:#102f3a;--teal:#247969;--mint:#c5edce;--cream:#f8f9f5;--line:#dfe6df}
body{background:var(--cream)}button{cursor:pointer}button.button{font-family:inherit}button.secondary{background:transparent;color:var(--ink)}.site-header{background:#f8f9f5f2}.nav{height:88px;gap:22px}.nav .brand{margin-inline-end:auto}.nav nav{gap:27px;align-items:center}.nav nav button{background:none;border:0;padding:0;color:inherit;font-size:14px}.nav nav button span{color:var(--teal);padding-right:5px}.nav nav a[aria-current]{color:var(--teal);box-shadow:0 2px var(--teal)}.navcontact{background:var(--navy);color:white;border-radius:50px;padding:9px 20px}.menu-toggle{width:43px;height:43px;border:1px solid #ccd8d0;border-radius:50%;display:flex;flex-direction:column;gap:5px;justify-content:center;align-items:center;background:transparent;flex-shrink:0}.menu-toggle span{width:17px;height:1.5px;background:var(--ink)}.menu-toggle span:nth-child(2){width:12px;margin-right:5px}.hero{min-height:680px;gap:70px;padding-block:64px 80px}.hero h1{font-size:clamp(44px,5.2vw,72px);line-height:1.35;font-weight:600}.hero h1 em:after{display:none}.hero .eyebrow{border:1px solid #cdded0;border-radius:30px;padding:6px 14px;width:fit-content;background:#edf4eb;font-size:12px}.hero .intro{font-size:17px;max-width:420px}.button{border-radius:40px;padding:14px 24px}.hero-art{aspect-ratio:0.94;isolation:isolate}.image-disc{width:93%;height:94%;border-radius:180px 180px 28px 28px;border:8px solid #fff;box-shadow:0 25px 60px #163b3520}.image-disc img{object-position:center}.orbit.one{width:105%;height:102%;border-radius:220px 220px 40px 40px;transform:rotate(-6deg);border-color:#bad1bd;z-index:-1}.orbit.two{display:none}.top-tag{top:50px;left:-24px;border-radius:40px;transform:rotate(-6deg);background:#e8f5df;border-color:#cee2c2}.bottom-tag{bottom:20px;right:-20px;border-radius:16px}.art-label{bottom:-22px;letter-spacing:2px}.hero-foot{margin-top:30px}.topic-strip{background:var(--navy);color:#dfeee3;border:0;padding:16px 0}.topic-strip i{color:var(--mint)}.topic-strip .wrap{font-size:14px}.quick-hub{display:grid;grid-template-columns:repeat(3,1fr);gap:18px;padding-top:48px}.hub-card{display:flex;align-items:center;text-align:right;gap:15px;border:1px solid var(--line);background:white;border-radius:18px;padding:24px 19px;color:var(--ink);transition:transform .2s,box-shadow .2s}.hub-card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #102f3a09}.hub-icon{width:46px;height:46px;display:grid;place-items:center;flex-shrink:0;border-radius:14px;background:#eef4e9;color:var(--teal);font-size:27px}.hub-card small{font-size:10px;color:var(--teal)}.hub-card h2{font-size:21px;margin:2px 0;letter-spacing:0}.hub-card p{font-size:11px;color:var(--muted);margin:0}.hub-arrow{margin-right:auto;color:var(--teal)}.section{padding-block:85px}.content-section{background:#edf1e9}.cover{border-radius:20px}.content-card{background:white;border-radius:20px;padding:10px;box-shadow:0 5px 15px #102f3a04}.card-info{padding:18px 12px}.card-info h3{font-size:18px}.content-grid{gap:22px}.about-copy{font-size:16px}.topics{gap:20px}.topics article{background:#fff;border:1px solid var(--line);border-radius:20px;padding:26px}.topics p{font-size:14px}.contact{background:#102f3a;border-radius:28px}.contact-deco{color:#244c45}.reels-grid{grid-template-columns:repeat(auto-fill,minmax(230px,1fr));max-width:100%}.reel-card{max-width:300px}.reel-cover{border-radius:20px}.drug-teaser{background:#e8f0e5}.chat-launcher{box-shadow:0 8px 30px #102f3a25}.chat-panel{border-radius:22px}.dg-hero{background:radial-gradient(ellipse at 10% 20%,#dbead7,transparent 60%),#f0f5ec}.site-menu{position:fixed;inset:0 0 0 auto;margin:0;width:min(400px,92vw);max-width:100%;height:100dvh;max-height:100dvh;border:0;padding:30px;background:var(--cream);color:var(--ink);box-shadow:-20px 0 90px #102f3a22;overflow:auto}.site-menu::backdrop{background:#102f3a88;backdrop-filter:blur(5px)}.menu-is-open{overflow:hidden}.menu-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:38px}.menu-top .eyebrow{margin:0}.menu-top button{background:transparent;border:1px solid var(--line);border-radius:50%;width:36px;height:36px}.site-menu nav{display:grid;margin-top:36px}.site-menu nav a,.site-menu nav button{display:flex;align-items:center;gap:16px;padding:18px 0;border:0;border-bottom:1px solid var(--line);background:transparent;color:inherit;text-align:right;font:inherit;font-size:19px}.site-menu nav small{font-size:10px;color:var(--teal)}.site-menu nav span{margin-right:auto;color:var(--teal)}.menu-note{font-size:12px;color:var(--muted);margin-top:34px}:focus-visible{outline:3px solid #328777;outline-offset:4px}
@media(max-width:1000px){.nav nav{gap:17px}.navcontact{display:none}.hero{gap:35px}.quick-hub{gap:10px}.hub-card{padding:18px 12px;gap:10px}.hub-icon{width:36px;height:36px}.hub-arrow{display:none}}
@media(max-width:760px){.nav nav{display:none}.nav{height:76px;gap:12px}.nav .brand{font-size:15px;margin-inline-end:0}.navcontact{display:block;margin-inline-start:auto;font-size:11px;padding:7px 14px}.navcontact span{display:none}.hero{grid-template-columns:1fr;padding-block:38px 58px;gap:40px}.hero h1{font-size:49px}.hero .intro{font-size:16px}.hero-art{width:min(87%,370px);margin-inline:auto}.hero-foot{display:none}.hero .actions{gap:8px}.hero .button{padding:12px 17px;font-size:12px;gap:12px}.quick-hub{grid-template-columns:1fr;padding-top:28px;gap:10px}.hub-card{padding:16px 20px;gap:16px}.hub-card h2{font-size:19px}.hub-card p{font-size:12px}.hub-icon{width:44px;height:44px}.hub-arrow{display:block}.section{padding-block:58px}.content-grid{grid-template-columns:1fr}.content-card{display:grid;grid-template-columns:38% 1fr;gap:8px}.card-info{padding:10px}.card-info h3{font-size:16px}.topics{grid-template-columns:1fr}.topics article{padding:22px}.topic-number{left:20px}.contact{padding:34px 26px}.reels-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.reel-card h3{font-size:14px}.top-tag{left:-12px}.bottom-tag{right:-10px}.site-menu .brand{font-size:17px}}
@media(max-width:380px){.navcontact{display:none}.wrap{width:calc(100% - 30px)}.hero h1{font-size:43px}.brand small{letter-spacing:0}.reels-grid{grid-template-columns:1fr}.reel-card{max-width:280px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}

/* إصلاح عرض الموبايل: ما في عنصر يقدر يوسّع الصفحة لبرّا الشاشة */
html,body{max-width:100%;overflow-x:clip}
@supports not (overflow:clip){body{overflow-x:hidden}}
img,video,iframe{max-width:100%}
@media(max-width:380px){.reels-grid,.reel-filters,.dg-cats{margin-inline:-15px;padding-inline:15px}}

.image-disc img{object-position:50% 22%}
.contact-body .button{margin:4px 0 4px 8px}
