*,
::before,
::after {
  box-sizing: border-box;
  margin: 0 0 0 0;
  padding: 0 0 0 0;
}

html {
  overflow-x: hidden;
  width: 100vw;
  padding: 0 0 0 0;
  margin: 0 0 0 0;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
}

body {
  overflow-x: hidden;
  width: 100vw;
  padding: 0 0 0 0;
  margin: 0 0 0 0;
  min-width: 250px;
  z-index: -1;
}

/* Base Styles */
body {
  text-align: center;
  font-family: "Comic Sans MS", "Comic Sans", cursive;
  display: flex;
  flex-direction: column;
}

/* Typography */

/*
.tinos-regular {
  font-family: "Tinos", serif;
  font-weight: 400;
  font-style: normal;
}

.tinos-bold {
  font-family: "Tinos", serif;
  font-weight: 700;
  font-style: normal;
}

.tinos-regular-italic {
  font-family: "Tinos", serif;
  font-weight: 400;
  font-style: italic;
}

.tinos-bold-italic {
  font-family: "Tinos", serif;
  font-weight: 700;
  font-style: italic;

  
.edu-nsw-act-cursive-<uniquifier> {
  font-family: "Edu NSW ACT Cursive", cursive;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
}

}
 */

.title,
h2 {
  font-family: "Tinos", serif;
  font-weight: 700;
  font-style: italic;
  font-size: 7rem;
  letter-spacing: .1rem;
}

.header-content,
#about-us h2,
#about-us p,
#specials h2,
.visit-us h2,
.visit-us .contact-info,
.footer-content {
  max-width: 1100px;
}

nav {
  height: 120px;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
  border-bottom: 5px solid gold;
}

nav .navbar .nav-container ul li a {
  display: block;
  padding: .75rem 1rem;
}

#hero {
  text-decoration: none;
}

a,
a:link,
a:visited {
  font-family: "Tinos", serif;
  font-weight: 700;
  font-style: normal;
  text-decoration: none;
  color: white;
  font-size: 2rem;
  font-weight: bold;
  text-shadow: black 1.5px -.7px .5px;
}

.nav-container {
  width: 100%;
  align-items: center;
  justify-content: space-between
}

.navbar .nav-container ul {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  list-style: none;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
}

nav ul,
nav li {
  position: static;
  float: none;
  margin: 0;
  padding: 0;
}

nav ul {
  display: flex;
}

.navbar {
  display: flex;
  flex-direction: row;
  width: 100%;
  position: fixed;
  z-index: 2;
  top: 0;
  left: 0;
  right: 0;
}



#hero-container img {
  max-width: 900px;
  border: rgb(136, 217, 159) solid 5px;
  box-shadow: whitesmoke 0px 0px 100px 40px;
}




header .header-content .tagline {
  font-family: "Edu NSW ACT Cursive", cursive;
  font-optical-sizing: auto;
  font-weight: 600;
  /* Font weights from 400 - 700*/
  font-style: normal;
  font-size: 1.80rem;
  text-shadow: black 1.5px 1.5px;
}

.title {
  text-align: center;
}

h2 {
  font-size: 5rem;
}

/* Header Section */
header {
  border-bottom: gold solid 5px;
  padding: 12rem 0 6rem 0;
  color: #F9FDFF;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
}

.stack {
  position: relative;
  display: inline-block;
  line-height: 1;
}


.stack .shadow {
  position: absolute;
  inset: 0;
  pointer-events: none;
  user-select: none;
  font: inherit;
  letter-spacing: inherit;

  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: 3px 3px 2px rgba(0, 0, 0, .8);
}

.stack .front {
  position: relative;
  z-index: 1;
  display: inline-block;
  background: linear-gradient(to top,
      #FFAC38 0%,
      #FFAC38 30%,
      #F9FDFF 55%,
      #F9FDFF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.stack-2 {
  position: relative;
  display: inline-block;
  line-height: 1;
}


.stack-2 .shadow-2 {
  position: absolute;
  inset: 0;
  pointer-events: none;
  user-select: none;
  font: inherit;
  letter-spacing: inherit;
  color: transparent;
  -webkit-text-fill-color: transparent;
  text-shadow: 3px 3px 2px rgba(0, 0, 0, .8);
}

.stack-2 .front-2 {
  position: relative;
  z-index: 1;
  display: inline-block;
  background: linear-gradient(to top,
      #DA0E00 0%,
      #DA0E00 20%,
      #F9FDFF 55%,
      #F9FDFF 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  -webkit-text-fill-color: transparent;
}

.bright {
  color: #FFEF72;
  padding-right: .4rem;
}

.taglline {
  margin-top: 0;
  padding-top: 1rem;
}


/* Links & Accents */

/* Images */


#rev-right .stories,
#rev-right .prices {
  position: static !important;
  float: none !important;
}

.stories,
.prices {
  outline: 1px dashed;
}


#hero-container img {
  width: 80%;
  height: auto;
}

/* Hero Section */
#hero-container {
  border-bottom: gold solid 5px;
  justify-content: center;
  display: flex;
  padding: 5rem 0 5rem 0;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
}

/* Main Content */
main {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
}

/* About Section */
#about-us {
  border-bottom: gold solid 5px;
  padding-top: 3rem 0 3rem 0;
  max-width: 100%;
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
}

#about-us h2 {
  padding-top: 3rem;
}

#about-us p {
  min-width: 50%;
  max-width: 80%;
  padding: 3rem 0 0;
  text-align: center;
  font-family: "Nunito Sans", sans-serif;
  font-size: 1.45rem;
  color: #F9FDFF;
  line-height: 1.4;
  font-weight: 500;
  text-shadow: black 2px 1px;
}

#thank-you {
  margin-bottom: 4rem;
  padding-bottom: 3rem;
  padding-top: 3rem;
  font-size: 1.6rem;
  font-family: "Nunito Sans", sans-serif;
}

/* Specials Section */

#specials,
#testimonials {
  display: flex;
  align-items: center;
  flex-direction: column;
  border-bottom: gold solid 5px;
  padding-bottom: 3rem;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
}

#specials h2 {
  overflow-x: hidden;
  display: block;
  padding: 3rem 0 3rem 0;
}

.specials-list {
  max-width: 100%;
  justify-content: center;
  align-items: center;
  margin-bottom: 3rem;
}


.special-offer {
  background-color: rgb(7, 7, 7);
  padding-bottom: 1rem;
  margin-top: 3rem;
  height: 500px;
  position: relative;
  max-width: 80%;
  width: 450px;
  border: rgb(136, 217, 159) solid 5px;
  box-shadow: whitesmoke 0px 0px 50px 10px;
  margin-inline: auto;
}


.special-offer:not(first-child) {
  margin-top: 5rem;
}

.special-item {
  height: 4rem;
  border-bottom: rgb(0, 217, 0) solid 5px;
  display: flex;
  align-content: center;
  justify-content: center;
}





.special-item h3 {
  font-family: "Lato", sans-serif;
  font-size: 2rem;
  color: #f5f5f5;
  text-shadow: #5aeb6b 2.5px 2px;
  align-content: center;
  font-weight: 700;
  font-style: normal;
  letter-spacing: 1px;

}

.prices {

  flex-direction: row;
  display: flex;
  height: 4rem;
}


.price-now,
.quote {
  display: flex;
  justify-content: flex-end;
  align-content: flex-end;
  font-size: 3.3rem;
  width: 300px;
  padding-right: 1rem;
  color: #F9FDFF;
  transform: translateY(.75rem) translateX(.5rem);
  font-family: "Nunito Sans", sans-serif;
  color: rgb(0, 217, 0);
  text-shadow: rgb(191, 235, 203) 1.95px 1.65px;
}

.price-now.large-now {
  transform: translateX(1.1rem) translateY(.75rem);
}

.price-was {
  display: flex;
  justify-content: center;
  align-content: first baseline;
  align-self: flex-end;
  width: 120px;
  font-size: 1.4rem;
  color: #F9FDFF;
  font-family: "Nunito Sans", sans-serif;
  transform: translateY(1.85rem) translateX(-1.3rem);
  color: rgb(238, 148, 148);
  text-shadow: rgb(247, 163, 163) 1px 1px;
}

.old-price {
  text-decoration: line-through;
  padding-left: .3rem;
  color: rgb(238, 148, 148);
}

.photo-container img {
  padding-top: 1.5rem;
  max-width: 90%;
}

.photo-container {
  display: flex;
  align-content: center;
  justify-content: center;
  overflow-x: hidden;
  overflow-y: hidden;
}

/* Testimonials  */

#testimonials {
  padding-top: 3rem;
}


#bulletin-board {
  position: relative;
  display: flex;
  flex-direction: column;
  margin-top: 2rem;
  box-shadow: #514c42 0px 5px 100px 5px;
  border: #557022 solid 5px;
  max-width: 60%;
  min-width: 40%;
}

#bulletin-board img {
  width: 100%;
  height: 100%;
}

.board#board {

  background-image: url("img/josephine-barham-KsAo8ouBn8A-unsplash.jpg");
  margin-top: 3rem;
  margin-bottom: 2rem;
  width: 90%;
  align-self: center;
  max-width: 1100px;
  height: 50rem;
  border-radius: 120px;
  align-content: space-evenly;
  justify-content: space-evenly;
  box-shadow: rgb(50, 46, 46) 5px 5px 100px 10px;
}

.row {
  width: 100%;
  display: flex;
  position: relative;
  flex-direction: row;
  align-items: center;
  justify-items: center;
  justify-content: center;
  justify-items: center;
  gap: 5rem;
}

.row:first-of-type {
  margin-top: -2rem;
}

.row:nth-of-type(2) {
  margin-top: 4rem;
}

#left-one {
  position: relative;
  display: flex;
}

#left-two {
  position: relative;
  display: flex;
}

#right-one {
  position: relative;
  display: flex;
}

#right-two {
  position: relative;
  display: flex;
}


#testimonial-wrapper {
  margin-top: 3rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-content: center;
  align-items: center;
  position: relative;
  gap: 3rem;
  width: 100%;
}

#testimonial-wrapper .left-testy,
#testimonial-wrapper .right-testy {
  width: 450px;
  height: 300px;
  display: flex;
  flex-direction: column;
  position: relative;
  background-color: whitesmoke;
}

.name-statement {
  display: flex;
  flex-direction: row;
  gap: .75rem;
  height: 2.75rem !important;
  min-height: 2.75rem;
  width: 450px;
  background-color: #cfc7c0;
  justify-items: center;
  align-items: center;
}


.one.right .name-statement,
#board #right-one {
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
}

.two.right .words-box,
#board #right-two {
  border-bottom-right-radius: 50px;
  border-bottom-left-radius: 50px;
}

.one.left .name-statement,
#board #left-one {
  border-top-left-radius: 50px;
  border-top-right-radius: 50px;
}

.two.left .words-box,
#board #left-two {
  border-bottom-left-radius: 50px;
  border-bottom-right-radius: 50px;
}

.two .name-statement,
#board #left-two,
#board #right-two {
  border-top-right-radius: 50px;
  border-top-left-radius: 50px;
}

.one .words-box,
#board #left-one,
#board #right-one {
  border-bottom-right-radius: 50px;
  border-bottom-left-radius: 50px;
}


p.favorite-flower {
  text-align: left;
  padding-left: .5rem;
}

.name-statement>p {
  font-family: "Edu NSW ACT Cursive", cursive;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  flex: 1 1 0;
  min-width: 0;
  margin: 0;
  ;
  box-sizing: border-box;
  font-size: 1.3rem;
}

p.customer {
  padding-left: 1rem;
}

/* rating – simple & accessible */
.t-rating {
  font-size: 1rem;
  letter-spacing: .1rem;
  color: #f3b700;
  padding-right: 2rem
}


.words-box {
  display: flex;
  background-image: linear-gradient(rgba(255, 255, 255, .8), rgba(255, 255, 255, .8)),
    url("img/pawel-czerwinski-ctMsz4XbNGU-unsplash.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  min-height: 288px;
  width: 100%;
  justify-content: center;
  align-content: center;
  justify-items: center;
  align-content: center;
}

.words-box>p {
  font-family: "Edu NSW ACT Cursive", cursive;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: 1.15rem;
  padding: .75rem;
  height: 100%;
  width: 100%;
  justify-content: center;
  align-content: center;
}

/* design tokens */
:root {
  --radius: 16px;
  --bg: #fff;
  --ink: #111;
  --muted: #6b6b6b;
  --accent: #ff6b3d;
  /* tweak to your brand */
  --shadow: 0 1px 0 rgba(0, 0, 0, .04), 0 8px 30px rgba(0, 0, 0, .08);
}





/* Visit Us Section */

.visit-us {
  padding-top: 3rem;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
  padding-bottom: 3rem;
  border-bottom: gold solid 5px;
}

.contact-info p,
address,
.phone-block p a {
  color: #F9FDFF;
  font-family: "Nunito Sans", sans-serif;
  text-shadow: black 1.75px 1.75px;
}

#cta {
  margin-bottom: 2rem;
  font-size: 2.5rem;
  font-weight: 600;
  font-style: italic;

}

.contact-info .address-block address {
  font-size: 1.50rem;
  font-weight: 600;
}

.contact-info .phone-block p {
  font-weight: 600;
  font-size: 2rem;
}

.address-block {
  margin-bottom: 2rem;
}

.contact-info {
  margin-top: 2rem;
}

iframe {
  width: 100%;
  height: 100%;
}

#frame-holder {
  max-width: 920px;
  margin-inline: auto;
  height: 350px;
  margin-top: 3rem;
  width: 80%;
  min-width: 250px;
  border: black solid 10px;
  box-shadow: whitesmoke 0px 0px 50px 15px;
}

/* Footer */
footer {
  height: 10rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  padding: 0 .5rem 0 .5rem;
  background: linear-gradient(to right,
      #8A0900 0%,
      #DA0E00 20%,
      #FF1100 40%,
      #FA4536 50%,
      #FC5E53 60%,
      #FC754D 80%,
      #FFAC38 100%);
}

.footer-content {
  width: 100%;
}

.footer-content .footer-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}

.footer-content p {
  margin: 0;
}

.footer-content .footer-row p {
  color: #F9FDFF;
  font-size: 1.5rem;
  text-shadow: black 1.75px 1.75px;
  font-family: "Nunito Sans", sans-serif;
  font-weight: 600;
}

footer .footer-content #foot-bottom-row .social img {
  max-width: 100%;
  height: auto;
  display: inline;
}

#foot-top-row {
  padding-top: 1rem;
}

#foot-bottom-row {
  
  padding-top: 1rem;
}

.social {
  height: 32px;
  width: 32px;
}

#foot-bottom-row #facebook {
  background-image: url("img/32px-2023_Facebook_icon.svg.png");
  background-size: cover;
  background-position: center;
  ;
}

/* MAX WIDTH MEDIA QUERY */
@media (max-width: 1150px) {
  .board#board {
    width: 96%;
  }

  #testimonial-wrapper .left-testy,
  #testimonial-wrapper .right-testy {
    width: 350px
  }

  .name-statement {
    width: 350px;
  }

  .name-statement>p {
    font-size: 1.1rem;
  }


  .words-box>p {
    font-size: 1rem;
  }

  #foot-bottom-row {
    justify-content: space-evenly;
  }
  
  .bio #bio-story #story,
  .bio-two #bio-story-2 #story-2 {
    font-size: .8rem;
  }
}

@media (max-width: 850px) {
  nav {
    height: 80px;
  }

  a,
  a:link,
  a:visited {
    font-size: 1.5rem;
  }

  .name-statement,
  #testimonial-wrapper .left-testy,
  #testimonial-wrapper .right-testy {
    width: 325px;
  }

  .name-statement p {
    font-size: 1rem;
  }

  .words-box p {
    font-size: 1rem;
  }

  .title {
    font-size: 5.5rem;
  }

  #testimonial-wrapper {
    /* height: 2150px; */
    margin-top: 2rem;
  }

  .board#board {
    background: none;
    background-color: #00000000;
    background-image: none;
    min-height: none;
    height: auto;
    border: none;
    box-shadow: none;
    outline: none;
    border-radius: none;
    overflow: visible;
  }

   .bio #bio-story #story,
   .bio-two #bio-story-2 #story-2 {
    font-size: .6rem;
  }

  .row {
    flex-direction: column;
    margin: 0 0 0 0 !important;
    padding: 0 0 0 0 !important;
    justify-content: center;
    align-content: center;
    align-items: center;
    gap: 0rem;
  }

  .card-holder {
    margin: 1rem 0 1rem 0;
    display: flex;
    width: 400px;
    height: 400px;
    justify-content: center;
    align-content: center;
    align-items: center;
    background-position: center center;
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 25px;
  }

  .left-testy,
  .right-testy {
    transform: translateY(-1rem);
  }

  #card-1 {
    background-image: url("img/jonatan-lindemann-Dv89X4z6-I8-unsplash.jpg");
  }

  #card-2 {
    background-image: url("img/jack-hodges-3zsLlSrxxDM-unsplash.jpg");
  }

  #card-3 {
    background-image: url("img/benjamin-lehman-ZSstdCNyJfA-unsplash.jpg");
  }

  #card-4 {
    background-image: url("img/mykyta-kondratov-eco5_1zUMzg-unsplash.jpg");
  }

  .footer-content .footer-row p {
    font-size: 1.1rem;
  }

  #section-one,
  #section-two {
    height: auto;
  }

  #section-one {
    margin-top: rem;
  }

  .bio, .bio-two {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 2rem;
  }

  #bio-story-2,
  #bio-story {
    max-width: 450px;
    min-width: 300px;
  }

  #foot {
    margin-top: 0rem;
    padding-top: 0rem;
  }

}

@media (max-width: 630px) {
  nav {
    height: 50px;
    border-bottom: 2.5px solid gold;
  }

  a,
  a:link,
  a:visited {
    font-size: 1.2rem;
  }

  .title {
    font-size: 3rem;
    min-width: 250px;
    text-align: center;
  }

  .header-content {
    display: flex;
    flex-direction: column;
    align-items: center;
  }


  h2 {
    font-size: 2.75rem;
    min-width: 250px;
  }

  header .header-content .tagline {
    margin-top: 1rem;
    font-size: 1rem;
    min-width: 250px;
  }

  .bright {
    font-size: 1rem;
  }

  #about-us {
    margin-left: 0;
    margin-right: 0;
    padding-left: 0;
    padding-right: 0;
    max-width: 100%;
  }

  #about-us p {
    font-size: 1.2rem;
    padding-left: 0;
    padding-right: 0;
    margin-right: 0;
    margin-left: 0;
    max-width: 90%;
  }

  #thank-you {
    font-size: 1.4rem;
  }


  .contact-info p {
    padding-bottom: 1.5rem;
  }

  .special-offer {
    width: 280px;
    max-width: 100%;
    height: 380px;
    min-width: 260px;
  }

  .special-item {
    height: 3rem;
    overflow-x: hidden;
    min-width: 270px;
  }

  .special-item h3 {
    font-size: 1.5rem;
  }

  .prices {
    height: 2.5rem;
  }

  .price-now {
    color: rgb(0, 217, 0);
    width: 225px;
    font-size: 2.2rem;
    transform: translateY(.7rem);
    font-weight: bolder;
  }

  .price-was {
    width: 75px;
    font-size: 1rem;
    transform: translateY(1.65rem) translateX(-1rem);
  }

  .price-now.large-now {
    transform: translateY(.7rem) translateX(.4rem);
  }

  .photo-container img {
    max-width: 90%;
  }

  footer {
    height: 10rem;
  }

  #foot-top-row {
    flex-direction: column;
    gap: .5rem;
  }

  .footer-content .footer-row p {
    font-size: .9rem;
  }

  .footer-content p:first-child {
    padding-top: .5rem;
    font-size: 1.5rem;
  }

  .contact-info .address-block address {
    font-size: 1.3rem;
  }

  #cta {
    font-size: 2rem;
  }

  #foot {
    margin-bottom: 0;
  }
}

@media (max-width: 525px) {

  a,
  a:link,
  a:visited {
    font-size: .8rem;
  }

  .card-holder {
    width: 300px;
    height: 360px;
  }

  .name-statement,
  #testimonial-wrapper .left-testy,
  #testimonial-wrapper .right-testy {
    width: 220px;
  }

  div .words-box {
    height: 100%;
    min-height: 160px;
    max-height: 220px;
  }

  .words-box p.nice-words {
    height: 100%;
  }

  #testimonial-wrapper .left-testy,
  #testimonial-wrapper .right-testy {
    height: 250px;
  }

  .name-statement p {
    font-size: .6rem;
  }

  .words-box p {
    font-size: .7rem;
  }

  .left-testy,
  .right-testy {
    transform: translateY(0rem);
  }

  .t-rating {
    font-size: .8rem;
    letter-spacing: 0.01rem;
    color: #f3b700;
    padding-right: 1rem
  }

}

@media (max-width: 350px) {

  nav {
    min-width: 250px;
    height: 36px;
  }

  a,
  a:link,
  a:visited {
    font-size: .6rem;
  }

  .title,
  h2 {
    font-size: 2.2rem;
    max-width: 100%;
  }

  header {
    display: flex;
    justify-content: center;
  }

  header .header-content .tagline,
  .bright {
    font-size: .75rem;
  }

  header .header-content {
    align-self: center;
    justify-self: center;
    max-width: 260px;
  }

  #hero-container img {
    box-shadow: whitesmoke 0px 0px 60px 15px;
  }

  #about-us p {
    font-size: 1rem;
  }

  .footer-content p:first-child {
    font-size: 1.1rem;
  }

  .footer-content p:last-child {
    font-size: 1rem;
  }

  #cta {
    font-size: 1.5rem;
  }

  .contact-info .phone-block p {
    font-size: 1.5rem;
  }

  .contact-info .address-block address {
    font-size: .9rem;
  }

  .footer-content .footer-row p {
    font-size: .8rem;
  }

  #foot-bottom-row {
    justify-content: center;
    gap: 1.5rem;
  }
}

/* MIN-WIDTH MEDIA QUERY */

@media (min-width: 1100px) {

  p #about-text,
  #about-us #about-text,
  #about-text {
    max-width: 800px !important;
    min-width: 500px;
  }

  header {
    display: flex;
    justify-content: center;
  }

  .header-content {
    margin-inline: center;
    text-align: center;
  }

  header,
  #specials {
    justify-items: center;
    justify-content: center;
  }



  #specials h2 {
    margin-inline: auto;
  }

  .specials-list {
    display: flex;
    flex-direction: row;
    gap: 5rem;
  }

  .special-offer {
    width: 290px;
    max-width: 100%;
    height: 390px;
    min-width: 260px;
  }

  .special-offer:first-of-type {
    box-shadow: rgb(151, 201, 148) -30px 15px 150px 20px;
  }

  .special-offer:nth-of-type(2) {
    box-shadow: rgb(151, 201, 148) 0 20px 150px 15px;
  }

  .special-offer:nth-of-type(3) {
    box-shadow: rgb(151, 201, 148) 30px 15px 150px 20px;
  }


  .special-item {
    height: 3rem;
    overflow-x: hidden;
    min-width: 270px;
  }

  .special-item h3 {
    font-size: 1.5rem;
  }

  .prices {
    height: 2.5rem;
  }

  .price-now {
    width: 225px;
    font-size: 2.5rem;
    font-weight: 600;
    transform: translateX(.25rem) translateY(.6rem);
  }

  .price-now.large-now {
    transform: translateX(.65rem) translateY(.6rem);
  }

  .price-was {
    width: 75px;
    font-size: 1rem;
    transform: translateY(1.7rem) translateX(-1rem);
  }

  .photo-container img {
    max-width: 90%;
  }


  .visit-us {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .visit-us h2 {
    margin-right: calc(50% - 550px);
    margin-right: 0;
  }

  iframe {
    max-width: 900px;
  }

  footer {
    justify-content: center;
    justify-items: center;
  }

  .footer-content {
    max-width: 900px;
  }

  .footer-content p {
    font-size: 1.24rem;
    font-weight: 600;
  }
}



/***************** ABOUT-FRAN HTML ********************/
#screen-pic-about {
  position: fixed;
  width: 100vw;
  height: 100vh;
  background-image: url("img/fatima-garcia-yGGdOJ8P0bk-unsplash.jpg");
  background-repeat: no-repeat;
  background-size: cover;
  background-position: top center;
  z-index: -1;
}

#section-one {
  z-index: 1;
  padding-top: 5rem;
  max-width: 1100px;
}

#section-two {
  z-index: 1;
  max-width: 1100px;
}


.bio {
  display: flex;
  justify-content: space-around;
}

#bio-pic {
  width: auto;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;

}

#bio-pic img {
  max-height: 25vh;
  object-fit: cover;
  object-position: center;
}

#bio-story {
  display: flex;
  width: 40%;
  background-color: white;
  max-width: 450px;
}

#bio-story #story,
#bio-story-2 #story-2 {
  display: flex;
  font-family: "Edu NSW ACT Cursive", cursive;
  font-optical-sizing: auto;
  font-weight: 500;
  font-size: 1.25rem;
  font-style: normal;
  text-align: center;
  padding: 2rem 2rem 1rem;
  max-height: 25vh;
  overflow: scroll;
  min-width: 300px;
}


.bio-two {
  display: flex;
  justify-content: center;
  align-content: center;;
}

#bio-2-pic {
  width: auto;
  height: 100%;
  overflow: hidden;
  box-sizing: border-box;
}

#bio-2-pic img {
  height: 25vh;
  object-fit: cover;
  object-position: center;
}

#bio-story-2 {
  display: flex;
  width: 40%;
  background-color: white;
  max-width: 450px;
}

#wrapper-fran {
  display: flex;
  flex-direction: column;
  align-content: center;
  align-items: center;
  justify-content :center;
  justify-items: center;
  max-height: 2500px;
}

#foot {
  max-height: 140px;
}


/***************** HELP ME ******************************/

/* Full-bleed fixed background */
#screen-pic-about{
  position: fixed;
  top: 0;
  left: 0;
  background: url("img/fatima-garcia-yGGdOJ8P0bk-unsplash.jpg") top center / cover no-repeat;
  z-index: -1; /* sits behind everything */
}

/* Layout shell */
#wrapper-fran{
  max-width: 1100px;
  margin: 0 auto;
  padding: clamp(96px, 12vh, 160px) 16px 64px; /* top pad clears fixed nav; nice breathing room */
  display: flex;
  flex-direction: column;
  gap: 12vh;
}

/* Sections should grow naturally (no fixed 25vh) */
#section-one, #section-two{ z-index: 1; }

/* Two-column biography rows */
.bio{
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 2rem;
}

/* Left/right columns */
#bio-pic, #bio-2-pic{
  flex: 0 0 38%;
  aspect-ratio: 4 / 3;     /* consistent shape */
  overflow: hidden;
  border-radius: 12px;
}
#bio-pic img, #bio-2-pic img{
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

#bio-story, #bio-story-2{
  flex: 1 1 0;
  max-width: 620px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 6px 28px rgba(0,0,0,.12);
}

#bio-story #story, #bio-story-2 #story-2{
  margin: 0;
  padding: 1.5rem;
  font-family: "Edu NSW ACT Cursive", cursive;
  font-weight: 500;
  font-size: 1.1rem;
  line-height: 1.55;
  color: #111;
  /* let it grow; remove forced scroll */
  max-height: none;
  overflow: visible;
}

/* Second row flips image/text on large screens */
.bio-two{ flex-direction: row-reverse; }

/* Responsive stack */
@media (max-width: 850px){
  .bio, .bio-two,
  #wrapper-fran {
    flex-direction: column;
    align-content: center;
    align-items: center;
    justify-content: center;
  }
  #bio-pic, #bio-2-pic, #bio-story, #bio-story-2 {
    flex: none; max-width: 300px;
  }

  .bio-two {
    margin-top: -5rem;
  }

  main {
    margin-bottom: 10rem;
  }
}

@media (max-width: 330px) {
 

   .bio, .bio-two,
  #wrapper-fran {
    transform: translateX(-.25rem);
  }

  #foot, .footer-content, .footer-row {
      max-width: 330px;
    }
}

@media (max-width: 305px) {
   .bio, .bio-two,
  #wrapper-fran {
    transform: translateX(-.5rem);
  }
}



/* Footer fixes */
#foot {
  margin-top: 25rem;
  padding: 24px 16px;
  position: fixed;
  bottom: 0;
  left: 0; 
  z-index: 5;
}
.footer-row{ display: flex; gap: 1rem; align-items: center; }
#foot-top-row{ justify-content: space-between; flex-wrap: wrap; }
#foot-bottom-row{ justify-content: center; gap: 1.5rem; }