/* ─────────────────────────────────────────────────────────────────────────── members — CSS AUTONOM (theme-agnostic). AUTO-GENERAT din themes/vestido/assets/css/vestido.css (de-scoping `.vestido `). Se încarcă DOAR pe teme ≠ bundled_theme (vezi ModuleBase::themeAgnosticCss). Tokenii :root sunt siguri aici: pe tema vestido fișierul nu se încarcă deloc. ─────────────────────────────────────────────────────────────────────────── */ :root { --v-rose:#d84c5b; --v-rose-lt:#ff5a5f; --v-rose-dk:#b53847; --v-wine:#8e2b30; --v-coral:#ffb199; --v-gold:#e7c8a0; --v-ink:#161616; --v-ink-soft:#4a4a4a; --v-muted:#666666; --v-ivory:#f7f4ef; --v-surface:#ffffff; --v-ivory-2:#fcfaf7; --v-ivory-3:#f1ece3; --v-graphite:#161616; --v-cream:#f6f1e9; --v-red:var(--v-rose); --v-red-dark:var(--v-rose-dk); --v-bg:var(--v-ivory); --v-card:var(--v-surface); --v-line:rgba(31,24,19,.10); --v-line-2:rgba(31,24,19,.06); --glass:rgba(255,255,255,.55); --glass-brd:rgba(255,255,255,.7); --r-md:16px; --r-lg:22px; --r-xl:28px; --r-2xl:36px; --sh-soft:0 4px 20px rgba(0,0,0,.04); --sh-card:0 10px 40px rgba(0,0,0,.08); --sh-float:0 20px 60px rgba(0,0,0,.08); --sh-glow:0 40px 120px rgba(216,76,91,.18); --blur-glass:blur(24px) saturate(150%); --ease:cubic-bezier(.16,1,.3,1); --v-fhead:"Instrument Serif",Georgia,"Times New Roman",serif; --v-fbody:"General Sans",ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif; --font-heading:var(--v-fhead); --font-body:var(--v-fbody); } /* Bază tipografică pe wrapper-ele de modul (tema generică nu dă fontul de brand). */ .v-page-title, .v-auth h1, .v-card h3, .v-course-hero-title, .v-mod-title { font-family: var(--v-fhead); } /* — Layout helpers — */ .v-container { max-width: 1200px; margin: 0 auto; padding: 0 1.6rem; } .v-section { position: relative; padding: 4rem 0; } /* Doar DOUĂ secțiuni plate consecutive (alb pe alb, ex. „De ce…" → bandă CTA) nu-și dublează spațiul. O secțiune plată care urmează o bandă colorată (.v-section-alt) ÎȘI PĂSTREAZĂ padding-ul de sus (altfel s-ar lipi de bandă). */ .v-section:not(.v-section-alt) + .v-section:not(.v-section-alt) { padding-top: 0; } .v-section-alt { background: var(--v-ivory-3); } .v-muted { color: var(--v-muted); } .v-lead { font-size: 1.22rem; line-height: 1.55; color: var(--v-ink-soft); } .v-eyebrow { display: inline-block; text-transform: uppercase; letter-spacing: .2em; font-size: .72rem; font-weight: 600; color: var(--v-wine); } .v-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 2rem; margin-bottom: 2.6rem; flex-wrap: wrap; } .v-section-head h2 { font-size: clamp(2rem, 4vw, 3rem); margin: .7rem 0 0; } .v-section-head p { color: var(--v-muted); margin: .6rem 0 0; max-width: 46ch; } .v-more { display: inline-flex; align-items: center; gap: .55rem; padding: .7rem 1.3rem; font-weight: 600; color: var(--v-ink); white-space: nowrap; background: var(--v-surface); border: 1px solid var(--v-line); border-radius: 999px; box-shadow: var(--sh-soft); transition: gap .3s var(--ease), transform .3s var(--ease), color .2s; } .v-more:hover { gap: .95rem; transform: translateY(-2px); color: var(--v-rose); } /* ============================================================================ BUTOANE ============================================================================ */ .v-btn { position: relative; display: inline-flex; align-items: center; gap: .55rem; padding: .95rem 1.7rem; border-radius: 999px; border: 0; font-family: var(--v-fbody); font-size: .98rem; font-weight: 600; color: #fff; cursor: pointer; text-decoration: none; background: linear-gradient(180deg, #ff6f72 0%, var(--v-rose) 52%, var(--v-rose-dk) 100%); box-shadow: inset 0 1px 0 rgba(255,255,255,.45), inset 0 -3px 8px rgba(120,20,30,.20), 0 2px 4px rgba(216,76,91,.25), 0 9px 20px rgba(216,76,91,.32); transition: transform .3s var(--ease), box-shadow .3s var(--ease), filter .25s; will-change: transform; } .v-btn::after { content: ''; position: absolute; inset: 0; border-radius: inherit; background: radial-gradient(120px 80px at var(--mx,50%) var(--my,50%), rgba(255,255,255,.32), transparent 70%); opacity: 0; transition: opacity .3s; } .v-btn:hover { transform: translateY(-2px); filter: brightness(1.03); box-shadow: inset 0 1px 0 rgba(255,255,255,.5), inset 0 -3px 8px rgba(120,20,30,.18), 0 3px 6px rgba(216,76,91,.3), 0 16px 32px rgba(216,76,91,.42); } .v-btn:hover::after { opacity: 1; } .v-btn:active { transform: translateY(0); box-shadow: inset 0 2px 5px rgba(120,20,30,.3), 0 3px 8px rgba(216,76,91,.28); } .v-btn-ghost { background: linear-gradient(180deg, #fff, var(--v-ivory-2)); color: var(--v-ink); border: 1px solid var(--v-line); box-shadow: inset 0 1px 0 #fff, 0 4px 12px rgba(60,40,30,.08); } .v-btn-ghost:hover { color: var(--v-ink); transform: translateY(-2px); box-shadow: inset 0 1px 0 #fff, 0 10px 24px rgba(60,40,30,.14); } .v-btn-light { background: var(--v-surface); color: var(--v-rose); box-shadow: var(--sh-card); } .v-btn-light:hover { background: #fff; color: var(--v-rose-dk); } .v-btn .v-ic { width: 1.05em; height: 1.05em; display: inline-block; } /* Fix specificitate: resetul `a {color:inherit}` (0,1,1) bătea `.v-btn` — forțăm culorile corecte ale butoanelor pe și