/* ============================================================
   EEK site template · inner page frame styles sany-inner.css
   —— Applies to every inner page: article / case / single page / search / tag / guestbook
   Skeleton class names match the partials:
     .page-banner → partial/banner.html
     .crumb       → partial/crumb.html
     .pagnavi     → partial/pagination.html
     .sidebar     → partial/sidebar.html
     .page > .container > .section.page-item > [.page-content + .sidebar]
   Design language matches sany.css: primary --sany-red / card #f8f8f8 / border #e5e5e5
   ============================================================ */

:root{
  --inner-max:1400px;
  --inner-red:#ed6a18;
  --inner-dark:#1a1a1a;
  --inner-text:#333;
  --inner-text-2:#666;
  --inner-text-3:#999;
  --inner-bg:#f8f8f8;
  --inner-border:#e5e5e5;
}

/* ---------------- Inner page banner (partial/banner.html) ---------------- */
.sy-shell .page-banner{line-height:0;overflow:hidden;}
.sy-shell .page-banner img{width:100%;height:280px;object-fit:cover;display:block;}
@media (max-width:900px){.sy-shell .page-banner img{height:180px;}}

/* ---------------- Breadcrumb (partial/crumb.html) ---------------- */
.sy-shell .crumb{background:#fff;border-bottom:1px solid var(--inner-border);}
.sy-shell .crumb .container{max-width:var(--inner-max);margin:0 auto;padding:13px 20px;font-size:13px;color:var(--inner-text-3);}
.sy-shell .crumb a{color:var(--inner-text-3);transition:.2s;}
.sy-shell .crumb a:hover{color:var(--inner-red);}

/* ---------------- Inner page two-column skeleton ---------------- */
.sy-shell .page .container{max-width:var(--inner-max);margin:0 auto;padding:0 20px;}
.sy-shell .page .section.page-item{
  display:grid;
  grid-template-columns:minmax(0,1fr) 320px;
  gap:44px;
  align-items:start;
  padding:52px 0 64px;
}
.sy-shell .page .page-content{min-width:0;}

/* Section heading (shared by list page / single page / search / tag) */
.sy-shell .single-content-title{
  font-size:28px;
  font-weight:800;
  letter-spacing:1px;
  color:var(--inner-text);
  padding-left:14px;
  border-left:4px solid var(--inner-red);
  line-height:1.3;
  margin-bottom:28px;
}

/* ---------------- Article / search / tag list (.list-blog-ul) ---------------- */
.sy-shell .list-blog-ul li{
  background:var(--inner-bg);
  border-radius:8px;
  padding:24px 26px;
  margin-bottom:16px;
  transition:.2s;
}
.sy-shell .list-blog-ul li:hover{box-shadow:0 6px 20px rgba(0,0,0,.08);}
.sy-shell .list-blog-ul .info{font-size:13px;color:var(--inner-text-3);margin-bottom:10px;}
.sy-shell .list-blog-ul .info a{color:var(--inner-red);}
.sy-shell .list-blog-ul h3{font-size:19px;font-weight:700;line-height:1.5;margin-bottom:10px;}
.sy-shell .list-blog-ul h3 a{color:var(--inner-text);transition:.2s;}
.sy-shell .list-blog-ul h3 a:hover{color:var(--inner-red);}
.sy-shell .list-blog-ul p{font-size:14px;color:var(--inner-text-2);line-height:1.8;margin-bottom:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.sy-shell .list-blog-ul .more{
  display:inline-block;font-size:13px;color:var(--inner-red);
  border:1px solid var(--inner-red);border-radius:30px;
  padding:6px 22px;transition:.2s;
}
.sy-shell .list-blog-ul .more:hover{background:var(--inner-red);color:#fff;}

/* ---------------- Case list (.list-case-ul) ---------------- */
.sy-shell .list-case-ul{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:22px;}
.sy-shell .list-case-ul .list-item{background:#fff;border:1px solid var(--inner-border);border-radius:8px;overflow:hidden;transition:.2s;}
.sy-shell .list-case-ul .list-item:hover{box-shadow:0 8px 24px rgba(0,0,0,.1);border-color:transparent;}
.sy-shell .imgitem{aspect-ratio:16/9;overflow:hidden;background:var(--inner-bg);}
.sy-shell .imgitem img{width:100%;height:100%;object-fit:cover;transition:.35s;}
.sy-shell .list-case-ul .list-item:hover .imgitem img{transform:scale(1.04);}
.sy-shell .list-item-text{padding:16px 18px;}
.sy-shell .list-item-text h3{font-size:16px;font-weight:600;line-height:1.5;text-align:center;}
.sy-shell .list-item-text h3 a:hover{color:var(--inner-red);}

/* ---------------- Detail page (.single-title + .single-arc/.markdown-body) ---------------- */
.sy-shell .single-title{border-bottom:1px solid var(--inner-border);padding-bottom:18px;margin-bottom:26px;}
.sy-shell .single-title h1{font-size:26px;font-weight:800;line-height:1.5;color:var(--inner-text);}
.sy-shell .single-title .info{font-size:13px;color:var(--inner-text-3);margin-top:10px;}
.sy-shell .single-title .info a{color:var(--inner-red);}

/* Body copy rich-text typography (shared by .single-arc / .markdown-body) */
.sy-shell .single-arc{font-size:16px;line-height:1.9;color:#444;word-break:break-word;}
.sy-shell .single-arc p{margin:0 0 16px;}
.sy-shell .single-arc h1,.sy-shell .single-arc h2,.sy-shell .single-arc h3,
.sy-shell .single-arc h4,.sy-shell .single-arc h5{color:var(--inner-text);line-height:1.5;margin:30px 0 14px;}
.sy-shell .single-arc h1{font-size:24px;}
.sy-shell .single-arc h2{font-size:21px;padding-left:12px;border-left:4px solid var(--inner-red);}
.sy-shell .single-arc h3{font-size:18px;}
.sy-shell .single-arc h4,.sy-shell .single-arc h5{font-size:16px;}
.sy-shell .single-arc ul,.sy-shell .single-arc ol{margin:0 0 16px;padding-left:24px;list-style:disc;}
.sy-shell .single-arc ol{list-style:decimal;}
.sy-shell .single-arc li{margin-bottom:6px;}
.sy-shell .single-arc a{color:var(--inner-red);}
.sy-shell .single-arc a:hover{text-decoration:underline;}
.sy-shell .single-arc img{display:block;max-width:100%;height:auto;border-radius:6px;margin:8px auto 16px;}
.sy-shell .single-arc blockquote{background:var(--inner-bg);border-left:4px solid var(--inner-red);padding:14px 18px;margin:0 0 16px;color:var(--inner-text-2);border-radius:0 6px 6px 0;}
.sy-shell .single-arc table{width:100%;border-collapse:collapse;margin:0 0 18px;font-size:14px;}
.sy-shell .single-arc th,.sy-shell .single-arc td{border:1px solid var(--inner-border);padding:10px 12px;text-align:left;line-height:1.6;}
.sy-shell .single-arc th{background:var(--inner-bg);font-weight:700;color:var(--inner-text);}
.sy-shell .single-arc tr:nth-child(even) td{background:#fafafa;}
.sy-shell .single-arc code{background:var(--inner-bg);border:1px solid var(--inner-border);border-radius:4px;padding:2px 6px;font-size:13px;}
.sy-shell .single-arc pre{background:#2d2d2d;color:#f1f1f1;border-radius:6px;padding:16px;overflow:auto;margin:0 0 16px;}
.sy-shell .single-arc pre code{background:none;border:none;color:inherit;padding:0;}
.sy-shell .single-arc hr{border:none;border-top:1px solid var(--inner-border);margin:26px 0;}

/* Tag row */
.sy-shell .tags{border-top:1px dashed var(--inner-border);margin-top:30px;padding-top:18px;font-size:14px;color:var(--inner-text-3);}
.sy-shell .tags a{display:inline-block;background:var(--inner-bg);color:var(--inner-text-2);border-radius:4px;padding:4px 12px;margin:0 8px 8px 0;font-size:13px;transition:.2s;}
.sy-shell .tags a:hover{background:var(--inner-red);color:#fff;}

/* Previous / Next */
.sy-shell .prenext{margin-top:26px;background:var(--inner-bg);border-radius:8px;padding:18px 22px;}
.sy-shell .prenext p{font-size:14px;margin-bottom:8px;color:var(--inner-text-3);}
.sy-shell .prenext p:last-child{margin-bottom:0;}
.sy-shell .prenext span{color:var(--inner-text-3);margin-right:8px;}
.sy-shell .prenext a{color:var(--inner-text);font-weight:600;transition:.2s;}
.sy-shell .prenext a:hover{color:var(--inner-red);}

/* ---------------- Related products (.rel / .rel-pro-ul) ---------------- */
.sy-shell .rel{background:var(--inner-bg);padding:52px 0 60px;margin-top:10px;}
.sy-shell .rel .container{max-width:var(--inner-max);margin:0 auto;padding:0 20px;}
.sy-shell .rel h2{font-size:26px;font-weight:800;letter-spacing:1px;text-align:center;margin-bottom:30px;}
.sy-shell .rel-pro-ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:22px;}
.sy-shell .rel-pro-ul .list-item{background:#fff;border-radius:8px;overflow:hidden;transition:.2s;}
.sy-shell .rel-pro-ul .list-item:hover{box-shadow:0 8px 24px rgba(0,0,0,.1);transform:translateY(-3px);}
.sy-shell .rel-pro-ul .list-item-text h3{font-size:15px;}

/* ---------------- Sidebar (partial/sidebar.html) ---------------- */
.sy-shell .sidebar .side{background:var(--inner-bg);border-radius:8px;padding:22px 20px;margin-bottom:20px;}
.sy-shell .sidebar .side>h2{
  font-size:18px;font-weight:800;letter-spacing:1px;color:var(--inner-text);
  padding-bottom:12px;margin-bottom:16px;position:relative;
}
.sy-shell .sidebar .side>h2::after{content:"";position:absolute;left:0;bottom:0;width:34px;height:3px;background:var(--inner-red);}

/* Product category accordion */
.sy-shell .sidebar .accordion-item{
  display:flex;justify-content:space-between;align-items:center;width:100%;
  background:#fff;border:1px solid var(--inner-border);border-radius:6px;
  padding:11px 14px;margin-bottom:8px;font-size:14px;font-weight:600;color:var(--inner-text);
  cursor:pointer;font-family:inherit;text-align:left;transition:.2s;
}
.sy-shell .sidebar .accordion-item::after{content:"\f078";font-family:FontAwesome;font-size:11px;color:var(--inner-text-3);transition:.2s;}
.sy-shell .sidebar .accordion-item.open{color:var(--inner-red);border-color:var(--inner-red);}
.sy-shell .sidebar .accordion-item.open::after{content:"\f077";color:var(--inner-red);}
.sy-shell .sidebar .accordion-item-content{display:none;padding:6px 4px 8px;}
.sy-shell .sidebar .accordion-item-content.open{display:block;}
.sy-shell .sidebar .ind-pro-nav-ul li a{
  display:block;font-size:13px;color:var(--inner-text-2);padding:7px 10px 7px 18px;position:relative;transition:.2s;border-radius:4px;
}
.sy-shell .sidebar .ind-pro-nav-ul li a::before{content:"";position:absolute;left:6px;top:50%;width:5px;height:5px;border-radius:50%;background:var(--inner-red);transform:translateY(-50%);opacity:.6;}
.sy-shell .sidebar .ind-pro-nav-ul li a:hover{background:#fff;color:var(--inner-red);}

/* Recommended products */
.sy-shell .sidebar .side-pro-ul li{margin-bottom:14px;}
.sy-shell .sidebar .side-pro-ul li:last-child{margin-bottom:0;}
.sy-shell .sidebar .side-pro-ul .list-item{display:grid;grid-template-columns:96px minmax(0,1fr);gap:12px;align-items:center;background:#fff;border-radius:6px;padding:8px;transition:.2s;}
.sy-shell .sidebar .side-pro-ul .list-item:hover{box-shadow:0 4px 14px rgba(0,0,0,.08);}
.sy-shell .sidebar .side-pro-ul .imgitem{aspect-ratio:4/3;border-radius:4px;}
.sy-shell .sidebar .side-pro-ul .list-item-text h3{font-size:13px;font-weight:600;line-height:1.5;text-align:left;}
.sy-shell .sidebar .side-pro-ul .list-item-text h3 a:hover{color:var(--inner-red);}

/* Popular articles */
.sy-shell .sidebar .side-blog-ul li{border-bottom:1px dashed var(--inner-border);}
.sy-shell .sidebar .side-blog-ul li:last-child{border-bottom:none;}
.sy-shell .sidebar .side-blog-ul li a{
  display:block;font-size:14px;color:var(--inner-text-2);line-height:1.6;
  padding:10px 2px;transition:.2s;
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.sy-shell .sidebar .side-blog-ul li a::before{content:"›";color:var(--inner-red);font-weight:700;margin-right:8px;}
.sy-shell .sidebar .side-blog-ul li a:hover{color:var(--inner-red);}

/* Contact Us */
.sy-shell .sidebar .side-item p{font-size:13px;color:var(--inner-text-2);line-height:1.7;margin-bottom:10px;word-break:break-all;}
.sy-shell .sidebar .side-item p:last-child{margin-bottom:0;}

/* ---------------- Guestbook form (.guestbook-form) ---------------- */
.sy-shell .guestbook-form{max-width:760px;}
.sy-shell .guestbook-form .form-item{margin-bottom:18px;}
.sy-shell .guestbook-form .form-label{font-size:14px;font-weight:600;color:var(--inner-text);margin-bottom:8px;}
.sy-shell .guestbook-form .form-value input[type=text],
.sy-shell .guestbook-form .form-value input[type=number],
.sy-shell .guestbook-form textarea,
.sy-shell .guestbook-form select{
  width:100%;border:1px solid var(--inner-border);border-radius:6px;
  padding:12px 14px;font-size:14px;font-family:inherit;color:var(--inner-text);
  background:#fff;outline:none;transition:.2s;
}
.sy-shell .guestbook-form textarea{min-height:140px;resize:vertical;line-height:1.7;}
.sy-shell .guestbook-form input:focus,
.sy-shell .guestbook-form textarea:focus,
.sy-shell .guestbook-form select:focus{border-color:var(--inner-red);box-shadow:0 0 0 3px rgba(237,106,24,.12);}
.sy-shell .guestbook-form .form-value input[type=radio],
.sy-shell .guestbook-form .form-value input[type=checkbox]{margin-right:6px;vertical-align:-2px;}
.sy-shell .guestbook-form .form-value label{margin-right:18px;font-size:14px;color:var(--inner-text-2);cursor:pointer;}
.sy-shell .guestbook-form #guestbook-captcha{gap:12px;margin-bottom:18px;}
.sy-shell .guestbook-form #guestbook-captcha input{flex:1;border:1px solid var(--inner-border);border-radius:6px;padding:12px 14px;font-size:14px;font-family:inherit;outline:none;transition:.2s;}
.sy-shell .guestbook-form #guestbook-captcha input:focus{border-color:var(--inner-red);}
.sy-shell .guestbook-form #guestbook-captcha img{width:150px;height:48px;border-radius:6px;cursor:pointer;border:1px solid var(--inner-border);background:#fff;}
.sy-shell .guestbook-form .form-control{margin-top:6px;}
.sy-shell .guestbook-form .form-btn{
  display:inline-block;background:var(--inner-red);color:#fff;border:none;border-radius:30px;
  padding:13px 52px;font-size:15px;font-weight:600;letter-spacing:2px;cursor:pointer;
  font-family:inherit;transition:.2s;
}
.sy-shell .guestbook-form .form-btn:hover{background:#d55a0e;box-shadow:0 6px 18px rgba(237,106,24,.35);}

/* ---------------- Pagination (partial/pagination.html → .pagnavi) ---------------- */
.sy-shell .pagnavi{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin-top:30px;}
.sy-shell .pagnavi a{
  min-width:38px;height:38px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid var(--inner-border);border-radius:4px;background:#fff;
  padding:0 12px;font-size:14px;color:var(--inner-text-2);transition:.2s;
}
.sy-shell .pagnavi a:hover{border-color:var(--inner-red);color:var(--inner-red);}
.sy-shell .pagnavi a.current{background:var(--inner-red);border-color:var(--inner-red);color:#fff;cursor:default;}
.sy-shell .pagnavi i{font-size:13px;}

/* ---------------- Responsive ---------------- */
@media (max-width:1024px){
  .sy-shell .page .section.page-item{grid-template-columns:minmax(0,1fr);gap:36px;padding:36px 0 48px;}
  .sy-shell .rel-pro-ul{grid-template-columns:repeat(2,minmax(0,1fr));}
}
@media (max-width:640px){
  .sy-shell .list-case-ul{grid-template-columns:minmax(0,1fr);}
  .sy-shell .rel-pro-ul{grid-template-columns:minmax(0,1fr);}
  .sy-shell .single-content-title{font-size:23px;}
  .sy-shell .single-title h1{font-size:21px;}
  .sy-shell .guestbook-form .form-btn{width:100%;}
}