/*
Theme Name: incrementone2
Description: Increment One corporate WordPress theme with front-page news, vertical service sections, and contact CTA.
Version: 1.0.0
Text Domain: incrementone2
*/

/* ========== Base ========== */
body{font-size:18px;font-family:'Noto Sans JP',sans-serif;margin:0;color:#222;background:#f8f8f8;}
h2{color:#133c62;font-size:2em;display:inline-block;position:relative;padding-bottom:.3em;margin-bottom:1em;}
h2::after{content:"";display:block;position:absolute;left:0;bottom:0;width:100%;height:4px;background:linear-gradient(to right,#1e6fb8,#133c62);border-radius:2px;}
.container{max-width:1000px;margin:0 auto;padding:0 24px;}

/* ========== Header (title row / menu row, never overlap) ========== */
.site-header{
  background:#fff;
  border-bottom:1px solid #453535;
  padding:18px 0;
}

/* 1段目=タイトル / 2段目=メニュー（常に段を分離） */
.header-flex{
  display:grid;
  grid-template-areas:
    "brand"
    "nav";
  grid-template-columns: 1fr;
  row-gap:14px;
  padding-left:10%;
  padding-right:10%;          /* ★ 右側10%も必ず確保 */
}

/* タイトル（左10%に寄せ） */
.site-branding{
  grid-area:brand;
  justify-self:start;
  text-align:left;
  min-width:0;
}
.site-title{
  margin:0;
  font-weight:800;
  color:#133c62;
  text-decoration:none;
  line-height:1.2;
  font-size:clamp(22px, 2.6vw, 40px);
  white-space:normal;
  overflow-wrap:anywhere;
}
.site-description{margin:6px 0 0;font-size:12px;color:#54687a;}

/* メニュー行の土台（PC/タブレットは常に表示。右起点・折返し対応） */
.site-header nav{
  grid-area:nav;
  width:100%;
  min-width:0;
  justify-self:end;           /* 行全体を右寄せ */
}

/* ★ ベース（≥800px を想定）— まず表示を grid で定義しておく */
.main-navigation ul,
.main-navigation .menu,
#site-primary-menu{
    list-style:none;
    margin:0;
    padding:0;

    display:flex;
    flex-wrap:wrap;

    justify-content:flex-end;
    gap:16px;

    width:100%;
}

.main-navigation li{
    list-style:none;
    margin:0;
    padding:0;
}

/* 列数の段階調整（見切れを防ぐ） */
@media (min-width:1000px) and (max-width:1199.98px){
  .main-navigation .menu,
  #site-primary-menu{
    grid-template-columns:repeat(3, max-content); /* 3列 */
    gap:18px 24px;
  }
}
@media (min-width:800px) and (max-width:999.98px){
  .main-navigation .menu,
  #site-primary-menu{
    grid-template-columns:repeat(2, max-content); /* 2列 */
    gap:16px 20px;
  }
}

/* PC/タブレット（≥800px）はトグル非表示 */
@media (min-width:800px){
  .menu-toggle{ display:none; }
}

/* --- モバイル（<800px）：タイトル左 / トグル右、メニューはトグルで開閉 --- */
@media (max-width:799.98px){
  .header-flex{
    grid-template-areas:
      "brand toggle"
      "nav   nav";
    grid-template-columns: 1fr auto;
    row-gap:10px;
  }

  .menu-toggle{
    grid-area:toggle;
    justify-self:end;         /* 右10%位置 */
    display:block;
    border:0;
    background:transparent;
    padding:8px;
    cursor:pointer;
    width:44px; height:36px; border-radius:8px;
  }
  .menu-toggle:focus{outline:2px solid #1e6fb8;outline-offset:2px;}
  .menu-toggle-bar{display:block;width:100%;height:3px;background:#133c62;border-radius:2px;margin:6px 0;}

  .site-header nav{ grid-column:1 / -1; width:100%; }

  /* ★ モバイルは初期非表示。is-open の時だけ展開 */
  .main-navigation .menu,
  #site-primary-menu{
    display:none;             /* ← モバイルだけ非表示 */
    list-style:none;
    margin:0;
    padding:0;
    width:100%;
    box-sizing:border-box;
    gap:10px 14px;
    overflow-x:hidden;
  }
  .main-navigation.is-open .menu,
  .main-navigation.is-open #site-primary-menu{
    display:flex;             /* ← トグルで表示 */
    flex-wrap:wrap;
    justify-content:flex-start;
  }

  /* ボタンを詰めて見切れ防止 */
  .site-header nav a{
    padding:10px 20px;
    min-width:0;              /* 固定幅を持たせない */
    white-space:nowrap;
    font-size:0.95em;
  }
}

/* メニューボタンの共通スタイル */
.site-header nav ul ul{display:contents;}
.site-header nav li{margin:0;padding:0;}
.site-header nav a{
  display:inline-block;
  padding:10px 24px;
  border:2px solid #1e6fb8;
  border-radius:12px;
  background:#fff;
  color:#1e6fb8;
  font-weight:700;
  text-decoration:none;
  line-height:1;
  min-width:86px;             /* PCでは適度な最小幅、SPでは上で上書き */
  text-align:center;
  transition:background .2s,color .2s,border-color .2s,box-shadow .2s;
  box-sizing:border-box;
}
.site-header nav a:hover,
.site-header nav .current-menu-item > a{
  background:#1e6fb8; color:#fff; border-color:#133c62;
  box-shadow:0 2px 8px rgba(30,111,184,.07);
}

/* 保険：縦書き解除 */
.site-header *{writing-mode:horizontal-tb !important;transform:none !important;}

/* メインビジュアル（共通） */
.main-visual {
  position: relative;
  overflow: hidden;
}

/* 画像タグで表示する場合 */
.main-visual__inner {
  max-width: 100%;
}
.main-visual__inner img {
  display: block;
  width: 100%;
  height: auto;
}

/* 背景で全面に敷く場合 */
.main-visual.is-bg {
  width: 100%;
  min-height: var(--mv-height, 60vh);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
}

/* アクセシビリティ用：視覚的に非表示 */
.u-visually-hidden {
  position: absolute !important;
  clip: rect(1px, 1px, 1px, 1px);
  width: 1px; height: 1px;
  overflow: hidden;
  white-space: nowrap;
}

/* ========== Hero / Sections ========== */
.hero{background:linear-gradient(90deg,#e1f0fc 0%,#fdf6e3 100%);text-align:center;padding:60px 0 40px;}
.site-description{font-size:1.3em;color:#555;}
.intro{background:#fff;padding:44px 0 30px;}

.service-section{background:#f6fafd;padding:50px 0 60px;}
.service-section h2{text-align:center;color:#133c62;margin-bottom:36px;font-size:2em;}
.service-boxes{display:flex;flex-wrap:wrap;gap:36px;justify-content:center;}
.service-box{background:#fff;border-radius:12px;box-shadow:0 4px 18px 0 #e9eef2;padding:28px 22px;width:260px;text-align:center;}

.site-footer{background:#133c62;color:#fff;text-align:center;padding:22px 0;margin-top:40px;font-size:.96em;}

@media (max-width:800px){.service-boxes{flex-direction:column;align-items:center;}}

/* ========== Company page ========== */
.company-hero{background:linear-gradient(90deg,#e1f0fc 0%,#fdf6e3 100%);padding:50px 0 30px;text-align:center;}
.company-hero h1{color:#133c62;}
.company-info{background:#fff;padding:40px 0;}
.company-table{width:100%;max-width:700px;margin:0 auto;border-collapse:collapse;background:#fff;box-shadow:0 2px 8px #e9eef2;}
.company-table th,.company-table td{border:1px solid #e5e5e5;padding:15px 20px;text-align:left;}
.company-table th{background:#f6fafd;color:#133c62;width:140px;}

/* ========== Blog list ========== */
.blog-hero{background:#e1f0fc;padding:48px 0 28px;text-align:center;}
.blog-hero h1{color:#133c62;}
.blog-list{background:#fff;padding:40px 0;}
.posts-list{list-style:none;padding:0;margin:0;display:grid;gap:32px;}
.post-item{display:flex;gap:18px;background:#f6fafd;border-radius:10px;box-shadow:0 2px 6px #e9eef2;padding:18px;transition:box-shadow .2s;}
.post-item:hover{box-shadow:0 4px 14px #d6e5f2;}
.post-thumb{flex-shrink:0;}
.post-info{flex-grow:1;}
.post-title{font-size:1.2em;color:#133c62;margin-bottom:8px;}
.post-date{font-size:.95em;color:#999;margin-bottom:12px;display:block;}
.post-excerpt{color:#333;font-size:1em;}
.pagination{margin-top:36px;text-align:center;}

@media (max-width:650px){
  .company-table th,.company-table td{padding:10px;}
  .post-item{flex-direction:column;gap:10px;}
}

/* ========== Contact page ========== */
.contact-hero{background:linear-gradient(90deg,#e1f0fc 0%,#fdf6e3 100%);padding:48px 0 28px;text-align:center;}
.contact-hero h1{color:#133c62;}
.contact-form-section{background:#fff;padding:40px 0;}
.contact-form{max-width:500px;margin:0 auto;background:#f6fafd;border-radius:10px;box-shadow:0 2px 8px #e9eef2;padding:28px 22px;}
.form-group{margin-bottom:18px;}
.form-group label{display:block;margin-bottom:6px;color:#133c62;font-weight:bold;}
.form-group input,.form-group textarea{width:100%;padding:10px;border:1px solid #c3d6e8;border-radius:5px;font-size:1em;box-sizing:border-box;background:#fff;}
.form-group textarea{resize:vertical;}
.form-group .required{color:#e55039;font-size:.95em;}
.form-group button[type="submit"]{background:#1e6fb8;color:#fff;border:none;padding:12px 32px;border-radius:5px;cursor:pointer;font-size:1.1em;font-weight:600;transition:background .2s;}
.form-group button[type="submit"]:hover{background:#133c62;}
.contact-success{color:#158467;background:#e7fbe9;padding:10px;border-radius:6px;margin-top:14px;text-align:center;}
.contact-error{color:#e55039;background:#fbe9e7;padding:10px;border-radius:6px;margin-top:14px;text-align:center;}

/* ========== 404 page ========== */
.notfound-hero{background:linear-gradient(90deg,#e1f0fc 0%,#fdf6e3 100%);padding:80px 0 60px;text-align:center;}
.notfound-title{font-size:2.6em;color:#133c62;margin-bottom:18px;font-weight:bold;}
.notfound-message{font-size:1.2em;color:#555;margin-bottom:32px;}
.notfound-home-btn{display:inline-block;padding:12px 36px;border-radius:8px;border:2px solid #1e6fb8;background:#fff;color:#1e6fb8;font-weight:bold;text-decoration:none;font-size:1.1em;transition:background .2s,color .2s,box-shadow .2s;}
.notfound-home-btn:hover{background:#1e6fb8;color:#fff;box-shadow:0 2px 8px rgba(30,111,184,.07);border-color:#133c62;}

/* ========== Index popular section ========== */
.popular-articles{background:#fff;padding:40px 0 36px;}
.popular-title{font-size:1.6em;color:#133c62;margin-bottom:28px;text-align:center;}
.popular-grid{display:grid;grid-template-columns:1fr 1fr;gap:26px;max-width:900px;margin:0 auto 30px;}
.popular-item{background:#f6fafd;border-radius:10px;box-shadow:0 2px 8px #e9eef2;display:flex;gap:16px;overflow:hidden;transition:box-shadow .2s;}
.popular-item a{display:flex;gap:16px;width:100%;color:inherit;text-decoration:none;}
.popular-thumb img{width:120px;height:90px;object-fit:cover;border-radius:0;background:#e5e5e5;display:block;}
.popular-info{padding:12px 0;flex:1;}
.popular-article-title{font-size:1.07em;color:#133c62;margin-bottom:8px;font-weight:bold;}
.popular-desc{font-size:.98em;color:#444;}
.more-link-wrap{text-align:center;margin-top:18px;}
.more-link{display:inline-block;padding:10px 38px;background:#1e6fb8;color:#fff;border-radius:8px;text-decoration:none;font-weight:bold;font-size:1.1em;transition:background .2s;}
.more-link:hover{background:#133c62;}

@media (max-width:650px){
  .popular-grid{grid-template-columns:1fr;gap:16px;}
  .popular-thumb img{width:90px;height:70px;}
}

  .archive-list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
  }

  .archive-item {
    border-bottom: 1px solid #eee;
    padding-bottom: 1.5rem;
  }

  .archive-grid {
    display: flex;
    align-items: flex-start;
    gap: 1rem;
  }

  .archive-thumb-wrap {
    flex: 0 0 30%;
  }

  .archive-thumb-wrap img,
  .archive-thumb-wrap .no-thumb {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 4px;
  }

  .no-thumb {
    background: #f2f2f2;
    aspect-ratio: 16 / 9;
  }

  .archive-body {
    flex: 1 1 70%;
  }

  .archive-title {
    font-size: 1.1rem;
    margin: 0 0 .4rem;
  }

  .archive-meta {
    font-size: 0.9rem;
    color: #666;
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    margin-bottom: .5rem;
  }

  .archive-excerpt {
    font-size: 0.95rem;
    color: #333;
  }

  .pagination {
    display: flex;
    flex-wrap: wrap;
    gap: .5rem;
    justify-content: center;
    margin-top: 2rem;
  }
  .pagination a, .pagination span {
    padding: .4rem .6rem;
    border: 1px solid #ddd;
    border-radius: 4px;
    text-decoration: none;
  }
  .pagination .current {
    background: #333;
    color: #fff;
    border-color: #333;
  }

/* ========== Category page ========== */
.category-tree-list{list-style:none;margin:0;padding:0;font-size:1.2rem;}
.category-tree-list .cat-item{margin-bottom:1.8em;padding-left:0;}
.cat-link{display:flex;align-items:center;gap:1.2em;padding:1.2em 2em;background:#f0f6fb;border-radius:2em;font-size:1.35em;text-decoration:none;color:#175782;box-shadow:0 2px 12px rgba(30,111,184,.06);transition:background .2s,box-shadow .2s;}
.cat-link:hover{background:#e0efff;color:#0b3559;box-shadow:0 6px 24px rgba(30,111,184,.13);}
.cat-img{width:56px;height:56px;object-fit:cover;border-radius:50%;background:#fff;border:2px solid #1e6fb8;flex-shrink:0;}
.cat-img-placeholder{display:inline-block;width:56px;height:56px;border-radius:50%;background:#e7e7e7;border:2px dashed #b5b5b5;}
.cat-name{font-weight:bold;font-size:1em;letter-spacing:.04em;}
.child-cat-list{margin-top:1.2em;margin-left:3.2em;padding-left:1.5em;border-left:2px solid #b5d4f4;list-style:none;}
@media (max-width:600px){
  .cat-link{font-size:1em;padding:1em;}
  .cat-img,.cat-img-placeholder{width:38px;height:38px;}
}

/* ==========================================================
   IT技術コンテンツ
   ========================================================== */

.tech-content-list-section{
    padding:80px 0;
    background:#fff;
}

.tech-content-card{

    display:grid;
    grid-template-columns:minmax(0,1.05fr) minmax(320px,.95fr);

    gap:clamp(24px,4vw,56px);

    align-items:stretch;

    padding:clamp(24px,4vw,48px);

    background:#f6fafd;

    border-radius:28px;

    box-shadow:0 14px 34px rgba(19,60,98,.08);
}

.tech-content-card__content{

    display:flex;

    flex-direction:column;

    justify-content:center;
}

.tech-content-description{

    margin:0;

    color:#384b5f;

    line-height:2;

    font-size:1.05rem;
}

.tech-content-card__content .more-link{

    align-self:flex-start;

    margin-top:30px;
}

.tech-content-card__visual{

    display:block;

    overflow:hidden;

    border-radius:24px;

    min-height:260px;

    transition:
        transform .25s ease,
        box-shadow .25s ease;
}

.tech-content-card__visual:hover{

    transform:translateY(-5px);

    box-shadow:0 20px 40px rgba(19,60,98,.15);
}

.tech-content-card__visual img{

    width:100%;

    height:100%;

    object-fit:cover;

    display:block;
}

@media (max-width:900px){

    .tech-content-card{

        grid-template-columns:1fr;
    }

    .tech-content-card__visual{

        min-height:220px;
    }

}

/* ========== Post Prev/Next ========== */
.post-nav{display:flex;justify-content:space-between;align-items:stretch;margin:2em 0 0;padding:0 2%;gap:16px;}
.post-nav-previous,.post-nav-next{flex:1;text-align:center;}
.post-nav a{display:inline-block;padding:.8em 1.2em;background:#1e6fb8;color:#fff;border-radius:2em;text-decoration:none;font-weight:bold;transition:background .2s;}
.post-nav a:hover{background:#174f7a;}

/* ========== Misc ========== */
.outer-link{display:inline-block;font-size:16px;color:#0073aa;text-decoration:none;font-weight:bold;position:relative;padding-left:1.2em;}
.outer-link::before{position:absolute;left:0;color:#0073aa;}
.outer-link:hover{text-decoration:underline;color:#005177;}
.order-toggle a.active{font-weight:bold;text-decoration:underline;}
/* ==========================================================
 * incrementone2 front page layout
 * ========================================================== */
.front-page {
  background: #f7f8fa;
}

.top-hero {
  position: relative;
  padding: clamp(70px, 9vw, 120px) 0 clamp(58px, 7vw, 92px);
  background:
    radial-gradient(circle at 15% 15%, rgba(30,111,184,.16), transparent 30%),
    linear-gradient(135deg, #eef7ff 0%, #fff9ea 100%);
  overflow: hidden;
}
.top-hero::after {
  content: "";
  position: absolute;
  right: -120px;
  bottom: -120px;
  width: 320px;
  height: 320px;
  border-radius: 50%;
  background: rgba(19,60,98,.08);
}
.top-hero .container {
  position: relative;
  z-index: 1;
}
.top-hero__eyebrow {
  margin: 0 0 14px;
  color: #1e6fb8;
  font-size: .88rem;
  font-weight: 800;
  letter-spacing: .18em;
  text-transform: uppercase;
}
.top-hero__title {
  margin: 0;
  color: #133c62;
  font-size: clamp(42px, 8vw, 96px);
  line-height: .95;
  letter-spacing: .02em;
  font-weight: 900;
}
.top-hero__text {
  max-width: 680px;
  margin: 24px auto 0;
  color: #435366;
  font-size: clamp(16px, 2vw, 20px);
  line-height: 1.9;
}

.section-heading {
  margin-bottom: 34px;
}
.section-heading--center {
  text-align: center;
}
.section-heading__en {
  margin: 0 0 8px;
  color: #1e6fb8;
  font-size: .78rem;
  font-weight: 900;
  letter-spacing: .18em;
}
.section-heading h2 {
  margin: 0;
}
.section-heading--center h2::after {
  left: 50%;
  transform: translateX(-50%);
}

.front-news {
  padding: clamp(52px, 8vw, 96px) 0;
  background: #fff;
}
.front-news-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 28px;
}
.front-news-card {
  min-width: 0;
  background: #fff;
  border: 1px solid #e4ebf2;
  border-radius: 18px;
  overflow: hidden;
  box-shadow: 0 12px 30px rgba(19,60,98,.08);
  transition: transform .2s ease, box-shadow .2s ease;
}
.front-news-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 18px 40px rgba(19,60,98,.12);
}
.front-news-card__link {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
}
.front-news-card__thumb {
  aspect-ratio: 16 / 10;
  background: #edf3f8;
  overflow: hidden;
}
.front-news-card__thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.front-news-card__body {
  padding: 20px 20px 24px;
}
.front-news-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 12px;
  color: #6a7a8c;
  font-size: .82rem;
  font-weight: 700;
}
.front-news-card__meta span {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 2px 10px;
  border-radius: 999px;
  background: #eef7ff;
  color: #1e6fb8;
}
.front-news-card__title {
  margin: 0 0 12px;
  color: #133c62;
  font-size: 1.08rem;
  line-height: 1.55;
}
.front-news-card__excerpt {
  margin: 0;
  color: #48586a;
  font-size: .94rem;
  line-height: 1.75;
}
.front-empty-message {
  grid-column: 1 / -1;
  text-align: center;
  color: #666;
}

.front-intro {
  padding: clamp(58px, 8vw, 100px) 0;
  background: #f6fafd;
}
.front-intro__inner {
  display: grid;
  grid-template-columns: minmax(220px, 34%) 1fr;
  gap: clamp(28px, 5vw, 72px);
  align-items: start;
}
.front-intro__text {
  color: #33465a;
  font-size: clamp(17px, 2vw, 22px);
  line-height: 2;
  font-weight: 600;
}
.front-intro__text p {
  margin-top: 0;
}

.front-service {
  padding: clamp(56px, 8vw, 100px) 0;
  background: #fff;
}
.service-list-vertical {
  display: grid;
  gap: 34px;
}
.service-row {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(260px, .95fr);
  gap: clamp(24px, 4vw, 56px);
  align-items: stretch;
  padding: clamp(22px, 4vw, 48px);
  border-radius: 28px;
  background: #f6fafd;
  box-shadow: 0 14px 34px rgba(19,60,98,.08);
}
.service-row:nth-child(even) .service-row__content {
  order: 2;
}
.service-row:nth-child(even) .service-row__visual {
  order: 1;
}
.service-row__content {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.service-row__number {
  display: inline-block;
  margin-bottom: 10px;
  color: #1e6fb8;
  font-size: .86rem;
  font-weight: 900;
  letter-spacing: .16em;
}
.service-row h3 {
  margin: 0 0 16px;
  color: #133c62;
  font-size: clamp(24px, 3vw, 38px);
  line-height: 1.3;
}
.service-row p {
  margin: 0;
  color: #384b5f;
  line-height: 1.9;
}
.service-row__button {
  align-self: flex-start;
  margin-top: 24px;
  padding: 10px 26px;
  border-radius: 999px;
  background: #1e6fb8;
  color: #fff;
  text-decoration: none;
  font-weight: 800;
  transition: background .2s ease, transform .2s ease;
}
.service-row__button:hover {
  background: #133c62;
  transform: translateY(-2px);
}
.service-row__visual {
  min-height: 260px;
  border-radius: 24px;
  overflow: hidden;
  background: linear-gradient(135deg, #dcefff, #fff4d5);
}
.service-row__visual img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.service-row__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  min-height: 260px;
  padding: 24px;
  box-sizing: border-box;
  color: rgba(19,60,98,.48);
  font-size: clamp(22px, 3vw, 34px);
  font-weight: 900;
  letter-spacing: .08em;
  text-align: center;
}

.front-contact {
  padding: clamp(58px, 8vw, 100px) 0;
  background: linear-gradient(135deg, #133c62 0%, #1e6fb8 100%);
  color: #fff;
}
.front-contact .section-heading__en,
.front-contact h2,
.front-contact__text {
  color: #fff;
}
.front-contact h2::after {
  background: rgba(255,255,255,.72);
}
.front-contact__inner {
  text-align: center;
}
.front-contact__text {
  max-width: 720px;
  margin: 0 auto 28px;
  font-size: clamp(17px, 2vw, 22px);
  line-height: 1.9;
}
.front-contact__button {
  display: inline-block;
  padding: 13px 42px;
  border: 2px solid #fff;
  border-radius: 999px;
  background: #fff;
  color: #133c62;
  font-weight: 900;
  text-decoration: none;
  transition: background .2s ease, color .2s ease, transform .2s ease;
}
.front-contact__button:hover {
  background: transparent;
  color: #fff;
  transform: translateY(-2px);
}

@media (max-width: 900px) {
  .front-news-grid {
    grid-template-columns: 1fr;
  }
  .front-intro__inner,
  .service-row {
    grid-template-columns: 1fr;
  }
  .service-row:nth-child(even) .service-row__content,
  .service-row:nth-child(even) .service-row__visual {
    order: initial;
  }
}

@media (max-width: 560px) {
  .front-news-card__body {
    padding: 18px;
  }
  .service-row {
    padding: 20px;
    border-radius: 20px;
  }
  .service-row__visual,
  .service-row__placeholder {
    min-height: 200px;
  }
}