/* lumiose.au: Samuel Ngai's IT, risk and advisory consulting.
   Loaded after lumiose-frame.css. Clean and professional, in the
   consulting blue. No outside fonts or pictures: the icons are drawn in
   the page itself. */

:root {
  --paper: #FBFAF7;
  --blue: #1A6FA8;          /* text, buttons (passes contrast on white) */
  --blue-dark: #145A88;
  --blue-bright: #29A2E4;   /* the blue of the old logo, for accents */
  --tint: #EAF4FB;
  --lm-line: #E3E8EE;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
  margin: 0;
  background: var(--paper);
  color: var(--lm-ink);
  font: 17px/1.55 var(--lm-font);
}

/* Opening band: soft blue, behind the header and the hero. */
.c-band {
  background:
    radial-gradient(900px 420px at 85% 0%, rgba(41,162,228,0.16), transparent 70%),
    linear-gradient(180deg, var(--tint), var(--paper));
  border-bottom: 1px solid var(--lm-line);
}

.c-hero {
  display: grid; grid-template-columns: 1fr; gap: 28px;
  padding-top: 32px; padding-bottom: 56px;
}
@media (min-width: 860px) {
  .c-hero { padding-top: 56px; padding-bottom: 80px; }
}
.c-label {
  color: var(--blue); font-size: 0.8rem; font-weight: 700;
  letter-spacing: 0.08em; text-transform: uppercase; margin: 0 0 12px;
}
.c-hero h1 {
  font-size: clamp(2.1rem, 5vw, 3.2rem); line-height: 1.08; letter-spacing: -0.03em;
  margin: 0 0 16px; font-weight: 750; max-width: 15ch;
}
.c-lead { font-size: 1.2rem; color: var(--lm-soft); margin: 0 0 24px; max-width: 34rem; }
.c-actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 0; }

.c-button {
  display: inline-block;
  background: var(--blue); color: #fff; text-decoration: none; font-weight: 700;
  border: 2px solid var(--blue); border-radius: 999px; padding: 11px 22px;
}
.c-button:hover { background: var(--blue-dark); border-color: var(--blue-dark); }
.c-button:focus-visible { outline: 3px solid var(--lm-ink); outline-offset: 3px; }
.c-button-quiet { background: transparent; color: var(--blue); }
.c-button-quiet:hover { background: #fff; color: var(--blue-dark); }
.c-button-white { background: #fff; color: var(--blue); border-color: #fff; }
.c-button-white:hover { background: var(--tint); border-color: var(--tint); color: var(--blue-dark); }
.c-button-white:focus-visible { outline-color: #fff; }

/* Sections */
.c-section { padding-top: 64px; }
.c-section h2 { font-size: clamp(1.5rem, 3.5vw, 1.9rem); letter-spacing: -0.02em; margin: 0 0 22px; }

.c-grid { display: grid; grid-template-columns: 1fr; gap: 20px; }
@media (min-width: 760px) { .c-grid { grid-template-columns: 1fr 1fr; gap: 24px; } }

.c-card, .c-quote {
  background: #fff; border: 1px solid var(--lm-line); border-radius: var(--lm-radius);
  padding: 26px 28px; margin: 0;
}
.c-card h3 { margin: 14px 0 12px; font-size: 1.2rem; }
.c-icon {
  display: inline-grid; place-items: center;
  width: 44px; height: 44px; border-radius: 12px; background: var(--tint);
}
.c-icon svg {
  width: 24px; height: 24px; fill: none; stroke: var(--blue);
  stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
}

/* Lists with ticks */
.c-ticks { list-style: none; margin: 0; padding: 0; }
.c-ticks li { position: relative; padding: 6px 0 6px 28px; }
.c-ticks li::before {
  content: ""; position: absolute; left: 4px; top: 11px;
  width: 6px; height: 11px; border: solid var(--blue-bright); border-width: 0 2.5px 2.5px 0;
  transform: rotate(45deg);
}

/* Testimonials */
.c-quote { display: flex; flex-direction: column; position: relative; }
.c-quote::before {
  content: "“"; position: absolute; right: 22px; top: 2px;
  font: 700 4.5rem/1 Georgia, serif; color: var(--tint);
}
.c-topic {
  margin: 0 0 10px; color: var(--blue); font-size: 0.8rem; font-weight: 700;
  letter-spacing: 0.06em; text-transform: uppercase; position: relative;
  padding-right: 40px;
}
.c-quote blockquote { margin: 0 0 18px; position: relative; }
.c-quote blockquote p { margin: 0 0 10px; }
.c-quote blockquote p:first-child::before { content: "“"; }
.c-quote blockquote p:last-child::after { content: "”"; }
.c-quote figcaption {
  margin-top: auto; display: flex; align-items: center; gap: 10px;
  color: var(--lm-soft); font-weight: 600; font-size: 0.95rem;
}
.c-initial {
  display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%;
  background: var(--blue); color: #fff; font-weight: 700; font-size: 0.9rem;
}

/* Contact band */
.c-contact { margin-top: 72px; background: var(--blue); color: #fff; }
.c-contact-in {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px 32px;
  padding-top: 40px; padding-bottom: 40px;
}
.c-contact h2 { margin: 0 0 6px; font-size: clamp(1.5rem, 3.5vw, 1.9rem); letter-spacing: -0.02em; }
.c-contact p { margin: 0; color: #DCEBF6; }

/* The footer follows the blue band directly. */
.lm-foot { margin-top: 0; }
.lm-foot-in { border-top: 0; }

/* Page not found */
.notfound { padding: 48px 0 64px; max-width: 560px; }
.notfound h1 { font-size: clamp(2rem, 5vw, 2.6rem); line-height: 1.15; letter-spacing: -0.02em; margin: 0 0 12px; }
.notfound p { color: var(--lm-soft); }
.notfound a { color: var(--blue); font-weight: 600; }
