/* ===========================================================================
   Arabdown Child — Layout
   ---------------------------------------------------------------------------
   تخطيط عام للابن: container، spacing بين الأقسام، حماية من horizontal scroll.
   لا يُقاتل القالب الأب — مجرد قواعد بنيوية مساندة.

   📦 محتوى الملف بداخل @layer layout (declared in golden-ratio.css).
   ============================================================================ */
@layer layout {


/* ============================================================
 * (1) Container max-width للابن
 * ============================================================ */
.ad-container {
    max-inline-size: var(--ad-wide-max, 1200px);
    margin-inline: auto;
    padding-inline: var(--ad-space-md, 21px);
    box-sizing: border-box;
}

.hp-section + .hp-section {
    margin-block-start: var(--ad-space-2xl, 89px);
}


/* ============================================================
 * (2) Horizontal overflow guards — يمنع scroll أفقي على الجوال
 * ============================================================ */
html, body {
    overflow-x: hidden;
    max-width: 100vw;
}

img, picture, video, iframe, embed, object {
    max-width: 100%;
    height: auto;
}

table {
    display: block;
    overflow-x: auto;
    max-width: 100%;
}

/* iOS: منع zoom التلقائي على inputs بحجم < 16px */
input[type="text"],
input[type="email"],
input[type="search"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
    font-size: max(16px, 1rem);
}


/* ============================================================
 * (3) Smooth scroll — احترام prefers-reduced-motion
 * ============================================================ */
html {
    scroll-behavior: smooth;
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
}

} /* end @layer layout */