/* Depth layer: dimensional buttons, soft light & shadow */
:root{--sh-1:0 1px 2px #092e2714,0 2px 6px #092e2712;--sh-2:0 2px 4px #092e2714,0 8px 18px #092e2718;--sh-3:0 4px 8px #092e2714,0 16px 32px #092e2720;--hl:inset 0 1px 0 #ffffff38;--ease:cubic-bezier(.22,1,.36,1)}
.button{position:relative;border-radius:8px;background:linear-gradient(180deg,#1a5646 0%,#103d32 55%,#0b2e26 100%);border-color:#0b2e26;box-shadow:var(--hl),inset 0 -2px 0 #00000026,var(--sh-1);text-shadow:0 1px 1px #00000040}
.button:hover{background:linear-gradient(180deg,#1f634f 0%,#14473a 55%,#0d3329 100%);box-shadow:var(--hl),inset 0 -2px 0 #00000026,var(--sh-3);transform:translateY(-3px)}
.button:active{transform:translateY(1px) scale(.98);box-shadow:inset 0 3px 8px #00000045,0 1px 2px #092e2720}
.button:focus-visible,.text-link:focus-visible,.btn:focus-visible{outline:3px solid #c28a5688;outline-offset:3px}
.button.secondary{background:linear-gradient(180deg,#fff 0%,#f3f1ea 100%);color:var(--forest);border-color:#cfd3c7;text-shadow:none;box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #0000000d,var(--sh-1)}
.button.secondary:hover{background:linear-gradient(180deg,#fff 0%,#e9eddf 100%);box-shadow:inset 0 1px 0 #fff,inset 0 -2px 0 #0000000d,var(--sh-2)}
.button.on-dark{background:linear-gradient(180deg,#fff 0%,#ece8dc 100%);border-color:#ffffff;color:var(--forest);text-shadow:none;box-shadow:inset 0 -2px 0 #0000001a,0 4px 14px #00000030}
.button.on-dark:hover{background:linear-gradient(180deg,#fff 0%,#e3e8d6 100%);box-shadow:inset 0 -2px 0 #0000001a,0 10px 24px #00000040}
.site-header{box-shadow:0 1px 0 #ffffffb0 inset,0 6px 24px #092e270f}
.site-header nav>a.nav-contact{background:linear-gradient(180deg,#fff,#f1efe7);border-color:#cfd3c7;border-radius:8px;box-shadow:inset 0 1px 0 #fff,var(--sh-1);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}
.site-header nav>a.nav-contact:hover{transform:translateY(-2px);box-shadow:inset 0 1px 0 #fff,var(--sh-2);color:var(--forest)}
.photo-frame{box-shadow:var(--sh-2)}
.image-tab{box-shadow:var(--sh-2),inset 0 1px 0 #fff}
.progress-card,.reference-card,.recognition-card,.journal-card .photo-frame{transition:transform .45s var(--ease),box-shadow .45s var(--ease)}
.reference-card,.recognition-card{background:linear-gradient(180deg,#fff,#fbfaf6);border-radius:var(--radius);box-shadow:inset 0 1px 0 #fff,var(--sh-1)}
.reference-card:hover,.recognition-card:hover{box-shadow:inset 0 1px 0 #fff,var(--sh-3)}
@media(prefers-reduced-motion:reduce){.button:hover,.button:active,.site-header nav>a.nav-contact:hover{transform:none!important}}
