/* Country landing pages + hubs (country.php). Dark hero in the v3 palette, readable article column, sticky price card. */
.cp-page { --ink: #1A1530; --night: #120C26; --night-2: #1B1438; --violet: #7C41D8; --violet-2: #9B6BEB; --lav: #C9B3F7; --signal: #3EE6A8;
  --paper: #F6F4FB; --mist: #B6AECF; --line: rgba(26, 21, 48, .1); --text-2: #4B4560;
  --display: 'Archivo', system-ui, sans-serif; --body: 'Public Sans', system-ui, sans-serif;
  margin: 0; background: var(--paper); color: var(--ink); font: 400 17px/1.75 var(--body); }
html[lang="ar"] .cp-page { --display: 'Alexandria', 'Archivo', system-ui, sans-serif; --body: 'IBM Plex Sans Arabic', 'Public Sans', system-ui, sans-serif; line-height: 1.95; }
.cp-page *, .cp-page *::before, .cp-page *::after { box-sizing: border-box; }
.cp-wrap { max-width: 1180px; margin-inline: auto; padding-inline: 20px; }
.cp-main h1, .cp-main h2, .cp-main h3, .cp-main p { margin: 0; }

/* hero */
.cp-hero { position: relative; overflow: hidden; padding: 140px 0 110px; color: #fff;
  background: radial-gradient(55% 85% at 90% 0%, rgba(124, 65, 216, .55), transparent 70%), radial-gradient(40% 60% at 0% 100%, rgba(62, 230, 168, .14), transparent 70%), var(--night); }
.cp-crumbs { display: flex; flex-wrap: wrap; gap: 8px; font-size: .85rem; color: var(--mist); }
.cp-crumbs a { color: var(--lav); text-decoration: none; }
.cp-crumbs a:hover { text-decoration: underline; }
.cp-country { position: absolute; inset-inline-end: 2%; bottom: -.18em; font: 900 clamp(4rem, 14vw, 11rem)/1 var(--display); font-stretch: 125%; color: rgba(255, 255, 255, .05); white-space: nowrap; pointer-events: none; letter-spacing: -.04em; }
html[lang="ar"] .cp-country { font-stretch: normal; letter-spacing: 0; }
.cp-h1 { position: relative; margin-top: 1.1rem !important; max-width: 22ch; font: 900 clamp(2rem, 4.6vw, 3.6rem)/1.06 var(--display); font-stretch: 118%; letter-spacing: -.03em; }
html[lang="ar"] .cp-h1 { font-stretch: normal; letter-spacing: 0; line-height: 1.35; font-weight: 800; max-width: 24ch; }
.cp-lede { position: relative; margin-top: 1.2rem !important; max-width: 60ch; font-size: clamp(1.02rem, 1.4vw, 1.18rem); color: var(--mist); }

/* layout */
.cp-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 36px; align-items: start; margin-top: -64px; position: relative; z-index: 2; padding-bottom: 40px; }
.cp-article { min-width: 0; }
.cp-facts { background: #fff; border: 1px solid var(--line); border-radius: 22px; padding: 24px 26px; box-shadow: 0 40px 80px -50px rgba(26, 21, 48, .45); }
.cp-facts__h { font: 800 .8rem/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--violet); }
html[lang="ar"] .cp-facts__h { letter-spacing: 0; font-size: 1rem; }
.cp-facts dl { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px 24px; margin: 14px 0 0; }
.cp-facts dl div { border-top: 1px solid var(--line); padding-top: 10px; }
.cp-facts dt { font-size: .82rem; color: #6b6480; }
.cp-facts dd { margin: 2px 0 0; font-weight: 700; line-height: 1.45; }
.cp-facts__u { margin-top: 14px !important; font-size: .8rem; color: #8a84a0; }

/* article typography */
.cp-body { margin-top: 34px; }
.cp-body > * + * { margin-top: 1.05em !important; }
.cp-body h2 { margin-top: 2.1em !important; font: 800 clamp(1.4rem, 2.4vw, 1.85rem)/1.25 var(--display); font-stretch: 108%; letter-spacing: -.015em; }
html[lang="ar"] .cp-body h2 { font-stretch: normal; letter-spacing: 0; line-height: 1.5; }
.cp-body h3 { margin-top: 1.6em !important; font-size: 1.15rem; line-height: 1.4; }
.cp-body p, .cp-body li { color: #2d2742; }
.cp-body a { color: var(--violet); text-underline-offset: 3px; }
.cp-body ul, .cp-body ol { padding-inline-start: 1.3em; }
.cp-body li + li { margin-top: .35em; }
.cp-body table { width: 100%; border-collapse: separate; border-spacing: 0; background: #fff; border: 1px solid var(--line); border-radius: 16px; overflow: hidden; font-size: .93rem; line-height: 1.5; display: block; overflow-x: auto; }
.cp-body th, .cp-body td { padding: 11px 14px; text-align: start; vertical-align: top; border-bottom: 1px solid var(--line); }
.cp-body thead th { background: var(--night-2); color: #fff; font-weight: 700; }
.cp-body tbody tr:last-child td { border-bottom: 0; }
.cp-body tbody tr:nth-child(even) td { background: #faf9fd; }
.cp-body h2#faq ~ h3 { padding: 14px 18px 0; margin-top: 12px !important; background: #fff; border: 1px solid var(--line); border-bottom: 0; border-radius: 14px 14px 0 0; }
.cp-body h2#faq ~ h3 + p { margin-top: 0 !important; padding: 6px 18px 16px; background: #fff; border: 1px solid var(--line); border-top: 0; border-radius: 0 0 14px 14px; color: var(--text-2); }

/* side price card */
.cp-side { position: sticky; top: 100px; }
.cp-price { background: var(--night-2); color: #fff; border-radius: 22px; padding: 22px; box-shadow: 0 40px 80px -50px rgba(26, 21, 48, .6); }
.cp-price__h { font: 800 .8rem/1.2 var(--body); letter-spacing: .12em; text-transform: uppercase; color: var(--lav); }
html[lang="ar"] .cp-price__h { letter-spacing: 0; font-size: 1rem; }
.cp-price ul { list-style: none; margin: 12px 0 0; padding: 0; }
.cp-price li { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; padding: 10px 0; border-bottom: 1px solid rgba(255, 255, 255, .1); font-size: .95rem; line-height: 1.35; }
.cp-price li small { display: block; color: var(--mist); font-size: .78rem; }
.cp-price li b { font: 800 1.25rem/1 var(--display); color: #fff; white-space: nowrap; }
.cp-price__s { margin-top: 12px !important; font-size: .82rem; color: var(--mist); line-height: 1.5; }
.cp-btn { display: flex; justify-content: center; margin-top: 12px; padding: 13px 18px; border-radius: 999px; background: var(--signal); color: var(--night) !important; font-weight: 700; text-decoration: none; }
.cp-btn--line { background: transparent; border: 1px solid rgba(255, 255, 255, .25); color: #fff !important; }

/* other countries + hub */
.cp-others { padding: 30px 0 80px; }
.cp-h2 { font: 800 1.4rem/1.3 var(--display); }
.cp-chips { list-style: none; display: flex; flex-wrap: wrap; gap: 10px; margin: 16px 0 0; padding: 0; }
.cp-chips a { display: inline-block; padding: 8px 16px; border-radius: 999px; background: #fff; border: 1px solid var(--line); color: var(--ink); text-decoration: none; font-weight: 600; }
.cp-chips a:hover { border-color: var(--violet); color: var(--violet); }
.cp-hubgrid { margin-top: -60px; position: relative; z-index: 2; padding-bottom: 80px; }
.cp-cards { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 14px; }
.cp-cards a { display: flex; flex-direction: column; gap: 6px; height: 100%; padding: 20px; background: #fff; border: 1px solid var(--line); border-radius: 18px; color: var(--ink); text-decoration: none; transition: transform .2s, border-color .2s, box-shadow .2s; }
.cp-cards a:hover { transform: translateY(-3px); border-color: var(--violet); box-shadow: 0 18px 40px -24px rgba(124, 65, 216, .55); }
.cp-cards__name { font: 800 1.2rem/1.3 var(--display); }
.cp-cards__t { color: var(--text-2); font-size: .92rem; line-height: 1.55; }
.cp-cards__go { margin-top: auto; color: var(--violet); font-weight: 800; }
.cp-hubtext { margin-top: 40px; max-width: 75ch; }
.cp-hubtext h2 { font: 800 1.4rem/1.3 var(--display); margin-top: 1.4em !important; }
.cp-hubtext p { margin-top: .8em !important; color: #2d2742; }

@media (max-width: 960px) {
  .cp-layout { grid-template-columns: minmax(0, 1fr); }
  .cp-side { position: static; }
  .cp-facts dl { grid-template-columns: minmax(0, 1fr); }
  .cp-hero { padding: 120px 0 96px; }
}