/*
Theme Name:        Abira Academy
Theme URI:         https://369theme.com/abira-academy
Description:       A premium WordPress block theme for independent cram schools and tutoring businesses, built on the Abira foundation. Designed around exam results and trust-building for parents comparing options, with accessibility carried over from Abira.
Version:           1.1
Author:            miroku
Author URI:        https://369theme.com
Tags:              education, block-patterns, full-site-editing, block-styles, editor-style, style-variations, custom-colors, featured-images, translation-ready
Text Domain:       abira-academy
Domain Path:       /languages
Requires at least: 6.5
Tested up to:      7.0
Requires PHP:      7.4
License: GNU General Public License v3 or later
License URI: https://www.gnu.org/licenses/gpl-3.0.html

This is a commercial theme distributed independently (not via WordPress.org).
Like WordPress itself, the theme code is licensed under the GPL.
*/


/* ============================================================
   CSS Reset
   Modern, minimal reset as a foundation.
============================================================ */

*,
*::before,
*::after {
	box-sizing: border-box;
}

* {
	margin: 0;
	padding: 0;
}

html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	min-height: 100svh;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	overflow-x: hidden;
}

img,
picture,
video,
canvas,
svg {
	display: block;
	max-width: 100%;
}

input,
button,
textarea,
select {
	font: inherit;
}

p,
h1,
h2,
h3,
h4,
h5,
h6 {
	overflow-wrap: break-word;
}

p {
	text-wrap: pretty;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	text-wrap: balance;
}

button {
	cursor: pointer;
	-webkit-user-select: none;
	user-select: none;
	touch-action: manipulation;
}


/* ============================================================
   Accessibility: screen-reader-text
   Visually hides text while keeping it available to assistive tech;
   becomes visible again on keyboard focus.
============================================================ */

.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: var(--wp--preset--color--surface-container-lowest, #ffffff);
	border-radius: var(--wp--custom--radius--sm, 0.25rem);
	box-shadow: 0 0 2px 2px color-mix(in srgb, var(--wp--preset--color--on-surface, #1b1c1c) 60%, transparent);
	clip: auto !important;
	clip-path: none;
	color: var(--wp--preset--color--on-surface, #1b1c1c);
	display: block;
	font-size: var(--wp--preset--font-size--label-sm, 14px);
	height: auto;
	left: 5px;
	line-height: normal;
	padding: 15px 23px 14px;
	text-decoration: none;
	top: 5px;
	width: auto;
	z-index: 100000;
}


/* ============================================================
   Layout: Sticky Footer
============================================================ */

/*
 * コンテンツ幅は theme.json の settings.layout で変更してください。
 *
 * 現在の設定: contentSize / wideSize ともに 1120px
 * (academy_moc/DESIGN.md の container-max: 1120px に合わせている)。
 *
 * 大画面で幅をさらに広げたい場合は、style.css にメディアクエリを追加して
 * --wp--style--global--content-size を上書きする方法もあります。
 */

.wp-site-blocks {
	display: flex;
	flex-direction: column;
	min-height: 100svh;
}

.site-main {
	flex: 1;
	padding: 0;
}


/* ============================================================
   Post list
============================================================ */

/* Vertical rhythm matches .kmr-section in assets/css/block-styles.css —
   48px on mobile, 80px from the 768px breakpoint up — so a post or
   archive page breathes the same way the front-page sections do. */
.main-content {
	padding-block: var(--wp--preset--spacing--stack-lg);
}

@media (min-width: 768px) {
	.main-content {
		padding-block: var(--wp--preset--spacing--section);
	}
}

.post-item {
	border-bottom: 1px solid var(--wp--preset--color--surface-variant);
	padding-bottom: var(--wp--preset--spacing--stack-lg);
	margin-bottom: var(--wp--preset--spacing--stack-lg);
}

.post-meta {
	font-size: var(--wp--preset--font-size--label-sm);
	color: var(--wp--preset--color--on-surface-variant);
}


/* ============================================================
   Category badge
============================================================ */

.wp-block-post-terms a {
	display: inline-block;
	background-color: var(--wp--preset--color--primary);
	color: var(--wp--preset--color--surface-container-lowest);
	font-size: var(--wp--preset--font-size--label-sm);
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	padding: 0.2em 0.6em;
	border-radius: var(--wp--custom--radius--sm, 0.25rem);
	text-decoration: none;
}

.wp-block-post-terms a:hover {
	background-color: var(--wp--preset--color--on-surface);
	color: var(--wp--preset--color--surface-container-lowest);
}


/* ============================================================
   Card (archive)

   アイキャッチ画像のプレースホルダー処理は
   assets/css/block-styles.css の .post-card__media に統一。
============================================================ */

.post-card {
	border: 1px solid var(--wp--preset--color--surface-variant);
	border-radius: var(--wp--custom--radius--base, 0.5rem);
	overflow: hidden;
}

.post-card__body {
	padding: var(--wp--preset--spacing--stack-sm) var(--wp--preset--spacing--stack-md) var(--wp--preset--spacing--stack-md);
}


/* ============================================================
   Reduced motion
   「動きを減らす」設定のユーザーには、アニメーションと
   スムーズスクロールを無効化する。
============================================================ */

@media (prefers-reduced-motion: reduce) {

	html {
		scroll-behavior: auto;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}