/*
Theme Name: Ona Architecture
Theme URI: https://deothemes.com/wordpress-themes/ona-block-wordpress-theme/
Author: DeoThemes
Author URI: https://deothemes.com
Description: Ona Architecture is a sleek and sophisticated WordPress theme designed specifically for architects, interior designers, design studios, construction firms, and creative professionals in the built environment. This meticulously crafted block-based theme offers a clean, minimalist aesthetic that beautifully showcases architectural projects and portfolios. Winner of the prestigious Anyone Can WP design contest, Ona Architecture combines cutting-edge design with exceptional functionality. The theme features a responsive layout that seamlessly adapts to all devices, ensuring your architectural vision looks stunning on desktops, tablets, and smartphones.
Requires at least: 5.8
Tested up to: 6.7
Requires PHP: 5.6
Version: 1.0.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: ona-news
Tags: blog, portfolio, entertainment, grid-layout, one-column, two-columns, three-columns, four-columns, custom-colors, custom-menu, custom-logo, editor-style, featured-images, full-site-editing, full-width-template, block-patterns, block-styles, rtl-language-support, sticky-post, threaded-comments, style-variations, template-editing, theme-options, translation-ready, wide-blocks
Template: ona

Ona Architecture WordPress Theme, Copyright (c) 2024 by DeoThemes.
Ona Architecture is distributed under the terms of the GNU GPL.
*/

/* Explicitly load Urbanist so it's available to all elements */
@font-face {
    font-family: "Urbanist";
    src: url("./assets/fonts/urbanist/Urbanist-SemiBold.ttf") format("truetype");
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* Gallery image hover effects */
.wp-block-gallery .wp-block-image {
    overflow: hidden;
    cursor: pointer;
    border-radius: 10px;
}

.wp-block-gallery .wp-block-image img {
    transition: transform 0.3s ease, filter 0.3s ease;
}

.wp-block-gallery .wp-block-image:hover img {
    transform: scale(1.05);
    filter: brightness(0.9);
}

/* FAQ Accordion — WordPress Details block */
.ash-faq-wrap {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.ash-faq-wrap .wp-block-details {
    border-radius: 6px;
    overflow: hidden;
    border: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.ash-faq-wrap .wp-block-details summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 1.1rem 1.6rem;
    font-family: "Urbanist", sans-serif !important;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: normal;
    color: #fff;
    cursor: pointer;
    list-style: none;
}

.ash-faq-wrap .wp-block-details summary::-webkit-details-marker { display: none; }

.ash-faq-wrap .wp-block-details summary::after {
    content: '+';
    font-size: 1.4rem;
    font-weight: 300;
    color: #fff;
    flex-shrink: 0;
    margin-left: 1rem;
    transition: transform 0.3s ease;
    line-height: 1;
}

.ash-faq-wrap .wp-block-details[open] summary::after {
    transform: rotate(45deg);
}

.ash-faq-wrap .wp-block-details > *:not(summary) {
    padding: 1rem 1.6rem 1.2rem;
    font-family: inherit;
    color: #1a1a1a;
    background: #fff;
    margin: 0;
    border-radius: 0 0 6px 6px;
}

/* Desktop: gradient border around open accordion */
.ash-faq-wrap .wp-block-details[open] {
    overflow: visible !important;
    position: relative;
    isolation: isolate;
}

.ash-faq-wrap .wp-block-details[open]::before {
    content: '';
    position: absolute;
    inset: -2px;
    z-index: -1;
    border-radius: 8px;
    background: inherit;
}

/* Mobile: full-bleed, no gaps, no rounded corners */
@media (max-width: 599px) {
    .wp-block-group:has(.ash-faq-wrap) {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    .ash-faq-wrap {
        gap: 0;
    }
    .ash-faq-wrap .wp-block-details {
        border-radius: 0 !important;
    }
    .ash-faq-wrap .wp-block-details[open]::before {
        display: none;
    }
}

/* Stepped gradients — dark to light as rows descend */
.ash-faq-wrap .wp-block-details:nth-child(1)  { background: linear-gradient(135deg, rgb(30,120,65) 0%, rgb(47,156,87) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(2)  { background: linear-gradient(135deg, rgb(36,128,70) 0%, rgb(54,163,94) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(3)  { background: linear-gradient(135deg, rgb(42,136,76) 0%, rgb(61,170,101) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(4)  { background: linear-gradient(135deg, rgb(48,144,82) 0%, rgb(68,177,108) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(5)  { background: linear-gradient(135deg, rgb(54,152,88) 0%, rgb(75,184,115) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(6)  { background: linear-gradient(135deg, rgb(62,160,96) 0%, rgb(83,190,122) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(7)  { background: linear-gradient(135deg, rgb(70,168,104) 0%, rgb(91,196,129) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(8)  { background: linear-gradient(135deg, rgb(78,176,112) 0%, rgb(99,202,136) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(9)  { background: linear-gradient(135deg, rgb(86,184,120) 0%, rgb(107,208,143) 100%); }
.ash-faq-wrap .wp-block-details:nth-child(10) { background: linear-gradient(135deg, rgb(94,192,128) 0%, rgb(114,210,144) 100%); }

/* Mobile header — centre the hamburger in its own column */
@media (max-width: 781px) {
    .wp-block-template-part:not(footer) .wp-block-columns > .wp-block-column:nth-child(2) .wp-block-group {
        justify-content: center !important;
    }
    .wp-block-template-part:not(footer) .wp-block-navigation.ona-sm-down-justify-content-end {
        justify-content: center !important;
    }
    .wp-block-template-part:not(footer) .wp-block-navigation__responsive-container-open {
        margin: 0 auto !important;
    }
    /* Shrink button font and padding to fit the narrower column */
    .wp-block-template-part:not(footer) .wp-block-button__link {
        white-space: nowrap !important;
        font-size: 0.7rem !important;
        padding: 12px 8px !important;
    }
}


/* Reduce AOS fade-up distance to minimise gap between coloured sections */
[data-aos="fade-up"] {
    transform: translate3d(0, 25px, 0);
}
[data-aos="fade-up"].aos-animate {
    transform: translate3d(0, 0, 0);
}

/* Equal-height cards — Why Choose section */
.wp-block-columns:has(.wp-block-column.ash-why-cards) {
    align-items: stretch !important;
}

.wp-block-column.ash-why-cards {
    display: grid !important;
    grid-template-rows: auto 1fr;
    align-self: stretch !important;
}

.wp-block-column.ash-why-cards > .wp-block-group:last-child {
    height: 100%;
}