/* aelkharraze.com — marine (la veste), chêne (les étagères), blanc froid */
:root{
  --navy:#13233A; --navy-2:#1B3050; --paper:#F5F6F4; --white:#FFFFFF;
  --ink:#16202E; --muted:#5A6778; --line:#DDE2E7; --oak:#C1924F; --oak-dark:#8A6230;
  --on-navy:#E9EEF4; --on-navy-dim:#9FB0C4;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --sans:"Manrope",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,Menlo,Consolas,monospace;
  --max:72rem;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font:400 1.0625rem/1.7 var(--sans)}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:focus-visible,button:focus-visible{outline:2px solid var(--oak);outline-offset:3px;border-radius:3px}
.container{max-width:var(--max);margin:0 auto;padding:0 1.5rem}
p{margin:0 0 1.1rem}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;background:#fff;padding:.5rem 1rem;z-index:10}

/* navigation */
.nav{position:sticky;top:0;z-index:5;background:rgba(19,35,58,.96);backdrop-filter:saturate(1.4) blur(8px);color:var(--on-navy)}
.nav .container{display:flex;align-items:center;justify-content:space-between;height:4rem;gap:1rem}
.nav .brand{font:500 1.2rem/1 var(--serif);text-decoration:none;letter-spacing:-.01em}
.nav ul{list-style:none;display:flex;gap:1.75rem;margin:0;padding:0;align-items:center}
.nav ul a{text-decoration:none;font-size:.95rem;color:var(--on-navy-dim)}
.nav ul a:hover,.nav ul a[aria-current]{color:#fff}
.nav .brand,.nav .btn-small{white-space:nowrap}
.nav .btn-small{color:var(--navy);background:var(--oak);padding:.55rem 1rem;border-radius:999px;font-weight:600}
.nav .btn-small:hover{background:#D4A866;color:var(--navy)}
@media (max-width:720px){.nav ul li.hide-m{display:none}.nav ul{gap:1rem}}
@media (max-width:440px){.nav ul li:first-child{display:none}.nav .brand{font-size:1.05rem}.nav ul a{font-size:.88rem}.nav .btn-small{padding:.5rem .8rem}}

/* boutons */
.btn{display:inline-flex;align-items:center;gap:.5rem;padding:.9rem 1.4rem;border-radius:999px;font-weight:600;text-decoration:none;font-size:1rem;transition:background .15s,color .15s}
.btn-oak{background:var(--oak);color:var(--navy)}
.btn-oak:hover{background:#D4A866}
.btn-ghost{border:1px solid rgba(233,238,244,.35);color:var(--on-navy)}
.btn-ghost:hover{border-color:#fff;color:#fff}
.btn-navy{background:var(--navy);color:#fff}
.btn-navy:hover{background:var(--navy-2)}

/* hero */
.hero{background:var(--navy);color:var(--on-navy);overflow:hidden}
.hero .container{display:grid;grid-template-columns:1.15fr .85fr;gap:3rem;align-items:end;min-height:min(44rem,calc(100vh - 4rem))}
.hero-text{padding:5rem 0 5.5rem;align-self:center}
.hero h1{font:400 clamp(3.2rem,7.5vw,6.2rem)/.95 var(--serif);letter-spacing:-.035em;color:#fff;margin:0 0 1.75rem}
.hero .pitch{font:400 clamp(1.25rem,2.1vw,1.55rem)/1.45 var(--serif);color:var(--on-navy);max-width:31rem;margin-bottom:1.25rem}
.hero .sub{color:var(--on-navy-dim);max-width:30rem;margin-bottom:2.25rem}
.hero .actions{display:flex;gap:.75rem;flex-wrap:wrap}
.hero-photo{position:relative;align-self:end;margin:0}
.hero-photo img{width:100%;border-radius:12px 12px 0 0;object-fit:cover;aspect-ratio:4/5}
.hero-photo figcaption{position:absolute;left:-2rem;bottom:2.5rem;background:var(--white);color:var(--ink);border-radius:10px;padding:.9rem 1.1rem;box-shadow:0 18px 40px rgba(8,16,28,.35);font-size:.9rem;line-height:1.35;max-width:15rem}
.hero-photo figcaption strong{display:block;font:500 1.05rem/1.2 var(--serif)}
@media (max-width:860px){
  .hero .container{grid-template-columns:1fr;gap:0;min-height:0}
  .hero-text{padding:3.5rem 0 2.5rem}
  .hero-photo{max-width:26rem}
  .hero-photo figcaption{left:1rem}
}

/* bande de références */
.refs{background:var(--white);border-bottom:1px solid var(--line)}
.refs .container{padding-top:2.25rem;padding-bottom:2.25rem;display:grid;grid-template-columns:14rem 1fr;gap:2rem;align-items:center}
.refs p{margin:0;color:var(--muted);font-size:.95rem;line-height:1.5}
.refs ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:.9rem 2.25rem}
.refs li{font:500 1.15rem/1.2 var(--serif);color:#3B4656;white-space:nowrap}
@media (max-width:760px){.refs .container{grid-template-columns:1fr;gap:1rem}}

/* sections */
.section{padding:6.5rem 0}
.section-head{max-width:40rem;margin-bottom:3rem}
.section-head h2,.h2{font:400 clamp(2.1rem,4vw,3.1rem)/1.08 var(--serif);letter-spacing:-.025em;margin:0 0 1rem}
.section-head p{color:var(--muted);font-size:1.125rem;margin:0}

/* histoire */
.story .container{display:grid;grid-template-columns:1fr 1fr;gap:4rem;align-items:start}
.story-text{font:400 1.2rem/1.7 var(--serif);max-width:34rem}
.link-arrow{font:600 1rem/1 var(--sans);color:var(--navy);text-decoration:none;border-bottom:2px solid var(--oak);padding-bottom:.25rem}
.link-arrow:hover{color:var(--oak-dark)}
@media (max-width:900px){.story .container{grid-template-columns:1fr;gap:2.5rem}}

/* traceroute, l'élément signature */
.trace{background:var(--navy);color:var(--on-navy);font:400 .88rem/1.8 var(--mono);border-radius:12px;padding:1.5rem 1.5rem 1.6rem;overflow-x:auto;box-shadow:0 30px 60px -30px rgba(19,35,58,.6)}
.trace p{margin:0}
.trace .cmd{color:var(--on-navy-dim);margin-bottom:.9rem}
.trace .cmd b{color:#fff;font-weight:500}
.trace ol{list-style:none;margin:0;padding:0;min-width:31rem}
.trace li{display:grid;grid-template-columns:1.4rem 6.2rem 1fr;gap:.9rem}
.trace .n{color:#6F83A0;text-align:right}
.trace .t{color:#E2B877}
.trace .miss .d{color:#F2A597}
.trace .last .d{color:#fff;font-weight:500}
.trace .end{color:var(--on-navy-dim);margin-top:.9rem}
@media (prefers-reduced-motion:no-preference){
  .trace.play li{opacity:0;animation:hop .22s ease-out forwards;animation-delay:calc(var(--i) * 110ms)}
  @keyframes hop{to{opacity:1}}
}

/* aujourd'hui */
.now{background:var(--white);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.now-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:1.5rem}
.feature{background:var(--navy);color:var(--on-navy);border-radius:16px;padding:2.5rem;display:flex;flex-direction:column;justify-content:space-between;min-height:24rem;text-decoration:none;transition:background .15s}
.feature:hover{background:var(--navy-2)}
.feature .role{color:var(--oak);font-weight:600;font-size:.95rem;margin-bottom:.75rem}
.feature h3{font:400 2.6rem/1 var(--serif);color:#fff;margin:0 0 1rem;letter-spacing:-.02em}
.feature p{color:var(--on-navy);max-width:28rem;font-size:1.05rem}
.feature .go{color:#fff;font-weight:600;border-bottom:2px solid var(--oak);align-self:flex-start;padding-bottom:.2rem}
.side{display:grid;gap:1.5rem}
.tile{border:1px solid var(--line);border-radius:16px;padding:1.75rem;text-decoration:none;display:block;background:var(--paper);transition:border-color .15s}
.tile:hover{border-color:var(--navy)}
.tile .role{color:var(--oak-dark);font-weight:600;font-size:.9rem;margin-bottom:.4rem}
.tile h3{font:400 1.7rem/1.1 var(--serif);margin:0 0 .6rem;letter-spacing:-.015em}
.tile p{color:var(--muted);margin:0;font-size:.98rem}
@media (max-width:860px){.now-grid{grid-template-columns:1fr}.feature{min-height:0}}

/* réalisations */
.work{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.work li{display:grid;grid-template-columns:16rem 1fr;gap:2rem;padding:1.6rem 0;border-bottom:1px solid var(--line)}
.work h3{font:500 1.3rem/1.3 var(--serif);margin:0}
.work p{margin:0;color:var(--muted)}
@media (max-width:760px){.work li{grid-template-columns:1fr;gap:.4rem}}

/* principe */
.principle{background:var(--navy);color:#fff}
.principle blockquote{margin:0;max-width:56rem;font:400 clamp(1.9rem,4vw,3.2rem)/1.18 var(--serif);letter-spacing:-.02em}
.principle blockquote::before{content:"";display:block;width:3rem;height:3px;background:var(--oak);margin-bottom:2rem}
.principle cite{display:block;margin-top:1.75rem;font:400 1rem/1.4 var(--sans);font-style:normal;color:var(--on-navy-dim)}

/* contact */
.contact .container{display:grid;grid-template-columns:1.2fr 1fr;gap:3rem;align-items:start}
.contact .mail{font:400 clamp(1.5rem,3vw,2.2rem)/1.2 var(--serif);color:var(--navy);text-decoration:none;border-bottom:2px solid var(--oak)}
.contact .mail:hover{color:var(--oak-dark)}
.contact ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.contact li a{display:flex;justify-content:space-between;gap:1rem;padding:1.05rem 0;border-bottom:1px solid var(--line);text-decoration:none}
.contact li a span:first-child{font-weight:600}
.contact li a span:last-child{color:var(--muted)}
.contact li a:hover span:first-child{color:var(--oak-dark)}
@media (max-width:860px){.contact .container{grid-template-columns:1fr}}

/* pied de page */
.footer{background:var(--navy);color:var(--on-navy-dim);font-size:.92rem}
.footer .container{display:flex;justify-content:space-between;gap:1rem;flex-wrap:wrap;padding-top:2rem;padding-bottom:2.25rem}
.footer a{color:var(--on-navy);text-decoration:none;margin-left:1.25rem}
.footer a:first-child{margin-left:0}
.footer a:hover{color:#fff}

/* page parcours */
.page-hero{background:var(--navy);color:var(--on-navy);padding:4.5rem 0 4rem}
.page-hero .container{display:grid;grid-template-columns:auto 1fr;gap:2.5rem;align-items:center}
.page-hero img{width:9rem;height:9rem;border-radius:50%;object-fit:cover;border:3px solid var(--oak)}
.page-hero h1{font:400 clamp(2.6rem,6vw,4.6rem)/1 var(--serif);letter-spacing:-.03em;color:#fff;margin:0 0 1rem}
.page-hero p{font:400 1.3rem/1.45 var(--serif);max-width:38rem;margin:0}
@media (max-width:640px){.page-hero .container{grid-template-columns:1fr;gap:1.5rem}.page-hero img{width:6.5rem;height:6.5rem}}
.chapters{padding:4.5rem 0 2rem}
.chapter{display:grid;grid-template-columns:12rem minmax(0,40rem);gap:3rem;padding:2.75rem 0;border-top:1px solid var(--line)}
.chapter:first-child{border-top:0}
.chapter .when{position:sticky;top:5.5rem;align-self:start;font:400 2rem/1 var(--serif);color:var(--oak-dark);letter-spacing:-.02em}
.chapter h2{font:400 2rem/1.15 var(--serif);letter-spacing:-.02em;margin:0 0 1.1rem}
.chapter .body{font:400 1.15rem/1.75 var(--serif)}
.chapter ul{padding-left:1.1rem;margin:0 0 1.1rem}
.chapter li{margin-bottom:.5rem}
.chapter blockquote{margin:1.5rem 0;padding:1.25rem 1.5rem;background:var(--white);border-left:3px solid var(--oak);border-radius:0 8px 8px 0;font-style:italic}
@media (max-width:760px){.chapter{grid-template-columns:1fr;gap:.75rem}.chapter .when{position:static;font-size:1.4rem}}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1.5rem;padding:2.5rem;background:var(--white);border:1px solid var(--line);border-radius:16px;margin:2rem 0 5rem}
.facts div{font-size:.98rem}
.facts dt{color:var(--muted);font-size:.9rem;margin-bottom:.2rem}
.facts dd{margin:0;font-weight:600}

/* mentions */
.legal{padding:4rem 0 5rem}
.legal .container{max-width:44rem}
.legal h1{font:400 2.8rem/1.05 var(--serif);letter-spacing:-.02em;margin:0 0 2rem}
.legal h2{font:500 1.35rem/1.3 var(--serif);margin:2.25rem 0 .6rem}
.legal a{color:var(--navy)}

/* ===== spécifique aekcapital.fr ===== */
.nav .brand{display:flex;align-items:center;gap:.6rem}
.nav .brand svg{width:30px;height:30px;flex:none}
.hero-hold .container{display:block;min-height:0}
.hero-hold .hero-text{padding:6.5rem 0 3.5rem;max-width:52rem}
.hero-hold h1{font-size:clamp(2.8rem,6.4vw,5.4rem);line-height:1;margin-bottom:1.75rem}
.hero-hold .pitch{max-width:40rem}
.idbar{border-top:1px solid rgba(233,238,244,.14)}
.idbar dl{display:grid;grid-template-columns:repeat(4,1fr);margin:0}
.idbar div{padding:1.5rem 1.5rem 1.75rem 0;border-right:1px solid rgba(233,238,244,.14)}
.idbar div + div{padding-left:1.5rem}
.idbar div:last-child{border-right:0}
.idbar dt{color:var(--on-navy-dim);font-size:.88rem;margin-bottom:.35rem}
.idbar dd{margin:0;font:400 1.45rem/1.2 var(--serif);color:#fff}
@media (max-width:760px){.idbar dl{grid-template-columns:1fr 1fr}.idbar div{border-right:0;padding:1.1rem 0!important;border-bottom:1px solid rgba(233,238,244,.14)}}

.steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,1fr);border-top:2px solid var(--navy)}
.steps li{padding:1.75rem 1.5rem 0 0}
.steps li + li{padding-left:1.5rem;border-left:1px solid var(--line)}
.steps .num{font:400 2.6rem/1 var(--serif);color:var(--oak);display:block;margin-bottom:1rem}
.steps h3{font:500 1.45rem/1.2 var(--serif);margin:0 0 .6rem}
.steps p{color:var(--muted);margin:0;font-size:.98rem}
@media (max-width:900px){.steps{grid-template-columns:1fr 1fr;row-gap:2rem}.steps li:nth-child(3){padding-left:0;border-left:0}}
@media (max-width:560px){.steps{grid-template-columns:1fr}.steps li{padding-left:0!important;border-left:0!important}}

.edge{display:grid;grid-template-columns:1fr 1fr 1fr;gap:2.5rem}
.edge h3{font:500 1.35rem/1.25 var(--serif);margin:0 0 .6rem}
.edge p{color:var(--muted);margin:0}
@media (max-width:860px){.edge{grid-template-columns:1fr;gap:1.75rem}}

.brands{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.brands li{border-bottom:1px solid var(--line)}
.brands > li > a,.brands .row{display:grid;grid-template-columns:16rem 1fr 11rem;gap:2rem;align-items:baseline;padding:2rem 0;text-decoration:none}
.brands h3{font:400 2rem/1.05 var(--serif);letter-spacing:-.02em;margin:0;color:var(--navy)}
.brands p{margin:0;color:var(--muted)}
.brands .cat{font-weight:600;font-size:.92rem;color:var(--oak-dark);text-align:right}
.brands > li > a:hover h3{color:var(--oak-dark)}
.brands .row h3{color:var(--muted)}
@media (max-width:760px){.brands > li > a,.brands .row{grid-template-columns:1fr;gap:.5rem}.brands .cat{text-align:left;order:-1}}

.sell .container{display:grid;grid-template-columns:1fr 1fr;gap:4rem}
.sell .section-head{grid-column:1/-1;margin-bottom:0}
.sell .section-head p{color:var(--on-navy-dim)}
.sell h3{font:500 1.4rem/1.25 var(--serif);margin:0 0 1.25rem;color:#fff}
.checks{list-style:none;margin:0;padding:0}
.checks li{padding:.9rem 0 .9rem 2rem;border-bottom:1px solid rgba(233,238,244,.14);position:relative;color:var(--on-navy)}
.checks li::before{content:"";position:absolute;left:.1rem;top:1.3rem;width:.8rem;height:.42rem;border-left:2px solid var(--oak);border-bottom:2px solid var(--oak);transform:rotate(-45deg)}
.flow{list-style:none;margin:0;padding:0;counter-reset:f}
.flow li{counter-increment:f;display:grid;grid-template-columns:2.5rem 1fr;gap:1rem;padding:.9rem 0;border-bottom:1px solid rgba(233,238,244,.14)}
.flow li::before{content:counter(f);font:400 1.6rem/1 var(--serif);color:var(--oak)}
.flow strong{display:block;color:#fff;font-weight:600}
.flow span{color:var(--on-navy-dim);font-size:.96rem}
.sell .note{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;gap:1.5rem;flex-wrap:wrap;border-top:1px solid rgba(233,238,244,.14);padding-top:2rem}
.sell .note p{margin:0;color:var(--on-navy-dim);max-width:34rem}
@media (max-width:860px){.sell .container{grid-template-columns:1fr;gap:3rem}}

.leader .container{display:grid;grid-template-columns:18rem 1fr;gap:4rem;align-items:center}
.leader picture{display:block}
.leader img{border-radius:12px;width:100%;aspect-ratio:4/5;object-fit:cover}
.leader .role{color:var(--oak-dark);font-weight:600;margin-bottom:.5rem}
.leader .lead{font:400 1.15rem/1.7 var(--serif);max-width:38rem}
@media (max-width:760px){.leader .container{grid-template-columns:1fr;gap:2rem}.leader picture{display:block}
.leader img{max-width:14rem}}
.footer .legal-id{flex-basis:100%;border-top:1px solid rgba(233,238,244,.12);padding-top:1.1rem;font-size:.85rem}

.brands .row p a{color:var(--navy)}
@media (max-width:440px){.nav ul li:nth-child(3){display:none}}