/*
Theme Name: NIMUE GREECE
Theme URI: https://adamit.gr/
Description: Custom landing theme for the NIMUE GREECE brand presentation. Professional skincare for aesthetic institutes and consumers. Clean, minimal, premium, responsive, SEO ready. Built by Adamit.
Author: Adamit
Author URI: https://adamit.gr/
Version: 3.7.0
Requires at least: 6.0
Tested up to: 7.1
Requires PHP: 8.0
Text Domain: nimue
*/

:root{
  --ink:#121417; --ink-deep:#0c0e10; --ink-soft:#363b40;
  --silver:#a9adb0; --muted:#6a7277; --faint:#99a1a6;
  --accent:#5f7a87; --accent-dark:#4c6672;
  --blue:#cfdae0; --blue-wash:#eef3f5; --blue-soft:#dde6ea;
  --white:#ffffff; --mist:#f3f5f6; --mist-2:#e9edef; --mist-3:#e2e7e9;
  --line:#e2e7e9; --line-2:#d3d9dc; --cool:#cedbe3;
  --on-dark:rgba(255,255,255,.72); --line-dark:rgba(255,255,255,.14);
  --maxw:1240px; --gutter:clamp(16px,5vw,46px);
  --head:'Manrope',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --body:'Manrope',system-ui,-apple-system,'Segoe UI',Arial,sans-serif;
  --shadow:0 30px 70px -44px rgba(28,32,35,.4);
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; overflow-x:clip; scroll-padding-top:90px}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{
  margin:0; background:var(--white); color:var(--ink);
  font-family:var(--body); font-size:16.5px; line-height:1.64; font-weight:400;
  -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility;
  overflow-x:clip; width:100%; max-width:100vw;
}
h1,h2,h3,h4{font-family:var(--head); font-weight:600; line-height:1.1; margin:0; letter-spacing:-.018em; color:var(--ink)}
p{margin:0}
a{color:inherit; text-decoration:none}
img,svg{display:block; max-width:100%}
.wrap{max-width:var(--maxw); margin:0 auto; padding-inline:var(--gutter)}

/* labels */
.eyebrow{
  font-family:var(--head); font-weight:700; font-size:12px; letter-spacing:.26em;
  text-transform:uppercase; color:var(--accent); display:inline-flex; align-items:center;
}
.eyebrow.center{justify-content:center}
.secnum{font-family:var(--head); font-weight:700; font-size:12px; letter-spacing:.2em; color:var(--faint); text-transform:uppercase}

/* section rhythm */
.sec{padding:clamp(66px,9vw,120px) 0}
.sechead{margin-bottom:clamp(34px,5vw,58px); max-width:720px}
.sechead.center{margin-inline:auto; text-align:center}
.sechead h2{font-size:clamp(28px,4.4vw,46px); margin-top:16px; font-weight:600}
.sechead p{margin-top:18px; color:var(--muted); font-size:clamp(16px,1.6vw,18px)}

/* buttons */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:11px;
  font-family:var(--head); font-weight:600; font-size:12.5px; letter-spacing:.14em; text-transform:uppercase;
  padding:17px 30px; border:1px solid transparent; border-radius:0; cursor:pointer;
  transition:background .2s ease, color .2s ease, border-color .2s ease, transform .2s ease;
  white-space:nowrap;
}
.btn svg{width:15px;height:15px}
.btn-accent{background:var(--ink); color:#fff}
.btn-accent:hover{background:#000}
.btn-dark{background:var(--ink); color:#fff}
.btn-dark:hover{background:#000}
.btn-outline{background:transparent; border-color:rgba(18,20,23,.3); color:var(--ink)}
.btn-outline:hover{border-color:var(--ink); background:var(--ink); color:#fff}
/* cursor pointer on every interactive element */
a[href], button, label, select, summary, [role="tab"], [role="button"], [onclick],
input[type="checkbox"], input[type="radio"], input[type="submit"], input[type="button"]{cursor:pointer}
.btn-outline-light{background:transparent; border-color:rgba(255,255,255,.4); color:#fff}
.btn-outline-light:hover{background:#fff; color:var(--ink); border-color:#fff}
:focus-visible{outline:2px solid var(--accent); outline-offset:3px}

/* brand lockup */
.brandmark{display:inline-flex; align-items:center; gap:13px}
.brandmark .mk{width:26px; height:26px; flex:none}
.brandmark .wm{display:flex; flex-direction:column; line-height:1}
.brandmark .wm b{font-family:var(--head); font-weight:500; font-size:25px; letter-spacing:.02em; color:var(--ink); text-transform:lowercase}
.brandmark .wm small{font-family:var(--head); font-weight:600; font-size:8.5px; letter-spacing:.42em; color:var(--muted); text-transform:uppercase; margin-top:3px; padding-left:2px}
.brandmark.on-dark .wm b{color:#fff}
.brandmark.on-dark .wm small{color:var(--on-dark)}
/* official logo */
.site-brand{display:inline-flex; align-items:center}
.site-logo{height:34px; width:auto; display:block}
.site-logo.inv{filter:brightness(0) invert(1)}
footer.site .site-logo{height:40px}
@media (max-width:560px){ .site-logo{height:30px} }

/* header */
header.site{position:sticky; top:0; z-index:70; background:rgba(255,255,255,.92); backdrop-filter:saturate(180%) blur(12px); border-bottom:1px solid var(--line); transition:box-shadow .25s ease}
header.site.scrolled{box-shadow:0 10px 34px -26px rgba(28,32,35,.4)}
.nav{display:flex; align-items:center; justify-content:space-between; gap:22px; height:78px}
.nav-links{display:flex; align-items:center; gap:28px; margin:0; padding:0; list-style:none}
.nav-links a{font-family:var(--head); font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); position:relative; padding:6px 0; transition:color .18s ease}
.nav-links a::after{content:""; position:absolute; left:0; bottom:0; width:0; height:1.5px; background:var(--accent); transition:width .22s ease}
.nav-links a:hover{color:var(--ink)}
.nav-links a:hover::after{width:100%}
.nav-cta{display:flex; align-items:center; gap:18px}
.nav-login{font-family:var(--head); font-size:12px; font-weight:600; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft); transition:color .18s ease}
.nav-login:hover{color:var(--accent)}
.nav-account{width:42px; height:42px; display:inline-grid; place-items:center; border:1px solid var(--line-2); color:var(--ink); border-radius:0; transition:background .18s ease,color .18s ease,border-color .18s ease}
.nav-account:hover{background:var(--ink); color:#fff; border-color:var(--ink)}
.nav-account svg{width:20px; height:20px}
.nav-cta .btn{padding:13px 22px; font-size:11.5px}
.burger{
  display:none; width:46px; height:46px;
  border:1px solid var(--line-2); background:#fff; color:var(--ink);
  cursor:pointer; align-items:center; justify-content:center; border-radius:0;
  position:relative; z-index:80; -webkit-appearance:none; appearance:none;
  -webkit-tap-highlight-color:transparent; padding:0; margin:0; font:inherit; line-height:1; outline:none;
}
.burger:focus,.burger:focus-visible{outline:none; box-shadow:0 0 0 2px rgba(95,122,135,.4)}
.burger svg{width:20px; height:20px; color:var(--ink); stroke:currentColor; fill:none; pointer-events:none}
.burger .bi-close{display:none}
.burger.active{background:var(--ink); color:#fff; border-color:var(--ink)}
.burger.active svg{color:#fff; stroke:#fff}
.burger.active .bi-open{display:none}
.burger.active .bi-close{display:block}
.mobile-menu{display:none}

/* mobile menu */
.mobile-menu-backdrop{position:fixed; inset:0; background:rgba(20,24,27,.4); opacity:0; visibility:hidden; transition:opacity .25s ease,visibility .25s ease; z-index:60}
.mobile-menu-backdrop.open{opacity:1; visibility:visible}
html.menu-open,body.menu-open{overflow:hidden; overscroll-behavior:contain; touch-action:none}

/* ============ HERO (full-bleed product scene) ============ */
.hero{position:relative; background:#dce5f2; border-bottom:1px solid var(--line)}
.hero-stage{position:relative; overflow:hidden}
/* image occupies the right portion only; left stays clean for text (no overlap at any width) */
.hero-media{position:absolute; top:0; bottom:0; right:0; width:60%; z-index:0; transform-origin:70% 50%;
  -webkit-mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);
  mask-image:linear-gradient(90deg,transparent 0%,#000 18%,#000 100%);
  animation:heroFloat 24s ease-in-out 1.5s infinite}
.hero-slide{position:absolute; inset:0; background-repeat:no-repeat; background-position:center; background-size:cover; opacity:0}
.hero-slide.s1{opacity:1}
@media (prefers-reduced-motion:no-preference){
  .hero-slide{animation:heroCycle 21s infinite both}
  .hero-slide.s1{animation-delay:0s}
  .hero-slide.s2{animation-delay:7s}
  .hero-slide.s3{animation-delay:14s}
}
@keyframes heroCycle{0%{opacity:0} 4%{opacity:1} 33%{opacity:1} 38%{opacity:0} 100%{opacity:0}}
.hero-inner{position:relative; z-index:2; min-height:clamp(500px,62vh,700px); display:flex; align-items:center;
  padding-top:clamp(40px,6vw,70px); padding-bottom:clamp(40px,6vw,70px)}
.hero-copy{max-width:580px}
.hero .eyebrow{color:var(--accent)}
.hero h1{font-size:clamp(34px,5.6vw,62px); font-weight:400; letter-spacing:-.022em; line-height:1.07; margin:20px 0 0; color:var(--ink)}
.hero h1 b{font-weight:700}
.hero h1 .hl{font-weight:700; white-space:nowrap; background:linear-gradient(180deg,transparent 62%,var(--blue) 62%); padding:0 .04em}
.hero .lead{margin-top:26px; font-size:clamp(16px,1.7vw,18.5px); color:var(--muted); max-width:500px}
.hero-actions{display:flex; flex-wrap:wrap; gap:14px; margin-top:36px}
.hero-chips{display:flex; flex-wrap:wrap; gap:9px; margin-top:30px}
.hero-chip{display:inline-flex; align-items:center; gap:9px; padding:9px 15px; background:rgba(255,255,255,.86); border:1px solid var(--line); font-family:var(--head); font-size:12.5px; font-weight:600; color:var(--ink-soft)}
.hero-chip svg{width:15px; height:15px; color:var(--accent)}
/* hero entrance: staggered fade-up of the copy */
.hero-copy > *{opacity:0; animation:heroUp .85s cubic-bezier(.2,.7,.2,1) forwards}
.hero-copy > .eyebrow{animation-delay:.15s}
.hero-copy > h1{animation-delay:.28s}
.hero-copy > .lead{animation-delay:.44s}
.hero-copy > .hero-actions{animation-delay:.58s}
.hero-copy > .hero-chips{animation-delay:.7s}
@keyframes heroUp{from{opacity:0; transform:translateY(26px)} to{opacity:1; transform:none}}
@keyframes heroImgIn{from{opacity:0; transform:scale(1.06)} to{opacity:1; transform:scale(1)}}
@keyframes heroFloat{0%,100%{transform:scale(1)} 50%{transform:scale(1.03)}}
@media (prefers-reduced-motion:reduce){
  .hero-copy > *{opacity:1; animation:none}
  .hero-media{animation:none}
}
/* tablet */
@media (max-width:900px) and (min-width:761px){
  .hero-media{width:64%}
  .hero-inner{min-height:460px}
}
/* mobile: stack — dedicated portrait product banner on top, copy below */
@media (max-width:760px){
  .hero-stage{display:flex; flex-direction:column}
  .hero-media{position:relative; top:auto; bottom:auto; right:auto; width:100%; order:-1;
    aspect-ratio:16/11; max-height:50vh;
    -webkit-mask-image:none; mask-image:none; animation:none}
  .hero-inner{min-height:0; padding-top:30px; padding-bottom:36px}
  .hero-copy{max-width:100%}
  /* chips: clean full-width blue rows */
  .hero-chips{width:100%; gap:10px; margin-top:26px}
  .hero-chip{width:100%; justify-content:flex-start; padding:14px 16px;
    background:var(--blue-wash); border-color:var(--blue-soft); font-size:13.5px}
  .hero-chip svg{width:17px; height:17px}
}

/* stat bar */
.statbar{border-top:1px solid var(--line); background:rgba(255,255,255,.5); position:relative; z-index:2}
.statbar .wrap{display:grid; grid-template-columns:repeat(4,1fr)}
.statbar .cell{padding:30px 22px; border-right:1px solid var(--line)}
.statbar .cell:last-child{border-right:0}
.statbar .n{font-family:var(--head); font-weight:700; font-size:clamp(26px,3vw,36px); color:var(--ink); letter-spacing:-.02em}
.statbar .n b{color:var(--accent); font-weight:700}
.statbar .t{font-size:13px; color:var(--muted); margin-top:4px}

/* ============ PHILOSOPHY ============ */
.philo{background:#fff}
.philo-grid{display:grid; grid-template-columns:1fr 1fr; gap:clamp(30px,5vw,64px); align-items:start}
.philo-copy .big{font-size:clamp(20px,2.3vw,25px); font-weight:500; color:var(--ink); line-height:1.4; letter-spacing:-.01em}
.philo-copy .reg{margin-top:20px; color:var(--muted)}
.philo-copy .btn{margin-top:30px}
.principles{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line)}
.principle{background:#fff; padding:26px 24px}
.principle .ico{width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--line-2); color:var(--accent); margin-bottom:16px}
.principle .ico svg{width:21px; height:21px}
.principle h3{font-size:17px; font-weight:700}
.principle p{margin-top:8px; font-size:14px; color:var(--muted); line-height:1.55}

/* ============ NEEDS ============ */
.needs{background:var(--mist)}
.needs-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line)}
.need{background:#fff; padding:34px 26px; position:relative; cursor:pointer; display:flex; flex-direction:column; height:100%;
  transition:background .22s ease, transform .22s ease}
.need::before{content:""; position:absolute; left:0; top:0; height:3px; width:0; background:var(--accent); transition:width .3s ease}
.need:hover{background:var(--mist)}
.need:hover::before{width:100%}
.need .idx{font-family:var(--head); font-weight:700; font-size:12px; letter-spacing:.14em; color:var(--accent)}
.need h3{font-size:19px; font-weight:700; margin-top:30px}
.need p{margin-top:10px; font-size:14px; color:var(--muted); line-height:1.55}
.need .ln{margin-top:auto; padding-top:24px; display:inline-flex; align-items:center; gap:8px; font-family:var(--head); font-size:11.5px; font-weight:700; letter-spacing:.1em; text-transform:uppercase; color:var(--ink-soft)}
.need .ln svg{width:14px; height:14px; transition:transform .2s ease}
.need:hover .ln{color:var(--accent)}
.need:hover .ln svg{transform:translateX(4px)}
/* whole card is the click target (stretched link) */
.need .ln::after{content:""; position:absolute; inset:0; z-index:1}

/* ============ PRODUCTS ============ */
.products{background:#fff}
.prod-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:20px}
.prod{border:1px solid var(--line); background:#fff; display:flex; flex-direction:column; transition:border-color .2s ease, transform .2s ease, box-shadow .2s ease}
.prod:hover{border-color:var(--line-2); transform:translateY(-3px); box-shadow:var(--shadow)}
.prod .ph{aspect-ratio:1/1; background:var(--blue-wash); overflow:hidden; border-bottom:1px solid var(--line); position:relative}
.prod .ph img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.prod:hover .ph img{transform:scale(1.05)}
.prod .body{padding:20px 20px 22px}
.prod .cat{font-family:var(--head); font-size:11px; font-weight:700; letter-spacing:.14em; text-transform:uppercase; color:var(--accent)}
.prod h3{font-size:16px; font-weight:600; margin-top:9px}
.prod p{margin-top:7px; font-size:13.5px; color:var(--muted)}
.prod-note{margin-top:30px; text-align:center; font-size:14px; color:var(--muted)}
.prod-note b{color:var(--ink); font-weight:600}

/* routine */
.routine{background:var(--blue-wash)}
.rt-grid{display:grid; grid-template-columns:1.1fr .9fr; gap:clamp(28px,5vw,60px); align-items:center}
.rt-copy .eyebrow{color:var(--accent)}
.rt-copy h2{font-size:clamp(26px,3.6vw,40px); font-weight:600; margin:14px 0 14px; line-height:1.16}
.rt-intro{font-size:16px; color:var(--muted); line-height:1.7; max-width:46ch}
.rt-steps{list-style:none; margin:28px 0 0; padding:0; display:grid; gap:18px}
.rt-step{display:flex; gap:16px; align-items:flex-start}
.rt-n{flex:none; font-family:var(--head); font-weight:700; font-size:14px; color:var(--accent); width:40px; height:40px; display:grid; place-items:center; border:1px solid var(--blue-soft); border-radius:50%; background:#fff}
.rt-step h3{font-size:16px; font-weight:600; margin:0}
.rt-step p{font-size:14px; color:var(--muted); margin:5px 0 0; line-height:1.55}
.rt-n svg{width:20px; height:20px}
.rt-media img{width:100%; height:100%; max-height:520px; object-fit:cover; display:block; box-shadow:0 34px 64px -26px rgba(18,34,48,.45); border-radius:2px}
@media(max-width:820px){ .rt-grid{grid-template-columns:1fr; gap:24px} .rt-media{order:-1} .rt-media img{max-height:380px; box-shadow:0 22px 42px -22px rgba(18,34,48,.42)} }

/* starter kits */
.kits{background:var(--blue-wash)}

/* science band */
.science{background:#fff}
.sci-grid{display:grid; grid-template-columns:.92fr 1.08fr; gap:clamp(28px,5vw,64px); align-items:center}
.sci-media{overflow:hidden}
.sci-media img{width:100%; height:100%; max-height:560px; object-fit:cover; display:block}
.sci-copy .eyebrow{color:var(--accent)}
.sci-copy h2{font-size:clamp(26px,3.6vw,40px); font-weight:600; margin:14px 0 16px; line-height:1.16}
.sci-intro{font-size:16px; color:var(--muted); line-height:1.7; max-width:48ch}
.sci-points{display:grid; grid-template-columns:1fr 1fr; gap:22px 28px; margin-top:30px}
.sci-point{display:flex; gap:14px}
.sci-point .ico{flex:none; width:40px; height:40px; display:grid; place-items:center; background:#fff; border:1px solid var(--blue-soft); border-radius:50%}
.sci-point .ico svg{width:20px; height:20px; color:var(--accent)}
.sci-point h3{font-size:15px; font-weight:600; margin:0}
.sci-point p{font-size:13.5px; color:var(--muted); margin:5px 0 0; line-height:1.5}
@media(max-width:820px){ .sci-grid{grid-template-columns:1fr; gap:26px} }
@media(max-width:460px){ .sci-points{grid-template-columns:1fr} }

/* gallery — cards like products/ranges */
.gallery{background:#fff}
.gallery .prod .ph{aspect-ratio:4/3}
.gallery .prod .body{padding:16px 18px 18px}
.gallery .prod h3{font-size:15px; margin-top:7px}

/* cinematic band */
.cinematic{position:relative; min-height:clamp(420px,64vh,620px); display:flex; align-items:center; overflow:hidden; background:var(--ink)}
.cinematic__bg{position:absolute; inset:0; background-size:cover; background-position:center 28%; z-index:0; animation:cineZoom 20s ease-in-out infinite alternate}
.cinematic::after{content:""; position:absolute; inset:0; z-index:1; background:linear-gradient(90deg,rgba(14,16,18,.80),rgba(14,16,18,.44) 55%,rgba(14,16,18,.24))}
.cine-inner{position:relative; z-index:2}
.cine-inner .eyebrow{color:var(--blue)}
.cine-inner h2{color:#fff; font-size:clamp(30px,4.6vw,52px); font-weight:600; line-height:1.1; margin:14px 0 18px; letter-spacing:-.01em; max-width:16ch}
.cine-inner p{color:rgba(255,255,255,.86); font-size:clamp(15px,1.7vw,18px); line-height:1.6; max-width:46ch}
.cine-inner .btn{margin-top:28px}
.btn-light{background:#fff; color:var(--ink); border:1px solid #fff}
.btn-light:hover{background:transparent; color:#fff}
@keyframes cineZoom{from{transform:scale(1)} to{transform:scale(1.08)}}
@media (prefers-reduced-motion:reduce){ .cinematic__bg{animation:none} }
@media(max-width:600px){ .cinematic::after{background:linear-gradient(0deg,rgba(14,16,18,.84),rgba(14,16,18,.40))} .cine-inner h2{max-width:none} }

/* ranges */
.ranges{background:var(--blue-wash)}
.range-grid{grid-template-columns:repeat(3,1fr)}
@media(max-width:900px){ .range-grid{grid-template-columns:repeat(2,1fr)} }
@media(max-width:560px){ .range-grid{grid-template-columns:1fr 1fr; gap:14px} }

/* editorial band */
.editorial{padding:0}
.ed-grid{display:grid; grid-template-columns:1fr 1fr; align-items:stretch; min-height:clamp(440px,52vw,560px)}
.ed-copy{background:var(--blue-wash); display:flex; flex-direction:column; justify-content:center; padding:clamp(32px,5vw,74px)}
.ed-copy h2{font-size:clamp(26px,3.6vw,40px); font-weight:600; margin:16px 0 18px; line-height:1.16}
.ed-copy p{font-size:16px; color:var(--muted); line-height:1.7; max-width:46ch}
.ed-copy .btn{margin-top:26px; align-self:flex-start}
.ed-media{position:relative; overflow:hidden}
.ed-media img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:center 28%}
@media(max-width:820px){ .ed-grid{grid-template-columns:1fr} .ed-media{min-height:360px; order:-1} }

/* ============ TREATMENTS ============ */
.tx{background:var(--ink-deep); color:#fff; position:relative}
.tx .eyebrow{color:var(--blue)}
.tx .sechead h2{color:#fff}
.tx .sechead p{color:var(--on-dark)}
.tx-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line-dark); border:1px solid var(--line-dark)}
.txc{background:var(--ink-deep); display:flex; flex-direction:column; transition:background .2s ease}
.txc:hover{background:#1b2024}
.txc .ph{aspect-ratio:3/4; background:var(--blue-wash); overflow:hidden; position:relative}
.txc .ph img{width:100%; height:100%; object-fit:cover; display:block; transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.txc:hover .ph img{transform:scale(1.05)}
.txc .body{padding:20px 18px 24px}
.txc .tag{font-family:var(--head); font-size:10px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:var(--blue)}
.txc h3{font-size:15.5px; font-weight:600; color:#fff; margin-top:9px; line-height:1.25}
.txc p{margin-top:8px; font-size:13px; color:var(--on-dark); line-height:1.5}
.tx-note{margin-top:30px; display:flex; align-items:center; gap:12px; justify-content:center; text-align:center; font-size:13.5px; color:var(--on-dark)}
.tx-note svg{width:17px; height:17px; color:var(--blue); flex:none}

/* ============ EDUCATION ============ */
.edu{background:var(--mist)}
.edu-grid{display:grid; grid-template-columns:1.1fr 1fr; gap:clamp(30px,5vw,60px); align-items:center}
.edu-list{display:flex; flex-direction:column; gap:2px}
.edu-item{display:flex; gap:18px; padding:22px 0; border-bottom:1px solid var(--line)}
.edu-item:first-child{border-top:1px solid var(--line)}
.edu-item .ic{width:42px; height:42px; flex:none; display:grid; place-items:center; background:#fff; border:1px solid var(--line-2); color:var(--accent)}
.edu-item .ic svg{width:21px; height:21px}
.edu-item h3{font-size:17px; font-weight:600}
.edu-item p{margin-top:6px; font-size:14px; color:var(--muted)}
.edu-card{background:var(--ink-deep); color:#fff; padding:clamp(30px,4vw,46px)}
.edu-card .eyebrow{color:var(--blue)}
.edu-card h3{color:#fff; font-size:clamp(22px,2.6vw,30px); font-weight:600; margin-top:16px}
.edu-card p{color:var(--on-dark); margin-top:16px}
.edu-card .btn{margin-top:28px}

/* ============ PARTNER ============ */
.partner{background:#fff}
.partner-grid{display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(30px,5vw,60px); align-items:start}
.partner-copy h2{font-size:clamp(28px,4vw,42px); font-weight:600; margin-top:16px}
.partner-copy .lead{margin-top:20px; color:var(--muted); font-size:17px}
.partner-feats{margin:28px 0 0; padding:0; list-style:none; display:flex; flex-direction:column; gap:14px}
.partner-feats li{display:flex; gap:13px; align-items:flex-start; font-size:15px; color:var(--ink-soft)}
.partner-feats svg{width:20px; height:20px; color:var(--accent); flex:none; margin-top:1px}
.partner-form{background:var(--mist); border:1px solid var(--line); padding:clamp(24px,3vw,36px)}
/* partner CTA (registration moved to /synergates) */
.partner-cta{background:var(--mist); border:1px solid var(--line); border-top:3px solid var(--accent); padding:clamp(30px,4vw,48px); display:flex; flex-direction:column; align-items:flex-start}
.partner-cta .ic{width:54px; height:54px; display:grid; place-items:center; background:#fff; border:1px solid var(--line-2); color:var(--accent); margin-bottom:22px}
.partner-cta .ic svg{width:27px; height:27px}
.partner-cta .ttl{font-family:var(--head); font-weight:700; font-size:21px; color:var(--ink); letter-spacing:-.01em}
.partner-cta .sub{margin-top:11px; font-size:15px; color:var(--muted); line-height:1.6}
.partner-cta .btn{margin-top:26px}
.partner-cta-login{margin-top:15px; font-size:13px; font-weight:600; color:var(--ink-soft)}
.partner-cta-login:hover{color:var(--accent)}
/* form success state (tick) */
.form-success{text-align:center; padding:26px 10px}
.form-success .fs-ic{width:62px; height:62px; margin:0 auto; display:grid; place-items:center; border-radius:50%; background:#edf7f1; color:#1a7f4b; animation:fsPop .45s cubic-bezier(.2,1.3,.4,1) both}
.form-success .fs-ic svg{width:32px; height:32px}
.form-success strong{display:block; margin-top:18px; font-family:var(--head); font-size:20px; font-weight:700; color:var(--ink); letter-spacing:-.01em}
.form-success p{margin-top:10px; font-size:14.5px; color:var(--muted)}
@keyframes fsPop{from{opacity:0; transform:scale(.6)} to{opacity:1; transform:none}}
@media (prefers-reduced-motion:reduce){ .form-success .fs-ic{animation:none} }
/* inline AFM validity hint */
.afm-hint{font-size:11.5px; font-weight:600; margin-top:-2px}
.afm-hint.ok{color:#1a7f4b} .afm-hint.err{color:#b23b3b}
.partner-form .ttl{font-family:var(--head); font-weight:700; font-size:19px; color:var(--ink)}
.partner-form .sub{font-size:14px; color:var(--muted); margin-top:7px}
.form{margin-top:22px; display:flex; flex-direction:column; gap:14px}
.form .row{display:grid; grid-template-columns:1fr 1fr; gap:14px}
.form label{display:flex; flex-direction:column; gap:7px; font-family:var(--head); font-size:12px; font-weight:600; letter-spacing:.04em; color:var(--ink-soft)}
.form input,.form textarea{
  font-family:var(--body); font-size:15px; color:var(--ink); background:#fff;
  border:1px solid var(--line-2); border-radius:0; padding:13px 14px; width:100%;
  transition:border-color .18s ease, box-shadow .18s ease;
}
.form input:focus,.form textarea:focus{outline:none; border-color:var(--accent); box-shadow:0 0 0 3px rgba(95,122,135,.18)}
.form textarea{resize:vertical; min-height:96px}
.form .consent{flex-direction:row; align-items:flex-start; gap:10px; font-weight:400; font-size:12.5px; color:var(--muted); letter-spacing:0}
.form .consent input{width:17px; height:17px; flex:none; margin-top:1px; accent-color:var(--accent)}
.form .hp{position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden}
.form .foot{display:flex; align-items:center; gap:16px; flex-wrap:wrap; margin-top:4px}
.form-msg{font-size:13.5px}
.form-msg.ok{color:#1a7f4b} .form-msg.err{color:#b23b3b}

/* portal note */
.portal-note{margin-top:18px; display:flex; gap:12px; align-items:flex-start; padding:16px 18px; background:#fff; border:1px dashed var(--line-2)}
.portal-note svg{width:19px; height:19px; color:var(--accent); flex:none; margin-top:1px}
.portal-note p{font-size:13px; color:var(--muted)}
.portal-note b{color:var(--ink); font-weight:600}

/* ============ CONTACT ============ */
.contact{background:var(--mist)}
.ct-cards{display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-bottom:30px}
.ct-card{background:#fff; border:1px solid var(--line); padding:28px 26px}
.ct-card .ico{width:44px; height:44px; display:grid; place-items:center; border:1px solid var(--line-2); color:var(--accent); margin-bottom:18px}
.ct-card .ico svg{width:22px; height:22px}
.ct-card .lbl{font-family:var(--head); font-size:11px; font-weight:700; letter-spacing:.16em; text-transform:uppercase; color:var(--faint)}
.ct-card .val{display:block; margin-top:8px; font-size:17px; font-weight:600; color:var(--ink)}
a.val:hover{color:var(--accent)}
.cform-wrap{background:#fff; border:1px solid var(--line); padding:clamp(26px,3.4vw,44px)}
.cform-wrap .ttl{font-family:var(--head); font-weight:700; font-size:20px}
.cform-wrap .sub{font-size:14.5px; color:var(--muted); margin-top:8px; margin-bottom:6px}

/* ============ FOOTER ============ */
footer.site{background:var(--ink-deep); color:var(--on-dark); padding:clamp(50px,7vw,80px) 0 30px}
.foot-top{display:grid; grid-template-columns:1.6fr 1fr 1fr; gap:40px; padding-bottom:40px; border-bottom:1px solid var(--line-dark)}
.foot-brand .tag{margin-top:20px; max-width:360px; font-size:14px; color:var(--on-dark); line-height:1.6}
.foot-col h4{font-family:var(--head); font-size:11px; font-weight:700; letter-spacing:.18em; text-transform:uppercase; color:#fff; margin-bottom:18px}
.foot-col ul{list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:11px}
.foot-col a{font-size:14px; color:var(--on-dark); transition:color .18s ease}
.foot-col a:hover{color:var(--accent)}
.legal{display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; padding-top:26px; font-size:12.5px; color:rgba(255,255,255,.5)}
.adamit-by{display:inline-flex; align-items:center; gap:9px; margin-top:22px; opacity:.7; transition:opacity .2s ease}
.adamit-by:hover{opacity:1}
.adamit-by span{font-size:11px; letter-spacing:.1em; text-transform:uppercase; color:rgba(255,255,255,.55)}
.adamit-by img{height:22px; width:auto; filter:brightness(0) invert(1)}

/* ============ FABs ============ */
.fabs{position:fixed; right:18px; bottom:18px; z-index:60; display:flex; flex-direction:column; gap:12px}
.fab{width:50px; height:50px; display:grid; place-items:center; border:0; cursor:pointer; border-radius:0; box-shadow:0 14px 30px -12px rgba(28,32,35,.5)}
.fab svg{width:21px; height:21px}
.fab-call{background:var(--ink); color:#fff}
.fab-call:hover{background:#000}
.fab-top{background:var(--ink); color:#fff; opacity:0; visibility:hidden; transform:translateY(8px); transition:opacity .2s ease,transform .2s ease,visibility .2s ease}
.fab-top.show{opacity:1; visibility:visible; transform:none}

/* ============ reveal + micro-interactions ============ */
.reveal{opacity:0; transform:translateY(22px); transition:opacity .6s ease, transform .6s ease}
.reveal.in{opacity:1; transform:none}
/* button micro-lift */
.btn{will-change:transform}
.btn:hover{transform:translateY(-2px)}
.btn:active{transform:translateY(0)}
/* staggered card entrance within grids (parent carries .reveal -> .in) */
.prod-grid > .prod, .tx-grid > .txc, .needs-grid > .need, .principles > .principle, .ct-cards > .ct-card, .partner-feats > li{
  opacity:0; transform:translateY(20px); transition:opacity .55s ease, transform .55s ease}
.reveal.in .prod, .reveal.in .txc, .reveal.in .need, .reveal.in .principle, .reveal.in .ct-card, .reveal.in li{opacity:1; transform:none}
.reveal.in > :nth-child(2){transition-delay:.07s}
.reveal.in > :nth-child(3){transition-delay:.14s}
.reveal.in > :nth-child(4){transition-delay:.21s}
.reveal.in > :nth-child(5){transition-delay:.28s}
@media (prefers-reduced-motion:reduce){
  .reveal,.prod-grid > .prod,.tx-grid > .txc,.needs-grid > .need,.principles > .principle,.ct-cards > .ct-card,.partner-feats > li{opacity:1; transform:none; transition:none}
  .btn:hover{transform:none}
}

/* ============ responsive ============ */
@media (max-width:1040px){
  .prod-grid{grid-template-columns:repeat(2,1fr)}
  .tx-grid{grid-template-columns:repeat(3,1fr)}
  .needs-grid{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:900px){
  .nav-links{display:none}
  .nav-login{display:none}
  .burger{display:inline-flex}
  .hero-grid,.philo-grid,.edu-grid,.partner-grid{grid-template-columns:1fr}
  .hero-visual{order:-1; max-width:460px}
  .principles{grid-template-columns:1fr 1fr}
  .mobile-menu{display:flex; flex-direction:column; position:fixed; inset:0;
    width:100%; height:100vh; height:100dvh; background:#fff; z-index:75;
    transform:translateX(100%); transition:transform .32s cubic-bezier(.4,0,.2,1);
    padding:env(safe-area-inset-top,0px) var(--gutter) calc(24px + env(safe-area-inset-bottom,0px));
    overflow-y:auto; -webkit-overflow-scrolling:touch}
  .mobile-menu.open{transform:none}
  /* top bar inside the full-screen menu: logo + close */
  .mm-head{display:flex; align-items:center; justify-content:space-between; height:78px; flex:none;
    margin:0 calc(var(--gutter) * -1) 10px; padding:0 var(--gutter); border-bottom:1px solid var(--line)}
  .mm-head .site-logo{height:34px}
  .mm-close{width:46px; height:46px; display:grid; place-items:center; border:1px solid var(--line-2);
    background:#fff; color:var(--ink); cursor:pointer; border-radius:0; -webkit-appearance:none; appearance:none; padding:0}
  .mm-close svg{width:20px; height:20px}
  .mm-close:hover{background:var(--ink); color:#fff; border-color:var(--ink)}
  .mm-nav{display:flex; flex-direction:column; flex:1 0 auto; justify-content:flex-start; gap:0; padding:10px 0 0}
  .mm-nav a{display:flex; align-items:center; gap:14px; padding:18px 12px; margin:0 -12px; border-bottom:1px solid var(--line);
    font-family:var(--head); font-weight:600; font-size:15.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--ink);
    transition:background .18s ease, color .18s ease}
  .mm-nav a:first-child{border-top:1px solid var(--line)}
  .mm-nav a:active,.mm-nav a:hover{background:var(--blue-wash); color:var(--accent)}
  .mm-nav a .mm-ico{width:24px; height:24px; flex:none; display:grid; place-items:center; color:var(--accent)}
  .mm-nav a .mm-ico svg{width:20px; height:20px}
  .mm-nav a .mm-arr{width:16px; height:16px; margin-left:auto; flex:none; color:var(--faint); transition:transform .18s ease}
  .mm-nav a:hover .mm-arr,.mm-nav a:active .mm-arr{transform:translateX(3px); color:var(--accent)}
  .mm-cta{margin-top:auto; flex:none; padding-top:22px}
  .mm-cta .btn{width:100%}
  .mm-sub{display:flex; align-items:center; justify-content:center; gap:10px; margin-top:16px; font-size:14px; color:var(--muted)}
  .mm-sub a{font-weight:600; color:var(--ink)}
  .mm-sub .dot{width:4px; height:4px; border-radius:50%; background:var(--line-2)}
}
@media (max-width:760px){
  .statbar .wrap{grid-template-columns:1fr 1fr}
  .statbar .cell:nth-child(2){border-right:0}
  .statbar .cell:nth-child(1),.statbar .cell:nth-child(2){border-bottom:1px solid var(--line)}
  .ct-cards{grid-template-columns:1fr}
  .tx-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .prod-grid{grid-template-columns:1fr 1fr; gap:14px}
  .needs-grid{grid-template-columns:1fr}
  .principles{grid-template-columns:1fr}
  .tx-grid{grid-template-columns:1fr}
  .form .row{grid-template-columns:1fr}
  .hero-actions .btn{width:100%}
}

/* interactivity: cursor pointer everywhere clickable */
a, button, .btn, [role="button"], summary, label,
.prod, .txc, .need, .fab, .nav-login, .nav-account, .ln,
input[type="checkbox"], input[type="radio"]{cursor:pointer}
.prod .ph img, .txc .ph img{cursor:zoom-in}

/* lightbox */
.lightbox{position:fixed; inset:0; z-index:9999; display:none; align-items:center; justify-content:center; padding:24px; background:rgba(14,16,18,.88); -webkit-backdrop-filter:blur(4px); backdrop-filter:blur(4px); cursor:zoom-out}
.lightbox.open{display:flex}
.lightbox img{max-width:min(92vw,860px); max-height:86vh; object-fit:contain; background:#fff; box-shadow:0 40px 90px rgba(0,0,0,.55); cursor:default}
.lightbox__cap{position:absolute; bottom:22px; left:0; right:0; text-align:center; color:#fff; font-family:var(--head); font-size:13.5px; font-weight:600; letter-spacing:.05em}
.lightbox__close{position:absolute; top:16px; right:20px; width:46px; height:46px; border:0; background:rgba(255,255,255,.14); color:#fff; font-size:26px; line-height:1; cursor:pointer; border-radius:50%; display:grid; place-items:center}
.lightbox__close:hover{background:rgba(255,255,255,.26)}