/* ===================================================================
   ORHIDEEA SPA — brand.css  (layers on top of Bootstrap 5.3)
   =================================================================== */

/* ---------- @font-face : self-hosted brand fonts (public/fonts) ---------- */
@font-face {
    font-family: "Brandon Grotesque Light";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src:
        local("Brandon Grotesque Light"),
        url("/fonts/brandon-grotesque-light.woff") format("woff");
}
@font-face {
    font-family: "Brandon Grotesque Black";
    font-style: normal;
    font-weight: 400;
    font-display: swap;
    src:
        local("Brandon Grotesque Black"),
        url("/fonts/brandon-grotesque-black.woff") format("woff");
}
@font-face {
    font-family: "Bentosa";
    font-display: swap;
    src: url("/fonts/bentosa.ttf") format("truetype");
}

/* ---------- Design tokens ---------- */
:root {
    --brand: #d1aa67;
    --gold: #d1aa67;
    --gold-alt: #d1aa66;
    --gold-2: #d8af6a;
    --gold-soft: #c0a16b;
    --gold-ink: #a07a33; /* readable gold for small text/links on white (contrast) */
    --gold-deep: #8f6b28; /* darkest, for hover/underlines */

    --dark: #1f1f1f;
    --near-black: #111;
    --black: #000;
    --ink: #222;

    --body-text: #333;
    --body-text-soft: #40464d;
    --muted: #777;
    --muted-2: #666;
    --muted-3: #999;
    --muted-4: #a1a1a1;
    --top-contact: #a4a4a4;

    --white: #fff;
    --bg-light: #f5f5f5;
    --bg-light-2: #f0f0f0;
    --bg-light-3: #eee;
    --border: #f0f0f0;
    --border-light: #ddd;
    --topbar-border: #2a2a2a;

    --price-green: #77a464;
    --strike: #111;

    --font-body: "Open Sans", Helvetica, Arial, sans-serif;
    --font-head: "Raleway", Helvetica, Arial, sans-serif;
    --font-script: "Great Vibes", "Bentosa", cursive;

    --shadow-card: 0 6px 22px rgba(31, 31, 31, 0.1);
    --shadow-lift: 0 14px 32px rgba(31, 31, 31, 0.16);
    --section-pad: 96px;
    --letter: 1px;

    /* spacing scale */
    --sp-1: 8px;
    --sp-2: 16px;
    --sp-3: 24px;
    --sp-4: 40px;
    --sp-5: 64px;
    --sp-6: 96px;
}

:root {
    --bs-primary: #d1aa67;
    --bs-primary-rgb: 209, 170, 103;
    --bs-body-font-family: var(--font-body);
    --bs-body-color: #333;
    --bs-body-font-size: 0.95rem;
    --bs-border-radius: 0;
    --bs-border-radius-sm: 0;
    --bs-border-radius-lg: 0;
    --bs-link-color: #d1aa67;
    --bs-link-hover-color: #b8924f;
}

@media (min-width: 1200px) {
    .container,
    .container-lg,
    .container-md,
    .container-sm,
    .container-xl {
        max-width: 1170px;
    }
}

/* ---------- Base ---------- */
body {
    font-family: var(--font-body);
    color: var(--body-text);
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    font-family: var(--font-head);
}
h1,
h2,
.page-title,
.display-5,
.display-6 {
    font-weight: 300;
    color: var(--dark);
}
h3 {
    font-weight: 400;
    line-height: 1.4;
    color: var(--dark);
}
a {
    text-decoration: none;
}
a:hover {
    color: var(--gold);
}

/* ---------- Type scale ---------- */
.fs-hero {
    font-size: clamp(34px, 4.4vw, 63px);
    font-weight: 300;
    line-height: 1.12;
}
.fs-h2 {
    font-size: clamp(26px, 3vw, 36px);
    font-weight: 300;
}
.fs-lead {
    font-size: 1.05rem;
    color: var(--body-text-soft);
}
.eyebrow {
    font-family: var(--font-head);
    font-size: 12px;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    color: var(--gold);
}
.script-heading {
    font-family: var(--font-script);
    font-weight: 400;
    font-size: clamp(38px, 5vw, 58px);
    color: var(--gold-alt);
    text-align: center;
    line-height: 1.1;
}
.text-brand {
    color: var(--brand) !important;
}
.bg-dark-spa {
    background: var(--dark) !important;
}
.bg-near-black {
    background: var(--near-black) !important;
}
.text-muted-spa {
    color: var(--muted) !important;
}
.price-amount {
    color: var(--gold-2);
    font-family: var(--font-head);
    font-weight: 700;
}
.price-old {
    color: var(--strike);
    text-decoration: line-through;
    opacity: 0.7;
    margin-right: 0.4rem;
}

/* ---------- Buttons ---------- */
.btn-brand {
    --bs-btn-color: #111;
    --bs-btn-bg: #d1aa67;
    --bs-btn-border-color: #d1aa67;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #d1aa66;
    --bs-btn-hover-border-color: #d1aa66;
    --bs-btn-active-bg: #c79f57;
    --bs-btn-active-border-color: #c79f57;
    font-family: var(--font-head);
    font-weight: 600;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    border-radius: 0;
    padding: 14px 22px;
    line-height: 1.4;
    transition: all 0.3s;
}
.btn-brand.btn-lg {
    padding: 18px 30px;
}
.btn-brand.btn-sm {
    padding: 9px 14px;
    font-size: 11px;
}

.btn-brand-dark {
    --bs-btn-color: #d1aa67;
    --bs-btn-bg: #1f1f1f;
    --bs-btn-border-color: #1f1f1f;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #000;
    --bs-btn-hover-border-color: #000;
    font-family: var(--font-head);
    font-weight: 700;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    border-radius: 0;
    padding: 14px 22px;
    transition: all 0.3s;
}

.btn-outline-brand {
    --bs-btn-color: #111;
    --bs-btn-border-color: #d1aa67;
    --bs-btn-bg: transparent;
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: #d1aa67;
    --bs-btn-hover-border-color: #d1aa67;
    /* Starea activa TREBUIE definita, nu doar cea de hover: regula .btn.active din
     Bootstrap vine DUPA .btn:hover si ii suprascrie fundalul cu variabilele astea.
     Nedefinite, fundalul devine transparent, iar textul ramane alb de la regula de
     mai jos — butonul activ dispare complet cand treci cu mouse-ul peste el. */
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: #d1aa67;
    --bs-btn-active-border-color: #d1aa67;
    font-family: var(--font-head);
    font-weight: 400;
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    border-width: 2px;
    border-radius: 2px;
    padding: 12px 20px;
    transition: all 0.3s;
}
.btn-outline-brand:hover {
    color: #fff;
}

.link-detail {
    font-family: var(--font-head);
    font-size: 12px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    color: #111;
}
.link-detail::after {
    content: "\2192";
    margin-left: 0.5rem;
    color: var(--gold);
    transition: transform 0.3s;
    display: inline-block;
}
.link-detail:hover {
    color: var(--gold);
}
.link-detail:hover::after {
    transform: translateX(4px);
}

/* ---------- Section spacing ---------- */
.section {
    padding-top: var(--section-pad);
    padding-bottom: var(--section-pad);
}
.section-sm {
    padding-top: 40px;
    padding-bottom: 40px;
}
.section-light {
    background: var(--bg-light);
}
.section-tight {
    padding-top: 30px;
    padding-bottom: 30px;
}
@media (max-width: 767.98px) {
    .section {
        padding-top: 36px;
        padding-bottom: 36px;
    }
}

/* ---------- Section heading ---------- */
.section-heading {
    position: relative;
    text-align: center;
    margin: 64px 0 40px;
}
.section-heading::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    border-top: 1px solid #000;
    z-index: 0;
}
.section-heading .main-heading {
    position: relative;
    z-index: 1;
    display: inline-block;
    background: #fff;
    padding: 0 45px;
    margin: 0;
    font-family: var(--font-head);
    font-size: 26px;
    font-weight: 600;
    line-height: 30px;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    color: var(--dark);
}
.section-heading.on-light .main-heading {
    background: var(--bg-light);
}
.section-heading .sub {
    display: block;
    margin-top: 18px;
    font-family: var(--font-body);
    font-weight: 400;
    font-size: 1rem;
    color: var(--body-text-soft);
    text-transform: none;
    letter-spacing: 0;
}

/* ---------- Card (service / product) ---------- */
.spa-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    background: #fff;
    border: 2px solid transparent;
    border-radius: 0;
    padding: 15px;
    transition:
        border-color 0.3s,
        box-shadow 0.3s;
}
.spa-card:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-card);
}
.spa-card .spa-card-media {
    position: relative;
}
.spa-card .spa-card-img {
    position: relative;
    overflow: hidden;
    display: block;
}
.spa-card .spa-card-img img {
    width: 100%;
    height: 239px;
    object-fit: cover;
    display: block;
    transition: transform 0.5s;
}
.spa-card:hover .spa-card-img img {
    transform: scale(1.04);
}
.spa-card .spa-card-wishlist {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 2;
}
.spa-card .spa-title {
    font-family: var(--font-head);
    font-size: 15px;
    font-weight: 700;
    text-transform: uppercase;
    color: #111;
    line-height: 1.35;
    min-height: 42px;
    margin: 16px 0 8px;
}
.spa-card .spa-title a {
    color: #111;
}
.spa-card .spa-title a:hover {
    color: var(--gold);
}
.spa-card .spa-duration {
    font-size: 12px;
    color: #a3a3a3;
    margin-bottom: 10px;
}
.spa-card .spa-duration i {
    color: var(--gold);
    margin-right: 6px;
}
.spa-card .spa-cat {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--gold);
    margin-bottom: 6px;
}
/* Descrierea scurta de pe card: se vede INTREAGA, cum e scrisa in panou
   (Catalin, 23 sept. 2026) — nu mai e taiata la sase randuri. */
.spa-card .spa-desc {
    font-size: 13px;
    line-height: 1.5;
    color: #8c8c8c;
    margin: 0 0 12px;
}
.spa-card .spa-desc p { margin: 0 0 8px; }
.spa-card .spa-desc p:last-child { margin-bottom: 0; }
/* Listele scrise in descriere primesc buline aurii, ca pe site-ul vechi
   (pct. 21) — aceleasi ca `.bulete-produs` de pe pagina terapiei. */
.spa-card .spa-desc ul,
.spa-desc ul {
    list-style: none;
    padding: 0;
    margin: 0 0 8px;
}
.spa-card .spa-desc li,
.spa-desc li {
    position: relative;
    padding: 2px 0 2px 18px;
    line-height: 1.5;
}
.spa-card .spa-desc li::before,
.spa-desc li::before {
    content: "";
    position: absolute;
    left: 2px;
    top: 10px;
    width: 5px;
    height: 5px;
    background: var(--gold);
    border-radius: 50%;
}
.spa-card .spa-foot {
    margin-top: auto;
    padding-top: 8px;
}
/* Produs cu variante */
.variante {
    display: flex;
    gap: 10px;
    flex-wrap: wrap;
}
.variante .varianta {
    cursor: pointer;
}
.variante .varianta input {
    position: absolute;
    opacity: 0;
}
.variante .varianta span {
    display: block;
    border: 1px solid var(--border);
    padding: 10px 16px;
    min-width: 104px;
    text-align: center;
    transition:
        border-color 0.15s,
        background 0.15s;
}
.variante .varianta span small {
    color: #888;
}
.variante .varianta input:checked + span {
    border-color: var(--gold);
    background: #fbf7ef;
}
.variante .varianta input:focus-visible + span {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}
/* Filtre catalog */
.filter-title {
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    font-weight: 700;
    color: #777;
    margin-bottom: 10px;
}
.filter-tree .form-check,
#filters-panel .form-check {
    margin-bottom: 4px;
}
#filters-panel .form-check-input:checked {
    background-color: var(--gold);
    border-color: var(--gold);
}
#filters-panel .form-check-label {
    font-size: 14px;
    cursor: pointer;
}
/* Blog */
.blog-card .blog-excerpt {
    font-size: 14px;
    color: #666;
    margin-bottom: 12px;
}
.blog-card .spa-title {
    font-size: 17px;
}
.blog-cover {
    width: 100%;
    max-height: 480px;
    object-fit: cover;
    display: block;
}
.blog-body img {
    max-width: 100%;
    height: auto;
}
.blog-body h2,
.blog-body h3 {
    font-family: var(--font-head);
    font-weight: 400;
    margin-top: 1.6em;
}
.spa-card .spa-price {
    font-family: var(--font-head);
    font-weight: 700;
    font-size: 18px;
    color: var(--gold-2);
}

.btn-cart {
    position: relative;
    width: 100%;
    text-align: left;
    padding-right: 54px;
}
.btn-cart i {
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%);
}

/* ---------- Category tile ---------- */
.cat-tile {
    text-align: center;
}
.cat-tile .cat-img {
    position: relative;
    overflow: hidden;
    display: block;
}
.cat-tile .cat-img img {
    width: 100%;
    aspect-ratio: 1/1;
    object-fit: cover;
    display: block;
    transition: transform 0.5s;
}
.cat-tile:hover .cat-img img {
    transform: scale(1.05);
}
.cat-tile .cat-title {
    display: block;
    font-family: var(--font-head);
    font-size: 14px;
    font-weight: 600;
    color: #868686;
    margin: 22px 0 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}
.cat-tile:hover .cat-title {
    color: var(--gold);
}
.cat-tile .cat-text {
    font-size: 13px;
    color: var(--muted);
    line-height: 1.5;
    margin-bottom: 14px;
}

/* Facility tile */
.facility-tile {
    position: relative;
    overflow: hidden;
}
.facility-tile img {
    width: 100%;
    height: 300px;
    object-fit: cover;
    display: block;
}
.facility-tile .overlay {
    position: absolute;
    inset: 0;
    padding: 35px;
    color: #fff;
    background: rgba(34, 34, 34, 0.9);
    transform: translateY(100%);
    transition: transform 0.35s;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.facility-tile:hover .overlay {
    transform: translateY(0);
}
.facility-tile .facility-label {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    padding: 16px 20px;
    background: linear-gradient(transparent, rgba(0, 0, 0, 0.75));
    color: #fff;
    font-family: var(--font-head);
    text-transform: uppercase;
    letter-spacing: 0.5px;
    font-size: 14px;
}
.facility-tile .facility-title {
    font-family: var(--font-head);
    font-size: 17px;
    color: #fff;
    margin-bottom: 10px;
}

/* ---------- Hero ---------- */
.hero {
    position: relative;
    width: 100%;
    background: #1f1f1f;
    overflow: hidden;
}
.hero-slide {
    display: block;
    width: 100%;
}
.hero-slide img {
    width: 100%;
    height: auto;
    display: block;
}
.hero-band {
    position: relative;
    min-height: 460px;
    display: flex;
    align-items: center;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}
.hero-band::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.45);
}
.hero-band .hero-inner {
    position: relative;
    z-index: 2;
    color: #fff;
}
.hero-band h1 {
    color: #fff;
    font-weight: 300;
}
.header-full {
    width: 100%;
    height: 380px;
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;
}
.header-full::after {
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.35);
}
.page-title {
    font-family: var(--font-head);
    font-size: 36px;
    font-weight: 300;
    color: var(--dark);
    text-align: center;
    padding: 30px 0 40px;
    margin: 0;
}
@media (max-width: 767.98px) {
    .header-full {
        height: 200px;
    }
    .hero-band {
        min-height: 300px;
    }
}

/* ---------- Dark header / utility bar ---------- */
.site-header {
    background: var(--dark);
    position: relative;
    z-index: 1030;
}
.topbar {
    background: var(--dark);
    border-bottom: 2px solid var(--topbar-border);
    font-family: var(--font-head);
}
.topbar > .container {
    flex-wrap: nowrap;
    gap: 1rem;
}
.topbar,
.topbar a {
    color: #fff;
    font-size: 13px;
    font-weight: 300;
}
.topbar a:hover {
    color: var(--gold);
}
.topbar .sec-menu {
    flex-wrap: nowrap;
    align-items: center;
    column-gap: 2px;
}
.topbar .sec-menu a {
    color: #a1a1a1;
    white-space: nowrap;
    padding-inline: 0.4rem !important;
}
/* Sport / Residence / Restaurant: grup aparte, usor despartit de Contact. */
.topbar .sec-menu .is-external:first-of-type {
    margin-left: 0.35rem;
    padding-left: 0.55rem;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
}
/* Comutatorul de limba: steaguri; limba curenta plina, cealalta estompata. */
.lang-flag {
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    line-height: 0;
    opacity: 0.45;
    transition:
        opacity 0.15s,
        transform 0.15s;
}
.lang-flag svg {
    display: block;
    border-radius: 2px;
}
.lang-flag::after {
    content: "";
    display: block;
    width: 100%;
    height: 2px;
    background: transparent;
}
.lang-flag:hover {
    opacity: 1;
    transform: translateY(-1px);
}
.lang-flag.is-active {
    opacity: 1;
}
/* Limba curenta se marcheaza cu o linie aurie dedesubt, nu cu chenar pe steag. */
.lang-flag.is-active::after {
    background: var(--gold);
}

/* Pictogramele de socializare din bara de sus: mai mari, ca sa se nimereasca usor. */
.topbar .social-links {
    font-size: 18px;
}
.topbar .social-links a {
    display: inline-flex;
    color: #cfcfcf;
    transition:
        color 0.15s,
        transform 0.15s;
}
.topbar .social-links a:hover {
    color: var(--gold);
    transform: translateY(-1px);
}
.navbar-spa {
    background: var(--dark) !important;
}
.navbar-spa .nav-link {
    font-family: var(--font-head);
    font-size: 12px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #cfcfcf;
    padding: 22px 10px;
    border-bottom: 4px solid transparent;
    transition: all 0.3s;
}
.navbar-spa .nav-link:hover,
.navbar-spa .nav-item.active > .nav-link,
.navbar-spa .nav-link.active {
    color: #fff;
    border-bottom-color: var(--gold);
}
.navbar-spa .dropdown-menu {
    border-radius: 0;
    border: none;
    box-shadow: var(--shadow-card);
    margin-top: 0;
}
.navbar-spa .dropdown-item {
    color: #777;
    padding: 8px 18px;
    font-family: var(--font-head);
    font-size: 13px;
}
.navbar-spa .dropdown-item:hover {
    background: #f5f5f5;
    color: #111;
}

/* Submeniu la hover, ancora parinte cu link propriu (21 sept. 2026).
   Ancora nu mai e toggle Bootstrap; lista se deschide din CSS la hover pe
   desktop si din butonul-sageata pe telefon (si de la tastatura). */
.navbar-spa .nav-item.dropdown-hover {
    display: flex;
    align-items: center;
}
.navbar-spa .nav-item.dropdown-hover > .nav-link {
    flex: 1 1 auto;
}
.navbar-spa .dropdown-caret {
    background: none;
    border: 0;
    padding: 0 10px 0 0;
    color: #cfcfcf;
    line-height: 1;
    cursor: pointer;
}
.navbar-spa .dropdown-caret::after {
    content: "";
    display: inline-block;
    width: 0.4em;
    height: 0.4em;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: transform 0.2s;
}
.navbar-spa .dropdown-caret[aria-expanded="true"]::after {
    transform: rotate(-135deg);
}
.navbar-spa .dropdown-caret:hover,
.navbar-spa .dropdown-caret:focus-visible {
    color: var(--gold);
    outline: none;
}
@media (min-width: 992px) {
    .navbar-spa .nav-item.dropdown-hover:hover > .dropdown-menu,
    .navbar-spa .nav-item.dropdown-hover:focus-within > .dropdown-menu {
        display: block;
    }
    /* Bootstrap pune `top:100%` doar prin Popper (data-bs-popper), adica doar
       cand deschide el lista. La hover o deschide CSS-ul, deci pozitia se da
       aici — altfel lista cadea peste ancora. Fara gol dedesubt, altfel
       hover-ul se pierde pe drum. */
    .navbar-spa .nav-item.dropdown-hover > .dropdown-menu {
        top: 100%;
        left: 0;
        margin-top: 0;
    }
}
.cart-badge {
    background: var(--gold);
    color: #111;
}

/* Cautare / cos: in topbar, si in navbar cand header-ul se lipeste. */
.nav-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px; /* comfortable touch target */
    padding: 0;
    line-height: 1;
    font-size: 1.15rem;
    text-decoration: none;
    color: #cfcfcf;
    cursor: pointer;
}
.nav-icon:hover,
.nav-icon:focus {
    color: #fff;
}
.nav-icon .cart-badge {
    top: 4px;
    right: 2px;
    font-size: 0.68rem;
    padding: 0.2em 0.45em;
}
.topbar .nav-icon {
    width: 32px;
    height: 32px;
    font-size: 16px;
    color: #cfcfcf;
}
.topbar .nav-icon:hover,
.topbar .nav-icon:focus {
    color: var(--gold);
}
.topbar .nav-shop-actions {
    margin-left: 0.35rem;
    padding-left: 0.55rem;
    border-left: 1px solid rgba(255, 255, 255, 0.18);
}
.nav-shop-actions-sticky {
    display: none !important;
}
@media (max-width: 991.98px) {
    /* Sigla, actiunile si butonul stau pe un rand, iar meniul se desface DEDESUBT.
       Cu `nowrap` pe container, meniul deschis nu avea unde sa coboare si se
       ingusta langa actiuni — de acolo „se deschide doar in lateral". */
    .navbar-spa > .container {
        flex-wrap: wrap;
    }
    .navbar-spa > .container > .navbar-brand,
    .navbar-spa > .container > .navbar-actions,
    .navbar-spa > .container > .navbar-toggler {
        min-width: 0;
    }
    .navbar-spa > .container > .navbar-collapse {
        order: 5;
        flex-basis: 100%;
        width: 100%;
        margin-top: 8px;
        border-top: 1px solid rgba(255, 255, 255, 0.12);
    }
    .navbar-spa .navbar-nav {
        margin-inline: 0 !important;
    }
    /* Pe telefon sageata e tinta de atins: lata, la capatul randului; lista
       (static, in navbar-ul pliat) coboara pe randul urmator, nu langa ancora. */
    .navbar-spa .nav-item.dropdown-hover {
        flex-wrap: wrap;
    }
    .navbar-spa .nav-item.dropdown-hover > .dropdown-menu {
        flex: 0 0 100%;
    }
    .navbar-spa .dropdown-caret {
        padding: 12px 16px;
        margin-left: auto;
    }
    .navbar-spa .navbar-nav .nav-link {
        padding: 12px 0;
        border-bottom: none;
    }
    .navbar-spa .dropdown-menu {
        background: transparent;
        box-shadow: none;
        padding-left: 12px;
    }
    .navbar-spa .dropdown-item {
        color: #cfcfcf;
        padding-inline: 0;
    }
    .navbar-spa .dropdown-item:hover {
        background: transparent;
        color: var(--gold);
    }
    .navbar-spa .navbar-brand img {
        max-width: 118px;
    }
    .navbar-spa .nav-icon {
        width: 40px;
    }
    .topbar .nav-icon {
        width: 36px;
        height: 36px;
    }
    .site-header.is-sticky .nav-shop-actions-sticky {
        display: flex !important;
    }
}

/* ---------- Header search overlay ---------- */
.nav-search {
    position: fixed;
    inset: 0;
    z-index: 1080;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    padding: 12vh 16px 24px;
}
.nav-search[hidden] {
    display: none !important;
}
.nav-search-backdrop {
    position: absolute;
    inset: 0;
    background: rgba(17, 17, 17, 0.55);
    opacity: 0;
    transition: opacity 0.22s ease;
}
.nav-search-panel {
    position: relative;
    width: min(720px, 100%);
    background: #fff;
    border: 1px solid var(--border-light);
    box-shadow: var(--shadow-lift);
    padding: 18px 18px 18px 22px;
    transform: translateY(-12px) scale(0.98);
    opacity: 0;
    transition:
        opacity 0.22s ease,
        transform 0.22s ease;
}
.nav-search.is-open .nav-search-backdrop {
    opacity: 1;
}
.nav-search.is-open .nav-search-panel {
    opacity: 1;
    transform: translateY(0) scale(1);
}
.nav-search-form {
    display: flex;
    align-items: center;
    gap: 12px;
}
.nav-search-icon {
    color: var(--gold);
    font-size: 1.15rem;
    flex: 0 0 auto;
}
.nav-search-input {
    flex: 1 1 auto;
    min-width: 0;
    border: 0;
    outline: 0;
    background: transparent;
    font-family: var(--font-head);
    font-size: 22px;
    font-weight: 400;
    color: #111;
    padding: 6px 0;
}
.nav-search-input::placeholder {
    color: #aaa;
}
.nav-search-submit {
    flex: 0 0 auto;
    text-transform: uppercase;
    letter-spacing: var(--letter);
}
.nav-search-close {
    flex: 0 0 auto;
    width: 40px;
    height: 40px;
    border: 0;
    background: transparent;
    color: #777;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
}
.nav-search-close:hover {
    color: #111;
}
@media (max-width: 575.98px) {
    .nav-search {
        padding-top: 18vh;
    }
    .nav-search-input {
        font-size: 18px;
    }
    .nav-search-submit {
        display: none;
    }
}

/* Wishlist heart on product image */
.product-media {
    position: relative;
}
.product-media-wishlist {
    position: absolute;
    top: 14px;
    right: 14px;
    z-index: 2;
}
.wishlist-form {
    display: block;
    margin: 0;
}
.btn-wishlist {
    width: 30px;
    height: 30px;
    padding: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 0;
    border-radius: 50%;
    background: rgba(255, 255, 255, 0.92);
    color: #888;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.12);
    text-decoration: none;
    cursor: pointer;
    transition:
        color 0.2s,
        background 0.2s,
        transform 0.15s;
}
.btn-wishlist:hover {
    color: var(--gold-2);
    background: #fff;
    transform: scale(1.06);
}
.btn-wishlist.is-active,
.btn-wishlist.is-active:hover {
    color: #fff;
    background: var(--gold);
}
.wishlist-row {
    display: flex;
    gap: 16px;
    align-items: center;
    padding: 14px 0;
    border-bottom: 1px solid var(--border-light);
}
.wishlist-row:last-child {
    border-bottom: 0;
}
.wishlist-row img {
    width: 72px;
    height: 72px;
    object-fit: cover;
    flex: 0 0 auto;
}
.wishlist-row .wishlist-meta {
    flex: 1 1 auto;
    min-width: 0;
}
.wishlist-row .wishlist-meta a {
    color: #111;
    text-decoration: none;
    font-family: var(--font-head);
    font-weight: 600;
}
.wishlist-row .wishlist-meta a:hover {
    color: var(--gold);
}
.wishlist-row .wishlist-actions {
    display: flex;
    gap: 8px;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
}
.wishlist-row .wishlist-actions .btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 9px 14px;
    font-size: 11px;
    line-height: 1.2;
    border-width: 1px;
    min-height: 34px;
}

/* ---------- Footer ---------- */
.site-footer {
    background: #111;
    color: #a4a4a4;
    padding-top: 50px;
}
.site-footer h5,
.site-footer h6,
.site-footer .widget-title {
    font-family: var(--font-head);
    text-transform: uppercase;
    font-size: 14px;
    color: #cfcfcf;
    letter-spacing: 0.5px;
    margin-bottom: 18px;
}
.site-footer a {
    color: #a4a4a4;
}
.site-footer .footer-legal {
    font-size: 13px;
}
.site-footer .footer-legal a {
    color: #8f8f8f;
    text-decoration: none;
}
.site-footer .footer-legal a:hover,
.site-footer .footer-legal a:focus-visible {
    color: var(--gold);
    text-decoration: underline;
}
.site-footer a:hover {
    color: var(--gold);
}
.site-footer .footer-contact a {
    font-family: var(--font-head);
    font-size: 14px;
    line-height: 24px;
}
.site-footer .copyright {
    color: #666;
    font-family: var(--font-body);
    font-size: 14px;
}
.site-footer hr {
    border-color: #2a2a2a;
    opacity: 1;
}
.nl-submit {
    width: 100%;
    text-transform: uppercase;
    letter-spacing: var(--letter);
    color: var(--gold-alt);
    background: #111;
    border: 2px solid var(--gold-alt);
    border-radius: 0;
    padding: 12px;
    font-family: var(--font-head);
    font-size: 12px;
    transition: all 0.3s;
}
.nl-submit:hover {
    background: var(--gold-alt);
    color: #111;
}
.site-footer .footer-terms-news {
    color: #8f8f8f;
    line-height: 1.4;
}
.site-footer .footer-terms-news a {
    color: var(--gold-alt);
    text-decoration: underline;
}
.site-footer .form-check-input {
    margin-top: 0.35em;
}
.site-footer .nl-form .alert {
    margin-bottom: 0.75rem;
}

/* ---------- Forms ---------- */
.form-control,
.form-select {
    border-radius: 0;
}
.form-control:focus,
.form-select:focus {
    border-color: var(--gold);
    box-shadow:
        inset 0 1px 1px rgba(0, 0, 0, 0.075),
        0 0 6px var(--gold-soft);
}

/* ---------- Steps strip ---------- */
.step {
    text-align: center;
}
.step .step-ic {
    width: 62px;
    height: 62px;
    border-radius: 50%;
    background: var(--bg-light);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-size: 24px;
    color: var(--gold);
    margin-bottom: 14px;
}
.step .step-no {
    font-family: var(--font-head);
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 1px;
    color: var(--gold);
}
.step .step-tl {
    font-family: var(--font-head);
    font-size: 14px;
    color: #333;
    margin-top: 4px;
}

/* ---------- Promo tile ---------- */
.promo-tile {
    display: block;
    overflow: hidden;
}
.promo-tile img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.5s;
}
.promo-tile:hover img {
    transform: scale(1.04);
}

/* ---------- List group brand active ---------- */
.list-group-item.active {
    background: var(--gold);
    border-color: var(--gold);
    color: #fff;
}

/* ---------- Cards square ---------- */
.card {
    border-radius: 0;
}

/* ---------- Sticky header ---------- */
.site-header.is-sticky {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 1040;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.25);
}
.site-header.is-sticky .topbar {
    display: none;
}
.site-header.is-sticky .navbar-spa .nav-link {
    padding-top: 16px;
    padding-bottom: 16px;
}

/* ===================================================================
   POLISH LAYER — refinements over the base above (2026-07)
   Goal: quieter, more premium execution of the same gold identity —
   generous rhythm, legible type, consistent imagery, a11y.
   =================================================================== */

/* Eyebrow: darker gold reads on white (the brand gold fails contrast at 12px) */
.eyebrow {
    color: var(--gold-ink);
    letter-spacing: 2px;
}
.hero-band .eyebrow {
    color: var(--gold-2);
} /* on the dark hero, keep it bright */

/* Type rhythm */
.fs-hero {
    letter-spacing: 0.5px;
}
.fs-lead {
    line-height: 1.7;
}

/* Script accent — Great Vibes runs small + has tall ascenders, so scale up
   and keep line-height loose enough that the flourishes are never clipped */
.script-heading {
    font-size: clamp(44px, 5.6vw, 68px);
    line-height: 1.3;
    color: var(--gold);
    padding: 0.1em 0;
}

/* Hero — gradient scrim (legible text top-to-bottom) instead of a flat wash */
.hero-band::after {
    background: linear-gradient(
        180deg,
        rgba(20, 18, 15, 0.32) 0%,
        rgba(20, 18, 15, 0.52) 60%,
        rgba(20, 18, 15, 0.66) 100%
    );
}
.hero-band {
    min-height: 560px;
}
.hero-band .fs-lead {
    color: rgba(255, 255, 255, 0.86) !important;
}
@media (max-width: 767.98px) {
    .hero-band {
        min-height: 420px;
    }
}

/* Section heading — hairline softer + thinner, more whitespace */
.section-heading {
    margin: 0 0 var(--sp-5);
}
.section-heading::before {
    border-top: 1px solid rgba(31, 31, 31, 0.14);
}
.section-heading .main-heading {
    padding: 0 34px;
    font-weight: 600;
    letter-spacing: 2px;
}
.section-heading .sub {
    margin-top: 16px;
    color: var(--muted-2);
    max-width: 640px;
    margin-left: auto;
    margin-right: auto;
}

/* Promo tiles — frame them as one coherent set, all square, refined hover */
.promo-tile {
    position: relative;
    border: 1px solid var(--border-light);
    background: #fff;
    box-shadow: var(--shadow-card);
    transition:
        box-shadow 0.35s,
        transform 0.35s;
}
.promo-tile:hover {
    box-shadow: var(--shadow-lift);
    transform: translateY(-3px);
}
.promo-tile img {
    aspect-ratio: 1/1;
    width: 100%;
    height: auto;
    object-fit: cover;
}
/* The gift-card tile is a landscape certificate, not a photo: bias the square
   crop toward its decorative (right) side so the label text isn't sliced. */
.promo-tile--doc img {
    object-position: 82% center;
}

/* Brand buttons — center the label vertically even when flex stretches the
   button to a taller sibling's height (was the "Carduri cadou" hero misalign),
   and give the outline variant a matching large size. */
.btn-brand,
.btn-brand-dark,
.btn-outline-brand {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    line-height: 1.2;
}
.btn-outline-brand.btn-lg {
    padding: 18px 30px;
}

/* Service / product & category cards — softer, deeper lift */
.spa-card {
    border-width: 1px;
    border-color: var(--border-light);
    box-shadow: var(--shadow-card);
}
.spa-card:hover {
    border-color: var(--gold);
    box-shadow: var(--shadow-lift);
    transform: translateY(-3px);
}
.cat-tile .cat-title {
    color: #555;
    font-weight: 600;
    letter-spacing: 1px;
    margin-top: 18px;
}
.cat-tile .cat-img {
    box-shadow: var(--shadow-card);
    transition: box-shadow 0.35s;
}
.cat-tile:hover .cat-img {
    box-shadow: var(--shadow-lift);
}

/* Facility tiles — subtle base darkening so the label always reads */
.facility-tile {
    box-shadow: var(--shadow-card);
}

/* Steps — connector + refined chips */
.step .step-ic {
    box-shadow: inset 0 0 0 1px rgba(209, 170, 103, 0.35);
    transition:
        background 0.3s,
        color 0.3s,
        box-shadow 0.3s;
}
.step:hover .step-ic {
    background: var(--gold);
    color: #fff;
    box-shadow: inset 0 0 0 1px var(--gold);
}
.step .step-no {
    color: var(--gold-ink);
    letter-spacing: 1.5px;
}

/* Awards — normalize sizes, mute to grayscale, colour on hover */
.award-logo {
    max-height: 66px;
    width: auto;
    object-fit: contain;
    mix-blend-mode: multiply;
    filter: grayscale(1);
    opacity: 0.72;
    transition:
        filter 0.3s,
        opacity 0.3s;
}
.award-logo:hover {
    filter: none;
    opacity: 1;
}

/* Buttons — smoother, and a visible keyboard focus ring everywhere */
.btn-brand,
.btn-brand-dark,
.btn-outline-brand {
    transition:
        background-color 0.3s,
        color 0.3s,
        border-color 0.3s,
        box-shadow 0.3s,
        transform 0.15s;
}
.btn-brand:active,
.btn-outline-brand:active,
.btn-brand-dark:active {
    transform: translateY(1px);
}
.btn-brand:focus-visible,
.btn-brand-dark:focus-visible,
.btn-outline-brand:focus-visible,
.nl-submit:focus-visible,
.link-detail:focus-visible,
.navbar-spa .nav-link:focus-visible,
.form-control:focus-visible,
.form-select:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 2px;
}

/* Links (in body copy) — readable gold + underline affordance on hover */
main
    a:not(.btn):not(.nav-link):not(.cat-title):not(.spa-title a):not(
        .promo-tile
    ):not(.cat-img) {
    color: var(--gold-ink);
}
main a:not(.btn):not(.nav-link):hover {
    color: var(--gold-deep);
}

/* Page hero — image banner with the title overlaid (stronger than a bare
   banner + a title floating on white below it) */
.page-hero {
    position: relative;
    min-height: 320px;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.page-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background: linear-gradient(
        180deg,
        rgba(20, 18, 15, 0.34) 0%,
        rgba(20, 18, 15, 0.56) 100%
    );
}
.page-hero-inner {
    position: relative;
    z-index: 1;
    text-align: center;
    color: #fff;
    padding: 0 16px;
}
.page-hero .eyebrow {
    color: var(--gold-2);
    display: block;
    margin-bottom: 12px;
}
.page-hero h1 {
    color: #fff;
    font-family: var(--font-head);
    font-weight: 300;
    margin: 0;
    font-size: clamp(30px, 4vw, 48px);
    letter-spacing: 0.5px;
}
.page-hero .page-hero-sub {
    margin: 14px auto 0;
    max-width: 600px;
    color: rgba(255, 255, 255, 0.85);
}
@media (max-width: 767.98px) {
    .page-hero {
        min-height: 220px;
    }
}

/* Pagination — brand gold instead of Bootstrap blue */
.pagination {
    --bs-pagination-color: var(--gold-ink);
    --bs-pagination-hover-color: var(--gold-deep);
    --bs-pagination-focus-color: var(--gold-deep);
    --bs-pagination-hover-bg: #faf5ea;
    --bs-pagination-active-bg: var(--gold);
    --bs-pagination-active-border-color: var(--gold);
    --bs-pagination-active-color: #111;
    --bs-pagination-border-radius: 0;
    --bs-pagination-focus-box-shadow: 0 0 0 0.2rem rgba(209, 170, 103, 0.35);
    font-family: var(--font-head);
}

/* Category list (catalog sidebar) — quieter, brand active */
.list-group-item {
    border-color: var(--border-light);
    font-family: var(--font-head);
    font-size: 13px;
    letter-spacing: 0.4px;
    padding: 12px 16px;
}
.list-group-item-action:hover {
    background: #faf7f0;
    color: var(--gold-deep);
}

/* Respect reduced-motion */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
    .spa-card:hover,
    .promo-tile:hover,
    .spa-card:hover .spa-card-img img,
    .cat-tile:hover .cat-img img,
    .promo-tile:hover img {
        transform: none;
    }
}


/* Butonul de apel de pe telefon: stă deasupra continutului, in coltul din dreapta jos. */
.buton-apel{ position:fixed; right:16px; bottom:16px; z-index:1035;
  width:52px; height:52px; border-radius:50%; background:var(--gold); color:#fff;
  display:inline-flex; align-items:center; justify-content:center; font-size:22px;
  box-shadow:var(--shadow-lift); }
.buton-apel:hover, .buton-apel:focus{ color:#fff; background:var(--gold-2, var(--gold)); }
.topbar-mobil{ font-size:13px; }

/* Firul Ariadnei: jos, inainte de footer (ca Yoast pe live) — mic, linistit. */
.firul-ariadnei-wrap{ padding:14px 12px 18px; }
.firul-ariadnei{
  --bs-breadcrumb-divider: '>';
}
.firul-ariadnei .breadcrumb{
  font-size:12px; letter-spacing:.3px; padding:0; background:transparent;
  flex-wrap:wrap; row-gap:2px;
}
.firul-ariadnei .breadcrumb-item + .breadcrumb-item{ padding-left:.4rem; }
.firul-ariadnei .breadcrumb-item + .breadcrumb-item::before{ padding-right:.4rem; color:#bbb; }
.firul-ariadnei .breadcrumb-item a{ color:var(--muted, #777); text-decoration:none; }
.firul-ariadnei .breadcrumb-item a:hover{ color:var(--gold); }
.firul-ariadnei .breadcrumb-item.active{ color:#999; }

/* Imaginea produsului: patrata, ca pe cardurile din lista. */
.imagine-produs{ position:relative; aspect-ratio:1/1; overflow:hidden; }
.imagine-produs img{ width:100%; height:100%; object-fit:cover; display:block; }
/* Durata e primul lucru pe care il cauta cineva care alege o terapie. */
.durata-insigna{ position:absolute; left:0; bottom:0; margin:0; padding:8px 16px;
  background:rgba(31,31,31,.82); color:#fff; font-family:var(--font-head);
  font-size:14px; letter-spacing:.5px; }
/* Pe card, aceeasi insigna, doar mai mica — imaginea e mai mica. */
.durata-insigna-card{ padding:5px 10px; font-size:12px; }
/* Titlul nu mai are nevoie de inaltime rezervata pentru randul cu durata. */
.spa-card .spa-title{ min-height:0; margin-bottom:12px; }

/* Atentionarea de pe listele de terapii si de pe pagina produsului. */
.disclaimer-spa{ display:flex; gap:4px; align-items:flex-start; margin-top:40px;
  padding:16px 20px; background:#faf7f1; border-left:3px solid var(--gold);
  color:#6b6b6b; font-size:13px; line-height:1.7; }

/* Tabelele din articole vin din WordPress fara clase; le stilam dupa context. */
.blog-body table, .page-content table{ width:100%; margin:24px 0; border-collapse:collapse; font-size:14px; }
.blog-body table th, .page-content table th{ background:#faf7f1; font-family:var(--font-head);
  font-weight:600; text-align:left; }
.blog-body table th, .blog-body table td,
.page-content table th, .page-content table td{ padding:10px 14px; border:1px solid var(--border, #e6e6e6); vertical-align:top; }
.blog-body table tr:nth-child(even) td, .page-content table tr:nth-child(even) td{ background:#fcfbf9; }
/* Pe telefon un tabel lat nu are cum sa incapa: se deruleaza el, nu pagina. */
.blog-body table, .page-content table{ display:block; overflow-x:auto; }

/* Reducerea: insigna pe imagine si pretul vechi, taiat, langa cel nou. */
.insigna-reducere{ position:absolute; top:10px; left:10px; z-index:2;
  background:var(--gold); color:#fff; font-family:var(--font-head); font-weight:700;
  font-size:12px; letter-spacing:.5px; padding:4px 9px; }
.pret-vechi{ color:#a3a3a3; font-size:.7em; font-weight:400; margin-left:6px; }

/* Premiile: un singur rand pe desktop, cate doua pe telefon. */
.premii{ display:flex; flex-wrap:wrap; align-items:center; justify-content:center; gap:20px 28px; }
.premii .award-logo{ flex:0 1 auto; max-width:calc(50% - 14px); }
@media (min-width: 992px){
  .premii{ flex-wrap:nowrap; gap:28px; }
  .premii .award-logo{ max-width:none; min-width:0; }
}

/* Punctele de pe pagina produsului: lista, nu un bloc de text lipit. */
.bulete-produs{ list-style:none; padding:0; margin:0 0 28px; }
.bulete-produs li{ position:relative; padding:4px 0 4px 22px; color:#6b6b6b; font-size:14px; line-height:1.6; }
.bulete-produs li::before{ content:""; position:absolute; left:2px; top:14px;
  width:6px; height:6px; background:var(--gold); border-radius:50%; }

/* Coloana din dreapta a articolului: articole recente, ca pe site-ul actual. */
.blog-sidebar{ position:sticky; top:96px; padding:24px; background:#faf7f1; }
.blog-sidebar .widget-title{ font-size:14px; margin-bottom:18px; }
.blog-sidebar-item{ display:flex; gap:12px; padding:12px 0; border-bottom:1px solid rgba(0,0,0,.06); }
.blog-sidebar-item:last-child{ border-bottom:none; padding-bottom:0; }
.blog-sidebar-img img{ width:72px; height:72px; object-fit:cover; display:block; }
.blog-sidebar-item a{ color:#111; font-family:var(--font-head); font-size:14px; line-height:1.4; }
.blog-sidebar-item a:hover{ color:var(--gold); }
.blog-sidebar-item time{ font-size:12px; margin-top:4px; }
@media (max-width: 991.98px){ .blog-sidebar{ position:static; margin-top:32px; } }

/* Cei sase pasi de cumparare (pagina produsului), ca pe site-ul actual:
   bara orizontala, pasul curent pe auriu, iconitele din tema veche. */
.pasi-cumparare{
  display:flex; list-style:none; padding:0; margin:40px 0 32px;
  border:1px solid #ccc; overflow:hidden;
}
.section-light .pasi-cumparare{ margin:0; }
.pasi-cumparare .pas{
  flex:1 1 0; min-width:0; color:#b5b5b5; border-left:1px solid #ccc;
  font-family:var(--font-head);
}
.pasi-cumparare .pas:first-child{ border-left:0; }
.pasi-cumparare .pas-corp{
  position:relative; display:block; padding:14px 48px 14px 16px; min-height:80px;
}
.pasi-cumparare .pas-nr{
  display:block; font-size:14px; font-weight:700; color:inherit; line-height:1.3;
}
.pasi-cumparare .pas-eticheta{
  display:block; font-size:12px; color:inherit; line-height:1.35; margin-top:2px;
}
.pasi-cumparare .pas-ic{
  position:absolute; right:10px; top:50%; transform:translateY(-50%);
  width:36px; height:36px; color:inherit; display:flex; align-items:center; justify-content:center;
}
.pasi-cumparare .pas-ic svg{ width:100%; height:100%; display:block; }
.pasi-cumparare .pas-trecut{ background:#fff; color:#b5b5b5; }
.pasi-cumparare .pas-curent{ background:var(--gold); color:#fff; border-color:var(--gold); }
.pasi-cumparare .pas-curent .pas-ic{ color:#fff; }
@media (max-width: 991.98px){
  .pasi-cumparare .pas-corp{ padding:12px 40px 12px 10px; min-height:72px; }
  .pasi-cumparare .pas-nr{ font-size:12px; }
  .pasi-cumparare .pas-eticheta{ font-size:11px; }
  .pasi-cumparare .pas-ic{ width:28px; height:28px; right:6px; }
}

/* Tab-urile aduse din paginile vechi si cele din cont: pe telefon se deruleaza
   pe orizontala, nu se rup pe trei randuri. */
.taburi-pagina, .acc-tabs{
  display:flex; flex-wrap:nowrap; gap:0; overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch; scrollbar-width:thin;
  border-bottom:1px solid rgba(0,0,0,.08);
}
.taburi-pagina::-webkit-scrollbar, .acc-tabs::-webkit-scrollbar{ height:3px; }
.taburi-pagina .nav-link,
.acc-tabs .acc-tabbtn{
  flex:0 0 auto; white-space:nowrap; border:none; border-bottom:2px solid transparent;
  border-radius:0; color:#777; background:transparent; font-family:var(--font-head);
  font-size:13px; font-weight:400; text-transform:uppercase; letter-spacing:.5px;
  padding:12px 16px; margin-bottom:-1px; line-height:1.2; cursor:pointer;
}
.taburi-pagina .nav-link:hover,
.acc-tabs .acc-tabbtn:hover{ color:#111; }
.taburi-pagina .nav-link.active,
.acc-tabs .acc-tabbtn.active{
  color:#111; background:transparent; border-bottom-color:var(--gold); font-weight:600;
}
.acc-tabs .acc-tabbtn:focus-visible{
  outline:2px solid var(--gold); outline-offset:2px;
}
.page-content .tab-content{ padding-top:24px; }

/* Contul meu: antet + tabele citibile pe telefon (rand = card, nu coloane stranse). */
.acc-head{
  display:flex; justify-content:space-between; align-items:center; gap:12px; flex-wrap:wrap;
}
.acc-table{ margin-bottom:0; }
.acc-vouchere{ display:grid; gap:16px; }
.acc-voucher{
  display:grid; grid-template-columns:minmax(160px, 220px) 1fr; gap:8px 28px;
  align-items:start; border:1px solid rgba(0,0,0,.08); border-left:3px solid var(--gold);
  padding:18px 20px;
}
.acc-voucher-suma strong{
  display:block; font-size:28px; font-weight:600; color:#111; line-height:1.15;
}
.acc-voucher-eticheta{
  display:block; margin-bottom:6px; color:#777; font-family:var(--font-head);
  font-size:11px; font-weight:600; letter-spacing:.4px; text-transform:uppercase;
}
.acc-voucher dl{
  display:grid; grid-template-columns:max-content 1fr; gap:8px 18px; margin:0;
}
.acc-voucher dt{ margin:0; color:#777; font-size:13px; font-weight:400; }
.acc-voucher dd{ margin:0; }
@media (max-width: 767.98px){
  .acc-voucher{ grid-template-columns:1fr; gap:14px; }
}
@media (max-width: 767.98px){
  .acc-table thead{ display:none; }
  .acc-table,
  .acc-table tbody,
  .acc-table tfoot,
  .acc-table tr,
  .acc-table td,
  .acc-table th{ display:block; width:100%; }
  .acc-table tbody tr{
    padding:14px 0; border-bottom:1px solid var(--border-light, rgba(0,0,0,.08));
  }
  .acc-table tbody tr:last-child{ border-bottom:0; }
  .acc-table td{
    display:flex; justify-content:space-between; align-items:flex-start; gap:16px;
    padding:.35rem 0; border:0; text-align:right !important;
  }
  .acc-table td::before{
    content:attr(data-label); flex:0 1 42%; text-align:left; color:#777;
    font-family:var(--font-head); font-size:11px; font-weight:600;
    text-transform:uppercase; letter-spacing:.4px;
  }
  .acc-table td[colspan]{
    display:block; text-align:left !important; color:#777; padding:.75rem 0;
  }
  .acc-table td[colspan]::before{ content:none; }
  .acc-table td.acc-actions{
    justify-content:flex-end; padding-top:10px;
  }
  .acc-table td.acc-actions::before{ content:none; }
  .acc-table tfoot tr{
    display:flex; justify-content:space-between; align-items:center;
    gap:16px; padding:14px 0 0; border-top:1px solid rgba(0,0,0,.08); margin-top:8px;
  }
  .acc-table tfoot .acc-total-label{ display:none; }
  .acc-table tfoot th{
    display:flex; justify-content:space-between; align-items:center; gap:16px;
    width:100%; border:0; padding:0; font-size:1rem;
  }
  .acc-table tfoot th::before{
    content:attr(data-label); color:#777; font-family:var(--font-head);
    font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.4px;
  }
  .wishlist-row{ flex-wrap:wrap; }
  .wishlist-row .wishlist-actions{ width:100%; justify-content:flex-start; }
}
/* Coloanele aduse din tema veche: imaginile ocupa toata latimea coloanei. */
.page-content .team-member img{ width:100%; height:auto; display:block; margin-bottom:12px; }
.page-content .team-member h3{ font-size:15px; font-family:var(--font-head); text-transform:uppercase; letter-spacing:.5px; }

/* Galeria de Instagram: patrate egale, cate doua pe telefon. */
.instagram-grila{ display:grid; grid-template-columns:repeat(2, 1fr); gap:8px; }
.instagram-grila a{ display:block; aspect-ratio:1/1; overflow:hidden; }
.instagram-grila img{ width:100%; height:100%; object-fit:cover; display:block;
  transition:transform .4s, opacity .3s; }
.instagram-grila a:hover img{ transform:scale(1.05); opacity:.9; }
@media (min-width: 768px){ .instagram-grila{ grid-template-columns:repeat(4, 1fr); } }
@media (min-width: 1200px){ .instagram-grila{ grid-template-columns:repeat(6, 1fr); } }

/* Subsolul, ca pe site-ul actual: cinci coloane, plati sub contact, fundatia. */
.site-footer .footer-plati img{ max-width:100%; height:30px; width:auto; opacity:.85; }
.site-footer .footer-fundatia{ line-height:1.7; color:#a3a3a3; }
.site-footer .widget-title{ margin-bottom:14px; }
.site-footer .nl-form .form-control-sm{ font-size:13px; }
@media (max-width: 991.98px){
  .site-footer .footer-fundatia{ font-size:12px; }
}

/* Indicatii / contraindicatii / beneficii pe pagina produsului. */
.liste-produs-titlu{ font-family:var(--font-head); letter-spacing:1px; color:var(--gold-ink); margin-bottom:12px;
  padding-bottom:8px; border-bottom:1px solid var(--border, #e6e6e6); }
.liste-produs-corp ul{ list-style:none; padding:0; margin:0; }
.liste-produs-corp li{ position:relative; padding:4px 0 4px 20px; color:#6b6b6b; font-size:14px; line-height:1.6; }
.liste-produs-corp li::before{ content:""; position:absolute; left:2px; top:14px; width:6px; height:6px; background:var(--gold); border-radius:50%; }
.liste-produs-corp p:empty{ display:none; }

/* Caseta de facilitate ca link: se comporta la fel, doar ca duce undeva. */
a.facility-tile{ display:block; color:inherit; text-decoration:none; }
a.facility-tile:hover img{ transform:scale(1.03); }
a.facility-tile img{ transition:transform .4s; }

/* Bannerul de sus ca slide-uri: imaginea e continutul, fara text peste. */
.hero-slider{ padding:0; background:var(--dark); }
.hero-slider .hero-slide{ display:block; }
.hero-slider .hero-slide img{ width:100%; height:auto; display:block; }
.hero-slider .carousel-indicators [data-bs-target]{ width:10px; height:10px; border-radius:50%; background:#fff; opacity:.5; }
.hero-slider .carousel-indicators .active{ background:var(--gold); opacity:1; }
.hero-slider .carousel-control-prev, .hero-slider .carousel-control-next{ width:8%; opacity:.6; }

/* Pagina de campanie, dupa feedback-ul din 18 sept. 2026: KV-ul intreg, counter-ul pe banda lui,
   carduri cu colturi rotunjite, insigna rotunda aurie (nu eticheta rosie), bife in loc de buline. */
.campaign-kv{ background:#fff; }
.campaign-kv img{ width:100%; height:auto; display:block; }
.campaign-countdown-band{ background:#1f1f1f; color:#fff; }
.campaign-countdown-band .cd-unit{ min-width:64px; }
.campaign-countdown-band .cd-unit span{ font-family:var(--font-head); font-size:34px; font-weight:300; line-height:1; color:var(--gold-2); }
.campaign-countdown-band .cd-unit small{ font-size:11px; letter-spacing:1px; text-transform:uppercase; color:rgba(255,255,255,.7); margin-top:4px; }
.promo-intro{ color:var(--muted, #666); font-size:17px; font-weight:300; }
.promo-card{ background:#fff; border:1px solid var(--border-light); border-radius:14px; overflow:hidden;
  box-shadow:var(--shadow-card); transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.promo-card:hover{ border-color:var(--gold); box-shadow:var(--shadow-lift); transform:translateY(-3px); }
.promo-card img{ width:100%; height:auto; display:block; }
.promo-card .h6{ font-family:var(--font-head); font-size:17px; font-weight:500; }
.promo-badge{ top:12px; left:12px; z-index:2; width:56px; height:56px; border-radius:50%;
  display:inline-flex; align-items:center; justify-content:center; background:var(--gold); color:#fff;
  font-family:var(--font-head); font-size:15px; font-weight:600; letter-spacing:0; box-shadow:0 2px 8px rgba(0,0,0,.18); }
.promo-descriere ul{ list-style:none; padding-left:0; margin:6px 0 0; }
.promo-descriere ul li{ position:relative; padding-left:22px; margin-bottom:4px; }
.promo-descriere ul li::before{ content:"\f633"; font-family:bootstrap-icons; position:absolute; left:0; top:0; color:var(--gold); font-size:15px; }
.promo-footer-text{ color:var(--muted, #666); font-size:14px; line-height:1.7; }
.promo-footer-text h2, .promo-footer-text h3{ font-size:18px; }

/* Blocurile de produse si pasii personalizati (paginile de categorie compuse din blocuri, 18 sept. 2026). */
.produs-rand-img{ border-radius:14px; object-fit:cover; aspect-ratio:4/3; }
.produs-rand:last-child{ border-bottom:0 !important; }
.produs-rand h3 a{ color:inherit; text-decoration:none; }
.produs-rand h3 a:hover{ color:var(--gold); }
.produs-mare{ border-radius:14px; overflow:hidden; }
.produs-mare .card-img-top{ aspect-ratio:16/9; object-fit:cover; }
.pas-personalizat{ background:#fff; border:1px solid var(--border-light); border-radius:14px; }
.pas-numar{ width:48px; height:48px; border-radius:50%; background:var(--gold); color:#fff; display:flex; align-items:center; justify-content:center; font-family:var(--font-head); font-size:20px; }

/* Pasi cu cercuri (pagina de abonamente): imagine rotunda, linie punctata
   aurie intre cercuri, fara caseta. Linia e pe coloana, sub cerc, de la
   jumatatea lui spre dreapta; ultimul pas n-o are. */
.pasi-cercuri .pas-personalizat{ background:transparent; border:0; border-radius:0; }
.pasi-cercuri .pas-eticheta{ font-family:var(--font-head); letter-spacing:1px; }
.pasi-cercuri .col-md-4{ position:relative; }
.pasi-cercuri .pas-cerc{ width:200px; height:200px; border-radius:50%; overflow:hidden; background:#f2f2f2; position:relative; z-index:1; }
.pasi-cercuri .pas-cerc img{ width:100%; height:100%; object-fit:cover; display:block; }
@media (min-width: 768px){
    .pasi-cercuri .col-md-4:not(:last-child)::after{
        content:""; position:absolute; left:calc(50% + 100px); right:calc(-50% + 100px);
        top:calc(1.5rem + 100px); border-top:3px dotted var(--gold);
    }
}
@media (max-width: 767.98px){ .pasi-cercuri .pas-cerc{ width:160px; height:160px; } }

/* ===== Blocul „Produse”: eticheta laterala si caruselul (21 sept. 2026) =====
   Eticheta: banda gri verticala in stanga, cu textul mare, ca in sectiunile
   „vezi si” de pe site-ul vechi; produsele stau la dreapta ei. Pe telefon
   banda devine un titlu deasupra listei. */
.produse-corp{ display:flex; gap:32px; align-items:stretch; }
.produse-lista{ flex:1 1 auto; min-width:0; }
.eticheta-laterala{
    flex:0 0 260px; background:#f2f2f2; display:flex; align-items:center; padding:24px 32px;
    font-family:var(--font-head); font-weight:700; font-size:26px; line-height:1.15;
    text-transform:uppercase; color:#111; letter-spacing:.5px;
}
@media (max-width: 991.98px){
    .produse-corp{ display:block; }
    .eticheta-laterala{ padding:14px 18px; font-size:20px; margin-bottom:20px; }
}

/* Caruselul: defilare nativa cu scroll-snap, 3 carduri vizibile pe desktop,
   sagetile in afara listei. */
.carusel{ position:relative; display:flex; align-items:center; gap:12px; }
.carusel-lista{
    flex:1 1 auto; min-width:0; display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory;
    scrollbar-width:none; padding:4px 2px;
}
.carusel-lista::-webkit-scrollbar{ display:none; }
.carusel-card{ flex:0 0 calc((100% - 48px) / 3); scroll-snap-align:start; }
.carusel-sageata{
    flex:0 0 auto; width:44px; height:44px; border:0; background:transparent; color:#333; font-size:28px;
    display:flex; align-items:center; justify-content:center; cursor:pointer; padding:0;
}
.carusel-sageata:hover{ color:var(--gold); }
@media (max-width: 991.98px){
    .carusel-card{ flex-basis:calc((100% - 24px) / 2); }
    .carusel-sageata{ display:none; }
}
@media (max-width: 575.98px){
    .carusel-card{ flex-basis:85%; }
}

/* ===== Fereastra (popup): formular, imagine sau text intr-un modal (21 sept. 2026) ===== */
.popup-fereastra .modal-content{ border:0; border-radius:0; box-shadow:var(--shadow-card); padding:32px; }
.popup-fereastra .popup-inchide{
    position:absolute; top:0; right:0; z-index:2; width:44px; height:44px; border:0; background:var(--gold); color:#fff;
    display:flex; align-items:center; justify-content:center; font-size:18px; cursor:pointer;
}
.popup-fereastra .popup-inchide:hover{ background:var(--gold-ink, #b8935a); }
.popup-fereastra .popup-titlu{ margin:0 40px 12px 0; }
.popup-fereastra .modal-body{ padding:0; }
.popup-fereastra .site-form{ margin:0 !important; }
.popup-image .modal-content{ padding:24px; }
.popup-buton{ padding-top:0; }
@media (max-width: 575.98px){ .popup-fereastra .modal-content{ padding:24px 16px; } }

/* ===== Blocul „Subcategorii” (21 sept. 2026): grila copiilor unei categorii ===== */
.subcategorie-card{ display:flex; flex-direction:column; }
.subcategorie-img{ display:block; border-radius:14px; overflow:hidden; aspect-ratio:1/1; margin-bottom:16px; }
.subcategorie-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .5s; }
.subcategorie-card:hover .subcategorie-img img{ transform:scale(1.04); }
.subcategorie-titlu{ font-family:var(--font-head); font-size:15px; font-weight:700; margin:0 0 10px; }
.subcategorie-titlu a{ color:#111; text-decoration:none; }
.subcategorie-titlu a:hover{ color:var(--gold-ink, #b8935a); }
.subcategorie-text{ font-size:13px; line-height:1.65; color:#777; margin:0 0 14px; }
.subcategorie-link{
    margin-top:auto; font-family:var(--font-head); font-size:11px; font-weight:700; letter-spacing:.5px;
    text-transform:uppercase; color:#111; text-decoration:none;
}
.subcategorie-link .bi{ color:var(--gold); font-size:10px; }
.subcategorie-link:hover{ color:var(--gold-ink, #b8935a); }