:root{
  --navy:#0A2438;
  --teal:#0C6982;
  --mint:#4ADEC2;
  --ivory:#F4F8F8;
  --brass:#B08D57;
  --ink-soft:#5B6B78;
  --line:#DCE6E8;
  --radius:2px;
}
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:'Inter', sans-serif;
  background:var(--ivory);
  color:var(--navy);
  line-height:1.5;
}
.mono{font-family:'IBM Plex Mono', monospace;}
.display{font-family:'Space Grotesk', sans-serif;}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
.wrap{max-width:1180px; margin:0 auto; padding:0 32px;}
.eyebrow{
  font-family:'IBM Plex Mono', monospace;
  font-size:12.5px;
  letter-spacing:.14em;
  text-transform:uppercase;
  color:var(--teal);
  font-weight:600;
}

/* ---------- HEADER ---------- */
header{
  position:sticky; top:0; z-index:50;
  background:rgba(244,248,248,.92);
  backdrop-filter:blur(6px);
  border-bottom:1px solid var(--line);
}
.nav{display:flex; align-items:center; justify-content:space-between; padding:20px 32px;}
.brand{display:flex; align-items:center; gap:10px;}
.brand-mark{width:30px; height:30px; border:1.6px solid var(--teal); border-radius:50%; position:relative; flex:none;}
.brand-mark::before,.brand-mark::after{content:""; position:absolute; background:var(--teal);}
.brand-mark::before{width:14px; height:1.6px; top:50%; left:50%; transform:translate(-50%,-50%);}
.brand-mark::after{width:1.6px; height:14px; top:50%; left:50%; transform:translate(-50%,-50%);}
.brand-name{font-family:'Space Grotesk'; font-weight:600; font-size:18px; letter-spacing:.01em;}
.brand-name span{color:var(--teal);}
nav ul{display:flex; gap:32px; list-style:none;}
nav ul li a{font-size:14.5px; font-weight:500; color:var(--navy); opacity:.75; padding-bottom:3px; border-bottom:2px solid transparent;}
nav ul li a:hover, nav ul li a.active{opacity:1; color:var(--teal); border-color:var(--mint);}
.nav-cta{font-family:'IBM Plex Mono'; font-size:13.5px; font-weight:600; border:1px solid var(--navy); padding:9px 18px; border-radius:var(--radius);}
.nav-cta:hover{background:var(--navy); color:var(--ivory);}
.nav-inner{display:flex; align-items:center; gap:38px;}

/* ---------- PAGE HEADER BAND (sous-pages) ---------- */
.page-head{background:var(--navy); color:var(--ivory); padding:64px 0 44px;}
.page-head .eyebrow{color:var(--mint);}
.page-head h1{font-family:'Space Grotesk'; font-size:38px; font-weight:700; margin-top:12px;}
.page-head p{color:#AEC1C7; margin-top:12px; max-width:520px; font-size:15.5px;}
.crumb{font-family:'IBM Plex Mono'; font-size:11.5px; color:#8FA5AC; margin-bottom:14px;}
.crumb a{color:#B8C7CD;}
.crumb a:hover{color:var(--mint);}

/* ---------- HERO (accueil) ---------- */
.hero{padding:88px 0 60px; position:relative; overflow:hidden;}
.hero .wrap{display:grid; grid-template-columns:1.05fr .95fr; gap:60px; align-items:center;}
.hero h1{font-family:'Space Grotesk'; font-weight:700; font-size:50px; line-height:1.08; letter-spacing:-.01em; margin:18px 0 22px;}
.hero h1 em{font-style:normal; color:var(--teal);}
.hero p.lead{font-size:17.5px; color:var(--ink-soft); max-width:440px; margin-bottom:34px;}
.hero-ctas{display:flex; gap:14px; flex-wrap:wrap;}
.btn-primary{background:var(--navy); color:var(--ivory); padding:14px 26px; border-radius:var(--radius); font-weight:600; font-size:14.5px; display:inline-flex; align-items:center; gap:10px;}
.btn-primary:hover{background:var(--teal);}
.btn-ghost{border:1px solid var(--line); padding:14px 26px; border-radius:var(--radius); font-weight:600; font-size:14.5px; color:var(--navy);}
.btn-ghost:hover{border-color:var(--navy);}

/* signature: bulletin d'analyse */
.bulletin{background:#fff; border:1px solid var(--line); border-radius:6px; box-shadow:0 30px 60px -30px rgba(10,36,56,.25); padding:26px 26px 20px; position:relative;}
.bulletin::before{content:""; position:absolute; inset:10px; border:1px dashed var(--line); border-radius:3px; pointer-events:none;}
.bulletin-top{display:flex; justify-content:space-between; align-items:flex-start; border-bottom:1px solid var(--line); padding-bottom:14px; margin-bottom:14px;}
.bulletin-top .t1{font-family:'Space Grotesk'; font-weight:600; font-size:15px;}
.bulletin-top .t2{font-family:'IBM Plex Mono'; font-size:11px; color:var(--ink-soft); margin-top:4px;}
.bulletin-status{font-family:'IBM Plex Mono'; font-size:10.5px; letter-spacing:.06em; color:var(--teal); border:1px solid var(--teal); padding:4px 9px; border-radius:20px; font-weight:600;}
.row{display:grid; grid-template-columns:1.3fr .6fr .8fr .5fr; gap:8px; font-family:'IBM Plex Mono'; font-size:12px; padding:9px 0; border-bottom:1px solid #EEF3F3; align-items:center;}
.row.head{color:var(--ink-soft); font-size:10.5px; text-transform:uppercase; letter-spacing:.06em;}
.row .val{font-weight:600;}
.tick{color:var(--mint); font-weight:700;}
.bulletin-foot{display:flex; justify-content:space-between; align-items:center; margin-top:16px; padding-top:12px; border-top:1px dashed var(--line);}
.bulletin-foot .sig{font-family:'Space Grotesk'; font-size:11.5px; color:var(--ink-soft); font-style:italic;}
.qr{width:34px; height:34px; background:repeating-linear-gradient(90deg, var(--navy) 0 3px, transparent 3px 6px), repeating-linear-gradient(0deg, var(--navy) 0 3px, transparent 3px 6px); background-blend-mode:multiply; opacity:.85;}

/* ---------- TRUST STRIP ---------- */
.trust{background:var(--navy); color:var(--ivory); padding:34px 0;}
.trust .wrap{display:grid; grid-template-columns:repeat(4,1fr); gap:26px;}
.trust-item{display:flex; gap:12px; align-items:flex-start;}
.trust-item svg{flex:none; margin-top:2px;}
.trust-item h4{font-family:'Space Grotesk'; font-size:15px; font-weight:600; margin-bottom:3px;}
.trust-item p{font-size:13px; color:#B8C7CD;}

/* ---------- SECTION GENERIC ---------- */
section{padding:84px 0;}
section.tight{padding:56px 0;}
.section-head{max-width:600px; margin-bottom:48px;}
.section-head h2{font-family:'Space Grotesk'; font-size:34px; font-weight:700; margin-top:12px; letter-spacing:-.01em;}
.section-head p{color:var(--ink-soft); margin-top:12px; font-size:15.5px;}
.section-head.center{margin-left:auto; margin-right:auto; text-align:center;}

/* ---------- SERVICES ---------- */
.cat-label{font-family:'IBM Plex Mono'; font-size:12px; color:var(--brass); letter-spacing:.06em; text-transform:uppercase; padding:22px 32px 10px; border-top:1px solid var(--line);}
.cat-label:first-of-type{border-top:none;}
.services-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:1px; background:var(--line); border:1px solid var(--line);}
.services-grid.cols4{display:flex; flex-wrap:wrap; background:none; border:none;}
.services-grid.cols4 .service-card{flex:1 1 25%; max-width:25%; border:1px solid var(--line); margin:-1px 0 0 -1px;}
.service-card{background:var(--ivory); padding:26px 20px; min-height:150px; display:flex; flex-direction:column; gap:14px;}
.service-card svg{color:var(--teal);}
.service-card h4{font-family:'Space Grotesk'; font-size:14.5px; font-weight:600; line-height:1.3;}
.service-card p{font-size:12.5px; color:var(--ink-soft); line-height:1.4;}
.service-card:hover{background:#fff;}

/* ---------- PROCESS ---------- */
.process{background:#fff; border-top:1px solid var(--line); border-bottom:1px solid var(--line);}
.process-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:0;}
.process-step{padding:34px 28px; border-left:1px solid var(--line); position:relative;}
.process-step:first-child{border-left:none;}
.process-num{font-family:'IBM Plex Mono'; color:var(--brass); font-size:13px; font-weight:600; margin-bottom:14px;}
.process-step h4{font-family:'Space Grotesk'; font-size:16px; font-weight:600; margin-bottom:8px;}
.process-step p{font-size:13.5px; color:var(--ink-soft);}
.process-step.detailed{padding:40px 28px;}
.process-note{background:var(--ivory); border:1px solid var(--line); border-radius:4px; padding:22px 26px; margin-top:40px; font-size:14px; color:var(--ink-soft);}
.process-note strong{color:var(--navy);}

/* ---------- ABOUT ---------- */
.about .wrap{display:grid; grid-template-columns:.9fr 1.1fr; gap:64px; align-items:center;}
.about-photo{aspect-ratio:4/5; background:linear-gradient(160deg, var(--teal), var(--navy)); border-radius:6px; position:relative; overflow:hidden;}
.about-photo::after{content:"Dr H. Abouliatim"; position:absolute; bottom:18px; left:18px; color:#fff; font-family:'IBM Plex Mono'; font-size:12px; letter-spacing:.04em;}
.about-text blockquote{font-family:'Space Grotesk'; font-size:24px; font-weight:600; line-height:1.4; color:var(--navy); border-left:2px solid var(--brass); padding-left:24px; margin-bottom:22px;}
.about-text p{color:var(--ink-soft); font-size:15px; max-width:480px; margin-bottom:14px;}
.value-list{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:36px;}
.value-item{border-top:1px solid var(--line); padding-top:14px;}
.value-item h5{font-family:'Space Grotesk'; font-size:15px; margin-bottom:6px;}
.value-item p{font-size:13px; color:var(--ink-soft);}

/* ---------- CONTACT ---------- */
.contact{background:var(--navy); color:var(--ivory);}
.contact .wrap{display:grid; grid-template-columns:1fr 1fr; gap:70px;}
.contact .section-head p{color:#AEC1C7;}
.contact-info{display:flex; flex-direction:column; gap:22px; margin-top:36px;}
.contact-row{display:flex; gap:14px; align-items:flex-start;}
.contact-row svg{flex:none; margin-top:2px; color:var(--mint);}
.contact-row .l1{font-family:'IBM Plex Mono'; font-size:11px; color:#8FA5AC; letter-spacing:.06em; text-transform:uppercase;}
.contact-row .l2{font-size:15px; font-weight:500;}
.map-box{border:1px solid rgba(255,255,255,.15); border-radius:4px; aspect-ratio:4/3; background:linear-gradient(rgba(255,255,255,.04) 1px, transparent 1px) 0 0/24px 24px, linear-gradient(90deg, rgba(255,255,255,.04) 1px, transparent 1px) 0 0/24px 24px, #0d2c40; position:relative;}
.map-pin{position:absolute; top:46%; left:52%; width:14px; height:14px; background:var(--mint); border-radius:50% 50% 50% 0; transform:translate(-50%,-100%) rotate(-45deg);}

/* ---------- FORM (contact page) ---------- */
.form-box{background:#fff; border-radius:6px; padding:30px; margin-top:10px;}
.form-row{margin-bottom:18px;}
.form-row label{display:block; font-family:'IBM Plex Mono'; font-size:11px; text-transform:uppercase; letter-spacing:.05em; color:var(--ink-soft); margin-bottom:7px;}
.form-row input, .form-row select, .form-row textarea{
  width:100%; border:1px solid var(--line); border-radius:3px; padding:11px 12px; font-family:'Inter'; font-size:14px; color:var(--navy); background:var(--ivory);
}
.form-row textarea{resize:vertical; min-height:90px;}
.form-two{display:grid; grid-template-columns:1fr 1fr; gap:16px;}
.form-submit{background:var(--teal); color:#fff; border:none; padding:13px 30px; border-radius:3px; font-weight:600; font-size:14px; cursor:pointer;}

/* ---------- LEGAL PAGES ---------- */
.legal .wrap{max-width:800px;}
.legal h2{font-family:'Space Grotesk'; font-size:20px; margin:36px 0 12px;}
.legal h2:first-child{margin-top:0;}
.legal p, .legal li{font-size:14.5px; color:var(--ink-soft); margin-bottom:10px;}
.legal ul{padding-left:20px; margin-bottom:14px;}
.legal .placeholder{background:#FFF7E8; border:1px dashed var(--brass); padding:14px 16px; border-radius:4px; font-size:13px; color:#7A6230; margin:14px 0;}

/* ---------- CTA BAND ---------- */
.cta-band{background:linear-gradient(135deg, var(--teal), var(--navy)); color:#fff; padding:56px 0; text-align:center;}
.cta-band h3{font-family:'Space Grotesk'; font-size:26px; margin-bottom:14px;}
.cta-band p{color:#CFE7E9; margin-bottom:26px;}
.cta-band .btn-primary{background:#fff; color:var(--navy); display:inline-flex;}
.cta-band .btn-primary:hover{background:var(--mint);}

footer{padding:28px 0; border-top:1px solid rgba(255,255,255,.1); background:var(--navy); color:#8FA5AC;}
footer .wrap{display:flex; justify-content:space-between; align-items:center; font-size:12.5px; flex-wrap:wrap; gap:10px;}
footer .foot-links{display:flex; gap:18px;}
footer .foot-links a:hover{color:var(--mint);}

@media(max-width:960px){
  .hero .wrap, .about .wrap, .contact .wrap{grid-template-columns:1fr;}
  .trust .wrap, .services-grid, .process-grid{grid-template-columns:repeat(2,1fr);}
  .services-grid.cols4 .service-card{flex:1 1 50%; max-width:50%;}
  nav ul{display:none;}
  .hero h1{font-size:36px;}
  .form-two{grid-template-columns:1fr;}
}
@media(max-width:520px){
  .wrap{padding:0 20px;}
  .nav{padding:16px 20px;}
  .brand-name{font-size:15px;}
  .nav-cta{font-size:11px; padding:8px 12px; white-space:nowrap;}
  .hero{padding:48px 0 40px;}
  .hero h1{font-size:30px;}
  .hero p.lead{font-size:15.5px;}
  .trust .wrap, .services-grid, .process-grid{grid-template-columns:1fr;}
  .services-grid.cols4 .service-card{flex:1 1 100%; max-width:100%;}
  .process-step{border-left:none; border-top:1px solid var(--line);}
  .process-step:first-child{border-top:none;}
  .section-head h2{font-size:26px;}
  .bulletin{padding:20px 18px 16px;}
  .row{grid-template-columns:1.3fr .6fr .7fr .3fr; font-size:11px;}
  .page-head h1{font-size:28px;}
}
