/* FNC desktop layout prototypes — 1440px base, prepared from about-fnc-offshore.html.
   This stylesheet affects only body.fnc-layout-template and is not applied to existing pages. */

/* Header order for both prototypes: promo first, phone/contact block directly below. */
body.fnc-layout-template .standard-top .template-header-promo {
  position: absolute;
  right: 18px;
  top: 10px;
  display: block;
  width: 300px;
  height: 101px;
  line-height: 0;
}

body.fnc-layout-template .standard-top .template-header-promo img {
  display: block;
  width: 300px !important;
  height: 101px !important;
  max-width: 100% !important;
  margin: 0;
  padding: 0;
  border: 0;
}

body.fnc-layout-template .standard-top > img.contact {
  top: 119px !important;
  right: 18px;
}

/* Bottom CPA banners. Grid is deliberately outside desktop-only media queries so
   all three items keep the same baseline even when the browser is narrowed. */
body.fnc-layout-template .template-cpa-row {
  display: grid !important;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  align-items: center;
  justify-items: stretch;
  gap: 8px;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  overflow: visible !important;
}

body.fnc-layout-template .template-cpa-row > a {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 0;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 0;
}

body.fnc-layout-template .template-cpa-row > a > img {
  display: block !important;
  float: none !important;
  width: 100% !important;
  max-width: 223px !important;
  height: auto !important;
  aspect-ratio: 223 / 66;
  object-fit: contain;
  margin: 0 auto !important;
  padding: 0 !important;
  vertical-align: middle !important;
}

@media (max-width: 900px) {
  /* The base shell shortens the header at this width; restore enough room for
     the 101px promo plus the 70px phone block in the requested vertical order. */
  body.fnc-layout-template .standard-top {
    height: 196px !important;
  }
  body.fnc-layout-template .standard-top .template-header-promo {
    right: 10px;
    top: 8px;
  }
  body.fnc-layout-template .standard-top > img.contact {
    right: 10px;
    top: 117px !important;
  }
}

@media (min-width: 1121px) {
  body.fnc-layout-template .standard-shell {
    width: min(1440px, 100%);
    max-width: 1440px !important;
    grid-template-columns: 300px minmax(0, 1fr) !important;
    margin: 0 auto;
  }

  body.fnc-layout-template .standard-side {
    width: 300px;
    min-width: 300px;
    box-sizing: border-box;
    border-right: 1px solid #d8d8d8;
  }

  body.fnc-layout-template .standard-side-hero {
    width: 300px;
    height: 300px;
    overflow: hidden;
  }

  body.fnc-layout-template .standard-side-hero img {
    width: 300px !important;
    height: 300px !important;
    max-width: none !important;
    object-fit: cover;
  }

  body.fnc-layout-template .standard-main {
    min-width: 0;
    width: 100%;
  }

  body.fnc-layout-template .standard-content {
    box-sizing: border-box;
  }

  /* 3-column base: 300px left + fluid text + 250px right within 1440px. */
  body.fnc-layout-template.fnc-layout-3col .standard-content-with-right {
    padding: 28px 20px 55px !important;
  }

  body.fnc-layout-template.fnc-layout-3col .standard-main-grid {
    width: 100%;
    max-width: none !important;
    grid-template-columns: minmax(0, 1fr) 250px !important;
    gap: 28px !important;
    align-items: start;
  }

  body.fnc-layout-template.fnc-layout-3col .legacy-right-added {
    width: 250px;
    min-width: 0;
    box-sizing: border-box;
    padding-left: 18px;
  }

  /* 2-column base: 300px left + full-width text; old right sidebar follows the old left menu. */
  body.fnc-layout-template.fnc-layout-2col .standard-content-two {
    padding: 28px 20px 55px !important;
  }

  body.fnc-layout-template.fnc-layout-2col .standard-main-grid {
    display: block !important;
    width: 100%;
    max-width: none !important;
  }

  body.fnc-layout-template.fnc-layout-2col .standard-main-grid > .legacy-content {
    width: 100%;
    max-width: none !important;
    margin: 0 !important;
  }

  body.fnc-layout-template.fnc-layout-2col .template-left-transferred {
    margin: 0 14px 28px;
    padding: 16px 10px 0;
    color: #555;
    overflow: hidden;
  }

  body.fnc-layout-template.fnc-layout-2col .template-left-transferred .fnc-promo-jurisdictions {
    margin-top: 0;
    padding-top: 0;
    border-top: 0;
  }

  body.fnc-layout-template.fnc-layout-2col .template-left-transferred .fnc-promo-heading {
    margin-bottom: 14px;
  }

  body.fnc-layout-template.fnc-layout-2col .template-left-transferred .fnc-promo-item img {
    width: 100% !important;
    max-width: 250px !important;
    height: auto !important;
    margin-left: auto;
    margin-right: auto;
  }

  body.fnc-layout-template.fnc-layout-2col .template-left-transferred .fnc-right-special img {
    width: 100% !important;
    max-width: 250px !important;
    height: auto !important;
  }
}


/* R5 — header edge alignment; clean sidebars without red eyebrows */
body.fnc-layout-template {
  --template-header-right: 18px;
}

/* Header promo, phone block and horizontal menu share exactly the same right edge. */
body.fnc-layout-template .standard-top .template-header-promo,
body.fnc-layout-template .standard-top > img.contact {
  right: var(--template-header-right) !important;
}
body.fnc-layout-template .standard-horizontal-menu {
  width: calc(100% - var(--template-header-right)) !important;
  margin-left: 0 !important;
  margin-right: var(--template-header-right) !important;
  box-sizing: border-box;
}

/* No decorative red eyebrow in either sidebar. Keep only the native grey group separators. */
body.fnc-layout-template .standard-side-menu,
body.fnc-layout-template .fnc-sidebar-section-title,
body.fnc-layout-template.fnc-layout-3col .legacy-right-added > .fnc-promo-jurisdictions.compact,
body.fnc-layout-template.fnc-layout-2col .template-left-transferred,
body.fnc-layout-template.fnc-layout-2col .template-left-transferred .fnc-promo-jurisdictions.compact {
  border-top: 0 !important;
}
body.fnc-layout-template .standard-side-menu {
  padding-top: 0 !important;
}
body.fnc-layout-template.fnc-layout-2col .template-left-transferred {
  padding-top: 12px !important;
}
body.fnc-layout-template .fnc-promo-heading {
  display: none !important;
}

/* Sidebar links: no underline at rest or on hover; hover changes colour only. */
body.fnc-layout-template .standard-side a,
body.fnc-layout-template .legacy-right-added a,
body.fnc-layout-template .template-left-transferred a {
  text-decoration: none !important;
}
body.fnc-layout-template .standard-side a:hover,
body.fnc-layout-template .legacy-right-added a:hover,
body.fnc-layout-template .template-left-transferred a:hover {
  text-decoration: none !important;
  color: #b00b11 !important;
}

@media (max-width: 900px) {
  body.fnc-layout-template {
    --template-header-right: 10px;
  }
}


/* R10 — compact footer navigation <1020px: arrow.gif before every item, including the first. */
body.fnc-layout-template .template-footer-compact-nav {
  display: none;
}

@media (max-width: 1019px) {
  body.fnc-layout-template .fnc-main-footer {
    padding-top: 10px;
  }

  body.fnc-layout-template .template-footer-compact-nav {
    display: block;
    max-width: 1400px;
    margin: 0 auto 10px;
    padding: 0 2px 9px;
    border-bottom: 1px solid rgba(165,165,165,.35);
    color: #8f8f8f;
    font: 10px/1.55 Arial, Helvetica, sans-serif;
    text-align: left;
  }

  body.fnc-layout-template .template-footer-link-group {
    margin: 0;
    padding: 4px 0;
    border-top: 1px solid rgba(165,165,165,.28);
  }

  body.fnc-layout-template .template-footer-link-group:first-child {
    padding-top: 0;
    border-top: 0;
  }

  body.fnc-layout-template .template-footer-link-group:last-child {
    padding-bottom: 0;
  }

  body.fnc-layout-template .template-footer-group-title,
  body.fnc-layout-template .template-footer-group-title:link,
  body.fnc-layout-template .template-footer-group-title:visited {
    display: block;
    margin: 0 0 2px;
    color: #666 !important;
    font: 700 10px/1.45 Arial, Helvetica, sans-serif !important;
    text-decoration: none !important;
    white-space: nowrap;
  }

  body.fnc-layout-template .template-footer-group-links {
    display: block;
    margin: 0;
    padding: 0;
  }

  body.fnc-layout-template .template-footer-group-links a,
  body.fnc-layout-template .template-footer-group-links a:link,
  body.fnc-layout-template .template-footer-group-links a:visited {
    display: inline-block;
    color: #969696 !important;
    font: 10px/1.55 Arial, Helvetica, sans-serif !important;
    text-decoration: none !important;
    white-space: nowrap;
  }

  body.fnc-layout-template .template-footer-group-links a::before {
    content: "";
    display: inline-block;
    width: 8px;
    height: 7px;
    margin: 0 5px 0 4px;
    background: url("../images/arrow.gif") no-repeat center center;
    background-size: 8px 7px;
    vertical-align: 0;
  }

  body.fnc-layout-template .template-footer-group-title:hover,
  body.fnc-layout-template .template-footer-group-links a:hover {
    color: #b00b11 !important;
    text-decoration: none !important;
  }
}


/* R20 — final bank consultation CTA */
body.fnc-layout-template .fnc-bank-final{margin-top:28px;padding-top:4px;border-top:1px solid rgba(165,165,165,.38);}
body.fnc-layout-template .fnc-bank-consultation-cta{margin:18px 0 24px;}
body.fnc-layout-template .fnc-bank-consultation-cta .fnc-commercial-button{display:inline-block;padding:11px 16px;background:#b00b11;color:#fff!important;text-decoration:none!important;font-weight:700;line-height:1.35;}
body.fnc-layout-template .fnc-bank-consultation-cta .fnc-commercial-button:hover{background:#89090d;color:#fff!important;text-decoration:none!important;}
@media(max-width:760px){body.fnc-layout-template .fnc-bank-consultation-cta .fnc-commercial-button{display:block;width:100%;box-sizing:border-box;text-align:center;white-space:normal;}}