/* Kibase Codex — site public
   CSS organisé par composants. Pas de surcharge cumulative, aucune surcharge forcée.
*/

/* 1. Variables globales */
:root{
  --bg:#F5F5F7;
  --ink:#11120f;
  --text-main:rgba(17,18,15,.78);
  --text-muted:rgba(17,18,15,.62);
  --text-faint:rgba(17,18,15,.46);
  --line:rgba(17,18,15,.10);
  --line-soft:rgba(17,18,15,.065);
  --panel:rgba(255,255,255,.82);
  --panel-soft:rgba(255,255,255,.68);
  --dark:#11120f;
  --coral:#ff5f1f;
  --coral-2:#ff7540;
  --green:#b8ff00;
  --blue:#175b8d;
  --beta-bg:rgba(255,255,255,.085);
  --beta-border:rgba(255,255,255,.22);
  --radius-sm:14px;
  --radius-md:22px;
  --radius-lg:32px;
  --shadow-soft:0 18px 42px rgba(17,18,15,.075);
  --shadow-strong:0 30px 80px rgba(15,17,13,.16);
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",system-ui,sans-serif;
}

/* 2. Base */
*,
*::before,
*::after{
  box-sizing:border-box;
}

html{
  min-height:100%;
  background:var(--bg);
}

body{
  min-height:100%;
  margin:0;
  overflow-x:hidden;
  background:var(--bg);
  color:var(--ink);
  font-family:var(--font);
  text-rendering:optimizeLegibility;
  -webkit-font-smoothing:antialiased;
}


body > *{
  position:relative;
  z-index:1;
}

img{
  max-width:100%;
}

button,
input,
select,
textarea{
  font:inherit;
}

/* 3. Bandeau public */
.site-header{
  position:sticky;
  top:0;
  z-index:20;
  height:74px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0 34px;
  border-bottom:1px solid rgba(17,18,15,.04);
  background:rgba(245,245,247,.78);
  backdrop-filter:blur(18px);
  -webkit-backdrop-filter:blur(18px);
}

.site-brand{
  position:absolute;
  left:34px;
  display:flex;
  align-items:center;
  width:118px;
  height:38px;
  color:inherit;
  text-decoration:none;
}

.site-brand img{
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
}

.site-header-label{
  color: rgba(255,88,38,.95);
  font-size: 13px;
  font-weight: 760;
  line-height: 1;
  padding: 8px 12px;
  border: 1px solid rgba(255,88,38,.18);
  border-radius: 999px;
  background: rgba(255,88,38,.08);
  white-space: nowrap;
}

.site-nav{
  position:absolute;
  right:34px;
  display:flex;
  align-items:center;
  gap:10px;
}

.nav-button{
  min-height:38px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 18px;
  border-radius:999px;
  color:inherit;
  font-size:13px;
  font-weight:680;
  text-decoration:none;
  white-space:nowrap;
}

.nav-button--signup{
  background:linear-gradient(180deg,var(--coral-2),#ff4f12);
  color:#fff;
  box-shadow:0 12px 24px rgba(255,95,31,.16);
}

.nav-button--login{
  background:var(--dark);
  color:#fff;
  box-shadow:0 12px 24px rgba(17,18,15,.12);
}

.nav-button:focus-visible,
.menu-trigger:focus-visible,
.menu-panel a:focus-visible,
.primary-link:focus-visible{
  outline:2px solid rgba(255,95,31,.42);
  outline-offset:3px;
}

/* 4. Menu secondaire */
 .site-menu{
  position:relative;
}

.menu-trigger{
  width: 48px;
  height: 48px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:0;
  border-radius:0;
  background:transparent;
  color: rgba(17,18,15,.9);
  cursor:pointer;
  list-style:none;
  font-size: 21px;
}

.menu-trigger::-webkit-details-marker{
  display:none;
}

.menu-trigger svg path{
  stroke-width:2.25;
}

.menu-trigger svg{
  width: 24px;
  height: 24px;
  display:block;
  stroke:currentColor;
  stroke-width:1.9;
  fill:none;
  stroke-linecap:round;
}

.menu-trigger:hover{
  color:rgba(17,18,15,.94);
}

.menu-panel{
  position:absolute;
  right:0;
  top:48px;
  width:220px;
  padding:8px;
  border:1px solid rgba(17,18,15,.09);
  border-radius:18px;
  background:#fff;
  box-shadow:0 24px 60px rgba(17,18,15,.16),0 6px 18px rgba(17,18,15,.08);
}

.menu-panel a{
  min-height:42px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 12px;
  border-radius:12px;
  color:rgba(17,18,15,.86);
  font-size:13px;
  font-weight:650;
  text-decoration:none;
}

.menu-panel a:hover{
  background:#f7f7f5;
}

/* 5. Layout public */
.page-shell{
  width:min(1180px,calc(100% - 40px));
  margin:0 auto;
  padding:76px 0 54px;
}

.page-shell--narrow{
  width:min(960px,calc(100% - 32px));
  padding-top:74px;
}

.hero{
  min-height:430px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:40px 20px clamp(92px,9vw,132px);
}

.hero-logo{
  width:min(430px,82vw);
  height:auto;
  display:block;
  margin:0 auto;
  object-fit:contain;
}

.hero-title{
  max-width:960px;
  margin:34px auto 0;
  color:var(--ink);
  font-size:clamp(34px,5.2vw,62px);
  line-height:1.02;
  font-weight:720;
  letter-spacing:-.052em;
}

.hero-text{
  max-width:760px;
  margin:26px auto 0;
  color:var(--text-muted);
  font-size:clamp(17px,2vw,22px);
  line-height:1.42;
  font-weight:430;
}

/* 6. Cartes accueil */
.home-layout{
  display:flex;
  flex-direction:column;
  gap: 0;
  margin-top:clamp(10px,2vw,24px);
}

.home-lead-row{
  display:grid;
  grid-template-columns:minmax(0,2.1fr) minmax(320px,.9fr);
  gap:clamp(24px,2.5vw,36px);
  align-items:stretch;
}

.feature-transition{
  width:min(100%,1120px);
  margin: clamp(118px,10vw,168px) auto clamp(48px,4vw,68px);
  padding:0 clamp(28px,4vw,56px);
  text-align:center;
}

.feature-transition h2{
  max-width:960px;
  margin:0 auto;
  color:rgba(17,18,15,.42);
  font-size:clamp(34px,5.2vw,62px);
  line-height:1.02;
  font-weight:720;
  letter-spacing:-.052em;
}

.feature-transition p{
  max-width:760px;
  margin:26px auto 0;
  color:var(--text-muted);
  font-size:clamp(17px,2vw,22px);
  line-height:1.42;
  font-weight:430;
}

@media (max-width:900px){
  .feature-transition h2{
    color:#ff5a2a;
    font-weight:760;
  }

  .feature-transition{
    margin:clamp(48px,8vw,70px) auto clamp(10px,3vw,20px);
  }

  .feature-transition p{
    margin-top:18px;
  }
}

.feature-grid{
  display:grid;
  grid-template-columns:1fr;
  row-gap:clamp(76px,8vw,124px);
  margin-top: 0;
  padding-top: 0;
}

.feature-card{
  position:relative;
  overflow:hidden;
  min-height:300px;
  padding:clamp(28px,3.2vw,44px);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:radial-gradient(circle at 72% 18%, rgba(255,95,31,.10), transparent 34%), var(--panel);
  box-shadow:0 26px 70px rgba(15,17,13,.07);
}

.feature-card--main{
  min-height:430px;
  display:grid;
  grid-template-columns:minmax(0,.9fr) minmax(360px,1.1fr);
  gap:clamp(34px,4vw,58px);
  align-items:center;
}

.feature-card--dark{
  min-height:430px;
  height:100%;
  display:flex;
  flex-direction:column;
  padding:clamp(44px,4vw,58px);
  border-color:#10120f;
  background:var(--dark);
  color:#fff;
  box-shadow:var(--shadow-strong);
}

.feature-card--step{
  overflow:visible;
  min-height:auto;
  width:min(100%,1120px);
  margin-inline:auto;
  display:grid;
  grid-template-columns:minmax(280px,420px) minmax(360px,560px);
  justify-content:center;
  gap:clamp(36px,4vw,60px);
  align-items:center;
  padding:clamp(58px,6vw,92px) clamp(28px,4vw,56px);
  border-color:transparent;
  border-radius:0;
  background:transparent;
  box-shadow:none;
}

.feature-card--note .feature-copy,
.feature-card--data .feature-copy{
  grid-column:2;
}

.feature-card--note .step-visual,
.feature-card--data .step-visual{
  grid-column:1;
  grid-row:1;
}

.step-visual{
  position:relative;
  z-index:1;
  width:100%;
}

.feature-copy{
  position:relative;
  z-index:1;
  max-width:470px;
}

.eyebrow{
  margin:0 0 20px;
  color:var(--coral);
  font-size:12px;
  line-height:1;
  font-weight:760;
  letter-spacing:.02em;
  text-transform:uppercase;
}

.feature-card--dark .eyebrow{
  color:var(--green);
}

.feature-title{
  position:relative;
  z-index:1;
  max-width:600px;
  margin:0 0 28px;
  color:inherit;
  font-size:clamp(24px,3vw,38px);
  line-height:1.04;
  font-weight:690;
  letter-spacing:-.035em;
}

.feature-card--main .feature-title{
  font-size:clamp(36px,3.6vw,52px);
  line-height:.98;
}

.feature-text{
  position:relative;
  z-index:1;
  max-width:560px;
  margin:0;
  color: rgba(17,18,15,.68);
  font-size: 16px;
  line-height: 1.78;
  font-weight:430;
}

.feature-text + .feature-text{
  margin-top:16px;
}

.feature-card--dark .feature-text{
  color:rgba(255,255,255,.68);
  line-height:1.68;
}




.product-preview{
  position:relative;
  z-index:1;
  width:100%;
}

.preview-window{
  overflow:hidden;
  border:1px solid rgba(17,18,15,.09);
  border-radius:28px;
  background:rgba(255,255,255,.88);
  box-shadow:0 28px 70px rgba(17,18,15,.13);
}

.preview-app-tabs{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:8px;
  padding:16px 16px 0;
}

.preview-app-tabs span{
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(17,18,15,.045);
  color:rgba(17,18,15,.54);
  font-size:11px;
  font-weight:720;
}

.preview-app-tabs .is-active{
  background:var(--dark);
  color:#fff;
}

.preview-chat-panel{
  padding:18px 18px 20px;
}

.preview-question-card,
.preview-answer-card{
  border:1px solid rgba(17,18,15,.07);
  border-radius:22px;
  background:rgba(255,255,255,.88);
}

.preview-question-card{
  padding:18px;
}

.preview-answer-card{
  margin-top:14px;
  padding:18px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.82));
}

.preview-label{
  display:inline-flex;
  margin-bottom:10px;
  color:var(--coral);
  font-size:11px;
  font-weight:760;
  text-transform:uppercase;
  letter-spacing:.02em;
}

.preview-question-card p{
  margin:0;
  color:rgba(17,18,15,.86);
  font-size:17px;
  line-height:1.34;
  font-weight:680;
  letter-spacing:-.025em;
}

.preview-answer-line{
  height:11px;
  margin-top:10px;
  border-radius:999px;
  background:rgba(17,18,15,.12);
}

.preview-answer-line--short{
  width:72%;
}

.preview-sources{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:16px;
}

.preview-sources span{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  padding:0 11px;
  border-radius:999px;
  background:#edf7ff;
  color:var(--blue);
  font-size:11px;
  font-weight:760;
}

.feature-card--sources{
  grid-column:1 / -1;
  width:min(100%,1120px);
  margin-inline:auto;
  display:grid;
  grid-template-columns:minmax(280px,420px) minmax(360px,560px);
  justify-content:center;
  gap:clamp(36px,4vw,60px);
  align-items:center;
  min-height:360px;
  padding: clamp(24px,3vw,38px) clamp(28px,4vw,56px) clamp(58px,6vw,92px);
  margin-top: clamp(-18px,-1.2vw,-8px);
}


.feature-card--sources::before{
  left:clamp(24px,3vw,38px);
  right:auto;
}

.source-preview{
  position:relative;
  z-index:1;
  width:100%;
}

.source-preview-window{
  overflow:hidden;
  padding:18px;
  border:1px solid rgba(17,18,15,.09);
  border-radius:28px;
  background:rgba(255,255,255,.88);
  box-shadow:0 28px 70px rgba(17,18,15,.11);
}

.source-answer-card{
  padding:18px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:22px;
  background:rgba(255,255,255,.92);
}

.source-answer-line{
  height:11px;
  margin-top:10px;
  border-radius:999px;
  background:rgba(17,18,15,.12);
}

.source-answer-line--short{
  width:68%;
}

.source-preview-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 132px;
  gap:14px;
  margin-top:14px;
}

.source-list{
  display:flex;
  flex-direction:column;
  gap:9px;
  padding:16px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:22px;
  background:rgba(17,18,15,.025);
}

.source-pill,
.source-opened{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  width:max-content;
  max-width:100%;
  padding:0 12px;
  border-radius:999px;
  font-size:11px;
  font-weight:760;
}

.source-pill{
  background:#edf7ff;
  color:var(--blue);
}

.source-pill.is-active{
  box-shadow:0 0 0 1px rgba(42,130,184,.18) inset;
}

.source-opened{
  margin-top:4px;
  background:rgba(255,95,31,.10);
  color:var(--coral);
}

.source-pdf{
  min-height:158px;
  display:grid;
  place-items:center;
  border:1px solid rgba(17,18,15,.07);
  border-radius:22px;
  background:rgba(255,255,255,.72);
}

.source-pdf-page{
  width:78px;
  min-height:112px;
  padding:14px 10px;
  border:1px solid rgba(17,18,15,.10);
  border-radius:10px;
  background:#fff;
  box-shadow:0 16px 36px rgba(17,18,15,.10);
}

.source-pdf-page span{
  display:block;
  height:5px;
  margin-top:8px;
  border-radius:999px;
  background:rgba(17,18,15,.14);
}

.source-pdf-page span:first-child{
  margin-top:0;
}

.source-pdf-page .source-highlight{
  height:12px;
  background:rgba(255,95,31,.22);
}



.section-curve{
  position:absolute;
  bottom:clamp(-162px,-9.5vw,-118px);
  width:min(460px,38vw);
  height:180px;
  z-index:0;
  pointer-events:none;
  overflow:visible;
}

.section-curve--right{
  left:34%;
}

.section-curve--left{
  right:34%;
}

.section-curve path{
  fill:none;
  stroke:rgba(17,18,15,.36);
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-dasharray:3.2 8.2;
  vector-effect:non-scaling-stroke;
}

.feature-card--step > .feature-copy,
.feature-card--step > .step-visual,
.feature-card--step > .source-preview{
  position:relative;
  z-index:1;
}

.note-preview-window,
.graphic-preview-window,
.data-preview-window{
  overflow:hidden;
  padding: 26px;
  border:1px solid rgba(17,18,15,.08);
  border-radius:28px;
  background:rgba(255,255,255,.82);
  box-shadow:0 28px 70px rgba(17,18,15,.09);
  grid-template-columns: 104px 1fr;
  align-items: stretch;
  gap: 18px;
  min-height: 210px;
}

.note-preview-window{
  display:grid;
  grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);
  gap:14px;
}

.note-chat-card,
.note-work-card{
  padding:18px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:22px;
  background:rgba(255,255,255,.92);
}

.note-line,
.note-block,
.graphic-line{
  height:10px;
  margin-top:10px;
  border-radius:999px;
  background:rgba(17,18,15,.12);
}

.note-line--short,
.graphic-line--short{
  width:68%;
}

.note-status,
.note-source-mini{
  min-height:30px;
  display:inline-flex;
  align-items:center;
  margin-top:16px;
  padding:0 12px;
  border-radius:999px;
  background:rgba(255,95,31,.10);
  color:var(--coral);
  font-size:11px;
  font-weight:760;
}

.note-block{
  height:34px;
  border-radius:14px;
  background:rgba(17,18,15,.06);
}

.note-block--wide{
  height:48px;
}

.note-source-mini{
  background:#edf7ff;
  color:var(--blue);
}

.graphic-preview-window{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.graphic-thumb,
.graphic-note{
  min-height:150px;
  padding:18px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:22px;
  background:rgba(255,255,255,.86);
}

.graphic-thumb--plan{
  display:grid;
  gap:10px;
}

.graphic-thumb--plan span{
  border:1px solid rgba(17,18,15,.12);
  border-radius:12px;
}

.graphic-thumb--photo{
  display:grid;
  place-items:center;
  background:linear-gradient(135deg, rgba(42,130,184,.10), rgba(255,95,31,.08));
}

.graphic-thumb--photo span{
  width:68px;
  height:68px;
  border-radius:22px;
  background:rgba(255,255,255,.72);
  box-shadow:inset 0 0 0 1px rgba(17,18,15,.08);
}

.graphic-note{
  grid-column:1 / -1;
  min-height:118px;
}

.data-preview-window{
  display:grid;
  grid-template-columns:96px 1fr;
  gap:16px;
  align-items:center;
}

.data-lock{
  width: 104px;
  height: 104px;
  display:grid;
  place-items:center;
  border:1px solid rgba(17,18,15,.08);
  border-radius: 30px;
  background:rgba(255,255,255,.88);
  color:rgba(17,18,15,.78);
  font-size: 30px;
  font-weight:860;
  letter-spacing:-.04em;
  box-shadow:0 18px 44px rgba(17,18,15,.08);
}

.data-stack{
  display:grid;
  gap: 11px;
}

.data-stack span{
  min-height:38px;
  display:flex;
  align-items:center;
  padding: 11px 15px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:999px;
  background:rgba(255,255,255,.90);
  color:rgba(17,18,15,.70);
  font-size: 12px;
  font-weight:760;
}

.beta-link{
  width:max-content;
  margin-top:24px;
  color:#f7f7f2;
  text-decoration:underline;
  text-underline-offset:4px;
}

.beta-note{
  margin:32px 0 0;
  padding:16px 18px;
  border:1px solid var(--beta-border);
  border-radius:18px;
  background:var(--beta-bg);
  color:rgba(247,247,242,.94);
  font-size:14px;
  line-height:1.45;
}


@media (max-width:1023px){
  .home-lead-row{
    grid-template-columns:1fr;
  }

  .feature-card--main{
    grid-template-columns:minmax(0,.85fr) minmax(320px,1fr);
  }

  .feature-card--dark{
    min-height:auto;
  }
}

@media (max-width:900px){
  .home-lead-row,
  .feature-grid{
    grid-template-columns:1fr;
  }

  .feature-card--main,
  .feature-card--sources,
  .feature-card--step{
    grid-template-columns:1fr;
  }

  .feature-card--sources,
  .feature-card--step{
    width:100%;
    padding-inline:clamp(18px,4vw,28px);
  }

  .feature-card--note .feature-copy,
  .feature-card--data .feature-copy,
  .feature-card--note .step-visual,
  .feature-card--data .step-visual{
    grid-column:auto;
    grid-row:auto;
  }

  .source-preview,
  .step-visual{
    max-width:560px;
  }

  .section-curve{
    display:block;
    left:50%;
    right:auto;
    bottom:clamp(-126px,-14vw,-92px);
    width:min(220px,42vw);
    height:122px;
    transform:translateX(-50%);
    opacity:.72;
  }

  .section-curve--right,
  .section-curve--left{
    left:50%;
    right:auto;
  }

  .section-curve--to-hosting{
    left:43%;
    transform:translateX(-50%) scaleX(-1);
  }

  .source-preview-row,
  .note-preview-window,
  .graphic-preview-window,
  .data-preview-window{
    grid-template-columns:1fr;
  }

  .data-lock{
    width:78px;
    height:78px;
  }
}

/* 7. Pages aide / inscription */
.page-title{
  max-width:780px;
  margin:0;
  color:var(--ink);
  font-size:clamp(36px,6vw,64px);
  line-height:1;
  font-weight:720;
  letter-spacing:-.05em;
}

.page-lead{
  max-width:700px;
  margin:22px 0 0;
  color:var(--text-muted);
  font-size:18px;
  line-height:1.5;
}

.content-card{
  margin-top:28px;
  padding:30px;
  border:1px solid var(--line-soft);
  border-radius:30px;
  background:var(--panel-soft);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.54);
}

.content-card h2{
  margin:0 0 20px;
  color:var(--ink);
  font-size:24px;
  line-height:1.1;
  font-weight:680;
  letter-spacing:-.025em;
}

.content-card p,
.content-card li{
  color:var(--text-main);
  font-size:15px;
  line-height:1.65;
}

.content-card p{
  margin:16px 0 0;
}

.content-card ol{
  margin:22px 0 0;
  padding-left:22px;
}

.content-card li{
  margin:10px 0;
}

.content-card a{
  color:var(--ink);
}

.warning-box{
  margin-top:22px;
  padding:16px 18px;
  border:1px solid rgba(255,95,31,.22);
  border-radius:22px;
  background:rgba(255,240,231,.76);
  color:#733509;
  font-size:14px;
  line-height:1.5;
}


/* Aide publique */
.page-shell--help{
  width:min(1120px,calc(100% - 40px));
  padding-top:64px;
}

.hero--help{
  min-height:auto;
  padding:34px 20px clamp(54px,7vw,86px);
}

.hero--help .hero-title{
  max-width:900px;
  margin-top:0;
}

.hero--help .hero-text{
  max-width:760px;
  margin-top:24px;
}

.help-app-preview{
  margin-bottom:20px;
  padding:clamp(26px,3.2vw,38px);
  border:1px solid var(--line);
  border-radius:var(--radius-lg);
  background:
    radial-gradient(circle at 88% 16%, rgba(184,255,0,.18), transparent 30%),
    linear-gradient(180deg,rgba(255,255,255,.90),rgba(255,255,255,.62));
  box-shadow:0 20px 54px rgba(15,17,13,.055);
}

.help-preview-head{
  max-width:720px;
  margin-bottom:22px;
}

.help-preview-head h2{
  margin:0;
  color:var(--ink);
  font-size:clamp(28px,3.3vw,44px);
  line-height:.98;
  letter-spacing:-.055em;
}

.help-preview-grid{
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  gap:12px;
}

.help-preview-card{
  min-height:178px;
  display:flex;
  flex-direction:column;
  justify-content:space-between;
  gap:20px;
  padding:20px;
  border:1px solid rgba(17,18,15,.075);
  border-radius:24px;
  background:#fff;
}

.preview-index{
  width:36px;
  height:28px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(255,95,31,.10);
  color:var(--coral);
  font-size:12px;
  font-weight:780;
}

.help-preview-card h3{
  margin:0;
  color:var(--ink);
  font-size:21px;
  line-height:1.05;
  letter-spacing:-.035em;
}

.help-preview-card p{
  margin:0;
  color:var(--text-muted);
  font-size:14px;
  line-height:1.55;
}

.help-layout{
  display:grid;
  grid-template-columns:minmax(0,1.28fr) minmax(320px,.72fr);
  gap:20px;
  align-items:stretch;
}

.help-card{
  margin-top:0;
  border-radius:var(--radius-lg);
}

.help-card--primary{
  padding:clamp(30px,3.2vw,44px);
  border:1px solid var(--line);
  background:radial-gradient(circle at 78% 14%, rgba(255,95,31,.10), transparent 34%), var(--panel);
  box-shadow:0 20px 54px rgba(15,17,13,.055);
}

.help-card--side{
  padding:clamp(28px,3vw,38px);
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.82));
  box-shadow:0 14px 36px rgba(15,17,13,.045);
}

.help-steps{
  list-style:none;
  display:grid;
  gap:14px;
  margin:24px 0 0;
  padding:0;
}

.help-steps li{
  display:grid;
  grid-template-columns:42px minmax(0,1fr);
  gap:14px;
  align-items:start;
  margin:0;
}

.help-steps span{
  min-height:32px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border-radius:999px;
  background:rgba(255,95,31,.10);
  color:var(--coral);
  font-size:12px;
  font-weight:760;
}

.help-steps p{
  margin:3px 0 0;
}

.status-list{
  display:grid;
  gap:12px;
  margin-top:24px;
}

.status-row{
  display:grid;
  grid-template-columns:14px minmax(0,1fr);
  column-gap:12px;
  row-gap:4px;
  align-items:start;
  padding:14px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:18px;
  background:rgba(255,255,255,.74);
}

.status-row strong{
  color:var(--ink);
  font-size:14px;
  line-height:1.2;
}

.status-row p{
  grid-column:2;
  margin:0;
  color:var(--text-muted);
  font-size:13px;
  line-height:1.45;
}

.status-dot{
  width:10px;
  height:10px;
  margin-top:3px;
  border-radius:50%;
  background:rgba(17,18,15,.28);
}

.status-dot--processing{ background:var(--blue); }
.status-dot--annotation{ background:var(--coral); }
.status-dot--ready{ background:var(--green); }
.status-dot--error{ background:#cc2b2b; }

.help-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:20px;
  margin-top:20px;
}

.help-practice-card{
  padding:clamp(28px,3vw,38px);
  border-radius:var(--radius-lg);
}

.help-practice-card--dark{
  background:var(--dark);
  color:#fff;
  box-shadow:var(--shadow-strong);
}

.help-practice-card--dark h2,
.help-practice-card--dark p{
  color:inherit;
}

.help-practice-card--dark > p{
  color:rgba(255,255,255,.72);
}

.question-examples{
  display:grid;
  gap:12px;
  margin-top:22px;
}

.question-examples p{
  margin:0;
  padding:14px 16px;
  border:1px solid rgba(17,18,15,.075);
  border-radius:18px;
  background:rgba(255,255,255,.72);
}

.help-practice-card--dark .warning-box{
  margin-top:22px;
  border-color:rgba(255,95,31,.30);
  background:rgba(255,95,31,.12);
  color:rgba(255,255,255,.88);
}

.help-support-card{
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  margin-top:20px;
  padding:clamp(26px,3vw,34px);
  border-radius:var(--radius-lg);
  background:var(--dark);
  color:#fff;
  box-shadow:var(--shadow-strong);
}

.help-support-card h2,
.help-support-card p{
  color:inherit;
}

.help-support-card p{
  color:rgba(255,255,255,.68);
}

.support-link{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  min-height:44px;
  padding:0 18px;
  border-radius:999px;
  background:var(--green);
  color:var(--ink);
  font-size:14px;
  font-weight:760;
  text-decoration:none;
}

@media (max-width:980px){
  .help-preview-grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }

  .help-layout,
  .help-grid{
    grid-template-columns:1fr;
  }

  .help-support-card{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media (max-width:700px){
  .page-shell--help{
    width:min(100% - 24px,680px);
    padding-top:38px;
  }

  .hero--help{
    padding:36px 8px 48px;
  }

  .help-app-preview,
  .help-card--primary,
  .help-card--side,
  .help-practice-card,
  .help-support-card{
    border-radius:24px;
  }

  .help-preview-grid{
    grid-template-columns:1fr;
  }

  .help-preview-card{
    min-height:auto;
  }

  .help-steps li{
    grid-template-columns:36px minmax(0,1fr);
    gap:12px;
  }
}

.signup-layout{
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(280px,.9fr);
  gap:20px;
  align-items:start;
  margin-top:36px;
}

.signup-card{
  margin-top:0;
  border-radius:var(--radius-lg);
}

.signup-card--primary{
  padding:clamp(30px,3.2vw,44px);
  border:1px solid var(--line);
  background:radial-gradient(circle at 78% 14%, rgba(255,95,31,.10), transparent 34%), var(--panel);
  box-shadow:0 20px 54px rgba(15,17,13,.055);
}

.signup-card--secondary{
  padding:clamp(28px,3vw,38px);
  border:1px solid var(--line-soft);
  background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(255,255,255,.82));
  box-shadow:0 14px 36px rgba(15,17,13,.045);
}

.form-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px;
}

.form-field{
  display:flex;
  flex-direction:column;
  gap:7px;
  color:rgba(17,18,15,.72);
  font-size:13px;
  font-weight:620;
}

.form-field--full{
  grid-column:1 / -1;
}

.form-field input,
.form-field select,
.form-field textarea{
  width:100%;
  min-height:44px;
  padding:10px 12px;
  border:1px solid rgba(17,18,15,.09);
  border-radius:14px;
  background:rgba(255,255,255,.88);
  color:var(--ink);
  font-size:15px;
  outline:none;
}

.form-field textarea{
  min-height:110px;
  resize:vertical;
  line-height:1.45;
}

.form-field input:focus,
.form-field select:focus,
.form-field textarea:focus{
  border-color:rgba(255,95,31,.34);
  box-shadow:0 0 0 4px rgba(255,95,31,.08);
}

.disabled-submit{
  width:100%;
  min-height:48px;
  margin-top:20px;
  border:0;
  border-radius:999px;
  background:linear-gradient(180deg,var(--coral-2),#ff4f12);
  color:#fff;
  font-size:13px;
  font-weight:720;
  opacity:1;
  cursor:pointer;
}

.disabled-submit:disabled{
  opacity:.68;
  cursor:not-allowed;
}

.small-note{
  margin-top:14px;
  color:var(--text-muted);
  font-size:13px;
  line-height:1.5;
}

.step-list{
  display:flex;
  flex-direction:column;
  gap:14px;
}

.step-item{
  padding:16px;
  border:1px solid rgba(17,18,15,.07);
  border-radius:20px;
  background:rgba(255,255,255,.58);
}

.step-item > strong{
  display:block;
  margin-bottom:7px;
  color:rgba(17,18,15,.90);
  font-size:14px;
}

.step-item p{
  margin:0;
  color:var(--text-muted);
  font-size:14px;
  line-height:1.5;
}

/* 8. Pied de page */

.data-seal{
  grid-column:2;
  display:flex;
  flex-direction:column;
  gap:4px;
  padding: 16px 18px;
  border:1px solid rgba(17,18,15,.08);
  border-radius: 20px;
  background:rgba(255,255,255,.72);
}

.data-seal strong{
  font-size: 13px;
  line-height:1.1;
  color:var(--ink);
}

.data-seal small{
  font-size: 12px;
  line-height:1.2;
  color:var(--muted);
}

.site-footer{
  display:flex;
  flex-wrap:wrap;
  gap:12px;
  align-items:center;
  justify-content:space-between;
  margin-top:clamp(64px,8vw,104px);
  padding:24px 4px 0;
  color:var(--text-faint);
  font-size:13px;
}

.site-footer a{
  color:rgba(17,18,15,.66);
  text-decoration:none;
}

/* 9. Responsive */
@media (max-width:900px){
  .signup-layout{
    grid-template-columns:1fr;
  }
}

@media (max-width:700px){

  .site-header{
    height:68px;
    padding:0 20px;
  }

  .site-brand{
    left:20px;
    width:86px;
    height:28px;
  }

  .site-header-label{
    display:none;
  }

  .site-nav{
    right:20px;
    gap:6px;
  }

  .nav-button{
    min-height:36px;
    padding:0 10px;
    font-size:12px;
  }

  .menu-trigger{
    width:40px;
    height:40px;
  }

  .menu-panel{
    top:46px;
    right:0;
  }

  .page-shell{
    width:min(100% - 24px,680px);
    padding-top:38px;
  }

  .page-shell--narrow{
    padding-top:44px;
  }

  .hero{
    min-height:auto;
    padding:44px 8px 72px;
  }

  .hero-logo{
    width:min(330px,86vw);
  }

  .feature-card,
  .content-card{
    padding:24px;
  }

  .form-grid{
    grid-template-columns:1fr;
  }
}

@media (max-width:380px){
  .site-brand{
    width:76px;
  }

  .nav-button{
    padding:0 8px;
  }
}


.hero-beta-price{
  max-width:760px;
  margin:28px auto 0;
  color:var(--coral);
  font-size:clamp(20px,2.4vw,28px);
  line-height:1.25;
  font-weight:780;
  letter-spacing:-.03em;
}


.hero-title-accent{
  color:var(--coral);
}

.hero-pricing{
  max-width:760px;
  margin:30px auto 0;
  text-align:center;
}

.hero-trial-pill{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  margin:10px 0 10px;
  color:var(--ink);
  font-size:16px;
  line-height:1.25;
  font-weight:780;
  letter-spacing:-.01em;
}

.hero-trial-pill::before{
  content:"";
  width:9px;
  height:9px;
  border-radius:999px;
  background:var(--green);
  box-shadow:0 0 0 4px rgba(184,255,0,.18);
}

.hero-pricing-main{
  margin:0;
  color:var(--ink);
  font-size:clamp(20px,2.4vw,30px);
  line-height:1.2;
  font-weight:680;
  letter-spacing:-.03em;
}

.hero-pricing-main strong{
  color:var(--coral);
  font-weight:820;
}

.hero-pricing-compare{
  margin:10px 0 0;
  color:var(--text-muted);
  font-size:clamp(16px,1.6vw,20px);
  line-height:1.3;
  font-weight:560;
}

.hero-pricing-compare span{
  text-decoration:line-through;
  text-decoration-thickness:2px;
}

.hero-pricing-note{
  max-width:620px;
  margin:14px auto 0;
  color:var(--text-muted);
  font-size:14px;
  line-height:1.45;
  font-weight:480;
}


.hero-title.hero-title--orange{
  color:var(--coral);
}


.hero--signup{
  position:relative;
  padding-bottom:clamp(118px,13vw,154px);
}

.signup-curve{
  position:absolute;
  left:50%;
  bottom:-10px;
  width:min(560px,46vw);
  height:148px;
  transform:translateX(-50%);
  z-index:0;
  pointer-events:none;
  overflow:visible;
  opacity:.46;
}

.signup-curve path{
  fill:none;
  stroke:rgba(17,18,15,.36);
  stroke-width:1.45;
  stroke-linecap:round;
  stroke-dasharray:3.2 8.2;
  vector-effect:non-scaling-stroke;
}

@media (max-width: 1100px){
  .hero--signup{
    padding-bottom:190px;
  }

  .signup-curve{
    bottom:18px;
    width:min(440px,44vw);
    height:130px;
  }
}

@media (max-width: 780px){
  .hero--signup{
    padding-bottom:150px;
  }

  .signup-curve{
    left:50%;
    bottom:24px;
    width:min(250px,64vw);
    height:98px;
    opacity:.46;
  }
}

.hero--signup .hero-text{
  max-width:720px;
  margin-top:22px;
  font-size:clamp(17px,1.8vw,21px);
  line-height:1.38;
}

.hero--signup .hero-pricing{
  margin-top:24px;
}

.hero--signup .hero-pricing-note{
  margin-top:12px;
  font-size:13px;
  line-height:1.4;
}

/* Inscription — note légale discrète */
.page-signup .small-note--discreet {
  font-size: 0.76rem;
  line-height: 1.35;
}

.signup-legal-note{
  max-width:720px;
  margin:34px auto 0;
  color:var(--text-muted);
  font-size:12px;
  line-height:1.45;
  text-align:center;
}