.elementor-11032 .elementor-element.elementor-element-f08e94d{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:stretch;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-11032 .elementor-element.elementor-element-14159e0{--display:flex;--margin-top:0px;--margin-bottom:0px;--margin-left:0px;--margin-right:0px;--padding-top:0px;--padding-bottom:0px;--padding-left:0px;--padding-right:0px;}.elementor-11032 .elementor-element.elementor-element-e1bc2e9{width:100%;max-width:100%;margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-11032 .elementor-element.elementor-element-fd5726c{margin:0px 0px calc(var(--kit-widget-spacing, 0px) + 0px) 0px;padding:0px 0px 0px 0px;}.elementor-11032 .elementor-element.elementor-element-1a6b7e9{text-align:start;}.elementor-11032 .elementor-element.elementor-element-299b8c3{--display:flex;--flex-direction:row;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--justify-content:flex-start;--align-items:flex-start;--gap:0px 0px;--row-gap:0px;--column-gap:0px;--flex-wrap:nowrap;}.elementor-11032 .elementor-element.elementor-element-9e53bf2{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-11032 .elementor-element.elementor-element-4d623d3{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-widget-theme-post-content{font-family:var( --e-global-typography-text-font-family ), Sans-serif;}.elementor-11032 .elementor-element.elementor-element-0d994b5{--display:flex;--flex-direction:column;--container-widget-width:calc( ( 1 - var( --container-widget-flex-grow ) ) * 100% );--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;--align-items:stretch;--gap:20px 20px;--row-gap:20px;--column-gap:20px;}.elementor-widget-table-of-contents .elementor-toc__list-item{font-family:var( --e-global-typography-text-font-family ), Sans-serif;}.elementor-11032 .elementor-element.elementor-element-edefc54{padding:7px 12px 7px 12px;--box-border-color:#EAF0F3;--separator-width:1px;--header-background-color:var( --e-global-color-6d9ac3d );--header-color:#8FA5AE;--nested-list-indent:0.1em;--item-text-hover-color:var( --e-global-color-4507cba );--item-text-active-color:var( --e-global-color-4507cba );--marker-color:var( --e-global-color-4507cba );--marker-size:0px;}.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__header-title{text-align:start;}.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__header, .elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__header-title{font-family:"Plus Jakarta Sans", Sans-serif;font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:2px;}.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-item{font-family:"Plus Jakarta Sans", Sans-serif;font-size:13px;font-weight:400;line-height:1.55px;}.elementor-11032 .elementor-element.elementor-element-dcc1b4c{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-11032 .elementor-element.elementor-element-dcc1b4c:not(.elementor-motion-effects-element-type-background), .elementor-11032 .elementor-element.elementor-element-dcc1b4c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-6d9ac3d );}@media(min-width:768px){.elementor-11032 .elementor-element.elementor-element-9e53bf2{--width:60px;}.elementor-11032 .elementor-element.elementor-element-0d994b5{--width:320px;}}@media(max-width:767px){.elementor-11032 .elementor-element.elementor-element-14159e0{--padding-top:0px;--padding-bottom:0px;--padding-left:10px;--padding-right:0px;}.elementor-11032 .elementor-element.elementor-element-1a6b7e9{padding:0px 0px 0px 0px;}}/* Start custom CSS for container, class: .elementor-element-f08e94d */:root{
    --teal:#01516A;
    --teal-light:#88B2D1;
    --teal-dark:#013A4D;
    --teal-bg:#f0f5f8;
    --accent:#F9A41E;
    --ink:#0D1B22;
    --ink-soft:#5a6c75;
    --ink-mute:#8FA5AE;
    --line:#e8eaec;
    --cb-font-mono:'JetBrains Mono',monospace;
    --line-soft:#f0f3f5;

    --cb-font-primary:'Noto Serif JP','Hiragino Mincho ProN',serif;
    --cb-font-secondary:'Inter','Noto Sans JP',sans-serif;
    --cb-font-text:'Noto Sans JP','Hiragino Kaku Gothic ProN',sans-serif;
    --cb-font-accent:'Inter','Noto Sans JP',sans-serif;
    --photo:url('https://cubastion.co.jp/wp-content/uploads/2026/06/hero-system-compromised.png');
    /* Generic blog banner image — used by DB2 band above the post header.
       NOT the post's feature image (which stays as --photo). */
    --blog-banner:url('https://cubastion.co.jp/wp-content/uploads/2026/07/blog_ブログ_cubastion.webp');
  }
  *{box-sizing:border-box;margin:0;padding:0;-webkit-font-smoothing:antialiased}
  /* Smooth scroll for anchor navigation (TOC clicks) */
  html{ scroll-behavior:smooth; scroll-padding-top:100px; }
  @media (prefers-reduced-motion: reduce){
    html{ scroll-behavior:auto; }
  }
  body{font-family:var(--cb-font-text);background:#fff;color:var(--ink);line-height:1.75;font-size:15px}
  img{max-width:100%;display:block;border-radius:12px}
  a{color:var(--accent);text-decoration:underline;text-decoration-color:rgba(249,164,30,.4);text-underline-offset:3px;transition:all .2s}
  a:hover{color:#e89412;text-decoration-color:var(--accent)}

  /* ===== Container ===== */
  .sp{
    max-width:1280px;
    margin:0 auto;
    padding:0 clamp(20px,5vw,80px);
  }

  /* ===== Decorative band DB2 (above header)
     Uses --blog-banner (generic), NOT --photo (post feature image) ===== */
  .sp-band{
    position:relative;
    padding:clamp(40px,5vw,72px) clamp(28px,5vw,80px);
    background:var(--blog-banner) center/cover;
    background-blend-mode:multiply;
    background-color:var(--teal);
    overflow:hidden;
    color:#fff;
  }
  /* Layer 1 — theme teal-dark gradient */
  .sp-band::before{
    content:""; position:absolute; inset:0;
    background:linear-gradient(135deg, rgba(1,24,33,.85) 0%, rgba(1,58,77,.72) 55%, rgba(1,81,106,.55) 100%);
    z-index:0;
  }
  /* Layer 2 — subtle accent glow bottom-right */
  .sp-band::after{
    content:""; position:absolute; inset:0;
    background:radial-gradient(circle at 85% 70%, rgba(249,164,30,.15) 0%, transparent 55%);
    z-index:0;
  }
  .sp-band-inner{ position:relative; z-index:1; max-width:1280px; margin:0 auto; }
  .sp-band .eyebrow{
    display:inline-flex; align-items:center; gap:12px;
    font-family:var(--cb-font-accent);
    font-size:13px; font-weight:700;
    letter-spacing:.3em; text-transform:uppercase;
    color:var(--accent);
    margin-bottom:8px;
  }
  .sp-band .eyebrow::before{ content:""; width:40px; height:1px; background:var(--accent); }
  .sp-band .label{
    font-family:var(--cb-font-text);
    font-size:14px; font-weight:500;
    color:rgba(255,255,255,.85);
    letter-spacing:.05em;
  }

  /* ===== Universal breadcrumb (cb-breadcrumb shared class) ===== */
  .cb-breadcrumb{
    display:flex; align-items:center; gap:10px; flex-wrap:wrap;
    font-family:var(--cb-font-text);
    font-size:13px;
    color:var(--ink-soft);
    letter-spacing:.04em;
    line-height:1;
    margin-bottom:clamp(18px,2vw,24px);
  }
  .cb-breadcrumb a{
    color:inherit; text-decoration:none;
    display:inline-flex; align-items:center;
    transition:color .2s;
  }
  .cb-breadcrumb a:hover{ color:var(--teal); }
  .cb-breadcrumb .cb-home-icon{
    width:16px; height:16px;
    fill:none; stroke:currentColor;
    stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
    display:block;
  }
  .cb-breadcrumb .sep{ color:var(--teal-light); font-weight:300; user-select:none; }
  .cb-breadcrumb .current{
    color:var(--teal); font-weight:600;
    display:inline-flex; align-items:center; gap:7px;
  }
  .cb-breadcrumb .current::before{
    content:""; width:5px; height:5px;
    border-radius:50%; background:var(--accent);
  }

  /* ===== Single Post Header (Cubastion-style)
     Order: breadcrumb → H1 title → date + tag
     FOLLOW US déplacé en sticky vertical à gauche du body
     ===== */
  .sp-head{
    padding:clamp(40px,5vw,72px) 0 clamp(32px,4vw,48px);
    border-bottom:1px solid var(--line);
  }
  .sp-head-inner{ max-width:980px; margin:0 auto; }
  /* H1 = Design System V1 : serif Mincho + gradient teal */
  .sp-title{
    font-family:var(--cb-font-primary);
    font-weight:700;
    font-size:clamp(26px,3.4vw,44px);
    line-height:1.45;
    letter-spacing:.02em;
    background:linear-gradient(180deg, #01516A 0%, #013A4D 100%);
    -webkit-background-clip:text; background-clip:text;
    color:transparent; -webkit-text-fill-color:transparent;
    margin:0 0 clamp(18px,2vw,24px);
    word-break:keep-all;
    line-break:strict;
  }
  .sp-meta{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:clamp(18px,2vw,24px);
    flex-wrap:wrap;
  }
  .sp-date{
    font-family:var(--cb-font-mono);
    font-size:12.5px; font-weight:500;
    letter-spacing:.08em;
    color:var(--ink-soft);
  }
  /* Badge — matches DS .cb-newslist .tag (rectangular, colored variants) */
  .sp-tag{
    display:inline-block;
    background:var(--ink);
    color:#fff;
    font-family:var(--cb-font-text);
    font-size:11px; font-weight:700;
    padding:4px 12px;
    text-align:center;
    line-height:1.4;
    letter-spacing:.06em;
  }
  /* Color variants — mapped to article categories */
  .sp-tag.is-teal{ background:var(--teal); color:#fff; }
  .sp-tag.is-teal-dark{ background:var(--teal-dark); color:#fff; }
  .sp-tag.is-orange{ background:var(--accent); color:var(--ink); }
  .sp-tag.is-ink{ background:var(--ink); color:#fff; }
  /* FOLLOW US sticky vertical column (LEFT side of body) */
  .sp-follow-side{
    position:sticky; top:24px;
    display:flex; flex-direction:column; align-items:center;
    gap:16px;
    padding-top:32px;
    height:fit-content;
    width:60px;
  }
  /* DESKTOP order: icons → vertical line → FOLLOW label */
  .sp-follow-side .icons{
    display:flex; flex-direction:column; gap:12px;
    order:1;
  }
  .sp-follow-side .line{
    width:1px; height:60px;
    background:var(--ink-soft);
    order:2;
  }
  .sp-follow-side .label{
    writing-mode:vertical-rl;
    transform:rotate(180deg);
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.3em;
    color:var(--teal-dark);
    text-transform:uppercase;
    order:3;
  }
  /* Social icons in FOLLOW US sticky — use cb-soc S1 (teal-bg uniform) */
  .sp-follow-side .icons a{
    width:42px; height:42px;
    border-radius:50%;
    background:var(--teal-bg);
    color:var(--teal-dark);
    display:flex; align-items:center; justify-content:center;
    text-decoration:none;
    transition:all .2s ease;
  }
  .sp-follow-side .icons a:hover{
    background:var(--teal-dark);
    color:#fff;
    transform:translateY(-2px);
  }
  .sp-follow-side .icons svg{ width:16px; height:16px; fill:currentColor; }

  /* ===== Main layout : FOLLOW(left) + article + sidebar(right) ===== */
  .sp-body{
    display:grid;
    grid-template-columns:60px minmax(0,1fr) 320px;
    gap:clamp(28px,4vw,56px);
    padding:clamp(40px,5vw,72px) 0;
    align-items:start; /* Required for sticky children to work */
  }
  .sp-article{ min-width:0; max-width:780px; }

  /* ===== Article content typography ===== */
  .sp-article p{
    font-size:16px;
    line-height:1.95;
    color:var(--ink);
    margin:0 0 24px;
  }
  .sp-article p strong{ color:var(--teal-dark); font-weight:700; }
  /* H2 = Design System V1 : serif Mincho + orange dot */
  .sp-article h2{
    font-family:var(--cb-font-primary);
    font-weight:700;
    font-size:clamp(22px,2.4vw,30px);
    color:var(--teal-dark);
    line-height:1.4;
    letter-spacing:.03em;
    margin:48px 0 20px;
    scroll-margin-top:120px;
    display:inline-flex; align-items:baseline; gap:8px;
  }
  .sp-article h2::after{
    content:""; display:inline-block;
    width:8px; height:8px;
    border-radius:50%;
    background:var(--accent);
    transform:translateY(-4px);
    flex-shrink:0;
  }
  /* H3 = Design System V1 : sans heavy + teal bottom border */
  .sp-article h3{
    font-family:var(--cb-font-secondary);
    font-weight:700;
    font-size:clamp(18px,1.8vw,22px);
    color:var(--ink);
    margin:32px 0 14px;
    line-height:1.3;
    padding-bottom:12px;
    border-bottom:2px solid var(--teal);
    display:inline-block;
  }
  .sp-article ul, .sp-article ol{
    margin:0 0 24px;
    padding-left:0;
    list-style:none;
  }
  .sp-article ul li{
    position:relative;
    padding-left:22px;
    font-size:16px;
    line-height:1.9;
    margin-bottom:14px;
    color:var(--ink);
  }
  .sp-article ul li::before{
    content:"";
    position:absolute;
    left:0; top:.65em;
    width:8px; height:8px;
    border-radius:50%;
    background:var(--accent);
  }
  .sp-article ul li strong{
    display:block;
    color:var(--teal-dark);
    font-weight:700;
    margin-bottom:4px;
  }
  .sp-article ol{ counter-reset:cb-step; }
  .sp-article ol li{
    counter-increment:cb-step;
    position:relative;
    padding-left:48px;
    min-height:32px;
    font-size:16px;
    line-height:1.85;
    margin-bottom:18px;
  }
  .sp-article ol li::before{
    content:counter(cb-step, decimal-leading-zero);
    position:absolute;
    left:0; top:0;
    width:32px; height:32px;
    border-radius:50%;
    background:linear-gradient(135deg, var(--teal), var(--teal-dark));
    color:#fff;
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    display:inline-flex; align-items:center; justify-content:center;
  }
  .sp-article figure{
    margin:32px 0;
  }
  .sp-article figure img{
    width:100%;
    box-shadow:0 12px 30px -12px rgba(13,27,34,.18);
  }
  .sp-article figcaption{
    font-size:13px;
    color:var(--ink-soft);
    text-align:center;
    margin-top:12px;
    font-family:var(--cb-font-text);
  }

  /* Related inline links (in article body) */
  .sp-related-inline{
    margin:32px 0;
    padding:24px 28px;
    background:var(--teal-bg);
    border-radius:12px;
  }
  .sp-related-inline h4{
    font-family:var(--cb-font-accent);
    font-size:11px; font-weight:700;
    letter-spacing:.2em; text-transform:uppercase;
    color:var(--teal);
    margin:0 0 14px;
  }
  .sp-related-inline ul{ margin:0; padding:0; }
  .sp-related-inline li{
    padding:8px 0;
    border-bottom:1px solid rgba(1,81,106,.1);
  }
  .sp-related-inline li::before{ display:none; }
  .sp-related-inline li:last-child{ border-bottom:none; }
  .sp-related-inline a{
    color:var(--teal-dark);
    text-decoration:none;
    font-weight:600;
    display:inline-flex; align-items:center; gap:8px;
    transition:gap .2s;
  }
  .sp-related-inline a::before{ content:"→"; color:var(--accent); }
  .sp-related-inline a:hover{ gap:12px; color:var(--teal); }

  /* ===== Author block ===== */
  .sp-author{
    display:flex; align-items:center; gap:16px;
    padding:24px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    margin:40px 0 24px;
  }
  .sp-author-avatar{
    width:56px; height:56px;
    border-radius:50%;
    background:var(--photo) center/cover;
    flex-shrink:0;
    border:2px solid var(--teal-bg);
  }
  .sp-author-info .name{
    font-family:var(--cb-font-secondary);
    font-size:15px; font-weight:700;
    color:var(--ink);
    margin:0 0 2px;
  }
  .sp-author-info .role{
    font-size:12px; color:var(--ink-soft); margin:0;
  }

  /* ===== Tags ===== */
  .sp-tags{ display:flex; flex-wrap:wrap; gap:8px; margin:24px 0; }
  .sp-tags-label{
    font-family:var(--cb-font-accent);
    font-size:11px; font-weight:700;
    letter-spacing:.18em; text-transform:uppercase;
    color:var(--ink-soft);
    align-self:center;
    margin-right:4px;
  }
  .sp-tags a{
    display:inline-block;
    padding:5px 12px;
    background:var(--teal-bg);
    color:var(--teal-dark);
    font-size:12px; font-weight:500;
    border-radius:12px;
    text-decoration:none;
    transition:all .2s;
  }
  .sp-tags a:hover{ background:var(--teal-dark); color:#fff; }

  /* ===== Share row (bottom) ===== */
  .sp-share-bottom{
    display:flex; align-items:center; gap:12px;
    padding:18px 0;
    border-top:1px solid var(--line);
    border-bottom:1px solid var(--line);
    margin:32px 0;
  }
  .sp-share-bottom-label{
    font-family:var(--cb-font-accent);
    font-size:11px; font-weight:700;
    letter-spacing:.2em; text-transform:uppercase;
    color:var(--ink-soft);
  }
  .sp-share-bottom .icons{ display:inline-flex; gap:8px; }
  .sp-share-bottom a{
    width:32px; height:32px;
    border-radius:50%;
    background:var(--teal-bg);
    color:var(--teal-dark);
    display:inline-flex; align-items:center; justify-content:center;
    text-decoration:none;
    transition:all .2s;
  }
  .sp-share-bottom a:hover{ background:var(--teal-dark); color:#fff; }
  .sp-share-bottom svg{ width:14px; height:14px; fill:currentColor; }

  /* ===== Sidebar — sticky as ONE block (not per child) ===== */
  .sp-sidebar{
    display:flex; flex-direction:column; gap:20px;
    position:sticky;
    top:24px;
    align-self:start;
    max-height:calc(100vh - 48px);
    overflow-y:auto;
    /* Hide scrollbar on Firefox/IE */
    scrollbar-width:thin;
    scrollbar-color:var(--line) transparent;
  }
  .sp-sidebar::-webkit-scrollbar{ width:6px; }
  .sp-sidebar::-webkit-scrollbar-track{ background:transparent; }
  .sp-sidebar::-webkit-scrollbar-thumb{ background:var(--line); border-radius:3px; }
  .sp-side-block{
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:22px;
    position:static;
    flex-shrink:0;
  }
  /* Search bar (first sidebar block) — matches DS case-study search */
  .sp-side-search{
    display:flex; align-items:center; gap:0;
    background:#fff;
    border:1px solid var(--line);
    border-radius:12px;
    padding:6px 6px 6px 14px;
    transition:border-color .2s, box-shadow .2s;
    flex-shrink:0;
  }
  .sp-side-search:focus-within{
    border-color:var(--teal);
    box-shadow:0 0 0 3px rgba(1,81,106,.12);
  }
  .sp-side-search svg.icn{
    width:16px; height:16px;
    fill:none; stroke:var(--ink-soft);
    stroke-width:1.7; stroke-linecap:round; stroke-linejoin:round;
    flex-shrink:0;
    transition:stroke .2s;
  }
  .sp-side-search:focus-within svg.icn{ stroke:var(--teal); }
  .sp-side-search input{
    flex:1; min-width:0;
    border:0; background:transparent; outline:none;
    padding:10px 12px;
    font-family:var(--cb-font-text);
    font-size:13px; color:var(--ink);
    line-height:1.4;
  }
  .sp-side-search input::placeholder{ color:var(--ink-mute); }
  .sp-side-search button{
    border:0; cursor:pointer;
    background:var(--teal-dark); color:#fff;
    font-family:var(--cb-font-text);
    font-size:11px; font-weight:700; letter-spacing:.15em;
    padding:8px 14px;
    border-radius:8px;
    transition:background .2s;
  }
  .sp-side-search button:hover{ background:var(--teal); }
  .sp-side-block h4{
    font-family:var(--cb-font-accent);
    font-size:11px; font-weight:700;
    letter-spacing:.22em; text-transform:uppercase;
    color:var(--teal);
    margin:0 0 16px;
    padding-bottom:12px;
    border-bottom:1px solid var(--line);
    position:relative;
  }
  .sp-side-block h4::after{
    content:""; position:absolute;
    left:0; bottom:-1px;
    width:32px; height:1px;
    background:var(--accent);
  }

  /* Sidebar TOC */
  .sp-toc{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
  .sp-toc li{ padding:0; }
  .sp-toc a{
    display:block;
    color:var(--ink-soft);
    text-decoration:none;
    font-size:13.5px;
    line-height:1.5;
    padding:8px 12px;
    border-left:2px solid transparent;
    border-radius:0 8px 8px 0;
    transition:all .2s;
  }
  .sp-toc a:hover, .sp-toc a.is-active{
    background:var(--teal-bg);
    color:var(--teal-dark);
    border-left-color:var(--accent);
    font-weight:600;
  }

  /* Sidebar Categories */
  .sp-cats{ display:flex; flex-wrap:wrap; gap:6px; }
  .sp-cats a{
    display:inline-block;
    padding:5px 11px;
    background:var(--teal-bg);
    color:var(--teal-dark);
    font-size:12px; font-weight:600;
    border-radius:12px;
    text-decoration:none;
    transition:all .2s;
  }
  .sp-cats a:hover{ background:var(--teal-dark); color:#fff; }

  /* Sidebar Popular articles */
  .sp-pop{ display:flex; flex-direction:column; gap:14px; }
  .sp-pop a{
    text-decoration:none; color:inherit;
    padding-bottom:14px;
    border-bottom:1px solid var(--line-soft);
    display:block;
    transition:padding .2s;
  }
  .sp-pop a:last-child{ border-bottom:none; padding-bottom:0; }
  .sp-pop a:hover{ padding-left:4px; }
  .sp-pop .pop-title{
    font-family:var(--cb-font-text);
    font-size:14px; font-weight:600;
    color:var(--ink);
    line-height:1.5;
    margin:0 0 6px;
  }
  .sp-pop a:hover .pop-title{ color:var(--teal); }
  .sp-pop .pop-date{
    font-family:var(--cb-font-accent);
    font-size:11px;
    color:var(--ink-soft);
    letter-spacing:.04em;
  }

  /* Sidebar CTA */
  .sp-side-cta{
    background:linear-gradient(160deg, var(--teal) 0%, var(--teal-dark) 100%);
    color:#fff;
    border-color:transparent;
    border-radius:12px;
    padding:24px 22px;
    position:relative;
    overflow:hidden;
  }
  .sp-side-cta::after{
    content:""; position:absolute;
    top:-40px; right:-40px;
    width:160px; height:160px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(255,255,255,.10) 0%, transparent 65%);
  }
  .sp-side-cta h4{
    color:#fff;
    border-bottom-color:rgba(255,255,255,.18);
    margin:0 0 14px;
    padding-bottom:12px;
  }
  .sp-side-cta h4::after{ background:var(--accent); }
  .sp-side-cta .title{
    font-family:var(--cb-font-primary);
    font-size:18px; font-weight:700;
    margin:0 0 10px;
    line-height:1.5;
    position:relative;
  }
  .sp-side-cta p{
    font-size:13px;
    color:rgba(255,255,255,.85);
    line-height:1.7;
    margin:0 0 18px;
    position:relative;
  }
  .sp-side-cta-btn{
    display:inline-flex; align-items:center; gap:10px;
    padding:12px 22px;
    background:#fff;
    color:var(--teal-dark);
    border-radius:99px;
    font-family:var(--cb-font-secondary);
    font-weight:700;
    font-size:13px;
    text-decoration:none;
    transition:all .2s;
    position:relative;
  }
  .sp-side-cta-btn:hover{
    transform:translateY(-2px);
    box-shadow:0 10px 24px rgba(0,0,0,.18);
    color:var(--teal-dark);
  }
  .sp-side-cta-btn svg{ width:14px; height:14px; stroke:currentColor; stroke-width:2.3; fill:none; }

  /* ===== Related articles section (uses cb-related V4 from DS) ===== */
  .sp-related-section{
    background:#fff;
    padding:clamp(48px,5vw,80px) 0;
  }
  .cb-related-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; flex-wrap:wrap;
    margin-bottom:clamp(28px,3vw,40px);
    padding-bottom:16px;
    border-bottom:2px solid var(--teal-dark);
  }
  .cb-related-head-text{
    display:flex; flex-direction:column; align-items:flex-start;
    gap:10px; min-width:0;
  }
  .cb-related-title{
    font-family:var(--cb-font-primary);
    font-weight:700;
    font-size:clamp(28px,3.4vw,42px);
    color:var(--teal-dark);
    line-height:1.35;
    letter-spacing:.02em;
    display:inline-flex; align-items:baseline; gap:8px;
    margin:0;
  }
  .cb-related-title::after{
    content:""; display:inline-block;
    width:6px; height:6px; border-radius:50%;
    background:var(--accent);
    transform:translateY(-3px);
  }
  .cb-related-eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.25em; text-transform:uppercase;
    color:var(--accent);
    margin:0;
  }
  .cb-related-eyebrow::before{
    content:""; width:24px; height:1px; background:var(--accent);
  }
  .cb-related-sub{
    font-size:14.5px; color:var(--ink-soft);
    line-height:1.85;
    margin:6px 0 0;
    max-width:560px;
  }
  .cb-related-more{
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.1em;
    color:var(--accent);
    text-decoration:none;
    display:inline-flex; align-items:center; gap:8px;
    border-bottom:1px solid rgba(249,164,30,.4);
    padding-bottom:3px;
    transition:all .2s;
    flex-shrink:0;
  }
  .cb-related-more::after{ content:"→"; font-weight:700; }
  .cb-related-more:hover{ color:#e89412; border-bottom-color:#e89412; }
  /* V4 layout : featured big + small list */
  .cb-rel-v4{
    display:grid;
    grid-template-columns:1.5fr 1fr;
    gap:24px;
    align-items:stretch; /* Force side column to match featured column height */
  }
  .cb-rel-v4-feat{
    text-decoration:none; color:inherit;
    display:flex; flex-direction:column;
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 4px 14px rgba(13,27,34,.06);
    transition:transform .25s;
  }
  .cb-rel-v4-feat:hover{ transform:translateY(-3px); }
  .cb-rel-v4-feat-img{
    aspect-ratio:16/9;
    background:var(--photo) center/cover;
  }
  .cb-rel-v4-feat-body{ padding:24px 26px; }
  .cb-rel-v4-feat .meta{
    display:flex; gap:12px; align-items:center;
    font-family:var(--cb-font-mono);
    font-size:11px;
    color:var(--ink-soft);
    margin-bottom:12px;
    letter-spacing:.06em;
  }
  /* Featured category pill — rounded, teal-dark, uppercase */
  .cb-rel-v4-feat .tag{
    display:inline-flex; align-items:center;
    background:var(--teal-dark);
    color:#fff;
    padding:6px 16px;
    border-radius:99px;
    font-family:var(--cb-font-accent);
    font-size:10.5px; font-weight:800;
    letter-spacing:.16em;
    text-transform:uppercase;
    line-height:1;
  }
  /* Color variants — same mapping as sp-tag */
  .cb-rel-v4-feat .tag.is-teal{ background:var(--teal); }
  .cb-rel-v4-feat .tag.is-orange{ background:var(--accent); color:var(--ink); }
  .cb-rel-v4-feat .tag.is-ink{ background:var(--ink); }
  .cb-rel-v4-feat .title{
    font-family:var(--cb-font-primary);
    font-size:18px; font-weight:700;
    line-height:1.55;
    color:var(--ink);
    margin:0;
  }
  .cb-rel-v4-side{
    display:flex; flex-direction:column; gap:14px;
    height:100%;
    justify-content:space-between; /* Distribute items to fill full height */
  }
  .cb-rel-v4-side a{
    display:grid;
    grid-template-columns:96px 1fr;
    gap:14px;
    text-decoration:none; color:inherit;
    align-items:center;
    padding:10px;
    border-radius:12px;
    transition:background .2s;
    flex:1; /* Each side item takes equal share of container height */
    min-height:0; /* Allow shrinking if needed */
  }
  .cb-rel-v4-side a:hover{ background:var(--teal-bg); }
  .cb-rel-v4-side .thumb{
    aspect-ratio:1/1;
    background:var(--photo) center/cover;
    border-radius:12px;
  }
  /* Side meta : category · date — category in accent color for hierarchy */
  .cb-rel-v4-side .meta{
    font-family:var(--cb-font-mono);
    font-size:10.5px;
    color:var(--ink-soft);
    margin-bottom:6px;
    letter-spacing:.06em;
  }
  .cb-rel-v4-side .meta .cat{
    color:var(--teal);
    font-weight:700;
    letter-spacing:.12em;
    text-transform:uppercase;
  }
  .cb-rel-v4-side .title{
    font-family:var(--cb-font-text);
    font-size:13.5px;
    font-weight:600;
    line-height:1.55;
    color:var(--ink);
    margin:0;
  }
  /* Responsive */
  @media (max-width:900px){
    .cb-rel-v4{ grid-template-columns:1fr; gap:20px; }
    .cb-related-head{ flex-direction:column; align-items:flex-start; }
  }
  @media (max-width:520px){
    .cb-rel-v4-feat-body{ padding:18px 20px; }
    .cb-rel-v4-feat .title{ font-size:16px; }
    .cb-rel-v4-side a{ grid-template-columns:72px 1fr; gap:12px; padding:8px; }
    .cb-rel-v4-side .title{ font-size:13px; }
  }
  @media (max-width:380px){
    .cb-rel-v4-side a{ grid-template-columns:1fr; }
    .cb-rel-v4-side .thumb{ aspect-ratio:16/9; }
  }
  .cb-rp{ padding:0; }
  .cb-rp-head{
    display:flex; justify-content:space-between; align-items:flex-end;
    gap:24px; flex-wrap:wrap;
    margin-bottom:clamp(28px,3vw,40px);
  }
  .cb-rp-head-text{
    display:flex; flex-direction:column; align-items:flex-start;
    gap:10px; min-width:0;
  }
  .cb-rp-head-text .title{
    font-family:var(--cb-font-primary);
    font-weight:700;
    font-size:clamp(28px,3.4vw,42px);
    color:var(--teal-dark);
    line-height:1.35;
    letter-spacing:.02em;
    display:inline-flex; align-items:baseline; gap:8px;
    margin:0;
  }
  .cb-rp-head-text .title::after{
    content:""; display:inline-block;
    width:6px; height:6px; border-radius:50%;
    background:var(--accent);
    transform:translateY(-3px);
  }
  .cb-rp-head-text .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.25em; text-transform:uppercase;
    color:var(--accent);
    margin:0;
  }
  .cb-rp-head-text .eyebrow::before{
    content:""; width:24px; height:1px; background:var(--accent);
  }
  .cb-rp-head-text .sub{
    font-size:14.5px; color:var(--ink-soft);
    line-height:1.85;
    margin:6px 0 0;
    max-width:560px;
  }
  .cb-rp-see-all{
    display:inline-flex; align-items:center; gap:8px;
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.1em;
    color:var(--accent);
    text-decoration:none;
    border-bottom:1px solid rgba(249,164,30,.4);
    padding-bottom:3px;
    transition:all .2s;
    flex-shrink:0;
  }
  .cb-rp-see-all::after{ content:"→"; font-weight:700; }
  .cb-rp-see-all:hover{ color:#e89412; border-bottom-color:#e89412; }
  .cb-rp-grid{
    display:grid; grid-template-columns:repeat(3,1fr); gap:24px;
  }
  .cb-rp-card{
    background:#fff;
    border-radius:12px;
    overflow:hidden;
    box-shadow:0 6px 18px rgba(13,27,34,.06);
    display:flex; flex-direction:column;
    transition:all .3s ease;
    text-decoration:none;
    color:inherit;
  }
  .cb-rp-card:hover{
    transform:translateY(-3px);
    box-shadow:0 22px 44px -12px rgba(13,27,34,.18);
  }
  .cb-rp-card .img{
    background:var(--photo) center/cover;
    aspect-ratio:16/9;
    width:100%;
  }
  .cb-rp-card .body{
    padding:28px;
    display:flex; flex-direction:column; gap:14px;
    flex:1;
  }
  .cb-rp-card .meta{
    display:flex; gap:14px; align-items:center;
    font-family:var(--cb-font-accent);
    font-size:11px;
    font-weight:600;
    letter-spacing:.15em;
    text-transform:uppercase;
  }
  .cb-rp-card .meta .cat{ color:var(--accent); }
  .cb-rp-card .meta .sep{ color:var(--line); }
  .cb-rp-card .meta .tag{ color:var(--ink-soft); }
  .cb-rp-card .name{
    font-family:var(--cb-font-primary);
    font-size:clamp(18px,1.8vw,22px);
    font-weight:700;
    line-height:1.4;
    color:var(--ink);
    margin:0;
    word-break:keep-all;
    line-break:strict;
    overflow-wrap:anywhere;
  }
  .cb-rp-card .desc{
    font-size:13.5px;
    color:var(--ink-soft);
    line-height:1.75;
    margin:0;
  }
  .cb-rp-card .foot{
    display:flex; justify-content:space-between; align-items:center;
    padding-top:16px;
    border-top:1px solid var(--line);
    margin-top:auto;
  }
  .cb-rp-card .more{
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.08em;
    color:var(--teal);
    transition:gap .2s;
    display:inline-flex; align-items:center; gap:6px;
  }
  .cb-rp-card:hover .more{ gap:10px; }
  .cb-rp-card .arr{
    width:36px; height:36px;
    border-radius:50%;
    background:var(--teal-bg);
    color:var(--teal-dark);
    display:inline-flex; align-items:center; justify-content:center;
    transition:all .25s;
  }
  .cb-rp-card:hover .arr{ background:var(--teal-dark); color:#fff; transform:rotate(-45deg); }
  .cb-rp-card .arr svg{ width:14px; height:14px; stroke:currentColor; stroke-width:2; fill:none; }
  @media (max-width:900px){ .cb-rp-grid{ grid-template-columns:1fr 1fr; } }
  @media (max-width:600px){
    .cb-rp-head{ flex-direction:column; align-items:flex-start; }
    .cb-rp-grid{ grid-template-columns:1fr; }
    .cb-rp-card .body{ padding:22px; }
  }

  /* ===== Newsletter ===== */
  .sp-newsletter{
    padding:clamp(48px,5vw,80px) 0;
    background:#fff;
    border-top:1px solid var(--line);
  }
  .sp-newsletter-inner{
    max-width:680px;
    margin:0 auto;
    text-align:center;
  }
  .sp-newsletter h2{
    font-family:var(--cb-font-primary);
    font-weight:700;
    font-size:clamp(24px,2.8vw,32px);
    color:var(--teal-dark);
    margin:0 0 12px;
    letter-spacing:.02em;
    display:inline-flex; align-items:baseline; gap:8px;
  }
  .sp-newsletter h2::after{
    content:""; display:inline-block;
    width:6px; height:6px; border-radius:50%;
    background:var(--accent);
    transform:translateY(-3px);
  }
  .sp-newsletter p{
    font-size:14.5px;
    color:var(--ink-soft);
    margin:0 0 28px;
    line-height:1.85;
  }
  .sp-newsletter-form{
    display:flex;
    max-width:480px;
    margin:0 auto;
    border:1.5px solid var(--line);
    border-radius:99px;
    padding:5px;
    background:#fff;
    transition:all .2s;
  }
  .sp-newsletter-form:focus-within{
    border-color:var(--teal);
    box-shadow:0 0 0 3px rgba(1,81,106,.10);
  }
  .sp-newsletter-form input{
    flex:1;
    background:transparent;
    border:none;
    outline:none;
    padding:10px 18px;
    font-family:var(--cb-font-text);
    font-size:14px;
    color:var(--ink);
    min-width:0;
  }
  .sp-newsletter-form input::placeholder{ color:var(--ink-soft); }
  .sp-newsletter-form button{
    background:linear-gradient(180deg, var(--teal), var(--teal-dark));
    color:#fff;
    border:none;
    border-radius:99px;
    padding:11px 24px;
    font-family:var(--cb-font-secondary);
    font-weight:700;
    font-size:13px;
    letter-spacing:.05em;
    cursor:pointer;
    transition:all .2s;
  }
  .sp-newsletter-form button:hover{ transform:translateY(-1px); box-shadow:0 8px 20px rgba(1,58,77,.25); }

  /* ===== Bottom CTA band ===== */
  .sp-bottom-cta{
    padding:clamp(48px,5vw,80px) 0;
    background:linear-gradient(135deg, var(--teal) 0%, var(--teal-dark) 100%);
    color:#fff;
    position:relative;
    overflow:hidden;
  }
  .sp-bottom-cta::before{
    content:"";
    position:absolute;
    top:-100px; right:-100px;
    width:340px; height:340px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(136,178,209,.15) 0%, transparent 65%);
  }
  .sp-bottom-cta::after{
    content:"";
    position:absolute;
    bottom:-80px; left:-80px;
    width:260px; height:260px;
    border-radius:50%;
    background:radial-gradient(circle, rgba(249,164,30,.12) 0%, transparent 65%);
  }
  .sp-bottom-cta-inner{
    text-align:center;
    max-width:680px;
    margin:0 auto;
    position:relative; z-index:1;
  }
  .sp-bottom-cta .eyebrow{
    display:inline-flex; align-items:center; gap:10px;
    font-family:var(--cb-font-accent);
    font-size:12px; font-weight:700;
    letter-spacing:.25em; text-transform:uppercase;
    color:var(--teal-light);
    margin-bottom:14px;
  }
  .sp-bottom-cta .eyebrow::before{ content:""; width:24px; height:1px; background:var(--teal-light); }
  .sp-bottom-cta h2{
    font-family:var(--cb-font-primary);
    font-size:clamp(26px,3.2vw,40px);
    font-weight:700;
    line-height:1.35;
    margin:0 0 16px;
    background:linear-gradient(180deg, #fff 0%, var(--teal-light) 100%);
    -webkit-background-clip:text;
    background-clip:text;
    color:transparent;
    -webkit-text-fill-color:transparent;
  }
  .sp-bottom-cta p{
    font-size:14.5px;
    color:rgba(255,255,255,.78);
    line-height:1.85;
    margin:0 auto 28px;
    max-width:520px;
  }
  .sp-bottom-cta-btn{
    display:inline-flex; align-items:center; gap:12px;
    padding:16px 32px;
    background:var(--accent);
    color:var(--ink);
    border-radius:99px;
    font-family:var(--cb-font-secondary);
    font-weight:700;
    font-size:15px;
    letter-spacing:.05em;
    text-decoration:none;
    transition:all .25s;
    box-shadow:0 10px 30px rgba(249,164,30,.3);
  }
  .sp-bottom-cta-btn:hover{
    background:#ffb84a;
    transform:translateY(-2px);
    box-shadow:0 14px 36px rgba(249,164,30,.42);
    color:var(--ink);
  }

  /* ===== RESPONSIVE ===== */
  /* Fix : below 1200px, disable follow-side sticky so it doesn't overlap
     the sidebar/search bar when scrolling */
  @media (max-width:1200px){
    .sp-follow-side{
      position:static !important;
      top:auto !important;
    }
  }
  @media (max-width:1024px){
    .sp-body{ grid-template-columns:60px minmax(0,1fr); }
    .sp-sidebar{
      grid-column:1 / -1;
      display:grid;
      grid-template-columns:1fr 1fr;
      gap:18px;
      /* Sidebar no longer sticky when it spans full width below article */
      position:static !important;
      max-height:none !important;
      overflow-y:visible !important;
    }
    .sp-side-block{ position:static; }
    .sp-side-search{ grid-column:span 2; }
    .sp-side-cta{ grid-column:span 2; }
  }
  @media (max-width:768px){
    .sp-body{ grid-template-columns:1fr; }
    /* FOLLOW US becomes horizontal at top of article on mobile */
    .sp-follow-side{
      position:static; width:100%;
      flex-direction:row; padding-top:0;
      padding-bottom:18px; border-bottom:1px solid var(--line);
    }
    /* Mobile order : label ← line ← icons (reset from desktop vertical order) */
    .sp-follow-side .label{ writing-mode:horizontal-tb; transform:none; order:1; }
    .sp-follow-side .line{ width:30px; height:1px; order:2; }
    .sp-follow-side .icons{ flex-direction:row; margin-top:0; margin-left:auto; order:3; }
    .sp-related-grid{ grid-template-columns:1fr; }
    .sp-sidebar{ grid-template-columns:1fr; }
    .sp-side-cta{ grid-column:auto; }
    .sp-meta{ flex-direction:column; align-items:flex-start; gap:14px; }
    .sp-article p, .sp-article ul li, .sp-article ol li{ font-size:15px; }
    .sp-article h2{ font-size:22px; }
    .sp-band{ padding:32px 24px; }
  }/* End custom CSS */
/* Start custom CSS for table-of-contents, class: .elementor-element-edefc54 */.elementor-11032 .elementor-element.elementor-element-edefc54 { background: #fff; border: 1px solid #DCE8EC; border-radius: 12px; padding: 22px; }
  .elementor-11032 .elementor-element.elementor-element-edefc54 .ez-toc-title { font-size: 10px; letter-spacing: 2px; text-transform: uppercase; color: #8FA5AE; }
  .elementor-11032 .elementor-element.elementor-element-edefc54 a { color: #5A7380; padding: 7px 12px; border-left: 2px solid #EAF0F3; display: block; font-size: 13px; }
  .elementor-11032 .elementor-element.elementor-element-edefc54 a.active { color: #01516A; background: #E8F4F7; border-left-color: #F9A41E; font-weight: 600; }
  
  
  /* Style pour le conteneur global (Box) */
.e-toc {
    background: #fff;
    border: 1px solid #DCE8EC;
    border-radius: 12px;
    padding: 22px;
}

/* Style pour le titre "目次" (Header) */
.e-toc__title {
    font-size: 10px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: #8FA5AE;
}

/* Style pour les items normaux */
.e-toc-item {
    color: #5A7380 !important;
    background: transparent !important;
    border-left: 2px solid #EAF0F3 !important;
    padding: 7px 12px !important;
    display: block;
    font-size: 13px;
}

/* Style au survol (Hover) */
.e-toc-item:hover {
    color: #01516A !important;
    background: #F8FAFB !important;
    border-left-color: #01516A !important;
}

/* Style pour l'item actif (Scroll Spy) */
.e-toc-item.active {
    color: #01516A !important;
    background: #E8F4F7 !important;
    border-left-color: #F9A41E !important;
    font-weight: 600 !important;
}


/* État Normal : tous les items */
.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-item-text,
.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-wrapper a {
  display: block;
  padding: 7px 12px !important;
  border-left: 2px solid #EAF0F3 !important;
  border-radius: 0 6px 6px 0;
  transition: all 0.2s;
  text-decoration: none;
}

/* État Hover : background bleu très clair + bordure teal */
.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-item-text:hover,
.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-wrapper a:hover {
  background: #F8FAFB !important;
  color: #01516A !important;
  border-left-color: #01516A !important;
}

/* État Active : section actuelle au scroll, bordure orange */
.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-item-text.elementor-item-active,
.elementor-11032 .elementor-element.elementor-element-edefc54 .elementor-toc__list-wrapper a.elementor-item-active {
  background: #E8F4F7 !important;
  color: #01516A !important;
  border-left-color: #F9A41E !important;
  font-weight: 600 !important;
}/* End custom CSS */