/* Contact: original Uptimise artwork, a visible form and an uncropped signature. */
.contact-page .contact-hero{padding:0;background:#fff;border-bottom:1px solid #e8eef5;overflow:visible}
.contact-page .contact-hero::before{display:none}
.contact-hero-frame{position:relative}
.contact-hero-copy{position:absolute;z-index:2;top:7%;left:0;width:44%;max-width:560px}
.contact-page .contact-hero h1{font-size:clamp(2.8rem,4.35vw,4.45rem);line-height:1.08;color:var(--navy);margin:0 0 22px}
.contact-page .contact-hero .eyebrow{color:#0b7495;margin-bottom:18px}
.contact-page .contact-hero p{font-size:1.06rem;line-height:1.6;max-width:470px;color:#425574;margin-bottom:21px}
.contact-hero-link{display:inline-flex;align-items:center;gap:17px;font-weight:850;color:var(--navy)}
.contact-hero-link span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:linear-gradient(135deg,var(--yellow),var(--orange));color:var(--navy);font-size:1.2rem}
.contact-page .contact-hero .mini-rainbow{margin-top:22px}
.contact-hero-visual{width:100%;height:auto;object-fit:contain;aspect-ratio:1672 / 941}
.contact-project-section{padding-top:68px;padding-bottom:54px}
.contact-page .contact-layout{grid-template-columns:minmax(0,1.45fr) minmax(0,.7fr);gap:30px}
.contact-page .contact-main{padding:38px;border-radius:25px;box-shadow:0 14px 46px #071a3f09}
.contact-page .contact-main h2{font-size:clamp(1.85rem,2.8vw,2.6rem);max-width:620px;margin-bottom:20px}
.contact-page .contact-main>p{font-size:.98rem;margin-bottom:26px}
.contact-page .contact-required-note{font-size:.78rem;color:#63728a;margin:0 0 19px}
.contact-page form label{margin-bottom:19px}
.contact-page form input,.contact-page form select,.contact-page form textarea{min-height:49px;border-color:#ccd7e6;border-radius:11px}
.contact-page form textarea{resize:vertical;min-height:156px;line-height:1.55}
.contact-page form input:focus,.contact-page form select:focus,.contact-page form textarea:focus{border-color:#08b4c8;box-shadow:0 0 0 3px #00c9df26;outline:none}
.contact-submit{background:linear-gradient(120deg,var(--uptimise-logo-yellow),var(--uptimise-logo-orange));color:var(--uptimise-picto-ink);box-shadow:0 8px 22px #ffaf2526;min-width:200px}
.contact-submit:disabled{cursor:wait;opacity:.7;transform:none;box-shadow:none}
.contact-form-status:empty{display:none}
.contact-page .contact-form-status{margin:18px 0 0;padding:13px 15px;border-radius:11px;background:#eff9fc;color:#083b65;font-size:.9rem;overflow-wrap:anywhere}
.contact-form-status[data-state="error"]{background:#fff3ef;color:#862d12}
.contact-form-status[data-state="success"]{background:#e9faff;color:#064965}
.contact-page .form-disclaimer{font-size:.76rem;line-height:1.6;margin:20px 0 0;color:#62738c}
.contact-page .form-disclaimer a,.contact-form-fallback a,.contact-noscript a{text-decoration:underline;text-underline-offset:3px}
.contact-page .contact-form-fallback{font-size:.8rem;margin:12px 0 0;color:#536981}
.contact-page .contact-noscript{font-size:.85rem;margin:15px 0 0}
.contact-page .contact-aside{padding:35px 30px;border-radius:25px;background:linear-gradient(145deg,#061b43,#0b3275);overflow-wrap:anywhere}
.contact-page .contact-aside h3{font-size:2.1rem;line-height:1.18}
.contact-page .contact-aside h3 span{display:inline-block;font-size:1.08rem;line-height:1.4;margin-top:10px;color:var(--yellow)}
.contact-page .contact-aside p{font-size:.95rem}
.contact-page .contact-details{border-color:#47729c;padding:18px 0;margin:24px 0}
.contact-page .contact-details a{font-weight:800;font-size:clamp(.86rem,1.2vw,1rem)}
.contact-page .contact-details a:hover{text-decoration:underline;text-underline-offset:4px;color:#ffdc25}
.contact-page .contact-details span{line-height:1.6}
.contact-signature-section{padding-bottom:55px;max-width:1280px}
.contact-page .contact-signature{display:block;width:100%;height:auto;max-height:none;aspect-ratio:1773 / 887;object-fit:contain;border-radius:0;margin:0;background:#fff}
.contact-page a:focus-visible,.contact-page button:focus-visible{outline:3px solid var(--yellow);outline-offset:4px}
@media(max-width:1120px){
  .contact-hero-copy{top:6%;width:45%}
  .contact-page .contact-hero h1{font-size:clamp(2.5rem,4.3vw,3.5rem);margin-bottom:16px}
  .contact-page .contact-hero p{font-size:.96rem;line-height:1.5;margin-bottom:15px}
  .contact-page .contact-hero .eyebrow{margin-bottom:12px}
  .contact-page .contact-hero .mini-rainbow{margin-top:17px}
  .contact-page .contact-layout{gap:22px;grid-template-columns:minmax(0,1.4fr) minmax(0,.75fr)}
  .contact-page .contact-main{padding:30px}
  .contact-page .contact-aside{padding:28px 25px}
}
@media(max-width:980px){
  .contact-hero-copy{position:relative;top:auto;left:auto;width:100%;max-width:680px;padding-top:46px}
  .contact-page .contact-hero h1{font-size:clamp(2.85rem,5.4vw,4.2rem);max-width:650px}
  .contact-page .contact-hero p{font-size:1.06rem;max-width:610px}
  .contact-hero-visual{margin-top:8px}
  .contact-page .contact-layout{grid-template-columns:1fr;gap:26px}
  .contact-page .contact-aside{padding:34px}
  .contact-page .contact-swoosh{float:right;font-size:3.3rem;margin-left:18px}
  .contact-page .contact-details{display:grid;grid-template-columns:1fr 1fr;column-gap:24px}
  .contact-page .contact-details span{grid-column:1 / -1}
}
@media(max-width:620px){
  .contact-hero-copy{padding-top:35px}
  .contact-page .contact-hero h1{font-size:clamp(2.45rem,9.4vw,3.35rem);margin-bottom:19px}
  .contact-page .contact-hero p{font-size:1rem}
  .contact-page .contact-hero .mini-rainbow{margin-top:20px}
  .contact-hero-visual{margin-top:15px}
  .contact-project-section{padding-top:35px;padding-bottom:32px}
  .contact-page .contact-main,.contact-page .contact-aside{padding:24px 20px;border-radius:20px}
  .contact-page .contact-main h2{font-size:1.85rem}
  .contact-page .contact-main .eyebrow{font-size:.7rem;margin-bottom:17px}
  .contact-page form .form-row{grid-template-columns:1fr;gap:0}
  .contact-submit{width:100%;min-width:0;justify-content:center}
  .contact-page .contact-details{display:block}
  .contact-page .contact-aside h3{font-size:1.8rem}
  .contact-signature-section{padding-bottom:35px}
}

.contact-field-error{display:block;font-size:.78rem;font-weight:500;color:#862d12;margin-top:6px}.contact-field-error:empty{display:none}.contact-page form [aria-invalid="true"]{border-color:#ce3c3c}.contact-page form input:focus-visible,.contact-page form select:focus-visible,.contact-page form textarea:focus-visible{outline:3px solid var(--uptimise-logo-orange);outline-offset:2px}


:root { color-scheme:only light; }
#contact-form .contact-needs { min-inline-size:0; margin:6px 0 20px; padding:0; border:0; }
#contact-form .contact-needs legend { padding:0; margin:0 0 8px; color:#103e86; font-weight:800; font-size:1rem; }
#contact-form .contact-needs-hint { margin:0 0 17px; color:#52647c; font-size:.88rem; line-height:1.6; }
#contact-form .contact-needs-group + .contact-needs-group { margin-top:19px; }
#contact-form .contact-needs-group-title { margin:0 0 9px; color:#173f77; font-size:.82rem; font-weight:800; }
#contact-form .contact-needs-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
#contact-form .contact-needs-group--offers .contact-needs-grid { grid-template-columns:1fr; }
#contact-form .contact-need-choice { display:flex; align-items:flex-start; gap:10px; margin:0; padding:12px 13px; border:1px solid #cbd8e8; border-radius:10px; background:#fff; color:#16365f; font-size:.85rem; font-weight:600; line-height:1.45; cursor:pointer; }
#contact-form .contact-needs-group--offers .contact-need-choice { background:#fffaf0; border-color:#f2dca9; }
#contact-form .contact-need-choice:has(input:checked) { border-color:#1370b1; background:#edf7ff; box-shadow:inset 0 0 0 1px #1370b1; }
#contact-form .contact-need-choice:has(input:focus-visible) { outline:3px solid #ffb624; outline-offset:2px; }
#contact-form .contact-need-choice input[type="checkbox"] { flex:0 0 18px; width:18px; min-width:18px; height:18px; min-height:18px; margin:1px 0 0; padding:0; accent-color:#103e86; box-shadow:none; }
#contact-form .contact-needs[aria-invalid="true"] { border-left:3px solid #b5293d; padding-left:12px; }
#contact-form #contact-projet-error { margin:8px 0 0; }
@media(max-width:620px) { #contact-form .contact-needs-grid { grid-template-columns:1fr; } }