/* Pagina-pilon „Personal health record for Europe” (/eu-personal-health-record), tema B „Deep Trust” (26 oct 2026).
   Stil propriu, doar pentru această pagină; folosește tokenii site-ului (site.css) și Inter. */
.euphr-hero { background: radial-gradient(800px 420px at 80% 10%, rgba(10,132,255,.38), transparent 60%), linear-gradient(160deg, #0b1220, #0a0a0c); color: #fff; padding: 5rem 2rem 4.2rem; }
.euphr-hero .inner { max-width: 1120px; margin: 0 auto; display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: 3rem 4rem; align-items: center; }
.euphr-hero .eyebrow { color: #7cc0ff; margin-bottom: 1rem; }
.euphr-hero h1 { font-size: clamp(2.3rem, 5vw, 3.6rem); line-height: 1.04; letter-spacing: -.035em; font-weight: 800; margin: 0 0 1rem; }
.euphr-hero .lead { font-size: 1.2rem; line-height: 1.55; color: rgba(255,255,255,.74); max-width: 560px; margin: 0 0 1.6rem; }
.euphr-actions { display: flex; flex-wrap: wrap; gap: .8rem 1rem; align-items: center; }
.euphr-actions .btn-primary { background: #0a84ff; padding: .9rem 1.6rem; font-weight: 600; }
.euphr-actions .btn-primary:hover { background: #2b94ff; }
.euphr-actions .btn-ghost { display: inline-block; padding: .85rem 1.4rem; border-radius: 980px; border: 1px solid rgba(255,255,255,.28); background: transparent; color: #fff; font-weight: 600; transition: background .2s; }
.euphr-actions .btn-ghost:hover { background: rgba(255,255,255,.08); }
.euphr-note { font-size: .85rem; color: rgba(255,255,255,.62); margin-top: .9rem; }
.euphr-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-top: 1.8rem; }
.euphr-chips span { font-size: .8rem; font-weight: 600; padding: .4rem .8rem; border-radius: 999px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.18); color: #fff; }
.euphr-card { position: relative; background: #fff; color: var(--text); border-radius: 24px; padding: 1.4rem; box-shadow: 0 30px 60px rgba(0,0,0,.35); }
.euphr-card .who { display: flex; align-items: center; gap: .8rem; margin-bottom: 1rem; }
.euphr-card .av { width: 44px; height: 44px; border-radius: 50%; background: linear-gradient(135deg, #0071e3, #7c3aed); color: #fff; display: grid; place-items: center; font-weight: 700; }
.euphr-card .who small { display: block; color: var(--text-soft); font-size: .85rem; }
.euphr-card .row { display: flex; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-top: 1px solid var(--divider); font-size: .95rem; }
.euphr-card .row b { font-weight: 600; } .euphr-card .row span { color: var(--text-soft); text-align: right; }
.euphr-card .float { position: absolute; width: 72px; height: 72px; filter: drop-shadow(0 10px 20px rgba(0,0,0,.25)); }
.euphr-card .f1 { right: -26px; top: -26px; } .euphr-card .f2 { left: -30px; bottom: 30px; } .euphr-card .f3 { right: -22px; bottom: -26px; width: 60px; height: 60px; }

.euphr section { padding: 3.6rem 0; }
.euphr section + section { border-top: 1px solid var(--divider); }
.euphr h2 { font-size: clamp(1.6rem, 3vw, 2.2rem); letter-spacing: -.03em; font-weight: 800; margin: 0 0 .5rem; }
.euphr .sub { color: var(--text-soft); font-size: 1.05rem; max-width: 640px; margin: 0 0 2rem; line-height: 1.5; }
.euphr-tiles { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.euphr-tile { display: block; background: var(--surface); border: 1px solid var(--divider); border-radius: 20px; padding: 1.4rem; box-shadow: 0 10px 30px rgba(0,0,0,.05); transition: transform .2s, box-shadow .2s; }
.euphr-tile:hover { transform: translateY(-2px); box-shadow: 0 16px 36px rgba(0,0,0,.08); }
.euphr-tile img { width: 56px; height: 56px; margin-bottom: .8rem; }
.euphr-tile h3 { margin: 0 0 .35rem; font-size: 1.05rem; } .euphr-tile p { margin: 0; color: var(--text-soft); font-size: .95rem; line-height: 1.5; }
.euphr-flow { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1rem; counter-reset: s; }
.euphr-step { position: relative; padding: 1.3rem 1.3rem 1.3rem 3.4rem; background: var(--surface-dark); border-radius: 20px; }
.euphr-step::before { counter-increment: s; content: counter(s); position: absolute; left: 1.1rem; top: 1.2rem; width: 30px; height: 30px; border-radius: 50%; background: var(--accent); color: #fff; display: grid; place-items: center; font-weight: 700; font-size: .9rem; }
.euphr-step h3 { margin: 0 0 .3rem; font-size: 1rem; } .euphr-step p { margin: 0; color: var(--text-soft); font-size: .92rem; line-height: 1.5; }
.euphr-more { display: inline-block; margin-top: 1.4rem; color: var(--accent); font-weight: 600; }
.euphr-std { display: grid; grid-template-columns: 1fr 1fr; gap: 2rem 3rem; align-items: start; }
.euphr-links { display: flex; flex-wrap: wrap; gap: .6rem; }
.euphr-links a { display: inline-flex; align-items: center; gap: .4rem; padding: .55rem 1rem; border-radius: 999px; border: 1px solid var(--divider); background: var(--surface); font-weight: 500; font-size: .93rem; transition: border-color .2s, background .2s; }
.euphr-links a:hover { border-color: var(--accent); color: var(--accent); }
.euphr-std .label { font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--text-mute); margin: 0 0 .8rem; }
.euphr-trust { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.1rem; }
.euphr-trust div { padding: 1.3rem 1.4rem; border-radius: 20px; background: linear-gradient(160deg, #0b1220, #1d1d1f); color: #fff; }
.euphr-trust h3 { margin: 0 0 .4rem; font-size: 1.02rem; } .euphr-trust p { margin: 0; color: rgba(255,255,255,.72); font-size: .92rem; line-height: 1.5; }
.euphr-tools { display: flex; flex-wrap: wrap; gap: .6rem; }
.euphr-cta { background: linear-gradient(135deg, #0b1220, #0071e3); color: #fff; border-radius: 28px; padding: 2.8rem 3rem; display: flex; align-items: center; justify-content: space-between; gap: 2rem; flex-wrap: wrap; }
.euphr-cta h2 { color: #fff; margin: 0 0 .4rem; } .euphr-cta p { margin: 0; color: rgba(255,255,255,.76); max-width: 520px; }
.euphr-cta .btn-primary { background: #fff; color: var(--text); } .euphr-cta .btn-primary:hover { background: #f0f0f3; }
.euphr-faq details { border-top: 1px solid var(--divider); padding: .9rem 0; }
.euphr-faq summary { cursor: pointer; font-weight: 600; font-size: 1.02rem; list-style: none; display: flex; justify-content: space-between; gap: 1rem; }
.euphr-faq summary::after { content: "+"; color: var(--text-mute); font-weight: 400; } .euphr-faq details[open] summary::after { content: "–"; }
.euphr-faq summary::-webkit-details-marker { display: none; }
.euphr-faq p { margin: .6rem 0 0; color: var(--text-soft); line-height: 1.55; max-width: 720px; }
.euphr a:focus-visible, .euphr-hero a:focus-visible { outline: 3px solid #7cc0ff; outline-offset: 3px; }
@media (max-width: 900px) {
  .euphr-hero { padding: 3.4rem 1.2rem 3rem; }
  .euphr-hero .inner, .euphr-tiles, .euphr-flow, .euphr-std, .euphr-trust { grid-template-columns: 1fr; }
  .euphr-card .float { display: none; }
  .euphr-cta { padding: 2rem 1.4rem; }
}
@media (prefers-reduced-motion: reduce) { .euphr-tile { transition: none; } .euphr-tile:hover { transform: none; } }

/* ilustrații 3D (assets/story/euphr), 26 oct seara */
.euphr-hero .inner > div:last-child { position: relative; }
.euphr-art-hero { width: 100%; height: auto; display: block; border-radius: 24px; }
/* cu ilustrația în hero, cardul HTML (care o acoperea) nu se mai afișează */
.euphr-card-over { display: none; }
.euphr-card-over .float { display: none; }
.euphr-head { display: grid; grid-template-columns: minmax(0, 1fr) minmax(220px, 360px); gap: 1.5rem 3rem; align-items: center; margin-bottom: 1.6rem; }
.euphr-head .sub { margin-bottom: 0; }
.euphr-art { width: 100%; height: auto; display: block; border-radius: 20px; }
.euphr-trust div img { width: 96px; height: 96px; border-radius: 18px; margin-bottom: .8rem; display: block; }
.euphr-cta { background-size: cover; background-position: center; }
@media (max-width: 900px) { .euphr-head { grid-template-columns: 1fr; } .euphr-art { max-width: 420px; margin: 0 auto; }  }