/*
Theme Name: Max Informatique
Theme URI: https://maxinformatique.be
Author: Max Informatique
Description: Thème sur mesure pour Max Informatique — dépannage, contrat ZEN, formation. Basé sur l'ébauche 1a (éditorial chaleureux).
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.6
Requires PHP: 7.4
License: GNU General Public License v2 or later
Text Domain: maxinfo
*/

:root{
  --mi-ink:#23282f;
  --mi-ink-soft:#4a463f;
  --mi-muted:#6b675f;
  --mi-accent:#c26a10;
  --mi-paper:#fdfbf6;
  --mi-sand:#f2ede1;
  --mi-line:#e4dccb;
  --mi-line-soft:#ece6da;
  --mi-dark-field:#2e343d;
  --mi-dark-border:#3d444e;
  --mi-dark-text:#a8b0bb;
  --mi-serif:"Instrument Serif",Georgia,serif;
  --mi-sans:Karla,system-ui,-apple-system,sans-serif;
  --mi-mono-ui:"Space Grotesk",system-ui,sans-serif;
  --mi-max:1180px;
  --mi-pad:44px;
}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--mi-paper);color:var(--mi-ink);font-family:var(--mi-sans);font-size:17px;line-height:1.6}
img{max-width:100%;height:auto;display:block}
a{color:var(--mi-accent);text-decoration:none}
a:hover{opacity:.75}
h1,h2,h3{margin:0;font-weight:400;letter-spacing:-.02em;text-wrap:pretty}
p{margin:0;text-wrap:pretty}
button,input,select,textarea{font:inherit}
.mi-shell{max-width:var(--mi-max);margin:0 auto}
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.mi-skip:focus{position:fixed;top:8px;left:8px;z-index:99;background:#fff;padding:10px 16px}

.mi-header{border-bottom:1px solid var(--mi-line-soft);background:var(--mi-paper);position:sticky;top:0;z-index:40}
.mi-header__in{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:18px var(--mi-pad)}
.mi-logo img{height:84px;width:auto}
.mi-logo--text{font-family:var(--mi-serif);font-size:30px;color:var(--mi-ink)}
.mi-logo--text span{color:var(--mi-accent)}
.mi-nav ul{display:flex;gap:30px;list-style:none;margin:0;padding:0;font-size:16px}
.mi-nav a{color:var(--mi-ink-soft)}
.mi-nav .current-menu-item>a{color:var(--mi-accent)}
.mi-btn{display:inline-flex;align-items:center;gap:9px;border-radius:999px;font-weight:600;font-size:17px;padding:16px 28px;border:0;cursor:pointer;text-align:center}
.mi-btn--dark{background:var(--mi-ink);color:var(--mi-paper)}
.mi-btn--accent{background:var(--mi-accent);color:#fff}
.mi-btn--ghost{border:1.5px solid #cfc7b7;color:var(--mi-ink);background:transparent}
.mi-btn--sm{padding:11px 20px;font-size:15px}
.mi-burger{display:none;background:none;border:1px solid var(--mi-line);border-radius:8px;padding:10px 12px;cursor:pointer}

.mi-hero{display:grid;grid-template-columns:1.15fr .85fr;gap:56px;padding:76px var(--mi-pad) 68px;align-items:center}
.mi-hero__col{display:flex;flex-direction:column;gap:26px}
.mi-eyebrow{font-size:15px;color:var(--mi-accent);font-weight:600;letter-spacing:.04em}
.mi-hero h1{font-family:var(--mi-serif);font-size:clamp(38px,5vw,66px);line-height:1.02}
.mi-hero h1 em{color:var(--mi-accent)}
.mi-hero__lede{font-size:19px;color:var(--mi-ink-soft);max-width:46ch}
.mi-actions{display:flex;gap:14px;flex-wrap:wrap;padding-top:6px}
.mi-facts{display:flex;gap:28px;flex-wrap:wrap;padding-top:14px;font-size:15px;color:var(--mi-muted)}
.mi-hero__aside{display:flex;flex-direction:column;gap:18px}
.mi-hero__img{height:340px;width:100%;object-fit:cover;border-radius:10px;background:var(--mi-sand)}
.mi-quote{background:var(--mi-sand);border:1px solid var(--mi-line);padding:20px 22px;display:flex;flex-direction:column;gap:6px;margin:0}
.mi-quote__text{font-family:var(--mi-serif);font-size:22px;margin:0}
.mi-quote__by{font-size:15px;color:var(--mi-muted)}

.mi-remote{background:var(--mi-ink);color:#f6f1e7;padding:30px var(--mi-pad);display:flex;align-items:center;justify-content:space-between;gap:40px;flex-wrap:wrap}
.mi-remote h2{font-family:var(--mi-serif);font-size:28px}
.mi-remote p{font-size:16px;color:var(--mi-dark-text)}
.mi-remote__links{display:flex;gap:10px;flex-wrap:wrap}
.mi-remote__links a{border:1px solid var(--mi-dark-border);padding:12px 20px;border-radius:8px;font-size:15px;font-weight:600;color:#f6f1e7}

.mi-section{padding:76px var(--mi-pad);display:flex;flex-direction:column;gap:40px}
.mi-section__head{display:flex;align-items:flex-end;justify-content:space-between;gap:30px;border-bottom:1px solid var(--mi-line);padding-bottom:22px;flex-wrap:wrap}
.mi-section__head h2{font-family:var(--mi-serif);font-size:clamp(30px,3.4vw,44px)}
.mi-section__head p{font-size:16px;color:var(--mi-muted);max-width:34ch}
.mi-grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:34px 40px}
.mi-service{display:flex;flex-direction:column;gap:10px;border-top:2px solid var(--mi-accent);padding-top:16px}
.mi-service__num{font-family:var(--mi-mono-ui);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--mi-accent)}
.mi-service h3{font-family:var(--mi-sans);font-weight:600;font-size:21px;letter-spacing:0}
.mi-service p{font-size:16px;color:var(--mi-ink-soft)}
.mi-service a{font-weight:600;font-size:16px;padding-top:4px}

.mi-zen{margin:0 var(--mi-pad) 76px;background:var(--mi-sand);border:1px solid var(--mi-line);display:grid;grid-template-columns:1fr 1fr;gap:48px;padding:48px}
.mi-kicker{font-family:var(--mi-mono-ui);font-size:13px;letter-spacing:.14em;text-transform:uppercase;color:var(--mi-accent)}
.mi-zen h2{font-family:var(--mi-serif);font-size:clamp(28px,3.2vw,42px);line-height:1.08}
.mi-zen__col{display:flex;flex-direction:column;gap:18px}
.mi-zen__list{display:flex;flex-direction:column;gap:14px;justify-content:center;list-style:none;margin:0;padding:0}
.mi-zen__list li{display:flex;gap:12px;font-size:17px}
.mi-zen__list li::before{content:"—";color:var(--mi-accent);font-weight:700}

.mi-contact{background:var(--mi-ink);color:#f6f1e7;padding:72px var(--mi-pad);display:grid;grid-template-columns:1fr 1fr;gap:56px}
.mi-contact h2{font-family:var(--mi-serif);font-size:clamp(28px,3.2vw,42px);line-height:1.08}
.mi-contact p{font-size:17px;color:var(--mi-dark-text);max-width:40ch}
.mi-contact__meta{display:flex;flex-direction:column;gap:12px;padding-top:10px}
.mi-contact__tel{font-family:var(--mi-serif);font-size:36px;color:#f6f1e7}
.mi-contact__meta a,.mi-contact__meta div{font-size:17px;color:var(--mi-dark-text)}
.mi-form{display:flex;flex-direction:column;gap:12px}
.mi-form__row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.mi-form label{display:block}
.mi-form input,.mi-form textarea,.mi-form select{background:var(--mi-dark-field);border:1px solid var(--mi-dark-border);color:#f6f1e7;padding:15px 16px;font-size:16px;width:100%}
.mi-form textarea{height:116px;resize:vertical}
.mi-form ::placeholder{color:#8d949e}
.mi-form button{background:var(--mi-accent);color:#fff;border:0;padding:17px;font-weight:700;font-size:17px;cursor:pointer}
.mi-notice{padding:14px 16px;font-size:16px;background:var(--mi-dark-field);border-left:3px solid var(--mi-accent)}
.mi-notice--err{border-left-color:#d05252}

.mi-footer{padding:28px var(--mi-pad);display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;font-size:15px;color:var(--mi-muted);border-top:1px solid var(--mi-line-soft)}

.mi-page-hero{padding:64px var(--mi-pad) 34px;border-bottom:1px solid var(--mi-line);display:flex;flex-direction:column;gap:14px}
.mi-page-hero h1{font-family:var(--mi-serif);font-size:clamp(34px,4.4vw,54px);line-height:1.05}
.mi-prose{padding:48px var(--mi-pad) 76px;max-width:74ch}
.mi-prose p,.mi-prose ul,.mi-prose ol{margin:0 0 1.1em;color:var(--mi-ink-soft)}
.mi-prose h2{font-family:var(--mi-serif);font-size:32px;margin:1.6em 0 .5em}
.mi-prose h3{font-family:var(--mi-sans);font-weight:600;font-size:22px;margin:1.4em 0 .4em}
.mi-prose blockquote{margin:1.4em 0;padding:18px 22px;background:var(--mi-sand);border:1px solid var(--mi-line);font-family:var(--mi-serif);font-size:21px}
.mi-prose img{border-radius:10px;margin:1.2em 0}
.mi-cards{padding:48px var(--mi-pad) 76px;display:grid;grid-template-columns:repeat(2,1fr);gap:34px 40px}
.mi-card{display:flex;flex-direction:column;gap:10px;border-top:2px solid var(--mi-accent);padding-top:16px}
.mi-card h2{font-family:var(--mi-sans);font-weight:600;font-size:24px;letter-spacing:0}
.mi-card__meta{font-family:var(--mi-mono-ui);font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:var(--mi-accent)}
.mi-pagination{padding:0 var(--mi-pad) 76px;display:flex;gap:12px}
.mi-pagination ul{display:flex;gap:12px;list-style:none;margin:0;padding:0}
.mi-pagination a,.mi-pagination span{border:1px solid var(--mi-line);padding:10px 16px;border-radius:8px;color:var(--mi-ink);display:inline-block}

@media (max-width:1000px){
  :root{--mi-pad:28px}
  .mi-hero,.mi-zen,.mi-contact{grid-template-columns:1fr;gap:36px}
  .mi-grid-3{grid-template-columns:1fr 1fr}
  .mi-cards{grid-template-columns:1fr}
  .mi-zen{margin:0 var(--mi-pad) 48px;padding:32px}
}
@media (max-width:720px){
  :root{--mi-pad:20px}
  .mi-grid-3{grid-template-columns:1fr}
  .mi-burger{display:block}
  .mi-nav{display:none;position:absolute;left:0;right:0;top:100%;background:var(--mi-paper);border-bottom:1px solid var(--mi-line);padding:18px var(--mi-pad)}
  .mi-nav.is-open{display:block}
  .mi-nav ul{flex-direction:column;gap:16px}
  .mi-header__in{position:relative;padding:14px var(--mi-pad)}
  .mi-logo img{height:56px}
  .mi-section,.mi-contact{padding:48px var(--mi-pad)}
  .mi-form__row{grid-template-columns:1fr}
  .mi-header__cta{display:none}
}
