/* Veltis IT, feuille commune des pages secondaires (charte Signal). */
/* ==========================================================================
   Veltis IT, v3 "Signal"
   Variables, en-tête, menu, boutons et pied de page repris de l'accueil.
   Ci-dessous, les familles de mise en page propres à cette page.
   ========================================================================== */
:root {
  --bg:        #0B0E14;
  --bg-2:      #0F131C;
  --panel:     #10151F;
  --panel-2:   #151B27;
  --line:      #1E2533;
  --line-2:    #2A3244;
  --ink:       #E7ECF3;
  --ink-dim:   #A7B0C0;
  --ink-mute:  #6C7687;
  --blue:      oklch(62% 0.16 250);
  --green:     oklch(68% 0.14 155);
  --accent:    oklch(70% 0.15 200);
  --warn:      oklch(78% 0.15 85);
  --grad:      linear-gradient(90deg, oklch(62% 0.16 250), oklch(68% 0.14 155));

  --display: "Bricolage Grotesque", ui-sans-serif, system-ui, sans-serif;
  --sans: "Bricolage Grotesque", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
  --mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

  --maxw: 1320px;
  --gutter: clamp(18px, 4vw, 56px);
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-io: cubic-bezier(0.76, 0, 0.24, 1);
  --z-head: 30; --z-menu: 40; --z-skip: 50;
  --logo: url("/assets/mail/veltis-logo.png");
}

*, *::before, *::after { box-sizing: border-box; }
html { color-scheme: dark; -webkit-text-size-adjust: 100%; scroll-padding-top: 90px; }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; background: var(--bg); color: var(--ink);
  font-family: var(--sans); font-size: 17px; line-height: 1.6; font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased; -webkit-tap-highlight-color: transparent;
  touch-action: manipulation; overflow-x: clip;
}
body.locked { overflow: hidden; }
img { max-width: 100%; display: block; }
a { color: inherit; }
h1, h2, h3, h4 { margin: 0; font-family: var(--display); text-wrap: balance; }
p { margin: 0; text-wrap: pretty; }
ul, ol, dl, dd { margin: 0; padding: 0; }
ul, ol { list-style: none; }
strong { color: var(--ink); font-weight: 600; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 3px; border-radius: 4px; }
::selection { background: color-mix(in srgb, var(--green) 40%, transparent); color: var(--ink); }
.wrap { width: 100%; max-width: var(--maxw); margin-inline: auto; padding-inline: var(--gutter); }
.vh { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.mono { font-family: var(--mono); }
.skip { position: absolute; left: 16px; top: -100px; z-index: var(--z-skip); background: var(--ink); color: var(--bg); padding: 10px 16px; border-radius: 8px; font-weight: 600; text-decoration: none; }
.skip:focus { top: 16px; }

/* Grain fixe, très léger (pseudo-élément fixe, pas de repaint au scroll) */
body::after {
  content: ""; position: fixed; inset: 0; pointer-events: none; z-index: 60; opacity: .05;
  background-image: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='160' height='160'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>");
}

/* ---------- En-tête ---------- */
.head {
  position: fixed; top: 0; left: 0; right: 0; z-index: var(--z-head);
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 18px var(--gutter);
  mix-blend-mode: normal;
}
.head::before { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,14,20,.85), rgba(11,14,20,0)); pointer-events: none; z-index: -1; }
.brand { display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font-family: var(--display); font-weight: 700; font-size: 19px; letter-spacing: -0.03em; border-radius: 6px; }
.brand-mark { width: 48px; height: 19px; overflow: hidden; flex: none; }
.brand-mark img { width: 48px; height: auto; margin-top: -4.8px; }
.brand-it { color: var(--green); }
.head-right { display: flex; align-items: center; gap: 10px; }
.status { display: inline-flex; align-items: center; gap: 9px; font: 500 13px/1 var(--mono); color: var(--ink-dim); margin-right: 8px; }
.dot { position: relative; width: 8px; height: 8px; border-radius: 50%; background: var(--green); flex: none; }
.dot::after { content: ""; position: absolute; inset: 0; border-radius: 50%; background: var(--green); }
@media (prefers-reduced-motion: no-preference) { .dot::after { animation: ping 2.4s var(--ease) infinite; } }
@keyframes ping { 0% { transform: scale(1); opacity: .6; } 80%, 100% { transform: scale(2.8); opacity: 0; } }
@media (max-width: 760px) { .status { display: none; } }
.brand { white-space: nowrap; }
@media (max-width: 480px) { .head .head-right a.pill-btn { display: none; } .pill-btn { height: 42px; padding: 0 16px; } }

.pill-btn {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; gap: 10px; height: 46px; padding: 0 20px;
  border-radius: 999px; border: 1px solid var(--line-2); background: rgba(16,21,31,.7);
  font-weight: 600; font-size: 15px; text-decoration: none; cursor: pointer; white-space: nowrap;
  transition: border-color .3s var(--ease), color .3s var(--ease);
}
.pill-btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--ink); transform: translateY(101%); border-radius: inherit; transition: transform .5s var(--ease); }
.pill-btn:hover { color: var(--bg); border-color: var(--ink); }
.pill-btn:hover::before { transform: none; }
.menu-lines { display: inline-grid; gap: 5px; width: 18px; }
.menu-lines span { height: 1.5px; background: currentColor; border-radius: 2px; transition: transform .4s var(--ease); }
.pill-btn:hover .menu-lines span:first-child { transform: translateX(3px); }
.pill-btn:hover .menu-lines span:last-child { transform: translateX(-3px); }

/* ---------- Menu plein écran ---------- */
.menu { position: fixed; inset: 0; z-index: var(--z-menu); display: grid; grid-template-rows: auto 1fr auto; background: var(--bg-2); overscroll-behavior: contain; clip-path: inset(0 0 100% 0); transition: clip-path .8s var(--ease-io); visibility: hidden; }
.menu.open { clip-path: inset(0 0 0 0); visibility: visible; }
.menu-top { display: flex; justify-content: space-between; align-items: center; padding: 18px var(--gutter); }
.menu-nav { align-self: center; padding: 0 var(--gutter); }
.menu-nav ol { display: grid; gap: clamp(2px, 1vh, 10px); }
.menu-nav a {
  display: inline-flex; align-items: baseline; gap: 18px; text-decoration: none;
  font-family: var(--display); font-weight: 700; font-size: min(clamp(2.4rem, 1.2rem + 6vw, 6.4rem), 8.5vh); line-height: 1.02; letter-spacing: -0.05em;
  color: var(--ink-mute); transition: color .3s var(--ease), transform .5s var(--ease);
}
.menu-nav a small { font: 500 13px/1 var(--mono); color: var(--accent); letter-spacing: 0; }
.menu-nav a:hover, .menu-nav a:focus-visible { color: var(--ink); transform: translateX(14px); }
.menu-nav li { overflow: hidden; }
.menu-nav li > a { transform: translateY(110%); transition: transform .9s var(--ease), color .3s var(--ease); transition-delay: calc(var(--i) * 45ms + .25s); }
.menu.open .menu-nav li > a { transform: none; }
.menu.open .menu-nav li > a:hover { transform: translateX(14px); transition-delay: 0s; }
.menu-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 16px 40px; padding: 22px var(--gutter) calc(22px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); font-size: 15px; color: var(--ink-dim); }
.menu-foot a { color: var(--ink); }
@media (prefers-reduced-motion: reduce) { .menu { transition: none; } .menu-nav li > a { transition: color .2s; transform: none; } }

/* ---------- Boutons ---------- */
.btn {
  position: relative; overflow: hidden; isolation: isolate;
  display: inline-flex; align-items: center; gap: 14px;
  height: 58px; padding: 0 10px 0 28px; border-radius: 999px;
  font: 600 16px/1 var(--sans); letter-spacing: -0.01em; text-decoration: none; white-space: nowrap; cursor: pointer;
  background: var(--ink); color: var(--bg); border: 0;
  transition: transform .35s var(--ease);
}
.btn::before { content: ""; position: absolute; inset: 0; z-index: -1; background: var(--grad); transform: translateX(-101%); transition: transform .6s var(--ease); }
.btn:hover::before { transform: none; }
.btn:active { transform: scale(.97); }
.btn .ico { width: 40px; height: 40px; border-radius: 50%; display: grid; place-items: center; background: var(--bg); color: var(--ink); font-size: 18px; transition: transform .5s var(--ease); }
.btn:hover .ico { transform: rotate(-45deg); }
.btn.ghost { background: transparent; color: var(--ink); border: 1px solid var(--line-2); padding: 0 26px; }
.btn.ghost::before { background: var(--panel-2); }
.magnetic { will-change: transform; }

/* ---------- Typo de section ---------- */
.label { display: inline-flex; align-items: center; gap: 10px; font: 500 13px/1 var(--mono); color: var(--accent); }
.big { font-size: clamp(2.4rem, 1.2rem + 4.6vw, 5.4rem); line-height: .98; letter-spacing: -0.05em; font-weight: 700; }
.big .mute { color: var(--ink-mute); }
.lead { font-size: clamp(1.05rem, .95rem + .45vw, 1.3rem); line-height: 1.55; color: var(--ink-dim); max-width: 46ch; }
.sec { position: relative; padding-block: clamp(96px, 13vw, 180px); }

/* Révélations (JS + mouvement autorisé) */
@media (prefers-reduced-motion: no-preference) {
  .js .rv { opacity: 0; transform: translateY(40px); transition: opacity 1s var(--ease), transform 1.2s var(--ease); transition-delay: calc(var(--d, 0) * 90ms); }
  .js .rv.in { opacity: 1; transform: none; }
  .js .mask > span { display: inline-block; transform: translateY(105%); transition: transform 1.2s var(--ease); transition-delay: calc(var(--d, 0) * 90ms); }
  .js .mask.in > span { transform: none; }
}
.mask { display: block; overflow: hidden; padding-bottom: .08em; margin-bottom: -.08em; }

/* ---------- En-tête de fiche (propre aux pages secondaires) ---------- */
.fiche { position: relative; padding: clamp(128px, 14vw, 176px) 0 0; overflow: hidden; }
.fiche-grid { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); gap: clamp(32px, 6vw, 96px); align-items: end; }
.fiche-title { font-size: clamp(2.7rem, 1.3rem + 5.2vw, 6.2rem); line-height: .95; letter-spacing: -0.055em; font-weight: 750; }
.fiche-title .ln { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.fiche-title .ln > span { display: inline-block; }
.fiche-title .m { color: var(--ink-mute); }
.fiche-sub { margin-top: 26px; font-size: clamp(1.05rem, .95rem + .45vw, 1.3rem); line-height: 1.55; color: var(--ink-dim); max-width: 46ch; }
.fiche-cta { margin-top: 32px; display: flex; flex-wrap: wrap; align-items: center; gap: 14px 22px; }
.fiche-meta { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; font: 500 13px/1.4 var(--mono); color: var(--ink-dim); }
.fiche-meta .status { margin: 0; }
@keyframes up { to { transform: none; } }
@keyframes fade { to { opacity: 1; } }
@media (prefers-reduced-motion: no-preference) {
  .js .fiche-title .ln > span { transform: translateY(108%); animation: up 1.2s var(--ease) forwards; animation-delay: calc(var(--i) * 110ms + 120ms); }
  .js .fiche-fade { opacity: 0; animation: fade 1.1s var(--ease) forwards; animation-delay: calc(var(--d, 0) * 120ms + .55s); }
}

/* Les tarifs en bref */
.glance { border: 1px solid var(--line-2); border-radius: 28px; background: var(--panel); padding: 8px 8px 0; }
.glance-h { padding: 16px 18px 12px; font: 500 13px/1.3 var(--mono); color: var(--accent); }
.glance ul { border-top: 1px solid var(--line); }
.glance a { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; align-items: baseline; gap: 14px; padding: 16px 18px; border-bottom: 1px solid var(--line); text-decoration: none; border-radius: 14px; transition: background-color .3s var(--ease); }
.glance li:last-child a { border-bottom: 0; }
.glance a:hover { background: var(--panel-2); }
.glance .g-name { font-size: 16px; color: var(--ink); }
.glance .g-name small { display: block; margin-top: 2px; font: 400 12.5px/1.4 var(--mono); color: var(--ink-dim); }
.glance .g-price { font-family: var(--display); font-weight: 700; font-size: clamp(1.25rem, 1.05rem + .6vw, 1.6rem); letter-spacing: -0.03em; white-space: nowrap; }
.glance .g-price small { font: 400 12.5px/1 var(--mono); color: var(--ink-dim); letter-spacing: 0; margin-right: 4px; }
.glance i { align-self: center; font-size: 18px; color: var(--ink-dim); transition: transform .5s var(--ease), color .3s; }
.glance a:hover i { transform: translateX(3px); color: var(--accent); }
.glance-note { padding: 12px 18px 16px; border-top: 1px solid var(--line); font-size: 13.5px; line-height: 1.5; color: var(--ink-dim); }

/* Trace du signal : oscilloscope animé en CSS, sans JavaScript */
.scope { position: relative; height: clamp(120px, 14vw, 170px); margin-top: clamp(56px, 7vw, 96px); border-block: 1px solid var(--line); }
.scope::before { content: ""; position: absolute; inset: 0; opacity: .7; background:
  linear-gradient(var(--line), var(--line)) 0 50% / 100% 1px no-repeat,
  repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 64px); }
.scope { --echo: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='960' height='160' viewBox='0 0 960 160'%3E%3Cpath d='M0 87.5 L6 88.0 L12 88.6 L18 89.4 L24 90.2 L30 91.2 L36 92.2 L42 93.3 L48 94.4 L54 95.5 L60 96.6 L66 97.7 L72 98.6 L78 99.5 L84 100.2 L90 100.8 L96 101.3 L102 101.5 L108 101.6 L114 101.5 L120 101.1 L126 100.6 L132 99.8 L138 98.9 L144 97.8 L150 96.5 L156 95.1 L162 93.6 L168 92.0 L174 90.3 L180 88.6 L186 86.9 L192 85.2 L198 83.5 L204 81.9 L210 80.5 L216 79.1 L222 77.8 L228 76.7 L234 75.8 L240 75.0 L246 74.4 L252 73.9 L258 73.6 L264 73.4 L270 73.3 L276 73.4 L282 73.5 L288 73.7 L294 73.9 L300 74.1 L306 74.4 L312 74.5 L318 74.6 L324 74.7 L330 74.6 L336 74.4 L342 74.1 L348 73.6 L354 72.9 L360 72.1 L366 71.1 L372 70.0 L378 68.8 L384 67.4 L390 65.9 L396 64.3 L402 62.6 L408 60.9 L414 59.2 L420 57.5 L426 55.8 L432 54.2 L438 52.7 L444 51.3 L450 50.1 L456 49.0 L462 48.1 L468 47.4 L474 46.8 L480 46.5 L486 46.4 L492 46.5 L498 46.8 L504 47.2 L510 47.8 L516 48.6 L522 49.5 L528 50.5 L534 51.5 L540 52.6 L546 53.7 L552 54.8 L558 55.9 L564 56.9 L570 57.9 L576 58.7 L582 59.5 L588 60.1 L594 60.5 L600 60.8 L606 61.0 L612 61.1 L618 61.0 L624 60.8 L630 60.5 L636 60.1 L642 59.6 L648 59.2 L654 58.7 L660 58.2 L666 57.7 L672 57.3 L678 57.1 L684 56.9 L690 56.8 L696 56.9 L702 57.2 L708 57.6 L714 58.2 L720 59.1 L726 60.0 L732 61.2 L738 62.6 L744 64.1 L750 65.7 L756 67.4 L762 69.3 L768 71.2 L774 73.1 L780 75.1 L786 77.0 L792 78.9 L798 80.8 L804 82.5 L810 84.1 L816 85.6 L822 86.9 L828 88.1 L834 89.0 L840 89.8 L846 90.4 L852 90.9 L858 91.1 L864 91.2 L870 91.1 L876 90.9 L882 90.6 L888 90.2 L894 89.8 L900 89.3 L906 88.8 L912 88.3 L918 87.9 L924 87.5 L930 87.2 L936 87.0 L942 86.9 L948 87.0 L954 87.2 L960 87.5' fill='none' stroke='%23000' stroke-width='1' stroke-opacity='0.45' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M0 86.8 L6 87.8 L12 88.8 L18 89.6 L24 90.4 L30 90.9 L36 91.3 L42 91.6 L48 91.6 L54 91.4 L60 91.0 L66 90.4 L72 89.7 L78 88.7 L84 87.6 L90 86.3 L96 84.8 L102 83.3 L108 81.7 L114 80.0 L120 78.3 L126 76.6 L132 74.9 L138 73.2 L144 71.7 L150 70.2 L156 68.8 L162 67.6 L168 66.5 L174 65.6 L180 64.9 L186 64.3 L192 63.8 L198 63.5 L204 63.4 L210 63.3 L216 63.4 L222 63.5 L228 63.7 L234 63.9 L240 64.2 L246 64.4 L252 64.6 L258 64.7 L264 64.7 L270 64.6 L276 64.3 L282 64.0 L288 63.5 L294 62.8 L300 61.9 L306 60.9 L312 59.8 L318 58.5 L324 57.1 L330 55.6 L336 54.0 L342 52.3 L348 50.6 L354 48.9 L360 47.2 L366 45.5 L372 43.9 L378 42.4 L384 41.1 L390 39.9 L396 38.8 L402 37.9 L408 37.3 L414 36.8 L420 36.5 L426 36.4 L432 36.5 L438 36.8 L444 37.3 L450 38.0 L456 38.8 L462 39.7 L468 40.7 L474 41.7 L480 42.8 L486 43.9 L492 45.1 L498 46.1 L504 47.1 L510 48.1 L516 48.9 L522 49.6 L528 50.1 L534 50.6 L540 50.9 L546 51.0 L552 51.1 L558 51.0 L564 50.7 L570 50.4 L576 50.0 L582 49.6 L588 49.1 L594 48.6 L600 48.1 L606 47.7 L612 47.3 L618 47.0 L624 46.8 L630 46.8 L636 47.0 L642 47.3 L648 47.7 L654 48.4 L660 49.2 L666 50.3 L672 51.5 L678 52.8 L684 54.3 L690 56.0 L696 57.8 L702 59.6 L708 61.5 L714 63.5 L720 65.5 L726 67.4 L732 69.3 L738 71.1 L744 72.8 L750 74.4 L756 75.9 L762 77.2 L768 78.3 L774 79.2 L780 80.0 L786 80.5 L792 80.9 L798 81.1 L804 81.2 L810 81.1 L816 80.9 L822 80.5 L828 80.1 L834 79.7 L840 79.2 L846 78.7 L852 78.2 L858 77.8 L864 77.4 L870 77.1 L876 77.0 L882 76.9 L888 77.0 L894 77.2 L900 77.6 L906 78.1 L912 78.8 L918 79.5 L924 80.4 L930 81.4 L936 82.4 L942 83.5 L948 84.6 L954 85.7 L960 86.8' fill='none' stroke='%23000' stroke-width='1' stroke-opacity='0.22' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); --main: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1440' height='160' viewBox='0 0 1440 160'%3E%3Cpath d='M0 80.0 L6 83.8 L12 87.5 L18 91.0 L24 94.3 L30 97.3 L36 99.8 L42 102.0 L48 103.9 L54 105.3 L60 106.5 L66 107.4 L72 108.1 L78 108.6 L84 109.1 L90 109.6 L96 110.1 L102 110.6 L108 111.2 L114 111.8 L120 112.4 L126 113.0 L132 113.5 L138 113.9 L144 114.1 L150 114.0 L156 113.7 L162 113.1 L168 112.2 L174 111.1 L180 109.8 L186 108.2 L192 106.6 L198 105.0 L204 103.5 L210 102.1 L216 100.9 L222 100.0 L228 99.4 L234 99.1 L240 99.1 L246 99.3 L252 99.8 L258 100.4 L264 101.1 L270 101.7 L276 102.3 L282 102.7 L288 102.8 L294 102.7 L300 102.2 L306 101.4 L312 100.3 L318 99.0 L324 97.3 L330 95.5 L336 93.6 L342 91.7 L348 89.7 L354 87.8 L360 86.0 L366 84.3 L372 82.6 L378 81.0 L384 79.5 L390 77.9 L396 76.3 L402 74.6 L408 72.7 L414 70.6 L420 68.2 L426 65.7 L432 62.9 L438 59.9 L444 56.8 L450 53.7 L456 50.5 L462 47.6 L468 44.8 L474 42.3 L480 40.2 L486 38.5 L492 37.3 L498 36.5 L504 36.2 L510 36.4 L516 37.0 L522 37.9 L528 39.0 L534 40.3 L540 41.8 L546 43.2 L552 44.6 L558 46.0 L564 47.2 L570 48.4 L576 49.4 L582 50.4 L588 51.4 L594 52.4 L600 53.6 L606 54.8 L612 56.2 L618 57.8 L624 59.5 L630 61.5 L636 63.6 L642 65.8 L648 68.1 L654 70.3 L660 72.5 L666 74.4 L672 76.2 L678 77.7 L684 78.8 L690 79.7 L696 80.2 L702 80.4 L708 80.4 L714 80.2 L720 80.0 L726 79.8 L732 79.6 L738 79.6 L744 79.8 L750 80.3 L756 81.2 L762 82.3 L768 83.8 L774 85.6 L780 87.5 L786 89.7 L792 91.9 L798 94.2 L804 96.4 L810 98.5 L816 100.5 L822 102.2 L828 103.8 L834 105.2 L840 106.4 L846 107.6 L852 108.6 L858 109.6 L864 110.6 L870 111.6 L876 112.8 L882 114.0 L888 115.4 L894 116.8 L900 118.2 L906 119.7 L912 121.0 L918 122.1 L924 123.0 L930 123.6 L936 123.8 L942 123.5 L948 122.7 L954 121.5 L960 119.8 L966 117.7 L972 115.2 L978 112.4 L984 109.5 L990 106.3 L996 103.2 L1002 100.1 L1008 97.1 L1014 94.3 L1020 91.8 L1026 89.4 L1032 87.3 L1038 85.4 L1044 83.7 L1050 82.1 L1056 80.5 L1062 79.0 L1068 77.4 L1074 75.7 L1080 74.0 L1086 72.2 L1092 70.3 L1098 68.3 L1104 66.4 L1110 64.5 L1116 62.7 L1122 61.0 L1128 59.7 L1134 58.6 L1140 57.8 L1146 57.3 L1152 57.2 L1158 57.3 L1164 57.7 L1170 58.3 L1176 58.9 L1182 59.6 L1188 60.2 L1194 60.7 L1200 60.9 L1206 60.9 L1212 60.6 L1218 60.0 L1224 59.1 L1230 57.9 L1236 56.5 L1242 55.0 L1248 53.4 L1254 51.8 L1260 50.2 L1266 48.9 L1272 47.8 L1278 46.9 L1284 46.3 L1290 46.0 L1296 45.9 L1302 46.1 L1308 46.5 L1314 47.0 L1320 47.6 L1326 48.2 L1332 48.8 L1338 49.4 L1344 49.9 L1350 50.4 L1356 50.9 L1362 51.4 L1368 51.9 L1374 52.6 L1380 53.5 L1386 54.7 L1392 56.1 L1398 58.0 L1404 60.2 L1410 62.7 L1416 65.7 L1422 69.0 L1428 72.5 L1434 76.2 L1440 80.0' fill='none' stroke='%23000' stroke-width='2' stroke-opacity='1' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M0 118.8 L6 119.3 L12 119.8 L18 120.3 L24 120.8 L30 121.4 L36 122.1 L42 122.7 L48 123.2 L54 123.7 L60 124.0 L66 124.1 L72 124.0 L78 123.5 L84 122.8 L90 121.9 L96 120.6 L102 119.2 L108 117.7 L114 116.0 L120 114.4 L126 113.0 L132 111.6 L138 110.5 L144 109.7 L150 109.2 L156 109.0 L162 109.1 L168 109.5 L174 110.0 L180 110.6 L186 111.3 L192 112.0 L198 112.5 L204 112.8 L210 112.8 L216 112.6 L222 112.0 L228 111.1 L234 109.9 L240 108.4 L246 106.7 L252 104.9 L258 102.9 L264 101.0 L270 99.0 L276 97.1 L282 95.3 L288 93.7 L294 92.0 L300 90.5 L306 88.9 L312 87.4 L318 85.7 L324 83.9 L330 81.9 L336 79.7 L342 77.3 L348 74.7 L354 71.8 L360 68.8 L366 65.6 L372 62.5 L378 59.4 L384 56.5 L390 53.8 L396 51.5 L402 49.5 L408 48.0 L414 46.9 L420 46.4 L426 46.3 L432 46.6 L438 47.3 L444 48.3 L450 49.5 L456 50.9 L462 52.3 L468 53.7 L474 55.1 L480 56.4 L486 57.6 L492 58.8 L498 59.8 L504 60.8 L510 61.8 L516 62.8 L522 64.0 L528 65.3 L534 66.7 L540 68.4 L546 70.2 L552 72.3 L558 74.4 L564 76.7 L570 78.9 L576 81.1 L582 83.2 L588 85.1 L594 86.8 L600 88.1 L606 89.2 L612 89.9 L618 90.3 L624 90.4 L630 90.4 L636 90.2 L642 89.9 L648 89.7 L654 89.6 L660 89.6 L666 90.0 L672 90.6 L678 91.6 L684 92.8 L690 94.4 L696 96.3 L702 98.3 L708 100.5 L714 102.7 L720 105.0 L726 107.2 L732 109.2 L738 111.1 L744 112.8 L750 114.4 L756 115.7 L762 116.9 L768 117.9 L774 118.9 L780 119.9 L786 121.0 L792 122.0 L798 123.2 L804 124.5 L810 125.9 L816 127.3 L822 128.8 L828 130.2 L834 131.4 L840 132.5 L846 133.3 L852 133.7 L858 133.7 L864 133.3 L870 132.4 L876 131.0 L882 129.1 L888 126.8 L894 124.2 L900 121.4 L906 118.3 L912 115.2 L918 112.0 L924 109.0 L930 106.1 L936 103.4 L942 100.9 L948 98.6 L954 96.6 L960 94.8 L966 93.1 L972 91.5 L978 89.9 L984 88.4 L990 86.8 L996 85.1 L1002 83.3 L1008 81.5 L1014 79.6 L1020 77.6 L1026 75.6 L1032 73.8 L1038 72.0 L1044 70.5 L1050 69.2 L1056 68.2 L1062 67.6 L1068 67.2 L1074 67.2 L1080 67.4 L1086 67.9 L1092 68.5 L1098 69.2 L1104 69.8 L1110 70.4 L1116 70.8 L1122 71.0 L1128 70.9 L1134 70.4 L1140 69.7 L1146 68.7 L1152 67.4 L1158 66.0 L1164 64.4 L1170 62.8 L1176 61.2 L1182 59.7 L1188 58.4 L1194 57.4 L1200 56.6 L1206 56.1 L1212 55.9 L1218 55.9 L1224 56.2 L1230 56.6 L1236 57.2 L1242 57.8 L1248 58.4 L1254 59.0 L1260 59.6 L1266 60.1 L1272 60.6 L1278 61.1 L1284 61.6 L1290 62.2 L1296 62.9 L1302 63.9 L1308 65.2 L1314 66.8 L1320 68.7 L1326 71.1 L1332 73.8 L1338 76.9 L1344 80.2 L1350 83.8 L1356 87.6 L1362 91.4 L1368 95.2 L1374 98.8 L1380 102.3 L1386 105.4 L1392 108.2 L1398 110.7 L1404 112.7 L1410 114.4 L1416 115.8 L1422 116.8 L1428 117.6 L1434 118.3 L1440 118.8' fill='none' stroke='%23000' stroke-width='1' stroke-opacity='0.35' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M0 133.3 L6 132.5 L12 131.4 L18 130.1 L24 128.7 L30 127.1 L36 125.4 L42 123.9 L48 122.4 L54 121.2 L60 120.2 L66 119.5 L72 119.1 L78 119.0 L84 119.2 L90 119.6 L96 120.2 L102 120.9 L108 121.6 L114 122.2 L120 122.6 L126 122.8 L132 122.8 L138 122.4 L144 121.7 L150 120.7 L156 119.3 L162 117.8 L168 116.0 L174 114.1 L180 112.2 L186 110.2 L192 108.3 L198 106.5 L204 104.7 L210 103.0 L216 101.5 L222 99.9 L228 98.4 L234 96.8 L240 95.1 L246 93.2 L252 91.1 L258 88.9 L264 86.4 L270 83.6 L276 80.7 L282 77.6 L288 74.5 L294 71.4 L300 68.3 L306 65.5 L312 62.9 L318 60.7 L324 58.9 L330 57.5 L336 56.7 L342 56.3 L348 56.3 L354 56.8 L360 57.6 L366 58.7 L372 60.0 L378 61.4 L384 62.8 L390 64.3 L396 65.6 L402 66.9 L408 68.1 L414 69.2 L420 70.2 L426 71.2 L432 72.2 L438 73.3 L444 74.5 L450 75.8 L456 77.3 L462 79.1 L468 81.0 L474 83.0 L480 85.2 L486 87.5 L492 89.7 L498 91.9 L504 93.9 L510 95.8 L516 97.3 L522 98.5 L528 99.5 L534 100.1 L540 100.4 L546 100.4 L552 100.3 L558 100.1 L564 99.8 L570 99.6 L576 99.6 L582 99.7 L588 100.2 L594 100.9 L600 102.0 L606 103.4 L612 105.1 L618 107.0 L624 109.1 L630 111.3 L636 113.6 L642 115.8 L648 118.0 L654 120.0 L660 121.8 L666 123.4 L672 124.9 L678 126.1 L684 127.3 L690 128.3 L696 129.3 L702 130.3 L708 131.4 L714 132.5 L720 133.7 L726 135.0 L732 136.4 L738 137.9 L744 139.3 L750 140.7 L756 141.9 L762 142.8 L768 143.5 L774 143.8 L780 143.6 L786 143.0 L792 141.9 L798 140.3 L804 138.3 L810 135.9 L816 133.2 L822 130.3 L828 127.2 L834 124.0 L840 120.9 L846 117.9 L852 115.1 L858 112.4 L864 110.0 L870 107.9 L876 105.9 L882 104.1 L888 102.5 L894 100.9 L900 99.4 L906 97.8 L912 96.2 L918 94.5 L924 92.7 L930 90.8 L936 88.8 L942 86.9 L948 84.9 L954 83.1 L960 81.4 L966 80.0 L972 78.8 L978 77.9 L984 77.4 L990 77.2 L996 77.2 L1002 77.6 L1008 78.1 L1014 78.7 L1020 79.4 L1026 80.1 L1032 80.6 L1038 80.9 L1044 81.0 L1050 80.7 L1056 80.2 L1062 79.4 L1068 78.2 L1074 76.9 L1080 75.4 L1086 73.8 L1092 72.2 L1098 70.6 L1104 69.2 L1110 68.0 L1116 67.1 L1122 66.4 L1128 66.0 L1134 65.9 L1140 66.0 L1146 66.3 L1152 66.8 L1158 67.4 L1164 68.0 L1170 68.6 L1176 69.2 L1182 69.8 L1188 70.3 L1194 70.8 L1200 71.2 L1206 71.8 L1212 72.4 L1218 73.3 L1224 74.4 L1230 75.7 L1236 77.5 L1242 79.6 L1248 82.0 L1254 84.9 L1260 88.1 L1266 91.5 L1272 95.2 L1278 99.0 L1284 102.8 L1290 106.6 L1296 110.1 L1302 113.5 L1308 116.5 L1314 119.2 L1320 121.5 L1326 123.4 L1332 125.0 L1338 126.2 L1344 127.2 L1350 127.9 L1356 128.5 L1362 129.0 L1368 129.5 L1374 129.9 L1380 130.5 L1386 131.0 L1392 131.7 L1398 132.3 L1404 132.9 L1410 133.4 L1416 133.8 L1422 134.1 L1428 134.1 L1434 133.8 L1440 133.3' fill='none' stroke='%23000' stroke-width='1' stroke-opacity='0.18' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E"); }
.scope-trace { position: absolute; inset: 0; background: var(--grad);
  -webkit-mask-image: var(--echo), var(--main);
  mask-image: var(--echo), var(--main);
  -webkit-mask-size: 960px 100%, 1440px 100%; mask-size: 960px 100%, 1440px 100%;
  -webkit-mask-repeat: repeat-x; mask-repeat: repeat-x;
  -webkit-mask-position: 0 0, 0 0; mask-position: 0 0, 0 0; }
.scope-fade { position: absolute; inset: 0; background: linear-gradient(90deg, var(--bg), transparent 12%, transparent 88%, var(--bg)); }
@keyframes scan { to { -webkit-mask-position: -960px 0, -1440px 0; mask-position: -960px 0, -1440px 0; } }
@media (prefers-reduced-motion: no-preference) { .scope-trace { animation: scan 16s linear infinite; } .scope.is-off .scope-trace { animation-play-state: paused; } }
@media (max-width: 960px) { .fiche-grid { grid-template-columns: 1fr; align-items: start; } .glance { max-width: 560px; } }
@media (max-width: 480px) { .glance a { padding: 14px 12px; gap: 10px; } .glance-h, .glance-note { padding-inline: 12px; } }

/* ---------- Fil d’Ariane ---------- */
.crumbs { margin-bottom: clamp(28px, 4vw, 48px); }
.crumbs ol { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font: 400 13px/1.4 var(--mono); color: var(--ink-dim); }
.crumbs li { display: inline-flex; align-items: center; gap: 8px; }
.crumbs li + li::before { content: "/"; color: var(--ink-mute); }
.crumbs a { display: inline-block; padding-block: 5px; text-decoration: none; border-radius: 4px; transition: color .2s; }
.crumbs a:hover { color: var(--ink); }

/* ---------- Trois façons : une planche à trois colonnes ---------- */
.offers { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line-2); border-radius: 32px; overflow: hidden; background: var(--panel); }
.offer { position: relative; display: flex; flex-direction: column; padding: clamp(26px, 3vw, 44px); scroll-margin-top: 110px; }
.offer + .offer { border-left: 1px solid var(--line-2); }
.offer-ico { font-size: 34px; color: var(--accent); line-height: 1; }
.offer h3 { margin-top: 28px; font-size: clamp(1.45rem, 1.15rem + 1vw, 2rem); line-height: 1.04; letter-spacing: -0.04em; font-weight: 700; }
.price { margin-top: 22px; padding-bottom: 24px; display: grid; gap: 4px; }
.price-row { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; }
.price .num { font-family: var(--display); font-size: clamp(2.2rem, 1.6rem + 2vw, 3.4rem); font-weight: 700; letter-spacing: -0.05em; line-height: 1; }
.price .price-row + .price-row .num { font-size: clamp(1.4rem, 1.15rem + .9vw, 1.9rem); letter-spacing: -0.03em; }
.price .unit, .price .for { font: 400 13px/1.3 var(--mono); color: var(--ink-dim); }
.feat { margin-top: auto; padding-top: 22px; border-top: 1px solid var(--line); display: grid; gap: 11px; }
.feat li { position: relative; padding-left: 18px; color: var(--ink-dim); font-size: 15.5px; line-height: 1.55; }
.feat li::before { content: ""; position: absolute; left: 0; top: .75em; width: 8px; height: 1.5px; background: var(--ink-dim); }
.offer.solid { background: var(--blue); color: var(--bg); }
.offer.solid + .offer { border-left-color: transparent; }
.offer.solid .offer-ico, .offer.solid h3, .offer.solid .price .num, .offer.solid .price .unit, .offer.solid .price .for, .offer.solid .feat li { color: var(--bg); }
.offer.solid .feat { border-top-color: rgba(11,14,20,.3); }
.offer.solid .feat li::before { background: var(--bg); }
@media (max-width: 960px) {
  .offers { grid-template-columns: 1fr; }
  .offer + .offer, .offer.solid + .offer { border-left: 0; border-top: 1px solid var(--line-2); }
  .offer.solid + .offer { border-top-color: transparent; }
}

/* ---------- Formules : tableau ---------- */
.table-wrap { margin-top: clamp(40px, 5vw, 64px); }
.tarifs { width: 100%; border-collapse: collapse; }
.tarifs caption { text-align: left; font-size: 16.5px; color: var(--ink-dim); padding-bottom: 18px; }
.tarifs th, .tarifs td { text-align: left; vertical-align: top; }
.tarifs thead th { font: 500 12px/1.3 var(--mono); color: var(--ink-dim); text-transform: uppercase; letter-spacing: .08em; padding: 0 16px 12px 0; border-bottom: 1px solid var(--line-2); }
.tarifs tbody th { font-family: var(--display); font-size: 17.5px; font-weight: 600; letter-spacing: -0.02em; color: var(--ink); padding: 20px 16px 20px 0; border-bottom: 1px solid var(--line); width: 22%; }
.tarifs tbody td { color: var(--ink-dim); font-size: 15.5px; line-height: 1.6; padding: 20px 16px 20px 0; border-bottom: 1px solid var(--line); }
.tarifs tbody td.tarif { font-family: var(--display); font-size: 17px; font-weight: 700; letter-spacing: -0.02em; color: var(--ink); white-space: nowrap; width: 18%; }
.tarifs tbody tr { transition: background-color .3s var(--ease); }
.tarifs tbody tr:hover { background: var(--panel); }
.tarifs .lbl { display: none; }
@media (max-width: 720px) {
  .tarifs thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
  .tarifs, .tarifs tbody, .tarifs tr, .tarifs th, .tarifs td { display: block; width: auto; }
  .tarifs tbody tr { margin-top: 14px; padding: 18px; border: 1px solid var(--line); border-radius: 28px; background: var(--panel); }
  .tarifs tbody th { padding: 0; border: 0; font-size: 19px; }
  .tarifs tbody td { padding: 0; border: 0; }
  .tarifs tbody td.tarif { white-space: normal; margin-top: 12px; font-size: 19px; }
  .tarifs .lbl { display: block; margin-bottom: 4px; font: 500 12px/1.3 var(--mono); color: var(--ink-dim); text-transform: uppercase; letter-spacing: .08em; }
}
.notes { margin-top: 28px; display: grid; gap: 12px; max-width: 72ch; }
.notes p { color: var(--ink-dim); font-size: 15.5px; line-height: 1.65; }

/* ---------- Domaines : grille de spécifications ---------- */
.domains { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line-2); border-left: 1px solid var(--line); }
.dom-row { padding: clamp(24px, 2.6vw, 36px); border-right: 1px solid var(--line); border-bottom: 1px solid var(--line); transition: background-color .4s var(--ease); }
.dom-row:hover { background: var(--panel); }
.dom-row h3 { display: grid; gap: 22px; font-family: var(--display); font-size: clamp(1.2rem, 1.05rem + .5vw, 1.45rem); font-weight: 600; letter-spacing: -0.02em; line-height: 1.2; }
.dom-row h3 i { font-size: 30px; color: var(--accent); }
.dom-row p { margin-top: 10px; color: var(--ink-dim); font-size: 15.5px; line-height: 1.6; }
@media (max-width: 960px) { .domains { grid-template-columns: 1fr 1fr; } }
@media (max-width: 600px) { .domains { grid-template-columns: 1fr; } .dom-row h3 { grid-template-columns: auto 1fr; align-items: center; gap: 14px; } .dom-row h3 i { font-size: 24px; } }

/* ---------- Réalisations : rangées éditoriales ---------- */
.cases { margin-top: clamp(40px, 5vw, 64px); border-top: 1px solid var(--line-2); }
.case { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr); gap: clamp(24px, 5vw, 80px); padding: clamp(32px, 4.5vw, 64px) 0; border-bottom: 1px solid var(--line); }
.case-ico { font-size: 34px; color: var(--accent); }
.case h3 { margin-top: 20px; font-size: clamp(1.7rem, 1.2rem + 1.9vw, 2.9rem); line-height: 1; letter-spacing: -0.05em; font-weight: 700; max-width: 16ch; }
.case p { font-size: clamp(1.02rem, .95rem + .3vw, 1.18rem); line-height: 1.65; color: var(--ink-dim); max-width: 56ch; }
.tags { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 22px; }
.tags li { font: 400 12.5px/1 var(--mono); padding: 8px 11px; border-radius: 999px; border: 1px solid var(--line-2); color: var(--ink); }
.tags li.cat { color: var(--accent); border-color: color-mix(in srgb, var(--accent) 45%, var(--line-2)); }
@media (max-width: 860px) { .case { grid-template-columns: 1fr; gap: 18px; } }

/* ---------- Engagements : registre ---------- */
.pledge { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: 1fr 1fr; border: 1px solid var(--line); border-radius: 28px; background: var(--panel); overflow: hidden; }
.pledge li { display: grid; grid-template-columns: auto 1fr; gap: 16px; align-items: start; padding: clamp(22px, 3vw, 32px); border-bottom: 1px solid var(--line); }
.pledge li:nth-child(odd) { border-right: 1px solid var(--line); }
.pledge li:nth-last-child(-n+2) { border-bottom: 0; }
.pledge .ck { color: var(--accent); font-size: 22px; line-height: 1.3; }
.pledge p { color: var(--ink-dim); font-size: 16px; line-height: 1.65; }
@media (max-width: 760px) {
  .pledge { grid-template-columns: 1fr; }
  .pledge li:nth-child(odd) { border-right: 0; }
  .pledge li:nth-last-child(-n+2) { border-bottom: 1px solid var(--line); }
  .pledge li:last-child { border-bottom: 0; }
}

/* ---------- Pied de page ---------- */
.foot { position: relative; padding-top: clamp(80px, 10vw, 140px); overflow: hidden; border-top: 1px solid var(--line); }
.foot-top { display: grid; grid-template-columns: minmax(0, 1.4fr) repeat(3, minmax(0, 1fr)); gap: 40px; }
.foot-top h2 { font-size: clamp(1.8rem, 1.2rem + 2vw, 3rem); line-height: 1.02; letter-spacing: -0.045em; font-weight: 700; max-width: 14ch; }
.foot-top .btn { margin-top: 28px; }
.foot-col h3 { font: 500 13px/1 var(--mono); color: var(--ink-dim); margin-bottom: 18px; }
.foot-col li + li { margin-top: 10px; }
.foot-col a { color: var(--ink-dim); text-decoration: none; font-size: 15.5px; transition: color .2s; border-radius: 4px; }
.foot-col a:hover { color: var(--ink); }
.giant { margin-top: clamp(56px, 8vw, 120px); font-family: var(--display); font-weight: 800; font-size: 21.5vw; line-height: .78; letter-spacing: -0.07em; white-space: nowrap; color: var(--panel-2); user-select: none; padding-left: 1vw; }
.giant span { color: color-mix(in srgb, var(--green) 85%, var(--bg)); }
.giant::before { content: "Veltis "; } .giant span::before { content: "IT"; }
/* Logotype en filigrane : derrière le contenu du pied de page, en fondu vers le haut */
.foot { isolation: isolate; }
.foot-top, .foot-bottom { position: relative; z-index: 1; }
.foot-top { padding-bottom: clamp(96px, 13vw, 220px); }
.giant { position: absolute; left: 0; right: 0; bottom: clamp(40px, 5vw, 64px); z-index: 0; margin: 0; padding: 0; text-align: center; pointer-events: none; font-size: 23vw; line-height: .8; color: color-mix(in srgb, var(--panel-2) 85%, var(--bg)); -webkit-mask-image: linear-gradient(to bottom, transparent 0%, #000 60%); mask-image: linear-gradient(to bottom, transparent 0%, #000 60%); }
.giant::before { content: "Veltis"; }
.giant span { margin-left: .14em; color: color-mix(in srgb, var(--green) 28%, var(--bg)); }
@media (max-width: 600px) { .giant { font-size: 34vw; } }
@supports (animation-timeline: view()) {
  @media (prefers-reduced-motion: no-preference) {
    .giant { animation: giantUp linear both; animation-timeline: view(); animation-range: entry 0% entry 100%; }
  }
}
@keyframes giantUp { from { transform: translateY(40%); opacity: .2; } }
.foot-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 12px; padding: 22px 0 calc(22px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); font-size: 14px; color: var(--ink-dim); }
@media (max-width: 900px) { .foot-top { grid-template-columns: 1fr 1fr; } .foot-top > div:first-child { grid-column: 1 / -1; } }

/* ---------- FAQ (reprise de l’accueil) ---------- */
.faq-grid { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.4fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.faq-side { position: sticky; top: 110px; }
.faq details { border-bottom: 1px solid var(--line); }
.faq details:first-child { border-top: 1px solid var(--line); }
.faq summary { list-style: none; cursor: pointer; display: grid; grid-template-columns: 1fr auto; gap: 24px; align-items: center; padding: 26px 0; font-family: var(--display); font-size: clamp(1.1rem, 1rem + .5vw, 1.4rem); font-weight: 600; letter-spacing: -0.02em; line-height: 1.3; transition: color .25s var(--ease), padding-left .4s var(--ease); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary:hover { color: var(--accent); padding-left: 8px; }
.faq .pm { position: relative; width: 22px; height: 22px; }
.faq .pm::before, .faq .pm::after { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 1.5px; background: currentColor; transition: transform .5s var(--ease); }
.faq .pm::after { transform: rotate(90deg); }
.faq details[open] .pm::after { transform: rotate(0); }
.faq details[open] summary { color: var(--accent); }
.faq-a { padding: 0 48px 28px 0; color: var(--ink-dim); font-size: 17px; line-height: 1.7; }
@media (prefers-reduced-motion: no-preference) { .faq details[open] .faq-a { animation: fadeUp .6s var(--ease); } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(10px); } }
@media (max-width: 860px) { .faq-grid { grid-template-columns: 1fr; } .faq-side { position: static; } .faq-a { padding-right: 0; } }

/* ---------- Pages locales et guides ---------- */
.intro { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: clamp(32px, 6vw, 96px); align-items: start; }
.intro-txt { display: grid; gap: 18px; }
.intro-txt p { font-size: clamp(1.05rem, .98rem + .3vw, 1.2rem); line-height: 1.7; color: var(--ink-dim); max-width: 60ch; }
.intro-txt p:first-child { color: var(--ink); }
@media (max-width: 860px) { .intro { grid-template-columns: 1fr; gap: 28px; } }
.fiche-note { margin-top: 18px; font-size: 15px; line-height: 1.6; color: var(--ink-dim); max-width: 52ch; }
.glance .row { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 14px; padding: 16px 18px; border-bottom: 1px solid var(--line); }
.glance li:last-child .row { border-bottom: 0; }

.zone { margin-top: clamp(40px, 5vw, 64px); display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line-2); }
.zone li { display: flex; align-items: center; gap: 12px; padding: 16px 16px 16px 0; border-bottom: 1px solid var(--line); font-size: 16.5px; }
.zone li::before { content: ""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--green); }
.zone li.home { font-weight: 600; }
.zone li.home::before { box-shadow: 0 0 0 4px color-mix(in srgb, var(--green) 25%, transparent); }
.zone-note { margin-top: 26px; color: var(--ink-dim); font-size: 16px; line-height: 1.65; max-width: 70ch; }
.zone-note a, .prose a, .faq-a a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 4px; transition: text-decoration-color .2s; }
.zone-note a:hover, .prose a:hover, .faq-a a:hover { text-decoration-color: var(--accent); }
@media (max-width: 960px) { .zone { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 420px) { .zone { grid-template-columns: 1fr; } }

.offers.compact .offer h3 { margin-top: 22px; }
.offers.compact .price { padding-bottom: 0; }
.offers.compact .offer p.desc { margin-top: 18px; padding-top: 18px; border-top: 1px solid var(--line); color: var(--ink-dim); font-size: 15.5px; line-height: 1.6; }
.offers.compact .offer.solid p.desc { color: var(--bg); border-top-color: rgba(11,14,20,.3); }
.offers.four { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .offers.four { grid-template-columns: repeat(2, minmax(0, 1fr)); } .offers.four .offer:nth-child(3) { border-left: 0; } .offers.four .offer:nth-child(n+3) { border-top: 1px solid var(--line-2); } }
@media (max-width: 960px) { .offers.four { grid-template-columns: 1fr; } .offers.four .offer + .offer { border-left: 0; border-top: 1px solid var(--line-2); } }

.domains.five .dom-row:last-child { grid-column: span 2; }
@media (max-width: 960px) { .domains.five .dom-row:last-child { grid-column: auto; } }

.asks { margin-top: clamp(40px, 5vw, 64px); counter-reset: none; border-top: 1px solid var(--line-2); }
.asks li { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.2fr); gap: clamp(16px, 4vw, 64px); padding: 26px 0; border-bottom: 1px solid var(--line); }
.asks h3 { font-family: var(--display); font-size: clamp(1.2rem, 1.05rem + .6vw, 1.55rem); font-weight: 600; letter-spacing: -0.025em; line-height: 1.25; }
.asks p { color: var(--ink-dim); font-size: 16px; line-height: 1.65; }
@media (max-width: 760px) { .asks li { grid-template-columns: 1fr; gap: 8px; } }

.pledge.odd li:last-child { grid-column: 1 / -1; border-right: 0; }
.pledge.odd li:nth-last-child(2) { border-bottom: 1px solid var(--line); }
@media (max-width: 760px) { .pledge.odd li:nth-last-child(2) { border-bottom: 1px solid var(--line); } }
.after { margin-top: 28px; color: var(--ink-dim); font-size: 16px; line-height: 1.65; max-width: 72ch; }
.after a { color: var(--ink); text-decoration: underline; text-decoration-color: var(--line-2); text-underline-offset: 4px; }
.after a:hover { text-decoration-color: var(--accent); }
