/*
Theme Name:   SunSuke Child
Theme URI:    https://sunsukelandscape.com/
Description:  SunSuke Landscape — Brand Compliance Child Theme
Author:       SunSuke Landscape Architects
Template:     twentytwentyfour
Version:      1.0.0
*/

/*
 * ─────────────────────────────────────────────
 * SunSuke Brand Override CSS
 * Purpose: Brand guideline enforcement (minimum)
 * Rule: Do not add decoration. Remove if possible.
 * ─────────────────────────────────────────────
 */

/* ─── 0. Google Fonts ────────────────────────── */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700&family=Noto+Sans+JP:wght@400;600;700&display=swap');

/* ─── 1. Brand tokens ────────────────────────── */
:root {
  --ss-bg:           #FAFAFA;
  --ss-text:         #111111;
  --ss-secondary:    #555555;
  --ss-border:       #E5E5E5;
  --ss-accent:       #4A5F73;
  --ss-accent-hover: #3F5263;
  --ss-font:         'Inter', 'Noto Sans JP', sans-serif;
  --ss-lh-body:      1.8;
  --ss-lh-title:     1.3;
}

/* ─── 2. Base ────────────────────────────────── */
html,
body,
.wp-site-blocks {
  background-color: var(--ss-bg) !important;
}

body {
  font-family: var(--ss-font);
  font-size: 14px;
  font-weight: 400;
  line-height: var(--ss-lh-body);
  color: var(--ss-text);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* ─── 3. Headings ────────────────────────────── */
h1 { font-size: 48px; font-weight: 700; line-height: var(--ss-lh-title); }
h2 { font-size: 24px; font-weight: 600; line-height: var(--ss-lh-title); }
h3 { font-size: 18px; font-weight: 600; line-height: var(--ss-lh-title); }
h4,
h5 { font-size: 14px; font-weight: 600; line-height: var(--ss-lh-title); }
h6 { font-size: 12px; font-weight: 600; line-height: var(--ss-lh-title); }

h1, h2, h3, h4, h5, h6 {
  font-family: var(--ss-font);
  color: var(--ss-text);
}

/* ─── 4. Caption / small ─────────────────────── */
figcaption,
.wp-element-caption,
.wp-caption-text,
small {
  font-size: 12px;
  color: var(--ss-secondary);
  line-height: var(--ss-lh-body);
}

/* ─── 5. Links ───────────────────────────────── */
a {
  color: var(--ss-accent);
  text-decoration: none;
  transition: color 0.15s ease;
}
a:hover { color: var(--ss-accent-hover); }

.wp-block-navigation a,
.wp-block-navigation a:visited {
  color: var(--ss-text);
}
.wp-block-navigation a:hover { color: var(--ss-accent); }

/* ─── 6. Buttons ─────────────────────────────── */
.wp-block-button__link,
.wp-element-button,
input[type="submit"],
button[type="submit"],
button.wp-block-search__button {
  background-color: var(--ss-accent) !important;
  color: var(--ss-bg) !important;
  border: none !important;
  border-radius: 0 !important;
  font-family: 'Inter', sans-serif;
  font-weight: 600;
  font-size: 14px;
  line-height: 1;
  padding: 14px 24px;
  transition: background-color 0.15s ease;
  box-shadow: none !important;
}
.wp-block-button__link:hover,
.wp-element-button:hover,
input[type="submit"]:hover,
button[type="submit"]:hover {
  background-color: var(--ss-accent-hover) !important;
  color: var(--ss-bg) !important;
}

/* Outline variant */
.wp-block-button.is-style-outline .wp-block-button__link {
  background-color: transparent !important;
  color: var(--ss-accent) !important;
  border: 1px solid var(--ss-accent) !important;
}
.wp-block-button.is-style-outline .wp-block-button__link:hover {
  background-color: var(--ss-accent) !important;
  color: var(--ss-bg) !important;
}

/* ─── 7. Borders & separators ────────────────── */
hr,
.wp-block-separator {
  border: none;
  border-top: 1px solid var(--ss-border);
  color: var(--ss-border);
  background-color: var(--ss-border);
  height: 1px;
}

/* ─── 8. Forms ───────────────────────────────── */
input:not([type="submit"]):not([type="button"]):not([type="checkbox"]):not([type="radio"]),
textarea,
select {
  border: 1px solid var(--ss-border) !important;
  border-radius: 0 !important;
  font-family: var(--ss-font);
  font-size: 14px;
  color: var(--ss-text);
  background-color: #ffffff;
  padding: 10px 14px;
  transition: border-color 0.15s ease;
}
input:focus,
textarea:focus,
select:focus {
  outline: none !important;
  border-color: var(--ss-accent) !important;
  box-shadow: none !important;
}

/* ─── 9. Secondary / meta text ───────────────── */
.wp-block-post-date,
.wp-block-post-excerpt p,
.entry-meta,
.post-meta,
.taxonomy-description {
  color: var(--ss-secondary);
  font-size: 12px;
}

/* ─── 10. Remove gradients (brand: no gradients) ─── */
/* Note: Avoid global background-image removal; it can break hero/cover images. */
.has-background-gradient,
[class*="has-"][class*="-gradient-background"] {
  background-image: none !important;
}

/* ─── 11. Tables ─────────────────────────────── */
.wp-block-table table {
  font-size: 14px;
  border-collapse: collapse;
}
.wp-block-table td,
.wp-block-table th {
  border: 1px solid var(--ss-border);
  padding: 10px 14px;
}
.wp-block-table thead th {
  font-weight: 600;
  color: var(--ss-text);
  background-color: #F0F0F0;
}

/* ─── 12. Blockquote ─────────────────────────── */
.wp-block-quote {
  border-left: 2px solid var(--ss-accent) !important;
  padding-left: 24px;
  font-style: normal;
  color: var(--ss-text);
}
.wp-block-quote cite,
.wp-block-quote footer {
  font-size: 12px;
  color: var(--ss-secondary);
}

/* ─── END ────────────────────────────────────── */