/* platform.anpheros.com — pagina pentru oameni a platformei. Aceeași identitate ca anpheros.com:
   alb, ardezie, cyan, mentă; Bricolage Grotesque pentru titluri, Instrument Sans pentru text.
   Pozele au fundal alb (JPEG), deci pe fundaluri colorate stau cu mix-blend-mode: multiply. */
:root{
  --bg:#ffffff; --mist:#f4f7fb; --mist-2:#eaf1f8; --line:#e2e8f1;
  --ink:#0e1a33; --ink-2:#4a5673; --ink-3:#8591a8;
  --slate:#44619e; --slate-d:#2f4677; --cyan:#1fc7d9; --mint:#3ccfa8; --mint-d:#138a6b;
  --display:"Bricolage Grotesque","Avenir Next","Segoe UI",system-ui,sans-serif;
  --body:"Instrument Sans","Helvetica Neue","Segoe UI",system-ui,sans-serif;
  --mono:"IBM Plex Mono",ui-monospace,"SF Mono",Menlo,monospace;
  --gutter:clamp(16px,4vw,56px);
  --nav:64px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-padding-top:calc(var(--nav) + 12px)}
@media (prefers-reduced-motion:no-preference){ html{scroll-behavior:smooth} }
html.i18n-pending body{visibility:hidden}
body{margin:0; background:var(--bg); color:var(--ink); font:400 17px/1.55 var(--body); -webkit-font-smoothing:antialiased; overflow-x:hidden}
a{color:inherit}
img{display:block; max-width:100%; height:auto}
button{font:inherit; color:inherit}
/* fundalul pozelor e #fefefe, nu alb pur: îl împingem la alb ca să nu se vadă pătratul pe pagina albă */
main img{filter:brightness(1.012)}
:focus-visible{outline:2px solid var(--cyan); outline-offset:3px; border-radius:6px}
.wrap{padding-inline:var(--gutter); max-width:1240px; margin-inline:auto}
.mono{font-family:var(--mono); font-size:12.5px; letter-spacing:.02em}
.eyebrow{font:500 12px/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--slate); margin:0 0 18px}
h1,h2,h3{font-family:var(--display); text-wrap:balance; margin:0; letter-spacing:-.025em}
h2{font-size:clamp(32px,4.6vw,56px); line-height:1.04; font-weight:650}
h3{font-size:22px; line-height:1.2; font-weight:650}
p{margin:0}
.sub{color:var(--ink-2); font-size:clamp(17px,1.6vw,19px); max-width:620px; margin-top:18px; text-wrap:pretty}
.sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.skip{position:absolute; left:12px; top:-60px; z-index:100; background:var(--ink); color:#fff; padding:10px 14px; border-radius:10px; text-decoration:none}
.skip:focus{top:12px}

/* ---------- butoane ---------- */
.btn{display:inline-flex; align-items:center; justify-content:center; gap:8px; height:48px; padding:0 22px; border-radius:999px; font-weight:600; font-size:15.5px; text-decoration:none; white-space:nowrap; transition:transform .2s, background .2s, border-color .2s, box-shadow .2s}
.btn:hover{transform:translateY(-1px)}
.btn-ink{background:var(--ink); color:#fff; box-shadow:0 8px 24px -10px rgba(14,26,51,.55)}
.btn-ink:hover{background:var(--slate-d)}
.btn-line{border:1.5px solid var(--line); background:#fff}
.btn-line:hover{border-color:var(--slate)}
.btn-text{padding:0 6px; color:var(--slate); height:48px}
.btn-sm{height:38px; padding:0 16px; font-size:14px}

/* ---------- nav ---------- */
.nav{position:sticky; top:0; z-index:50; background:rgba(255,255,255,.78); backdrop-filter:saturate(1.4) blur(14px); -webkit-backdrop-filter:saturate(1.4) blur(14px); border-bottom:1px solid rgba(226,232,241,.7)}
.nav .wrap{display:flex; align-items:center; gap:28px; height:var(--nav)}
.brand{display:flex; align-items:center; gap:9px; font:650 19px/1 var(--display); text-decoration:none; letter-spacing:-.02em}
.brand img{width:26px; height:26px; mix-blend-mode:multiply}
.brand-tag{font:500 11px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--slate); border:1px solid var(--line); border-radius:999px; padding:5px 8px 4px}
.brand,.nav-cta{flex-shrink:0}
.brand-tag{margin-left:2px}
.nav-links{display:flex; align-items:center; gap:26px; margin-left:auto; font-size:14.5px; color:var(--ink-2)}
.nav-links a{text-decoration:none; white-space:nowrap}
.nav-links a:hover{color:var(--ink)}
.dd{position:relative}
.dd-btn{font:inherit; color:inherit; background:none; border:0; padding:6px 0; cursor:pointer; display:flex; align-items:center; gap:6px; white-space:nowrap}
.dd-btn::after{content:""; width:6px; height:6px; border-right:1.5px solid currentColor; border-bottom:1.5px solid currentColor; transform:translateY(-2px) rotate(45deg); transition:transform .2s}
.dd-btn:hover{color:var(--ink)}
.dd-menu{position:absolute; top:100%; left:-14px; min-width:220px; padding:8px; margin-top:8px; background:#fff; border:1px solid var(--line); border-radius:14px; box-shadow:0 18px 40px -18px rgba(15,23,42,.28); display:none; flex-direction:column}
.dd-menu::before{content:""; position:absolute; left:0; right:0; top:-10px; height:10px}
.dd-menu a{padding:9px 12px; border-radius:9px; color:var(--ink-2)}
.dd-menu a:hover,.dd-menu a:focus-visible{background:var(--mist,#f3f6fa); color:var(--ink)}
.dd:hover .dd-menu,.dd:focus-within .dd-menu,.dd.open .dd-menu{display:flex}
.dd:hover .dd-btn::after,.dd.open .dd-btn::after{transform:translateY(1px) rotate(225deg)}
.nav-cta{display:flex; gap:10px}
.nav-cta{align-items:center}
.menu-btn{display:none; width:40px; height:38px; border-radius:999px; border:1px solid var(--line); background:#fff; cursor:pointer; flex-direction:column; align-items:center; justify-content:center; gap:5px; padding:0}
.menu-btn span{display:block; width:16px; height:1.5px; background:var(--ink); border-radius:2px; transition:transform .2s}
.nav.open .menu-btn span:first-child{transform:translateY(3.25px) rotate(45deg)}
.nav.open .menu-btn span:last-child{transform:translateY(-3.25px) rotate(-45deg)}
@media (max-width:1100px){
  .nav-links{display:none} .nav-cta{margin-left:auto} .menu-btn{display:flex}
  /* Telefon și tabletă: meniul se deschide ca panou sub antet, grupurile apar ca liste cu titlu. */
  .nav.open{background:#fff}
  .nav.open .nav-links{display:flex; position:absolute; top:var(--nav); left:0; right:0; flex-direction:column; align-items:stretch; gap:0; margin:0;
    padding:8px var(--gutter) 22px; background:#fff; border-bottom:1px solid var(--line); box-shadow:0 24px 40px -24px rgba(15,23,42,.25);
    max-height:calc(100vh - var(--nav)); max-height:calc(100dvh - var(--nav)); overflow-y:auto; font-size:17px}
  .nav.open .nav-links > a{padding:13px 0; border-top:1px solid var(--line); color:var(--ink)}
  .nav.open .dd{border-top:1px solid var(--line); padding-bottom:6px}
  .nav.open .dd:first-child{border-top:0}
  .nav.open .dd-btn{pointer-events:none; padding:16px 0 4px; font:500 11px/1 var(--mono); letter-spacing:.12em; text-transform:uppercase; color:var(--slate)}
  .nav.open .dd-btn::after{display:none}
  .nav.open .dd-menu{display:flex; position:static; min-width:0; margin:0; padding:0; border:0; box-shadow:none; background:none}
  .nav.open .dd-menu::before{display:none}
  .nav.open .dd-menu a{padding:10px 0; border-radius:0; color:var(--ink)}
  .nav.open .dd-menu a:hover{background:none}
  .nav.open .nav-links > .menu-cta a{padding:0 22px}
}
.menu-cta{display:none}
@media (max-width:560px){ .nav.open .menu-cta{display:flex; flex-direction:column; gap:10px; padding-top:16px; border-top:1px solid var(--line)} }
@media (max-width:560px){ .hide-sm{display:none} .brand-tag{display:none} .nav .wrap{gap:12px} .nav-cta{gap:8px} }

/* ---------- secțiuni ---------- */
section{padding-block:clamp(72px,10vw,128px)}
.band-mist{background:var(--mist)}
.head{max-width:820px; margin-bottom:clamp(36px,5vw,56px)}

/* 1 · deschiderea */
.hero{padding-block:clamp(40px,7vw,88px) clamp(56px,8vw,104px)}
.hero-grid{display:grid; grid-template-columns:1.08fr 1fr; gap:clamp(24px,4vw,64px); align-items:center}
.hero h1{font-size:clamp(38px,5.4vw,72px); line-height:1; font-weight:760; letter-spacing:-.035em}
.hero h1 em{font-style:normal; background:linear-gradient(100deg,var(--slate) 0%,var(--cyan) 55%,var(--mint) 100%); -webkit-background-clip:text; background-clip:text; color:transparent}
.lede{font-size:clamp(18px,1.7vw,20px); color:var(--ink-2); margin-top:24px; max-width:560px; text-wrap:pretty}
.cta{display:flex; flex-wrap:wrap; gap:12px; margin-top:32px}
.facts{display:flex; flex-wrap:wrap; gap:10px 22px; list-style:none; padding:0; margin:34px 0 0; color:var(--ink-2)}
.facts li{display:flex; align-items:center; gap:8px}
.facts li::before{content:""; width:7px; height:7px; border-radius:50%; background:var(--mint)}
.hero-art{position:relative; aspect-ratio:1; max-width:560px; justify-self:center; width:100%}
.hero-art img{position:relative; width:100%; mix-blend-mode:multiply}
.glow{position:absolute; inset:12%; border-radius:50%; background:radial-gradient(circle at 50% 50%,rgba(31,199,217,.22),rgba(60,207,168,.12) 45%,transparent 70%); filter:blur(20px)}
@media (prefers-reduced-motion:no-preference){ .hero-art img{animation:float 7s ease-in-out infinite} }
@keyframes float{50%{transform:translateY(-12px)}}
@media (max-width:860px){ .hero-grid{grid-template-columns:1fr} .hero-art{max-width:300px; margin-top:-8px} }

/* 2 · pentru cine */
.cards3{display:grid; grid-template-columns:repeat(3,1fr); gap:20px}
.card{background:#fff; border:1px solid var(--line); border-radius:26px; padding:14px 26px 30px; display:flex; flex-direction:column}
.card img{width:74%; margin:0 auto 8px; aspect-ratio:1; object-fit:contain}
.card h3{margin-bottom:10px}
.card > p{color:var(--ink-2)}
.ticks{list-style:none; padding:0; margin:20px 0 0; display:grid; gap:9px; border-top:1px solid var(--line); padding-top:18px}
.ticks li{position:relative; padding-left:26px; font-size:15px; color:var(--ink-2)}
.ticks li::before{content:""; position:absolute; left:0; top:5px; width:15px; height:15px; border-radius:50%; background:var(--mint) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M4.5 8.2l2.3 2.3 4.7-4.9' fill='none' stroke='white' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/100% no-repeat}
@media (max-width:900px){ .cards3{grid-template-columns:1fr; max-width:520px; margin-inline:auto} .card img{width:56%} }

/* 3 · date */
.tiles{display:grid; grid-template-columns:repeat(4,1fr); gap:18px}
.tile{margin:0; border-radius:24px; background:var(--mist); padding:10px 22px 24px}
.tile img{width:84%; margin:0 auto; aspect-ratio:1; object-fit:contain; mix-blend-mode:multiply}
.tile b{display:block; font:650 18px/1.25 var(--display); letter-spacing:-.015em; margin-bottom:6px}
.tile span{display:block; font-size:14.5px; color:var(--ink-2)}
.devices{margin-top:18px; border-radius:24px; border:1px solid var(--line); padding:24px 22px 18px}
.devices-t{font:500 12px/1 var(--mono); letter-spacing:.14em; text-transform:uppercase; color:var(--slate)}
.devices-row{display:grid; grid-template-columns:repeat(4,1fr); gap:14px; margin-top:6px}
.devices-row figure{margin:0; text-align:center}
.devices-row img{width:100%; aspect-ratio:4/3; object-fit:cover; object-position:100% 78%}
.devices-row figcaption{font-size:14.5px; color:var(--ink-2); font-weight:500; margin-top:-6px}
@media (max-width:1000px){ .tiles{grid-template-columns:1fr 1fr} }
@media (max-width:640px){ .devices-row{grid-template-columns:1fr 1fr} }
@media (max-width:420px){ .tiles{grid-template-columns:1fr} .tile img{width:62%} }

/* 4 · consimțământ + 5 · siguranță */
.split{display:grid; grid-template-columns:1fr 1.05fr; gap:clamp(32px,6vw,88px); align-items:center}
.split-rev{grid-template-columns:1.1fr .9fr}
.split-art{position:relative; aspect-ratio:1/0.92}
.split-art img{position:absolute; border-radius:28px; background:#fff; box-shadow:0 30px 60px -30px rgba(14,26,51,.25)}
.art-a{width:64%; left:0; top:0}
.art-b{width:50%; right:0; bottom:0; border:6px solid var(--mist)}
.points{list-style:none; padding:0; margin:30px 0 0; display:grid; gap:18px}
.points li{padding-left:20px; border-left:2px solid var(--mint)}
.points b{display:block; font-weight:600; margin-bottom:2px}
.points span{color:var(--ink-2); font-size:15.5px}
@media (max-width:860px){
  .split,.split-rev{grid-template-columns:1fr}
  .split-art{max-width:440px; width:100%; margin-inline:auto}
}

.band-ink{background:radial-gradient(120% 90% at 85% 20%,#1b3563 0%,var(--ink) 60%); color:#fff}
.band-ink .eyebrow{color:var(--cyan)}
.band-ink .sub{color:rgba(255,255,255,.74)}
.chips{list-style:none; padding:0; margin:30px 0 0; display:flex; flex-wrap:wrap; gap:10px}
.chips li{border:1px solid rgba(255,255,255,.2); background:rgba(255,255,255,.06); border-radius:999px; padding:8px 14px}
.vault{justify-self:center; width:100%; max-width:420px; border-radius:36px; background:#fff; padding:20px; box-shadow:0 0 0 1px rgba(255,255,255,.1),0 40px 90px -30px rgba(31,199,217,.45)}
.vault img{width:100%}
@media (max-width:860px){ .vault{max-width:300px; order:-1} }

/* 6 · cum începi */
.steps{list-style:none; padding:0; margin:0; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; counter-reset:s}
.step{border:1px solid var(--line); border-radius:24px; padding:26px 26px 28px}
.step .n{display:inline-grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--ink); color:#fff; font-size:13px; margin-bottom:18px}
.step h3{font-size:20px; margin-bottom:8px}
.step p{color:var(--ink-2); font-size:15.5px}
@media (max-width:860px){ .steps{grid-template-columns:1fr} }

.showcase{display:grid; grid-template-columns:1.05fr 1fr; gap:clamp(24px,4vw,48px); align-items:center; margin-top:clamp(48px,7vw,80px)}
@media (max-width:1000px){ .showcase{grid-template-columns:1fr} }
/* ecranul laptopului: dreptunghiul verde din poză, măsurat (13,30 % · 9,48 % · 73,39 % · 66,73 %) */
.laptop{margin:0; position:relative}
.laptop-screen{position:absolute; left:13.1%; top:9.3%; width:73.8%; height:67.1%; overflow:hidden; background:#fff; border-radius:3px}
.laptop-screen img{width:100%; height:100%; object-fit:cover; object-position:top left}
.laptop-frame{position:relative; width:100%; pointer-events:none; mix-blend-mode:multiply}
.laptop figcaption{font-size:14px; color:var(--ink-3); text-align:center; margin-top:6px}

.code{background:var(--ink); border-radius:24px; color:#dfe7f5; overflow:hidden; box-shadow:0 40px 80px -40px rgba(14,26,51,.6)}
.tabs{display:flex; gap:4px; padding:12px 12px 0}
.tabs button{border:0; background:transparent; color:rgba(255,255,255,.6); font:500 13px/1 var(--mono); padding:10px 14px; border-radius:10px 10px 0 0; cursor:pointer}
.tabs button[aria-selected="true"]{background:rgba(255,255,255,.08); color:#fff}
.code pre{margin:0; padding:22px 20px 20px; background:rgba(255,255,255,.08); overflow-x:auto; font:400 12.5px/1.7 var(--mono)}
.code pre[hidden]{display:none}
.code .c{color:#8391ad}
.code .k{color:#7fd8ff}
.code .s{color:#8ff0cf}
.code-links{display:flex; flex-wrap:wrap; gap:8px 18px; padding:16px 22px 18px; font-size:14px}
.code-links a{color:#fff; opacity:.8; text-underline-offset:3px}
.code-links a:hover{opacity:1}

/* 6 · prețuri (decis 29 sep 2026: pacienți stocați, Starter/Growth/Scale) */
.plans4{display:grid; grid-template-columns:repeat(4,1fr); gap:16px; align-items:stretch}
.plan{background:#fff; border:1px solid var(--line); border-radius:24px; padding:26px 24px 26px; display:flex; flex-direction:column; gap:18px; min-width:0}
.plan.free{background:transparent; border-style:dashed}
.plan.pick{border:2px solid var(--ink); box-shadow:0 18px 40px -24px rgba(14,26,51,.45)}
.plan h3{font-size:20px}
.plan .for{color:var(--ink-2); font-size:15px; margin-top:6px; min-height:3.2em}
.plan .amt{font:650 44px/1 var(--display); letter-spacing:-.03em}
.plan .amt small{font:500 15px var(--body); color:var(--ink-3); letter-spacing:0; margin-left:4px}
.plan .ticks{margin-top:0; flex:1; align-content:start}
.plan .btn{width:100%}
.price-notes{display:grid; grid-template-columns:repeat(3,1fr); gap:16px 28px; margin-top:34px; color:var(--ink-2); font-size:15px}
.price-vat{margin-top:26px; color:var(--ink-3)}
.price-beta{margin-top:10px; max-width:72ch; color:var(--ink-3); font-size:.92em; line-height:1.55}
.price-notes b{color:var(--ink); display:block; margin-bottom:4px; font-weight:600}
@media (max-width:1100px){ .plans4{grid-template-columns:1fr 1fr} }
@media (max-width:640px){ .plans4, .price-notes{grid-template-columns:1fr} }

/* 7 · final */
.final{padding-block:clamp(88px,12vw,150px); background:#fff url("/site/img/waves.jpg") center/cover no-repeat; text-align:center}
.final-inner{max-width:780px}
.final h2{font-size:clamp(34px,5vw,64px)}
.final .sub{margin-inline:auto}
.final .cta{justify-content:center}

/* ---------- subsol ---------- */
.foot{border-top:1px solid var(--line); padding-block:28px}
.foot-inner{display:flex; flex-wrap:wrap; align-items:center; gap:18px 28px}
.foot-brand{display:flex; align-items:center; gap:8px; font:650 16px/1 var(--display)}
.foot-brand img{mix-blend-mode:multiply}
.foot-links{display:flex; flex-wrap:wrap; gap:8px 20px; font-size:14px; color:var(--ink-2)}
.foot-links a{text-decoration:none}
.foot-links a:hover{color:var(--ink)}
/* Selectorul de limbă stă în antet, ca pe anpheros.com (9 oct 2026): pastilă cu săgeată, fără aspectul nativ. */
.lang{display:flex; align-items:center}
.lang select{font-family:inherit; font-weight:500; font-size:13px; line-height:1; padding:8px 26px 8px 10px; border-radius:999px; border:1px solid var(--line); color:var(--ink-2); cursor:pointer; -webkit-appearance:none; appearance:none;
  background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M2 4l4 4 4-4' fill='none' stroke='%234a5673' stroke-width='1.5'/%3E%3C/svg%3E") no-repeat right 9px center/10px}
.lang select:focus{outline:0; border-color:var(--slate)}

/* ---------- apariție la derulare (doar cu JS și fără „reduce motion”) ---------- */
html.js .reveal{opacity:0; transform:translateY(18px); transition:opacity .7s ease, transform .7s cubic-bezier(.2,.7,.2,1)}
html.js .reveal.in{opacity:1; transform:none}
@media (prefers-reduced-motion:reduce){ html.js .reveal{opacity:1; transform:none; transition:none} }

/* 1b · schema (14 oct 2026) */
.flow-band{padding:8px 0 56px}
.flow{display:grid; grid-template-columns:minmax(0,1fr) auto minmax(0,1.15fr) auto minmax(0,1fr); align-items:center; gap:16px; padding:26px; border:1px solid var(--line); border-radius:28px; background:linear-gradient(180deg,#f6f9fd,#f4fbf8)}
.flow-col{display:grid; gap:10px}
.flow-node{display:flex; align-items:center; gap:12px; padding:10px 14px; background:#fff; border:1px solid var(--line); border-radius:16px; font-weight:600; font-size:15px}
.flow-node img{width:48px; height:48px; object-fit:contain; mix-blend-mode:multiply; border-radius:10px}
.flow-node small{display:block; font-weight:400; color:var(--ink-3); font-size:13px}
.flow-arrow{text-align:center; color:var(--ink-3); font-size:12px; line-height:1.4}
.flow-arrow b{display:block; font-size:26px; color:var(--blue,#2563eb); line-height:1; margin-bottom:4px}
.flow-core{padding:20px 22px; border-radius:22px; color:#fff; background:radial-gradient(120% 120% at 85% 10%,#1b3563 0%,var(--ink) 70%); box-shadow:0 24px 50px -28px rgba(14,26,51,.7)}
.flow-core-head{display:flex; align-items:center; gap:10px; font-size:19px; font-weight:700; margin-bottom:10px}
.flow-core ul{list-style:none; margin:0; padding:0; display:grid; gap:7px; font-size:14.5px; color:rgba(255,255,255,.86)}
.flow-core li::before{content:"✓"; color:#5eead4; font-weight:700; margin-right:8px}
@media (max-width:900px){ .flow{grid-template-columns:1fr; padding:18px} .flow-arrow b{display:inline-block; transform:rotate(90deg); margin:0 6px 0 0} }

/* 5 · pași ilustrați, 6 · planuri ilustrate (14 oct 2026) */
.step{position:relative; display:grid; grid-template-columns:1fr auto; align-items:center; column-gap:12px}
.step .n{grid-column:1; grid-row:1; margin-bottom:0; align-self:center}
.step-art{grid-column:2; grid-row:1; width:96px; height:96px; object-fit:contain; mix-blend-mode:multiply; margin:-10px -10px 4px 0; -webkit-mask-image:radial-gradient(circle,#000 62%,transparent 72%); mask-image:radial-gradient(circle,#000 62%,transparent 72%)}
.step-art[src$=".png"]{width:68px; height:68px; margin:4px 4px 16px 0}
.step h3,.step p{grid-column:1 / -1}
@media (min-width:861px){
  .step:not(:last-child)::after{content:""; position:absolute; top:42px; right:-13px; width:9px; height:9px; border-top:2px solid var(--ink-3); border-right:2px solid var(--ink-3); transform:rotate(45deg); z-index:1}
}
.plan-art{width:64px; height:64px; object-fit:contain; mix-blend-mode:multiply; margin-bottom:4px; -webkit-mask-image:radial-gradient(circle,#000 62%,transparent 72%); mask-image:radial-gradient(circle,#000 62%,transparent 72%)}
