/* Sport Center Suceava — design importat 1:1 de pe sportcentersv.ro (css/foundations.css + css/site.css) */
/* vietnamese */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3p-ks6FospT4.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3p-ks6VospT4.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 300;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3p-ks51os.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHpv4kjgoGqM7E_A8s52Hs.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHpv4kjgoGqM7E_Ass52Hs.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHpv4kjgoGqM7E_DMs5.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3_-gs6FospT4.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3_-gs6VospT4.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3_-gs51os.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E30-8s6FospT4.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E30-8s6VospT4.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E30-8s51os.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3t-4s6FospT4.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3t-4s6VospT4.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3t-4s51os.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3q-0s6FospT4.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3q-0s6VospT4.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlow/v13/7cHqv4kjgoGqM7E3q-0s51os.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B4-Lwz3nWuZEC.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B4-Lwz3jWuZEC.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B4-Lwz3bWuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B4873z3nWuZEC.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B4873z3jWuZEC.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 600;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B4873z3bWuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B46r2z3nWuZEC.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B46r2z3jWuZEC.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B46r2z3bWuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B47b1z3nWuZEC.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B47b1z3jWuZEC.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B47b1z3bWuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B45L0z3nWuZEC.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B45L0z3jWuZEC.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Barlow Condensed';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/barlowcondensed/v13/HTxwL3I-JCGChYJ8VI-L6OO_au7B45L0z3bWuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFh3KuVoB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhzKuVoB.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhLKuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFh3KuVoB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhzKuVoB.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhLKuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFh3KuVoB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhzKuVoB.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 800;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhLKuQ.woff2) format('woff2');
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;
}
/* vietnamese */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFh3KuVoB.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhzKuVoB.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'Big Shoulders Stencil';
font-style: normal;
font-weight: 900;
font-display: swap;
src: url(https://fonts.gstatic.com/s/bigshouldersstencil/v4/TwMj-JIEQ1Je5sI6Bx1TKHD83rT3u3NSCfbFxqa9oQbR_CiZMgOzFhLKuQ.woff2) format('woff2');
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;
}
/* cyrillic-ext */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx3cwhsk.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxTcwhsk.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxPcwhsk.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx_cwhsk.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx7cwhsk.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxDcwg.woff2) format('woff2');
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;
}
/* cyrillic-ext */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx3cwhsk.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxTcwhsk.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxPcwhsk.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx_cwhsk.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx7cwhsk.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 500;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxDcwg.woff2) format('woff2');
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;
}
/* cyrillic-ext */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx3cwhsk.woff2) format('woff2');
unicode-range: U+0460-052F, U+1C80-1C8A, U+20B4, U+2DE0-2DFF, U+A640-A69F, U+FE2E-FE2F;
}
/* cyrillic */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxTcwhsk.woff2) format('woff2');
unicode-range: U+0301, U+0400-045F, U+0490-0491, U+04B0-04B1, U+2116;
}
/* greek */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxPcwhsk.woff2) format('woff2');
unicode-range: U+0370-0377, U+037A-037F, U+0384-038A, U+038C, U+038E-03A1, U+03A3-03FF;
}
/* vietnamese */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx_cwhsk.woff2) format('woff2');
unicode-range: U+0102-0103, U+0110-0111, U+0128-0129, U+0168-0169, U+01A0-01A1, U+01AF-01B0, U+0300-0301, U+0303-0304, U+0308-0309, U+0323, U+0329, U+1EA0-1EF9, U+20AB;
}
/* latin-ext */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPx7cwhsk.woff2) format('woff2');
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-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
font-family: 'JetBrains Mono';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/jetbrainsmono/v24/tDbv2o-flEEny0FZhsfKu5WU4zr3E_BX0PnT8RD8yKwBNntkaToggR7BYRbKPxDcwg.woff2) format('woff2');
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;
}
/* latin */
@font-face {
font-family: 'Stardos Stencil';
font-style: normal;
font-weight: 400;
font-display: swap;
src: url(https://fonts.gstatic.com/s/stardosstencil/v15/X7n94bcuGPC8hrvEOHXOgaKCc2Th6F52.woff2) format('woff2');
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;
}
/* latin */
@font-face {
font-family: 'Stardos Stencil';
font-style: normal;
font-weight: 700;
font-display: swap;
src: url(https://fonts.gstatic.com/s/stardosstencil/v15/X7n44bcuGPC8hrvEOHXOgaKCc2TpU3tjuQWs.woff2) format('woff2');
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;
}
/* Zaonix: pagina publică are resetul Tailwind (preflight); în designul importat revenim la
stilurile implicite ale browserului, ca pe site-ul vechi. Specificitate zero: orice regulă a site-ului câștigă. */
body{display:block}
:where(.scv-root) :where(*:not(svg,svg *)){margin:revert;padding:revert;border:revert;outline:revert}
:where(.scv-root) :where(h1,h2,h3,h4,h5,h6){font-size:revert;font-weight:revert}
:where(.scv-root) :where(a){color:revert;text-decoration:revert}
:where(.scv-root) :where(ol,ul,menu){list-style:revert}
:where(.scv-root) :where(img,svg,video,canvas,audio,iframe,embed,object){display:revert;vertical-align:revert}
:where(.scv-root) :where(img,video){max-width:revert;height:revert}
:where(.scv-root) :where(button,input,select,optgroup,textarea){font:revert;letter-spacing:revert;color:revert;border-radius:revert;background-color:revert}
:where(.scv-root) :where(table){border-collapse:revert;border-color:revert;text-indent:revert}
:where(.scv-root) :where(hr){height:revert;color:revert;border-top-width:revert}
:where(.scv-root) :where(small){font-size:revert}
:where(.scv-root) :where(b,strong){font-weight:revert}
:where(.scv-root) :where(textarea){resize:revert}
:where(.scv-root) :where(summary){display:revert}
:where(.scv-root) ::placeholder{opacity:revert;color:revert}
/* globals.css pune ::placeholder cu !important în @layer base; în același strat, cu specificitate mai mare, revine culoarea site-ului */
@layer base{.scv-root .field input::placeholder,.scv-root .field textarea::placeholder{color:var(--steel-2)!important}}
/* ============================================================
SPORT CENTER SUCEAVA — Foundations
Colors, type, spacing, radii, shadows, motion.
------------------------------------------------------------
Pull this file into any prototype:
============================================================ */
/* ---------- Webfonts ---------------------------------------- */
/* Display: Big Shoulders Stencil Display — stencil/grunge headlines */
/* Subhead: Barlow Condensed — tactical labels, stats, numbers */
/* Body: Barlow — running text, UI */
/* Mono: JetBrains Mono — codes, timetables, data */
:root {
/* ---------- Brand palette ---------- */
/* Lime / Volt — the signature neon. Pulled from the gym's equipment
paint and the "EPIC" wall. Use on black; never on white. */
--volt: #C9F23B; /* primary neon (gym equipment) */
--volt-hot: #DAF012; /* hottest highlight, signage */
--volt-deep: #A6C316; /* shadowed / pressed state */
--volt-glow: #E4F534; /* glow / focus halo */
/* Achromatic core — the gym is mostly black & charcoal */
--black: #0A0A0A; /* page background */
--ink: #141414; /* surface 1 (cards) */
--ink-2: #1C1C1C; /* surface 2 (raised) */
--ink-3: #262626; /* surface 3 (input bg) */
--steel: #3A3A3A; /* borders, dividers */
--steel-2: #5A5A5A; /* muted text on dark */
--concrete: #8A8A8A; /* secondary text */
--chalk: #D9D9D9; /* primary text on dark, soft */
--bone: #F4F4F0; /* light surfaces (rare) */
--white: #FFFFFF;
/* Secondary accent — orange seen on gym floor mats. Use sparingly
for warnings, hot zones, "promo" callouts. NOT for primary CTAs. */
--ember: #F26A1F;
--ember-deep: #B84A12;
/* Semantic */
--ok: var(--volt);
--warn: #F2C037;
--danger: #E5394A;
--info: #6BB7E6;
/* ---------- Semantic tokens ---------- */
--bg: var(--black);
--bg-elev-1: var(--ink);
--bg-elev-2: var(--ink-2);
--fg: var(--chalk);
--fg-strong: var(--white);
--fg-muted: var(--concrete);
--fg-dim: var(--steel-2);
--border: var(--steel);
--border-soft: #2A2A2A;
--accent: var(--volt);
--accent-fg: var(--black); /* text on volt fills */
/* ---------- Type families ---------- */
--font-display: 'Big Shoulders Stencil', 'Stardos Stencil', 'Bebas Neue', Impact, system-ui, sans-serif;
--font-condensed: 'Barlow Condensed', 'Oswald', system-ui, sans-serif;
--font-body: 'Barlow', system-ui, -apple-system, Segoe UI, sans-serif;
--font-mono: 'JetBrains Mono', ui-monospace, 'SFMono-Regular', Menlo, monospace;
/* ---------- Type scale ---------- */
/* Headlines stay HUGE and uppercase — this is a gym, not a hospital. */
--fs-display-1: clamp(64px, 9vw, 140px); /* hero, on hero only */
--fs-display-2: clamp(48px, 6vw, 96px);
--fs-h1: clamp(40px, 4.5vw, 72px);
--fs-h2: clamp(32px, 3.5vw, 52px);
--fs-h3: clamp(24px, 2.4vw, 36px);
--fs-h4: 20px;
--fs-eyebrow: 12px; /* uppercase, tracked, condensed */
--fs-lg: 18px;
--fs-body: 16px;
--fs-sm: 14px;
--fs-xs: 12px;
--lh-tight: 0.92; /* display */
--lh-snug: 1.1;
--lh-normal: 1.5;
--lh-relaxed: 1.65;
--tr-tight: -0.01em;
--tr-wide: 0.08em; /* eyebrows */
--tr-wider: 0.16em; /* stencil callouts */
/* ---------- Spacing (4px base) ---------- */
--sp-1: 4px;
--sp-2: 8px;
--sp-3: 12px;
--sp-4: 16px;
--sp-5: 24px;
--sp-6: 32px;
--sp-7: 48px;
--sp-8: 64px;
--sp-9: 96px;
--sp-10: 128px;
/* ---------- Radii ---------- */
/* Mostly hard edges. Volt is angular. Reserve rounding for chips/pills. */
--r-none: 0;
--r-sm: 2px;
--r-md: 4px;
--r-lg: 8px;
--r-pill: 999px;
/* ---------- Borders ---------- */
--bw-hairline: 1px;
--bw-bold: 2px;
--bw-stamp: 4px; /* the "stamped" left/bottom accents */
/* ---------- Shadows / glows ---------- */
--shadow-soft: 0 4px 16px rgba(0,0,0,0.4);
--shadow-hard: 0 8px 0 -2px var(--black), 0 8px 24px rgba(0,0,0,0.6);
--glow-volt: 0 0 24px rgba(201, 242, 59, 0.45),
0 0 4px rgba(201, 242, 59, 0.8);
--glow-volt-sm: 0 0 12px rgba(201, 242, 59, 0.5);
/* ---------- Motion ---------- */
--ease-out: cubic-bezier(0.16, 1, 0.3, 1);
--ease-in: cubic-bezier(0.7, 0, 0.84, 0);
--ease-snap: cubic-bezier(0.2, 0.8, 0.2, 1);
--dur-fast: 120ms;
--dur-base: 180ms;
--dur-slow: 320ms;
}
/* ---------- Base reset (opinionated, dark by default) ----- */
*, *::before, *::after { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body {
font-family: var(--font-body);
font-size: var(--fs-body);
line-height: var(--lh-normal);
color: var(--fg);
background: var(--bg);
-webkit-font-smoothing: antialiased;
text-rendering: optimizeLegibility;
}
/* ---------- Semantic element styles ----------------------- */
h1, .h1, h2, .h2, h3, .h3 {
font-family: var(--font-display);
font-weight: 700;
line-height: var(--lh-tight);
letter-spacing: var(--tr-tight);
color: var(--fg-strong);
text-transform: uppercase;
margin: 0 0 0.4em;
}
h1, .h1 { font-size: var(--fs-h1); }
h2, .h2 { font-size: var(--fs-h2); }
h3, .h3 { font-size: var(--fs-h3); }
h4, .h4 {
font-family: var(--font-condensed);
font-weight: 700;
font-size: var(--fs-h4);
text-transform: uppercase;
letter-spacing: var(--tr-wide);
color: var(--fg-strong);
margin: 0 0 0.5em;
}
.eyebrow {
font-family: var(--font-condensed);
font-weight: 600;
font-size: var(--fs-eyebrow);
text-transform: uppercase;
letter-spacing: var(--tr-wider);
color: var(--volt);
}
.display-1 { font-family: var(--font-display); font-weight: 700;
font-size: var(--fs-display-1); line-height: var(--lh-tight);
letter-spacing: var(--tr-tight); text-transform: uppercase;
color: var(--fg-strong); }
.display-2 { font-family: var(--font-display); font-weight: 700;
font-size: var(--fs-display-2); line-height: var(--lh-tight);
letter-spacing: var(--tr-tight); text-transform: uppercase;
color: var(--fg-strong); }
.stat {
font-family: var(--font-condensed);
font-weight: 900;
font-size: clamp(48px, 6vw, 96px);
line-height: 1;
letter-spacing: -0.02em;
color: var(--volt);
}
p { margin: 0 0 1em; color: var(--fg); }
a { color: var(--volt); text-decoration: none; }
a:hover { color: var(--volt-glow); text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 4px; }
code, kbd, samp, .mono {
font-family: var(--font-mono);
font-size: 0.92em;
color: var(--volt);
}
::selection { background: var(--volt); color: var(--black); }
hr {
border: 0;
border-top: var(--bw-hairline) solid var(--border);
margin: var(--sp-6) 0;
}
/* ---------- Utility classes ------------------------------- */
.u-volt { color: var(--volt); }
.u-muted { color: var(--fg-muted); }
.u-dim { color: var(--fg-dim); }
.u-strong { color: var(--fg-strong); }
.u-stencil { font-family: var(--font-display); text-transform: uppercase; letter-spacing: var(--tr-tight); }
.u-cond { font-family: var(--font-condensed); text-transform: uppercase; letter-spacing: var(--tr-wide); }
.u-glow { text-shadow: 0 0 18px rgba(201,242,59,0.55), 0 0 4px rgba(201,242,59,0.9); }
/* Repeating diagonal hazard stripes — used on promo banners */
.u-hazard {
background-image: repeating-linear-gradient(
45deg,
var(--volt) 0 14px,
var(--black) 14px 28px
);
}
/* Grit overlay — apply on hero/image sections for subtle gym texture.
Pure CSS noise via radial gradient stack. */
.u-grit {
position: relative;
}
.u-grit::after {
content: "";
position: absolute; inset: 0;
pointer-events: none;
background-image:
radial-gradient(rgba(255,255,255,0.04) 1px, transparent 1px),
radial-gradient(rgba(0,0,0,0.18) 1px, transparent 1px);
background-size: 3px 3px, 5px 5px;
background-position: 0 0, 1px 2px;
mix-blend-mode: overlay;
opacity: 0.5;
}
/* ==========================================================
Sport Center Suceava — Site (multi-page)
Foloseste ../colors_and_type.css ca foundation.
========================================================== */
html, body { background: var(--black); color: var(--fg); }
/* ---------- Layout shell ---------- */
.page { min-height: 100vh; display: flex; flex-direction: column; }
main { flex: 1; }
.container { max-width: 1280px; margin: 0 auto; padding: 0 32px; width: 100%; }
@media (max-width: 720px) {
.container { padding: 0 20px; }
.topbar { display: none; }
}
/* ---------- Top bar (small contact strip) ---------- */
.topbar {
background: var(--ink);
border-bottom: 1px solid var(--border-soft);
font-family: var(--font-mono);
font-size: 11px;
color: var(--concrete);
letter-spacing: 0.04em;
}
.topbar-inner {
max-width: 1280px; margin: 0 auto;
padding: 8px 32px;
display: flex; gap: 24px; flex-wrap: wrap; align-items: center;
}
.topbar a { color: var(--chalk); text-decoration: none; }
.topbar a:hover { color: var(--volt); }
.topbar .dot { color: var(--volt); }
.topbar .right { margin-left: auto; }
/* ---------- Nav ---------- */
.nav {
position: sticky; top: 0; z-index: 50;
background: rgba(10,10,10,0.86);
backdrop-filter: blur(12px);
-webkit-backdrop-filter: blur(12px);
border-bottom: 1px solid var(--border-soft);
}
.nav-inner {
max-width: 1280px; margin: 0 auto;
padding: 7px 32px;
display: flex; align-items: center; gap: 24px;
}
.nav-logo, .nav-logo:hover { display: inline-flex; align-items: center; gap: 12px; text-decoration: none; }
.nav-logo:hover .nav-logo-word, .nav-logo:focus .nav-logo-word { text-decoration: none; }
.nav-logo img { display: block; height: 52px; width: auto; }
.nav-logo-word {
display: flex; flex-direction: column; line-height: 0.92;
font-family: var(--font-display); font-weight: 800;
text-transform: uppercase; letter-spacing: 0.01em;
font-size: 21px; color: var(--fg-strong);
}
.nav-logo-word b { font-weight: 700; font-size: 12px; letter-spacing: 0.34em; color: var(--volt); }
@media (max-width: 420px) { .nav-logo-word { display: none; } }
.nav-links {
display: flex; gap: 4px; margin-left: auto; align-items: center;
}
.nav-links a {
font-family: var(--font-condensed); font-weight: 700; font-size: 13px;
letter-spacing: 0.14em; text-transform: uppercase;
color: var(--chalk); text-decoration: none;
padding: 10px 14px;
transition: color 120ms;
position: relative;
}
.nav-links a:hover { color: var(--volt); text-decoration: none; }
.nav-links a.active { color: var(--volt); }
.nav-links a.active::after {
content: ""; position: absolute; left: 14px; right: 14px; bottom: 2px;
height: 2px; background: var(--volt);
}
/* a.nav-cta to win specificity over .nav-links a */
.nav-links a.nav-cta,
.nav-cta {
font-family: var(--font-condensed); font-weight: 800; font-size: 13px;
letter-spacing: 0.14em; text-transform: uppercase;
background: var(--volt); color: var(--black);
padding: 11px 18px; margin-left: 8px;
display: inline-flex; align-items: center; gap: 8px;
transition: box-shadow 160ms;
}
.nav-links a.nav-cta:hover,
.nav-cta:hover { box-shadow: var(--glow-volt); color: var(--black); text-decoration: none; }
.nav-links a.nav-cta::after { display: none !important; }
.nav-burger {
display: none;
margin-left: auto;
background: transparent; border: 1px solid var(--steel);
width: 44px; height: 44px;
align-items: center; justify-content: center;
cursor: pointer;
}
.nav-burger svg { width: 22px; height: 22px; stroke: var(--chalk); }
@media (max-width: 900px) {
.nav-burger { display: inline-flex; }
.nav-links {
position: absolute; top: 100%; left: 0; right: 0;
flex-direction: column; gap: 0;
background: var(--ink); border-bottom: 1px solid var(--border-soft);
padding: 8px 0;
display: none;
}
.nav-links.open { display: flex; }
.nav-links a { padding: 14px 32px; width: 100%; box-sizing: border-box; }
.nav-links a.active::after { display: none; }
.nav-links a.active { background: rgba(201,242,59,0.08); }
.nav-cta { margin: 8px 32px 12px; justify-content: center; }
}
/* ---------- Reusable buttons ---------- */
.btn {
font-family: var(--font-condensed); font-weight: 700;
font-size: 14px; letter-spacing: 0.12em; text-transform: uppercase;
padding: 14px 24px; border: 0; cursor: pointer;
display: inline-flex; align-items: center; gap: 10px;
transition: all 120ms var(--ease-snap);
text-decoration: none;
white-space: nowrap;
}
.btn-primary { background: var(--volt); color: var(--black); }
.btn-primary:hover { box-shadow: var(--glow-volt); color: var(--black); text-decoration: none; }
.btn-primary:active { background: var(--volt-deep); }
.btn-secondary { background: transparent; color: var(--chalk); border: 2px solid var(--steel); padding: 12px 22px; }
.btn-secondary:hover { border-color: var(--volt); color: var(--volt); text-decoration: none; }
.btn-ghost { background: transparent; color: var(--volt); padding: 12px 4px; }
.btn-ghost:hover { color: var(--volt-glow); text-decoration: none; }
.btn svg { width: 16px; height: 16px; stroke-width: 2; }
/* ---------- Hero (home) ---------- */
.hero {
position: relative;
min-height: 640px;
display: flex; align-items: center;
overflow: hidden;
}
.hero-bg {
position: absolute; inset: 0;
background-image: url('https://twycwlvbufuggruuxxni.supabase.co/storage/v1/object/public/site-assets/da0362b8-0fda-4f39-ad99-6163b3813844/images/real-floor-wide.jpg');
background-size: cover; background-position: center;
filter: brightness(0.55) contrast(1.05);
}
.hero-bg::after {
content: ""; position: absolute; inset: 0;
background:
linear-gradient(180deg, rgba(10,10,10,0.4) 0%, rgba(10,10,10,0.92) 100%),
linear-gradient(90deg, rgba(10,10,10,0.85) 0%, rgba(10,10,10,0.1) 65%);
}
.hero-inner {
position: relative;
max-width: 1280px; margin: 0 auto;
padding: 110px 32px 130px;
width: 100%;
}
.hero h1 {
font-size: clamp(56px, 8vw, 132px);
line-height: 0.88;
margin: 0 0 28px;
max-width: 980px;
}
.hero h1 .accent { color: var(--volt); }
.hero .lede {
font-family: var(--font-condensed);
font-weight: 500;
font-size: clamp(18px, 1.6vw, 22px);
color: var(--chalk);
max-width: 620px;
margin: 0 0 36px;
letter-spacing: 0.02em;
}
.hero .cta-row { display: flex; gap: 16px; flex-wrap: wrap; }
.hero-stats {
position: relative;
border-top: 1px solid var(--border-soft);
background: rgba(10,10,10,0.6);
backdrop-filter: blur(6px);
}
.hero-stats-inner {
max-width: 1280px; margin: 0 auto;
padding: 24px 32px;
display: grid; grid-template-columns: repeat(4, 1fr);
gap: 32px;
}
.hero-stat { display: flex; flex-direction: column; gap: 4px; }
.hero-stat .num {
font-family: var(--font-condensed); font-weight: 900;
font-size: clamp(40px, 4vw, 56px); line-height: 1; letter-spacing: -0.02em;
color: var(--volt);
}
.hero-stat .num small { font-family: var(--font-body); font-weight: 500; font-size: 16px; color: var(--chalk); margin-left: 6px; letter-spacing: 0; }
.hero-stat .lbl {
font-family: var(--font-condensed); font-weight: 600; font-size: 11px;
letter-spacing: 0.18em; text-transform: uppercase; color: var(--concrete);
}
@media (max-width: 720px) {
.hero-stats-inner { grid-template-columns: repeat(2, 1fr); gap: 24px 16px; }
}
/* ---------- Sub-hero / page banner (service detail + interior pages) ---------- */
.pbanner {
position: relative;
min-height: 320px;
display: flex; align-items: flex-end;
overflow: hidden;
border-bottom: 4px solid var(--volt);
}
.pbanner-bg {
position: absolute; inset: 0;
background-size: cover; background-position: center;
filter: brightness(0.5) contrast(1.05);
}
.pbanner-bg.placeholder {
background:
repeating-linear-gradient(135deg, rgba(201,242,59,0.04) 0 14px, transparent 14px 28px),
linear-gradient(180deg, var(--ink-2) 0%, var(--black) 100%);
filter: none;
}
.pbanner-bg::after {
content: ""; position: absolute; inset: 0;
background: linear-gradient(180deg, rgba(10,10,10,0.2) 0%, rgba(10,10,10,0.92) 100%);
}
.pbanner-inner {
position: relative;
max-width: 1280px; margin: 0 auto;
padding: 80px 32px 36px;
width: 100%;
}
.crumbs {
font-family: var(--font-mono); font-size: 12px;
color: var(--concrete);
margin-bottom: 14px;
}
.crumbs a { color: var(--concrete); text-decoration: none; }
.crumbs a:hover { color: var(--volt); text-decoration: none; }
.crumbs .sep { margin: 0 8px; color: var(--steel-2); }
.pbanner h1 {
font-size: clamp(40px, 6vw, 88px);
line-height: 0.92;
margin: 0 0 12px;
}
.pbanner .lede {
font-family: var(--font-condensed); font-weight: 500;
font-size: clamp(16px, 1.5vw, 20px); color: var(--chalk);
max-width: 720px; margin: 0;
letter-spacing: 0.02em;
}
/* ---------- Sections ----------
Spatiere responsiva: doua sectiuni alaturate isi aduna padding-ul, deci
96px fix insemna 192px de gol intre blocuri (si pe telefon la fel). */
.section { padding: clamp(32px, 4vw, 48px) 0; }
.section.tight { padding: clamp(24px, 3vw, 36px) 0; }
.section-head { margin-bottom: clamp(24px, 3vw, 40px); }
.section-head .eyebrow { display: block; margin-bottom: 12px; }
.section-head h2 { margin: 0 0 16px; max-width: 880px; }
.section-head p { color: var(--concrete); max-width: 620px; font-size: 17px; }
/* ---------- Promo banner ---------- */
.promo {
background: var(--volt);
color: var(--black);
padding: 14px 32px;
display: flex; align-items: center; gap: 20px;
justify-content: center; flex-wrap: wrap;
font-family: var(--font-display);
font-weight: 800;
text-transform: uppercase;
font-size: 18px;
letter-spacing: 0.01em;
border-top: 4px solid var(--black);
border-bottom: 4px solid var(--black);
}
.promo .stamp {
font-family: var(--font-mono); font-weight: 500; font-size: 11px;
background: var(--black); color: var(--volt);
padding: 4px 10px; letter-spacing: 0.12em;
}
.promo a {
color: var(--black); text-decoration: underline; text-decoration-thickness: 2px;
text-underline-offset: 3px;
}
.promo a:hover { color: var(--black); }
/* ---------- Services grid (home) ---------- */
.services {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 1px;
background: var(--border-soft);
border: 1px solid var(--border-soft);
}
@media (max-width: 1000px) { .services { grid-template-columns: repeat(3, 1fr); } }
/* !important: pe /servicii, grilele au coloanele fixate în HTML (style="repeat(3, 1fr)"), care
altfel bat regulile de telefon — pagina ieșea din ecran (429 px la 390) */
@media (max-width: 720px) { .services { grid-template-columns: repeat(2, 1fr) !important; } }
@media (max-width: 440px) { .services { grid-template-columns: 1fr !important; } }
.service-card {
background: var(--ink);
padding: 24px 22px 22px;
display: flex; flex-direction: column; gap: 12px;
text-decoration: none; color: inherit;
position: relative;
transition: background 160ms;
min-height: 200px;
}
.service-card:hover { background: var(--ink-2); text-decoration: none; color: inherit; }
.service-card::after {
content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px;
background: var(--volt);
transform: scaleX(0); transform-origin: left;
transition: transform 200ms var(--ease-snap);
}
.service-card:hover::after { transform: scaleX(1); }
.service-card svg { width: 28px; height: 28px; color: var(--chalk); stroke-width: 1.75; transition: color 160ms; }
.service-card:hover svg { color: var(--volt); }
.service-card .floor {
font-family: var(--font-mono); font-size: 10px;
letter-spacing: 0.1em; text-transform: uppercase;
color: var(--volt);
}
.service-card h4 {
margin: 0;
font-family: var(--font-display); font-weight: 800;
text-transform: uppercase; color: var(--white);
font-size: 22px; line-height: 1.05;
}
.service-card p { font-size: 13px; line-height: 1.5; color: var(--concrete); margin: 0; flex: 1; }
.service-card .more {
font-family: var(--font-condensed); font-weight: 700; font-size: 11px;
letter-spacing: 0.14em; text-transform: uppercase; color: var(--volt);
display: inline-flex; align-items: center; gap: 6px; margin-top: 6px;
}
.service-card .more svg { width: 12px; height: 12px; color: var(--volt); }
/* ---------- Service detail content layout ---------- */
.detail-grid {
display: grid;
grid-template-columns: 1.4fr 1fr;
gap: 64px;
align-items: start;
}
@media (max-width: 900px) { .detail-grid { grid-template-columns: 1fr; gap: 40px; } }
.prose { color: var(--chalk); font-size: 17px; line-height: 1.65; max-width: 720px; }
.prose p { margin: 0 0 1.1em; }
.prose strong { color: var(--white); }
.prose h3 {
font-size: clamp(24px, 2.4vw, 32px);
margin: 36px 0 14px;
}
.prose ul {
list-style: none; padding: 0; margin: 0 0 1.2em;
display: flex; flex-direction: column; gap: 10px;
}
.prose ul li {
position: relative; padding-left: 28px;
}
.prose ul li::before {
content: "▌"; position: absolute; left: 0; top: 0;
color: var(--volt);
font-family: var(--font-mono);
font-size: 14px;
}
/* ---------- Info panel (sticks beside service detail) ---------- */
.infopanel {
background: var(--ink);
border: 1px solid var(--border-soft);
padding: 24px;
display: flex; flex-direction: column; gap: 18px;
position: sticky; top: 100px;
}
.infopanel h4 {
margin: 0; font-family: var(--font-condensed); font-weight: 700;
font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
color: var(--volt);
}
.info-row {
display: flex; align-items: baseline; gap: 12px;
padding: 10px 0; border-bottom: 1px solid var(--border-soft);
}
.info-row:last-child { border-bottom: 0; }
.info-row .k {
font-family: var(--font-condensed); font-weight: 600; font-size: 11px;
letter-spacing: 0.16em; text-transform: uppercase; color: var(--concrete);
width: 110px; flex-shrink: 0;
}
.info-row .v { font-family: var(--font-mono); font-size: 13px; color: var(--chalk); }
/* ---------- Image / placeholder ---------- */
.figure {
position: relative;
width: 100%;
aspect-ratio: 16 / 10;
overflow: hidden;
background: var(--ink-2);
border: 1px solid var(--border-soft);
}
.figure img { width: 100%; height: 100%; object-fit: cover; display: block; filter: brightness(0.85) contrast(1.05); }
.figure.placeholder {
background:
repeating-linear-gradient(135deg, rgba(201,242,59,0.05) 0 14px, transparent 14px 28px),
var(--ink-2);
display: flex; align-items: center; justify-content: center;
}
.figure.placeholder .lbl {
font-family: var(--font-mono); font-size: 12px;
letter-spacing: 0.16em; text-transform: uppercase;
color: var(--steel-2);
border: 1px dashed var(--steel);
padding: 14px 22px;
background: rgba(10,10,10,0.7);
}
/* ---------- Sidebar with all services (interior pages) ---------- */
.layout {
display: grid;
grid-template-columns: 260px 1fr;
gap: 48px;
padding: 56px 0 96px;
}
@media (max-width: 900px) {
.layout { grid-template-columns: 1fr; gap: 32px; padding: 40px 0 72px; }
.sidebar { order: 2; }
}
.sidebar {
align-self: start;
position: sticky; top: 100px;
background: var(--ink);
border: 1px solid var(--border-soft);
padding: 8px;
}
.sidebar h5 {
margin: 0; padding: 14px 14px 10px;
font-family: var(--font-condensed); font-weight: 700;
font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
color: var(--volt);
}
.sidebar ul { list-style: none; padding: 0; margin: 0; }
.sidebar li a {
display: flex; align-items: center; gap: 10px;
padding: 10px 14px;
color: var(--chalk); text-decoration: none;
font-family: var(--font-condensed); font-weight: 600; font-size: 13px;
letter-spacing: 0.06em;
border-left: 2px solid transparent;
transition: all 120ms;
}
.sidebar li a:hover { color: var(--volt); background: rgba(201,242,59,0.05); border-left-color: var(--steel); text-decoration: none; }
.sidebar li a.active { color: var(--volt); border-left-color: var(--volt); background: rgba(201,242,59,0.08); }
.sidebar li a svg { width: 14px; height: 14px; stroke-width: 1.75; color: currentColor; }
/* ---------- Hours panel ---------- */
.hours-card {
background: var(--ink);
border: 1px solid var(--border-soft);
padding: 24px;
}
.hours-card h4 {
margin: 0 0 14px; font-family: var(--font-condensed); font-weight: 700;
font-size: 12px; letter-spacing: 0.18em; text-transform: uppercase;
color: var(--volt);
}
.hours-row {
display: flex; justify-content: space-between; align-items: baseline;
padding: 10px 0; border-bottom: 1px solid var(--border-soft);
}
.hours-row:last-child { border-bottom: 0; }
.hours-row .day {
font-family: var(--font-condensed); font-weight: 600; font-size: 13px;
letter-spacing: 0.08em; text-transform: uppercase; color: var(--chalk);
}
.hours-row .time { font-family: var(--font-mono); font-size: 13px; color: var(--white); }
.hours-row.now {
background: rgba(201,242,59,0.06); margin: 0 -12px;
padding: 10px 12px; border-bottom-color: var(--volt-deep);
}
.hours-row.now .day { color: var(--volt); }
.hours-row.now .time::after {
content: " ● ACUM"; margin-left: 6px;
font-family: var(--font-condensed); font-weight: 700; font-size: 10px;
letter-spacing: 0.14em; color: var(--volt);
}
/* ---------- Two-up hours / contact row ---------- */
.two-up {
display: grid; grid-template-columns: 1fr 1fr; gap: 24px;
}
@media (max-width: 720px) { .two-up { grid-template-columns: 1fr; } }
/* ---------- Pricing table ---------- */
.price-group { margin-bottom: 56px; }
.price-group .head {
display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap;
border-bottom: 4px solid var(--volt); padding-bottom: 12px; margin-bottom: 18px;
}
.price-group h3 { margin: 0; font-size: clamp(24px, 2.4vw, 36px); }
.price-group .note {
font-family: var(--font-mono); font-size: 12px; color: var(--concrete);
margin-left: auto;
}
.price-table {
width: 100%;
border-collapse: collapse;
background: var(--ink);
border: 1px solid var(--border-soft);
}
.price-table thead th {
font-family: var(--font-condensed); font-weight: 700;
font-size: 11px; letter-spacing: 0.18em; text-transform: uppercase;
color: var(--concrete);
text-align: left; padding: 14px 18px;
border-bottom: 1px solid var(--border-soft);
background: var(--ink-2);
}
.price-table thead th:last-child, .price-table tbody td:last-child { text-align: right; }
.price-table tbody td {
padding: 14px 18px;
border-bottom: 1px solid var(--border-soft);
font-size: 15px;
color: var(--chalk);
}
.price-table tbody tr:last-child td { border-bottom: 0; }
.price-table .label { font-weight: 600; color: var(--white); }
.price-table .sub { color: var(--concrete); font-size: 13px; }
.price-table .price {
font-family: var(--font-condensed); font-weight: 800;
font-size: 22px; letter-spacing: -0.01em; color: var(--volt); white-space: nowrap;
}
.price-table .price small {
font-family: var(--font-body); font-weight: 500; font-size: 12px;
color: var(--concrete); margin-left: 4px; letter-spacing: 0;
}
/* ---------- Stack list (used on Despre, etc) ---------- */
.stack { display: flex; flex-direction: column; gap: 24px; }
.callout {
background: var(--ink);
border: 1px solid var(--border-soft);
border-left: 4px solid var(--volt);
padding: 24px 28px;
display: flex; flex-direction: column; gap: 8px;
}
.callout h4 { margin: 0; color: var(--white); font-size: 20px; }
.callout p { margin: 0; color: var(--chalk); }
/* ---------- Stat strip (used on detail pages) ---------- */
.statstrip {
display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px;
background: var(--border-soft); border: 1px solid var(--border-soft);
margin: 40px 0;
}
@media (max-width: 720px) { .statstrip { grid-template-columns: repeat(2, 1fr); } }
.statstrip .cell { background: var(--ink); padding: 22px 20px; }
.statstrip .num {
font-family: var(--font-condensed); font-weight: 900;
font-size: 40px; line-height: 1; color: var(--volt);
letter-spacing: -0.02em;
}
.statstrip .num small {
font-family: var(--font-body); font-weight: 500; font-size: 14px;
color: var(--chalk); margin-left: 6px; letter-spacing: 0;
}
.statstrip .lbl {
margin-top: 6px;
font-family: var(--font-condensed); font-weight: 600; font-size: 11px;
letter-spacing: 0.16em; text-transform: uppercase; color: var(--concrete);
}
/* ---------- CTA strip ---------- */
.ctastrip {
background: var(--ink);
border: 1px solid var(--border-soft);
border-top: 4px solid var(--volt);
padding: 40px 32px;
display: flex; align-items: center; gap: 24px; flex-wrap: wrap;
margin-top: 56px;
}
.ctastrip h3 { margin: 0; font-size: clamp(24px, 3vw, 40px); }
.ctastrip p { margin: 6px 0 0; color: var(--concrete); }
.ctastrip .right { margin-left: auto; display: flex; gap: 12px; flex-wrap: wrap; }
/* ---------- Related services row ---------- */
.related {
display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px;
background: var(--border-soft); border: 1px solid var(--border-soft);
margin-top: 56px;
}
@media (max-width: 720px) { .related { grid-template-columns: 1fr; } }
.related a {
background: var(--ink); padding: 22px 20px;
display: flex; flex-direction: column; gap: 8px;
text-decoration: none; color: inherit;
transition: background 160ms;
}
.related a:hover { background: var(--ink-2); text-decoration: none; }
.related .eyebrow { color: var(--volt); }
.related h5 { margin: 0; font-family: var(--font-display); font-weight: 800;
text-transform: uppercase; color: var(--white); font-size: 22px; line-height: 1.05; }
.related p { margin: 0; font-size: 13px; color: var(--concrete); }
/* ---------- Map (contact page) ---------- */
.mapwrap {
background: var(--ink-2);
border: 1px solid var(--border-soft);
aspect-ratio: 4 / 3;
position: relative;
overflow: hidden;
}
.mapwrap svg { width: 100%; height: 100%; display: block; }
/* ---------- Footer ---------- */
.footer {
background: var(--black);
border-top: 1px solid var(--border-soft);
padding: 64px 32px 28px;
margin-top: auto;
}
.footer-inner {
max-width: 1280px; margin: 0 auto;
display: grid; grid-template-columns: 2fr 1fr 1fr 1fr; gap: 48px;
}
@media (max-width: 900px) {
.footer-inner { grid-template-columns: 1fr 1fr; gap: 32px; }
}
@media (max-width: 540px) {
.footer-inner { grid-template-columns: 1fr; }
}
.footer-brand img { display: block; height: 56px; width: auto; margin-bottom: 14px; }
.footer-brand p { font-size: 14px; color: var(--concrete); max-width: 340px; }
.footer-col h5 {
font-family: var(--font-condensed); font-weight: 700; font-size: 12px;
letter-spacing: 0.16em; text-transform: uppercase; color: var(--volt);
margin: 0 0 14px;
}
.footer-col ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 8px; }
.footer-col li, .footer-col a { font-size: 14px; color: var(--concrete); text-decoration: none; }
.footer-col a:hover { color: var(--volt); text-decoration: none; }
.footer-meta {
max-width: 1280px; margin: 48px auto 0; padding-top: 24px;
border-top: 1px solid var(--border-soft);
display: flex; justify-content: space-between; align-items: center;
gap: 16px; flex-wrap: wrap;
font-family: var(--font-mono); font-size: 11px; color: var(--fg-dim);
}
/* ---------- Lightbox ---------- */
.lightbox {
position: fixed; inset: 0; z-index: 200;
background: rgba(0, 0, 0, 0.94);
display: flex; align-items: center; justify-content: center;
padding: 60px 80px;
}
.lightbox[hidden] { display: none; }
.lb-figure {
margin: 0;
max-width: 100%; max-height: 100%;
display: flex; flex-direction: column; align-items: center; gap: 14px;
}
.lb-figure img {
max-width: 100%; max-height: calc(100vh - 160px);
border: 1px solid var(--steel);
background: var(--ink);
display: block;
box-shadow: 0 20px 60px rgba(0,0,0,0.6);
}
.lb-figure figcaption {
font-family: var(--font-condensed); font-weight: 600;
font-size: 13px; letter-spacing: 0.12em; text-transform: uppercase;
color: var(--chalk);
background: var(--ink);
border: 1px solid var(--border-soft);
padding: 8px 14px;
}
.lb-close, .lb-prev, .lb-next {
position: absolute;
background: var(--ink); color: var(--chalk);
border: 1px solid var(--steel);
font-size: 28px; line-height: 1;
width: 48px; height: 48px;
display: flex; align-items: center; justify-content: center;
cursor: pointer;
font-family: var(--font-condensed); font-weight: 500;
transition: all 120ms;
}
.lb-close:hover, .lb-prev:hover, .lb-next:hover {
background: var(--volt); color: var(--black);
border-color: var(--volt);
}
.lb-close { top: 24px; right: 24px; }
.lb-prev { left: 24px; top: 50%; transform: translateY(-50%); }
.lb-next { right: 24px; top: 50%; transform: translateY(-50%); }
@media (max-width: 720px) {
.lightbox { padding: 60px 16px; }
.lb-prev { left: 16px; }
.lb-next { right: 16px; }
}
/* ---------- Gallery (home) ---------- */
.gallery {
display: grid;
grid-template-columns: repeat(4, 1fr);
grid-auto-rows: 220px;
gap: 1px;
background: var(--border-soft);
border: 1px solid var(--border-soft);
}
@media (max-width: 900px) { .gallery { grid-template-columns: repeat(2, 1fr); grid-auto-rows: 200px; } }
@media (max-width: 480px) { .gallery { grid-template-columns: 1fr; } }
.gallery .tile {
position: relative;
overflow: hidden;
background: var(--ink-2);
cursor: pointer;
display: flex; align-items: flex-end;
}
.gallery .tile.span-2 { grid-column: span 2; }
.gallery .tile.span-row-2 { grid-row: span 2; }
@media (max-width: 900px) {
.gallery .tile.span-2 { grid-column: span 2; }
.gallery .tile.span-row-2 { grid-row: span 1; }
}
@media (max-width: 480px) {
.gallery .tile.span-2 { grid-column: span 1; }
}
.gallery .tile img,
.gallery .tile video {
position: absolute; inset: 0;
width: 100%; height: 100%;
object-fit: cover;
filter: brightness(0.85) contrast(1.05);
transition: transform 320ms var(--ease-snap), filter 200ms;
}
.gallery .tile:hover img,
.gallery .tile:hover video { transform: scale(1.04); filter: brightness(1) contrast(1.08); }
.gallery .tile.placeholder {
background:
repeating-linear-gradient(135deg, rgba(201,242,59,0.05) 0 14px, transparent 14px 28px),
var(--ink-2);
display: flex; align-items: center; justify-content: center;
}
.gallery .tile.placeholder .lbl {
font-family: var(--font-mono); font-size: 11px;
letter-spacing: 0.16em; text-transform: uppercase;
color: var(--steel-2);
border: 1px dashed var(--steel);
padding: 12px 18px;
background: rgba(10,10,10,0.7);
text-align: center;
position: relative; z-index: 1;
}
.gallery .tile .caption {
position: relative; z-index: 1;
padding: 14px 18px;
width: 100%;
background: linear-gradient(180deg, rgba(10,10,10,0) 0%, rgba(10,10,10,0.85) 100%);
display: flex; align-items: center; gap: 10px;
}
.gallery .tile .caption .num {
font-family: var(--font-mono); font-size: 11px;
color: var(--volt);
letter-spacing: 0.12em;
}
.gallery .tile .caption .lbl {
font-family: var(--font-condensed); font-weight: 700;
font-size: 13px; letter-spacing: 0.1em; text-transform: uppercase;
color: var(--white);
}
.gallery .tile .play {
position: absolute; top: 12px; right: 12px; z-index: 2;
background: rgba(10,10,10,0.7); border: 1px solid var(--volt);
color: var(--volt);
width: 32px; height: 32px;
display: flex; align-items: center; justify-content: center;
font-family: var(--font-mono); font-size: 11px;
letter-spacing: 0.08em;
}
/* ---------- Helpers ---------- */
.lead { font-size: 19px; color: var(--chalk); max-width: 720px; line-height: 1.6; }
.kv-list {
display: grid; grid-template-columns: max-content 1fr; gap: 10px 24px;
font-family: var(--font-mono); font-size: 14px;
}
.kv-list dt {
font-family: var(--font-condensed); font-weight: 600; font-size: 11px;
letter-spacing: 0.16em; text-transform: uppercase; color: var(--concrete);
padding-top: 3px;
}
.kv-list dd { margin: 0; color: var(--chalk); }
.kv-list a { color: var(--chalk); text-decoration: none; border-bottom: 1px solid var(--steel); }
.kv-list a:hover { color: var(--volt); border-bottom-color: var(--volt); }
.tag {
display: inline-flex; align-items: center; gap: 6px;
background: var(--ink-2); border: 1px solid var(--steel);
font-family: var(--font-condensed); font-weight: 600; font-size: 11px;
letter-spacing: 0.14em; text-transform: uppercase;
color: var(--chalk); padding: 6px 12px;
}
.tag.volt { color: var(--volt); border-color: var(--volt-deep); }
/* Section heading marker */
.eyebrow-mark { display: inline-block; }
.eyebrow-mark::before { content: "▌ "; color: var(--volt); }
/* ==========================================================
Forms (contact + booking)
========================================================== */
.form-grid {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 18px 20px;
}
.form-grid .full { grid-column: 1 / -1; }
@media (max-width: 720px) { .form-grid { grid-template-columns: 1fr; } }
.field { display: flex; flex-direction: column; gap: 6px; }
.field label {
font-family: var(--font-condensed); font-weight: 700; font-size: 11px;
letter-spacing: 0.16em; text-transform: uppercase; color: var(--concrete);
}
.field label .req { color: var(--volt); margin-left: 4px; }
.field input[type="text"],
.field input[type="email"],
.field input[type="tel"],
.field input[type="date"],
.field select,
.field textarea {
font-family: var(--font-body); font-size: 15px;
background: var(--ink-3); color: var(--white);
border: 1px solid var(--steel);
padding: 13px 14px;
width: 100%; box-sizing: border-box;
transition: border-color 120ms, box-shadow 120ms;
-webkit-appearance: none; appearance: none;
border-radius: 0;
}
.field textarea { min-height: 140px; resize: vertical; line-height: 1.5; }
.field input:focus,
.field select:focus,
.field textarea:focus {
outline: 0; border-color: var(--volt);
box-shadow: 0 0 0 3px rgba(201,242,59,0.18);
}
.field input::placeholder,
.field textarea::placeholder { color: var(--steel-2); }
.field select {
background-image: linear-gradient(45deg, transparent 50%, var(--chalk) 50%),
linear-gradient(135deg, var(--chalk) 50%, transparent 50%);
background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%;
background-size: 5px 5px, 5px 5px;
background-repeat: no-repeat;
padding-right: 36px;
}
.field .hint {
font-family: var(--font-mono); font-size: 11px; color: var(--steel-2);
letter-spacing: 0.04em;
}
.field.error input, .field.error textarea, .field.error select { border-color: var(--danger); }
.field .error-msg {
font-family: var(--font-condensed); font-weight: 600; font-size: 12px;
color: var(--danger); letter-spacing: 0.04em;
}
/* Honeypot field — hidden from humans, catches bots */
.hp-field { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
/* atributul hidden trebuie să învingă display din reguli de clasă */
[hidden] { display: none !important; }
.form-success {
background: rgba(201,242,59,0.08);
border: 1px solid var(--volt-deep);
border-left: 4px solid var(--volt);
padding: 24px 28px;
display: flex; flex-direction: column; gap: 8px;
}
.form-success h4 { margin: 0; color: var(--volt); font-size: 20px; }
.form-success p { margin: 0; color: var(--chalk); }
.form-error {
background: rgba(229,57,74,0.08);
border: 1px solid var(--danger);
border-left: 4px solid var(--danger);
padding: 16px 20px;
color: var(--chalk);
}
/* Required-fields legend */
.form-legend {
font-family: var(--font-mono); font-size: 11px;
color: var(--concrete); letter-spacing: 0.06em;
margin: 0 0 18px;
}
.form-legend .req { color: var(--volt); }
/* ==========================================================
Team / coach cards
========================================================== */
.team-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1px;
background: var(--border-soft);
border: 1px solid var(--border-soft);
}
@media (max-width: 900px) { .team-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 540px) { .team-grid { grid-template-columns: 1fr; } }
.coach {
background: var(--ink);
display: flex; flex-direction: column;
position: relative;
}
.coach .photo {
aspect-ratio: 4 / 5;
overflow: hidden;
background:
repeating-linear-gradient(135deg, rgba(201,242,59,0.05) 0 14px, transparent 14px 28px),
var(--ink-2);
position: relative;
}
.coach .photo img {
width: 100%; height: 100%; object-fit: cover;
filter: brightness(0.85) contrast(1.05) saturate(0.9);
transition: filter 200ms, transform 320ms var(--ease-snap);
}
.coach:hover .photo img { filter: brightness(1) contrast(1.08) saturate(1); transform: scale(1.03); }
.coach .photo-placeholder {
position: absolute; inset: 0;
display: flex; align-items: center; justify-content: center;
}
.coach .photo-placeholder .lbl {
font-family: var(--font-mono); font-size: 11px;
letter-spacing: 0.16em; text-transform: uppercase;
color: var(--steel-2);
border: 1px dashed var(--steel);
padding: 10px 16px;
}
.coach .body { padding: 20px 22px 22px; display: flex; flex-direction: column; gap: 8px; }
.coach .role {
font-family: var(--font-condensed); font-weight: 700; font-size: 11px;
letter-spacing: 0.18em; text-transform: uppercase; color: var(--volt);
}
.coach h4 {
margin: 0;
font-family: var(--font-display); font-weight: 800;
font-size: 24px; line-height: 1.05; color: var(--white);
text-transform: uppercase;
}
.coach p { margin: 4px 0 0; font-size: 14px; line-height: 1.55; color: var(--concrete); }
.coach .meta {
display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px;
}
/* ==========================================================
Map embed
========================================================== */
.map-embed {
background: var(--ink-2);
border: 1px solid var(--border-soft);
aspect-ratio: 16 / 11;
overflow: hidden;
position: relative;
}
.map-embed iframe { width: 100%; height: 100%; border: 0; display: block; filter: invert(0.9) hue-rotate(180deg) brightness(0.95) contrast(0.95); }
.map-embed::after {
content: ""; position: absolute; inset: 0; pointer-events: none;
background: linear-gradient(180deg, rgba(10,10,10,0.06) 0%, rgba(10,10,10,0.18) 100%);
}
/* ==========================================================
Contact methods grid
========================================================== */
.contact-methods {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 1px;
background: var(--border-soft);
border: 1px solid var(--border-soft);
}
@media (max-width: 720px) { .contact-methods { grid-template-columns: 1fr; } }
.contact-methods .method {
background: var(--ink);
padding: 24px 22px;
display: flex; flex-direction: column; gap: 8px;
text-decoration: none; color: inherit;
transition: background 160ms;
}
.contact-methods .method:hover { background: var(--ink-2); text-decoration: none; }
.contact-methods .method svg { width: 22px; height: 22px; color: var(--volt); stroke-width: 1.75; }
.contact-methods .method .k {
font-family: var(--font-condensed); font-weight: 700; font-size: 11px;
letter-spacing: 0.18em; text-transform: uppercase; color: var(--concrete);
}
.contact-methods .method .v {
font-family: var(--font-display); font-weight: 700; font-size: 22px;
letter-spacing: -0.005em; color: var(--white); line-height: 1.1;
}
.contact-methods .method .sub {
font-family: var(--font-mono); font-size: 11px; color: var(--steel-2);
letter-spacing: 0.04em;
}
/* ==========================================================
Story / split content (despre page)
========================================================== */
.story-split {
display: grid;
grid-template-columns: 1fr 1fr;
gap: 64px;
align-items: center;
}
@media (max-width: 900px) { .story-split { grid-template-columns: 1fr; gap: 40px; } }
.story-split .figure { aspect-ratio: 4 / 5; }
.story-split.right .figure { order: 2; }
@media (max-width: 900px) { .story-split.right .figure { order: 0; } }
/* ==========================================================
Skip link (a11y)
========================================================== */
.skip-link {
position: absolute; left: -9999px; top: 0;
background: var(--volt); color: var(--black);
padding: 12px 18px;
font-family: var(--font-condensed); font-weight: 700;
letter-spacing: 0.14em; text-transform: uppercase;
z-index: 1000;
}
.skip-link:focus { left: 0; }
/* ==========================================================
Partners / trust strip — sigle parteneri suplimente
========================================================== */
.partners-strip {
background: var(--ink);
border-top: 1px solid var(--border-soft);
border-bottom: 1px solid var(--border-soft);
padding: 48px 0;
}
.partners-strip .container {
display: flex;
flex-direction: column;
align-items: center;
gap: 28px;
}
.partners-strip .eyebrow {
text-align: center;
}
.partners-strip h3 {
margin: 0;
font-family: var(--font-condensed);
font-weight: 600;
font-size: clamp(14px, 1.4vw, 18px);
letter-spacing: 0.08em;
text-transform: uppercase;
color: var(--concrete);
text-align: center;
}
.partners-grid {
display: grid;
grid-template-columns: repeat(4, 1fr);
gap: 24px 32px;
align-items: center;
justify-items: center;
width: 100%;
max-width: 1100px;
}
@media (max-width: 900px) { .partners-grid { grid-template-columns: repeat(3, 1fr); gap: 20px 24px; } }
@media (max-width: 600px) { .partners-grid { grid-template-columns: repeat(2, 1fr); gap: 18px; } }
.partners-grid .partner {
/* Slot fix uniform pentru toate logo-urile */
display: flex; align-items: center; justify-content: center;
width: 100%;
height: 80px;
padding: 8px 14px;
box-sizing: border-box;
opacity: 0.78;
transition: opacity 200ms var(--ease-snap), transform 200ms;
overflow: hidden;
}
.partners-grid .partner:hover {
opacity: 1;
transform: translateY(-2px);
}
.partners-grid .partner img {
/* CRITIC: width + height 100% cu object-fit:contain forteaza scaling-ul,
altfel browserul ignora max-height in favoarea aspect-ratio si umfla imaginea */
width: 100%;
height: 100%;
max-width: 200px;
object-fit: contain;
display: block;
}
/* Logo-uri pe fundal alb/luminos: invertim ca să fie pe negru */
.partners-grid .partner.invert img {
filter: invert(1) brightness(1.0) contrast(0.95);
}
/* Logo-uri colorate (sau text alb default) — afișate as-is, doar boost contrast */
.partners-grid .partner.native img {
filter: brightness(1.1) contrast(1.05);
}
/* ==========================================================
FAQ (AEO accordion) — native
========================================================== */
.faq { max-width: 860px; display: flex; flex-direction: column; gap: 12px; }
.faq-item {
background: var(--ink); border: 1px solid var(--border-soft);
border-radius: 10px; overflow: hidden;
}
.faq-item summary {
list-style: none; cursor: pointer; padding: 20px 22px;
font-family: var(--font-condensed); font-weight: 700;
font-size: clamp(17px, 1.6vw, 20px); color: var(--fg-strong);
letter-spacing: 0.01em; display: flex; align-items: center; justify-content: space-between; gap: 16px;
transition: color 0.15s ease;
}
.faq-item summary::-webkit-details-marker { display: none; }
.faq-item summary::after {
content: "+"; font-family: var(--font-mono); font-size: 24px; line-height: 1;
color: var(--volt); flex: 0 0 auto; transition: transform 0.2s ease;
}
.faq-item[open] summary::after { content: "−"; }
.faq-item summary:hover { color: var(--volt); }
.faq-item:focus-within { border-color: var(--volt); }
.faq-a { padding: 0 22px 20px; }
.faq-a p { margin: 0; color: var(--concrete); font-size: 15px; line-height: 1.65; }
.faq-a a { color: var(--volt); }
/* ==========================================================
Program clase (schedule)
========================================================== */
.schedule { display: flex; flex-direction: column; gap: 2px; border: 1px solid var(--border-soft); border-radius: 12px; overflow: hidden; margin-top: 24px; }
.sched-day { display: grid; grid-template-columns: 130px 1fr; gap: 16px; padding: 16px 20px; background: var(--ink); align-items: center; }
.sched-day:nth-child(even) { background: var(--ink-2); }
.sd-day { font-family: var(--font-display); font-weight: 800; text-transform: uppercase; font-size: 21px; letter-spacing: 0.02em; color: var(--volt); }
.sd-classes { display: flex; flex-wrap: wrap; gap: 10px; }
.sd-cls {
background: var(--ink-3); border: 1px solid var(--border-soft); border-radius: 8px;
padding: 8px 13px; font-family: var(--font-condensed); font-weight: 600; font-size: 15px;
color: var(--chalk); letter-spacing: 0.01em; white-space: nowrap;
}
.sd-cls b { color: var(--volt); font-weight: 700; margin-right: 5px; }
.sd-cls em { color: var(--concrete); font-style: normal; font-size: 12.5px; }
@media (max-width: 600px) {
.sched-day { grid-template-columns: 1fr; gap: 10px; padding: 14px 16px; }
.sd-cls { white-space: normal; }
}
/* ==========================================================
Footer legal links + Cookie banner
========================================================== */
.footer-legal { display: flex; flex-wrap: wrap; gap: 14px; }
.footer-legal a { color: var(--fg-dim); text-decoration: none; }
.footer-legal a:hover { color: var(--volt); }
.cookie-banner {
position: fixed; left: 16px; right: 16px; bottom: 16px; z-index: 300;
max-width: 760px; margin: 0 auto;
background: var(--ink-2); border: 1px solid var(--border); border-radius: 12px;
padding: 18px 20px; display: flex; gap: 18px; align-items: center; flex-wrap: wrap;
box-shadow: 0 12px 44px rgba(0,0,0,0.55);
}
.cookie-banner p { margin: 0; flex: 1; min-width: 240px; font-size: 13px; color: var(--concrete); line-height: 1.55; }
.cookie-banner a { color: var(--volt); }
.cookie-banner .btn { white-space: nowrap; }
@media (max-width: 520px) { .cookie-banner { flex-direction: column; align-items: stretch; left: 10px; right: 10px; bottom: 10px; } }
/* ==========================================================
Print
========================================================== */
@media print {
.nav, .topbar, .footer, .promo, .nav-burger, .skip-link { display: none !important; }
body { background: white; color: black; }
.pbanner-bg { display: none; }
a { color: black; text-decoration: underline; }
}
/* ==========================================================
Blog / Noutăți
========================================================== */
.blog-grid {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
gap: 28px;
}
.blog-card {
display: flex; flex-direction: column;
background: var(--ink);
border: 1px solid var(--border-soft);
border-radius: 4px;
overflow: hidden;
text-decoration: none; color: inherit;
transition: background .2s ease, border-color .2s ease, transform .2s ease;
}
.blog-card:hover { background: var(--ink-2); border-color: var(--volt); text-decoration: none; color: inherit; transform: translateY(-3px); }
.blog-card-media { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--black); }
.blog-card-media img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .4s ease; }
.blog-card:hover .blog-card-media img { transform: scale(1.04); }
.blog-card-tag {
position: absolute; top: 12px; left: 12px;
font-family: var(--font-mono); font-size: 10px; font-weight: 600;
letter-spacing: 0.14em; text-transform: uppercase;
background: var(--volt); color: var(--black);
padding: 5px 9px; border-radius: 3px;
}
.blog-card-body { padding: 20px 22px 24px; display: flex; flex-direction: column; gap: 10px; flex: 1; }
.blog-card-date { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.1em; text-transform: uppercase; color: var(--concrete); }
.blog-card-body h3 { font-family: var(--font-display); font-weight: 800; font-size: 20px; line-height: 1.2; margin: 0; }
.blog-card-body p { font-size: 14px; line-height: 1.55; color: var(--concrete); margin: 0; flex: 1; }
.blog-card-more { font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--volt); display: inline-flex; align-items: center; gap: 6px; margin-top: 4px; }
/* Article (post) */
.post-meta {
display: flex; flex-wrap: wrap; gap: 8px 18px; align-items: center;
font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.06em;
color: var(--concrete); margin: 0 0 28px;
}
.post-meta .sep { color: var(--border-soft); }
.post-lead { font-size: 20px; line-height: 1.55; color: var(--chalk); margin: 0 0 28px; }
.post-source {
margin-top: 40px; padding: 16px 20px;
background: var(--ink); border: 1px solid var(--border-soft); border-left: 4px solid var(--volt);
border-radius: 4px;
font-family: var(--font-mono); font-size: 12px; line-height: 1.6; color: var(--concrete);
}
.post-source a { color: var(--volt); }
.medal-stats {
display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px;
margin: 32px 0;
}
.medal-stat {
background: var(--ink); border: 1px solid var(--border-soft); border-radius: 4px;
padding: 20px 14px; text-align: center;
}
.medal-stat .num { display: block; font-family: var(--font-display); font-weight: 800; font-size: 38px; line-height: 1; color: var(--volt); }
.medal-stat .lbl { display: block; margin-top: 8px; font-family: var(--font-mono); font-size: 10px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--concrete); }
@media (max-width: 560px) { .medal-stats { grid-template-columns: repeat(2, 1fr); } }
/* ============================================================
RECENZII GOOGLE (#recenzii) — js/reviews.js + reviews.php
============================================================ */
.rv-top {
display: flex; align-items: center; justify-content: space-between;
gap: 24px; flex-wrap: wrap; margin-bottom: 32px;
}
.rv-summary {
display: flex; align-items: center; gap: 18px;
background: var(--ink); border: 1px solid var(--border-soft);
border-left: 4px solid var(--volt); border-radius: 4px;
padding: 16px 24px;
}
.rv-score {
font-family: var(--font-display); font-weight: 800; font-size: 52px;
line-height: 1; color: var(--volt);
}
.rv-meta { display: flex; flex-direction: column; gap: 4px; }
.rv-count {
font-family: var(--font-mono); font-size: 11px; letter-spacing: 0.12em;
text-transform: uppercase; color: var(--concrete);
}
.rv-stars { display: inline-flex; gap: 2px; font-size: 16px; line-height: 1; }
.rv-star { color: var(--steel); }
.rv-star.is-on { color: var(--volt); }
.rv-actions { display: flex; gap: 12px; flex-wrap: wrap; }
.rv-grid {
display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px;
}
.rv-card {
background: var(--ink); border: 1px solid var(--border-soft); border-radius: 4px;
padding: 24px; display: flex; flex-direction: column; gap: 14px;
}
.rv-head { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 12px; }
.rv-avatar {
width: 42px; height: 42px; border-radius: 50%; overflow: hidden;
background: var(--ink-3); border: 1px solid var(--border-soft);
display: flex; align-items: center; justify-content: center;
font-family: var(--font-condensed); font-weight: 700; font-size: 15px;
letter-spacing: 0.04em; color: var(--volt); flex-shrink: 0;
}
.rv-avatar img { width: 100%; height: 100%; object-fit: cover; }
.rv-who { display: flex; flex-direction: column; min-width: 0; }
.rv-name {
font-family: var(--font-condensed); font-weight: 600; font-size: 17px;
color: var(--fg-strong); line-height: 1.2;
overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.rv-when {
font-family: var(--font-mono); font-size: 11px; color: var(--steel-2);
letter-spacing: 0.04em;
}
.rv-text { margin: 0; font-size: 15px; line-height: 1.6; color: var(--chalk); }
.rv-more {
background: none; border: 0; padding: 0; cursor: pointer;
font-family: var(--font-mono); font-size: 12px; letter-spacing: 0.06em;
color: var(--volt); text-decoration: underline;
}
.rv-note {
margin: 24px 0 0; font-family: var(--font-mono); font-size: 11px;
letter-spacing: 0.06em; color: var(--steel-2);
}
.rv-note a { color: var(--concrete); }
@media (max-width: 980px) { .rv-grid { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 640px) {
.rv-grid { grid-template-columns: 1fr; }
.rv-top { flex-direction: column; align-items: stretch; }
.rv-actions .btn { flex: 1; justify-content: center; }
}