html:focus-within{
  scroll-behavior:smooth; /* Enable smooth scrolling when an element within the document is focused */
}

html {
  scroll-behavior: smooth;
}

*, *::before, *::after{
    margin: 0; /* Remove default margin */
    padding: 0; /* Remove default padding */
    box-sizing: border-box; /* Include padding and border in element's total width and height */
}

body {
    display: flex; /* Use flexbox layout */
    flex-direction: column; /* Stack children vertically */
    min-height: 100vh; /* Ensure body takes at least full viewport height */
    font-family: "Crimson Pro", "Cormorant Garamond", "Poppins", serif;
                   
    text-rendering: optimizeLegibility; /* Improve text rendering */
    -webkit-font-smoothing: antialiased; /* Enable font smoothing */
    line-height: 1.5; /* Improve line height */
}

main {
    flex: 1; /* Allow main to grow and fill available space */
    display: flex; /* Use flexbox layout */
    flex-direction: column; /* Stack children vertically */
}

img, picture, video, canvas, svg{
  display:block; /* Ensure media elements are block-level */
  max-width:100%;  /* Ensure media elements are responsive */
}

input, button, textarea, select{
  font:inherit; /* Ensure form elements inherit font styles */
}

button{
  background:none; /* Remove default background */
  border:none; /* Remove default border */
  padding:0; /* Remove default padding */
  color:inherit; /* Inherit text color */
  cursor:pointer; /* Change cursor to pointer */
}

button:disabled{
  cursor:not-allowed; /* Change cursor to not-allowed */
}

button:focus-visible, a:focus-visible{
  outline:2px solid currentColor; /* Add outline for focused elements */
  outline-offset:3px; /* Add offset for focused elements */
}

a {
    color:inherit; /* Inherit text color */
    text-decoration: none /*underline*/; /* Remove underline from links */
    transition: color 0.3s ease-in-out;
}

ul, ol{
  list-style:none; /* Remove default list styling */
  padding:0; /* Remove default padding */
  margin: 0; /* Remove default margin */
}

p, h1, h2, h3, h4, h5, h6{
  overflow-wrap:break-word; /* Allow long words to be broken and wrap onto the next line */
}

@media (prefers-reduced-motion: reduce){
  *, *::before, *::after{
    animation-duration:0.01ms !important; /* Disable animations */
    animation-iteration-count:1 !important; /* Prevent animations from looping */
    transition-duration:0.01ms !important; /* Disable transitions */
    scroll-behavior:auto !important; /* Disable scroll behavior */
  }
}

.container{
  max-width:1100px;/* Max width for containers */
  width:100%; /* Full width */
  margin-inline:auto;/* Center container */
  padding-inline:1.25rem; /* Padding for containers */

  @media (min-width:768px){
    .container{
      padding-inline:2rem; /* Padding for containers */
    }
  }

  img {
    box-shadow: 0;
  }

}