/*
Theme Name:   Lehter (Goya Child)
Theme URI:    https://lehter.ee/
Description:  Standalone Lehter page templates with admin-editable text, a native contact form, a Polylang-ready flag switcher and a lightweight SEO layer. Editorial redesign: kicker labels, a numbered-list pattern, a stat strip and a pull-quote — instead of repeated icon-card grids.
Author:       Lehter
Template:     goya
Version:      3.2.0
Text Domain:  lehter
*/

/* ============ Brand tokens ============ */
:root {
  --lh-ink:     #1F1B3D;
  --lh-indigo:  #4338CA;
  --lh-magenta: #A21CAF;
  --lh-lav:     #C9C6F2;
  --lh-pink:    #F0ABFC;
  --lh-mist:    #F8F7FC;
  --lh-slate:   #4B4A6A;
  --lh-line:    #E4E1F5;
  --lh-grad:    linear-gradient(120deg, #4338CA 0%, #A21CAF 100%);
}

/* ============ Reset / base ============ */
.lh-page, .lh-page * , .lh-page *::before, .lh-page *::after { box-sizing: border-box; }
.lh-page {
  margin: 0;
  font-family: "Manrope", "Segoe UI", Roboto, Arial, sans-serif;
  color: var(--lh-slate);
  background: #fff;
  -webkit-font-smoothing: antialiased;
}
.lh-page img { max-width: 100%; display: block; }
.lh-page h1, .lh-page h2, .lh-page h3 {
  font-family: "Manrope", "Segoe UI", Roboto, Arial, sans-serif;
  font-weight: 800;
  letter-spacing: -0.025em;
  color: var(--lh-ink);
  margin: 0;
}
.lh-page p { margin: 0; line-height: 1.7; }
.lh-page a { color: var(--lh-indigo); text-decoration: none; }
.lh-page a:not(.lh-btn):hover { color: var(--lh-magenta); }
.lh-page :focus-visible { outline: 3px solid var(--lh-magenta); outline-offset: 2px; }
.lh-page svg { display: block; }

@font-face { font-family:"Manrope"; font-weight:200 800; font-style:normal; font-display:swap;
  src:url("assets/fonts/manrope-var.woff2") format("woff2"); }

.lh-container { max-width: 1180px; margin: 0 auto; }

/* ============ Kicker (small eyebrow label above a headline) ============ */
.lh-kicker {
  display: inline-block; font-size: 13px; font-weight: 700; letter-spacing: .12em;
  text-transform: uppercase; margin-bottom: 14px;
}
.lh-kicker-on-dark { color: var(--lh-pink); }
.lh-kicker-on-light { color: var(--lh-magenta); }

/* ============ Buttons & links ============ */
.lh-btn {
  display: inline-flex; align-items: center; justify-content: center;
  font-weight: 700; font-size: 16px; text-decoration: none;
  padding: 15px 30px; border-radius: 999px; border: 2px solid transparent;
  transition: opacity .2s ease, transform .2s ease;
}
.lh-btn:hover { opacity: .88; }
.lh-btn-white { background: #fff; color: var(--lh-ink); }
.lh-btn-white:hover { color: var(--lh-ink); }
.lh-btn-outline { border-color: var(--lh-lav); color: #fff; }
.lh-btn-outline:hover { color: #fff; }
.lh-btn-grad { background: var(--lh-grad); color: #fff; border: 0; cursor: pointer; font-family: inherit; }
.lh-btn-grad:hover { color: #fff; }
.lh-btn-small { padding: 11px 22px; font-size: 15px; }
.lh-link { font-weight: 700; font-size: 15px; }

/* ============ Header ============ */
.lh-header {
  display: flex; align-items: center; justify-content: space-between;
  padding: 24px clamp(20px, 5vw, 96px);
  position: relative;
}
.lh-logo img { height: 38px; width: auto; }
.lh-menu-toggle-input { display: none; }
.lh-menu-toggle { display: none; cursor: pointer; padding: 8px; }
.lh-nav { display: flex; align-items: center; gap: clamp(16px, 3vw, 36px); }
.lh-nav a:not(.lh-btn) { color: var(--lh-lav); font-size: 15px; font-weight: 600; padding: 8px 0; border-bottom: 2px solid transparent; }
.lh-nav a:not(.lh-btn):hover, .lh-nav a.is-active:not(.lh-btn) { color: #fff; }
.lh-nav a.is-active:not(.lh-btn) { border-bottom-color: var(--lh-pink); }
.lh-nav a.lh-btn { border-bottom: 0; }

@media (max-width: 860px) {
  .lh-menu-toggle { display: flex; }
  .lh-nav {
    position: absolute; top: 100%; left: 0; right: 0;
    background: var(--lh-ink); flex-direction: column; align-items: flex-start;
    gap: 4px; padding: 8px 20px 20px; display: none; z-index: 20;
  }
  .lh-nav a { width: 100%; padding: 12px 0; }
  .lh-nav a.lh-btn { width: auto; margin-top: 8px; }
  .lh-menu-toggle-input:checked ~ .lh-nav { display: flex; }
}

/* ============ Hero: Home (clean, type-led, no diagram — soft glow only) ============ */
.lh-hero { background: var(--lh-ink); position: relative; overflow: hidden; }
.lh-hero-glow {
  position: absolute; top: -20%; right: -10%; width: min(720px, 60vw); aspect-ratio: 1;
  background: radial-gradient(circle, rgba(160,90,230,.55) 0%, rgba(67,56,202,.28) 45%, transparent 72%);
  filter: blur(10px); pointer-events: none; z-index: 0;
}
.lh-hero-inner {
  position: relative; z-index: 1;
  padding: clamp(28px, 5vw, 48px) clamp(20px, 5vw, 96px) clamp(72px, 9vw, 120px);
}
.lh-hero-copy { max-width: 760px; display: flex; flex-direction: column; gap: 28px; }
.lh-hero-copy h1 { font-size: clamp(40px, 6vw, 76px); line-height: 1.04; color: #fff; }
.lh-hero-copy h1 span { background: linear-gradient(90deg,#C9C6F2,#F0ABFC); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--lh-pink); }
.lh-hero-sub { font-size: clamp(17px, 2.1vw, 22px); line-height: 1.55; color: var(--lh-lav); max-width: 560px; }
.lh-hero-actions { display: flex; gap: 16px; flex-wrap: wrap; }

/* ============ Hero: inner pages (text only) ============ */
.lh-hero-simple .lh-hero-inner { padding-top: 8px; padding-bottom: clamp(48px, 6vw, 72px); }
.lh-hero-simple .lh-hero-copy { max-width: 720px; gap: 20px; }
.lh-hero-simple h1 { font-size: clamp(34px, 4.4vw, 54px); line-height: 1.1; }

/* ============ Stat strip ============ */
.lh-stats-strip {
  background: var(--lh-ink);
  padding: clamp(36px, 5vw, 52px) clamp(20px, 5vw, 96px);
  display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  border-top: 1px solid rgba(255,255,255,.08);
}
.lh-stat {
  display: flex; flex-direction: column; gap: 10px;
  padding: 4px clamp(16px, 2.4vw, 32px);
  border-left: 1px solid rgba(255,255,255,.14);
}
.lh-stat:first-child { border-left: 0; padding-left: 0; }
.lh-stat-icon { color: var(--lh-pink); opacity: .9; }
.lh-stat-icon svg { width: 26px; height: 26px; }
.lh-stat-num { font-size: clamp(28px, 3.4vw, 40px); font-weight: 800; line-height: 1; letter-spacing: -0.02em;
  background: linear-gradient(90deg,#C9C6F2,#F0ABFC); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--lh-pink); }
.lh-stat-label { font-size: 14px; color: var(--lh-lav); max-width: 220px; }
@media (max-width: 640px) {
  .lh-stats-strip { grid-template-columns: 1fr; }
  .lh-stat { border-left: 0; border-top: 1px solid rgba(255,255,255,.14); padding: 20px 0 0; }
  .lh-stat:first-child { border-top: 0; padding-top: 0; }
}

/* ============ Intro (Home two-column) ============ */
.lh-intro {
  padding: clamp(56px, 7vw, 96px) clamp(20px, 5vw, 96px);
  display: flex; gap: clamp(40px, 6vw, 96px); flex-wrap: wrap;
}
.lh-intro-col { flex: 1 1 340px; display: flex; flex-direction: column; gap: 14px; }
.lh-intro-num { font-size: 15px; font-weight: 800; letter-spacing: .04em;
  background: var(--lh-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--lh-magenta); }
.lh-intro-col h2 { font-size: clamp(22px, 2.6vw, 28px); }
.lh-intro-col p { font-size: 16px; }

/* ============ CTA band ============ */
.lh-cta {
  position: relative; overflow: hidden; background: var(--lh-grad);
  padding: clamp(44px, 6vw, 64px) clamp(20px, 5vw, 96px);
  display: flex; align-items: center; justify-content: space-between; gap: clamp(24px, 5vw, 64px);
  flex-wrap: wrap;
}
.lh-cta-drop { position: absolute; right: 8%; top: -12%; opacity: .5; pointer-events: none; }
.lh-cta-drop svg { width: clamp(140px, 20vw, 300px); height: auto; }
.lh-cta-copy { position: relative; display: flex; flex-direction: column; gap: 12px; max-width: 640px; }
.lh-cta-copy h2 { font-size: clamp(28px, 4vw, 44px); line-height: 1.12; color: #fff; }
.lh-cta-copy p { font-size: clamp(16px, 2vw, 19px); color: #fff; }
.lh-cta .lh-btn { position: relative; }

/* ============ Footer ============ */
.lh-footer {
  background: var(--lh-ink);
  padding: clamp(32px, 5vw, 48px) clamp(20px, 5vw, 96px);
  display: flex; align-items: center; justify-content: space-between; gap: 24px; flex-wrap: wrap;
}
.lh-footer-brand { display: flex; flex-direction: column; gap: 16px; }
.lh-footer-brand img { height: 32px; width: auto; }
.lh-footer-copy { font-size: 14px; color: var(--lh-lav); }
.lh-footer-pages, .lh-footer-social { display: flex; gap: 20px; flex-wrap: wrap; }
.lh-footer-pages a, .lh-footer-social a { color: var(--lh-lav); font-size: 15px; font-weight: 600; }
.lh-footer-pages a:hover, .lh-footer-social a:hover { color: var(--lh-pink); }

/* ============ Section heading (generic, used across pages) ============ */
.lh-section-head { display: flex; flex-direction: column; gap: 14px; max-width: 720px; margin-bottom: clamp(32px, 5vw, 48px); }
.lh-section-head h2 { font-size: clamp(26px, 3.2vw, 38px); }
.lh-section-head p { font-size: 17px; }

/* ============ Numbered list (replaces icon-card grids everywhere) ============ */
.lh-numbered { border-top: 1px solid var(--lh-line); }
.lh-numbered-item {
  display: flex; gap: clamp(20px, 4vw, 40px); padding: clamp(24px, 3vw, 32px) 0;
  border-bottom: 1px solid var(--lh-line); align-items: flex-start;
}
.lh-num {
  flex: none; width: clamp(44px, 5vw, 64px); font-size: clamp(24px, 2.6vw, 30px); font-weight: 800;
  background: var(--lh-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--lh-magenta);
  line-height: 1.3;
}
.lh-numbered-item-body { flex: 1; display: flex; flex-direction: column; gap: 6px; }
.lh-numbered-item h3 { font-size: 19px; font-weight: 700; }
.lh-numbered-item p { font-size: 15.5px; max-width: 640px; }

/* ============ Tag row (competence labels, no card/icon) ============ */
.lh-tags { display: flex; flex-wrap: wrap; gap: 10px; }
.lh-tag {
  display: inline-flex; align-items: center; border: 1.5px solid var(--lh-line); border-radius: 999px;
  padding: 9px 18px; font-size: 14.5px; font-weight: 700; color: var(--lh-ink);
}
.lh-tags-tight { margin: 4px 0 6px; }
.lh-tag-sm { padding: 6px 14px; font-size: 13.5px; font-weight: 600; color: var(--lh-slate); border-color: var(--lh-line); }

/* ============ Services: detailed per-service copy (SEO) ============ */
.lh-service-details { display: flex; flex-direction: column; gap: clamp(28px, 4vw, 40px); }
.lh-service-detail { max-width: 760px; display: flex; flex-direction: column; gap: 8px; }
.lh-service-detail h3 { font-size: 21px; font-weight: 700; }
.lh-service-detail p { font-size: 16px; }

/* ============ Pull quote ============ */
.lh-pull-quote { display: flex; flex-direction: column; gap: 18px; max-width: 780px; }
.lh-pull-quote-mark {
  font-size: 64px; line-height: .6; font-weight: 800;
  background: var(--lh-grad); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: var(--lh-magenta);
}
.lh-pull-quote blockquote { margin: 0; font-size: clamp(20px, 2.6vw, 27px); line-height: 1.42; font-weight: 700; color: var(--lh-ink); letter-spacing: -0.01em; }
.lh-pull-quote figcaption { display: flex; align-items: center; gap: 14px; margin-top: 4px; }
.lh-pq-photo {
  flex: none; width: 52px; height: 52px; border-radius: 50%; background: var(--lh-lav); color: var(--lh-ink);
  display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: 800; overflow: hidden;
}
.lh-pq-name { font-size: 15px; font-weight: 700; color: var(--lh-ink); }
.lh-pq-role { font-size: 14px; color: var(--lh-slate); }

/* ============ About: intro split (text + stats moved to strip) ============ */
.lh-split {
  padding: clamp(56px, 7vw, 88px) clamp(20px, 5vw, 96px);
  display: flex; gap: clamp(40px, 6vw, 96px); flex-wrap: wrap; align-items: flex-start;
}
.lh-split-text { flex: 1 1 380px; display: flex; flex-direction: column; gap: 16px; font-size: 17px; max-width: 620px; }
.lh-split-quote { flex: 1 1 380px; max-width: 520px; }

/* ============ About: person credit line ============ */
.lh-person-credit { display: flex; align-items: center; gap: 16px; padding: 0 clamp(20px, 5vw, 96px) clamp(56px, 7vw, 88px); }
.lh-person-credit-photo {
  flex: none; width: 64px; height: 64px; border-radius: 50%; background: var(--lh-lav); color: var(--lh-ink);
  display: flex; align-items: center; justify-content: center; font-size: 18px; font-weight: 800; overflow: hidden;
}
.lh-badge { display: inline-flex; align-items: center; gap: 8px; background: var(--lh-mist); border-radius: 999px; padding: 8px 16px; font-size: 13.5px; font-weight: 600; color: var(--lh-ink); margin-top: 4px; }

/* ============ Services sections ============ */
.lh-services-intro { padding: clamp(56px, 7vw, 88px) clamp(20px, 5vw, 96px) 0; display: flex; flex-direction: column; gap: 24px; }
.lh-services-body { padding: clamp(24px, 3vw, 32px) clamp(20px, 5vw, 96px) 0; max-width: 780px; display: flex; flex-direction: column; gap: 16px; font-size: 17px; }
.lh-section { padding: clamp(56px, 7vw, 88px) clamp(20px, 5vw, 96px); }
.lh-service-details { padding-top: clamp(32px, 4vw, 48px); }
.lh-section-mist { background: var(--lh-mist); }

/* ============ Contact ============ */
.lh-contact {
  position: relative; overflow: hidden;
  padding: clamp(48px, 6vw, 72px) clamp(20px, 5vw, 96px);
  display: flex; gap: clamp(32px, 6vw, 96px); flex-wrap: wrap;
}
.lh-contact-watermark {
  position: absolute; right: -6%; top: 50%; transform: translateY(-50%);
  width: clamp(220px, 26vw, 380px); color: var(--lh-indigo); opacity: .05; pointer-events: none; z-index: 0;
}
.lh-contact-form, .lh-contact-details { position: relative; z-index: 1; }
.lh-contact-form { flex: 1 1 420px; max-width: 620px; }
.lh-contact-form form { display: flex; flex-direction: column; gap: 20px; }
.lh-hp-wrap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.lh-field { display: flex; flex-direction: column; gap: 8px; }
.lh-field label { font-size: 14px; font-weight: 700; color: var(--lh-ink); }
.lh-field input, .lh-field textarea {
  width: 100%; border: 1.5px solid var(--lh-line); border-radius: 10px;
  padding: 14px 16px; font-size: 16px; font-family: inherit; color: var(--lh-ink); background: #fff;
}
.lh-field textarea { resize: vertical; min-height: 120px; }
.lh-field input:focus, .lh-field textarea:focus { outline: 0; border-color: var(--lh-indigo); box-shadow: 0 0 0 3px rgba(67,56,202,.16); }
.lh-form-notice { padding: 14px 18px; border-radius: 10px; font-size: 15px; margin-bottom: 4px; }
.lh-form-notice-ok { background: #E7F9F1; color: #0F6D45; }
.lh-form-notice-err { background: #FDEBEE; color: #A21C3A; }
.lh-contact-details {
  flex: 1 1 300px; max-width: 400px; display: flex; flex-direction: column; gap: 24px; align-self: flex-start;
  padding-top: 4px;
}
.lh-detail-row { display: flex; flex-direction: column; gap: 2px; }
.lh-detail-label { font-size: 13px; color: var(--lh-slate); text-transform: uppercase; letter-spacing: .04em; }
.lh-detail-value { font-size: 17px; font-weight: 700; color: var(--lh-ink); }
.lh-contact-social { display: flex; flex-direction: column; gap: 12px; padding-top: 8px; border-top: 1px solid var(--lh-line); }
.lh-contact-social-label { font-size: 13px; font-weight: 700; color: var(--lh-slate); text-transform: uppercase; letter-spacing: .04em; }
.lh-contact-social-links { display: flex; gap: 10px; flex-wrap: wrap; }
.lh-contact-social-links a {
  display: inline-flex; align-items: center; border: 1.5px solid var(--lh-line); color: var(--lh-ink);
  font-size: 14px; font-weight: 700; padding: 8px 16px; border-radius: 999px;
}
.lh-contact-social-links a:hover { color: #fff; background: var(--lh-grad); border-color: transparent; }

/* ============ Contact: "what happens next" ============ */
.lh-next { background: var(--lh-mist); padding: clamp(56px, 7vw, 88px) clamp(20px, 5vw, 96px); }

/* ============ Print / reduced motion ============ */
@media (prefers-reduced-motion: reduce) { .lh-page *, .lh-page *::before, .lh-page *::after { transition: none !important; animation: none !important; } }
::selection { background: var(--lh-pink); color: var(--lh-ink); }
