/* ============================================
 * Peekaby カスタムスタイル（完全スコープ版）
 * フューチャーショップ CSSカスタマイズ枠に貼り付け
 * 
 * 【重要】HTMLは必ず以下で囲んでください:
 *   <div class="pkb-root">
 *     ...ピカビーの各セクション...
 *   </div>
 * 
 * 全スタイルが .pkb-root の中だけに適用されるため、
 * フューチャーショップ既存のヘッダー・フッター・
 * 商品ページ等とは100%干渉しません。
 * 
 * レスポンシブ対応:
 *   - PC: 1025px〜
 *   - タブレット: 〜1024px
 *   - スマホ: 〜768px
 *   - 小型スマホ: 〜380px
 * ============================================ */

@import url('https://fonts.googleapis.com/css2?family=LINE+Seed+JP:wght@100;400;700;800&family=Fredoka:wght@500;600;700&display=swap');

:root{
    --cream: #fef7f2;
    --paper: #fdeadd;

    --teal: #006a5b;
    --teal-deep: #00513f;
    --teal-soft: #dceee9;

    --coral: #ff6b6b;
    --coral-deep: #e84545;
    --yellow: #ffc93c;
    --yellow-soft: #fff0c4;
    --orange: #ff9a3c;

    --pink: #ffb5c0;
    --pink-soft: #ffe4ea;
    --mint: #b8e6cf;
    --sky: #c4e3f5;
    --lavender: #e7e2f0;

    --ink: #2d2a3e;
    --ink-soft: #6b6877;
    --line: #f3e3d6;
  }
  .pkb-root *{margin:0;padding:0;box-sizing:border-box;}
  
  .pkb-root{
    font-family:'LINE Seed JP',sans-serif;
    color:var(--ink);
    font-weight:400;
    line-height:1.85;
    -webkit-font-smoothing:antialiased;
  }
  .pkb-latin{font-family:'Fredoka',sans-serif;}

  /* Top Bar */
  .pkb-topbar,.pkb-root .topbar{
    background:var(--teal);
    color:#fff;
    text-align:center;
    padding:10px 20px;
    font-size:12px;
    letter-spacing:0.05em;
    font-weight:400;
  }
  .pkb-topbar span,.pkb-root .topbar span{display:inline-block;margin:0 14px;opacity:0.5;}

  /* Header */
  .pkb-root header{
    background:rgba(255,249,238,0.96);
    border-bottom:2px solid var(--line);
    padding:18px 48px;
    display:flex;
    align-items:center;
    justify-content:space-between;
    position:sticky;
    top:0;
    z-index:100;
    backdrop-filter:blur(8px);
  }
  .pkb-logo-wrap,.pkb-root .logo-wrap{display:flex;align-items:center;gap:10px;}
  .pkb-logo-mark,.pkb-root .logo-mark{
    width:42px;height:42px;
    background:var(--coral);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#fff;
    font-family:'Fredoka',sans-serif;
    font-size:22px;
    font-weight:600;
    transform:rotate(-6deg);
  }
  .pkb-logo,.pkb-root .logo{
    font-family:'Fredoka',sans-serif;
    font-size:30px;
    font-weight:600;
    letter-spacing:-0.01em;
    color:var(--teal-deep);
    line-height:1;
  }
  .pkb-logo-jp,.pkb-root .logo-jp{
    font-family:'LINE Seed JP',sans-serif;
    font-size:10px;
    letter-spacing:0.3em;
    color:var(--ink-soft);
    display:block;
    margin-top:4px;
  }
  .pkb-root nav ul{display:flex;list-style:none;gap:36px;}
  .pkb-root nav a{
    color:var(--ink);
    text-decoration:none;
    font-size:14px;
    font-weight:700;
    padding:6px 4px;
    transition:color 0.3s;
  }
  .pkb-root nav a:hover{color:var(--teal);}
  .pkb-header-cta,.pkb-root .header-cta{
    background:var(--coral);
    color:#fff;
    padding:12px 26px;
    border-radius:30px;
    text-decoration:none;
    font-size:13px;
    font-weight:700;
    box-shadow:0 4px 0 var(--coral-deep);
    transition:all 0.2s;
  }
  .pkb-header-cta:hover,.pkb-root .header-cta:hover{transform:translateY(2px);box-shadow:0 2px 0 var(--coral-deep);}

  /* Hero */
  .pkb-hero{
    background:linear-gradient(180deg,var(--cream) 0%,var(--teal-soft) 100%);
    padding:60px 80px 100px;
    position:relative;
    overflow:hidden;
  }
  .pkb-hero-inner{
    display:grid;
    grid-template-columns:1.1fr 1fr;
    gap:60px;
    max-width:1400px;
    margin:0 auto;
    align-items:center;
  }
  .pkb-deco{position:absolute;border-radius:50%;z-index:0;}
  .pkb-deco-1{width:120px;height:120px;background:var(--yellow);top:80px;right:18%;opacity:0.7;animation:float 6s ease-in-out infinite;}
  .pkb-deco-2{width:60px;height:60px;background:var(--coral);bottom:120px;left:48%;opacity:0.5;animation:float 8s ease-in-out infinite reverse;}
  .pkb-deco-3{width:80px;height:80px;background:var(--mint);top:30%;left:42%;opacity:0.6;animation:float 7s ease-in-out infinite;}
  @keyframes float{
    0%,100%{transform:translateY(0) rotate(0);}
    50%{transform:translateY(-20px) rotate(10deg);}
  }
  .pkb-hero-text{position:relative;z-index:2;}
  .pkb-hero-badge-top{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:#fff;
    padding:8px 18px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
    color:var(--teal-deep);
    margin-bottom:24px;
    box-shadow:0 4px 12px rgba(0,106,91,0.18);
  }
  .pkb-hero-badge-top::before{
    content:'';
    display:inline-block;
    width:8px;height:8px;
    background:var(--coral);
    border-radius:50%;
  }
  .pkb-hero h1{
    font-size:54px;
    font-weight:800;
    line-height:1.4;
    letter-spacing:-0.01em;
    margin-bottom:28px;
  }
  .pkb-hero h1 .pkb-highlight{
    background:linear-gradient(transparent 65%,var(--yellow) 65%);
    padding:0 4px;
  }
  .pkb-hero h1 .pkb-accent{color:var(--coral);}
  .pkb-hero h1 .pkb-hero-sub-line{
    display:inline-block;
    font-size:26px;
    font-weight:700;
    color:var(--teal);
    margin-top:14px;
    line-height:1.5;
  }
  .pkb-hero p{
    font-size:16px;
    color:var(--ink-soft);
    margin-bottom:40px;
    max-width:480px;
    line-height:1.9;
  }
  .pkb-hero-cta{display:flex;gap:16px;align-items:center;flex-wrap:wrap;}
  .pkb-btn-primary{
    background:var(--coral);
    color:#fff;
    padding:18px 38px;
    border:none;
    font-family:'LINE Seed JP',sans-serif;
    font-size:15px;
    font-weight:700;
    cursor:pointer;
    transition:all 0.2s;
    text-decoration:none;
    display:inline-flex;
    align-items:center;
    gap:10px;
    border-radius:50px;
    box-shadow:0 6px 0 var(--coral-deep);
  }
  .pkb-btn-primary:hover{transform:translateY(3px);box-shadow:0 3px 0 var(--coral-deep);}
  .pkb-btn-primary::after{content:'→';font-size:18px;}
  .pkb-btn-secondary{
    background:#fff;
    color:var(--teal-deep);
    padding:16px 30px;
    border:2px solid var(--teal);
    font-size:14px;
    font-weight:700;
    text-decoration:none;
    border-radius:50px;
    transition:all 0.2s;
    display:inline-block;
  }
  .pkb-btn-secondary:hover{background:var(--teal-soft);}
  .pkb-hero-trust{
    display:flex;
    gap:36px;
    margin-top:40px;
    padding-top:32px;
    border-top:2px dashed var(--line);
  }
  .pkb-hero-trust-item{display:flex;flex-direction:column;}
  .pkb-hero-trust-num{
    font-family:'Fredoka',sans-serif;
    font-size:32px;
    font-weight:600;
    color:var(--teal-deep);
    line-height:1;
  }
  .pkb-hero-trust-num small{font-size:18px;color:var(--coral);}
  .pkb-hero-trust-lbl{
    font-size:11px;
    color:var(--ink-soft);
    margin-top:6px;
    font-weight:700;
  }

  .pkb-hero-image{
    position:relative;
    z-index:1;
    aspect-ratio:1/1.05;
    background:#fff;
    border-radius:32px;
    background-image:url('https://peekaby.itembox.cloud/item/MAIN.jpg?t=20260522163317');
    background-size:cover;
    background-position:center;
    box-shadow:0 30px 60px rgba(0,106,91,0.25);
    transform:rotate(2deg);
  }
  .pkb-hero-image-wrap{position:relative;}
  .pkb-hero-sticker{
    position:absolute;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    box-shadow:0 12px 30px rgba(0,0,0,0.15);
    z-index:3;
  }
  .pkb-hero-sticker-1{
    top:-20px;right:-20px;
    background:var(--yellow);
    transform:rotate(8deg);
    width:130px;height:130px;
  }
  .pkb-hero-sticker-1 .pkb-big{
    font-family:'Fredoka',sans-serif;
    font-size:28px;
    font-weight:700;
    color:var(--ink);
    line-height:1;
  }
  .pkb-hero-sticker-1 .pkb-sm{
    font-size:10px;
    font-weight:700;
    color:var(--ink);
    margin-top:6px;
    letter-spacing:0.05em;
  }
  .pkb-hero-sticker-2{
    bottom:-30px;left:-30px;
    background:var(--coral);
    color:#fff;
    transform:rotate(-12deg);
    width:120px;height:120px;
  }
  .pkb-hero-sticker-2 .pkb-big{
    font-family:'Fredoka',sans-serif;
    font-size:32px;
    font-weight:700;
    line-height:1;
  }
  .pkb-hero-sticker-2 .pkb-sm{font-size:10px;font-weight:700;margin-top:4px;}

  /* Marquee */
  .pkb-marquee{
    background:var(--teal-deep);
    padding:18px 0;
    overflow:hidden;
    border-top:3px solid var(--yellow);
  }
  .pkb-marquee-track{
    display:flex;
    gap:40px;
    animation:scroll 30s linear infinite;
    white-space:nowrap;
  }
  .pkb-marquee-item{
    font-size:14px;
    font-weight:700;
    color:#fff;
    display:flex;
    align-items:center;
    gap:40px;
  }
  .pkb-marquee-item::after{content:'★';color:var(--yellow);font-size:14px;}
  @keyframes scroll{
    0%{transform:translateX(0);}
    100%{transform:translateX(-50%);}
  }

  /* Problem section */
  .pkb-problem{
    background:var(--paper);
    position:relative;
    overflow:hidden;
  }
  .pkb-problem::before{
    content:'';
    position:absolute;
    width:240px;height:240px;
    background:var(--pink-soft);
    border-radius:50%;
    top:-80px;right:-60px;
    opacity:0.7;
  }
  .pkb-problem-head{
    text-align:center;
    max-width:760px;
    margin:0 auto 56px;
    position:relative;
    z-index:2;
  }
  .pkb-problem-head .pkb-section-label{
    margin:0 auto 20px;
    background:#fff;
    color:var(--coral-deep);
  }
  .pkb-problem-head .pkb-section-label::before{color:var(--coral);}
  .pkb-problem-head h2{
    font-size:36px;
    font-weight:800;
    line-height:1.55;
    color:var(--ink);
    margin-bottom:18px;
    letter-spacing:-0.01em;
  }
  .pkb-problem-head h2 .pkb-highlight{
    background:linear-gradient(transparent 65%,var(--yellow) 65%);
    padding:0 4px;
  }
  .pkb-problem-head .pkb-lead{
    font-size:15px;
    color:var(--ink-soft);
    line-height:1.9;
  }
  .pkb-worry-grid{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    max-width:880px;
    margin:0 auto 56px;
    position:relative;
    z-index:2;
  }
  .pkb-worry{
    background:#fff;
    border-radius:20px;
    padding:24px 26px;
    display:flex;
    gap:16px;
    align-items:flex-start;
    position:relative;
  }
  .pkb-worry-mark{
    flex-shrink:0;
    width:42px;height:42px;
    border-radius:50%;
    background:var(--pink-soft);
    color:var(--coral);
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Fredoka',sans-serif;
    font-size:22px;
    font-weight:700;
  }
  .pkb-worry p{
    font-size:14px;
    color:var(--ink);
    font-weight:700;
    line-height:1.75;
  }
  .pkb-problem-bridge{
    text-align:center;
    font-size:17px;
    font-weight:800;
    color:var(--teal);
    max-width:680px;
    margin:0 auto 56px;
    position:relative;
    z-index:2;
    line-height:1.8;
  }
  .pkb-solution{
    background:#fff;
    border-radius:32px;
    padding:56px 60px;
    max-width:980px;
    margin:0 auto;
    position:relative;
    z-index:2;
    border:3px solid var(--teal-soft);
  }
  .pkb-solution-tag{
    display:inline-flex;
    align-items:center;
    gap:8px;
    background:var(--teal);
    color:#fff;
    font-size:13px;
    font-weight:800;
    padding:8px 20px;
    border-radius:30px;
    margin-bottom:24px;
  }
  .pkb-solution-tag::before{
    content:'';
    width:8px;height:8px;
    background:var(--yellow);
    border-radius:50%;
  }
  .pkb-solution h3{
    font-size:26px;
    font-weight:800;
    line-height:1.6;
    color:var(--ink);
    margin-bottom:20px;
    letter-spacing:-0.01em;
  }
  .pkb-solution h3 .pkb-accent{color:var(--coral);}
  .pkb-solution h3 .pkb-highlight{
    background:linear-gradient(transparent 62%,var(--yellow) 62%);
    padding:0 4px;
  }
  .pkb-solution p{
    font-size:15px;
    color:var(--ink-soft);
    line-height:1.95;
    margin-bottom:16px;
  }
  .pkb-solution-duo{
    display:flex;
    gap:16px;
    margin:28px 0;
    flex-wrap:wrap;
  }
  .pkb-solution-duo-item{
    flex:1;
    min-width:200px;
    background:var(--cream);
    border-radius:18px;
    padding:22px 24px;
    display:flex;
    gap:14px;
    align-items:center;
  }
  .pkb-solution-duo-icon{
    flex-shrink:0;
    width:52px;height:52px;
    border-radius:14px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .pkb-solution-duo-item:nth-child(1) .pkb-solution-duo-icon{background:var(--teal-soft);}
  .pkb-solution-duo-item:nth-child(3) .pkb-solution-duo-icon{background:var(--yellow-soft);}
  .pkb-solution-duo-icon svg{width:26px;height:26px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .pkb-solution-duo-item:nth-child(1) .pkb-solution-duo-icon svg{stroke:var(--teal-deep);}
  .pkb-solution-duo-item:nth-child(3) .pkb-solution-duo-icon svg{stroke:var(--orange);}
  .pkb-solution-duo-text strong{
    display:block;
    font-size:15px;
    font-weight:800;
    color:var(--ink);
  }
  .pkb-solution-duo-text span{
    font-size:12px;
    color:var(--ink-soft);
  }
  .pkb-solution-duo-plus{
    align-self:center;
    font-family:'Fredoka',sans-serif;
    font-size:28px;
    font-weight:700;
    color:var(--coral);
  }
  .pkb-solution-closing{
    text-align:center;
    margin-top:28px;
    padding-top:28px;
    border-top:2px dashed var(--line);
  }
  .pkb-solution-closing strong{
    font-size:22px;
    font-weight:800;
    color:var(--ink);
    display:block;
    margin-bottom:8px;
    line-height:1.6;
  }
  .pkb-solution-closing strong .pkb-highlight{
    background:linear-gradient(transparent 62%,var(--yellow) 62%);
    padding:0 4px;
  }
  .pkb-solution-closing span{
    font-size:14px;
    color:var(--ink-soft);
  }

  /* Section common */
  .pkb-root section{padding:100px 80px;}
  .pkb-container{max-width:1280px;margin:0 auto;}
  .pkb-section-label{
    display:inline-flex;
    align-items:center;
    gap:10px;
    background:var(--yellow-soft);
    padding:6px 18px;
    border-radius:30px;
    font-size:12px;
    font-weight:700;
    color:var(--orange);
    margin-bottom:20px;
  }
  .pkb-section-label::before{content:'✦';color:var(--orange);}
  .pkb-section-title{
    font-size:42px;
    font-weight:800;
    line-height:1.5;
    letter-spacing:-0.01em;
    margin-bottom:18px;
    color:var(--ink);
  }
  .pkb-section-title .pkb-highlight{
    background:linear-gradient(transparent 65%,var(--yellow) 65%);
    padding:0 4px;
  }
  .pkb-section-title .pkb-accent{color:var(--coral);}
  .pkb-section-desc{
    font-size:15px;
    color:var(--ink-soft);
    max-width:580px;
    line-height:1.9;
  }

  /* Why Peekaby */
  .pkb-why{background:var(--cream);}
  .pkb-why-header{text-align:center;margin-bottom:70px;}
  .pkb-why-header .pkb-section-label{margin:0 auto 20px;}
  .pkb-why-header .pkb-section-desc{margin:0 auto;}

  .pkb-features-grid{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    gap:24px;
  }
  .pkb-feature{
    background:#fff;
    border-radius:24px;
    padding:36px 28px;
    position:relative;
    transition:transform 0.3s;
    border:3px solid transparent;
    width:calc((100% - 48px) / 3);
  }
  .pkb-feature:hover{transform:translateY(-6px);}
  .pkb-feature:nth-child(1){border-color:var(--teal-soft);}
  .pkb-feature:nth-child(2){border-color:var(--yellow-soft);}
  .pkb-feature:nth-child(3){border-color:var(--pink-soft);}
  .pkb-feature:nth-child(4){border-color:var(--mint);}
  .pkb-feature:nth-child(5){border-color:var(--sky);}
  .pkb-feature-num{
    position:absolute;
    top:24px;right:24px;
    font-family:'Fredoka',sans-serif;
    font-size:48px;
    font-weight:700;
    color:var(--line);
    line-height:1;
  }
  .pkb-feature-icon{
    width:72px;height:72px;
    border-radius:50%;
    margin-bottom:24px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .pkb-feature:nth-child(1) .pkb-feature-icon{background:var(--teal-soft);}
  .pkb-feature:nth-child(2) .pkb-feature-icon{background:var(--yellow-soft);}
  .pkb-feature:nth-child(3) .pkb-feature-icon{background:var(--pink-soft);}
  .pkb-feature:nth-child(4) .pkb-feature-icon{background:var(--mint);}
  .pkb-feature:nth-child(5) .pkb-feature-icon{background:var(--sky);}
  .pkb-feature-icon svg{width:36px;height:36px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .pkb-feature:nth-child(1) .pkb-feature-icon svg{stroke:var(--teal-deep);}
  .pkb-feature:nth-child(2) .pkb-feature-icon svg{stroke:var(--orange);}
  .pkb-feature:nth-child(3) .pkb-feature-icon svg{stroke:var(--coral);}
  .pkb-feature:nth-child(4) .pkb-feature-icon svg{stroke:#52a878;}
  .pkb-feature:nth-child(5) .pkb-feature-icon svg{stroke:#3d8bb5;}
  .pkb-feature h3{
    font-size:19px;
    font-weight:800;
    margin-bottom:14px;
    line-height:1.55;
    color:var(--ink);
  }
  .pkb-feature p{
    font-size:14px;
    color:var(--ink-soft);
    line-height:1.8;
  }
  .pkb-feature-cert{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-top:14px;
  }
  .pkb-feature-cert span{
    font-size:11px;
    font-weight:800;
    color:var(--teal-deep);
    background:var(--teal-soft);
    padding:3px 10px;
    border-radius:20px;
  }

  /* Products */
  .pkb-products{
    background:var(--teal-soft);
    position:relative;
    overflow:hidden;
  }
  .pkb-products::before{
    content:'';
    position:absolute;
    width:300px;height:300px;
    background:var(--yellow);
    border-radius:50%;
    top:-100px;right:-100px;
    opacity:0.3;
  }
  .pkb-products-header{text-align:center;margin-bottom:70px;position:relative;}
  .pkb-products-header .pkb-section-label{margin:0 auto 20px;background:#fff;color:var(--teal-deep);}
  .pkb-products-header .pkb-section-label::before{color:var(--teal);}
  .pkb-products-header .pkb-section-desc{margin:0 auto;}

  .pkb-products-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
    position:relative;
  }
  .pkb-product{
    background:#fff;
    border-radius:28px;
    overflow:hidden;
    transition:transform 0.3s;
  }
  .pkb-product:hover{transform:translateY(-8px);}
  .pkb-product-image{
    aspect-ratio:4/3.5;
    background-size:cover;
    background-position:center;
    position:relative;
  }
  .pkb-product-tag{
    position:absolute;
    top:16px;left:16px;
    background:var(--coral);
    color:#fff;
    font-size:11px;
    font-weight:700;
    padding:6px 14px;
    border-radius:30px;
    z-index:2;
    box-shadow:0 4px 12px rgba(232,69,69,0.3);
  }
  .pkb-product-tag.pkb-tag-yellow{background:var(--yellow);color:var(--ink);}
  .pkb-product-tag.pkb-tag-teal{background:var(--teal);color:#fff;}
  .pkb-product-fav{
    position:absolute;
    top:16px;right:16px;
    width:40px;height:40px;
    border-radius:50%;
    background:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    cursor:pointer;
    z-index:2;
    transition:transform 0.2s;
  }
  .pkb-product-fav:hover{transform:scale(1.1);}
  .pkb-product-fav svg{width:18px;height:18px;fill:none;stroke:var(--coral);stroke-width:2;}
  .pkb-product-info{padding:24px 26px 28px;}
  .pkb-product-month{
    display:inline-block;
    font-size:12px;
    font-weight:700;
    color:var(--teal-deep);
    background:var(--teal-soft);
    padding:4px 12px;
    border-radius:20px;
    margin-bottom:12px;
  }
  .pkb-product h4{
    font-size:20px;
    font-weight:800;
    margin-bottom:8px;
    line-height:1.5;
    color:var(--ink);
  }
  .pkb-product-sub{
    font-size:13px;
    color:var(--ink-soft);
    margin-bottom:18px;
    line-height:1.6;
  }
  .pkb-product-features{
    display:flex;
    flex-wrap:wrap;
    gap:6px;
    margin-bottom:20px;
  }
  .pkb-product-feature{
    font-size:11px;
    font-weight:700;
    padding:4px 10px;
    border-radius:20px;
    background:var(--paper);
    color:var(--ink-soft);
  }
  .pkb-product-meta{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding-top:20px;
    border-top:2px dashed var(--line);
  }
  .pkb-product-price{display:flex;flex-direction:column;}
  .pkb-product-price strong{
    font-family:'Fredoka',sans-serif;
    font-size:24px;
    font-weight:700;
    color:var(--ink);
  }
  .pkb-product-price small{
    font-size:11px;
    color:var(--ink-soft);
    font-weight:700;
  }
  .pkb-product-add{
    background:var(--teal);
    color:#fff !important;
    border:none;
    padding:12px 22px;
    border-radius:30px;
    font-size:13px;
    font-weight:700;
    cursor:pointer;
    box-shadow:0 4px 0 var(--teal-deep);
    transition:all 0.2s;
    display:flex;
    align-items:center;
    gap:6px;
  }
  .pkb-product-add:hover{transform:translateY(2px);box-shadow:0 2px 0 var(--teal-deep);}
  .pkb-product-add svg{width:14px;height:14px;stroke:#fff;fill:none;stroke-width:2.5;}

  .pkb-view-all{display:flex;justify-content:center;margin-top:60px;}

  /* Voices */
  .pkb-voices{background:var(--pink-soft);position:relative;overflow:hidden;}
  .pkb-voices::before{
    content:'';
    position:absolute;
    width:200px;height:200px;
    background:var(--yellow);
    border-radius:50%;
    top:-50px;left:-50px;
    opacity:0.4;
  }
  .pkb-voices-header{
    text-align:center;
    margin-bottom:60px;
    position:relative;
  }
  .pkb-voices-header .pkb-section-label{margin:0 auto 20px;background:#fff;color:var(--coral-deep);}
  .pkb-voices-header .pkb-section-label::before{color:var(--coral);}
  .pkb-voices-grid{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:28px;
    position:relative;
  }
  .pkb-voice{
    background:#fff;
    padding:36px 32px;
    border-radius:24px;
    position:relative;
    transition:transform 0.3s;
  }
  .pkb-voice:hover{transform:translateY(-6px);}
  .pkb-voice:nth-child(2){transform:translateY(-20px);}
  .pkb-voice:nth-child(2):hover{transform:translateY(-26px);}
  .pkb-voice-stars{
    color:var(--yellow);
    font-size:16px;
    letter-spacing:0.1em;
    margin-bottom:16px;
  }
  .pkb-voice-headline{
    font-size:17px;
    font-weight:800;
    color:var(--ink);
    margin-bottom:14px;
    line-height:1.55;
  }
  .pkb-voice-headline .pkb-highlight{
    background:linear-gradient(transparent 65%,var(--yellow-soft) 65%);
    padding:0 2px;
  }
  .pkb-voice-text{
    font-size:14px;
    line-height:1.85;
    color:var(--ink-soft);
    margin-bottom:24px;
    min-height:120px;
  }
  .pkb-voice-author{
    display:flex;
    align-items:center;
    gap:14px;
    padding-top:20px;
    border-top:2px dashed var(--line);
  }
  .pkb-voice-photo{
    width:50px;height:50px;
    border-radius:50%;
    background-size:cover;
    background-position:center;
    border:3px solid var(--yellow);
  }
  .pkb-voice-name{
    font-size:14px;
    font-weight:800;
    color:var(--ink);
  }
  .pkb-voice-meta{
    font-size:11px;
    color:var(--ink-soft);
    font-weight:700;
    margin-top:2px;
  }

  /* How It Works */
  .pkb-how-section{background:var(--cream);position:relative;}
  .pkb-how-header{text-align:center;margin-bottom:60px;}
  .pkb-how-header .pkb-section-label{margin:0 auto 20px;}
  .pkb-how-header .pkb-section-desc{margin:0 auto;}

  .pkb-how-steps{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:32px;
    position:relative;
  }
  .pkb-how-step{
    background:#fff;
    border-radius:24px;
    padding:40px 32px 32px;
    text-align:center;
    position:relative;
    z-index:1;
    border:3px solid var(--teal-soft);
  }
  .pkb-how-step-icon{
    width:120px;height:120px;
    border-radius:50%;
    margin:0 auto 24px;
    display:flex;
    align-items:center;
    justify-content:center;
    position:relative;
  }
  .pkb-how-step:nth-child(1) .pkb-how-step-icon{background:var(--yellow-soft);}
  .pkb-how-step:nth-child(2) .pkb-how-step-icon{background:var(--teal-soft);}
  .pkb-how-step:nth-child(3) .pkb-how-step-icon{background:var(--pink-soft);}
  .pkb-how-step-icon svg{width:56px;height:56px;fill:none;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
  .pkb-how-step:nth-child(1) .pkb-how-step-icon svg{stroke:var(--orange);}
  .pkb-how-step:nth-child(2) .pkb-how-step-icon svg{stroke:var(--teal-deep);}
  .pkb-how-step:nth-child(3) .pkb-how-step-icon svg{stroke:var(--coral);}
  .pkb-how-step-num{
    position:absolute;
    top:-10px;right:0px;
    background:var(--coral);
    color:#fff;
    width:40px;height:40px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Fredoka',sans-serif;
    font-weight:700;
    font-size:18px;
    border:3px solid #fff;
  }
  .pkb-how-step h4{
    font-size:20px;
    font-weight:800;
    margin-bottom:12px;
    color:var(--ink);
  }
  .pkb-how-step p{
    font-size:13px;
    color:var(--ink-soft);
    line-height:1.85;
  }

  /* App */
  .pkb-app-section{
    background:var(--lavender);
    padding:100px 80px;
    position:relative;
    overflow:hidden;
  }
  .pkb-app-section::before{
    content:'';
    position:absolute;
    width:280px;height:280px;
    background:var(--yellow);
    border-radius:50%;
    bottom:-120px;left:-80px;
    opacity:0.35;
  }
  .pkb-app-section::after{
    content:'';
    position:absolute;
    width:220px;height:220px;
    background:var(--pink);
    border-radius:50%;
    top:-100px;right:-80px;
    opacity:0.35;
  }
  .pkb-app-inner{
    max-width:1280px;
    margin:0 auto;
    position:relative;
    z-index:2;
  }
  .pkb-app-head{
    text-align:center;
    max-width:760px;
    margin:0 auto 56px;
  }
  .pkb-app-head .pkb-section-label{
    margin:0 auto 20px;
    background:#fff;
    color:var(--teal-deep);
  }
  .pkb-app-head .pkb-section-label::before{color:var(--teal);}
  .pkb-app-head h2{
    font-size:40px;
    font-weight:800;
    line-height:1.55;
    letter-spacing:-0.01em;
    margin-bottom:18px;
    color:var(--ink);
  }
  .pkb-app-head h2 .pkb-highlight{
    background:linear-gradient(transparent 65%,var(--yellow) 65%);
    padding:0 4px;
  }
  .pkb-app-head h2 .pkb-accent{color:var(--coral);}
  .pkb-app-head .pkb-lead{
    font-size:15px;
    color:var(--ink-soft);
    line-height:1.95;
  }

  /* Feature trio with phones */
  .pkb-app-features{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:32px;
    margin-bottom:60px;
  }
  .pkb-app-feature{
    background:#fff;
    border-radius:28px;
    padding:40px 28px 32px;
    text-align:center;
    position:relative;
    transition:transform 0.3s;
    border:3px solid transparent;
  }
  .pkb-app-feature:hover{transform:translateY(-6px);}
  .pkb-app-feature:nth-child(1){border-color:var(--teal-soft);}
  .pkb-app-feature:nth-child(2){border-color:var(--yellow-soft);}
  .pkb-app-feature:nth-child(3){border-color:var(--pink-soft);}
  .pkb-app-feature-num{
    position:absolute;
    top:-14px;left:50%;
    transform:translateX(-50%);
    background:var(--coral);
    color:#fff;
    font-family:'Fredoka',sans-serif;
    font-weight:700;
    font-size:14px;
    width:42px;height:42px;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    border:3px solid #fff;
    box-shadow:0 4px 0 var(--coral-deep);
  }
  .pkb-app-feature h3{
    font-size:19px;
    font-weight:800;
    color:var(--ink);
    line-height:1.55;
    margin-bottom:12px;
  }
  .pkb-app-feature h3 .pkb-highlight{
    background:linear-gradient(transparent 62%,var(--yellow) 62%);
    padding:0 3px;
  }
  .pkb-app-feature p{
    font-size:13px;
    color:var(--ink-soft);
    line-height:1.85;
    margin-bottom:28px;
  }

  /* Phone */
  .pkb-phone{
    position:relative;
    margin:0 auto;
    width:230px;
    height:460px;
    background:var(--ink);
    border-radius:36px;
    padding:10px;
    box-shadow:0 20px 50px rgba(45,42,62,0.25);
  }
  .pkb-phone-notch{
    position:absolute;
    top:10px;left:50%;
    transform:translateX(-50%);
    width:80px;height:20px;
    background:var(--ink);
    border-radius:0 0 14px 14px;
    z-index:3;
  }
  .pkb-phone-screen{
    width:100%;height:100%;
    background:var(--cream);
    border-radius:28px;
    overflow:hidden;
    padding:30px 14px 14px;
    position:relative;
  }
  .pkb-phone-screen.pkb-screenshot{
    padding:0;
    background:#fff;
  }
  .pkb-phone-screen.pkb-screenshot img{
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:top center;
    display:block;
  }
  .pkb-phone-app-head{
    display:flex;
    align-items:center;
    gap:8px;
    margin-bottom:12px;
  }
  .pkb-phone-app-avatar{
    width:32px;height:32px;
    border-radius:50%;
    background-size:cover;
    background-position:center;
    border:2px solid var(--yellow);
  }
  .pkb-phone-app-greeting{text-align:left;}
  .pkb-phone-app-greeting small{
    font-size:8px;
    color:var(--ink-soft);
    font-weight:700;
  }
  .pkb-phone-app-greeting strong{
    display:block;
    font-size:11px;
    font-weight:800;
    color:var(--ink);
    line-height:1.3;
  }
  .pkb-phone-card{
    background:#fff;
    border-radius:14px;
    padding:12px;
    margin-bottom:10px;
    text-align:left;
  }
  .pkb-phone-card-label{
    font-size:8px;
    font-weight:800;
    color:var(--teal-deep);
    background:var(--teal-soft);
    display:inline-block;
    padding:2px 8px;
    border-radius:10px;
    margin-bottom:6px;
  }
  .pkb-phone-card-label.pkb-lbl-coral{color:var(--coral-deep);background:var(--pink-soft);}
  .pkb-phone-card-label.pkb-lbl-yellow{color:var(--orange);background:var(--yellow-soft);}
  .pkb-phone-card h6{
    font-size:11px;
    font-weight:800;
    color:var(--ink);
    line-height:1.5;
    margin-bottom:4px;
  }
  .pkb-phone-card p{
    font-size:9px;
    color:var(--ink-soft);
    line-height:1.6;
    margin:0;
  }

  /* Phone 1 — How to play */
  .pkb-play-video{
    position:relative;
    aspect-ratio:16/10;
    background:linear-gradient(135deg,var(--teal-soft),var(--mint));
    border-radius:10px;
    margin-bottom:8px;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .pkb-play-video::after{
    content:'';
    width:0;height:0;
    border-left:14px solid #fff;
    border-top:9px solid transparent;
    border-bottom:9px solid transparent;
    margin-left:4px;
    filter:drop-shadow(0 2px 4px rgba(0,0,0,0.2));
  }
  .pkb-play-step{
    display:flex;
    align-items:center;
    gap:8px;
    padding:6px 0;
    border-bottom:1px solid var(--paper);
    font-size:9px;
    color:var(--ink);
    font-weight:700;
  }
  .pkb-play-step:last-child{border-bottom:none;}
  .pkb-play-step-num{
    width:16px;height:16px;
    border-radius:50%;
    background:var(--teal);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-family:'Fredoka',sans-serif;
    font-size:9px;
    font-weight:700;
    flex-shrink:0;
  }

  /* Phone 2 — Daily record */
  .pkb-record-check{
    display:flex;
    align-items:center;
    gap:8px;
    padding:8px 0;
    border-bottom:1px solid var(--paper);
  }
  .pkb-record-check:last-child{border-bottom:none;}
  .pkb-record-check-box{
    width:16px;height:16px;
    border-radius:5px;
    flex-shrink:0;
    display:flex;
    align-items:center;
    justify-content:center;
  }
  .pkb-record-check.pkb-done .pkb-record-check-box{
    background:var(--teal);
    color:#fff;
    font-size:11px;
    font-weight:800;
  }
  .pkb-record-check.pkb-todo .pkb-record-check-box{
    background:transparent;
    border:1.5px solid var(--ink-soft);
  }
  .pkb-record-check-text{
    font-size:9px;
    color:var(--ink);
    font-weight:700;
    flex:1;
  }
  .pkb-record-check.pkb-done .pkb-record-check-text{color:var(--ink-soft);text-decoration:line-through;}
  .pkb-record-cheer{
    background:var(--yellow-soft);
    border-radius:10px;
    padding:8px 10px;
    margin-top:8px;
    font-size:9px;
    font-weight:800;
    color:var(--orange);
    text-align:center;
  }

  /* Phone 3 — Acquired abilities */
  .pkb-ability-radar{
    position:relative;
    width:110px;
    height:110px;
    margin:6px auto 10px;
  }
  .pkb-ability-radar svg{width:100%;height:100%;}
  .pkb-ability-list{display:flex;flex-direction:column;gap:6px;}
  .pkb-ability-item{
    display:flex;
    align-items:center;
    gap:8px;
  }
  .pkb-ability-dot{
    width:8px;height:8px;
    border-radius:50%;
    flex-shrink:0;
  }
  .pkb-ability-item:nth-child(1) .pkb-ability-dot{background:var(--teal);}
  .pkb-ability-item:nth-child(2) .pkb-ability-dot{background:var(--coral);}
  .pkb-ability-item:nth-child(3) .pkb-ability-dot{background:var(--yellow);}
  .pkb-ability-item:nth-child(4) .pkb-ability-dot{background:#a78bfa;}
  .pkb-ability-name{
    font-size:9px;
    font-weight:700;
    color:var(--ink);
    flex:1;
  }
  .pkb-ability-bar{
    flex:1.3;
    height:5px;
    background:var(--paper);
    border-radius:5px;
    overflow:hidden;
  }
  .pkb-ability-bar span{
    display:block;
    height:100%;
    border-radius:5px;
  }
  .pkb-ability-item:nth-child(1) .pkb-ability-bar span{width:85%;background:var(--teal);}
  .pkb-ability-item:nth-child(2) .pkb-ability-bar span{width:70%;background:var(--coral);}
  .pkb-ability-item:nth-child(3) .pkb-ability-bar span{width:60%;background:var(--yellow);}
  .pkb-ability-item:nth-child(4) .pkb-ability-bar span{width:75%;background:#a78bfa;}

  /* Trial + stores (centered) */
  .pkb-app-trial{
    display:flex;
    align-items:center;
    gap:18px;
    background:#fff;
    border:2px dashed var(--coral);
    border-radius:20px;
    padding:20px 28px;
    max-width:580px;
    margin:0 auto 24px;
  }
  .pkb-app-trial-badge{
    flex-shrink:0;
    width:88px;height:88px;
    background:var(--coral);
    color:#fff;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    text-align:center;
    transform:rotate(-8deg);
    box-shadow:0 6px 0 var(--coral-deep);
  }
  .pkb-app-trial-badge .pkb-num{
    font-family:'Fredoka',sans-serif;
    font-size:32px;
    font-weight:700;
    line-height:0.9;
  }
  .pkb-app-trial-badge .pkb-unit{
    font-size:11px;
    font-weight:700;
  }
  .pkb-app-trial-text{text-align:left;}
  .pkb-app-trial-text strong{
    display:block;
    font-size:17px;
    font-weight:800;
    color:var(--ink);
    margin-bottom:4px;
  }
  .pkb-app-trial-text strong em{
    font-style:normal;
    color:var(--coral);
  }
  .pkb-app-trial-text span{
    font-size:12px;
    color:var(--ink-soft);
    line-height:1.6;
  }
  .pkb-app-stores{
    display:flex;
    gap:12px;
    flex-wrap:wrap;
    justify-content:center;
  }
  .pkb-store-btn{
    background:var(--ink);
    color:#fff !important;
    padding:12px 22px;
    border-radius:14px;
    display:flex;
    align-items:center;
    gap:10px;
    text-decoration:none;
    transition:transform 0.2s;
  }
  .pkb-store-btn:hover{transform:translateY(-2px);}
  .pkb-store-btn svg{width:22px;height:22px;fill:#fff;}
  .pkb-store-btn-text{display:flex;flex-direction:column;line-height:1.25;text-align:left;}
  .pkb-store-btn-text small{font-size:9px;opacity:0.8;}
  .pkb-store-btn-text strong{font-size:14px;font-weight:700;}

  /* CTA banner */
  .pkb-cta-banner{
    background:linear-gradient(135deg,var(--coral) 0%,var(--orange) 100%);
    padding:90px 80px;
    text-align:center;
    position:relative;
    overflow:hidden;
    color:#fff;
  }
  .pkb-cta-banner::before,.pkb-cta-banner::after{
    content:'';
    position:absolute;
    border-radius:50%;
    background:rgba(255,255,255,0.15);
  }
  .pkb-cta-banner::before{
    width:200px;height:200px;
    top:-80px;left:10%;
  }
  .pkb-cta-banner::after{
    width:140px;height:140px;
    bottom:-50px;right:15%;
  }
  .pkb-cta-content{position:relative;z-index:2;}
  .pkb-cta-banner .pkb-section-label{
    background:rgba(255,255,255,0.25);
    color:#fff;
    margin-bottom:16px;
  }
  .pkb-cta-banner .pkb-section-label::before{color:var(--yellow);}
  .pkb-cta-banner h2{
    font-size:46px;
    font-weight:800;
    line-height:1.5;
    margin-bottom:20px;
    color:#fff;
  }
  .pkb-cta-banner h2 .pkb-accent{color:var(--yellow);}
  .pkb-cta-banner p{
    font-size:15px;
    max-width:560px;
    margin:0 auto 36px;
    line-height:1.9;
    opacity:0.95;
  }
  .pkb-line-cta{
    background:#06c755;
    color:#fff !important;
    padding:18px 38px;
    text-decoration:none;
    font-size:15px;
    font-weight:700;
    border-radius:50px;
    display:inline-flex;
    align-items:center;
    gap:12px;
    transition:transform 0.2s;
    box-shadow:0 6px 0 #04a045;
  }
  .pkb-line-cta:hover{transform:translateY(3px);box-shadow:0 3px 0 #04a045;}

  /* Footer */
  .pkb-root footer{
    background:var(--ink);
    color:#fff;
    padding:80px 80px 30px;
  }
  .pkb-footer-grid{
    display:grid;
    grid-template-columns:2fr 1fr 1fr 1fr;
    gap:50px;
    margin-bottom:60px;
  }
  .pkb-footer-brand .pkb-logo,.pkb-root .logo{color:#fff;}
  .pkb-footer-brand p{
    font-size:13px;
    color:#a9a5b5;
    margin-top:16px;
    max-width:320px;
    line-height:1.9;
  }
  .pkb-root footer h5{
    font-size:13px;
    font-weight:800;
    color:var(--yellow);
    margin-bottom:20px;
    letter-spacing:0.05em;
  }
  .pkb-root footer ul{list-style:none;}
  .pkb-root footer li{margin-bottom:10px;}
  .pkb-root footer a{
    color:#c4c0d0;
    text-decoration:none;
    font-size:13px;
    transition:color 0.3s;
  }
  .pkb-root footer a:hover{color:var(--yellow);}
  .pkb-footer-bottom{
    border-top:1px solid rgba(255,255,255,0.1);
    padding-top:24px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    font-size:11px;
    color:#7a7585;
  }
  .pkb-footer-social{display:flex;gap:12px;}
  .pkb-footer-social a{
    width:38px;height:38px;
    background:rgba(255,255,255,0.08);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    transition:all 0.3s;
  }
  .pkb-footer-social a:hover{background:var(--yellow);}
  .pkb-footer-social svg{width:14px;height:14px;fill:#c4c0d0;}
  .pkb-footer-social a:hover svg{fill:var(--ink);}

  

  /* ===========================================
   *  Responsive — Tablet (1024px and below)
   * =========================================== */
  @media (max-width:1024px){
    .pkb-root header{padding:14px 24px;}
    .pkb-root nav ul{gap:24px;}
    .pkb-root nav a{font-size:13px;}
    .pkb-header-cta,.pkb-root .header-cta{padding:10px 20px;font-size:12px;}

    .pkb-hero{padding:40px 32px 70px;}
    .pkb-hero-inner{gap:36px;}
    .pkb-hero h1{font-size:44px;}
    .pkb-hero h1 .pkb-hero-sub-line{font-size:22px;}
    .pkb-hero p{font-size:15px;}

    .pkb-root section{padding:70px 32px;}
    .pkb-section-title{font-size:34px;}
    .pkb-problem-head h2{font-size:30px;}

    .pkb-features-grid .pkb-feature{width:calc((100% - 24px) / 2);}
    .pkb-products-grid,
    .pkb-voices-grid,
    .pkb-how-steps,
    .pkb-app-features{
      grid-template-columns:repeat(2,1fr);
    }
    .pkb-products-grid .pkb-product:last-child{grid-column:1/-1;max-width:50%;margin:0 auto;}
    .pkb-voices-grid .pkb-voice:nth-child(2){transform:none;}
    .pkb-voices-grid .pkb-voice:nth-child(2):hover{transform:translateY(-6px);}
    .pkb-app-features .pkb-app-feature:nth-child(3){grid-column:1/-1;max-width:50%;margin:0 auto;}

    .pkb-worry-grid{grid-template-columns:repeat(2,1fr);max-width:100%;}
    .pkb-solution{padding:40px 32px;}
    .pkb-solution h3{font-size:22px;}

    .pkb-cta-banner h2{font-size:38px;}

    .pkb-footer-grid{grid-template-columns:1fr 1fr;gap:36px;}
    .pkb-root footer{padding:60px 32px 24px;}
  }

  /* ===========================================
   *  Responsive — Smartphone (768px and below)
   * =========================================== */
  @media (max-width:768px){
    .pkb-topbar,.pkb-root .topbar{font-size:10px;letter-spacing:0.02em;padding:8px 12px;line-height:1.6;}
    .pkb-topbar span,.pkb-root .topbar span{margin:0 6px;}

    /* Header: ナビは隠してCTAボタンを残す */
    .pkb-root header{padding:12px 16px;}
    .pkb-root nav{display:none;}
    .pkb-logo,.pkb-root .logo{font-size:24px;}
    .pkb-logo-jp,.pkb-root .logo-jp{font-size:9px;letter-spacing:0.2em;}
    .pkb-logo-mark,.pkb-root .logo-mark{width:36px;height:36px;font-size:18px;}
    .pkb-header-cta,.pkb-root .header-cta{padding:9px 16px;font-size:11px;}

    /* Hero: 縦並びに */
    .pkb-hero{padding:32px 20px 60px;}
    .pkb-hero-inner{
      grid-template-columns:1fr;
      gap:40px;
    }
    .pkb-hero-badge-top{font-size:11px;padding:6px 14px;}
    .pkb-hero h1{font-size:34px;line-height:1.4;}
    .pkb-hero h1 .pkb-hero-sub-line{font-size:17px;margin-top:10px;}
    .pkb-hero p{font-size:14px;line-height:1.85;}
    .pkb-hero-cta{gap:10px;}
    .pkb-btn-primary{padding:14px 26px;font-size:13px;}
    .pkb-btn-secondary{padding:13px 22px;font-size:12px;}

    .pkb-hero-trust{gap:18px;}
    .pkb-hero-trust-num{font-size:26px;}
    .pkb-hero-trust-num small{font-size:14px;}
    .pkb-hero-trust-lbl{font-size:10px;}

    /* Hero画像とステッカーを縮小 */
    .pkb-hero-image{border-radius:24px;transform:rotate(0);}
    .pkb-hero-sticker-1,.pkb-hero-sticker-2{
      width:88px;height:88px;
    }
    .pkb-hero-sticker-1 .pkb-big{font-size:20px;}
    .pkb-hero-sticker-2 .pkb-big{font-size:22px;}
    .pkb-hero-sticker-1 .pkb-sm,.pkb-hero-sticker-2 .pkb-sm{font-size:9px;}
    .pkb-hero-sticker-1{top:-12px;right:-10px;}
    .pkb-hero-sticker-2{bottom:-16px;left:-10px;}

    /* 浮遊装飾を小さく */
    .pkb-deco-1{width:70px;height:70px;}
    .pkb-deco-2{width:36px;height:36px;}
    .pkb-deco-3{width:50px;height:50px;}

    .pkb-marquee{padding:14px 0;}
    .pkb-marquee-item{font-size:12px;gap:24px;}
    .pkb-marquee-track{gap:24px;}

    /* セクション共通 */
    .pkb-root section{padding:60px 20px;}
    .pkb-section-label{font-size:11px;padding:5px 14px;}
    .pkb-section-title{font-size:26px;line-height:1.55;}
    .pkb-section-desc{font-size:14px;line-height:1.85;}

    /* Problem 縦並び */
    .pkb-problem-head h2{font-size:22px;line-height:1.6;}
    .pkb-problem-head .pkb-lead{font-size:14px;}
    .pkb-worry-grid{
      grid-template-columns:1fr;
      gap:12px;
      margin-bottom:36px;
    }
    .pkb-worry{padding:18px 20px;}
    .pkb-worry p{font-size:13px;line-height:1.7;}
    .pkb-worry-mark{width:34px;height:34px;font-size:18px;}
    .pkb-problem-bridge{font-size:14px;line-height:1.75;margin-bottom:36px;}

    .pkb-solution{padding:32px 22px;border-radius:24px;}
    .pkb-solution h3{font-size:18px;line-height:1.65;}
    .pkb-solution p{font-size:13px;}
    .pkb-solution-tag{font-size:11px;padding:6px 14px;}
    .pkb-solution-duo{flex-direction:column;gap:12px;}
    .pkb-solution-duo-plus{transform:rotate(90deg);align-self:center;font-size:24px;}
    .pkb-solution-duo-item{min-width:auto;padding:18px 20px;}
    .pkb-solution-closing strong{font-size:17px;line-height:1.65;}
    .pkb-solution-closing span{font-size:13px;}

    /* Why: 5枚を全て1列 */
    .pkb-features-grid{flex-direction:column;}
    .pkb-features-grid .pkb-feature{width:100%;padding:28px 24px;}
    .pkb-feature h3{font-size:17px;}
    .pkb-feature p{font-size:13px;}
    .pkb-feature-num{font-size:38px;top:18px;right:20px;}
    .pkb-feature-icon{width:60px;height:60px;}
    .pkb-feature-icon svg{width:30px;height:30px;}

    /* Products 1列 */
    .pkb-products-grid{grid-template-columns:1fr;gap:20px;}
    .pkb-products-grid .pkb-product:last-child{grid-column:auto;max-width:none;margin:0;}
    .pkb-product h4{font-size:18px;}
    .pkb-product-info{padding:20px 22px 24px;}
    .pkb-product-price strong{font-size:20px;}

    /* Voices 1列 */
    .pkb-voices-grid{grid-template-columns:1fr;gap:16px;}
    .pkb-voice{padding:28px 24px;}
    .pkb-voice-headline{font-size:15px;}
    .pkb-voice-text{min-height:auto;font-size:13px;}

    /* How steps 1列 */
    .pkb-how-steps{grid-template-columns:1fr;gap:20px;}
    .pkb-how-step{padding:32px 24px 26px;}
    .pkb-how-step-icon{width:96px;height:96px;}
    .pkb-how-step-icon svg{width:46px;height:46px;}
    .pkb-how-step h4{font-size:18px;}

    /* App 1列 */
    .pkb-app-features{grid-template-columns:1fr;gap:24px;}
    .pkb-app-features .pkb-app-feature:nth-child(3){grid-column:auto;max-width:none;margin:0;}
    .pkb-app-feature{padding:36px 24px 28px;}
    .pkb-app-head h2{font-size:28px;line-height:1.6;}
    .pkb-app-head .pkb-lead{font-size:14px;}
    .pkb-app-feature h3{font-size:17px;}

    .pkb-app-trial{
      flex-direction:column;
      text-align:center;
      padding:24px 20px;
      gap:14px;
    }
    .pkb-app-trial-text{text-align:center;}
    .pkb-app-trial-text strong{font-size:15px;}
    .pkb-app-trial-text span{font-size:12px;}
    .pkb-app-trial-badge{width:78px;height:78px;}
    .pkb-app-trial-badge .pkb-num{font-size:28px;}

    /* CTA Banner */
    .pkb-cta-banner{padding:60px 20px;}
    .pkb-cta-banner h2{font-size:28px;line-height:1.55;}
    .pkb-cta-banner p{font-size:13px;}
    .pkb-line-cta{padding:14px 28px;font-size:13px;}

    /* Footer */
    .pkb-root footer{padding:48px 24px 24px;}
    .pkb-footer-grid{grid-template-columns:1fr;gap:28px;margin-bottom:36px;}
    .pkb-footer-brand p{max-width:100%;font-size:12px;}
    .pkb-footer-bottom{flex-direction:column;gap:16px;text-align:center;}

    /* Phone内のスクショは少しコンパクトに */
    .pkb-phone{width:210px;height:420px;}
  }

  /* ===========================================
   *  Responsive — Small smartphone (380px and below)
   * =========================================== */
  @media (max-width:380px){
    .pkb-hero h1{font-size:30px;}
    .pkb-hero h1 .pkb-hero-sub-line{font-size:15px;}
    .pkb-section-title{font-size:23px;}
    .pkb-problem-head h2{font-size:20px;}
    .pkb-app-head h2{font-size:24px;}
    .pkb-cta-banner h2{font-size:25px;}
    .pkb-hero-cta{flex-direction:column;align-items:stretch;}
    .pkb-btn-primary,.pkb-btn-secondary{text-align:center;justify-content:center;}
    .pkb-hero-trust{flex-wrap:wrap;gap:14px;}
  }

  /* ===========================================
   *  ボタン文字色の保護
   *  フューチャーショップ標準の a タグ色指定に
   *  上書きされないよう強制適用
   * =========================================== */
  .pkb-root a.pkb-product-add,
  .pkb-root a.pkb-product-add:hover,
  .pkb-root a.pkb-product-add:visited,
  .pkb-root a.pkb-store-btn,
  .pkb-root a.pkb-store-btn:hover,
  .pkb-root a.pkb-store-btn:visited,
  .pkb-root a.pkb-store-btn small,
  .pkb-root a.pkb-store-btn strong,
  .pkb-root a.pkb-line-cta,
  .pkb-root a.pkb-line-cta:hover,
  .pkb-root a.pkb-line-cta:visited,
  .pkb-root a.pkb-btn-primary,
  .pkb-root a.pkb-btn-primary:hover,
  .pkb-root a.pkb-btn-primary:visited,
  .pkb-root a.pkb-header-cta,
  .pkb-root a.pkb-header-cta:hover,
  .pkb-root a.pkb-header-cta:visited,
  .pkb-root .header-cta,
  .pkb-root .header-cta:hover,
  .pkb-root .header-cta:visited{
    color:#fff !important;
  }
/* ===========================================
   *  ロゴリンクの色を保護
   *  ヘッダーロゴ全体を <a> で囲んでも
   *  各要素の元の色を維持
   * =========================================== */
  .pkb-root a.pkb-logo-wrap,
  .pkb-root a.pkb-logo-wrap:hover,
  .pkb-root a.pkb-logo-wrap:visited,
  .pkb-root .pkb-logo-wrap a,
  .pkb-root .pkb-logo-wrap a:hover,
  .pkb-root .pkb-logo-wrap a:visited,
  .pkb-root a.logo-wrap,
  .pkb-root a.logo-wrap:hover,
  .pkb-root a.logo-wrap:visited,
  .pkb-root .logo-wrap a,
  .pkb-root .logo-wrap a:hover,
  .pkb-root .logo-wrap a:visited{
    color:inherit !important;
    text-decoration:none !important;
  }
  /* マーク(Pの円)は白文字 */
  .pkb-root a.pkb-logo-wrap .pkb-logo-mark,
  .pkb-root .pkb-logo-wrap a .pkb-logo-mark,
  .pkb-root a.logo-wrap .logo-mark,
  .pkb-root .logo-wrap a .logo-mark{
    color:#fff !important;
  }
  /* Peekaby(英字)はグリーン */
  .pkb-root a.pkb-logo-wrap .pkb-logo,
  .pkb-root .pkb-logo-wrap a .pkb-logo,
  .pkb-root a.logo-wrap .logo,
  .pkb-root .logo-wrap a .logo{
    color:var(--teal-deep) !important;
  }
  /* ピカビー(カナ)はグレー */
  .pkb-root a.pkb-logo-wrap .pkb-logo-jp,
  .pkb-root .pkb-logo-wrap a .pkb-logo-jp,
  .pkb-root a.logo-wrap .logo-jp,
  .pkb-root .logo-wrap a .logo-jp{
    color:var(--ink-soft) !important;
  }
/* ============================================
 * Peekaby ブランドストーリーページ専用CSS
 * 既存の pkb_styles.css の末尾に追記してください
 * 
 * 全てのクラスに pkb-bs- プレフィックスを使用
 * （Brand Story の略）
 * ============================================ */

  /* 共通：本文セクションの最大幅と余白 */
  .pkb-root .pkb-bs-hero,
  .pkb-root .pkb-bs-chapter,
  .pkb-root .pkb-bs-closing{
    padding:100px 24px;
  }

  /* ==================== HERO ==================== */
  .pkb-bs-hero{
    background:linear-gradient(180deg,var(--cream) 0%,#fff 100%);
    text-align:center;
    position:relative;
    overflow:hidden;
  }
  .pkb-bs-hero::before,
  .pkb-bs-hero::after{
    content:'';
    position:absolute;
    border-radius:50%;
  }
  .pkb-bs-hero::before{
    width:180px;height:180px;
    background:var(--yellow);
    opacity:0.35;
    top:60px;left:8%;
  }
  .pkb-bs-hero::after{
    width:120px;height:120px;
    background:var(--coral);
    opacity:0.25;
    bottom:80px;right:10%;
  }
  .pkb-bs-hero-inner{
    max-width:760px;
    margin:0 auto;
    position:relative;
    z-index:2;
  }
  .pkb-bs-eyebrow{
    display:inline-block;
    font-family:'Fredoka',sans-serif;
    font-size:14px;
    letter-spacing:0.3em;
    color:var(--teal-deep);
    margin-bottom:32px;
    padding:8px 22px;
    background:#fff;
    border-radius:30px;
    box-shadow:0 4px 12px rgba(0,106,91,0.12);
  }
  .pkb-bs-h1{
    font-size:54px;
    font-weight:800;
    line-height:1.5;
    letter-spacing:-0.01em;
    color:var(--ink);
    margin-bottom:32px;
  }
  .pkb-bs-h1 .pkb-highlight{
    background:linear-gradient(transparent 62%,var(--yellow) 62%);
    padding:0 6px;
  }
  .pkb-bs-hero-lead{
    font-size:17px;
    line-height:2.1;
    color:var(--ink-soft);
    font-weight:400;
    max-width:560px;
    margin:0 auto;
  }
  .pkb-bs-hero-deco,
  .pkb-bs-closing-deco{
    display:flex;
    justify-content:center;
    gap:10px;
    margin-top:48px;
  }
  .pkb-bs-dot{
    display:block;
    width:8px;height:8px;
    border-radius:50%;
    background:var(--coral);
  }
  .pkb-bs-dot:nth-child(2){background:var(--yellow);}
  .pkb-bs-dot:nth-child(3){background:var(--teal);}

  /* ==================== CHAPTER common ==================== */
  .pkb-bs-chapter-inner{
    max-width:720px;
    margin:0 auto;
  }
  .pkb-bs-chapter-marker{
    display:flex;
    align-items:center;
    gap:14px;
    margin-bottom:36px;
  }
  .pkb-bs-chapter-no{
    font-family:'Fredoka',sans-serif;
    font-size:14px;
    font-weight:600;
    color:var(--coral);
    letter-spacing:0.15em;
  }
  .pkb-bs-chapter-label{
    font-family:'Fredoka',sans-serif;
    font-size:13px;
    letter-spacing:0.25em;
    color:var(--ink-soft);
    padding-left:16px;
    border-left:2px solid var(--line);
  }
  .pkb-bs-h2{
    font-size:38px;
    font-weight:800;
    line-height:1.6;
    letter-spacing:-0.01em;
    color:var(--ink);
    margin-bottom:48px;
  }
  .pkb-bs-h2 .pkb-highlight{
    background:linear-gradient(transparent 62%,var(--yellow) 62%);
    padding:0 4px;
  }

  /* 本文 */
  .pkb-bs-body p{
    font-size:17px;
    line-height:2.05;
    color:var(--ink);
    margin-bottom:28px;
    font-weight:400;
  }
  .pkb-bs-body p:last-child{margin-bottom:0;}
  .pkb-bs-emphasis{
    font-size:18px !important;
    font-weight:700 !important;
    color:var(--teal-deep) !important;
    padding:24px 28px;
    background:var(--teal-soft);
    border-radius:14px;
    line-height:1.85 !important;
  }

  /* Chapter 01 — Philosophy */
  .pkb-bs-chapter--01{background:#fff;}
  .pkb-bs-signature{
    text-align:right;
    margin-top:32px;
    font-family:'Fredoka',sans-serif;
    font-style:italic;
    font-size:15px;
    color:var(--ink-soft);
  }

  /* Chapter 02 — Mission */
  .pkb-bs-chapter--02{
    background:var(--cream);
    position:relative;
    overflow:hidden;
  }
  .pkb-bs-chapter--02::before{
    content:'';
    position:absolute;
    width:240px;height:240px;
    background:var(--pink-soft);
    border-radius:50%;
    top:-80px;right:-80px;
    opacity:0.7;
    z-index:0;
  }
  .pkb-bs-chapter--02 .pkb-bs-chapter-inner{position:relative;z-index:2;}
  .pkb-bs-quote{
    margin:36px 0;
    padding:36px 40px;
    background:#fff;
    border-radius:20px;
    border-left:6px solid var(--coral);
    font-size:22px !important;
    font-weight:800;
    line-height:1.85;
    color:var(--ink);
    position:relative;
  }
  .pkb-bs-quote::before{
    content:'"';
    position:absolute;
    top:-12px;left:24px;
    font-family:'Fredoka',sans-serif;
    font-size:80px;
    color:var(--coral);
    line-height:1;
    opacity:0.5;
  }

  /* Chapter 03 — Expertise */
  .pkb-bs-chapter--03{background:#fff;}
  .pkb-bs-credentials{
    display:grid;
    grid-template-columns:repeat(2,1fr);
    gap:20px;
    margin-top:48px;
  }
  .pkb-bs-credential{
    background:var(--cream);
    border-radius:20px;
    padding:32px 28px;
    border:2px solid var(--line);
    transition:transform 0.3s,border-color 0.3s;
  }
  .pkb-bs-credential:hover{
    transform:translateY(-4px);
    border-color:var(--teal-soft);
  }
  .pkb-bs-credential-num{
    font-family:'Fredoka',sans-serif;
    font-size:32px;
    font-weight:600;
    color:var(--coral);
    line-height:1;
    margin-bottom:14px;
  }
  .pkb-bs-credential h3{
    font-size:17px;
    font-weight:800;
    color:var(--ink);
    margin-bottom:10px;
    line-height:1.5;
  }
  .pkb-bs-credential p{
    font-size:14px;
    color:var(--ink-soft);
    line-height:1.85;
    margin:0;
  }

  /* Chapter 04 — Supervisor */
  .pkb-bs-chapter--04{
    background:var(--cream);
    position:relative;
    overflow:hidden;
  }
  .pkb-bs-chapter--04::before{
    content:'';
    position:absolute;
    width:200px;height:200px;
    background:var(--yellow);
    border-radius:50%;
    bottom:-60px;left:-60px;
    opacity:0.3;
    z-index:0;
  }
  .pkb-bs-chapter--04 .pkb-bs-chapter-inner{position:relative;z-index:2;}

  .pkb-bs-supervisor{
    background:#fff;
    border-radius:32px;
    padding:48px;
    margin-top:48px;
    display:grid;
    grid-template-columns:200px 1fr;
    gap:48px;
    align-items:flex-start;
    border:3px solid var(--teal-soft);
  }
  .pkb-bs-supervisor-photo{
    position:relative;
  }
  .pkb-bs-supervisor-photo-placeholder{
    aspect-ratio:1/1.15;
    background:linear-gradient(135deg,var(--teal-soft),var(--mint));
    border-radius:20px;
    display:flex;
    align-items:center;
    justify-content:center;
    text-align:center;
    color:var(--teal-deep);
    font-weight:800;
    font-size:14px;
    padding:12px;
    line-height:1.6;
    border:2px dashed var(--teal);
  }
  /* 実際の写真を入れる場合: 上記のプレースホルダーを以下に置き換え */
  /* <img src="先生写真URL" alt="小屋 美香 先生" class="pkb-bs-supervisor-img"> */
  .pkb-bs-supervisor-img{
    width:100%;
    aspect-ratio:1/1.15;
    object-fit:cover;
    border-radius:20px;
    display:block;
  }

  .pkb-bs-supervisor-role{
    display:inline-block;
    font-family:'Fredoka',sans-serif;
    font-size:12px;
    letter-spacing:0.25em;
    color:#fff;
    background:var(--teal);
    padding:5px 14px;
    border-radius:20px;
    margin-bottom:14px;
  }
  .pkb-bs-supervisor-title{
    font-size:13px;
    color:var(--ink-soft);
    font-weight:700;
    margin-bottom:8px;
  }
  .pkb-bs-supervisor-name{
    font-size:30px;
    font-weight:800;
    color:var(--ink);
    margin-bottom:24px;
    line-height:1.3;
  }
  .pkb-bs-supervisor-name-en{
    font-size:14px;
    font-weight:400;
    color:var(--ink-soft);
    margin-left:8px;
  }
  .pkb-bs-supervisor-text p{
    font-size:15px;
    line-height:2;
    color:var(--ink);
    margin-bottom:18px;
  }
  .pkb-bs-supervisor-text p:last-child{margin-bottom:0;}
  .pkb-bs-supervisor-text strong{
    color:var(--teal-deep);
    font-weight:800;
  }

  .pkb-bs-supervisor-tags{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    gap:8px;
    margin-top:28px;
    padding-top:24px;
    border-top:2px dashed var(--line);
  }
  .pkb-bs-tag-label{
    font-size:12px;
    font-weight:800;
    color:var(--ink-soft);
    margin-right:6px;
  }
  .pkb-bs-tag{
    font-size:12px;
    font-weight:700;
    color:var(--teal-deep);
    background:var(--teal-soft);
    padding:5px 12px;
    border-radius:20px;
  }

  .pkb-bs-supervisor-creds{
    display:flex;
    flex-wrap:wrap;
    gap:14px;
    margin-top:24px;
  }
  .pkb-bs-cred-item{
    display:flex;
    align-items:center;
    gap:10px;
    background:var(--cream);
    padding:10px 16px;
    border-radius:14px;
  }
  .pkb-bs-cred-icon{
    width:32px;height:32px;
    background:var(--yellow);
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
  }
  .pkb-bs-cred-icon svg{
    width:16px;height:16px;
    stroke:var(--ink);
  }
  .pkb-bs-cred-item span{
    font-size:13px;
    font-weight:800;
    color:var(--ink);
  }

  /* ==================== CLOSING ==================== */
  .pkb-bs-closing{
    background:linear-gradient(180deg,#fff 0%,var(--teal-soft) 100%);
    text-align:center;
    position:relative;
    overflow:hidden;
  }
  .pkb-bs-closing-inner{
    max-width:720px;
    margin:0 auto;
    position:relative;
    z-index:2;
  }
  .pkb-bs-closing-h2{
    font-size:38px;
    font-weight:800;
    line-height:1.6;
    color:var(--ink);
    margin:32px 0 24px;
    letter-spacing:-0.01em;
  }
  .pkb-bs-closing-h2 .pkb-highlight{
    background:linear-gradient(transparent 62%,var(--yellow) 62%);
    padding:0 4px;
  }
  .pkb-bs-closing-lead{
    font-size:16px;
    line-height:2;
    color:var(--ink-soft);
    margin-bottom:48px;
  }

  /* ==================== Responsive Tablet ==================== */
  @media (max-width:1024px){
    .pkb-root .pkb-bs-hero,
    .pkb-root .pkb-bs-chapter,
    .pkb-root .pkb-bs-closing{padding:80px 24px;}
    .pkb-bs-h1{font-size:42px;}
    .pkb-bs-h2{font-size:30px;}
    .pkb-bs-closing-h2{font-size:30px;}
    .pkb-bs-supervisor{
      grid-template-columns:160px 1fr;
      gap:32px;
      padding:36px;
    }
    .pkb-bs-supervisor-name{font-size:26px;}
  }

  /* ==================== Responsive Smartphone ==================== */
  @media (max-width:768px){
    .pkb-root .pkb-bs-hero,
    .pkb-root .pkb-bs-chapter,
    .pkb-root .pkb-bs-closing{padding:64px 20px;}

    .pkb-bs-eyebrow{font-size:12px;padding:6px 18px;margin-bottom:24px;}
    .pkb-bs-h1{
      font-size:30px;
      line-height:1.6;
      margin-bottom:24px;
    }
    .pkb-bs-hero-lead{font-size:14px;line-height:2;}
    .pkb-bs-hero-deco,.pkb-bs-closing-deco{margin-top:36px;}
    .pkb-bs-hero::before{width:120px;height:120px;top:30px;left:-30px;}
    .pkb-bs-hero::after{width:80px;height:80px;bottom:40px;right:-20px;}

    .pkb-bs-chapter-marker{margin-bottom:24px;gap:10px;}
    .pkb-bs-chapter-no{font-size:12px;}
    .pkb-bs-chapter-label{font-size:11px;padding-left:10px;}
    .pkb-bs-h2{
      font-size:24px;
      line-height:1.65;
      margin-bottom:32px;
    }

    .pkb-bs-body p{font-size:15px;line-height:2;margin-bottom:22px;}
    .pkb-bs-emphasis{
      font-size:15px !important;
      padding:20px 22px;
      line-height:1.85 !important;
    }
    .pkb-bs-quote{
      padding:28px 24px 24px;
      font-size:17px !important;
      line-height:1.85;
      margin:28px 0;
    }
    .pkb-bs-quote::before{font-size:60px;top:-6px;left:18px;}
    .pkb-bs-signature{font-size:13px;margin-top:24px;}

    /* Credentials 2列→1列 */
    .pkb-bs-credentials{
      grid-template-columns:1fr;
      gap:14px;
      margin-top:32px;
    }
    .pkb-bs-credential{padding:24px 22px;}
    .pkb-bs-credential h3{font-size:16px;}
    .pkb-bs-credential p{font-size:13px;}

    /* Supervisor 縦並び */
    .pkb-bs-supervisor{
      grid-template-columns:1fr;
      gap:24px;
      padding:28px 22px;
      margin-top:32px;
      border-radius:24px;
      text-align:center;
    }
    .pkb-bs-supervisor-photo{max-width:200px;margin:0 auto;width:100%;}
    .pkb-bs-supervisor-role{margin-bottom:12px;}
    .pkb-bs-supervisor-title{font-size:12px;}
    .pkb-bs-supervisor-name{font-size:24px;margin-bottom:20px;}
    .pkb-bs-supervisor-name-en{display:block;margin-left:0;margin-top:4px;font-size:13px;}
    .pkb-bs-supervisor-text{text-align:left;}
    .pkb-bs-supervisor-text p{font-size:14px;line-height:1.95;}
    .pkb-bs-supervisor-tags{
      justify-content:center;
      margin-top:24px;
      padding-top:20px;
    }
    .pkb-bs-supervisor-creds{
      justify-content:center;
      gap:10px;
    }
    .pkb-bs-cred-item{padding:8px 12px;}
    .pkb-bs-cred-item span{font-size:12px;}

    .pkb-bs-closing-h2{
      font-size:24px;
      line-height:1.65;
      margin:24px 0 20px;
    }
    .pkb-bs-closing-lead{font-size:14px;margin-bottom:32px;}
  }

  @media (max-width:380px){
    .pkb-bs-h1{font-size:26px;}
    .pkb-bs-h2{font-size:21px;}
    .pkb-bs-closing-h2{font-size:21px;}
    .pkb-bs-supervisor-name{font-size:21px;}
    .pkb-bs-quote{font-size:15px !important;}
  }
