/* LAPORTE — landing page provisoire. Aucun tracker ni police externe.
   v3: alignements fins, composition blanche sans aplats gris. */
:root {
  --navy:#252e59;
  --red:#e7293b;
  --red-dark:#cd2031;
  --ink:#272e54;
  --muted:#626b7c;
  --line:#dce0e7;
}
*,*::before,*::after {box-sizing:border-box}
html {scroll-behavior:smooth}
body {
  margin:0;
  min-height:100vh;
  min-height:100dvh;
  display:flex;
  flex-direction:column;
  background:#fff;
  color:var(--navy);
  font-family:Arial,Helvetica,sans-serif;
  -webkit-font-smoothing:antialiased;
}
a {color:inherit;text-decoration:none}
button,input,textarea {font:inherit;border-radius:0}
a:focus-visible,button:focus-visible,input:focus-visible,textarea:focus-visible,summary:focus-visible {outline:3px solid var(--red);outline-offset:3px}

/* Bandeau rouge : icônes vectorielles et axe vertical commun. */
.bar {flex:none;background:var(--red);color:#fff}
.bar-inside {
  width:min(100%,1440px);
  min-height:31px;
  margin-inline:auto;
  padding:0 30px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:30px;
  font-size:12px;
  font-weight:700;
  line-height:1;
}
.bar-label,.bar-links,.bar-links a {display:inline-flex;align-items:center}
.bar-label {gap:9px;white-space:nowrap}
.dot {display:block;flex:none;width:7px;height:7px;background:#fff;border-radius:50%}
.bar-separator {margin-inline:2px}
.bar-links {gap:28px;white-space:nowrap}
.bar-links a {gap:7px;min-height:31px}
.bar-links svg {display:block;flex:none;width:13px;height:13px}
.bar a:hover {text-decoration:underline;text-underline-offset:3px}

/* Entête volontairement sans menu. */
.site-header {flex:none;position:relative;z-index:2;border-bottom:1px solid #e9ecf0;background:#fff}
.header-inner {
  width:min(100%,1440px);
  min-height:92px;
  margin-inline:auto;
  padding:13px 30px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:25px;
}
.logo {display:block;width:351px;height:65px;max-width:44%;object-fit:contain;object-position:left center}
.header-right {display:flex;align-items:center;gap:26px}
.header-label {font-family:'Arial Narrow',Arial,sans-serif;font-size:12px;font-weight:800;letter-spacing:1.2px;line-height:1.3;white-space:nowrap}
.header-phone {
  display:inline-flex;align-items:center;justify-content:center;
  min-height:45px;padding:11px 18px;gap:10px;
  border:1px solid var(--navy);
  font-size:12px;font-weight:900;white-space:nowrap;
  transition:background .15s,color .15s;
}
.header-phone svg {flex:none;display:block;color:var(--red);width:15px;height:15px}
.header-phone:hover {background:var(--navy);color:#fff}

/* Fond blanc intégral : pas de grand aplat gris ni de diagonale sur la lecture. */
main {
  position:relative;
  flex:1;
  min-height:0;
  overflow:hidden;
  padding:73px 0 95px;
  background:#fff;
}
.landing-wrap {
  position:relative;z-index:1;
  width:min(100%,1440px);
  margin-inline:auto;
  padding:0 30px;
  display:grid;
  grid-template-columns:minmax(0,1.07fr) minmax(0,.93fr);
  align-items:center;
  gap:70px;
}
.intro {min-width:0}

/* Repère 01 : deux traits sur l'axe central des deux lignes du libellé. */
.section-label {
  display:grid;
  grid-template-columns:34px minmax(0,1fr);
  align-items:center;
  column-gap:18px;
  margin-bottom:28px;
}
.label-lines,.label-copy {display:grid;grid-template-rows:18px 18px;row-gap:8px}
.label-lines i {display:block;width:34px;height:2px;align-self:center;background:#202635}
.label-lines i:last-child {width:34px;background:var(--navy)}
.label-copy>span {display:flex;align-items:center;min-width:0;font-family:'Arial Narrow',Arial,sans-serif;font-size:12px;line-height:1.1;letter-spacing:1.6px;font-weight:800;white-space:nowrap}
.eyebrow-muted {color:#8a909c}
.eyebrow-red {color:var(--red)}

h1 {margin:0;font-family:'Arial Black',Arial,Helvetica,sans-serif;font-size:clamp(57px,5.05vw,91px);font-weight:900;line-height:1.045;letter-spacing:-.066em}
.intro h1>span {display:block;white-space:nowrap}
.red {color:var(--red)}
.intro-emphasis {font-size:23px;font-style:italic;color:var(--navy);letter-spacing:-.45px;line-height:1.3;margin:24px 0 18px}
.intro-body {max-width:550px;margin:0;color:#626978;font-size:17px;line-height:1.65}
.intro-body strong {color:#4f576b;font-weight:700}
.contact-direct {display:flex;align-items:center;gap:15px;margin-top:32px;color:#4d5673}
.contact-direct .shield {display:flex;align-items:center;justify-content:center;flex:none;width:43px;height:43px}
.contact-direct .shield svg {display:block}
.contact-direct-body {display:flex;flex-direction:column;align-items:flex-start;gap:5px;min-width:0}
.contact-direct-body>span {display:block;font-size:13px;line-height:1.4}
.contact-direct a {display:inline-flex;align-items:center;gap:10px;white-space:nowrap;color:var(--red);font-size:19px;font-weight:900;line-height:1.15;letter-spacing:.2px}
.contact-direct a svg {display:block;width:15px;height:15px;flex:none}
.contact-direct a:hover {text-decoration:underline;text-underline-offset:3px}

/* Carte formulaire à hauteur visuelle égale aux textes, sans débordement. */
.form-panel {min-width:0;background:#fff;border:1px solid #dfe2e8;box-shadow:0 15px 45px rgba(29,36,71,.085)}
.panel-banner {display:grid;grid-template-columns:61% 39%;height:118px;background:var(--navy);position:relative;overflow:hidden}
.banner-copy {display:flex;flex-direction:column;justify-content:center;min-width:0;padding:16px 15px 15px 28px;color:#fff;position:relative;z-index:2}
.banner-copy>span {font-weight:800;font-size:10px;letter-spacing:2px;color:#c4cbde;line-height:1.2}
.banner-copy h2 {font-family:'Arial Black',Arial,sans-serif;font-size:26px;font-weight:900;line-height:1.04;letter-spacing:-.8px;margin:10px 0 0}
.banner-copy h2 strong {color:#ff344a}
.panel-image {background:linear-gradient(90deg,rgba(37,46,89,.22),transparent 40%),url('assets/atelier-laporte.jpg') center 42% /cover no-repeat}
.banner-corner {position:absolute;top:0;right:0;z-index:3;border-top:49px solid var(--red);border-left:60px solid transparent}
.panel-body {padding:25px 29px 26px}
.form-intro {color:#626979;font-size:14px;line-height:1.55;margin:0 0 22px}
.field-row {display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.field {min-width:0;margin-bottom:16px}
.field label {display:block;margin-bottom:8px;color:#293356;font-weight:800;font-size:11px;line-height:1.25;letter-spacing:.2px}
.field label span {color:var(--red)}
.field label small {color:#858b99;font-size:11px;font-weight:400}
.field input,.field textarea {width:100%;min-height:45px;padding:12px 14px;background:#fff;border:1px solid #d9dce5;color:#202848;font-size:14px;transition:border-color .12s}
.field textarea {height:108px;min-height:98px;resize:vertical;line-height:1.45}
.field input::placeholder,.field textarea::placeholder {color:#989eab}
.field input:hover,.field textarea:hover {border-color:#a5adbd}
.field input:focus,.field textarea:focus {border-color:var(--navy);outline:2px solid #dfe4fa;outline-offset:0}
.spam-trap {position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.privacy {font-size:11px;line-height:1.55;color:#70778a;margin-top:-2px}
.privacy details {display:inline}
.privacy summary {display:inline;color:#333e67;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
.privacy details p {margin:10px 0;color:#62697b}
.privacy details p a {text-decoration:underline;color:var(--navy)}
.submit {display:flex;align-items:center;justify-content:space-between;gap:15px;margin-top:19px;width:100%;min-height:53px;padding:14px 18px;background:var(--red);border:1px solid var(--red);color:#fff;cursor:pointer;font-weight:900;font-size:13px;line-height:1.2;letter-spacing:.3px;transition:background .15s}
.submit:hover {background:var(--red-dark)}
.submit svg {display:block;flex:none}

/* Bandeau de bas de page, aligné sur les mêmes colonnes intérieures. */
.footer {position:relative;flex:none;color:#fff;background:var(--navy)}
.footer::before {content:'';position:absolute;inset:-18px 0 auto;height:20px;background:var(--navy);clip-path:polygon(0 100%,32% 3%,58% 82%,100% 10%,100% 100%)}
.footer-inner {width:min(100%,1440px);margin-inline:auto;padding:26px 30px 25px;display:grid;grid-template-columns:.9fr 1.35fr 1.2fr 1.65fr}
.footer-inner>div {border-right:1px solid rgba(255,255,255,.17);padding-left:28px}
.footer-inner>div:first-child {padding-left:0}
.footer-inner>div:last-child {border:0}
.footer-inner strong {display:block;font-family:'Arial Narrow',Arial,sans-serif;font-weight:900;font-size:17px;letter-spacing:-.2px}
.footer-inner small {display:block;font-size:11px;color:#c1c6d8;line-height:1.6;margin-top:5px}
.footer-inner a:hover {text-decoration:underline}
.copyright {flex:none;text-align:center;font-size:11px;padding:13px 12px;color:#8e93a0}

/* Confirmation / erreur du formulaire */
.result-main {min-height:65vh;display:grid;place-items:center;padding:45px 22px}
.result-main::before {display:none}
.result-card {width:min(100%,570px);border:1px solid #dfe2e8;border-top:5px solid var(--red);padding:45px 44px;text-align:center;box-shadow:0 14px 35px rgba(29,36,71,.08)}
.result-card .result-icon {width:65px;height:65px;background:var(--navy);color:#fff;border-radius:50%;font-size:31px;display:grid;place-items:center;margin:0 auto 25px}
.result-card h1 {font-size:38px;letter-spacing:-.04em;line-height:1.2;white-space:normal;margin-bottom:15px}
.result-card p {line-height:1.65;color:#606879;font-size:16px}
.result-card a {display:inline-flex;align-items:center;margin-top:18px;background:var(--red);color:#fff;padding:15px 25px;font-size:12px;font-weight:900}

@media(max-width:1180px) {
  .landing-wrap {gap:38px}
  .intro h1 {font-size:clamp(52px,5.4vw,75px)}
  .header-label {display:none}
  .panel-body {padding:23px}
}
@media(max-width:900px) {
  main {padding:62px 0 90px}
  .landing-wrap {grid-template-columns:1fr;max-width:760px;gap:45px}
  .intro h1 {font-size:clamp(56px,9vw,87px)}
  .intro-body {max-width:650px}
  .form-panel {width:100%}
  .footer-inner {grid-template-columns:1fr 1fr;gap:28px 10px}
  .footer-inner>div:nth-child(3) {padding-left:0;border:0}
}
@media(max-width:600px) {
  .bar-inside {min-height:30px;justify-content:center;padding:0 12px;font-size:10px}
  .bar-links {display:none}
  .header-inner {min-height:77px;padding:11px 19px;gap:10px}
  .logo {width:260px;height:auto;max-width:76%}
  .header-phone {padding:9px;min-width:40px;min-height:40px}
  .header-phone span {display:none}
  .header-phone svg {width:19px;height:19px}
  main {padding:50px 0 80px}
  .landing-wrap {padding:0 20px;gap:40px}
  .section-label {grid-template-columns:26px minmax(0,1fr);column-gap:13px;margin-bottom:24px}
  .label-lines i {width:26px}
  .label-lines i:last-child {width:26px}
  .label-copy>span {font-size:10px;letter-spacing:1.1px}
  .intro h1 {font-size:clamp(43px,11.8vw,68px);letter-spacing:-.069em}
  .intro-emphasis {font-size:20px;margin-top:22px}
  .intro-body {font-size:15px;line-height:1.6}
  .contact-direct {margin-top:27px}
  .contact-direct-body>span {font-size:12px}
  .contact-direct a {font-size:18px}
  .panel-banner {height:111px;grid-template-columns:64% 36%}
  .banner-copy {padding:16px 14px 14px 18px}
  .banner-copy h2 {font-size:21px}
  .panel-body {padding:23px 18px 25px}
  .field-row {grid-template-columns:1fr;gap:0}
  .field {margin-bottom:14px}
  .footer-inner {padding:26px 20px;gap:23px}
  .footer-inner>div {padding-left:0;border:0}
  .footer-inner strong {font-size:15px}
  .footer-inner small {font-size:10px}
  .copyright {font-size:10px}
  .result-card {padding:32px 20px}
  .result-card h1 {font-size:29px}
}
@media(max-width:390px) {
  .intro h1 {font-size:43px}
  .label-copy>span {letter-spacing:.65px;font-size:9px}
  .banner-copy h2 {font-size:19px}
  .footer-inner {grid-template-columns:1fr}
  .submit {font-size:11px;padding-inline:12px;gap:8px}
  .submit span {white-space:nowrap}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto}
  .submit,.header-phone {transition:none}
}
