/* =========================================================
   RESPONSIVE.CSS
   화면 크기에 따른 전체 청첩장 반응형 보정
========================================================= */


/* =========================================================
   1. Desktop / Tablet Preview
   700px 이상에서는 청첩장을 하나의 카드처럼 표시
========================================================= */

@media (min-width: 700px) {

  body {
    padding: 26px 0;
  }

  .invitation {
    border-radius: 22px;
  }

}


/* =========================================================
   2. Small Mobile
   360px 이하 작은 휴대폰 대응
========================================================= */

@media (max-width: 360px) {

  /*
    작은 휴대폰에서는 전체 좌우 여백을 조금 줄임
  */
  :root {
    --page-padding: 20px;

    --section-padding-y:
      clamp(64px, 18vw, 78px);
  }



}