/* Seasonal theme (Saudi National Day / Founding Day) - see /assets/js/season.js.
   season.js sets html[data-season] and the --s-* colour variables from its config, and forces the
   site's dark mode as the base. This file only recolours: dark-green surfaces, white text, gold accents.
   Everything is scoped to html[data-season], so outside a season nothing here has any effect. */

html[data-season]{
    --dm-bg:var(--s-bg);--dm-bg-alt:var(--s-bg);--dm-surface:var(--s-surface);--dm-surface-alt:var(--s-surface2);
    --dm-text:var(--s-text);--dm-text-muted:var(--s-muted);--dm-border:var(--s-border);
    /* a quiet geometric (Najdi-style triangle) strip, used in thin decorative bands */
    --s-strip:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='10' viewBox='0 0 28 10'%3E%3Cpath d='M0 10 L7 0 L14 10 L21 0 L28 10 Z' fill='none' stroke='%23d4af37' stroke-opacity='.55' stroke-width='1.2'/%3E%3C/svg%3E");
    --s-dots:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='46' height='46' viewBox='0 0 46 46'%3E%3Cpath d='M23 4 L42 23 L23 42 L4 23 Z' fill='none' stroke='%23ffffff' stroke-opacity='.05' stroke-width='1.2'/%3E%3Ccircle cx='23' cy='23' r='2' fill='%23d4af37' fill-opacity='.10'/%3E%3C/svg%3E");
}
html[data-season]{transition:background-color .6s ease}
html[data-season] body{background:var(--s-bg) var(--s-dots);color:var(--s-text)}
html[data-season] ::selection{background:var(--s-accent);color:var(--s-on-accent)}

/* the visitor's own light/dark switch is hidden while the occasion theme is on */
html[data-season] .theme-toggle{display:none!important}

/* ---------- header, menu, footer */
html[data-season] nav{background:linear-gradient(180deg,var(--s-bg2),var(--s-bg))!important;border-bottom:2px solid var(--s-accent);box-shadow:0 8px 28px rgba(0,0,0,.35)}
html[data-season] nav::after{content:"";position:absolute;left:0;right:0;bottom:-12px;height:10px;background:var(--s-strip) repeat-x center top;pointer-events:none;opacity:.9}
html[data-season] .nav-icon,html[data-season] .lang-toggle{background:var(--s-surface2)!important;color:var(--s-text)!important;border:1px solid var(--s-accent)}
html[data-season] .site-menu-btn{background:linear-gradient(135deg,var(--s-green),var(--s-surface2))!important;color:#fff!important;border:1px solid var(--s-accent)}
html[data-season] .site-menu{background:var(--s-bg2)!important;border:1px solid var(--s-accent)!important}
html[data-season] .site-menu a{color:var(--s-text)!important}
html[data-season] .site-menu a:hover{background:var(--s-surface)!important}
html[data-season] #site-footer{background:linear-gradient(170deg,var(--s-bg2),var(--s-bg))!important;border-top:3px solid var(--s-accent);position:relative}
html[data-season] #site-footer::before{content:"";position:absolute;left:0;right:0;top:-13px;height:10px;background:var(--s-strip) repeat-x center top}
html[data-season] #site-footer,html[data-season] #site-footer a,html[data-season] #site-footer p,html[data-season] #site-footer li{color:var(--s-text)}
html[data-season] #site-footer a:hover{color:var(--s-accent-soft)}

/* ---------- headings and accent lines: gold instead of the five logo colours */
html[data-season] body h2::after,html[data-season] body section h2::after,html[data-season] body .detail-section h2::after,html[data-season] body h2.heading-emphasis::after{
    background:linear-gradient(90deg,transparent,var(--s-accent),var(--s-accent-soft),var(--s-accent),transparent)!important;background-size:100% 100%!important;animation:none!important}
html[data-season] .sc-progress i{background:linear-gradient(90deg,var(--s-accent),var(--s-accent),var(--s-accent-soft))!important;box-shadow:0 0 10px var(--s-accent)!important}

/* ---------- buttons (the pink/purple gradient family) */
html[data-season] .qf-next,html[data-season] .qf-panel .form-submit-btn,html[data-season] .form-submit-btn,html[data-season] .qcta,html[data-season] .svx-cta .svx-quote,
html[data-season] #consent-bar .cb-yes,html[data-season] .lg-consent,html[data-season] .qf-badge,html[data-season] .qf-chip:has(input:checked){
    background:linear-gradient(135deg,var(--s-accent),var(--s-accent-soft))!important;color:var(--s-on-accent)!important;box-shadow:0 12px 26px rgba(0,0,0,.4)!important}
html[data-season] .qf-badge{color:var(--s-on-accent)!important}
html[data-season] .qf-badge::before{background:conic-gradient(from 0deg,var(--s-green),var(--s-accent),var(--s-accent-soft),var(--s-green))!important}
html[data-season] .qf-badge::after{border-color:var(--s-accent)!important}
html[data-season] .back-cta a,html[data-season] .contact-email-btn:hover{background:var(--s-accent)!important;color:var(--s-on-accent)!important}
html[data-season] .qf-progress li.is-on b{background:linear-gradient(135deg,var(--s-accent),var(--s-accent-soft))!important;color:var(--s-on-accent)!important}

/* ---------- panels that had a hard-coded navy / teal background */
html[data-season] .contact-form-inner,html[data-season] .contact-form-inner:has(.qf){
    background:radial-gradient(900px 500px at 8% 0%,rgba(212,175,55,.18),transparent 60%),radial-gradient(800px 480px at 100% 100%,rgba(31,157,92,.28),transparent 60%),linear-gradient(135deg,var(--s-bg) 0%,var(--s-bg2) 100%)!important;
    box-shadow:0 30px 70px rgba(0,0,0,.45),0 0 0 1px var(--s-accent)}
html[data-season] .contact-blob-1,html[data-season] .contact-blob-2{opacity:.22}
html[data-season] .contact-form-panel.qf-panel{background:var(--s-surface)!important;color:var(--s-text)}
html[data-season] .qf-panel::before{background:linear-gradient(90deg,var(--s-green),var(--s-accent),var(--s-accent-soft),var(--s-green))}
html[data-season] .svx-cta,html[data-season] .contact-card,html[data-season] .ai-promo-banner,html[data-season] .page-header{background:linear-gradient(135deg,var(--s-bg2),var(--s-surface))!important;border:1px solid var(--s-accent)}
html[data-season] .qf-chip,html[data-season] .qf-tile,html[data-season] .qf-progress li{background:var(--s-surface2)!important;border-color:var(--s-border)!important;color:var(--s-text)!important}
html[data-season] .qf-tile:has(input:checked){background:linear-gradient(135deg,var(--s-bg),var(--s-surface2))!important;border-color:var(--s-accent)!important;box-shadow:0 0 0 4px rgba(212,175,55,.3),0 16px 34px rgba(0,0,0,.4)!important}
html[data-season] .qf-progress li.is-on{background:var(--s-bg)!important;border:1px solid var(--s-accent)}
html[data-season] .qf-progress b{background:var(--s-surface)!important;color:var(--s-text)!important}
html[data-season] .qf-chip > i{color:var(--s-accent)!important}
html[data-season] .qf-chip:has(input:checked) > i{color:var(--s-on-accent)!important}
html[data-season] .qf-chip span,html[data-season] .qf-tile span,html[data-season] .qf legend,html[data-season] .qf-q,html[data-season] .qf-lead{color:var(--s-text)!important}
html[data-season] .qf-panel .form-field input,html[data-season] .qf-panel .form-field textarea{color:var(--s-text)!important;border-color:var(--s-border)!important}
html[data-season] .qf-panel .form-field label{color:var(--s-muted)!important}
html[data-season] .qf-panel .form-field.message-field textarea{background:var(--s-surface2)!important}
html[data-season] .qf-back{background:transparent!important;color:var(--s-text)!important;border-color:var(--s-accent)!important}
html[data-season] .svx-steps li,html[data-season] .svx-why li,html[data-season] .svx-faq details,html[data-season] .svx-relcard{background:var(--s-surface)!important;border-color:var(--s-border)!important}
html[data-season] .svx-steps li::before{color:var(--s-on-accent)!important;background:var(--s-accent)!important;border-color:var(--s-accent)!important}
html[data-season] .svx-why li{border-inline-start-color:var(--s-accent)!important}
html[data-season] .svx-why li > i{color:var(--s-accent)!important}
html[data-season] .svx-relcard::before{background:var(--s-accent)!important}
html[data-season] .svx-relicon{background:var(--s-surface2)!important;border-color:var(--s-accent)!important;color:var(--s-accent)!important}
html[data-season] .svx-faq details[open]{border-color:var(--s-accent)!important}
html[data-season] .svx-faq summary::after{background:var(--s-accent)!important;color:var(--s-on-accent)!important}
html[data-season] #consent-bar{background:var(--s-bg2)!important;border:1px solid var(--s-accent)}
html[data-season] .whatsapp-float{box-shadow:0 10px 25px rgba(0,0,0,.4),0 0 0 2px var(--s-accent)}
html[data-season] .service-card,html[data-season] .national-card,html[data-season] .why-card{border:1px solid var(--s-border)}
html[data-season] .service-card:hover{border-color:var(--s-accent)}
html[data-season] .nx-hero,html[data-season] #nx section:nth-child(even){background-color:var(--s-bg2)!important}

/* ---------- welcome dialog */
html.sd-lock{overflow:hidden}
.sd-overlay{position:fixed;inset:0;z-index:5000;display:grid;place-items:center;padding:18px;background:rgba(2,18,10,.74);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);opacity:0;transition:opacity .35s ease}
.sd-overlay.is-on{opacity:1}
.sd-card{position:relative;width:min(520px,100%);max-height:calc(100vh - 36px);overflow:auto;text-align:center;color:var(--s-text,#fff);padding:46px 34px 34px;border-radius:28px;outline:0;
    background:radial-gradient(520px 260px at 50% -10%,rgba(212,175,55,.25),transparent 70%),linear-gradient(160deg,var(--s-bg2,#073d26),var(--s-bg,#052e1c));
    border:2px solid var(--s-accent,#d4af37);box-shadow:0 0 0 6px rgba(212,175,55,.14),0 40px 90px rgba(0,0,0,.6);transform:translateY(24px) scale(.96);transition:transform .45s cubic-bezier(.2,.8,.2,1)}
.sd-overlay.is-on .sd-card{transform:none}
.sd-card::before{content:"";position:absolute;inset:10px;border:1px solid rgba(212,175,55,.45);border-radius:20px;pointer-events:none}
.sd-orn{height:10px;margin:0 auto 18px;width:70%;background:var(--s-strip,none) repeat-x center;opacity:.9}
.sd-emblem{display:block;margin:0 auto 12px;width:84px;height:84px;object-fit:contain;filter:drop-shadow(0 6px 14px rgba(0,0,0,.5))}
.sd-eyebrow{margin:0 0 8px;font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--s-accent-soft,#f0d98a)}
.sd-title{margin:0 0 14px;font-size:clamp(28px,6vw,40px);line-height:1.35;font-weight:800;color:#fff;background:none;-webkit-text-fill-color:#fff}
.sd-title::after{display:none!important}
.sd-sub{margin:0 auto 26px;max-width:420px;font-size:16px;line-height:1.85;color:var(--s-muted,#cfe8d7)}
.sd-cta{font:inherit;font-weight:800;font-size:16px;padding:14px 38px;border-radius:999px;border:0;cursor:pointer;color:var(--s-on-accent,#052e1c);background:linear-gradient(135deg,var(--s-accent,#d4af37),var(--s-accent-soft,#f0d98a));box-shadow:0 14px 30px rgba(0,0,0,.4);transition:transform .2s,box-shadow .2s}
.sd-cta:hover{transform:translateY(-3px);box-shadow:0 18px 36px rgba(0,0,0,.5)}
.sd-x{position:absolute;top:14px;inset-inline-end:14px;width:40px;height:40px;border-radius:50%;border:1px solid var(--s-accent,#d4af37);background:rgba(255,255,255,.08);color:#fff;font-size:26px;line-height:1;cursor:pointer;display:grid;place-items:center;z-index:2}
.sd-x:hover{background:var(--s-accent,#d4af37);color:var(--s-on-accent,#052e1c)}
.sd-cta:focus-visible,.sd-x:focus-visible{outline:3px solid #fff;outline-offset:3px}
@media (max-width:560px){.sd-card{padding:40px 20px 26px;border-radius:22px}.sd-emblem{width:70px;height:70px}}
@media (prefers-reduced-motion:reduce){.sd-overlay,.sd-card,html[data-season]{transition:none}}
.sd-flag{display:inline-block;height:.8em;width:auto;vertical-align:-.05em;margin-inline-start:.2em;border-radius:3px;box-shadow:0 2px 8px rgba(0,0,0,.45)}

/* ---------- gradient headings and brand-coloured icons -> gold / white on green */
html[data-season] h2.heading-emphasis,html[data-season] .about-shimmer-heading,html[data-season] .why-melodies-heading,html[data-season] .contact-info-panel h3,html[data-season] .capability-content h2,html[data-season] .ksa-map-text h3,html[data-season] .impact-globe-text h3{
    background-image:linear-gradient(90deg,#fff,var(--s-accent-soft),#fff)!important;background-size:200% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent}
html[data-season] .contact-form-panel.qf-panel h2,html[data-season] .contact-form-panel.qf-panel h2.heading-emphasis{background:none!important;-webkit-text-fill-color:var(--s-text)!important;color:var(--s-text)!important}
html[data-season] .service-icon,html[data-season] .service-icon-wrap .service-icon,html[data-season] .icon-badge,html[data-season] .nex-ico,html[data-season] .mval-orb,html[data-season] .ai-card .ai-ico{background:var(--s-surface2)!important;color:var(--s-accent)!important;border:1px solid var(--s-accent)!important;box-shadow:0 8px 20px rgba(0,0,0,.35)!important}
html[data-season] .service-icon i,html[data-season] .icon-badge i{color:var(--s-accent)!important;-webkit-text-fill-color:var(--s-accent)!important}
html[data-season] .service-icon-ring{border-color:var(--s-accent)!important}
html[data-season] .sc-more,html[data-season] .nex-more{color:var(--s-accent-soft)!important}
html[data-season] .qf-tile .qf-ico{background:var(--s-surface)!important;color:var(--s-accent)!important;border:1px solid var(--s-accent);box-shadow:none!important}
html[data-season] .qf-tile .qf-tick{background:var(--s-accent)!important;color:var(--s-on-accent)!important}

/* ---------- vision / mission cards, orbs and other hard-coded colour gradients */
html[data-season] .mvx-vision{--sh:rgba(0,0,0,.7);background:linear-gradient(140deg,var(--s-bg) 0%,var(--s-surface2) 55%,var(--s-green) 100%)!important}
html[data-season] .mvx-mission{--sh:rgba(0,0,0,.7);background:linear-gradient(140deg,var(--s-green) 0%,var(--s-surface2) 45%,var(--s-bg) 100%)!important}
html[data-season] .mvx-bg i{background:radial-gradient(circle,color-mix(in srgb,var(--s-accent) 38%,transparent),transparent 68%)!important}
html[data-season] .mvx-tag{color:var(--s-accent-soft)!important}
html[data-season] .mval-orb,html[data-season] .mval-card{--c:var(--s-accent)}
html[data-season] .nex-orb{filter:saturate(.9)}
html[data-season] .melodies-marquee,html[data-season] .melodies-marquee *{color:var(--s-accent-soft)}

/* =====================================================================================
   RAMADAN  (html[data-season="ramadan"]) - night navy, deep green, warm gold, ivory.
   Decoration: twinkling stars, a hanging crescent, lanterns (>=1100px), a geometric star strip.
   Everything is decorative, pointer-events:none, and stops for prefers-reduced-motion.
   ===================================================================================== */
html[data-season="ramadan"]{
    --s-strip:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='12' viewBox='0 0 26 12'%3E%3Cpath d='M13 1l1.6 3.4 3.7.5-2.7 2.6.7 3.7-3.3-1.8-3.3 1.8.7-3.7-2.7-2.6 3.7-.5z' fill='none' stroke='%23e0a93b' stroke-opacity='.7' stroke-width='.9'/%3E%3C/svg%3E");
    --s-dots:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='64' height='64' viewBox='0 0 64 64'%3E%3Cpath d='M32 6l5.5 11.8 12.9 1.6-9.4 8.9 2.4 12.8L32 34.6l-11.4 6.5 2.4-12.8-9.4-8.9 12.9-1.6z' fill='none' stroke='%23fbf6e8' stroke-opacity='.045' stroke-width='1.1'/%3E%3Ccircle cx='32' cy='32' r='1.6' fill='%23e0a93b' fill-opacity='.08'/%3E%3C/svg%3E")}
html[data-season="ramadan"] body{
    background:radial-gradient(900px 520px at 85% -8%,rgba(224,169,59,.16),transparent 62%),radial-gradient(760px 520px at 6% 8%,rgba(15,90,68,.45),transparent 62%),var(--s-bg) var(--s-dots)}
html[data-season="ramadan"] nav{background:linear-gradient(180deg,#0e1a40,var(--s-bg))!important}
html[data-season="ramadan"] #site-footer{background:linear-gradient(170deg,#0f2a2c,var(--s-bg))!important}
html[data-season="ramadan"] .contact-form-inner,html[data-season="ramadan"] .contact-form-inner:has(.qf){
    background:radial-gradient(900px 500px at 8% 0%,rgba(224,169,59,.2),transparent 60%),radial-gradient(800px 480px at 100% 100%,rgba(15,90,68,.55),transparent 60%),linear-gradient(135deg,var(--s-bg) 0%,var(--s-bg2) 100%)!important}

/* starry night: a fixed, very light layer of twinkling dots */
html[data-season="ramadan"]::after{
    content:"";position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.5;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='520' height='520'%3E%3Cg fill='%23fbf6e8'%3E%3Ccircle cx='38' cy='62' r='1.1'/%3E%3Ccircle cx='132' cy='318' r='.8'/%3E%3Ccircle cx='214' cy='96' r='1.4'/%3E%3Ccircle cx='296' cy='452' r='.9'/%3E%3Ccircle cx='356' cy='170' r='1.1'/%3E%3Ccircle cx='448' cy='38' r='.8'/%3E%3Ccircle cx='482' cy='388' r='1.3'/%3E%3Ccircle cx='72' cy='470' r='1'/%3E%3Ccircle cx='410' cy='262' r='.8'/%3E%3Ccircle cx='170' cy='214' r='.7'/%3E%3C/g%3E%3Cg fill='%23f4d98f'%3E%3Cpath d='M250 250l1.6 4.4 4.4 1.6-4.4 1.6-1.6 4.4-1.6-4.4-4.4-1.6 4.4-1.6z'/%3E%3Cpath d='M92 160l1.2 3.3 3.3 1.2-3.3 1.2-1.2 3.3-1.2-3.3-3.3-1.2 3.3-1.2z'/%3E%3Cpath d='M430 120l1.2 3.3 3.3 1.2-3.3 1.2-1.2 3.3-1.2-3.3-3.3-1.2 3.3-1.2z'/%3E%3C/g%3E%3C/svg%3E");
    background-size:520px 520px;animation:rmd-twinkle 6s ease-in-out infinite alternate}
@keyframes rmd-twinkle{from{opacity:.28}to{opacity:.62}}

/* hanging crescent (always) and lanterns (wide screens only) */
#season-deco{position:fixed;left:0;right:0;top:var(--nb,70px);height:0;z-index:900;pointer-events:none}
#season-deco .g{fill:var(--s-accent)}
#season-deco .rl-s{display:block;width:1.5px;margin:0 auto;background:linear-gradient(var(--s-accent),rgba(224,169,59,.2))}
#season-deco .rc{position:absolute;top:-2px;left:50%;width:40px;transform:translateX(-50%);transform-origin:50% 0;animation:rmd-swing 7s ease-in-out infinite}
#season-deco .rc .rl-s{height:10px}
#season-deco .rc svg{display:block;width:100%;height:auto;filter:drop-shadow(0 0 8px rgba(244,217,143,.75));animation:rmd-glow 4s ease-in-out infinite alternate}
#season-deco .rl{position:absolute;top:-2px;width:var(--w);display:none;transform-origin:50% 0;animation:rmd-swing 5.6s ease-in-out infinite;animation-delay:var(--d,0s)}
#season-deco .rl .rl-s{height:var(--len)}
#season-deco .rl svg{display:block;width:100%;height:auto;filter:drop-shadow(0 0 12px rgba(255,190,80,.7));animation:rmd-glow 3.6s ease-in-out infinite alternate;animation-delay:var(--d,0s)}
#season-deco .rl-glass{fill:rgba(255,196,88,.55);stroke:var(--s-accent);stroke-width:1.2}
#season-deco .rl-rib{fill:none;stroke:var(--s-accent);stroke-width:1;opacity:.85}
#season-deco .rl-flame{fill:#fff3c4}
@media (min-width:1100px){#season-deco .rl{display:block}}
@media (max-width:600px){#season-deco .rc{width:30px}#season-deco .rc .rl-s{height:5px}}
@keyframes rmd-swing{0%,100%{transform:rotate(-2.2deg)}50%{transform:rotate(2.2deg)}}
#season-deco .rc{animation-name:rmd-swing-c}
@keyframes rmd-swing-c{0%,100%{transform:translateX(-50%) rotate(-2deg)}50%{transform:translateX(-50%) rotate(2deg)}}
@keyframes rmd-glow{from{filter:drop-shadow(0 0 5px rgba(255,190,80,.35))}to{filter:drop-shadow(0 0 15px rgba(255,205,110,.95))}}

/* welcome dialog */
.sd-overlay[data-sd="ramadan"] .sd-card{
    background:radial-gradient(420px 220px at 50% -8%,rgba(244,217,143,.3),transparent 70%),radial-gradient(300px 200px at 90% 100%,rgba(15,90,68,.55),transparent 70%),linear-gradient(165deg,var(--s-bg2),var(--s-bg))}
.sd-overlay[data-sd="ramadan"] .sd-card::after{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;opacity:.7;
    background-image:var(--s-dots)}
.sd-overlay[data-sd="ramadan"] .sd-emblem{width:88px;height:88px;animation:rmd-glow 3.6s ease-in-out infinite alternate}
.sd-overlay[data-sd="ramadan"] .sd-card > *{position:relative;z-index:1}
@media (prefers-reduced-motion:reduce){
    html[data-season="ramadan"]::after,#season-deco .rc,#season-deco .rl,#season-deco svg,.sd-overlay[data-sd="ramadan"] .sd-emblem{animation:none!important}
    html[data-season="ramadan"]::after{opacity:.4}
}

/* light pill buttons on the national-events pages used a dark-green text colour from the page's own variables */
html[data-season] #nx .nx-btn--light,html[data-season] #nx .nx-btn--light span,html[data-season] .nex-cta,html[data-season] .nex-cta span{color:var(--s-text)!important}
html[data-season] #nx .nx-btn--light{background:var(--s-surface2)!important;border:1px solid var(--s-accent)}

/* ---------- Ramadan: denser starry sky, a large clear crescent, more lanterns */
html[data-season="ramadan"]::before{
    content:"";position:fixed;inset:0;z-index:2;pointer-events:none;opacity:.45;
    background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='360'%3E%3Cg fill='%23fbf6e8'%3E%3Ccircle cx='20' cy='34' r='.9'/%3E%3Ccircle cx='66' cy='210' r='1.2'/%3E%3Ccircle cx='98' cy='96' r='.7'/%3E%3Ccircle cx='140' cy='300' r='1'/%3E%3Ccircle cx='182' cy='18' r='1.3'/%3E%3Ccircle cx='214' cy='164' r='.8'/%3E%3Ccircle cx='250' cy='330' r='1'/%3E%3Ccircle cx='286' cy='72' r='1.1'/%3E%3Ccircle cx='318' cy='240' r='.8'/%3E%3Ccircle cx='344' cy='126' r='1.2'/%3E%3Ccircle cx='46' cy='318' r='.8'/%3E%3Ccircle cx='160' cy='140' r='.7'/%3E%3Ccircle cx='330' cy='20' r='.9'/%3E%3Ccircle cx='120' cy='236' r='.7'/%3E%3C/g%3E%3Cg fill='%23f4d98f'%3E%3Cpath d='M76 40l1.5 4 4 1.5-4 1.5-1.5 4-1.5-4-4-1.5 4-1.5z'/%3E%3Cpath d='M240 214l1.8 4.8 4.8 1.8-4.8 1.8-1.8 4.8-1.8-4.8-4.8-1.8 4.8-1.8z'/%3E%3Cpath d='M296 286l1.3 3.6 3.6 1.3-3.6 1.3-1.3 3.6-1.3-3.6-3.6-1.3 3.6-1.3z'/%3E%3Cpath d='M30 150l1.3 3.6 3.6 1.3-3.6 1.3-1.3 3.6-1.3-3.6-3.6-1.3 3.6-1.3z'/%3E%3C/g%3E%3C/svg%3E");
    background-size:360px 360px;background-position:90px 140px;animation:rmd-twinkle 4.5s ease-in-out -2s infinite alternate}
html[data-season="ramadan"]::after{opacity:.62}
#season-moon{position:absolute;z-index:3;pointer-events:none;top:calc(var(--nb,70px) + 22px);inset-inline-end:23%;width:118px;animation:rmd-glow 4.5s ease-in-out infinite alternate}
#season-moon svg{display:block;width:100%;height:auto}
@media (max-width:900px){#season-moon{width:76px;inset-inline-end:5%;top:calc(var(--nb,70px) + 10px)}}
@media (max-width:480px){#season-moon{width:58px;inset-inline-end:4%}}
#season-deco .rc{width:52px}
@media (max-width:600px){#season-deco .rc{width:34px}}
#season-deco .rl--s{display:none}
@media (min-width:700px){#season-deco .rl--s{display:block}}
@media (max-width:1099px){#season-deco .rl:not(.rl--s){display:none}}
@media (min-width:1100px){#season-deco .rl,#season-deco .rl--s{display:block}}
@media (prefers-reduced-motion:reduce){html[data-season="ramadan"]::before,#season-moon{animation:none!important}}