/* EGMAPLAST modern-2026.css — 2026 best practices, data-preserving migration
   Layers, vars, dark mode, fluid type, a11y, no jQuery dependency.
   Keeps Bootstrap grid + old images. */
@layer tokens, base, header, hero, sections, cards, forms, footer, motion;

@layer tokens{
:root{
  --font-sans:"Plus Jakarta Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Open Sans",Arial,sans-serif;
  --brand-700:#46520F; --brand-600:#5C6B16; --brand-500:#7C8F22;
  --teal-600:#1F7A38; --teal-500:#2FA14C;
  --ink-950:#131809; --ink-800:#2A3320; --ink-500:#5C6650;
  --bg:#F7F8F1; --surface:#ffffff; --surface-2:#EFF2E2;
  --line:color-mix(in srgb,#131809 12%,transparent);
  --r-xl:22px; --r-lg:16px; --r-md:12px;
  --shadow-1:0 1px 2px rgb(19 24 9/.07),0 10px 28px -14px rgb(19 24 9/.22);
  --shadow-2:0 14px 44px -12px rgb(92 107 22/.38);
  --wrap:1180px; --pad:clamp(16px,3vw,32px);
  color-scheme:light;
}
html[data-theme="dark"]{
  color-scheme:dark;
  --bg:#0C1006; --surface:#141A0B; --surface-2:#1B2310;
  --ink-950:#eaf2fb; --ink-800:#c9d8eb; --ink-500:#90a3b9;
  --line:color-mix(in srgb,#fff 14%,transparent);
}
}
@layer base{
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:var(--font-sans);background:var(--bg);color:var(--ink-950);line-height:1.65;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
a:hover{color:var(--brand-600)}
:focus-visible{outline:3px solid var(--brand-500);outline-offset:3px;border-radius:8px}
.skip-link{position:absolute;left:-9999px;top:0;z-index:200;background:var(--ink-950);color:#fff;padding:.8rem 1.1rem;border-radius:0 0 12px 0;font-weight:700}
.skip-link:focus{left:0;color:#fff}
.wrap{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
h1{font-size:clamp(1.9rem,4vw+1rem,3.2rem);line-height:1.08;letter-spacing:-.03em;margin:.5em 0 .3em}
h2{font-size:clamp(1.35rem,2.2vw+.9rem,2rem);letter-spacing:-.02em;margin:0 0 .45em}
h3{font-size:1.2rem;margin:0 0 .4em}
h4{font-size:1.05rem;margin:0 0 .4em}
.lead{color:var(--ink-500);font-size:clamp(1rem,1vw+.85rem,1.15rem);max-width:68ch}
.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-size:.76rem;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--brand-700);background:color-mix(in srgb,var(--brand-600) 10%,transparent);border:1px solid var(--line);padding:.42rem .8rem;border-radius:999px;margin-bottom:.7rem}
html[data-theme="dark"] .eyebrow{color:#CDEB6A}
.muted{color:var(--ink-500)}
main{display:block;padding-bottom:1rem}
/* Keep old bootstrap container working with new wrap */
.container{max-width:var(--wrap);margin-inline:auto;padding-inline:var(--pad)}
/* Reveal on scroll (vanilla, replaces WOW) */
.reveal{opacity:0;transform:translateY(14px);transition:opacity .6s ease,transform .6s ease}
.reveal.in{opacity:1;transform:none}
}
@layer header{
.site-header{position:sticky;top:0;z-index:100;background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:blur(14px) saturate(1.4);-webkit-backdrop-filter:blur(14px) saturate(1.4);border-bottom:1px solid var(--line)}
.header-bar{display:flex;align-items:center;gap:1rem;padding-block:.7rem}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;font-weight:800;letter-spacing:-.02em}
.brand img{width:88px;height:88px;object-fit:contain;border-radius:12px;background:#fff;padding:3px;flex:none}
.brand-txt{font-size:1.02rem;font-weight:800;letter-spacing:-.01em;line-height:1.3}
.brand-txt small{display:block;font-weight:500;color:var(--ink-500);font-size:.82rem;letter-spacing:0}
.partner-logo{height:56px;width:auto;max-width:210px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:6px 12px;box-sizing:content-box}
.site-header .brand{flex-direction:column;align-items:flex-start;gap:0}
.site-header .brand img{width:132px;height:96px;padding:0}
.site-header .brand-txt{white-space:nowrap;line-height:1.2;margin-top:.1rem}
.site-header .brand-txt{font-size:.88rem;line-height:1.35}
.partner-cap{font-size:.8rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-500);margin:.9rem 0 .3rem}
.brand-mark{width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:#fff;font-weight:900;background:linear-gradient(135deg,var(--brand-600),var(--teal-500));box-shadow:var(--shadow-2);flex:none}
.brand small{display:block;font-weight:500;color:var(--ink-500);font-size:.78rem;letter-spacing:0}
.main-nav{margin-left:auto;display:flex;gap:.1rem;align-items:center}
.main-nav a{position:relative;text-decoration:none;font-weight:700;font-size:.98rem;letter-spacing:-.01em;color:var(--ink-800);padding:.7rem .95rem;border-radius:12px;min-height:44px;display:inline-flex;align-items:center;transition:background .2s,color .2s}
.main-nav a::after{content:"";position:absolute;left:.95rem;right:.95rem;bottom:.3rem;height:3px;border-radius:99px;background:linear-gradient(90deg,var(--brand-600),var(--teal-500));transform:scaleX(0);transform-origin:left;transition:transform .25s ease}
.main-nav a:hover{color:var(--brand-600);background:color-mix(in srgb,var(--brand-600) 8%,transparent)}
.main-nav a:hover::after{transform:scaleX(.55)}
.main-nav a[aria-current="page"]{color:var(--brand-700);background:color-mix(in srgb,var(--brand-600) 10%,transparent)}
.main-nav a[aria-current="page"]::after{transform:scaleX(1)}
html[data-theme="dark"] .main-nav a[aria-current="page"]{color:#CDEB6A}
.header-actions{display:flex;gap:.5rem;align-items:center}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:48px;padding:.8rem 1.35rem;border-radius:999px;font-weight:750;border:1px solid transparent;cursor:pointer;text-decoration:none;transition:transform .18s,box-shadow .18s,background .18s}
.btn-primary{background:linear-gradient(135deg,var(--brand-600),var(--brand-500));color:#fff;box-shadow:var(--shadow-2)}
.btn-primary:hover{transform:translateY(-1px);color:#fff}
.btn-ghost{border-color:var(--line);background:var(--surface)}
.icon-btn{width:48px;height:48px;border-radius:999px;border:1px solid var(--line);background:var(--surface);color:inherit;font-size:1.15rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center}
.burger{display:none}
.topbar{font-size:.82rem;color:var(--ink-500);border-bottom:1px dashed var(--line);padding-block:.35rem}
.topbar .wrap{display:flex;gap:1rem;justify-content:flex-end;flex-wrap:wrap}
.topbar a{text-decoration:none;font-weight:600}
}
@layer hero{
.hero{position:relative;overflow:hidden;border-bottom:1px solid var(--line);background:radial-gradient(1100px 480px at 85% -10%,color-mix(in srgb,var(--brand-500) 20%,transparent),transparent 60%),radial-gradient(800px 460px at 8% 8%,color-mix(in srgb,var(--teal-500) 16%,transparent),transparent 60%),var(--bg)}
.hero-inner{display:grid;grid-template-columns:1.05fr .95fr;gap:clamp(1.4rem,3.5vw,3rem);padding-block:clamp(1.8rem,4.5vw,3.8rem);align-items:center}
.hero-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--shadow-1);padding:1rem}
.hero-media{border-radius:var(--r-lg);overflow:hidden;position:relative;aspect-ratio:4/3;background:var(--surface-2)}
.hero-media img{width:100%;height:100%;object-fit:cover}
.hero-badge{position:absolute;left:12px;bottom:12px;background:rgb(0 0 0/.68);color:#fff;font-size:.78rem;padding:.45rem .7rem;border-radius:999px}
.cta-row{display:flex;gap:.7rem;flex-wrap:wrap;margin-top:1.1rem}
.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:.7rem;margin-top:1.1rem}
.stat{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-md);padding:.85rem;text-align:center}
.stat b{display:block;font-size:1.25rem}
.stat span{font-size:.8rem;color:var(--ink-500)}
.hero-slider{position:relative}
.hero-dots{display:flex;gap:.45rem;margin-top:.7rem}
.hero-dots button{width:44px;height:12px;border-radius:999px;border:1px solid var(--line);background:color-mix(in srgb,var(--ink-950) 12%,transparent);cursor:pointer}
.hero-dots button[aria-selected="true"]{background:var(--brand-600);border-color:var(--brand-600)}
/* Home image slider: full-width banner, auto-rotate, vanilla */
section.hero-slider{border-bottom:1px solid var(--line);background:var(--bg);padding-block:1.2rem}
#heroSlider{border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-2);border:1px solid var(--line);background:#0C1006}
.hs-slide{position:relative;display:block;width:100%;height:480px;background-color:#0C1006;background-size:cover;background-position:center;overflow:hidden}
.hs-slide::before{content:"";position:absolute;inset:0;background:linear-gradient(180deg,rgb(12 16 6/.15) 0%,rgb(12 16 6/.55) 100%)}
.hs-slide>img{display:none}
.hs-slide{animation:hsfade .6s ease}
@keyframes hsfade{from{opacity:.2}to{opacity:1}}
.hs-slide[hidden]{display:none}
.hs-content{position:absolute;z-index:1;left:clamp(1rem,4vw,2.5rem);right:clamp(1rem,4vw,2.5rem);bottom:clamp(1rem,4vw,2.5rem);max-width:64ch;color:#131809;background:color-mix(in srgb,#ffffff 88%,transparent);backdrop-filter:blur(20px) saturate(1.5);-webkit-backdrop-filter:blur(20px) saturate(1.5);border:1px solid rgb(255 255 255/.7);border-radius:20px;padding:clamp(1.2rem,3vw,2rem) clamp(1.2rem,3.5vw,2.2rem);box-shadow:0 16px 48px -12px rgb(12 16 6/.5)}
.hs-content h1{color:#131809;margin:.25em 0 .15em;font-size:clamp(1.5rem,3.2vw+1rem,2.4rem);font-weight:800;letter-spacing:-.03em;line-height:1.08;text-wrap:balance}
.hs-content .eyebrow{color:#fff;background:linear-gradient(135deg,#5C6B16,#2FA14C);border:0;font-weight:800;box-shadow:0 6px 18px -8px rgb(92 107 22/.7)}
.hs-sub{font-size:clamp(.95rem,1.2vw+.85rem,1.1rem);color:var(--ink-800);margin:.4em 0 0;font-weight:500}
.grad{background:none;color:#46520F}
.hs-dots{display:flex;gap:.5rem;padding-block:.9rem}
.hs-dots button{width:52px;height:14px;border-radius:999px;border:1px solid rgb(255 255 255/.4);background:rgb(255 255 255/.25);cursor:pointer;transition:background .3s,border-color .3s}
.hs-dots button:hover{background:rgb(255 255 255/.45)}
.hs-dots button[aria-selected="true"]{background:var(--brand-500);border-color:var(--brand-500)}
section.hero-slider .hs-dots{background:var(--bg)}
.a-banner .hero-inner{grid-template-columns:1fr;padding-block:1.6rem}
.crumb{font-size:.85rem;color:var(--ink-500)}
.crumb a{font-weight:650}
}
@layer sections{
.section{padding-block:clamp(1.8rem,4.5vw,3.5rem)}
.split{display:grid;grid-template-columns:.95fr 1.05fr;gap:clamp(1.2rem,3vw,2.5rem);align-items:start}
.panel{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-xl);box-shadow:var(--shadow-1);padding:clamp(1.1rem,2.5vw,1.7rem)}
.photo{border-radius:var(--r-lg);overflow:hidden;border:1px solid var(--line);background:var(--surface-2)}
.photo img{width:100%;height:100%;object-fit:cover}
.chips{display:flex;gap:.55rem;flex-wrap:wrap;margin-top:.9rem}
.chip{border:1px solid var(--line);background:var(--surface);border-radius:999px;padding:.5rem .85rem;font-size:.84rem;font-weight:650}
.cert{display:grid;grid-template-columns:1fr;gap:1rem;align-items:start}
.cert a.cert-img{display:block;background:#fff;border:1px solid var(--line);border-radius:var(--r-lg);padding:1.2rem 1.5rem;width:100%;box-shadow:var(--shadow-1);transition:transform .25s,box-shadow .25s,border-color .25s;box-sizing:border-box}
.cert a.cert-img:hover{transform:translateY(-3px);box-shadow:var(--shadow-2);border-color:var(--brand-600)}
.cert a.cert-img img{width:100%;height:auto;max-width:100%;border:0;border-radius:0;display:block;box-sizing:border-box;object-fit:cover}
.map-frame{border:1px solid var(--line);border-radius:var(--r-xl);overflow:hidden;box-shadow:var(--shadow-1);background:var(--surface)}
.map-frame iframe{width:100%;height:min(450px,70vw);border:0;display:block}
}
@layer cards{
.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:1rem;margin-top:1.3rem}
.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:1rem;margin-top:1.3rem}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-lg);overflow:hidden;box-shadow:var(--shadow-1);display:flex;flex-direction:column;transition:transform .22s}
.card:hover{transform:translateY(-4px)}
.card figure{margin:0;aspect-ratio:16/10;overflow:hidden;background:var(--surface-2)}
.card figure img{width:100%;height:100%;object-fit:cover}
.card-body{padding:1.05rem;display:flex;flex-direction:column;gap:.5rem;flex:1}
.card-body p{margin:0;color:var(--ink-500);font-size:.92rem;flex:1}
.card-link{font-weight:750;color:var(--brand-600);text-decoration:none}
}
@layer forms{
label{display:block;font-weight:650;font-size:.9rem;margin-bottom:.35rem}
input[type="text"],input[type="email"],input:not([type]),textarea{width:100%;padding:.9rem 1rem;border-radius:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--surface) 65%,var(--bg));color:inherit;font:inherit;min-height:48px}
textarea{min-height:130px;resize:vertical}
input:user-invalid,textarea:user-invalid{border-color:#d92d20}
.hint{font-size:.83rem;color:var(--ink-500)}
.form-grid{display:grid;gap:.85rem}
.alert{border-radius:12px;padding:.8rem 1rem;border:1px solid var(--line);background:var(--surface-2);margin:.8rem 0}
.alert-ok{border-color:color-mix(in srgb,var(--teal-600) 50%,transparent);background:color-mix(in srgb,var(--teal-500) 12%,var(--surface))}
}
@layer footer{
.site-footer{border-top:1px solid var(--line);background:var(--surface);margin-top:1rem}
.footer-grid{display:grid;grid-template-columns:1.2fr .9fr .9fr;gap:1.2rem;padding-block:1.8rem}
.footer-grid ul{list-style:none;margin:.6rem 0 0;padding:0;display:grid;gap:.15rem}
.footer-grid ul a{display:inline-flex;min-height:44px;align-items:center;text-decoration:none;font-weight:600}
.footer-grid ul a:hover{color:var(--brand-600);text-decoration:underline}
.foot-note{font-size:.82rem;color:var(--ink-500)}
.social-row{display:flex;gap:.5rem;margin-top:.7rem}
.social-btn{width:48px;height:48px;border-radius:999px;border:1px solid var(--line);display:inline-flex;align-items:center;justify-content:center;text-decoration:none;font-weight:800;background:var(--bg)}
.copyright{border-top:1px solid var(--line);padding-block:1rem;font-size:.87rem;color:var(--ink-500)}
.copyright .wrap{display:flex;justify-content:space-between;gap:.8rem;flex-wrap:wrap}
.newsletter{display:flex;gap:.5rem;margin-top:.7rem}
.newsletter input{flex:1}
}
@layer motion{
@media (prefers-reduced-motion:reduce){
html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.reveal{opacity:1;transform:none}
}
@media (max-width:960px){
.hs-slide{height:300px}
.hs-content h1{font-size:clamp(1.15rem,4.5vw+.8rem,1.5rem)}
.hero-inner,.split,.footer-grid{grid-template-columns:1fr}
.grid-4{grid-template-columns:1fr 1fr}
.main-nav{display:none}
.main-nav.open{display:flex;position:absolute;top:calc(100% + .5rem);left:var(--pad);right:var(--pad);background:var(--surface);flex-direction:column;align-items:stretch;padding:.6rem;gap:.2rem;border:1px solid var(--line);border-radius:var(--r-lg);box-shadow:var(--shadow-2)}
.burger{display:inline-flex}
.cert{grid-template-columns:1fr}
.topbar{display:none}
}
@media (max-width:560px){.grid-4,.grid-2{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}}
}
/* === Safety net (unlayered): guarantees contrast even if another CSS loads later === */
html[data-theme="light"] body{background:#F7F8F1;color:#131809}
html[data-theme="light"] .site-header{background:rgba(255,255,255,.92)}
html[data-theme="light"] .main-nav a{color:#131809}
html[data-theme="light"] .main-nav a[aria-current="page"]{color:#46520F;background:rgba(92,107,22,.12)}
html[data-theme="light"] h1,html[data-theme="light"] h2,html[data-theme="light"] h3{color:#131809}
html[data-theme="light"] .btn-primary{background:linear-gradient(135deg,#5C6B16,#7C8F22);color:#fff;border-radius:999px}
html[data-theme="dark"] body{background:#0C1006;color:#eaf2fb}
html[data-theme="dark"] .main-nav a{color:#eaf2fb}
