/* WatWilJeKat.nl — V4. Eén zelfstandig stijlblad, beeldtaal van de gekozen mockup. */
:root { --ink:#183735; --text:#314943; --muted:#50665f; --green:#315f46; --sage:#688966; --orange:#c26d45; --paper:#fdfaf6; --line:#e4e9e0; --shadow:0 7px 24px rgba(46,63,48,.075); }
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{margin:0;background:var(--paper);font:15px/1.5 Arial,Helvetica,sans-serif;color:var(--text)}
body.modal-open{overflow:hidden}a{color:inherit;text-decoration:none}button,input{font:inherit}button{cursor:pointer}img{max-width:100%}
svg{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:1.9;stroke-linejoin:round;stroke-linecap:round;flex:none}
.svg-icons{position:absolute;width:0;height:0;overflow:hidden}.visually-hidden{position:absolute!important;height:1px;width:1px;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}
button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #c88556;outline-offset:3px}
.skip-link{position:fixed;top:-80px;left:15px;background:white;padding:10px 15px;z-index:200;border-radius:8px}.skip-link:focus{top:8px}
.container{width:calc(100% - 64px);max-width:1096px;margin-inline:auto}
.site-header,.hero,.site-footer{width:100%;max-width:1160px;margin-inline:auto}
h1,h2,h3{color:var(--ink)}
/* Header, met een herkenbaar consistent kattenbeeld in plaats van verschillende icoontjes. */
.site-header{position:sticky;top:0;z-index:30;background:#fffdfaee;border-bottom:1px solid #eae9e2;backdrop-filter:blur(12px)}
.header-inner{min-height:70px;display:flex;align-items:center;gap:22px;justify-content:space-between}
.brand{display:inline-flex;gap:7px;align-items:center;flex:none;white-space:nowrap}
.brand-logo{display:block;width:51px;height:56px;object-fit:contain}
.brand strong{display:block;font:700 27px/1.02 Georgia,'Times New Roman',serif;letter-spacing:-1.2px;color:#1d3b39}
.brand strong span{color:#c76f49}.brand strong small{font-size:.58em}
.brand em{display:block;margin-top:5px;color:#718079;letter-spacing:.85px;font:800 7.9px/1.25 Arial,Helvetica,sans-serif;font-style:normal}
.main-nav{display:flex;align-items:center;gap:22px;margin-left:auto}.main-nav a{font-size:12.6px;font-weight:700;color:#253c36;white-space:nowrap;padding:12px 0}.main-nav a:hover{color:#b2613e}
.header-actions{display:flex;gap:8px;align-items:center}.icon-button{border:0;border-radius:50%;display:grid;place-items:center;height:40px;width:40px;background:#e8f0e6;color:#193d33}.icon-button:hover{background:#d6e6d6}.menu-button{display:none}
/* Hero: cat picture and text positioned relative to the SAME capped site canvas. */
.hero{height:364px;position:relative;isolation:isolate;overflow:visible;background:#f9f7f0;border-radius:0 0 27px 27px}
.hero-image{position:absolute;inset:0;border-radius:0 0 27px 27px;overflow:hidden;z-index:-1;background:#f8f5ed url('assets/hero-v41.webp') center center/100% 100% no-repeat}
.hero-soften{display:none}.hero-content{position:relative;padding-top:24px;z-index:2}
.hero h1{font:700 clamp(39px,4.2vw,52px)/1.06 Georgia,'Times New Roman',serif;letter-spacing:-1.55px;margin:0 0 13px;max-width:605px}.hero h1 span{color:#698967}
.hero-lead{font-size:14.4px;line-height:1.48;max-width:405px;margin:0 0 15px;color:#2e4541}
.search-area{position:relative;max-width:520px}.search-form{height:54px;display:flex;align-items:center;gap:12px;border-radius:50px;border:1px solid #e3e7df;background:#fff;padding:5px 5px 5px 16px;box-shadow:0 5px 20px #364b3c21}.search-form svg{width:23px;height:23px;color:#1a3b33}.search-form input{flex:1;min-width:0;outline:0;border:0;background:none;color:#183b34;font-size:14px}.search-form input::placeholder{color:#85908c}
.search-submit,.primary-button{border:0;border-radius:40px;background:linear-gradient(125deg,#3b7552,#285b40);color:white;display:inline-flex;justify-content:center;align-items:center;gap:10px;font-weight:700;box-shadow:0 5px 12px #214a3330}.search-submit{height:43px;min-width:110px;padding:0 17px;font-size:14px}.search-submit:hover,.primary-button:hover{background:#244a34}
.popular-searches{display:flex;flex-wrap:wrap;align-items:center;gap:5px;margin-top:10px;font-size:11.5px;max-width:675px}.popular-searches strong{margin-right:5px;color:#243e33}.popular-searches button{background:#fffefae6;border:1px solid #e4e8e1;border-radius:24px;box-shadow:0 2px 6px #223b2510;padding:5px 9px;line-height:1.2;color:#43544a;font-size:11.5px;white-space:nowrap}.popular-searches button:hover{background:#e6f0e6}
.hero-handnote{position:absolute;z-index:2;right:24px;top:24px;color:#29483a;text-align:center;font:italic 15.5px/1.18 Georgia,serif;transform:rotate(-8deg);text-shadow:0 1px 6px #fff6e7}.hero-handnote span{font-size:13px}.hero-handnote i{display:block;font:24px/1.1 Georgia,serif;color:#c36c45}
.hero-sticker{position:absolute;z-index:2;bottom:-9px;right:19px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;width:100px;height:100px;border-radius:50%;background:#fff0d5e9;color:#30423b;font:italic 13px/1.16 Georgia,serif;transform:rotate(-9deg);box-shadow:0 4px 20px #503b1a12}.hero-sticker span{color:#bd7351;margin-top:4px}
.search-results{position:absolute;z-index:50;top:calc(100% + 8px);left:0;right:0;max-height:450px;overflow:auto;padding:14px;background:#fff;border:1px solid #dde6dc;border-radius:16px;box-shadow:0 20px 45px #203a2f33}.search-results[hidden]{display:none}.search-results-head{display:flex;justify-content:space-between;align-items:center;gap:8px;padding-bottom:7px;border-bottom:1px solid #e4e8e0;font-size:13px}.search-results-head button{background:none;border:0;text-decoration:underline;color:#315f46;font-size:13px}.search-results a{display:block;padding:9px;border-radius:9px;font-size:13px}.search-results a:hover{background:#f0f6ee}.search-results a b,.search-results a small{display:block}.search-results a small{font-size:12px;color:#63796c}
/* Category cards: photographic bands, softly colored bodies, anchored icons */
.topic-section{margin-top:16px}.topic-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}
.topic-card{position:relative;overflow:hidden;display:flex;flex-direction:column;border-radius:17px;min-height:268px;transition:transform .18s ease,box-shadow .18s ease;box-shadow:0 4px 19px #263f2e0b}.topic-card:hover{transform:translateY(-3px);box-shadow:0 8px 25px #263f2e1a}
.topic-green{background:linear-gradient(#f1f7ed,#e9f1e8)}.topic-peach{background:linear-gradient(#fff6e9,#fff0df)}.topic-blue{background:linear-gradient(#f0f6ff,#e7f0fb)}.topic-cream{background:linear-gradient(#fff7ef,#fff0e9)}
.topic-photo{height:137px;overflow:hidden;background:#ede9e1}.topic-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 45%;filter:saturate(1.08) contrast(1.02)}
.topic-card .round-symbol{position:absolute;top:113px;left:13px;display:grid;place-items:center;height:46px;width:46px;border:3px solid #fff;border-radius:50%;background:#dceee1;color:#255b4c;box-shadow:0 3px 8px #2e48301b}.topic-card:nth-child(2) .round-symbol{background:#ffe1bc;color:#b86c34}.topic-card:nth-child(3) .round-symbol{background:#dcecff;color:#3b638c}.topic-card:nth-child(4) .round-symbol{background:#ffdbd0;color:#a85640}.round-symbol svg{width:24px;height:24px}
.topic-copy{flex:1;display:flex;flex-direction:column;padding:30px 17px 16px}.topic-copy h2{font:700 20.5px/1.1 Georgia,serif;letter-spacing:-.55px;margin:0 0 7px}.topic-copy p{font-size:13.6px;line-height:1.42;color:#354e45;margin:0 0 12px}.read-link{margin-top:auto;display:flex;align-items:center;gap:8px;color:#2b6444;font-size:12.6px;font-weight:700}.read-link svg{width:16px;height:16px}
/* FAQ and guide — deliberate two-column shared composition */
.help-grid{display:grid;grid-template-columns:.94fr 1.14fr;gap:18px;align-items:stretch;margin-top:22px}
.section-heading{display:flex;align-items:flex-start;gap:10px}.heading-icon{width:36px;height:36px;margin-top:1px}.orange{color:#d37536}.section-heading h2,.wizard-title-row h2{font:700 29px/1.12 Georgia,serif;letter-spacing:-.8px;margin:0 0 4px}.section-heading p,.wizard-title-row p{color:#486052;font-size:13.2px;line-height:1.42;margin:0}
.faq-section{position:relative;min-height:333px;padding:4px 0 5px}.faq-list{display:grid;gap:7px;margin-top:12px;width:calc(100% - 102px)}.faq-list details{background:#fff;border:1px solid #e7e8e2;border-radius:10px;box-shadow:0 2px 8px #16341b0b;overflow:hidden}.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:6px;min-height:40px;padding:7px 11px;color:#233c35;font-size:12.8px;font-weight:700;cursor:pointer}.faq-list summary::-webkit-details-marker{display:none}.faq-plus{font-size:20px;line-height:1;color:#366a4c;font-weight:400}.faq-list details[open] .faq-plus{transform:rotate(45deg)}.faq-list details p{padding:0 12px 14px;margin:0;font-size:13.5px;line-height:1.5;color:#4b5f56}
.soft-button{border:1px solid #d8e6d5;background:#edf4ea;color:#2c5f45;font-weight:700;border-radius:26px;padding:10px 15px;display:inline-flex;gap:10px;align-items:center;font-size:12.9px;box-shadow:0 2px 6px #17331e08}.soft-button:hover{background:#dfebdc}.soft-button svg,.text-button svg{width:16px;height:16px}.faq-section>.soft-button{margin-top:12px}.faq-cat{position:absolute;width:108px;height:auto;right:0;bottom:0;pointer-events:none;object-fit:contain}.faq-note{position:absolute;right:7px;top:8px;width:87px;text-align:center;transform:rotate(-10deg);color:#a47a5b;font:italic 13px/1.2 Georgia,serif;pointer-events:none}
.wizard-section{position:relative;isolation:isolate;overflow:hidden;min-height:333px;background:linear-gradient(125deg,#eaf3e8,#e0edda);border-radius:29px;padding:19px 19px 17px}.wizard-title-row{display:flex;align-items:flex-start;gap:11px}.wizard-title-row .wizard-book{height:44px;width:44px;margin-top:1px}.wizard-sparkle{margin-left:auto;font:30px Georgia,serif;color:#c77757}.wizard-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:14px}.wizard-steps>div{position:relative;display:flex;align-items:center;flex-direction:column;text-align:center;padding:33px 11px 12px;background:#fff;border-radius:23px;min-height:171px}.wizard-steps svg{height:31px;width:31px;margin-bottom:6px;color:#1e4140}.wizard-steps h3{font:700 16px/1.15 Georgia,serif;margin:0 0 6px}.wizard-steps p{font-size:13.2px;line-height:1.34;color:#465b53;margin:0}.step-index{position:absolute;top:8px;left:9px;border-radius:50%;height:27px;width:27px;display:grid;place-items:center;font-size:13px;color:white;font-weight:700}.step-green{background:#507c58}.step-orange{background:#e18c37}.step-red{background:#d78387}.wizard-start{display:flex;margin:13px auto 0;padding:10px 22px;font-size:13px;z-index:2;position:relative}.wizard-start svg{width:17px;height:17px}.wizard-cat{position:absolute;right:0;bottom:0;width:115px;height:auto;pointer-events:none}.paw-decor{position:absolute;bottom:14px;left:23px;color:#7d9c7b;transform:rotate(-25deg)}.paw-decor svg{width:35px;height:35px;stroke-width:2}
/* Editorial cards — no distorted crops, captions always real HTML text. */
.article-section{margin-top:23px;padding-bottom:45px}.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:11px}.text-button{background:transparent;border:0;color:#274639;display:inline-flex;align-items:center;gap:7px;font-size:13px;font-weight:700;white-space:nowrap}.article-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.article-card{background:white;overflow:hidden;border-radius:15px;box-shadow:0 6px 20px #1e362015;min-height:280px;display:flex;flex-direction:column}.article-picture{height:124px;position:relative}.article-picture img{display:block;width:100%;height:100%;object-fit:cover;object-position:center 45%;filter:saturate(1.08)}.article-category{position:absolute;bottom:-10px;left:12px;border-radius:22px;padding:5px 9px;font-size:10px;font-weight:800;background:#e8f2e6;color:#315c43}.article-category.verzorging{background:#dfeafe;color:#3b6185}.article-category.problemen{background:#ffe7d4;color:#a05b36}.article-category.producten{background:#ffe4dd;color:#a45b4d}.article-text{display:flex;flex:1;flex-direction:column;padding:18px 14px 15px}.article-text h3{font:700 17.2px/1.17 Georgia,serif;margin:0 0 7px;letter-spacing:-.2px}.article-text p{font-size:13.5px;line-height:1.42;color:#53675d;margin:0 0 10px}.article-text button{margin-top:auto;align-self:flex-start;display:inline-flex;background:none;border:0;padding:0;color:#b65d38;font-size:13px;font-weight:700}
.filter-status{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:10px 14px;margin:0 0 14px;background:#eaf2e6;border-radius:12px;font-size:13px}.filter-status[hidden]{display:none}.filter-status button{background:white;border:0;border-radius:25px;color:#2c5c45;padding:7px 10px;font-weight:700;font-size:12px}.preview-disclaimer{margin:13px 2px 0;color:#718278;font-size:11.5px}
/* Signature, layered and friendly footer; no dummy social-media accounts. */
.site-footer{position:relative;margin-top:28px;background:linear-gradient(165deg,#dcebd8 0%,#d3e3ce 59%,#aec8a9 100%);color:#2b503f;isolation:isolate}.footer-wave{position:absolute;top:-72px;left:0;right:0;height:73px;pointer-events:none}.footer-wave svg{display:block;width:100%;height:100%;stroke:none}.footer-leaves{position:absolute;z-index:-1;opacity:.9;width:145px;height:auto;pointer-events:none}.footer-leaves-left{left:0;bottom:0}.footer-leaves-right{right:0;bottom:-13px;transform:scaleX(-1)}
.footer-main{display:grid;grid-template-columns:1.35fr .8fr .85fr 1fr;gap:23px;padding-top:31px;padding-bottom:21px;position:relative}.footer-brand{padding-top:5px}.footer-brand .brand-logo{width:62px;height:69px}.footer-brand .brand strong{font-size:26px}.footer-brand p{font-size:13px;margin:8px 0 0 70px}.footer-col{display:flex;flex-direction:column;align-items:flex-start;gap:6px;padding-top:8px}.footer-col h3{font-size:13.5px;margin:0 0 3px;color:#2a4338}.footer-col a,.footer-col button{background:none;border:0;padding:0;font-size:12.7px;color:#486658;text-align:left}.footer-col a:hover,.footer-col button:hover{text-decoration:underline}
.footer-message{position:relative;height:162px;min-width:220px}.footer-speech{position:absolute;left:-2px;top:0;display:grid;place-items:center;text-align:center;width:145px;height:100px;border-radius:50%;background:#c5d8d8;color:#315049;font:italic 17px/1.22 Georgia,serif;transform:rotate(-8deg);box-shadow:0 3px 12px #526f5812}.footer-cat{position:absolute;width:260px;max-width:none;right:-25px;bottom:-15px;pointer-events:none}.footer-bottom{position:relative;display:flex;justify-content:space-between;gap:12px;border-top:1px solid #b2cba9;padding-top:10px;padding-bottom:13px;color:#506e57;font-size:11.5px}
/* Interactive elements carried over from V3.6 */
.modal[hidden]{display:none}.modal{position:fixed;inset:0;z-index:100;display:grid;place-items:center;padding:18px}.modal-backdrop{position:absolute;inset:0;background:#10241fc0}.modal-panel{position:relative;z-index:1;outline:0;max-width:600px;width:100%;max-height:min(85vh,850px);overflow:auto;padding:28px;background:#fffdf9;border-radius:22px;box-shadow:0 30px 100px #0b1a186b}.modal-close{position:absolute;top:14px;right:14px;width:36px;height:36px}.modal-panel h2{margin:9px 35px 13px 0;font:700 27px/1.18 Georgia,serif}.modal-panel p{font-size:15px;line-height:1.55;color:#435e50}.modal-tag,.wizard-progress{color:#8a613f;font-size:11px;font-weight:800;letter-spacing:1.1px}.modal-actions{display:flex;gap:9px;flex-wrap:wrap;margin-top:17px}.modal-actions button,.wizard-options button,.modal-back{padding:11px 14px;background:#eaf3e6;color:#27563e;border:1px solid #d5e4d2;border-radius:11px;font-weight:700;font-size:14px}.modal-actions button:hover,.wizard-options button:hover,.modal-back:hover{background:#d9ead4}.wizard-options{display:grid;gap:10px;margin:20px 0 14px}.wizard-options button{text-align:left;background:#fff}.wizard-result{background:#eff5eb;border-radius:13px;padding:13px 17px}.wizard-result p{margin:6px 0 10px}.wizard-footer-note{margin-top:19px;font-size:12px!important;color:#647569!important}.notice.urgent{background:#fff0e5;color:#7f3e2b;border-left:4px solid #c66549;padding:12px;border-radius:7px}
@media(max-width:1070px){.container{width:calc(100% - 40px)}.main-nav{gap:12px}.main-nav a{font-size:12px}.brand strong{font-size:24px}.topic-grid{gap:11px}.topic-copy{padding-inline:12px}.topic-copy h2{font-size:18.7px}.faq-list{width:calc(100% - 100px)}}
@media(max-width:830px){.header-inner{min-height:66px}.menu-button{display:grid}.main-nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;gap:0;align-items:stretch;margin:0;padding:9px 19px 17px;background:#fffdf9;box-shadow:0 11px 25px #203c2c23}.main-nav.open{display:flex}.main-nav a{padding:11px 12px;border-bottom:1px solid #ebf0e6;font-size:14px}.hero{height:380px}.hero-content{padding-top:28px}.hero h1{font-size:clamp(38px,5.4vw,49px)}.hero-image{background-image:linear-gradient(90deg,#f9f7f0 0%,#f9f7f0ec 28%,#f9f7f000 73%),url('assets/hero-v41.webp');background-size:cover;background-position:center}.hero-handnote,.hero-sticker{display:none}.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.topic-photo{height:148px}.topic-card .round-symbol{top:123px}.topic-card{min-height:270px}.help-grid{grid-template-columns:1fr;gap:22px}.faq-section{min-height:320px}.faq-list{width:calc(100% - 112px)}.wizard-section{min-height:320px}.article-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.footer-main{grid-template-columns:1.25fr 1fr 1fr}.footer-message{grid-column:1/-1;height:130px;justify-self:end;margin-top:-12px}.footer-cat{right:0;width:225px}.footer-speech{left:-110px;top:0}}
@media(max-width:570px){.container{width:calc(100% - 28px)}.header-inner{min-height:62px}.brand-logo{width:41px;height:45px}.brand strong{font-size:21px}.brand em{font-size:7px;letter-spacing:.35px}.icon-button{width:38px;height:38px}.hero{height:626px;border-radius:0 0 23px 23px}.hero-image{background-image:url('assets/hero-v41.webp');background-size:auto 100%;background-position:right bottom;inset:auto 0 0;height:48%;mask-image:linear-gradient(to bottom,transparent 0%,#000 35%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,#000 35%)}.hero-content{padding-top:26px}.hero h1{font-size:clamp(34px,9vw,44px);letter-spacing:-1px;line-height:1.07;margin-bottom:12px}.hero-lead{font-size:14.5px;line-height:1.46;max-width:370px}.search-form{height:53px;padding-left:13px}.search-form input{font-size:13px}.search-submit{height:41px;min-width:87px;padding:0 12px}.popular-searches{font-size:11.5px;gap:5px}.popular-searches button{font-size:11.5px;padding:5px 8px}.topic-section{margin-top:14px}.topic-grid{gap:10px}.topic-card{min-height:254px;border-radius:15px}.topic-photo{height:108px}.topic-card .round-symbol{top:86px;left:9px;height:41px;width:41px}.round-symbol svg{width:21px;height:21px}.topic-copy{padding:26px 11px 13px}.topic-copy h2{font-size:17px}.topic-copy p{font-size:13px;line-height:1.39}.read-link{font-size:12px}.help-grid{margin-top:23px;gap:19px}.faq-section{min-height:0;padding:0}.faq-list{width:100%}.faq-note,.faq-cat{display:none}.faq-list summary{min-height:44px;font-size:13px}.section-heading h2,.wizard-title-row h2{font-size:26px}.wizard-section{min-height:0;padding:19px 15px;border-radius:25px}.wizard-title-row{gap:9px}.wizard-title-row .wizard-book{width:38px;height:38px}.wizard-title-row p{font-size:12.8px}.wizard-steps{grid-template-columns:1fr;gap:9px}.wizard-steps>div{min-height:92px;display:grid;grid-template-columns:34px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left;padding:13px 12px 13px 49px;column-gap:9px}.wizard-steps svg{grid-column:1;grid-row:1/3;margin:0}.wizard-steps h3{grid-column:2;grid-row:1;font-size:16px}.wizard-steps p{grid-column:2;grid-row:2;font-size:13.5px}.wizard-cat,.paw-decor{display:none}.article-section{margin-top:24px;padding-bottom:36px}.article-grid{gap:10px}.article-picture{height:106px}.article-card{min-height:272px}.article-text{padding:17px 11px 13px}.article-text h3{font-size:15.8px}.article-text p{font-size:12.8px}.section-title-row{align-items:flex-start}.text-button{white-space:normal;max-width:110px;text-align:right;font-size:12px}.footer-main{grid-template-columns:1fr 1fr;gap:24px 14px;padding-top:24px}.footer-brand{grid-column:1/-1}.footer-col a,.footer-col button{font-size:13px}.footer-message{display:none}.footer-bottom{font-size:10.5px}.footer-leaves{width:90px;opacity:.6}}
@media(max-width:375px){.brand strong{font-size:18.5px}.brand em{font-size:6px}.hero h1{font-size:34px}.hero{height:652px}.topic-copy h2{font-size:15.8px}.topic-copy p{font-size:12.4px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important;animation:none!important}}

/* V4.2: goedgekeurde bovenkant. Eén gerichte top-sectie, geen oude V4.1 overrides. */
:root { --ink:#102d35; --green:#346844; --sage:#648762; }
/* Consistente, gecentreerde 1160px canvas op alle desktopbreedtes. */
.site-header,.hero,.site-footer{width:100%;max-width:1160px;margin-inline:auto}
.site-header{background:#fffdfa;box-shadow:0 2px 12px rgba(33,57,35,.055)}
.header-inner{min-height:74px}
.brand{gap:6px}.brand-logo{width:56px;height:57px}
.brand strong{font:800 28px/1.03 'Trebuchet MS',Arial,sans-serif;letter-spacing:-1.35px;color:#0c2834}
.brand strong span{color:#d07442}.brand strong small{font-size:.55em}
.brand em{font:800 8.5px/1.22 Arial,sans-serif;letter-spacing:1.08px;color:#61726e;margin-top:5px}
.main-nav{gap:21px}.main-nav a{font-size:13.2px}
/* High-resolution photographic hero; headline, search and badges are real HTML. */
.hero{height:390px;overflow:hidden;isolation:isolate;background:#f8f5eb;border-radius:0 0 27px 27px}
.hero-image{inset:0;z-index:-2;background:#f8f5eb url('assets/hero-v42.webp') center center/100% 100% no-repeat;border-radius:0 0 27px 27px}
.hero-soften{display:none}
.hero-content{padding-top:33px}
.hero h1{font:700 clamp(39px,4.25vw,51px)/1.07 Georgia,'Times New Roman',serif;letter-spacing:-1.45px;max-width:580px;margin-bottom:13px;color:#0b2e37}
.hero h1 span{color:#5c825f}
.hero-lead{font-size:15.4px;line-height:1.48;max-width:460px;margin-bottom:18px;color:#17373a}
.search-area{max-width:568px}
.search-form{height:55px;padding:5px 5px 5px 16px;box-shadow:0 6px 19px rgba(38,48,40,.12)}
.search-form input{font-size:14.5px}
.search-submit{min-width:123px;font-size:14px}
.popular-searches{margin-top:11px;gap:6px;font-size:11.5px;max-width:700px}
.popular-searches button{font-size:11.5px;padding:6px 10px;background:#fffdfaed}
.hero-handnote{right:28px;top:32px;font:italic 16px/1.2 Georgia,serif;transform:rotate(-5deg);color:#183937;text-shadow:0 1px 2px #fff7e9}
.hero-handnote span{font-size:13.4px}.hero-sticker{right:16px;bottom:17px;width:105px;height:105px;background:#fff0d3ee;font-size:14px}
.hero-scribble{position:absolute;left:48%;top:38px;font-size:40px;line-height:1;color:#c16e34;transform:rotate(16deg);pointer-events:none}
/* A soft, photographic four-card family, matching the preview's pastel rhythm. */
.topic-section{margin-top:18px}
.topic-grid{gap:16px}
.topic-card{min-height:291px;border-radius:19px;box-shadow:0 5px 20px rgba(35,48,35,.065)}
.topic-photo{height:143px}
.topic-photo img{object-fit:cover;object-position:center center;filter:none}
.topic-card .round-symbol{top:119px;left:15px;width:48px;height:48px;border:3px solid #fff}
.topic-copy{padding:32px 18px 18px}
.topic-copy h2{font-size:21px;margin-bottom:8px;color:#0b2c36}
.topic-copy p{font-size:14px;line-height:1.42;color:#2e4a43;margin-bottom:12px}
.topic-green{background:linear-gradient(#f5f9f0,#eaf4e8)}
.topic-peach{background:linear-gradient(#fff8ec,#fff2dd)}
.topic-blue{background:linear-gradient(#f1f7ff,#e6f0fc)}
.topic-cream{background:linear-gradient(#fff8f2,#fff0e9)}
.read-link{font-size:13.3px;color:#286343}
.topic-card:nth-child(2) .read-link{color:#b85e2b}
.topic-card:nth-child(3) .read-link{color:#285e93}
.topic-card:nth-child(4) .read-link{color:#b85640}
@media(max-width:1070px){
 .brand strong{font-size:24px}.brand em{font-size:7.7px;letter-spacing:.5px}
 .main-nav{gap:12px}.main-nav a{font-size:12px}
 .hero h1{font-size:clamp(39px,4.5vw,50px)}
 .topic-grid{gap:12px}.topic-copy{padding-inline:14px}.topic-copy h2{font-size:19px}
}
@media(max-width:830px){
 .header-inner{min-height:67px}.main-nav a{font-size:14px}
 .hero{height:395px}.hero-content{padding-top:28px}
 .hero-image{background-size:cover;background-position:center 52%}
 .hero h1{font-size:clamp(36px,5.5vw,46px);max-width:515px}
 .hero-lead{font-size:14.4px;max-width:410px}
 .hero-handnote,.hero-sticker,.hero-scribble{display:none}
 .topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
 .topic-card{min-height:278px}.topic-photo{height:145px}.topic-card .round-symbol{top:120px}
}
@media(max-width:570px){
 .brand-logo{width:41px;height:43px}.brand strong{font-size:20px}.brand em{font-size:6.5px;letter-spacing:.3px}
 .hero{height:638px;border-radius:0 0 23px 23px}
 .hero-content{padding-top:26px}
 .hero h1{font-size:clamp(34px,8.6vw,42px);line-height:1.07;letter-spacing:-1px}
 .hero-lead{font-size:14px;line-height:1.48;max-width:380px}
 .hero-image{inset:auto 0 0;height:50%;background-image:linear-gradient(to bottom,rgba(251,248,241,.18),rgba(251,248,241,0) 25%),url('assets/hero-v42.webp');background-size:auto 100%;background-position:92% bottom;mask-image:linear-gradient(to bottom,transparent 0%,black 28%);-webkit-mask-image:linear-gradient(to bottom,transparent 0%,black 28%)}
 .search-area{max-width:none}.search-form{height:52px}.search-submit{min-width:90px;height:41px}.search-form input{font-size:13px}
 .popular-searches{flex-wrap:wrap;max-width:100%;gap:5px}.popular-searches button{font-size:11.5px;padding:5px 8px}
 .topic-grid{gap:10px}.topic-card{min-height:262px}.topic-photo{height:112px}
 .topic-card .round-symbol{top:88px;left:9px;width:43px;height:43px}
 .topic-copy{padding:28px 11px 13px}.topic-copy h2{font-size:17px}.topic-copy p{font-size:13px}.read-link{font-size:12px}
}
@media(max-width:375px){.hero{height:655px}.topic-copy h2{font-size:15.8px}}


/* V4.3 — direct interactieve kattenwijzer op de homepage. */
.wizard-interactive{min-height:0;padding-bottom:22px}
.inline-wizard{position:relative;z-index:1;margin-top:13px;min-height:196px}
.inline-wizard-panel{display:flex;flex-direction:column;gap:10px}
.inline-wizard-progress{display:flex;align-items:center;justify-content:space-between;gap:10px;color:#486b52;font-weight:800;font-size:12px;letter-spacing:.3px}
.inline-wizard-dots{display:flex;gap:5px}
.inline-wizard-dots span{width:23px;height:5px;border-radius:20px;background:#c6d8c4}
.inline-wizard-dots span.is-active{background:#43734d}
.inline-wizard-question{font:700 17px/1.2 Georgia,serif;margin:0;color:#183735}
.inline-wizard-options{display:grid;gap:9px}
.inline-wizard-start-options{grid-template-columns:repeat(3,minmax(0,1fr))}
.inline-wizard-choice{border:1px solid #d4e3d2;background:#fffdfb;border-radius:17px;min-height:142px;padding:13px 9px;display:flex;flex-direction:column;align-items:center;text-align:center;justify-content:center;gap:5px;box-shadow:0 3px 8px #203d2722;color:#183735;transition:background .15s,border-color .15s,transform .15s}
.inline-wizard-choice svg{height:27px;width:27px;color:#315f46}
.inline-wizard-choice strong{font:700 15.5px/1.15 Georgia,serif}
.inline-wizard-choice small{font-size:12.2px;line-height:1.3;color:#53695d}
.inline-wizard-choice:hover,.inline-wizard-answer:hover{background:#f5fbf1;border-color:#90b996;transform:translateY(-1px)}
.inline-wizard-question-options{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.inline-wizard-answer{display:flex;justify-content:space-between;align-items:center;text-align:left;gap:8px;padding:11px 12px;min-height:55px;border:1px solid #d4e3d2;background:#fffdfa;border-radius:13px;font-size:13.2px;font-weight:700;line-height:1.3;color:#263e36}
.inline-wizard-answer svg{height:18px;width:18px;flex:0 0 auto;color:#527e5c}
.inline-wizard-back{align-self:flex-start;border:0;background:transparent;color:#315f46;padding:7px 2px;font-size:13px;font-weight:800;text-decoration:underline;text-underline-offset:3px}
.inline-wizard-result-title{font:700 19px/1.2 Georgia,serif;margin:0}
.inline-wizard-result{background:#fffdfa;border:1px solid #d6e5d4;border-radius:15px;padding:13px 15px;color:#2d4c40}
.inline-wizard-result p{font-size:13.3px;line-height:1.42;margin:0 0 8px}
.inline-wizard-result p:last-child{margin-bottom:0}
.inline-wizard-result strong{font-size:13.6px}
.inline-wizard-result.is-urgent{border-color:#c86e56;background:#fff4ed}
.inline-wizard-urgent{font-weight:800;color:#873d28}
.inline-wizard-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap}
.inline-wizard-primary{border:0;background:#326549;color:white;border-radius:40px;padding:11px 16px;font-size:13px;font-weight:800}
.inline-wizard-primary:hover{background:#244e36}
.inline-wizard-disclaimer{max-width:405px;margin:10px auto 0;text-align:center;font-size:11.6px;line-height:1.35;color:#516c5e}
.wizard-interactive .wizard-cat{width:83px;opacity:.95;z-index:0}
.wizard-interactive .paw-decor{opacity:.4}
@media(max-width:830px){.inline-wizard{min-height:0}.wizard-interactive .wizard-cat{width:80px}}
@media(max-width:570px){
  .wizard-interactive{padding-bottom:17px}
  .inline-wizard-start-options{grid-template-columns:1fr;gap:8px}
  .inline-wizard-choice{min-height:74px;padding:11px 13px;display:grid;grid-template-columns:35px 1fr;grid-template-rows:auto auto;text-align:left;justify-items:start;column-gap:9px}
  .inline-wizard-choice svg{grid-row:1/3;grid-column:1}
  .inline-wizard-choice strong{grid-column:2;font-size:16px}
  .inline-wizard-choice small{grid-column:2;font-size:13px}
  .inline-wizard-question-options{grid-template-columns:1fr}
  .inline-wizard-answer{font-size:14px;min-height:49px}
  .inline-wizard-disclaimer{font-size:12px}
  .wizard-interactive .wizard-cat{display:none}
}
@media(prefers-reduced-motion:reduce){.inline-wizard-choice,.inline-wizard-answer{transition:none}}

/* V4.4 — visuele afwerking. Deze regels zijn opzettelijk beperkt tot de
   hero-handlettering, kattenwijzer, FAQ en footer. De goedgekeurde
   categoriekaarten en maximale breedte van 1160px blijven ongewijzigd. */
:root{--deep-forest:#153d34;--warm-paper:#fffaf2}
/* Small editorial elements remain legible over the actual photo. */
.hero-handnote{
  top:15px;right:16px;min-width:137px;max-width:157px;
  padding:11px 11px 8px;
  font:italic 15.5px/1.26 Georgia,'Times New Roman',serif;
  color:#25463c;background:rgba(255,248,232,.91);
  border:1px solid rgba(255,255,255,.78);
  border-radius:19px 20px 23px 17px;
  box-shadow:0 7px 20px rgba(54,45,27,.13);
  text-shadow:none;transform:rotate(-5deg);
  backdrop-filter:blur(3px);
}
.hero-handnote span{font-size:13.4px}.hero-handnote i{margin-top:2px;color:#bc714f}
/* Clear heading / controls, calmer treatment of illustrations. */
.help-grid{gap:20px;align-items:start}
.faq-section{min-height:350px;padding-top:7px;padding-right:3px}
.faq-list{width:calc(100% - 114px);gap:8px}
.faq-list details{border-color:#dfe7dd;box-shadow:0 3px 11px rgba(34,61,37,.065)}
.faq-list summary{font-size:13.1px;min-height:42px;padding:8px 12px}
.faq-list summary:hover{background:#f7faf5}
.faq-cat{right:-2px;bottom:8px;width:110px;filter:drop-shadow(0 4px 5px rgba(54,86,58,.12))}
.faq-note{
  right:5px;top:8px;width:94px;padding:6px 2px;
  background:rgba(255,249,240,.86);border-radius:45% 55% 49% 51%;
  text-align:center;transform:rotate(-9deg);
  font:italic 13px/1.19 Georgia,serif;color:#9b684c;
}
.faq-note span{color:#b76d4b}
/* A real interactive guide should feel inviting, not like a tiny questionnaire. */
.wizard-section.wizard-interactive{
  min-height:350px;padding:20px 21px 19px;
  border:1px solid #dae9d5;border-radius:30px;
  background:radial-gradient(circle at 75% 7%,rgba(255,255,255,.48),transparent 41%),
             linear-gradient(145deg,#edf5e9 0%,#e2eedc 100%);
  box-shadow:0 5px 20px rgba(48,81,45,.055);
}
.wizard-title-row{gap:12px}
.wizard-title-row .wizard-book{height:45px;width:45px;color:#234b40}
.wizard-title-row h2{font-size:29px}
.wizard-title-row p{font-size:13.2px;color:#496656}
.wizard-sparkle{color:#bd7553}
.inline-wizard{min-height:227px;margin-top:15px}
.inline-wizard-panel{gap:11px}
.inline-wizard-progress{font-size:12.8px;color:#315941;letter-spacing:0}
.inline-wizard-dots{gap:6px}
.inline-wizard-dots span{width:28px;height:6px;background:#bdcfbd}
.inline-wizard-dots span.is-active{background:#38734d}
.inline-wizard-question{font-size:18px;margin:1px 0 1px}
.inline-wizard-options{gap:10px}
.inline-wizard-start-options{grid-template-columns:repeat(3,minmax(0,1fr))}
.inline-wizard-choice{
  min-height:154px;padding:12px 8px 13px;gap:7px;
  border-radius:19px;border-color:#d6e4d3;
  background:linear-gradient(180deg,#fff,#fffdf9);
  box-shadow:0 5px 12px rgba(29,62,36,.09);
}
.inline-wizard-choice svg{
  box-sizing:content-box;width:28px;height:28px;padding:10px;
  border-radius:50%;background:#e5f0e4;color:#366d50;
}
.inline-wizard-choice:nth-child(2) svg{background:#fff0de;color:#b77637}
.inline-wizard-choice:nth-child(3) svg{background:#e8eef7;color:#4f7295}
.inline-wizard-choice strong{font-size:16.2px;line-height:1.18}
.inline-wizard-choice small{font-size:12.7px;line-height:1.38;color:#50665b}
.inline-wizard-choice:hover,.inline-wizard-answer:hover{background:#f7fcf3;border-color:#95b69b;box-shadow:0 7px 17px rgba(29,62,36,.14)}
.inline-wizard-answer{min-height:60px;padding:12px 13px;font-size:13.7px;border-radius:13px}
.inline-wizard-result-title{font-size:20px}
.inline-wizard-result{padding:15px 16px;border-radius:16px}
.inline-wizard-result p{font-size:13.8px;line-height:1.47}
.inline-wizard-result strong{font-size:14px}
.inline-wizard-primary{font-size:13.2px;padding:11px 17px;box-shadow:0 5px 12px #234a3425}
.inline-wizard-back{font-size:13.5px}
.inline-wizard-disclaimer{
  max-width:440px;margin:2px auto 0;padding:8px 11px;
  border-radius:11px;background:rgba(255,255,255,.42);
  color:#385a49;font-size:12.4px;line-height:1.45;
}
.wizard-interactive .wizard-cat{width:88px;right:0;bottom:0;opacity:.94;z-index:0}
.wizard-interactive .paw-decor{color:#9cbb9a;opacity:.5;left:17px;bottom:16px}
/* Refined wave treatment and better footer hierarchy. */
.site-footer{background:linear-gradient(152deg,#dfeeda 0%,#d0e3cb 52%,#adc6a8 100%);color:#274b3c}
.footer-wave{top:-77px;height:78px}
.footer-leaves{opacity:.72;width:147px}
.footer-main{grid-template-columns:1.32fr .72fr .81fr 1.09fr;gap:25px;min-height:239px;padding-top:31px;padding-bottom:30px}
.footer-brand .brand-logo{height:69px;width:63px}
.footer-brand .brand strong{font-size:27px}
.footer-brand p{margin-left:71px;margin-top:8px;font-size:13.3px;color:#43634e;max-width:195px}
.footer-col{gap:8px}
.footer-col h3{font-size:14px;color:#294b3c;margin-bottom:5px}
.footer-col a,.footer-col button{font-size:13.1px;line-height:1.36;color:#3c614d}
.footer-message{height:174px;min-width:220px}
.footer-speech{
  z-index:1;left:-7px;top:4px;width:151px;height:101px;
  background:linear-gradient(135deg,#dedbe7,#cdd7da);
  font-size:16px;color:#31554c;border-radius:51% 49% 53% 47%;
  border:1px solid rgba(255,255,255,.48);
}
.footer-speech span{display:block;margin-top:3px;font-size:20px;color:#bc755d}
.footer-cat{width:258px;right:-26px;bottom:-15px;filter:drop-shadow(0 6px 4px rgba(65,101,65,.12))}
.footer-pawprint{position:absolute;z-index:0;color:#86ac87;opacity:.48;pointer-events:none}
.footer-pawprint svg{height:28px;width:28px;stroke-width:1.6}
.footer-pawprint-one{left:30%;bottom:30px;transform:rotate(-24deg)}
.footer-pawprint-two{right:28%;bottom:42px;transform:rotate(20deg)}
.footer-bottom{font-size:11.6px;border-color:#aac6aa;padding-top:12px;padding-bottom:14px}
@media(max-width:1070px){
  .footer-main{grid-template-columns:1.17fr .8fr .88fr 1fr;gap:15px}
  .footer-brand .brand strong{font-size:23px}
  .footer-brand p{margin-left:68px}
  .footer-cat{width:228px;right:-20px}
}
@media(max-width:830px){
  .faq-section{min-height:330px}
  .faq-list{width:calc(100% - 122px)}
  .wizard-section.wizard-interactive{min-height:0}
  .inline-wizard{min-height:0}
  .footer-main{grid-template-columns:1.25fr 1fr 1fr;gap:22px}
  .footer-message{height:135px;grid-column:1/-1;margin-top:-4px}
  .footer-cat{width:220px;right:0}
  .footer-speech{left:auto;right:190px;top:12px}
}
@media(max-width:570px){
  .hero-handnote{display:none}
  .help-grid{gap:22px}
  .faq-section{min-height:0;padding-right:0}
  .faq-list{width:100%}
  .faq-cat,.faq-note{display:none}
  .faq-list summary{font-size:13.6px;min-height:46px}
  .wizard-section.wizard-interactive{padding:19px 15px 17px;border-radius:24px}
  .wizard-title-row h2{font-size:26px}
  .wizard-title-row p{font-size:12.9px}
  .inline-wizard{min-height:0}
  .inline-wizard-question{font-size:18px}
  .inline-wizard-start-options{grid-template-columns:1fr;gap:9px}
  .inline-wizard-choice{min-height:80px;display:grid;grid-template-columns:49px 1fr;grid-template-rows:auto auto;text-align:left;justify-items:start;column-gap:10px;align-items:center;padding:11px 13px}
  .inline-wizard-choice svg{height:25px;width:25px;padding:9px;grid-column:1;grid-row:1/3}
  .inline-wizard-choice strong{grid-column:2;grid-row:1;font-size:16px;align-self:end}
  .inline-wizard-choice small{grid-column:2;grid-row:2;font-size:13px;align-self:start}
  .inline-wizard-question-options{grid-template-columns:1fr}
  .inline-wizard-answer{font-size:14px;min-height:52px}
  .inline-wizard-result p{font-size:13.8px}
  .inline-wizard-disclaimer{font-size:12.4px;margin-top:10px;padding:9px 10px}
  .wizard-interactive .wizard-cat,.wizard-interactive .paw-decor{display:none}
  .footer-main{grid-template-columns:1fr 1fr;gap:21px 13px;min-height:0;padding-top:25px}
  .footer-brand{grid-column:1/-1}
  .footer-brand .brand strong{font-size:23px}
  .footer-brand p{font-size:13px}
  .footer-message{display:none}
  .footer-leaves{opacity:.4;width:90px}
  .footer-pawprint{display:none}
  .footer-bottom{font-size:10.7px}
}
@media(prefers-reduced-motion:reduce){.inline-wizard-choice,.inline-wizard-answer{transform:none!important}}


/* V4.5 — warmer en rustiger, met bewust compacte footer.
   Aansluitend op de goedgekeurde mockup, zonder de indeling te verbreden.
   Overrides staan hier na de eerdere responsive regels. */
:root{
  --paper:#faf6ef;
  --ink:#213b36;
  --text:#344a3f;
  --muted:#53685a;
  --line:#e8e1d5;
}
body{background:linear-gradient(90deg,#f9f5ee 0%,#fdf9f3 50%,#f9f5ee 100%);color:var(--text)}
.site-header{background:#fffdf8f5;border-bottom-color:#eee6da}
.hero{background:#f5eddf}
.hero-image{filter:saturate(1.035) sepia(.035) contrast(1.015)}
.hero-handnote{background:rgba(255,245,222,.93);border-color:#fff6e7;box-shadow:0 6px 16px rgba(72,52,29,.10)}
.hero-sticker{background:#ffefd2f3}
.popular-searches button{background:#fffcf5f5;border-color:#e8dfd1}
.search-form{background:#fffefa;border-color:#eee4d8}
.topic-green{background:linear-gradient(170deg,#f2f5e9 0%,#e6efdf 100%)}
.topic-peach{background:linear-gradient(170deg,#fff5e6 0%,#fdefdc 100%)}
.topic-blue{background:linear-gradient(170deg,#eff5f8 0%,#e9f0f5 100%)}
.topic-cream{background:linear-gradient(170deg,#fff5ec 0%,#f9ebe3 100%)}
.topic-photo img{filter:saturate(1.04) contrast(1.012)}
.faq-list details{background:#fffdf8;border-color:#e9e3d9}
.faq-list summary:hover{background:#fcf7ef}
.faq-note{background:#fff5e9d9;color:#9e6c4d}
.wizard-section.wizard-interactive{
  background:radial-gradient(circle at 76% 0%,rgba(255,250,237,.75),transparent 47%),
             linear-gradient(142deg,#edf3e6 0%,#e2ebd9 65%,#dbe7d2 100%);
  border-color:#d2dfc9;
  box-shadow:0 7px 20px rgba(66,76,45,.065);
}
.wizard-title-row p{color:#3d5b4b}
.inline-wizard-progress{color:#2f553d;font-size:13.4px}
.inline-wizard-question{color:#233e32;font-size:18.5px}
.inline-wizard-choice{
  background:linear-gradient(180deg,#fffefa,#fffaf4);
  border-color:#e1e2d7;
  box-shadow:0 5px 13px rgba(57,70,45,.085);
}
.inline-wizard-choice strong{font-size:16.3px;color:#243e32}
.inline-wizard-choice small{font-size:13.1px;line-height:1.42;color:#3d5949}
.inline-wizard-answer{background:#fffdf7;border-color:#e2ded3;font-size:14px}
.inline-wizard-result{background:#fffcf6;border-color:#dddcca}
.inline-wizard-result p{font-size:14.1px;color:#324b3d}
.inline-wizard-disclaimer{
  font-size:13.25px;
  line-height:1.46;
  color:#2d4b3a;
  background:rgba(255,250,239,.88);
  border:1px solid rgba(130,158,120,.24);
  border-radius:12px;
  max-width:452px;
  padding:9px 13px;
  margin:8px auto 0;
}
.article-card{background:#fffdf8}
/* Footer: circa een kwart minder verticale ruimte, zonder de sfeer te verliezen. */
.site-footer{margin-top:15px;background:linear-gradient(146deg,#dce9d1 0%,#cbdcbf 56%,#b6d0aa 100%);color:#294c3b}
.footer-wave{top:-49px;height:50px}
.footer-main{gap:17px;min-height:0;padding-top:17px;padding-bottom:10px;grid-template-columns:1.29fr .76fr .87fr 1.02fr;align-items:start}
.footer-brand{padding-top:0}
.footer-brand .brand-logo{width:53px;height:58px}
.footer-brand .brand strong{font-size:24px}
.footer-brand .brand em{font-size:7.5px;letter-spacing:.45px}
.footer-brand p{margin:2px 0 0 58px;font-size:12.8px;color:#3e6048}
.footer-col{gap:5px;padding-top:3px}
.footer-col h3{margin:0 0 3px;font-size:13.8px}
.footer-col a,.footer-col button{font-size:12.9px;line-height:1.27}
.footer-message{height:124px;min-width:200px}
.footer-speech{width:125px;height:79px;left:0;top:2px;background:linear-gradient(138deg,#dfddd9,#cfded1);font-size:14.5px;line-height:1.17}
.footer-cat{width:198px;right:-14px;bottom:-8px}
.footer-leaves{width:112px;opacity:.57}
.footer-pawprint svg{width:19px;height:19px}
.footer-pawprint-one{bottom:17px}.footer-pawprint-two{bottom:26px}
.footer-bottom{padding-top:7px;padding-bottom:8px;border-color:#afc8ac;font-size:11.2px}
@media(max-width:1070px){
  .footer-main{grid-template-columns:1.17fr .85fr .92fr 1fr;gap:14px}
  .footer-brand .brand strong{font-size:22px}
  .footer-brand p{margin-left:57px}
  .footer-cat{width:185px;right:-10px}
}
@media(max-width:830px){
  .inline-wizard-disclaimer{max-width:480px}
  .footer-main{grid-template-columns:1.25fr 1fr 1fr;gap:16px;min-height:0}
  .footer-message{grid-column:1/-1;height:96px;margin-top:-4px}
  .footer-cat{width:170px;right:0}
  .footer-speech{right:150px;left:auto;top:4px}
}
@media(max-width:570px){
  body{background:#faf6ef}
  .hero-image{filter:saturate(1.03) sepia(.025)}
  .inline-wizard-choice strong{font-size:16px}
  .inline-wizard-choice small{font-size:13.3px}
  .inline-wizard-disclaimer{font-size:13.1px;padding:10px 11px;max-width:none}
  .footer-wave{top:-33px;height:34px}
  .footer-main{grid-template-columns:1fr 1fr;gap:17px 13px;min-height:0;padding-top:15px;padding-bottom:12px}
  .footer-brand{grid-column:1/-1}
  .footer-brand .brand strong{font-size:22px}
  .footer-brand p{font-size:12.8px;margin-top:2px}
  .footer-col a,.footer-col button{font-size:13px;line-height:1.34}
  .footer-message{display:none}
  .footer-leaves{width:70px;opacity:.35}
  .footer-bottom{font-size:10.8px;padding:9px 0 11px}
}


/* V4.6 – gerichte afwerking; alle goedgekeurde fotos, kleuren en het grid blijven behouden. */
/* Ontspannen footerillustratie en kleine redactionele verfijning, zonder de footer opnieuw hoog te maken. */
.footer-message{height:118px;min-width:200px}
.footer-cat{width:209px;right:-8px;bottom:-7px;filter:drop-shadow(0 4px 4px rgba(45,80,52,.09))}
.footer-speech{width:122px;height:81px;left:-3px;top:1px;font-size:13.7px;line-height:1.23;
  background:linear-gradient(135deg,#e6e1e5,#d5e1d5);transform:rotate(-5deg);
  box-shadow:0 3px 11px rgba(60,82,60,.09)}
.footer-leaves{opacity:.46}
.footer-col a,.footer-col button{font-size:13.25px;color:#345743}
.footer-brand p{font-size:13.15px;color:#355a43}
.footer-col h3{font-size:13.9px}
/* Clear hierarchy and supporting text; modest size changes do not push other cards around. */
.article-text p{font-size:13.9px;color:#40594c;line-height:1.44}
.article-text button{font-size:13.35px}
.preview-disclaimer{font-size:11.9px;color:#607369}
.inline-wizard-choice{gap:8px}
.inline-wizard-choice strong{line-height:1.24}
.inline-wizard-choice small{line-height:1.43;color:#3e5c4b}
.inline-wizard-disclaimer{border-color:rgba(107,138,98,.28);color:#294737}
/* Softer hand-drawn hero sticker without obscuring the cat. */
.hero-handnote{border-radius:22px 18px 23px 19px;transform:rotate(-4deg);right:13px;top:14px}
/* Align decorative cats to section edges rather than content controls. */
.faq-cat{width:101px;right:-1px;bottom:4px}
.faq-note{right:1px;top:9px}
@media(max-width:1070px){
  .footer-cat{width:193px;right:-8px}
  .footer-speech{left:-1px;top:0}
}
@media(max-width:830px){
  .footer-message{height:106px}
  .footer-cat{width:181px;right:0;bottom:-7px}
  .footer-speech{right:163px;left:auto;top:9px}
}
@media(max-width:570px){
  .footer-message{display:none}
  .footer-col a,.footer-col button{font-size:13.2px}
  .article-text p{font-size:13.2px}
  .inline-wizard-choice{gap:6px}
}

/* V4.7 — tekstuele verfijning zonder de goedgekeurde opbouw te veranderen. */
.hero h1{margin-bottom:9px}
.hero-question{font:700 19px/1.2 Georgia,'Times New Roman',serif;color:#2b5040;margin:0 0 7px;max-width:440px}
.hero-lead{font-size:14.2px;line-height:1.43;max-width:430px;margin-bottom:13px}
/* De nieuwe introductie blijft binnen de hero, met ruimte voor de zoekbalk. */
@media (max-width:830px){
  .hero-question{font-size:18px;max-width:410px}
  .hero-lead{max-width:400px}
}
@media (max-width:570px){
  .hero h1{margin-bottom:10px}
  .hero-question{font-size:18px;line-height:1.22;margin-bottom:7px}
  .hero-lead{font-size:14px;line-height:1.46;max-width:370px;margin-bottom:12px}
}


/* V4.8 — de kernvraag is de hero-hoofdtitel. Alle illustraties en kaartstructuren blijven intact. */
.hero h1 {font-size:clamp(39px,4.05vw,49px);line-height:1.065;max-width:570px;margin-bottom:8px}
.hero h1 span {color:#0d3138}
.hero-question {font-size:20px;line-height:1.22;margin-bottom:7px;max-width:500px;color:#203f39}
.hero-question span {color:#4d815e}
.hero-lead {font-size:14.3px;line-height:1.43;max-width:435px;margin-bottom:12px}
.hero-handnote {right:18px;top:18px;min-width:137px;max-width:153px;transform:rotate(-5deg);padding:15px 11px 10px;font-size:15.3px;line-height:1.22}
.hero-handnote span {font-size:15.2px;color:#386349}
.hero-handnote i {font-size:21px;margin-top:5px}
@media(max-width:830px){
 .hero h1{font-size:clamp(36px,5.35vw,46px);max-width:515px}
 .hero-question{font-size:18.3px;max-width:425px}
 .hero-lead{font-size:14px;max-width:410px}
}
@media(max-width:570px){
 .hero h1{font-size:clamp(33px,8.35vw,41px);max-width:100%;margin-bottom:10px}
 .hero-question{font-size:17px;line-height:1.27;margin-bottom:8px}
 .hero-lead{font-size:13.7px;line-height:1.43;max-width:100%;margin-bottom:13px}
}
@media(max-width:375px){
 .hero h1{font-size:32px}
 .hero-question{font-size:16.2px}
 .hero-lead{font-size:13.4px}
}
@media(max-width:375px){
  .header-inner{gap:5px}
  .brand{gap:4px;min-width:0}
  .brand-logo{width:35px;height:39px;flex:0 0 35px}
  .brand strong{font-size:17px;letter-spacing:-.7px}
  .brand em{font-size:5.35px;letter-spacing:.14px}
  .header-actions{gap:3px}
  .header-actions .icon-button{width:33px;height:33px}
}


/* V4.9 — verfijning: kopaccent, leesbaarheid, micro-interacties en de kattenwijzer.
   Bestaande compositie, 1160px maxbreedte en fotomateriaal blijven ongewijzigd. */
.hero h1 .hero-accent,
.hero h1 span .hero-accent { color:#b76543; font-style:normal; }
/* Meer contrast voor compacte leesteksten, zonder de kaartbreedtes te veranderen. */
.article-text p{color:#345346;font-size:14px;line-height:1.46}
.article-text button{font-size:13.5px;letter-spacing:.01em}
.preview-disclaimer{color:#526b5a}
/* Herkenbare zoekchips: rust in standaardstaat en duidelijke hover/focus/touch-feedback. */
.popular-searches button{
  color:#2c4b3d;background:#fffdf8;
  border-color:#d1ddcd;box-shadow:0 2px 6px rgba(45,65,49,.10);
  transition:background-color .17s ease,border-color .17s ease,box-shadow .17s ease,transform .17s ease;
}
.popular-searches button:hover,
.popular-searches button:focus-visible{background:#e7efe4;border-color:#81a98a;box-shadow:0 3px 10px rgba(42,87,57,.16);transform:translateY(-1px)}
.popular-searches button:active{transform:translateY(0);background:#dce9d8}
/* Kaarten blijven volledig klikbaar; zichtbaar interactief voor muis en toetsenbord. */
.topic-card{
  transition:transform .2s ease,box-shadow .2s ease;
}
.topic-card:hover,
.topic-card:focus-visible{
  transform:translateY(-3px);
  box-shadow:0 11px 27px rgba(35,67,47,.17);
}
.topic-card:focus-visible{outline:3px solid #bb744c;outline-offset:4px}
.article-card{transition:box-shadow .18s ease,transform .18s ease}
.article-card:has(.article-text button:hover),
.article-card:has(.article-text button:focus-visible){box-shadow:0 12px 23px rgba(35,65,42,.14);transform:translateY(-2px)}
/* De kattenwijzer blijft herkenbaar en bruikbaar wanneer de stappen wisselen. */
.inline-wizard-panel{gap:11px}
.inline-wizard-choice strong{line-height:1.28}
.inline-wizard-choice small{color:#355445;line-height:1.44}
.inline-wizard-answer{font-size:13.7px;line-height:1.4}
.inline-wizard-result p{font-size:13.8px;line-height:1.5}
.inline-wizard-result strong{font-size:14px}
.inline-wizard-choice:focus-visible,.inline-wizard-answer:focus-visible,
.inline-wizard-back:focus-visible,.inline-wizard-primary:focus-visible{outline:3px solid #bf7b51;outline-offset:2px}
@media(max-width:570px){
  .article-text p{font-size:13.3px;line-height:1.46}
  .inline-wizard-answer{font-size:14px}
  .popular-searches button:hover{transform:none}
}
@media(prefers-reduced-motion:reduce){
  .topic-card,.article-card,.popular-searches button{transition:none}
  .topic-card:hover,.topic-card:focus-visible,.article-card:has(.article-text button:hover),.article-card:has(.article-text button:focus-visible),.popular-searches button:hover,.popular-searches button:focus-visible{transform:none}
}


/* V4.9.1 — gezamenlijke merkkleur en gerichte verfijning richting ontwerp K.
   Alle foto’s, H1-tekst, functionaliteiten en de gecentreerde 1160px-site blijven behouden. */
:root{--brand-accent:#D07442}
.brand strong span,
.hero h1 .hero-accent,
.hero h1 span .hero-accent{color:var(--brand-accent)}

/* Hero: compacter en beter ritme, zonder kleinere standaardtekst. */
@media(min-width:831px){
  .hero{height:375px}
  .hero-content{padding-top:27px}
  .hero h1{line-height:1.035;letter-spacing:-1.35px;margin-bottom:7px}
  .hero-question{font-size:19.5px;margin-bottom:6px;line-height:1.18}
  .hero-lead{line-height:1.46;margin-bottom:10px}
  .popular-searches{margin-top:9px}
  .hero-handnote{top:17px}
}

/* Categorieën: iets minder lucht, maar minstens dezelfde leesbaarheid. */
@media(min-width:831px){
  .topic-section{margin-top:15px}
  .topic-grid{gap:15px}
  .topic-card{min-height:278px;border-radius:20px}
  .topic-photo{height:139px}
  .topic-card .round-symbol{top:115px}
  .topic-copy{padding:29px 17px 15px}
  .topic-copy h2{margin-bottom:6px}
  .topic-copy p{margin-bottom:10px;line-height:1.43}
}
.topic-card{border:1px solid rgba(137,158,127,.08);box-shadow:0 5px 17px rgba(38,67,44,.075)}
.topic-card:hover,.topic-card:focus-visible{transform:translateY(-3px);box-shadow:0 13px 28px rgba(36,76,48,.145)}
.topic-card .round-symbol{box-shadow:0 3px 9px rgba(34,70,42,.11)}
.topic-card .read-link svg{transition:transform .18s ease}
.topic-card:hover .read-link svg,.topic-card:focus-visible .read-link svg{transform:translateX(3px)}

/* Kattenwijzer: vriendelijke, zacht afgeronde keuzes en rustige voortgang. */
.wizard-section.wizard-interactive{
  border-radius:31px;
  background:radial-gradient(ellipse at 95% 2%,rgba(255,252,244,.68),transparent 44%),linear-gradient(145deg,#ecf4e6 0%,#e3eeda 64%,#dce8d5 100%);
  box-shadow:0 8px 24px rgba(49,87,47,.07);
}
.inline-wizard-dots span{height:6px;border-radius:20px}
.inline-wizard-start-options{gap:9px}
.inline-wizard-choice{
  border-radius:25px 25px 23px 23px;
  border:1px solid rgba(147,174,141,.28);
  background:linear-gradient(164deg,#fffefa,#fffaf2);
  box-shadow:0 5px 15px rgba(34,71,42,.08);
  transition:background-color .18s,box-shadow .18s,transform .18s,border-color .18s;
}
.inline-wizard-choice svg{border-radius:48% 52% 55% 45%}
.inline-wizard-choice strong{font-size:16.3px;line-height:1.23}
.inline-wizard-choice small{font-size:13.15px;line-height:1.4;color:#385748}
.inline-wizard-choice:hover,.inline-wizard-choice:focus-visible{
  border-color:#94ba94;background:#fffdf5;box-shadow:0 10px 19px rgba(39,84,46,.13);transform:translateY(-2px);
}
.inline-wizard-answer{border-radius:17px;background:#fffdf7;box-shadow:0 2px 7px rgba(38,67,40,.045)}
.inline-wizard-result{border-radius:19px}
.inline-wizard-disclaimer{
  position:relative;z-index:1;border:1px solid rgba(121,151,110,.25);
  background:rgba(255,251,241,.88);border-radius:18px;
  font-size:13.15px;line-height:1.42;
}

/* Artikelkaarten: duidelijke uitlijning bij gelijke inhoud, zonder tekst af te kappen. */
.article-text h3{min-height:2.34em}
.article-text p{min-height:2.84em}
.article-text button{color:#A94D2D;font-weight:800}
.article-text button:hover{text-decoration:underline;text-underline-offset:3px}

/* Footer: beperkte decoratie, compact en prettig leesbaar. */
.footer-main{gap:17px;padding-top:15px;padding-bottom:9px}
.footer-wave{height:47px;top:-46px;opacity:.95}
.footer-speech{background:linear-gradient(135deg,#e8e6dd,#d9e1d7);border-color:rgba(255,255,255,.6);box-shadow:0 3px 9px rgba(64,89,66,.075)}
.footer-leaves{opacity:.38}
.footer-col a,.footer-col button{color:#2f5140;font-size:13.25px}
.footer-bottom{padding-top:7px;padding-bottom:8px}

@media(max-width:830px){
  .hero{height:387px}
  .hero-content{padding-top:26px}
  .hero h1{line-height:1.045;margin-bottom:8px}
  .hero-question{line-height:1.22;margin-bottom:7px}
  .hero-lead{margin-bottom:11px}
  .topic-section{margin-top:15px}
  .topic-copy p{line-height:1.44}
}
@media(max-width:570px){
  /* Kleine schermen krijgen voldoende ruimte voor hoofdtekst én kattenfoto. */
  .hero{height:630px}
  .hero-content{padding-top:25px}
  .hero h1{line-height:1.065}
  .topic-card{min-height:260px}
  .topic-photo{height:112px}
  .topic-card .round-symbol{top:88px}
  .topic-copy{padding:28px 11px 13px}
  .topic-copy h2{font-size:17px}
  .topic-copy p{font-size:13.15px}
  .inline-wizard-choice{border-radius:19px;min-height:80px}
  .inline-wizard-choice:hover{transform:none}
  .article-text h3{min-height:0}
  .article-text p{min-height:0}
  .footer-main{padding-top:15px;padding-bottom:10px}
  .footer-wave{height:34px;top:-33px}
}
@media(max-width:375px){.hero{height:648px}}
@media(prefers-reduced-motion:reduce){
  .topic-card .read-link svg{transition:none}
  .topic-card:hover .read-link svg,.topic-card:focus-visible .read-link svg{transform:none}
  .inline-wizard-choice:hover,.inline-wizard-choice:focus-visible{transform:none}
}


/* V4.9.2 — compacter en speelser, met de bestaande interactieve website als basis.
   De H1, logokleur, fotografie, navigatie en adviesroutes blijven behouden. */
:root{--brand-accent:#D07442}

/* De bovenste secties delen een strakker, maar luchtig ritme. */
@media(min-width:831px){
  .hero{height:346px}
  .hero-content{padding-top:20px}
  .hero h1{margin-bottom:6px;line-height:1.035}
  .hero-question{margin-bottom:5px}
  .hero-lead{margin-bottom:9px}
  .popular-searches{margin-top:8px}
  .hero-handnote{top:15px}

  .topic-section{margin-top:14px}
  .topic-grid{gap:14px}
  .topic-card{min-height:254px;border-radius:19px}
  .topic-photo{height:121px}
  .topic-card .round-symbol{top:98px;width:45px;height:45px}
  .topic-card .round-symbol svg{width:22px;height:22px}
  .topic-copy{padding:27px 15px 13px}
  .topic-copy h2{font-size:20.1px;margin-bottom:5px}
  .topic-copy p{font-size:13.8px;line-height:1.42;margin-bottom:8px}
  .read-link{font-size:12.9px}
}

/* FAQ en de echte keuzehulp als één horizontale compositie, met ruimte voor het katje. */
@media(min-width:831px){
  .help-grid{margin-top:16px;gap:17px;grid-template-columns:.94fr 1.14fr}
  .faq-section{min-height:327px;padding-top:3px}
  .faq-list{gap:6px;margin-top:9px}
  .faq-list summary{min-height:37px;padding:6px 11px;font-size:12.95px}
  .faq-section>.soft-button{margin-top:9px;padding:8px 13px}
  .faq-note{top:5px}
  .faq-cat{width:94px;bottom:0}

  .wizard-section.wizard-interactive{min-height:328px;padding:16px 17px 13px}
  .wizard-title-row{gap:10px}
  .wizard-title-row .wizard-book{height:39px;width:39px}
  .wizard-title-row h2{font-size:27px;margin-bottom:3px}
  .wizard-title-row p{font-size:12.95px}
  .inline-wizard{min-height:0;margin-top:10px}
  .inline-wizard-panel{gap:8px}
  .inline-wizard-question{font-size:17.8px;margin:0}
  .inline-wizard-progress{font-size:12.8px}
  .inline-wizard-choice{min-height:127px;padding:10px 7px 9px;gap:5px}
  .inline-wizard-choice svg{width:25px;height:25px;padding:8px}
  .inline-wizard-choice strong{font-size:15.8px;line-height:1.2}
  .inline-wizard-choice small{font-size:12.85px;line-height:1.36}
  .inline-wizard-disclaimer{max-width:500px;margin:7px auto 0;padding:7px 10px;font-size:12.65px;line-height:1.36}
  .wizard-interactive .wizard-cat{width:80px}
  .wizard-interactive .paw-decor{left:12px;bottom:12px}
  .article-section{margin-top:17px}
}

/* Vriendelijke, asymmetrische kaartvormen en levendige maar rustige details. */
.wizard-section.wizard-interactive{
  border-radius:28px 31px 26px 30px;
  background:radial-gradient(circle at 93% 9%,rgba(255,250,229,.86) 0,transparent 29%),
             radial-gradient(circle at 9% 90%,rgba(179,209,165,.40) 0,transparent 33%),
             linear-gradient(145deg,#edf4e8 0%,#e1eedb 65%,#dce8d5 100%);
}
.inline-wizard-choice{position:relative;overflow:hidden;border-radius:22px 24px 21px 25px;background:#fffdf8;box-shadow:0 4px 12px rgba(33,75,48,.07)}
.inline-wizard-choice:nth-child(2){border-radius:25px 21px 25px 20px}
.inline-wizard-choice:nth-child(3){border-radius:21px 25px 22px 23px}
.inline-wizard-choice:before{content:"";position:absolute;top:0;left:24%;right:24%;height:3px;border-radius:0 0 8px 8px;background:rgba(99,155,109,.27)}
.inline-wizard-choice:nth-child(2):before{background:rgba(215,139,72,.31)}
.inline-wizard-choice:nth-child(3):before{background:rgba(102,140,185,.29)}
.inline-wizard-choice:hover,.inline-wizard-choice:focus-visible{box-shadow:0 8px 19px rgba(33,75,48,.12)}
.inline-wizard-disclaimer{box-shadow:0 2px 8px rgba(59,93,56,.045)}

/* Uitgelichte artikelen volgen wat sneller op de keuzehulp, zonder inhoud weg te drukken. */
.article-section .section-title-row{margin-bottom:10px}
.article-card{box-shadow:0 4px 15px rgba(34,69,43,.075)}

/* Tussenmaat: twee categorieën per rij, met wat minder onbenutte hoogte. */
@media(min-width:571px) and (max-width:830px){
  .hero{height:354px}
  .hero-content{padding-top:22px}
  .topic-section{margin-top:14px}
  .topic-grid{gap:12px}
  .topic-card{min-height:260px}
  .topic-photo{height:128px}
  .topic-card .round-symbol{top:104px}
  .topic-copy{padding-top:27px;padding-bottom:13px}
  .help-grid{margin-top:18px;gap:18px}
  .faq-section{min-height:340px}
  .faq-list{gap:6px}
  .faq-list summary{min-height:38px;padding:6px 12px}
  .wizard-section.wizard-interactive{min-height:0;padding:17px 18px 15px}
  .inline-wizard{min-height:0;margin-top:10px}
  .inline-wizard-panel{gap:9px}
  .inline-wizard-choice{min-height:128px;padding:10px}
  .inline-wizard-choice svg{width:26px;height:26px;padding:8px}
  .inline-wizard-disclaimer{margin-top:8px;padding:8px 12px}
  .article-section{margin-top:18px}
}

/* Mobiel blijft tekst vóór de foto komen; de interactie gebruikt royale aanraakvlakken. */
@media(max-width:570px){
  .hero{height:605px}
  .hero-content{padding-top:22px}
  .topic-section{margin-top:12px}
  .topic-grid{gap:9px}
  .topic-card{min-height:253px}
  .topic-photo{height:107px}
  .topic-card .round-symbol{top:83px;width:41px;height:41px}
  .topic-card .round-symbol svg{width:20px;height:20px}
  .topic-copy{padding:27px 10px 11px}
  .topic-copy h2{margin-bottom:6px}
  .topic-copy p{line-height:1.4;margin-bottom:9px}
  .help-grid{margin-top:16px;gap:17px}
  .faq-list{gap:6px;margin-top:9px}
  .faq-list summary{min-height:39px;padding:7px 10px}
  .faq-section>.soft-button{margin-top:9px}
  .wizard-section.wizard-interactive{padding:17px 15px 14px}
  .inline-wizard{margin-top:11px}
  .inline-wizard-panel{gap:8px}
  .inline-wizard-choice{min-height:75px;padding:9px 11px}
  .inline-wizard-disclaimer{margin-top:8px;padding:8px 10px;font-size:12.7px}
  .article-section{margin-top:18px}
}
@media(max-width:375px){
  .hero{height:630px}
  .wizard-title-row{gap:8px}
  .wizard-title-row .wizard-book{height:35px;width:35px}
  .wizard-title-row h2{font-size:24px}
  .wizard-title-row p{font-size:12.5px}
  .wizard-sparkle{position:absolute;right:15px;top:12px;font-size:24px}
  .topic-copy h2{font-size:15.7px}
}
@media(prefers-reduced-motion:reduce){
 .inline-wizard-choice,.topic-card{transition:none}
}
/* De verkorte desktophero vervormt de originele kattenfoto niet. */
@media(min-width:831px){.hero-image{background-size:cover;background-position:center center}}


/* V4.9.3 — duidelijkere populaire zoekonderwerpen, met behoud van de compacte hero.
   Ook bij de iets langere H1 blijft het oranje accent identiek aan het logo. */
.popular-searches{gap:6px;font-size:12.5px;line-height:1.3}
.popular-searches strong{
  font-size:13.25px;
  font-weight:800;
  color:#203d34;
  letter-spacing:.02px;
  margin-right:5px;
}
.popular-searches button{
  font-size:12.1px;
  font-weight:600;
  color:#314a3e;
  padding:5px 9px;
  border-color:#dce5d8;
}
@media(max-width:570px){
  .popular-searches{gap:5px 6px}
  .popular-searches strong{font-size:13px;margin-right:5px}
  .popular-searches button{font-size:12px;padding:5px 8px}
}
@media(max-width:375px){
  .popular-searches strong{font-size:12.7px}
}


/* V4.9.4 — een warmere, beter leesbare homepage met herkenbare zoekinteractie.
   De structuur, de foto's, het logo en de compact gehouden hero blijven behouden. */
:root{--paper:#F7F0E6}
body{background:var(--paper)}
/* Op desktops blijft de VOLLEDIGE populaire onderwerpenrij op een regel.
   Het volledige beschikbare canvas kan benut worden i.p.v. de oude 700px limiet. */
@media(min-width:831px){
  .popular-searches{
    display:flex;flex-wrap:nowrap;max-width:100%;width:max-content;
    gap:5px;margin-top:8px;white-space:nowrap;
  }
  .popular-searches strong{flex:0 0 auto;margin-right:3px}
  .popular-searches button{flex:0 0 auto;padding:5px 8px}
}
@media(min-width:571px) and (max-width:830px){
  .popular-searches{max-width:100%;gap:5px}
  .popular-searches strong{margin-right:2px}
  .popular-searches button{padding-inline:8px}
}
/* Op kleine schermen mag de rij omslaan; geen horizontale overloop of afgekapte chips. */
@media(max-width:570px){
  .popular-searches{max-width:100%;width:100%;flex-wrap:wrap;gap:5px 6px}
  .popular-searches strong{flex:0 0 auto}
  .popular-searches button{font-size:11.8px;padding:5px 7px}
}
/* Subtiel duidelijker ondersteunende teksten; geen reductie in lettergrootte. */
.section-heading p,.wizard-title-row p{color:#385445}
.faq-list summary{color:#203b31}
.faq-list details p{color:#334f41}
.inline-wizard-choice small{color:#315344}
.inline-wizard-progress{color:#31523b}
.inline-wizard-disclaimer{color:#294637}
.article-text p{color:#355345;line-height:1.48}
.article-category{font-size:10.5px}
.footer-col a,.footer-col button{color:#2b4d3a}
.footer-brand p{color:#2c4d3a}
.footer-bottom{color:#345340}
@media(min-width:831px){
  .faq-list summary{font-size:13.2px}
  .inline-wizard-choice small{font-size:13px}
  .footer-col a,.footer-col button{font-size:13.4px}
}
/* Het hele artikel is een echte, toegankelijke link, met één focusdoel. */
.article-card{color:inherit;text-decoration:none;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease}
.article-card:hover,.article-card:focus-visible{
  transform:translateY(-3px);box-shadow:0 10px 26px rgba(37,69,46,.15);
}
.article-card:focus-visible{outline:3px solid #c17d55;outline-offset:3px}
.article-card .article-read-link{
  margin-top:auto;align-self:flex-start;display:inline-flex;
  background:none;border:0;padding:0;color:#a95834;font-size:13.6px;
  font-weight:700;letter-spacing:.005em;
}
.article-card:hover .article-read-link,.article-card:focus-visible .article-read-link{color:#864121;text-decoration:underline;text-underline-offset:3px}
@media(min-width:831px){
  .article-text h3{min-height:2.28em}
}
/* Zoekbalk: zichtbare focus om aan te geven dat het formulier actief is. */
.search-form{transition:border-color .16s ease,box-shadow .16s ease}
.search-form:focus-within{border-color:#739b77;box-shadow:0 0 0 3px rgba(90,143,103,.22),0 6px 19px rgba(38,48,40,.12)}
.search-results a:focus-visible{outline:2px solid #6a996f;outline-offset:-2px;background:#edf5e9}
.search-results a:hover{background:#edf5e9}
@media(prefers-reduced-motion:reduce){
  .article-card,.search-form{transition:none}
  .article-card:hover,.article-card:focus-visible{transform:none}
}


/* V5.1.1 — Zoekresultaten mogen niet door de hero worden afgeknipt
   of achter de categoriekaarten verdwijnen. Afgeronde afbeeldingshoeken
   blijven intact via .hero-image, dat zijn eigen overflow:hidden heeft. */
.hero { overflow: visible; z-index: 10; }


/* V5.7.1: link naar de uitgebreide Kattenwijzer staat in hetzelfde
   informatiekader als de dierenartswaarschuwing; geen dubbele losse link. */
.wizard-interactive .inline-wizard-disclaimer{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:3px;text-align:center;
}
.wizard-interactive .wizard-disclaimer-link{
  position:relative;z-index:2;display:inline-block;max-width:100%;
  color:#2d694b;font-weight:800;text-decoration:underline;
  text-underline-offset:3px;line-height:1.42;
}
.wizard-interactive .wizard-disclaimer-link:hover{color:#a65d36}
.wizard-interactive .wizard-disclaimer-link:focus-visible{
  outline:2px solid #a9633b;outline-offset:3px;border-radius:3px;
}
.wizard-interactive .wizard-disclaimer-warning{display:block;}

.wizard-interactive .wizard-link-tail{white-space:nowrap}