/*
Theme Name: Insect Portfolio
Author: Hibiki Hoshito
Description: 写真を主役にした白背景のポートフォリオテーマ。トップ写真のスライドショー、固定ページ、画像やリンクを自由に置けるギャラリーページ、スマホの全画面メニューに対応。
Version: 1.1.3
Requires at least: 6.0
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: insect-portfolio
Tags: photography, portfolio, one-column, custom-menu, featured-images
*/
:root { --photo-width: 820px; --text: #161616; --muted: #555; }
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #fff; color: var(--text); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans JP", "Helvetica Neue", Arial, sans-serif; font-size: 16px; font-weight: 400; line-height: 1.8; overflow-wrap: break-word; }
a { color: inherit; text-underline-offset: .2em; }
img { max-width: 100%; height: auto; vertical-align: middle; }
button, input, textarea, select { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a:focus-visible, button:focus-visible, input:focus-visible, textarea:focus-visible { outline: 2px solid #202020; outline-offset: 5px; }
.site-header { padding: 29px 24px 0; text-align: center; }
.site-title { margin: 0; font: 700 clamp(28px, 9.1vw, 64px)/1.15 Georgia, "Times New Roman", "Noto Serif JP", serif; letter-spacing: -.035em; }
.site-title a { text-decoration: none; }
.site-navigation { margin: 35px auto 17px; }
.menu { display: flex; flex-wrap: wrap; gap: 10px 25px; justify-content: center; align-items: center; margin: 0; padding: 0; list-style: none; }
.menu a { display: inline-block; color: var(--muted); font-size: 14px; text-decoration: none; line-height: 1.5; padding: 3px 0; }
.menu a:hover, .menu a:focus-visible, .menu .current-menu-item > a { color: #111; }
.menu-toggle { display: none; }
.home-main { width: min(100%, var(--photo-width)); margin: 0 auto; }
.home-photo { margin: 0; border: 10px solid #080808; background: #080808; }
.home-photo img { display: block; width: 100%; height: auto; }
.home-content { width: calc(100% - 48px); margin: 30px auto 0; }
.home-content:empty { display: none; }
.page-main, .gallery-main { width: min(calc(100% - 56px), var(--photo-width)); margin: 0 auto; }
.page-main { padding-top: 12px; }
.page-title { font-size: 26px; font-weight: 400; line-height: 1.5; margin: 0 0 30px; }
.page-title a { text-decoration: none; }
.entry-content > :first-child { margin-top: 0; }
.entry-content > :last-child { margin-bottom: 0; }
.entry-content p { margin: 0 0 1.5em; }
.entry-content h2, .entry-content h3 { line-height: 1.5; margin: 2em 0 1em; font-weight: 500; }
.entry-content figure { max-width: 100%; margin: 0 0 28px; }
.entry-content .wp-block-image img { display: block; height: auto; margin: 0 auto; }
.entry-content .wp-block-image { text-align: center; }
.entry-content .wp-block-image figcaption, .entry-content .wp-caption-text { margin-top: .5em; color: #666; font-size: 13px; text-align: center; }
.entry-content .aligncenter { margin-inline: auto; }
.entry-content .alignleft { float: left; margin-right: 20px; }
.entry-content .alignright { float: right; margin-left: 20px; }
.entry-content::after { display: table; clear: both; content: ""; }
.entry-content .wp-block-gallery { gap: 18px; }
.entry-content .wp-block-gallery .wp-block-image { margin-bottom: 0; }
.entry-content .wp-block-gallery.has-nested-images figure.wp-block-image img { max-width: 100%; }
.entry-content .gallery { display: flex; flex-wrap: wrap; gap: 18px; }
.entry-content .gallery-item { flex: 1 1 180px; margin: 0; text-align: center; }
.entry-content .gallery-item img { height: auto; }
.entry-content iframe, .entry-content video { max-width: 100%; }
.entry-content table { border-collapse: collapse; max-width: 100%; }
.entry-content td, .entry-content th { border: 1px solid #ddd; padding: 8px 12px; }
.entry-content input:not([type=checkbox]):not([type=radio]), .entry-content textarea, .entry-content select { max-width: 100%; padding: 8px; border: 1px solid #aaa; border-radius: 0; }
.entry-content input[type=submit], .entry-content button { cursor: pointer; }
.site-footer { padding: 27px 20px 50px; text-align: center; color: #333; font-size: 13px; font-weight: 400; }
.site-footer p { margin: 0; }
.setup-note { margin: 25px auto; padding: 20px; color: #555; font-size: 14px; border: 1px dashed #bbb; max-width: 650px; }
.post-summary { margin-bottom: 40px; }
.screen-reader-text { border: 0; clip: rect(1px,1px,1px,1px); clip-path: inset(50%); height: 1px; width: 1px; margin: -1px; overflow: hidden; padding: 0; position: absolute !important; white-space: nowrap; }
.skip-link:focus { clip: auto; clip-path: none; height: auto; width: auto; top: 12px; left: 12px; padding: 10px 16px; z-index: 100001; background: #fff; color: #111; }
@media (max-width: 700px) {
    .site-header { padding: 26px 12px 0; }
    .site-title { letter-spacing: -.035em; }
    .site-navigation { margin: 28px 0; }
    .has-menu-js .menu-toggle { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5px; width: 44px; height: 44px; padding: 10px; margin: 36px auto 19px; border: 0; background: #fff; color: #111; cursor: pointer; position: relative; z-index: 10001; }
    .menu-toggle span { display: block; height: 1.5px; width: 18px; background: currentColor; }
    .has-menu-js .site-navigation { display: none; }
    body.menu-open { overflow: hidden; }
    .has-menu-js.menu-open .site-navigation { display: block; position: fixed; inset: 0; z-index: 10000; background: #fff; margin: 0; padding: 62px 25px 35px; overflow-y: auto; overscroll-behavior: contain; }
    .menu-open .menu-toggle { position: fixed; top: 12px; right: 14px; margin: 0; }
    .menu-open .menu-toggle span:nth-child(1) { transform: translateY(6.5px) rotate(45deg); width: 23px; }
    .menu-open .menu-toggle span:nth-child(2) { opacity: 0; }
    .menu-open .menu-toggle span:nth-child(3) { transform: translateY(-6.5px) rotate(-45deg); width: 23px; }
    .menu-open .menu { flex-direction: column; gap: 22px; }
    .menu-open .menu a { color: #171717; font-size: 20px; font-weight: 300; padding: 4px 7px; border: 1px solid transparent; }
    .menu-open .menu .current-menu-item > a { border-color: #111; }
    .admin-bar.menu-open .site-navigation { top: 46px; }
    .admin-bar.menu-open .menu-toggle { top: 58px; }
    .home-photo { border-width: 6px; }
    .page-main { padding-top: 0; }
    .site-footer { padding-top: 34px; font-size: 14px; }
}

/* The first image sets the frame; other ratios are contained without cropping. */
.home-slideshow { position: relative; }
.slideshow-stage { position: relative; width: 100%; overflow: hidden; background: #080808; }
.slideshow-slide { position: absolute; inset: 0; margin: 0; opacity: 0; transition: opacity 2s ease-in-out; }
.slideshow-slide.is-active { opacity: 1; }
.home-photo .slideshow-slide img { display: block; width: 100%; height: 100%; object-fit: contain; }
@media (prefers-reduced-motion: reduce) { .slideshow-slide { transition: none; } }

.home-main > .page-title { margin: 12px 24px 24px; }
