/* SleepScoreDaily — Ampify template layout, SleepScoreDaily Navy/Teal palette */

/* ══════════════════════════════════════════
   FONT FACES
   ══════════════════════════════════════════ */
@font-face{font-family:'Manrope';src:url('/fonts/manrope-300.ttf') format('truetype');font-weight:300;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url('/fonts/manrope-400.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url('/fonts/manrope-500.ttf') format('truetype');font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url('/fonts/manrope-600.ttf') format('truetype');font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url('/fonts/manrope-700.ttf') format('truetype');font-weight:700;font-style:normal;font-display:swap}
@font-face{font-family:'Manrope';src:url('/fonts/manrope-800.ttf') format('truetype');font-weight:800;font-style:normal;font-display:swap}

/* ══════════════════════════════════════════
   CUSTOM PROPERTIES
   ══════════════════════════════════════════ */
:root{
  --sans:'Manrope',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,sans-serif;

  --border:#d7dde5;
  --black:#0d1b2a;
  --white:#fff;
  --transparent:rgba(255,255,255,0);

  --navy:#1a3f5c;
  --navy-dark:#123049;
  --teal:#2e6a8e;
  --teal-light:#7ab8cf;
  --secondary-text:#1a3f5c;
  --default:#2e6a8e;

  --page-bg:#eef2f6;
  --card-bg:#fff;
  --aside-bg:#e6ecf2;
  --footer-bg:#d8e0e8;
  --footer-item-bg:#dee5eb;
  --footer-border:#c3ccd6;
}

/* ══════════════════════════════════════════
   RESET
   ══════════════════════════════════════════ */
*{box-sizing:border-box}
body{margin:0}
html{-webkit-text-size-adjust:100%}
img{max-width:100%;height:auto;display:block;vertical-align:middle}
a{color:inherit;text-decoration:none}
ul,ol{margin:0;padding:0;list-style:none}
button{font-family:inherit;cursor:pointer}
input,textarea{font-family:inherit}

/* ══════════════════════════════════════════
   BODY / TYPOGRAPHY
   ══════════════════════════════════════════ */
body{
  color:var(--secondary-text);
  background-color:var(--page-bg);
  font-family:var(--sans);
  font-size:16px;
  line-height:24px;
  -webkit-font-smoothing:antialiased;
}
h1,h2,h3,h4,h5,h6{margin-top:20px;margin-bottom:10px;font-weight:700}
h1{font-size:38px;line-height:44px}
h2{font-size:32px;line-height:36px}
h3{font-size:24px;line-height:30px}
h4{margin-top:10px;font-size:18px;line-height:24px}
h5{margin-top:10px;font-size:14px;line-height:20px}
h6{margin-top:10px;font-size:12px;line-height:18px}
p{margin-top:0;margin-bottom:10px}
blockquote{border-left:5px solid #e2e2e2;margin-bottom:10px;padding:10px 20px;font-size:18px;line-height:22px}

/* ══════════════════════════════════════════
   LAYOUT CONTAINER
   ══════════════════════════════════════════ */
.main-container{
  max-width:1400px;
  margin-left:auto;
  margin-right:auto;
  padding-left:10px;
  padding-right:10px;
}
.main-content{display:block}

/* ══════════════════════════════════════════
   HEADER / TOP BAR (trending ticker)
   ══════════════════════════════════════════ */
.header{margin-top:0;margin-bottom:30px;padding-top:50px}

.top-bar{
  background-color:var(--default);
  border-top-left-radius:10px;
  border-top-right-radius:10px;
  position:relative;
  overflow:hidden;
  display:flex;
  align-items:center;
}
.tob-bar-category-text{
  z-index:2;
  color:#fff;
  text-transform:uppercase;
  background-color:#0d1b2a;
  border-top-left-radius:10px;
  padding:15px 20px;
  font-size:18px;
  font-weight:700;
  display:inline-block;
  position:relative;
  white-space:nowrap;
}
.tech-cateogry-moving-section{
  position:relative;
  overflow:hidden;
  flex:1;
  padding:15px 0;
}
.moving-tech-list{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  white-space:nowrap;
  animation:ssd-ticker 30s linear infinite;
}
@keyframes ssd-ticker{
  0%{transform:translateX(0)}
  100%{transform:translateX(-50%)}
}
.moving-tech-item{
  display:flex;
  align-items:center;
  text-decoration:none;
  margin-left:20px;
  margin-right:20px;
  flex-shrink:0;
}
.comment-icon{width:20px;height:20px;margin-right:10px;flex-shrink:0;filter:brightness(0) invert(1)}
.moving-tech-text{color:#fff;font-size:14px;font-weight:500;line-height:17px;white-space:nowrap}

/* ══════════════════════════════════════════
   NAVBAR
   ══════════════════════════════════════════ */
.navbar{
  background-color:#fff;
  border-radius:0 0 10px 10px;
  align-items:center;
  padding:30px;
  display:flex;
}
.logo{text-decoration:none;display:inline-flex;align-items:center}
.logo-image{width:180px;height:auto}
.nav-menu{display:flex;align-items:center;margin-left:auto}
.menu-item{margin-right:10px;text-decoration:none;display:inline-block}
.menu-text{
  color:var(--black);
  text-transform:uppercase;
  border-radius:50px;
  padding:15px 18px;
  font-size:17px;
  font-weight:500;
  line-height:17px;
  text-decoration:none;
  transition:all .3s;
  display:inline-block;
}
.menu-text:hover{color:#fff;background-color:var(--default)}
.menu-item.w--current .menu-text{background-color:var(--default);color:#fff}
.menu-button{display:none;border:1px solid var(--default);border-radius:5px;padding:10px;margin-left:20px;background:none}
.menu-button svg{width:24px;height:24px;color:var(--default);display:block}
.search-button{margin-left:16px;background:none;border:none;padding:8px;color:var(--secondary-text);display:flex;align-items:center}
.search-button svg{width:22px;height:22px}

/* ══════════════════════════════════════════
   MOBILE MENU OVERLAY
   ══════════════════════════════════════════ */
.mobile-menu{display:none;position:fixed;inset:0;background:var(--navy);z-index:500;flex-direction:column;padding:30px}
.mobile-menu.is-open{display:flex}
.mobile-menu-close{align-self:flex-end;background:none;border:none;color:#fff;padding:10px}
.mobile-menu-close svg{width:28px;height:28px}
.mobile-menu-links{display:flex;flex-direction:column;gap:8px;margin-top:40px}
.mobile-menu-links a{color:#fff;font-size:22px;font-weight:600;text-transform:uppercase;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.15)}

/* ══════════════════════════════════════════
   BLOG HERO (blog-title / blog-text overlay)
   ══════════════════════════════════════════ */
.blog-column{padding-left:10px;padding-right:10px}
.big-post-item{
  background-color:#fff;
  border-radius:10px;
  margin-bottom:30px;
  padding:10px;
  text-decoration:none;
  display:block;
  position:relative;
}
.link-to-single-post{
  color:#fff;
  border-radius:10px;
  text-decoration:none;
  display:block;
  position:relative;
  overflow:hidden;
}
.blog-image{
  background-color:#c7d2dc;
  border-radius:10px;
  width:100%;
  object-fit:cover;
  aspect-ratio:16/10;
}
.blog-text{
  z-index:2;
  padding-right:40px;
  position:absolute;
  bottom:40px;
  left:40px;
  right:auto;
}
.blog-title{color:#fff;margin-top:0;margin-bottom:25px;font-size:28px;line-height:30px;text-decoration:none}
.blog-cateogry-and-time{align-items:center;display:flex}
.blog-cateogry{
  color:#fff;
  text-transform:uppercase;
  background-color:var(--default);
  border-radius:5px;
  padding:5px 7px;
  font-size:14px;
  line-height:18px;
  text-decoration:none;
  display:block;
}
.time-of-post{color:#fff;margin-left:10px;font-size:14px;line-height:16px}

/* small blog grid under hero (trending-post-item / blog-four-columns) */
.blog-four-columns{
  grid-column-gap:30px;
  grid-row-gap:30px;
  grid-template-columns:1fr 1fr;
  display:grid;
}
.blog-four-columns.blog-page-three{grid-template-columns:1fr 1fr 1fr}
.blog-four-columns-item{background-color:#fff;border-radius:10px;padding:10px}
.blog-four-columns-text{padding:30px 20px}
.blog-four-columns-text.blog-trending-text{padding-top:20px}
.blog-four-category-and-time{align-items:center;display:flex}
.blog-four-category-link{
  background-color:var(--transparent);
  color:var(--secondary-text);
  text-transform:uppercase;
  border:1px solid rgba(26,63,92,.2);
  border-radius:5px;
  align-items:center;
  padding:7px;
  font-size:14px;
  line-height:16px;
  text-decoration:none;
  display:flex;
}
.blog-four-category-link.blog-time{border-color:rgba(26,63,92,.2);margin-left:10px}
.blog-category-icon{width:20px;height:20px}
.blog-cateogry-text{margin-left:8px;font-size:15px}
.blog-four-columns-title{color:var(--secondary-text);margin-bottom:0;font-size:20px;line-height:28px}

.trending-posts{margin-bottom:100px}
.trending-post-item{
  grid-column-gap:10px;
  grid-row-gap:10px;
  background-color:#fff;
  border-radius:10px;
  grid-template-columns:1fr 1fr;
  margin-bottom:30px;
  padding:10px;
  display:grid;
}

/* ══════════════════════════════════════════
   BUSINESS CATEGORY SHOWCASE (gradient bg + 4-item grid)
   ══════════════════════════════════════════ */
.business-category{
  background-color:var(--navy);
  background-image:linear-gradient(135deg,var(--navy) 0%,var(--teal) 100%);
  background-size:cover;
  border-radius:10px;
  margin-top:100px;
  margin-bottom:100px;
  padding:20px;
}
.main-title{
  color:#fff;
  text-transform:capitalize;
  border-bottom:1px solid #fff;
  margin-top:0;
  margin-bottom:20px;
  padding-bottom:5px;
  font-size:28px;
  display:inline-block;
}
.main-title.main-title-dark{border-bottom-color:var(--secondary-text);color:var(--secondary-text)}
.business-cateogry-blog{
  grid-column-gap:20px;
  grid-row-gap:20px;
  grid-template-columns:1fr 1fr;
  display:grid;
}
.business-cateogry-item{
  background-color:#fff;
  border-radius:10px;
  align-items:center;
  padding:40px 20px;
  text-decoration:none;
  display:flex;
  position:relative;
  overflow:hidden;
}
.business-image{z-index:0;object-fit:cover;border-radius:50%;width:90px;height:90px;position:absolute}
.business-text{z-index:2;color:var(--secondary-text);margin-top:0;margin-bottom:10px;margin-left:110px;font-size:16px;line-height:18px;text-decoration:none;position:relative;font-weight:600}

/* ══════════════════════════════════════════
   FEATURED POSTS (3-column)
   ══════════════════════════════════════════ */
.featured-posts{margin-bottom:100px}
.featured-list{grid-column-gap:30px;grid-row-gap:30px;grid-template-columns:1fr 1fr 1fr;display:grid}
.featured-list-item{background-color:var(--white);border-radius:10px;padding:10px;text-decoration:none;display:block}
.feature-image-div{border-radius:10px;position:relative;overflow:hidden}
.feature-image-div img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.feature-image-overlay{background-image:linear-gradient(rgba(13,27,42,0),rgba(13,27,42,.85));border-radius:10px;position:absolute;inset:0}
.feature-posts-title{color:var(--secondary-text);margin-top:20px;margin-left:10px;font-size:16px;line-height:24px;text-decoration:none;font-weight:600}

/* ══════════════════════════════════════════
   GAMING LIST (2-column full-bleed cards)
   ══════════════════════════════════════════ */
.gaming-list{grid-column-gap:30px;grid-row-gap:30px;grid-template-columns:1fr 1fr;margin-bottom:100px;display:grid}
.gaming-list-item{background-color:var(--white);border-radius:10px;padding:10px;position:relative}
.gaming-list-item img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:10px 10px 0 0}
.most-commented-text-box{padding:40px;position:absolute;bottom:0;left:0;right:0}
.most-commented-title{color:#fff;margin-top:0;margin-bottom:30px;font-size:20px;line-height:26px}
.post-meta{align-items:center;display:flex}
.post-comments{color:#fff;background-color:rgba(255,255,255,.2);border-radius:5px;align-items:center;margin-right:10px;padding:5px 10px;font-size:13px;font-weight:600;text-transform:uppercase;text-decoration:none;display:flex}
.meta-text{color:#fff;margin-left:0;font-size:14px}

/* ══════════════════════════════════════════
   ASIDE SIDEBAR
   ══════════════════════════════════════════ */
.aside{background-color:var(--aside-bg);border-radius:10px;padding:30px}
.aside-title{color:var(--secondary-text);text-transform:uppercase;margin-top:0;margin-bottom:20px;font-size:24px;line-height:28px;font-weight:800}
.one-post-item{border-radius:10px;position:relative}
.one-post-item img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:10px}
.staff-picks-text-box{padding:30px;position:absolute;bottom:0;left:0;right:0}
.staff-picks-title{color:#fff;margin-top:0;margin-bottom:20px;font-size:20px;line-height:26px;font-weight:700}
.aside-post{background-color:#fff;border-radius:10px;align-items:center;margin-top:10px;padding:20px 20px 20px 30px;text-decoration:none;display:flex}
.aside-heading{color:var(--secondary-text);margin:0;padding-right:20px;font-size:18px;line-height:20px;font-weight:600}
.aside-post-img{object-fit:cover;border-radius:50%;width:70px;height:70px;margin-left:auto;flex-shrink:0}

.socials{margin-top:90px;margin-bottom:90px}
.social-link{background-color:#fff;border-radius:5px;align-items:center;margin-bottom:5px;padding:10px 10px 10px 17px;text-decoration:none;display:flex}
.scoial-icon{width:22px;height:22px;color:var(--teal)}
.social-text{color:var(--secondary-text);text-transform:capitalize;margin-left:13px;font-size:16px;font-weight:400}
.social-number{color:var(--navy);text-transform:uppercase;background-color:#f2f4f7;border-radius:5px;margin-left:auto;padding:12px;font-weight:600}

.tags{margin-bottom:80px}
.taks-link{color:var(--secondary-text);background-color:#fff;border-radius:5px;margin-bottom:10px;margin-right:10px;padding:8px 17px;font-size:14px;line-height:16px;text-decoration:none;transition:all .2s;display:inline-block}
.taks-link:hover{color:#fff;background-color:var(--default)}

.subscribe{margin-top:90px;margin-bottom:90px}
.form{position:relative}
.subscribe-field{width:100%;border:1px solid var(--border);border-radius:50px;height:59px;margin-bottom:0;padding:20px 130px 20px 20px;font-size:15px;font-family:var(--sans)}
.subscribe-field::placeholder{color:var(--secondary-text);font-size:15px;font-weight:300}
.submit-button{background-color:var(--default);color:#fff;border:none;border-radius:50px;padding:13px 33px;font-size:15px;font-weight:600;position:absolute;top:4px;right:4px;bottom:auto}
.newsletter-paragraph{margin-top:20px;margin-bottom:0}

/* ══════════════════════════════════════════
   FOOTER
   ══════════════════════════════════════════ */
.footer{background-color:var(--footer-bg);border-top:1px solid var(--footer-border);padding-top:70px;padding-bottom:70px}
.inner-footer{grid-column-gap:16px;grid-row-gap:16px;grid-template-columns:1fr 1fr 1fr;display:grid}
.footer-item{background-color:var(--footer-item-bg);border:1px solid var(--footer-border);border-radius:10px;padding:30px}
.footer-title{color:var(--secondary-text);text-transform:uppercase;margin-top:0;margin-bottom:20px;font-size:24px;line-height:28px;font-weight:800}
.footer-about{text-align:left;background-color:var(--navy);border-radius:10px;padding:25px}
.footer-logo{text-align:center;width:200px;margin-left:auto;margin-right:auto}
.footer-logo img{filter:brightness(0) invert(1)}
.footer-paragraph{color:#fff;text-align:left;border-top:1px solid var(--teal);margin:20px 0 0;padding-top:20px}
.footer-posts{background-color:#fff;border-radius:10px;align-items:center;margin-bottom:20px;padding:12px;text-decoration:none;display:flex}
.footer-links-icon-box{border:1px solid #fff;background-color:var(--navy);border-radius:5px;justify-content:center;align-items:center;width:50px;height:50px;padding:0;display:flex;flex-shrink:0}
.footer-links-icon{width:22px;height:22px;filter:brightness(0) invert(1)}
.footer-links-text{color:var(--secondary-text);text-transform:uppercase;margin-left:20px;font-size:15px;line-height:19px;font-weight:600}
.recent-post-item{border-bottom:1px solid #c8ced3;align-items:center;margin-bottom:20px;padding-bottom:20px;text-decoration:none;display:flex}
.recent-post-item:last-child{border-bottom:none;margin-bottom:0;padding-bottom:0}
.recent-post-img{background-color:#fff;object-fit:cover;border-radius:50%;width:60px;height:60px;padding:5px;flex-shrink:0}
.recent-post-text{color:var(--secondary-text);margin-left:20px;font-size:15px;line-height:22px;font-weight:500}

.copyright-box{background-color:var(--footer-item-bg);border:1px solid var(--footer-border);border-radius:10px;justify-content:space-between;align-items:center;margin-top:30px;padding:6px 6px 6px 30px;display:flex}
.copyright-text{color:var(--black);font-size:14px}
.back-to-top{background-color:var(--navy);border-radius:10px;justify-content:center;align-items:center;width:60px;height:60px;display:flex}
.backtotop-icon{width:28px;height:28px;filter:brightness(0) invert(1)}

/* ══════════════════════════════════════════
   ALL-CATEGORIES GRID
   ══════════════════════════════════════════ */
.categories-section{padding-top:0;padding-bottom:40px}
.home-category-list{grid-column-gap:16px;grid-row-gap:16px;grid-template-columns:1fr 1fr 1fr 1fr;display:grid}
.home-category-list.category-page-list{grid-column-gap:30px;grid-row-gap:30px;grid-template-columns:1fr 1fr 1fr}
.category-grid-item{
  border:5px solid #fff;
  border-radius:20px;
  text-decoration:none;
  transition:opacity .3s;
  display:block;
  position:relative;
  overflow:hidden;
  box-shadow:0 2px 15px rgba(0,0,0,.07);
}
.blog-category-main-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:15px;background-color:#c7d2dc}
.gradient-overlay{z-index:1;background-image:linear-gradient(rgba(255,255,255,0),rgba(13,27,42,.9));border-radius:15px;position:absolute;inset:0}
.category-name{z-index:2;color:#fff;text-align:center;text-transform:uppercase;font-size:16px;font-weight:700;text-decoration:none;position:absolute;bottom:20px;left:0;right:0}

/* ══════════════════════════════════════════
   PAGE HERO / SITEMAP BANNER (about, contact, category)
   ══════════════════════════════════════════ */
.sitemap{background-color:#fff;border-radius:10px;margin-bottom:30px;padding:10px}
.inner-sitemap{
  background-color:var(--navy);
  background-image:linear-gradient(135deg,var(--navy) 0%,var(--teal) 100%);
  border-radius:10px;
  align-items:center;
  padding:60px;
  display:flex;
}
.sitemap-title{color:#fff;text-transform:uppercase;border:2px solid #fff;border-radius:10px;margin:0;padding:13px;font-size:40px;font-weight:200;display:inline-block}
.sitemap-text{color:#fff;margin-left:20px;font-size:20px;font-weight:300}

/* ══════════════════════════════════════════
   ABOUT PAGE
   ══════════════════════════════════════════ */
.about{grid-column-gap:70px;grid-row-gap:70px;background-color:#fff;border-radius:10px;grid-template-columns:1fr 1fr;margin-bottom:30px;padding:10px;display:grid}
.about-image-box{position:relative}
.about-img{border-radius:10px;width:100%;aspect-ratio:1/1;object-fit:cover}
.about-text-box{padding-right:60px;display:flex;flex-direction:column;justify-content:center}
.about-title{color:var(--secondary-text);text-transform:uppercase;margin-top:0;margin-bottom:40px;font-size:50px;line-height:48px}
.about-paragraph{margin-bottom:0;font-size:20px;line-height:28px}

.team{grid-column-gap:30px;grid-row-gap:30px;grid-template-columns:1fr 1fr 1fr;margin-bottom:30px;display:grid}
.team-member{background-color:#fff;border-radius:10px;padding:30px 30px 90px 30px;position:relative}
.member-image{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:10px;margin-bottom:20px}
.member-name{color:var(--secondary-text);border-bottom:1px solid var(--secondary-text);margin-top:0;margin-bottom:15px;padding-bottom:5px;font-size:26px;font-weight:300;line-height:27px;display:inline-block}
.member-job{text-transform:uppercase;background-color:#fff;border:1px solid #dce1e7;border-radius:10px;padding:10px 16px;font-size:14px;display:inline-block;position:absolute;bottom:30px;left:30px}

.awards{background-color:#fff;border-radius:10px;margin-bottom:100px}
.award-title{color:var(--secondary-text);text-transform:uppercase;margin-top:0;margin-bottom:0;padding:40px 30px;font-size:40px}
.award-header{grid-column-gap:16px;grid-row-gap:16px;background-color:var(--navy);grid-template-columns:1fr 1fr 1fr 1fr;padding:40px 30px;display:grid;border-radius:0}
.award-header-title{color:#fff;text-transform:uppercase;margin:0;font-size:16px}
.award-item{grid-column-gap:16px;grid-row-gap:16px;border-bottom:1px solid #e7eaef;grid-template-columns:1fr 1fr 1fr 1fr;align-items:center;padding:30px}
.award-item.last-award-item{border-bottom:none}
.award-body-text{font-size:16px;line-height:20px;margin:0}

/* ══════════════════════════════════════════
   CONTACT PAGE
   ══════════════════════════════════════════ */
.contact{grid-column-gap:20px;grid-row-gap:20px;background-color:#fff;border-radius:10px;grid-template-columns:1fr 1fr;margin-bottom:30px;padding:10px;display:grid}
.contact-infos{
  background-color:var(--navy);
  background-image:linear-gradient(135deg,var(--navy) 0%,var(--teal) 100%);
  border-radius:10px;
  align-items:center;
  padding:60px;
  display:flex;
}
.contact-page-link{color:#fff;margin-bottom:15px;font-size:22px;font-weight:400;line-height:21px;text-decoration:none;display:block}
.form-div{padding:20px 10px}
.contact-title{color:var(--secondary-text);text-transform:uppercase;margin-top:0;margin-bottom:20px;font-size:30px;font-weight:300;line-height:30px}
.input-field{width:100%;border:none;border-bottom:1px solid #cdd3dd;border-radius:0;margin-bottom:20px;padding:15px 5px;font-size:16px;font-family:var(--sans);background:none}
.input-field::placeholder{color:var(--secondary-text);font-size:16px}
.input-field.textarea{min-height:120px}
.read-more{color:#fff;text-transform:capitalize;background-color:var(--default);border:1px solid var(--teal-light);border-radius:50px;padding:12px 40px;font-size:18px;font-weight:600;transition:all .2s;display:inline-block;box-shadow:0 2px 5px rgba(0,0,0,.09)}
.read-more:hover{box-shadow:0 2px 20px 5px rgba(0,0,0,.1)}

.contact-info-box{text-align:center;background-color:var(--navy-dark);border-radius:10px;padding:50px}
.contact-socials-and-faqs{grid-column-gap:30px;grid-row-gap:30px;grid-template-columns:1fr 1fr;margin-bottom:100px;display:grid}
.contact-socials{grid-column-gap:30px;grid-row-gap:30px;grid-template-columns:1fr 1fr;display:grid}
.contact-social-item{background-color:#fff;border-radius:10px;flex-direction:column;justify-content:center;align-items:center;padding:50px 40px;text-decoration:none;display:flex}
.contact-social-icon{border:1px solid #eceef2;border-radius:50%;width:90px;height:90px;padding:25px;color:var(--teal)}
.contact-social-text{color:var(--secondary-text);text-transform:capitalize;margin-top:20px;font-size:18px;line-height:22px;font-weight:600}

.accordion{background-color:var(--white);border-radius:10px;margin-top:0;padding:30px}
.accordion-item{width:100%;margin-bottom:0;overflow:hidden}
.accordion-toggle{color:var(--secondary-text);background:none;border:1px solid #efefef;border-radius:5px;justify-content:space-between;align-items:center;width:100%;margin-bottom:20px;padding:16px 20px;font-size:18px;font-weight:600;display:flex;text-align:left}
.accordion-toggle.is-open{background-color:#fff;border-color:var(--teal)}
.accordion-icon{width:20px;height:20px;flex-shrink:0;transition:transform .2s}
.accordion-toggle.is-open .accordion-icon{transform:rotate(45deg)}
.accordion-paragraph{color:#2e3946;margin:-10px 0 20px;padding:0 20px;font-size:16px;line-height:24px;display:none}
.accordion-item.is-open .accordion-paragraph{display:block}

/* ══════════════════════════════════════════
   SINGLE POST (article)
   ══════════════════════════════════════════ */
.single-blog-section{padding-top:0;padding-bottom:40px}
.single-post-body{background-color:#fff;border-radius:10px;padding:10px}
.single-post-body .blog-image{aspect-ratio:16/9}
.single-blog-inner{padding:40px}
.signle-post-title{color:var(--secondary-text);margin-top:0;margin-bottom:30px;font-size:44px;line-height:50px}
.single-post-paragraph{margin-bottom:0;font-size:18px;line-height:28px}
.block-quote{border-left:4px solid var(--default);margin:50px 0;padding:10px 0 10px 30px;font-size:22px;font-style:italic;color:var(--navy)}
.single-post-tags{border-top:1px solid #f3f5f7;border-bottom:1px solid #f3f5f7;margin-top:30px;margin-bottom:40px;padding-top:20px;padding-bottom:20px}

/* article rich-text content classes */
.art-body p{margin-bottom:20px;font-size:18px;line-height:28px}
.art-body ul,.art-body ol{margin:0 0 20px 22px;line-height:1.7}
.art-body ul{list-style:disc}
.art-body ol{list-style:decimal}
.art-body li{margin-bottom:8px;font-size:18px}
.art-body h2{color:var(--secondary-text);font-size:clamp(24px,3vw,32px);font-weight:700;margin:44px 0 16px;line-height:1.25}
.art-body h3{color:var(--secondary-text);font-size:22px;font-weight:700;margin:32px 0 14px}
.art-body strong{font-weight:700;color:var(--secondary-text)}
.art-body a{color:var(--teal);text-decoration:underline}
.art-body figure,.art-body .art-fig{margin:36px 0}
.art-body figure img,.art-body .art-fig img{width:100%;height:auto;border-radius:10px}
.art-body figure figcaption,.art-body .art-fig figcaption{font-size:13px;color:#6e7d8c;padding:8px 0;font-style:italic}
.art-body .callout{border-left:4px solid var(--default);padding:18px 22px;margin:28px 0;font-size:16px;line-height:1.6;background:rgba(46,106,142,.06);border-radius:0 8px 8px 0}
.gt-pick{border:1px solid var(--border);border-radius:10px;padding:24px;margin:32px 0;background:#f7f9fb}
.art-body .cmp{width:100%;border-collapse:collapse;font-size:14px;margin:14px 0}
.art-body .cmp th{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#6e7d8c;text-align:left;padding:10px;border-bottom:2px solid var(--default)}
.art-body .cmp td{padding:10px;border-bottom:1px solid var(--border)}
.art-body .specs{width:100%;border-collapse:collapse;font-size:14px;margin:12px 0}
.art-body .specs th,.art-body .specs td{padding:8px 10px;border-bottom:1px solid var(--border);text-align:left}

.score-panel{background:#f7f9fb;border:1px solid var(--border);padding:24px;margin:28px 0;border-radius:8px}
.score-panel-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#8b98a5;margin-bottom:16px}
.score-dims{margin-top:12px}
.score-dim{margin-bottom:12px}
.score-dim-label{display:flex;justify-content:space-between;font-size:13px;color:#5a6673;margin-bottom:4px}
.score-dim-label strong{color:var(--secondary-text);font-weight:700}
.score-bar{width:100%;height:6px;background:#e0e6ec;border-radius:3px;overflow:hidden}
.score-bar-fill{height:100%;background:var(--teal);border-radius:3px}
.score-overall{font-size:15px;font-weight:700;color:var(--secondary-text)}
.score-avg{font-size:13px;color:#8b98a5}

.pick-card{border:1px solid var(--border);margin:28px 0;overflow:hidden;background:#fff;border-radius:10px}
.pick-card-badge{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#fff;background:var(--teal);display:inline-block;padding:6px 16px}
.pick-card-img{overflow:hidden;position:relative}
.pick-card-img img:not(.pick-seal){width:100%;height:auto;aspect-ratio:16/10;object-fit:cover}
.pick-card-body{padding:20px}
.pick-card-body h3{font-size:20px;font-weight:700;color:var(--secondary-text);margin-bottom:4px;margin-top:0}
.pick-card-sub{font-size:12px;color:#8b98a5;margin-bottom:10px}
.pick-card-desc{font-size:15px;color:#3d4a57;line-height:1.65}

.pros-cons{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin:24px 0}
.pros-list,.cons-list{padding:0}
.pros-list h4,.cons-list h4{font-size:14px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:10px;margin-top:0}
.pros-list h4{color:#2d8a4e}
.cons-list h4{color:#b83040}
.pros-list ul,.cons-list ul{list-style:none;padding:0;margin:0}
.pros-list li,.cons-list li{font-size:14px;color:#3d4a57;padding:6px 0 6px 20px;position:relative;line-height:1.5}
.pros-list li::before{content:"+";position:absolute;left:0;color:#2d8a4e;font-weight:700}
.cons-list li::before{content:"\2212";position:absolute;left:0;color:#b83040;font-weight:700}

.specs-table{background:#fff;border:1px solid var(--border);margin:24px 0;overflow:hidden;border-radius:8px}
.specs-table-title{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#8b98a5;padding:14px 16px;border-bottom:1px solid var(--border)}
.specs-table table{width:100%;border-collapse:collapse;font-size:14px}
.specs-table tr{border-bottom:1px solid #f0f0f0}
.specs-table tr:last-child{border-bottom:none}
.specs-table td{padding:10px 16px;vertical-align:top}
.specs-table td:first-child{font-weight:700;color:var(--secondary-text);width:40%}
.specs-table td:last-child{color:#5a6673}

.cmp-wrap,.table-wrap{overflow-x:auto;-webkit-overflow-scrolling:touch;margin:24px 0}
.data-table{width:100%;border-collapse:collapse;margin:24px 0;font-size:14px}
.data-table th{background:var(--navy);color:#fff;padding:10px 14px;text-align:left;font-size:12px;text-transform:uppercase;letter-spacing:.04em}
.data-table td{padding:10px 14px;border-bottom:1px solid #eee;color:#3d4a57}
.data-table tr:nth-child(even){background:#f7f9fb}
.data-table td:first-child{font-weight:600;color:var(--secondary-text)}

.callout{background:#f0f6fa;border-left:4px solid var(--teal);padding:18px 20px;margin:24px 0;font-size:15px;line-height:1.7;color:#333;border-radius:0 8px 8px 0}
.callout strong{color:var(--secondary-text)}
.callout em{color:var(--teal);font-style:normal;font-weight:700}

.art-crumb{font-size:13px;color:#8b98a5;margin-bottom:10px}
.sb-section{margin:60px 0 0}
.sb-head{font-size:20px;font-weight:800;color:var(--secondary-text);margin-bottom:20px}
.sb-related{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.sb-rel-cat{font-size:11px;font-weight:700;text-transform:uppercase;color:var(--teal);margin-bottom:6px}

@media screen and (max-width:767px){
  .pros-cons{grid-template-columns:1fr}
  .sb-related{grid-template-columns:1fr}
}

/* ══════════════════════════════════════════
   404
   ══════════════════════════════════════════ */
.error-404{text-align:center;padding:100px 20px}
.error-404 .error-code{font-size:120px;font-weight:800;color:var(--teal);line-height:1;margin-bottom:20px}

/* ══════════════════════════════════════════
   UTILITY
   ══════════════════════════════════════════ */
.link-underline{text-decoration:underline}

/* ══════════════════════════════════════════
   BREAKPOINTS
   ══════════════════════════════════════════ */
@media screen and (min-width:1440px){
  .home-category-list{grid-template-columns:repeat(8,1fr)}
}

@media screen and (max-width:991px){
  .blog-section,.blog-column{grid-template-columns:1fr!important}
  .blog-column{margin-bottom:20px}
  .blog-four-columns{grid-column-gap:10px;grid-row-gap:10px}
  .blog-four-columns.blog-page-three{grid-template-columns:1fr 1fr}
  .business-category{margin-top:30px;margin-bottom:30px}
  .business-cateogry-blog{grid-column-gap:20px;grid-row-gap:20px;grid-template-columns:1fr}
  .business-cateogry-item{padding-top:20px;padding-bottom:20px}
  .business-image{position:static}
  .business-text{margin-left:20px}
  .inner-footer{grid-template-columns:1fr}
  .about{grid-column-gap:40px;grid-row-gap:40px;grid-template-columns:1fr;padding-bottom:20px}
  .about-text-box{padding-right:0}
  .team{grid-column-gap:10px;grid-row-gap:10px;grid-template-columns:1fr}
  .contact{grid-template-columns:1fr;width:100%}
  .contact-infos{width:100%;padding:60px 30px}
  .contact-socials-and-faqs{grid-template-columns:1fr}
  .menu-button{display:block}
  .nav-menu{display:none}
  .home-category-list{grid-template-columns:1fr 1fr 1fr}
  .single-blog-inner{padding:30px}
}

@media screen and (max-width:767px){
  .header{padding-top:20px}
  .blog-column{padding-left:0;padding-right:0}
  .blog-four-columns,.blog-four-columns.blog-page-three,.trending-post-item{grid-template-columns:1fr}
  .featured-list{grid-template-columns:1fr 1fr}
  .gaming-list{grid-template-columns:1fr}
  .categories-section{padding-top:0}
  .home-category-list{grid-template-columns:1fr 1fr}
  .home-category-list.category-page-list{grid-template-columns:1fr}
  .contact-socials{grid-template-columns:1fr}
  .sitemap-title{font-size:30px;padding:10px}
  .sitemap-text{font-size:16px}
  .inner-sitemap{padding:40px 20px;flex-direction:column;align-items:flex-start;gap:10px}
  .sitemap-text{margin-left:0}
}

@media screen and (max-width:479px){
  .navbar{padding:20px}
  .logo-image{width:90px}
  .big-post-item{padding-bottom:20px}
  .blog-title{color:var(--secondary-text);margin-top:20px;font-size:20px;line-height:26px}
  .blog-text{padding-right:0;position:static}
  .time-of-post{color:var(--secondary-text)}
  .blog-four-category-and-time{display:block}
  .blog-four-category-link.blog-time{margin-top:10px;margin-left:0}
  .business-cateogry-item{display:block}
  .business-text{margin-top:20px;margin-left:0}
  .trending-posts,.featured-posts{margin-bottom:30px}
  .featured-list{grid-template-columns:1fr}
  .gaming-list{margin-bottom:40px}
  .most-commented-text-box{padding:20px;position:static}
  .most-commented-title{color:var(--secondary-text);margin-top:0;margin-bottom:20px}
  .post-meta{display:block}
  .post-comments{border:1px solid var(--border);margin-bottom:10px;margin-right:0}
  .meta-text{color:var(--secondary-text)}
  .aside{padding-left:20px;padding-right:20px}
  .staff-picks-text-box{padding:20px 0;position:static}
  .staff-picks-title{color:var(--secondary-text)}
  .aside-post{padding:20px;display:block}
  .aside-heading{margin-bottom:10px;padding-right:0}
  .socials{margin-top:40px;margin-bottom:40px}
  .tags{margin-bottom:40px}
  .subscribe{margin-top:40px;margin-bottom:40px}
  .submit-button{width:100%;margin-top:10px;display:block;position:static}
  .footer{padding-top:40px;padding-bottom:40px}
  .award-header{padding:20px 10px}
  .award-header-title{font-size:11px}
  .award-item{padding:20px 10px;grid-template-columns:1fr 1fr}
  .award-body-text{font-size:12px}
  .contact-page-link{margin-bottom:7px;font-size:17px}
  .contact-infos{width:100%;padding:30px 15px}
  .read-more{text-align:center;padding:10px 20px;font-size:16px}
  .contact-info-box{padding-left:20px;padding-right:20px}
  .contact-socials-and-faqs{grid-column-gap:20px;grid-row-gap:20px}
  .single-blog-inner{padding-left:20px;padding-right:20px}
  .signle-post-title{font-size:27px;line-height:32px}
  .block-quote{font-size:15px;line-height:20px}
  .home-category-list{grid-template-columns:1fr}
  .about-title{font-size:32px;line-height:36px}
}