/* JSL Code — Atmospheric Dark Lime V2.
   Gentle ambient lime glows, legible typography, no changes to hero or featured project cards.
   Overrides are scoped to editorial sections only. */
:root{
  --ambient-base:#151b19;
  --ambient-deep:#101716;
  --ambient-panel:#1d2926;
  --ambient-text:#f1f5f2;
  --ambient-muted:#bfccc5;
  --ambient-line:#354b43;
  --ambient-accent:#b6ff00;
}
/* Preserve original hero and navigation; lift the surrounding dark canvas subtly. */
.intro-section,.about-section,.credentials-section{
  position:relative;
  isolation:isolate;
  color:var(--ambient-text);
  overflow:hidden;
}
.intro-section{
  background:
    radial-gradient(ellipse 56% 58% at 94% 11%,rgba(150,225,35,.115),transparent 72%),
    radial-gradient(ellipse 42% 44% at 2% 86%,rgba(65,154,123,.12),transparent 76%),
    linear-gradient(135deg,#18211d 0%,#151c1a 58%,#1a2420 100%);
}
.about-section{
  background:
    radial-gradient(ellipse 48% 70% at 1% 32%,rgba(151,209,45,.10),transparent 78%),
    radial-gradient(ellipse 50% 60% at 94% 95%,rgba(50,145,136,.13),transparent 72%),
    linear-gradient(135deg,#18201d 0%,#111a18 70%,#19241f 100%);
}
.credentials-section{
  border-top:1px solid var(--ambient-line);
  background:
    radial-gradient(ellipse 52% 70% at 90% 18%,rgba(161,233,44,.12),transparent 74%),
    radial-gradient(ellipse 46% 50% at 10% 87%,rgba(60,144,108,.12),transparent 72%),
    linear-gradient(130deg,#1a2420,#17221e 58%,#202c24);
}
.intro-section::before,.about-section::before,.credentials-section::before{
  content:"";position:absolute;z-index:-1;pointer-events:none;
  width:min(46vw,520px);aspect-ratio:1;border:1px solid rgba(182,255,0,.065);
  border-radius:50%;filter:blur(1px);
}
.intro-section::before{right:-18%;top:11%;box-shadow:0 0 125px 60px rgba(147,215,20,.025)}
.about-section::before{left:-22%;top:6%;box-shadow:0 0 115px 45px rgba(71,170,129,.035)}
.credentials-section::before{right:-17%;bottom:-20%;box-shadow:0 0 125px 50px rgba(135,201,45,.025)}
/* Deliberate text hierarchy: lime for small signals, white for titles. */
.intro-section .section-heading h2,.intro-section .service-item h3,
.about-section h2,.about-section .about-facts strong,
.credentials-section h2,.credentials-section .credential h3{
  color:var(--ambient-text)
}
.intro-section .section-heading h2 em,.about-section h2 em,.credentials-section h2 em{
  color:var(--ambient-accent)
}
.intro-section .section-index,.about-section .section-index,.credentials-section .section-index,
.intro-section .service-number,.intro-section .service-arrow{color:var(--ambient-accent)}
.intro-section .section-heading>p:last-child,.intro-section .service-item p:not(.service-tools),
.about-section .about-copy>p,.credentials-section .credentials-header>p,
.credentials-section .credential p,.credentials-section .credential-meta,
.credentials-section .credential-subtitle,.credentials-section .credentials-note{
  color:var(--ambient-muted)
}
.intro-section .services,.intro-section .service-item,.about-section .about-facts,
.credentials-section .credentials-list,.credentials-section .credential{
  border-color:var(--ambient-line)
}
.intro-section .service-tools{color:#c4ef75;opacity:1}
.about-section .about-facts span{color:var(--ambient-muted)}
.about-section .text-link,.about-section .text-link:visited{color:var(--ambient-accent)}
.credentials-section .credential-mark{
  background:linear-gradient(140deg,#253b2a,#1b2a25);
  color:var(--ambient-accent);border-color:#4a6651
}
.credentials-section .credential-tag,.credentials-section .credential-link,
.credentials-section .credential-link:visited{color:var(--ambient-accent)}
.credentials-section .credential-link:hover,.about-section .text-link:hover{color:#d5ff7f}
/* Projects: only background lighting and optional archive. The three featured
   project cards (artwork, gradients, dimensions and content) are unchanged. */
.work-section{
  background:
    radial-gradient(ellipse 48% 58% at 88% 7%,rgba(83,170,136,.12),transparent 72%),
    radial-gradient(ellipse 55% 40% at 8% 90%,rgba(155,232,39,.075),transparent 80%),
    linear-gradient(130deg,#17282a,#192b2d 55%,#142426);
  border-color:#314e4e
}
.work-section .work-heading>p{color:#cedbd7}
.archive-details{margin-top:55px;padding-top:25px;border-color:#476260}
.archive-details summary{
  display:flex;align-items:center;justify-content:space-between;gap:20px;
  border:1px solid #4c6865;border-radius:10px;padding:19px 22px;
  color:var(--ambient-text);background:rgba(37,59,57,.82);font-size:1rem;
  transition:border-color .2s,background .2s
}
.archive-details summary:hover,.archive-details summary:focus-visible{
  border-color:var(--ambient-accent);background:#304945
}
.archive-details summary span{color:var(--ambient-accent)}
.archive-details[open] summary{border-radius:10px 10px 0 0}
.archive-grid{
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;
  padding:20px;border:1px solid #4c6865;border-top:0;border-radius:0 0 10px 10px;
  background:rgba(22,39,38,.86)
}
.archive-grid a,.archive-grid a:visited{
  display:flex;align-items:center;gap:14px;min-height:65px;padding:17px 18px;
  border:1px solid #435e5c;border-radius:8px;color:#e4efeb;
  background:rgba(44,70,66,.78);font-size:.91rem;
  transition:border-color .2s,background .2s
}
.archive-grid a span{color:var(--ambient-accent);margin-left:auto}
.archive-grid a:hover,.archive-grid a:focus-visible{
  color:#fff;border-color:var(--ambient-accent);background:#34514c
}
/* A dark ending echoes the hero without repeating its composition. */
.contact-section{
  background:
    radial-gradient(ellipse 50% 100% at 91% 45%,rgba(157,222,42,.13),transparent 76%),
    linear-gradient(115deg,#111713,#17211a 55%,#18241a);
  border-top:1px solid #3b5140
}
@media(max-width:750px){
  .archive-grid{grid-template-columns:1fr;padding:12px}
  .archive-details summary{padding:16px}
  .archive-grid a{min-height:55px}
  .intro-section::before,.about-section::before,.credentials-section::before{width:75vw}
  .intro-section{background:radial-gradient(ellipse 85% 38% at 100% 10%,rgba(150,225,35,.09),transparent 80%),linear-gradient(135deg,#19221e,#141c19)}
  .about-section{background:radial-gradient(ellipse 78% 38% at 0% 22%,rgba(89,180,128,.09),transparent 80%),linear-gradient(130deg,#19211e,#151c19)}
}
@media(prefers-reduced-motion:reduce){
  .archive-details summary,.archive-grid a{transition:none}
}

/* Secondary portfolio gallery: small visual cards, featured project cards unchanged. */
.archive-summary-meta{margin-left:auto;color:#a8bbb6;font-size:.78rem;font-weight:400;letter-spacing:.01em}
.archive-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;padding:22px}
.archive-grid a.archive-card,.archive-grid a.archive-card:visited{
  display:block;min-height:0;padding:0;overflow:hidden;
  border:1px solid #405c58;border-radius:11px;
  background:#1b2928;color:#f1f5f2;text-decoration:none;
  transition:transform .2s ease,border-color .2s ease,box-shadow .2s ease
}
.archive-grid a.archive-card:hover,.archive-grid a.archive-card:focus-visible{
  transform:translateY(-3px);border-color:#b6ff00;
  box-shadow:0 14px 28px rgba(0,0,0,.22)
}
.archive-card-art{
  min-height:158px;aspect-ratio:2.6 / 1;position:relative;
  display:flex;align-items:flex-start;justify-content:space-between;
  padding:17px;overflow:hidden;
  background-color:#202e2c;background-position:center 18%;background-size:cover
}
.archive-card-art::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(5,14,13,.6),rgba(9,19,17,.04) 60%,rgba(9,19,17,.25))}
.archive-card-index,.archive-card-arrow{position:relative;z-index:1;color:#f5f7f5;letter-spacing:.12em;font-size:.66rem;font-weight:700}
.archive-card-arrow{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(245,247,245,.5);border-radius:50%;font-size:.95rem;letter-spacing:0;background:rgba(12,24,22,.4)}
.archive-card-caption{padding:20px 21px 22px;display:flex;flex-direction:column;gap:7px}
.archive-card-kind{font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:#b6ff00;font-weight:700}
.archive-card-caption strong{font-size:1.12rem;line-height:1.32;letter-spacing:-.02em;color:#f4f7f5}
.archive-card.archive-flow .archive-card-art{background-image:linear-gradient(110deg,rgba(33,28,42,.28),rgba(18,16,30,.15)),url('images/flow_events.png')}
.archive-card.archive-mdlp .archive-card-art{background-image:linear-gradient(110deg,rgba(26,35,34,.24),rgba(16,24,22,.12)),url('images/Site-mdlp.png')}
.archive-card.archive-weather .archive-card-art{background-image:linear-gradient(110deg,rgba(12,42,58,.24),rgba(20,35,49,.1)),url('images/meteo.png')}
.archive-card.archive-hangman .archive-card-art{background-image:linear-gradient(110deg,rgba(30,32,38,.25),rgba(16,20,27,.12)),url('images/hangman.png')}
.archive-card.archive-twitter .archive-card-art{background-image:linear-gradient(110deg,rgba(12,31,48,.28),rgba(19,34,55,.15)),url('images/TwitterClone.png')}
.archive-card.archive-lumiere .archive-card-art{background-image:linear-gradient(110deg,rgba(45,27,39,.28),rgba(22,18,31,.12)),url('images/Site-lumiere.png')}
.archive-card.archive-judo .archive-card-art{background-image:linear-gradient(110deg,rgba(36,27,24,.28),rgba(25,20,18,.12)),url('images/Site-ours.png')}
@media(max-width:750px){
  .archive-grid{grid-template-columns:1fr;gap:15px;padding:13px}
  .archive-card-art{min-height:145px}
  .archive-summary-meta{display:none}
}
@media(prefers-reduced-motion:reduce){
  .archive-grid a.archive-card{transition:none}
}

/* Mini-projects: exact visual vocabulary of the 3 flagship project cards,
   deliberately compact; individual accent/gradient per project. */
.archive-details .mini-project-grid{
 display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;
 padding:20px;background:rgba(22,39,38,.52);align-items:stretch
}
.mini-project{min-width:0;display:flex;flex-direction:column;background:#202020;
 border:1px solid #354342;border-radius:12px;overflow:hidden}
.mini-project .mini-project-visual{
 min-height:145px;height:145px;padding:17px 18px;aspect-ratio:auto;
 background:radial-gradient(ellipse at 78% 65%,color-mix(in srgb,var(--mini-accent),transparent 70%),transparent 72%),linear-gradient(145deg,#172329,#0e1318);
 display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between
}
.mini-project .mini-project-visual::after{display:none}
.mini-project-visual .visual-overline,.mini-project-visual .visual-bottom{
 color:#d5dddf;font-size:.56rem;line-height:1.4;letter-spacing:.14em;font-weight:700
}
.mini-project-visual strong{font-size:clamp(1.5rem,2.2vw,2.15rem);letter-spacing:-.06em;line-height:1.03;color:#f5f5f5;overflow-wrap:anywhere}
.mini-project-visual strong span{color:var(--mini-accent);display:inline}
.mini-project .mini-project-copy{display:flex;flex-direction:column;align-items:flex-start;flex:1;padding:19px 20px 21px}
.mini-project .project-type{color:var(--mini-accent);font-size:.62rem;letter-spacing:.12em;line-height:1.5}
.mini-project .project-copy h3{font-size:1.12rem;line-height:1.25;color:#f5f5f5;margin:10px 0}
.mini-project .project-copy p{color:#bfcac7;font-size:.83rem;line-height:1.6;margin:0 0 18px}
.mini-project .project-link,.mini-project .project-link:visited{margin-top:auto;font-size:.8rem;color:var(--mini-accent);gap:12px}
.mini-project .project-link:hover{filter:brightness(1.18)}
.mini-flow .mini-project-visual{background:radial-gradient(ellipse at 80% 65%,rgba(233,123,157,.32),transparent 75%),linear-gradient(135deg,#342633,#14151d)}
.mini-mdlp .mini-project-visual{background:radial-gradient(ellipse at 78% 65%,rgba(242,140,67,.30),transparent 75%),linear-gradient(135deg,#35241a,#16191c)}
.mini-weather .mini-project-visual{background:radial-gradient(ellipse at 78% 65%,rgba(103,217,240,.32),transparent 75%),linear-gradient(135deg,#173649,#101c2c)}
.mini-hangman .mini-project-visual{background:radial-gradient(ellipse at 78% 65%,rgba(248,195,92,.26),transparent 75%),linear-gradient(135deg,#322d20,#181a1b)}
.mini-twitter .mini-project-visual{background:radial-gradient(ellipse at 78% 65%,rgba(101,175,255,.31),transparent 75%),linear-gradient(135deg,#1b304b,#121b29)}
.mini-lumiere .mini-project-visual{background:radial-gradient(ellipse at 78% 65%,rgba(230,203,145,.29),transparent 75%),linear-gradient(135deg,#332c2a,#1b171e)}
.mini-judo .mini-project-visual{background:radial-gradient(ellipse at 78% 65%,rgba(231,116,116,.31),transparent 75%),linear-gradient(135deg,#382127,#181719)}
@media(max-width:950px){.archive-details .mini-project-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mini-project .mini-project-visual{height:150px}}
@media(max-width:600px){.archive-details .mini-project-grid{grid-template-columns:1fr;gap:13px;padding:12px}.mini-project .mini-project-visual{height:140px;min-height:140px}.mini-project .mini-project-copy{padding:17px 19px 19px}.mini-project-visual strong{font-size:2rem}}

/* Navbar & link refinement: readable labels and restrained lime highlights. */
header{background:rgba(15,19,17,.96);border-bottom-color:#35483a}
header .jsl-brand,header .jsl-brand:visited,header nav a,header nav a:visited{text-decoration:none}
header nav ul{gap:8px 12px}
header nav ul li a:not(.nav-contact),header nav ul li a:not(.nav-contact):visited{
 display:inline-block;padding:9px 11px;border-radius:7px;color:#e3eae6;
 font-weight:500;font-size:.89rem;line-height:1.3;text-decoration:none;
 transition:background-color .18s,color .18s
}
header nav ul li a:not(.nav-contact):hover,header nav ul li a:not(.nav-contact):focus-visible{
 color:#b6ff00;background:rgba(182,255,0,.09);text-decoration:none
}
header nav ul li .nav-contact,header nav ul li .nav-contact:visited{
 display:inline-flex;align-items:center;justify-content:center;padding:10px 17px;
 border-radius:7px;background:#b6ff00;color:#111611;font-size:.86rem;
 font-weight:700;text-decoration:none;white-space:nowrap;
 transition:background .18s,transform .18s
}
header nav ul li .nav-contact:hover,header nav ul li .nav-contact:focus-visible{
 background:#d5ff7c;color:#111611;transform:translateY(-1px)
}
.jsl-brand:hover,.jsl-brand:focus-visible{text-decoration:none}
.project-link,.project-link:visited,.credential-link,.credential-link:visited,
.text-link,.text-link:visited,.jsl-primary,.jsl-primary:visited,
.jsl-secondary,.jsl-secondary:visited{text-decoration:none}
.project-link:not(.project-link-muted):hover,.credential-link:hover,.text-link:hover{
 text-decoration:none;filter:brightness(1.17)
}
.archive-details summary>span[aria-hidden="true"]{font-size:1.4rem;line-height:1;transition:transform .2s}
.archive-details[open] summary>span[aria-hidden="true"]{transform:rotate(180deg)}
@media(max-width:750px){
 header nav ul{gap:5px 8px}
 header nav ul li a:not(.nav-contact){padding:9px 8px}
 header nav ul li .nav-contact{padding:9px 13px}
}
@media(prefers-reduced-motion:reduce){
 header nav a,.archive-details summary>span[aria-hidden="true"]{transition:none!important}
}

/* Separate the contact CTA from the menu without disturbing mobile wrapping. */
@media(min-width:1001px){
 header nav ul li:last-child{margin-left:clamp(18px,3vw,48px)}
}
@media(min-width:751px) and (max-width:1000px){
 header nav ul li:last-child{margin-left:12px}
}
@media(max-width:750px){
 header nav ul li:last-child{margin-left:0}
}

/* Remove the stray list marker only from the navbar contact item. */
header nav ul li:last-child{list-style:none}
header nav ul li:last-child::marker{content:""}
header nav ul li:last-child::before{content:none!important;display:none!important}

/* Screenshot review — navbar, hero cleanup, and copyright alignment. */
header #flex-header{display:flex;align-items:center;justify-content:space-between}
header nav ul{list-style:none!important;margin:0;padding:0;align-items:center}
header nav ul li{list-style:none!important;position:relative}
header nav ul li::before,header nav ul li::after{content:none!important;display:none!important}
header nav ul li::marker{content:""}
header nav ul li a{vertical-align:middle}
.jsl-eyebrow .jsl-dot{vertical-align:middle}
footer .container{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}
footer .footer-copyright{display:inline-block;white-space:nowrap;line-height:1.5}
footer .footer-copyright #current-year{display:inline}
footer ul{margin:0;padding:0;list-style:none}
footer ul li::before{content:none!important;display:none!important}
@media(max-width:750px){
 header #flex-header{align-items:flex-start}
 footer .container{align-items:flex-start}
}
@media(max-width:380px){footer .footer-copyright{white-space:normal}}

/* Testimonials restored from the original website, presented without Bootstrap. */
.testimonials-section{
 position:relative;overflow:hidden;
 background:radial-gradient(ellipse at 92% 15%,rgba(182,255,0,.10),transparent 48%),
 radial-gradient(ellipse at 5% 95%,rgba(52,130,113,.13),transparent 45%),#131c19;
 border-top:1px solid #31473d;border-bottom:1px solid #31473d
}
.testimonials-section .section-heading h2{color:#f4f6f4}
.testimonials-section .section-heading h2 em{color:#b6ff00}
.testimonials-section .section-heading>p:last-child{color:#bdc9c2}
.testimonials-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:stretch;gap:22px}
.testimonial-card{
 display:flex;flex-direction:column;justify-content:space-between;
 margin:0;padding:34px 32px 28px;
 border:1px solid #3b5547;border-radius:13px;
 background:linear-gradient(150deg,rgba(36,52,43,.95),rgba(22,32,28,.96));
 box-shadow:0 20px 50px rgba(0,0,0,.12)
}
.testimonial-card blockquote{margin:0}
.testimonial-quote-mark{display:block;font-size:3.5rem;line-height:.9;color:#b6ff00;font-weight:700}
.testimonial-card blockquote p{margin:17px 0 28px;line-height:1.85;color:#e0e9e2;font-size:.96rem}
.testimonial-author{display:flex;gap:14px;align-items:center;border-top:1px solid #3b5547;padding-top:20px}
.testimonial-author img{width:52px;height:52px;object-fit:cover;border-radius:50%;border:2px solid #52664c}
.testimonial-author span{display:flex;flex-direction:column;gap:2px;min-width:0}
.testimonial-author strong{font-size:.94rem;color:#f5f8f5}
.testimonial-author small{font-size:.8rem;color:#bdd0c4}
@media(max-width:850px){.testimonials-grid{grid-template-columns:1fr}}
@media(max-width:480px){.testimonial-card{padding:25px 22px 23px}.testimonial-card blockquote p{font-size:.9rem;line-height:1.75}}
