/* fonty lokalne — kopia /fonts/fonts.css (wklejona zamiast @import, żeby nie było łańcucha) */
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 300 400;
  font-display: swap;
  src: url(/fonts/Fraunces-italic-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: italic;
  font-weight: 300 400;
  font-display: swap;
  src: url(/fonts/Fraunces-italic-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(/fonts/Fraunces-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Fraunces';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(/fonts/Fraunces-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(/fonts/Inter-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 300 600;
  font-display: swap;
  src: url(/fonts/Inter-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}
/* latin-ext */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(/fonts/JetBrainsMono-normal-latin-ext.woff2) format('woff2');
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C4, U+2113, U+2C60-2C7F, U+A720-A7FF;
}
/* latin */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 400 500;
  font-display: swap;
  src: url(/fonts/JetBrainsMono-normal-latin.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}


body.studio-page {
    --studio-bg: #040404;
    --studio-panel: #0c0c0c;
    --studio-panel-2: #121212;
    --studio-line: rgba(255,255,255,.095);
    --studio-ink: #f3efe8;
    --studio-muted: rgba(243,239,232,.58);
    --studio-soft: rgba(243,239,232,.55);
    --studio-accent: #e8732a;
    --studio-accent-2: #f6c177;
    --studio-accent-rgb: 232,115,42;
    --dark-bg: var(--studio-bg);
    --dark-surface: #070707;
    --dark-elevated: var(--studio-panel);
    --text-primary: var(--studio-ink);
    --text-secondary: var(--studio-muted);
    --text-muted: var(--studio-soft);
    --gradient-primary: linear-gradient(135deg, var(--studio-accent) 0%, var(--studio-accent-2) 100%);
    background:
        radial-gradient(circle at 15% 12%, rgba(var(--studio-accent-rgb), .11), transparent 30vw),
        linear-gradient(180deg, #050505 0%, #000 48%, #050505 100%);
    color: var(--studio-ink);
    font-family: "Inter", system-ui, sans-serif;
    letter-spacing: 0;
}

body.studio-action {
    --studio-accent: #8b7cff;
    --studio-accent-2: #ef73d2;
    --studio-accent-rgb: 139,124,255;
}

body.studio-export {
    --studio-accent: #e8732a;
    --studio-accent-2: #f4c86a;
    --studio-accent-rgb: 232,115,42;
}

body.studio-overlay {
    --studio-accent: #20c6a7;
    --studio-accent-2: #78a8ff;
    --studio-accent-rgb: 32,198,167;
}

body.studio-page nav {
    top: 18px;
    left: 24px;
    right: 24px;
    background: rgba(5,5,5,.76);
    border: 1px solid var(--studio-line);
    border-radius: 0;
    backdrop-filter: blur(18px);
    box-shadow: 0 22px 70px rgba(0,0,0,.35);
}

body.studio-page .nav-container {
    max-width: 1240px;
    padding: 13px 22px;
}

body.studio-page .logo {
    color: var(--studio-ink);
    background: none;
    -webkit-text-fill-color: currentColor;
    font-family: "Fraunces", Georgia, serif;
    font-size: 19px;
    font-weight: 400;
    letter-spacing: -.02em;
}

body.studio-page .nav-links {
    display: flex;
    align-items: center;
    gap: 18px;
}

body.studio-page .nav-links a {
    margin-left: 0;
    color: rgba(243,239,232,.54);
    font-family: "JetBrains Mono", monospace;
    font-size: 9px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
}

body.studio-page .nav-links a:hover,
body.studio-page .nav-links a.is-active {
    color: var(--studio-ink);
}

body.studio-page .nav-links a.is-active::after {
    content: "";
    display: block;
    height: 1px;
    margin-top: 5px;
    background: var(--studio-accent);
}

body.studio-page .language-switcher {
    border-radius: 0;
    border-color: var(--studio-line);
    background: rgba(255,255,255,.025);
}

body.studio-page .lang-btn {
    border-radius: 0;
    min-width: 38px;
    color: rgba(243,239,232,.5);
}

body.studio-page .lang-btn.active {
    background: rgba(var(--studio-accent-rgb), .18);
    color: var(--studio-ink);
}

body.studio-page .hamburger {
    border-radius: 0;
    min-width: 44px;
}

body.studio-page .mobile-menu {
    top: 78px;
    left: 24px;
    right: 24px;
    background: rgba(5,5,5,.94);
    border: 1px solid var(--studio-line);
    border-radius: 0;
}

body.studio-page .hero,
body.studio-page .split-hero,
body.studio-page .centered-hero {
    max-width: 1240px;
    margin: 0 auto;
    padding: 150px 40px 96px;
    min-height: auto;
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(300px, .58fr);
    gap: clamp(42px, 6vw, 96px);
    align-items: center;
    text-align: left;
}

body.studio-page .centered-hero .hero-content {
    max-width: none;
    margin: 0;
}

body.studio-page .hero h1,
body.studio-page .hero-text h1,
body.studio-page .hero-content h1 {
    max-width: 10.5ch;
    margin-bottom: 28px;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(54px, 7.5vw, 112px);
    font-weight: 300;
    line-height: .96;
    letter-spacing: -.045em;
}

body.studio-page .gradient-text {
    display: inline;
    background: none;
    -webkit-text-fill-color: currentColor;
    color: var(--studio-accent-2);
    font-style: italic;
}

body.studio-page .hero-subtitle {
    max-width: 640px;
    margin: 0 0 38px;
    color: var(--studio-muted);
    font-size: clamp(16px, 1.35vw, 19px);
    font-weight: 300;
    line-height: 1.75;
}

body.studio-page .btn-primary,
body.studio-page .contact-submit-btn {
    min-height: 48px;
    border-radius: 0;
    border: 1px solid rgba(var(--studio-accent-rgb), .44);
    background: rgba(var(--studio-accent-rgb), .18);
    color: var(--studio-ink);
    font-family: "JetBrains Mono", monospace;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .18em;
    text-transform: uppercase;
    box-shadow: none;
}

body.studio-page .btn-primary:hover,
body.studio-page .contact-submit-btn:hover {
    transform: translateY(-2px);
    background: rgba(var(--studio-accent-rgb), .28);
    box-shadow: 0 16px 55px rgba(var(--studio-accent-rgb), .18);
}

body.studio-page .hero-product-container,
body.studio-page .hero-image-side,
body.studio-page .hero-showcase {
    width: 100%;
    max-width: 430px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    perspective: none;
}

body.studio-page .hero-product-frame,
body.studio-page .hero-img-frame {
    width: 100%;
    padding: 10px;
    border-radius: 0;
    border: 1px solid var(--studio-line);
    background: linear-gradient(180deg, rgba(255,255,255,.06), rgba(255,255,255,.015));
    box-shadow: 0 50px 120px rgba(0,0,0,.62), 0 0 80px rgba(var(--studio-accent-rgb), .16);
    transform: none;
}

body.studio-page .hero-product-frame:hover,
body.studio-page .hero-img-frame:hover,
body.studio-page .hero-panel-img:hover {
    transform: translateY(-6px);
}

body.studio-page .hero-product-frame img,
body.studio-page .hero-img-frame img,
body.studio-page .hero-panel-img {
    width: 100%;
    max-width: 420px;
    height: auto;
    border-radius: 0;
    border: 1px solid rgba(255,255,255,.08);
    transform: none;
    object-fit: contain;
}

body.studio-page .hero-glow,
body.studio-page .hero-glow-bg {
    display: none;
}

body.studio-page .features,
body.studio-page .interface-gallery,
body.studio-page .showcase,
body.studio-page .workflow-section,
body.studio-page .cta-section {
    padding: 108px 40px;
    background: transparent;
    border-top: 1px solid rgba(255,255,255,.055);
}

body.studio-page .section-title {
    max-width: 900px;
    margin: 0 auto 54px;
    font-family: "Fraunces", Georgia, serif;
    font-size: clamp(38px, 5vw, 72px);
    font-weight: 300;
    line-height: 1.02;
    letter-spacing: -.04em;
    text-align: center;
}

body.studio-page .features-grid,
body.studio-page .gallery-grid,
body.studio-page .cards-container {
    max-width: 1180px;
    gap: 18px;
}

body.studio-page .feature-card,
body.studio-page .gallery-card,
body.studio-page .workflow-card,
body.studio-page .cta-box {
    border-radius: 0;
    border: 1px solid var(--studio-line);
    background: rgba(255,255,255,.026);
    box-shadow: none;
}

body.studio-page .feature-card {
    position: relative;
    min-height: 238px;
    padding: 30px;
}

body.studio-page .feature-card::before {
    content: "";
    position: absolute;
    inset: 0 auto 0 0;
    width: 2px;
    background: linear-gradient(180deg, transparent, var(--studio-accent), transparent);
    opacity: .55;
}

body.studio-page .feature-card:hover,
body.studio-page .gallery-card:hover .img-wrapper,
body.studio-page .workflow-card:hover,
body.studio-page .showcase-img-wrapper:hover {
    transform: translateY(-4px);
    border-color: rgba(var(--studio-accent-rgb), .42);
}

body.studio-page .feature-icon {
    width: 42px;
    height: 42px;
    margin-bottom: 26px;
    border-radius: 50%;
    border: 1px solid rgba(var(--studio-accent-rgb), .46);
    background: rgba(var(--studio-accent-rgb), .12);
    color: transparent;
    font-size: 0;
}

body.studio-page .feature-icon::before {
    content: "";
    width: 11px;
    height: 11px;
    border-radius: 50%;
    background: var(--studio-accent-2);
    box-shadow: 0 0 22px rgba(var(--studio-accent-rgb), .7);
}

body.studio-page .feature-card h3,
body.studio-page .gallery-card h3,
body.studio-page .card-content h3,
body.studio-page .showcase-content h3,
body.studio-page .cta-box h2 {
    font-family: "Fraunces", Georgia, serif;
    font-weight: 300;
    letter-spacing: -.025em;
    color: var(--studio-ink);
}

body.studio-page .feature-card p,
body.studio-page .gallery-card p,
body.studio-page .card-content p,
body.studio-page .showcase-content p,
body.studio-page .cta-box p {
    color: var(--studio-muted);
    font-size: 15px;
    line-height: 1.75;
}

body.studio-page .gallery-card .img-wrapper,
body.studio-page .card-img-wrapper,
body.studio-page .showcase-img-wrapper {
    border-radius: 0;
    border: 1px solid var(--studio-line);
    background: #080808;
    box-shadow: none;
}

body.studio-page .gallery-card .img-wrapper,
body.studio-page .card-img-wrapper {
    height: 460px;
    padding: 18px;
    align-items: flex-start;
}

body.studio-page .gallery-card .img-wrapper::after {
    height: 120px;
    background: linear-gradient(to top, #080808, transparent);
}

body.studio-page .gallery-card img,
body.studio-page .card-img-wrapper img {
    width: 100%;
    max-width: 100%;
    height: auto;
    border-radius: 0;
    filter: saturate(.9) brightness(.86);
}

body.studio-page .showcase-block {
    max-width: 1180px;
    gap: clamp(42px, 6vw, 88px);
}

body.studio-page .showcase-img-wrapper {
    max-width: 78%;
    padding: 10px;
    overflow: hidden;
}

body.studio-page .showcase-img-wrapper img {
    border-radius: 0;
}

body.studio-page .showcase-list li::before {
    content: "";
    width: 8px;
    height: 8px;
    flex: 0 0 8px;
    border-radius: 50%;
    background: var(--studio-accent);
    box-shadow: 0 0 18px rgba(var(--studio-accent-rgb), .55);
}

body.studio-page .cta-section {
    padding-bottom: 132px;
}

body.studio-page .cta-box {
    max-width: 820px;
    padding: clamp(42px, 6vw, 72px);
    background:
        linear-gradient(135deg, rgba(var(--studio-accent-rgb), .12), transparent 48%),
        rgba(255,255,255,.026);
}

body.studio-page .contact-modal-content {
    border-radius: 0;
    background: #080808;
    border-color: var(--studio-line);
}

body.studio-page .contact-close-btn,
body.studio-page .form-group input,
body.studio-page .form-group textarea {
    border-radius: 0;
}

body.studio-page .form-group input:focus,
body.studio-page .form-group textarea:focus {
    border-color: var(--studio-accent);
    background: rgba(var(--studio-accent-rgb), .06);
}

body.studio-page .reveal-loop {
    transition-duration: .72s;
}

@media (prefers-reduced-motion: reduce) {
    body.studio-page *,
    body.studio-page *::before,
    body.studio-page *::after {
        animation-duration: .001ms !important;
        transition-duration: .001ms !important;
        scroll-behavior: auto !important;
    }
}

@media (max-width: 980px) {
    body.studio-page .hero,
    body.studio-page .split-hero,
    body.studio-page .centered-hero {
        grid-template-columns: 1fr;
        padding-top: 128px;
        text-align: center;
    }

    body.studio-page .hero h1,
    body.studio-page .hero-text h1,
    body.studio-page .hero-content h1,
    body.studio-page .hero-subtitle {
        margin-left: auto;
        margin-right: auto;
    }

    body.studio-page .hero-product-container,
    body.studio-page .hero-image-side,
    body.studio-page .hero-showcase {
        order: -1;
        max-width: 360px;
    }

    body.studio-page .showcase-block,
    body.studio-page .showcase-block.reverse {
        grid-template-columns: 1fr;
        direction: ltr;
    }

    body.studio-page .showcase-img-wrapper {
        max-width: 520px;
    }
}

@media (max-width: 768px) {
    body.studio-page nav {
        top: 10px;
        left: 10px;
        right: 10px;
    }

    body.studio-page .nav-links {
        display: none;
    }

    body.studio-page .mobile-menu {
        top: 70px;
        left: 10px;
        right: 10px;
    }

    body.studio-page .hero,
    body.studio-page .split-hero,
    body.studio-page .centered-hero,
    body.studio-page .features,
    body.studio-page .interface-gallery,
    body.studio-page .showcase,
    body.studio-page .workflow-section,
    body.studio-page .cta-section {
        padding-left: 20px;
        padding-right: 20px;
    }

    body.studio-page .hero h1,
    body.studio-page .hero-text h1,
    body.studio-page .hero-content h1 {
        font-size: clamp(42px, 15vw, 64px);
    }

    body.studio-page .features-grid,
    body.studio-page .gallery-grid,
    body.studio-page .cards-container {
        grid-template-columns: 1fr;
    }

    body.studio-page .gallery-card .img-wrapper,
    body.studio-page .card-img-wrapper {
        height: auto;
        max-height: none;
    }
}
