/* ==========================================================================
   Contactos (contactos.html)
   Canva design of 15/10/2026, page 13 (1366px wide). Sizes and positions in
   Canva pixels (--e), from referencias/canva/v2-2026-10-15/spec/p13-contactos.txt.
   Image boxes were fitted on the export (the Canva boxes are crops).
   Desktop: the form flows under the fixed header; the photo, the useful
   contacts block and the decorations are placed at their design position.
   Mobile (no design): single column, form, photo, contacts.
   ========================================================================== */

/* Background scribbles (page coordinates) ---------------------------------- */
.ct-deco--blue {                 /* pale blue scribble on the left (41, recoloured) */
  left: calc(-423.5 * var(--e)); top: calc(-127.5 * var(--e));
  width: calc(995 * var(--e)); height: calc(1411 * var(--e)); transform: rotate(-3.2deg);
}
.ct-deco--lime {                 /* faint lime scribble at the top right (07) */
  left: calc(902 * var(--e)); top: calc(-259.4 * var(--e));
  width: calc(700 * var(--e)); height: auto; transform: rotate(-124deg); opacity: .27;
}

.ct-main { position: relative; min-height: calc(1330.7 * var(--e)); }

/* Form ---------------------------------------------------------------------- */
.ct-form {
  position: relative; z-index: 1;   /* above the fork when error messages make the form taller */ width: calc(639 * var(--e));
  margin: calc(26.7 * var(--e)) 0 0 calc(119.7 * var(--e));
  color: var(--blue);
}
.ct-field__label {
  display: block; font-weight: 900; font-size: calc(28.97 * var(--e)); line-height: 1.14; letter-spacing: -.078em;
}
.ct-field--name .ct-field__label { padding-left: calc(6 * var(--e)); }
.ct-field--message { margin-top: calc(35.1 * var(--e)); }
.ct-field--message .ct-field__label { padding-left: calc(12 * var(--e)); }

.ct-field__input {
  display: block; width: calc(632.9 * var(--e)); margin-top: calc(10 * var(--e));
  height: calc(39.8 * var(--e)); padding: 0 calc(20 * var(--e));
  font: inherit; font-weight: 200; font-size: calc(22.3 * var(--e)); line-height: 1.14; letter-spacing: -.078em;
  color: var(--blue); background: rgb(253 255 150 / .47);   /* --highlight at 47%, sampled */
  border: 1px solid rgb(20 61 227 / .45); border-radius: 999px;
}
.ct-field__input--area {
  margin-left: calc(6 * var(--e)); height: calc(152.2 * var(--e));
  padding: calc(17.8 * var(--e)) calc(17 * var(--e)); border-radius: calc(10 * var(--e)); resize: none;
}
.ct-field__input::placeholder { color: var(--blue); opacity: 1; }
.ct-field__input:focus-visible { outline: 3px solid var(--blue); outline-offset: 2px; }
.ct-field__input[aria-invalid="true"] { border: 2px solid var(--red); }

.ct-field__error {
  margin: calc(6 * var(--e)) 0 0 calc(12 * var(--e));
  font-weight: 700; font-size: max(13px, calc(16 * var(--e))); letter-spacing: -.04em; color: var(--red);
}

.ct-form__actions { display: flex; flex-direction: column; align-items: flex-end; margin-top: calc(25.9 * var(--e)); }
.ct-form__btn {
  height: calc(42.7 * var(--e)); width: calc(252.4 * var(--e)); justify-content: flex-start; gap: 0;
  padding: 0 calc(17 * var(--e)) 0 calc(20.6 * var(--e));
  border-width: calc(3.4 * var(--e)); color: var(--blue);
  font-size: calc(24.33 * var(--e)); letter-spacing: -.078em; line-height: 1.1;
}
.ct-form__btn .ct-form__wa { width: calc(25.6 * var(--e)); height: calc(25.6 * var(--e)); margin-right: calc(9.8 * var(--e)); }
.ct-form__btn svg:last-of-type { width: calc(28.1 * var(--e)); height: calc(19.4 * var(--e)); margin-left: auto; }
.ct-form__privacy {
  max-width: calc(420 * var(--e)); margin-top: calc(10 * var(--e)); text-align: right;
  font-weight: 300; font-size: max(12px, calc(13.5 * var(--e))); line-height: 1.35; letter-spacing: -.03em; color: var(--ink); opacity: .8;
}
.ct-form__privacy a { text-decoration: underline; text-underline-offset: 2px; }
.ct-form__privacy a:hover { color: var(--blue); }

/* Photo with the "hellooo" sticker and the blue seal (one image, 77) ------- */
.ct-photo {
  position: absolute; left: calc(839.7 * var(--e)); top: calc(178.2 * var(--e));
  width: calc(485.6 * var(--e)); height: auto;
}

/* Useful contacts (origin of this block: x 114.3, y 791.5) ----------------- */
.ct-useful { position: absolute; left: calc(114.3 * var(--e)); top: calc(791.5 * var(--e)); }
.ct-useful > :not(.ct-food) { position: relative; }
.ct-useful__script {
  color: var(--blue); white-space: nowrap;
  font-size: calc(63.43 * var(--e)); line-height: 1.173;
}
.ct-useful__title {
  margin: calc(7.2 * var(--e)) 0 0 calc(9.9 * var(--e));
  font-weight: 900; font-size: calc(38.06 * var(--e)); line-height: 1.14; letter-spacing: -.078em; color: var(--ink);
}
.ct-person__name {
  font-weight: 900; font-size: calc(32.6 * var(--e)); line-height: 1.14; letter-spacing: -.078em; color: var(--blue);
}
.ct-person--beatriz { margin: calc(43.2 * var(--e)) 0 0 calc(17.4 * var(--e)); }
.ct-person--jessica { margin: calc(37.7 * var(--e)) 0 0 calc(22.3 * var(--e)); }
.ct-person--jessica .ct-person__name { color: var(--red); }
.ct-person__list {
  margin: calc(.8 * var(--e)) 0 0 calc(1 * var(--e));
  font-weight: 300; font-size: calc(23.97 * var(--e)); line-height: 1.8; letter-spacing: -.078em; color: var(--ink);
}
.ct-person__handle { font-weight: 400; }
.ct-nowrap { white-space: nowrap; }
.ct-person__list a:hover { color: var(--blue); text-decoration: underline; text-underline-offset: 3px; }

/* Decorative food (relative to .ct-useful) */
.ct-food { position: absolute; height: auto; pointer-events: none; }
.ct-food--fork { left: calc(-124.7 * var(--e)); top: calc(-242.8 * var(--e)); width: calc(256 * var(--e)); }
.ct-food--tangerine { left: calc(946.4 * var(--e)); top: calc(151.3 * var(--e)); width: calc(285.9 * var(--e)); }
.ct-food--lime { left: calc(1054.2 * var(--e)); top: calc(397.6 * var(--e)); width: calc(266.9 * var(--e)); z-index: 3; } /* overlaps the footer */

/* Footer call to action ------------------------------------------------------ */
.ct .site-footer { padding: calc(63.9 * var(--e)) calc(155 * var(--e)) calc(94 * var(--e)) calc(153 * var(--e)); }
.ct-cta { position: relative; }
.ct-cta__no { margin-left: calc(16 * var(--e)); color: var(--red); font-size: calc(87.72 * var(--e)); line-height: 1.2; }
.ct-cta__text {
  position: relative; z-index: 1; max-width: calc(352 * var(--e));
  margin: calc(-25.5 * var(--e)) 0 0 calc(12.1 * var(--e));
  font-weight: 900; font-size: calc(39.36 * var(--e)); line-height: 1.14; letter-spacing: -.078em; color: var(--ink);
}
.ct-cta__mark { position: relative; z-index: 0; display: inline-block; }
.ct-cta__stroke {                /* yellow stroke behind "segunda-feira." (em = text size) */
  position: absolute; z-index: -1; left: -.307em; top: -.089em;
  width: 7.82em; height: 1.29em; max-width: none; transform: rotate(1.9deg);
}
.ct-cta__btn {
  height: calc(36.6 * var(--e)); width: calc(215.6 * var(--e)); justify-content: flex-start; gap: calc(4 * var(--e));
  margin: calc(22.4 * var(--e)) 0 0 calc(8.4 * var(--e)); padding: 0 0 0 calc(14.4 * var(--e));
  border-width: calc(3 * var(--e)); color: var(--blue);
  font-size: calc(20.85 * var(--e)); letter-spacing: -.078em; line-height: 1.1;
}
.ct-cta__btn svg { width: calc(24 * var(--e)); height: calc(16.6 * var(--e)); }

/* Mobile and tablet (no design) --------------------------------------------- */
@media (max-width: 900px) {
  .ct-deco--blue { left: calc(-430 * var(--e)); top: calc(-60 * var(--e)); width: calc(800 * var(--e)); height: calc(1135 * var(--e)); }
  .ct-deco--lime { left: calc(300 * var(--e)); top: calc(-200 * var(--e)); width: calc(500 * var(--e)); }

  .ct-main { min-height: 0; padding-bottom: calc(80 * var(--e)); }
  .ct-form { width: auto; margin: calc(30 * var(--e)) calc(32 * var(--e)) 0; }
  .ct-field__label { font-size: calc(34 * var(--e)); }
  .ct-field--name .ct-field__label, .ct-field--message .ct-field__label { padding-left: 0; }
  .ct-field--message { margin-top: calc(36 * var(--e)); }
  .ct-field__input {
    width: 100%; margin-left: 0; height: auto; min-height: 44px;
    padding: calc(12 * var(--e)) calc(22 * var(--e));
    font-size: max(16px, calc(26 * var(--e)));   /* 16px minimum: iOS does not zoom in */
  }
  .ct-field__input--area { min-height: calc(230 * var(--e)); padding: calc(18 * var(--e)) calc(22 * var(--e)); border-radius: calc(16 * var(--e)); resize: vertical; }
  .ct-field__error { margin-left: 0; font-size: max(13px, calc(22 * var(--e))); }
  .ct-form__actions { margin-top: calc(30 * var(--e)); }
  .ct-form__btn {
    height: auto; min-height: 44px; width: auto; gap: 0;
    padding: calc(12 * var(--e)) calc(24 * var(--e)); border-width: calc(4 * var(--e)); font-size: calc(32 * var(--e));
  }
  .ct-form__btn .ct-form__wa { width: calc(34 * var(--e)); height: calc(34 * var(--e)); margin-right: calc(12 * var(--e)); }
  .ct-form__btn svg:last-of-type { width: calc(38 * var(--e)); height: calc(26 * var(--e)); margin-left: calc(14 * var(--e)); }
  .ct-form__privacy { max-width: none; margin-top: calc(14 * var(--e)); font-size: max(12px, calc(19 * var(--e))); }

  .ct-photo { position: relative; left: auto; top: auto; width: calc(480 * var(--e)); margin: calc(60 * var(--e)) auto 0; }

  .ct-useful { position: relative; left: auto; top: auto; margin: calc(70 * var(--e)) calc(32 * var(--e)) 0; }
  .ct-useful__script { font-size: calc(76 * var(--e)); white-space: normal; }
  .ct-useful__title { margin: calc(4 * var(--e)) 0 0; font-size: calc(44 * var(--e)); }
  .ct-person--beatriz, .ct-person--jessica { margin: calc(40 * var(--e)) 0 0; }
  .ct-person__name { font-size: calc(38 * var(--e)); }
  .ct-person__list { margin: calc(6 * var(--e)) 0 0; font-size: max(15px, calc(27 * var(--e))); line-height: 1.5; overflow-wrap: anywhere; }
  .ct-person__list li + li { margin-top: calc(8 * var(--e)); }

  .ct-food--fork { left: auto; right: calc(-60 * var(--e)); top: calc(-190 * var(--e)); width: calc(190 * var(--e)); }
  .ct-food--tangerine { left: auto; right: calc(-70 * var(--e)); top: calc(80 * var(--e)); width: calc(150 * var(--e)); }
  .ct-food--lime { display: none; }

  .ct .site-footer { padding: calc(70 * var(--e)) calc(32 * var(--e)) calc(60 * var(--e)); }
  .ct-cta__no { margin-left: 0; font-size: calc(110 * var(--e)); }
  .ct-cta__text { max-width: calc(520 * var(--e)); margin: calc(-30 * var(--e)) 0 0; font-size: calc(50 * var(--e)); }
  .ct-cta__btn { height: auto; min-height: 44px; width: auto; margin: calc(28 * var(--e)) 0 0; padding: calc(8 * var(--e)) calc(20 * var(--e)); border-width: calc(4 * var(--e)); font-size: calc(28 * var(--e)); }
  .ct-cta__btn svg { width: calc(32 * var(--e)); height: calc(22 * var(--e)); }
}