/* C3D Studio — shared base styles (complements Tailwind utilities) */
html, body { margin: 0; padding: 0; }
body { overscroll-behavior: none; }
main > :first-child { margin-top: 0 !important; }
main > :last-child { margin-bottom: 0 !important; }
::-webkit-scrollbar { display: none; }

/* The hidden attribute must always win over Tailwind display utilities (flex, grid, block…)
   — used by the portfolio filters and the Practice Yard bays. */
[hidden] { display: none !important; }

/* Header nav: hair-thin underline that grows from the centre */
.nav-link { position: relative; padding-bottom: 2px; }
.nav-link::after {
  content: ""; position: absolute; left: 50%; right: 50%; bottom: -2px;
  height: 1px; background: currentColor;
  transition: left .35s ease-out, right .35s ease-out;
}
.nav-link:hover::after, .nav-link[aria-current="page"]::after { left: 0; right: 0; }

/* Mobile menu panel */
#mobile-menu { transition: opacity .3s ease-out, visibility .3s; }
#mobile-menu[data-open="false"] { opacity: 0; visibility: hidden; }
#mobile-menu[data-open="true"]  { opacity: 1; visibility: visible; }

/* Bottom-rule form fields */
.field-line { border: 0; border-bottom: 1px solid #cac6bd; border-radius: 0; background: transparent; }
.field-line:focus { outline: none; border-bottom: 1.5px solid #292826; }
select.field-line { appearance: none; background-image: linear-gradient(45deg, transparent 50%, #7a776f 50%), linear-gradient(135deg, #7a776f 50%, transparent 50%); background-position: calc(100% - 10px) 55%, calc(100% - 5px) 55%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 1.5rem; }

/* Journal filter chips */
.chip[aria-pressed="true"] { background: #292826; color: #fcf9f4; border-color: #292826; }

/* Subtle reveal for sections */
@media (prefers-reduced-motion: no-preference) {
  .reveal { opacity: 0; transform: translateY(12px); transition: opacity .9s ease-out, transform .9s ease-out; }
  .reveal.is-visible { opacity: 1; transform: none; }
}

/* Practice Yard bay explorer */
.bay-tab:hover { background: #f0ede9; }
.bay-tab[aria-selected="true"] { background: #292826; }
.bay-tab[aria-selected="true"] span { color: #fcf9f4; }
.bay > summary::-webkit-details-marker { display: none; }
.bay[open] .bay-chevron { transform: rotate(180deg); }