/*
 * AXION-DCP-R2
 * Full Responsive / Locale / Theme Hardening
 *
 * Applied after:
 *   r2-foundation.css
 *   r2-sections-a.css
 *   r2-sections-b.css
 *
 * This file is intentionally an architectural hardening layer.
 * It does not redesign the owner-approved desktop composition.
 */

/* ==========================================================
   GLOBAL SAFETY
========================================================== */

body.r2-profile,
body.r2-profile *,
body.r2-profile *::before,
body.r2-profile *::after {
  box-sizing:
    border-box;
}

body.r2-profile {
  max-width:
    100%;

  overflow-x:
    clip;

  text-rendering:
    optimizeLegibility;
}

body.r2-profile img,
body.r2-profile video,
body.r2-profile svg {
  max-width:
    100%;
}

body.r2-profile img {
  height:
    auto;
}

body.r2-profile :where(
  section,
  article,
  div,
  figure,
  blockquote,
  ul,
  li
) {
  min-width:
    0;
}

body.r2-profile :where(
  p,
  li
) {
  text-wrap:
    pretty;
}

body.r2-profile :where(
  h1,
  h2,
  h3
) {
  text-wrap:
    balance;
}

body.r2-profile :where(
  a,
  button
) {
  touch-action:
    manipulation;
}

body.r2-profile section[id] {
  scroll-margin-top:
    132px;
}

/* ==========================================================
   LIGHT THEME CONTRAST HARDENING
========================================================== */

html[data-theme="light"]
body.r2-profile {
  --r2-gold:
    #956116;

  --r2-gold-soft:
    rgba(149, 97, 22, .34);

  --r2-text-secondary:
    #364451;

  --r2-text-tertiary:
    #596571;

  --r2-line:
    rgba(8, 31, 51, .17);
}

html[data-theme="light"]
body.r2-profile
.r2-kicker,

html[data-theme="light"]
body.r2-profile
.r2-category,

html[data-theme="light"]
body.r2-profile
.r2-office__region,

html[data-theme="light"]
body.r2-profile
.r2-leader__role,

html[data-theme="light"]
body.r2-profile
.r2-roadmap__target-label {
  font-weight:
    750;
}

/* ==========================================================
   MULTILINGUAL TYPOGRAPHIC SAFETY
========================================================== */

html[lang="ar"]
body.r2-profile {
  font-family:
    "Segoe UI",
    Tahoma,
    Arial,
    sans-serif;
}

html[lang="ar"]
body.r2-profile
:where(
  .r2-cover__title,
  .r2-section__title,
  .r2-contact__title
) {
  line-height:
    1.08;

  letter-spacing:
    0;
}

html[lang="ar"]
body.r2-profile
:where(
  p,
  li,
  .r2-leader__bio,
  .r2-office__address
) {
  line-height:
    1.78;
}

html[lang="zh"]
body.r2-profile {
  font-family:
    "Microsoft YaHei",
    "PingFang SC",
    "Noto Sans CJK SC",
    Arial,
    sans-serif;
}

html[lang="zh"]
body.r2-profile
:where(
  .r2-cover__title,
  .r2-section__title,
  .r2-contact__title
) {
  line-height:
    1.06;

  letter-spacing:
    -.018em;
}

html[lang="zh"]
body.r2-profile
:where(
  p,
  li
) {
  line-height:
    1.78;
}

html[lang="en"]
body.r2-profile
:where(
  .r2-section__title,
  .r2-contact__title
),

html[lang="es"]
body.r2-profile
:where(
  .r2-section__title,
  .r2-contact__title
) {
  overflow-wrap:
    normal;

  word-break:
    normal;
}

/* ==========================================================
   LONG TOKEN SAFETY
========================================================== */

body.r2-profile
:where(
  .r2-office__address,
  .r2-office__entity,
  .r2-contact__value,
  .r2-contact__value a,
  .r2-footer
) {
  overflow-wrap:
    anywhere;

  word-break:
    normal;
}

/* ==========================================================
   DRAWER BREAKPOINT — TABLET AND BELOW
========================================================== */

@media (max-width: 1199px) {

  body.r2-profile section[id] {
    scroll-margin-top:
      82px;
  }

  body.r2-profile
  .r2-header {
    z-index:
      1000;
  }

  body.r2-profile
  .r2-header__bar {
    width:
      100%;

    min-height:
      72px;

    padding-inline:
      var(--r2-page);

    gap:
      14px;

    flex-wrap:
      nowrap;
  }

  body.r2-profile
  .r2-brand {
    min-width:
      0;

    flex:
      0 1 auto;
  }

  body.r2-profile
  .r2-brand__text {
    min-width:
      0;
  }

  body.r2-profile
  .r2-header__actions {
    display:
      flex;

    align-items:
      center;

    justify-content:
      flex-end;

    gap:
      8px;

    flex:
      0 0 auto;

    margin-inline-start:
      auto;
  }

  body.r2-profile
  .nav-tools {
    display:
      flex;

    align-items:
      center;

    gap:
      6px;
  }

  /*
   * Mega A originally hid #langBar on small screens.
   * R2 hardening makes multilingual access persistent.
   */

  body.r2-profile
  .r2-header
  #langBar {
    display:
      flex !important;

    align-items:
      center;

    gap:
      3px;

    visibility:
      visible !important;

    opacity:
      1 !important;
  }

  body.r2-profile
  .r2-header
  .lang-link {
    display:
      inline-flex;

    align-items:
      center;

    justify-content:
      center;

    min-width:
      36px;

    min-height:
      40px;

    padding:
      0 8px;

    border-radius:
      999px;

    font-size:
      .69rem;

    line-height:
      1;

    white-space:
      nowrap;
  }

  body.r2-profile
  .r2-theme-toggle {
    display:
      inline-flex;

    align-items:
      center;

    justify-content:
      center;

    width:
      40px;

    min-width:
      40px;

    height:
      40px;

    min-height:
      40px;
  }

  body.r2-profile
  .r2-menu-toggle {
    display:
      inline-flex !important;

    align-items:
      center;

    justify-content:
      center;

    gap:
      7px;

    min-width:
      44px;

    min-height:
      44px;

    padding:
      0 11px;
  }

  /*
   * The visible word "Menu" is intentionally suppressed at the
   * drawer breakpoint. The existing accessible aria-label
   * continues to identify the control.
   */

  body.r2-profile
  .r2-menu-toggle >
  span:last-child {
    display:
      none;
  }

  body.r2-profile
  .r2-header__nav {
    position:
      static;

    width:
      100%;
  }

  body.r2-profile
  .r2-header
  .r2-nav-links {
    position:
      fixed;

    z-index:
      1001;

    top:
      78px;

    left:
      var(--r2-page);

    right:
      var(--r2-page);

    display:
      grid;

    grid-template-columns:
      repeat(2, minmax(0, 1fr));

    gap:
      4px;

    width:
      auto;

    max-width:
      none;

    max-height:
      calc(100dvh - 94px);

    margin:
      0;

    padding:
      10px;

    overflow-y:
      auto;

    overscroll-behavior:
      contain;

    border:
      1px solid var(--r2-line);

    border-radius:
      16px;

    background:
      var(--r2-navy-950);

    box-shadow:
      0 24px 70px rgba(0, 0, 0, .34);

    opacity:
      0;

    visibility:
      hidden;

    pointer-events:
      none;

    transform:
      translateY(-10px);

    transition:
      opacity .18s ease,
      transform .18s ease,
      visibility .18s ease;
  }

  html[data-theme="light"]
  body.r2-profile
  .r2-header
  .r2-nav-links {
    background:
      var(--r2-paper);
  }

  body.r2-profile
  .r2-header
  .r2-nav-links.open {
    opacity:
      1;

    visibility:
      visible;

    pointer-events:
      auto;

    transform:
      translateY(0);
  }

  body.r2-profile
  .r2-header
  .r2-nav-links a {
    display:
      flex;

    align-items:
      center;

    width:
      100%;

    min-height:
      48px;

    padding:
      10px 14px;

    border-radius:
      10px;

    white-space:
      normal;

    line-height:
      1.25;
  }

  body.r2-profile
  .r2-header
  .r2-nav-links a.active {
    background:
      var(--r2-gold-soft);
  }

  /* --------------------------------------------
     Tablet typography
  -------------------------------------------- */

  body.r2-profile
  .r2-section__title {
    max-width:
      19ch;

    font-size:
      clamp(2.55rem, 5.8vw, 4.25rem) !important;
  }

  body.r2-profile
  .r2-section__intro {
    max-width:
      68ch;
  }

  /* --------------------------------------------
     Flexible media at tablet sizes
  -------------------------------------------- */

  body.r2-profile
  :where(
    .r2-media--editorial,
    .r2-media--division,
    .r2-media--wide
  ) {
    height:
      auto !important;
  }
}

/* ==========================================================
   SINGLE-COLUMN TABLET
========================================================== */

@media (max-width: 899px) {

  body.r2-profile {
    --r2-page:
      clamp(28px, 5vw, 44px);
  }

  body.r2-profile
  .r2-cover {
    grid-template-columns:
      1fr !important;

    min-height:
      0 !important;
  }

  body.r2-profile
  .r2-cover__copy,
  body.r2-profile
  .r2-cover__visual {
    width:
      100%;

    min-width:
      0;
  }

  body.r2-profile
  .r2-cover__visual {
    min-height:
      0 !important;

    aspect-ratio:
      16 / 10;
  }

  body.r2-profile
  .r2-cover__visual img {
    width:
      100% !important;

    height:
      100% !important;

    object-fit:
      cover;
  }

  body.r2-profile
  :where(
    .r2-editorial-split,
    .r2-positioning__top,
    .r2-org__header,
    .r2-hubs__intro,
    .r2-governance__header,
    .r2-roadmap__intro,
    .r2-sustainability__intro,
    .r2-offices__intro,
    .r2-contact__layout
  ) {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  .r2-division__layout {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  :where(
    .r2-division__content,
    .r2-division__media,
    .r2-division--reverse .r2-division__content,
    .r2-division--reverse .r2-division__media
  ) {
    grid-column:
      1 !important;

    grid-row:
      auto !important;
  }

  body.r2-profile
  .r2-division__content {
    order:
      1;
  }

  body.r2-profile
  .r2-division__media {
    order:
      2;
  }

  body.r2-profile
  :where(
    .r2-media--editorial,
    .r2-media--division,
    .r2-media--wide
  ) {
    aspect-ratio:
      16 / 10;
  }

  body.r2-profile
  .r2-contact__visual {
    aspect-ratio:
      16 / 10;
  }

  body.r2-profile
  .r2-office-grid {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  .r2-leadership-grid {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  .r2-leader:last-child {
    grid-column:
      auto;

    max-width:
      none;
  }

  body.r2-profile
  .r2-roadmap {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  .r2-roadmap__stage +
  .r2-roadmap__stage {
    border-inline-start:
      0;

    border-top:
      1px solid var(--r2-line);
  }

  body.r2-profile
  :where(
    .r2-roadmap__stage,
    .r2-roadmap__stage:first-child,
    .r2-roadmap__stage:last-child
  ) {
    padding:
      26px 0 !important;
  }
}

/* ==========================================================
   MOBILE
========================================================== */

@media (max-width: 699px) {

  body.r2-profile {
    --r2-page:
      clamp(24px, 6.4vw, 30px);
  }

  body.r2-profile section[id] {
    scroll-margin-top:
      78px;
  }

  body.r2-profile
  .r2-header__bar {
    min-height:
      68px;

    padding-inline:
      var(--r2-page);

    gap:
      7px;
  }

  body.r2-profile
  .r2-header__actions {
    gap:
      4px;
  }

  body.r2-profile
  .nav-tools {
    gap:
      3px;
  }

  body.r2-profile
  .r2-header
  #langBar {
    gap:
      1px;
  }

  body.r2-profile
  .r2-header
  .lang-link {
    min-width:
      32px;

    min-height:
      40px;

    padding:
      0 6px;

    font-size:
      .65rem;
  }

  body.r2-profile
  .r2-theme-toggle {
    width:
      40px;

    min-width:
      40px;

    height:
      40px;
  }

  body.r2-profile
  .r2-menu-toggle {
    width:
      44px;

    min-width:
      44px;

    height:
      44px;

    padding:
      0;
  }

  body.r2-profile
  .r2-header
  .r2-nav-links {
    top:
      72px;

    left:
      var(--r2-page);

    right:
      var(--r2-page);

    grid-template-columns:
      1fr;

    max-height:
      calc(100dvh - 84px);

    padding:
      8px;
  }

  body.r2-profile
  .r2-header
  .r2-nav-links a {
    min-height:
      48px;

    padding:
      11px 13px;
  }

  /* --------------------------------------------
     Section spacing
  -------------------------------------------- */

  body.r2-profile
  .r2-section.section {
    padding:
      clamp(58px, 14vw, 78px)
      var(--r2-page) !important;
  }

  body.r2-profile
  .r2-cover__copy {
    padding-inline:
      var(--r2-page) !important;
  }

  body.r2-profile
  .r2-section__title {
    width:
      100%;

    max-width:
      100%;

    font-size:
      clamp(2.2rem, 10.2vw, 3.15rem) !important;

    line-height:
      1;
  }

  html[lang="en"]
  body.r2-profile
  .r2-cover__title,

  html[lang="es"]
  body.r2-profile
  .r2-cover__title {
    width:
      100%;

    max-width:
      100%;

    font-size:
      clamp(2.7rem, 12vw, 3.85rem) !important;

    line-height:
      .95;

    letter-spacing:
      -.035em;
  }

  html[lang="ar"]
  body.r2-profile
  .r2-cover__title {
    width:
      100%;

    max-width:
      100%;

    font-size:
      clamp(2.5rem, 11.5vw, 3.65rem) !important;
  }

  html[lang="zh"]
  body.r2-profile
  .r2-cover__title {
    width:
      100%;

    max-width:
      100%;

    font-size:
      clamp(2.45rem, 11.2vw, 3.55rem) !important;
  }

  body.r2-profile
  :where(
    .r2-matrix,
    .r2-org__grid,
    .r2-capability-list,
    .r2-signals,
    .r2-hub-list,
    .r2-control-sequence,
    .r2-sustainability-grid,
    .r2-contact__directory
  ) {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  .r2-opportunity {
    grid-template-columns:
      1fr !important;
  }

  body.r2-profile
  .r2-opportunity p {
    grid-column:
      auto;
  }

  body.r2-profile
  :where(
    .r2-media--editorial,
    .r2-media--division,
    .r2-media--wide,
    .r2-contact__visual
  ) {
    aspect-ratio:
      4 / 3;
  }

  body.r2-profile
  .r2-hub {
    grid-template-columns:
      92px minmax(0, 1fr);
  }

  body.r2-profile
  .r2-leader {
    grid-template-columns:
      92px minmax(0, 1fr);

    gap:
      17px;
  }

  body.r2-profile
  .r2-leader__portrait {
    width:
      92px;

    max-width:
      92px;
  }

  body.r2-profile
  .r2-office__rail {
    display:
      grid;

    gap:
      6px;
  }

  body.r2-profile
  .r2-contact__actions {
    width:
      100%;
  }

  body.r2-profile
  .r2-download-action {
    min-height:
      48px;
  }

  body.r2-profile
  .r2-footer {
    padding-inline:
      var(--r2-page);
  }
}

/* ==========================================================
   NARROW MOBILE
========================================================== */

@media (max-width: 479px) {

  /*
   * Preserve all functional controls at 390–430 px by reducing
   * the brand to the identity mark only.
   */

  body.r2-profile
  .r2-brand__text {
    display:
      none;
  }

  body.r2-profile
  .r2-brand img {
    width:
      38px;

    min-width:
      38px;

    height:
      38px;
  }

  body.r2-profile
  .r2-header__actions {
    margin-inline-start:
      auto;
  }

  body.r2-profile
  .r2-header
  .lang-link {
    min-width:
      30px;

    padding:
      0 5px;
  }

  body.r2-profile
  .r2-matrix__item,
  body.r2-profile
  .r2-control,
  body.r2-profile
  .r2-sustainability__pillar {
    grid-template-columns:
      34px minmax(0, 1fr);

    gap:
      12px;
  }

  body.r2-profile
  .r2-hub {
    grid-template-columns:
      82px minmax(0, 1fr);

    gap:
      14px;
  }

  body.r2-profile
  .r2-leader {
    grid-template-columns:
      82px minmax(0, 1fr);

    gap:
      14px;
  }

  body.r2-profile
  .r2-leader__portrait {
    width:
      82px;

    max-width:
      82px;
  }

  body.r2-profile
  .r2-office__address,
  body.r2-profile
  .r2-contact__value {
    font-size:
      .9rem;
  }
}

/* ==========================================================
   VERY NARROW LATIN TYPOGRAPHY
========================================================== */

@media (max-width: 410px) {

  html[lang="en"]
  body.r2-profile
  .r2-section__title,

  html[lang="es"]
  body.r2-profile
  .r2-section__title {
    font-size:
      clamp(2.08rem, 9.8vw, 2.8rem) !important;
  }

  html[lang="es"]
  body.r2-profile
  .r2-cover__title {
    font-size:
      clamp(2.5rem, 11.4vw, 3.35rem) !important;
  }
}

/* ==========================================================
   REDUCED MOTION
========================================================== */

@media (prefers-reduced-motion: reduce) {

  body.r2-profile *,
  body.r2-profile *::before,
  body.r2-profile *::after {
    scroll-behavior:
      auto !important;

    transition-duration:
      .01ms !important;

    animation-duration:
      .01ms !important;

    animation-iteration-count:
      1 !important;
  }
}


/* ==========================================================
   MEGA D REPAIR R1 — TOUCH TARGETS + MOBILE COVER
========================================================== */

/*
 * Root cause:
 *
 * The R2 hardening class selectors were still losing physical
 * button dimensions to historical component rules.
 *
 * Use stable element IDs for the two application controls and
 * the language-bar ID for language targets. These rules are
 * deliberately scoped below 1200px only.
 */

@media (max-width: 1199px) {

  body.r2-profile
  #menuToggle {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    flex:
      0 0 44px !important;

    inline-size:
      44px !important;

    width:
      44px !important;

    min-inline-size:
      44px !important;

    min-width:
      44px !important;

    block-size:
      44px !important;

    height:
      44px !important;

    min-block-size:
      44px !important;

    min-height:
      44px !important;

    padding:
      0 !important;
  }

  body.r2-profile
  #themeToggle {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    flex:
      0 0 44px !important;

    inline-size:
      44px !important;

    width:
      44px !important;

    min-inline-size:
      44px !important;

    min-width:
      44px !important;

    block-size:
      44px !important;

    height:
      44px !important;

    min-block-size:
      44px !important;

    min-height:
      44px !important;

    padding:
      0 !important;
  }

  body.r2-profile
  #langBar {
    display:
      flex !important;

    align-items:
      center !important;

    visibility:
      visible !important;

    opacity:
      1 !important;
  }

  body.r2-profile
  #langBar
  .lang-link {
    display:
      inline-flex !important;

    align-items:
      center !important;

    justify-content:
      center !important;

    flex:
      0 0 auto !important;

    min-inline-size:
      30px !important;

    min-width:
      30px !important;

    block-size:
      40px !important;

    height:
      40px !important;

    min-block-size:
      40px !important;

    min-height:
      40px !important;

    padding-inline:
      5px !important;

    white-space:
      nowrap !important;
  }
}

/*
 * The mobile Cover was inheriting a historical physical width
 * larger than its single-column viewport track.
 *
 * Constrain the copy column itself first, then constrain its
 * principal content children to that content box.
 */

@media (max-width: 699px) {

  body.r2-profile
  .r2-cover {
    inline-size:
      100% !important;

    width:
      100% !important;

    max-inline-size:
      100% !important;

    max-width:
      100% !important;

    grid-template-columns:
      minmax(0, 1fr) !important;

    overflow-x:
      clip !important;
  }

  body.r2-profile
  .r2-cover__copy {
    box-sizing:
      border-box !important;

    inline-size:
      100% !important;

    width:
      100% !important;

    max-inline-size:
      100% !important;

    max-width:
      100% !important;

    min-inline-size:
      0 !important;

    min-width:
      0 !important;

    margin-inline:
      0 !important;

    padding-inline:
      var(--r2-page) !important;

    overflow-x:
      clip !important;
  }

  body.r2-profile
  .r2-cover__copy
  .r2-cover__title,

  body.r2-profile
  .r2-cover__copy
  .r2-cover__lede,

  body.r2-profile
  .r2-cover__copy
  .r2-cover__footer {
    box-sizing:
      border-box !important;

    inline-size:
      100% !important;

    width:
      100% !important;

    max-inline-size:
      100% !important;

    max-width:
      100% !important;

    min-inline-size:
      0 !important;

    min-width:
      0 !important;

    margin-inline:
      0 !important;
  }

  body.r2-profile
  .r2-cover__copy
  .r2-cover__title {
    overflow-wrap:
      normal !important;

    word-break:
      normal !important;
  }

  body.r2-profile
  .r2-cover__copy
  .r2-cover__title
  .gold {
    white-space:
      normal !important;
  }
}

/*
 * Slightly tighten the longest Latin Cover compositions only at
 * narrow mobile sizes. Copy remains untouched.
 */

@media (max-width: 479px) {

  html[lang="en"]
  body.r2-profile
  .r2-cover__title {
    font-size:
      clamp(
        2.20rem,
        9.6vw,
        2.75rem
      ) !important;
  }

  html[lang="es"]
  body.r2-profile
  .r2-cover__title {
    font-size:
      clamp(
        2.10rem,
        9vw,
        2.60rem
      ) !important;
  }
}
