/* módulo contacto: indicativo do país ao lado do número, no campo de telefone (o aspeto de cada controlo vem de .fld) */
.m-contacto{display:grid; grid-template-columns:minmax(0, 2fr) minmax(0, 3fr); gap:var(--sp-8)}

/* interesses: escolha múltipla numa lista que abre por baixo do campo; o campo fechado tem os valores de .fld select no #contacto */
.m-int{position:relative}
.m-int > summary{list-style:none; display:flex; align-items:center; gap:var(--sp-10); background:var(--ink2); color:var(--tx); border:1px solid var(--line2); border-radius:var(--r-4); padding:var(--sp-7) var(--sp-4) var(--sp-7) var(--sp-14); font-size:var(--fs-r088); line-height:normal; cursor:pointer; user-select:none}   /* mesma altura e posição do texto e da seta do select nativo */
.m-int > summary::-webkit-details-marker{display:none}
.m-int > summary::after{content:""; flex:none; width:.42em; height:.42em; border-right:.14em solid currentColor; border-bottom:.14em solid currentColor; transform:translateY(-25%) rotate(45deg)}
.m-int[open] > summary::after{transform:translateY(25%) rotate(-135deg)}
.m-int > summary:focus-visible{outline:2px solid var(--acc); outline-offset:1px; border-color:var(--acc)}
.m-int-txt{flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.m-int-txt.vazio{color:var(--mut)}
.fld.bad .m-int > summary{border-color:var(--err)}
.m-int-lista{position:absolute; top:calc(100% + var(--sp-4)); left:0; right:0; z-index:5; display:grid; max-height:50vh; overflow:auto; overscroll-behavior:contain; background:var(--ink2); border:1px solid var(--line2); border-radius:var(--r-4); padding:var(--sp-4) 0; box-shadow:var(--sh-14)}
#contacto .m-int-op{display:flex; align-items:center; gap:var(--sp-10); padding:var(--sp-6) var(--sp-10); font-family:var(--font-body); font-size:var(--fs-r088); letter-spacing:normal; text-transform:none; color:var(--tx); cursor:pointer}
#contacto .m-int-op:hover{background:color-mix(in srgb, var(--acc) 12%, transparent)}
#contacto .m-int-op input{flex:none; width:var(--sp-18); height:var(--sp-18); min-height:0; margin:0; padding:0; accent-color:var(--acc)}

/* mensagem com uma secção por interesse (dois ou mais): o nome do interesse, com um filete, separa as secções */
#contacto .m-int-msgs{grid-column:1; grid-row:2; display:flex; flex-direction:column; gap:var(--sp-14); min-height:0}
#contacto .m-int-sec{flex:1 1 0; grid-template-rows:auto minmax(0,1fr)}
#contacto .m-int-sec > label{display:flex; align-items:center; gap:var(--sp-10)}
#contacto .m-int-sec > label::after{content:""; flex:1; border-top:1px solid var(--line2)}
#contacto .m-int-sec textarea{height:100%}

/* «Marcar uma apresentação»: ligação para a página de reservas (Microsoft Bookings), que abre num separador novo */
.m-int-agenda{display:flex; flex-wrap:wrap; align-items:center; gap:var(--sp-8) var(--sp-14); color:var(--mut); font-size:var(--fs-r088)}
#contacto .m-int-agenda .btn{min-height:0; padding:var(--sp-8) var(--sp-16); font-size:var(--fs-r086)}