/*
 * English site layer (dir=ltr) — maghzrayaneh.ir/en/
 *
 * The design system already uses logical properties (padding-inline, inset-inline-end,
 * border-inline-start), so the layout mirrors itself correctly once <html> carries
 * dir="ltr". This file only changes what is genuinely script-dependent:
 *   1. the Latin type stack (Peyda is a Persian face; its Latin digits and letters are not
 *      the brand's English typography, and no Latin webfont download is needed),
 *   2. line-height and letter-spacing tuned for Latin running text,
 *   3. the two blocks the English pages add: the service call to action and the legal notice.
 *
 * Loaded after design-system-footer-20261008-v4.css, only by views/en/master.volt.
 */

html[lang="en"] body{
    font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,"Noto Sans",sans-serif;
    line-height:1.65;
    letter-spacing:0;
    font-synthesis-weight:auto
}

html[lang="en"] h1,
html[lang="en"] h2,
html[lang="en"] h3,
html[lang="en"] h4{
    line-height:1.22;
    letter-spacing:-.012em;
    text-wrap:balance
}

html[lang="en"] p{
    max-width:72ch
}

/* Persian body copy is set at line-height 2 to suit the script; Latin needs less air. */
html[lang="en"] .rich-content p{line-height:1.72}
html[lang="en"] .rich-content li{line-height:1.7}
html[lang="en"] .rich-content h2{margin-block:38px 12px}
html[lang="en"] .rich-content h3{margin-block:30px 10px}
html[lang="en"] .rich-content table{width:100%;border-collapse:collapse}
html[lang="en"] .rich-content th,
html[lang="en"] .rich-content td{text-align:left}

html[lang="en"] .hero-copy h1{max-width:20ch}
html[lang="en"] .hero-copy h3,
html[lang="en"] .service-card p,
html[lang="en"] .section-heading p{max-width:60ch}

html[lang="en"] .card-action,
html[lang="en"] .footer-contact-button,
html[lang="en"] .footer-top-link{letter-spacing:0}

/* Call to action at the foot of every English service page. */
.service-cta{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:16px;
    margin-top:28px;
    background:var(--brand-soft);
    border-color:#d5d9ff
}

.service-cta p{
    margin:0;
    font-weight:700;
    color:var(--brand);
    max-width:46ch
}

/* One-line notice that the Persian terms are the governing text. */
.legal-notice{
    padding:18px clamp(18px,2.4vw,26px);
    margin-bottom:22px;
    font-size:15px;
    color:var(--muted);
    background:#fff;
    box-shadow:none
}

.legal-notice a{color:var(--brand);font-weight:700}

@media(max-width:767px){
    .service-cta{align-items:flex-start}
    .service-cta .button{width:100%;justify-content:center}
    html[lang="en"] body{line-height:1.6}
}