/* Responsive refinements for 1920×1080 displays, laptops, tablets, and phones. */
img{max-width:100%}
@media(min-width:1600px) and (min-height:850px){
  .wrap{width:min(1420px,calc(100% - 96px))}
  .header{min-height:92px}
  .hero{padding:96px 0 76px;max-width:980px}
  .hero h1{font-size:7.2rem}
  .section{padding:92px 0}
  .section h2{font-size:4.5rem}
  .grid{gap:28px}
  .shop-grid{grid-template-columns:repeat(2,1fr)}
  .card{min-height:300px;padding:36px}
  .tattoo-page{padding:88px 0;grid-template-columns:1.15fr .85fr}
  .chrissy-photo{max-width:480px;justify-self:end}
  .tattoo-details{gap:110px}
  body:has(.page){padding:28px}
  .page{width:min(100%,980px);padding:46px 64px}
  .logo-wrap{width:300px;margin-bottom:20px}
  .page h1{font-size:5.8rem}
  .page .divider{margin:26px auto}
  .page .copy{max-width:650px}
  .page .button-row{margin-top:28px}
  .page footer{margin-top:32px}
}
@media(max-width:1000px){
  .wrap{width:min(calc(100% - 48px),900px)}
  .header{gap:30px}
  .nav{gap:16px;flex-wrap:wrap;justify-content:flex-end}
  .hero{padding:84px 0 64px}
  .grid{grid-template-columns:repeat(2,1fr)}
  .tattoo-page{gap:54px}
}
@media(max-width:760px){
  .wrap{width:calc(100% - 32px)}
  .header{align-items:flex-start;padding:18px 0}
  .brand{font-size:.68rem;letter-spacing:.12em}
  .mark{width:42px;height:42px}
  .nav{font-size:.62rem;gap:12px 16px}
  .hero{padding:64px 0 48px}
  .hero h1{font-size:clamp(3rem,15vw,5rem);line-height:.92}
  .hero p,.intro,.card p,.copy p{font-size:1rem}
  .section{padding:64px 0}
  .section h2{font-size:clamp(2.35rem,11vw,3.8rem)}
  .grid,.shop-grid,.tattoo-page,.tattoo-details,.review-grid{grid-template-columns:1fr}
  .card{min-height:0;padding:26px}
  .tattoo-page{gap:46px}
  .chrissy-photo{max-width:480px}
  .tattoo-details{gap:14px}
  footer{flex-direction:column;align-items:flex-start}
}
@media(max-width:560px){
  body:has(.page){padding:16px 12px}
  .page{padding:34px 24px}
  .logo-wrap{width:min(68vw,270px)}
  .site-links{gap:12px 18px}
}
@media(max-width:480px){
  .header{display:block}
  .nav{justify-content:flex-start;margin-top:18px}
  .button{width:100%;justify-content:center}
  .card .symbol{height:72px}
}
