/* ETG homepage — "human touch" layer: editorial kickers, hand-drawn marks, soft parallax washes.
   Loads after s1/s2/s3.css. Palette 2 (Ocean & Sun). */

/* ---------- Editorial kicker: 01 —— Plain sentence ---------- */
.hp-kick { display: inline-flex; align-items: center; gap: 12px; margin: 0 0 16px; padding: 0; background: none; border: 0; }
.hp-kick__n { font: 700 14px/1 var(--f-display); color: #082238; letter-spacing: .02em; font-variant-numeric: tabular-nums; }
.hp-kick__n::after { content: ""; display: inline-block; vertical-align: middle; width: 30px; height: 2px; margin-left: 12px; border-radius: 2px; background: #FFB81C; transform: translateY(-2px) rotate(-2deg); }
.hp-kick__t { font: 500 15.5px/1.3 var(--f-body); color: #3D5468; letter-spacing: 0; text-transform: none; }
.hp-process .hp-kick { justify-content: center; }

/* ---------- Headline accents: solid ink + hand-drawn marker underline ---------- */
.hp-mark { position: relative; color: #0A6FA8 !important; -webkit-text-fill-color: currentColor;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 300 16' preserveAspectRatio='none'%3E%3Cpath d='M3 10.5C48 5.5 96 12 150 8.2S246 4.6 297 8.6' fill='none' stroke='%23FFB81C' stroke-width='5' stroke-linecap='round'/%3E%3Cpath d='M18 13.2C80 10 160 12.6 262 10.4' fill='none' stroke='%23FFB81C' stroke-opacity='.45' stroke-width='2.4' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat 0 100% / 0% .36em !important;
  -webkit-background-clip: border-box !important; background-clip: border-box !important;
  -webkit-box-decoration-break: clone; box-decoration-break: clone; padding-bottom: .08em;
  transition: background-size 1100ms cubic-bezier(.65, .05, .2, 1) 250ms; }
.hp-mark.is-drawn { background-size: 100% .36em !important; }
.hp-final-cta .hp-mark { color: #0A6FA8 !important; }

/* ---------- Softer, less "generated" details in the AI + software section ---------- */
.hp-ais-block__kicker { gap: 12px; letter-spacing: 0; text-transform: none; font: 600 15px/1.2 var(--f-body); color: #3D5468; }
.hp-ais-block__kicker span { width: auto; height: auto; padding: 0 0 2px; border-radius: 0; background: none; color: #082238; font: 700 13px/1 var(--f-display); letter-spacing: .06em; text-transform: uppercase; border-bottom: 2px solid #FFB81C; }
.hp-ais-stack__label { text-transform: none; letter-spacing: 0; font: 600 15px/1.2 var(--f-display); color: #082238; }
.hp-ais-stack { transform: rotate(-.6deg); }
.hp-ais-stack:hover { transform: rotate(0deg); transition: transform 500ms cubic-bezier(.2,.7,.1,1); }

/* ---------- Soft gradient washes with parallax (decorative) ---------- */
main > section { position: relative; isolation: isolate; }
.hp-wash { position: absolute; inset: 0; z-index: -1; overflow: hidden; pointer-events: none; }
.hp-wash i { position: absolute; border-radius: 50%; will-change: transform; filter: blur(70px); opacity: var(--o, .5); }
.hp-wash i:nth-child(1) { width: 52vw; max-width: 760px; aspect-ratio: 1; left: -14vw; top: -8%; background: radial-gradient(closest-side, var(--c1, #CFE6FA), transparent); }
.hp-wash i:nth-child(2) { width: 44vw; max-width: 640px; aspect-ratio: 1; right: -12vw; top: 30%; background: radial-gradient(closest-side, var(--c2, #CDEFE7), transparent); }
.hp-wash i:nth-child(3) { width: 30vw; max-width: 460px; aspect-ratio: 1; left: 38%; bottom: -14%; background: radial-gradient(closest-side, var(--c3, #FFF0C7), transparent); --o: .55; }
#problems     { --c1: #E1EEFB; --c2: #FFF1CF; --c3: #DDF4EF; }
#process      { --c1: #D6ECF7; --c2: #DDF4EF; --c3: #FFF1CF; }
#case-studies { --c1: #E4EEFB; --c2: #FFE8DF; --c3: #DDF1F7; }
#industries   { --c1: #DDF4EF; --c2: #D6E6FA; --c3: #FFF1CF; }
#founders     { --c1: #FFF1CF; --c2: #D6ECF7; --c3: #E3F2EA; }
#faq          { --c1: #DDF1F7; --c2: #FFF3D8; --c3: #E1EEFB; }
#final-cta    { --c1: #D6ECF7; --c2: #DDF4EF; --c3: #FFE8DF; }
#ai-software  { --c1: #DCE9FB; --c2: #D9F2EC; --c3: #FFF1CF; }
#footer .hp-wash, #problems .hp-wash, #final-cta .hp-wash { display: none; }

@media (max-width: 760px) {
  .hp-wash i { filter: blur(50px); }
  .hp-wash i:nth-child(1) { width: 90vw; } .hp-wash i:nth-child(2) { width: 80vw; } .hp-wash i:nth-child(3) { width: 60vw; }
  .hp-ais-stack { transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .hp-mark { transition: none; background-size: 100% .36em !important; }
  .hp-wash i { transform: none !important; }
}

/* ---------- One continuous canvas: no hard seams between sections ---------- */
body.tg { background: linear-gradient(180deg, #F7FAFC 0%, #FFFFFF 30%, #F4F9FB 60%, #FFFFFF 100%) fixed; }
#ai-software, #process, #case-studies, #industries, #founders, #faq { background: transparent !important; }
.hp-wash { inset: -12% 0; }
.hp-ais__bg { display: none; }

/* Problem / fix labels: quiet handwritten-style notes instead of pills */
.hp-pfix__tag { padding: 0 !important; border-radius: 0 !important; background: none !important; border: 0 !important;
  font: 600 13px/1.2 var(--f-body) !important; letter-spacing: 0 !important; text-transform: none !important; }
.hp-pfix__tag::before { content: ""; display: inline-block; width: 16px; height: 2px; margin-right: 8px; vertical-align: middle; border-radius: 2px; background: currentColor; transform: rotate(-4deg); }
.hp-pfix__tag--fix { color: #08776F !important; }

/* One underline rule for every page: hand-drawn underline only in the page headline (H1) and the final contact headline */
main > section:not(.pg-hero):not(#final-cta) .hp-mark { background-image: none !important; padding-bottom: 0; }

img[src*="founder-ikramul"] { object-position: 50% 18%; }