.__font_geist_1qyd02f { font-family: Geist, sans-serif; }
.__variable_geist_1qyd02f { --font-geist-sans: 'Geist', sans-serif; }
.__font_geist_mono_0vffvn2 { font-family: "Geist Mono", sans-serif; }
.__variable_geist_mono_0vffvn2 { --font-geist-mono: 'Geist Mono', sans-serif; }



/* Geist Sans – variabilní font */
@font-face {
    font-family: "Geist";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("./assets/geist-sans/Geist-Variable.woff2") format("woff2");
}

/* Geist Mono – variabilní font */
@font-face {
    font-family: "Geist Mono";
    font-style: normal;
    font-weight: 100 900;
    font-display: swap;
    src: url("./assets/geist-mono/GeistMono-Variable.woff2") format("woff2");
}

:root {
    --font-geist-sans: "Geist", Arial, sans-serif;
    --font-geist-mono: "Geist Mono", Consolas, monospace;
}

.__font_geist_1cgt27d {
    font-family: var(--font-geist-sans);
}

.__variable_geist_1cgt27d {
    --font-geist-sans: "Geist", Arial, sans-serif;
}

.__font_geist_mono {
    font-family: var(--font-geist-mono);
}

.__variable_geist_mono {
    --font-geist-mono: "Geist Mono", Consolas, monospace;
}
.__font_geist_1cgt27d { font-family: Geist, sans-serif; }
.__variable_geist_1cgt27d { --font-geist-sans: 'Geist', sans-serif; }




.__font_geist_mono_0qt52br { font-family: "Geist Mono", sans-serif; }
.__variable_geist_mono_0qt52br { --font-geist-mono: 'Geist Mono', sans-serif; }


@layer theme, base, components, utilities;
@layer theme {
    :root, :host { --font-sans: ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji",
    "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";--font-mono: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono",
    "Courier New", monospace; --spacing: 0.25rem; --default-font-family: var(--font-sans); --default-mono-font-family: var(--font-mono); }
}
@layer base {
    *, ::after, ::before, ::backdrop, ::file-selector-button { box-sizing: border-box; margin: 0px; padding: 0px; border: 0px solid; }
    html, :host { line-height: 1.5; text-size-adjust: 100%; tab-size: 4; font-family: var(--default-font-family, ui-sans-serif, system-ui, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji"); font-feature-settings: var(--default-font-feature-settings, normal); font-variation-settings: var(--default-font-variation-settings, normal); -webkit-tap-highlight-color: transparent; }
    hr { height: 0px; color: inherit; border-top-width: 1px; }
    abbr:where([title]) { text-decoration: underline dotted; }
    h1, h2, h3, h4, h5, h6 { font-size: inherit; font-weight: inherit; }
    a { color: inherit; text-decoration: inherit; }
    b, strong { font-weight: bolder; }
    code, kbd, samp, pre { font-family: var(--default-mono-font-family, ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace); font-feature-settings: var(--default-mono-font-feature-settings, normal); font-variation-settings: var(--default-mono-font-variation-settings, normal); font-size: 1em; }
    small { font-size: 80%; }
    sub, sup { font-size: 75%; line-height: 0; position: relative; vertical-align: baseline; }
    sub { bottom: -0.25em; }
    sup { top: -0.5em; }
    table { text-indent: 0px; border-color: inherit; border-collapse: collapse; }
    progress { vertical-align: baseline; }
    summary { display: list-item; }
    ol, ul, menu { list-style: none; }
    img, svg, video, canvas, audio, iframe, embed, object { display: block; vertical-align: middle; }
    img, video { max-width: 100%; height: auto; }
    button, input, select, optgroup, textarea, ::file-selector-button { font: inherit; letter-spacing: inherit; color: inherit; border-radius: 0px; background-color: transparent; opacity: 1; }
    :where(select:is([multiple], [size])) optgroup { font-weight: bolder; }
    :where(select:is([multiple], [size])) optgroup option { padding-inline-start: 20px; }
    ::file-selector-button { margin-inline-end: 4px; }
    ::placeholder { opacity: 1; }
    @supports (not (-webkit-appearance: -apple-pay-button)) or (contain-intrinsic-size: 1px) {
        ::placeholder {
            color: currentcolor;
            @supports (color: color-mix(in lab, red, red)) {
                color: color-mix(currentcolor, transparent);
            }
        }
    }
    textarea { resize: vertical; }
    ::-webkit-search-decoration { appearance: none; }
    ::-webkit-date-and-time-value { min-height: 1lh; text-align: inherit; }
    ::-webkit-datetime-edit { display: inline-flex; }
    ::-webkit-datetime-edit-fields-wrapper { padding: 0px; }
    ::-webkit-datetime-edit, ::-webkit-datetime-edit-year-field, ::-webkit-datetime-edit-month-field, ::-webkit-datetime-edit-day-field, ::-webkit-datetime-edit-hour-field, ::-webkit-datetime-edit-minute-field, ::-webkit-datetime-edit-second-field, ::-webkit-datetime-edit-millisecond-field, ::-webkit-datetime-edit-meridiem-field { padding-block: 0px; }
    ::-webkit-calendar-picker-indicator { line-height: 1; }
    button, input:where([type="button"], [type="reset"], [type="submit"]), ::file-selector-button { appearance: button; }
    ::-webkit-inner-spin-button, ::-webkit-outer-spin-button { height: auto; }
    [hidden]:where(:not([hidden="until-found"])) { display: none !important; }
}
@layer utilities {
    .visible { visibility: visible; }
    .relative { position: relative; }
    .start { inset-inline-start: var(--spacing); }
    .table { display: table; }
    .antialiased { -webkit-font-smoothing: antialiased; }
}
:root { --ink: #101b24; --ink-light: #182a35; --cream: #f3ead8; --paper: #fbf7ed; --gold: #c5a45b; --gold-light: #dcc47f; --rust: #9e4638; --muted: #657078; }
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0px; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
a { color: inherit; text-decoration: none; }
p { margin: 0px; }
.screen-reader-text {
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    overflow: hidden;
    position: absolute !important;
    white-space: nowrap;
    width: 1px;
}
.screen-reader-text:focus,
.screen-reader-text:focus-visible {
    background: var(--paper);
    clip: auto !important;
    clip-path: none;
    color: var(--ink);
    height: auto;
    left: 16px;
    outline: 3px solid var(--gold-light);
    padding: 12px 16px;
    top: 16px;
    width: auto;
    z-index: 100001;
}
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible {
    outline: 3px solid var(--gold-light);
    outline-offset: 4px;
}
.site-header {     z-index: 20000;align-items: center; background: rgba(16, 27, 36, 0.96); border-bottom: 1px solid rgba(197, 164, 91, 0.45);
    color: var(--cream); display: flex; height: 84px; justify-content: space-between; padding: 0px clamp(24px, 5vw, 80px); position: sticky; top: 0px;  }
.brand { align-items: center; display: flex; gap: 18px; font-family: Georgia, "Times New Roman", serif; font-size: 18px; letter-spacing: 0.08em; text-transform: uppercase; }
.deco-mark { align-items: center; display: inline-flex; gap: 7px; }
.deco-mark i { background: var(--gold); display: block; height: 1px; width: 12px; }
.deco-mark b { align-items: center; border: 1px solid var(--gold); color: var(--gold-light); display: flex; font-family: Georgia, serif; font-size: 12px; font-weight: 400; height: 31px; justify-content: center; transform: rotate(45deg); width: 31px; }
.deco-mark b::first-line { transform: rotate(-45deg); }
nav { align-items: center; display: flex; gap: clamp(18px, 3vw, 42px); }
nav a { color: rgb(231, 223, 208); font-size: 12px; letter-spacing: 0.14em; text-transform: uppercase; }
nav a:hover, nav a:focus-visible { color: var(--gold-light); }
.nav-contact { border: 1px solid var(--gold); padding: 12px 18px; }
.hero { align-items: center; background-image: ; background-position-x: ; background-position-y: ; background-repeat: ; background-attachment: ; background-origin: ; background-clip: ; background-color: ; background-size: 80px 80px; color: var(--cream); display: flex; min-height: calc(-84px + 100vh); overflow: hidden; padding: 90px clamp(24px, 8vw, 130px) 100px; position: relative; }
.hero::before, .hero::after { border: 1px solid rgba(197, 164, 91, 0.6); content: ""; height: 390px; position: absolute; right: 8%; top: 50%; transform: translateY(-50%) rotate(45deg); width: 390px; }
.hero::after { height: 280px; right: calc(8% + 55px); width: 280px; }
.hero-rays { background: repeating-conic-gradient(rgba(197, 164, 91, 0.12) 0deg, rgba(197, 164, 91, 0.12) 1deg, transparent 1deg, transparent 15deg); border-radius: 50%; height: 600px; position: absolute; right: -20px; top: 50%; transform: translateY(-50%); width: 600px; }
.hero-content { max-width: 920px; position: relative; z-index: 2; }
.eyebrow, .section-number, .card-kicker { color: var(--gold); font-size: 11px; font-weight: 700; letter-spacing: 0.25em; text-transform: uppercase; }
.hero h1 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(58px, 7.7vw, 116px); font-weight: 400; letter-spacing: -0.055em; line-height: 0.88; margin: 30px 0px 34px; max-width: 980px; }
.hero h1 span { color: var(--gold-light); display: block; font-size: 0.61em; font-style: italic; letter-spacing: -0.03em; line-height: 1.05; margin-top: 24px; }
.hero-claim { border-left: 2px solid var(--rust); color: rgb(216, 210, 200); font-family: Georgia, serif; font-size: clamp(19px, 2vw, 26px); letter-spacing: 0.03em; padding-left: 22px; }
.hero-actions { display: flex; gap: 14px; margin-top: 46px; }
.button { align-items: center; display: inline-flex; font-size: 11px; font-weight: 700; justify-content: center; letter-spacing: 0.16em; min-height: 52px; padding: 0px 25px; text-transform: uppercase; transition: 180ms; }
.button:hover { transform: translateY(-2px); }
.button-gold { background: var(--gold); color: var(--ink); }
.button-gold:hover { background: var(--gold-light); }
.button-ghost { border: 1px solid rgba(243, 234, 216, 0.45); color: var(--cream); }
.hero-foot { align-items: center; bottom: 30px; color: rgba(243, 234, 216, 0.55); display: flex; font-size: 9px; gap: 13px; left: clamp(24px, 8vw, 130px); letter-spacing: 0.22em; position: absolute; text-transform: uppercase; }
.hero-foot i { background: var(--gold); height: 4px; transform: rotate(45deg); width: 4px; }
.intro-band { align-items: center; background: var(--rust); color: white; display: grid; gap: 30px; grid-template-columns: 70px 1fr 1.2fr; padding: 38px clamp(24px, 8vw, 130px); }
.intro-band > p { border: 1px solid rgba(255, 255, 255, 0.5); display: grid; font-family: Georgia, serif; font-size: 23px; height: 54px; place-items: center; transform: rotate(45deg); width: 54px; }
.intro-band h2 { font-family: Georgia, serif; font-size: clamp(29px, 3vw, 44px); font-weight: 400; margin: 0px; }
.intro-band > span { font-size: 14px; line-height: 1.8; max-width: 580px; }
.section { padding: 120px clamp(24px, 8vw, 130px); }
.section-heading { display: grid; gap: 30px; grid-template-columns: 1.1fr 1fr; margin-bottom: 70px; }
.section-heading .section-number { grid-column: 1 / -1; }
.section h2, .about-section h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(48px, 6vw, 82px); font-weight: 400; letter-spacing: -0.045em; line-height: 0.98; margin: 0px; }
.lead { align-self: end; border-top: 1px solid var(--gold); color: rgb(76, 85, 91); font-family: Georgia, serif; font-size: 20px; line-height: 1.65; padding-top: 22px; }
.editorial-grid { display: grid; gap: 24px; grid-template-columns: 1fr 1fr; }
.feature-card { min-height: 460px; padding: clamp(35px, 5vw, 70px); position: relative; }
.feature-card h3, .growth-block h3, .data-columns h3, .skin-callout h3, .data-services h3 { font-family: Georgia, serif; font-size: clamp(29px, 3.3vw, 47px); font-weight: 400; line-height: 1.12; margin: 22px 0px 28px; }
.feature-card p:not(.card-kicker), .growth-block p, .data-columns p, .skin-callout p { font-size: 15px; line-height: 1.85; }
.feature-card p + p, .growth-block p + p, .data-columns p + p { margin-top: 20px; }
.dark-card { background: var(--ink-light); color: rgb(233, 226, 212); }
.outlined-card { border: 1px solid var(--gold); background: rgb(245, 237, 221); }
.corner { border-color: var(--rust); height: 44px; position: absolute; width: 44px; }
.corner-tl { border-left: 3px solid var(--rust); border-top: 3px solid var(--rust); left: 14px; top: 14px; }
.corner-br { border-bottom: 3px solid var(--rust); border-right: 3px solid var(--rust); bottom: 14px; right: 14px; }
.growth-block { border-bottom: 1px solid rgb(216, 204, 181); border-top: 1px solid rgb(216, 204, 181); display: grid; gap: 60px; grid-template-columns: 0.9fr 1.1fr; margin: 100px 0px; padding: 70px 0px; }
.growth-block h3 { margin-bottom: 0px; }
.services-block, .data-services { display: grid; gap: 70px; grid-template-columns: 0.7fr 1.3fr; }
.services-title { align-items: center; display: flex; gap: 26px; }
.services-title span { color: var(--rust); font-family: Georgia, serif; font-size: 90px; line-height: 1; }
.services-title h3, .data-services h3 { font-family: Georgia, serif; font-size: 36px; font-weight: 400; }
.service-list { display: grid; gap: 0px 36px; grid-template-columns: 1fr 1fr; list-style: none; margin: 0px; padding: 0px; }
.service-list li { align-items: baseline; border-bottom: 1px solid rgb(217, 205, 183); display: flex; font-size: 14px; gap: 12px; line-height: 1.45; padding: 16px 0px; }
.service-list li span { color: var(--gold); font-size: 7px; }
.why-strip { background: var(--cream); border-left: 4px solid var(--rust); display: grid; gap: 40px; grid-template-columns: 0.5fr 1.5fr; margin-top: 90px; padding: 42px; }
.why-strip > p:last-child { font-family: Georgia, serif; font-size: 18px; line-height: 1.65; }
.references-section { background: linear-gradient(135deg, rgba(197, 164, 91, 0.04) 25%, transparent 25%) 0px 0px / 90px 90px, rgb(17, 20, 22); color: var(--cream); padding: 120px clamp(24px, 5vw, 80px); }
.references-heading { align-items: end; display: grid; gap: 80px; grid-template-columns: 1.2fr 0.8fr; margin: 0px auto 65px; max-width: 1580px; }
.references-heading h2 { font-family: Georgia, "Times New Roman", serif; font-size: clamp(48px, 6vw, 82px); font-weight: 400; letter-spacing: -0.045em; line-height: 0.98; margin: 25px 0px 0px; }
.references-heading > p { border-top: 1px solid var(--gold); color: rgb(184, 184, 178); font-family: Georgia, serif; font-size: 18px; line-height: 1.65; padding-top: 22px; }
.references-frame { border: 1px solid rgba(197, 164, 91, 0.55); margin: 0px auto; max-width: 1580px; padding: 18px; position: relative; }
.references-frame::before { border: 1px solid rgba(197, 164, 91, 0.25); content: ""; inset: 8px; pointer-events: none; position: absolute; z-index: 2; }
.references-frame img { display: block; height: auto; width: 100%; }
.references-frame figcaption { align-items: center; background: var(--cream); color: var(--ink); display: flex; font-size: 10px; justify-content: space-between; letter-spacing: 0.18em; padding: 18px 22px; text-transform: uppercase; }
.references-frame figcaption span:last-child { color: var(--rust); font-weight: 700; }
.references-corner { height: 34px; position: absolute; width: 34px; z-index: 3; }
.ref-tl { border-left: 3px solid var(--gold-light); border-top: 3px solid var(--gold-light); left: -8px; top: -8px; }
.ref-tr { border-right: 3px solid var(--gold-light); border-top: 3px solid var(--gold-light); right: -8px; top: -8px; }
.ref-bl { border-bottom: 3px solid var(--gold-light); border-left: 3px solid var(--gold-light); bottom: -8px; left: -8px; }
.ref-br { border-bottom: 3px solid var(--gold-light); border-right: 3px solid var(--gold-light); bottom: -8px; right: -8px; }
.references-note { align-items: center; display: flex; gap: 20px; margin: 38px auto 0px; max-width: 900px; text-align: center; }
.references-note span { color: var(--gold); font-size: 9px; }
.references-note p { color: rgb(174, 179, 178); font-family: Georgia, serif; font-size: 16px; line-height: 1.65; }
.data-section { background: var(--ink); color: rgb(232, 224, 210); position: relative; }
.data-heading h2 span { color: var(--gold-light); display: block; font-size: 0.58em; font-style: italic; margin-top: 14px; }
.data-intro { display: grid; gap: 80px; grid-template-columns: 1.1fr 0.9fr; margin-top: 70px; }
.data-intro p { line-height: 1.85; }
.large-copy { color: var(--cream); font-family: Georgia, serif; font-size: clamp(22px, 2.5vw, 34px); line-height: 1.45 !important; }
.deco-divider { align-items: center; color: var(--gold); display: flex; gap: 18px; margin: 80px 0px; }
.deco-divider i { background: rgba(197, 164, 91, 0.5); height: 1px; width: 90px; }
.data-columns { display: grid; gap: 0px; grid-template-columns: 1fr 1fr; }
.data-columns article { border-top: 1px solid rgba(197, 164, 91, 0.5); padding: 50px 60px 40px 0px; }
.data-columns article + article { border-left: 1px solid rgba(197, 164, 91, 0.5); padding-left: 60px; padding-right: 0px; }
.benefit-list { list-style: none; margin: 28px 0px 0px; padding: 0px; }
.benefit-list li { border-bottom: 1px solid rgba(197, 164, 91, 0.22); font-size: 13px; line-height: 1.5; padding: 12px 0px 12px 22px; position: relative; }
.benefit-list li::before { color: var(--gold); content: "◆"; font-size: 6px; left: 0px; position: absolute; top: 18px; }
.skin-callout { align-items: center; background: var(--rust); display: grid; gap: 45px; grid-template-columns: 130px 1fr; margin: 90px 0px; padding: 55px; }
.skin-callout .section-number { color: rgb(243, 217, 154); }
.skin-icon { align-items: center; border: 1px solid rgb(243, 217, 154); display: flex; font-family: Georgia, serif; font-size: 54px; height: 100px; justify-content: center; transform: rotate(45deg); width: 100px; }
.data-services { align-items: start; }
.data-services .service-list li { border-color: rgba(197, 164, 91, 0.22); }
.about-section { background: var(--gold); padding: 110px clamp(24px, 8vw, 130px); }
.about-frame { border: 2px solid var(--ink); display: grid; gap: 80px; grid-template-columns: 1fr 1fr; padding: clamp(40px, 6vw, 90px); position: relative; }
.about-frame::before, .about-frame::after { background: var(--gold); border: 1px solid var(--ink); content: ""; height: 34px; position: absolute; top: -18px; transform: rotate(45deg); width: 34px; }
.about-frame::before { left: 20%; }
.about-frame::after { right: 20%; }
.about-title .section-number { color: var(--rust); margin-bottom: 25px; }
.about-title h2 span { display: block; font-style: italic; }
.about-copy { padding-top: 25px; }
.about-copy p { font-family: Georgia, serif; font-size: 19px; line-height: 1.65; }
.about-copy p + p { margin-top: 22px; }
.about-copy .button { background: var(--ink); color: var(--cream); margin-top: 38px; }
footer { background: rgb(11, 19, 25); color: var(--cream); padding: 90px clamp(24px, 8vw, 130px) 30px; }
.footer-top { display: grid; gap: 80px; grid-template-columns: 1fr 1fr; }
.footer-top h2 { font-family: Georgia, serif; font-size: clamp(42px, 5vw, 70px); font-weight: 400; margin: 35px 0px 10px; }
.footer-top > div:first-child > p { color: rgb(174, 179, 178); font-family: Georgia, serif; font-size: 20px; }
.contact-grid { display: grid; gap: 35px; grid-template-columns: 1fr 1fr; padding-top: 15px; }
.contact-grid a { color: var(--gold-light); font-family: Georgia, serif; font-size: 22px; }
.contact-grid p { color: rgb(174, 179, 178); font-size: 13px; line-height: 1.8; }
.footer-bottom { border-top: 1px solid rgba(197, 164, 91, 0.25); color: rgb(133, 141, 145); display: flex; font-size: 10px; justify-content: space-between; letter-spacing: 0.15em; margin-top: 80px; padding-top: 25px; text-transform: uppercase; }
@media (max-width: 850px) {
    .site-header { height: 72px; }

    .hero { min-height: 780px; padding-top: 70px; }
    .hero::before, .hero::after, .hero-rays { opacity: 0.45; right: -230px; }
    .intro-band, .section-heading, .references-heading, .editorial-grid, .growth-block, .services-block, .why-strip, .data-intro, .data-columns, .data-services, .about-frame, .footer-top { grid-template-columns: 1fr; }
    .intro-band { gap: 18px; }
    .references-section { padding-bottom: 85px; padding-top: 85px; }
    .references-heading { gap: 30px; }
    .intro-band > p { height: 42px; width: 42px; }
    .section-heading .section-number { grid-column: auto; }
    .feature-card { min-height: auto; }
    .data-columns article, .data-columns article + article { border-left: 0px; padding: 45px 0px; }
    .skin-callout { grid-template-columns: 1fr; }
    .skin-icon { height: 72px; margin: 14px; width: 72px; }
}
@media (max-width: 580px) {
    .section { padding-bottom: 80px; padding-top: 80px; }
    .hero h1 { font-size: 51px; }
    .hero-actions { align-items: stretch; flex-direction: column; width: 100%; }
    .button { width: 100%; }
    .service-list, .contact-grid { grid-template-columns: 1fr; }
    .services-title { align-items: flex-end; }
    .why-strip, .skin-callout, .references-frame { padding: 30px 24px; }
    .references-frame { padding: 8px; }
    .references-frame figcaption { align-items: flex-start; flex-direction: column; gap: 8px; line-height: 1.5; }
    .about-frame { gap: 35px; }
    .footer-bottom { gap: 20px; }
}
@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .button { transition: none; }
}

.hero {
    background: linear-gradient(rgba(197, 164, 91, .08) 1px, transparent 1px), linear-gradient(90deg, rgba(197, 164, 91, .08) 1px, transparent 1px), #101b24 !important;
    background-size: 80px 80px !important;
    color: #f3ead8 !important;
}


.referen {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    justify-content: space-between;
    background: #191919;
    padding-top: 30px;
    overflow: hidden;
}

#reference .item {
    padding: 16px;
    flex: 1;
    margin-bottom: 30px;
    position: relative;
}
@media (min-width: 960px) {
    #reference .item {
        padding: 16px;
        max-width: calc(33% - 18px);
        flex: 1;
        min-width: 30%;
        margin-bottom: 30px;
    }
}

#reference img {
    z-index: 100;
    position: relative;
}

#reference h2 {
    font-family: "Geist Mono";
    color: #B9B7B7;
    font-size: 32px;
    line-height: 32px;
    position: relative;
    font-weight: 400;
    z-index: 10;
}
#reference h6 {
    font-family: "Geist Mono";
    font-weight: 900;
    font-size: 144px;
    line-height: 84px;
    color: #272C2E;
    position: absolute;
    top: 0;
    left: 0;
    margin: 0;
    margin-block-start: 0;
    margin-block-end: 0;
    z-index: 1;
}



 .descrip {
     position: absolute;
     bottom: 0px;
     z-index: 1000;
     background-color: rgb(25, 25, 25);
     line-height: 22px;
     color: white;
     opacity: 0;
     padding: 16px 36px;
     transition: opacity 250ms;
 }

a.item:hover .descrip,
a.item:focus .descrip,
a.item:focus-visible .descrip {
    opacity: 1;
}

@media (max-width: 520px) {

   .item {
       min-width: 100%;
   }

}

@media (min-width: 520px) and (max-width: 1040px) {

    .item {
        min-width: 48%;
    }

}