:root{
	--ink:#263129;
	--muted:#69736b;
	--green:#314936;
	--dark:#203326;
	--cream:#f5f1e8;
	--paper:#fbfaf6;
	--line:#26312926;
	--serif:"Playfair Display",Georgia,serif;
	--sans:"DM Sans",Arial,sans-serif
}
 *{
	box-sizing:border-box
}
html{
	scroll-behavior:smooth
}
body{
	margin:0;
	background:var(--paper);
	color:var(--ink);
	font-family:var(--sans);
	line-height:1.65
}
a{
	color:inherit;
	text-decoration:none
}
 header{
	height:82px;
	position:sticky;
	top:0;
	z-index:50;
	background:#fbfaf6ee;
	backdrop-filter:blur(14px);
	border-bottom:1px solid var(--line);
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:0 5vw
}
.brand{
	display:flex;
	gap:12px;
	align-items:center
}
.mark{
	width:40px;
	height:40px;
	border:1px solid var(--green);
	border-radius:50%;
	display:grid;
	place-items:center
}
.brand small{
	display:block;
	font-size:9px;
	letter-spacing:.18em;
	text-transform:uppercase
}
.brand strong{
	display:block;
	font:600 19px/1 var(--serif)
}
 nav{
	display:flex;
	gap:20px;
	align-items:center
}
nav a{
	font-size:10px;
	font-weight:700;
	text-transform:uppercase;
	letter-spacing:.08em;
	padding:8px 0;
	border-bottom:1px solid transparent
}
nav a:hover{
	border-color:var(--green)
}
.menu{
	display:none
}
 .hero{
	min-height:680px;
	background:linear-gradient(115deg,#26352a,#71816d 55%,#b8a786);
	position:relative;
	overflow:hidden
}
.hero .bg{
	position:absolute;
	inset:0;
	background:linear-gradient(90deg,#17231bcc,#17231b33),url("assets/original/001_redesign-preview.png");
	background-size:cover;
	background-position:center;
	opacity:.62
}
.hero .inner{
	position:relative;
	z-index:2;
	color:white;
	max-width:800px;
	padding:125px 7vw
}
.eyebrow,.kicker{
	font-size:10px;
	font-weight:700;
	letter-spacing:.18em;
	text-transform:uppercase
}
.hero h1{
	font:500 clamp(55px,8vw,105px)/.95 var(--serif);
	letter-spacing:-.045em;
	margin:20px 0
}
.hero em,h1 em,h2 em{
	font-style:italic
}
.hero p{
	max-width:600px;
	font-size:17px
}
.button{
	display:inline-flex;
	gap:16px;
	padding:13px 18px;
	border:1px solid currentColor;
	font-size:10px;
	font-weight:700;
	letter-spacing:.1em;
	text-transform:uppercase;
	margin-top:18px
}
.dark{
	background:var(--green);
	color:#fff;
	border-color:var(--green)
}
 .section{
	padding:95px 7vw
}
.inner{
	max-width:1250px;
	margin:auto
}
.head{
	display:flex;
	justify-content:space-between;
	gap:40px;
	align-items:end;
	margin-bottom:40px
}
.kicker{
	color:#748078;
	margin-bottom:12px
}
h2{
	font:500 clamp(42px,5vw,72px)/1.04 var(--serif);
	letter-spacing:-.035em;
	margin:0
}
h3{
	font:500 30px/1.1 var(--serif);
	margin:8px 0
}
.lead{
	max-width:720px;
	color:var(--muted);
	font-size:17px
}
.cream{
	background:var(--cream)
}
 .grid{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:22px
}
.card{
	background:#fff;
	padding:30px;
	border:1px solid var(--line)
}
.num{
	font:500 52px var(--serif);
	color:#b8c0b6
}
.card p{
	color:var(--muted)
}
 .split{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:70px;
	align-items:center
}
.visual{
	min-height:440px;
	background:linear-gradient(145deg,#526451,#b7a985);
	box-shadow:0 22px 55px #1c271f20
}
 .dogs{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:25px
}
.dog{
	background:var(--cream);
	display:grid;
	grid-template-columns:42% 58%;
	min-height:360px
}
.dogimg{
	background:linear-gradient(145deg,#273228,#8c7a5f);
	min-height:360px
}
.dog:nth-child(2) .dogimg{
	background:linear-gradient(145deg,#6b5b44,#29342c)
}
.dog:nth-child(3) .dogimg{
	background:linear-gradient(145deg,#667260,#3b453d)
}
.dog:nth-child(4) .dogimg{
	background:linear-gradient(145deg,#a49370,#344136)
}
.dogbody{
	padding:32px
}
.meta{
	font-size:11px;
	color:var(--muted)
}
.tag{
	display:inline-block;
	border:1px solid var(--line);
	padding:5px 8px;
	margin:4px 3px 0 0;
	font-size:9px;
	letter-spacing:.08em;
	text-transform:uppercase
}
 .litter-tabs{
	display:flex;
	flex-wrap:wrap;
	gap:7px;
	margin:25px 0 45px
}
.litter-tabs a{
	border:1px solid var(--line);
	padding:8px 12px;
	font-size:10px;
	font-weight:700
}
.litter-tabs a:hover{
	background:var(--green);
	color:white
}
.wurf{
	padding:45px 0;
	border-top:1px solid var(--line)
}
.wurfgrid{
	display:grid;
	grid-template-columns:1fr 1.3fr;
	gap:45px;
	align-items:start
}
 .photos{
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:8px
}
.photos img{
	width:100%;
	aspect-ratio:1;
	object-fit:cover;
	background:#ddd
}
.photo-note{
	font-size:11px;
	color:var(--muted);
	margin-top:8px
}
 .news{
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:25px
}
.news article{
	padding:25px;
	border-top:1px solid var(--line)
}
.date{
	font-size:9px;
	letter-spacing:.15em;
	text-transform:uppercase;
	color:#758078
}
 .contact{
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:35px
}
.box{
	background:var(--cream);
	padding:42px
}
.map{
	min-height:360px;
	background:linear-gradient(135deg,#d9d4c5,#adb8aa);
	display:grid;
	place-items:center
}
 footer{
	background:var(--dark);
	color:white;
	padding:50px 7vw;
	display:flex;
	justify-content:space-between;
	gap:30px
}
footer small{
	opacity:.65
}
.footnav{
	display:flex;
	gap:18px;
	flex-wrap:wrap;
	font-size:10px;
	text-transform:uppercase
}
.horiz_container {
   display: flex;
   width: 100%;
   min-height: 680px;
}

.half_container {
   width: 50%;
   flex: 0 0 50%;
}

/* Linke Hälfte */
.image_container {
   display: flex;
   align-items: center;
   justify-content: center;
   overflow: hidden;
   background: #26352a;
}

.image_container img {
   display: block;
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: center;
}

/* Rechte Hälfte */
.text_container {
   display: flex;
   align-items: center;
   justify-content: center;

   padding: 70px 6vw;

   background: #26352a;
   color: white;
}

.text_container .inner {
   width: 100%;
   max-width: 700px;
   text-align: center;
}

.text_container .eyebrow {
   font-size: 12px;
   letter-spacing: 0.18em;
   text-transform: uppercase;
   margin-bottom: 25px;
}

.text_container h1 {
   font-size: clamp(58px, 5vw, 88px);
   line-height: 0.98;
   margin: 0 0 30px;
   letter-spacing: -0.045em;
}

.text_container p {
   max-width: 600px;
   margin: 0 auto 30px;
   font-size: 19px;
   line-height: 1.7;
   color: rgba(255,255,255,0.82);
}

.text_container .button {
   margin-top: 10px;
}
 @media(max-width:900px){
	nav{
		gap:10px
	}
	.grid{
		grid-template-columns:1fr 1fr
	}
	.dogs,.split,.contact,.wurfgrid{
		grid-template-columns:1fr
	}
	.photos{
		grid-template-columns:repeat(3,1fr)
	}
}
 @media(max-width:700px){
	header{
		height:72px
	}
	.menu{
		display:block;
		border:0;
		background:none
	}
	.menu span{
		display:block;
		width:25px;
		height:2px;
		background:var(--ink);
		margin:5px
	}
	nav{
		display:none;
		position:absolute;
		top:72px;
		left:0;
		right:0;
		padding:25px 6vw;
		background:var(--paper);
		flex-direction:column;
		align-items:flex-start;
		border-bottom:1px solid var(--line)
	}
	nav.open{
		display:flex
	}
	.hero{
		min-height:650px
	}
	.hero .inner{
		padding:110px 7vw
	}
	.section{
		padding:70px 7vw
	}
	.head{
		display:block
	}
	.grid,.news{
		grid-template-columns:1fr
	}
	.dog{
		grid-template-columns:1fr
	}
	.dogimg{
		min-height:260px
	}
	.photos{
		grid-template-columns:repeat(2,1fr)
	}
	footer{
		display:block
	}
	.footnav{
		margin-top:25px
	}
   .horiz_container {
      display: flex;
      flex-direction: column;
      min-height: 0;
   }

   .horiz_container .half_container {
      width: 100%;
      flex: none;
   }

   .horiz_container .image_container {
      order: 1;
      height: auto;
      min-height: 0;
   }

   .horiz_container .image_container img {
      width: 100%;
      height: auto;
      aspect-ratio: 4 / 3;
      object-fit: cover;
      display: block;
   }

   .horiz_container .text_container {
      order: 2;
      padding: 60px 7vw;
      min-height: 0;
   }

   .text_container .inner {
      max-width: 100%;
   }

   .text_container h1 {
      font-size: clamp(46px, 13vw, 68px);
      line-height: 1;
      margin-bottom: 25px;
   }

   .text_container p {
      font-size: 16px;
      line-height: 1.6;
   }
}