/*
Theme Name: YSB Manager
Template: twentytwentyfive
Description: Tema site-ului ysbmanager.ro, dupa Manualul de identitate vizuala Your Second Brain Manager v2.0.
Version: 1.10.6
Text Domain: ysb-manager
*/

/* Culorile vin doar din manual, p. 13. Filetul in ardezie deschisa e alegerea din design-tokens.md
   (manualul nu are o culoare pentru linii); fundalurile sunt albe sau bleumarin. */
:root {
	--bleumarin: #132545;
	--ardezie: #5B6778;
	--ardezie-deschisa: #B8C2D3;
	--alb: #FFFFFF;
	--supergrafic: #1C3256;
	--turcoaz: #0BA8BC;
	--albastru: #3D6AE0;
	--violet: #6342EA;
	--filet: #B8C2D3;
	--lat: 1200px;
	--gutier: 32px;
	--titlu: var(--wp--preset--font-family--poppins);
	--text: var(--wp--preset--font-family--inter);
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; overflow-x: hidden; }
.wp-site-blocks { padding: 0 !important; }
.wp-site-blocks > * { margin-block-start: 0 !important; }
strong, b { font-weight: 600; color: var(--bleumarin); }
::selection { background: var(--bleumarin); color: var(--alb); }
:focus-visible { outline: 2px solid var(--bleumarin); outline-offset: 3px; }

/* ---------- Antetul: manual p. 16, lockup mic de 44 px intr-un antet de 80 px ---------- */
.antet-sus { position: sticky; top: 0; z-index: 50; background: var(--alb); border-bottom: 1px solid var(--filet); }
.admin-bar .antet-sus { top: 32px; }
.antet { max-width: var(--lat); margin: 0 auto; height: 80px; padding: 0 var(--gutier); gap: 24px; }
.antet-logo { display: block; flex: none; line-height: 0; }
.antet-logo img { height: 44px; width: auto; display: block; }
.nav-principal { gap: 32px; font-size: 15px; font-weight: 500; }
.nav-principal .wp-block-navigation__container { gap: 32px; align-items: center; }
.nav-principal .wp-block-navigation-item__content { color: var(--bleumarin); text-decoration: none; padding: 6px 0; }
.nav-principal .wp-block-navigation-item:not(.buton-cont) .wp-block-navigation-item__content:hover,
.nav-principal .current-menu-item:not(.buton-cont) > .wp-block-navigation-item__content { text-decoration: underline; text-underline-offset: 8px; text-decoration-thickness: 1.5px; }
.nav-principal .buton-cont > .wp-block-navigation-item__content { display: inline-flex; align-items: center; min-height: 44px; padding: 0 20px; border-radius: 6px; background: var(--bleumarin); color: var(--alb); }
.nav-principal .buton-cont > .wp-block-navigation-item__content:hover { background: #0d1b33; }
.nav-principal .wp-block-navigation__responsive-container-open { width: 44px; height: 44px; align-items: center; justify-content: center; border: 1.5px solid var(--bleumarin); border-radius: 6px; color: var(--bleumarin); }
.nav-principal .wp-block-navigation__responsive-container.is-menu-open { background: var(--alb); color: var(--bleumarin); padding: 24px 16px; }
.nav-principal .is-menu-open .wp-block-navigation__responsive-container-content,
.nav-principal .is-menu-open .wp-block-navigation__container { align-items: flex-start !important; justify-content: flex-start !important; width: 100%; }
.nav-principal .is-menu-open .wp-block-navigation-item { width: 100%; }
.nav-principal .is-menu-open .wp-block-navigation-item:not(.buton-cont) { border-bottom: 1px solid var(--filet); }
.nav-principal .is-menu-open .wp-block-navigation-item:not(.buton-cont) .wp-block-navigation-item__content { color: var(--bleumarin); width: 100%; }
.nav-principal .is-menu-open .wp-block-navigation-item__content:focus-visible { outline-offset: 2px; }
.nav-principal .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container { gap: 8px; font-size: 20px; font-family: var(--titlu); align-items: flex-start; }
.nav-principal .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content { padding: 12px 0; }
.nav-principal .wp-block-navigation__responsive-container.is-menu-open .buton-cont { margin-top: 16px; }
.nav-principal .wp-block-navigation__responsive-container.is-menu-open .buton-cont > .wp-block-navigation-item__content { padding: 0 24px; min-height: 52px; font-family: var(--text); font-size: 17px; }
.wp-block-navigation__responsive-container-close { width: 44px; height: 44px; display: flex; align-items: center; justify-content: center; }

.nav-principal .fara-link > .wp-block-navigation-item__content { pointer-events: none; cursor: default; }

/* Subsolul si meniul contului: assets/css/cadru.css (un singur loc pentru site si cont). */

/* ---------- Elemente comune ---------- */
.principal { padding: 0; }
.cutie { max-width: var(--lat); margin: 0 auto !important; padding: 0 var(--gutier); }
.eticheta { font-family: var(--text); font-size: 13px; font-weight: 600; letter-spacing: .12em; text-transform: uppercase; color: var(--ardezie); margin: 0 0 16px; }
.principal p { max-width: 64ch; }
.principal h1, .principal h2, .principal h3 { text-wrap: balance; }
.principal h3 { font-size: 21px; }
.wp-block-button__link { min-height: 52px; padding: 0 28px; display: inline-flex; align-items: center; justify-content: center; border: 1.5px solid var(--bleumarin); transition: background .15s, color .15s; text-decoration: none; }
.wp-block-button__link:hover { background: #0d1b33; }
.is-style-outline > .wp-block-button__link, .wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: var(--bleumarin); border: 1.5px solid var(--bleumarin); }
.is-style-outline > .wp-block-button__link:hover { background: var(--bleumarin); color: var(--alb); }
.butoane { gap: 16px; margin-top: 36px; }

.sectiune { padding: 112px 0; }
.sectiune + .sectiune:not(.banda) { border-top: 1px solid var(--filet); }
.cap { max-width: 760px; margin-bottom: 56px !important; }
.cap h2 { margin: 0 0 20px; }
.cap p { font-size: 19px; }

/* ---------- Primul ecran: asezarea din macheta de site a manualului, p. 16 ---------- */
.erou { padding: 72px 0 104px; }
.erou-grila { display: grid !important; grid-template-columns: 1.1fr 1fr; gap: 72px; align-items: center; }
.erou-grila > * { margin: 0 !important; }
.anunt { display: inline-flex; align-items: center; gap: 10px; font-size: 14px; font-weight: 500; color: var(--bleumarin); border: 1px solid var(--filet); border-radius: 999px; padding: 6px 16px 6px 12px; margin: 0 0 28px !important; }
.anunt::before { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--bleumarin); }
.erou h1 { margin: 0 0 24px; max-width: 14ch; }
.erou .sub { font-size: 21px; line-height: 1.5; max-width: 32ch; margin: 0; }
.erou .pentru { margin-top: 24px; font-size: 15px; }

.panou { border: 1px solid var(--filet); border-radius: 16px; padding: 28px; background: var(--alb); box-shadow: 0 30px 60px -40px rgba(19, 37, 69, .35); }
.panou > * { margin: 0 !important; }
.panou .eticheta-panou { font-size: 15px; font-weight: 500; color: var(--ardezie); margin: 0 0 16px 4px !important; display: flex; justify-content: space-between; }
.rand { display: grid !important; grid-template-columns: 10px 1fr auto; gap: 18px; align-items: center; border: 1px solid var(--filet); border-radius: 10px; padding: 16px 20px; margin-bottom: 12px !important; }
.rand::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--bleumarin); }
.rand > * { margin: 0 !important; }
.rand .titlu-rand { font-weight: 600; color: var(--bleumarin); font-size: 16px; line-height: 1.35; }
.rand .titlu-rand span { display: block; font-weight: 400; color: var(--ardezie); font-size: 14px; margin-top: 2px; }
.rand .stare { font-size: 14px; font-weight: 600; color: var(--bleumarin); white-space: nowrap; }
.linie-accent { height: 4px; border-radius: 2px; background: linear-gradient(90deg, var(--turcoaz), var(--albastru), var(--violet)); margin: 22px 4px 4px !important; }

/* ---------- Banda pe bleumarin cu supergraficul (manual p. 15): simbolul marit, decupat, ton pe ton ---------- */
.banda { position: relative; overflow: hidden; background: var(--bleumarin); padding: 128px 0; }
.banda::after { content: ""; position: absolute; top: -8%; right: -9%; width: 62%; height: 116%; background: url("assets/img/supergrafic.svg") no-repeat right center / contain; pointer-events: none; }
.banda .cutie { position: relative; z-index: 1; }
.banda .eticheta { color: var(--ardezie-deschisa); }
.banda h2 { color: var(--alb); max-width: 17ch; margin: 0 0 28px; }
.banda p { color: var(--ardezie-deschisa); font-size: 19px; max-width: 50ch; }
.banda p.idee { color: var(--alb); font-family: var(--titlu); font-size: 24px; line-height: 1.45; max-width: 38ch; margin-top: 40px; }

/* Banda cu sigla mare (What we offer): lockup-ul orizontal inversat, implicit pe bleumarin (manual p. 7);
   peste 64 px inaltime, cu spatiul de protectie de 2x lasat liber in jur. */
.banda-sigla { padding: 144px 0; margin-top: 72px !important; }
.banda-sigla .sigla-mare { display: block; height: 96px; width: auto; max-width: 100%; }
.pagina-corp:has(> .banda:last-child) { padding-bottom: 0; }

/* ---------- Coloane si carduri ---------- */
.trei { display: grid !important; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.trei > * { margin: 0 !important; border-top: 2px solid var(--bleumarin); padding-top: 28px; }
.trei h3 { margin: 0 0 14px; }
.trei p { margin: 0; }

.module { display: grid !important; grid-template-columns: repeat(auto-fill, minmax(330px, 1fr)); gap: 24px; }
.module > * { margin: 0 !important; }
.modul { border: 1px solid var(--filet); border-radius: 14px; padding: 32px; display: flex; flex-direction: column; gap: 12px; transition: border-color .2s, transform .2s, box-shadow .2s; }
.modul:hover { border-color: var(--bleumarin); transform: translateY(-2px); box-shadow: 0 24px 48px -36px rgba(19, 37, 69, .45); }
.modul > * { margin: 0 !important; }
.modul h3 { font-size: 22px; }
.modul .pentru-cine { font-size: 14px; font-weight: 600; letter-spacing: .02em; color: var(--bleumarin); }
.modul p { font-size: 16px; }
.modul .beneficiu { border-top: 1px solid var(--filet); padding-top: 14px; margin-top: auto !important; font-size: 15px; }
.mai-mult { margin-top: 40px !important; }

.doua { display: grid !important; grid-template-columns: 1fr 1.1fr; gap: 72px; align-items: start; }
.doua > * { margin: 0 !important; }
.lista { list-style: none; padding: 0; margin: 0; }
.lista li { padding: 18px 0; border-bottom: 1px solid var(--filet); }
.lista li:first-child { border-top: 1px solid var(--filet); }
.lista strong { color: var(--bleumarin); font-weight: 600; }

.unelte { display: flex !important; flex-wrap: wrap; gap: 12px; }
.unelte > * { margin: 0 !important; border: 1px solid var(--filet); border-radius: 8px; padding: 12px 18px; color: var(--bleumarin); font-weight: 500; font-size: 16px; line-height: 1.35; }
.unelte span { display: block; font-weight: 400; color: var(--ardezie); font-size: 13px; }

.pasi { display: grid !important; grid-template-columns: repeat(4, 1fr); gap: 32px; counter-reset: pas; list-style: none; padding: 0; margin: 0; }
.pasi li { counter-increment: pas; }
.pasi li::before { content: counter(pas); display: flex; width: 44px; height: 44px; border-radius: 50%; border: 1.5px solid var(--bleumarin); color: var(--bleumarin); font-family: var(--titlu); font-weight: 500; align-items: center; justify-content: center; margin-bottom: 20px; }
.pasi strong { display: block; font-family: var(--titlu); font-weight: 500; color: var(--bleumarin); font-size: 19px; margin-bottom: 8px; }

.client { display: flex !important; justify-content: space-between; align-items: center; gap: 32px; flex-wrap: wrap; border: 1px solid var(--filet); border-radius: 16px; padding: 48px; }
.client > * { margin: 0 !important; }
.client h2 { margin: 0 0 12px; }
.final { text-align: center; }
.final h2 { max-width: 24ch; margin: 0 auto 16px; }
.final p { margin: 0 auto; }
.final .butoane { justify-content: center; }

/* ---------- Paginile obisnuite (Ce oferim, Cariere, Contact, legale) ---------- */
.pagina-cap { max-width: var(--lat); margin: 0 auto; padding: 88px var(--gutier) 8px; }
.pagina-cap h1 { max-width: 18ch; margin: 0; }
.pagina-corp { padding-bottom: 120px; }
.pagina-corp > .cutie, .pagina-corp > .sectiune { max-width: none; }
.text-lung { max-width: 760px; margin: 0 auto 0 0 !important; }
.pagina-corp > :not(.sectiune):not(.cutie):not(.banda):not(.legal-text) { max-width: var(--lat); margin-left: auto !important; margin-right: auto !important; padding-left: var(--gutier); padding-right: var(--gutier); }
.legal-text { max-width: 760px !important; margin-left: max(var(--gutier), calc((100% - var(--lat)) / 2 + var(--gutier))) !important; padding: 0 !important; }
.legal-text h2 { font-size: 24px; margin: 56px 0 16px; scroll-margin-top: 100px; }
.legal-text h3 { font-size: 18px; margin: 32px 0 10px; }
.legal-text p, .legal-text li { font-size: 16px; }
.legal-text ul { padding-left: 1.2em; }
.legal-text li { margin-bottom: 8px; }
.legal-text .data { font-size: 14px; color: var(--ardezie); margin-top: 24px; }
/* Paginile legale in doua limbi (30.10.2026): selectorul English / Romana sus si la inceputul partii romane */
.legal-text #english, .legal-text #romana { scroll-margin-top: 100px; }
.legal-text #romana { margin-top: 72px; padding-top: 40px; border-top: 1px solid var(--ardezie-deschisa); }
.legal-text .limba-alege { display: block; font-size: 0 !important; max-width: none !important; width: auto; margin: 24px 0 0; }
.legal-text .limba-alege a { font-size: 14px; font-weight: 600; color: var(--bleumarin); text-decoration: none; border: 1px solid var(--bleumarin); border-radius: 999px; padding: 6px 16px; line-height: 1.4; display: inline-block; white-space: nowrap; word-break: normal; overflow-wrap: normal; margin: 0 8px 8px 0; }
.legal-text .limba-alege a:hover, .legal-text .limba-alege a:focus-visible { background: var(--bleumarin); color: #FFFFFF; }
.legal-text .identitate { border: 1px solid var(--filet); border-radius: 12px; padding: 24px 28px; }
.legal-text .identitate p { margin: 0 0 6px; }
.legal-text .formular { border-left: 2px solid var(--bleumarin); padding-left: 20px; }
.legal-text a { word-break: break-word; }
.de-completat { font-weight: 600; color: var(--bleumarin); }
.intro { font-size: 21px; line-height: 1.55; max-width: 46ch; margin-top: 24px !important; }

/* ---------- Ecrane mai mici ---------- */
@media (max-width: 1080px) {
	.erou-grila, .doua { grid-template-columns: 1fr; gap: 48px; }
	.trei { grid-template-columns: 1fr; gap: 32px; }
	.pasi { grid-template-columns: 1fr 1fr; }
	.banda::after { width: 90%; right: -40%; opacity: .9; }
}
@media (max-width: 781px) {
	:root { --gutier: 16px; }
	.antet { height: 64px; }
	.antet-logo img { height: 36px; }
	.erou { padding: 40px 0 72px; }
	.erou .sub { font-size: 19px; }
	.sectiune { padding: 72px 0; }
	.banda { padding: 88px 0; }
	.banda::after { width: 150%; right: -95%; }
	.banda p.idee { font-size: 21px; }
	.banda-sigla { padding: 96px 0; margin-top: 48px !important; }
	.banda-sigla .sigla-mare { height: 64px; }
	.panou { padding: 16px; }
	.rand { padding: 14px 16px; gap: 12px; }
	.module { grid-template-columns: 1fr; }
	.modul { padding: 24px; }
	.pasi { grid-template-columns: 1fr; }
	.client { padding: 28px; }
	.butoane .wp-block-button, .butoane .wp-block-button__link { width: 100%; }
	.pagina-cap { padding-top: 48px; }
	.legal-text { margin-left: var(--gutier) !important; margin-right: var(--gutier) !important; }
}
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	.modul, .antet-sus { transition: none; }
	.modul:hover { transform: none; }
}

/* ---------- What we offer: primul ecran pe bleumarin, cu simbolul mare animat (29.10.2026) ----------
   Simbolul e fisierul de productie inversat (alb + gradientul luminos, manual p. 7), nu un desen refacut.
   Miscarea: omul apare, a doua minte se dezvaluie pe directia gradientului (ca si cum s-ar aprinde), apoi
   culorile gradientului curg incet prin ea; la cursor, a doua minte se misca putin mai mult decat omul.
   Gradientul acopera circa 3-5% din ecran, sub plafonul de 10% din manual (p. 13). */
.erou-oferta { background: var(--bleumarin); min-height: calc(100vh - 80px); display: flex; align-items: center; padding: 64px 0; overflow: hidden; }
.admin-bar .erou-oferta { min-height: calc(100vh - 112px); }
.erou-oferta-grila { display: grid; grid-template-columns: 1.05fr 1fr; gap: 72px; align-items: center; width: 100%; }
.erou-oferta-simbol { display: flex; justify-content: center; }
.simbol-anim { width: 100%; max-width: 600px; height: auto; display: block; overflow: visible; }
/* Sigla se misca doar intreaga: omul si a doua minte nu se deplaseaza unul fata de altul si gradientul sta pe loc,
   ca desenul sa ramana fisierul de productie (Adrian, 30.10). */
.simbol-anim { transform: translate(calc(var(--px, 0) * 6px), calc(var(--py, 0) * 5px)); transition: transform 1s cubic-bezier(.2,.8,.2,1); }
.simbol-anim .om { opacity: 0; animation: simbol-om 1s cubic-bezier(.4,0,.2,1) .15s forwards; }
@keyframes simbol-om { from { opacity: 0; } to { opacity: 1; } }
.erou-oferta-text .eticheta { color: var(--ardezie-deschisa); }
.erou-oferta-text h1 { color: var(--alb); margin: 0 0 24px; max-width: 12ch; }
.erou-oferta-text .sub { color: var(--ardezie-deschisa); font-size: 21px; line-height: 1.5; max-width: 34ch; margin: 0; }
.erou-oferta-text .anunt { border-color: var(--supergrafic); color: var(--alb); margin-bottom: 24px !important; }
.erou-oferta-text .anunt::before { background: var(--turcoaz-luminos, #2ED3DC); }
.erou-oferta-text > * { opacity: 0; transform: translateY(14px); animation: text-sus .9s cubic-bezier(.2,.8,.2,1) forwards; }
.erou-oferta-text > :nth-child(1) { animation-delay: 1.1s; }
.erou-oferta-text > :nth-child(2) { animation-delay: 1.25s; }
.erou-oferta-text > :nth-child(3) { animation-delay: 1.4s; }
.erou-oferta-text > :nth-child(4) { animation-delay: 1.7s; }
.erou-oferta-text > :nth-child(5) { animation-delay: 1.9s; }
.erou-oferta-text .anunt + .eticheta { margin-top: 0; }
@keyframes text-sus { to { opacity: 1; transform: none; } }
.link-jos { display: inline-flex; align-items: center; gap: 14px; margin-top: 40px; color: var(--alb); font-weight: 500; text-decoration: none; }
.link-jos span { width: 40px; height: 40px; border: 1px solid var(--ardezie-deschisa); border-radius: 50%; position: relative; transition: border-color .2s, transform .2s; }
.link-jos span::after { content: ""; position: absolute; left: 50%; top: 50%; width: 9px; height: 9px; border-right: 1.5px solid var(--alb); border-bottom: 1.5px solid var(--alb); transform: translate(-50%, -65%) rotate(45deg); }
.link-jos:hover span { border-color: var(--alb); transform: translateY(3px); }
.erou-oferta.fara-miscare .simbol-anim .om, .erou-oferta.fara-miscare .erou-oferta-text > * { animation: none; opacity: 1; transform: none; }
.pagina-oferta .cum-functioneaza { padding: 120px 0; }
.pagina-oferta .pagina-corp { padding-bottom: 0; }
.pagina-oferta .pagina-corp .gol { display: none; }
.acasa .erou-oferta { min-height: calc(100vh - 80px); }
/* Lumina difuza care urmareste cursorul pe bleumarin (Adrian, 29.10): tonul supergraficului (#1C3256, ton pe ton,
   manual p. 15) plus putin alb; doar cu cursor, nu pe telefon. */
.erou-oferta { position: relative; }
.erou-oferta .lumina { position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .6s ease; background: radial-gradient(640px circle at var(--sx, 50%) var(--sy, 50%), rgba(255, 255, 255, .075), rgba(28, 50, 86, .9) 28%, rgba(28, 50, 86, .35) 48%, transparent 68%); }
.erou-oferta.cu-lumina .lumina { opacity: 1; }
.erou-oferta .cutie { position: relative; z-index: 1; }
@media (hover: none) { .erou-oferta .lumina { display: none; } }
.pagina-oferta .pagina-corp > .sectiune { max-width: none; padding-left: 0; padding-right: 0; }
@media (max-width: 1080px) {
	.erou-oferta-grila { grid-template-columns: 1fr; gap: 40px; }
	.erou-oferta { min-height: 0; padding: 56px 0 72px; }
	.simbol-anim { max-width: 420px; }
	.erou-oferta-simbol { justify-content: flex-start; }
}
@media (max-width: 781px) {
	.simbol-anim { max-width: 300px; }
	.erou-oferta-text .sub { font-size: 19px; }
	.pagina-oferta .cum-functioneaza { padding: 80px 0; }
}
@media (prefers-reduced-motion: reduce) {
	.simbol-anim .om, .erou-oferta-text > * { animation: none; opacity: 1; transform: none; }
	.simbol-anim { transition: none; transform: none; }
}

.subsol-alb .cum-functioneaza { padding-bottom: 140px; }