/* Migrated from inline <style> — calculatrice-marge-nette.css */
:root {
      --cream:#F7F5F0; --dark:#1C1A14; --accent:#1B4FCC; --accent-hover:#1640A8;
      --accent-light:rgba(27,79,204,0.07); --text-muted:#6B6560; --text-faint:#9B9590;
      --border:rgba(28,26,20,0.10); --shadow:0 4px 20px rgba(28,26,20,0.07);
      --radius:12px; --green:#16A34A; --orange:#D97706; --red:#DC2626;
    }

    *, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }

    body {
      font-family:'DM Sans',sans-serif;
      background:var(--cream);
      color:var(--dark);
      line-height:1.7;
      -webkit-font-smoothing:antialiased;
    }

    a { color:var(--accent); text-decoration:none; }
    a:hover { color:var(--accent-hover); }

    /* ── HEADER ── */
    .header {
      max-width:1100px; margin:0 auto;
      padding:20px 20px 0;
      display:flex; justify-content:space-between; align-items:center;
    }
    .logo {
      font-family:'Fraunces',serif; font-style:italic;
      font-weight:400; font-size:24px; color:var(--dark);
    }
    .header-cta {
      font-size:14px; font-weight:600; color:var(--accent);
      border:1.5px solid var(--accent);
      padding:8px 18px; border-radius:8px; transition:all .2s;
    }
    .header-cta:hover { background:var(--accent); color:#fff; }

    /* ── BREADCRUMB ── */
    .breadcrumb {
      max-width:720px; margin:0 auto;
      padding:20px 20px 0; font-size:13px; color:var(--text-faint);
    }
    .breadcrumb a { color:var(--text-muted); }
    @media(max-width:480px) { .breadcrumb { font-size:12px; } }

    /* ── PAGE ── */
    .page { max-width:720px; margin:0 auto; padding:16px 20px 64px; }

    .page h1 {
      font-family:'Fraunces',serif; font-weight:400;
      font-size:clamp(26px,4vw,38px); line-height:1.2;
      margin-bottom:8px;
    }
    .page .subtitle {
      color:var(--text-muted); font-size:17px; margin-bottom:28px;
    }
    .page h2 {
      font-family:'Fraunces',serif; font-weight:400;
      font-size:clamp(20px,3vw,26px); margin:44px 0 16px; line-height:1.3;
    }
    .page h3 { font-size:17px; font-weight:600; margin:24px 0 10px; }
    .page p { margin-bottom:16px; font-size:16px; }
        .why-free{font-size:14px;color:var(--text-muted);font-style:italic;border-left:3px solid var(--border);padding:10px 14px;margin-top:8px;margin-bottom:8px;background:rgba(28,26,20,0.03);border-radius:0 6px 6px 0}
    .page ul, .page ol { margin:0 0 16px 24px; font-size:16px; }
    .page li { margin-bottom:8px; }

    /* ── INTRO PARAGRAPHS ── */
    .intro-section { margin-bottom:36px; }

    /* ── CALCULATOR CARD ── */
    .calc-card {
      background:#fff;
      border:1.5px solid var(--border);
      border-radius:var(--radius);
      padding:28px 28px 24px;
      margin-bottom:28px;
      box-shadow:var(--shadow);
    }
    @media(max-width:480px) { .calc-card { padding:20px 16px 20px; } }

    .form-group { margin-bottom:20px; }
    .form-group label {
      display:block; font-weight:600; font-size:14px; margin-bottom:6px;
    }
    .form-group input, .form-group select {
      width:100%; padding:13px 14px;
      border:1.5px solid var(--border); border-radius:8px;
      font-size:16px; font-family:'DM Sans',sans-serif;
      background:var(--cream); transition:border-color .2s;
      -webkit-appearance:none; appearance:none;
    }
    .form-group input:focus, .form-group select:focus {
      outline:none; border-color:var(--accent);
    }
    .form-group input::placeholder { color:var(--text-faint); }

    /* Field hint */
    .field-hint {
      font-size:12px; color:var(--text-muted); margin-top:4px;
    }

    /* Inline field errors */
    .field-error {
      display:none; color:var(--red); font-size:12px; margin-top:4px; font-weight:500;
    }
    .field-error.visible { display:block; }

    .btn-calc {
      display:block; width:100%; background:var(--accent); color:#fff;
      border:none; padding:15px; border-radius:8px;
      font-size:16px; font-weight:600; font-family:'DM Sans',sans-serif;
      cursor:pointer; transition:background .2s; margin-top:4px;
    }
    .btn-calc:hover { background:var(--accent-hover); }

    /* ── RESULT ── */
    .result {
      display:none; margin-top:28px; padding-top:28px;
      border-top:1px solid var(--border);
    }

    /* Big ratio number */
    .result-ratio { text-align:center; margin-bottom:6px; }
    .result-ratio .big {
      font-family:'Fraunces',serif; font-size:clamp(48px,10vw,64px);
      font-weight:500; line-height:1;
    }
    .result-ratio .euros-line {
      font-size:15px; margin-top:6px; font-weight:500;
    }

    /* Gauge bar */
    .gauge-wrap { margin:20px 0 6px; }
    .gauge-track {
      height:14px; background:rgba(28,26,20,0.07);
      border-radius:99px; position:relative; overflow:visible;
    }
    /* Green zone band (3-8% range) */
    .gauge-green-zone {
      position:absolute; top:0; height:100%;
      background:rgba(22,163,74,0.15); border-radius:3px; z-index:0;
      /* left:52% width:20% set inline — represents 3%-8% on -10% to +15% scale */
      left:52%; width:20%;
    }
    .gauge-fill {
      height:100%; border-radius:99px;
      transition:width .7s cubic-bezier(.4,0,.2,1);
      position:relative; z-index:1;
    }
    /* Zero marker */
    .gauge-marker {
      position:absolute; top:-5px; width:3px; height:24px;
      background:rgba(28,26,20,0.35); border-radius:2px; z-index:2;
    }
    .gauge-marker-label {
      position:absolute; top:28px; font-size:10px;
      color:var(--text-muted); font-weight:600; white-space:nowrap;
      transform:translateX(-50%);
    }
    .gauge-labels {
      display:flex; justify-content:space-between;
      font-size:11px; color:var(--text-faint); margin-top:30px;
    }

    /* Interpretation block */
    .result-interp {
      padding:15px 16px; border-radius:8px;
      font-size:15px; line-height:1.55; margin-bottom:14px;
    }
    .result-interp.good     { background:#F0FDF4; border:1px solid #BBF7D0; color:#166534; }
    .result-interp.warning  { background:#FEF3C7; border:1px solid #FDE68A; color:#92400E; }
    .result-interp.critical { background:#FEF2F2; border:1px solid #FECACA; color:#991B1B; }

    /* Narratif Nael */
    .narratif-nael {
      background:#F0F4FF; border:1px solid rgba(27,79,204,0.2);
      border-radius:8px; padding:14px 16px;
      font-size:14px; line-height:1.6; margin-top:16px;
    }
    .narratif-label {
      font-weight:700; color:var(--accent); font-size:12px;
      text-transform:uppercase; letter-spacing:0.5px; margin-bottom:4px;
    }

    /* ── CTA DIAGNOSTIC ── */
    .cta-box {
      background:#fff; border:1.5px solid var(--accent);
      border-radius:var(--radius); padding:28px;
      text-align:center; margin:32px 0;
    }
    .cta-box p { margin-bottom:14px; font-size:16px; font-weight:500; }
            .cta-box .cta-kicker { font-size:13px; font-weight:600; text-transform:uppercase; letter-spacing:.5px; color:var(--accent); margin-bottom:10px; }
        .cta-box .btn {
      display:inline-block; background:var(--accent); color:#fff;
      padding:14px 28px; border-radius:8px;
      font-weight:600; font-size:15px; transition:background .2s;
    }
    .cta-box .btn:hover { background:var(--accent-hover); color:#fff; }
    .cta-box .sub {
      color:var(--text-muted); font-size:13px;
      margin-top:10px; margin-bottom:0;
    }

    /* ── EMAIL COMPTABLE TRIGGER ── */
    .email-trigger-wrap { text-align:center; margin:-8px 0 20px; }
    .btn-email-trigger {
      background:none; border:1.5px solid var(--border);
      border-radius:8px; padding:9px 18px;
      font-size:13px; color:var(--text-muted); font-family:'DM Sans',sans-serif;
      cursor:pointer; transition:all .2s; font-weight:500;
    }
    .btn-email-trigger:hover { border-color:var(--text-muted); color:var(--dark); }

    /* ── MODAL ── */
    .modal-overlay {
      display:none; position:fixed; inset:0;
      background:rgba(28,26,20,0.55); z-index:1000;
      align-items:center; justify-content:center; padding:20px;
    }
    .modal-overlay.open { display:flex; }
    .modal {
      background:#fff; border-radius:var(--radius);
      padding:28px; max-width:520px; width:100%;
      box-shadow:0 8px 40px rgba(28,26,20,0.18);
      max-height:90vh; overflow-y:auto;
    }
    .modal h3 { font-size:18px; font-weight:700; margin-bottom:16px; }
    .modal-email {
      width:100%; font-size:13px; font-family:'DM Sans',sans-serif;
      line-height:1.65; padding:14px; border:1.5px solid var(--border);
      border-radius:8px; background:var(--cream); color:var(--dark);
      resize:none; min-height:280px;
    }
    .modal-actions { display:flex; gap:10px; margin-top:14px; flex-wrap:wrap; }
    .btn-copy {
      flex:1; background:var(--accent); color:#fff; border:none;
      padding:12px; border-radius:8px; font-size:14px; font-weight:600;
      font-family:'DM Sans',sans-serif; cursor:pointer; transition:background .2s;
    }
    .btn-copy:hover { background:var(--accent-hover); }
    .btn-copy.copied { background:var(--green); }
    .btn-close-modal {
      flex:1; background:none; border:1.5px solid var(--border);
      color:var(--text-muted); border-radius:8px; padding:12px;
      font-size:14px; font-weight:500; font-family:'DM Sans',sans-serif;
      cursor:pointer; transition:all .2s;
    }
    .btn-close-modal:hover { border-color:var(--text-muted); color:var(--dark); }

    /* ── TABLE ── */
    table { width:100%; border-collapse:collapse; margin:16px 0 24px; font-size:15px; }
    th {
      background:var(--dark); color:#fff; padding:11px 14px;
      text-align:left; font-weight:600; font-size:14px;
    }
    td { padding:10px 14px; border-bottom:1px solid var(--border); }
    tr:nth-child(even) { background:rgba(28,26,20,0.03); }

    /* ── FAQ ── */
    .faq { margin:28px 0; }
    .faq details {
      border:1px solid var(--border); border-radius:8px;
      margin-bottom:10px; background:#fff;
    }
    .faq summary {
      padding:14px 18px; font-weight:600; font-size:15px;
      cursor:pointer; list-style:none;
    }
    .faq summary::-webkit-details-marker { display:none; }
    .faq summary::before { content:"+ "; color:var(--accent); font-weight:700; }
    .faq details[open] summary::before { content:"- "; }
    .faq .faq-answer {
      padding:0 18px 14px; font-size:15px;
      color:var(--text-muted); line-height:1.65;
    }

    /* ── FORMULA BOX ── */
    .formula-box {
      background:#fff; border:1.5px solid var(--border);
      border-radius:8px; padding:18px 20px; margin:20px 0;
      font-size:16px; text-align:center; font-weight:600;
    }

    /* ── RELATED LINKS ── */
    .related-links {
      font-size:14px; color:var(--text-faint); margin-top:8px; line-height:2;
    }

    /* ── CTA SECTEUR ── */
    .secteur-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:16px 0 4px; }
    @media(max-width:520px) { .secteur-grid { grid-template-columns:repeat(2,1fr); } }
    .secteur-btn { background:var(--cream); border:1.5px solid var(--border); border-radius:8px; padding:12px 8px; font-size:14px; font-weight:500; font-family:'DM Sans',sans-serif; cursor:pointer; transition:all .2s; color:var(--dark); text-align:center; }
    .secteur-btn:hover { border-color:var(--accent); color:var(--accent); background:#fff; }
.waitlist-row input:focus { outline:none; border-color:var(--accent); }
.activite-hint { font-size:12px; color:var(--text-muted); margin-top:4px; line-height:1.4; }
/* ── FOOTER ── */
    footer {
      border-top:1px solid var(--border);
      max-width:720px; margin:0 auto;
      padding:32px 20px; text-align:center;
      font-size:13px; color:var(--text-faint);
    }
    footer a { color:var(--text-muted); margin:0 8px; }
    footer p { margin-top:12px; }