/*
Theme Name: Futtermonster Search
Theme URI: https://www.futtermonster.de/
Author: OpenAI
Description: Schnelles, suchzentriertes Theme für Futtermonster – Tierbedarf finden statt Produkte durchscrollen.
Version: 1.2.1
Text Domain: futtermonster-search
*/

:root{
  --fm-bg:#f6f8f2;
  --fm-surface:#ffffff;
  --fm-ink:#1e2b23;
  --fm-muted:#69756d;
  --fm-line:#dfe7df;
  --fm-accent:#7ed957;
  --fm-accent-strong:#43b047;
  --fm-accent-dark:#173f2d;
  --fm-warm:#fff5d6;
  --fm-radius:24px;
  --fm-shadow:0 18px 50px rgba(24,54,37,.10);
  --fm-max:1240px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--fm-bg);color:var(--fm-ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;line-height:1.6}
a{color:inherit;text-decoration:none}
img{max-width:100%;height:auto;display:block}
button,input,select,textarea{font:inherit}
.fm-shell{max-width:var(--fm-max);margin:0 auto;padding:0 22px}
.fm-header{position:sticky;top:0;z-index:50;background:rgba(246,248,242,.92);backdrop-filter:blur(14px);border-bottom:1px solid rgba(223,231,223,.75)}
.fm-header-row{min-height:78px;display:flex;align-items:center;gap:24px}
.fm-brand{display:flex;align-items:center;gap:12px;min-width:max-content;font-weight:900;font-size:1.35rem;letter-spacing:-.04em}
.fm-logo-mark{width:43px;height:43px;border-radius:15px;background:var(--fm-accent-dark);display:grid;place-items:center;box-shadow:0 8px 20px rgba(23,63,45,.18);position:relative;overflow:hidden}
.fm-logo-mark::after{content:"";width:23px;height:23px;background:var(--fm-accent);border-radius:50% 48% 52% 42%;transform:rotate(-18deg);box-shadow:15px -8px 0 -7px #fff,-14px -5px 0 -7px #fff}
.fm-brand small{display:block;font-weight:700;color:var(--fm-muted);font-size:.64rem;letter-spacing:.03em;text-transform:uppercase;margin-top:-3px}
.fm-animals{display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none;flex:1;justify-content:center}
.fm-animals::-webkit-scrollbar{display:none}
.fm-animal{display:flex;align-items:center;gap:7px;padding:10px 13px;border:1px solid transparent;border-radius:999px;white-space:nowrap;font-weight:800;font-size:.88rem;color:#33423a;transition:.2s;background:rgba(255,255,255,.55)}
.fm-animal:hover,.fm-animal:focus{background:#fff;border-color:var(--fm-line);transform:translateY(-1px);box-shadow:0 7px 20px rgba(24,54,37,.08)}
.fm-animal span{font-size:1.1rem}
.fm-header-actions{display:flex;gap:8px}
.fm-icon-btn{width:42px;height:42px;border-radius:14px;border:1px solid var(--fm-line);background:#fff;display:grid;place-items:center}
.fm-hero{padding:84px 0 54px;position:relative;overflow:hidden}
.fm-hero::before{content:"";position:absolute;width:560px;height:560px;border-radius:50%;background:radial-gradient(circle,rgba(126,217,87,.23) 0%,rgba(126,217,87,0) 68%);top:-230px;left:50%;transform:translateX(-50%);pointer-events:none}
.fm-hero-inner{text-align:center;position:relative}
.fm-eyebrow{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;background:#fff;border:1px solid var(--fm-line);font-size:.82rem;font-weight:800;color:#405046;box-shadow:0 5px 20px rgba(24,54,37,.05)}
.fm-hero h1{font-size:clamp(2.5rem,6vw,5.2rem);line-height:.96;letter-spacing:-.065em;max-width:900px;margin:25px auto 20px}
.fm-hero h1 em{font-style:normal;color:var(--fm-accent-strong)}
.fm-hero-copy{font-size:clamp(1rem,2vw,1.2rem);max-width:720px;margin:0 auto;color:var(--fm-muted)}
.fm-search-card{max-width:920px;margin:38px auto 0;background:#fff;border:1px solid var(--fm-line);box-shadow:var(--fm-shadow);border-radius:30px;padding:12px;display:flex;gap:10px;align-items:center}
.fm-search-icon{width:48px;height:48px;border-radius:16px;background:var(--fm-bg);display:grid;place-items:center;font-size:1.2rem;flex:0 0 auto}
.fm-search-card input{border:0;outline:0;flex:1;min-width:0;font-size:1.08rem;padding:14px 8px;background:transparent;color:var(--fm-ink)}
.fm-search-card input::placeholder{color:#98a39d}
.fm-search-card button{border:0;background:var(--fm-accent-dark);color:#fff;border-radius:18px;padding:15px 22px;font-weight:900;cursor:pointer;transition:.2s}
.fm-search-card button:hover{transform:translateY(-1px);background:#0d3222}
.fm-quick-prompts{display:flex;gap:9px;justify-content:center;flex-wrap:wrap;margin-top:18px}
.fm-quick-prompts a{font-size:.82rem;font-weight:750;padding:8px 11px;border-radius:999px;background:rgba(255,255,255,.72);border:1px solid var(--fm-line);color:#526158}
.fm-section{padding:46px 0}
.fm-section-head{display:flex;align-items:end;justify-content:space-between;gap:24px;margin-bottom:22px}
.fm-section-head h2{font-size:clamp(1.7rem,3vw,2.55rem);letter-spacing:-.045em;line-height:1.08;margin:0}
.fm-section-head p{margin:8px 0 0;color:var(--fm-muted);max-width:650px}
.fm-grid{display:grid;grid-template-columns:repeat(12,1fr);gap:18px}
.fm-need-card{grid-column:span 4;background:#fff;border:1px solid var(--fm-line);border-radius:var(--fm-radius);padding:24px;min-height:210px;position:relative;overflow:hidden;transition:.2s}
.fm-need-card:hover{transform:translateY(-3px);box-shadow:var(--fm-shadow)}
.fm-need-card .emoji{font-size:2rem;margin-bottom:30px}
.fm-need-card h3{font-size:1.2rem;letter-spacing:-.02em;margin:0 0 8px}
.fm-need-card p{margin:0;color:var(--fm-muted);font-size:.93rem}
.fm-need-card strong{display:inline-flex;margin-top:18px;color:var(--fm-accent-dark)}
.fm-guide-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.fm-guide-card{background:#fff;border:1px solid var(--fm-line);border-radius:22px;overflow:hidden;transition:.2s}
.fm-guide-card:hover{transform:translateY(-3px);box-shadow:var(--fm-shadow)}
.fm-guide-thumb{aspect-ratio:16/9;background:linear-gradient(135deg,#e9f4e2,#fff7d9);overflow:hidden}
.fm-guide-thumb img{width:100%;height:100%;object-fit:cover}
.fm-guide-body{padding:20px}
.fm-guide-meta{font-size:.74rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--fm-accent-strong)}
.fm-guide-card h3{font-size:1.1rem;line-height:1.25;margin:8px 0 10px;letter-spacing:-.025em}
.fm-guide-card p{color:var(--fm-muted);font-size:.9rem;margin:0}
.fm-trust{background:var(--fm-accent-dark);color:#fff;border-radius:30px;padding:34px;display:grid;grid-template-columns:1.2fr .8fr;gap:30px;align-items:center}
.fm-trust h2{font-size:clamp(1.8rem,4vw,3rem);line-height:1.05;letter-spacing:-.05em;margin:0 0 14px}
.fm-trust p{color:rgba(255,255,255,.75);margin:0}
.fm-trust-list{display:grid;gap:10px}
.fm-trust-item{background:rgba(255,255,255,.08);padding:13px 15px;border-radius:15px;font-weight:750}
.fm-content-wrap{max-width:900px;margin:0 auto;padding:48px 22px}
.fm-entry{background:#fff;border:1px solid var(--fm-line);border-radius:26px;padding:clamp(24px,5vw,52px);box-shadow:0 12px 35px rgba(24,54,37,.06)}
.fm-entry h1{font-size:clamp(2rem,4vw,3.7rem);line-height:1.02;letter-spacing:-.05em;margin-top:0}
.fm-entry h2{font-size:1.7rem;line-height:1.15;letter-spacing:-.03em;margin-top:2em}
.fm-entry p,.fm-entry li{font-size:1.03rem}
.fm-entry a{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}

.fm-content-layout{max-width:var(--fm-max);margin:0 auto;padding:48px 22px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:28px;align-items:start}
.fm-content-main{min-width:0}
.fm-content-layout .fm-entry{width:100%}
.fm-entry-list{margin-bottom:16px}
.fm-sidebar{min-width:0}
.fm-sidebar-card{position:sticky;top:104px;background:var(--fm-surface);border:1px solid var(--fm-line);border-radius:24px;padding:22px;box-shadow:0 12px 35px rgba(24,54,37,.06)}
.fm-sidebar-kicker{display:inline-flex;align-items:center;gap:7px;font-size:.7rem;font-weight:900;text-transform:uppercase;letter-spacing:.11em;color:var(--fm-accent-strong);margin-bottom:7px}
.fm-sidebar-kicker::before{content:"";width:8px;height:8px;border-radius:50%;background:var(--fm-accent)}
.fm-sidebar-card h2{margin:0;font-size:1.35rem;line-height:1.1;letter-spacing:-.035em}
.fm-sidebar-intro{font-size:.84rem;line-height:1.5;color:var(--fm-muted);margin:8px 0 17px}
.fm-sidebar-posts{display:grid;gap:4px}
.fm-sidebar-post{display:grid;grid-template-columns:72px minmax(0,1fr);gap:12px;align-items:center;padding:11px 0;border-top:1px solid var(--fm-line);transition:.2s}
.fm-sidebar-post:first-child{border-top:0}
.fm-sidebar-post:hover{transform:translateX(3px)}
.fm-sidebar-thumb{width:72px;height:72px;border-radius:16px;overflow:hidden;background:linear-gradient(135deg,#e9f4e2,#fff7d9);display:grid;place-items:center}
.fm-sidebar-thumb img{width:100%;height:100%;object-fit:cover}
.fm-sidebar-thumb span{font-size:1.45rem}
.fm-sidebar-post-copy{min-width:0;display:block}
.fm-sidebar-post time{display:block;font-size:.68rem;color:var(--fm-muted);margin-bottom:4px}
.fm-sidebar-post strong{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;font-size:.87rem;line-height:1.25;letter-spacing:-.012em}
.fm-sidebar-more{display:inline-block;margin-top:5px;font-size:.72rem;font-weight:850;color:var(--fm-accent-strong)}

.fm-footer{margin-top:60px;padding:42px 0 50px;border-top:1px solid var(--fm-line)}
.fm-footer-row{display:flex;justify-content:space-between;gap:20px;align-items:center;color:var(--fm-muted);font-size:.88rem}
.fm-footer-nav{display:flex;gap:16px;flex-wrap:wrap}
.fm-mobile-toggle{display:none}
@media (max-width:980px){
  .fm-content-layout{grid-template-columns:minmax(0,1fr) 280px;gap:20px}
  .fm-header-row{min-height:70px}
  .fm-animals{justify-content:flex-start}
  .fm-header-actions{display:none}
  .fm-need-card{grid-column:span 6}
  .fm-guide-grid{grid-template-columns:repeat(2,1fr)}
  .fm-trust{grid-template-columns:1fr}
}
@media (max-width:760px){
  .fm-content-layout{display:block;padding:30px 15px}
  .fm-sidebar{margin-top:20px}
  .fm-sidebar-card{position:static}
}
@media (max-width:680px){
  .fm-shell{padding:0 15px}
  .fm-header-row{gap:12px;flex-wrap:wrap;padding:9px 0 10px}
  .fm-brand{font-size:1.15rem}
  .fm-logo-mark{width:38px;height:38px;border-radius:13px}
  .fm-animals{order:2;width:100%;flex-basis:100%;justify-content:flex-start;padding-bottom:2px}
  .fm-animal{padding:8px 10px;font-size:.78rem}
  .fm-hero{padding:52px 0 32px}
  .fm-hero h1{font-size:2.8rem}
  .fm-search-card{border-radius:24px;display:grid;grid-template-columns:auto 1fr;padding:9px}
  .fm-search-card button{grid-column:1/-1;width:100%}
  .fm-need-card{grid-column:span 12;min-height:0}
  .fm-guide-grid{grid-template-columns:1fr}
  .fm-section{padding:32px 0}
  .fm-section-head{display:block}
  .fm-footer-row{display:block}
  .fm-footer-nav{margin-top:12px}
}

/* Guided two-step search */
.fm-guided-search{max-width:980px;margin:34px auto 0;padding:20px;background:rgba(255,255,255,.58);border:1px solid rgba(223,231,223,.92);border-radius:32px;box-shadow:0 18px 55px rgba(24,54,37,.06);backdrop-filter:blur(10px)}
.fm-filter-step{text-align:left}
.fm-filter-step+.fm-filter-step{margin-top:16px;padding-top:16px;border-top:1px solid var(--fm-line)}
.fm-filter-label{display:flex;align-items:center;gap:9px;margin:0 0 10px;font-size:.84rem;font-weight:900;color:#39483f}
.fm-filter-label>span{width:24px;height:24px;border-radius:9px;display:grid;place-items:center;background:var(--fm-accent-dark);color:#fff;font-size:.72rem}
.fm-filter-chips{display:flex;flex-wrap:wrap;gap:9px}
.fm-filter-chip{appearance:none;border:1px solid var(--fm-line);background:#fff;color:var(--fm-ink);border-radius:16px;padding:10px 14px;display:inline-flex;align-items:center;gap:8px;font-weight:850;cursor:pointer;transition:.18s;box-shadow:0 4px 14px rgba(24,54,37,.035)}
.fm-filter-chip:hover{transform:translateY(-1px);border-color:#b8d7b5;box-shadow:0 8px 20px rgba(24,54,37,.08)}
.fm-filter-chip.is-active{background:var(--fm-accent-dark);border-color:var(--fm-accent-dark);color:#fff;box-shadow:0 9px 24px rgba(23,63,45,.18)}
.fm-need-step{opacity:.58;transition:.2s}
.fm-need-step.is-ready{opacity:1}
.fm-selection-summary{text-align:left;margin:15px 2px 0;font-size:.82rem;font-weight:800;color:var(--fm-muted)}
.fm-selection-summary strong{color:var(--fm-accent-dark)}
.fm-guided-search .fm-search-card{margin:12px 0 0;max-width:none}
@media (max-width:680px){
  .fm-guided-search{padding:14px;border-radius:25px;margin-top:25px}
  .fm-filter-chips{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .fm-filter-chip{justify-content:flex-start;padding:10px 11px;border-radius:14px;font-size:.82rem}
  .fm-filter-step+.fm-filter-step{margin-top:13px;padding-top:13px}
}

.fm-need-placeholder{width:100%;padding:14px 16px;border:1px dashed rgba(29,78,58,.22);border-radius:14px;color:#68756f;background:rgba(255,255,255,.55);font-size:.94rem}