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

    :root {
      --brick-dark: #5a1f0f;
      --wood: #3b1f0d;
      --chalk: #f0e8d0;
      --chalk-dim: #c8b89a;
      --gold: #c9962a;
      --gold-light: #e8b84b;
      --chalkboard: #1e2820;
      --chalkboard2: #242c26;
      --border-gold: #a0761a;
      --bulb: #ffcf6e;
    }

    html { scroll-behavior: smooth; }

    body {
      font-family: 'Lora', Georgia, serif;
      background-color: var(--brick-dark);
      color: var(--chalk);
      overflow-x: hidden;
    }

    /* Texture brique */
    body::before {
      content: '';
      position: fixed; inset: 0;
      background-image:
        repeating-linear-gradient(0deg, transparent, transparent 28px, rgba(0,0,0,.18) 28px, rgba(0,0,0,.18) 30px),
        repeating-linear-gradient(90deg, transparent, transparent 58px, rgba(0,0,0,.10) 58px, rgba(0,0,0,.10) 60px);
      pointer-events: none;
      z-index: 0;
    }

    /* Grain */
    body::after {
      content: '';
      position: fixed; inset: 0;
      background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 200 200' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.06'/%3E%3C/svg%3E");
      background-size: 200px 200px;
      pointer-events: none;
      z-index: 0;
      opacity: .5;
    }

    .wrap { position: relative; z-index: 1; }

    /* ────────────────────────────────────────────────── */
    /*  STICKY NAV                                        */
    /* ────────────────────────────────────────────────── */
    .sticky-nav {
      position: fixed;
      top: 0; left: 0; right: 0;
      z-index: 200;
      background: linear-gradient(180deg, rgba(15,5,1,.97) 0%, rgba(30,10,3,.95) 100%);
      border-bottom: 2px solid var(--border-gold);
      padding: 12px 40px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      transform: translateY(-100%);
      transition: transform .35s ease;
      box-shadow: 0 4px 20px rgba(0,0,0,.6);
    }

    .sticky-nav.visible { transform: translateY(0); }

    .sticky-logo {
      font-family: 'Playfair Display', serif;
      font-size: 18px;
      color: var(--gold-light);
      text-decoration: none;
      letter-spacing: 1px;
    }

    .sticky-logo span {
      color: var(--chalk-dim);
      font-size: 13px;
      display: block;
      font-family: 'Lora', serif;
      font-style: italic;
    }

    .sticky-nav ul {
      list-style: none;
      display: flex;
      gap: 32px;
    }

    .sticky-nav ul li a {
      font-family: 'Lora', serif;
      font-size: 13px;
      color: var(--chalk-dim);
      text-decoration: none;
      letter-spacing: 1px;
      transition: color .2s;
      position: relative;
    }

    .sticky-nav ul li a::after {
      content: '';
      position: absolute;
      bottom: -3px; left: 0; right: 0;
      height: 1px;
      background: var(--gold);
      transform: scaleX(0);
      transition: transform .2s;
    }

    .sticky-nav ul li a:hover { color: var(--gold-light); }
    .sticky-nav ul li a:hover::after { transform: scaleX(1); }

    .btn-sticky {
      font-family: 'Lora', serif;
      font-size: 12px;
      padding: 8px 20px;
      border-radius: 5px;
      border: 1.5px solid var(--gold);
      background: linear-gradient(135deg, var(--gold), #b07820);
      color: var(--wood);
      font-weight: 700;
      text-decoration: none;
      letter-spacing: 1px;
      transition: all .2s;
    }

    .btn-sticky:hover {
      background: linear-gradient(135deg, var(--gold-light), var(--gold));
      transform: translateY(-1px);
    }

    /* ────────────────────────────────────────────────── */
    /*  TOP HEADER — DESKTOP                              */
    /* ────────────────────────────────────────────────── */
    .top-header {
      position: relative;
      width: 100%;
      aspect-ratio: 1600 / 502;
      background-image: url('../../images/header.png');
      background-repeat: no-repeat;
      background-position: center top;
      background-size: 100% auto;
      z-index: 10;
    }

    .header-nav {
      position: absolute;
      left: 50%;
      bottom: 22%;
      transform: translateX(-50%);
      z-index: 12;
      background: transparent;
      width: max-content;
    }

    .header-nav ul {
      list-style: none;
      display: flex;
      align-items: center;
      gap: clamp(16px, 3vw, 50px);
      margin: 0;
      padding: 0;
    }

    .header-nav ul li a {
      font-family: 'Lora', serif;
      font-size: clamp(11px, 1.4vw, 18px);
      color: var(--chalk);
      text-decoration: none;
      letter-spacing: 1px;
      text-shadow: 0 1px 4px rgba(0,0,0,.7);
      transition: color .2s;
      white-space: nowrap;
      position: relative;
    }

    .header-nav ul li a::after {
      content: '';
      position: absolute;
      bottom: -4px; left: 0; right: 0;
      height: 1px;
      background: var(--gold);
      transform: scaleX(0);
      transition: transform .2s;
    }

    .header-nav ul li a:hover { color: var(--gold-light); }
    .header-nav ul li a:hover::after { transform: scaleX(1); }

    .logo {
      position: absolute;
      top: 42%; left: 50%;
      transform: translate(-50%, -50%);
      z-index: 11;
    }

    .logo img {
      width: clamp(160px, 38vw, 900px);
      height: auto;
    }

    /* Guirlande desktop */
    .festoon {
      position: absolute;
      left: 0; right: 0; bottom: 6px;
      display: flex;
      justify-content: space-around;
      padding: 4px 16px;
      background: transparent;
      z-index: 2;
    }

    .bulb {
      width: clamp(6px, 0.9vw, 14px);
      height: clamp(8px, 1.2vw, 18px);
      background: radial-gradient(ellipse at 50% 30%, #ffe89a, #e8a820 60%, #8a5a00);
      border-radius: 50% 50% 40% 40%;
      box-shadow: 0 0 6px 3px rgba(255,200,80,.35), 0 0 14px rgba(255,180,60,.2);
      animation: flicker 3s ease-in-out infinite;
      flex-shrink: 0;
    }

    .bulb:nth-child(2n) { animation-delay: .7s; }
    .bulb:nth-child(3n) { animation-delay: 1.4s; }
    .bulb:nth-child(4n) { animation-delay: 2.1s; }

    @keyframes flicker {
      0%,100% { opacity: 1; }
      92% { opacity: 1; }
      93% { opacity: .6; }
      94% { opacity: 1; }
      96% { opacity: .8; }
      97% { opacity: 1; }
    }

    /* ────────────────────────────────────────────────── */
    /*  MOBILE HEADER                                     */
    /* ────────────────────────────────────────────────── */
    .burger-btn {
      display: none;
      flex-direction: column;
      gap: 5px;
      cursor: pointer;
      padding: 8px;
      background: rgba(60,25,8,.8);
      border: 1.5px solid var(--border-gold);
      border-radius: 6px;
      z-index: 20;
    }

    .burger-btn span {
      display: block;
      width: 22px; height: 2px;
      background: var(--gold-light);
      border-radius: 2px;
      transition: all .3s;
    }

    .burger-btn.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .burger-btn.open span:nth-child(2) { opacity: 0; }
    .burger-btn.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }

    .mobile-menu {
      display: none;
      position: absolute;
      top: 100%; left: 0; right: 0;
      background: linear-gradient(180deg, rgba(15,5,1,.99) 0%, rgba(25,8,2,.99) 100%);
      border-bottom: 2px solid var(--border-gold);
      box-shadow: 0 8px 24px rgba(0,0,0,.7);
      z-index: 15;
      overflow: hidden;
      max-height: 0;
      transition: max-height .4s ease;
    }

    .mobile-menu.open { max-height: 500px; }

    .mobile-menu ul {
      list-style: none;
      padding: 12px 0 20px;
    }

    .mobile-menu ul li a {
      display: block;
      padding: 13px 28px;
      font-family: 'Lora', serif;
      font-size: 15px;
      color: var(--chalk-dim);
      text-decoration: none;
      letter-spacing: 1px;
      border-bottom: 1px dashed rgba(160,118,26,.2);
      transition: all .2s;
    }

    .mobile-menu ul li:last-child a { border-bottom: none; }

    .mobile-menu ul li a:hover {
      color: var(--gold-light);
      padding-left: 36px;
      background: rgba(160,118,26,.06);
    }

    .mobile-header-bar {
      display: none;
      align-items: center;
      justify-content: space-between;
      padding: 10px 18px;
      background: linear-gradient(180deg, rgba(10,3,1,.98) 0%, rgba(20,7,2,.96) 100%);
      border-bottom: 2px solid var(--border-gold);
      position: relative;
      z-index: 16;
    }

    .mobile-header-bar .mobile-logo {
      font-family: 'Playfair Display', serif;
      font-size: 16px;
      color: var(--gold-light);
      text-decoration: none;
      letter-spacing: 1px;
      line-height: 1.2;
    }

    .mobile-header-bar .mobile-logo small {
      display: block;
      font-family: 'Lora', serif;
      font-size: 10px;
      color: var(--chalk-dim);
      font-style: italic;
    }

    .mobile-festoon {
      display: none;
      justify-content: space-around;
      padding: 4px 10px;
      background: rgba(5,2,0,.9);
      border-bottom: 1px solid rgba(160,118,26,.2);
    }

    .mobile-festoon .bulb {
      width: 7px;
      height: 9px;
      box-shadow: 0 0 4px 2px rgba(255,200,80,.3);
    }

    /* ────────────────────────────────────────────────── */
    /*  HERO                                              */
    /* ────────────────────────────────────────────────── */
    .hero {
      min-height: 440px;
      background-image: url('../../images/brick-hero.png');
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      display: flex;
      align-items: center;
      padding: 60px 60px 60px 70px;
      gap: 40px;
      position: relative;
      overflow: hidden;
    }

    .hero::before {
      content: '';
      position: absolute; inset: 0;
      background: rgba(0,0,0,0.35);
      z-index: 1;
    }

    .hero::after {
      content: '';
      position: absolute;
      top: 0; left: 0; right: 0;
      height: 6px;
      background: repeating-linear-gradient(90deg, transparent 0px, transparent 40px, var(--bulb) 40px, var(--bulb) 48px);
      box-shadow: 0 0 12px var(--bulb);
      z-index: 2;
    }

    .hero > * { position: relative; z-index: 2; }
    .hero-text { flex: 1; }

    .hero-title {
      font-family: 'Caveat', cursive;
      font-size: clamp(36px, 5vw, 72px);
      color: var(--chalk);
      line-height: 1.05;
      text-shadow: 2px 3px 12px rgba(0,0,0,.6);
      margin-bottom: 4px;
      padding-left: 20%;
    }

    .hero-title span {
      display: block;
      font-size: clamp(42px, 6vw, 82px);
      padding-left: 0;
    }

    .hero-sub {
      font-family: 'Lora', serif;
      font-style: italic;
      font-size: clamp(16px, 2.2vw, 28px);
      color: var(--gold-light);
      margin: 14px 0 32px;
      padding-left: 20%;
    }

    .hero-buttons {
      display: flex;
      flex-wrap: wrap;
      gap: 14px;
      padding-left: 20%;
    }

    .btn {
      font-family: 'Lora', serif;
      font-size: clamp(13px, 1.4vw, 18px);
      letter-spacing: 1.5px;
      padding: 12px 28px;
      border-radius: 6px;
      border: 2px solid var(--gold);
      background: linear-gradient(135deg, rgba(60,25,8,.9) 0%, rgba(90,40,10,.9) 100%);
      color: var(--chalk);
      cursor: pointer;
      text-decoration: none;
      display: inline-block;
      transition: all .25s;
      box-shadow: 0 4px 14px rgba(0,0,0,.4);
    }

    .btn:hover {
      background: linear-gradient(135deg, var(--gold) 0%, var(--gold-light) 100%);
      color: var(--wood);
      transform: translateY(-2px);
      box-shadow: 0 6px 20px rgba(200,150,0,.35);
    }

    .btn-accent {
      background: linear-gradient(135deg, var(--gold) 0%, #b07820 100%);
      color: var(--wood);
      font-weight: 700;
    }

    .btn-accent:hover {
      background: linear-gradient(135deg, var(--gold-light) 0%, var(--gold) 100%);
      color: var(--wood);
    }

    .hero-server {
      flex-shrink: 0;
      width: 40%;
      display: flex;
      justify-content: center;
      align-items: flex-end;
    }

    .hero-server img {
      width: 100%;
      height: auto;
      filter: drop-shadow(6px 12px 24px rgba(0,0,0,.6));
      animation: floatX 4s ease-in-out infinite;
    }

    @keyframes floatX {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(-12px); }
    }

    @keyframes float {
      0%, 100% { transform: translateY(0px); }
      50% { transform: translateY(-10px); }
    }

    /* ────────────────────────────────────────────────── */
    /*  STATS                                             */
    /* ────────────────────────────────────────────────── */
    .stats {
      background: linear-gradient(135deg, rgba(10,4,1,.98) 0%, rgba(20,8,2,.98) 100%);
      border-top: 3px solid var(--border-gold);
      border-bottom: 3px solid var(--border-gold);
      padding: 50px 60px;
    }

    .stats-grid {
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: 30px;
      max-width: 1100px;
      margin: 0 auto;
      text-align: center;
    }

    .stat-item { padding: 20px 10px; }

    .stat-number {
      font-family: 'Playfair Display', serif;
      font-size: clamp(36px, 5vw, 60px);
      font-weight: 700;
      color: var(--gold-light);
      display: block;
      line-height: 1;
      margin-bottom: 8px;
    }

    .stat-label {
      font-size: 13px;
      color: var(--chalk-dim);
      font-style: italic;
      letter-spacing: .5px;
    }

    /* ────────────────────────────────────────────────── */
    /*  SECTION TITLES                                    */
    /* ────────────────────────────────────────────────── */
    .section-title {
      text-align: center;
      font-family: 'Playfair Display', serif;
      font-size: clamp(22px, 3vw, 40px);
      color: var(--chalk);
      margin-bottom: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 20px;
    }

    .section-title::before,
    .section-title::after {
      content: '';
      flex: 1;
      max-width: 120px;
      height: 2px;
      background: linear-gradient(90deg, transparent, var(--gold));
    }

    .section-title::after {
      background: linear-gradient(90deg, var(--gold), transparent);
    }

    .section-intro {
      text-align: center;
      font-style: italic;
      color: var(--chalk-dim);
      font-size: 15px;
      margin-bottom: 50px;
      max-width: 680px;
      margin-left: auto;
      margin-right: auto;
    }

    /* ────────────────────────────────────────────────── */
    /*  FOND MUR PARTAGÉ                                  */
    /* ────────────────────────────────────────────────── */
    .services,
    .pricing,
    .about {
      background-image: url('../../images/mur.png');
      background-size: cover;
      background-position: center;
      background-repeat: no-repeat;
      background-attachment: scroll; /* fallback iOS */
      position: relative;
    }

    @supports not (-webkit-overflow-scrolling: touch) {
      .services, .pricing, .about { background-attachment: fixed; }
    }

    .services::before,
    .pricing::before,
    .about::before {
      content: '';
      position: absolute; inset: 0;
      background: rgba(0,0,0,.50);
      z-index: 0;
    }

    .services > *,
    .pricing > *,
    .about > * {
      position: relative;
      z-index: 1;
    }

    .services {
      padding: 80px 60px;
      border-top: 3px solid rgba(160,118,26,.3);
      border-bottom: 3px solid rgba(160,118,26,.3);
    }

    .pricing { padding: 70px 60px; }

    .about {
      padding: 70px 60px;
      border-top: 3px solid rgba(160,118,26,.3);
    }

    /* ────────────────────────────────────────────────── */
    /*  SERVICES — ONGLETS                                */
    /* ────────────────────────────────────────────────── */
    .services-tabs {
      display: flex;
      justify-content: center;
      margin: 0 auto 50px;
      border: 2px solid var(--border-gold);
      border-radius: 10px;
      overflow: hidden;
      max-width: 700px;
    }

    .tab-btn {
      flex: 1;
      padding: 14px 20px;
      font-family: 'Playfair Display', serif;
      font-size: clamp(12px, 1.3vw, 16px);
      color: var(--chalk-dim);
      background: linear-gradient(135deg, rgba(20,10,3,.85), rgba(35,15,5,.9));
      border: none;
      border-right: 1px solid var(--border-gold);
      cursor: pointer;
      transition: all .25s;
      letter-spacing: .5px;
    }

    .tab-btn:last-child { border-right: none; }

    .tab-btn:hover,
    .tab-btn.active {
      background: linear-gradient(135deg, var(--gold) 0%, #b07820 100%);
      color: var(--wood);
      font-weight: 700;
    }

    .tab-panel { display: none; }
    .tab-panel.active { display: block; }

    /* ────────────────────────────────────────────────── */
    /*  CARTES DE SERVICES                                */
    /* ────────────────────────────────────────────────── */
    .services-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 24px;
      max-width: 1100px;
      margin: 0 auto;
    }

    .service-card {
      background: linear-gradient(135deg, rgba(20,28,22,.95) 0%, rgba(26,36,28,.95) 100%);
      border: 2px solid var(--border-gold);
      border-radius: 14px;
      padding: 30px 24px 26px;
      position: relative;
      box-shadow: 0 6px 30px rgba(0,0,0,.5);
      transition: transform .25s, box-shadow .25s;
      overflow: hidden;
    }

    /* Cadre intérieur décoratif */
    .service-card::before {
      content: '';
      position: absolute; inset: 5px;
      border: 1px solid rgba(160,118,26,.15);
      border-radius: 10px;
      pointer-events: none;
    }

    /* Coin doré */
    .service-card::after {
      content: '';
      position: absolute;
      top: 0; right: 0;
      width: 0; height: 0;
      border-style: solid;
      border-width: 0 32px 32px 0;
      border-color: transparent var(--gold) transparent transparent;
      opacity: .4;
    }

    .service-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 14px 40px rgba(0,0,0,.65), 0 0 20px rgba(200,150,0,.12);
    }

    .service-card-icon {
      font-size: 38px;
      display: block;
      margin-bottom: 14px;
    }

    .service-card-title {
      font-family: 'Playfair Display', serif;
      font-size: 17px;
      color: var(--gold-light);
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .service-card-title::before {
      content: '—';
      color: var(--gold);
      font-size: 12px;
    }

    .service-card-desc {
      font-size: 13px;
      line-height: 1.7;
      color: var(--chalk-dim);
      font-style: italic;
    }

    .badge {
      display: inline-block;
      font-size: 10px;
      font-family: 'Lora', serif;
      font-style: normal;
      letter-spacing: 1px;
      text-transform: uppercase;
      padding: 3px 8px;
      border-radius: 20px;
      margin-bottom: 10px;
      font-weight: 700;
    }

    .badge-gold  { background: rgba(200,150,0,.15); color: var(--gold-light); border: 1px solid rgba(200,150,0,.3); }
    .badge-green { background: rgba(60,160,80,.15);  color: #7ecf8e;           border: 1px solid rgba(60,160,80,.3); }
    .badge-blue  { background: rgba(60,120,200,.15); color: #8ab4e8;           border: 1px solid rgba(60,120,200,.3); }

    .service-features {
      list-style: none;
      margin-top: 14px;
    }

    .service-features li {
      font-size: 12.5px;
      color: var(--chalk-dim);
      padding: 5px 0;
      border-bottom: 1px dashed rgba(160,118,26,.18);
      display: flex;
      align-items: flex-start;
      gap: 8px;
      line-height: 1.5;
    }

    .service-features li::before {
      content: '✓';
      color: var(--gold);
      font-weight: 700;
      flex-shrink: 0;
      margin-top: 1px;
    }

    /* Bandeau réassurance */
    .services-reassurance {
      display: flex;
      justify-content: center;
      gap: 40px;
      margin-top: 50px;
      flex-wrap: wrap;
    }

    .reassurance-item {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      color: var(--chalk-dim);
      font-style: italic;
    }

    .reassurance-item .icon { font-size: 24px; }

    /* ────────────────────────────────────────────────── */
    /*  PRICING                                           */
    /* ────────────────────────────────────────────────── */
    .pricing-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
      max-width: 1100px;
      margin: 0 auto;
    }

    .price-card {
      background: linear-gradient(170deg, var(--chalkboard) 0%, #1a2218 100%);
      border: 3px solid var(--border-gold);
      border-radius: 14px;
      padding: 36px 30px 32px;
      position: relative;
      box-shadow: 0 8px 32px rgba(0,0,0,.55);
      transition: transform .25s, box-shadow .25s;
      display: flex;
      flex-direction: column;
    }

    .price-card::before {
      content: '';
      position: absolute; inset: 6px;
      border: 1px solid rgba(160,118,26,.2);
      border-radius: 10px;
      pointer-events: none;
    }

    .price-card:hover {
      transform: translateY(-6px);
      box-shadow: 0 16px 48px rgba(0,0,0,.65), 0 0 24px rgba(200,150,0,.15);
    }

    .price-card.featured {
      border-color: var(--gold-light);
      background: linear-gradient(170deg, #1e2c1f 0%, #141e15 100%);
      box-shadow: 0 8px 40px rgba(0,0,0,.6), 0 0 30px rgba(200,150,0,.2);
    }

    .price-card.featured::after {
      content: '⭐ Le plus populaire';
      position: absolute;
      top: -14px; left: 50%;
      transform: translateX(-50%);
      background: linear-gradient(135deg, var(--gold), #b07820);
      color: var(--wood);
      font-family: 'Lora', serif;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 1px;
      padding: 4px 16px;
      border-radius: 20px;
      white-space: nowrap;
    }

    .price-name {
      font-family: 'Caveat', cursive;
      font-size: 26px;
      color: var(--gold-light);
      margin-bottom: 16px;
    }

    .price-amount {
      margin-bottom: 26px;
      line-height: 1;
    }

    .price-amount .big {
      font-family: 'Playfair Display', serif;
      font-size: 52px;
      font-weight: 700;
      color: var(--chalk);
    }

    .price-amount .small {
      font-family: 'Lora', serif;
      font-size: 16px;
      color: var(--chalk-dim);
      vertical-align: super;
    }

    .price-amount .period {
      font-size: 14px;
      color: var(--chalk-dim);
      font-style: italic;
    }

    .price-features {
      list-style: none;
      margin-bottom: 28px;
      flex: 1;
    }

    .price-features li {
      font-size: 13px;
      color: var(--chalk-dim);
      padding: 8px 0;
      border-bottom: 1px dashed rgba(160,118,26,.25);
      display: flex;
      align-items: flex-start;
      gap: 10px;
      line-height: 1.5;
    }

    .price-features li::before {
      content: '✓';
      color: var(--gold);
      font-weight: 700;
      flex-shrink: 0;
      margin-top: 2px;
    }

    .price-note {
      font-size: 11px;
      color: rgba(200,184,154,.4);
      font-style: italic;
      margin-top: 12px;
      text-align: center;
    }

    /* ────────────────────────────────────────────────── */
    /*  TÉMOIGNAGES                                       */
    /* ────────────────────────────────────────────────── */
    .testimonials {
      padding: 80px 60px;
      background: linear-gradient(180deg, rgba(10,4,1,.98) 0%, rgba(20,8,2,.98) 100%);
      border-top: 3px solid rgba(160,118,26,.3);
    }

    .testimonials-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
      max-width: 1100px;
      margin: 0 auto;
    }

    .testimonial-card {
      background: linear-gradient(135deg, var(--chalkboard) 0%, var(--chalkboard2) 100%);
      border: 2px solid var(--border-gold);
      border-radius: 14px;
      padding: 32px 28px;
      position: relative;
      box-shadow: 0 6px 24px rgba(0,0,0,.45);
    }

    .testimonial-card::before {
      content: '"';
      position: absolute;
      top: -10px; left: 20px;
      font-family: 'Playfair Display', serif;
      font-size: 72px;
      color: var(--gold);
      opacity: .3;
      line-height: 1;
    }

    .testimonial-stars {
      color: var(--gold-light);
      font-size: 16px;
      margin-bottom: 14px;
      letter-spacing: 2px;
    }

    .testimonial-text {
      font-size: 14px;
      line-height: 1.8;
      color: var(--chalk-dim);
      font-style: italic;
      margin-bottom: 20px;
    }

    .testimonial-author {
      display: flex;
      align-items: center;
      gap: 12px;
    }

    .testimonial-avatar {
      width: 42px; height: 42px;
      border-radius: 50%;
      background: linear-gradient(135deg, var(--gold), #b07820);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      flex-shrink: 0;
      border: 2px solid var(--border-gold);
    }

    .testimonial-name {
      font-family: 'Playfair Display', serif;
      font-size: 14px;
      color: var(--chalk);
    }

    .testimonial-role {
      font-size: 12px;
      color: var(--chalk-dim);
      font-style: italic;
    }

    /* ────────────────────────────────────────────────── */
    /*  À PROPOS                                          */
    /* ────────────────────────────────────────────────── */
    .about-inner {
      max-width: 1100px;
      margin: 0 auto;
      display: flex;
      gap: 50px;
      align-items: center;
    }

    .about-server {
      flex-shrink: 0;
      width: 420px;
      display: flex;
      justify-content: center;
      align-items: center;
    }

    .about-server img {
      width: 100%;
      height: auto;
      display: block;
      animation: float 5s ease-in-out infinite;
    }

    .about-box {
      flex: 1;
      background: linear-gradient(135deg, var(--chalkboard) 0%, var(--chalkboard2) 100%);
      border: 3px solid var(--border-gold);
      border-radius: 14px;
      padding: 40px 44px;
      position: relative;
      box-shadow: 0 6px 28px rgba(0,0,0,.5);
    }

    .about-box::before {
      content: '✦  À Propos du P\'tit Serveur  ✦';
      position: absolute;
      top: -16px; left: 50%;
      transform: translateX(-50%);
      background: var(--chalkboard);
      padding: 0 16px;
      font-family: 'Playfair Display', serif;
      font-size: 17px;
      color: var(--gold-light);
      white-space: nowrap;
    }

    .about-box p {
      font-size: 15px;
      line-height: 1.9;
      color: var(--chalk-dim);
      font-style: italic;
      margin-bottom: 10px;
    }

    .about-box p strong {
      color: var(--chalk);
      font-style: normal;
    }



    /* ────────────────────────────────────────────────── */
    /*  BLOG SEO                                          */
    /* ────────────────────────────────────────────────── */
    .blog-section {
      padding: 80px 60px;
      background: linear-gradient(180deg, rgba(10,4,1,.98) 0%, rgba(20,8,2,.98) 100%);
      border-top: 3px solid rgba(160,118,26,.3);
    }
    .blog-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 28px;
      max-width: 1100px;
      margin: 0 auto;
    }
    .blog-card {
      background: linear-gradient(135deg, var(--chalkboard) 0%, var(--chalkboard2) 100%);
      border: 2px solid var(--border-gold);
      border-radius: 14px;
      padding: 30px 26px;
      box-shadow: 0 6px 24px rgba(0,0,0,.45);
      transition: transform .25s, box-shadow .25s;
    }
    .blog-card:hover { transform: translateY(-6px); box-shadow: 0 14px 40px rgba(0,0,0,.62); }
    .blog-meta {
      display: inline-block;
      font-size: 10px;
      letter-spacing: 1px;
      text-transform: uppercase;
      color: var(--gold-light);
      margin-bottom: 12px;
      font-weight: 700;
    }
    .blog-card h3 {
      font-family: 'Playfair Display', serif;
      font-size: 18px;
      line-height: 1.35;
      color: var(--chalk);
      margin-bottom: 12px;
    }
    .blog-card p {
      font-size: 13px;
      line-height: 1.75;
      color: var(--chalk-dim);
      font-style: italic;
      margin-bottom: 18px;
    }
    .blog-card a { color: var(--gold-light); text-decoration: none; font-weight: 700; }
    .blog-card a:hover { text-decoration: underline; }
    .seo-keywords {
      max-width: 1100px;
      margin: 42px auto 0;
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      justify-content: center;
    }
    .seo-keywords span {
      font-size: 12px;
      color: var(--chalk-dim);
      border: 1px solid rgba(160,118,26,.35);
      border-radius: 999px;
      padding: 7px 12px;
      background: rgba(30,15,5,.45);
      font-style: italic;
    }

    /* ────────────────────────────────────────────────── */
    /*  FAQ                                               */
    /* ────────────────────────────────────────────────── */
    .faq {
      padding: 80px 60px;
      background: linear-gradient(180deg, rgba(15,6,2,.98) 0%, rgba(25,10,3,.98) 100%);
      border-top: 3px solid rgba(160,118,26,.3);
    }

    .faq-grid {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 20px;
      max-width: 1100px;
      margin: 0 auto;
    }

    .faq-item {
      background: linear-gradient(135deg, var(--chalkboard) 0%, var(--chalkboard2) 100%);
      border: 2px solid var(--border-gold);
      border-radius: 12px;
      overflow: hidden;
    }

    .faq-question {
      width: 100%;
      padding: 20px 24px;
      font-family: 'Playfair Display', serif;
      font-size: 15px;
      color: var(--gold-light);
      background: transparent;
      border: none;
      cursor: pointer;
      text-align: left;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 14px;
      transition: background .2s;
    }

    .faq-question:hover { background: rgba(160,118,26,.08); }

    .faq-icon {
      font-size: 20px;
      color: var(--gold);
      flex-shrink: 0;
      transition: transform .3s;
      font-style: normal;
    }

    .faq-item.open .faq-icon { transform: rotate(45deg); }

    .faq-answer {
      max-height: 0;
      overflow: hidden;
      transition: max-height .35s ease, padding .35s ease;
      padding: 0 24px;
    }

    .faq-item.open .faq-answer {
      max-height: 300px;
      padding: 0 24px 20px;
    }

    .faq-answer p {
      font-size: 13.5px;
      line-height: 1.8;
      color: var(--chalk-dim);
      font-style: italic;
      border-top: 1px dashed rgba(160,118,26,.25);
      padding-top: 14px;
    }

    /* ────────────────────────────────────────────────── */
    /*  CONTACT                                           */
    /* ────────────────────────────────────────────────── */
    .contact {
      padding: 70px 60px;
      text-align: center;
      background: linear-gradient(180deg, rgba(20,8,2,.75) 0%, rgba(10,3,0,.9) 100%);
      border-top: 3px solid rgba(160,118,26,.35);
    }

    .contact-subtitle {
      font-family: 'Lora', serif;
      font-style: italic;
      font-size: 18px;
      color: var(--chalk-dim);
      margin-bottom: 36px;
    }

    .contact-form {
      max-width: 600px;
      margin: 0 auto;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }

    .hp-field { display: none !important; }

    .contact-form input,
    .contact-form textarea,
    .contact-form select {
      background: rgba(30,15,5,.8);
      border: 2px solid rgba(160,118,26,.4);
      border-radius: 8px;
      padding: 14px 18px;
      font-family: 'Lora', serif;
      font-size: 14px;
      color: var(--chalk);
      outline: none;
      transition: border-color .2s;
      resize: vertical;
      width: 100%;
    }

    .contact-form select option { background: #1a0800; }

    .contact-form input:focus,
    .contact-form textarea:focus,
    .contact-form select:focus {
      border-color: var(--gold);
      background: rgba(40,18,6,.9);
    }

    .contact-form input::placeholder,
    .contact-form textarea::placeholder {
      color: var(--chalk-dim);
      opacity: .6;
      font-style: italic;
    }

    .contact-form textarea { min-height: 130px; }

    .form-error {
      color: #e07070;
      font-size: 12px;
      font-style: italic;
      text-align: left;
      margin-top: -8px;
      display: none;
    }

    .form-success {
      margin-top: 24px;
      color: var(--gold-light);
      font-style: italic;
      padding: 16px 24px;
      background: rgba(200,150,0,.1);
      border: 1px solid rgba(200,150,0,.3);
      border-radius: 8px;
      display: inline-block;
    }

    /* ────────────────────────────────────────────────── */
    /*  FOOTER                                            */
    /* ────────────────────────────────────────────────── */
    .footer-main {
      background: rgba(5,1,0,.98);
      border-top: 2px solid rgba(160,118,26,.25);
      padding: 50px 60px 30px;
    }

    .footer-grid {
      display: grid;
      grid-template-columns: 2fr 1fr 1fr 1fr;
      gap: 40px;
      max-width: 1100px;
      margin: 0 auto 40px;
    }

    .footer-brand .footer-logo {
      font-family: 'Playfair Display', serif;
      font-size: 22px;
      color: var(--gold-light);
      margin-bottom: 12px;
    }

    .footer-brand p {
      font-size: 13px;
      color: var(--chalk-dim);
      font-style: italic;
      line-height: 1.7;
      margin-bottom: 16px;
    }

    .footer-col h4 {
      font-family: 'Playfair Display', serif;
      font-size: 14px;
      color: var(--gold);
      margin-bottom: 14px;
      letter-spacing: 1px;
    }

    .footer-col ul { list-style: none; }

    .footer-col ul li { margin-bottom: 8px; }

    .footer-col ul li a {
      font-size: 13px;
      color: var(--chalk-dim);
      text-decoration: none;
      font-style: italic;
      transition: color .2s;
    }

    .footer-col ul li a:hover { color: var(--gold-light); }

    .footer-bottom {
      border-top: 1px solid rgba(160,118,26,.15);
      padding-top: 20px;
      display: flex;
      justify-content: space-between;
      align-items: center;
      max-width: 1100px;
      margin: 0 auto;
      flex-wrap: wrap;
      gap: 12px;
    }

    .footer-bottom p {
      font-size: 12px;
      color: rgba(200,184,154,.35);
      font-style: italic;
    }

    .footer-legal { display: flex; gap: 20px; }

    .footer-legal a {
      font-size: 12px;
      color: rgba(200,184,154,.35);
      text-decoration: none;
      font-style: italic;
      transition: color .2s;
    }

    .footer-legal a:hover { color: var(--chalk-dim); }

    /* ────────────────────────────────────────────────── */
    /*  BACK TO TOP                                       */
    /* ────────────────────────────────────────────────── */
    #back-to-top {
      position: fixed;
      bottom: 32px; right: 32px;
      width: 46px; height: 46px;
      background: linear-gradient(135deg, var(--gold), #b07820);
      border: 2px solid var(--gold-light);
      border-radius: 50%;
      color: var(--wood);
      font-size: 20px;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 4px 16px rgba(0,0,0,.5);
      opacity: 0;
      transform: translateY(20px);
      transition: opacity .3s, transform .3s;
      z-index: 300;
      text-decoration: none;
    }

    #back-to-top.visible { opacity: 1; transform: translateY(0); }
    #back-to-top:hover { background: linear-gradient(135deg, var(--gold-light), var(--gold)); transform: translateY(-3px); }

    /* ────────────────────────────────────────────────── */
    /*  FADE-IN                                           */
    /* ────────────────────────────────────────────────── */
    .fade-in {
      opacity: 0;
      transform: translateY(28px);
      transition: opacity .6s ease, transform .6s ease;
    }

    .fade-in.visible { opacity: 1; transform: translateY(0); }
    .fade-in-delay-1 { transition-delay: .1s; }
    .fade-in-delay-2 { transition-delay: .2s; }
    .fade-in-delay-3 { transition-delay: .3s; }

    /* ════════════════════════════════════════════════════
       RESPONSIVE — TABLETTE (max 1024px)
    ════════════════════════════════════════════════════ */
    @media (max-width: 1024px) {
      .footer-grid { grid-template-columns: 1fr 1fr; }
      .stats-grid  { grid-template-columns: repeat(2, 1fr); }
    }

    /* ════════════════════════════════════════════════════
       RESPONSIVE — MOBILE (max 768px)
    ════════════════════════════════════════════════════ */
    @media (max-width: 768px) {

      /* Header image → masqué, remplacé par la bande mobile */
      .top-header {
        aspect-ratio: unset;
        height: auto;
        background-image: none;
      }

      .top-header .logo,
      .top-header .header-nav,
      .top-header .festoon { display: none; }

      /* Afficher mobile header */
      .mobile-header-bar { display: flex; }
      .burger-btn        { display: flex; }
      .mobile-festoon    { display: flex; }
      .mobile-menu       { display: block; }

      /* Hero */
      .hero { flex-direction: column; padding: 36px 20px 40px; min-height: unset; }
      .hero-title         { padding-left: 0; font-size: clamp(32px, 8vw, 52px); }
      .hero-title span    { font-size: clamp(36px, 9vw, 58px); }
      .hero-sub           { padding-left: 0; font-size: clamp(14px, 4vw, 20px); }
      .hero-buttons       { padding-left: 0; flex-direction: column; align-items: flex-start; }
      .hero-server        { width: 75%; margin: 0 auto; }

      /* Stats */
      .stats              { padding: 36px 20px; }
      .stats-grid         { grid-template-columns: repeat(2, 1fr); gap: 16px; }
      .stat-number        { font-size: clamp(28px, 8vw, 44px); }

      /* Sections génériques */
      .services, .pricing, .about,
      .contact, .faq, .testimonials, .blog-section { padding: 48px 20px; }

      /* Onglets services */
      .services-tabs     { flex-direction: column; max-width: 100%; border-radius: 10px; }
      .tab-btn           { border-right: none; border-bottom: 1px solid var(--border-gold); padding: 12px 16px; font-size: 14px; }
      .tab-btn:last-child { border-bottom: none; }

      /* Grilles */
      .services-grid,
      .pricing-grid,
      .testimonials-grid,
      .blog-grid { grid-template-columns: 1fr; max-width: 100%; }

      /* About */
      .about-inner  { flex-direction: column; gap: 24px; }
      .about-server { width: 160px; }

      /* FAQ */
      .faq-grid     { grid-template-columns: 1fr; }
      .faq-question { font-size: 13px; padding: 16px 18px; }

      /* Footer */
      .footer-grid   { grid-template-columns: 1fr; gap: 28px; }
      .footer-main   { padding: 36px 20px 20px; }
      .footer-bottom { flex-direction: column; text-align: center; gap: 8px; }

      /* Sticky nav */
      .sticky-nav      { padding: 10px 16px; }
      .sticky-nav ul   { display: none; }
      .sticky-nav .btn-sticky { font-size: 11px; padding: 7px 14px; }

      /* Réassurance */
      .services-reassurance { gap: 16px; flex-direction: column; align-items: center; }

      /* Back to top */
      #back-to-top { bottom: 16px; right: 16px; width: 40px; height: 40px; font-size: 17px; }
    }

    /* ════════════════════════════════════════════════════
       RESPONSIVE — TRÈS PETIT (max 480px)
    ════════════════════════════════════════════════════ */
    @media (max-width: 480px) {
      .btn { font-size: 12px; padding: 10px 18px; letter-spacing: 1px; }
      .section-title { font-size: clamp(18px, 6vw, 28px); gap: 10px; }
      .section-title::before,
      .section-title::after { max-width: 40px; }
      .price-amount .big { font-size: 42px; }
      .about-box { padding: 32px 22px; }
      .about-box::before { font-size: 13px; }
    }
  
/* ===== V3 Chef Edition additions ===== */
.main-content{position:relative;z-index:1}.brand-kicker{font-family:'Caveat',cursive;color:var(--gold-light);font-size:clamp(24px,3vw,38px);margin-bottom:10px}.hero-proof{margin-top:22px;padding-left:20%;display:flex;gap:12px;flex-wrap:wrap}.proof-pill{border:1px solid rgba(200,150,42,.35);background:rgba(0,0,0,.28);border-radius:999px;padding:8px 13px;font-size:12px;color:var(--chalk-dim)}.chef-strip{background:linear-gradient(135deg,rgba(12,5,1,.98),rgba(32,12,3,.96));border-top:3px solid var(--border-gold);border-bottom:3px solid var(--border-gold);padding:46px 60px}.chef-strip-inner{max-width:1100px;margin:auto;display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}.chef-quote{font-size:20px;line-height:1.8;color:var(--chalk);font-style:italic}.chef-quote strong{color:var(--gold-light)}.chef-card{background:linear-gradient(135deg,var(--chalkboard),var(--chalkboard2));border:2px solid var(--border-gold);border-radius:16px;padding:24px;box-shadow:0 8px 30px rgba(0,0,0,.45)}.chef-card h3{font-family:'Playfair Display';color:var(--gold-light);margin-bottom:12px}.chef-card p{color:var(--chalk-dim);line-height:1.8;font-size:14px}.price-card .ideal{font-size:12px;color:var(--gold-light);margin:0 0 16px;font-style:italic}.menu-courses{list-style:none;margin:16px 0 24px}.menu-courses li{padding:10px 0;border-bottom:1px dashed rgba(160,118,26,.25);font-size:13px;line-height:1.55;color:var(--chalk-dim)}.menu-courses strong{color:var(--chalk);font-style:normal}.chef-tip{background:rgba(200,150,42,.1);border:1px solid rgba(200,150,42,.28);border-radius:10px;padding:14px;margin:16px 0;color:var(--chalk-dim);font-size:13px;line-height:1.7}.seo-section{padding:75px 60px;background:linear-gradient(180deg,rgba(15,6,2,.96),rgba(26,11,4,.96));border-top:3px solid rgba(160,118,26,.3)}.seo-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;max-width:1100px;margin:0 auto}.seo-card{background:linear-gradient(135deg,var(--chalkboard),var(--chalkboard2));border:2px solid var(--border-gold);border-radius:14px;padding:26px;box-shadow:0 6px 25px rgba(0,0,0,.45)}.seo-card h3{font-family:'Playfair Display';color:var(--gold-light);font-size:18px;margin-bottom:12px}.seo-card p,.seo-card li{color:var(--chalk-dim);line-height:1.8;font-size:13.5px}.seo-card ul{margin-left:18px}.resource-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px;max-width:1100px;margin:0 auto}.resource-card{background:linear-gradient(135deg,rgba(30,40,32,.96),rgba(18,26,20,.96));border:2px solid var(--border-gold);border-radius:16px;padding:26px;box-shadow:0 8px 28px rgba(0,0,0,.5);display:flex;flex-direction:column}.resource-card .tag{display:inline-block;width:max-content;font-size:10px;letter-spacing:1px;text-transform:uppercase;color:var(--wood);background:var(--gold);padding:4px 9px;border-radius:999px;font-weight:700;margin-bottom:13px}.resource-card h3{font-family:'Playfair Display';font-size:19px;color:var(--gold-light);margin-bottom:12px}.resource-card p{color:var(--chalk-dim);font-size:13.5px;line-height:1.8;flex:1}.resource-meta{display:flex;gap:10px;flex-wrap:wrap;margin:14px 0;color:rgba(200,184,154,.7);font-size:12px}.page-hero{padding:90px 60px 70px;background-image:linear-gradient(rgba(0,0,0,.55),rgba(0,0,0,.55)),url('../../images/brick-hero.jpg');background-size:cover;background-position:center;border-bottom:3px solid var(--border-gold)}.page-hero-inner{max-width:1100px;margin:auto}.page-hero h1{font-family:'Playfair Display';font-size:clamp(34px,5vw,58px);color:var(--chalk);line-height:1.15;margin-bottom:18px}.page-hero p{font-size:18px;line-height:1.8;color:var(--chalk-dim);max-width:850px}.article-wrap{max-width:980px;margin:0 auto;padding:70px 20px}.article-content{background:linear-gradient(135deg,var(--chalkboard),var(--chalkboard2));border:2px solid var(--border-gold);border-radius:18px;padding:clamp(24px,4vw,48px);box-shadow:0 10px 35px rgba(0,0,0,.55)}.article-content h2{font-family:'Playfair Display';color:var(--gold-light);font-size:28px;margin:34px 0 14px}.article-content h3{color:var(--chalk);font-size:19px;margin:24px 0 10px}.article-content p,.article-content li{color:var(--chalk-dim);line-height:1.9;font-size:15px}.article-content ul,.article-content ol{margin-left:22px;margin-bottom:18px}.article-content a{color:var(--gold-light)}.toc{background:rgba(0,0,0,.25);border:1px solid rgba(160,118,26,.3);border-radius:12px;padding:18px;margin:22px 0}.toc strong{color:var(--gold-light)}.tip-box{border-left:4px solid var(--gold);background:rgba(200,150,42,.1);padding:18px;border-radius:8px;margin:22px 0}.warn-box{border-left:4px solid #d86b55;background:rgba(216,107,85,.1);padding:18px;border-radius:8px;margin:22px 0}.article-table{width:100%;border-collapse:collapse;margin:22px 0;color:var(--chalk-dim);font-size:14px}.article-table th,.article-table td{border:1px solid rgba(160,118,26,.3);padding:12px;text-align:left}.article-table th{color:var(--gold-light);background:rgba(0,0,0,.22)}.tool-card label{display:block;color:var(--chalk-dim);font-size:13px;margin:12px 0 6px}.tool-card input,.tool-card select,.tool-card textarea{width:100%;background:rgba(0,0,0,.28);border:1px solid rgba(160,118,26,.45);border-radius:8px;color:var(--chalk);padding:12px;font-family:inherit}.tool-result{white-space:pre-wrap;background:rgba(0,0,0,.32);border:1px dashed rgba(160,118,26,.4);border-radius:10px;padding:14px;margin-top:14px;color:var(--chalk-dim);font-size:13px;min-height:46px}.breadcrumb{max-width:1100px;margin:0 auto 18px;color:rgba(200,184,154,.65);font-size:13px}.breadcrumb a{color:var(--gold-light);text-decoration:none}.footer-main .footer-grid{grid-template-columns:1.5fr 1fr 1fr 1fr 1fr}.skip-link{position:absolute;left:-999px;top:auto;width:1px;height:1px;overflow:hidden}.skip-link:focus{left:12px;top:12px;width:auto;height:auto;background:var(--gold);color:var(--wood);z-index:9999;padding:10px;border-radius:8px}.notice{background:rgba(200,150,42,.12);border:1px solid rgba(200,150,42,.3);padding:16px;border-radius:10px;color:var(--chalk-dim);line-height:1.7}code{background:rgba(0,0,0,.25);padding:2px 6px;border-radius:5px;color:var(--gold-light)}@media(max-width:900px){.chef-strip-inner,.seo-grid,.resource-grid{grid-template-columns:1fr}.footer-main .footer-grid{grid-template-columns:1fr 1fr}.hero-proof{padding-left:0}.page-hero,.seo-section,.chef-strip{padding-left:20px;padding-right:20px}}@media(max-width:600px){.footer-main .footer-grid{grid-template-columns:1fr}.resource-card,.seo-card{padding:22px}.article-content{padding:22px}}

/* V3.1 - Ustensiles / Toolbox */
.tools-highlight { position: relative; }
.featured-tool { border-color: var(--gold-light) !important; box-shadow: 0 0 30px rgba(200,150,42,.18), 0 10px 34px rgba(0,0,0,.45); }
.tool-hero .page-hero-inner { max-width: 980px; }
.tool-layout { display: grid; grid-template-columns: minmax(0, 2fr) minmax(280px, .8fr); gap: 28px; max-width: 1180px; margin: 0 auto; }
.tool-card-wide { min-width: 0; }
.tool-form { display: grid; gap: 12px; margin: 16px 0; }
.tool-form input, .tool-card input, .tool-card select, .tool-card textarea {
  width: 100%; background: rgba(30,15,5,.8); border: 2px solid rgba(160,118,26,.45); border-radius: 8px;
  padding: 12px 14px; color: var(--chalk); font-family: 'Lora', Georgia, serif; outline: none;
}
.tool-form input:focus, .tool-card input:focus { border-color: var(--gold-light); }
.tool-result, .mini-result, .tool-result-block { margin-top: 14px; }
.tool-result, .mini-result { background: rgba(5,2,0,.55); border: 1px solid rgba(160,118,26,.35); border-radius: 8px; padding: 12px; color: var(--chalk-dim); overflow-x: auto; }
.tool-result code, .mini-result code { color: var(--gold-light); font-size: 13px; word-break: break-all; }
.tool-alert { color: #ffb0a0; background: rgba(160,20,20,.15); border: 1px solid rgba(255,120,90,.35); padding: 10px 12px; border-radius: 8px; }
.tool-checks { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; margin: 18px 0; }
.tool-check { border: 1px solid rgba(160,118,26,.25); border-radius: 10px; padding: 12px; background: rgba(5,2,0,.35); }
.tool-check strong { display: block; margin-bottom: 6px; color: var(--chalk); }
.tool-check span { font-size: 12.5px; color: var(--chalk-dim); line-height: 1.5; }
.tool-check.ok { border-color: rgba(80,180,100,.45); }
.tool-check.ok strong { color: #8be09c; }
.tool-check.warn { border-color: rgba(232,184,75,.45); }
.tool-check.warn strong { color: var(--gold-light); }
.dns-records details { background: rgba(5,2,0,.4); border: 1px solid rgba(160,118,26,.25); border-radius: 8px; margin: 10px 0; padding: 10px 12px; }
.dns-records summary { cursor: pointer; color: var(--gold-light); font-weight: 700; }
.dns-records pre, .mini-result pre { white-space: pre-wrap; word-break: break-word; color: var(--chalk-dim); font-size: 12px; line-height: 1.5; max-height: 360px; overflow: auto; }
.chef-tip { margin-top: 16px; padding: 14px 16px; border-left: 4px solid var(--gold); background: rgba(200,150,42,.12); border-radius: 8px; color: var(--chalk-dim); line-height: 1.7; }
.tools-armada .seo-card { min-height: 210px; }
@media (max-width: 900px) { .tool-layout { grid-template-columns: 1fr; } .tool-checks { grid-template-columns: 1fr; } }

/* V3.2 - Outils lisibles + AJAX */
.tool-inline-form{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:end}.tool-live-result{margin-top:18px}.tool-live-result.compact{min-height:20px}.empty-state{border:1px dashed rgba(160,118,26,.35);background:rgba(5,2,0,.35);border-radius:12px;padding:18px;color:var(--chalk-dim);font-style:italic}.tool-loading{border:1px solid rgba(200,150,42,.35);background:rgba(200,150,42,.09);border-radius:12px;padding:14px;color:var(--gold-light)}.tool-error{border:1px solid rgba(220,90,70,.45);background:rgba(160,20,20,.16);border-radius:12px;padding:14px;color:#ffb0a0}.dns-summary-card{display:flex;justify-content:space-between;gap:18px;align-items:center;background:linear-gradient(135deg,rgba(5,2,0,.5),rgba(30,15,5,.6));border:1px solid rgba(160,118,26,.35);border-radius:16px;padding:18px;margin:16px 0}.dns-score{width:92px;height:92px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-direction:column;border:3px solid var(--gold);box-shadow:0 0 24px rgba(200,150,42,.16);color:var(--gold-light);font-family:'Playfair Display',serif}.dns-score strong{font-size:28px;line-height:1}.dns-score span{font-size:11px;color:var(--chalk-dim)}.tool-checks.pretty{grid-template-columns:repeat(3,minmax(0,1fr))}.tool-check.info{border-color:rgba(120,160,220,.35)}.tool-check.info strong{color:#9dc2ff}.tool-check.bad{border-color:rgba(230,80,70,.55)}.tool-check.bad strong{color:#ff988c}.dns-record-section{margin:16px 0;background:rgba(5,2,0,.35);border:1px solid rgba(160,118,26,.25);border-radius:14px;overflow:hidden}.dns-record-title{display:flex;justify-content:space-between;gap:12px;align-items:center;padding:13px 16px;background:rgba(0,0,0,.22);color:var(--gold-light);font-weight:700}.dns-badge{font-size:11px;background:rgba(200,150,42,.16);border:1px solid rgba(200,150,42,.35);border-radius:999px;padding:3px 8px;color:var(--chalk-dim)}.dns-table{width:100%;border-collapse:collapse;font-size:13px;color:var(--chalk-dim)}.dns-table th,.dns-table td{border-top:1px solid rgba(160,118,26,.18);padding:10px 12px;text-align:left;vertical-align:top}.dns-table th{color:var(--chalk);font-weight:700;background:rgba(0,0,0,.12)}.dns-table td.long{word-break:break-word;max-width:560px}.mini-kpi{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:12px}.mini-kpi div{background:rgba(5,2,0,.38);border:1px solid rgba(160,118,26,.25);border-radius:10px;padding:10px}.mini-kpi strong{display:block;color:var(--gold-light);margin-bottom:4px}.headers-list{display:grid;gap:8px;margin-top:12px}.header-row{border:1px solid rgba(160,118,26,.25);background:rgba(5,2,0,.35);border-radius:10px;padding:10px}.header-row.ok strong{color:#8be09c}.header-row.miss strong{color:var(--gold-light)}.copy-row{display:flex;gap:8px;align-items:center}.copy-row code{flex:1;word-break:break-all;display:block;padding:10px}.small-action{font-size:12px;padding:8px 10px;border-radius:8px;border:1px solid var(--gold);background:rgba(200,150,42,.15);color:var(--gold-light);cursor:pointer}@media(max-width:900px){.tool-inline-form{grid-template-columns:1fr}.tool-checks.pretty{grid-template-columns:1fr}.dns-summary-card{flex-direction:column;align-items:flex-start}.mini-kpi{grid-template-columns:1fr}.dns-table{font-size:12px}}

/* === Hubs SEO Au P'tit Serveur === */
.hub-hero{padding:70px 60px;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.72)),url('../../images/brick-hero.png') center/cover;border-bottom:3px solid var(--border-gold);text-align:center}.hub-hero .eyebrow{color:var(--gold-light);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.hub-hero h1{font-family:'Playfair Display',serif;font-size:clamp(32px,5vw,64px);line-height:1.08;margin:12px auto;max-width:1100px}.hub-hero p{max-width:900px;margin:0 auto;color:var(--chalk-dim);font-size:18px;line-height:1.8}.hub-section{padding:60px;position:relative}.hub-container{max-width:1180px;margin:0 auto}.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}.hub-card{background:linear-gradient(135deg,rgba(20,28,22,.95),rgba(26,36,28,.95));border:2px solid var(--border-gold);border-radius:16px;padding:26px;box-shadow:0 8px 30px rgba(0,0,0,.45)}.hub-card h2,.hub-card h3{font-family:'Playfair Display',serif;color:var(--gold-light);margin:0 0 12px}.hub-card p,.hub-card li{color:var(--chalk-dim);font-size:14px;line-height:1.75}.hub-card a{color:var(--gold-light);font-weight:700}.hub-list{list-style:none;margin:0;padding:0}.hub-list li{padding:8px 0;border-bottom:1px dashed rgba(160,118,26,.25)}.hub-cta{margin-top:32px;text-align:center}.hub-cta a{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--gold-light));color:var(--wood);padding:13px 24px;border-radius:8px;text-decoration:none;font-weight:700}.hub-pill{display:inline-block;margin:5px 6px 5px 0;padding:8px 12px;border:1px solid rgba(201,150,42,.55);border-radius:999px;color:var(--gold-light);text-decoration:none;background:rgba(0,0,0,.18)}@media(max-width:768px){.hub-hero,.hub-section{padding:42px 20px}}

/* === Patch Hubs + Ustensiles index + Header mobile === */
.mobile-header-bar{position:sticky;top:0;z-index:40;background:rgba(12,4,1,.96);border-bottom:2px solid var(--border-gold);box-shadow:0 10px 30px rgba(0,0,0,.35)}
.mobile-logo{color:var(--gold-light);text-decoration:none;font-weight:800;line-height:1.1}.mobile-logo small{display:block;color:var(--chalk-dim);font-size:11px;font-weight:400}.burger-btn{border:1px solid rgba(232,184,75,.65);background:rgba(0,0,0,.2);border-radius:10px;padding:9px}.burger-btn span{background:var(--gold-light)}
.mobile-menu{max-height:0;overflow:hidden;transition:max-height .28s ease;background:rgba(12,4,1,.98);border-bottom:2px solid var(--border-gold)}.mobile-menu.open{max-height:80vh;overflow:auto}.mobile-menu ul{list-style:none;margin:0;padding:10px}.mobile-menu a{display:block;padding:13px 14px;border-radius:10px;color:var(--chalk);text-decoration:none;border:1px solid rgba(160,118,26,.22);margin:6px 0;background:rgba(255,255,255,.025)}.mobile-menu a:hover{background:rgba(232,184,75,.12);color:var(--gold-light)}
@media(max-width:980px){.sticky-nav{display:none!important}.header-nav ul{flex-wrap:wrap}.top-header{min-height:auto}.top-header .logo img{max-width:320px;height:auto}.header-nav{display:none}.festoon{display:none}.mobile-header-bar{display:flex!important}.mobile-menu{display:block!important}}

.hub-hero{padding:70px 60px;background:linear-gradient(180deg,rgba(0,0,0,.35),rgba(0,0,0,.72)),url('../../images/brick-hero.png') center/cover;border-bottom:3px solid var(--border-gold);text-align:center}.hub-hero .eyebrow{color:var(--gold-light);font-weight:700;letter-spacing:.08em;text-transform:uppercase}.hub-hero h1{font-family:'Playfair Display',serif;font-size:clamp(32px,5vw,64px);line-height:1.08;margin:12px auto;max-width:1100px}.hub-hero p{max-width:900px;margin:0 auto;color:var(--chalk-dim);font-size:18px;line-height:1.8}.hub-section{padding:60px;position:relative}.hub-container{max-width:1180px;margin:0 auto}.hub-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px}.hub-card{background:linear-gradient(135deg,rgba(20,28,22,.95),rgba(26,36,28,.95));border:2px solid var(--border-gold);border-radius:16px;padding:26px;box-shadow:0 8px 30px rgba(0,0,0,.45)}.hub-card h2,.hub-card h3{font-family:'Playfair Display',serif;color:var(--gold-light);margin:0 0 12px}.hub-card p,.hub-card li{color:var(--chalk-dim);font-size:14px;line-height:1.75}.hub-card a{color:var(--gold-light);font-weight:700;text-decoration:none}.hub-card a:hover{text-decoration:underline}.hub-list{list-style:none;margin:0;padding:0}.hub-list li{padding:10px 0;border-bottom:1px dashed rgba(160,118,26,.25)}.hub-list span{color:var(--chalk-dim);font-size:13px}.hub-cta{margin-top:32px;text-align:center}.hub-cta a{display:inline-block;background:linear-gradient(135deg,var(--gold),var(--gold-light));color:var(--wood);padding:13px 24px;border-radius:8px;text-decoration:none;font-weight:700}.hub-pill{display:inline-block;margin:5px 6px 5px 0;padding:8px 12px;border:1px solid rgba(201,150,42,.55);border-radius:999px;color:var(--gold-light);text-decoration:none;background:rgba(0,0,0,.18)}
.toolbox-search{margin:0 0 28px}.toolbox-search input{width:100%;padding:16px 18px;border-radius:14px;border:2px solid rgba(160,118,26,.55);background:rgba(5,2,0,.58);color:var(--chalk);font-family:'Lora',Georgia,serif;font-size:16px}.toolbox-search input:focus{outline:none;border-color:var(--gold-light);box-shadow:0 0 0 4px rgba(232,184,75,.12)}.tools-directory .hub-card{min-height:100%}.tool-directory-item a{font-size:16px}.tool-directory-item span{display:block;margin-top:2px;color:var(--chalk-dim)}
@media(max-width:768px){.hub-hero,.hub-section{padding:42px 20px}.hub-cta a{display:block;margin:10px auto!important}.hub-card{padding:22px}.toolbox-search input{font-size:15px}}

/* === Ustensiles V5 : landing page unifiee avec le header commun === */
.aps-tools-hero{padding:clamp(48px,8vw,92px) 20px;background:linear-gradient(180deg,rgba(20,7,2,.86),rgba(43,13,3,.92)),url('../../images/mur.png') center/cover;border-top:1px solid rgba(232,184,75,.22);border-bottom:2px solid rgba(160,118,26,.45);text-align:center}.tools-inner{width:min(1240px,94vw);margin:0 auto}.tools-kicker{font-family:'Caveat',cursive;color:var(--gold-light,#e8b84b);font-size:clamp(28px,4vw,46px);margin-bottom:10px}.aps-tools-hero h1{font-family:'Playfair Display',serif;font-size:clamp(34px,6vw,72px);line-height:1.04;color:var(--chalk,#f0e8d0);max-width:1050px;margin:0 auto 18px}.aps-tools-hero p{max-width:920px;margin:0 auto 24px;color:#e2d2b5;line-height:1.8;font-size:clamp(15px,1.4vw,18px)}.tools-search{display:flex;align-items:center;gap:14px;max-width:820px;margin:26px auto 20px;border:2px solid rgba(232,184,75,.58);border-radius:18px;background:rgba(9,3,1,.62);padding:14px 18px;box-shadow:0 18px 50px rgba(0,0,0,.25)}.tools-search span{font-size:24px}.tools-search input{flex:1;border:0;background:transparent;color:#fff8df;font:600 16px 'Lora',serif;outline:0}.tools-search input::placeholder{color:#c8b89a}.tools-stats,.tools-pills{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.tools-stats span,.tools-pills a{border:1px solid rgba(232,184,75,.4);background:rgba(30,40,32,.78);border-radius:999px;padding:9px 14px;color:#e8d5a9;text-decoration:none;font-size:14px}.tools-stats strong{color:#f3c654}.tools-pills{margin-top:20px}.tools-pills a.active,.tools-pills a:hover{background:linear-gradient(135deg,#c9962a,#e8b84b);color:#2a1206}.tools-pills small{opacity:.75;margin-left:4px}.aps-tools-section{padding:48px 20px;background:linear-gradient(180deg,rgba(13,4,1,.96),rgba(33,11,3,.96))}.aps-tools-section:nth-of-type(even){background:linear-gradient(180deg,rgba(33,11,3,.96),rgba(13,4,1,.96))}.section-title{text-align:center;margin-bottom:28px}.section-title span{color:#e8b84b;text-transform:uppercase;letter-spacing:.16em;font-size:12px;font-weight:800}.section-title h2{font-family:'Playfair Display',serif;color:#fff5dc;font-size:clamp(28px,4vw,44px);margin:8px 0 0}.featured-grid,.tools-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}.cat-block{margin:42px 0}.category-head{display:flex;justify-content:space-between;align-items:flex-end;gap:18px;margin-bottom:18px;border-bottom:1px solid rgba(232,184,75,.25);padding-bottom:16px}.category-head h2{font-family:'Playfair Display',serif;color:#e8b84b;font-size:32px;margin:0}.category-head small{font-size:14px;color:#d8c7a5}.category-head p{margin:8px 0 0;color:#d8c7a5}.top-link{color:#e8b84b;text-decoration:none}.aps-tool-card{background:linear-gradient(155deg,rgba(30,40,32,.96),rgba(20,28,22,.96));border:2px solid rgba(160,118,26,.82);border-radius:18px;padding:20px;box-shadow:0 12px 34px rgba(0,0,0,.38);transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease}.aps-tool-card:hover{transform:translateY(-3px);border-color:#e8b84b;box-shadow:0 18px 42px rgba(0,0,0,.48)}.tool-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.tool-icon{font-size:28px}.badge{display:inline-flex;align-items:center;border-radius:999px;padding:5px 9px;font-size:12px;font-weight:900}.badge.active{background:rgba(143,214,148,.16);color:#9df0a5}.badge.soon{background:rgba(255,211,106,.14);color:#ffd36a}.aps-tool-card h3{font-family:'Playfair Display',serif;color:#fff5dc;font-size:21px;margin:0 0 8px}.aps-tool-card p{color:#d8c7a5;line-height:1.65;margin:0 0 16px}.tool-link{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:linear-gradient(135deg,#c9962a,#e8b84b);color:#251002;text-decoration:none;font-weight:900;padding:10px 14px}.tool-link[href="#"]{background:rgba(255,255,255,.08);color:#d8c7a5;cursor:not-allowed}.tool-empty{border:2px dashed rgba(232,184,75,.35);border-radius:14px;padding:18px;text-align:center;color:#f2dfb4;background:rgba(30,40,32,.5)}.tools-final{border-top:2px solid rgba(160,118,26,.45)}@media(max-width:1050px){.featured-grid,.tools-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:720px){.featured-grid,.tools-grid{grid-template-columns:1fr}.category-head{display:block}.tools-search{align-items:flex-start}.aps-tools-hero h1{font-size:36px}}

/* Harmonisation page outils actifs dans le header commun */
.unified-toolbox{margin-top:0}.unified-toolbox .toolbox-hero{margin-top:0}.unified-toolbox .toolbox-nav{display:none}.unified-toolbox .toolbox-footer{margin-top:28px}.unified-toolbox .tool-card small{display:block;color:#c8b89a;font-size:12px;line-height:1.35;margin:3px 0 7px}.unified-toolbox .tool-card label{display:block}.unified-toolbox .tool-card label input{margin-top:6px}.unified-toolbox .toolbox-hero .toolbox-kicker{font-family:'Caveat',cursive;font-size:30px;color:#e8b84b}.unified-toolbox .toolbox-hero h1{font-family:'Playfair Display',serif;color:#fff5dc}.unified-toolbox .toolbox-sidebar{top:120px}

/* === Ustensiles du Chef V5 - page unifiée === */
.tools-hero-v5{padding:58px 22px 34px;background:linear-gradient(180deg,rgba(10,4,1,.88),rgba(45,12,2,.78)),url('../../images/mur.png') center/cover;border-top:2px solid rgba(201,150,42,.35);border-bottom:2px solid rgba(201,150,42,.35)}
.tools-hero-card{max-width:1120px;margin:0 auto;text-align:center;background:linear-gradient(135deg,rgba(30,40,32,.82),rgba(20,28,22,.72));border:2px solid var(--border-gold);border-radius:24px;padding:36px 28px;box-shadow:0 18px 60px rgba(0,0,0,.42)}
.tools-hero-card .kicker{font-family:'Caveat',cursive;color:var(--gold-light);font-size:32px;margin:0 0 8px}.tools-hero-card h1{font-family:'Playfair Display',serif;color:var(--chalk);font-size:clamp(34px,5vw,64px);line-height:1.05;margin:0 auto 18px;max-width:980px}.tools-hero-card>p{color:var(--chalk-dim);font-size:18px;line-height:1.8;max-width:880px;margin:0 auto 24px}.tool-search-wrap{max-width:780px;margin:24px auto 18px;display:flex;align-items:center;gap:12px;border:2px solid var(--border-gold);border-radius:16px;background:rgba(10,4,1,.55);padding:12px 16px}.tool-search-wrap input{flex:1;background:transparent;border:0;color:var(--chalk);font-size:16px;outline:0;font-family:inherit}.tool-search-wrap input::placeholder{color:rgba(240,232,208,.65)}.tools-stats{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.tools-stats span{border:1px solid rgba(232,184,75,.35);background:rgba(0,0,0,.25);color:var(--gold-light);border-radius:999px;padding:7px 12px;font-size:13px}.tools-v5-layout{max-width:1480px;margin:0 auto;padding:34px 20px;display:grid;grid-template-columns:260px 1fr;gap:26px}.tools-v5-sidebar{position:sticky;top:92px;align-self:start;background:linear-gradient(155deg,rgba(30,40,32,.96),rgba(20,28,22,.96));border:2px solid var(--border-gold);border-radius:18px;padding:18px;box-shadow:0 12px 38px rgba(0,0,0,.42)}.tools-v5-sidebar h2{font-family:'Playfair Display',serif;color:var(--gold-light);font-size:22px;margin:0 0 12px}.tool-cat-link{display:flex;align-items:center;justify-content:space-between;gap:8px;text-decoration:none;color:var(--chalk-dim);border:1px solid rgba(160,118,26,.28);border-radius:12px;padding:10px 12px;margin:7px 0;background:rgba(90,31,15,.24);transition:.18s ease}.tool-cat-link:hover{color:var(--wood);background:linear-gradient(135deg,var(--gold),var(--gold-light));transform:translateX(3px)}.tool-cat-link span{font-size:12px;border-radius:999px;background:rgba(0,0,0,.24);padding:3px 7px}.tools-v5-content{min-width:0}.tools-highlight{background:linear-gradient(135deg,rgba(90,31,15,.58),rgba(20,28,22,.92));border:2px solid var(--border-gold);border-radius:20px;padding:24px;margin-bottom:28px}.tools-highlight h2,.tools-section-head h2{font-family:'Playfair Display',serif;color:var(--gold-light);margin:0}.tools-highlight p{color:var(--chalk-dim);line-height:1.7}.tools-quick-links{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.tools-quick-links a{color:var(--wood);background:var(--gold-light);text-decoration:none;border-radius:999px;padding:8px 13px;font-weight:800}.tools-section{margin-bottom:34px;scroll-margin-top:110px}.tools-section-head{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px;border-bottom:1px solid rgba(201,150,42,.35);padding-bottom:12px}.tools-section-head span{color:var(--chalk-dim);border:1px solid rgba(201,150,42,.35);border-radius:999px;padding:6px 10px;font-size:13px}.tool-grid-v5{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.tool-card{background:linear-gradient(155deg,rgba(30,40,32,.98),rgba(20,28,22,.98));border:2px solid rgba(160,118,26,.85);border-radius:18px;padding:20px;box-shadow:0 12px 34px rgba(0,0,0,.36);min-height:220px}.tool-card.is-planned{opacity:.78}.tool-card-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px}.tool-icon{font-size:24px}.tool-status{font-size:11px;text-transform:uppercase;letter-spacing:.08em;border-radius:999px;padding:5px 8px;font-weight:900}.tool-status.active{background:rgba(143,214,148,.16);color:#9be0a6;border:1px solid rgba(143,214,148,.4)}.tool-status.soon{background:rgba(255,211,106,.12);color:#ffd36a;border:1px solid rgba(255,211,106,.35)}.tool-card h3{font-family:'Playfair Display',serif;color:var(--gold-light);font-size:21px;margin:0 0 8px}.tool-card p{color:var(--chalk-dim);line-height:1.65;margin:0 0 14px}.tool-explain{border-left:4px solid var(--gold);background:rgba(201,150,42,.09);border-radius:10px;padding:10px 12px;margin:12px 0}.tool-explain strong{display:block;color:var(--gold-light);font-size:13px;margin-bottom:4px}.tool-explain span{color:var(--chalk-dim);font-size:13px;line-height:1.55}.tool-fields{display:grid;gap:10px;margin-top:12px}.field-help,.check-help{display:block;color:var(--chalk);font-size:14px}.field-help span,.check-help span{font-weight:700;color:var(--chalk)}.field-help small,.check-help small{display:block;color:var(--chalk-dim);font-size:12px;line-height:1.45;margin:3px 0 6px}.field-help input,.field-help textarea,.field-help select{width:100%;padding:11px 12px;border:1px solid rgba(232,184,75,.38);border-radius:10px;background:rgba(10,4,1,.58);color:var(--chalk);font-family:inherit}.field-help textarea{min-height:92px;resize:vertical}.check-help{display:flex;align-items:flex-start;gap:8px}.check-help input{margin-top:4px}.tool-run,.tool-card button,.copy-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;border-radius:10px;padding:11px 16px;background:linear-gradient(135deg,var(--gold),var(--gold-light));color:#2b1608!important;font-weight:900;cursor:pointer;font-family:inherit;text-decoration:none;margin-top:12px}.tool-run:hover,.copy-btn:hover{filter:brightness(1.06);transform:translateY(-1px)}.tool-soon{color:var(--chalk-dim);border:1px dashed rgba(232,184,75,.32);border-radius:12px;padding:10px;margin-top:12px;font-size:13px}.result{margin-top:14px}.tool-result-card{background:rgba(5,15,10,.48);border:1px solid rgba(232,184,75,.28);border-radius:14px;padding:16px;margin-top:12px;color:var(--chalk-dim)}.tool-result-card h4{color:var(--gold-light);font-family:'Playfair Display',serif;margin:0 0 10px}.copy-block pre{white-space:pre-wrap;word-break:break-word;background:rgba(0,0,0,.45);color:#fff3cd;border:1px solid rgba(232,184,75,.35);border-radius:12px;padding:14px;overflow:auto}.badge{display:inline-flex;align-items:center;justify-content:center;border-radius:999px;padding:4px 8px;font-size:12px;font-weight:800}.badge.ok{background:rgba(143,214,148,.16);color:#9be0a6}.badge.warn{background:rgba(255,211,106,.14);color:#ffd36a}.badge.bad{background:rgba(255,138,138,.14);color:#ff9b9b}.check-list{display:grid;gap:9px;margin-top:12px}.check-item{display:grid;grid-template-columns:110px 90px 1fr;gap:10px;align-items:start;padding:10px;border-radius:10px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.08)}.score-ring{display:inline-flex;align-items:center;justify-content:center;width:86px;height:86px;border-radius:50%;background:conic-gradient(var(--gold-light) calc(var(--score)*1%),rgba(255,255,255,.12) 0);color:#fff;font-family:'Playfair Display',serif;font-size:22px;font-weight:700;box-shadow:inset 0 0 0 9px rgba(20,28,22,.95);margin:8px 0}.recommendation{border-left:4px solid var(--gold);background:rgba(201,150,42,.10);padding:12px;border-radius:10px;margin-top:10px}.skip-link{position:absolute;left:-9999px}.skip-link:focus{left:12px;top:12px;z-index:9999;background:#fff;color:#000;padding:10px}@media(max-width:1100px){.tool-grid-v5{grid-template-columns:repeat(2,minmax(0,1fr))}.tools-v5-layout{grid-template-columns:1fr}.tools-v5-sidebar{position:relative;top:auto;display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.tools-v5-sidebar h2{grid-column:1/-1}.tool-cat-link{margin:0}}@media(max-width:700px){.tools-hero-v5{padding:32px 12px}.tools-hero-card{padding:24px 16px}.tool-grid-v5,.tools-v5-sidebar{grid-template-columns:1fr}.tools-section-head{display:block}.check-item{grid-template-columns:1fr}.tools-quick-links a{width:100%;text-align:center}}

/* SEO V2: titres de cartes non comptés comme headings + références externes */
.mini-tool-title{color:var(--gold-light);font-family:'Playfair Display',serif;margin-bottom:8px;font-size:1.15rem;font-weight:700;}
.external-references{margin:34px auto 0;max-width:920px;padding:20px 24px;border:1px solid rgba(160,118,26,.35);border-radius:14px;background:rgba(10,4,1,.28);text-align:center;}
.external-references p{color:var(--chalk-dim);line-height:1.7;margin:0;}
.external-references .references-title{font-family:'Playfair Display',serif;color:var(--gold-light);font-weight:700;margin-bottom:8px;}
.external-references a{color:var(--gold-light);font-weight:700;text-decoration:none;border-bottom:1px dashed rgba(240,196,92,.55);}
.external-references a:hover{color:#fff2b5;}
