.contact-section { --contact-ink:#002b3c; background:#f2f9fb; color:var(--contact-ink); padding:clamp(48px,5vw,90px) clamp(20px,3.7vw,80px); scroll-margin-top:24px; }
.contact-container { max-width:1600px; margin:auto; }
.contact-grid { display:grid; grid-template-columns:minmax(0,2.1fr) minmax(290px,1fr); grid-template-areas:'intro live' 'form direct'; gap:20px; align-items:start; }
.contact-intro { grid-area:intro; display:grid; grid-template-columns:minmax(0,1fr) 130px; align-items:center; gap:28px; padding:5px 14px 22px; }
.contact-kicker { display:flex; align-items:center; gap:16px; margin:0 0 18px; font-family:var(--display); font-size:12px; font-weight:600; color:#4d6b7b; }
.contact-kicker > span { width:clamp(80px,16vw,240px); height:1px; background:#91a9b4; }
.contact-heading { margin:0; font-family:var(--display); font-size:clamp(34px,4.2vw,70px); font-weight:600; letter-spacing:-.045em; line-height:1.03; overflow-wrap:anywhere; }
.contact-heading > span { display:block; }
.contact-description { max-width:730px; margin:24px 0 0; font-size:clamp(15px,1.3vw,20px); color:#526e7d; line-height:1.45; }
.contact-motto { align-self:stretch; display:flex; flex-direction:column; justify-content:center; border-left:1px solid #96aeb8; padding-left:24px; margin:14px 0 4px; color:#526e7d; font-size:14px; font-weight:600; line-height:1.35; }
.contact-motto > span { width:30px; height:1px; background:#6c8a98; margin-top:22px; }
.contact-live-card { grid-area:live; position:relative; align-self:stretch; width:100%; min-height:240px; aspect-ratio:1.42; padding:0; overflow:hidden; isolation:isolate; border-radius:18px; color:#fff; background:#002b3c; box-shadow:0 8px 24px #7aabb51a; }
.contact-live-card > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:76% center; transition:transform .65s cubic-bezier(.16,1,.3,1); }
.contact-live-shade { position:absolute; inset:0; background:linear-gradient(0deg,#001e31d9,transparent 65%); }
.contact-live-copy { position:absolute; left:18px; right:18px; bottom:18px; display:flex; align-items:center; gap:12px; text-align:left; font-family:var(--display); font-weight:600; font-size:clamp(10px,.85vw,13px); line-height:1.4; }
.contact-live-copy > svg { flex-shrink:0; width:44px; height:44px; transition:filter .3s,transform .3s; }
.contact-live-copy > svg path { fill:currentColor; stroke:none; }
.contact-live-card:hover > img { transform:scale(1.04); }
.contact-live-card:hover .contact-live-copy > svg { transform:scale(1.07); filter:drop-shadow(0 0 10px #b4e3ff); }
.contact-form-card { grid-area:form; min-width:0; padding:18px clamp(20px,2.6vw,40px) 26px; border-radius:22px; background:#e5f0f4; }
.contact-modes { display:flex; align-items:stretch; gap:6px; flex-wrap:wrap; padding-bottom:14px; margin-bottom:27px; border-bottom:1px solid #b9d0da; }
.contact-mode { display:inline-flex; justify-content:center; align-items:center; flex:0 1 auto; gap:10px; min-height:48px; max-width:100%; padding:11px 14px; border-radius:10px; color:#688592; background:transparent; text-align:left; transition:background .25s,box-shadow .25s,color .25s,transform .25s; }
.contact-mode-icon { display:grid; place-items:center; flex-shrink:0; }
.contact-mode-icon > svg { width:22px; height:22px; }
.contact-mode-copy { min-width:0; display:flex; flex-direction:column; gap:3px; }
.contact-mode-copy > span { font-family:var(--display); font-size:clamp(10px,.83vw,12px); font-weight:600; line-height:1.4; }
.contact-mode-copy > small { font-size:11px; line-height:1.3; }
.contact-mode:hover { color:#214d65; background:#d3e8f1; box-shadow:0 0 20px #8bbcc744; transform:translateY(-1px); }
.contact-mode.is-active { color:#fff; background:#002b3c; box-shadow:0 6px 18px #517c9024; }
.contact-mode.is-active:hover { background:#174b61; box-shadow:0 0 20px #8fcade66; }
.contact-mode:disabled { cursor:wait; opacity:.7; }
.contact-form-heading { display:none; }
.contact-fields { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:22px; row-gap:18px; margin:0; padding:0; min-width:0; border:0; }
.contact-field { min-width:0; }
.contact-field > label { display:block; margin-bottom:9px; font-family:var(--display); font-weight:600; font-size:clamp(10px,.86vw,13px); line-height:1.4; }
.contact-field--message { grid-column:1/-1; }
.contact-field :is(input:not([type=file]),select,textarea) { font-family:Arial,sans-serif; font-size:16px; color:var(--contact-ink); }
.contact-field > input, .contact-select, .contact-phone-field, .contact-upload, .contact-textarea { width:100%; min-width:0; min-height:48px; border:1px solid #d5e2eb; border-radius:10px; background:#fff; transition:border-color .2s,box-shadow .2s; }
.contact-field > input { padding:13px 16px; }
.contact-field input::placeholder, .contact-field textarea::placeholder { color:#778e9b; opacity:1; }
.contact-field > input:focus, .contact-field :is(.contact-select,.contact-phone-field,.contact-upload,.contact-textarea):focus-within { border-color:#80b6cf; box-shadow:var(--focus-halo); }
.contact-phone-field { display:grid; grid-template-columns:112px minmax(0,1fr); overflow:hidden; }
.contact-phone-prefix { display:flex; align-items:center; gap:6px; padding-left:12px; position:relative; border-right:1px solid #dce7ed; }
.contact-phone-prefix > span { font-size:18px; line-height:1; }
.contact-phone-prefix select { border:0; appearance:none; min-width:0; width:100%; background:transparent; padding:12px 20px 12px 0; border-radius:0; cursor:pointer; }
.contact-phone-prefix > svg { position:absolute; right:10px; width:12px; height:12px; pointer-events:none; }
.contact-phone-field > input { width:100%; min-width:0; border:0; background:transparent; padding:12px 13px; }
.contact-select { display:block; position:relative; }
.contact-select select { width:100%; min-width:0; min-height:46px; border:0; appearance:none; background:transparent; padding:12px 40px 12px 16px; cursor:pointer; }
.contact-select > svg { position:absolute; width:18px; height:18px; top:14px; right:15px; pointer-events:none; }
.contact-file-control { display:flex; align-items:center; gap:6px; }
.contact-upload { position:relative; display:flex; align-items:center; gap:10px; padding:12px 15px; cursor:pointer; }
.contact-upload > svg { width:22px; height:22px; flex-shrink:0; }
.contact-upload > span { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#718b9a; font-size:14px; }
.contact-file-remove { flex-shrink:0; display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:#d4e8ef; color:#365d70; }
.contact-file-remove > svg { width:17px; height:17px; }
.contact-file-hint { display:block; margin-top:6px; color:#6a8491; font-size:11px; }
.contact-textarea { position:relative; padding-bottom:28px; overflow:hidden; }
.contact-textarea > textarea { display:block; width:100%; min-height:80px; max-height:220px; min-width:0; padding:14px 16px 0; border:0; background:transparent; line-height:1.45; resize:vertical; }
.contact-counter { position:absolute; bottom:9px; right:16px; color:#7e929d; font-size:13px; line-height:1.3; }
.contact-error:empty { display:none; }
.contact-error { display:block; margin-top:6px; font-size:12px; line-height:1.4; color:#9c3444; }
.contact-field [aria-invalid=true] { border-color:#b96774; }
.contact-submit-row { display:flex; align-items:center; gap:clamp(20px,2.4vw,38px); margin-top:20px; }
.contact-submit { display:inline-flex; flex:0 1 auto; justify-content:space-between; align-items:center; gap:clamp(12px,2vw,28px); min-height:60px; max-width:100%; padding:7px 8px 7px 24px; border-radius:99px; background:#002b3c; color:#fff; font-family:var(--display); font-size:clamp(10px,.95vw,14px); font-weight:600; line-height:1.3; transition:background .25s,box-shadow .25s,transform .25s; }
.contact-submit > span:first-child { min-width:0; }
.contact-submit-arrow { display:grid; flex-shrink:0; place-items:center; width:44px; height:44px; border-radius:50%; color:#002b3c; background:#fff; transition:transform .25s; }
.contact-submit-arrow > svg { width:22px; height:22px; }
.contact-submit:hover { background:#134c61; box-shadow:0 0 25px #7cbbd752; transform:translateY(-2px); }
.contact-submit:hover .contact-submit-arrow { transform:translateX(1px); }
.contact-submit:disabled { opacity:.7; cursor:wait; transform:none; }
.contact-privacy { display:flex; flex:1; align-items:center; gap:13px; min-width:0; max-width:340px; margin:0; color:#6b8694; font-size:12px; line-height:1.5; }
.contact-privacy > svg { flex-shrink:0; width:23px; height:27px; }
.contact-form-status { margin:16px 0 0; padding:12px 14px; border-radius:12px; background:#d6eaf4; color:#315f76; font-size:14px; line-height:1.5; }
.contact-form-status[data-state=error] { color:#843345; background:#f7e9ec; }
.contact-form-status[data-state=success] { background:#dcefe5; color:#285c4a; }
.contact-honey { display:none!important; }
.contact-direct { grid-area:direct; position:relative; isolation:isolate; padding:26px 27px 24px; overflow:hidden; border-radius:20px; background:#e0eee7; }
.contact-direct::after { content:''; position:absolute; z-index:-1; width:230px; height:230px; right:-80px; top:65px; background:#41656a; opacity:.075; mask:url('/assets/army-fm-logo.webp') center/contain no-repeat; -webkit-mask:url('/assets/army-fm-logo.webp') center/contain no-repeat; pointer-events:none; }
.contact-direct > h3 { margin:0; font-family:var(--display); font-size:clamp(13px,1.2vw,19px); font-weight:600; line-height:1.35; letter-spacing:-.035em; }
.contact-direct-rule { display:block; width:30px; height:1px; margin:20px 0 22px; background:#6a8b93; }
.contact-direct-row { display:grid; grid-template-columns:29px minmax(0,1fr) 32px; gap:13px; align-items:center; margin:0 0 25px; }
.contact-direct-row > svg { width:29px; height:29px; }
.contact-direct-row > a { min-width:0; display:flex; flex-direction:column; gap:4px; }
.contact-direct-row > a > span { font-size:14px; line-height:1.5; color:#365867; }
.contact-direct-row strong { font-family:var(--display); font-weight:600; font-size:clamp(12px,1.1vw,18px); line-height:1.45; letter-spacing:-.035em; overflow-wrap:anywhere; user-select:text; -webkit-user-select:text; }
.contact-copy { display:grid; place-items:center; width:32px; height:40px; border-radius:8px; color:#1d4d63; background:transparent; transition:background .22s,box-shadow .22s,transform .22s; }
.contact-copy > svg { width:18px; height:22px; }
.contact-copy:hover { background:#d1e6e3; box-shadow:0 0 15px #91bfca45; transform:translateY(-1px); }
.contact-direct-row--telegram > svg:last-child { width:21px; height:21px; }
.contact-copy-status { color:#356777; font-size:12px; line-height:1.5; margin:0 0 15px; }
.contact-socials { border-top:1px solid #b1c9c6; margin-top:28px; padding-top:15px; }
.contact-socials > p { margin:0 0 15px; color:#4b6c76; font-size:13px; line-height:1.3; }
.contact-socials > nav { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.contact-socials a { display:grid; place-items:center; min-height:42px; aspect-ratio:1; border-radius:12px; background:#cce0df; color:#003244; transition:background .25s,box-shadow .25s,transform .25s; }
.contact-socials svg { width:22px; height:22px; }
.contact-socials a.contact-social-direct { background:#fff; }
.contact-socials a:hover { background:#b9dce1; box-shadow:0 0 18px #8dbbc15c; transform:translateY(-3px); }
.contact-section :is(button,a):active { transform:scale(.98); }
.contact-dialog { width:min(520px,100%); max-width:100%; max-height:calc(100svh - 16px - env(safe-area-inset-top,0px)); margin:auto auto 0; padding:14px 20px calc(18px + env(safe-area-inset-bottom,0px)); border:0; border-radius:26px 26px 0 0; background:#eff9fc; color:#002b3c; box-shadow:0 -12px 60px #092d4240; overflow:hidden; }
.contact-dialog[open] { display:flex; flex-direction:column; animation:contact-sheet-reveal .34s cubic-bezier(.16,1,.3,1); }
.contact-dialog::backdrop { background:#002238b3; backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
.contact-dialog-handle { flex-shrink:0; width:42px; height:4px; margin:0 auto 20px; border-radius:99px; background:#d1e1e7; }
.contact-dialog-close { position:absolute; top:15px; right:16px; display:grid; place-items:center; width:36px; height:36px; border-radius:50%; background:#dceef5; color:#214253; z-index:2; }
.contact-dialog-close > svg { width:20px; height:20px; }
.contact-dialog-content { min-height:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; scrollbar-color:#a8c5d4 transparent; -webkit-overflow-scrolling:touch; padding:4px 3px; }
.contact-dialog .contact-form-heading { display:grid; grid-template-columns:46px minmax(0,1fr); gap:12px; padding-right:22px; margin-bottom:20px; }
.contact-form-heading-icon { display:grid; place-items:center; width:46px; height:50px; border-radius:11px; color:#fff; background:#002b3c; }
.contact-form-heading-icon > svg { width:24px; height:24px; }
.contact-form-heading h3 { margin:0 0 6px; font-family:var(--display); font-weight:600; font-size:14px; line-height:1.4; letter-spacing:-.04em; }
.contact-form-heading p { margin:0; color:#6a8290; font-size:12px; line-height:1.4; }
@supports (height:100dvh) { .contact-dialog { max-height:calc(100dvh - 16px - env(safe-area-inset-top,0px)); } }
@keyframes contact-sheet-reveal { from { opacity:0; transform:translateY(32px); } to { opacity:1; transform:translateY(0); } }
@media (max-width:1100px) {
  .contact-grid { grid-template-columns:minmax(0,1.6fr) minmax(270px,1fr); grid-template-areas:'intro intro' 'form live' 'form direct'; gap:18px; }
  .contact-heading { font-size:clamp(38px,5.4vw,62px); }
  .contact-intro { padding:0 0 12px; }
  .contact-description { max-width:760px; font-size:17px; }
  .contact-live-card { min-height:180px; aspect-ratio:1.8; }
  .contact-form-card { grid-row:2/4; padding:18px 20px 24px; }
  .contact-modes { gap:7px; margin-bottom:22px; }
  .contact-mode { min-height:44px; padding:9px 10px; gap:8px; }
  .contact-fields { grid-template-columns:minmax(0,1fr); gap:15px; }
  .contact-field > label { font-size:11px; }
  .contact-submit-row { flex-direction:column; align-items:flex-start; gap:16px; }
  .contact-submit { font-size:11px; min-height:54px; padding-left:20px; }
  .contact-submit-arrow { width:40px; height:40px; }
  .contact-direct { padding:22px 20px; }
  .contact-direct-row { gap:10px; }
  .contact-direct-row strong { font-size:12px; }
  .contact-direct-row > a > span { font-size:13px; }
  .contact-socials > nav { gap:6px; }
  .contact-socials a { min-height:36px; border-radius:9px; }
  .contact-socials svg { width:19px; height:19px; }
}
@media (max-width:760px) {
  .contact-section { padding:42px 20px 36px; }
  .contact-grid { display:flex; flex-direction:column; gap:18px; }
  .contact-intro { display:block; padding:0; order:0; }
  .contact-motto { display:none; }
  .contact-kicker { font-size:9px; gap:11px; margin-bottom:13px; }
  .contact-kicker > span { width:86px; }
  .contact-heading { font-size:clamp(26px,7.4vw,46px); line-height:1.08; letter-spacing:-.05em; }
  .contact-description { font-size:15px; line-height:1.45; margin-top:16px; }
  .contact-form-card { width:100%; order:1; padding:0; border-radius:0; background:transparent; }
  .contact-inline-host { display:none; }
  .contact-modes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; padding:0; margin:0; border:0; }
  .contact-mode { justify-content:center; width:100%; min-height:63px; gap:6px; padding:9px 7px; border-radius:10px; background:#dfedf3; }
  .contact-mode-icon > svg { width:18px; height:18px; }
  .contact-mode-copy > span { font-size:clamp(8px,2.1vw,10px); line-height:1.45; overflow-wrap:anywhere; }
  .contact-mode-copy > small { font-size:clamp(8px,2.25vw,11px); line-height:1.3; }
  .contact-live-card { width:100%; order:2; align-self:auto; min-height:0; aspect-ratio:2.35; border-radius:14px; }
  .contact-live-copy { left:14px; right:14px; bottom:13px; gap:10px; font-size:10px; }
  .contact-live-copy > svg { width:36px; height:36px; }
  .contact-direct { order:3; width:100%; padding:23px 20px 22px; border-radius:17px; }
  .contact-direct > h3 { font-size:16px; }
  .contact-direct-rule { margin:15px 0 19px; width:26px; }
  .contact-direct-row { grid-template-columns:27px minmax(0,1fr) 44px; gap:13px; margin-bottom:23px; }
  .contact-direct-row > svg { width:27px; height:27px; }
  .contact-direct-row > a > span { font-size:14px; }
  .contact-direct-row strong { font-size:clamp(12px,3.45vw,16px); }
  .contact-copy { width:44px; min-height:44px; }
  .contact-socials { margin-top:24px; padding-top:14px; }
  .contact-socials > nav { gap:7px; }
  .contact-socials a { min-height:42px; }
  .contact-socials svg { width:21px; height:21px; }
  .contact-dialog .contact-fields { grid-template-columns:minmax(0,1fr); gap:14px; }
  .contact-dialog .contact-field > label { font-size:10px; margin-bottom:7px; }
  .contact-dialog .contact-field > input, .contact-dialog .contact-select, .contact-dialog .contact-phone-field, .contact-dialog .contact-upload { min-height:44px; }
  .contact-dialog .contact-field > input, .contact-dialog .contact-phone-field > input { padding-top:11px; padding-bottom:11px; }
  .contact-dialog .contact-select select { min-height:42px; }
  .contact-dialog .contact-select > svg { top:12px; }
  .contact-dialog .contact-upload > span { font-size:13px; }
  .contact-dialog .contact-textarea > textarea { min-height:80px; resize:none; }
  .contact-dialog .contact-submit-row { gap:13px; margin-top:17px; }
  .contact-dialog .contact-submit { width:100%; min-height:50px; padding:6px 6px 6px 17px; font-size:clamp(9px,2.6vw,12px); gap:10px; }
  .contact-dialog .contact-submit-arrow { width:38px; height:38px; }
  .contact-dialog .contact-privacy { max-width:100%; font-size:11px; gap:10px; }
}
@media (max-width:360px) {
  .contact-socials > nav { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .contact-socials a { aspect-ratio:auto; min-height:44px; }
  .contact-mode { flex-direction:column; gap:5px; min-height:78px; text-align:center; }
  .contact-mode-copy > small { font-size:8px; }
  .contact-dialog { padding-inline:16px; }
  .contact-dialog .contact-form-heading { grid-template-columns:40px minmax(0,1fr); gap:10px; }
  .contact-form-heading-icon { width:40px; height:46px; }
  .contact-form-heading h3 { font-size:12px; }
}
/* Compact contact landing: one form, opened in a dialog at every viewport size. */
.contact-section { position:relative; isolation:isolate; display:flex; align-items:center; min-height:72svh; padding:clamp(28px,3.5svh,56px) clamp(20px,3.7vw,80px); background:#edf7fc; }
.contact-container { width:100%; max-width:1720px; }
.contact-background { position:absolute; z-index:-1; inset:0; overflow:hidden; pointer-events:none; }
.contact-background > img:not(.contact-background-brand) { display:block; width:100%; height:100%; object-fit:cover; object-position:76% 40%; }
.contact-background-shade { position:absolute; inset:0; background:linear-gradient(90deg,#f1f9fd 0%,#f1f9fdfc 35%,#e9f5fbdf 50%,#deeff752 62%,#d7edf200 72%),linear-gradient(0deg,#edf7fc 0%,#edf7fce8 16%,#edf7fc00 48%); }
.contact-background-brand { position:absolute; left:52%; top:2%; width:clamp(180px,20vw,360px); height:auto; opacity:.08; }
.contact-grid { grid-template-columns:minmax(0,1.7fr) minmax(0,1fr); grid-template-areas:'intro live' 'form form'; gap:16px; align-items:stretch; }
.contact-intro { grid-template-columns:minmax(0,550px) 112px; gap:22px; padding:0; min-height:clamp(245px,32svh,370px); }
.contact-kicker { margin-bottom:15px; font-size:clamp(10px,.9vw,14px); }
.contact-kicker > span { width:clamp(110px,17vw,290px); }
.contact-heading { font-size:clamp(35px,3.65vw,66px); line-height:1.07; overflow-wrap:normal; }
.contact-description { max-width:620px; margin-top:18px; font-size:clamp(15px,1.2vw,20px); line-height:1.5; text-wrap:pretty; }
.contact-motto { padding-left:22px; font-size:clamp(12px,.95vw,16px); margin:38px 0 12px; color:#315362; }
.contact-live-card { min-height:0; aspect-ratio:auto; background:transparent; border-radius:16px; box-shadow:none; align-self:stretch; }
.contact-live-copy { bottom:24px; left:12px; right:0; font-size:clamp(11px,1.1vw,18px); gap:15px; text-shadow:0 2px 12px #001d2b; }
.contact-live-copy > svg { width:52px; height:52px; }
.contact-form-card { grid-row:auto; padding:7px; border-radius:20px; background:#ffffffad; border:1px solid #ffffffc9; box-shadow:0 8px 30px #7dacc01a; }
.contact-inline-host { display:none; }
.contact-modes { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0; padding:0; border:0; }
.contact-mode { position:relative; display:grid; grid-template-columns:36px minmax(0,1fr) 34px; align-items:center; justify-content:start; min-height:110px; width:100%; gap:14px; padding:18px; border-radius:15px; color:#002b3c; background:#e2f0f8e6; overflow:hidden; }
.contact-mode--greeting { background:#e4f1e6ed; }
.contact-mode.is-active { background:#002b3cf2; box-shadow:0 6px 20px #315b6c26; }
.contact-mode-icon { align-self:start; margin-top:2px; }
.contact-mode-icon > svg { width:34px; height:34px; stroke-width:1.5; }
.contact-mode-copy { gap:8px; }
.contact-mode-copy,.contact-direct-copy { user-select:text; -webkit-user-select:text; }
.contact-mode-copy > span { font-size:clamp(11px,1.16vw,19px); line-height:1.28; letter-spacing:-.03em; }
.contact-mode-copy > span > span { display:block; }
.contact-mode-copy > small { font-size:clamp(12px,1vw,16px); line-height:1.4; color:#526f7e; text-wrap:pretty; }
.contact-mode.is-active .contact-mode-copy > small { color:#d2e4ee; }
.contact-mode-arrow { align-self:end; display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#cde2ed; color:#002b3c; transition:transform .25s,background .25s; }
.contact-mode--greeting .contact-mode-arrow { background:#d0e5d5; }
.contact-mode.is-active .contact-mode-arrow { background:#c7e0ec66; color:#fff; }
.contact-mode-arrow > svg { width:20px; height:20px; }
.contact-direct { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:0; padding:10px 8px; border:1px solid #ffffffdf; border-radius:18px; background:#f8fcffd9; box-shadow:0 5px 24px #719caf0d; overflow:visible; }
.contact-direct::after { display:none; }
.contact-direct-action { display:flex; align-items:center; gap:14px; min-width:0; min-height:62px; padding:7px 18px; border-radius:10px; background:transparent; color:#002b3c; text-align:left; transition:background .25s,box-shadow .25s; }
.contact-direct-action + .contact-direct-action { border-left:1px solid #b8cfdc; border-radius:0 10px 10px 0; }
.contact-direct-icon { display:grid; place-items:center; width:48px; height:48px; flex-shrink:0; border-radius:50%; background:#e5f1f7; }
.contact-direct-icon > svg { width:26px; height:26px; }
.contact-direct-copy { display:grid; gap:4px; min-width:0; }
.contact-direct-copy > span { color:#567080; font-size:clamp(12px,1vw,16px); line-height:1.4; }
.contact-direct-copy > strong { font-family:Arial,sans-serif; font-size:clamp(15px,1.45vw,24px); font-weight:700; line-height:1.3; letter-spacing:-.025em; overflow-wrap:anywhere; }
.contact-direct-arrow { display:flex; margin-left:auto; width:22px; height:22px; flex:0 0 auto; color:#638194; }
.contact-dialog { width:min(760px,calc(100% - 48px)); max-height:calc(100svh - 48px); margin:auto; padding:30px; border-radius:24px; background:#eff8fc; box-shadow:0 24px 90px #00223866; }
.contact-dialog-handle { display:none; }
.contact-dialog .contact-form-heading { grid-template-columns:46px minmax(0,1fr); margin-bottom:24px; padding-right:32px; }
.contact-dialog .contact-form-heading h3 { font-size:18px; }
.contact-dialog .contact-form-heading p { font-size:14px; }
.contact-dialog .contact-fields { grid-template-columns:repeat(2,minmax(0,1fr)); gap:17px 20px; }
.contact-dialog .contact-submit-row { flex-direction:row; align-items:center; gap:20px; }
.contact-dialog .contact-submit { min-height:52px; font-size:11px; padding:6px 7px 6px 20px; gap:15px; }
.contact-dialog .contact-submit-arrow { width:38px; height:38px; }
.contact-dialog .contact-privacy { font-size:11px; }
.contact-dialog-close { top:18px; right:18px; width:36px; height:36px; }
.contact-channel-dialog { width:min(500px,calc(100% - 40px)); max-height:calc(100svh - 40px); margin:auto; padding:32px; border:0; border-radius:24px; background:#eff8fc; color:#002b3c; box-shadow:0 24px 90px #00223866; overflow-y:auto; }
.contact-channel-dialog[open] { animation:contact-sheet-reveal .3s cubic-bezier(.16,1,.3,1); }
.contact-channel-dialog::backdrop { background:#002238b3; backdrop-filter:blur(5px); -webkit-backdrop-filter:blur(5px); }
.contact-channel-dialog > h3 { margin:0 38px 24px 0; font-family:var(--display); font-size:20px; line-height:1.3; letter-spacing:-.035em; }
.contact-channel-panel > p { margin:0 0 16px; color:#526f7e; font-size:15px; line-height:1.5; }
.contact-channel-link { display:flex; align-items:center; gap:13px; min-height:60px; margin-bottom:12px; padding:13px; border-radius:14px; background:#deedf5; color:#002b3c; }
.contact-channel-link > svg { width:23px; height:23px; flex-shrink:0; }
.contact-channel-link > svg:last-child { margin-left:auto; width:18px; height:18px; }
.contact-channel-link > strong { font-size:18px; font-weight:600; overflow-wrap:anywhere; }
.contact-channel-copy { display:flex; align-items:center; gap:10px; min-height:44px; padding:8px 12px; background:transparent; color:#446d82; border-radius:10px; font-size:14px; }
.contact-channel-copy > svg { width:19px; height:19px; }
.contact-channel-dialog .contact-socials > nav { grid-template-columns:repeat(5,minmax(0,1fr)); }
@media(hover:hover) {
 .contact-mode:hover .contact-mode-arrow { transform:translateX(3px); }
 .contact-mode:hover { box-shadow:0 0 28px #80b6ce6b,0 7px 20px #2b647626; }
 .contact-direct-action:hover { background:#dceff8; box-shadow:0 0 20px #91c4da33; }
 .contact-channel-link:hover,.contact-channel-copy:hover { background:#cde5f1; }
}
@media(max-width:1100px) and (min-width:761px) {
 .contact-intro { grid-template-columns:minmax(0,1fr); }
 .contact-motto { display:none; }
 .contact-heading { font-size:clamp(34px,4.6vw,49px); }
 .contact-description { font-size:16px; }
 .contact-mode { grid-template-columns:28px minmax(0,1fr) 28px; gap:9px; padding:15px 12px; min-height:112px; }
 .contact-mode-icon > svg { width:28px; height:28px; }
 .contact-mode-arrow { width:28px; height:28px; }
 .contact-mode-copy > span { font-size:12px; }
 .contact-mode-copy > small { font-size:12px; }
 .contact-direct-action { padding-inline:10px; gap:9px; }
 .contact-direct-icon { width:34px; height:34px; }
 .contact-direct-icon > svg { width:21px; height:21px; }
 .contact-direct-arrow { width:17px; height:17px; }
 .contact-direct-copy > strong { font-size:16px; }
}
@media(max-width:760px) {
 .contact-section { display:block; min-height:0; padding:26px 20px 24px; }
 .contact-background > img:not(.contact-background-brand) { position:absolute; top:0; right:0; width:100%; height:310px; object-position:73% center; }
 .contact-background-shade { background:linear-gradient(0deg,#edf7fc 0%,#edf7fc 49%,#edf7fcb8 70%,#edf7fc3b 100%),linear-gradient(90deg,#edf7fcf5 8%,#edf7fcb3 50%,#edf7fc00 90%); }
 .contact-background-brand { top:40px; left:auto; right:0; width:180px; opacity:.11; }
 .contact-grid { display:grid; grid-template-columns:minmax(0,1fr); grid-template-areas:'intro' 'live' 'form'; gap:14px; }
 .contact-intro { min-height:0; display:block; }
 .contact-kicker { font-size:9px; margin-bottom:13px; }
 .contact-heading { max-width:560px; font-size:clamp(27px,7.3vw,48px); line-height:1.08; }
 .contact-description { max-width:510px; margin-top:15px; font-size:14px; line-height:1.5; }
 .contact-live-card { min-height:50px; width:max-content; max-width:100%; align-self:start; border-radius:99px; padding:8px 13px 8px 8px; background:#002b3ce8; }
 .contact-live-copy { position:static; gap:10px; font-size:9px; text-shadow:none; }
 .contact-live-copy > svg { width:32px; height:32px; }
 .contact-form-card { padding:5px; border-radius:17px; background:#ffffffa6; }
 .contact-modes { grid-template-columns:minmax(0,1fr); gap:7px; }
 .contact-mode { grid-template-columns:30px minmax(0,1fr) 30px; min-height:62px; gap:12px; padding:12px 14px; border-radius:12px; text-align:left; }
 .contact-mode-icon { align-self:center; margin:0; }
 .contact-mode-icon > svg { width:28px; height:28px; }
 .contact-mode-copy { gap:4px; }
 .contact-mode-copy > span { font-size:12px; line-height:1.35; }
 .contact-mode-copy > span > span { display:inline; }
 .contact-mode-copy > small { display:none; }
 .contact-mode-arrow { align-self:center; width:30px; height:30px; }
 .contact-mode-arrow > svg { width:17px; height:17px; }
 .contact-direct { grid-template-columns:repeat(2,minmax(0,1fr)); padding:5px 7px; border-radius:16px; }
 .contact-direct-action { min-height:62px; padding:8px 5px; gap:8px; }
 .contact-direct-action + .contact-direct-action { border-left:1px solid #cfdee6; border-top:0; border-radius:0; }
 .contact-direct-action:last-child { grid-column:1/-1; min-height:54px; border-left:0; border-top:1px solid #cfdee6; }
 .contact-direct-icon { width:28px; height:28px; }
 .contact-direct-icon > svg { width:18px; height:18px; }
 .contact-direct-copy { gap:2px; }
 .contact-direct-copy > span { font-size:10px; }
 .contact-direct-copy > strong { font-size:13px; }
 .contact-direct-action:last-child .contact-direct-copy > strong { font-size:16px; }
 .contact-direct-arrow { display:none; }
 .contact-dialog { width:min(560px,100%); max-height:calc(100svh - 12px - env(safe-area-inset-top,0px)); margin:auto auto 0; padding:14px 20px calc(18px + env(safe-area-inset-bottom,0px)); border-radius:24px 24px 0 0; }
 .contact-dialog-handle { display:block; margin-bottom:20px; }
 .contact-dialog .contact-form-heading { grid-template-columns:40px minmax(0,1fr); margin-bottom:19px; padding-right:24px; gap:12px; }
 .contact-dialog .contact-form-heading-icon { width:40px; height:45px; }
 .contact-dialog .contact-form-heading h3 { font-size:13px; }
 .contact-dialog .contact-form-heading p { font-size:12px; }
 .contact-dialog .contact-fields { grid-template-columns:minmax(0,1fr); gap:14px; }
 .contact-dialog .contact-submit-row { flex-direction:column; align-items:stretch; gap:13px; }
 .contact-dialog .contact-submit { width:100%; font-size:clamp(9px,2.6vw,12px); }
 .contact-dialog-close { top:15px; right:15px; }
 .contact-channel-dialog { padding:28px 22px 22px; border-radius:20px; }
 .contact-channel-dialog > h3 { font-size:17px; }
 .contact-channel-link > strong { font-size:16px; }
}
@media(max-width:359px) {
 .contact-direct { grid-template-columns:minmax(0,1fr); }
 .contact-direct-action + .contact-direct-action { border-left:0; border-top:1px solid #cfdee6; }
 .contact-direct-action { min-height:54px; }
 .contact-direct-copy > strong { font-size:15px; }
}
@media(prefers-reduced-motion:reduce) { .contact-section *, .contact-section *::before, .contact-section *::after { animation:none!important; transition:none!important; } }
/* Reuse the approved cards before landing-page footers without the full hero. */
.contact-section--actions { display:block; min-height:0; padding-block:clamp(24px,3vw,48px); }
@media(max-width:760px) {
 .contact-live-card { display:none; }
 .contact-grid { grid-template-areas:'intro' 'form'; }
 .contact-section .contact-modes { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
 .contact-section .contact-mode { grid-template-columns:minmax(0,1fr) 22px; grid-template-areas:'icon arrow' 'copy copy'; align-content:space-between; min-height:112px; padding:12px 8px; gap:12px 4px; border-radius:12px; }
 .contact-section .contact-mode-icon { grid-area:icon; justify-self:start; }
 .contact-section .contact-mode-icon > svg { width:26px; height:26px; }
 .contact-section .contact-mode-copy { grid-area:copy; gap:0; }
 .contact-section .contact-mode-copy > span { font-size:clamp(8px,2.15vw,11px); line-height:1.5; letter-spacing:-.035em; }
 .contact-section .contact-mode-copy > span > span { display:block; }
 .contact-section .contact-mode-arrow { grid-area:arrow; align-self:start; width:22px; height:22px; }
 .contact-section .contact-mode-arrow > svg { width:14px; height:14px; }
}
/* Dedicated contacts page: shared editorial hero and the existing contact form. */
.portal-main--contacts { padding:0; background:#f5fafc; }
.portal-container--contacts { max-width:none; }
.site-frame:has(.contacts-page) { position:relative; --ep-header-height:90px; }
.site-frame:has(.contacts-page) > .portal-header { position:absolute; inset:0 0 auto; background:transparent; }
.contacts-page { background:linear-gradient(180deg,#f5fafc,#fff); }
.contacts-page .ep-hero-image { object-position:50% 58%; }
.contacts-page .ep-hero-lead { max-width:830px; font-family:var(--display); font-weight:600; letter-spacing:-.025em; }
.cp-connect { padding-block:14px clamp(32px,4vw,64px); }
.cp-section-heading { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.2fr); gap:24px; align-items:start; margin-bottom:22px; }
.contacts-page :is(.cp-section-heading,.cp-social-heading,.cp-form-intro) h2 { margin:0; color:var(--navy); font:600 clamp(25px,3vw,48px)/1.22 var(--display); letter-spacing:-.035em; }
.contacts-page :is(.cp-section-heading,.cp-social-heading,.cp-form-intro) p { margin:0; color:#557383; font:16px/1.75 Arial,sans-serif; }
.cp-direct { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:20px; }
.cp-card { position:relative; display:grid; align-content:start; gap:8px; min-width:0; padding:clamp(20px,1.8vw,28px); padding-right:68px; border:1px solid #cfe1e9; border-radius:24px; background:#e6f2f8; color:var(--navy); transition:box-shadow .25s,background .25s; }
.cp-card--mail { color:#f3fbff; background:linear-gradient(130deg,#0c3b50,#002b3c); border-color:#17475a; }
.cp-card-icon { display:grid; place-items:center; width:40px; height:40px; margin-bottom:2px; border-radius:12px; background:#ffffff75; }
.cp-card--mail .cp-card-icon { background:#ffffff12; color:#b9e1f0; }
.cp-card-icon svg { width:23px; height:23px; }
.cp-card-label { font:600 10px/1.5 var(--display); letter-spacing:.035em; opacity:.75; }
.cp-card strong { display:block; max-width:100%; overflow-wrap:anywhere; font:600 clamp(21px,2.2vw,36px)/1.4 var(--display); letter-spacing:-.04em; }
.cp-card-description { font:14px/1.65 Arial,sans-serif; opacity:.75; }
.cp-card-arrow { position:absolute; right:20px; bottom:20px; display:grid; place-items:center; width:40px; height:40px; border:1px solid #7aa7ba55; border-radius:50%; }
.cp-card-arrow svg { width:19px; height:19px; }
.cp-card--mail .cp-card-arrow { border-color:#b6d8e64d; }
.cp-messengers { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:16px; padding:16px 22px; border:1px solid #d5e5e8; border-radius:20px; background:#e9f3ee; }
.cp-messengers h3 { margin:0 0 4px; font:600 clamp(17px,1.6vw,24px)/1.35 var(--display); letter-spacing:-.025em; }
.cp-messengers p { margin:0; color:#557383; font:14px/1.6 Arial,sans-serif; }
.cp-messenger-links { display:flex; flex-wrap:wrap; gap:10px; }
.cp-messenger-links a { display:flex; align-items:center; justify-content:center; gap:12px; min-height:48px; padding:12px 18px; border-radius:30px; background:#fff; font:600 12px/1.4 var(--display); }
.cp-messenger-links svg { width:20px; height:20px; }
.cp-messenger-links svg:last-child { width:15px; height:15px; margin-left:10px; }
.cp-social-section { padding-block:clamp(32px,4vw,64px); border-top:1px solid #d5e4ec; }
.contacts-page .cp-social-heading h2 { font-size:clamp(23px,2.5vw,38px); }
.contacts-page .cp-social-heading p { margin-top:12px; }
.cp-socials { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; margin-top:26px; }
.cp-socials a { display:flex; align-items:center; gap:12px; min-width:0; min-height:62px; padding:16px; border:1px solid #d3e3ec; border-radius:16px; background:#fff; font:14px/1.5 Arial,sans-serif; transition:background .25s,box-shadow .25s; }
.cp-socials svg { width:22px; height:22px; flex:none; }
.cp-socials svg:last-child { width:15px; height:15px; margin-left:auto; color:#7198ab; }
.cp-form-intro { padding-top:clamp(30px,3vw,48px); border-top:1px solid #d5e4ec; }
.contacts-page .cp-form-intro p { margin-top:16px; }
.portal-main--contacts > .contact-section--actions { background:#fff; padding-bottom:clamp(44px,5vw,80px); }
@media(hover:hover) {
 .cp-card:hover { box-shadow:0 10px 34px #2d718422; }
 .cp-socials a:hover,.cp-messenger-links a:hover { background:#f0f8fc; box-shadow:0 0 22px #7aa7ba24; }
}
@media(max-width:1100px) {
 .cp-socials { grid-template-columns:repeat(3,minmax(0,1fr)); }
 .cp-card { padding:20px 60px 20px 22px; }
 .cp-card strong { font-size:clamp(19px,2.8vw,29px); }
}
@media(max-width:760px) {
 .site-frame:has(.contacts-page) { --ep-header-height:78px; }
 .contacts-page .ep-hero { height:430px; min-height:430px; max-height:none; }
 .contacts-page .ep-hero-inner { padding:calc(var(--ep-header-height) + 24px) 20px 24px; }
 .contacts-page .ep-hero h1 { font-size:clamp(37px,9vw,64px); }
 .contacts-page .ep-hero-lead { font-size:13px; line-height:1.8; }
 .cp-section-heading { grid-template-columns:minmax(0,1fr); gap:16px; margin-bottom:24px; }
 .contacts-page :is(.cp-section-heading,.cp-social-heading,.cp-form-intro) p { font-size:14px; line-height:1.75; }
 .cp-direct { grid-template-columns:minmax(0,1fr); gap:12px; }
 .cp-card { gap:7px; padding:18px 58px 18px 18px; border-radius:20px; }
 .cp-card-icon { width:34px; height:34px; margin-bottom:0; }
 .cp-card-icon svg { width:21px; height:21px; }
 .cp-card strong { font-size:clamp(19px,5.2vw,27px); }
 .cp-card-label { font-size:9px; }
 .cp-card-description { font-size:13px; }
 .cp-card-arrow { right:16px; bottom:22px; width:32px; height:32px; }
 .cp-messengers { align-items:stretch; flex-direction:column; gap:14px; padding:18px; }
 .cp-messenger-links { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
 .cp-messenger-links a { gap:7px; padding:12px; font-size:10px; }
 .cp-messenger-links svg:last-child { margin-left:0; width:12px; }
 .cp-socials { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:22px; }
 .cp-socials a { min-height:54px; padding:12px; gap:8px; font-size:12px; }
 .cp-socials svg { width:19px; height:19px; }
 .cp-form-intro > p::after { content:''; display:block; width:34px; height:3px; margin-top:16px; border-radius:3px; background:#2d84ff; box-shadow:42px 0 0 #ffda47; }
}
@media(prefers-reduced-motion:reduce) { .cp-card,.cp-socials a { transition:none; } }
/* Compact direct contacts and the approved editorial feedback dialog. */
.cp-direct { gap:14px; }
.cp-card { display:grid; grid-template-columns:40px minmax(0,1fr); align-content:center; column-gap:14px; row-gap:4px; padding:18px 60px 18px 20px; border-radius:18px; }
.cp-card-icon { grid-column:1; grid-row:1 / 4; align-self:center; margin:0; }
.cp-card-label,.cp-card strong,.cp-card-description { grid-column:2; }
.cp-card strong { font-size:clamp(18px,1.5vw,25px); line-height:1.3; }
.cp-card-description { font-size:12px; line-height:1.45; }
.cp-card-arrow { width:30px; height:30px; right:18px; bottom:calc(50% - 15px); }
.cp-messengers { padding:12px 18px; gap:14px; border-radius:16px; margin-top:12px; }
.cp-messengers h3 { font-size:clamp(15px,1.2vw,19px); }
.cp-messengers p { font-size:12px; }
.cp-messenger-links a { min-height:44px; padding:9px 13px; gap:8px; font-size:10px; }
.cp-messenger-links svg { width:18px; height:18px; }
.contact-dialog { isolation:isolate; width:min(850px,calc(100% - 48px)); padding:30px; border:1px solid #d6eaf6; border-radius:24px; background:linear-gradient(135deg,#e5f5ff 0%,#fafdff 48%,#e2f2fc 100%); box-shadow:0 28px 100px #001b32aa,0 0 38px #5cbbec26; }
.contact-dialog::before { content:''; position:absolute; z-index:-1; pointer-events:none; right:-65px; bottom:-100px; width:340px; height:240px; border-radius:50%; background:repeating-radial-gradient(ellipse at 80% 90%,transparent 0 10px,#7bb5d522 11px 12px,transparent 13px 20px); transform:rotate(-15deg); }
.contact-dialog::backdrop { background:#001d32bd; backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); }
.contact-dialog .contact-form-heading { grid-template-columns:60px minmax(0,1fr); gap:16px; margin-bottom:24px; padding-right:22px; }
.contact-dialog .contact-form-heading h3 { font-size:clamp(17px,2vw,24px); line-height:1.25; letter-spacing:-.035em; }
.contact-dialog .contact-form-heading p { font-size:14px; line-height:1.55; margin-top:8px; }
.contact-dialog .contact-form-heading-icon { width:60px; height:64px; border-radius:15px; background:linear-gradient(160deg,#507f9d,#00263f 85%); box-shadow:0 8px 24px #2d7eaa40,inset 0 1px 0 #b8e9ff80; }
.contact-dialog .contact-form-heading-icon svg { width:30px; height:30px; }
.contact-dialog-close { width:38px; height:38px; top:16px; right:16px; border-radius:50%; background:#dceef9; color:#00304a; }
.contact-dialog .contact-fields { gap:18px 24px; }
.contact-dialog .contact-field > label { font-size:11px; margin-bottom:8px; color:#002d46; }
.contact-input { display:flex; align-items:center; width:100%; min-height:48px; border:1px solid #cedfea; border-radius:12px; background:#ffffffed; box-shadow:0 2px 4px #134e6d09; transition:border-color .2s,box-shadow .2s; }
.contact-input > svg { flex:none; width:20px; height:20px; margin-left:16px; color:#52798e; }
.contact-input > input { width:100%; min-width:0; border:0; background:transparent; padding:13px 14px; border-radius:12px; }
.contact-input:focus-within { border-color:#75b5d8; box-shadow:var(--focus-halo); }
.contact-dialog :is(.contact-select,.contact-phone-field,.contact-upload,.contact-textarea) { border-radius:12px; background:#ffffffed; box-shadow:0 2px 4px #134e6d09; }
.contact-dialog .contact-field-icon { position:absolute; top:14px; left:16px; width:20px; height:20px; color:#52798e; pointer-events:none; }
.contact-field-icon svg { display:block; width:100%; height:100%; }
.contact-dialog .contact-select select { padding-left:48px; }
.contact-dialog .contact-textarea textarea { padding-left:48px; min-height:86px; }
.contact-dialog .contact-submit { min-height:54px; padding:7px 8px 7px 22px; background:linear-gradient(165deg,#073c5b,#001e34); box-shadow:inset 0 2px 0 #55b6e333,0 8px 22px #28678828; font-size:11px; }
.contact-dialog .contact-submit:hover { box-shadow:0 0 24px #59b6e355; }
.contact-dialog .contact-privacy { font-size:11px; }
@media(max-width:760px) {
 .cp-card { grid-template-columns:32px minmax(0,1fr); padding:15px 46px 15px 15px; column-gap:10px; row-gap:3px; border-radius:16px; }
 .cp-card-icon { width:32px; height:32px; }
 .cp-card strong { font-size:clamp(16px,4.3vw,21px); }
 .cp-card-label { font-size:8px; }
 .cp-card-description { font-size:11px; }
 .cp-card-arrow { right:12px; width:26px; height:26px; bottom:calc(50% - 13px); }
 .cp-messengers { gap:12px; padding:15px; }
 .cp-messenger-links { grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; }
 .cp-messenger-links a { padding:9px 5px; gap:4px; font-size:8px; }
 .cp-messenger-links svg { width:15px; height:15px; }
 .cp-messenger-links svg:last-child { display:none; }
 .contact-dialog { width:min(560px,100%); padding:16px 18px calc(18px + env(safe-area-inset-bottom,0px)); border-radius:24px 24px 0 0; }
 .contact-dialog .contact-form-heading { grid-template-columns:44px minmax(0,1fr); gap:11px; padding-right:26px; margin-bottom:18px; }
 .contact-dialog .contact-form-heading-icon { width:44px; height:50px; border-radius:12px; }
 .contact-dialog .contact-form-heading-icon svg { width:25px; height:25px; }
 .contact-dialog .contact-form-heading h3 { font-size:14px; }
 .contact-dialog .contact-form-heading p { font-size:12px; line-height:1.5; }
 .contact-dialog .contact-fields { grid-template-columns:minmax(0,1fr); gap:13px; }
 .contact-dialog .contact-submit { font-size:10px; }
 .contact-dialog .contact-submit-row { gap:14px; }
 .contact-dialog-close { width:34px; height:34px; top:16px; right:12px; }
}
