/* Material Design 3 treatment scoped exclusively to comoros.html. */
body.comoros-material {
  --md-primary: #006781;
  --md-on-primary: #ffffff;
  --md-primary-container: #b8eaff;
  --md-on-primary-container: #001f29;
  --md-secondary: #4d6169;
  --md-secondary-container: #d0e6ef;
  --md-tertiary: #8f2630;
  --md-tertiary-container: #ffdadb;
  --md-surface: #f8fafc;
  --md-surface-low: #f1f5f7;
  --md-surface-high: #e7edef;
  --md-on-surface: #171c1f;
  --md-on-surface-variant: #3f484c;
  --md-outline: #70787c;
  --md-outline-variant: #bfc8cc;
  min-width: 320px;
  color: var(--md-on-surface);
  background: var(--md-surface);
  font-family: "Cairo", Arial, sans-serif;
  font-size: 16px;
  line-height: 1.75;
  text-align: right;
}

body.comoros-material *,
body.comoros-material *::before,
body.comoros-material *::after { box-sizing: border-box; }

body.comoros-material p { color: var(--md-on-surface-variant); text-wrap: pretty; }
body.comoros-material h1,
body.comoros-material h2,
body.comoros-material h3 { color: var(--md-on-surface); font-family: "Cairo", Arial, sans-serif; text-wrap: balance; }

body.comoros-material a:focus-visible,
body.comoros-material button:focus-visible,
body.comoros-material input:focus-visible,
body.comoros-material [tabindex]:focus-visible {
  outline: 3px solid #ffb4b7;
  outline-offset: 3px;
}

body.comoros-material .navbar {
  min-height: 76px;
  border: 0 !important;
  color: #fff;
  background: #073642 !important;
  box-shadow: 0 2px 6px rgba(0, 31, 41, .28);
}
body.comoros-material .navbar .container { display: flex; min-height: 76px; align-items: center; }
body.comoros-material .navbar-header { flex: 0 0 auto; }
body.comoros-material .navbar-brand { display: flex; height: 76px; padding: 10px 14px; align-items: center; }
body.comoros-material .navbar-brand img { width: 76px; height: 54px !important; object-fit: contain; }
body.comoros-material .navbar-collapse { flex: 1 1 auto; }
body.comoros-material .navbar-nav { float: none; }
body.comoros-material .navbar-nav > li > a {
  min-height: 48px;
  margin: 14px 1px;
  padding: 14px 10px;
  border-radius: 999px;
  color: #f4fbff !important;
  font-size: 13px;
  font-weight: 600;
}
body.comoros-material .navbar-nav > li > a:hover,
body.comoros-material .navbar-nav > li > a:focus { color: #001f29 !important; background: var(--md-primary-container) !important; }
body.comoros-material #lang-toggle-btn { color: #fff !important; background: var(--md-tertiary) !important; }
body.comoros-material .navbar-toggle { margin-top: 18px; border: 0; border-radius: 50%; background: rgba(255,255,255,.1); }

body.comoros-material main > .comoros-trust-bar {
  margin-top: 76px;
  padding: 11px 20px !important;
  border: 0 !important;
  color: var(--md-on-primary-container);
  background: var(--md-primary-container) !important;
}
body.comoros-material .comoros-trust-bar span,
body.comoros-material .comoros-trust-bar a { color: var(--md-on-primary-container) !important; }
body.comoros-material .comoros-trust-bar,
body.comoros-material .comoros-trust-bar .container { overflow: visible !important; }

body.comoros-material #home {
  min-height: min(760px, calc(100vh - 76px));
  background-attachment: scroll !important;
  background-position: center !important;
}
body.comoros-material #home .bg-overlay { min-height: inherit; background: rgba(2, 35, 47, .84); }
body.comoros-material #large-header { min-height: inherit; }
body.comoros-material #demo-canvas { display: none; }
body.comoros-material .hero-content-wrapper {
  display: flex;
  min-height: inherit;
  width: min(1180px, calc(100% - 40px));
  margin: 0 auto;
  padding: clamp(80px, 11vw, 140px) 0;
  align-items: center;
  justify-content: flex-start;
}
body.comoros-material .hero-content { width: min(820px, 100%); margin: 0; text-align: right; }
body.comoros-material .hero-content > img { display: block; width: 112px; margin: 0 0 22px auto; }
body.comoros-material .comoros-hero-badge {
  display: inline-flex;
  margin-bottom: 18px;
  padding: 8px 15px;
  border-radius: 999px;
  color: var(--md-on-primary-container);
  background: var(--md-primary-container);
  font-size: 13px;
  font-weight: 800;
}
body.comoros-material .hero-lead {
  max-width: 18ch;
  margin: 0 0 16px;
  color: #fff;
  font-size: clamp(2.5rem, 5vw, 4.8rem) !important;
  font-weight: 800;
  letter-spacing: -.035em;
  line-height: 1.13;
}
body.comoros-material .hero-secondary {
  max-width: 42ch;
  margin: 0;
  color: #c8edf9;
  font-size: clamp(1.15rem, 2.4vw, 1.65rem);
  font-weight: 500;
  line-height: 1.7;
  text-transform: none;
}
body.comoros-material .hero-content .cd-headline { display: none; }
body.comoros-material .comoros-hero-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 34px; }
body.comoros-material .md-filled-button,
body.comoros-material .md-tonal-button {
  display: inline-flex;
  min-height: 52px;
  padding: 0 24px;
  border-radius: 999px;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  text-decoration: none;
}
body.comoros-material .md-filled-button { color: var(--md-on-primary); background: var(--md-primary); }
body.comoros-material .md-filled-button:hover { color: #fff; background: #005268; }
body.comoros-material .md-tonal-button { color: var(--md-on-primary-container); background: var(--md-primary-container); }
body.comoros-material .md-tonal-button:hover { color: #001f29; background: #d5f3ff; }
body.comoros-material .scroller { display: none; }

body.comoros-material #direct-answer-box,
body.comoros-material .comoros-summary {
  width: min(1100px, calc(100% - 32px));
  margin: clamp(34px, 6vw, 64px) auto !important;
  border: 0 !important;
  border-radius: 16px !important;
  box-shadow: 0 3px 8px rgba(23, 28, 31, .08) !important;
}
body.comoros-material #direct-answer-box { padding: clamp(26px, 5vw, 48px) !important; background: #fff !important; }
body.comoros-material #direct-answer-box h2 { margin: 0 0 18px !important; color: var(--md-primary) !important; font-size: clamp(1.7rem, 4vw, 2.6rem) !important; }
body.comoros-material #direct-answer-box p,
body.comoros-material #direct-answer-box li { color: var(--md-on-surface-variant) !important; font-size: 17px !important; }
body.comoros-material #direct-answer-box ul { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px 28px; padding-right: 22px !important; }
body.comoros-material .comoros-summary { padding: 22px 28px !important; color: #521d22; background: var(--md-tertiary-container) !important; }
body.comoros-material .comoros-summary p { color: #521d22 !important; }

body.comoros-material section { scroll-margin-top: 90px; }
body.comoros-material #portals,
body.comoros-material #team,
body.comoros-material #testimonials,
body.comoros-material #country-focus,
body.comoros-material #faq { padding-block: clamp(56px, 8vw, 96px) !important; }
body.comoros-material #portals { border: 0 !important; background: var(--md-surface-low) !important; }
body.comoros-material .sec-heading { margin-bottom: 42px !important; }
body.comoros-material .sec-heading h2,
body.comoros-material .sec-heading h3 { color: var(--md-primary) !important; font-size: clamp(1.9rem, 4vw, 3rem) !important; font-weight: 800 !important; }
body.comoros-material .sec-heading .subheading { max-width: 68ch; margin-inline: auto !important; color: var(--md-on-surface-variant) !important; line-height: 1.8; }

body.comoros-material .portal-card {
  border: 0 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: 0 3px 8px rgba(23, 28, 31, .09) !important;
}
body.comoros-material .portal-card:hover { transform: translateY(-4px) !important; box-shadow: 0 5px 8px rgba(23, 28, 31, .14) !important; }
body.comoros-material .portal-card > div:first-child { background: var(--md-primary) !important; }
body.comoros-material .portal-icon { border-radius: 12px !important; box-shadow: none !important; }
body.comoros-material .portal-btn { border-radius: 999px !important; background: var(--md-primary) !important; box-shadow: none !important; }
body.comoros-material .portal-badge-pill,
body.comoros-material .status-online { color: var(--md-on-primary-container) !important; background: var(--md-primary-container) !important; border-color: transparent !important; }

body.comoros-material #about,
body.comoros-material #regional-hubs,
body.comoros-material #cli,
body.comoros-material #country-focus,
body.comoros-material .ft-steps-numbers,
body.comoros-material #faq { width: min(1120px, calc(100% - 32px)); }
body.comoros-material #about,
body.comoros-material #regional-hubs,
body.comoros-material #cli,
body.comoros-material .ft-steps-numbers { padding-block: clamp(48px, 7vw, 84px) !important; }
body.comoros-material #about p,
body.comoros-material #regional-hubs p,
body.comoros-material #country-focus p,
body.comoros-material .ft-steps-numbers p { max-width: 72ch; font-size: 17px; }
body.comoros-material #about h2,
body.comoros-material #regional-hubs h2,
body.comoros-material #country-focus h2,
body.comoros-material .ft-steps-numbers h2 { color: var(--md-primary) !important; font-size: clamp(1.8rem, 4vw, 2.8rem); font-weight: 800; }

body.comoros-material #team { background: var(--md-secondary-container) !important; }
body.comoros-material #testimonials { background: var(--md-surface-low) !important; }
body.comoros-material #services .circles-counters-dark-bg { background: #073642; }
body.comoros-material #services .count-item,
body.comoros-material #services .count-item p { color: #f4fbff !important; }

body.comoros-material .ft-steps-numbers h3 { color: var(--md-tertiary) !important; }
body.comoros-material .ft-steps-numbers img,
body.comoros-material #portfolio img { border-radius: 12px; }
body.comoros-material .portfolio-layout { padding-block: clamp(56px, 8vw, 96px); background: #fff; }
body.comoros-material .portfolio-filters a { display: inline-flex; margin: 4px; padding: 8px 16px; border-radius: 999px; color: var(--md-on-surface-variant); background: var(--md-surface-high); }
body.comoros-material .portfolio-filters a:hover,
body.comoros-material .portfolio-filters .active { color: var(--md-on-primary); background: var(--md-primary); }

body.comoros-material .cta-newsletter .bg-overlay { background: rgba(2,35,47,.9); }
body.comoros-material .subscribe-form input[type="email"] {
  min-height: 52px;
  border: 1px solid var(--md-outline);
  border-radius: 8px;
  color: var(--md-on-surface);
  background: #fff;
}
body.comoros-material .subscribe-form input[type="submit"] { min-height: 52px; border: 0; border-radius: 999px; color: #fff; background: var(--md-primary); }

body.comoros-material #faq .faq-item { border: 0 !important; border-radius: 12px !important; background: #fff !important; box-shadow: 0 2px 6px rgba(23,28,31,.08) !important; }
body.comoros-material #faq .faq-question { min-height: 64px; background: #fff !important; }
body.comoros-material #faq .faq-question h3 { color: var(--md-on-surface) !important; }
body.comoros-material #faq .faq-icon { color: var(--md-primary) !important; }
body.comoros-material #faq .faq-answer { border-top: 1px solid var(--md-outline-variant) !important; color: var(--md-on-surface-variant) !important; background: var(--md-surface-low) !important; }

body.comoros-material #contact .gray-bg { padding: 64px 20px; background: var(--md-secondary-container); }
body.comoros-material #contact address { margin: 0; }
body.comoros-material #contact .adr-info a { color: var(--md-primary); }
body.comoros-material .footer-widgets { background: #052c37; }
body.comoros-material .footer-widgets .copyright { color: #d8f3fc; background: transparent; }
body.comoros-material .floating-whatsapp { right: auto; left: 24px; bottom: 24px; width: 58px; height: 58px; border-radius: 18px; line-height: 58px; box-shadow: 0 3px 8px rgba(23,28,31,.24); z-index: 20; }
body.comoros-material .floating-whatsapp .fa-whatsapp { line-height: 58px; }
body.comoros-material .floating-whatsapp .whatsapp-tooltip { right: auto; left: 72px; }

@media (max-width: 991px) {
  body.comoros-material .navbar .container { display: block; }
  body.comoros-material .navbar-collapse { max-height: calc(100vh - 76px); border: 0; background: #073642; }
  body.comoros-material .navbar-nav > li > a { margin: 3px 0; }
  body.comoros-material .hero-content-wrapper { padding-top: 90px; }
  body.comoros-material #direct-answer-box ul { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  body.comoros-material .hero-content-wrapper { width: min(100% - 28px, 1180px); padding-block: 72px; }
  body.comoros-material .hero-lead { font-size: clamp(2.2rem, 12vw, 3.5rem) !important; }
  body.comoros-material .comoros-hero-actions { flex-direction: column; }
  body.comoros-material .md-filled-button,
  body.comoros-material .md-tonal-button { width: 100%; }
  body.comoros-material #direct-answer-box,
  body.comoros-material .comoros-summary { width: calc(100% - 24px); }
  body.comoros-material .floating-whatsapp { left: 16px; bottom: 16px; }
}

@media (prefers-reduced-motion: reduce) {
  body.comoros-material *,
  body.comoros-material *::before,
  body.comoros-material *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}