.brxe-code{width:100%}@keyframes load8{0%{-webkit-transform:rotate(0deg);transform:rotate(0deg)}to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes spin{to{-webkit-transform:rotate(1turn);transform:rotate(1turn)}}@keyframes scrolling{0%{opacity:1}to{opacity:0;-webkit-transform:translateY(10px);transform:translateY(10px)}}:where(.brxe-tabs){display:flex;flex-direction:column;width:100%}:where(.brxe-tabs) .tab-title{width:auto}:where(.brxe-tabs) .tab-pane{display:none}:where(.brxe-tabs) .tab-pane:empty{display:none!important}:where(.brxe-tabs) .tab-pane.brx-open{display:block}:where(.brxe-tabs).horizontal .tab-title:not(:first-child){border-left:0!important}:where(.brxe-tabs).horizontal .tab-content{margin-top:-1px}:where(.brxe-tabs).vertical{flex-direction:row}:where(.brxe-tabs).vertical .tab-title:not(:first-child){border-top:0!important}:where(.brxe-tabs).vertical .tab-menu{display:block;max-width:40%;min-width:20%}:where(.brxe-tabs) .tab-menu{display:flex;flex-wrap:wrap;line-height:1;list-style-type:none;margin:0;padding:0;position:relative}:where(.brxe-tabs) .tab-title{align-items:center;cursor:pointer;display:flex;gap:10px;line-height:1}:where(.brxe-tabs) .tab-title:empty{display:none!important}:where(.brxe-tabs) .tab-title.brx-open{font-weight:700}:where(.brxe-tabs) .tab-title.icon-right{flex-direction:row-reverse}:where(.brxe-tabs) .tab-content{flex:1;list-style-type:none;margin:0;padding:0}:where(.brxe-heading).has-separator{align-items:center;display:inline-flex;gap:20px}:where(.brxe-heading)>[contenteditable]{display:inline-block;text-decoration:inherit}:where(.brxe-heading) .separator{border-top:1px solid;flex-grow:1;flex-shrink:0;height:1px}/* BREAKPOINT: Desktop (BASE) */#brxe-keyeav {padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0}/* * Duminica Orfanului 2026 – stilurile paginii (tema Bricks). * * Se pun o singură dată: Bricks → Setările paginii → Custom code → Custom CSS * (sau în tabul CSS al unuia dintre elementele Code). * Toate regulile încep cu .do26, ca să nu atingă restul site-ului. * Bricks are html { font-size: 62.5% } (1rem = 10px), de aceea aici sunt doar px și em. */.do26 { --do-ink: #3b3632;     /* textul */ --do-muted: #5e5751;    /* text secundar */ --do-head: #4a3326;     /* titluri, maro închis */ --do-brown: #8a5a3f;    /* butoane, din „DUMINICA” */ --do-brown-dark: #7a4e36; --do-blue: #4a7080;     /* accente, din „orfanului” */ --do-blue-dark: #3f6474; --do-cream: #f7f0e6;    /* fundalul bannerului */ --do-sand: #efe4d4; --do-line: #e6d9c6; --do-radius: 28px; --do-shadow: 0 22px 44px -26px rgba(74, 51, 38, .45); width: 100%; margin: 0 auto; font-family: Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-size: 17px; line-height: 1.65; color: var(--do-ink); text-align: left;} .do26 *, .do26 *::before, .do26 *::after { box-sizing: border-box; } .do26 > * + * { margin-top: clamp(56px, 7vw, 96px); }/* Text */.do26 h1, .do26 h2, .do26 h3 { margin: 0 0 .45em; font-family: inherit; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--do-head); } .do26 h2 { font-size: clamp(27px, 1.6vw + 18px, 40px); } .do26 h3 { font-size: 20px; line-height: 1.3; letter-spacing: -.01em; } .do26 p { margin: 0 0 1em; } .do26 p:last-child { margin-bottom: 0; } .do26 strong { font-weight: 700; color: var(--do-head); } .do26 ul, .do26 ol { margin: 0; padding: 0; list-style: none; } .do26 figure { margin: 0; } .do26 img { display: block; max-width: 100%; height: auto; } .do26 a { color: var(--do-blue); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; } .do26 a:hover { color: var(--do-brown-dark); } .do26 a:focus-visible, .do26 summary:focus-visible { outline: 3px solid var(--do-blue); outline-offset: 3px; border-radius: 8px; } .do26-kicker { display: flex; align-items: center; gap: 12px; margin: 0 0 14px !important; font-size: 13px; font-weight: 700; letter-spacing: .16em; line-height: 1.3; text-transform: uppercase; color: var(--do-blue); } .do26-kicker::before { content: ""; flex: none; width: 36px; height: 3px; border-radius: 3px; background: var(--do-brown); } .do26-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .do26-head { max-width: 760px; margin: 0 auto clamp(28px, 4vw, 44px); text-align: center; } .do26-head .do26-kicker { justify-content: center; } .do26-head p { color: var(--do-muted); }/* Butoane */.do26 .do26-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 12px 26px; border: 2px solid var(--do-brown); border-radius: 999px; background: var(--do-brown); font-size: 16px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; color: #fff; box-shadow: 0 14px 26px -16px rgba(122, 78, 54, .9); transition: background-color .2s, border-color .2s, color .2s, transform .2s; } .do26 .do26-btn:hover { border-color: var(--do-brown-dark); background: var(--do-brown-dark); color: #fff; transform: translateY(-2px); } .do26 .do26-btn-alt { border-color: var(--do-line); background: #fff; color: var(--do-brown-dark); box-shadow: none; } .do26 .do26-btn-alt:hover { border-color: var(--do-brown); background: #fff; color: var(--do-brown-dark); } .do26-btn svg { width: 20px; height: 20px; flex: none; } .do26-actions { display: flex; flex-wrap: wrap; gap: 12px; }/* 1. Bannerul */.do26-hero { position: relative; } .do26-hero-media { overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--do-radius); background: var(--do-cream); box-shadow: var(--do-shadow); } .do26-hero-media img { width: 100%; height: 100%; object-fit: cover; } .do26-hero-text { margin-top: 22px; text-align: center; } .do26-hero-label { margin: 0 0 10px !important; font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--do-brown-dark); } .do26-dates { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 18px !important; } .do26-dates li { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--do-line); border-radius: 50%; background: #fff; font-size: 17px; font-weight: 800; line-height: 1; color: var(--do-brown-dark); box-shadow: 0 6px 14px -10px rgba(74, 51, 38, .6); } .do26-hero-text .do26-actions { justify-content: center; }/* Pe ecrane late, datele și butoanele stau în bannerul însuși, sub titlu. */@media (min-width: 900px) { .do26-hero-text { position: absolute; left: 21.3%; top: 57%; width: 44%; margin: 0; text-align: left; } .do26-dates, .do26-hero-text .do26-actions { justify-content: flex-start; }}@media (min-width: 900px) and (max-width: 1080px) { .do26-hero-text { top: 55%; } .do26-hero-label { font-size: 12px; } .do26-dates li { width: 40px; height: 40px; font-size: 15px; } .do26 .do26-hero-text .do26-btn { min-height: 46px; padding: 10px 18px; font-size: 15px; }}/* 2. Ce este */.do26-intro { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 72px); align-items: center; } .do26-intro-text > p:not(.do26-kicker) { font-size: 18px; } .do26-motto { margin: 26px 0 0 !important; padding: 18px 22px; border-left: 4px solid var(--do-brown); border-radius: 0 18px 18px 0; background: var(--do-cream); } .do26-motto span { display: block; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--do-blue-dark); } .do26-motto strong { display: block; margin-top: 2px; font-size: 24px; font-weight: 800; letter-spacing: -.01em; } .do26-intro-img { position: relative; } .do26-intro-img::before { content: ""; position: absolute; inset: 18px -14px -14px 18px; border-radius: var(--do-radius); background: var(--do-sand); } .do26-intro-img img { position: relative; width: 100%; aspect-ratio: 1; border-radius: var(--do-radius); object-fit: cover; box-shadow: var(--do-shadow); }/* 3. De ce */.do26-why { padding: clamp(36px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--do-radius); background: var(--do-cream); } .do26-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .do26-cards li { display: flex; flex-direction: column; gap: 6px; padding: 26px 22px; border: 1px solid var(--do-line); border-radius: 22px; background: #fff; } .do26-cards svg { width: 44px; height: 44px; margin-bottom: 10px; padding: 10px; border-radius: 14px; background: var(--do-sand); color: var(--do-brown-dark); } .do26-cards strong { font-size: 30px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: var(--do-brown); } .do26-cards span { font-size: 16px; line-height: 1.5; color: var(--do-ink); }/* 4. Pașii */.do26-steps ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; counter-reset: do26-pas; } .do26-steps li { position: relative; padding: 30px 26px 28px; border: 1px solid var(--do-line); border-radius: 24px; background: #fff; counter-increment: do26-pas; } .do26-steps li::before { content: counter(do26-pas); display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 18px; border-radius: 50%; background: var(--do-brown); font-size: 20px; font-weight: 800; color: #fff; } .do26-steps li p { color: var(--do-muted); } .do26-steps-cta { margin-top: 28px !important; text-align: center; } .do26-steps-cta small { display: block; margin-top: 10px; font-size: 15px; color: var(--do-muted); }/* 5. Variante de organizare */.do26-variants { padding: clamp(36px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--do-radius); background: var(--do-sand); } .do26-variants ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .do26-variants li { display: flex; flex-direction: column; padding: 28px 26px; border-radius: 22px; background: #fff; } .do26-time { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 14px; border-radius: 999px; background: var(--do-cream); font-size: 14px; font-weight: 700; color: var(--do-blue-dark); } .do26-time svg { width: 18px; height: 18px; } .do26-variants li p { color: var(--do-muted); } .do26-note { margin-top: 24px !important; text-align: center; font-weight: 600; color: var(--do-head); }/* 6. Video */.do26-video-frame { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--do-radius); background: #2b2622; box-shadow: var(--do-shadow); } .do26-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }/* 7. Înscrierea: fundalul cu inima și „Mă vede cineva?” */.do26-anchor { scroll-margin-top: 120px; } .do26 > .do26-anchor { margin-top: 0; } .do26-cta { display: flex; align-items: center; min-height: 380px; overflow: hidden; border-radius: var(--do-radius); background: var(--do-cream) url("/wp-content/uploads/duminica-orfanului-2026-fundal.jpg") 72% center / cover no-repeat; box-shadow: var(--do-shadow); } .do26-cta-in { max-width: 560px; padding: clamp(32px, 4vw, 56px); } .do26-cta-in h2 { font-size: clamp(25px, 1.3vw + 17px, 34px); } .do26-cta-in p { font-size: 18px; } .do26-cta-in .do26-arrow { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-weight: 700; color: var(--do-brown-dark); } .do26-cta-in .do26-arrow svg { width: 22px; height: 22px; }/* 8. Întrebări frecvente */.do26-faq-list { max-width: 880px; margin: 0 auto; display: grid; gap: 12px; } .do26-faq-list details { border: 1px solid var(--do-line); border-radius: 18px; background: #fff; transition: box-shadow .2s; } .do26-faq-list details[open] { box-shadow: 0 14px 30px -24px rgba(74, 51, 38, .6); } .do26-faq-list summary { position: relative; display: block; padding: 20px 60px 20px 24px; font-size: 18px; font-weight: 700; line-height: 1.4; color: var(--do-head); cursor: pointer; list-style: none; } .do26-faq-list summary::-webkit-details-marker { display: none; } .do26-faq-list summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 24px; height: 24px; margin-top: -12px; border-radius: 50%; background: var(--do-cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a4e36' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 7v10M7 12h10'/%3E%3C/svg%3E") center / 16px no-repeat; transition: transform .2s; } .do26-faq-list details[open] summary::after { transform: rotate(45deg); } .do26-faq-list details > div { padding: 0 24px 22px; color: var(--do-ink); } .do26-faq-list details ul { margin: 0 0 1em; display: grid; gap: 8px; } .do26-faq-list details li { position: relative; padding-left: 22px; } .do26-faq-list details li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--do-brown); }/* 9. Contact */.do26-contact { padding: clamp(36px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--do-radius); background: var(--do-cream); } .do26-people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 880px; margin: 0 auto; } .do26-people li { display: flex; align-items: center; gap: 20px; padding: 22px; border-radius: 22px; background: #fff; } .do26-people img { flex: none; width: 96px; height: 96px; border: 4px solid var(--do-sand); border-radius: 50%; object-fit: cover; object-position: 50% 15%; } .do26-people strong { display: block; font-size: 18px; } .do26-people .do26-role { display: block; margin-bottom: 6px; font-size: 14px; color: var(--do-muted); } .do26-people a { display: block; width: max-content; max-width: 100%; font-size: 15px; overflow-wrap: anywhere; } .do26-contact-more { margin-top: 24px !important; text-align: center; }/* Ecrane mai mici */@media (max-width: 980px) { .do26-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .do26-variants ul, .do26-steps ol { grid-template-columns: minmax(0, 1fr); } .do26-variants ul { max-width: 640px; margin: 0 auto; } .do26-steps ol { max-width: 640px; margin: 0 auto; } .do26-steps li { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 18px; } .do26-steps li::before { grid-row: span 2; margin: 0; } .do26-steps li h3 { align-self: center; margin: 0; }}@media (max-width: 760px) { .do26 { font-size: 16px; } .do26-intro { grid-template-columns: minmax(0, 1fr); } .do26-intro-img { max-width: 440px; margin: 0 auto; } .do26-intro-text > p:not(.do26-kicker), .do26-cta-in p { font-size: 17px; } .do26-people { grid-template-columns: minmax(0, 1fr); } .do26-cta { align-items: flex-end; min-height: 0; padding-top: 180px; background-image: linear-gradient(180deg, rgba(247, 240, 230, 0) 30%, #f7f0e6 60%), url("/wp-content/uploads/duminica-orfanului-2026-fundal.jpg"); background-size: auto, auto 330px; background-position: center, 84% 0; background-repeat: no-repeat; } .do26-cta-in { padding: 0 24px 30px; }}@media (max-width: 520px) { .do26-cards { grid-template-columns: minmax(0, 1fr); } .do26-hero-media { border-radius: 18px; } .do26-why, .do26-variants, .do26-contact { padding-inline: 16px; border-radius: 22px; } .do26-faq-list summary { padding: 18px 54px 18px 18px; font-size: 17px; } .do26-faq-list details > div { padding: 0 18px 18px; } .do26-people li { flex-direction: column; text-align: center; } .do26-people a { margin: 0 auto; } .do26-actions .do26-btn { flex: 1 1 100%; }}@media (prefers-reduced-motion: reduce) { .do26 *, .do26 *::before, .do26 *::after { transition: none !important; }}/* * Opțional: formularul de înscriere care rămâne din Bricks (secțiunea „Înscrie-te aici!”, #brxe-82b813), * în aceleași culori. Dacă secțiunea e refăcută în Bricks, ID-ul se schimbă și regulile de mai jos nu se mai aplică * (nu strică nimic). */#brxe-82b813 .brxe-heading { color: #4a3326; }#brxe-82b813 .tab-title.brx-open { color: #7a4e36; }#brxe-82b813 .brxe-form input:not([type="checkbox"]):not([type="radio"]),#brxe-82b813 .brxe-form textarea { border: 1px solid #e6d9c6; border-radius: 12px; background: #fff; }#brxe-82b813 .brxe-form input:focus, #brxe-82b813 .brxe-form textarea:focus { border-color: #8a5a3f; outline: 2px solid rgba(138, 90, 63, .25); }#brxe-82b813 .brxe-form .bricks-button { border-radius: 999px; background-color: #8a5a3f; color: #fff; }#brxe-82b813 .brxe-form .bricks-button:hover { background-color: #7a4e36; }/* BREAKPOINT: Desktop (BASE) */#brxe-82b813 {margin-top: 5%; background-color: var(--bricks-color-ntpulh)}/* BREAKPOINT: Desktop (BASE) */#brxe-semklm {align-self: center}/* BREAKPOINT: Desktop (BASE) */#brxe-faaqvd .tab-title {padding-top: 20px; padding-right: 20px; padding-bottom: 20px; padding-left: 20px; border: 0; border-color: #dedede; flex-grow: 1}#brxe-faaqvd .tab-content {padding-top: 20px; padding-right: 20px; padding-bottom: 20px; padding-left: 20px; border: 1px solid #dedede}/* BREAKPOINT: Desktop (BASE) */#brxe-ufzlhe {flex-direction: column}/* BREAKPOINT: Desktop (BASE) */#brxe-slqxyp {flex-direction: row}/* BREAKPOINT: Desktop (BASE) */#brxe-wqprma {margin-top: 5%; background-color: var(--bricks-color-ntpulh)}/* BREAKPOINT: Desktop (BASE) */#brxe-gfifyg {padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0}/* * Duminica Orfanului 2026 – stilurile paginii (tema Bricks). * * Se pun o singură dată: Bricks → Setările paginii → Custom code → Custom CSS * (sau în tabul CSS al unuia dintre elementele Code). * Toate regulile încep cu .do26, ca să nu atingă restul site-ului. * Bricks are html { font-size: 62.5% } (1rem = 10px), de aceea aici sunt doar px și em. */.do26 { --do-ink: #3b3632;     /* textul */ --do-muted: #5e5751;    /* text secundar */ --do-head: #4a3326;     /* titluri, maro închis */ --do-brown: #8a5a3f;    /* butoane, din „DUMINICA” */ --do-brown-dark: #7a4e36; --do-blue: #4a7080;     /* accente, din „orfanului” */ --do-blue-dark: #3f6474; --do-cream: #f7f0e6;    /* fundalul bannerului */ --do-sand: #efe4d4; --do-line: #e6d9c6; --do-radius: 28px; --do-shadow: 0 22px 44px -26px rgba(74, 51, 38, .45); width: 100%; margin: 0 auto; font-family: Montserrat, system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; font-size: 17px; line-height: 1.65; color: var(--do-ink); text-align: left;} .do26 *, .do26 *::before, .do26 *::after { box-sizing: border-box; } .do26 > * + * { margin-top: clamp(56px, 7vw, 96px); }/* Text */.do26 h1, .do26 h2, .do26 h3 { margin: 0 0 .45em; font-family: inherit; font-weight: 800; line-height: 1.15; letter-spacing: -.02em; color: var(--do-head); } .do26 h2 { font-size: clamp(27px, 1.6vw + 18px, 40px); } .do26 h3 { font-size: 20px; line-height: 1.3; letter-spacing: -.01em; } .do26 p { margin: 0 0 1em; } .do26 p:last-child { margin-bottom: 0; } .do26 strong { font-weight: 700; color: var(--do-head); } .do26 ul, .do26 ol { margin: 0; padding: 0; list-style: none; } .do26 figure { margin: 0; } .do26 img { display: block; max-width: 100%; height: auto; } .do26 a { color: var(--do-blue); font-weight: 600; text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; } .do26 a:hover { color: var(--do-brown-dark); } .do26 a:focus-visible, .do26 summary:focus-visible { outline: 3px solid var(--do-blue); outline-offset: 3px; border-radius: 8px; } .do26-kicker { display: flex; align-items: center; gap: 12px; margin: 0 0 14px !important; font-size: 13px; font-weight: 700; letter-spacing: .16em; line-height: 1.3; text-transform: uppercase; color: var(--do-blue); } .do26-kicker::before { content: ""; flex: none; width: 36px; height: 3px; border-radius: 3px; background: var(--do-brown); } .do26-sr { position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; } .do26-head { max-width: 760px; margin: 0 auto clamp(28px, 4vw, 44px); text-align: center; } .do26-head .do26-kicker { justify-content: center; } .do26-head p { color: var(--do-muted); }/* Butoane */.do26 .do26-btn { display: inline-flex; align-items: center; justify-content: center; gap: 10px; min-height: 52px; padding: 12px 26px; border: 2px solid var(--do-brown); border-radius: 999px; background: var(--do-brown); font-size: 16px; font-weight: 700; line-height: 1.2; text-align: center; text-decoration: none; color: #fff; box-shadow: 0 14px 26px -16px rgba(122, 78, 54, .9); transition: background-color .2s, border-color .2s, color .2s, transform .2s; } .do26 .do26-btn:hover { border-color: var(--do-brown-dark); background: var(--do-brown-dark); color: #fff; transform: translateY(-2px); } .do26 .do26-btn-alt { border-color: var(--do-line); background: #fff; color: var(--do-brown-dark); box-shadow: none; } .do26 .do26-btn-alt:hover { border-color: var(--do-brown); background: #fff; color: var(--do-brown-dark); } .do26-btn svg { width: 20px; height: 20px; flex: none; } .do26-actions { display: flex; flex-wrap: wrap; gap: 12px; }/* 1. Bannerul */.do26-hero { position: relative; } .do26-hero-media { overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--do-radius); background: var(--do-cream); box-shadow: var(--do-shadow); } .do26-hero-media img { width: 100%; height: 100%; object-fit: cover; } .do26-hero-text { margin-top: 22px; text-align: center; } .do26-hero-label { margin: 0 0 10px !important; font-size: 13px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--do-brown-dark); } .do26-dates { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-bottom: 18px !important; } .do26-dates li { display: grid; place-items: center; width: 46px; height: 46px; border: 1px solid var(--do-line); border-radius: 50%; background: #fff; font-size: 17px; font-weight: 800; line-height: 1; color: var(--do-brown-dark); box-shadow: 0 6px 14px -10px rgba(74, 51, 38, .6); } .do26-hero-text .do26-actions { justify-content: center; }/* Pe ecrane late, datele și butoanele stau în bannerul însuși, sub titlu. */@media (min-width: 900px) { .do26-hero-text { position: absolute; left: 21.3%; top: 57%; width: 44%; margin: 0; text-align: left; } .do26-dates, .do26-hero-text .do26-actions { justify-content: flex-start; }}@media (min-width: 900px) and (max-width: 1080px) { .do26-hero-text { top: 55%; } .do26-hero-label { font-size: 12px; } .do26-dates li { width: 40px; height: 40px; font-size: 15px; } .do26 .do26-hero-text .do26-btn { min-height: 46px; padding: 10px 18px; font-size: 15px; }}/* 2. Ce este */.do26-intro { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: clamp(32px, 5vw, 72px); align-items: center; } .do26-intro-text > p:not(.do26-kicker) { font-size: 18px; } .do26-motto { margin: 26px 0 0 !important; padding: 18px 22px; border-left: 4px solid var(--do-brown); border-radius: 0 18px 18px 0; background: var(--do-cream); } .do26-motto span { display: block; font-size: 13px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--do-blue-dark); } .do26-motto strong { display: block; margin-top: 2px; font-size: 24px; font-weight: 800; letter-spacing: -.01em; } .do26-intro-img { position: relative; } .do26-intro-img::before { content: ""; position: absolute; inset: 18px -14px -14px 18px; border-radius: var(--do-radius); background: var(--do-sand); } .do26-intro-img img { position: relative; width: 100%; aspect-ratio: 1; border-radius: var(--do-radius); object-fit: cover; box-shadow: var(--do-shadow); }/* 3. De ce */.do26-why { padding: clamp(36px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--do-radius); background: var(--do-cream); } .do26-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; } .do26-cards li { display: flex; flex-direction: column; gap: 6px; padding: 26px 22px; border: 1px solid var(--do-line); border-radius: 22px; background: #fff; } .do26-cards svg { width: 44px; height: 44px; margin-bottom: 10px; padding: 10px; border-radius: 14px; background: var(--do-sand); color: var(--do-brown-dark); } .do26-cards strong { font-size: 30px; font-weight: 800; line-height: 1.1; letter-spacing: -.02em; color: var(--do-brown); } .do26-cards span { font-size: 16px; line-height: 1.5; color: var(--do-ink); }/* 4. Pașii */.do26-steps ol { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; counter-reset: do26-pas; } .do26-steps li { position: relative; padding: 30px 26px 28px; border: 1px solid var(--do-line); border-radius: 24px; background: #fff; counter-increment: do26-pas; } .do26-steps li::before { content: counter(do26-pas); display: grid; place-items: center; width: 48px; height: 48px; margin-bottom: 18px; border-radius: 50%; background: var(--do-brown); font-size: 20px; font-weight: 800; color: #fff; } .do26-steps li p { color: var(--do-muted); } .do26-steps-cta { margin-top: 28px !important; text-align: center; } .do26-steps-cta small { display: block; margin-top: 10px; font-size: 15px; color: var(--do-muted); }/* 5. Variante de organizare */.do26-variants { padding: clamp(36px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--do-radius); background: var(--do-sand); } .do26-variants ul { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; } .do26-variants li { display: flex; flex-direction: column; padding: 28px 26px; border-radius: 22px; background: #fff; } .do26-time { display: inline-flex; align-self: flex-start; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 14px; border-radius: 999px; background: var(--do-cream); font-size: 14px; font-weight: 700; color: var(--do-blue-dark); } .do26-time svg { width: 18px; height: 18px; } .do26-variants li p { color: var(--do-muted); } .do26-note { margin-top: 24px !important; text-align: center; font-weight: 600; color: var(--do-head); }/* 6. Video */.do26-video-frame { position: relative; overflow: hidden; aspect-ratio: 16 / 9; border-radius: var(--do-radius); background: #2b2622; box-shadow: var(--do-shadow); } .do26-video-frame iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }/* 7. Înscrierea: fundalul cu inima și „Mă vede cineva?” */.do26-anchor { scroll-margin-top: 120px; } .do26 > .do26-anchor { margin-top: 0; } .do26-cta { display: flex; align-items: center; min-height: 380px; overflow: hidden; border-radius: var(--do-radius); background: var(--do-cream) url("/wp-content/uploads/duminica-orfanului-2026-fundal.jpg") 72% center / cover no-repeat; box-shadow: var(--do-shadow); } .do26-cta-in { max-width: 560px; padding: clamp(32px, 4vw, 56px); } .do26-cta-in h2 { font-size: clamp(25px, 1.3vw + 17px, 34px); } .do26-cta-in p { font-size: 18px; } .do26-cta-in .do26-arrow { display: inline-flex; align-items: center; gap: 8px; margin-top: 4px; font-weight: 700; color: var(--do-brown-dark); } .do26-cta-in .do26-arrow svg { width: 22px; height: 22px; }/* 8. Întrebări frecvente */.do26-faq-list { max-width: 880px; margin: 0 auto; display: grid; gap: 12px; } .do26-faq-list details { border: 1px solid var(--do-line); border-radius: 18px; background: #fff; transition: box-shadow .2s; } .do26-faq-list details[open] { box-shadow: 0 14px 30px -24px rgba(74, 51, 38, .6); } .do26-faq-list summary { position: relative; display: block; padding: 20px 60px 20px 24px; font-size: 18px; font-weight: 700; line-height: 1.4; color: var(--do-head); cursor: pointer; list-style: none; } .do26-faq-list summary::-webkit-details-marker { display: none; } .do26-faq-list summary::after { content: ""; position: absolute; right: 22px; top: 50%; width: 24px; height: 24px; margin-top: -12px; border-radius: 50%; background: var(--do-cream) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%237a4e36' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M12 7v10M7 12h10'/%3E%3C/svg%3E") center / 16px no-repeat; transition: transform .2s; } .do26-faq-list details[open] summary::after { transform: rotate(45deg); } .do26-faq-list details > div { padding: 0 24px 22px; color: var(--do-ink); } .do26-faq-list details ul { margin: 0 0 1em; display: grid; gap: 8px; } .do26-faq-list details li { position: relative; padding-left: 22px; } .do26-faq-list details li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 7px; height: 7px; border-radius: 50%; background: var(--do-brown); }/* 9. Contact */.do26-contact { padding: clamp(36px, 5vw, 64px) clamp(20px, 4vw, 56px); border-radius: var(--do-radius); background: var(--do-cream); } .do26-people { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; max-width: 880px; margin: 0 auto; } .do26-people li { display: flex; align-items: center; gap: 20px; padding: 22px; border-radius: 22px; background: #fff; } .do26-people img { flex: none; width: 96px; height: 96px; border: 4px solid var(--do-sand); border-radius: 50%; object-fit: cover; object-position: 50% 15%; } .do26-people strong { display: block; font-size: 18px; } .do26-people .do26-role { display: block; margin-bottom: 6px; font-size: 14px; color: var(--do-muted); } .do26-people a { display: block; width: max-content; max-width: 100%; font-size: 15px; overflow-wrap: anywhere; } .do26-contact-more { margin-top: 24px !important; text-align: center; }/* Ecrane mai mici */@media (max-width: 980px) { .do26-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } .do26-variants ul, .do26-steps ol { grid-template-columns: minmax(0, 1fr); } .do26-variants ul { max-width: 640px; margin: 0 auto; } .do26-steps ol { max-width: 640px; margin: 0 auto; } .do26-steps li { display: grid; grid-template-columns: 48px minmax(0, 1fr); column-gap: 18px; } .do26-steps li::before { grid-row: span 2; margin: 0; } .do26-steps li h3 { align-self: center; margin: 0; }}@media (max-width: 760px) { .do26 { font-size: 16px; } .do26-intro { grid-template-columns: minmax(0, 1fr); } .do26-intro-img { max-width: 440px; margin: 0 auto; } .do26-intro-text > p:not(.do26-kicker), .do26-cta-in p { font-size: 17px; } .do26-people { grid-template-columns: minmax(0, 1fr); } .do26-cta { align-items: flex-end; min-height: 0; padding-top: 180px; background-image: linear-gradient(180deg, rgba(247, 240, 230, 0) 30%, #f7f0e6 60%), url("/wp-content/uploads/duminica-orfanului-2026-fundal.jpg"); background-size: auto, auto 330px; background-position: center, 84% 0; background-repeat: no-repeat; } .do26-cta-in { padding: 0 24px 30px; }}@media (max-width: 520px) { .do26-cards { grid-template-columns: minmax(0, 1fr); } .do26-hero-media { border-radius: 18px; } .do26-why, .do26-variants, .do26-contact { padding-inline: 16px; border-radius: 22px; } .do26-faq-list summary { padding: 18px 54px 18px 18px; font-size: 17px; } .do26-faq-list details > div { padding: 0 18px 18px; } .do26-people li { flex-direction: column; text-align: center; } .do26-people a { margin: 0 auto; } .do26-actions .do26-btn { flex: 1 1 100%; }}@media (prefers-reduced-motion: reduce) { .do26 *, .do26 *::before, .do26 *::after { transition: none !important; }}/* * Opțional: formularul de înscriere care rămâne din Bricks (secțiunea „Înscrie-te aici!”, #brxe-82b813), * în aceleași culori. Dacă secțiunea e refăcută în Bricks, ID-ul se schimbă și regulile de mai jos nu se mai aplică * (nu strică nimic). */#brxe-82b813 .brxe-heading { color: #4a3326; }#brxe-82b813 .tab-title.brx-open { color: #7a4e36; }#brxe-82b813 .brxe-form input:not([type="checkbox"]):not([type="radio"]),#brxe-82b813 .brxe-form textarea { border: 1px solid #e6d9c6; border-radius: 12px; background: #fff; }#brxe-82b813 .brxe-form input:focus, #brxe-82b813 .brxe-form textarea:focus { border-color: #8a5a3f; outline: 2px solid rgba(138, 90, 63, .25); }#brxe-82b813 .brxe-form .bricks-button { border-radius: 999px; background-color: #8a5a3f; color: #fff; }#brxe-82b813 .brxe-form .bricks-button:hover { background-color: #7a4e36; }/* BREAKPOINT: Desktop (BASE) */#brxe-yohoet {margin-top: 5%; background-color: var(--bricks-color-ntpulh)}