/*
Theme Name: KRCH Consulting
Theme URI: https://krchconsulting.com
Author: KRCH Consulting
Author URI: https://krchconsulting.com
Description: Thème sur-mesure pour KRCH Consulting - représentation commerciale et développement d'affaires dans le monde arabe et en Afrique. Site one-page bilingue FR/EN avec animations 3D.
Version: 1.0.0
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: krch
*/

  :root{
    --navy-950:#070f1f;
    --navy-900:#0b1a30;
    --navy-800:#12253f;
    --navy-700:#1a3255;
    --gold-500:#c9a24b;
    --gold-400:#dcbb6e;
    --cream-50:#f7f3ea;
    --cream-100:#efe8d8;
    --ink-700:#2b2b28;
    --muted:#9fb0c8;
  }
  *{box-sizing:border-box; margin:0; padding:0;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter', sans-serif;
    background:var(--cream-50);
    color:var(--ink-700);
    line-height:1.6;
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,.brand{
    font-family:'Playfair Display', serif;
    font-weight:600;
    letter-spacing:0.01em;
  }
  a{text-decoration:none; color:inherit;}
  img{max-width:100%; display:block;}
  .container{
    width:100%;
    max-width:1160px;
    margin:0 auto;
    padding:0 28px;
  }

  /* Language toggle */
  [data-en]{display:none;}
  body.lang-en [data-fr]{display:none;}
  body.lang-en [data-en]{display:inline;}
  body.lang-en [data-en].block{display:block;}
  [data-fr].block{display:block;}

  .lang-switch{
    display:flex; gap:6px; align-items:center;
    border:1px solid rgba(255,255,255,0.25);
    border-radius:30px;
    padding:4px;
  }
  .lang-switch button{
    background:transparent;
    border:none;
    color:var(--muted);
    font-size:12.5px;
    font-weight:600;
    letter-spacing:0.06em;
    padding:6px 13px;
    border-radius:24px;
    cursor:pointer;
    transition:all .25s ease;
  }
  .lang-switch button.active{
    background:var(--gold-500);
    color:var(--navy-950);
  }

  /* Header */
  header{
    position:sticky; top:0; z-index:100;
    background:rgba(7,15,31,0.92);
    backdrop-filter:blur(10px);
    border-bottom:1px solid rgba(201,162,75,0.18);
  }
  .nav-wrap{
    display:flex; align-items:center; justify-content:space-between;
    padding:16px 0;
  }
  .brand-block{display:flex; align-items:center; gap:12px;}
  .logo-img{height:40px; width:auto; display:block;}
  .brand-mark{
    width:42px; height:42px;
    border:1.5px solid var(--gold-500);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    color:var(--gold-400);
    font-family:'Playfair Display', serif;
    font-weight:700;
    font-size:16px;
    flex-shrink:0;
  }
  .brand-text{color:var(--cream-50);}
  .brand-text .name{font-size:15.5px; font-weight:600; line-height:1.25; letter-spacing:0.01em;}
  .brand-text .sub{font-size:10px; color:var(--gold-400); letter-spacing:0.16em; text-transform:uppercase; margin-top:2px;}

  nav ul{
    display:flex; gap:34px; list-style:none;
  }
  nav a{
    color:var(--muted);
    font-size:13.5px;
    font-weight:500;
    letter-spacing:0.03em;
    transition:color .2s;
  }
  nav a:hover{color:var(--gold-400);}
  .nav-right{display:flex; align-items:center; gap:24px;}
  .nav-cta{
    background:var(--gold-500);
    color:var(--navy-950);
    padding:9px 20px;
    border-radius:3px;
    font-size:12.5px;
    font-weight:600;
    letter-spacing:0.04em;
    white-space:nowrap;
  }
  .menu-toggle{display:none;}

  /* Hero */
  .hero{
    position:relative;
    background:
      radial-gradient(ellipse at 15% 20%, rgba(201,162,75,0.10), transparent 55%),
      radial-gradient(ellipse at 85% 80%, rgba(201,162,75,0.08), transparent 55%),
      linear-gradient(160deg, var(--navy-950) 0%, var(--navy-900) 55%, var(--navy-800) 100%);
    color:var(--cream-50);
    padding:120px 0 130px;
    overflow:hidden;
  }
  .hero::before{
    content:"";
    position:absolute; inset:0;
    background-image:
      linear-gradient(rgba(201,162,75,0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(201,162,75,0.05) 1px, transparent 1px);
    background-size:64px 64px;
    mask-image:linear-gradient(to bottom, black, transparent 80%);
    pointer-events:none;
  }
  .hero-inner{position:relative; max-width:760px;}
  .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    color:var(--gold-400);
    font-size:12px; font-weight:600; letter-spacing:0.2em; text-transform:uppercase;
    margin-bottom:26px;
  }
  .eyebrow::before{content:""; width:30px; height:1px; background:var(--gold-500);}
  .hero h1{
    font-size:clamp(34px, 5vw, 54px);
    line-height:1.15;
    margin-bottom:22px;
    color:#fff;
  }
  .hero h1 em{
    font-style:normal; color:var(--gold-400);
  }
  .hero p.lead{
    font-size:17px;
    color:var(--muted);
    max-width:560px;
    margin-bottom:38px;
    font-weight:300;
  }
  .hero-actions{display:flex; gap:16px; flex-wrap:wrap;}
  .btn-primary{
    background:var(--gold-500);
    color:var(--navy-950);
    padding:14px 30px;
    border-radius:3px;
    font-size:13.5px;
    font-weight:600;
    letter-spacing:0.03em;
    transition:background .2s, transform .2s;
  }
  .btn-primary:hover{background:var(--gold-400); transform:translateY(-1px);}
  .btn-ghost{
    border:1px solid rgba(247,243,234,0.3);
    color:var(--cream-50);
    padding:14px 30px;
    border-radius:3px;
    font-size:13.5px;
    font-weight:600;
    letter-spacing:0.03em;
    transition:border-color .2s, background .2s;
  }
  .btn-ghost:hover{border-color:var(--gold-500); background:rgba(201,162,75,0.08);}

  .hero-stats{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:0;
    margin-top:70px;
    max-width:640px;
    border-top:1px solid rgba(201,162,75,0.22);
    padding-top:28px;
  }
  .hero-stats div{padding-right:20px;}
  .hero-stats .num{
    font-family:'Playfair Display', serif;
    font-size:27px;
    color:var(--gold-400);
    font-weight:600;
  }
  .hero-stats .lbl{
    font-size:11.5px;
    color:var(--muted);
    letter-spacing:0.04em;
    margin-top:4px;
  }

  /* Section generic */
  section{padding:96px 0;}
  .section-head{
    max-width:640px;
    margin:0 auto 56px;
    text-align:center;
  }
  .section-eyebrow{
    color:var(--gold-500);
    font-size:12px;
    font-weight:700;
    letter-spacing:0.2em;
    text-transform:uppercase;
    margin-bottom:14px;
    display:block;
  }
  .section-head h2{
    font-size:clamp(26px, 3.4vw, 36px);
    color:var(--navy-950);
    margin-bottom:16px;
  }
  .section-head p{
    color:#6b6d72;
    font-size:15.5px;
    font-weight:300;
  }

  /* About */
  .about{background:#fff;}
  .about-grid{
    display:grid;
    grid-template-columns:0.9fr 1.1fr;
    gap:64px;
    align-items:center;
  }
  .about-visual{
    background:linear-gradient(160deg, var(--navy-900), var(--navy-800));
    border-radius:6px;
    padding:44px 36px;
    color:var(--cream-50);
    position:relative;
    min-height:340px;
    display:flex; flex-direction:column; justify-content:center;
  }
  .about-visual::after{
    content:"";
    position:absolute; top:14px; left:14px; right:-14px; bottom:-14px;
    border:1.5px solid var(--gold-500);
    border-radius:6px;
    z-index:-1;
  }
  .about-visual .quote-mark{
    font-family:'Playfair Display', serif;
    font-size:56px;
    color:var(--gold-500);
    line-height:1;
    margin-bottom:16px;
  }
  .about-visual p{
    font-family:'Playfair Display', serif;
    font-size:19px;
    line-height:1.5;
    font-style:italic;
    color:var(--cream-100);
  }
  .about-copy h2{
    font-size:29px;
    color:var(--navy-950);
    margin-bottom:20px;
  }
  .about-copy p{
    color:#565860;
    font-size:15px;
    font-weight:300;
    margin-bottom:18px;
  }
  .about-points{
    list-style:none;
    margin-top:26px;
    display:grid;
    gap:14px;
  }
  .about-points li{
    display:flex; gap:12px; align-items:flex-start;
    font-size:14px;
    color:var(--navy-900);
    font-weight:500;
  }
  .about-points li::before{
    content:"";
    width:7px; height:7px;
    margin-top:6px;
    background:var(--gold-500);
    border-radius:50%;
    flex-shrink:0;
  }

  /* Services */
  .services{background:var(--cream-50);}
  .services-grid{
    display:grid;
    grid-template-columns:repeat(2, 1fr);
    gap:28px;
  }
  .service-card{
    background:#fff;
    border:1px solid #e7e0cd;
    border-top:3px solid var(--gold-500);
    padding:36px 32px;
    border-radius:2px;
    transition:transform .25s ease, box-shadow .25s ease;
  }
  .service-card:hover{
    transform:translateY(-4px);
    box-shadow:0 18px 40px -20px rgba(11,26,48,0.25);
  }
  .service-num{
    font-family:'Playfair Display', serif;
    color:var(--gold-500);
    font-size:13px;
    font-weight:700;
    letter-spacing:0.1em;
    margin-bottom:16px;
    display:block;
  }
  .service-card h3{
    font-size:19px;
    color:var(--navy-950);
    margin-bottom:12px;
  }
  .service-card p{
    color:#666870;
    font-size:14px;
    font-weight:300;
  }

  /* Expertise */
  .expertise{
    background:linear-gradient(160deg, var(--navy-950), var(--navy-800));
    color:var(--cream-50);
  }
  .expertise .section-head h2{color:#fff;}
  .expertise .section-head p{color:var(--muted);}
  .expertise-grid{
    display:grid;
    grid-template-columns:repeat(3, 1fr);
    gap:1px;
    background:rgba(201,162,75,0.2);
    border:1px solid rgba(201,162,75,0.2);
  }
  .expertise-item{
    background:var(--navy-900);
    padding:34px 28px;
    transition:background .25s;
  }
  .expertise-item:hover{background:var(--navy-800);}
  .expertise-item h3{
    font-size:16px;
    color:var(--gold-400);
    margin-bottom:10px;
    font-weight:600;
    font-family:'Inter', sans-serif;
    letter-spacing:0.01em;
  }
  .expertise-item p{
    font-size:13.5px;
    color:var(--muted);
    font-weight:300;
  }

  /* Contact */
  .contact{background:#fff;}
  .contact-panel{
    background:linear-gradient(135deg, var(--navy-900), var(--navy-950));
    border-radius:6px;
    padding:64px;
    display:grid;
    grid-template-columns:1.1fr 0.9fr;
    gap:56px;
    color:var(--cream-50);
    position:relative;
    overflow:hidden;
  }
  .contact-panel::before{
    content:"";
    position:absolute; right:-80px; top:-80px;
    width:280px; height:280px;
    border:1px solid rgba(201,162,75,0.25);
    border-radius:50%;
  }
  .contact-copy h2{font-size:28px; margin-bottom:16px; color:#fff;}
  .contact-copy p{color:var(--muted); font-size:15px; font-weight:300; max-width:420px;}
  .contact-list{margin-top:32px; display:grid; gap:20px;}
  .contact-list a, .contact-list div{
    display:flex; align-items:center; gap:16px;
    font-size:15px; color:var(--cream-50); font-weight:500;
  }
  .contact-icon{
    width:42px; height:42px;
    border:1px solid var(--gold-500);
    border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    color:var(--gold-400);
    flex-shrink:0;
    font-size:17px;
  }
  .contact-list small{
    display:block; color:var(--muted); font-weight:400; font-size:11px; letter-spacing:0.08em; text-transform:uppercase; margin-bottom:3px;
  }
  .contact-form-box{
    background:rgba(247,243,234,0.04);
    border:1px solid rgba(201,162,75,0.25);
    border-radius:4px;
    padding:32px;
  }
  .contact-form-box h3{font-size:15px; color:var(--gold-400); margin-bottom:18px; font-family:'Inter',sans-serif; letter-spacing:0.04em;}
  .contact-form-box .field{margin-bottom:16px;}
  .contact-form-box label{display:block; font-size:11.5px; color:var(--muted); margin-bottom:6px; letter-spacing:0.04em;}
  .contact-form-box input, .contact-form-box textarea{
    width:100%;
    background:rgba(255,255,255,0.05);
    border:1px solid rgba(201,162,75,0.25);
    border-radius:3px;
    padding:11px 13px;
    color:#fff;
    font-family:'Inter', sans-serif;
    font-size:13.5px;
  }
  .contact-form-box textarea{resize:vertical; min-height:70px;}
  .contact-form-box button{
    width:100%;
    background:var(--gold-500);
    color:var(--navy-950);
    border:none;
    padding:13px;
    border-radius:3px;
    font-weight:700;
    font-size:13px;
    letter-spacing:0.04em;
    cursor:pointer;
    margin-top:6px;
  }

  /* Footer */
  footer{
    background:var(--navy-950);
    color:var(--muted);
    padding:36px 0;
    border-top:1px solid rgba(201,162,75,0.15);
  }
  .footer-inner{
    display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:14px;
    font-size:12.5px;
  }
  .footer-inner .brand{color:var(--gold-400); font-size:14px;}

  @media (max-width:880px){
    nav ul{display:none;}
    .about-grid, .services-grid, .contact-panel{grid-template-columns:1fr;}
    .expertise-grid{grid-template-columns:repeat(2,1fr);}
    .contact-panel{padding:40px 26px;}
    .hero{padding:90px 0 80px;}
    .hero-stats{grid-template-columns:repeat(3,1fr); gap:14px;}
  }
  @media (max-width:520px){
    .expertise-grid{grid-template-columns:1fr;}
    .nav-cta{display:none;}
  }

  /* ---- Motion & fluid interactions ---- */
  *{ }
  html{ }
  a, button, .service-card, .expertise-item, .btn-primary, .btn-ghost, .nav-cta, .logo-img, header{
    transition: all .35s cubic-bezier(.22,.61,.36,1);
  }

  #site-header{ transition: background .35s ease, box-shadow .35s ease, padding .35s ease; }
  #site-header.scrolled{
    box-shadow: 0 10px 30px -18px rgba(0,0,0,0.55);
    background: rgba(5,11,23,0.97);
  }

  nav ul li{ position:relative; }
  nav ul li a{ position:relative; padding-bottom:4px; }
  nav ul li a::after{
    content:"";
    position:absolute; left:0; bottom:0;
    width:0%; height:1.5px;
    background:var(--gold-500);
    transition:width .3s ease;
  }
  nav ul li a:hover::after{ width:100%; }

  .logo-img{ transition: transform .4s cubic-bezier(.22,.61,.36,1), filter .4s ease; }
  .brand-block:hover .logo-img{ transform: scale(1.05); filter: drop-shadow(0 0 14px rgba(201,162,75,0.35)); }

  .btn-primary, .btn-ghost{ position:relative; overflow:hidden; }
  .btn-primary::before{
    content:"";
    position:absolute; top:0; left:-120%;
    width:60%; height:100%;
    background:linear-gradient(120deg, transparent, rgba(255,255,255,0.45), transparent);
    transform:skewX(-20deg);
    transition:left .65s ease;
  }
  .btn-primary:hover::before{ left:130%; }
  .btn-primary:hover{ box-shadow:0 14px 30px -12px rgba(201,162,75,0.55); transform:translateY(-2px); }
  .btn-ghost:hover{ transform:translateY(-2px); box-shadow:0 14px 30px -18px rgba(247,243,234,0.25); }
  .nav-cta:hover{ box-shadow:0 10px 24px -10px rgba(201,162,75,0.6); transform:translateY(-1px); }

  /* animated hero background orbs */
  .hero{ position:relative; }
  .hero-orb{
    position:absolute;
    border-radius:50%;
    filter:blur(60px);
    opacity:0.35;
    pointer-events:none;
    z-index:0;
  }
  .hero-orb-1{
    width:420px; height:420px;
    top:-140px; left:-120px;
    background:radial-gradient(circle, rgba(201,162,75,0.55), transparent 70%);
    animation: orbFloat1 16s ease-in-out infinite;
  }
  .hero-orb-2{
    width:360px; height:360px;
    bottom:-160px; right:-100px;
    background:radial-gradient(circle, rgba(60,110,180,0.45), transparent 70%);
    animation: orbFloat2 20s ease-in-out infinite;
  }
  @keyframes orbFloat1{
    0%,100%{ transform:translate(0,0) scale(1); }
    50%{ transform:translate(40px,30px) scale(1.12); }
  }
  @keyframes orbFloat2{
    0%,100%{ transform:translate(0,0) scale(1); }
    50%{ transform:translate(-30px,-25px) scale(1.08); }
  }
  .hero-inner, .hero-actions, .hero-stats{ position:relative; z-index:1; }

  /* hero entrance animation */
  @keyframes fadeUp{
    from{ opacity:0; transform:translateY(22px); }
    to{ opacity:1; transform:translateY(0); }
  }
  .hero-anim{ opacity:0; animation:fadeUp .8s cubic-bezier(.22,.61,.36,1) forwards; }
  .hero .eyebrow.hero-anim{ animation-delay:.05s; }
  .hero h1.hero-anim{ animation-delay:.18s; }
  .hero .lead.hero-anim{ animation-delay:.32s; }
  .hero .hero-actions.hero-anim{ animation-delay:.46s; }
  .hero .hero-stats.hero-anim{ animation-delay:.6s; }

  /* scroll reveal */
  .reveal{
    opacity:0;
    transform:translateY(26px);
    transition:opacity .8s cubic-bezier(.22,.61,.36,1), transform .8s cubic-bezier(.22,.61,.36,1);
  }
  .reveal.is-visible{
    opacity:1;
    transform:translateY(0);
  }

  .service-card, .expertise-item{
    transition: transform .45s cubic-bezier(.22,.61,.36,1), box-shadow .45s ease, background .3s ease, opacity .8s ease;
  }
  .service-card:hover{
    transform:translateY(-6px);
  }
  .expertise-item:hover h3{ transform:translateX(3px); }
  .expertise-item h3{ transition:transform .3s ease; }

  .about-visual{ transition: transform .5s ease; }
  .about-visual:hover{ transform:translateY(-4px); }

  .contact-list a{ transition: transform .3s ease; }
  .contact-list a:hover{ transform:translateX(4px); }
  .contact-icon{ transition: background .3s ease, transform .3s ease; }
  .contact-list a:hover .contact-icon{ background:var(--gold-500); color:var(--navy-950); transform:scale(1.08); }

  .contact-form-box input, .contact-form-box textarea{ transition:border-color .3s ease, box-shadow .3s ease; }
  .contact-form-box input:focus, .contact-form-box textarea:focus{
    outline:none;
    border-color:var(--gold-500);
    box-shadow:0 0 0 3px rgba(201,162,75,0.18);
  }
  .contact-form-box button{ transition: transform .3s ease, box-shadow .3s ease; }
  .contact-form-box button:hover{ transform:translateY(-2px); box-shadow:0 12px 26px -12px rgba(201,162,75,0.55); }

  /* ---- 3D rotating globe (hero) ---- */
  .globe-scene{
    position:absolute;
    top:50%;
    right:4%;
    transform:translateY(-50%);
    width:360px;
    height:360px;
    perspective:1300px;
    z-index:0;
    pointer-events:none;
  }
  .globe{
    position:relative;
    width:100%;
    height:100%;
    transform-style:preserve-3d;
    animation: globeSpin 26s linear infinite;
  }
  @keyframes globeSpin{
    from{ transform:rotateX(-12deg) rotateY(0deg); }
    to{ transform:rotateX(-12deg) rotateY(360deg); }
  }
  .globe-core{
    position:absolute; inset:0;
    border-radius:50%;
    background:radial-gradient(circle at 32% 28%, rgba(201,162,75,0.22), rgba(11,26,48,0.02) 55%, transparent 72%);
    border:1px solid rgba(201,162,75,0.32);
    box-shadow: inset 0 0 70px rgba(201,162,75,0.14), 0 0 90px rgba(201,162,75,0.08);
  }
  .globe-ring{
    position:absolute; inset:0;
    border-radius:50%;
    border:1px solid rgba(201,162,75,0.22);
    transform-style:preserve-3d;
  }
  .globe-ring.r1{ transform:rotateX(90deg); }
  .globe-ring.r2{ transform:rotateX(60deg); }
  .globe-ring.r3{ transform:rotateX(30deg); }
  .globe-ring.r4{ transform:rotateX(0deg); border-color:rgba(201,162,75,0.38); }
  .globe-ring.r5{ transform:rotateX(-30deg); }
  .globe-ring.r6{ transform:rotateX(-60deg); }
  .globe-meridian{
    position:absolute; inset:0;
    border-radius:50%;
    border:1px solid rgba(201,162,75,0.16);
    transform-style:preserve-3d;
  }
  .globe-meridian.m1{ transform:rotateY(0deg); }
  .globe-meridian.m2{ transform:rotateY(45deg); }
  .globe-meridian.m3{ transform:rotateY(90deg); border-color:rgba(201,162,75,0.3); }
  .globe-meridian.m4{ transform:rotateY(135deg); }
  .globe-dot{
    position:absolute;
    width:8px; height:8px;
    border-radius:50%;
    background:var(--gold-400);
    box-shadow:0 0 12px 3px rgba(220,187,110,0.65);
    top:50%; left:50%;
    margin:-4px 0 0 -4px;
  }
  @media (max-width:1180px){
    .globe-scene{ display:none; }
  }

  /* ---- 3D tilt on cards ---- */
  .service-card, .expertise-item, .about-visual{
    transform-style:preserve-3d;
    will-change:transform;
  }

  @media (prefers-reduced-motion: reduce){
    *, .reveal, .hero-anim, .hero-orb, .globe{ animation:none !important; transition:none !important; }
    .reveal{ opacity:1; transform:none; }
  }
  .map-wrap{
    margin-top:48px;
  }
  .map-label{
    margin-bottom:18px;
  }
  .map-frame{
    position:relative;
    border-radius:6px;
    overflow:hidden;
    border:1px solid #e7e0cd;
    box-shadow:0 24px 50px -30px rgba(11,26,48,0.35);
    aspect-ratio:16/6;
    background:#eee;
  }
  .map-frame iframe{ display:block; filter:grayscale(0.15) contrast(1.02); }
  @media (max-width:640px){
    .map-frame{ aspect-ratio:4/5; }
  }

/* ---- Contact form notice ---- */
.krch-form-notice{
  margin-bottom:18px;
  padding:12px 16px;
  border-radius:4px;
  font-size:13.5px;
  font-weight:500;
}
.krch-form-success{
  background:rgba(120,200,140,0.14);
  border:1px solid rgba(120,200,140,0.4);
  color:#dff5e4;
}
.krch-form-error{
  background:rgba(220,90,90,0.14);
  border:1px solid rgba(220,90,90,0.4);
  color:#ffd9d9;
}
.krch-hp-field{ position:absolute; left:-9999px; top:-9999px; }