/*
Theme Name: Barsois von Ochotnikov
Description: Ein responsives Block-Theme für Barsois von Ochotnikov.
Version: 1.0.0
Requires at least: 6.6
Requires PHP: 7.4
Text Domain: ochotnikov
*/

:root { --forest: #163c31; --cream: #faf6eb; --gold: #aa8953; }
body { margin: 0; }
.wp-site-blocks { padding: 0; }
.wp-site-blocks > * { margin-block-start: 0; }
.brand { background: var(--cream); border-bottom: 2px solid var(--gold); }
.brand .wp-block-site-title, .brand .wordmark {
  font: 400 clamp(1.65rem, 4vw, 3.15rem)/1.12 Georgia, serif;
  margin: 0; padding: 1.35rem 1rem; text-align: center;
}
.brand .wordmark a { text-decoration: none; color: var(--forest); }
.brand .wp-block-navigation { background: var(--forest); color: var(--cream); min-height: 3.1rem; padding: .35rem 1rem; }
.brand .wp-block-navigation-item__content { padding: .5rem .12rem; font-size: .84rem; }
.brand .wp-block-navigation__responsive-container.is-menu-open { background: var(--forest); color: var(--cream); padding: 1.5rem; }
.brand .wp-block-navigation__responsive-container.is-menu-open a { color: var(--cream); }
.hero, .hero .wp-block-image { margin: 0; }
.hero img { display: block; width: 100%; height: clamp(260px, 43vw, 620px); object-fit: cover; object-position: center 48%; }
.section, .reading { width: min(1160px, calc(100% - 2rem)); margin: 0 auto; padding: clamp(2rem, 5vw, 4rem) 0; }
.section > h1, .section > h2, .reading > h1 { text-align: center; margin: 0 0 1.6rem; font-size: clamp(1.9rem, 4vw, 3.1rem); }
.puppy-grid, .news .wp-block-post-template, .portraits {
  display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1.15rem; padding: 0;
}
.puppy-card { display: grid; grid-template-columns: minmax(82px, 41%) 1fr; gap: .85rem; align-items: center; background: var(--forest); color: var(--cream); border: 1px solid var(--gold); outline: 1px solid var(--gold); outline-offset: -5px; padding: .7rem; }
.puppy-card > * { margin: 0; min-width: 0; }
.puppy-card img { width: 100%; aspect-ratio: 1 / 1.14; object-fit: cover; display: block; }
.puppy-card h3 { font-size: 1.35rem; margin: 0 0 .55rem; overflow-wrap: anywhere; }
.puppy-card .wp-block-button__link { background: #e2c993; color: #172e26; font-size: .78rem; padding: .4rem .65rem; }
.news { border-top: 1px solid #d6c4a4; }
.news .wp-block-post { margin: 0; min-width: 0; }
.news-card, .portrait, .sport-note, .memorial { border: 1px solid #cbb486; padding: 1.1rem; }
.news-card .wp-block-post-date { font-size: .82rem; }
.news-card h3 { margin: .65rem 0; font-size: 1.45rem; overflow-wrap: anywhere; }
.portrait { text-align: center; margin-block-start: 0; }
.portrait img { width: 100%; aspect-ratio: 4/3; object-fit: cover; display: block; }
.sport-photo img { width: 100%; height: auto; display: block; }
.memorial { text-align: center; }
.memorial img, .regenbogen .wp-block-gallery img { border-radius: 50%; aspect-ratio: 1; object-fit: cover; border: 2px solid var(--gold); }
.hunde .wp-block-gallery img { border: 2px solid var(--gold); }
.reading .wp-block-post-content { overflow-wrap: anywhere; }
.reading img { max-width: 100%; height: auto; }
.reading iframe { max-width: 100%; }
.site-foot { border-top: 1px solid var(--gold); padding: 1.5rem 1rem; text-align: center; }
.site-foot p { margin: .35rem 0; }
a:focus-visible, button:focus-visible { outline: 2px solid currentColor; outline-offset: 4px; }
@media (max-width: 850px) {
  .puppy-grid, .news .wp-block-post-template { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 600px) {
  .puppy-grid, .news .wp-block-post-template, .portraits { grid-template-columns: 1fr; }
  .puppy-card { grid-template-columns: minmax(82px, 33%) 1fr; }
  .hero img { object-position: 50% 50%; }
}