/* Contact layout matching the supplied office / conversation reference. */
body.contact-reference-page { background: #fff; }
.contact-reference-page > .ambient-glow { display: none; }
.cr-main { color: #173453; }
.cr-main .cr-wrap { width: min(1080px, calc(100% - 80px)); margin-inline: auto; }
.cr-main .cr-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.cr-contact-hero { position: relative; display: grid; min-height: 370px; place-items: center; overflow: hidden; isolation: isolate; padding: 126px 24px 54px; background: #f6fafc; text-align: center; }
.cr-contact-hero::before { content: ''; position: absolute; inset: 0; z-index: -2; background: url('../../assets/images/hero-corporate-architecture.png') right 48% / cover no-repeat; opacity: .3; }
.cr-contact-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(90deg, rgba(248, 251, 253, .97) 0%, rgba(248, 251, 253, .89) 52%, rgba(248, 251, 253, .58) 100%); }
.cr-contact-hero-content { display: flex; flex-direction: column; align-items: center; }
.cr-contact-breadcrumbs { display: flex; align-items: center; justify-content: center; gap: 12px; margin-bottom: 25px; color: #0f172a; font-size: 14px; font-weight: 700; }
.cr-contact-breadcrumbs a { color: #0864c5; text-decoration: none; }
.cr-contact-breadcrumbs i { color: #94a3b8; font-size: 11px; }
.cr-contact-hero-badge { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 18px; padding: 9px 16px; border: 1px solid rgba(8, 100, 197, .28); border-radius: 999px; background: rgba(219, 235, 249, .78); color: #0864c5; font-size: 12px; font-weight: 800; letter-spacing: .1em; }
.cr-contact-hero-badge span { width: 8px; height: 8px; border-radius: 50%; background: #1687df; box-shadow: 0 0 10px rgba(22, 135, 223, .65); }
.cr-contact-hero h1 { max-width: 900px; margin: 0 0 18px; color: #101a30; font-size: clamp(34px, 5vw, 54px); font-weight: 800; line-height: 1.12; letter-spacing: -.035em; }
.cr-contact-hero h1 span { color: #0878ce; background: linear-gradient(100deg, #0878ce, #00a99b); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.cr-contact-hero-copy { max-width: 760px; margin: 0; color: #405773; font-size: clamp(15px, 1.5vw, 18px); line-height: 1.7; }
.cr-contact-hero-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 26px; }
.cr-contact-hero-actions a { display: inline-flex; min-height: 46px; align-items: center; justify-content: center; gap: 10px; padding: 11px 20px; border: 1px solid #cbd9e8; border-radius: 999px; background: rgba(255, 255, 255, .9); color: #173453; font-size: 14px; font-weight: 700; text-decoration: none; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.cr-contact-hero-actions .cr-contact-hero-primary { border-color: #0864c5; background: #0864c5; color: #fff; box-shadow: 0 8px 20px rgba(8, 100, 197, .2); }
.cr-contact-hero-actions a:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15, 23, 42, .12); }
.cr-office-section { padding: 56px 0; background: #fff; }
.cr-office-grid { display: grid; grid-template-columns: 1.12fr 1fr; gap: 82px; align-items: center; }
.cr-office-visual { position: relative; padding-right: 48px; padding-bottom: 10px; }
.cr-reception { position: relative; height: 470px; border-radius: 10px; overflow: hidden; box-shadow: 0 8px 24px #123e5a12; }
.cr-reception-photo { width: 100%; height: 100%; object-fit: cover; }
.cr-office-brand { position: absolute; left: 13%; top: 30%; width: 39%; height: auto; transform: perspective(550px) rotateY(12deg); mix-blend-mode: multiply; }
.cr-round-office { position: absolute; width: 205px; aspect-ratio: 1; right: -17px; bottom: 9px; padding: 6px; background: #fff; border-radius: 50%; box-shadow: 0 5px 20px #145c8630; }
.cr-round-office img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; }
.cr-details { min-width: 0; }
.cr-detail { display: grid; grid-template-columns: 46px 1fr; gap: 20px; padding: 19px 0; }
.cr-detail:first-child { padding-top: 0; }
.cr-detail-copy { border-bottom: 1px solid #e2ebf2; padding-bottom: 16px; }
.cr-detail:last-of-type .cr-detail-copy { padding-bottom: 19px; }
.cr-detail-icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; color: #fff; background: linear-gradient(140deg, #079be2, #005aab); box-shadow: 0 0 0 3px #e9f4fa; font-size: 21px; margin-top: 4px; }
.cr-detail-icon.cr-teal { background: linear-gradient(140deg, #15c6bb, #00987e); }
.cr-details h2 { margin: 0 0 6px; color: #173453; font-size: 18px; font-weight: 700; line-height: 1.3; }
.cr-details p,
.cr-details address { color: #425e78; font-style: normal; font-size: 14px; line-height: 1.65; margin: 0; }
.cr-details a { color: inherit; text-decoration: none; overflow-wrap: anywhere; }
.cr-details a:hover { color: #0864c5; text-decoration: underline; }
.cr-follow { display: flex; align-items: center; gap: 24px; padding-top: 2px; }
.cr-follow > span { font-size: 15px; color: #173453; font-weight: 700; }
.cr-follow .reference-socials { gap: 12px; }
.cr-follow .reference-socials a { width: 33px; height: 33px; color: #fff; }
.cr-message-section { position: relative; overflow: hidden; padding: 37px 0 47px; background: linear-gradient(110deg, #e9f5ff 0%, #f6fbff 55%, #eaf6fe 100%); isolation: isolate; }
.cr-message-section::before { content: ''; position: absolute; inset: 0; z-index: -1; background: url('../../assets/images/hero-cityscape-skyline.jpg') center / cover; opacity: .065; }
.cr-message-heading { text-align: center; margin-bottom: 28px; }
.cr-eyebrow { color: #36556f; font-size: 10px; font-weight: 700; letter-spacing: .32em; margin: 0 0 20px; }
.cr-eyebrow::after { content: ''; display: block; width: 76px; height: 2px; background: #2ca9e6; margin: 11px auto 0; }
.cr-message-heading h2 { margin: 0 0 10px; color: #103351; font: 700 clamp(29px, 3.6vw, 44px)/1.18 Georgia, 'Times New Roman', serif; letter-spacing: -.025em; }
.cr-message-heading h2 span { color: #0079e7; }
#contactSection .cr-message-heading h2,
#contactSection .cr-message-heading h2 span,
#contactSection .cr-map-header h2 { font-family: Georgia, 'Times New Roman', serif !important; }
.cr-message-heading p { text-align: center !important; }
.cr-message-heading > p:last-child { margin: 0; color: #425e78; font-size: 14px; line-height: 1.6; }
.cr-message-grid { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 70px; }
.cr-form { display: grid; gap: 9px; scroll-margin-top: 110px; }
.cr-field { position: relative; display: block; }
.cr-field > i { position: absolute; top: 16px; left: 15px; color: #658196; font-size: 13px; pointer-events: none; }
.cr-field input,
.cr-field textarea { width: 100%; min-height: 43px; padding: 11px 15px 11px 40px; border: 1px solid #d5e3ee; background: #fff; border-radius: 5px; box-shadow: 0 2px 7px #183b6010; color: #173453; font: inherit; font-size: 13px; line-height: 1.5; }
.cr-field textarea { min-height: 105px; resize: vertical; display: block; }
.cr-field input::placeholder,
.cr-field textarea::placeholder { color: #627b90; opacity: 1; }
.cr-field input:focus,
.cr-field textarea:focus { outline: 3px solid #0864c522; border-color: #0864c5; }
.cr-send { display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%; min-height: 43px; border: 0; border-radius: 5px; background: linear-gradient(100deg, #034979, #0078ee); color: #fff; font: inherit; font-weight: 600; font-size: 13px; cursor: pointer; box-shadow: 0 4px 12px #0864c529; }
.cr-send:hover { background: linear-gradient(100deg, #033d65, #0068d3); }
.cr-send:disabled { opacity: .65; cursor: wait; }
.cr-send:focus-visible { outline: 3px solid #079be2; outline-offset: 4px; }
.cr-feedback { font-size: 13px; padding: 13px 16px; border-radius: 5px; line-height: 1.6; overflow-wrap: anywhere; }
.cr-feedback:empty { display: none; }
.cr-feedback.success { color: #126344; background: #e5f7ef; border: 1px solid #a2d5bf; }
.cr-feedback.error { color: #9b2633; background: #fff0f0; border: 1px solid #e9b7be; }
.cr-message-visual { position: relative; padding-left: 72px; padding-block: 8px; }
.cr-message-visual::before { content: ''; position: absolute; inset: 0 4% 8% 12%; z-index: -1; border-radius: 24px; transform: rotate(7deg); background: linear-gradient(140deg, #57c8ed, #17aee3); opacity: .72; }
.cr-desk-photo { display: block; width: 100%; height: 320px; border-radius: 10px; object-fit: cover; transform: perspective(1100px) rotateY(-8deg); box-shadow: 0 7px 25px #1b6f941c; }
.cr-handshake { position: absolute; left: -10px; top: 52px; width: 210px; height: auto; aspect-ratio: 1; border: 5px solid #fff; border-radius: 50%; object-fit: cover; box-shadow: 0 5px 20px #145c862a; }
.cr-map-section { padding: 42px 0 48px; background: #fff; }
.cr-map-header { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.cr-map-header h2 { margin: 0 0 6px; color: #173453; font-family: Georgia, 'Times New Roman', serif; font-size: 26px; }
.cr-map-header p { margin: 0; font-size: 13px; color: #5c748a; line-height: 1.6; }
.cr-map-directions { display: inline-flex; align-items: center; justify-content: center; gap: 9px; flex-shrink: 0; min-height: 43px; padding: 10px 17px; border: 1px solid #c9dfea; border-radius: 6px; text-decoration: none; color: #0864c5; background: #f4faff; font-size: 13px; font-weight: 600; }
.cr-map-directions:hover { background: #e7f3ff; }
.cr-map-frame { height: 320px; width: 100%; position: relative; z-index: 0; border-radius: 10px; border: 1px solid #d5e3ee; background: #eaf2f7; overflow: hidden; }
.cr-map-fallback { height: 100%; display: flex; align-items: center; justify-content: center; gap: 10px; color: #0864c5; text-decoration: none; padding: 24px; text-align: center; font-size: 14px; }
.cr-map-frame.leaflet-container .cr-map-fallback { display: none; }
.cr-main a:focus-visible { outline: 3px solid #079be2; outline-offset: 4px; }
@media (max-width: 1000px) {
  .cr-office-grid { gap: 42px; }
  .cr-reception { height: 420px; }
  .cr-round-office { width: 175px; right: -6px; }
  .cr-message-grid { gap: 38px; }
  .cr-handshake { width: 175px; left: 0; }
  .cr-desk-photo { height: 305px; }
  .cr-detail { gap: 15px; }
}
@media (max-width: 760px) {
  .cr-main .cr-wrap { width: calc(100% - 40px); }
  .cr-contact-hero { min-height: 0; padding: 112px 20px 40px; }
  .cr-contact-breadcrumbs { margin-bottom: 20px; }
  .cr-contact-hero-badge { margin-bottom: 15px; }
  .cr-contact-hero h1 { font-size: clamp(32px, 8vw, 42px); }
  .cr-office-section { padding: 42px 0 34px; }
  .cr-office-grid { grid-template-columns: 1fr; gap: 32px; }
  .cr-office-visual { width: min(480px, 100%); margin-inline: auto; padding-right: 36px; }
  .cr-reception { height: 360px; }
  .cr-round-office { width: 160px; right: 0; }
  .cr-details { width: 100%; }
  .cr-detail { grid-template-columns: 40px 1fr; gap: 16px; padding-block: 12px; }
  .cr-detail-icon { width: 38px; height: 38px; font-size: 18px; }
  .cr-details h2 { font-size: 17px; }
  .cr-details p, .cr-details address { font-size: 13px; }
  .cr-follow { gap: 20px; padding-top: 10px; }
  .cr-follow .reference-socials { gap: 10px; }
  .cr-message-section { padding: 30px 0 35px; }
  .cr-message-heading { margin-bottom: 23px; }
  .cr-message-heading h2 { font-size: clamp(29px, 7vw, 37px); }
  .cr-message-heading > p:last-child { font-size: 13px; }
  .cr-message-grid { grid-template-columns: 1fr; gap: 29px; }
  .cr-field input, .cr-field textarea { font-size: 14px; min-height: 46px; }
  .cr-field textarea { min-height: 110px; }
  .cr-send { min-height: 46px; font-size: 14px; }
  .cr-message-visual { width: min(460px, 100%); margin-inline: auto; padding-left: 65px; }
  .cr-desk-photo { height: 255px; }
  .cr-handshake { width: 160px; top: 48px; left: 0; }
  .cr-map-section { padding-block: 32px; }
  .cr-map-header { flex-direction: column; align-items: flex-start; gap: 14px; }
  .cr-map-frame { height: 280px; }
}
@media (max-width: 380px) {
  .cr-main .cr-wrap { width: calc(100% - 32px); }
  .cr-reception { height: 315px; }
  .cr-round-office { width: 140px; }
  .cr-follow { gap: 13px; }
  .cr-follow .reference-socials { gap: 8px; }
  .cr-follow .reference-socials a { width: 30px; height: 30px; }
  .cr-handshake { width: 140px; }
}
@media (prefers-reduced-motion: reduce) {
  .cr-field input, .cr-field textarea { transition: none; }
}