/* ==========================================================================
   Home page only. Built on top of the original theme (style.css).
   Uses the same Museo Sans font, brand teal and cyan, and the same
   section, card and button language as the rest of the site.
   ========================================================================== */

/* ---------- Hero ---------- */
.home-hero .hero-title-modern { font-size: 3.6rem; margin-bottom: 20px; }
.home-hero .hero-title-modern .gradient-text { display: block; }
.home-hero .hero-title-modern span:last-child { font-size: 0.62em; font-weight: 700; line-height: 1.25; display: block; margin-top: 8px; }

.home-hero { min-height: 0; padding-top: 30px; padding-bottom: 70px; }
.home-hook { text-wrap: balance; }
.home-sketch { margin: 0 auto 6px; }
.home-sketch img { display: block; margin: 0 auto; height: 700px; width: auto; max-width: 100%; mix-blend-mode: multiply; }
.home-status { margin: 0 0 22px; }
.home-dot {
  display: inline-block; width: 8px; height: 8px; border-radius: 50%;
  background: #0097b2; margin-right: 10px; position: relative; top: -1px;
  box-shadow: 0 0 0 0 rgba(0, 151, 178, 0.5);
  animation: homeDot 2s ease-out infinite;
}
@keyframes homeDot {
  0% { box-shadow: 0 0 0 0 rgba(0, 151, 178, 0.5); }
  100% { box-shadow: 0 0 0 10px rgba(0, 151, 178, 0); }
}
.home-hook {
  font-size: 1.75rem; line-height: 1.4; font-weight: 300; letter-spacing: -0.2px;
  color: #8a8a8a; max-width: 820px; margin: 0 auto 38px;
}
.home-hook b { color: #0097b2; font-weight: 700; }
.home-hero .hero-title-modern span:last-child { text-wrap: balance; }
.home-hero .hero-description-modern { max-width: 760px; margin-left: auto; margin-right: auto; }
.home-hero .hero-cta-modern,
.home-hero .hero-trust-signals { justify-content: center; }

/* Centered section titles (About Me) */
.home-titles-center { align-items: center; text-align: center; }
.home-titles-center::after { left: 50%; transform: translateX(-50%); }

/* ---------- Partner logos (uses the original .logos grid) ---------- */
.home-logos { padding: 20px 0 90px; min-height: 0; }
.home-logos .titles { margin-bottom: 50px; }
.home-logos .titles::after { display: none; }
.home-logos .titles h6 { font-size: 1.1rem; letter-spacing: 3px; text-transform: uppercase; margin-bottom: 10px; }
.home-logos .titles p { font-size: 1.05rem; }
.home-logos ul { justify-content: center; }
.home-logos ul li { width: auto; float: none; flex: 1 1 190px; max-width: 25%; }
.home-logos ul li figure { height: 90px; margin: 26px 0; opacity: 0.8; filter: grayscale(1); }
.home-logos ul li:hover figure { opacity: 1; filter: none; }
.home-logos ul li figure img {
  display: block; position: static; transform: none; height: 100%; width: 100%;
  max-width: 100%; padding: 8px 22px; object-fit: contain;
}

/* ---------- Story (light section, grey text with dark highlights, like the inspiration site) ---------- */
.home-story { padding: 100px 0 100px; min-height: 0; background: #fff; }
.home-story .titles { margin-bottom: 70px; }
.home-story .titles h6 { color: #0097b2; background: linear-gradient(135deg, #0097b2 0%, #00e0ff 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.home-story p {
  font-size: 1.75rem; line-height: 1.5; font-weight: 300; letter-spacing: -0.2px;
  color: #aaa; margin-bottom: 44px;
}
.home-story p.home-lead { font-size: 2.1rem; font-weight: 700; color: #aaa; line-height: 1.4; }
.home-story .home-ink { color: #282828; }
.home-story a { color: #282828; font-weight: 700; }
.home-story a:hover { color: #0097b2; }
.home-nowrap { white-space: nowrap; }

.home-inline-ico { display: inline-flex; vertical-align: middle; position: relative; top: -3px; margin: 0 4px 0 2px; color: #0097b2; }
.home-inline-ico svg { animation: homeSpin 8s linear infinite; }
.home-arrow { vertical-align: middle; position: relative; top: -2px; margin: 0 2px; }
@keyframes homeSpin { to { transform: rotate(360deg); } }

.home-chip-link { white-space: nowrap; display: inline-block; }
.home-chip {
  display: inline-block; width: 42px; height: 42px; border-radius: 12px; overflow: hidden;
  vertical-align: middle; position: relative; top: -3px; margin: 0 10px 0 2px;
  border: 2px solid rgba(0, 0, 0, 0.06); background: #f2f2f2;
  transition: transform 0.35s cubic-bezier(0.2, 0.8, 0.2, 1);
}
.home-chip img { width: 100%; height: 100%; object-fit: cover; display: block; }
.home-chip-logo { background: #fff; }
.home-chip-logo img { object-fit: contain; padding: 5px; }
.home-chip-link:hover .home-chip { transform: rotate(-8deg) scale(1.12); }

.home-story a.home-wavy {
  text-decoration: underline wavy #0097b2 !important;
  text-decoration-thickness: 1.5px !important;
  text-underline-offset: 7px;
}

/* ---------- Stats (original .process cards) ---------- */
.home-stats { padding: 100px 0 100px; min-height: 0; }
.home-stats .step { height: auto; margin-bottom: 24px; }
.home-stats .step .num { font-size: 3.6rem; }
.home-stats .titles { display: none; }
.home-stats .step h5 { margin-top: 4px; }
.home-stats .step p { font-size: 0.98rem; }

/* ---------- Selected work (original .fw-card) ---------- */
.home-work { padding: 100px 0 120px; min-height: 0; }
.page-home, .page-home.color-dark, .page-home.color-light { background-color: #fff; }
.page-home .footer { background: #fff; }
.home-work .titles { margin-bottom: 70px; }
.home-work .titles h6 { color: #0097b2; background: linear-gradient(135deg, #0097b2 0%, #00e0ff 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.home-work .titles p { color: #777; }
.home-work-card { display: block; color: #282828; }
.home-work-card:hover { color: #282828; }
.home-work-card figure { aspect-ratio: 4 / 5; margin-bottom: 22px; }
.home-work-card figure img { height: 100%; object-fit: cover; object-position: top center; }
.home-work-type {
  display: block; margin-bottom: 8px; font-size: 12px; font-weight: 700;
  letter-spacing: 0.1em; text-transform: uppercase; color: #0097b2;
}
.home-work-card h4 { font-size: 1.5rem; font-weight: 700; color: #282828; margin: 0 0 10px; }
.home-work-card p {
  font-size: 1rem; line-height: 1.6; color: #777; margin: 0;
  display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden;
}

.home-work-more { margin-top: 40px; display: flex; justify-content: center; }

/* ---------- Responsive ---------- */
@media (max-width: 991px) {
  .home-hero .hero-title-modern { font-size: 3rem; }
  .home-hook { font-size: 1.5rem; }
    .home-logos ul li { max-width: 33.333%; }
  .home-story p { font-size: 1.45rem; }
  .home-story p.home-lead { font-size: 1.8rem; }
}

@media (max-width: 767px) {
  .home-hero .hero-title-modern { font-size: 2.2rem; }
  .home-hero { padding-top: 110px; }
  .home-sketch img { height: 400px; }
  .home-hook { font-size: 1.25rem; margin-bottom: 30px; }
  .home-logos { padding-bottom: 60px; }
  .home-logos ul li { max-width: 50%; flex-basis: 140px; }
  .home-logos ul li figure { height: 70px; margin: 20px 0; }
  .home-story { padding: 70px 0; }
  .home-story .titles { margin-bottom: 50px; }
  .home-story p { font-size: 1.2rem; margin-bottom: 32px; }
  .home-story p.home-lead { font-size: 1.45rem; }
  .home-chip { width: 32px; height: 32px; border-radius: 9px; margin-right: 8px; }
  .home-inline-ico svg { width: 22px; height: 22px; }
  .home-arrow { width: 20px; height: 20px; }
  .home-stats { padding: 70px 0; }
  .home-work { padding: 70px 0 80px; }
}

@media (prefers-reduced-motion: reduce) {
  .home-dot, .home-inline-ico svg { animation: none; }
}

/* ---------- What You Actually Get (moved from the old About page) ---------- */
.home-outcomes { padding: 40px 0 100px; position: relative; }
.home-outcomes .titles { margin-bottom: 70px; }
.home-outcomes .titles h6 { color: #0097b2; background: linear-gradient(135deg, #0097b2 0%, #00e0ff 100%); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; }
.home-outcomes .titles p { color: #8a8a8a; max-width: 720px; text-align: center; }
.home-card {
  height: 100%; display: flex; flex-direction: column; gap: 0.85rem;
  background: #f4fbfc; border: 1px solid rgba(0, 151, 178, 0.14); border-radius: 20px;
  padding: 2.5rem 2rem 2rem; box-shadow: 0 10px 30px rgba(0, 151, 178, 0.08);
  transition: background 0.3s ease, border-color 0.3s ease, transform 0.3s ease;
}
.home-card:hover { background: #eaf7fa; border-color: rgba(0, 151, 178, 0.3); transform: translateY(-4px); }
.home-card-tag { font-size: 1.7rem; font-weight: 700; letter-spacing: 0.18em; color: #0097b2; }
.home-card h4 { font-size: 1.25rem; font-weight: 700; color: #282828; margin: 0; line-height: 1.3; }
.home-card p { line-height: 1.8; color: #777; margin: 0; flex: 1; }
.home-card-proof { font-size: 1rem; font-weight: 600; color: #0097b2; letter-spacing: 0.04em; padding-top: 1rem; border-top: 1px solid rgba(0, 151, 178, 0.18); margin-top: auto; }
@media (max-width: 991px) { .home-outcomes { padding: 30px 0 70px; } .home-card { padding: 2rem 1.75rem 1.75rem; } }
@media (max-width: 767px) { .home-outcomes { padding: 20px 0 56px; } .home-card { padding: 1.75rem 1.5rem 1.5rem; border-radius: 16px; } .home-card-tag { font-size: 1.3rem; } }