/* Mützen: einheitliche Karten mit vollständig sichtbaren Originalbildern. */
.gf-hats { --hats-green:#176b35; --hats-line:#d8e6db; color:#24372a; padding-bottom:3rem; }
.gf-hats * { box-sizing:border-box; }
.gf-hats-intro { margin:clamp(1.25rem,2.5vw,2.25rem) 0 2rem; padding:clamp(1.4rem,3vw,2.6rem); background:linear-gradient(125deg,#edf5ed,#fff 78%); border-top:5px solid var(--hats-green); border-radius:1rem; box-shadow:0 8px 28px rgba(20,65,37,.07); }
.gf-hats-eyebrow { margin:0 0 .45rem; color:var(--hats-green); font-size:.92rem; font-weight:800; letter-spacing:.1em; text-transform:uppercase; }
.gf-hats-intro h1 { margin:0 0 .7rem; color:var(--hats-green); font-size:clamp(2rem,3.3vw,3.1rem); line-height:1.14; }
.gf-hats-intro > p:last-child { max-width:67ch; margin:0; font-size:1.1rem; line-height:1.58; }
.gf-hat-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1.3rem; align-items:stretch; }
.gf-hat-card { display:flex; flex-direction:column; min-width:0; overflow:hidden; background:#fff; border:1px solid var(--hats-line); border-radius:1rem; box-shadow:0 10px 26px rgba(20,65,37,.08); }
.gf-hat-card__figure { flex:0 0 auto; width:100%; aspect-ratio:800/591; margin:0; overflow:hidden; background:#e9ece8; }
.gf-hats .gf-hat-card__figure > img { display:block; width:100% !important; height:100% !important; max-width:none !important; max-height:none !important; object-fit:contain; object-position:center; }
.gf-hat-card__caption { display:flex; align-items:center; flex:1; min-height:5.1rem; padding:1rem 1.35rem 1.15rem; border-top:1px solid var(--hats-line); border-left:4px solid #c3a44d; }
.gf-hat-card__caption h2 { margin:0; color:var(--hats-green); font-size:clamp(1.2rem,1.8vw,1.55rem); font-weight:700; line-height:1.25; }
@media(max-width:700px) { .gf-hats-intro { margin-top:1.15rem; padding:1.35rem; } .gf-hat-grid { grid-template-columns:1fr; gap:1rem; } .gf-hat-card__caption { min-height:4.2rem; padding:.85rem 1rem; } }
body:has(.gf-hats) > #page { margin-bottom:0; }
body:has(.gf-hats) #Footer { position:relative; bottom:auto; z-index:auto; width:100%; }
