/* =========================================================
   LYRICFIND
   ANA TASARIM CSS
   ========================================================= */


/* =========================================================
   GENEL
   ========================================================= */

* {
    box-sizing: border-box;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    padding: 0;

    background: #f8fafc;
    color: #111827;

    font-family:
        Arial,
        Helvetica,
        sans-serif;

    line-height: 1.6;

    overflow-x: hidden;
}

img {
    max-width: 100%;
    height: auto;
}

a {
    color: inherit;
}

button,
input {
    font-family: inherit;
}


/* =========================================================
   ANA CONTAINER
   ========================================================= */

.container {
    width: min(1180px, calc(100% - 40px));
    margin: 0 auto;
}


/* =========================================================
   HEADER
   ========================================================= */

.site-header {
    position: relative;
    z-index: 1000;

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

    min-height: 76px;

    padding: 14px max(20px, calc((100% - 1180px) / 2));

    background: rgba(255, 255, 255, 0.96);

    border-bottom: 1px solid #e5e7eb;

    box-shadow:
        0 4px 20px rgba(15, 23, 42, 0.04);

    backdrop-filter: blur(12px);
}


/* LOGO */

.brand {
    flex-shrink: 0;

    color: #111827;

    font-size: 27px;
    font-weight: 900;

    letter-spacing: -1.2px;

    text-decoration: none;
}

.brand span {
    color: #eab308;
}


/* NAV */

.site-header nav {
    display: flex;
    align-items: center;
    gap: 8px;

    margin-left: auto;
}

.site-header nav > a {
    display: inline-flex;
    align-items: center;
    justify-content: center;

    min-height: 40px;

    padding: 8px 13px;

    border-radius: 9px;

    color: #374151;

    font-size: 14px;
    font-weight: 700;

    text-decoration: none;

    transition:
        background 0.2s ease,
        color 0.2s ease,
        transform 0.2s ease;
}

.site-header nav > a:hover {
    background: #f3f4f6;
    color: #111827;
}

.site-header nav > a:active {
    transform: translateY(1px);
}


/* PAYLAŞ BUTONU */

.site-header nav .nav-cta {
    padding: 9px 16px;

    background: #111827;
    color: #ffffff;
}

.site-header nav .nav-cta:hover {
    background: #1f2937;
    color: #ffffff;
}


/* =========================================================
   HEADER SEARCH
   ========================================================= */

.header-search {
    display: flex;

    width: 250px;
    height: 40px;

    margin: 0 4px;
}

.header-search input {
    width: 100%;
    min-width: 0;

    padding: 0 12px;

    border: 1px solid #d1d5db;
    border-right: 0;

    border-radius: 9px 0 0 9px;

    outline: none;

    background: #ffffff;

    color: #111827;

    font-size: 14px;

    transition: border-color 0.2s ease;
}

.header-search input:focus {
    border-color: #9ca3af;
}

.header-search button {
    width: 46px;

    border: 1px solid #d1d5db;
    border-left: 0;

    border-radius: 0 9px 9px 0;

    background: #f3f4f6;

    color: #111827;

    cursor: pointer;

    transition:
        background 0.2s ease;
}

.header-search button:hover {
    background: #e5e7eb;
}


/* =========================================================
   MOBİL MENÜ BUTONU
   ========================================================= */

.mobile-menu-button {
    display: none;

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

    width: 44px;
    height: 44px;

    padding: 0;

    border: 0;
    border-radius: 10px;

    background: #111827;
    color: #ffffff;

    font-size: 22px;

    cursor: pointer;
}


/* =========================================================
   HERO
   ========================================================= */

.hero {
    position: relative;

    padding: 100px 20px 95px;

    overflow: hidden;

    background:
        radial-gradient(
            circle at 15% 20%,
            rgba(234, 179, 8, 0.12),
            transparent 30%
        ),
        radial-gradient(
            circle at 85% 70%,
            rgba(59, 130, 246, 0.10),
            transparent 32%
        ),
        #111827;

    color: #ffffff;
}

.hero::before {
    content: "";

    position: absolute;

    top: -180px;
    right: -150px;

    width: 420px;
    height: 420px;

    border: 1px solid rgba(255, 255, 255, 0.08);

    border-radius: 50%;
}

.hero::after {
    content: "";

    position: absolute;

    bottom: -230px;
    left: -160px;

    width: 450px;
    height: 450px;

    border: 1px solid rgba(255, 255, 255, 0.06);

    border-radius: 50%;
}

.hero-content {
    position: relative;
    z-index: 2;

    width: min(850px, 100%);

    margin: 0 auto;

    text-align: center;
}


/* HERO BADGE */

.hero-badge {
    display: inline-flex;

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

    padding: 8px 14px;

    margin-bottom: 22px;

    border: 1px solid rgba(255, 255, 255, 0.14);

    border-radius: 999px;

    background: rgba(255, 255, 255, 0.06);

    color: #fde68a;

    font-size: 12px;
    font-weight: 800;

    letter-spacing: 1.2px;
}


/* HERO BAŞLIK */

.hero h1 {
    max-width: 850px;

    margin: 0 auto;

    font-size: clamp(42px, 6vw, 72px);

    line-height: 1.05;

    letter-spacing: -3px;

    font-weight: 900;
}

.hero h1 span {
    color: #facc15;
}


/* HERO AÇIKLAMA */

.hero p {
    max-width: 690px;

    margin: 25px auto 0;

    color: #d1d5db;

    font-size: 18px;

    line-height: 1.7;
}


/* =========================================================
   HERO SEARCH
   ========================================================= */

.hero-search {
    width: min(720px, 100%);

    margin: 34px auto 0;
}

.hero-search form {
    display: flex;

    width: 100%;

    padding: 6px;

    border-radius: 15px;

    background: #ffffff;

    box-shadow:
        0 18px 45px rgba(0, 0, 0, 0.25);
}

.hero-search input {
    flex: 1;

    min-width: 0;

    height: 54px;

    padding: 0 17px;

    border: 0;

    outline: 0;

    background: transparent;

    color: #111827;

    font-size: 16px;
}

.hero-search input::placeholder {
    color: #9ca3af;
}

.hero-search button {
    flex-shrink: 0;

    min-width: 110px;

    height: 54px;

    padding: 0 18px;

    border: 0;

    border-radius: 11px;

    background: #eab308;

    color: #111827;

    font-size: 15px;
    font-weight: 800;

    cursor: pointer;

    transition:
        background 0.2s ease,
        transform 0.2s ease;
}

.hero-search button:hover {
    background: #facc15;

    transform: translateY(-1px);
}


/* =========================================================
   HERO BUTONLARI
   ========================================================= */

.hero-actions {
    display: flex;

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

    gap: 12px;

    margin-top: 25px;
}

.button {
    display: inline-flex;

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

    min-height: 46px;

    padding: 10px 20px;

    border-radius: 10px;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;

    transition:
        transform 0.2s ease,
        background 0.2s ease,
        border-color 0.2s ease;
}

.button:hover {
    transform: translateY(-2px);
}

.button-primary {
    background: #eab308;
    color: #111827;
}

.button-primary:hover {
    background: #facc15;
}

.button-secondary {
    border: 1px solid rgba(255, 255, 255, 0.22);

    background: rgba(255, 255, 255, 0.06);

    color: #ffffff;
}

.button-secondary:hover {
    background: rgba(255, 255, 255, 0.12);
}


/* =========================================================
   SECTION
   ========================================================= */

.section {
    padding: 75px 0;
}

.section-soft {
    background: #f1f5f9;

    width: 100vw;

    margin-left: calc(50% - 50vw);

    padding-left: max(20px, calc((100vw - 1180px) / 2));
    padding-right: max(20px, calc((100vw - 1180px) / 2));
}

.section-heading {
    margin-bottom: 30px;
}

.section-heading-row {
    display: flex;

    align-items: flex-end;
    justify-content: space-between;

    gap: 25px;
}

.section-heading h2 {
    margin: 5px 0 8px;

    color: #111827;

    font-size: 30px;

    line-height: 1.2;

    letter-spacing: -0.7px;
}

.section-heading p {
    margin: 0;

    color: #6b7280;

    font-size: 15px;
}

.eyebrow {
    display: inline-block;

    color: #b45309;

    font-size: 11px;
    font-weight: 900;

    letter-spacing: 1.5px;
}


/* SECTION LINK */

.section-link {
    flex-shrink: 0;

    color: #374151;

    font-size: 14px;
    font-weight: 800;

    text-decoration: none;

    white-space: nowrap;
}

.section-link:hover {
    color: #b45309;
}


/* =========================================================
   HIZLI ERİŞİM
   ========================================================= */

.quick-section {
    padding-bottom: 35px;
}

.quick-grid {
    display: grid;

    grid-template-columns:
        repeat(4, 1fr);

    gap: 15px;
}

.quick-card {
    display: flex;

    align-items: center;

    gap: 15px;

    min-height: 115px;

    padding: 18px;

    border: 1px solid #e5e7eb;

    border-radius: 15px;

    background: #ffffff;

    color: inherit;

    text-decoration: none;

    box-shadow:
        0 5px 18px rgba(15, 23, 42, 0.04);

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

.quick-card:hover {
    transform: translateY(-4px);

    border-color: #f1d46a;

    box-shadow:
        0 14px 30px rgba(15, 23, 42, 0.09);
}

.quick-icon {
    display: flex;

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

    flex-shrink: 0;

    width: 52px;
    height: 52px;

    border-radius: 13px;

    background: #fffbeb;

    font-size: 23px;
}

.quick-card h3 {
    margin: 0 0 4px;

    color: #111827;

    font-size: 16px;
}

.quick-card p {
    margin: 0;

    color: #6b7280;

    font-size: 13px;

    line-height: 1.5;
}


/* =========================================================
   KARTLAR
   ========================================================= */

.cards {
    display: grid;

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

    gap: 20px;
}

.card {
    min-width: 0;

    padding: 24px;

    border: 1px solid #e5e7eb;

    border-radius: 16px;

    background: #ffffff;

    box-shadow:
        0 6px 22px rgba(15, 23, 42, 0.04);

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

.content-card:hover {
    transform: translateY(-4px);

    border-color: #d1d5db;

    box-shadow:
        0 15px 32px rgba(15, 23, 42, 0.08);
}

.card h2 {
    margin: 13px 0 8px;

    color: #111827;

    font-size: 21px;

    line-height: 1.3;
}

.card h2 a {
    color: inherit;

    text-decoration: none;
}

.card h2 a:hover {
    color: #b45309;
}

.card p {
    color: #6b7280;

    font-size: 14px;
}

.content-meta {
    margin: 0 0 13px;

    font-size: 13px !important;
}

.content-meta a {
    color: #374151;

    font-weight: 700;

    text-decoration: none;
}

.content-meta a:hover {
    color: #b45309;
}

.content-excerpt {
    margin: 0;

    display: -webkit-box;

    -webkit-line-clamp: 3;

    -webkit-box-orient: vertical;

    overflow: hidden;

    line-height: 1.65;
}

.read-more {
    display: inline-block;

    margin-top: 17px;

    color: #92400e;

    font-size: 13px;
    font-weight: 800;

    text-decoration: none;
}

.read-more:hover {
    color: #b45309;
}


/* =========================================================
   ETİKETLER
   ========================================================= */

.tag {
    display: inline-flex;

    align-items: center;

    min-height: 25px;

    padding: 4px 9px;

    border-radius: 999px;

    background: #f3f4f6;

    color: #4b5563;

    font-size: 10px;
    font-weight: 900;

    letter-spacing: 0.6px;
}

.tag-gold {
    background: #fef3c7;

    color: #92400e;
}


/* =========================================================
   SANATÇI / ŞAİR KARTLARI
   ========================================================= */

.people-grid {
    display: grid;

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

    gap: 15px;
}

.person-card {
    display: flex;

    align-items: center;

    gap: 13px;

    min-width: 0;

    padding: 15px;

    border: 1px solid #e5e7eb;

    border-radius: 14px;

    background: #ffffff;

    text-decoration: none;

    box-shadow:
        0 5px 18px rgba(15, 23, 42, 0.035);

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease;
}

.person-card:hover {
    transform: translateY(-3px);

    box-shadow:
        0 12px 25px rgba(15, 23, 42, 0.08);
}

.person-avatar {
    display: flex;

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

    flex-shrink: 0;

    width: 52px;
    height: 52px;

    overflow: hidden;

    border-radius: 50%;

    background: #f3f4f6;

    font-size: 22px;
}

.person-avatar img {
    width: 100%;
    height: 100%;

    object-fit: cover;
}

.person-card h3 {
    margin: 0 0 3px;

    overflow: hidden;

    color: #111827;

    font-size: 15px;

    text-overflow: ellipsis;

    white-space: nowrap;
}

.person-card span {
    color: #9ca3af;

    font-size: 12px;
}


/* =========================================================
   SEO İÇERİK
   ========================================================= */

.seo-intro {
    max-width: 900px;

    margin: 0 auto;

    padding-top: 35px;
    padding-bottom: 85px;
}

.seo-intro h2 {
    margin: 8px 0 18px;

    color: #111827;

    font-size: 30px;

    line-height: 1.3;
}

.seo-intro p {
    margin: 0 0 14px;

    color: #6b7280;

    font-size: 15px;

    line-height: 1.8;
}


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

footer {
    width: 100%;

    padding: 45px 20px;

    background: #111827;

    color: #ffffff;

    text-align: center;
}

footer a {
    color: #d1d5db;

    text-decoration: none;
}

footer a:hover {
    color: #ffffff;
}


/* =========================================================
   ARAMA SAYFASI
   ========================================================= */

.search-box {
    width: min(760px, 100%);

    margin: 0 auto 40px;
}

.search-box form {
    display: flex;

    width: 100%;
}

.search-box input {
    flex: 1;

    min-width: 0;

    height: 48px;

    padding: 0 14px;

    border: 1px solid #d1d5db;

    border-radius: 10px 0 0 10px;

    outline: none;

    font-size: 15px;
}

.search-box input:focus {
    border-color: #9ca3af;
}

.search-box button {
    min-width: 90px;

    height: 48px;

    border: 0;

    border-radius: 0 10px 10px 0;

    background: #111827;

    color: #ffffff;

    font-size: 14px;
    font-weight: 800;

    cursor: pointer;
}


/* =========================================================
   SAYFA BAŞLIĞI
   ========================================================= */

.page-title {
    padding: 65px 0 40px;

    text-align: center;
}

.page-title h1 {
    margin: 7px 0 10px;

    color: #111827;

    font-size: clamp(34px, 5vw, 48px);

    line-height: 1.15;

    letter-spacing: -1.5px;
}

.page-title p:not(.eyebrow) {
    max-width: 650px;

    margin: 0 auto;

    color: #6b7280;

    font-size: 16px;
}


/* =========================================================
   LYRICS / POEM CONTENT
   ========================================================= */

.lyrics,
.poem-content {
    width: min(800px, 100%);

    margin: 0 auto;

    padding: 30px;

    border: 1px solid #e5e7eb;

    border-radius: 16px;

    background: #ffffff;

    box-shadow:
        0 7px 25px rgba(15, 23, 42, 0.05);

    white-space: pre-line;

    font-size: 17px;

    line-height: 2;
}


/* =========================================================
   FORM ELEMANLARI
   ========================================================= */

input:focus,
textarea:focus,
select:focus,
button:focus-visible,
a:focus-visible {
    outline: 3px solid rgba(234, 179, 8, 0.25);

    outline-offset: 2px;
}


/* =========================================================
   TABLET
   ========================================================= */

@media (max-width: 1000px) {

    .site-header {
        gap: 18px;
    }

    .header-search {
        width: 210px;
    }

    .quick-grid {
        grid-template-columns:
            repeat(2, 1fr);
    }

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

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

}


/* =========================================================
   MOBİL
   ========================================================= */

@media (max-width: 768px) {

    .container {
        width: calc(100% - 30px);
    }


    /* HEADER */

    .site-header {
        min-height: 68px;

        padding: 12px 15px;

        flex-direction: row;

        justify-content: space-between;

        gap: 12px;
    }

    .brand {
        font-size: 24px;
    }

    .mobile-menu-button {
        display: flex;
    }


    /* NAV */

    #main-navigation {
        display: none;

        position: absolute;

        top: calc(100% + 8px);

        left: 12px;
        right: 12px;

        flex-direction: column;

        align-items: stretch;

        gap: 5px;

        margin: 0;

        padding: 13px;

        border: 1px solid #e5e7eb;

        border-radius: 14px;

        background: #ffffff;

        box-shadow:
            0 18px 40px rgba(15, 23, 42, 0.14);
    }

    #main-navigation.mobile-open {
        display: flex;
    }

    #main-navigation > a {
        width: 100%;

        justify-content: flex-start;

        padding: 12px 13px;
    }

    #main-navigation .nav-cta {
        justify-content: center;

        margin-top: 4px;
    }


    /* HEADER SEARCH */

    #main-navigation .header-search {
        display: flex;

        width: 100%;

        height: 44px;

        margin: 0 0 6px;
    }

    #main-navigation .header-search input {
        height: 44px;

        font-size: 15px;
    }

    #main-navigation .header-search button {
        width: 48px;

        height: 44px;
    }


    /* HERO */

    .hero {
        padding: 65px 15px 60px;
    }

    .hero h1 {
        font-size: 40px;

        letter-spacing: -1.8px;
    }

    .hero p {
        font-size: 16px;
    }

    .hero-search {
        margin-top: 28px;
    }

    .hero-search form {
        padding: 5px;
    }

    .hero-search input {
        height: 50px;

        padding: 0 12px;

        font-size: 14px;
    }

    .hero-search button {
        min-width: 85px;

        height: 50px;

        padding: 0 12px;
    }

    .hero-actions {
        flex-direction: column;

        width: min(320px, 100%);

        margin-left: auto;
        margin-right: auto;
    }

    .hero-actions .button {
        width: 100%;
    }


    /* SECTIONS */

    .section {
        padding: 55px 0;
    }

    .section-heading-row {
        align-items: flex-start;

        flex-direction: column;

        gap: 12px;
    }

    .section-heading h2 {
        font-size: 26px;
    }

    .section-link {
        font-size: 13px;
    }


    /* QUICK */

    .quick-grid {
        grid-template-columns: 1fr;

        gap: 12px;
    }


    /* CARDS */

    .cards {
        grid-template-columns: 1fr;

        gap: 15px;
    }

    .card {
        padding: 20px;
    }


    /* PEOPLE */

    .people-grid {
        grid-template-columns: 1fr;

        gap: 12px;
    }


    /* PAGE TITLE */

    .page-title {
        padding: 45px 0 30px;
    }

    .page-title h1 {
        font-size: 34px;
    }


    /* CONTENT */

    .lyrics,
    .poem-content {
        padding: 20px;

        font-size: 16px;

        line-height: 1.85;
    }


    /* SEO */

    .seo-intro {
        padding-top: 20px;
        padding-bottom: 60px;
    }

    .seo-intro h2 {
        font-size: 25px;
    }

}


/* =========================================================
   KÜÇÜK TELEFON
   ========================================================= */

@media (max-width: 480px) {

    .container {
        width: calc(100% - 24px);
    }

    .site-header {
        padding: 11px 12px;
    }

    .brand {
        font-size: 22px;
    }

    .mobile-menu-button {
        width: 42px;
        height: 42px;

        font-size: 20px;
    }


    .hero {
        padding: 52px 12px 50px;
    }

    .hero-badge {
        font-size: 10px;

        letter-spacing: 0.9px;
    }

    .hero h1 {
        font-size: 33px;

        letter-spacing: -1.3px;
    }

    .hero p {
        font-size: 15px;
    }


    .hero-search form {
        display: block;

        padding: 6px;
    }

    .hero-search input {
        display: block;

        width: 100%;

        height: 48px;

        border-radius: 9px;

        background: #ffffff;
    }

    .hero-search button {
        display: block;

        width: 100%;

        height: 46px;

        margin-top: 6px;

        border-radius: 9px;
    }


    .quick-card {
        min-height: 100px;

        padding: 15px;
    }

    .quick-icon {
        width: 46px;
        height: 46px;
    }


    .section {
        padding: 45px 0;
    }

    .section-heading h2 {
        font-size: 24px;
    }


    .card {
        padding: 18px;
    }

    .card h2 {
        font-size: 19px;
    }


    .page-title h1 {
        font-size: 30px;
    }

}
/* =========================================================
   LYRICFIND FOOTER
   ========================================================= */

.site-footer {
    width: 100%;

    margin-top: 30px;

    background: #111827;

    color: #ffffff;
}

.footer-inner {
    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    padding: 55px 0 45px;

    display: grid;

    grid-template-columns:
        2fr
        1fr
        1fr
        1fr;

    gap: 45px;
}

.footer-brand {
    max-width: 360px;
}

.footer-logo {
    display: inline-block;

    margin-bottom: 12px;

    color: #ffffff;

    font-size: 28px;
    font-weight: 900;

    letter-spacing: -1px;

    text-decoration: none;
}

.footer-logo span {
    color: #facc15;
}

.footer-brand p {
    margin: 0;

    color: #9ca3af;

    font-size: 14px;

    line-height: 1.8;
}

.footer-column {
    display: flex;

    flex-direction: column;

    align-items: flex-start;

    gap: 8px;
}

.footer-column h3 {
    margin: 0 0 9px;

    color: #ffffff;

    font-size: 14px;

    font-weight: 800;
}

.footer-column a {
    color: #9ca3af;

    font-size: 13px;

    text-decoration: none;

    transition:
        color 0.2s ease,
        transform 0.2s ease;
}

.footer-column a:hover {
    color: #facc15;

    transform: translateX(2px);
}

.footer-bottom {
    width: min(1180px, calc(100% - 40px));

    margin: 0 auto;

    padding: 20px 0;

    display: flex;

    align-items: center;

    justify-content: space-between;

    gap: 20px;

    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.footer-bottom p {
    margin: 0;

    color: #6b7280;

    font-size: 12px;
}


/* =========================================================
   FOOTER MOBİL
   ========================================================= */

@media (max-width: 768px) {

    .footer-inner {
        width: calc(100% - 30px);

        grid-template-columns: 1fr 1fr;

        gap: 35px 25px;

        padding: 45px 0 35px;
    }

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

        max-width: none;
    }

    .footer-bottom {
        width: calc(100% - 30px);

        flex-direction: column;

        align-items: center;

        text-align: center;

        gap: 7px;
    }

}


@media (max-width: 480px) {

    .footer-inner {
        width: calc(100% - 24px);

        grid-template-columns: 1fr;

        gap: 28px;
    }

    .footer-brand {
        grid-column: auto;
    }

    .footer-column {
        align-items: center;

        text-align: center;
    }

    .footer-bottom {
        width: calc(100% - 24px);
    }

}
/* =========================================================
   404 SAYFASI
   ========================================================= */

.error-page {
    min-height: 600px;

    display: flex;

    align-items: center;

    justify-content: center;

    padding: 80px 20px;

    text-align: center;
}

.error-content {
    width: min(700px, 100%);
}

.error-code {
    margin-bottom: 5px;

    color: #eab308;

    font-size: clamp(90px, 16vw, 170px);

    font-weight: 900;

    line-height: 0.9;

    letter-spacing: -8px;
}

.error-content h1 {
    margin: 14px 0;

    color: #111827;

    font-size: clamp(30px, 5vw, 46px);

    line-height: 1.2;

    letter-spacing: -1px;
}

.error-content p {
    max-width: 600px;

    margin: 0 auto;

    color: #6b7280;

    font-size: 16px;

    line-height: 1.8;
}

.error-actions {
    display: flex;

    align-items: center;

    justify-content: center;

    gap: 12px;

    margin-top: 30px;
}

.button-dark {
    background: #111827;

    color: #ffffff;
}

.button-dark:hover {
    background: #1f2937;

    color: #ffffff;
}


@media (max-width: 600px) {

    .error-page {
        min-height: 500px;

        padding: 60px 15px;
    }

    .error-code {
        letter-spacing: -5px;
    }

    .error-actions {
        flex-direction: column;

        width: min(320px, 100%);

        margin-left: auto;
        margin-right: auto;
    }

    .error-actions .button {
        width: 100%;
    }

}
/* =========================================================
   ŞİİR KATEGORİLERİ
   ========================================================= */

.poem-categories-section {
    margin-top: 10px;
}

.poem-category-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.poem-category-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 12px 18px;
    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 999px;
    background: #fff;
    color: #171717;
    text-decoration: none;
    font-weight: 600;
    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease,
        color 0.2s ease;
}

.poem-category-link:hover {
    transform: translateY(-2px);
    background: #111;
    color: #fff;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.10);
}

.category-arrow {
    font-size: 16px;
    opacity: 0.65;
}

.poem-category-link:hover .category-arrow {
    opacity: 1;
}

@media (max-width: 600px) {

    .poem-category-list {
        gap: 8px;
    }

    .poem-category-link {
        padding: 10px 14px;
        font-size: 14px;
    }

}
/* ŞİİR KATEGORİ SAYILARI */

.poem-category-link {
    justify-content: space-between;
}

.poem-category-name {
    font-weight: 700;
}

.poem-category-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.poem-category-count {
    font-size: 13px;
    font-weight: 600;
    opacity: 0.60;
}

.poem-category-link:hover .poem-category-count {
    opacity: 0.85;
}
/* =========================================================
   ŞARKI KATEGORİLERİ
   ========================================================= */

.song-categories-section {
    margin-top: 10px;
}

.song-category-list {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
}

.song-category-link {
    display: inline-flex;
    align-items: center;
    justify-content: space-between;
    gap: 18px;

    padding: 12px 18px;

    border: 1px solid rgba(0, 0, 0, 0.10);
    border-radius: 999px;

    background: #fff;
    color: #171717;

    text-decoration: none;

    transition:
        transform 0.2s ease,
        box-shadow 0.2s ease,
        background 0.2s ease,
        color 0.2s ease;
}

.song-category-link:hover {
    transform: translateY(-2px);

    background: #111;
    color: #fff;

    box-shadow:
        0 8px 24px
        rgba(0, 0, 0, 0.10);
}

.song-category-name {
    font-weight: 700;
}

.song-category-meta {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}

.song-category-count {
    font-size: 13px;
    font-weight: 600;
    opacity: 0.60;
}

.song-category-link:hover
.song-category-count {
    opacity: 0.85;
}

.song-category-link
.category-arrow {
    opacity: 0.65;
}

.song-category-link:hover
.category-arrow {
    opacity: 1;
}


@media (max-width: 600px) {

    .song-category-list {
        gap: 8px;
    }

    .song-category-link {
        padding: 10px 14px;
        font-size: 14px;
    }

}


/* =========================================================
   LYRICFIND 2026 — ORTAK GÖRSEL SİSTEM
   Lacivert / Mavi / Beyaz
   ========================================================= */
:root{
    --lf-navy:#0b1739;
    --lf-navy-2:#101f49;
    --lf-blue:#3157d5;
    --lf-blue-2:#4d6ee8;
    --lf-blue-soft:#eef3ff;
    --lf-bg:#f5f7fb;
    --lf-card:#ffffff;
    --lf-text:#172033;
    --lf-muted:#7a8497;
    --lf-line:#e6eaf2;
    --lf-radius:16px;
    --lf-shadow:0 10px 30px rgba(20,35,75,.07);
}

body{
    background:var(--lf-bg);
    color:var(--lf-text);
}

.container{
    width:min(1180px,calc(100% - 36px));
}

/* HEADER */
.site-header{
    min-height:72px;
    background:rgba(255,255,255,.97);
    border-bottom:1px solid var(--lf-line);
    box-shadow:0 5px 22px rgba(20,35,75,.05);
}
.brand{
    color:var(--lf-navy);
    font-size:26px;
}
.brand span{color:var(--lf-blue)}
.site-header nav > a{
    color:#465168;
    border-radius:10px;
}
.site-header nav > a:hover{
    background:var(--lf-blue-soft);
    color:var(--lf-blue);
}
.site-header nav .nav-cta{
    background:var(--lf-blue);
    color:#fff;
    box-shadow:0 7px 18px rgba(49,87,213,.20);
}
.site-header nav .nav-cta:hover{
    background:#274bc3;
    color:#fff;
}
.header-search input{
    border-color:#dfe4ed;
    background:#f8faff;
}
.header-search button{
    border-color:#dfe4ed;
    background:var(--lf-blue-soft);
    color:var(--lf-blue);
}

/* ORTAK SAYFA BAŞLIĞI */
.page-title{
    margin:24px 0 18px;
    padding:34px 24px;
    border:1px solid var(--lf-line);
    border-radius:20px;
    background:linear-gradient(135deg,#fff 0%,#f2f5ff 100%);
    box-shadow:var(--lf-shadow);
}
.page-title h1{
    color:var(--lf-navy);
    font-size:clamp(30px,4vw,44px);
}
.page-title p:not(.eyebrow){color:var(--lf-muted)}
.eyebrow{color:var(--lf-blue)}

/* BÖLÜMLER */
.section{padding:52px 0}
.section-soft{
    background:#eef2f8;
}
.section-heading h2{
    color:var(--lf-navy);
}
.section-heading p{color:var(--lf-muted)}
.section-link{
    color:var(--lf-blue);
}
.section-link:hover{color:#2447bd}

/* KARTLAR */
.card,.quick-card,.person-card{
    border-color:var(--lf-line);
    border-radius:var(--lf-radius);
    background:var(--lf-card);
    box-shadow:0 7px 24px rgba(20,35,75,.045);
}
.card:hover,.quick-card:hover,.person-card:hover{
    border-color:#cfd8f5;
    box-shadow:0 14px 32px rgba(20,35,75,.09);
}
.card h2,.person-card h3,.quick-card h3{
    color:var(--lf-navy);
}
.card h2 a:hover,.content-meta a:hover,.read-more{
    color:var(--lf-blue);
}
.quick-icon{
    background:var(--lf-blue-soft);
}
.tag{
    background:#f0f3f8;
    color:#566177;
}
.tag-gold{
    background:var(--lf-blue-soft);
    color:var(--lf-blue);
}

/* KATEGORİ PİLLERİ */
.poem-category-link,.song-category-link{
    border-color:var(--lf-line);
    border-radius:12px;
    color:#354158;
    box-shadow:0 4px 14px rgba(20,35,75,.035);
}
.poem-category-link:hover,.song-category-link:hover{
    background:var(--lf-blue);
    border-color:var(--lf-blue);
    color:#fff;
    box-shadow:0 10px 24px rgba(49,87,213,.18);
}

/* FORMLAR */
input,textarea,select{
    border-radius:10px;
}
input:focus,textarea:focus,select:focus,button:focus-visible,a:focus-visible{
    outline:3px solid rgba(49,87,213,.16);
    outline-offset:2px;
}

/* DETAY SAYFALARI — görseldeki ortak yapı */
.lfd{
    width:min(1120px,calc(100% - 32px))!important;
    margin:24px auto 48px!important;
}
.lfd-crumb{
    color:#929bad!important;
    font-size:12px!important;
}
.lfd-hero{
    padding:24px!important;
    border:1px solid var(--lf-line)!important;
    border-radius:20px!important;
    background:linear-gradient(135deg,#fff 0%,#f1f5ff 100%)!important;
    box-shadow:var(--lf-shadow)!important;
}
.lfd-photo{
    width:100px!important;height:100px!important;flex-basis:100px!important;
    border:4px solid #fff!important;
    border-radius:18px!important;
    box-shadow:0 8px 22px rgba(20,35,75,.10)!important;
}
.lfd-type{
    color:var(--lf-blue)!important;
}
.lfd-hero h1{
    color:var(--lf-navy)!important;
}
.lfd-by{
    color:var(--lf-blue)!important;
}
.lfd-chip{
    background:var(--lf-blue-soft)!important;
    color:#3654b8!important;
}
.lfd-grid{
    grid-template-columns:minmax(0,1fr) 310px!important;
    gap:20px!important;
}
.lfd-card{
    border:1px solid var(--lf-line)!important;
    border-radius:18px!important;
    box-shadow:0 8px 26px rgba(20,35,75,.05)!important;
}
.lfd-read{
    padding:28px 30px!important;
}
.lfd-read-head i{
    background:var(--lf-blue-soft)!important;
    color:var(--lf-blue)!important;
}
.lfd-read-head h2,.lfd-side-card h3{
    color:var(--lf-navy)!important;
}
.lfd-text{
    color:#29354a!important;
    font-size:16px!important;
    line-height:1.95!important;
}
.lfd-btn{
    background:var(--lf-blue)!important;
    border-radius:10px!important;
    box-shadow:0 6px 16px rgba(49,87,213,.18)!important;
}
.lfd-list a:hover{
    color:var(--lf-blue)!important;
}

/* PAYLAŞIM — gerçek marka ikonları, temiz kutular */
.lfd-share{
    margin-top:30px!important;
    padding-top:20px!important;
}
.lfd-share-title{
    color:#6d7890!important;
    font-size:12px!important;
}
.lfd-share-links{
    gap:9px!important;
}
.lfd-share-link{
    min-height:39px!important;
    padding:0 13px!important;
    border:1px solid var(--lf-line)!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#344054!important;
    box-shadow:0 3px 12px rgba(20,35,75,.035)!important;
}
.lfd-share-link:hover{
    border-color:#cbd5f4!important;
    background:#f7f9ff!important;
    transform:translateY(-2px)!important;
}
.lfd-share-link svg{
    width:16px!important;height:16px!important;
}

/* FOOTER */
.site-footer,footer{
    background:var(--lf-navy);
}
.footer-logo span{color:#6f8cff}
.footer-column a:hover{color:#91a6ff}

/* RESPONSIVE */
@media(max-width:900px){
    .mobile-menu-button{
        background:var(--lf-navy);
    }
    #main-navigation{
        border-color:var(--lf-line)!important;
        border-radius:16px!important;
        box-shadow:0 18px 42px rgba(20,35,75,.15)!important;
    }
}
@media(max-width:820px){
    .lfd-grid{grid-template-columns:1fr!important}
    .lfd-side{grid-template-columns:1fr 1fr!important}
}
@media(max-width:560px){
    .container{width:calc(100% - 20px)}
    .page-title{margin-top:12px;padding:24px 17px;border-radius:16px}
    .section{padding:38px 0}
    .lfd{width:calc(100% - 18px)!important;margin-top:12px!important}
    .lfd-hero{padding:16px!important;gap:13px!important}
    .lfd-photo{width:68px!important;height:68px!important;flex-basis:68px!important;border-radius:13px!important}
    .lfd-hero h1{font-size:24px!important}
    .lfd-read{padding:19px!important}
    .lfd-text{font-size:15px!important;line-height:1.85!important}
    .lfd-side{grid-template-columns:1fr!important}
    .lfd-share-links{grid-template-columns:1fr 1fr!important}
}


/* ===== LYRICFIND 2026 / TUM ON YUZ SAYFALARI V2 ===== */
.page-hero{margin:24px 0 18px!important;padding:30px 26px!important;border:1px solid var(--lf-line)!important;border-radius:20px!important;background:linear-gradient(135deg,#fff 0%,#f1f5ff 100%)!important;box-shadow:var(--lf-shadow)!important}
.page-hero h1{margin:5px 0 7px!important;color:var(--lf-navy)!important;font-size:clamp(29px,4vw,42px)!important}.page-hero p{max-width:680px!important;color:var(--lf-muted)!important}
.content-section{margin:22px 0 34px!important}.category-list,.category-grid{gap:9px!important}.cards,.person-grid{gap:16px!important}.cards .card,.person-card{padding:19px!important}
.person-card img,.artist-card img,.author-card img{border-radius:14px!important;box-shadow:0 6px 18px rgba(20,35,75,.08)!important}
.archive-summary{border:1px solid var(--lf-line)!important;border-radius:18px!important;background:linear-gradient(135deg,var(--lf-navy),var(--lf-navy-2))!important;box-shadow:0 12px 28px rgba(11,23,57,.12)!important}.archive-summary h2,.archive-summary p,.archive-summary .eyebrow{color:#fff!important}
.button,.btn-primary,.button-dark{border-radius:10px!important;background:var(--lf-blue)!important;color:#fff!important;box-shadow:0 7px 18px rgba(49,87,213,.18)!important}
.lf-popular{margin:24px auto!important}.lf-popular-grid{gap:14px!important}.lf-popular-card{border:1px solid var(--lf-line)!important;border-radius:16px!important;background:#fff!important;box-shadow:0 7px 24px rgba(20,35,75,.045)!important;overflow:hidden!important}.lf-popular-head{border-bottom:1px solid var(--lf-line)!important;background:#fbfcff!important}.lf-popular-head h2{color:var(--lf-navy)!important}.lf-popular-head a{color:var(--lf-blue)!important}.lf-popular-icon{background:var(--lf-blue-soft)!important;border-radius:9px!important}.lf-popular-item:hover{background:#f6f8ff!important}
.artist-page,.author-page{max-width:1120px!important}.artist-hero,.author-hero{border-color:var(--lf-line)!important;border-radius:20px!important;background:linear-gradient(135deg,#fff,#f1f5ff)!important;box-shadow:var(--lf-shadow)!important}.artist-photo,.author-photo{border-color:#fff!important;box-shadow:0 9px 25px rgba(20,35,75,.10)!important}
.member-page,.profile-page{max-width:1120px;margin:28px auto 60px;padding:0 18px}.member-card,.profile-card{border:1px solid var(--lf-line)!important;border-radius:18px!important;background:#fff!important;box-shadow:var(--lf-shadow)!important}
.card h2,.card h3{line-height:1.25!important}.card p{color:#68748a!important;line-height:1.7!important}.content-meta{color:#8993a5!important}.read-more{font-weight:800!important}
@media(max-width:700px){.page-hero{margin-top:12px!important;padding:22px 17px!important;border-radius:16px!important}.lf-popular-grid{grid-template-columns:1fr!important}.cards,.person-grid{grid-template-columns:1fr!important}.archive-summary{padding:20px!important}}


/* =========================================================
   LYRICFIND V3 — KATEGORİLER + İÇERİK LİSTELERİ
   Derli toplu, kompakt, dengeli
   ========================================================= */

/* Kategori alanı */
.category-section,
.categories-section,
.content-section:has(.poem-category-link),
.content-section:has(.song-category-link){
    margin:18px 0 26px!important;
    padding:20px!important;
    border:1px solid var(--lf-line)!important;
    border-radius:18px!important;
    background:#fff!important;
    box-shadow:0 7px 24px rgba(20,35,75,.045)!important;
}
.category-section .section-head,
.categories-section .section-head{
    margin-bottom:14px!important;
}
.category-section h2,
.categories-section h2{
    margin:0!important;
    color:var(--lf-navy)!important;
    font-size:20px!important;
}

/* kategori butonları */
.poem-category-list,
.song-category-list,
.category-list,
.category-grid{
    display:grid!important;
    grid-template-columns:repeat(5,minmax(0,1fr))!important;
    gap:9px!important;
    align-items:stretch!important;
}
.poem-category-link,
.song-category-link{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:8px!important;
    min-width:0!important;
    min-height:44px!important;
    padding:9px 12px!important;
    margin:0!important;
    border:1px solid #e2e7f0!important;
    border-radius:10px!important;
    background:#f8faff!important;
    color:#354158!important;
    font-size:12px!important;
    font-weight:750!important;
    line-height:1.25!important;
    box-shadow:none!important;
    transition:.18s ease!important;
}
.poem-category-link:hover,
.song-category-link:hover{
    background:var(--lf-blue)!important;
    border-color:var(--lf-blue)!important;
    color:#fff!important;
    transform:translateY(-1px)!important;
    box-shadow:0 7px 16px rgba(49,87,213,.16)!important;
}
.poem-category-link span,
.song-category-link span{
    min-width:0!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    white-space:nowrap!important;
}

/* Şarkı ve şiir içerik alanları */
.content-section .section-head{
    display:flex!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    margin-bottom:14px!important;
}
.content-section .section-head h2{
    margin:0!important;
    color:var(--lf-navy)!important;
    font-size:21px!important;
}

/* İçerik kartları: masaüstünde 2 kolon */
.content-section .cards{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:12px!important;
}
.content-section .card{
    position:relative!important;
    min-width:0!important;
    margin:0!important;
    padding:17px 18px!important;
    border:1px solid #e3e8f1!important;
    border-radius:14px!important;
    background:#fff!important;
    box-shadow:0 4px 15px rgba(20,35,75,.035)!important;
    transition:.18s ease!important;
}
.content-section .card:hover{
    border-color:#cbd5f4!important;
    transform:translateY(-2px)!important;
    box-shadow:0 10px 24px rgba(20,35,75,.075)!important;
}
.content-section .card h2,
.content-section .card h3{
    margin:8px 0 6px!important;
    color:var(--lf-navy)!important;
    font-size:17px!important;
    line-height:1.35!important;
}
.content-section .card h2 a,
.content-section .card h3 a{
    color:inherit!important;
    text-decoration:none!important;
}
.content-section .card p{
    display:-webkit-box!important;
    -webkit-line-clamp:3!important;
    -webkit-box-orient:vertical!important;
    overflow:hidden!important;
    margin:8px 0!important;
    color:#69758a!important;
    font-size:13px!important;
    line-height:1.65!important;
}
.content-section .card small,
.content-section .content-meta{
    color:#8a94a6!important;
    font-size:11px!important;
}
.content-section .tag{
    min-height:24px!important;
    padding:4px 8px!important;
    border-radius:7px!important;
    font-size:10px!important;
    letter-spacing:.25px!important;
}
.content-section .read-more{
    display:inline-flex!important;
    margin-top:6px!important;
    color:var(--lf-blue)!important;
    font-size:12px!important;
    font-weight:800!important;
}

/* Uzun içerik taşmasını önle */
.content-section .card,
.content-section .card *{
    overflow-wrap:anywhere;
}

/* Tablet */
@media(max-width:960px){
    .poem-category-list,
    .song-category-list,
    .category-list,
    .category-grid{
        grid-template-columns:repeat(3,minmax(0,1fr))!important;
    }
}

/* Telefon */
@media(max-width:650px){
    .category-section,
    .categories-section,
    .content-section:has(.poem-category-link),
    .content-section:has(.song-category-link){
        padding:14px!important;
        border-radius:14px!important;
    }
    .poem-category-list,
    .song-category-list,
    .category-list,
    .category-grid{
        grid-template-columns:repeat(2,minmax(0,1fr))!important;
        gap:7px!important;
    }
    .poem-category-link,
    .song-category-link{
        min-height:41px!important;
        padding:8px 9px!important;
        font-size:11px!important;
    }
    .content-section .cards{
        grid-template-columns:1fr!important;
        gap:9px!important;
    }
    .content-section .card{
        padding:14px!important;
        border-radius:12px!important;
    }
    .content-section .card h2,
    .content-section .card h3{
        font-size:16px!important;
    }
}


/* =========================================================
   LYRICFIND V4 — TEK SÜTUN KATEGORİ + TEK SÜTUN ESER LİSTESİ
   Yeni kategori eklendikçe otomatik aşağı doğru sıralanır.
   ========================================================= */

/* Kategori alanı: TEK SÜTUN */
.poem-category-list,
.song-category-list,
.category-list,
.category-grid{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:7px!important;
    width:100%!important;
    max-width:none!important;
}

.poem-category-link,
.song-category-link{
    display:flex!important;
    width:100%!important;
    min-height:42px!important;
    align-items:center!important;
    justify-content:space-between!important;
    gap:12px!important;
    padding:9px 13px!important;
    margin:0!important;
    border:1px solid #e3e8f1!important;
    border-radius:9px!important;
    background:#fff!important;
    color:#354158!important;
    box-shadow:none!important;
}
.poem-category-link:hover,
.song-category-link:hover{
    background:#f3f6ff!important;
    border-color:#cbd6f6!important;
    color:var(--lf-blue)!important;
    transform:none!important;
    box-shadow:none!important;
}

/* Şarkı / şiir listesi: her eser ayrı, tek sütun satır kartı */
.content-section .cards{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
}
.content-section .card{
    display:block!important;
    width:100%!important;
    min-height:0!important;
    margin:0!important;
    padding:14px 16px!important;
    border:1px solid #e3e8f1!important;
    border-radius:11px!important;
    background:#fff!important;
    box-shadow:0 2px 9px rgba(20,35,75,.025)!important;
}
.content-section .card:hover{
    transform:none!important;
    border-color:#cbd6f6!important;
    background:#fbfcff!important;
    box-shadow:0 5px 14px rgba(20,35,75,.05)!important;
}
.content-section .card h2,
.content-section .card h3{
    margin:5px 0!important;
    font-size:16px!important;
}
.content-section .card p{
    -webkit-line-clamp:2!important;
    margin:5px 0!important;
    font-size:12.5px!important;
    line-height:1.55!important;
}
.content-section .read-more{
    margin-top:3px!important;
}

/* Masaüstünde içerik gereksiz yere devleşmesin */
@media(min-width:900px){
    .category-section,
    .categories-section,
    .content-section:has(.poem-category-link),
    .content-section:has(.song-category-link){
        padding:18px 20px!important;
    }
}

/* Telefon da aynı mantık: tek sütun */
@media(max-width:650px){
    .poem-category-list,
    .song-category-list,
    .category-list,
    .category-grid,
    .content-section .cards{
        grid-template-columns:1fr!important;
    }
    .poem-category-link,
    .song-category-link{
        min-height:40px!important;
        padding:8px 10px!important;
    }
    .content-section .card{
        padding:12px!important;
    }
}


/* ===== LYRICFIND REFERANS TASARIM V13 - HEADER/FOOTER ===== */
.site-header{min-height:72px!important;padding:0 max(24px,calc((100% - 1460px)/2))!important;background:#071827!important;border-bottom:1px solid rgba(255,255,255,.08)!important;box-shadow:none!important;gap:24px!important}.site-header .brand{display:flex!important;align-items:center!important;gap:8px!important;color:#fff!important;text-decoration:none!important}.lf-logo-mark{color:#f6bd45!important;font-size:34px!important;line-height:1!important}.lf-logo-copy{display:flex;flex-direction:column;line-height:1}.lf-logo-copy strong{font-size:25px;font-style:italic;letter-spacing:.5px;color:#fff}.lf-logo-copy strong span{color:#f6bd45!important}.lf-logo-copy small{margin-top:4px;font-size:8px;font-weight:600;color:#c9d2dc;letter-spacing:.1px}.site-header #main-navigation{gap:8px!important}.site-header #main-navigation>a{color:#fff!important;font-size:12px!important;padding:8px 10px!important}.site-header #main-navigation>a:first-of-type{color:#f6bd45!important}.site-header .header-search{order:20;width:250px!important;height:38px!important;margin-left:auto!important}.site-header .header-search input{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important}.site-header .header-search input::placeholder{color:#aab6c2}.site-header .header-search button{background:rgba(255,255,255,.12)!important;color:#fff!important;border-color:rgba(255,255,255,.12)!important}.site-header .member-actions{order:30}.site-header #main-navigation .login-link{background:transparent!important;border:0!important;color:#fff!important;box-shadow:none!important}.site-header #main-navigation .register-link{background:#f6bd45!important;border-color:#f6bd45!important;color:#111827!important;border-radius:99px!important}.site-footer{background:#071827!important;color:#fff!important;padding:0!important;text-align:left!important}.footer-inner{width:min(1460px,calc(100% - 46px))!important;grid-template-columns:2fr repeat(3,1fr)!important;padding:34px 0 25px!important}.footer-logo{font-style:italic!important}.footer-logo span{color:#f6bd45!important}.footer-bottom{width:min(1460px,calc(100% - 46px))!important;padding:16px 0 20px!important}.footer-brand p{font-size:11px!important}.footer-column h3{font-size:12px!important}.footer-column a{font-size:11px!important}
@media(max-width:1100px){.site-header{padding:0 18px!important}.site-header .header-search{width:190px!important}.site-header #main-navigation>a{font-size:11px!important;padding:7px!important}}
@media(max-width:900px){.site-header{min-height:64px!important}.lf-logo-copy small{display:none}.site-header .mobile-menu-button{background:#102a42!important}.site-header #main-navigation{background:#fff!important}.site-header #main-navigation>a{color:#15243a!important}.site-header .header-search{order:0;width:100%!important}.footer-inner{width:calc(100% - 30px)!important}.footer-bottom{width:calc(100% - 30px)!important}}