/* Take Up : base commune aux deux sites. Polices, couleurs, en-tête, pied de page, boutons, formulaires. */

@font-face{font-family:Geist;src:url(fonts/geist.woff2) format("woff2");font-weight:100 900;font-style:normal;font-display:swap}
@font-face{font-family:Archivo;src:url(fonts/archivo.woff2) format("woff2");font-weight:560 860;font-stretch:100% 125%;font-style:normal;font-display:swap}

:root{
  color-scheme:dark;
  --night:#071c20;
  --abyss:#051315;
  --panel:#0b2226;
  --panel-2:#103034;
  --line:#2f5052;
  --white:#f4fbf9;
  /* Blanc clair : remplace tous les anciens gris sur fond sombre. */
  --white-soft:#e6f2ee;
  --mint:#00c4ae;
  --mint-hi:#64dcc6;
  --paper:#eff5f2;
  --ink:#0b2327;
  --ink-soft:#1f3a37;
  --error:#ffc2b5;
  --display:Archivo,Geist,Arial,sans-serif;
  --body:Geist,Arial,sans-serif;
  --gutter:clamp(20px,4vw,48px);
  --max:1280px;
  --header:78px;
  --ease:cubic-bezier(.23,1,.32,1);
  --field-bg:#0a1d20;
  --field-line:#40666a;
  --field-text:var(--white);
  --field-label:var(--white-soft);
}

*{box-sizing:border-box}
html{background:var(--night);scroll-behavior:smooth;scroll-padding-top:calc(var(--header) + 16px);-webkit-text-size-adjust:100%}
body{margin:0;min-height:100svh;background:var(--night);color:var(--white);font-family:var(--body);font-size:17px;line-height:1.65;-webkit-font-smoothing:antialiased;overflow-x:clip}
body.menu-open{overflow:hidden}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0}
ul,ol{padding:0;list-style:none}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;cursor:pointer}
strong{font-weight:640}
::selection{background:var(--mint);color:var(--night)}
:focus-visible{outline:3px solid var(--white);outline-offset:3px;border-radius:2px}
.on-paper :focus-visible{outline-color:var(--ink)}
[hidden]{display:none!important}

.container{width:100%;max-width:var(--max);margin-inline:auto;padding-inline:var(--gutter)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
/* Sur téléphone, chaque phrase de la vitrine commence sur une nouvelle ligne. */
.bm{display:none}
@media(max-width:767px){.bm{display:inline}}
.skip{position:fixed;z-index:100;left:16px;top:-80px;padding:12px 18px;background:var(--white);color:var(--ink);border-radius:8px;font-weight:600}
.skip:focus{top:12px}

.display{font-family:var(--display);font-weight:680;letter-spacing:-.022em;line-height:1.08;text-wrap:balance}
.display em,.accent{font-style:normal;color:var(--mint-hi)}
.on-paper .display em{color:#007a6c}
.eyebrow{color:var(--mint-hi);font-size:14px;font-weight:640;letter-spacing:.14em;text-transform:uppercase}
.on-paper .eyebrow{color:#007a6c}
.lead{font-size:clamp(18px,1.4vw,21px);line-height:1.6;color:var(--white-soft);text-wrap:pretty}
.note{font-size:15px;line-height:1.6;color:var(--white-soft)}
.on-paper{color-scheme:light;background:var(--paper);color:var(--ink);--field-bg:#fff;--field-line:#a9c4bd;--field-text:var(--ink);--field-label:var(--ink-soft);--error:#a12a15}
.on-paper .lead,.on-paper .note{color:var(--ink-soft)}
.section{padding-block:clamp(72px,9vw,128px)}

/* Boutons */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:54px;padding:0 26px;border:1px solid transparent;border-radius:10px;background:none;font-size:16px;font-weight:650;line-height:1.2;text-align:center;transition:background .18s,border-color .18s,color .18s,transform .18s var(--ease)}
.btn svg{width:18px;height:18px;flex-shrink:0}
.btn:active{transform:translateY(1px)}
.btn--primary{background:var(--mint);color:#04261f}
.btn--primary:hover{background:#3fdcc4}
.btn--ghost{border-color:#5d8783;color:var(--white)}
.btn--ghost:hover{background:#ffffff14;border-color:var(--white-soft)}
.btn--ink{background:var(--ink);color:var(--white)}
.btn--ink:hover{background:#17393d}
.on-paper .btn--ghost{border-color:#6f918b;color:var(--ink)}
.on-paper .btn--ghost:hover{background:#0b232712;border-color:var(--ink)}
.btn--small{min-height:46px;padding:0 20px;font-size:15px}
.btn[disabled]{opacity:.55;cursor:wait}

/* En-tête */
.site-header{position:sticky;top:0;z-index:50;height:var(--header);transition:transform .45s var(--ease),background .25s,border-color .25s;border-bottom:1px solid transparent}
.site-header[data-scrolled=true]{background:#071c20ee;border-bottom-color:#ffffff14;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.site-header[data-hidden=true]{transform:translateY(-110%)}
.site-header__bar{display:flex;align-items:center;gap:28px;height:100%;max-width:calc(var(--max) + 96px);margin:auto;padding-inline:var(--gutter)}
.site-header__logo{flex-shrink:0}
.site-header__logo img{width:172px;height:auto}
.site-nav{margin-left:auto}
.site-nav ul{display:flex;align-items:center;gap:clamp(16px,1.9vw,30px)}
.site-nav a{position:relative;display:block;padding:8px 0;font-size:15px;font-weight:500;white-space:nowrap;color:var(--white)}
.site-nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:2px;background:var(--mint-hi);transform:scaleX(0);transform-origin:left;transition:transform .25s var(--ease)}
.site-nav a:hover::after,.site-nav a[aria-current]::after{transform:scaleX(1)}
.site-header__actions{display:flex;align-items:center;gap:14px;flex-shrink:0}
.site-header__login{font-size:15px;font-weight:600;white-space:nowrap}
.site-header__login:hover{color:var(--mint-hi)}
.burger{display:none;position:relative;width:46px;height:46px;border:1px solid #5d8783;border-radius:10px;background:none}
.burger span{position:absolute;left:12px;right:12px;height:2px;background:var(--white);transition:transform .25s var(--ease),top .25s var(--ease)}
.burger span:nth-child(1){top:17px}
.burger span:nth-child(2){top:25px}
.burger[aria-expanded=true] span:nth-child(1){top:21px;transform:rotate(45deg)}
.burger[aria-expanded=true] span:nth-child(2){top:21px;transform:rotate(-45deg)}

.mobile-menu{position:fixed;z-index:45;inset:0;display:flex;flex-direction:column;gap:28px;padding:calc(var(--header) + 18px) var(--gutter) 32px;background:var(--abyss);overflow-y:auto}
.mobile-menu a.mobile-menu__link{display:block;padding:10px 0;font-family:var(--display);font-size:clamp(26px,7vw,34px);font-weight:640;letter-spacing:-.015em;border-bottom:1px solid #ffffff1c}
.mobile-menu__foot{display:grid;gap:12px;margin-top:auto}
.mobile-menu__foot .btn{width:100%}
.mobile-menu__foot p{text-align:center;font-size:15px;color:var(--white-soft)}
.mobile-menu__foot p a{text-decoration:underline;text-underline-offset:3px}

@media(max-width:1120px){
  .site-nav{display:none}
  .site-header__actions{margin-left:auto}
  .burger{display:block}
}
@media(max-width:560px){
  :root{--header:68px}
  .site-header__logo img{width:146px}
  .site-header__actions .btn{display:none}
  .site-header__login{display:none}
  body{font-size:16px}
}

/* Bandeau de contact, au-dessus du pied de page */
.contact-band{background:var(--abyss);border-top:1px solid #ffffff14}
.contact-band__inner{display:grid;grid-template-columns:repeat(2,minmax(0,1fr)) minmax(0,1.1fr);gap:14px;align-items:stretch;padding-block:28px}
.contact-tile{display:flex;align-items:center;gap:14px;min-height:82px;padding:16px 20px;border:1px solid var(--line);border-radius:10px;transition:background .18s,border-color .18s}
.contact-tile svg{width:24px;height:24px;flex-shrink:0}
.contact-tile span{display:grid;line-height:1.35;font-size:14px;color:var(--white-soft)}
.contact-tile strong{font-size:18px;color:var(--white)}
.contact-tile:hover{background:#ffffff0d;border-color:var(--white-soft)}
.contact-tile--call{background:var(--mint);border-color:var(--mint);color:#04261f}
.contact-tile--call span,.contact-tile--call strong{color:#04261f}
.contact-tile--call:hover{background:#3fdcc4;border-color:#3fdcc4}
.contact-emails{padding:14px 20px;border:1px solid var(--line);border-radius:10px;font-size:15px}
.contact-emails summary{cursor:pointer;font-weight:600;min-height:48px;display:flex;align-items:center}
.contact-emails ul{display:grid;gap:8px;padding:6px 0 8px}
.contact-emails li{display:grid;line-height:1.4}
.contact-emails li span{font-size:14px;color:var(--white-soft)}
.contact-emails a{font-weight:600;overflow-wrap:anywhere}
.contact-emails a:hover{color:var(--mint-hi)}
@media(max-width:900px){.contact-band__inner{grid-template-columns:repeat(2,minmax(0,1fr))}.contact-emails{grid-column:1/-1}}
@media(max-width:520px){.contact-band__inner{grid-template-columns:minmax(0,1fr)}}

/* Pied de page */
.site-footer{position:relative;padding-top:64px;background:#040d0f;overflow:hidden;font-size:16px;color:var(--white-soft)}
.site-footer__top{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr) minmax(0,1fr);gap:40px;padding-bottom:40px}
.site-footer__brand img{width:44px;height:44px}
.site-footer__brand p{max-width:40ch;margin-top:18px}
.site-footer h2{margin-bottom:12px;font-size:14px;font-weight:640;letter-spacing:.12em;text-transform:uppercase;color:var(--mint-hi)}
.site-footer li a{display:inline-block;padding:4px 0}
.site-footer li a:hover{color:var(--white)}
.site-footer__word{margin:0;padding-inline:var(--gutter);font-family:var(--display);font-size:clamp(84px,19.6vw,300px);font-weight:760;font-stretch:112%;line-height:.86;letter-spacing:-.04em;color:#0d2a2d;white-space:nowrap;text-align:center;user-select:none}
.site-footer__word::before{content:"Take"}
.site-footer__word::after{content:"Up";color:#0e3a39}
.site-footer__legal{display:flex;flex-wrap:wrap;gap:8px 28px;justify-content:space-between;padding-block:22px 28px;border-top:1px solid #ffffff14;font-size:15px}
.site-footer__legal nav{display:flex;flex-wrap:wrap;gap:6px 22px}
.site-footer__legal a:hover{color:var(--white)}
@media(max-width:820px){.site-footer__top{grid-template-columns:repeat(2,minmax(0,1fr))}.site-footer__brand{grid-column:1/-1}}

/* Formulaires */
.form-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}
.field{display:grid;gap:6px;align-content:start;min-width:0}
.field--wide{grid-column:1/-1}
.field label,.field legend{padding:0;font-size:15px;font-weight:560;color:var(--field-label)}
.field label small{margin-left:6px;font-size:14px;font-weight:400}
.field input,.field select,.field textarea{width:100%;min-height:52px;padding:12px 14px;border:1px solid var(--field-line);border-radius:10px;background:var(--field-bg);color:var(--field-text);font:inherit;font-size:16px;transition:border-color .15s,box-shadow .15s}
.field textarea{resize:vertical;min-height:120px}
.field input::placeholder,.field textarea::placeholder{color:var(--field-label);opacity:.72}
.field input:focus,.field select:focus,.field textarea:focus{outline:none;border-color:var(--mint);box-shadow:0 0 0 3px #00c4ae44}
.field [aria-invalid=true]{border-color:var(--error)}
.field-error{font-size:15px;line-height:1.4;color:var(--error)}
.check{display:flex;align-items:flex-start;gap:12px;font-size:15px;line-height:1.5;color:var(--field-label);cursor:pointer}
.check input{flex-shrink:0;width:22px;height:22px;margin:1px 0 0;accent-color:var(--mint)}
.form-status{padding:13px 16px;border-radius:10px;font-size:15px;line-height:1.5}
.form-status--error{border:1px solid #b5604f;background:#3a1b16;color:#ffd9d0}
.on-paper .form-status--error{background:#fdeae5;color:#7f2312}
.form-status--ok{border:1px solid #2f9d84;background:#0e3a31;color:#d6fbef}
.on-paper .form-status--ok{background:#e0f6ee;color:#0d5a48}
.form-status a{text-decoration:underline}
.form-actions{display:grid;gap:12px;margin-top:18px}
.trap{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}
@media(max-width:560px){.form-grid{grid-template-columns:minmax(0,1fr)}}

/* Onglets */
.tabs{display:flex;flex-wrap:wrap;gap:8px}
.tabs [role=tab]{min-height:48px;padding:0 20px;border:1px solid var(--line);border-radius:10px;background:none;font-size:16px;font-weight:600;color:inherit;transition:background .18s,border-color .18s,color .18s}
.tabs [role=tab][aria-selected=true]{background:var(--mint);border-color:var(--mint);color:#04261f}

/* Pages intérieures */
.page-head{padding-block:clamp(40px,6vw,84px) clamp(32px,4vw,56px)}
.page-head h1{margin-top:14px;font-size:clamp(38px,6vw,76px)}
.page-head .lead{max-width:62ch;margin-top:20px}
.prose{max-width:76ch;padding-block:clamp(36px,5vw,64px) clamp(64px,8vw,100px)}
.prose h2{margin-top:36px;font-family:var(--display);font-size:clamp(22px,2.2vw,28px);font-weight:640;letter-spacing:-.012em;line-height:1.2}
.prose p,.prose ul{margin-top:12px}
.prose ul{padding-left:22px;list-style:disc}
.prose li{margin-top:6px}
.prose .updated{font-size:15px;color:var(--white-soft)}
.prose a{text-decoration:underline;text-underline-offset:3px}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.001ms!important;animation-delay:0s!important;animation-iteration-count:1!important;transition-duration:.001ms!important}
}
