@charset "UTF-8";

/* ===============================================
  Maniwa — 真庭の農業の今（ページ固有のみ）
  共通: common/css/base.css, project.css, layout.css 等
=============================================== */

.maniwa-muted {
    color: #555;
}

/* ==============================
  Lead（#lead）
============================== */
.maniwa-lead {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1em;
}

.maniwa-lead__title,
.maniwa-lead__text {
    width: 100%;
    letter-spacing: 0.06em;
    line-height: 2;
    text-align: left;
}

@media (min-width: 1024px) {
    .maniwa-lead__title {
        text-align: center;
    }
}

@media (min-width: 1280px) {
    .maniwa-lead__text {
        text-align: center;
    }
}

/* ==============================
  Map
============================== */
.maniwa-map {
    width: 100%;
    height: auto;
}

.maniwa-map--okayama {
    aspect-ratio: 3 / 2;
    object-fit: contain;
}

.maniwa-map--maniwa {
    max-width: 33.75em;
    margin-inline: auto;
}

/* ==============================
  About Maniwa（#about-maniwa）
============================== */
.maniwa-about__intro {
    align-items: start;
}

/* ==============================
  Stats
============================== */
.maniwa-stats {
    margin-top: 2em;
    width: 100%;
}

.maniwa-stats__grid {
    display: grid;
    grid-template-columns: 1fr;
    border-top: 1px solid var(--color-dark-gray);
    border-bottom: 1px solid var(--color-dark-gray);
}

.maniwa-stats__cell {
    display: flex;
    align-items: center;
    gap: 1em;
    min-height: 7.125em;
    padding: 1em 1.5em;
    border-bottom: 1px solid var(--color-dark-gray);
}

.maniwa-stats__cell:last-child {
    border-bottom: none;
}

.maniwa-stats__icon {
    flex-shrink: 0;
    font-size: 3.5em;
    line-height: 1;
    color: var(--color-dark-gray);
    font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 0, 'opsz' 48;
}

.maniwa-stats__data {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    min-width: 0;
}

.maniwa-stats__label {
    font-weight: 700;
    color: var(--color-dark-gray);
    letter-spacing: 0.06em;
    line-height: 2;
    white-space: nowrap;
}

.maniwa-stats__value {
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: 0.06em;
    line-height: 2;
    white-space: nowrap;
}

/* ==============================
  Ranking
============================== */
.maniwa-ranking {
    margin-top: 2em;
}

.maniwa-ranking__title {
    line-height: 2;
    letter-spacing: 0.06em;
}

.maniwa-ranking__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0;
    margin: 1.5em 0 0;
    padding: 0;
    list-style: none;
    border-top: 1px solid var(--color-dark-gray);
    border-bottom: 1px solid var(--color-dark-gray);
}

.maniwa-ranking__item {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: space-between;
    gap: 1em;
    min-height: 9.4375em;
    padding: 1.5em 1.5em;
    border-bottom: 1px solid var(--color-dark-gray);
    text-align: left;
}

.maniwa-ranking__item:last-child {
    border-bottom: none;
}

.maniwa-ranking__rank {
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
    flex-shrink: 0;
    gap: 0.25em;
    color: var(--color-primary);
    font-weight: 700;
    line-height: 1;
}

.maniwa-ranking__num {
    font-size: 3.333em;
    line-height: 1;
}

.maniwa-ranking__desc {
    font-weight: 700;
    color: var(--color-dark-gray);
    letter-spacing: 0.06em;
    line-height: 2;
}

.maniwa-ranking__note {
    margin-top: 1em;
    text-align: right;
}

/* ==============================
  Agriculture（#agri）
============================== */
.maniwa-agri__lead {
    line-height: 2;
    letter-spacing: 0.06em;
}

.maniwa-agri__layout {
    align-items: start;
}

.maniwa-region__block + .maniwa-region__block {
    margin-top: 2em;
    padding-top: 2em;
    border-top: 4px solid var(--color-light-gold);
}

.maniwa-region__name {
    font-size: 1.091em;
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: 0.06em;
    line-height: 2;
    margin-bottom: 0.5em;
}

.maniwa-region__list {
    display: flex;
    flex-direction: column;
    gap: 1.25em;
    margin: 0;
    padding: 0;
    list-style: none;
}

.maniwa-region__item {
    display: grid;
    grid-template-columns: 4.6875em minmax(0, 1fr);
    gap: 1em;
    align-items: start;
}

.maniwa-region__item + .maniwa-region__item {
    padding-top: 1.25em;
    border-top: 4px solid var(--color-light-gold);
}

.maniwa-region__thumb {
    width: 4.6875em;
    height: 4.6875em;
    border-radius: 50%;
    object-fit: cover;
}

.maniwa-region__item p {
    line-height: 2;
    letter-spacing: 0.06em;
    color: #555;
}

.maniwa-data {
    margin-top: 2em;
}

.maniwa-data__heading {
    line-height: 2;
    letter-spacing: 0.06em;
}

.maniwa-data__list {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1em;
    margin: 1.25em 0 0;
    padding: 0;
    list-style: none;
}

.maniwa-data__card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 1.5625em;
    min-width: 0;
    padding: 2em 0.75em;
    border: 4px solid var(--color-light-gold);
    text-align: center;
}

.maniwa-data__value {
    display: flex;
    align-items: flex-end;
    justify-content: center;
    gap: 0.25em;
    color: var(--color-primary);
    font-weight: 700;
    line-height: 1;
    max-width: 100%;
}

.maniwa-data__num {
    font-size: clamp(2.5em, 5vw, 3.333em);
    line-height: 1;
}

.maniwa-data__prefix,
.maniwa-data__suffix {
    font-size: 1em;
    line-height: 1.4;
    flex-shrink: 0;
    align-self: flex-end;
    padding-bottom: 0.1em;
}

.maniwa-data__label {
    width: 100%;
    font-size: 0.875em;
    letter-spacing: 0.06em;
    line-height: 1.5;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.maniwa-data__note {
    margin-top: 1.25em;
    text-align: right;
}

.maniwa-agri__closing {
    line-height: 2;
    letter-spacing: 0.06em;
}

/* ==============================
  Biomass（#biomass）
============================== */
.maniwa-biomass {
    background: var(--color-light-gray);
}

.maniwa-biomass__card {
    padding: 2em;
    background: var(--color-white);
}

.maniwa-biomass__main {
    align-items: start;
}

.maniwa-biomass__media.column__item {
    width: 70%;
    align-self: center;
}

.maniwa-biomass__link-wrap {
    display: flex;
    justify-content: flex-end;
    margin-top: 2em;
}

.maniwa-biomass__card + .maniwa-biomass__card {
    margin-top: 1.5em;
}

.maniwa-biomass__title {
    font-size: 1.136em;
    font-weight: 700;
    color: var(--color-primary);
    letter-spacing: 0.06em;
    line-height: 2;
    margin-bottom: 0.25em;
}

.maniwa-biomass__points {
    margin-top: 0.5em;
    padding-left: 0;
    list-style: none;
}

.maniwa-biomass__points li {
    line-height: 2;
    letter-spacing: 0.06em;
}

.maniwa-biomass__points li::before {
    content: "・";
}

.maniwa-biomass__photo {
    width: 100%;
    aspect-ratio: 3 / 2;
    object-fit: cover;
    border-radius: 0.5em;
}

.maniwa-biomass__caption {
    margin-top: 0.25em;
    text-align: center;
}

/* ==============================
  Promo banner
============================== */
.maniwa-promo {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 1.5rem;
    padding: 2em;
    background: var(--color-white);
    border-radius: 0.625em;
}

.maniwa-promo--beige {
    background: var(--color-light-gray);
}

.maniwa-promo__main {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 1.5em;
    width: 100%;
}

.maniwa-promo__logo {
    width: auto;
    max-width: 8.3125em;
    height: auto;
    flex-shrink: 0;
}

.maniwa-promo__logo--nogyo {
    max-width: 6.5625em;
}

.maniwa-promo__content {
    width: 100%;
    min-width: 0;
}

.maniwa-promo__title {
    font-size: 1.364em;
    font-weight: 700;
    letter-spacing: 0.06em;
    line-height: 1.35;
    margin-bottom: 0.25em;
}

.maniwa-promo .view-more {
    align-self: flex-end;
}

/* ==============================
  People（#people）
============================== */
.maniwa-people__gallery {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5em;
}

.maniwa-people__gallery img {
    width: 100%;
    aspect-ratio: 579 / 386;
    object-fit: cover;
}

.maniwa-people__link-wrap {
    display: flex;
    justify-content: flex-end;
}

/* ==============================
  Responsive
============================== */
@media (min-width: 768px) {
    .maniwa-stats__grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .maniwa-stats__cell {
        border-bottom: none;
    }

    .maniwa-stats__cell:nth-child(odd) {
        border-right: 1px solid var(--color-dark-gray);
    }

    .maniwa-stats__cell:nth-child(-n+2) {
        border-bottom: 1px solid var(--color-dark-gray);
    }

    .maniwa-ranking__list {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .maniwa-ranking__item {
        border-bottom: none;
        border-right: 1px solid var(--color-dark-gray);
    }

    .maniwa-ranking__item:last-child {
        border-right: none;
    }

    .maniwa-data__list {
        grid-template-columns: repeat(5, minmax(0, 1fr));
        gap: 1.0625em;
    }

    .maniwa-biomass__card {
        padding: 3.125em 2.5em;
    }

    .maniwa-biomass__media.column__item {
        width: 100%;
        align-self: stretch;
    }

    .maniwa-biomass__link-wrap {
        margin-top: 2.5em;
    }

    .maniwa-promo {
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        flex-wrap: wrap;
        gap: 1.5rem 2.5rem;
        padding: 4em 5.125em;
    }

    .maniwa-promo__main {
        flex-direction: row;
        align-items: center;
        gap: 1.875em;
        flex: 1 1 17.5rem;
        min-width: 0;
        width: auto;
    }

    .maniwa-promo .view-more {
        align-self: center;
    }

    .maniwa-people__gallery {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 2.625em;
    }
}

@media (min-width: 1024px) {
    .maniwa-map--okayama {
        max-width: 29.5625em;
        margin-left: auto;
    }
}