/*
  ConnectingDots - blog skin (body.cd-skin), design B: rounded cards, soft shadows, pill controls.
  Keeps SWELL's article structure and blocks (TOC, boxes, lists, accordion, FAQ, related posts,
  author box, sidebar, pagination) and only changes colors, type, headings and the site chrome.

  1) SWELL's own color/font variables are overridden, so every SWELL block follows the brand.
  2) A few shapes (headings, cards, TOC, widgets) are restyled with the ConnectingDots tokens.
  Selectors target SWELL 2.x class names; check on a staging site after SWELL updates.
*/

/* ---------- 1. SWELL variables -> brand tokens ---------- */
body.cd-skin,#body_wrap.cd-skin{
  --color_main:#15183A;
  --color_main_thin:rgba(21,24,58,.06);
  --color_main_dark:#0E1029;
  --color_text:#2E3047;
  --color_link:#007C86;
  --color_htag:#15183A;
  --color_bg:#F5F4EF;
  --color_content_bg:#FFFFFF;
  --color_gradient1:#15183A;
  --color_gradient2:#343B70;
  --color_header_bg:#FFFFFF;
  --color_header_text:#15183A;
  --color_footer_bg:#15183A;
  --color_footer_text:#C9CCE4;
  --color_list_check:#2E8A5A;
  --color_list_num:#15183A;
  --color_list_good:#2E8A5A;
  --color_list_bad:#C8423A;
  --color_faq_q:#15183A;
  --color_faq_a:#007C86;
  --color_icon_good:#2E8A5A;
  --color_icon_bad:#C8423A;
  --color_icon_info:#007C86;
  --color_icon_announce:#B08400;
  --color_icon_pen:#343B70;
  --color_icon_book:#343B70;
  --color_icon_point:#B08400;
  --color_icon_check:#2E8A5A;
  --color_icon_batsu:#C8423A;
  --color_icon_hatena:#343B70;
  --color_icon_caution:#C8423A;
  --color_icon_memo:#4A4C60;
  --swl-font_family:'Inter','Noto Sans JP',system-ui,sans-serif;
  --swl-font_weight:400;

  background:var(--stage)!important;
  color:var(--body);
  font-family:var(--sans);
  letter-spacing:.02em;
  -webkit-font-smoothing:antialiased;
  overflow-x:clip;
}
.cd-skin #body_wrap{background:transparent}

/* ---------- 2. Site chrome: SWELL header/footer -> ConnectingDots header/footer ---------- */
.cd-skin #header,.cd-skin .l-header,.cd-skin .l-fixHeader,.cd-skin #sp_menu,.cd-skin .p-spMenu,
.cd-skin #footer,.cd-skin .l-footer,.cd-skin #fix_bottom_menu,.cd-skin .p-fixBtnWrap{display:none!important}
.cd-skin .cd-chrome .hdr{margin-bottom:8px}

/* Breadcrumb */
.cd-skin #breadcrumb,.cd-skin .p-breadcrumb{background:none!important;border:0;box-shadow:none;padding-top:20px}
.cd-skin .p-breadcrumb__list{font-size:13px;font-weight:700;color:var(--muted)}
.cd-skin .p-breadcrumb__item a,.cd-skin .p-breadcrumb__text{color:var(--muted)}
.cd-skin .p-breadcrumb__item a:hover{color:var(--navy)}

/* Page / archive titles */
.cd-skin .l-topTitleArea{background:var(--navy)!important}
.cd-skin .l-topTitleArea .c-pageTitle,.cd-skin .l-topTitleArea .c-pageTitle__inner{color:var(--white)}
.cd-skin .c-pageTitle{font-weight:900;color:var(--navy);letter-spacing:.01em}
.cd-skin .c-pageTitle__subTitle{font-family:var(--num);font-weight:600;letter-spacing:.16em;color:var(--teal-ink);font-style:normal}

/* ---------- 3. Article card ---------- */
.cd-skin.single .l-mainContent__inner,.cd-skin.page:not(.home) .l-mainContent__inner{
  background:var(--card);border-radius:var(--r-lg);padding:44px 52px 52px;box-shadow:var(--sh)}
@media(max-width:640px){.cd-skin.single .l-mainContent__inner,.cd-skin.page:not(.home) .l-mainContent__inner{padding:28px 20px 40px;border-radius:0;margin-inline:-4vw}}

/* Article head */
.cd-skin .p-articleHead{margin-bottom:24px}
.cd-skin .c-postTitle{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:start}
.cd-skin .c-postTitle__ttl{font-size:clamp(24px,3vw,36px);line-height:1.45;font-weight:900;color:var(--navy);letter-spacing:0}
.cd-skin .c-postTitle__date{border:0;color:var(--navy);font-family:var(--num);font-weight:600}
.cd-skin .c-postTitle__date .__y{color:var(--muted);font-size:12px}
.cd-skin .c-postTitle__date .__md{font-size:22px}
.cd-skin .p-articleMetas{font-size:13px;color:var(--muted)}
.cd-skin .c-categoryList__link,.cd-skin .c-tagList__link{background:var(--teal-ink)!important;color:var(--white)!important;border:0!important;border-radius:var(--r-sm);padding:4px 10px;font-weight:700;font-size:12px}
.cd-skin .c-tagList__link{background:var(--stage)!important;color:var(--navy)!important}
.cd-skin .c-postTimes{color:var(--muted)}
.cd-skin .c-postAuthor{font-weight:700;color:var(--navy)}
.cd-skin .p-articleThumb{border-radius:var(--r-md);overflow:hidden;margin-bottom:28px}
.cd-skin .p-articleThumb__img,.cd-skin .p-articleThumb img{border-radius:var(--r-md)}

/* Share buttons */
.cd-skin .c-shareBtns__btn{border-radius:50%!important;background:var(--stage)!important;color:var(--navy)!important;box-shadow:none!important}
.cd-skin .c-shareBtns__btn:hover{background:var(--navy)!important;color:var(--white)!important}

/* ---------- 4. Article body (.post_content) ---------- */
.cd-skin .post_content{font-size:16.5px;line-height:1.95;color:var(--body)}
.cd-skin .post_content strong{color:var(--navy)}
.cd-skin .post_content a:not([class]){color:var(--teal-ink);text-underline-offset:3px}
.cd-skin .post_content mark,.cd-skin .post_content .swl-marker{background:linear-gradient(transparent 60%,var(--yellow-tint) 60%)}

/* Headings: H2 navy rule + teal dot, H3 teal dot, H4 plain */
.cd-skin .post_content h2{background:none!important;color:var(--navy)!important;border:0;border-bottom:2px solid var(--navy)!important;border-radius:0!important;padding:0 0 14px 22px!important;margin:2.8em 0 1.4em;font-size:clamp(21px,2.4vw,26px);line-height:1.5;font-weight:900;position:relative;box-shadow:none!important}
.cd-skin .post_content h2::before{content:""!important;position:absolute;left:0;top:.55em;width:10px;height:10px;border-radius:50%;background:var(--teal);border:0!important;display:block!important;transform:none!important}
.cd-skin .post_content h2::after{content:none!important;display:none!important}
.cd-skin .post_content h3{background:none!important;color:var(--navy)!important;border:0!important;padding:0 0 0 20px!important;margin:2.2em 0 1em;font-size:19px;line-height:1.55;font-weight:700;position:relative}
.cd-skin .post_content h3::before{content:""!important;position:absolute;left:0;top:.6em;width:8px;height:8px;border-radius:50%;background:var(--teal);border:0!important;display:block!important;transform:none!important}
.cd-skin .post_content h3::after{content:none!important;display:none!important}
.cd-skin .post_content h4{color:var(--navy);font-weight:700;border:0;padding:0;background:none}
.cd-skin .post_content h4::before{content:none}

/* Table of contents (.p-toc) */
.cd-skin .p-toc{background:var(--stage)!important;border:0!important;border-radius:var(--r-md);padding:28px 32px!important;box-shadow:none}
.cd-skin .p-toc::before,.cd-skin .p-toc::after{content:none!important}
.cd-skin .p-toc__ttl{color:var(--navy);font-weight:700;font-size:15px;text-align:left;justify-content:flex-start}
.cd-skin .p-toc__ttl::before{color:var(--teal-ink)}
.cd-skin .p-toc__list a{color:var(--navy);text-decoration:none;border-radius:8px}
.cd-skin .p-toc__list a:hover{background:var(--white)}
.cd-skin .p-toc__list li::before{color:var(--teal-ink);font-family:var(--num);font-weight:600}
.cd-skin .p-toc__expandBtn,.cd-skin .p-toc__ttl .__btn{color:var(--teal-ink);background:var(--white);border:0}

/* Icon paragraphs (is-style-icon_*) and boxes: rounded, no harsh borders */
.cd-skin .post_content [class*="is-style-icon_"]{border-radius:var(--r-md);border:0!important;box-shadow:none!important}
.cd-skin .post_content .is-style-icon_info{background:var(--teal-tint)!important;color:var(--navy)}
.cd-skin .post_content .is-style-icon_announce{background:var(--yellow-tint)!important;color:var(--navy)}
.cd-skin .post_content .is-style-icon_good,.cd-skin .post_content .is-style-icon_check{background:#E6F3EC!important;color:var(--navy)}
.cd-skin .post_content .is-style-icon_bad,.cd-skin .post_content .is-style-icon_caution,.cd-skin .post_content .is-style-icon_batsu{background:#FAE9E7!important;color:var(--navy)}
.cd-skin .post_content .is-style-icon_pen,.cd-skin .post_content .is-style-icon_book,.cd-skin .post_content .is-style-icon_memo,.cd-skin .post_content .is-style-icon_hatena{background:var(--navy-tint)!important;color:var(--navy)}
.cd-skin .post_content .is-style-icon_point{background:var(--yellow-tint)!important;color:var(--navy)}

/* Caption box (cap_box) */
.cd-skin .cap_box{border-radius:var(--r-md);overflow:hidden}
.cd-skin .cap_box_ttl{background:var(--navy)!important;color:var(--white)!important;font-weight:700;border-radius:0}
.cd-skin .cap_box_content{border-color:var(--navy)!important;border-radius:0 0 var(--r-md) var(--r-md)}

/* Lists with icons keep SWELL's icons; give them a quiet frame */
.cd-skin .post_content ul[class*="is-style-big_icon_"],.cd-skin .post_content ul.is-style-check_list,.cd-skin .post_content ul.is-style-good_list,.cd-skin .post_content ul.is-style-bad_list{background:var(--white);border:1px solid var(--navy-tint)!important;border-radius:var(--r-md);padding:20px 24px 20px 52px}
.cd-skin .post_content ul.is-style-crease{border-radius:var(--r-md);background:var(--stage)}

/* Accordion (swell-block-accordion) */
.cd-skin .swell-block-accordion__item{background:var(--stage);border:0!important;border-radius:var(--r-md);overflow:hidden}
.cd-skin .swell-block-accordion__item+.swell-block-accordion__item{margin-top:10px}
.cd-skin .swell-block-accordion__title{background:transparent!important;color:var(--navy)!important;font-weight:700;padding:18px 22px}
.cd-skin .swell-block-accordion__body{background:transparent;border:0;padding:0 22px 20px}
.cd-skin .swell-block-accordion__icon,.cd-skin .swell-block-accordion__label{color:var(--navy)}

/* FAQ (swell-block-faq) */
.cd-skin .swell-block-faq__item{background:var(--stage);border:0;border-radius:var(--r-md);padding:4px 4px 8px}
.cd-skin .swell-block-faq .faq_q,.cd-skin .swell-block-faq .faq_a{border:0}

/* Tables */
.cd-skin .post_content table{border-radius:var(--r-md);overflow:hidden;border-collapse:separate;border-spacing:0;border:1px solid var(--navy-tint)}
.cd-skin .post_content thead th,.cd-skin .post_content th{background:var(--navy);color:var(--white);border-color:var(--navy)}
.cd-skin .post_content tbody th{background:var(--stage);color:var(--navy)}
.cd-skin .post_content td{border-color:var(--navy-tint)}

/* Buttons (swell-block-button / c-btn) */
.cd-skin .swell-block-button__link,.cd-skin .post_content .c-btn,.cd-skin .wp-block-button__link{border-radius:var(--r-sm)!important;font-weight:700;letter-spacing:.02em;box-shadow:none!important}
.cd-skin .swell-block-button.blue_ .swell-block-button__link,.cd-skin .swell-block-button:not([class*="red_"]):not([class*="green_"]) .swell-block-button__link{background:var(--navy)!important;color:var(--white)!important;border-color:var(--navy)!important}
.cd-skin .swell-block-button.green_ .swell-block-button__link{background:var(--line-green)!important;color:#06301A!important}
.cd-skin .swell-block-button.red_ .swell-block-button__link{background:var(--yellow)!important;color:var(--navy)!important}

/* Balloon (speech bubble) */
.cd-skin .c-balloon__text{border-radius:var(--r-md);border-color:var(--navy-tint)}

/* ---------- 5. Lists of posts (archives, blog page, related posts) ---------- */
.cd-skin .p-postList.-type-card .p-postList__item,.cd-skin .p-postList.-type-list .p-postList__item{background:var(--white);border-radius:var(--r-md);overflow:hidden;transition:transform .3s var(--ease)}
.cd-skin .p-postList.-type-card .p-postList__link,.cd-skin .p-postList.-type-list .p-postList__link{box-shadow:none!important}
@media(hover:hover){.cd-skin .p-postList.-type-card .p-postList__item:hover,.cd-skin .p-postList.-type-list .p-postList__item:hover{transform:translateY(-4px)}}
.cd-skin .p-postList__thumb{border-radius:0;overflow:hidden}
.cd-skin .p-postList__thumb img{transition:transform .4s var(--ease)}
.cd-skin .p-postList__link:hover .p-postList__thumb img{transform:scale(1.04)}
.cd-skin .p-postList__body{padding:16px 18px 20px}
.cd-skin .p-postList__title{color:var(--navy);font-weight:700;line-height:1.6}
.cd-skin .p-postList__meta,.cd-skin .p-postList__times{color:var(--muted);font-family:var(--num)}
.cd-skin .c-postThumb__cat{background:var(--teal-ink)!important;color:var(--white)!important;border-radius:4px;font-weight:700;font-size:11px;padding:2px 8px;margin:10px;top:0;left:0}
.cd-skin .p-postList.-type-simple .p-postList__item{border-color:var(--navy-tint)}

/* Category colors on labels: IELTS / PTE */
.cd-skin [data-cat-id="ielts"],.cd-skin .c-categoryList__link[href*="/ielts"]{background:var(--ielts)!important}
.cd-skin [data-cat-id="pte"],.cd-skin .c-categoryList__link[href*="/pte"]{background:var(--pte)!important}
.cd-skin [data-cat-id="testimonial"]{background:var(--navy-light)!important}

/* Section titles used by SWELL (related posts, widgets) */
.cd-skin .c-secTitle,.cd-skin .l-articleBottom__title,.cd-skin .p-relatedPosts__title{background:none!important;color:var(--navy)!important;border:0!important;font-weight:900;font-size:22px;text-align:left;padding:0!important;margin-bottom:20px}
.cd-skin .c-secTitle::before,.cd-skin .c-secTitle::after,.cd-skin .l-articleBottom__title::before,.cd-skin .l-articleBottom__title::after{content:none!important}

/* Author box */
.cd-skin .p-authorBox{background:var(--stage);border:0;border-radius:var(--r-md);padding:28px}
.cd-skin .p-authorBox__name{color:var(--navy);font-weight:900}
.cd-skin .p-authorBox__iconWrap img,.cd-skin .p-authorBox .avatar{border-radius:50%}

/* Pagination */
.cd-skin .c-pagination a,.cd-skin .c-pagination span{border-radius:50%;font-family:var(--num);font-weight:600;color:var(--navy);background:var(--white);border:0;box-shadow:none}
.cd-skin .c-pagination .-current,.cd-skin .c-pagination .current{background:var(--navy);color:var(--white)}
.cd-skin .p-pnLinks__item a,.cd-skin .p-pnLinks__link{border-radius:var(--r-md);background:var(--white);border:0;box-shadow:none}

/* ---------- 6. Sidebar widgets ---------- */
.cd-skin #sidebar .c-widget{background:var(--white);border-radius:var(--r-md);padding:24px;box-shadow:none}
.cd-skin #sidebar .c-widget+.c-widget{margin-top:16px}
.cd-skin .c-widget__title,.cd-skin #sidebar .c-widget__title{background:none!important;color:var(--teal-ink)!important;border:0!important;font-family:var(--num);font-weight:600;font-size:12px;letter-spacing:.16em;text-transform:uppercase;padding:0 0 0 16px!important;margin-bottom:14px;text-align:left;position:relative}
.cd-skin .c-widget__title::before{content:""!important;position:absolute;left:0;top:50%;width:7px;height:7px;margin-top:-3.5px;border-radius:50%;background:currentColor;border:0!important;transform:none!important}
.cd-skin .c-widget__title::after{content:none!important}
.cd-skin .c-widget ul a{color:var(--navy)}
.cd-skin .widget_categories a,.cd-skin .c-listMenu a{border-color:var(--navy-tint)!important;color:var(--navy)}
.cd-skin .p-postList.-type-thumb .p-postList__title,.cd-skin .p-postList.-type-simple .p-postList__title{font-size:13px}
.cd-skin .p-postList .p-postList__item::before{background:var(--navy)!important;font-family:var(--num)}

/* ---------- 7. ConnectingDots parts used on blog pages ---------- */
/* [cd_article_cta] (appended to posts) */
.cd-art-cta{margin-top:56px;background:var(--navy);border-radius:var(--r-md);padding:36px 40px;display:grid;grid-template-columns:1fr auto;gap:24px;align-items:center;color:var(--white)}
.cd-art-cta .label{color:var(--teal)}
.cd-art-cta .ttl{margin:10px 0 6px;font-size:22px;color:var(--white);font-weight:900;line-height:1.45}
.cd-art-cta p{margin:0;font-size:14px;color:var(--on-navy)}
.cd-art-cta .ctas{display:grid;gap:10px}
.cd-art-cta .btn{justify-content:center;text-decoration:none!important}
@media(max-width:640px){.cd-art-cta{grid-template-columns:1fr;padding:28px 24px}}
.post_content .cd-art-cta .label{margin:0}

/* [cd_profile_widget] / [cd_line_widget] */
.cd-wdg-prof{display:grid;gap:12px;justify-items:start}
.cd-wdg-prof img{width:100%;aspect-ratio:16/10;object-fit:cover;border-radius:8px}
.cd-wdg-prof b{font-size:17px;color:var(--navy)}
.cd-wdg-prof p{font-size:13.5px;line-height:1.8;margin:0}
.cd-wdg-line{background:var(--navy);color:var(--white);border-radius:var(--r-md);padding:24px}
.cd-wdg-line b{display:block;font-size:17px;line-height:1.5;margin-bottom:6px;color:var(--white)}
.cd-wdg-line p{font-size:13px;color:var(--on-navy);margin:0 0 16px}
.cd-wdg-line .btn{width:100%;justify-content:center;text-decoration:none}
.cd-skin #sidebar .c-widget:has(.cd-wdg-line){padding:0;background:none}

/* ---------- Design B overrides ---------- */
/* Headings: soft box + dot, like the mockup article */
.cd-skin .post_content h2{background:var(--bg)!important;color:var(--ink)!important;border:0!important;border-radius:var(--r-md)!important;padding:16px 20px 16px 44px!important;margin:2.6em 0 1.2em;font-size:clamp(21px,2.4vw,26px);line-height:1.45;font-weight:900;position:relative}
.cd-skin .post_content h2::before{left:20px;top:50%;margin-top:-5px;background:var(--navy)}
.cd-skin .post_content h3::before{background:var(--yellow)}
/* Article card, TOC, boxes */
.cd-skin .p-toc{border-radius:var(--r-md)}
.cd-skin .post_content [class*="is-style-icon_"],.cd-skin .cap_box{border-radius:var(--r-md)}
.cd-skin .cap_box_ttl{border-radius:var(--r-md) var(--r-md) 0 0}
/* Buttons become pills */
.cd-skin .swell-block-button__link,.cd-skin .post_content .c-btn,.cd-skin .wp-block-button__link{border-radius:var(--pill)!important}
/* Post lists and widgets: rounded cards with soft shadows */
.cd-skin .p-postList.-type-card .p-postList__item,.cd-skin .p-postList.-type-list .p-postList__item{border-radius:var(--r-lg);box-shadow:var(--sh);background:var(--card)}
.cd-skin #sidebar .c-widget{border-radius:var(--r-lg);box-shadow:var(--sh);background:var(--card)}
.cd-skin .c-widget__title::before{background:var(--yellow)}
.cd-skin .c-widget__title,.cd-skin #sidebar .c-widget__title{color:var(--ink)!important;font-family:var(--sans);letter-spacing:.02em;text-transform:none;font-size:13px;font-weight:800}
.cd-skin .p-authorBox{border-radius:var(--r-lg)}
.cd-skin .c-pagination a,.cd-skin .c-pagination span{box-shadow:var(--sh)}
.cd-skin .c-categoryList__link{border-radius:var(--pill)!important}
.cd-skin .c-postThumb__cat{border-radius:var(--pill)!important;right:auto;max-width:calc(100% - 20px);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.cd-skin .cd-art-cta{border-radius:var(--r-md)}
.cd-skin .cd-wdg-line{border-radius:var(--r-lg)}
/* Category labels: soft tint pills like the mockup */
.cd-skin [data-cat-id="ielts"],.cd-skin .c-categoryList__link[href*="/ielts"]{background:var(--ielts)!important}
.cd-skin [data-cat-id="pte"],.cd-skin .c-categoryList__link[href*="/pte"]{background:#007F89!important}
.cd-skin .post_content .cd-art-cta{margin:56px 0 0}