/* バディーズ — quiet, welcoming editorial design, November 2026 */
:root {
  --ink: #34423b;
  --deep: #4b6054;
  --green: #718e7d;
  --sea: #dce5dd;
  --mint: #eff2eb;
  --cream: #f7f5ef;
  --paper: #fdfcf8;
  --orange: #aa9783;
  --sun: #e7dfcd;
  --coral: #e4ddd0;
  --line: #dcded6;
  --text: #5e6b63;
  --shadow: 0 10px 32px rgba(33,48,40,.055);
}
body { background: var(--paper); line-height: 1.95; letter-spacing: .015em; }
h1, h2, h3 {
  font-family: "Hiragino Mincho ProN", "Yu Mincho", "Noto Serif CJK JP", "Noto Serif JP", serif;
  font-weight: 500; letter-spacing: .075em;
}
h2 { font-size: clamp(1.8rem, 3.1vw, 2.85rem); line-height: 1.6; }
h3 { font-size: 1.32rem; }
.eyebrow { font-family: Georgia, "Times New Roman", serif; color: #87958a; font-size: .73rem; font-weight: 500; letter-spacing: .22em; }
.container { width: min(1160px, calc(100% - 64px)); }
.button { border-radius: 2px; box-shadow: none; font-size: .86rem; font-weight: 600; padding: 15px 29px; letter-spacing: .065em; }
.button:hover { background: #60766a; box-shadow: none; }
.button-light { background: #fdfcf8; color: #485d50; }
.button-light:hover { background: #eae9e1; }
.button-outline { border: 1px solid #87978b; color: #50665a; }
.button-outline:hover { color: #fff; }

/* Quiet typography in place of the temporary illustrated logo. */
.site-header { height: 88px; background: rgba(253,252,248,.965); border-bottom: 1px solid #eeeee8; backdrop-filter: blur(13px); }
.brand { min-width: 225px; gap: 0; }
.brand-mark { display: none; }
.brand-text strong { font-family: Georgia, "Times New Roman", serif; font-size: 1.52rem; font-weight: 500; letter-spacing: .18em; color: #42584b; }
.brand-text small { margin-top: 7px; color: #7c8a80; font-size: .59rem; font-weight: 500; letter-spacing: .095em; }
.nav { gap: clamp(14px, 2vw, 25px); }
.nav a:not(.button) { font-size: .79rem; font-weight: 500; letter-spacing: .04em; }
.nav .button { padding: 12px 19px; font-size: .76rem; }

/* The actual room photography is the visual centerpiece. */
.hero { background: #f5f3ec; min-height: 0; }
.hero::before, .hero::after { display: none; }
.hero-inner { grid-template-columns: .93fr 1.07fr; min-height: 700px; gap: clamp(30px, 5vw, 75px); padding-block: 73px 85px; }
.hero-copy { padding-left: 10px; }
.hero-kicker { font-size: .78rem; font-weight: 500; color: #788b7e; letter-spacing: .13em; margin-bottom: 34px; }
.hero-kicker::before { background: #a5aea3; height: 1px; width: 40px; }
.hero h1 { font-size: clamp(2.4rem, 4vw, 4rem); line-height: 1.64; letter-spacing: .085em; margin-bottom: 27px; }
.hero h1 em { color: #637e6d; font-weight: inherit; }
.hero h1 em::after { display: none; }
.hero-lead { max-width: 465px; font-size: .95rem; line-height: 2.35; color: #68736b; margin-bottom: 38px; }
.hero-actions { gap: 13px; }
.hero-image { aspect-ratio: 1.09; border-radius: 46% 46% 3px 3px; box-shadow: none; object-position: 49% center; }
.hero-sticker { top: auto; right: -18px; bottom: 24px; width: 120px; height: 103px; border-radius: 0; transform: none; background: #fdfcf8; box-shadow: 0 12px 30px rgba(24,40,30,.085); color: #607468; font-size: .68rem; font-weight: 500; }
.hero-sticker strong { font-family: Georgia, serif; font-size: 1.55rem; font-weight: 500; }
.intro-bar { background: #fdfcf8; border-bottom: 1px solid #ebede6; }
.intro-items { padding-block: 36px; gap: 14px; }
.intro-item { justify-content: flex-start; padding-inline: 26px; gap: 15px; }
.intro-item:first-child { padding-left: 0; }
.intro-item:last-child { padding-right: 0; }
.intro-icon, .intro-item:nth-child(2) .intro-icon, .intro-item:nth-child(3) .intro-icon {
  display: grid; place-items: center; width: 34px; height: 48px; flex: none;
  background: transparent; border-radius: 0; color: #9cab9e; font: normal 1.05rem Georgia,serif;
}
.intro-item strong { font-size: .92rem; font-weight: 600; }
.intro-item span { font-size: .74rem; color: #889288; }

section.block { padding: 118px 0; }
.section-heading { max-width: 785px; margin-bottom: 65px; }
.section-heading h2 { margin: 14px 0 19px; }
.section-heading p { font-size: .96rem; line-height: 2.15; }
.philosophy { background: #fdfcf8; }
.philosophy-grid { grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 7vw, 110px); }
.quote-art { min-height: 472px; border-radius: 2px; background: #e4e9e1; }
.quote-art::before, .quote-art::after { display: none; }
.quote-art .message span { font: normal .78rem Georgia,serif; letter-spacing: .21em; color: #788b7e; }
.quote-art .message strong { font-family: "Hiragino Mincho ProN", "Yu Mincho", serif; font-weight: 500; font-size: clamp(1.9rem, 3vw, 2.5rem); line-height: 1.85; }
.quote-art .message small { font-size: .77rem; font-weight: 400; color: #75867b; }
.philosophy-copy h2 { margin: 13px 0 30px; }
.philosophy-copy p { line-height: 2.35; }
.signature { font-size: .8rem; font-weight: 500; color: #7a8d7f; }
.signature::before { background: #9aab9b; height: 1px; }

/* Uncluttered room photography. */
.facility { background: #f5f4ef; }
.facility-photo, .facility-photo:nth-child(1), .facility-photo:nth-child(4) { border-radius: 2px; height: 335px; }
.facility-photo img { filter: saturate(.92); }
.facility-photo figcaption { font-weight: 500; font-size: .83rem; letter-spacing: .08em; }
.facility-note { font-size: .8rem; color: #879087; }

/* Clean typographic program columns replace the colorful cards. */
.pillars { background: #fdfcf8; }
.pillar-grid { gap: 0; border-top: 1px solid #dce0d7; border-bottom: 1px solid #dce0d7; }
.pillar { box-shadow: none; border-radius: 0; background: transparent; border-right: 1px solid #dce0d7; }
.pillar:last-child { border-right: 0; }
.pillar:hover { transform: none; }
.pillar-picture { display: none; }
.pillar-body { padding: 44px 32px 47px; }
.pillar-number { font: normal .82rem Georgia,serif; letter-spacing: .14em; color: #93a397; margin-bottom: 29px; }
.pillar-body h3 { font-size: 1.67rem; margin-bottom: 24px; }
.pillar-body h3 span { display: none; }
.pillar-body p { font-size: .9rem; line-height: 2.25; }

.support { background: #495c50; }
.support::before { display: none; }
.support .eyebrow { color: #c8d6cb; }
.support .section-heading p { color: #d8e2d9; }
.support-grid { gap: 17px; }
.support-item { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.2); border-radius: 2px; padding: 39px 32px; }
.support-symbol { background: transparent; color: #e8eee7; border: 1px solid rgba(255,255,255,.33); border-radius: 50%; width: 49px; height: 49px; font-size: 1.3rem; font-weight: 400; }
.support-item h3 { font-size: 1.18rem; font-weight: 500; }
.support-item p { color: #d8e2da; font-size: .88rem; line-height: 2.25; }
.day { background: #fdfcf8; }
.day-frame { background: #f3f3ec; border-radius: 2px; padding: 59px 57px; }
.timeline::before { border-top: 1px solid #b8c6b9; }
.moment-dot, .moment:nth-child(1) .moment-dot, .moment:last-child .moment-dot { background: #fdfcf8; border: 1px solid #cbd7cc; color: #617568; box-shadow: none; font: normal 1rem Georgia,serif; }
.moment b { font-size: .82rem; font-weight: 600; }
.sports { background: #eaece5; }
.sports-copy p { line-height: 2.3; }
.sports-chip { border-radius: 2px; background: #f7f7f2; color: #6d7b71; font-weight: 500; }
.sports-visual { background: #d9e2d8; border-radius: 2px; }
.sports-visual svg { filter: saturate(.66); }
.info { background: #fdfcf8; }
.info-table { background: #f3f3ed; border-radius: 2px; }
.info-row { border-bottom-color: #dadfd6; }
.steps { border-radius: 2px; }
.step-num { border-radius: 50%; background: #e8eadf; color: #536c5b; font: normal 1.1rem Georgia,serif; }
.faq { background: #f3f4ee; }
.faq-list details { border-bottom-color: #d8ded6; }
.faq-list details:first-child { border-top-color: #d8ded6; }
summary { font-size: .95rem; font-weight: 500; }
summary::before, summary::after { color: #788e7e; }
.contact { background: #495d51; padding: 92px 0; }
.contact .eyebrow { color: #d2dfd4; }
.contact .button { border-radius: 2px; }
.access { background: #fdfcf8; }
.access-card { background: #e7ece4; border-radius: 2px; min-height: 315px; }
.access-card::before, .access-card::after, .access-card svg { display: none; }
.access-card strong { color: #566f5d; font: normal 2rem Georgia,serif; letter-spacing: .2em; }
.access-card span { color: #78897d; margin-top: 12px; }
.footer { background: #e9ede6; }
.footer-top { border-bottom-color: #cfd8cf; }
.footer-links a { font-size: .78rem; font-weight: 500; }

@media (max-width: 1000px) {
  .site-header { height: 76px; }
  .brand { min-width: 194px; }
  .nav { gap: 12px; }
  .nav a:not(.button) { font-size: .71rem; }
  .nav .button { padding: 10px 12px; }
  .hero-inner { gap: 28px; min-height: 610px; }
  .hero h1 { font-size: clamp(2.2rem, 4.2vw, 3.3rem); }
  .intro-item { padding-inline: 15px; }
}
@media (max-width: 980px) {
  .menu-toggle { display: block; }
  .nav { display: none; position: absolute; top: 76px; left: 0; right: 0; flex-direction: column; align-items: stretch; gap: 0; background: #fdfcf8; border-top: 1px solid var(--line); box-shadow: var(--shadow); padding: 12px 28px 25px; }
  .nav.open { display: flex; }
  .nav a:not(.button) { font-size: .88rem; padding: 12px 7px; }
  .nav .button { margin-top: 8px; }
}
@media (max-width: 760px) {
  .container { width: min(100% - 40px, 560px); }
  .site-header { height: 70px; }
  .brand-text strong { font-size: 1.32rem; }
  .brand-text small { font-size: .54rem; }
  .nav { top: 70px; background: #fdfcf8; }
  .nav a:not(.button) { font-size: .88rem; padding: 12px 6px; }
  .hero-inner { min-height: 0; padding: 55px 0 58px; gap: 42px; }
  .hero-copy { padding-left: 0; }
  .hero-kicker { margin-bottom: 20px; }
  .hero h1 { font-size: clamp(2.13rem, 8.2vw, 3.15rem); line-height: 1.65; margin-bottom: 22px; }
  .hero-lead { font-size: .9rem; margin-bottom: 26px; }
  .hero-image { aspect-ratio: 1.22; border-radius: 43% 43% 2px 2px; }
  .hero-sticker { right: -2px; bottom: 0; width: 108px; height: 86px; }
  .intro-items { padding: 26px 0; gap: 11px; }
  .intro-item, .intro-item:first-child, .intro-item:last-child { padding: 0; }
  .intro-icon { width: 33px; }
  section.block { padding: 80px 0; }
  .section-heading { margin-bottom: 39px; }
  .philosophy-grid { gap: 38px; }
  .quote-art { min-height: 330px; border-radius: 2px; }
  .facility-grid { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 10px; }
  .facility-photo:nth-child(1), .facility-photo:nth-child(4) { grid-column: span 2; height: 260px; }
  .facility-photo:nth-child(2), .facility-photo:nth-child(3) { grid-column: span 1; height: 208px; }
  .facility-photo figcaption { padding: 30px 12px 11px; }
  .pillar-grid { display: block; }
  .pillar { border-right: 0; border-bottom: 1px solid #dce0d7; }
  .pillar:last-child { border-bottom: 0; }
  .pillar-body { padding: 30px 6px 32px; }
  .pillar-number { margin-bottom: 15px; }
  .pillar-body h3 { margin-bottom: 13px; }
  .support-grid { gap: 12px; }
  .support-item { padding: 26px; }
  .day-frame { padding: 32px 20px; }
  .sports-visual { min-height: 260px; }
  .info-table { border-radius: 2px; }
  .contact { padding: 75px 0; }
  .access-card { min-height: 220px; }
}

/* Revision: the gentler, brighter warmth of Waon, with large real-room photos. */
:root {
  --ink: #43564c;
  --deep: #557664;
  --green: #7e9f8b;
  --sea: #dce9dd;
  --mint: #edf5eb;
  --cream: #fff8f0;
  --paper: #fffdf9;
  --orange: #c98d76;
  --sun: #f5ddc5;
  --coral: #f5e5dd;
  --line: #e5e8df;
  --text: #617369;
  --shadow: 0 13px 34px rgba(58,76,57,.08);
}
body { background: #fffdf9; font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", sans-serif; letter-spacing: .025em; }
h1, h2, h3 { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", "Yu Gothic", sans-serif; font-weight: 650; letter-spacing: .06em; }
h2 { font-size: clamp(1.8rem,3vw,2.6rem); line-height: 1.6; }
.eyebrow { font-family: Arial,sans-serif; font-size: .72rem; font-weight: 600; color: #88a291; letter-spacing: .16em; }
.button { border-radius: 999px; padding: 14px 27px; font-weight: 700; background: #567866; }
.button:hover { background: #6d917b; }
.button-outline { background: #fffdfa; color: #587967; border: 1px solid #9ab4a1; }
.button-outline:hover { background: #eef5ed; color: #4b6958; }
.button-light { background: #fffaf3; color: #557363; }
.button-light:hover { background: #f6eade; }
.site-header { background: rgba(255,253,249,.97); border-bottom: 1px solid #eff0e9; }
.brand-text strong { font-family: Arial,sans-serif; font-weight: 700; color: #638675; letter-spacing: .15em; }
.brand-text small { color: #899d8f; }
.nav a:not(.button) { font-weight: 600; color: #5c7866; }
.nav .button { border-radius: 999px; }

/* Photo-first hero: a wide image and a welcoming, readable floating card. */
.hero { background: #fff8f0; min-height: 0; }
.hero-inner {
  display: block;
  width: min(1380px, calc(100% - 48px));
  max-width: none;
  min-height: 746px;
  position: relative;
  padding: 0;
}
.hero-visual {
  position: absolute;
  inset: 28px 0 47px;
  width: 100%;
}
.hero-image {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: cover;
  object-position: center 49%;
  border-radius: 35px;
  box-shadow: none;
  filter: saturate(.95);
}
.hero-copy {
  position: absolute;
  z-index: 3;
  left: 3.7%;
  bottom: 78px;
  width: min(410px, 41%);
  padding: 27px 29px 28px;
  background: rgba(255,252,246,.94);
  border-radius: 22px;
  box-shadow: 0 16px 45px rgba(45,57,47,.12);
  text-align: left;
}
.hero-kicker { margin-bottom: 12px; font-size: .69rem; color: #779988; }
.hero-kicker::before { background: #d8b4a0; width: 27px; height: 2px; }
.hero h1 { font-size: clamp(1.85rem,2.5vw,2.35rem); line-height: 1.47; letter-spacing: .045em; margin-bottom: 13px; }
.hero h1 em { color: #bd826f; }
.hero-lead { font-size: .81rem; line-height: 1.9; margin-bottom: 18px; }
.hero-actions { gap: 10px; }
.hero-actions .button { padding: 10px 16px; font-size: .75rem; min-width: 112px; }
.hero-sticker {
  top: 52px;
  right: 45px;
  bottom: auto;
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background: rgba(255,251,242,.96);
  box-shadow: 0 10px 25px rgba(44,56,41,.1);
  color: #668b73;
  font-size: .64rem;
}
.hero-sticker strong { font-family: Arial,sans-serif; font-weight: 700; }
.intro-bar { background: #fffdf9; }
.intro-items { padding-block: 31px; }
.intro-icon, .intro-item:nth-child(2) .intro-icon, .intro-item:nth-child(3) .intro-icon {
  width: 43px; height: 43px; border-radius: 50%; background: #f8eadd;
  color: #b98977; font: bold .9rem Arial,sans-serif;
}
.intro-item:nth-child(2) .intro-icon { background: #eaf1e6; color: #779683; }
.intro-item:nth-child(3) .intro-icon { background: #f7eee2; color: #c19a79; }
.intro-item strong { color: #547363; }

section.block { padding-block: 103px; }
.philosophy { background: #fffdf9; }
.quote-art { border-radius: 26px; min-height: 460px; background: #edf3e9; }
.quote-art::before {
  display: block; width: 230px; height: 230px; top: 37px; left: 50%;
  background: #f6e0cb; opacity: .85; border-radius: 50%; transform: translateX(-50%);
}
.quote-art::after { display: none; }
.quote-art .message strong { font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif; font-weight: 650; }
.quote-art .message span, .quote-art .message small { color: #799483; }
.philosophy-copy h2 { color: #557463; }
.signature { color: #7e9c89; }
.facility { background: #fff8f2; }
.facility .section-heading h2 { color: #557463; }
.facility-grid { gap: 23px; }
.facility-photo, .facility-photo:nth-child(1), .facility-photo:nth-child(4) { height: 415px; border-radius: 27px; }
.facility-photo img { filter: saturate(1); }
.facility-photo figcaption { font-weight: 700; font-size: .87rem; }
.facility-note { color: #8b9388; }
.pillars { background: #fffdf9; }
.pillar-grid { gap: 22px; border: 0; }
.pillar {
  background: #fff; border: 1px solid #ecece5; border-radius: 24px;
  box-shadow: 0 10px 32px rgba(56,79,59,.065); overflow: hidden;
}
.pillar:last-child { border-right: 1px solid #ecece5; }
.pillar:hover { transform: translateY(-3px); }
.pillar-picture { display: flex; height: 218px; }
.pillar-one .pillar-picture { background: #f8e8d9; }
.pillar-two .pillar-picture { background: #e0eee5; }
.pillar-three .pillar-picture { background: #f4ebdc; }
.pillar-picture svg { filter: saturate(.82); }
.pillar-body { padding: 31px 29px 35px; }
.pillar-number { color: #9bb5a5; font-family: Arial,sans-serif; font-weight: 700; margin-bottom: 12px; }
.pillar-body h3 { font-size: 1.44rem; color: #557463; margin-bottom: 15px; }
.pillar-body p { font-size: .9rem; }
.support { background: #eaf2e9; color: #536c5b; }
.support .eyebrow { color: #7d9a87; }
.support .section-heading h2 { color: #4f6e59; }
.support .section-heading p { color: #6c806f; }
.support-item {
  background: #fffdf8; border: 1px solid #e4ede3;
  border-radius: 23px; padding: 35px 30px;
}
.support-symbol { background: #f7e9db; border: none; color: #b88976; }
.support-item h3 { color: #557463; font-weight: 650; }
.support-item p { color: #6d7e71; }
.day { background: #fffdf9; }
.day-frame { background: #f4f7ee; border-radius: 26px; }
.moment-dot, .moment:nth-child(1) .moment-dot, .moment:last-child .moment-dot {
  background: #fffdf8; border: 2px solid #d8e6d7; color: #6b9578;
}
.sports { background: #faede2; }
.sports-visual { background: #e4eee0; border-radius: 27px; }
.sports-visual svg { filter: saturate(.84); }
.sports-chip { background: #fff8f2; border-radius: 999px; color: #9a7766; }
.info { background: #fffdf9; }
.info-table { background: #f4f6ef; border-radius: 25px; }
.steps { border-radius: 25px; }
.step-num { background: #f7e2cb; color: #a27760; }
.faq { background: #f6f4ee; }
.contact { background: #668b77; }
.contact .eyebrow { color: #e9f2e9; }
.access { background: #fffdf9; }
.access-card { background: #e9f1e9; border-radius: 26px; }
.access-card strong { color: #668b77; }
.footer { background: #eff3ec; }

@media (max-width: 1000px) {
  .hero-inner { min-height: 690px; }
  .hero-copy { width: min(410px, 55%); padding: 26px 28px; left: 4%; bottom: 70px; }
  .hero h1 { font-size: clamp(1.85rem,3.5vw,2.35rem); }
}
@media (max-width: 760px) {
  .hero-inner {
    display: flex; flex-direction: column-reverse; gap: 0;
    width: min(100% - 26px, 560px); min-height: 0;
    padding: 16px 0 58px;
  }
  .hero-visual { position: relative; inset: auto; height: 340px; flex: none; }
  .hero-image { border-radius: 22px; }
  .hero-copy {
    position: relative; left: auto; bottom: auto; z-index: 3;
    width: auto; margin: -46px 13px 0; padding: 25px 24px 26px;
    border-radius: 22px; box-shadow: 0 10px 30px rgba(45,57,47,.10);
  }
  .hero h1 { font-size: clamp(1.85rem,6.9vw,2.4rem); line-height: 1.52; }
  .hero-lead { font-size: .83rem; line-height: 1.95; }
  .hero-sticker { top: 18px; right: 17px; width: 79px; height: 79px; font-size: .52rem; }
  .hero-sticker strong { font-size: 1.2rem; }
  .intro-items { padding: 24px 0; }
  section.block { padding-block: 78px; }
  .quote-art { min-height: 325px; border-radius: 23px; }
  .facility-grid { gap: 12px; }
  .facility-photo:nth-child(1), .facility-photo:nth-child(4) { height: 285px; border-radius: 19px; }
  .facility-photo:nth-child(2), .facility-photo:nth-child(3) { height: 245px; border-radius: 19px; }
  .pillar-grid { display: grid; gap: 17px; }
  .pillar { border-radius: 21px; border-bottom: 1px solid #ecece5; }
  .pillar:last-child { border-bottom: 1px solid #ecece5; }
  .pillar-picture { height: 185px; }
  .pillar-body { padding: 25px 24px 29px; }
  .support-item { border-radius: 20px; padding: 28px 25px; }
  .day-frame { border-radius: 22px; }
  .sports-visual { border-radius: 22px; }
  .info-table { border-radius: 22px; }
  .steps { border-radius: 22px; }
  .access-card { border-radius: 22px; }
}

/* Final warmth pass: a touch more kinari, peach and natural softness. */
:root {
  --ink: #575d50;
  --deep: #647d68;
  --green: #8da28a;
  --cream: #fff2e7;
  --paper: #fff8f0;
  --orange: #ce9c7d;
  --sun: #f7e1c5;
  --text: #75776c;
}
body { background: var(--paper); }
h1, h2, h3 { font-weight: 600; letter-spacing: .045em; }
.site-header { background: rgba(255,249,240,.98); }
.hero { background: #faecdd; }
.hero-copy {
  background: rgba(255,247,236,.97);
  border: 1px solid rgba(233,210,187,.85);
  box-shadow: 0 18px 46px rgba(91,70,48,.12);
}
.hero h1 em { color: #bb8067; }
.hero-lead { color: #73796d; }
.hero-image { filter: saturate(.97) sepia(.055) brightness(1.012); }
.hero-sticker { background: rgba(255,246,231,.97); color: #7c917a; }
.button { background: #69836e; }
.button:hover { background: #809a82; }
.button-outline { background: #fff8ed; }
.intro-bar, .philosophy, .pillars, .day, .info, .access { background: #fff9f1; }
.intro-icon, .intro-item:nth-child(1) .intro-icon { background: #f6e0d0; }
.quote-art { background: #f0f0e5; }
.quote-art::before { background: #f5ddc2; }
.facility { background: #faeee3; }
.facility-photo img { filter: saturate(.98) sepia(.045); }
.pillar { background: #fffbf4; border-color: #eedfd3; }
.support { background: #f1f0e4; }
.support-item { background: #fff9f1; border-color: #e9e4d6; }
.day-frame, .info-table { background: #f5f3e8; }
.sports { background: #f8e8db; }
.contact { background: #758d78; }
.access-card { background: #f0f0e3; }
.footer { background: #f4efe5; }

/* Business-card identity: original leaf-tree artwork and brown Buddies wordmark. */
.site-header .brand, .footer .brand {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 242px;
}
.brand-tree {
  display: block;
  width: 78px;
  height: auto;
  flex: none;
}
.brand-lockup {
  display: flex;
  align-items: center;
  line-height: 0;
}
.brand-wordmark {
  display: block;
  width: 167px;
  height: auto;
}
.site-header { background: rgba(255,251,246,.97); }
.hero h1 em { color: #926e52; }
.intro-item:nth-child(1) .intro-icon { background: #e0f1f1; color: #6a9c97; }
.intro-item:nth-child(2) .intro-icon { background: #eaf2e3; color: #79a078; }
.intro-item:nth-child(3) .intro-icon { background: #f8e7de; color: #b98a73; }
.quote-art { background: #f5f7ef; }
.quote-art::before {
  display: block;
  inset: 0;
  width: 100%;
  height: 100%;
  transform: none;
  border-radius: 0;
  background: url("buddies-tree.webp") center / 86% auto no-repeat;
  opacity: .18;
}
.facility { background: #f7f6f1; }
.support { background: #edf5ec; }
.contact { background: #597e6c; }
@media (max-width: 760px) {
  .site-header .brand, .footer .brand { min-width: 0; gap: 5px; }
  .brand-tree { width: 57px; }
  .brand-wordmark { width: 139px; }
}

/* A calm, readable visual language for the new ABA, journal and map sections. */
.approach { background: #f7f4ed; }
.approach-grid { display: grid; grid-template-columns: 1.08fr .92fr; align-items: center; gap: clamp(30px, 6vw, 85px); }
.approach-copy h2 { margin: 12px 0 26px; }
.approach-copy p { line-height: 2.05; margin-bottom: 19px; }
.approach-copy strong { color: #6c7959; }
.approach-copy .approach-note { color: #69766d; font-size: .87rem; border-left: 3px solid #d4b886; padding-left: 17px; margin-top: 27px; }
.approach-steps { display: grid; gap: 17px; }
.approach-step { display: flex; gap: 21px; align-items: start; background: #fffefa; padding: 25px 27px; border-radius: 22px; border: 1px solid #e5e2d7; box-shadow: 0 10px 34px rgba(68,73,49,.055); }
.approach-step > span { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 50%; background: #e7eee4; color: #5f836a; font-weight: 800; }
.approach-step:nth-child(2) > span { background: #f8e5dc; color: #b27764; }
.approach-step:nth-child(3) > span { background: #f6eac8; color: #a17b41; }
.approach-step h3 { font-size: 1.06rem; margin: 3px 0 7px; }
.approach-step p { font-size: .86rem; margin: 0; line-height: 1.85; }
.blog-preview { background: #fffdfa; }
.blog-card-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 22px; }
.blog-card { display: block; padding: 33px 36px; border-radius: 22px; border: 1px solid #e9e1d6; background: #faf6ef; box-shadow: 0 10px 36px rgba(72,55,35,.045); transition: transform .2s ease, box-shadow .2s ease; }
.blog-card:hover { transform: translateY(-4px); box-shadow: 0 15px 36px rgba(72,55,35,.1); }
.blog-card-category { display: inline-flex; background: #e5eee4; color: #587663; border-radius: 99px; padding: 3px 13px; font-size: .75rem; font-weight: 800; }
.blog-card time { display: block; margin-top: 20px; color: #9a8675; font: 700 .77rem Arial,sans-serif; letter-spacing: .06em; }
.blog-card h3 { font-size: 1.3rem; margin: 8px 0 14px; }
.blog-card p { font-size: .92rem; margin: 0 0 26px; }
.blog-card-more { font-weight: 800; color: #7b7651; font-size: .85rem; }
.blog-all { text-align: center; margin-top: 35px; }
.recruit-banner { background: #718f78; color: #fff; padding: 65px 0; }
.recruit-banner-inner { display: flex; gap: 30px; justify-content: space-between; align-items: center; }
.recruit-banner .eyebrow { color: #f8deb0; }
.recruit-banner h2 { color: #fff; margin: 9px 0 11px; }
.recruit-banner p { color: #f1f5eb; margin: 0; }
.recruit-banner .button-light { background: #fffaf2; color: #5a7864; flex: none; }
.founder-message { background: linear-gradient(125deg, #f8eee3, #f5f4e9); }
.founder-inner { display: grid; grid-template-columns: .82fr 1.18fr; align-items: center; gap: clamp(30px, 6vw, 90px); }
.founder-intro h2 { margin: 13px 0 26px; }
.founder-phrase { color: #926f55; font-size: clamp(1.4rem, 2.3vw, 1.9rem); font-weight: 800; letter-spacing: .045em; }
.founder-card { position: relative; overflow: hidden; padding: clamp(28px, 4vw, 52px); border-radius: 26px; border: 1px solid #ebded0; background: rgba(255,253,248,.93); box-shadow: 0 15px 50px rgba(78,68,52,.07); }
.founder-card::before { content: ""; position: absolute; width: 145px; height: 145px; bottom: -20px; right: -20px; background: url("buddies-tree.webp") center / contain no-repeat; opacity: .11; pointer-events: none; }
.founder-card p { position: relative; z-index: 1; line-height: 2.1; margin-bottom: 20px; }
.founder-signature { position: relative; color: #8f7155; font-size: .82rem; font-weight: 800; padding-top: 14px; border-top: 1px solid #eaddce; }
.access-map-wrap { border-radius: 26px; overflow: hidden; background: #eeeae0; box-shadow: 0 12px 36px rgba(52,67,49,.09); min-height: 330px; }
.access-map { display: block; border: 0; width: 100%; height: 360px; }
.button.line-button { background: #06b94a; color: #fff; box-shadow: 0 10px 24px rgba(0,126,53,.18); }
.button.line-button:hover { background: #079943; box-shadow: 0 12px 26px rgba(0,126,53,.24); }
.contact .line-button { padding-inline: 32px; }
.contact .contact-actions { display: flex; flex-direction: column; align-items: center; }
.contact .contact-actions .line-button { min-width: 260px; }
.line-qr-card { display: flex; flex-direction: column; align-items: center; padding: 15px 18px; background: #fffefa; border-radius: 18px; text-align: center; color: #5d7465; }
.line-qr-card img { display: block; width: 155px; height: 155px; }
.line-qr-card span { display: block; font-size: .7rem; line-height: 1.6; font-weight: 700; }
.line-contact-note { margin-top: 16px !important; color: #eef4e9 !important; font-size: .85rem; }
.info-row .phone-link { display: block; width: fit-content; color: #4a725e; font-weight: 750; text-decoration: underline; text-underline-offset: 3px; }
.info-row .phone-link:not(:first-child) { margin-top: 10px; }
.contact-phone-note { margin-top: 14px !important; font-size: .85rem; line-height: 2; color: #f7f8f1 !important; }
.contact-phone-note a { color: inherit; text-decoration: underline; text-underline-offset: 3px; }
.faq .text-link { text-decoration: underline; text-underline-offset: 3px; color: #4c8165; font-weight: 800; }

/* Subtle contemporary motion, without flashing or mandatory movement. */
.brand-tree { transform-origin: 50% 86%; transition: transform .75s cubic-bezier(.2,.75,.25,1); }
.brand:hover .brand-tree, .brand:focus-visible .brand-tree { transform: rotate(-4deg) translateY(-2px) scale(1.045); }
.quote-art::before { animation: buddies-tree-float 9s ease-in-out infinite; }
.hero-image { animation: buddies-photo-arrive 1.25s ease-out both; }
@keyframes buddies-tree-float { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-7px) rotate(1deg); } }
@keyframes buddies-photo-arrive { from { opacity: .65; transform: scale(1.027); } to { opacity: 1; transform: scale(1); } }
html.has-motion .reveal { opacity: 0; transform: translateY(20px); transition: opacity .76s ease var(--reveal-delay,0ms), transform .76s cubic-bezier(.18,.72,.2,1) var(--reveal-delay,0ms); }
html.has-motion .reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (max-width: 760px) {
  /* Keep every two-column content section readable on narrow phones. */
  .philosophy-grid, .sports-grid, .info-grid, .access-grid,
  .approach-grid, .blog-card-grid, .founder-inner {
    grid-template-columns: minmax(0, 1fr);
  }
  .philosophy-copy, .quote-art, .sports-copy, .info-copy, .info-table,
  .access-map-wrap, .approach-copy, .approach-steps, .founder-intro, .founder-card {
    min-width: 0;
    width: 100%;
  }
  .philosophy-grid { gap: 34px; }
  .approach-step { padding: 23px 20px; }
  .blog-card { padding: 25px 24px; }
  .recruit-banner-inner { flex-direction: column; align-items: flex-start; }
  .access-map { height: 310px; }
  .line-qr-card { display: none; }
}
@media (prefers-reduced-motion: reduce) {
  .brand-tree, .hero-image, .quote-art::before { animation: none !important; transition: none !important; }
  html.has-motion .reveal { opacity: 1 !important; transform: none !important; transition: none !important; }
}