@font-face { font-family:'Fraunces'; src:url('fonts/fraunces-latin-variable.woff2') format('woff2'); font-weight:100 900; font-display:swap; }
@font-face { font-family:'Inter'; src:url('fonts/inter-latin-variable.woff2') format('woff2'); font-weight:100 900; font-display:swap; }

:root {
  --teal: #0F3D3E;
  --teal-light: #2A5D5E;
  --teal-border: #4A8A87;
  --brass: #B8860B;
  --gold: #C9A961;
  --cream: #F5F1EA;
  --cream-alt: #EAF1F0;
  --white: #FFFFFF;
  --text-dark: #0F3D3E;
  --text-muted: #6B6A63;
  --input-border: #D8D0BE;
}

* { margin:0; padding:0; box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { font-family:'Inter',Arial,sans-serif; background:var(--cream); color:var(--text-dark); line-height:1.5; }
h1,h2,h3,h4 { font-family:'Inter',Arial,sans-serif; font-weight:700; }
a { color:inherit; }
img { max-width:100%; display:block; }
.container { max-width:1160px; margin:0 auto; padding:0 24px; }

/* Header */
header { background:var(--cream); border-bottom:0.5px solid #DDD6C7; position:sticky; top:0; z-index:100; }
#services, #comment-ca-marche, #contact { scroll-margin-top:100px; }
.nav-wrap { display:flex; align-items:center; justify-content:space-between; padding:18px 0; }
.logo { font-size:30px; font-weight:700; color:var(--teal); text-decoration:none; }
.logo span { color:var(--brass); }
nav ul { display:flex; align-items:center; gap:36px; list-style:none; }
nav a { font-size:16px; color:var(--text-dark); text-decoration:none; white-space:nowrap; }
nav a:hover { color:var(--brass); }
.btn-primary { background:var(--brass); color:var(--teal); padding:12px 24px; border-radius:5px; font-size:14px; font-weight:700; border:none; cursor:pointer; font-family:'Inter',Arial,sans-serif; }
.btn-primary:hover { background:#A5760A; }
.mobile-toggle { display:none; background:none; border:none; font-size:26px; color:var(--teal); cursor:pointer; }

/* Hero */
.hero { background:var(--teal); padding:70px 50px 90px; display:flex; align-items:center; gap:20px; clip-path:polygon(0 0, 100% 0, 100% 90%, 0 100%); }
.hero-text { flex:1.7; }
.eyebrow { font-size:13px; letter-spacing:2.5px; color:var(--gold); margin-bottom:18px; font-weight:700; }
.hero h1 { font-size:44px; line-height:1.25; color:var(--cream); font-weight:700; margin-bottom:20px; }
.hero-sub { font-size:16px; color:#A8C4C4; line-height:1.65; margin-bottom:26px; max-width:500px; }
.hero-actions { display:flex; gap:12px; flex-wrap:wrap; }
.btn-outline-light { background:transparent; border:1px solid #4A8A87; color:var(--cream); padding:13px 24px; border-radius:5px; font-size:14px; font-weight:700; text-decoration:none; cursor:pointer; font-family:'Inter',Arial,sans-serif; }
.hero-visual { flex:0.85; display:flex; align-items:center; justify-content:center; position:relative; }
.circle { width:290px; height:290px; border-radius:50%; border:3px solid var(--teal-border); position:relative; display:flex; align-items:center; justify-content:center; }
.country { position:absolute; width:95px; display:flex; flex-direction:column; align-items:center; gap:6px; }
.country img { width:95px; opacity:0.95; }
.country span { font-size:11.5px; color:#C4DCDA; letter-spacing:1px; }
.china-pos { left:6px; top:50%; transform:translateY(-50%); }
.morocco-pos { right:6px; top:50%; transform:translateY(-50%); }
.arc { position:absolute; top:36%; left:50%; transform:translate(-50%,-50%); }

/* Presence */
.presence { padding:40px 50px 10px; }
.presence-card { display:flex; align-items:center; gap:24px; background:var(--white); border-radius:10px; padding:26px; max-width:1160px; margin:0 auto; box-shadow:0 2px 14px rgba(15,61,62,0.07); transform:rotate(-0.3deg); }
.presence-icon { width:68px; height:68px; background:#E8DFC8; clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.presence-icon svg { width:30px; height:30px; }
.presence-card h3 { font-family:'Inter',Arial,sans-serif; font-size:21px; font-weight:700; color:var(--teal); margin-bottom:10px; }
.presence-card p { font-size:17px; color:var(--text-muted); line-height:1.65; }

/* Stats */
.stats { padding:30px 50px; }
.stats-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:16px; max-width:1160px; margin:0 auto; }
.stat-item { background:var(--white); border-radius:10px; padding:24px; text-align:center; box-shadow:0 2px 10px rgba(15,61,62,0.06); min-width:0; }
.stat-icon-chip { width:64px; height:64px; margin:0 auto 12px; clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); display:flex; align-items:center; justify-content:center; }
.stat-icon-chip svg { width:30px; height:30px; }
.stat-highlight { font-size:23px; font-weight:700; color:var(--teal); margin-bottom:8px; }
.stat-item p { font-size:16.5px; color:var(--text-muted); margin-top:4px; line-height:1.45; }
.stat-details { list-style:none; margin-top:12px; text-align:left; font-size:15px; color:var(--text-dark); }
.stat-details li { padding-left:20px; position:relative; margin-bottom:6px; }
.stat-details li::before { content:"•"; position:absolute; left:2px; color:var(--brass); font-weight:700; }

/* Founder testimonial */
.founder-section { padding:40px 50px; background:var(--cream-alt); }
.founder-card { max-width:820px; margin:0 auto; background:var(--white); border-radius:12px; padding:28px 32px; display:flex; align-items:center; gap:24px; box-shadow:0 3px 16px rgba(15,61,62,0.08); border-left:4px solid var(--brass); position:relative; overflow:hidden; }
.founder-card::after { content:"\201C"; position:absolute; top:-30px; right:10px; font-family:'Fraunces',serif; font-size:160px; color:rgba(184,134,11,0.08); line-height:1; pointer-events:none; }
.founder-photo { width:90px; height:90px; border-radius:50%; flex-shrink:0; object-fit:cover; object-position:center 15%; border:3px solid #E8DFC8; }
.founder-quote-mark { font-family:'Fraunces',Georgia,serif; font-size:40px; color:#E8DFC8; line-height:0.5; margin-bottom:6px; }
.founder-card p { font-style:italic; color:var(--text-dark); font-size:18px; line-height:1.6; margin-bottom:10px; }
.founder-card .signature { font-size:14px; color:var(--brass); font-weight:700; font-style:normal; }

/* Section shared */
.section { padding:64px 50px; }
.section-title { font-size:34px; text-align:center; color:var(--teal); font-weight:700; margin-bottom:10px; }
.section-subtitle { text-align:center; font-size:19px; color:var(--text-muted); margin-bottom:40px; font-weight:500; }

/* Services */
.services-section { background:var(--cream-alt); }
.services-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; max-width:1160px; margin:0 auto; }
.service-card { background:var(--white); border-radius:10px; padding:26px; box-shadow:0 2px 12px rgba(15,61,62,0.07); border-top:3px solid var(--teal-border); }
.service-card:nth-child(2) { transform:translateY(16px); border-top-color:var(--brass); }
.service-card:nth-child(3) { border-top-color:var(--teal); }
.service-icon-chip { width:60px; height:60px; clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); display:flex; align-items:center; justify-content:center; margin-bottom:14px; }
.service-icon-chip svg { width:30px; height:30px; }
.service-card h3 { font-size:22px; color:var(--teal); margin-bottom:12px; }
.service-card p { font-size:18px; color:var(--text-muted); line-height:1.6; margin-bottom:16px; }
.service-bullets { list-style:none; font-size:17px; color:var(--text-dark); }
.service-bullets li { padding-left:22px; position:relative; margin-bottom:10px; line-height:1.4; }
.service-bullets li::before { content:"✓"; position:absolute; left:0; font-weight:700; color:var(--teal-border); }
.scroll-hint { display:none; }

/* How it works */
.how-it-works { background:var(--teal); position:relative; padding-bottom:130px !important; }
.diagonal-overlay { position:absolute; bottom:0; left:0; width:100%; height:110px; }
.how-it-works .section-title, .how-it-works .section-subtitle { color:var(--cream); position:relative; z-index:1; }
.how-it-works .section-subtitle { color:#A8C4C4; }
.steps-zigzag { max-width:1000px; margin:0 auto; display:flex; flex-direction:column; gap:14px; }
.step-row { display:flex; align-items:center; gap:20px; }
.step-row:nth-child(even) { flex-direction:row-reverse; }
.step-icon-chip { width:64px; height:64px; clip-path:polygon(50% 0%,93% 25%,93% 75%,50% 100%,7% 75%,7% 25%); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.step-icon-chip svg { width:30px; height:30px; }
.step-content { background:var(--cream); border-radius:10px; padding:16px 22px; flex:1; position:relative; z-index:1; border-top:3px solid var(--teal-border); }
.step-row:nth-child(2) .step-content { border-top-color:var(--brass); }
.step-row:nth-child(4) .step-content { border-top-color:var(--brass); }
.step-content h4 { font-size:26px; color:var(--teal); margin:8px 0 12px; }
.step-content p { font-size:19px; color:var(--text-muted); line-height:1.55; margin-bottom:12px; }
.step-detail { font-size:16px; color:var(--brass); font-weight:600; }
.step-label { font-size:16px; color:var(--brass); font-weight:700; letter-spacing:1px; }

/* Contact */
.contact-v2 { background:var(--cream); }
.contact-split { display:flex; align-items:center; gap:50px; max-width:1160px; margin:0 auto; }
.contact-reassurance { flex:1.1; }
.contact-reassurance h2 { font-size:38px; color:var(--teal); margin:14px 0 18px; line-height:1.3; }
.contact-reassurance p { font-size:18px; color:var(--text-muted); line-height:1.65; margin-bottom:24px; max-width:460px; }
.reassurance-list { list-style:none; }
.reassurance-list li { font-size:16px; color:var(--text-dark); margin-bottom:14px; padding-left:22px; position:relative; }
.reassurance-list li::before { content:"→"; position:absolute; left:0; color:var(--brass); font-weight:700; }
.reassurance-list strong { color:var(--teal); }

.contact-form-wrap { flex:1; max-width:400px; background:#FFFFFF; border-radius:12px; padding:30px; box-shadow:0 8px 30px rgba(15,61,62,0.1); transform:rotate(0.4deg); border-top:4px solid var(--brass); }
.progress-dots { display:flex; align-items:center; justify-content:center; gap:10px; margin-bottom:22px; }
.progress-dot { width:28px; height:28px; border-radius:50%; border:2px solid var(--input-border); color:#9B978A; display:flex; align-items:center; justify-content:center; font-size:13px; font-weight:700; transition:all 0.2s ease; }
.progress-dot.active { border-color:var(--brass); color:var(--brass); }
.progress-dot.done { background:var(--brass); border-color:var(--brass); color:var(--teal); }
.progress-line { width:50px; height:1px; background:var(--input-border); }

.form-step { display:none; }
.form-step.active { display:block; }
.field { margin-bottom:16px; }
.field label { display:block; font-size:13px; color:var(--text-dark); margin-bottom:6px; font-weight:600; }
.field .optional { color:#9B978A; font-weight:400; }
.field input[type="text"], .field input[type="email"], .field input[type="tel"] {
  width:100%; padding:11px 12px; border:1px solid var(--input-border); border-radius:6px;
  font-size:14px; font-family:'Inter',Arial,sans-serif; color:var(--text-dark); background:#FFFFFF;
}
.field input:focus { outline:none; border-color:var(--brass); }
.volume-options { display:flex; gap:8px; }
.volume-option { flex:1; text-align:center; padding:10px 6px; border:1px solid var(--input-border); border-radius:6px; font-size:12.5px; color:var(--text-muted); cursor:pointer; background:#FFFFFF; transition:all 0.15s ease; }
.volume-option.selected { background:var(--teal); border-color:var(--teal); color:var(--cream); }
.file-drop { border:1.5px dashed var(--input-border); border-radius:6px; padding:18px 10px; text-align:center; cursor:pointer; position:relative; }
.file-drop input[type="file"] { position:absolute; inset:0; opacity:0; cursor:pointer; }
.file-drop p { font-size:12.5px; color:#9B978A; }
.form-buttons { display:flex; gap:10px; margin-top:8px; }
.btn-outline { flex:1; background:transparent; border:1px solid var(--input-border); color:var(--teal); padding:13px; border-radius:6px; font-size:14px; font-weight:700; cursor:pointer; font-family:'Inter',Arial,sans-serif; }
.btn-full { width:100%; background:var(--brass); color:var(--teal); border:none; text-align:center; padding:13px; border-radius:6px; font-size:14px; font-weight:700; cursor:pointer; font-family:'Inter',Arial,sans-serif; }
.btn-full:hover { background:#A5760A; }

/* Footer */
footer { background:#0A2C2D; padding:0 50px 20px; color:#8FAFAE; position:relative; overflow:hidden; }
.footer-brand .logo { color:var(--cream); }
.footer-watermark { position:absolute; right:-40px; top:-30px; font-family:'Fraunces',Georgia,serif; font-size:220px; font-weight:700; color:rgba(255,255,255,0.03); font-variation-settings:"WONK" 0,"SOFT" 0; pointer-events:none; line-height:1; }
.footer-accent { display:flex; height:4px; margin:0 -50px 36px; }
.footer-accent span { flex:1; }
.footer-accent span:nth-child(1) { background:var(--teal-border); }
.footer-accent span:nth-child(2) { background:var(--brass); }
.footer-accent span:nth-child(3) { background:var(--gold); }
.footer-grid { max-width:1160px; margin:0 auto; display:flex; justify-content:space-between; gap:24px; margin-bottom:24px; flex-wrap:wrap; position:relative; z-index:1; }
.footer-col-shift { transform:translateY(10px); }
footer h4 { color:var(--cream); font-size:17px; margin-bottom:14px; }
footer a, footer p { color:#8FAFAE; font-size:16px; line-height:2.2; text-decoration:none; }
footer a:hover { color:var(--gold); }
.footer-bottom { max-width:1160px; margin:0 auto; border-top:0.5px solid #1A4344; padding-top:16px; display:flex; justify-content:space-between; font-size:14.5px; position:relative; z-index:1; flex-wrap:wrap; gap:8px; }

/* Booking modal */
.modal-overlay { display:none; position:fixed; inset:0; background:rgba(15,61,62,0.6); align-items:center; justify-content:center; z-index:1000; padding:20px; }
.modal-overlay.open { display:flex; }
.modal-box { background:#FFFFFF; border-radius:12px; padding:28px; max-width:420px; width:100%; position:relative; border-top:4px solid var(--brass); }
.modal-box-calendly { max-width:480px; max-height:90vh; overflow-y:auto; }
.modal-close { position:absolute; top:14px; right:18px; cursor:pointer; font-size:20px; color:#9B978A; background:none; border:none; }
.modal-box h3 { font-size:19px; color:var(--teal); margin-bottom:6px; font-family:'Inter',Arial,sans-serif; }
.modal-box > p { font-size:13.5px; color:var(--text-muted); margin-bottom:18px; }

/* Scroll reveal animation */
[data-reveal] { opacity:0; transform:translateY(18px); transition:opacity 0.6s ease, transform 0.6s ease; }
[data-reveal].revealed { opacity:1; transform:translateY(0); }

/* Legal pages */
.legal-page { max-width:760px; margin:0 auto; padding:64px 24px; }
.legal-page h1 { font-size:28px; color:var(--teal); margin-bottom:28px; }
.legal-page h2 { font-size:18px; color:var(--teal); margin:28px 0 10px; }
.legal-page p { font-size:14.5px; color:var(--text-muted); margin-bottom:12px; line-height:1.7; }
.legal-page a.back { display:inline-block; margin-bottom:24px; font-size:13.5px; color:var(--brass); }

/* Responsive */
@media (max-width: 760px) {
  .modal-box-calendly { padding:20px; }
  .calendly-inline-widget { height:520px !important; min-width:0 !important; }
  #services, #comment-ca-marche, #contact { scroll-margin-top:85px; }
  .nav-wrap { padding:16px 20px; }
  nav ul { display:none; }
  .mobile-toggle { display:block !important; }
  .logo { font-size:24px; }

  nav.mobile-open ul {
    display:flex; flex-direction:column; position:static; width:100%;
    background:var(--cream); border-top:0.5px solid #DDD6C7; padding:20px 4px 24px; gap:18px; align-items:flex-start;
  }
  .nav-wrap { flex-wrap:wrap; }
  .nav-wrap .logo { order:1; }
  .mobile-toggle { order:2; }
  nav#mainNav { order:3; width:100%; }

  .hero { flex-direction:column; padding:40px 24px 50px; text-align:center; clip-path:polygon(0 0,100% 0,100% 96%,0 100%); }
  .hero-text { flex:none; }
  .hero h1 { font-size:28px; }
  .hero-sub { font-size:15px; margin-left:auto; margin-right:auto; }
  .hero-actions { flex-direction:column; align-items:stretch; }
  .hero-visual { flex:none; margin-top:30px; }
  .circle { width:220px; height:220px; }
  .country { width:70px; }
  .country img { width:70px; }

  .presence { padding:26px 20px 10px; }
  .presence-card { flex-direction:column; text-align:center; }

  .stats { padding:20px 20px; }
  .stats-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; width:100%; max-width:100%; }
  .stat-item:nth-child(-n+2) .stat-highlight { font-size:17px; min-height:44px; display:flex; align-items:center; justify-content:center; margin-bottom:4px; }
  .stat-item:nth-child(-n+2) p { font-size:13px; min-height:52px; }
  .stat-item:nth-child(-n+2) .stat-details { font-size:12.5px; }
  .stat-item:nth-child(3) { grid-column:1 / span 2; }

  .founder-section { padding:48px 20px 4px; }
  .founder-card { flex-direction:column; text-align:center; padding:24px 20px; }

  .section { padding:44px 0 44px 20px; }
  .section-title { font-size:26px; padding-right:20px; }
  .section-subtitle { font-size:16px; padding-right:20px; }

  .services-grid { display:flex; overflow-x:auto; overflow-y:hidden; touch-action:pan-x; gap:16px; scroll-snap-type:x mandatory; padding-bottom:10px; padding-right:20px; -webkit-overflow-scrolling:touch; }
  .services-grid::-webkit-scrollbar { display:none; }
  .service-card { width:78%; min-width:78%; max-width:78%; scroll-snap-align:center; flex-shrink:0; }
  .service-card:nth-child(2) { transform:none; }
  .scroll-hint { display:block !important; font-size:16px; font-weight:700; color:var(--brass); margin-top:14px; text-align:left; }

  .how-it-works { padding:44px 0 80px 20px !important; }
  .steps-zigzag { display:flex; flex-direction:row !important; overflow-x:auto; overflow-y:hidden; touch-action:pan-x; gap:16px; scroll-snap-type:x mandatory; padding-right:20px; padding-bottom:6px; -webkit-overflow-scrolling:touch; }
  .steps-zigzag::-webkit-scrollbar { display:none; }
  .step-row, .step-row:nth-child(even) { flex-direction:column; align-items:stretch; text-align:center; width:68%; min-width:68%; max-width:68%; scroll-snap-align:center; flex-shrink:0; }
  .step-row .step-content { width:100%; }
  .step-icon-chip { margin:0 auto; }
  .diagonal-overlay { height:70px; }

  .contact-split { flex-direction:column; gap:30px; padding-right:20px; }
  .contact-reassurance h2 { font-size:26px; }
  .contact-form-wrap { max-width:100%; transform:none; }

  footer { padding:0 20px 20px; }
  .footer-accent { margin:0 -20px 26px; }
  .footer-grid { flex-direction:column; gap:26px; }
  .footer-col-shift { transform:none; }
  .footer-watermark { font-size:140px; right:-20px; top:-10px; }
  .footer-bottom { flex-direction:column; gap:8px; text-align:center; }

  [data-reveal] { transform:translateY(10px); }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior:auto; }
  * { transition:none !important; }
  [data-reveal] { opacity:1; transform:none; }
}

a:focus-visible, button:focus-visible, input:focus-visible {
  outline:2px solid var(--brass); outline-offset:2px;
}
