/*
 Theme Name:   FISH_V1
 Theme URI:    http://demo.cocobasic.com/park-wp
 Description:  FISH_V1 — Custom theme based on Park WP
 Author:       CocoBasic
 Author URI:   http://cocobasic.com/
 Tags: grid-layout, four-columns, custom-colors, featured-images, threaded-comments, translation-ready, theme-options
 Template:     park-wp
 Text Domain:  park-wp-child
*/

/* ==============================================
   About Page — page-about.php
   ============================================== */

.about-member {
    padding-bottom: 60px;
    margin-bottom: 60px;
    border-bottom: 1px solid #e8e8e4;
}

.about-member:last-of-type {
    border-bottom: none;
    margin-bottom: 0;
    padding-bottom: 0;
}

.about-member-photo {
    margin-bottom: 24px;
    line-height: 0;
}

.about-photo-img {
    width: 200px;
    height: 200px;
    object-fit: cover;
    display: block;
}

.about-member-name {
    font-family: 'Inter', sans-serif;
    font-size: 28px;
    line-height: 34px;
    font-weight: 400;
    color: #000;
    padding: 0;
    margin: 0 0 16px 0;
}

.about-member-bio {
    font-size: 16px;
    line-height: 28px;
    color: #444;
}

.about-member-bio a {
    color: #000;
    text-decoration: none;
    transition: color .2s linear;
}

.about-member-bio a:hover {
    color: #6a6a6a;
}

.about-collabs {
    padding-top: 60px;
    border-top: 1px solid #e8e8e4;
    margin-top: 0;
    margin-bottom: 60px;
}

.about-collabs-title {
    font-family: 'Inter', sans-serif;
    font-size: 28px;
    font-weight: 400;
    color: #000;
    padding: 0;
    margin: 0 0 12px 0;
}

.about-collabs-intro {
    font-size: 14px;
    color: #888;
    letter-spacing: 0.5px;
    margin-bottom: 24px;
    line-height: 22px;
}

.about-collabs-list {
    list-style: none;
    padding: 0;
    margin: 0;
}

.about-collabs-list li {
    font-size: 16px;
    line-height: 28px;
    color: #444;
    border-bottom: 1px solid #efefec;
    padding: 10px 0;
}

.about-collabs-list li:last-child {
    border-bottom: none;
}

.about-collabs-list a {
    color: #000;
    text-decoration: none;
    transition: color .2s linear;
}

.about-collabs-list a:hover {
    color: #6a6a6a;
}

.about-cta {
    border-top: 1px solid #e8e8e4;
    padding-top: 50px;
    margin-top: 0;
}

.about-cta-text {
    font-family: 'Inter', sans-serif;
    font-style: italic;
    font-size: 22px;
    line-height: 32px;
    color: #000;
    margin-bottom: 30px;
}

.about-cta-btn {
    display: inline-block;
    color: #000;
    border: 1px solid #000;
    text-align: center;
    padding: 20px 45px;
    text-decoration: none;
    font-family: 'Inter', sans-serif;
    font-weight: 400;
    font-size: 11px;
    text-transform: uppercase;
    letter-spacing: 5px;
    transition: color .3s ease, background-color .3s ease;
}

.about-cta-btn:hover {
    background-color: #000;
    color: #fff;
}

@media screen and (max-width: 750px) {
    .about-photo-img {
        width: 150px;
        height: 150px;
    }
    .about-member-name {
        font-size: 22px;
        line-height: 28px;
    }
    .about-cta-text {
        font-size: 18px;
        line-height: 26px;
    }
}


/* ==============================================
   Global Font Override — Inter (Google Fonts)
   Replaces Lato, Playfair Display, Montserrat
   Weights retained, only typeface changed
   ============================================== */

body,
body a,
.blog-item-holder .excerpt,
.entry-info,
.nav-links p,
#reply-title,
#commentform #email,
#commentform #author,
#commentform #comment,
#header-main-menu .search-field,
.widget_search .search-field,
.wpcf7 input[type=text],
.wpcf7 input[type=email],
.wpcf7 textarea,
.wpcf7 input[type=submit],
.form-submit input[type=submit],
.post-password-form input[name="post_password"] {
    font-family: 'Inter', sans-serif !important;
}

.page h1.entry-title,
.blog h1.entry-title,
.taxonomy-title h1,
.search .search-title h1,
.archive-title h1,
.single h1.entry-title,
.blog-item-holder h2.entry-title,
.nav-previous a,
.nav-next a,
h4.widgettitle,
.widget_search .search-field,
.about-member-name,
.about-collabs-title,
.about-cta-text {
    font-family: 'Inter', sans-serif !important;
}


/* ==============================================
   Accent Colour Override — #fffaa3 → #aedbe5
   ============================================== */

/* Text selection highlight */
.site-wrapper ::selection { background-color: #aedbe5; }
.site-wrapper ::-moz-selection { background-color: #aedbe5; }

/* Underline accent on headings (.underline class) */
.underline:after { background-color: #aedbe5; }

/* Nav menu active/hover state */
.sm-clean a.current,
.sm-clean a:hover,
.main-menu.sm-clean .sub-menu li a.current,
.main-menu.sm-clean .sub-menu li a:hover { color: #aedbe5; }

/* Nav submenu arrow */
.sm-clean a span.sub-arrow { color: #aedbe5; }

/* Category link underline on blog cards */
.blog-item-holder .entry-info .cat-links a:after { background-color: #aedbe5; }

/* Read more arrow hover */
.read-more-arrow a:hover { color: #aedbe5; }

/* Comment reply author underline */
.replay-at-author:after { background-color: #aedbe5; }

/* Blockquote left border (common.css) */
#content blockquote { border-left-color: #aedbe5; }

/* About page underline accent */
.about-collabs-title .underline:after { background-color: #aedbe5; }


/* ==============================================
   Homepage — hide category tags
   ============================================== */

.home .blog-item-holder .cat-links {
    display: none;
}


/* ==============================================
   Homepage — blog title size + intro paragraph
   ============================================== */

/* Reduce blog title — change 32px to whatever size you prefer */
.home .header-content h1.entry-title {
    font-size: 32px;
    line-height: 42px;
    padding-bottom: 16px;
}

/* Intro paragraph below the blog title */
.home-intro {
    font-size: 16px;
    line-height: 28px;
    color: #444;
    max-width: 640px;
    padding-bottom: 20px;
}

/* Reduce gap between intro and first post on homepage */
.home .blog-holder {
    margin-top: 0;
}

.home .blog-item-holder:first-of-type {
    margin-top: 20px;
}


/* ==============================================
   Footer — Logo + copyright + social
   ============================================== */

.footer-logo {
    text-align: center;
    padding-bottom: 30px;
    border-bottom: 1px solid #1a1a1a;
    margin-bottom: 24px;
}

.footer-logo-img {
    max-height: 40px;
    width: auto;
    display: inline-block;
}

.footer-site-name {
    font-family: 'Inter', sans-serif;
    font-size: 18px;
    font-weight: 600;
    color: #444;
    text-decoration: none;
}


/* ==============================================
   Footer — background, border, text colour
   ============================================== */

/* Use .fish-footer for higher specificity over parent theme's .footer black */
.footer.fish-footer {
    background: #f4f4f1 !important;
    color: #444 !important;
    border-top: 1px solid #444444;
}

.footer.fish-footer a {
    color: #444 !important;
}

.footer.fish-footer a:hover {
    color: #000 !important;
}

/* Logo removed from footer — divider not needed */
.footer-logo {
    display: none;
}

/* Remove grey line above copyright — empty footer sidebar border */
ul#footer-sidebar {
    display: none;
}

/* ==============================================
   Gallery Slider — Splide.js
   ============================================== */

.fish-splide {
    margin: 40px auto;
    width: 830px;
    max-width: 830px;
}

.fish-splide .splide__slide img {
    width: 100%;
    height: auto;
    display: block;
}

/* Arrows */
.fish-splide .splide__arrow {
    background: #fff;
    border: 1px solid #e8e8e4;
    opacity: 1;
    width: 44px;
    height: 44px;
}

.fish-splide .splide__arrow svg {
    fill: #444;
    width: 16px;
    height: 16px;
}

.fish-splide .splide__arrow:hover {
    background: #000;
}

.fish-splide .splide__arrow:hover svg {
    fill: #fff;
}

/* Dots */
.fish-splide .splide__pagination__page {
    background: #ccc;
    width: 8px;
    height: 8px;
}

.fish-splide .splide__pagination__page.is-active {
    background: #000;
    transform: scale(1);
}

@media screen and (max-width: 900px) {
    .fish-splide {
        width: 100%;
        max-width: 100%;
    }
}


/* ==============================================
   Single post — page title overrides
   ============================================== */

.single h1.entry-title {
    font-size: 48px;
    line-height: 115%;
    color: #777777;
    font-weight: 700;
    letter-spacing: -0.025em;
}


/* ==============================================
   Single post — smaller logo
   ============================================== */

.single .header-logo img {
    max-height: 70px;
    width: auto;
}


/* ==============================================
   Single post — match homepage background
   ============================================== */

.single .entry-header,
.single-post .entry-content,
.single .entry-content {
    background-color: #f4f4f1 !important;
}


/* Reduce spacing between title and body copy */
.single-post .entry-content {
    padding: 40px 0 85px 0;
}

/* Fix nav-links white background */
.single .nav-links {
    background-color: #f4f4f1 !important;
}


/* ==============================================
   Slider captions
   ============================================== */

/* Push dots above the caption */
.fish-splide .splide__pagination {
    bottom: auto;
    position: relative;
    padding: 12px 0 0;
    display: flex;
    justify-content: center;
}

/* Caption sits below the dots */
.fish-caption {
    text-align: center;
    padding: 8px 0 12px;
    font-size: 13px;
    color: #888;
    line-height: 1.5;
}

.fish-caption a {
    color: #444;
    text-decoration: none;
    border-bottom: 1px solid #aedbe5;
    padding-bottom: 1px;
    transition: color .2s ease, border-color .2s ease;
}

.fish-caption a:hover {
    color: #000;
    border-bottom-color: #000;
}

.fish-caption-arrow {
    font-size: 12px;
    margin-left: 4px;
}


/* ==============================================
   Mobile — single post fixes
   ============================================== */

@media screen and (max-width: 750px) {

    /* Reduce headline size */
    .single h1.entry-title {
        font-size: 28px;
        line-height: 120%;
        padding: 20px 20px 16px;
    }

    /* Add side margins to body copy */
    .single .entry-content .content-570 {
        padding-left: 20px;
        padding-right: 20px;
        width: 100%;
        box-sizing: border-box;
    }

    /* Header area side padding */
    .single .entry-header {
        padding-left: 20px;
        padding-right: 20px;
        box-sizing: border-box;
    }

    /* Nav links side padding */
    .single .nav-links .content-570 {
        padding-left: 20px;
        padding-right: 20px;
        width: 100%;
        box-sizing: border-box;
    }

    /* Slider full width on mobile */
    .fish-splide {
        width: 100% !important;
        max-width: 100% !important;
        margin: 30px 0;
    }
}

/* Mobile — left align headline */
@media screen and (max-width: 750px) {
    .single h1.entry-title {
        text-align: left;
    }
}

/* Mobile — consistent left alignment for headline and body */
@media screen and (max-width: 750px) {
    .single .entry-header.content-830,
    .single .entry-content .content-570 {
        padding-left: 24px !important;
        padding-right: 24px !important;
        width: 100% !important;
        box-sizing: border-box !important;
    }
}

/* Mobile — force both headline and body to same 24px left edge */
@media screen and (max-width: 750px) {

    .single .entry-header,
    .single .entry-header.content-830,
    .single h1.entry-title {
        padding-left: 24px !important;
        padding-right: 24px !important;
        box-sizing: border-box !important;
        width: 100% !important;
    }

    .single .entry-content,
    .single .entry-content .content-570,
    .single-post .entry-content .content-570 {
        padding-left: 24px !important;
        padding-right: 24px !important;
        box-sizing: border-box !important;
        width: 100% !important;
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }
}

/* Mobile — nuclear alignment fix */
@media screen and (max-width: 750px) {

    .single .entry-header,
    .single .entry-header.content-830,
    .single .entry-content,
    .single-post .entry-content,
    .single .entry-content .content-570,
    .single-post .entry-content .content-570,
    .single h1.entry-title {
        width: 100% !important;
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        float: none !important;
        box-sizing: border-box !important;
        left: auto !important;
        position: relative !important;
        transform: none !important;
    }
}


/* ==============================================
   Single post — constrain headline to body width
   ============================================== */

.single .entry-header {
    max-width: 570px;
    margin-left: auto;
    margin-right: auto;
}