/* Reusable MOTOSHIRU home-page components. Enqueued only for the front page. */
body.home {
	--mh-ink: #1d2b30;
	--mh-text: #3f4e52;
	--mh-muted: #66767b;
	--mh-line: #dce4e3;
	--mh-paper: #fff;
	--mh-ground: #f3f6f5;
	--mh-accent: #176b73;
	--mh-accent-dark: #104e55;
	--mh-accent-soft: #e8f2f1;
	--mh-dark: #172124;
	background: var(--mh-ground);
	color: var(--mh-ink);
}

body.home main#wp--skip-link--target.moto-home {
	width: 100% !important;
	max-width: none !important;
	margin: 0 !important;
	padding: 0 !important;
	background: var(--mh-ground);
}

body.home .moto-home *, body.home .moto-home *::before, body.home .moto-home *::after { box-sizing: border-box; }
body.home .moto-home a { color: inherit; text-decoration: none; }
body.home .moto-home img { display: block; max-width: 100%; }
body.home .moto-home-wrap { width: min(1200px, calc(100% - 3rem)); margin: 0 auto; }
body.home .moto-home-eyebrow, body.home .moto-home-kicker { margin: 0 0 .55rem; color: var(--mh-accent); font-size: .7rem; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
body.home .moto-home-eyebrow { display: flex; align-items: center; gap: .65rem; }
body.home .moto-home-eyebrow::before { width: 2rem; height: 2px; background: var(--mh-accent); content: ''; }
body.home .moto-home h1, body.home .moto-home h2, body.home .moto-home h3, body.home .moto-home p { margin-top: 0; }

body.home .moto-home-hero {
	border-bottom: 1px solid var(--mh-line);
	background: linear-gradient(90deg, rgba(23,107,115,.035) 1px, transparent 1px), linear-gradient(rgba(23,107,115,.035) 1px, transparent 1px), var(--mh-paper);
	background-size: 28px 28px;
}
body.home .moto-home-hero .moto-home-wrap { display: grid; grid-template-columns: minmax(0, 1.02fr) minmax(330px, .98fr); gap: clamp(2rem, 5vw, 4rem); align-items: center; padding: clamp(3.5rem, 7vw, 5.5rem) 0 4rem; }
body.home .moto-home-hero h1 { margin-bottom: 1.1rem; font-size: clamp(2.65rem, 5.4vw, 4.55rem); line-height: 1.12; letter-spacing: -.045em; color: var(--mh-ink); }
body.home .moto-home-hero-copy { max-width: 40rem; margin-bottom: 1.5rem; color: var(--mh-text); font-size: 1.03rem; line-height: 1.9; }
body.home .moto-home-actions { display: flex; flex-wrap: wrap; gap: .6rem; }
body.home .moto-home-button { display: inline-flex; min-height: 2.8rem; align-items: center; justify-content: center; padding: .55rem 1rem; border: 1px solid var(--mh-line); border-radius: .55rem; background: var(--mh-paper); color: var(--mh-ink); font-size: .78rem; font-weight: 750; transition: border-color .16s ease, background .16s ease, color .16s ease; }
body.home .moto-home-button:hover, body.home .moto-home-button:focus-visible { border-color: var(--mh-accent); color: var(--mh-accent-dark); background: var(--mh-accent-soft); }
body.home .moto-home-button--primary { border-color: var(--mh-accent); background: var(--mh-accent); color: #fff; }
body.home .moto-home-button--primary:hover, body.home .moto-home-button--primary:focus-visible { background: var(--mh-accent-dark); color: #fff; }

/* Light neutral surfaces with the existing teal accent. */
body.home .moto-home-map { position: relative; min-height: 27rem; overflow: hidden; padding: 1.75rem; border: 1px solid var(--mh-line); border-radius: 1.2rem; background: #f4f7f7; color: var(--mh-ink); box-shadow: 0 .6rem 1.8rem rgba(29,43,48,.06); }
body.home .moto-home-map-top { display: flex; justify-content: space-between; color: var(--mh-muted); font-size: .62rem; font-weight: 800; letter-spacing: .14em; }
body.home .moto-home-map-label { margin: 2.3rem 0 .35rem; color: var(--mh-accent); font-size: .7rem; font-weight: 800; letter-spacing: .12em; }
body.home .moto-home-map h2 { margin-bottom: .45rem; color: var(--mh-ink); font-size: clamp(2rem, 3.4vw, 2.7rem); line-height: 1.08; letter-spacing: -.035em; }
body.home .moto-home-map > p { margin-bottom: 1.45rem; color: var(--mh-text); font-size: .78rem; line-height: 1.7; }
body.home .moto-home-map-grid { position: relative; z-index: 1; display: grid; grid-template-columns: 1fr 1fr; gap: .7rem; }
body.home .moto-home-map-cell { min-height: 6.2rem; padding: .8rem; border: 1px solid var(--mh-line); border-radius: .7rem; background: var(--mh-paper); transition: background .16s ease, border-color .16s ease; }
body.home .moto-home-map-cell:hover, body.home .moto-home-map-cell:focus-visible { border-color: #9bbdbc; background: #f8fbfa; }
body.home .moto-home-map-cell:focus-visible, body.home .moto-home-guide-step:focus-visible { outline: 2px solid var(--mh-accent); outline-offset: 3px; }
body.home .moto-home-map-cell small { color: var(--mh-accent); font-size: .57rem; font-weight: 800; letter-spacing: .1em; }
body.home .moto-home-map-cell strong { display: block; margin: .26rem 0; color: var(--mh-ink); font-size: .92rem; }
body.home .moto-home-map-cell span { color: var(--mh-text); font-size: .65rem; line-height: 1.5; }

body.home .moto-home-finder { position: relative; z-index: 1; margin-top: -1.7rem; }
body.home .moto-home-finder .moto-home-wrap { display: grid; grid-template-columns: 1fr 1fr; overflow: hidden; border: 1px solid var(--mh-line); border-radius: 1rem; background: var(--mh-paper); box-shadow: 0 .9rem 2.15rem rgba(18,48,50,.07); }
body.home .moto-home-finder-col { padding: 1.4rem 1.55rem; }
body.home .moto-home-finder-col + .moto-home-finder-col { border-left: 1px solid var(--mh-line); }
body.home .moto-home-finder h2 { margin-bottom: .8rem; font-size: 1.25rem; line-height: 1.35; }
body.home .moto-home-chips { display: flex; flex-wrap: wrap; gap: .45rem; }
body.home .moto-home-chip { padding: .43rem .65rem; border: 1px solid var(--mh-line); border-radius: 99rem; background: #fbfcfc; color: #4d595b; font-size: .72rem; transition: border-color .16s ease, background .16s ease, color .16s ease; }
body.home .moto-home-chip:hover, body.home .moto-home-chip:focus-visible { border-color: #9bbdbc; background: var(--mh-accent-soft); color: var(--mh-accent-dark); }

body.home .moto-home-section { padding: 4.75rem 0; }
body.home .moto-home-section--compact { padding-top: 0; }
body.home .moto-home-section-head { display: flex; align-items: end; justify-content: space-between; gap: 2rem; margin-bottom: 1.7rem; }
body.home .moto-home-section-head h2 { margin-bottom: 0; color: var(--mh-ink); font-size: clamp(1.8rem, 3vw, 2.25rem); line-height: 1.3; letter-spacing: -.025em; }
body.home .moto-home-section-head > p { max-width: 33rem; margin-bottom: 0; color: var(--mh-muted); font-size: .78rem; line-height: 1.75; }
body.home .moto-home-card-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: .85rem; }
body.home .moto-home-card { display: flex; min-height: 10.7rem; flex-direction: column; padding: 1.2rem; border: 1px solid var(--mh-line); border-radius: .8rem; background: var(--mh-paper); transition: border-color .16s ease, background .16s ease, transform .16s ease; }
body.home .moto-home-card:hover, body.home .moto-home-card:focus-visible { border-color: #afc7c6; background: #fcfefe; transform: translateY(-2px); }
body.home .moto-home-card-index { display: grid; width: 1.85rem; height: 1.85rem; margin-bottom: .65rem; place-items: center; border-radius: .45rem; background: var(--mh-accent-soft); color: var(--mh-accent); font-size: .68rem; font-weight: 800; }
body.home .moto-home-card h3 { margin-bottom: .45rem; color: var(--mh-ink); font-size: .95rem; line-height: 1.45; }
body.home .moto-home-card p { margin-bottom: .75rem; color: var(--mh-muted); font-size: .68rem; line-height: 1.65; }
body.home .moto-home-card span { margin-top: auto; color: var(--mh-accent); font-size: .65rem; font-weight: 800; }
body.home .moto-home-area-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: .85rem; }
body.home .moto-home-area { padding: 1.25rem; border: 1px solid var(--mh-line); border-top: 3px solid var(--mh-accent); border-radius: .7rem; background: var(--mh-paper); }
body.home .moto-home-area small { color: var(--mh-accent); font-size: .62rem; font-weight: 800; letter-spacing: .12em; }
body.home .moto-home-area h3 { margin: .25rem 0 .35rem; font-size: 1.1rem; }
body.home .moto-home-area p { margin-bottom: .7rem; color: var(--mh-muted); font-size: .72rem; line-height: 1.65; }
body.home .moto-home-text-link { color: var(--mh-accent); font-size: .7rem; font-weight: 800; }

body.home .moto-home-guide { padding: 5rem 0; border-top: 1px solid var(--mh-line); border-bottom: 1px solid var(--mh-line); background: #f4f7f7; color: var(--mh-ink); }
body.home .moto-home-guide .moto-home-kicker { color: var(--mh-accent); }
body.home .moto-home-guide .moto-home-section-head h2 { color: var(--mh-ink); }
body.home .moto-home-guide .moto-home-section-head > p { color: var(--mh-text); }
body.home .moto-home-guide-grid { display: grid; grid-template-columns: .85fr 1.15fr; gap: 3rem; align-items: start; }
body.home .moto-home-guide-intro { padding-top: .35rem; color: var(--mh-text); font-size: .85rem; line-height: 1.85; }
body.home .moto-home-guide-badge { display: inline-block; margin-top: 1rem; padding: .35rem .6rem; border: 1px solid var(--mh-line); border-radius: 99rem; background: #fff; color: var(--mh-accent); font-size: .6rem; font-weight: 800; letter-spacing: .12em; }
body.home .moto-home-guide-steps { display: grid; gap: .55rem; }
body.home .moto-home-guide-step { display: grid; grid-template-columns: 2.5rem 1fr auto; gap: .85rem; align-items: center; padding: 1rem 1.1rem; border: 1px solid var(--mh-line); border-radius: .75rem; background: #fff; transition: background .16s ease, border-color .16s ease; }
body.home .moto-home-guide-step:hover, body.home .moto-home-guide-step:focus-visible { border-color: #9bbdbc; background: #f8fbfa; }
body.home .moto-home-step-no { display: grid; min-height: 2.5rem; place-items: center; border-radius: .5rem; background: var(--mh-accent-soft); color: var(--mh-accent); font-size: .7rem; font-weight: 800; }
body.home .moto-home-guide-step h3 { margin: 0 0 .18rem; color: var(--mh-ink); font-size: .95rem; }
body.home .moto-home-guide-step p { margin: 0; color: var(--mh-text); font-size: .67rem; line-height: 1.55; }
body.home .moto-home-guide-step span:last-child { color: var(--mh-accent); font-size: 1.15rem; }

body.home .moto-home-records { display: grid; grid-template-columns: 1.15fr .85fr; gap: 1rem; }
body.home .moto-home-record-main, body.home .moto-home-record-mini { overflow: hidden; border: 1px solid var(--mh-line); border-radius: .85rem; background: var(--mh-paper); }
body.home .moto-home-record-main { display: grid; grid-template-columns: 1fr 1fr; min-height: 20rem; }
body.home .moto-home-record-main img { width: 100%; height: 100%; object-fit: cover; background: var(--mh-dark); }
body.home .moto-home-record-copy, body.home .moto-home-record-mini { padding: 1.45rem; }
body.home .moto-home-record-tag { margin-bottom: .4rem; color: var(--mh-accent); font-size: .62rem; font-weight: 800; letter-spacing: .13em; }
body.home .moto-home-record-copy h3 { margin-bottom: .6rem; font-size: 1.38rem; line-height: 1.42; }
body.home .moto-home-record-copy p, body.home .moto-home-record-mini p { color: var(--mh-muted); font-size: .72rem; line-height: 1.7; }
body.home .moto-home-record-side { display: grid; gap: 1rem; }
body.home .moto-home-record-mini h3 { margin: .35rem 0 .5rem; font-size: .98rem; line-height: 1.45; }

body.home .moto-home-tools { display: grid; grid-template-columns: 1fr 1fr; gap: .85rem; }
body.home .moto-home-tool { padding: 1.1rem 1.2rem; border: 1px dashed #bdc9c8; border-radius: .7rem; background: rgba(255,255,255,.55); }
body.home .moto-home-tool small { color: #8c7953; font-size: .6rem; font-weight: 800; letter-spacing: .1em; }
body.home .moto-home-tool h3 { margin: .35rem 0; font-size: .92rem; }
body.home .moto-home-tool p { margin: 0; color: var(--mh-muted); font-size: .68rem; line-height: 1.6; }

body.home .moto-home-articles { display: grid; grid-template-columns: 1.06fr .94fr; gap: 2rem; }
body.home .moto-home-feature { overflow: hidden; border: 1px solid var(--mh-line); border-radius: .85rem; background: var(--mh-paper); }
body.home .moto-home-feature img { width: 100%; aspect-ratio: 16 / 8; object-fit: cover; background: var(--mh-dark); }
body.home .moto-home-feature-copy { padding: 1.35rem; }
body.home .moto-home-feature-copy h3 { margin: .4rem 0 .6rem; font-size: 1.25rem; line-height: 1.45; }
body.home .moto-home-feature-copy p { margin-bottom: 0; color: var(--mh-muted); font-size: .72rem; line-height: 1.7; }
body.home .moto-home-new-list { display: grid; }
body.home .moto-home-new-row { display: grid; grid-template-columns: 5rem 1fr; gap: 1rem; padding: .9rem 0; border-bottom: 1px solid var(--mh-line); }
body.home .moto-home-new-row:first-child { padding-top: 0; }
body.home .moto-home-new-row:last-child { border-bottom: 0; }
body.home .moto-home-new-row time { padding-top: .18rem; color: var(--mh-muted); font-size: .62rem; }
body.home .moto-home-new-row h3 { margin: 0; font-size: .8rem; line-height: 1.55; }

body.home .moto-home-glossary { padding: 0 0 4.75rem; }
body.home .moto-home-glossary-box { display: grid; grid-template-columns: 1fr minmax(17rem, .7fr); gap: 2rem; align-items: center; padding: 2rem 2.2rem; border-radius: 1rem; background: var(--mh-accent); color: #fff; }
body.home .moto-home-glossary .moto-home-kicker { color: #c5e1e2; }
body.home .moto-home-glossary h2 { margin-bottom: .45rem; color: #fff; font-size: 1.85rem; }
body.home .moto-home-glossary p { margin-bottom: 0; color: #dceff0; font-size: .78rem; line-height: 1.7; }
body.home .moto-home-glossary-action { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: .75rem; border-radius: .6rem; background: #fff; color: var(--mh-ink); font-size: .75rem; font-weight: 750; }
body.home .moto-home-glossary-action span { display: grid; width: 2.2rem; height: 2.2rem; place-items: center; border-radius: .45rem; background: var(--mh-dark); color: #fff; }

body.home .moto-home-about { padding: 0 0 5rem; }
body.home .moto-home-about-grid { display: grid; grid-template-columns: .9fr 1.1fr; gap: 3rem; align-items: center; }
body.home .moto-home-about h2 { margin-bottom: .6rem; font-size: 1.9rem; line-height: 1.35; }
body.home .moto-home-about > .moto-home-wrap > p, body.home .moto-home-about-copy { color: var(--mh-muted); font-size: .8rem; line-height: 1.8; }
body.home .moto-home-brand-visual { width: min(100%, 34rem); margin: 1.5rem 0 0; padding: .45rem; border: 1px solid var(--mh-line); border-radius: .85rem; background: var(--mh-paper); }
body.home .moto-home-brand-visual img { width: 100%; height: auto; }
body.home .moto-home-principles { display: grid; grid-template-columns: repeat(3, 1fr); gap: .55rem; padding: 1.35rem; border: 1px solid var(--mh-line); border-radius: .85rem; background: var(--mh-paper); }
body.home .moto-home-principle { padding: .7rem; border-radius: .5rem; background: #f5f8f7; }
body.home .moto-home-principle strong { display: block; margin-bottom: .25rem; color: var(--mh-accent); font-size: .68rem; }
body.home .moto-home-principle span { color: var(--mh-muted); font-size: .62rem; line-height: 1.5; }

@media (max-width: 900px) {
	body.home .moto-home-hero .moto-home-wrap, body.home .moto-home-guide-grid, body.home .moto-home-records, body.home .moto-home-articles, body.home .moto-home-about-grid { grid-template-columns: 1fr; }
	body.home .moto-home-card-grid { grid-template-columns: repeat(2, 1fr); }
	body.home .moto-home-map { min-height: auto; }
}
@media (max-width: 620px) {
	body.home .moto-home-wrap { width: min(100% - 2rem, 1200px); }
	body.home .moto-home-hero .moto-home-wrap { padding: 2.85rem 0 3.25rem; gap: 2rem; }
	body.home .moto-home-hero h1 { font-size: 2.45rem; }
	body.home .moto-home-finder .moto-home-wrap, body.home .moto-home-card-grid, body.home .moto-home-area-grid, body.home .moto-home-tools, body.home .moto-home-glossary-box { grid-template-columns: 1fr; }
	body.home .moto-home-finder-col + .moto-home-finder-col { border-top: 1px solid var(--mh-line); border-left: 0; }
	body.home .moto-home-section { padding: 3.75rem 0; }
	body.home .moto-home-section-head { display: block; }
	body.home .moto-home-section-head > p { margin-top: .7rem; }
	body.home .moto-home-guide { padding: 3.75rem 0; }
	body.home .moto-home-guide-step { grid-template-columns: 2rem 1fr; }
	body.home .moto-home-guide-step span:last-child { display: none; }
	body.home .moto-home-record-main { grid-template-columns: 1fr; }
	body.home .moto-home-record-main img { min-height: 14rem; }
	body.home .moto-home-map-grid, body.home .moto-home-principles { grid-template-columns: 1fr; }
	body.home .moto-home-glossary-box { padding: 1.5rem; }
}
