/* Travmy — clinical-premium design for landing pages & expanded articles.
   Scoped to .seo-landing / .seo-article. Brand: green #19ce67, navy #122738. */

.seo-landing, .seo-article{
  --tw-green:#19ce67; --tw-green-d:#12a653; --tw-navy:#122738; --tw-ink:#26313a;
  --tw-muted:#67757f; --tw-bg:#f2f9fc; --tw-line:#e4edf2;
  max-width:880px; margin:0 auto; color:var(--tw-ink);
  font-size:17px; line-height:1.78;
  -webkit-font-smoothing:antialiased;
}

/* ---- typography ---- */
.seo-landing h1, .seo-article h1{
  font-size:clamp(27px,3.4vw,38px); line-height:1.18; color:var(--tw-navy);
  font-weight:800; letter-spacing:-.015em; margin:.1em 0 .7em;
}
.seo-landing h2, .seo-article h2{
  font-size:clamp(21px,2.4vw,26px); color:var(--tw-navy); font-weight:750;
  letter-spacing:-.01em; margin:2.1em 0 .55em; padding-bottom:.32em; position:relative;
}
.seo-landing h2::after, .seo-article h2::after{
  content:""; position:absolute; left:0; bottom:0; width:54px; height:3px;
  background:var(--tw-green); border-radius:3px;
}
.seo-landing h3, .seo-article h3{
  font-size:19px; color:var(--tw-navy); font-weight:700; margin:1.5em 0 .3em; line-height:1.42;
}
.seo-landing h4, .seo-article h4{
  font-size:17.5px; color:var(--tw-navy); font-weight:700; margin:1.3em 0 .25em; line-height:1.45;
}
.seo-landing h5, .seo-article h5{
  font-size:14px; color:var(--tw-muted); font-weight:700; text-transform:uppercase;
  letter-spacing:.08em; margin:1.2em 0 .25em;
}
.seo-landing h6, .seo-article h6{
  font-size:13.5px; color:var(--tw-muted); font-weight:600; margin:1.1em 0 .25em;
}
.seo-landing p, .seo-article p{ margin:.55em 0 1em; }
.seo-landing strong, .seo-article strong{ color:var(--tw-navy); }
.seo-landing a, .seo-article a{ color:var(--tw-green-d); text-decoration:none; border-bottom:1px solid rgba(25,206,103,.35); transition:.18s; }
.seo-landing a:hover, .seo-article a:hover{ color:var(--tw-navy); border-bottom-color:var(--tw-navy); }

/* ---- lists with green check markers ---- */
.seo-landing ul, .seo-article ul{ list-style:none; padding-left:0; margin:1em 0 1.3em; }
.seo-landing ul li, .seo-article ul li{
  position:relative; padding:.16em 0 .16em 2.3em !important; margin:.38em 0 !important;
  list-style:none !important; box-sizing:border-box;
}
.seo-landing ul li::before, .seo-article ul li::before{
  content:"✓"; position:absolute; left:0; top:.18em;
  width:1.45em; height:1.45em; line-height:1.45em; text-align:center;
  font-size:.74em; font-weight:800; color:#fff; background:var(--tw-green);
  border-radius:50%; box-shadow:0 2px 6px rgba(25,206,103,.4);
}
/* don't add our check marker to Shortcodes-Ultimate lists (they have own absolute icon
   at left:0 + native padding-left:2em — keep that, just suppress our ✓ ::before) */
.seo-article .su-list ul li::before, .seo-landing .su-list ul li::before{ content:none !important; display:none !important; }
.seo-article .su-list ul li, .seo-landing .su-list ul li{ padding-left:2em !important; }
/* force single-column block lists (some content/theme CSS renders them multi-column) */
.seo-article ul, .seo-landing ul, .seo-article ol, .seo-landing ol{
  columns:1 !important; column-count:1 !important; -webkit-columns:1 !important;
  display:block !important;
}
.seo-article ul > li, .seo-landing ul > li, .seo-article ol > li, .seo-landing ol > li{
  display:list-item !important; width:auto !important; max-width:none !important;
  float:none !important; vertical-align:baseline;
}
.seo-landing ol, .seo-article ol{ padding-left:1.3em; margin:1em 0 1.3em; }
.seo-landing ol li, .seo-article ol li{ margin:.4em 0; padding-left:.2em; }
.seo-landing ol li::marker, .seo-article ol li::marker{ color:var(--tw-green-d); font-weight:800; }

/* ---- PRICE BOX (override inline) ---- */
.seo-landing .price-box, .seo-article .price-box{
  background:#fff !important; border:1px solid var(--tw-line) !important;
  border-radius:18px !important; padding:34px 28px 30px !important;
  margin:26px 0 !important; text-align:center; position:relative; overflow:hidden;
  box-shadow:0 14px 38px -18px rgba(18,39,56,.32);
}
.seo-landing .price-box::before, .seo-article .price-box::before{
  content:""; position:absolute; top:0; left:0; right:0; height:5px;
  background:linear-gradient(90deg,var(--tw-green),#3fe089);
}
.price-box > div:first-child{ text-transform:uppercase; letter-spacing:.14em; font-size:12.5px !important; font-weight:700; color:var(--tw-muted) !important; }
.price-box > div:nth-child(2){ font-size:clamp(32px,5vw,44px) !important; font-weight:800 !important; color:var(--tw-navy) !important; margin:.12em 0 !important; letter-spacing:-.02em; }
.price-box > div:last-child{ font-size:14px !important; color:var(--tw-muted) !important; }

/* ---- CTA (override amber inline -> on-brand navy) ---- */
.seo-landing .cta, .seo-article .cta{
  background:radial-gradient(120% 140% at 0% 0%,#1c3a52 0%,var(--tw-navy) 55%) !important;
  border-radius:18px !important; padding:38px 30px !important; margin:34px 0 !important;
  text-align:center; position:relative; overflow:hidden;
  box-shadow:0 18px 44px -20px rgba(18,39,56,.55);
}
.seo-landing .cta::after, .seo-article .cta::after{
  content:""; position:absolute; right:-60px; top:-60px; width:200px; height:200px;
  background:radial-gradient(circle,rgba(25,206,103,.28),transparent 70%); pointer-events:none;
}
.cta h2{ color:#fff !important; margin-top:0 !important; }
.cta h2::after{ display:none; }
.cta p{ color:#cdd9e2 !important; }
.cta a{
  display:inline-flex; align-items:center; gap:.5em;
  background:var(--tw-green); color:#fff !important;
  padding:.55em 1.15em; border-radius:999px; border:0 !important; font-weight:800;
  box-shadow:0 8px 22px -6px rgba(25,206,103,.7); transition:transform .18s, box-shadow .18s;
}
.cta a::before{
  content:""; width:1.05em; height:1.05em; flex:0 0 auto;
  background:url("data:image/svg+xml,%3Csvg%20xmlns='http://www.w3.org/2000/svg'%20viewBox='0%200%2024%2024'%3E%3Cpath%20fill='%23ffffff'%20d='M6.6%2010.8c1.4%202.8%203.8%205.2%206.6%206.6l2.2-2.2c.3-.3.7-.4%201-.2%201.1.4%202.4.6%203.6.6.6%200%201%20.4%201%201V20c0%20.6-.4%201-1%201C10.6%2021%203%2013.4%203%204c0-.6.4-1%201-1h3.5c.6%200%201%20.4%201%201%200%201.3.2%202.5.6%203.6.1.3%200%20.7-.2%201l-2.3%202.2z'/%3E%3C/svg%3E") center/contain no-repeat;
}
.cta a:hover{ transform:translateY(-2px); box-shadow:0 12px 28px -6px rgba(25,206,103,.85); }

/* ---- TRUST block (override inline) ---- */
.seo-landing .trust, .seo-article .trust{
  background:linear-gradient(180deg,#f4fbf6,#eef7fb) !important;
  border:1px solid var(--tw-line) !important; border-radius:16px !important;
  padding:24px 26px !important; margin:26px 0 !important;
}
.trust h2{ margin-top:0 !important; }

/* ---- RELATED ("Читайте також") ---- */
.seo-landing .twn-related, .seo-article .twn-related{
  background:#fff !important; border:1px solid var(--tw-line) !important;
  border-left:4px solid var(--tw-green) !important; border-radius:12px !important;
  padding:20px 24px !important; margin:30px 0 !important;
  box-shadow:0 8px 24px -16px rgba(18,39,56,.3);
}
.twn-related strong{ color:var(--tw-navy) !important; font-size:17px !important; }
.twn-related ul{ margin:.4em 0 0 !important; }
.twn-related ul li{ padding:.3em 0 .3em 1.5em !important; }
.twn-related ul li::before{ content:"→"; background:none !important; color:var(--tw-green-d) !important; box-shadow:none !important; font-weight:800; top:.18em; }
.twn-related a{ border-bottom:0; }
.twn-related a:hover{ padding-left:3px; }

/* ---- tables (price / comparison) ---- */
.seo-article table, .seo-landing table{
  width:100%; border-collapse:collapse; margin:22px 0; font-size:16px;
  border:1px solid #e4edf2; border-radius:12px; overflow:hidden;
  box-shadow:0 10px 28px -20px rgba(18,39,56,.25);
}
.seo-article thead th, .seo-landing thead th{
  background:#122738; color:#fff; text-align:left; padding:14px 16px; font-weight:700; font-size:15px;
}
.seo-article td, .seo-article th, .seo-landing td, .seo-landing th{
  padding:12px 16px; border-bottom:1px solid #eef3f6; vertical-align:top;
}
.seo-article tbody tr:nth-child(even), .seo-landing tbody tr:nth-child(even){ background:#f7fbfd; }
.seo-article tbody tr:last-child td, .seo-landing tbody tr:last-child td{ border-bottom:0; }
.seo-article td strong, .seo-landing td strong{ color:#12a653; white-space:nowrap; }
@media (max-width:600px){ .seo-article table, .seo-landing table{ font-size:14px; } .seo-article td,.seo-article th{ padding:9px 10px; } }

/* ---- entrance animation ---- */
@media (prefers-reduced-motion:no-preference){
  .seo-landing > *, .seo-article > *{ animation:twnUp .5s ease both; }
  .seo-landing > *:nth-child(2), .seo-article > *:nth-child(2){ animation-delay:.05s; }
  .seo-landing > *:nth-child(3), .seo-article > *:nth-child(3){ animation-delay:.1s; }
  .seo-landing > *:nth-child(4), .seo-article > *:nth-child(4){ animation-delay:.15s; }
  @keyframes twnUp{ from{opacity:0; transform:translateY(12px);} to{opacity:1; transform:none;} }
}

/* ============================================================
   GLOBAL / HOMEPAGE polish (medic Elementor widgets) — pass 1
   ============================================================ */

/* premium green pill buttons (site-wide cohesion) */
.medic-default-btn,
a.medic-default-btn,
.banner-btn .medic-default-btn{
  border-radius:999px !important;
  font-weight:700 !important; letter-spacing:.01em;
  box-shadow:0 10px 24px -8px rgba(25,206,103,.55) !important;
  transition:transform .18s ease, box-shadow .18s ease, background-color .18s ease !important;
}
.medic-default-btn:hover,
a.medic-default-btn:hover{
  transform:translateY(-2px) !important;
  box-shadow:0 14px 30px -8px rgba(25,206,103,.7) !important;
}

/* green eyebrow above section titles */
.top-title{
  color:#12a653 !important; font-weight:800 !important;
  text-transform:uppercase; letter-spacing:.12em;
}

/* section titles -> navy, refined */
.section-title h2, .section-title .title, .department-title, .accordion-title{
  color:#122738 !important; letter-spacing:-.01em;
}

/* bottom SEO text-editor sections -> readable clinical typography */
.elementor-widget-text-editor{
  color:#26313a; line-height:1.78;
}
.elementor-widget-text-editor h2,
.elementor-widget-text-editor h3,
.elementor-widget-text-editor h4{
  color:#122738; font-weight:750; letter-spacing:-.01em;
  margin:1.4em 0 .5em; line-height:1.3;
}
.elementor-widget-text-editor h2{ position:relative; padding-bottom:.3em; }
.elementor-widget-text-editor h2::after{
  content:""; position:absolute; left:0; bottom:0; width:54px; height:3px;
  background:#19ce67; border-radius:3px;
}
.elementor-widget-text-editor p{ margin:.5em 0 1em; }
.elementor-widget-text-editor a{ color:#12a653; }

/* ---- HERO: photo anchored to banner bottom, fully visible (head not clipped) ---- */
.banner-area{ height:auto !important; min-height:500px !important; overflow:hidden; }
/* theme anchors .banner-img to .col-lg-6 (position:relative); make it static so the
   photo anchors to the whole banner-area, sits on its bottom and the head clears the nav */
.banner-area .col-lg-6{ position:static !important; }
.banner-img{ position:absolute !important; right:0 !important; left:auto !important;
  top:auto !important; bottom:0 !important; height:auto !important; }
.banner-img img{ max-height:440px !important; width:auto !important; height:auto !important; display:block; }
.banner-content h1{ font-size:clamp(30px,4vw,46px) !important; color:#122738 !important; letter-spacing:-.015em; }
@media (max-width:991px){ .banner-area{ min-height:auto !important; padding:30px 0 0 !important; }
  .banner-img{ position:static !important; }
  .banner-img img{ max-height:340px !important; margin:0 auto; } }

/* ---- DEPARTMENT cards (Наші Центри) ---- */
.single-services{
  background:#fff; border:1px solid var(--tw-line); border-radius:16px !important;
  overflow:hidden; box-shadow:0 14px 34px -20px rgba(18,39,56,.28);
  transition:transform .2s ease, box-shadow .2s ease; height:100%;
}
.single-services:hover{ transform:translateY(-4px); box-shadow:0 20px 44px -20px rgba(18,39,56,.4); }
.single-services .post-image img{ border-radius:0 !important; }
.single-services .department-title{ color:#122738 !important; font-weight:750; }
.single-services .read-more{ color:#12a653 !important; font-weight:700; }
/* featured (green) card keeps its accent but unified radius/shadow */
.single-services.active, .single-services.bg-color{ box-shadow:0 18px 40px -18px rgba(25,206,103,.5); }

/* ---- COUNTER cards (stats) ---- */
.single-counter{
  background:#fff; border:1px solid var(--tw-line); border-radius:14px;
  padding:26px 16px !important; box-shadow:0 10px 28px -20px rgba(18,39,56,.25);
  transition:transform .2s ease; height:100%;
}
.single-counter:hover{ transform:translateY(-3px); }

/* ---- TESTIMONIAL cards ---- */
.single-testimonial{
  background:#fff !important; border:1px solid var(--tw-line); border-radius:16px !important;
  padding:30px 28px !important; box-shadow:0 14px 34px -20px rgba(18,39,56,.26);
  margin:10px; position:relative;
}
.single-testimonial::before{
  content:"“"; position:absolute; top:6px; right:22px; font-size:64px; line-height:1;
  color:var(--tw-green); opacity:.18; font-family:Georgia,serif;
}

/* ---- CONTACT info cards ---- */
.single-contact-info{
  background:#fff !important; border:1px solid #e4edf2 !important; border-radius:14px !important;
  padding:26px 22px !important; box-shadow:0 12px 30px -20px rgba(18,39,56,.28);
  transition:transform .2s ease, box-shadow .2s ease; height:100%;
}
.single-contact-info:hover{ transform:translateY(-3px); box-shadow:0 18px 38px -20px rgba(18,39,56,.4); }

/* ---- FAQ accordion ---- */
.faq-accordion .accordion-item{
  background:#fff !important; border:1px solid #e4edf2 !important; border-radius:12px !important;
  margin-bottom:12px !important; overflow:hidden; box-shadow:0 8px 22px -18px rgba(18,39,56,.22);
}
.faq-accordion .accordion-title{ color:#122738 !important; font-weight:700 !important; }
.faq-accordion .accordion-item.active .accordion-title, .faq-accordion .accordion-title:hover{ color:#12a653 !important; }

/* ---- form inputs (CF7 contact/appointment) ---- */
/* note: NOT overriding padding — theme uses padding-left:50px to clear the field icon */
.form-control, .wpcf7 input:not([type=submit]), .wpcf7 textarea{
  border:1px solid #e4edf2 !important; border-radius:10px !important;
  transition:border-color .18s, box-shadow .18s;
}
.form-control:focus, .wpcf7 input:focus, .wpcf7 textarea:focus{
  border-color:#19ce67 !important; box-shadow:0 0 0 3px rgba(25,206,103,.15) !important; outline:none;
}

/* ---- section rhythm: consistent vertical spacing ---- */
.services-area.ptb-70, .counter-area.ptb-70, .appointment-area.ptb-70,
.faq-area.ptb-70, .testimonial-area.ptb-70{ padding-top:64px !important; padding-bottom:64px !important; }

/* ---- responsive ---- */
@media (max-width:600px){
  .seo-landing, .seo-article{ font-size:16px; }
  .seo-landing .cta, .seo-article .cta{ padding:28px 20px !important; }
  .seo-landing .price-box, .seo-article .price-box{ padding:26px 18px !important; }
}
