:root {
  --cream: #fff8ec;
  --pastel-red: #eaa1a1;
  --pastel-blue: #9ebbe7;
  --navy: #233047;
  --white: #ffffff;
  --shadow: 0 22px 60px rgba(35, 48, 71, 0.16);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  font-family: Georgia, "Times New Roman", serif;
  background: var(--cream);
  color: var(--navy);
  line-height: 1.6;
}

.hero {
  min-height: 88vh;
  padding: 28px;
  background:
    linear-gradient(rgba(255, 248, 236, 0.38), rgba(255, 248, 236, 0.82)),
    url("assets/sheep-covered-hill-hero-v4.png") center / cover no-repeat;
  display: flex;
  flex-direction: column;
}
.nav { display:flex; justify-content:space-between; align-items:center; gap:18px; }
.brand { font-weight:800; font-size:1.2rem; letter-spacing:.08em; text-transform:uppercase; }
.nav-button,.primary-button,.buy-button {
  display:inline-block; border:0; border-radius:999px; background:var(--navy); color:var(--white);
  padding:14px 22px; font:inherit; font-weight:800; text-decoration:none; cursor:pointer; box-shadow:var(--shadow);
}
.hero-content { max-width:760px; margin:auto 0; padding:72px 0; }
.eyebrow,.badge { color:#8f3e3e; font-weight:800; letter-spacing:.12em; text-transform:uppercase; }
h1 { font-size:clamp(4rem,13vw,9rem); line-height:.86; margin:12px 0 20px; }
.tagline { font-size:clamp(1.5rem,4vw,2.6rem); font-weight:800; max-width:700px; }
.hero-copy { max-width:630px; font-size:1.15rem; }

.product-card,.reviews,.features { width:min(1120px,calc(100% - 34px)); }

/* Prevent any obsolete illustrated sock elements from appearing. */
.sock-art,.sock-cuff,.sock-leg,.sock-foot { display:none !important; }

.product-card {
  margin:0 auto 48px; padding:34px; background:var(--white); border-radius:34px; box-shadow:var(--shadow);
  display:grid; grid-template-columns:.85fr 1.15fr; gap:34px; align-items:center;
}
.product-info h2 { font-size:clamp(2.2rem,6vw,4.2rem); line-height:1; margin:6px 0 10px; }
.price { font-size:3rem; font-weight:900; color:#8f3e3e; margin:0 0 12px; }
ul { padding-left:22px; font-size:1.08rem; }
.note { color:#6f7380; font-size:.95rem; }

.reviews { margin:0 auto 48px; background:#fff; border-radius:30px; padding:30px; box-shadow:0 14px 36px rgba(35,48,71,.08); text-align:center; }
.reviews h2 { margin:0 0 12px; font-size:clamp(2rem,5vw,3.2rem); }
.reviews blockquote { margin:18px 0; font-size:1.35rem; }
.reviews footer { margin-top:10px; padding:0; background:transparent; color:var(--navy); font-weight:800; }

.features { margin:0 auto 60px; display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }
.features div { background:#fff; border-radius:24px; padding:26px; box-shadow:0 14px 36px rgba(35,48,71,.08); }
.features h3 { font-size:1.7rem; margin:0 0 8px; }
.site-footer { text-align:center; padding:28px; background:var(--navy); color:var(--cream); }

@media (max-width:760px) {
  .nav { align-items:flex-start; flex-direction:column; }
  .product-card { grid-template-columns:1fr; padding:22px; }
  .features { grid-template-columns:1fr; }
}


.product-photo {
  width: 100%;
  max-width: 430px;
  margin: 0 auto;
}

.product-photo img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 24px;
  box-shadow: 0 12px 30px rgba(35,48,71,.16);
}