/* =============================================================================
 * Tinkerbell Elementor Kit — shared structural styles.
 * Color, spacing and typography are owned by Elementor controls (inline styles).
 * This file only carries layout, hover, pseudo-elements, fonts, and other things
 * a single `selectors` rule can't express cleanly.
 * ============================================================================= */

/* ---------- Brand font: Polin ---------- */
@font-face {
  font-family: 'Polin';
  src: url('../fonts/Polin-Light.ttf') format('truetype');
  font-weight: 300; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Polin';
  src: url('../fonts/Polin-Regular.woff2') format('woff2');
  font-weight: 400; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Polin';
  src: url('../fonts/Polin-Medium.woff2') format('woff2');
  font-weight: 500; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Polin';
  src: url('../fonts/Polin-Semibold.woff2') format('woff2');
  font-weight: 600; font-style: normal; font-display: swap;
}
@font-face {
  font-family: 'Polin';
  src: url('../fonts/Polin-Bold.woff2') format('woff2');
  font-weight: 700; font-style: normal; font-display: swap;
}

/* Default brand font for all Tinkerbell widgets — easily overridden via
   Typography controls in any individual widget. */
.tnk-hero, .tnk-founder, .tnk-story, .tnk-quote, .tnk-cta {
  font-family: "Polin", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
}

/* ---------- Section Hero ---------- */
.tnk-hero { position: relative; overflow: hidden; }
.tnk-hero__bg {
  position: absolute; inset: 0; z-index: 0; pointer-events: none;
}
.tnk-hero__blob {
  position: absolute; border-radius: 9999px; filter: blur(64px);
}
.tnk-hero__blob-1 { top: 0;     left: -8rem;  width: 40rem; height: 40rem; opacity: .7; }
.tnk-hero__blob-2 { top: 10rem; right: -8rem; width: 36rem; height: 36rem; opacity: .8; }
.tnk-hero__inner { position: relative; z-index: 1; margin-inline: auto; }

.tnk-hero__badge {
  display: inline-flex; align-items: center; gap: .5rem;
  padding: .375rem 1rem; border-radius: 9999px;
  font-size: .875rem; font-weight: 600;
  margin-bottom: 2rem;
}
.tnk-hero__badge i, .tnk-hero__badge svg { width: 1rem; height: 1rem; }

.tnk-hero__title { margin: 0 0 2rem; }
.tnk-hero__highlight { position: relative; display: inline-block; }
.tnk-hero__highlight.is-underlined::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: -.5rem;
  height: 4px; border-radius: 9999px;
}
.tnk-hero__subtitle { margin: 0 auto; max-width: 48rem; line-height: 1.65; }

/* ---------- Founder Card ---------- */
.tnk-founder {
  background: #fff;
  border: 1px solid rgba(226,232,240,.7);
  box-shadow: 0 20px 60px -15px rgba(0,0,0,.05);
  transition: transform .3s ease, box-shadow .3s ease;
  overflow: hidden;
}
.tnk-founder:hover {
  transform: translateY(-4px);
  box-shadow: 0 30px 80px -15px rgba(91,45,193,.15);
}
.tnk-founder__layout {
  display: flex; flex-direction: column;
}
.tnk-founder__photo {
  --tnk-photo-w: 40%;
  --tnk-photo-h-mobile: 14rem;
  position: relative; width: 100%;
  height: var(--tnk-photo-h-mobile);
  overflow: hidden;
}
@media (min-width: 640px) {
  .tnk-founder__layout { flex-direction: row; }
  .tnk-founder__photo  {
    flex: 0 0 var(--tnk-photo-w);
    width: auto; height: auto;
  }
}
.tnk-founder__photo img {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; transition: transform .5s ease;
}
.tnk-founder:hover .tnk-founder__photo img { transform: scale(1.05); }

.tnk-founder__body { flex: 1; display: flex; flex-direction: column; justify-content: center; }
.tnk-founder__name { margin: 0 0 .25rem; line-height: 1.2; letter-spacing: -0.01em; }
.tnk-founder__role { font-size: .875rem; font-weight: 500; margin-bottom: 1.25rem; }
.tnk-founder__bio  { margin: 0; line-height: 1.65; }

/* ---------- Story Block ---------- */
.tnk-story        { position: relative; }
.tnk-story__inner { margin-inline: auto; }
.tnk-story__heading {
  margin: 0 0 2.5rem;
  letter-spacing: -0.015em;
  line-height: 1.15;
}
.tnk-story__highlight,
.tnk-story__closing-highlight { display: inline; }
.tnk-story__body > p { margin: 0; line-height: 1.7; }
.tnk-story__body > p + p,
.tnk-story__body > .tnk-story__closing { margin-top: 1.5rem; }
.tnk-story__closing { line-height: 1.3; padding-top: 1rem; letter-spacing: -0.01em; }

/* ---------- Manifesto Quote ---------- */
.tnk-quote        { position: relative; overflow: hidden; }
.tnk-quote__inner { margin-inline: auto; position: relative; }
.tnk-quote__icon  { display: block; margin-bottom: 1.5rem; line-height: 1; }
.tnk-quote__icon i, .tnk-quote__icon svg { width: 1em; height: 1em; }

.tnk-quote__body { margin: 0; padding: 0; border: 0; }
.tnk-quote__body p { margin: 0; line-height: 1.65; }
.tnk-quote__body p + p,
.tnk-quote__body .tnk-quote__closing { margin-top: 1.5rem; }
.tnk-quote__closing { line-height: 1.3; }

.tnk-quote__button-wrap {
  margin-top: 2.5rem; padding-top: 2rem;
  border-top: 1px solid rgba(226,232,240,1);
  display: flex; justify-content: center;
}
.tnk-quote__button {
  display: inline-flex; align-items: center; gap: .75rem;
  padding: 1rem 2rem; border-radius: 9999px;
  font-weight: 600; text-decoration: none;
  transition: transform .3s ease, background-color .3s ease, box-shadow .3s ease;
}
.tnk-quote__button:hover { transform: translateY(-2px); }
.tnk-quote__button i     { transition: transform .3s ease; }
.tnk-quote__button:hover i { transform: translateX(-.375rem); }
[dir="ltr"] .tnk-quote__button:hover i { transform: translateX(.375rem); }

/* ---------- Brand CTA ---------- */
.tnk-cta {
  position: relative; overflow: hidden; color: #fff;
  display: flex; align-items: center; justify-content: center;
}
.tnk-cta__inner {
  width: 100%; max-width: 88rem; margin-inline: auto;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
  text-align: center;
}
.tnk-cta__title { margin: 0 0 1.5rem; line-height: 1.1; }
.tnk-cta__subtitle {
  margin: 0 0 2.5rem; max-width: 36rem; line-height: 1.65;
  white-space: pre-line;
}
.tnk-cta__button-wrap { display: flex; flex-direction: column; gap: 1rem; }
@media (min-width: 640px) { .tnk-cta__button-wrap { flex-direction: row; } }
.tnk-cta__button {
  display: inline-flex; align-items: center; justify-content: center; gap: .75rem;
  padding: 1rem 2.5rem; border-radius: 9999px;
  font-weight: 600; text-decoration: none;
  box-shadow: 0 20px 40px -10px rgba(91,45,193,.2);
  transition: transform .3s ease;
}
.tnk-cta__button:hover { transform: scale(1.05); }
.tnk-cta__button i     { transition: transform .3s ease; }
.tnk-cta__button:hover i { transform: translateX(-.375rem); }
[dir="ltr"] .tnk-cta__button:hover i { transform: translateX(.375rem); }
