/* ==========================================================================
   NEXTGREEN · SILGAR — páginas internacionais (/internacional/, /en/international/ …)
   Carrega-se SÓ nestas páginas, depois de site.css: o resto do site não muda.
   Escrito com propriedades lógicas (inline-start/end) para servir igualmente
   o árabe, que se lê da direita para a esquerda.
   ========================================================================== */

/* ---- tipografia árabe ---------------------------------------------------- */
html[lang^="ar"] body,
html[lang^="ar"] .btn,
html[lang^="ar"] input, html[lang^="ar"] select, html[lang^="ar"] textarea {
  font-family: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
}
html[lang^="ar"] h1, html[lang^="ar"] h2, html[lang^="ar"] h3,
html[lang^="ar"] .tag, html[lang^="ar"] .ix-k, html[lang^="ar"] .ix-step__n {
  font-family: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Segoe UI", Tahoma, sans-serif;
  font-variation-settings: normal; letter-spacing: 0; text-transform: none;
}
html[lang^="ar"] .hero h1 { font-variation-settings: normal; letter-spacing: 0; line-height: 1.3; }
html[lang^="ar"] body { line-height: 1.85; }
html[lang^="ar"] .tag { letter-spacing: 0; }

/* ---- herói --------------------------------------------------------------- */
.ix-hero .hero__in { grid-template-columns: 1fr; padding-bottom: 2.6rem; }
.ix-hero .hero__txt { max-width: 66ch; }
.ix-hero h1 { max-width: 22ch; font-size: var(--t-h1); }
.ix-hero .lead { max-width: 58ch; }
html[lang^="ar"] .ix-hero h1 { max-width: 26ch; }

/* ---- faixa de factos ----------------------------------------------------- */
.ix-strip { background: var(--slate); color: var(--paper); border-block: 1px solid var(--slate-lo); }
.ix-strip__in {
  max-width: var(--wrap); margin-inline: auto; padding: 1.35rem var(--pad-x);
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.4rem;
}
.ix-k { display: block; font-family: var(--display); font-weight: 700; font-size: 1.02rem;
  color: var(--white); margin-bottom: .2rem; }
.ix-strip p { margin: 0; font-size: var(--t-small); color: var(--steel); line-height: 1.5; }
@media (max-width: 900px) { .ix-strip__in { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .ix-strip__in { grid-template-columns: 1fr; gap: 1rem; } }

/* ---- cabeçalhos de secção ------------------------------------------------ */
.ix-h { max-width: 62ch; margin-bottom: 2rem; }
.ix-h h2 { margin-bottom: .5rem; }
.ix-h p { color: var(--ink-mid); margin: 0; }
.sect--dark .ix-h p, .sect--slate .ix-h p { color: var(--steel); }

/* ---- cartões numerados --------------------------------------------------- */
.ix-card { background: var(--white); border: var(--border); border-radius: var(--r-lg); padding: 1.4rem 1.4rem 1.5rem; }
.ix-card h3 { font-size: 1.12rem; margin-bottom: .45rem; }
.ix-card p { margin: 0; font-size: var(--t-small); color: var(--ink-mid); line-height: 1.62; }

/* ---- duas colunas: contexto do país ------------------------------------- */
.ix-two { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(1.6rem, 1rem + 3vw, 3.6rem); align-items: start; }
@media (max-width: 900px) { .ix-two { grid-template-columns: 1fr; } }
.ix-two h3 { font-size: 1.05rem; margin: 1.4rem 0 .5rem; }
.ix-two h3:first-child { margin-top: 0; }
.ix-list { list-style: none; margin: 0; padding: 0; }
.ix-list li { position: relative; padding-block: .62rem; padding-inline-start: 1.35rem;
  border-top: var(--border); font-size: .95rem; line-height: 1.55; }
.ix-list li:first-child { border-top: 0; }
.ix-list li::before { content: ""; position: absolute; inset-inline-start: 0; top: 1.08rem;
  width: .55rem; height: .55rem; border-radius: 50%; background: var(--flow); }
.ix-box { background: var(--paper-lo); border-radius: var(--r-lg); padding: 1.4rem 1.5rem; }
.ix-box .ix-list li { border-top-color: var(--line); }

/* ---- marcas -------------------------------------------------------------- */
.ix-brands { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1px;
  background: var(--slate-lo); border: var(--border-dk); border-radius: var(--r-lg); overflow: hidden; }
.ix-brand { background: var(--slate); padding: 1.3rem 1.35rem 1.4rem; display: flex; flex-direction: column; gap: .8rem; }
.ix-brand__logo { background: var(--white); border-radius: var(--r); height: 66px; display: flex;
  align-items: center; justify-content: center; padding: .6rem 1rem; }
.ix-brand__logo img { max-height: 100%; max-width: 100%; width: auto; height: auto; object-fit: contain; }
.ix-brand h3 { margin: 0; font-size: 1.05rem; color: var(--white); }
.ix-brand p { margin: 0; font-size: var(--t-small); color: var(--steel); line-height: 1.55; }
@media (max-width: 900px) { .ix-brands { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 520px) { .ix-brands { grid-template-columns: 1fr; } }
.ix-others { margin-top: 1.6rem; font-size: var(--t-small); color: var(--steel); line-height: 1.8; }
.ix-others strong { color: var(--paper); }
.ix-aviso { margin-top: 1rem; font-size: .8rem; color: var(--steel); line-height: 1.6; max-width: 80ch; }

/* ---- processo ------------------------------------------------------------ */
.ix-steps { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 1.1rem; counter-reset: s; }
.ix-step { position: relative; background: var(--white); border: var(--border); border-radius: var(--r-lg);
  padding: 1.2rem 1.15rem 1.3rem; counter-increment: s; }
.ix-step__n { font-family: var(--mono); font-size: .72rem; letter-spacing: .12em; color: var(--brass-lo); display: block; margin-bottom: .55rem; }
.ix-step__n::before { content: "0" counter(s); }
.ix-step h3 { font-size: 1rem; margin-bottom: .35rem; }
.ix-step p { margin: 0; font-size: .86rem; color: var(--ink-mid); line-height: 1.55; }
@media (max-width: 1120px) { .ix-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 700px)  { .ix-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 460px)  { .ix-steps { grid-template-columns: 1fr; } }

/* ---- referências com fotografia ------------------------------------------ */
.ix-ref { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.2rem; margin-top: 1.4rem; }
.ix-ref .fobra { margin: 0; }
.ix-ref .fobra img { aspect-ratio: 4/3; object-fit: cover; }
@media (max-width: 700px) { .ix-ref { grid-template-columns: 1fr; } }

/* ---- contacto ------------------------------------------------------------ */
.ix-contact { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: clamp(1.6rem, 1rem + 3vw, 3.6rem); align-items: start; }
@media (max-width: 900px) { .ix-contact { grid-template-columns: 1fr; } }
.ix-contact .lead { color: var(--steel); }
.ix-direct { list-style: none; margin: 1.4rem 0 0; padding: 0; display: grid; gap: .55rem; font-size: .95rem; }
.ix-direct a { color: var(--brass); }
.ix-direct bdi, .ix-direct .mono { direction: ltr; unicode-bidi: isolate; }

/* ---- hub de países ------------------------------------------------------- */
.ix-countries { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
@media (max-width: 1020px) { .ix-countries { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 660px)  { .ix-countries { grid-template-columns: 1fr; } }
.ix-country { background: var(--white); border: var(--border); border-radius: var(--r-lg); padding: 1.5rem; display: flex; flex-direction: column; gap: .6rem; }
.ix-country h3 { margin: 0; font-size: 1.25rem; }
.ix-country p { margin: 0; font-size: var(--t-small); color: var(--ink-mid); line-height: 1.6; }
.ix-country .chips { margin-top: auto; padding-top: .6rem; }

/* ---- migalhas e aviso de idioma ------------------------------------------ */
.ix-other { margin-top: 2rem; font-size: var(--t-small); color: var(--ink-mid); }
.ix-other a { color: var(--slate); text-decoration: underline; text-decoration-color: var(--flow); text-underline-offset: 3px; }

/* ---- DIREITA → ESQUERDA -------------------------------------------------- */
[dir="rtl"] body { text-align: start; }
[dir="rtl"] .lang__menu { right: auto; left: 0; }
[dir="rtl"] .crumbs li + li::before { content: "\\ "; }
[dir="rtl"] .faq summary { padding-inline: 0 2.4rem; }
[dir="rtl"] .faq summary::after { inset-inline-end: auto; inset-inline-start: 0; right: auto; left: 0; }
[dir="rtl"] .faq details p { padding: 0 0 1.35rem 2.4rem; }
[dir="rtl"] .card__more::after { content: " ←"; }
[dir="rtl"] .field input, [dir="rtl"] .field textarea, [dir="rtl"] .field select { text-align: start; }
[dir="rtl"] input[type="email"], [dir="rtl"] input[type="tel"] { direction: ltr; text-align: right; }
[dir="rtl"] .hero::after { inset: auto 30% -55% -20%; }
[dir="rtl"] .hero--foto::before { background: linear-gradient(264deg,
    rgba(6,32,43,.96) 0%, rgba(6,32,43,.90) 32%, rgba(6,32,43,.66) 50%,
    rgba(6,32,43,.30) 74%, rgba(6,32,43,.16) 100%); }
@media (max-width: 940px) { [dir="rtl"] .hero--foto::before { background: linear-gradient(180deg,
    rgba(6,32,43,.90) 0%, rgba(6,32,43,.85) 48%, rgba(6,32,43,.91) 100%); } }

/* armadilha anti-spam: em RTL, deslocá-la para a esquerda cria deslocamento horizontal */
[dir="rtl"] .hp { left: auto; right: -9999px; }

/* grelha de cartões «o que fornecemos» */
.ix-cards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--gap); }
@media (max-width: 960px) { .ix-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 600px) { .ix-cards { grid-template-columns: 1fr; } }
