@font-face { font-family: "Schibsted Grotesk"; src: url(fonturi/schibsted-grotesk-latin.woff2?v=4c8b93f431) format("woff2");
font-weight: 400 700; font-style: normal; font-display: swap;
unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F,
U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Schibsted Grotesk"; src: url(fonturi/schibsted-grotesk-latin-ext.woff2?v=ee9eeb232c) format("woff2");
font-weight: 400 700; font-style: normal; font-display: swap;
unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF,
U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF; }
@font-face { font-family: "Schibsted Grotesk"; src: url(fonturi/schibsted-grotesk-sageti.woff2?v=13a4c225ef) format("woff2");
font-weight: 400 700; font-style: normal; font-display: swap; unicode-range: U+2190-2193, U+2197-2198; }
:root {
color-scheme: light dark;
--fond: light-dark(#f4f1ec, #161d27);
--panou: light-dark(#dbd7cf, #1f2833);
--text: light-dark(#1b1c1e, #edf0f3);
--gri: light-dark(#76726b, #7d8896);
--stins: light-dark(#4c4944, #a7b1bd);
--linie: light-dark(#cdc8be, #2c3643);
--linie-tare: light-dark(#9c968b, #465262);
--accent: light-dark(#ee9d1c, #f0a23a);
--accent-apasat: light-dark(#cc830f, #f5b85f);
--pe-accent: light-dark(#3a2600, #2a1b00);
--subsol: light-dark(#26292d, #0f141b);
--subsol-text: light-dark(#ece9e3, #edf0f3);
--subsol-stins: light-dark(#a9a6a0, #95a0ad);
--subsol-linie: light-dark(#3d4146, #283240);
--plansa: light-dark(#f1eee8, #1b232e);
--desen-fond: light-dark(#dbd7cf, #1f2833);
--desen-grila: light-dark(rgba(27, 28, 30, .08), rgba(237, 240, 243, .07));
--desen-hartie: light-dark(#f1eee8, #161d27);
--desen-linie: light-dark(#1b1c1e, #dfe4ea);
--desen-fin: light-dark(#8f8a80, #6d7886);
--desen-gri: light-dark(#cdc8be, #2c3643);
--disc-corp: light-dark(#2b2f35, #0d1117);
--disc-eticheta: light-dark(#ece9e3, #edf0f3);
--disc-tipar: light-dark(#1b1c1e, #161d27);
--disc-muchie: light-dark(#4a4f57, #465262);
--disc-inel: light-dark(rgba(236, 233, 227, .10), rgba(237, 240, 243, .10));
--diamant-eticheta: light-dark(#1b1c1e, #0d1117);
--diamant-tipar: light-dark(#ece9e3, #edf0f3);
--piloni: light-dark(#1b1c1e, #dfe4ea);
--piloni-stinsi: light-dark(#9c968b, #465262);
--umbra: light-dark(rgba(27, 28, 30, .10), rgba(0, 0, 0, .30));
--desen-accent: var(--accent); --margine-disc: var(--accent);
}
:root[data-tema="lumina"] { color-scheme: light; }
:root[data-tema="intuneric"] { color-scheme: dark; }
:root {
--font: "Schibsted Grotesk", "Helvetica Neue", Arial, sans-serif;
--text-display: 160px; --lh-display: 152px; --ls-display: -4px;
--text-titlu: 56px; --lh-titlu: 60px; --ls-titlu: -1px;
--text-corp: 20px; --lh-corp: 30px;
--ls-nr: -2px; --ls-caps: 1.5px;
--margine: 24px; --jg: 24px; --bara: 80px; --sectiune: 144px;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: var(--bara); background: var(--fond); }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; background: var(--fond); color: var(--text); font-family: var(--font); font-size: var(--text-corp);
line-height: var(--lh-corp); font-weight: 400; -webkit-font-smoothing: antialiased; }
h1, h2, h3, p, ul, ol, figure, dl, dd { margin: 0; }
ul, ol { padding: 0; list-style: none; }
h1, h2, h3 { font-weight: 700; text-wrap: balance; }
h2 { font-size: var(--text-titlu); line-height: var(--lh-titlu); letter-spacing: var(--ls-titlu); font-weight: 500; }
h3 { font-size: var(--text-corp); line-height: var(--lh-corp); }
p, li, dt, dd, figcaption { text-wrap: pretty; }
a { color: inherit; text-underline-offset: 5px; text-decoration-thickness: 1px; }
strong { font-weight: 700; }
.legat { white-space: nowrap; }
:focus-visible { outline: 2px solid var(--text); outline-offset: 3px; }
.continut { padding-inline: var(--margine); }
.grila { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); grid-template-columns: repeat(12, round(down, (100% - 11 * var(--jg) + 0.1px) / 12, 1px));
column-gap: var(--jg); }
.sageata { display: inline-block; margin-left: 10px; text-decoration: none; }
.bara { position: sticky; top: 0; z-index: 20; background: var(--fond); box-shadow: 0 1px 0 var(--linie); }
.bara-rand { display: flex; align-items: center; gap: 24px; height: var(--bara); }
.bara-sigla { flex: none; display: block; width: 222px; height: 60px; }
.bara-sigla .logo { display: block; width: 222px; height: 60px; }
.bara-sigla .logo-intuneric { display: none; }
@media (prefers-color-scheme: dark) {
:root:not([data-tema="lumina"]) .bara-sigla .logo-lumina { display: none; }
:root:not([data-tema="lumina"]) .bara-sigla .logo-intuneric { display: block; }
}
:root[data-tema="intuneric"] .bara-sigla .logo-lumina { display: none; }
:root[data-tema="intuneric"] .bara-sigla .logo-intuneric { display: block; }
.bara-nav { display: flex; align-items: center; gap: 24px; margin-left: 8px; }
.bara-nav a, .bara-portal { font-weight: 500; text-decoration: none; white-space: nowrap; }
.bara-nav a:hover, .bara-portal:hover, .bara-nav a[aria-current="page"] { text-decoration: underline; }
.bara-nav a[aria-current="page"] { text-decoration-thickness: 2px; }
.bara-actiuni { margin-left: auto; display: flex; align-items: center; gap: var(--jg); }
.meniu { display: none; }
.tema-buton { display: none; flex: none; align-items: center; justify-content: center; width: 48px; height: 48px; padding: 0;
border: 1px solid var(--text); border-radius: 0; background: transparent; color: var(--text); cursor: pointer; }
.tema-comutabila .tema-buton { display: inline-flex; }
.tema-buton:hover { background: var(--text); color: var(--fond); }
.tema-semn { display: block; width: 20px; height: 20px; border: 2px solid currentColor; border-radius: 50%;
background: linear-gradient(90deg, currentColor 50%, transparent 50%); }
.btn { display: inline-flex; align-items: center; justify-content: center; height: 48px; padding: 0 20px; border: 1px solid var(--text);
border-radius: 0; background: transparent; color: var(--text); font-size: var(--text-corp); font-weight: 700;
line-height: var(--lh-corp); text-decoration: none; white-space: nowrap; }
.btn-contur:hover { background: var(--text); color: var(--fond); }
.btn-principal { height: 56px; padding: 0 28px; background: var(--accent); border-color: var(--accent); color: var(--pe-accent); }
.btn-principal:hover { background: var(--accent-apasat); border-color: var(--accent-apasat); color: var(--pe-accent); }
.erou { padding-block: 16px 40px; }
.erou-grila { row-gap: 32px; align-items: start; }
.erou h1 { grid-column: 1 / -1; font-size: var(--text-display); line-height: var(--lh-display); letter-spacing: var(--ls-display); }
.erou-lead, .proprietar, .erou-actiuni { padding-top: 16px; border-top: 1px solid var(--text); }
.erou-lead { grid-column: 1 / span 4; font-weight: 500; }
.proprietar { grid-column: 5 / span 3; font-weight: 700; }
.erou-actiuni { grid-column: 8 / span 5; display: flex; flex-wrap: wrap; align-items: baseline; gap: 16px 32px; padding-top: 24px; }
.legatura { font-weight: 700; text-decoration: underline; text-underline-offset: 6px; white-space: nowrap; }
.legatura:hover { text-decoration-thickness: 2px; }
:root {
--ls-disc: 2px; --ls-disc-nr: -1px;
--d-abraziv-corp: var(--disc-corp); --d-abraziv-eticheta: var(--disc-eticheta); --d-abraziv-tipar: var(--disc-tipar);
--d-abraziv-muchie: var(--disc-muchie);
--d-diamant-eticheta: var(--diamant-eticheta); --d-diamant-tipar: var(--diamant-tipar); --d-margine: var(--margine-disc);
--d-accent: var(--accent); --d-accent-linie: var(--accent-apasat);
--otel-1: #d6d9dc; --otel-2: #f5f6f6; --otel-3: #9aa0a7; --lat-1: #a4a9af; --lat-2: #c1c5c9; --lat-3: #e0e3e5; --lat-4: #969ca3;
--d-plasa: rgba(236, 234, 228, .11); --d-butuc-linie: #6c727a; --d-butuc-inel: #7b8189;
--d-diamant-corp: #575c64; --d-diamant-muchie: #7f858c;
--z-linie: var(--text); --z-linie-fina: var(--linie); --z-stins: var(--stins); --z-fond: var(--fond); --z-text: var(--text);
--z-bara: var(--linie-tare); --z-gol: var(--jg); --z-bara-sus: var(--bara); --z-raza: 0;
}
.lista { --x0: var(--margine); }
.lista .disc { flex-basis: 520px; }
@media (max-width: 1439px) { .lista .disc { flex-basis: 448px; } }
@media (max-width: 1199px) { .lista .disc { flex-basis: 416px; } }
@media (max-width: 767px) { .lista .disc { flex-basis: 336px; } }
@media (max-width: 599px) { .lista .disc { flex-basis: calc(100% - 24px); } }
.d-titlu, .d-marca, .d-nr, .disc-info h3, .date-titlu { font-weight: 700; }
.fisa dt, .fisa dd, .index-buton, .index-titlu, .index-nr, .scena-indiciu { font-weight: 500; }
.disc-defs { position: absolute; width: 0; height: 0; overflow: hidden; }
.disc-abraziv { --d-c: var(--d-abraziv-corp); --d-e: var(--d-abraziv-eticheta); --d-t: var(--d-abraziv-tipar);
--d-m: var(--d-abraziv-muchie); --d-mg: var(--d-abraziv-eticheta); }
.disc-diamant { --d-c: var(--d-diamant-corp); --d-e: var(--d-diamant-eticheta); --d-t: var(--d-diamant-tipar);
--d-m: var(--d-diamant-muchie); --d-mg: var(--d-margine); }
.d-corp { fill: var(--d-c); }
.d-plasa { fill: url(#disc-plasa); }
.plasa-fir { fill: none; stroke: var(--d-plasa); stroke-width: 1; }
.d-muchie { fill: none; stroke: var(--d-m); stroke-width: 1; }
.d-segmente { fill: none; stroke: var(--d-c); stroke-width: 18; stroke-dasharray: 10.4 1.6; }
.d-miez { fill: url(#disc-otel-lat); }
.d-eticheta { fill: var(--d-e); stroke: var(--d-mg); stroke-width: 3; }
.d-cerc { fill: none; stroke: var(--d-t); stroke-opacity: .55; stroke-width: 1; }
.d-titlu, .d-marca { font-family: var(--font); letter-spacing: var(--ls-disc); fill: var(--d-t); text-anchor: middle; }
.d-nr { font-family: var(--font); fill: var(--d-t); dominant-baseline: central; letter-spacing: var(--ls-disc-nr); }
.d-nr-st { text-anchor: end; }
.d-nr-dr { text-anchor: start; }
.d-sageata { fill: none; stroke: var(--d-t); stroke-width: 2; }
.d-varf { fill: var(--d-t); }
.d-butuc { fill: url(#disc-otel); stroke: var(--d-butuc-linie); stroke-width: 1; }
.d-butuc-cerc { fill: none; stroke: var(--d-butuc-inel); stroke-width: 1; }
.otel-1 { stop-color: var(--otel-1); }
.otel-2 { stop-color: var(--otel-2); }
.otel-3 { stop-color: var(--otel-3); }
.lat-1 { stop-color: var(--lat-1); }
.lat-2 { stop-color: var(--lat-2); }
.lat-3 { stop-color: var(--lat-3); }
.lat-4 { stop-color: var(--lat-4); }
.disc-fig:hover .d-butuc { fill: var(--d-accent); }
.disc-fig:hover .d-butuc-cerc { stroke: var(--d-accent-linie); }
.lista { position: relative; padding: 72px 0 0; border-top: 1px solid var(--z-linie-fina); }
.scena { position: relative; }
.index-loc { position: absolute; top: 0; right: var(--x0); z-index: 8; display: flex; align-items: center; gap: 24px; }
.scena-indiciu { display: none; }
.grup > h2 { padding-inline: var(--x0); margin-bottom: 40px; }
.grup-incredere { margin-top: 96px; }
.discuri { display: flex; gap: 48px; margin: 0; padding: 0 var(--x0) 20px; overflow-x: auto; overscroll-behavior-x: contain;
scroll-snap-type: x mandatory; scroll-padding-inline: var(--x0); scrollbar-width: thin; scrollbar-color: var(--z-bara) transparent;
list-style: none; }
.disc { position: relative; flex: 0 0 360px; display: flex; flex-direction: column; gap: 32px; scroll-snap-align: start; }
.disc-cursa { position: absolute; left: 0; top: 0; width: 100%; height: 1px; pointer-events: none; }
.disc-fig { display: block; aspect-ratio: 1; border-radius: 50%; }
.disc-poz { display: block; width: 100%; height: 100%; }
.disc-svg { display: block; width: 100%; height: 100%; overflow: visible; transform: rotate(-6deg); }
.disc-info { display: flex; flex-direction: column; gap: 20px; }
.disc-info h3 { font-family: var(--font); font-size: var(--text-titlu); line-height: var(--lh-titlu);
letter-spacing: var(--ls-caps); margin-right: calc(-1 * var(--ls-caps)); text-transform: uppercase; }
.disc-info h3 .legat { margin-right: calc(-1 * var(--ls-caps)); }
.fisa { border-bottom: 1px solid var(--z-linie); }
.fisa div { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; padding: 4px 0 5px;
border-top: 1px solid var(--z-linie); }
.fisa dt, .fisa dd { font-family: var(--font); }
.fisa dt { color: var(--z-stins); }
.fisa dd { text-align: right; }
.roata:focus-visible { outline: 2px solid var(--z-text); outline-offset: -2px; }
.index { position: relative; }
.index summary { display: flex; align-items: center; gap: 16px; height: 48px; padding: 0 18px 0 20px;
border: 1px solid var(--z-linie); border-radius: var(--z-raza); background: var(--z-fond); list-style: none; cursor: pointer; }
.index summary::-webkit-details-marker { display: none; }
.index summary::after { content: ""; width: 8px; height: 8px; border-right: 2px solid var(--z-linie);
border-bottom: 2px solid var(--z-linie); transform: translateY(-3px) rotate(45deg); }
.index[open] summary::after { transform: translateY(2px) rotate(225deg); }
.index summary:focus-visible { outline: 2px solid var(--z-text); outline-offset: 3px; }
.index-buton { font-family: var(--font); }
.index-lista { position: absolute; right: 0; top: calc(100% + 8px); width: 480px; max-height: min(640px, round(down, 72vh, 1px)); overflow-y: auto;
padding: 4px 24px 20px; background: var(--z-fond); border: 1px solid var(--z-linie); }
.index-titlu { padding: 16px 0 8px; font-family: var(--font); color: var(--z-stins); }
.index-grup ol { margin: 0; padding: 0; list-style: none; border-top: 1px solid var(--z-linie); }
.index-grup li { border-bottom: 1px solid var(--z-linie-fina); }
.index-grup a { display: block; padding: 6px 0 5px; text-decoration: none; }
.index-grup a:hover { text-decoration: underline; }
.index-nr { font-family: var(--font); color: var(--z-stins); }
@supports selector(::scroll-button(*)) {
.grup { position: relative; }
.discuri::scroll-button(*) { position: absolute; bottom: -68px; width: 48px; height: 48px; padding: 0;
border: 1px solid var(--z-linie); border-radius: var(--z-raza); background: var(--z-fond); color: var(--z-text);
font-family: var(--font); font-size: var(--text-corp); line-height: 1; cursor: pointer; }
.discuri::scroll-button(inline-end) { content: "\2192" / "Înainte"; right: var(--x0); }
.discuri::scroll-button(inline-start) { content: "\2190" / "Înapoi"; right: calc(var(--x0) + 56px); }
.discuri::scroll-button(*):hover { background: var(--z-text); color: var(--z-fond); }
.discuri::scroll-button(*):disabled { opacity: .3; cursor: default; background: var(--z-fond); color: var(--z-text); }
.discuri::scroll-button(*):focus-visible { outline: 2px solid var(--z-text); outline-offset: 3px; }
}
.date { position: relative; margin-top: 120px; padding: 25px var(--x0) 0; }
.date-info { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr));
grid-template-columns: repeat(12, round(down, (100% - 11 * var(--z-gol)) / 12 + 0.01px, 1px)); column-gap: var(--z-gol); row-gap: 12px; }
.date::before { content: ""; position: absolute; top: 0; left: var(--x0); right: var(--x0); height: 1px; background: var(--z-linie); }
.date-titlu { grid-column: 1 / span 6; font-family: var(--font); font-size: var(--text-titlu); line-height: var(--lh-titlu);
letter-spacing: var(--ls-titlu); text-wrap: balance; }
.date-text { grid-column: 1 / span 6; }
@media (max-width: 1023px) {
.disc { flex-basis: 336px; }
.date-titlu, .date-text { grid-column: 1 / span 9; }
}
@media (max-width: 599px) {
.lista { padding-top: 56px; }
.index-loc { top: -8px; }
.grup > h2 { margin-bottom: 32px; padding-right: 136px; }
.grup-incredere { margin-top: 72px; }
.grup-incredere > h2 { padding-right: var(--x0); }
.discuri { gap: 16px; }
.disc { flex-basis: calc(100% - 24px); gap: 24px; }
.index-lista { width: min(480px, calc(100vw - 32px)); padding: 4px 16px 16px; }
.discuri::scroll-button(*) { content: none; }
.date { margin-top: 80px; }
.date-titlu, .date-text { grid-column: 1 / 13; }
}
@supports not ((animation-timeline: scroll()) and (timeline-scope: --t)) {
@media (min-width: 1024px) and (any-hover: hover) and (any-pointer: fine) {
.discuri { flex-wrap: wrap; gap: 64px 48px; padding-bottom: 0; overflow: visible; scroll-snap-type: none; }
.lista .disc { flex: 0 0 round(down, (100% - 96px) / 3, 1px); }
.disc-fig { width: min(100%, 320px); }
.disc-info h3 { font-size: var(--text-corp); line-height: var(--lh-corp); }
.discuri .disc-svg { animation: none; }
}
}
@media (min-width: 1024px) and (max-height: 399px) and (any-hover: hover) and (any-pointer: fine) {
.discuri { flex-wrap: wrap; gap: 64px 48px; padding-bottom: 0; overflow: visible; scroll-snap-type: none; }
.lista .disc { flex: 0 0 round(down, (100% - 96px) / 3, 1px); }
.disc-fig { width: min(100%, 320px); }
.disc-info h3 { font-size: var(--text-corp); line-height: var(--lh-corp); }
.discuri .disc-svg { animation: none; }
@supports selector(::scroll-button(*)) { .discuri::scroll-button(*) { display: none; } }
}
@keyframes rostogolire { from { transform: rotate(118deg); } to { transform: rotate(-130deg); } }
@property --s { syntax: "<number>"; inherits: false; initial-value: 0; }
@property --poz { syntax: "<number>"; inherits: true; initial-value: 2; }
@property --grupa { syntax: "<number>"; inherits: false; initial-value: 0; }
@keyframes s { from { --s: 0; } to { --s: 12; } }
@keyframes disc-gira { from { rotate: 0deg; } to { rotate: 360deg; } }
@media (prefers-reduced-motion: no-preference) {
@supports (animation-timeline: view(inline)) {
.disc-svg { animation: rostogolire linear both; animation-timeline: view(inline); }
}
}
@media (min-width: 1024px) and (min-height: 400px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
:root { --scena-h: max(340px, calc(100svh - var(--bara))); }
main:has(> .lista) { display: flex; flex-direction: column; }
.lista { order: -1; }
.erou { position: relative; padding-block: 48px 0; }
.erou h1 { position: absolute; z-index: 6; left: var(--margine); top: calc(16px - var(--scena-h)); width: min-content; }
.lista { padding: 0; border-top: 0; --col: 560px; --x0q: calc(var(--margine) + 24px); --jos: 72px; --aer: 88px;
--banda-st: calc(var(--x0) + max(var(--col), 4.2 * var(--text-display)) + 56px);
--banda-dr: calc(100cqw - var(--x0q));
--D: min(100cqh - var(--jos) - var(--aer), (var(--banda-dr) - var(--banda-st)) / 1.04, 44cqw);
--cx: calc((var(--banda-st) + var(--banda-dr)) / 2); --cy: calc((100cqh - var(--jos)) / 2);
--sus: calc(16px + 2 * var(--lh-display) + 32px);
--mers: cubic-bezier(.3, .6, .2, 1); --drum: 1s; --urca: 20px; }
.scena { height: var(--scena-h); container-type: size; }
.roata { position: absolute; inset: 0; overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: auto;
scroll-snap-type: y mandatory; scrollbar-width: none; pointer-events: none; }
.roata::-webkit-scrollbar { display: none; }
.index-loc { top: auto; right: var(--x0q); bottom: 24px; width: calc(var(--banda-dr) - var(--banda-st));
flex-wrap: wrap; justify-content: flex-end; row-gap: 8px; }
.scena-indiciu { text-align: right; }
.scena-indiciu { display: block; font-family: var(--font); color: var(--z-stins); }
.index-lista { top: auto; bottom: calc(100% + 8px); }
.grup, .date { position: absolute; left: 0; top: 0; width: 100%; height: 1300cqh; margin: 0; padding: 0; overflow: clip;
animation: s linear both; animation-timeline: scroll(nearest block); }
.discuri { display: block; margin: 0; padding: 0; overflow: visible; scroll-snap-type: none; }
.disc { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; overflow: clip;
scroll-snap-align: none; animation: s linear both; animation-timeline: scroll(nearest block); }
.disc, .date { --poz: clamp(-2, round(var(--k) - 1 - var(--s)), 2); }
#disc-1 { --k: 1; } #disc-2 { --k: 2; } #disc-3 { --k: 3; } #disc-4 { --k: 4; } #disc-5 { --k: 5; } #disc-6 { --k: 6; }
#disc-7 { --k: 7; } #disc-8 { --k: 8; } #disc-9 { --k: 9; } #disc-10 { --k: 10; } #disc-11 { --k: 11; }
#disc-12 { --k: 12; } .date { --k: 13; }
.disc-cursa { display: block; position: absolute; left: 0; top: calc((var(--k) - 1) * 100cqh); width: 1px; height: 100cqh;
pointer-events: none; scroll-snap-align: start; scroll-snap-stop: always; }
.grup-functii { --g: 0; }
.grup-incredere { --g: 1; }
.grup { --grupa: clamp(-1, round(down, (var(--s) + .5) / 6) - var(--g), 1); }
.grup > h2 { position: sticky; top: var(--sus); z-index: 7; width: var(--col); height: 0; margin: 0 0 0 var(--x0);
padding: 0; font-size: var(--text-corp); line-height: var(--lh-corp); letter-spacing: 0; font-weight: 500;
color: var(--z-stins); opacity: 0; visibility: hidden; transform: translateY(var(--urca));
transition: opacity .2s ease-in, transform .2s ease-in, visibility 0s linear .2s; }
@container style(--grupa: 1) { .grup > h2 { transform: translateY(calc(-1 * var(--urca))); } }
@container style(--grupa: 0) { .grup > h2 { opacity: 1; visibility: visible; transform: none;
transition: opacity .45s ease-out .2s, transform .7s var(--mers) .2s, visibility 0s linear .2s; } }
.disc-fig { position: sticky; top: calc(var(--cy) - var(--D) / 2); z-index: 1; display: block; width: var(--D);
height: var(--D); margin: 0 0 calc(-1 * var(--D)) calc(var(--cx) - var(--D) / 2); aspect-ratio: auto;
visibility: hidden; pointer-events: auto; }
@container style(--poz: 0) { .disc-fig { visibility: visible; } }
.disc-poz { visibility: hidden; pointer-events: none; opacity: 0;
transform: translate(46cqw, -80cqh) scale(.5) matrix(.951, -.182, 0, .809, 0, 0) rotate(64deg);
transition: transform var(--drum) var(--mers), opacity .5s ease, visibility 0s linear var(--drum); }
@container style(--poz: 1) { .disc-poz { visibility: visible; opacity: 1; transition-delay: 0s;
transform: translate(30cqw, -48cqh) scale(.72) matrix(.951, -.182, 0, .809, 0, 0) rotate(30deg); } }
@container style(--poz: 0) { .disc-poz { visibility: visible; opacity: 1; transition-delay: 0s;
transform: translate(0, 0) scale(1) matrix(.951, -.182, 0, .809, 0, 0) rotate(-6deg); } }
@container style(--poz: -1) { .disc-poz { visibility: visible; opacity: 1; transition-delay: 0s;
transform: translate(calc(-.28 * var(--D)), calc(52cqh + .42 * var(--D))) scale(.62) matrix(.951, -.182, 0, .809, 0, 0) rotate(-40deg); } }
@container style(--poz: -2) { .disc-poz {
transform: translate(calc(-.5 * var(--D)), calc(80cqh + .5 * var(--D))) scale(.46) matrix(.951, -.182, 0, .809, 0, 0) rotate(-72deg); } }
.disc-svg { transform: none; animation: disc-gira 36s linear infinite paused; }
.roata:has(.disc-fig:hover) .disc-svg { animation-play-state: running; }
.disc-info h3 { font-size: var(--text-corp); line-height: var(--lh-corp); }
.disc-info { position: sticky; top: calc(var(--sus) + 42px); z-index: 5; width: var(--col); margin: 0 0 0 var(--x0);
opacity: 0; visibility: hidden; transform: translateY(var(--urca));
transition: opacity .2s ease-in, transform .2s ease-in, visibility 0s linear .2s; }
@container style(--poz: -1) { .disc-info { transform: translateY(calc(-1 * var(--urca))); } }
@container style(--poz: -2) { .disc-info { transform: translateY(calc(-1 * var(--urca))); } }
@container style(--poz: 0) { .disc-info { opacity: 1; visibility: visible; transform: none;
transition: opacity .45s ease-out .2s, transform .7s var(--mers) .2s, visibility 0s linear .2s; } }
.date-info { position: sticky; top: var(--sus); z-index: 5; width: var(--col); margin: 0 0 0 var(--x0);
display: flex; flex-direction: column; gap: 20px; opacity: 0; visibility: hidden; transform: translateY(var(--urca));
transition: opacity .2s ease-in, transform .2s ease-in, visibility 0s linear .2s; }
@container style(--poz: 0) { .date-info { opacity: 1; visibility: visible; transform: none;
transition: opacity .45s ease-out .2s, transform .7s var(--mers) .2s, visibility 0s linear .2s; } }
.date::before { content: ""; position: sticky; top: calc(var(--cy) - var(--D) / 2); left: auto; right: auto; z-index: 0;
display: block; width: var(--D); height: var(--D); margin: 0 0 calc(-1 * var(--D)) calc(var(--cx) - var(--D) / 2);
border-radius: 50%; background: none; pointer-events: auto; }
.discuri::scroll-button(*) { display: none; }
}
}
@media (min-width: 1024px) and (min-height: 400px) and (max-height: 859px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
.disc-info .fisa { display: none; }
}
}
@media (min-width: 1024px) and (min-height: 400px) and (max-height: 599px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
.disc-info > p { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
}
@media (min-width: 1024px) and (max-width: 1199px) and (min-height: 400px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
.lista { --col: 440px; --jos: 140px; }
}
}
@media (min-width: 1024px) and (min-height: 400px) and (max-height: 559px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
.lista { --jos: 72px; --aer: 48px; }
.scena-indiciu { position: absolute; top: 0; left: 0; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%);
white-space: nowrap; }
}
}
@media (min-width: 1024px) and (min-height: 400px) and (max-height: 479px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
.date-info .date-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
}
}
@media (prefers-reduced-motion: reduce) and (min-width: 1024px) and (min-height: 400px) and (any-hover: hover) and (any-pointer: fine) {
@supports (animation-timeline: scroll()) and (timeline-scope: --t) {
.lista { --drum: 0s; --urca: 0px; }
.disc-svg { animation: none; }
}
}
:root { --d-carbura: #6f757d; --d-matrice: #555a61; --d-otel-muchie: #8a9097; --d-piatra-gri: #6d7178;
--d-piatra-alba: #dfddd7; --d-piatra-alba-linie: #9c9990; }
.d-panza-otel { fill: url(#disc-otel-lat); stroke: var(--d-otel-muchie); stroke-width: .8; }
.d-panza-vopsita { fill: var(--d-c); stroke: var(--d-m); stroke-width: .8; }
.d-luciu { fill: url(#disc-luciu); }
.luciu-0 { stop-color: #fff; stop-opacity: 0; }
.luciu-1 { stop-color: #fff; stop-opacity: .13; }
.luciu-2 { stop-color: #fff; stop-opacity: .07; }
.d-strunjire { fill: none; stroke: rgba(0, 0, 0, .07); stroke-width: 1; }
.d-varfuri { fill: var(--d-carbura); }
.d-lamele { fill: var(--d-lamela); stroke: var(--d-m); stroke-width: .8; }
.d-lamele-umbra { fill: none; stroke: rgba(0, 0, 0, .34); stroke-width: 2.4; }
.d-lamele-muchie { fill: none; stroke: rgba(255, 255, 255, .3); stroke-width: 1.1; }
.d-granule { fill: url(#disc-granula-fina); }
.d-granule-mari { fill: url(#disc-granula-mare); }
.granula-deschisa { fill: rgba(255, 255, 255, .26); }
.granula-inchisa { fill: rgba(0, 0, 0, .26); }
.d-hartie { fill: var(--d-hartie); }
.d-hartie-muchie { fill: none; stroke: rgba(0, 0, 0, .28); stroke-width: 1; }
.d-faguri { fill: url(#disc-faguri); }
.faguri-fir { fill: none; stroke: rgba(255, 255, 255, .2); stroke-width: .9; }
.d-matrice { fill: var(--d-matrice); fill-rule: evenodd; }
.d-caneluri { fill: none; stroke: rgba(0, 0, 0, .42); stroke-width: 1.8; stroke-linecap: round; }
.d-scantei { fill: url(#disc-scantei); }
.scanteie { fill: rgba(255, 255, 255, .34); }
.d-miez-muchie { fill: none; stroke: var(--d-otel-muchie); stroke-width: 1; }
.d-piatra-gri { fill: var(--d-piatra-gri); }
.d-piatra-alba { fill: var(--d-piatra-alba); }
.d-tesitura-deschisa { fill: none; stroke: rgba(255, 255, 255, .16); stroke-width: 7; }
.d-tesitura-inchisa { fill: none; stroke: rgba(0, 0, 0, .07); stroke-width: 7; }
.d-piatra-muchie { fill: none; stroke: rgba(0, 0, 0, .35); stroke-width: 1; }
.d-piatra-alba-muchie { fill: none; stroke: var(--d-piatra-alba-linie); stroke-width: 1; }
.model-lamelare.disc-abraziv { --d-lamela: var(--d-c); }
.model-lamelare.disc-diamant { --d-lamela: var(--d-accent); --d-mg: var(--d-diamant-eticheta); }
.model-slefuire.disc-abraziv { --d-hartie: color-mix(in srgb, var(--d-accent) 84%, #000); }
.cuprins { padding-block: 120px 0; }
.cuprins-grila { row-gap: 24px; align-items: start; }
.cuprins-cap { grid-column: 1 / span 3; display: flex; flex-direction: column; gap: 24px; }
.cuprins-lead { color: var(--stins); }
.cuprins-lista { grid-column: 4 / span 9; border-top: 4px solid var(--accent); }
.cuprins-lista li { border-bottom: 1px solid var(--linie-tare); }
.cuprins-lista a { display: grid; grid-template-columns: 88px round(down, 34%, 1px) minmax(0, 1fr) 40px; column-gap: var(--jg);
align-items: baseline; padding: 20px 16px 20px 0; text-decoration: none; }
.cuprins-lista a:hover { background: var(--panou); }
.cuprins-lista a:hover .cuprins-nume { text-decoration: underline; }
.cuprins-nr { font-size: var(--text-titlu); line-height: var(--lh-titlu); letter-spacing: var(--ls-nr); font-weight: 700; color: var(--gri); }
.cuprins-nume { font-weight: 700; }
.cuprins-desc { color: var(--stins); }
.cuprins-lista .sageata { justify-self: end; margin: 0; font-weight: 700; }
.piloni-banda { position: relative; }
.piloni::before { content: ""; position: absolute; left: 0; right: 0; top: var(--teren); height: 1px; background: var(--piloni); }
.piloni::after { content: ""; position: absolute; left: 0; right: 0; top: calc(var(--teren) - 6px); height: 6px;
background: repeating-linear-gradient(-45deg, var(--piloni) 0 1px, transparent 1px 7px); }
.piloni span { position: relative; z-index: 1; display: flex; align-items: flex-end; justify-content: center; gap: 8px; height: 100%; overflow: hidden; }
.piloni i { display: block; flex: 0 0 10px; background: var(--piloni); clip-path: polygon(0 0, 100% 0, 100% calc(100% - 9px), 50% 100%, 0 calc(100% - 9px)); }
.piloni-cap { --teren: 56px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--jg); border-bottom: 4px solid var(--accent); }
.piloni-banda { --teren: 14px; height: 48px; border-bottom: 1px solid var(--linie-tare); }
.piloni-banda::before, .piloni-banda::after { opacity: .35; }
.piloni-banda i { flex-basis: 6px; background: var(--piloni-stinsi); }
.piloni-banda span { gap: 6px; }
.piloni .h78 { height: 78%; }
.piloni .h85 { height: 85%; }
.piloni .h93 { height: 93%; }
.piloni .h100 { height: 100%; }
.piloni-cap span:nth-child(1) i:nth-child(1) { --p: 0; }
.piloni-cap span:nth-child(1) i:nth-child(2) { --p: 1; }
.piloni-cap span:nth-child(1) i:nth-child(3) { --p: 2; }
.piloni-cap span:nth-child(1) i:nth-child(4) { --p: 3; }
.piloni-cap span:nth-child(2) i:nth-child(1) { --p: 4; }
.piloni-cap span:nth-child(2) i:nth-child(2) { --p: 5; }
.piloni-cap span:nth-child(2) i:nth-child(3) { --p: 6; }
.piloni-cap span:nth-child(2) i:nth-child(4) { --p: 7; }
.piloni-cap span:nth-child(3) i:nth-child(1) { --p: 8; }
.piloni-cap span:nth-child(3) i:nth-child(2) { --p: 9; }
.piloni-cap span:nth-child(3) i:nth-child(3) { --p: 10; }
.piloni-cap span:nth-child(3) i:nth-child(4) { --p: 11; }
.pe-scurt { padding-block: var(--sectiune) 120px; }
.pe-scurt .grila { row-gap: 48px; }
.enunt { font-size: var(--text-titlu); line-height: var(--lh-titlu); font-weight: 700; text-transform: uppercase; text-wrap: balance; }
.enunt-dublu { grid-column: 1 / -1; padding-right: calc(round(down, (100% - 11 * var(--jg) + 0.1px) / 12, 1px) + var(--jg)); color: var(--gri); }
.enunt-dublu strong, .enunt-dublu .punct { color: var(--text); }
.pe-scurt-text { grid-column: 4 / span 5; }
.pastile { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; }
.pastile li { grid-column: span 3; padding-top: 16px; border-top: 1px solid var(--text); font-weight: 500; }
.despre { padding-block: 120px var(--sectiune); }
.despre .grila { row-gap: 48px; align-items: start; }
.despre-titlu { grid-column: 1 / span 3; grid-row: 1; color: var(--gri); }
.enunt-stalpi { grid-column: 4 / span 9; grid-row: 1; color: var(--text); }
.enunt-stalpi span { display: block; }
.despre-text { grid-column: 4 / span 6; }
.stalpi { grid-column: 4 / span 9; display: grid; grid-template-columns: subgrid; }
.stalpi li { grid-column: span 3; display: flex; flex-direction: column; }
.stalpi h3 { padding-bottom: 16px; margin-bottom: 16px; border-bottom: 1px solid var(--text); }
.mai-mult { grid-column: 4 / span 9; }
.mai-mult a { font-weight: 700; text-decoration: underline; text-underline-offset: 6px; }
.mai-mult a:hover { text-decoration-thickness: 2px; }
.cum { padding-block: 0 var(--sectiune); }
.cum .grila { row-gap: 48px; }
.cum-titlu { grid-column: 1 / span 9; }
.pasi { grid-column: 1 / -1; position: relative; display: grid; grid-template-columns: subgrid; }
.pasi::after, .pasi li::after { content: ""; position: absolute; top: 3px; width: 1px; height: 18px; background: var(--text); transform: rotate(45deg); }
.pasi::after { right: 0; }
.pasi li { position: relative; grid-column: span 3; display: flex; flex-direction: column; gap: 8px; padding-top: 48px; }
.pasi li::before { content: ""; position: absolute; top: 11px; left: 0; width: calc(100% + var(--jg)); height: 1px; background: var(--text); }
.pasi li:last-child::before { width: 100%; }
.pasi li::after { left: 0; }
.pas-nr { font-size: var(--text-titlu); line-height: var(--lh-titlu); letter-spacing: var(--ls-nr); font-weight: 700; color: var(--gri); margin-bottom: 16px; }
.cum .mai-mult { grid-column: 1 / -1; }
.asistent { padding-block: 120px var(--sectiune); }
.asistent .grila { align-items: start; }
.asistent-text { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 24px; }
.asistent-buton { padding-top: 8px; }
.conversatie { grid-column: 7 / span 6; display: flex; flex-direction: column; border: 1px solid var(--text); background: var(--fond); }
.conversatie-cap { display: flex; justify-content: space-between; gap: 16px; padding: 12px 20px; border-bottom: 1px solid var(--text); }
.conversatie-cap span { color: var(--stins); }
.eu { align-self: flex-end; max-width: 80%; margin: 24px 20px 0; padding: 12px 16px; background: var(--panou); }
.el { padding: 16px 20px 24px; }
.abonament { padding-block: var(--sectiune); background: var(--panou); }
.abonament .grila { row-gap: 48px; align-items: start; }
.abonament-titlu { grid-column: 1 / span 11; }
.abonament-titlu .gri, .abonament-enunt .gri { color: var(--gri); }
.abonament-text { grid-column: 1 / span 5; }
.cerere { grid-column: 7 / span 6; display: flex; flex-direction: column; gap: 16px; padding-top: 16px; border-top: 1px solid var(--text); }
.cerere-buton { padding-top: 8px; }
.oferta { font-weight: 500; }
.abonament .mai-mult { grid-column: 1 / span 5; grid-row: 3; align-self: end; }
.subsol { background: var(--subsol); color: var(--subsol-text); padding-block: 96px 32px; }
.subsol-grila { row-gap: 48px; align-items: start; }
.subsol a { color: var(--subsol-text); text-decoration: none; }
.subsol a:hover { text-decoration: underline; }
.subsol-m { grid-column: 1 / span 3; }
.marca-m { display: block; width: 158px; height: 158px; }
.subsol-nav { grid-column: 4 / span 6; display: flex; flex-direction: column; }
.subsol-contact { grid-column: 10 / span 3; display: flex; flex-direction: column; }
.subsol-coloane { display: grid; grid-auto-flow: column; grid-template-rows: repeat(4, auto); column-gap: var(--jg);
justify-content: start; }
.subsol-nav .subsol-coloane { grid-auto-columns: round(down, (100% - var(--jg)) / 2, 1px); }
.subsol-contact .subsol-coloane { grid-auto-columns: minmax(0, 1fr); }
.subsol-titlu { color: var(--subsol-stins); padding-bottom: 8px; }
.subsol-marca { grid-column: 1 / -1; padding-top: 48px; container-type: inline-size; }
.piloni-subsol { height: 64px; border-top: 4px solid var(--accent); }
.piloni-subsol::before, .piloni-subsol::after { content: none; }
.piloni-subsol span { align-items: flex-start; gap: 6px; }
.piloni-subsol i { flex-basis: 6px; background: var(--subsol-linie); }
.marca { display: block; width: 100%; height: round(100cqw * 0.169693, 1px); }
.marca path { fill: var(--subsol-text); }
.subsol-copy { grid-column: 1 / span 3; color: var(--subsol-stins); }
.subsol-slogan { grid-column: 7 / span 6; font-weight: 700; }
.cap-pagina { padding-block: 24px 72px; }
.cap-grila { row-gap: 24px; align-items: start; }
.fir { grid-column: 1 / -1; display: flex; gap: 12px; color: var(--stins); font-weight: 500; }
.fir a { color: var(--stins); text-decoration: none; }
.fir a:hover { color: var(--text); text-decoration: underline; }
.cap-pagina h1 { grid-column: 1 / -1; font-size: var(--text-display); line-height: var(--lh-display); letter-spacing: var(--ls-display); }
.cap-lead { grid-column: 1 / span 6; padding-top: 16px; border-top: 1px solid var(--text); font-weight: 500; }
.cap-actiuni { grid-column: 7 / span 6; padding-top: 24px; border-top: 1px solid var(--text); }
.planse-zona { padding-block: 24px 120px; }
.planse-grila { align-items: start; }
.planse-index { grid-column: 1 / span 3; }
.planse-index-titlu { padding-bottom: 12px; color: var(--stins); font-weight: 500; }
.planse-index ol { border-top: 4px solid var(--accent); }
.planse-index li { border-bottom: 1px solid var(--linie); }
.planse-index a { display: flex; gap: 12px; padding: 10px 0 11px; font-weight: 500; text-decoration: none; }
.planse-index a:hover span:last-child { text-decoration: underline; }
.planse-index .nr { flex: none; width: 32px; color: var(--stins); font-weight: 700; }
.planse { --gol: 48px; grid-column: 4 / span 9; display: flex; flex-direction: column; gap: var(--gol); }
.plansa-tinta { display: block; height: 0; margin-bottom: calc(-1 * var(--gol)); scroll-margin-top: 24px; }
.plansa { position: relative; display: flex; flex-direction: column; background: var(--plansa); border: 1px solid var(--linie-tare);
border-top: 4px solid var(--accent); }
.plansa-banda { display: flex; justify-content: space-between; gap: 16px; padding: 12px 24px 13px; border-bottom: 1px solid var(--linie);
color: var(--stins); font-weight: 500; }
.plansa-eticheta { flex: 1 1 auto; color: var(--text); font-weight: 700; letter-spacing: var(--ls-caps);
margin-right: calc(-1 * var(--ls-caps)); text-transform: uppercase; }
.plansa-corp { flex: 1 1 auto; min-height: 0; display: grid; grid-template-columns: round(down, 56%, 1px) minmax(0, 1fr); }
.plansa-text { display: flex; flex-direction: column; gap: 16px; padding: 32px; }
.plansa-text h2 { font-weight: 700; }
.plansa-lead { font-weight: 500; }
.plansa-puncte { border-top: 1px solid var(--text); }
.plansa-puncte li { position: relative; padding: 10px 0 11px 28px; border-bottom: 1px solid var(--linie); }
.plansa-puncte li::before { content: ""; position: absolute; left: 0; top: 25px; width: 14px; height: 2px; background: var(--accent); }
.plansa-actiune { padding-top: 8px; }
.plansa-afirmatie { font-size: var(--text-titlu); line-height: var(--lh-titlu); letter-spacing: var(--ls-titlu); font-weight: 500;
padding-top: 16px; border-top: 4px solid var(--accent); }
.plansa-fara-desen .plansa-corp { grid-template-columns: minmax(0, 1fr); }
.plansa-desen { display: flex; align-items: flex-start; justify-content: flex-start; padding: 32px; border-left: 1px solid var(--linie);
background-color: var(--desen-fond); background-position: -1px -1px; background-size: 24px 24px;
background-image: linear-gradient(var(--desen-grila) 1px, transparent 1px), linear-gradient(90deg, var(--desen-grila) 1px, transparent 1px); }
.plansa-desen .ilu { max-width: 520px; height: 320px; }
.plansa-fragment .fereastra, .plansa-fragment .conversatie { width: 100%; max-width: 460px; }
.plansa-lata .plansa-corp { grid-template-columns: round(down, 46%, 1px) minmax(0, 1fr); }
.plansa-lata .plansa-fragment .fereastra { max-width: none; }
@media (min-width: 1200px) {
.plansa-desen { position: relative; }
.plansa-desen > * { position: absolute; left: round(down, 50%, 1px); top: round(down, 50%, 1px);
translate: round(up, -50%, 1px) round(up, -50%, 1px); }
.plansa-desen .ilu { width: min(520px, 100% - 64px); }
.plansa-fragment .fereastra, .plansa-fragment .conversatie { width: min(460px, 100% - 64px); }
.plansa-lata .plansa-fragment .fereastra { width: calc(100% - 64px); }
.plansa:not(.plansa-fara-desen) .plansa-corp { min-height: 544px; }
}
@media (max-width: 1199px) {
.plansa-desen .ilu { margin-left: max(0px, round(down, (100% - 520px) / 2, 1px)); }
.plansa-fragment .fereastra, .plansa-fragment .conversatie { margin-left: max(0px, round(down, (100% - 460px) / 2, 1px)); }
.plansa-lata .plansa-fragment .fereastra { margin-left: 0; }
}
.fereastra { display: flex; flex-direction: column; gap: 12px; padding: 16px 20px 12px; background: var(--fond); border: 1px solid var(--linie-tare); }
.fereastra-cap { display: flex; flex-direction: column; }
.fereastra-cap strong { line-height: var(--lh-corp); }
.fereastra-cap span, .fereastra figcaption { color: var(--stins); }
.randuri { display: flex; flex-direction: column; border-top: 1px solid var(--text); }
.randuri div { display: flex; justify-content: space-between; gap: 16px; padding: 6px 0; border-bottom: 1px solid var(--linie); }
.randuri dt { min-width: 0; }
.randuri dd { flex: none; font-weight: 700; white-space: nowrap; text-align: right; }
.randuri .total { border-top: 1px solid var(--text); border-bottom: 0; }
.randuri .total dt { font-weight: 700; }
.randuri .ascuns dd { color: var(--stins); font-weight: 400; }
.marja { display: flex; flex-direction: column; }
.marja strong { font-size: var(--text-titlu); line-height: var(--lh-titlu); }
.situatie { width: 100%; border-collapse: separate; border-spacing: 0; table-layout: fixed; border-top: 1px solid var(--text); }
.situatie .c-um { width: 64px; }
.situatie .c-nr { width: 100px; }
.situatie th, .situatie td { padding: 6px 0; border-bottom: 1px solid var(--linie); text-align: right; font-weight: 400; vertical-align: top; }
.situatie th { color: var(--stins); }
.situatie td { font-weight: 700; font-variant-numeric: tabular-nums; }
.situatie th:first-child, .situatie td:first-child { text-align: left; }
.situatie th + th, .situatie td + td { padding-left: 12px; }
.situatie td:first-child { font-weight: 400; padding-right: 16px; }
.situatie th:nth-child(2), .situatie td:nth-child(2) { text-align: left; font-weight: 400; }
.conversatie-mica .eu { margin: 16px 16px 0; }
.conversatie-mica .el { padding: 12px 16px 16px; }
.conversatie-mica .conversatie-cap { padding: 10px 16px; }
.date-banda { padding-block: 96px; background: var(--panou); }
.date-banda .grila { row-gap: 16px; align-items: baseline; }
.date-banda .date-titlu { grid-column: 1 / span 5; font-weight: 700; }
.date-banda .date-text { grid-column: 7 / span 6; }
.cerere-banda { padding-block: 120px; scroll-margin-top: var(--bara); }
.cerere-banda .grila { row-gap: 32px; align-items: start; }
.cerere-titlu { grid-column: 1 / span 5; font-weight: 700; }
.cerere-corp { grid-column: 7 / span 6; display: flex; flex-direction: column; gap: 16px; padding-top: 16px; border-top: 1px solid var(--text); }
.urmatoarea { padding-block: 72px 120px; }
.urmatoarea-grila { row-gap: 16px; padding-top: 40px; align-items: baseline; }
.urmatoarea-eticheta { grid-column: 1 / span 3; color: var(--stins); font-weight: 500; }
.urmatoarea-leg { grid-column: 4 / span 9; font-size: var(--text-titlu); line-height: var(--lh-titlu); letter-spacing: var(--ls-titlu);
font-weight: 700; text-decoration: none; }
.urmatoarea-leg:hover { text-decoration: underline; text-decoration-thickness: 3px; text-underline-offset: 10px; }
.despre-pagina { padding-top: 48px; }
.stalpi-desen li { gap: 0; }
.stalp-desen .ilu { height: 96px; }
.stalp-desen { padding: 24px; margin-bottom: 24px; background-color: var(--desen-fond); background-size: 24px 24px; background-position: -1px -1px;
background-image: linear-gradient(var(--desen-grila) 1px, transparent 1px), linear-gradient(90deg, var(--desen-grila) 1px, transparent 1px); }
.roluri { padding-block: 120px; }
.roluri .grila { row-gap: 48px; align-items: start; }
.roluri-titlu { grid-column: 1 / span 3; color: var(--gri); }
.roluri-lista { grid-column: 4 / span 9; display: grid; grid-template-columns: subgrid; }
.roluri-lista li { grid-column: span 3; display: flex; flex-direction: column; gap: 16px; padding-top: 16px; border-top: 4px solid var(--accent); }
.flux { padding-block: 0 120px; }
.flux .grila { row-gap: 48px; align-items: start; }
.flux-text { grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 24px; }
.pastile-flux { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
grid-template-columns: repeat(2, round(down, (100% - var(--jg)) / 2 + 0.01px, 1px)); column-gap: var(--jg); row-gap: 24px; }
.pastile-flux li { grid-column: auto; }
.flux-fragment { grid-column: 8 / span 5; }
.proprietar-banda { padding-block: 96px; background: var(--panou); }
.proprietar-mare { grid-column: 4 / span 9; padding-top: 24px; border-top: 4px solid var(--accent); font-size: var(--text-titlu);
line-height: var(--lh-titlu); letter-spacing: var(--ls-titlu); font-weight: 700; }
.cum-pagina { padding-top: 24px; }
.cum-enunt { grid-column: 1 / -1; color: var(--gri); }
.pasi-mari { grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; row-gap: 96px; }
.pas-mare { position: relative; grid-column: 1 / -1; display: grid; grid-template-columns: subgrid; row-gap: 24px; align-items: start;
padding-top: 48px; border-top: 1px solid var(--text); }
.pas-mare::before, .pas-mare::after { content: ""; position: absolute; top: -9px; width: 1px; height: 18px; background: var(--text); transform: rotate(45deg); }
.pas-mare::before { left: 0; }
.pas-mare::after { right: 0; }
.pas-mare .pas-nr { grid-column: 1 / span 2; font-size: var(--text-display); line-height: var(--lh-display); letter-spacing: var(--ls-display); margin: 0; }
.pas-text { grid-column: 3 / span 5; display: flex; flex-direction: column; gap: 16px; }
.pas-text h2 { font-weight: 700; }
.pas-lead { font-weight: 500; }
.pas-ilustratie .ilu { height: 280px; }
.pas-ilustratie { grid-column: 8 / span 5; padding: 32px; background-color: var(--desen-fond); background-size: 24px 24px; background-position: -1px -1px;
background-image: linear-gradient(var(--desen-grila) 1px, transparent 1px), linear-gradient(90deg, var(--desen-grila) 1px, transparent 1px); }
.asistent-pagina { padding-top: 24px; }
.asistent-puncte { grid-column: 1 / span 5; display: flex; flex-direction: column; gap: 32px; }
.asistent-puncte li { display: flex; flex-direction: column; gap: 12px; padding-top: 16px; border-top: 4px solid var(--accent); }
.asistent-puncte h2 { font-weight: 700; }
.asistent-pagina .conversatie { grid-column: 7 / span 6; grid-row: 1 / span 2; }
.asistent-pagina .asistent-buton { grid-column: 1 / span 5; padding-top: 48px; }
.abonament-pagina { padding-block: 24px 120px; }
.abonament-pagina .grila { row-gap: 48px; align-items: start; }
.abonament-enunt { grid-column: 1 / -1; text-transform: none; font-weight: 700; }
.abonament-puncte { grid-column: 1 / span 6; display: flex; flex-direction: column; gap: 32px; }
.abonament-puncte li { display: flex; flex-direction: column; gap: 8px; padding-top: 16px; border-top: 1px solid var(--text); }
.abonament-desen .ilu { height: 360px; }
.abonament-desen { grid-column: 8 / span 5; padding: 32px; background-color: var(--desen-fond); background-size: 24px 24px; background-position: -1px -1px;
background-image: linear-gradient(var(--desen-grila) 1px, transparent 1px), linear-gradient(90deg, var(--desen-grila) 1px, transparent 1px); }
.k0 { --k: 0; }
.k1 { --k: 1; }
.k2 { --k: 2; }
.k3 { --k: 3; }
.k4 { --k: 4; }
.k5 { --k: 5; }
.k6 { --k: 6; }
.k7 { --k: 7; }
.k8 { --k: 8; }
.k9 { --k: 9; }
.k10 { --k: 10; }
.k11 { --k: 11; }
.definitii { position: absolute; width: 0; height: 0; overflow: hidden; }
.ilu { display: block; width: 100%; height: auto; overflow: visible; }
.ilu .c, .ilu .cf, .ilu .c-gros, .ilu .c-zona { fill: none; stroke: var(--desen-linie); stroke-width: 1.5;
vector-effect: non-scaling-stroke; stroke-linejoin: round; stroke-linecap: round; }
.ilu .cf { stroke: var(--desen-fin); stroke-width: 1; }
.ilu .c-gros { stroke-width: 3; }
.ilu .c-zona { stroke: var(--desen-accent); stroke-width: 9; stroke-linecap: butt; }
.ilu .pct { stroke-dasharray: 5 4; }
.ilu .alb { fill: var(--desen-hartie); }
.ilu .gri { fill: var(--desen-gri); }
.ilu .cern { fill: var(--desen-linie); }
.ilu .fond { fill: var(--desen-fond); }
.ilu .has { fill: url(#p-hasura); }
.ilu .mobil-rand { fill: var(--desen-gri); }
.hasura-fond { fill: var(--desen-hartie); }
.hasura-linie { stroke: var(--desen-linie); stroke-width: 1; }
.sageata-varf { fill: var(--desen-linie); }
@media (min-width: 1280px) and (min-height: 820px) {
.planse-zona { --T: calc(var(--bara) + 32px); --h: min(820px, calc(100svh - var(--bara) - 64px)); --g: 120px; }
.planse { --gol: var(--g); padding-bottom: 32px; }
.plansa { position: sticky; top: var(--T); height: var(--h); }
.plansa-tinta { scroll-margin-top: calc(var(--T) - var(--bara)); }
.planse-index { position: sticky; top: var(--T); }
}
@keyframes plansa-dedesubt { to { scale: .94; translate: 0 -28px; } }
@keyframes plansa-umbra { to { opacity: 1; } }
@keyframes index-aprins { 0%, 100% { color: inherit; } 1%, 99% { color: var(--text); } }
@keyframes index-bara { 0%, 100% { background: var(--linie); } 1%, 99% { background: var(--accent); } }
@media (prefers-reduced-motion: no-preference) and (min-width: 1280px) and (min-height: 820px) {
@supports (animation-timeline: view()) and (timeline-scope: --planse) {
.planse-grila { timeline-scope: --planse; }
.planse { view-timeline: --planse block; }
.plansa:not(:last-child) { transform-origin: 50% 0;
animation: plansa-dedesubt linear both; animation-timeline: --planse;
animation-range: exit-crossing calc(var(--k) * (var(--h) + var(--g)) + var(--g) - var(--T))
exit-crossing calc((var(--k) + 1) * (var(--h) + var(--g)) - var(--T)); }
.plansa:not(:last-child)::after { content: ""; position: absolute; inset: 0; background: var(--umbra); opacity: 0; pointer-events: none;
animation: plansa-umbra linear both; animation-timeline: --planse;
animation-range: exit-crossing calc(var(--k) * (var(--h) + var(--g)) + var(--g) - var(--T))
exit-crossing calc((var(--k) + 1) * (var(--h) + var(--g)) - var(--T)); }
.planse-index li { position: relative; }
.planse-index li a { color: var(--stins); animation: index-aprins linear both; animation-timeline: --planse;
animation-range: exit-crossing calc(var(--k) * (var(--h) + var(--g)) - var(--T) - var(--h) / 2)
exit-crossing calc((var(--k) + 1) * (var(--h) + var(--g)) - var(--T) - var(--h) / 2); }
.planse-index li::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 32px; height: 2px;
animation: index-bara linear both; animation-timeline: --planse;
animation-range: exit-crossing calc(var(--k) * (var(--h) + var(--g)) - var(--T) - var(--h) / 2)
exit-crossing calc((var(--k) + 1) * (var(--h) + var(--g)) - var(--T) - var(--h) / 2); }
}
}
@keyframes bate { 0% { transform: translateY(-101%); } 30% { transform: translateY(-50%); } 40% { transform: translateY(-50%); }
64% { transform: translateY(-18%); } 74% { transform: translateY(-18%); } 100% { transform: translateY(0); } }
@media (prefers-reduced-motion: no-preference) {
.piloni-cap i { animation: bate 1.5s cubic-bezier(.35, 0, .15, 1) both; animation-delay: calc(var(--p) * 70ms + 250ms); }
.cuprins-lista a { transition: background-color .2s linear; }
}
@media (min-width: 1024px) and (max-width: 1599px) {
:root { --bara: 124px; }
.bara-rand { flex-wrap: wrap; height: auto; row-gap: 0; }
.bara-sigla { margin-block: 10px; }
.bara-nav { order: 3; flex: 0 0 100%; height: 44px; margin-left: 0; box-shadow: 0 -1px 0 var(--linie); }
}
@media (max-width: 1023px) {
.bara-nav { display: none; }
.meniu { display: block; position: relative; }
.meniu summary { display: flex; align-items: center; gap: 12px; height: 48px; cursor: pointer; list-style: none; font-weight: 700; }
.meniu summary::-webkit-details-marker { display: none; }
.meniu-semn { display: flex; align-items: flex-end; gap: 3px; width: 18px; height: 20px; }
.meniu-semn i { display: block; flex: 0 0 4px; height: 100%; background: var(--text); }
.meniu-semn i:nth-child(2) { height: 60%; }
.meniu-nav { position: absolute; right: 0; top: 64px; display: flex; flex-direction: column; min-width: 300px; padding: 12px 24px;
background: var(--fond); border: 1px solid var(--text); }
.meniu-nav a { padding-block: 9px; font-weight: 500; text-decoration: none; }
.meniu-nav a:hover, .meniu-nav a[aria-current="page"] { text-decoration: underline; }
}
@media (max-width: 1439px) {
:root { --text-display: 136px; --lh-display: 128px; --ls-display: -3.5px; --text-titlu: 48px; --lh-titlu: 52px; }
.btn-contur { padding: 0 16px; }
.erou-actiuni { column-gap: 24px; }
.cuprins-lista a { grid-template-columns: 72px round(down, 34%, 1px) minmax(0, 1fr) 32px; }
}
@media (max-width: 1399px) {
.planse { grid-column: 1 / -1; }
.planse-index { display: none; }
}
@media (max-width: 1199px) {
:root { --text-display: 112px; --lh-display: 112px; --ls-display: -3px; --text-titlu: 44px; --lh-titlu: 48px;
--margine: 32px; --sectiune: 112px; }
.erou-actiuni { grid-column: 1 / -1; padding-top: 0; border-top: 0; }
.erou-lead { grid-column: 1 / span 6; }
.proprietar { grid-column: 7 / span 6; }
.cuprins-cap { grid-column: 1 / span 4; }
.cuprins-lista { grid-column: 5 / span 8; }
.cuprins-lista a { grid-template-columns: 56px minmax(0, 1fr) 32px; row-gap: 4px; }
.cuprins-nr { grid-row: 1 / span 2; }
.cuprins-nume { grid-column: 2; }
.cuprins-desc { grid-column: 2; grid-row: 2; }
.cuprins-lista .sageata { grid-column: 3; grid-row: 1; }
.enunt-dublu, .abonament-titlu { grid-column: 1 / -1; }
.pe-scurt-text { grid-column: 1 / span 8; }
.pastile li { grid-column: span 6; margin-bottom: 32px; }
.despre-titlu { grid-column: 1 / -1; grid-row: auto; }
.enunt-stalpi { grid-column: 1 / -1; grid-row: auto; }
.despre-text { grid-column: 1 / span 9; }
.stalpi, .mai-mult { grid-column: 1 / -1; }
.stalpi li { grid-column: span 4; }
.cum-titlu { grid-column: 1 / -1; }
.pasi li { grid-column: span 6; margin-bottom: 40px; }
.pasi::after, .pasi li::before, .pasi li::after { content: none; }
.pasi li { padding-top: 0; }
.asistent-text { grid-column: 1 / span 10; }
.conversatie { grid-column: 1 / span 10; margin-top: 48px; }
.abonament-text { grid-column: 1 / span 9; }
.cerere { grid-column: 1 / span 9; }
.abonament .mai-mult { grid-column: 1 / span 9; grid-row: auto; }
.subsol-m { grid-column: 1 / span 3; }
.subsol-nav { grid-column: 4 / span 6; }
.subsol-contact { grid-column: 10 / span 3; }
.subsol-copy { grid-column: 1 / span 4; }
.subsol-slogan { grid-column: 5 / span 8; }
.plansa-corp, .plansa-lata .plansa-corp { grid-template-columns: minmax(0, 1fr); }
.plansa-desen .ilu { height: 300px; }
.plansa-desen { border-left: 0; border-top: 1px solid var(--linie); }
.cap-lead { grid-column: 1 / span 9; }
.cap-actiuni { grid-column: 1 / span 9; padding-top: 0; border-top: 0; }
.roluri-titlu { grid-column: 1 / -1; }
.roluri-lista { grid-column: 1 / -1; }
.roluri-lista li { grid-column: span 4; }
.flux-text { grid-column: 1 / span 7; }
.flux-fragment { grid-column: 1 / span 7; }
.proprietar-mare { grid-column: 1 / -1; }
.pas-mare .pas-nr { grid-column: 1 / span 2; }
.pas-text { grid-column: 3 / span 10; }
.pas-ilustratie { grid-column: 3 / span 10; }
.asistent-puncte { grid-column: 1 / span 10; }
.asistent-pagina .conversatie { grid-column: 1 / span 10; grid-row: auto; margin-top: 0; }
.asistent-pagina .asistent-buton { grid-column: 1 / span 10; padding-top: 0; }
.abonament-puncte { grid-column: 1 / span 7; }
.abonament-desen { grid-column: 1 / span 7; }
.date-banda .date-titlu, .cerere-titlu { grid-column: 1 / -1; }
.date-banda .date-text, .cerere-corp { grid-column: 1 / span 9; }
.urmatoarea-eticheta { grid-column: 1 / -1; }
.urmatoarea-leg { grid-column: 1 / -1; }
}
@media (max-width: 1023px) {
:root { --margine: 24px; }
.detaliu { --text-display: 80px; --lh-display: 84px; --ls-display: -2px; }
.cuprins-cap, .cuprins-lista { grid-column: 1 / -1; }
.stalpi li { grid-column: 1 / -1; margin-bottom: 40px; }
.pasi li { grid-column: span 6; }
.roluri-lista li { grid-column: 1 / -1; }
}
@media (max-width: 767px) {
:root { --text-display: 64px; --lh-display: 64px; --ls-display: -2px; --text-titlu: 30px; --lh-titlu: 36px; --ls-titlu: -.5px;
--text-corp: 18px; --lh-corp: 28px; --ls-nr: -1px; --margine: 16px; --jg: 16px; --bara: 64px; --sectiune: 80px; }
.detaliu { --text-display: 40px; --lh-display: 44px; --ls-display: -1px; }
.bara-actiuni { display: none; }
.meniu { margin-left: auto; }
.bara-sigla, .bara-sigla .logo { width: 176px; height: 48px; }
.bara-rand { column-gap: 8px; }
.meniu { flex: none; }
.tema-buton { width: 44px; height: 44px; }
.tema-comutabila .tema-buton { margin-left: auto; }
.tema-comutabila .meniu { margin-left: 0; }
.meniu-nav { top: 56px; }
.erou { padding-block: 16px 32px; }
.erou-grila { row-gap: 20px; }
.erou-lead, .proprietar { padding-top: 12px; }
.erou-lead, .proprietar, .erou-actiuni { grid-column: 1 / -1; }
.erou-actiuni { flex-direction: column; align-items: flex-start; gap: 16px; }
.cuprins { padding-top: 80px; }
.cuprins-lista a { grid-template-columns: 40px minmax(0, 1fr) 24px; padding-right: 0; column-gap: 12px; }
.pe-scurt { padding-block: 80px; }
.pe-scurt .grila, .despre .grila, .cum .grila, .abonament .grila { row-gap: 32px; }
.pe-scurt-text, .despre-text, .cum-titlu, .asistent-text, .conversatie, .abonament-text, .cerere { grid-column: 1 / -1; }
.pastile li, .pasi li { grid-column: 1 / -1; margin-bottom: 24px; }
.piloni-banda { height: 32px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.piloni-banda span:nth-child(n+7) { display: none; }
.despre { padding-block: 80px; }
.conversatie { margin-top: 40px; }
.conversatie-cap { padding: 12px 16px; }
.eu { margin: 20px 16px 0; max-width: 88%; }
.el { padding: 16px 16px 20px; }
.subsol { padding-block: 64px 24px; }
.subsol-grila { row-gap: 32px; }
.subsol-m, .subsol-nav, .subsol-contact, .subsol-copy, .subsol-slogan { grid-column: 1 / -1; }
.marca-m { width: 96px; height: 96px; }
.subsol-marca { padding-top: 16px; }
.piloni-subsol { height: 40px; grid-template-columns: repeat(6, minmax(0, 1fr)); }
.piloni-subsol span:nth-child(n+7) { display: none; }
.cap-pagina { padding-bottom: 48px; }
.cap-lead { grid-column: 1 / -1; }
.cap-actiuni { grid-column: 1 / -1; }
.planse-zona { padding-bottom: 80px; }
.planse { --gol: 32px; }
.plansa-banda { padding: 10px 16px 11px; flex-wrap: wrap; row-gap: 0; }
.plansa-grupa { display: none; }
.plansa-text { padding: 20px 16px 24px; }
.plansa-desen { padding: 20px 16px; }
.plansa-desen .ilu { height: 200px; }
.pas-ilustratie .ilu { height: 200px; }
.abonament-desen .ilu { height: 220px; }
.fereastra { padding: 12px 16px 8px; }
.situatie .c-nr { width: 88px; }
.situatie .c-um, .situatie .c-prec, .situatie .prec, .situatie th:nth-child(2), .situatie td:nth-child(2) { display: none; }
.date-banda, .cerere-banda { padding-block: 72px; }
.date-banda .date-text, .cerere-corp { grid-column: 1 / -1; }
.roluri { padding-block: 80px; }
.flux-text, .flux-fragment { grid-column: 1 / -1; }
.pastile-flux { grid-template-columns: minmax(0, 1fr); }
.proprietar-banda { padding-block: 64px; }
.pasi-mari { row-gap: 64px; }
.pas-mare .pas-nr, .pas-text, .pas-ilustratie { grid-column: 1 / -1; }
.pas-ilustratie { padding: 16px; }
.asistent-puncte, .asistent-pagina .conversatie, .asistent-pagina .asistent-buton { grid-column: 1 / -1; }
.abonament-puncte, .abonament-desen { grid-column: 1 / -1; }
.abonament-desen { padding: 16px; }
.urmatoarea { padding-block: 48px 80px; }
}
@media (min-width: 1024px) and (max-height: 859px) {
:root { --text-display: 112px; --lh-display: 112px; --ls-display: -3px; }
}
@media (min-width: 1024px) and (max-height: 719px) {
:root { --text-display: 96px; --lh-display: 96px; --ls-display: -2.5px; }
}
@media (min-width: 1024px) and (max-height: 679px) {
:root { --text-display: 80px; --lh-display: 80px; --ls-display: -2px; }
}
@media (min-width: 1024px) and (max-height: 559px) {
:root { --text-display: 64px; --lh-display: 64px; --ls-display: -2px; }
}
