*{box-sizing:border-box}body{margin:0;background:#fffcf6;color:#143f30;font:16px/1.6 Arial,sans-serif;--gd-rail:1280px;--gd-gutter:40px;--gd-gap:24px}a{color:inherit;text-underline-offset:4px}button,input{font:inherit}button,a.action{min-height:44px;padding:10px 18px;border:1px solid #315744;border-radius:24px;background:#fff;color:#143f30;cursor:pointer}button:disabled{opacity:.55;cursor:default}button[aria-pressed=true],.primary{background:#143f30;color:white}a.action{display:inline-flex;align-items:center;text-decoration:none}a:focus-visible,button:focus-visible,input:focus-visible{outline:3px solid #b25b10;outline-offset:4px}.rail{max-width:var(--gd-rail);padding-inline:var(--gd-gutter);margin-inline:auto}header{border-bottom:1px solid #d2d8cc}header .rail{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:20px}.brand{font-size:26px;font-weight:800;text-decoration:none}.skip{position:absolute;left:16px;top:-100px}.skip:focus{top:8px;background:white;padding:10px;z-index:2}main{padding-block:32px 56px}h1{font-size:clamp(36px,4vw,48px);line-height:1.08;letter-spacing:-.035em;margin:14px 0 22px}h2{font-size:28px;line-height:1.2}h3{font-size:24px;line-height:1.2}p{max-width:70ch}.eyebrow,.small{font-size:14px}.intro{font-size:18px}.notice{padding:16px 20px;border-left:4px solid #6f8049;background:#edf0e5;margin:24px 0}.notice p{margin:0}.actions,.tabs{display:flex;flex-wrap:wrap;gap:12px;margin:20px 0}.layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:32px;align-items:start}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.layout .grid{grid-template-columns:repeat(2,minmax(0,1fr))}.card{border:1px solid #d8dace;border-radius:16px;overflow:hidden;background:#fff}.card-body{padding:20px}.card h3{margin:8px 0 12px}.card p{margin:8px 0}.art{aspect-ratio:1;display:flex;justify-content:center;align-items:center;background:#f5e8da}.front{width:64%;aspect-ratio:3/4;overflow:hidden}.front img{display:block;width:100%;height:100%;max-width:none;object-fit:contain}.counter{display:flex;align-items:center;gap:8px;margin:16px 0}.counter button{width:44px;padding:8px;border-radius:50%}.counter input{width:58px;min-height:44px;text-align:center;border:1px solid #607c6c;border-radius:8px}.summary{border:1px solid #aebca8;border-radius:16px;background:#f1f3e9;padding:24px}.summary h2{margin-top:0}.summary h3{font-size:20px}.summary ul{padding-left:20px}.summary li{margin-bottom:8px}.summary fieldset{border:0;padding:0;margin:24px 0}.summary legend{font-weight:bold}.radio{display:flex;gap:10px;align-items:center;min-height:44px}.radio input{width:20px;height:20px;flex:none}.summary button{width:100%}footer{border-top:1px solid #d2d8cc;padding-block:24px}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}[hidden]{display:none!important}#raw-warning{font-size:14px}.concept .art{max-height:280px}.concept .card-body{display:flex;flex-direction:column;height:100%}details{margin-top:24px;border-top:1px solid #d2d8cc}summary{cursor:pointer;min-height:48px;padding-block:12px}@media(max-width:1099px){.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.layout{grid-template-columns:1fr}.summary{max-width:none}}@media(max-width:700px){body{--gd-gutter:20px}header .rail{align-items:start;gap:12px}.brand{font-size:23px}h3{font-size:20px}}@media(max-width:599px){.grid,.layout .grid{grid-template-columns:1fr}.art{max-height:330px}.card .front{max-width:230px}.summary{padding:20px}}@media(max-width:360px){body{--gd-gutter:16px}}
/* Match the shared Good Dog rail/type contract, without changing existing pages. */
@media(max-width:900px){body{--gd-gutter:24px}}
@media(max-width:760px){body{--gd-gutter:20px;--gd-gap:16px}.grid{gap:var(--gd-gap)}}
@media(max-width:360px){body{--gd-gutter:16px}}

/* Shop-only compact header, using the existing Food logo. */
header .rail{flex-wrap:wrap;gap:12px 24px}header .brand{display:inline-flex;align-items:center;gap:8px;min-height:44px}header .brand img{display:block;width:116px;height:32px}header nav{display:flex;flex-wrap:wrap;gap:8px}header nav .action{padding:10px 12px}