/* ==========================================================================
   TAANUS Homepage — owner-approved reference rebuild (2026-08-26)
   Wide premium layout, watery botanical identity, real DB data only.
   Scoped under .th-* to avoid touching other pages.
   ========================================================================== */

/* ---------- shared wide container for homepage sections ---------- */
.th-hero .container,
.th-stats .container,
.th-section > .container,
.th-final-cta-wrap .container{max-width:1240px;}

.taanus-btn-light{background:#fff;color:#17332C;border-color:#fff}
.taanus-btn-light:hover{background:#F0F8F4}
.taanus-btn-outline-light{background:transparent;color:#fff;border-color:rgba(255,255,255,.65)}
.taanus-btn-outline-light:hover{background:rgba(255,255,255,.12)}

/* ============================= HERO ============================= */
.th-hero{
  position:relative;overflow:hidden;
  background:
    radial-gradient(900px 480px at 88% -10%, rgba(101,191,166,.16), transparent 60%),
    radial-gradient(700px 420px at -5% 110%, rgba(244,162,97,.10), transparent 55%),
    linear-gradient(180deg,#FBF9F4 0%,#F2F9F4 55%,#FFFDF7 100%);
}
.th-hero::before{ /* watery organic curve */
  content:"";position:absolute;inset-inline-start:-10%;top:-30%;width:46%;height:150%;
  background:radial-gradient(closest-side, rgba(101,191,166,.14), transparent);
  border-radius:50%;
}
.th-hero::after{
  content:"";position:absolute;inset-inline-end:-6%;bottom:-45%;width:40%;height:120%;
  border:1.5px solid rgba(76,175,125,.14);border-radius:50% 50% 50% 50%/60% 60% 40% 40%;
}
.th-hero-grid{
  position:relative;z-index:1;display:grid;direction:ltr;
  grid-template-columns:minmax(0,.94fr) minmax(0,1.06fr);
  grid-template-areas:"copy art";align-items:center;gap:48px;
  padding-top:56px;padding-bottom:72px;min-height:600px;
}
.th-hero-copy{grid-area:copy;direction:rtl;text-align:right;max-width:560px;justify-self:start}
.th-hero-copy h1{
  margin:18px 0;color:#071F28;font-size:clamp(2.6rem,3.6vw,3.7rem);
  line-height:1.16;font-weight:800;letter-spacing:-.02em;
}
.th-hero-copy h1 em{color:#246F59;font-style:normal}
.th-hero-lead{margin:0 0 26px;color:#526965;font-size:1.05rem;line-height:1.95;max-width:52ch}

.th-trust-row{
  display:flex;gap:22px;flex-wrap:wrap;margin:26px 0 0;padding:0;list-style:none;
  color:#3E5B53;font-size:.85rem;font-weight:700;
}
.th-trust-row li{display:inline-flex;align-items:center;gap:.45rem}
.th-trust-row svg{width:17px;height:17px;color:#27836C;flex:0 0 17px}

/* Hero art — large, feathered organic edges */
.th-hero-art{grid-area:art;position:relative;min-height:480px}
.th-hero-img{
  width:min(100%,680px);height:auto;object-fit:contain;
  border-radius:38% 62% 55% 45%/45% 42% 58% 55%; /* soft non-rectangular mask */
  box-shadow:0 34px 70px rgba(23,60,49,.13);
}
.th-hero-blob{position:absolute;pointer-events:none;border-radius:50%}
.th-blob-a{inset-inline-end:-40px;top:-30px;width:130px;height:130px;background:radial-gradient(closest-side,rgba(244,162,97,.20),transparent)}
.th-blob-b{inset-inline-start:-30px;bottom:6px;width:170px;height:170px;border:1.5px solid rgba(76,175,125,.20)}

/* ============================= STATS ============================= */
.th-stats{position:relative;z-index:5;margin-top:-34px;padding-bottom:64px}
.th-stats-card{
  display:grid;grid-template-columns:repeat(4,1fr);gap:8px;
  background:#fff;border:1px solid #EAF1EC;border-radius:22px;
  padding:26px 22px;box-shadow:0 20px 44px rgba(23,60,49,.08);
}
.th-stat{display:flex;align-items:center;gap:.85rem;justify-content:center;padding:.35rem .5rem}
.th-stat + .th-stat{border-inline-start:1px solid #EEF4F0}
.th-stat-icon{width:44px;height:44px;border-radius:13px;display:flex;align-items:center;justify-content:center;flex:0 0 44px}
.th-stat-icon svg{width:22px;height:22px}
.th-stat-icon.smile{background:#E4F3EA;color:#2D9A69}
.th-stat-icon.building{background:#E6F2FC;color:#2787D2}
.th-stat-icon.branch{background:#FFF0D9;color:#E8942E}
.th-stat-icon.rating{background:#F3EFFC;color:#8A6FD6}
.th-stat strong{display:block;font-size:1.5rem;font-weight:800;color:#071F28;line-height:1.15}
.th-stat small{color:#72817D;font-size:.78rem;font-weight:600}

/* ============================= SECTIONS ============================= */
.th-section{padding:74px 0}
.th-section-head{text-align:center;max-width:640px;margin:0 auto 44px}
.th-section-head h2{margin:0 0 10px;color:#071F28;font-size:clamp(1.7rem,2.4vw,2.25rem);font-weight:800;letter-spacing:-.01em}
.th-section-head p{margin:0;color:#6B807A;font-size:.98rem;line-height:1.85}

/* alternating watery section backgrounds */
.th-features{background:linear-gradient(180deg,#FFFDF7,#F4FAF6)}
.th-why{background:
  radial-gradient(700px 340px at 105% 20%, rgba(101,191,166,.09), transparent 60%),
  #FBF9F3;}
.th-how{background:#F2F9F4}
.th-audiences{background:#FBF9F3}
.th-testimonials{background:linear-gradient(180deg,#F4FAF6,#FFFDF7)}
.th-pricing{background:
  radial-gradient(800px 380px at 0% 100%, rgba(101,191,166,.08), transparent 55%),
  #FBF9F3;}
.th-faq{background:#FFFDF7}

/* ============================= FEATURES ============================= */
.th-feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(212px,1fr));gap:20px}
.th-feature-card{
  background:#fff;border:1px solid #EDF3EF;border-radius:20px;padding:28px 22px;
  box-shadow:0 10px 26px rgba(23,60,49,.05);transition:transform .25s,box-shadow .25s;
  display:flex;flex-direction:column;
}
.th-feature-card:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(23,60,49,.10)}
.th-f-icon{width:52px;height:52px;border-radius:15px;display:flex;align-items:center;justify-content:center;margin-bottom:16px}
.th-f-icon svg{width:26px;height:26px}
.th-f-icon.mint{background:#E4F3EA;color:#2D9A69}
.th-f-icon.gold{background:#FFF0D9;color:#E8942E}
.th-f-icon.sky{background:#E6F2FC;color:#2787D2}
.th-f-icon.peach{background:#FFEDE4;color:#E4744B}
.th-f-icon.teal{background:#E4F6F8;color:#2A97AA}
.th-feature-card h3{margin:0 0 8px;font-size:1.02rem;font-weight:800;color:#132A24}
.th-feature-card p{margin:0;color:#6B807A;font-size:.86rem;line-height:1.8;flex:1}
.th-more{display:inline-block;margin-top:14px;color:#246F59;font-size:.82rem;font-weight:700;text-decoration:none}
.th-more:hover{text-decoration:underline}

/* ============================= WHY ============================= */
.th-why-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:18px}
.th-why-item{
  display:flex;gap:16px;align-items:flex-start;background:#fff;border-radius:18px;
  border:1px solid #EDF3EF;padding:22px;box-shadow:0 8px 22px rgba(23,60,49,.04);
}
.th-w-icon{
  flex:0 0 46px;width:46px;height:46px;border-radius:50%;
  background:linear-gradient(145deg,#E4F3EA,#D3EBDF);color:#246F59;
  display:flex;align-items:center;justify-content:center;
}
.th-w-icon svg{width:22px;height:22px}
.th-why-item h3{margin:0 0 5px;font-size:.98rem;font-weight:800;color:#132A24}
.th-why-item p{margin:0;color:#6B807A;font-size:.84rem;line-height:1.75}

/* ============================= HOW IT WORKS ============================= */
.th-steps{
  list-style:none;margin:0;padding:0;display:grid;
  grid-template-columns:repeat(3,1fr);gap:22px;counter-reset:step;
}
.th-step{
  position:relative;background:#fff;border:1px solid #E7F0EA;border-radius:22px;
  padding:34px 26px 28px;text-align:center;box-shadow:0 12px 28px rgba(23,60,49,.06);
}
.th-step:not(:last-child)::after{ /* connector arrow */
  content:"←";position:absolute;top:50%;inset-inline-end:-24px;transform:translateY(-50%);
  font-size:1.3rem;color:#65BFA6;font-weight:700;
}
[dir="ltr"] .th-step:not(:last-child)::after{content:"→";inset-inline-end:auto;inset-inline-start:-24px}
.th-step-num{
  position:absolute;top:-16px;inset-inline-start:22px;background:#246F59;color:#fff;
  font-weight:800;font-size:.82rem;padding:.3rem .75rem;border-radius:999px;letter-spacing:.05em;
}
.th-step-icon{
  width:64px;height:64px;margin:6px auto 16px;border-radius:20px;display:flex;align-items:center;justify-content:center;
  background:linear-gradient(145deg,#E4F3EA,#D3EBDF);color:#246F59;
}
.th-step-icon svg{width:30px;height:30px}
.th-step h3{margin:0 0 8px;font-size:1.05rem;font-weight:800;color:#132A24}
.th-step p{margin:0 auto;color:#6B807A;font-size:.86rem;line-height:1.8;max-width:30ch}

/* ============================= AUDIENCES ============================= */
.th-aud-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}
.th-aud-card{
  text-align:center;background:#fff;border:1px solid #EDF3EF;border-radius:22px;
  padding:32px 22px;box-shadow:0 10px 24px rgba(23,60,49,.05);transition:transform .25s;
}
.th-aud-card:hover{transform:translateY(-4px)}
.th-aud-icon{
  width:74px;height:74px;margin:0 auto 16px;border-radius:50%;display:flex;align-items:center;justify-content:center;
}
.th-aud-icon svg{width:34px;height:34px}
.aud-owner .th-aud-icon{background:#E4F3EA;color:#2D9A69}
.aud-admin .th-aud-icon{background:#E6F2FC;color:#2787D2}
.aud-teacher .th-aud-icon{background:#FFF0D9;color:#E8942E}
.aud-parent .th-aud-icon{background:#FFEDE4;color:#E4744B}
.th-aud-card h3{margin:0 0 8px;font-size:1rem;font-weight:800;color:#132A24}
.th-aud-card p{margin:0;color:#6B807A;font-size:.84rem;line-height:1.75}

/* ============================= TESTIMONIALS ============================= */
.th-testi-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(290px,1fr));gap:20px}
.th-testi-card{
  margin:0;background:#fff;border:1px solid #EDF3EF;border-radius:20px;padding:26px;
  box-shadow:0 10px 24px rgba(23,60,49,.05);
}
.th-stars{display:flex;gap:3px;color:#F0B429;margin-bottom:12px}
.th-stars svg{width:16px;height:16px}
.th-testi-card blockquote{margin:0 0 16px;color:#3E5B53;font-size:.92rem;line-height:1.9}
.th-testi-card figcaption{display:flex;align-items:center;gap:.7rem}
.th-avatar{
  width:42px;height:42px;border-radius:50%;flex:0 0 42px;display:flex;align-items:center;justify-content:center;
  background:#E4F3EA;color:#246F59;font-weight:800;font-size:.85rem;
}
.th-testi-card figcaption strong{display:block;font-size:.88rem;color:#132A24}
.th-testi-card figcaption small{color:#8AA098;font-size:.74rem}

/* ============================= PRICING (homepage cards) ============================= */
.th-plan-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;max-width:980px;margin:0 auto}
.th-plan-card{
  position:relative;background:#fff;border:1.5px solid #E7F0EA;border-radius:24px;
  padding:32px 26px;text-align:center;box-shadow:0 14px 32px rgba(23,60,49,.06);
}
.th-plan-card.featured{border-color:#246F59;box-shadow:0 20px 44px rgba(36,111,89,.14)}
.th-plan-badge{
  position:absolute;top:-13px;inset-inline-start:50%;transform:translateX(50%);
  background:#246F59;color:#fff;font-size:.72rem;font-weight:800;padding:.32rem .95rem;border-radius:999px;white-space:nowrap;
}
[dir="ltr"] .th-plan-badge{transform:translateX(-50%)}
.th-plan-card h3{margin:0 0 12px;font-size:1.12rem;font-weight:800;color:#132A24}
.th-plan-price{font-size:1.9rem;font-weight:800;color:#071F28;margin-bottom:16px;line-height:1.1}
.th-plan-price span{font-size:.78rem;color:#72817D;font-weight:600}
.th-plan-card ul{list-style:none;margin:0 0 22px;padding:0;text-align:start}
.th-plan-card li{padding:.42rem 0;color:#526965;font-size:.85rem;border-bottom:1px dashed #EEF4F0}
.th-plan-card li:last-child{border-bottom:0}
.th-plans-link{text-align:center;margin-top:26px}
.th-plans-link a{color:#246F59;font-weight:700;text-decoration:none}
.th-plans-link a:hover{text-decoration:underline}

/* ============================= FAQ ============================= */
.th-faq-cols{display:grid;grid-template-columns:1fr 1fr;gap:0 40px;max-width:1080px;margin:0 auto;align-items:start}
.th-faq-list{display:flex;flex-direction:column;gap:12px}
.th-faq-item{
  background:#fff;border:1px solid #EDF3EF;border-radius:16px;overflow:hidden;
  transition:border-color .2s;
}
.th-faq-item[open]{border-color:#BFDCD0}
.th-faq-item summary{
  list-style:none;cursor:pointer;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:16px 20px;font-weight:700;color:#132A24;font-size:.93rem;
}
.th-faq-item summary::-webkit-details-marker{display:none}
.th-chev{width:17px;height:17px;flex:0 0 17px;color:#65BFA6;transition:transform .25s}
.th-faq-item[open] .th-chev{transform:rotate(180deg)}
.th-faq-item p{margin:0;padding:0 20px 18px;color:#6B807A;font-size:.87rem;line-height:1.9}
.th-faq-more{text-align:center;margin-top:26px}
.th-faq-more a{color:#246F59;font-weight:700;text-decoration:none}

/* ============================= FINAL CTA ============================= */
.th-final-cta-wrap{padding:20px 0 84px;background:#FFFDF7}
.th-final-cta{
  position:relative;overflow:hidden;border-radius:30px;padding:54px 54px;
  background:
    radial-gradient(500px 260px at 90% -20%, rgba(255,255,255,.22), transparent 60%),
    linear-gradient(135deg,#246F59 0%,#1B5A49 60%,#143F33 100%);
  color:#fff;display:flex;align-items:center;gap:40px;
}
.th-cta-art{flex:0 0 200px;display:flex;align-items:center;justify-content:center}
.th-cta-art img{width:190px;height:auto;border-radius:28px;opacity:.94}
.th-cta-copy h2{margin:0 0 10px;font-size:clamp(1.5rem,2.4vw,2.1rem);font-weight:800}
.th-cta-copy p{margin:0 0 24px;color:#D7EAE0;font-size:.98rem}
.th-cta-actions{margin:0}
.th-cta-leaf{position:absolute;border-radius:100% 0 100% 0;background:rgba(101,191,166,.25)}
.th-cl-a{width:70px;height:120px;top:-20px;inset-inline-end:12%;transform:rotate(30deg)}
.th-cl-b{width:50px;height:90px;bottom:-24px;inset-inline-start:38%;transform:rotate(-140deg)}

/* ============================= RESPONSIVE ============================= */
@media(max-width:1180px){
  .th-hero-grid{gap:32px}
  .th-hero-art{min-height:420px}
  .th-hero-img{width:min(100%,560px)}
}
@media(max-width:1024px){
  .th-steps{grid-template-columns:1fr;max-width:520px;margin:0 auto}
  .th-step:not(:last-child)::after{content:"↓";top:auto;bottom:-30px;inset-inline-end:50%;transform:translateX(50%);font-size:1.5rem}
  [dir="ltr"] .th-step:not(:last-child)::after{content:"↓";inset-inline-start:auto;inset-inline-end:50%;transform:translateX(50%)}
  .th-faq-cols{grid-template-columns:1fr;gap:12px}
}
@media(max-width:860px){
  .th-hero-grid{grid-template-columns:1fr;grid-template-areas:"copy" "art";text-align:center;gap:30px;padding-top:36px}
  .th-hero-copy{justify-self:center;text-align:center}
  .taanus-ref-badge{margin-inline:auto}
  .taanus-ref-actions{justify-content:center}
  .th-trust-row{justify-content:center}
  .th-hero-art{min-height:0}
  .th-hero-img{width:min(100%,480px)}
  .th-stats-card{grid-template-columns:repeat(2,1fr);row-gap:18px}
  .th-stat:nth-child(odd){border-inline-start:0}
  .th-section{padding:56px 0}
  .th-final-cta{flex-direction:column;text-align:center;padding:44px 26px}
  .th-cta-art{flex:none}
}
@media(max-width:480px){
  .th-hero-copy h1{font-size:2.1rem}
  .th-stats-card{padding:20px 14px}
  .th-stat strong{font-size:1.2rem}
  .th-stat small{font-size:.68rem}
  .th-stat{gap:.55rem}
  .th-stat-icon{width:36px;height:36px;flex-basis:36px}
  .th-stat-icon svg{width:18px;height:18px}
  .th-hero-img{border-radius:30px} /* simpler mask on tiny screens */
}
@media(prefers-reduced-motion:reduce){
  .th-feature-card,.th-aud-card{transition:none}
}