/* Home page */
/* Home page - Categories */
.homepage .section-categories { padding-bottom: 0; }
/* Home page - Inspiration */
.homepage .section-inspiration { margin-top: var(--page-section-space); background: var(--main-color); color: #fff; }
/* Horná medzera po písmená nadpisu = dolná pod dlaždicami; .21em je riadkový priestor nad písmenami pri line-height 1.15. */
.homepage .section-inspiration .heading-box .heading { margin-top: -.21em; }
.homepage .section-inspiration a { color: #fff; }
.homepage .section.section-inspiration .heading-text { color: #fff; }
.homepage .collection-tile { overflow: hidden; text-decoration: none; }
.homepage .collection-tile > div { display: flex; align-items: center; justify-content: center; }
.homepage .collection-tile img { width: 100%; height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.homepage .collection-tile > span { display: flex; align-items: center; justify-content: space-between; gap: 12px; background: #fff; color: var(--second-color); }
/* Home page - Reviews */
.homepage .review-stars { display: flex; gap: 3px; color: var(--main-color); }
.homepage .review-stars svg { width: 16px; height: 16px; fill: currentColor; }
.homepage .review-stars .star-empty { opacity: .25; }
.homepage .review cite { display: block; font-style: normal; color: var(--shop-muted); }
.homepage { --shop-home-paper: #f3f2ed; }
.homepage .category-heading { display: block; }
/* Home page - Story */
.homepage .section-story { --section-padding: 0px; display: block; width: 100%; margin: 0; min-height: 0; background: none; }
.homepage .section-story > .container > .row { background: var(--shop-home-paper); }
.homepage .story-photo { height: 100%; background: #d6d4c9; }
.homepage .story-photo img { position: static; width: 100%; height: 100%; aspect-ratio: 3 / 2; object-fit: cover; }
.homepage .story-copy { padding: clamp(25px, 4vw, 55px); }
.homepage .story-benefits { display: flex; margin-top: 28px; padding-top: 24px; }
.homepage .story-benefits > div { display: flex; flex-direction: row; align-items: flex-start; gap: 12px; font-size: 12px; text-align: left; }
.homepage .story-benefits :is(svg, i) { flex: 0 0 24px; width: 24px; height: 24px; font-size: 24px; }
.homepage .story-benefits p { font-size: 12px; margin: 0; }
.homepage .collection-tile { display: block; height: 100%; border-radius: 0; }
.homepage .collection-tile > div { background: var(--shop-home-paper); aspect-ratio: 1; }
.homepage .collection-tile > span { padding: 17px; font-size: 14px; line-height: 1.5; }
/* Home page - Custom print and services */
.homepage .services-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; }
.homepage .services-heading > div { max-width: 720px; }
.homepage .services-cta { flex-shrink: 0; }
.homepage .services-cta svg { width: 22px; height: 22px; }
.homepage .service { display: flex; flex-direction: column; gap: 18px; height: 100%; min-height: 260px; padding: 28px; border-radius: 24px; background: #f5f6f1; text-decoration: none; overflow: hidden; }
.homepage .service h3 { font-size: 26px; font-weight: 600; line-height: 1.25; letter-spacing: -.035em; margin: 0; }
.homepage .service p { color: var(--shop-muted); font-size: 15px; line-height: 1.7; margin: 0; }
.homepage .service-link { margin-top: auto; display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; font-weight: 600; }
.homepage .service-link svg { flex-shrink: 0; width: 20px; height: 20px; }
.homepage .service-custom { flex-direction: row; gap: 24px; padding: 14px; }
.homepage .service-custom > div { flex: 1; min-width: 0; padding: 14px; display: flex; flex-direction: column; gap: 18px; }
.homepage .service-custom img { width: 45%; height: 280px; min-height: 280px; object-fit: cover; border-radius: 16px; }
.homepage .service-symbol svg { width: 46px; height: 46px; color: var(--main-color); }
.homepage .service-photo { position: relative; min-height: 360px; color: #fff; }
.homepage .service-photo > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.homepage .service-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, #152219bd, #15221950 55%, #152219c9); }
.homepage .service-photo > div { position: relative; z-index: 1; display: flex; flex-direction: column; gap: 18px; flex: 1; }
.homepage .service-photo :is(h3, p, .service-link) { color: #fff; }
.homepage .service-highlight { background: var(--main-color); color: #fff; justify-content: space-between; }
.homepage .service-highlight h3 { font-size: 32px; max-width: 520px; }
.homepage .service-info nav a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-block: 12px; border-bottom: 1px solid var(--shop-line); font-size: 14px; text-decoration: none; background: transparent; border: 0; padding: 0; box-shadow: none; }
.homepage .service-info nav svg { width: 18px; height: 18px; flex-shrink: 0; }
.homepage .section-reviews { margin: 0; background: var(--shop-home-paper); }
.homepage .review-heading { display: flex; align-items: baseline; justify-content: space-between; flex-wrap: wrap; gap: 16px; }
.homepage .review-heading a { font-size: 14px; }
.homepage .review { height: 100%; padding: 28px; border: 1px solid var(--shop-line); background: #fff; margin: 0; }
.homepage .review p { font-size: 15px; line-height: 1.7; margin-block: 16px; overflow-wrap: anywhere; }
.homepage .review cite { font-size: 12px; margin-top: 24px; }
.homepage .review-empty p { font-size: 16px; margin: 0; }
/* Home page - Campaigns */
.homepage .section-campaigns { display: block; }
.homepage .campaign-card { height: 100%; overflow: hidden; }
.homepage .campaign-card :is(a, img) { display: block; width: 100%; }
.homepage .campaign-card img { height: auto; object-fit: contain; }
.homepage .campaign-card.is-side :is(a, img) { height: 100%; }
.homepage .campaign-card.is-side img { object-fit: cover; }
.homepage .campaign-slider, .homepage .campaign-card.is-side { position: relative; overflow: hidden; border-radius: 10px; }
.homepage .campaign-slider .carousel-item :is(a, img) { display: block; width: 100%; }
.homepage .campaign-slider .carousel-item img { aspect-ratio: 3 / 1; height: auto; object-fit: cover; }
.homepage .campaign-slider .slider-arrow { position: absolute; top: 50%; z-index: 3; display: grid; place-items: center; width: 40px; height: 40px; padding: 0; border: 1px solid var(--shop-line); border-radius: 50%; background: #fff; color: var(--second-color); box-shadow: 0 4px 16px #0000001f; transform: translateY(-50%); }
.homepage .campaign-slider .slider-arrow:hover { border-color: var(--main-color); color: var(--main-color); }
.homepage .campaign-slider .slider-arrow.prev { left: 12px; }
.homepage .campaign-slider .slider-arrow.next { right: 12px; }
.homepage .campaign-slider .carousel-indicators { margin-bottom: 10px; }
@media (max-width: 575px) { .homepage .campaign-slider .slider-arrow { width: 32px; height: 32px; } .homepage .campaign-slider .slider-arrow.prev { left: 8px; } .homepage .campaign-slider .slider-arrow.next { right: 8px; } .homepage .campaign-slider .carousel-indicators { margin-bottom: 4px; } }
.homepage .campaign-slider .carousel-indicators button { width: 8px; height: 8px; margin: 0 4px; border: 0; border-radius: 50%; }
@media (max-width: 991px) {    /* Home page - Custom print and services */
.homepage .services-heading { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 767px) {
    .homepage .story-copy { padding: 28px 25px; }
    .homepage .collection-tile > span { padding: 12px; font-size: 13px; }
    .homepage .service { padding: 24px; }
    .homepage .service-custom { flex-direction: column; padding: 12px; }
    .homepage .service-custom img { width: 100%; height: 230px; min-height: 0; }
    .homepage .service-custom > div { padding: 12px; }
    .homepage .review { padding: 24px; }
}

@media (max-width: 767px) {
    .homepage .section-heading { flex-direction: column; align-items: flex-start; }
    .homepage .section-actions { flex-wrap: wrap; max-width: 100%; }
}

/* Home page - Hero bento */
.homepage .hero { --section-padding: 32px; }
.homepage .hero .content { display: grid; grid-template-columns: 7fr 3fr; grid-template-rows: repeat(2, minmax(240px, auto)); gap: 18px; }
.homepage .hero .carousel { grid-row: span 2; min-width: 0; height: 520px; min-height: 500px; position: relative; border-radius: 10px; overflow: hidden; background: var(--second-color); color: #fff; }
.homepage .hero .carousel-inner, .homepage .hero .carousel-item { height: 100%; }
.homepage .hero .carousel-item > img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }
.homepage .hero .carousel-item::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, #101810b8, #10181035 70%); }
.homepage .hero .hero-copy { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; height: 100%; padding: 48px 40px 80px; max-width: 580px; }
.homepage .hero .heading { color: #fff; }
.homepage .hero .heading-box .heading-text { color: #fff; max-width: 410px; }
.homepage .hero .hero-controls { position: absolute; z-index: 2; bottom: 22px; left: 40px; display: flex; align-items: center; gap: 16px; }.homepage .hero .carousel-indicators { position: static; margin: 0; gap: 7px; }
.homepage .hero .carousel-indicators button { width: 7px; height: 7px; margin: 0; border: 0; border-radius: 50%; }
.homepage .hero .hero-box { display: flex; align-items: center; position: relative; isolation: isolate; overflow: hidden; border-radius: 10px; padding: 30px; color: var(--second-color); text-decoration: none; }
.homepage .hero .hero-box h2 { max-width: 270px; font-size: 26px; font-weight: 600; line-height: 1.2; letter-spacing: -.035em; margin: 0 0 18px; }
.homepage .hero .hero-box span:not(.t-btn) { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 600; }
.homepage .hero .hero-box p { font-size: 15px; line-height: 1.6; margin: 0 0 22px; }
.homepage .hero .hero-custom { color: #fff; background: var(--main-color); }
.homepage .hero .hero-custom h2 { color: #fff; }
.homepage .hero .hero-custom img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .2; z-index: -1; mix-blend-mode: luminosity; }
.homepage .hero .hero-box-content { position: relative; z-index: 1; }
.homepage .hero .hero-news { background: #080808; color: #fff; }
.homepage .hero .hero-news h2, .homepage .hero .hero-news p { color: #fff; }
.homepage .hero .hero-news img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.homepage .hero .hero-news::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, #000c, #0004); z-index: -1; }
/* Home page - Gift selection */
.homepage .section-gifts { --section-padding: 0px; }
.homepage .section-gifts .content { display: flex; align-items: center; flex-wrap: wrap; gap: 18px 30px; padding: 22px 28px; border-radius: 8px; background: #181818; color: #fff; }
.homepage .section-gifts .gift-label { font-size: 14px; font-weight: 700; }
.homepage .section-gifts .gift-links { display: flex; align-items: center; flex-wrap: wrap; gap: 14px 26px; background: transparent; border: 0; padding: 0; box-shadow: none; }
.homepage .section-gifts .gift-links a { color: #fff; font-size: 14px; text-decoration: none; background: transparent; border: 0; padding: 0; box-shadow: none; }
.homepage .section-gifts .gift-links a:hover { color: #ff9a9f; }
@media (max-width: 991px) {
    .homepage .hero .content { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: auto; }
    .homepage .hero .carousel { grid-column: span 2; grid-row: auto; height: 480px; min-height: 0; }
    .homepage .hero .hero-box { min-height: 230px; }
}
@media (max-width: 575px) {
    .homepage .hero { --section-padding: 25px; }
    .homepage .hero .content { grid-template-columns: minmax(0, 1fr); gap: 14px; }
    .homepage .hero .carousel { grid-column: auto; height: 520px; }
    .homepage .hero .hero-copy { padding: 30px 25px 80px; }
    .homepage .hero .hero-controls { left: 25px; }
    .homepage .hero .hero-box { min-height: 200px; padding: 25px; }
    .homepage .section-gifts .content { padding: 22px 25px; }
}

/* Home page - Slider navigation */
.homepage .hero .hero-controls > button { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; border: 1px solid #ffffff70; border-radius: 50%; background: transparent; color: #fff; }
.homepage .hero .hero-custom p { color: #fff; }

/* Home page - Klikateľný celý banner hlavného slidera; ovládanie ostáva nad ním (poznámka klienta 3. 11. 2026). */
.homepage .hero .hero-copy { position: static; }
.homepage .hero .hero-copy > * { position: relative; z-index: 1; }
.homepage .hero .carousel-item .t-btn::after { content: ''; position: absolute; inset: 0; z-index: 1; }
.homepage .hero .hero-copy > .t-btn { position: static; }

/* Home page - Inšpirácia: popis má pevnú výšku, aby dlaždice dole nerobili zuby (2 riadky, na mobile 3). */
.homepage .collection-tile > span { min-height: calc(2 * 1.5em + 34px); }
.homepage .collection-tile .collection-name { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; background: none; }
@media (max-width: 991px) {
    .homepage .collection-tile > span { min-height: calc(3 * 1.5em + 24px); }
    .homepage .collection-tile .collection-name { -webkit-line-clamp: 3; line-clamp: 3; }
}

/* Home page - Dobré vědět: väčšie odkazy, na mobile s väčším rozostupom. */
.homepage .service-info { min-height: 0; }
.homepage .service-info nav a { padding-block: 14px; color: var(--second-color); font-size: 16px; }
.homepage .service-info nav a:last-child { border-bottom: 0; }
.homepage .service-photo.service-highlight h3 { font-size: 32px; }

/* Home page - Odkaz banneru ceruzkou potrebuje položený rámik. */
.homepage .section-campaigns .carousel-item, .homepage .campaign-card { position: relative; }
/* Hover filter na tlačidle by z neho spravil obal pre ::after a klik mimo tlačidla by sa stratil (poznámka klienta 4. 11. 2026). */
.homepage .hero .carousel-item .t-btn:hover { filter: none; }
.homepage .hero .carousel-item:hover .t-btn { background: #f1f1f1; }

/* Home page - Skladem na mobile skákalo na druhý riadok, na PC ostáva (poznámka klienta 4. 11. 2026). */
@media (max-width: 767px) { .homepage .product-item .availability { display: none; } }