/* coolcue.com - the page around the blocks.
   Recreates, measured value by measured value, the GoDaddy Website Builder theme the site ran on
   until October 2026: header bar, nav, the native home sections, footer and its curved edge.
   The blocks in src/blocks carry their own styles, scoped under .cc by build.py. */

@font-face {
  font-family: "Chunkfive";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(/fonts/Chunkfive.woff2) format("woff2");
}

:root {
  --indigo: #3633B0;
  --lavender: #F3F3FC;
  --line: #A6A5E9;
  --body: #E2E2E6;
  --ink: #1B1B1B;
  --foot: #595959;
  --sans: Helvetica, arial, sans-serif;
  --slab: Chunkfive, arial, helvetica, sans-serif;
}

html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--sans);
  font-size: 16px;
  background: #fff;
  color: #000;
}
img { max-width: 100%; }

.gd-c { box-sizing: border-box; margin: 0 auto; padding: 0 24px; }
@media (min-width: 1024px) { .gd-c { max-width: 984px; } }
@media (min-width: 1280px) { .gd-c { max-width: 1160px; } }
@media (min-width: 1536px) { .gd-c { max-width: 1280px; } }

/* ---------------------------------------------------------------- header -- */
.gd-head { background: var(--indigo); }
.gd-nav { display: none; }
.gd-burger {
  display: block; width: 40px; height: 40px; padding: 0; margin: 0;
  border: 0; background: none; color: #fff; cursor: pointer;
}
.gd-burger svg { display: block; width: 28px; height: 28px; margin: 6px; }
.gd-head .gd-c { padding-top: 24px; padding-bottom: 24px; }
@media (min-width: 1024px) {
  .gd-burger { display: none; }
  .gd-head .gd-c { padding-top: 56px; padding-bottom: 32px; }
  .gd-nav { display: block; text-align: center; }
}
.gd-nav ul { margin: 0; padding: 0; list-style: none; line-height: 24px; }
.gd-nav li { display: inline-block; padding-left: 32px; }
.gd-nav li:first-child { padding-left: 0; }
.gd-nav a {
  display: block; padding: 6px; margin: -6px;
  font-size: 14px; letter-spacing: 2.996px; line-height: 24px; text-transform: uppercase;
  color: #fff; text-decoration: none;
}
.gd-nav a[aria-current] {
  padding: 0 0 4px; margin: 0 0 -5px;
  border-bottom: 1px solid var(--line);
}

/* the phone menu: a full-screen sheet, as the theme had it */
.gd-drawer {
  position: fixed; inset: 0; z-index: 100;
  background: var(--lavender); overflow-y: auto;
  padding: 88px 32px 32px;
  transform: translateX(100%); visibility: hidden;
  transition: transform .3s ease, visibility 0s linear .3s;
}
.gd-drawer.open { transform: none; visibility: visible; transition: transform .3s ease; }
.gd-drawer ul { margin: 0; padding: 0; list-style: none; }
.gd-drawer a {
  display: block; padding: 16px 24px;
  font-size: 22px; letter-spacing: 2.992px; text-transform: uppercase;
  color: var(--ink); text-decoration: none;
}
.gd-drawer a[aria-current] { font-weight: 700; }
.gd-close {
  position: absolute; top: 15px; right: 15px; width: 40px; height: 40px;
  padding: 0; border: 0; background: none; color: var(--ink); cursor: pointer;
}
@media (min-width: 1024px) { .gd-drawer { display: none; } }

/* --------------------------------------------------------------- sections -- */
.gd-sec { padding: 32px 0; background: var(--indigo); }
.gd-sec.white { background: #fff; }
@media (min-width: 768px) { .gd-sec { padding: 40px 0; } }

.gd-block .cc { display: flow-root; }

.gd-h {
  margin: 0 0 24px;
  font-family: var(--slab); font-weight: 400;
  font-size: 44px; line-height: 1.4; letter-spacing: 1.364px;
  color: #fff; text-align: left;
}
.white .gd-h { color: var(--indigo); }
.gd-h-plain { font-family: arial, helvetica, sans-serif; }
@media (min-width: 768px) { .gd-h { margin-bottom: 32px; } }

.gd-txt { color: var(--body); font-size: 16px; line-height: 24px; text-align: left; text-wrap: pretty; }
.gd-txt p { margin: 0; }
.gd-txt strong { font-weight: 700; }
.gd-txt h3 {
  margin: 0; font-size: 22px; line-height: 24.75px; font-weight: 700; color: #fff;
}
.gd-txt h4, .gd-card h4 {
  margin: 0 0 24px; font-size: 22px; line-height: 27.5px; font-weight: 400;
  letter-spacing: .99px; color: #fff;
}
.gd-txt ul, .gd-card ul { margin: 0 16px; padding: 0 0 0 20.8px; }
.gd-gap { height: 24px; }

/* text column + picture column; the picture comes first on a phone */
.gd-row { display: flex; flex-direction: column; }
.gd-row .gd-pic { order: -1; margin: 0 0 32px; text-align: center; }
.gd-row .gd-pic img { display: block; width: 100%; height: auto; }
@media (min-width: 768px) {
  .gd-row .gd-pic { align-self: center; width: calc((100% + 48px) * 10 / 12 - 48px); }
}
@media (min-width: 1024px) {
  .gd-row { flex-direction: row; gap: 48px; align-items: flex-start; }
  .gd-row .gd-txt { flex: 0 0 calc((100% + 48px) * 2 / 3 - 48px); }
  .gd-row .gd-pic { order: 0; margin: 0; width: auto; flex: 0 0 calc((100% + 48px) / 3 - 48px); }
}

/* "It stays quiet": three indigo cards */
.gd-cards { display: flex; flex-direction: column; gap: 48px; }
.gd-card { background: var(--indigo); padding: 32px 0; text-align: center; }
.gd-card .gd-txt { padding: 0 32px; text-align: center; }
.gd-card ul { text-align: left; }
.gd-card h4 { padding: 0 32px; text-align: center; }
.gd-card img { display: block; width: 100%; height: auto; }
@media (min-width: 1024px) {
  .gd-cards { flex-direction: row; align-items: stretch; }
  .gd-card { flex: 1 1 0; min-width: 0; }
}

/* ----------------------------------------------------------------- footer -- */
.gd-foot { position: relative; background: #fff; padding: 32px 0; }
.gd-foot.tint { background: var(--lavender); }
.gd-wave { position: absolute; left: 0; right: 0; top: -40px; height: 40px; color: inherit; }
.gd-wave svg { display: block; width: 100%; height: 100%; }
.gd-foot .gd-wave { color: #fff; }
.gd-foot.tint .gd-wave { color: var(--lavender); }
@media (min-width: 768px) {
  .gd-foot { padding: 56px 0; }
  .gd-wave { top: -64px; height: 64px; }
}
.gd-foot .gd-c { display: flex; flex-direction: column; text-align: center; }
.gd-foot p {
  margin: 0; font-size: 12px; line-height: 18px; letter-spacing: .996px;
  text-transform: uppercase; color: var(--foot); text-wrap: pretty;
}
.gd-foot a { color: var(--indigo); }
@media (min-width: 1024px) {
  .gd-foot .gd-c { flex-direction: row; justify-content: space-between; text-align: left; }
  .gd-foot .gd-legal { max-width: calc(50% - 0px); padding-right: 0; }
}

/* ------------------------------------------------------------------- 404 -- */
.gd-404 { padding: 120px 0 140px; text-align: center; }
.gd-404 h1 {
  margin: 0 0 24px; font-family: "Courier New", monospace; font-size: 28px; line-height: 35px;
  font-weight: 700; letter-spacing: .868px; color: var(--ink);
}
.gd-404 p { margin: 0 0 32px; font-size: 22px; line-height: 33px; color: #5E5E5E; }
.gd-404 a {
  display: inline-block; padding: 12px 40px; background: var(--indigo); color: #fff;
  font-size: 14px; font-weight: 700; letter-spacing: 2.996px; text-transform: uppercase;
  text-decoration: none;
}