/* Hallmark · component: portfolio actions · theme: zzz light exhibition · genre: editorial · states: 8 · v2.0.0 */
/* Hallmark · critique: the frosted surface appears only when invited; quiet labels at rest and unchanged geometry. */
:root{
 --hero-frost-surface:rgba(255,255,255,.38);
 --hero-frost-top:rgba(255,255,255,.57);
 --hero-frost-edge:rgba(255,255,255,.80);
 --hero-frost-shadow:rgba(42,53,50,.10);
 --hero-frost-inner:rgba(42,53,50,.04);
}
@media(min-width:701px) and (hover:hover) and (pointer:fine){
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:not(:disabled){
  background:var(--transparent);border-color:var(--transparent);box-shadow:none;
  backdrop-filter:none;-webkit-backdrop-filter:none;transform:none;
  transition:box-shadow 620ms var(--interaction-ease),border-color 620ms var(--interaction-ease);
 }
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action::before{
  content:'';display:block;position:absolute;inset:0;z-index:-1;pointer-events:none;border-radius:inherit;
  background:linear-gradient(to bottom,var(--hero-frost-top),var(--hero-frost-surface));
  backdrop-filter:blur(18px) saturate(85%);-webkit-backdrop-filter:blur(18px) saturate(85%);
  opacity:0;transform:none;transition:opacity 620ms var(--interaction-ease);
 }
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action::after{display:none}
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:not(:disabled):hover{
  background:var(--transparent);border-color:var(--hero-frost-edge);transform:none;
  box-shadow:inset 0 1px 0 var(--hero-frost-edge),inset 0 -1px 2px var(--hero-frost-inner),0 5px 16px var(--hero-frost-shadow);
 }
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:hover::before{opacity:1;transform:none}
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:active{transform:none}
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:focus-visible{outline:2px solid var(--color-focus);outline-offset:5px}
 @media(prefers-reduced-motion:reduce){
  body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:not(:disabled),
  body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action::before{transition:none}
 }
}

/* Visible at rest; the frosted layer remains exclusive to hover. */
:root{--hero-button-rest:rgba(255,255,255,.38);--hero-button-outline:rgba(65,76,73,.17);--hero-button-rest-shadow:rgba(42,53,50,.05)}
@media(min-width:701px) and (hover:hover) and (pointer:fine){
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:not(:disabled){background:var(--hero-button-rest);border-color:var(--hero-button-outline);box-shadow:0 2px 8px var(--hero-button-rest-shadow)}
 body :is(.header .nav-contact,.intro-description .detailed-portfolio).glass-action:not(:disabled):hover{background:var(--transparent);border-color:var(--hero-frost-edge);box-shadow:inset 0 1px 0 var(--hero-frost-edge),inset 0 -1px 2px var(--hero-frost-inner),0 5px 16px var(--hero-frost-shadow)}
}