/* Kontakt og Job — mørkt fotohero med kontaktrækker. */

/* Job-siden har kortere indhold end Kontakt. Uden en mindstehøjde slutter
   siden midt på skærmen, og lærredet bag den står som et tomt felt under
   footeren. Sektionen fylder derfor mindst skærmen — trukket fra den plads,
   samtykkebanneret optager, så der ikke opstår en unødig scrollbar.
   Er indholdet højere (som på Kontakt), gør reglen ingenting. */
.acs-contact {
  position: relative;
  overflow: hidden;
  background: var(--acs-evergreen);
  min-height: calc(100svh - var(--acs-consent-h, 0px));
  display: flex;
  flex-direction: column;
}
/* Indholdet optager den ekstra plads, så footeren bliver liggende nederst
   på siden som alle andre steder — i stedet for at hænge midt i billedet. */
.acs-contact__section { flex: 1 0 auto; }
.acs-contact__photo {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.acs-contact__photo--job { object-position: center 45%; transform: scaleX(-1); }
.acs-contact__veil {
  position: absolute;
  inset: 0;
  background: linear-gradient(100deg,
    rgba(12, 18, 16, .94) 0%,
    rgba(12, 18, 16, .86) 38%,
    rgba(12, 18, 16, .65) 68%,
    rgba(12, 18, 16, .48) 100%);
}
.acs-contact__section { position: relative; }

/* --- Kontakt: portræt i egen kolonne -------------------------------------
   Kontaktsiden har ikke længere et baggrundsfoto med slør, men et indrammet
   portræt ved siden af teksten på en flad, mørk flade. Jobsiden bruger stadig
   fotoet som baggrund, så alt herunder hænger på modifikatoren. */
.acs-contact--portraet { background: #1c2822; }
/* Headeren er gennemsigtig og ligger oven på sektionen, så dens højde
   reserveres her. Resten af pladsen mellem header og footer fordeles lige,
   så indholdet står lodret midt imellem dem. */
.acs-contact--portraet .acs-contact__section {
  display: flex;
  align-items: center;
  padding-top: var(--acs-header-h);
}
.acs-contact--portraet .acs-contact__inner {
  width: 100%;
  display: flex;
  align-items: center;
  gap: clamp(40px, 6.5vw, 96px);
  flex-wrap: wrap;
  padding-top: clamp(40px, 5vw, 80px);
  padding-bottom: clamp(40px, 5vw, 80px);
}
.acs-contact--portraet .acs-contact__col {
  flex: 1 1 0;
  max-width: 640px;
  min-width: 300px;
}
.acs-contact__portraet {
  margin: 0;
  flex: 0 1 400px;
  max-width: 400px;
}
.acs-contact__portraet img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 400 / 520;
  object-fit: cover;
  /* Beskæringen holder ansigt og hånd i øverste tredjedel og skærer kanden
     i forgrunden fra i bunden. */
  object-position: 50% 18%;
}
.acs-contact__portraet figcaption {
  margin-top: 16px;
  font-size: 14px;
  font-weight: var(--acs-w-medium);
  color: var(--acs-on-dark);
}
.acs-contact__portraet figcaption span {
  display: block;
  margin-top: 4px;
  font-weight: var(--acs-w-body);
  color: rgba(246, 241, 231, .6);
}

@media (max-width: 760px) {
  /* Teksten først, billedet under — rækkefølgen i markupen klarer det. */
  .acs-contact__portraet { flex: 1 1 100%; max-width: 100%; }
}
.acs-contact__inner {
  position: relative;
  z-index: 2;
  max-width: var(--acs-maxw);
  margin: 0 auto;
  padding: clamp(150px, 16vw, 215px) var(--acs-gutter) clamp(72px, 9vw, 120px);
}
.acs-contact__col { max-width: 680px; }
.acs-contact h1 {
  margin: 0;
  max-width: 22ch;
  font-weight: var(--acs-w-light);
  font-size: clamp(28px, 4.2vw, 58px);
  line-height: 1.04;
  letter-spacing: var(--acs-track-tight);
  color: var(--acs-on-dark);
}
.acs-contact__lead {
  margin: 36px 0 0;
  /* Samme størrelse som hero-underteksten på alle øvrige undersider. */
  font-size: clamp(16px, 1.3vw, 19px);
  font-weight: var(--acs-w-body);
  line-height: 1.6;
  color: rgba(246, 241, 231, .85);
  max-width: 60ch;
}
.acs-contact__rows {
  margin-top: clamp(32px, 4vw, 48px);
  display: flex;
  flex-direction: column;
}
.acs-contact__row {
  display: flex;
  align-items: baseline;
  gap: 16px;
  flex-wrap: wrap;
  border-top: 1px solid var(--acs-rule-dark);
  padding: 20px 0;
}
.acs-contact__rows .acs-contact__row:last-child { border-bottom: 1px solid var(--acs-rule-dark); }
.acs-contact__label {
  flex: 0 0 92px;
  font-size: 12px;
  letter-spacing: var(--acs-track-caps);
  text-transform: uppercase;
  color: var(--acs-label-palm-dk);
  font-weight: var(--acs-w-label);
}
.acs-contact__value {
  font-size: clamp(20px, 2.2vw, 28px);
  font-weight: var(--acs-w-light);
  letter-spacing: -.01em;
  color: var(--acs-on-dark);
}
.acs-contact__row:hover .acs-contact__value { color: var(--acs-label-palm-dk); }
.acs-contact__note {
  margin: 22px 0 0;
  font-size: 15px;
  font-weight: var(--acs-w-body);
  line-height: 1.6;
  color: rgba(246, 241, 231, .65);
}
.acs-contact .acs-footer { position: relative; z-index: 2; }

/* Job: én enkelt boks i stedet for flere rækker */
.acs-contact__single {
  margin-top: clamp(36px, 4.5vw, 56px);
  padding: clamp(22px, 2.6vw, 32px) 0;
}
.acs-contact__single a { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; }
/* Mailadressen er selv linket — den skal tydeligt vise, at den kan klikkes. */
.acs-contact__single a:hover .acs-contact__value,
.acs-contact__single a:focus-visible .acs-contact__value {
  color: var(--acs-label-palm-dk);
  font-weight: var(--acs-w-medium);
}
.acs-contact__single .acs-contact__value { font-size: clamp(19px, 2vw, 26px); }
