/*
Theme Name: OrderKaki Child
Author: OrderKaki
Description: OrderKaki block child theme: shared brand styles and navigation foundation.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 7.4
Version: 0.3.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Template: twentytwentyfive
Text Domain: orderkaki-child
*/
:root { --ok-border: #D5E8E4; }
html { scroll-padding-top: 2rem; }
body { overflow-wrap: anywhere; }
:where(a,button,input,textarea,select,summary):focus-visible { outline: 3px solid #0B7D72; outline-offset: 4px; }
.ok-header { padding-block: 1rem; border-bottom: 1px solid var(--ok-border); }
.ok-footer { margin-block-start: 4rem; padding-block: 2.5rem; border-top: 1px solid var(--ok-border); }
.ok-header-inner { gap: 1rem; }
.ok-header .wp-block-site-logo { flex-shrink: 0; }
.ok-header .wp-block-navigation a { padding-block: .65rem; }
.wp-block-button.is-style-outline .wp-block-button__link { background: transparent; color: #0B7D72; border: 2px solid #0B7D72; }
.wp-block-button__link:hover { background: #08685F; color: #FFF; }
.wp-block-button.is-style-outline .wp-block-button__link:hover { background: #E8F8F4; color: #0B7D72; }
.wp-block-button__link { min-height: 44px; box-sizing: border-box; display: inline-flex; align-items: center; justify-content: center; }
.ok-card { background: #FFF; padding: 1.5rem; border: 1px solid var(--ok-border); border-radius: 16px; }
.ok-surface-mint { background: #E8F8F4; }
.ok-surface-cream { background: #FFF8F1; }
.ok-section { padding-block: clamp(3rem, 6vw, 5rem); }
main { min-height: 45vh; }
input,select,textarea { font: inherit; max-width: 100%; box-sizing: border-box; }
summary { cursor: pointer; font-weight: 700; }
@media (max-width: 600px) {
 .ok-header-inner { flex-wrap: nowrap !important; }
 .ok-header .wp-block-site-logo img { max-width: 125px; height: auto; }
 .ok-header .ok-header-cta .wp-block-button__link { padding: .65rem .85rem; font-size: .875rem; }
 .ok-footer-inner { align-items: flex-start !important; }
}

/* Homepage: editable core blocks. No third-party layout dependencies. */
.ok-home { margin-block-start: 0; }
.ok-home-section { padding: clamp(3rem, 6vw, 5rem) max(1rem, calc((100vw - 1200px)/2)); margin-block-start: 0; }
.ok-section-inner { max-width: 1200px; margin-inline: auto; }
.ok-section-inner > h2 { max-width: 850px; margin-block: 0 1.25rem; }
.ok-section-inner > p { max-width: 760px; }
.ok-hero-grid { display: grid; grid-template-columns: 1.05fr 1fr; gap: clamp(2rem, 5vw, 5rem); align-items: center; }
.ok-hero-copy h1 { margin-block: 1rem 1.5rem; max-width: 650px; }
.ok-kicker { font-size: .8rem; font-weight: 750; letter-spacing: .1em; color: #0B7D72; }
.ok-lead { font-size: 1.125rem; max-width: 580px; }
.ok-caption { font-size: .875rem; line-height: 1.6; }
.ok-hero-visual { padding: clamp(1.25rem, 3vw, 2.5rem); background: #E8F8F4; border-radius: 32px 8px 32px 8px; }
.ok-message { padding: 1.25rem; background: #FFF; border-radius: 16px 16px 16px 0; border: 1px solid #D5E8E4; }
.ok-message p:first-child { font-size: .875rem; color: #0B7D72; font-weight: 700; }
.ok-flow-label { color: #0B7D72; font-weight: 700; text-align: center; }
.ok-order-sheet { background: #FFF; border: 1px solid #D5E8E4; padding: 1.5rem; border-radius: 12px; }
.ok-order-sheet h3 { font-size: 1.125rem; color: #0B7D72; }
.ok-grid { display: grid; gap: 1.25rem; margin-block: 2rem; }
.ok-grid > * { margin-block-start: 0; min-width: 0; }
.ok-grid-3, .ok-grid-features, .ok-workflow-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
.ok-grid-2 { grid-template-columns: repeat(2,minmax(0,1fr)); }
.ok-card h3,.ok-workflow-card h3 { font-size: 1.25rem; line-height: 1.3; margin-block: .75rem; }
.ok-card p,.ok-workflow-card p { margin-block: .75rem; }
.ok-workflow-card { padding: clamp(1.25rem, 2vw, 2rem); background: #FFF; border: 1px solid #D5E8E4; border-radius: 16px; }
.ok-step-number { color: #0B7D72; font-size: .875rem; font-weight: 800; letter-spacing: .08em; }
.ok-step-example { background: #FFF8F1; border-radius: 10px; padding: 1rem; margin-block-start: 1.5rem; }
.ok-example-line { font-size: .875rem; line-height: 1.6; }
.ok-offering { display: flex; flex-direction: column; align-items: flex-start; }
.ok-offering .wp-block-buttons { margin-block-start: auto; padding-block-start: 1rem; }
.ok-faq { max-width: 850px; }
.ok-faq details > summary { padding-block: .35rem; }
.ok-faq details p { max-width: 760px; }
.ok-final-cta { background: #FFF8F1; }
.ok-home + footer .ok-footer { margin-block-start: 0; }
@media (max-width: 900px) {
 .ok-hero-grid { grid-template-columns: 1fr; }
 .ok-grid-3,.ok-grid-features { grid-template-columns: repeat(2,minmax(0,1fr)); }
 .ok-workflow-grid { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
 .ok-grid-2,.ok-grid-3,.ok-grid-features { grid-template-columns: 1fr; }
 .ok-home .wp-block-buttons { gap: .75rem; }
 .ok-home .wp-block-button { flex: 1 1 100%; }
 .ok-home .wp-block-button__link { width: 100%; }
}
