#co-je-drone-soccer{
    scroll-margin-top: 50px;
}

#produkty{
    scroll-margin-top: 80px;
}

.utility-bar {
    border-bottom:1px solid #1b2024;
    background:var(--color-bg-deep);
    color:var(--color-text);
    font-size:.75rem;
}

.utility-bar__inner {
    min-height:42px;

    display:grid;
    grid-template-columns:220px 1fr 220px;
    align-items:center;

    gap:24px;
}


.utility-bar__settings {
    display:flex;
    align-items:center;
    justify-content:flex-start;

    gap:18px;
}

.utility-bar__benefits {
    display:flex;
    align-items:center;
    justify-content:center;

    gap:36px;
}
.utility-bar__support {
    display:flex;
    align-items:center;
    justify-content:flex-end;

    gap:24px;
}


.utility-bar__benefits img {
    width:26px;
    height:26px;

    flex:0 0 26px;

    object-fit:contain;
}

.utility-bar__benefits span {
    display:flex;
    align-items:center;
    gap:5px
}
/*

.utility-bar__benefits img {
    width:26px;
    height:26px;

    flex:0 0 26px;

    object-fit:contain;

    
    filter:brightness(0) invert(1);

    transition:
        filter .18s ease,
        transform .18s ease;
}


.utility-bar__benefits span {
    display:flex;
    align-items:center;
    gap:5px;

    cursor:default;
}


.utility-bar__benefits span:hover img {
    filter:none;
    transform:translateY(-2px);
}
 */

.utility-bar__support {
    display:flex;
    align-items:center;
    justify-content:flex-end;
     gap:24px;
}

.utility-bar__support a {
    display:inline-flex;
    align-items:center;
    white-space:nowrap;
}

.site-header {
    position:sticky;
    z-index:50;
    top:0;
    border-bottom:1px solid var(--color-border);
    background:rgba(3,5,6,.97);
    backdrop-filter:blur(14px)
}

.site-header__inner {
    height:82px;

    display:grid;
    grid-template-columns:238px 1fr auto;
    align-items:center;

    gap:30px;
}

.brand {
    display:block;
    flex:0 0 auto;
}


.brand img {
    width:238px;
    height:auto;
}

.desktop-nav {
    display:flex;
    align-items:center;
    justify-content:center;

    gap:32px;

    margin-left:0;
}


.desktop-nav a:hover {
    color:var(--color-gold-bright)
}

.desktop-nav>span[aria-disabled=true] {
    color:#717980
}

.desktop-nav a,
.desktop-nav > span,
.mobile-menu a {
    text-decoration:none;

    font-size:.88rem;
    line-height:1.2;
    font-weight:700;
    letter-spacing:.01em;
    text-transform:uppercase;
    white-space:nowrap;
}


.header-actions {
    display:flex;
    align-items:center;
    justify-content:flex-end;

    gap:8px;

    margin-left:0;
}


.header-action {
    position: relative;
    width:44px;
    height:48px;

    display:grid;
    place-items:center;

    padding:0;

    border:0;
    background:transparent;

    color:#fff;
    cursor:pointer;
}

.header-cart-badge {
    position: absolute;
    top: -5px;
    right: -6px;
    min-width: 17px;
    height: 17px;
    padding: 0 4px;
    border-radius: 999px;
    background: var(--color-gold-bright);
    color: #07090b;
    font-size: 10px;
    font-weight: 900;
    line-height: 17px;
    text-align: center;
}

.header-action img,
.header-action svg {
    width:24px;
    height:24px;

    object-fit:contain;

    /* normálny stav = biela */
    filter:brightness(0) invert(1);

    transition:
        filter .18s ease,
        transform .18s ease;
}

.header-action:hover img,
.header-action:hover svg {
    /* hover = originálna GOLD zo SVG */
    filter:none;
    transform:translateY(-2px);
}

.header-action:disabled {
    opacity:1;
}

.menu-toggle {
    display:none;
    flex-direction:column;
    gap:4px
}

.menu-toggle span {
    display:block;
    width:20px;
    height:2px;
    background:currentColor
}

.mobile-menu {
    position:absolute;
    inset:74px 0 auto;
    padding:18px 16px 24px;
    border-bottom:1px solid var(--color-border);
    background:#070a0d;
    box-shadow:0 20px 40px rgba(0,0,0,.4)
}

.mobile-menu a {
    display:block;
    padding:14px;
    border-bottom:1px solid #20262b
}

.hero {
    position:relative;
    min-height:520px;
    isolation:isolate;
    overflow:hidden;
    
    background:#030506
}

.hero__backdrop {
    position:absolute;
    z-index:-2;
    inset:0;
    background:linear-gradient(90deg,rgba(1,3,4,.98),rgba(2,4,5,.79) 43%,rgba(3,5,6,.18) 73%),url('../images/backgrounds/hero-arena.png') center 56%/cover no-repeat;
    filter:saturate(.86)
}

.hero__backdrop::after {
    content:"";
    position:absolute;
    inset:0;
    background:linear-gradient(180deg,transparent 68%,var(--color-bg))
}

.hero__inner {
    min-height:520px;
    display:grid;
    grid-template-columns:minmax(0,1fr) minmax(420px,.95fr);
    align-items:center
}

.hero__copy {
    position:relative;
    z-index:2;
    max-width:570px;
    padding-block:54px
}

.hero h1 {
    max-width:620px;
    margin:0;
    font-size:clamp(3rem,5.2vw,4.8rem);
    line-height:.88;
    letter-spacing:-.035em;
    text-transform:uppercase
}

.hero h1 span {
    white-space:nowrap;
    display:block;
    color:var(--color-gold-bright)

}

.hero__lead {
    max-width:470px;
    margin:20px 0 24px;
    color:var(--color-text);
    font-size:clamp(.98rem,1.6vw,1.12rem)
}

.hero__actions {
    display:flex;
    flex-wrap:wrap;
    gap:12px
}

.hero__benefits {
    display:flex;
    flex-wrap:nowrap;
    align-items:center;

    gap:24px;

    margin:30px 0 0;
    padding:0;

    list-style:none;

    color:var(--color-text);

    font-size:.84rem;
    line-height:1.25;
}

.hero__benefits li {
    display:flex;
    align-items:center;

    gap:10px;

    min-width:0;
    min-height:54px;

    flex:0 0 auto;
}

.hero__benefits li span {
    white-space:nowrap;
}

.hero__benefits img {
    width:54px;
    height:54px;

    flex:0 0 54px;

    object-fit:contain;
}

.hero__drone {
    position:absolute;
    z-index:1;

    right:max(
        -10px,
        calc((100vw - var(--container)) / 2 - 20px)
    );

    bottom:85px;

    width:min(36vw, 480px);
    height:auto;

    filter:drop-shadow(
        0 18px 35px rgba(0, 0, 0, .7)
    );
}
/* =========================================================
   CATALOG CONTEXT / BREADCRUMB
   ========================================================= */

.catalog-context {
    position:sticky;
    top:82px;
    z-index:40;

    padding:10px 0;

    border-bottom:1px solid var(--color-border);

    background:var(--color-bg);
}

.catalog-context__row {
    display:grid;

    grid-template-columns:
        minmax(0, 1fr)
        auto
        minmax(0, 1fr);

    align-items:center;

    gap:20px;
}

.catalog-breadcrumb {
    justify-self:start;

    min-width:0;

    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:7px;

    font-size:.78rem;
    line-height:1.4;
}

.catalog-breadcrumb__link {
    padding:0;

    border:0;
    background:none;

    color:var(--color-text-muted);

    font:inherit;

    cursor:pointer;
}

.catalog-breadcrumb__link:hover {
    color:var(--color-gold-hover);
}

.catalog-breadcrumb__separator {
    color:var(--color-text-muted);
    opacity:.55;
}

.catalog-breadcrumb__current {
    color:var(--color-text);
    font-weight:700;
}

.catalog-context__count {
    justify-self:end;

    flex:0 0 auto;

    color:var(--color-text-muted);

    font-size:.76rem;
    white-space:nowrap;
}

/* =========================================================
   CATALOG FILTER BAR
   ========================================================= */

.catalog-filter-toggle {
    display:none;
}

.catalog-filterbar {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:8px;

    margin:0;
}

.catalog-filterbar__button {
    min-height:38px;

    padding:0 14px;

    display:inline-flex;
    align-items:center;
    justify-content:center;

    border:1px solid var(--color-border);
    border-radius:var(--radius-control);

    background:var(--color-surface);

    color:var(--color-text);

    font:inherit;
    font-size:.76rem;
    font-weight:700;

    cursor:pointer;

    transition:
        border-color .18s ease,
        color .18s ease,
        background .18s ease;
}

.catalog-filterbar__button:hover,
.catalog-filterbar__button.is-active {
    border-color:var(--color-gold-hover);
    color:var(--color-gold-hover);
}

.catalog-filterbar__button--icon {
    position:relative;

    width:38px;
    min-width:38px;
    padding:0;

    font-size:1.1rem;
}

.catalog-filterbar__button--icon img {
    width:20px;
    height:20px;

    display:block;
    object-fit:contain;
}

.catalog-filterbar__button:disabled {
    opacity:.35;
    cursor:default;
}

.catalog-filterbar__badge {
    position:absolute;
    top:-5px;
    right:-5px;

    min-width:17px;
    height:17px;

    padding:0 4px;

    display:flex;
    align-items:center;
    justify-content:center;

    border-radius:999px;

    background:var(--color-gold-hover);
    color:#080a0c;

    font-size:.58rem;
    line-height:1;
}

.catalog-active-filters {
    margin-top:8px;

    display:flex;
    align-items:center;
    gap:6px;
    flex-wrap:wrap;

    color:var(--color-text-muted);

    font-size:.67rem;
}


/* =========================================================
   FILTER PANEL
   ========================================================= */

.catalog-filter-panel {
    margin-top:10px;
    padding:16px;

    border:1px solid var(--color-border);
    border-radius:var(--radius-card);

    background:var(--color-surface);
}

.catalog-filter-panel__header {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:16px;

    margin-bottom:14px;
}

.catalog-filter-panel__title {
    font-size:.9rem;
}

.catalog-filter-panel__close {
    width:32px;
    height:32px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;

    border:0;
    background:none;

    color:var(--color-text);

    font-size:1.45rem;
    line-height:1;

    cursor:pointer;
}

.catalog-filter-panel__close:hover {
    color:var(--color-gold-hover);
}


/* =========================================================
   RADIO FILTERS
   ========================================================= */

.catalog-filter-radio-list {
    display:flex;
    align-items:center;
    flex-wrap:wrap;
    gap:10px 30px;
}


/* =========================================================
   JEDNA POLOŽKA
   ========================================================= */

.catalog-filter-radio {
    position:relative;

    min-height:40px;

    display:flex;
    align-items:center;
    gap:10px;

    cursor:pointer;

    font-size:.86rem;
    line-height:1.2;
}


/* =========================================================
   SKUTOČNÝ HTML RADIO INPUT
   ========================================================= */

.catalog-filter-radio > input[type="radio"] {
    position:absolute;

    width:1px;
    height:1px;

    margin:0;

    opacity:0;

    pointer-events:none;
}


/* =========================================================
   VONKAJŠÍ KRUH
   ========================================================= */

.catalog-filter-radio__circle {
    position:relative;

    display:block;

    width:22px;
    height:22px;

    flex:0 0 22px;

    box-sizing:border-box;

    border:2px solid var(--color-text-muted);
    border-radius:50%;

    background:transparent;

    transition:border-color .15s ease;
}


/* =========================================================
   VNÚTORNÝ KRUH
   NEVYBRANÝ = NEVIDITEĽNÝ
   ========================================================= */

.catalog-filter-radio__circle::after {
    content:"";

    position:absolute;

    top:50%;
    left:50%;

    width:14px;
    height:14px;

    border-radius:50%;

    background:var(--color-gold-hover);

    transform:translate(-50%, -50%);

    opacity:0;
}


/* =========================================================
   VYBRANÝ STAV

   zlatý vonkajší kruh
   tmavá medzera
   zlatý vnútorný kruh
   ========================================================= */

.catalog-filter-radio > input[type="radio"]:checked +
.catalog-filter-radio__circle {
    border-color:var(--color-gold-hover);
}


.catalog-filter-radio > input[type="radio"]:checked +
.catalog-filter-radio__circle::after {
    opacity:1;
}


/* =========================================================
   TEXT
   ========================================================= */

.catalog-filter-radio__label {
    color:var(--color-text);

    transition:color .15s ease;
}


/* =========================================================
   HOVER – NEVYBRANÝ
   ========================================================= */

.catalog-filter-radio:hover
.catalog-filter-radio__circle {
    border-color:#8b949c;
}


.catalog-filter-radio:hover
.catalog-filter-radio__label {
    color:#fff;
}


/* =========================================================
   HOVER – VYBRANÝ
   musí zostať ZLATÝ
   ========================================================= */

.catalog-filter-radio:hover >
input[type="radio"]:checked +
.catalog-filter-radio__circle {
    border-color:var(--color-text);
}


/* =========================================================
   KEYBOARD FOCUS
   ========================================================= */

.catalog-filter-radio >
input[type="radio"]:focus-visible +
.catalog-filter-radio__circle {
    outline:2px solid var(--color-gold-hover);
    outline-offset:3px;
}


.catalog-filter-radio:has(>
input[type="radio"]:disabled) {
    cursor:not-allowed;
    opacity:.45;
}


/* =========================================================
   PRICE FILTER
   ========================================================= */

.catalog-price-filter {
    max-width:520px;
}

.catalog-price-filter__summary,
.catalog-price-filter__bounds {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
}

.catalog-price-filter__summary {
    color:var(--color-text);
    font-size:.82rem;
}

.catalog-price-filter__summary output,
.catalog-price-filter__bounds,
.catalog-price-filter__empty {
    color:var(--color-text-muted);
    font-size:.72rem;
}

.catalog-price-filter__bounds {
    margin-top:12px;
}

.catalog-price-filter__range {
    position:relative;
    height:38px;
    margin:2px 10px 8px;
}

.catalog-price-filter__track,
.catalog-price-filter__active-track {
    position:absolute;
    top:50%;
    right:0;
    left:0;
    height:4px;
    border-radius:999px;
    transform:translateY(-50%);
}

.catalog-price-filter__track {
    background:var(--color-border);
}

.catalog-price-filter__active-track {
    background:var(--color-gold-hover);
}

.catalog-price-filter__range > input[type="range"] {
    position:absolute;
    inset:0;
    width:100%;
    height:38px;
    margin:0;
    appearance:none;
    pointer-events:none;
    background:transparent;
}

.catalog-price-filter__range > input[type="range"]:last-child {
    z-index:2;
}

.catalog-price-filter__range > input[type="range"]::-webkit-slider-runnable-track {
    height:4px;
    background:transparent;
}

.catalog-price-filter__range > input[type="range"]::-webkit-slider-thumb {
    width:22px;
    height:22px;
    margin-top:-9px;
    appearance:none;
    border:3px solid var(--color-surface);
    border-radius:50%;
    background:var(--color-gold-hover);
    box-shadow:0 0 0 1px var(--color-gold-hover);
    pointer-events:auto;
    cursor:pointer;
}

.catalog-price-filter__range > input[type="range"]::-moz-range-track {
    height:4px;
    background:transparent;
}

.catalog-price-filter__range > input[type="range"]::-moz-range-thumb {
    width:18px;
    height:18px;
    border:3px solid var(--color-surface);
    border-radius:50%;
    background:var(--color-gold-hover);
    box-shadow:0 0 0 1px var(--color-gold-hover);
    pointer-events:auto;
    cursor:pointer;
}

.catalog-price-filter__range > input[type="range"]:focus-visible::-webkit-slider-thumb {
    outline:2px solid var(--color-gold-hover);
    outline-offset:3px;
}

.catalog-price-filter__range > input[type="range"]:focus-visible::-moz-range-thumb {
    outline:2px solid var(--color-gold-hover);
    outline-offset:3px;
}

.catalog-price-filter__values {
    display:flex;
    align-items:flex-end;
    gap:10px;
}

.catalog-price-filter__values label {
    flex:1 1 0;

    display:flex;
    flex-direction:column;
    gap:6px;

    color:var(--color-text-muted);

    font-size:.68rem;
}

.catalog-price-filter__input-wrap {
    display:flex;
    align-items:center;
    height:40px;
    padding-right:10px;
    border:1px solid var(--color-border);
    border-radius:var(--radius-control);
    background:var(--color-surface-raised);
    color:var(--color-text-muted);
}

.catalog-price-filter__values input {
    width:100%;
    min-width:0;
    height:38px;

    padding:0 10px;

    border:0;
    outline:0;

    background:transparent;

    color:var(--color-text);

    font:inherit;
}

.catalog-price-filter__input-wrap:focus-within {
    border-color:var(--color-gold-hover);
    box-shadow:0 0 0 2px color-mix(in srgb,var(--color-gold-hover) 22%,transparent);
}

.catalog-price-filter__dash {
    padding-bottom:10px;

    color:var(--color-text-muted);
}

.catalog-filter-panel__apply {
    min-height:38px;
    margin-top:14px;
    padding:0 18px;
    border:1px solid var(--color-gold-hover);
    border-radius:var(--radius-control);
    background:var(--color-gold-hover);
    color:#080a0c;
    font:inherit;
    font-weight:700;
    cursor:pointer;
}

.catalog-filter-panel__apply:focus-visible {
    outline:2px solid var(--color-gold-hover);
    outline-offset:3px;
}

.catalog-filter-panel__apply:disabled {
    cursor:not-allowed;
    opacity:.45;
}


/* =========================================================
   PLACEHOLDER
   ========================================================= */

.catalog-filter-panel__placeholder {
    margin:0;

    color:var(--color-text-muted);

    font-size:.78rem;
}


/* =========================================================
   PRODUCT LISTING MODE
   ========================================================= */

.catalog-listing-mode .category-section {
    margin-top:0;
}

.catalog-listing-mode .product-section {
    padding-top:18px;
}



.category-section {
    position:relative;
    z-index:2;

    margin-top:-70px;
    padding-top:25px;
    padding-bottom:15px;
}

.category-rail {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));
    overflow:hidden;
    border:1px solid var(--color-border);
    border-radius:var(--radius-card);
    background:linear-gradient(145deg,#101419,#090c0f)
}

.category-card {
    min-width:0;
    min-height:174px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:10px;
    padding:16px 9px;
    border:0;
    border-right:1px solid var(--color-border);
    background:transparent;
    color:var(--color-text);
    cursor:pointer
}

.category-card:last-child {
    border-right:0
}

.category-card:hover,.category-card.is-active {
    background:rgba(255,196,0,.065);
    color:var(--color-gold-bright)
}

.category-card img {
    width:66px;
    height:66px;
    object-fit:contain
}

.category-card strong {
    font-size:.77rem;
    text-align:center;
    text-transform:uppercase
}

.category-card span {
    color:var(--color-gold-bright);
    font-size:.68rem;
    font-weight:800
}

.product-section {
    padding-top:10px
}

.product-tools {
    display:flex;
    align-items:center;
    gap:14px
}

.product-search {
    position:relative;
    display:flex;
    align-items:center
}

.product-search input {
    width:190px;
    height:38px;
    padding:0 38px 0 12px;
    border:1px solid var(--color-border);
    border-radius:var(--radius-control);
    background:#090c0f;
    color:var(--color-text)
}

.product-search img {
    position:absolute;
    right:11px;
    pointer-events:none
}

.result-count {
    color:var(--color-text-muted);
    font-size:.75rem
}

.product-grid {
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:16px;
}


/* =========================================================
   PRODUCT CARD
   ========================================================= */

.product-card {
    position:relative;
    min-width:0;
    overflow:hidden;

    display:flex;
    flex-direction:column;

    border:1px solid #343a42;
    border-radius:9px;

    background:
        linear-gradient(
            180deg,
            #0c1115 0%,
            #090d10 100%
        );

    box-shadow:
        0 10px 30px rgba(0,0,0,.22);

    transition:
        border-color .2s ease,
        transform .2s ease,
        box-shadow .2s ease;
}


.product-card:hover {
    border-color:#4a5159;

    transform:translateY(-2px);

    box-shadow:
        0 14px 34px rgba(0,0,0,.3);
}


/* =========================================================
   PRODUCT IMAGE
   ========================================================= */

.product-card__media {
    position:relative;

    height:220px;

    display:grid;
    place-items:center;

    padding:18px 16px 5px;

    overflow:hidden;

    background:
        radial-gradient(
            circle at 50% 48%,
            rgba(255,196,0,.055),
            transparent 62%
        );
}


.product-card__media > img {
    width:100%;
    height:100%;

    object-fit:contain;

    transition:transform .25s ease;
}


.product-card:hover .product-card__media > img {
    transform:scale(1.035);
}


/* =========================================================
   BADGE
   ========================================================= */


.product-card__badge {
    position:relative;
    z-index:3;

    min-height:28px;

    display:inline-flex;
    align-items:center;

    gap:6px;

    padding:5px 9px;

    border-radius:4px;

    background-color:var(--color-gold-bright);
    background-repeat:no-repeat;
    background-position:center;
    background-size:cover;

    color:#080a0c;

    font-size:.64rem;
    line-height:1;
    font-weight:900;
    letter-spacing:.035em;

    text-transform:uppercase;

    overflow:hidden;
}

.product-card__badges {
    position:absolute;
    z-index:3;

    top:14px;
    left:14px;

    max-width:calc(100% - 70px);

    display:flex;
    align-items:flex-start;
    flex-wrap:wrap;

    gap:6px;

    pointer-events:none;
}

.product-card__badge-icon {
    width:18px;
    height:18px;

    flex:0 0 18px;

    object-fit:contain;
}


.product-card__badge-label {
    position:relative;
    z-index:1;

    white-space:nowrap;
}


.product-card__badge--background-image {
    background-size:cover;
    background-position:center;
}

/* =========================================================
   FAVORITE
   ========================================================= */

.product-card__favorite {
    position:absolute;
    z-index:3;

    top:9px;
    right:10px;

    width:38px;
    height:38px;

    display:grid;
    place-items:center;

    padding:0;

    border:0;

    background:transparent;

    color:var(--color-text);

    font-family:Arial,sans-serif;
    font-size:1.8rem;
    font-weight:400;
    line-height:1;

    cursor:pointer;

    transition:
        color .18s ease,
        transform .18s ease;
}


.product-card__favorite:hover {
    color:var(--color-gold-bright);
    transform:scale(1.08);
}


/* =========================================================
   CONTENT
   ========================================================= */

.product-card__content {
    flex:1;

    display:flex;
    flex-direction:column;

    padding:8px 16px 16px;
}


.product-card__title,
.product-card h3 {
    margin:0;

    min-height:2.4em;

    color:#fff;

    font-size:1.08rem;
    line-height:1.2;
    font-weight:800;

    display:-webkit-box;
    -webkit-box-orient:vertical;
    -webkit-line-clamp:2;

    overflow:hidden;
}


/*
 * Popis MUSÍ zostať krátky.
 * API môže poslať dlhší short_description,
 * ale karta kvôli nemu nesmie meniť výšku.
 */

.product-card__description {
    min-height:1.3em;

    margin:4px 0 0;

    color:var(--color-text);

    font-size:.82rem;
    line-height:1.3;

    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
}


/* =========================================================
   SPECS
   ========================================================= */

.product-card__specs {
    min-height:25px;

    display:flex;
    align-items:center;
    flex-wrap:wrap;

    gap:6px 15px;

    margin-top:12px;

    color:var(--color-text);

    font-size:.73rem;
    font-weight:600;
}


.product-card__spec {
    position:relative;

    display:inline-flex;
    align-items:center;

    white-space:nowrap;
}


.product-card__spec + .product-card__spec::before {
    content:"";

    width:3px;
    height:3px;

    margin-right:12px;

    border-radius:50%;

    background:#555d64;
}


/* =========================================================
   RATING
   ========================================================= */

.product-card__rating {
    min-height:19px;

    display:flex;
    align-items:center;

    gap:6px;

    margin-top:8px;

    font-size:.72rem;
    line-height:1;
}


.product-card__stars {
    color:var(--color-gold-bright);

    font-size:.82rem;
    letter-spacing:1px;
}


.product-card__rating-count {
    color:#858d94;
}


/* =========================================================
   PRICE
   ========================================================= */

.product-card__price {
    display:flex;
    align-items:baseline;
    flex-wrap:wrap;

    gap:7px;

    margin-top:11px;

    color:#fff;

    font-size:1.38rem;
    line-height:1.1;
    font-weight:900;
}


.product-card__current {
    white-space:nowrap;
}


.product-card__regular {
    margin:0;

    color:var(--color-text);

    font-size:.76rem;
    font-weight:500;

    text-decoration:line-through;
}


.product-card__no-price {
    color:var(--color-text-muted);

    font-size:.88rem;
    font-weight:600;
}


/* =========================================================
   AVAILABILITY
   ========================================================= */

.product-card__availability {
    min-height:18px;

    margin-top:5px;

    color:#72df25;

    font-size:.75rem;
    line-height:1.2;
    font-weight:700;
}


.product-card__availability--in_stock {
    color:#72df25;
}


.product-card__availability--order {
    color:var(--color-gold-bright);
}


.product-card__availability--unavailable {
    color:#9ca3a9;
}


/* =========================================================
   ACTIONS
   ========================================================= */

.product-card__actions {
    display:grid;

    grid-template-columns:minmax(0,1fr) 46px;

    gap:8px;

    margin-top:13px;
}


/* =========================================================
   ADD TO CART
   ========================================================= */

.product-card__cart {
    min-width:0;
    height:44px;

    display:flex;
    align-items:center;
    justify-content:center;

    gap:9px;

    padding:0 13px;

    border:0;
    border-radius:5px;

    background:
        linear-gradient(
            180deg,
            #ffd21c,
            #ffbd00
        );

    color:#080a0c;

    font-size:.76rem;
    line-height:1;
    font-weight:900;

    cursor:pointer;

    transition:
        filter .18s ease,
        transform .18s ease;
}


.product-card__cart:hover {
    filter:brightness(1.06);
}


.product-card__cart:active {
    transform:translateY(1px);
}


/*
 * Používame existujúcu DroneSoccer ikonu.
 * frontend/assets/icons/cart.svg
 */

.product-card__cart-icon {
    width:20px;
    height:20px;

    flex:0 0 20px;

    fill:none;
    stroke:currentColor;
    stroke-width:10;
    stroke-linecap:round;
    stroke-linejoin:round;
}

/* =========================================================
   DETAIL
   ========================================================= */

.product-card__detail {
    width:46px;
    height:44px;

    display:grid;
    place-items:center;

    padding:0;

    border:1px solid #363d44;
    border-radius:5px;

    background:var(--color-surface);

    color:#dce1e5;

    cursor:pointer;

    transition:
        border-color .18s ease,
        color .18s ease,
        background .18s ease;
}


.product-card__detail:hover {
    border-color:var(--color-gold-bright);

    background:#11161a;

    color:var(--color-gold-bright);
}


/*
 * Oko kreslíme CSS.
 * Žiadny FontAwesome ani Unicode symbol.
 */

.product-card__detail-icon {
    position:relative;

    width:20px;
    height:13px;

    display:block;

    border:2px solid currentColor;
    border-radius:50% / 60%;

    transform:scaleY(.78);
}


.product-card__detail-icon::after {
    content:"";

    position:absolute;

    top:50%;
    left:50%;

    width:5px;
    height:5px;

    border-radius:50%;

    background:currentColor;

    transform:
        translate(-50%,-50%)
        scaleY(1.28);
}

@keyframes skeleton {
    to {
        background-position:-220% 0
    }
}

.promo-grid {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px
}



.promo-card {
    position:relative;
    isolation:isolate;
    min-height:310px;
    display:flex;
    align-items:end;
    overflow:hidden;
    border:1px solid var(--color-border);
    border-radius:var(--radius-card);
    background-position:center;
    background-size:cover
}

.promo-card::before {
    content:"";
    position:absolute;
    z-index:-1;
    inset:0;
    background:linear-gradient(90deg,rgba(3,5,6,.98),rgba(3,5,6,.73) 58%,rgba(3,5,6,.12))
}

.promo-card--clubs {
    border-color:rgba(255,196,0,.35);
    background-image:url('../images/backgrounds/promo-clubs.png')
}

.promo-card__benefits {
    margin:18px 0 24px;
    padding:0;

    list-style:none;

    display:grid;
    gap:9px;
}

.promo-card__benefits li {
    position:relative;

    padding-left:24px;

    font-size:.9rem;
    line-height:1.3;
}
.promo-card--clubs .promo-card__benefits li::before {
    content:"✓";

    position:absolute;
    left:0;
    top:0;

    color:var(--color-gold-bright);
    font-weight:900;
}
.promo-card--schools .promo-card__benefits li::before {
    content:"✓";

    position:absolute;
    left:0;
    top:0;

    color:var(--color-school);
    font-weight:900;
}

.promo-card--clubs {
    color:#fff;
}

.promo-card--schools {
    color:#20262b;
}

.promo-card--schools h2 {
    color:var(--color-school);
}

.promo-card--schools {
    background-image:url('../images/backgrounds/promo-schools.png')
}

.promo-card--schools::before {
    background:linear-gradient(90deg,rgba(238,244,249,.97),rgba(238,244,249,.78) 60%,rgba(238,244,249,.08))
}

.promo-card__content {
    max-width:72%;
    padding:30px
}

.promo-card h2 {
    margin:0;
    font-size:1.85rem;
    text-transform:uppercase
}

.promo-card p:not(.eyebrow) {
    margin:10px 0 20px;
    color:#d1d6d9
}

.promo-card--schools h2 {
    color:#0d62b0
}

.promo-card--schools p:not(.eyebrow) {
    color:#20262b
}

/* =========================================================
   FOOTER
   ========================================================= */

.site-footer {
    margin-top:0;

    border-top:0;

    background:#080b0d;
}

.site-footer__grid {
    display:grid;

    grid-template-columns:
        1.45fr
        .8fr
        .8fr
        1fr
        1fr
        .75fr
        .75fr;

    gap:28px;

    padding:38px 0 34px;
}

.footer-column {
    min-width:0;

    display:flex;
    flex-direction:column;

    align-items:flex-start;
}

.footer-column h2 {
    margin:0 0 12px;

    color:#fff;

    font-size:.8rem;
    line-height:1;

    font-weight:700;

    text-transform:uppercase;
}

.footer-column a {
    color:var(--color-text-muted);

    font-size:.78rem;
    line-height:1.55;

    text-decoration:none;

    transition:color .18s ease;
}

.footer-column a:hover {
    color:var(--color-gold-bright);
}


/* BRAND */

.footer-column--brand p {
    margin:12px 0 16px;

    color:var(--color-text-muted);

    font-size:.8rem;
    line-height:1.45;
}

.site-footer__logo {
    width:190px;
    height:auto;

    margin:0;
}


/* SOCIAL */

.footer-socials {
    display:flex;
    align-items:center;
    gap:18px;
    margin-top:18px;
}

.footer-socials a {
    display:flex;
    align-items:center;
    justify-content:center;

    width:30px;
    height:30px;

    padding:0;
    border:0;
    background:none;

    transition:transform .18s ease;
}



.footer-socials img {
    display:block;
    width:28px;
    height:28px;
    object-fit:contain;

    /* základ = biela */
    filter:brightness(0) invert(1);

    transition:
        filter .18s ease,
        transform .18s ease;
}

.footer-socials a:hover img {
    /* hover = pôvodná farba SVG */
    filter:none;
    transform:translateY(-3px);
}

.footer-socials a:hover {
    transform:translateY(-3px);
}

/* CONTACT */

.footer-column--contact address {
    margin-top:8px;

    color:var(--color-text-muted);

    font-size:.78rem;
    line-height:1.45;

    font-style:normal;
}


/* PAYMENTS */

.footer-payments {
    display:flex;
    flex-direction:column;

    align-items:flex-start;

    gap:10px;
}

.footer-payments span {
    color:#fff;

    font-size:.8rem;
    font-weight:700;
}


/* LEGAL */

.site-footer__bottom {
    border-top:1px solid #1d2227;
}

.site-footer__legal {
    min-height:52px;

    display:flex;
    align-items:center;
    justify-content:space-between;

    gap:24px;

    padding:12px 0;

    color:#7f878e;

    font-size:.74rem;
}

.site-footer__legal nav {
    display:flex;
    align-items:center;

    gap:28px;
}

.site-footer__legal a {
    color:#7f878e;

    text-decoration:none;
}

.site-footer__legal a:hover {
    color:var(--color-gold-bright);
}

/* =========================================================
   ARÉNY
   ========================================================= */

.arena-section {
    padding: 28px 0 32px;
}

.arena-section__heading {
    margin-bottom: 14px;
    padding-top: 10px;
    border-top: 1px solid var(--color-border);
}

.arena-section__heading h2 {
    margin: 0;
    color: var(--color-text);
    font-size: 1.65rem;
    font-weight: 800;
    line-height: 1;
    text-transform: uppercase;
}

.arena-grid {
    display: grid;
    grid-template-columns:
        minmax(0, 1fr)
        minmax(0, 1fr)
        minmax(0, 1fr)
        minmax(240px, .95fr);
    gap: 10px;
}


/* KARTA ARÉNY */

.arena-card {
    position: relative;
    min-height: 180px;
    overflow: hidden;

    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);

    background-color: var(--color-surface);
    background-position: center;
    background-size: cover;
    background-repeat: no-repeat;
}

.arena-card::before {
    content: "";
    position: absolute;
    inset: 0;

    background:
        linear-gradient(
            90deg,
            rgba(2,3,4,.96) 0%,
            rgba(2,3,4,.78) 48%,
            rgba(2,3,4,.18) 100%
        );
}

.arena-card__content {
    position: relative;
    z-index: 1;

    display: flex;
    flex-direction: column;

    min-height: 180px;
    padding: 20px;
}

.arena-card h3 {
    margin: 0 0 6px;

    color: var(--color-gold-bright);

    font-size: 1.15rem;
    font-weight: 800;
    line-height: 1.05;
    text-transform: uppercase;
}

.arena-card p {
    max-width: 220px;
    margin: 0;

    color: var(--color-text);

    font-size: .88rem;
    line-height: 1.35;
}

.arena-card__link {
    display: inline-flex;
    align-items: center;
    gap: 8px;

    width: max-content;
    margin-top: auto;

    color: var(--color-gold-bright);

    font-size: .9rem;
    font-weight: 800;
    text-decoration: none;
}

.arena-card__link span {
    transition: transform .18s ease;
}

.arena-card__link:hover span {
    transform: translateX(4px);
}


/* OBRÁZKY ARÉN
   Sem potom dáme reálne obrázky.
*/

.arena-card--inflatable {
    background-image:
        url("../images/content/arena.png");
}

.arena-card--wood {
    background-image:
        url("../images/content/arena.png");
}

.arena-card--metal {
    background-image:
        url("../images/content/arena.png");
}


/* PORADENSTVO */

.arena-help {
    display: flex;
    align-items: flex-start;
    gap: 14px;

    min-height: 180px;
    padding: 20px;

    border: 1px solid var(--color-border);
    border-radius: var(--radius-card);

    background: var(--color-surface);
}

.arena-help > img {
    width: 42px;
    height: 42px;
    flex: 0 0 42px;
    object-fit: contain;
}

.arena-help__content {
    display: flex;
    flex-direction: column;
    min-width: 0;
    min-height: 138px;
}

.arena-help h3 {
    margin: 0 0 7px;

    color: var(--color-text);

    font-size: 1.05rem;
    font-weight: 800;
    line-height: 1.05;
    text-transform: uppercase;
}

.arena-help p {
    margin: 0 0 15px;

    color: var(--color-text-muted);

    font-size: .84rem;
    line-height: 1.4;
}

.arena-help .button {
    align-self: flex-start;
    margin-top: auto;
}


/* =========================================================
   ČO JE DRONE SOCCER
   ========================================================= */

.about-dronesoccer-section {
    padding:28px 0 30px;
}


.about-dronesoccer__heading {
    padding-top:12px;
    margin-bottom:18px;

    border-top:1px solid var(--color-border);
}


.about-dronesoccer__heading h2 {
    margin:0;

    color:var(--color-text);

    font-size:1.7rem;
    line-height:1;
    font-weight:800;

    text-transform:uppercase;
}


/* =========================================================
   GRID
   ========================================================= */

.about-dronesoccer__grid {
    display:grid;

    grid-template-columns:
        minmax(0,1.7fr)
        minmax(300px,.95fr)
        minmax(210px,.62fr);

    gap:14px;

    align-items:stretch;
}


/* =========================================================
   3 KROKY
   ========================================================= */

.about-dronesoccer__steps {
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));

    gap:16px;
}


.about-step {
    position:relative;

    min-width:0;

    padding:24px 6px 4px;

    text-align:left;
}


.about-step::after {
    content:"";

    position:absolute;

    top:17px;
    left:50%;

    width:80%;

    height:1px;

    background:
        linear-gradient(
            90deg,
            rgba(255,196,0,.28),
            rgba(255,196,0,.05)
        );

    z-index:-1;
}


.about-step:last-child::after {
    display:none;
}


.about-step__number {
    position:absolute;

    top:0;
    left:24px;

    width:28px;
    height:28px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:var(--color-gold-bright);

    color:#060708;

    font-size:.82rem;
    font-weight:900;
}


.about-step img {
    width:72px;
    height:72px;

    display:block;

    margin:18px 0 12px;

    object-fit:contain;
}


.about-step h3 {
    margin:0 0 8px;

    color:#fff;

    font-size:1rem;
    line-height:1.05;
    font-weight:800;

    text-transform:uppercase;
}


.about-step p {
    max-width:180px;

    margin:0;

    color:var(--color-text-muted);

    font-size:.82rem;
    line-height:1.45;
}


/* =========================================================
   VIDEO
   ========================================================= */

.about-dronesoccer__video {
    position:relative;

    min-height:210px;

    display:block;

    overflow:hidden;

    border:1px solid var(--color-border);
    border-radius:var(--radius-card);

    background:#080b0e;
}


.about-dronesoccer__video img {
    width:100%;
    height:100%;

    display:block;

    object-fit:cover;
}


.about-dronesoccer__video::after {
    content:"";

    position:absolute;
    inset:0;

    background:rgba(0,0,0,.12);

    transition:background .2s ease;
}


.about-dronesoccer__video:hover::after {
    background:rgba(0,0,0,.02);
}


.about-dronesoccer__play {
    position:absolute;
    z-index:2;

    top:50%;
    left:50%;

    width:58px;
    height:58px;

    display:grid;
    place-items:center;

    border-radius:50%;

    background:#fff;

    color:#111;

    font-family:Arial,sans-serif;
    font-size:1.35rem;

    transform:translate(-50%,-50%);

    transition:
        transform .2s ease,
        background .2s ease;
}


.about-dronesoccer__video:hover .about-dronesoccer__play {
    background:var(--color-gold-bright);

    transform:
        translate(-50%,-50%)
        scale(1.06);
}

    
/* =========================================================
   FIDA
   ========================================================= */

.about-dronesoccer__fida {
    min-height:210px;

    display:flex;
    flex-direction:column;

    padding:18px;

    border:1px solid var(--color-border);
    border-radius:var(--radius-card);

    background:
        linear-gradient(
            145deg,
            var(--color-surface),
            #07090b
        );
}


.about-dronesoccer__fida p {
    margin:0;

    color:#fff;

    font-size:.84rem;
    line-height:1.45;
}


.about-dronesoccer__fida-logo {
    width:150px;
    max-width:100%;
    height:auto;

    margin:18px auto;
}


.button--fida {
    margin-top:auto;

    background:#df481c;

    color:#fff;

    border:1px solid #df481c;
}


.button--fida:hover {
    background:#f05223;

    border-color:#f05223;

    transform:translateY(-2px);
}

/* =========================================================
   FIDA BANNER
   ========================================================= */

.fida-banner-section {
    padding:28px 0 32px;
}

.fida-banner {
    position:relative;
    min-height:220px;

    display:grid;
    grid-template-columns:360px 390px 1fr;
    grid-template-rows:1fr;
    align-items:center;

    overflow:hidden;

    border:1px solid var(--color-border);
    border-radius:var(--radius-card);

    background:
        linear-gradient(
            90deg,
            rgba(2,4,6,.97) 0%,
            rgba(2,4,6,.84) 31%,
            rgba(2,4,6,.22) 60%,
            rgba(2,4,6,.04) 100%
        ),
        url("../images/backgrounds/bg_fida_baner.png")
        100% center / 90% auto no-repeat;
}

.fida-banner__content {
    position:relative;
    z-index:2;

    grid-column:1;
    grid-row:1;

    align-self:start;

    padding:28px 0 0 32px;
}

.fida-banner__content h2 {
    margin:0;

    color:#fff;

    font-size:2rem;
    line-height:1;
    font-weight:800;

    text-transform:uppercase;
}

.fida-banner__content p {
    max-width:300px;

    margin:12px 0 0;

    color:#d5dadd;

    font-size:.92rem;
    line-height:1.4;
}

.fida-banner__logo-wrap {
    position:relative;
    z-index:2;

    grid-column:2;
    grid-row:1;

    min-height:220px;

    display:flex;
    align-items:center;
    justify-content:flex-start;

    padding:0;
}

.fida-banner__logo {
    width:360px;
    max-width:100%;
    height:auto;

    margin:0;

    filter:drop-shadow(
        0 12px 26px rgba(0,0,0,.45)
    );
}

.fida-banner__action {
    position:relative;
    z-index:2;

    grid-column:1;
    grid-row:1;

    align-self:end;
    justify-self:start;

    display:flex;
    justify-content:flex-start;

    padding:0 0 26px 32px;
}

.fida-banner__action .button {
    margin:0;
}



/* =========================================================
   BENEFITS STRIP
   ========================================================= */

.benefits-strip {
    border-top:1px solid var(--color-border);
    border-bottom:1px solid var(--color-border);

    background:#080b0d;
}

.benefits-strip__grid {
    display:grid;
    grid-template-columns:repeat(6,minmax(0,1fr));

    align-items:center;

    min-height:86px;
}

.benefit-item {
    min-width:0;

    display:flex;
    align-items:center;

    gap:12px;

    padding:16px 18px;

    border-right:1px solid #1f252a;
}

.benefit-item:last-child {
    border-right:0;
}

.benefit-item img {
    width:42px;
    height:42px;

    flex:0 0 42px;

    object-fit:contain;
}

.benefit-item span {
    color:#d8dde1;

    font-size:.82rem;
    line-height:1.28;

    white-space:nowrap;
}
/*
@media(max-width:1100px) {
    .desktop-nav {
        gap:13px
    }
    .desktop-nav a,.desktop-nav>span {
        font-size:.64rem
    }
    .brand img {
        width:180px
    }
    .utility-bar__benefits {
        gap:34px
    }
}*/

@media(max-width:980px) {
    .utility-bar {
        display:none
    }
    .desktop-nav {
        display:none
    }
    .menu-toggle {
        display:inline-flex
    }
    .header-actions {
        margin-left:auto
    }
    .hero__copy {
        max-width:57%
    }
    .hero__drone {
        right: -2%;
        width: 52vw;
    }
    .category-rail {
        grid-template-columns:repeat(3,1fr)
    }
    .category-card {
        border-bottom:1px solid var(--color-border)
    }
    .category-card:nth-child(3n) {
        border-right:0
    }
    .product-grid {
        grid-template-columns:repeat(2,minmax(0,1fr))
    }

     .about-dronesoccer__grid {
        grid-template-columns:1fr 1fr;
    }

    .about-dronesoccer__steps {
        grid-column:1 / -1;
    }

    .benefits-strip__grid {
        grid-template-columns:repeat(3,minmax(0,1fr));
    }

    .benefit-item:nth-child(3n) {
        border-right:0;
    }

    .benefit-item:nth-child(-n+3) {
        border-bottom:1px solid #1f252a;
    }

    .site-footer__grid {
        grid-template-columns:repeat(4,minmax(0,1fr));
        gap:30px 24px;
    }

    .footer-column--brand {
        grid-column:span 2;
    }
}

@media(max-width:640px) {
    .container {
        width:min(calc(100% - 24px),var(--container))
    }
    .site-header__inner {
        height:64px;
        gap:12px
    }
    .brand img {
        width:168px
    }
    .desktop-only {
        display:none
    }
    .mobile-menu {
        inset:64px 0 auto
    }


/* =========================================================
   HERO – MOBILE
   ========================================================= */

.hero {
    min-height:0;
    height:auto;
    padding:0;
}

.hero__inner {
    min-height:0;
    height:auto;

    display:block;

    padding-top:0;
    padding-bottom:0;
}

.hero__copy {
    margin:0;
    padding:22px 0 20px;

    max-width:100%;

    align-self:auto;
}

.hero h1 {
    margin:0;

    max-width:none;

    font-size:clamp(1.9rem, 9vw, 2.7rem);
    line-height:.92;
}

.hero__lead,
.hero__actions,
.hero__benefits,
.hero__drone {
    display:none;
}



.catalog-context {
    top:64px;

    padding:8px 0;
}

.catalog-context__row {
    display:grid;

    grid-template-columns:
        minmax(0,1fr)
        auto
        auto;

    grid-template-areas:
        "breadcrumb toggle count"
        "filters filters filters";

    align-items:center;

    gap:8px 7px;
}

.catalog-filter-toggle {
    grid-area:toggle;

    width:32px;
    height:32px;

    display:flex;
    align-items:center;
    justify-content:center;

    padding:0;

    border:1px solid var(--color-border);
    border-radius:var(--radius-control);

    background:var(--color-surface);

    cursor:pointer;
}

.catalog-filter-toggle img {
    width:19px;
    height:19px;

    display:block;

    object-fit:contain;
}

.catalog-filter-toggle:hover,
.catalog-filter-toggle.is-active {
    border-color:var(--color-gold-line);
}




.catalog-breadcrumb {
    grid-area:breadcrumb;

    justify-self:start;

    min-width:0;

    display:flex;
    align-items:center;
    flex-wrap:nowrap;

    overflow-x:auto;
    overflow-y:hidden;

    white-space:nowrap;

    scrollbar-width:none;
}

.catalog-breadcrumb::-webkit-scrollbar {
    display:none;
}


.catalog-context__count {
    grid-area:count;

    justify-self:end;

    font-size:.68rem;
    white-space:nowrap;
}


.catalog-listing-mode .category-section {
    padding-top:10px;
    padding-bottom:12px;
}


.catalog-filterbar {
    grid-area:filters;

    width:100%;

    display:none;
    align-items:center;
    justify-content:center;

    gap:6px;

    margin:0;
    padding-top:2px;
    padding-bottom:2px;

    overflow-x:auto;
    overflow-y:hidden;

    scrollbar-width:none;
}

.catalog-filterbar.is-mobile-open {
    display:flex;
}

.catalog-filterbar::-webkit-scrollbar {
    display:none;
}


.catalog-filterbar__button {
    flex:0 0 auto;

    min-height:34px;

    padding:0 10px;

    font-size:.68rem;
}

.catalog-filterbar__button--icon {
    width:34px;
    min-width:34px;

    padding:0;

    font-size:1rem;
}


.catalog-filter-panel {
    margin-top:8px;
    padding:12px;

    border-radius:var(--radius-card);
}

.catalog-filter-panel__header {
    margin-bottom:10px;
}


.catalog-filter-radio-list {
    flex-direction:column;
    align-items:stretch;

    gap:2px;
}

.catalog-filter-radio {
    min-height:44px;

    font-size:.86rem;
}


.catalog-price-filter__values {
    gap:7px;
}


.catalog-active-filters {
    margin-top:6px;

    font-size:.62rem;
}
    /* =========================================================
   KATEGÓRIE – MOBILE DASHBOARD
   ========================================================= */

.category-section {
    margin-top:0;
    padding-top:16px;
    padding-bottom:18px;
}

.category-rail {
    display:grid;
    grid-template-columns:repeat(2, minmax(0, 1fr));

    gap:10px;

    width:100%;
    max-width:100%;

    margin:0;
    padding:0;

    overflow:visible;

    border:0;
    border-radius:0;

    background:none;

    scroll-snap-type:none;
}

.category-card {
    width:100%;
    min-width:0;
    min-height:142px;

    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;

    gap:9px;

    padding:14px 8px;

    border:1px solid var(--color-border) !important;
    border-radius:var(--radius-card);

    background:var(--color-surface);

    box-sizing:border-box;

    scroll-snap-align:none;
}

.category-card img {
    width:58px;
    height:58px;

    max-width:100%;

    object-fit:contain;
}

.category-card strong {
    font-size:.78rem;
    line-height:1.15;

    text-align:center;
}

.category-card span {
    font-size:.66rem;
    line-height:1.15;

    text-align:center;
}

    .product-tools {
        align-items:flex-end;
        flex-direction:column;
        gap:5px
    }
    .product-search input {
        width:150px
    }
    .product-grid {
        gap:10px
    }
    .product-card__content {
        padding:12px
    }
    .product-card h3 {
        font-size:.94rem
    }
    .product-card__description {
        font-size:.76rem
    }
    .product-card__price {
        font-size:1.05rem
    }
    .product-card__regular {
        display:block;
        margin:2px 0 0
    }
    .promo-grid {
        grid-template-columns:1fr
    }
    .promo-card {
        min-height:300px
    }
    .promo-card__content {
        max-width:86%;
        padding:26px
    }
    .site-footer__inner {
        grid-template-columns:1fr
    }
    .site-footer nav {
        grid-template-columns:1fr 1fr
    }
     .about-dronesoccer__grid {
        grid-template-columns:1fr;
    }

    .about-dronesoccer__steps {
        grid-template-columns:1fr;
    }

    .about-step {
        padding-left:82px;
        min-height:100px;
    }

    .about-step__number {
        left:0;
    }

    .about-step img {
        position:absolute;

        left:0;
        top:30px;

        width:60px;
        height:60px;

        margin:0;
    }

    .about-step::after {
        display:none;
    }
    .fida-banner {
    display:flex;
    flex-direction:column;
    align-items:flex-start;

    min-height:360px;

    background-position:68% center;
    background-size:cover;
}

.fida-banner__content {
    width:100%;

    padding:24px 24px 0;

    text-align:left;
}

.fida-banner__content h2 {
    margin:0;
    text-align:left;
}

.fida-banner__content p {
    margin:12px 0 0;
    text-align:left;
}

.fida-banner__logo-wrap {
    width:100%;
    min-height:0;

    display:flex;
    align-items:center;
    justify-content:flex-start;

    padding:18px 24px 0;
}

.fida-banner__logo {
    width:220px;
    max-width:58%;

    margin:0;
}

.fida-banner__action {
    width:100%;

    margin-top:auto;

    display:flex;
    align-items:center;
    justify-content:flex-start;

    padding:18px 24px 24px;
}

.fida-banner__action .button {
    margin:0;
}

.benefits-strip__grid {
        grid-template-columns:repeat(2,minmax(0,1fr));
    }

    .benefit-item {
        min-height:76px;

        padding:12px 10px;

        gap:9px;
    }

    .benefit-item:nth-child(odd) {
        border-right:1px solid #1f252a;
    }

    .benefit-item:nth-child(even) {
        border-right:0;
    }

    .benefit-item:not(:nth-last-child(-n+2)) {
        border-bottom:1px solid #1f252a;
    }

    .benefit-item img {
        width:36px;
        height:36px;

        flex:0 0 36px;
    }

    .benefit-item span {
        font-size:.74rem;
        white-space:normal;
    }

     .site-footer__grid {
        grid-template-columns:repeat(2,minmax(0,1fr));

        gap:28px 18px;

        padding:30px 0;
    }

    .footer-column--brand {
        grid-column:1 / -1;
    }

    .footer-column--contact {
        grid-column:1 / -1;
    }

    .site-footer__legal {
        align-items:flex-start;
        flex-direction:column;

        gap:10px;
    }

    .site-footer__legal nav {
        flex-wrap:wrap;
        gap:8px 20px;
    }
    /* =========================================================
   ARÉNY – MOBILE
   ========================================================= */

.arena-section {
    padding:24px 0 28px;
}

.arena-section__heading {
    margin-bottom:12px;
}

.arena-section__heading h2 {
    font-size:1.5rem;
}

.arena-grid {
    grid-template-columns:1fr;
    gap:12px;
}

.arena-card,
.arena-help {
    min-height:190px;
}

.arena-card__content {
    min-height:190px;
    padding:20px;
}

.arena-card h3 {
    max-width:180px;
    font-size:1.15rem;
}

.arena-card p {
    max-width:200px;
    font-size:.85rem;
}

.arena-help {
    padding:20px;
}

.arena-help__content {
    min-height:148px;
}
}

@media(max-width:350px) {
    .brand img {
        width:145px
    }
    .hero__actions {
        align-items:stretch;
        flex-direction:column
    }
    .hero__actions .button {
        width:100%
    }
    .hero__copy {
        padding-top:180px
    }
    .hero__drone {
        right:-95px
    }
    .product-search input {
        width:138px
    }
    .product-grid {
        gap:8px
    }
    .product-card__content {
        padding:10px
    }
    .product-card h3 {
        font-size:.88rem
    }
}