/*
Theme Name: Hamta - همتا
Theme URI: https://hamtaa.org
Author: Hamta Institute
Description: پوسته فارسی و راست‌چین مؤسسه همتا (هوش مصنوعی و تمدن اسلامی). محصولات و آخرین اخبار به‌صورت داینامیک از پست‌های وردپرس خوانده می‌شوند. همراه با درون‌ریزی خودکار دیتای نمونه هنگام فعال‌سازی.
Version: 1.0.0
Requires at least: 6.0
Tested up to: 6.7
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: hamta
Tags: rtl-language-support, custom-menu, featured-images, blog
*/

/* ============ WordPress core helpers ============ */
.screen-reader-text{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.aligncenter{display:block;margin:0 auto}
.aligncenter{display:block;margin:0 auto}
img.alignright{float:left;margin:0 0 12px 12px}
img.alignleft{float:right;margin:0 12px 12px 0}
.wp-caption{max-width:100%}
.wp-caption-text{font-size:12px;color:#7d7a70;text-align:center}

:root{
  --cream:#f2ecdf;
  --cream-2:#faf6ec;
  --ink:#17211f;
  --teal:#0f8377;
  --teal-dark:#0a5a52;
  --teal-deep:#06332e;
  --gold:#c9a227;
  --night:#050d0c;
  --card-radius:26px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  font-family:'Vazirmatn','Noto Sans Arabic',Tahoma,Arial,sans-serif;
  background:var(--cream);
  color:var(--ink);
  font-size:16px;
  line-height:1.9;
  overflow-x:hidden;
}
h1,h2,h3,h4{font-family:inherit;font-weight:800;line-height:1.5}
a{text-decoration:none;color:inherit}
img{max-width:100%}
.container-x{max-width:1180px;margin:0 auto;padding:0 24px}

/* ---------- reveal animation ---------- */
.reveal{opacity:0;transform:translateY(28px);transition:opacity .8s ease,transform .8s ease}
.reveal.visible{opacity:1;transform:none}
.reveal.d1{transition-delay:.12s}.reveal.d2{transition-delay:.24s}.reveal.d3{transition-delay:.36s}
@media (prefers-reduced-motion: reduce){
  .reveal{opacity:1;transform:none;transition:none}
  *{animation-duration:.001s !important;transition-duration:.001s !important}
}

/* ---------- header ---------- */
.site-header{
  position:fixed;inset-inline:0;top:0;z-index:60;
  display:flex;align-items:center;justify-content:space-between;
  padding:14px 28px;
  transition:background .35s ease, box-shadow .35s ease;
}
.site-header.scrolled{background:rgba(242,236,223,.92);backdrop-filter:blur(10px);box-shadow:0 1px 0 rgba(23,33,31,.08)}
.brand{display:flex;align-items:center;gap:12px}
.brand .logo-mark{width:52px;height:52px}
.brand .brand-text{line-height:1.35}
.brand .brand-text b{display:block;font-size:15px;color:#3c3a33}
.brand .brand-text span{font-size:11.5px;color:#8a8578;letter-spacing:.02em}
.header-actions{display:flex;align-items:center;gap:12px}
.btn-contact{
  display:inline-flex;align-items:center;gap:10px;
  background:#fffdf7;border:1px solid rgba(23,33,31,.12);
  border-radius:999px;padding:9px 20px;font-weight:700;font-size:14px;
  box-shadow:0 1px 2px rgba(0,0,0,.05),0 4px 12px rgba(0,0,0,.04);
  transition:transform .25s ease, background .25s ease;
}
.btn-contact:hover{transform:translateY(-2px);background:#fff}
.btn-contact .ic{width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center;font-size:14px}
.menu-btn{
  width:48px;height:48px;border-radius:50%;border:none;cursor:pointer;
  background:var(--ink);color:#f5f1e6;display:grid;place-items:center;
  transition:transform .25s ease,background .25s ease;
}
.menu-btn:hover{transform:scale(1.06);background:#000}
.menu-btn svg{width:20px;height:20px}
.site-header .brand,.site-header .menu-btn{opacity:0;pointer-events:none;transition:opacity .35s ease}
.site-header.scrolled .brand,.site-header.scrolled .menu-btn{opacity:1;pointer-events:auto}

/* ---------- hero ---------- */
.hero{
  position:relative;min-height:calc(100vh - 28px);
  margin:14px;border-radius:36px;overflow:hidden;
  display:flex;flex-direction:column;justify-content:flex-end;
  background:url('assets/hero2.jpg') center/cover no-repeat;
  isolation:isolate;
}
.hero::after{
  content:"";position:absolute;inset:0;z-index:-1;
  background:linear-gradient(180deg,rgba(242,236,223,0) 62%,rgba(20,16,6,.28) 100%);
}
.hero-title{
  position:absolute;top:6vh;right:5vw;text-align:right;
  animation:heroIn 1.2s ease both .2s;
}
.hero-title h1{font-size:clamp(40px,5.6vw,72px);color:#0b6b60;margin:0;text-shadow:0 2px 20px rgba(255,255,255,.45)}
.hero-title p{font-size:clamp(18px,2.2vw,28px);font-weight:800;color:#16352f;margin:4px 0 0;text-shadow:0 2px 14px rgba(255,255,255,.5)}
@keyframes heroIn{from{opacity:0;transform:translateY(34px)}to{opacity:1;transform:none}}
.hero-desc{
  position:absolute;bottom:5vh;right:4vw;max-width:430px;text-align:right;
  animation:heroIn 1.2s ease both .55s;
}
.hero-desc .brandmark{display:flex;flex-direction:column;align-items:center;width:max-content;gap:6px;margin-bottom:14px}
.hero-desc .brandmark img{width:180px;height:auto;filter:drop-shadow(0 3px 12px rgba(0,0,0,.35))}
.hero-desc .txt{
  margin:0;color:#fff;font-weight:700;font-size:13.5px;line-height:2.15;
  text-shadow:0 1px 3px rgba(0,0,0,.6),0 4px 18px rgba(0,0,0,.5);
}
.hero-trust{
  position:absolute;bottom:5vh;left:4vw;text-align:left;color:#fff;
  animation:heroIn 1.2s ease both .8s;
}
.hero-trust .t{font-weight:800;font-size:19px;text-shadow:0 2px 12px rgba(0,0,0,.55);display:block;margin-bottom:12px;text-align:right}
.hero-trust .logos{width:min(370px,44vw);overflow:hidden;-webkit-mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent);mask-image:linear-gradient(90deg,transparent,#000 15%,#000 85%,transparent)}
.hero-trust .logos .track{display:flex;align-items:center;gap:40px;width:max-content;animation:scrollX 16s linear infinite}
.hero-trust .logos img{height:62px;width:auto;filter:brightness(0) invert(1);opacity:.95}
.hero-menu-fab{
  position:absolute;bottom:6vh;left:50%;transform:translateX(-50%);
  display:flex;align-items:center;gap:16px;color:var(--ink);font-weight:800;font-size:16px;
  background:#f5f1e6;border:none;cursor:pointer;border-radius:999px;
  padding:7px 8px 7px 30px;box-shadow:0 12px 34px rgba(0,0,0,.28);
  animation:heroIn 1.2s ease both 1s;transition:transform .25s ease;
}
.hero-menu-fab:hover{transform:translateX(-50%) scale(1.05)}
.hero-menu-fab .menu-btn{width:44px;height:44px}

/* ---------- section headings ---------- */
.section-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:0 4px;margin-bottom:34px}
.section-head h2{font-size:clamp(26px,3.4vw,40px);margin:0;display:flex;align-items:center;gap:14px}
.section-head .logo-mark{width:46px;height:46px;flex:none}
.slider-nav{display:flex;gap:10px}
.nav-circle{
  width:46px;height:46px;border-radius:50%;cursor:pointer;
  border:1.5px solid rgba(23,33,31,.25);background:transparent;color:var(--ink);
  display:grid;place-items:center;transition:all .25s ease;
}
.nav-circle:hover{background:var(--ink);color:#fff;transform:scale(1.06)}
.nav-circle.on-dark{border-color:rgba(133,231,205,.55);color:#9ff0dc}
.nav-circle.on-dark:hover{background:#9ff0dc;color:#06332e}
.nav-circle svg{width:18px;height:18px}

/* ---------- products coverflow ---------- */
.products{padding:110px 0 70px}
.pr-stage{position:relative;overflow:hidden;padding:30px 0 26px}
.pr-track{display:flex;gap:26px;align-items:center;height:446px;will-change:transform;transition:transform .65s cubic-bezier(.33,.9,.35,1)}
.pr-card{
  flex:0 0 292px;border-radius:22px;overflow:hidden;
  background:#fff;box-shadow:0 10px 30px rgba(31,26,12,.10);
  transform:scale(.87);
  transition:transform .65s ease,box-shadow .65s ease;
  cursor:pointer;
}
.pr-card.active{transform:scale(1.05);box-shadow:0 18px 50px rgba(31,26,12,.20)}
.pr-card img{display:block;width:100%;height:330px;object-fit:cover;object-position:center}
.pr-label{background:var(--teal);color:#fff;text-align:center;font-weight:800;font-size:14.5px;line-height:1.9;padding:0 16px;height:0;opacity:0;overflow:hidden;display:flex;align-items:center;justify-content:center;transition:height .55s ease,opacity .55s ease}
.pr-card.active .pr-label{height:92px;opacity:1}
.pr-nav{display:flex;justify-content:center;gap:14px;margin-top:36px}
.pr-nav .nav-circle.solid{background:var(--ink);color:#fff;border-color:var(--ink)}
.pr-nav .nav-circle.solid:hover{background:#000}


/* ---------- missions ---------- */
.missions{
  background:
    radial-gradient(1000px 460px at 82% 8%,rgba(15,131,119,.20),transparent 60%),
    radial-gradient(900px 500px at 12% 92%,rgba(201,162,39,.10),transparent 60%),
    var(--night);
  color:#eef5f1;padding:96px 0;position:relative;overflow:hidden;
}
.missions .stars{position:absolute;inset:0;pointer-events:none;opacity:.7}
.missions .stars i{position:absolute;width:2px;height:2px;border-radius:50%;background:#cfe9dd;opacity:.5;animation:tw 4s ease-in-out infinite}
@keyframes tw{0%,100%{opacity:.15}50%{opacity:.75}}
.missions .section-head h2{color:#f4f9f6}
.ms-viewport{overflow:hidden}
.ms-track{display:flex;transition:transform .7s cubic-bezier(.3,.85,.3,1)}
.ms-slide{flex:0 0 100%;display:grid;grid-template-columns:1fr 1fr;gap:26px;padding:6px 4px}
.ms-card{
  position:relative;border-radius:28px;padding:34px 32px 34px 150px;min-height:230px;
  background:linear-gradient(150deg,rgba(23,66,60,.85),rgba(8,22,20,.9));
  border:1px solid rgba(140,220,200,.16);
  display:flex;flex-direction:column;justify-content:center;gap:10px;
  overflow:hidden;
  transition:transform .35s ease,border-color .35s ease;
}
.ms-card:hover{transform:translateY(-6px);border-color:rgba(140,220,200,.42)}
.ms-card h3{margin:0;font-size:23px;color:#e9fbf4}
.ms-card p{margin:0;font-size:14px;color:#b8cfc7;line-height:2.1}
.ms-icon{
  position:absolute;left:26px;top:50%;transform:translateY(-50%);
  width:96px;height:96px;border-radius:26px;
  background:radial-gradient(circle at 30% 25%,rgba(64,203,178,.4),rgba(10,40,36,.9));
  border:1px solid rgba(140,220,200,.3);
  display:grid;place-items:center;
  box-shadow:0 0 40px rgba(31,183,155,.28);
}
.ms-icon svg{width:46px;height:46px;color:#8df0da}
.ms-dots{display:flex;justify-content:center;gap:8px;margin-top:30px}
.ms-dots button{width:10px;height:10px;border-radius:50%;border:none;background:rgba(255,255,255,.25);cursor:pointer;transition:all .3s}
.ms-dots button.active{background:#7be8cf;transform:scale(1.25)}

/* vision strip */
.vision{
  margin-top:70px;border-radius:30px;padding:44px 46px;
  background:linear-gradient(120deg,rgba(15,131,119,.24),rgba(201,162,39,.10));
  border:1px solid rgba(140,220,200,.22);
  display:flex;align-items:center;gap:30px;flex-wrap:wrap;
}
.vision .v-ic{width:74px;height:74px;flex:none;border-radius:50%;background:rgba(201,162,39,.16);border:1px solid rgba(201,162,39,.5);display:grid;place-items:center}
.vision .v-ic svg{width:36px;height:36px;color:#e8c65a}
.vision h3{margin:0 0 6px;font-size:24px;color:#f6efdc}
.vision p{margin:0;font-size:14.5px;color:#cfe0d8;max-width:760px}

/* ---------- news ---------- */
.news{padding:100px 0}
.nw-viewport{overflow:hidden;padding:8px 4px 26px}
.nw-track{display:flex;gap:26px;transition:transform .65s cubic-bezier(.33,.9,.35,1)}
.nw-card{
  flex:0 0 calc((100% - 52px)/3);
  background:#fbf8ef;border:1px solid rgba(23,33,31,.07);
  border-radius:24px;padding:22px;display:flex;flex-direction:column;gap:16px;
  box-shadow:0 6px 22px rgba(31,26,12,.07);
  transition:transform .3s ease,box-shadow .3s ease;
}
.nw-card:hover{transform:translateY(-7px);box-shadow:0 16px 40px rgba(31,26,12,.13)}
.nw-fig{background:#fff;border-radius:16px;height:190px;display:grid;place-items:center;border:1px solid rgba(23,33,31,.06);overflow:hidden}
.nw-fig svg{width:88%;height:82%}
.nw-card h3{font-size:17.5px;margin:0;text-align:center}
.nw-card .more{
  margin-top:auto;align-self:center;display:inline-flex;align-items:center;gap:8px;
  border:1.5px solid var(--teal);color:var(--teal-dark);font-size:13px;font-weight:700;
  border-radius:999px;padding:7px 20px;transition:all .25s ease;background:transparent;cursor:pointer;
}
.nw-card .more:hover{background:var(--teal);color:#fff}

/* ---------- trusted ---------- */
.trusted{padding:20px 0 90px}
.trusted h2{text-align:right;font-size:clamp(24px,3.2vw,38px);margin-bottom:48px}
.marquee{overflow:hidden;position:relative;-webkit-mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent);mask-image:linear-gradient(90deg,transparent,#000 12%,#000 88%,transparent)}
.marquee-track{display:flex;gap:56px;width:max-content;animation:scrollX 28s linear infinite}
.marquee:hover .marquee-track{animation-play-state:paused}
@keyframes scrollX{from{transform:translateX(0)}to{transform:translateX(50%)}}
.t-logo{display:flex;align-items:center;justify-content:center;width:170px;flex:none}
.t-logo img{width:100%;height:150px;object-fit:contain;transition:transform .3s ease}
.t-logo:hover img{transform:scale(1.06)}

/* ---------- footer ---------- */
.footer{
  background:
    radial-gradient(900px 480px at 50% 115%,rgba(38,208,166,.28),transparent 65%),
    radial-gradient(700px 300px at 90% 0%,rgba(15,131,119,.25),transparent 60%),
    linear-gradient(180deg,#04211d,#02120f);
  color:#d9e7e1;margin:0 18px 18px;border-radius:38px;padding:70px 0 34px;position:relative;overflow:hidden;
}
.f-globe{position:absolute;left:50%;bottom:-8%;transform:translateX(-50%);width:min(880px,94%);opacity:.55;pointer-events:none;filter:drop-shadow(0 0 26px rgba(46,230,168,.55))}
.footer .dotgrid{position:absolute;inset:auto 0 -40px 0;height:280px;opacity:.24;pointer-events:none;
  background-image:radial-gradient(rgba(120,235,200,.7) 1px,transparent 1.4px);background-size:20px 20px;
  -webkit-mask-image:radial-gradient(60% 100% at 50% 100%,#000,transparent);mask-image:radial-gradient(60% 100% at 50% 100%,#000,transparent);}
.f-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr 1.15fr;gap:40px;position:relative}
.f-brand-head{display:flex;align-items:center;gap:14px;margin-bottom:16px}
.f-brand .logo-mark{width:64px;height:64px;flex:none}
.f-brand h3{color:var(--gold);font-size:27px;margin:0 0 3px}
.f-brand .sub{color:#bcd6ce;font-weight:700}
.f-brand p{font-size:12.8px;color:#a7bfb7;line-height:2.2;text-align:justify}
.f-col h4{color:#eafff7;font-size:16.5px;margin:6px 0 18px;position:relative;padding-bottom:10px}
.f-col h4::after{content:"";position:absolute;bottom:0;right:0;width:34px;height:2.5px;background:var(--gold);border-radius:2px}
.f-col ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.f-col a{font-size:13.5px;color:#b9d2ca;transition:color .2s,padding .2s}
.f-col a:hover{color:#7ce9cf;padding-right:6px}
.f-contact li{display:flex;gap:10px;font-size:13px;color:#b9d2ca;align-items:flex-start}
.f-contact svg{width:17px;height:17px;flex:none;margin-top:5px;color:#7ce9cf}
.socials{display:inline-flex;align-items:center;gap:8px;margin-top:24px;background:rgba(4,14,12,.88);border:1px solid rgba(124,233,207,.18);border-radius:999px;padding:7px 16px 7px 8px}
.socials .lbl{font-size:13px;font-weight:800;color:#eafff7;margin-inline-start:4px}
.socials a{width:34px;height:34px;border-radius:50%;background:rgba(124,233,207,.14);border:1px solid rgba(124,233,207,.3);display:grid;place-items:center;transition:all .25s;color:#7ce9cf}
.socials a:hover{background:#7ce9cf;color:#04211d}
.socials svg{width:16px;height:16px}
.copyright{margin-top:56px;text-align:center;font-size:13px;font-weight:700;color:#cfe6dc;position:relative}

/* ---------- side push menu ---------- */
:root{--drawer-w:min(400px,88vw)}
#pageWrap{position:relative;transition:transform .55s cubic-bezier(.32,.72,.32,1);will-change:transform}
#pageWrap.pushed{transform:translateX(calc(var(--drawer-w) * -1))}
.page-backdrop{
  position:fixed;inset:0;z-index:90;border:none;padding:0;
  background:rgba(5,16,14,.45);
  opacity:0;visibility:hidden;cursor:pointer;
  transition:opacity .5s ease,visibility .5s ease;
}
.page-backdrop.show{opacity:1;visibility:visible}
.menu-drawer{
  position:fixed;top:0;bottom:0;right:0;width:var(--drawer-w);z-index:100;
  background:var(--cream);
  box-shadow:0 0 80px rgba(0,0,0,.28);
  border-inline-start:1px solid rgba(23,33,31,.08);
  transform:translateX(102%);
  transition:transform .55s cubic-bezier(.32,.72,.32,1);
  display:flex;flex-direction:column;gap:4px;
  padding:100px 30px 26px;overflow-y:auto;
}
.menu-drawer.open{transform:none}
.drawer-head{position:absolute;top:20px;right:26px;left:22px;display:flex;align-items:center;justify-content:space-between}
.drawer-head .logo-mark{width:46px;height:46px}
.menu-close{
  width:44px;height:44px;border-radius:50%;
  border:1.5px solid rgba(23,33,31,.2);background:transparent;color:var(--ink);
  display:grid;place-items:center;cursor:pointer;transition:all .25s;
}
.menu-close:hover{background:var(--ink);color:#fff;transform:rotate(90deg)}
.menu-item{
  display:flex;align-items:center;justify-content:flex-start;gap:16px;
  font-size:18px;font-weight:800;color:#2c332f;padding:12px 10px;border-radius:14px;
  transform:translateX(-26px);opacity:0;transition:background .25s ease,color .25s ease;
}
.menu-drawer.open .menu-item{animation:mi .5s ease forwards}
.menu-drawer.open .menu-item:nth-child(3){animation-delay:.05s}
.menu-drawer.open .menu-item:nth-child(4){animation-delay:.10s}
.menu-drawer.open .menu-item:nth-child(5){animation-delay:.15s}
.menu-drawer.open .menu-item:nth-child(6){animation-delay:.20s}
.menu-drawer.open .menu-item:nth-child(7){animation-delay:.25s}
.menu-drawer.open .menu-item:nth-child(8){animation-delay:.30s}
@keyframes mi{to{transform:none;opacity:1}}
.menu-item:hover{background:rgba(15,131,119,.10);color:var(--teal-dark)}
.menu-item .mi-ic{width:40px;height:40px;flex:none;border-radius:12px;border:1.5px solid rgba(23,33,31,.2);display:grid;place-items:center;transition:all .25s}
.menu-item:hover .mi-ic{background:var(--teal);border-color:var(--teal);color:#fff}
.menu-item .mi-ic svg{width:19px;height:19px}
.drawer-foot{margin-top:auto;padding-top:18px;border-top:1px solid rgba(23,33,31,.12);display:flex;flex-direction:column;gap:7px;font-size:12.5px;color:#7d7a70}

/* ---------- responsive ---------- */
@media (max-width:1100px){
  .f-grid{grid-template-columns:1fr 1fr;gap:34px}
  .nw-card{flex:0 0 calc((100% - 26px)/2)}
}
@media (max-width:900px){
  .ms-slide{grid-template-columns:1fr}
  .hero-desc{max-width:300px;font-size:12.5px}
}
@media (max-width:640px){
  .nw-card{flex:0 0 100%}
  .f-grid{grid-template-columns:1fr}
  .hero-trust{display:none}
  .hero-desc{position:static;margin:0 20px 110px;max-width:none}
  .hero{padding-top:120px}
  .hero-title{position:static;padding:0 20px;margin-bottom:auto}
  .ms-card{padding:110px 26px 30px;text-align:right}
  .ms-icon{top:22px;left:auto;right:26px;transform:none;width:70px;height:70px}
  .ms-icon svg{width:34px;height:34px}
  .btn-contact span.txt{display:none}
  .vision{padding:30px 24px}
  .section-head{flex-wrap:wrap}
}

/* ============ Blog post page styles ============ */
/* ---------- header ---------- */
.blog-header{
  position:sticky;top:0;z-index:50;
  display:flex;align-items:center;justify-content:space-between;
  padding:12px 28px;
  background:rgba(242,236,223,.92);backdrop-filter:blur(10px);
  box-shadow:0 1px 0 rgba(23,33,31,.08);
}
.brand{display:flex;align-items:center;gap:12px}
.brand .logo-mark{width:46px;height:46px}
.brand b{display:block;font-size:15px;color:#3c3a33;line-height:1.3}
.brand span{font-size:11.5px;color:#8a8578}
.btn-back{
  display:inline-flex;align-items:center;gap:10px;
  background:#fffdf7;border:1px solid rgba(23,33,31,.12);
  border-radius:999px;padding:8px 18px;font-weight:700;font-size:13.5px;
  transition:transform .25s ease;
}
.btn-back:hover{transform:translateY(-2px)}
.btn-back .ic{width:28px;height:28px;border-radius:50%;background:var(--ink);color:#fff;display:grid;place-items:center}
.btn-back .ic svg{width:14px;height:14px}

/* ---------- layout ---------- */
.blog-wrap{max-width:1280px;margin:26px auto 60px;padding:0 20px;display:grid;grid-template-columns:1fr 330px;gap:24px;align-items:start}
@media (max-width:991px){.blog-wrap{grid-template-columns:1fr}}

/* ---------- article ---------- */
.post{background:var(--cream-2);border:1px solid rgba(23,33,31,.08);border-radius:var(--card-radius);padding:30px clamp(18px,3.4vw,44px) 40px;box-shadow:0 10px 34px rgba(23,33,31,.06)}
.post-head{display:grid;grid-template-columns:1fr 380px;gap:30px;align-items:start;margin-bottom:26px}
@media (max-width:767px){.post-head{grid-template-columns:1fr}}
.post-head h1{font-size:clamp(30px,3.6vw,44px);font-weight:800;color:var(--teal-dark);margin:0 0 6px}
.post-head .sub{font-size:clamp(18px,2vw,24px);font-weight:800;margin:0 0 12px}
.post-head .lead-txt{font-size:14.5px;color:#4d4a41;margin:0 0 18px}
.link-pill{
  display:inline-flex;align-items:center;gap:8px;direction:ltr;
  background:rgba(15,131,119,.12);color:var(--teal-dark);
  border-radius:999px;padding:7px 22px;font-weight:800;font-size:15px;letter-spacing:.04em;
}
.post-date{display:flex;align-items:center;gap:8px;margin-top:16px;font-size:13px;color:#7d7a70;font-weight:700}
.post-date svg{width:17px;height:17px;color:var(--teal)}

/* featured image — like the sample */
.post-cover{position:relative}
.post-cover img{width:100%;aspect-ratio:4/4.6;object-fit:cover;border-radius:26px;display:block;box-shadow:0 18px 44px rgba(23,33,31,.18)}
.post-cover .tag{
  position:absolute;top:14px;right:14px;
  background:rgba(5,13,12,.72);color:#e7f5ef;backdrop-filter:blur(6px);
  border-radius:999px;padding:4px 14px;font-size:12px;font-weight:700;
}
.post-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.post-stats .st{background:#fff;border:1px solid rgba(23,33,31,.08);border-radius:14px;text-align:center;padding:8px 4px}
.post-stats .st b{display:block;font-size:16px;color:var(--teal-dark)}
.post-stats .st span{font-size:11px;color:#8a8578}

.post h2{font-size:19px;font-weight:800;color:var(--teal-dark);margin:30px 0 10px;display:flex;align-items:center;gap:10px}
.post h2::before{content:"";width:9px;height:9px;border-radius:3px;background:var(--gold);flex:none}
.post p{font-size:14px;color:#3d3a32;margin:0 0 12px;text-align:justify}
.post ul{padding-right:20px;margin:0 0 12px}
.post ul li{font-size:14px;color:#3d3a32;margin-bottom:6px}
.post .foot-link{text-align:center;margin-top:34px}

/* ---------- sidebar ---------- */
.side{display:flex;flex-direction:column;gap:20px;position:sticky;top:86px}
@media (max-width:991px){.side{position:static}}
.side-card{background:var(--cream-2);border:1px solid rgba(23,33,31,.08);border-radius:22px;padding:20px;box-shadow:0 8px 26px rgba(23,33,31,.05)}

/* contact card */
.c-row{display:flex;align-items:center;justify-content:flex-start;gap:10px;font-weight:800;font-size:14px;margin-bottom:10px}
.c-row .num{direction:ltr;letter-spacing:.06em}
.c-row svg{width:18px;height:18px;color:var(--teal);flex:none}
.btn-consult{
  display:flex;align-items:center;justify-content:center;gap:10px;width:100%;
  background:var(--teal-dark);color:#eafbf5;border:none;cursor:pointer;
  border-radius:14px;padding:11px 10px;font-weight:800;font-size:14px;font-family:inherit;
  transition:background .25s ease,transform .25s ease;margin-top:6px;
}
.btn-consult:hover{background:var(--teal-deep);transform:translateY(-2px)}
.btn-consult svg{width:17px;height:17px}

/* comments card — like the sample corner list */
.cm-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.cm-head .cnt{display:flex;align-items:center;gap:8px;font-weight:800;font-size:14px}
.cm-head .cnt svg{width:18px;height:18px;color:var(--teal)}
.cm-head .write{display:inline-flex;align-items:center;gap:6px;font-size:12px;font-weight:700;color:var(--teal-dark);background:rgba(15,131,119,.1);border-radius:999px;padding:5px 12px}
.cm-head .write svg{width:13px;height:13px}
.cm-list{display:flex;flex-direction:column;gap:10px;max-height:340px;overflow:auto;padding-left:4px}
.cm{background:#fff;border:1px solid rgba(23,33,31,.08);border-radius:16px;padding:10px 12px}
.cm .who{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.cm .av{width:30px;height:30px;border-radius:50%;background:var(--teal);color:#fff;display:grid;place-items:center;font-size:13px;font-weight:800;flex:none}
.cm .who b{font-size:13px}
.cm .txt{font-size:12.5px;color:#4d4a41;margin:0}
.cm .meta{display:flex;align-items:center;justify-content:space-between;margin-top:6px;font-size:11px;color:#8a8578}
.cm .meta .like{display:inline-flex;align-items:center;gap:4px;color:var(--teal-dark);font-weight:700}
.cm .meta .like svg{width:12px;height:12px}

/* related news — like the second sample */
.rel-head{display:flex;align-items:center;gap:10px;font-weight:800;font-size:16px;margin-bottom:14px}
.rel-head::before{content:"";width:10px;height:10px;border-radius:3px;background:var(--gold)}
.rel-list{display:flex;flex-direction:column;gap:12px}
.rel{
  display:grid;grid-template-columns:1fr 92px;gap:12px;align-items:center;
  background:#fff;border:1px solid rgba(23,33,31,.08);border-radius:18px;padding:12px;
  transition:transform .25s ease,box-shadow .25s ease;
}
.rel:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(23,33,31,.1)}
.rel img{width:92px;height:92px;object-fit:cover;border-radius:12px;display:block}
.rel h4{font-size:13px;font-weight:800;color:var(--teal-dark);margin:0 0 4px;line-height:1.7}
.rel p{font-size:11.5px;color:#7d7a70;margin:0 0 8px;line-height:1.8;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.rel .more{display:inline-flex;align-items:center;gap:5px;font-size:11px;font-weight:700;background:var(--ink);color:#f5f1e6;border-radius:999px;padding:4px 12px}
.rel .more svg{width:11px;height:11px}

/* ============ Blog archive grid (index.php) ============ */
.archive-wrap{max-width:1180px;margin:30px auto 70px;padding:0 20px}
.archive-title{font-size:clamp(24px,3.2vw,36px);font-weight:800;color:var(--teal-dark);margin:8px 0 30px;display:flex;align-items:center;gap:12px}
.archive-title::before{content:"";width:12px;height:12px;border-radius:4px;background:var(--gold)}
.archive-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:26px}
@media (max-width:1100px){.archive-grid{grid-template-columns:repeat(2,1fr)}}
@media (max-width:640px){.archive-grid{grid-template-columns:1fr}}
.archive-grid .nw-card{flex:none}
.nw-fig img{width:100%;height:100%;object-fit:cover;display:block}
.nw-card .nw-date{font-size:12px;color:#8a8578;text-align:center;font-weight:700}
.hamta-pagination{display:flex;justify-content:center;gap:8px;margin-top:40px}
.hamta-pagination .page-numbers{display:inline-grid;place-items:center;min-width:42px;height:42px;border-radius:50%;border:1.5px solid rgba(23,33,31,.25);font-weight:800;font-size:14px;padding:0 8px;transition:all .25s}
.hamta-pagination .page-numbers.current,.hamta-pagination .page-numbers:hover{background:var(--ink);color:#fff;border-color:var(--ink)}

/* ============ Single post content (WordPress the_content) ============ */
.post .post-content h2{font-size:19px;font-weight:800;color:var(--teal-dark);margin:30px 0 10px;display:flex;align-items:center;gap:10px}
.post .post-content h2::before{content:"";width:9px;height:9px;border-radius:3px;background:var(--gold);flex:none}
.post .post-content h3{font-size:17px;font-weight:800;margin:24px 0 8px}
.post .post-content p{font-size:14px;color:#3d3a32;margin:0 0 12px;text-align:justify}
.post .post-content ul,.post .post-content ol{padding-right:20px;margin:0 0 12px}
.post .post-content li{font-size:14px;color:#3d3a32;margin-bottom:6px}
.post .post-content img{border-radius:16px;height:auto}
.post .post-content a{color:var(--teal-dark);font-weight:700}
.post .post-content blockquote{border-right:4px solid var(--gold);background:#fff;border-radius:12px;margin:0 0 14px;padding:12px 18px}

/* products fallback image */
.pr-card .pr-noimg{width:100%;height:330px;display:grid;place-items:center;background:linear-gradient(150deg,#0f8377,#06332e);color:#eafbf5}
.pr-card .pr-noimg svg{width:80px;height:80px;opacity:.7}