/* Compact, progressive-enhancement Field Notes; no changes to other page layouts. */
.fn-opening{display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;padding-block:38px 30px}
.fn-intro{min-width:0;max-width:780px}
.fn-visual{margin:0 0 24px;max-width:580px}
.fn-visual img{display:block;width:100%;height:auto;aspect-ratio:1672/941;object-fit:contain;border-radius:12px;border:1px solid #d0dcd5}
.fn-visual figcaption{font-size:.75rem;line-height:1.5;color:#506763;margin-block-start:9px;max-width:72ch}
.fn-visual-hero{margin:0;max-width:none}
.fn-opening .fn-intro h1{font-size:clamp(2.3rem,3.8vw,3.5rem)}
@media(max-width:760px){.fn-opening{grid-template-columns:1fr;gap:18px;padding-block:26px 28px}.fn-opening .fn-intro{padding:0}.fn-visual{margin-bottom:20px}.fn-visual-hero{margin:0}.fn-opening .fn-intro h1{font-size:2.5rem}}
.fn-intro h1{font:400 clamp(2.5rem,5vw,4.3rem)/1.1 Georgia,serif;margin:12px 0 18px}
.fn-intro .fn-lead{font-size:1.25rem;color:var(--ink,#173b38);font-weight:600}
.fn-intro p{margin-block:12px;max-width:68ch}
.fn-intro .fn-aside{font-size:.94rem;color:#506763}
.fn-workspace{display:grid;grid-template-columns:210px minmax(0,1fr);gap:32px;align-items:start;padding-block:12px 40px}
.fn-categories{display:grid;gap:5px;position:sticky;top:22px}
.fn-guide{font-size:1.05rem;font-weight:600;color:#173b38;border-inline-start:3px solid #b59045;padding-inline-start:14px;max-width:72ch;margin-block:0 20px}
.fn-categories button{font:inherit;text-align:start;min-height:48px;padding:11px 14px;border:1px solid #bdcdc4;border-radius:10px;background:#fffdf7;cursor:pointer;color:#294c44;box-shadow:0 2px 0 #173b3808}
.fn-categories button:hover{background:#edf1e9;border-color:#63877a}
.fn-categories button[aria-pressed=true]{background:#173f37;color:#fff;border-color:#173f37;font-weight:700;box-shadow:inset 4px 0 #d5b36b}
html[dir=rtl] .fn-categories button[aria-pressed=true]{box-shadow:inset -4px 0 #d5b36b}
.fn-categories button[hidden],.fn-group[hidden]{display:none}
.fn-group{min-width:0;scroll-margin-top:24px}
.fn-group h2{font-size:1.3rem;margin:0 0 15px}
.fn-brand{border:1px solid var(--line,#ccd7d0);border-radius:12px;margin-bottom:10px;background:#fffdf8;overflow:hidden}
.fn-brand>summary{display:flex;align-items:center;gap:16px;padding:14px 16px;min-height:72px;cursor:pointer;font-weight:700;list-style:none}
.fn-brand>summary::-webkit-details-marker{display:none}
.fn-brand>summary:hover{background:#f1f5ee}
.fn-brand>summary>span[dir]{flex:1;min-width:0;font-size:.95rem}
.fn-brand-arrow{color:#527367;font-size:1.25rem}
.fn-brand[open] .fn-brand-arrow{transform:rotate(45deg)}
.fn-logo{width:140px;height:44px;object-fit:contain;flex-shrink:0;background:white;border-radius:4px;padding:4px}
/* Frame excess white canvas only; supplied logo pixels and proportions stay intact. */
.fn-logo[src$="/campbell.png"],.fn-logo[src$="/teltonika.png"]{object-fit:cover;object-position:center}
.fn-group:not([hidden]){animation:fn-category-in .18s ease-out}
@keyframes fn-category-in{from{opacity:.65;transform:translateY(3px)}to{opacity:1;transform:none}}
@media(prefers-reduced-motion:reduce){.fn-group:not([hidden]){animation:none}}
@media(max-width:760px){.fn-logo{width:100px;height:38px}.fn-brand>summary{gap:10px;padding:12px!important}.fn-brand>summary>span[dir]{font-size:.86rem}}
.fn-brand>summary span{display:inline-block;unicode-bidi:isolate}
.fn-models{padding:0 8px 15px 22px}
.fn-model{border-top:1px solid #dce3dc}
.fn-model>summary{padding:13px 4px;min-height:48px;cursor:pointer;font-size:.97rem}
.fn-model>summary bdi{font-weight:600}
.fn-model-chips{display:flex;flex-wrap:wrap;gap:6px;margin-block:6px 14px}
.fn-model-chips bdi{border:1px solid #bdcdc4;border-radius:999px;padding:3px 9px;font-size:.8rem;background:#f1f5ee}
.fn-note .fn-applicability{font-size:.77rem;line-height:1.5;margin-bottom:7px}
.fn-note-panel{max-width:740px;padding:10px 16px 18px;border-inline-start:2px solid #b59045}
.fn-note{margin:0 0 18px}
.fn-note h4{font-size:.72rem;letter-spacing:.07em;color:#40665d;margin:0 0 6px}
.fn-note p{margin:0;max-width:58ch;font-size:1.04rem;line-height:1.65}
.fn-why{font-size:.9rem;color:#506763;margin:0 0 12px}
.fn-detail{font-size:.92rem}
.fn-detail>summary{cursor:pointer;min-height:44px;padding-block:10px;font-weight:600}
.fn-detail ul{padding-inline-start:22px;margin-block:8px}
.fn-detail li{margin-block:7px}
.fn-detail a{overflow-wrap:anywhere;display:inline-block;padding-block:5px;min-height:44px}
.fn-evidence{font-size:.77rem;font-weight:600;color:#40665d;margin-block:10px}
.fn-general{max-width:820px;margin-block:12px 30px;border-top:1px solid #ccd7d0;padding-top:20px}
.fn-general>summary{cursor:pointer;min-height:48px;font-weight:600}
.fn-general .fn-note-panel{margin-top:16px}
.fn-disclaimer{font-size:.85rem;max-width:78ch;color:#506763;padding-block:20px 36px}
.fn-workspace :focus-visible,.fn-general :focus-visible{outline:3px solid #b59045;outline-offset:3px}
html[dir=rtl] .fn-models{padding:0 22px 15px 8px}
html[dir=rtl] .fn-note h4{letter-spacing:0}
@media(max-width:760px){.fn-intro{padding-top:30px}.fn-workspace{grid-template-columns:1fr;gap:24px}.fn-categories{position:static;grid-template-columns:repeat(2,minmax(0,1fr))}.fn-categories button{font-size:.9rem;line-height:1.4}.fn-note-panel{padding-inline:12px}.fn-models{padding-inline:10px}.fn-brand>summary{padding-inline:4px}.fn-intro h1{font-size:2.7rem}}
